@mastra/playground-ui 37.0.1-alpha.2 → 37.1.0-alpha.4

package/dist/select-CFB6QZ9B.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-CFB6QZ9B.js","sources":["../src/ds/components/Select/select.tsx"],"sourcesContent":["import { Select as SelectPrimitive } from '@base-ui/react/select';\nimport type { SelectPopupProps, SelectPositionerProps } from '@base-ui/react/select';\nimport { Check, ChevronDown } from 'lucide-react';\nimport * as React from 'react';\n\nimport { buttonVariants } from '../Button/Button';\nimport type { TextButtonSize } from '../Button/Button';\nimport { controlTriggerOpenState } from '@/ds/primitives/control-size';\nimport { usePortalContainer } from '@/ds/primitives/portal-container';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\n/**\n * Select migrated from `@radix-ui/react-select` to Base UI (`@base-ui/react/select`).\n *\n * The public API (`Select`, `SelectGroup`, `SelectValue`, `SelectTrigger`,\n * `SelectContent`, `SelectItem`) is intentionally kept stable so existing\n * consumers do not need changes.\n *\n * Notable behavioral differences vs. Radix that consumers should be aware of:\n * - `onValueChange` now receives a second `eventDetails` argument. Existing\n *   handlers typed as `(value: string) => void` keep working (extra arg ignored).\n * - The dropdown no longer overlaps the trigger by default\n *   (`alignItemWithTrigger={false}`), matching the previous Radix `popper`\n *   positioning behavior.\n *\n * Implementation note: unlike Radix, Base UI's `Select.Value` can only resolve\n * a selected value to its label once the popup has mounted (it reads labels\n * from rendered items). To preserve the Radix behavior where the trigger shows\n * the selected label even while closed, `Select` auto-derives an `items` map\n * from the `SelectItem`s declared inside `SelectContent` and passes it to\n * `Select.Root`. Consumers can still pass an explicit `items` prop to override.\n */\ntype SelectItemNode = React.ReactElement<{ value: unknown; children?: React.ReactNode }>;\n\nfunction isSelectItem(node: React.ReactNode): node is SelectItemNode {\n  return React.isValidElement(node) && (node.type as { displayName?: string })?.displayName === 'SelectItem';\n}\n\n/** Recursively collect `{ value, label }` pairs from declared `SelectItem`s. */\nfunction collectItems(children: React.ReactNode, acc: Array<{ value: unknown; label: React.ReactNode }>): void {\n  React.Children.forEach(children, child => {\n    if (!React.isValidElement(child)) return;\n    if (isSelectItem(child)) {\n      acc.push({ value: child.props.value, label: child.props.children });\n      return;\n    }\n    const nested = (child.props as { children?: React.ReactNode })?.children;\n    if (nested != null) collectItems(nested, acc);\n  });\n}\n\ntype SelectRootProps<Value> = SelectPrimitive.Root.Props<Value, false>;\ntype SelectChangeDetails = Parameters<NonNullable<SelectRootProps<unknown>['onValueChange']>>[1];\n\n/**\n * `onValueChange` is intentionally narrowed to a non-null value: these selects\n * always hold a value once changed, which keeps existing `(value) => void`\n * consumer handlers valid (Base UI's own callback type is `Value | null`).\n */\ntype SelectProps<Value = string> = Omit<SelectRootProps<Value>, 'onValueChange'> & {\n  onValueChange?: (value: Value, eventDetails: SelectChangeDetails) => void;\n};\n\nfunction Select<Value = string>({ children, items, onValueChange, ...props }: SelectProps<Value>) {\n  const derivedItems = React.useMemo(() => {\n    if (items != null) return items;\n    const acc: Array<{ value: unknown; label: React.ReactNode }> = [];\n    collectItems(children, acc);\n    return acc.length > 0 ? acc : undefined;\n  }, [items, children]);\n\n  return (\n    <SelectPrimitive.Root\n      items={derivedItems as SelectRootProps<Value>['items']}\n      onValueChange={onValueChange ? (value, eventDetails) => onValueChange(value as Value, eventDetails) : undefined}\n      {...props}\n    >\n      {children}\n    </SelectPrimitive.Root>\n  );\n}\nSelect.displayName = 'Select';\n\nconst SelectGroup = SelectPrimitive.Group;\n\nexport type SelectValueProps = Omit<SelectPrimitive.Value.Props, 'className'> & {\n  className?: string;\n};\n\n/**\n * Displays the selected value. Radix's `Select.Value` took a `placeholder`\n * prop and rendered the selected item's text automatically; Base UI's\n * `Select.Value` behaves the same way (renders the value, falls back to\n * `placeholder` when nothing is selected), so this is a thin passthrough.\n */\nconst SelectValue = React.forwardRef<HTMLSpanElement, SelectValueProps>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Value ref={ref} className={cn('truncate', className)} {...props} />\n));\nSelectValue.displayName = 'SelectValue';\n\n/**\n * A select is a form field, so it reuses the same button looks consumers see\n * everywhere: `default` (the Button's filled default surface — the default\n * here too), `outline` (bordered, transparent) and `ghost` (borderless, for\n * dense toolbars/inline pickers). The high-emphasis `primary` look is the only\n * one intentionally NOT offered (a field is not a call-to-action).\n */\nexport type SelectTriggerVariant = 'default' | 'outline' | 'ghost';\ntype SelectTriggerLegacyVariant = 'primary';\n\nexport type SelectTriggerProps = Omit<SelectPrimitive.Trigger.Props, 'className'> & {\n  className?: string;\n  size?: TextButtonSize;\n  variant?: SelectTriggerVariant | SelectTriggerLegacyVariant;\n};\n\nfunction normalizeSelectTriggerVariant(\n  variant: SelectTriggerVariant | SelectTriggerLegacyVariant,\n): SelectTriggerVariant {\n  return variant === 'primary' ? 'default' : variant;\n}\n\nconst SelectTrigger = React.forwardRef<HTMLButtonElement, SelectTriggerProps>(\n  ({ className, children, size = 'md', variant = 'default', ...props }, ref) => {\n    const visualVariant = normalizeSelectTriggerVariant(variant);\n\n    return (\n      <SelectPrimitive.Trigger\n        ref={ref}\n        data-slot=\"select-trigger\"\n        // A select = a button + a trailing chevron: reuse the Button recipe\n        // (variant colors, size = height/text/padding/radius, unified border\n        // focus, disabled) and layer only the select-specific extras.\n        className={cn(\n          buttonVariants({ variant: visualVariant, size }),\n          // Fill the field and push the value left / chevron right (Button's\n          // base centers its content with `justify-center`).\n          'w-full justify-between',\n          // Read as \"active\" while the menu is open, per variant (see map above).\n          controlTriggerOpenState[visualVariant],\n          'data-[placeholder]:text-neutral3',\n          '[&>span]:truncate',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {/* `SelectPrimitive.Icon` renders the provided element in place of its\n            default `<span>`, so the chevron would land as a *direct* `<svg>`\n            child of the trigger — where Button's `TEXT_MODE_ADORNMENTS`\n            `[&>svg]` rules (negative `mx`, forced 50% opacity, 1.1em sizing)\n            would distort and mis-position it. Wrapping it in a `<span>` keeps\n            the svg one level deep so those rules can't reach it, leaving the\n            chevron pinned at the right edge at its intended size and opacity. */}\n        <SelectPrimitive.Icon\n          render={\n            <span className=\"flex shrink-0 items-center\">\n              <ChevronDown className={cn('h-4 w-4 opacity-60', transitions.colors)} />\n            </span>\n          }\n        />\n      </SelectPrimitive.Trigger>\n    );\n  },\n);\nSelectTrigger.displayName = 'SelectTrigger';\n\ntype SelectContentPositionerProps = Omit<SelectPositionerProps, keyof SelectPopupProps>;\n\nexport type SelectContentProps = Omit<SelectPopupProps, 'className'> &\n  SelectContentPositionerProps & {\n    className?: string;\n    /**\n     * Kept for API compatibility with the previous Radix API. Radix supported\n     * `position=\"popper\" | \"item-aligned\"`; Base UI always uses popper-style\n     * positioning so this prop is accepted but has no effect.\n     */\n    position?: 'popper' | 'item-aligned';\n    /** Optional portal container, forwarded to `Select.Portal`. */\n    container?: HTMLElement | null;\n  };\n\nconst SelectContent = React.forwardRef<HTMLDivElement, SelectContentProps>(\n  (\n    {\n      className,\n      children,\n      position: _position,\n      container,\n      side = 'bottom',\n      align = 'start',\n      sideOffset = 4,\n      alignItemWithTrigger = false,\n      anchor,\n      positionMethod,\n      alignOffset,\n      collisionBoundary,\n      collisionPadding,\n      sticky,\n      arrowPadding,\n      disableAnchorTracking,\n      collisionAvoidance,\n      ...props\n    },\n    ref,\n  ) => {\n    // Default to the nearest SideDialog/Drawer popup so the dropdown stays\n    // interactive inside a modal drawer; an explicit `container` still wins.\n    const resolvedContainer = usePortalContainer(container);\n    const positionerProps: SelectContentPositionerProps = {\n      side,\n      align,\n      sideOffset,\n      alignItemWithTrigger,\n      anchor,\n      positionMethod,\n      alignOffset,\n      collisionBoundary,\n      collisionPadding,\n      sticky,\n      arrowPadding,\n      disableAnchorTracking,\n      collisionAvoidance,\n    };\n\n    return (\n      <SelectPrimitive.Portal container={resolvedContainer}>\n        <SelectPrimitive.Positioner className=\"z-50 outline-none\" {...positionerProps}>\n          <SelectPrimitive.Popup\n            ref={ref}\n            className={cn(\n              'relative z-50 min-w-32 min-w-[var(--anchor-width)] max-h-dropdown-max-height max-h-[var(--available-height)] overflow-y-auto overflow-x-hidden rounded-xl border border-border1 bg-surface3 p-1 text-neutral4 shadow-dialog origin-[var(--transform-origin)]',\n              'data-[open]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[open]:fade-in-0 data-[closed]:zoom-out-95 data-[open]:zoom-in-95',\n              'data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1',\n              className,\n            )}\n            {...props}\n          >\n            <SelectPrimitive.List>{children}</SelectPrimitive.List>\n          </SelectPrimitive.Popup>\n        </SelectPrimitive.Positioner>\n      </SelectPrimitive.Portal>\n    );\n  },\n);\nSelectContent.displayName = 'SelectContent';\n\nexport type SelectItemProps = Omit<SelectPrimitive.Item.Props, 'className'> & {\n  className?: string;\n};\n\nconst SelectItem = React.forwardRef<HTMLDivElement, SelectItemProps>(({ className, children, ...props }, ref) => (\n  <SelectPrimitive.Item\n    ref={ref}\n    className={cn(\n      'relative flex w-full cursor-pointer select-none items-center gap-2.5 rounded-lg py-1.5 pl-2 pr-8 text-neutral4 text-ui-smd leading-ui-sm',\n      'outline-none focus:outline-none focus-visible:outline-none',\n      transitions.colors,\n      'hover:bg-surface4 hover:text-neutral6',\n      'focus:bg-surface4 focus:text-neutral6',\n      'data-[highlighted]:bg-surface4 data-[highlighted]:text-neutral6',\n      'data-[selected]:text-neutral6',\n      'data-disabled:pointer-events-none data-disabled:opacity-50',\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute right-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <SelectPrimitive.ItemIndicator>\n        <Check className=\"h-4 w-4 text-neutral6\" />\n      </SelectPrimitive.ItemIndicator>\n    </span>\n    <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n  </SelectPrimitive.Item>\n));\nSelectItem.displayName = 'SelectItem';\n\nexport { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectItem };\n"],"names":["SelectPrimitive"],"mappings":"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"}

package/dist/select-data-filter-BasB6Wt3.cjs

@@ -0,0 +1,194 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const React = require('react');
+const Button = require('./Button-66ghjQV8.cjs');
+const dropdownMenu = require('./dropdown-menu-pHJH-29Y.cjs');
+const utils_cn = require('./cn-vA5sWo9W.cjs');
+
+const SUBMENU_SEARCH_THRESHOLD = 6;
+function SubMenuSearch({
+  value,
+  onChange,
+  label = "Search"
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn("px-2 pb-2"), children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: utils_cn.cn(
+        "flex items-center gap-2 border border-border1 rounded-md px-2 py-1",
+        "focus-within:border-neutral2"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: utils_cn.cn("text-neutral3 h-3.5 w-3.5 shrink-0") }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "text",
+            placeholder: "Search...",
+            "aria-label": label,
+            value,
+            onChange: (e) => onChange(e.target.value),
+            onKeyDown: (e) => e.stopPropagation(),
+            className: utils_cn.cn("bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full")
+          }
+        )
+      ]
+    }
+  ) });
+}
+function SelectDataFilter({
+  categories,
+  value,
+  onChange,
+  disabled,
+  label = "Filter",
+  align = "end",
+  searchThreshold = SUBMENU_SEARCH_THRESHOLD
+}) {
+  const [filterSearch, setFilterSearch] = React.useState("");
+  const [subSearch, setSubSearch] = React.useState("");
+  const resetSubSearch = React.useCallback((open) => {
+    if (!open) setSubSearch("");
+  }, []);
+  const activeFilterCount = React.useMemo(() => {
+    let count = 0;
+    for (const selections of Object.values(value)) {
+      if (selections.length > 0) count++;
+    }
+    return count;
+  }, [value]);
+  const grouped = React.useMemo(() => {
+    const q = filterSearch.toLowerCase();
+    const groups = [];
+    const groupMap = /* @__PURE__ */ new Map();
+    const ungrouped = [];
+    for (const cat of categories) {
+      if (cat.values.length === 0) continue;
+      if (q) {
+        const matchesLabel = cat.label.toLowerCase().includes(q);
+        const matchesValues = cat.values.some((v) => v.label.toLowerCase().includes(q));
+        if (!matchesLabel && !matchesValues) continue;
+      }
+      if (cat.group) {
+        let items = groupMap.get(cat.group);
+        if (!items) {
+          items = [];
+          groupMap.set(cat.group, items);
+        }
+        items.push(cat);
+      } else {
+        ungrouped.push(cat);
+      }
+    }
+    for (const cat of ungrouped) {
+      groups.push({ key: cat.id, items: [cat] });
+    }
+    for (const [groupLabel, items] of groupMap) {
+      groups.push({ key: `group-${groupLabel}`, label: groupLabel, items });
+    }
+    return groups;
+  }, [categories, filterSearch]);
+  const handleSelect = (categoryId, selectedValue, mode) => {
+    const current = value[categoryId] ?? [];
+    let next;
+    if (mode === "single") {
+      next = current.includes(selectedValue) ? [] : [selectedValue];
+    } else {
+      next = current.includes(selectedValue) ? current.filter((v) => v !== selectedValue) : [...current, selectedValue];
+    }
+    onChange({ ...value, [categoryId]: next });
+  };
+  const handleClearAll = () => {
+    onChange({});
+  };
+  const renderCategory = (cat) => {
+    const mode = cat.mode ?? "multi";
+    const selected = value[cat.id] ?? [];
+    const selectedCount = selected.length;
+    return /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu.Sub, { onOpenChange: resetSubSearch, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu.SubTrigger, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("truncate"), children: cat.label }),
+        selectedCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("ml-auto text-ui-sm text-accent1"), children: selectedCount })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu.SubContent, { className: utils_cn.cn("max-h-[20rem]"), children: [
+        cat.values.length >= searchThreshold && /* @__PURE__ */ jsxRuntime.jsx(SubMenuSearch, { value: subSearch, onChange: setSubSearch, label: `Search ${cat.label.toLowerCase()}` }),
+        mode === "single" ? /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenu.RadioGroup, { value: selected[0] ?? "", onValueChange: (val) => handleSelect(cat.id, val, mode), children: cat.values.filter((v) => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase())).map((v) => /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenu.RadioItem, { value: v.value, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("truncate"), children: v.label }) }, v.value)) }) : cat.values.filter((v) => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase())).map((v) => /* @__PURE__ */ jsxRuntime.jsx(
+          dropdownMenu.DropdownMenu.CheckboxItem,
+          {
+            checked: selected.includes(v.value),
+            onCheckedChange: () => handleSelect(cat.id, v.value, mode),
+            onSelect: (e) => e.preventDefault(),
+            children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("truncate"), children: v.label })
+          },
+          v.value
+        ))
+      ] })
+    ] }, cat.id);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu, { modal: false, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button.Button, { variant: "outline", disabled, size: "md", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FilterIcon, {}),
+      label,
+      activeFilterCount > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: utils_cn.cn(
+            "ml-0.5 inline-flex items-center justify-center rounded-full bg-accent1/50 text-neutral5 text-ui-sm w-5 h-5"
+          ),
+          children: activeFilterCount
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu.Content, { align, className: utils_cn.cn("min-w-[12rem]"), children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn("px-2 pb-2"), children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: utils_cn.cn(
+            "flex items-center gap-2 border border-border1 rounded-md px-2 py-1",
+            "focus-within:border-neutral2"
+          ),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: utils_cn.cn("text-neutral3 h-3.5 w-3.5 shrink-0") }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                type: "text",
+                placeholder: "Search filters...",
+                "aria-label": "Search filters",
+                value: filterSearch,
+                onChange: (e) => setFilterSearch(e.target.value),
+                onKeyDown: (e) => e.stopPropagation(),
+                className: utils_cn.cn("bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full")
+              }
+            )
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenu.Separator, {}),
+      grouped.map((group) => {
+        if (group.items.length === 1 && !group.label) {
+          return renderCategory(group.items[0]);
+        }
+        if (group.label && group.items.length === 1) {
+          return renderCategory(group.items[0]);
+        }
+        return /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu.Sub, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenu.SubTrigger, { children: group.label }),
+          /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenu.SubContent, { className: utils_cn.cn("max-h-[20rem]"), children: group.items.map((cat) => renderCategory(cat)) })
+        ] }, group.key);
+      }),
+      activeFilterCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenu.Separator, {}),
+        /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu.Item, { onSelect: handleClearAll, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, {}),
+          "Clear all filters"
+        ] })
+      ] })
+    ] })
+  ] });
+}
+
+exports.SelectDataFilter = SelectDataFilter;
+//# sourceMappingURL=select-data-filter-BasB6Wt3.cjs.map

package/dist/select-data-filter-BasB6Wt3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-data-filter-BasB6Wt3.cjs","sources":["../src/ds/components/DataFilter/select-data-filter.tsx"],"sourcesContent":["import { FilterIcon, SearchIcon, XIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { useState, useMemo, useCallback } from 'react';\n\nimport { Button } from '@/ds/components/Button/Button';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu/dropdown-menu';\nimport { cn } from '@/lib/utils';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\n/** A single selectable value within a filter category */\nexport type SelectDataFilterValue = {\n  value: string;\n  label: string;\n};\n\n/** Selection mode for a filter category */\nexport type SelectDataFilterMode = 'single' | 'multi';\n\n/** A filter category that appears in the filter dropdown */\nexport type SelectDataFilterCategory = {\n  /** Unique identifier */\n  id: string;\n  /** Display label */\n  label: string;\n  /** Optional group header (categories with the same group are nested under it) */\n  group?: string;\n  /** Available values to pick from */\n  values: SelectDataFilterValue[];\n  /** 'single' = radio, 'multi' = checkboxes. Defaults to 'multi'. */\n  mode?: SelectDataFilterMode;\n};\n\n/** Current selected state: category id -> selected value(s) */\nexport type SelectDataFilterState = Record<string, string[]>;\n\nexport type SelectDataFilterProps = {\n  /** Filter categories to display */\n  categories: SelectDataFilterCategory[];\n  /** Current filter selections */\n  value: SelectDataFilterState;\n  /** Called when selections change */\n  onChange: (next: SelectDataFilterState) => void;\n  /** Disable the trigger button */\n  disabled?: boolean;\n  /** Override the trigger label */\n  label?: ReactNode;\n  /** Content alignment */\n  align?: 'start' | 'center' | 'end';\n  /** Minimum items before showing search in a submenu */\n  searchThreshold?: number;\n};\n\n// ---------------------------------------------------------------------------\n// Internal helpers\n// ---------------------------------------------------------------------------\n\nconst SUBMENU_SEARCH_THRESHOLD = 6;\n\nfunction SubMenuSearch({\n  value,\n  onChange,\n  label = 'Search',\n}: {\n  value: string;\n  onChange: (v: string) => void;\n  label?: string;\n}) {\n  return (\n    <div className={cn('px-2 pb-2')}>\n      <div\n        className={cn(\n          'flex items-center gap-2 border border-border1 rounded-md px-2 py-1',\n          'focus-within:border-neutral2',\n        )}\n      >\n        <SearchIcon className={cn('text-neutral3 h-3.5 w-3.5 shrink-0')} />\n        <input\n          type=\"text\"\n          placeholder=\"Search...\"\n          aria-label={label}\n          value={value}\n          onChange={e => onChange(e.target.value)}\n          onKeyDown={e => e.stopPropagation()}\n          className={cn('bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full')}\n        />\n      </div>\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport function SelectDataFilter({\n  categories,\n  value,\n  onChange,\n  disabled,\n  label = 'Filter',\n  align = 'end',\n  searchThreshold = SUBMENU_SEARCH_THRESHOLD,\n}: SelectDataFilterProps) {\n  const [filterSearch, setFilterSearch] = useState('');\n  const [subSearch, setSubSearch] = useState('');\n\n  const resetSubSearch = useCallback((open: boolean) => {\n    if (!open) setSubSearch('');\n  }, []);\n\n  // Count active filters\n  const activeFilterCount = useMemo(() => {\n    let count = 0;\n    for (const selections of Object.values(value)) {\n      if (selections.length > 0) count++;\n    }\n    return count;\n  }, [value]);\n\n  // Group categories\n  const grouped = useMemo(() => {\n    const q = filterSearch.toLowerCase();\n    const groups: { key: string; label?: string; items: SelectDataFilterCategory[] }[] = [];\n    const groupMap = new Map<string, SelectDataFilterCategory[]>();\n    const ungrouped: SelectDataFilterCategory[] = [];\n\n    for (const cat of categories) {\n      if (cat.values.length === 0) continue;\n      // Filter by search\n      if (q) {\n        const matchesLabel = cat.label.toLowerCase().includes(q);\n        const matchesValues = cat.values.some(v => v.label.toLowerCase().includes(q));\n        if (!matchesLabel && !matchesValues) continue;\n      }\n      if (cat.group) {\n        let items = groupMap.get(cat.group);\n        if (!items) {\n          items = [];\n          groupMap.set(cat.group, items);\n        }\n        items.push(cat);\n      } else {\n        ungrouped.push(cat);\n      }\n    }\n\n    // Ungrouped items first\n    for (const cat of ungrouped) {\n      groups.push({ key: cat.id, items: [cat] });\n    }\n    // Then grouped\n    for (const [groupLabel, items] of groupMap) {\n      groups.push({ key: `group-${groupLabel}`, label: groupLabel, items });\n    }\n\n    return groups;\n  }, [categories, filterSearch]);\n\n  const handleSelect = (categoryId: string, selectedValue: string, mode: SelectDataFilterMode) => {\n    const current = value[categoryId] ?? [];\n    let next: string[];\n\n    if (mode === 'single') {\n      next = current.includes(selectedValue) ? [] : [selectedValue];\n    } else {\n      next = current.includes(selectedValue) ? current.filter(v => v !== selectedValue) : [...current, selectedValue];\n    }\n\n    onChange({ ...value, [categoryId]: next });\n  };\n\n  const handleClearAll = () => {\n    onChange({});\n  };\n\n  const renderCategory = (cat: SelectDataFilterCategory) => {\n    const mode = cat.mode ?? 'multi';\n    const selected = value[cat.id] ?? [];\n    const selectedCount = selected.length;\n\n    return (\n      <DropdownMenu.Sub key={cat.id} onOpenChange={resetSubSearch}>\n        <DropdownMenu.SubTrigger>\n          <span className={cn('truncate')}>{cat.label}</span>\n          {selectedCount > 0 && <span className={cn('ml-auto text-ui-sm text-accent1')}>{selectedCount}</span>}\n        </DropdownMenu.SubTrigger>\n        <DropdownMenu.SubContent className={cn('max-h-[20rem]')}>\n          {cat.values.length >= searchThreshold && (\n            <SubMenuSearch value={subSearch} onChange={setSubSearch} label={`Search ${cat.label.toLowerCase()}`} />\n          )}\n          {mode === 'single' ? (\n            <DropdownMenu.RadioGroup value={selected[0] ?? ''} onValueChange={val => handleSelect(cat.id, val, mode)}>\n              {cat.values\n                .filter(v => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase()))\n                .map(v => (\n                  <DropdownMenu.RadioItem key={v.value} value={v.value}>\n                    <span className={cn('truncate')}>{v.label}</span>\n                  </DropdownMenu.RadioItem>\n                ))}\n            </DropdownMenu.RadioGroup>\n          ) : (\n            cat.values\n              .filter(v => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase()))\n              .map(v => (\n                <DropdownMenu.CheckboxItem\n                  key={v.value}\n                  checked={selected.includes(v.value)}\n                  onCheckedChange={() => handleSelect(cat.id, v.value, mode)}\n                  onSelect={e => e.preventDefault()}\n                >\n                  <span className={cn('truncate')}>{v.label}</span>\n                </DropdownMenu.CheckboxItem>\n              ))\n          )}\n        </DropdownMenu.SubContent>\n      </DropdownMenu.Sub>\n    );\n  };\n\n  return (\n    <DropdownMenu modal={false}>\n      <DropdownMenu.Trigger asChild>\n        <Button variant=\"outline\" disabled={disabled} size=\"md\">\n          <FilterIcon />\n          {label}\n          {activeFilterCount > 0 && (\n            <span\n              className={cn(\n                'ml-0.5 inline-flex items-center justify-center rounded-full bg-accent1/50 text-neutral5 text-ui-sm w-5 h-5',\n              )}\n            >\n              {activeFilterCount}\n            </span>\n          )}\n        </Button>\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content align={align} className={cn('min-w-[12rem]')}>\n        {/* Search */}\n        <div className={cn('px-2 pb-2')}>\n          <div\n            className={cn(\n              'flex items-center gap-2 border border-border1 rounded-md px-2 py-1',\n              'focus-within:border-neutral2',\n            )}\n          >\n            <SearchIcon className={cn('text-neutral3 h-3.5 w-3.5 shrink-0')} />\n            <input\n              type=\"text\"\n              placeholder=\"Search filters...\"\n              aria-label=\"Search filters\"\n              value={filterSearch}\n              onChange={e => setFilterSearch(e.target.value)}\n              onKeyDown={e => e.stopPropagation()}\n              className={cn('bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full')}\n            />\n          </div>\n        </div>\n\n        <DropdownMenu.Separator />\n\n        {grouped.map(group => {\n          if (group.items.length === 1 && !group.label) {\n            return renderCategory(group.items[0]);\n          }\n\n          if (group.label && group.items.length === 1) {\n            // Single item in a named group — render directly with group as context\n            return renderCategory(group.items[0]);\n          }\n\n          // Multiple items under a group label — nest under a sub-trigger\n          return (\n            <DropdownMenu.Sub key={group.key}>\n              <DropdownMenu.SubTrigger>{group.label}</DropdownMenu.SubTrigger>\n              <DropdownMenu.SubContent className={cn('max-h-[20rem]')}>\n                {group.items.map(cat => renderCategory(cat))}\n              </DropdownMenu.SubContent>\n            </DropdownMenu.Sub>\n          );\n        })}\n\n        {/* Clear all */}\n        {activeFilterCount > 0 && (\n          <>\n            <DropdownMenu.Separator />\n            <DropdownMenu.Item onSelect={handleClearAll}>\n              <XIcon />\n              Clear all filters\n            </DropdownMenu.Item>\n          </>\n        )}\n      </DropdownMenu.Content>\n    </DropdownMenu>\n  );\n}\n"],"names":["jsx","cn","jsxs","SearchIcon","useState","useCallback","useMemo","DropdownMenu","Button","FilterIcon","Fragment","XIcon"],"mappings":";;;;;;;;;AA2DA,MAAM,wBAAA,GAA2B,CAAA;AAEjC,SAAS,aAAA,CAAc;AAAA,EACrB,KAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA,GAAQ;AACV,CAAA,EAIG;AACD,EAAA,uBACEA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,WAAW,CAAA,EAC5B,QAAA,kBAAAC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWD,WAAA;AAAA,QACT,oEAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAD,cAAA,CAACG,sBAAA,EAAA,EAAW,SAAA,EAAWF,WAAA,CAAG,oCAAoC,CAAA,EAAG,CAAA;AAAA,wBACjED,cAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,MAAA;AAAA,YACL,WAAA,EAAY,WAAA;AAAA,YACZ,YAAA,EAAY,KAAA;AAAA,YACZ,KAAA;AAAA,YACA,QAAA,EAAU,CAAA,CAAA,KAAK,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,YACtC,SAAA,EAAW,CAAA,CAAA,KAAK,CAAA,CAAE,eAAA,EAAgB;AAAA,YAClC,SAAA,EAAWC,YAAG,uFAAuF;AAAA;AAAA;AACvG;AAAA;AAAA,GACF,EACF,CAAA;AAEJ;AAMO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,UAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA,GAAQ,QAAA;AAAA,EACR,KAAA,GAAQ,KAAA;AAAA,EACR,eAAA,GAAkB;AACpB,CAAA,EAA0B;AACxB,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIG,eAAS,EAAE,CAAA;AACnD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,eAAS,EAAE,CAAA;AAE7C,EAAA,MAAM,cAAA,GAAiBC,iBAAA,CAAY,CAAC,IAAA,KAAkB;AACpD,IAAA,IAAI,CAAC,IAAA,EAAM,YAAA,CAAa,EAAE,CAAA;AAAA,EAC5B,CAAA,EAAG,EAAE,CAAA;AAGL,EAAA,MAAM,iBAAA,GAAoBC,cAAQ,MAAM;AACtC,IAAA,IAAI,KAAA,GAAQ,CAAA;AACZ,IAAA,KAAA,MAAW,UAAA,IAAc,MAAA,CAAO,MAAA,CAAO,KAAK,CAAA,EAAG;AAC7C,MAAA,IAAI,UAAA,CAAW,SAAS,CAAA,EAAG,KAAA,EAAA;AAAA,IAC7B;AACA,IAAA,OAAO,KAAA;AAAA,EACT,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAGV,EAAA,MAAM,OAAA,GAAUA,cAAQ,MAAM;AAC5B,IAAA,MAAM,CAAA,GAAI,aAAa,WAAA,EAAY;AACnC,IAAA,MAAM,SAA+E,EAAC;AACtF,IAAA,MAAM,QAAA,uBAAe,GAAA,EAAwC;AAC7D,IAAA,MAAM,YAAwC,EAAC;AAE/C,IAAA,KAAA,MAAW,OAAO,UAAA,EAAY;AAC5B,MAAA,IAAI,GAAA,CAAI,MAAA,CAAO,MAAA,KAAW,CAAA,EAAG;AAE7B,MAAA,IAAI,CAAA,EAAG;AACL,QAAA,MAAM,eAAe,GAAA,CAAI,KAAA,CAAM,WAAA,EAAY,CAAE,SAAS,CAAC,CAAA;AACvD,QAAA,MAAM,aAAA,GAAgB,GAAA,CAAI,MAAA,CAAO,IAAA,CAAK,CAAA,CAAA,KAAK,CAAA,CAAE,KAAA,CAAM,WAAA,EAAY,CAAE,QAAA,CAAS,CAAC,CAAC,CAAA;AAC5E,QAAA,IAAI,CAAC,YAAA,IAAgB,CAAC,aAAA,EAAe;AAAA,MACvC;AACA,MAAA,IAAI,IAAI,KAAA,EAAO;AACb,QAAA,IAAI,KAAA,GAAQ,QAAA,CAAS,GAAA,CAAI,GAAA,CAAI,KAAK,CAAA;AAClC,QAAA,IAAI,CAAC,KAAA,EAAO;AACV,UAAA,KAAA,GAAQ,EAAC;AACT,UAAA,QAAA,CAAS,GAAA,CAAI,GAAA,CAAI,KAAA,EAAO,KAAK,CAAA;AAAA,QAC/B;AACA,QAAA,KAAA,CAAM,KAAK,GAAG,CAAA;AAAA,MAChB,CAAA,MAAO;AACL,QAAA,SAAA,CAAU,KAAK,GAAG,CAAA;AAAA,MACpB;AAAA,IACF;AAGA,IAAA,KAAA,MAAW,OAAO,SAAA,EAAW;AAC3B,MAAA,MAAA,CAAO,IAAA,CAAK,EAAE,GAAA,EAAK,GAAA,CAAI,IAAI,KAAA,EAAO,CAAC,GAAG,CAAA,EAAG,CAAA;AAAA,IAC3C;AAEA,IAAA,KAAA,MAAW,CAAC,UAAA,EAAY,KAAK,CAAA,IAAK,QAAA,EAAU;AAC1C,MAAA,MAAA,CAAO,IAAA,CAAK,EAAE,GAAA,EAAK,CAAA,MAAA,EAAS,UAAU,CAAA,CAAA,EAAI,KAAA,EAAO,UAAA,EAAY,KAAA,EAAO,CAAA;AAAA,IACtE;AAEA,IAAA,OAAO,MAAA;AAAA,EACT,CAAA,EAAG,CAAC,UAAA,EAAY,YAAY,CAAC,CAAA;AAE7B,EAAA,MAAM,YAAA,GAAe,CAAC,UAAA,EAAoB,aAAA,EAAuB,IAAA,KAA+B;AAC9F,IAAA,MAAM,OAAA,GAAU,KAAA,CAAM,UAAU,CAAA,IAAK,EAAC;AACtC,IAAA,IAAI,IAAA;AAEJ,IAAA,IAAI,SAAS,QAAA,EAAU;AACrB,MAAA,IAAA,GAAO,QAAQ,QAAA,CAAS,aAAa,IAAI,EAAC,GAAI,CAAC,aAAa,CAAA;AAAA,IAC9D,CAAA,MAAO;AACL,MAAA,IAAA,GAAO,OAAA,CAAQ,QAAA,CAAS,aAAa,CAAA,GAAI,OAAA,CAAQ,MAAA,CAAO,CAAA,CAAA,KAAK,CAAA,KAAM,aAAa,CAAA,GAAI,CAAC,GAAG,SAAS,aAAa,CAAA;AAAA,IAChH;AAEA,IAAA,QAAA,CAAS,EAAE,GAAG,KAAA,EAAO,CAAC,UAAU,GAAG,MAAM,CAAA;AAAA,EAC3C,CAAA;AAEA,EAAA,MAAM,iBAAiB,MAAM;AAC3B,IAAA,QAAA,CAAS,EAAE,CAAA;AAAA,EACb,CAAA;AAEA,EAAA,MAAM,cAAA,GAAiB,CAAC,GAAA,KAAkC;AACxD,IAAA,MAAM,IAAA,GAAO,IAAI,IAAA,IAAQ,OAAA;AACzB,IAAA,MAAM,QAAA,GAAW,KAAA,CAAM,GAAA,CAAI,EAAE,KAAK,EAAC;AACnC,IAAA,MAAM,gBAAgB,QAAA,CAAS,MAAA;AAE/B,IAAA,uBACEJ,eAAA,CAACK,yBAAA,CAAa,GAAA,EAAb,EAA8B,cAAc,cAAA,EAC3C,QAAA,EAAA;AAAA,sBAAAL,eAAA,CAACK,yBAAA,CAAa,YAAb,EACC,QAAA,EAAA;AAAA,wBAAAP,cAAA,CAAC,UAAK,SAAA,EAAWC,WAAA,CAAG,UAAU,CAAA,EAAI,cAAI,KAAA,EAAM,CAAA;AAAA,QAC3C,aAAA,GAAgB,qBAAKD,cAAA,CAAC,MAAA,EAAA,EAAK,WAAWC,WAAA,CAAG,iCAAiC,GAAI,QAAA,EAAA,aAAA,EAAc;AAAA,OAAA,EAC/F,CAAA;AAAA,sCACCM,yBAAA,CAAa,UAAA,EAAb,EAAwB,SAAA,EAAWN,WAAA,CAAG,eAAe,CAAA,EACnD,QAAA,EAAA;AAAA,QAAA,GAAA,CAAI,MAAA,CAAO,MAAA,IAAU,eAAA,oBACpBD,cAAA,CAAC,iBAAc,KAAA,EAAO,SAAA,EAAW,QAAA,EAAU,YAAA,EAAc,OAAO,CAAA,OAAA,EAAU,GAAA,CAAI,KAAA,CAAM,WAAA,EAAa,CAAA,CAAA,EAAI,CAAA;AAAA,QAEtG,IAAA,KAAS,QAAA,mBACRA,cAAA,CAACO,yBAAA,CAAa,YAAb,EAAwB,KAAA,EAAO,QAAA,CAAS,CAAC,KAAK,EAAA,EAAI,aAAA,EAAe,CAAA,GAAA,KAAO,YAAA,CAAa,IAAI,EAAA,EAAI,GAAA,EAAK,IAAI,CAAA,EACpG,cAAI,MAAA,CACF,MAAA,CAAO,CAAA,CAAA,KAAK,CAAC,aAAa,CAAA,CAAE,KAAA,CAAM,WAAA,EAAY,CAAE,SAAS,SAAA,CAAU,WAAA,EAAa,CAAC,EACjF,GAAA,CAAI,CAAA,CAAA,qBACHP,cAAA,CAACO,yBAAA,CAAa,WAAb,EAAqC,KAAA,EAAO,CAAA,CAAE,KAAA,EAC7C,yCAAC,MAAA,EAAA,EAAK,SAAA,EAAWN,WAAA,CAAG,UAAU,GAAI,QAAA,EAAA,CAAA,CAAE,KAAA,EAAM,CAAA,EAAA,EADf,CAAA,CAAE,KAE/B,CACD,CAAA,EACL,CAAA,GAEA,GAAA,CAAI,OACD,MAAA,CAAO,CAAA,CAAA,KAAK,CAAC,SAAA,IAAa,EAAE,KAAA,CAAM,WAAA,EAAY,CAAE,QAAA,CAAS,UAAU,WAAA,EAAa,CAAC,CAAA,CACjF,IAAI,CAAA,CAAA,qBACHD,cAAA;AAAA,UAACO,yBAAA,CAAa,YAAA;AAAA,UAAb;AAAA,YAEC,OAAA,EAAS,QAAA,CAAS,QAAA,CAAS,CAAA,CAAE,KAAK,CAAA;AAAA,YAClC,iBAAiB,MAAM,YAAA,CAAa,IAAI,EAAA,EAAI,CAAA,CAAE,OAAO,IAAI,CAAA;AAAA,YACzD,QAAA,EAAU,CAAA,CAAA,KAAK,CAAA,CAAE,cAAA,EAAe;AAAA,YAEhC,yCAAC,MAAA,EAAA,EAAK,SAAA,EAAWN,YAAG,UAAU,CAAA,EAAI,YAAE,KAAA,EAAM;AAAA,WAAA;AAAA,UALrC,CAAA,CAAE;AAAA,SAOV;AAAA,OAAA,EAEP;AAAA,KAAA,EAAA,EAjCqB,IAAI,EAkC3B,CAAA;AAAA,EAEJ,CAAA;AAEA,EAAA,uBACEC,eAAA,CAACK,yBAAA,EAAA,EAAa,KAAA,EAAO,KAAA,EACnB,QAAA,EAAA;AAAA,oBAAAP,cAAA,CAACO,yBAAA,CAAa,OAAA,EAAb,EAAqB,OAAA,EAAO,IAAA,EAC3B,QAAA,kBAAAL,eAAA,CAACM,aAAA,EAAA,EAAO,OAAA,EAAQ,SAAA,EAAU,QAAA,EAAoB,IAAA,EAAK,IAAA,EACjD,QAAA,EAAA;AAAA,sBAAAR,cAAA,CAACS,sBAAA,EAAA,EAAW,CAAA;AAAA,MACX,KAAA;AAAA,MACA,oBAAoB,CAAA,oBACnBT,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAWC,WAAA;AAAA,YACT;AAAA,WACF;AAAA,UAEC,QAAA,EAAA;AAAA;AAAA;AACH,KAAA,EAEJ,CAAA,EACF,CAAA;AAAA,oBACAC,eAAA,CAACK,0BAAa,OAAA,EAAb,EAAqB,OAAc,SAAA,EAAWN,WAAA,CAAG,eAAe,CAAA,EAE/D,QAAA,EAAA;AAAA,sBAAAD,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,WAAW,CAAA,EAC5B,QAAA,kBAAAC,eAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAWD,WAAA;AAAA,YACT,oEAAA;AAAA,YACA;AAAA,WACF;AAAA,UAEA,QAAA,EAAA;AAAA,4BAAAD,cAAA,CAACG,sBAAA,EAAA,EAAW,SAAA,EAAWF,WAAA,CAAG,oCAAoC,CAAA,EAAG,CAAA;AAAA,4BACjED,cAAA;AAAA,cAAC,OAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,MAAA;AAAA,gBACL,WAAA,EAAY,mBAAA;AAAA,gBACZ,YAAA,EAAW,gBAAA;AAAA,gBACX,KAAA,EAAO,YAAA;AAAA,gBACP,QAAA,EAAU,CAAA,CAAA,KAAK,eAAA,CAAgB,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,gBAC7C,SAAA,EAAW,CAAA,CAAA,KAAK,CAAA,CAAE,eAAA,EAAgB;AAAA,gBAClC,SAAA,EAAWC,YAAG,uFAAuF;AAAA;AAAA;AACvG;AAAA;AAAA,OACF,EACF,CAAA;AAAA,sBAEAD,cAAA,CAACO,yBAAA,CAAa,SAAA,EAAb,EAAuB,CAAA;AAAA,MAEvB,OAAA,CAAQ,IAAI,CAAA,KAAA,KAAS;AACpB,QAAA,IAAI,MAAM,KAAA,CAAM,MAAA,KAAW,CAAA,IAAK,CAAC,MAAM,KAAA,EAAO;AAC5C,UAAA,OAAO,cAAA,CAAe,KAAA,CAAM,KAAA,CAAM,CAAC,CAAC,CAAA;AAAA,QACtC;AAEA,QAAA,IAAI,KAAA,CAAM,KAAA,IAAS,KAAA,CAAM,KAAA,CAAM,WAAW,CAAA,EAAG;AAE3C,UAAA,OAAO,cAAA,CAAe,KAAA,CAAM,KAAA,CAAM,CAAC,CAAC,CAAA;AAAA,QACtC;AAGA,QAAA,uBACEL,eAAA,CAACK,yBAAA,CAAa,GAAA,EAAb,EACC,QAAA,EAAA;AAAA,0BAAAP,cAAA,CAACO,yBAAA,CAAa,UAAA,EAAb,EAAyB,QAAA,EAAA,KAAA,CAAM,KAAA,EAAM,CAAA;AAAA,0BACtCP,cAAA,CAACO,yBAAA,CAAa,UAAA,EAAb,EAAwB,WAAWN,WAAA,CAAG,eAAe,CAAA,EACnD,QAAA,EAAA,KAAA,CAAM,MAAM,GAAA,CAAI,CAAA,GAAA,KAAO,cAAA,CAAe,GAAG,CAAC,CAAA,EAC7C;AAAA,SAAA,EAAA,EAJqB,MAAM,GAK7B,CAAA;AAAA,MAEJ,CAAC,CAAA;AAAA,MAGA,iBAAA,GAAoB,qBACnBC,eAAA,CAAAQ,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAV,cAAA,CAACO,yBAAA,CAAa,WAAb,EAAuB,CAAA;AAAA,wBACxBL,eAAA,CAACK,yBAAA,CAAa,IAAA,EAAb,EAAkB,UAAU,cAAA,EAC3B,QAAA,EAAA;AAAA,0BAAAP,cAAA,CAACW,iBAAA,EAAA,EAAM,CAAA;AAAA,UAAE;AAAA,SAAA,EAEX;AAAA,OAAA,EACF;AAAA,KAAA,EAEJ;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/select-data-filter-Cb6Exh7H.js

@@ -0,0 +1,192 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { FilterIcon, SearchIcon, XIcon } from 'lucide-react';
+import { useState, useCallback, useMemo } from 'react';
+import { B as Button } from './Button-Bq0VuEbC.js';
+import { D as DropdownMenu } from './dropdown-menu-CGei48WH.js';
+import { c as cn } from './cn-BakJzhuv.js';
+
+const SUBMENU_SEARCH_THRESHOLD = 6;
+function SubMenuSearch({
+  value,
+  onChange,
+  label = "Search"
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("px-2 pb-2"), children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-2 border border-border1 rounded-md px-2 py-1",
+        "focus-within:border-neutral2"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(SearchIcon, { className: cn("text-neutral3 h-3.5 w-3.5 shrink-0") }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "text",
+            placeholder: "Search...",
+            "aria-label": label,
+            value,
+            onChange: (e) => onChange(e.target.value),
+            onKeyDown: (e) => e.stopPropagation(),
+            className: cn("bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full")
+          }
+        )
+      ]
+    }
+  ) });
+}
+function SelectDataFilter({
+  categories,
+  value,
+  onChange,
+  disabled,
+  label = "Filter",
+  align = "end",
+  searchThreshold = SUBMENU_SEARCH_THRESHOLD
+}) {
+  const [filterSearch, setFilterSearch] = useState("");
+  const [subSearch, setSubSearch] = useState("");
+  const resetSubSearch = useCallback((open) => {
+    if (!open) setSubSearch("");
+  }, []);
+  const activeFilterCount = useMemo(() => {
+    let count = 0;
+    for (const selections of Object.values(value)) {
+      if (selections.length > 0) count++;
+    }
+    return count;
+  }, [value]);
+  const grouped = useMemo(() => {
+    const q = filterSearch.toLowerCase();
+    const groups = [];
+    const groupMap = /* @__PURE__ */ new Map();
+    const ungrouped = [];
+    for (const cat of categories) {
+      if (cat.values.length === 0) continue;
+      if (q) {
+        const matchesLabel = cat.label.toLowerCase().includes(q);
+        const matchesValues = cat.values.some((v) => v.label.toLowerCase().includes(q));
+        if (!matchesLabel && !matchesValues) continue;
+      }
+      if (cat.group) {
+        let items = groupMap.get(cat.group);
+        if (!items) {
+          items = [];
+          groupMap.set(cat.group, items);
+        }
+        items.push(cat);
+      } else {
+        ungrouped.push(cat);
+      }
+    }
+    for (const cat of ungrouped) {
+      groups.push({ key: cat.id, items: [cat] });
+    }
+    for (const [groupLabel, items] of groupMap) {
+      groups.push({ key: `group-${groupLabel}`, label: groupLabel, items });
+    }
+    return groups;
+  }, [categories, filterSearch]);
+  const handleSelect = (categoryId, selectedValue, mode) => {
+    const current = value[categoryId] ?? [];
+    let next;
+    if (mode === "single") {
+      next = current.includes(selectedValue) ? [] : [selectedValue];
+    } else {
+      next = current.includes(selectedValue) ? current.filter((v) => v !== selectedValue) : [...current, selectedValue];
+    }
+    onChange({ ...value, [categoryId]: next });
+  };
+  const handleClearAll = () => {
+    onChange({});
+  };
+  const renderCategory = (cat) => {
+    const mode = cat.mode ?? "multi";
+    const selected = value[cat.id] ?? [];
+    const selectedCount = selected.length;
+    return /* @__PURE__ */ jsxs(DropdownMenu.Sub, { onOpenChange: resetSubSearch, children: [
+      /* @__PURE__ */ jsxs(DropdownMenu.SubTrigger, { children: [
+        /* @__PURE__ */ jsx("span", { className: cn("truncate"), children: cat.label }),
+        selectedCount > 0 && /* @__PURE__ */ jsx("span", { className: cn("ml-auto text-ui-sm text-accent1"), children: selectedCount })
+      ] }),
+      /* @__PURE__ */ jsxs(DropdownMenu.SubContent, { className: cn("max-h-[20rem]"), children: [
+        cat.values.length >= searchThreshold && /* @__PURE__ */ jsx(SubMenuSearch, { value: subSearch, onChange: setSubSearch, label: `Search ${cat.label.toLowerCase()}` }),
+        mode === "single" ? /* @__PURE__ */ jsx(DropdownMenu.RadioGroup, { value: selected[0] ?? "", onValueChange: (val) => handleSelect(cat.id, val, mode), children: cat.values.filter((v) => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase())).map((v) => /* @__PURE__ */ jsx(DropdownMenu.RadioItem, { value: v.value, children: /* @__PURE__ */ jsx("span", { className: cn("truncate"), children: v.label }) }, v.value)) }) : cat.values.filter((v) => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase())).map((v) => /* @__PURE__ */ jsx(
+          DropdownMenu.CheckboxItem,
+          {
+            checked: selected.includes(v.value),
+            onCheckedChange: () => handleSelect(cat.id, v.value, mode),
+            onSelect: (e) => e.preventDefault(),
+            children: /* @__PURE__ */ jsx("span", { className: cn("truncate"), children: v.label })
+          },
+          v.value
+        ))
+      ] })
+    ] }, cat.id);
+  };
+  return /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, children: [
+    /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", disabled, size: "md", children: [
+      /* @__PURE__ */ jsx(FilterIcon, {}),
+      label,
+      activeFilterCount > 0 && /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "ml-0.5 inline-flex items-center justify-center rounded-full bg-accent1/50 text-neutral5 text-ui-sm w-5 h-5"
+          ),
+          children: activeFilterCount
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxs(DropdownMenu.Content, { align, className: cn("min-w-[12rem]"), children: [
+      /* @__PURE__ */ jsx("div", { className: cn("px-2 pb-2"), children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "flex items-center gap-2 border border-border1 rounded-md px-2 py-1",
+            "focus-within:border-neutral2"
+          ),
+          children: [
+            /* @__PURE__ */ jsx(SearchIcon, { className: cn("text-neutral3 h-3.5 w-3.5 shrink-0") }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                placeholder: "Search filters...",
+                "aria-label": "Search filters",
+                value: filterSearch,
+                onChange: (e) => setFilterSearch(e.target.value),
+                onKeyDown: (e) => e.stopPropagation(),
+                className: cn("bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full")
+              }
+            )
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
+      grouped.map((group) => {
+        if (group.items.length === 1 && !group.label) {
+          return renderCategory(group.items[0]);
+        }
+        if (group.label && group.items.length === 1) {
+          return renderCategory(group.items[0]);
+        }
+        return /* @__PURE__ */ jsxs(DropdownMenu.Sub, { children: [
+          /* @__PURE__ */ jsx(DropdownMenu.SubTrigger, { children: group.label }),
+          /* @__PURE__ */ jsx(DropdownMenu.SubContent, { className: cn("max-h-[20rem]"), children: group.items.map((cat) => renderCategory(cat)) })
+        ] }, group.key);
+      }),
+      activeFilterCount > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
+        /* @__PURE__ */ jsxs(DropdownMenu.Item, { onSelect: handleClearAll, children: [
+          /* @__PURE__ */ jsx(XIcon, {}),
+          "Clear all filters"
+        ] })
+      ] })
+    ] })
+  ] });
+}
+
+export { SelectDataFilter as S };
+//# sourceMappingURL=select-data-filter-Cb6Exh7H.js.map

package/dist/select-data-filter-Cb6Exh7H.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-data-filter-Cb6Exh7H.js","sources":["../src/ds/components/DataFilter/select-data-filter.tsx"],"sourcesContent":["import { FilterIcon, SearchIcon, XIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { useState, useMemo, useCallback } from 'react';\n\nimport { Button } from '@/ds/components/Button/Button';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu/dropdown-menu';\nimport { cn } from '@/lib/utils';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\n/** A single selectable value within a filter category */\nexport type SelectDataFilterValue = {\n  value: string;\n  label: string;\n};\n\n/** Selection mode for a filter category */\nexport type SelectDataFilterMode = 'single' | 'multi';\n\n/** A filter category that appears in the filter dropdown */\nexport type SelectDataFilterCategory = {\n  /** Unique identifier */\n  id: string;\n  /** Display label */\n  label: string;\n  /** Optional group header (categories with the same group are nested under it) */\n  group?: string;\n  /** Available values to pick from */\n  values: SelectDataFilterValue[];\n  /** 'single' = radio, 'multi' = checkboxes. Defaults to 'multi'. */\n  mode?: SelectDataFilterMode;\n};\n\n/** Current selected state: category id -> selected value(s) */\nexport type SelectDataFilterState = Record<string, string[]>;\n\nexport type SelectDataFilterProps = {\n  /** Filter categories to display */\n  categories: SelectDataFilterCategory[];\n  /** Current filter selections */\n  value: SelectDataFilterState;\n  /** Called when selections change */\n  onChange: (next: SelectDataFilterState) => void;\n  /** Disable the trigger button */\n  disabled?: boolean;\n  /** Override the trigger label */\n  label?: ReactNode;\n  /** Content alignment */\n  align?: 'start' | 'center' | 'end';\n  /** Minimum items before showing search in a submenu */\n  searchThreshold?: number;\n};\n\n// ---------------------------------------------------------------------------\n// Internal helpers\n// ---------------------------------------------------------------------------\n\nconst SUBMENU_SEARCH_THRESHOLD = 6;\n\nfunction SubMenuSearch({\n  value,\n  onChange,\n  label = 'Search',\n}: {\n  value: string;\n  onChange: (v: string) => void;\n  label?: string;\n}) {\n  return (\n    <div className={cn('px-2 pb-2')}>\n      <div\n        className={cn(\n          'flex items-center gap-2 border border-border1 rounded-md px-2 py-1',\n          'focus-within:border-neutral2',\n        )}\n      >\n        <SearchIcon className={cn('text-neutral3 h-3.5 w-3.5 shrink-0')} />\n        <input\n          type=\"text\"\n          placeholder=\"Search...\"\n          aria-label={label}\n          value={value}\n          onChange={e => onChange(e.target.value)}\n          onKeyDown={e => e.stopPropagation()}\n          className={cn('bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full')}\n        />\n      </div>\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport function SelectDataFilter({\n  categories,\n  value,\n  onChange,\n  disabled,\n  label = 'Filter',\n  align = 'end',\n  searchThreshold = SUBMENU_SEARCH_THRESHOLD,\n}: SelectDataFilterProps) {\n  const [filterSearch, setFilterSearch] = useState('');\n  const [subSearch, setSubSearch] = useState('');\n\n  const resetSubSearch = useCallback((open: boolean) => {\n    if (!open) setSubSearch('');\n  }, []);\n\n  // Count active filters\n  const activeFilterCount = useMemo(() => {\n    let count = 0;\n    for (const selections of Object.values(value)) {\n      if (selections.length > 0) count++;\n    }\n    return count;\n  }, [value]);\n\n  // Group categories\n  const grouped = useMemo(() => {\n    const q = filterSearch.toLowerCase();\n    const groups: { key: string; label?: string; items: SelectDataFilterCategory[] }[] = [];\n    const groupMap = new Map<string, SelectDataFilterCategory[]>();\n    const ungrouped: SelectDataFilterCategory[] = [];\n\n    for (const cat of categories) {\n      if (cat.values.length === 0) continue;\n      // Filter by search\n      if (q) {\n        const matchesLabel = cat.label.toLowerCase().includes(q);\n        const matchesValues = cat.values.some(v => v.label.toLowerCase().includes(q));\n        if (!matchesLabel && !matchesValues) continue;\n      }\n      if (cat.group) {\n        let items = groupMap.get(cat.group);\n        if (!items) {\n          items = [];\n          groupMap.set(cat.group, items);\n        }\n        items.push(cat);\n      } else {\n        ungrouped.push(cat);\n      }\n    }\n\n    // Ungrouped items first\n    for (const cat of ungrouped) {\n      groups.push({ key: cat.id, items: [cat] });\n    }\n    // Then grouped\n    for (const [groupLabel, items] of groupMap) {\n      groups.push({ key: `group-${groupLabel}`, label: groupLabel, items });\n    }\n\n    return groups;\n  }, [categories, filterSearch]);\n\n  const handleSelect = (categoryId: string, selectedValue: string, mode: SelectDataFilterMode) => {\n    const current = value[categoryId] ?? [];\n    let next: string[];\n\n    if (mode === 'single') {\n      next = current.includes(selectedValue) ? [] : [selectedValue];\n    } else {\n      next = current.includes(selectedValue) ? current.filter(v => v !== selectedValue) : [...current, selectedValue];\n    }\n\n    onChange({ ...value, [categoryId]: next });\n  };\n\n  const handleClearAll = () => {\n    onChange({});\n  };\n\n  const renderCategory = (cat: SelectDataFilterCategory) => {\n    const mode = cat.mode ?? 'multi';\n    const selected = value[cat.id] ?? [];\n    const selectedCount = selected.length;\n\n    return (\n      <DropdownMenu.Sub key={cat.id} onOpenChange={resetSubSearch}>\n        <DropdownMenu.SubTrigger>\n          <span className={cn('truncate')}>{cat.label}</span>\n          {selectedCount > 0 && <span className={cn('ml-auto text-ui-sm text-accent1')}>{selectedCount}</span>}\n        </DropdownMenu.SubTrigger>\n        <DropdownMenu.SubContent className={cn('max-h-[20rem]')}>\n          {cat.values.length >= searchThreshold && (\n            <SubMenuSearch value={subSearch} onChange={setSubSearch} label={`Search ${cat.label.toLowerCase()}`} />\n          )}\n          {mode === 'single' ? (\n            <DropdownMenu.RadioGroup value={selected[0] ?? ''} onValueChange={val => handleSelect(cat.id, val, mode)}>\n              {cat.values\n                .filter(v => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase()))\n                .map(v => (\n                  <DropdownMenu.RadioItem key={v.value} value={v.value}>\n                    <span className={cn('truncate')}>{v.label}</span>\n                  </DropdownMenu.RadioItem>\n                ))}\n            </DropdownMenu.RadioGroup>\n          ) : (\n            cat.values\n              .filter(v => !subSearch || v.label.toLowerCase().includes(subSearch.toLowerCase()))\n              .map(v => (\n                <DropdownMenu.CheckboxItem\n                  key={v.value}\n                  checked={selected.includes(v.value)}\n                  onCheckedChange={() => handleSelect(cat.id, v.value, mode)}\n                  onSelect={e => e.preventDefault()}\n                >\n                  <span className={cn('truncate')}>{v.label}</span>\n                </DropdownMenu.CheckboxItem>\n              ))\n          )}\n        </DropdownMenu.SubContent>\n      </DropdownMenu.Sub>\n    );\n  };\n\n  return (\n    <DropdownMenu modal={false}>\n      <DropdownMenu.Trigger asChild>\n        <Button variant=\"outline\" disabled={disabled} size=\"md\">\n          <FilterIcon />\n          {label}\n          {activeFilterCount > 0 && (\n            <span\n              className={cn(\n                'ml-0.5 inline-flex items-center justify-center rounded-full bg-accent1/50 text-neutral5 text-ui-sm w-5 h-5',\n              )}\n            >\n              {activeFilterCount}\n            </span>\n          )}\n        </Button>\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content align={align} className={cn('min-w-[12rem]')}>\n        {/* Search */}\n        <div className={cn('px-2 pb-2')}>\n          <div\n            className={cn(\n              'flex items-center gap-2 border border-border1 rounded-md px-2 py-1',\n              'focus-within:border-neutral2',\n            )}\n          >\n            <SearchIcon className={cn('text-neutral3 h-3.5 w-3.5 shrink-0')} />\n            <input\n              type=\"text\"\n              placeholder=\"Search filters...\"\n              aria-label=\"Search filters\"\n              value={filterSearch}\n              onChange={e => setFilterSearch(e.target.value)}\n              onKeyDown={e => e.stopPropagation()}\n              className={cn('bg-transparent text-ui-sm text-neutral4 placeholder:text-neutral3 outline-none w-full')}\n            />\n          </div>\n        </div>\n\n        <DropdownMenu.Separator />\n\n        {grouped.map(group => {\n          if (group.items.length === 1 && !group.label) {\n            return renderCategory(group.items[0]);\n          }\n\n          if (group.label && group.items.length === 1) {\n            // Single item in a named group — render directly with group as context\n            return renderCategory(group.items[0]);\n          }\n\n          // Multiple items under a group label — nest under a sub-trigger\n          return (\n            <DropdownMenu.Sub key={group.key}>\n              <DropdownMenu.SubTrigger>{group.label}</DropdownMenu.SubTrigger>\n              <DropdownMenu.SubContent className={cn('max-h-[20rem]')}>\n                {group.items.map(cat => renderCategory(cat))}\n              </DropdownMenu.SubContent>\n            </DropdownMenu.Sub>\n          );\n        })}\n\n        {/* Clear all */}\n        {activeFilterCount > 0 && (\n          <>\n            <DropdownMenu.Separator />\n            <DropdownMenu.Item onSelect={handleClearAll}>\n              <XIcon />\n              Clear all filters\n            </DropdownMenu.Item>\n          </>\n        )}\n      </DropdownMenu.Content>\n    </DropdownMenu>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/select-field-block-C1I1FLvQ.js

@@ -0,0 +1,48 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { F as FieldBlock } from './field-block-CpRBHzQO.js';
+import { S as Select, d as SelectTrigger, e as SelectValue, a as SelectContent, c as SelectItem } from './select-CFB6QZ9B.js';
+import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
+
+function SelectFieldBlock({
+  name,
+  helpText,
+  errorMsg,
+  required = false,
+  disabled = false,
+  size = "md",
+  value,
+  label,
+  labelIsHidden = false,
+  layout = "vertical",
+  labelColumnWidth,
+  options,
+  placeholder = "Select an option",
+  onValueChange,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(FieldBlock.Layout, { layout, labelColumnWidth, className, children: [
+    layout === "horizontal" ? /* @__PURE__ */ jsx(FieldBlock.Column, { children: /* @__PURE__ */ jsx(FieldBlock.Label, { name, required, children: labelIsHidden ? /* @__PURE__ */ jsx(VisuallyHidden, { children: label }) : label }) }) : null,
+    /* @__PURE__ */ jsxs(FieldBlock.Column, { children: [
+      layout === "vertical" && label && !labelIsHidden ? /* @__PURE__ */ jsx(FieldBlock.Label, { name, required, children: label }) : null,
+      /* @__PURE__ */ jsxs(
+        Select,
+        {
+          "aria-label": labelIsHidden ? label : void 0,
+          name,
+          value,
+          onValueChange,
+          disabled,
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { size, children: /* @__PURE__ */ jsx(SelectValue, { placeholder }) }),
+            /* @__PURE__ */ jsx(SelectContent, { children: options.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: option.label }, option.value)) })
+          ]
+        }
+      ),
+      helpText && /* @__PURE__ */ jsx(FieldBlock.HelpText, { children: helpText }),
+      errorMsg && /* @__PURE__ */ jsx(FieldBlock.ErrorMsg, { children: errorMsg })
+    ] })
+  ] });
+}
+
+export { SelectFieldBlock as S };
+//# sourceMappingURL=select-field-block-C1I1FLvQ.js.map

package/dist/select-field-block-C1I1FLvQ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-field-block-C1I1FLvQ.js","sources":["../src/ds/components/FormFieldBlocks/fields/select-field-block.tsx"],"sourcesContent":["import type { SelectTriggerProps } from '../../Select/select';\nimport { FieldBlock } from '../block/field-block';\nimport type { FieldBlockErrorMsgProps } from '../block/field-block-error-msg';\nimport type { FieldBlockHelpTextProps } from '../block/field-block-help-text';\nimport type { FieldBlockLabelProps } from '../block/field-block-label';\nimport type { FieldBlockLayoutProps } from '../block/field-block-layout';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/ds/components/Select';\nimport { VisuallyHidden } from '@/ds/primitives/visually-hidden';\n\nexport type SelectFieldBlockProps = Pick<FieldBlockLayoutProps, 'layout' | 'labelColumnWidth'> &\n  Pick<FieldBlockLabelProps, 'name' | 'required'> & {\n    testId?: string;\n    label?: string | null;\n    labelIsHidden?: boolean;\n    labelSize?: FieldBlockLabelProps['size'];\n    disabled?: boolean;\n    value?: string;\n    options: { value: string; label: string }[];\n    placeholder?: string;\n    onValueChange: (value: string) => void;\n    helpText?: FieldBlockHelpTextProps['children'];\n    errorMsg?: FieldBlockErrorMsgProps['children'];\n    error?: boolean;\n    className?: string;\n    size?: SelectTriggerProps['size'];\n  };\n\nexport function SelectFieldBlock({\n  name,\n  helpText,\n  errorMsg,\n  required = false,\n  disabled = false,\n  size = 'md',\n  value,\n  label,\n  labelIsHidden = false,\n  layout = 'vertical',\n  labelColumnWidth,\n  options,\n  placeholder = 'Select an option',\n  onValueChange,\n  className,\n}: SelectFieldBlockProps) {\n  return (\n    <FieldBlock.Layout layout={layout} labelColumnWidth={labelColumnWidth} className={className}>\n      {layout === 'horizontal' ? (\n        <FieldBlock.Column>\n          <FieldBlock.Label name={name} required={required}>\n            {labelIsHidden ? <VisuallyHidden>{label}</VisuallyHidden> : label}\n          </FieldBlock.Label>\n        </FieldBlock.Column>\n      ) : null}\n      <FieldBlock.Column>\n        {layout === 'vertical' && label && !labelIsHidden ? (\n          <FieldBlock.Label name={name} required={required}>\n            {label}\n          </FieldBlock.Label>\n        ) : null}\n        <Select\n          aria-label={labelIsHidden ? label : undefined}\n          name={name}\n          value={value}\n          onValueChange={onValueChange}\n          disabled={disabled}\n        >\n          <SelectTrigger size={size}>\n            <SelectValue placeholder={placeholder} />\n          </SelectTrigger>\n          <SelectContent>\n            {options.map(option => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </Select>\n        {helpText && <FieldBlock.HelpText>{helpText}</FieldBlock.HelpText>}\n        {errorMsg && <FieldBlock.ErrorMsg>{errorMsg}</FieldBlock.ErrorMsg>}\n      </FieldBlock.Column>\n    </FieldBlock.Layout>\n  );\n}\n"],"names":[],"mappings":";;;;;AA2BO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,IAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,QAAA,GAAW,KAAA;AAAA,EACX,IAAA,GAAO,IAAA;AAAA,EACP,KAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA,GAAgB,KAAA;AAAA,EAChB,MAAA,GAAS,UAAA;AAAA,EACT,gBAAA;AAAA,EACA,OAAA;AAAA,EACA,WAAA,GAAc,kBAAA;AAAA,EACd,aAAA;AAAA,EACA;AACF,CAAA,EAA0B;AACxB,EAAA,4BACG,UAAA,CAAW,MAAA,EAAX,EAAkB,MAAA,EAAgB,kBAAoC,SAAA,EACpE,QAAA,EAAA;AAAA,IAAA,MAAA,KAAW,+BACV,GAAA,CAAC,UAAA,CAAW,QAAX,EACC,QAAA,kBAAA,GAAA,CAAC,WAAW,KAAA,EAAX,EAAiB,IAAA,EAAY,QAAA,EAC3B,0CAAgB,GAAA,CAAC,cAAA,EAAA,EAAgB,iBAAM,CAAA,GAAoB,KAAA,EAC9D,GACF,CAAA,GACE,IAAA;AAAA,oBACJ,IAAA,CAAC,UAAA,CAAW,MAAA,EAAX,EACE,QAAA,EAAA;AAAA,MAAA,MAAA,KAAW,UAAA,IAAc,KAAA,IAAS,CAAC,aAAA,mBAClC,GAAA,CAAC,UAAA,CAAW,KAAA,EAAX,EAAiB,IAAA,EAAY,QAAA,EAC3B,QAAA,EAAA,KAAA,EACH,CAAA,GACE,IAAA;AAAA,sBACJ,IAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,YAAA,EAAY,gBAAgB,KAAA,GAAQ,MAAA;AAAA,UACpC,IAAA;AAAA,UACA,KAAA;AAAA,UACA,aAAA;AAAA,UACA,QAAA;AAAA,UAEA,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,aAAA,EAAA,EAAc,IAAA,EACb,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,aAA0B,CAAA,EACzC,CAAA;AAAA,4BACA,GAAA,CAAC,aAAA,EAAA,EACE,QAAA,EAAA,OAAA,CAAQ,GAAA,CAAI,4BACX,GAAA,CAAC,UAAA,EAAA,EAA8B,KAAA,EAAO,MAAA,CAAO,OAC1C,QAAA,EAAA,MAAA,CAAO,KAAA,EAAA,EADO,MAAA,CAAO,KAExB,CACD,CAAA,EACH;AAAA;AAAA;AAAA,OACF;AAAA,MACC,QAAA,oBAAY,GAAA,CAAC,UAAA,CAAW,QAAA,EAAX,EAAqB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,MAC3C,QAAA,oBAAY,GAAA,CAAC,UAAA,CAAW,QAAA,EAAX,EAAqB,QAAA,EAAA,QAAA,EAAS;AAAA,KAAA,EAC9C;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/select-field-block-Cb5-7wDy.cjs

@@ -0,0 +1,50 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const fieldBlock = require('./field-block-BR_ZD9QO.cjs');
+const select = require('./select-BxSmi19p.cjs');
+const reactVisuallyHidden = require('@radix-ui/react-visually-hidden');
+
+function SelectFieldBlock({
+  name,
+  helpText,
+  errorMsg,
+  required = false,
+  disabled = false,
+  size = "md",
+  value,
+  label,
+  labelIsHidden = false,
+  layout = "vertical",
+  labelColumnWidth,
+  options,
+  placeholder = "Select an option",
+  onValueChange,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(fieldBlock.FieldBlock.Layout, { layout, labelColumnWidth, className, children: [
+    layout === "horizontal" ? /* @__PURE__ */ jsxRuntime.jsx(fieldBlock.FieldBlock.Column, { children: /* @__PURE__ */ jsxRuntime.jsx(fieldBlock.FieldBlock.Label, { name, required, children: labelIsHidden ? /* @__PURE__ */ jsxRuntime.jsx(reactVisuallyHidden.VisuallyHidden, { children: label }) : label }) }) : null,
+    /* @__PURE__ */ jsxRuntime.jsxs(fieldBlock.FieldBlock.Column, { children: [
+      layout === "vertical" && label && !labelIsHidden ? /* @__PURE__ */ jsxRuntime.jsx(fieldBlock.FieldBlock.Label, { name, required, children: label }) : null,
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        select.Select,
+        {
+          "aria-label": labelIsHidden ? label : void 0,
+          name,
+          value,
+          onValueChange,
+          disabled,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(select.SelectTrigger, { size, children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, { placeholder }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(select.SelectContent, { children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: option.value, children: option.label }, option.value)) })
+          ]
+        }
+      ),
+      helpText && /* @__PURE__ */ jsxRuntime.jsx(fieldBlock.FieldBlock.HelpText, { children: helpText }),
+      errorMsg && /* @__PURE__ */ jsxRuntime.jsx(fieldBlock.FieldBlock.ErrorMsg, { children: errorMsg })
+    ] })
+  ] });
+}
+
+exports.SelectFieldBlock = SelectFieldBlock;
+//# sourceMappingURL=select-field-block-Cb5-7wDy.cjs.map

package/dist/select-field-block-Cb5-7wDy.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-field-block-Cb5-7wDy.cjs","sources":["../src/ds/components/FormFieldBlocks/fields/select-field-block.tsx"],"sourcesContent":["import type { SelectTriggerProps } from '../../Select/select';\nimport { FieldBlock } from '../block/field-block';\nimport type { FieldBlockErrorMsgProps } from '../block/field-block-error-msg';\nimport type { FieldBlockHelpTextProps } from '../block/field-block-help-text';\nimport type { FieldBlockLabelProps } from '../block/field-block-label';\nimport type { FieldBlockLayoutProps } from '../block/field-block-layout';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/ds/components/Select';\nimport { VisuallyHidden } from '@/ds/primitives/visually-hidden';\n\nexport type SelectFieldBlockProps = Pick<FieldBlockLayoutProps, 'layout' | 'labelColumnWidth'> &\n  Pick<FieldBlockLabelProps, 'name' | 'required'> & {\n    testId?: string;\n    label?: string | null;\n    labelIsHidden?: boolean;\n    labelSize?: FieldBlockLabelProps['size'];\n    disabled?: boolean;\n    value?: string;\n    options: { value: string; label: string }[];\n    placeholder?: string;\n    onValueChange: (value: string) => void;\n    helpText?: FieldBlockHelpTextProps['children'];\n    errorMsg?: FieldBlockErrorMsgProps['children'];\n    error?: boolean;\n    className?: string;\n    size?: SelectTriggerProps['size'];\n  };\n\nexport function SelectFieldBlock({\n  name,\n  helpText,\n  errorMsg,\n  required = false,\n  disabled = false,\n  size = 'md',\n  value,\n  label,\n  labelIsHidden = false,\n  layout = 'vertical',\n  labelColumnWidth,\n  options,\n  placeholder = 'Select an option',\n  onValueChange,\n  className,\n}: SelectFieldBlockProps) {\n  return (\n    <FieldBlock.Layout layout={layout} labelColumnWidth={labelColumnWidth} className={className}>\n      {layout === 'horizontal' ? (\n        <FieldBlock.Column>\n          <FieldBlock.Label name={name} required={required}>\n            {labelIsHidden ? <VisuallyHidden>{label}</VisuallyHidden> : label}\n          </FieldBlock.Label>\n        </FieldBlock.Column>\n      ) : null}\n      <FieldBlock.Column>\n        {layout === 'vertical' && label && !labelIsHidden ? (\n          <FieldBlock.Label name={name} required={required}>\n            {label}\n          </FieldBlock.Label>\n        ) : null}\n        <Select\n          aria-label={labelIsHidden ? label : undefined}\n          name={name}\n          value={value}\n          onValueChange={onValueChange}\n          disabled={disabled}\n        >\n          <SelectTrigger size={size}>\n            <SelectValue placeholder={placeholder} />\n          </SelectTrigger>\n          <SelectContent>\n            {options.map(option => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </Select>\n        {helpText && <FieldBlock.HelpText>{helpText}</FieldBlock.HelpText>}\n        {errorMsg && <FieldBlock.ErrorMsg>{errorMsg}</FieldBlock.ErrorMsg>}\n      </FieldBlock.Column>\n    </FieldBlock.Layout>\n  );\n}\n"],"names":["FieldBlock","jsx","VisuallyHidden","jsxs","Select","SelectTrigger","SelectValue","SelectContent","SelectItem"],"mappings":";;;;;;;AA2BO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,IAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,QAAA,GAAW,KAAA;AAAA,EACX,IAAA,GAAO,IAAA;AAAA,EACP,KAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA,GAAgB,KAAA;AAAA,EAChB,MAAA,GAAS,UAAA;AAAA,EACT,gBAAA;AAAA,EACA,OAAA;AAAA,EACA,WAAA,GAAc,kBAAA;AAAA,EACd,aAAA;AAAA,EACA;AACF,CAAA,EAA0B;AACxB,EAAA,uCACGA,qBAAA,CAAW,MAAA,EAAX,EAAkB,MAAA,EAAgB,kBAAoC,SAAA,EACpE,QAAA,EAAA;AAAA,IAAA,MAAA,KAAW,+BACVC,cAAA,CAACD,qBAAA,CAAW,QAAX,EACC,QAAA,kBAAAC,cAAA,CAACD,sBAAW,KAAA,EAAX,EAAiB,IAAA,EAAY,QAAA,EAC3B,0CAAgBC,cAAA,CAACC,kCAAA,EAAA,EAAgB,iBAAM,CAAA,GAAoB,KAAA,EAC9D,GACF,CAAA,GACE,IAAA;AAAA,oBACJC,eAAA,CAACH,qBAAA,CAAW,MAAA,EAAX,EACE,QAAA,EAAA;AAAA,MAAA,MAAA,KAAW,UAAA,IAAc,KAAA,IAAS,CAAC,aAAA,mBAClCC,cAAA,CAACD,qBAAA,CAAW,KAAA,EAAX,EAAiB,IAAA,EAAY,QAAA,EAC3B,QAAA,EAAA,KAAA,EACH,CAAA,GACE,IAAA;AAAA,sBACJG,eAAA;AAAA,QAACC,aAAA;AAAA,QAAA;AAAA,UACC,YAAA,EAAY,gBAAgB,KAAA,GAAQ,MAAA;AAAA,UACpC,IAAA;AAAA,UACA,KAAA;AAAA,UACA,aAAA;AAAA,UACA,QAAA;AAAA,UAEA,QAAA,EAAA;AAAA,4BAAAH,cAAA,CAACI,oBAAA,EAAA,EAAc,IAAA,EACb,QAAA,kBAAAJ,cAAA,CAACK,kBAAA,EAAA,EAAY,aAA0B,CAAA,EACzC,CAAA;AAAA,4BACAL,cAAA,CAACM,oBAAA,EAAA,EACE,QAAA,EAAA,OAAA,CAAQ,GAAA,CAAI,4BACXN,cAAA,CAACO,iBAAA,EAAA,EAA8B,KAAA,EAAO,MAAA,CAAO,OAC1C,QAAA,EAAA,MAAA,CAAO,KAAA,EAAA,EADO,MAAA,CAAO,KAExB,CACD,CAAA,EACH;AAAA;AAAA;AAAA,OACF;AAAA,MACC,QAAA,oBAAYP,cAAA,CAACD,qBAAA,CAAW,QAAA,EAAX,EAAqB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,MAC3C,QAAA,oBAAYC,cAAA,CAACD,qBAAA,CAAW,QAAA,EAAX,EAAqB,QAAA,EAAA,QAAA,EAAS;AAAA,KAAA,EAC9C;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}