flowbite-svelte 1.9.0 → 1.10.0

package/dist/datepicker/theme.d.ts

@@ -388,3 +388,5 @@ export declare const datepicker: import("tailwind-variants").TVReturnType<{
     dayButton: string;
     monthButton: string;
 }, undefined, unknown, unknown, undefined>>;
+export type DatepickerSlots = keyof typeof datepicker.slots;
+export type DatepickerTheme = Partial<Record<DatepickerSlots, string>>;

package/dist/device-mockups/Android.svelte

@@ -24,7 +24,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L533)
+[AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L526)
 ## Props
 @prop children
 @prop divClass

package/dist/device-mockups/Android.svelte.d.ts

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

package/dist/device-mockups/DefaultMockup.svelte

@@ -23,7 +23,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L544)
+[DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L537)
 ## Props
 @prop children
 @prop divClass

package/dist/device-mockups/DefaultMockup.svelte.d.ts

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

package/dist/device-mockups/Desktop.svelte

@@ -21,7 +21,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[MockupBaseProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L525)
+[MockupBaseProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L518)
 ## Props
 @prop children
 @prop divClass

package/dist/device-mockups/Desktop.svelte.d.ts

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

package/dist/device-mockups/DeviceMockup.svelte

@@ -32,7 +32,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DeviceMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L520)
+[DeviceMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L513)
 ## Props
 @prop children
 @prop device = "default"

package/dist/device-mockups/DeviceMockup.svelte.d.ts

@@ -3,7 +3,7 @@ import type { DeviceMockupProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [DeviceMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L520)
+ * [DeviceMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L513)
  * ## Props
  * @prop children
  * @prop device = "default"

package/dist/device-mockups/Ios.svelte

@@ -23,7 +23,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[IosProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L554)
+[IosProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L547)
 ## Props
 @prop children
 @prop divClass

package/dist/device-mockups/Ios.svelte.d.ts

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

package/dist/device-mockups/Laptop.svelte

@@ -24,7 +24,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[MockupBaseProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L525)
+[MockupBaseProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L518)
 ## Props
 @prop children
 @prop divClass

package/dist/device-mockups/Laptop.svelte.d.ts

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

package/dist/device-mockups/Smartwatch.svelte

@@ -25,7 +25,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[SmartwatchProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L564)
+[SmartwatchProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L557)
 ## Props
 @prop children
 @prop divClass

package/dist/device-mockups/Smartwatch.svelte.d.ts

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

package/dist/device-mockups/Tablet.svelte

@@ -23,7 +23,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[TabletProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L574)
+[TabletProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L567)
 ## Props
 @prop children
 @prop divClass

package/dist/device-mockups/Tablet.svelte.d.ts

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

package/dist/device-mockups/theme.d.ts

@@ -2,9 +2,9 @@ declare const android: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftMid?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
@@ -14,9 +14,9 @@ declare const android: import("tailwind-variants").TVReturnType<{
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftMid?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
@@ -34,9 +34,9 @@ declare const android: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftMid?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
@@ -63,9 +63,9 @@ declare const defaultMockup: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
         };
@@ -74,9 +74,9 @@ declare const defaultMockup: import("tailwind-variants").TVReturnType<{
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
         };
@@ -92,9 +92,9 @@ declare const defaultMockup: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
         };
@@ -117,8 +117,8 @@ declare const defaultMockup: import("tailwind-variants").TVReturnType<{
 declare const desktop: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
-            inner?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            inner?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             botUnder?: import("tailwind-variants").ClassValue;
         };
@@ -126,8 +126,8 @@ declare const desktop: import("tailwind-variants").TVReturnType<{
 } | {
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
-            inner?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            inner?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             botUnder?: import("tailwind-variants").ClassValue;
         };
@@ -140,8 +140,8 @@ declare const desktop: import("tailwind-variants").TVReturnType<{
 }, undefined, {
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
-            inner?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            inner?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             botUnder?: import("tailwind-variants").ClassValue;
         };
@@ -161,9 +161,9 @@ declare const ios: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
         };
@@ -172,9 +172,9 @@ declare const ios: import("tailwind-variants").TVReturnType<{
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
         };
@@ -190,9 +190,9 @@ declare const ios: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
+            div?: import("tailwind-variants").ClassValue;
             top?: import("tailwind-variants").ClassValue;
             right?: import("tailwind-variants").ClassValue;
-            div?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
         };
@@ -215,8 +215,8 @@ declare const ios: import("tailwind-variants").TVReturnType<{
 declare const laptop: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
-            inner?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            inner?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             botCen?: import("tailwind-variants").ClassValue;
         };
@@ -224,8 +224,8 @@ declare const laptop: import("tailwind-variants").TVReturnType<{
 } | {
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
-            inner?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            inner?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             botCen?: import("tailwind-variants").ClassValue;
         };
@@ -238,8 +238,8 @@ declare const laptop: import("tailwind-variants").TVReturnType<{
 }, undefined, {
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
-            inner?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            inner?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             botCen?: import("tailwind-variants").ClassValue;
         };
@@ -259,8 +259,8 @@ declare const smartwatch: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
-            top?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            top?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             rightTop?: import("tailwind-variants").ClassValue;
             rightBot?: import("tailwind-variants").ClassValue;
@@ -270,8 +270,8 @@ declare const smartwatch: import("tailwind-variants").TVReturnType<{
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
-            top?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            top?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             rightTop?: import("tailwind-variants").ClassValue;
             rightBot?: import("tailwind-variants").ClassValue;
@@ -288,8 +288,8 @@ declare const smartwatch: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
-            top?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            top?: import("tailwind-variants").ClassValue;
             bot?: import("tailwind-variants").ClassValue;
             rightTop?: import("tailwind-variants").ClassValue;
             rightBot?: import("tailwind-variants").ClassValue;
@@ -314,8 +314,8 @@ declare const tablet: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
-            right?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            right?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftMid?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
@@ -325,8 +325,8 @@ declare const tablet: import("tailwind-variants").TVReturnType<{
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
-            right?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            right?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftMid?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;
@@ -343,8 +343,8 @@ declare const tablet: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
             slot?: import("tailwind-variants").ClassValue;
-            right?: import("tailwind-variants").ClassValue;
             div?: import("tailwind-variants").ClassValue;
+            right?: import("tailwind-variants").ClassValue;
             leftTop?: import("tailwind-variants").ClassValue;
             leftMid?: import("tailwind-variants").ClassValue;
             leftBot?: import("tailwind-variants").ClassValue;

package/dist/drawer/Drawer.svelte

@@ -2,11 +2,14 @@
   import { type ParamsType, type DrawerProps, trapFocus, cn } from "..";
   import { fly } from "svelte/transition";
   import { sineIn } from "svelte/easing";
-  import { drawer } from ".";
+  import { drawer, type DrawerTheme } from ".";
+  import { getTheme } from "../theme/themeUtils";
 
   let { children, hidden = $bindable(), closeDrawer = () => (hidden = true), activateClickOutside = true, position, width, backdrop = true, backdropClass, placement = "left", class: className, transitionParams, transitionType = fly, bodyScrolling = false, ...restProps }: DrawerProps = $props();
 
-  const { base, backdrop_: backdropCls } = $derived(
+  const theme = getTheme("drawer");
+
+  const { base, backdrop: backdropCls } = $derived(
     drawer({
       position,
       placement,
@@ -27,8 +30,8 @@
 <svelte:window bind:innerWidth bind:innerHeight />
 
 {#if !hidden}
-  <div role="presentation" class={cn(backdropCls(), backdropClass)} onclick={activateClickOutside ? closeDrawer : undefined} style={bodyScrolling ? "pointer-events: none;" : ""}></div>
-  <div use:trapFocus={{ onEscape: closeDrawer }} {...restProps} class={cn(base(), className)} transition:transitionType={transitionParams ? transitionParams : (transition_params as ParamsType)} tabindex="-1">
+  <div role="presentation" class={cn(backdropCls(), backdropClass, (theme as DrawerTheme)?.backdrop)} onclick={activateClickOutside ? closeDrawer : undefined} style={bodyScrolling ? "pointer-events: none;" : ""}></div>
+  <div use:trapFocus={{ onEscape: closeDrawer }} {...restProps} class={cn(base(), className, (theme as DrawerTheme)?.base)} transition:transitionType={transitionParams ? transitionParams : (transition_params as ParamsType)} tabindex="-1">
     {@render children?.()}
   </div>
 {/if}
@@ -37,7 +40,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DrawerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L585)
+[DrawerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L578)
 ## Props
 @prop children
 @prop hidden = $bindable()

package/dist/drawer/Drawer.svelte.d.ts

@@ -2,7 +2,7 @@ import { type DrawerProps } from "..";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [DrawerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L585)
+ * [DrawerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L578)
  * ## Props
  * @prop children
  * @prop hidden = $bindable()

package/dist/drawer/Drawerhead.svelte

@@ -1,21 +1,24 @@
 <script lang="ts">
-  import { drawerhead } from ".";
+  import { drawerhead, type DrawerHeadTheme } from ".";
   import { type DrawerheadProps, cn } from "..";
+  import { getTheme } from "../theme/themeUtils";
 
   let { closeIcon, children, buttonClass, svgClass, class: className, ...restProps }: DrawerheadProps = $props();
 
+  const theme = getTheme("drawer");
+
   const { base, button, svg } = $derived(drawerhead());
 </script>
 
-<div class={cn(base(), className)}>
+<div class={cn(base(), className, (theme as DrawerHeadTheme)?.base)}>
   {#if children}
     {@render children()}
   {/if}
   {#if closeIcon}
     {@render closeIcon()}
   {:else}
-    <button type="button" {...restProps} class={cn(button(), buttonClass)}>
-      <svg class={cn(svg(), svgClass)} aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
+    <button type="button" {...restProps} class={cn(button(), buttonClass, (theme as DrawerHeadTheme)?.button)}>
+      <svg class={cn(svg(), svgClass, (theme as DrawerHeadTheme)?.svg)} aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
         <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
       </svg>
       <span class="sr-only">Close drawer</span>
@@ -27,7 +30,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DrawerheadProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L596)
+[DrawerheadProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L589)
 ## Props
 @prop closeIcon
 @prop children

package/dist/drawer/Drawerhead.svelte.d.ts

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

package/dist/drawer/index.d.ts

@@ -1,3 +1,3 @@
 export { default as Drawer } from "./Drawer.svelte";
 export { default as Drawerhead } from "./Drawerhead.svelte";
-export { drawer, drawerhead } from "./theme";
+export { drawer, drawerhead, type DrawerTheme, type DrawerHeadTheme } from "./theme";

package/dist/drawer/theme.d.ts

@@ -4,11 +4,11 @@ export declare const drawer: import("tailwind-variants").TVReturnType<{
     position: {
         fixed: {
             base: string;
-            backdrop_: string;
+            backdrop: string;
         };
         absolute: {
             base: string;
-            backdrop_: string;
+            backdrop: string;
         };
     };
     placement: {
@@ -38,21 +38,21 @@ export declare const drawer: import("tailwind-variants").TVReturnType<{
     };
     backdrop: {
         true: {
-            backdrop_: string;
+            backdrop: string;
         };
     };
 }, {
     base: string;
-    backdrop_: string;
+    backdrop: string;
 }, undefined, {
     position: {
         fixed: {
             base: string;
-            backdrop_: string;
+            backdrop: string;
         };
         absolute: {
             base: string;
-            backdrop_: string;
+            backdrop: string;
         };
     };
     placement: {
@@ -82,21 +82,21 @@ export declare const drawer: import("tailwind-variants").TVReturnType<{
     };
     backdrop: {
         true: {
-            backdrop_: string;
+            backdrop: string;
         };
     };
 }, {
     base: string;
-    backdrop_: string;
+    backdrop: string;
 }, import("tailwind-variants").TVReturnType<{
     position: {
         fixed: {
             base: string;
-            backdrop_: string;
+            backdrop: string;
         };
         absolute: {
             base: string;
-            backdrop_: string;
+            backdrop: string;
         };
     };
     placement: {
@@ -126,12 +126,12 @@ export declare const drawer: import("tailwind-variants").TVReturnType<{
     };
     backdrop: {
         true: {
-            backdrop_: string;
+            backdrop: string;
         };
     };
 }, {
     base: string;
-    backdrop_: string;
+    backdrop: string;
 }, undefined, unknown, unknown, undefined>>;
 export declare const drawerhead: import("tailwind-variants").TVReturnType<{
     [key: string]: {
@@ -170,3 +170,7 @@ export declare const drawerhead: import("tailwind-variants").TVReturnType<{
     button: string;
     svg: string;
 }, undefined, unknown, unknown, undefined>>;
+export type DrawerSlots = keyof typeof drawer.slots;
+export type DrawerTheme = Partial<Record<DrawerSlots, string>>;
+export type DrawerHeadSlots = keyof typeof drawerhead.slots;
+export type DrawerHeadTheme = Partial<Record<DrawerHeadSlots, string>>;

package/dist/drawer/theme.js

@@ -2,12 +2,12 @@ import { tv } from "tailwind-variants";
 export const drawer = tv({
     slots: {
         base: "overflow-y-auto z-50 p-4 bg-white dark:bg-gray-800",
-        backdrop_: "fixed top-0 start-0 z-50 w-full h-full"
+        backdrop: "fixed top-0 start-0 z-50 w-full h-full"
     },
     variants: {
         position: {
-            fixed: { base: "fixed", backdrop_: "fixed" },
-            absolute: { base: "absolute", backdrop_: "absolute" }
+            fixed: { base: "fixed", backdrop: "fixed" },
+            absolute: { base: "absolute", backdrop: "absolute" }
         },
         placement: {
             left: { base: "inset-y-0 start-0" },
@@ -21,7 +21,7 @@ export const drawer = tv({
             half: { base: "w-1/2" }
         },
         backdrop: {
-            true: { backdrop_: "bg-gray-900 opacity-75" }
+            true: { backdrop: "bg-gray-900 opacity-75" }
         }
     },
     defaultVariants: {

package/dist/dropdown/Dropdown.svelte

@@ -3,9 +3,12 @@
   import { writable } from "svelte/store";
   import { dropdown } from "./";
   import { type DropdownProps, Popper, cn, DropdownGroup } from "..";
+  import { getTheme } from "../theme/themeUtils";
 
   let { children, simple = false, placement = "bottom", offset = 2, class: className, activeUrl = "", isOpen = $bindable(false), ...restProps }: DropdownProps = $props();
 
+  const theme = getTheme("dropdown");
+
   const { base, backdrop } = $derived(dropdown());
   const activeUrlStore = writable("");
   setContext("activeUrl", activeUrlStore);
@@ -17,7 +20,7 @@
 
 <!-- Dropdown menu -->
 
-<Popper {...restProps} {placement} {offset} bind:isOpen class={cn(base(), className)}>
+<Popper {...restProps} {placement} {offset} bind:isOpen class={cn(base(), className, theme)}>
   {#if simple}
     <DropdownGroup>
       {@render children()}
@@ -31,7 +34,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DropdownProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L603)
+[DropdownProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L596)
 ## Props
 @prop children
 @prop simple = false

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

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