@spark-ui/components 10.0.10 → 10.0.12

package/dist/select/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/select/SelectContext.tsx","../../src/select/utils.ts","../../src/select/Select.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["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 { 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 { 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 { 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 { 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 { 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 { 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 { 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',\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: 'hover:ring-outline-high focus-within:ring-outline-high',\n      },\n    ],\n  }\n)\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"],"mappings":"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","names":["jsx","createContext","useContext","useState","jsx","jsx","jsx","jsx","useEffect","useEffect","jsx","useEffect","jsx","useEffect","useEffect","cva","styles","jsx","useEffect","styles","cx","jsx","cx","Select"]}
+{"version":3,"sources":["../../src/select/SelectContext.tsx","../../src/select/utils.ts","../../src/select/Select.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["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 { 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 { 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 { 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 { 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 { 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 { 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 { 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',\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: 'hover:ring-outline-high focus-within:ring-outline-high',\n      },\n    ],\n  }\n)\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"],"mappings":"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","names":["jsx","createContext","useContext","useState","jsx","jsx","jsx","jsx","useEffect","useEffect","jsx","useEffect","jsx","useEffect","useEffect","cva","styles","jsx","useEffect","styles","cx","jsx","cx","Select"]}

package/dist/slider/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/slider/index.ts","../../src/slider/Slider.tsx","../../src/slider/Slider.styles.ts","../../src/slider/SliderContext.tsx","../../src/slider/SliderThumb.tsx","../../src/slider/SliderThumb.styles.ts","../../src/slider/SliderTrack.tsx","../../src/slider/SliderTrack.styles.ts"],"sourcesContent":["import { Slider as Root, type SliderProps } from './Slider'\nimport { SliderThumb as Thumb, type SliderThumbProps } from './SliderThumb'\nimport { SliderTrack as Track, type SliderTrackProps } from './SliderTrack'\n\nexport const Slider: typeof Root & {\n  Thumb: typeof Thumb\n  Track: typeof Track\n} = Object.assign(Root, {\n  Thumb,\n  Track,\n})\n\nSlider.displayName = 'Slider'\nThumb.displayName = 'Slider.Thumb'\nTrack.displayName = 'Slider.Track'\n\nexport type { SliderProps, SliderThumbProps, SliderTrackProps }\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type PropsWithChildren, Ref } 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      RadixSlider.SliderProps,\n      'dir' | 'orientation' | 'inverted' | 'minStepsBetweenThumbs'\n    >,\n    PropsWithChildren<SliderRangeVariantsProps> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\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   */\n  name?: string\n  /**\n   * When `true`, prevents the user from interacting with the slider.\n   * @default false\n   */\n  disabled?: 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  asChild = false,\n  intent = 'basic',\n  shape = 'square',\n  children,\n  className,\n  ref,\n  ...rest\n}: SliderProps) => (\n  <SliderContext.Provider value={{ intent, shape }}>\n    <RadixSlider.Root\n      ref={ref}\n      data-spark-component=\"slider\"\n      asChild={asChild}\n      className={rootStyles({ className })}\n      dir=\"ltr\"\n      orientation=\"horizontal\"\n      inverted={false}\n      minStepsBetweenThumbs={0}\n      {...rest}\n    >\n      {children}\n    </RadixSlider.Root>\n  </SliderContext.Provider>\n)\n\nSlider.displayName = 'Slider'\n","import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'flex relative h-sz-24 items-center',\n  'touch-none select-none',\n  'data-disabled:cursor-not-allowed data-disabled:opacity-dim-3',\n])\n","import { createContext, useContext } from 'react'\n\nimport type { SliderProps } from './Slider'\n\nexport type SliderContextInterface = Pick<SliderProps, 'intent' | 'shape'>\n\nexport const SliderContext = createContext<SliderContextInterface>({} as SliderContextInterface)\n\nexport const useSliderContext = () => useContext(SliderContext)\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type FocusEvent, type KeyboardEvent, type PointerEvent, Ref, useRef } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { thumbVariants } from './SliderThumb.styles'\n\nexport interface SliderThumbProps extends RadixSlider.SliderThumbProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const SliderThumb = ({\n  asChild = false,\n  className,\n  onPointerDown,\n  onKeyDown,\n  onBlur,\n  ref: forwardedRef,\n  ...rest\n}: SliderThumbProps) => {\n  const { intent } = useSliderContext()\n\n  const innerRef = useRef(null)\n  const ref = forwardedRef || innerRef\n\n  const setInteractionType = (e: KeyboardEvent | FocusEvent | PointerEvent) => {\n    /**\n     * Radix Slider implementation uses `.focus()` and thus prevent us to handle\n     * distinctively focus/focus-visible styles. So we use a `data-interaction` attribute to stay\n     * aware of the type of event, and adapt styles if needed.\n     */\n    if (typeof ref === 'function' || !ref.current) return\n    ref.current.dataset.interaction = e.type\n  }\n\n  return (\n    <RadixSlider.Thumb\n      ref={ref}\n      asChild={asChild}\n      onPointerDown={(e: PointerEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onPointerDown?.(e)\n      }}\n      onKeyDown={(e: KeyboardEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onKeyDown?.(e)\n      }}\n      onBlur={(e: FocusEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onBlur?.(e)\n      }}\n      className={thumbVariants({ intent, className })}\n      {...rest}\n    />\n  )\n}\n\nSliderThumb.displayName = 'Slider.Thumb'\n","import { cva, type VariantProps } from 'class-variance-authority'\n\nexport const thumbVariants = cva(\n  [\n    'block h-sz-24 w-sz-24 rounded-full cursor-pointer',\n    'outline-hidden',\n    'focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-blue',\n    'data-[interaction=pointerdown]:focus-visible:ring-0!',\n    'data-disabled:hover:ring-0 data-disabled:hover:after:w-0 data-disabled:hover:after:h-0 data-disabled:cursor-not-allowed',\n    'after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2 after:z-hide',\n    'after:w-0 after:h-0 after:rounded-full after:border-solid after:border-sm after:transition-all duration-300',\n    'hover:after:w-sz-32 hover:after:h-sz-32',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['bg-main', 'after:bg-main-container after:border-main'],\n        support: ['bg-support', 'after:bg-support-container after:border-support'],\n        accent: ['bg-accent', 'after:bg-accent-container after:border-accent'],\n        basic: ['bg-basic', 'after:bg-basic-container after:border-basic'],\n        info: ['bg-info', 'after:bg-info-container after:border-info'],\n        neutral: ['bg-neutral', 'after:bg-neutral-container after:border-neutral'],\n        success: ['bg-success', 'after:bg-success-container after:border-success'],\n        alert: ['bg-alert', 'after:bg-alert-container after:border-alert'],\n        error: ['bg-error', 'after:bg-error-container after:border-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { rangeVariants, trackVariants } from './SliderTrack.styles'\n\nexport interface SliderTrackProps\n  extends RadixSlider.SliderTrackProps,\n    RadixSlider.SliderRangeProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SliderTrack = ({ asChild = false, className, ref, ...rest }: SliderTrackProps) => {\n  const { intent, shape } = useSliderContext()\n\n  return (\n    <RadixSlider.Track ref={ref} asChild={asChild} className={trackVariants({ shape })} {...rest}>\n      <RadixSlider.Range className={rangeVariants({ intent, shape, className })} />\n    </RadixSlider.Track>\n  )\n}\n\nSliderTrack.displayName = 'Slider.Track'\n","import { cva, type VariantProps } from 'class-variance-authority'\n\nexport const trackVariants = cva(['relative grow h-sz-4 bg-on-background/dim-4'], {\n  variants: {\n    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    shape: 'square',\n  },\n})\n\nexport const rangeVariants = cva(['absolute h-full'], {\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    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    intent: 'basic',\n    shape: 'square',\n  },\n})\n\nexport type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>\n"],"mappings":"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","names":["Slider","RadixSlider","import_radix_ui","import_react","import_class_variance_authority","import_jsx_runtime","RadixSlider","import_radix_ui","import_class_variance_authority","import_jsx_runtime","RadixSlider","Slider"]}
+{"version":3,"sources":["../../src/slider/index.ts","../../src/slider/Slider.tsx","../../src/slider/Slider.styles.ts","../../src/slider/SliderContext.tsx","../../src/slider/SliderThumb.tsx","../../src/slider/SliderThumb.styles.ts","../../src/slider/SliderTrack.tsx","../../src/slider/SliderTrack.styles.ts"],"sourcesContent":["import { Slider as Root, type SliderProps } from './Slider'\nimport { SliderThumb as Thumb, type SliderThumbProps } from './SliderThumb'\nimport { SliderTrack as Track, type SliderTrackProps } from './SliderTrack'\n\nexport const Slider: typeof Root & {\n  Thumb: typeof Thumb\n  Track: typeof Track\n} = Object.assign(Root, {\n  Thumb,\n  Track,\n})\n\nSlider.displayName = 'Slider'\nThumb.displayName = 'Slider.Thumb'\nTrack.displayName = 'Slider.Track'\n\nexport type { SliderProps, SliderThumbProps, SliderTrackProps }\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type PropsWithChildren, Ref } 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      RadixSlider.SliderProps,\n      'dir' | 'orientation' | 'inverted' | 'minStepsBetweenThumbs'\n    >,\n    PropsWithChildren<SliderRangeVariantsProps> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\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   */\n  name?: string\n  /**\n   * When `true`, prevents the user from interacting with the slider.\n   * @default false\n   */\n  disabled?: 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  asChild = false,\n  intent = 'basic',\n  shape = 'square',\n  children,\n  className,\n  ref,\n  ...rest\n}: SliderProps) => (\n  <SliderContext.Provider value={{ intent, shape }}>\n    <RadixSlider.Root\n      ref={ref}\n      data-spark-component=\"slider\"\n      asChild={asChild}\n      className={rootStyles({ className })}\n      dir=\"ltr\"\n      orientation=\"horizontal\"\n      inverted={false}\n      minStepsBetweenThumbs={0}\n      {...rest}\n    >\n      {children}\n    </RadixSlider.Root>\n  </SliderContext.Provider>\n)\n\nSlider.displayName = 'Slider'\n","import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'flex relative h-sz-24 items-center',\n  'touch-none select-none',\n  'data-disabled:cursor-not-allowed data-disabled:opacity-dim-3',\n])\n","import { createContext, useContext } from 'react'\n\nimport type { SliderProps } from './Slider'\n\nexport type SliderContextInterface = Pick<SliderProps, 'intent' | 'shape'>\n\nexport const SliderContext = createContext<SliderContextInterface>({} as SliderContextInterface)\n\nexport const useSliderContext = () => useContext(SliderContext)\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type FocusEvent, type KeyboardEvent, type PointerEvent, Ref, useRef } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { thumbVariants } from './SliderThumb.styles'\n\nexport interface SliderThumbProps extends RadixSlider.SliderThumbProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const SliderThumb = ({\n  asChild = false,\n  className,\n  onPointerDown,\n  onKeyDown,\n  onBlur,\n  ref: forwardedRef,\n  ...rest\n}: SliderThumbProps) => {\n  const { intent } = useSliderContext()\n\n  const innerRef = useRef(null)\n  const ref = forwardedRef || innerRef\n\n  const setInteractionType = (e: KeyboardEvent | FocusEvent | PointerEvent) => {\n    /**\n     * Radix Slider implementation uses `.focus()` and thus prevent us to handle\n     * distinctively focus/focus-visible styles. So we use a `data-interaction` attribute to stay\n     * aware of the type of event, and adapt styles if needed.\n     */\n    if (typeof ref === 'function' || !ref.current) return\n    ref.current.dataset.interaction = e.type\n  }\n\n  return (\n    <RadixSlider.Thumb\n      ref={ref}\n      asChild={asChild}\n      onPointerDown={(e: PointerEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onPointerDown?.(e)\n      }}\n      onKeyDown={(e: KeyboardEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onKeyDown?.(e)\n      }}\n      onBlur={(e: FocusEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onBlur?.(e)\n      }}\n      className={thumbVariants({ intent, className })}\n      {...rest}\n    />\n  )\n}\n\nSliderThumb.displayName = 'Slider.Thumb'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const thumbVariants = cva(\n  [\n    'block h-sz-24 w-sz-24 rounded-full cursor-pointer',\n    'outline-hidden',\n    'focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-blue',\n    'data-[interaction=pointerdown]:focus-visible:ring-0!',\n    'data-disabled:hover:ring-0 data-disabled:hover:after:w-0 data-disabled:hover:after:h-0 data-disabled:cursor-not-allowed',\n    'after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2 after:z-hide',\n    'after:w-0 after:h-0 after:rounded-full after:border-solid after:border-sm after:transition-all duration-300',\n    'hover:after:w-sz-32 hover:after:h-sz-32',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['bg-main', 'after:bg-main-container after:border-main'],\n        support: ['bg-support', 'after:bg-support-container after:border-support'],\n        accent: ['bg-accent', 'after:bg-accent-container after:border-accent'],\n        basic: ['bg-basic', 'after:bg-basic-container after:border-basic'],\n        info: ['bg-info', 'after:bg-info-container after:border-info'],\n        neutral: ['bg-neutral', 'after:bg-neutral-container after:border-neutral'],\n        success: ['bg-success', 'after:bg-success-container after:border-success'],\n        alert: ['bg-alert', 'after:bg-alert-container after:border-alert'],\n        error: ['bg-error', 'after:bg-error-container after:border-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { rangeVariants, trackVariants } from './SliderTrack.styles'\n\nexport interface SliderTrackProps\n  extends RadixSlider.SliderTrackProps,\n    RadixSlider.SliderRangeProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SliderTrack = ({ asChild = false, className, ref, ...rest }: SliderTrackProps) => {\n  const { intent, shape } = useSliderContext()\n\n  return (\n    <RadixSlider.Track ref={ref} asChild={asChild} className={trackVariants({ shape })} {...rest}>\n      <RadixSlider.Range className={rangeVariants({ intent, shape, className })} />\n    </RadixSlider.Track>\n  )\n}\n\nSliderTrack.displayName = 'Slider.Track'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const trackVariants = cva(['relative grow h-sz-4 bg-on-background/dim-4'], {\n  variants: {\n    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    shape: 'square',\n  },\n})\n\nexport const rangeVariants = cva(['absolute h-full'], {\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    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    intent: 'basic',\n    shape: 'square',\n  },\n})\n\nexport type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>\n"],"mappings":"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","names":["Slider","RadixSlider","import_radix_ui","import_react","import_class_variance_authority","import_jsx_runtime","RadixSlider","import_radix_ui","import_class_variance_authority","import_jsx_runtime","RadixSlider","Slider"]}

package/dist/slider/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/slider/Slider.tsx","../../src/slider/Slider.styles.ts","../../src/slider/SliderContext.tsx","../../src/slider/SliderThumb.tsx","../../src/slider/SliderThumb.styles.ts","../../src/slider/SliderTrack.tsx","../../src/slider/SliderTrack.styles.ts","../../src/slider/index.ts"],"sourcesContent":["import { Slider as RadixSlider } from 'radix-ui'\nimport { type PropsWithChildren, Ref } 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      RadixSlider.SliderProps,\n      'dir' | 'orientation' | 'inverted' | 'minStepsBetweenThumbs'\n    >,\n    PropsWithChildren<SliderRangeVariantsProps> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\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   */\n  name?: string\n  /**\n   * When `true`, prevents the user from interacting with the slider.\n   * @default false\n   */\n  disabled?: 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  asChild = false,\n  intent = 'basic',\n  shape = 'square',\n  children,\n  className,\n  ref,\n  ...rest\n}: SliderProps) => (\n  <SliderContext.Provider value={{ intent, shape }}>\n    <RadixSlider.Root\n      ref={ref}\n      data-spark-component=\"slider\"\n      asChild={asChild}\n      className={rootStyles({ className })}\n      dir=\"ltr\"\n      orientation=\"horizontal\"\n      inverted={false}\n      minStepsBetweenThumbs={0}\n      {...rest}\n    >\n      {children}\n    </RadixSlider.Root>\n  </SliderContext.Provider>\n)\n\nSlider.displayName = 'Slider'\n","import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'flex relative h-sz-24 items-center',\n  'touch-none select-none',\n  'data-disabled:cursor-not-allowed data-disabled:opacity-dim-3',\n])\n","import { createContext, useContext } from 'react'\n\nimport type { SliderProps } from './Slider'\n\nexport type SliderContextInterface = Pick<SliderProps, 'intent' | 'shape'>\n\nexport const SliderContext = createContext<SliderContextInterface>({} as SliderContextInterface)\n\nexport const useSliderContext = () => useContext(SliderContext)\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type FocusEvent, type KeyboardEvent, type PointerEvent, Ref, useRef } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { thumbVariants } from './SliderThumb.styles'\n\nexport interface SliderThumbProps extends RadixSlider.SliderThumbProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const SliderThumb = ({\n  asChild = false,\n  className,\n  onPointerDown,\n  onKeyDown,\n  onBlur,\n  ref: forwardedRef,\n  ...rest\n}: SliderThumbProps) => {\n  const { intent } = useSliderContext()\n\n  const innerRef = useRef(null)\n  const ref = forwardedRef || innerRef\n\n  const setInteractionType = (e: KeyboardEvent | FocusEvent | PointerEvent) => {\n    /**\n     * Radix Slider implementation uses `.focus()` and thus prevent us to handle\n     * distinctively focus/focus-visible styles. So we use a `data-interaction` attribute to stay\n     * aware of the type of event, and adapt styles if needed.\n     */\n    if (typeof ref === 'function' || !ref.current) return\n    ref.current.dataset.interaction = e.type\n  }\n\n  return (\n    <RadixSlider.Thumb\n      ref={ref}\n      asChild={asChild}\n      onPointerDown={(e: PointerEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onPointerDown?.(e)\n      }}\n      onKeyDown={(e: KeyboardEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onKeyDown?.(e)\n      }}\n      onBlur={(e: FocusEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onBlur?.(e)\n      }}\n      className={thumbVariants({ intent, className })}\n      {...rest}\n    />\n  )\n}\n\nSliderThumb.displayName = 'Slider.Thumb'\n","import { cva, type VariantProps } from 'class-variance-authority'\n\nexport const thumbVariants = cva(\n  [\n    'block h-sz-24 w-sz-24 rounded-full cursor-pointer',\n    'outline-hidden',\n    'focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-blue',\n    'data-[interaction=pointerdown]:focus-visible:ring-0!',\n    'data-disabled:hover:ring-0 data-disabled:hover:after:w-0 data-disabled:hover:after:h-0 data-disabled:cursor-not-allowed',\n    'after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2 after:z-hide',\n    'after:w-0 after:h-0 after:rounded-full after:border-solid after:border-sm after:transition-all duration-300',\n    'hover:after:w-sz-32 hover:after:h-sz-32',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['bg-main', 'after:bg-main-container after:border-main'],\n        support: ['bg-support', 'after:bg-support-container after:border-support'],\n        accent: ['bg-accent', 'after:bg-accent-container after:border-accent'],\n        basic: ['bg-basic', 'after:bg-basic-container after:border-basic'],\n        info: ['bg-info', 'after:bg-info-container after:border-info'],\n        neutral: ['bg-neutral', 'after:bg-neutral-container after:border-neutral'],\n        success: ['bg-success', 'after:bg-success-container after:border-success'],\n        alert: ['bg-alert', 'after:bg-alert-container after:border-alert'],\n        error: ['bg-error', 'after:bg-error-container after:border-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { rangeVariants, trackVariants } from './SliderTrack.styles'\n\nexport interface SliderTrackProps\n  extends RadixSlider.SliderTrackProps,\n    RadixSlider.SliderRangeProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SliderTrack = ({ asChild = false, className, ref, ...rest }: SliderTrackProps) => {\n  const { intent, shape } = useSliderContext()\n\n  return (\n    <RadixSlider.Track ref={ref} asChild={asChild} className={trackVariants({ shape })} {...rest}>\n      <RadixSlider.Range className={rangeVariants({ intent, shape, className })} />\n    </RadixSlider.Track>\n  )\n}\n\nSliderTrack.displayName = 'Slider.Track'\n","import { cva, type VariantProps } from 'class-variance-authority'\n\nexport const trackVariants = cva(['relative grow h-sz-4 bg-on-background/dim-4'], {\n  variants: {\n    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    shape: 'square',\n  },\n})\n\nexport const rangeVariants = cva(['absolute h-full'], {\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    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    intent: 'basic',\n    shape: 'square',\n  },\n})\n\nexport type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>\n","import { Slider as Root, type SliderProps } from './Slider'\nimport { SliderThumb as Thumb, type SliderThumbProps } from './SliderThumb'\nimport { SliderTrack as Track, type SliderTrackProps } from './SliderTrack'\n\nexport const Slider: typeof Root & {\n  Thumb: typeof Thumb\n  Track: typeof Track\n} = Object.assign(Root, {\n  Thumb,\n  Track,\n})\n\nSlider.displayName = 'Slider'\nThumb.displayName = 'Slider.Thumb'\nTrack.displayName = 'Slider.Track'\n\nexport type { SliderProps, SliderThumbProps, SliderTrackProps }\n"],"mappings":"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","names":["RadixSlider","cva","jsx","RadixSlider","RadixSlider","cva","jsx","RadixSlider","Slider"]}
+{"version":3,"sources":["../../src/slider/Slider.tsx","../../src/slider/Slider.styles.ts","../../src/slider/SliderContext.tsx","../../src/slider/SliderThumb.tsx","../../src/slider/SliderThumb.styles.ts","../../src/slider/SliderTrack.tsx","../../src/slider/SliderTrack.styles.ts","../../src/slider/index.ts"],"sourcesContent":["import { Slider as RadixSlider } from 'radix-ui'\nimport { type PropsWithChildren, Ref } 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      RadixSlider.SliderProps,\n      'dir' | 'orientation' | 'inverted' | 'minStepsBetweenThumbs'\n    >,\n    PropsWithChildren<SliderRangeVariantsProps> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\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   */\n  name?: string\n  /**\n   * When `true`, prevents the user from interacting with the slider.\n   * @default false\n   */\n  disabled?: 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  asChild = false,\n  intent = 'basic',\n  shape = 'square',\n  children,\n  className,\n  ref,\n  ...rest\n}: SliderProps) => (\n  <SliderContext.Provider value={{ intent, shape }}>\n    <RadixSlider.Root\n      ref={ref}\n      data-spark-component=\"slider\"\n      asChild={asChild}\n      className={rootStyles({ className })}\n      dir=\"ltr\"\n      orientation=\"horizontal\"\n      inverted={false}\n      minStepsBetweenThumbs={0}\n      {...rest}\n    >\n      {children}\n    </RadixSlider.Root>\n  </SliderContext.Provider>\n)\n\nSlider.displayName = 'Slider'\n","import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'flex relative h-sz-24 items-center',\n  'touch-none select-none',\n  'data-disabled:cursor-not-allowed data-disabled:opacity-dim-3',\n])\n","import { createContext, useContext } from 'react'\n\nimport type { SliderProps } from './Slider'\n\nexport type SliderContextInterface = Pick<SliderProps, 'intent' | 'shape'>\n\nexport const SliderContext = createContext<SliderContextInterface>({} as SliderContextInterface)\n\nexport const useSliderContext = () => useContext(SliderContext)\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type FocusEvent, type KeyboardEvent, type PointerEvent, Ref, useRef } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { thumbVariants } from './SliderThumb.styles'\n\nexport interface SliderThumbProps extends RadixSlider.SliderThumbProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const SliderThumb = ({\n  asChild = false,\n  className,\n  onPointerDown,\n  onKeyDown,\n  onBlur,\n  ref: forwardedRef,\n  ...rest\n}: SliderThumbProps) => {\n  const { intent } = useSliderContext()\n\n  const innerRef = useRef(null)\n  const ref = forwardedRef || innerRef\n\n  const setInteractionType = (e: KeyboardEvent | FocusEvent | PointerEvent) => {\n    /**\n     * Radix Slider implementation uses `.focus()` and thus prevent us to handle\n     * distinctively focus/focus-visible styles. So we use a `data-interaction` attribute to stay\n     * aware of the type of event, and adapt styles if needed.\n     */\n    if (typeof ref === 'function' || !ref.current) return\n    ref.current.dataset.interaction = e.type\n  }\n\n  return (\n    <RadixSlider.Thumb\n      ref={ref}\n      asChild={asChild}\n      onPointerDown={(e: PointerEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onPointerDown?.(e)\n      }}\n      onKeyDown={(e: KeyboardEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onKeyDown?.(e)\n      }}\n      onBlur={(e: FocusEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onBlur?.(e)\n      }}\n      className={thumbVariants({ intent, className })}\n      {...rest}\n    />\n  )\n}\n\nSliderThumb.displayName = 'Slider.Thumb'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const thumbVariants = cva(\n  [\n    'block h-sz-24 w-sz-24 rounded-full cursor-pointer',\n    'outline-hidden',\n    'focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-blue',\n    'data-[interaction=pointerdown]:focus-visible:ring-0!',\n    'data-disabled:hover:ring-0 data-disabled:hover:after:w-0 data-disabled:hover:after:h-0 data-disabled:cursor-not-allowed',\n    'after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2 after:z-hide',\n    'after:w-0 after:h-0 after:rounded-full after:border-solid after:border-sm after:transition-all duration-300',\n    'hover:after:w-sz-32 hover:after:h-sz-32',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['bg-main', 'after:bg-main-container after:border-main'],\n        support: ['bg-support', 'after:bg-support-container after:border-support'],\n        accent: ['bg-accent', 'after:bg-accent-container after:border-accent'],\n        basic: ['bg-basic', 'after:bg-basic-container after:border-basic'],\n        info: ['bg-info', 'after:bg-info-container after:border-info'],\n        neutral: ['bg-neutral', 'after:bg-neutral-container after:border-neutral'],\n        success: ['bg-success', 'after:bg-success-container after:border-success'],\n        alert: ['bg-alert', 'after:bg-alert-container after:border-alert'],\n        error: ['bg-error', 'after:bg-error-container after:border-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { rangeVariants, trackVariants } from './SliderTrack.styles'\n\nexport interface SliderTrackProps\n  extends RadixSlider.SliderTrackProps,\n    RadixSlider.SliderRangeProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SliderTrack = ({ asChild = false, className, ref, ...rest }: SliderTrackProps) => {\n  const { intent, shape } = useSliderContext()\n\n  return (\n    <RadixSlider.Track ref={ref} asChild={asChild} className={trackVariants({ shape })} {...rest}>\n      <RadixSlider.Range className={rangeVariants({ intent, shape, className })} />\n    </RadixSlider.Track>\n  )\n}\n\nSliderTrack.displayName = 'Slider.Track'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const trackVariants = cva(['relative grow h-sz-4 bg-on-background/dim-4'], {\n  variants: {\n    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    shape: 'square',\n  },\n})\n\nexport const rangeVariants = cva(['absolute h-full'], {\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    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    intent: 'basic',\n    shape: 'square',\n  },\n})\n\nexport type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>\n","import { Slider as Root, type SliderProps } from './Slider'\nimport { SliderThumb as Thumb, type SliderThumbProps } from './SliderThumb'\nimport { SliderTrack as Track, type SliderTrackProps } from './SliderTrack'\n\nexport const Slider: typeof Root & {\n  Thumb: typeof Thumb\n  Track: typeof Track\n} = Object.assign(Root, {\n  Thumb,\n  Track,\n})\n\nSlider.displayName = 'Slider'\nThumb.displayName = 'Slider.Thumb'\nTrack.displayName = 'Slider.Track'\n\nexport type { SliderProps, SliderThumbProps, SliderTrackProps }\n"],"mappings":"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","names":["RadixSlider","cva","jsx","RadixSlider","RadixSlider","cva","jsx","RadixSlider","Slider"]}

package/dist/slot/index.d.mts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode, PropsWithChildren, HTMLAttributes, Ref } from 'react';
+import { PropsWithChildren, HTMLAttributes, Ref, ReactNode } from 'react';
 
 declare const Slottable: ({ children }: {
-    children: ReactNode;
+    children: React.ReactNode;
 }) => react_jsx_runtime.JSX.Element;
 type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {
     ref?: Ref<HTMLElement>;

package/dist/slot/index.d.ts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode, PropsWithChildren, HTMLAttributes, Ref } from 'react';
+import { PropsWithChildren, HTMLAttributes, Ref, ReactNode } from 'react';
 
 declare const Slottable: ({ children }: {
-    children: ReactNode;
+    children: React.ReactNode;
 }) => react_jsx_runtime.JSX.Element;
 type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {
     ref?: Ref<HTMLElement>;