@alpic-ai/ui 0.0.0

package/dist/components/button.d.mts

@@ -0,0 +1,29 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as React from "react";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/components/button.d.ts
+declare const buttonVariants: (props?: ({
+  variant?: "secondary" | "primary" | "destructive" | "tertiary" | "link" | "link-muted" | null | undefined;
+  size?: "default" | "pill" | "icon" | "icon-rounded" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+interface ButtonProps extends React.ComponentProps<"button">, VariantProps<typeof buttonVariants> {
+  asChild?: boolean;
+  loading?: boolean;
+  icon?: React.ReactNode;
+}
+declare function Button({
+  className,
+  variant,
+  size,
+  type,
+  asChild,
+  loading,
+  icon,
+  disabled,
+  children,
+  ...props
+}: ButtonProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Button, type ButtonProps, buttonVariants };

package/dist/components/button.mjs

@@ -0,0 +1,67 @@
+"use client";
+import { cn } from "../lib/cn.mjs";
+import { Loader2 } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { Slot } from "@radix-ui/react-slot";
+//#region src/components/button.tsx
+const buttonVariants = cva([
+	"inline-flex items-center justify-center gap-1 whitespace-nowrap",
+	"h-8 px-2 rounded-md",
+	"font-medium",
+	"transition-colors",
+	"outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+	"[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0",
+	"disabled:pointer-events-none disabled:opacity-50"
+].join(" "), {
+	variants: {
+		variant: {
+			primary: ["bg-primary text-primary-foreground", "[@media(hover:hover)]:hover:bg-primary-hover"].join(" "),
+			secondary: ["border border-border bg-background text-muted-foreground", "[@media(hover:hover)]:hover:bg-background-hover [@media(hover:hover)]:hover:text-muted-foreground-hover"].join(" "),
+			tertiary: [
+				"text-muted-foreground",
+				"[@media(hover:hover)]:hover:bg-background-hover [@media(hover:hover)]:hover:text-muted-foreground-hover",
+				"focus-visible:bg-background"
+			].join(" "),
+			link: [
+				"h-auto px-0 rounded-xs underline-offset-4",
+				"text-link",
+				"[@media(hover:hover)]:hover:underline",
+				"focus-visible:bg-background"
+			].join(" "),
+			"link-muted": [
+				"h-auto px-0 rounded-xs underline-offset-4",
+				"text-link-muted",
+				"[@media(hover:hover)]:hover:underline",
+				"focus-visible:bg-background"
+			].join(" "),
+			destructive: ["bg-destructive text-destructive-foreground", "[@media(hover:hover)]:hover:bg-destructive-hover"].join(" ")
+		},
+		size: {
+			default: "type-text-sm",
+			icon: "size-8 p-0 type-text-sm",
+			"icon-rounded": "size-8 p-0 rounded-full type-text-sm",
+			pill: "h-7 px-3 rounded-full type-text-xs"
+		}
+	},
+	defaultVariants: {
+		variant: "primary",
+		size: "default"
+	}
+});
+function Button({ className, variant, size, type = "button", asChild = false, loading = false, icon, disabled, children, ...props }) {
+	return /* @__PURE__ */ jsx(asChild ? Slot : "button", {
+		"data-slot": "button",
+		className: cn(buttonVariants({
+			variant,
+			size
+		}), className),
+		type,
+		disabled: disabled || loading,
+		"aria-busy": loading || void 0,
+		...props,
+		children: asChild ? children : /* @__PURE__ */ jsxs(Fragment, { children: [loading ? /* @__PURE__ */ jsx(Loader2, { className: "motion-safe:animate-spin" }) : icon, children] })
+	});
+}
+//#endregion
+export { Button, buttonVariants };

package/dist/components/card.d.mts

@@ -0,0 +1,37 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React from "react";
+
+//#region src/components/card.d.ts
+declare function Card({
+  className,
+  hoverable,
+  ...props
+}: React.ComponentProps<"div"> & {
+  hoverable?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function CardHeader({
+  className,
+  ...props
+}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+declare function CardTitle({
+  className,
+  ...props
+}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+declare function CardDescription({
+  className,
+  ...props
+}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+declare function CardAction({
+  className,
+  ...props
+}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+declare function CardContent({
+  className,
+  ...props
+}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+declare function CardFooter({
+  className,
+  ...props
+}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/components/card.mjs

@@ -0,0 +1,54 @@
+import { cn } from "../lib/cn.mjs";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/card.tsx
+function Card({ className, hoverable, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card",
+		className: cn("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6", hoverable && "transition-shadow [@media(hover:hover)]:hover:shadow-lg", className),
+		...props
+	});
+}
+function CardHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-header",
+		className: cn("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", className),
+		...props
+	});
+}
+function CardTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-title",
+		className: cn("type-text-md font-semibold leading-none", className),
+		...props
+	});
+}
+function CardDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-description",
+		className: cn("type-text-sm text-muted-foreground", className),
+		...props
+	});
+}
+function CardAction({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-action",
+		className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className),
+		...props
+	});
+}
+function CardContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-content",
+		className: cn("px-6", className),
+		...props
+	});
+}
+function CardFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-footer",
+		className: cn("flex items-center px-6 [.border-t]:pt-6", className),
+		...props
+	});
+}
+//#endregion
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/components/checkbox.d.mts

@@ -0,0 +1,11 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React from "react";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+
+//#region src/components/checkbox.d.ts
+declare function Checkbox({
+  className,
+  ...props
+}: React.ComponentProps<typeof CheckboxPrimitive.Root>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Checkbox };

package/dist/components/checkbox.mjs

@@ -0,0 +1,26 @@
+"use client";
+import { cn } from "../lib/cn.mjs";
+import { CheckIcon, MinusIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+//#region src/components/checkbox.tsx
+function Checkbox({ className, ...props }) {
+	return /* @__PURE__ */ jsx(CheckboxPrimitive.Root, {
+		"data-slot": "checkbox",
+		className: cn("peer size-4 shrink-0 rounded-xs border border-border bg-background", "not-disabled:data-[state=checked]:border-primary not-disabled:data-[state=checked]:bg-primary not-disabled:data-[state=checked]:text-primary-foreground", "not-disabled:data-[state=indeterminate]:border-primary not-disabled:data-[state=indeterminate]:bg-primary not-disabled:data-[state=indeterminate]:text-primary-foreground", "transition-colors", "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background", "disabled:pointer-events-none disabled:bg-muted disabled:border-border disabled:text-border", className),
+		...props,
+		children: /* @__PURE__ */ jsxs(CheckboxPrimitive.Indicator, {
+			"data-slot": "checkbox-indicator",
+			className: "flex items-center justify-center text-current [&[data-state=indeterminate]>svg:first-child]:hidden [&[data-state=checked]>svg:last-child]:hidden",
+			children: [/* @__PURE__ */ jsx(CheckIcon, {
+				className: "size-3",
+				strokeWidth: 4
+			}), /* @__PURE__ */ jsx(MinusIcon, {
+				className: "size-3",
+				strokeWidth: 4
+			})]
+		})
+	});
+}
+//#endregion
+export { Checkbox };

package/dist/components/collapsible.d.mts

@@ -0,0 +1,16 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React from "react";
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+
+//#region src/components/collapsible.d.ts
+declare function Collapsible({
+  ...props
+}: React.ComponentProps<typeof CollapsiblePrimitive.Root>): _$react_jsx_runtime0.JSX.Element;
+declare function CollapsibleTrigger({
+  ...props
+}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): _$react_jsx_runtime0.JSX.Element;
+declare function CollapsibleContent({
+  ...props
+}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/components/collapsible.mjs

@@ -0,0 +1,24 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+//#region src/components/collapsible.tsx
+function Collapsible({ ...props }) {
+	return /* @__PURE__ */ jsx(CollapsiblePrimitive.Root, {
+		"data-slot": "collapsible",
+		...props
+	});
+}
+function CollapsibleTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(CollapsiblePrimitive.CollapsibleTrigger, {
+		"data-slot": "collapsible-trigger",
+		...props
+	});
+}
+function CollapsibleContent({ ...props }) {
+	return /* @__PURE__ */ jsx(CollapsiblePrimitive.CollapsibleContent, {
+		"data-slot": "collapsible-content",
+		...props
+	});
+}
+//#endregion
+export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/components/combobox.d.mts

@@ -0,0 +1,86 @@
+import { PopoverContent } from "./popover.mjs";
+import { selectTriggerVariants } from "./select-trigger-variants.mjs";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import { ReactNode } from "react";
+import { Command } from "cmdk";
+
+//#region src/components/combobox.d.ts
+interface ComboboxBaseProps {
+  children: ReactNode;
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (open: boolean) => void;
+}
+interface ComboboxSingleProps extends ComboboxBaseProps {
+  multiple?: false;
+  value?: string | null;
+  defaultValue?: string | null;
+  onValueChange?: (value: string | null) => void;
+}
+interface ComboboxMultipleProps extends ComboboxBaseProps {
+  multiple: true;
+  value?: string[];
+  defaultValue?: string[];
+  onValueChange?: (value: string[]) => void;
+}
+type ComboboxProps = ComboboxSingleProps | ComboboxMultipleProps;
+declare function Combobox(props: ComboboxProps): _$react_jsx_runtime0.JSX.Element;
+interface ComboboxTriggerProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size">, VariantProps<typeof selectTriggerVariants> {
+  placeholder?: string;
+}
+declare function ComboboxTrigger({
+  className,
+  size,
+  placeholder,
+  children,
+  ...props
+}: ComboboxTriggerProps): _$react_jsx_runtime0.JSX.Element;
+interface ComboboxContentProps extends React.ComponentProps<typeof PopoverContent> {
+  className?: string;
+  children?: ReactNode;
+  filter?: React.ComponentProps<typeof Command>["filter"];
+}
+declare function ComboboxContent({
+  className,
+  children,
+  filter,
+  ...props
+}: ComboboxContentProps): _$react_jsx_runtime0.JSX.Element;
+declare function ComboboxSearch({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command.Input>): _$react_jsx_runtime0.JSX.Element;
+declare function ComboboxList({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command.List>): _$react_jsx_runtime0.JSX.Element;
+declare function ComboboxEmpty({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command.Empty>): _$react_jsx_runtime0.JSX.Element;
+declare function ComboboxGroup({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command.Group>): _$react_jsx_runtime0.JSX.Element;
+declare function ComboboxSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command.Separator>): _$react_jsx_runtime0.JSX.Element;
+interface ComboboxItemProps extends Omit<React.ComponentProps<typeof Command.Item>, "onSelect"> {
+  /** The value stored when this item is selected */
+  itemValue: string;
+}
+declare function ComboboxItem({
+  className,
+  children,
+  itemValue,
+  ...props
+}: ComboboxItemProps): _$react_jsx_runtime0.JSX.Element;
+declare function ComboboxItemText({
+  className,
+  children,
+  ...props
+}: React.HTMLAttributes<HTMLSpanElement>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxItem, ComboboxItemText, ComboboxList, ComboboxSearch, ComboboxSeparator, ComboboxTrigger };

package/dist/components/combobox.mjs

@@ -0,0 +1,207 @@
+"use client";
+import { cn } from "../lib/cn.mjs";
+import { Popover, PopoverContent, PopoverTrigger } from "./popover.mjs";
+import { selectTriggerVariants } from "./select-trigger-variants.mjs";
+import { TagDismissible } from "./tag.mjs";
+import { CheckIcon, ChevronDownIcon, SearchIcon } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useMemo, useState } from "react";
+import { Command } from "cmdk";
+//#region src/components/combobox.tsx
+const ComboboxContext = createContext(null);
+function useComboboxContext() {
+	const context = useContext(ComboboxContext);
+	if (!context) throw new Error("Combobox compound components must be used within <Combobox>");
+	return context;
+}
+function Combobox(props) {
+	const { children, multiple = false, open: controlledOpen, defaultOpen = false, onOpenChange: controlledOnOpenChange } = props;
+	const [uncontrolledSingleValue, setUncontrolledSingleValue] = useState(!multiple ? props.defaultValue ?? null : null);
+	const [uncontrolledMultiValue, setUncontrolledMultiValue] = useState(multiple ? props.defaultValue ?? [] : []);
+	const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
+	const isOpenControlled = controlledOpen !== void 0;
+	const open = isOpenControlled ? controlledOpen : uncontrolledOpen;
+	const onOpenChange = useCallback((newOpen) => {
+		if (!isOpenControlled) setUncontrolledOpen(newOpen);
+		controlledOnOpenChange?.(newOpen);
+	}, [isOpenControlled, controlledOnOpenChange]);
+	const singleValue = multiple ? null : (props.value !== void 0 ? props.value : uncontrolledSingleValue) ?? null;
+	const multiValues = multiple ? props.value !== void 0 ? props.value : uncontrolledMultiValue : [];
+	const isSelected = useCallback((itemValue) => {
+		if (multiple) return multiValues.includes(itemValue);
+		return singleValue === itemValue;
+	}, [
+		multiple,
+		singleValue,
+		multiValues
+	]);
+	const onValueChangeSingle = !multiple ? props.onValueChange : void 0;
+	const onValueChangeMulti = multiple ? props.onValueChange : void 0;
+	const isControlledSingle = !multiple && props.value !== void 0;
+	const isControlledMulti = multiple && props.value !== void 0;
+	const onSelect = useCallback((itemValue) => {
+		if (multiple) {
+			const next = multiValues.includes(itemValue) ? multiValues.filter((val) => val !== itemValue) : [...multiValues, itemValue];
+			if (!isControlledMulti) setUncontrolledMultiValue(next);
+			onValueChangeMulti?.(next);
+		} else {
+			if (!isControlledSingle) setUncontrolledSingleValue(itemValue);
+			onValueChangeSingle?.(itemValue);
+			onOpenChange(false);
+		}
+	}, [
+		multiple,
+		isControlledMulti,
+		isControlledSingle,
+		onValueChangeMulti,
+		onValueChangeSingle,
+		multiValues,
+		onOpenChange
+	]);
+	const onDeselect = useCallback((itemValue) => {
+		if (!multiple) return;
+		const next = multiValues.filter((val) => val !== itemValue);
+		if (!isControlledMulti) setUncontrolledMultiValue(next);
+		onValueChangeMulti?.(next);
+	}, [
+		multiple,
+		isControlledMulti,
+		onValueChangeMulti,
+		multiValues
+	]);
+	const contextValue = useMemo(() => ({
+		multiple,
+		value: singleValue,
+		values: multiValues,
+		onSelect,
+		onDeselect,
+		isSelected,
+		open,
+		onOpenChange
+	}), [
+		multiple,
+		singleValue,
+		multiValues,
+		onSelect,
+		onDeselect,
+		isSelected,
+		open,
+		onOpenChange
+	]);
+	return /* @__PURE__ */ jsx(ComboboxContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx(Popover, {
+			open,
+			onOpenChange,
+			children
+		})
+	});
+}
+function ComboboxTrigger({ className, size, placeholder, children, ...props }) {
+	const { multiple, value, values, open, onDeselect } = useComboboxContext();
+	const isEmpty = multiple ? values.length === 0 : value === null || value === void 0;
+	return /* @__PURE__ */ jsx(PopoverTrigger, {
+		asChild: true,
+		children: /* @__PURE__ */ jsxs("button", {
+			type: "button",
+			"data-slot": "combobox-trigger",
+			role: "combobox",
+			"aria-expanded": open,
+			className: cn(selectTriggerVariants({ size }), className),
+			...props,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: cn("flex flex-1 items-center gap-1.5 text-left", multiple && "flex-wrap", isEmpty && "text-placeholder"),
+				children: isEmpty ? placeholder : multiple ? /* @__PURE__ */ jsx(ComboboxTags, {
+					values,
+					onDeselect
+				}) : children
+			}), /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-5 shrink-0 text-muted-foreground" })]
+		})
+	});
+}
+function ComboboxTags({ values, onDeselect }) {
+	return /* @__PURE__ */ jsx(Fragment, { children: values.map((tagValue) => /* @__PURE__ */ jsx(TagDismissible, {
+		onClick: (event) => event.stopPropagation(),
+		onDismiss: () => onDeselect(tagValue),
+		children: tagValue
+	}, tagValue)) });
+}
+function ComboboxContent({ className, children, filter, ...props }) {
+	const { multiple } = useComboboxContext();
+	return /* @__PURE__ */ jsx(PopoverContent, {
+		className: cn("w-[var(--radix-popover-trigger-width)] p-0", className),
+		align: "start",
+		onOpenAutoFocus: multiple ? (event) => event.preventDefault() : void 0,
+		...props,
+		children: /* @__PURE__ */ jsx(Command, {
+			"data-slot": "combobox-command",
+			filter,
+			className: "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover",
+			children
+		})
+	});
+}
+function ComboboxSearch({ className, ...props }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "combobox-search",
+		className: "flex items-center gap-2 border-b border-border-secondary px-3 py-2.5",
+		children: [/* @__PURE__ */ jsx(SearchIcon, { className: "size-5 shrink-0 text-muted-foreground" }), /* @__PURE__ */ jsx(Command.Input, {
+			"data-slot": "combobox-search-input",
+			className: cn("flex h-full w-full bg-transparent type-text-md font-medium text-foreground outline-hidden", "placeholder:text-placeholder", "disabled:cursor-not-allowed disabled:opacity-50", className),
+			...props
+		})]
+	});
+}
+function ComboboxList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command.List, {
+		"data-slot": "combobox-list",
+		className: cn("max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto py-1", className),
+		...props
+	});
+}
+function ComboboxEmpty({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command.Empty, {
+		"data-slot": "combobox-empty",
+		className: cn("py-6 text-center type-text-sm text-muted-foreground", className),
+		...props
+	});
+}
+function ComboboxGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command.Group, {
+		"data-slot": "combobox-group",
+		className: cn("overflow-hidden [&_[cmdk-group-heading]]:px-3 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:type-text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-subtle-foreground", className),
+		...props
+	});
+}
+function ComboboxSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command.Separator, {
+		"data-slot": "combobox-separator",
+		className: cn("bg-border-secondary -mx-1 my-1 h-px", className),
+		...props
+	});
+}
+function ComboboxItem({ className, children, itemValue, ...props }) {
+	const { onSelect, isSelected } = useComboboxContext();
+	const selected = isSelected(itemValue);
+	return /* @__PURE__ */ jsxs(Command.Item, {
+		"data-slot": "combobox-item",
+		"data-selected-item": selected || void 0,
+		onSelect: () => onSelect(itemValue),
+		className: cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-2.5 outline-hidden select-none", "type-text-md font-medium text-foreground mx-1.5 my-px", "data-[selected=true]:bg-background-hover", "data-[selected-item]:bg-accent", "data-[disabled=true]:pointer-events-none data-[disabled=true]:text-disabled-foreground", "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-5", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "flex flex-1 items-center gap-2 truncate",
+			children
+		}), selected && /* @__PURE__ */ jsx(CheckIcon, { className: "size-5 shrink-0 text-primary" })]
+	});
+}
+function ComboboxItemText({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "combobox-item-text",
+		className: cn("type-text-md font-normal text-subtle-foreground", className),
+		...props,
+		children
+	});
+}
+//#endregion
+export { Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxItem, ComboboxItemText, ComboboxList, ComboboxSearch, ComboboxSeparator, ComboboxTrigger };

package/dist/components/command.d.mts

@@ -0,0 +1,38 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React from "react";
+import { Command as Command$1 } from "cmdk";
+
+//#region src/components/command.d.ts
+declare function Command({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command$1>): _$react_jsx_runtime0.JSX.Element;
+declare function CommandInput({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command$1.Input>): _$react_jsx_runtime0.JSX.Element;
+declare function CommandList({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command$1.List>): _$react_jsx_runtime0.JSX.Element;
+declare function CommandEmpty({
+  ...props
+}: React.ComponentProps<typeof Command$1.Empty>): _$react_jsx_runtime0.JSX.Element;
+declare function CommandGroup({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command$1.Group>): _$react_jsx_runtime0.JSX.Element;
+declare function CommandSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command$1.Separator>): _$react_jsx_runtime0.JSX.Element;
+declare function CommandItem({
+  className,
+  ...props
+}: React.ComponentProps<typeof Command$1.Item>): _$react_jsx_runtime0.JSX.Element;
+declare function CommandShortcut({
+  className,
+  ...props
+}: React.ComponentProps<"span">): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };

package/dist/components/command.mjs

@@ -0,0 +1,68 @@
+"use client";
+import { cn } from "../lib/cn.mjs";
+import { SearchIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Command as Command$1 } from "cmdk";
+//#region src/components/command.tsx
+function Command({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1, {
+		"data-slot": "command",
+		className: cn("bg-popover text-foreground flex h-full w-full flex-col overflow-hidden rounded-md", className),
+		...props
+	});
+}
+function CommandInput({ className, ...props }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "command-input-wrapper",
+		className: "flex h-14 items-center gap-2 border-b p-3",
+		children: [/* @__PURE__ */ jsx(SearchIcon, { className: "size-5 shrink-0 text-muted-foreground" }), /* @__PURE__ */ jsx(Command$1.Input, {
+			"data-slot": "command-input",
+			className: cn("placeholder:text-placeholder flex h-full w-full bg-transparent type-text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className),
+			...props
+		})]
+	});
+}
+function CommandList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.List, {
+		"data-slot": "command-list",
+		className: cn("max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto", className),
+		...props
+	});
+}
+function CommandEmpty({ ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Empty, {
+		"data-slot": "command-empty",
+		className: "py-6 text-center type-text-sm text-muted-foreground",
+		...props
+	});
+}
+function CommandGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Group, {
+		"data-slot": "command-group",
+		className: cn("text-foreground [&_[cmdk-group-heading]]:text-subtle-foreground overflow-hidden px-2 py-1 [&_[cmdk-group-heading]]:p-2 [&_[cmdk-group-heading]]:type-text-xs [&_[cmdk-group-heading]]:font-medium", className),
+		...props
+	});
+}
+function CommandSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Separator, {
+		"data-slot": "command-separator",
+		className: cn("bg-border -mx-1 h-px", className),
+		...props
+	});
+}
+function CommandItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Item, {
+		"data-slot": "command-item",
+		className: cn("data-[selected=true]:bg-background-hover [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-xs px-2 py-3 type-text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:text-disabled-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-5", className),
+		...props
+	});
+}
+function CommandShortcut({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "command-shortcut",
+		className: cn("ml-auto shrink-0 rounded-xs border border-border-secondary px-1 py-px type-text-xs font-medium text-placeholder", className),
+		...props
+	});
+}
+//#endregion
+export { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };