luan-ui 0.8.3 → 0.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/README.md +31 -0
  2. package/dist/components/accordion/accordion.d.ts +3 -3
  3. package/dist/components/alert-dialog/alert-dialog.d.ts +4 -4
  4. package/dist/components/autocomplete/autocomplete.d.ts +12 -12
  5. package/dist/components/autocomplete/autocomplete.js +2 -2
  6. package/dist/components/autocomplete/autocomplete.js.map +1 -1
  7. package/dist/components/avatar/avatar-group.d.ts +1 -1
  8. package/dist/components/avatar/avatar.d.ts +3 -3
  9. package/dist/components/checkbox/checkbox.d.ts +1 -1
  10. package/dist/components/combobox/combobox.d.ts +12 -12
  11. package/dist/components/combobox/combobox.js +2 -2
  12. package/dist/components/combobox/combobox.js.map +1 -1
  13. package/dist/components/dialog/dialog.d.ts +6 -6
  14. package/dist/components/drawer/drawer.d.ts +6 -6
  15. package/dist/components/dropdown-menu/dropdown-menu.d.ts +14 -14
  16. package/dist/components/form-field/form-field.d.ts +1 -1
  17. package/dist/components/form-field/form-field.js +1 -1
  18. package/dist/components/form-helper/form-helper.d.ts +1 -1
  19. package/dist/components/input/input.d.ts +1 -1
  20. package/dist/components/input/input.js +1 -1
  21. package/dist/components/input/input.js.map +1 -1
  22. package/dist/components/label/label.d.ts +1 -1
  23. package/dist/components/label/label.js +1 -3
  24. package/dist/components/label/label.js.map +1 -1
  25. package/dist/components/pagination/pagination.d.ts +3 -3
  26. package/dist/components/popover/popover.d.ts +5 -5
  27. package/dist/components/progress/progress.d.ts +1 -1
  28. package/dist/components/radio-group/radio-group.d.ts +2 -2
  29. package/dist/components/select/select.d.ts +9 -9
  30. package/dist/components/select/select.js +1 -1
  31. package/dist/components/select/select.js.map +1 -1
  32. package/dist/components/skeleton/skeleton.d.ts +1 -1
  33. package/dist/components/slider/slider.d.ts +1 -1
  34. package/dist/components/slider/slider.js +2 -4
  35. package/dist/components/slider/slider.js.map +1 -1
  36. package/dist/components/switch/switch.d.ts +1 -1
  37. package/dist/components/table/table.d.ts +8 -8
  38. package/dist/components/table/table.js +2 -2
  39. package/dist/components/table/table.js.map +1 -1
  40. package/dist/components/tabs/tabs.d.ts +3 -3
  41. package/dist/components/text-area/text-area.d.ts +1 -1
  42. package/dist/components/text-area/text-area.js +1 -1
  43. package/dist/components/text-area/text-area.js.map +1 -1
  44. package/dist/components/toast/toast.d.ts +1 -1
  45. package/dist/components/toast/toast.js +1 -1
  46. package/dist/components/toast/toast.js.map +1 -1
  47. package/dist/components/tooltip/tooltip.d.ts +3 -3
  48. package/dist/styles/index.css +137 -27
  49. package/dist/utilities/pagination/get-truncated-elements.d.ts +1 -1
  50. package/dist/utilities/pagination/keyboard-navigation.js.map +1 -1
  51. package/dist/utilities/responsive/responsive.d.ts +6 -4
  52. package/package.json +28 -28
package/README.md CHANGED
@@ -29,6 +29,37 @@ In your project, you have to import the custom config to enable animations and c
29
29
 
30
30
  Now you should be able to use the components in your project.
31
31
 
32
+ ## Theming
33
+
34
+ Luan UI ships with two built-in themes that are activated via a `data-theme` attribute:
35
+
36
+ - `data-theme="luan-light"`
37
+ - `data-theme="luan-dark"`
38
+
39
+ The library styles expose semantic tokens for surfaces, borders, text, and interactive states. Both themes also define a base background and foreground color, so applying the theme attribute to a top-level container gives you a matching page background and default text color as well.
40
+
41
+ ```tsx
42
+ export function App() {
43
+ return (
44
+ <div data-theme="luan-dark">
45
+ <Button>Dark theme button</Button>
46
+ </div>
47
+ );
48
+ }
49
+ ```
50
+
51
+ If you want the whole application to follow one theme, apply the attribute at the document level:
52
+
53
+ ```html
54
+ <html data-theme="luan-light">
55
+ <body>
56
+ <div id="root"></div>
57
+ </body>
58
+ </html>
59
+ ```
60
+
61
+ This is especially recommended for components that render in a portal, such as dialogs, popovers, selects, comboboxes, and other overlays, since they inherit the theme from the document instead of a local wrapper.
62
+
32
63
  ## Requirements
33
64
 
34
65
  This library requires **React 19** or higher due to its use of the ref-as-prop pattern.
package/dist/components/accordion/accordion.d.ts CHANGED
@@ -25,9 +25,9 @@ import type { ComponentProps } from "react";
25
25
  export type AccordionProps = ComponentProps<typeof BaseAccordion.Root>;
26
26
  declare const Accordion: <Value = any>(props: BaseAccordion.Root.Props<Value>) => React.JSX.Element;
27
27
  export type AccordionItemProps = ComponentProps<typeof BaseAccordion.Item>;
28
- declare function AccordionItem({ className, ref, ...props }: AccordionItemProps): import("react/jsx-runtime").JSX.Element;
28
+ declare function AccordionItem({ className, ref, ...props }: AccordionItemProps): import("react").JSX.Element;
29
29
  export type AccordionTriggerProps = ComponentProps<typeof BaseAccordion.Trigger>;
30
- declare function AccordionTrigger({ className, children, ref, ...props }: AccordionTriggerProps): import("react/jsx-runtime").JSX.Element;
30
+ declare function AccordionTrigger({ className, children, ref, ...props }: AccordionTriggerProps): import("react").JSX.Element;
31
31
  export type AccordionContentProps = ComponentProps<typeof BaseAccordion.Panel>;
32
- declare function AccordionContent({ className, children, ref, ...props }: AccordionContentProps): import("react/jsx-runtime").JSX.Element;
32
+ declare function AccordionContent({ className, children, ref, ...props }: AccordionContentProps): import("react").JSX.Element;
33
33
  export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
package/dist/components/alert-dialog/alert-dialog.d.ts CHANGED
@@ -3,13 +3,13 @@ import type { ComponentProps } from "react";
3
3
  declare const AlertDialog: typeof BaseAlertDialog.Root;
4
4
  declare const AlertDialogTrigger: BaseAlertDialog.Trigger;
5
5
  export type AlertDialogOverlayProps = ComponentProps<typeof BaseAlertDialog.Backdrop>;
6
- declare function AlertDialogOverlay({ className, ref, ...props }: AlertDialogOverlayProps): import("react/jsx-runtime").JSX.Element;
6
+ declare function AlertDialogOverlay({ className, ref, ...props }: AlertDialogOverlayProps): import("react").JSX.Element;
7
7
  export type AlertDialogContentProps = ComponentProps<typeof BaseAlertDialog.Popup>;
8
- declare function AlertDialogContent({ className, ref, ...props }: AlertDialogContentProps): import("react/jsx-runtime").JSX.Element;
8
+ declare function AlertDialogContent({ className, ref, ...props }: AlertDialogContentProps): import("react").JSX.Element;
9
9
  export type AlertDialogTitleProps = ComponentProps<typeof BaseAlertDialog.Title>;
10
- declare function AlertDialogTitle({ className, ref, ...props }: AlertDialogTitleProps): import("react/jsx-runtime").JSX.Element;
10
+ declare function AlertDialogTitle({ className, ref, ...props }: AlertDialogTitleProps): import("react").JSX.Element;
11
11
  export type AlertDialogDescriptionProps = ComponentProps<typeof BaseAlertDialog.Description>;
12
- declare function AlertDialogDescription({ className, ref, ...props }: AlertDialogDescriptionProps): import("react/jsx-runtime").JSX.Element;
12
+ declare function AlertDialogDescription({ className, ref, ...props }: AlertDialogDescriptionProps): import("react").JSX.Element;
13
13
  declare const AlertDialogAction: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").DialogCloseProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
14
14
  declare const AlertDialogCancel: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").DialogCloseProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
15
15
  export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogOverlay, AlertDialogTitle, AlertDialogTrigger, };
package/dist/components/autocomplete/autocomplete.d.ts CHANGED
@@ -14,29 +14,29 @@ declare function Autocomplete<ItemValue>(props: AutocompleteProps<ItemValue>): J
14
14
  * AutocompleteInputGroup
15
15
  */
16
16
  export type AutocompleteInputGroupProps = ComponentProps<typeof AutocompletePrimitive.InputGroup>;
17
- declare function AutocompleteInputGroup({ className, ref, ...props }: AutocompleteInputGroupProps): import("react/jsx-runtime").JSX.Element;
17
+ declare function AutocompleteInputGroup({ className, ref, ...props }: AutocompleteInputGroupProps): JSX.Element;
18
18
  /**
19
19
  * AutocompleteInput
20
20
  */
21
21
  export type AutocompleteInputProps = ComponentProps<typeof AutocompletePrimitive.Input>;
22
- declare function AutocompleteInput({ className, ref, ...props }: AutocompleteInputProps): import("react/jsx-runtime").JSX.Element;
22
+ declare function AutocompleteInput({ className, ref, ...props }: AutocompleteInputProps): JSX.Element;
23
23
  /**
24
24
  * AutocompleteTrigger
25
25
  */
26
26
  export type AutocompleteTriggerProps = ComponentProps<typeof AutocompletePrimitive.Trigger>;
27
- declare function AutocompleteTrigger({ className, ref, ...props }: AutocompleteTriggerProps): import("react/jsx-runtime").JSX.Element;
27
+ declare function AutocompleteTrigger({ className, ref, ...props }: AutocompleteTriggerProps): JSX.Element;
28
28
  /**
29
29
  * AutocompleteClear
30
30
  */
31
31
  export type AutocompleteClearProps = ComponentProps<typeof AutocompletePrimitive.Clear>;
32
- declare function AutocompleteClear({ className, ref, ...props }: AutocompleteClearProps): import("react/jsx-runtime").JSX.Element;
32
+ declare function AutocompleteClear({ className, ref, ...props }: AutocompleteClearProps): JSX.Element;
33
33
  /**
34
34
  * AutocompleteContent
35
35
  */
36
36
  export type AutocompleteContentProps = ComponentProps<typeof AutocompletePrimitive.Popup> & {
37
37
  sideOffset?: number;
38
38
  };
39
- declare function AutocompleteContent({ className, children, sideOffset, ref, ...props }: AutocompleteContentProps): import("react/jsx-runtime").JSX.Element;
39
+ declare function AutocompleteContent({ className, children, sideOffset, ref, ...props }: AutocompleteContentProps): JSX.Element;
40
40
  /**
41
41
  * AutocompleteCollection
42
42
  *
@@ -45,7 +45,7 @@ declare function AutocompleteContent({ className, children, sideOffset, ref, ...
45
45
  * with an `items` prop, or map filtered groups using useAutocompleteFilteredItems.
46
46
  */
47
47
  export type AutocompleteCollectionProps = ComponentProps<typeof AutocompletePrimitive.Collection>;
48
- declare function AutocompleteCollection(props: AutocompleteCollectionProps): import("react/jsx-runtime").JSX.Element;
48
+ declare function AutocompleteCollection(props: AutocompleteCollectionProps): JSX.Element;
49
49
  /**
50
50
  * Returns the autocomplete’s filtered items (flat list or grouped structure), matching
51
51
  * the current input value.
@@ -55,29 +55,29 @@ declare const useAutocompleteFilteredItems: typeof AutocompletePrimitive.useFilt
55
55
  * AutocompleteList
56
56
  */
57
57
  export type AutocompleteListProps = ComponentProps<typeof AutocompletePrimitive.List>;
58
- declare function AutocompleteList({ className, ref, ...props }: AutocompleteListProps): import("react/jsx-runtime").JSX.Element;
58
+ declare function AutocompleteList({ className, ref, ...props }: AutocompleteListProps): JSX.Element;
59
59
  /**
60
60
  * AutocompleteEmpty
61
61
  */
62
62
  export type AutocompleteEmptyProps = ComponentProps<typeof AutocompletePrimitive.Empty>;
63
- declare function AutocompleteEmpty({ className, ref, ...props }: AutocompleteEmptyProps): import("react/jsx-runtime").JSX.Element;
63
+ declare function AutocompleteEmpty({ className, ref, ...props }: AutocompleteEmptyProps): JSX.Element;
64
64
  /**
65
65
  * AutocompleteItem
66
66
  */
67
67
  export type AutocompleteItemProps = ComponentProps<typeof AutocompletePrimitive.Item>;
68
- declare function AutocompleteItem({ className, children, ref, ...props }: AutocompleteItemProps): import("react/jsx-runtime").JSX.Element;
68
+ declare function AutocompleteItem({ className, children, ref, ...props }: AutocompleteItemProps): JSX.Element;
69
69
  /**
70
70
  * AutocompleteGroup
71
71
  */
72
- declare const AutocompleteGroup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").AutocompleteGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
72
+ declare const AutocompleteGroup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ComboboxGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
73
73
  /**
74
74
  * AutocompleteGroupLabel
75
75
  */
76
76
  export type AutocompleteGroupLabelProps = ComponentProps<typeof AutocompletePrimitive.GroupLabel>;
77
- declare function AutocompleteGroupLabel({ className, ref, ...props }: AutocompleteGroupLabelProps): import("react/jsx-runtime").JSX.Element;
77
+ declare function AutocompleteGroupLabel({ className, ref, ...props }: AutocompleteGroupLabelProps): JSX.Element;
78
78
  /**
79
79
  * AutocompleteSeparator
80
80
  */
81
81
  export type AutocompleteSeparatorProps = ComponentProps<typeof AutocompletePrimitive.Separator>;
82
- declare function AutocompleteSeparator({ className, ref, ...props }: AutocompleteSeparatorProps): import("react/jsx-runtime").JSX.Element;
82
+ declare function AutocompleteSeparator({ className, ref, ...props }: AutocompleteSeparatorProps): JSX.Element;
83
83
  export { Autocomplete, AutocompleteClear, AutocompleteCollection, AutocompleteContent, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInput, AutocompleteInputGroup, AutocompleteItem, AutocompleteList, AutocompleteSeparator, AutocompleteTrigger, useAutocompleteFilteredItems, };
package/dist/components/autocomplete/autocomplete.js CHANGED
@@ -13,10 +13,10 @@ function Autocomplete(props) {
13
13
  return _jsx(Root, { ...props, disabled: disabled, required: required });
14
14
  }
15
15
  function AutocompleteInputGroup({ className, ref, ...props }) {
16
- return (_jsx(AutocompletePrimitive.InputGroup, { ref: ref, className: cn("flex h-9 w-full items-center rounded-md border border-border-input bg-transparent text-sm shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50", className), ...props }));
16
+ return (_jsx(AutocompletePrimitive.InputGroup, { ref: ref, className: cn("flex h-9 w-full items-center rounded-md border border-border-input bg-surface text-sm text-text shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50", className), ...props }));
17
17
  }
18
18
  function AutocompleteInput({ className, ref, ...props }) {
19
- return (_jsx(AutocompletePrimitive.Input, { ref: ref, className: cn("h-full w-full flex-1 bg-transparent px-3 py-2 text-sm outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed", className), ...props }));
19
+ return (_jsx(AutocompletePrimitive.Input, { ref: ref, className: cn("h-full w-full flex-1 bg-transparent px-3 py-2 text-sm text-text outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed", className), ...props }));
20
20
  }
21
21
  function AutocompleteTrigger({ className, ref, ...props }) {
22
22
  return (_jsx(AutocompletePrimitive.Trigger, { ref: ref, className: cn("flex shrink-0 cursor-pointer items-center justify-center px-2 opacity-50 hover:opacity-100 disabled:cursor-not-allowed", className), ...props, children: _jsx(Icon, { size: "small", children: _jsx(ChevronDownIcon, {}) }) }));
package/dist/components/autocomplete/autocomplete.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"autocomplete.js","sourceRoot":"/","sources":["components/autocomplete/autocomplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Autocomplete as AutocompletePrimitive } from \"@base-ui/react/autocomplete\";\nimport { useFormContext } from \"@components/form-field/form-field-context\";\nimport { Icon } from \"@components/icon/icon\";\nimport { ChevronDownIcon, Cross2Icon } from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport type React from \"react\";\nimport type { ComponentProps, JSX } from \"react\";\n\n/**\n * Autocomplete\n *\n * An input that suggests options as you type.\n * Unlike Combobox, the input value can contain free-form text,\n * as suggestions only optionally autocomplete the text.\n */\n\nexport type AutocompleteProps<ItemValue = unknown> =\n\tAutocompletePrimitive.Root.Props<ItemValue>;\n\nfunction Autocomplete<ItemValue>(\n\tprops: AutocompleteProps<ItemValue>,\n): JSX.Element {\n\tconst { disabled, required } = useFormContext({\n\t\tdisabled: props.disabled,\n\t\trequired: props.required,\n\t});\n\tconst Root = AutocompletePrimitive.Root as React.FC<\n\t\tAutocompleteProps<ItemValue>\n\t>;\n\treturn <Root {...props} disabled={disabled} required={required} />;\n}\n\n/**\n * AutocompleteInputGroup\n */\n\nexport type AutocompleteInputGroupProps = ComponentProps<\n\ttypeof AutocompletePrimitive.InputGroup\n>;\n\nfunction AutocompleteInputGroup({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteInputGroupProps) {\n\treturn (\n\t\t<AutocompletePrimitive.InputGroup\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex h-9 w-full items-center rounded-md border border-border-input bg-transparent text-sm shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteInput\n */\n\nexport type AutocompleteInputProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Input\n>;\n\nfunction AutocompleteInput({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteInputProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Input\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"h-full w-full flex-1 bg-transparent px-3 py-2 text-sm outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteTrigger\n */\n\nexport type AutocompleteTriggerProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Trigger\n>;\n\nfunction AutocompleteTrigger({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteTriggerProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Trigger\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-2 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<ChevronDownIcon />\n\t\t\t</Icon>\n\t\t</AutocompletePrimitive.Trigger>\n\t);\n}\n\n/**\n * AutocompleteClear\n */\n\nexport type AutocompleteClearProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Clear\n>;\n\nfunction AutocompleteClear({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteClearProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Clear\n\t\t\tref={ref}\n\t\t\taria-label=\"Clear value\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-1 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<Cross2Icon />\n\t\t\t</Icon>\n\t\t</AutocompletePrimitive.Clear>\n\t);\n}\n\n/**\n * AutocompleteContent\n */\n\nexport type AutocompleteContentProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Popup\n> & {\n\tsideOffset?: number;\n};\n\nfunction AutocompleteContent({\n\tclassName,\n\tchildren,\n\tsideOffset = 4,\n\tref,\n\t...props\n}: AutocompleteContentProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Portal>\n\t\t\t<AutocompletePrimitive.Positioner sideOffset={sideOffset}>\n\t\t\t\t<AutocompletePrimitive.Popup\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-closed:fade-out data-closed:zoom-out-95 data-open:fade-in data-open:zoom-in-95 relative z-50 max-h-(--available-height) min-w-(--anchor-width) origin-(--transform-origin) overflow-y-auto overflow-x-hidden rounded-md border border-border-input bg-surface text-text-secondary shadow-md transition-all data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1 data-closed:animate-out data-open:animate-in\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</AutocompletePrimitive.Popup>\n\t\t\t</AutocompletePrimitive.Positioner>\n\t\t</AutocompletePrimitive.Portal>\n\t);\n}\n\n/**\n * AutocompleteCollection\n *\n * Renders items from autocomplete context after filtering. Pass a function child\n * that receives each visible item. For grouped lists, place inside AutocompleteGroup\n * with an `items` prop, or map filtered groups using useAutocompleteFilteredItems.\n */\n\nexport type AutocompleteCollectionProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Collection\n>;\n\nfunction AutocompleteCollection(props: AutocompleteCollectionProps) {\n\treturn <AutocompletePrimitive.Collection {...props} />;\n}\n\n/**\n * Returns the autocomplete’s filtered items (flat list or grouped structure), matching\n * the current input value.\n */\nconst useAutocompleteFilteredItems = AutocompletePrimitive.useFilteredItems;\n\n/**\n * AutocompleteList\n */\n\nexport type AutocompleteListProps = ComponentProps<\n\ttypeof AutocompletePrimitive.List\n>;\n\nfunction AutocompleteList({ className, ref, ...props }: AutocompleteListProps) {\n\treturn (\n\t\t<AutocompletePrimitive.List\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"w-full p-1 empty:hidden\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteEmpty\n */\n\nexport type AutocompleteEmptyProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Empty\n>;\n\nfunction AutocompleteEmpty({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteEmptyProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Empty\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"px-2 py-4 text-center text-sm text-text-muted empty:hidden\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteItem\n */\n\nexport type AutocompleteItemProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Item\n>;\n\nfunction AutocompleteItem({\n\tclassName,\n\tchildren,\n\tref,\n\t...props\n}: AutocompleteItemProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Item\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex w-full cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-disabled:pointer-events-none data-highlighted:bg-highlight data-highlighted:text-on-highlight data-disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</AutocompletePrimitive.Item>\n\t);\n}\n\n/**\n * AutocompleteGroup\n */\n\nconst AutocompleteGroup = AutocompletePrimitive.Group;\n\n/**\n * AutocompleteGroupLabel\n */\n\nexport type AutocompleteGroupLabelProps = ComponentProps<\n\ttypeof AutocompletePrimitive.GroupLabel\n>;\n\nfunction AutocompleteGroupLabel({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteGroupLabelProps) {\n\treturn (\n\t\t<AutocompletePrimitive.GroupLabel\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"px-2 py-1.5 font-semibold text-sm\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteSeparator\n */\n\nexport type AutocompleteSeparatorProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Separator\n>;\n\nfunction AutocompleteSeparator({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteSeparatorProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Separator\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"my-2 h-px bg-separator\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tAutocomplete,\n\tAutocompleteClear,\n\tAutocompleteCollection,\n\tAutocompleteContent,\n\tAutocompleteEmpty,\n\tAutocompleteGroup,\n\tAutocompleteGroupLabel,\n\tAutocompleteInput,\n\tAutocompleteInputGroup,\n\tAutocompleteItem,\n\tAutocompleteList,\n\tAutocompleteSeparator,\n\tAutocompleteTrigger,\n\tuseAutocompleteFilteredItems,\n};\n"]}
1
+ {"version":3,"file":"autocomplete.js","sourceRoot":"/","sources":["components/autocomplete/autocomplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Autocomplete as AutocompletePrimitive } from \"@base-ui/react/autocomplete\";\nimport { useFormContext } from \"@components/form-field/form-field-context\";\nimport { Icon } from \"@components/icon/icon\";\nimport { ChevronDownIcon, Cross2Icon } from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport type React from \"react\";\nimport type { ComponentProps, JSX } from \"react\";\n\n/**\n * Autocomplete\n *\n * An input that suggests options as you type.\n * Unlike Combobox, the input value can contain free-form text,\n * as suggestions only optionally autocomplete the text.\n */\n\nexport type AutocompleteProps<ItemValue = unknown> =\n\tAutocompletePrimitive.Root.Props<ItemValue>;\n\nfunction Autocomplete<ItemValue>(\n\tprops: AutocompleteProps<ItemValue>,\n): JSX.Element {\n\tconst { disabled, required } = useFormContext({\n\t\tdisabled: props.disabled,\n\t\trequired: props.required,\n\t});\n\tconst Root = AutocompletePrimitive.Root as React.FC<\n\t\tAutocompleteProps<ItemValue>\n\t>;\n\treturn <Root {...props} disabled={disabled} required={required} />;\n}\n\n/**\n * AutocompleteInputGroup\n */\n\nexport type AutocompleteInputGroupProps = ComponentProps<\n\ttypeof AutocompletePrimitive.InputGroup\n>;\n\nfunction AutocompleteInputGroup({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteInputGroupProps) {\n\treturn (\n\t\t<AutocompletePrimitive.InputGroup\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex h-9 w-full items-center rounded-md border border-border-input bg-surface text-sm text-text shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteInput\n */\n\nexport type AutocompleteInputProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Input\n>;\n\nfunction AutocompleteInput({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteInputProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Input\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"h-full w-full flex-1 bg-transparent px-3 py-2 text-sm text-text outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteTrigger\n */\n\nexport type AutocompleteTriggerProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Trigger\n>;\n\nfunction AutocompleteTrigger({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteTriggerProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Trigger\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-2 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<ChevronDownIcon />\n\t\t\t</Icon>\n\t\t</AutocompletePrimitive.Trigger>\n\t);\n}\n\n/**\n * AutocompleteClear\n */\n\nexport type AutocompleteClearProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Clear\n>;\n\nfunction AutocompleteClear({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteClearProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Clear\n\t\t\tref={ref}\n\t\t\taria-label=\"Clear value\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-1 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<Cross2Icon />\n\t\t\t</Icon>\n\t\t</AutocompletePrimitive.Clear>\n\t);\n}\n\n/**\n * AutocompleteContent\n */\n\nexport type AutocompleteContentProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Popup\n> & {\n\tsideOffset?: number;\n};\n\nfunction AutocompleteContent({\n\tclassName,\n\tchildren,\n\tsideOffset = 4,\n\tref,\n\t...props\n}: AutocompleteContentProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Portal>\n\t\t\t<AutocompletePrimitive.Positioner sideOffset={sideOffset}>\n\t\t\t\t<AutocompletePrimitive.Popup\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-closed:fade-out data-closed:zoom-out-95 data-open:fade-in data-open:zoom-in-95 relative z-50 max-h-(--available-height) min-w-(--anchor-width) origin-(--transform-origin) overflow-y-auto overflow-x-hidden rounded-md border border-border-input bg-surface text-text-secondary shadow-md transition-all data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1 data-closed:animate-out data-open:animate-in\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</AutocompletePrimitive.Popup>\n\t\t\t</AutocompletePrimitive.Positioner>\n\t\t</AutocompletePrimitive.Portal>\n\t);\n}\n\n/**\n * AutocompleteCollection\n *\n * Renders items from autocomplete context after filtering. Pass a function child\n * that receives each visible item. For grouped lists, place inside AutocompleteGroup\n * with an `items` prop, or map filtered groups using useAutocompleteFilteredItems.\n */\n\nexport type AutocompleteCollectionProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Collection\n>;\n\nfunction AutocompleteCollection(props: AutocompleteCollectionProps) {\n\treturn <AutocompletePrimitive.Collection {...props} />;\n}\n\n/**\n * Returns the autocomplete’s filtered items (flat list or grouped structure), matching\n * the current input value.\n */\nconst useAutocompleteFilteredItems = AutocompletePrimitive.useFilteredItems;\n\n/**\n * AutocompleteList\n */\n\nexport type AutocompleteListProps = ComponentProps<\n\ttypeof AutocompletePrimitive.List\n>;\n\nfunction AutocompleteList({ className, ref, ...props }: AutocompleteListProps) {\n\treturn (\n\t\t<AutocompletePrimitive.List\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"w-full p-1 empty:hidden\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteEmpty\n */\n\nexport type AutocompleteEmptyProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Empty\n>;\n\nfunction AutocompleteEmpty({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteEmptyProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Empty\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"px-2 py-4 text-center text-sm text-text-muted empty:hidden\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteItem\n */\n\nexport type AutocompleteItemProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Item\n>;\n\nfunction AutocompleteItem({\n\tclassName,\n\tchildren,\n\tref,\n\t...props\n}: AutocompleteItemProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Item\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex w-full cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-disabled:pointer-events-none data-highlighted:bg-highlight data-highlighted:text-on-highlight data-disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</AutocompletePrimitive.Item>\n\t);\n}\n\n/**\n * AutocompleteGroup\n */\n\nconst AutocompleteGroup = AutocompletePrimitive.Group;\n\n/**\n * AutocompleteGroupLabel\n */\n\nexport type AutocompleteGroupLabelProps = ComponentProps<\n\ttypeof AutocompletePrimitive.GroupLabel\n>;\n\nfunction AutocompleteGroupLabel({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteGroupLabelProps) {\n\treturn (\n\t\t<AutocompletePrimitive.GroupLabel\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"px-2 py-1.5 font-semibold text-sm\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * AutocompleteSeparator\n */\n\nexport type AutocompleteSeparatorProps = ComponentProps<\n\ttypeof AutocompletePrimitive.Separator\n>;\n\nfunction AutocompleteSeparator({\n\tclassName,\n\tref,\n\t...props\n}: AutocompleteSeparatorProps) {\n\treturn (\n\t\t<AutocompletePrimitive.Separator\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"my-2 h-px bg-separator\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tAutocomplete,\n\tAutocompleteClear,\n\tAutocompleteCollection,\n\tAutocompleteContent,\n\tAutocompleteEmpty,\n\tAutocompleteGroup,\n\tAutocompleteGroupLabel,\n\tAutocompleteInput,\n\tAutocompleteInputGroup,\n\tAutocompleteItem,\n\tAutocompleteList,\n\tAutocompleteSeparator,\n\tAutocompleteTrigger,\n\tuseAutocompleteFilteredItems,\n};\n"]}
package/dist/components/avatar/avatar-group.d.ts CHANGED
@@ -3,5 +3,5 @@ export type AvatarGroupProps = ComponentProps<"div"> & {
3
3
  maxAvatars?: number;
4
4
  ref?: Ref<HTMLDivElement>;
5
5
  };
6
- declare function AvatarGroup({ children, maxAvatars, ref, ...props }: AvatarGroupProps): import("react/jsx-runtime").JSX.Element;
6
+ declare function AvatarGroup({ children, maxAvatars, ref, ...props }: AvatarGroupProps): import("react").JSX.Element;
7
7
  export { AvatarGroup };
package/dist/components/avatar/avatar.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { Avatar as AvatarPrimitive } from "@base-ui/react/avatar";
2
2
  import type { ComponentProps } from "react";
3
3
  export type AvatarProps = ComponentProps<typeof AvatarPrimitive.Root>;
4
- declare function Avatar({ className, ref, ...props }: AvatarProps): import("react/jsx-runtime").JSX.Element;
4
+ declare function Avatar({ className, ref, ...props }: AvatarProps): import("react").JSX.Element;
5
5
  export type AvatarImageProps = ComponentProps<typeof AvatarPrimitive.Image>;
6
- declare function AvatarImage({ className, ref, ...props }: AvatarImageProps): import("react/jsx-runtime").JSX.Element;
6
+ declare function AvatarImage({ className, ref, ...props }: AvatarImageProps): import("react").JSX.Element;
7
7
  export type AvatarFallbackProps = ComponentProps<typeof AvatarPrimitive.Fallback>;
8
- declare function AvatarFallback({ className, ref, ...props }: AvatarFallbackProps): import("react/jsx-runtime").JSX.Element;
8
+ declare function AvatarFallback({ className, ref, ...props }: AvatarFallbackProps): import("react").JSX.Element;
9
9
  export { Avatar, AvatarFallback, AvatarImage };
package/dist/components/checkbox/checkbox.d.ts CHANGED
@@ -35,4 +35,4 @@ export declare const SIZES: {
35
35
  * <Checkbox id="checkbox" onCheckedChange={(checked) => console.log(checked)} />
36
36
  * ```
37
37
  */
38
- export declare function Checkbox({ className, disabled: initialDisabled, required: initialRequired, size, ref, ...props }: CheckboxProps): import("react/jsx-runtime").JSX.Element;
38
+ export declare function Checkbox({ className, disabled: initialDisabled, required: initialRequired, size, ref, ...props }: CheckboxProps): import("react").JSX.Element;
package/dist/components/combobox/combobox.d.ts CHANGED
@@ -13,29 +13,29 @@ declare function Combobox<Value, Multiple extends boolean | undefined = false>({
13
13
  * ComboboxInputGroup
14
14
  */
15
15
  export type ComboboxInputGroupProps = ComponentProps<typeof ComboboxPrimitive.InputGroup>;
16
- declare function ComboboxInputGroup({ className, ref, ...props }: ComboboxInputGroupProps): import("react/jsx-runtime").JSX.Element;
16
+ declare function ComboboxInputGroup({ className, ref, ...props }: ComboboxInputGroupProps): JSX.Element;
17
17
  /**
18
18
  * ComboboxInput
19
19
  */
20
20
  export type ComboboxInputProps = ComponentProps<typeof ComboboxPrimitive.Input>;
21
- declare function ComboboxInput({ className, ref, ...props }: ComboboxInputProps): import("react/jsx-runtime").JSX.Element;
21
+ declare function ComboboxInput({ className, ref, ...props }: ComboboxInputProps): JSX.Element;
22
22
  /**
23
23
  * ComboboxTrigger
24
24
  */
25
25
  export type ComboboxTriggerProps = ComponentProps<typeof ComboboxPrimitive.Trigger>;
26
- declare function ComboboxTrigger({ className, ref, ...props }: ComboboxTriggerProps): import("react/jsx-runtime").JSX.Element;
26
+ declare function ComboboxTrigger({ className, ref, ...props }: ComboboxTriggerProps): JSX.Element;
27
27
  /**
28
28
  * ComboboxClear
29
29
  */
30
30
  export type ComboboxClearProps = ComponentProps<typeof ComboboxPrimitive.Clear>;
31
- declare function ComboboxClear({ className, ref, ...props }: ComboboxClearProps): import("react/jsx-runtime").JSX.Element;
31
+ declare function ComboboxClear({ className, ref, ...props }: ComboboxClearProps): JSX.Element;
32
32
  /**
33
33
  * ComboboxContent
34
34
  */
35
35
  export type ComboboxContentProps = ComponentProps<typeof ComboboxPrimitive.Popup> & {
36
36
  sideOffset?: number;
37
37
  };
38
- declare function ComboboxContent({ className, children, sideOffset, ref, ...props }: ComboboxContentProps): import("react/jsx-runtime").JSX.Element;
38
+ declare function ComboboxContent({ className, children, sideOffset, ref, ...props }: ComboboxContentProps): JSX.Element;
39
39
  /**
40
40
  * ComboboxCollection
41
41
  *
@@ -44,7 +44,7 @@ declare function ComboboxContent({ className, children, sideOffset, ref, ...prop
44
44
  * an `items` prop, or map filtered groups using useComboboxFilteredItems.
45
45
  */
46
46
  export type ComboboxCollectionProps = ComponentProps<typeof ComboboxPrimitive.Collection>;
47
- declare function ComboboxCollection(props: ComboboxCollectionProps): import("react/jsx-runtime").JSX.Element;
47
+ declare function ComboboxCollection(props: ComboboxCollectionProps): JSX.Element;
48
48
  /**
49
49
  * Returns the combobox’s filtered items (flat list or grouped structure), matching
50
50
  * the current input query.
@@ -54,29 +54,29 @@ declare const useComboboxFilteredItems: typeof ComboboxPrimitive.useFilteredItem
54
54
  * ComboboxList
55
55
  */
56
56
  export type ComboboxListProps = ComponentProps<typeof ComboboxPrimitive.List>;
57
- declare function ComboboxList({ className, ref, ...props }: ComboboxListProps): import("react/jsx-runtime").JSX.Element;
57
+ declare function ComboboxList({ className, ref, ...props }: ComboboxListProps): JSX.Element;
58
58
  /**
59
59
  * ComboboxEmpty
60
60
  */
61
61
  export type ComboboxEmptyProps = ComponentProps<typeof ComboboxPrimitive.Empty>;
62
- declare function ComboboxEmpty({ className, ref, ...props }: ComboboxEmptyProps): import("react/jsx-runtime").JSX.Element;
62
+ declare function ComboboxEmpty({ className, ref, ...props }: ComboboxEmptyProps): JSX.Element;
63
63
  /**
64
64
  * ComboboxItem
65
65
  */
66
66
  export type ComboboxItemProps = ComponentProps<typeof ComboboxPrimitive.Item>;
67
- declare function ComboboxItem({ className, children, ref, ...props }: ComboboxItemProps): import("react/jsx-runtime").JSX.Element;
67
+ declare function ComboboxItem({ className, children, ref, ...props }: ComboboxItemProps): JSX.Element;
68
68
  /**
69
69
  * ComboboxGroup
70
70
  */
71
- declare const ComboboxGroup: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").AutocompleteGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
71
+ declare const ComboboxGroup: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ComboboxGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
72
72
  /**
73
73
  * ComboboxGroupLabel
74
74
  */
75
75
  export type ComboboxGroupLabelProps = ComponentProps<typeof ComboboxPrimitive.GroupLabel>;
76
- declare function ComboboxGroupLabel({ className, ref, ...props }: ComboboxGroupLabelProps): import("react/jsx-runtime").JSX.Element;
76
+ declare function ComboboxGroupLabel({ className, ref, ...props }: ComboboxGroupLabelProps): JSX.Element;
77
77
  /**
78
78
  * ComboboxSeparator
79
79
  */
80
80
  export type ComboboxSeparatorProps = ComponentProps<typeof ComboboxPrimitive.Separator>;
81
- declare function ComboboxSeparator({ className, ref, ...props }: ComboboxSeparatorProps): import("react/jsx-runtime").JSX.Element;
81
+ declare function ComboboxSeparator({ className, ref, ...props }: ComboboxSeparatorProps): JSX.Element;
82
82
  export { Combobox, ComboboxClear, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxInputGroup, ComboboxItem, ComboboxList, ComboboxSeparator, ComboboxTrigger, useComboboxFilteredItems, };
package/dist/components/combobox/combobox.js CHANGED
@@ -12,10 +12,10 @@ function Combobox({ disabled: initialDisabled, required: initialRequired, ...pro
12
12
  return (_jsx(ComboboxPrimitive.Root, { disabled: disabled, required: required, ...props }));
13
13
  }
14
14
  function ComboboxInputGroup({ className, ref, ...props }) {
15
- return (_jsx(ComboboxPrimitive.InputGroup, { ref: ref, className: cn("flex h-9 w-full items-center rounded-md border border-border-input bg-transparent text-sm shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50", className), ...props }));
15
+ return (_jsx(ComboboxPrimitive.InputGroup, { ref: ref, className: cn("flex h-9 w-full items-center rounded-md border border-border-input bg-surface text-sm text-text shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50", className), ...props }));
16
16
  }
17
17
  function ComboboxInput({ className, ref, ...props }) {
18
- return (_jsx(ComboboxPrimitive.Input, { ref: ref, className: cn("h-full w-full flex-1 bg-transparent px-3 py-2 text-sm outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed", className), ...props }));
18
+ return (_jsx(ComboboxPrimitive.Input, { ref: ref, className: cn("h-full w-full flex-1 bg-transparent px-3 py-2 text-sm text-text outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed", className), ...props }));
19
19
  }
20
20
  function ComboboxTrigger({ className, ref, ...props }) {
21
21
  return (_jsx(ComboboxPrimitive.Trigger, { ref: ref, className: cn("flex shrink-0 cursor-pointer items-center justify-center px-2 opacity-50 hover:opacity-100 disabled:cursor-not-allowed", className), ...props, children: _jsx(Icon, { size: "small", children: _jsx(ChevronDownIcon, {}) }) }));
package/dist/components/combobox/combobox.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"combobox.js","sourceRoot":"/","sources":["components/combobox/combobox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Combobox as ComboboxPrimitive } from \"@base-ui/react/combobox\";\nimport { useFormContext } from \"@components/form-field/form-field-context\";\nimport { Icon } from \"@components/icon/icon\";\nimport { CheckIcon, ChevronDownIcon, Cross2Icon } from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport type { ComponentProps, JSX } from \"react\";\n\n/**\n * Combobox\n *\n * An input combined with a list of predefined items to select.\n * Use when the input is restricted to a set of predefined selectable items,\n * similar to Select but whose items are filterable using an input.\n */\n\nexport type ComboboxProps<\n\tValue = unknown,\n\tMultiple extends boolean | undefined = false,\n> = ComboboxPrimitive.Root.Props<Value, Multiple>;\n\nfunction Combobox<Value, Multiple extends boolean | undefined = false>({\n\tdisabled: initialDisabled,\n\trequired: initialRequired,\n\t...props\n}: ComboboxProps<Value, Multiple>): JSX.Element {\n\tconst { disabled, required } = useFormContext({\n\t\tdisabled: initialDisabled,\n\t\trequired: initialRequired,\n\t});\n\treturn (\n\t\t<ComboboxPrimitive.Root<Value, Multiple>\n\t\t\tdisabled={disabled}\n\t\t\trequired={required}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxInputGroup\n */\n\nexport type ComboboxInputGroupProps = ComponentProps<\n\ttypeof ComboboxPrimitive.InputGroup\n>;\n\nfunction ComboboxInputGroup({\n\tclassName,\n\tref,\n\t...props\n}: ComboboxInputGroupProps) {\n\treturn (\n\t\t<ComboboxPrimitive.InputGroup\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex h-9 w-full items-center rounded-md border border-border-input bg-transparent text-sm shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxInput\n */\n\nexport type ComboboxInputProps = ComponentProps<typeof ComboboxPrimitive.Input>;\n\nfunction ComboboxInput({ className, ref, ...props }: ComboboxInputProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Input\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"h-full w-full flex-1 bg-transparent px-3 py-2 text-sm outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxTrigger\n */\n\nexport type ComboboxTriggerProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Trigger\n>;\n\nfunction ComboboxTrigger({ className, ref, ...props }: ComboboxTriggerProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Trigger\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-2 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<ChevronDownIcon />\n\t\t\t</Icon>\n\t\t</ComboboxPrimitive.Trigger>\n\t);\n}\n\n/**\n * ComboboxClear\n */\n\nexport type ComboboxClearProps = ComponentProps<typeof ComboboxPrimitive.Clear>;\n\nfunction ComboboxClear({ className, ref, ...props }: ComboboxClearProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Clear\n\t\t\tref={ref}\n\t\t\taria-label=\"Clear selection\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-1 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<Cross2Icon />\n\t\t\t</Icon>\n\t\t</ComboboxPrimitive.Clear>\n\t);\n}\n\n/**\n * ComboboxContent\n */\n\nexport type ComboboxContentProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Popup\n> & {\n\tsideOffset?: number;\n};\n\nfunction ComboboxContent({\n\tclassName,\n\tchildren,\n\tsideOffset = 4,\n\tref,\n\t...props\n}: ComboboxContentProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Portal>\n\t\t\t<ComboboxPrimitive.Positioner sideOffset={sideOffset}>\n\t\t\t\t<ComboboxPrimitive.Popup\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-closed:fade-out data-closed:zoom-out-95 data-open:fade-in data-open:zoom-in-95 relative z-50 max-h-(--available-height) min-w-(--anchor-width) origin-(--transform-origin) overflow-y-auto overflow-x-hidden rounded-md border border-border-input bg-surface text-text-secondary shadow-md transition-all data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1 data-closed:animate-out data-open:animate-in\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</ComboboxPrimitive.Popup>\n\t\t\t</ComboboxPrimitive.Positioner>\n\t\t</ComboboxPrimitive.Portal>\n\t);\n}\n\n/**\n * ComboboxCollection\n *\n * Renders items from combobox context after filtering. Pass a function child that\n * receives each visible item. For grouped lists, place inside ComboboxGroup with\n * an `items` prop, or map filtered groups using useComboboxFilteredItems.\n */\n\nexport type ComboboxCollectionProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Collection\n>;\n\nfunction ComboboxCollection(props: ComboboxCollectionProps) {\n\treturn <ComboboxPrimitive.Collection {...props} />;\n}\n\n/**\n * Returns the combobox’s filtered items (flat list or grouped structure), matching\n * the current input query.\n */\nconst useComboboxFilteredItems = ComboboxPrimitive.useFilteredItems;\n\n/**\n * ComboboxList\n */\n\nexport type ComboboxListProps = ComponentProps<typeof ComboboxPrimitive.List>;\n\nfunction ComboboxList({ className, ref, ...props }: ComboboxListProps) {\n\treturn (\n\t\t<ComboboxPrimitive.List\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"w-full p-1 empty:hidden\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxEmpty\n */\n\nexport type ComboboxEmptyProps = ComponentProps<typeof ComboboxPrimitive.Empty>;\n\nfunction ComboboxEmpty({ className, ref, ...props }: ComboboxEmptyProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Empty\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"px-2 py-4 text-center text-sm text-text-muted empty:hidden\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxItem\n */\n\nexport type ComboboxItemProps = ComponentProps<typeof ComboboxPrimitive.Item>;\n\nfunction ComboboxItem({\n\tclassName,\n\tchildren,\n\tref,\n\t...props\n}: ComboboxItemProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Item\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pr-8 pl-2 text-sm outline-none data-disabled:pointer-events-none data-highlighted:bg-highlight data-highlighted:text-on-highlight data-disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t\t<ComboboxPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon size=\"small\">\n\t\t\t\t\t\t<CheckIcon />\n\t\t\t\t\t</Icon>\n\t\t\t\t</ComboboxPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</ComboboxPrimitive.Item>\n\t);\n}\n\n/**\n * ComboboxGroup\n */\n\nconst ComboboxGroup = ComboboxPrimitive.Group;\n\n/**\n * ComboboxGroupLabel\n */\n\nexport type ComboboxGroupLabelProps = ComponentProps<\n\ttypeof ComboboxPrimitive.GroupLabel\n>;\n\nfunction ComboboxGroupLabel({\n\tclassName,\n\tref,\n\t...props\n}: ComboboxGroupLabelProps) {\n\treturn (\n\t\t<ComboboxPrimitive.GroupLabel\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"px-2 py-1.5 font-semibold text-sm\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxSeparator\n */\n\nexport type ComboboxSeparatorProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Separator\n>;\n\nfunction ComboboxSeparator({\n\tclassName,\n\tref,\n\t...props\n}: ComboboxSeparatorProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Separator\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"my-2 h-px bg-separator\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tCombobox,\n\tComboboxClear,\n\tComboboxCollection,\n\tComboboxContent,\n\tComboboxEmpty,\n\tComboboxGroup,\n\tComboboxGroupLabel,\n\tComboboxInput,\n\tComboboxInputGroup,\n\tComboboxItem,\n\tComboboxList,\n\tComboboxSeparator,\n\tComboboxTrigger,\n\tuseComboboxFilteredItems,\n};\n"]}
1
+ {"version":3,"file":"combobox.js","sourceRoot":"/","sources":["components/combobox/combobox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Combobox as ComboboxPrimitive } from \"@base-ui/react/combobox\";\nimport { useFormContext } from \"@components/form-field/form-field-context\";\nimport { Icon } from \"@components/icon/icon\";\nimport { CheckIcon, ChevronDownIcon, Cross2Icon } from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport type { ComponentProps, JSX } from \"react\";\n\n/**\n * Combobox\n *\n * An input combined with a list of predefined items to select.\n * Use when the input is restricted to a set of predefined selectable items,\n * similar to Select but whose items are filterable using an input.\n */\n\nexport type ComboboxProps<\n\tValue = unknown,\n\tMultiple extends boolean | undefined = false,\n> = ComboboxPrimitive.Root.Props<Value, Multiple>;\n\nfunction Combobox<Value, Multiple extends boolean | undefined = false>({\n\tdisabled: initialDisabled,\n\trequired: initialRequired,\n\t...props\n}: ComboboxProps<Value, Multiple>): JSX.Element {\n\tconst { disabled, required } = useFormContext({\n\t\tdisabled: initialDisabled,\n\t\trequired: initialRequired,\n\t});\n\treturn (\n\t\t<ComboboxPrimitive.Root<Value, Multiple>\n\t\t\tdisabled={disabled}\n\t\t\trequired={required}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxInputGroup\n */\n\nexport type ComboboxInputGroupProps = ComponentProps<\n\ttypeof ComboboxPrimitive.InputGroup\n>;\n\nfunction ComboboxInputGroup({\n\tclassName,\n\tref,\n\t...props\n}: ComboboxInputGroupProps) {\n\treturn (\n\t\t<ComboboxPrimitive.InputGroup\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex h-9 w-full items-center rounded-md border border-border-input bg-surface text-sm text-text shadow-sm ring-offset-background focus-within:outline-none focus-within:ring-1 focus-within:ring-ring disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxInput\n */\n\nexport type ComboboxInputProps = ComponentProps<typeof ComboboxPrimitive.Input>;\n\nfunction ComboboxInput({ className, ref, ...props }: ComboboxInputProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Input\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"h-full w-full flex-1 bg-transparent px-3 py-2 text-sm text-text outline-none placeholder:text-text-placeholder disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxTrigger\n */\n\nexport type ComboboxTriggerProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Trigger\n>;\n\nfunction ComboboxTrigger({ className, ref, ...props }: ComboboxTriggerProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Trigger\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-2 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<ChevronDownIcon />\n\t\t\t</Icon>\n\t\t</ComboboxPrimitive.Trigger>\n\t);\n}\n\n/**\n * ComboboxClear\n */\n\nexport type ComboboxClearProps = ComponentProps<typeof ComboboxPrimitive.Clear>;\n\nfunction ComboboxClear({ className, ref, ...props }: ComboboxClearProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Clear\n\t\t\tref={ref}\n\t\t\taria-label=\"Clear selection\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 cursor-pointer items-center justify-center px-1 opacity-50 hover:opacity-100 disabled:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon size=\"small\">\n\t\t\t\t<Cross2Icon />\n\t\t\t</Icon>\n\t\t</ComboboxPrimitive.Clear>\n\t);\n}\n\n/**\n * ComboboxContent\n */\n\nexport type ComboboxContentProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Popup\n> & {\n\tsideOffset?: number;\n};\n\nfunction ComboboxContent({\n\tclassName,\n\tchildren,\n\tsideOffset = 4,\n\tref,\n\t...props\n}: ComboboxContentProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Portal>\n\t\t\t<ComboboxPrimitive.Positioner sideOffset={sideOffset}>\n\t\t\t\t<ComboboxPrimitive.Popup\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-closed:fade-out data-closed:zoom-out-95 data-open:fade-in data-open:zoom-in-95 relative z-50 max-h-(--available-height) min-w-(--anchor-width) origin-(--transform-origin) overflow-y-auto overflow-x-hidden rounded-md border border-border-input bg-surface text-text-secondary shadow-md transition-all data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1 data-closed:animate-out data-open:animate-in\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</ComboboxPrimitive.Popup>\n\t\t\t</ComboboxPrimitive.Positioner>\n\t\t</ComboboxPrimitive.Portal>\n\t);\n}\n\n/**\n * ComboboxCollection\n *\n * Renders items from combobox context after filtering. Pass a function child that\n * receives each visible item. For grouped lists, place inside ComboboxGroup with\n * an `items` prop, or map filtered groups using useComboboxFilteredItems.\n */\n\nexport type ComboboxCollectionProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Collection\n>;\n\nfunction ComboboxCollection(props: ComboboxCollectionProps) {\n\treturn <ComboboxPrimitive.Collection {...props} />;\n}\n\n/**\n * Returns the combobox’s filtered items (flat list or grouped structure), matching\n * the current input query.\n */\nconst useComboboxFilteredItems = ComboboxPrimitive.useFilteredItems;\n\n/**\n * ComboboxList\n */\n\nexport type ComboboxListProps = ComponentProps<typeof ComboboxPrimitive.List>;\n\nfunction ComboboxList({ className, ref, ...props }: ComboboxListProps) {\n\treturn (\n\t\t<ComboboxPrimitive.List\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"w-full p-1 empty:hidden\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxEmpty\n */\n\nexport type ComboboxEmptyProps = ComponentProps<typeof ComboboxPrimitive.Empty>;\n\nfunction ComboboxEmpty({ className, ref, ...props }: ComboboxEmptyProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Empty\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"px-2 py-4 text-center text-sm text-text-muted empty:hidden\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxItem\n */\n\nexport type ComboboxItemProps = ComponentProps<typeof ComboboxPrimitive.Item>;\n\nfunction ComboboxItem({\n\tclassName,\n\tchildren,\n\tref,\n\t...props\n}: ComboboxItemProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Item\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pr-8 pl-2 text-sm outline-none data-disabled:pointer-events-none data-highlighted:bg-highlight data-highlighted:text-on-highlight data-disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t\t<ComboboxPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon size=\"small\">\n\t\t\t\t\t\t<CheckIcon />\n\t\t\t\t\t</Icon>\n\t\t\t\t</ComboboxPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</ComboboxPrimitive.Item>\n\t);\n}\n\n/**\n * ComboboxGroup\n */\n\nconst ComboboxGroup = ComboboxPrimitive.Group;\n\n/**\n * ComboboxGroupLabel\n */\n\nexport type ComboboxGroupLabelProps = ComponentProps<\n\ttypeof ComboboxPrimitive.GroupLabel\n>;\n\nfunction ComboboxGroupLabel({\n\tclassName,\n\tref,\n\t...props\n}: ComboboxGroupLabelProps) {\n\treturn (\n\t\t<ComboboxPrimitive.GroupLabel\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"px-2 py-1.5 font-semibold text-sm\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * ComboboxSeparator\n */\n\nexport type ComboboxSeparatorProps = ComponentProps<\n\ttypeof ComboboxPrimitive.Separator\n>;\n\nfunction ComboboxSeparator({\n\tclassName,\n\tref,\n\t...props\n}: ComboboxSeparatorProps) {\n\treturn (\n\t\t<ComboboxPrimitive.Separator\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"my-2 h-px bg-separator\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tCombobox,\n\tComboboxClear,\n\tComboboxCollection,\n\tComboboxContent,\n\tComboboxEmpty,\n\tComboboxGroup,\n\tComboboxGroupLabel,\n\tComboboxInput,\n\tComboboxInputGroup,\n\tComboboxItem,\n\tComboboxList,\n\tComboboxSeparator,\n\tComboboxTrigger,\n\tuseComboboxFilteredItems,\n};\n"]}
package/dist/components/dialog/dialog.d.ts CHANGED
@@ -1,17 +1,17 @@
1
1
  import { Dialog as BaseDialog } from "@base-ui/react/dialog";
2
2
  import type { ComponentProps } from "react";
3
- declare const Dialog: typeof BaseDialog.Root;
3
+ declare const Dialog: <Payload>(props: BaseDialog.Root.Props<Payload>) => React.JSX.Element;
4
4
  declare const DialogTrigger: BaseDialog.Trigger;
5
5
  declare const DialogClose: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").DialogCloseProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
6
6
  export type DialogOverlayProps = ComponentProps<typeof BaseDialog.Backdrop>;
7
7
  export type DialogContentProps = ComponentProps<typeof BaseDialog.Popup>;
8
- declare function DialogContent({ children, className, ref, ...props }: DialogContentProps): import("react/jsx-runtime").JSX.Element;
8
+ declare function DialogContent({ children, className, ref, ...props }: DialogContentProps): import("react").JSX.Element;
9
9
  export type DialogHeaderProps = ComponentProps<"div">;
10
- declare function DialogHeader({ className, ref, ...props }: DialogHeaderProps): import("react/jsx-runtime").JSX.Element;
10
+ declare function DialogHeader({ className, ref, ...props }: DialogHeaderProps): import("react").JSX.Element;
11
11
  export type DialogTitleProps = ComponentProps<typeof BaseDialog.Title>;
12
- declare function DialogTitle({ className, ref, ...props }: DialogTitleProps): import("react/jsx-runtime").JSX.Element;
12
+ declare function DialogTitle({ className, ref, ...props }: DialogTitleProps): import("react").JSX.Element;
13
13
  export type DialogDescriptionProps = ComponentProps<typeof BaseDialog.Description>;
14
- declare function DialogDescription({ className, ref, ...props }: DialogDescriptionProps): import("react/jsx-runtime").JSX.Element;
14
+ declare function DialogDescription({ className, ref, ...props }: DialogDescriptionProps): import("react").JSX.Element;
15
15
  export type DialogFooterProps = ComponentProps<"div">;
16
- declare function DialogFooter({ className, ref, ...props }: DialogFooterProps): import("react/jsx-runtime").JSX.Element;
16
+ declare function DialogFooter({ className, ref, ...props }: DialogFooterProps): import("react").JSX.Element;
17
17
  export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, };
package/dist/components/drawer/drawer.d.ts CHANGED
@@ -10,20 +10,20 @@ type DrawerSide = keyof typeof SIDE_TO_SWIPE_DIRECTION;
10
10
  export type DrawerProps = ComponentProps<typeof BaseDrawer.Root> & {
11
11
  side?: DrawerSide;
12
12
  };
13
- declare function Drawer({ children, side, ...props }: DrawerProps): import("react/jsx-runtime").JSX.Element;
13
+ declare function Drawer({ children, side, ...props }: DrawerProps): import("react").JSX.Element;
14
14
  declare const DrawerTrigger: BaseDrawer.Trigger;
15
15
  declare const DrawerClose: BaseDrawer.Close;
16
16
  export type DrawerOverlayProps = ComponentProps<typeof BaseDrawer.Backdrop>;
17
17
  export type DrawerContentProps = Omit<ComponentProps<typeof BaseDrawer.Popup>, "className"> & {
18
18
  className?: string;
19
19
  };
20
- declare function DrawerContent({ children, className, ref, ...props }: DrawerContentProps): import("react/jsx-runtime").JSX.Element;
20
+ declare function DrawerContent({ children, className, ref, ...props }: DrawerContentProps): import("react").JSX.Element;
21
21
  export type DrawerHeaderProps = ComponentProps<"div">;
22
- declare function DrawerHeader({ className, ref, ...props }: DrawerHeaderProps): import("react/jsx-runtime").JSX.Element;
22
+ declare function DrawerHeader({ className, ref, ...props }: DrawerHeaderProps): import("react").JSX.Element;
23
23
  export type DrawerTitleProps = ComponentProps<typeof BaseDrawer.Title>;
24
- declare function DrawerTitle({ className, ref, ...props }: DrawerTitleProps): import("react/jsx-runtime").JSX.Element;
24
+ declare function DrawerTitle({ className, ref, ...props }: DrawerTitleProps): import("react").JSX.Element;
25
25
  export type DrawerDescriptionProps = ComponentProps<typeof BaseDrawer.Description>;
26
- declare function DrawerDescription({ className, ref, ...props }: DrawerDescriptionProps): import("react/jsx-runtime").JSX.Element;
26
+ declare function DrawerDescription({ className, ref, ...props }: DrawerDescriptionProps): import("react").JSX.Element;
27
27
  export type DrawerFooterProps = ComponentProps<"div">;
28
- declare function DrawerFooter({ className, ref, ...props }: DrawerFooterProps): import("react/jsx-runtime").JSX.Element;
28
+ declare function DrawerFooter({ className, ref, ...props }: DrawerFooterProps): import("react").JSX.Element;
29
29
  export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, };
package/dist/components/dropdown-menu/dropdown-menu.d.ts CHANGED
@@ -1,35 +1,35 @@
1
1
  import { Menu } from "@base-ui/react/menu";
2
2
  import type { ComponentProps } from "react";
3
- declare const DropdownMenu: <Payload>(props: Menu.Root.Props<Payload>) => import("react/jsx-runtime").JSX.Element;
3
+ declare const DropdownMenu: <Payload>(props: Menu.Root.Props<Payload>) => React.JSX.Element;
4
4
  export type DropdownMenuTriggerProps = ComponentProps<typeof Menu.Trigger>;
5
- declare function DropdownMenuTrigger({ className, ref, ...props }: DropdownMenuTriggerProps): import("react/jsx-runtime").JSX.Element;
6
- declare const DropdownMenuGroup: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
7
- declare const DropdownMenuPortal: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuPortalProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
5
+ declare function DropdownMenuTrigger({ className, ref, ...props }: DropdownMenuTriggerProps): import("react").JSX.Element;
6
+ declare const DropdownMenuGroup: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").MenuGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
7
+ declare const DropdownMenuPortal: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").MenuPortalProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
8
8
  declare const DropdownMenuSub: typeof Menu.SubmenuRoot;
9
- declare const DropdownMenuRadioGroup: import("react").NamedExoticComponent<Omit<import("@base-ui/react").ContextMenuRadioGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
9
+ declare const DropdownMenuRadioGroup: import("react").NamedExoticComponent<Omit<import("@base-ui/react").MenuRadioGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
10
10
  export type DropdownMenuSubTriggerProps = ComponentProps<typeof Menu.SubmenuTrigger> & {
11
11
  inset?: boolean;
12
12
  };
13
- declare function DropdownMenuSubTrigger({ className, inset, children, ref, ...props }: DropdownMenuSubTriggerProps): import("react/jsx-runtime").JSX.Element;
13
+ declare function DropdownMenuSubTrigger({ className, inset, children, ref, ...props }: DropdownMenuSubTriggerProps): import("react").JSX.Element;
14
14
  export type DropdownMenuSubContentProps = ComponentProps<typeof Menu.Popup>;
15
- declare function DropdownMenuSubContent({ className, ref, ...props }: DropdownMenuSubContentProps): import("react/jsx-runtime").JSX.Element;
15
+ declare function DropdownMenuSubContent({ className, ref, ...props }: DropdownMenuSubContentProps): import("react").JSX.Element;
16
16
  export type DropdownMenuContentProps = ComponentProps<typeof Menu.Popup> & {
17
17
  sideOffset?: number;
18
18
  };
19
- declare function DropdownMenuContent({ className, sideOffset, ref, ...props }: DropdownMenuContentProps): import("react/jsx-runtime").JSX.Element;
19
+ declare function DropdownMenuContent({ className, sideOffset, ref, ...props }: DropdownMenuContentProps): import("react").JSX.Element;
20
20
  export type DropdownMenuItemProps = ComponentProps<typeof Menu.Item> & {
21
21
  inset?: boolean;
22
22
  };
23
- declare function DropdownMenuItem({ className, inset, ref, ...props }: DropdownMenuItemProps): import("react/jsx-runtime").JSX.Element;
23
+ declare function DropdownMenuItem({ className, inset, ref, ...props }: DropdownMenuItemProps): import("react").JSX.Element;
24
24
  export type DropdownMenuCheckboxItemProps = ComponentProps<typeof Menu.CheckboxItem>;
25
- declare function DropdownMenuCheckboxItem({ className, children, checked, onCheckedChange, ref, ...props }: DropdownMenuCheckboxItemProps): import("react/jsx-runtime").JSX.Element;
25
+ declare function DropdownMenuCheckboxItem({ className, children, checked, onCheckedChange, ref, ...props }: DropdownMenuCheckboxItemProps): import("react").JSX.Element;
26
26
  export type DropdownMenuRadioItemProps = ComponentProps<typeof Menu.RadioItem>;
27
- declare function DropdownMenuRadioItem({ className, children, ref, ...props }: DropdownMenuRadioItemProps): import("react/jsx-runtime").JSX.Element;
27
+ declare function DropdownMenuRadioItem({ className, children, ref, ...props }: DropdownMenuRadioItemProps): import("react").JSX.Element;
28
28
  export type DropdownMenuLabelProps = ComponentProps<typeof Menu.GroupLabel> & {
29
29
  inset?: boolean;
30
30
  };
31
- declare function DropdownMenuLabel({ className, inset, ref, ...props }: DropdownMenuLabelProps): import("react/jsx-runtime").JSX.Element;
31
+ declare function DropdownMenuLabel({ className, inset, ref, ...props }: DropdownMenuLabelProps): import("react").JSX.Element;
32
32
  export type DropdownMenuSeparatorProps = ComponentProps<typeof Menu.Separator>;
33
- declare function DropdownMenuSeparator({ className, ref, ...props }: DropdownMenuSeparatorProps): import("react/jsx-runtime").JSX.Element;
34
- declare function DropdownMenuShortcut({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
33
+ declare function DropdownMenuSeparator({ className, ref, ...props }: DropdownMenuSeparatorProps): import("react").JSX.Element;
34
+ declare function DropdownMenuShortcut({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react").JSX.Element;
35
35
  export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, };
package/dist/components/form-field/form-field.d.ts CHANGED
@@ -18,4 +18,4 @@ export type FormFieldProps = ComponentProps<"div"> & {
18
18
  * </FormField>
19
19
  * ```
20
20
  */
21
- export declare function FormField({ className, children, orientation, disabled, required, error, ref, ...props }: FormFieldProps): import("react/jsx-runtime").JSX.Element | null;
21
+ export declare function FormField({ className, children, orientation, disabled, required, error, ref, ...props }: FormFieldProps): import("react").JSX.Element | null;
package/dist/components/form-field/form-field.js CHANGED
@@ -1,4 +1,4 @@
1
- import { jsxs as _jsxs, Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
1
+ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { FormHelper } from "../form-helper/form-helper.js";
3
3
  import { Label } from "../label/label.js";
4
4
  import { getVariants } from "../../utilities/responsive/responsive.js";
package/dist/components/form-helper/form-helper.d.ts CHANGED
@@ -16,4 +16,4 @@ export type FormHelperProps = ComponentProps<"div"> & {
16
16
  * </FormField>
17
17
  * ```
18
18
  */
19
- export declare function FormHelper({ className, children, error: initialError, disabled: initialDisabled, ref, ...props }: FormHelperProps): import("react/jsx-runtime").JSX.Element;
19
+ export declare function FormHelper({ className, children, error: initialError, disabled: initialDisabled, ref, ...props }: FormHelperProps): import("react").JSX.Element;
package/dist/components/input/input.d.ts CHANGED
@@ -11,5 +11,5 @@ export type InputProps = ComponentProps<"input"> & {
11
11
  * <Input placeholder="Enter your email" id="email" />
12
12
  * ```
13
13
  */
14
- declare function Input({ className, disabled: initialDisabled, required: initialRequired, error: initialError, ref, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
14
+ declare function Input({ className, disabled: initialDisabled, required: initialRequired, error: initialError, ref, ...props }: InputProps): import("react").JSX.Element;
15
15
  export { Input };
package/dist/components/input/input.js CHANGED
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { useFormContext } from "../form-field/form-field-context.js";
3
3
  import { getVariants } from "../../utilities/responsive/responsive.js";
4
4
  const inputStyles = getVariants({
5
- base: "rounded-sm border border-border-input px-3 py-2 text-sm placeholder:text-text-placeholder focus-visible:outline focus-visible:outline-primary-hover",
5
+ base: "rounded-sm border border-border-input bg-surface px-3 py-2 text-sm text-text placeholder:text-text-placeholder focus-visible:outline focus-visible:outline-primary-hover",
6
6
  variants: {
7
7
  error: {
8
8
  true: "border-error",
package/dist/components/input/input.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.js","sourceRoot":"/","sources":["components/input/input.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAQ/D,MAAM,WAAW,GAAG,WAAW,CAAC;IAC/B,IAAI,EAAE,qJAAqJ;IAC3J,QAAQ,EAAE;QACT,KAAK,EAAE;YACN,IAAI,EAAE,cAAc;SACpB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE,iDAAiD;SACvD;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,KAAK,EAAE,IAAI;YACX,QAAQ,EAAE,IAAI;YACd,SAAS,EACR,qEAAqE;SACtE;KACD;CACD,CAAC,CAAC;AAEH;;;;;;;GAOG;AACH,SAAS,KAAK,CAAC,EACd,SAAS,EACT,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,EACzB,KAAK,EAAE,YAAY,EACnB,GAAG,EACH,GAAG,KAAK,EACI;IACZ,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,cAAc,CAAC;QACpD,QAAQ,EAAE,eAAe;QACzB,QAAQ,EAAE,eAAe;QACzB,KAAK,EAAE,YAAY;KACnB,CAAC,CAAC;IACH,OAAO,CACN,gBACC,SAAS,EAAE,WAAW,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EACtD,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,kBACJ,KAAK,KACf,KAAK,EACT,GAAG,EAAE,GAAG,GACP,CACF,CAAC;AACH,CAAC;AAED,OAAO,EAAE,KAAK,EAAE,CAAC","sourcesContent":["import { useFormContext } from \"@components/form-field/form-field-context\";\nimport { getVariants } from \"@utilities/responsive/responsive\";\nimport type { ComponentProps, Ref } from \"react\";\n\nexport type InputProps = ComponentProps<\"input\"> & {\n\terror?: boolean;\n\tref?: Ref<HTMLInputElement>;\n};\n\nconst inputStyles = getVariants({\n\tbase: \"rounded-sm border border-border-input px-3 py-2 text-sm placeholder:text-text-placeholder focus-visible:outline focus-visible:outline-primary-hover\",\n\tvariants: {\n\t\terror: {\n\t\t\ttrue: \"border-error\",\n\t\t},\n\t\tdisabled: {\n\t\t\ttrue: \"disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\terror: true,\n\t\t\tdisabled: true,\n\t\t\tclassName:\n\t\t\t\t\"border-border-input disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t},\n\t],\n});\n\n/**\n * A basic input component with styling.\n *\n * @example\n * ```tsx\n * <Input placeholder=\"Enter your email\" id=\"email\" />\n * ```\n */\nfunction Input({\n\tclassName,\n\tdisabled: initialDisabled,\n\trequired: initialRequired,\n\terror: initialError,\n\tref,\n\t...props\n}: InputProps) {\n\tconst { disabled, required, error } = useFormContext({\n\t\tdisabled: initialDisabled,\n\t\trequired: initialRequired,\n\t\terror: initialError,\n\t});\n\treturn (\n\t\t<input\n\t\t\tclassName={inputStyles({ disabled, error, className })}\n\t\t\tdisabled={disabled}\n\t\t\trequired={required}\n\t\t\taria-invalid={error}\n\t\t\t{...props}\n\t\t\tref={ref}\n\t\t/>\n\t);\n}\n\nexport { Input };\n"]}
1
+ {"version":3,"file":"input.js","sourceRoot":"/","sources":["components/input/input.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAQ/D,MAAM,WAAW,GAAG,WAAW,CAAC;IAC/B,IAAI,EAAE,0KAA0K;IAChL,QAAQ,EAAE;QACT,KAAK,EAAE;YACN,IAAI,EAAE,cAAc;SACpB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE,iDAAiD;SACvD;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,KAAK,EAAE,IAAI;YACX,QAAQ,EAAE,IAAI;YACd,SAAS,EACR,qEAAqE;SACtE;KACD;CACD,CAAC,CAAC;AAEH;;;;;;;GAOG;AACH,SAAS,KAAK,CAAC,EACd,SAAS,EACT,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,EACzB,KAAK,EAAE,YAAY,EACnB,GAAG,EACH,GAAG,KAAK,EACI;IACZ,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,cAAc,CAAC;QACpD,QAAQ,EAAE,eAAe;QACzB,QAAQ,EAAE,eAAe;QACzB,KAAK,EAAE,YAAY;KACnB,CAAC,CAAC;IACH,OAAO,CACN,gBACC,SAAS,EAAE,WAAW,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EACtD,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,kBACJ,KAAK,KACf,KAAK,EACT,GAAG,EAAE,GAAG,GACP,CACF,CAAC;AACH,CAAC;AAED,OAAO,EAAE,KAAK,EAAE,CAAC","sourcesContent":["import { useFormContext } from \"@components/form-field/form-field-context\";\nimport { getVariants } from \"@utilities/responsive/responsive\";\nimport type { ComponentProps, Ref } from \"react\";\n\nexport type InputProps = ComponentProps<\"input\"> & {\n\terror?: boolean;\n\tref?: Ref<HTMLInputElement>;\n};\n\nconst inputStyles = getVariants({\n\tbase: \"rounded-sm border border-border-input bg-surface px-3 py-2 text-sm text-text placeholder:text-text-placeholder focus-visible:outline focus-visible:outline-primary-hover\",\n\tvariants: {\n\t\terror: {\n\t\t\ttrue: \"border-error\",\n\t\t},\n\t\tdisabled: {\n\t\t\ttrue: \"disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\terror: true,\n\t\t\tdisabled: true,\n\t\t\tclassName:\n\t\t\t\t\"border-border-input disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t},\n\t],\n});\n\n/**\n * A basic input component with styling.\n *\n * @example\n * ```tsx\n * <Input placeholder=\"Enter your email\" id=\"email\" />\n * ```\n */\nfunction Input({\n\tclassName,\n\tdisabled: initialDisabled,\n\trequired: initialRequired,\n\terror: initialError,\n\tref,\n\t...props\n}: InputProps) {\n\tconst { disabled, required, error } = useFormContext({\n\t\tdisabled: initialDisabled,\n\t\trequired: initialRequired,\n\t\terror: initialError,\n\t});\n\treturn (\n\t\t<input\n\t\t\tclassName={inputStyles({ disabled, error, className })}\n\t\t\tdisabled={disabled}\n\t\t\trequired={required}\n\t\t\taria-invalid={error}\n\t\t\t{...props}\n\t\t\tref={ref}\n\t\t/>\n\t);\n}\n\nexport { Input };\n"]}
package/dist/components/label/label.d.ts CHANGED
@@ -11,5 +11,5 @@ export type LabelProps = ComponentProps<"label"> & {
11
11
  * <Input id="email" />
12
12
  * ```
13
13
  */
14
- declare function Label({ className, required: initialRequired, children, ref, ...props }: LabelProps): import("react/jsx-runtime").JSX.Element;
14
+ declare function Label({ className, required: initialRequired, children, ref, ...props }: LabelProps): import("react").JSX.Element;
15
15
  export { Label };