@mieweb/ui 0.1.1 → 0.2.0

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.
@@ -1,19 +1,23 @@
1
1
  'use strict';
2
2
 
3
- var chunk6DP6RKUA_cjs = require('../chunk-6DP6RKUA.cjs');
3
+ var chunkCLJZHS7Y_cjs = require('../chunk-CLJZHS7Y.cjs');
4
+ var chunkP52GA3GJ_cjs = require('../chunk-P52GA3GJ.cjs');
4
5
  var chunkS6UNPMAS_cjs = require('../chunk-S6UNPMAS.cjs');
5
6
  var chunkSWV5E75F_cjs = require('../chunk-SWV5E75F.cjs');
6
7
  var chunkZ3TFPXVN_cjs = require('../chunk-Z3TFPXVN.cjs');
7
8
  var chunkFFJVCQ5R_cjs = require('../chunk-FFJVCQ5R.cjs');
8
9
  var chunk4LNS5QDP_cjs = require('../chunk-4LNS5QDP.cjs');
9
10
  var chunkO5HS7ZND_cjs = require('../chunk-O5HS7ZND.cjs');
10
- var chunkP52GA3GJ_cjs = require('../chunk-P52GA3GJ.cjs');
11
11
 
12
12
 
13
13
 
14
14
  Object.defineProperty(exports, "brands", {
15
15
  enumerable: true,
16
- get: function () { return chunk6DP6RKUA_cjs.brands; }
16
+ get: function () { return chunkCLJZHS7Y_cjs.brands; }
17
+ });
18
+ Object.defineProperty(exports, "enterpriseHealthBrand", {
19
+ enumerable: true,
20
+ get: function () { return chunkP52GA3GJ_cjs.enterpriseHealthBrand; }
17
21
  });
18
22
  Object.defineProperty(exports, "miewebBrand", {
19
23
  enumerable: true,
@@ -47,9 +51,5 @@ Object.defineProperty(exports, "defaultBrand", {
47
51
  enumerable: true,
48
52
  get: function () { return chunkO5HS7ZND_cjs.defaultBrand; }
49
53
  });
50
- Object.defineProperty(exports, "enterpriseHealthBrand", {
51
- enumerable: true,
52
- get: function () { return chunkP52GA3GJ_cjs.enterpriseHealthBrand; }
53
- });
54
54
  //# sourceMappingURL=index.cjs.map
55
55
  //# sourceMappingURL=index.cjs.map
@@ -1,10 +1,10 @@
1
- export { brands } from '../chunk-FIUNOH6W.js';
1
+ export { brands } from '../chunk-S4DK5WN6.js';
2
+ export { enterpriseHealthBrand } from '../chunk-MTZPVOP6.js';
2
3
  export { miewebBrand } from '../chunk-UHSPAFY6.js';
3
4
  export { wagglelineBrand } from '../chunk-OWPWP46L.js';
4
5
  export { webchartBrand } from '../chunk-C6MDPPPL.js';
5
6
  export { createBrandPreset, generateBrandCSS, generateTailwindTheme } from '../chunk-SOFX4T7M.js';
6
7
  export { bluehiveBrand } from '../chunk-ULOA7WBW.js';
7
8
  export { defaultBrand } from '../chunk-4LTN2LEN.js';
8
- export { enterpriseHealthBrand } from '../chunk-MTZPVOP6.js';
9
9
  //# sourceMappingURL=index.js.map
10
10
  //# sourceMappingURL=index.js.map
@@ -0,0 +1,220 @@
1
+ import { cn } from './chunk-F3SOEIN2.js';
2
+ import * as React from 'react';
3
+ import { cva } from 'class-variance-authority';
4
+ import { jsxs, jsx } from 'react/jsx-runtime';
5
+
6
+ var sliderTrackVariants = cva(
7
+ [
8
+ "relative w-full overflow-hidden rounded-full",
9
+ "bg-neutral-200 dark:bg-neutral-700",
10
+ "cursor-pointer",
11
+ "group-data-[disabled=true]:cursor-not-allowed group-data-[disabled=true]:opacity-50"
12
+ ],
13
+ {
14
+ variants: {
15
+ size: {
16
+ sm: "h-1",
17
+ md: "h-2",
18
+ lg: "h-3"
19
+ }
20
+ },
21
+ defaultVariants: {
22
+ size: "md"
23
+ }
24
+ }
25
+ );
26
+ var sliderRangeVariants = cva(
27
+ ["absolute h-full rounded-full transition-all duration-75 ease-out"],
28
+ {
29
+ variants: {
30
+ variant: {
31
+ default: "bg-primary-500",
32
+ success: "bg-green-500",
33
+ warning: "bg-yellow-500",
34
+ danger: "bg-red-500",
35
+ neutral: "bg-neutral-500"
36
+ }
37
+ },
38
+ defaultVariants: {
39
+ variant: "default"
40
+ }
41
+ }
42
+ );
43
+ var sliderThumbVariants = cva(
44
+ [
45
+ "absolute top-1/2 -translate-y-1/2 -translate-x-1/2",
46
+ "rounded-full border-2 bg-white",
47
+ "shadow-md transition-shadow duration-150",
48
+ "peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2",
49
+ "peer-hover:shadow-lg",
50
+ "peer-active:shadow-xl peer-active:scale-110",
51
+ "group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50"
52
+ ],
53
+ {
54
+ variants: {
55
+ size: {
56
+ sm: "h-3.5 w-3.5",
57
+ md: "h-5 w-5",
58
+ lg: "h-6 w-6"
59
+ },
60
+ variant: {
61
+ default: "border-primary-500",
62
+ success: "border-green-500",
63
+ warning: "border-yellow-500",
64
+ danger: "border-red-500",
65
+ neutral: "border-neutral-500"
66
+ }
67
+ },
68
+ defaultVariants: {
69
+ size: "md",
70
+ variant: "default"
71
+ }
72
+ }
73
+ );
74
+ var Slider = React.forwardRef(
75
+ ({
76
+ value: controlledValue,
77
+ defaultValue = 0,
78
+ min = 0,
79
+ max = 100,
80
+ step = 1,
81
+ onValueChange,
82
+ onValueCommit,
83
+ disabled = false,
84
+ label,
85
+ showValue = false,
86
+ formatValue,
87
+ description,
88
+ minLabel,
89
+ maxLabel,
90
+ variant,
91
+ size,
92
+ className,
93
+ trackClassName,
94
+ id,
95
+ name,
96
+ "aria-label": ariaLabelProp,
97
+ "aria-labelledby": ariaLabelledByProp
98
+ }, ref) => {
99
+ const hasExplicitLabel = !!label;
100
+ const ariaLabelledBy = ariaLabelledByProp;
101
+ const ariaLabel = ariaLabelProp ?? (!hasExplicitLabel && !ariaLabelledByProp ? "Slider" : void 0);
102
+ const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue);
103
+ const isControlled = controlledValue !== void 0;
104
+ const currentValue = isControlled ? controlledValue : uncontrolledValue;
105
+ const clampedValue = Math.min(Math.max(currentValue, min), max);
106
+ const percentage = max !== min ? (clampedValue - min) / (max - min) * 100 : 0;
107
+ const generatedId = React.useId();
108
+ const inputId = id ?? generatedId;
109
+ const handleChange = (e) => {
110
+ const newValue = parseFloat(e.target.value);
111
+ if (!isControlled) {
112
+ setUncontrolledValue(newValue);
113
+ }
114
+ onValueChange?.(newValue);
115
+ };
116
+ const handleCommit = () => {
117
+ onValueCommit?.(clampedValue);
118
+ };
119
+ const displayValue = formatValue ? formatValue(clampedValue) : String(clampedValue);
120
+ return /* @__PURE__ */ jsxs(
121
+ "div",
122
+ {
123
+ className: cn("w-full", className),
124
+ "data-disabled": disabled || void 0,
125
+ children: [
126
+ (label || showValue) && /* @__PURE__ */ jsxs("div", { className: "mb-1.5 flex items-baseline justify-between", children: [
127
+ label && /* @__PURE__ */ jsxs(
128
+ "label",
129
+ {
130
+ htmlFor: inputId,
131
+ className: cn(
132
+ "text-foreground text-sm font-medium",
133
+ disabled && "opacity-50"
134
+ ),
135
+ children: [
136
+ label,
137
+ showValue && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground ml-1", children: displayValue })
138
+ ]
139
+ }
140
+ ),
141
+ !label && showValue && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: displayValue })
142
+ ] }),
143
+ description && /* @__PURE__ */ jsx(
144
+ "p",
145
+ {
146
+ className: cn(
147
+ "text-muted-foreground mb-2 text-xs",
148
+ disabled && "opacity-50"
149
+ ),
150
+ children: description
151
+ }
152
+ ),
153
+ /* @__PURE__ */ jsxs("div", { className: "group relative", "data-disabled": disabled || void 0, children: [
154
+ /* @__PURE__ */ jsx("div", { className: cn(sliderTrackVariants({ size }), trackClassName), children: /* @__PURE__ */ jsx(
155
+ "div",
156
+ {
157
+ className: sliderRangeVariants({ variant }),
158
+ style: { width: `${percentage}%` }
159
+ }
160
+ ) }),
161
+ /* @__PURE__ */ jsx(
162
+ "input",
163
+ {
164
+ ref,
165
+ type: "range",
166
+ className: cn(
167
+ "peer absolute inset-0 h-full w-full cursor-pointer opacity-0",
168
+ disabled && "cursor-not-allowed"
169
+ ),
170
+ id: inputId,
171
+ name,
172
+ min,
173
+ max,
174
+ step,
175
+ value: clampedValue,
176
+ onChange: handleChange,
177
+ onMouseUp: handleCommit,
178
+ onTouchEnd: handleCommit,
179
+ onKeyUp: handleCommit,
180
+ onBlur: handleCommit,
181
+ disabled,
182
+ "aria-label": ariaLabel,
183
+ "aria-labelledby": ariaLabelledBy,
184
+ "aria-valuemin": min,
185
+ "aria-valuemax": max,
186
+ "aria-valuenow": clampedValue
187
+ }
188
+ ),
189
+ /* @__PURE__ */ jsx(
190
+ "div",
191
+ {
192
+ className: sliderThumbVariants({ size, variant }),
193
+ style: { left: `${percentage}%` },
194
+ "aria-hidden": "true"
195
+ }
196
+ )
197
+ ] }),
198
+ (minLabel || maxLabel) && /* @__PURE__ */ jsxs(
199
+ "div",
200
+ {
201
+ className: cn(
202
+ "text-muted-foreground mt-1 flex justify-between text-xs",
203
+ disabled && "opacity-50"
204
+ ),
205
+ children: [
206
+ /* @__PURE__ */ jsx("span", { children: minLabel }),
207
+ /* @__PURE__ */ jsx("span", { children: maxLabel })
208
+ ]
209
+ }
210
+ )
211
+ ]
212
+ }
213
+ );
214
+ }
215
+ );
216
+ Slider.displayName = "Slider";
217
+
218
+ export { Slider, sliderRangeVariants, sliderThumbVariants, sliderTrackVariants };
219
+ //# sourceMappingURL=chunk-4T2ZNPTC.js.map
220
+ //# sourceMappingURL=chunk-4T2ZNPTC.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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","file":"chunk-4T2ZNPTC.js","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Slider Variants\n// ============================================================================\n\nconst sliderTrackVariants = cva(\n [\n 'relative w-full overflow-hidden rounded-full',\n 'bg-neutral-200 dark:bg-neutral-700',\n 'cursor-pointer',\n 'group-data-[disabled=true]:cursor-not-allowed group-data-[disabled=true]:opacity-50',\n ],\n {\n variants: {\n size: {\n sm: 'h-1',\n md: 'h-2',\n lg: 'h-3',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n }\n);\n\nconst sliderRangeVariants = cva(\n ['absolute h-full rounded-full transition-all duration-75 ease-out'],\n {\n variants: {\n variant: {\n default: 'bg-primary-500',\n success: 'bg-green-500',\n warning: 'bg-yellow-500',\n danger: 'bg-red-500',\n neutral: 'bg-neutral-500',\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n }\n);\n\nconst sliderThumbVariants = cva(\n [\n 'absolute top-1/2 -translate-y-1/2 -translate-x-1/2',\n 'rounded-full border-2 bg-white',\n 'shadow-md transition-shadow duration-150',\n 'peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2',\n 'peer-hover:shadow-lg',\n 'peer-active:shadow-xl peer-active:scale-110',\n 'group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50',\n ],\n {\n variants: {\n size: {\n sm: 'h-3.5 w-3.5',\n md: 'h-5 w-5',\n lg: 'h-6 w-6',\n },\n variant: {\n default: 'border-primary-500',\n success: 'border-green-500',\n warning: 'border-yellow-500',\n danger: 'border-red-500',\n neutral: 'border-neutral-500',\n },\n },\n defaultVariants: {\n size: 'md',\n variant: 'default',\n },\n }\n);\n\n// ============================================================================\n// Slider Component\n// ============================================================================\n\nexport interface SliderProps\n extends\n VariantProps<typeof sliderTrackVariants>,\n VariantProps<typeof sliderRangeVariants> {\n /** Current value (controlled) */\n value?: number;\n /** Default value (uncontrolled) */\n defaultValue?: number;\n /** Minimum value */\n min?: number;\n /** Maximum value */\n max?: number;\n /** Step increment */\n step?: number;\n /** Callback when value changes */\n onValueChange?: (value: number) => void;\n /** Callback when interaction ends (mouseup / touchend) */\n onValueCommit?: (value: number) => void;\n /** Whether the slider is disabled */\n disabled?: boolean;\n /** Label for the slider */\n label?: string;\n /** Show the current value */\n showValue?: boolean;\n /** Format the displayed value */\n formatValue?: (value: number) => string;\n /** Description text below the label */\n description?: string;\n /** Min label displayed below the track (left) */\n minLabel?: string;\n /** Max label displayed below the track (right) */\n maxLabel?: string;\n /** Additional class name for the root container */\n className?: string;\n /** Additional class name for the track */\n trackClassName?: string;\n /** ID for the underlying input */\n id?: string;\n /** Name for form submission */\n name?: string;\n /** Accessible label for the slider */\n 'aria-label'?: string;\n /** ID of the element that labels the slider */\n 'aria-labelledby'?: string;\n}\n\n/**\n * A fully branded, accessible slider/range input component.\n *\n * Uses brand design tokens for colors, border-radius, and sizing.\n * Supports controlled and uncontrolled usage, labels, descriptions,\n * min/max labels, value display, and multiple color variants.\n *\n * @example\n * ```tsx\n * <Slider label=\"Volume\" min={0} max={100} defaultValue={50} />\n * <Slider\n * label=\"Border Radius\"\n * min={0}\n * max={32}\n * value={radius}\n * onValueChange={setRadius}\n * showValue\n * formatValue={(v) => `${v}px`}\n * minLabel=\"Square\"\n * maxLabel=\"Rounded\"\n * />\n * ```\n */\nconst Slider = React.forwardRef<HTMLInputElement, SliderProps>(\n (\n {\n value: controlledValue,\n defaultValue = 0,\n min = 0,\n max = 100,\n step = 1,\n onValueChange,\n onValueCommit,\n disabled = false,\n label,\n showValue = false,\n formatValue,\n description,\n minLabel,\n maxLabel,\n variant,\n size,\n className,\n trackClassName,\n id,\n name,\n 'aria-label': ariaLabelProp,\n 'aria-labelledby': ariaLabelledByProp,\n },\n ref\n ) => {\n const hasExplicitLabel = !!label;\n const ariaLabelledBy = ariaLabelledByProp;\n const ariaLabel =\n ariaLabelProp ??\n (!hasExplicitLabel && !ariaLabelledByProp ? 'Slider' : undefined);\n const [uncontrolledValue, setUncontrolledValue] =\n React.useState(defaultValue);\n const isControlled = controlledValue !== undefined;\n const currentValue = isControlled ? controlledValue : uncontrolledValue;\n\n // Clamp value to min/max\n const clampedValue = Math.min(Math.max(currentValue, min), max);\n\n // Percentage for visual fill\n const percentage =\n max !== min ? ((clampedValue - min) / (max - min)) * 100 : 0;\n\n const generatedId = React.useId();\n const inputId = id ?? generatedId;\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = parseFloat(e.target.value);\n if (!isControlled) {\n setUncontrolledValue(newValue);\n }\n onValueChange?.(newValue);\n };\n\n const handleCommit = () => {\n onValueCommit?.(clampedValue);\n };\n\n const displayValue = formatValue\n ? formatValue(clampedValue)\n : String(clampedValue);\n\n return (\n <div\n className={cn('w-full', className)}\n data-disabled={disabled || undefined}\n >\n {/* Label row */}\n {(label || showValue) && (\n <div className=\"mb-1.5 flex items-baseline justify-between\">\n {label && (\n <label\n htmlFor={inputId}\n className={cn(\n 'text-foreground text-sm font-medium',\n disabled && 'opacity-50'\n )}\n >\n {label}\n {showValue && (\n <span className=\"text-muted-foreground ml-1\">\n {displayValue}\n </span>\n )}\n </label>\n )}\n {!label && showValue && (\n <span className=\"text-muted-foreground text-sm\">\n {displayValue}\n </span>\n )}\n </div>\n )}\n\n {/* Description */}\n {description && (\n <p\n className={cn(\n 'text-muted-foreground mb-2 text-xs',\n disabled && 'opacity-50'\n )}\n >\n {description}\n </p>\n )}\n\n {/* Track + Thumb */}\n <div className=\"group relative\" data-disabled={disabled || undefined}>\n {/* Visual track background */}\n <div className={cn(sliderTrackVariants({ size }), trackClassName)}>\n {/* Filled range */}\n <div\n className={sliderRangeVariants({ variant })}\n style={{ width: `${percentage}%` }}\n />\n </div>\n\n {/* Native range input — stretched to fill, made invisible */}\n <input\n ref={ref}\n type=\"range\"\n className={cn(\n 'peer absolute inset-0 h-full w-full cursor-pointer opacity-0',\n disabled && 'cursor-not-allowed'\n )}\n id={inputId}\n name={name}\n min={min}\n max={max}\n step={step}\n value={clampedValue}\n onChange={handleChange}\n onMouseUp={handleCommit}\n onTouchEnd={handleCommit}\n onKeyUp={handleCommit}\n onBlur={handleCommit}\n disabled={disabled}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={clampedValue}\n />\n\n {/* Thumb indicator (visual only) */}\n <div\n className={sliderThumbVariants({ size, variant })}\n style={{ left: `${percentage}%` }}\n aria-hidden=\"true\"\n />\n </div>\n\n {/* Min / Max labels */}\n {(minLabel || maxLabel) && (\n <div\n className={cn(\n 'text-muted-foreground mt-1 flex justify-between text-xs',\n disabled && 'opacity-50'\n )}\n >\n <span>{minLabel}</span>\n <span>{maxLabel}</span>\n </div>\n )}\n </div>\n );\n }\n);\n\nSlider.displayName = 'Slider';\n\nexport {\n Slider,\n sliderTrackVariants,\n sliderRangeVariants,\n sliderThumbVariants,\n};\n"]}
@@ -157,14 +157,25 @@ function Select({
157
157
  const updateDropdownPosition = React__namespace.useCallback(() => {
158
158
  if (!triggerRef.current) return;
159
159
  const rect = triggerRef.current.getBoundingClientRect();
160
+ const spaceBelow = window.innerHeight - rect.bottom;
161
+ const spaceAbove = rect.top;
162
+ const estimatedDropdownHeight = Math.min(flatOptions.length * 40 + 16, 300);
163
+ const openAbove = spaceBelow < estimatedDropdownHeight && spaceAbove > spaceBelow;
160
164
  setDropdownStyle({
161
165
  position: "fixed",
162
- top: rect.bottom + 4,
166
+ ...openAbove ? { bottom: window.innerHeight - rect.top + 4 } : { top: rect.bottom + 4 },
163
167
  left: rect.left,
164
168
  width: rect.width,
169
+ maxHeight: Math.max(
170
+ Math.min(openAbove ? spaceAbove - 8 : spaceBelow - 8, 300),
171
+ 0
172
+ ),
173
+ display: "flex",
174
+ flexDirection: "column",
175
+ overflow: "hidden",
165
176
  zIndex: 9999
166
177
  });
167
- }, []);
178
+ }, [flatOptions.length]);
168
179
  React__namespace.useEffect(() => {
169
180
  if (!isOpen) return;
170
181
  updateDropdownPosition();
@@ -329,7 +340,7 @@ function Select({
329
340
  id: listboxId,
330
341
  role: "listbox",
331
342
  "aria-label": label || "Options",
332
- className: "max-h-60 overflow-auto p-1",
343
+ className: "flex-1 overflow-auto p-1",
333
344
  children: filteredFlatOptions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("li", { className: "text-muted-foreground px-3 py-2 text-center text-sm", children: noResultsText }) : filteredOptions.map((item) => {
334
345
  if ("options" in item) {
335
346
  return /* @__PURE__ */ jsxRuntime.jsxs("li", { role: "presentation", children: [
@@ -464,5 +475,5 @@ function CheckIcon({ className }) {
464
475
 
465
476
  exports.Select = Select;
466
477
  exports.selectTriggerVariants = selectTriggerVariants;
467
- //# sourceMappingURL=chunk-NL3CZNBH.cjs.map
468
- //# sourceMappingURL=chunk-NL3CZNBH.cjs.map
478
+ //# sourceMappingURL=chunk-5UUL5EEO.cjs.map
479
+ //# sourceMappingURL=chunk-5UUL5EEO.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Select/Select.tsx"],"names":["cva","React","useEscapeKey","cn","jsx","jsxs","createPortal"],"mappings":"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","file":"chunk-5UUL5EEO.cjs","sourcesContent":["import * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface SelectOption {\n /** Unique value for the option */\n value: string;\n /** Display label for the option */\n label: string;\n /** Whether the option is disabled */\n disabled?: boolean;\n /** Optional group this option belongs to */\n group?: string;\n}\n\nexport interface SelectGroup {\n /** Group label */\n label: string;\n /** Options in this group */\n options: SelectOption[];\n}\n\n// ============================================================================\n// Variants\n// ============================================================================\n\nconst selectTriggerVariants = cva(\n [\n 'flex w-full items-center justify-between gap-2',\n 'border border-input rounded-lg',\n 'bg-background text-foreground',\n 'transition-colors duration-200',\n 'focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent',\n 'disabled:cursor-not-allowed disabled:opacity-50',\n ],\n {\n variants: {\n size: {\n sm: 'h-8 px-3 text-sm',\n md: 'h-10 px-3 text-base',\n lg: 'h-12 px-4 text-lg',\n },\n hasError: {\n true: 'border-destructive focus:ring-destructive',\n false: '',\n },\n },\n defaultVariants: {\n size: 'md',\n hasError: false,\n },\n }\n);\n\n// ============================================================================\n// Select Component\n// ============================================================================\n\nexport interface SelectProps extends VariantProps<\n typeof selectTriggerVariants\n> {\n /** Array of options or groups */\n options: (SelectOption | SelectGroup)[];\n /** Controlled value */\n value?: string;\n /** Default value (uncontrolled) */\n defaultValue?: string;\n /** Callback when value changes */\n onValueChange?: (value: string) => void;\n /** Placeholder text */\n placeholder?: string;\n /** Whether the select is disabled */\n disabled?: boolean;\n /** Label for the select */\n label?: string;\n /** Hide the label visually */\n hideLabel?: boolean;\n /** Error message */\n error?: string;\n /** Helper text */\n helperText?: string;\n /** Enable search/filter */\n searchable?: boolean;\n /** Search placeholder */\n searchPlaceholder?: string;\n /** No results text */\n noResultsText?: string;\n /** Additional class name */\n className?: string;\n /** ID for the select */\n id?: string;\n}\n\n/**\n * An accessible select/dropdown component with search support.\n *\n * @example\n * ```tsx\n * <Select\n * label=\"Country\"\n * placeholder=\"Select a country\"\n * options={[\n * { value: 'us', label: 'United States' },\n * { value: 'ca', label: 'Canada' },\n * { value: 'uk', label: 'United Kingdom' },\n * ]}\n * onValueChange={(value) => console.log(value)}\n * />\n * ```\n */\nfunction Select({\n options,\n value: controlledValue,\n defaultValue,\n onValueChange,\n placeholder = 'Select an option',\n disabled = false,\n label,\n hideLabel = false,\n error,\n helperText,\n size,\n hasError,\n searchable = false,\n searchPlaceholder = 'Search...',\n noResultsText = 'No results found',\n className,\n id,\n}: SelectProps) {\n const [isOpen, setIsOpen] = React.useState(false);\n const [uncontrolledValue, setUncontrolledValue] = React.useState(\n defaultValue || ''\n );\n const [searchQuery, setSearchQuery] = React.useState('');\n const [highlightedIndex, setHighlightedIndex] = React.useState(-1);\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const triggerRef = React.useRef<HTMLButtonElement>(null);\n const searchInputRef = React.useRef<HTMLInputElement>(null);\n const listRef = React.useRef<HTMLUListElement>(null);\n const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n const generatedId = React.useId();\n const selectId = id || generatedId;\n const listboxId = `${selectId}-listbox`;\n const errorId = `${selectId}-error`;\n const helperId = `${selectId}-helper`;\n\n const isControlled = controlledValue !== undefined;\n const value = isControlled ? controlledValue : uncontrolledValue;\n\n // Flatten options for easy access\n const flatOptions = React.useMemo(() => {\n const result: SelectOption[] = [];\n for (const item of options) {\n if ('options' in item) {\n result.push(...item.options);\n } else {\n result.push(item);\n }\n }\n return result;\n }, [options]);\n\n // Filter options based on search query\n const filteredOptions = React.useMemo(() => {\n if (!searchQuery) return options;\n\n const query = searchQuery.toLowerCase();\n const result: (SelectOption | SelectGroup)[] = [];\n\n for (const item of options) {\n if ('options' in item) {\n const filteredGroupOptions = item.options.filter((opt) =>\n opt.label.toLowerCase().includes(query)\n );\n if (filteredGroupOptions.length > 0) {\n result.push({ ...item, options: filteredGroupOptions });\n }\n } else {\n if (item.label.toLowerCase().includes(query)) {\n result.push(item);\n }\n }\n }\n\n return result;\n }, [options, searchQuery]);\n\n // Get filtered flat options for keyboard navigation\n const filteredFlatOptions = React.useMemo(() => {\n const result: SelectOption[] = [];\n for (const item of filteredOptions) {\n if ('options' in item) {\n result.push(...item.options.filter((opt) => !opt.disabled));\n } else if (!item.disabled) {\n result.push(item);\n }\n }\n return result;\n }, [filteredOptions]);\n\n // Get selected option\n const selectedOption = flatOptions.find((opt) => opt.value === value);\n\n // Close dropdown on click outside (handles both container and portaled dropdown)\n React.useEffect(() => {\n if (!isOpen) return;\n const handleClickOutside = (e: MouseEvent) => {\n const target = e.target as Node;\n if (\n containerRef.current &&\n !containerRef.current.contains(target) &&\n dropdownRef.current &&\n !dropdownRef.current.contains(target)\n ) {\n setIsOpen(false);\n }\n };\n document.addEventListener('mousedown', handleClickOutside);\n return () => document.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen]);\n\n useEscapeKey(() => {\n if (isOpen) {\n setIsOpen(false);\n triggerRef.current?.focus();\n }\n }, isOpen);\n\n // Track trigger position for portal dropdown\n const [dropdownStyle, setDropdownStyle] = React.useState<React.CSSProperties>(\n {}\n );\n\n const updateDropdownPosition = React.useCallback(() => {\n if (!triggerRef.current) return;\n const rect = triggerRef.current.getBoundingClientRect();\n const spaceBelow = window.innerHeight - rect.bottom;\n const spaceAbove = rect.top;\n const estimatedDropdownHeight = Math.min(flatOptions.length * 40 + 16, 300);\n const openAbove =\n spaceBelow < estimatedDropdownHeight && spaceAbove > spaceBelow;\n\n setDropdownStyle({\n position: 'fixed',\n ...(openAbove\n ? { bottom: window.innerHeight - rect.top + 4 }\n : { top: rect.bottom + 4 }),\n left: rect.left,\n width: rect.width,\n maxHeight: Math.max(\n Math.min(openAbove ? spaceAbove - 8 : spaceBelow - 8, 300),\n 0\n ),\n display: 'flex',\n flexDirection: 'column' as const,\n overflow: 'hidden',\n zIndex: 9999,\n });\n }, [flatOptions.length]);\n\n React.useEffect(() => {\n if (!isOpen) return;\n updateDropdownPosition();\n\n window.addEventListener('scroll', updateDropdownPosition, true);\n window.addEventListener('resize', updateDropdownPosition);\n return () => {\n window.removeEventListener('scroll', updateDropdownPosition, true);\n window.removeEventListener('resize', updateDropdownPosition);\n };\n }, [isOpen, updateDropdownPosition]);\n\n // Handle value change\n const handleValueChange = React.useCallback(\n (newValue: string) => {\n if (!isControlled) {\n setUncontrolledValue(newValue);\n }\n onValueChange?.(newValue);\n setIsOpen(false);\n setSearchQuery('');\n triggerRef.current?.focus();\n },\n [isControlled, onValueChange]\n );\n\n // Handle keyboard navigation\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent) => {\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n if (!isOpen) {\n setIsOpen(true);\n } else {\n setHighlightedIndex((prev) =>\n prev < filteredFlatOptions.length - 1 ? prev + 1 : 0\n );\n }\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!isOpen) {\n setIsOpen(true);\n } else {\n setHighlightedIndex((prev) =>\n prev > 0 ? prev - 1 : filteredFlatOptions.length - 1\n );\n }\n break;\n case 'Enter':\n case ' ':\n e.preventDefault();\n if (isOpen && highlightedIndex >= 0) {\n handleValueChange(filteredFlatOptions[highlightedIndex].value);\n } else if (!isOpen) {\n setIsOpen(true);\n }\n break;\n case 'Home':\n e.preventDefault();\n setHighlightedIndex(0);\n break;\n case 'End':\n e.preventDefault();\n setHighlightedIndex(filteredFlatOptions.length - 1);\n break;\n }\n },\n [isOpen, highlightedIndex, filteredFlatOptions, handleValueChange]\n );\n\n // Focus search input when dropdown opens\n React.useEffect(() => {\n if (isOpen && searchable && searchInputRef.current) {\n searchInputRef.current.focus();\n }\n }, [isOpen, searchable]);\n\n // Reset highlighted index when search changes\n React.useEffect(() => {\n setHighlightedIndex(filteredFlatOptions.length > 0 ? 0 : -1);\n }, [searchQuery, filteredFlatOptions.length]);\n\n // Build aria-describedby\n const describedByIds = [error ? errorId : null, helperText ? helperId : null]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={cn('flex flex-col gap-1.5', className)}>\n {label && (\n <label\n htmlFor={selectId}\n className={cn(\n 'text-foreground text-sm font-medium',\n hideLabel && 'sr-only'\n )}\n >\n {label}\n </label>\n )}\n\n <div ref={containerRef} className=\"relative\">\n {/* Trigger Button */}\n <button\n ref={triggerRef}\n id={selectId}\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={isOpen}\n aria-controls={listboxId}\n aria-invalid={hasError || !!error}\n aria-describedby={describedByIds || undefined}\n disabled={disabled}\n onClick={() => setIsOpen(!isOpen)}\n onKeyDown={handleKeyDown}\n className={cn(\n selectTriggerVariants({ size, hasError: hasError || !!error })\n )}\n >\n <span\n className={cn(\n 'truncate',\n !selectedOption && 'text-muted-foreground'\n )}\n >\n {selectedOption?.label || placeholder}\n </span>\n <ChevronDownIcon\n className={cn(\n 'text-muted-foreground h-4 w-4 shrink-0 transition-transform',\n isOpen && 'rotate-180'\n )}\n />\n </button>\n\n {/* Dropdown (portaled to body to avoid overflow clipping) */}\n {isOpen &&\n createPortal(\n <div\n ref={dropdownRef}\n style={dropdownStyle}\n className={cn(\n 'border-border bg-card rounded-lg border shadow-lg',\n 'animate-in fade-in zoom-in-95 duration-100'\n )}\n >\n {/* Search Input */}\n {searchable && (\n <div className=\"border-border border-b p-2\">\n <input\n ref={searchInputRef}\n type=\"text\"\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n onKeyDown={handleKeyDown}\n placeholder={searchPlaceholder}\n className={cn(\n 'border-input bg-background w-full rounded-md border px-3 py-2 text-sm',\n 'placeholder:text-muted-foreground',\n 'focus:ring-ring focus:ring-2 focus:outline-none'\n )}\n aria-label=\"Search options\"\n />\n </div>\n )}\n\n {/* Options List */}\n <ul\n ref={listRef}\n id={listboxId}\n role=\"listbox\"\n aria-label={label || 'Options'}\n className=\"flex-1 overflow-auto p-1\"\n >\n {filteredFlatOptions.length === 0 ? (\n <li className=\"text-muted-foreground px-3 py-2 text-center text-sm\">\n {noResultsText}\n </li>\n ) : (\n filteredOptions.map((item) => {\n if ('options' in item) {\n // Render group\n return (\n <li key={`group-${item.label}`} role=\"presentation\">\n <div className=\"text-muted-foreground px-3 py-1.5 text-xs font-semibold tracking-wider uppercase\">\n {item.label}\n </div>\n <ul role=\"group\" aria-label={item.label}>\n {item.options.map((option) => (\n <SelectOptionItem\n key={option.value}\n option={option}\n isSelected={option.value === value}\n isHighlighted={\n filteredFlatOptions[highlightedIndex]\n ?.value === option.value\n }\n onSelect={() => handleValueChange(option.value)}\n onMouseEnter={() => {\n const idx = filteredFlatOptions.findIndex(\n (o) => o.value === option.value\n );\n setHighlightedIndex(idx);\n }}\n />\n ))}\n </ul>\n </li>\n );\n }\n\n // Render single option\n return (\n <SelectOptionItem\n key={item.value}\n option={item}\n isSelected={item.value === value}\n isHighlighted={\n filteredFlatOptions[highlightedIndex]?.value ===\n item.value\n }\n onSelect={() => handleValueChange(item.value)}\n onMouseEnter={() => {\n const idx = filteredFlatOptions.findIndex(\n (o) => o.value === item.value\n );\n setHighlightedIndex(idx);\n }}\n />\n );\n })\n )}\n </ul>\n </div>,\n document.body\n )}\n </div>\n\n {/* Error Message */}\n {error && (\n <p id={errorId} className=\"text-destructive text-sm\" role=\"alert\">\n {error}\n </p>\n )}\n\n {/* Helper Text */}\n {helperText && !error && (\n <p id={helperId} className=\"text-muted-foreground text-sm\">\n {helperText}\n </p>\n )}\n </div>\n );\n}\n\nSelect.displayName = 'Select';\n\n// ============================================================================\n// Select Option Item (Internal)\n// ============================================================================\n\ninterface SelectOptionItemProps {\n option: SelectOption;\n isSelected: boolean;\n isHighlighted: boolean;\n onSelect: () => void;\n onMouseEnter: () => void;\n}\n\nfunction SelectOptionItem({\n option,\n isSelected,\n isHighlighted,\n onSelect,\n onMouseEnter,\n}: SelectOptionItemProps) {\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n if (!option.disabled) {\n onSelect();\n }\n }\n };\n\n return (\n <li\n role=\"option\"\n aria-selected={isSelected}\n aria-disabled={option.disabled}\n data-highlighted={isHighlighted}\n data-disabled={option.disabled}\n tabIndex={isHighlighted ? 0 : -1}\n onClick={option.disabled ? undefined : onSelect}\n onKeyDown={handleKeyDown}\n onMouseEnter={option.disabled ? undefined : onMouseEnter}\n className={cn(\n 'flex cursor-pointer items-center gap-2 rounded-md px-3 py-2 text-sm',\n 'transition-colors outline-none',\n isHighlighted && 'bg-muted',\n isSelected &&\n 'bg-primary-50 text-primary-900 dark:bg-primary-950 dark:text-primary-100',\n option.disabled && 'cursor-not-allowed opacity-50'\n )}\n >\n <span className=\"flex-1 truncate\">{option.label}</span>\n {isSelected && (\n <CheckIcon className=\"text-primary-500 h-4 w-4 shrink-0\" />\n )}\n </li>\n );\n}\n\n// ============================================================================\n// Icons\n// ============================================================================\n\nfunction ChevronDownIcon({ className }: { className?: string }) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n className={className}\n aria-hidden=\"true\"\n >\n <path d=\"m6 9 6 6 6-6\" />\n </svg>\n );\n}\n\nfunction CheckIcon({ className }: { className?: string }) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n className={className}\n aria-hidden=\"true\"\n >\n <path d=\"M20 6 9 17l-5-5\" />\n </svg>\n );\n}\n\nexport { Select, selectTriggerVariants };\n"]}