flowbite-svelte 0.47.2 → 1.0.0-next.1

package/dist/toolbar/theme.d.ts

@@ -0,0 +1,432 @@
+export declare const toolbar: import("tailwind-variants").TVReturnType<{
+    embedded: {
+        true: {};
+        false: {
+            base: string;
+        };
+    };
+    color: {
+        default: {};
+        primary: {
+            base: string;
+        };
+        secondary: {
+            base: string;
+        };
+    };
+    separators: {
+        true: {
+            content: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+}, undefined, import("tailwind-variants/dist/config").TVConfig<{
+    embedded: {
+        true: {};
+        false: {
+            base: string;
+        };
+    };
+    color: {
+        default: {};
+        primary: {
+            base: string;
+        };
+        secondary: {
+            base: string;
+        };
+    };
+    separators: {
+        true: {
+            content: string;
+        };
+    };
+}, {
+    embedded: {
+        true: {};
+        false: {
+            base: string;
+        };
+    };
+    color: {
+        default: {};
+        primary: {
+            base: string;
+        };
+        secondary: {
+            base: string;
+        };
+    };
+    separators: {
+        true: {
+            content: string;
+        };
+    };
+}>, {
+    embedded: {
+        true: {};
+        false: {
+            base: string;
+        };
+    };
+    color: {
+        default: {};
+        primary: {
+            base: string;
+        };
+        secondary: {
+            base: string;
+        };
+    };
+    separators: {
+        true: {
+            content: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+}, import("tailwind-variants").TVReturnType<{
+    embedded: {
+        true: {};
+        false: {
+            base: string;
+        };
+    };
+    color: {
+        default: {};
+        primary: {
+            base: string;
+        };
+        secondary: {
+            base: string;
+        };
+    };
+    separators: {
+        true: {
+            content: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+}, undefined, import("tailwind-variants/dist/config").TVConfig<{
+    embedded: {
+        true: {};
+        false: {
+            base: string;
+        };
+    };
+    color: {
+        default: {};
+        primary: {
+            base: string;
+        };
+        secondary: {
+            base: string;
+        };
+    };
+    separators: {
+        true: {
+            content: string;
+        };
+    };
+}, {
+    embedded: {
+        true: {};
+        false: {
+            base: string;
+        };
+    };
+    color: {
+        default: {};
+        primary: {
+            base: string;
+        };
+        secondary: {
+            base: string;
+        };
+    };
+    separators: {
+        true: {
+            content: string;
+        };
+    };
+}>, unknown, unknown, undefined>>;
+export declare const toolbarGroup: import("tailwind-variants").TVReturnType<{
+    spacing: {
+        default: string;
+        tight: string;
+        loose: string;
+    };
+    padding: {
+        default: string;
+        none: string;
+    };
+    position: {
+        middle: string;
+        first: string;
+        last: string;
+    };
+}, undefined, "flex items-center", import("tailwind-variants/dist/config").TVConfig<{
+    spacing: {
+        default: string;
+        tight: string;
+        loose: string;
+    };
+    padding: {
+        default: string;
+        none: string;
+    };
+    position: {
+        middle: string;
+        first: string;
+        last: string;
+    };
+}, {
+    spacing: {
+        default: string;
+        tight: string;
+        loose: string;
+    };
+    padding: {
+        default: string;
+        none: string;
+    };
+    position: {
+        middle: string;
+        first: string;
+        last: string;
+    };
+}>, {
+    spacing: {
+        default: string;
+        tight: string;
+        loose: string;
+    };
+    padding: {
+        default: string;
+        none: string;
+    };
+    position: {
+        middle: string;
+        first: string;
+        last: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    spacing: {
+        default: string;
+        tight: string;
+        loose: string;
+    };
+    padding: {
+        default: string;
+        none: string;
+    };
+    position: {
+        middle: string;
+        first: string;
+        last: string;
+    };
+}, undefined, "flex items-center", import("tailwind-variants/dist/config").TVConfig<{
+    spacing: {
+        default: string;
+        tight: string;
+        loose: string;
+    };
+    padding: {
+        default: string;
+        none: string;
+    };
+    position: {
+        middle: string;
+        first: string;
+        last: string;
+    };
+}, {
+    spacing: {
+        default: string;
+        tight: string;
+        loose: string;
+    };
+    padding: {
+        default: string;
+        none: string;
+    };
+    position: {
+        middle: string;
+        first: string;
+        last: string;
+    };
+}>, unknown, unknown, undefined>>;
+export declare const toolbarButton: import("tailwind-variants").TVReturnType<{
+    color: {
+        dark: string;
+        gray: string;
+        red: string;
+        yellow: string;
+        green: string;
+        indigo: string;
+        purple: string;
+        pink: string;
+        blue: string;
+        primary: string;
+        default: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    background: {
+        true: string;
+        false: string;
+    };
+}, undefined, "focus:outline-none whitespace-normal", import("tailwind-variants/dist/config").TVConfig<{
+    color: {
+        dark: string;
+        gray: string;
+        red: string;
+        yellow: string;
+        green: string;
+        indigo: string;
+        purple: string;
+        pink: string;
+        blue: string;
+        primary: string;
+        default: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    background: {
+        true: string;
+        false: string;
+    };
+}, {
+    color: {
+        dark: string;
+        gray: string;
+        red: string;
+        yellow: string;
+        green: string;
+        indigo: string;
+        purple: string;
+        pink: string;
+        blue: string;
+        primary: string;
+        default: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    background: {
+        true: string;
+        false: string;
+    };
+}>, {
+    color: {
+        dark: string;
+        gray: string;
+        red: string;
+        yellow: string;
+        green: string;
+        indigo: string;
+        purple: string;
+        pink: string;
+        blue: string;
+        primary: string;
+        default: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    background: {
+        true: string;
+        false: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    color: {
+        dark: string;
+        gray: string;
+        red: string;
+        yellow: string;
+        green: string;
+        indigo: string;
+        purple: string;
+        pink: string;
+        blue: string;
+        primary: string;
+        default: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    background: {
+        true: string;
+        false: string;
+    };
+}, undefined, "focus:outline-none whitespace-normal", import("tailwind-variants/dist/config").TVConfig<{
+    color: {
+        dark: string;
+        gray: string;
+        red: string;
+        yellow: string;
+        green: string;
+        indigo: string;
+        purple: string;
+        pink: string;
+        blue: string;
+        primary: string;
+        default: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    background: {
+        true: string;
+        false: string;
+    };
+}, {
+    color: {
+        dark: string;
+        gray: string;
+        red: string;
+        yellow: string;
+        green: string;
+        indigo: string;
+        purple: string;
+        pink: string;
+        blue: string;
+        primary: string;
+        default: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    background: {
+        true: string;
+        false: string;
+    };
+}>, unknown, unknown, undefined>>;

package/dist/toolbar/theme.js

@@ -0,0 +1,104 @@
+import { tv } from "tailwind-variants";
+export const toolbar = tv({
+    slots: {
+        base: "flex justify-between items-center",
+        content: "flex flex-wrap items-center"
+    },
+    variants: {
+        embedded: {
+            true: {},
+            false: {
+                base: "py-2 px-3"
+            }
+        },
+        color: {
+            default: {},
+            primary: {
+                base: "bg-primary-100 text-primary-800"
+            },
+            secondary: {
+                base: "bg-secondary-100 text-secondary-800"
+            }
+            // Add more color variants as needed
+        },
+        separators: {
+            true: {
+                content: "sm:divide-x rtl:divide-x-reverse"
+            }
+        }
+    },
+    compoundVariants: [
+        {
+            embedded: true,
+            color: "default",
+            class: {
+                base: "bg-transparent"
+            }
+        }
+    ]
+});
+export const toolbarGroup = tv({
+    base: "flex items-center",
+    variants: {
+        spacing: {
+            default: "space-x-1 rtl:space-x-reverse",
+            tight: "space-x-0.5 rtl:space-x-reverse",
+            loose: "space-x-2 rtl:space-x-reverse"
+        },
+        padding: {
+            default: "sm:pe-4 sm:ps-4",
+            none: ""
+        },
+        position: {
+            middle: "",
+            first: "sm:ps-0",
+            last: "sm:pe-0"
+        }
+    },
+    compoundVariants: [
+        {
+            position: ["first", "last"],
+            class: "sm:px-0"
+        }
+    ]
+});
+export const toolbarButton = tv({
+    base: "focus:outline-none whitespace-normal",
+    variants: {
+        color: {
+            dark: "text-gray-500 hover:text-gray-900 hover:bg-gray-200 dark:text-gray-400 dark:hover:text-white dark:hover:bg-gray-600",
+            gray: "text-gray-500 focus:ring-gray-400 hover:bg-gray-200 dark:hover:bg-gray-800 dark:hover:text-gray-300",
+            red: "text-red-500 focus:ring-red-400 hover:bg-red-200 dark:hover:bg-red-800 dark:hover:text-red-300",
+            yellow: "text-yellow-500 focus:ring-yellow-400 hover:bg-yellow-200 dark:hover:bg-yellow-800 dark:hover:text-yellow-300",
+            green: "text-green-500 focus:ring-green-400 hover:bg-green-200 dark:hover:bg-green-800 dark:hover:text-green-300",
+            indigo: "text-indigo-500 focus:ring-indigo-400 hover:bg-indigo-200 dark:hover:bg-indigo-800 dark:hover:text-indigo-300",
+            purple: "text-purple-500 focus:ring-purple-400 hover:bg-purple-200 dark:hover:bg-purple-800 dark:hover:text-purple-300",
+            pink: "text-pink-500 focus:ring-pink-400 hover:bg-pink-200 dark:hover:bg-pink-800 dark:hover:text-pink-300",
+            blue: "text-blue-500 focus:ring-blue-400 hover:bg-blue-200 dark:hover:bg-blue-800 dark:hover:text-blue-300",
+            primary: "text-primary-500 focus:ring-primary-400 hover:bg-primary-200 dark:hover:bg-primary-800 dark:hover:text-primary-300",
+            default: "focus:ring-gray-400 hover:bg-gray-100"
+        },
+        size: {
+            xs: "m-0.5 rounded-sm focus:ring-1 p-0.5",
+            sm: "m-0.5 rounded focus:ring-1 p-0.5",
+            md: "m-0.5 rounded-lg focus:ring-2 p-1.5",
+            lg: "m-0.5 rounded-lg focus:ring-2 p-2.5"
+        },
+        background: {
+            true: "",
+            false: ""
+        }
+    },
+    compoundVariants: [
+        {
+            color: "default",
+            background: true,
+            class: "dark:hover:bg-gray-600"
+        },
+        {
+            color: "default",
+            background: false,
+            class: "dark:hover:bg-gray-700"
+        }
+    ]
+});

package/dist/toolbar/type.d.ts

@@ -0,0 +1,31 @@
+import { type Snippet } from "svelte";
+import type { HTMLAttributes } from "svelte/elements";
+type ToolbarColor = "primary" | "secondary" | "default" | undefined;
+interface ToolbarProps extends HTMLAttributes<HTMLDivElement> {
+    children: Snippet;
+    end?: Snippet;
+    embedded?: boolean;
+    color?: ToolbarColor;
+}
+type SpacingType = "default" | "tight" | "loose" | undefined;
+type PaddingType = "default" | "none" | undefined;
+type PositionType = "first" | "last" | "middle" | undefined;
+interface ToolbarGroupProps extends HTMLAttributes<HTMLDivElement> {
+    children: Snippet;
+    class?: string;
+    spacing?: SpacingType;
+    padding?: PaddingType;
+    position?: PositionType;
+}
+type ToolbarButtonType = "primary" | "default" | "dark" | "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | undefined;
+interface ToolbarButtonProps {
+    children: Snippet;
+    color?: ToolbarButtonType;
+    name?: string;
+    ariaLabel?: string;
+    size?: "xs" | "sm" | "md" | "lg";
+    href?: string;
+    class?: string;
+    onclick?: () => void;
+}
+export type { ToolbarProps, ToolbarGroupProps, ToolbarButtonProps };

package/dist/toolbar/type.js

@@ -0,0 +1 @@
+import {} from "svelte";