@spark-ui/components 16.2.3 → 17.0.1-beta.0

package/dist/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n  const validChildren = Children.toArray(children).filter(isValidElement)\n\n  return validChildren.find(child => {\n    return getElementDisplayName(child)?.includes(name)\n  })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n  return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n  Children.forEach(children, child => {\n    if (!isValidElement(child)) return\n\n    if (\n      getElementDisplayName(child) === 'Select.Item' ||\n      getElementDisplayName(child) === 'Select.Placeholder'\n    ) {\n      const childProps = child.props as ItemProps\n      result.push({\n        value: childProps.value,\n        disabled: !!childProps.disabled,\n        text: childProps.children,\n      })\n    }\n\n    if ((child.props as { children: ReactNode }).children) {\n      getOrderedItems((child.props as { children: ReactNode }).children, result)\n    }\n  })\n\n  return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n  const newMap: ItemsMap = new Map()\n\n  getOrderedItems(children).forEach(itemData => {\n    newMap.set(itemData.value, itemData)\n  })\n\n  return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n  createContext,\n  Dispatch,\n  PropsWithChildren,\n  ReactElement,\n  SetStateAction,\n  useContext,\n  useEffect,\n  useId,\n  useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n  itemsMap: ItemsMap\n  disabled: boolean\n  readOnly: boolean\n  state?: 'error' | 'alert' | 'success'\n  itemsComponent: ReactElement | undefined\n  selectedItem: SelectItem | undefined\n  setValue: (value: string) => void\n  isControlled: boolean\n  onValueChange?: (value: string) => void\n  ariaLabel: string | undefined\n  setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n  fieldId: string\n  fieldLabelId: string | undefined\n  name: string | undefined\n  required: boolean\n  placeholder: string | undefined\n  setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n  /**\n   * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n   */\n  state?: 'error' | 'alert' | 'success'\n  /**\n   * When true, prevents the user from interacting with the select.\n   */\n  disabled?: boolean\n  /**\n   * Sets the select as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n   */\n  defaultValue?: string\n  /**\n   * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n   */\n  value?: string\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: string) => void\n\n  itemsComponent: ReactElement | undefined\n  /**\n   * This attribute is used to specify the name of the control.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n   */\n  required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n  children,\n  defaultValue,\n  value: valueProp,\n  onValueChange,\n  disabled: disabledProp = false,\n  readOnly: readOnlyProp = false,\n  state: stateProp,\n  itemsComponent,\n  name: nameProp,\n  required: requiredProp,\n}: SelectContextProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n  const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n  const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n  const [ariaLabel, setAriaLabel] = useState<string>()\n\n  // Computed state\n  const firstItem = itemsMap.entries().next()?.value?.[1]\n  const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n  const isControlled = valueProp != null\n\n  // Derivated from FormField context\n  const field = useFormFieldControl()\n  const state = field.state || stateProp\n\n  const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n  const fieldId = field.id || internalFieldID\n  const fieldLabelId = field.labelId\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n  const required = !!(field.isRequired ?? requiredProp)\n\n  /**\n   * Indices in a Map are set when an element is added to the Map.\n   * If for some reason, in the Select:\n   * - items order changes\n   * - items are added\n   * - items are removed\n   *\n   * The Map must be rebuilt from the new children in order to preserve logical indices.\n   *\n   */\n  useEffect(() => {\n    const newMap = getItemsFromChildren(itemsComponent)\n\n    const previousItems = [...itemsMap.values()]\n    const newItems = [...newMap.values()]\n\n    const hasItemsChanges =\n      previousItems.length !== newItems.length ||\n      previousItems.some((item, index) => {\n        const hasUpdatedValue = item.value !== newItems[index]?.value\n        const hasUpdatedText = item.text !== newItems[index]?.text\n\n        return hasUpdatedValue || hasUpdatedText\n      })\n\n    if (hasItemsChanges) {\n      setItemsMap(newMap)\n    }\n  }, [children])\n\n  return (\n    <SelectContext.Provider\n      value={{\n        disabled,\n        readOnly,\n        itemsMap,\n        state,\n        itemsComponent,\n        selectedItem,\n        setValue,\n        isControlled,\n        onValueChange,\n        ariaLabel,\n        setAriaLabel,\n        fieldId,\n        fieldLabelId,\n        name,\n        required,\n        placeholder,\n        setPlaceholder,\n      }}\n    >\n      {children}\n    </SelectContext.Provider>\n  )\n}\n\nexport const useSelectContext = () => {\n  const context = useContext(SelectContext)\n\n  if (!context) {\n    throw Error('useSelectContext must be used within a Select provider')\n  }\n\n  return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n  const finder = findElement(children)\n  const trigger = finder('Trigger')\n  const items = finder('Items')\n\n  return (\n    <SelectProvider {...props} itemsComponent={items}>\n      {trigger}\n    </SelectProvider>\n  )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n  groupLabel: string\n  setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n  const [groupLabel, setGroupLabel] = useState('')\n\n  return (\n    <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n      {children}\n    </SelectGroupContext.Provider>\n  )\n}\n\nexport const useSelectGroupContext = () => {\n  const context = useContext(SelectGroupContext)\n\n  if (!context) {\n    throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n  return (\n    <SelectGroupProvider>\n      <GroupContent ref={forwardedRef} {...props}>\n        {children}\n      </GroupContent>\n    </SelectGroupProvider>\n  )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n  const { groupLabel } = useSelectGroupContext()\n\n  return (\n    <optgroup\n      data-spark-component=\"select-group\"\n      ref={forwardedRef}\n      className={cx(className)}\n      label={groupLabel}\n    >\n      {children}\n    </optgroup>\n  )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n  disabled?: boolean\n  value: string\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n  return (\n    <option\n      data-spark-component=\"select-item\"\n      ref={forwardedRef}\n      key={value}\n      value={value}\n      disabled={disabled}\n      // label\n    >\n      {children}\n    </option>\n  )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n  [\n    'absolute left-0 top-0 size-full rounded-lg opacity-0',\n    'min-h-sz-44',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus:ring-2',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline focus:ring-outline-high',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        true: 'cursor-not-allowed',\n      },\n      readOnly: {\n        true: 'cursor-default',\n      },\n    },\n    compoundVariants: [\n      {\n        disabled: false,\n        state: undefined,\n        class: 'hover:ring-outline-high',\n      },\n    ],\n  }\n)\n\nexport const Items = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n  const {\n    state,\n    disabled,\n    readOnly,\n    ariaLabel,\n    fieldLabelId,\n    isControlled,\n    onValueChange,\n    selectedItem,\n    setValue,\n    name,\n    required,\n    fieldId,\n  } = useSelectContext()\n\n  const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n    if (isControlled) {\n      event.preventDefault()\n      onValueChange?.(event.target.value)\n    } else {\n      setValue(event.target.value)\n    }\n  }\n\n  return (\n    <select\n      data-spark-component=\"select-items\"\n      ref={ref}\n      disabled={disabled || readOnly}\n      name={name}\n      required={required}\n      aria-labelledby={fieldLabelId}\n      {...(ariaLabel && { 'aria-label': ariaLabel })}\n      className={styles({ className, state, disabled, readOnly })}\n      value={selectedItem?.value}\n      onChange={handleChange}\n      id={fieldId}\n      {...rest}\n    >\n      {children}\n    </select>\n  )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n  children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n  const { setGroupLabel } = useSelectGroupContext()\n\n  useEffect(() => {\n    setGroupLabel(children)\n  }, [children])\n\n  return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n  return (\n    <Icon size={'sm'} className=\"shrink-0\">\n      {children}\n    </Icon>\n  )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n  disabled?: boolean\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n  disabled = false,\n  children,\n  ref: forwardedRef,\n}: PlaceholderProps) => {\n  const { setPlaceholder } = useSelectContext()\n\n  useEffect(() => {\n    setPlaceholder(children)\n  }, [children])\n\n  return (\n    <option\n      data-spark-component=\"select-placeholder\"\n      ref={forwardedRef}\n      key=\"placeholder\"\n      value=\"\"\n      disabled={disabled}\n    >\n      {children}\n    </option>\n  )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n  [\n    'relative flex w-full items-center justify-between',\n    'min-h-sz-44 rounded-lg px-lg',\n    'text-body-1',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        false: 'focus-within:ring-2',\n      },\n      readOnly: {\n        true: '',\n      },\n    },\n    compoundVariants: [\n      {\n        readOnly: false,\n        disabled: false,\n        class: 'bg-surface text-on-surface',\n      },\n      {\n        readOnly: true,\n        class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n      },\n      {\n        disabled: true,\n        class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n      },\n      {\n        disabled: false,\n        state: undefined,\n        class: 'default:hover:ring-outline-high',\n      },\n    ],\n  }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n  'aria-label'?: string\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n  'aria-label': ariaLabel,\n  children,\n  className,\n  ref: forwardedRef,\n}: TriggerProps) => {\n  const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n  useEffect(() => {\n    if (ariaLabel) {\n      setAriaLabel(ariaLabel)\n    }\n  }, [ariaLabel])\n\n  return (\n    <div\n      data-spark-component=\"select-trigger\"\n      ref={forwardedRef}\n      className={styles({ className, state, disabled, readOnly })}\n    >\n      <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n      <Icon className=\"ml-md shrink-0\" size=\"sm\">\n        <ArrowHorizontalDown />\n      </Icon>\n\n      {itemsComponent}\n    </div>\n  )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n  children?: ReactNode\n  className?: string\n  /**\n   * Optional placeholder value for the trigger.\n   * If not specified, the value inside `Select.Placeholder` item will be used.\n   */\n  placeholder?: string\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n  children,\n  className,\n  placeholder: customPlaceholder,\n  ref: forwardedRef,\n}: ValueProps) => {\n  const { selectedItem, placeholder, disabled } = useSelectContext()\n\n  const isPlaceholderSelected = selectedItem?.value == null\n  const valuePlaceholder = customPlaceholder || placeholder\n\n  return (\n    <span\n      role=\"presentation\"\n      data-spark-component=\"select-value\"\n      ref={forwardedRef}\n      className={cx('flex shrink items-center text-left', className)}\n    >\n      <span\n        className={cx(\n          'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n          isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n        )}\n      >\n        {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n      </span>\n    </span>\n  )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n  Group: typeof Group\n  Item: typeof Item\n  Items: typeof Items\n  Placeholder: typeof Placeholder\n  Label: typeof Label\n  Trigger: typeof Trigger\n  Value: typeof Value\n  LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n  Group,\n  Item,\n  Items,\n  Placeholder,\n  Label,\n  Trigger,\n  Value,\n  LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"gWAKaA,GAAeC,GAAyBC,GAC7BC,EAAAA,SAAS,QAAQF,CAAQ,EAAE,OAAOG,gBAAc,EAEjD,KAAKC,GACjBC,EAAsBD,CAAK,GAAG,SAASH,CAAI,CACnD,EAGGI,EAAyBC,GACtBA,EAAWA,EAAQ,KAAuC,YAAc,GAG3EC,EAAkB,CAACP,EAAqBQ,EAAuB,MACnEN,EAAAA,SAAS,QAAQF,EAAUI,GAAS,CAClC,GAAKD,EAAAA,eAAeC,CAAK,EAEzB,IACEC,EAAsBD,CAAK,IAAM,eACjCC,EAAsBD,CAAK,IAAM,qBACjC,CACA,MAAMK,EAAaL,EAAM,MACzBI,EAAO,KAAK,CACV,MAAOC,EAAW,MAClB,SAAU,CAAC,CAACA,EAAW,SACvB,KAAMA,EAAW,QAAA,CAClB,CACH,CAEKL,EAAM,MAAkC,UAC3CG,EAAiBH,EAAM,MAAkC,SAAUI,CAAM,EAE7E,CAAC,EAEMA,GAGIE,EAAwBV,GAAkC,CACrE,MAAMW,MAAuB,IAE7B,OAAAJ,EAAgBP,CAAQ,EAAE,QAAQY,GAAY,CAC5CD,EAAO,IAAIC,EAAS,MAAOA,CAAQ,CACrC,CAAC,EAEMD,CACT,EC0BME,EAAgBC,EAAAA,cAAyC,IAAI,EAE7DC,GAAY,UAELC,EAAiB,CAAC,CAC7B,SAAAhB,EACA,aAAAiB,EACA,MAAOC,EACP,cAAAC,EACA,SAAUC,EAAe,GACzB,SAAUC,EAAe,GACzB,MAAOC,EACP,eAAAC,EACA,KAAMC,EACN,SAAUC,CACZ,IAA0B,CACxB,KAAM,CAACC,EAAOC,CAAQ,EAAIC,GAAAA,iBAAiBV,EAAWD,EAAcE,CAAa,EAC3E,CAACU,EAAaC,CAAc,EAAIC,EAAAA,SAA6B,MAAS,EACtE,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAAmBrB,EAAqBa,CAAc,CAAC,EACjF,CAACW,EAAWC,CAAY,EAAIJ,WAAA,EAG5BK,EAAYJ,EAAS,QAAA,EAAU,KAAA,GAAQ,QAAQ,CAAC,EAChDK,EAAe,OAAOX,GAAU,SAAWM,EAAS,IAAIN,CAAK,EAAIU,EACjEE,EAAepB,GAAa,KAG5BqB,EAAQC,GAAAA,oBAAA,EACRC,EAAQF,EAAM,OAASjB,EAEvBoB,EAAkB,GAAG3B,EAAS,UAAU4B,EAAAA,OAAO,GAC/CC,EAAUL,EAAM,IAAMG,EACtBG,EAAeN,EAAM,QACrBO,EAAWP,EAAM,UAAYnB,EAC7B2B,GAAWR,EAAM,UAAYlB,EAC7BpB,GAAOsC,EAAM,MAAQf,EACrBwB,GAAW,CAAC,EAAET,EAAM,YAAcd,GAYxCwB,OAAAA,EAAAA,UAAU,IAAM,CACd,MAAMtC,EAASD,EAAqBa,CAAc,EAE5C2B,EAAgB,CAAC,GAAGlB,EAAS,QAAQ,EACrCmB,EAAW,CAAC,GAAGxC,EAAO,QAAQ,GAGlCuC,EAAc,SAAWC,EAAS,QAClCD,EAAc,KAAK,CAACE,EAAMC,IAAU,CAClC,MAAMC,GAAkBF,EAAK,QAAUD,EAASE,CAAK,GAAG,MAClDE,GAAiBH,EAAK,OAASD,EAASE,CAAK,GAAG,KAEtD,OAAOC,IAAmBC,EAC5B,CAAC,IAGDtB,EAAYtB,CAAM,CAEtB,EAAG,CAACX,CAAQ,CAAC,EAGXwD,EAAAA,IAAC3C,EAAc,SAAd,CACC,MAAO,CACL,SAAAiC,EACA,SAAAC,GACA,SAAAf,EACA,MAAAS,EACA,eAAAlB,EACA,aAAAc,EACA,SAAAV,EACA,aAAAW,EACA,cAAAnB,EACA,UAAAe,EACA,aAAAC,EACA,QAAAS,EACA,aAAAC,EACA,KAAA5C,GACA,SAAA+C,GACA,YAAAnB,EACA,eAAAC,CAAA,EAGD,SAAA9B,CAAA,CAAA,CAGP,EAEayD,EAAmB,IAAM,CACpC,MAAMC,EAAUC,EAAAA,WAAW9C,CAAa,EAExC,GAAI,CAAC6C,EACH,MAAM,MAAM,wDAAwD,EAGtE,OAAOA,CACT,EC7KaE,EAAS,CAAC,CAAE,SAAA5D,EAAU,GAAG6D,KAAyB,CAC7D,MAAMC,EAAS/D,GAAYC,CAAQ,EAC7B+D,EAAUD,EAAO,SAAS,EAC1BE,EAAQF,EAAO,OAAO,EAE5B,aACG9C,EAAA,CAAgB,GAAG6C,EAAO,eAAgBG,EACxC,SAAAD,EACH,CAEJ,EAEAH,EAAO,YAAc,SCRrB,MAAMK,EAAqBnD,EAAAA,cAAyC,IAAI,EAE3DoD,GAAsB,CAAC,CAAE,SAAAlE,KAAmC,CACvE,KAAM,CAACmE,EAAYC,CAAa,EAAIrC,EAAAA,SAAS,EAAE,EAE/C,OACEyB,EAAAA,IAACS,EAAmB,SAAnB,CAA4B,MAAO,CAAE,WAAAE,EAAY,cAAAC,GAC/C,SAAApE,EACH,CAEJ,EAEaqE,EAAwB,IAAM,CACzC,MAAMX,EAAUC,EAAAA,WAAWM,CAAkB,EAE7C,GAAI,CAACP,EACH,MAAM,MAAM,kEAAkE,EAGhF,OAAOA,CACT,EClBaY,EAAQ,CAAC,CAAE,SAAAtE,EAAU,IAAKuE,EAAc,GAAGV,KAEpDL,EAAAA,IAACU,IACC,SAAAV,EAAAA,IAACgB,GAAA,CAAa,IAAKD,EAAe,GAAGV,EAClC,SAAA7D,CAAA,CACH,CAAA,CACF,EAIEwE,GAAe,CAAC,CAAE,SAAAxE,EAAU,UAAAyE,EAAW,IAAKF,KAA+B,CAC/E,KAAM,CAAE,WAAAJ,CAAA,EAAeE,EAAA,EAEvB,OACEb,EAAAA,IAAC,WAAA,CACC,uBAAqB,eACrB,IAAKe,EACL,UAAWG,EAAAA,GAAGD,CAAS,EACvB,MAAON,EAEN,SAAAnE,CAAA,CAAA,CAGP,EAEAsE,EAAM,YAAc,eC3Bb,MAAMK,EAAO,CAAC,CAAE,SAAA7B,EAAW,GAAO,MAAApB,EAAO,SAAA1B,EAAU,IAAKuE,KAE3Df,EAAAA,IAAC,SAAA,CACC,uBAAqB,cACrB,IAAKe,EAEL,MAAA7C,EACA,SAAAoB,EAGC,SAAA9C,CAAA,EALI0B,CAAA,EAUXiD,EAAK,YAAc,cCnBZ,MAAMC,GAASC,EAAAA,IACpB,CACE,uDACA,cAEA,+CAAA,EAEF,CACE,SAAU,CACR,MAAO,CACL,UAAW,uCACX,MAAO,aACP,MAAO,aACP,QAAS,cAAA,EAEX,SAAU,CACR,KAAM,oBAAA,EAER,SAAU,CACR,KAAM,gBAAA,CACR,EAEF,iBAAkB,CAChB,CACE,SAAU,GACV,MAAO,OACP,MAAO,yBAAA,CACT,CACF,CAEJ,EAEaC,EAAQ,CAAC,CACpB,SAAA9E,EACA,UAAAyE,EACA,IAAAM,EACA,GAAGC,CACL,IAA0D,CACxD,KAAM,CACJ,MAAAvC,EACA,SAAAK,EACA,SAAAC,EACA,UAAAb,EACA,aAAAW,EACA,aAAAP,EACA,cAAAnB,EACA,aAAAkB,EACA,SAAAV,EACA,KAAA1B,EACA,SAAA+C,EACA,QAAAJ,CAAA,EACEa,EAAA,EAEEwB,EAAgBC,GAA0C,CAC1D5C,GACF4C,EAAM,eAAA,EACN/D,IAAgB+D,EAAM,OAAO,KAAK,GAElCvD,EAASuD,EAAM,OAAO,KAAK,CAE/B,EAEA,OACE1B,EAAAA,IAAC,SAAA,CACC,uBAAqB,eACrB,IAAAuB,EACA,SAAUjC,GAAYC,EACtB,KAAA9C,EACA,SAAA+C,EACA,kBAAiBH,EAChB,GAAIX,GAAa,CAAE,aAAcA,CAAA,EAClC,UAAW0C,GAAO,CAAE,UAAAH,EAAW,MAAAhC,EAAO,SAAAK,EAAU,SAAAC,EAAU,EAC1D,MAAOV,GAAc,MACrB,SAAU4C,EACV,GAAIrC,EACH,GAAGoC,EAEH,SAAAhF,CAAA,CAAA,CAGP,EAEA8E,EAAM,YAAc,eC/Eb,MAAMK,EAAQ,CAAC,CAAE,SAAAnF,KAA2B,CACjD,KAAM,CAAE,cAAAoE,CAAA,EAAkBC,EAAA,EAE1BpB,OAAAA,EAAAA,UAAU,IAAM,CACdmB,EAAcpE,CAAQ,CACxB,EAAG,CAACA,CAAQ,CAAC,EAEN,IACT,EAEAmF,EAAM,YAAc,eCdb,MAAMC,EAAc,CAAC,CAAE,SAAApF,WAEzBqF,EAAAA,KAAA,CAAK,KAAM,KAAM,UAAU,WACzB,SAAArF,EACH,EAIJoF,EAAY,YAAc,qBCFnB,MAAME,EAAc,CAAC,CAC1B,SAAAxC,EAAW,GACX,SAAA9C,EACA,IAAKuE,CACP,IAAwB,CACtB,KAAM,CAAE,eAAAzC,CAAA,EAAmB2B,EAAA,EAE3BR,OAAAA,EAAAA,UAAU,IAAM,CACdnB,EAAe9B,CAAQ,CACzB,EAAG,CAACA,CAAQ,CAAC,EAGXwD,EAAAA,IAAC,SAAA,CACC,uBAAqB,qBACrB,IAAKe,EAEL,MAAM,GACN,SAAAzB,EAEC,SAAA9C,CAAA,EAJG,aAAA,CAOV,EAEAsF,EAAY,YAAc,qBChCnB,MAAMV,GAASC,EAAAA,IACpB,CACE,oDACA,+BACA,cAEA,0DAAA,EAEF,CACE,SAAU,CACR,MAAO,CACL,UAAW,eACX,MAAO,aACP,MAAO,aACP,QAAS,cAAA,EAEX,SAAU,CACR,MAAO,qBAAA,EAET,SAAU,CACR,KAAM,EAAA,CACR,EAEF,iBAAkB,CAChB,CACE,SAAU,GACV,SAAU,GACV,MAAO,4BAAA,EAET,CACE,SAAU,GACV,MAAO,oDAAA,EAET,CACE,SAAU,GACV,MAAO,CAAC,4CAA6C,oBAAoB,CAAA,EAE3E,CACE,SAAU,GACV,MAAO,OACP,MAAO,iCAAA,CACT,CACF,CAEJ,EC5BaU,EAAU,CAAC,CACtB,aAAcrD,EACd,SAAAlC,EACA,UAAAyE,EACA,IAAKF,CACP,IAAoB,CAClB,KAAM,CAAE,SAAAzB,EAAU,SAAAC,EAAU,MAAAN,EAAO,aAAAN,EAAc,eAAAZ,CAAA,EAAmBkC,EAAA,EAEpER,OAAAA,EAAAA,UAAU,IAAM,CACVf,GACFC,EAAaD,CAAS,CAE1B,EAAG,CAACA,CAAS,CAAC,EAGZsD,EAAAA,KAAC,MAAA,CACC,uBAAqB,iBACrB,IAAKjB,EACL,UAAWK,GAAO,CAAE,UAAAH,EAAW,MAAAhC,EAAO,SAAAK,EAAU,SAAAC,EAAU,EAE1D,SAAA,CAAAS,EAAAA,IAAC,OAAA,CAAK,UAAU,yCAA0C,SAAAxD,CAAA,CAAS,EAEnEwD,EAAAA,IAAC6B,EAAAA,MAAK,UAAU,iBAAiB,KAAK,KACpC,SAAA7B,EAAAA,IAACiC,yBAAoB,CAAA,CACvB,EAEClE,CAAA,CAAA,CAAA,CAGP,EAEAgE,EAAQ,YAAc,iBCjCf,MAAMG,EAAQ,CAAC,CACpB,SAAA1F,EACA,UAAAyE,EACA,YAAakB,EACb,IAAKpB,CACP,IAAkB,CAChB,KAAM,CAAE,aAAAlC,EAAc,YAAAR,EAAa,SAAAiB,CAAA,EAAaW,EAAA,EAE1CmC,EAAwBvD,GAAc,OAAS,KAC/CwD,EAAmBF,GAAqB9D,EAE9C,OACE2B,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,uBAAqB,eACrB,IAAKe,EACL,UAAWG,EAAAA,GAAG,qCAAsCD,CAAS,EAE7D,SAAAjB,EAAAA,IAAC,OAAA,CACC,UAAWkB,EAAAA,GACT,8DACAkB,GAAyB,CAAC9C,GAAY,uBAAA,EAGvC,SAAA8C,EAAwBC,EAAmB7F,GAAYqC,GAAc,IAAA,CAAA,CACxE,CAAA,CAGN,EAEAqD,EAAM,YAAc,eCjCb,MAAM9B,EAST,OAAO,OAAOkC,EAAM,CACtB,MAAAxB,EACA,KAAAK,EACA,MAAAG,EACA,YAAAQ,EACA,MAAAH,EACA,QAAAI,EACA,MAAAG,EACA,YAAAN,CACF,CAAC,EAEDxB,EAAO,YAAc,SACrBU,EAAM,YAAc,eACpBQ,EAAM,YAAc,eACpBH,EAAK,YAAc,cACnBW,EAAY,YAAc,qBAC1BH,EAAM,YAAc,eACpBI,EAAQ,YAAc,iBACtBG,EAAM,YAAc,eACpBN,EAAY,YAAc"}
+{"version":3,"file":"index.js","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n  const validChildren = Children.toArray(children).filter(isValidElement)\n\n  return validChildren.find(child => {\n    return getElementDisplayName(child)?.includes(name)\n  })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n  return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n  Children.forEach(children, child => {\n    if (!isValidElement(child)) return\n\n    if (\n      getElementDisplayName(child) === 'Select.Item' ||\n      getElementDisplayName(child) === 'Select.Placeholder'\n    ) {\n      const childProps = child.props as ItemProps\n      result.push({\n        value: childProps.value,\n        disabled: !!childProps.disabled,\n        text: childProps.children,\n      })\n    }\n\n    if ((child.props as { children: ReactNode }).children) {\n      getOrderedItems((child.props as { children: ReactNode }).children, result)\n    }\n  })\n\n  return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n  const newMap: ItemsMap = new Map()\n\n  getOrderedItems(children).forEach(itemData => {\n    newMap.set(itemData.value, itemData)\n  })\n\n  return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n  createContext,\n  Dispatch,\n  PropsWithChildren,\n  ReactElement,\n  SetStateAction,\n  useContext,\n  useEffect,\n  useId,\n  useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n  itemsMap: ItemsMap\n  disabled: boolean\n  readOnly: boolean\n  state?: 'error' | 'alert' | 'success'\n  itemsComponent: ReactElement | undefined\n  selectedItem: SelectItem | undefined\n  setValue: (value: string) => void\n  isControlled: boolean\n  onValueChange?: (value: string) => void\n  ariaLabel: string | undefined\n  setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n  fieldId: string\n  fieldLabelId: string | undefined\n  name: string | undefined\n  required: boolean\n  placeholder: string | undefined\n  setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n  /**\n   * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n   */\n  state?: 'error' | 'alert' | 'success'\n  /**\n   * When true, prevents the user from interacting with the select.\n   */\n  disabled?: boolean\n  /**\n   * Sets the select as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n   */\n  defaultValue?: string\n  /**\n   * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n   */\n  value?: string\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: string) => void\n\n  itemsComponent: ReactElement | undefined\n  /**\n   * This attribute is used to specify the name of the control.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n   */\n  required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n  children,\n  defaultValue,\n  value: valueProp,\n  onValueChange,\n  disabled: disabledProp = false,\n  readOnly: readOnlyProp = false,\n  state: stateProp,\n  itemsComponent,\n  name: nameProp,\n  required: requiredProp,\n}: SelectContextProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n  const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n  const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n  const [ariaLabel, setAriaLabel] = useState<string>()\n\n  // Computed state\n  const firstItem = itemsMap.entries().next()?.value?.[1]\n  const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n  const isControlled = valueProp != null\n\n  // Derivated from FormField context\n  const field = useFormFieldControl()\n  const state = field.state || stateProp\n\n  const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n  const fieldId = field.id || internalFieldID\n  const fieldLabelId = field.labelId\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n  const required = !!(field.isRequired ?? requiredProp)\n\n  /**\n   * Indices in a Map are set when an element is added to the Map.\n   * If for some reason, in the Select:\n   * - items order changes\n   * - items are added\n   * - items are removed\n   *\n   * The Map must be rebuilt from the new children in order to preserve logical indices.\n   *\n   */\n  useEffect(() => {\n    const newMap = getItemsFromChildren(itemsComponent)\n\n    const previousItems = [...itemsMap.values()]\n    const newItems = [...newMap.values()]\n\n    const hasItemsChanges =\n      previousItems.length !== newItems.length ||\n      previousItems.some((item, index) => {\n        const hasUpdatedValue = item.value !== newItems[index]?.value\n        const hasUpdatedText = item.text !== newItems[index]?.text\n\n        return hasUpdatedValue || hasUpdatedText\n      })\n\n    if (hasItemsChanges) {\n      setItemsMap(newMap)\n    }\n  }, [children])\n\n  return (\n    <SelectContext.Provider\n      value={{\n        disabled,\n        readOnly,\n        itemsMap,\n        state,\n        itemsComponent,\n        selectedItem,\n        setValue,\n        isControlled,\n        onValueChange,\n        ariaLabel,\n        setAriaLabel,\n        fieldId,\n        fieldLabelId,\n        name,\n        required,\n        placeholder,\n        setPlaceholder,\n      }}\n    >\n      {children}\n    </SelectContext.Provider>\n  )\n}\n\nexport const useSelectContext = () => {\n  const context = useContext(SelectContext)\n\n  if (!context) {\n    throw Error('useSelectContext must be used within a Select provider')\n  }\n\n  return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n  const finder = findElement(children)\n  const trigger = finder('Trigger')\n  const items = finder('Items')\n\n  return (\n    <SelectProvider {...props} itemsComponent={items}>\n      {trigger}\n    </SelectProvider>\n  )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n  groupLabel: string\n  setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n  const [groupLabel, setGroupLabel] = useState('')\n\n  return (\n    <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n      {children}\n    </SelectGroupContext.Provider>\n  )\n}\n\nexport const useSelectGroupContext = () => {\n  const context = useContext(SelectGroupContext)\n\n  if (!context) {\n    throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n  return (\n    <SelectGroupProvider>\n      <GroupContent ref={forwardedRef} {...props}>\n        {children}\n      </GroupContent>\n    </SelectGroupProvider>\n  )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n  const { groupLabel } = useSelectGroupContext()\n\n  return (\n    <optgroup\n      data-spark-component=\"select-group\"\n      ref={forwardedRef}\n      className={cx(className)}\n      label={groupLabel}\n    >\n      {children}\n    </optgroup>\n  )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n  disabled?: boolean\n  value: string\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n  return (\n    <option\n      data-spark-component=\"select-item\"\n      ref={forwardedRef}\n      key={value}\n      value={value}\n      disabled={disabled}\n      // label\n    >\n      {children}\n    </option>\n  )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n  [\n    'absolute left-0 top-0 size-full rounded-lg opacity-0',\n    'min-h-sz-44',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus:ring-2',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline focus:ring-outline-high',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        true: 'cursor-not-allowed',\n      },\n      readOnly: {\n        true: 'cursor-default',\n      },\n    },\n    compoundVariants: [\n      {\n        disabled: false,\n        state: undefined,\n        class: 'hover:ring-outline-high',\n      },\n    ],\n  }\n)\n\nexport const Items = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n  const {\n    state,\n    disabled,\n    readOnly,\n    ariaLabel,\n    fieldLabelId,\n    isControlled,\n    onValueChange,\n    selectedItem,\n    setValue,\n    name,\n    required,\n    fieldId,\n  } = useSelectContext()\n\n  const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n    if (isControlled) {\n      event.preventDefault()\n      onValueChange?.(event.target.value)\n    } else {\n      setValue(event.target.value)\n    }\n  }\n\n  return (\n    <select\n      data-spark-component=\"select-items\"\n      ref={ref}\n      disabled={disabled || readOnly}\n      name={name}\n      required={required}\n      aria-labelledby={fieldLabelId}\n      {...(ariaLabel && { 'aria-label': ariaLabel })}\n      className={styles({ className, state, disabled, readOnly })}\n      value={selectedItem?.value}\n      onChange={handleChange}\n      id={fieldId}\n      {...rest}\n    >\n      {children}\n    </select>\n  )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n  children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n  const { setGroupLabel } = useSelectGroupContext()\n\n  useEffect(() => {\n    setGroupLabel(children)\n  }, [children])\n\n  return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n  return (\n    <Icon size={'sm'} className=\"shrink-0\">\n      {children}\n    </Icon>\n  )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n  disabled?: boolean\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n  disabled = false,\n  children,\n  ref: forwardedRef,\n}: PlaceholderProps) => {\n  const { setPlaceholder } = useSelectContext()\n\n  useEffect(() => {\n    setPlaceholder(children)\n  }, [children])\n\n  return (\n    <option\n      data-spark-component=\"select-placeholder\"\n      ref={forwardedRef}\n      key=\"placeholder\"\n      value=\"\"\n      disabled={disabled}\n    >\n      {children}\n    </option>\n  )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n  [\n    'relative flex w-full items-center justify-between',\n    'min-h-sz-44 rounded-full px-lg',\n    'text-body-1',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        false: 'focus-within:ring-2',\n      },\n      readOnly: {\n        true: '',\n      },\n    },\n    compoundVariants: [\n      {\n        readOnly: false,\n        disabled: false,\n        class: 'bg-surface text-on-surface',\n      },\n      {\n        readOnly: true,\n        class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n      },\n      {\n        disabled: true,\n        class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n      },\n      {\n        disabled: false,\n        state: undefined,\n        class: 'default:hover:ring-outline-high',\n      },\n    ],\n  }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n  'aria-label'?: string\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n  'aria-label': ariaLabel,\n  children,\n  className,\n  ref: forwardedRef,\n}: TriggerProps) => {\n  const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n  useEffect(() => {\n    if (ariaLabel) {\n      setAriaLabel(ariaLabel)\n    }\n  }, [ariaLabel])\n\n  return (\n    <div\n      data-spark-component=\"select-trigger\"\n      ref={forwardedRef}\n      className={styles({ className, state, disabled, readOnly })}\n    >\n      <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n      <Icon className=\"ml-md shrink-0\" size=\"sm\">\n        <ArrowHorizontalDown />\n      </Icon>\n\n      {itemsComponent}\n    </div>\n  )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n  children?: ReactNode\n  className?: string\n  /**\n   * Optional placeholder value for the trigger.\n   * If not specified, the value inside `Select.Placeholder` item will be used.\n   */\n  placeholder?: string\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n  children,\n  className,\n  placeholder: customPlaceholder,\n  ref: forwardedRef,\n}: ValueProps) => {\n  const { selectedItem, placeholder, disabled } = useSelectContext()\n\n  const isPlaceholderSelected = selectedItem?.value == null\n  const valuePlaceholder = customPlaceholder || placeholder\n\n  return (\n    <span\n      role=\"presentation\"\n      data-spark-component=\"select-value\"\n      ref={forwardedRef}\n      className={cx('flex shrink items-center text-left', className)}\n    >\n      <span\n        className={cx(\n          'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n          isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n        )}\n      >\n        {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n      </span>\n    </span>\n  )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n  Group: typeof Group\n  Item: typeof Item\n  Items: typeof Items\n  Placeholder: typeof Placeholder\n  Label: typeof Label\n  Trigger: typeof Trigger\n  Value: typeof Value\n  LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n  Group,\n  Item,\n  Items,\n  Placeholder,\n  Label,\n  Trigger,\n  Value,\n  LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"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"}

package/dist/select/index.mjs

@@ -3,7 +3,7 @@ import { useFormFieldControl as de } from "@spark-ui/components/form-field";
 import { useCombinedState as ue } from "@spark-ui/hooks/use-combined-state";
 import { Children as A, isValidElement as D, createContext as $, useState as f, useId as me, useEffect as g, useContext as R } from "react";
 import { cx as C, cva as U } from "class-variance-authority";
-import { I as H } from "../Icon-C23-htlD.mjs";
+import { I as H } from "../Icon-BO327oHU.mjs";
 import { ArrowHorizontalDown as pe } from "@spark-ui/icons/ArrowHorizontalDown";
 const fe = (e) => (t) => A.toArray(e).filter(D).find((l) => w(l)?.includes(t)), w = (e) => e ? e.type.displayName : "", X = (e, t = []) => (A.forEach(e, (s) => {
   if (D(s)) {
@@ -215,7 +215,7 @@ E.displayName = "Select.Placeholder";
 const Se = U(
   [
     "relative flex w-full items-center justify-between",
-    "min-h-sz-44 rounded-lg px-lg",
+    "min-h-sz-44 rounded-full px-lg",
     "text-body-1",
     // outline styles
     "ring-1 outline-hidden ring-inset focus-within:ring-focus"

package/dist/select/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n  const validChildren = Children.toArray(children).filter(isValidElement)\n\n  return validChildren.find(child => {\n    return getElementDisplayName(child)?.includes(name)\n  })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n  return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n  Children.forEach(children, child => {\n    if (!isValidElement(child)) return\n\n    if (\n      getElementDisplayName(child) === 'Select.Item' ||\n      getElementDisplayName(child) === 'Select.Placeholder'\n    ) {\n      const childProps = child.props as ItemProps\n      result.push({\n        value: childProps.value,\n        disabled: !!childProps.disabled,\n        text: childProps.children,\n      })\n    }\n\n    if ((child.props as { children: ReactNode }).children) {\n      getOrderedItems((child.props as { children: ReactNode }).children, result)\n    }\n  })\n\n  return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n  const newMap: ItemsMap = new Map()\n\n  getOrderedItems(children).forEach(itemData => {\n    newMap.set(itemData.value, itemData)\n  })\n\n  return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n  createContext,\n  Dispatch,\n  PropsWithChildren,\n  ReactElement,\n  SetStateAction,\n  useContext,\n  useEffect,\n  useId,\n  useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n  itemsMap: ItemsMap\n  disabled: boolean\n  readOnly: boolean\n  state?: 'error' | 'alert' | 'success'\n  itemsComponent: ReactElement | undefined\n  selectedItem: SelectItem | undefined\n  setValue: (value: string) => void\n  isControlled: boolean\n  onValueChange?: (value: string) => void\n  ariaLabel: string | undefined\n  setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n  fieldId: string\n  fieldLabelId: string | undefined\n  name: string | undefined\n  required: boolean\n  placeholder: string | undefined\n  setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n  /**\n   * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n   */\n  state?: 'error' | 'alert' | 'success'\n  /**\n   * When true, prevents the user from interacting with the select.\n   */\n  disabled?: boolean\n  /**\n   * Sets the select as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n   */\n  defaultValue?: string\n  /**\n   * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n   */\n  value?: string\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: string) => void\n\n  itemsComponent: ReactElement | undefined\n  /**\n   * This attribute is used to specify the name of the control.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n   */\n  required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n  children,\n  defaultValue,\n  value: valueProp,\n  onValueChange,\n  disabled: disabledProp = false,\n  readOnly: readOnlyProp = false,\n  state: stateProp,\n  itemsComponent,\n  name: nameProp,\n  required: requiredProp,\n}: SelectContextProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n  const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n  const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n  const [ariaLabel, setAriaLabel] = useState<string>()\n\n  // Computed state\n  const firstItem = itemsMap.entries().next()?.value?.[1]\n  const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n  const isControlled = valueProp != null\n\n  // Derivated from FormField context\n  const field = useFormFieldControl()\n  const state = field.state || stateProp\n\n  const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n  const fieldId = field.id || internalFieldID\n  const fieldLabelId = field.labelId\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n  const required = !!(field.isRequired ?? requiredProp)\n\n  /**\n   * Indices in a Map are set when an element is added to the Map.\n   * If for some reason, in the Select:\n   * - items order changes\n   * - items are added\n   * - items are removed\n   *\n   * The Map must be rebuilt from the new children in order to preserve logical indices.\n   *\n   */\n  useEffect(() => {\n    const newMap = getItemsFromChildren(itemsComponent)\n\n    const previousItems = [...itemsMap.values()]\n    const newItems = [...newMap.values()]\n\n    const hasItemsChanges =\n      previousItems.length !== newItems.length ||\n      previousItems.some((item, index) => {\n        const hasUpdatedValue = item.value !== newItems[index]?.value\n        const hasUpdatedText = item.text !== newItems[index]?.text\n\n        return hasUpdatedValue || hasUpdatedText\n      })\n\n    if (hasItemsChanges) {\n      setItemsMap(newMap)\n    }\n  }, [children])\n\n  return (\n    <SelectContext.Provider\n      value={{\n        disabled,\n        readOnly,\n        itemsMap,\n        state,\n        itemsComponent,\n        selectedItem,\n        setValue,\n        isControlled,\n        onValueChange,\n        ariaLabel,\n        setAriaLabel,\n        fieldId,\n        fieldLabelId,\n        name,\n        required,\n        placeholder,\n        setPlaceholder,\n      }}\n    >\n      {children}\n    </SelectContext.Provider>\n  )\n}\n\nexport const useSelectContext = () => {\n  const context = useContext(SelectContext)\n\n  if (!context) {\n    throw Error('useSelectContext must be used within a Select provider')\n  }\n\n  return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n  const finder = findElement(children)\n  const trigger = finder('Trigger')\n  const items = finder('Items')\n\n  return (\n    <SelectProvider {...props} itemsComponent={items}>\n      {trigger}\n    </SelectProvider>\n  )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n  groupLabel: string\n  setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n  const [groupLabel, setGroupLabel] = useState('')\n\n  return (\n    <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n      {children}\n    </SelectGroupContext.Provider>\n  )\n}\n\nexport const useSelectGroupContext = () => {\n  const context = useContext(SelectGroupContext)\n\n  if (!context) {\n    throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n  return (\n    <SelectGroupProvider>\n      <GroupContent ref={forwardedRef} {...props}>\n        {children}\n      </GroupContent>\n    </SelectGroupProvider>\n  )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n  const { groupLabel } = useSelectGroupContext()\n\n  return (\n    <optgroup\n      data-spark-component=\"select-group\"\n      ref={forwardedRef}\n      className={cx(className)}\n      label={groupLabel}\n    >\n      {children}\n    </optgroup>\n  )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n  disabled?: boolean\n  value: string\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n  return (\n    <option\n      data-spark-component=\"select-item\"\n      ref={forwardedRef}\n      key={value}\n      value={value}\n      disabled={disabled}\n      // label\n    >\n      {children}\n    </option>\n  )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n  [\n    'absolute left-0 top-0 size-full rounded-lg opacity-0',\n    'min-h-sz-44',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus:ring-2',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline focus:ring-outline-high',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        true: 'cursor-not-allowed',\n      },\n      readOnly: {\n        true: 'cursor-default',\n      },\n    },\n    compoundVariants: [\n      {\n        disabled: false,\n        state: undefined,\n        class: 'hover:ring-outline-high',\n      },\n    ],\n  }\n)\n\nexport const Items = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n  const {\n    state,\n    disabled,\n    readOnly,\n    ariaLabel,\n    fieldLabelId,\n    isControlled,\n    onValueChange,\n    selectedItem,\n    setValue,\n    name,\n    required,\n    fieldId,\n  } = useSelectContext()\n\n  const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n    if (isControlled) {\n      event.preventDefault()\n      onValueChange?.(event.target.value)\n    } else {\n      setValue(event.target.value)\n    }\n  }\n\n  return (\n    <select\n      data-spark-component=\"select-items\"\n      ref={ref}\n      disabled={disabled || readOnly}\n      name={name}\n      required={required}\n      aria-labelledby={fieldLabelId}\n      {...(ariaLabel && { 'aria-label': ariaLabel })}\n      className={styles({ className, state, disabled, readOnly })}\n      value={selectedItem?.value}\n      onChange={handleChange}\n      id={fieldId}\n      {...rest}\n    >\n      {children}\n    </select>\n  )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n  children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n  const { setGroupLabel } = useSelectGroupContext()\n\n  useEffect(() => {\n    setGroupLabel(children)\n  }, [children])\n\n  return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n  return (\n    <Icon size={'sm'} className=\"shrink-0\">\n      {children}\n    </Icon>\n  )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n  disabled?: boolean\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n  disabled = false,\n  children,\n  ref: forwardedRef,\n}: PlaceholderProps) => {\n  const { setPlaceholder } = useSelectContext()\n\n  useEffect(() => {\n    setPlaceholder(children)\n  }, [children])\n\n  return (\n    <option\n      data-spark-component=\"select-placeholder\"\n      ref={forwardedRef}\n      key=\"placeholder\"\n      value=\"\"\n      disabled={disabled}\n    >\n      {children}\n    </option>\n  )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n  [\n    'relative flex w-full items-center justify-between',\n    'min-h-sz-44 rounded-lg px-lg',\n    'text-body-1',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        false: 'focus-within:ring-2',\n      },\n      readOnly: {\n        true: '',\n      },\n    },\n    compoundVariants: [\n      {\n        readOnly: false,\n        disabled: false,\n        class: 'bg-surface text-on-surface',\n      },\n      {\n        readOnly: true,\n        class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n      },\n      {\n        disabled: true,\n        class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n      },\n      {\n        disabled: false,\n        state: undefined,\n        class: 'default:hover:ring-outline-high',\n      },\n    ],\n  }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n  'aria-label'?: string\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n  'aria-label': ariaLabel,\n  children,\n  className,\n  ref: forwardedRef,\n}: TriggerProps) => {\n  const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n  useEffect(() => {\n    if (ariaLabel) {\n      setAriaLabel(ariaLabel)\n    }\n  }, [ariaLabel])\n\n  return (\n    <div\n      data-spark-component=\"select-trigger\"\n      ref={forwardedRef}\n      className={styles({ className, state, disabled, readOnly })}\n    >\n      <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n      <Icon className=\"ml-md shrink-0\" size=\"sm\">\n        <ArrowHorizontalDown />\n      </Icon>\n\n      {itemsComponent}\n    </div>\n  )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n  children?: ReactNode\n  className?: string\n  /**\n   * Optional placeholder value for the trigger.\n   * If not specified, the value inside `Select.Placeholder` item will be used.\n   */\n  placeholder?: string\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n  children,\n  className,\n  placeholder: customPlaceholder,\n  ref: forwardedRef,\n}: ValueProps) => {\n  const { selectedItem, placeholder, disabled } = useSelectContext()\n\n  const isPlaceholderSelected = selectedItem?.value == null\n  const valuePlaceholder = customPlaceholder || placeholder\n\n  return (\n    <span\n      role=\"presentation\"\n      data-spark-component=\"select-value\"\n      ref={forwardedRef}\n      className={cx('flex shrink items-center text-left', className)}\n    >\n      <span\n        className={cx(\n          'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n          isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n        )}\n      >\n        {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n      </span>\n    </span>\n  )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n  Group: typeof Group\n  Item: typeof Item\n  Items: typeof Items\n  Placeholder: typeof Placeholder\n  Label: typeof Label\n  Trigger: typeof Trigger\n  Value: typeof Value\n  LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n  Group,\n  Item,\n  Items,\n  Placeholder,\n  Label,\n  Trigger,\n  Value,\n  LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n  const validChildren = Children.toArray(children).filter(isValidElement)\n\n  return validChildren.find(child => {\n    return getElementDisplayName(child)?.includes(name)\n  })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n  return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n  Children.forEach(children, child => {\n    if (!isValidElement(child)) return\n\n    if (\n      getElementDisplayName(child) === 'Select.Item' ||\n      getElementDisplayName(child) === 'Select.Placeholder'\n    ) {\n      const childProps = child.props as ItemProps\n      result.push({\n        value: childProps.value,\n        disabled: !!childProps.disabled,\n        text: childProps.children,\n      })\n    }\n\n    if ((child.props as { children: ReactNode }).children) {\n      getOrderedItems((child.props as { children: ReactNode }).children, result)\n    }\n  })\n\n  return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n  const newMap: ItemsMap = new Map()\n\n  getOrderedItems(children).forEach(itemData => {\n    newMap.set(itemData.value, itemData)\n  })\n\n  return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n  createContext,\n  Dispatch,\n  PropsWithChildren,\n  ReactElement,\n  SetStateAction,\n  useContext,\n  useEffect,\n  useId,\n  useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n  itemsMap: ItemsMap\n  disabled: boolean\n  readOnly: boolean\n  state?: 'error' | 'alert' | 'success'\n  itemsComponent: ReactElement | undefined\n  selectedItem: SelectItem | undefined\n  setValue: (value: string) => void\n  isControlled: boolean\n  onValueChange?: (value: string) => void\n  ariaLabel: string | undefined\n  setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n  fieldId: string\n  fieldLabelId: string | undefined\n  name: string | undefined\n  required: boolean\n  placeholder: string | undefined\n  setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n  /**\n   * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n   */\n  state?: 'error' | 'alert' | 'success'\n  /**\n   * When true, prevents the user from interacting with the select.\n   */\n  disabled?: boolean\n  /**\n   * Sets the select as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n   */\n  defaultValue?: string\n  /**\n   * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n   */\n  value?: string\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: string) => void\n\n  itemsComponent: ReactElement | undefined\n  /**\n   * This attribute is used to specify the name of the control.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n   */\n  required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n  children,\n  defaultValue,\n  value: valueProp,\n  onValueChange,\n  disabled: disabledProp = false,\n  readOnly: readOnlyProp = false,\n  state: stateProp,\n  itemsComponent,\n  name: nameProp,\n  required: requiredProp,\n}: SelectContextProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n  const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n  const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n  const [ariaLabel, setAriaLabel] = useState<string>()\n\n  // Computed state\n  const firstItem = itemsMap.entries().next()?.value?.[1]\n  const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n  const isControlled = valueProp != null\n\n  // Derivated from FormField context\n  const field = useFormFieldControl()\n  const state = field.state || stateProp\n\n  const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n  const fieldId = field.id || internalFieldID\n  const fieldLabelId = field.labelId\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n  const required = !!(field.isRequired ?? requiredProp)\n\n  /**\n   * Indices in a Map are set when an element is added to the Map.\n   * If for some reason, in the Select:\n   * - items order changes\n   * - items are added\n   * - items are removed\n   *\n   * The Map must be rebuilt from the new children in order to preserve logical indices.\n   *\n   */\n  useEffect(() => {\n    const newMap = getItemsFromChildren(itemsComponent)\n\n    const previousItems = [...itemsMap.values()]\n    const newItems = [...newMap.values()]\n\n    const hasItemsChanges =\n      previousItems.length !== newItems.length ||\n      previousItems.some((item, index) => {\n        const hasUpdatedValue = item.value !== newItems[index]?.value\n        const hasUpdatedText = item.text !== newItems[index]?.text\n\n        return hasUpdatedValue || hasUpdatedText\n      })\n\n    if (hasItemsChanges) {\n      setItemsMap(newMap)\n    }\n  }, [children])\n\n  return (\n    <SelectContext.Provider\n      value={{\n        disabled,\n        readOnly,\n        itemsMap,\n        state,\n        itemsComponent,\n        selectedItem,\n        setValue,\n        isControlled,\n        onValueChange,\n        ariaLabel,\n        setAriaLabel,\n        fieldId,\n        fieldLabelId,\n        name,\n        required,\n        placeholder,\n        setPlaceholder,\n      }}\n    >\n      {children}\n    </SelectContext.Provider>\n  )\n}\n\nexport const useSelectContext = () => {\n  const context = useContext(SelectContext)\n\n  if (!context) {\n    throw Error('useSelectContext must be used within a Select provider')\n  }\n\n  return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n  const finder = findElement(children)\n  const trigger = finder('Trigger')\n  const items = finder('Items')\n\n  return (\n    <SelectProvider {...props} itemsComponent={items}>\n      {trigger}\n    </SelectProvider>\n  )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n  groupLabel: string\n  setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n  const [groupLabel, setGroupLabel] = useState('')\n\n  return (\n    <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n      {children}\n    </SelectGroupContext.Provider>\n  )\n}\n\nexport const useSelectGroupContext = () => {\n  const context = useContext(SelectGroupContext)\n\n  if (!context) {\n    throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n  return (\n    <SelectGroupProvider>\n      <GroupContent ref={forwardedRef} {...props}>\n        {children}\n      </GroupContent>\n    </SelectGroupProvider>\n  )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n  const { groupLabel } = useSelectGroupContext()\n\n  return (\n    <optgroup\n      data-spark-component=\"select-group\"\n      ref={forwardedRef}\n      className={cx(className)}\n      label={groupLabel}\n    >\n      {children}\n    </optgroup>\n  )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n  disabled?: boolean\n  value: string\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n  return (\n    <option\n      data-spark-component=\"select-item\"\n      ref={forwardedRef}\n      key={value}\n      value={value}\n      disabled={disabled}\n      // label\n    >\n      {children}\n    </option>\n  )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n  [\n    'absolute left-0 top-0 size-full rounded-lg opacity-0',\n    'min-h-sz-44',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus:ring-2',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline focus:ring-outline-high',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        true: 'cursor-not-allowed',\n      },\n      readOnly: {\n        true: 'cursor-default',\n      },\n    },\n    compoundVariants: [\n      {\n        disabled: false,\n        state: undefined,\n        class: 'hover:ring-outline-high',\n      },\n    ],\n  }\n)\n\nexport const Items = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n  const {\n    state,\n    disabled,\n    readOnly,\n    ariaLabel,\n    fieldLabelId,\n    isControlled,\n    onValueChange,\n    selectedItem,\n    setValue,\n    name,\n    required,\n    fieldId,\n  } = useSelectContext()\n\n  const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n    if (isControlled) {\n      event.preventDefault()\n      onValueChange?.(event.target.value)\n    } else {\n      setValue(event.target.value)\n    }\n  }\n\n  return (\n    <select\n      data-spark-component=\"select-items\"\n      ref={ref}\n      disabled={disabled || readOnly}\n      name={name}\n      required={required}\n      aria-labelledby={fieldLabelId}\n      {...(ariaLabel && { 'aria-label': ariaLabel })}\n      className={styles({ className, state, disabled, readOnly })}\n      value={selectedItem?.value}\n      onChange={handleChange}\n      id={fieldId}\n      {...rest}\n    >\n      {children}\n    </select>\n  )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n  children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n  const { setGroupLabel } = useSelectGroupContext()\n\n  useEffect(() => {\n    setGroupLabel(children)\n  }, [children])\n\n  return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n  return (\n    <Icon size={'sm'} className=\"shrink-0\">\n      {children}\n    </Icon>\n  )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n  disabled?: boolean\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n  disabled = false,\n  children,\n  ref: forwardedRef,\n}: PlaceholderProps) => {\n  const { setPlaceholder } = useSelectContext()\n\n  useEffect(() => {\n    setPlaceholder(children)\n  }, [children])\n\n  return (\n    <option\n      data-spark-component=\"select-placeholder\"\n      ref={forwardedRef}\n      key=\"placeholder\"\n      value=\"\"\n      disabled={disabled}\n    >\n      {children}\n    </option>\n  )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n  [\n    'relative flex w-full items-center justify-between',\n    'min-h-sz-44 rounded-full px-lg',\n    'text-body-1',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        false: 'focus-within:ring-2',\n      },\n      readOnly: {\n        true: '',\n      },\n    },\n    compoundVariants: [\n      {\n        readOnly: false,\n        disabled: false,\n        class: 'bg-surface text-on-surface',\n      },\n      {\n        readOnly: true,\n        class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n      },\n      {\n        disabled: true,\n        class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n      },\n      {\n        disabled: false,\n        state: undefined,\n        class: 'default:hover:ring-outline-high',\n      },\n    ],\n  }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n  'aria-label'?: string\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n  'aria-label': ariaLabel,\n  children,\n  className,\n  ref: forwardedRef,\n}: TriggerProps) => {\n  const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n  useEffect(() => {\n    if (ariaLabel) {\n      setAriaLabel(ariaLabel)\n    }\n  }, [ariaLabel])\n\n  return (\n    <div\n      data-spark-component=\"select-trigger\"\n      ref={forwardedRef}\n      className={styles({ className, state, disabled, readOnly })}\n    >\n      <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n      <Icon className=\"ml-md shrink-0\" size=\"sm\">\n        <ArrowHorizontalDown />\n      </Icon>\n\n      {itemsComponent}\n    </div>\n  )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n  children?: ReactNode\n  className?: string\n  /**\n   * Optional placeholder value for the trigger.\n   * If not specified, the value inside `Select.Placeholder` item will be used.\n   */\n  placeholder?: string\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n  children,\n  className,\n  placeholder: customPlaceholder,\n  ref: forwardedRef,\n}: ValueProps) => {\n  const { selectedItem, placeholder, disabled } = useSelectContext()\n\n  const isPlaceholderSelected = selectedItem?.value == null\n  const valuePlaceholder = customPlaceholder || placeholder\n\n  return (\n    <span\n      role=\"presentation\"\n      data-spark-component=\"select-value\"\n      ref={forwardedRef}\n      className={cx('flex shrink items-center text-left', className)}\n    >\n      <span\n        className={cx(\n          'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n          isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n        )}\n      >\n        {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n      </span>\n    </span>\n  )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n  Group: typeof Group\n  Item: typeof Item\n  Items: typeof Items\n  Placeholder: typeof Placeholder\n  Label: typeof Label\n  Trigger: typeof Trigger\n  Value: typeof Value\n  LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n  Group,\n  Item,\n  Items,\n  Placeholder,\n  Label,\n  Trigger,\n  Value,\n  LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"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"}

package/dist/slider/SliderThumb.styles.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const thumbVariants: (props?: ({
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "basic" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>;

package/dist/slider/SliderTrack.styles.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const trackVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
 export declare const rangeVariants: (props?: ({
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "basic" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>;

package/dist/slider/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),N=require("@base-ui/react/slider"),X=require("@spark-ui/components/form-field"),t=require("react"),S=require("class-variance-authority"),M=require("@spark-ui/hooks/use-merge-refs"),H=require("../FormFieldRequiredIndicator-CHfcoT2y.js"),J=require("../label/index.js"),K=require("../Slot-DQ8z2zsy.js"),Q=S.cva(["grid grid-cols-[1fr_auto] gap-y-sm gap-x-md relative","touch-none select-none","data-disabled:cursor-not-allowed data-disabled:opacity-dim-3"]),$=t.createContext({}),C=()=>t.useContext($),B=({intent:r="basic",children:e,className:a,ref:n,value:o,defaultValue:d,disabled:f,readOnly:v,name:s,onValueChange:c,onValueCommit:m,min:b=0,max:g=100,...h})=>{const l=X.useFormFieldControl(),x=l.disabled??f,p=l.readOnly??v,y=l.name??s,[I,R]=t.useState(l.labelId),[V,T]=t.useState(0),k=t.useRef(null),_=t.useRef(null),D=t.useCallback(u=>{R(u)},[]),G=t.useCallback(()=>(T(u=>u+1),()=>T(u=>u-1)),[]);return i.jsx($.Provider,{value:{intent:r,min:b,max:g,fieldLabelId:l.labelId||I,fieldId:l.id,onLabelId:D,hasValueInThumb:V>0,registerValueInThumb:G,controlRef:k,thumbRef:_},children:i.jsx(N.Slider.Root,{ref:n,"data-spark-component":"slider",className:Q({className:a}),orientation:"horizontal",disabled:x||p,thumbAlignment:"edge",name:y,"aria-describedby":l.description,"aria-invalid":l.isInvalid,"aria-disabled":x||p?!0:void 0,value:o!==void 0?[o]:void 0,defaultValue:d!==void 0?[d]:void 0,onValueChange:c?u=>{const j=Array.isArray(u)?u[0]??0:u;c(j)}:void 0,onValueCommitted:m?u=>{const j=Array.isArray(u)?u[0]??0:u;m(j)}:void 0,min:b,max:g,...h,children:e})})};B.displayName="Slider";const z=({className:r,ref:e,...a})=>{const{hasValueInThumb:n,controlRef:o}=C(),d=M.useMergeRefs(o,e);return i.jsx(N.Slider.Control,{"data-spark-component":"slider-control",ref:d,className:S.cx("min-h-sz-24 relative col-span-2 flex w-full min-w-0 flex-1 items-center",n&&"mt-xl",r),...a})};z.displayName="Slider.Control";const U=S.cva(["relative grow h-sz-4 bg-on-background/dim-4 rounded-sm"]),Y=S.cva(["absolute h-full rounded-sm","transition-none"],{variants:{intent:{main:["bg-main"],support:["bg-support"],accent:["bg-accent"],basic:["bg-basic"],info:["bg-info"],neutral:["bg-neutral"],success:["bg-success"],alert:["bg-alert"],error:["bg-error"]}},defaultVariants:{intent:"basic"}}),q=({className:r,ref:e,...a})=>{const{intent:n}=C();return i.jsx(N.Slider.Indicator,{"data-spark-component":"slider-indicator",ref:e,className:Y({intent:n,className:r}),...a})};q.displayName="Slider.Indicator";const Z=":slider-label",F=({htmlFor:r,id:e,className:a,children:n,requiredIndicator:o=i.jsx(H.FormFieldRequiredIndicator,{}),asChild:d,ref:f,...v})=>{const s=X.useFormFieldControl(),{fieldLabelId:c,fieldId:m,onLabelId:b}=C(),g=t.useId(),h=`${Z}-${g}`,l=e||c||s.labelId||h,x=d?void 0:r||m||s.id,p=s.disabled,y=s.isRequired,I=t.useRef(null),R=M.useMergeRefs(f,I);return t.useEffect(()=>{b&&!c&&!s.labelId&&b(l)},[b,c,s.labelId,l]),i.jsx(J.Label,{ref:R,id:l,"data-spark-component":"slider-label",htmlFor:x,className:S.cx(p?"text-on-surface/dim-3 pointer-events-none":void 0,a),asChild:d,...v,children:i.jsxs(i.Fragment,{children:[i.jsx(K.Slottable,{children:n}),y&&o]})})};F.displayName="Slider.Label";const L=t.forwardRef(({className:r,children:e},a)=>{const{max:n=100}=C(),o=e?e(n):n;return i.jsx("div",{"data-spark-component":"slider-max-value",ref:a,className:S.cx("text-on-surface/dim-1 text-body-2 col-start-2 text-right",r),children:o})});L.displayName="Slider.MaxValue";const w=t.forwardRef(({className:r,children:e},a)=>{const{min:n=0}=C(),o=e?e(n):n;return i.jsx("div",{"data-spark-component":"slider-min-value",ref:a,className:S.cx("text-on-surface/dim-1 text-body-2 col-start-1 text-left",r),children:o})});w.displayName="Slider.MinValue";const P=t.createContext(null),ee=()=>t.useContext(P),te=S.cva(["relative block size-sz-24 rounded-full cursor-pointer","outline-hidden","has-focus-visible:ring-2 has-focus-visible:ring-offset-2 has-focus-visible:ring-focus","data-disabled:hover:ring-0 data-disabled:cursor-not-allowed data-disabled:before:hidden","after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2","after:size-sz-24 after:rounded-full","before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2","before:size-sz-24 before:rounded-full before:border-solid before:border-sm before:transition-all before:duration-75","hover:before:size-sz-32 data-dragging:before:size-sz-32"],{variants:{intent:{main:["after:bg-main","before:bg-main-container before:border-main"],support:["after:bg-support","before:bg-support-container before:border-support"],accent:["after:bg-accent","before:bg-accent-container before:border-accent"],basic:["after:bg-basic","before:bg-basic-container before:border-basic"],info:["after:bg-info","before:bg-info-container before:border-info"],neutral:["after:bg-neutral","before:bg-neutral-container before:border-neutral"],success:["after:bg-success","before:bg-success-container before:border-success"],alert:["after:bg-alert","before:bg-alert-container before:border-alert"],error:["after:bg-error","before:bg-error-container before:border-error"]}},defaultVariants:{intent:"basic"}}),A=({className:r,ref:e,children:a,...n})=>{const{intent:o,fieldLabelId:d,fieldId:f,thumbRef:v}=C(),s=t.useRef(null),c=M.useMergeRefs(v,e??s);return i.jsx(P.Provider,{value:{isInsideThumb:!0},children:i.jsx(N.Slider.Thumb,{"data-spark-component":"slider-thumb",ref:c,id:f,className:te({intent:o,className:r}),"aria-labelledby":d,...n,children:a})})};A.displayName="Slider.Thumb";const O=({className:r,ref:e,...a})=>i.jsx(N.Slider.Track,{"data-spark-component":"slider-track",ref:e,className:U({className:r}),...a});O.displayName="Slider.Track";function re(r,e,a,n){const[o,d]=t.useState(0),[f,v]=t.useState(!1);return t.useLayoutEffect(()=>{const s=r.current,c=e.current,m=a.current;if(!s||!c||!m){d(0),f||requestAnimationFrame(()=>v(!0));return}let b=!1;const g=()=>{if(b)return;const l=s.getBoundingClientRect(),x=c.getBoundingClientRect(),p=m.scrollWidth;if(p===0){requestAnimationFrame(g);return}const y=x.left-l.left+x.width/2,I=p/2,R=l.width-p/2,T=Math.max(I,Math.min(R,y))-y;d(k=>k!==T?T:k)};g();const h=new ResizeObserver(g);return h.observe(s),h.observe(m),()=>{b=!0,h.disconnect()}},[r,e,a,n,f]),o}const E=({className:r,children:e,ref:a,...n})=>{const{registerValueInThumb:o,controlRef:d,thumbRef:f}=C(),s=ee()!==null,c=t.useRef(null),m=M.useMergeRefs(c,a),[b,g]=t.useState(0),h=re(d,f,c,b);t.useEffect(()=>{if(s)return o()},[s,o]);const l=S.cx(s?"absolute left-1/2 -translate-x-1/2 top-[calc(-100%-var(--spacing-sm))] text-body-1 font-bold whitespace-nowrap":"default:text-body-1 col-start-2 text-right default:font-bold",r),x=t.useCallback((y,I)=>{const R=y[0]??String(I[0]??""),V=I[0]??0;return g(V),typeof e=="function"?e(R,V):R},[e]),p=s?{transform:`translate(calc(0% + ${h}px), 0)`}:void 0;return i.jsx(N.Slider.Value,{"data-spark-component":"slider-value",ref:m,className:l,style:p,...n,children:x})};E.displayName="Slider.Value";const W=Object.assign(B,{Control:z,Indicator:q,Label:F,MaxValue:L,MinValue:w,Thumb:A,Track:O,Value:E});W.displayName="Slider";z.displayName="Slider.Control";q.displayName="Slider.Indicator";F.displayName="Slider.Label";L.displayName="Slider.MaxValue";w.displayName="Slider.MinValue";A.displayName="Slider.Thumb";O.displayName="Slider.Track";E.displayName="Slider.Value";exports.Slider=W;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),N=require("@base-ui/react/slider"),X=require("@spark-ui/components/form-field"),t=require("react"),S=require("class-variance-authority"),M=require("@spark-ui/hooks/use-merge-refs"),H=require("../FormFieldRequiredIndicator-CHfcoT2y.js"),J=require("../label/index.js"),K=require("../Slot-DQ8z2zsy.js"),Q=S.cva(["grid grid-cols-[1fr_auto] gap-y-sm gap-x-md relative","touch-none select-none","data-disabled:cursor-not-allowed data-disabled:opacity-dim-3"]),$=t.createContext({}),C=()=>t.useContext($),B=({intent:r="support",children:e,className:a,ref:n,value:o,defaultValue:d,disabled:f,readOnly:v,name:s,onValueChange:c,onValueCommit:m,min:b=0,max:p=100,...h})=>{const l=X.useFormFieldControl(),x=l.disabled??f,g=l.readOnly??v,y=l.name??s,[I,R]=t.useState(l.labelId),[V,T]=t.useState(0),k=t.useRef(null),_=t.useRef(null),D=t.useCallback(u=>{R(u)},[]),G=t.useCallback(()=>(T(u=>u+1),()=>T(u=>u-1)),[]);return i.jsx($.Provider,{value:{intent:r,min:b,max:p,fieldLabelId:l.labelId||I,fieldId:l.id,onLabelId:D,hasValueInThumb:V>0,registerValueInThumb:G,controlRef:k,thumbRef:_},children:i.jsx(N.Slider.Root,{ref:n,"data-spark-component":"slider",className:Q({className:a}),orientation:"horizontal",disabled:x||g,thumbAlignment:"edge",name:y,"aria-describedby":l.description,"aria-invalid":l.isInvalid,"aria-disabled":x||g?!0:void 0,value:o!==void 0?[o]:void 0,defaultValue:d!==void 0?[d]:void 0,onValueChange:c?u=>{const j=Array.isArray(u)?u[0]??0:u;c(j)}:void 0,onValueCommitted:m?u=>{const j=Array.isArray(u)?u[0]??0:u;m(j)}:void 0,min:b,max:p,...h,children:e})})};B.displayName="Slider";const z=({className:r,ref:e,...a})=>{const{hasValueInThumb:n,controlRef:o}=C(),d=M.useMergeRefs(o,e);return i.jsx(N.Slider.Control,{"data-spark-component":"slider-control",ref:d,className:S.cx("min-h-sz-24 relative col-span-2 flex w-full min-w-0 flex-1 items-center",n&&"mt-xl",r),...a})};z.displayName="Slider.Control";const U=S.cva(["relative grow h-sz-4 bg-on-background/dim-4 rounded-sm"]),Y=S.cva(["absolute h-full rounded-sm","transition-none"],{variants:{intent:{main:["bg-main"],support:["bg-support"],accent:["bg-accent"],info:["bg-info"],neutral:["bg-neutral"],success:["bg-success"],alert:["bg-alert"],error:["bg-error"]}},defaultVariants:{intent:"support"}}),q=({className:r,ref:e,...a})=>{const{intent:n}=C();return i.jsx(N.Slider.Indicator,{"data-spark-component":"slider-indicator",ref:e,className:Y({intent:n,className:r}),...a})};q.displayName="Slider.Indicator";const Z=":slider-label",F=({htmlFor:r,id:e,className:a,children:n,requiredIndicator:o=i.jsx(H.FormFieldRequiredIndicator,{}),asChild:d,ref:f,...v})=>{const s=X.useFormFieldControl(),{fieldLabelId:c,fieldId:m,onLabelId:b}=C(),p=t.useId(),h=`${Z}-${p}`,l=e||c||s.labelId||h,x=d?void 0:r||m||s.id,g=s.disabled,y=s.isRequired,I=t.useRef(null),R=M.useMergeRefs(f,I);return t.useEffect(()=>{b&&!c&&!s.labelId&&b(l)},[b,c,s.labelId,l]),i.jsx(J.Label,{ref:R,id:l,"data-spark-component":"slider-label",htmlFor:x,className:S.cx(g?"text-on-surface/dim-3 pointer-events-none":void 0,a),asChild:d,...v,children:i.jsxs(i.Fragment,{children:[i.jsx(K.Slottable,{children:n}),y&&o]})})};F.displayName="Slider.Label";const L=t.forwardRef(({className:r,children:e},a)=>{const{max:n=100}=C(),o=e?e(n):n;return i.jsx("div",{"data-spark-component":"slider-max-value",ref:a,className:S.cx("text-on-surface/dim-1 text-body-2 col-start-2 text-right",r),children:o})});L.displayName="Slider.MaxValue";const w=t.forwardRef(({className:r,children:e},a)=>{const{min:n=0}=C(),o=e?e(n):n;return i.jsx("div",{"data-spark-component":"slider-min-value",ref:a,className:S.cx("text-on-surface/dim-1 text-body-2 col-start-1 text-left",r),children:o})});w.displayName="Slider.MinValue";const P=t.createContext(null),ee=()=>t.useContext(P),te=S.cva(["relative block size-sz-24 rounded-full cursor-pointer","outline-hidden","has-focus-visible:ring-2 has-focus-visible:ring-offset-2 has-focus-visible:ring-focus","data-disabled:hover:ring-0 data-disabled:cursor-not-allowed data-disabled:before:hidden","after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2","after:size-sz-24 after:rounded-full","before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2","before:size-sz-24 before:rounded-full before:border-solid before:border-sm before:transition-all before:duration-75","hover:before:size-sz-32 data-dragging:before:size-sz-32"],{variants:{intent:{main:["after:bg-main","before:bg-main-container before:border-main"],support:["after:bg-support","before:bg-support-container before:border-support"],accent:["after:bg-accent","before:bg-accent-container before:border-accent"],info:["after:bg-info","before:bg-info-container before:border-info"],neutral:["after:bg-neutral","before:bg-neutral-container before:border-neutral"],success:["after:bg-success","before:bg-success-container before:border-success"],alert:["after:bg-alert","before:bg-alert-container before:border-alert"],error:["after:bg-error","before:bg-error-container before:border-error"]}},defaultVariants:{intent:"support"}}),A=({className:r,ref:e,children:a,...n})=>{const{intent:o,fieldLabelId:d,fieldId:f,thumbRef:v}=C(),s=t.useRef(null),c=M.useMergeRefs(v,e??s);return i.jsx(P.Provider,{value:{isInsideThumb:!0},children:i.jsx(N.Slider.Thumb,{"data-spark-component":"slider-thumb",ref:c,id:f,className:te({intent:o,className:r}),"aria-labelledby":d,...n,children:a})})};A.displayName="Slider.Thumb";const O=({className:r,ref:e,...a})=>i.jsx(N.Slider.Track,{"data-spark-component":"slider-track",ref:e,className:U({className:r}),...a});O.displayName="Slider.Track";function re(r,e,a,n){const[o,d]=t.useState(0),[f,v]=t.useState(!1);return t.useLayoutEffect(()=>{const s=r.current,c=e.current,m=a.current;if(!s||!c||!m){d(0),f||requestAnimationFrame(()=>v(!0));return}let b=!1;const p=()=>{if(b)return;const l=s.getBoundingClientRect(),x=c.getBoundingClientRect(),g=m.scrollWidth;if(g===0){requestAnimationFrame(p);return}const y=x.left-l.left+x.width/2,I=g/2,R=l.width-g/2,T=Math.max(I,Math.min(R,y))-y;d(k=>k!==T?T:k)};p();const h=new ResizeObserver(p);return h.observe(s),h.observe(m),()=>{b=!0,h.disconnect()}},[r,e,a,n,f]),o}const E=({className:r,children:e,ref:a,...n})=>{const{registerValueInThumb:o,controlRef:d,thumbRef:f}=C(),s=ee()!==null,c=t.useRef(null),m=M.useMergeRefs(c,a),[b,p]=t.useState(0),h=re(d,f,c,b);t.useEffect(()=>{if(s)return o()},[s,o]);const l=S.cx(s?"absolute left-1/2 -translate-x-1/2 top-[calc(-100%-var(--spacing-sm))] text-body-1 font-bold whitespace-nowrap":"default:text-body-1 col-start-2 text-right default:font-bold",r),x=t.useCallback((y,I)=>{const R=y[0]??String(I[0]??""),V=I[0]??0;return p(V),typeof e=="function"?e(R,V):R},[e]),g=s?{transform:`translate(calc(0% + ${h}px), 0)`}:void 0;return i.jsx(N.Slider.Value,{"data-spark-component":"slider-value",ref:m,className:l,style:g,...n,children:x})};E.displayName="Slider.Value";const W=Object.assign(B,{Control:z,Indicator:q,Label:F,MaxValue:L,MinValue:w,Thumb:A,Track:O,Value:E});W.displayName="Slider";z.displayName="Slider.Control";q.displayName="Slider.Indicator";F.displayName="Slider.Label";L.displayName="Slider.MaxValue";w.displayName="Slider.MinValue";A.displayName="Slider.Thumb";O.displayName="Slider.Track";E.displayName="Slider.Value";exports.Slider=W;
 //# sourceMappingURL=index.js.map

package/dist/slider/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/slider/Slider.styles.ts","../../src/slider/SliderContext.tsx","../../src/slider/Slider.tsx","../../src/slider/SliderControl.tsx","../../src/slider/SliderTrack.styles.ts","../../src/slider/SliderIndicator.tsx","../../src/slider/SliderLabel.tsx","../../src/slider/SliderMaxValue.tsx","../../src/slider/SliderMinValue.tsx","../../src/slider/SliderThumbContext.tsx","../../src/slider/SliderThumb.styles.ts","../../src/slider/SliderThumb.tsx","../../src/slider/SliderTrack.tsx","../../src/slider/useSliderValueBoundaries.ts","../../src/slider/SliderValue.tsx","../../src/slider/index.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'grid grid-cols-[1fr_auto] gap-y-sm gap-x-md relative',\n  'touch-none select-none',\n  'data-disabled:cursor-not-allowed data-disabled:opacity-dim-3',\n])\n","import type { RefObject } from 'react'\nimport { createContext, useContext } from 'react'\n\nimport type { SliderProps } from './Slider'\n\nexport type SliderContextInterface = Pick<SliderProps, 'intent' | 'min' | 'max'> & {\n  fieldLabelId?: string\n  fieldId?: string\n  onLabelId?: (id: string | undefined) => void\n  hasValueInThumb: boolean\n  registerValueInThumb: () => () => void\n  controlRef: RefObject<HTMLElement | null>\n  thumbRef: RefObject<HTMLElement | null>\n}\n\nexport const SliderContext = createContext<SliderContextInterface>({} as SliderContextInterface)\n\nexport const useSliderContext = () => useContext(SliderContext)\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { ComponentProps, type PropsWithChildren, Ref, useCallback, useRef, useState } from 'react'\n\nimport { rootStyles } from './Slider.styles'\nimport { SliderContext } from './SliderContext'\nimport type { SliderRangeVariantsProps } from './SliderTrack.styles'\n\nexport interface SliderProps\n  extends Omit<\n      ComponentProps<typeof BaseSlider.Root>,\n      'render' | 'orientation' | 'onValueChange' | 'onValueCommitted'\n    >,\n    PropsWithChildren<SliderRangeVariantsProps> {\n  /**\n   * The value of the slider when initially rendered. Use when you do not need to control the state of the slider.\n   */\n  defaultValue?: number\n  /**\n   * The controlled value of the slider. Must be used in conjunction with `onValueChange`.\n   */\n  value?: number\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: number) => void\n  /**\n   * Event handler called when the value changes at the end of an interaction. Useful when you only need to capture a final value e.g. to update a backend service.\n   */\n  onValueCommit?: (value: number) => void\n  /**\n   * The name of the slider. Submitted with its owning form as part of a name/value pair.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * When `true`, prevents the user from interacting with the slider.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * Sets the slider as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The minimum value for the range.\n   * @default 0\n   */\n  min?: number\n  /**\n   * The maximum value for the range.\n   * @default 100\n   */\n  max?: number\n  /**\n   * The stepping interval.\n   * @default 1\n   */\n  step?: number\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const Slider = ({\n  intent = 'basic',\n  children,\n  className,\n  ref,\n  value: valueProp,\n  defaultValue: defaultValueProp,\n  disabled: disabledProp,\n  readOnly: readOnlyProp,\n  name: nameProp,\n  onValueChange,\n  onValueCommit,\n  min = 0,\n  max = 100,\n  ...rest\n}: SliderProps) => {\n  const field = useFormFieldControl()\n\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n\n  const [labelId, setLabelId] = useState<string | undefined>(field.labelId)\n  const [valueInThumbCount, setValueInThumbCount] = useState(0)\n  const controlRef = useRef<HTMLElement | null>(null)\n  const thumbRef = useRef<HTMLElement | null>(null)\n\n  const handleLabelId = useCallback((id: string | undefined) => {\n    setLabelId(id)\n  }, [])\n\n  const registerValueInThumb = useCallback(() => {\n    setValueInThumbCount(c => c + 1)\n    return () => setValueInThumbCount(c => c - 1)\n  }, [])\n\n  return (\n    <SliderContext.Provider\n      value={{\n        intent,\n        min,\n        max,\n        fieldLabelId: field.labelId || labelId,\n        fieldId: field.id,\n        onLabelId: handleLabelId,\n        hasValueInThumb: valueInThumbCount > 0,\n        registerValueInThumb,\n        controlRef,\n        thumbRef,\n      }}\n    >\n      <BaseSlider.Root\n        ref={ref}\n        data-spark-component=\"slider\"\n        className={rootStyles({ className })}\n        orientation=\"horizontal\"\n        disabled={disabled || readOnly}\n        thumbAlignment=\"edge\"\n        name={name}\n        aria-describedby={field.description}\n        aria-invalid={field.isInvalid}\n        aria-disabled={disabled || readOnly ? true : undefined}\n        value={valueProp !== undefined ? [valueProp] : undefined}\n        defaultValue={\n          defaultValueProp !== undefined ? [defaultValueProp] : undefined\n        }\n        onValueChange={\n          onValueChange\n            ? (value: number | readonly number[]) => {\n                const v = Array.isArray(value) ? value[0] ?? 0 : value\n                onValueChange(v)\n              }\n            : undefined\n        }\n        onValueCommitted={\n          onValueCommit\n            ? (value: number | readonly number[]) => {\n                const v = Array.isArray(value) ? value[0] ?? 0 : value\n                onValueCommit(v)\n              }\n            : undefined\n        }\n        min={min}\n        max={max}\n        {...rest}\n      >\n        {children}\n      </BaseSlider.Root>\n    </SliderContext.Provider>\n  )\n}\n\nSlider.displayName = 'Slider'\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nimport { useSliderContext } from './SliderContext'\n\nexport type SliderControlProps = Omit<ComponentProps<typeof BaseSlider.Control>, 'render'>\n\nexport const SliderControl = ({ className, ref, ...rest }: SliderControlProps) => {\n  const { hasValueInThumb, controlRef } = useSliderContext()\n  const mergedRef = useMergeRefs(controlRef, ref)\n\n  return (\n    <BaseSlider.Control\n      data-spark-component=\"slider-control\"\n      ref={mergedRef}\n      className={cx(\n        'min-h-sz-24 relative col-span-2 flex w-full min-w-0 flex-1 items-center',\n        hasValueInThumb && 'mt-xl',\n        className\n      )}\n      {...rest}\n    />\n  )\n}\n\nSliderControl.displayName = 'Slider.Control'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const trackVariants = cva(['relative grow h-sz-4 bg-on-background/dim-4 rounded-sm'])\n\nexport const rangeVariants = cva(\n  [\n    'absolute h-full rounded-sm',\n    // Disable transitions during drag to eliminate latency\n    'transition-none',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['bg-main'],\n        support: ['bg-support'],\n        accent: ['bg-accent'],\n        basic: ['bg-basic'],\n        info: ['bg-info'],\n        neutral: ['bg-neutral'],\n        success: ['bg-success'],\n        alert: ['bg-alert'],\n        error: ['bg-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { ComponentProps } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { rangeVariants } from './SliderTrack.styles'\n\nexport type SliderIndicatorProps = Omit<ComponentProps<typeof BaseSlider.Indicator>, 'render'>\n\nexport const SliderIndicator = ({ className, ref, ...rest }: SliderIndicatorProps) => {\n  const { intent } = useSliderContext()\n\n  return (\n    <BaseSlider.Indicator\n      data-spark-component=\"slider-indicator\"\n      ref={ref}\n      className={rangeVariants({ intent, className })}\n      {...rest}\n    />\n  )\n}\n\nSliderIndicator.displayName = 'Slider.Indicator'\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport { ReactNode, Ref, useEffect, useId, useRef } from 'react'\n\nimport { FormFieldRequiredIndicator } from '../form-field/FormFieldRequiredIndicator'\nimport { Label, LabelProps } from '../label'\nimport { Slottable } from '../slot'\nimport { useSliderContext } from './SliderContext'\n\nconst ID_PREFIX = ':slider-label'\n\nexport interface SliderLabelProps extends LabelProps {\n  /**\n   * Element shown when the input is required inside the label.\n   */\n  requiredIndicator?: ReactNode\n  ref?: Ref<HTMLLabelElement>\n}\n\nexport const SliderLabel = ({\n  htmlFor: htmlForProp,\n  id: idProp,\n  className,\n  children,\n  requiredIndicator = <FormFieldRequiredIndicator />,\n  asChild,\n  ref,\n  ...others\n}: SliderLabelProps) => {\n  const field = useFormFieldControl()\n  const { fieldLabelId, fieldId, onLabelId } = useSliderContext()\n\n  // Generate an id if not provided and no FormField labelId is available\n  const internalId = useId()\n  const generatedId = `${ID_PREFIX}-${internalId}`\n  const labelId = idProp || fieldLabelId || field.labelId || generatedId\n\n  // Use FormField id for htmlFor if present, otherwise use fieldId from context, or the prop\n  const htmlFor = asChild ? undefined : htmlForProp || fieldId || field.id\n\n  // Get disabled and required state from FormField if present\n  const disabled = field.disabled\n  const isRequired = field.isRequired\n\n  // Notify SliderContext of the label id if no FormField is present\n  const labelRef = useRef<HTMLLabelElement>(null)\n  const mergedRef = useMergeRefs(ref, labelRef)\n\n  useEffect(() => {\n    if (onLabelId && !fieldLabelId && !field.labelId) {\n      onLabelId(labelId)\n    }\n  }, [onLabelId, fieldLabelId, field.labelId, labelId])\n\n  return (\n    <Label\n      ref={mergedRef}\n      id={labelId}\n      data-spark-component=\"slider-label\"\n      htmlFor={htmlFor}\n      className={cx(disabled ? 'text-on-surface/dim-3 pointer-events-none' : undefined, className)}\n      asChild={asChild}\n      {...others}\n    >\n      <>\n        <Slottable>{children}</Slottable>\n        {isRequired && requiredIndicator}\n      </>\n    </Label>\n  )\n}\n\nSliderLabel.displayName = 'Slider.Label'\n","import { cx } from 'class-variance-authority'\nimport { forwardRef, type ReactNode } from 'react'\n\nimport { useSliderContext } from './SliderContext'\n\nexport interface SliderMaxValueProps {\n  className?: string\n  children?: (value: number) => ReactNode\n}\n\nexport const SliderMaxValue = forwardRef<HTMLDivElement, SliderMaxValueProps>(\n  ({ className, children }, ref) => {\n    const { max = 100 } = useSliderContext()\n\n    const content = children ? children(max) : max\n\n    return (\n      <div\n        data-spark-component=\"slider-max-value\"\n        ref={ref}\n        className={cx('text-on-surface/dim-1 text-body-2 col-start-2 text-right', className)}\n      >\n        {content}\n      </div>\n    )\n  }\n)\n\nSliderMaxValue.displayName = 'Slider.MaxValue'\n","import { cx } from 'class-variance-authority'\nimport { forwardRef, type ReactNode } from 'react'\n\nimport { useSliderContext } from './SliderContext'\n\nexport interface SliderMinValueProps {\n  className?: string\n  children?: (value: number) => ReactNode\n}\n\nexport const SliderMinValue = forwardRef<HTMLDivElement, SliderMinValueProps>(\n  ({ className, children }, ref) => {\n    const { min = 0 } = useSliderContext()\n\n    const content = children ? children(min) : min\n\n    return (\n      <div\n        data-spark-component=\"slider-min-value\"\n        ref={ref}\n        className={cx('text-on-surface/dim-1 text-body-2 col-start-1 text-left', className)}\n      >\n        {content}\n      </div>\n    )\n  }\n)\n\nSliderMinValue.displayName = 'Slider.MinValue'\n","import { createContext, useContext } from 'react'\n\nexport interface SliderThumbContextValue {\n  isInsideThumb: true\n}\n\nexport const SliderThumbContext = createContext<SliderThumbContextValue | null>(null)\n\nexport const useSliderThumbContext = () => useContext(SliderThumbContext)\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const thumbVariants = cva(\n  [\n    'relative block size-sz-24 rounded-full cursor-pointer',\n    'outline-hidden',\n    'has-focus-visible:ring-2 has-focus-visible:ring-offset-2 has-focus-visible:ring-focus',\n    'data-disabled:hover:ring-0 data-disabled:cursor-not-allowed data-disabled:before:hidden',\n    // visual thumb\n    'after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2',\n    'after:size-sz-24 after:rounded-full',\n    // hover effect\n    'before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2',\n    'before:size-sz-24 before:rounded-full before:border-solid before:border-sm before:transition-all before:duration-75',\n    'hover:before:size-sz-32 data-dragging:before:size-sz-32',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['after:bg-main', 'before:bg-main-container before:border-main'],\n        support: ['after:bg-support', 'before:bg-support-container before:border-support'],\n        accent: ['after:bg-accent', 'before:bg-accent-container before:border-accent'],\n        basic: ['after:bg-basic', 'before:bg-basic-container before:border-basic'],\n        info: ['after:bg-info', 'before:bg-info-container before:border-info'],\n        neutral: ['after:bg-neutral', 'before:bg-neutral-container before:border-neutral'],\n        success: ['after:bg-success', 'before:bg-success-container before:border-success'],\n        alert: ['after:bg-alert', 'before:bg-alert-container before:border-alert'],\n        error: ['after:bg-error', 'before:bg-error-container before:border-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { ComponentProps, type PropsWithChildren, useRef } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { SliderThumbContext } from './SliderThumbContext'\nimport { thumbVariants } from './SliderThumb.styles'\n\nexport type SliderThumbProps = Omit<\n  ComponentProps<typeof BaseSlider.Thumb>,\n  'render' | 'index'\n> &\n  PropsWithChildren\n\nexport const SliderThumb = ({\n  className,\n  ref: forwardedRef,\n  children,\n  ...rest\n}: SliderThumbProps) => {\n  const { intent, fieldLabelId, fieldId, thumbRef: contextThumbRef } = useSliderContext()\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(contextThumbRef, forwardedRef ?? innerRef)\n\n  return (\n    <SliderThumbContext.Provider value={{ isInsideThumb: true }}>\n      <BaseSlider.Thumb\n        data-spark-component=\"slider-thumb\"\n        ref={ref}\n        id={fieldId}\n        className={thumbVariants({ intent, className })}\n        aria-labelledby={fieldLabelId}\n        {...rest}\n      >\n        {children}\n      </BaseSlider.Thumb>\n    </SliderThumbContext.Provider>\n  )\n}\n\nSliderThumb.displayName = 'Slider.Thumb'\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { ComponentProps } from 'react'\n\nimport { trackVariants } from './SliderTrack.styles'\n\nexport type SliderTrackProps = Omit<ComponentProps<typeof BaseSlider.Track>, 'render'>\n\nexport const SliderTrack = ({ className, ref, ...rest }: SliderTrackProps) => {\n  return (\n    <BaseSlider.Track\n      data-spark-component=\"slider-track\"\n      ref={ref}\n      className={trackVariants({ className })}\n      {...rest}\n    />\n  )\n}\n\nSliderTrack.displayName = 'Slider.Track'\n","import type { RefObject } from 'react'\nimport { useLayoutEffect, useState } from 'react'\n\n/**\n * Computes the translateX (in pixels) to apply to the value element so it stays\n * within the horizontal bounds of the slider control when displayed inside the thumb.\n *\n * @param controlRef - Ref to the slider control (track container)\n * @param thumbRef - Ref to the thumb element\n * @param valueRef - Ref to the value label element\n * @param value - Current slider value (0–100 or min–max), used to re-run when thumb moves\n * @returns translateX in pixels (positive = right, negative = left), or 0 if refs are missing\n */\nexport function useSliderValueBoundaries(\n  controlRef: RefObject<HTMLElement | null>,\n  thumbRef: RefObject<HTMLElement | null>,\n  valueRef: RefObject<HTMLElement | null>,\n  value: number\n): number {\n  const [translateX, setTranslateX] = useState(0)\n  const [refsRetryScheduled, setRefsRetryScheduled] = useState(false)\n\n  useLayoutEffect(() => {\n    const control = controlRef.current\n    const thumb = thumbRef.current\n    const valueEl = valueRef.current\n\n    if (!control || !thumb || !valueEl) {\n      setTranslateX(0)\n      // Re-run once on next frame when refs may be set (e.g. Slider.Value mounts after Control/Thumb)\n      if (!refsRetryScheduled) {\n        requestAnimationFrame(() => setRefsRetryScheduled(true))\n      }\n\n      return\n    }\n\n    let cancelled = false\n\n    const compute = () => {\n      if (cancelled) return\n\n      const controlRect = control.getBoundingClientRect()\n      const thumbRect = thumb.getBoundingClientRect()\n      const valueWidth = valueEl.scrollWidth\n\n      // Skip until value label has been laid out (content from render prop may not be ready on first paint)\n      if (valueWidth === 0) {\n        requestAnimationFrame(compute)\n\n        return\n      }\n\n      const thumbCenterPx = thumbRect.left - controlRect.left + thumbRect.width / 2\n\n      const valueCenterMin = valueWidth / 2\n      const valueCenterMax = controlRect.width - valueWidth / 2\n\n      const clampedCenter = Math.max(valueCenterMin, Math.min(valueCenterMax, thumbCenterPx))\n      const nextTranslateX = clampedCenter - thumbCenterPx\n\n      setTranslateX(prev => (prev !== nextTranslateX ? nextTranslateX : prev))\n    }\n\n    compute()\n\n    const resizeObserver = new ResizeObserver(compute)\n    resizeObserver.observe(control)\n    resizeObserver.observe(valueEl)\n\n    return () => {\n      cancelled = true\n      resizeObserver.disconnect()\n    }\n  }, [controlRef, thumbRef, valueRef, value, refsRetryScheduled])\n\n  return translateX\n}\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport type { ReactNode } from 'react'\nimport { ComponentProps, useCallback, useEffect, useRef, useState } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { useSliderThumbContext } from './SliderThumbContext'\nimport { useSliderValueBoundaries } from './useSliderValueBoundaries'\n\nexport type SliderValueProps = Omit<ComponentProps<typeof BaseSlider.Value>, 'render'>\n\n/**\n * Normalizes Base UI's (formattedValues, values) to single (formatted, value) for the render prop.\n */\nexport const SliderValue = ({ className, children, ref, ...rest }: SliderValueProps) => {\n  const { registerValueInThumb, controlRef, thumbRef } = useSliderContext()\n  const thumbContext = useSliderThumbContext()\n  const isInsideThumb = thumbContext !== null\n\n  const valueRef = useRef<HTMLOutputElement | null>(null)\n  const mergedRef = useMergeRefs(valueRef, ref)\n\n  const [currentValue, setCurrentValue] = useState(0)\n  const translateX = useSliderValueBoundaries(controlRef, thumbRef, valueRef, currentValue)\n\n  useEffect(() => {\n    if (!isInsideThumb) return\n\n    return registerValueInThumb()\n  }, [isInsideThumb, registerValueInThumb])\n\n  const resolvedClassName = cx(\n    isInsideThumb\n      ? 'absolute left-1/2 -translate-x-1/2 top-[calc(-100%-var(--spacing-sm))] text-body-1 font-bold whitespace-nowrap'\n      : 'default:text-body-1 col-start-2 text-right default:font-bold',\n    className\n  )\n\n  const normalizedChildren = useCallback(\n    (formattedValues: readonly string[], values: readonly number[]) => {\n      const formatted = formattedValues[0] ?? String(values[0] ?? '')\n      const value = values[0] ?? 0\n      setCurrentValue(value)\n      if (typeof children === 'function') {\n        return (children as unknown as (formatted: string, value: number) => ReactNode)(\n          formatted,\n          value\n        )\n      }\n\n      return formatted\n    },\n    [children]\n  )\n\n  const style = isInsideThumb\n    ? { transform: `translate(calc(0% + ${translateX}px), 0)` }\n    : undefined\n\n  return (\n    <BaseSlider.Value\n      data-spark-component=\"slider-value\"\n      ref={mergedRef}\n      className={resolvedClassName}\n      style={style}\n      {...rest}\n    >\n      {normalizedChildren}\n    </BaseSlider.Value>\n  )\n}\n\nSliderValue.displayName = 'Slider.Value'\n","import { Slider as Root, type SliderProps } from './Slider'\nimport { SliderControl as Control, type SliderControlProps } from './SliderControl'\nimport { SliderIndicator as Indicator, type SliderIndicatorProps } from './SliderIndicator'\nimport { SliderLabel as Label, type SliderLabelProps } from './SliderLabel'\nimport { SliderMaxValue as MaxValue, type SliderMaxValueProps } from './SliderMaxValue'\nimport { SliderMinValue as MinValue, type SliderMinValueProps } from './SliderMinValue'\nimport { SliderThumb as Thumb, type SliderThumbProps } from './SliderThumb'\nimport { SliderTrack as Track, type SliderTrackProps } from './SliderTrack'\nimport { SliderValue as Value, type SliderValueProps } from './SliderValue'\n\nexport const Slider: typeof Root & {\n  Control: typeof Control\n  Indicator: typeof Indicator\n  Label: typeof Label\n  MaxValue: typeof MaxValue\n  MinValue: typeof MinValue\n  Thumb: typeof Thumb\n  Track: typeof Track\n  Value: typeof Value\n} = Object.assign(Root, {\n  Control,\n  Indicator,\n  Label,\n  MaxValue,\n  MinValue,\n  Thumb,\n  Track,\n  Value,\n})\n\nSlider.displayName = 'Slider'\nControl.displayName = 'Slider.Control'\nIndicator.displayName = 'Slider.Indicator'\nLabel.displayName = 'Slider.Label'\nMaxValue.displayName = 'Slider.MaxValue'\nMinValue.displayName = 'Slider.MinValue'\nThumb.displayName = 'Slider.Thumb'\nTrack.displayName = 'Slider.Track'\nValue.displayName = 'Slider.Value'\n\nexport type {\n  SliderProps,\n  SliderControlProps,\n  SliderIndicatorProps,\n  SliderLabelProps,\n  SliderMaxValueProps,\n  SliderMinValueProps,\n  SliderThumbProps,\n  SliderTrackProps,\n  SliderValueProps,\n}\n"],"names":["rootStyles","cva","SliderContext","createContext","useSliderContext","useContext","Slider","intent","children","className","ref","valueProp","defaultValueProp","disabledProp","readOnlyProp","nameProp","onValueChange","onValueCommit","min","max","rest","field","useFormFieldControl","disabled","readOnly","name","labelId","setLabelId","useState","valueInThumbCount","setValueInThumbCount","controlRef","useRef","thumbRef","handleLabelId","useCallback","id","registerValueInThumb","c","jsx","BaseSlider","value","v","SliderControl","hasValueInThumb","mergedRef","useMergeRefs","cx","trackVariants","rangeVariants","SliderIndicator","ID_PREFIX","SliderLabel","htmlForProp","idProp","requiredIndicator","FormFieldRequiredIndicator","asChild","others","fieldLabelId","fieldId","onLabelId","internalId","useId","generatedId","htmlFor","isRequired","labelRef","useEffect","Label","jsxs","Fragment","Slottable","SliderMaxValue","forwardRef","content","SliderMinValue","SliderThumbContext","useSliderThumbContext","thumbVariants","SliderThumb","forwardedRef","contextThumbRef","innerRef","SliderTrack","useSliderValueBoundaries","valueRef","translateX","setTranslateX","refsRetryScheduled","setRefsRetryScheduled","useLayoutEffect","control","thumb","valueEl","cancelled","compute","controlRect","thumbRect","valueWidth","thumbCenterPx","valueCenterMin","valueCenterMax","nextTranslateX","prev","resizeObserver","SliderValue","isInsideThumb","currentValue","setCurrentValue","resolvedClassName","normalizedChildren","formattedValues","values","formatted","style","Root","Control","Indicator","MaxValue","MinValue","Thumb","Track","Value"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/slider/Slider.styles.ts","../../src/slider/SliderContext.tsx","../../src/slider/Slider.tsx","../../src/slider/SliderControl.tsx","../../src/slider/SliderTrack.styles.ts","../../src/slider/SliderIndicator.tsx","../../src/slider/SliderLabel.tsx","../../src/slider/SliderMaxValue.tsx","../../src/slider/SliderMinValue.tsx","../../src/slider/SliderThumbContext.tsx","../../src/slider/SliderThumb.styles.ts","../../src/slider/SliderThumb.tsx","../../src/slider/SliderTrack.tsx","../../src/slider/useSliderValueBoundaries.ts","../../src/slider/SliderValue.tsx","../../src/slider/index.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'grid grid-cols-[1fr_auto] gap-y-sm gap-x-md relative',\n  'touch-none select-none',\n  'data-disabled:cursor-not-allowed data-disabled:opacity-dim-3',\n])\n","import type { RefObject } from 'react'\nimport { createContext, useContext } from 'react'\n\nimport type { SliderProps } from './Slider'\n\nexport type SliderContextInterface = Pick<SliderProps, 'intent' | 'min' | 'max'> & {\n  fieldLabelId?: string\n  fieldId?: string\n  onLabelId?: (id: string | undefined) => void\n  hasValueInThumb: boolean\n  registerValueInThumb: () => () => void\n  controlRef: RefObject<HTMLElement | null>\n  thumbRef: RefObject<HTMLElement | null>\n}\n\nexport const SliderContext = createContext<SliderContextInterface>({} as SliderContextInterface)\n\nexport const useSliderContext = () => useContext(SliderContext)\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { ComponentProps, type PropsWithChildren, Ref, useCallback, useRef, useState } from 'react'\n\nimport { rootStyles } from './Slider.styles'\nimport { SliderContext } from './SliderContext'\nimport type { SliderRangeVariantsProps } from './SliderTrack.styles'\n\nexport interface SliderProps\n  extends Omit<\n      ComponentProps<typeof BaseSlider.Root>,\n      'render' | 'orientation' | 'onValueChange' | 'onValueCommitted'\n    >,\n    PropsWithChildren<SliderRangeVariantsProps> {\n  /**\n   * The value of the slider when initially rendered. Use when you do not need to control the state of the slider.\n   */\n  defaultValue?: number\n  /**\n   * The controlled value of the slider. Must be used in conjunction with `onValueChange`.\n   */\n  value?: number\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: number) => void\n  /**\n   * Event handler called when the value changes at the end of an interaction. Useful when you only need to capture a final value e.g. to update a backend service.\n   */\n  onValueCommit?: (value: number) => void\n  /**\n   * The name of the slider. Submitted with its owning form as part of a name/value pair.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * When `true`, prevents the user from interacting with the slider.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * Sets the slider as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The minimum value for the range.\n   * @default 0\n   */\n  min?: number\n  /**\n   * The maximum value for the range.\n   * @default 100\n   */\n  max?: number\n  /**\n   * The stepping interval.\n   * @default 1\n   */\n  step?: number\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const Slider = ({\n  intent = 'support',\n  children,\n  className,\n  ref,\n  value: valueProp,\n  defaultValue: defaultValueProp,\n  disabled: disabledProp,\n  readOnly: readOnlyProp,\n  name: nameProp,\n  onValueChange,\n  onValueCommit,\n  min = 0,\n  max = 100,\n  ...rest\n}: SliderProps) => {\n  const field = useFormFieldControl()\n\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n\n  const [labelId, setLabelId] = useState<string | undefined>(field.labelId)\n  const [valueInThumbCount, setValueInThumbCount] = useState(0)\n  const controlRef = useRef<HTMLElement | null>(null)\n  const thumbRef = useRef<HTMLElement | null>(null)\n\n  const handleLabelId = useCallback((id: string | undefined) => {\n    setLabelId(id)\n  }, [])\n\n  const registerValueInThumb = useCallback(() => {\n    setValueInThumbCount(c => c + 1)\n\n    return () => setValueInThumbCount(c => c - 1)\n  }, [])\n\n  return (\n    <SliderContext.Provider\n      value={{\n        intent,\n        min,\n        max,\n        fieldLabelId: field.labelId || labelId,\n        fieldId: field.id,\n        onLabelId: handleLabelId,\n        hasValueInThumb: valueInThumbCount > 0,\n        registerValueInThumb,\n        controlRef,\n        thumbRef,\n      }}\n    >\n      <BaseSlider.Root\n        ref={ref}\n        data-spark-component=\"slider\"\n        className={rootStyles({ className })}\n        orientation=\"horizontal\"\n        disabled={disabled || readOnly}\n        thumbAlignment=\"edge\"\n        name={name}\n        aria-describedby={field.description}\n        aria-invalid={field.isInvalid}\n        aria-disabled={disabled || readOnly ? true : undefined}\n        value={valueProp !== undefined ? [valueProp] : undefined}\n        defaultValue={defaultValueProp !== undefined ? [defaultValueProp] : undefined}\n        onValueChange={\n          onValueChange\n            ? (value: number | readonly number[]) => {\n                const v = Array.isArray(value) ? (value[0] ?? 0) : value\n                onValueChange(v)\n              }\n            : undefined\n        }\n        onValueCommitted={\n          onValueCommit\n            ? (value: number | readonly number[]) => {\n                const v = Array.isArray(value) ? (value[0] ?? 0) : value\n                onValueCommit(v)\n              }\n            : undefined\n        }\n        min={min}\n        max={max}\n        {...rest}\n      >\n        {children}\n      </BaseSlider.Root>\n    </SliderContext.Provider>\n  )\n}\n\nSlider.displayName = 'Slider'\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nimport { useSliderContext } from './SliderContext'\n\nexport type SliderControlProps = Omit<ComponentProps<typeof BaseSlider.Control>, 'render'>\n\nexport const SliderControl = ({ className, ref, ...rest }: SliderControlProps) => {\n  const { hasValueInThumb, controlRef } = useSliderContext()\n  const mergedRef = useMergeRefs(controlRef, ref)\n\n  return (\n    <BaseSlider.Control\n      data-spark-component=\"slider-control\"\n      ref={mergedRef}\n      className={cx(\n        'min-h-sz-24 relative col-span-2 flex w-full min-w-0 flex-1 items-center',\n        hasValueInThumb && 'mt-xl',\n        className\n      )}\n      {...rest}\n    />\n  )\n}\n\nSliderControl.displayName = 'Slider.Control'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const trackVariants = cva(['relative grow h-sz-4 bg-on-background/dim-4 rounded-sm'])\n\nexport const rangeVariants = cva(\n  [\n    'absolute h-full rounded-sm',\n    // Disable transitions during drag to eliminate latency\n    'transition-none',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['bg-main'],\n        support: ['bg-support'],\n        accent: ['bg-accent'],\n        info: ['bg-info'],\n        neutral: ['bg-neutral'],\n        success: ['bg-success'],\n        alert: ['bg-alert'],\n        error: ['bg-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'support',\n    },\n  }\n)\n\nexport type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { ComponentProps } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { rangeVariants } from './SliderTrack.styles'\n\nexport type SliderIndicatorProps = Omit<ComponentProps<typeof BaseSlider.Indicator>, 'render'>\n\nexport const SliderIndicator = ({ className, ref, ...rest }: SliderIndicatorProps) => {\n  const { intent } = useSliderContext()\n\n  return (\n    <BaseSlider.Indicator\n      data-spark-component=\"slider-indicator\"\n      ref={ref}\n      className={rangeVariants({ intent, className })}\n      {...rest}\n    />\n  )\n}\n\nSliderIndicator.displayName = 'Slider.Indicator'\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport { ReactNode, Ref, useEffect, useId, useRef } from 'react'\n\nimport { FormFieldRequiredIndicator } from '../form-field/FormFieldRequiredIndicator'\nimport { Label, LabelProps } from '../label'\nimport { Slottable } from '../slot'\nimport { useSliderContext } from './SliderContext'\n\nconst ID_PREFIX = ':slider-label'\n\nexport interface SliderLabelProps extends LabelProps {\n  /**\n   * Element shown when the input is required inside the label.\n   */\n  requiredIndicator?: ReactNode\n  ref?: Ref<HTMLLabelElement>\n}\n\nexport const SliderLabel = ({\n  htmlFor: htmlForProp,\n  id: idProp,\n  className,\n  children,\n  requiredIndicator = <FormFieldRequiredIndicator />,\n  asChild,\n  ref,\n  ...others\n}: SliderLabelProps) => {\n  const field = useFormFieldControl()\n  const { fieldLabelId, fieldId, onLabelId } = useSliderContext()\n\n  // Generate an id if not provided and no FormField labelId is available\n  const internalId = useId()\n  const generatedId = `${ID_PREFIX}-${internalId}`\n  const labelId = idProp || fieldLabelId || field.labelId || generatedId\n\n  // Use FormField id for htmlFor if present, otherwise use fieldId from context, or the prop\n  const htmlFor = asChild ? undefined : htmlForProp || fieldId || field.id\n\n  // Get disabled and required state from FormField if present\n  const disabled = field.disabled\n  const isRequired = field.isRequired\n\n  // Notify SliderContext of the label id if no FormField is present\n  const labelRef = useRef<HTMLLabelElement>(null)\n  const mergedRef = useMergeRefs(ref, labelRef)\n\n  useEffect(() => {\n    if (onLabelId && !fieldLabelId && !field.labelId) {\n      onLabelId(labelId)\n    }\n  }, [onLabelId, fieldLabelId, field.labelId, labelId])\n\n  return (\n    <Label\n      ref={mergedRef}\n      id={labelId}\n      data-spark-component=\"slider-label\"\n      htmlFor={htmlFor}\n      className={cx(disabled ? 'text-on-surface/dim-3 pointer-events-none' : undefined, className)}\n      asChild={asChild}\n      {...others}\n    >\n      <>\n        <Slottable>{children}</Slottable>\n        {isRequired && requiredIndicator}\n      </>\n    </Label>\n  )\n}\n\nSliderLabel.displayName = 'Slider.Label'\n","import { cx } from 'class-variance-authority'\nimport { forwardRef, type ReactNode } from 'react'\n\nimport { useSliderContext } from './SliderContext'\n\nexport interface SliderMaxValueProps {\n  className?: string\n  children?: (value: number) => ReactNode\n}\n\nexport const SliderMaxValue = forwardRef<HTMLDivElement, SliderMaxValueProps>(\n  ({ className, children }, ref) => {\n    const { max = 100 } = useSliderContext()\n\n    const content = children ? children(max) : max\n\n    return (\n      <div\n        data-spark-component=\"slider-max-value\"\n        ref={ref}\n        className={cx('text-on-surface/dim-1 text-body-2 col-start-2 text-right', className)}\n      >\n        {content}\n      </div>\n    )\n  }\n)\n\nSliderMaxValue.displayName = 'Slider.MaxValue'\n","import { cx } from 'class-variance-authority'\nimport { forwardRef, type ReactNode } from 'react'\n\nimport { useSliderContext } from './SliderContext'\n\nexport interface SliderMinValueProps {\n  className?: string\n  children?: (value: number) => ReactNode\n}\n\nexport const SliderMinValue = forwardRef<HTMLDivElement, SliderMinValueProps>(\n  ({ className, children }, ref) => {\n    const { min = 0 } = useSliderContext()\n\n    const content = children ? children(min) : min\n\n    return (\n      <div\n        data-spark-component=\"slider-min-value\"\n        ref={ref}\n        className={cx('text-on-surface/dim-1 text-body-2 col-start-1 text-left', className)}\n      >\n        {content}\n      </div>\n    )\n  }\n)\n\nSliderMinValue.displayName = 'Slider.MinValue'\n","import { createContext, useContext } from 'react'\n\nexport interface SliderThumbContextValue {\n  isInsideThumb: true\n}\n\nexport const SliderThumbContext = createContext<SliderThumbContextValue | null>(null)\n\nexport const useSliderThumbContext = () => useContext(SliderThumbContext)\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const thumbVariants = cva(\n  [\n    'relative block size-sz-24 rounded-full cursor-pointer',\n    'outline-hidden',\n    'has-focus-visible:ring-2 has-focus-visible:ring-offset-2 has-focus-visible:ring-focus',\n    'data-disabled:hover:ring-0 data-disabled:cursor-not-allowed data-disabled:before:hidden',\n    // visual thumb\n    'after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2',\n    'after:size-sz-24 after:rounded-full',\n    // hover effect\n    'before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2',\n    'before:size-sz-24 before:rounded-full before:border-solid before:border-sm before:transition-all before:duration-75',\n    'hover:before:size-sz-32 data-dragging:before:size-sz-32',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['after:bg-main', 'before:bg-main-container before:border-main'],\n        support: ['after:bg-support', 'before:bg-support-container before:border-support'],\n        accent: ['after:bg-accent', 'before:bg-accent-container before:border-accent'],\n        info: ['after:bg-info', 'before:bg-info-container before:border-info'],\n        neutral: ['after:bg-neutral', 'before:bg-neutral-container before:border-neutral'],\n        success: ['after:bg-success', 'before:bg-success-container before:border-success'],\n        alert: ['after:bg-alert', 'before:bg-alert-container before:border-alert'],\n        error: ['after:bg-error', 'before:bg-error-container before:border-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'support',\n    },\n  }\n)\n\nexport type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { ComponentProps, type PropsWithChildren, useRef } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { SliderThumbContext } from './SliderThumbContext'\nimport { thumbVariants } from './SliderThumb.styles'\n\nexport type SliderThumbProps = Omit<\n  ComponentProps<typeof BaseSlider.Thumb>,\n  'render' | 'index'\n> &\n  PropsWithChildren\n\nexport const SliderThumb = ({\n  className,\n  ref: forwardedRef,\n  children,\n  ...rest\n}: SliderThumbProps) => {\n  const { intent, fieldLabelId, fieldId, thumbRef: contextThumbRef } = useSliderContext()\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(contextThumbRef, forwardedRef ?? innerRef)\n\n  return (\n    <SliderThumbContext.Provider value={{ isInsideThumb: true }}>\n      <BaseSlider.Thumb\n        data-spark-component=\"slider-thumb\"\n        ref={ref}\n        id={fieldId}\n        className={thumbVariants({ intent, className })}\n        aria-labelledby={fieldLabelId}\n        {...rest}\n      >\n        {children}\n      </BaseSlider.Thumb>\n    </SliderThumbContext.Provider>\n  )\n}\n\nSliderThumb.displayName = 'Slider.Thumb'\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { ComponentProps } from 'react'\n\nimport { trackVariants } from './SliderTrack.styles'\n\nexport type SliderTrackProps = Omit<ComponentProps<typeof BaseSlider.Track>, 'render'>\n\nexport const SliderTrack = ({ className, ref, ...rest }: SliderTrackProps) => {\n  return (\n    <BaseSlider.Track\n      data-spark-component=\"slider-track\"\n      ref={ref}\n      className={trackVariants({ className })}\n      {...rest}\n    />\n  )\n}\n\nSliderTrack.displayName = 'Slider.Track'\n","import type { RefObject } from 'react'\nimport { useLayoutEffect, useState } from 'react'\n\n/**\n * Computes the translateX (in pixels) to apply to the value element so it stays\n * within the horizontal bounds of the slider control when displayed inside the thumb.\n *\n * @param controlRef - Ref to the slider control (track container)\n * @param thumbRef - Ref to the thumb element\n * @param valueRef - Ref to the value label element\n * @param value - Current slider value (0–100 or min–max), used to re-run when thumb moves\n * @returns translateX in pixels (positive = right, negative = left), or 0 if refs are missing\n */\nexport function useSliderValueBoundaries(\n  controlRef: RefObject<HTMLElement | null>,\n  thumbRef: RefObject<HTMLElement | null>,\n  valueRef: RefObject<HTMLElement | null>,\n  value: number\n): number {\n  const [translateX, setTranslateX] = useState(0)\n  const [refsRetryScheduled, setRefsRetryScheduled] = useState(false)\n\n  useLayoutEffect(() => {\n    const control = controlRef.current\n    const thumb = thumbRef.current\n    const valueEl = valueRef.current\n\n    if (!control || !thumb || !valueEl) {\n      setTranslateX(0)\n      // Re-run once on next frame when refs may be set (e.g. Slider.Value mounts after Control/Thumb)\n      if (!refsRetryScheduled) {\n        requestAnimationFrame(() => setRefsRetryScheduled(true))\n      }\n\n      return\n    }\n\n    let cancelled = false\n\n    const compute = () => {\n      if (cancelled) return\n\n      const controlRect = control.getBoundingClientRect()\n      const thumbRect = thumb.getBoundingClientRect()\n      const valueWidth = valueEl.scrollWidth\n\n      // Skip until value label has been laid out (content from render prop may not be ready on first paint)\n      if (valueWidth === 0) {\n        requestAnimationFrame(compute)\n\n        return\n      }\n\n      const thumbCenterPx = thumbRect.left - controlRect.left + thumbRect.width / 2\n\n      const valueCenterMin = valueWidth / 2\n      const valueCenterMax = controlRect.width - valueWidth / 2\n\n      const clampedCenter = Math.max(valueCenterMin, Math.min(valueCenterMax, thumbCenterPx))\n      const nextTranslateX = clampedCenter - thumbCenterPx\n\n      setTranslateX(prev => (prev !== nextTranslateX ? nextTranslateX : prev))\n    }\n\n    compute()\n\n    const resizeObserver = new ResizeObserver(compute)\n    resizeObserver.observe(control)\n    resizeObserver.observe(valueEl)\n\n    return () => {\n      cancelled = true\n      resizeObserver.disconnect()\n    }\n  }, [controlRef, thumbRef, valueRef, value, refsRetryScheduled])\n\n  return translateX\n}\n","import { Slider as BaseSlider } from '@base-ui/react/slider'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport type { ReactNode } from 'react'\nimport { ComponentProps, useCallback, useEffect, useRef, useState } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { useSliderThumbContext } from './SliderThumbContext'\nimport { useSliderValueBoundaries } from './useSliderValueBoundaries'\n\nexport type SliderValueProps = Omit<ComponentProps<typeof BaseSlider.Value>, 'render'>\n\n/**\n * Normalizes Base UI's (formattedValues, values) to single (formatted, value) for the render prop.\n */\nexport const SliderValue = ({ className, children, ref, ...rest }: SliderValueProps) => {\n  const { registerValueInThumb, controlRef, thumbRef } = useSliderContext()\n  const thumbContext = useSliderThumbContext()\n  const isInsideThumb = thumbContext !== null\n\n  const valueRef = useRef<HTMLOutputElement | null>(null)\n  const mergedRef = useMergeRefs(valueRef, ref)\n\n  const [currentValue, setCurrentValue] = useState(0)\n  const translateX = useSliderValueBoundaries(controlRef, thumbRef, valueRef, currentValue)\n\n  useEffect(() => {\n    if (!isInsideThumb) return\n\n    return registerValueInThumb()\n  }, [isInsideThumb, registerValueInThumb])\n\n  const resolvedClassName = cx(\n    isInsideThumb\n      ? 'absolute left-1/2 -translate-x-1/2 top-[calc(-100%-var(--spacing-sm))] text-body-1 font-bold whitespace-nowrap'\n      : 'default:text-body-1 col-start-2 text-right default:font-bold',\n    className\n  )\n\n  const normalizedChildren = useCallback(\n    (formattedValues: readonly string[], values: readonly number[]) => {\n      const formatted = formattedValues[0] ?? String(values[0] ?? '')\n      const value = values[0] ?? 0\n      setCurrentValue(value)\n      if (typeof children === 'function') {\n        return (children as unknown as (formatted: string, value: number) => ReactNode)(\n          formatted,\n          value\n        )\n      }\n\n      return formatted\n    },\n    [children]\n  )\n\n  const style = isInsideThumb\n    ? { transform: `translate(calc(0% + ${translateX}px), 0)` }\n    : undefined\n\n  return (\n    <BaseSlider.Value\n      data-spark-component=\"slider-value\"\n      ref={mergedRef}\n      className={resolvedClassName}\n      style={style}\n      {...rest}\n    >\n      {normalizedChildren}\n    </BaseSlider.Value>\n  )\n}\n\nSliderValue.displayName = 'Slider.Value'\n","import { Slider as Root, type SliderProps } from './Slider'\nimport { SliderControl as Control, type SliderControlProps } from './SliderControl'\nimport { SliderIndicator as Indicator, type SliderIndicatorProps } from './SliderIndicator'\nimport { SliderLabel as Label, type SliderLabelProps } from './SliderLabel'\nimport { SliderMaxValue as MaxValue, type SliderMaxValueProps } from './SliderMaxValue'\nimport { SliderMinValue as MinValue, type SliderMinValueProps } from './SliderMinValue'\nimport { SliderThumb as Thumb, type SliderThumbProps } from './SliderThumb'\nimport { SliderTrack as Track, type SliderTrackProps } from './SliderTrack'\nimport { SliderValue as Value, type SliderValueProps } from './SliderValue'\n\nexport const Slider: typeof Root & {\n  Control: typeof Control\n  Indicator: typeof Indicator\n  Label: typeof Label\n  MaxValue: typeof MaxValue\n  MinValue: typeof MinValue\n  Thumb: typeof Thumb\n  Track: typeof Track\n  Value: typeof Value\n} = Object.assign(Root, {\n  Control,\n  Indicator,\n  Label,\n  MaxValue,\n  MinValue,\n  Thumb,\n  Track,\n  Value,\n})\n\nSlider.displayName = 'Slider'\nControl.displayName = 'Slider.Control'\nIndicator.displayName = 'Slider.Indicator'\nLabel.displayName = 'Slider.Label'\nMaxValue.displayName = 'Slider.MaxValue'\nMinValue.displayName = 'Slider.MinValue'\nThumb.displayName = 'Slider.Thumb'\nTrack.displayName = 'Slider.Track'\nValue.displayName = 'Slider.Value'\n\nexport type {\n  SliderProps,\n  SliderControlProps,\n  SliderIndicatorProps,\n  SliderLabelProps,\n  SliderMaxValueProps,\n  SliderMinValueProps,\n  SliderThumbProps,\n  SliderTrackProps,\n  SliderValueProps,\n}\n"],"names":["rootStyles","cva","SliderContext","createContext","useSliderContext","useContext","Slider","intent","children","className","ref","valueProp","defaultValueProp","disabledProp","readOnlyProp","nameProp","onValueChange","onValueCommit","min","max","rest","field","useFormFieldControl","disabled","readOnly","name","labelId","setLabelId","useState","valueInThumbCount","setValueInThumbCount","controlRef","useRef","thumbRef","handleLabelId","useCallback","id","registerValueInThumb","c","jsx","BaseSlider","value","v","SliderControl","hasValueInThumb","mergedRef","useMergeRefs","cx","trackVariants","rangeVariants","SliderIndicator","ID_PREFIX","SliderLabel","htmlForProp","idProp","requiredIndicator","FormFieldRequiredIndicator","asChild","others","fieldLabelId","fieldId","onLabelId","internalId","useId","generatedId","htmlFor","isRequired","labelRef","useEffect","Label","jsxs","Fragment","Slottable","SliderMaxValue","forwardRef","content","SliderMinValue","SliderThumbContext","useSliderThumbContext","thumbVariants","SliderThumb","forwardedRef","contextThumbRef","innerRef","SliderTrack","useSliderValueBoundaries","valueRef","translateX","setTranslateX","refsRetryScheduled","setRefsRetryScheduled","useLayoutEffect","control","thumb","valueEl","cancelled","compute","controlRect","thumbRect","valueWidth","thumbCenterPx","valueCenterMin","valueCenterMax","nextTranslateX","prev","resizeObserver","SliderValue","isInsideThumb","currentValue","setCurrentValue","resolvedClassName","normalizedChildren","formattedValues","values","formatted","style","Root","Control","Indicator","MaxValue","MinValue","Thumb","Track","Value"],"mappings":"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"}

package/dist/slider/index.mjs

@@ -12,7 +12,7 @@ const se = L([
   "touch-none select-none",
   "data-disabled:cursor-not-allowed data-disabled:opacity-dim-3"
 ]), H = W({}), I = () => _(H), J = ({
-  intent: t = "basic",
+  intent: t = "support",
   children: e,
   className: r,
   ref: a,
@@ -107,7 +107,6 @@ const le = L(["relative grow h-sz-4 bg-on-background/dim-4 rounded-sm"]), ie = L
         main: ["bg-main"],
         support: ["bg-support"],
         accent: ["bg-accent"],
-        basic: ["bg-basic"],
         info: ["bg-info"],
         neutral: ["bg-neutral"],
         success: ["bg-success"],
@@ -116,7 +115,7 @@ const le = L(["relative grow h-sz-4 bg-on-background/dim-4 rounded-sm"]), ie = L
       }
     },
     defaultVariants: {
-      intent: "basic"
+      intent: "support"
     }
   }
 ), O = ({ className: t, ref: e, ...r }) => {
@@ -213,7 +212,6 @@ const K = W(null), ce = () => _(K), ue = L(
         main: ["after:bg-main", "before:bg-main-container before:border-main"],
         support: ["after:bg-support", "before:bg-support-container before:border-support"],
         accent: ["after:bg-accent", "before:bg-accent-container before:border-accent"],
-        basic: ["after:bg-basic", "before:bg-basic-container before:border-basic"],
         info: ["after:bg-info", "before:bg-info-container before:border-info"],
         neutral: ["after:bg-neutral", "before:bg-neutral-container before:border-neutral"],
         success: ["after:bg-success", "before:bg-success-container before:border-success"],
@@ -222,7 +220,7 @@ const K = W(null), ce = () => _(K), ue = L(
       }
     },
     defaultVariants: {
-      intent: "basic"
+      intent: "support"
     }
   }
 ), E = ({