@adea-ai/ui 0.70.2 → 0.71.1

package/README.md

@@ -40,6 +40,26 @@ The package includes source for Solid compilation and Tailwind discovery, and
 compiled JavaScript plus declarations for other supported consumers. License and
 donor notices travel in `dist/LICENSE` and `dist/NOTICE`.
 
+## Native select
+
+Use `NativeSelect` for a compact list of known choices that should keep native
+keyboard, form submission, option, and label behavior:
+
+```tsx
+import { NativeSelect } from '@adea-ai/ui/components/ui/native-select'
+
+<label for="relationship-kind">Relationship kind</label>
+<NativeSelect id="relationship-kind" name="relationshipKind" value={kind()} onChange={handleChange}>
+  <option value="all">All relationships</option>
+  <option value="derived">Derived</option>
+</NativeSelect>
+```
+
+`NativeSelect` renders a real `<select>` and passes native props and children
+through. Use `value` with `onChange` for a controlled selection, or `defaultValue`
+to initialize an uncontrolled one. Use `Select` for searchable, runtime, or
+longer lists that need a custom popover.
+
 Tailwind ignores dependency directories by default. Register the component
 directories your application uses in its stylesheet, relative to that stylesheet:
 

package/dist/NOTICE

@@ -30,16 +30,18 @@ vocabulary carried in OKLCH. No KiroCrew source file is reproduced verbatim.
 
 ## Consumed libraries
 
-Components are built on the following upstream projects. They are consumed as
-dependencies, not copied:
+Components are built on these upstream dependencies, which are consumed rather
+than copied:
 
     Kobalte (@kobalte/core)        MIT License
     corvu (@corvu/*)               MIT License
-    shadcn/ui                      MIT License
     SolidJS (solid-js)             MIT License
     lucide (lucide-solid)          ISC License
     Tailwind CSS                   MIT License
 
+The shadcn/ui design vocabulary is used throughout the system. Its NativeSelect
+source is translated in one component and separately attributed below.
+
 The component architecture — the folder-per-component layout, the registry
 build, and the convention of composing higher-level blocks on top of an
 unmodified primitive layer — follows patterns established by the
@@ -49,6 +51,38 @@ Origin UI / coss (AGPL-3.0-or-later) was consulted for visual ideas only. No
 code, class string, or asset from that project is reproduced here, because its
 licence is incompatible with this distribution.
 
+## NativeSelect translated from shadcn/ui
+
+`packages/ui/src/components/ui/native-select/native-select.tsx` translates
+shadcn/ui's native select wrapper from
+`apps/v4/registry/new-york-v4/ui/native-select.tsx`, pinned at
+`98a1fe67b439324ddc857f47fbdce056600a4329`. The Solid component preserves the
+native `<select>` and its browser-owned form, option, value, and accessibility
+behavior while adapting the wrapper, icon package, and classes to this design
+system. The upstream component is distributed under MIT:
+
+    MIT License
+
+    Copyright (c) 2023 shadcn
+
+    Permission is hereby granted, free of charge, to any person obtaining a copy
+    of this software and associated documentation files (the "Software"), to deal
+    in the Software without restriction, including without limitation the rights
+    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+    copies of the Software, and to permit persons to whom the Software is
+    furnished to do so, subject to the following conditions:
+
+    The above copyright notice and this permission notice shall be included in all
+    copies or substantial portions of the Software.
+
+    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+    SOFTWARE.
+
 
 ## Composer IME input ownership translated from KiroCrew
 

package/dist/components/ui/native-select/index.d.ts

@@ -0,0 +1,3 @@
+/** A themed wrapper around the browser's native `<select>` element. */
+export { NativeSelect, type NativeSelectProps } from './native-select';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ui/native-select/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/native-select/index.ts"],"names":[],"mappings":"AAAA,uEAAuE;AACvE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,iBAAiB,CAAA"}

package/dist/components/ui/native-select/index.js

@@ -0,0 +1,2 @@
+import { NativeSelect } from "./native-select.js";
+export { NativeSelect };

package/dist/components/ui/native-select/native-select.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentProps } from 'solid-js';
+export type NativeSelectProps = ComponentProps<'select'> & {
+    /** Initialize an uncontrolled selection after its native options mount. */
+    defaultValue?: ComponentProps<'select'>['value'];
+};
+/**
+ * NativeSelect.
+ *
+ * A styled native `<select>` for compact, finite choices. Use `Select` when the
+ * list needs a custom popover, typed options, or runtime filtering; this keeps
+ * the browser's built-in keyboard, form, option, and label behavior.
+ *
+ * Translated from shadcn/ui's MIT-licensed NativeSelect wrapper to SolidJS and
+ * the Adea token system; see the root NOTICE for source and attribution.
+ */
+export declare function NativeSelect(props: NativeSelectProps): import("solid-js").JSX.Element;
+//# sourceMappingURL=native-select.d.ts.map

package/dist/components/ui/native-select/native-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-select.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/native-select/native-select.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACzD,2EAA2E;IAC3E,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAA;CACjD,CAAA;AAkCD;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kCA0CpD"}

package/dist/components/ui/native-select/native-select.js

@@ -0,0 +1,66 @@
+import { cn } from "../../../lib/utils.js";
+import { createComponent, insert, mergeProps, spread, template, use } from "solid-js/web";
+import { ChevronDownIcon } from "lucide-solid";
+import { createEffect, onMount, splitProps } from "solid-js";
+//#region src/components/ui/native-select/native-select.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<span data-slot=native-select-wrapper class="relative inline-flex min-w-0"><select data-slot=native-select>`);
+function setSelectedValue(select, value, multiple) {
+	if (value === void 0) return;
+	if (multiple && Array.isArray(value)) {
+		const selected = new Set(value.map(String));
+		for (const option of select.options) option.selected = selected.has(option.value);
+		return;
+	}
+	select.value = String(Array.isArray(value) ? value[0] ?? "" : value);
+}
+function initializeDefaultSelection(select, value, multiple) {
+	if (value === void 0) return;
+	const defaultValues = multiple && Array.isArray(value) ? new Set(value.map(String)) : /* @__PURE__ */ new Set([String(Array.isArray(value) ? value[0] ?? "" : value)]);
+	for (const option of select.options) option.defaultSelected = defaultValues.has(option.value);
+	setSelectedValue(select, value, multiple);
+}
+/**
+* NativeSelect.
+*
+* A styled native `<select>` for compact, finite choices. Use `Select` when the
+* list needs a custom popover, typed options, or runtime filtering; this keeps
+* the browser's built-in keyboard, form, option, and label behavior.
+*
+* Translated from shadcn/ui's MIT-licensed NativeSelect wrapper to SolidJS and
+* the Adea token system; see the root NOTICE for source and attribution.
+*/
+function NativeSelect(props) {
+	const [local, rest] = splitProps(props, [
+		"class",
+		"children",
+		"defaultValue"
+	]);
+	let select;
+	createEffect(() => {
+		if (!select) return;
+		setSelectedValue(select, rest.value, Boolean(rest.multiple));
+	});
+	onMount(() => {
+		if (select && rest.value === void 0) initializeDefaultSelection(select, local.defaultValue, Boolean(rest.multiple));
+	});
+	return (() => {
+		var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+		use((element) => {
+			select = element;
+		}, _el$2);
+		spread(_el$2, mergeProps({ get ["class"]() {
+			return cn("h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm", "transition-[color,box-shadow,border-color] ease-out outline-none", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", "aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30", local.class);
+		} }, rest), false, true);
+		insert(_el$2, () => local.children);
+		insert(_el$, createComponent(ChevronDownIcon, {
+			"data-slot": "native-select-icon",
+			"aria-hidden": "true",
+			"class": "pointer-events-none absolute end-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"
+		}), null);
+		return _el$;
+	})();
+}
+//#endregion
+export { NativeSelect };
+
+//# sourceMappingURL=native-select.js.map

package/dist/components/ui/native-select/native-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-select.js","names":["ChevronDownIcon","ComponentProps","createEffect","onMount","splitProps","cn","NativeSelectProps","defaultValue","setSelectedValue","select","HTMLSelectElement","value","multiple","undefined","Array","isArray","selected","Set","map","String","option","options","has","initializeDefaultSelection","defaultValues","defaultSelected","NativeSelect","props","local","rest","Boolean","_el$","_tmpl$","_el$2","firstChild","_$use","element","_$spread","_$mergeProps","class","_$insert","children","_$createComponent","_$mergeProps","_$createComponent"],"sources":["../../../../src/components/ui/native-select/native-select.tsx"],"sourcesContent":["import { ChevronDownIcon } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, onMount, splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\nexport type NativeSelectProps = ComponentProps<'select'> & {\n  /** Initialize an uncontrolled selection after its native options mount. */\n  defaultValue?: ComponentProps<'select'>['value']\n}\n\nfunction setSelectedValue(\n  select: HTMLSelectElement,\n  value: ComponentProps<'select'>['value'],\n  multiple: boolean\n) {\n  if (value === undefined) return\n\n  if (multiple && Array.isArray(value)) {\n    const selected = new Set(value.map(String))\n    for (const option of select.options) option.selected = selected.has(option.value)\n    return\n  }\n\n  select.value = String(Array.isArray(value) ? (value[0] ?? '') : value)\n}\n\nfunction initializeDefaultSelection(\n  select: HTMLSelectElement,\n  value: ComponentProps<'select'>['value'],\n  multiple: boolean\n) {\n  if (value === undefined) return\n\n  const defaultValues =\n    multiple && Array.isArray(value)\n      ? new Set(value.map(String))\n      : new Set([String(Array.isArray(value) ? (value[0] ?? '') : value)])\n\n  for (const option of select.options) option.defaultSelected = defaultValues.has(option.value)\n  setSelectedValue(select, value, multiple)\n}\n\n/**\n * NativeSelect.\n *\n * A styled native `<select>` for compact, finite choices. Use `Select` when the\n * list needs a custom popover, typed options, or runtime filtering; this keeps\n * the browser's built-in keyboard, form, option, and label behavior.\n *\n * Translated from shadcn/ui's MIT-licensed NativeSelect wrapper to SolidJS and\n * the Adea token system; see the root NOTICE for source and attribution.\n */\nexport function NativeSelect(props: NativeSelectProps) {\n  const [local, rest] = splitProps(props, ['class', 'children', 'defaultValue'])\n  let select: HTMLSelectElement | undefined\n\n  // Set selection after native options exist; setting select.value before its\n  // children are mounted makes browsers fall back to the first option.\n  createEffect(() => {\n    if (!select) return\n    setSelectedValue(select, rest.value, Boolean(rest.multiple))\n  })\n  onMount(() => {\n    if (select && rest.value === undefined) {\n      initializeDefaultSelection(select, local.defaultValue, Boolean(rest.multiple))\n    }\n  })\n\n  return (\n    <span data-slot=\"native-select-wrapper\" class=\"relative inline-flex min-w-0\">\n      <select\n        ref={(element) => {\n          select = element\n        }}\n        data-slot=\"native-select\"\n        class={cn(\n          'h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm',\n          'transition-[color,box-shadow,border-color] ease-out outline-none',\n          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n          'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle',\n          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30',\n          local.class\n        )}\n        {...rest}\n      >\n        {local.children}\n      </select>\n      <ChevronDownIcon\n        data-slot=\"native-select-icon\"\n        aria-hidden=\"true\"\n        class=\"pointer-events-none absolute end-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground\"\n      />\n    </span>\n  )\n}\n"],"mappings":";;;;;;AAUA,SAASQ,iBACPC,QACAE,OACAC,UACA;CACA,IAAID,UAAUE,KAAAA,GAAW;CAEzB,IAAID,YAAYE,MAAMC,QAAQJ,KAAK,GAAG;EACpC,MAAMK,WAAW,IAAIC,IAAIN,MAAMO,IAAIC,MAAM,CAAC;EAC1C,KAAK,MAAMC,UAAUX,OAAOY,SAASD,OAAOJ,WAAWA,SAASM,IAAIF,OAAOT,KAAK;EAChF;CACF;CAEAF,OAAOE,QAAQQ,OAAOL,MAAMC,QAAQJ,KAAK,IAAKA,MAAM,MAAM,KAAMA,KAAK;AACvE;AAEA,SAASY,2BACPd,QACAE,OACAC,UACA;CACA,IAAID,UAAUE,KAAAA,GAAW;CAEzB,MAAMW,gBACJZ,YAAYE,MAAMC,QAAQJ,KAAK,IAC3B,IAAIM,IAAIN,MAAMO,IAAIC,MAAM,CAAC,oBACzB,IAAIF,IAAI,CAACE,OAAOL,MAAMC,QAAQJ,KAAK,IAAKA,MAAM,MAAM,KAAMA,KAAK,CAAC,CAAC;CAEvE,KAAK,MAAMS,UAAUX,OAAOY,SAASD,OAAOK,kBAAkBD,cAAcF,IAAIF,OAAOT,KAAK;CAC5FH,iBAAiBC,QAAQE,OAAOC,QAAQ;AAC1C;;;;;;;;;;;AAYA,SAAgBc,aAAaC,OAA0B;CACrD,MAAM,CAACC,OAAOC,QAAQzB,WAAWuB,OAAO;EAAC;EAAS;EAAY;CAAc,CAAC;CAC7E,IAAIlB;CAIJP,mBAAmB;EACjB,IAAI,CAACO,QAAQ;EACbD,iBAAiBC,QAAQoB,KAAKlB,OAAOmB,QAAQD,KAAKjB,QAAQ,CAAC;CAC7D,CAAC;CACDT,cAAc;EACZ,IAAIM,UAAUoB,KAAKlB,UAAUE,KAAAA,GAC3BU,2BAA2Bd,QAAQmB,MAAMrB,cAAcuB,QAAQD,KAAKjB,QAAQ,CAAC;CAEjF,CAAC;CAED,cAAA;EAAA,IAAAmB,OAAAC,OAAA,GAAAC,QAAAF,KAAAG;EAAAC,KAGYC,YAAY;GAChB3B,SAAS2B;EACX,GAACH,KAAA;EAAAI,OAAAJ,OAAAK,WAAA,EAAA,KAAA,WAAA;GAAA,OAEMjC,GACL,iHACA,oEACA,oFACA,4FACA,iGACAuB,MAAMW,KACR;EAAC,EAAA,GACGV,IAAI,GAAA,OAAA,IAAA;EAAAW,OAAAP,aAEPL,MAAMa,QAAQ;EAAAD,OAAAT,MAAAW,gBAEhB1C,iBAAe;GAAA,aAAA;GAAA,eAAA;GAAA,SAAA;EAAA,CAAA,GAAA,IAAA;EAAA,OAAA+B;CAAA,EAAA,CAAA;AAOtB"}

package/dist/index.d.ts

@@ -56,6 +56,7 @@ export * from './components/ui/radio-group';
 export * from './components/ui/resizable';
 export * from './components/ui/scroll-area';
 export * from './components/ui/select';
+export * from './components/ui/native-select';
 export * from './components/ui/separator';
 export * from './components/ui/sheet';
 export * from './components/ui/skeleton';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -44,6 +44,7 @@ import { RadioGroup, RadioGroupItem } from "./components/ui/radio-group/radio-gr
 import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "./components/ui/resizable/resizable.js";
 import { ScrollArea } from "./components/ui/scroll-area/scroll-area.js";
 import { Select, SelectChevronsUpDown, SelectContent, SelectItem, SelectLabel, SelectSection, SelectTrigger, SelectValue } from "./components/ui/select/select.js";
+import { NativeSelect } from "./components/ui/native-select/native-select.js";
 import { Sheet, SheetBody, SheetCloseButton, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, sheetVariants } from "./components/ui/sheet/sheet.js";
 import { Skeleton } from "./components/ui/skeleton/skeleton.js";
 import { Slider } from "./components/ui/slider/slider.js";
@@ -95,4 +96,4 @@ import { formatBytes, formatReleaseDate, plainTextFromMarkdown } from "./lib/ver
 import { UpdateDialog } from "./components/composites/update-dialog/update-dialog.js";
 import { WorkspaceMark } from "./components/composites/workspace-mark/workspace-mark.js";
 import { keyedRows } from "./lib/keyed-rows.js";
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AccountMenu, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellMain, AppearanceEditor, AppearancePanel, AppearancePopover, AspectRatio, AttachmentCard, Avatar, AvatarFallback, AvatarImage, Badge, Board, BoardCardBody, BoardCardTitle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbSeparator, BusySendButton, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CalendarSurface, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChatComposer, Checkbox, CheckboxDescription, CheckboxLabel, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxClear, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxSection, ComboboxTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, CommandSeparator, CommandShortcut, ComposerAttachmentButton, ComposerHint, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, ConversationAvatar, ConversationSurface, DatePicker, DetailPanel, DetailPanelBody, DetailPanelField, DetailPanelHeader, DetailPanelSection, Dialog, DialogClose, DialogCloseButton, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffBlock, DiffSummary, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, EntityIcon, Field, FieldDescription, FieldError, FieldInput, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTextArea, HoverCard, HoverCardContent, HoverCardTrigger, InlineCode, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputOtp, InputOtpCaret, Item, ItemDescription, ItemEmpty, ItemGroup, ItemGroupEntry, ItemTitle, Kbd, KbdGroup, Label, ListGroup, ListRow, MAX_LAYOUT_DEPTH, MAX_LAYOUT_LEAVES, MAX_SPLIT_RATIO, MIN_SPLIT_RATIO, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageBody, MessageComposer, MessageDayDivider, MessageGroup, MessageRow, ModalDialog, Motion, NavigationMenu, NavigationMenuContent, NavigationMenuGroup, NavigationMenuGroupLabel, NavigationMenuItem, NavigationMenuMenu, NavigationMenuSeparator, NavigationMenuTrigger, NavigationMenuViewport, PASTE_THRESHOLD_CHARS, PASTE_THRESHOLD_LINES, PASTE_TOKEN_REGEX, Page, PageHeader, PageHeaderActions, PageHeaderContent, PageHeaderDescription, PageHeaderTitle, PageSection, Pagination, PaginationEllipsis, PaginationItem, PaginationNext, PaginationPrevious, PalettePreview, Panel, PanelActions, PanelBody, PanelCard, PanelDescription, PanelFooter, PanelHeader, PanelPlaceholder, PanelTitle, PanelToolbar, Popover, PopoverAnchor, PopoverCloseButton, PopoverContent, PopoverDescription, PopoverTitle, PopoverTrigger, Presence, Progress, PropertyList, PropertyRow, PropertyTerm, PropertyValue, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, Select, SelectChevronsUpDown, SelectContent, SelectItem, SelectLabel, SelectSection, SelectTrigger, SelectValue, Separator, SettingsField, SettingsPage, SettingsRow, SettingsSection, Sheet, SheetBody, SheetCloseButton, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, SideRail, SideRailButton, SideRailContent, SideRailFooter, SideRailHeader, SideRailItem, SideRailSection, SidebarNav, SidebarNavButton, SidebarNavContent, SidebarNavFooter, SidebarNavHeader, SidebarNavItem, SidebarNavSection, SidebarNavTitle, Skeleton, Slider, Spinner, SplitLayout, Stat, StatGroup, StatusBar, StatusBarItem, StatusBarSpacer, StatusChip, StatusList, Switch, SwitchDescription, SwitchLabel, TALL_CODE_BLOCK_PX, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableNumericCell, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeMiniature, ThemeMiniatureSplit, ThemePicker, ThemePreview, ThemeProvider, ThemeSwatch, ThemeToggle, ThreadPanel, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, TopBarBreadcrumb, TopBarPill, TopBarSearch, TopBarSection, TopBarTitle, TranscriptComposition, UpdateDialog, WorkspaceMark, accentPresets, alertVariants, allTokens, badgeVariants, boardCardTitleVariants, builtinThemes, buttonVariants, closePane, cn, colorTokens, computeLayoutFrames, contrastRatio, controlInteractive, controlSize, controlSizeIcon, controlSizes, countLeaves, countLines, createLayoutState, cva, defaultDarkThemeId, defaultLightThemeId, defaultThemeSelection, densityTokens, designTokens, diffLineVariants, diffStats, diffTargetPath, elevationTokens, entityIconVariants, expandAll, findTokenRanges, focusPane, fontOptions, formatBytes, formatReleaseDate, formatToken, initialsFrom, inlineScriptLiteral, isPasteBlock, itemVariants, keyedRows, layoutDepth, listLeaves, monogram, motionTokens, movePane, neighborLeaf, nextSeq, normalizeLayout, parseDiff, plainTextFromMarkdown, pruneBlocks, radiusTokens, recollapsePastes, remapCarriedBlocks, resizeSplit, resolvedDensity, sheetVariants, shouldCollapse, sidebarNavItemClass, sidebarNavItemStateClass, splitPane, statusDotVariants, stripTrailingBlankLines, surfaceInteractive, swapPanes, themeById, themeCssVariables, themeFamilies, themeScript, themesForAppearance, toast, toaster, toggleVariants, tokenRangeAt, transcriptDisclosureKey, typographyTokens, undoClosePane, undocumentedTokenAliases, useSideRail, useTheme, validateTheme, validateThemeRegistry, zIndexTokens };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AccountMenu, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellMain, AppearanceEditor, AppearancePanel, AppearancePopover, AspectRatio, AttachmentCard, Avatar, AvatarFallback, AvatarImage, Badge, Board, BoardCardBody, BoardCardTitle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbSeparator, BusySendButton, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CalendarSurface, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChatComposer, Checkbox, CheckboxDescription, CheckboxLabel, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxClear, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxSection, ComboboxTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, CommandSeparator, CommandShortcut, ComposerAttachmentButton, ComposerHint, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, ConversationAvatar, ConversationSurface, DatePicker, DetailPanel, DetailPanelBody, DetailPanelField, DetailPanelHeader, DetailPanelSection, Dialog, DialogClose, DialogCloseButton, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffBlock, DiffSummary, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, EntityIcon, Field, FieldDescription, FieldError, FieldInput, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTextArea, HoverCard, HoverCardContent, HoverCardTrigger, InlineCode, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputOtp, InputOtpCaret, Item, ItemDescription, ItemEmpty, ItemGroup, ItemGroupEntry, ItemTitle, Kbd, KbdGroup, Label, ListGroup, ListRow, MAX_LAYOUT_DEPTH, MAX_LAYOUT_LEAVES, MAX_SPLIT_RATIO, MIN_SPLIT_RATIO, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageBody, MessageComposer, MessageDayDivider, MessageGroup, MessageRow, ModalDialog, Motion, NativeSelect, NavigationMenu, NavigationMenuContent, NavigationMenuGroup, NavigationMenuGroupLabel, NavigationMenuItem, NavigationMenuMenu, NavigationMenuSeparator, NavigationMenuTrigger, NavigationMenuViewport, PASTE_THRESHOLD_CHARS, PASTE_THRESHOLD_LINES, PASTE_TOKEN_REGEX, Page, PageHeader, PageHeaderActions, PageHeaderContent, PageHeaderDescription, PageHeaderTitle, PageSection, Pagination, PaginationEllipsis, PaginationItem, PaginationNext, PaginationPrevious, PalettePreview, Panel, PanelActions, PanelBody, PanelCard, PanelDescription, PanelFooter, PanelHeader, PanelPlaceholder, PanelTitle, PanelToolbar, Popover, PopoverAnchor, PopoverCloseButton, PopoverContent, PopoverDescription, PopoverTitle, PopoverTrigger, Presence, Progress, PropertyList, PropertyRow, PropertyTerm, PropertyValue, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, Select, SelectChevronsUpDown, SelectContent, SelectItem, SelectLabel, SelectSection, SelectTrigger, SelectValue, Separator, SettingsField, SettingsPage, SettingsRow, SettingsSection, Sheet, SheetBody, SheetCloseButton, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, SideRail, SideRailButton, SideRailContent, SideRailFooter, SideRailHeader, SideRailItem, SideRailSection, SidebarNav, SidebarNavButton, SidebarNavContent, SidebarNavFooter, SidebarNavHeader, SidebarNavItem, SidebarNavSection, SidebarNavTitle, Skeleton, Slider, Spinner, SplitLayout, Stat, StatGroup, StatusBar, StatusBarItem, StatusBarSpacer, StatusChip, StatusList, Switch, SwitchDescription, SwitchLabel, TALL_CODE_BLOCK_PX, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableNumericCell, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeMiniature, ThemeMiniatureSplit, ThemePicker, ThemePreview, ThemeProvider, ThemeSwatch, ThemeToggle, ThreadPanel, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, TopBarBreadcrumb, TopBarPill, TopBarSearch, TopBarSection, TopBarTitle, TranscriptComposition, UpdateDialog, WorkspaceMark, accentPresets, alertVariants, allTokens, badgeVariants, boardCardTitleVariants, builtinThemes, buttonVariants, closePane, cn, colorTokens, computeLayoutFrames, contrastRatio, controlInteractive, controlSize, controlSizeIcon, controlSizes, countLeaves, countLines, createLayoutState, cva, defaultDarkThemeId, defaultLightThemeId, defaultThemeSelection, densityTokens, designTokens, diffLineVariants, diffStats, diffTargetPath, elevationTokens, entityIconVariants, expandAll, findTokenRanges, focusPane, fontOptions, formatBytes, formatReleaseDate, formatToken, initialsFrom, inlineScriptLiteral, isPasteBlock, itemVariants, keyedRows, layoutDepth, listLeaves, monogram, motionTokens, movePane, neighborLeaf, nextSeq, normalizeLayout, parseDiff, plainTextFromMarkdown, pruneBlocks, radiusTokens, recollapsePastes, remapCarriedBlocks, resizeSplit, resolvedDensity, sheetVariants, shouldCollapse, sidebarNavItemClass, sidebarNavItemStateClass, splitPane, statusDotVariants, stripTrailingBlankLines, surfaceInteractive, swapPanes, themeById, themeCssVariables, themeFamilies, themeScript, themesForAppearance, toast, toaster, toggleVariants, tokenRangeAt, transcriptDisclosureKey, typographyTokens, undoClosePane, undocumentedTokenAliases, useSideRail, useTheme, validateTheme, validateThemeRegistry, zIndexTokens };

package/dist/r/native-select.json

@@ -0,0 +1,24 @@
+{
+  "name": "native-select",
+  "type": "registry:ui",
+  "title": "Native Select",
+  "description": "A themed wrapper around the browser's native `<select>` element.",
+  "dependencies": [
+    "lucide-solid@^1.48.0"
+  ],
+  "registryDependencies": [
+    "lib"
+  ],
+  "files": [
+    {
+      "path": "src/components/ui/native-select/index.ts",
+      "type": "registry:ui",
+      "target": "components/ui/native-select/index.ts"
+    },
+    {
+      "path": "src/components/ui/native-select/native-select.tsx",
+      "type": "registry:ui",
+      "target": "components/ui/native-select/native-select.tsx"
+    }
+  ]
+}

package/dist/r/registry.json

@@ -881,6 +881,30 @@
         }
       ]
     },
+    {
+      "name": "native-select",
+      "type": "registry:ui",
+      "title": "Native Select",
+      "description": "A themed wrapper around the browser's native `<select>` element.",
+      "dependencies": [
+        "lucide-solid@^1.48.0"
+      ],
+      "registryDependencies": [
+        "lib"
+      ],
+      "files": [
+        {
+          "path": "src/components/ui/native-select/index.ts",
+          "type": "registry:ui",
+          "target": "components/ui/native-select/index.ts"
+        },
+        {
+          "path": "src/components/ui/native-select/native-select.tsx",
+          "type": "registry:ui",
+          "target": "components/ui/native-select/native-select.tsx"
+        }
+      ]
+    },
     {
       "name": "navigation-menu",
       "type": "registry:ui",

package/dist/r/src/components/ui/native-select/index.ts

@@ -0,0 +1,2 @@
+/** A themed wrapper around the browser's native `<select>` element. */
+export { NativeSelect, type NativeSelectProps } from './native-select'

package/dist/r/src/components/ui/native-select/native-select.tsx

@@ -0,0 +1,95 @@
+import { ChevronDownIcon } from 'lucide-solid'
+import type { ComponentProps } from 'solid-js'
+import { createEffect, onMount, splitProps } from 'solid-js'
+import { cn } from '../../../lib/utils'
+
+export type NativeSelectProps = ComponentProps<'select'> & {
+  /** Initialize an uncontrolled selection after its native options mount. */
+  defaultValue?: ComponentProps<'select'>['value']
+}
+
+function setSelectedValue(
+  select: HTMLSelectElement,
+  value: ComponentProps<'select'>['value'],
+  multiple: boolean
+) {
+  if (value === undefined) return
+
+  if (multiple && Array.isArray(value)) {
+    const selected = new Set(value.map(String))
+    for (const option of select.options) option.selected = selected.has(option.value)
+    return
+  }
+
+  select.value = String(Array.isArray(value) ? (value[0] ?? '') : value)
+}
+
+function initializeDefaultSelection(
+  select: HTMLSelectElement,
+  value: ComponentProps<'select'>['value'],
+  multiple: boolean
+) {
+  if (value === undefined) return
+
+  const defaultValues =
+    multiple && Array.isArray(value)
+      ? new Set(value.map(String))
+      : new Set([String(Array.isArray(value) ? (value[0] ?? '') : value)])
+
+  for (const option of select.options) option.defaultSelected = defaultValues.has(option.value)
+  setSelectedValue(select, value, multiple)
+}
+
+/**
+ * NativeSelect.
+ *
+ * A styled native `<select>` for compact, finite choices. Use `Select` when the
+ * list needs a custom popover, typed options, or runtime filtering; this keeps
+ * the browser's built-in keyboard, form, option, and label behavior.
+ *
+ * Translated from shadcn/ui's MIT-licensed NativeSelect wrapper to SolidJS and
+ * the Adea token system; see the root NOTICE for source and attribution.
+ */
+export function NativeSelect(props: NativeSelectProps) {
+  const [local, rest] = splitProps(props, ['class', 'children', 'defaultValue'])
+  let select: HTMLSelectElement | undefined
+
+  // Set selection after native options exist; setting select.value before its
+  // children are mounted makes browsers fall back to the first option.
+  createEffect(() => {
+    if (!select) return
+    setSelectedValue(select, rest.value, Boolean(rest.multiple))
+  })
+  onMount(() => {
+    if (select && rest.value === undefined) {
+      initializeDefaultSelection(select, local.defaultValue, Boolean(rest.multiple))
+    }
+  })
+
+  return (
+    <span data-slot="native-select-wrapper" class="relative inline-flex min-w-0">
+      <select
+        ref={(element) => {
+          select = element
+        }}
+        data-slot="native-select"
+        class={cn(
+          'h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm',
+          'transition-[color,box-shadow,border-color] ease-out outline-none',
+          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',
+          'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle',
+          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30',
+          local.class
+        )}
+        {...rest}
+      >
+        {local.children}
+      </select>
+      <ChevronDownIcon
+        data-slot="native-select-icon"
+        aria-hidden="true"
+        class="pointer-events-none absolute end-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"
+      />
+    </span>
+  )
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adea-ai/ui",
-  "version": "0.70.2",
+  "version": "0.71.1",
   "description": "The Adea design system: Kobalte-backed Solid components, semantic OKLCH tokens, and the app-shell layout primitives shared by Adea and Cortana.",
   "keywords": [
     "adea",
@@ -102,6 +102,7 @@
     "check:packed-transcript": "bun scripts/check-packed-transcript.ts",
     "check:packed-layout-renderer": "bun scripts/check-packed-layout-renderer.ts",
     "check:packed-appearance": "bun scripts/check-packed-appearance.ts",
+    "check:packed-native-select": "bun scripts/check-packed-native-select.ts",
     "check:packed-paste-model": "node scripts/check-packed-paste-model.mjs"
   },
   "dependencies": {

package/registry.json

@@ -881,6 +881,30 @@
         }
       ]
     },
+    {
+      "name": "native-select",
+      "type": "registry:ui",
+      "title": "Native Select",
+      "description": "A themed wrapper around the browser's native `<select>` element.",
+      "dependencies": [
+        "lucide-solid@^1.48.0"
+      ],
+      "registryDependencies": [
+        "lib"
+      ],
+      "files": [
+        {
+          "path": "src/components/ui/native-select/index.ts",
+          "type": "registry:ui",
+          "target": "components/ui/native-select/index.ts"
+        },
+        {
+          "path": "src/components/ui/native-select/native-select.tsx",
+          "type": "registry:ui",
+          "target": "components/ui/native-select/native-select.tsx"
+        }
+      ]
+    },
     {
       "name": "navigation-menu",
       "type": "registry:ui",

package/src/components/ui/native-select/index.ts

@@ -0,0 +1,2 @@
+/** A themed wrapper around the browser's native `<select>` element. */
+export { NativeSelect, type NativeSelectProps } from './native-select'

package/src/components/ui/native-select/native-select.tsx

@@ -0,0 +1,95 @@
+import { ChevronDownIcon } from 'lucide-solid'
+import type { ComponentProps } from 'solid-js'
+import { createEffect, onMount, splitProps } from 'solid-js'
+import { cn } from '#lib/utils'
+
+export type NativeSelectProps = ComponentProps<'select'> & {
+  /** Initialize an uncontrolled selection after its native options mount. */
+  defaultValue?: ComponentProps<'select'>['value']
+}
+
+function setSelectedValue(
+  select: HTMLSelectElement,
+  value: ComponentProps<'select'>['value'],
+  multiple: boolean
+) {
+  if (value === undefined) return
+
+  if (multiple && Array.isArray(value)) {
+    const selected = new Set(value.map(String))
+    for (const option of select.options) option.selected = selected.has(option.value)
+    return
+  }
+
+  select.value = String(Array.isArray(value) ? (value[0] ?? '') : value)
+}
+
+function initializeDefaultSelection(
+  select: HTMLSelectElement,
+  value: ComponentProps<'select'>['value'],
+  multiple: boolean
+) {
+  if (value === undefined) return
+
+  const defaultValues =
+    multiple && Array.isArray(value)
+      ? new Set(value.map(String))
+      : new Set([String(Array.isArray(value) ? (value[0] ?? '') : value)])
+
+  for (const option of select.options) option.defaultSelected = defaultValues.has(option.value)
+  setSelectedValue(select, value, multiple)
+}
+
+/**
+ * NativeSelect.
+ *
+ * A styled native `<select>` for compact, finite choices. Use `Select` when the
+ * list needs a custom popover, typed options, or runtime filtering; this keeps
+ * the browser's built-in keyboard, form, option, and label behavior.
+ *
+ * Translated from shadcn/ui's MIT-licensed NativeSelect wrapper to SolidJS and
+ * the Adea token system; see the root NOTICE for source and attribution.
+ */
+export function NativeSelect(props: NativeSelectProps) {
+  const [local, rest] = splitProps(props, ['class', 'children', 'defaultValue'])
+  let select: HTMLSelectElement | undefined
+
+  // Set selection after native options exist; setting select.value before its
+  // children are mounted makes browsers fall back to the first option.
+  createEffect(() => {
+    if (!select) return
+    setSelectedValue(select, rest.value, Boolean(rest.multiple))
+  })
+  onMount(() => {
+    if (select && rest.value === undefined) {
+      initializeDefaultSelection(select, local.defaultValue, Boolean(rest.multiple))
+    }
+  })
+
+  return (
+    <span data-slot="native-select-wrapper" class="relative inline-flex min-w-0">
+      <select
+        ref={(element) => {
+          select = element
+        }}
+        data-slot="native-select"
+        class={cn(
+          'h-control-md min-w-0 appearance-none rounded-md border border-input bg-transparent px-control-md pr-9 text-sm',
+          'transition-[color,box-shadow,border-color] ease-out outline-none',
+          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',
+          'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive-subtle',
+          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30',
+          local.class
+        )}
+        {...rest}
+      >
+        {local.children}
+      </select>
+      <ChevronDownIcon
+        data-slot="native-select-icon"
+        aria-hidden="true"
+        class="pointer-events-none absolute end-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"
+      />
+    </span>
+  )
+}

package/src/index.ts

@@ -58,6 +58,7 @@ export * from './components/ui/radio-group'
 export * from './components/ui/resizable'
 export * from './components/ui/scroll-area'
 export * from './components/ui/select'
+export * from './components/ui/native-select'
 export * from './components/ui/separator'
 export * from './components/ui/sheet'
 export * from './components/ui/skeleton'