@burtson-labs/ui 0.14.0 → 0.15.0

package/dist/mui/index.js

@@ -32,9 +32,11 @@ function shadows() {
 		shadow.xs,
 		shadow.sm,
 		shadow.sm,
-		shadow.sm
+		shadow.sm,
+		shadow.md,
+		shadow.md
 	];
-	return Array.from({ length: 25 }, (_, i) => levels[i] ?? shadow.md);
+	return Array.from({ length: 25 }, (_, i) => i === 24 ? shadow.xl : levels[i] ?? shadow.lg);
 }
 /** Theme options only, for apps that deep-merge their own overrides first. */
 function burtsonThemeOptions(modeOrConfig = "dark") {
@@ -187,13 +189,13 @@ function burtsonThemeOptions(modeOrConfig = "dark") {
 			MuiDialog: { styleOverrides: { paper: {
 				borderRadius: radius.xl,
 				border: `1px solid ${p.border}`,
-				boxShadow: shadow.md
+				boxShadow: shadow.xl
 			} } },
 			MuiMenu: { styleOverrides: {
 				paper: {
 					borderRadius: radius.lg,
 					border: `1px solid ${p["border-strong"]}`,
-					boxShadow: shadow.md
+					boxShadow: shadow.lg
 				},
 				list: {
 					paddingTop: 4,
@@ -202,7 +204,8 @@ function burtsonThemeOptions(modeOrConfig = "dark") {
 			} },
 			MuiPopover: { styleOverrides: { paper: {
 				borderRadius: radius.lg,
-				border: `1px solid ${p.border}`
+				border: `1px solid ${p.border}`,
+				boxShadow: shadow.lg
 			} } },
 			MuiChip: {
 				defaultProps: { size: "small" },
@@ -245,7 +248,8 @@ function burtsonThemeOptions(modeOrConfig = "dark") {
 			MuiAutocomplete: { styleOverrides: {
 				paper: {
 					borderRadius: radius.lg,
-					border: `1px solid ${p["border-strong"]}`
+					border: `1px solid ${p["border-strong"]}`,
+					boxShadow: shadow.lg
 				},
 				listbox: {
 					padding: 4,
@@ -270,14 +274,22 @@ function burtsonThemeOptions(modeOrConfig = "dark") {
 			} } },
 			MuiSwitch: { styleOverrides: {
 				switchBase: { "&.Mui-checked + .MuiSwitch-track": {
-					backgroundColor: p.brand,
+					backgroundColor: mode === "dark" ? p.brand : p.primary,
 					opacity: 1
 				} },
 				track: {
-					backgroundColor: p["border-strong"],
+					backgroundColor: p.input,
 					opacity: 1
 				}
 			} },
+			MuiCheckbox: { styleOverrides: { root: {
+				color: p.input,
+				"&.Mui-checked, &.MuiCheckbox-indeterminate": { color: mode === "dark" ? p.brand : p.primary }
+			} } },
+			MuiRadio: { styleOverrides: { root: {
+				color: p.input,
+				"&.Mui-checked": { color: mode === "dark" ? p.brand : p.primary }
+			} } },
 			MuiList: { defaultProps: { dense: compact } },
 			MuiTable: { defaultProps: { size: compact ? "small" : "medium" } },
 			MuiToolbar: { defaultProps: { variant: compact ? "dense" : "regular" } },

package/dist/mui/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/mui/index.ts"],"sourcesContent":["/**\n * The Burtson palette for MUI apps, so a screen built with MUI and one built\n * with Burtson UI components look like the same product.\n *\n *   import { ThemeProvider } from '@mui/material/styles';\n *   import { createBurtsonTheme } from '@burtson-labs/ui/mui';\n *   <ThemeProvider theme={createBurtsonTheme('dark')}>…</ThemeProvider>\n *   <ThemeProvider theme={createBurtsonTheme({ mode: 'dark', accent: '#2563eb', density: 'compact' })}>\n *\n * MUI is an adapter here: every colour, radius, shadow and timing comes from\n * the Burtson tokens, and the component overrides give MUI controls the same\n * shape and states as the Burtson components (focus ring, radius per role,\n * no uppercase buttons, quiet borders instead of heavy shadows).\n */\nimport { createTheme, type Shadows, type Theme, type ThemeOptions } from '@mui/material/styles';\n\nimport {\n  accentTokens,\n  contrast,\n  dark,\n  duration,\n  easing,\n  fontMono,\n  fontSans,\n  light,\n  type Palette,\n  radius,\n  shadow,\n} from '../tokens';\n\nexport type BurtsonMode = 'light' | 'dark';\nexport type BurtsonDensity = 'comfortable' | 'compact';\n\nexport interface BurtsonThemeConfig {\n  mode?: BurtsonMode;\n  /** Any hex colour; primary, brand, soft and ring tones are derived with contrast kept. */\n  accent?: string;\n  /** `compact` for admin and data-dense screens: smaller controls, dense lists and tables. */\n  density?: BurtsonDensity;\n  /** Replace individual palette tokens (a product skin's tinted surfaces). */\n  palette?: Partial<Palette>;\n}\n\nconst px = (rem: string) => Math.round(parseFloat(rem) * 16);\n\n/** The full token palette for a config: base mode, accent-derived brand tones, then explicit overrides. */\nexport function burtsonPalette(config: BurtsonThemeConfig = {}): Palette {\n  const mode = config.mode ?? 'dark';\n  const base = mode === 'dark' ? dark : light;\n  return {\n    ...base,\n    ...(config.accent ? accentTokens(config.accent, mode) : {}),\n    ...config.palette,\n  };\n}\n\nfunction shadows(): Shadows {\n  // MUI indexes elevation 0–24; the Burtson scale has three real levels.\n  const levels = ['none', shadow.xs, shadow.xs, shadow.sm, shadow.sm, shadow.sm];\n  return Array.from({ length: 25 }, (_, i) => levels[i] ?? shadow.md) as Shadows;\n}\n\n/** Theme options only, for apps that deep-merge their own overrides first. */\nexport function burtsonThemeOptions(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n): ThemeOptions {\n  const config = typeof modeOrConfig === 'string' ? { mode: modeOrConfig } : modeOrConfig;\n  const mode = config.mode ?? 'dark';\n  const compact = config.density === 'compact';\n  const p = burtsonPalette(config);\n  const focusRing = `0 0 0 3px color-mix(in srgb, ${p.ring} 24%, transparent)`;\n  return {\n    palette: {\n      mode,\n      primary: { main: p.primary, contrastText: p['primary-foreground'] },\n      // Secondary fills use the brand text tone, which is light in dark mode;\n      // their text is whichever of white or the page background reads.\n      secondary: {\n        main: p.brand,\n        contrastText: contrast(p.brand, '#ffffff') >= 4.5 ? '#ffffff' : p.background,\n      },\n      info: { main: p.info, contrastText: p['info-foreground'] },\n      error: { main: p.destructive, contrastText: p['destructive-foreground'] },\n      warning: { main: p.warning, contrastText: p['warning-foreground'] },\n      success: { main: p.success, contrastText: p['success-foreground'] },\n      background: { default: p.background, paper: p.surface },\n      text: { primary: p.foreground, secondary: p['muted-foreground'] },\n      divider: p.border,\n      action: { hover: p.muted, selected: p['brand-soft'], focus: p['brand-soft'] },\n    },\n    shape: { borderRadius: px(radius.md) },\n    shadows: shadows(),\n    typography: {\n      fontFamily: fontSans,\n      fontSize: compact ? 13 : 14,\n      button: { textTransform: 'none', fontWeight: 600, letterSpacing: '-0.01em' },\n      h1: { fontWeight: 700, letterSpacing: '-0.03em' },\n      h2: { fontWeight: 700, letterSpacing: '-0.025em' },\n      h3: { fontWeight: 650, letterSpacing: '-0.02em' },\n      h4: { fontWeight: 650, letterSpacing: '-0.015em' },\n      h5: { fontWeight: 600 },\n      h6: { fontWeight: 600 },\n      overline: { fontWeight: 600, letterSpacing: '0.08em' },\n    },\n    transitions: {\n      duration: {\n        shortest: duration.fast,\n        shorter: duration.fast,\n        short: duration.standard,\n        standard: duration.standard,\n        complex: duration.emphasis,\n        enteringScreen: duration.emphasis,\n        leavingScreen: duration.exit,\n      },\n      easing: {\n        easeInOut: easing.standard,\n        easeOut: easing.emphasized,\n        easeIn: easing.exit,\n        sharp: easing.standard,\n      },\n    },\n    components: {\n      MuiCssBaseline: {\n        styleOverrides: {\n          'code, kbd, pre, samp': { fontFamily: fontMono },\n          '@media (prefers-reduced-motion: reduce)': {\n            '*, ::before, ::after': {\n              animationDuration: '1ms !important',\n              transitionDuration: '1ms !important',\n            },\n          },\n        },\n      },\n      MuiButtonBase: { defaultProps: { disableRipple: true } },\n      MuiButton: {\n        defaultProps: { disableElevation: true, size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': {\n              boxShadow: focusRing,\n              outline: `2px solid ${p.ring}`,\n              outlineOffset: 2,\n            },\n          },\n          outlined: { borderColor: p['border-strong'] },\n        },\n      },\n      MuiIconButton: {\n        defaultProps: { size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': { outline: `2px solid ${p.ring}`, outlineOffset: 2 },\n          },\n        },\n      },\n      MuiPaper: {\n        styleOverrides: {\n          root: { backgroundImage: 'none' },\n          outlined: { borderColor: p.border },\n          rounded: { borderRadius: radius.lg },\n        },\n      },\n      MuiCard: {\n        defaultProps: { variant: 'outlined' },\n        styleOverrides: {\n          root: { borderRadius: radius.lg, backgroundColor: p.card, borderColor: p.border },\n        },\n      },\n      MuiDialog: {\n        styleOverrides: {\n          paper: { borderRadius: radius.xl, border: `1px solid ${p.border}`, boxShadow: shadow.md },\n        },\n      },\n      MuiMenu: {\n        styleOverrides: {\n          paper: {\n            borderRadius: radius.lg,\n            border: `1px solid ${p['border-strong']}`,\n            boxShadow: shadow.md,\n          },\n          list: { paddingTop: 4, paddingBottom: 4 },\n        },\n      },\n      MuiPopover: {\n        styleOverrides: { paper: { borderRadius: radius.lg, border: `1px solid ${p.border}` } },\n      },\n      MuiChip: {\n        defaultProps: { size: 'small' },\n        styleOverrides: { root: { borderRadius: radius.full, fontWeight: 500 } },\n      },\n      MuiTabs: {\n        styleOverrides: { indicator: { backgroundColor: p.brand, height: 2 } },\n      },\n      MuiTab: {\n        styleOverrides: {\n          root: {\n            textTransform: 'none',\n            fontWeight: 500,\n            minHeight: compact ? 36 : 44,\n            '&.Mui-selected': { color: p.foreground },\n          },\n        },\n      },\n      MuiOutlinedInput: {\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            backgroundColor: p.surface,\n            '& .MuiOutlinedInput-notchedOutline': { borderColor: p.input },\n            '&:hover .MuiOutlinedInput-notchedOutline': { borderColor: p['border-strong'] },\n            // Same focus as the Tailwind fields: a 2px ring-coloured edge inside\n            // the radius, no outer halo that a scroll container could clip.\n            '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\n              borderColor: p.ring,\n              borderWidth: 2,\n            },\n            '&.Mui-error .MuiOutlinedInput-notchedOutline': { borderColor: p.destructive },\n          },\n        },\n      },\n      // Menu, Select and Autocomplete rows: inset 4px in a 12px surface, 8px\n      // radius, a quiet secondary fill for the active row (as MenuItem and\n      // SelectItem in the Tailwind kit).\n      MuiMenuItem: {\n        styleOverrides: {\n          root: {\n            margin: '0 4px',\n            borderRadius: radius.sm,\n            '&.Mui-focusVisible, &:hover': { backgroundColor: p.secondary },\n            '&.Mui-selected': { backgroundColor: 'transparent', fontWeight: 600 },\n            '&.Mui-selected.Mui-focusVisible, &.Mui-selected:hover': {\n              backgroundColor: p.secondary,\n            },\n          },\n        },\n      },\n      MuiAutocomplete: {\n        styleOverrides: {\n          paper: { borderRadius: radius.lg, border: `1px solid ${p['border-strong']}` },\n          listbox: {\n            padding: 4,\n            '& .MuiAutocomplete-option': {\n              borderRadius: radius.sm,\n              '&.Mui-focused, &.Mui-focusVisible': { backgroundColor: p.secondary },\n              '&[aria-selected=\"true\"]': { backgroundColor: 'transparent', fontWeight: 600 },\n              '&[aria-selected=\"true\"].Mui-focused': { backgroundColor: p.secondary },\n            },\n          },\n        },\n      },\n      MuiTextField: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiAlert: { styleOverrides: { root: { borderRadius: radius.md } } },\n      MuiTooltip: {\n        styleOverrides: {\n          tooltip: {\n            backgroundColor: p.code,\n            color: p['code-foreground'],\n            fontSize: 12,\n            borderRadius: radius.sm,\n          },\n        },\n      },\n      MuiSwitch: {\n        styleOverrides: {\n          switchBase: {\n            '&.Mui-checked + .MuiSwitch-track': { backgroundColor: p.brand, opacity: 1 },\n          },\n          track: { backgroundColor: p['border-strong'], opacity: 1 },\n        },\n      },\n      MuiList: { defaultProps: { dense: compact } },\n      MuiTable: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiToolbar: { defaultProps: { variant: compact ? 'dense' : 'regular' } },\n      MuiDivider: { styleOverrides: { root: { borderColor: p.border } } },\n    },\n  };\n}\n\n/**\n * `createBurtsonTheme('dark')` or `createBurtsonTheme({ mode, accent, density })`,\n * then any MUI overrides, merged in order.\n */\nexport function createBurtsonTheme(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n  ...overrides: ThemeOptions[]\n): Theme {\n  return createTheme(burtsonThemeOptions(modeOrConfig), ...overrides);\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/mui/index.ts"],"sourcesContent":["/**\n * The Burtson palette for MUI apps, so a screen built with MUI and one built\n * with Burtson UI components look like the same product.\n *\n *   import { ThemeProvider } from '@mui/material/styles';\n *   import { createBurtsonTheme } from '@burtson-labs/ui/mui';\n *   <ThemeProvider theme={createBurtsonTheme('dark')}>…</ThemeProvider>\n *   <ThemeProvider theme={createBurtsonTheme({ mode: 'dark', accent: '#2563eb', density: 'compact' })}>\n *\n * MUI is an adapter here: every colour, radius, shadow and timing comes from\n * the Burtson tokens, and the component overrides give MUI controls the same\n * shape and states as the Burtson components (focus ring, radius per role,\n * no uppercase buttons, quiet borders instead of heavy shadows).\n */\nimport { createTheme, type Shadows, type Theme, type ThemeOptions } from '@mui/material/styles';\n\nimport {\n  accentTokens,\n  contrast,\n  dark,\n  duration,\n  easing,\n  fontMono,\n  fontSans,\n  light,\n  type Palette,\n  radius,\n  shadow,\n} from '../tokens';\n\nexport type BurtsonMode = 'light' | 'dark';\nexport type BurtsonDensity = 'comfortable' | 'compact';\n\nexport interface BurtsonThemeConfig {\n  mode?: BurtsonMode;\n  /** Any hex colour; primary, brand, soft and ring tones are derived with contrast kept. */\n  accent?: string;\n  /** `compact` for admin and data-dense screens: smaller controls, dense lists and tables. */\n  density?: BurtsonDensity;\n  /** Replace individual palette tokens (a product skin's tinted surfaces). */\n  palette?: Partial<Palette>;\n}\n\nconst px = (rem: string) => Math.round(parseFloat(rem) * 16);\n\n/** The full token palette for a config: base mode, accent-derived brand tones, then explicit overrides. */\nexport function burtsonPalette(config: BurtsonThemeConfig = {}): Palette {\n  const mode = config.mode ?? 'dark';\n  const base = mode === 'dark' ? dark : light;\n  return {\n    ...base,\n    ...(config.accent ? accentTokens(config.accent, mode) : {}),\n    ...config.palette,\n  };\n}\n\nfunction shadows(): Shadows {\n  // MUI indexes elevation 0–24; the Burtson scale has five real levels:\n  // resting, card, raised, floating (8+: menus, popovers) and modal (24).\n  const levels = [\n    'none',\n    shadow.xs,\n    shadow.xs,\n    shadow.sm,\n    shadow.sm,\n    shadow.sm,\n    shadow.md,\n    shadow.md,\n  ];\n  return Array.from({ length: 25 }, (_, i) =>\n    i === 24 ? shadow.xl : (levels[i] ?? shadow.lg),\n  ) as Shadows;\n}\n\n/** Theme options only, for apps that deep-merge their own overrides first. */\nexport function burtsonThemeOptions(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n): ThemeOptions {\n  const config = typeof modeOrConfig === 'string' ? { mode: modeOrConfig } : modeOrConfig;\n  const mode = config.mode ?? 'dark';\n  const compact = config.density === 'compact';\n  const p = burtsonPalette(config);\n  const focusRing = `0 0 0 3px color-mix(in srgb, ${p.ring} 24%, transparent)`;\n  return {\n    palette: {\n      mode,\n      primary: { main: p.primary, contrastText: p['primary-foreground'] },\n      // Secondary fills use the brand text tone, which is light in dark mode;\n      // their text is whichever of white or the page background reads.\n      secondary: {\n        main: p.brand,\n        contrastText: contrast(p.brand, '#ffffff') >= 4.5 ? '#ffffff' : p.background,\n      },\n      info: { main: p.info, contrastText: p['info-foreground'] },\n      error: { main: p.destructive, contrastText: p['destructive-foreground'] },\n      warning: { main: p.warning, contrastText: p['warning-foreground'] },\n      success: { main: p.success, contrastText: p['success-foreground'] },\n      background: { default: p.background, paper: p.surface },\n      text: { primary: p.foreground, secondary: p['muted-foreground'] },\n      divider: p.border,\n      action: { hover: p.muted, selected: p['brand-soft'], focus: p['brand-soft'] },\n    },\n    shape: { borderRadius: px(radius.md) },\n    shadows: shadows(),\n    typography: {\n      fontFamily: fontSans,\n      fontSize: compact ? 13 : 14,\n      button: { textTransform: 'none', fontWeight: 600, letterSpacing: '-0.01em' },\n      h1: { fontWeight: 700, letterSpacing: '-0.03em' },\n      h2: { fontWeight: 700, letterSpacing: '-0.025em' },\n      h3: { fontWeight: 650, letterSpacing: '-0.02em' },\n      h4: { fontWeight: 650, letterSpacing: '-0.015em' },\n      h5: { fontWeight: 600 },\n      h6: { fontWeight: 600 },\n      overline: { fontWeight: 600, letterSpacing: '0.08em' },\n    },\n    transitions: {\n      duration: {\n        shortest: duration.fast,\n        shorter: duration.fast,\n        short: duration.standard,\n        standard: duration.standard,\n        complex: duration.emphasis,\n        enteringScreen: duration.emphasis,\n        leavingScreen: duration.exit,\n      },\n      easing: {\n        easeInOut: easing.standard,\n        easeOut: easing.emphasized,\n        easeIn: easing.exit,\n        sharp: easing.standard,\n      },\n    },\n    components: {\n      MuiCssBaseline: {\n        styleOverrides: {\n          'code, kbd, pre, samp': { fontFamily: fontMono },\n          '@media (prefers-reduced-motion: reduce)': {\n            '*, ::before, ::after': {\n              animationDuration: '1ms !important',\n              transitionDuration: '1ms !important',\n            },\n          },\n        },\n      },\n      MuiButtonBase: { defaultProps: { disableRipple: true } },\n      MuiButton: {\n        defaultProps: { disableElevation: true, size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': {\n              boxShadow: focusRing,\n              outline: `2px solid ${p.ring}`,\n              outlineOffset: 2,\n            },\n          },\n          outlined: { borderColor: p['border-strong'] },\n        },\n      },\n      MuiIconButton: {\n        defaultProps: { size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': { outline: `2px solid ${p.ring}`, outlineOffset: 2 },\n          },\n        },\n      },\n      MuiPaper: {\n        styleOverrides: {\n          root: { backgroundImage: 'none' },\n          outlined: { borderColor: p.border },\n          rounded: { borderRadius: radius.lg },\n        },\n      },\n      MuiCard: {\n        defaultProps: { variant: 'outlined' },\n        styleOverrides: {\n          root: { borderRadius: radius.lg, backgroundColor: p.card, borderColor: p.border },\n        },\n      },\n      MuiDialog: {\n        styleOverrides: {\n          paper: { borderRadius: radius.xl, border: `1px solid ${p.border}`, boxShadow: shadow.xl },\n        },\n      },\n      MuiMenu: {\n        styleOverrides: {\n          paper: {\n            borderRadius: radius.lg,\n            border: `1px solid ${p['border-strong']}`,\n            boxShadow: shadow.lg,\n          },\n          list: { paddingTop: 4, paddingBottom: 4 },\n        },\n      },\n      MuiPopover: {\n        styleOverrides: {\n          paper: { borderRadius: radius.lg, border: `1px solid ${p.border}`, boxShadow: shadow.lg },\n        },\n      },\n      MuiChip: {\n        defaultProps: { size: 'small' },\n        styleOverrides: { root: { borderRadius: radius.full, fontWeight: 500 } },\n      },\n      MuiTabs: {\n        styleOverrides: { indicator: { backgroundColor: p.brand, height: 2 } },\n      },\n      MuiTab: {\n        styleOverrides: {\n          root: {\n            textTransform: 'none',\n            fontWeight: 500,\n            minHeight: compact ? 36 : 44,\n            '&.Mui-selected': { color: p.foreground },\n          },\n        },\n      },\n      MuiOutlinedInput: {\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            backgroundColor: p.surface,\n            '& .MuiOutlinedInput-notchedOutline': { borderColor: p.input },\n            '&:hover .MuiOutlinedInput-notchedOutline': { borderColor: p['border-strong'] },\n            // Same focus as the Tailwind fields: a 2px ring-coloured edge inside\n            // the radius, no outer halo that a scroll container could clip.\n            '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\n              borderColor: p.ring,\n              borderWidth: 2,\n            },\n            '&.Mui-error .MuiOutlinedInput-notchedOutline': { borderColor: p.destructive },\n          },\n        },\n      },\n      // Menu, Select and Autocomplete rows: inset 4px in a 12px surface, 8px\n      // radius, a quiet secondary fill for the active row (as MenuItem and\n      // SelectItem in the Tailwind kit).\n      MuiMenuItem: {\n        styleOverrides: {\n          root: {\n            margin: '0 4px',\n            borderRadius: radius.sm,\n            '&.Mui-focusVisible, &:hover': { backgroundColor: p.secondary },\n            '&.Mui-selected': { backgroundColor: 'transparent', fontWeight: 600 },\n            '&.Mui-selected.Mui-focusVisible, &.Mui-selected:hover': {\n              backgroundColor: p.secondary,\n            },\n          },\n        },\n      },\n      MuiAutocomplete: {\n        styleOverrides: {\n          paper: {\n            borderRadius: radius.lg,\n            border: `1px solid ${p['border-strong']}`,\n            boxShadow: shadow.lg,\n          },\n          listbox: {\n            padding: 4,\n            '& .MuiAutocomplete-option': {\n              borderRadius: radius.sm,\n              '&.Mui-focused, &.Mui-focusVisible': { backgroundColor: p.secondary },\n              '&[aria-selected=\"true\"]': { backgroundColor: 'transparent', fontWeight: 600 },\n              '&[aria-selected=\"true\"].Mui-focused': { backgroundColor: p.secondary },\n            },\n          },\n        },\n      },\n      MuiTextField: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiAlert: { styleOverrides: { root: { borderRadius: radius.md } } },\n      MuiTooltip: {\n        styleOverrides: {\n          tooltip: {\n            backgroundColor: p.code,\n            color: p['code-foreground'],\n            fontSize: 12,\n            borderRadius: radius.sm,\n          },\n        },\n      },\n      MuiSwitch: {\n        styleOverrides: {\n          switchBase: {\n            '&.Mui-checked + .MuiSwitch-track': {\n              backgroundColor: mode === 'dark' ? p.brand : p.primary,\n              opacity: 1,\n            },\n          },\n          // The off track is the field border tone: 3:1 on the page.\n          track: { backgroundColor: p.input, opacity: 1 },\n        },\n      },\n      MuiCheckbox: {\n        styleOverrides: {\n          root: {\n            color: p.input,\n            '&.Mui-checked, &.MuiCheckbox-indeterminate': {\n              color: mode === 'dark' ? p.brand : p.primary,\n            },\n          },\n        },\n      },\n      MuiRadio: {\n        styleOverrides: {\n          root: {\n            color: p.input,\n            '&.Mui-checked': { color: mode === 'dark' ? p.brand : p.primary },\n          },\n        },\n      },\n      MuiList: { defaultProps: { dense: compact } },\n      MuiTable: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiToolbar: { defaultProps: { variant: compact ? 'dense' : 'regular' } },\n      MuiDivider: { styleOverrides: { root: { borderColor: p.border } } },\n    },\n  };\n}\n\n/**\n * `createBurtsonTheme('dark')` or `createBurtsonTheme({ mode, accent, density })`,\n * then any MUI overrides, merged in order.\n */\nexport function createBurtsonTheme(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n  ...overrides: ThemeOptions[]\n): Theme {\n  return createTheme(burtsonThemeOptions(modeOrConfig), ...overrides);\n}\n"],"mappings":"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"}