flowbite-svelte 1.11.5 → 1.11.6

package/dist/carousel/Carousel.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { type CarouselProps, type State, Slide } from "..";
-  import { getTheme } from "../theme/themeUtils";
+  import { getTheme, warnThemeDeprecation } from "../theme/themeUtils";
   import clsx from "clsx";
   import { onMount, setContext } from "svelte";
   import { canChangeSlide } from "./CarouselSlide";
@@ -8,19 +8,40 @@
 
   const SLIDE_DURATION_RATIO = 0.25;
 
-  let { children, slide, images, index = $bindable(0), slideDuration = 1000, transition, duration = 0, "aria-label": ariaLabel = "Draggable Carousel", disableSwipe = false, imgClass = "", class: className, onchange, divClass, isPreload = false, ...restProps }: CarouselProps = $props();
+  let { children, slide, images, index = $bindable(0), slideDuration = 1000, slideFit, transition, duration = 0, "aria-label": ariaLabel = "Draggable Carousel", disableSwipe = false, imgClass = "", class: className, classes, onchange, isPreload = false, ...restProps }: CarouselProps = $props();
 
+  warnThemeDeprecation("Carousel", { imgClass }, { imgClass: "slide" });
+
+  const styling = $derived(classes ?? { slide: imgClass });
+
+  // // Theme context
   const theme = getTheme("carousel");
 
-  const _state: State = $state({ images, index: index ?? 0, forward: true, slideDuration, lastSlideChange: new Date() });
+  let { base, slide: slideCls } = $derived(carousel());
+
+  const changeSlide = (n: number) => {
+    if (images.length === 0) return;
+
+    if (n % images.length === _state.index) return;
+
+    if (!canChangeSlide({ lastSlideChange: _state.lastSlideChange, slideDuration, slideDurationRatio: SLIDE_DURATION_RATIO })) return;
+
+    _state.forward = n >= _state.index;
+    _state.index = (images.length + n) % images.length;
+    _state.lastSlideChange = new Date();
+
+    index = _state.index; // Update the bindable index
+    onchange?.(images[_state.index]);
+  };
+
+  const _state: State = $state({ images, index: index ?? 0, forward: true, slideDuration, lastSlideChange: new Date(), changeSlide });
 
   setContext("state", _state);
 
   let initialized = false;
 
   $effect(() => {
-    index = _state.index;
-    onchange?.(images[index]);
+    changeSlide(index);
   });
 
   onMount(() => {
@@ -29,23 +50,11 @@
   });
 
   const nextSlide = () => {
-    if (!canChangeSlide({ lastSlideChange: _state.lastSlideChange, slideDuration, slideDurationRatio: SLIDE_DURATION_RATIO })) return _state;
-
-    _state.forward = true;
-    _state.index = _state.index >= images.length - 1 ? 0 : _state.index + 1;
-    _state.lastSlideChange = new Date();
-
-    return _state;
+    changeSlide(_state.index + 1);
   };
 
   const prevSlide = () => {
-    if (!canChangeSlide({ lastSlideChange: _state.lastSlideChange, slideDuration, slideDurationRatio: SLIDE_DURATION_RATIO })) return _state;
-
-    _state.forward = false;
-    _state.index = _state.index <= 0 ? images.length - 1 : _state.index - 1;
-    _state.lastSlideChange = new Date();
-
-    return _state;
+    changeSlide(_state.index - 1);
   };
 
   const loop = (node: HTMLElement) => {
@@ -79,7 +88,7 @@
 
   const getPositionFromEvent = (evt: MouseEvent | TouchEvent) => {
     const mousePos = (evt as MouseEvent)?.clientX;
-    if (mousePos) return mousePos;
+    if (mousePos !== undefined) return mousePos;
 
     let touchEvt = evt as TouchEvent;
     if (/^touch/.test(touchEvt?.type)) {
@@ -164,36 +173,36 @@
 
 <!-- The move listeners go here, so things keep working if the touch strays out of the element. -->
 <svelte:document onmousemove={onDragMove} onmouseup={onDragStop} ontouchmove={onDragMove} ontouchend={onDragStop} />
-<div bind:this={carouselDiv} class={clsx("relative", divClass)} onmousedown={onDragStart} ontouchstart={onDragStart} onmousemove={onDragMove} onmouseup={onDragStop} ontouchmove={onDragMove} ontouchend={onDragStop} role="button" aria-label={ariaLabel} tabindex="0">
-  <div {...restProps} class={carousel({ class: clsx(activeDragGesture === undefined ? "transition-transform" : "", theme, className) })} {@attach loop}>
-    {#if slide}
-      {@render slide({ index, Slide })}
-    {:else}
-      <Slide image={images[index]} class={clsx(imgClass)} {transition} />
-    {/if}
-  </div>
-  {@render children?.(index)}
+<div bind:this={carouselDiv} onmousedown={onDragStart} ontouchstart={onDragStart} onmousemove={onDragMove} onmouseup={onDragStop} ontouchmove={onDragMove} ontouchend={onDragStop} role="button" aria-label={ariaLabel} tabindex="0" {...restProps} class={base({ class: clsx(activeDragGesture === undefined ? "transition-transform" : "", theme?.base, className) })} {@attach loop}>
+  {#if slide}
+    {@render slide({ index: _state.index, Slide })}
+  {:else}
+    <Slide image={images[_state.index]} fit={slideFit} class={slideCls({ class: clsx(theme?.slide, styling.slide) })} {transition} />
+  {/if}
+
+  {@render children?.(_state.index)}
 </div>
 
 <!--
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L372)
+[CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L373)
 ## Props
 @prop children
 @prop slide
 @prop images
 @prop index = $bindable(0)
 @prop slideDuration = 1000
+@prop slideFit
 @prop transition
 @prop duration = 0
 @prop "aria-label": ariaLabel = "Draggable Carousel"
 @prop disableSwipe = false
 @prop imgClass = ""
 @prop class: className
+@prop classes
 @prop onchange
-@prop divClass
 @prop isPreload = false
 @prop ...restProps
 -->

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

@@ -2,21 +2,22 @@ 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#L372)
+ * [CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L373)
  * ## Props
  * @prop children
  * @prop slide
  * @prop images
  * @prop index = $bindable(0)
  * @prop slideDuration = 1000
+ * @prop slideFit
  * @prop transition
  * @prop duration = 0
  * @prop "aria-label": ariaLabel = "Draggable Carousel"
  * @prop disableSwipe = false
  * @prop imgClass = ""
  * @prop class: className
+ * @prop classes
  * @prop onchange
- * @prop divClass
  * @prop isPreload = false
  * @prop ...restProps
  */

package/dist/carousel/CarouselIndicators.svelte

@@ -13,17 +13,14 @@
   const { base, indicator } = $derived(carouselIndicators({ position }));
 
   function goToIndex(newIndex: number) {
-    const currentIndex = _state.index;
-    _state.index = newIndex;
-    _state.forward = newIndex >= currentIndex;
-    _state.lastSlideChange = new Date();
+    _state.changeSlide(newIndex);
   }
 </script>
 
 <div class={base({ class: clsx(theme?.base, className) })} {...restProps}>
   {#each _state.images as _, idx}
     {@const selected = _state.index === idx}
-    <button onclick={() => goToIndex(idx)}>
+    <button type="button" onclick={() => goToIndex(idx)} aria-current={selected ? "true" : undefined} aria-label={`Go to slide ${idx + 1}`}>
       {#if children}
         {@render children({ selected, index: idx })}
       {:else}
@@ -37,7 +34,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L387)
+[IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L388)
 ## 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#L387)
+ * [IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L388)
  * ## 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#L394)
+[ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L395)
 ## 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#L394)
+ * [ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L395)
  * ## Props
  * @prop children
  * @prop forward

package/dist/carousel/Controls.svelte

@@ -3,7 +3,6 @@
   import { getTheme } from "../theme/themeUtils";
   import clsx from "clsx";
   import { getContext } from "svelte";
-  import { canChangeSlide } from "./CarouselSlide";
 
   let { children, class: className, ...restProps }: ControlsProps = $props();
 
@@ -12,20 +11,7 @@
   const _state = getContext<State>("state");
 
   function changeSlide(forward: boolean) {
-    const { lastSlideChange, slideDuration } = _state;
-    if (!canChangeSlide({ lastSlideChange, slideDuration, slideDurationRatio: 0.75 })) {
-      return;
-    }
-
-    if (forward) {
-      _state.forward = true;
-      _state.index = _state.index >= _state.images.length - 1 ? 0 : _state.index + 1;
-    } else {
-      _state.forward = false;
-      _state.index = _state.index <= 0 ? _state.images.length - 1 : _state.index - 1;
-    }
-    _state.lastSlideChange = new Date();
-    return _state;
+    _state.changeSlide(forward ? _state.index + 1 : _state.index - 1);
   }
 </script>
 
@@ -41,7 +27,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L400)
+[ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L401)
 ## 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#L400)
+ * [ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L401)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/carousel/Slide.svelte

@@ -8,7 +8,7 @@
 
   const _state = getContext<State>("state");
 
-  let { image, transition, class: className, ...restProps }: SlideProps = $props();
+  let { image, transition, fit, class: className, ...restProps }: SlideProps = $props();
 
   const theme = getTheme("slide");
 
@@ -28,7 +28,7 @@
     duration: _state.slideDuration
   });
 
-  let imgClass = slide({ class: clsx(theme, className) });
+  let imgClass = slide({ fit, class: clsx(theme, className) });
 </script>
 
 {#if transition}
@@ -45,10 +45,11 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L417)
+[SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L418)
 ## Props
 @prop image
 @prop transition
+@prop fit
 @prop class: className
 @prop ...restProps
 -->

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

@@ -2,10 +2,11 @@ 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#L417)
+ * [SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L418)
  * ## Props
  * @prop image
  * @prop transition
+ * @prop fit
  * @prop class: className
  * @prop ...restProps
  */

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

package/dist/carousel/Thumbnails.svelte

@@ -1,52 +1,38 @@
 <script lang="ts">
-  import { type State, Thumbnail, type ThumbnailsProps } from "..";
+  import { Thumbnail, type ThumbnailsProps } from "..";
   import { getTheme } from "../theme/themeUtils";
   import clsx from "clsx";
-  import { getContext } from "svelte";
   import { thumbnails } from "./theme";
 
   let { children, images = [], index = $bindable(), ariaLabel = "Click to view image", imgClass, throttleDelay = 650, class: className }: ThumbnailsProps = $props();
 
   const theme = getTheme("thumbnails");
 
-  const _state = getContext<State>("state");
-  if (!_state) {
-    console.error("State is undefined. Make sure to provide state context or pass it as a prop.");
-  }
-
-  let lastClickedAt = new Date();
+  // Initialize so the first click is never throttled
+  let lastClickedAt = -Infinity;
 
   const btnClick = (newIndex: number) => {
-    if (new Date().getTime() - lastClickedAt.getTime() < throttleDelay) {
+    const now = Date.now();
+    if (now - lastClickedAt < throttleDelay) {
       console.warn("Thumbnail action throttled");
       return;
     }
-    if (_state) {
-      const currentIndex = _state.index;
-
-      _state.index = newIndex;
-      _state.forward = newIndex >= currentIndex;
-      _state.lastSlideChange = new Date();
 
-      // Update the bound index
-      index = newIndex;
-    } else {
-      // Fallback behavior if state is not available
-      index = newIndex;
-      lastClickedAt = new Date();
-      console.warn("State update skipped - no valid state available");
-    }
+    lastClickedAt = now;
+    index = newIndex;
   };
 
   $effect(() => {
-    index = (index + images.length) % images.length;
+    if (images.length > 0) {
+      index = (index + images.length) % images.length;
+    }
   });
 </script>
 
 <div class={thumbnails({ class: clsx(theme, className) })}>
   {#each images as image, idx}
     {@const selected = index === idx}
-    <button onclick={() => btnClick(idx)} aria-label={ariaLabel}>
+    <button onclick={() => btnClick(idx)} aria-label={ariaLabel} aria-current={selected ? "true" : undefined}>
       {#if children}
         {@render children({ image, selected, imgClass: clsx(imgClass), Thumbnail })}
       {:else}
@@ -60,7 +46,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L408)
+[ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L409)
 ## 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#L408)
+ * [ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L409)
  * ## Props
  * @prop children
  * @prop images = []

package/dist/carousel/theme.d.ts

@@ -1,6 +1,16 @@
+import type { Classes } from "../theme/themeUtils";
 import { type VariantProps } from "tailwind-variants";
-export type CarouselVariants = VariantProps<typeof carousel>;
-export declare const carousel: import("tailwind-variants").TVReturnType<{}, undefined, "grid overflow-hidden relative rounded-lg h-56 sm:h-64 xl:h-80 2xl:h-96", {}, undefined, import("tailwind-variants").TVReturnType<{}, undefined, "grid overflow-hidden relative rounded-lg h-56 sm:h-64 xl:h-80 2xl:h-96", unknown, unknown, undefined>>;
+export type CarouselVariants = VariantProps<typeof carousel> & Classes<typeof carousel>;
+export declare const carousel: import("tailwind-variants").TVReturnType<{}, {
+    base: string;
+    slide: string;
+}, undefined, {}, {
+    base: string;
+    slide: string;
+}, import("tailwind-variants").TVReturnType<{}, {
+    base: string;
+    slide: string;
+}, undefined, unknown, unknown, undefined>>;
 export declare const carouselIndicators: import("tailwind-variants").TVReturnType<{
     selected: {
         true: {
@@ -17,9 +27,6 @@ export declare const carouselIndicators: import("tailwind-variants").TVReturnTyp
         bottom: {
             base: string;
         };
-        withThumbnails: {
-            base: string;
-        };
     };
 }, {
     base: string;
@@ -40,9 +47,6 @@ export declare const carouselIndicators: import("tailwind-variants").TVReturnTyp
         bottom: {
             base: string;
         };
-        withThumbnails: {
-            base: string;
-        };
     };
 }, {
     base: string;
@@ -63,9 +67,6 @@ export declare const carouselIndicators: import("tailwind-variants").TVReturnTyp
         bottom: {
             base: string;
         };
-        withThumbnails: {
-            base: string;
-        };
     };
 }, {
     base: string;
@@ -113,4 +114,29 @@ export declare const thumbnail: import("tailwind-variants").TVReturnType<{
         false: string;
     };
 }, undefined, "", unknown, unknown, undefined>>;
-export declare const slide: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "absolute block w-full! h-full object-cover", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "absolute block w-full! h-full object-cover", unknown, unknown, undefined>>;
+export type SlideVariants = VariantProps<typeof slide>;
+export declare const slide: import("tailwind-variants").TVReturnType<{
+    fit: {
+        contain: string;
+        cover: string;
+        fill: string;
+        none: string;
+        "scale-down": string;
+    };
+}, undefined, "absolute block w-full h-full", {
+    fit: {
+        contain: string;
+        cover: string;
+        fill: string;
+        none: string;
+        "scale-down": string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    fit: {
+        contain: string;
+        cover: string;
+        fill: string;
+        none: string;
+        "scale-down": string;
+    };
+}, undefined, "absolute block w-full h-full", unknown, unknown, undefined>>;

package/dist/carousel/theme.js

@@ -1,6 +1,9 @@
 import { tv } from "tailwind-variants";
 export const carousel = tv({
-    base: "grid overflow-hidden relative rounded-lg h-56 sm:h-64 xl:h-80 2xl:h-96",
+    slots: {
+        base: "grid overflow-hidden relative rounded-lg h-56 sm:h-64 xl:h-80 2xl:h-96",
+        slide: ""
+    },
     variants: {},
     compoundVariants: [],
     defaultVariants: {}
@@ -17,8 +20,7 @@ export const carouselIndicators = tv({
         },
         position: {
             top: { base: "top-5" },
-            bottom: { base: "bottom-5" },
-            withThumbnails: { base: "bottom-24" }
+            bottom: { base: "bottom-5" }
         }
     }
 });
@@ -50,5 +52,17 @@ export const thumbnail = tv({
     }
 });
 export const slide = tv({
-    base: "absolute block w-full! h-full object-cover"
+    base: "absolute block w-full h-full",
+    variants: {
+        fit: {
+            contain: "object-contain",
+            cover: "object-cover",
+            fill: "object-fill",
+            none: "object-none",
+            "scale-down": "object-scale-down"
+        }
+    },
+    defaultVariants: {
+        fit: "cover"
+    }
 });

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#L429)
+[ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L430)
 ## 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#L429)
+ * [ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L430)
  * ## Props
  * @prop children
  * @prop embedded = false

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

package/dist/datepicker/Datepicker.svelte

@@ -466,7 +466,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DatepickerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L448)
+[DatepickerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L449)
 ## Props
 @prop value = $bindable()
 @prop defaultDate = null

package/dist/datepicker/Datepicker.svelte.d.ts

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

package/dist/device-mockups/Android.svelte

@@ -39,7 +39,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L502)
+[AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L503)
 ## 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#L502)
+ * [AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L503)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/device-mockups/DefaultMockup.svelte

@@ -36,7 +36,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L513)
+[DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L514)
 ## 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#L513)
+ * [DefaultMockupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L514)
  * ## 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#L486)
+[DesktopProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L487)
 ## Props
 @prop children
 @prop class: className