@spark-ui/components 11.1.0 → 11.1.2

package/dist/chip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/chip/index.ts","../../src/chip/Chip.styles.tsx","../../src/chip/variants/outlined.ts","../../src/chip/variants/tinted.ts","../../src/chip/variants/dashed.ts","../../src/chip/useChipContext.tsx","../../src/chip/useChipElement.tsx","../../src/slot/Slot.tsx","../../src/chip/Chip.tsx","../../src/chip/ChipClearButton.tsx","../../src/icon/Icon.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx","../../src/chip/ChipClearButton.styles.tsx","../../src/chip/ChipContent.tsx","../../src/chip/ChipLeadingIcon.tsx","../../src/chip/ChipIcon.tsx","../../src/chip/ChipTrailingIcon.tsx"],"sourcesContent":["import { Chip as Root } from './Chip'\nimport { ChipClearButton } from './ChipClearButton'\nimport { ChipContent } from './ChipContent'\nimport { ChipLeadingIcon } from './ChipLeadingIcon'\nimport { ChipTrailingIcon } from './ChipTrailingIcon'\n\nexport const Chip: typeof Root & {\n  Content: typeof ChipContent\n  LeadingIcon: typeof ChipLeadingIcon\n  TrailingIcon: typeof ChipTrailingIcon\n  ClearButton: typeof ChipClearButton\n} = Object.assign(Root, {\n  Content: ChipContent,\n  LeadingIcon: ChipLeadingIcon,\n  TrailingIcon: ChipTrailingIcon,\n  ClearButton: ChipClearButton,\n})\n\nChip.displayName = 'Chip'\nChip.ClearButton.displayName = 'Chip.ClearButton'\nChip.Content.displayName = 'Chip.Content'\nChip.LeadingIcon.displayName = 'Chip.LeadingIcon'\nChip.TrailingIcon.displayName = 'Chip.TrailingIcon'\n\nexport { type ChipClearButtonProps } from './ChipClearButton'\nexport { type ChipContentProps } from './ChipContent'\nexport { type ChipLeadingIconProps } from './ChipLeadingIcon'\nexport { type ChipTrailingIconProps } from './ChipTrailingIcon'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { dashedVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const chipStyles = cva(\n  [\n    'box-border inline-flex h-sz-32 flex-nowrap items-center justify-center rounded-md text-body-1 font-regular',\n    'focus-visible:u-outline',\n    'ease-out duration-150',\n  ],\n  {\n    variants: {\n      /**\n       * Main style of the chip.\n       *\n       * - `filled`: Chip will be plain.\n       *\n       * - `outlined`: Chip will be transparent with an outline.\n       *\n       * - `tinted`: Chip will be filled but using a lighter color scheme.\n       *\n       * - `dashed`: Chip will be transparent with an outline dashed.\n       */\n      design: makeVariants<'design', ['outlined', 'tinted', 'dashed']>({\n        outlined: ['bg-transparent border-sm border-solid border-current'],\n        tinted: [''],\n        dashed: [\n          'bg-transparent border-sm border-dashed shadow-none focus-visible:border-outline-high',\n        ],\n      }),\n      /**\n       * Color scheme of the chip.\n       */\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'basic',\n          'accent',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n        ]\n      >({\n        main: [],\n        support: [],\n        basic: [],\n        accent: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n      }),\n      /**\n       * Disable the chip, preventing user interaction and adding opacity.\n       */\n      disabled: {\n        true: ['cursor-not-allowed', 'opacity-dim-3'],\n      },\n      hasClearButton: {\n        true: [],\n        false: [],\n      },\n      // 'pl-[calc(var(--spacing-md)-(var(--border-width-sm)))]'\n    },\n    compoundVariants: [...outlinedVariants, ...tintedVariants, ...dashedVariants],\n    defaultVariants: {\n      design: 'outlined',\n      intent: 'basic',\n    },\n  }\n)\n\nexport type ChipStylesProps = VariantProps<typeof chipStyles>\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n  /** Intents **/\n  {\n    design: 'outlined',\n    intent: 'main',\n    class: tw([\n      'enabled:hover:bg-main/dim-5',\n      'enabled:active:bg-main/dim-5',\n      'focus-visible:bg-main/dim-5',\n      'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n      'text-main',\n    ]),\n  },\n  {\n    design: 'outlined',\n    intent: 'support',\n    class: tw([\n      'enabled:hover:bg-support/dim-5',\n      'enabled:active:bg-support/dim-5',\n      'focus-visible:bg-support/dim-5',\n      'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n      'text-support',\n    ]),\n  },\n  {\n    design: 'outlined',\n    intent: 'basic',\n    class: tw([\n      'enabled:hover:bg-basic/dim-5',\n      'enabled:active:bg-basic/dim-5',\n      'focus-visible:bg-basic/dim-5',\n      'aria-pressed:bg-basic-container aria-pressed:text-on-basic-container aria-pressed:enabled:hover:bg-basic-container/dim-1',\n      'text-basic',\n    ]),\n  },\n  {\n    intent: 'accent',\n    design: 'outlined',\n    class: tw([\n      'enabled:hover:bg-accent/dim-5',\n      'enabled:active:bg-accent/dim-5',\n      'focus-visible:bg-accent/dim-5',\n      'aria-pressed:bg-accent-container',\n      'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n      'text-accent',\n    ]),\n  },\n  {\n    design: 'outlined',\n    intent: 'success',\n    class: tw([\n      'enabled:hover:bg-success/dim-5',\n      'enabled:active:bg-success/dim-5',\n      'focus-visible:bg-success/dim-5',\n      'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n      'text-success',\n    ]),\n  },\n  {\n    intent: 'alert',\n    design: 'outlined',\n    class: tw([\n      'enabled:hover:bg-alert/dim-5',\n      'enabled:active:bg-alert/dim-5',\n      'focus-visible:bg-alert/dim-5',\n      'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n      'text-alert',\n    ]),\n  },\n  {\n    design: 'outlined',\n    intent: 'danger',\n    class: tw([\n      'enabled:hover:bg-error/dim-5',\n      'enabled:active:bg-error/dim-5',\n      'focus-visible:bg-error/dim-5',\n      'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n      'text-error',\n    ]),\n  },\n  {\n    design: 'outlined',\n    intent: 'info',\n    class: tw([\n      'enabled:hover:bg-info/dim-5',\n      'enabled:active:bg-info/dim-5',\n      'focus-visible:bg-info/dim-5',\n      'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n      'text-info',\n    ]),\n  },\n  {\n    design: 'outlined',\n    intent: 'neutral',\n    class: tw([\n      'enabled:hover:bg-neutral/dim-5',\n      'enabled:active:bg-neutral/dim-5',\n      'focus-visible:bg-neutral/dim-5',\n      'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n      'text-neutral',\n    ]),\n  },\n  {\n    design: 'outlined',\n    intent: 'surface',\n    class: tw([\n      'enabled:hover:bg-surface/dim-5',\n      'enabled:active:bg-surface/dim-5',\n      'focus-visible:bg-surface/dim-5',\n      'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n      'text-surface',\n    ]),\n  },\n  /** Spacings **/\n  {\n    design: 'outlined',\n    hasClearButton: false,\n    class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n  },\n  {\n    design: 'outlined',\n    hasClearButton: true,\n    class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n  /** Intents **/\n  {\n    intent: 'main',\n    design: 'tinted',\n    class: tw([\n      'bg-main-container',\n      'enabled:hover:bg-main-container-hovered',\n      'enabled:active:bg-main-container-hovered',\n      'focus-visible:bg-main-container-hovered',\n      'aria-pressed:bg-main aria-pressed:text-on-main aria-pressed:enabled:hover:bg-main/dim-1',\n      'text-on-main-container',\n    ]),\n  },\n  {\n    intent: 'support',\n    design: 'tinted',\n    class: tw([\n      'bg-support-container',\n      'enabled:hover:bg-support-container-hovered',\n      'enabled:active:bg-support-container-hovered',\n      'focus-visible:bg-support-container-hovered',\n      'aria-pressed:bg-support aria-pressed:text-on-support aria-pressed:enabled:hover:bg-support/dim-1',\n      'text-on-support-container',\n    ]),\n  },\n  {\n    intent: 'basic',\n    design: 'tinted',\n    class: tw([\n      'bg-basic-container',\n      'enabled:hover:bg-basic-container-hovered',\n      'enabled:active:bg-basic-container-hovered',\n      'focus-visible:bg-basic-container-hovered',\n      'aria-pressed:bg-basic aria-pressed:text-on-basic aria-pressed:enabled:hover:bg-basic/dim-1',\n      'text-on-basic-container',\n    ]),\n  },\n  {\n    intent: 'accent',\n    design: 'tinted',\n    class: tw([\n      'bg-accent-container',\n      'enabled:hover:bg-accent-container-hovered',\n      'enabled:active:bg-accent-container-hovered',\n      'focus-visible:bg-accent-container-hovered',\n      'aria-pressed:bg-accent aria-pressed:text-on-accent aria-pressed:enabled:hover:bg-accent/dim-1',\n      'text-on-accent-container',\n    ]),\n  },\n  {\n    intent: 'success',\n    design: 'tinted',\n    class: tw([\n      'bg-success-container',\n      'enabled:hover:bg-success-container-hovered',\n      'enabled:active:bg-success-container-hovered',\n      'focus-visible:bg-success-container-hovered',\n      'aria-pressed:bg-success aria-pressed:text-on-success aria-pressed:enabled:hover:bg-success/dim-1',\n      'text-on-success-container',\n    ]),\n  },\n  {\n    intent: 'alert',\n    design: 'tinted',\n    class: tw([\n      'bg-alert-container',\n      'enabled:hover:bg-alert-container-hovered',\n      'enabled:active:bg-alert-container-hovered',\n      'focus-visible:bg-alert-container-hovered',\n      'aria-pressed:bg-alert aria-pressed:text-on-alert aria-pressed:enabled:hover:bg-alert/dim-1',\n      'text-on-alert-container',\n    ]),\n  },\n  {\n    intent: 'danger',\n    design: 'tinted',\n    class: tw([\n      'bg-error-container',\n      'enabled:hover:bg-error-container-hovered',\n      'enabled:active:bg-error-container-hovered',\n      'focus-visible:bg-error-container-hovered',\n      'aria-pressed:bg-error aria-pressed:text-on-error aria-pressed:enabled:hover:bg-error/dim-1',\n      'text-on-error-container',\n    ]),\n  },\n  {\n    intent: 'info',\n    design: 'tinted',\n    class: tw([\n      'bg-info-container',\n      'enabled:hover:bg-info-container-hovered',\n      'enabled:active:bg-info-container-hovered',\n      'focus-visible:bg-info-container-hovered',\n      'aria-pressed:bg-info aria-pressed:text-on-info aria-pressed:enabled:hover:bg-info/dim-1',\n      'text-on-info-container',\n    ]),\n  },\n  {\n    intent: 'neutral',\n    design: 'tinted',\n    class: tw([\n      'bg-neutral-container',\n      'enabled:hover:bg-neutral-container-hovered',\n      'enabled:active:bg-neutral-container-hovered',\n      'focus-visible:bg-neutral-container-hovered',\n      'aria-pressed:bg-neutral aria-pressed:text-on-neutral aria-pressed:enabled:hover:bg-neutral/dim-1',\n      'text-on-neutral-container',\n    ]),\n  },\n  {\n    intent: 'surface',\n    design: 'tinted',\n    class: tw([\n      'bg-surface/dim-1',\n      'enabled:hover:bg-surface-hovered/dim-1',\n      'enabled:active:bg-surface-hovered/dim-1',\n      'focus-visible:bg-surface-hovered/dim-1',\n      'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n      'text-on-surface/dim-1',\n    ]),\n  },\n  /** Spacings **/\n  {\n    design: 'tinted',\n    hasClearButton: false,\n    class: tw(['px-md']),\n  },\n  {\n    design: 'tinted',\n    hasClearButton: true,\n    class: tw(['pl-md']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const dashedVariants = [\n  /** Intents **/\n  {\n    intent: 'main',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-main/dim-5',\n      'enabled:active:bg-main/dim-5',\n      'focus-visible:bg-main/dim-5',\n      'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n      'text-main',\n    ]),\n  },\n  {\n    intent: 'support',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-support/dim-5',\n      'enabled:active:bg-support/dim-5',\n      'focus-visible:bg-support/dim-5',\n      'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n      'text-support',\n    ]),\n  },\n  {\n    intent: 'basic',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-basic/dim-5',\n      'enabled:active:bg-basic/dim-5',\n      'focus-visible:bg-basic/dim-5',\n      'aria-pressed:bg-basic-container aria-pressed:text-on-basic-container aria-pressed:enabled:hover:bg-basic-container/dim-1',\n      'text-basic',\n    ]),\n  },\n  {\n    intent: 'accent',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-accent/dim-5',\n      'enabled:active:bg-accent/dim-5',\n      'focus-visible:bg-accent/dim-5',\n      'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n      'text-accent',\n    ]),\n  },\n  {\n    intent: 'success',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-success/dim-5',\n      'enabled:active:bg-success/dim-5',\n      'focus-visible:bg-success/dim-5',\n      'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n      'text-success',\n    ]),\n  },\n  {\n    intent: 'alert',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-alert/dim-5',\n      'enabled:active:bg-alert/dim-5',\n      'focus-visible:bg-alert/dim-5',\n      'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n      'text-alert',\n    ]),\n  },\n  {\n    intent: 'danger',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-error/dim-5',\n      'enabled:active:bg-error/dim-5',\n      'focus-visible:bg-error/dim-5',\n      'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n      'text-error',\n    ]),\n  },\n  {\n    intent: 'info',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-info/dim-5',\n      'enabled:active:bg-info/dim-5',\n      'focus-visible:bg-info/dim-5',\n      'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n      'text-info',\n    ]),\n  },\n  {\n    intent: 'neutral',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-neutral/dim-5',\n      'enabled:active:bg-neutral/dim-5',\n      'focus-visible:bg-neutral/dim-5',\n      'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n      'text-neutral',\n    ]),\n  },\n  {\n    intent: 'surface',\n    design: 'dashed',\n    class: tw([\n      'enabled:hover:bg-surface/dim-5',\n      'enabled:active:bg-surface/dim-5',\n      'focus-visible:bg-surface/dim-5',\n      'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n      'text-surface',\n    ]),\n  },\n  /** Spacings **/\n  {\n    design: 'dashed',\n    hasClearButton: false,\n    class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n  },\n  {\n    design: 'dashed',\n    hasClearButton: true,\n    class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n  },\n] as const\n","import { createContext, useContext } from 'react'\n\nimport { type ChipProps } from './Chip'\n\nexport type ChipsContextType = Pick<ChipProps, 'disabled' | 'design' | 'intent' | 'onClear'>\n\nexport const ChipContext = createContext<ChipsContextType>({} as ChipsContextType)\nexport const useChipContext = () => useContext(ChipContext) || {}\n","import { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { emulateTab } from 'emulate-tab'\nimport {\n  Children,\n  ElementType,\n  FC,\n  ForwardRefExoticComponent,\n  HTMLAttributes,\n  isValidElement,\n  KeyboardEvent,\n  MouseEvent,\n  ReactElement,\n  ReactNode,\n  RefAttributes,\n} from 'react'\n\nimport { Slot } from '../slot'\n\ninterface ReturnedValue {\n  Element:\n    | ForwardRefExoticComponent<\n        HTMLAttributes<HTMLElement> & {\n          children?: ReactNode\n        } & RefAttributes<HTMLElement>\n      >\n    | ElementType\n  chipProps:\n    | {\n        type: 'button'\n        'aria-pressed'?: boolean\n        'data-state'?: 'on' | 'off'\n        onClick: (event: MouseEvent<HTMLButtonElement>) => void\n        onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n        disabled?: boolean\n        children: ReactNode\n      }\n    | {\n        'aria-disabled'?: boolean\n        children: ReactNode\n        onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n      }\n  compoundElements: {\n    leadingIcon: ReactNode\n    trailingIcon: ReactNode\n    content: ReactNode\n    clearButton: ReactNode\n  }\n}\n\nconst getDisplayName = (element?: ReactElement) => {\n  return element ? (element.type as FC).displayName : ''\n}\n\nconst findElement =\n  (children: ReactNode) =>\n  (...values: string[]) => {\n    const validChildren = Children.toArray(children).filter(isValidElement)\n\n    return validChildren.find(child => {\n      const displayName = getDisplayName(child)\n\n      return values.includes(displayName || '')\n    })\n  }\n\n// eslint-disable-next-line complexity\nexport const useChipElement = ({\n  onClick,\n  asChild,\n  pressed,\n  defaultPressed,\n  disabled,\n  value,\n  defaultValue,\n  children,\n  onClear,\n}: {\n  onClick?: (\n    event: MouseEvent<HTMLButtonElement>,\n    args: { pressed: boolean; value?: string | number | readonly string[] }\n  ) => void\n  onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n  asChild?: boolean\n  pressed?: boolean\n  defaultPressed?: boolean\n  value?: string | number | readonly string[]\n  defaultValue?: string | number | readonly string[]\n  disabled?: boolean\n  children?: ReactNode\n  onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n}): ReturnedValue => {\n  const [isPressed, setIsPressed] = useCombinedState<boolean | undefined>(pressed, defaultPressed)\n  const [innerValue] = useCombinedState<string | number | readonly string[] | undefined>(\n    value,\n    defaultValue\n  )\n\n  const findChipElement = findElement(children)\n\n  const leadingIcon = findChipElement('Chip.LeadingIcon')\n  const trailingIcon = findChipElement('Chip.TrailingIcon')\n  const content = findChipElement('Chip.Content')\n  const clearButton = findChipElement('Chip.ClearButton')\n\n  const isButton = (onClick || isPressed) !== undefined\n\n  const formattedChildren = [leadingIcon, content, clearButton].every(\n    element => element === undefined\n  ) ? (\n    <span className=\"inline-block grow truncate\">{children}</span>\n  ) : (\n    <>\n      {leadingIcon}\n      {content}\n      {leadingIcon === undefined ? trailingIcon : null}\n      {clearButton}\n    </>\n  )\n\n  const onKeyDown = (event: KeyboardEvent<HTMLButtonElement>): void => {\n    if (!!clearButton && !disabled && ['Delete', 'Backspace'].includes(event.key)) {\n      if (onClear) {\n        onClear()\n        event.key === 'Delete' && emulateTab()\n        event.key === 'Backspace' && emulateTab.backwards()\n      }\n    }\n  }\n\n  if (isButton) {\n    return {\n      Element: asChild ? Slot : 'button',\n      chipProps: {\n        type: 'button',\n        ...(isPressed !== undefined && {\n          'aria-pressed': isPressed,\n          'data-state': isPressed ? 'on' : 'off',\n        }),\n        onClick: (event: MouseEvent<HTMLButtonElement>): void => {\n          isPressed !== undefined && setIsPressed(!isPressed)\n          onClick && onClick(event, { pressed: isPressed as boolean, value: innerValue })\n        },\n        onKeyDown,\n        disabled,\n        children: formattedChildren,\n      },\n      compoundElements: {\n        leadingIcon,\n        trailingIcon,\n        content,\n        clearButton,\n      },\n    }\n  }\n\n  return {\n    Element: asChild ? Slot : 'div',\n    chipProps: {\n      'aria-disabled': disabled,\n      children: formattedChildren,\n      onKeyDown,\n    },\n    compoundElements: {\n      leadingIcon,\n      trailingIcon,\n      content,\n      clearButton,\n    },\n  }\n}\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n  cloneElement,\n  HTMLAttributes,\n  isValidElement,\n  PropsWithChildren,\n  ReactNode,\n  Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n  return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n  asChild: boolean | undefined,\n  children: ReactNode,\n  callback: (children: ReactNode) => ReactNode\n) => {\n  if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n  return isValidElement(children)\n    ? cloneElement(\n        children,\n        undefined,\n        callback((children.props as { children: ReactNode }).children)\n      )\n    : null\n}\n","import { ComponentPropsWithoutRef, MouseEvent, Ref } from 'react'\n\nimport { chipStyles, type ChipStylesProps } from './Chip.styles'\nimport { ChipContext } from './useChipContext'\nimport { useChipElement } from './useChipElement'\n\ntype ChipPrimitiveProps = Omit<ComponentPropsWithoutRef<'button'>, 'onClick' | 'disabled' | 'type'>\n\nexport interface ChipProps extends ChipPrimitiveProps, Omit<ChipStylesProps, 'hasClearButton'> {\n  /**\n   * Configures a toggleButton aria-pressed initial value\n   */\n  defaultPressed?: boolean\n  /**\n   * Configures a toggleButton aria-pressed value\n   */\n  pressed?: boolean\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Event handler fired each clicking event\n   */\n  onClick?: (\n    event: MouseEvent<HTMLButtonElement>,\n    args: { pressed: boolean; value?: number | string | readonly string[] }\n  ) => void\n  /**\n   * Clear chip handler\n   */\n  onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n  ref?: Ref<HTMLButtonElement | HTMLDivElement>\n}\n\nexport const Chip = ({\n  design = 'outlined',\n  disabled,\n  children,\n  intent = 'basic',\n  defaultPressed,\n  pressed,\n  asChild,\n  className,\n  onClick,\n  onClear,\n  ref: forwardedRef,\n  ...otherProps\n}: ChipProps) => {\n  const {\n    Element: ChipElement,\n    chipProps: { children: formattedChildren, ...chipProps },\n    compoundElements,\n  } = useChipElement({\n    asChild,\n    pressed,\n    defaultPressed,\n    onClick,\n    disabled: !!disabled,\n    value: otherProps.value,\n    defaultValue: otherProps.defaultValue,\n    children,\n    onClear,\n  })\n\n  const { clearButton } = compoundElements\n\n  return (\n    <ChipContext.Provider value={{ disabled, design, intent, onClear }}>\n      <ChipElement\n        ref={forwardedRef}\n        className={chipStyles({\n          className,\n          design,\n          disabled,\n          intent,\n          hasClearButton: !!clearButton,\n        })}\n        {...{\n          ...chipProps,\n          ...otherProps,\n        }}\n        data-spark-component=\"chip\"\n      >\n        {formattedChildren}\n      </ChipElement>\n    </ChipContext.Provider>\n  )\n}\n\nChip.displayName = 'Chip'\n","import { Close } from '@spark-ui/icons/Close'\nimport {\n  cloneElement,\n  ComponentPropsWithoutRef,\n  MouseEvent,\n  ReactElement,\n  Ref,\n  useCallback,\n} from 'react'\n\nimport { Icon } from '../icon'\nimport {\n  chipClearButtonStyles,\n  type ChipClearButtonStylesProps,\n  chipClearButtonWrapperStyles,\n} from './ChipClearButton.styles'\nimport { useChipContext } from './useChipContext'\n\nexport interface ChipClearButtonProps\n  extends ComponentPropsWithoutRef<'span'>,\n    ChipClearButtonStylesProps {\n  label: string\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipClearButton = ({\n  children = (\n    <Icon>\n      <Close />\n    </Icon>\n  ),\n  tabIndex = 0,\n  label,\n  ref: forwardedRef,\n}: ChipClearButtonProps) => {\n  const { design, disabled, onClear } = useChipContext()\n\n  const onClearHandler = useCallback(\n    (event: MouseEvent<HTMLButtonElement>) => {\n      event.stopPropagation()\n      !disabled && onClear && onClear(event)\n    },\n    [disabled, onClear]\n  )\n\n  return (\n    <span\n      className={chipClearButtonWrapperStyles({\n        isBordered: ['outline', 'dashed'].includes(`${design}`),\n        disabled: !!disabled,\n        design,\n      })}\n      onClick={onClearHandler}\n      ref={forwardedRef}\n    >\n      <button\n        tabIndex={tabIndex}\n        type=\"button\"\n        disabled={!!disabled}\n        className={chipClearButtonStyles({ disabled })}\n        aria-label={label}\n      >\n        {children && cloneElement(children as ReactElement<HTMLElement>, { ariaLabel: label })}\n      </button>\n    </span>\n  )\n}\n\nChipClearButton.displayName = 'Chip.ClearButton'\n","import { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n  /**\n   * The svg icon that will be wrapped\n   */\n  children: ReactNode\n  /**\n   * The accessible label for the icon. This label will be visually hidden but announced to screen\n   * reader users, similar to `alt` text for `img` tags.\n   */\n  label?: string\n}\n\nexport const Icon = ({\n  label,\n  className,\n  size = 'current',\n  intent = 'current',\n  children,\n  ...others\n}: IconProps) => {\n  const child = Children.only(children)\n\n  return (\n    <>\n      {cloneElement(child as ReactElement<Record<string, any>>, {\n        className: iconStyles({ className, size, intent }),\n        'data-spark-component': 'icon',\n        'aria-hidden': 'true',\n        focusable: 'false',\n        ...others,\n      })}\n\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n    </>\n  )\n}\n\nIcon.displayName = 'Icon'\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      {...props}\n      ref={ref}\n      style={{\n        // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n        position: 'absolute',\n        border: 0,\n        width: 1,\n        height: 1,\n        padding: 0,\n        margin: -1,\n        overflow: 'hidden',\n        clip: 'rect(0, 0, 0, 0)',\n        whiteSpace: 'nowrap',\n        wordWrap: 'normal',\n        ...props.style,\n      }}\n    />\n  )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n  variants: {\n    /**\n     * Color scheme of the icon.\n     */\n    intent: makeVariants<\n      'intent',\n      [\n        'current',\n        'main',\n        'support',\n        'accent',\n        'basic',\n        'success',\n        'alert',\n        'error',\n        'info',\n        'neutral',\n      ]\n    >({\n      current: ['text-current'],\n      main: ['text-main'],\n      support: ['text-support'],\n      accent: ['text-accent'],\n      basic: ['text-basic'],\n      success: ['text-success'],\n      alert: ['text-alert'],\n      error: ['text-error'],\n      info: ['text-info'],\n      neutral: ['text-neutral'],\n    }),\n    /**\n     * Sets the size of the icon.\n     */\n    size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n      current: ['u-current-font-size'],\n      sm: ['w-sz-16', 'h-sz-16'],\n      md: ['w-sz-24', 'h-sz-24'],\n      lg: ['w-sz-32', 'h-sz-32'],\n      xl: ['w-sz-40', 'h-sz-40'],\n    }),\n  },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const chipClearButtonWrapperStyles = cva(\n  ['ml-md flex h-full items-center justify-center focus-visible:outline-hidden'],\n  {\n    variants: {\n      disabled: {\n        false: ['cursor-pointer'],\n        true: ['cursor-not-allowed'],\n      },\n      isBordered: {\n        false: ['pr-md'],\n        true: ['pr-[7px]'],\n      },\n      design: {\n        outlined: [],\n        tinted: [],\n        dashed: [],\n      },\n    },\n    compoundVariants: [\n      {\n        design: 'outlined',\n        disabled: false,\n        class: tw(['hover:opacity-dim-1']),\n      },\n      {\n        design: 'outlined',\n        disabled: true,\n        class: tw(['opacity-dim-3']),\n      },\n      {\n        design: 'tinted',\n        disabled: false,\n        class: tw(['hover:opacity-dim-1']),\n      },\n      {\n        design: 'tinted',\n        disabled: true,\n        class: tw(['opacity-dim-3']),\n      },\n      {\n        design: 'dashed',\n        disabled: false,\n        class: tw(['hover:opacity-dim-1']),\n      },\n      {\n        design: 'dashed',\n        disabled: true,\n        class: tw(['opacity-dim-3']),\n      },\n    ],\n  }\n)\n\nexport const chipClearButtonStyles = cva(\n  ['rounded-full p-sz-2 [font-size:var(--spacing-sz-8)] border-sm', 'focus-visible:u-outline'],\n  {\n    variants: {\n      disabled: {\n        true: ['cursor-not-allowed'],\n        false: ['cursor-pointer'],\n      },\n    },\n    defaultVariants: {\n      disabled: false,\n    },\n  }\n)\n\nexport type ChipClearButtonStylesProps = VariantProps<typeof chipClearButtonWrapperStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipContentProps = ComponentPropsWithoutRef<'span'> & {\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipContent = ({ children, className, ref: forwardedRef }: ChipContentProps) => {\n  return (\n    <span className={cx('inline-block grow truncate', className)} ref={forwardedRef}>\n      {children}\n    </span>\n  )\n}\n\nChipContent.displayName = 'Chip.Content'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipLeadingIconProps = ChipIconProps & {\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipLeadingIcon = ({\n  className,\n  ref: forwardedRef,\n  ...props\n}: ChipLeadingIconProps) => (\n  <ChipIcon className={cx('mr-sm', className)} ref={forwardedRef} {...props} />\n)\n\nChipLeadingIcon.displayName = 'Chip.LeadingIcon'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipIconProps = ComponentPropsWithoutRef<'span'> & {\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipIcon = ({ children, className, ref: forwardedRef }: ChipIconProps) => {\n  return (\n    <span className={cx('flex h-full items-center justify-center', className)} ref={forwardedRef}>\n      {children}\n    </span>\n  )\n}\n\nChipIcon.displayName = 'Chip.Icon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipTrailingIconProps = ChipIconProps & {\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipTrailingIcon = ({\n  className,\n  ref: forwardedRef,\n  ...props\n}: ChipTrailingIconProps) => (\n  <ChipIcon className={cx('ml-md', className)} ref={forwardedRef} {...props} />\n)\n\nChipTrailingIcon.displayName = 'Chip.TrailingIcon'\n"],"mappings":"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","names":["Chip","import_internal_utils","import_internal_utils","import_internal_utils","import_react","import_react","RadixSlot","import_jsx_runtime","import_jsx_runtime","import_react","import_react","import_jsx_runtime","import_internal_utils","import_class_variance_authority","import_jsx_runtime","import_internal_utils","import_class_variance_authority","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_class_variance_authority","import_class_variance_authority","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","Chip"]}

package/dist/collapsible/index.d.ts

@@ -0,0 +1,43 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Collapsible as Collapsible$1 } from '@base-ui-components/react/collapsible';
+import { ComponentProps } from 'react';
+
+interface ContentProps extends ComponentProps<typeof Collapsible$1.Panel> {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     */
+    asChild?: boolean;
+}
+declare const Content: {
+    ({ asChild, className, children, hiddenUntilFound, ...props }: ContentProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface RootProps extends ComponentProps<typeof Collapsible$1.Root> {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     */
+    asChild?: boolean;
+}
+declare const Root: {
+    ({ asChild, children, ...props }: RootProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface TriggerProps extends ComponentProps<'button'> {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     */
+    asChild?: boolean;
+}
+declare const Trigger: {
+    ({ asChild, children, ...props }: TriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Collapsible: typeof Root & {
+    Trigger: typeof Trigger;
+    Content: typeof Content;
+};
+
+export { Collapsible };

package/dist/collapsible/index.js

@@ -0,0 +1,109 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/collapsible/index.ts
+var collapsible_exports = {};
+__export(collapsible_exports, {
+  Collapsible: () => Collapsible4
+});
+module.exports = __toCommonJS(collapsible_exports);
+
+// src/collapsible/Content.tsx
+var import_collapsible = require("@base-ui-components/react/collapsible");
+var import_class_variance_authority = require("class-variance-authority");
+
+// src/slot/Slot.tsx
+var import_radix_ui = require("radix-ui");
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Slottable = import_radix_ui.Slot.Slottable;
+var Slot = ({ ref, ...props }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Slot.Root, { ref, ...props });
+};
+
+// src/collapsible/useRenderSlot.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function useRenderSlot(asChild, defaultTag) {
+  const Component = asChild ? Slot : defaultTag;
+  return asChild ? ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Component, { ...props }) : void 0;
+}
+
+// src/collapsible/Content.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var Content = ({
+  asChild = false,
+  className,
+  children,
+  hiddenUntilFound = true,
+  ...props
+}) => {
+  const renderSlot = useRenderSlot(asChild, "div");
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_collapsible.Collapsible.Panel,
+    {
+      "data-spark-component": "collapsible-content",
+      className: (0, import_class_variance_authority.cx)(
+        "overflow-hidden",
+        "h-[var(--collapsible-panel-height)]",
+        "transition-all duration-200",
+        "motion-reduce:transition-none",
+        "data-[starting-style]:h-0",
+        "data-[ending-style]:h-0",
+        className
+      ),
+      render: renderSlot,
+      hiddenUntilFound,
+      ...props,
+      children
+    }
+  );
+};
+Content.displayName = "Collapsible.Content";
+
+// src/collapsible/Root.tsx
+var import_collapsible2 = require("@base-ui-components/react/collapsible");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Root = ({ asChild = false, children, ...props }) => {
+  const renderSlot = useRenderSlot(asChild, "div");
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_collapsible2.Collapsible.Root, { "data-spark-component": "collapsible", render: renderSlot, ...props, children });
+};
+Root.displayName = "Collapsible";
+
+// src/collapsible/Trigger.tsx
+var import_collapsible3 = require("@base-ui-components/react/collapsible");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var Trigger = ({ asChild = false, children, ...props }) => {
+  const renderSlot = useRenderSlot(asChild, "button");
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_collapsible3.Collapsible.Trigger, { "data-spark-component": "collapsible-trigger", render: renderSlot, ...props, children });
+};
+Trigger.displayName = "Collapsible.Trigger";
+
+// src/collapsible/index.ts
+var Collapsible4 = Object.assign(Root, {
+  Trigger,
+  Content
+});
+Collapsible4.displayName = "Collapsible";
+Trigger.displayName = "Collapsible.Trigger";
+Content.displayName = "Collapsible.Content";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Collapsible
+});
+//# sourceMappingURL=index.js.map

package/dist/collapsible/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/collapsible/index.ts","../../src/collapsible/Content.tsx","../../src/slot/Slot.tsx","../../src/collapsible/useRenderSlot.tsx","../../src/collapsible/Root.tsx","../../src/collapsible/Trigger.tsx"],"sourcesContent":["import { Content } from './Content'\nimport { Root } from './Root'\nimport { Trigger } from './Trigger'\n\nexport const Collapsible: typeof Root & {\n  Trigger: typeof Trigger\n  Content: typeof Content\n} = Object.assign(Root, {\n  Trigger,\n  Content,\n})\n\nCollapsible.displayName = 'Collapsible'\nTrigger.displayName = 'Collapsible.Trigger'\nContent.displayName = 'Collapsible.Content'\n","import { Collapsible } from '@base-ui-components/react/collapsible'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface ContentProps extends ComponentProps<typeof Collapsible.Panel> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n}\n\nexport const Content = ({\n  asChild = false,\n  className,\n  children,\n  hiddenUntilFound = true,\n  ...props\n}: ContentProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <Collapsible.Panel\n      data-spark-component=\"collapsible-content\"\n      className={cx(\n        'overflow-hidden',\n        'h-[var(--collapsible-panel-height)]',\n        'transition-all duration-200',\n        'motion-reduce:transition-none',\n        'data-[starting-style]:h-0',\n        'data-[ending-style]:h-0',\n        className\n      )}\n      render={renderSlot}\n      hiddenUntilFound={hiddenUntilFound}\n      {...props}\n    >\n      {children}\n    </Collapsible.Panel>\n  )\n}\n\nContent.displayName = 'Collapsible.Content'\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n  cloneElement,\n  HTMLAttributes,\n  isValidElement,\n  PropsWithChildren,\n  ReactNode,\n  Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n  return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n  asChild: boolean | undefined,\n  children: ReactNode,\n  callback: (children: ReactNode) => ReactNode\n) => {\n  if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n  return isValidElement(children)\n    ? cloneElement(\n        children,\n        undefined,\n        callback((children.props as { children: ReactNode }).children)\n      )\n    : null\n}\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { Collapsible } from '@base-ui-components/react/collapsible'\nimport { type ComponentProps } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface RootProps extends ComponentProps<typeof Collapsible.Root> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n}\n\nexport const Root = ({ asChild = false, children, ...props }: RootProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <Collapsible.Root data-spark-component=\"collapsible\" render={renderSlot} {...props}>\n      {children}\n    </Collapsible.Root>\n  )\n}\n\nRoot.displayName = 'Collapsible'\n","import { Collapsible } from '@base-ui-components/react/collapsible'\nimport { type ComponentProps } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface TriggerProps extends ComponentProps<'button'> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n}\n\nexport const Trigger = ({ asChild = false, children, ...props }: TriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return (\n    <Collapsible.Trigger data-spark-component=\"collapsible-trigger\" render={renderSlot} {...props}>\n      {children}\n    </Collapsible.Trigger>\n  )\n}\n\nTrigger.displayName = 'Collapsible.Trigger'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,qBAAAA;AAAA;AAAA;;;ACAA,yBAA4B;AAC5B,sCAAmB;;;ACDnB,sBAAkC;AAClC,mBAOO;AASE;AAPF,IAAM,YAAwC,gBAAAC,KAAU;AAMxD,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AACpD,SAAO,4CAAC,gBAAAA,KAAU,MAAV,EAAe,KAAW,GAAG,OAAO;AAC9C;;;ACbqC,IAAAC,sBAAA;AAH9B,SAAS,cAAc,SAAkB,YAAoB;AAClE,QAAM,YAAY,UAAU,OAAO;AAEnC,SAAO,UAAU,CAAC,EAAE,GAAG,MAAM,MAAM,6CAAC,aAAW,GAAG,OAAO,IAAK;AAChE;;;AFiBI,IAAAC,sBAAA;AAVG,IAAM,UAAU,CAAC;AAAA,EACtB,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB,GAAG;AACL,MAAoB;AAClB,QAAM,aAAa,cAAc,SAAS,KAAK;AAE/C,SACE;AAAA,IAAC,+BAAY;AAAA,IAAZ;AAAA,MACC,wBAAqB;AAAA,MACrB,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,QAAQ;AAAA,MACR;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEA,QAAQ,cAAc;;;AG3CtB,IAAAC,sBAA4B;AAgBxB,IAAAC,sBAAA;AAJG,IAAM,OAAO,CAAC,EAAE,UAAU,OAAO,UAAU,GAAG,MAAM,MAAiB;AAC1E,QAAM,aAAa,cAAc,SAAS,KAAK;AAE/C,SACE,6CAAC,gCAAY,MAAZ,EAAiB,wBAAqB,eAAc,QAAQ,YAAa,GAAG,OAC1E,UACH;AAEJ;AAEA,KAAK,cAAc;;;ACtBnB,IAAAC,sBAA4B;AAgBxB,IAAAC,sBAAA;AAJG,IAAM,UAAU,CAAC,EAAE,UAAU,OAAO,UAAU,GAAG,MAAM,MAAoB;AAChF,QAAM,aAAa,cAAc,SAAS,QAAQ;AAElD,SACE,6CAAC,gCAAY,SAAZ,EAAoB,wBAAqB,uBAAsB,QAAQ,YAAa,GAAG,OACrF,UACH;AAEJ;AAEA,QAAQ,cAAc;;;ALlBf,IAAMC,eAGT,OAAO,OAAO,MAAM;AAAA,EACtB;AAAA,EACA;AACF,CAAC;AAEDA,aAAY,cAAc;AAC1B,QAAQ,cAAc;AACtB,QAAQ,cAAc;","names":["Collapsible","RadixSlot","import_jsx_runtime","import_jsx_runtime","import_collapsible","import_jsx_runtime","import_collapsible","import_jsx_runtime","Collapsible"]}

package/dist/combobox/index.d.ts

@@ -0,0 +1,287 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Dispatch, SetStateAction, RefObject, PropsWithChildren, ComponentPropsWithoutRef, Ref, ComponentProps, ReactNode, HTMLAttributes, ReactElement } from 'react';
+import { UseComboboxReturnValue, UseMultipleSelectionReturnValue } from 'downshift';
+import { IconButton } from '../icon-button/index.js';
+import { Popover as Popover$1 } from '../popover/index.js';
+import '../button/index.js';
+import 'class-variance-authority/types';
+import 'class-variance-authority';
+import 'radix-ui';
+
+interface ComboboxItem {
+    disabled: boolean;
+    value: string;
+    text: string;
+}
+type ItemsMap = Map<string, ComboboxItem>;
+type DownshiftState = UseComboboxReturnValue<ComboboxItem> & UseMultipleSelectionReturnValue<ComboboxItem>;
+
+interface ComboboxContextState extends DownshiftState {
+    itemsMap: ItemsMap;
+    filteredItemsMap: ItemsMap;
+    highlightedItem: ComboboxItem | undefined;
+    hasPopover: boolean;
+    areSelectedItemsInTrigger: boolean;
+    multiple: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    wrap?: boolean;
+    state?: 'error' | 'alert' | 'success';
+    lastInteractionType: 'mouse' | 'keyboard';
+    setHasPopover: Dispatch<SetStateAction<boolean>>;
+    setAreSelectedItemsInTrigger: Dispatch<SetStateAction<boolean>>;
+    setLastInteractionType: (type: 'mouse' | 'keyboard') => void;
+    setOnInputValueChange: Dispatch<SetStateAction<((v: string) => void) | null>>;
+    innerInputRef: RefObject<HTMLInputElement | null>;
+    triggerAreaRef: RefObject<HTMLDivElement | null>;
+    isLoading?: boolean;
+    isTyping?: boolean;
+    setIsTyping: Dispatch<SetStateAction<boolean>>;
+}
+type ComboboxContextCommonProps = PropsWithChildren<{
+    /**
+     * The controlled open state of the select. Must be used in conjunction with `onOpenChange`.
+     */
+    open?: boolean;
+    /**
+     * Event handler called when the open state of the select changes.
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * The open state of the select when it is initially rendered. Use when you do not need to control its open state.
+     */
+    defaultOpen?: boolean;
+    /**
+     * Use `state` prop to assign a specific state to the combobox, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.
+     */
+    state?: 'error' | 'alert' | 'success';
+    /**
+     * When true, prevents the user from interacting with the combobox.
+     */
+    disabled?: boolean;
+    /**
+     * Sets the combobox as interactive or not.
+     */
+    readOnly?: boolean;
+    /**
+     * When true, the items will be filtered depending on the value of the input (not case-sensitive).
+     */
+    filtering?: 'none' | 'auto' | 'strict';
+    /**
+     * By default, the combobox will clear or restore the input value to the selected item value on blur.
+     */
+    allowCustomValue?: boolean;
+    /**
+     * In multiple selection, many selected items might be displayed. Be default, the combobox trigger will expand vertically to display them all.
+     * If you wish to keep every item on a single line, disabled this property.
+     */
+    wrap?: boolean;
+    /**
+     * Display a spinner to indicate to the user that the combobox is loading results for .
+     */
+    isLoading?: boolean;
+}>;
+interface ComboboxPropsSingle {
+    /**
+     * Prop 'multiple' indicating whether multiple values are allowed.
+     */
+    multiple?: false;
+    /**
+     * The value of the select when initially rendered. Use when you do not need to control the state of the select.
+     */
+    defaultValue?: string;
+    /**
+     * The controlled value of the select. Should be used in conjunction with `onValueChange`.
+     */
+    value?: string | null;
+    /**
+     * Event handler called when the value changes.
+     */
+    onValueChange?: (value: string) => void;
+}
+interface ComboboxPropsMultiple {
+    /**
+     * Prop 'multiple' indicating whether multiple values are allowed.
+     */
+    multiple: true;
+    /**
+     * The value of the select when initially rendered. Use when you do not need to control the state of the select.
+     */
+    defaultValue?: string[];
+    /**
+     * The controlled value of the select. Should be used in conjunction with `onValueChange`.
+     */
+    value?: string[];
+    /**
+     * Event handler called when the value changes.
+     */
+    onValueChange?: (value: string[]) => void;
+}
+type ComboboxContextProps = ComboboxContextCommonProps & (ComboboxPropsSingle | ComboboxPropsMultiple);
+declare const ComboboxProvider: ({ children, state: stateProp, allowCustomValue, filtering, disabled: disabledProp, multiple, readOnly: readOnlyProp, wrap, value: controlledValue, defaultValue, onValueChange, open: controlledOpen, defaultOpen, onOpenChange, isLoading, }: ComboboxContextProps) => react_jsx_runtime.JSX.Element;
+declare const useComboboxContext: () => ComboboxContextState;
+
+type ComboboxProps = ComboboxContextProps;
+declare const Combobox$1: {
+    ({ children, ...props }: ComboboxProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface ClearButtonProps extends ComponentPropsWithoutRef<'button'> {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+}
+declare const ClearButton: {
+    ({ className, tabIndex, onClick, ref, ...others }: ClearButtonProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface DisclosureProps extends Omit<ComponentProps<typeof IconButton>, 'aria-label'> {
+    className?: string;
+    closedLabel: string;
+    openedLabel: string;
+    ref?: Ref<HTMLButtonElement>;
+}
+declare const Disclosure: {
+    ({ className, closedLabel, openedLabel, intent, design, size, ref: forwardedRef, ...props }: DisclosureProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface EmptyProps {
+    className?: string;
+    children: ReactNode;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Empty: {
+    ({ className, children, ref: forwardedRef }: EmptyProps): react_jsx_runtime.JSX.Element | null;
+    displayName: string;
+};
+
+interface GroupProps {
+    children: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Group: {
+    ({ children, ref: forwardedRef, ...props }: GroupProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type InputPrimitiveProps = ComponentPropsWithoutRef<'input'>;
+interface InputProps extends Omit<InputPrimitiveProps, 'value' | 'placeholder'> {
+    className?: string;
+    placeholder?: string;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    ref?: Ref<HTMLInputElement>;
+}
+declare const Input: {
+    ({ "aria-label": ariaLabel, className, placeholder, value, defaultValue, onValueChange, ref: forwardedRef, ...props }: InputProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface ItemProps extends HTMLAttributes<HTMLLIElement> {
+    disabled?: boolean;
+    value: string;
+    children: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLLIElement>;
+}
+declare const Item: {
+    ({ children, ref: forwardedRef, ...props }: ItemProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface ItemIndicatorProps {
+    children?: ReactNode;
+    className?: string;
+    label?: string;
+    ref?: Ref<HTMLSpanElement>;
+}
+declare const ItemIndicator: {
+    ({ className, children, label, ref: forwardedRef, }: ItemIndicatorProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface ItemsProps extends ComponentPropsWithoutRef<'ul'> {
+    children: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLUListElement>;
+}
+declare const Items: {
+    ({ children, className, ref: forwardedRef, ...props }: ItemsProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface ItemTextProps {
+    children: string;
+    className?: string;
+    ref?: Ref<HTMLSpanElement>;
+}
+declare const ItemText: {
+    ({ children, className, ref: forwardedRef }: ItemTextProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface LabelProps {
+    children: string;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Label: {
+    ({ children, className, ref: forwardedRef }: LabelProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const LeadingIcon: {
+    ({ children }: {
+        children: ReactElement;
+    }): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface PopoverProps extends ComponentProps<typeof Popover$1.Content> {
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Popover: {
+    ({ children, matchTriggerWidth, sideOffset, className, ref: forwardedRef, ...props }: PopoverProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Portal: typeof Popover$1.Portal;
+
+declare const SelectedItems: {
+    (): react_jsx_runtime.JSX.Element | null;
+    displayName: string;
+};
+
+interface TriggerProps {
+    className?: string;
+    children: ReactNode;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Trigger: {
+    ({ className, children, ref: forwardedRef }: TriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Combobox: typeof Combobox$1 & {
+    Group: typeof Group;
+    Item: typeof Item;
+    Items: typeof Items;
+    ItemText: typeof ItemText;
+    ItemIndicator: typeof ItemIndicator;
+    Label: typeof Label;
+    Popover: typeof Popover;
+    Trigger: typeof Trigger;
+    LeadingIcon: typeof LeadingIcon;
+    Empty: typeof Empty;
+    Input: typeof Input;
+    Disclosure: typeof Disclosure;
+    SelectedItems: typeof SelectedItems;
+    ClearButton: typeof ClearButton;
+    Portal: typeof Portal;
+};
+
+export { Combobox, ComboboxProvider, useComboboxContext };