{"version":3,"file":"select-value.cjs","sources":["../../../components/select/select-value.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { ComponentProps, ReactNode, useMemo } from 'react';\nimport styles from './select.module.css';\nimport { SelectMultipleValue } from './select-multiple-value';\nimport { useSelectContext } from './select-root';\nimport { ItemType } from './types';\n\ntype ValueType = Omit<ItemType, 'children'>;\n\ntype SelectValueProps = ComponentProps<'span'> & {\n  placeholder?: string;\n  children?: ((value?: ValueType | ValueType[]) => ReactNode) | ReactNode;\n  className?: string;\n};\n\nexport function SelectValue({\n  children,\n  placeholder,\n  className,\n  ...props\n}: SelectValueProps) {\n  const { value, items, multiple } = useSelectContext();\n\n  const hasValue = multiple\n    ? Array.isArray(value) && value.length > 0\n    : !!value;\n\n  const item = useMemo(() => {\n    if (!value) return undefined;\n    if (multiple && Array.isArray(value)) {\n      const itemValues = value.map(v => items[v]);\n      if (itemValues.length === 1) return itemValues[0];\n      return itemValues;\n    }\n    return items[value as string];\n  }, [value, items, multiple]);\n\n  if (!hasValue) {\n    return (\n      <span\n        data-placeholder=''\n        data-slot='select-value'\n        className={cx(styles.placeholder, className)}\n        {...props}\n      >\n        {placeholder}\n      </span>\n    );\n  }\n\n  if (typeof children === 'function') {\n    return (\n      <span data-slot='select-value' className={className} {...props}>\n        {children(item)}\n      </span>\n    );\n  }\n\n  if (children) {\n    return (\n      <span data-slot='select-value' className={className} {...props}>\n        {children}\n      </span>\n    );\n  }\n\n  if (Array.isArray(item)) {\n    return <SelectMultipleValue data={item} />;\n  }\n\n  return (\n    <span data-slot='select-value' className={className} {...props}>\n      <div className={cx(styles.valueContent)} data-slot='select-value-content'>\n        {typeof item?.children === 'string' && item?.leadingIcon && (\n          <div className={styles.itemIcon} data-slot='select-value-icon'>\n            {item.leadingIcon}\n          </div>\n        )}\n        {item?.children ?? value}\n      </div>\n    </span>\n  );\n}\nSelectValue.displayName = 'Select.Value';\n"],"names":[],"mappings":";;;;;;;;;;AAiBgB;;;AASZ;AACA;AAEF;AACE;AAAY;;AAEV;AACA;AAA6B;AAC7B;;AAEF;;;;;AAgBF;AACE;;;AAQA;;AAOF;AACE;;;AAeJ;AACA;;"}