flowbite-svelte 0.46.10 → 0.46.12

package/dist/accordion/Accordion.svelte.d.ts

@@ -11,7 +11,7 @@ export interface AccordionCtxType {
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/alert/Alert.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/cards/Card.svelte.d.ts

@@ -3,7 +3,7 @@ import type { SizeType } from '../types';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/dropdown/Dropdown.svelte

@@ -15,6 +15,12 @@ export let footerClass = "py-1 overflow-hidden rounded-b-lg";
 export let classFooter = void 0;
 export let activeClass = "text-primary-700 dark:text-primary-700 hover:text-primary-900 dark:hover:text-primary-900";
 export let classActive = void 0;
+export let arrow = false;
+export let trigger = "click";
+export let placement = "bottom";
+export let color = "dropdown";
+export let shadow = true;
+export let rounded = true;
 let activeCls = twMerge(activeClass, classActive);
 setContext("DropdownType", { activeClass: activeCls });
 $: activeUrlStore.set(activeUrl);
@@ -23,17 +29,9 @@ $: containerCls = twMerge(containerClass, classContainer);
 $: headerCls = twMerge(headerClass, classHeader);
 $: ulCls = twMerge("py-1", $$props.class);
 $: footerCls = twMerge(footerClass, classFooter);
-$: {
-  $$restProps.arrow = $$restProps.arrow ?? false;
-  $$restProps.trigger = $$restProps.trigger ?? "click";
-  $$restProps.placement = $$restProps.placement ?? "bottom";
-  $$restProps.color = $$restProps.color ?? "dropdown";
-  $$restProps.shadow = $$restProps.shadow ?? true;
-  $$restProps.rounded = $$restProps.rounded ?? true;
-}
 </script>
 
-<Popper activeContent {...$$restProps} class={containerCls} on:show bind:open>
+<Popper activeContent {...$$restProps} {trigger} {arrow} {placement} {shadow} {rounded} {color} class={containerCls} on:show bind:open>
   {#if $$slots.header}
     <div class={headerCls}>
       <slot name="header" />
@@ -63,4 +61,10 @@ $: {
 @prop export let classFooter: string | undefined = undefined;
 @prop export let activeClass: string = 'text-primary-700 dark:text-primary-700 hover:text-primary-900 dark:hover:text-primary-900';
 @prop export let classActive: string | undefined = undefined;
+@prop export let arrow: boolean = false;
+@prop export let trigger: 'hover' | 'click' | 'focus' = 'click';
+@prop export let placement: Placement = 'bottom';
+@prop export let color: FrameColor = 'dropdown';
+@prop export let shadow: boolean = true;
+@prop export let rounded: boolean = true;
 -->

package/dist/dropdown/Dropdown.svelte.d.ts

@@ -2,42 +2,27 @@ import { SvelteComponentTyped } from "svelte";
 export type DropdownType = {
     activeClass: string;
 };
+import type { Placement } from '@floating-ui/dom';
+import type { FrameColor } from '../utils/Frame.svelte';
 declare const __propDef: {
-    props: import("svelte/elements").HTMLAnchorAttributes & {
-        tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
-        rounded?: boolean;
-        border?: boolean;
-        shadow?: boolean;
-        node?: HTMLElement | undefined;
-        use?: import("svelte/action").Action<HTMLElement, any>;
-        options?: object;
-        class?: string;
-        role?: string;
-        open?: boolean;
-        transition?: (node: HTMLElement, params: any) => import("svelte/transition").TransitionConfig;
-        params?: any;
-    } & {
-        activeContent?: boolean;
-        arrow?: boolean;
-        offset?: number;
-        placement?: import("@floating-ui/dom").Placement;
-        trigger?: "hover" | "click" | "focus";
-        triggeredBy?: string;
-        reference?: string;
-        strategy?: "absolute" | "fixed";
-        open?: boolean;
-        yOnly?: boolean;
-    } & {
+    props: {
+        [x: string]: any;
         activeUrl?: string;
+        open?: boolean;
         containerClass?: string;
-        classContainer?: string;
+        classContainer?: string | undefined;
         headerClass?: string;
-        classHeader?: string;
+        classHeader?: string | undefined;
         footerClass?: string;
-        classFooter?: string;
+        classFooter?: string | undefined;
         activeClass?: string;
-        classActive?: string;
+        classActive?: string | undefined;
+        arrow?: boolean;
+        trigger?: "hover" | "click" | "focus";
+        placement?: Placement;
+        color?: FrameColor;
+        shadow?: boolean;
+        rounded?: boolean;
     };
     events: {
         show: CustomEvent<any>;
@@ -66,6 +51,12 @@ export type DropdownSlots = typeof __propDef.slots;
  * @prop export let classFooter: string | undefined = undefined;
  * @prop export let activeClass: string = 'text-primary-700 dark:text-primary-700 hover:text-primary-900 dark:hover:text-primary-900';
  * @prop export let classActive: string | undefined = undefined;
+ * @prop export let arrow: boolean = false;
+ * @prop export let trigger: 'hover' | 'click' | 'focus' = 'click';
+ * @prop export let placement: Placement = 'bottom';
+ * @prop export let color: FrameColor = 'dropdown';
+ * @prop export let shadow: boolean = true;
+ * @prop export let rounded: boolean = true;
  */
 export default class Dropdown extends SvelteComponentTyped<DropdownProps, DropdownEvents, DropdownSlots> {
 }

package/dist/list-group/Listgroup.svelte.d.ts

@@ -3,7 +3,7 @@ import type { ListGroupItemType } from '../types';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/mega-menu/MegaMenu.svelte.d.ts

@@ -3,7 +3,7 @@ import type { LinkType } from '../types';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/modal/Modal.svelte.d.ts

@@ -4,7 +4,7 @@ import type { ModalPlacementType } from '../types';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/navbar/Navbar.svelte.d.ts

@@ -3,7 +3,7 @@ import NavContainer from './NavContainer.svelte';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/popover/Popover.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/toast/Toast.svelte

@@ -1,7 +1,6 @@
-<script>import TransitionFrame from "../utils/TransitionFrame.svelte";
+<script>import { fade } from "svelte/transition";
 import { twMerge } from "tailwind-merge";
-import CloseButton from "../utils/CloseButton.svelte";
-import Frame from "../utils/Frame.svelte";
+import { CloseButton } from "..";
 export let dismissable = true;
 export let color = "primary";
 export let position = "none";
@@ -9,6 +8,9 @@ export let divClass = "w-full max-w-xs p-4 text-gray-500 bg-white shadow dark:te
 export let defaultIconClass = "w-8 h-8";
 export let contentClass = "w-full text-sm font-normal";
 export let align = true;
+export let transition = fade;
+export let params = {};
+export let toastStatus = true;
 const positions = {
   "top-left": "absolute top-5 start-5",
   "top-right": "absolute top-5 end-5",
@@ -16,52 +18,77 @@ const positions = {
   "bottom-right": "absolute bottom-5 end-5",
   none: ""
 };
-let finalDivClass;
-$: finalDivClass = twMerge("flex", align ? "items-center" : "items-start", divClass, positions[position], $$props.class);
+let finalDivClass = twMerge(
+  "flex",
+  align ? "items-center" : "items-start",
+  divClass,
+  positions[position],
+  $$props.class
+);
 const colors = {
   primary: "text-primary-500 bg-primary-100 dark:bg-primary-800 dark:text-primary-200",
-  gray: "text-gray-500 bg-gray-100 dark:bg-gray-700 dark:text-gray-200",
+  dark: "text-gray-500 bg-gray-100 dark:bg-gray-700 dark:text-gray-200",
   red: "text-red-500 bg-red-100 dark:bg-red-800 dark:text-red-200",
   yellow: "text-yellow-500 bg-yellow-100 dark:bg-yellow-800 dark:text-yellow-200",
   green: "text-green-500 bg-green-100 dark:bg-green-800 dark:text-green-200",
   blue: "text-blue-500 bg-blue-100 dark:bg-blue-800 dark:text-blue-200",
   indigo: "text-indigo-500 bg-indigo-100 dark:bg-indigo-800 dark:text-indigo-200",
   purple: "text-purple-500 bg-purple-100 dark:bg-purple-800 dark:text-purple-200",
-  orange: "text-orange-500 bg-orange-100 dark:bg-orange-700 dark:text-orange-200",
+  pink: "text-pink-500 bg-pink-100 dark:bg-pink-700 dark:text-pink-200",
   none: ""
 };
-let iconClass;
-$: iconClass = twMerge("inline-flex items-center justify-center shrink-0", colors[color], defaultIconClass);
-const clsBtnExtraClass = "-mx-1.5 -my-1.5 text-gray-400 hover:text-gray-900 focus:!ring-gray-300 hover:bg-gray-100 dark:text-gray-500 dark:hover:text-white dark:hover:bg-gray-700";
+let iconClass = twMerge(
+  "inline-flex items-center justify-center shrink-0 rounded-lg",
+  colors[color],
+  defaultIconClass
+);
+const clsBtnExtraClass = "ms-auto -mx-1.5 -my-1.5 bg-white text-gray-400 hover:text-gray-900 rounded-lg focus:ring-2 focus:ring-gray-300 p-1.5 hover:bg-gray-100 inline-flex items-center justify-center h-8 w-8 dark:text-gray-500 dark:hover:text-white dark:bg-gray-800 dark:hover:bg-gray-700";
 </script>
 
-<TransitionFrame rounded color="none" role="alert" {...$$restProps} class={finalDivClass} let:close on:close>
-  {#if $$slots.icon}
-    <Frame rounded color="none" class={iconClass}>
-      <slot name="icon" />
-    </Frame>
-  {/if}
+{#if toastStatus}
+  <div
+    role="alert"
+    {...$$restProps}
+    class={finalDivClass}
+    transition:transition={params}
+  >
+    {#if $$slots.icon}
+      <div class={iconClass}>
+        <slot name="icon" />
+      </div>
+    {/if}
 
-  <div class={contentClass}>
-    <slot />
-  </div>
+    <div class={contentClass}>
+        <slot />
+    </div>
 
-  {#if dismissable}
-    <slot name="close-button" {close}>
-      <CloseButton class={clsBtnExtraClass} on:click={close} />
-    </slot>
-  {/if}
-</TransitionFrame>
+    {#if dismissable}
+      <CloseButton
+        divclass={clsBtnExtraClass}
+        ariaLabel="Remove toast"
+        {color}
+        on:click={() => {
+          toastStatus = false;
+        }}
+      />
+    {/if}
+  </div>
+{/if}
 
 <!--
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
 @prop export let dismissable: boolean = true;
-@prop export let color: 'primary' | 'gray' | 'red' | 'yellow' | 'green' | 'blue' | 'indigo' | 'purple' | 'orange' | 'none' = 'primary';
-@prop export let position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'none' = 'none';
+@prop export let color: ColorVariant = 'primary';
+@prop export let position: ToastPositionType = 'none';
 @prop export let divClass: string = 'w-full max-w-xs p-4 text-gray-500 bg-white shadow dark:text-gray-400 dark:bg-gray-800 gap-3';
 @prop export let defaultIconClass: string = 'w-8 h-8';
 @prop export let contentClass: string = 'w-full text-sm font-normal';
+@prop export let div2class: string = '';
+@prop export let div3class: string = '';
 @prop export let align: boolean = true;
+@prop export let transition: TransitionFunc = fade;
+@prop export let params = {};
+@prop export let toastStatus: boolean = true;
 -->

package/dist/toast/Toast.svelte.d.ts

@@ -1,38 +1,26 @@
 import { SvelteComponentTyped } from "svelte";
+import { type TransitionConfig } from 'svelte/transition';
+import type { ColorVariant, ToastPositionType } from '../types';
 declare const __propDef: {
-    props: import("svelte/elements").HTMLAnchorAttributes & {
-        tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
-        rounded?: boolean;
-        border?: boolean;
-        shadow?: boolean;
-        node?: HTMLElement | undefined;
-        use?: import("svelte/action").Action<HTMLElement, any>;
-        options?: object;
-        class?: string;
-        role?: string;
-        open?: boolean;
-        transition?: (node: HTMLElement, params: any) => import("svelte/transition").TransitionConfig;
-        params?: any;
-    } & import("..").Dismissable & {
-        color?: "primary" | "gray" | "red" | "yellow" | "green" | "blue" | "indigo" | "purple" | "orange" | "none";
-        position?: "top-left" | "top-right" | "bottom-left" | "bottom-right" | "none";
+    props: {
+        [x: string]: any;
+        dismissable?: boolean;
+        color?: ColorVariant;
+        position?: ToastPositionType;
         divClass?: string;
         defaultIconClass?: string;
-        extraIconClass?: string;
         contentClass?: string;
+        align?: boolean;
+        transition?: (node: HTMLElement, params: any) => TransitionConfig;
+        params?: {};
+        toastStatus?: boolean;
     };
     events: {
-        close: CustomEvent<any>;
-    } & {
         [evt: string]: CustomEvent<any>;
     };
     slots: {
         icon: {};
         default: {};
-        'close-button': {
-            close: (ev: MouseEvent | undefined) => void;
-        };
     };
 };
 export type ToastProps = typeof __propDef.props;
@@ -42,12 +30,17 @@ export type ToastSlots = typeof __propDef.slots;
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
  * @prop export let dismissable: boolean = true;
- * @prop export let color: 'primary' | 'gray' | 'red' | 'yellow' | 'green' | 'blue' | 'indigo' | 'purple' | 'orange' | 'none' = 'primary';
- * @prop export let position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'none' = 'none';
+ * @prop export let color: ColorVariant = 'primary';
+ * @prop export let position: ToastPositionType = 'none';
  * @prop export let divClass: string = 'w-full max-w-xs p-4 text-gray-500 bg-white shadow dark:text-gray-400 dark:bg-gray-800 gap-3';
  * @prop export let defaultIconClass: string = 'w-8 h-8';
  * @prop export let contentClass: string = 'w-full text-sm font-normal';
+ * @prop export let div2class: string = '';
+ * @prop export let div3class: string = '';
  * @prop export let align: boolean = true;
+ * @prop export let transition: TransitionFunc = fade;
+ * @prop export let params = {};
+ * @prop export let toastStatus: boolean = true;
  */
 export default class Toast extends SvelteComponentTyped<ToastProps, ToastEvents, ToastSlots> {
 }

package/dist/toolbar/Toolbar.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/tooltip/Tooltip.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("../utils/Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/types.d.ts

@@ -117,3 +117,4 @@ export interface ButtonClassesTypes {
     video?: string;
     custom?: string;
 }
+export type ToastPositionType = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'none';

package/dist/utils/Frame.svelte

@@ -1,3 +1,25 @@
+<script context="module">const bgColors = {
+  gray: "bg-gray-50 dark:bg-gray-800",
+  red: "bg-red-50 dark:bg-gray-800",
+  yellow: "bg-yellow-50 dark:bg-gray-800 ",
+  green: "bg-green-50 dark:bg-gray-800 ",
+  indigo: "bg-indigo-50 dark:bg-gray-800 ",
+  purple: "bg-purple-50 dark:bg-gray-800 ",
+  pink: "bg-pink-50 dark:bg-gray-800 ",
+  blue: "bg-blue-50 dark:bg-gray-800 ",
+  light: "bg-gray-50 dark:bg-gray-700",
+  dark: "bg-gray-50 dark:bg-gray-800",
+  default: "bg-white dark:bg-gray-800",
+  dropdown: "bg-white dark:bg-gray-700",
+  navbar: "bg-white dark:bg-gray-900",
+  navbarUl: "bg-gray-50 dark:bg-gray-800",
+  form: "bg-gray-50 dark:bg-gray-700",
+  primary: "bg-primary-50 dark:bg-gray-800 ",
+  orange: "bg-orange-50 dark:bg-orange-800",
+  none: ""
+};
+</script>
+
 <script>import { createEventDispatcher, setContext } from "svelte";
 import { twMerge } from "tailwind-merge";
 import {} from "svelte/transition";
@@ -21,26 +43,6 @@ $: dispatch(open ? "open" : "close");
 $: dispatch("show", open);
 $: color = color ?? "default";
 $: setContext("color", color);
-const bgColors = {
-  gray: "bg-gray-50 dark:bg-gray-800",
-  red: "bg-red-50 dark:bg-gray-800",
-  yellow: "bg-yellow-50 dark:bg-gray-800 ",
-  green: "bg-green-50 dark:bg-gray-800 ",
-  indigo: "bg-indigo-50 dark:bg-gray-800 ",
-  purple: "bg-purple-50 dark:bg-gray-800 ",
-  pink: "bg-pink-50 dark:bg-gray-800 ",
-  blue: "bg-blue-50 dark:bg-gray-800 ",
-  light: "bg-gray-50 dark:bg-gray-700",
-  dark: "bg-gray-50 dark:bg-gray-800",
-  default: "bg-white dark:bg-gray-800",
-  dropdown: "bg-white dark:bg-gray-700",
-  navbar: "bg-white dark:bg-gray-900",
-  navbarUl: "bg-gray-50 dark:bg-gray-800",
-  form: "bg-gray-50 dark:bg-gray-700",
-  primary: "bg-primary-50 dark:bg-gray-800 ",
-  orange: "bg-orange-50 dark:bg-orange-800",
-  none: ""
-};
 const textColors = {
   gray: "text-gray-800 dark:text-gray-300",
   red: "text-red-800 dark:text-red-400",

package/dist/utils/Frame.svelte.d.ts

@@ -1,11 +1,32 @@
 import { SvelteComponentTyped } from "svelte";
+export type FrameColor = keyof typeof bgColors;
+declare const bgColors: {
+    gray: string;
+    red: string;
+    yellow: string;
+    green: string;
+    indigo: string;
+    purple: string;
+    pink: string;
+    blue: string;
+    light: string;
+    dark: string;
+    default: string;
+    dropdown: string;
+    navbar: string;
+    navbarUl: string;
+    form: string;
+    primary: string;
+    orange: string;
+    none: string;
+};
 import type { Action } from 'svelte/action';
 import type { HTMLAnchorAttributes } from 'svelte/elements';
 import { type TransitionConfig } from 'svelte/transition';
 declare const __propDef: {
     props: HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/utils/Popper.svelte.d.ts

@@ -3,7 +3,7 @@ import type { Placement } from '@floating-ui/dom';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("./Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/dist/utils/TransitionFrame.svelte.d.ts

@@ -4,7 +4,7 @@ import { type TransitionConfig } from 'svelte/transition';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none";
+        color?: import("./Frame.svelte").FrameColor;
         rounded?: boolean;
         border?: boolean;
         shadow?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flowbite-svelte",
-  "version": "0.46.10",
+  "version": "0.46.12",
   "description": "Flowbite components for Svelte",
   "main": "dist/index.js",
   "author": {
@@ -28,7 +28,7 @@
     "eslint": "^9.5.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-svelte": "^2.41.0",
-    "flowbite-svelte": "^0.46.10",
+    "flowbite-svelte": "^0.46.12",
     "flowbite-svelte-blocks": "^1.1.3",
     "flowbite-svelte-icons": "^1.6.1",
     "mdsvex": "^0.11.2",
@@ -39,7 +39,7 @@
     "prism-themes": "^1.9.0",
     "publint": "^0.2.8",
     "svelte": "^4.2.18",
-    "svelte-check": "^3.8.3",
+    "svelte-check": "^3.8.4",
     "svelte-lib-helpers": "^0.4.6",
     "svelte-meta-tags": "^3.1.2",
     "svelte-preprocess": "^6.0.1",