@datalayer/agent-runtimes 0.0.2

package/lib/components/ui/empty.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { cva } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+function Empty({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty", className: cn('flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12', className), ...props }));
+}
+function EmptyHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-header", className: cn('flex max-w-sm flex-col items-center gap-2 text-center', className), ...props }));
+}
+const emptyMediaVariants = cva('flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0', {
+    variants: {
+        variant: {
+            default: 'bg-transparent',
+            icon: "bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6",
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+function EmptyMedia({ className, variant = 'default', ...props }) {
+    return (_jsx("div", { "data-slot": "empty-icon", "data-variant": variant, className: cn(emptyMediaVariants({ variant, className })), ...props }));
+}
+function EmptyTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-title", className: cn('text-lg font-medium tracking-tight', className), ...props }));
+}
+function EmptyDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-description", className: cn('text-muted-foreground [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4', className), ...props }));
+}
+function EmptyContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-content", className: cn('flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance', className), ...props }));
+}
+export { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia, };

package/lib/components/ui/field.d.ts

@@ -0,0 +1,24 @@
+import { type VariantProps } from 'class-variance-authority';
+import { Label } from '@/components/ui/label';
+declare function FieldSet({ className, ...props }: React.ComponentProps<'fieldset'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldLegend({ className, variant, ...props }: React.ComponentProps<'legend'> & {
+    variant?: 'legend' | 'label';
+}): import("react/jsx-runtime").JSX.Element;
+declare function FieldGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare const fieldVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | "responsive" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Field({ className, orientation, ...props }: React.ComponentProps<'div'> & VariantProps<typeof fieldVariants>): import("react/jsx-runtime").JSX.Element;
+declare function FieldContent({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldLabel({ className, ...props }: React.ComponentProps<typeof Label>): import("react/jsx-runtime").JSX.Element;
+declare function FieldTitle({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldDescription({ className, ...props }: React.ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldSeparator({ children, className, ...props }: React.ComponentProps<'div'> & {
+    children?: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+declare function FieldError({ className, children, errors, ...props }: React.ComponentProps<'div'> & {
+    errors?: Array<{
+        message?: string;
+    } | undefined>;
+}): import("react/jsx-runtime").JSX.Element | null;
+export { Field, FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, };

package/lib/components/ui/field.js

@@ -0,0 +1,80 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+import { Label } from '@/components/ui/label';
+import { Separator } from '@/components/ui/separator';
+function FieldSet({ className, ...props }) {
+    return (_jsx("fieldset", { "data-slot": "field-set", className: cn('flex flex-col gap-6', 'has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3', className), ...props }));
+}
+function FieldLegend({ className, variant = 'legend', ...props }) {
+    return (_jsx("legend", { "data-slot": "field-legend", "data-variant": variant, className: cn('mb-3 font-medium', 'data-[variant=legend]:text-base', 'data-[variant=label]:text-sm', className), ...props }));
+}
+function FieldGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "field-group", className: cn('group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4', className), ...props }));
+}
+const fieldVariants = cva('group/field flex w-full gap-3 data-[invalid=true]:text-destructive', {
+    variants: {
+        orientation: {
+            vertical: ['flex-col [&>*]:w-full [&>.sr-only]:w-auto'],
+            horizontal: [
+                'flex-row items-center',
+                '[&>[data-slot=field-label]]:flex-auto',
+                'has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
+            ],
+            responsive: [
+                'flex-col [&>*]:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto',
+                '@md/field-group:[&>[data-slot=field-label]]:flex-auto',
+                '@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
+            ],
+        },
+    },
+    defaultVariants: {
+        orientation: 'vertical',
+    },
+});
+function Field({ className, orientation = 'vertical', ...props }) {
+    return (_jsx("div", { role: "group", "data-slot": "field", "data-orientation": orientation, className: cn(fieldVariants({ orientation }), className), ...props }));
+}
+function FieldContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "field-content", className: cn('group/field-content flex flex-1 flex-col gap-1.5 leading-snug', className), ...props }));
+}
+function FieldLabel({ className, ...props }) {
+    return (_jsx(Label, { "data-slot": "field-label", className: cn('group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50', 'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4', 'has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10', className), ...props }));
+}
+function FieldTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "field-label", className: cn('flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50', className), ...props }));
+}
+function FieldDescription({ className, ...props }) {
+    return (_jsx("p", { "data-slot": "field-description", className: cn('text-muted-foreground text-sm leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance', 'last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5', '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4', className), ...props }));
+}
+function FieldSeparator({ children, className, ...props }) {
+    return (_jsxs("div", { "data-slot": "field-separator", "data-content": !!children, className: cn('relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2', className), ...props, children: [_jsx(Separator, { className: "absolute inset-0 top-1/2" }), children && (_jsx("span", { className: "bg-background text-muted-foreground relative mx-auto block w-fit px-2", "data-slot": "field-separator-content", children: children }))] }));
+}
+function FieldError({ className, children, errors, ...props }) {
+    const content = useMemo(() => {
+        if (children) {
+            return children;
+        }
+        if (!errors?.length) {
+            return null;
+        }
+        const uniqueErrors = [
+            ...new Map(errors.map(error => [error?.message, error])).values(),
+        ];
+        if (uniqueErrors?.length == 1) {
+            return uniqueErrors[0]?.message;
+        }
+        return (_jsx("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map((error, index) => error?.message && _jsx("li", { children: error.message }, index)) }));
+    }, [children, errors]);
+    if (!content) {
+        return null;
+    }
+    return (_jsx("div", { role: "alert", "data-slot": "field-error", className: cn('text-destructive text-sm font-normal', className), ...props, children: content }));
+}
+export { Field, FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, };

package/lib/components/ui/form.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { Slot } from '@radix-ui/react-slot';
+import { type ControllerProps, type FieldPath, type FieldValues } from 'react-hook-form';
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: import("react-hook-form").FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => import("react/jsx-runtime").JSX.Element;
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: import("react-hook-form").FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+declare function FormItem({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function FormLabel({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function FormControl({ ...props }: React.ComponentProps<typeof Slot>): import("react/jsx-runtime").JSX.Element;
+declare function FormDescription({ className, ...props }: React.ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+declare function FormMessage({ className, ...props }: React.ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element | null;
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };

package/lib/components/ui/form.js

@@ -0,0 +1,63 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { Controller, FormProvider, useFormContext, useFormState, } from 'react-hook-form';
+import { cn } from '@/lib/utils';
+import { Label } from '@/components/ui/label';
+const Form = FormProvider;
+const FormFieldContext = React.createContext({});
+const FormField = ({ ...props }) => {
+    return (_jsx(FormFieldContext.Provider, { value: { name: props.name }, children: _jsx(Controller, { ...props }) }));
+};
+const useFormField = () => {
+    const fieldContext = React.useContext(FormFieldContext);
+    const itemContext = React.useContext(FormItemContext);
+    const { getFieldState } = useFormContext();
+    const formState = useFormState({ name: fieldContext.name });
+    const fieldState = getFieldState(fieldContext.name, formState);
+    if (!fieldContext) {
+        throw new Error('useFormField should be used within <FormField>');
+    }
+    const { id } = itemContext;
+    return {
+        id,
+        name: fieldContext.name,
+        formItemId: `${id}-form-item`,
+        formDescriptionId: `${id}-form-item-description`,
+        formMessageId: `${id}-form-item-message`,
+        ...fieldState,
+    };
+};
+const FormItemContext = React.createContext({});
+function FormItem({ className, ...props }) {
+    const id = React.useId();
+    return (_jsx(FormItemContext.Provider, { value: { id }, children: _jsx("div", { "data-slot": "form-item", className: cn('grid gap-2', className), ...props }) }));
+}
+function FormLabel({ className, ...props }) {
+    const { error, formItemId } = useFormField();
+    return (_jsx(Label, { "data-slot": "form-label", "data-error": !!error, className: cn('data-[error=true]:text-destructive', className), htmlFor: formItemId, ...props }));
+}
+function FormControl({ ...props }) {
+    const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
+    return (_jsx(Slot, { "data-slot": "form-control", id: formItemId, "aria-describedby": !error
+            ? `${formDescriptionId}`
+            : `${formDescriptionId} ${formMessageId}`, "aria-invalid": !!error, ...props }));
+}
+function FormDescription({ className, ...props }) {
+    const { formDescriptionId } = useFormField();
+    return (_jsx("p", { "data-slot": "form-description", id: formDescriptionId, className: cn('text-muted-foreground text-sm', className), ...props }));
+}
+function FormMessage({ className, ...props }) {
+    const { error, formMessageId } = useFormField();
+    const body = error ? String(error?.message ?? '') : props.children;
+    if (!body) {
+        return null;
+    }
+    return (_jsx("p", { "data-slot": "form-message", id: formMessageId, className: cn('text-destructive text-sm', className), ...props, children: body }));
+}
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };

package/lib/components/ui/hover-card.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
+declare function HoverCard({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function HoverCardTrigger({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function HoverCardContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof HoverCardPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export { HoverCard, HoverCardTrigger, HoverCardContent };

package/lib/components/ui/hover-card.js

@@ -0,0 +1,18 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
+import { cn } from '@/lib/utils';
+function HoverCard({ ...props }) {
+    return _jsx(HoverCardPrimitive.Root, { "data-slot": "hover-card", ...props });
+}
+function HoverCardTrigger({ ...props }) {
+    return (_jsx(HoverCardPrimitive.Trigger, { "data-slot": "hover-card-trigger", ...props }));
+}
+function HoverCardContent({ className, align = 'center', sideOffset = 4, ...props }) {
+    return (_jsx(HoverCardPrimitive.Portal, { "data-slot": "hover-card-portal", children: _jsx(HoverCardPrimitive.Content, { "data-slot": "hover-card-content", align: align, sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-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 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden', className), ...props }) }));
+}
+export { HoverCard, HoverCardTrigger, HoverCardContent };

package/lib/components/ui/input-group.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare function InputGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare const inputGroupAddonVariants: (props?: ({
+    align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<'div'> & VariantProps<typeof inputGroupAddonVariants>): import("react/jsx-runtime").JSX.Element;
+declare const InputGroupButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<(props?: ({
+    variant?: "link" | "default" | "outline" | "secondary" | "destructive" | "ghost" | null | undefined;
+    size?: "default" | "icon" | "sm" | "lg" | "icon-sm" | "icon-lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string> & {
+    asChild?: boolean;
+}, "ref"> & React.RefAttributes<HTMLButtonElement>, "size"> & VariantProps<(props?: ({
+    size?: "sm" | "icon-sm" | "xs" | "icon-xs" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare function InputGroupText({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupInput({ className, ...props }: React.ComponentProps<'input'>): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupTextarea({ className, ...props }: React.ComponentProps<'textarea'>): import("react/jsx-runtime").JSX.Element;
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, };

package/lib/components/ui/input-group.js

@@ -0,0 +1,69 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Textarea } from '@/components/ui/textarea';
+function InputGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "input-group", role: "group", className: cn('group/input-group border-input dark:bg-input/30 relative flex w-full items-center rounded-md border shadow-xs transition-[color,box-shadow] outline-none', 'h-9 min-w-0 has-[>textarea]:h-auto', 
+        // Variants based on alignment.
+        'has-[>[data-align=inline-start]]:[&>input]:pl-2', 'has-[>[data-align=inline-end]]:[&>input]:pr-2', 'has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3', 'has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3', 
+        // Focus state.
+        'has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot=input-group-control]:focus-visible]:ring-[3px]', 
+        // Error state.
+        'has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40', className), ...props }));
+}
+const inputGroupAddonVariants = cva("text-muted-foreground flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium select-none [&>svg:not([class*='size-'])]:size-4 [&>kbd]:rounded-[calc(var(--radius)-5px)] group-data-[disabled=true]/input-group:opacity-50", {
+    variants: {
+        align: {
+            'inline-start': 'order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]',
+            'inline-end': 'order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]',
+            'block-start': 'order-first w-full justify-start px-3 pt-3 [.border-b]:pb-3 group-has-[>input]/input-group:pt-2.5',
+            'block-end': 'order-last w-full justify-start px-3 pb-3 [.border-t]:pt-3 group-has-[>input]/input-group:pb-2.5',
+        },
+    },
+    defaultVariants: {
+        align: 'inline-start',
+    },
+});
+function InputGroupAddon({ className, align = 'inline-start', ...props }) {
+    return (_jsx("div", { role: "group", "data-slot": "input-group-addon", "data-align": align, className: cn(inputGroupAddonVariants({ align }), className), onClick: e => {
+            if (e.target.closest('button')) {
+                return;
+            }
+            e.currentTarget.parentElement?.querySelector('input')?.focus();
+        }, ...props }));
+}
+const inputGroupButtonVariants = cva('text-sm shadow-none flex gap-2 items-center', {
+    variants: {
+        size: {
+            xs: "h-6 gap-1 px-2 rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2",
+            sm: 'h-8 px-2.5 gap-1.5 rounded-md has-[>svg]:px-2.5',
+            'icon-xs': 'size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0',
+            'icon-sm': 'size-8 p-0 has-[>svg]:p-0',
+        },
+    },
+    defaultVariants: {
+        size: 'xs',
+    },
+});
+const InputGroupButton = React.forwardRef(({ className, type = 'button', variant = 'ghost', size = 'xs', ...props }, ref) => {
+    return (_jsx(Button, { ref: ref, type: type, "data-size": size, variant: variant, className: cn(inputGroupButtonVariants({ size }), className), ...props }));
+});
+InputGroupButton.displayName = 'InputGroupButton';
+function InputGroupText({ className, ...props }) {
+    return (_jsx("span", { className: cn("text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className), ...props }));
+}
+function InputGroupInput({ className, ...props }) {
+    return (_jsx(Input, { "data-slot": "input-group-control", className: cn('flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent', className), ...props }));
+}
+function InputGroupTextarea({ className, ...props }) {
+    return (_jsx(Textarea, { "data-slot": "input-group-control", className: cn('flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent', className), ...props }));
+}
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, };

package/lib/components/ui/input-otp.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { OTPInput } from 'input-otp';
+declare function InputOTP({ className, containerClassName, ...props }: React.ComponentProps<typeof OTPInput> & {
+    containerClassName?: string;
+}): import("react/jsx-runtime").JSX.Element;
+declare function InputOTPGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function InputOTPSlot({ index, className, ...props }: React.ComponentProps<'div'> & {
+    index: number;
+}): import("react/jsx-runtime").JSX.Element;
+declare function InputOTPSeparator({ ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };

package/lib/components/ui/input-otp.js

@@ -0,0 +1,25 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { OTPInput, OTPInputContext } from 'input-otp';
+import { MinusIcon } from 'lucide-react';
+import { cn } from '@/lib/utils';
+function InputOTP({ className, containerClassName, ...props }) {
+    return (_jsx(OTPInput, { "data-slot": "input-otp", containerClassName: cn('flex items-center gap-2 has-disabled:opacity-50', containerClassName), className: cn('disabled:cursor-not-allowed', className), ...props }));
+}
+function InputOTPGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "input-otp-group", className: cn('flex items-center', className), ...props }));
+}
+function InputOTPSlot({ index, className, ...props }) {
+    const inputOTPContext = React.useContext(OTPInputContext);
+    const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
+    return (_jsxs("div", { "data-slot": "input-otp-slot", "data-active": isActive, className: cn('data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:ring-destructive/20 dark:data-[active=true]:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[active=true]:aria-invalid:border-destructive dark:bg-input/30 border-input relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px]', className), ...props, children: [char, hasFakeCaret && (_jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: _jsx("div", { className: "animate-caret-blink bg-foreground h-4 w-px duration-1000" }) }))] }));
+}
+function InputOTPSeparator({ ...props }) {
+    return (_jsx("div", { "data-slot": "input-otp-separator", role: "separator", ...props, children: _jsx(MinusIcon, {}) }));
+}
+export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };

package/lib/components/ui/input.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare function Input({ className, type, ...props }: React.ComponentProps<'input'>): import("react/jsx-runtime").JSX.Element;
+export { Input };

package/lib/components/ui/input.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '@/lib/utils';
+function Input({ className, type, ...props }) {
+    return (_jsx("input", { type: type, "data-slot": "input", className: cn('file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive', className), ...props }));
+}
+export { Input };

package/lib/components/ui/item.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+import { Separator } from '@/components/ui/separator';
+declare function ItemGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): import("react/jsx-runtime").JSX.Element;
+declare const itemVariants: (props?: ({
+    variant?: "muted" | "default" | "outline" | null | undefined;
+    size?: "default" | "sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Item({ className, variant, size, asChild, ...props }: React.ComponentProps<'div'> & VariantProps<typeof itemVariants> & {
+    asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare const itemMediaVariants: (props?: ({
+    variant?: "image" | "default" | "icon" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof itemMediaVariants>): import("react/jsx-runtime").JSX.Element;
+declare function ItemContent({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function ItemTitle({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function ItemDescription({ className, ...props }: React.ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+declare function ItemActions({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function ItemHeader({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function ItemFooter({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export { Item, ItemMedia, ItemContent, ItemActions, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, };

package/lib/components/ui/item.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+import { Separator } from '@/components/ui/separator';
+function ItemGroup({ className, ...props }) {
+    return (_jsx("div", { role: "list", "data-slot": "item-group", className: cn('group/item-group flex flex-col', className), ...props }));
+}
+function ItemSeparator({ className, ...props }) {
+    return (_jsx(Separator, { "data-slot": "item-separator", orientation: "horizontal", className: cn('my-0', className), ...props }));
+}
+const itemVariants = cva('group/item flex items-center border border-transparent text-sm rounded-md transition-colors [a]:hover:bg-accent/50 [a]:transition-colors duration-100 flex-wrap outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', {
+    variants: {
+        variant: {
+            default: 'bg-transparent',
+            outline: 'border-border',
+            muted: 'bg-muted/50',
+        },
+        size: {
+            default: 'p-4 gap-4 ',
+            sm: 'py-3 px-4 gap-2.5',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+        size: 'default',
+    },
+});
+function Item({ className, variant = 'default', size = 'default', asChild = false, ...props }) {
+    const Comp = asChild ? Slot : 'div';
+    return (_jsx(Comp, { "data-slot": "item", "data-variant": variant, "data-size": size, className: cn(itemVariants({ variant, size, className })), ...props }));
+}
+const itemMediaVariants = cva('flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start [&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5', {
+    variants: {
+        variant: {
+            default: 'bg-transparent',
+            icon: "size-8 border rounded-sm bg-muted [&_svg:not([class*='size-'])]:size-4",
+            image: 'size-10 rounded-sm overflow-hidden [&_img]:size-full [&_img]:object-cover',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+function ItemMedia({ className, variant = 'default', ...props }) {
+    return (_jsx("div", { "data-slot": "item-media", "data-variant": variant, className: cn(itemMediaVariants({ variant, className })), ...props }));
+}
+function ItemContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-content", className: cn('flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none', className), ...props }));
+}
+function ItemTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-title", className: cn('flex w-fit items-center gap-2 text-sm leading-snug font-medium', className), ...props }));
+}
+function ItemDescription({ className, ...props }) {
+    return (_jsx("p", { "data-slot": "item-description", className: cn('text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance', '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4', className), ...props }));
+}
+function ItemActions({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-actions", className: cn('flex items-center gap-2', className), ...props }));
+}
+function ItemHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-header", className: cn('flex basis-full items-center justify-between gap-2', className), ...props }));
+}
+function ItemFooter({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-footer", className: cn('flex basis-full items-center justify-between gap-2', className), ...props }));
+}
+export { Item, ItemMedia, ItemContent, ItemActions, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, };

package/lib/components/ui/kbd.d.ts

@@ -0,0 +1,3 @@
+declare function Kbd({ className, ...props }: React.ComponentProps<'kbd'>): import("react/jsx-runtime").JSX.Element;
+declare function KbdGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export { Kbd, KbdGroup };

package/lib/components/ui/kbd.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { cn } from '@/lib/utils';
+function Kbd({ className, ...props }) {
+    return (_jsx("kbd", { "data-slot": "kbd", className: cn('bg-muted text-muted-foreground pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm px-1 font-sans text-xs font-medium select-none', "[&_svg:not([class*='size-'])]:size-3", '[[data-slot=tooltip-content]_&]:bg-background/20 [[data-slot=tooltip-content]_&]:text-background dark:[[data-slot=tooltip-content]_&]:bg-background/10', className), ...props }));
+}
+function KbdGroup({ className, ...props }) {
+    return (_jsx("kbd", { "data-slot": "kbd-group", className: cn('inline-flex items-center gap-1', className), ...props }));
+}
+export { Kbd, KbdGroup };

package/lib/components/ui/label.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+declare function Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+export { Label };

package/lib/components/ui/label.js

@@ -0,0 +1,12 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { cn } from '@/lib/utils';
+function Label({ className, ...props }) {
+    return (_jsx(LabelPrimitive.Root, { "data-slot": "label", className: cn('flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50', className), ...props }));
+}
+export { Label };

package/lib/components/ui/menubar.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import * as MenubarPrimitive from '@radix-ui/react-menubar';
+declare function Menubar({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarMenu({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Menu>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarGroup({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Group>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarPortal({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarRadioGroup({ ...props }: React.ComponentProps<typeof MenubarPrimitive.RadioGroup>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarTrigger({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarContent({ className, align, alignOffset, sideOffset, ...props }: React.ComponentProps<typeof MenubarPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarItem({ className, inset, variant, ...props }: React.ComponentProps<typeof MenubarPrimitive.Item> & {
+    inset?: boolean;
+    variant?: 'default' | 'destructive';
+}): import("react/jsx-runtime").JSX.Element;
+declare function MenubarCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof MenubarPrimitive.CheckboxItem>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarRadioItem({ className, children, ...props }: React.ComponentProps<typeof MenubarPrimitive.RadioItem>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarLabel({ className, inset, ...props }: React.ComponentProps<typeof MenubarPrimitive.Label> & {
+    inset?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSeparator({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.Separator>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarShortcut({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSub({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Sub>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSubTrigger({ className, inset, children, ...props }: React.ComponentProps<typeof MenubarPrimitive.SubTrigger> & {
+    inset?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSubContent({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.SubContent>): import("react/jsx-runtime").JSX.Element;
+export { Menubar, MenubarPortal, MenubarMenu, MenubarTrigger, MenubarContent, MenubarGroup, MenubarSeparator, MenubarLabel, MenubarItem, MenubarShortcut, MenubarCheckboxItem, MenubarRadioGroup, MenubarRadioItem, MenubarSub, MenubarSubTrigger, MenubarSubContent, };