@adea-ai/ui 0.22.2 → 0.23.0

package/dist/components/ui/field.js

@@ -1,66 +1,188 @@
-'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-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3', className), ...props }));
+import { cn } from "../../lib/utils.js";
+import { Label } from "./label.js";
+import { Separator } from "./separator.js";
+import { createComponent, insert, mergeProps, spread, template } from "solid-js/web";
+import { Show, createMemo, splitProps } from "solid-js";
+import { cva } from "class-variance-authority";
+//#region src/components/ui/field.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<fieldset data-slot=field-set>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<legend data-slot=field-legend>`);
+var _tmpl$3 = /*#__PURE__*/ template(`<div data-slot=field-group>`);
+var _tmpl$4 = /*#__PURE__*/ template(`<div role=group data-slot=field>`);
+var _tmpl$5 = /*#__PURE__*/ template(`<div data-slot=field-content>`);
+var _tmpl$6 = /*#__PURE__*/ template(`<div data-slot=field-label>`);
+var _tmpl$7 = /*#__PURE__*/ template(`<p data-slot=field-description>`);
+var _tmpl$8 = /*#__PURE__*/ template(`<span class="relative mx-auto block w-fit bg-background px-2 text-muted-foreground"data-slot=field-separator-content>`);
+var _tmpl$9 = /*#__PURE__*/ template(`<div data-slot=field-separator>`);
+var _tmpl$0 = /*#__PURE__*/ template(`<span>`);
+var _tmpl$1 = /*#__PURE__*/ template(`<ul class="ml-4 flex list-disc flex-col gap-1">`);
+var _tmpl$10 = /*#__PURE__*/ template(`<li>`);
+var _tmpl$11 = /*#__PURE__*/ template(`<div role=alert data-slot=field-error>`);
+function FieldSet(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$ = _tmpl$();
+		spread(_el$, mergeProps({ get ["class"]() {
+			return cn("flex flex-col gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3", local.class);
+		} }, rest), false, false);
+		return _el$;
+	})();
 }
-function FieldLegend({ className, variant = 'legend', ...props }) {
-    return (_jsx("legend", { "data-slot": "field-legend", "data-variant": variant, className: cn('mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base', className), ...props }));
+function FieldLegend(props) {
+	const [local, rest] = splitProps(props, ["class", "variant"]);
+	return (() => {
+		var _el$2 = _tmpl$2();
+		spread(_el$2, mergeProps({
+			get ["data-variant"]() {
+				return local.variant ?? "legend";
+			},
+			get ["class"]() {
+				return cn("mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base", local.class);
+			}
+		}, rest), false, false);
+		return _el$2;
+	})();
 }
-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-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4', className), ...props }));
+function FieldGroup(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$3 = _tmpl$3();
+		spread(_el$3, mergeProps({ get ["class"]() {
+			return cn("group/field-group @container/field-group flex w-full flex-col gap-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4", local.class);
+		} }, rest), false, false);
+		return _el$3;
+	})();
 }
-const fieldVariants = cva('group/field flex w-full gap-2 data-[invalid=true]:text-destructive', {
-    variants: {
-        orientation: {
-            vertical: 'flex-col *:w-full [&>.sr-only]:w-auto',
-            horizontal: 'flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
-            responsive: 'flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
-        },
-    },
-    defaultVariants: {
-        orientation: 'vertical',
-    },
+var fieldVariants = cva("group/field flex w-full gap-2 data-[invalid=true]:text-destructive", {
+	variants: { orientation: {
+		vertical: "flex-col *:w-full [&>.sr-only]:w-auto",
+		horizontal: "flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
+		responsive: "flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @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 Field(props) {
+	const [local, rest] = splitProps(props, ["class", "orientation"]);
+	return (() => {
+		var _el$4 = _tmpl$4();
+		spread(_el$4, mergeProps({
+			get ["data-orientation"]() {
+				return local.orientation ?? "vertical";
+			},
+			get ["class"]() {
+				return cn(fieldVariants({ orientation: local.orientation }), local.class);
+			}
+		}, rest), false, false);
+		return _el$4;
+	})();
 }
-function FieldContent({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "field-content", className: cn('group/field-content flex flex-1 flex-col gap-0.5 leading-snug', className), ...props }));
+function FieldContent(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$5 = _tmpl$5();
+		spread(_el$5, mergeProps({ get ["class"]() {
+			return cn("group/field-content flex flex-1 flex-col gap-0.5 leading-snug", local.class);
+		} }, rest), false, false);
+		return _el$5;
+	})();
 }
-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-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-muted/50 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-3 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/50 *:data-[slot=field]:p-2.5 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10', 'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col', className), ...props }));
+function FieldLabel(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(Label, mergeProps({
+		"data-slot": "field-label",
+		get ["class"]() {
+			return cn("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-data-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-muted/50 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-3 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/50 *:data-[slot=field]:p-2.5 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col", local.class);
+		}
+	}, rest));
 }
-function FieldTitle({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "field-label", className: cn('flex w-fit items-center gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50', className), ...props }));
+function FieldTitle(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$6 = _tmpl$6();
+		spread(_el$6, mergeProps({ get ["class"]() {
+			return cn("flex w-fit items-center gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50", local.class);
+		} }, rest), false, false);
+		return _el$6;
+	})();
 }
-function FieldDescription({ className, ...props }) {
-    return (_jsx("p", { "data-slot": "field-description", className: cn('text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5', 'last:mt-0 nth-last-2:-mt-1', '[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary', className), ...props }));
+function FieldDescription(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$7 = _tmpl$7();
+		spread(_el$7, mergeProps({ get ["class"]() {
+			return cn("text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5", "last:mt-0 nth-last-2:-mt-1", "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", local.class);
+		} }, rest), false, false);
+		return _el$7;
+	})();
 }
-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: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground", "data-slot": "field-separator-content", children: children }))] }));
+function FieldSeparator(props) {
+	const [local, rest] = splitProps(props, ["class", "children"]);
+	return (() => {
+		var _el$8 = _tmpl$9();
+		spread(_el$8, mergeProps({
+			get ["data-content"]() {
+				return !!local.children;
+			},
+			get ["class"]() {
+				return cn("relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2", local.class);
+			}
+		}, rest), false, true);
+		insert(_el$8, createComponent(Separator, { "class": "absolute inset-0 top-1/2" }), null);
+		insert(_el$8, createComponent(Show, {
+			get when() {
+				return local.children;
+			},
+			get children() {
+				var _el$9 = _tmpl$8();
+				insert(_el$9, () => local.children);
+				return _el$9;
+			}
+		}), null);
+		return _el$8;
+	})();
 }
-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-sm font-normal text-destructive', className), ...props, children: content }));
+function FieldError(props) {
+	const [local, rest] = splitProps(props, [
+		"class",
+		"children",
+		"errors"
+	]);
+	const content = createMemo(() => {
+		if (local.children) return local.children;
+		const errors = local.errors;
+		if (!errors?.length) return null;
+		const uniqueErrors = [...new Map(errors.map((error) => [error?.message, error])).values()];
+		if (uniqueErrors.length === 1) {
+			const message = uniqueErrors[0]?.message;
+			return message ? (() => {
+				var _el$0 = _tmpl$0();
+				insert(_el$0, message);
+				return _el$0;
+			})() : null;
+		}
+		return (() => {
+			var _el$1 = _tmpl$1();
+			insert(_el$1, () => uniqueErrors.map((error) => error?.message && (() => {
+				var _el$10 = _tmpl$10();
+				insert(_el$10, () => error.message);
+				return _el$10;
+			})()));
+			return _el$1;
+		})();
+	});
+	return createComponent(Show, {
+		get when() {
+			return content();
+		},
+		get children() {
+			var _el$11 = _tmpl$11();
+			spread(_el$11, mergeProps({ get ["class"]() {
+				return cn("text-sm font-normal text-destructive", local.class);
+			} }, rest), false, true);
+			insert(_el$11, content);
+			return _el$11;
+		}
+	});
 }
-export { Field, FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, };
+//#endregion
+export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle };

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

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

package/dist/components/ui/input.js

@@ -1,7 +1,22 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Input as InputPrimitive } from '@base-ui/react/input';
-import { cn } from '#lib/utils';
-function Input({ className, type, ...props }) {
-    return (_jsx(InputPrimitive, { type: type, "data-slot": "input", className: cn('h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40', className), ...props }));
+import { cn } from "../../lib/utils.js";
+import { mergeProps, spread, template } from "solid-js/web";
+import { splitProps } from "solid-js";
+//#region src/components/ui/input.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<input data-slot=input>`);
+function Input(props) {
+	const [local, rest] = splitProps(props, ["class", "type"]);
+	return (() => {
+		var _el$ = _tmpl$();
+		spread(_el$, mergeProps({
+			get type() {
+				return local.type;
+			},
+			get ["class"]() {
+				return cn("h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", local.class);
+			}
+		}, rest), false, false);
+		return _el$;
+	})();
 }
+//#endregion
 export { Input };

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

@@ -1,3 +1,3 @@
-import * as React from 'react';
-declare function Label({ className, ...props }: React.ComponentProps<'label'>): React.JSX.Element;
+import { type ComponentProps } from 'solid-js';
+declare function Label(props: ComponentProps<'label'>): import("solid-js").JSX.Element;
 export { Label };

package/dist/components/ui/label.js

@@ -1,7 +1,17 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from '#lib/utils';
-function Label({ className, ...props }) {
-    return (_jsx("label", { "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 }));
+import { cn } from "../../lib/utils.js";
+import { mergeProps, spread, template } from "solid-js/web";
+import { splitProps } from "solid-js";
+//#region src/components/ui/label.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<label data-slot=label>`);
+function Label(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$ = _tmpl$();
+		spread(_el$, mergeProps({ get ["class"]() {
+			return 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", local.class);
+		} }, rest), false, false);
+		return _el$;
+	})();
 }
+//#endregion
 export { Label };

package/dist/components/ui/radio-group.d.ts

@@ -1,5 +1,5 @@
-import { Radio as RadioPrimitive } from '@base-ui/react/radio';
-import { RadioGroup as RadioGroupPrimitive } from '@base-ui/react/radio-group';
-declare function RadioGroup({ className, ...props }: RadioGroupPrimitive.Props): import("react").JSX.Element;
-declare function RadioGroupItem({ className, ...props }: RadioPrimitive.Root.Props): import("react").JSX.Element;
+import { RadioGroup as RadioGroupPrimitive } from '@kobalte/core/radio-group';
+import { type ComponentProps } from 'solid-js';
+declare function RadioGroup(props: ComponentProps<typeof RadioGroupPrimitive>): import("solid-js").JSX.Element;
+declare function RadioGroupItem(props: ComponentProps<typeof RadioGroupPrimitive.Item>): import("solid-js").JSX.Element;
 export { RadioGroup, RadioGroupItem };

package/dist/components/ui/radio-group.js

@@ -1,12 +1,39 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Radio as RadioPrimitive } from '@base-ui/react/radio';
-import { RadioGroup as RadioGroupPrimitive } from '@base-ui/react/radio-group';
-import { cn } from '#lib/utils';
-function RadioGroup({ className, ...props }) {
-    return (_jsx(RadioGroupPrimitive, { "data-slot": "radio-group", className: cn('grid w-full gap-2', className), ...props }));
+import { cn } from "../../lib/utils.js";
+import { createComponent, mergeProps, template } from "solid-js/web";
+import { splitProps } from "solid-js";
+import { RadioGroup as RadioGroup$1 } from "@kobalte/core/radio-group";
+//#region src/components/ui/radio-group.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<span class="absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary-foreground">`);
+function RadioGroup(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(RadioGroup$1, mergeProps({
+		"data-slot": "radio-group",
+		get ["class"]() {
+			return cn("grid w-full gap-2", local.class);
+		}
+	}, rest));
 }
-function RadioGroupItem({ className, ...props }) {
-    return (_jsx(RadioPrimitive.Root, { "data-slot": "radio-group-item", className: cn('group/radio-group-item peer relative flex aspect-square size-4 shrink-0 rounded-full border border-input outline-none 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', className), ...props, children: _jsx(RadioPrimitive.Indicator, { "data-slot": "radio-group-indicator", className: "flex size-4 items-center justify-center", children: _jsx("span", { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary-foreground" }) }) }));
+function RadioGroupItem(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(RadioGroup$1.Item, mergeProps({
+		"data-slot": "radio-group-item",
+		get ["class"]() {
+			return cn("group/radio-group-item peer relative flex aspect-square size-4 shrink-0 rounded-full border border-input outline-none 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", local.class);
+		}
+	}, rest, { get children() {
+		return [createComponent(RadioGroup$1.ItemInput, {}), createComponent(RadioGroup$1.ItemControl, {
+			"class": "flex size-4 items-center justify-center rounded-full",
+			get children() {
+				return createComponent(RadioGroup$1.ItemIndicator, {
+					"data-slot": "radio-group-indicator",
+					"class": "flex size-4 items-center justify-center",
+					get children() {
+						return _tmpl$();
+					}
+				});
+			}
+		})];
+	} }));
 }
+//#endregion
 export { RadioGroup, RadioGroupItem };

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

@@ -1,3 +1,7 @@
-import { Separator as SeparatorPrimitive } from '@base-ui/react/separator';
-declare function Separator({ className, orientation, ...props }: SeparatorPrimitive.Props): import("react").JSX.Element;
+import { Separator as SeparatorPrimitive } from '@kobalte/core/separator';
+import { type ComponentProps } from 'solid-js';
+type SeparatorProps = ComponentProps<typeof SeparatorPrimitive> & {
+    orientation?: 'horizontal' | 'vertical';
+};
+declare function Separator(props: SeparatorProps): import("solid-js").JSX.Element;
 export { Separator };

package/dist/components/ui/separator.js

@@ -1,8 +1,20 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Separator as SeparatorPrimitive } from '@base-ui/react/separator';
-import { cn } from '#lib/utils';
-function Separator({ className, orientation = 'horizontal', ...props }) {
-    return (_jsx(SeparatorPrimitive, { "data-slot": "separator", orientation: orientation, className: cn('shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch', className), ...props }));
+import { cn } from "../../lib/utils.js";
+import { createComponent, mergeProps } from "solid-js/web";
+import { splitProps } from "solid-js";
+import { Separator as Separator$1 } from "@kobalte/core/separator";
+//#region src/components/ui/separator.tsx
+function Separator(props) {
+	const [local, rest] = splitProps(props, ["class", "orientation"]);
+	const orientation = () => local.orientation ?? "horizontal";
+	return createComponent(Separator$1, mergeProps({
+		"data-slot": "separator",
+		get orientation() {
+			return orientation();
+		},
+		get ["class"]() {
+			return cn("shrink-0 bg-border", orientation() === "vertical" ? "w-px self-stretch" : "h-px w-full", local.class);
+		}
+	}, rest));
 }
+//#endregion
 export { Separator };

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

@@ -1,2 +1,3 @@
-declare function Skeleton({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
+import { type ComponentProps } from 'solid-js';
+declare function Skeleton(props: ComponentProps<'div'>): import("solid-js").JSX.Element;
 export { Skeleton };

package/dist/components/ui/skeleton.js

@@ -1,6 +1,17 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from '#lib/utils';
-function Skeleton({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "skeleton", className: cn('animate-pulse rounded-md bg-muted', className), ...props }));
+import { cn } from "../../lib/utils.js";
+import { mergeProps, spread, template } from "solid-js/web";
+import { splitProps } from "solid-js";
+//#region src/components/ui/skeleton.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div data-slot=skeleton>`);
+function Skeleton(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$ = _tmpl$();
+		spread(_el$, mergeProps({ get ["class"]() {
+			return cn("animate-pulse rounded-md bg-muted", local.class);
+		} }, rest), false, false);
+		return _el$;
+	})();
 }
+//#endregion
 export { Skeleton };

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

@@ -1,4 +1,5 @@
-import { LoaderCircle } from 'lucide-react';
-import type { ComponentProps } from 'react';
-declare function Spinner({ className, ...props }: ComponentProps<typeof LoaderCircle>): import("react").JSX.Element;
+import { LoaderCircle } from 'lucide-solid';
+import { type ComponentProps } from 'solid-js';
+type SpinnerProps = ComponentProps<typeof LoaderCircle>;
+declare function Spinner(props: SpinnerProps): import("solid-js").JSX.Element;
 export { Spinner };

package/dist/components/ui/spinner.js

@@ -1,7 +1,17 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { LoaderCircle } from 'lucide-react';
-import { cn } from '#lib/utils';
-function Spinner({ className, ...props }) {
-    return (_jsx(LoaderCircle, { role: "status", "aria-label": "Loading", className: cn('animate-spin', className), ...props }));
+import { cn } from "../../lib/utils.js";
+import { createComponent, mergeProps } from "solid-js/web";
+import { LoaderCircle } from "lucide-solid";
+import { splitProps } from "solid-js";
+//#region src/components/ui/spinner.tsx
+function Spinner(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(LoaderCircle, mergeProps({
+		role: "status",
+		"aria-label": "Loading",
+		get ["class"]() {
+			return cn("animate-spin", local.class);
+		}
+	}, rest));
 }
+//#endregion
 export { Spinner };

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

@@ -1,5 +1,8 @@
-import { Switch as SwitchPrimitive } from '@base-ui/react/switch';
-declare function Switch({ className, size, ...props }: SwitchPrimitive.Root.Props & {
+import { Switch as SwitchPrimitive } from '@kobalte/core/switch';
+import { type ComponentProps } from 'solid-js';
+type SwitchProps = ComponentProps<typeof SwitchPrimitive> & {
+    class?: string;
     size?: 'sm' | 'default';
-}): import("react").JSX.Element;
+};
+declare function Switch(props: SwitchProps): import("solid-js").JSX.Element;
 export { Switch };

package/dist/components/ui/switch.js

@@ -1,8 +1,59 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Switch as SwitchPrimitive } from '@base-ui/react/switch';
-import { cn } from '#lib/utils';
-function Switch({ className, size = 'default', ...props }) {
-    return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", "data-size": size, className: cn('peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50', className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: "pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground" }) }));
+import { cn } from "../../lib/utils.js";
+import { createComponent, mergeProps } from "solid-js/web";
+import { splitProps } from "solid-js";
+import { Switch as Switch$1 } from "@kobalte/core/switch";
+//#region src/components/ui/switch.tsx
+function Switch(props) {
+	const [local, rest] = splitProps(props, [
+		"class",
+		"size",
+		"aria-label",
+		"aria-describedby"
+	]);
+	return createComponent(Switch$1, mergeProps({
+		"data-slot": "switch",
+		get ["data-size"]() {
+			return local.size ?? "default";
+		},
+		get ["class"]() {
+			return cn("peer group/switch relative inline-flex shrink-0 items-center", local.class);
+		}
+	}, rest, { get children() {
+		return [createComponent(Switch$1.Input, {
+			get ["aria-label"]() {
+				return local["aria-label"];
+			},
+			get ["aria-describedby"]() {
+				return local["aria-describedby"];
+			},
+			style: {
+				position: "absolute",
+				inset: "0",
+				width: "100%",
+				height: "100%",
+				margin: "0",
+				padding: "0",
+				border: "0",
+				opacity: "0",
+				cursor: "pointer",
+				clip: "auto",
+				"clip-path": "none",
+				overflow: "visible",
+				"white-space": "normal",
+				"z-index": "2"
+			}
+		}), createComponent(Switch$1.Control, {
+			get ["class"]() {
+				return cn("inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 group-data-[size=default]/switch:h-[18.4px] group-data-[size=default]/switch:w-[32px] group-data-[size=sm]/switch:h-[14px] group-data-[size=sm]/switch:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 group-data-checked/switch:bg-primary group-not-data-checked/switch:bg-input dark:group-not-data-checked/switch:bg-input/80 group-data-disabled/switch:cursor-not-allowed group-data-disabled/switch:opacity-50");
+			},
+			get children() {
+				return createComponent(Switch$1.Thumb, {
+					"data-slot": "switch-thumb",
+					"class": "pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-checked/switch:translate-x-[calc(100%-2px)] dark:group-data-checked/switch:bg-primary-foreground dark:group-not-data-checked/switch:bg-foreground"
+				});
+			}
+		})];
+	} }));
 }
+//#endregion
 export { Switch };

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

@@ -1,10 +1,11 @@
-import { Tabs as TabsPrimitive } from '@base-ui/react/tabs';
+import { Tabs as TabsPrimitive } from '@kobalte/core/tabs';
 import { type VariantProps } from 'class-variance-authority';
-declare function Tabs({ className, orientation, ...props }: TabsPrimitive.Root.Props): import("react").JSX.Element;
+import { type ComponentProps } from 'solid-js';
+declare function Tabs(props: ComponentProps<typeof TabsPrimitive>): import("solid-js").JSX.Element;
 declare const tabsListVariants: (props?: ({
     variant?: "default" | "line" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function TabsList({ className, variant, ...props }: TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>): import("react").JSX.Element;
-declare function TabsTrigger({ className, ...props }: TabsPrimitive.Tab.Props): import("react").JSX.Element;
-declare function TabsContent({ className, ...props }: TabsPrimitive.Panel.Props): import("react").JSX.Element;
+declare function TabsList(props: ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>): import("solid-js").JSX.Element;
+declare function TabsTrigger(props: ComponentProps<typeof TabsPrimitive.Trigger>): import("solid-js").JSX.Element;
+declare function TabsContent(props: ComponentProps<typeof TabsPrimitive.Content>): import("solid-js").JSX.Element;
 export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants };