@12-apps/ui 6.31.0 → 6.33.0

package/dist/{chunk-Q5BSNHN7.js → chunk-6M33XQLZ.js}

@@ -1,6 +1,6 @@
 import {
   AddressTextField
-} from "./chunk-D7Q42CRZ.js";
+} from "./chunk-VECWMANF.js";
 
 // src/components/form/AddressAutocomplete/AddressInputField.tsx
 import CurrentLocationIcon from "@mui/icons-material/MyLocation";
@@ -67,4 +67,4 @@ var AddressInputField = ({
 export {
   AddressInputField
 };
-//# sourceMappingURL=chunk-Q5BSNHN7.js.map
+//# sourceMappingURL=chunk-6M33XQLZ.js.map

package/dist/{chunk-IPS55KWK.js → chunk-6M7CMILP.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-KHG57NAE.js";
 import {
   Pagination
-} from "./chunk-DWZ7FLA7.js";
+} from "./chunk-FATRMNVN.js";
 import {
   default as default2
 } from "./chunk-6DPAWXZ3.js";
@@ -31,4 +31,4 @@ function DataViewsPagination({
 export {
   DataViewsPagination
 };
-//# sourceMappingURL=chunk-IPS55KWK.js.map
+//# sourceMappingURL=chunk-6M7CMILP.js.map

package/dist/{chunk-X2R7QG5I.js → chunk-6MDBMCFK.js}

@@ -4,7 +4,7 @@ import {
   buttonVariantStyles,
   getColorFromTheme,
   iconAlignmentStyles
-} from "./chunk-EN5Q5RPQ.js";
+} from "./chunk-QRUCR4YZ.js";
 import {
   BUTTON_ICON_GLYPH_SIZE
 } from "./chunk-K6FCXPTS.js";
@@ -124,4 +124,4 @@ var Button = ButtonRoot;
 export {
   Button
 };
-//# sourceMappingURL=chunk-X2R7QG5I.js.map
+//# sourceMappingURL=chunk-6MDBMCFK.js.map

package/dist/{chunk-PCONTSJJ.js → chunk-6V7D6GRX.js}

@@ -1,29 +1,29 @@
+import {
+  DiscloseSlot,
+  DragSlot,
+  SelectSlot
+} from "./chunk-7TSQNYQO.js";
 import {
   actionProps,
   metaShape,
   rowStyles,
   useRowShell
-} from "./chunk-RWIBPIPD.js";
-import {
-  useDisclosure
-} from "./chunk-2JCRNWHE.js";
+} from "./chunk-LNOYDMFD.js";
 import {
   ListCardActions,
   ListCardCaption,
   ListCardMeta,
   ListCardTail
-} from "./chunk-QKDFD4VT.js";
+} from "./chunk-62NFZR52.js";
 import {
-  DiscloseSlot,
-  DragSlot,
-  SelectSlot
-} from "./chunk-OIFBBDYX.js";
+  useDisclosure
+} from "./chunk-2JCRNWHE.js";
 import {
   DropIndicator
 } from "./chunk-JCJGJX7V.js";
 import {
   cellRailsTemplate
-} from "./chunk-RFZU5BTG.js";
+} from "./chunk-LYSSO6WC.js";
 import {
   ListCardCells,
   cellTracks,
@@ -179,4 +179,4 @@ function BaseListCard(props) {
 export {
   BaseListCard
 };
-//# sourceMappingURL=chunk-PCONTSJJ.js.map
+//# sourceMappingURL=chunk-6V7D6GRX.js.map

package/dist/{chunk-DTKMBI7B.js → chunk-6YLAVHV4.js}

@@ -1,12 +1,12 @@
-import {
-  resolveScrollAreaProps
-} from "./chunk-RHIDWUK7.js";
 import {
   ScrollViewport
 } from "./chunk-C53C7C2X.js";
 import {
   ScrollAreaContent
 } from "./chunk-4OEKIFBC.js";
+import {
+  resolveScrollAreaProps
+} from "./chunk-RHIDWUK7.js";
 
 // src/components/layout/ScrollArea/ScrollArea.tsx
 import KeyboardArrowUp from "@mui/icons-material/KeyboardArrowUp";
@@ -237,4 +237,4 @@ var ScrollArea = (componentProps) => {
 export {
   ScrollArea
 };
-//# sourceMappingURL=chunk-DTKMBI7B.js.map
+//# sourceMappingURL=chunk-6YLAVHV4.js.map

package/dist/{chunk-BWSYSSF3.js → chunk-7A3G4W52.js}

@@ -1,13 +1,13 @@
 import {
   headingSx
-} from "./chunk-GKGA2ZCW.js";
+} from "./chunk-RAWQMBX6.js";
 import {
   HEADING_DEFAULT_COLOR,
   HEADING_DEFAULT_LEVEL,
   HEADING_DEFAULT_WEIGHT,
   HEADING_RANK,
   stepOf
-} from "./chunk-OHKEQ7QJ.js";
+} from "./chunk-GXEB6MJA.js";
 import {
   resolveTestId,
   withoutTestIdProps
@@ -61,4 +61,4 @@ Heading.displayName = "Heading";
 export {
   Heading
 };
-//# sourceMappingURL=chunk-BWSYSSF3.js.map
+//# sourceMappingURL=chunk-7A3G4W52.js.map

package/dist/{chunk-RXSGHPCR.js → chunk-7FOOLP5H.js}

@@ -1,10 +1,10 @@
-import {
-  useMenuItemState
-} from "./chunk-3L5OZCGA.js";
 import {
   navItemButtonStyles,
   pulseGlow
 } from "./chunk-FYLCSCMR.js";
+import {
+  useMenuItemState
+} from "./chunk-3L5OZCGA.js";
 
 // src/components/navigation/NavigationMenu/NavigationMenuItem.tsx
 import ChevronRight from "@mui/icons-material/ChevronRight";
@@ -301,4 +301,4 @@ var renderMenuItem = (item, variant = "vertical", size = "md", collapsed = false
 export {
   renderMenuItem
 };
-//# sourceMappingURL=chunk-RXSGHPCR.js.map
+//# sourceMappingURL=chunk-7FOOLP5H.js.map

package/dist/{chunk-NJ6D37KV.js → chunk-7FWXG2KF.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Button
-} from "./chunk-X2R7QG5I.js";
+} from "./chunk-6MDBMCFK.js";
 
 // src/components/data-display/DataViews/data-views-grid-helpers.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -162,4 +162,4 @@ export {
   togglePillValues,
   cardGridTracks
 };
-//# sourceMappingURL=chunk-NJ6D37KV.js.map
+//# sourceMappingURL=chunk-7FWXG2KF.js.map

package/dist/{chunk-APMEXS3Y.js → chunk-7N4V3ARN.js}

@@ -1,6 +1,6 @@
 import {
   useCardActions
-} from "./chunk-A5FIYKAN.js";
+} from "./chunk-RGMSTQ2J.js";
 import {
   ConfirmActionDialog
 } from "./chunk-QQS3GQYS.js";
@@ -50,4 +50,4 @@ function useRemoveConfirm({
 export {
   useRemoveConfirm
 };
-//# sourceMappingURL=chunk-APMEXS3Y.js.map
+//# sourceMappingURL=chunk-7N4V3ARN.js.map

package/dist/{chunk-OIFBBDYX.js → chunk-7TSQNYQO.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-KHG57NAE.js";
 import {
   Checkbox
-} from "./chunk-6SNRPCSK.js";
+} from "./chunk-CR4KC2K5.js";
 import {
   default as default2
 } from "./chunk-6DPAWXZ3.js";
@@ -131,4 +131,4 @@ export {
   SelectSlot,
   DiscloseSlot
 };
-//# sourceMappingURL=chunk-OIFBBDYX.js.map
+//# sourceMappingURL=chunk-7TSQNYQO.js.map

package/dist/{chunk-YD77RANW.js → chunk-7VN7LFBA.js}

@@ -1,13 +1,13 @@
+import {
+  resolveSkeletonProps,
+  skeletonInstanceTestId
+} from "./chunk-7WDPC46N.js";
 import {
   defaultDimensions,
   muiAnimationFor,
   muiVariantFor,
   skeletonStyles
 } from "./chunk-ZOW2CCMO.js";
-import {
-  resolveSkeletonProps,
-  skeletonInstanceTestId
-} from "./chunk-7WDPC46N.js";
 import {
   resolveTestId,
   withoutTestIdProps
@@ -77,4 +77,4 @@ Skeleton.displayName = "Skeleton";
 export {
   Skeleton
 };
-//# sourceMappingURL=chunk-YD77RANW.js.map
+//# sourceMappingURL=chunk-7VN7LFBA.js.map

package/dist/{chunk-CKW267ZK.js → chunk-AJVYJZHI.js}

@@ -1,12 +1,12 @@
 import {
   useAddressAutocomplete
-} from "./chunk-ZOUWHGV3.js";
+} from "./chunk-4MGFUPQT.js";
 import {
   AddressFallbackField
-} from "./chunk-O6DRUOUF.js";
+} from "./chunk-YESTO24O.js";
 import {
   AddressAutocompleteField
-} from "./chunk-GLPHRHIT.js";
+} from "./chunk-K2XK45HG.js";
 import {
   resolveAddressProps
 } from "./chunk-MTGEJRE4.js";
@@ -35,4 +35,4 @@ export {
   AddressAutocomplete,
   AddressAutocomplete_default
 };
-//# sourceMappingURL=chunk-CKW267ZK.js.map
+//# sourceMappingURL=chunk-AJVYJZHI.js.map

package/dist/{chunk-EZOVSZ5B.js → chunk-ANNDLY3M.js}

@@ -1,11 +1,11 @@
-import {
-  useLightboxCopy
-} from "./chunk-TEQYTEM2.js";
 import {
   OVERLAY_Z_INDEX,
   navButtonSx,
   overlayButtonSx
 } from "./chunk-56SJYTIT.js";
+import {
+  useLightboxCopy
+} from "./chunk-TEQYTEM2.js";
 
 // src/components/data-display/Lightbox/LightboxControls.tsx
 import PrevIcon from "@mui/icons-material/ChevronLeft";
@@ -153,4 +153,4 @@ export {
   LightboxZoomControls,
   LightboxAutoplayButton
 };
-//# sourceMappingURL=chunk-EZOVSZ5B.js.map
+//# sourceMappingURL=chunk-ANNDLY3M.js.map

package/dist/{chunk-J2RRZZXC.js → chunk-APT5L7V5.js}

@@ -3,7 +3,7 @@ import {
   defaultMessages,
   resolveDayRange,
   resolveQuickRanges
-} from "./chunk-GUROYOKQ.js";
+} from "./chunk-EAE5Z5HL.js";
 import {
   toDayString,
   todayIn
@@ -69,4 +69,4 @@ function useDateRangePicker({
 export {
   useDateRangePicker
 };
-//# sourceMappingURL=chunk-J2RRZZXC.js.map
+//# sourceMappingURL=chunk-APT5L7V5.js.map

package/dist/{chunk-ZVTJGWIV.js → chunk-AYRHW4DX.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-WEBEOBN5.js";
 import {
   Text
-} from "./chunk-QNUWSXF2.js";
+} from "./chunk-H57ZS6W2.js";
 
 // src/components/data-display/DataViews/save-view-preview.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -51,4 +51,4 @@ function PreviewBox({ preview, testIdPrefix }) {
 export {
   PreviewBox
 };
-//# sourceMappingURL=chunk-ZVTJGWIV.js.map
+//# sourceMappingURL=chunk-AYRHW4DX.js.map

package/dist/{chunk-NLUZGT4U.js → chunk-AZ4LLAAJ.js}

@@ -6,10 +6,10 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Button
-} from "./chunk-X2R7QG5I.js";
+} from "./chunk-6MDBMCFK.js";
 import {
   Text
-} from "./chunk-QNUWSXF2.js";
+} from "./chunk-H57ZS6W2.js";
 
 // src/components/data-display/DataViews/data-views-view-nav.tsx
 import ChevronLeftRoundedIcon from "@mui/icons-material/ChevronLeftRounded";
@@ -294,4 +294,4 @@ export {
   ViewHeader,
   ViewFooter
 };
-//# sourceMappingURL=chunk-NLUZGT4U.js.map
+//# sourceMappingURL=chunk-AZ4LLAAJ.js.map

package/dist/{chunk-IRSI3BFF.js → chunk-B64PPHUR.js}

@@ -1,3 +1,7 @@
+import {
+  asFieldSize,
+  fieldHeight
+} from "./chunk-CGO452DC.js";
 import {
   fieldRadius
 } from "./chunk-GDN2LUTZ.js";
@@ -102,6 +106,10 @@ var ToggleGroup = forwardRef(
               fontWeight: 500,
               transition: "all 0.3s ease",
               ...sizeMap[size],
+              // The theme's field height for the size; the label centres in it.
+              minHeight: (theme2) => fieldHeight(theme2, asFieldSize(size)),
+              paddingTop: 0,
+              paddingBottom: 0,
               "&.Mui-selected": {
                 backgroundColor: colorPalette.main,
                 color: colorPalette.contrastText,
@@ -126,4 +134,4 @@ ToggleGroup.displayName = "ToggleGroup";
 export {
   ToggleGroup
 };
-//# sourceMappingURL=chunk-IRSI3BFF.js.map
+//# sourceMappingURL=chunk-B64PPHUR.js.map

package/dist/chunk-B64PPHUR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport ToggleButton from '@mui/material/ToggleButton/index.js';\nimport ToggleButtonGroup from '@mui/material/ToggleButtonGroup/index.js';\nimport { alpha, useTheme, styled } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React, { forwardRef } from 'react';\n\nimport type { ToggleGroupProps } from './ToggleGroup.types';\nimport { cssLengthToPx } from '../../../tokens/css-units';\nimport { asFieldSize, fieldHeight } from '../../../tokens/field-height';\nimport { fieldRadius } from '../../../tokens/field-radius';\n\nconst GLASS_PADDING = 4;\nconst GLASS_BORDER = 1;\n\nconst getColorFromTheme = (theme: Theme, color: string) => {\n  if (color === 'neutral') {\n    return {\n      main: theme.palette.grey[700],\n      dark: theme.palette.grey[800],\n      light: theme.palette.grey[500],\n      contrastText: theme.palette.getContrastText(theme.palette.grey[700]),\n    };\n  }\n\n  const colorMap = {\n    primary: theme.palette.primary,\n    secondary: theme.palette.secondary,\n    success: theme.palette.success,\n    warning: theme.palette.warning,\n    info: theme.palette.info,\n    danger: theme.palette.error,\n  };\n\n  const palette = colorMap[color as keyof typeof colorMap] || theme.palette.primary;\n\n  // Ensure palette has required properties\n  return {\n    main: palette.main,\n    dark: palette.dark || palette.main,\n    light: palette.light || palette.main,\n    contrastText: palette.contrastText || theme.palette.getContrastText(palette.main),\n  };\n};\n\nconst StyledToggleGroup = styled(ToggleButtonGroup, {\n  shouldForwardProp: (prop) => !['customColor', 'customSize', 'glass'].includes(prop as string),\n})<{\n  customColor?: string;\n  customSize?: string;\n  glass?: boolean;\n}>(({ theme, glass }) => {\n  // Each button is the field, so it takes the field radius. The glass frame\n  // around them is inset by its padding, the buttons' margin and its border,\n  // and rounds by that much more so the two corners stay concentric.\n  const radius = fieldRadius(theme);\n  const inset = GLASS_PADDING + cssLengthToPx(theme.spacing(0.5), 4) + GLASS_BORDER;\n  return {\n    backgroundColor: glass ? alpha(theme.palette.background.paper, 0.1) : 'transparent',\n    backdropFilter: glass ? 'blur(20px)' : 'none',\n    borderRadius: glass ? radius + inset : radius,\n    padding: glass ? GLASS_PADDING : 0,\n    border: glass ? `${GLASS_BORDER}px solid ${alpha(theme.palette.divider, 0.2)}` : 'none',\n\n    '& .MuiToggleButtonGroup-grouped': {\n      margin: theme.spacing(0.5),\n      border: 0,\n      borderRadius: `${radius}px !important`,\n    },\n  };\n});\n\nexport const ToggleGroup = forwardRef<HTMLDivElement, ToggleGroupProps>(\n  (\n    {\n      variant = 'single',\n      color = 'primary',\n      size = 'md',\n      options,\n      glass = false,\n      gradient = false,\n      value,\n      onChange,\n      dataTestId = 'toggle-group',\n      ...props\n    },\n    ref,\n  ) => {\n    const theme = useTheme();\n    const colorPalette = getColorFromTheme(theme, color);\n\n    const sizeMap = {\n      xs: { padding: '4px 8px', fontSize: '0.75rem' },\n      sm: { padding: '6px 12px', fontSize: '0.875rem' },\n      md: { padding: '8px 16px', fontSize: '1rem' },\n      lg: { padding: '10px 20px', fontSize: '1.125rem' },\n      xl: { padding: '12px 24px', fontSize: '1.25rem' },\n    };\n\n    return (\n      <StyledToggleGroup\n        ref={ref}\n        customColor={color}\n        customSize={size}\n        glass={glass}\n        value={value}\n        onChange={onChange}\n        exclusive={variant === 'exclusive' || variant === 'single'}\n        data-testid={dataTestId}\n        {...props}\n      >\n        {options.map((option) => (\n          <ToggleButton\n            key={option.value}\n            value={option.value}\n            disabled={option.disabled}\n            data-testid={`${dataTestId}-item-${option.value}`}\n            sx={{\n              textTransform: 'none',\n              fontWeight: 500,\n              transition: 'all 0.3s ease',\n              ...sizeMap[size as keyof typeof sizeMap],\n              // The theme's field height for the size; the label centres in it.\n              minHeight: (theme) => fieldHeight(theme, asFieldSize(size)),\n              paddingTop: 0,\n              paddingBottom: 0,\n\n              '&.Mui-selected': {\n                backgroundColor: colorPalette.main,\n                color: colorPalette.contrastText,\n\n                ...(gradient && {\n                  background: `linear-gradient(135deg, ${colorPalette.main}, ${colorPalette.dark})`,\n                }),\n              },\n            }}\n          >\n            <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n              {option.icon}\n              {option.label}\n            </Box>\n          </ToggleButton>\n        ))}\n      </StyledToggleGroup>\n    );\n  },\n);\n\nToggleGroup.displayName = 'ToggleGroup';\n"],"mappings":"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","names":["theme"]}

package/dist/{chunk-7DNQHMDO.js → chunk-B6IURHSZ.js}

@@ -1,12 +1,12 @@
-import {
-  useCommandPalette
-} from "./chunk-SUZXPDUQ.js";
 import {
   PaletteResults
 } from "./chunk-SQSFMZTF.js";
 import {
   ShortcutChip
 } from "./chunk-5EIW2FZY.js";
+import {
+  useCommandPalette
+} from "./chunk-SUZXPDUQ.js";
 
 // src/components/navigation/CommandPalette/CommandPalette.tsx
 import CloseIcon from "@mui/icons-material/Close";
@@ -212,4 +212,4 @@ export {
   CommandPalette,
   CommandPalette_default
 };
-//# sourceMappingURL=chunk-7DNQHMDO.js.map
+//# sourceMappingURL=chunk-B6IURHSZ.js.map

package/dist/{chunk-USPQZQBF.js → chunk-BIIAMH47.js}

@@ -4,11 +4,14 @@ import {
   FormMessage
 } from "./chunk-IPPTOL53.js";
 import {
-  fieldEdge
-} from "./chunk-7FDU3FIN.js";
+  fieldControlStyles
+} from "./chunk-CGO452DC.js";
 import {
   fieldRadiusPx
 } from "./chunk-GDN2LUTZ.js";
+import {
+  fieldEdge
+} from "./chunk-7FDU3FIN.js";
 import {
   stackedOverlayZIndex
 } from "./chunk-MFU4Y25U.js";
@@ -72,7 +75,7 @@ function renderField(params, field) {
       placeholder: field.placeholder,
       error: Boolean(field.error),
       size: MUI_SIZE[field.size],
-      sx: fieldSx,
+      sx: [fieldSx, (theme) => fieldControlStyles(theme, field.size)],
       inputProps: { ...params.inputProps, "data-testid": `${field.dataTestId}-input` },
       slotProps: {
         input: {
@@ -162,4 +165,4 @@ function CreatableSelect({
 export {
   CreatableSelect
 };
-//# sourceMappingURL=chunk-USPQZQBF.js.map
+//# sourceMappingURL=chunk-BIIAMH47.js.map

package/dist/chunk-BIIAMH47.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CreatableSelect/CreatableSelect.tsx"],"sourcesContent":["'use client';\n\nimport type { Theme } from '@mui/material/styles/index.js';\nimport Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete/index.js';\nimport type { AutocompleteRenderInputParams } from '@mui/material/Autocomplete/index.js';\nimport CircularProgress from '@mui/material/CircularProgress/index.js';\nimport TextField from '@mui/material/TextField/index.js';\nimport { useId, useMemo } from 'react';\n\nimport { stackedOverlayZIndex } from '../../../tokens/layers';\nimport { FormControl, FormLabel, FormMessage } from '../Form';\nimport type { CreatableSelectOption, CreatableSelectProps } from './CreatableSelect.types';\nimport type { SizeValue } from '../../../tokens/scales';\n\nimport { fieldEdge } from '../../../tokens/field-edge';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { fieldControlStyles } from '../../../tokens/field-height';\n\n/** Internal option shape: a real option, or the synthetic \"create new\" row. */\ninterface InternalOption extends CreatableSelectOption {\n  /** True for the synthetic row that triggers {@link CreatableSelectProps.onCreate}. */\n  isCreate?: boolean;\n}\n\n/** Prefix that marks a synthetic create-row value so it can never collide with a real one. */\nconst CREATE_PREFIX = ' create:';\n\nconst filterOptions = createFilterOptions<InternalOption>();\n\n/** How far one nesting level indents a dropdown row, in px. */\nconst INDENT_STEP = 16;\n\n/** `sm`/`md` → MUI's own scale, the same mapping {@link Input} uses. */\n// All five house stops onto MUI's two. `xs`/`sm` draw small; `md` and up draw\n// medium, because an autocomplete field has no third or fourth height to give.\nconst MUI_SIZE = { xs: 'small', sm: 'small', md: 'medium', lg: 'medium', xl: 'medium' } as const;\n\n/** Match the outlined border treatment of `Input` so siblings look identical. */\nconst fieldSx = {\n  '& .MuiOutlinedInput-root': {\n    borderRadius: fieldRadiusPx,\n    '& fieldset': {\n      borderColor: (theme: Theme) => fieldEdge(theme),\n    },\n    '&:hover fieldset': { borderColor: 'primary.main' },\n    '&.Mui-focused fieldset': { borderColor: 'primary.main', borderWidth: 2 },\n    '&.Mui-error fieldset': { borderColor: 'error.main' },\n  },\n} as const;\n\n/**\n * The filter that appends the synthetic \"create\" row when the typed text matches\n * no existing option. Built per render from the two props it closes over.\n */\nfunction buildFilter(\n  onCreate: CreatableSelectProps['onCreate'],\n  createOptionLabel: (input: string) => string,\n) {\n  return (available: InternalOption[], params: { inputValue: string }): InternalOption[] => {\n    const filtered = filterOptions(available, params as Parameters<typeof filterOptions>[1]);\n    const input = params.inputValue.trim();\n    const alreadyExists = available.some(\n      (option) => option.label.toLowerCase() === input.toLowerCase(),\n    );\n    if (input && !alreadyExists && onCreate) {\n      filtered.push({\n        value: `${CREATE_PREFIX}${input}`,\n        label: createOptionLabel(input),\n        isCreate: true,\n      });\n    }\n    return filtered;\n  };\n}\n\n/**\n * A nested option is indented on its ROW; the label itself stays the bare name,\n * so the closed field never shows the tree drawing (see `depth`).\n */\nfunction renderIndentedOption(\n  props: React.HTMLAttributes<HTMLLIElement>,\n  option: InternalOption,\n): React.JSX.Element {\n  const { key, ...rest } = props as typeof props & { key?: string };\n  return (\n    <li\n      key={key ?? option.value}\n      {...rest}\n      style={{ paddingLeft: INDENT_STEP * (1 + (option.depth ?? 0)) }}\n    >\n      {option.label}\n    </li>\n  );\n}\n\n/** The text field Autocomplete renders, with the library's border + a loading adornment. */\nfunction renderField(\n  params: AutocompleteRenderInputParams,\n  field: {\n    inputId: string;\n    placeholder?: string;\n    error?: string;\n    loading: boolean;\n    size: SizeValue;\n    dataTestId: string;\n  },\n): React.JSX.Element {\n  return (\n    <TextField\n      {...params}\n      id={field.inputId}\n      placeholder={field.placeholder}\n      error={Boolean(field.error)}\n      size={MUI_SIZE[field.size]}\n      sx={[fieldSx, (theme) => fieldControlStyles(theme, field.size)]}\n      inputProps={{ ...params.inputProps, 'data-testid': `${field.dataTestId}-input` }}\n      slotProps={{\n        input: {\n          ...params.InputProps,\n          endAdornment: (\n            <>\n              {field.loading ? <CircularProgress color=\"inherit\" size={18} /> : null}\n              {params.InputProps.endAdornment}\n            </>\n          ),\n        },\n      }}\n    />\n  );\n}\n\n/**\n * The option list, plus the selected OBJECT MUI wants, from the controlled value.\n * `depth` is carried through: it is what {@link renderIndentedOption} draws.\n */\nfunction useInternalOptions(\n  options: CreatableSelectOption[],\n  value: string | null,\n): { items: InternalOption[]; selected: InternalOption | null } {\n  const items = useMemo<InternalOption[]>(\n    () => options.map(({ value: optionValue, label, depth }) => ({\n      value: optionValue,\n      label,\n      depth,\n    })),\n    [options],\n  );\n  const selected = useMemo<InternalOption | null>(\n    () => items.find((option) => option.value === value) ?? null,\n    [items, value],\n  );\n  return { items, selected };\n}\n\n/** Route a picked row: cleared, the synthetic create row, or a real option. */\nfunction handlePick(\n  next: InternalOption | null,\n  onChange: CreatableSelectProps['onChange'],\n  onCreate: CreatableSelectProps['onCreate'],\n): void {\n  if (!next) {\n    onChange(null);\n    return;\n  }\n  if (next.isCreate) {\n    void onCreate?.(next.value.slice(CREATE_PREFIX.length));\n    return;\n  }\n  onChange(next.value);\n}\n\n/**\n * A single-select, searchable combobox that can create a new option on the fly.\n *\n * Type to filter {@link CreatableSelectProps.options}; when the typed text matches\n * no option and {@link CreatableSelectProps.onCreate} is provided, a \"create\" row\n * appears and selecting it (Enter or click) calls `onCreate` with the raw text —\n * the parent persists it, then feeds the new option back via `options`/`value`.\n *\n * Chrome matches the library's other form fields: an external {@link FormLabel}\n * above the control (not a floating label), the same outlined border treatment as\n * {@link Input} and the same `sm`/`md` scale, so it lines up with sibling fields\n * in a grid row.\n */\nexport function CreatableSelect({\n  options,\n  value,\n  onChange,\n  onCreate,\n  label,\n  error,\n  placeholder,\n  createOptionLabel,\n  noOptionsText,\n  disabled = false,\n  loading = false,\n  fullWidth = true,\n  size = 'md',\n  dataTestId = 'creatable-select',\n}: CreatableSelectProps): React.JSX.Element {\n  const inputId = useId();\n  const { items, selected } = useInternalOptions(options, value);\n\n  return (\n    <FormControl fullWidth={fullWidth} error={Boolean(error)}>\n      {label && (\n        <FormLabel htmlFor={inputId} error={Boolean(error)}>\n          {label}\n        </FormLabel>\n      )}\n      <Autocomplete<InternalOption, false, false, false>\n        value={selected}\n        options={items}\n        disabled={disabled}\n        loading={loading}\n        fullWidth={fullWidth}\n        size={MUI_SIZE[size]}\n        handleHomeEndKeys\n        selectOnFocus\n        clearOnBlur\n        data-testid={dataTestId}\n        noOptionsText={noOptionsText}\n        // Lift the dropdown above stacked modals: the default popup z-index is\n        // `modal` (1300), but a stacked sheet at depth ≥2 sits at 1300 + depth*10,\n        // which would otherwise cover the options. The height is the token's\n        // now — this component used to be the only place the rule was written\n        // down, which is how `CategorySelect` came to be missing it (12-57).\n        slotProps={{ popper: { sx: { zIndex: stackedOverlayZIndex } } }}\n        getOptionLabel={(option) => (typeof option === 'string' ? option : option.label)}\n        isOptionEqualToValue={(option, current) => option.value === current.value}\n        renderOption={renderIndentedOption}\n        filterOptions={buildFilter(onCreate, createOptionLabel)}\n        onChange={(_event, next) => handlePick(next, onChange, onCreate)}\n        renderInput={(params) =>\n          renderField(params, { inputId, placeholder, error, loading, size, dataTestId })\n        }\n      />\n      {error && <FormMessage error dataTestId={`${dataTestId}-message`}>{error}</FormMessage>}\n    </FormControl>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-6VZYQC7T.js → chunk-BM4CGQED.js}

@@ -1,12 +1,12 @@
-import {
-  useMenubarMenus
-} from "./chunk-42VH7N5L.js";
 import {
   MenubarToolbar
-} from "./chunk-NFJUBPIN.js";
+} from "./chunk-4LMY5I5E.js";
 import {
   barStyles
-} from "./chunk-7YTLJUBX.js";
+} from "./chunk-KJHQYPKT.js";
+import {
+  useMenubarMenus
+} from "./chunk-42VH7N5L.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
@@ -190,4 +190,4 @@ export {
   Menubar,
   MenubarGroup
 };
-//# sourceMappingURL=chunk-6VZYQC7T.js.map
+//# sourceMappingURL=chunk-BM4CGQED.js.map

package/dist/{chunk-JOPTI47I.js → chunk-BM4ZPBBT.js}

@@ -6,10 +6,10 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Button
-} from "./chunk-X2R7QG5I.js";
+} from "./chunk-6MDBMCFK.js";
 import {
   Text
-} from "./chunk-QNUWSXF2.js";
+} from "./chunk-H57ZS6W2.js";
 
 // src/components/data-display/DataViews/data-views-select-all-strip.tsx
 import Checkbox from "@mui/material/Checkbox/index.js";
@@ -85,4 +85,4 @@ function SelectAllStrip({
 export {
   SelectAllStrip
 };
-//# sourceMappingURL=chunk-JOPTI47I.js.map
+//# sourceMappingURL=chunk-BM4ZPBBT.js.map

package/dist/{chunk-VGSEI7PQ.js → chunk-BTIBFR5L.js}

@@ -5,7 +5,7 @@ import {
   getColorFromTheme,
   getSizeStyles,
   pulseAnimation
-} from "./chunk-2YOQLBEX.js";
+} from "./chunk-OZZNC4YU.js";
 import {
   progressLabelText,
   resolveProgressProps
@@ -237,4 +237,4 @@ Progress.displayName = "Progress";
 export {
   Progress
 };
-//# sourceMappingURL=chunk-VGSEI7PQ.js.map
+//# sourceMappingURL=chunk-BTIBFR5L.js.map

package/dist/{chunk-6SXZ7CF2.js → chunk-BTVIHTAL.js}

@@ -1,3 +1,6 @@
+import {
+  fieldHeight
+} from "./chunk-CGO452DC.js";
 import {
   fieldRadiusPx
 } from "./chunk-GDN2LUTZ.js";
@@ -56,7 +59,7 @@ function ViewSelector({
         "aria-haspopup": "menu",
         "aria-expanded": open,
         onClick: (event) => setAnchorEl(event.currentTarget),
-        sx: { minWidth: 0, height: 32, px: 1, gap: 1, borderRadius: fieldRadiusPx, color: "text.secondary" },
+        sx: { minWidth: 0, height: fieldHeight, px: 1, gap: 1, borderRadius: fieldRadiusPx, color: "text.secondary" },
         children: [
           /* @__PURE__ */ jsx(ActiveIcon, { sx: { fontSize: 16 } }),
           /* @__PURE__ */ jsx(ChevronDownIcon, { sx: { fontSize: 14 } })
@@ -101,4 +104,4 @@ function ViewSelector({
 export {
   ViewSelector
 };
-//# sourceMappingURL=chunk-6SXZ7CF2.js.map
+//# sourceMappingURL=chunk-BTVIHTAL.js.map

package/dist/chunk-BTVIHTAL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/ContentToolbar/ViewSelector.tsx"],"sourcesContent":["'use client';\n\nimport CheckIcon from '@mui/icons-material/Check';\nimport ChevronDownIcon from '@mui/icons-material/KeyboardArrowDown';\nimport GridIcon from '@mui/icons-material/GridViewOutlined';\nimport ListIcon from '@mui/icons-material/FormatListBulletedRounded';\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport ListItemIcon from '@mui/material/ListItemIcon/index.js';\nimport ListItemText from '@mui/material/ListItemText/index.js';\nimport Menu from '@mui/material/Menu/index.js';\nimport MenuItem from '@mui/material/MenuItem/index.js';\nimport Slider from '@mui/material/Slider/index.js';\n// `SvgIconComponent` is declared inline in @mui/icons-material's barrel and has\n// no module of its own, so the deep-import equivalent is its own definition:\n// `type SvgIconComponent = typeof SvgIcon`.\nimport type SvgIcon from '@mui/material/SvgIcon/index.js';\nimport React, { useState } from 'react';\n\nimport type { ViewMode, ViewSelectorProps } from './ContentToolbar.types';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { fieldHeight } from '../../../tokens/field-height';\n\nconst VIEW_OPTIONS: { value: ViewMode; label: string; icon: typeof SvgIcon }[] = [\n  { value: 'grid', label: 'Grid View', icon: GridIcon },\n  { value: 'list', label: 'List View', icon: ListIcon },\n];\n\n/**\n * View selector: a grid/list dropdown plus a card-size zoom slider (grid mode\n * only). Faithful MUI port of the reference toolbar's view control.\n */\nexport function ViewSelector({\n  viewMode,\n  onViewModeChange,\n  zoom,\n  onZoomChange,\n  cardSizeLabel,\n}: ViewSelectorProps): React.JSX.Element {\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const open = Boolean(anchorEl);\n  const activeOption = VIEW_OPTIONS.find((option) => option.value === viewMode) ?? VIEW_OPTIONS[0]!;\n  const ActiveIcon = activeOption.icon;\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 1.5 }}>\n      {viewMode === 'grid' && (\n        <Box sx={{ width: 96, display: 'flex', alignItems: 'center' }}>\n          <Slider\n            data-testid=\"resize-card-slider\"\n            aria-label={cardSizeLabel}\n            value={zoom[0] ?? 0}\n            onChange={(_, value) => onZoomChange([value as number])}\n            min={0}\n            max={100}\n            step={1}\n            size=\"small\"\n          />\n        </Box>\n      )}\n\n      <Button\n        data-testid=\"view-mode-btn\"\n        variant=\"text\"\n        size=\"small\"\n        color=\"inherit\"\n        aria-label={activeOption.label}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        onClick={(event) => setAnchorEl(event.currentTarget)}\n        sx={{ minWidth: 0, height: fieldHeight, px: 1, gap: 1, borderRadius: fieldRadiusPx, color: 'text.secondary' }}\n      >\n        <ActiveIcon sx={{ fontSize: 16 }} />\n        <ChevronDownIcon sx={{ fontSize: 14 }} />\n      </Button>\n      <Menu\n        anchorEl={anchorEl}\n        open={open}\n        onClose={() => setAnchorEl(null)}\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n        transformOrigin={{ vertical: 'top', horizontal: 'right' }}\n        slotProps={{ paper: { sx: { minWidth: 180 } } }}\n      >\n        {VIEW_OPTIONS.map((option) => {\n          const OptionIcon = option.icon;\n          const selected = viewMode === option.value;\n          return (\n            <MenuItem\n              key={option.value}\n              data-testid={`view-mode-${option.value}`}\n              onClick={() => {\n                onViewModeChange(option.value);\n                setAnchorEl(null);\n              }}\n              sx={{ gap: 1.5 }}\n            >\n              <ListItemText>{option.label}</ListItemText>\n              <OptionIcon sx={{ fontSize: 16, color: 'text.secondary' }} />\n              <ListItemIcon sx={{ minWidth: 'auto !important' }}>\n                <CheckIcon sx={{ fontSize: 16, color: selected ? 'text.primary' : 'transparent' }} />\n              </ListItemIcon>\n            </MenuItem>\n          );\n        })}\n      </Menu>\n    </Box>\n  );\n}\n"],"mappings":";;;;;;;;AAEA,OAAO,eAAe;AACtB,OAAO,qBAAqB;AAC5B,OAAO,cAAc;AACrB,OAAO,cAAc;AACrB,OAAO,SAAS;AAChB,OAAO,YAAY;AACnB,OAAO,kBAAkB;AACzB,OAAO,kBAAkB;AACzB,OAAO,UAAU;AACjB,OAAO,cAAc;AACrB,OAAO,YAAY;AAKnB,SAAgB,gBAAgB;AA+BtB,cAaJ,YAbI;AAzBV,IAAM,eAA2E;AAAA,EAC/E,EAAE,OAAO,QAAQ,OAAO,aAAa,MAAM,SAAS;AAAA,EACpD,EAAE,OAAO,QAAQ,OAAO,aAAa,MAAM,SAAS;AACtD;AAMO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAyC;AACvC,QAAM,CAAC,UAAU,WAAW,IAAI,SAA6B,IAAI;AACjE,QAAM,OAAO,QAAQ,QAAQ;AAC7B,QAAM,eAAe,aAAa,KAAK,CAAC,WAAW,OAAO,UAAU,QAAQ,KAAK,aAAa,CAAC;AAC/F,QAAM,aAAa,aAAa;AAEhC,SACE,qBAAC,OAAI,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,IAAI,GACxD;AAAA,iBAAa,UACZ,oBAAC,OAAI,IAAI,EAAE,OAAO,IAAI,SAAS,QAAQ,YAAY,SAAS,GAC1D;AAAA,MAAC;AAAA;AAAA,QACC,eAAY;AAAA,QACZ,cAAY;AAAA,QACZ,OAAO,KAAK,CAAC,KAAK;AAAA,QAClB,UAAU,CAAC,GAAG,UAAU,aAAa,CAAC,KAAe,CAAC;AAAA,QACtD,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,MAAK;AAAA;AAAA,IACP,GACF;AAAA,IAGF;AAAA,MAAC;AAAA;AAAA,QACC,eAAY;AAAA,QACZ,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,OAAM;AAAA,QACN,cAAY,aAAa;AAAA,QACzB,iBAAc;AAAA,QACd,iBAAe;AAAA,QACf,SAAS,CAAC,UAAU,YAAY,MAAM,aAAa;AAAA,QACnD,IAAI,EAAE,UAAU,GAAG,QAAQ,aAAa,IAAI,GAAG,KAAK,GAAG,cAAc,eAAe,OAAO,iBAAiB;AAAA,QAE5G;AAAA,8BAAC,cAAW,IAAI,EAAE,UAAU,GAAG,GAAG;AAAA,UAClC,oBAAC,mBAAgB,IAAI,EAAE,UAAU,GAAG,GAAG;AAAA;AAAA;AAAA,IACzC;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,SAAS,MAAM,YAAY,IAAI;AAAA,QAC/B,cAAc,EAAE,UAAU,UAAU,YAAY,QAAQ;AAAA,QACxD,iBAAiB,EAAE,UAAU,OAAO,YAAY,QAAQ;AAAA,QACxD,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,IAAI,EAAE,EAAE;AAAA,QAE7C,uBAAa,IAAI,CAAC,WAAW;AAC5B,gBAAM,aAAa,OAAO;AAC1B,gBAAM,WAAW,aAAa,OAAO;AACrC,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,eAAa,aAAa,OAAO,KAAK;AAAA,cACtC,SAAS,MAAM;AACb,iCAAiB,OAAO,KAAK;AAC7B,4BAAY,IAAI;AAAA,cAClB;AAAA,cACA,IAAI,EAAE,KAAK,IAAI;AAAA,cAEf;AAAA,oCAAC,gBAAc,iBAAO,OAAM;AAAA,gBAC5B,oBAAC,cAAW,IAAI,EAAE,UAAU,IAAI,OAAO,iBAAiB,GAAG;AAAA,gBAC3D,oBAAC,gBAAa,IAAI,EAAE,UAAU,kBAAkB,GAC9C,8BAAC,aAAU,IAAI,EAAE,UAAU,IAAI,OAAO,WAAW,iBAAiB,cAAc,GAAG,GACrF;AAAA;AAAA;AAAA,YAZK,OAAO;AAAA,UAad;AAAA,QAEJ,CAAC;AAAA;AAAA,IACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/{chunk-YXQ2NJHF.js → chunk-C423YJGN.js}

@@ -1,17 +1,17 @@
-import {
-  useFleetMap
-} from "./chunk-ZCPSND5Y.js";
 import {
   FleetBody
-} from "./chunk-ATBT4RJZ.js";
+} from "./chunk-57C636A6.js";
 import {
   FLEET_DEFAULT_LAGGING_AFTER_SECONDS,
   FLEET_DEFAULT_STALE_AFTER_SECONDS,
   FLEET_PANEL
 } from "./chunk-BTQZ3EX3.js";
+import {
+  useFleetMap
+} from "./chunk-ZCPSND5Y.js";
 import {
   SR_ONLY_SX
-} from "./chunk-RQFBLYYH.js";
+} from "./chunk-XI2BXMBX.js";
 import {
   EmptyState
 } from "./chunk-25R3ITGZ.js";
@@ -113,4 +113,4 @@ export {
   FleetMap,
   FleetMap_default
 };
-//# sourceMappingURL=chunk-YXQ2NJHF.js.map
+//# sourceMappingURL=chunk-C423YJGN.js.map

package/dist/{chunk-DV42HAVP.js → chunk-CDNJOA3N.js}

@@ -5,11 +5,18 @@ import {
   slideAnimation
 } from "./chunk-65CEXQ4L.js";
 import {
-  fieldEdge
-} from "./chunk-7FDU3FIN.js";
+  asFieldSize,
+  fieldHeight
+} from "./chunk-CGO452DC.js";
 import {
   fieldRadius
 } from "./chunk-GDN2LUTZ.js";
+import {
+  fieldEdge
+} from "./chunk-7FDU3FIN.js";
+import {
+  FIELD_BORDER_WIDTH
+} from "./chunk-PZBK3F52.js";
 
 // src/components/form/RadioGroup/RadioGroup.styles.ts
 import { alpha } from "@mui/material/styles/index.js";
@@ -140,7 +147,7 @@ var buttonBase = (theme, flags, palette) => {
     borderRadius: fieldRadius(theme),
     transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
     fontWeight: 500,
-    border: `2px solid ${selected ? palette.main : fieldEdge(theme)}`,
+    border: `${FIELD_BORDER_WIDTH}px solid ${selected ? palette.main : fieldEdge(theme)}`,
     backgroundColor: selected ? palette.main : "transparent",
     color: selected ? palette.contrastText || "#fff" : theme.palette.text.primary,
     position: "relative",
@@ -171,7 +178,11 @@ var buttonBase = (theme, flags, palette) => {
       boxShadow: `0 4px 12px ${alpha(palette.main, 0.2)}`
     },
     "&:active": { transform: "scale(0.98)" },
-    ...pickSize(BUTTON_SIZES, customSize)
+    ...pickSize(BUTTON_SIZES, customSize),
+    // The theme's field height for the size, in place of the table's own.
+    minHeight: fieldHeight(theme, asFieldSize(customSize)),
+    paddingTop: 0,
+    paddingBottom: 0
   };
 };
 var buttonRadioSx = (theme, flags) => {
@@ -235,7 +246,11 @@ var segmentButtonSx = (theme, flags) => {
       "&::before": { width: "100%", left: 0, transform: "translateX(0)" }
     },
     "&:active": { transform: "scale(0.98)" },
-    ...pickSize(SEGMENT_SIZES, customSize)
+    ...pickSize(SEGMENT_SIZES, customSize),
+    // Each segment is a field; the track around it adds its own inset.
+    minHeight: fieldHeight(theme, asFieldSize(customSize)),
+    paddingTop: 0,
+    paddingBottom: 0
   };
 };
 
@@ -246,4 +261,4 @@ export {
   segmentContainerSx,
   segmentButtonSx
 };
-//# sourceMappingURL=chunk-DV42HAVP.js.map
+//# sourceMappingURL=chunk-CDNJOA3N.js.map