@rark-ui/themes 1.0.0

package/dist/default/crafts/core/switch.js

@@ -0,0 +1,66 @@
+import { tv } from '../../../shared/utils/tv';
+const prefix = 'rui-switch';
+export const tvSwitch = tv({
+    slots: {
+        root: [
+            'inline-flex',
+            'items-center',
+            'gap-2',
+            'w-fit',
+            'group/switch',
+        ],
+        control: [
+            'block',
+            'shrink-0',
+            'rounded-full',
+            'border-2',
+            'transition-colors',
+            'disabled:opacity-(--disabled-opacity)',
+        ],
+        thumb: [
+            'pointer-events-none',
+            'block',
+            'size-3.5',
+            'rounded-full',
+            'origin-center',
+            'transition-transform',
+            'data-[state=checked]:translate-x-full',
+            'data-[state=unchecked]:translate-x-0',
+        ],
+        label: '',
+    },
+    variants: {
+        size: {
+            xs: {
+                control: 'w-7 h-4',
+                thumb: 'size-3',
+                label: 'text-xs',
+            },
+            sm: {
+                control: 'w-8 h-4.5',
+                thumb: 'size-3.5',
+                label: 'text-sm',
+            },
+            base: {
+                control: 'w-9 h-5',
+                thumb: 'size-4',
+                label: 'text-base',
+            },
+            lg: {
+                control: 'w-10 h-5.5',
+                thumb: 'size-4.5',
+                label: 'text-lg',
+            },
+        },
+    },
+    defaultVariants: {
+        size: 'base',
+    },
+}, {
+    slots: {
+        root: prefix,
+        control: `${prefix}-control`,
+        thumb: `${prefix}-thumb`,
+        label: `${prefix}-label`,
+    },
+});

package/dist/default/crafts/core/tabs.d.ts

@@ -0,0 +1,119 @@
+import type { VariantProps } from '../../../shared/utils/tv';
+export declare const tvTabs: import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            trigger: string;
+        };
+        sm: {
+            trigger: string;
+        };
+        base: {
+            trigger: string;
+        };
+        lg: {
+            trigger: string;
+        };
+    };
+    orientation: {
+        horizontal: {
+            indicator: string;
+        };
+        vertical: {
+            indicator: string;
+        };
+    };
+    prev: {
+        true: string;
+        false: string;
+    };
+    next: {
+        true: string;
+        false: string;
+    };
+} & {
+    unstyled: {
+        true: import("tailwind-merge").ClassNameValue;
+        false: import("tailwind-merge").ClassNameValue;
+    };
+}, {
+    root: string;
+    list: string[];
+    trigger: string[];
+    content: string[];
+    indicator: never[];
+}, undefined, {
+    size: {
+        xs: {
+            trigger: string;
+        };
+        sm: {
+            trigger: string;
+        };
+        base: {
+            trigger: string;
+        };
+        lg: {
+            trigger: string;
+        };
+    };
+    orientation: {
+        horizontal: {
+            indicator: string;
+        };
+        vertical: {
+            indicator: string;
+        };
+    };
+    prev: {
+        true: string;
+        false: string;
+    };
+    next: {
+        true: string;
+        false: string;
+    };
+}, {
+    root: string;
+    list: string[];
+    trigger: string[];
+    content: string[];
+    indicator: never[];
+}, import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            trigger: string;
+        };
+        sm: {
+            trigger: string;
+        };
+        base: {
+            trigger: string;
+        };
+        lg: {
+            trigger: string;
+        };
+    };
+    orientation: {
+        horizontal: {
+            indicator: string;
+        };
+        vertical: {
+            indicator: string;
+        };
+    };
+    prev: {
+        true: string;
+        false: string;
+    };
+    next: {
+        true: string;
+        false: string;
+    };
+}, {
+    root: string;
+    list: string[];
+    trigger: string[];
+    content: string[];
+    indicator: never[];
+}, undefined, unknown, unknown>>;
+export type TabsVariants = VariantProps<typeof tvTabs>;

package/dist/default/crafts/core/tabs.js

@@ -0,0 +1,116 @@
+import { tv } from '../../../shared/utils/tv';
+const prefix = 'rui-tabs';
+export const tvTabs = tv({
+    slots: {
+        root: '',
+        list: ['flex', 'items-center', 'relative', 'overflow-hidden'],
+        trigger: [
+            'inline-flex',
+            'items-center',
+            'justify-center',
+            'whitespace-nowrap',
+            'rounded',
+            'transition-all',
+            'outline-offset-[-2px]',
+            'disabled:pointer-events-none',
+            'disabled:opacity-(--disabled-opacity)',
+        ],
+        content: ['mt-2'],
+        indicator: [],
+    },
+    variants: {
+        size: {
+            xs: {
+                trigger: 'text-xs',
+            },
+            sm: {
+                trigger: 'text-sm',
+            },
+            base: {
+                trigger: 'text-base',
+            },
+            lg: {
+                trigger: 'text-lg',
+            },
+        },
+        orientation: {
+            horizontal: {
+                indicator: 'w-(--width) bottom-0',
+            },
+            vertical: {
+                indicator: 'h-(--height)',
+            },
+        },
+        prev: {
+            true: '',
+            false: '',
+        },
+        next: {
+            true: '',
+            false: '',
+        },
+    },
+    compoundVariants: [
+        // horizontal
+        {
+            orientation: 'horizontal',
+            size: 'xs',
+            class: {
+                trigger: 'px-3 py-2',
+                indicator: 'h-0.5',
+            },
+        },
+        {
+            orientation: 'horizontal',
+            size: 'sm',
+            class: {
+                trigger: 'px-3.5 py-2.5',
+                indicator: 'h-0.75',
+            },
+        },
+        {
+            orientation: 'horizontal',
+            size: 'base',
+            class: {
+                trigger: 'px-4 py-3',
+                indicator: 'h-1',
+            },
+        },
+        {
+            orientation: 'horizontal',
+            size: 'lg',
+            class: {
+                trigger: 'px-4.5 py-3.5',
+                indicator: 'h-1.25',
+            },
+        },
+        {
+            orientation: 'horizontal',
+            prev: true,
+            class: {
+                content: 'data-[state=open]:-motion-translate-x-in data-[state=open]:motion-opacity-in',
+            },
+        },
+        {
+            orientation: 'horizontal',
+            next: true,
+            class: {
+                content: 'data-[state=open]:motion-translate-x-in data-[state=open]:motion-opacity-in',
+            },
+        },
+    ],
+    defaultVariants: {
+        size: 'base',
+        orientation: 'horizontal',
+        prev: false,
+        next: false,
+    },
+}, {
+    slots: {
+        root: prefix,
+        list: `${prefix}-list`,
+        trigger: `${prefix}-trigger`,
+        content: `${prefix}-content`,
+        indicator: `${prefix}-indicator`,
+    },
+});

package/dist/default/crafts/core/tags-input.d.ts

@@ -0,0 +1,158 @@
+import type { VariantProps } from '../../../shared/utils/tv';
+export declare const tvTagsInput: import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        sm: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        base: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        lg: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+    };
+    inline: {
+        true: {
+            control: string[];
+            scrollArea: string[];
+            scrollAreaContent: string[];
+            input: string[];
+            itemText: string;
+        };
+        false: {
+            control: string;
+        };
+    };
+    empty: {
+        true: {
+            scrollArea: string;
+        };
+    };
+} & {
+    unstyled: {
+        true: import("tailwind-merge").ClassNameValue;
+        false: import("tailwind-merge").ClassNameValue;
+    };
+}, {
+    root: string[];
+    control: string[];
+    scrollArea: string;
+    scrollAreaContent: string;
+    input: string[];
+    item: string;
+    itemPreview: string;
+    itemInput: string;
+    itemText: string;
+}, undefined, {
+    size: {
+        xs: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        sm: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        base: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        lg: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+    };
+    inline: {
+        true: {
+            control: string[];
+            scrollArea: string[];
+            scrollAreaContent: string[];
+            input: string[];
+            itemText: string;
+        };
+        false: {
+            control: string;
+        };
+    };
+    empty: {
+        true: {
+            scrollArea: string;
+        };
+    };
+}, {
+    root: string[];
+    control: string[];
+    scrollArea: string;
+    scrollAreaContent: string;
+    input: string[];
+    item: string;
+    itemPreview: string;
+    itemInput: string;
+    itemText: string;
+}, import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        sm: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        base: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+        lg: {
+            input: string;
+            itemPreview: string;
+            itemInput: string;
+        };
+    };
+    inline: {
+        true: {
+            control: string[];
+            scrollArea: string[];
+            scrollAreaContent: string[];
+            input: string[];
+            itemText: string;
+        };
+        false: {
+            control: string;
+        };
+    };
+    empty: {
+        true: {
+            scrollArea: string;
+        };
+    };
+}, {
+    root: string[];
+    control: string[];
+    scrollArea: string;
+    scrollAreaContent: string;
+    input: string[];
+    item: string;
+    itemPreview: string;
+    itemInput: string;
+    itemText: string;
+}, undefined, unknown, unknown>>;
+export type TagsInputVariants = VariantProps<typeof tvTagsInput>;

package/dist/default/crafts/core/tags-input.js

@@ -0,0 +1,72 @@
+import { tv } from '../../../shared/utils/tv';
+const prefix = 'rui-tags-input';
+export const tvTagsInput = tv({
+    slots: {
+        root: ['flex flex-col'],
+        control: ['flex', 'items-center'],
+        scrollArea: '',
+        scrollAreaContent: '',
+        input: ['focus:outline-none', 'bg-transparent'],
+        item: '',
+        itemPreview: 'flex items-center gap-1 rounded-full cursor-default',
+        itemInput: 'p-0 w-fit min-w-0 outline-none',
+        itemText: '',
+    },
+    variants: {
+        size: {
+            xs: {
+                input: 'text-xs',
+                itemPreview: 'text-xs px-1.5',
+                itemInput: 'text-xs px-0.5',
+            },
+            sm: {
+                input: 'text-sm',
+                itemPreview: 'text-sm px-2',
+                itemInput: 'text-sm px-1',
+            },
+            base: {
+                input: 'text-base',
+                itemPreview: 'text-base px-2.5',
+                itemInput: 'text-base px-1.5',
+            },
+            lg: {
+                input: 'text-lg',
+                itemPreview: 'text-lg px-2.5',
+                itemInput: 'text-lg px-1.5',
+            },
+        },
+        inline: {
+            true: {
+                control: ['flex-nowrap', 'p-0', 'gap-0'],
+                scrollArea: ['flex-shrink-0', 'py-1.5', 'px-2', 'max-w-[calc(100%-var(--spacing)*10)]'],
+                scrollAreaContent: ['flex', 'flex-nowrap', 'gap-2'],
+                input: ['flex-shrink-1', 'py-1.5', 'px-2', 'min-w-5'],
+                itemText: 'whitespace-nowrap',
+            },
+            false: {
+                control: 'flex-wrap',
+            },
+        },
+        empty: {
+            true: {
+                scrollArea: 'p-0',
+            },
+        },
+    },
+    defaultVariants: {
+        size: 'base',
+        inline: true,
+    },
+}, {
+    slots: {
+        root: prefix,
+        control: `${prefix}-control`,
+        input: `${prefix}-input`,
+        scrollArea: `${prefix}-scroll-area`,
+        scrollAreaContent: `${prefix}-scroll-area-content`,
+        item: `${prefix}-item`,
+        itemPreview: `${prefix}-item-preview`,
+        itemInput: `${prefix}-item-input`,
+        itemText: `${prefix}-item-text`,
+    },
+});

package/dist/default/crafts/core/toast.d.ts

@@ -0,0 +1,137 @@
+import type { VariantProps } from '../../../shared/utils/tv';
+export declare const tvToast: import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        sm: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        base: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        lg: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+    };
+} & {
+    unstyled: {
+        true: import("tailwind-merge").ClassNameValue;
+        false: import("tailwind-merge").ClassNameValue;
+    };
+}, {
+    root: string[];
+    content: string[];
+    inner: string;
+    title: string;
+    description: string;
+    icon: string;
+    close: string;
+}, undefined, {
+    size: {
+        xs: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        sm: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        base: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        lg: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+    };
+}, {
+    root: string[];
+    content: string[];
+    inner: string;
+    title: string;
+    description: string;
+    icon: string;
+    close: string;
+}, import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        sm: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        base: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+        lg: {
+            content: string;
+            inner: string;
+            icon: string;
+            close: string;
+            title: string;
+            description: string;
+        };
+    };
+}, {
+    root: string[];
+    content: string[];
+    inner: string;
+    title: string;
+    description: string;
+    icon: string;
+    close: string;
+}, undefined, unknown, unknown>>;
+export type ToastVariants = VariantProps<typeof tvToast>;