flowbite-svelte 1.11.2 → 1.11.4

package/dist/navbar/theme.js

@@ -13,37 +13,148 @@ export const navbarContainer = tv({
 });
 export const navbarUl = tv({
     slots: {
-        base: "w-full md:block md:w-auto",
-        ul: "flex flex-col p-4 mt-0 md:flex-row rtl:space-x-reverse md:text-sm md:font-medium",
-        active: "text-white bg-primary-700 md:bg-transparent md:text-primary-700 md:dark:text-white dark:bg-primary-600 md:dark:bg-transparent",
-        nonActive: "hover:text-primary-500 text-gray-700 hover:bg-gray-100 md:hover:bg-transparent md:border-0 md:hover:text-primary-700 dark:text-gray-400 dark:md:text-white md:dark:hover:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent"
+        base: "",
+        ul: "flex flex-col p-4 mt-0 rtl:space-x-reverse",
+        active: "text-white bg-primary-700 dark:bg-primary-600",
+        nonActive: "hover:text-primary-500 text-gray-700 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"
     },
     variants: {
+        breakpoint: {
+            sm: {
+                base: "w-full sm:block sm:w-auto",
+                ul: "sm:flex-row sm:text-sm sm:font-medium",
+                active: "sm:bg-transparent sm:text-primary-700 sm:dark:text-white sm:dark:bg-transparent",
+                nonActive: "sm:hover:bg-transparent sm:border-0 sm:hover:text-primary-700 dark:sm:text-gray-400 sm:dark:hover:text-white sm:dark:hover:bg-transparent"
+            },
+            md: {
+                base: "w-full md:block md:w-auto",
+                ul: "md:flex-row md:text-sm md:font-medium",
+                active: "md:bg-transparent md:text-primary-700 md:dark:text-white md:dark:bg-transparent",
+                nonActive: "md:hover:bg-transparent md:border-0 md:hover:text-primary-700 dark:md:text-gray-400 md:dark:hover:text-white md:dark:hover:bg-transparent"
+            },
+            lg: {
+                base: "w-full lg:block lg:w-auto",
+                ul: "lg:flex-row lg:text-sm lg:font-medium",
+                active: "lg:bg-transparent lg:text-primary-700 lg:dark:text-white lg:dark:bg-transparent",
+                nonActive: "lg:hover:bg-transparent lg:border-0 lg:hover:text-primary-700 dark:lg:text-gray-400 lg:dark:hover:text-white lg:dark:hover:bg-transparent"
+            },
+            xl: {
+                base: "w-full xl:block xl:w-auto",
+                ul: "xl:flex-row xl:text-sm xl:font-medium",
+                active: "xl:bg-transparent xl:text-primary-700 xl:dark:text-white xl:dark:bg-transparent",
+                nonActive: "xl:hover:bg-transparent xl:border-0 xl:hover:text-primary-700 dark:xl:text-gray-400 xl:dark:hover:text-white xl:dark:hover:bg-transparent"
+            }
+        },
         hidden: {
             false: {
-                // Add absolute positioning and overlay styles for mobile
-                base: "absolute top-full left-0 right-0 z-50 w-full md:block md:w-auto md:static md:z-auto",
-                ul: "border rounded-lg bg-white shadow-lg dark:bg-gray-800 dark:border-gray-700 text-gray-700 dark:text-gray-400 border-gray-100 dark:border-gray-700 divide-gray-100 dark:divide-gray-700 md:border-none md:rounded-none md:bg-inherit dark:md:bg-inherit md:shadow-none"
+                base: "absolute top-full left-0 right-0 z-50 w-full",
+                ul: "border rounded-lg bg-white shadow-lg dark:bg-gray-800 dark:border-gray-700 text-gray-700 dark:text-gray-400 border-gray-100 dark:border-gray-700 divide-gray-100 dark:divide-gray-700"
             },
             true: {
                 base: "hidden"
             }
         }
     },
-    defaultVariants: {}
+    compoundVariants: [
+        // Compound variants for breakpoint + hidden combinations
+        {
+            breakpoint: "sm",
+            hidden: false,
+            class: {
+                base: "sm:static sm:z-auto",
+                ul: "sm:border-none sm:rounded-none sm:bg-inherit dark:sm:bg-inherit sm:shadow-none"
+            }
+        },
+        {
+            breakpoint: "md",
+            hidden: false,
+            class: {
+                base: "md:static md:z-auto",
+                ul: "md:border-none md:rounded-none md:bg-inherit dark:md:bg-inherit md:shadow-none"
+            }
+        },
+        {
+            breakpoint: "lg",
+            hidden: false,
+            class: {
+                base: "lg:static lg:z-auto",
+                ul: "lg:border-none lg:rounded-none lg:bg-inherit dark:lg:bg-inherit lg:shadow-none"
+            }
+        },
+        {
+            breakpoint: "xl",
+            hidden: false,
+            class: {
+                base: "xl:static xl:z-auto",
+                ul: "xl:border-none xl:rounded-none xl:bg-inherit dark:xl:bg-inherit xl:shadow-none"
+            }
+        }
+    ],
+    defaultVariants: {
+        breakpoint: "md"
+    }
 });
 export const navbarLi = tv({
-    base: "block py-2 pe-4 ps-3 md:p-2 rounded-sm md:border-0",
+    base: "block py-2 pe-4 ps-3 rounded-sm",
     variants: {
+        breakpoint: {
+            sm: "sm:p-2 sm:border-0",
+            md: "md:p-2 md:border-0",
+            lg: "lg:p-2 lg:border-0",
+            xl: "xl:p-2 xl:border-0"
+        },
         hidden: {
-            false: "block py-2 pe-4 ps-3 md:p-2 rounded-sm text-gray-700 hover:bg-gray-100 md:hover:bg-transparent md:border-0 md:hover:text-primary-700 dark:text-gray-400 md:dark:hover:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent"
+            false: "text-gray-700 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white"
         }
     },
-    defaultVariants: {}
+    compoundVariants: [
+        {
+            breakpoint: "sm",
+            hidden: false,
+            class: "sm:hover:bg-transparent sm:hover:text-primary-700 sm:dark:hover:text-white sm:dark:hover:bg-transparent"
+        },
+        {
+            breakpoint: "md",
+            hidden: false,
+            class: "md:hover:bg-transparent md:hover:text-primary-700 md:dark:hover:text-white md:dark:hover:bg-transparent"
+        },
+        {
+            breakpoint: "lg",
+            hidden: false,
+            class: "lg:hover:bg-transparent lg:hover:text-primary-700 lg:dark:hover:text-white lg:dark:hover:bg-transparent"
+        },
+        {
+            breakpoint: "xl",
+            hidden: false,
+            class: "xl:hover:bg-transparent xl:hover:text-primary-700 xl:dark:hover:text-white xl:dark:hover:bg-transparent"
+        }
+    ],
+    defaultVariants: {
+        breakpoint: "md"
+    }
 });
 export const navbarHamburger = tv({
     slots: {
-        base: "ms-3 md:hidden",
+        base: "ms-3",
         menu: "h-6 w-6 shrink-0"
+    },
+    variants: {
+        breakpoint: {
+            sm: {
+                base: "sm:hidden"
+            },
+            md: {
+                base: "md:hidden"
+            },
+            lg: {
+                base: "lg:hidden"
+            },
+            xl: {
+                base: "xl:hidden"
+            }
+        }
+    },
+    defaultVariants: {
+        breakpoint: "md"
     }
 });

package/dist/pagination/Pagination.svelte

@@ -54,7 +54,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[PaginationProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1190)
+[PaginationProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1174)
 ## Props
 @prop pages = []
 @prop previous

package/dist/pagination/Pagination.svelte.d.ts

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

package/dist/pagination/PaginationButton.svelte

@@ -50,7 +50,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[PaginationButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1161)
+[PaginationButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1145)
 ## Props
 @prop children
 @prop size

package/dist/pagination/PaginationButton.svelte.d.ts

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

package/dist/pagination/PaginationItem.svelte

@@ -32,7 +32,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[PaginationItemProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1186)
+[PaginationItemProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1170)
 ## Props
 @prop children
 @prop size

package/dist/pagination/PaginationItem.svelte.d.ts

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

package/dist/pagination/PaginationNav.svelte

@@ -105,7 +105,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[PaginationNavProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1167)
+[PaginationNavProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1151)
 ## Props
 @prop currentPage = 1
 @prop totalPages = 1

package/dist/pagination/PaginationNav.svelte.d.ts

@@ -2,7 +2,7 @@ import { type PaginationNavProps } from "..";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [PaginationNavProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1167)
+ * [PaginationNavProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1151)
  * ## Props
  * @prop currentPage = 1
  * @prop totalPages = 1

package/dist/popover/Popover.svelte

@@ -33,7 +33,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[PopoverProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1200)
+[PopoverProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1184)
 ## Props
 @prop title: titleSlot
 @prop color = "default"

package/dist/popover/Popover.svelte.d.ts

@@ -2,7 +2,7 @@ import type { PopoverProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [PopoverProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1200)
+ * [PopoverProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1184)
  * ## Props
  * @prop title: titleSlot
  * @prop color = "default"

package/dist/progress/Progressbar.svelte

@@ -53,7 +53,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ProgressbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1210)
+[ProgressbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1194)
 ## Props
 @prop progress = "45"
 @prop precision = 0

package/dist/progress/Progressbar.svelte.d.ts

@@ -2,7 +2,7 @@ import type { ProgressbarProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ProgressbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1210)
+ * [ProgressbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1194)
  * ## Props
  * @prop progress = "45"
  * @prop precision = 0

package/dist/progress/Progressradial.svelte

@@ -65,7 +65,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ProgressradialProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1221)
+[ProgressradialProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1205)
 ## Props
 @prop progress = 45
 @prop radius = 42

package/dist/progress/Progressradial.svelte.d.ts

@@ -2,7 +2,7 @@ import type { ProgressradialProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ProgressradialProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1221)
+ * [ProgressradialProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1205)
  * ## Props
  * @prop progress = 45
  * @prop radius = 42

package/dist/rating/AdvancedRating.svelte

@@ -41,7 +41,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[AdvancedRatingProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1238)
+[AdvancedRatingProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1222)
 ## Props
 @prop rating
 @prop globalText

package/dist/rating/AdvancedRating.svelte.d.ts

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

package/dist/rating/CustomIcon.svelte

@@ -29,7 +29,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
 ## Props
 @prop fillPercent = 100
 @prop fillColor = "#00ff00"

package/dist/rating/CustomIcon.svelte.d.ts

@@ -2,7 +2,7 @@ import type { RatingIconProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+ * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
  * ## Props
  * @prop fillPercent = 100
  * @prop fillColor = "#00ff00"

package/dist/rating/Heart.svelte

@@ -28,7 +28,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
 ## Props
 @prop fillPercent = 100
 @prop fillColor = "#ff0000"

package/dist/rating/Heart.svelte.d.ts

@@ -2,7 +2,7 @@ import type { RatingIconProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+ * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
  * ## Props
  * @prop fillPercent = 100
  * @prop fillColor = "#ff0000"

package/dist/rating/Rating.svelte

@@ -47,7 +47,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[RatingProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1250)
+[RatingProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1234)
 ## Props
 @prop children
 @prop text

package/dist/rating/Rating.svelte.d.ts

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

package/dist/rating/RatingComment.svelte

@@ -63,7 +63,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[RatingCommentProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1261)
+[RatingCommentProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1245)
 ## Props
 @prop children
 @prop evaluation

package/dist/rating/RatingComment.svelte.d.ts

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

package/dist/rating/Review.svelte

@@ -94,7 +94,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ReviewProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1297)
+[ReviewProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1281)
 ## Props
 @prop children
 @prop address

package/dist/rating/Review.svelte.d.ts

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

package/dist/rating/ScoreRating.svelte

@@ -69,7 +69,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ScoreRatingProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1313)
+[ScoreRatingProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1297)
 ## Props
 @prop ratings
 @prop ratings2

package/dist/rating/ScoreRating.svelte.d.ts

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

package/dist/rating/Star.svelte

@@ -35,7 +35,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
 ## Props
 @prop fillPercent = 100
 @prop fillColor = "#F5CA14"

package/dist/rating/Star.svelte.d.ts

@@ -2,7 +2,7 @@ import type { RatingIconProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+ * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
  * ## Props
  * @prop fillPercent = 100
  * @prop fillColor = "#F5CA14"

package/dist/rating/Thumbup.svelte

@@ -28,7 +28,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+[RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
 ## Props
 @prop fillPercent = 100
 @prop fillColor = "#00b500"

package/dist/rating/Thumbup.svelte.d.ts

@@ -2,7 +2,7 @@ import type { RatingIconProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1324)
+ * [RatingIconProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1308)
  * ## Props
  * @prop fillPercent = 100
  * @prop fillColor = "#00b500"