50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T4212,"use client" import * as React from "react" import { ChevronDownIcon } from "lucide-react" import { createPortal } from "react-dom" import { cn } from "@/lib/utils" /* ============================================================================= * Select — compound dropdown for Motoko UI * * Usage (compound): * * * Usage (options kit): * * ============================================================================= */ // --------------------------------------------------------------------------- // Types // --------------------------------------------------------------------------- type SelectSize = "sm" | "default" export interface SelectProps { children: React.ReactNode /** Controlled selected value. */ value?: string /** Initial value for uncontrolled mode. */ defaultValue?: string /** Fires when the user picks an option. */ onValueChange?: (value: string) => void /** Fallback text when nothing is selected. */ placeholder?: React.ReactNode /** Extra classes on the root wrapper. */ className?: string /** Disables the whole control (trigger + items). */ disabled?: boolean } export interface SelectTriggerProps extends React.ButtonHTMLAttributes { size?: SelectSize } export interface SelectValueProps extends React.HTMLAttributes { /** Overrides the placeholder from `Select`. */ placeholder?: React.ReactNode } export type SelectContentProps = React.HTMLAttributes export interface SelectItemProps extends Omit< React.HTMLAttributes, "onSelect" > { value: string disabled?: boolean } export interface SelectKitOption { value: string label: React.ReactNode } export interface SelectKitProps { options: SelectKitOption[] value?: string defaultValue?: string onValueChange?: (value: string) => void placeholder?: React.ReactNode disabled?: boolean /** Classes on the root wrapper. */ className?: string /** Classes on the trigger button. */ classNameTrigger?: string size?: SelectSize } interface SelectContextValue { open: boolean setOpen: (open: boolean) => void value: string selectValue: (next: string, label: React.ReactNode) => void placeholder: React.ReactNode disabled: boolean /** Label for the current value, pushed by SelectItem. */ selectedLabel: React.ReactNode | null /** Sync trigger label when an item mounts already selected (e.g. defaultValue). */ syncLabel: (value: string, label: React.ReactNode) => void triggerRef: React.RefObject contentRef: React.RefObject contentId: string } // --------------------------------------------------------------------------- // Context // --------------------------------------------------------------------------- const SelectContext = React.createContext(null) function useSelectContext(component: string): SelectContextValue { const ctx = React.useContext(SelectContext) if (!ctx) { throw new Error(`${component} must be used within {options.map((option) => ( {option.label} ))} ) } export { Select, SelectTrigger, SelectValue, SelectContent, SelectItem, SelectKit, } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L50",null,{"namespace":"@motokoui","registryDependencies":["utils"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"registry/motokoui/select.tsx","content":"$52","type":"registry:ui","target":"components/ui/select.tsx"}],"className":"h-[70svh] min-h-80"}]]}]