@ravenopsnet/ui 0.0.1 → 0.0.2

package/dist/components/ui/card.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+declare function Card({ className, size, ...props }: React.ComponentProps<"div"> & {
+    size?: "default" | "sm";
+}): React.JSX.Element;
+declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardAction({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, };

package/dist/components/ui/card.js

@@ -0,0 +1,56 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/ui/card.tsx
+function n({ className: n, size: r = "default", ...i }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "card",
+		"data-size": r,
+		className: e("group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl", n),
+		...i
+	});
+}
+function r({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "card-header",
+		className: e("group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3", n),
+		...r
+	});
+}
+function i({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "card-title",
+		className: e("font-heading text-base leading-snug font-medium group-data-[size=sm]/card:text-sm", n),
+		...r
+	});
+}
+function a({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "card-description",
+		className: e("text-sm text-muted-foreground", n),
+		...r
+	});
+}
+function o({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "card-action",
+		className: e("col-start-2 row-span-2 row-start-1 self-start justify-self-end", n),
+		...r
+	});
+}
+function s({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "card-content",
+		className: e("px-4 group-data-[size=sm]/card:px-3", n),
+		...r
+	});
+}
+function c({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "card-footer",
+		className: e("flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3", n),
+		...r
+	});
+}
+//#endregion
+export { n as Card, o as CardAction, s as CardContent, a as CardDescription, c as CardFooter, r as CardHeader, i as CardTitle };

package/dist/components/ui/carousel.d.ts

@@ -0,0 +1,28 @@
+import { default as useEmblaCarousel, UseEmblaCarouselType } from 'embla-carousel-react';
+import { Button } from './button';
+import * as React from "react";
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+type CarouselPlugin = UseCarouselParameters[1];
+type CarouselProps = {
+    opts?: CarouselOptions;
+    plugins?: CarouselPlugin;
+    orientation?: "horizontal" | "vertical";
+    setApi?: (api: CarouselApi) => void;
+};
+type CarouselContextProps = {
+    carouselRef: ReturnType<typeof useEmblaCarousel>[0];
+    api: ReturnType<typeof useEmblaCarousel>[1];
+    scrollPrev: () => void;
+    scrollNext: () => void;
+    canScrollPrev: boolean;
+    canScrollNext: boolean;
+} & CarouselProps;
+declare function useCarousel(): CarouselContextProps;
+declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React.ComponentProps<"div"> & CarouselProps): React.JSX.Element;
+declare function CarouselContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CarouselItem({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
+declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
+export { type CarouselApi, Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, useCarousel, };

package/dist/components/ui/carousel.js

@@ -0,0 +1,111 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "./button.js";
+import * as n from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { ChevronLeftIcon as a, ChevronRightIcon as o } from "lucide-react";
+import s from "embla-carousel-react";
+//#region src/components/ui/carousel.tsx
+var c = n.createContext(null);
+function l() {
+	let e = n.useContext(c);
+	if (!e) throw Error("useCarousel must be used within a <Carousel />");
+	return e;
+}
+function u({ orientation: t = "horizontal", opts: i, setApi: a, plugins: o, className: l, children: u, ...d }) {
+	let [f, p] = s({
+		...i,
+		axis: t === "horizontal" ? "x" : "y"
+	}, o), [m, h] = n.useState(!1), [g, _] = n.useState(!1), v = n.useCallback((e) => {
+		e && (h(e.canScrollPrev()), _(e.canScrollNext()));
+	}, []), y = n.useCallback(() => {
+		p?.scrollPrev();
+	}, [p]), b = n.useCallback(() => {
+		p?.scrollNext();
+	}, [p]), x = n.useCallback((e) => {
+		e.key === "ArrowLeft" ? (e.preventDefault(), y()) : e.key === "ArrowRight" && (e.preventDefault(), b());
+	}, [y, b]);
+	return n.useEffect(() => {
+		!p || !a || a(p);
+	}, [p, a]), n.useEffect(() => {
+		if (p) return v(p), p.on("reInit", v), p.on("select", v), () => {
+			p?.off("select", v);
+		};
+	}, [p, v]), /* @__PURE__ */ r(c.Provider, {
+		value: {
+			carouselRef: f,
+			api: p,
+			opts: i,
+			orientation: t || (i?.axis === "y" ? "vertical" : "horizontal"),
+			scrollPrev: y,
+			scrollNext: b,
+			canScrollPrev: m,
+			canScrollNext: g
+		},
+		children: /* @__PURE__ */ r("div", {
+			onKeyDownCapture: x,
+			className: e("relative", l),
+			role: "region",
+			"aria-roledescription": "carousel",
+			"data-slot": "carousel",
+			...d,
+			children: u
+		})
+	});
+}
+function d({ className: t, ...n }) {
+	let { carouselRef: i, orientation: a } = l();
+	return /* @__PURE__ */ r("div", {
+		ref: i,
+		className: "overflow-hidden",
+		"data-slot": "carousel-content",
+		children: /* @__PURE__ */ r("div", {
+			className: e("flex", a === "horizontal" ? "-ms-4" : "-mt-4 flex-col", t),
+			...n
+		})
+	});
+}
+function f({ className: t, ...n }) {
+	let { orientation: i } = l();
+	return /* @__PURE__ */ r("div", {
+		role: "group",
+		"aria-roledescription": "slide",
+		"data-slot": "carousel-item",
+		className: e("min-w-0 shrink-0 grow-0 basis-full", i === "horizontal" ? "ps-4" : "pt-4", t),
+		...n
+	});
+}
+function p({ className: n, variant: o = "outline", size: s = "icon-sm", ...c }) {
+	let { orientation: u, scrollPrev: d, canScrollPrev: f } = l();
+	return /* @__PURE__ */ i(t, {
+		"data-slot": "carousel-previous",
+		variant: o,
+		size: s,
+		className: e("absolute touch-manipulation rounded-full", u === "horizontal" ? "top-1/2 -start-12 -translate-y-1/2" : "-top-12 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rotate-90", n),
+		disabled: !f,
+		onClick: d,
+		...c,
+		children: [/* @__PURE__ */ r(a, { className: "rtl:rotate-180" }), /* @__PURE__ */ r("span", {
+			className: "sr-only",
+			children: "Previous slide"
+		})]
+	});
+}
+function m({ className: n, variant: a = "outline", size: s = "icon-sm", ...c }) {
+	let { orientation: u, scrollNext: d, canScrollNext: f } = l();
+	return /* @__PURE__ */ i(t, {
+		"data-slot": "carousel-next",
+		variant: a,
+		size: s,
+		className: e("absolute touch-manipulation rounded-full", u === "horizontal" ? "top-1/2 -end-12 -translate-y-1/2" : "-bottom-12 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rotate-90", n),
+		disabled: !f,
+		onClick: d,
+		...c,
+		children: [/* @__PURE__ */ r(o, { className: "rtl:rotate-180" }), /* @__PURE__ */ r("span", {
+			className: "sr-only",
+			children: "Next slide"
+		})]
+	});
+}
+//#endregion
+export { u as Carousel, d as CarouselContent, f as CarouselItem, m as CarouselNext, p as CarouselPrevious, l as useCarousel };

package/dist/components/ui/chart.d.ts

@@ -0,0 +1,44 @@
+import { TooltipValueType } from 'recharts';
+import * as React from "react";
+import * as RechartsPrimitive from "recharts";
+declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+type TooltipNameType = number | string;
+export type ChartConfig = Record<string, {
+    label?: React.ReactNode;
+    icon?: React.ComponentType;
+} & ({
+    color?: string;
+    theme?: never;
+} | {
+    color?: never;
+    theme: Record<keyof typeof THEMES, string>;
+})>;
+declare function ChartContainer({ id, className, children, config, initialDimension, ...props }: React.ComponentProps<"div"> & {
+    config: ChartConfig;
+    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
+    initialDimension?: {
+        width: number;
+        height: number;
+    };
+}): React.JSX.Element;
+declare const ChartStyle: ({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}) => React.JSX.Element | null;
+declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<"div"> & {
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    nameKey?: string;
+    labelKey?: string;
+} & Omit<RechartsPrimitive.DefaultTooltipContentProps<TooltipValueType, TooltipNameType>, "accessibilityLayer">): React.JSX.Element | null;
+declare const ChartLegend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
+declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<"div"> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+} & RechartsPrimitive.DefaultLegendContentProps): React.JSX.Element | null;
+export { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent, ChartStyle, };

package/dist/components/ui/chart.js

@@ -0,0 +1,130 @@
+import { cn as e } from "../../lib/utils.js";
+import * as t from "react";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+import * as a from "recharts";
+//#region src/components/ui/chart.tsx
+var o = {
+	light: "",
+	dark: ".dark"
+}, s = {
+	width: 320,
+	height: 200
+}, c = t.createContext(null);
+function l() {
+	let e = t.useContext(c);
+	if (!e) throw Error("useChart must be used within a <ChartContainer />");
+	return e;
+}
+function u({ id: n, className: o, children: l, config: u, initialDimension: f = s, ...p }) {
+	let m = t.useId(), h = `chart-${n ?? m.replace(/:/g, "")}`;
+	return /* @__PURE__ */ r(c.Provider, {
+		value: { config: u },
+		children: /* @__PURE__ */ i("div", {
+			"data-slot": "chart",
+			"data-chart": h,
+			className: e("flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", o),
+			...p,
+			children: [/* @__PURE__ */ r(d, {
+				id: h,
+				config: u
+			}), /* @__PURE__ */ r(a.ResponsiveContainer, {
+				initialDimension: f,
+				children: l
+			})]
+		})
+	});
+}
+var d = ({ id: e, config: t }) => {
+	let n = Object.entries(t).filter(([, e]) => e.theme ?? e.color);
+	return n.length ? /* @__PURE__ */ r("style", { dangerouslySetInnerHTML: { __html: Object.entries(o).map(([t, r]) => `
+${r} [data-chart=${e}] {
+${n.map(([e, n]) => {
+		let r = n.theme?.[t] ?? n.color;
+		return r ? `  --color-${e}: ${r};` : null;
+	}).join("\n")}
+}
+`).join("\n") } }) : null;
+}, f = a.Tooltip;
+function p({ active: a, payload: o, className: s, indicator: c = "dot", hideLabel: u = !1, hideIndicator: d = !1, label: f, labelFormatter: p, labelClassName: m, formatter: h, color: _, nameKey: v, labelKey: y }) {
+	let { config: b } = l(), x = t.useMemo(() => {
+		if (u || !o?.length) return null;
+		let [t] = o, n = g(b, t, `${y ?? t?.dataKey ?? t?.name ?? "value"}`), i = !y && typeof f == "string" ? b[f]?.label ?? f : n?.label;
+		return p ? /* @__PURE__ */ r("div", {
+			className: e("font-medium", m),
+			children: p(i, o)
+		}) : i ? /* @__PURE__ */ r("div", {
+			className: e("font-medium", m),
+			children: i
+		}) : null;
+	}, [
+		f,
+		p,
+		o,
+		u,
+		m,
+		b,
+		y
+	]);
+	if (!a || !o?.length) return null;
+	let S = o.length === 1 && c !== "dot";
+	return /* @__PURE__ */ i("div", {
+		className: e("grid min-w-32 items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl", s),
+		children: [S ? null : x, /* @__PURE__ */ r("div", {
+			className: "grid gap-1.5",
+			children: o.filter((e) => e.type !== "none").map((t, a) => {
+				let o = g(b, t, `${v ?? t.name ?? t.dataKey ?? "value"}`), s = _ ?? t.payload?.fill ?? t.color;
+				return /* @__PURE__ */ r("div", {
+					className: e("flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground", c === "dot" && "items-center"),
+					children: h && t?.value !== void 0 && t.name ? h(t.value, t.name, t, a, t.payload) : /* @__PURE__ */ i(n, { children: [o?.icon ? /* @__PURE__ */ r(o.icon, {}) : !d && /* @__PURE__ */ r("div", {
+						className: e("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", {
+							"h-2.5 w-2.5": c === "dot",
+							"w-1": c === "line",
+							"w-0 border-[1.5px] border-dashed bg-transparent": c === "dashed",
+							"my-0.5": S && c === "dashed"
+						}),
+						style: {
+							"--color-bg": s,
+							"--color-border": s
+						}
+					}), /* @__PURE__ */ i("div", {
+						className: e("flex flex-1 justify-between leading-none", S ? "items-end" : "items-center"),
+						children: [/* @__PURE__ */ i("div", {
+							className: "grid gap-1.5",
+							children: [S ? x : null, /* @__PURE__ */ r("span", {
+								className: "text-muted-foreground",
+								children: o?.label ?? t.name
+							})]
+						}), t.value != null && /* @__PURE__ */ r("span", {
+							className: "font-mono font-medium text-foreground tabular-nums",
+							children: typeof t.value == "number" ? t.value.toLocaleString() : String(t.value)
+						})]
+					})] })
+				}, a);
+			})
+		})]
+	});
+}
+var m = a.Legend;
+function h({ className: t, hideIcon: n = !1, payload: a, verticalAlign: o = "bottom", nameKey: s }) {
+	let { config: c } = l();
+	return a?.length ? /* @__PURE__ */ r("div", {
+		className: e("flex items-center justify-center gap-4", o === "top" ? "pb-3" : "pt-3", t),
+		children: a.filter((e) => e.type !== "none").map((t, a) => {
+			let o = g(c, t, `${s ?? t.dataKey ?? "value"}`);
+			return /* @__PURE__ */ i("div", {
+				className: e("flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground"),
+				children: [o?.icon && !n ? /* @__PURE__ */ r(o.icon, {}) : /* @__PURE__ */ r("div", {
+					className: "h-2 w-2 shrink-0 rounded-[2px]",
+					style: { backgroundColor: t.color }
+				}), o?.label]
+			}, a);
+		})
+	}) : null;
+}
+function g(e, t, n) {
+	if (typeof t != "object" || !t) return;
+	let r = "payload" in t && typeof t.payload == "object" && t.payload !== null ? t.payload : void 0, i = n;
+	return n in t && typeof t[n] == "string" ? i = t[n] : r && n in r && typeof r[n] == "string" && (i = r[n]), i in e ? e[i] : e[n];
+}
+//#endregion
+export { u as ChartContainer, m as ChartLegend, h as ChartLegendContent, d as ChartStyle, f as ChartTooltip, p as ChartTooltipContent };

package/dist/components/ui/checkbox.d.ts

@@ -0,0 +1,3 @@
+import { Checkbox as CheckboxPrimitive } from '@base-ui/react/checkbox';
+declare function Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props): import("react").JSX.Element;
+export { Checkbox };

package/dist/components/ui/checkbox.js

@@ -0,0 +1,20 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { jsx as t } from "react/jsx-runtime";
+import { CheckIcon as n } from "lucide-react";
+import { Checkbox as r } from "@base-ui/react/checkbox";
+//#region src/components/ui/checkbox.tsx
+function i({ className: i, ...a }) {
+	return /* @__PURE__ */ t(r.Root, {
+		"data-slot": "checkbox",
+		className: e("peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary", i),
+		...a,
+		children: /* @__PURE__ */ t(r.Indicator, {
+			"data-slot": "checkbox-indicator",
+			className: "grid place-content-center text-current transition-none [&>svg]:size-3.5",
+			children: /* @__PURE__ */ t(n, {})
+		})
+	});
+}
+//#endregion
+export { i as Checkbox };

package/dist/components/ui/collapsible.d.ts

@@ -0,0 +1,5 @@
+import { Collapsible as CollapsiblePrimitive } from '@base-ui/react/collapsible';
+declare function Collapsible({ ...props }: CollapsiblePrimitive.Root.Props): import("react").JSX.Element;
+declare function CollapsibleTrigger({ ...props }: CollapsiblePrimitive.Trigger.Props): import("react").JSX.Element;
+declare function CollapsibleContent({ ...props }: CollapsiblePrimitive.Panel.Props): import("react").JSX.Element;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };

package/dist/components/ui/collapsible.js

@@ -0,0 +1,23 @@
+import { jsx as e } from "react/jsx-runtime";
+import { Collapsible as t } from "@base-ui/react/collapsible";
+//#region src/components/ui/collapsible.tsx
+function n({ ...n }) {
+	return /* @__PURE__ */ e(t.Root, {
+		"data-slot": "collapsible",
+		...n
+	});
+}
+function r({ ...n }) {
+	return /* @__PURE__ */ e(t.Trigger, {
+		"data-slot": "collapsible-trigger",
+		...n
+	});
+}
+function i({ ...n }) {
+	return /* @__PURE__ */ e(t.Panel, {
+		"data-slot": "collapsible-content",
+		...n
+	});
+}
+//#endregion
+export { n as Collapsible, i as CollapsibleContent, r as CollapsibleTrigger };

package/dist/components/ui/combobox.d.ts

@@ -0,0 +1,24 @@
+import { Combobox as ComboboxPrimitive } from '@base-ui/react';
+import * as React from "react";
+declare const Combobox: typeof ComboboxPrimitive.Root;
+declare function ComboboxValue({ ...props }: ComboboxPrimitive.Value.Props): React.JSX.Element;
+declare function ComboboxTrigger({ className, children, ...props }: ComboboxPrimitive.Trigger.Props): React.JSX.Element;
+declare function ComboboxInput({ className, children, disabled, showTrigger, showClear, ...props }: ComboboxPrimitive.Input.Props & {
+    showTrigger?: boolean;
+    showClear?: boolean;
+}): React.JSX.Element;
+declare function ComboboxContent({ className, side, sideOffset, align, alignOffset, anchor, ...props }: ComboboxPrimitive.Popup.Props & Pick<ComboboxPrimitive.Positioner.Props, "side" | "align" | "sideOffset" | "alignOffset" | "anchor">): React.JSX.Element;
+declare function ComboboxList({ className, ...props }: ComboboxPrimitive.List.Props): React.JSX.Element;
+declare function ComboboxItem({ className, children, ...props }: ComboboxPrimitive.Item.Props): React.JSX.Element;
+declare function ComboboxGroup({ className, ...props }: ComboboxPrimitive.Group.Props): React.JSX.Element;
+declare function ComboboxLabel({ className, ...props }: ComboboxPrimitive.GroupLabel.Props): React.JSX.Element;
+declare function ComboboxCollection({ ...props }: ComboboxPrimitive.Collection.Props): React.JSX.Element;
+declare function ComboboxEmpty({ className, ...props }: ComboboxPrimitive.Empty.Props): React.JSX.Element;
+declare function ComboboxSeparator({ className, ...props }: ComboboxPrimitive.Separator.Props): React.JSX.Element;
+declare function ComboboxChips({ className, ...props }: React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> & ComboboxPrimitive.Chips.Props): React.JSX.Element;
+declare function ComboboxChip({ className, children, showRemove, ...props }: ComboboxPrimitive.Chip.Props & {
+    showRemove?: boolean;
+}): React.JSX.Element;
+declare function ComboboxChipsInput({ className, ...props }: ComboboxPrimitive.Input.Props): React.JSX.Element;
+declare function useComboboxAnchor(): React.RefObject<HTMLDivElement | null>;
+export { Combobox, ComboboxInput, ComboboxContent, ComboboxList, ComboboxItem, ComboboxGroup, ComboboxLabel, ComboboxCollection, ComboboxEmpty, ComboboxSeparator, ComboboxChips, ComboboxChip, ComboboxChipsInput, ComboboxTrigger, ComboboxValue, useComboboxAnchor, };

package/dist/components/ui/combobox.js

@@ -0,0 +1,161 @@
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "./button.js";
+import { InputGroup as n, InputGroupAddon as r, InputGroupButton as i, InputGroupInput as a } from "./input-group.js";
+import * as o from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { CheckIcon as l, ChevronDownIcon as u, XIcon as d } from "lucide-react";
+import { Combobox as f } from "@base-ui/react";
+//#region src/components/ui/combobox.tsx
+var p = f.Root;
+function m({ ...e }) {
+	return /* @__PURE__ */ s(f.Value, {
+		"data-slot": "combobox-value",
+		...e
+	});
+}
+function h({ className: t, children: n, ...r }) {
+	return /* @__PURE__ */ c(f.Trigger, {
+		"data-slot": "combobox-trigger",
+		className: e("[&_svg:not([class*='size-'])]:size-4", t),
+		...r,
+		children: [n, /* @__PURE__ */ s(u, { className: "pointer-events-none size-4 text-muted-foreground" })]
+	});
+}
+function g({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.Clear, {
+		"data-slot": "combobox-clear",
+		render: /* @__PURE__ */ s(i, {
+			variant: "ghost",
+			size: "icon-xs"
+		}),
+		className: e(t),
+		...n,
+		children: /* @__PURE__ */ s(d, { className: "pointer-events-none" })
+	});
+}
+function _({ className: t, children: o, disabled: l = !1, showTrigger: u = !0, showClear: d = !1, ...p }) {
+	return /* @__PURE__ */ c(n, {
+		className: e("w-auto", t),
+		children: [
+			/* @__PURE__ */ s(f.Input, {
+				render: /* @__PURE__ */ s(a, { disabled: l }),
+				...p
+			}),
+			/* @__PURE__ */ c(r, {
+				align: "inline-end",
+				children: [u && /* @__PURE__ */ s(i, {
+					size: "icon-xs",
+					variant: "ghost",
+					render: /* @__PURE__ */ s(h, {}),
+					"data-slot": "input-group-button",
+					className: "group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent",
+					disabled: l
+				}), d && /* @__PURE__ */ s(g, { disabled: l })]
+			}),
+			o
+		]
+	});
+}
+function v({ className: t, side: n = "bottom", sideOffset: r = 6, align: i = "start", alignOffset: a = 0, anchor: o, ...c }) {
+	return /* @__PURE__ */ s(f.Portal, { children: /* @__PURE__ */ s(f.Positioner, {
+		side: n,
+		sideOffset: r,
+		align: i,
+		alignOffset: a,
+		anchor: o,
+		className: "isolate z-50",
+		children: /* @__PURE__ */ s(f.Popup, {
+			"data-slot": "combobox-content",
+			"data-chips": !!o,
+			className: e("group/combobox-content relative max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-start-2 data-[side=inline-start]:slide-in-from-end-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", t),
+			...c
+		})
+	}) });
+}
+function y({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.List, {
+		"data-slot": "combobox-list",
+		className: e("no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0", t),
+		...n
+	});
+}
+function b({ className: t, children: n, ...r }) {
+	return /* @__PURE__ */ c(f.Item, {
+		"data-slot": "combobox-item",
+		className: e("relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", t),
+		...r,
+		children: [n, /* @__PURE__ */ s(f.ItemIndicator, {
+			render: /* @__PURE__ */ s("span", { className: "pointer-events-none absolute end-2 flex size-4 items-center justify-center" }),
+			children: /* @__PURE__ */ s(l, { className: "pointer-events-none" })
+		})]
+	});
+}
+function x({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.Group, {
+		"data-slot": "combobox-group",
+		className: e(t),
+		...n
+	});
+}
+function S({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.GroupLabel, {
+		"data-slot": "combobox-label",
+		className: e("px-2 py-1.5 text-xs text-muted-foreground", t),
+		...n
+	});
+}
+function C({ ...e }) {
+	return /* @__PURE__ */ s(f.Collection, {
+		"data-slot": "combobox-collection",
+		...e
+	});
+}
+function w({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.Empty, {
+		"data-slot": "combobox-empty",
+		className: e("hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex", t),
+		...n
+	});
+}
+function T({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.Separator, {
+		"data-slot": "combobox-separator",
+		className: e("-mx-1 my-1 h-px bg-border", t),
+		...n
+	});
+}
+function E({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.Chips, {
+		"data-slot": "combobox-chips",
+		className: e("flex min-h-8 flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40", t),
+		...n
+	});
+}
+function D({ className: n, children: r, showRemove: i = !0, ...a }) {
+	return /* @__PURE__ */ c(f.Chip, {
+		"data-slot": "combobox-chip",
+		className: e("flex h-[calc(--spacing(5.25))] w-fit items-center justify-center gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pe-0", n),
+		...a,
+		children: [r, i && /* @__PURE__ */ s(f.ChipRemove, {
+			render: /* @__PURE__ */ s(t, {
+				variant: "ghost",
+				size: "icon-xs"
+			}),
+			className: "-ms-1 opacity-50 hover:opacity-100",
+			"data-slot": "combobox-chip-remove",
+			children: /* @__PURE__ */ s(d, { className: "pointer-events-none" })
+		})]
+	});
+}
+function O({ className: t, ...n }) {
+	return /* @__PURE__ */ s(f.Input, {
+		"data-slot": "combobox-chip-input",
+		className: e("min-w-16 flex-1 outline-none", t),
+		...n
+	});
+}
+function k() {
+	return o.useRef(null);
+}
+//#endregion
+export { p as Combobox, D as ComboboxChip, E as ComboboxChips, O as ComboboxChipsInput, C as ComboboxCollection, v as ComboboxContent, w as ComboboxEmpty, x as ComboboxGroup, _ as ComboboxInput, b as ComboboxItem, S as ComboboxLabel, y as ComboboxList, T as ComboboxSeparator, h as ComboboxTrigger, m as ComboboxValue, k as useComboboxAnchor };

package/dist/components/ui/command.d.ts

@@ -0,0 +1,19 @@
+import { Command as CommandPrimitive } from 'cmdk';
+import { Dialog } from './dialog';
+import * as React from "react";
+declare function Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>): React.JSX.Element;
+declare function CommandDialog({ title, description, children, className, showCloseButton, ...props }: Omit<React.ComponentProps<typeof Dialog>, "children"> & {
+    title?: string;
+    description?: string;
+    className?: string;
+    showCloseButton?: boolean;
+    children: React.ReactNode;
+}): React.JSX.Element;
+declare function CommandInput({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Input>): React.JSX.Element;
+declare function CommandList({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.List>): React.JSX.Element;
+declare function CommandEmpty({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>): React.JSX.Element;
+declare function CommandGroup({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Group>): React.JSX.Element;
+declare function CommandSeparator({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Separator>): React.JSX.Element;
+declare function CommandItem({ className, children, ...props }: React.ComponentProps<typeof CommandPrimitive.Item>): React.JSX.Element;
+declare function CommandShortcut({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };