flowbite-svelte 1.10.5 → 1.10.7

package/dist/timeline/TimelineItem.svelte

@@ -2,7 +2,7 @@
   import { getContext } from "svelte";
   import { timelineItem, type TimelineItemTheme } from ".";
   import type { TimelineItemProps, TimelineVariants, DateFormat } from "../types";
-  import { cn } from "..";
+  import clsx from "clsx";
   import { getTheme } from "../theme/themeUtils";
 
   let { children, orientationSlot, title, date, dateFormat = "month-year", svgClass, liClass, divClass, timeClass, h3Class, ...restProps }: TimelineItemProps = $props();
@@ -42,31 +42,31 @@
   }
 </script>
 
-<li {...restProps} class={cn(li({ class: liClass }), (theme as TimelineItemTheme)?.li)}>
+<li {...restProps} class={li({ class: clsx((theme as TimelineItemTheme)?.li, liClass) })}>
   {#if order !== "default"}
     {#if orientationSlot && (order === "vertical" || order === "horizontal")}
       {@render orientationSlot()}
     {:else}
-      <div class={cn(div({ class: divClass }), (theme as TimelineItemTheme)?.div)}>
-        <svg aria-hidden="true" class={cn(svg({ class: svgClass }), (theme as TimelineItemTheme)?.svg)} fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+      <div class={div({ class: clsx((theme as TimelineItemTheme)?.div, divClass) })}>
+        <svg aria-hidden="true" class={svg({ class: clsx((theme as TimelineItemTheme)?.svg, svgClass) })} fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
           <path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd" />
         </svg>
       </div>
     {/if}
   {:else if date}
-    <time datetime={date} class={cn(time({ class: timeClass }), (theme as TimelineItemTheme)?.time)}>
+    <time datetime={date} class={time({ class: clsx((theme as TimelineItemTheme)?.time, timeClass) })}>
       {formatDisplayDate(date, dateFormat)}
     </time>
   {/if}
   {#if title}
-    <h3 class={cn(h3({ class: h3Class }), (theme as TimelineItemTheme)?.h3)}>
+    <h3 class={h3({ class: clsx((theme as TimelineItemTheme)?.h3, h3Class) })}>
       {title}
     </h3>
   {/if}
 
   {#if order !== "default"}
     {#if date}
-      <time datetime={date} class={cn(time({ class: timeClass }), (theme as TimelineItemTheme)?.time)}>
+      <time datetime={date} class={time({ class: clsx((theme as TimelineItemTheme)?.time, timeClass) })}>
         {formatDisplayDate(date, dateFormat)}
       </time>
     {/if}
@@ -79,7 +79,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[TimelineItemProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1808)
+[TimelineItemProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1794)
 ## Props
 @prop children
 @prop orientationSlot

package/dist/timeline/TimelineItem.svelte.d.ts

@@ -2,7 +2,7 @@ import type { TimelineItemProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [TimelineItemProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1808)
+ * [TimelineItemProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1794)
  * ## Props
  * @prop children
  * @prop orientationSlot

package/dist/timeline/theme.d.ts

@@ -1,17 +1,18 @@
 import { type VariantProps } from "tailwind-variants";
+import type { ClassValue } from "svelte/elements";
 export declare const activity: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "relative border-s border-gray-200 dark:border-gray-700", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "relative border-s border-gray-200 dark:border-gray-700", unknown, unknown, undefined>>;
-export type ActivityTheme = string;
+export type ActivityTheme = ClassValue;
 export declare const activityItem: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             title?: import("tailwind-variants").ClassValue;
             img?: import("tailwind-variants").ClassValue;
             span?: import("tailwind-variants").ClassValue;
-            innerDiv?: import("tailwind-variants").ClassValue;
-            outerDiv?: import("tailwind-variants").ClassValue;
-            li?: import("tailwind-variants").ClassValue;
             text?: import("tailwind-variants").ClassValue;
             time?: import("tailwind-variants").ClassValue;
+            innerDiv?: import("tailwind-variants").ClassValue;
+            li?: import("tailwind-variants").ClassValue;
+            outerDiv?: import("tailwind-variants").ClassValue;
         };
     };
 } | {
@@ -20,11 +21,11 @@ export declare const activityItem: import("tailwind-variants").TVReturnType<{
             title?: import("tailwind-variants").ClassValue;
             img?: import("tailwind-variants").ClassValue;
             span?: import("tailwind-variants").ClassValue;
-            innerDiv?: import("tailwind-variants").ClassValue;
-            outerDiv?: import("tailwind-variants").ClassValue;
-            li?: import("tailwind-variants").ClassValue;
             text?: import("tailwind-variants").ClassValue;
             time?: import("tailwind-variants").ClassValue;
+            innerDiv?: import("tailwind-variants").ClassValue;
+            li?: import("tailwind-variants").ClassValue;
+            outerDiv?: import("tailwind-variants").ClassValue;
         };
     };
 } | {}, {
@@ -42,11 +43,11 @@ export declare const activityItem: import("tailwind-variants").TVReturnType<{
             title?: import("tailwind-variants").ClassValue;
             img?: import("tailwind-variants").ClassValue;
             span?: import("tailwind-variants").ClassValue;
-            innerDiv?: import("tailwind-variants").ClassValue;
-            outerDiv?: import("tailwind-variants").ClassValue;
-            li?: import("tailwind-variants").ClassValue;
             text?: import("tailwind-variants").ClassValue;
             time?: import("tailwind-variants").ClassValue;
+            innerDiv?: import("tailwind-variants").ClassValue;
+            li?: import("tailwind-variants").ClassValue;
+            outerDiv?: import("tailwind-variants").ClassValue;
         };
     };
 } | {}, {
@@ -69,21 +70,21 @@ export declare const activityItem: import("tailwind-variants").TVReturnType<{
     text: string;
 }, undefined, unknown, unknown, undefined>>;
 export type ActivityItemSlots = keyof typeof activityItem.slots;
-export type ActivityItemTheme = Partial<Record<ActivityItemSlots, string>>;
+export type ActivityItemTheme = Partial<Record<ActivityItemSlots, ClassValue>>;
 export declare const group: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             div?: import("tailwind-variants").ClassValue;
-            ol?: import("tailwind-variants").ClassValue;
             time?: import("tailwind-variants").ClassValue;
+            ol?: import("tailwind-variants").ClassValue;
         };
     };
 } | {
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
             div?: import("tailwind-variants").ClassValue;
-            ol?: import("tailwind-variants").ClassValue;
             time?: import("tailwind-variants").ClassValue;
+            ol?: import("tailwind-variants").ClassValue;
         };
     };
 } | {}, {
@@ -94,8 +95,8 @@ export declare const group: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             div?: import("tailwind-variants").ClassValue;
-            ol?: import("tailwind-variants").ClassValue;
             time?: import("tailwind-variants").ClassValue;
+            ol?: import("tailwind-variants").ClassValue;
         };
     };
 } | {}, {
@@ -108,7 +109,7 @@ export declare const group: import("tailwind-variants").TVReturnType<{
     ol: string;
 }, undefined, unknown, unknown, undefined>>;
 export type GroupSlots = keyof typeof group.slots;
-export type GroupTheme = Partial<Record<GroupSlots, string>>;
+export type GroupTheme = Partial<Record<GroupSlots, ClassValue>>;
 export declare const groupItem: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
@@ -159,7 +160,7 @@ export declare const groupItem: import("tailwind-variants").TVReturnType<{
     span: string;
 }, undefined, unknown, unknown, undefined>>;
 export type GroupItemSlots = keyof typeof groupItem.slots;
-export type GroupItemTheme = Partial<Record<GroupItemSlots, string>>;
+export type GroupItemTheme = Partial<Record<GroupItemSlots, ClassValue>>;
 export type TimelineVariants = VariantProps<typeof timeline>;
 export declare const timeline: import("tailwind-variants").TVReturnType<{
     order: {
@@ -186,7 +187,7 @@ export declare const timeline: import("tailwind-variants").TVReturnType<{
         default: string;
     };
 }, undefined, undefined, unknown, unknown, undefined>>;
-export type TimelineTheme = string;
+export type TimelineTheme = ClassValue;
 export declare const timelineItem: import("tailwind-variants").TVReturnType<{
     order: {
         default: {
@@ -306,4 +307,4 @@ export declare const timelineItem: import("tailwind-variants").TVReturnType<{
     svg: string;
 }, undefined, unknown, unknown, undefined>>;
 export type TimelineItemSlots = keyof typeof timelineItem.slots;
-export type TimelineItemTheme = Partial<Record<TimelineItemSlots, string>>;
+export type TimelineItemTheme = Partial<Record<TimelineItemSlots, ClassValue>>;

package/dist/toast/Toast.svelte

@@ -4,7 +4,7 @@
   import { toast, type ToastTheme } from ".";
   import type { ToastProps } from "../types";
   import { fly } from "svelte/transition";
-  import { cn } from "..";
+  import clsx from "clsx";
   import { getTheme } from "../theme/themeUtils";
 
   let { children, icon, toastStatus = $bindable(true), dismissable = true, color = "primary", position, iconClass, contentClass, align = true, params, transition = fly, class: className, onclose, ...restProps }: ToastProps = $props();
@@ -20,19 +20,19 @@
 </script>
 
 {#if toastStatus}
-  <div role="alert" transition:transition={params as ParamsType} {...restProps} class={cn(base({ class: className }), (theme as ToastTheme)?.base)}>
+  <div role="alert" transition:transition={params as ParamsType} {...restProps} class={base({ class: clsx((theme as ToastTheme)?.base, className) })}>
     {#if icon}
-      <div class={cn(iconVariants({ class: iconClass }), (theme as ToastTheme)?.icon)}>
+      <div class={iconVariants({ class: clsx((theme as ToastTheme)?.icon, iconClass) })}>
         {@render icon()}
       </div>
     {/if}
 
-    <div class={cn(content({ class: contentClass }), (theme as ToastTheme)?.content)}>
+    <div class={content({ class: clsx((theme as ToastTheme)?.content, contentClass) })}>
       {@render children()}
     </div>
 
     {#if dismissable}
-      <CloseButton class={cn(close(), (theme as ToastTheme)?.close)} ariaLabel="Remove toast" {color} onclick={handleClose} />
+      <CloseButton class={close({ class: clsx((theme as ToastTheme)?.close) })} ariaLabel="Remove toast" {color} onclick={handleClose} />
     {/if}
   </div>
 {/if}
@@ -41,7 +41,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1822)
+[ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1808)
 ## Props
 @prop children
 @prop icon

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

@@ -2,7 +2,7 @@ import type { ToastProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1822)
+ * [ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1808)
  * ## Props
  * @prop children
  * @prop icon

package/dist/toast/theme.d.ts

@@ -1,4 +1,5 @@
 import { type VariantProps } from "tailwind-variants";
+import type { ClassValue } from "svelte/elements";
 export type ToastVaraints = VariantProps<typeof toast>;
 export declare const toast: import("tailwind-variants").TVReturnType<{
     position: {
@@ -320,4 +321,4 @@ export declare const toast: import("tailwind-variants").TVReturnType<{
     close: string;
 }, undefined, unknown, unknown, undefined>>;
 export type ToastSlots = keyof typeof toast.slots;
-export type ToastTheme = Partial<Record<ToastSlots, string>>;
+export type ToastTheme = Partial<Record<ToastSlots, ClassValue>>;

package/dist/toolbar/Toolbar.svelte

@@ -4,7 +4,6 @@
   import { toolbar, type ToolbarTheme } from "./";
   import type { ToolbarProps } from "../types";
   import clsx from "clsx";
-  import { cn } from "..";
   import { getTheme } from "../theme/themeUtils";
 
   let { children, end, color, embedded, class: className, ...restProps }: ToolbarProps = $props();
@@ -29,8 +28,8 @@
   // let divClass: string = twMerge('flex justify-between items-center', !embedded && 'py-2 px-3', className);
 </script>
 
-<div {...restProps} class={cn(base({ class: clsx(className) }), (theme as ToolbarTheme)?.base)}>
-  <div class={cn(content(), (theme as ToolbarTheme)?.content)}>
+<div {...restProps} class={base({ class: clsx((theme as ToolbarTheme)?.base, className) })}>
+  <div class={content({ class: clsx((theme as ToolbarTheme)?.content) })}>
     {@render children?.()}
   </div>
   {#if end}
@@ -42,7 +41,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1132)
+[ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1118)
 ## Props
 @prop children
 @prop end

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

@@ -2,7 +2,7 @@ import type { ToolbarProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1132)
+ * [ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1118)
  * ## Props
  * @prop children
  * @prop end

package/dist/toolbar/ToolbarButton.svelte

@@ -3,7 +3,6 @@
   import { toolbarButton } from ".";
   import type { ToolbarButtonProps } from "../types";
   import clsx from "clsx";
-  import { cn } from "..";
   import { getTheme } from "../theme/themeUtils";
 
   const background = getContext("background");
@@ -11,23 +10,23 @@
 
   const theme = getTheme("toolbarButton");
 
-  const buttonClass = $derived(
+  const buttonCls = $derived(
     toolbarButton({
       color,
       size,
       background: !!background,
-      class: clsx(className)
+      class: clsx(theme, className)
     })
   );
 </script>
 
 {#if restProps.href === undefined}
-  <button type="button" {...restProps} class={cn(buttonClass, theme)} aria-label={ariaLabel ?? name}>
+  <button type="button" {...restProps} class={buttonCls} aria-label={ariaLabel ?? name}>
     {#if name}<span class="sr-only">{name}</span>{/if}
     {@render children?.()}
   </button>
 {:else}
-  <a {...restProps} class={buttonClass} aria-label={ariaLabel ?? name}>
+  <a {...restProps} class={buttonCls} aria-label={ariaLabel ?? name}>
     {#if name}<span class="sr-only">{name}</span>{/if}
     {@render children?.()}
   </a>
@@ -37,7 +36,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1138)
+[ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1124)
 ## Props
 @prop children
 @prop color

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

@@ -2,7 +2,7 @@ import type { ToolbarButtonProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1138)
+ * [ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1124)
  * ## Props
  * @prop children
  * @prop color

package/dist/toolbar/ToolbarGroup.svelte

@@ -4,20 +4,19 @@
   import { toolbarGroup } from ".";
   import type { ToolbarGroupProps } from "../types";
   import clsx from "clsx";
-  import { cn } from "..";
   import { getTheme } from "../theme/themeUtils";
 
   let { children, spacing, padding, position = "middle", class: className, ...restProps }: ToolbarGroupProps = $props();
 
   const theme = getTheme("toolbarGroup");
 
-  const groupClass = $derived(toolbarGroup({ spacing, padding, position, class: clsx(className) }));
+  const groupCls = $derived(toolbarGroup({ spacing, padding, position, class: clsx(theme, className) }));
 
   const options: Writable<boolean> = getContext("toolbar");
   if (options) $options = true;
 </script>
 
-<div {...restProps} class={cn(groupClass, theme)}>
+<div {...restProps} class={groupCls}>
   {@render children?.()}
 </div>
 
@@ -25,7 +24,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1136)
+[ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1122)
 ## Props
 @prop children
 @prop spacing

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

@@ -2,7 +2,7 @@ import type { ToolbarGroupProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1136)
+ * [ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1122)
  * ## Props
  * @prop children
  * @prop spacing

package/dist/toolbar/theme.d.ts

@@ -1,4 +1,5 @@
 import { type VariantProps } from "tailwind-variants";
+import type { ClassValue } from "svelte/elements";
 export type ToolbarVariants = VariantProps<typeof toolbar>;
 export declare const toolbar: import("tailwind-variants").TVReturnType<{
     embedded: {
@@ -197,7 +198,7 @@ export declare const toolbar: import("tailwind-variants").TVReturnType<{
     content: string;
 }, undefined, unknown, unknown, undefined>>;
 export type ToolbarSlots = keyof typeof toolbar.slots;
-export type ToolbarTheme = Partial<Record<ToolbarSlots, string>>;
+export type ToolbarTheme = Partial<Record<ToolbarSlots, ClassValue>>;
 export type ToolbarGroupVariants = VariantProps<typeof toolbarGroup>;
 export declare const toolbarGroup: import("tailwind-variants").TVReturnType<{
     spacing: {
@@ -245,7 +246,7 @@ export declare const toolbarGroup: import("tailwind-variants").TVReturnType<{
         last: string;
     };
 }, undefined, "flex items-center", unknown, unknown, undefined>>;
-export type ToolbarGroupTheme = string;
+export type ToolbarGroupTheme = ClassValue;
 export type ToolbarButtonVariants = VariantProps<typeof toolbarButton>;
 export declare const toolbarButton: import("tailwind-variants").TVReturnType<{
     color: {
@@ -320,4 +321,4 @@ export declare const toolbarButton: import("tailwind-variants").TVReturnType<{
         false: string;
     };
 }, undefined, "focus:outline-hidden whitespace-normal", unknown, unknown, undefined>>;
-export type ToolbarButtonTheme = string;
+export type ToolbarButtonTheme = ClassValue;

package/dist/tooltip/Tooltip.svelte

@@ -3,7 +3,6 @@
   import Popper from "../utils/Popper.svelte";
   import { tooltip, type TooltipTheme } from "./theme";
   import type { TooltipProps, TriggeredToggleEvent } from "..";
-  import { cn } from "..";
   import { getTheme } from "../theme/themeUtils";
 
   let { type = "dark", color = undefined, trigger = "hover", arrow = true, children, placement = "top", onbeforetoggle: _onbeforetoggle, class: className, isOpen = $bindable(false), ...restProps }: TooltipProps = $props();
@@ -22,7 +21,7 @@
   }
 </script>
 
-<Popper {...restProps} bind:isOpen {placement} {trigger} {arrow} class={cn(base({ class: clsx(className) }), (theme as TooltipTheme)?.base)} {onbeforetoggle}>
+<Popper {...restProps} bind:isOpen {placement} {trigger} {arrow} class={base({ class: clsx((theme as TooltipTheme)?.base, className) })} {onbeforetoggle}>
   <div class="pointer-events-none">{@render children()}</div>
 </Popper>
 
@@ -30,7 +29,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1839)
+[TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1825)
 ## Props
 @prop type = "dark"
 @prop color = undefined

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

@@ -2,7 +2,7 @@ import type { TooltipProps } from "..";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1839)
+ * [TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1825)
  * ## Props
  * @prop type = "dark"
  * @prop color = undefined

package/dist/tooltip/theme.d.ts

@@ -1,4 +1,5 @@
 import { type VariantProps } from "tailwind-variants";
+import type { ClassValue } from "svelte/elements";
 export type TooltipVariants = VariantProps<typeof tooltip>;
 export declare const tooltip: import("tailwind-variants").TVReturnType<{
     type: {
@@ -233,4 +234,4 @@ export declare const tooltip: import("tailwind-variants").TVReturnType<{
     arrowBase: string;
 }, undefined, unknown, unknown, undefined>>;
 export type TooltipSlots = keyof typeof tooltip.slots;
-export type TooltipTheme = Partial<Record<TooltipSlots, string>>;
+export type TooltipTheme = Partial<Record<TooltipSlots, ClassValue>>;

package/dist/types.d.ts

@@ -1,8 +1,7 @@
 import type { fade, fly, scale, slide } from "svelte/transition";
 import type { Coords, Middleware, Placement, Strategy } from "@floating-ui/dom";
-import type { ClassValue } from "clsx";
 import type { Component, Snippet } from "svelte";
-import type { HTMLAnchorAttributes, HTMLAttributes, HTMLBlockquoteAttributes, HTMLButtonAttributes, HTMLDialogAttributes, HTMLImgAttributes, HTMLInputAttributes, HTMLLabelAttributes, HTMLLiAttributes, HTMLOlAttributes, HTMLSelectAttributes, HTMLSourceAttributes, HTMLTableAttributes, HTMLTdAttributes, HTMLTextareaAttributes, HTMLThAttributes, HTMLTrackAttributes, HTMLVideoAttributes, SVGAttributes, FullAutoFill } from "svelte/elements";
+import type { ClassValue, HTMLAnchorAttributes, HTMLAttributes, HTMLBlockquoteAttributes, HTMLButtonAttributes, HTMLDialogAttributes, HTMLImgAttributes, HTMLInputAttributes, HTMLLabelAttributes, HTMLLiAttributes, HTMLOlAttributes, HTMLSelectAttributes, HTMLSourceAttributes, HTMLTableAttributes, HTMLTdAttributes, HTMLTextareaAttributes, HTMLThAttributes, HTMLTrackAttributes, HTMLVideoAttributes, SVGAttributes, FullAutoFill } from "svelte/elements";
 import { type Writable } from "svelte/store";
 import type { BlurParams, EasingFunction, FadeParams, FlyParams, ScaleParams, SlideParams, TransitionConfig } from "svelte/transition";
 import { type VariantProps } from "tailwind-variants";
@@ -58,6 +57,9 @@ import type { ListVariants } from "./typography/list/theme";
 import type { ParagraphVariants } from "./typography/paragraph/theme";
 import type { SpanVariants } from "./typography/span/theme";
 import type { ClipboardVariants } from "./clipboard/theme";
+import type { AccordionItemVariants, AccordionVariants } from "./accordion/theme";
+import type { AvatarVariants } from "./avatar/theme";
+import type { BottomNavHeaderItemVariants, BottomNavHeaderVariants, BottomNavItemVariants, BottomNavVariants } from "./bottom-navigation/theme";
 export declare const xs = "xs";
 export declare const sm = "sm";
 export declare const md = "md";
@@ -136,23 +138,18 @@ export interface AccordionCtxType {
     classInactive?: string;
     multiple?: boolean;
 }
-export interface AccordionProps extends HTMLAttributes<HTMLDivElement> {
+export interface AccordionProps extends AccordionVariants, Omit<HTMLAttributes<HTMLDivElement>, "color"> {
     children: Snippet;
-    flush?: boolean;
     multiple?: boolean;
     activeClass?: string;
     inactiveClass?: string;
-    defaultClass?: string;
-    classActive?: string;
-    classInactive?: string;
     transitionType?: TransitionFunc | "none";
 }
-export interface AccordionItemProps extends HTMLAttributes<HTMLDivElement> {
+export interface AccordionItemProps extends AccordionItemVariants, HTMLAttributes<HTMLDivElement> {
     children: Snippet;
     header?: Snippet;
     arrowup?: Snippet;
     arrowdown?: Snippet;
-    open?: boolean;
     activeClass?: string;
     inactiveClass?: string;
     transitionType?: TransitionFunc | "none";
@@ -169,19 +166,15 @@ export interface AlertProps extends Omit<AlertVariants, "icon">, Omit<HTMLAttrib
     params?: ParamsType;
     onclick?: () => void;
 }
-export interface AvatarProps extends HTMLAttributes<HTMLDivElement> {
+export interface AvatarProps extends AvatarVariants, HTMLAttributes<HTMLDivElement> {
     children?: Snippet;
     indicator?: Snippet;
     href?: HTMLAnchorAttributes["href"];
     target?: HTMLAnchorAttributes["target"];
     src?: string;
-    cornerStyle?: "rounded" | "circular";
-    stacked?: boolean;
     dot?: object;
     alt?: string;
-    size?: "xs" | "sm" | "md" | "lg" | "xl";
     onclick?: () => void;
-    border?: boolean;
 }
 export interface BadgeProps extends BadgeVariants, Omit<HTMLAttributes<HTMLDivElement>, "color"> {
     children: Snippet;
@@ -196,63 +189,42 @@ export interface BadgeProps extends BadgeVariants, Omit<HTMLAttributes<HTMLDivEl
     onclose?: (ev: Event) => void;
     aClass?: ClassValue;
 }
-export interface BannerProps extends BannerVariants, HTMLAttributes<HTMLDivElement> {
+export interface BannerProps extends BannerVariants, Omit<HTMLAttributes<HTMLDivElement>, "color"> {
     header?: Snippet;
     open?: boolean;
     dismissable?: boolean;
-    color?: BannerVariants["color"];
     innerClass?: ClassValue;
     transition?: TransitionFunc;
     params?: object;
     closeClass?: ClassValue;
 }
-export type BottomNavVariantType = "border" | "application" | "group" | "default" | "pagination" | "card" | "meeting" | "video" | undefined;
-export type PositionType = "static" | "fixed" | "absolute" | "relative" | "sticky" | undefined;
 export type BottomNavContextType = {
     activeClass?: string | null;
+    activeUrl?: string;
+    navType?: BottomNavVariants["navType"];
 };
-export type AppBtnPositionType = "middle" | "left" | "right" | undefined;
-export interface BottomNavProps extends HTMLAttributes<HTMLDivElement> {
+export interface BottomNavProps extends BottomNavVariants, HTMLAttributes<HTMLDivElement> {
     children: Snippet;
     header?: Snippet;
     activeUrl?: string;
-    position?: PositionType;
-    navType?: BottomNavVariantType;
     outerClass?: ClassValue;
     innerClass?: ClassValue;
     activeClass?: ClassValue;
 }
-export interface BottomNavItemProps {
+export type BottomNavItemProps = BottomNavItemVariants & AnchorButtonAttributes & {
     children: Snippet;
     btnName?: string;
-    appBtnPosition?: AppBtnPositionType;
     activeClass?: ClassValue;
     btnClass?: ClassValue;
     spanClass?: ClassValue;
     active?: boolean;
-    id?: string;
-    style?: string;
-    tabindex?: number;
-    title?: string;
-    role?: string;
-    "aria-label"?: string;
-    "data-testid"?: string;
-    href?: string;
-    target?: string;
-    rel?: string;
-    download?: string | boolean;
-    type?: "button" | "submit" | "reset";
-    disabled?: boolean;
-    name?: string;
-    value?: string | number | string[];
-    [key: string]: any;
-}
-export interface BottomNavHeaderProps {
+};
+export interface BottomNavHeaderProps extends BottomNavHeaderVariants, HTMLAttributes<HTMLDivElement> {
     children: Snippet;
     outerClass?: ClassValue;
     innerClass?: ClassValue;
 }
-export interface BottomNavHeaderItemProps extends HTMLButtonAttributes {
+export interface BottomNavHeaderItemProps extends BottomNavHeaderItemVariants, HTMLButtonAttributes {
     itemName: string;
     active?: boolean;
 }
@@ -604,6 +576,9 @@ export interface CheckboxButtonProps extends Omit<HTMLInputAttributes, "size"> {
 export interface DropzoneProps extends HTMLInputAttributes {
     children: Snippet;
     files?: FileList | null;
+    onDrop?: HTMLLabelAttributes["ondrop"];
+    onDragOver?: HTMLLabelAttributes["ondragover"];
+    onChange?: HTMLInputAttributes["onchange"];
 }
 export interface FileuploadProps extends Omit<HTMLInputAttributes, "size"> {
     files?: FileList | null;
@@ -1505,7 +1480,7 @@ export interface TabCtxType {
     panelId: string;
 }
 export interface ThemeConfig {
-    [key: string]: string | ThemeConfig;
+    [key: string]: ClassValue | ThemeConfig;
 }
 export type TimelineVariants = VariantProps<typeof timeline>;
 export interface ActivityType {

package/dist/types.js

@@ -1,4 +1,3 @@
 import {} from "svelte/store";
 import { tv } from "tailwind-variants";
-// import { baseThemes } from "./theme";
 import { timeline } from "./timeline/theme";