flowbite-svelte 1.28.0 → 1.28.1

package/dist/buttons/Button.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { getContext } from "svelte";
   import clsx from "clsx";
+  import { Spinner } from "..";
   import type { SizeType, ButtonProps } from "..";
   import { getTheme } from "../theme/themeUtils";
   import { button } from "./theme";
@@ -8,7 +9,20 @@
   const group: SizeType = getContext("group");
   const ctxDisabled: boolean | undefined = getContext("disabled");
 
-  let { children, pill, outline = false, size = "md", color, shadow = false, tag = "button", disabled, loading = false, class: className, ...restProps }: ButtonProps = $props();
+  let {
+    children,
+    pill,
+    outline = false,
+    size = "md",
+    color,
+    shadow = false,
+    tag = "button",
+    disabled,
+    loading = false,
+    spinnerProps = { size: "4" },
+    class: className,
+    ...restProps
+  }: ButtonProps = $props();
 
   const theme = getTheme("button");
 
@@ -16,7 +30,8 @@
   let actualColor = $derived(color ?? (group ? (outline ? "dark" : "alternative") : "primary"));
   let isDisabled = $derived(Boolean(ctxDisabled) || Boolean(disabled) || loading);
 
-  const { base, outline: outline_, shadow: shadow_ } = $derived(button({ color: actualColor, size: actualSize, disabled: isDisabled, pill, group: !!group }));
+  const { base, outline: outline_, shadow: shadow_, spinner } = $derived(button({ color: actualColor, size: actualSize, disabled: isDisabled, pill, group: !!group }));
+
   let btnCls = $derived(base({ class: clsx(outline && outline_(), shadow && shadow_(), theme?.base, className) }));
 </script>
 
@@ -28,10 +43,7 @@
   <button type="button" {...restProps} class={btnCls} disabled={isDisabled}>
     {@render children?.()}
     {#if loading}
-      <svg class="ml-2 h-4 w-4 animate-spin text-white" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
-        <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
-        <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z" />
-      </svg>
+      <Spinner {...spinnerProps} class={spinner()} />
     {/if}
   </button>
 {:else}
@@ -55,6 +67,7 @@
 @prop tag = "button"
 @prop disabled
 @prop loading = false
+@prop spinnerProps = { size: "4" }
 @prop class: className
 @prop ...restProps
 -->

package/dist/buttons/Button.svelte.d.ts

@@ -13,6 +13,7 @@ import type { ButtonProps } from "..";
  * @prop tag = "button"
  * @prop disabled
  * @prop loading = false
+ * @prop spinnerProps = { size: "4" }
  * @prop class: className
  * @prop ...restProps
  */

package/dist/buttons/GradientButton.svelte

@@ -31,7 +31,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[GradientButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L353)
+[GradientButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L354)
 ## Props
 @prop children
 @prop outline

package/dist/buttons/GradientButton.svelte.d.ts

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

package/dist/buttons/theme.d.ts

@@ -146,6 +146,7 @@ export declare const button: import("tailwind-variants").TVReturnType<{
     base: string;
     outline: string;
     shadow: string;
+    spinner: string;
 }, undefined, {
     color: {
         primary: {
@@ -291,6 +292,7 @@ export declare const button: import("tailwind-variants").TVReturnType<{
     base: string;
     outline: string;
     shadow: string;
+    spinner: string;
 }, import("tailwind-variants").TVReturnType<{
     color: {
         primary: {
@@ -436,6 +438,7 @@ export declare const button: import("tailwind-variants").TVReturnType<{
     base: string;
     outline: string;
     shadow: string;
+    spinner: string;
 }, undefined, unknown, unknown, undefined>>;
 export declare const gradientButton: import("tailwind-variants").TVReturnType<{
     color: {

package/dist/buttons/theme.js

@@ -3,7 +3,8 @@ export const button = tv({
     slots: {
         base: "text-center font-medium inline-flex items-center justify-center",
         outline: "bg-transparent border hover:text-white dark:bg-transparent dark:hover-text-white",
-        shadow: "shadow-lg"
+        shadow: "shadow-lg",
+        spinner: "ms-2"
     },
     variants: {
         color: {

package/dist/card/Card.svelte

@@ -58,7 +58,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[CardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L394)
+[CardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L395)
 ## Props
 @prop children
 @prop color = "gray"

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

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

package/dist/carousel/Carousel.svelte

@@ -218,7 +218,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L412)
+[CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L413)
 ## Props
 @prop children
 @prop slide

package/dist/carousel/Carousel.svelte.d.ts

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

package/dist/carousel/CarouselIndicators.svelte

@@ -35,7 +35,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L427)
+[IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L428)
 ## Props
 @prop children
 @prop activeClass

package/dist/carousel/CarouselIndicators.svelte.d.ts

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

package/dist/carousel/ControlButton.svelte

@@ -36,7 +36,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L434)
+[ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L435)
 ## Props
 @prop children
 @prop forward

package/dist/carousel/ControlButton.svelte.d.ts

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

package/dist/carousel/Controls.svelte

@@ -28,7 +28,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L440)
+[ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L441)
 ## Props
 @prop children
 @prop class: className

package/dist/carousel/Controls.svelte.d.ts

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

package/dist/carousel/Slide.svelte

@@ -45,7 +45,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L457)
+[SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L458)
 ## Props
 @prop image
 @prop transition

package/dist/carousel/Slide.svelte.d.ts

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

package/dist/carousel/Thumbnail.svelte

@@ -15,7 +15,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L444)
+[ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L445)
 ## Props
 @prop selected
 @prop class: className

package/dist/carousel/Thumbnail.svelte.d.ts

@@ -2,7 +2,7 @@ import type { ThumbnailProps } from "..";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L444)
+ * [ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L445)
  * ## Props
  * @prop selected
  * @prop class: className

package/dist/carousel/Thumbnails.svelte

@@ -47,7 +47,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L448)
+[ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L449)
 ## Props
 @prop children
 @prop images = []

package/dist/carousel/Thumbnails.svelte.d.ts

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

package/dist/clipboard/Clipboard.svelte

@@ -46,7 +46,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L469)
+[ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L470)
 ## Props
 @prop children
 @prop embedded = false

package/dist/clipboard/Clipboard.svelte.d.ts

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

package/dist/command-palette/CommandPalette.svelte

@@ -194,7 +194,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[CommandPaletteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2198)
+[CommandPaletteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2199)
 ## Props
 @prop open = $bindable(false)
 @prop items = []

package/dist/command-palette/CommandPalette.svelte.d.ts

@@ -2,7 +2,7 @@ import type { CommandPaletteProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [CommandPaletteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2198)
+ * [CommandPaletteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2199)
  * ## Props
  * @prop open = $bindable(false)
  * @prop items = []

package/dist/darkmode/DarkMode.svelte

@@ -64,7 +64,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L478)
+[DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L479)
 ## Props
 @prop class: className
 @prop lightIcon

package/dist/darkmode/DarkMode.svelte.d.ts

@@ -2,7 +2,7 @@ import type { DarkmodeProps } from "..";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L478)
+ * [DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L479)
  * ## Props
  * @prop class: className
  * @prop lightIcon

package/dist/datepicker/theme.js

@@ -16,29 +16,29 @@ export const datepicker = tv({
     },
     variants: {
         color: {
-            primary: { input: "focus:ring-primary-500 dark:focus:ring-primary-400", dayButton: "bg-primary-100 dark:bg-primary-900" },
-            blue: { input: "focus:ring-blue-500 dark:focus:ring-blue-400", dayButton: "bg-blue-100 dark:bg-blue-900" },
-            red: { input: "focus:ring-red-500 dark:focus:ring-red-400", dayButton: "bg-red-100 dark:bg-red-900" },
-            green: { input: "focus:ring-green-500 dark:focus:ring-green-400", dayButton: "bg-green-100 dark:bg-green-900" },
-            yellow: { input: "focus:ring-yellow-500 dark:focus:ring-yellow-400", dayButton: "bg-yellow-100 dark:bg-yellow-900" },
-            purple: { input: "focus:ring-purple-500 dark:focus:ring-purple-400", dayButton: "bg-purple-100 dark:bg-purple-900" },
-            dark: { input: "focus:ring-gray-500 dark:focus:ring-gray-400", dayButton: "bg-gray-100 dark:bg-gray-900" },
-            light: { input: "focus:ring-gray-500 dark:focus:ring-gray-400", dayButton: "bg-gray-100 dark:bg-gray-900" },
-            alternative: { input: "focus:ring-alternative-500 dark:focus:ring-alternative-400", dayButton: "bg-alternative-100 dark:bg-alternative-900" },
-            secondary: { input: "focus:ring-secondary-500 dark:focus:ring-secondary-400", dayButton: "bg-secondary-100 dark:bg-secondary-900" },
-            gray: { input: "focus:ring-gray-500 dark:focus:ring-gray-400", dayButton: "bg-gray-100 dark:bg-gray-900" },
-            orange: { input: "focus:ring-orange-500 dark:focus:ring-orange-400", dayButton: "bg-orange-100 dark:bg-orange-900" },
-            amber: { input: "focus:ring-amber-500 dark:focus:ring-amber-400", dayButton: "bg-amber-100 dark:bg-amber-900" },
-            lime: { input: "focus:ring-lime-500 dark:focus:ring-lime-400", dayButton: "bg-lime-100 dark:bg-lime-900" },
-            emerald: { input: "focus:ring-emerald-500 dark:focus:ring-emerald-400", dayButton: "bg-emerald-100 dark:bg-emerald-900" },
-            teal: { input: "focus:ring-teal-500 dark:focus:ring-teal-400", dayButton: "bg-teal-100 dark:bg-teal-900" },
-            cyan: { input: "focus:ring-cyan-500 dark:focus:ring-cyan-400", dayButton: "bg-cyan-100 dark:bg-cyan-900" },
-            sky: { input: "focus:ring-sky-500 dark:focus:ring-sky-400", dayButton: "bg-sky-100 dark:bg-sky-900" },
-            indigo: { input: "focus:ring-indigo-500 dark:focus:ring-indigo-400", dayButton: "bg-indigo-100 dark:bg-indigo-900" },
-            violet: { input: "focus:ring-violet-500 dark:focus:ring-violet-400", dayButton: "bg-violet-100 dark:bg-violet-900" },
-            fuchsia: { input: "focus:ring-fuchsia-500 dark:focus:ring-fuchsia-400", dayButton: "bg-fuchsia-100 dark:bg-fuchsia-900" },
-            pink: { input: "focus:ring-pink-500 dark:focus:ring-pink-400", dayButton: "bg-pink-100 dark:bg-pink-900" },
-            rose: { input: "focus:ring-rose-500 dark:focus:ring-rose-400", dayButton: "bg-rose-100 dark:bg-rose-900" }
+            primary: { input: "focus:ring-primary-500 dark:focus:ring-primary-400", dayButton: "bg-primary-300 dark:bg-primary-900" },
+            blue: { input: "focus:ring-blue-500 dark:focus:ring-blue-400", dayButton: "bg-blue-300 dark:bg-blue-900" },
+            red: { input: "focus:ring-red-500 dark:focus:ring-red-400", dayButton: "bg-red-300 dark:bg-red-900" },
+            green: { input: "focus:ring-green-500 dark:focus:ring-green-400", dayButton: "bg-green-300 dark:bg-green-900" },
+            yellow: { input: "focus:ring-yellow-500 dark:focus:ring-yellow-400", dayButton: "bg-yellow-300 dark:bg-yellow-900" },
+            purple: { input: "focus:ring-purple-500 dark:focus:ring-purple-400", dayButton: "bg-purple-300 dark:bg-purple-900" },
+            dark: { input: "focus:ring-gray-500 dark:focus:ring-gray-400", dayButton: "bg-gray-300 dark:bg-gray-900" },
+            light: { input: "focus:ring-gray-500 dark:focus:ring-gray-400", dayButton: "bg-gray-300 dark:bg-gray-900" },
+            alternative: { input: "focus:ring-alternative-500 dark:focus:ring-alternative-400", dayButton: "bg-alternative-300 dark:bg-alternative-900" },
+            secondary: { input: "focus:ring-secondary-500 dark:focus:ring-secondary-400", dayButton: "bg-secondary-300 dark:bg-secondary-900" },
+            gray: { input: "focus:ring-gray-500 dark:focus:ring-gray-400", dayButton: "bg-gray-300 dark:bg-gray-900" },
+            orange: { input: "focus:ring-orange-500 dark:focus:ring-orange-400", dayButton: "bg-orange-300 dark:bg-orange-900" },
+            amber: { input: "focus:ring-amber-500 dark:focus:ring-amber-400", dayButton: "bg-amber-300 dark:bg-amber-900" },
+            lime: { input: "focus:ring-lime-500 dark:focus:ring-lime-400", dayButton: "bg-lime-300 dark:bg-lime-900" },
+            emerald: { input: "focus:ring-emerald-500 dark:focus:ring-emerald-400", dayButton: "bg-emerald-300 dark:bg-emerald-900" },
+            teal: { input: "focus:ring-teal-500 dark:focus:ring-teal-400", dayButton: "bg-teal-300 dark:bg-teal-900" },
+            cyan: { input: "focus:ring-cyan-500 dark:focus:ring-cyan-400", dayButton: "bg-cyan-300 dark:bg-cyan-900" },
+            sky: { input: "focus:ring-sky-500 dark:focus:ring-sky-400", dayButton: "bg-sky-300 dark:bg-sky-900" },
+            indigo: { input: "focus:ring-indigo-500 dark:focus:ring-indigo-400", dayButton: "bg-indigo-300 dark:bg-indigo-900" },
+            violet: { input: "focus:ring-violet-500 dark:focus:ring-violet-400", dayButton: "bg-violet-300 dark:bg-violet-900" },
+            fuchsia: { input: "focus:ring-fuchsia-500 dark:focus:ring-fuchsia-400", dayButton: "bg-fuchsia-300 dark:bg-fuchsia-900" },
+            pink: { input: "focus:ring-pink-500 dark:focus:ring-pink-400", dayButton: "bg-pink-300 dark:bg-pink-900" },
+            rose: { input: "focus:ring-rose-500 dark:focus:ring-rose-400", dayButton: "bg-rose-300 dark:bg-rose-900" }
         },
         inline: {
             false: { base: "absolute z-10 mt-1" }

package/dist/device-mockups/Android.svelte

@@ -43,7 +43,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L551)
+[AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L552)
 ## Props
 @prop children
 @prop class: className

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#L551)
+ * [AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L552)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/device-mockups/DefaultMockup.svelte

@@ -40,7 +40,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L562)
+[DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L563)
 ## Props
 @prop children
 @prop class: className

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#L562)
+ * [DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L563)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/device-mockups/Desktop.svelte

@@ -32,7 +32,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DesktopProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L535)
+[DesktopProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L536)
 ## Props
 @prop children
 @prop class: className

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

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

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#L530)
+[DeviceMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L531)
 ## 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#L530)
+ * [DeviceMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L531)
  * ## Props
  * @prop children
  * @prop device = "default"

package/dist/device-mockups/Ios.svelte

@@ -40,7 +40,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[IosProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L572)
+[IosProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L573)
 ## Props
 @prop children
 @prop class: className

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#L572)
+ * [IosProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L573)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/device-mockups/Laptop.svelte

@@ -40,7 +40,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[LaptopProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L543)
+[LaptopProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L544)
 ## Props
 @prop children
 @prop class: className

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

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

package/dist/device-mockups/Smartwatch.svelte

@@ -41,7 +41,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[SmartwatchProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L582)
+[SmartwatchProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L583)
 ## Props
 @prop children
 @prop class: className

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#L582)
+ * [SmartwatchProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L583)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/device-mockups/Tablet.svelte

@@ -40,7 +40,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[TabletProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L592)
+[TabletProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L593)
 ## Props
 @prop children
 @prop class: className

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#L592)
+ * [TabletProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L593)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/dialog/Dialog.svelte

@@ -178,7 +178,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DialogProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L604)
+[DialogProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L605)
 ## Props
 @prop children
 @prop onaction = ()

package/dist/dialog/Dialog.svelte.d.ts

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

package/dist/drawer/Drawer.svelte

@@ -135,7 +135,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DrawerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L618)
+[DrawerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L619)
 ## Props
 @prop children
 @prop open = $bindable(false)

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#L618)
+ * [DrawerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L619)
  * ## Props
  * @prop children
  * @prop open = $bindable(false)

package/dist/drawer/DrawerHandle.svelte

@@ -22,7 +22,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DrawerHandleProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L626)
+[DrawerHandleProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L627)
 ## Props
 @prop children
 @prop placement