flowbite-svelte 2.0.0-next.0 → 2.0.0-next.2

package/dist/typography/img/Img.svelte

@@ -2,24 +2,11 @@
   import clsx from "clsx";
   import { img } from "./theme";
   import type { ImgProps } from "../../types";
-  import { getTheme, warnThemeDeprecation } from "../../theme/themeUtils";
-  import { untrack } from "svelte";
+  import { getTheme } from "../../theme/themeUtils";
 
-  let { children, size, effect: imgEffect, align, caption, class: className, classes, figClass, captionClass, href, ...restProps }: ImgProps = $props();
+  let { children, size, effect: imgEffect, align, caption, class: className, classes, href, ...restProps }: ImgProps = $props();
 
-  warnThemeDeprecation(
-    "Img",
-    untrack(() => ({ figClass, captionClass })),
-    {
-      figClass: "figure",
-      captionClass: "caption"
-    }
-  );
-
-  const styling = $derived({
-    figure: figClass || classes?.figure,
-    caption: captionClass || classes?.caption
-  });
+  const styling = $derived(classes);
 
   const theme = $derived(getTheme("img"));
 
@@ -33,13 +20,13 @@
 
 {#snippet imageSlot()}
   {#if caption}
-    <figure class={figure({ class: clsx(theme?.figure, styling.figure) })}>
+    <figure class={figure({ class: clsx(theme?.figure, styling?.figure) })}>
       {#if useSlot}
         {@render children?.({ class: imgClass, restProps })}
       {:else}
         <img {...restProps} class={imgClass} />
       {/if}
-      <figcaption class={figureCaption({ class: clsx(theme?.caption, styling.caption) })}>
+      <figcaption class={figureCaption({ class: clsx(theme?.caption, styling?.caption) })}>
         {@html caption}
       </figcaption>
     </figure>
@@ -62,7 +49,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ImgProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2021)
+[ImgProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1889)
 ## Props
 @prop children
 @prop size
@@ -71,8 +58,6 @@
 @prop caption
 @prop class: className
 @prop classes
-@prop figClass
-@prop captionClass
 @prop href
 @prop ...restProps
 -->

package/dist/typography/img/Img.svelte.d.ts

@@ -2,7 +2,7 @@ import type { ImgProps } from "../../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ImgProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2021)
+ * [ImgProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1889)
  * ## Props
  * @prop children
  * @prop size
@@ -11,8 +11,6 @@ import type { ImgProps } from "../../types";
  * @prop caption
  * @prop class: className
  * @prop classes
- * @prop figClass
- * @prop captionClass
  * @prop href
  * @prop ...restProps
  */

package/dist/typography/layout/Layout.svelte

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

package/dist/typography/layout/Layout.svelte.d.ts

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

package/dist/typography/list/Li.svelte

@@ -18,7 +18,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[LiProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2058)
+[LiProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1924)
 ## Props
 @prop children
 @prop icon

package/dist/typography/list/Li.svelte.d.ts

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

package/dist/typography/list/List.svelte

@@ -36,7 +36,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ListProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2050)
+[ListProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1916)
 ## Props
 @prop children
 @prop tag = "ul"

package/dist/typography/list/List.svelte.d.ts

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

package/dist/typography/mark/Mark.svelte

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

package/dist/typography/mark/Mark.svelte.d.ts

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

package/dist/typography/paragraph/P.svelte

@@ -32,7 +32,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ParagraphProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2069)
+[ParagraphProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1935)
 ## Props
 @prop children
 @prop class: className = "text-gray-900 dark:text-white"

package/dist/typography/paragraph/P.svelte.d.ts

@@ -2,7 +2,7 @@ import type { ParagraphProps } from "../../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ParagraphProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2069)
+ * [ParagraphProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1935)
  * ## Props
  * @prop children
  * @prop class: className = "text-gray-900 dark:text-white"

package/dist/typography/secondary/Secondary.svelte

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

package/dist/typography/secondary/Secondary.svelte.d.ts

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

package/dist/typography/span/Span.svelte

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

package/dist/typography/span/Span.svelte.d.ts

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

package/dist/utils/Arrow.svelte

@@ -49,7 +49,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ArrowProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2126)
+[ArrowProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1992)
 ## Props
 @prop placement = "top"
 @prop cords

package/dist/utils/Arrow.svelte.d.ts

@@ -2,7 +2,7 @@ import type { ArrowProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ArrowProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2126)
+ * [ArrowProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1992)
  * ## Props
  * @prop placement = "top"
  * @prop cords

package/dist/utils/Popper.svelte

@@ -145,20 +145,48 @@
     onbeforetoggle?.(evWithTrigger);
   }
 
+  $effect(() => {
+    // Ensure popover is shown/hidden based on isOpen state
+    if (popover) {
+      if (isOpen) {
+        try {
+          if (!popover.matches(":popover-open")) {
+            popover.showPopover();
+          }
+        } catch (e) {
+          // Ignore errors
+        }
+      } else {
+        try {
+          if (popover.matches(":popover-open")) {
+            popover.hidePopover();
+          }
+        } catch (e) {
+          // Ignore errors
+        }
+      }
+    }
+  });
+
   $effect(() => {
     // Floating UI instance when it's closed we need to keep a autoUpdate destroy function
     let autoUpdateDestroy: (() => void) | null = null;
 
     if (isOpen && popover && invoker) {
       autoUpdateDestroy = dom.autoUpdate(referenceElement ?? invoker, popover, updatePopoverPosition);
-      popover.ownerDocument.addEventListener("click", closeOnClickOutside);
+      // Only add click outside handler for click triggers
+      if (clickable) {
+        popover.ownerDocument.addEventListener("click", closeOnClickOutside);
+      }
       popover.ownerDocument.addEventListener("keydown", closeOnEscape);
     }
 
     return () => {
       autoUpdateDestroy?.();
       autoUpdateDestroy = null;
-      popover?.ownerDocument.removeEventListener("click", closeOnClickOutside);
+      if (clickable && popover) {
+        popover.ownerDocument.removeEventListener("click", closeOnClickOutside);
+      }
       popover?.ownerDocument.removeEventListener("keydown", closeOnEscape);
     };
   });
@@ -212,6 +240,8 @@
   function closeOnEscape(event: KeyboardEvent) {
     if (event.key === "Escape") {
       isOpen = false;
+      // Return focus to the trigger element when closing with escape
+      invoker?.focus();
     }
   }
 
@@ -249,7 +279,6 @@
     onintrostart={() => popover?.showPopover()}
     onbeforetoggle={on_before_toggle}
     ontoggle={on_toggle}
-    onoutroend={() => popover?.hidePopover()}
     {...restProps}
   >
     {@render children()}
@@ -263,7 +292,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[PopperProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2104)
+[PopperProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1970)
 ## Props
 @prop triggeredBy
 @prop triggerDelay = DEFAULT_TRIGGER_DELAY

package/dist/utils/Popper.svelte.d.ts

@@ -2,7 +2,7 @@ import type { PopperProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [PopperProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2104)
+ * [PopperProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1970)
  * ## Props
  * @prop triggeredBy
  * @prop triggerDelay = DEFAULT_TRIGGER_DELAY

package/dist/video/Video.svelte

@@ -21,7 +21,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[VideoProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L2091)
+[VideoProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1957)
 ## Props
 @prop children
 @prop type = "video/mp4"

package/dist/video/Video.svelte.d.ts

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flowbite-svelte",
-  "version": "2.0.0-next.0",
+  "version": "2.0.0-next.2",
   "description": "Flowbite components for Svelte",
   "author": {
     "name": "Shinichi Okada",
@@ -12,8 +12,8 @@
   "license": "MIT",
   "devDependencies": {
     "@changesets/cli": "^2.29.8",
-    "@docsearch/css": "^4.3.2",
-    "@docsearch/js": "^4.3.2",
+    "@docsearch/css": "^4.4.0",
+    "@docsearch/js": "^4.4.0",
     "@eslint/compat": "^2.0.0",
     "@eslint/js": "^9.39.2",
     "@flowbite-svelte-plugins/chart": "^0.2.4",
@@ -28,7 +28,7 @@
     "@svitejs/changesets-changelog-github-compact": "^1.2.0",
     "@tailwindcss/vite": "^4.1.18",
     "@testing-library/jest-dom": "^6.9.1",
-    "@testing-library/svelte": "^5.2.10",
+    "@testing-library/svelte": "^5.3.1",
     "@testing-library/user-event": "^14.6.1",
     "@tiptap/core": "3.7.2",
     "@vitest/browser": "^4.0.16",
@@ -45,7 +45,7 @@
     "flowbite-typography": "^1.0.5",
     "globals": "^16.5.0",
     "highlight.js": "^11.11.1",
-    "jsdom": "^27.3.0",
+    "jsdom": "^27.4.0",
     "katex": "^0.16.27",
     "lowlight": "^3.3.0",
     "mdsvex": "^0.12.6",
@@ -61,7 +61,7 @@
     "satori": "^0.18.3",
     "satori-html": "^0.3.2",
     "super-sitemap": "^1.0.5",
-    "svelte": "^5.46.0",
+    "svelte": "^5.46.1",
     "svelte-check": "^4.3.5",
     "svelte-doc-llm": "^0.8.0",
     "svelte-lib-helpers": "^0.4.31",
@@ -70,7 +70,7 @@
     "tailwindcss": "^4.1.18",
     "tsx": "^4.21.0",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.50.0",
+    "typescript-eslint": "^8.50.1",
     "vite": "^7.3.0",
     "vite-plugin-devtools-json": "^1.0.0",
     "vitest": "^4.0.16",
@@ -894,10 +894,12 @@
     "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
     "check:ignore": "npx sv check --ignore 'src/routes/testdir,dist,build' --no-tsconfig",
     "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+    "check:all": "pnpm format && pnpm lint && pnpm check && pnpm test:e2e && pnpm test:unit:run",
     "lint": "pnpm format && prettier --check . && eslint .",
     "format": "prettier --write .",
     "test:e2e": "playwright test",
     "test:unit": "vitest",
+    "test:unit:run": "vitest run",
     "test:unit-t": "vitest run -t",
     "gen:exports": "svelte-lib-helpers exports",
     "gen:docspropvalue": "svelte-lib-helpers docspropvalue themesberg/flowbite-svelte",