@yamada-ui/react 2.1.8-dev-20260409035719 → 2.2.0-dev-20260409110358

package/dist/esm/components/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","names":["Popover.Root","InputGroup.Root","Popover.Trigger","InputGroup.Element","Popover.Content"],"sources":["../../../../src/components/select/select.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type {\n  GenericsComponent,\n  HTMLProps,\n  HTMLStyledProps,\n  ThemeProps,\n} from \"../../core\"\nimport type {\n  ComboboxItem,\n  UseComboboxGroupProps,\n} from \"../../hooks/use-combobox\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { PopupAnimationProps } from \"../popover\"\nimport type { SelectStyle } from \"./select.style\"\nimport type {\n  UseSelectOptionProps,\n  UseSelectProps,\n  UseSelectReturn,\n} from \"./use-select\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport {\n  ComboboxContext,\n  ComboboxDescendantsContext,\n  ComboboxGroupContext,\n  createComboboxChildren,\n  createComboboxItem,\n  useComboboxGroup,\n  useComboboxGroupContext,\n} from \"../../hooks/use-combobox\"\nimport { cast, isArray } from \"../../utils\"\nimport { useGroupItemProps } from \"../group\"\nimport { CheckIcon, ChevronDownIcon, XIcon } from \"../icon\"\nimport { InputGroup, useInputBorder, useInputPropsContext } from \"../input\"\nimport { Popover } from \"../popover\"\nimport { selectStyle } from \"./select.style\"\nimport { SelectContext, useSelect, useSelectOption } from \"./use-select\"\n\ninterface ComponentContext\n  extends\n    Pick<UseSelectReturn, \"getSeparatorProps\">,\n    Pick<SelectRootProps, \"groupProps\" | \"optionProps\"> {}\n\nexport interface SelectRootProps<Multiple extends boolean = false>\n  extends\n    Omit<HTMLStyledProps, \"defaultValue\" | \"offset\" | \"onChange\" | \"value\">,\n    UseSelectProps<Multiple>,\n    PopupAnimationProps,\n    ThemeProps<SelectStyle>,\n    UseInputBorderProps {\n  /**\n   * If `true`, display the clear icon.\n   *\n   * @default false\n   */\n  clearable?: boolean\n  /**\n   * The icon to be used in the clear button.\n   */\n  clearIcon?: ReactNode\n  /**\n   * The icon to be used in the select.\n   */\n  icon?: ReactNode\n  /**\n   * Props for content element.\n   */\n  contentProps?: SelectContentProps\n  /**\n   * The props for the end element.\n   */\n  elementProps?: InputGroup.ElementProps\n  /**\n   * Props for group element.\n   */\n  groupProps?: Omit<SelectGroupProps, \"children\" | \"label\">\n  /**\n   * Props for icon element.\n   */\n  iconProps?: SelectIconProps\n  /**\n   * Props for option element.\n   */\n  optionProps?: Omit<SelectOptionProps, \"children\" | \"value\">\n  /**\n   * Props for placeholder element.\n   */\n  placeholderProps?: Omit<SelectOptionProps, \"children\" | \"value\">\n  /**\n   * Props for root element.\n   */\n  rootProps?: InputGroup.RootProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: SelectPropsContext,\n  useComponentContext,\n  usePropsContext: useSelectPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<SelectRootProps, SelectStyle, ComponentContext>(\n  \"select\",\n  selectStyle,\n)\n\nexport { SelectPropsContext, useSelectPropsContext }\n\n/**\n * `Select` is a component used for allowing a user to choose one option from a list.\n *\n * @see https://yamada-ui.com/docs/components/select\n */\nexport const SelectRoot = withProvider<\"div\", SelectRootProps>(\n  <Multiple extends boolean = false>(props: SelectRootProps<Multiple>) => {\n    const [\n      groupItemProps,\n      {\n        className,\n        css,\n        colorScheme,\n        animationScheme = \"block-start\",\n        children,\n        clearable,\n        clearIcon = <XIcon />,\n        duration,\n        errorBorderColor,\n        focusBorderColor,\n        icon,\n        items: itemsProp,\n        contentProps,\n        elementProps,\n        groupProps,\n        iconProps,\n        optionProps,\n        placeholderProps,\n        rootProps,\n        ...rest\n      },\n    ] = useGroupItemProps(props)\n    const items = useMemo<ComboboxItem[]>(() => {\n      if (itemsProp) return itemsProp\n\n      return createComboboxItem(children, {\n        Group: SelectGroup,\n        Label: SelectLabel,\n        Option: SelectOption,\n      })\n    }, [itemsProp, children])\n    const {\n      descendants,\n      includePlaceholder,\n      items: computedItems,\n      max,\n      placeholder,\n      value,\n      getClearIconProps,\n      getContentProps,\n      getFieldProps,\n      getIconProps,\n      getInputProps,\n      getRootProps,\n      getSeparatorProps,\n      popoverProps,\n      onActiveDescendant,\n      onChange,\n      onClose,\n      onSelect,\n    } = useSelect({ items, ...rest })\n    const mergedPopoverProps = useMemo<Popover.RootProps>(\n      () => ({\n        animationScheme,\n        duration,\n        ...popoverProps,\n      }),\n      [animationScheme, duration, popoverProps],\n    )\n    const computedChildren = useMemo(() => {\n      if (children)\n        return (\n          <>\n            {placeholder ? (\n              <SelectOption\n                {...placeholderProps}\n                hidden={!includePlaceholder}\n                value=\"\"\n              >\n                {placeholder}\n              </SelectOption>\n            ) : null}\n\n            {children}\n          </>\n        )\n\n      return createComboboxChildren(computedItems, {\n        Group: SelectGroup,\n        Option: SelectOption,\n      })\n    }, [\n      children,\n      computedItems,\n      placeholder,\n      includePlaceholder,\n      placeholderProps,\n    ])\n    const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n    const comboboxContext = useMemo(\n      () => ({ max, value, onActiveDescendant, onChange, onClose, onSelect }),\n      [max, onActiveDescendant, onChange, onClose, onSelect, value],\n    )\n    const selectContext = useMemo(() => ({ max, value }), [max, value])\n    const componentContext = useMemo(\n      () => ({ getSeparatorProps, groupProps, optionProps }),\n      [getSeparatorProps, groupProps, optionProps],\n    )\n    const hasValue = isArray(value) ? !!value.length : !!value\n\n    return (\n      <ComboboxDescendantsContext value={descendants}>\n        <ComboboxContext value={comboboxContext}>\n          <SelectContext value={selectContext}>\n            <ComponentContext value={componentContext}>\n              <Popover.Root {...mergedPopoverProps}>\n                <styled.input {...getInputProps()} />\n\n                <InputGroup.Root\n                  className={className}\n                  css={css}\n                  colorScheme={colorScheme}\n                  {...getRootProps({ ...groupItemProps, ...rootProps })}\n                >\n                  <Popover.Trigger>\n                    <SelectField {...getFieldProps(varProps)} />\n                  </Popover.Trigger>\n\n                  <InputGroup.Element\n                    {...{ clickable: clearable && hasValue, ...elementProps }}\n                  >\n                    {clearable && hasValue ? (\n                      <SelectIcon\n                        icon={clearIcon}\n                        {...getClearIconProps(iconProps)}\n                      />\n                    ) : (\n                      <SelectIcon icon={icon} {...getIconProps(iconProps)} />\n                    )}\n                  </InputGroup.Element>\n                </InputGroup.Root>\n\n                <SelectContent\n                  {...cast<SelectContentProps>(\n                    getContentProps(cast<HTMLProps>(contentProps)),\n                  )}\n                >\n                  {computedChildren}\n                </SelectContent>\n              </Popover.Root>\n            </ComponentContext>\n          </SelectContext>\n        </ComboboxContext>\n      </ComboboxDescendantsContext>\n    )\n  },\n  \"root\",\n)((props) => {\n  const context = useInputPropsContext()\n\n  return { ...context, ...props }\n}) as GenericsComponent<{\n  <Multiple extends boolean = false>(\n    props: SelectRootProps<Multiple>,\n  ): ReactElement\n}>\n\ninterface SelectFieldProps extends HTMLStyledProps {}\n\nconst SelectField = withContext<\"div\", SelectFieldProps>(\"div\", \"field\")(\n  { \"data-group-propagate\": \"\" },\n  ({ children, ...rest }) => ({\n    ...rest,\n    children: <SelectValueText>{children}</SelectValueText>,\n  }),\n)\n\ninterface SelectIconProps extends HTMLStyledProps {\n  icon?: ReactNode\n}\n\nconst SelectIcon = withContext<\"div\", SelectIconProps>(\"div\", \"icon\")(\n  undefined,\n  ({ children, icon, ...rest }) => ({\n    children: icon || children || <ChevronDownIcon />,\n    ...rest,\n  }),\n)\n\ninterface SelectValueTextProps extends HTMLProps<\"span\"> {}\n\nconst SelectValueText = withContext<\"span\", SelectValueTextProps>(\n  \"span\",\n  \"valueText\",\n)()\n\ninterface SelectContentProps extends Popover.ContentProps {}\n\nconst SelectContent = withContext<\"div\", SelectContentProps>(\n  Popover.Content,\n  \"content\",\n)()\n\nexport interface SelectLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const SelectLabel = withContext<\"span\", SelectLabelProps>(\n  \"span\",\n  \"label\",\n)(undefined, (props) => {\n  const { getLabelProps } = useComboboxGroupContext()\n\n  return getLabelProps(props)\n})\n\nexport interface SelectGroupProps\n  extends UseComboboxGroupProps, HTMLStyledProps {\n  /**\n   * The label of the group.\n   */\n  label?: ReactNode\n  /**\n   * Props for the label component.\n   */\n  labelProps?: SelectLabelProps\n}\n\nexport const SelectGroup = withContext<\"div\", SelectGroupProps>(\n  ({ children, label, labelProps, ...rest }) => {\n    const { groupProps } = useComponentContext()\n    const { getGroupProps, getLabelProps } = useComboboxGroup({\n      ...groupProps,\n      ...rest,\n    })\n    const context = useMemo(() => ({ getLabelProps }), [getLabelProps])\n\n    return (\n      <ComboboxGroupContext value={context}>\n        <styled.div {...getGroupProps()}>\n          {label ? <SelectLabel {...labelProps}>{label}</SelectLabel> : null}\n          {children}\n        </styled.div>\n      </ComboboxGroupContext>\n    )\n  },\n  \"group\",\n)()\n\nexport interface SelectOptionProps\n  extends UseSelectOptionProps, HTMLStyledProps {\n  /**\n   * The icon to be used in the select option.\n   */\n  icon?: ReactNode\n}\n\nexport const SelectOption = withContext<\"div\", SelectOptionProps>(\n  ({ children, icon: iconProp, ...rest }) => {\n    const { optionProps: { icon, ...optionProps } = {} } = useComponentContext()\n    const { getIndicatorProps, getOptionProps } = useSelectOption({\n      ...optionProps,\n      ...rest,\n    })\n\n    return (\n      <styled.div {...getOptionProps()}>\n        <SelectIndicator {...getIndicatorProps()}>\n          {iconProp ?? icon ?? <CheckIcon />}\n        </SelectIndicator>\n        {children}\n      </styled.div>\n    )\n  },\n  \"option\",\n)()\n\ninterface SelectIndicatorProps extends HTMLStyledProps {}\n\nconst SelectIndicator = withContext<\"div\", SelectIndicatorProps>(\n  \"div\",\n  \"indicator\",\n)()\n\nexport interface SelectSeparatorProps extends HTMLStyledProps<\"hr\"> {}\n\nexport const SelectSeparator = withContext<\"hr\", SelectSeparatorProps>(\n  \"hr\",\n  \"separator\",\n)(undefined, (props) => {\n  const { getSeparatorProps } = useComponentContext()\n\n  return getSeparatorProps(props)\n})\n"],"mappings":"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"}
+{"version":3,"file":"select.js","names":["Popover.Root","InputGroup.Root","Popover.Trigger","InputGroup.Element","Popover.Content"],"sources":["../../../../src/components/select/select.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type {\n  GenericsComponent,\n  HTMLProps,\n  HTMLStyledProps,\n  ThemeProps,\n} from \"../../core\"\nimport type {\n  ComboboxItem,\n  UseComboboxGroupProps,\n} from \"../../hooks/use-combobox\"\nimport type { Merge } from \"../../utils\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { UsePopoverStyleProps, UsePopupAnimationProps } from \"../popover\"\nimport type { SelectStyle } from \"./select.style\"\nimport type {\n  UseSelectOptionProps,\n  UseSelectProps,\n  UseSelectReturn,\n} from \"./use-select\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport {\n  ComboboxContext,\n  ComboboxDescendantsContext,\n  ComboboxGroupContext,\n  createComboboxChildren,\n  createComboboxItem,\n  useComboboxGroup,\n  useComboboxGroupContext,\n} from \"../../hooks/use-combobox\"\nimport { cast, isArray } from \"../../utils\"\nimport { useGroupItemProps } from \"../group\"\nimport { CheckIcon, ChevronDownIcon, XIcon } from \"../icon\"\nimport { InputGroup, useInputBorder, useInputPropsContext } from \"../input\"\nimport { Popover, usePopoverStyleProps } from \"../popover\"\nimport { selectStyle } from \"./select.style\"\nimport { SelectContext, useSelect, useSelectOption } from \"./use-select\"\n\ninterface ComponentContext\n  extends\n    Pick<UseSelectReturn, \"getSeparatorProps\">,\n    Pick<SelectRootProps, \"groupProps\" | \"optionProps\"> {}\n\nexport interface SelectRootProps<Multiple extends boolean = false>\n  extends\n    Omit<HTMLStyledProps, \"defaultValue\" | \"offset\" | \"onChange\" | \"value\">,\n    Merge<UseSelectProps<Multiple>, UsePopoverStyleProps>,\n    UsePopupAnimationProps,\n    ThemeProps<SelectStyle>,\n    UseInputBorderProps {\n  /**\n   * If `true`, display the clear icon.\n   *\n   * @default false\n   */\n  clearable?: boolean\n  /**\n   * The icon to be used in the clear button.\n   */\n  clearIcon?: ReactNode\n  /**\n   * The icon to be used in the select.\n   */\n  icon?: ReactNode\n  /**\n   * Props for content element.\n   */\n  contentProps?: SelectContentProps\n  /**\n   * The props for the end element.\n   */\n  elementProps?: InputGroup.ElementProps\n  /**\n   * Props for group element.\n   */\n  groupProps?: Omit<SelectGroupProps, \"children\" | \"label\">\n  /**\n   * Props for icon element.\n   */\n  iconProps?: SelectIconProps\n  /**\n   * Props for option element.\n   */\n  optionProps?: Omit<SelectOptionProps, \"children\" | \"value\">\n  /**\n   * Props for placeholder element.\n   */\n  placeholderProps?: Omit<SelectOptionProps, \"children\" | \"value\">\n  /**\n   * Props for root element.\n   */\n  rootProps?: InputGroup.RootProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: SelectPropsContext,\n  useComponentContext,\n  usePropsContext: useSelectPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<SelectRootProps, SelectStyle, ComponentContext>(\n  \"select\",\n  selectStyle,\n)\n\nexport { SelectPropsContext, useSelectPropsContext }\n\n/**\n * `Select` is a component used for allowing a user to choose one option from a list.\n *\n * @see https://yamada-ui.com/docs/components/select\n */\nexport const SelectRoot = withProvider<\"div\", SelectRootProps>(\n  <Multiple extends boolean = false>(props: SelectRootProps<Multiple>) => {\n    const [\n      groupItemProps,\n      {\n        className,\n        css,\n        colorScheme,\n        animationScheme = \"block-start\",\n        children,\n        clearable,\n        clearIcon = <XIcon />,\n        duration,\n        errorBorderColor,\n        focusBorderColor,\n        icon,\n        items: itemsProp,\n        contentProps,\n        elementProps,\n        groupProps,\n        iconProps,\n        optionProps,\n        placeholderProps,\n        rootProps,\n        ...rest\n      },\n    ] = useGroupItemProps(props)\n    const popoverStyleProps = usePopoverStyleProps(rest)\n    const items = useMemo<ComboboxItem[]>(() => {\n      if (itemsProp) return itemsProp\n\n      return createComboboxItem(children, {\n        Group: SelectGroup,\n        Label: SelectLabel,\n        Option: SelectOption,\n      })\n    }, [itemsProp, children])\n    const {\n      descendants,\n      includePlaceholder,\n      items: computedItems,\n      max,\n      placeholder,\n      value,\n      getClearIconProps,\n      getContentProps,\n      getFieldProps,\n      getIconProps,\n      getInputProps,\n      getRootProps,\n      getSeparatorProps,\n      popoverProps,\n      onActiveDescendant,\n      onChange,\n      onClose,\n      onSelect,\n    } = useSelect({ items, ...rest, ...popoverStyleProps })\n    const mergedPopoverProps = useMemo<Popover.RootProps>(\n      () => ({\n        animationScheme,\n        duration,\n        ...popoverProps,\n      }),\n      [animationScheme, duration, popoverProps],\n    )\n    const computedChildren = useMemo(() => {\n      if (children)\n        return (\n          <>\n            {placeholder ? (\n              <SelectOption\n                {...placeholderProps}\n                hidden={!includePlaceholder}\n                value=\"\"\n              >\n                {placeholder}\n              </SelectOption>\n            ) : null}\n\n            {children}\n          </>\n        )\n\n      return createComboboxChildren(computedItems, {\n        Group: SelectGroup,\n        Option: SelectOption,\n      })\n    }, [\n      children,\n      computedItems,\n      placeholder,\n      includePlaceholder,\n      placeholderProps,\n    ])\n    const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n    const comboboxContext = useMemo(\n      () => ({ max, value, onActiveDescendant, onChange, onClose, onSelect }),\n      [max, onActiveDescendant, onChange, onClose, onSelect, value],\n    )\n    const selectContext = useMemo(() => ({ max, value }), [max, value])\n    const componentContext = useMemo(\n      () => ({ getSeparatorProps, groupProps, optionProps }),\n      [getSeparatorProps, groupProps, optionProps],\n    )\n    const hasValue = isArray(value) ? !!value.length : !!value\n\n    return (\n      <ComboboxDescendantsContext value={descendants}>\n        <ComboboxContext value={comboboxContext}>\n          <SelectContext value={selectContext}>\n            <ComponentContext value={componentContext}>\n              <Popover.Root {...mergedPopoverProps}>\n                <styled.input {...getInputProps()} />\n\n                <InputGroup.Root\n                  className={className}\n                  css={css}\n                  colorScheme={colorScheme}\n                  {...getRootProps({ ...groupItemProps, ...rootProps })}\n                >\n                  <Popover.Trigger>\n                    <SelectField {...getFieldProps(varProps)} />\n                  </Popover.Trigger>\n\n                  <InputGroup.Element\n                    {...{ clickable: clearable && hasValue, ...elementProps }}\n                  >\n                    {clearable && hasValue ? (\n                      <SelectIcon\n                        icon={clearIcon}\n                        {...getClearIconProps(iconProps)}\n                      />\n                    ) : (\n                      <SelectIcon icon={icon} {...getIconProps(iconProps)} />\n                    )}\n                  </InputGroup.Element>\n                </InputGroup.Root>\n\n                <SelectContent\n                  {...cast<SelectContentProps>(\n                    getContentProps(cast<HTMLProps>(contentProps)),\n                  )}\n                >\n                  {computedChildren}\n                </SelectContent>\n              </Popover.Root>\n            </ComponentContext>\n          </SelectContext>\n        </ComboboxContext>\n      </ComboboxDescendantsContext>\n    )\n  },\n  \"root\",\n)((props) => {\n  const context = useInputPropsContext()\n\n  return { ...context, ...props }\n}) as GenericsComponent<{\n  <Multiple extends boolean = false>(\n    props: SelectRootProps<Multiple>,\n  ): ReactElement\n}>\n\ninterface SelectFieldProps extends HTMLStyledProps {}\n\nconst SelectField = withContext<\"div\", SelectFieldProps>(\"div\", \"field\")(\n  { \"data-group-propagate\": \"\" },\n  ({ children, ...rest }) => ({\n    ...rest,\n    children: <SelectValueText>{children}</SelectValueText>,\n  }),\n)\n\ninterface SelectIconProps extends HTMLStyledProps {\n  icon?: ReactNode\n}\n\nconst SelectIcon = withContext<\"div\", SelectIconProps>(\"div\", \"icon\")(\n  undefined,\n  ({ children, icon, ...rest }) => ({\n    children: icon || children || <ChevronDownIcon />,\n    ...rest,\n  }),\n)\n\ninterface SelectValueTextProps extends HTMLProps<\"span\"> {}\n\nconst SelectValueText = withContext<\"span\", SelectValueTextProps>(\n  \"span\",\n  \"valueText\",\n)()\n\ninterface SelectContentProps extends Popover.ContentProps {}\n\nconst SelectContent = withContext<\"div\", SelectContentProps>(\n  Popover.Content,\n  \"content\",\n)()\n\nexport interface SelectLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const SelectLabel = withContext<\"span\", SelectLabelProps>(\n  \"span\",\n  \"label\",\n)(undefined, (props) => {\n  const { getLabelProps } = useComboboxGroupContext()\n\n  return getLabelProps(props)\n})\n\nexport interface SelectGroupProps\n  extends UseComboboxGroupProps, HTMLStyledProps {\n  /**\n   * The label of the group.\n   */\n  label?: ReactNode\n  /**\n   * Props for the label component.\n   */\n  labelProps?: SelectLabelProps\n}\n\nexport const SelectGroup = withContext<\"div\", SelectGroupProps>(\n  ({ children, label, labelProps, ...rest }) => {\n    const { groupProps } = useComponentContext()\n    const { getGroupProps, getLabelProps } = useComboboxGroup({\n      ...groupProps,\n      ...rest,\n    })\n    const context = useMemo(() => ({ getLabelProps }), [getLabelProps])\n\n    return (\n      <ComboboxGroupContext value={context}>\n        <styled.div {...getGroupProps()}>\n          {label ? <SelectLabel {...labelProps}>{label}</SelectLabel> : null}\n          {children}\n        </styled.div>\n      </ComboboxGroupContext>\n    )\n  },\n  \"group\",\n)()\n\nexport interface SelectOptionProps\n  extends UseSelectOptionProps, HTMLStyledProps {\n  /**\n   * The icon to be used in the select option.\n   */\n  icon?: ReactNode\n}\n\nexport const SelectOption = withContext<\"div\", SelectOptionProps>(\n  ({ children, icon: iconProp, ...rest }) => {\n    const { optionProps: { icon, ...optionProps } = {} } = useComponentContext()\n    const { getIndicatorProps, getOptionProps } = useSelectOption({\n      ...optionProps,\n      ...rest,\n    })\n\n    return (\n      <styled.div {...getOptionProps()}>\n        <SelectIndicator {...getIndicatorProps()}>\n          {iconProp ?? icon ?? <CheckIcon />}\n        </SelectIndicator>\n        {children}\n      </styled.div>\n    )\n  },\n  \"option\",\n)()\n\ninterface SelectIndicatorProps extends HTMLStyledProps {}\n\nconst SelectIndicator = withContext<\"div\", SelectIndicatorProps>(\n  \"div\",\n  \"indicator\",\n)()\n\nexport interface SelectSeparatorProps extends HTMLStyledProps<\"hr\"> {}\n\nexport const SelectSeparator = withContext<\"hr\", SelectSeparatorProps>(\n  \"hr\",\n  \"separator\",\n)(undefined, (props) => {\n  const { getSeparatorProps } = useComponentContext()\n\n  return getSeparatorProps(props)\n})\n"],"mappings":"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"}

package/dist/esm/components/sidebar/index.js

@@ -0,0 +1,6 @@
+import { sidebarStyle } from "./sidebar.style.js";
+import { SidebarContext, SidebarDescendantsContext, SidebarItemContext, useSidebar, useSidebarContext, useSidebarDescendant, useSidebarDescendants, useSidebarGroup, useSidebarItem, useSidebarItemContext } from "./use-sidebar.js";
+import { SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHandle, SidebarHeader, SidebarItem, SidebarItemContent, SidebarItemEndElement, SidebarItemIndicator, SidebarItemLabel, SidebarItemLink, SidebarItemStartElement, SidebarItemTrigger, SidebarMainPanel, SidebarMenu, SidebarMenuButton, SidebarPropsContext, SidebarRoot, SidebarSidePanel, SidebarTrigger, useSidebarPropsContext } from "./sidebar.js";
+import { namespace_exports } from "./namespace.js";
+
+export { namespace_exports as Sidebar, SidebarContent, SidebarContext, SidebarDescendantsContext, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHandle, SidebarHeader, SidebarItem, SidebarItemContent, SidebarItemContext, SidebarItemEndElement, SidebarItemIndicator, SidebarItemLabel, SidebarItemLink, SidebarItemStartElement, SidebarItemTrigger, SidebarMainPanel, SidebarMenu, SidebarMenuButton, SidebarPropsContext, SidebarRoot, SidebarSidePanel, SidebarTrigger, sidebarStyle, useSidebar, useSidebarContext, useSidebarDescendant, useSidebarDescendants, useSidebarGroup, useSidebarItem, useSidebarItemContext, useSidebarPropsContext };

package/dist/esm/components/sidebar/namespace.js

@@ -0,0 +1,41 @@
+import { __exportAll } from "../../_virtual/rolldown_runtime.js";
+import { SidebarContext, SidebarDescendantsContext, SidebarItemContext, useSidebarContext, useSidebarDescendant, useSidebarDescendants, useSidebarItemContext } from "./use-sidebar.js";
+import { SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHandle, SidebarHeader, SidebarItem, SidebarItemContent, SidebarItemEndElement, SidebarItemIndicator, SidebarItemLabel, SidebarItemLink, SidebarItemStartElement, SidebarItemTrigger, SidebarMainPanel, SidebarMenu, SidebarMenuButton, SidebarPropsContext, SidebarRoot, SidebarSidePanel, SidebarTrigger, useSidebarPropsContext } from "./sidebar.js";
+
+//#region src/components/sidebar/namespace.ts
+var namespace_exports = /* @__PURE__ */ __exportAll({
+	Content: () => SidebarContent,
+	Context: () => SidebarContext,
+	DescendantsContext: () => SidebarDescendantsContext,
+	Footer: () => SidebarFooter,
+	Group: () => SidebarGroup,
+	GroupContent: () => SidebarGroupContent,
+	GroupLabel: () => SidebarGroupLabel,
+	Handle: () => SidebarHandle,
+	Header: () => SidebarHeader,
+	Item: () => SidebarItem,
+	ItemContent: () => SidebarItemContent,
+	ItemContext: () => SidebarItemContext,
+	ItemEndElement: () => SidebarItemEndElement,
+	ItemIndicator: () => SidebarItemIndicator,
+	ItemLabel: () => SidebarItemLabel,
+	ItemLink: () => SidebarItemLink,
+	ItemStartElement: () => SidebarItemStartElement,
+	ItemTrigger: () => SidebarItemTrigger,
+	MainPanel: () => SidebarMainPanel,
+	Menu: () => SidebarMenu,
+	MenuButton: () => SidebarMenuButton,
+	PropsContext: () => SidebarPropsContext,
+	Root: () => SidebarRoot,
+	SidePanel: () => SidebarSidePanel,
+	Trigger: () => SidebarTrigger,
+	useContext: () => useSidebarContext,
+	useDescendant: () => useSidebarDescendant,
+	useDescendants: () => useSidebarDescendants,
+	useItemContext: () => useSidebarItemContext,
+	usePropsContext: () => useSidebarPropsContext
+});
+
+//#endregion
+export { namespace_exports };
+//# sourceMappingURL=namespace.js.map

package/dist/esm/components/sidebar/namespace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"namespace.js","names":[],"sources":["../../../../src/components/sidebar/namespace.ts"],"sourcesContent":["export type {\n  SidebarContentProps as ContentProps,\n  SidebarFooterProps as FooterProps,\n  SidebarGroupContentProps as GroupContentProps,\n  SidebarGroupLabelProps as GroupLabelProps,\n  SidebarGroupProps as GroupProps,\n  SidebarHandleProps as HandleProps,\n  SidebarHeaderProps as HeaderProps,\n  SidebarItemContentProps as ItemContentProps,\n  SidebarItemEndElementProps as ItemEndElementProps,\n  SidebarItemIndicatorProps as ItemIndicatorProps,\n  SidebarItemLabelProps as ItemLabelProps,\n  SidebarItemLinkProps as ItemLinkProps,\n  SidebarItemProps as ItemProps,\n  SidebarItemStartElementProps as ItemStartElementProps,\n  SidebarItemTriggerProps as ItemTriggerProps,\n  SidebarItem as ItemType,\n  SidebarMainPanelProps as MainPanelProps,\n  SidebarMenuButtonProps as MenuButtonProps,\n  SidebarMenuProps as MenuProps,\n  SidebarRootProps as RootProps,\n  SidebarSidePanelProps as SidePanelProps,\n  SidebarTriggerProps as TriggerProps,\n} from \"./sidebar\"\nexport {\n  SidebarContent as Content,\n  SidebarFooter as Footer,\n  SidebarGroup as Group,\n  SidebarGroupContent as GroupContent,\n  SidebarGroupLabel as GroupLabel,\n  SidebarHandle as Handle,\n  SidebarHeader as Header,\n  SidebarItem as Item,\n  SidebarItemContent as ItemContent,\n  SidebarItemEndElement as ItemEndElement,\n  SidebarItemIndicator as ItemIndicator,\n  SidebarItemLabel as ItemLabel,\n  SidebarItemLink as ItemLink,\n  SidebarItemStartElement as ItemStartElement,\n  SidebarItemTrigger as ItemTrigger,\n  SidebarMainPanel as MainPanel,\n  SidebarMenu as Menu,\n  SidebarMenuButton as MenuButton,\n  SidebarPropsContext as PropsContext,\n  SidebarRoot as Root,\n  SidebarSidePanel as SidePanel,\n  SidebarTrigger as Trigger,\n  useSidebarPropsContext as usePropsContext,\n} from \"./sidebar\"\nexport type { SidebarControl as Control } from \"./use-sidebar\"\nexport {\n  SidebarContext as Context,\n  SidebarDescendantsContext as DescendantsContext,\n  SidebarItemContext as ItemContext,\n  useSidebarContext as useContext,\n  useSidebarDescendant as useDescendant,\n  useSidebarDescendants as useDescendants,\n  useSidebarItemContext as useItemContext,\n} from \"./use-sidebar\"\n"],"mappings":""}