[fields] Support format without separator

packages/x-date-pickers/src/AdapterLuxon/AdapterLuxon.ts

@@ -214,6 +214,10 @@ export class AdapterLuxon implements MuiPickersAdapter<DateTime, string> {
     // Extract escaped section to avoid extending them
     const catchEscapedSectionsRegexp = /''|'(''|[^'])+('|$)|[^']*/g;
 
+    // This RegExp tests if a string is only mad of supported tokens
+    const validTokens = [...Object.keys(this.formatTokenMap), 'yyyyy'];
+    const isTokenStartRegExpStr = new RegExp(`(${validTokens.join('|')})*`);
+
     // Extract words to test if they are a token or a word to escape.
     const catchWordsRegexp = /(?:^|[^a-z])([a-z]+)(?:[^a-z]|$)|([a-z]+)/gi;
     return (
@@ -225,12 +229,14 @@ export class AdapterLuxon implements MuiPickersAdapter<DateTime, string> {
             return token;
           }
           const expandedToken = DateTime.expandFormat(token, { locale: this.locale });
-          return expandedToken.replace(catchWordsRegexp, (correspondance, g1, g2) => {
+
+          return expandedToken.replace(catchWordsRegexp, (substring, g1, g2) => {
             const word = g1 || g2; // words are either in group 1 or group 2
-            if (word === 'yyyyy' || formatTokenMap[word] !== undefined) {
-              return correspondance;
+
+            if (isTokenStartRegExpStr.test(word)) {
+              return substring;
             }
-            return `'${correspondance}'`;
+            return `'${substring}'`;
           });
         })
         .join('')

packages/x-date-pickers/src/DateField/tests/format.DateField.test.tsx

@@ -7,7 +7,7 @@ import {
 } from 'test/utils/pickers';
 import { DateField } from '@mui/x-date-pickers/DateField';
 
-describeAdapters('<DateField /> - Format', DateField, ({ adapter, renderWithProps }) => {
+describeAdapters.only('<DateField /> - Format', DateField, ({ adapter, renderWithProps }) => {
   it('should support escaped characters in start separator', () => {
     const { start: startChar, end: endChar } = adapter.escapedCharacters;
 
@@ -160,6 +160,15 @@ describeAdapters('<DateField /> - Format', DateField, ({ adapter, renderWithProp
     expectFieldPlaceholderV6(input, 'Escaped Escaped');
   });
 
+  it('should support format without separators', () => {
+    const v7Response = renderWithProps({
+      enableAccessibleFieldDOMStructure: true,
+      format: `${adapter.formats.dayOfMonth}${adapter.formats.monthShort}`,
+    });
+
+    expectFieldValueV7(v7Response.getSectionsContainer(), 'DDMMMM');
+  });
+
   it('should add spaces around `/` when `formatDensity = "spacious"`', () => {
     // Test with v7 input
     const v7Response = renderWithProps({

packages/x-date-pickers/src/internals/hooks/useField/buildSectionsFromFormat.ts

@@ -202,56 +202,48 @@ const buildSections = <TDate extends PickerValidDate>(
   const sections: FieldSection[] = [];
   let startSeparator: string = '';
 
-  // This RegExp test if the beginning of a string corresponds to a supported token
-  const isTokenStartRegExp = new RegExp(
-    `^(${Object.keys(utils.formatTokenMap)
-      .sort((a, b) => b.length - a.length) // Sort to put longest word first
-      .join('|')})`,
-    'g', // used to get access to lastIndex state
-  );
+  // This RegExp tests if the beginning of a string corresponds to a supported token
+  const isTokenStartRegExpStr = `^(${Object.keys(utils.formatTokenMap)
+    .sort((a, b) => b.length - a.length) // Sort to put longest word first
+    .join('|')})`;
+
+  const getEscapedPartOfCurrentChar = (i: number) =>
+    escapedParts.find((escapeIndex) => escapeIndex.start <= i && escapeIndex.end >= i);
 
-  let currentTokenValue = '';
+  let i = 0;
+  while (i < expandedFormat.length) {
+    const escapedPartOfCurrentChar = getEscapedPartOfCurrentChar(i);
 
-  for (let i = 0; i < expandedFormat.length; i += 1) {
-    const escapedPartOfCurrentChar = escapedParts.find(
-      (escapeIndex) => escapeIndex.start <= i && escapeIndex.end >= i,
+    const isTokenStartRegExp = new RegExp(
+      isTokenStartRegExpStr,
+      'g', // used to get access to lastIndex state
     );
 
-    const char = expandedFormat[i];
     const isEscapedChar = escapedPartOfCurrentChar != null;
-    const potentialToken = `${currentTokenValue}${expandedFormat.slice(i)}`;
-    const regExpMatch = isTokenStartRegExp.test(potentialToken);
-
-    if (!isEscapedChar && char.match(/([A-Za-z]+)/) && regExpMatch) {
-      currentTokenValue = potentialToken.slice(0, isTokenStartRegExp.lastIndex);
-      i += isTokenStartRegExp.lastIndex - 1;
+    if (!isEscapedChar && isTokenStartRegExp.test(expandedFormat.slice(i))) {
+      const currentTokenValue = expandedFormat.slice(i, i + isTokenStartRegExp.lastIndex);
+      sections.push(createSection({ ...params, now, token: currentTokenValue, startSeparator }));
+      i += isTokenStartRegExp.lastIndex;
     } else {
+      const char = expandedFormat[i];
+
       // If we are on the opening or closing character of an escaped part of the format,
       // Then we ignore this character.
       const isEscapeBoundary =
         (isEscapedChar && escapedPartOfCurrentChar?.start === i) ||
         escapedPartOfCurrentChar?.end === i;
 
       if (!isEscapeBoundary) {
-        if (currentTokenValue !== '') {
-          sections.push(
-            createSection({ ...params, now, token: currentTokenValue, startSeparator }),
-          );
-          currentTokenValue = '';
-        }
-
         if (sections.length === 0) {
           startSeparator += char;
         } else {
           startSeparator = '';
           sections[sections.length - 1].endSeparator += char;
         }
       }
-    }
-  }
 
-  if (currentTokenValue !== '') {
-    sections.push(createSection({ ...params, now, token: currentTokenValue, startSeparator }));
+      i += 1;
+    }
   }
 
   if (sections.length === 0 && startSeparator.length > 0) {