@progress/kendo-theme-fluent 12.1.0-dev.3 → 12.1.0-dev.5

package/dist/meta/variables.json

@@ -333,6 +333,159 @@
             "15": "#5e2036"
         }
     },
+    "default-colors": {
+        "type": "Map",
+        "value": "(app-surface: #fafafa, on-app-surface: #242424, subtle: #707070, surface: #ffffff, surface-alt: #ffffff, border: rgba(36, 36, 36, 0.72), border-alt: #000000, base-subtle: #f5f5f5, base-subtle-hover: #ebebeb, base-subtle-active: #e0e0e0, base: #ffffff, base-hover: #f5f5f5, base-active: #ebebeb, base-emphasis: #d1d1d1, base-on-subtle: #242424, on-base: #242424, base-on-surface: #242424, primary-subtle: #ebf3fc, primary-subtle-hover: #cfe4fa, primary-subtle-active: #96c6fa, primary: #0f6cbd, primary-hover: #115ea3, primary-active: #0f548c, primary-emphasis: #abd1f8, primary-on-subtle: #0a2e4a, on-primary: #ffffff, primary-on-surface: #0f6cbd, secondary-subtle: #f0f0f0, secondary-subtle-hover: #fafafa, secondary-subtle-active: #ffffff, secondary: #ebebeb, secondary-hover: #f5f5f5, secondary-active: #fafafa, secondary-emphasis: #e0e0e0, secondary-on-subtle: #616161, on-secondary: #616161, secondary-on-surface: #616161, tertiary-subtle: #fdf5fc, tertiary-subtle-hover: #f5daf2, tertiary-subtle-active: #edbbe7, tertiary: #c239b3, tertiary-hover: #af33a1, tertiary-active: #962c8a, tertiary-emphasis: #edbbe7, tertiary-on-subtle: #af33a1, on-tertiary: #ffffff, tertiary-on-surface: #c239b3, info-subtle: #f6fafe, info-subtle-hover: #dcedfa, info-subtle-active: #bfddf5, info: #3a96dd, info-hover: #3991d5, info-active: #4fa1e1, info-emphasis: #bfddf5, info-on-subtle: #20547c, on-info: #242424, info-on-surface: #3487c7, success-subtle: #f1faf1, success-subtle-hover: #c9eac9, success-subtle-active: #9fd89f, success: #107c10, success-hover: #0e700e, success-active: #0c5e0c, success-emphasis: #9fd89f, success-on-subtle: #0e700e, on-success: #ffffff, success-on-surface: #107c10, warning-subtle: #fff9f5, warning-subtle-hover: #fee5d7, warning-subtle-active: #fdcfb4, warning: #f7630c, warning-hover: #de590b, warning-active: #bc4b09, warning-emphasis: #fdcfb4, warning-on-subtle: #8a3707, on-warning: #242424, warning-on-surface: #8a3707, error-subtle: #fdf3f4, error-subtle-hover: #f6d1d5, error-subtle-active: #eeacb2, error: #c50f1f, error-hover: #b10e1c, error-active: #960b18, error-emphasis: #eeacb2, error-on-subtle: #b10e1c, on-error: #ffffff, error-on-surface: #c50f1f, light-subtle: #ffffff, light-subtle-hover: #f5f5f5, light-subtle-active: #ebebeb, light: #ebebeb, light-hover: #f5f5f5, light-active: #f0f0f0, light-emphasis: #e0e0e0, light-on-subtle: #616161, on-light: #242424, light-on-surface: #ffffff, dark-subtle: #000000, dark-subtle-hover: #242424, dark-subtle-active: #333333, dark: #242424, dark-hover: #424242, dark-active: #333333, dark-emphasis: #616161, dark-on-subtle: #ffffff, on-dark: #ffffff, dark-on-surface: #616161, inverse-subtle: #616161, inverse-subtle-hover: #8a8a8a, inverse-subtle-active: #707070, inverse: #242424, inverse-hover: #424242, inverse-active: #333333, inverse-emphasis: #707070, inverse-on-subtle: #ffffff, on-inverse: #ffffff, inverse-on-surface: #616161, series-a: #2aa0a4, series-a-bold: #20787b, series-a-bolder: #155052, series-a-subtle: #5fb8bb, series-a-subtler: #94cfd1, series-b: #ae8c00, series-b-bold: #826900, series-b-bolder: #574600, series-b-subtle: #c2a940, series-b-subtler: #d7c580, series-c: #e3008c, series-c-bold: #aa0069, series-c-bolder: #720046, series-c-subtle: #ea40a9, series-c-subtler: #f180c5, series-d: #13a10e, series-d-bold: #0e790b, series-d-bolder: #0a5107, series-d-subtle: #4eb94a, series-d-subtler: #89d086, series-e: #637cef, series-e-bold: #4a5db3, series-e-bolder: #323e78, series-e-subtle: #c3b1db, series-e-subtler: #a58bca, series-f: #CA5010, series-f-bold: #973C0C, series-f-bolder: #652808, series-f-subtle: #D77C4C, series-f-subtler: #E5A787)",
+        "prettyValue": {
+            "app-surface": "#fafafa",
+            "on-app-surface": "#242424",
+            "subtle": "#707070",
+            "surface": "#ffffff",
+            "surface-alt": "#ffffff",
+            "border": "rgba(36, 36, 36, 0.72)",
+            "border-alt": "#000000",
+            "base-subtle": "#f5f5f5",
+            "base-subtle-hover": "#ebebeb",
+            "base-subtle-active": "#e0e0e0",
+            "base": "#ffffff",
+            "base-hover": "#f5f5f5",
+            "base-active": "#ebebeb",
+            "base-emphasis": "#d1d1d1",
+            "base-on-subtle": "#242424",
+            "on-base": "#242424",
+            "base-on-surface": "#242424",
+            "primary-subtle": "#ebf3fc",
+            "primary-subtle-hover": "#cfe4fa",
+            "primary-subtle-active": "#96c6fa",
+            "primary": "#0f6cbd",
+            "primary-hover": "#115ea3",
+            "primary-active": "#0f548c",
+            "primary-emphasis": "#abd1f8",
+            "primary-on-subtle": "#0a2e4a",
+            "on-primary": "#ffffff",
+            "primary-on-surface": "#0f6cbd",
+            "secondary-subtle": "#f0f0f0",
+            "secondary-subtle-hover": "#fafafa",
+            "secondary-subtle-active": "#ffffff",
+            "secondary": "#ebebeb",
+            "secondary-hover": "#f5f5f5",
+            "secondary-active": "#fafafa",
+            "secondary-emphasis": "#e0e0e0",
+            "secondary-on-subtle": "#616161",
+            "on-secondary": "#616161",
+            "secondary-on-surface": "#616161",
+            "tertiary-subtle": "#fdf5fc",
+            "tertiary-subtle-hover": "#f5daf2",
+            "tertiary-subtle-active": "#edbbe7",
+            "tertiary": "#c239b3",
+            "tertiary-hover": "#af33a1",
+            "tertiary-active": "#962c8a",
+            "tertiary-emphasis": "#edbbe7",
+            "tertiary-on-subtle": "#af33a1",
+            "on-tertiary": "#ffffff",
+            "tertiary-on-surface": "#c239b3",
+            "info-subtle": "#f6fafe",
+            "info-subtle-hover": "#dcedfa",
+            "info-subtle-active": "#bfddf5",
+            "info": "#3a96dd",
+            "info-hover": "#3991d5",
+            "info-active": "#4fa1e1",
+            "info-emphasis": "#bfddf5",
+            "info-on-subtle": "#20547c",
+            "on-info": "#242424",
+            "info-on-surface": "#3487c7",
+            "success-subtle": "#f1faf1",
+            "success-subtle-hover": "#c9eac9",
+            "success-subtle-active": "#9fd89f",
+            "success": "#107c10",
+            "success-hover": "#0e700e",
+            "success-active": "#0c5e0c",
+            "success-emphasis": "#9fd89f",
+            "success-on-subtle": "#0e700e",
+            "on-success": "#ffffff",
+            "success-on-surface": "#107c10",
+            "warning-subtle": "#fff9f5",
+            "warning-subtle-hover": "#fee5d7",
+            "warning-subtle-active": "#fdcfb4",
+            "warning": "#f7630c",
+            "warning-hover": "#de590b",
+            "warning-active": "#bc4b09",
+            "warning-emphasis": "#fdcfb4",
+            "warning-on-subtle": "#8a3707",
+            "on-warning": "#242424",
+            "warning-on-surface": "#8a3707",
+            "error-subtle": "#fdf3f4",
+            "error-subtle-hover": "#f6d1d5",
+            "error-subtle-active": "#eeacb2",
+            "error": "#c50f1f",
+            "error-hover": "#b10e1c",
+            "error-active": "#960b18",
+            "error-emphasis": "#eeacb2",
+            "error-on-subtle": "#b10e1c",
+            "on-error": "#ffffff",
+            "error-on-surface": "#c50f1f",
+            "light-subtle": "#ffffff",
+            "light-subtle-hover": "#f5f5f5",
+            "light-subtle-active": "#ebebeb",
+            "light": "#ebebeb",
+            "light-hover": "#f5f5f5",
+            "light-active": "#f0f0f0",
+            "light-emphasis": "#e0e0e0",
+            "light-on-subtle": "#616161",
+            "on-light": "#242424",
+            "light-on-surface": "#ffffff",
+            "dark-subtle": "#000000",
+            "dark-subtle-hover": "#242424",
+            "dark-subtle-active": "#333333",
+            "dark": "#242424",
+            "dark-hover": "#424242",
+            "dark-active": "#333333",
+            "dark-emphasis": "#616161",
+            "dark-on-subtle": "#ffffff",
+            "on-dark": "#ffffff",
+            "dark-on-surface": "#616161",
+            "inverse-subtle": "#616161",
+            "inverse-subtle-hover": "#8a8a8a",
+            "inverse-subtle-active": "#707070",
+            "inverse": "#242424",
+            "inverse-hover": "#424242",
+            "inverse-active": "#333333",
+            "inverse-emphasis": "#707070",
+            "inverse-on-subtle": "#ffffff",
+            "on-inverse": "#ffffff",
+            "inverse-on-surface": "#616161",
+            "series-a": "#2aa0a4",
+            "series-a-bold": "#20787b",
+            "series-a-bolder": "#155052",
+            "series-a-subtle": "#5fb8bb",
+            "series-a-subtler": "#94cfd1",
+            "series-b": "#ae8c00",
+            "series-b-bold": "#826900",
+            "series-b-bolder": "#574600",
+            "series-b-subtle": "#c2a940",
+            "series-b-subtler": "#d7c580",
+            "series-c": "#e3008c",
+            "series-c-bold": "#aa0069",
+            "series-c-bolder": "#720046",
+            "series-c-subtle": "#ea40a9",
+            "series-c-subtler": "#f180c5",
+            "series-d": "#13a10e",
+            "series-d-bold": "#0e790b",
+            "series-d-bolder": "#0a5107",
+            "series-d-subtle": "#4eb94a",
+            "series-d-subtler": "#89d086",
+            "series-e": "#637cef",
+            "series-e-bold": "#4a5db3",
+            "series-e-bolder": "#323e78",
+            "series-e-subtle": "#c3b1db",
+            "series-e-subtler": "#a58bca",
+            "series-f": "#CA5010",
+            "series-f-bold": "#973C0C",
+            "series-f-bolder": "#652808",
+            "series-f-subtle": "#D77C4C",
+            "series-f-subtler": "#E5A787"
+        }
+    },
     "kendo-colors": {
         "type": "Map",
         "value": "(app-surface: #fafafa, on-app-surface: #242424, subtle: #707070, surface: #ffffff, surface-alt: #ffffff, border: rgba(36, 36, 36, 0.72), border-alt: #000000, base-subtle: #f5f5f5, base-subtle-hover: #ebebeb, base-subtle-active: #e0e0e0, base: #ffffff, base-hover: #f5f5f5, base-active: #ebebeb, base-emphasis: #d1d1d1, base-on-subtle: #242424, on-base: #242424, base-on-surface: #242424, primary-subtle: #ebf3fc, primary-subtle-hover: #cfe4fa, primary-subtle-active: #96c6fa, primary: #0f6cbd, primary-hover: #115ea3, primary-active: #0f548c, primary-emphasis: #abd1f8, primary-on-subtle: #0a2e4a, on-primary: #ffffff, primary-on-surface: #0f6cbd, secondary-subtle: #f0f0f0, secondary-subtle-hover: #fafafa, secondary-subtle-active: #ffffff, secondary: #ebebeb, secondary-hover: #f5f5f5, secondary-active: #fafafa, secondary-emphasis: #e0e0e0, secondary-on-subtle: #616161, on-secondary: #616161, secondary-on-surface: #616161, tertiary-subtle: #fdf5fc, tertiary-subtle-hover: #f5daf2, tertiary-subtle-active: #edbbe7, tertiary: #c239b3, tertiary-hover: #af33a1, tertiary-active: #962c8a, tertiary-emphasis: #edbbe7, tertiary-on-subtle: #af33a1, on-tertiary: #ffffff, tertiary-on-surface: #c239b3, info-subtle: #f6fafe, info-subtle-hover: #dcedfa, info-subtle-active: #bfddf5, info: #3a96dd, info-hover: #3991d5, info-active: #4fa1e1, info-emphasis: #bfddf5, info-on-subtle: #20547c, on-info: #242424, info-on-surface: #3487c7, success-subtle: #f1faf1, success-subtle-hover: #c9eac9, success-subtle-active: #9fd89f, success: #107c10, success-hover: #0e700e, success-active: #0c5e0c, success-emphasis: #9fd89f, success-on-subtle: #0e700e, on-success: #ffffff, success-on-surface: #107c10, warning-subtle: #fff9f5, warning-subtle-hover: #fee5d7, warning-subtle-active: #fdcfb4, warning: #f7630c, warning-hover: #de590b, warning-active: #bc4b09, warning-emphasis: #fdcfb4, warning-on-subtle: #8a3707, on-warning: #242424, warning-on-surface: #8a3707, error-subtle: #fdf3f4, error-subtle-hover: #f6d1d5, error-subtle-active: #eeacb2, error: #c50f1f, error-hover: #b10e1c, error-active: #960b18, error-emphasis: #eeacb2, error-on-subtle: #b10e1c, on-error: #ffffff, error-on-surface: #c50f1f, light-subtle: #ffffff, light-subtle-hover: #f5f5f5, light-subtle-active: #ebebeb, light: #ebebeb, light-hover: #f5f5f5, light-active: #f0f0f0, light-emphasis: #e0e0e0, light-on-subtle: #616161, on-light: #242424, light-on-surface: #ffffff, dark-subtle: #000000, dark-subtle-hover: #242424, dark-subtle-active: #333333, dark: #242424, dark-hover: #424242, dark-active: #333333, dark-emphasis: #616161, dark-on-subtle: #ffffff, on-dark: #ffffff, dark-on-surface: #616161, inverse-subtle: #616161, inverse-subtle-hover: #8a8a8a, inverse-subtle-active: #707070, inverse: #242424, inverse-hover: #424242, inverse-active: #333333, inverse-emphasis: #707070, inverse-on-subtle: #ffffff, on-inverse: #ffffff, inverse-on-surface: #616161, series-a: #2aa0a4, series-a-bold: #20787b, series-a-bolder: #155052, series-a-subtle: #5fb8bb, series-a-subtler: #94cfd1, series-b: #ae8c00, series-b-bold: #826900, series-b-bolder: #574600, series-b-subtle: #c2a940, series-b-subtler: #d7c580, series-c: #e3008c, series-c-bold: #aa0069, series-c-bolder: #720046, series-c-subtle: #ea40a9, series-c-subtler: #f180c5, series-d: #13a10e, series-d-bold: #0e790b, series-d-bolder: #0a5107, series-d-subtle: #4eb94a, series-d-subtler: #89d086, series-e: #637cef, series-e-bold: #4a5db3, series-e-bolder: #323e78, series-e-subtle: #c3b1db, series-e-subtler: #a58bca, series-f: #CA5010, series-f-bold: #973C0C, series-f-bolder: #652808, series-f-subtle: #D77C4C, series-f-subtler: #E5A787)",
@@ -522,6 +675,52 @@
         "type": "Number",
         "value": "17px"
     },
+    "default-spacing": {
+        "type": "Map",
+        "value": "(0: 0px, 1px: 1px, 0.5: 0.125rem, 1: 0.25rem, 1.5: 0.375rem, 2: 0.5rem, 2.5: 0.625rem, 3: 0.75rem, 3.5: 0.875rem, 4: 1rem, 4.5: 1.125rem, 5: 1.25rem, 5.5: 1.375rem, 6: 1.5rem, 6.5: 1.625rem, 7: 1.75rem, 7.5: 1.875rem, 8: 2rem, 9: 2.25rem, 10: 2.5rem, 11: 2.75rem, 12: 3rem, 13: 3.25rem, 14: 3.5rem, 15: 3.75rem, 16: 4rem, 17: 4.25rem, 18: 4.5rem, 19: 4.75rem, 20: 5rem, 21: 5.25rem, 22: 5.5rem, 23: 5.75rem, 24: 6rem, 25: 7rem, 26: 8rem, 27: 9rem, 28: 10rem, 29: 11rem, 30: 12rem)",
+        "prettyValue": {
+            "0": "0px",
+            "1": "0.25rem",
+            "2": "0.5rem",
+            "3": "0.75rem",
+            "4": "1rem",
+            "5": "1.25rem",
+            "6": "1.5rem",
+            "7": "1.75rem",
+            "8": "2rem",
+            "9": "2.25rem",
+            "10": "2.5rem",
+            "11": "2.75rem",
+            "12": "3rem",
+            "13": "3.25rem",
+            "14": "3.5rem",
+            "15": "3.75rem",
+            "16": "4rem",
+            "17": "4.25rem",
+            "18": "4.5rem",
+            "19": "4.75rem",
+            "20": "5rem",
+            "21": "5.25rem",
+            "22": "5.5rem",
+            "23": "5.75rem",
+            "24": "6rem",
+            "25": "7rem",
+            "26": "8rem",
+            "27": "9rem",
+            "28": "10rem",
+            "29": "11rem",
+            "30": "12rem",
+            "1px": "1px",
+            "0.5": "0.125rem",
+            "1.5": "0.375rem",
+            "2.5": "0.625rem",
+            "3.5": "0.875rem",
+            "4.5": "1.125rem",
+            "5.5": "1.375rem",
+            "6.5": "1.625rem",
+            "7.5": "1.875rem"
+        }
+    },
     "kendo-spacing": {
         "type": "Map",
         "value": "(0: 0px, 1px: 1px, 0.5: 0.125rem, 1: 0.25rem, 1.5: 0.375rem, 2: 0.5rem, 2.5: 0.625rem, 3: 0.75rem, 3.5: 0.875rem, 4: 1rem, 4.5: 1.125rem, 5: 1.25rem, 5.5: 1.375rem, 6: 1.5rem, 6.5: 1.625rem, 7: 1.75rem, 7.5: 1.875rem, 8: 2rem, 9: 2.25rem, 10: 2.5rem, 11: 2.75rem, 12: 3rem, 13: 3.25rem, 14: 3.5rem, 15: 3.75rem, 16: 4rem, 17: 4.25rem, 18: 4.5rem, 19: 4.75rem, 20: 5rem, 21: 5.25rem, 22: 5.5rem, 23: 5.75rem, 24: 6rem, 25: 7rem, 26: 8rem, 27: 9rem, 28: 10rem, 29: 11rem, 30: 12rem)",
@@ -649,6 +848,21 @@
         "type": "String",
         "value": "k-"
     },
+    "default-elevation": {
+        "type": "Map",
+        "value": "(1: (0 0.3px 0.9px rgba(0, 0, 0, 0.1), 0 1.6px 3.6px rgba(0, 0, 0, 0.13)), 2: (0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 3: (0 2px 4px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 4: (0 4px 8px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 5: (0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 6: (0 14px 28.8px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)), 7: (0 20px 38px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)), 8: (0 32px 64px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)), 9: (0 32px 64px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)))",
+        "prettyValue": {
+            "1": "(0 0.3px 0.9px rgba(0, 0, 0, 0.1), 0 1.6px 3.6px rgba(0, 0, 0, 0.13))",
+            "2": "(0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12))",
+            "3": "(0 2px 4px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12))",
+            "4": "(0 4px 8px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12))",
+            "5": "(0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12))",
+            "6": "(0 14px 28.8px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2))",
+            "7": "(0 20px 38px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2))",
+            "8": "(0 32px 64px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2))",
+            "9": "(0 32px 64px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2))"
+        }
+    },
     "kendo-elevation": {
         "type": "Map",
         "value": "(1: (0 0.3px 0.9px rgba(0, 0, 0, 0.1), 0 1.6px 3.6px rgba(0, 0, 0, 0.13)), 2: (0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 3: (0 2px 4px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 4: (0 4px 8px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 5: (0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12)), 6: (0 14px 28.8px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)), 7: (0 20px 38px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)), 8: (0 32px 64px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)), 9: (0 32px 64px 0 rgba(0, 0, 0, 0.24), 0 0 8px 0 rgba(0, 0, 0, 0.2)))",
@@ -808,6 +1022,65 @@
         "type": "List",
         "value": "(\"Segoe UI\", -apple-system, BlinkMacSystemFont, Roboto, \"Helvetica Neue\", sans-serif)"
     },
+    "default-font-sizes": {
+        "type": "Map",
+        "value": "(xs: 0.625rem, sm: 0.75rem, md: 0.875rem, lg: 1rem, xl: 1.25rem)",
+        "prettyValue": {
+            "xs": "0.625rem",
+            "sm": "0.75rem",
+            "md": "0.875rem",
+            "lg": "1rem",
+            "xl": "1.25rem"
+        }
+    },
+    "default-line-heights": {
+        "type": "Map",
+        "value": "(xs: 1, sm: 1.25, md: 1.4285714285714286, lg: 1.33)",
+        "prettyValue": {
+            "xs": 1,
+            "sm": 1.25,
+            "md": 1.4285714285714286,
+            "lg": 1.33
+        }
+    },
+    "default-font-weights": {
+        "type": "Map",
+        "value": "(thin: 100, extra-light: 200, light: 300, normal: 400, medium: 500, semibold: 600, bold: 700, extra-bold: 800, \"black\": 900)",
+        "prettyValue": {
+            "thin": 100,
+            "extra-light": 200,
+            "light": 300,
+            "normal": 400,
+            "medium": 500,
+            "semibold": 600,
+            "bold": 700,
+            "extra-bold": 800,
+            "black": 900
+        }
+    },
+    "default-letter-spacings": {
+        "type": "Map",
+        "value": "(tightest: -0.15px, tighter: -0.1px, tight: -0.5px, normal: 0px, wide: 0.5px, wider: 0.1px, widest: 0.15px)",
+        "prettyValue": {
+            "tightest": "-0.15px",
+            "tighter": "-0.1px",
+            "tight": "-0.5px",
+            "normal": "0px",
+            "wide": "0.5px",
+            "wider": "0.1px",
+            "widest": "0.15px"
+        }
+    },
+    "default-font-families": {
+        "type": "Map",
+        "value": "(sans: (Arial, Verdana, Tahoma, \"Trebuchet MS\", Helvetica, Impact, Gill Sans), serif: (\"Times New Roman\", Georgia, Garamond, Palatino, Baskerville), sans-serif: (system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"), monospace: (SFMono-Regular, Menlo, Monaco, Consolas, \"Roboto Mono\", \"Ubuntu Mono\", \"Lucida Console\", \"Courier New\", monospace))",
+        "prettyValue": {
+            "sans": "(Arial, Verdana, Tahoma, \"Trebuchet MS\", Helvetica, Impact, Gill Sans)",
+            "serif": "(\"Times New Roman\", Georgia, Garamond, Palatino, Baskerville)",
+            "sans-serif": "(system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\")",
+            "monospace": "(SFMono-Regular, Menlo, Monaco, Consolas, \"Roboto Mono\", \"Ubuntu Mono\", \"Lucida Console\", \"Courier New\", monospace)"
+        }
+    },
     "kendo-font-sizes": {
         "type": "Map",
         "value": "(xs: 0.625rem, sm: 0.75rem, md: 0.875rem, lg: 1rem, xl: 1.25rem)",
@@ -903,6 +1176,21 @@
         "type": "Number",
         "value": "9999px"
     },
+    "default-border-radii": {
+        "type": "Map",
+        "value": "(none: 0px, xs: 1px, sm: 0.125rem, md: 0.25rem, lg: 0.375rem, xl: 0.5rem, xxl: 0.75rem, xxxl: 1rem, full: 9999px)",
+        "prettyValue": {
+            "none": "0px",
+            "xs": "1px",
+            "sm": "0.125rem",
+            "md": "0.25rem",
+            "lg": "0.375rem",
+            "xl": "0.5rem",
+            "xxl": "0.75rem",
+            "xxxl": "1rem",
+            "full": "9999px"
+        }
+    },
     "kendo-border-radii": {
         "type": "Map",
         "value": "(none: 0px, xs: 1px, sm: 0.125rem, md: 0.25rem, lg: 0.375rem, xl: 0.5rem, xxl: 0.75rem, xxxl: 1rem, full: 9999px)",
@@ -7894,6 +8182,33 @@
         "type": "Calculation",
         "value": "calc(calc(var(--kendo-calendar-cell-size, 32px) * 8) + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)"
     },
+    "kendo-datetime-sm-width": {
+        "type": "Calculation",
+        "value": "calc(var(--kendo-calendar-sm-cell-size, 24px) * 8 + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)"
+    },
+    "kendo-datetime-md-width": {
+        "type": "Calculation",
+        "value": "calc(calc(var(--kendo-calendar-cell-size, 32px) * 8) + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)"
+    },
+    "kendo-datetime-lg-width": {
+        "type": "Calculation",
+        "value": "calc(var(--kendo-calendar-lg-cell-size, 36px) * 8 + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)"
+    },
+    "kendo-datetime-sizes": {
+        "type": "Map",
+        "value": "(sm: (width: calc(var(--kendo-calendar-sm-cell-size, 24px) * 8 + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)), md: (width: calc(calc(var(--kendo-calendar-cell-size, 32px) * 8) + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)), lg: (width: calc(var(--kendo-calendar-lg-cell-size, 36px) * 8 + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)))",
+        "prettyValue": {
+            "sm": {
+                "width": "calc(var(--kendo-calendar-sm-cell-size, 24px) * 8 + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)"
+            },
+            "md": {
+                "width": "calc(calc(var(--kendo-calendar-cell-size, 32px) * 8) + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)"
+            },
+            "lg": {
+                "width": "calc(var(--kendo-calendar-lg-cell-size, 36px) * 8 + var(--kendo-infinite-calendar-view-padding-x, var(--kendo-spacing-3, 0.75rem)) * 2)"
+            }
+        }
+    },
     "kendo-daterange-picker-width": {
         "type": "String",
         "value": "var(--kendo-input-width, var(--kendo-input-width, 100%))"

package/lib/swatches/all.json

@@ -3,7 +3,7 @@
     "name": "All",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.3",
+    "version": "12.1.0-dev.5",
     "api": "modern",
     "previewColors": [
         "#ffffff",

package/lib/swatches/fluent-1-dark.json

@@ -3,7 +3,7 @@
     "name": "Fluent 1 Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.3",
+    "version": "12.1.0-dev.5",
     "previewColors": [
         "#1b1a19",
         "#21201f",

package/lib/swatches/fluent-1.json

@@ -3,7 +3,7 @@
     "name": "Fluent 1",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.3",
+    "version": "12.1.0-dev.5",
     "previewColors": [
         "#ffffff",
         "#faf9f8",

package/lib/swatches/fluent-main-dark.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.3",
+    "version": "12.1.0-dev.5",
     "previewColors": [
         "#1F1F1F",
         "#292929",

package/lib/swatches/fluent-main.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.3",
+    "version": "12.1.0-dev.5",
     "previewColors": [
         "#fafafa",
         "#ffffff",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-fluent",
   "description": "A css variables based theme for Kendo UI that follows the Fluent design system guidelines.",
-  "version": "12.1.0-dev.3",
+  "version": "12.1.0-dev.5",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -55,12 +55,12 @@
   },
   "dependencies": {
     "@progress/kendo-svg-icons": "^4.5.0",
-    "@progress/kendo-theme-core": "12.1.0-dev.3",
-    "@progress/kendo-theme-utils": "12.1.0-dev.3"
+    "@progress/kendo-theme-core": "12.1.0-dev.5",
+    "@progress/kendo-theme-utils": "12.1.0-dev.5"
   },
   "directories": {
     "doc": "docs",
     "lib": "lib"
   },
-  "gitHead": "71fe28c36a28e15bfd6c0934fa049a4933e9f184"
+  "gitHead": "c7571586f70cac80533d2678d2cdcd2e71fa7f16"
 }

package/scss/core/_index.scss

@@ -20,17 +20,17 @@
 
 @forward "@progress/kendo-theme-core/scss/index.scss" with (
     // Color System
-    $_default-colors: $kendo-colors,
+    $default-colors: $kendo-colors,
     $kendo-colors: $kendo-colors !default,
     // Elevation
-    $_default-elevation: $kendo-elevation,
+    $default-elevation: $kendo-elevation,
     $kendo-elevation: $kendo-elevation !default,
     // Typography
-    $_default-font-sizes: $kendo-font-sizes,
+    $default-font-sizes: $kendo-font-sizes,
     $kendo-font-sizes: $kendo-font-sizes !default,
     $kendo-font-size: $kendo-font-size !default,
 
-    $_default-line-heights: $kendo-line-heights,
+    $default-line-heights: $kendo-line-heights,
     $kendo-line-heights: $kendo-line-heights !default,
     $kendo-line-height: $kendo-line-height !default,
 
@@ -38,10 +38,10 @@
 
     $kendo-font-family: $kendo-font-family !default,
     // Spacing
-    $_default-spacing: $kendo-spacing,
+    $default-spacing: $kendo-spacing,
     $kendo-spacing: $kendo-spacing !default,
     // Radii
-    $_default-border-radii: $kendo-border-radii,
+    $default-border-radii: $kendo-border-radii,
     $kendo-border-radii: $kendo-border-radii !default,
     $kendo-transition: $kendo-transition !default,
 );

package/scss/datetimepicker/_variables.scss

@@ -1,7 +1,39 @@
 @use "../calendar/_variables.scss" as *;
 
+// DateTime
+
+/// The width of the DateTimePicker.
+/// @group date-time-picker
 $kendo-datetime-width: calc( #{$kendo-calendar-header-min-width} + calc( #{$kendo-infinite-calendar-view-padding-x} * 2 ) ) !default;
 
+/// The width of the small DateTimePicker.
+/// @group date-time-picker
+$kendo-datetime-sm-width: calc( calc( #{$kendo-calendar-sm-cell-size} * 8 ) + calc( #{$kendo-infinite-calendar-view-padding-x} * 2 )) !default;
+/// The width of the medium DateTimePicker.
+/// @group date-time-picker
+$kendo-datetime-md-width: $kendo-datetime-width !default;
+/// The width of the large DateTimePicker.
+/// @group date-time-picker
+$kendo-datetime-lg-width: calc( calc( #{$kendo-calendar-lg-cell-size} * 8 ) + calc( #{$kendo-infinite-calendar-view-padding-x} * 2 )) !default;
+
+/// The sizes map for the DateTimePicker.
+/// @group date-time-picker
+$kendo-datetime-sizes: (
+    sm: (
+        width: $kendo-datetime-sm-width
+    ),
+    md: (
+        width: $kendo-datetime-md-width
+    ),
+    lg: (
+        width: $kendo-datetime-lg-width
+    )
+) !default;
+
 @forward "@progress/kendo-theme-core/scss/components/datetimepicker/_variables.scss" with (
-    $kendo-datetime-width: $kendo-datetime-width
+    $kendo-datetime-width: $kendo-datetime-width,
+    $kendo-datetime-sm-width: $kendo-datetime-sm-width,
+    $kendo-datetime-md-width: $kendo-datetime-md-width,
+    $kendo-datetime-lg-width: $kendo-datetime-lg-width,
+    $kendo-datetime-sizes: $kendo-datetime-sizes
 );