asheeui 0.6.8 → 0.6.9

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 (107) hide show
  1. package/dist/components/autocomplete/Autocomplete.d.ts +34 -17
  2. package/dist/components/autocomplete/Autocomplete.d.ts.map +1 -1
  3. package/dist/components/autocomplete/Autocomplete.js +86 -102
  4. package/dist/components/autocomplete/autocomplete-config.d.ts +2 -20
  5. package/dist/components/autocomplete/autocomplete-config.d.ts.map +1 -1
  6. package/dist/components/autocomplete/autocomplete-config.js +9 -13
  7. package/dist/components/button/Button.d.ts +31 -5
  8. package/dist/components/button/Button.d.ts.map +1 -1
  9. package/dist/components/button/Button.js +68 -64
  10. package/dist/components/card/Card.d.ts +58 -54
  11. package/dist/components/card/Card.d.ts.map +1 -1
  12. package/dist/components/card/Card.js +152 -158
  13. package/dist/components/card/card-config.d.ts +66 -33
  14. package/dist/components/card/card-config.d.ts.map +1 -1
  15. package/dist/components/card/card-config.js +9 -9
  16. package/dist/components/date-picker/Calendar.d.ts +57 -0
  17. package/dist/components/date-picker/Calendar.d.ts.map +1 -0
  18. package/dist/components/date-picker/Calendar.js +224 -0
  19. package/dist/components/date-picker/DatePicker.d.ts +68 -155
  20. package/dist/components/date-picker/DatePicker.d.ts.map +1 -1
  21. package/dist/components/date-picker/DatePicker.js +194 -466
  22. package/dist/components/date-picker/TimeSpinner.d.ts +46 -0
  23. package/dist/components/date-picker/TimeSpinner.d.ts.map +1 -0
  24. package/dist/components/date-picker/TimeSpinner.js +84 -0
  25. package/dist/components/date-picker/date-picker-config.d.ts +21 -1
  26. package/dist/components/date-picker/date-picker-config.d.ts.map +1 -1
  27. package/dist/components/date-picker/date-picker-config.js +10 -14
  28. package/dist/components/date-picker/date-picker-styles.d.ts.map +1 -1
  29. package/dist/components/date-picker/date-picker-styles.js +4 -11
  30. package/dist/components/date-picker/date-picker.helpers.d.ts +111 -0
  31. package/dist/components/date-picker/date-picker.helpers.d.ts.map +1 -0
  32. package/dist/components/date-picker/date-picker.helpers.js +110 -0
  33. package/dist/components/date-picker/index.js +3 -0
  34. package/dist/components/input/Input.d.ts +13 -7
  35. package/dist/components/input/Input.d.ts.map +1 -1
  36. package/dist/components/input/Input.js +96 -91
  37. package/dist/components/keyboard/KeyboardContext.d.ts +130 -0
  38. package/dist/components/keyboard/KeyboardContext.d.ts.map +1 -0
  39. package/dist/components/keyboard/KeyboardContext.js +13 -0
  40. package/dist/components/keyboard/KeyboardProvider.d.ts +78 -0
  41. package/dist/components/keyboard/KeyboardProvider.d.ts.map +1 -0
  42. package/dist/components/keyboard/KeyboardProvider.js +183 -0
  43. package/dist/components/keyboard/OnScreenKeyboard.d.ts +65 -43
  44. package/dist/components/keyboard/OnScreenKeyboard.d.ts.map +1 -1
  45. package/dist/components/keyboard/OnScreenKeyboard.js +119 -113
  46. package/dist/components/keyboard/index.d.ts +2 -1
  47. package/dist/components/keyboard/index.d.ts.map +1 -1
  48. package/dist/components/keyboard/index.js +2 -1
  49. package/dist/components/keyboard/keyboard-config.d.ts +40 -36
  50. package/dist/components/keyboard/keyboard-config.d.ts.map +1 -1
  51. package/dist/components/keyboard/keyboard-config.js +15 -10
  52. package/dist/components/keyboard/use-keyboard-field.d.ts +6 -4
  53. package/dist/components/keyboard/use-keyboard-field.d.ts.map +1 -1
  54. package/dist/components/keyboard/use-keyboard-field.js +12 -12
  55. package/dist/components/multi-select/MultiSelect.d.ts +75 -40
  56. package/dist/components/multi-select/MultiSelect.d.ts.map +1 -1
  57. package/dist/components/multi-select/MultiSelect.js +188 -188
  58. package/dist/components/multi-select/multi-select-config.d.ts +2 -20
  59. package/dist/components/multi-select/multi-select-config.d.ts.map +1 -1
  60. package/dist/components/multi-select/multi-select-config.js +10 -14
  61. package/dist/components/select/Select.d.ts +60 -45
  62. package/dist/components/select/Select.d.ts.map +1 -1
  63. package/dist/components/select/Select.js +147 -159
  64. package/dist/components/select/select-config.d.ts +3 -29
  65. package/dist/components/select/select-config.d.ts.map +1 -1
  66. package/dist/components/select/select-config.js +6 -14
  67. package/dist/components/select/select-styles.js +1 -6
  68. package/dist/components/select-menu/SelectMenu.d.ts +45 -30
  69. package/dist/components/select-menu/SelectMenu.d.ts.map +1 -1
  70. package/dist/components/select-menu/SelectMenu.js +125 -124
  71. package/dist/components/select-menu/select-menu-config.d.ts +25 -2
  72. package/dist/components/select-menu/select-menu-config.d.ts.map +1 -1
  73. package/dist/components/select-menu/select-menu-config.js +4 -3
  74. package/dist/components/switch/Switch.d.ts +9 -33
  75. package/dist/components/switch/Switch.d.ts.map +1 -1
  76. package/dist/components/switch/Switch.js +68 -74
  77. package/dist/components/switch/switch-styles.d.ts +1 -6
  78. package/dist/components/switch/switch-styles.d.ts.map +1 -1
  79. package/dist/components/switch/switch-styles.js +6 -12
  80. package/dist/components/textarea/Textarea.d.ts +19 -1
  81. package/dist/components/textarea/Textarea.d.ts.map +1 -1
  82. package/dist/components/textarea/Textarea.js +95 -90
  83. package/dist/components/toast/ToastContext.d.ts +122 -0
  84. package/dist/components/toast/ToastContext.d.ts.map +1 -0
  85. package/dist/components/toast/ToastContext.js +28 -0
  86. package/dist/components/toast/ToastProvider.d.ts +98 -0
  87. package/dist/components/toast/ToastProvider.d.ts.map +1 -0
  88. package/dist/components/toast/ToastProvider.js +188 -0
  89. package/dist/components/toast/index.d.ts +2 -1
  90. package/dist/components/toast/index.d.ts.map +1 -1
  91. package/dist/components/toast/index.js +2 -1
  92. package/dist/components/toast/toast-config.d.ts +36 -0
  93. package/dist/components/toast/toast-config.d.ts.map +1 -1
  94. package/dist/icons/ChevronUpIcon.d.ts +3 -0
  95. package/dist/icons/ChevronUpIcon.d.ts.map +1 -0
  96. package/dist/icons/ChevronUpIcon.js +21 -0
  97. package/dist/icons/index.d.ts +2 -0
  98. package/dist/icons/index.d.ts.map +1 -1
  99. package/dist/index.js +62 -59
  100. package/dist/theme/color.js +2 -2
  101. package/package.json +1 -1
  102. package/dist/components/keyboard/keyboard-context.d.ts +0 -118
  103. package/dist/components/keyboard/keyboard-context.d.ts.map +0 -1
  104. package/dist/components/keyboard/keyboard-context.js +0 -90
  105. package/dist/components/toast/toast-context.d.ts +0 -163
  106. package/dist/components/toast/toast-context.d.ts.map +0 -1
  107. package/dist/components/toast/toast-context.js +0 -177
@@ -1,11 +1,18 @@
1
1
  import { ReactNode } from 'react';
2
- import { SelectMenuOption } from '../select-menu/select-menu-config';
2
+ import { InputProps } from '../input/Input';
3
+ import { MenuConfig, SelectMenuOption } from '../select-menu/select-menu-config';
3
4
  import { SelectConfig } from './select-config';
4
- type BaseSelectProps = SelectConfig & Omit<React.SelectHTMLAttributes<HTMLSelectElement>, "color" | "size" | "value" | "onChange">;
5
+ /**
6
+ * Field-related props that Select inherits from Input.
7
+ * Picked to avoid conflicts with Button-specific props.
8
+ */
9
+ type SelectFieldProps = Pick<InputProps, "label" | "description" | "message" | "required" | "isLoading" | "status" | "labelAlign" | "className" | "id" | "style">;
5
10
  /**
6
11
  * Configuration options for the Select component.
12
+ * Extends field props from Input, and SelectConfig for
13
+ * component-specific options. Uses Button for trigger styling.
7
14
  */
8
- export interface SelectProps extends BaseSelectProps {
15
+ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"> {
9
16
  /**
10
17
  * Available options to select from.
11
18
  * Each option must have a label and a unique value.
@@ -25,40 +32,21 @@ export interface SelectProps extends BaseSelectProps {
25
32
  * Receives the new selected value directly.
26
33
  */
27
34
  onValueChange?: (value: string | number) => void;
28
- /**
29
- * Label text for the field.
30
- */
31
- label?: string;
32
- /**
33
- * Description text shown below the label.
34
- */
35
- description?: string;
36
- /**
37
- * Validation message shown below the field.
38
- */
39
- message?: string;
40
- /**
41
- * Whether the field is required.
42
- * @default false
43
- */
44
- required?: boolean;
45
- /**
46
- * Whether the field is in a loading state.
47
- * @default false
48
- */
49
- isLoading?: boolean;
50
35
  /**
51
36
  * Whether search input is shown in the dropdown.
37
+ *
52
38
  * @default false
53
39
  */
54
40
  isSearch?: boolean;
55
41
  /**
56
42
  * Placeholder text for the search input.
43
+ *
57
44
  * @default "Search options..."
58
45
  */
59
46
  searchPlaceholder?: string;
60
47
  /**
61
48
  * Name attribute for the search input.
49
+ *
62
50
  * @default "select-search"
63
51
  */
64
52
  searchInputName?: string;
@@ -68,46 +56,59 @@ export interface SelectProps extends BaseSelectProps {
68
56
  initialValue?: string | number;
69
57
  /**
70
58
  * Content rendered below the options list.
59
+ * Useful for adding "Add new" buttons or status messages.
71
60
  */
72
61
  belowList?: ReactNode;
73
62
  /**
74
63
  * Placeholder text shown when no value is selected.
64
+ *
75
65
  * @default "Select..."
76
66
  */
77
67
  placeholder?: string;
78
68
  /**
79
- * Extra CSS classes for the trigger button.
69
+ * Name attribute for the select.
70
+ */
71
+ name?: string;
72
+ /**
73
+ * Content rendered at the start of the button.
74
+ * Typically an icon or adornment.
80
75
  */
81
- className?: string;
76
+ startContent?: ReactNode;
82
77
  /**
83
- * Extra CSS classes for the dropdown.
78
+ * Content rendered at the end of the button.
79
+ * Typically an icon, badge, or adornment.
84
80
  */
85
- dropdownClassName?: string;
81
+ endContent?: ReactNode;
86
82
  /**
87
- * Optional ID for the field.
83
+ * Whether the select is disabled.
84
+ *
85
+ * @default false
88
86
  */
89
- id?: string;
87
+ disabled?: boolean;
90
88
  /**
91
- * Name attribute for the select.
89
+ * Menu configuration overrides including portal, portalTarget, className, and visual styles.
90
+ * All menu-related props should be passed through this object.
92
91
  */
93
- name?: string;
92
+ menu?: MenuConfig;
94
93
  }
95
94
  /**
96
95
  * A dropdown selector with search, label, validation, and configurable styles.
97
96
  *
98
97
  * Select renders a dropdown that allows selecting a single option from a list.
99
98
  * It supports search filtering, controlled and uncontrolled selection state,
100
- * validation states, and custom menu and trigger styles. Visual tokens resolve
101
- * through the standard AsheeUI cascade system.
99
+ * validation states, custom menu and trigger styles, and start/end content
100
+ * slots. Visual tokens resolve through the standard AsheeUI cascade system.
102
101
  *
103
- * The component uses Floating UI for positioning and accessibility, and
104
- * integrates with the FieldShell for consistent label and validation handling.
102
+ * The component uses a Button component as the trigger, which provides
103
+ * consistent button styling and behavior. It integrates with FieldShell for
104
+ * label, description, and message handling, and uses Floating UI for
105
+ * positioning and accessibility.
105
106
  *
106
107
  * By default, the dropdown menu uses React's createPortal to render at the
107
108
  * document body level. This ensures the menu escapes CSS containment, overflow
108
109
  * clipping, and stacking context issues. The portal can be disabled via the
109
- * `portal` prop or `components.select.portal` in the config if the menu needs
110
- * to stay within a specific parent container.
110
+ * `menu.portal` prop or `components.select.menu.portal` in the config if the
111
+ * menu needs to stay within a specific parent container.
111
112
  *
112
113
  * @param props - Select configuration options.
113
114
  * @param props.options - Available options to select from.
@@ -117,11 +118,12 @@ export interface SelectProps extends BaseSelectProps {
117
118
  * @param props.label - Field label text.
118
119
  * @param props.description - Description text.
119
120
  * @param props.message - Validation message.
120
- * @param props.required - Whether the field is required.
121
- * @param props.isLoading - Loading state.
122
- * @param props.disabled - Disabled state.
121
+ * @param props.required - Whether the field is required. Defaults to false.
122
+ * @param props.isLoading - Loading state. Defaults to false.
123
+ * @param props.disabled - Disabled state. Defaults to false.
123
124
  * @param props.isSearch - Whether search is enabled. Defaults to false.
124
125
  * @param props.searchPlaceholder - Search placeholder. Defaults to "Search options...".
126
+ * @param props.searchInputName - Name attribute for the search input. Defaults to "select-search".
125
127
  * @param props.initialValue - Initial value for uncontrolled usage.
126
128
  * @param props.belowList - Content below the options list.
127
129
  * @param props.placeholder - Placeholder text. Defaults to "Select...".
@@ -131,8 +133,12 @@ export interface SelectProps extends BaseSelectProps {
131
133
  * @param props.color - Theme accent color. Defaults to "primary".
132
134
  * @param props.status - Validation status.
133
135
  * @param props.labelAlign - Alignment of the label. Defaults to "left".
134
- * @param props.portal - Whether to render the dropdown in a portal. Defaults to true.
135
- * @param props.portalTarget - Custom portal target element. Defaults to document.body.
136
+ * @param props.startContent - Content at the start of the trigger button.
137
+ * @param props.endContent - Content at the end of the trigger button.
138
+ * @param props.menu - Menu configuration overrides including className, portal, portalTarget, and visual styles.
139
+ * @param props.name - Name attribute for the select.
140
+ * @param props.className - Extra classes for the trigger button.
141
+ * @param props.id - HTML id attribute.
136
142
  *
137
143
  * @example
138
144
  * ```tsx
@@ -162,7 +168,7 @@ export interface SelectProps extends BaseSelectProps {
162
168
  *
163
169
  * @example
164
170
  * ```tsx
165
- * // With search and validation
171
+ * // With search, validation, and menu configuration
166
172
  * <Select
167
173
  * options={fruits}
168
174
  * label="Favorite Fruit"
@@ -170,10 +176,19 @@ export interface SelectProps extends BaseSelectProps {
170
176
  * status="error"
171
177
  * message="Please select a fruit"
172
178
  * required
179
+ * startContent={<FruitIcon />}
180
+ * menu={{
181
+ * className: "custom-dropdown",
182
+ * portal: false,
183
+ * itemVariant: "solid",
184
+ * activeItemColor: "success"
185
+ * }}
173
186
  * />
174
187
  * ```
175
188
  *
176
189
  * @see SelectConfig - The configuration type for component defaults.
190
+ * @see Input - The input component that provides field capabilities.
191
+ * @see Button - The button component used as the trigger.
177
192
  * @see SelectMenu - The dropdown menu component.
178
193
  * @see FieldShell - The wrapper component for label and validation.
179
194
  */
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAmBf,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAC1E,OAAO,EAA0B,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAK5E,KAAK,eAAe,GAAG,YAAY,GACjC,IAAI,CACF,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,CACxC,CAAC;AAEJ;;GAEG;AACH,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD;;;OAGG;IACH,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAE5B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE7D;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEjD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,eAAO,MAAM,MAAM,2GAsPlB,CAAC"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAGjD,OAAO,KAAK,EACV,UAAU,EACV,gBAAgB,EACjB,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAA0B,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAK5E;;;GAGG;AACH,KAAK,gBAAgB,GAAG,IAAI,CAC1B,UAAU,EACR,OAAO,GACP,aAAa,GACb,SAAS,GACT,UAAU,GACV,WAAW,GACX,QAAQ,GACR,YAAY,GACZ,WAAW,GACX,IAAI,GACJ,OAAO,CACV,CAAC;AAEF;;;;GAIG;AACH,MAAM,WAAW,WACf,SAAQ,gBAAgB,EACtB,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAE5B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE7D;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEjD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoGG;AACH,eAAO,MAAM,MAAM,2GAyPlB,CAAC"}
@@ -1,197 +1,185 @@
1
1
  "use client";
2
- import { jsx as f, jsxs as T } from "react/jsx-runtime";
3
- import { useClick as ye, useDismiss as xe, useRole as Ae, useInteractions as Re } from "@floating-ui/react";
4
- import { forwardRef as ge, useId as he, useState as I, useMemo as b, useCallback as Le } from "react";
5
- import { ChevronDownIcon as Te } from "../../icons/ChevronDownIcon.js";
2
+ import { jsx as l, jsxs as g, Fragment as pe } from "react/jsx-runtime";
3
+ import { useClick as ve, useDismiss as Se, useRole as be, useInteractions as ye } from "@floating-ui/react";
4
+ import { forwardRef as he, useId as xe, useState as k, useMemo as h, useCallback as Re } from "react";
5
+ import { ChevronDownIcon as Ae } from "../../icons/ChevronDownIcon.js";
6
6
  import { useAsheeConfig as Ie } from "../../libs/context.js";
7
- import { resolveCascade as l, resolveRadiusKey as Ee, resolveClassKey as _e } from "../../utils/resolve-token.js";
8
- import { FieldShell as Fe } from "../field/FieldShell.js";
9
- import { SelectMenu as Ke } from "../select-menu/SelectMenu.js";
10
- import { FALLBACK_SELECT_CONFIG as t } from "./select-config.js";
11
- import { SELECT_STATUS_BORDER_CLASS as ke, SELECT_SIZE_CLASS as we } from "./select-styles.js";
12
- import { resolveVariantClass as Ne } from "../../shared/variant.js";
13
- import { RADIUS_CLASS as Oe } from "../../shared/radius.js";
14
- import { useSelectFloating as Pe } from "../select-menu/use-select-floating.js";
15
- import { cn as E } from "../../utils/cn.js";
16
- const De = ge(
7
+ import { resolveCascade as p, resolveRadiusKey as Fe } from "../../utils/resolve-token.js";
8
+ import { Button as Ke } from "../button/Button.js";
9
+ import { FieldShell as Le } from "../field/FieldShell.js";
10
+ import { SelectMenu as Ne } from "../select-menu/SelectMenu.js";
11
+ import { FALLBACK_SELECT_CONFIG as o } from "./select-config.js";
12
+ import { SELECT_STATUS_BORDER_CLASS as Oe } from "./select-styles.js";
13
+ import { useSelectFloating as ge } from "../select-menu/use-select-floating.js";
14
+ import { cn as x } from "../../utils/cn.js";
15
+ const ke = he(
17
16
  ({
18
- options: p = [],
19
- value: s,
17
+ options: v = [],
18
+ value: r,
20
19
  onChange: S,
21
20
  onValueChange: a,
22
- size: _,
23
- radius: F,
24
- variant: K,
25
- color: k,
26
- status: w,
27
- label: N,
28
- labelAlign: O,
29
- description: P,
30
- message: D,
21
+ size: E,
22
+ radius: _,
23
+ variant: j,
24
+ color: w,
25
+ status: z,
26
+ label: B,
27
+ labelAlign: D,
28
+ description: b,
29
+ message: R,
31
30
  required: M,
32
- isLoading: j,
33
- disabled: v,
34
- isSearch: z = !1,
35
- searchPlaceholder: C = "Search options...",
36
- searchInputName: B = "select-search",
31
+ isLoading: A,
32
+ disabled: y,
33
+ isSearch: P = !1,
34
+ searchPlaceholder: T = "Search options...",
35
+ searchInputName: $ = "select-search",
37
36
  initialValue: n,
38
37
  belowList: Q,
39
- placeholder: y = "Select...",
40
- className: U,
41
- dropdownClassName: G,
42
- id: Z,
43
- name: x,
44
- menu: q,
45
- portal: H,
46
- portalTarget: J,
47
- style: W
38
+ placeholder: I = "Select...",
39
+ className: G,
40
+ id: U,
41
+ name: F,
42
+ menu: W,
43
+ style: q,
44
+ startContent: H,
45
+ endContent: J
48
46
  }, i) => {
49
- var L;
50
- const c = Ie(), e = (L = c.components) == null ? void 0 : L.select, X = he(), Y = Z ?? X, [d, A] = I(!1), [$, R] = I(""), V = l(
51
- _,
47
+ var O;
48
+ const c = Ie(), e = (O = c.components) == null ? void 0 : O.select, X = xe(), d = U ?? X, [u, K] = k(!1), [Y, L] = k(""), Z = p(
49
+ E,
52
50
  e == null ? void 0 : e.size,
53
51
  void 0,
54
- t.size
55
- ), g = l(
56
- K,
52
+ o.size
53
+ ), C = p(
54
+ j,
57
55
  e == null ? void 0 : e.variant,
58
56
  c.defaultVariant,
59
- t.variant
60
- ), ee = l(
61
- k,
57
+ o.variant
58
+ ), V = p(
59
+ w,
62
60
  e == null ? void 0 : e.color,
63
61
  c.defaultColor,
64
- t.color
65
- ), te = Ee(
66
- F,
62
+ o.color
63
+ ), ee = Fe(
64
+ _,
67
65
  e == null ? void 0 : e.radius,
68
66
  c.defaultRadius,
69
- t.radius
70
- ), u = w ?? t.status, re = l(
71
- O,
67
+ o.radius
68
+ ), m = z ?? o.status, te = p(
69
+ D,
72
70
  e == null ? void 0 : e.labelAlign,
73
71
  void 0,
74
- t.labelAlign
75
- ), se = l(
76
- H,
77
- e == null ? void 0 : e.portal,
78
- void 0,
79
- t.portal
80
- ), oe = l(
81
- J,
82
- e == null ? void 0 : e.portalTarget,
83
- void 0,
84
- t.portalTarget
85
- ), le = Ne(
86
- g,
87
- ee
88
- ), ae = u !== "default" ? ke[u] : "", ne = g === "underlined" ? "rounded-none" : _e(
89
- te,
90
- Oe,
91
- t.radius
92
- ), o = b(
93
- () => p.find((r) => r.value === s),
94
- [p, s]
95
- ), { refs: h, floatingStyles: ie, context: m } = Pe({
96
- isOpen: d,
97
- onOpenChange: A,
98
- disabled: v
99
- }), ce = ye(m, { enabled: !v }), de = xe(m), ue = Ae(m, { role: "listbox" }), { getReferenceProps: me, getFloatingProps: fe } = Re([
100
- ce,
101
- de,
102
- ue
103
- ]), pe = Le(
104
- (r) => {
105
- if (a == null || a(r.value), S) {
106
- const be = {
107
- target: { value: r.value, name: x ?? "" }
72
+ o.labelAlign
73
+ ), re = m !== "default" ? Oe[m] : "", s = h(
74
+ () => v.find((t) => t.value === r),
75
+ [v, r]
76
+ ), { refs: N, floatingStyles: se, context: f } = ge({
77
+ isOpen: u,
78
+ onOpenChange: K,
79
+ disabled: y
80
+ }), oe = ve(f, { enabled: !y }), le = Se(f), ae = be(f, { role: "listbox" }), { getReferenceProps: ne, getFloatingProps: ie } = ye([
81
+ oe,
82
+ le,
83
+ ae
84
+ ]), ce = Re(
85
+ (t) => {
86
+ if (a == null || a(t.value), S) {
87
+ const fe = {
88
+ target: { value: t.value, name: F ?? "" }
108
89
  };
109
- S(be);
90
+ S(fe);
110
91
  }
111
- A(!1), R("");
92
+ K(!1), L("");
112
93
  },
113
- [x, S, a]
114
- ), Se = b(() => o != null && o.label ? o.label : n !== void 0 ? String(n) : y, [o, n, y]), ve = b(
115
- () => s != null ? [s] : [],
116
- [s]
117
- );
118
- return /* @__PURE__ */ f(
119
- Fe,
94
+ [F, S, a]
95
+ ), de = h(() => s != null && s.label ? s.label : n !== void 0 ? String(n) : I, [s, n, I]), ue = h(
96
+ () => r != null ? [r] : [],
97
+ [r]
98
+ ), me = ne();
99
+ return /* @__PURE__ */ l(
100
+ Le,
120
101
  {
121
- id: Y,
122
- label: N,
123
- labelAlign: re,
124
- description: P,
125
- message: D,
126
- status: u,
102
+ id: d,
103
+ label: B,
104
+ labelAlign: te,
105
+ description: b,
106
+ descriptionId: b ? `${d}-description` : void 0,
107
+ message: R,
108
+ messageId: R ? `${d}-message` : void 0,
109
+ status: m,
127
110
  required: M,
128
- isLoading: j,
129
- children: /* @__PURE__ */ T("div", { className: "w-full relative inline-block", children: [
130
- /* @__PURE__ */ T(
131
- "button",
111
+ isLoading: A,
112
+ children: /* @__PURE__ */ g("div", { className: "w-full relative inline-block", children: [
113
+ /* @__PURE__ */ l(
114
+ Ke,
132
115
  {
133
- ref: (r) => {
134
- h.setReference(r), typeof i == "function" ? i(r) : i && (i.current = r);
116
+ ref: (t) => {
117
+ N.setReference(t), typeof i == "function" ? i(t) : i && (i.current = t);
135
118
  },
136
119
  type: "button",
137
- disabled: v,
138
- "aria-expanded": d,
120
+ variant: C,
121
+ color: V,
122
+ animate: !1,
123
+ size: Z,
124
+ radius: ee,
125
+ isDisabled: y,
126
+ isLoading: A,
127
+ fullWidth: !0,
128
+ "aria-expanded": u,
139
129
  "aria-haspopup": "listbox",
140
- "aria-invalid": u === "error",
141
- className: E(
142
- "w-full flex items-center justify-between font-normal text-left text-foreground transition-colors outline-none select-none cursor-pointer shrink-0",
143
- "focus-visible:ring-2 focus-visible:ring-offset-2",
144
- "disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed",
145
- we[V],
146
- le,
147
- ae,
148
- ne,
149
- U
130
+ "aria-invalid": m === "error",
131
+ "aria-describedby": [b ? `${d}-description` : void 0].filter(Boolean).join(" ") || void 0,
132
+ className: x(
133
+ "font-normal text-left justify-between",
134
+ re,
135
+ G
150
136
  ),
151
- style: W,
152
- ...me(),
153
- children: [
154
- /* @__PURE__ */ f(
155
- "span",
156
- {
157
- className: o || n ? "text-foreground" : "text-foreground/70",
158
- children: Se
159
- }
160
- ),
161
- /* @__PURE__ */ f(
162
- Te,
137
+ style: q,
138
+ startContent: H,
139
+ endContent: /* @__PURE__ */ g(pe, { children: [
140
+ J,
141
+ /* @__PURE__ */ l(
142
+ Ae,
163
143
  {
164
- className: E(
165
- "ml-2 shrink-0 text-foreground/70 transition-transform duration-200",
166
- d && "rotate-180"
144
+ className: x(
145
+ "shrink-0 text-foreground/70 transition-transform duration-200",
146
+ u && "rotate-180"
167
147
  )
168
148
  }
169
149
  )
170
- ]
150
+ ] }),
151
+ ...me,
152
+ children: /* @__PURE__ */ l(
153
+ "span",
154
+ {
155
+ className: x(
156
+ "truncate",
157
+ s || n ? "text-foreground" : "text-foreground/70"
158
+ ),
159
+ children: de
160
+ }
161
+ )
171
162
  }
172
163
  ),
173
- /* @__PURE__ */ f(
174
- Ke,
164
+ /* @__PURE__ */ l(
165
+ Ne,
175
166
  {
176
- isOpen: d,
177
- context: m,
178
- floatingStyles: ie,
179
- getFloatingProps: fe,
180
- setFloatingRef: h.setFloating,
181
- options: p,
182
- selectedValues: ve,
183
- onSelectMenuOption: pe,
184
- isSearch: z,
185
- searchPlaceholder: C,
186
- searchInputName: B,
187
- searchQuery: $,
188
- onSearchChange: R,
167
+ isOpen: u,
168
+ context: f,
169
+ floatingStyles: se,
170
+ getFloatingProps: ie,
171
+ setFloatingRef: N.setFloating,
172
+ options: v,
173
+ selectedValues: ue,
174
+ onSelectMenuOption: ce,
175
+ isSearch: P,
176
+ searchPlaceholder: T,
177
+ searchInputName: $,
178
+ searchQuery: Y,
179
+ onSearchChange: L,
189
180
  belowList: Q,
190
- dropdownClassName: G,
191
- menuProps: q,
192
- menuConfig: e,
193
- portal: se,
194
- portalTarget: oe
181
+ menuProps: W,
182
+ menuConfig: e == null ? void 0 : e.menu
195
183
  }
196
184
  )
197
185
  ] })
@@ -199,7 +187,7 @@ const De = ge(
199
187
  );
200
188
  }
201
189
  );
202
- De.displayName = "Select";
190
+ ke.displayName = "Select";
203
191
  export {
204
- De as Select
192
+ ke as Select
205
193
  };
@@ -1,5 +1,5 @@
1
1
  import { FieldConfig } from '../field/field-config';
2
- import { SelectMenuConfig } from '../select-menu';
2
+ import { MenuConfig } from '../select-menu';
3
3
  /**
4
4
  * Theme configuration options for the Select component.
5
5
  *
@@ -12,23 +12,7 @@ export interface SelectConfig extends FieldConfig {
12
12
  * Configuration for the dropdown menu.
13
13
  * Controls the menu's visual appearance and behavior.
14
14
  */
15
- menu?: SelectMenuConfig;
16
- /**
17
- * Whether to render the dropdown menu in a React portal.
18
- * When true, the menu is rendered at the document body level,
19
- * escaping any parent DOM hierarchy. This prevents CSS containment
20
- * and stacking context issues. Defaults to true because dropdowns
21
- * should always appear above other content.
22
- *
23
- * @default true
24
- */
25
- portal?: boolean;
26
- /**
27
- * Custom portal target element for the dropdown menu.
28
- * When portal is enabled, the menu is rendered into this element.
29
- * Defaults to document.body.
30
- */
31
- portalTarget?: HTMLElement | null;
15
+ menu?: MenuConfig;
32
16
  }
33
17
  /**
34
18
  * Default config values registered for the Select component.
@@ -41,17 +25,7 @@ export declare const defaultSelectConfig: SelectConfig;
41
25
  * These values are used when instance props, component config,
42
26
  * and global defaults are all undefined.
43
27
  */
44
- export declare const FALLBACK_SELECT_CONFIG: {
45
- readonly portal: true;
46
- readonly portalTarget: null;
47
- readonly size: import('../field').FieldSizeKey;
48
- readonly radius: import('../..').Radius;
49
- readonly variant: import('../..').Variant;
50
- readonly color: import('../..').Color;
51
- readonly labelAlign: import('../field').LabelAlign;
52
- readonly fullWidth: boolean;
53
- readonly status: import('../field').FieldStatus;
54
- };
28
+ export declare const FALLBACK_SELECT_CONFIG: Required<FieldConfig>;
55
29
  declare module "../../libs/registry" {
56
30
  interface ComponentTypeConfigRegistry {
57
31
  select: SelectConfig;
@@ -1 +1 @@
1
- {"version":3,"file":"select-config.d.ts","sourceRoot":"","sources":["../../../src/components/select/select-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD;;;;;;GAMG;AACH,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IAExB;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CACnC;AAED;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,YAIjC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;CAIzB,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,MAAM,EAAE,YAAY,CAAC;KACtB;CACF"}
1
+ {"version":3,"file":"select-config.d.ts","sourceRoot":"","sources":["../../../src/components/select/select-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,YAAiC,CAAC;AAEpE;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,uBAAwB,CAAC;AAE5D,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,MAAM,EAAE,YAAY,CAAC;KACtB;CACF"}
@@ -1,17 +1,9 @@
1
1
  "use client";
2
- import { registerComponentDefaults as t } from "../../libs/registry.js";
3
- import { FALLBACK_FIELD_CONFIG as e, defaultFieldConfig as l } from "../field/field-config.js";
4
- const o = {
5
- ...l,
6
- portal: !0,
7
- portalTarget: null
8
- }, n = {
9
- ...e,
10
- portal: !0,
11
- portalTarget: null
12
- };
13
- t("select", o);
2
+ import { registerComponentDefaults as e } from "../../libs/registry.js";
3
+ import { FALLBACK_FIELD_CONFIG as t, defaultFieldConfig as o } from "../field/field-config.js";
4
+ const C = o, l = t;
5
+ e("select", C);
14
6
  export {
15
- n as FALLBACK_SELECT_CONFIG,
16
- o as defaultSelectConfig
7
+ l as FALLBACK_SELECT_CONFIG,
8
+ C as defaultSelectConfig
17
9
  };
@@ -1,11 +1,6 @@
1
1
  "use client";
2
2
  import { FIELD_STATUS_BORDER_CLASS as S } from "../field/field-styles.js";
3
- const x = {
4
- sm: "h-8 px-2.5 text-xs",
5
- md: "h-10 px-3 text-sm",
6
- lg: "h-12 px-4 text-base"
7
- }, E = S;
3
+ const E = S;
8
4
  export {
9
- x as SELECT_SIZE_CLASS,
10
5
  E as SELECT_STATUS_BORDER_CLASS
11
6
  };