@12-apps/ui 6.19.1 → 6.21.0

package/dist/chunk-NECUCG2S.js

@@ -1,240 +0,0 @@
-import {
-  FilterDialog,
-  GridFilterPanel
-} from "./chunk-CLNTJM3F.js";
-import {
-  DataViewsEmpty
-} from "./chunk-ISSJNFJV.js";
-import {
-  InlineFilterControls
-} from "./chunk-C6XESZ3R.js";
-import {
-  GridHeaderRow
-} from "./chunk-ENNW5SKT.js";
-import {
-  GridMain
-} from "./chunk-AP4FLCLA.js";
-import {
-  DataViewsPagination
-} from "./chunk-HP2ODXNA.js";
-import {
-  toOverflowFields,
-  useFilterOverflow
-} from "./chunk-TQ6FPOPD.js";
-import {
-  resolveSelectionExtra
-} from "./chunk-KX75HM5U.js";
-import {
-  ScopeTabsSlot
-} from "./chunk-Y5UCOBQN.js";
-import {
-  ShellToolbar
-} from "./chunk-LIOVN5IM.js";
-import {
-  togglePillValues
-} from "./chunk-YLDS5FOQ.js";
-import {
-  DataViewsLayoutProvider,
-  useDataViewsLayout
-} from "./chunk-ZPIMPOHV.js";
-import {
-  useDataViewsCopy
-} from "./chunk-KHG57NAE.js";
-import {
-  TableFilter
-} from "./chunk-J3JGO6Y6.js";
-import {
-  default as default2
-} from "./chunk-WEBEOBN5.js";
-
-// src/components/data-display/DataViews/data-views-grid-parts.tsx
-import { useEffect, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function LayoutStateSync({
-  c
-}) {
-  const { layout } = useDataViewsLayout();
-  const stored = c.state.layout;
-  useEffect(() => {
-    if (stored !== layout) c.patch({ layout });
-  }, [layout, stored]);
-  return null;
-}
-function useGridShellFilters({
-  c,
-  inlineFilters,
-  fields,
-  rangeFields,
-  testIdPrefix,
-  alwaysShowSearch,
-  hasExport
-}) {
-  const { state } = c;
-  const [openControls, setOpenControls] = useState(0);
-  const split = useFilterOverflow(
-    toOverflowFields(fields, rangeFields),
-    state.pills,
-    c.ranges,
-    openControls > 0,
-    hasExport
-  );
-  const showInline = inlineFilters;
-  const useModal = false;
-  const inlineVisible = showInline && (alwaysShowSearch || fields.length > 0 || rangeFields.length > 0 || state.search !== "");
-  const filterProps = {
-    testIdPrefix,
-    search: state.search,
-    fields,
-    rangeFields,
-    pills: state.pills,
-    ranges: c.ranges,
-    onSearchChange: (value) => c.patch({ search: value }),
-    // Updater, never the render's `state` — see {@link DataViewStatePatch}.
-    onTogglePill: (fieldId, value, checked) => c.patch(({ pills }) => ({ pills: { ...pills, [fieldId]: togglePillValues(pills[fieldId], value, checked) } })),
-    onChangeRange: (fieldId, range) => c.patch({ ranges: { ...c.ranges, [fieldId]: range } }),
-    onClearField: (fieldId) => c.patch({ pills: { ...state.pills, [fieldId]: [] } }),
-    onClearAll: () => c.patch({ search: "", pills: {}, ranges: {} })
-  };
-  return {
-    showInline,
-    useModal,
-    inlineVisible,
-    filterProps,
-    split,
-    onControlOpenChange: (open) => setOpenControls((count) => Math.max(0, count + (open ? 1 : -1)))
-  };
-}
-function ShellStack({
-  props,
-  filters
-}) {
-  const copy = useDataViewsCopy();
-  const { c, testIdPrefix, dataTestId, scopes = [], emptyState, inlineFilters = false } = props;
-  const { showInline, useModal, inlineVisible, filterProps, split, onControlOpenChange } = filters;
-  const body = /* @__PURE__ */ jsx(
-    DataViewsEmpty,
-    {
-      filtered: c.activeFilterCount > 0 || c.state.search !== "",
-      onClearFilters: () => c.patch({ search: "", pills: {}, ranges: {} }),
-      emptyState,
-      testIdPrefix
-    }
-  );
-  return /* @__PURE__ */ jsx(
-    TableFilter,
-    {
-      copy: copy.tableFilter,
-      open: c.filterOpen,
-      onOpenChange: c.setFilterOpen,
-      hasActiveFilters: c.activeFilterCount > 0,
-      children: /* @__PURE__ */ jsxs(default2, { spacing: 0, "data-testid": dataTestId ? `${dataTestId}-container` : void 0, children: [
-        /* @__PURE__ */ jsx(GridHeaderRow, { title: props.title, headerActions: props.headerActions, testIdPrefix }),
-        /* @__PURE__ */ jsx(
-          ShellToolbar,
-          {
-            c,
-            rows: props.rows,
-            sortKinds: props.sortKinds,
-            displayView: props.displayView,
-            exportConfig: props.exportConfig,
-            filterControls: inlineVisible ? /* @__PURE__ */ jsx(
-              InlineFilterControls,
-              {
-                ...filterProps,
-                split,
-                activeFilterCount: c.activeFilterCount,
-                onControlOpenChange
-              }
-            ) : void 0,
-            barRef: split.barRef,
-            testIdPrefix,
-            rowActions: props.rowActions,
-            bulkActions: props.bulkActions,
-            selectionExtra: resolveSelectionExtra(props),
-            toolbarRightSlot: props.toolbarRightSlot,
-            compactControls: showInline && split.compactControls,
-            counterHidden: showInline && split.counterHidden,
-            showInline
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          ScopeTabsSlot,
-          {
-            scopes,
-            scopeFieldId: props.scopeFieldId,
-            board: props.board,
-            value: c.scope,
-            onChange: c.setScope,
-            counts: c.scopeCounts,
-            testIdPrefix
-          }
-        ),
-        /* @__PURE__ */ jsxs(TableFilter.Layout, { children: [
-          /* @__PURE__ */ jsxs(TableFilter.Main, { children: [
-            /* @__PURE__ */ jsx(
-              GridMain,
-              {
-                c,
-                getRowId: props.getRowId,
-                renderCard: props.renderCard,
-                renderListRow: props.renderListRow,
-                listGroup: props.listGroup,
-                board: props.board,
-                dataTestId,
-                testIdPrefix,
-                emptyState: body
-              }
-            ),
-            /* @__PURE__ */ jsx(DataViewsPagination, { c, testIdPrefix })
-          ] }),
-          inlineFilters ? null : /* @__PURE__ */ jsx(GridFilterPanel, { ...filterProps })
-        ] }),
-        useModal && /* @__PURE__ */ jsx(FilterDialog, { open: c.filterOpen, onClose: () => c.setFilterOpen(false), ...filterProps })
-      ] })
-    }
-  );
-}
-function GridShell(props) {
-  const {
-    c,
-    fields,
-    rangeFields,
-    testIdPrefix,
-    renderCard,
-    renderListRow,
-    board,
-    defaultLayout,
-    ignoreStoredLayout,
-    inlineFilters = false,
-    alwaysShowSearch = false
-  } = props;
-  const filters = useGridShellFilters({
-    c,
-    inlineFilters,
-    fields,
-    rangeFields,
-    testIdPrefix,
-    alwaysShowSearch,
-    hasExport: props.exportConfig !== void 0
-  });
-  return /* @__PURE__ */ jsxs(
-    DataViewsLayoutProvider,
-    {
-      canUseCards: Boolean(renderCard),
-      canUseList: Boolean(renderListRow),
-      canUseBoard: Boolean(board && renderCard),
-      defaultLayout,
-      ignoreStoredLayout,
-      viewLayout: c.state.layout,
-      children: [
-        /* @__PURE__ */ jsx(LayoutStateSync, { c }),
-        /* @__PURE__ */ jsx(ShellStack, { props, filters })
-      ]
-    }
-  );
-}
-
-export {
-  GridShell
-};
-//# sourceMappingURL=chunk-NECUCG2S.js.map

package/dist/chunk-NFHS77NE.js

@@ -1,32 +0,0 @@
-import {
-  useFormContext
-} from "./chunk-4XK6JQ4D.js";
-import {
-  Button
-} from "./chunk-SL4NFGOL.js";
-
-// src/components/form/total-form/SubmitButton.tsx
-import { jsx } from "react/jsx-runtime";
-var FIELD_HEIGHT = 56;
-function SubmitButton({
-  children,
-  dataTestId = "total-form-submit"
-}) {
-  const { submitting } = useFormContext();
-  return /* @__PURE__ */ jsx(
-    Button,
-    {
-      type: "submit",
-      dataTestId,
-      loading: submitting,
-      disabled: submitting,
-      sx: { height: FIELD_HEIGHT, px: 2, fontSize: "1rem", flexShrink: 0, whiteSpace: "nowrap" },
-      children
-    }
-  );
-}
-
-export {
-  SubmitButton
-};
-//# sourceMappingURL=chunk-NFHS77NE.js.map

package/dist/chunk-NQC6H7GY.js

@@ -1,147 +0,0 @@
-import {
-  ERROR_ICON_BOX,
-  ERROR_ICON_BOX_OPACITY,
-  ERROR_ICON_SIZE,
-  ERROR_MESSAGE_LINE_HEIGHT,
-  ERROR_MESSAGE_MAX_WIDTH,
-  ERROR_STATE_GAP_UNITS,
-  ERROR_STATE_MIN_HEIGHT,
-  ERROR_STATE_PADDING_UNITS,
-  ERROR_TEXT_GAP_UNITS,
-  RETRY_MARGIN_TOP_UNITS,
-  RETRY_MIN_WIDTH
-} from "./chunk-TLGGVE56.js";
-import {
-  resolveTestId
-} from "./chunk-QLWBQQW7.js";
-
-// src/components/data-display/ErrorState/ErrorState.tsx
-import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline";
-import RefreshIcon from "@mui/icons-material/Refresh";
-import WarningAmberIcon from "@mui/icons-material/WarningAmber";
-import Box from "@mui/material/Box/index.js";
-import Button from "@mui/material/Button/index.js";
-import Stack from "@mui/material/Stack/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { useTheme } from "@mui/material/styles/index.js";
-import React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var makeTestId = (dataTestId) => (suffix) => dataTestId ? `${dataTestId}-${suffix}` : `error-state-${suffix}`;
-var paletteFor = (theme, severity) => severity === "error" ? theme.palette.error : theme.palette.warning;
-var ErrorIcon = ({ severity, icon, testId }) => {
-  const theme = useTheme();
-  const color = paletteFor(theme, severity);
-  const Fallback = severity === "error" ? ErrorOutlineIcon : WarningAmberIcon;
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      "data-testid": testId,
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        width: ERROR_ICON_BOX,
-        height: ERROR_ICON_BOX,
-        borderRadius: "50%",
-        backgroundColor: color.light,
-        opacity: ERROR_ICON_BOX_OPACITY
-      },
-      children: icon || /* @__PURE__ */ jsx(Fallback, { sx: { fontSize: ERROR_ICON_SIZE, color: color.main } })
-    }
-  );
-};
-var ErrorText = ({ title, message, titleId, testId }) => {
-  const theme = useTheme();
-  return /* @__PURE__ */ jsxs(Stack, { spacing: ERROR_TEXT_GAP_UNITS, alignItems: "center", children: [
-    title && /* @__PURE__ */ jsx(
-      Typography,
-      {
-        id: titleId,
-        variant: "h6",
-        component: "h3",
-        "data-testid": testId("title"),
-        sx: {
-          fontWeight: theme.typography.fontWeightMedium,
-          color: theme.palette.text.primary
-        },
-        children: title
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Typography,
-      {
-        id: `${titleId}-message`,
-        variant: "body2",
-        color: "text.secondary",
-        "data-testid": testId("message"),
-        sx: {
-          maxWidth: ERROR_MESSAGE_MAX_WIDTH,
-          lineHeight: ERROR_MESSAGE_LINE_HEIGHT
-        },
-        children: message
-      }
-    )
-  ] });
-};
-var ErrorState = React.memo((props) => {
-  const {
-    message,
-    title,
-    onRetry,
-    retryLabel = "Retry",
-    severity = "error",
-    icon,
-    className
-  } = props;
-  const theme = useTheme();
-  const titleId = React.useId();
-  const dataTestId = resolveTestId(props);
-  const testId = makeTestId(dataTestId);
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      role: "alert",
-      "aria-labelledby": title ? titleId : void 0,
-      "aria-describedby": `${titleId}-message`,
-      className,
-      "data-testid": dataTestId || "error-state",
-      sx: {
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        textAlign: "center",
-        padding: theme.spacing(ERROR_STATE_PADDING_UNITS),
-        minHeight: ERROR_STATE_MIN_HEIGHT,
-        gap: theme.spacing(ERROR_STATE_GAP_UNITS)
-      },
-      children: [
-        /* @__PURE__ */ jsx(ErrorIcon, { severity, icon, testId: testId("icon") }),
-        /* @__PURE__ */ jsx(ErrorText, { title, message, titleId, testId }),
-        onRetry && /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "outlined",
-            color: severity,
-            onClick: onRetry,
-            startIcon: /* @__PURE__ */ jsx(RefreshIcon, {}),
-            "data-testid": testId("retry-button"),
-            sx: {
-              mt: theme.spacing(RETRY_MARGIN_TOP_UNITS),
-              minWidth: RETRY_MIN_WIDTH
-            },
-            children: retryLabel
-          }
-        )
-      ]
-    }
-  );
-});
-ErrorState.displayName = "ErrorState";
-var ErrorState_default = ErrorState;
-
-export {
-  ErrorState,
-  ErrorState_default
-};
-//# sourceMappingURL=chunk-NQC6H7GY.js.map

package/dist/chunk-NQHOHQCY.js

@@ -1,71 +0,0 @@
-import {
-  avatarFor,
-  chipRole,
-  chipStyles,
-  iconWithTestId,
-  isClickable,
-  makeKeyDownHandler,
-  makeTestId
-} from "./chunk-FS4X3VDA.js";
-
-// src/components/data-display/Chip/Chip.tsx
-import CancelIcon from "@mui/icons-material/Cancel";
-import MuiChip from "@mui/material/Chip/index.js";
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-var muiSizeFor = (size) => size === "xs" || size === "sm" ? "small" : "medium";
-var muiColorFor = (color) => {
-  if (color === "danger") return "error";
-  return color === "neutral" ? "default" : color;
-};
-var Chip = forwardRef(({
-  label,
-  variant = "filled",
-  size = "md",
-  color = "primary",
-  avatarSrc,
-  avatar,
-  icon,
-  selected,
-  selectable,
-  deletable,
-  disabled,
-  onClick,
-  onDelete,
-  className,
-  dataTestId,
-  ...props
-}, ref) => {
-  const testId = makeTestId(dataTestId);
-  const clickable = isClickable(disabled, onClick, selectable);
-  return /* @__PURE__ */ jsx(
-    MuiChip,
-    {
-      ref,
-      label: /* @__PURE__ */ jsx("span", { "data-testid": testId("label"), children: label }),
-      variant,
-      size: muiSizeFor(size),
-      color: muiColorFor(color),
-      avatar: avatarFor(avatar, avatarSrc),
-      icon: iconWithTestId(icon, testId("icon")),
-      onDelete: deletable ? onDelete : void 0,
-      deleteIcon: deletable ? /* @__PURE__ */ jsx(CancelIcon, { "data-testid": testId("delete") }) : void 0,
-      disabled,
-      clickable,
-      onClick: clickable ? onClick : void 0,
-      onKeyDown: makeKeyDownHandler({ disabled, deletable, selectable, onClick, onDelete }),
-      className,
-      role: chipRole(selectable, onClick),
-      "aria-selected": selectable ? selected : void 0,
-      "data-testid": dataTestId || "chip",
-      sx: chipStyles({ variant, selected, clickable, disabled }),
-      ...props
-    }
-  );
-});
-Chip.displayName = "Chip";
-
-export {
-  Chip
-};
-//# sourceMappingURL=chunk-NQHOHQCY.js.map

package/dist/chunk-NQHOHQCY.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/Chip/Chip.tsx"],"sourcesContent":["import CancelIcon from '@mui/icons-material/Cancel';\nimport MuiChip from '@mui/material/Chip/index.js';\nimport { forwardRef } from 'react';\n\nimport {\n  avatarFor,\n  chipRole,\n  chipStyles,\n  iconWithTestId,\n  isClickable,\n  makeKeyDownHandler,\n  makeTestId,\n} from './Chip.helpers';\nimport type { ChipProps } from './Chip.types';\n\n/** MUI draws two chip sizes; ours are the house abbreviations for them. */\nconst muiSizeFor = (size: NonNullable<ChipProps['size']>): 'small' | 'medium' =>\n  size === 'xs' || size === 'sm' ? 'small' : 'medium';\n\ntype MuiChipColor =\n  | 'primary'\n  | 'secondary'\n  | 'error'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'default';\n\n/**\n * `danger` and `neutral` are ours; the rest are MUI's own names already.\n *\n * The same boundary translation `Button` performs, and it must stay a\n * translation rather than a cast: a cast is what let `danger` through untouched\n * and had MUI silently fall back to grey.\n *\n * `neutral` maps to `default`, not to `inherit` as it does on a button. A chip's\n * unaccented state is a real palette entry with its own fill; `inherit` would\n * take the surrounding text colour and paint a chip that reads as disabled.\n */\nconst muiColorFor = (color: NonNullable<ChipProps['color']>): MuiChipColor => {\n  if (color === 'danger') return 'error';\n  return color === 'neutral' ? 'default' : color;\n};\n\nexport const Chip = forwardRef<HTMLDivElement, ChipProps>(({\n  label,\n  variant = 'filled',\n  size = 'md',\n  color = 'primary',\n  avatarSrc,\n  avatar,\n  icon,\n  selected,\n  selectable,\n  deletable,\n  disabled,\n  onClick,\n  onDelete,\n  className,\n  dataTestId,\n  ...props\n}, ref) => {\n  const testId = makeTestId(dataTestId);\n  const clickable = isClickable(disabled, onClick, selectable);\n\n  return (\n    <MuiChip\n      ref={ref}\n      label={<span data-testid={testId('label')}>{label}</span>}\n      variant={variant}\n      size={muiSizeFor(size)}\n      color={muiColorFor(color)}\n      avatar={avatarFor(avatar, avatarSrc)}\n      icon={iconWithTestId(icon, testId('icon'))}\n      onDelete={deletable ? onDelete : undefined}\n      deleteIcon={deletable ? <CancelIcon data-testid={testId('delete')} /> : undefined}\n      disabled={disabled}\n      clickable={clickable}\n      onClick={clickable ? onClick : undefined}\n      onKeyDown={makeKeyDownHandler({ disabled, deletable, selectable, onClick, onDelete })}\n      className={className}\n      role={chipRole(selectable, onClick)}\n      aria-selected={selectable ? selected : undefined}\n      data-testid={dataTestId || 'chip'}\n      sx={chipStyles({ variant, selected, clickable, disabled })}\n      {...props}\n    />\n  );\n});\n\nChip.displayName = 'Chip';\n"],"mappings":";;;;;;;;;;;AAAA,OAAO,gBAAgB;AACvB,OAAO,aAAa;AACpB,SAAS,kBAAkB;AAkEd;AApDb,IAAM,aAAa,CAAC,SAClB,SAAS,QAAQ,SAAS,OAAO,UAAU;AAsB7C,IAAM,cAAc,CAAC,UAAyD;AAC5E,MAAI,UAAU,SAAU,QAAO;AAC/B,SAAO,UAAU,YAAY,YAAY;AAC3C;AAEO,IAAM,OAAO,WAAsC,CAAC;AAAA,EACzD;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,QAAQ;AACT,QAAM,SAAS,WAAW,UAAU;AACpC,QAAM,YAAY,YAAY,UAAU,SAAS,UAAU;AAE3D,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,oBAAC,UAAK,eAAa,OAAO,OAAO,GAAI,iBAAM;AAAA,MAClD;AAAA,MACA,MAAM,WAAW,IAAI;AAAA,MACrB,OAAO,YAAY,KAAK;AAAA,MACxB,QAAQ,UAAU,QAAQ,SAAS;AAAA,MACnC,MAAM,eAAe,MAAM,OAAO,MAAM,CAAC;AAAA,MACzC,UAAU,YAAY,WAAW;AAAA,MACjC,YAAY,YAAY,oBAAC,cAAW,eAAa,OAAO,QAAQ,GAAG,IAAK;AAAA,MACxE;AAAA,MACA;AAAA,MACA,SAAS,YAAY,UAAU;AAAA,MAC/B,WAAW,mBAAmB,EAAE,UAAU,WAAW,YAAY,SAAS,SAAS,CAAC;AAAA,MACpF;AAAA,MACA,MAAM,SAAS,YAAY,OAAO;AAAA,MAClC,iBAAe,aAAa,WAAW;AAAA,MACvC,eAAa,cAAc;AAAA,MAC3B,IAAI,WAAW,EAAE,SAAS,UAAU,WAAW,SAAS,CAAC;AAAA,MACxD,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,KAAK,cAAc;","names":[]}

package/dist/chunk-OAXAF4VY.js

@@ -1,161 +0,0 @@
-import {
-  CategoryPanel
-} from "./chunk-MHFJBNDP.js";
-import {
-  CategoryPanelSurface
-} from "./chunk-LMXWI3DD.js";
-import {
-  useCategorySelect
-} from "./chunk-2GB5CIN6.js";
-import {
-  useCategoryKeyHandler
-} from "./chunk-ISH42UC7.js";
-import {
-  useCategoryCommit
-} from "./chunk-ZAB65STX.js";
-import {
-  summarizeSelection
-} from "./chunk-LR6MSKTT.js";
-import {
-  CategoryTrigger
-} from "./chunk-ZBNTFWTG.js";
-import {
-  METRICS
-} from "./chunk-FCOEJCUP.js";
-import {
-  FormControl,
-  FormLabel,
-  FormMessage
-} from "./chunk-IPPTOL53.js";
-
-// src/components/form/CategorySelect/CategorySelect.tsx
-import { useEffect, useMemo, useRef } from "react";
-import { useTheme } from "@mui/material/styles/index.js";
-import useMediaQuery from "@mui/material/useMediaQuery/index.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-function appliedIds(props) {
-  if (props.mode === "single") return props.value ? [props.value] : [];
-  return props.value;
-}
-function draftChanged(draft, applied) {
-  return draft.size !== applied.length || applied.some((id) => !draft.has(id));
-}
-function singleLabel(groups, value) {
-  if (!value) return void 0;
-  const asCategory = groups.find((group) => group.category.id === value);
-  if (asCategory) return asCategory.category.name;
-  const owner = groups.find((group) => group.subcategories.some((sub2) => sub2.id === value));
-  const sub = owner?.subcategories.find((candidate) => candidate.id === value);
-  return sub && owner ? `${owner.category.name} \u203A ${sub.name}` : void 0;
-}
-function resolveConfig(props) {
-  const single = props.mode === "single";
-  return {
-    single,
-    placeholder: props.placeholder ?? (single ? props.copy.placeholderSingle : props.copy.placeholderMulti),
-    disabled: props.disabled ?? false,
-    loading: props.loading ?? false,
-    fullWidth: props.fullWidth ?? false,
-    showCounts: props.showCounts ?? false,
-    allowParentSelection: props.allowParentSelection ?? false,
-    dataTestId: props.dataTestId ?? "category-select"
-  };
-}
-function usePanelFocus(open, activeIndex, searchInputRef, listRef) {
-  useEffect(() => {
-    if (!open) return void 0;
-    const frame = requestAnimationFrame(() => searchInputRef.current?.focus());
-    return () => cancelAnimationFrame(frame);
-  }, [open, searchInputRef]);
-  useEffect(() => {
-    if (activeIndex < 0) return;
-    const rows = listRef.current?.querySelectorAll('[role="option"], [role="button"]');
-    rows?.[activeIndex]?.scrollIntoView({ block: "nearest" });
-  }, [activeIndex, listRef]);
-}
-function CategorySelect(props) {
-  const { options, label, error, onCreateCategory, copy } = props;
-  const {
-    single,
-    placeholder,
-    disabled,
-    loading,
-    fullWidth,
-    showCounts,
-    allowParentSelection,
-    dataTestId
-  } = resolveConfig(props);
-  const theme = useTheme();
-  const sheet = useMediaQuery(theme.breakpoints.down(METRICS.sheetBreakpoint));
-  const applied = appliedIds(props);
-  const state = useCategorySelect({ options, selected: applied });
-  const searchInputRef = useRef(null);
-  const listRef = useRef(null);
-  usePanelFocus(state.open, state.activeIndex, searchInputRef, listRef);
-  const chips = useMemo(
-    () => summarizeSelection(state.allGroups, state.draft),
-    [state.allGroups, state.draft]
-  );
-  const rowIds = useMemo(() => state.rows.map((row) => row.id), [state.rows]);
-  const actions = useCategoryCommit({ props, state, single, allowParentSelection });
-  const onKeyDown = useCategoryKeyHandler({ state, single, allowParentSelection, actions });
-  return /* @__PURE__ */ jsxs(FormControl, { fullWidth, error: Boolean(error), children: [
-    label && /* @__PURE__ */ jsx(FormLabel, { error: Boolean(error), children: label }),
-    /* @__PURE__ */ jsx(
-      CategoryTrigger,
-      {
-        copy,
-        placeholder,
-        selectionLabel: props.mode === "single" ? singleLabel(state.allGroups, props.value) : void 0,
-        count: single ? void 0 : applied.length,
-        open: state.open,
-        disabled,
-        fullWidth,
-        onOpen: state.openPanel,
-        onClear: applied.length > 0 ? actions.clearSelection : void 0,
-        triggerRef: state.triggerRef,
-        dataTestId
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      CategoryPanelSurface,
-      {
-        open: state.open,
-        sheet,
-        anchorEl: state.triggerRef.current,
-        onClose: actions.cancel,
-        children: /* @__PURE__ */ jsx(
-          CategoryPanel,
-          {
-            copy,
-            state,
-            chips,
-            rowIds,
-            changed: draftChanged(state.draft, applied),
-            single,
-            sheet,
-            loading,
-            showCounts,
-            allowParentSelection,
-            ariaLabel: label ?? placeholder,
-            onKeyDown,
-            onActivateCategory: actions.activateCategory,
-            onActivateSubcategory: actions.activateSubcategory,
-            onApply: actions.commit,
-            onCancel: actions.cancel,
-            onCreateCategory,
-            searchInputRef,
-            listRef,
-            dataTestId
-          }
-        )
-      }
-    ),
-    error && /* @__PURE__ */ jsx(FormMessage, { error: true, dataTestId: `${dataTestId}-message`, children: error })
-  ] });
-}
-
-export {
-  CategorySelect
-};
-//# sourceMappingURL=chunk-OAXAF4VY.js.map