@12-apps/ui 6.11.0 → 6.11.1

package/dist/chunk-36NAZ2M5.js

@@ -0,0 +1,33 @@
+import {
+  ToggleField
+} from "./chunk-W3TTRP2W.js";
+import {
+  TextField
+} from "./chunk-2CNG6YIC.js";
+import {
+  SelectField
+} from "./chunk-E4CNWOJS.js";
+import {
+  CepField
+} from "./chunk-W5AALTIW.js";
+import {
+  CategoryField
+} from "./chunk-JG6ASCPE.js";
+import {
+  __export
+} from "./chunk-PZ5AY32C.js";
+
+// src/components/form/total-form/Fields/index.ts
+var Fields_exports = {};
+__export(Fields_exports, {
+  CategoryField: () => CategoryField,
+  CepField: () => CepField,
+  SelectField: () => SelectField,
+  TextField: () => TextField,
+  ToggleField: () => ToggleField
+});
+
+export {
+  Fields_exports
+};
+//# sourceMappingURL=chunk-36NAZ2M5.js.map

package/dist/chunk-36NAZ2M5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/total-form/Fields/index.ts"],"sourcesContent":["export { CategoryField } from './CategoryField';\nexport type { CategoryFieldProps } from './CategoryField';\nexport { CepField } from './CepField';\nexport type { CepFieldProps, CepFills } from './CepField';\nexport { TextField } from './TextField';\nexport type { TextFieldProps } from './TextField';\nexport { SelectField } from './SelectField';\nexport type { SelectFieldProps } from './SelectField';\nexport { ToggleField } from './ToggleField';\nexport type { ToggleFieldProps } from './ToggleField';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}

package/dist/chunk-3CCUSLS2.js

@@ -0,0 +1,53 @@
+// src/components/form/Label/Label.parts.tsx
+import { Box, CircularProgress, useTheme } from "@mui/material";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var Asterisk = ({
+  placement
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "span",
+      sx: {
+        color: theme.palette.error.main,
+        marginLeft: placement === "end" ? theme.spacing(0.5) : 0,
+        marginRight: placement === "start" ? theme.spacing(0.5) : 0
+      },
+      children: "*"
+    }
+  );
+};
+var LabelIcon = ({ icon }) => /* @__PURE__ */ jsx(Box, { component: "span", sx: { display: "inline-flex", alignItems: "center", fontSize: "inherit" }, children: icon });
+var LabelSpinner = ({
+  fontSize,
+  color
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(CircularProgress, { size: fontSize, sx: { color, marginLeft: theme.spacing(0.5) } });
+};
+var LabelBody = ({
+  children,
+  required,
+  asteriskPlacement,
+  icon,
+  iconPosition,
+  loading,
+  fontSize,
+  color
+}) => /* @__PURE__ */ jsxs(Fragment, { children: [
+  required && asteriskPlacement === "start" && /* @__PURE__ */ jsx(Asterisk, { placement: asteriskPlacement }),
+  icon && iconPosition === "start" && /* @__PURE__ */ jsx(LabelIcon, { icon }),
+  children,
+  icon && iconPosition === "end" && /* @__PURE__ */ jsx(LabelIcon, { icon }),
+  required && asteriskPlacement === "end" && /* @__PURE__ */ jsx(Asterisk, { placement: asteriskPlacement }),
+  loading && /* @__PURE__ */ jsx(LabelSpinner, { fontSize, color })
+] });
+
+export {
+  Asterisk,
+  LabelIcon,
+  LabelSpinner,
+  LabelBody
+};
+//# sourceMappingURL=chunk-3CCUSLS2.js.map

package/dist/chunk-3CCUSLS2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/Label/Label.parts.tsx"],"sourcesContent":["import { Box, CircularProgress, useTheme } from '@mui/material';\nimport React from 'react';\n\nimport type { LabelProps } from './Label.types';\n\n/** The required marker, on whichever side the caller asked for. */\nexport const Asterisk: React.FC<{ placement: NonNullable<LabelProps['asteriskPlacement']> }> = ({\n  placement,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      component=\"span\"\n      sx={{\n        color: theme.palette.error.main,\n        marginLeft: placement === 'end' ? theme.spacing(0.5) : 0,\n        marginRight: placement === 'start' ? theme.spacing(0.5) : 0,\n      }}\n    >\n      *\n    </Box>\n  );\n};\n\nexport const LabelIcon: React.FC<{ icon: React.ReactNode }> = ({ icon }) => (\n  <Box component=\"span\" sx={{ display: 'inline-flex', alignItems: 'center', fontSize: 'inherit' }}>\n    {icon}\n  </Box>\n);\n\n/** Sized to the label's own font so it sits on the text baseline. */\nexport const LabelSpinner: React.FC<{ fontSize?: CSSStyleDeclaration['fontSize']; color: string }> = ({\n  fontSize,\n  color,\n}) => {\n  const theme = useTheme();\n\n  return <CircularProgress size={fontSize} sx={{ color, marginLeft: theme.spacing(0.5) }} />;\n};\n\nexport interface LabelBodyProps {\n  children: React.ReactNode;\n  required: boolean;\n  asteriskPlacement: NonNullable<LabelProps['asteriskPlacement']>;\n  icon?: React.ReactNode;\n  iconPosition: NonNullable<LabelProps['iconPosition']>;\n  loading: boolean;\n  fontSize?: string;\n  color: string;\n}\n\n/**\n * The run inside the label: the required marker and the icon on whichever side\n * each was asked for, the text, and the spinner after it all.\n */\nexport const LabelBody: React.FC<LabelBodyProps> = ({\n  children,\n  required,\n  asteriskPlacement,\n  icon,\n  iconPosition,\n  loading,\n  fontSize,\n  color,\n}) => (\n  <>\n    {required && asteriskPlacement === 'start' && <Asterisk placement={asteriskPlacement} />}\n    {icon && iconPosition === 'start' && <LabelIcon icon={icon} />}\n    {children}\n    {icon && iconPosition === 'end' && <LabelIcon icon={icon} />}\n    {required && asteriskPlacement === 'end' && <Asterisk placement={asteriskPlacement} />}\n    {loading && <LabelSpinner fontSize={fontSize} color={color} />}\n  </>\n);\n"],"mappings":";AAAA,SAAS,KAAK,kBAAkB,gBAAgB;AAY5C,SAsDF,UAtDE,KAsDF,YAtDE;AANG,IAAM,WAAkF,CAAC;AAAA,EAC9F;AACF,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,IAAI;AAAA,QACF,OAAO,MAAM,QAAQ,MAAM;AAAA,QAC3B,YAAY,cAAc,QAAQ,MAAM,QAAQ,GAAG,IAAI;AAAA,QACvD,aAAa,cAAc,UAAU,MAAM,QAAQ,GAAG,IAAI;AAAA,MAC5D;AAAA,MACD;AAAA;AAAA,EAED;AAEJ;AAEO,IAAM,YAAiD,CAAC,EAAE,KAAK,MACpE,oBAAC,OAAI,WAAU,QAAO,IAAI,EAAE,SAAS,eAAe,YAAY,UAAU,UAAU,UAAU,GAC3F,gBACH;AAIK,IAAM,eAAwF,CAAC;AAAA,EACpG;AAAA,EACA;AACF,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,SAAO,oBAAC,oBAAiB,MAAM,UAAU,IAAI,EAAE,OAAO,YAAY,MAAM,QAAQ,GAAG,EAAE,GAAG;AAC1F;AAiBO,IAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE,iCACG;AAAA,cAAY,sBAAsB,WAAW,oBAAC,YAAS,WAAW,mBAAmB;AAAA,EACrF,QAAQ,iBAAiB,WAAW,oBAAC,aAAU,MAAY;AAAA,EAC3D;AAAA,EACA,QAAQ,iBAAiB,SAAS,oBAAC,aAAU,MAAY;AAAA,EACzD,YAAY,sBAAsB,SAAS,oBAAC,YAAS,WAAW,mBAAmB;AAAA,EACnF,WAAW,oBAAC,gBAAa,UAAoB,OAAc;AAAA,GAC9D;","names":[]}

package/dist/chunk-3CM277NN.js

@@ -0,0 +1,75 @@
+import {
+  isPresetActive,
+  resolvePreset
+} from "./chunk-CBOB5AV6.js";
+
+// src/components/data-display/DataViews/data-views-preset-chips.tsx
+import { Box } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
+function PresetChip({
+  preset,
+  active,
+  onSelect,
+  testId
+}) {
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "button",
+      type: "button",
+      onClick: onSelect,
+      "aria-pressed": active,
+      "data-testid": testId,
+      sx: {
+        px: 1.25,
+        py: 0.5,
+        border: 1,
+        borderStyle: "solid",
+        borderColor: active ? "primary.main" : "divider",
+        borderRadius: 999,
+        bgcolor: active ? "action.selected" : "background.paper",
+        color: active ? "primary.main" : "text.secondary",
+        cursor: "pointer",
+        font: "inherit",
+        fontSize: "0.75rem",
+        fontWeight: 600,
+        whiteSpace: "nowrap",
+        "&:hover": { borderColor: active ? "primary.main" : "text.primary" }
+      },
+      children: preset.label
+    }
+  );
+}
+function RangePresets({
+  presets,
+  value,
+  onChange,
+  testId
+}) {
+  if (presets.length === 0) return null;
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      "data-testid": `${testId}-presets`,
+      sx: { display: "flex", flexWrap: "wrap", gap: 0.75 },
+      children: presets.map((preset) => {
+        const active = isPresetActive(preset, value);
+        return /* @__PURE__ */ jsx(
+          PresetChip,
+          {
+            preset,
+            active,
+            onSelect: () => onChange(active ? {} : resolvePreset(preset)),
+            testId: `${testId}-preset-${preset.id}`
+          },
+          preset.id
+        );
+      })
+    }
+  );
+}
+
+export {
+  RangePresets
+};
+//# sourceMappingURL=chunk-3CM277NN.js.map

package/dist/chunk-3CM277NN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-preset-chips.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * THE ONE-CLICK WINDOWS ABOVE A RANGE'S `De`/`Até` INPUTS.\n *\n * \"Filter by last month\" is two date pickers, four gestures and a mental\n * calculation of which day the month ended on. It is also the overwhelmingly\n * common case. So the common windows get a chip each, and the inputs stay for\n * the windows nobody could enumerate.\n *\n * Clicking an active preset CLEARS it. A chip that reads as pressed and does\n * nothing when pressed again is a dead control, and the alternative — hunting\n * for the pill's ✕ — is the gesture this row exists to remove.\n */\nimport { Box } from \"@mui/material\";\n\nimport { isPresetActive, resolvePreset } from \"./data-views-range-presets\";\nimport type { RangePreset, RangeValue } from \"./data-views-types\";\n\n/** One preset, styled as the same pill-shaped chip the filter bar uses. */\nfunction PresetChip({\n  preset,\n  active,\n  onSelect,\n  testId,\n}: {\n  preset: RangePreset;\n  active: boolean;\n  onSelect: () => void;\n  testId: string;\n}): React.JSX.Element {\n  return (\n    <Box\n      component=\"button\"\n      type=\"button\"\n      onClick={onSelect}\n      aria-pressed={active}\n      data-testid={testId}\n      sx={{\n        px: 1.25,\n        py: 0.5,\n        border: 1,\n        borderStyle: \"solid\",\n        borderColor: active ? \"primary.main\" : \"divider\",\n        borderRadius: 999,\n        bgcolor: active ? \"action.selected\" : \"background.paper\",\n        color: active ? \"primary.main\" : \"text.secondary\",\n        cursor: \"pointer\",\n        font: \"inherit\",\n        fontSize: \"0.75rem\",\n        fontWeight: 600,\n        whiteSpace: \"nowrap\",\n        \"&:hover\": { borderColor: active ? \"primary.main\" : \"text.primary\" },\n      }}\n    >\n      {preset.label}\n    </Box>\n  );\n}\n\n/**\n * The preset row. Renders nothing when a field declares none, so a numeric\n * range without host-configured windows keeps the popover it had.\n *\n * Carries no outer margin — the three surfaces that host it (the pill's\n * popover, the slide-in panel, the \"Mais\" overflow) each sit it in a different\n * stack, and a baked-in margin would be wrong in two of them.\n */\nexport function RangePresets({\n  presets,\n  value,\n  onChange,\n  testId,\n}: {\n  presets: RangePreset[];\n  value: RangeValue;\n  onChange: (range: RangeValue) => void;\n  testId: string;\n}): React.JSX.Element | null {\n  if (presets.length === 0) return null;\n  return (\n    <Box\n      data-testid={`${testId}-presets`}\n      sx={{ display: \"flex\", flexWrap: \"wrap\", gap: 0.75 }}\n    >\n      {presets.map((preset) => {\n        const active = isPresetActive(preset, value);\n        return (\n          <PresetChip\n            key={preset.id}\n            preset={preset}\n            active={active}\n            onSelect={() => onChange(active ? {} : resolvePreset(preset))}\n            testId={`${testId}-preset-${preset.id}`}\n          />\n        );\n      })}\n    </Box>\n  );\n}\n"],"mappings":";;;;;;AAcA,SAAS,WAAW;AAkBhB;AAZJ,SAAS,WAAW;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKsB;AACpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAK;AAAA,MACL,SAAS;AAAA,MACT,gBAAc;AAAA,MACd,eAAa;AAAA,MACb,IAAI;AAAA,QACF,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,QAAQ;AAAA,QACR,aAAa;AAAA,QACb,aAAa,SAAS,iBAAiB;AAAA,QACvC,cAAc;AAAA,QACd,SAAS,SAAS,oBAAoB;AAAA,QACtC,OAAO,SAAS,iBAAiB;AAAA,QACjC,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,WAAW,EAAE,aAAa,SAAS,iBAAiB,eAAe;AAAA,MACrE;AAAA,MAEC,iBAAO;AAAA;AAAA,EACV;AAEJ;AAUO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAK6B;AAC3B,MAAI,QAAQ,WAAW,EAAG,QAAO;AACjC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,GAAG,MAAM;AAAA,MACtB,IAAI,EAAE,SAAS,QAAQ,UAAU,QAAQ,KAAK,KAAK;AAAA,MAElD,kBAAQ,IAAI,CAAC,WAAW;AACvB,cAAM,SAAS,eAAe,QAAQ,KAAK;AAC3C,eACE;AAAA,UAAC;AAAA;AAAA,YAEC;AAAA,YACA;AAAA,YACA,UAAU,MAAM,SAAS,SAAS,CAAC,IAAI,cAAc,MAAM,CAAC;AAAA,YAC5D,QAAQ,GAAG,MAAM,WAAW,OAAO,EAAE;AAAA;AAAA,UAJhC,OAAO;AAAA,QAKd;AAAA,MAEJ,CAAC;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/chunk-3D5J7R44.js

@@ -0,0 +1,159 @@
+import {
+  FormControl,
+  FormLabel,
+  FormMessage
+} from "./chunk-GJ2NPAXA.js";
+import {
+  stackedOverlayZIndex
+} from "./chunk-MQLM43E4.js";
+
+// src/components/form/CreatableSelect/CreatableSelect.tsx
+import { alpha } from "@mui/material";
+import { Autocomplete, createFilterOptions } from "@mui/material";
+import { CircularProgress } from "@mui/material";
+import { TextField } from "@mui/material";
+import { useId, useMemo } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var CREATE_PREFIX = " create:";
+var filterOptions = createFilterOptions();
+var INDENT_STEP = 16;
+var MUI_SIZE = { xs: "small", sm: "small", md: "medium", lg: "medium", xl: "medium" };
+var fieldSx = {
+  "& .MuiOutlinedInput-root": {
+    "& fieldset": {
+      borderColor: (theme) => alpha(theme.palette.divider, 0.23)
+    },
+    "&:hover fieldset": { borderColor: "primary.main" },
+    "&.Mui-focused fieldset": { borderColor: "primary.main", borderWidth: 2 },
+    "&.Mui-error fieldset": { borderColor: "error.main" }
+  }
+};
+function buildFilter(onCreate, createOptionLabel) {
+  return (available, params) => {
+    const filtered = filterOptions(available, params);
+    const input = params.inputValue.trim();
+    const alreadyExists = available.some(
+      (option) => option.label.toLowerCase() === input.toLowerCase()
+    );
+    if (input && !alreadyExists && onCreate) {
+      filtered.push({
+        value: `${CREATE_PREFIX}${input}`,
+        label: createOptionLabel(input),
+        isCreate: true
+      });
+    }
+    return filtered;
+  };
+}
+function renderIndentedOption(props, option) {
+  const { key, ...rest } = props;
+  return /* @__PURE__ */ jsx(
+    "li",
+    {
+      ...rest,
+      style: { paddingLeft: INDENT_STEP * (1 + (option.depth ?? 0)) },
+      children: option.label
+    },
+    key ?? option.value
+  );
+}
+function renderField(params, field) {
+  return /* @__PURE__ */ jsx(
+    TextField,
+    {
+      ...params,
+      id: field.inputId,
+      placeholder: field.placeholder,
+      error: Boolean(field.error),
+      size: MUI_SIZE[field.size],
+      sx: fieldSx,
+      inputProps: { ...params.inputProps, "data-testid": `${field.dataTestId}-input` },
+      slotProps: {
+        input: {
+          ...params.InputProps,
+          endAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [
+            field.loading ? /* @__PURE__ */ jsx(CircularProgress, { color: "inherit", size: 18 }) : null,
+            params.InputProps.endAdornment
+          ] })
+        }
+      }
+    }
+  );
+}
+function useInternalOptions(options, value) {
+  const items = useMemo(
+    () => options.map(({ value: optionValue, label, depth }) => ({
+      value: optionValue,
+      label,
+      depth
+    })),
+    [options]
+  );
+  const selected = useMemo(
+    () => items.find((option) => option.value === value) ?? null,
+    [items, value]
+  );
+  return { items, selected };
+}
+function handlePick(next, onChange, onCreate) {
+  if (!next) {
+    onChange(null);
+    return;
+  }
+  if (next.isCreate) {
+    void onCreate?.(next.value.slice(CREATE_PREFIX.length));
+    return;
+  }
+  onChange(next.value);
+}
+function CreatableSelect({
+  options,
+  value,
+  onChange,
+  onCreate,
+  label,
+  error,
+  placeholder,
+  createOptionLabel,
+  noOptionsText,
+  disabled = false,
+  loading = false,
+  fullWidth = true,
+  size = "md",
+  dataTestId = "creatable-select"
+}) {
+  const inputId = useId();
+  const { items, selected } = useInternalOptions(options, value);
+  return /* @__PURE__ */ jsxs(FormControl, { fullWidth, error: Boolean(error), children: [
+    label && /* @__PURE__ */ jsx(FormLabel, { htmlFor: inputId, error: Boolean(error), children: label }),
+    /* @__PURE__ */ jsx(
+      Autocomplete,
+      {
+        value: selected,
+        options: items,
+        disabled,
+        loading,
+        fullWidth,
+        size: MUI_SIZE[size],
+        handleHomeEndKeys: true,
+        selectOnFocus: true,
+        clearOnBlur: true,
+        "data-testid": dataTestId,
+        noOptionsText,
+        slotProps: { popper: { sx: { zIndex: stackedOverlayZIndex } } },
+        getOptionLabel: (option) => typeof option === "string" ? option : option.label,
+        isOptionEqualToValue: (option, current) => option.value === current.value,
+        renderOption: renderIndentedOption,
+        filterOptions: buildFilter(onCreate, createOptionLabel),
+        onChange: (_event, next) => handlePick(next, onChange, onCreate),
+        renderInput: (params) => renderField(params, { inputId, placeholder, error, loading, size, dataTestId })
+      }
+    ),
+    error && /* @__PURE__ */ jsx(FormMessage, { error: true, dataTestId: `${dataTestId}-message`, children: error })
+  ] });
+}
+
+export {
+  CreatableSelect
+};
+//# sourceMappingURL=chunk-3D5J7R44.js.map

package/dist/chunk-3D5J7R44.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CreatableSelect/CreatableSelect.tsx"],"sourcesContent":["'use client';\n\nimport { alpha } from '@mui/material';\nimport { Autocomplete, createFilterOptions } from '@mui/material';\nimport type { AutocompleteRenderInputParams } from '@mui/material';\nimport { CircularProgress } from '@mui/material';\nimport { TextField } from '@mui/material';\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\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    '& fieldset': {\n      borderColor: (theme: { palette: { divider: string } }) => alpha(theme.palette.divider, 0.23),\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}\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-3EYRRVNT.js

@@ -0,0 +1,64 @@
+import {
+  useAutoplay,
+  useLightboxKeyboard,
+  useNavigation,
+  usePreloader,
+  useSwipe,
+  useWheelZoom,
+  useZoomState
+} from "./chunk-LTEXWGK6.js";
+
+// src/components/data-display/Lightbox/useLightbox.ts
+import { useCallback, useImperativeHandle, useState } from "react";
+var useLightbox = ({ isOpen, onClose, items, startIndex, showControls, loop, autoplay, zoomable }, ref) => {
+  const [isLoading, setIsLoading] = useState(false);
+  const preloadImage = usePreloader();
+  const zoom = useZoomState();
+  const { currentIndex, goToIndex, next, prev } = useNavigation({
+    items,
+    loop,
+    startIndex,
+    resetZoom: zoom.resetZoom,
+    preloadImage
+  });
+  const currentItem = items[currentIndex];
+  const canZoom = Boolean(zoomable && currentItem && currentItem.type !== "video");
+  const handleWheel = useWheelZoom({ enabled: canZoom, setZoomLevel: zoom.setZoomLevel });
+  const { isAutoPlaying, setIsAutoPlaying, stopAutoplay } = useAutoplay({
+    isOpen,
+    autoplay,
+    itemCount: items.length,
+    currentIndex,
+    next
+  });
+  const close = useCallback(() => {
+    stopAutoplay();
+    onClose();
+  }, [stopAutoplay, onClose]);
+  const open = useCallback((index = 0) => goToIndex(index), [goToIndex]);
+  useImperativeHandle(ref, () => ({ open, close, next, prev, goTo: goToIndex }));
+  useLightboxKeyboard({ isOpen, showControls, autoplay, close, prev, next, setIsAutoPlaying });
+  const { handleTouchStart, handleTouchEnd } = useSwipe({ prev, next, close });
+  return {
+    currentIndex,
+    currentItem,
+    canZoom,
+    isLoading,
+    setIsLoading,
+    isAutoPlaying,
+    setIsAutoPlaying,
+    zoom,
+    handleWheel,
+    goToIndex,
+    next,
+    prev,
+    close,
+    handleTouchStart,
+    handleTouchEnd
+  };
+};
+
+export {
+  useLightbox
+};
+//# sourceMappingURL=chunk-3EYRRVNT.js.map

package/dist/chunk-3EYRRVNT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Lightbox/useLightbox.ts"],"sourcesContent":["import { useCallback, useImperativeHandle, useState } from 'react';\nimport type React from 'react';\n\nimport {\n  useAutoplay,\n  useLightboxKeyboard,\n  useNavigation,\n  usePreloader,\n  useSwipe,\n  useWheelZoom,\n  useZoomState,\n} from './Lightbox.hooks';\nimport type { ResolvedLightboxProps } from './Lightbox.helpers';\nimport type { LightboxRef } from './Lightbox.types';\n\n// Wires the independent concerns together in dependency order: zoom, then\n// navigation (which resets zoom), then autoplay (which advances), then the\n// input handlers that close.\nexport const useLightbox = (\n  { isOpen, onClose, items, startIndex, showControls, loop, autoplay, zoomable }: ResolvedLightboxProps,\n  ref: React.ForwardedRef<LightboxRef>,\n) => {\n  const [isLoading, setIsLoading] = useState(false);\n\n  const preloadImage = usePreloader();\n  const zoom = useZoomState();\n\n  const { currentIndex, goToIndex, next, prev } = useNavigation({\n    items,\n    loop,\n    startIndex,\n    resetZoom: zoom.resetZoom,\n    preloadImage,\n  });\n\n  const currentItem = items[currentIndex];\n  const canZoom = Boolean(zoomable && currentItem && currentItem.type !== 'video');\n\n  const handleWheel = useWheelZoom({ enabled: canZoom, setZoomLevel: zoom.setZoomLevel });\n\n  const { isAutoPlaying, setIsAutoPlaying, stopAutoplay } = useAutoplay({\n    isOpen,\n    autoplay,\n    itemCount: items.length,\n    currentIndex,\n    next,\n  });\n\n  const close = useCallback(() => {\n    stopAutoplay();\n    onClose();\n  }, [stopAutoplay, onClose]);\n\n  // open() with no argument starts at the first item.\n  const open = useCallback((index = 0) => goToIndex(index), [goToIndex]);\n\n  useImperativeHandle(ref, () => ({ open, close, next, prev, goTo: goToIndex }));\n\n  useLightboxKeyboard({ isOpen, showControls, autoplay, close, prev, next, setIsAutoPlaying });\n\n  const { handleTouchStart, handleTouchEnd } = useSwipe({ prev, next, close });\n\n  return {\n    currentIndex,\n    currentItem,\n    canZoom,\n    isLoading,\n    setIsLoading,\n    isAutoPlaying,\n    setIsAutoPlaying,\n    zoom,\n    handleWheel,\n    goToIndex,\n    next,\n    prev,\n    close,\n    handleTouchStart,\n    handleTouchEnd,\n  };\n};\n"],"mappings":";;;;;;;;;;;AAAA,SAAS,aAAa,qBAAqB,gBAAgB;AAkBpD,IAAM,cAAc,CACzB,EAAE,QAAQ,SAAS,OAAO,YAAY,cAAc,MAAM,UAAU,SAAS,GAC7E,QACG;AACH,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,QAAM,eAAe,aAAa;AAClC,QAAM,OAAO,aAAa;AAE1B,QAAM,EAAE,cAAc,WAAW,MAAM,KAAK,IAAI,cAAc;AAAA,IAC5D;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,KAAK;AAAA,IAChB;AAAA,EACF,CAAC;AAED,QAAM,cAAc,MAAM,YAAY;AACtC,QAAM,UAAU,QAAQ,YAAY,eAAe,YAAY,SAAS,OAAO;AAE/E,QAAM,cAAc,aAAa,EAAE,SAAS,SAAS,cAAc,KAAK,aAAa,CAAC;AAEtF,QAAM,EAAE,eAAe,kBAAkB,aAAa,IAAI,YAAY;AAAA,IACpE;AAAA,IACA;AAAA,IACA,WAAW,MAAM;AAAA,IACjB;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,QAAQ,YAAY,MAAM;AAC9B,iBAAa;AACb,YAAQ;AAAA,EACV,GAAG,CAAC,cAAc,OAAO,CAAC;AAG1B,QAAM,OAAO,YAAY,CAAC,QAAQ,MAAM,UAAU,KAAK,GAAG,CAAC,SAAS,CAAC;AAErE,sBAAoB,KAAK,OAAO,EAAE,MAAM,OAAO,MAAM,MAAM,MAAM,UAAU,EAAE;AAE7E,sBAAoB,EAAE,QAAQ,cAAc,UAAU,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAE3F,QAAM,EAAE,kBAAkB,eAAe,IAAI,SAAS,EAAE,MAAM,MAAM,MAAM,CAAC;AAE3E,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/chunk-3FQ4Q6PX.js

@@ -0,0 +1,61 @@
+// src/components/form/AddressAutocomplete/AddressOption.tsx
+import LocationIcon from "@mui/icons-material/LocationOn";
+import { alpha, Box, styled } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+var SuggestionItem = styled(Box)(({ theme }) => ({
+  padding: theme.spacing(1.5),
+  display: "flex",
+  alignItems: "flex-start",
+  gap: theme.spacing(1.5),
+  cursor: "pointer",
+  transition: theme.transitions.create(["background-color"]),
+  "&:hover": {
+    backgroundColor: alpha(theme.palette.primary.main, 0.08)
+  }
+}));
+var LocationIconWrapper = styled(Box)(({ theme }) => ({
+  marginTop: theme.spacing(0.5),
+  color: theme.palette.text.secondary
+}));
+var AddressText = styled(Box)(({ theme }) => ({
+  flex: 1,
+  "& .primary": {
+    fontSize: "0.9rem",
+    fontWeight: 500,
+    color: theme.palette.text.primary,
+    marginBottom: theme.spacing(0.25)
+  },
+  "& .secondary": {
+    fontSize: "0.8rem",
+    color: theme.palette.text.secondary
+  }
+}));
+var optionText = (option) => {
+  if (typeof option === "string") {
+    return {
+      testId: "address-suggestion-text",
+      primary: option.split(",")[0],
+      secondary: option.split(",").slice(1).join(",")
+    };
+  }
+  return {
+    testId: "address-prediction-text",
+    primary: option.structured_formatting?.main_text || option.description?.split(",")[0],
+    secondary: option.structured_formatting?.secondary_text || option.description?.split(",").slice(1).join(",")
+  };
+};
+var AddressOption = ({ optionProps, option, index }) => {
+  const { testId, primary, secondary } = optionText(option);
+  return /* @__PURE__ */ jsx("li", { ...optionProps, "data-testid": `address-suggestion-${index}`, children: /* @__PURE__ */ jsxs(SuggestionItem, { children: [
+    /* @__PURE__ */ jsx(LocationIconWrapper, { children: /* @__PURE__ */ jsx(LocationIcon, { fontSize: "small" }) }),
+    /* @__PURE__ */ jsxs(AddressText, { "data-testid": testId, children: [
+      /* @__PURE__ */ jsx("div", { className: "primary", children: primary }),
+      /* @__PURE__ */ jsx("div", { className: "secondary", children: secondary })
+    ] })
+  ] }) });
+};
+
+export {
+  AddressOption
+};
+//# sourceMappingURL=chunk-3FQ4Q6PX.js.map

package/dist/chunk-3FQ4Q6PX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/AddressAutocomplete/AddressOption.tsx"],"sourcesContent":["import LocationIcon from '@mui/icons-material/LocationOn';\nimport { alpha, Box, styled } from '@mui/material';\nimport type { FC, HTMLAttributes } from 'react';\nimport React from 'react';\n\nimport type { AddressOptionValue } from './AddressAutocomplete.types';\n\n// Module-local: styled() components cannot be exported across a module boundary\n// here without tripping TS2742.\nconst SuggestionItem = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(1.5),\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: theme.spacing(1.5),\n  cursor: 'pointer',\n  transition: theme.transitions.create(['background-color']),\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.primary.main, 0.08),\n  },\n}));\n\nconst LocationIconWrapper = styled(Box)(({ theme }) => ({\n  marginTop: theme.spacing(0.5),\n  color: theme.palette.text.secondary,\n}));\n\nconst AddressText = styled(Box)(({ theme }) => ({\n  flex: 1,\n  '& .primary': {\n    fontSize: '0.9rem',\n    fontWeight: 500,\n    color: theme.palette.text.primary,\n    marginBottom: theme.spacing(0.25),\n  },\n  '& .secondary': {\n    fontSize: '0.8rem',\n    color: theme.palette.text.secondary,\n  },\n}));\n\n// Predictions carry the street line and the rest already split; freeSolo text has\n// to be split on the first comma to get the same two lines.\nconst optionText = (option: AddressOptionValue) => {\n  if (typeof option === 'string') {\n    return {\n      testId: 'address-suggestion-text',\n      primary: option.split(',')[0],\n      secondary: option.split(',').slice(1).join(','),\n    };\n  }\n\n  return {\n    testId: 'address-prediction-text',\n    primary: option.structured_formatting?.main_text || option.description?.split(',')[0],\n    secondary:\n      option.structured_formatting?.secondary_text ||\n      option.description?.split(',').slice(1).join(','),\n  };\n};\n\nexport interface AddressOptionProps {\n  optionProps: HTMLAttributes<HTMLLIElement>;\n  option: AddressOptionValue;\n  index: number;\n}\n\nexport const AddressOption: FC<AddressOptionProps> = ({ optionProps, option, index }) => {\n  const { testId, primary, secondary } = optionText(option);\n\n  return (\n    <li {...optionProps} data-testid={`address-suggestion-${index}`}>\n      <SuggestionItem>\n        <LocationIconWrapper>\n          <LocationIcon fontSize=\"small\" />\n        </LocationIconWrapper>\n        <AddressText data-testid={testId}>\n          <div className=\"primary\">{primary}</div>\n          <div className=\"secondary\">{secondary}</div>\n        </AddressText>\n      </SuggestionItem>\n    </li>\n  );\n};\n"],"mappings":";AAAA,OAAO,kBAAkB;AACzB,SAAS,OAAO,KAAK,cAAc;AAwEzB,cAEF,YAFE;AAhEV,IAAM,iBAAiB,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACjD,SAAS,MAAM,QAAQ,GAAG;AAAA,EAC1B,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,KAAK,MAAM,QAAQ,GAAG;AAAA,EACtB,QAAQ;AAAA,EACR,YAAY,MAAM,YAAY,OAAO,CAAC,kBAAkB,CAAC;AAAA,EACzD,WAAW;AAAA,IACT,iBAAiB,MAAM,MAAM,QAAQ,QAAQ,MAAM,IAAI;AAAA,EACzD;AACF,EAAE;AAEF,IAAM,sBAAsB,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACtD,WAAW,MAAM,QAAQ,GAAG;AAAA,EAC5B,OAAO,MAAM,QAAQ,KAAK;AAC5B,EAAE;AAEF,IAAM,cAAc,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EAC9C,MAAM;AAAA,EACN,cAAc;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO,MAAM,QAAQ,KAAK;AAAA,IAC1B,cAAc,MAAM,QAAQ,IAAI;AAAA,EAClC;AAAA,EACA,gBAAgB;AAAA,IACd,UAAU;AAAA,IACV,OAAO,MAAM,QAAQ,KAAK;AAAA,EAC5B;AACF,EAAE;AAIF,IAAM,aAAa,CAAC,WAA+B;AACjD,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,MACL,QAAQ;AAAA,MACR,SAAS,OAAO,MAAM,GAAG,EAAE,CAAC;AAAA,MAC5B,WAAW,OAAO,MAAM,GAAG,EAAE,MAAM,CAAC,EAAE,KAAK,GAAG;AAAA,IAChD;AAAA,EACF;AAEA,SAAO;AAAA,IACL,QAAQ;AAAA,IACR,SAAS,OAAO,uBAAuB,aAAa,OAAO,aAAa,MAAM,GAAG,EAAE,CAAC;AAAA,IACpF,WACE,OAAO,uBAAuB,kBAC9B,OAAO,aAAa,MAAM,GAAG,EAAE,MAAM,CAAC,EAAE,KAAK,GAAG;AAAA,EACpD;AACF;AAQO,IAAM,gBAAwC,CAAC,EAAE,aAAa,QAAQ,MAAM,MAAM;AACvF,QAAM,EAAE,QAAQ,SAAS,UAAU,IAAI,WAAW,MAAM;AAExD,SACE,oBAAC,QAAI,GAAG,aAAa,eAAa,sBAAsB,KAAK,IAC3D,+BAAC,kBACC;AAAA,wBAAC,uBACC,8BAAC,gBAAa,UAAS,SAAQ,GACjC;AAAA,IACA,qBAAC,eAAY,eAAa,QACxB;AAAA,0BAAC,SAAI,WAAU,WAAW,mBAAQ;AAAA,MAClC,oBAAC,SAAI,WAAU,aAAa,qBAAU;AAAA,OACxC;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/chunk-3HLKTBEO.js

@@ -0,0 +1,21 @@
+// src/en-US.utility.ts
+var EN_US_INSTALL_PROMPT_COPY = {
+  title: "Install this app",
+  installLabel: "Install",
+  dismissLabel: "Dismiss the install prompt",
+  // The two halves wrap the platform's share glyph, which the component renders
+  // between them. Splitting the sentence is what lets the icon sit inline, so
+  // the translation has to keep the same seam rather than one whole sentence.
+  iosTapBefore: "Tap",
+  iosTapAfter: 'and then "Add to Home Screen"',
+  shareLabel: "Share"
+};
+var EN_US_USER_AVATAR_COPY = {
+  signOut: "Sign out"
+};
+
+export {
+  EN_US_INSTALL_PROMPT_COPY,
+  EN_US_USER_AVATAR_COPY
+};
+//# sourceMappingURL=chunk-3HLKTBEO.js.map

package/dist/chunk-3HLKTBEO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/en-US.utility.ts"],"sourcesContent":["/**\n * The en-US pack for the utility family. Split the same way\n * `pt-BR.utility.ts` is — see `en-US.ts` for why.\n */\nimport type {\n  InstallPromptCopy,\n  UserAvatarCopy,\n} from './copy';\n\nexport const EN_US_INSTALL_PROMPT_COPY: InstallPromptCopy = {\n  title: \"Install this app\",\n  installLabel: \"Install\",\n  dismissLabel: \"Dismiss the install prompt\",\n  // The two halves wrap the platform's share glyph, which the component renders\n  // between them. Splitting the sentence is what lets the icon sit inline, so\n  // the translation has to keep the same seam rather than one whole sentence.\n  iosTapBefore: \"Tap\",\n  iosTapAfter: 'and then \"Add to Home Screen\"',\n  shareLabel: \"Share\",\n};\n\nexport const EN_US_USER_AVATAR_COPY: UserAvatarCopy = {\n  signOut: \"Sign out\",\n};\n"],"mappings":";AASO,IAAM,4BAA+C;AAAA,EAC1D,OAAO;AAAA,EACP,cAAc;AAAA,EACd,cAAc;AAAA;AAAA;AAAA;AAAA,EAId,cAAc;AAAA,EACd,aAAa;AAAA,EACb,YAAY;AACd;AAEO,IAAM,yBAAyC;AAAA,EACpD,SAAS;AACX;","names":[]}

package/dist/chunk-3IDY6OUA.js

@@ -0,0 +1,49 @@
+import {
+  Chart
+} from "./chunk-VQNQA3DV.js";
+import {
+  CHART_SEMANTIC_COLORS,
+  specToChartProps
+} from "./chunk-GOWBYHYW.js";
+import {
+  accentFor
+} from "./chunk-OZCEKQIX.js";
+
+// src/components/data-display/Chart/SpecChart.tsx
+import { useTheme } from "@mui/material";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+var SpecChart = ({
+  spec,
+  data,
+  size,
+  fillHeight,
+  loading,
+  className,
+  onClick,
+  "data-testid": dataTestId = "spec-chart"
+}) => {
+  const theme = useTheme();
+  const chartProps = React.useMemo(() => {
+    const scheme = spec.colorScheme && spec.colorScheme.length > 0 ? spec.colorScheme : CHART_SEMANTIC_COLORS;
+    const resolveColor = (token, index) => accentFor(theme, token ?? scheme[index % scheme.length] ?? "primary").main;
+    return specToChartProps(spec, data, { resolveColor });
+  }, [spec, data, theme]);
+  return /* @__PURE__ */ jsx(
+    Chart,
+    {
+      ...chartProps,
+      size,
+      fillHeight,
+      loading,
+      className,
+      onClick,
+      "data-testid": dataTestId
+    }
+  );
+};
+
+export {
+  SpecChart
+};
+//# sourceMappingURL=chunk-3IDY6OUA.js.map

package/dist/chunk-3IDY6OUA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Chart/SpecChart.tsx"],"sourcesContent":["import { useTheme } from '@mui/material';\nimport React from 'react';\n\nimport { Chart } from './Chart';\nimport type { ChartDataPoint } from './Chart.types';\nimport type { ChartSemanticColor, ChartSpec } from './ChartSpec.types';\nimport { CHART_SEMANTIC_COLORS, specToChartProps } from './chart-spec';\nimport { accentFor } from '../../../tokens/scales';\n\nexport interface SpecChartProps {\n  /** Validated spec — parse untrusted JSON with `parseChartSpec` first. */\n  spec: ChartSpec;\n  data: ChartDataPoint[];\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /** Take the height of the box this chart is placed in — see `ChartProps`. */\n  fillHeight?: boolean;\n  loading?: boolean;\n  className?: string;\n  onClick?: (point: ChartDataPoint) => void;\n  'data-testid'?: string;\n}\n\n/**\n * Renders a chart from a JSON-serializable {@link ChartSpec} plus plain data\n * rows. Layered over the prop-driven `Chart` (one implementation); semantic\n * color tokens resolve against the active MUI theme at render time.\n */\nexport const SpecChart: React.FC<SpecChartProps> = ({\n  spec,\n  data,\n  size,\n  fillHeight,\n  loading,\n  className,\n  onClick,\n  'data-testid': dataTestId = 'spec-chart',\n}) => {\n  const theme = useTheme();\n  const chartProps = React.useMemo(() => {\n    const scheme: readonly ChartSemanticColor[] =\n      spec.colorScheme && spec.colorScheme.length > 0 ? spec.colorScheme : CHART_SEMANTIC_COLORS;\n    const resolveColor = (token: ChartSemanticColor | undefined, index: number): string =>\n      accentFor(theme, token ?? scheme[index % scheme.length] ?? 'primary').main;\n    return specToChartProps(spec, data, { resolveColor });\n  }, [spec, data, theme]);\n\n  return (\n    <Chart\n      {...chartProps}\n      size={size}\n      fillHeight={fillHeight}\n      loading={loading}\n      className={className}\n      onClick={onClick}\n      data-testid={dataTestId}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,gBAAgB;AACzB,OAAO,WAAW;AA8Cd;AApBG,IAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe,aAAa;AAC9B,MAAM;AACJ,QAAM,QAAQ,SAAS;AACvB,QAAM,aAAa,MAAM,QAAQ,MAAM;AACrC,UAAM,SACJ,KAAK,eAAe,KAAK,YAAY,SAAS,IAAI,KAAK,cAAc;AACvE,UAAM,eAAe,CAAC,OAAuC,UAC3D,UAAU,OAAO,SAAS,OAAO,QAAQ,OAAO,MAAM,KAAK,SAAS,EAAE;AACxE,WAAO,iBAAiB,MAAM,MAAM,EAAE,aAAa,CAAC;AAAA,EACtD,GAAG,CAAC,MAAM,MAAM,KAAK,CAAC;AAEtB,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAa;AAAA;AAAA,EACf;AAEJ;","names":[]}