@12-apps/ui 6.36.0 → 6.38.0

package/dist/chunk-QXSW3CNN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CreatableSelect/CreatableSelect.tsx"],"sourcesContent":["'use client';\n\nimport { useTheme, 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';\nimport { rem, sxRem } from '../../../tokens/relative';\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/** A dropdown row's left inset at `depth`: one 16px step per level, plus the first, through the type scale. */\nconst rowInset = (theme: Theme, depth: number): string => rem(theme, 16 * (1 + depth));\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: sxRem(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  theme: Theme,\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: rowInset(theme, 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    theme: Theme;\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={rem(field.theme, 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 theme = useTheme();\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={(props, option) => renderIndentedOption(props, option, theme)}\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, theme })\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-LMXWI3DD.js → chunk-QYY37ECA.js}

@@ -1,3 +1,6 @@
+import {
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
 import {
   stackedOverlayZIndex
 } from "./chunk-MFU4Y25U.js";
@@ -38,7 +41,7 @@ function CategoryPanelSurface({
       transformOrigin: { vertical: "top", horizontal: "left" },
       marginThreshold: 8,
       sx: ABOVE_SHEETS,
-      slotProps: { paper: { sx: { ...BARE_PAPER, marginTop: "6px", overflow: "visible" } } },
+      slotProps: { paper: { sx: { ...BARE_PAPER, marginTop: sxRem(6), overflow: "visible" } } },
       children
     }
   );
@@ -47,4 +50,4 @@ function CategoryPanelSurface({
 export {
   CategoryPanelSurface
 };
-//# sourceMappingURL=chunk-LMXWI3DD.js.map
+//# sourceMappingURL=chunk-QYY37ECA.js.map

package/dist/chunk-QYY37ECA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CategorySelect/CategoryPanelSurface.tsx"],"sourcesContent":["'use client';\n\nimport Drawer from '@mui/material/Drawer/index.js';\nimport Popover from '@mui/material/Popover/index.js';\n\nimport { stackedOverlayZIndex } from '../../../tokens/layers';\nimport { sxRem } from '../../../tokens/relative';\n\n/** Chrome-free surface props: the panel draws its own border and shadow. */\nconst BARE_PAPER = { background: 'transparent', boxShadow: 'none' } as const;\n\n/**\n * Both surfaces clear the sheet ladder rather than taking MUI's default.\n *\n * A `Popover` defaults to `zIndex.modal` and a temporary `Drawer` to\n * `zIndex.drawer`, one step lower still — and `StackedModal` gives its second\n * panel 1310. So this panel opened UNDER the sheet that opened it, and, being a\n * live modal with an unreachable backdrop, took the focus of every field around\n * it with no way to dismiss it (12-57). See `tokens/layers`.\n */\nconst ABOVE_SHEETS = { zIndex: stackedOverlayZIndex } as const;\n\ninterface SurfaceProps {\n  open: boolean;\n  /** True below the sheet breakpoint — anchor to the bottom edge instead. */\n  sheet: boolean;\n  anchorEl: HTMLElement | null;\n  onClose: () => void;\n  children: React.ReactNode;\n}\n\n/**\n * Where the panel lives: anchored under the trigger on a pointer, or a bottom\n * sheet on a phone.\n *\n * Both surfaces are modal, which is what gives the panel its dismiss-on-outside,\n * Esc handling and focus containment for free rather than hand-rolled.\n */\nexport function CategoryPanelSurface({\n  open,\n  sheet,\n  anchorEl,\n  onClose,\n  children,\n}: SurfaceProps): React.JSX.Element {\n  if (sheet) {\n    return (\n      <Drawer\n        anchor=\"bottom\"\n        open={open}\n        onClose={onClose}\n        sx={ABOVE_SHEETS}\n        slotProps={{ paper: { sx: BARE_PAPER } }}\n      >\n        {children}\n      </Drawer>\n    );\n  }\n  return (\n    <Popover\n      open={open}\n      anchorEl={anchorEl}\n      onClose={onClose}\n      anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}\n      transformOrigin={{ vertical: 'top', horizontal: 'left' }}\n      marginThreshold={8}\n      sx={ABOVE_SHEETS}\n      slotProps={{ paper: { sx: { ...BARE_PAPER, marginTop: sxRem(6), overflow: 'visible' } } }}\n    >\n      {children}\n    </Popover>\n  );\n}\n"],"mappings":";;;;;;;;AAEA,OAAO,YAAY;AACnB,OAAO,aAAa;AA4Cd;AAtCN,IAAM,aAAa,EAAE,YAAY,eAAe,WAAW,OAAO;AAWlE,IAAM,eAAe,EAAE,QAAQ,qBAAqB;AAkB7C,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAoC;AAClC,MAAI,OAAO;AACT,WACE;AAAA,MAAC;AAAA;AAAA,QACC,QAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA,IAAI;AAAA,QACJ,WAAW,EAAE,OAAO,EAAE,IAAI,WAAW,EAAE;AAAA,QAEtC;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,cAAc,EAAE,UAAU,UAAU,YAAY,OAAO;AAAA,MACvD,iBAAiB,EAAE,UAAU,OAAO,YAAY,OAAO;AAAA,MACvD,iBAAiB;AAAA,MACjB,IAAI;AAAA,MACJ,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,YAAY,WAAW,MAAM,CAAC,GAAG,UAAU,UAAU,EAAE,EAAE;AAAA,MAEvF;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/{chunk-ROT57BP4.js → chunk-R2XVTUVR.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Text
-} from "./chunk-WTOYEWW6.js";
+} from "./chunk-YBH4SPMM.js";
 import {
   sxRem
 } from "./chunk-YKCAJ2TN.js";
@@ -184,4 +184,4 @@ function MoveButton({
 export {
   ColumnsTab
 };
-//# sourceMappingURL=chunk-ROT57BP4.js.map
+//# sourceMappingURL=chunk-R2XVTUVR.js.map

package/dist/{chunk-V74PXUQN.js → chunk-R6SN73RX.js}

@@ -1,22 +1,22 @@
 import {
   GridMain
-} from "./chunk-JJSZP3TW.js";
+} from "./chunk-I4QA2F4L.js";
 import {
   FilterDialog,
   GridFilterPanel
-} from "./chunk-QIKPGMMO.js";
+} from "./chunk-H67EL3CG.js";
 import {
   DataViewsEmpty
-} from "./chunk-5UTAEHSB.js";
+} from "./chunk-L7NQCLFU.js";
 import {
   InlineFilterControls
-} from "./chunk-SYVNWXVW.js";
+} from "./chunk-DUBTI4DI.js";
 import {
   GridHeaderRow
-} from "./chunk-KK57AHWS.js";
+} from "./chunk-OAEYCKBN.js";
 import {
   DataViewsPagination
-} from "./chunk-CRZXSZ5O.js";
+} from "./chunk-2S752BIJ.js";
 import {
   toOverflowFields,
   useFilterOverflow
@@ -26,23 +26,23 @@ import {
 } from "./chunk-KX75HM5U.js";
 import {
   ScopeTabsSlot
-} from "./chunk-AK2HOD6B.js";
+} from "./chunk-H5BEWPEY.js";
 import {
   ShellToolbar
-} from "./chunk-CHFHILTM.js";
+} from "./chunk-XJJXBUPN.js";
 import {
   togglePillValues
-} from "./chunk-KJK2Q35C.js";
+} from "./chunk-PPRV4LTM.js";
 import {
   DataViewsLayoutProvider,
   useDataViewsLayout
-} from "./chunk-4LQZH4PU.js";
+} from "./chunk-PMOEG36E.js";
 import {
   useDataViewsCopy
 } from "./chunk-KHG57NAE.js";
 import {
   TableFilter
-} from "./chunk-HXEBKOSM.js";
+} from "./chunk-J5UZB6Y6.js";
 import {
   default as default2
 } from "./chunk-WEBEOBN5.js";
@@ -238,4 +238,4 @@ function GridShell(props) {
 export {
   GridShell
 };
-//# sourceMappingURL=chunk-V74PXUQN.js.map
+//# sourceMappingURL=chunk-R6SN73RX.js.map

package/dist/{chunk-VECWMANF.js → chunk-RDCHT2WN.js}

@@ -8,6 +8,9 @@ import {
 import {
   fieldEdge
 } from "./chunk-7FDU3FIN.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/form/AddressAutocomplete/AddressTextField.tsx
 import TextField from "@mui/material/TextField/index.js";
@@ -18,8 +21,8 @@ var GlassTextField = styled(TextField)(({ theme }) => ({
   "& .MuiOutlinedInput-root": {
     borderRadius: fieldRadius(theme),
     background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.8)} 0%, ${alpha(theme.palette.background.paper, 0.6)} 100%)`,
-    backdropFilter: "blur(10px)",
-    WebkitBackdropFilter: "blur(10px)",
+    backdropFilter: `blur(${rem(theme, 10)})`,
+    WebkitBackdropFilter: `blur(${rem(theme, 10)})`,
     border: `1px solid ${fieldEdge(theme)}`,
     transition: theme.transitions.create(["border-color", "box-shadow", "background"]),
     "&:hover": {
@@ -28,7 +31,7 @@ var GlassTextField = styled(TextField)(({ theme }) => ({
     },
     "&.Mui-focused": {
       background: theme.palette.background.paper,
-      boxShadow: `0 0 0 2px ${alpha(theme.palette.primary.main, 0.25)}`
+      boxShadow: `0 0 0 ${rem(theme, 2)} ${alpha(theme.palette.primary.main, 0.25)}`
     },
     "& fieldset": {
       border: "none"
@@ -41,4 +44,4 @@ var AddressTextField = ({ addressVariant, ...props }) => addressVariant === "gla
 export {
   AddressTextField
 };
-//# sourceMappingURL=chunk-VECWMANF.js.map
+//# sourceMappingURL=chunk-RDCHT2WN.js.map

package/dist/chunk-RDCHT2WN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/AddressAutocomplete/AddressTextField.tsx"],"sourcesContent":["import type { TextFieldProps } from '@mui/material/TextField/index.js';\nimport TextField from '@mui/material/TextField/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport type { FC } from 'react';\nimport React from 'react';\n\nimport type { AddressAutocompleteProps } from './AddressAutocomplete.types';\n\nimport { fieldEdge } from '../../../tokens/field-edge';\nimport { fieldRadius } from '../../../tokens/field-radius';\nimport { fieldControlStyles, fieldTextFieldStyles } from '../../../tokens/field-height';\nimport { rem } from '../../../tokens/relative';\n\n// Kept module-local on purpose: the inferred type of a styled() component cannot\n// be named across a module boundary here (TS2742), so the plain component below\n// is what the rest of the folder imports.\nconst GlassTextField = styled(TextField)(({ theme }) => ({\n  ...fieldControlStyles(theme),\n  '& .MuiOutlinedInput-root': {\n    borderRadius: fieldRadius(theme),\n    background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.8)} 0%, ${alpha(theme.palette.background.paper, 0.6)} 100%)`,\n    backdropFilter: `blur(${rem(theme, 10)})`,\n    WebkitBackdropFilter: `blur(${rem(theme, 10)})`,\n    border: `1px solid ${fieldEdge(theme)}`,\n    transition: theme.transitions.create(['border-color', 'box-shadow', 'background']),\n    '&:hover': {\n      background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.9)} 0%, ${alpha(theme.palette.background.paper, 0.7)} 100%)`,\n      borderColor: theme.palette.primary.main,\n    },\n    '&.Mui-focused': {\n      background: theme.palette.background.paper,\n      boxShadow: `0 0 0 ${rem(theme, 2)} ${alpha(theme.palette.primary.main, 0.25)}`,\n    },\n    '& fieldset': {\n      border: 'none',\n    },\n  },\n}));\n\n/** The plain variants: MUI's own field, on the theme's field radius. */\nconst FieldTextField = styled(TextField)(({ theme }) => fieldTextFieldStyles(theme));\n\nexport type AddressTextFieldProps = Omit<TextFieldProps, 'variant'> & {\n  addressVariant: AddressAutocompleteProps['variant'];\n};\n\n// 'glass' is not a MUI variant: it renders the outlined field with the frosted\n// treatment on top.\nexport const AddressTextField: FC<AddressTextFieldProps> = ({ addressVariant, ...props }) =>\n  addressVariant === 'glass' ? (\n    <GlassTextField variant=\"outlined\" {...props} />\n  ) : (\n    <FieldTextField variant={addressVariant} {...props} />\n  );\n"],"mappings":";;;;;;;;;;;;;;;AACA,OAAO,eAAe;AACtB,SAAS,OAAO,cAAc;AAgD1B;AAlCJ,IAAM,iBAAiB,OAAO,SAAS,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACvD,GAAG,mBAAmB,KAAK;AAAA,EAC3B,4BAA4B;AAAA,IAC1B,cAAc,YAAY,KAAK;AAAA,IAC/B,YAAY,2BAA2B,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC,QAAQ,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC;AAAA,IACnI,gBAAgB,QAAQ,IAAI,OAAO,EAAE,CAAC;AAAA,IACtC,sBAAsB,QAAQ,IAAI,OAAO,EAAE,CAAC;AAAA,IAC5C,QAAQ,aAAa,UAAU,KAAK,CAAC;AAAA,IACrC,YAAY,MAAM,YAAY,OAAO,CAAC,gBAAgB,cAAc,YAAY,CAAC;AAAA,IACjF,WAAW;AAAA,MACT,YAAY,2BAA2B,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC,QAAQ,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC;AAAA,MACnI,aAAa,MAAM,QAAQ,QAAQ;AAAA,IACrC;AAAA,IACA,iBAAiB;AAAA,MACf,YAAY,MAAM,QAAQ,WAAW;AAAA,MACrC,WAAW,SAAS,IAAI,OAAO,CAAC,CAAC,IAAI,MAAM,MAAM,QAAQ,QAAQ,MAAM,IAAI,CAAC;AAAA,IAC9E;AAAA,IACA,cAAc;AAAA,MACZ,QAAQ;AAAA,IACV;AAAA,EACF;AACF,EAAE;AAGF,IAAM,iBAAiB,OAAO,SAAS,EAAE,CAAC,EAAE,MAAM,MAAM,qBAAqB,KAAK,CAAC;AAQ5E,IAAM,mBAA8C,CAAC,EAAE,gBAAgB,GAAG,MAAM,MACrF,mBAAmB,UACjB,oBAAC,kBAAe,SAAQ,YAAY,GAAG,OAAO,IAE9C,oBAAC,kBAAe,SAAS,gBAAiB,GAAG,OAAO;","names":[]}

package/dist/{chunk-35ETD7ML.js → chunk-RIEV4VXF.js}

@@ -1,14 +1,18 @@
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
+
 // src/components/form/Switch/Switch.animations.ts
 import { keyframes } from "@mui/material/styles/index.js";
-var glowAnimation = keyframes`
+var glowAnimation = (theme) => keyframes`
   0% {
-    box-shadow: 0 0 5px currentColor;
+    box-shadow: 0 0 ${rem(theme, 5)} currentColor;
   }
   50% {
-    box-shadow: 0 0 15px currentColor, 0 0 25px currentColor;
+    box-shadow: 0 0 ${rem(theme, 15)} currentColor, 0 0 ${rem(theme, 25)} currentColor;
   }
   100% {
-    box-shadow: 0 0 5px currentColor;
+    box-shadow: 0 0 ${rem(theme, 5)} currentColor;
   }
 `;
 var bounceAnimation = keyframes`
@@ -64,4 +68,4 @@ export {
   spinAnimation,
   shimmerAnimation
 };
-//# sourceMappingURL=chunk-35ETD7ML.js.map
+//# sourceMappingURL=chunk-RIEV4VXF.js.map

package/dist/chunk-RIEV4VXF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/Switch/Switch.animations.ts"],"sourcesContent":["import { keyframes } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\n\nimport { rem } from '../../../tokens/relative';\n\nexport const glowAnimation = (theme: Theme) => keyframes`\n  0% {\n    box-shadow: 0 0 ${rem(theme, 5)} currentColor;\n  }\n  50% {\n    box-shadow: 0 0 ${rem(theme, 15)} currentColor, 0 0 ${rem(theme, 25)} currentColor;\n  }\n  100% {\n    box-shadow: 0 0 ${rem(theme, 5)} currentColor;\n  }\n`;\n\nexport const bounceAnimation = keyframes`\n  0%, 100% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.1);\n  }\n`;\n\nexport const pulseAnimation = keyframes`\n  0%, 100% {\n    opacity: 1;\n    transform: scale(1);\n  }\n  50% {\n    opacity: 0.7;\n    transform: scale(0.95);\n  }\n`;\n\nexport const rippleAnimation = keyframes`\n  0% {\n    transform: scale(0);\n    opacity: 1;\n  }\n  100% {\n    transform: scale(2);\n    opacity: 0;\n  }\n`;\n\nexport const spinAnimation = keyframes`\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n`;\n\nexport const shimmerAnimation = keyframes`\n  0% {\n    background-position: -200% 50%;\n  }\n  100% {\n    background-position: 200% 50%;\n  }\n`;\n"],"mappings":";;;;;AAAA,SAAS,iBAAiB;AAKnB,IAAM,gBAAgB,CAAC,UAAiB;AAAA;AAAA,sBAEzB,IAAI,OAAO,CAAC,CAAC;AAAA;AAAA;AAAA,sBAGb,IAAI,OAAO,EAAE,CAAC,sBAAsB,IAAI,OAAO,EAAE,CAAC;AAAA;AAAA;AAAA,sBAGlD,IAAI,OAAO,CAAC,CAAC;AAAA;AAAA;AAI5B,IAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASxB,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvB,IAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWxB,IAAM,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAStB,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}

package/dist/{chunk-MVKYNDT2.js → chunk-RKROWJVF.js}

@@ -5,7 +5,9 @@ import {
   sheen
 } from "./chunk-FQ6UW7IY.js";
 import {
-  rem
+  rem,
+  rems,
+  sxRem
 } from "./chunk-YKCAJ2TN.js";
 
 // src/components/navigation/ContextMenu/ContextMenu.tsx
@@ -22,13 +24,13 @@ var StyledMenu = styled(Menu, {
   shouldForwardProp: (prop) => prop !== "customVariant" && prop !== "size"
 })(({ theme, customVariant, size }) => ({
   "& .MuiPaper-root": {
-    minWidth: 160,
+    minWidth: rem(theme, 160),
     borderRadius: theme.spacing(1),
     ...customVariant === "glass" && {
       backgroundColor: alpha(theme.palette.background.paper, 0.85),
-      backdropFilter: "blur(20px)",
+      backdropFilter: `blur(${rem(theme, 20)})`,
       border: `1px solid ${alpha(theme.palette.divider, 0.1)}`,
-      boxShadow: `0 8px 32px ${shadowInk(theme, 0.12)}`
+      boxShadow: `0 ${rems(theme, 8, 32)} ${shadowInk(theme, 0.12)}`
     },
     ...customVariant === "dark" && {
       backgroundColor: alpha(neutralTones(theme).inverseSurface, 0.95),
@@ -46,14 +48,14 @@ var StyledMenu = styled(Menu, {
     ...size === "sm" && {
       "& .MuiMenuItem-root": {
         fontSize: rem(theme, 14),
-        minHeight: 32,
+        minHeight: rem(theme, 32),
         padding: theme.spacing(0.5, 1.5)
       }
     },
     ...size === "lg" && {
       "& .MuiMenuItem-root": {
         fontSize: rem(theme, 18),
-        minHeight: 48,
+        minHeight: rem(theme, 48),
         padding: theme.spacing(1.5, 2)
       }
     }
@@ -91,7 +93,7 @@ var MenuHeader = styled(Typography)(({ theme }) => ({
   fontWeight: 600,
   textTransform: "uppercase",
   color: theme.palette.text.secondary,
-  letterSpacing: 0.5
+  letterSpacing: rem(theme, 0.5)
 }));
 var ShortcutText = styled(Typography)(({ theme }) => ({
   fontSize: rem(theme, 12),
@@ -115,7 +117,7 @@ var renderMenuItem = (item, handleItemClick, size) => {
       color: item.color,
       dangerous: item.dangerous,
       children: [
-        hasIcon && /* @__PURE__ */ jsx(ListItemIcon, { sx: { minWidth: size === "sm" ? 32 : 40 }, children: item.icon }),
+        hasIcon && /* @__PURE__ */ jsx(ListItemIcon, { sx: { minWidth: sxRem(size === "sm" ? 32 : 40) }, children: item.icon }),
         /* @__PURE__ */ jsx(ListItemText, { primary: item.label }),
         item.shortcut && /* @__PURE__ */ jsx(ShortcutText, { variant: "caption", children: item.shortcut })
       ]
@@ -211,4 +213,4 @@ ContextMenu.displayName = "ContextMenu";
 export {
   ContextMenu
 };
-//# sourceMappingURL=chunk-MVKYNDT2.js.map
+//# sourceMappingURL=chunk-RKROWJVF.js.map

package/dist/chunk-RKROWJVF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import Divider from '@mui/material/Divider/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 Typography from '@mui/material/Typography/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\nimport React, { cloneElement, isValidElement,useState } from 'react';\n\nimport type { ContextMenuItem,ContextMenuProps } from './ContextMenu.types';\nimport { absoluteInk, neutralTones, shadowInk, sheen } from '../../../tokens/ink';\nimport { rem, rems, sxRem } from '../../../tokens/relative';\n\nconst StyledMenu = styled(Menu, {\n  shouldForwardProp: (prop) => prop !== 'customVariant' && prop !== 'size',\n})<{ customVariant?: string; size?: string }>(({ theme, customVariant, size }) => ({\n  '& .MuiPaper-root': {\n    minWidth: rem(theme, 160),\n    borderRadius: theme.spacing(1),\n\n    ...(customVariant === 'glass' && {\n      backgroundColor: alpha(theme.palette.background.paper, 0.85),\n      backdropFilter: `blur(${rem(theme, 20)})`,\n      border: `1px solid ${alpha(theme.palette.divider, 0.1)}`,\n      boxShadow: `0 ${rems(theme, 8, 32)} ${shadowInk(theme, 0.12)}`,\n    }),\n\n    ...(customVariant === 'dark' && {\n      backgroundColor: alpha(neutralTones(theme).inverseSurface, 0.95),\n      color: absoluteInk(theme).white,\n      '& .MuiMenuItem-root': {\n        color: absoluteInk(theme).white,\n      },\n      '& .MuiListItemIcon-root': {\n        color: absoluteInk(theme).white,\n      },\n      '& .MuiDivider-root': {\n        borderColor: sheen(theme, 0.12),\n      },\n    }),\n\n    ...(size === 'sm' && {\n      '& .MuiMenuItem-root': {\n        fontSize: rem(theme, 14),\n        minHeight: rem(theme, 32),\n        padding: theme.spacing(0.5, 1.5),\n      },\n    }),\n\n    ...(size === 'lg' && {\n      '& .MuiMenuItem-root': {\n        fontSize: rem(theme, 18),\n        minHeight: rem(theme, 48),\n        padding: theme.spacing(1.5, 2),\n      },\n    }),\n  },\n}));\n\n// `color` names a palette key (`success`, `warning`, …) that MUI's Theme type does\n// not index, so it is read structurally and falls back to primary.\nconst paletteColor = (theme: Theme, color: string): string =>\n  (theme.palette as unknown as Record<string, { main?: string }>)[color]?.main ||\n  theme.palette.primary.main;\n\nconst accentStyles = (theme: Theme, color: string): CSSObject => {\n  const main = paletteColor(theme, color);\n\n  return {\n    color: main,\n    '& .MuiListItemIcon-root': { color: main },\n    '&:hover': { backgroundColor: alpha(main, 0.08) },\n  };\n};\n\nconst StyledMenuItem = styled(MenuItem, {\n  shouldForwardProp: (prop) => !['color', 'dangerous'].includes(prop as string),\n})<{ color?: string; dangerous?: boolean }>(({ theme, color, dangerous }) => ({\n  borderRadius: theme.spacing(0.5),\n  margin: theme.spacing(0.25, 0.5),\n  transition: 'all 0.2s ease',\n\n  '&:hover': {\n    backgroundColor: alpha(dangerous ? theme.palette.error.main : theme.palette.primary.main, 0.08),\n  },\n\n  ...(dangerous && {\n    color: theme.palette.error.main,\n    '& .MuiListItemIcon-root': {\n      color: theme.palette.error.main,\n    },\n  }),\n\n  ...(color && color !== 'default' && !dangerous ? accentStyles(theme, color) : {}),\n}));\n\nconst MenuHeader = styled(Typography)(({ theme }) => ({\n  padding: theme.spacing(1, 2),\n  fontSize: rem(theme, 12),\n  fontWeight: 600,\n  textTransform: 'uppercase',\n  color: theme.palette.text.secondary,\n  letterSpacing: rem(theme, 0.5),\n}));\n\nconst ShortcutText = styled(Typography)(({ theme }) => ({\n  fontSize: rem(theme, 12),\n  color: theme.palette.text.secondary,\n  marginLeft: 'auto',\n  paddingLeft: theme.spacing(2),\n}));\n\nconst renderMenuItem = (\n  item: ContextMenuItem,\n  handleItemClick: (item: ContextMenuItem) => void,\n  size?: string,\n) => {\n  if (item.type === 'divider') {\n    return <Divider key={item.id} sx={{ my: 0.5 }} />;\n  }\n\n  if (item.type === 'header') {\n    return <MenuHeader key={item.id}>{item.label}</MenuHeader>;\n  }\n\n  const hasIcon = !!item.icon;\n\n  return (\n    <StyledMenuItem\n      key={item.id}\n      disabled={item.disabled}\n      onClick={() => handleItemClick(item)}\n      color={item.color}\n      dangerous={item.dangerous}\n    >\n      {hasIcon && (\n        <ListItemIcon sx={{ minWidth: sxRem(size === 'sm' ? 32 : 40) }}>{item.icon}</ListItemIcon>\n      )}\n      <ListItemText primary={item.label} />\n      {item.shortcut && <ShortcutText variant=\"caption\">{item.shortcut}</ShortcutText>}\n    </StyledMenuItem>\n  );\n};\n\ninterface TriggerOptions {\n  disabled: boolean;\n  triggerClassName?: string;\n  triggerStyle?: React.CSSProperties;\n}\n\n// The trigger is whatever the caller passed as children. A single element is\n// cloned, so the handler and cursor land on the caller's own node; anything else\n// gets wrapped in a div that can carry them.\nconst buildTrigger = (\n  children: React.ReactNode,\n  onContextMenu: (event: React.MouseEvent) => void,\n  { disabled, triggerClassName, triggerStyle }: TriggerOptions,\n) => {\n  const cursor = disabled ? 'default' : 'context-menu';\n\n  if (!isValidElement(children)) {\n    return (\n      <div\n        onContextMenu={onContextMenu}\n        className={triggerClassName}\n        style={{ ...triggerStyle, cursor }}\n      >\n        {children}\n      </div>\n    );\n  }\n\n  const element = children as React.ReactElement<{\n    onContextMenu?: (event: React.MouseEvent) => void;\n    className?: string;\n    style?: React.CSSProperties;\n  }>;\n\n  return cloneElement(element, {\n    onContextMenu,\n    className: [\n      element.props.className,\n      triggerClassName,\n      !disabled ? 'context-menu-trigger' : '',\n    ]\n      .filter(Boolean)\n      .join(' '),\n    style: { ...element.props.style, ...triggerStyle, cursor },\n  });\n};\n\nexport const ContextMenu = React.forwardRef<HTMLDivElement, ContextMenuProps>(\n  (\n    {\n      variant = 'default',\n      items,\n      children,\n      disabled = false,\n      onOpen,\n      onClose,\n      size = 'md',\n      triggerClassName,\n      triggerStyle,\n      ...menuProps\n    },\n    ref,\n  ) => {\n    const [contextMenu, setContextMenu] = useState<{\n      mouseX: number;\n      mouseY: number;\n    } | null>(null);\n\n    const handleContextMenu = (event: React.MouseEvent) => {\n      if (disabled) return;\n\n      event.preventDefault();\n      setContextMenu(\n        contextMenu === null\n          ? {\n              mouseX: event.clientX + 2,\n              mouseY: event.clientY - 6,\n            }\n          : null,\n      );\n      onOpen?.(event);\n    };\n\n    const handleClose = () => {\n      setContextMenu(null);\n      onClose?.();\n    };\n\n    const handleItemClick = (item: ContextMenuItem) => {\n      if (item.onClick) {\n        item.onClick();\n      }\n      handleClose();\n    };\n\n    const triggerElement = buildTrigger(children, handleContextMenu, {\n      disabled,\n      triggerClassName,\n      triggerStyle,\n    });\n\n    return (\n      <>\n        {triggerElement}\n        <StyledMenu\n          ref={ref}\n          open={contextMenu !== null}\n          onClose={handleClose}\n          anchorReference=\"anchorPosition\"\n          anchorPosition={\n            contextMenu !== null ? { top: contextMenu.mouseY, left: contextMenu.mouseX } : undefined\n          }\n          customVariant={variant}\n          size={size}\n          {...menuProps}\n        >\n          {items.map((item) => renderMenuItem(item, handleItemClick, size))}\n        </StyledMenu>\n      </>\n    );\n  },\n);\n\nContextMenu.displayName = 'ContextMenu';\n"],"mappings":"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","names":[]}

package/dist/{chunk-NYZO3JNB.js → chunk-RXJQA3FQ.js}

@@ -1,5 +1,4 @@
 // src/components/feedback/TutorialOverlay/TutorialOverlay.geometry.ts
-var DEFAULT_PADDING = 16;
 var getElementBounds = (selector) => document.querySelector(selector)?.getBoundingClientRect() ?? null;
 var pickPlacement = (targetBounds) => {
   const spaces = {
@@ -30,7 +29,7 @@ var clampToViewport = (position, tooltipBounds, padding) => ({
   top: Math.max(padding, Math.min(position.top, window.innerHeight - tooltipBounds.height - padding)),
   left: Math.max(padding, Math.min(position.left, window.innerWidth - tooltipBounds.width - padding))
 });
-var calculateTooltipPosition = (targetBounds, tooltipBounds, placement, padding = DEFAULT_PADDING) => {
+var calculateTooltipPosition = (targetBounds, tooltipBounds, placement, padding) => {
   const finalPlacement = placement === "auto" ? pickPlacement(targetBounds) : placement;
   const offset = offsetFor(finalPlacement, targetBounds, tooltipBounds, padding);
   return {
@@ -43,4 +42,4 @@ export {
   getElementBounds,
   calculateTooltipPosition
 };
-//# sourceMappingURL=chunk-NYZO3JNB.js.map
+//# sourceMappingURL=chunk-RXJQA3FQ.js.map

package/dist/chunk-RXJQA3FQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/TutorialOverlay/TutorialOverlay.geometry.ts"],"sourcesContent":["export const getElementBounds = (selector: string): globalThis.DOMRect | null =>\n  document.querySelector(selector)?.getBoundingClientRect() ?? null;\n\n// With placement 'auto', the side with the most free space around the target\n// wins.\nconst pickPlacement = (targetBounds: globalThis.DOMRect): string => {\n  const spaces = {\n    top: targetBounds.top,\n    bottom: window.innerHeight - targetBounds.bottom,\n    left: targetBounds.left,\n    right: window.innerWidth - targetBounds.right,\n  };\n\n  return Object.entries(spaces).reduce((a, b) => (b[1] > a[1] ? b : a))[0];\n};\n\nconst offsetFor = (\n  placement: string,\n  targetBounds: globalThis.DOMRect,\n  tooltipBounds: globalThis.DOMRect,\n  padding: number,\n): { top: number; left: number } => {\n  const centredLeft = targetBounds.left + targetBounds.width / 2 - tooltipBounds.width / 2;\n  const centredTop = targetBounds.top + targetBounds.height / 2 - tooltipBounds.height / 2;\n\n  switch (placement) {\n    case 'top':\n      return { top: targetBounds.top - tooltipBounds.height - padding, left: centredLeft };\n    case 'bottom':\n      return { top: targetBounds.bottom + padding, left: centredLeft };\n    case 'left':\n      return { top: centredTop, left: targetBounds.left - tooltipBounds.width - padding };\n    case 'right':\n      return { top: centredTop, left: targetBounds.right + padding };\n    default:\n      return { top: 0, left: 0 };\n  }\n};\n\n// Keeps the tooltip fully on screen, whatever the chosen side works out to.\nconst clampToViewport = (\n  position: { top: number; left: number },\n  tooltipBounds: globalThis.DOMRect,\n  padding: number,\n) => ({\n  top: Math.max(padding, Math.min(position.top, window.innerHeight - tooltipBounds.height - padding)),\n  left: Math.max(padding, Math.min(position.left, window.innerWidth - tooltipBounds.width - padding)),\n});\n\nexport const calculateTooltipPosition = (\n  targetBounds: globalThis.DOMRect,\n  tooltipBounds: globalThis.DOMRect,\n  placement: string,\n  /** The clearance around the target, in px — the caller reads it through `remPx`. */\n  padding: number,\n) => {\n  const finalPlacement = placement === 'auto' ? pickPlacement(targetBounds) : placement;\n  const offset = offsetFor(finalPlacement, targetBounds, tooltipBounds, padding);\n\n  return {\n    position: clampToViewport(offset, tooltipBounds, padding),\n    placement: finalPlacement,\n  };\n};\n"],"mappings":";AAAO,IAAM,mBAAmB,CAAC,aAC/B,SAAS,cAAc,QAAQ,GAAG,sBAAsB,KAAK;AAI/D,IAAM,gBAAgB,CAAC,iBAA6C;AAClE,QAAM,SAAS;AAAA,IACb,KAAK,aAAa;AAAA,IAClB,QAAQ,OAAO,cAAc,aAAa;AAAA,IAC1C,MAAM,aAAa;AAAA,IACnB,OAAO,OAAO,aAAa,aAAa;AAAA,EAC1C;AAEA,SAAO,OAAO,QAAQ,MAAM,EAAE,OAAO,CAAC,GAAG,MAAO,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,IAAI,CAAE,EAAE,CAAC;AACzE;AAEA,IAAM,YAAY,CAChB,WACA,cACA,eACA,YACkC;AAClC,QAAM,cAAc,aAAa,OAAO,aAAa,QAAQ,IAAI,cAAc,QAAQ;AACvF,QAAM,aAAa,aAAa,MAAM,aAAa,SAAS,IAAI,cAAc,SAAS;AAEvF,UAAQ,WAAW;AAAA,IACjB,KAAK;AACH,aAAO,EAAE,KAAK,aAAa,MAAM,cAAc,SAAS,SAAS,MAAM,YAAY;AAAA,IACrF,KAAK;AACH,aAAO,EAAE,KAAK,aAAa,SAAS,SAAS,MAAM,YAAY;AAAA,IACjE,KAAK;AACH,aAAO,EAAE,KAAK,YAAY,MAAM,aAAa,OAAO,cAAc,QAAQ,QAAQ;AAAA,IACpF,KAAK;AACH,aAAO,EAAE,KAAK,YAAY,MAAM,aAAa,QAAQ,QAAQ;AAAA,IAC/D;AACE,aAAO,EAAE,KAAK,GAAG,MAAM,EAAE;AAAA,EAC7B;AACF;AAGA,IAAM,kBAAkB,CACtB,UACA,eACA,aACI;AAAA,EACJ,KAAK,KAAK,IAAI,SAAS,KAAK,IAAI,SAAS,KAAK,OAAO,cAAc,cAAc,SAAS,OAAO,CAAC;AAAA,EAClG,MAAM,KAAK,IAAI,SAAS,KAAK,IAAI,SAAS,MAAM,OAAO,aAAa,cAAc,QAAQ,OAAO,CAAC;AACpG;AAEO,IAAM,2BAA2B,CACtC,cACA,eACA,WAEA,YACG;AACH,QAAM,iBAAiB,cAAc,SAAS,cAAc,YAAY,IAAI;AAC5E,QAAM,SAAS,UAAU,gBAAgB,cAAc,eAAe,OAAO;AAE7E,SAAO;AAAA,IACL,UAAU,gBAAgB,QAAQ,eAAe,OAAO;AAAA,IACxD,WAAW;AAAA,EACb;AACF;","names":[]}

package/dist/{chunk-WPA26LXA.js → chunk-RZYSKQTS.js}

@@ -1,7 +1,7 @@
 import {
   useColumnsWithActions,
   useRenderedColumns
-} from "./chunk-TQBRWZA4.js";
+} from "./chunk-ZAY6OA6F.js";
 import {
   filterRows
 } from "./chunk-YGQX7BNI.js";
@@ -18,7 +18,7 @@ import {
 import {
   computeActiveFilterCount,
   defaultSortFields
-} from "./chunk-KJK2Q35C.js";
+} from "./chunk-PPRV4LTM.js";
 import {
   serverDerived,
   useServerQuery
@@ -172,4 +172,4 @@ function useDataViewsState({
 export {
   useDataViewsState
 };
-//# sourceMappingURL=chunk-WPA26LXA.js.map
+//# sourceMappingURL=chunk-RZYSKQTS.js.map

package/dist/{chunk-2UCLUDEB.js → chunk-SKT2V2OX.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk-PGPPN63I.js";
 import {
   Card
-} from "./chunk-N6CSXHFJ.js";
+} from "./chunk-WN5PNP6F.js";
 import {
   Button
-} from "./chunk-KH25WUSX.js";
+} from "./chunk-2EAAWOZ2.js";
 import {
   Text
-} from "./chunk-WTOYEWW6.js";
+} from "./chunk-YBH4SPMM.js";
 
 // src/user-avatar/user-avatar.tsx
 import Box from "@mui/material/Box/index.js";
@@ -74,4 +74,4 @@ export {
   UserAvatar,
   UserMenu
 };
-//# sourceMappingURL=chunk-2UCLUDEB.js.map
+//# sourceMappingURL=chunk-SKT2V2OX.js.map

package/dist/{chunk-EOW2ECB3.js → chunk-SNURSSTN.js}

@@ -1,6 +1,6 @@
 import {
   StepRow
-} from "./chunk-R75DZ3AK.js";
+} from "./chunk-BVLMKSHX.js";
 import {
   resolveWorkflowStepProps,
   withDerivedStatus
@@ -104,4 +104,4 @@ export {
   WorkflowStep,
   WorkflowStep_default
 };
-//# sourceMappingURL=chunk-EOW2ECB3.js.map
+//# sourceMappingURL=chunk-SNURSSTN.js.map

package/dist/{chunk-TU3EGIKB.js → chunk-SSS64KYB.js}

@@ -3,12 +3,12 @@ import {
 } from "./chunk-4XK6JQ4D.js";
 import {
   Input
-} from "./chunk-IBGX6H4J.js";
+} from "./chunk-VURQZBFH.js";
 import {
   FormControl,
   FormLabel,
   FormMessage
-} from "./chunk-2HVNPWFV.js";
+} from "./chunk-D6KL74KI.js";
 
 // src/components/form/total-form/Fields/TextField.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -38,4 +38,4 @@ function TextField({ name, label, type = "text", placeholder }) {
 export {
   TextField
 };
-//# sourceMappingURL=chunk-TU3EGIKB.js.map
+//# sourceMappingURL=chunk-SSS64KYB.js.map

package/dist/{chunk-L3B36HA5.js → chunk-SV6JGFHG.js}

@@ -3,13 +3,17 @@ import {
 } from "./chunk-QB3TVUPD.js";
 import {
   Dialog
-} from "./chunk-L4UP5VYS.js";
+} from "./chunk-GVH7C2PT.js";
 import {
   Button
-} from "./chunk-KH25WUSX.js";
+} from "./chunk-2EAAWOZ2.js";
 import {
   accentFor
 } from "./chunk-TCAQOUIB.js";
+import {
+  rem,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/navigation/AppHeader/AppHeader.details.tsx
 import Box from "@mui/material/Box/index.js";
@@ -17,8 +21,8 @@ import Typography from "@mui/material/Typography/index.js";
 import { useTheme } from "@mui/material/styles/index.js";
 import useMediaQuery from "@mui/material/useMediaQuery/index.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-var DIALOG_WIDTH = 460;
-var XXS_MAX_WIDTH = 360;
+var DIALOG_WIDTH = sxRem(460);
+var xxsQuery = (theme) => `(max-width:${rem(theme, 360 - 0.05)})`;
 function sheetHeight(xxs) {
   return { height: "auto", maxHeight: xxs ? "100dvh" : "90dvh" };
 }
@@ -108,7 +112,7 @@ var AppHeaderDetails = ({
 }) => {
   const theme = useTheme();
   const asSheet = usesSheet(presentation, useMediaQuery(theme.breakpoints.down(breakpoint)));
-  const xxs = useMediaQuery(`(max-width:${XXS_MAX_WIDTH - 0.05}px)`);
+  const xxs = useMediaQuery(xxsQuery(theme));
   const description = typeof subtitle === "string" ? subtitle : void 0;
   const richSubtitle = description === void 0 ? subtitle : null;
   const body = /* @__PURE__ */ jsx(DetailsBody, { rows, dataTestId, children });
@@ -162,4 +166,4 @@ AppHeaderDetails.displayName = "AppHeaderDetails";
 export {
   AppHeaderDetails
 };
-//# sourceMappingURL=chunk-L3B36HA5.js.map
+//# sourceMappingURL=chunk-SV6JGFHG.js.map

package/dist/chunk-SV6JGFHG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/AppHeader/AppHeader.details.tsx"],"sourcesContent":["'use client';\n\nimport Box from '@mui/material/Box/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport useMediaQuery from '@mui/material/useMediaQuery/index.js';\nimport React from 'react';\n\nimport { rem, sxRem } from '../../../tokens/relative';\nimport { accentFor } from '../../../tokens/scales';\nimport { Sheet } from '../../data-display/Sheet/Sheet';\nimport { Button } from '../../form/Button/Button';\nimport { Dialog } from '../../feedback/Dialog/Dialog';\n\nimport type {\n  AppHeaderDetailRow,\n  AppHeaderDetailsAction,\n  AppHeaderDetailsProps,\n} from './AppHeader.types';\n\n/** How wide the dialog presentation grows before it stops (460 design px). */\nconst DIALOG_WIDTH = sxRem(460);\n\n/**\n * Where the smallest phones stop (360 design px). The theme's scale starts at\n * `xs`/`sm`, so there is no `xxs` breakpoint to ask for — this is that\n * boundary, named once rather than inlined at the place it decides something.\n */\nconst xxsQuery = (theme: Theme): string => `(max-width:${rem(theme, 360 - 0.05)})`;\n\n/**\n * The sheet grows to its content and stops at the viewport; it does not take a\n * fixed slab of height.\n *\n * `Sheet`'s vertical presets are absolute (`md` is 400px), which on a phone is\n * shorter than six detail rows plus a button — so the panel scrolled INSIDE a\n * screen that had room to spare, putting the address and the way out below the\n * fold of a sheet using two thirds of the display. `height: auto` sizes it to\n * what is in it, and the cap keeps a long panel on-screen: 100dvh on the\n * smallest phones where every pixel counts, 90dvh above that so the panel still\n * reads as a sheet over a page rather than as a new screen.\n *\n * `dvh` and not `vh` — mobile browser chrome makes `vh` overshoot, which would\n * reintroduce exactly the scroll this removes.\n */\nfunction sheetHeight(xxs: boolean): { height: string; maxHeight: string } {\n  return { height: 'auto', maxHeight: xxs ? '100dvh' : '90dvh' };\n}\n\n/** Which surface this viewport calls for. Lifted out to keep the component lean. */\nfunction usesSheet(presentation: AppHeaderDetailsProps['presentation'], compact: boolean): boolean {\n  if (presentation === 'sheet') return true;\n  if (presentation === 'dialog') return false;\n  return compact;\n}\n\n/** One label/value line. The value may wrap to two lines; the label may not. */\nconst DetailRow: React.FC<{ row: AppHeaderDetailRow; last: boolean; dataTestId: string }> = ({\n  row,\n  last,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n  return (\n    <Box\n      data-testid={`${dataTestId}-row`}\n      data-row={row.id ?? row.label}\n      sx={{\n        display: 'flex',\n        alignItems: 'flex-start',\n        justifyContent: 'space-between',\n        gap: 2,\n        py: 1.5,\n        borderBottom: last ? 'none' : `1px solid ${theme.palette.divider}`,\n      }}\n    >\n      <Typography variant=\"body1\" color=\"text.secondary\" component=\"span\" sx={{ flex: '0 0 auto' }}>\n        {row.label}\n      </Typography>\n      <Typography\n        variant=\"body1\"\n        component=\"span\"\n        sx={{\n          minWidth: 0,\n          textAlign: 'right',\n          fontWeight: row.tone ? 700 : 500,\n          color: row.tone ? accentFor(theme, row.tone).main : 'text.primary',\n          // Newlines in a value are meaningful — an address is two lines.\n          whiteSpace: 'pre-line',\n        }}\n      >\n        {row.value}\n      </Typography>\n    </Box>\n  );\n};\n\n/** The rows plus whatever the caller put under them. */\nconst DetailsBody: React.FC<\n  Pick<AppHeaderDetailsProps, 'rows' | 'children'> & { dataTestId: string }\n> = ({ rows, children, dataTestId }) => (\n  <Box data-testid={`${dataTestId}-body`}>\n    {(rows ?? []).map((row, index) => (\n      <DetailRow\n        key={row.id ?? row.label}\n        row={row}\n        last={index === (rows?.length ?? 0) - 1 && !children}\n        dataTestId={dataTestId}\n      />\n    ))}\n    {children}\n  </Box>\n);\n\n/**\n * The single full-width call to action, or nothing.\n *\n * `padded` is for the dialog, which has no footer slot of its own — and the\n * padding lives here rather than at the call site so an action-less panel does\n * not end in a strip of empty space.\n */\nconst DetailsAction: React.FC<{\n  action?: AppHeaderDetailsAction;\n  dataTestId: string;\n  padded?: boolean;\n}> = ({ action, dataTestId, padded = false }) =>\n  action ? (\n    <Box sx={padded ? { pt: 2 } : undefined}>\n      <Button\n        variant=\"solid\"\n        color={action.color ?? 'primary'}\n        size=\"lg\"\n        fullWidth\n        disabled={action.disabled}\n        onClick={action.onClick}\n        dataTestId={action.dataTestId ?? `${dataTestId}-action`}\n      >\n        {action.label}\n      </Button>\n    </Box>\n  ) : null;\n\n/**\n * The panel behind the header's disclosure — the hours, the address, the way\n * out — in the shape the viewport calls for.\n *\n * ONE component with two presentations, because they are one thing to the user\n * and one thing to the caller: a bottom sheet within reach of a thumb, a centred\n * dialog under a pointer. `auto` picks by viewport, so nobody writes that branch\n * at a call site and nobody ships a phone-shaped sheet stretched across a\n * desktop. Force either one with `presentation` when the surrounding layout\n * already decides (a preview frame, a story, a kiosk).\n */\nexport const AppHeaderDetails: React.FC<AppHeaderDetailsProps> = ({\n  open,\n  onClose,\n  title,\n  subtitle,\n  rows,\n  children,\n  action,\n  presentation = 'auto',\n  breakpoint = 'sm',\n  className,\n  dataTestId = 'app-header-details',\n}) => {\n  const theme = useTheme();\n  const asSheet = usesSheet(presentation, useMediaQuery(theme.breakpoints.down(breakpoint)));\n  const xxs = useMediaQuery(xxsQuery(theme));\n\n  // Split once, not per branch: a STRING subtitle is the panel's own\n  // `description` (both surfaces style it as part of their header), anything\n  // richer is a node we render ourselves above the rows.\n  const description = typeof subtitle === 'string' ? subtitle : undefined;\n  const richSubtitle = description === undefined ? subtitle : null;\n\n  const body = (\n    <DetailsBody rows={rows} dataTestId={dataTestId}>\n      {children}\n    </DetailsBody>\n  );\n  const footer = <DetailsAction action={action} dataTestId={dataTestId} />;\n\n  if (asSheet) {\n    // No `showHandle`. The grab bar promises a drag this panel does not answer:\n    // its height is its content's, so there is no second position to drag it\n    // to, and the handle sat above a ✕ that already closes it. Swipe-to-dismiss\n    // is `Sheet`'s default and still works — it just stops being advertised by\n    // a control that looked resizable and was not.\n    return (\n      <Sheet\n        open={open}\n        onClose={onClose}\n        onOpenChange={(next) => !next && onClose()}\n        position=\"bottom\"\n        size=\"md\"\n        style={sheetHeight(xxs)}\n        className={className}\n        title={title}\n        description={description}\n        showCloseButton\n        rounded\n        footer={footer}\n        dataTestId={dataTestId}\n      >\n        {richSubtitle}\n        {body}\n      </Sheet>\n    );\n  }\n\n  return (\n    <Dialog\n      open={open}\n      onClose={onClose}\n      title={title}\n      description={description}\n      showCloseButton\n      fullWidth\n      className={className}\n      dataTestId={dataTestId}\n      PaperProps={{ sx: { maxWidth: DIALOG_WIDTH, borderRadius: 3 } }}\n    >\n      {richSubtitle}\n      {body}\n      <DetailsAction action={action} dataTestId={dataTestId} padded />\n    </Dialog>\n  );\n};\n\nAppHeaderDetails.displayName = 'AppHeaderDetails';\n"],"mappings":"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","names":[]}

package/dist/{chunk-CZBND7AY.js → chunk-T7DE44SP.js}

@@ -5,7 +5,7 @@ import {
 } from "./chunk-HCT5ELST.js";
 import {
   Skeleton
-} from "./chunk-7F7TTOYN.js";
+} from "./chunk-BEGTLELZ.js";
 import {
   sheen
 } from "./chunk-FQ6UW7IY.js";
@@ -215,4 +215,4 @@ LazyImage.displayName = "LazyImage";
 export {
   LazyImage
 };
-//# sourceMappingURL=chunk-CZBND7AY.js.map
+//# sourceMappingURL=chunk-T7DE44SP.js.map

package/dist/{chunk-DHBYO7AO.js → chunk-TCV3N44E.js}

@@ -6,7 +6,7 @@ import {
   labelStyles,
   sizeStyles,
   textColor
-} from "./chunk-7BZTZ2WG.js";
+} from "./chunk-VY2BMSHN.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
@@ -145,4 +145,4 @@ Label.displayName = "Label";
 export {
   Label
 };
-//# sourceMappingURL=chunk-DHBYO7AO.js.map
+//# sourceMappingURL=chunk-TCV3N44E.js.map