@d4gger/design-system 3.0.0 → 4.0.0

package/dist/components/filterBar/FilterBar.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/filterBar/FilterBar.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { Button, type ButtonProps } from '../button/Button'\nimport { filterBarPropDefs } from './filterBar.props'\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\ntype FilterBarOwnProps = GetPropDefTypes<typeof filterBarPropDefs>\ninterface FilterBarProps extends React.HTMLAttributes<HTMLDivElement>, FilterBarOwnProps { activeCount?: number }\ninterface FilterBarClearProps extends Omit<ButtonProps, 'onClick'> {\n  onClear?: () => void\n  onClick?: React.MouseEventHandler<HTMLButtonElement>\n}\n\nconst FilterBarContext = React.createContext<number | undefined>(undefined)\nconst FilterBarRoot = React.forwardRef<HTMLDivElement, FilterBarProps>((props, forwardedRef) => {\n  const { activeCount, children, className, size = 'md', ...rootProps } = extractProps(props, filterBarPropDefs)\n  return (\n    <FilterBarContext.Provider value={activeCount}>\n    <div\n      {...rootProps}\n      ref={forwardedRef}\n      role={rootProps.role ?? 'toolbar'}\n      aria-label={rootProps['aria-label'] ?? 'Filters'}\n      className={classNames('dsx-filter-bar', className)}\n      data-size={size}\n      data-active={activeCount !== undefined && activeCount > 0 ? 'true' : undefined}\n    >{children}</div>\n    </FilterBarContext.Provider>\n  )\n})\nFilterBarRoot.displayName = 'FilterBar'\n\nfunction createFilterBarSlot(className: string, displayName: string, defaultRole?: React.AriaRole) {\n  const SlotComponent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n    ({ className: slotClassName, role, ...props }, forwardedRef) => (\n      <div\n        {...props}\n        ref={forwardedRef}\n        role={role ?? defaultRole}\n        className={classNames(className, slotClassName)}\n      />\n    ),\n  )\n  SlotComponent.displayName = displayName\n  return SlotComponent\n}\n\nconst FilterBarGroup = createFilterBarSlot('dsx-filter-bar__group', 'FilterBarGroup', 'group')\nconst FilterBarSummary = createFilterBarSlot('dsx-filter-bar__summary', 'FilterBarSummary')\nconst FilterBarActions = createFilterBarSlot('dsx-filter-bar__actions', 'FilterBarActions')\ninterface FilterBarControlProps extends React.HTMLAttributes<HTMLDivElement> { active?: boolean }\nconst FilterBarControl = React.forwardRef<HTMLDivElement, FilterBarControlProps>(({ active = false, className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-filter-bar__control', className)} data-active={active ? 'true' : undefined} />)\nFilterBarControl.displayName = 'FilterBarControl'\nconst FilterBarCount = React.forwardRef<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>>(({ children, className, ...props }, ref) => { const count = React.useContext(FilterBarContext); return <span {...props} ref={ref} className={classNames('dsx-filter-bar__count', className)}>{children ?? count ?? 0}</span> })\nFilterBarCount.displayName = 'FilterBarCount'\n\nconst FilterBarClear = React.forwardRef<React.ComponentRef<typeof Button>, FilterBarClearProps>(\n  ({ children = 'Clear filters', className, disabled, onClear, onClick, type = 'button', variant = 'ghost', ...props }, forwardedRef) => {\n    const activeCount = React.useContext(FilterBarContext)\n    return (\n    <Button\n      {...props}\n      ref={forwardedRef}\n      type={type}\n      variant={variant}\n      disabled={disabled ?? activeCount === 0}\n      className={classNames('dsx-filter-bar__clear', className)}\n      onClick={(event) => {\n        onClick?.(event)\n        if (!event.defaultPrevented) onClear?.()\n      }}\n    >\n      {children}\n    </Button>\n    )\n  },\n)\nFilterBarClear.displayName = 'FilterBarClear'\n\nconst FilterBar: typeof FilterBarRoot & {\n  Group: typeof FilterBarGroup\n  Summary: typeof FilterBarSummary\n  Actions: typeof FilterBarActions\n  Clear: typeof FilterBarClear\n  Control: typeof FilterBarControl\n  Count: typeof FilterBarCount\n} = Object.assign(FilterBarRoot, {\n  Group: FilterBarGroup,\n  Summary: FilterBarSummary,\n  Actions: FilterBarActions,\n  Clear: FilterBarClear,\n  Control: FilterBarControl,\n  Count: FilterBarCount,\n})\n\nexport { FilterBar, FilterBarActions, FilterBarClear, FilterBarControl, FilterBarCount, FilterBarGroup, FilterBarRoot, FilterBarSummary }\nexport type { FilterBarClearProps, FilterBarProps }\n"],
-  "mappings": "AAAA,YAAY,WAAW;AACvB,OAAO,gBAAgB;AAEvB,SAAS,oBAAoB;AAC7B,SAAS,cAAgC;AACzC,SAAS,yBAAyB;AAe9B;AALJ,MAAM,mBAAmB,MAAM,cAAkC,MAAS;AAC1E,MAAM,gBAAgB,MAAM,WAA2C,CAAC,OAAO,iBAAiB;AAC9F,QAAM,EAAE,aAAa,UAAU,WAAW,OAAO,MAAM,GAAG,UAAU,IAAI,aAAa,OAAO,iBAAiB;AAC7G,SACE,oBAAC,iBAAiB,UAAjB,EAA0B,OAAO,aAClC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,MAAM,UAAU,QAAQ;AAAA,MACxB,cAAY,UAAU,YAAY,KAAK;AAAA,MACvC,WAAW,WAAW,kBAAkB,SAAS;AAAA,MACjD,aAAW;AAAA,MACX,eAAa,gBAAgB,UAAa,cAAc,IAAI,SAAS;AAAA,MACrE;AAAA;AAAA,EAAS,GACX;AAEJ,CAAC;AACD,cAAc,cAAc;AAE5B,SAAS,oBAAoB,WAAmB,aAAqB,aAA8B;AACjG,QAAM,gBAAgB,MAAM;AAAA,IAC1B,CAAC,EAAE,WAAW,eAAe,MAAM,GAAG,MAAM,GAAG,iBAC7C;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,MAAM,QAAQ;AAAA,QACd,WAAW,WAAW,WAAW,aAAa;AAAA;AAAA,IAChD;AAAA,EAEJ;AACA,gBAAc,cAAc;AAC5B,SAAO;AACT;AAEA,MAAM,iBAAiB,oBAAoB,yBAAyB,kBAAkB,OAAO;AAC7F,MAAM,mBAAmB,oBAAoB,2BAA2B,kBAAkB;AAC1F,MAAM,mBAAmB,oBAAoB,2BAA2B,kBAAkB;AAE1F,MAAM,mBAAmB,MAAM,WAAkD,CAAC,EAAE,SAAS,OAAO,WAAW,GAAG,MAAM,GAAG,QAAQ,oBAAC,SAAK,GAAG,OAAO,KAAU,WAAW,WAAW,2BAA2B,SAAS,GAAG,eAAa,SAAS,SAAS,QAAW,CAAE;AACtQ,iBAAiB,cAAc;AAC/B,MAAM,iBAAiB,MAAM,WAAmE,CAAC,EAAE,UAAU,WAAW,GAAG,MAAM,GAAG,QAAQ;AAAE,QAAM,QAAQ,MAAM,WAAW,gBAAgB;AAAG,SAAO,oBAAC,UAAM,GAAG,OAAO,KAAU,WAAW,WAAW,yBAAyB,SAAS,GAAI,sBAAY,SAAS,GAAE;AAAQ,CAAC;AAC9T,eAAe,cAAc;AAE7B,MAAM,iBAAiB,MAAM;AAAA,EAC3B,CAAC,EAAE,WAAW,iBAAiB,WAAW,UAAU,SAAS,SAAS,OAAO,UAAU,UAAU,SAAS,GAAG,MAAM,GAAG,iBAAiB;AACrI,UAAM,cAAc,MAAM,WAAW,gBAAgB;AACrD,WACA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU,YAAY,gBAAgB;AAAA,QACtC,WAAW,WAAW,yBAAyB,SAAS;AAAA,QACxD,SAAS,CAAC,UAAU;AAClB,oBAAU,KAAK;AACf,cAAI,CAAC,MAAM,iBAAkB,WAAU;AAAA,QACzC;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEF;AACF;AACA,eAAe,cAAc;AAE7B,MAAM,YAOF,OAAO,OAAO,eAAe;AAAA,EAC/B,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,OAAO;AACT,CAAC;",
+  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { Button, type ButtonProps } from '../button/Button'\nimport { Badge } from '../badge/Badge'\nimport { Icon } from '../icon/Icon'\nimport { IconButton } from '../iconButton/IconButton'\nimport { Input } from '../input/Input'\nimport { NumberInput } from '../numberInput/NumberInput'\nimport { Pill, Pills } from '../pills/Pills'\nimport { Popover } from '../popover/Popover'\nimport { SelectContent, SelectItem, SelectRoot, SelectTrigger, SelectValue } from '../select/Select'\nimport { Slider } from '../slider/Slider'\nimport { TagsInput } from '../tagsInput/TagsInput'\nimport { filterBarPropDefs } from './filterBar.props'\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\ntype FilterBarOwnProps = GetPropDefTypes<typeof filterBarPropDefs>\ninterface FilterBarProps extends React.HTMLAttributes<HTMLDivElement>, FilterBarOwnProps { activeCount?: number }\ninterface FilterBarClearProps extends Omit<ButtonProps, 'onClick'> {\n  onClear?: () => void\n  onClick?: React.MouseEventHandler<HTMLButtonElement>\n}\n\nconst FilterBarContext = React.createContext<number | undefined>(undefined)\nconst FilterBarRoot = React.forwardRef<HTMLDivElement, FilterBarProps>((props, forwardedRef) => {\n  const { activeCount, children, className, size = 'md', ...rootProps } = extractProps(props, filterBarPropDefs)\n  return (\n    <FilterBarContext.Provider value={activeCount}>\n    <div\n      {...rootProps}\n      ref={forwardedRef}\n      role={rootProps.role ?? 'toolbar'}\n      aria-label={rootProps['aria-label'] ?? 'Filters'}\n      className={classNames('dsx-filter-bar', className)}\n      data-size={size}\n      data-active={activeCount !== undefined && activeCount > 0 ? 'true' : undefined}\n    >{children}</div>\n    </FilterBarContext.Provider>\n  )\n})\nFilterBarRoot.displayName = 'FilterBar'\n\nfunction createFilterBarSlot(className: string, displayName: string, defaultRole?: React.AriaRole) {\n  const SlotComponent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n    ({ className: slotClassName, role, ...props }, forwardedRef) => (\n      <div\n        {...props}\n        ref={forwardedRef}\n        role={role ?? defaultRole}\n        className={classNames(className, slotClassName)}\n      />\n    ),\n  )\n  SlotComponent.displayName = displayName\n  return SlotComponent\n}\n\nconst FilterBarGroup = createFilterBarSlot('dsx-filter-bar__group', 'FilterBarGroup', 'group')\nconst FilterBarSummary = createFilterBarSlot('dsx-filter-bar__summary', 'FilterBarSummary')\nconst FilterBarActions = createFilterBarSlot('dsx-filter-bar__actions', 'FilterBarActions')\ninterface FilterBarControlProps extends React.HTMLAttributes<HTMLDivElement> { active?: boolean }\nconst FilterBarControl = React.forwardRef<HTMLDivElement, FilterBarControlProps>(({ active = false, className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-filter-bar__control', className)} data-active={active ? 'true' : undefined} />)\nFilterBarControl.displayName = 'FilterBarControl'\nconst FilterBarCount = React.forwardRef<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>>(({ children, className, ...props }, ref) => { const count = React.useContext(FilterBarContext); return <span {...props} ref={ref} className={classNames('dsx-filter-bar__count', className)}>{children ?? count ?? 0}</span> })\nFilterBarCount.displayName = 'FilterBarCount'\n\nconst FilterBarClear = React.forwardRef<React.ComponentRef<typeof Button>, FilterBarClearProps>(\n  ({ children = 'Clear filters', className, disabled, onClear, onClick, type = 'button', variant = 'ghost', ...props }, forwardedRef) => {\n    const activeCount = React.useContext(FilterBarContext)\n    return (\n    <Button\n      {...props}\n      ref={forwardedRef}\n      type={type}\n      variant={variant}\n      disabled={disabled ?? activeCount === 0}\n      className={classNames('dsx-filter-bar__clear', className)}\n      onClick={(event) => {\n        onClick?.(event)\n        if (!event.defaultPrevented) onClear?.()\n      }}\n    >\n      {children}\n    </Button>\n    )\n  },\n)\nFilterBarClear.displayName = 'FilterBarClear'\n\ninterface FilterBarSearchProps extends React.HTMLAttributes<HTMLDivElement> {}\nconst FilterBarSearch = React.forwardRef<HTMLDivElement, FilterBarSearchProps>(({ className, ...props }, ref) => (\n  <div {...props} ref={ref} className={classNames('dsx-filter-bar__search', className)} />\n))\nFilterBarSearch.displayName = 'FilterBarSearch'\n\ninterface FilterBarRulesProps extends Omit<React.HTMLAttributes<HTMLUListElement>, 'color'> {\n  size?: 'sm' | 'md' | 'lg'\n  maxVisible?: number\n  expanded?: boolean\n  defaultExpanded?: boolean\n  onExpandedChange?: (expanded: boolean) => void\n  showMoreLabel?: (hiddenCount: number) => React.ReactNode\n  showLessLabel?: React.ReactNode\n  onClearAll?: () => void\n  clearAllLabel?: React.ReactNode\n}\nconst FilterBarRules = React.forwardRef<HTMLUListElement, FilterBarRulesProps>(\n  (\n    {\n      children,\n      className,\n      clearAllLabel = 'Clear',\n      defaultExpanded = false,\n      expanded: expandedProp,\n      maxVisible,\n      onClearAll,\n      onExpandedChange,\n      showLessLabel = 'Show less',\n      showMoreLabel = (hiddenCount: number) => `+${hiddenCount} more`,\n      size = 'md',\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    const items = React.Children.toArray(children)\n    const [uncontrolledExpanded, setUncontrolledExpanded] = React.useState(defaultExpanded)\n    const expanded = expandedProp ?? uncontrolledExpanded\n    function setExpanded(next: boolean) {\n      if (expandedProp === undefined) setUncontrolledExpanded(next)\n      onExpandedChange?.(next)\n    }\n    const collapsible = maxVisible !== undefined && items.length > maxVisible\n    const visibleItems = collapsible && !expanded ? items.slice(0, maxVisible) : items\n    const hiddenCount = items.length - visibleItems.length\n    return (\n      <Pills {...props} ref={forwardedRef} size={size} className={classNames('dsx-filter-bar__rules', className)}>\n        {visibleItems}\n        {collapsible || onClearAll !== undefined ? (\n          <li className=\"dsx-filter-bar__rules-overflow\">\n            {collapsible && !expanded ? (\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                aria-expanded={false}\n                aria-label={`Show ${hiddenCount} more filters`}\n                onClick={() => { setExpanded(true) }}\n              >\n                {showMoreLabel(hiddenCount)}\n              </Button>\n            ) : null}\n            {collapsible && expanded ? (\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                aria-expanded={true}\n                onClick={() => { setExpanded(false) }}\n              >\n                {showLessLabel}\n              </Button>\n            ) : null}\n            {onClearAll !== undefined ? (\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                aria-label=\"Clear all filters\"\n                onClick={onClearAll}\n              >\n                {clearAllLabel}\n              </Button>\n            ) : null}\n          </li>\n        ) : null}\n      </Pills>\n    )\n  },\n)\nFilterBarRules.displayName = 'FilterBarRules'\n\ninterface FilterBarRuleValue {\n  field: string\n  operator: string\n  value: string\n}\ninterface FilterBarRuleProps extends Omit<React.HTMLAttributes<HTMLLIElement>, 'color'> {\n  field: React.ReactNode\n  operator: React.ReactNode\n  value: React.ReactNode\n  count?: React.ReactNode\n  active?: boolean\n  size?: 'sm' | 'md' | 'lg'\n  onRemove?: () => void\n  onEdit?: () => void\n}\nfunction describeRulePart(part: React.ReactNode): string | undefined {\n  return typeof part === 'string' || typeof part === 'number' ? String(part) : undefined\n}\nfunction describeRuleEditLabel(field: React.ReactNode, operator: React.ReactNode, value: React.ReactNode): string {\n  const fieldText = describeRulePart(field)\n  const operatorText = describeRulePart(operator)\n  const valueText = describeRulePart(value)\n  return fieldText !== undefined && operatorText !== undefined && valueText !== undefined\n    ? `Edit filter: ${fieldText} ${operatorText} ${valueText}`\n    : 'Edit filter'\n}\nconst FilterBarRule = React.forwardRef<HTMLLIElement, FilterBarRuleProps>(\n  ({ active = false, children, className, count, field, onEdit, onRemove, operator, size = 'md', value, ...props }, forwardedRef) => {\n    const editLabel = describeRuleEditLabel(field, operator, value)\n    return (\n      <Pill\n        {...props}\n        ref={forwardedRef}\n        size={size}\n        removable={onRemove !== undefined}\n        onRemove={onRemove}\n        className={classNames('dsx-filter-bar__rule', className)}\n        data-active={active ? 'true' : undefined}\n      >\n        {onEdit !== undefined ? (\n          <button type=\"button\" className=\"dsx-filter-bar__rule-label\" onClick={onEdit} aria-label={editLabel}>\n            <span className=\"dsx-filter-bar__rule-field\">{field}</span>\n            <span className=\"dsx-filter-bar__rule-operator\">{operator}</span>\n            {value === '' ? (\n              <span className=\"dsx-filter-bar__rule-value\" data-empty=\"true\">empty</span>\n            ) : (\n              <span className=\"dsx-filter-bar__rule-value\">{value}</span>\n            )}\n            {count !== undefined ? <span className=\"dsx-filter-bar__rule-count\">{count}</span> : null}\n          </button>\n        ) : (\n          <span className=\"dsx-filter-bar__rule-label\" aria-hidden={false}>\n            <span className=\"dsx-filter-bar__rule-field\">{field}</span>\n            <span className=\"dsx-filter-bar__rule-operator\">{operator}</span>\n            {value === '' ? (\n              <span className=\"dsx-filter-bar__rule-value\" data-empty=\"true\">empty</span>\n            ) : (\n              <span className=\"dsx-filter-bar__rule-value\">{value}</span>\n            )}\n            {count !== undefined ? <span className=\"dsx-filter-bar__rule-count\">{count}</span> : null}\n          </span>\n        )}\n        {children}\n      </Pill>\n    )\n  },\n)\nFilterBarRule.displayName = 'FilterBarRule'\n\ninterface FilterBarBuilderOption {\n  value: string\n  label?: React.ReactNode\n}\ninterface FilterBarBuilderField {\n  value: string\n  label?: React.ReactNode\n  type?: 'text' | 'number' | 'enum' | 'multi' | 'range' | 'date' | 'person'\n  operators?: string[]\n  options?: FilterBarBuilderOption[]\n  min?: number\n  max?: number\n  step?: number\n  renderValue?: (state: { value: string, onChange: (nextValue: string) => void, id: string }) => React.ReactNode\n}\ninterface FilterBarBuilderProps {\n  fields: FilterBarBuilderField[]\n  operators?: string[]\n  initialRule?: FilterBarRuleValue | null\n  defaultOpen?: boolean\n  open?: boolean\n  onOpenChange?: (open: boolean) => void\n  trigger?: React.ReactNode\n  count?: React.ReactNode\n  title?: React.ReactNode\n  submitLabel?: React.ReactNode\n  cancelLabel?: React.ReactNode\n  onApply?: (rule: FilterBarRuleValue) => void\n  onCancel?: () => void\n  className?: string\n}\n\nconst FILTER_BAR_BUILDER_DEFAULT_OPERATORS = ['is', 'is not', 'contains', 'does not contain'] as const\nconst FILTER_BAR_BUILDER_EMPTY_RULE: FilterBarRuleValue = { field: '', operator: '', value: '' }\n\nfunction parseRangeValue(raw: string, min: number, max: number): [number, number] {\n  const [lo, hi] = raw.split('..').map((part) => Number(part))\n  const safeLo = Number.isFinite(lo) ? Math.min(Math.max(lo as number, min), max) : min\n  const safeHi = Number.isFinite(hi) ? Math.min(Math.max(hi as number, safeLo), max) : max\n  return [safeLo, safeHi]\n}\n\ninterface FilterBarDraftFieldsProps {\n  draft: FilterBarRuleValue\n  fields: FilterBarBuilderField[]\n  fieldClassName: string\n  labelClassName: string\n  onPatch: (patch: Partial<FilterBarRuleValue>) => void\n  operators?: string[]\n  operatorLabelId: string\n  valueInputId: string\n  valueLabelId: string\n  compact?: boolean\n  valueClassName?: string\n}\nfunction FilterBarDraftFields({\n  compact = false,\n  draft,\n  fields,\n  fieldClassName,\n  labelClassName,\n  onPatch,\n  operators: operatorsProp,\n  operatorLabelId,\n  valueClassName,\n  valueInputId,\n  valueLabelId,\n}: FilterBarDraftFieldsProps) {\n  const selectedField = fields.find((field) => field.value === draft.field)\n  const operatorOptions = selectedField?.operators ?? operatorsProp ?? [...FILTER_BAR_BUILDER_DEFAULT_OPERATORS]\n  const valueOptions = selectedField?.options\n  return (\n    <>\n      <div className={fieldClassName}>\n        {compact ? null : (\n          <span className={labelClassName} id={operatorLabelId}>Operator</span>\n        )}\n        <SelectRoot value={draft.operator} onValueChange={(nextOperator) => { onPatch({ operator: nextOperator }) }}>\n          {compact ? (\n            <SelectTrigger aria-label=\"Operator\">\n              <SelectValue placeholder=\"Choose operator\" />\n            </SelectTrigger>\n          ) : (\n            <SelectTrigger aria-labelledby={operatorLabelId}>\n              <SelectValue placeholder=\"Choose operator\" />\n            </SelectTrigger>\n          )}\n          <SelectContent>\n            {operatorOptions.map((operator) => (\n              <SelectItem key={operator} value={operator}>\n                {operator}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </SelectRoot>\n      </div>\n      <div className={valueClassName ?? fieldClassName}>\n        {selectedField?.renderValue !== undefined ? (\n          <>\n            {compact ? null : (\n              <span className={labelClassName} id={valueLabelId}>Value</span>\n            )}\n            {selectedField.renderValue({\n              value: draft.value,\n              onChange: (nextValue) => { onPatch({ value: nextValue }) },\n              id: valueInputId,\n            })}\n          </>\n        ) : valueOptions !== undefined || selectedField?.type === 'enum' ? (\n          <>\n            {compact ? null : (\n              <span className={labelClassName} id={valueLabelId}>Value</span>\n            )}\n            <SelectRoot value={draft.value} onValueChange={(nextValue) => { onPatch({ value: nextValue }) }}>\n              {compact ? (\n                <SelectTrigger aria-label=\"Value\">\n                  <SelectValue placeholder=\"Choose value\" />\n                </SelectTrigger>\n              ) : (\n                <SelectTrigger aria-labelledby={valueLabelId}>\n                  <SelectValue placeholder=\"Choose value\" />\n                </SelectTrigger>\n              )}\n              <SelectContent>\n                {(valueOptions ?? []).map((option) => (\n                  <SelectItem key={option.value} value={option.value}>\n                    {option.label ?? option.value}\n                  </SelectItem>\n                ))}\n              </SelectContent>\n            </SelectRoot>\n          </>\n        ) : selectedField?.type === 'number' ? (\n          <>\n            {compact ? null : (\n              <label className={labelClassName} htmlFor={valueInputId}>Value</label>\n            )}\n            <NumberInput\n              id={valueInputId}\n              aria-label=\"Filter value\"\n              value={draft.value === '' ? undefined : Number(draft.value)}\n              onChange={(nextValue) => { onPatch({ value: nextValue === undefined ? '' : String(nextValue) }) }}\n            />\n          </>\n        ) : selectedField?.type === 'multi' ? (\n          <>\n            {compact ? null : (\n              <span className={labelClassName} id={valueLabelId}>Value</span>\n            )}\n            {compact ? (\n              <TagsInput\n                aria-label=\"Filter value\"\n                value={draft.value === '' ? [] : draft.value.split(',')}\n                onChange={(nextTags) => { onPatch({ value: nextTags.join(',') }) }}\n              />\n            ) : (\n              <TagsInput\n                aria-labelledby={valueLabelId}\n                value={draft.value === '' ? [] : draft.value.split(',')}\n                onChange={(nextTags) => { onPatch({ value: nextTags.join(',') }) }}\n              />\n            )}\n          </>\n        ) : selectedField?.type === 'range' ? (\n          <>\n            {compact ? null : (\n              <span className={labelClassName} id={valueLabelId}>\n                Value{ draft.value !== '' ? ` (${draft.value})` : '' }\n              </span>\n            )}\n            {compact ? (\n              <Slider\n                aria-label=\"Filter value\"\n                min={selectedField.min ?? 0}\n                max={selectedField.max ?? 100}\n                step={selectedField.step ?? 1}\n                value={parseRangeValue(draft.value, selectedField.min ?? 0, selectedField.max ?? 100)}\n                onValueChange={(nextRange) => {\n                  const lo = nextRange[0] ?? selectedField.min ?? 0\n                  const hi = nextRange[1] ?? selectedField.max ?? 100\n                  onPatch({ value: `${lo}..${hi}` })\n                }}\n              />\n            ) : (\n              <Slider\n                aria-labelledby={valueLabelId}\n                min={selectedField.min ?? 0}\n                max={selectedField.max ?? 100}\n                step={selectedField.step ?? 1}\n                value={parseRangeValue(draft.value, selectedField.min ?? 0, selectedField.max ?? 100)}\n                onValueChange={(nextRange) => {\n                  const lo = nextRange[0] ?? selectedField.min ?? 0\n                  const hi = nextRange[1] ?? selectedField.max ?? 100\n                  onPatch({ value: `${lo}..${hi}` })\n                }}\n              />\n            )}\n          </>\n        ) : (\n          <>\n            {compact ? null : (\n              <label className={labelClassName} htmlFor={valueInputId}>Value</label>\n            )}\n            <Input\n              id={valueInputId}\n              aria-label=\"Filter value\"\n              placeholder={selectedField?.type === 'date' ? 'YYYY-MM-DD' : selectedField?.type === 'person' ? 'Enter name' : 'Enter value'}\n              value={draft.value}\n              onChange={(event) => {\n                const nextValue = event.currentTarget.value\n                onPatch({ value: nextValue })\n              }}\n            />\n          </>\n        )}\n      </div>\n    </>\n  )\n}\n\nfunction FilterBarBuilder({\n  cancelLabel = 'Cancel',\n  className,\n  count,\n  defaultOpen = false,\n  fields,\n  initialRule = null,\n  onApply,\n  onCancel,\n  onOpenChange,\n  open: openProp,\n  operators: operatorsProp,\n  submitLabel = 'Apply',\n  title = 'Add filter',\n  trigger,\n}: FilterBarBuilderProps) {\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen)\n  const open = openProp ?? uncontrolledOpen\n  const [draft, setDraft] = React.useState<FilterBarRuleValue>(initialRule ?? FILTER_BAR_BUILDER_EMPTY_RULE)\n  // Controlled opens bypass handleOpenChange, so re-seed the draft on every\n  // closed \u2192 open transition. This is what makes the spec's \"initialRule is\n  // re-read every time the popup opens\" promise true in both modes.\n  const wasOpenRef = React.useRef(open)\n  React.useEffect(() => {\n    if (open && !wasOpenRef.current) {\n      setDraft(initialRule ?? FILTER_BAR_BUILDER_EMPTY_RULE)\n    }\n    wasOpenRef.current = open\n  }, [open, initialRule])\n  const fieldLabelId = React.useId()\n  const operatorLabelId = React.useId()\n  const valueLabelId = React.useId()\n  const valueInputId = React.useId()\n\n  function handleOpenChange(nextOpen: boolean) {\n    if (nextOpen) {\n      setDraft(initialRule ?? FILTER_BAR_BUILDER_EMPTY_RULE)\n    }\n    if (openProp === undefined) {\n      setUncontrolledOpen(nextOpen)\n    }\n    onOpenChange?.(nextOpen)\n  }\n\n  function close(nextOpen: false) {\n    if (openProp === undefined) {\n      setUncontrolledOpen(nextOpen)\n    }\n    onOpenChange?.(nextOpen)\n  }\n\n  function handleFieldChange(nextField: string) {\n    const nextFieldDef = fields.find((field) => field.value === nextField)\n    const nextOperators = nextFieldDef?.operators ?? operatorsProp ?? [...FILTER_BAR_BUILDER_DEFAULT_OPERATORS]\n    const nextValue = nextFieldDef?.type === 'range'\n      ? `${nextFieldDef.min ?? 0}..${nextFieldDef.max ?? 100}`\n      : ''\n    setDraft({ field: nextField, operator: nextOperators[0] ?? '', value: nextValue })\n  }\n\n  const canApply = draft.field !== '' && draft.operator !== ''\n\n  function handleApply() {\n    if (!canApply) return\n    onApply?.({ ...draft })\n    close(false)\n  }\n\n  function handleCancel() {\n    onCancel?.()\n    close(false)\n  }\n\n  return (\n    <Popover open={open} onOpenChange={handleOpenChange}>\n      {trigger !== null ? (\n        <Popover.Trigger asChild>\n          {trigger ?? (\n            <Button type=\"button\" variant=\"outline\" size=\"sm\">\n              + Add filter\n              {count !== undefined ? (\n                <Badge size=\"sm\" variant=\"primary\" style={{ marginLeft: 'var(--dsx-space-xs)' }}>\n                  {count}\n                </Badge>\n              ) : null}\n            </Button>\n          )}\n        </Popover.Trigger>\n      ) : (\n        <Popover.Anchor asChild>\n          <span aria-hidden=\"true\" className=\"dsx-filter-bar__builder-anchor\" />\n        </Popover.Anchor>\n      )}\n      <Popover.Content className={classNames('dsx-filter-bar__builder', className)} align=\"start\">\n        <Popover.Title>{title}</Popover.Title>\n        <div className=\"dsx-filter-bar__builder-field\">\n          <span className=\"dsx-filter-bar__builder-label\" id={fieldLabelId}>Field</span>\n          <SelectRoot value={draft.field} onValueChange={handleFieldChange}>\n            <SelectTrigger aria-labelledby={fieldLabelId}>\n              <SelectValue placeholder=\"Choose field\" />\n            </SelectTrigger>\n            <SelectContent>\n              {fields.map((field) => (\n                <SelectItem key={field.value} value={field.value}>\n                  {field.label ?? field.value}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </SelectRoot>\n        </div>\n        <FilterBarDraftFields\n          draft={draft}\n          fields={fields}\n          fieldClassName=\"dsx-filter-bar__builder-field\"\n          labelClassName=\"dsx-filter-bar__builder-label\"\n          onPatch={(patch) => { setDraft((prev) => ({ ...prev, ...patch })) }}\n          operators={operatorsProp}\n          operatorLabelId={operatorLabelId}\n          valueInputId={valueInputId}\n          valueLabelId={valueLabelId}\n        />\n        <div className=\"dsx-filter-bar__builder-actions\">\n          <Button type=\"button\" variant=\"ghost\" size=\"sm\" onClick={handleCancel}>\n            {cancelLabel}\n          </Button>\n          <Button type=\"button\" variant=\"primary\" size=\"sm\" onClick={handleApply} disabled={!canApply}>\n            {submitLabel}\n          </Button>\n        </div>\n      </Popover.Content>\n    </Popover>\n  )\n}\nFilterBarBuilder.displayName = 'FilterBarBuilder'\n\ninterface FilterBarConditionEditorProps {\n  fields: FilterBarBuilderField[]\n  draft: FilterBarRuleValue\n  onDraftChange: (next: FilterBarRuleValue) => void\n  operators?: string[]\n  title?: React.ReactNode\n  submitLabel?: React.ReactNode\n  newLabel?: React.ReactNode\n  onApply?: () => void\n  onNew?: () => void\n  className?: string\n}\nfunction FilterBarConditionEditor({\n  className,\n  draft,\n  fields,\n  newLabel = 'New',\n  onApply,\n  onDraftChange,\n  onNew,\n  operators: operatorsProp,\n  submitLabel = 'Apply',\n  title = 'Condition editor',\n}: FilterBarConditionEditorProps) {\n  const operatorLabelId = React.useId()\n  const valueInputId = React.useId()\n  const valueLabelId = React.useId()\n  const canApply = draft.field !== '' && draft.operator !== ''\n  function handleRailField(nextField: string) {\n    const nextFieldDef = fields.find((field) => field.value === nextField)\n    const nextOperators = nextFieldDef?.operators ?? operatorsProp ?? [...FILTER_BAR_BUILDER_DEFAULT_OPERATORS]\n    const nextValue = nextFieldDef?.type === 'range'\n      ? `${nextFieldDef.min ?? 0}..${nextFieldDef.max ?? 100}`\n      : ''\n    onDraftChange({ field: nextField, operator: nextOperators[0] ?? '', value: nextValue })\n  }\n  return (\n    <div\n      className={classNames('dsx-filter-bar__condition-editor', className)}\n      role=\"group\"\n      aria-label={typeof title === 'string' ? title : 'Condition editor'}\n    >\n      <span className=\"dsx-filter-bar__condition-editor-title\">{title}</span>\n      <div className=\"dsx-filter-bar__condition-editor-body\">\n        <div className=\"dsx-filter-bar__condition-editor-fields\" role=\"group\" aria-label=\"Fields\">\n          {fields.map((field) => (\n            <Button\n              key={field.value}\n              type=\"button\"\n              variant={draft.field === field.value ? 'primary' : 'outline'}\n              size=\"sm\"\n              aria-pressed={draft.field === field.value}\n              onClick={() => { handleRailField(field.value) }}\n            >\n              {field.label ?? field.value}\n            </Button>\n          ))}\n        </div>\n        <div className=\"dsx-filter-bar__condition-editor-config\">\n          <FilterBarDraftFields\n            draft={draft}\n            fields={fields}\n            fieldClassName=\"dsx-filter-bar__condition-editor-field\"\n            labelClassName=\"dsx-filter-bar__condition-editor-label\"\n            onPatch={(patch) => { onDraftChange({ ...draft, ...patch }) }}\n            operators={operatorsProp}\n            operatorLabelId={operatorLabelId}\n            valueInputId={valueInputId}\n            valueLabelId={valueLabelId}\n          />\n        </div>\n      </div>\n      <div className=\"dsx-filter-bar__condition-editor-actions\">\n        <Button type=\"button\" variant=\"primary\" size=\"sm\" onClick={onApply} disabled={!canApply}>\n          {submitLabel}\n        </Button>\n        {onNew !== undefined ? (\n          <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={onNew}>\n            {newLabel}\n          </Button>\n        ) : null}\n      </div>\n    </div>\n  )\n}\nFilterBarConditionEditor.displayName = 'FilterBarConditionEditor'\n\ntype FilterBarCombinator = 'and' | 'or'\n\ninterface FilterBarConditionGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  combinator?: FilterBarCombinator\n  onCombinatorChange?: (next: FilterBarCombinator) => void\n  combinatorLabel?: string\n  onAddCondition?: () => void\n  onAddSubgroup?: () => void\n  onClearAll?: () => void\n  addConditionLabel?: React.ReactNode\n  addSubgroupLabel?: React.ReactNode\n  clearAllLabel?: React.ReactNode\n  emptyHint?: React.ReactNode\n  editor?: React.ReactNode\n  rowsLabel?: React.ReactNode\n  allLabel?: React.ReactNode\n  anyLabel?: React.ReactNode\n  gapCombinators?: FilterBarCombinator[]\n  onGapCombinatorChange?: (index: number, next: FilterBarCombinator) => void\n}\nconst FILTER_BAR_COMBINATORS: FilterBarCombinator[] = ['and', 'or']\nconst FilterBarConditionGroup = React.forwardRef<HTMLDivElement, FilterBarConditionGroupProps>(\n  (\n    {\n      addConditionLabel = 'Add condition',\n      addSubgroupLabel = 'Add subgroup',\n      allLabel = null,\n      anyLabel = null,\n      children,\n      className,\n      clearAllLabel = 'Clear all',\n      combinator = 'and',\n      combinatorLabel = 'Match',\n      editor = null,\n      emptyHint = 'No conditions yet \u2014 add one below.',\n      rowsLabel = null,\n      gapCombinators,\n      onGapCombinatorChange,\n      onAddCondition,\n      onAddSubgroup,\n      onClearAll,\n      onCombinatorChange,\n      ...props\n    },\n    forwardedRef,\n  ) => (\n    <div\n      {...props}\n      ref={forwardedRef}\n      role={props['aria-label'] !== undefined ? 'group' : undefined}\n      className={classNames('dsx-filter-bar__condition-group', className)}\n      data-empty={React.Children.count(children) === 0 ? 'true' : undefined}\n    >\n      {onCombinatorChange !== undefined && gapCombinators === undefined ? (\n        <>\n          {allLabel !== null || anyLabel !== null ? (\n            <span className=\"dsx-filter-bar__condition-match-label\">\n              {combinator === 'and' ? (allLabel ?? 'Match all') : (anyLabel ?? 'Match any')}\n            </span>\n          ) : null}\n          <div className=\"dsx-filter-bar__condition-combinator\" role=\"group\" aria-label={combinatorLabel}>\n          {FILTER_BAR_COMBINATORS.map((option) => (\n            <Button\n              key={option}\n              type=\"button\"\n              size=\"sm\"\n              variant={combinator === option ? 'primary' : 'ghost'}\n              aria-pressed={combinator === option}\n              onClick={() => { onCombinatorChange(option) }}\n            >\n              {option === 'and' ? 'AND' : 'OR'}\n            </Button>\n          ))}\n          </div>\n        </>\n      ) : (\n        <>\n          {allLabel !== null || anyLabel !== null ? (\n            <span className=\"dsx-filter-bar__condition-match-label\">\n              {combinator === 'and' ? (allLabel ?? 'Match all') : (anyLabel ?? 'Match any')}\n            </span>\n          ) : null}\n          <span className=\"dsx-filter-bar__condition-combinator-label\">{combinator === 'and' ? 'AND' : 'OR'}</span>\n        </>\n      )}\n      {editor}\n      {rowsLabel !== null ? (\n        <span className=\"dsx-filter-bar__condition-rows-label\">{rowsLabel}</span>\n      ) : null}\n      <div className=\"dsx-filter-bar__condition-children\">\n        {React.Children.count(children) === 0 ? (\n          <span className=\"dsx-filter-bar__condition-empty\">{emptyHint}</span>\n        ) : gapCombinators !== undefined && onGapCombinatorChange !== undefined ? (\n          React.Children.toArray(children).map((child, index) => {\n            const key = React.isValidElement(child) && child.key !== null ? child.key : index\n            const gap = gapCombinators[index] ?? 'and'\n            return (\n              <React.Fragment key={key}>\n                {index > 0 ? (\n                  <div className=\"dsx-filter-bar__condition-gap\" role=\"group\" aria-label={`Logic before item ${index + 1}`}>\n                    {FILTER_BAR_COMBINATORS.map((option) => (\n                      <Button\n                        key={option}\n                        type=\"button\"\n                        size=\"sm\"\n                        variant={gap === option ? 'primary' : 'ghost'}\n                        aria-pressed={gap === option}\n                        onClick={() => { onGapCombinatorChange(index, option) }}\n                      >\n                        {option === 'and' ? 'And' : 'Or'}\n                      </Button>\n                    ))}\n                  </div>\n                ) : null}\n                {child}\n              </React.Fragment>\n            )\n          })\n        ) : children}\n      </div>\n      {onAddCondition !== undefined || onAddSubgroup !== undefined || onClearAll !== undefined ? (\n        <div className=\"dsx-filter-bar__condition-actions\">\n          {onAddCondition !== undefined ? (\n            <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={onAddCondition}>\n              {addConditionLabel}\n            </Button>\n          ) : null}\n          {onAddSubgroup !== undefined ? (\n            <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={onAddSubgroup}>\n              {addSubgroupLabel}\n            </Button>\n          ) : null}\n          {onClearAll !== undefined ? (\n            <Button type=\"button\" variant=\"ghost\" size=\"sm\" onClick={onClearAll}>\n              {clearAllLabel}\n            </Button>\n          ) : null}\n        </div>\n      ) : null}\n    </div>\n  ),\n)\nFilterBarConditionGroup.displayName = 'FilterBarConditionGroup'\n\ninterface FilterBarConditionProps extends React.HTMLAttributes<HTMLDivElement> {\n  field: React.ReactNode\n  operator: React.ReactNode\n  value: React.ReactNode\n  count?: React.ReactNode\n  onEdit?: () => void\n  onRemove?: () => void\n  removeLabel?: string\n  dragProps?: React.HTMLAttributes<HTMLDivElement>\n  editLabel?: string\n  fields?: FilterBarBuilderField[]\n  operators?: string[]\n  onFieldChange?: (nextField: string) => void\n  onOperatorChange?: (nextOperator: string) => void\n  onValueChange?: (nextValue: string) => void\n}\ninterface FilterBarEditableRowProps {\n  fields: FilterBarBuilderField[]\n  field: string\n  operator: string\n  value: string\n  operators?: string[]\n  onFieldChange?: (nextField: string) => void\n  onOperatorChange?: (nextOperator: string) => void\n  onValueChange?: (nextValue: string) => void\n}\nfunction FilterBarEditableRow({\n  field,\n  fields,\n  onFieldChange,\n  onOperatorChange,\n  onValueChange,\n  operator,\n  operators,\n  value,\n}: FilterBarEditableRowProps) {\n  const operatorLabelId = React.useId()\n  const valueInputId = React.useId()\n  const valueLabelId = React.useId()\n  return (\n    <>\n      <div className=\"dsx-filter-bar__condition-field\">\n        <SelectRoot value={field} onValueChange={(nextField) => { onFieldChange?.(nextField) }}>\n          <SelectTrigger aria-label=\"Field\">\n            <SelectValue placeholder=\"Choose field\" />\n          </SelectTrigger>\n          <SelectContent>\n            {fields.map((option) => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label ?? option.value}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </SelectRoot>\n      </div>\n      <FilterBarDraftFields\n        compact\n        draft={{ field, operator, value }}\n        fields={fields}\n        fieldClassName=\"dsx-filter-bar__condition-operator\"\n        valueClassName=\"dsx-filter-bar__condition-value\"\n        labelClassName=\"dsx-filter-bar__condition-operator\"\n        onPatch={(patch) => {\n          if (patch.operator !== undefined) onOperatorChange?.(patch.operator)\n          if (patch.value !== undefined) onValueChange?.(patch.value)\n        }}\n        operators={operators}\n        operatorLabelId={operatorLabelId}\n        valueInputId={valueInputId}\n        valueLabelId={valueLabelId}\n      />\n    </>\n  )\n}\nconst FilterBarCondition = React.forwardRef<HTMLDivElement, FilterBarConditionProps>(\n  (\n    {\n      children,\n      className,\n      count,\n      dragProps,\n      editLabel,\n      field,\n      fields,\n      onEdit,\n      onFieldChange,\n      onOperatorChange,\n      onRemove,\n      onValueChange,\n      operator,\n      operators,\n      removeLabel = 'Remove condition',\n      value,\n      ...props\n    },\n    forwardedRef,\n  ) => (\n    <div {...props} {...dragProps} ref={forwardedRef} className={classNames('dsx-filter-bar__condition', className)}>\n      {dragProps !== undefined ? (\n        <span aria-hidden=\"true\" className=\"dsx-filter-bar__condition-grip\">\n          <Icon name=\"grip-vertical\" size=\"sm\" />\n        </span>\n      ) : null}\n      {fields !== undefined ? (\n        <FilterBarEditableRow\n          fields={fields}\n          field={String(field)}\n          operator={String(operator)}\n          value={typeof value === 'string' ? value : ''}\n          operators={operators}\n          onFieldChange={onFieldChange}\n          onOperatorChange={onOperatorChange}\n          onValueChange={onValueChange}\n        />\n      ) : null}\n      {fields === undefined && onEdit !== undefined ? (\n        <button\n          type=\"button\"\n          className=\"dsx-filter-bar__condition-label\"\n          onClick={onEdit}\n          aria-label={editLabel ?? describeRuleEditLabel(field, operator, value)}\n        >\n          <span className=\"dsx-filter-bar__rule-field\">{field}</span>\n          <span className=\"dsx-filter-bar__rule-operator\">{operator}</span>\n          {value === '' ? (\n            <span className=\"dsx-filter-bar__rule-value\" data-empty=\"true\">empty</span>\n          ) : (\n            <span className=\"dsx-filter-bar__rule-value\">{value}</span>\n          )}\n          {count !== undefined ? <span className=\"dsx-filter-bar__rule-count\">{count}</span> : null}\n        </button>\n      ) : fields === undefined ? (\n        <span className=\"dsx-filter-bar__condition-label\" aria-hidden={false}>\n          <span className=\"dsx-filter-bar__rule-field\">{field}</span>\n          <span className=\"dsx-filter-bar__rule-operator\">{operator}</span>\n          {value === '' ? (\n            <span className=\"dsx-filter-bar__rule-value\" data-empty=\"true\">empty</span>\n          ) : (\n            <span className=\"dsx-filter-bar__rule-value\">{value}</span>\n          )}\n          {count !== undefined ? <span className=\"dsx-filter-bar__rule-count\">{count}</span> : null}\n        </span>\n      ) : null}\n      {onRemove !== undefined ? (\n        <IconButton type=\"button\" size=\"sm\" variant=\"ghost\" aria-label={removeLabel} onClick={onRemove}>\n          <Icon name=\"trash\" size=\"sm\" />\n        </IconButton>\n      ) : null}\n      {children}\n    </div>\n  ),\n)\nFilterBarCondition.displayName = 'FilterBarCondition'\n\nconst FilterBar: typeof FilterBarRoot & {\n  Group: typeof FilterBarGroup\n  Summary: typeof FilterBarSummary\n  Actions: typeof FilterBarActions\n  Clear: typeof FilterBarClear\n  Control: typeof FilterBarControl\n  Count: typeof FilterBarCount\n  Search: typeof FilterBarSearch\n  Rules: typeof FilterBarRules\n  Rule: typeof FilterBarRule\n  ConditionGroup: typeof FilterBarConditionGroup\n  Condition: typeof FilterBarCondition\n  ConditionEditor: typeof FilterBarConditionEditor\n  Builder: typeof FilterBarBuilder\n} = Object.assign(FilterBarRoot, {\n  Group: FilterBarGroup,\n  Summary: FilterBarSummary,\n  Actions: FilterBarActions,\n  Clear: FilterBarClear,\n  Control: FilterBarControl,\n  Count: FilterBarCount,\n  Search: FilterBarSearch,\n  Rules: FilterBarRules,\n  Rule: FilterBarRule,\n  ConditionGroup: FilterBarConditionGroup,\n  Condition: FilterBarCondition,\n  ConditionEditor: FilterBarConditionEditor,\n  Builder: FilterBarBuilder,\n})\n\nexport { FilterBar, FilterBarActions, FilterBarBuilder, FilterBarClear, FilterBarCondition, FilterBarConditionEditor, FilterBarConditionGroup, FilterBarControl, FilterBarCount, FilterBarGroup, FilterBarRoot, FilterBarRule, FilterBarRules, FilterBarSearch, FilterBarSummary }\nexport type { FilterBarBuilderField, FilterBarBuilderOption, FilterBarBuilderProps, FilterBarClearProps, FilterBarCombinator, FilterBarConditionEditorProps, FilterBarConditionGroupProps, FilterBarConditionProps, FilterBarProps, FilterBarRuleProps, FilterBarRuleValue, FilterBarRulesProps, FilterBarSearchProps }\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/components/floating-panel.css

@@ -4,6 +4,8 @@
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
+  max-width: calc(100vw - var(--dsx-space-xl));
+  max-height: calc(100dvh - var(--dsx-space-xl));
   border-radius: var(--dsx-rounded-xl);
   border: var(--dsx-border-width-sm) solid var(--dsx-panel-border-color);
   background: var(--dsx-color-panel-translucent);
@@ -15,7 +17,7 @@
 }
 
 .dsx-floating-panel[data-dragging] {
-  box-shadow: var(--dsx-shadow-elevation-4);
+  box-shadow: var(--dsx-shadow-elevation-5); /* Spotlight while lifted (B4 Q3) */
   cursor: grabbing;
 }
 
@@ -24,6 +26,11 @@
   align-items: center;
   gap: var(--dsx-space-sm);
   padding: var(--dsx-space-sm) var(--dsx-space-md);
+  padding-right: var(--dsx-space-2xl);
+  flex-shrink: 0;
+  min-height: var(--dsx-size-xl);
+  box-sizing: border-box;
+  touch-action: none;
   border-bottom: var(--dsx-border-width-sm) solid var(--dsx-color-outline-variant);
   background: var(--dsx-color-surface-raised);
   cursor: grab;
@@ -36,8 +43,8 @@
 
 .dsx-floating-panel__close {
   position: absolute;
-  top: var(--dsx-space-xs);
-  right: var(--dsx-space-xs);
+  top: var(--dsx-space-sm);
+  right: var(--dsx-space-sm);
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -54,18 +61,31 @@
               background var(--dsx-motion-duration-fast) var(--dsx-motion-easing-in-out);
 }
 
-.dsx-floating-panel__close:hover {
+.dsx-floating-panel__close:hover,
+.dsx-floating-panel__close:active {
   background: var(--dsx-effect-hover-layer);
   color: var(--dsx-color-on-surface);
 }
 
+.dsx-floating-panel__header:focus-visible,
+.dsx-floating-panel__handle:focus-visible,
+.dsx-floating-panel__close:focus-visible {
+  outline: none;
+  box-shadow: inset var(--dsx-shadow-focus-ring);
+}
+
 .dsx-floating-panel__content {
   flex: 1;
+  min-height: 0;
   overflow: auto;
   padding: var(--dsx-space-md);
 }
 
 .dsx-floating-panel__handle {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--dsx-color-on-surface-variant);
   position: absolute;
   bottom: 0;
   right: 0;
@@ -73,37 +93,43 @@
   height: var(--dsx-space-lg);
   cursor: nwse-resize;
   z-index: var(--dsx-z-index-elevated);
+  touch-action: none;
+}
+
+.dsx-floating-panel__handle--se {
+  cursor: nwse-resize;
 }
 
-.dsx-floating-panel__handle::before {
+.dsx-floating-panel__resize-grip::before,
+.dsx-floating-panel__resize-grip::after {
   content: '';
   position: absolute;
-  bottom: var(--dsx-space-xs);
   right: var(--dsx-space-xs);
-  width: var(--dsx-space-sm);
-  height: var(--dsx-space-sm);
-  border-right: var(--dsx-border-width-md) solid var(--dsx-color-on-surface-variant);
-  border-bottom: var(--dsx-border-width-md) solid var(--dsx-color-on-surface-variant);
-  border-radius: 0 0 var(--dsx-rounded-sm) 0;
-  opacity: var(--dsx-opacity-muted);
-  transition: opacity var(--dsx-motion-duration-fast, 150ms) var(--dsx-motion-easing-standard, ease);
+  height: var(--dsx-border-width-sm);
+  background: currentColor;
+  transform: rotate(-45deg);
+  transform-origin: right bottom;
 }
 
-.dsx-floating-panel__handle:hover::before {
-  opacity: 1;
+.dsx-floating-panel__resize-grip::before {
+  width: var(--dsx-space-sm);
+  bottom: var(--dsx-space-sm);
 }
 
-.dsx-floating-panel__handle--se {
-  cursor: nwse-resize;
+.dsx-floating-panel__resize-grip::after {
+  width: var(--dsx-space-xs);
+  bottom: var(--dsx-space-xs);
 }
 
+.dsx-floating-panel__handle--s .dsx-icon { transform: rotate(90deg); }
+
 .dsx-floating-panel__handle--s {
   cursor: ns-resize;
   bottom: 0;
   right: 50%;
   transform: translateX(50%);
   width: var(--dsx-space-xl);
-  height: var(--dsx-space-sm);
+  height: var(--dsx-size-md);
 }
 
 .dsx-floating-panel__handle--e {
@@ -111,6 +137,11 @@
   right: 0;
   bottom: 50%;
   transform: translateY(50%);
-  width: var(--dsx-space-sm);
+  width: var(--dsx-size-md);
   height: var(--dsx-space-xl);
 }
+
+@media (prefers-reduced-motion: reduce) {
+  .dsx-floating-panel,
+  .dsx-floating-panel__close { transition: none; }
+}

package/dist/components/floatingPanel/FloatingPanel.cjs

@@ -39,6 +39,7 @@ var React = __toESM(require("react"), 1);
 var import_classnames = __toESM(require("classnames"), 1);
 var import_react_slot = require("@radix-ui/react-slot");
 var import_lucide_react = require("lucide-react");
+var import_Icon = require("../icon/Icon");
 var import_extractProps = require("../../_internal/helpers/extractProps");
 var import_floatingPanel = require("./floatingPanel.props");
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -51,86 +52,166 @@ const FloatingPanel = React.forwardRef(
   ({ children, defaultPosition = { x: 0, y: 0 }, defaultSize, onDragEnd, onResize, onClose, ...props }, forwardedRef) => {
     const { asChild, className, size: componentSize = "md", ...panelProps } = (0, import_extractProps.extractProps)(props, import_floatingPanel.floatingPanelPropDefs);
     const Comp = asChild ? import_react_slot.Slot : "div";
+    const panelRef = React.useRef(null);
+    const composedRef = React.useCallback((node) => {
+      panelRef.current = node;
+      if (typeof forwardedRef === "function") forwardedRef(node);
+      else if (forwardedRef) forwardedRef.current = node;
+    }, [forwardedRef]);
     const [open, setOpen] = React.useState(true);
     const [position, setPosition] = React.useState(defaultPosition);
     const [size, setSize] = React.useState(defaultSize ?? FLOATING_PANEL_SIZE_DEFAULTS[componentSize]);
-    const [isDragging, setIsDragging] = React.useState(false);
-    const dragOffset = React.useRef({ x: 0, y: 0 });
-    const handleMouseDown = React.useCallback(
-      (e) => {
-        if (e.target.closest("[data-floating-panel-handle]")) return;
-        setIsDragging(true);
-        dragOffset.current = {
-          x: e.clientX - position.x,
-          y: e.clientY - position.y
-        };
-      },
-      [position]
-    );
+    const positionRef = React.useRef(position);
+    const sizeRef = React.useRef(size);
+    const [interaction, setInteraction] = React.useState(null);
+    const gesture = React.useRef(null);
+    const bounds = React.useCallback(() => {
+      const panel = panelRef.current;
+      const parent = panel && getComputedStyle(panel).position !== "fixed" ? panel.offsetParent : null;
+      return {
+        width: parent?.clientWidth || Math.min(
+          document.documentElement.clientWidth || window.innerWidth,
+          document.documentElement.getBoundingClientRect().width || window.innerWidth
+        ),
+        height: parent?.clientHeight || window.innerHeight
+      };
+    }, []);
+    const applySize = React.useCallback((next) => {
+      const available = bounds();
+      const style = panelRef.current ? getComputedStyle(panelRef.current) : null;
+      const maxWidth = Math.min(available.width, parseFloat(style?.maxWidth ?? "") || available.width);
+      const maxHeight = Math.min(available.height, parseFloat(style?.maxHeight ?? "") || available.height);
+      const value = {
+        width: Math.min(maxWidth, available.width - positionRef.current.x, Math.max(150, next.width)),
+        height: Math.min(maxHeight, available.height - positionRef.current.y, Math.max(100, next.height))
+      };
+      value.width = Math.max(0, value.width);
+      value.height = Math.max(0, value.height);
+      sizeRef.current = value;
+      setSize(value);
+      return value;
+    }, [bounds]);
+    const applyPosition = React.useCallback((next) => {
+      const available = bounds();
+      const rect = panelRef.current?.getBoundingClientRect();
+      const value = {
+        x: Math.max(0, Math.min(next.x, available.width - (rect?.width || sizeRef.current.width))),
+        y: Math.max(0, Math.min(next.y, available.height - (rect?.height || sizeRef.current.height)))
+      };
+      positionRef.current = value;
+      setPosition(value);
+      return value;
+    }, [bounds]);
     const handleClose = React.useCallback(() => {
+      gesture.current = null;
+      setInteraction(null);
       setOpen(false);
       onClose?.();
     }, [onClose]);
+    const startInteraction = React.useCallback((e, family) => {
+      if (e.defaultPrevented || e.button !== 0 || gesture.current) return;
+      const target = e.target;
+      const handle = target.closest(".dsx-floating-panel__handle");
+      const header = target.closest("[data-floating-panel-handle]");
+      if (!handle && (target.closest('button, a, input, textarea, select, [contenteditable="true"]') || !header && panelRef.current?.querySelector("[data-floating-panel-handle]"))) return;
+      e.preventDefault();
+      const kind = handle ? "resize" : "drag";
+      const direction = handle?.classList.contains("dsx-floating-panel__handle--s") ? "s" : handle?.classList.contains("dsx-floating-panel__handle--e") ? "e" : "se";
+      gesture.current = {
+        kind,
+        family,
+        direction,
+        pointerId: "pointerId" in e ? e.pointerId : void 0,
+        startX: e.clientX,
+        startY: e.clientY,
+        position: positionRef.current,
+        size: sizeRef.current
+      };
+      const focusTarget = handle ?? header;
+      focusTarget?.focus();
+      setInteraction(kind);
+    }, []);
+    React.useEffect(() => {
+      if (!open) return;
+      const fit = () => {
+        applyPosition(positionRef.current);
+        applySize(sizeRef.current);
+      };
+      fit();
+      window.addEventListener("resize", fit);
+      return () => window.removeEventListener("resize", fit);
+    }, [open, applyPosition, applySize]);
     React.useEffect(() => {
       if (!open) return;
       const handleKeyDown = (e) => {
-        if (e.key === "Escape") handleClose();
+        if (e.key !== "Escape" || e.defaultPrevented) return;
+        const panels = Array.from(document.querySelectorAll(".dsx-floating-panel"));
+        const focused = panels.find((panel) => panel.contains(document.activeElement));
+        if ((focused ?? panels[panels.length - 1]) !== panelRef.current) return;
+        e.preventDefault();
+        handleClose();
       };
       document.addEventListener("keydown", handleKeyDown);
       return () => document.removeEventListener("keydown", handleKeyDown);
     }, [open, handleClose]);
     React.useEffect(() => {
-      if (!isDragging) return;
-      const handleMouseMove = (e) => {
-        const newPosition = {
-          x: e.clientX - dragOffset.current.x,
-          y: e.clientY - dragOffset.current.y
-        };
-        setPosition(newPosition);
+      if (!interaction) return;
+      const active = gesture.current;
+      const move = (e) => {
+        if ("pointerId" in e && e.pointerId !== active.pointerId) return;
+        const dx = e.clientX - active.startX;
+        const dy = e.clientY - active.startY;
+        if (active.kind === "drag") applyPosition({ x: active.position.x + dx, y: active.position.y + dy });
+        else applySize({
+          width: active.size.width + (active.direction.includes("e") ? dx : 0),
+          height: active.size.height + (active.direction.includes("s") ? dy : 0)
+        });
       };
-      const handleMouseUp = () => {
-        setIsDragging(false);
-        onDragEnd?.(position);
+      const finish = (e) => {
+        if ("pointerId" in e && e.pointerId !== active.pointerId) return;
+        gesture.current = null;
+        setInteraction(null);
+        if (e.type === "pointercancel") {
+          applyPosition(active.position);
+          applySize(active.size);
+        } else if (active.kind === "drag") onDragEnd?.(positionRef.current);
+        else onResize?.(sizeRef.current);
       };
-      document.addEventListener("mousemove", handleMouseMove);
-      document.addEventListener("mouseup", handleMouseUp);
+      const moveEvent = active.family === "pointer" ? "pointermove" : "mousemove";
+      const endEvent = active.family === "pointer" ? "pointerup" : "mouseup";
+      document.addEventListener(moveEvent, move);
+      document.addEventListener(endEvent, finish);
+      document.addEventListener("pointercancel", finish);
       return () => {
-        document.removeEventListener("mousemove", handleMouseMove);
-        document.removeEventListener("mouseup", handleMouseUp);
+        document.removeEventListener(moveEvent, move);
+        document.removeEventListener(endEvent, finish);
+        document.removeEventListener("pointercancel", finish);
       };
-    }, [isDragging, onDragEnd, position]);
-    const handleResize = React.useCallback(
-      (direction, e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        const startX = e.clientX;
-        const startY = e.clientY;
-        const startWidth = size.width;
-        const startHeight = size.height;
-        const handleMouseMove = (moveEvent) => {
-          const newWidth = direction.includes("e") ? Math.max(150, startWidth + (moveEvent.clientX - startX)) : startWidth;
-          const newHeight = direction.includes("s") ? Math.max(100, startHeight + (moveEvent.clientY - startY)) : startHeight;
-          setSize({ width: newWidth, height: newHeight });
-        };
-        const handleMouseUp = () => {
-          document.removeEventListener("mousemove", handleMouseMove);
-          document.removeEventListener("mouseup", handleMouseUp);
-          onResize?.(size);
-        };
-        document.addEventListener("mousemove", handleMouseMove);
-        document.addEventListener("mouseup", handleMouseUp);
-      },
-      [size, onResize]
-    );
+    }, [interaction, applyPosition, applySize, onDragEnd, onResize]);
+    const handleKeyboard = (e) => {
+      panelProps.onKeyDown?.(e);
+      if (e.defaultPrevented) return;
+      const target = e.target;
+      if (target !== target.closest("[data-floating-panel-handle], .dsx-floating-panel__handle")) return;
+      const delta = { ArrowLeft: [-1, 0], ArrowRight: [1, 0], ArrowUp: [0, -1], ArrowDown: [0, 1] }[e.key];
+      if (!delta) return;
+      e.preventDefault();
+      const step = e.shiftKey ? 40 : 8;
+      if (target.matches(".dsx-floating-panel__handle")) {
+        const horizontal = !target.classList.contains("dsx-floating-panel__handle--s");
+        const vertical = !target.classList.contains("dsx-floating-panel__handle--e");
+        onResize?.(applySize({ width: sizeRef.current.width + (horizontal ? delta[0] * step : 0), height: sizeRef.current.height + (vertical ? delta[1] * step : 0) }));
+      } else onDragEnd?.(applyPosition({ x: positionRef.current.x + delta[0] * step, y: positionRef.current.y + delta[1] * step }));
+    };
     if (!open) return null;
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       Comp,
       {
         ...panelProps,
-        ref: forwardedRef,
+        ref: composedRef,
         className: (0, import_classnames.default)("dsx-floating-panel", className),
         "data-size": componentSize,
-        "data-dragging": isDragging || void 0,
+        "data-dragging": interaction === "drag" || void 0,
         style: {
           position: "fixed",
           left: position.x,
@@ -139,7 +220,15 @@ const FloatingPanel = React.forwardRef(
           height: size.height,
           ...panelProps.style
         },
-        onMouseDown: handleMouseDown,
+        onPointerDown: (e) => {
+          panelProps.onPointerDown?.(e);
+          startInteraction(e, "pointer");
+        },
+        onMouseDown: (e) => {
+          panelProps.onMouseDown?.(e);
+          startInteraction(e, "mouse");
+        },
+        onKeyDown: handleKeyboard,
         children: asChild ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
           children,
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -153,7 +242,7 @@ const FloatingPanel = React.forwardRef(
               children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.X, { size: 16 })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FloatingPanelHandle, { direction: "se", onResize: handleResize })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FloatingPanelHandle, { direction: "se" })
         ] })
       }
     );
@@ -171,6 +260,10 @@ const FloatingPanelHeader = React.forwardRef(
         ref: forwardedRef,
         className: (0, import_classnames.default)("dsx-floating-panel__header", className),
         "data-floating-panel-handle": true,
+        tabIndex: headerProps.tabIndex ?? 0,
+        role: headerProps.role ?? "group",
+        "aria-label": headerProps["aria-label"] ?? "Move panel",
+        title: headerProps.title ?? "Move with arrow keys; hold Shift for larger steps",
         children
       }
     );
@@ -194,7 +287,7 @@ const FloatingPanelContent = React.forwardRef(
 );
 FloatingPanelContent.displayName = "FloatingPanelContent";
 const FloatingPanelHandle = React.forwardRef(
-  ({ direction = "se", onResize, ...props }, forwardedRef) => {
+  ({ direction = "se", onResize, children, ...props }, forwardedRef) => {
     const { asChild, className, ...handleProps } = (0, import_extractProps.extractProps)(props, import_floatingPanel.floatingPanelHandlePropDefs);
     const Comp = asChild ? import_react_slot.Slot : "div";
     const handleMouseDown = React.useCallback(
@@ -213,7 +306,12 @@ const FloatingPanelHandle = React.forwardRef(
           `dsx-floating-panel__handle--${direction}`,
           className
         ),
-        onMouseDown: handleMouseDown
+        tabIndex: handleProps.tabIndex ?? 0,
+        role: handleProps.role ?? "group",
+        "aria-label": handleProps["aria-label"] ?? "Resize panel",
+        title: handleProps.title ?? "Resize with arrow keys; hold Shift for larger steps",
+        onMouseDown: handleMouseDown,
+        children: children ?? (direction === "se" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dsx-floating-panel__resize-grip", "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Icon.Icon, { name: "grip-vertical", size: "sm", "aria-hidden": "true" }))
       }
     );
   }