@keboola/design 15.0.0 → 16.0.0

package/dist/{Select-B22hB_-w.js → Select-DRdkdzBp.js}

@@ -1,13 +1,13 @@
-import { cn } from "./classNames-DcGnTh2N.js";
-import { Check, ChevronDown, ChevronUp } from "./icons-ZIeZXXS7.js";
-import { Button } from "./Button-BNkyYU8u.js";
-import { overlayTriggerVariants } from "./styles-T8xwr0sR.js";
+import { cn } from "./classNames-DkX30VJU.js";
+import { Check, ChevronDown, ChevronUp } from "./icons-DDR9dFSr.js";
+import { Button } from "./Button-DbvGzEDb.js";
+import { overlayTriggerVariants } from "./styles-BXXXosW_.js";
 import { forwardAccessibleName } from "./internal/utils/accessibleName.js";
 import { useId } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as SelectPrimitive from "@radix-ui/react-select";
 import { Root } from "@radix-ui/react-select";
-//#region src/components/Select/SelectContent.tsx
+// src/components/Select/SelectContent.tsx
 const scrollButtonStyles = cn("tw:flex", "tw:items-center", "tw:justify-center", "tw:rounded-sm", "tw:p-1", "tw:[&_svg:not([class*=\"tw:size-\"])]:size-5");
 /**
 * Listbox container for `Select`. Portals items into a popover sized to the trigger.
@@ -22,7 +22,7 @@ const SelectContent = ({ ref, className, children, container, position = "popper
 			ref,
 			position,
 			sideOffset,
-			className: cn("tailwindcss-preflight", "tw:z-[1055]", "tw:flex tw:flex-col", "tw:p-1", "tw:overflow-hidden", "tw:origin-(--radix-select-content-transform-origin)", "tw:max-h-[var(--radix-select-content-available-height)]", "tw:min-w-[var(--radix-select-trigger-width)]", "tw:bg-popover", "tw:text-popover-foreground", "tw:shadow-md", "tw:ring-1", "tw:ring-foreground/10", "tw:rounded-lg", "tw:data-[state=open]:animate-in", "tw:data-[state=open]:fade-in-0", "tw:data-[state=open]:zoom-in-95", "tw:data-[state=closed]:animate-out", "tw:data-[state=closed]:fade-out-0", "tw:data-[state=closed]:zoom-out-95", "tw:data-[side=bottom]:slide-in-from-top-2", "tw:data-[side=left]:slide-in-from-right-2", "tw:data-[side=right]:slide-in-from-left-2", "tw:data-[side=top]:slide-in-from-bottom-2", className),
+			className: cn("tailwindcss-preflight", "tw:z-overlay", "tw:flex tw:flex-col", "tw:p-1", "tw:overflow-hidden", "tw:origin-(--radix-select-content-transform-origin)", "tw:max-h-[var(--radix-select-content-available-height)]", "tw:min-w-[var(--radix-select-trigger-width)]", "tw:bg-popover", "tw:text-popover-foreground", "tw:shadow-md", "tw:ring-1", "tw:ring-foreground/10", "tw:rounded-lg", "tw:data-[state=open]:animate-in", "tw:data-[state=open]:fade-in-0", "tw:data-[state=open]:zoom-in-95", "tw:data-[state=closed]:animate-out", "tw:data-[state=closed]:fade-out-0", "tw:data-[state=closed]:zoom-out-95", "tw:data-[side=bottom]:slide-in-from-top-2", "tw:data-[side=left]:slide-in-from-right-2", "tw:data-[side=right]:slide-in-from-left-2", "tw:data-[side=top]:slide-in-from-bottom-2", className),
 			children: [
 				/* @__PURE__ */ jsx(SelectPrimitive.ScrollUpButton, {
 					className: scrollButtonStyles,
@@ -40,14 +40,12 @@ const SelectContent = ({ ref, className, children, container, position = "popper
 		})
 	});
 };
-//#endregion
-//#region src/components/Select/SelectGroup.tsx
+// src/components/Select/SelectGroup.tsx
 const SelectGroup = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectPrimitive.Group, {
 	...props,
 	className: cn("tw:flex tw:flex-col tw:gap-0.5", className)
 });
-//#endregion
-//#region src/components/Select/SelectItem.tsx
+// src/components/Select/SelectItem.tsx
 const SelectItem = ({ ref, className, children, icon, hint, "aria-describedby": ariaDescribedBy, ...props }) => {
 	const hintId = useId();
 	return /* @__PURE__ */ jsxs(SelectPrimitive.Item, {
@@ -73,23 +71,19 @@ const SelectItem = ({ ref, className, children, icon, hint, "aria-describedby":
 		]
 	});
 };
-//#endregion
-//#region src/components/Select/SelectLabel.tsx
+// src/components/Select/SelectLabel.tsx
 const SelectLabel = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectPrimitive.Label, {
 	...props,
 	className: cn("tw:px-2", "tw:py-1.5", "tw:text-xs", "tw:font-medium", "tw:leading-none", "tw:text-muted-foreground", className)
 });
-//#endregion
-//#region src/components/Select/SelectRoot.tsx
+// src/components/Select/SelectRoot.tsx
 const SelectRoot = (props) => /* @__PURE__ */ jsx(Root, { ...props });
-//#endregion
-//#region src/components/Select/SelectSeparator.tsx
+// src/components/Select/SelectSeparator.tsx
 const SelectSeparator = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectPrimitive.Separator, {
 	...props,
 	className: cn("tw:mx-2 tw:my-1 tw:h-px tw:bg-border", className)
 });
-//#endregion
-//#region src/components/Select/SelectTrigger.tsx
+// src/components/Select/SelectTrigger.tsx
 const SelectTrigger = ({ ref, className, inline, state, placeholder, ...props }) => {
 	if (inline) return /* @__PURE__ */ jsx(SelectPrimitive.Trigger, {
 		...props,
@@ -114,29 +108,39 @@ const SelectTrigger = ({ ref, className, inline, state, placeholder, ...props })
 		})]
 	});
 };
-//#endregion
-//#region src/components/Select/Select.tsx
+// src/components/Select/Select.tsx
 const isGroup = (itemOrGroup) => "items" in itemOrGroup;
 /**
+* Radix's value for an item whose `value` is `''`.
+*
+* - Radix reads `''` as "no value" and shows the placeholder, even when an item holds it.
+* - Swapped in only when such an item exists; otherwise `''` still shows the placeholder.
+* - With `name` in a natively submitted form, the hidden `<select>` sends it and passes `required`.
+*/
+const EMPTY_ITEM_VALUE = "__select-empty-item__";
+/**
 * Single selection from a short enumerated list. Built on Radix Select.
 *
 * - Use for ~10 or fewer options where search adds nothing; else `Combobox` / `MultiCombobox`.
 * - In forms: `FormGroup`, or `useAppForm` + `field.SelectField` for validation.
 * - Compound parts (`Select.Root`, `.Trigger`, `.Content`, `.Item`) for custom item layouts.
+* - An item may hold `''` (an "All" filter): selected, it shows its label, not the placeholder.
 */
 const Select = ({ value, defaultValue, onValueChange, disabled, name, required, open, defaultOpen, onOpenChange, dir, autoComplete, form, inline, state, placeholder, className, onBlur, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, items = [], ...accessibleName }) => {
 	const groupKeyId = useId();
+	const hasEmptyItem = items.some((itemOrGroup) => isGroup(itemOrGroup) ? itemOrGroup.items.some((item) => item.value === "") : itemOrGroup.value === "");
+	const toRootValue = (rawValue) => hasEmptyItem && rawValue === "" ? EMPTY_ITEM_VALUE : rawValue;
 	const renderItem = (item) => /* @__PURE__ */ jsx(SelectItem, {
-		value: item.value,
+		value: toRootValue(item.value),
 		icon: item.icon,
 		hint: item.hint,
 		disabled: item.disabled,
 		children: item.label
 	}, item.value);
 	return /* @__PURE__ */ jsxs(SelectRoot, {
-		value,
-		defaultValue,
-		onValueChange,
+		value: toRootValue(value),
+		defaultValue: toRootValue(defaultValue),
+		onValueChange: onValueChange && ((rootValue) => onValueChange(rootValue === EMPTY_ITEM_VALUE ? "" : rootValue)),
 		disabled,
 		name,
 		required,
@@ -169,7 +173,6 @@ Select.Item = SelectItem;
 Select.Group = SelectGroup;
 Select.Label = SelectLabel;
 Select.Separator = SelectSeparator;
-//#endregion
 export { Select };
 
-//# sourceMappingURL=Select-B22hB_-w.js.map
+//# sourceMappingURL=Select-DRdkdzBp.js.map

package/dist/Select-DRdkdzBp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select-DRdkdzBp.js","names":["SelectItemComponent"],"sources":["../src/components/Select/SelectContent.tsx","../src/components/Select/SelectGroup.tsx","../src/components/Select/SelectItem.tsx","../src/components/Select/SelectLabel.tsx","../src/components/Select/SelectRoot.tsx","../src/components/Select/SelectSeparator.tsx","../src/components/Select/SelectTrigger.tsx","../src/components/Select/Select.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { ChevronDown, ChevronUp } from '../../icons';\nimport { cn } from '../../utils';\n\nconst scrollButtonStyles = cn(\n  'tw:flex',\n  'tw:items-center',\n  'tw:justify-center',\n  'tw:rounded-sm',\n  'tw:p-1',\n  'tw:[&_svg:not([class*=\"tw:size-\"])]:size-5',\n);\n\n/**\n * Props for `Select.Content`. `container` portals the listbox into a custom element (useful inside modals).\n */\ntype Props = ComponentProps<typeof SelectPrimitive.Content> & {\n  container?: HTMLElement | null;\n};\n\n/**\n * Listbox container for `Select`. Portals items into a popover sized to the trigger.\n * Normally rendered implicitly by `Select`; use directly only when composing custom item layouts via\n * the `Select.Root` / `Select.Trigger` / `Select.Content` compound parts.\n */\nexport const SelectContent = ({\n  ref,\n  className,\n  children,\n  container,\n  position = 'popper',\n  sideOffset = 4,\n  ...props\n}: Props) => {\n  return (\n    <SelectPrimitive.Portal container={container}>\n      <SelectPrimitive.Content\n        {...props}\n        ref={ref}\n        position={position}\n        sideOffset={sideOffset}\n        className={cn(\n          'tailwindcss-preflight',\n          'tw:z-overlay',\n\n          // layout\n          'tw:flex tw:flex-col',\n          'tw:p-1',\n          'tw:overflow-hidden',\n          'tw:origin-(--radix-select-content-transform-origin)',\n\n          // sizing\n          'tw:max-h-[var(--radix-select-content-available-height)]',\n          'tw:min-w-[var(--radix-select-trigger-width)]',\n\n          // appearance\n          'tw:bg-popover',\n          'tw:text-popover-foreground',\n          'tw:shadow-md',\n          'tw:ring-1',\n          'tw:ring-foreground/10',\n          'tw:rounded-lg',\n\n          // open animation\n          'tw:data-[state=open]:animate-in',\n          'tw:data-[state=open]:fade-in-0',\n          'tw:data-[state=open]:zoom-in-95',\n\n          // closed animation\n          'tw:data-[state=closed]:animate-out',\n          'tw:data-[state=closed]:fade-out-0',\n          'tw:data-[state=closed]:zoom-out-95',\n\n          // position animations\n          'tw:data-[side=bottom]:slide-in-from-top-2',\n          'tw:data-[side=left]:slide-in-from-right-2',\n          'tw:data-[side=right]:slide-in-from-left-2',\n          'tw:data-[side=top]:slide-in-from-bottom-2',\n          className,\n        )}\n      >\n        <SelectPrimitive.ScrollUpButton className={scrollButtonStyles}>\n          <ChevronUp />\n        </SelectPrimitive.ScrollUpButton>\n\n        <SelectPrimitive.Viewport\n          className={cn({\n            'tw:h-[var(--radix-select-trigger-height)] tw:w-full tw:min-w-[var(--radix-select-trigger-width)]':\n              position === 'popper',\n          })}\n        >\n          {children}\n        </SelectPrimitive.Viewport>\n\n        <SelectPrimitive.ScrollDownButton className={scrollButtonStyles}>\n          <ChevronDown />\n        </SelectPrimitive.ScrollDownButton>\n      </SelectPrimitive.Content>\n    </SelectPrimitive.Portal>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Group>;\n\nexport const SelectGroup = ({ className, ...props }: Props) => (\n  <SelectPrimitive.Group {...props} className={cn('tw:flex tw:flex-col tw:gap-0.5', className)} />\n);\n","import { useId } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { Check } from '../../icons';\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Item> & {\n  icon?: ReactNode;\n  hint?: ReactNode;\n};\n\nexport const SelectItem = ({\n  ref,\n  className,\n  children,\n  icon,\n  hint,\n  'aria-describedby': ariaDescribedBy,\n  ...props\n}: Props) => {\n  const hintId = useId();\n\n  return (\n    <SelectPrimitive.Item\n      {...props}\n      ref={ref}\n      // Radix names the option from `ItemText` alone (`aria-labelledby`), so the hint is\n      // described rather than named — it reaches a screen reader without joining the label.\n      aria-describedby={\n        [ariaDescribedBy, hint ? hintId : null].filter(Boolean).join(' ') || undefined\n      }\n      className={cn(\n        'tw:group/select-item',\n\n        // layout\n        'tw:relative',\n        'tw:flex',\n        'tw:flex-1',\n        'tw:items-center',\n        'tw:gap-2',\n\n        // spacing\n        'tw:py-2',\n        'tw:px-2',\n        'tw:rounded-lg',\n\n        // typography\n        'tw:text-sm',\n        'tw:select-none',\n        'tw:cursor-default',\n        'tw:outline-hidden',\n\n        // highlighted (keyboard / hover)\n        'tw:focus:outline-hidden',\n        'tw:data-[highlighted]:bg-hover',\n        'tw:data-[highlighted]:text-hover-foreground',\n\n        // disabled\n        'tw:data-[disabled]:pointer-events-none',\n        'tw:data-[disabled]:opacity-disabled',\n\n        // child svg defaults\n        'tw:[&_svg]:pointer-events-none',\n        'tw:[&_svg]:shrink-0',\n        'tw:[&_svg]:text-muted-foreground',\n        \"tw:[&_svg:not([class*='tw:size-'])]:size-4\",\n        className,\n      )}\n    >\n      {icon}\n      <span className=\"tw:flex-1 tw:truncate\">\n        <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n      </span>\n      {/* Outside `ItemText`, so the trigger shows the label alone once the option is picked. */}\n      {hint && (\n        <span id={hintId} className=\"tw:shrink-0 tw:text-xs tw:text-muted-foreground\">\n          {hint}\n        </span>\n      )}\n      <SelectPrimitive.ItemIndicator className=\"tw:pointer-events-none\">\n        <Check className=\"tw:size-4\" />\n      </SelectPrimitive.ItemIndicator>\n    </SelectPrimitive.Item>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Label>;\n\nexport const SelectLabel = ({ className, ...props }: Props) => (\n  <SelectPrimitive.Label\n    {...props}\n    className={cn(\n      // Soft grey section label.\n      'tw:px-2',\n      'tw:py-1.5',\n      'tw:text-xs',\n      'tw:font-medium',\n      'tw:leading-none',\n      'tw:text-muted-foreground',\n\n      className,\n    )}\n  />\n);\n","import type { ReactNode } from 'react';\nimport { Root } from '@radix-ui/react-select';\n\n// Mirror Radix's `SelectProps` as an explicit list. We can't infer via\n// `ComponentProps<typeof Root>` or reuse Radix's `SelectProps` directly: both\n// transitively reference the un-exported `SelectSharedProps` interface, and\n// TS4023 fires when DTS emits anything that consumes it (e.g. `useAppForm`).\n// Keep this in sync with `@radix-ui/react-select`'s `SelectProps` shape.\nexport type SelectRootProps = {\n  // SelectSharedProps\n  children?: ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?(open: boolean): void;\n  dir?: 'ltr' | 'rtl';\n  name?: string;\n  autoComplete?: string;\n  disabled?: boolean;\n  required?: boolean;\n  form?: string;\n  // SelectProps\n  value?: string;\n  defaultValue?: string;\n  onValueChange?(value: string): void;\n};\n\nexport const SelectRoot = (props: SelectRootProps) => <Root {...props} />;\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Separator>;\n\nexport const SelectSeparator = ({ className, ...props }: Props) => (\n  <SelectPrimitive.Separator\n    {...props}\n    className={cn('tw:mx-2 tw:my-1 tw:h-px tw:bg-border', className)}\n  />\n);\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport { type VariantProps } from 'class-variance-authority';\n\nimport { ChevronDown } from '../../icons';\nimport { cn } from '../../utils';\nimport type { WithAccessibleName } from '../../utils/accessibleName';\nimport { Button } from '../Button';\nimport { overlayTriggerVariants } from '../OverlayTrigger/styles';\n\ntype BaseProps = ComponentProps<typeof SelectPrimitive.Trigger> &\n  VariantProps<typeof overlayTriggerVariants> & {\n    /** Text-like trigger with no field chrome, for a select inside a sentence or toolbar; ignores `state`. */\n    inline?: boolean;\n  } & Pick<ComponentProps<typeof SelectPrimitive.Value>, 'placeholder'>;\n\n/** `role=\"combobox\"` is not named from content: neither the item label nor `placeholder` names it. */\ntype SelectTriggerProps = WithAccessibleName<BaseProps>;\n\nexport const SelectTrigger = ({\n  ref,\n  className,\n  inline,\n  state,\n  placeholder,\n  ...props\n}: SelectTriggerProps) => {\n  if (inline)\n    return (\n      <SelectPrimitive.Trigger {...props} ref={ref} className={cn(className)} asChild>\n        <Button variant=\"inline\">\n          <SelectPrimitive.Value placeholder={placeholder} />\n          <SelectPrimitive.Icon asChild>\n            <ChevronDown />\n          </SelectPrimitive.Icon>\n        </Button>\n      </SelectPrimitive.Trigger>\n    );\n\n  return (\n    <SelectPrimitive.Trigger\n      {...props}\n      ref={ref}\n      className={cn(overlayTriggerVariants({ state }), className)}\n    >\n      <SelectPrimitive.Value placeholder={placeholder} />\n      <SelectPrimitive.Icon asChild>\n        <ChevronDown className=\"tw:size-4 tw:text-muted-foreground\" />\n      </SelectPrimitive.Icon>\n    </SelectPrimitive.Trigger>\n  );\n};\n","import { useId } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\n\nimport { forwardAccessibleName, type WithAccessibleName } from '../../utils/accessibleName';\n\nimport { SelectContent } from './SelectContent';\nimport { SelectGroup } from './SelectGroup';\nimport { SelectItem as SelectItemComponent } from './SelectItem';\nimport { SelectLabel } from './SelectLabel';\nimport { SelectRoot, type SelectRootProps } from './SelectRoot';\nimport { SelectSeparator } from './SelectSeparator';\nimport { SelectTrigger } from './SelectTrigger';\n\nexport type SelectItem = {\n  value: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  /** Trailing muted note shown in the listbox only — never in the trigger. */\n  hint?: ReactNode;\n  disabled?: boolean;\n};\n\nexport type SelectItemGroup = {\n  label?: ReactNode;\n  items: readonly SelectItem[];\n};\n\nconst isGroup = (itemOrGroup: SelectItem | SelectItemGroup): itemOrGroup is SelectItemGroup =>\n  'items' in itemOrGroup;\n\n/**\n * Radix's value for an item whose `value` is `''`.\n *\n * - Radix reads `''` as \"no value\" and shows the placeholder, even when an item holds it.\n * - Swapped in only when such an item exists; otherwise `''` still shows the placeholder.\n * - With `name` in a natively submitted form, the hidden `<select>` sends it and passes `required`.\n */\nconst EMPTY_ITEM_VALUE = '__select-empty-item__';\n\ntype TriggerProps = ComponentProps<typeof SelectTrigger>;\n\ntype BaseProps = Pick<\n  SelectRootProps,\n  | 'value'\n  | 'defaultValue'\n  | 'onValueChange'\n  | 'disabled'\n  | 'name'\n  | 'required'\n  | 'open'\n  | 'defaultOpen'\n  | 'onOpenChange'\n  | 'dir'\n  | 'autoComplete'\n  | 'form'\n> &\n  Pick<\n    TriggerProps,\n    | 'inline'\n    | 'state'\n    | 'placeholder'\n    | 'id'\n    | 'className'\n    | 'onBlur'\n    | 'aria-label'\n    | 'aria-labelledby'\n    | 'aria-describedby'\n    | 'aria-invalid'\n    | 'aria-required'\n  > & {\n    items?: readonly (SelectItem | SelectItemGroup)[];\n  };\n\n/** `role=\"combobox\"` is not named from content: neither the item label nor `placeholder` names it. */\nexport type SelectProps = WithAccessibleName<BaseProps>;\n\n/**\n * Single selection from a short enumerated list. Built on Radix Select.\n *\n * - Use for ~10 or fewer options where search adds nothing; else `Combobox` / `MultiCombobox`.\n * - In forms: `FormGroup`, or `useAppForm` + `field.SelectField` for validation.\n * - Compound parts (`Select.Root`, `.Trigger`, `.Content`, `.Item`) for custom item layouts.\n * - An item may hold `''` (an \"All\" filter): selected, it shows its label, not the placeholder.\n */\nexport const Select = ({\n  value,\n  defaultValue,\n  onValueChange,\n  disabled,\n  name,\n  required,\n  open,\n  defaultOpen,\n  onOpenChange,\n  dir,\n  autoComplete,\n  form,\n  inline,\n  state,\n  placeholder,\n  className,\n  onBlur,\n  'aria-describedby': ariaDescribedBy,\n  'aria-invalid': ariaInvalid,\n  'aria-required': ariaRequired,\n  items = [],\n  // Kept grouped: destructured apart, the required-one-of union becomes three optional props.\n  ...accessibleName\n}: SelectProps) => {\n  const groupKeyId = useId();\n  const hasEmptyItem = items.some((itemOrGroup) =>\n    isGroup(itemOrGroup)\n      ? itemOrGroup.items.some((item) => item.value === '')\n      : itemOrGroup.value === '',\n  );\n  const toRootValue = <T extends string | undefined>(rawValue: T) =>\n    hasEmptyItem && rawValue === '' ? EMPTY_ITEM_VALUE : rawValue;\n\n  const renderItem = (item: SelectItem) => (\n    <SelectItemComponent\n      key={item.value}\n      value={toRootValue(item.value)}\n      icon={item.icon}\n      hint={item.hint}\n      disabled={item.disabled}\n    >\n      {item.label}\n    </SelectItemComponent>\n  );\n\n  return (\n    <SelectRoot\n      value={toRootValue(value)}\n      defaultValue={toRootValue(defaultValue)}\n      onValueChange={\n        onValueChange &&\n        ((rootValue) => onValueChange(rootValue === EMPTY_ITEM_VALUE ? '' : rootValue))\n      }\n      disabled={disabled}\n      name={name}\n      required={required}\n      open={open}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      dir={dir}\n      autoComplete={autoComplete}\n      form={form}\n    >\n      <SelectTrigger\n        {...forwardAccessibleName(accessibleName)}\n        inline={inline}\n        state={state}\n        placeholder={placeholder}\n        className={className}\n        onBlur={onBlur}\n        aria-describedby={ariaDescribedBy}\n        aria-invalid={ariaInvalid}\n        aria-required={ariaRequired}\n      />\n      <SelectContent>\n        {items.map((itemOrGroup, index) => {\n          if (isGroup(itemOrGroup)) {\n            return (\n              <SelectGroup key={`${groupKeyId}-group-${index}`}>\n                {itemOrGroup.label && <SelectLabel>{itemOrGroup.label}</SelectLabel>}\n                {itemOrGroup.items.map(renderItem)}\n              </SelectGroup>\n            );\n          }\n\n          return renderItem(itemOrGroup);\n        })}\n      </SelectContent>\n    </SelectRoot>\n  );\n};\n\nSelect.Root = SelectRoot;\nSelect.Trigger = SelectTrigger;\nSelect.Content = SelectContent;\nSelect.Item = SelectItemComponent;\nSelect.Group = SelectGroup;\nSelect.Label = SelectLabel;\nSelect.Separator = SelectSeparator;\n"],"mappings":"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"}

package/dist/{Sheet-0TWKTqid.js → Sheet-DVb4XoJ5.js}

@@ -1,27 +1,25 @@
-import { cn } from "./classNames-DcGnTh2N.js";
-import { X } from "./icons-ZIeZXXS7.js";
-import { Button } from "./Button-BNkyYU8u.js";
-import { ModalDescription, ModalOverlay, ModalTitle } from "./ModalTitle-cy0Ht9VY.js";
+import { cn } from "./classNames-DkX30VJU.js";
+import { X } from "./icons-DDR9dFSr.js";
+import { Button } from "./Button-DbvGzEDb.js";
+import { ModalDescription, ModalOverlay, ModalTitle } from "./ModalTitle-7vgpfc6B.js";
 import { cva } from "class-variance-authority";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Close, Content, Portal, Root, Title, Trigger } from "@radix-ui/react-dialog";
-//#region src/components/Sheet/SheetBody.tsx
+// src/components/Sheet/SheetBody.tsx
 const SheetBody = ({ className, ...rest }) => /* @__PURE__ */ jsx("div", {
 	...rest,
 	className: cn("tw:flex", "tw:flex-col", "tw:overflow-x-hidden", "tw:px-4", className)
 });
-//#endregion
-//#region src/components/Sheet/SheetOverlay.tsx
+// src/components/Sheet/SheetOverlay.tsx
 const SheetOverlay = ({ ref, ...props }) => /* @__PURE__ */ jsx(ModalOverlay, {
 	ref,
 	...props
 });
-//#endregion
-//#region src/components/Sheet/SheetContent.tsx
+// src/components/Sheet/SheetContent.tsx
 const sheetContentVariants = cva([
 	"tailwindcss-preflight",
 	"tw:fixed",
-	"tw:z-[1051]",
+	"tw:z-overlay",
 	"tw:flex",
 	"tw:flex-col",
 	"tw:bg-card",
@@ -108,14 +106,12 @@ const SheetContent = ({ className, children, side = "right", disableTransition =
 		})]
 	});
 };
-//#endregion
-//#region src/components/Sheet/SheetFooter.tsx
+// src/components/Sheet/SheetFooter.tsx
 const SheetFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
 	className: cn("tw:mt-auto tw:flex tw:flex-col tw:gap-2 tw:p-4", className),
 	...props
 });
-//#endregion
-//#region src/components/Sheet/SheetHeader.tsx
+// src/components/Sheet/SheetHeader.tsx
 const SheetHeader = ({ className, children, hideCloseIcon = false, title, description, ...props }) => {
 	const isHeaderRendered = title || description || !hideCloseIcon;
 	return /* @__PURE__ */ jsxs("div", {
@@ -140,14 +136,12 @@ const SheetHeader = ({ className, children, hideCloseIcon = false, title, descri
 		}), children]
 	});
 };
-//#endregion
-//#region src/components/Sheet/SheetTitle.tsx
+// src/components/Sheet/SheetTitle.tsx
 const SheetTitle = ({ className, visuallyHidden = false, ...props }) => /* @__PURE__ */ jsx(Title, {
 	className: cn({ "tw:sr-only": visuallyHidden }, className),
 	...props
 });
-//#endregion
-//#region src/components/Sheet/Sheet.tsx
+// src/components/Sheet/Sheet.tsx
 const Sheet = (props) => /* @__PURE__ */ jsx(Root, { ...props });
 Sheet.Close = Close;
 Sheet.Trigger = Trigger;
@@ -156,7 +150,6 @@ Sheet.Title = SheetTitle;
 Sheet.Header = SheetHeader;
 Sheet.Footer = SheetFooter;
 Sheet.Body = SheetBody;
-//#endregion
 export { Sheet };
 
-//# sourceMappingURL=Sheet-0TWKTqid.js.map
+//# sourceMappingURL=Sheet-DVb4XoJ5.js.map

package/dist/Sheet-DVb4XoJ5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sheet-DVb4XoJ5.js","names":[],"sources":["../src/components/Sheet/SheetBody.tsx","../src/components/Sheet/SheetOverlay.tsx","../src/components/Sheet/SheetContent.tsx","../src/components/Sheet/SheetFooter.tsx","../src/components/Sheet/SheetHeader.tsx","../src/components/Sheet/SheetTitle.tsx","../src/components/Sheet/Sheet.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const SheetBody = ({ className, ...rest }: Props) => (\n  <div\n    {...rest}\n    className={cn('tw:flex', 'tw:flex-col', 'tw:overflow-x-hidden', 'tw:px-4', className)}\n  />\n);\n","import type { ComponentProps } from 'react';\n\nimport { ModalOverlay } from '../Modal/ModalOverlay';\n\ntype Props = ComponentProps<typeof ModalOverlay>;\n\n// Assuming it should have the same style as standard modal, if not remove the modal dependency and style it separately.\nexport const SheetOverlay = ({ ref, ...props }: Props) => <ModalOverlay ref={ref} {...props} />;\n","import type { ComponentProps } from 'react';\nimport { Content, Portal } from '@radix-ui/react-dialog';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nimport { SheetOverlay } from './SheetOverlay';\n\nconst sheetContentVariants = cva(\n  [\n    'tailwindcss-preflight',\n\n    'tw:fixed',\n\n    'tw:z-overlay',\n\n    'tw:flex',\n    'tw:flex-col',\n\n    'tw:bg-card',\n    'tw:text-card-foreground',\n    'tw:shadow-lg',\n\n    'tw:border',\n    'tw:border-border',\n    'tw:focus-visible:outline-hidden',\n    'tw:focus-visible:ring-2',\n    'tw:focus-visible:ring-ring/50',\n\n    'tw:ease-in-out',\n    'tw:data-[state=open]:duration-200',\n    'tw:data-[state=closed]:duration-200',\n  ],\n  {\n    defaultVariants: {\n      side: 'right',\n      disableTransition: false,\n    },\n    variants: {\n      disableTransition: {\n        true: [],\n        false: ['tw:data-[state=open]:animate-in', 'tw:data-[state=closed]:animate-out'],\n      },\n      side: {\n        top: [\n          'tw:inset-x-0',\n          'tw:top-0',\n          'tw:h-auto',\n          'tw:data-[state=closed]:slide-out-to-top',\n          'tw:data-[state=open]:slide-in-from-top',\n          'tw:rounded-b-sheet',\n        ],\n        right: [\n          'tw:inset-y-0',\n          'tw:right-0',\n          'tw:h-full',\n          'tw:data-[state=closed]:slide-out-to-right',\n          'tw:data-[state=open]:slide-in-from-right',\n          'tw:rounded-l-sheet',\n        ],\n\n        bottom: [\n          'tw:inset-x-0',\n          'tw:bottom-0',\n          'tw:h-auto',\n          'tw:data-[state=closed]:slide-out-to-bottom',\n          'tw:data-[state=open]:slide-in-from-bottom',\n          'tw:drop-shadow-2xl', // standard tailwindcss shadow is invisible for a bottom sheet because of positioning\n          'tw:rounded-t-sheet',\n        ],\n\n        left: [\n          'tw:inset-y-0',\n          'tw:left-0',\n          'tw:h-full',\n          'tw:data-[state=closed]:slide-out-to-left',\n          'tw:data-[state=open]:slide-in-from-left',\n          'tw:rounded-r-sheet',\n        ],\n      },\n    },\n  },\n);\n\ntype Props = ComponentProps<typeof Content> & {\n  side?: 'top' | 'right' | 'bottom' | 'left';\n  hideOverlay?: boolean;\n  keepOpenOnPointerDownOutside?: boolean;\n} & VariantProps<typeof sheetContentVariants> &\n  Pick<ComponentProps<typeof Portal>, 'container'>;\n\nexport const SheetContent = ({\n  className,\n  children,\n  side = 'right',\n  disableTransition = false,\n  hideOverlay = false,\n  keepOpenOnPointerDownOutside = false,\n  onPointerDownOutside,\n  onInteractOutside,\n  container,\n  ...props\n}: Props) => {\n  const handleOnPointerDownOutside: ComponentProps<typeof Content>['onPointerDownOutside'] = (\n    event,\n  ) => {\n    if (keepOpenOnPointerDownOutside) event.preventDefault();\n    onPointerDownOutside?.(event);\n  };\n\n  const handleOnInteractOutside: ComponentProps<typeof Content>['onInteractOutside'] = (event) => {\n    if (keepOpenOnPointerDownOutside) event.preventDefault();\n    onInteractOutside?.(event);\n  };\n\n  return (\n    <Portal container={container}>\n      {!hideOverlay && <SheetOverlay disableTransition={disableTransition ?? false} />}\n      <Content\n        {...props}\n        // Silences Radix's missing-description warning; no sheet uses a description.\n        aria-describedby={undefined}\n        className={cn(sheetContentVariants({ side, className, disableTransition }))}\n        onPointerDownOutside={handleOnPointerDownOutside}\n        onInteractOutside={handleOnInteractOutside}\n        data-side={side}\n      >\n        {children}\n      </Content>\n    </Portal>\n  );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const SheetFooter = ({ className, ...props }: Props) => (\n  <div className={cn('tw:mt-auto tw:flex tw:flex-col tw:gap-2 tw:p-4', className)} {...props} />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Close } from '@radix-ui/react-dialog';\n\nimport { X } from '../../icons';\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { ModalDescription } from '../Modal/ModalDescription';\nimport { ModalTitle } from '../Modal/ModalTitle';\n\ntype Props = {\n  title?: ReactNode;\n  description?: ReactNode;\n  hideCloseIcon?: boolean;\n} & ComponentProps<'div'>;\n\nexport const SheetHeader = ({\n  className,\n  children,\n  hideCloseIcon = false,\n  title,\n  description,\n  ...props\n}: Props) => {\n  const isHeaderRendered = title || description || !hideCloseIcon;\n\n  return (\n    <div className={cn('tw:flex', 'tw:flex-col', 'tw:gap-1.5', 'tw:p-4', className)} {...props}>\n      {isHeaderRendered && (\n        <div className=\"tw:flex tw:flex-col\">\n          <div className=\"tw:flex tw:justify-end tw:gap-2\">\n            {title && <ModalTitle>{title}</ModalTitle>}\n            {!hideCloseIcon && (\n              <Close asChild>\n                <Button variant=\"invisible\" size=\"icon-sm\">\n                  <X />\n                  <span className=\"tw:sr-only\">Close</span>\n                </Button>\n              </Close>\n            )}\n          </div>\n          {description && <ModalDescription>{description}</ModalDescription>}\n        </div>\n      )}\n\n      {children}\n    </div>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport { Title } from '@radix-ui/react-dialog';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof Title> & {\n  visuallyHidden?: boolean;\n};\n\nexport const SheetTitle = ({ className, visuallyHidden = false, ...props }: Props) => (\n  <Title className={cn({ 'tw:sr-only': visuallyHidden }, className)} {...props} />\n);\n","import type { ComponentProps } from 'react';\nimport { Close, Root, Trigger } from '@radix-ui/react-dialog';\n\nimport { SheetBody } from './SheetBody';\nimport { SheetContent } from './SheetContent';\nimport { SheetFooter } from './SheetFooter';\nimport { SheetHeader } from './SheetHeader';\nimport { SheetTitle } from './SheetTitle';\n\ntype Props = ComponentProps<typeof Root>;\n\nexport const Sheet = (props: Props) => <Root {...props} />;\n\nSheet.Close = Close;\nSheet.Trigger = Trigger;\nSheet.Content = SheetContent;\nSheet.Title = SheetTitle;\n\nSheet.Header = SheetHeader;\nSheet.Footer = SheetFooter;\nSheet.Body = SheetBody;\n"],"mappings":";;;;;;;;AAMA,MAAa,aAAa,EAAE,WAAW,GAAG,WACxC,oBAAC,OAAD;CACE,GAAI;CACJ,WAAW,GAAG,WAAW,eAAe,wBAAwB,WAAW,SAAS;AACrF,CAAA;;ACHH,MAAa,gBAAgB,EAAE,KAAK,GAAG,YAAmB,oBAAC,cAAD;CAAmB;CAAK,GAAI;AAAQ,CAAA;;ACE9F,MAAM,uBAAuB,IAC3B;CACE;CAEA;CAEA;CAEA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CAEA;CACA;CACA;AACF,GACA;CACE,iBAAiB;EACf,MAAM;EACN,mBAAmB;CACrB;CACA,UAAU;EACR,mBAAmB;GACjB,MAAM,CAAC;GACP,OAAO,CAAC,mCAAmC,oCAAoC;EACjF;EACA,MAAM;GACJ,KAAK;IACH;IACA;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;GACF;GAEA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GAEA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;GACF;EACF;CACF;AACF,CACF;AASA,MAAa,gBAAgB,EAC3B,WACA,UACA,OAAO,SACP,oBAAoB,OACpB,cAAc,OACd,+BAA+B,OAC/B,sBACA,mBACA,WACA,GAAG,YACQ;CACX,MAAM,8BACJ,UACG;EACH,IAAI,8BAA8B,MAAM,eAAe;EACvD,uBAAuB,KAAK;CAC9B;CAEA,MAAM,2BAAgF,UAAU;EAC9F,IAAI,8BAA8B,MAAM,eAAe;EACvD,oBAAoB,KAAK;CAC3B;CAEA,OACE,qBAAC,QAAD;EAAmB;EAAnB,UAAA,CACG,CAAC,eAAe,oBAAC,cAAD,EAAc,mBAAmB,qBAAqB,MAAQ,CAAA,GAC/E,oBAAC,SAAD;GACE,GAAI;GAEJ,oBAAkB,KAAA;GAClB,WAAW,GAAG,qBAAqB;IAAE;IAAM;IAAW;GAAkB,CAAC,CAAC;GAC1E,sBAAsB;GACtB,mBAAmB;GACnB,aAAW;GAEV;EACM,CAAA,CACH;;AAEZ;;AC9HA,MAAa,eAAe,EAAE,WAAW,GAAG,YAC1C,oBAAC,OAAD;CAAK,WAAW,GAAG,kDAAkD,SAAS;CAAG,GAAI;AAAQ,CAAA;;ACQ/F,MAAa,eAAe,EAC1B,WACA,UACA,gBAAgB,OAChB,OACA,aACA,GAAG,YACQ;CACX,MAAM,mBAAmB,SAAS,eAAe,CAAC;CAElD,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,WAAW,eAAe,cAAc,UAAU,SAAS;EAAG,GAAI;EAArF,UAAA,CACG,oBACC,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACE,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACG,SAAS,oBAAC,YAAD,EAAA,UAAa,MAAkB,CAAA,GACxC,CAAC,iBACA,oBAAC,OAAD;KAAO,SAAA;KACL,UAAA,qBAAC,QAAD;MAAQ,SAAQ;MAAY,MAAK;MAAjC,UAAA,CACE,oBAAC,GAAD,CAAI,CAAA,GACJ,oBAAC,QAAD;OAAM,WAAU;OAAa,UAAA;MAAW,CAAA,CAClC;;IACH,CAAA,CAEN;GACJ,CAAA,GAAA,eAAe,oBAAC,kBAAD,EAAA,UAAmB,YAA8B,CAAA,CAC9D;EAGN,CAAA,GAAA,QACE;;AAET;;ACtCA,MAAa,cAAc,EAAE,WAAW,iBAAiB,OAAO,GAAG,YACjE,oBAAC,OAAD;CAAO,WAAW,GAAG,EAAE,cAAc,eAAe,GAAG,SAAS;CAAG,GAAI;AAAQ,CAAA;;ACCjF,MAAa,SAAS,UAAiB,oBAAC,MAAD,EAAM,GAAI,MAAQ,CAAA;AAEzD,MAAM,QAAQ;AACd,MAAM,UAAU;AAChB,MAAM,UAAU;AAChB,MAAM,QAAQ;AAEd,MAAM,SAAS;AACf,MAAM,SAAS;AACf,MAAM,OAAO"}

package/dist/{Sidebar-C5hdANBU.js → Sidebar-DYvodJWN.js}

@@ -1,21 +1,21 @@
-import { cn } from "./classNames-DcGnTh2N.js";
-import { Tooltip, TooltipProvider } from "./utils-DwC9u0tM.js";
+import { cn } from "./classNames-DkX30VJU.js";
+import { Tooltip, TooltipProvider } from "./utils-DjFceY3H.js";
 import { mergeRefs } from "./internal/utils/mergeRefs.js";
-import { ChevronDown, Search } from "./icons-ZIeZXXS7.js";
-import { DropdownMenu } from "./DropdownMenu-CcVbZ_5u.js";
+import { ChevronDown, Search } from "./icons-DDR9dFSr.js";
+import { DropdownMenu } from "./DropdownMenu-Ba9atqDa.js";
 import { ScrollArea } from "./internal/components/ScrollArea.js";
-import { Sheet } from "./Sheet-0TWKTqid.js";
-import { HoverCard } from "./HoverCard-Cv5rmvJq.js";
+import { Sheet } from "./Sheet-DVb4XoJ5.js";
+import { HoverCard } from "./HoverCard-OGWKRXJ7.js";
 import { Separator } from "./internal/components/Separator.js";
-import { useElement } from "./useElement-D-RjrGa4.js";
-import { Collapsible } from "./Collapsible-DD4xTL75.js";
-import { useThemeScopeContainer } from "./ThemeProvider-BTK7AL-T.js";
-import { BrandLogo } from "./BrandLogo-DkESE19K.js";
+import { useElement } from "./useElement-Dcoo9Jlr.js";
+import { Collapsible } from "./Collapsible-zsXk4Vpp.js";
+import { useThemeScopeContainer } from "./ThemeProvider-BCHllN7d.js";
+import { BrandLogo } from "./BrandLogo-Dn7hhp2c.js";
 import { useScrollbarPosition } from "./internal/hooks/useScrollbarPosition.js";
 import { createContext, use, useCallback, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState, useSyncExternalStore } from "react";
 import { Root, Slot, Slottable } from "@radix-ui/react-slot";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/Sidebar/SidebarProvider/useTransitionPresence.ts
+// src/components/Sidebar/SidebarProvider/useTransitionPresence.ts
 const FALLBACK_TIMEOUT_MS = 500;
 /** Under reduced motion there is no `transitionend` to wait for, so the mount is not deferred. */
 const prefersReducedMotion = () => typeof window !== "undefined" && (window.matchMedia?.("(prefers-reduced-motion: reduce)").matches ?? false);
@@ -58,8 +58,7 @@ const useTransitionPresence = ({ mounted, keepMounted = false, mountAfterEnter =
 		completeUnmount: () => send("TRANSITION_END")
 	}), [state, keepMounted]);
 };
-//#endregion
-//#region src/components/Sidebar/SidebarContent.tsx
+// src/components/Sidebar/SidebarContent.tsx
 const SidebarContent = ({ ref, className, children, contentRef }) => {
 	const { setElement, isBottom, isTop, isMiddle } = useScrollbarPosition();
 	const mergedRefs = mergeRefs(ref ?? null, (ref) => setElement(ref));
@@ -80,8 +79,7 @@ const SidebarContent = ({ ref, className, children, contentRef }) => {
 		})
 	});
 };
-//#endregion
-//#region src/hooks/useMediaQuery.ts
+// src/hooks/useMediaQuery.ts
 /**
 * Whether a CSS media query currently matches, re-rendering when it flips.
 *
@@ -98,8 +96,7 @@ const useMediaQuery = (query) => {
 	const getSnapshot = useCallback(() => globalThis.matchMedia?.(query).matches ?? false, [query]);
 	return useSyncExternalStore(subscribe, getSnapshot, () => false);
 };
-//#endregion
-//#region src/components/Sidebar/utils.ts
+// src/components/Sidebar/utils.ts
 const SidebarWidthInPx = {
 	MIN_DEFAULT: 256,
 	COLLAPSED_ICON: 52,
@@ -151,8 +148,7 @@ const calcEffectiveWidths = ({ variant, width: customWidth, collapsible, state,
 	})();
 	return collapsible === "icon" ? iconWidths : offCanvasWidths;
 };
-//#endregion
-//#region src/components/Sidebar/SidebarProvider/context.ts
+// src/components/Sidebar/SidebarProvider/context.ts
 const SidebarContext = createContext(null);
 /** `useSidebar` that returns `null` outside a `SidebarProvider` instead of throwing. */
 const useOptionalSidebar = (side = "left") => use(SidebarContext)?.[side] ?? null;
@@ -161,8 +157,7 @@ const useSidebar = (side = "left") => {
 	if (context === null) throw new Error("useSidebar must be used within a SidebarProvider.");
 	return context[side];
 };
-//#endregion
-//#region src/components/Sidebar/SidebarProvider/useHoverTracking.ts
+// src/components/Sidebar/SidebarProvider/useHoverTracking.ts
 const PORTAL_OPEN_SELECTORS_STRING = ["[aria-haspopup=\"menu\"][aria-expanded=true]", "[aria-haspopup=\"dialog\"][aria-expanded=true]"].join(",");
 const useHoverTracking = (sidebarElement) => {
 	const [hoveredElement, setHoveredElement] = useState(null);
@@ -207,8 +202,7 @@ const useHoverTracking = (sidebarElement) => {
 	}, [sidebarElement]);
 	return isHovered;
 };
-//#endregion
-//#region src/components/Sidebar/SidebarProvider/useSidebarState.ts
+// src/components/Sidebar/SidebarProvider/useSidebarState.ts
 const useSidebarState = ({ defaultMode, mode: modeProp, onModeChange }) => {
 	const [sidebarElement, setSidebarElement] = useElement();
 	const isHovered = useHoverTracking(sidebarElement);
@@ -243,8 +237,7 @@ const useSidebarState = ({ defaultMode, mode: modeProp, onModeChange }) => {
 		setSidebarElement
 	]);
 };
-//#endregion
-//#region src/components/Sidebar/SidebarProvider/SidebarProvider.tsx
+// src/components/Sidebar/SidebarProvider/SidebarProvider.tsx
 const DEFAULT_SIDEBAR_VARIANT = "none";
 const DEFAULT_SIDEBAR_MODE = "expanded";
 const DEFAULT_SIDEBAR_COLLAPSIBLE = "off-canvas";
@@ -379,8 +372,7 @@ const SidebarProvider = ({ children, defaultLeftMode = DEFAULT_SIDEBAR_MODE, lef
 		children
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarFillTrigger.tsx
+// src/components/Sidebar/SidebarFillTrigger.tsx
 const SidebarFillTrigger = ({ ref, side = "left", onClick, ...rest }) => {
 	const { toggleFill, isFill } = useSidebar(side);
 	const handleOnClick = (event) => {
@@ -394,27 +386,23 @@ const SidebarFillTrigger = ({ ref, side = "left", onClick, ...rest }) => {
 		"aria-selected": isFill
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarFooter.tsx
+// src/components/Sidebar/SidebarFooter.tsx
 const SidebarFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
 	"data-slot": "sidebar-footer",
 	className: cn("tw:flex", "tw:flex-col", "tw:gap-2", "tw:p-2", className),
 	...props
 });
-//#endregion
-//#region src/components/Sidebar/SidebarGroup/SidebarGroup.tsx
+// src/components/Sidebar/SidebarGroup/SidebarGroup.tsx
 const SidebarGroup = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
 	className: cn("tw:group/sidebar-group", "tw:relative", "tw:w-full", "tw:flex", "tw:flex-col", "tw:min-w-0", "tw:rounded-lg", className),
 	...props
 });
-//#endregion
-//#region src/components/Sidebar/SidebarGroup/SidebarGroupContent.tsx
+// src/components/Sidebar/SidebarGroup/SidebarGroupContent.tsx
 const SidebarGroupContent = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
 	className: cn("tw:flex", "tw:flex-col", "tw:gap-2", "tw:w-full", className),
 	...props
 });
-//#endregion
-//#region src/components/Sidebar/SidebarGroup/SidebarGroupAction.tsx
+// src/components/Sidebar/SidebarGroup/SidebarGroupAction.tsx
 const SidebarGroupAction = ({ ref, className, type = "button", children, ...props }) => /* @__PURE__ */ jsx("button", {
 	...props,
 	type,
@@ -422,8 +410,7 @@ const SidebarGroupAction = ({ ref, className, type = "button", children, ...prop
 	className: cn("tw:group-data-[state=collapsed]/sidebar:hidden", "tw:absolute", "tw:right-1.5", "tw:top-2", "tw:flex", "tw:items-center", "tw:justify-center", "tw:size-5", "tw:text-sidebar-foreground", "tw:rounded-full", "tw:[&_svg:not([class*=\"tw:size-\"])]:size-3", "tw:[&_svg]:text-muted-foreground", "tw:hover:[&_svg]:text-secondary-600", "tw:hover:bg-muted", "tw:focus-visible:ring-4", "tw:focus-visible:ring-ring/30", "tw:focus-visible:outline", "tw:focus-visible:outline-1", "tw:focus-visible:outline-ring", className),
 	children
 });
-//#endregion
-//#region src/components/Sidebar/SidebarGroup/SidebarGroupLabel.tsx
+// src/components/Sidebar/SidebarGroup/SidebarGroupLabel.tsx
 const SidebarGroupLabel = ({ ref, className, children, ...props }) => /* @__PURE__ */ jsxs("div", {
 	ref,
 	className: cn("tw:relative", "tw:flex", "tw:flex-col", "tw:shrink-0", "tw:h-8", "tw:px-2", "tw:-mb-1", "tw:rounded-lg", "tw:uppercase", "tw:font-sans", "tw:text-xs", "tw:tracking-[1px]", className),
@@ -437,16 +424,14 @@ const SidebarGroupLabel = ({ ref, className, children, ...props }) => /* @__PURE
 		children
 	})]
 });
-//#endregion
-//#region src/components/Sidebar/SidebarInstanceContext.ts
+// src/components/Sidebar/SidebarInstanceContext.ts
 const SidebarInstanceContext = createContext(null);
 const useSidebarInstance = () => {
 	const context = use(SidebarInstanceContext);
 	if (context === null) throw new Error("useSidebarInstance must be used within a SidebarInstanceContext.");
 	return context;
 };
-//#endregion
-//#region src/components/Sidebar/SidebarHeader.tsx
+// src/components/Sidebar/SidebarHeader.tsx
 const SidebarHeader = ({ className, children, ...props }) => {
 	const variant = use(SidebarInstanceContext)?.state === "collapsed" ? "mark" : "wordmark";
 	const fallback = /* @__PURE__ */ jsx(BrandLogo, {
@@ -460,23 +445,20 @@ const SidebarHeader = ({ className, children, ...props }) => {
 		children: children ?? fallback
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenu.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenu.tsx
 const SidebarMenu = ({ className, ...props }) => /* @__PURE__ */ jsx("ul", {
 	"data-sidebar": "menu",
 	className: cn("tw:flex", "tw:w-full", "tw:min-w-0", "tw:flex-col", "tw:gap-1", "tw:transition-[margin,opacity]", "tw:duration-(--sidebar-motion-duration)", "tw:ease-(--sidebar-motion-easing)", "tw:motion-reduce:transition-none", "tw:pl-0", className),
 	...props
 });
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuIcon.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuIcon.tsx
 const SidebarMenuIcon = ({ ref, className, children, ...rest }) => /* @__PURE__ */ jsx("span", {
 	...rest,
 	ref,
 	className: cn("tw:inline-flex", "tw:items-center", "tw:justify-center", "tw:aspect-square", "tw:shrink-0", "tw:p-0.5", "tw:text-sidebar-primary", "tw:[&_svg:not([class*=\"tw:size-\"])]:size-4", className),
 	children
 });
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/useDestinationDismiss.ts
+// src/components/Sidebar/SidebarMenu/useDestinationDismiss.ts
 /**
 * A menu item's click handler: the caller's own, then (on a phone) dismissing the sheet.
 *
@@ -493,8 +475,7 @@ const useDestinationDismiss = (props, onClick) => {
 		if (isMobile && isDestination) setMobileOpen(false);
 	};
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuButton.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuButton.tsx
 /** A collapsed rail is icon-only, so its labels appear almost at once instead of after the default 300ms. */
 const COLLAPSED_TOOLTIP_DELAY_MS = 50;
 const SidebarMenuButton = ({ ref, "aria-selected": selected, className, children, asChild = false, icon, tooltip, onClick, ...props }) => {
@@ -521,14 +502,12 @@ const SidebarMenuButton = ({ ref, "aria-selected": selected, className, children
 	});
 	return button;
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuItem.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuItem.tsx
 const SidebarMenuItem = ({ className, ...props }) => /* @__PURE__ */ jsx("li", {
 	className: cn("tw:group/sidebar-menu-item", "tw:relative", className),
 	...props
 });
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuAction.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuAction.tsx
 const SidebarMenuAction = ({ ref, className, asChild = false, showOnHover = false, children, ...props }) => {
 	return /* @__PURE__ */ jsx(asChild ? Slot : "button", {
 		...props,
@@ -539,8 +518,7 @@ const SidebarMenuAction = ({ ref, className, asChild = false, showOnHover = fals
 		children
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarSearchInput.tsx
+// src/components/Sidebar/SidebarMenu/SidebarSearchInput.tsx
 const wrapperClassnames = cn("tw:group/search-input", "tw:relative", "tw:flex", "tw:items-center", "tw:min-h-9", "tw:rounded-lg", "tw:border", "tw:transition-all", "tw:group-data-[state=collapsed]/sidebar:cursor-pointer", "tw:group-data-[state=collapsed]/sidebar:border-transparent", "tw:group-data-[state=collapsed]/sidebar:hover:bg-sidebar-hover", "tw:group-data-[state=expanded]/sidebar:cursor-text", "tw:group-data-[state=expanded]/sidebar:px-2", "tw:group-data-[state=expanded]/sidebar:border-sidebar-border", "tw:focus-within:ring-2", "tw:focus-within:ring-sidebar-ring/50", "tw:focus-within:text-sidebar-foreground");
 const SidebarSearchInput = ({ ref: forwardedRef, className, ...inputProps }) => {
 	const { side } = useSidebarInstance();
@@ -562,8 +540,7 @@ const SidebarSearchInput = ({ ref: forwardedRef, className, ...inputProps }) =>
 		})]
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuCard.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuCard.tsx
 const Title = ({ children }) => /* @__PURE__ */ jsx("div", {
 	className: "tw:flex tw:select-none tw:gap-2 tw:text-sm tw:font-semibold",
 	children
@@ -613,8 +590,7 @@ const SidebarMenuCard = ({ children, className, icon, title, ...rest }) => {
 		})]
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuBadge.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuBadge.tsx
 const SidebarMenuBadge = ({ ref, className, ...props }) => {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
@@ -624,8 +600,7 @@ const SidebarMenuBadge = ({ ref, className, ...props }) => {
 		...props
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuSub.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuSub.tsx
 const SidebarMenuSub = ({ children, icon, isActive = false, label, defaultOpen = false, open: openProp, onOpenChange }) => {
 	const { state, side, mode } = useSidebarInstance();
 	const [open, setOpen] = useState(null);
@@ -695,8 +670,7 @@ const SidebarMenuSub = ({ children, icon, isActive = false, label, defaultOpen =
 		}) })]
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarMenu/SidebarMenuSubItem.tsx
+// src/components/Sidebar/SidebarMenu/SidebarMenuSubItem.tsx
 const SidebarMenuSubItem = ({ ref, className, asChild = false, children, disabled, onClick, "aria-current": ariaCurrent, ...props }) => {
 	const { mode } = useSidebarInstance();
 	const handleClick = useDestinationDismiss(props, onClick);
@@ -722,8 +696,7 @@ const SidebarMenuSubItem = ({ ref, className, asChild = false, children, disable
 		})
 	});
 };
-//#endregion
-//#region src/components/Sidebar/useResizeSidebar.ts
+// src/components/Sidebar/useResizeSidebar.ts
 const DEFAULT_MIN_WIDTH = 384;
 const DEFAULT_MAX_WIDTH = 800;
 const useResizeSidebar = ({ side, minWidth = DEFAULT_MIN_WIDTH, maxWidth = DEFAULT_MAX_WIDTH }) => {
@@ -793,8 +766,7 @@ const useResizeSidebar = ({ side, minWidth = DEFAULT_MIN_WIDTH, maxWidth = DEFAU
 		isResizable
 	};
 };
-//#endregion
-//#region src/components/Sidebar/SidebarResizeHandle.tsx
+// src/components/Sidebar/SidebarResizeHandle.tsx
 const SidebarResizeHandle = ({ side, minWidth, maxWidth }) => {
 	const { handleProps, isResizable } = useResizeSidebar({
 		side,
@@ -808,16 +780,14 @@ const SidebarResizeHandle = ({ side, minWidth, maxWidth }) => {
 		className: cn("tw:absolute tw:inset-y-0 tw:z-10 tw:w-3", side === "right" ? "tw:left-0" : "tw:right-0", "tw:cursor-col-resize")
 	});
 };
-//#endregion
-//#region src/components/Sidebar/SidebarSeparator.tsx
+// src/components/Sidebar/SidebarSeparator.tsx
 const SidebarSeparator = ({ className, ...props }) => /* @__PURE__ */ jsx(Separator, {
 	...props,
 	orientation: "horizontal",
 	size: "full",
 	className: cn("tw:before:bg-sidebar-border tw:p-2", className)
 });
-//#endregion
-//#region src/components/Sidebar/SidebarTrigger.tsx
+// src/components/Sidebar/SidebarTrigger.tsx
 const SidebarTrigger = ({ side = "left", onClick, hideWhenCollapsed = false, className, ...rest }) => {
 	const { toggle, state, isMobile, isMobileOpen } = useSidebar(side);
 	const handleOnClick = (event) => {
@@ -833,8 +803,7 @@ const SidebarTrigger = ({ side = "left", onClick, hideWhenCollapsed = false, cla
 		className: cn({ "tw:group-data-[state=collapsed]/sidebar:hidden": hideWhenCollapsed }, className)
 	});
 };
-//#endregion
-//#region src/components/Sidebar/Sidebar.tsx
+// src/components/Sidebar/Sidebar.tsx
 const Sidebar = ({ children, className, id, side = "left", style, container = false, keepMounted, mountAfterEnter, resizable = false, mobileTitle, ...rest }) => {
 	const oppositeSide = side === "left" ? "right" : "left";
 	const { setSidebarElement, state, mode, isFill, widths, collapsible, variant, isDragging, isMobile, isMobileOpen, setMobileOpen } = useSidebar(side);
@@ -970,7 +939,6 @@ Sidebar.MenuCard = SidebarMenuCard;
 Sidebar.MenuBadge = SidebarMenuBadge;
 Sidebar.SubMenu = SidebarMenuSub;
 Sidebar.SubItem = SidebarMenuSubItem;
-//#endregion
 export { Sidebar, SidebarProvider, useOptionalSidebar, useSidebar };
 
-//# sourceMappingURL=Sidebar-C5hdANBU.js.map
+//# sourceMappingURL=Sidebar-DYvodJWN.js.map