flowbite-svelte 1.11.5 → 1.11.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (280) hide show
  1. package/dist/carousel/Carousel.svelte +45 -37
  2. package/dist/carousel/Carousel.svelte.d.ts +3 -2
  3. package/dist/carousel/CarouselIndicators.svelte +5 -8
  4. package/dist/carousel/CarouselIndicators.svelte.d.ts +1 -1
  5. package/dist/carousel/CarouselSlide.d.ts +1 -1
  6. package/dist/carousel/CarouselSlide.js +1 -1
  7. package/dist/carousel/ControlButton.svelte +1 -1
  8. package/dist/carousel/ControlButton.svelte.d.ts +1 -1
  9. package/dist/carousel/Controls.svelte +4 -18
  10. package/dist/carousel/Controls.svelte.d.ts +1 -1
  11. package/dist/carousel/Slide.svelte +6 -5
  12. package/dist/carousel/Slide.svelte.d.ts +2 -1
  13. package/dist/carousel/Thumbnail.svelte +1 -1
  14. package/dist/carousel/Thumbnail.svelte.d.ts +1 -1
  15. package/dist/carousel/Thumbnails.svelte +12 -26
  16. package/dist/carousel/Thumbnails.svelte.d.ts +1 -1
  17. package/dist/carousel/theme.d.ts +38 -12
  18. package/dist/carousel/theme.js +18 -4
  19. package/dist/clipboard/Clipboard.svelte +1 -1
  20. package/dist/clipboard/Clipboard.svelte.d.ts +1 -1
  21. package/dist/darkmode/DarkMode.svelte +1 -1
  22. package/dist/darkmode/DarkMode.svelte.d.ts +1 -1
  23. package/dist/datepicker/Datepicker.svelte +1 -1
  24. package/dist/datepicker/Datepicker.svelte.d.ts +1 -1
  25. package/dist/device-mockups/Android.svelte +1 -1
  26. package/dist/device-mockups/Android.svelte.d.ts +1 -1
  27. package/dist/device-mockups/DefaultMockup.svelte +1 -1
  28. package/dist/device-mockups/DefaultMockup.svelte.d.ts +1 -1
  29. package/dist/device-mockups/Desktop.svelte +1 -1
  30. package/dist/device-mockups/Desktop.svelte.d.ts +1 -1
  31. package/dist/device-mockups/DeviceMockup.svelte +1 -1
  32. package/dist/device-mockups/DeviceMockup.svelte.d.ts +1 -1
  33. package/dist/device-mockups/Ios.svelte +1 -1
  34. package/dist/device-mockups/Ios.svelte.d.ts +1 -1
  35. package/dist/device-mockups/Laptop.svelte +1 -1
  36. package/dist/device-mockups/Laptop.svelte.d.ts +1 -1
  37. package/dist/device-mockups/Smartwatch.svelte +1 -1
  38. package/dist/device-mockups/Smartwatch.svelte.d.ts +1 -1
  39. package/dist/device-mockups/Tablet.svelte +1 -1
  40. package/dist/device-mockups/Tablet.svelte.d.ts +1 -1
  41. package/dist/drawer/Drawer.svelte +1 -1
  42. package/dist/drawer/Drawer.svelte.d.ts +1 -1
  43. package/dist/drawer/Drawerhead.svelte +1 -1
  44. package/dist/drawer/Drawerhead.svelte.d.ts +1 -1
  45. package/dist/dropdown/Dropdown.svelte +1 -1
  46. package/dist/dropdown/Dropdown.svelte.d.ts +1 -1
  47. package/dist/dropdown/DropdownDivider.svelte +1 -1
  48. package/dist/dropdown/DropdownDivider.svelte.d.ts +1 -1
  49. package/dist/dropdown/DropdownGroup.svelte +1 -1
  50. package/dist/dropdown/DropdownGroup.svelte.d.ts +1 -1
  51. package/dist/dropdown/DropdownHeader.svelte +1 -1
  52. package/dist/dropdown/DropdownHeader.svelte.d.ts +1 -1
  53. package/dist/dropdown/DropdownItem.svelte +1 -1
  54. package/dist/dropdown/DropdownItem.svelte.d.ts +1 -1
  55. package/dist/footer/Footer.svelte +1 -1
  56. package/dist/footer/Footer.svelte.d.ts +1 -1
  57. package/dist/footer/FooterBrand.svelte +1 -1
  58. package/dist/footer/FooterBrand.svelte.d.ts +1 -1
  59. package/dist/footer/FooterCopyright.svelte +1 -1
  60. package/dist/footer/FooterCopyright.svelte.d.ts +1 -1
  61. package/dist/footer/FooterIcon.svelte +1 -1
  62. package/dist/footer/FooterIcon.svelte.d.ts +1 -1
  63. package/dist/footer/FooterLink.svelte +1 -1
  64. package/dist/footer/FooterLink.svelte.d.ts +1 -1
  65. package/dist/footer/FooterLinkGroup.svelte +1 -1
  66. package/dist/footer/FooterLinkGroup.svelte.d.ts +1 -1
  67. package/dist/forms/checkbox/CheckboxButton.svelte +1 -1
  68. package/dist/forms/checkbox/CheckboxButton.svelte.d.ts +1 -1
  69. package/dist/forms/dropzone/Dropzone.svelte +1 -1
  70. package/dist/forms/dropzone/Dropzone.svelte.d.ts +1 -1
  71. package/dist/forms/fileupload/Fileupload.svelte +1 -1
  72. package/dist/forms/fileupload/Fileupload.svelte.d.ts +1 -1
  73. package/dist/forms/floating-label/FloatingLabelInput.svelte +1 -1
  74. package/dist/forms/floating-label/FloatingLabelInput.svelte.d.ts +1 -1
  75. package/dist/forms/helper/Helper.svelte +1 -1
  76. package/dist/forms/helper/Helper.svelte.d.ts +1 -1
  77. package/dist/forms/input-addon/InputAddon.svelte +1 -1
  78. package/dist/forms/input-addon/InputAddon.svelte.d.ts +1 -1
  79. package/dist/forms/label/Label.svelte +1 -1
  80. package/dist/forms/label/Label.svelte.d.ts +1 -1
  81. package/dist/forms/range/Range.svelte +1 -1
  82. package/dist/forms/range/Range.svelte.d.ts +1 -1
  83. package/dist/forms/search/Search.svelte +1 -1
  84. package/dist/forms/search/Search.svelte.d.ts +1 -1
  85. package/dist/forms/tags/Tags.svelte +1 -1
  86. package/dist/forms/tags/Tags.svelte.d.ts +1 -1
  87. package/dist/forms/textarea/Textarea.svelte +1 -1
  88. package/dist/forms/textarea/Textarea.svelte.d.ts +1 -1
  89. package/dist/forms/timepicker/Timepicker.svelte +1 -1
  90. package/dist/forms/timepicker/Timepicker.svelte.d.ts +1 -1
  91. package/dist/forms/toggle/Toggle.svelte +1 -1
  92. package/dist/forms/toggle/Toggle.svelte.d.ts +1 -1
  93. package/dist/gallery/Gallery.svelte +1 -1
  94. package/dist/gallery/Gallery.svelte.d.ts +1 -1
  95. package/dist/indicator/Indicator.svelte +1 -1
  96. package/dist/indicator/Indicator.svelte.d.ts +1 -1
  97. package/dist/kbd/Kbd.svelte +1 -1
  98. package/dist/kbd/Kbd.svelte.d.ts +1 -1
  99. package/dist/list-group/Listgroup.svelte +1 -1
  100. package/dist/list-group/Listgroup.svelte.d.ts +1 -1
  101. package/dist/list-group/ListgroupItem.svelte +1 -1
  102. package/dist/list-group/ListgroupItem.svelte.d.ts +1 -1
  103. package/dist/mega-menu/MegaMenu.svelte +1 -1
  104. package/dist/mega-menu/MegaMenu.svelte.d.ts +1 -1
  105. package/dist/modal/Modal.svelte +1 -1
  106. package/dist/modal/Modal.svelte.d.ts +1 -1
  107. package/dist/navbar/Menu.svelte +1 -1
  108. package/dist/navbar/Menu.svelte.d.ts +1 -1
  109. package/dist/navbar/NavBrand.svelte +1 -1
  110. package/dist/navbar/NavBrand.svelte.d.ts +2 -3
  111. package/dist/navbar/NavContainer.svelte +1 -1
  112. package/dist/navbar/NavContainer.svelte.d.ts +1 -1
  113. package/dist/navbar/NavHamburger.svelte +1 -1
  114. package/dist/navbar/NavHamburger.svelte.d.ts +1 -1
  115. package/dist/navbar/NavLi.svelte +1 -1
  116. package/dist/navbar/NavLi.svelte.d.ts +1 -1
  117. package/dist/navbar/NavUl.svelte +1 -1
  118. package/dist/navbar/NavUl.svelte.d.ts +1 -1
  119. package/dist/navbar/Navbar.svelte +1 -1
  120. package/dist/navbar/Navbar.svelte.d.ts +1 -1
  121. package/dist/pagination/Pagination.svelte +1 -1
  122. package/dist/pagination/Pagination.svelte.d.ts +1 -1
  123. package/dist/pagination/PaginationButton.svelte +1 -1
  124. package/dist/pagination/PaginationButton.svelte.d.ts +1 -1
  125. package/dist/pagination/PaginationItem.svelte +1 -1
  126. package/dist/pagination/PaginationItem.svelte.d.ts +1 -1
  127. package/dist/pagination/PaginationNav.svelte +1 -1
  128. package/dist/pagination/PaginationNav.svelte.d.ts +1 -1
  129. package/dist/popover/Popover.svelte +1 -1
  130. package/dist/popover/Popover.svelte.d.ts +1 -1
  131. package/dist/progress/Progressbar.svelte +1 -1
  132. package/dist/progress/Progressbar.svelte.d.ts +1 -1
  133. package/dist/progress/Progressradial.svelte +1 -1
  134. package/dist/progress/Progressradial.svelte.d.ts +1 -1
  135. package/dist/rating/AdvancedRating.svelte +1 -1
  136. package/dist/rating/AdvancedRating.svelte.d.ts +1 -1
  137. package/dist/rating/CustomIcon.svelte +1 -1
  138. package/dist/rating/CustomIcon.svelte.d.ts +1 -1
  139. package/dist/rating/Heart.svelte +1 -1
  140. package/dist/rating/Heart.svelte.d.ts +1 -1
  141. package/dist/rating/Rating.svelte +1 -1
  142. package/dist/rating/Rating.svelte.d.ts +1 -1
  143. package/dist/rating/RatingComment.svelte +1 -1
  144. package/dist/rating/RatingComment.svelte.d.ts +1 -1
  145. package/dist/rating/Review.svelte +1 -1
  146. package/dist/rating/Review.svelte.d.ts +1 -1
  147. package/dist/rating/ScoreRating.svelte +1 -1
  148. package/dist/rating/ScoreRating.svelte.d.ts +1 -1
  149. package/dist/rating/Star.svelte +1 -1
  150. package/dist/rating/Star.svelte.d.ts +1 -1
  151. package/dist/rating/Thumbup.svelte +1 -1
  152. package/dist/rating/Thumbup.svelte.d.ts +1 -1
  153. package/dist/sidebar/Sidebar.svelte +1 -1
  154. package/dist/sidebar/Sidebar.svelte.d.ts +1 -1
  155. package/dist/sidebar/SidebarBrand.svelte +1 -1
  156. package/dist/sidebar/SidebarBrand.svelte.d.ts +1 -1
  157. package/dist/sidebar/SidebarButton.svelte +1 -1
  158. package/dist/sidebar/SidebarButton.svelte.d.ts +1 -1
  159. package/dist/sidebar/SidebarCta.svelte +1 -1
  160. package/dist/sidebar/SidebarCta.svelte.d.ts +1 -1
  161. package/dist/sidebar/SidebarDropdownWrapper.svelte +1 -1
  162. package/dist/sidebar/SidebarDropdownWrapper.svelte.d.ts +1 -1
  163. package/dist/sidebar/SidebarGroup.svelte +1 -1
  164. package/dist/sidebar/SidebarGroup.svelte.d.ts +1 -1
  165. package/dist/sidebar/SidebarItem.svelte +1 -1
  166. package/dist/sidebar/SidebarItem.svelte.d.ts +1 -1
  167. package/dist/skeleton/CardPlaceholder.svelte +1 -1
  168. package/dist/skeleton/CardPlaceholder.svelte.d.ts +1 -1
  169. package/dist/skeleton/ImagePlaceholder.svelte +1 -1
  170. package/dist/skeleton/ImagePlaceholder.svelte.d.ts +1 -1
  171. package/dist/skeleton/ListPlaceholder.svelte +1 -1
  172. package/dist/skeleton/ListPlaceholder.svelte.d.ts +1 -1
  173. package/dist/skeleton/Skeleton.svelte +1 -1
  174. package/dist/skeleton/Skeleton.svelte.d.ts +1 -1
  175. package/dist/skeleton/TestimonialPlaceholder.svelte +1 -1
  176. package/dist/skeleton/TestimonialPlaceholder.svelte.d.ts +1 -1
  177. package/dist/skeleton/TextPlaceholder.svelte +1 -1
  178. package/dist/skeleton/TextPlaceholder.svelte.d.ts +1 -1
  179. package/dist/skeleton/VideoPlaceholder.svelte +1 -1
  180. package/dist/skeleton/VideoPlaceholder.svelte.d.ts +1 -1
  181. package/dist/skeleton/WidgetPlaceholder.svelte +1 -1
  182. package/dist/skeleton/WidgetPlaceholder.svelte.d.ts +1 -1
  183. package/dist/speed-dial/SpeedDial.svelte +1 -1
  184. package/dist/speed-dial/SpeedDial.svelte.d.ts +1 -1
  185. package/dist/speed-dial/SpeedDialButton.svelte +1 -1
  186. package/dist/speed-dial/SpeedDialButton.svelte.d.ts +1 -1
  187. package/dist/speed-dial/SpeedDialTrigger.svelte +1 -1
  188. package/dist/speed-dial/SpeedDialTrigger.svelte.d.ts +1 -1
  189. package/dist/spinner/Spinner.svelte +1 -1
  190. package/dist/spinner/Spinner.svelte.d.ts +1 -1
  191. package/dist/stepindicator/StepIndicator.svelte +1 -1
  192. package/dist/stepindicator/StepIndicator.svelte.d.ts +1 -1
  193. package/dist/stepper/BreadcrumbStepper.svelte +1 -1
  194. package/dist/stepper/BreadcrumbStepper.svelte.d.ts +1 -1
  195. package/dist/stepper/DetailedStepper.svelte +1 -1
  196. package/dist/stepper/DetailedStepper.svelte.d.ts +1 -1
  197. package/dist/stepper/ProgressStepper.svelte +1 -1
  198. package/dist/stepper/ProgressStepper.svelte.d.ts +1 -1
  199. package/dist/stepper/Stepper.svelte +1 -1
  200. package/dist/stepper/Stepper.svelte.d.ts +1 -1
  201. package/dist/stepper/TimelineStepper.svelte +1 -1
  202. package/dist/stepper/TimelineStepper.svelte.d.ts +1 -1
  203. package/dist/stepper/VerticalStepper.svelte +1 -1
  204. package/dist/stepper/VerticalStepper.svelte.d.ts +1 -1
  205. package/dist/table/Table.svelte +1 -1
  206. package/dist/table/Table.svelte.d.ts +1 -1
  207. package/dist/table/TableBody.svelte +1 -1
  208. package/dist/table/TableBody.svelte.d.ts +1 -1
  209. package/dist/table/TableBodyCell.svelte +1 -1
  210. package/dist/table/TableBodyCell.svelte.d.ts +1 -1
  211. package/dist/table/TableBodyRow.svelte +1 -1
  212. package/dist/table/TableBodyRow.svelte.d.ts +1 -1
  213. package/dist/table/TableHead.svelte +1 -1
  214. package/dist/table/TableHead.svelte.d.ts +1 -1
  215. package/dist/table/TableHeadCell.svelte +1 -1
  216. package/dist/table/TableHeadCell.svelte.d.ts +1 -1
  217. package/dist/table/TableSearch.svelte +1 -1
  218. package/dist/table/TableSearch.svelte.d.ts +1 -1
  219. package/dist/tabs/TabItem.svelte +1 -1
  220. package/dist/tabs/TabItem.svelte.d.ts +1 -1
  221. package/dist/tabs/Tabs.svelte +1 -1
  222. package/dist/tabs/Tabs.svelte.d.ts +1 -1
  223. package/dist/timeline/Activity.svelte +1 -1
  224. package/dist/timeline/Activity.svelte.d.ts +1 -1
  225. package/dist/timeline/ActivityItem.svelte +1 -1
  226. package/dist/timeline/ActivityItem.svelte.d.ts +1 -1
  227. package/dist/timeline/Group.svelte +1 -1
  228. package/dist/timeline/Group.svelte.d.ts +1 -1
  229. package/dist/timeline/GroupItem.svelte +1 -1
  230. package/dist/timeline/GroupItem.svelte.d.ts +1 -1
  231. package/dist/timeline/Timeline.svelte +1 -1
  232. package/dist/timeline/Timeline.svelte.d.ts +1 -1
  233. package/dist/timeline/TimelineItem.svelte +1 -1
  234. package/dist/timeline/TimelineItem.svelte.d.ts +1 -1
  235. package/dist/toast/Toast.svelte +1 -1
  236. package/dist/toast/Toast.svelte.d.ts +1 -1
  237. package/dist/toolbar/Toolbar.svelte +1 -1
  238. package/dist/toolbar/Toolbar.svelte.d.ts +1 -1
  239. package/dist/toolbar/ToolbarButton.svelte +1 -1
  240. package/dist/toolbar/ToolbarButton.svelte.d.ts +1 -1
  241. package/dist/toolbar/ToolbarGroup.svelte +1 -1
  242. package/dist/toolbar/ToolbarGroup.svelte.d.ts +1 -1
  243. package/dist/tooltip/Tooltip.svelte +1 -1
  244. package/dist/tooltip/Tooltip.svelte.d.ts +1 -1
  245. package/dist/types.d.ts +10 -12
  246. package/dist/typography/anchor/A.svelte +1 -1
  247. package/dist/typography/anchor/A.svelte.d.ts +1 -1
  248. package/dist/typography/blockquote/Blockquote.svelte +1 -1
  249. package/dist/typography/blockquote/Blockquote.svelte.d.ts +1 -1
  250. package/dist/typography/descriptionlist/DescriptionList.svelte +1 -1
  251. package/dist/typography/descriptionlist/DescriptionList.svelte.d.ts +1 -1
  252. package/dist/typography/heading/Heading.svelte +1 -1
  253. package/dist/typography/heading/Heading.svelte.d.ts +1 -1
  254. package/dist/typography/hr/Hr.svelte +1 -1
  255. package/dist/typography/hr/Hr.svelte.d.ts +1 -1
  256. package/dist/typography/img/EnhancedImg.svelte +1 -1
  257. package/dist/typography/img/EnhancedImg.svelte.d.ts +1 -1
  258. package/dist/typography/img/Img.svelte +1 -1
  259. package/dist/typography/img/Img.svelte.d.ts +1 -1
  260. package/dist/typography/layout/Layout.svelte +1 -1
  261. package/dist/typography/layout/Layout.svelte.d.ts +1 -1
  262. package/dist/typography/list/Li.svelte +1 -1
  263. package/dist/typography/list/Li.svelte.d.ts +1 -1
  264. package/dist/typography/list/List.svelte +1 -1
  265. package/dist/typography/list/List.svelte.d.ts +1 -1
  266. package/dist/typography/mark/Mark.svelte +1 -1
  267. package/dist/typography/mark/Mark.svelte.d.ts +1 -1
  268. package/dist/typography/paragraph/P.svelte +1 -1
  269. package/dist/typography/paragraph/P.svelte.d.ts +1 -1
  270. package/dist/typography/secondary/Secondary.svelte +1 -1
  271. package/dist/typography/secondary/Secondary.svelte.d.ts +1 -1
  272. package/dist/typography/span/Span.svelte +1 -1
  273. package/dist/typography/span/Span.svelte.d.ts +1 -1
  274. package/dist/utils/Arrow.svelte +1 -1
  275. package/dist/utils/Arrow.svelte.d.ts +1 -1
  276. package/dist/utils/Popper.svelte +1 -1
  277. package/dist/utils/Popper.svelte.d.ts +1 -1
  278. package/dist/video/Video.svelte +1 -1
  279. package/dist/video/Video.svelte.d.ts +1 -1
  280. package/package.json +1 -1
@@ -1,6 +1,6 @@
1
1
  <script lang="ts">
2
- import { type CarouselProps, type State, Slide } from "..";
3
- import { getTheme } from "../theme/themeUtils";
2
+ import { type CarouselProps, type CarouselState, Slide } from "..";
3
+ import { getTheme, warnThemeDeprecation } from "../theme/themeUtils";
4
4
  import clsx from "clsx";
5
5
  import { onMount, setContext } from "svelte";
6
6
  import { canChangeSlide } from "./CarouselSlide";
@@ -8,19 +8,44 @@
8
8
 
9
9
  const SLIDE_DURATION_RATIO = 0.25;
10
10
 
11
- 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();
11
+ 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();
12
12
 
13
+ warnThemeDeprecation("Carousel", { imgClass }, { imgClass: "slide" });
14
+
15
+ const styling = $derived(classes ?? { slide: imgClass });
16
+
17
+ // // Theme context
13
18
  const theme = getTheme("carousel");
14
19
 
15
- const _state: State = $state({ images, index: index ?? 0, forward: true, slideDuration, lastSlideChange: new Date() });
20
+ let { base, slide: slideCls } = $derived(carousel());
21
+
22
+ const changeSlide = (n: number) => {
23
+ if (images.length === 0) return;
24
+
25
+ if (n % images.length === _state.index) return;
26
+
27
+ if (!canChangeSlide({ lastSlideChange: _state.lastSlideChange, slideDuration: _state.slideDuration, slideDurationRatio: SLIDE_DURATION_RATIO })) return;
28
+
29
+ _state.forward = n >= _state.index;
30
+ _state.index = (images.length + n) % images.length;
31
+ _state.lastSlideChange = Date.now();
32
+
33
+ index = _state.index; // Update the bindable index
34
+ onchange?.(images[_state.index]);
35
+ };
36
+
37
+ const _state: CarouselState = $state({ images, index: index ?? 0, forward: true, slideDuration, lastSlideChange: Date.now(), changeSlide });
16
38
 
17
39
  setContext("state", _state);
18
40
 
19
41
  let initialized = false;
20
42
 
21
43
  $effect(() => {
22
- index = _state.index;
23
- onchange?.(images[index]);
44
+ changeSlide(index);
45
+ });
46
+
47
+ $effect(() => {
48
+ _state.slideDuration = slideDuration;
24
49
  });
25
50
 
26
51
  onMount(() => {
@@ -28,25 +53,8 @@
28
53
  initialized = true;
29
54
  });
30
55
 
31
- const nextSlide = () => {
32
- if (!canChangeSlide({ lastSlideChange: _state.lastSlideChange, slideDuration, slideDurationRatio: SLIDE_DURATION_RATIO })) return _state;
33
-
34
- _state.forward = true;
35
- _state.index = _state.index >= images.length - 1 ? 0 : _state.index + 1;
36
- _state.lastSlideChange = new Date();
37
-
38
- return _state;
39
- };
40
-
41
- const prevSlide = () => {
42
- if (!canChangeSlide({ lastSlideChange: _state.lastSlideChange, slideDuration, slideDurationRatio: SLIDE_DURATION_RATIO })) return _state;
43
-
44
- _state.forward = false;
45
- _state.index = _state.index <= 0 ? images.length - 1 : _state.index - 1;
46
- _state.lastSlideChange = new Date();
47
-
48
- return _state;
49
- };
56
+ const nextSlide = () => changeSlide(_state.index + 1);
57
+ const prevSlide = () => changeSlide(_state.index - 1);
50
58
 
51
59
  const loop = (node: HTMLElement) => {
52
60
  // loop timer
@@ -79,7 +87,7 @@
79
87
 
80
88
  const getPositionFromEvent = (evt: MouseEvent | TouchEvent) => {
81
89
  const mousePos = (evt as MouseEvent)?.clientX;
82
- if (mousePos) return mousePos;
90
+ if (mousePos !== undefined) return mousePos;
83
91
 
84
92
  let touchEvt = evt as TouchEvent;
85
93
  if (/^touch/.test(touchEvt?.type)) {
@@ -164,36 +172,36 @@
164
172
 
165
173
  <!-- The move listeners go here, so things keep working if the touch strays out of the element. -->
166
174
  <svelte:document onmousemove={onDragMove} onmouseup={onDragStop} ontouchmove={onDragMove} ontouchend={onDragStop} />
167
- <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">
168
- <div {...restProps} class={carousel({ class: clsx(activeDragGesture === undefined ? "transition-transform" : "", theme, className) })} {@attach loop}>
169
- {#if slide}
170
- {@render slide({ index, Slide })}
171
- {:else}
172
- <Slide image={images[index]} class={clsx(imgClass)} {transition} />
173
- {/if}
174
- </div>
175
- {@render children?.(index)}
175
+ <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}>
176
+ {#if slide}
177
+ {@render slide({ index: _state.index, Slide })}
178
+ {:else}
179
+ <Slide image={images[_state.index]} fit={slideFit} class={slideCls({ class: clsx(theme?.slide, styling.slide) })} {transition} />
180
+ {/if}
181
+
182
+ {@render children?.(_state.index)}
176
183
  </div>
177
184
 
178
185
  <!--
179
186
  @component
180
187
  [Go to docs](https://flowbite-svelte.com/)
181
188
  ## Type
182
- [CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L372)
189
+ [CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L373)
183
190
  ## Props
184
191
  @prop children
185
192
  @prop slide
186
193
  @prop images
187
194
  @prop index = $bindable(0)
188
195
  @prop slideDuration = 1000
196
+ @prop slideFit
189
197
  @prop transition
190
198
  @prop duration = 0
191
199
  @prop "aria-label": ariaLabel = "Draggable Carousel"
192
200
  @prop disableSwipe = false
193
201
  @prop imgClass = ""
194
202
  @prop class: className
203
+ @prop classes
195
204
  @prop onchange
196
- @prop divClass
197
205
  @prop isPreload = false
198
206
  @prop ...restProps
199
207
  -->
@@ -2,21 +2,22 @@ import { type CarouselProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L372)
5
+ * [CarouselProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L373)
6
6
  * ## Props
7
7
  * @prop children
8
8
  * @prop slide
9
9
  * @prop images
10
10
  * @prop index = $bindable(0)
11
11
  * @prop slideDuration = 1000
12
+ * @prop slideFit
12
13
  * @prop transition
13
14
  * @prop duration = 0
14
15
  * @prop "aria-label": ariaLabel = "Draggable Carousel"
15
16
  * @prop disableSwipe = false
16
17
  * @prop imgClass = ""
17
18
  * @prop class: className
19
+ * @prop classes
18
20
  * @prop onchange
19
- * @prop divClass
20
21
  * @prop isPreload = false
21
22
  * @prop ...restProps
22
23
  */
@@ -1,5 +1,5 @@
1
1
  <script lang="ts">
2
- import { Indicator, type IndicatorsProps, type State } from "..";
2
+ import { Indicator, type IndicatorsProps, type CarouselState } from "..";
3
3
  import { getTheme } from "../theme/themeUtils";
4
4
  import clsx from "clsx";
5
5
  import { getContext } from "svelte";
@@ -9,21 +9,18 @@
9
9
 
10
10
  const theme = getTheme("carouselIndicators");
11
11
 
12
- const _state = getContext<State>("state");
12
+ const _state = getContext<CarouselState>("state");
13
13
  const { base, indicator } = $derived(carouselIndicators({ position }));
14
14
 
15
15
  function goToIndex(newIndex: number) {
16
- const currentIndex = _state.index;
17
- _state.index = newIndex;
18
- _state.forward = newIndex >= currentIndex;
19
- _state.lastSlideChange = new Date();
16
+ _state.changeSlide(newIndex);
20
17
  }
21
18
  </script>
22
19
 
23
20
  <div class={base({ class: clsx(theme?.base, className) })} {...restProps}>
24
21
  {#each _state.images as _, idx}
25
22
  {@const selected = _state.index === idx}
26
- <button onclick={() => goToIndex(idx)}>
23
+ <button type="button" onclick={() => goToIndex(idx)} aria-current={selected ? "true" : undefined} aria-label={`Go to slide ${idx + 1}`}>
27
24
  {#if children}
28
25
  {@render children({ selected, index: idx })}
29
26
  {:else}
@@ -37,7 +34,7 @@
37
34
  @component
38
35
  [Go to docs](https://flowbite-svelte.com/)
39
36
  ## Type
40
- [IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L387)
37
+ [IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L388)
41
38
  ## Props
42
39
  @prop children
43
40
  @prop activeClass
@@ -2,7 +2,7 @@ import { type IndicatorsProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L387)
5
+ * [IndicatorsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L388)
6
6
  * ## Props
7
7
  * @prop children
8
8
  * @prop activeClass
@@ -1,5 +1,5 @@
1
1
  export declare const canChangeSlide: ({ lastSlideChange, slideDuration, slideDurationRatio }: {
2
- lastSlideChange: Date;
2
+ lastSlideChange: number;
3
3
  slideDuration: number;
4
4
  slideDurationRatio?: number;
5
5
  }) => boolean;
@@ -1,5 +1,5 @@
1
1
  export const canChangeSlide = ({ lastSlideChange, slideDuration, slideDurationRatio = 1 }) => {
2
- if (lastSlideChange && new Date().getTime() - lastSlideChange.getTime() < slideDuration * slideDurationRatio) {
2
+ if (lastSlideChange && Date.now() - lastSlideChange < slideDuration * slideDurationRatio) {
3
3
  console.warn("Can't change slide yet, too soon");
4
4
  return false;
5
5
  }
@@ -36,7 +36,7 @@
36
36
  @component
37
37
  [Go to docs](https://flowbite-svelte.com/)
38
38
  ## Type
39
- [ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L394)
39
+ [ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L395)
40
40
  ## Props
41
41
  @prop children
42
42
  @prop forward
@@ -2,7 +2,7 @@ import { type ControlButtonProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L394)
5
+ * [ControlButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L395)
6
6
  * ## Props
7
7
  * @prop children
8
8
  * @prop forward
@@ -1,31 +1,17 @@
1
1
  <script lang="ts">
2
- import { type ControlsProps, type State, ControlButton } from "..";
2
+ import { type ControlsProps, type CarouselState, ControlButton } from "..";
3
3
  import { getTheme } from "../theme/themeUtils";
4
4
  import clsx from "clsx";
5
5
  import { getContext } from "svelte";
6
- import { canChangeSlide } from "./CarouselSlide";
7
6
 
8
7
  let { children, class: className, ...restProps }: ControlsProps = $props();
9
8
 
10
9
  const theme = getTheme("controlButton");
11
10
 
12
- const _state = getContext<State>("state");
11
+ const _state = getContext<CarouselState>("state");
13
12
 
14
13
  function changeSlide(forward: boolean) {
15
- const { lastSlideChange, slideDuration } = _state;
16
- if (!canChangeSlide({ lastSlideChange, slideDuration, slideDurationRatio: 0.75 })) {
17
- return;
18
- }
19
-
20
- if (forward) {
21
- _state.forward = true;
22
- _state.index = _state.index >= _state.images.length - 1 ? 0 : _state.index + 1;
23
- } else {
24
- _state.forward = false;
25
- _state.index = _state.index <= 0 ? _state.images.length - 1 : _state.index - 1;
26
- }
27
- _state.lastSlideChange = new Date();
28
- return _state;
14
+ _state.changeSlide(forward ? _state.index + 1 : _state.index - 1);
29
15
  }
30
16
  </script>
31
17
 
@@ -41,7 +27,7 @@
41
27
  @component
42
28
  [Go to docs](https://flowbite-svelte.com/)
43
29
  ## Type
44
- [ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L400)
30
+ [ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L401)
45
31
  ## Props
46
32
  @prop children
47
33
  @prop class: className
@@ -2,7 +2,7 @@ import { type ControlsProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L400)
5
+ * [ControlsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L401)
6
6
  * ## Props
7
7
  * @prop children
8
8
  * @prop class: className
@@ -1,14 +1,14 @@
1
1
  <script lang="ts">
2
- import { type SlideProps, type State } from "..";
2
+ import { type SlideProps, type CarouselState } from "..";
3
3
  import { getTheme } from "../theme/themeUtils";
4
4
  import clsx from "clsx";
5
5
  import { getContext } from "svelte";
6
6
  import { fly } from "svelte/transition";
7
7
  import { slide } from "./theme";
8
8
 
9
- const _state = getContext<State>("state");
9
+ const _state = getContext<CarouselState>("state");
10
10
 
11
- let { image, transition, class: className, ...restProps }: SlideProps = $props();
11
+ let { image, transition, fit, class: className, ...restProps }: SlideProps = $props();
12
12
 
13
13
  const theme = getTheme("slide");
14
14
 
@@ -28,7 +28,7 @@
28
28
  duration: _state.slideDuration
29
29
  });
30
30
 
31
- let imgClass = slide({ class: clsx(theme, className) });
31
+ let imgClass = $derived(slide({ fit, class: clsx(theme, className) }));
32
32
  </script>
33
33
 
34
34
  {#if transition}
@@ -45,10 +45,11 @@
45
45
  @component
46
46
  [Go to docs](https://flowbite-svelte.com/)
47
47
  ## Type
48
- [SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L417)
48
+ [SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L418)
49
49
  ## Props
50
50
  @prop image
51
51
  @prop transition
52
+ @prop fit
52
53
  @prop class: className
53
54
  @prop ...restProps
54
55
  -->
@@ -2,10 +2,11 @@ import { type SlideProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L417)
5
+ * [SlideProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L418)
6
6
  * ## Props
7
7
  * @prop image
8
8
  * @prop transition
9
+ * @prop fit
9
10
  * @prop class: className
10
11
  * @prop ...restProps
11
12
  */
@@ -15,7 +15,7 @@
15
15
  @component
16
16
  [Go to docs](https://flowbite-svelte.com/)
17
17
  ## Type
18
- [ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L404)
18
+ [ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L405)
19
19
  ## Props
20
20
  @prop selected
21
21
  @prop class: className
@@ -2,7 +2,7 @@ import { type ThumbnailProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L404)
5
+ * [ThumbnailProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L405)
6
6
  * ## Props
7
7
  * @prop selected
8
8
  * @prop class: className
@@ -1,52 +1,38 @@
1
1
  <script lang="ts">
2
- import { type State, Thumbnail, type ThumbnailsProps } from "..";
2
+ import { Thumbnail, type ThumbnailsProps } from "..";
3
3
  import { getTheme } from "../theme/themeUtils";
4
4
  import clsx from "clsx";
5
- import { getContext } from "svelte";
6
5
  import { thumbnails } from "./theme";
7
6
 
8
7
  let { children, images = [], index = $bindable(), ariaLabel = "Click to view image", imgClass, throttleDelay = 650, class: className }: ThumbnailsProps = $props();
9
8
 
10
9
  const theme = getTheme("thumbnails");
11
10
 
12
- const _state = getContext<State>("state");
13
- if (!_state) {
14
- console.error("State is undefined. Make sure to provide state context or pass it as a prop.");
15
- }
16
-
17
- let lastClickedAt = new Date();
11
+ // Initialize so the first click is never throttled
12
+ let lastClickedAt = -Infinity;
18
13
 
19
14
  const btnClick = (newIndex: number) => {
20
- if (new Date().getTime() - lastClickedAt.getTime() < throttleDelay) {
15
+ const now = Date.now();
16
+ if (now - lastClickedAt < throttleDelay) {
21
17
  console.warn("Thumbnail action throttled");
22
18
  return;
23
19
  }
24
- if (_state) {
25
- const currentIndex = _state.index;
26
-
27
- _state.index = newIndex;
28
- _state.forward = newIndex >= currentIndex;
29
- _state.lastSlideChange = new Date();
30
20
 
31
- // Update the bound index
32
- index = newIndex;
33
- } else {
34
- // Fallback behavior if state is not available
35
- index = newIndex;
36
- lastClickedAt = new Date();
37
- console.warn("State update skipped - no valid state available");
38
- }
21
+ lastClickedAt = now;
22
+ index = newIndex;
39
23
  };
40
24
 
41
25
  $effect(() => {
42
- index = (index + images.length) % images.length;
26
+ if (images.length > 0) {
27
+ index = (index + images.length) % images.length;
28
+ }
43
29
  });
44
30
  </script>
45
31
 
46
32
  <div class={thumbnails({ class: clsx(theme, className) })}>
47
33
  {#each images as image, idx}
48
34
  {@const selected = index === idx}
49
- <button onclick={() => btnClick(idx)} aria-label={ariaLabel}>
35
+ <button onclick={() => btnClick(idx)} aria-label={ariaLabel} aria-current={selected ? "true" : undefined}>
50
36
  {#if children}
51
37
  {@render children({ image, selected, imgClass: clsx(imgClass), Thumbnail })}
52
38
  {:else}
@@ -60,7 +46,7 @@
60
46
  @component
61
47
  [Go to docs](https://flowbite-svelte.com/)
62
48
  ## Type
63
- [ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L408)
49
+ [ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L409)
64
50
  ## Props
65
51
  @prop children
66
52
  @prop images = []
@@ -2,7 +2,7 @@ import { type ThumbnailsProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L408)
5
+ * [ThumbnailsProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L409)
6
6
  * ## Props
7
7
  * @prop children
8
8
  * @prop images = []
@@ -1,6 +1,16 @@
1
+ import type { Classes } from "../theme/themeUtils";
1
2
  import { type VariantProps } from "tailwind-variants";
2
- export type CarouselVariants = VariantProps<typeof carousel>;
3
- 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>>;
3
+ export type CarouselVariants = VariantProps<typeof carousel> & Classes<typeof carousel>;
4
+ export declare const carousel: import("tailwind-variants").TVReturnType<{}, {
5
+ base: string;
6
+ slide: string;
7
+ }, undefined, {}, {
8
+ base: string;
9
+ slide: string;
10
+ }, import("tailwind-variants").TVReturnType<{}, {
11
+ base: string;
12
+ slide: string;
13
+ }, undefined, unknown, unknown, undefined>>;
4
14
  export declare const carouselIndicators: import("tailwind-variants").TVReturnType<{
5
15
  selected: {
6
16
  true: {
@@ -17,9 +27,6 @@ export declare const carouselIndicators: import("tailwind-variants").TVReturnTyp
17
27
  bottom: {
18
28
  base: string;
19
29
  };
20
- withThumbnails: {
21
- base: string;
22
- };
23
30
  };
24
31
  }, {
25
32
  base: string;
@@ -40,9 +47,6 @@ export declare const carouselIndicators: import("tailwind-variants").TVReturnTyp
40
47
  bottom: {
41
48
  base: string;
42
49
  };
43
- withThumbnails: {
44
- base: string;
45
- };
46
50
  };
47
51
  }, {
48
52
  base: string;
@@ -63,9 +67,6 @@ export declare const carouselIndicators: import("tailwind-variants").TVReturnTyp
63
67
  bottom: {
64
68
  base: string;
65
69
  };
66
- withThumbnails: {
67
- base: string;
68
- };
69
70
  };
70
71
  }, {
71
72
  base: string;
@@ -113,4 +114,29 @@ export declare const thumbnail: import("tailwind-variants").TVReturnType<{
113
114
  false: string;
114
115
  };
115
116
  }, undefined, "", unknown, unknown, undefined>>;
116
- 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>>;
117
+ export type SlideVariants = VariantProps<typeof slide>;
118
+ export declare const slide: import("tailwind-variants").TVReturnType<{
119
+ fit: {
120
+ contain: string;
121
+ cover: string;
122
+ fill: string;
123
+ none: string;
124
+ "scale-down": string;
125
+ };
126
+ }, undefined, "absolute block w-full h-full", {
127
+ fit: {
128
+ contain: string;
129
+ cover: string;
130
+ fill: string;
131
+ none: string;
132
+ "scale-down": string;
133
+ };
134
+ }, undefined, import("tailwind-variants").TVReturnType<{
135
+ fit: {
136
+ contain: string;
137
+ cover: string;
138
+ fill: string;
139
+ none: string;
140
+ "scale-down": string;
141
+ };
142
+ }, undefined, "absolute block w-full h-full", unknown, unknown, undefined>>;
@@ -1,6 +1,9 @@
1
1
  import { tv } from "tailwind-variants";
2
2
  export const carousel = tv({
3
- base: "grid overflow-hidden relative rounded-lg h-56 sm:h-64 xl:h-80 2xl:h-96",
3
+ slots: {
4
+ base: "grid overflow-hidden relative rounded-lg h-56 sm:h-64 xl:h-80 2xl:h-96",
5
+ slide: ""
6
+ },
4
7
  variants: {},
5
8
  compoundVariants: [],
6
9
  defaultVariants: {}
@@ -17,8 +20,7 @@ export const carouselIndicators = tv({
17
20
  },
18
21
  position: {
19
22
  top: { base: "top-5" },
20
- bottom: { base: "bottom-5" },
21
- withThumbnails: { base: "bottom-24" }
23
+ bottom: { base: "bottom-5" }
22
24
  }
23
25
  }
24
26
  });
@@ -50,5 +52,17 @@ export const thumbnail = tv({
50
52
  }
51
53
  });
52
54
  export const slide = tv({
53
- base: "absolute block w-full! h-full object-cover"
55
+ base: "absolute block w-full h-full",
56
+ variants: {
57
+ fit: {
58
+ contain: "object-contain",
59
+ cover: "object-cover",
60
+ fill: "object-fill",
61
+ none: "object-none",
62
+ "scale-down": "object-scale-down"
63
+ }
64
+ },
65
+ defaultVariants: {
66
+ fit: "cover"
67
+ }
54
68
  });
@@ -46,7 +46,7 @@
46
46
  @component
47
47
  [Go to docs](https://flowbite-svelte.com/)
48
48
  ## Type
49
- [ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L429)
49
+ [ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L430)
50
50
  ## Props
51
51
  @prop children
52
52
  @prop embedded = false
@@ -2,7 +2,7 @@ import { type ClipboardProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L429)
5
+ * [ClipboardProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L430)
6
6
  * ## Props
7
7
  * @prop children
8
8
  * @prop embedded = false
@@ -64,7 +64,7 @@
64
64
  @component
65
65
  [Go to docs](https://flowbite-svelte.com/)
66
66
  ## Type
67
- [DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L438)
67
+ [DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L439)
68
68
  ## Props
69
69
  @prop class: className
70
70
  @prop lightIcon
@@ -2,7 +2,7 @@ import { type DarkmodeProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L438)
5
+ * [DarkmodeProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L439)
6
6
  * ## Props
7
7
  * @prop class: className
8
8
  * @prop lightIcon
@@ -466,7 +466,7 @@
466
466
  @component
467
467
  [Go to docs](https://flowbite-svelte.com/)
468
468
  ## Type
469
- [DatepickerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L448)
469
+ [DatepickerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L449)
470
470
  ## Props
471
471
  @prop value = $bindable()
472
472
  @prop defaultDate = null
@@ -2,7 +2,7 @@ import { type DatepickerProps } from "..";
2
2
  /**
3
3
  * [Go to docs](https://flowbite-svelte.com/)
4
4
  * ## Type
5
- * [DatepickerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L448)
5
+ * [DatepickerProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L449)
6
6
  * ## Props
7
7
  * @prop value = $bindable()
8
8
  * @prop defaultDate = null
@@ -39,7 +39,7 @@
39
39
  @component
40
40
  [Go to docs](https://flowbite-svelte.com/)
41
41
  ## Type
42
- [AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L502)
42
+ [AndroidProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L503)
43
43
  ## Props
44
44
  @prop children
45
45
  @prop class: className