@alpic-ai/ui 0.0.0-dev.g2df19cc → 0.0.0-dev.g2eefcc2

package/dist/components/chart-legend.mjs

@@ -0,0 +1,26 @@
+"use client";
+import { cn } from "../lib/cn.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/chart-legend.tsx
+function Swatch({ color, dashed }) {
+	return /* @__PURE__ */ jsx("span", {
+		"aria-hidden": true,
+		className: "size-2 shrink-0 rounded-full",
+		style: dashed ? { border: `1.5px solid ${color}` } : { background: color }
+	});
+}
+function ChartLegend({ items, className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex flex-wrap gap-x-4 gap-y-1.5", className),
+		...props,
+		children: items.map((item) => /* @__PURE__ */ jsxs("span", {
+			className: "inline-flex items-center gap-1.5 font-mono text-[10px] text-muted-foreground uppercase tracking-[0.12em]",
+			children: [/* @__PURE__ */ jsx(Swatch, {
+				color: item.color,
+				dashed: item.dashed
+			}), item.name]
+		}, item.name))
+	});
+}
+//#endregion
+export { ChartLegend };

package/dist/components/chart-tooltip.d.mts

@@ -0,0 +1,33 @@
+//#region src/components/chart-tooltip.d.ts
+interface ChartTooltipItem {
+  name?: string | number;
+  value?: number | string;
+  color?: string;
+  stroke?: string;
+  fill?: string;
+  dataKey?: string | number;
+}
+interface ChartTooltipContentProps {
+  active?: boolean;
+  payload?: ChartTooltipItem[];
+  label?: string | number;
+  valueFormatter?: (value: number) => string;
+  labelFormatter?: (label: string | number) => string;
+  hideLabel?: boolean;
+  showTotal?: boolean;
+  totalLabel?: string;
+  className?: string;
+}
+declare function ChartTooltipContent({
+  active,
+  payload,
+  label,
+  valueFormatter,
+  labelFormatter,
+  hideLabel,
+  showTotal,
+  totalLabel,
+  className
+}: ChartTooltipContentProps): import("react").JSX.Element | null;
+//#endregion
+export { ChartTooltipContent, ChartTooltipContentProps, ChartTooltipItem };

package/dist/components/chart-tooltip.mjs

@@ -0,0 +1,52 @@
+"use client";
+import { cn } from "../lib/cn.mjs";
+import { useChartContext } from "./chart-container.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/chart-tooltip.tsx
+function ChartTooltipContent({ active, payload, label, valueFormatter = (value) => value.toLocaleString("en-US"), labelFormatter, hideLabel, showTotal, totalLabel = "Total", className }) {
+	const { theme } = useChartContext();
+	if (!active || !payload?.length) return null;
+	const total = payload.reduce((sum, item) => sum + (typeof item.value === "number" ? item.value : Number(item.value ?? 0)), 0);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("min-w-[130px] rounded-lg border px-3 py-2.5 shadow-lg", "border-border bg-popover text-popover-foreground", className),
+		children: [!hideLabel && label !== void 0 && /* @__PURE__ */ jsx("p", {
+			className: "font-mono text-[10px] uppercase tracking-wider text-quaternary-foreground mb-1.5",
+			children: labelFormatter ? labelFormatter(label) : label
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-1",
+			children: [payload.map((item, index) => {
+				const swatch = [
+					item.color,
+					item.stroke,
+					item.fill
+				].find((candidate) => typeof candidate === "string" && candidate.length > 0 && !candidate.startsWith("url(")) ?? theme.mutedForeground;
+				const numeric = typeof item.value === "number" ? item.value : Number(item.value ?? 0);
+				return /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center justify-between gap-4 text-text-xs",
+					children: [/* @__PURE__ */ jsxs("span", {
+						className: "inline-flex items-center gap-2 text-muted-foreground",
+						children: [/* @__PURE__ */ jsx("span", {
+							"aria-hidden": true,
+							className: "size-2 shrink-0 rounded-[2px]",
+							style: { background: swatch }
+						}), item.name]
+					}), /* @__PURE__ */ jsx("span", {
+						className: "font-mono font-semibold tabular-nums text-foreground",
+						children: valueFormatter(numeric)
+					})]
+				}, `${item.dataKey ?? index}`);
+			}), showTotal && /* @__PURE__ */ jsxs("div", {
+				className: "mt-1 flex items-center justify-between gap-4 border-border border-t pt-1.5 text-text-xs",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "font-mono text-quaternary-foreground uppercase tracking-wider text-[10px]",
+					children: totalLabel
+				}), /* @__PURE__ */ jsx("span", {
+					className: "font-mono font-semibold tabular-nums text-foreground",
+					children: valueFormatter(total)
+				})]
+			})]
+		})]
+	});
+}
+//#endregion
+export { ChartTooltipContent };

package/dist/components/checkbox.d.mts

@@ -1,11 +1,10 @@
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
-import * as React from "react";
+import * as React$1 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;
+}: React$1.ComponentProps<typeof CheckboxPrimitive.Root>): React$1.JSX.Element;
 //#endregion
 export { Checkbox };

package/dist/components/collapsible.d.mts

@@ -1,16 +1,15 @@
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
-import * as React from "react";
+import * as React$1 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;
+}: React$1.ComponentProps<typeof CollapsiblePrimitive.Root>): React$1.JSX.Element;
 declare function CollapsibleTrigger({
   ...props
-}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): React$1.JSX.Element;
 declare function CollapsibleContent({
   ...props
-}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): React$1.JSX.Element;
 //#endregion
 export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/components/combobox.d.mts

@@ -1,6 +1,5 @@
 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";
@@ -11,6 +10,8 @@ interface ComboboxBaseProps {
   open?: boolean;
   defaultOpen?: boolean;
   onOpenChange?: (open: boolean) => void;
+  /** Resolves a selected value to a display label (e.g. for multi-select tags). Defaults to the value. */
+  getOptionLabel?: (value: string) => string;
 }
 interface ComboboxSingleProps extends ComboboxBaseProps {
   multiple?: false;
@@ -25,7 +26,7 @@ interface ComboboxMultipleProps extends ComboboxBaseProps {
   onValueChange?: (value: string[]) => void;
 }
 type ComboboxProps = ComboboxSingleProps | ComboboxMultipleProps;
-declare function Combobox(props: ComboboxProps): _$react_jsx_runtime0.JSX.Element;
+declare function Combobox(props: ComboboxProps): import("react").JSX.Element;
 interface ComboboxTriggerProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size">, VariantProps<typeof selectTriggerVariants> {
   placeholder?: string;
 }
@@ -35,7 +36,7 @@ declare function ComboboxTrigger({
   placeholder,
   children,
   ...props
-}: ComboboxTriggerProps): _$react_jsx_runtime0.JSX.Element;
+}: ComboboxTriggerProps): import("react").JSX.Element;
 interface ComboboxContentProps extends React.ComponentProps<typeof PopoverContent> {
   className?: string;
   children?: ReactNode;
@@ -46,27 +47,27 @@ declare function ComboboxContent({
   children,
   filter,
   ...props
-}: ComboboxContentProps): _$react_jsx_runtime0.JSX.Element;
+}: ComboboxContentProps): import("react").JSX.Element;
 declare function ComboboxSearch({
   className,
   ...props
-}: React.ComponentProps<typeof Command.Input>): _$react_jsx_runtime0.JSX.Element;
+}: React.ComponentProps<typeof Command.Input>): import("react").JSX.Element;
 declare function ComboboxList({
   className,
   ...props
-}: React.ComponentProps<typeof Command.List>): _$react_jsx_runtime0.JSX.Element;
+}: React.ComponentProps<typeof Command.List>): import("react").JSX.Element;
 declare function ComboboxEmpty({
   className,
   ...props
-}: React.ComponentProps<typeof Command.Empty>): _$react_jsx_runtime0.JSX.Element;
+}: React.ComponentProps<typeof Command.Empty>): import("react").JSX.Element;
 declare function ComboboxGroup({
   className,
   ...props
-}: React.ComponentProps<typeof Command.Group>): _$react_jsx_runtime0.JSX.Element;
+}: React.ComponentProps<typeof Command.Group>): import("react").JSX.Element;
 declare function ComboboxSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof Command.Separator>): _$react_jsx_runtime0.JSX.Element;
+}: React.ComponentProps<typeof Command.Separator>): import("react").JSX.Element;
 interface ComboboxItemProps extends Omit<React.ComponentProps<typeof Command.Item>, "onSelect"> {
   /** The value stored when this item is selected */
   itemValue: string;
@@ -76,11 +77,11 @@ declare function ComboboxItem({
   children,
   itemValue,
   ...props
-}: ComboboxItemProps): _$react_jsx_runtime0.JSX.Element;
+}: ComboboxItemProps): import("react").JSX.Element;
 declare function ComboboxItemText({
   className,
   children,
   ...props
-}: React.HTMLAttributes<HTMLSpanElement>): _$react_jsx_runtime0.JSX.Element;
+}: React.HTMLAttributes<HTMLSpanElement>): import("react").JSX.Element;
 //#endregion
 export { Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxItem, ComboboxItemText, ComboboxList, ComboboxSearch, ComboboxSeparator, ComboboxTrigger };

package/dist/components/combobox.mjs

@@ -15,7 +15,7 @@ function useComboboxContext() {
 	return context;
 }
 function Combobox(props) {
-	const { children, multiple = false, open: controlledOpen, defaultOpen = false, onOpenChange: controlledOnOpenChange } = props;
+	const { children, multiple = false, open: controlledOpen, defaultOpen = false, onOpenChange: controlledOnOpenChange, getOptionLabel } = props;
 	const [uncontrolledSingleValue, setUncontrolledSingleValue] = useState(!multiple ? props.defaultValue ?? null : null);
 	const [uncontrolledMultiValue, setUncontrolledMultiValue] = useState(multiple ? props.defaultValue ?? [] : []);
 	const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
@@ -77,7 +77,8 @@ function Combobox(props) {
 		onDeselect,
 		isSelected,
 		open,
-		onOpenChange
+		onOpenChange,
+		getOptionLabel
 	}), [
 		multiple,
 		singleValue,
@@ -86,7 +87,8 @@ function Combobox(props) {
 		onDeselect,
 		isSelected,
 		open,
-		onOpenChange
+		onOpenChange,
+		getOptionLabel
 	]);
 	return /* @__PURE__ */ jsx(ComboboxContext.Provider, {
 		value: contextValue,
@@ -120,10 +122,11 @@ function ComboboxTrigger({ className, size, placeholder, children, ...props }) {
 	});
 }
 function ComboboxTags({ values, onDeselect }) {
+	const { getOptionLabel } = useComboboxContext();
 	return /* @__PURE__ */ jsx(Fragment, { children: values.map((tagValue) => /* @__PURE__ */ jsx(TagDismissible, {
 		onClick: (event) => event.stopPropagation(),
 		onDismiss: () => onDeselect(tagValue),
-		children: tagValue
+		children: getOptionLabel ? getOptionLabel(tagValue) : tagValue
 	}, tagValue)) });
 }
 function ComboboxContent({ className, children, filter, ...props }) {

package/dist/components/command.d.mts

@@ -1,38 +1,37 @@
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
-import * as React from "react";
+import * as React$1 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;
+}: React$1.ComponentProps<typeof Command$1>): React$1.JSX.Element;
 declare function CommandInput({
   className,
   ...props
-}: React.ComponentProps<typeof Command$1.Input>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof Command$1.Input>): React$1.JSX.Element;
 declare function CommandList({
   className,
   ...props
-}: React.ComponentProps<typeof Command$1.List>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof Command$1.List>): React$1.JSX.Element;
 declare function CommandEmpty({
   ...props
-}: React.ComponentProps<typeof Command$1.Empty>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof Command$1.Empty>): React$1.JSX.Element;
 declare function CommandGroup({
   className,
   ...props
-}: React.ComponentProps<typeof Command$1.Group>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof Command$1.Group>): React$1.JSX.Element;
 declare function CommandSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof Command$1.Separator>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof Command$1.Separator>): React$1.JSX.Element;
 declare function CommandItem({
   className,
   ...props
-}: React.ComponentProps<typeof Command$1.Item>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof Command$1.Item>): React$1.JSX.Element;
 declare function CommandShortcut({
   className,
   ...props
-}: React.ComponentProps<"span">): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<"span">): React$1.JSX.Element;
 //#endregion
 export { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };

package/dist/components/copyable.d.mts

@@ -1,4 +1,3 @@
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { ReactNode } from "react";
 
 //#region src/components/copyable.d.ts
@@ -11,12 +10,12 @@ declare function Copyable({
   content,
   children,
   className
-}: CopyableProps): _$react_jsx_runtime0.JSX.Element;
+}: CopyableProps): import("react").JSX.Element;
 interface CopyableUrlProps {
   url: URL;
 }
 declare function CopyableUrl({
   url
-}: CopyableUrlProps): _$react_jsx_runtime0.JSX.Element;
+}: CopyableUrlProps): import("react").JSX.Element;
 //#endregion
 export { Copyable, type CopyableProps, CopyableUrl, type CopyableUrlProps };

package/dist/components/description-list.d.mts

@@ -1,22 +1,21 @@
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
-import * as React from "react";
+import * as React$1 from "react";
 
 //#region src/components/description-list.d.ts
 declare function DescriptionList({
   className,
   ...props
-}: React.ComponentProps<"dl">): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<"dl">): React$1.JSX.Element;
 declare function DescriptionItem({
   className,
   ...props
-}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<"div">): React$1.JSX.Element;
 declare function DescriptionTitle({
   className,
   ...props
-}: React.ComponentProps<"dt">): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<"dt">): React$1.JSX.Element;
 declare function DescriptionValue({
   className,
   ...props
-}: React.ComponentProps<"dd">): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<"dd">): React$1.JSX.Element;
 //#endregion
 export { DescriptionItem, DescriptionList, DescriptionTitle, DescriptionValue };

package/dist/components/dialog.d.mts

@@ -1,28 +1,26 @@
 import { ButtonProps } from "./button.mjs";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
-import * as React from "react";
+import * as React$1 from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
-import * as _$class_variance_authority_types0 from "class-variance-authority/types";
 
 //#region src/components/dialog.d.ts
 declare function Dialog({
   ...props
-}: React.ComponentProps<typeof DialogPrimitive.Root>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof DialogPrimitive.Root>): React$1.JSX.Element;
 declare function DialogTrigger({
   ...props
-}: React.ComponentProps<typeof DialogPrimitive.Trigger>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof DialogPrimitive.Trigger>): React$1.JSX.Element;
 declare function DialogPortal({
   ...props
-}: React.ComponentProps<typeof DialogPrimitive.Portal>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof DialogPrimitive.Portal>): React$1.JSX.Element;
 declare function DialogOverlay({
   className,
   ...props
-}: React.ComponentProps<typeof DialogPrimitive.Overlay>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof DialogPrimitive.Overlay>): React$1.JSX.Element;
 declare const dialogContentVariants: (props?: ({
   size?: "sm" | "lg" | null | undefined;
-} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
-interface DialogContentProps extends React.ComponentProps<typeof DialogPrimitive.Content>, VariantProps<typeof dialogContentVariants> {
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface DialogContentProps extends React$1.ComponentProps<typeof DialogPrimitive.Content>, VariantProps<typeof dialogContentVariants> {
   showCloseButton?: boolean;
 }
 declare function DialogContent({
@@ -31,31 +29,31 @@ declare function DialogContent({
   size,
   showCloseButton,
   ...props
-}: DialogContentProps): _$react_jsx_runtime0.JSX.Element;
+}: DialogContentProps): React$1.JSX.Element;
 declare function DialogHeader({
   className,
   ...props
-}: React.ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<"div">): React$1.JSX.Element;
 declare const dialogFooterVariants: (props?: ({
   layout?: "horizontal" | "vertical" | null | undefined;
-} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
-interface DialogFooterProps extends React.ComponentProps<"div">, VariantProps<typeof dialogFooterVariants> {}
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface DialogFooterProps extends React$1.ComponentProps<"div">, VariantProps<typeof dialogFooterVariants> {}
 declare function DialogFooter({
   className,
   layout,
   ...props
-}: DialogFooterProps): _$react_jsx_runtime0.JSX.Element;
+}: DialogFooterProps): React$1.JSX.Element;
 declare function DialogTitle({
   className,
   ...props
-}: React.ComponentProps<typeof DialogPrimitive.Title>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof DialogPrimitive.Title>): React$1.JSX.Element;
 declare function DialogClose({
   children,
   ...props
-}: Omit<ButtonProps, "variant" | "asChild">): _$react_jsx_runtime0.JSX.Element;
+}: Omit<ButtonProps, "variant" | "asChild">): React$1.JSX.Element;
 declare function DialogDescription({
   className,
   ...props
-}: React.ComponentProps<typeof DialogPrimitive.Description>): _$react_jsx_runtime0.JSX.Element;
+}: React$1.ComponentProps<typeof DialogPrimitive.Description>): React$1.JSX.Element;
 //#endregion
 export { Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, DialogFooter, type DialogFooterProps, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, dialogContentVariants, dialogFooterVariants };

package/dist/components/donut-chart.d.mts

@@ -0,0 +1,46 @@
+import { ChartPaletteName } from "../lib/chart-palette.mjs";
+import * as React$1 from "react";
+
+//#region src/components/donut-chart.d.ts
+declare const GEOMETRY: {
+  readonly donut: {
+    readonly inner: "64%";
+    readonly outer: "92%";
+  };
+  readonly ring: {
+    readonly inner: "78%";
+    readonly outer: "92%";
+  };
+};
+interface DonutChartProps {
+  data: ReadonlyArray<Record<string, string | number | null | undefined>>;
+  index: string;
+  dataKey?: string;
+  variant?: keyof typeof GEOMETRY;
+  legend?: boolean;
+  paddingAngle?: number;
+  height?: number;
+  palette?: ChartPaletteName;
+  centerLabel?: string;
+  loading?: boolean;
+  valueFormatter?: (value: number) => string;
+  labelFormatter?: (label: string | number) => string;
+  className?: string;
+}
+declare function DonutChart({
+  data,
+  index,
+  dataKey,
+  variant,
+  legend,
+  paddingAngle,
+  height,
+  palette,
+  centerLabel,
+  loading,
+  valueFormatter,
+  labelFormatter,
+  className
+}: DonutChartProps): React$1.JSX.Element;
+//#endregion
+export { DonutChart, DonutChartProps };