flowbite-svelte 1.0.4 → 1.0.5

package/dist/table/Table.svelte

@@ -2,9 +2,9 @@
   import { setContext } from "svelte";
   import { table as tableCls, TableHead, TableBody } from ".";
   import clsx from "clsx";
-  import type { TableProps, TableCtxType, HeadItemType } from "../types";
+  import type { TableProps, TableCtxType } from "..";
 
-  let { children, footerSlot, captionSlot, items: tableItems, divClass = "relative overflow-x-auto", striped, hoverable, border = true, shadow, color = "default", class: className, ...restProps }: TableProps = $props();
+  let { children, footerSlot, captionSlot, items, divClass = "relative overflow-x-auto", striped, hoverable, border = true, shadow, color = "default", class: className, ...restProps }: TableProps = $props();
 
   const { base, table } = $derived(tableCls({ color, shadow }));
 
@@ -24,12 +24,9 @@
   };
 
   setContext("tableCtx", tableCtx);
-  let headItems: (string | HeadItemType)[] = $state([]);
-  let bodyItems: (string | number | boolean)[][] = $state([]);
-  if (tableItems) {
-    headItems = Object.keys(tableItems[0]).map((key) => ({ text: key.charAt(0).toUpperCase() + key.slice(1) }));
-    bodyItems = tableItems.map((item) => Object.values(item));
-  }
+  let headItems = $derived(items && items.length > 0 ? Object.keys(items[0]).map((key) => ({ text: key.charAt(0).toUpperCase() + key.slice(1) })) : []);
+
+  let bodyItems = $derived(items && items.length > 0 ? items.map((item) => Object.values(item)) : []);
 </script>
 
 <div class={base({ class: divClass })}>
@@ -37,7 +34,7 @@
     {#if captionSlot}
       {@render captionSlot()}
     {/if}
-    {#if tableItems}
+    {#if items && items.length > 0}
       <TableHead {headItems} />
       <TableBody {bodyItems} />
     {:else if children}
@@ -58,7 +55,7 @@
 @prop children
 @prop footerSlot
 @prop captionSlot
-@prop items: tableItems
+@prop items
 @prop divClass = "relative overflow-x-auto"
 @prop striped
 @prop hoverable

package/dist/table/Table.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { TableProps } from "../types";
+import type { TableProps } from "..";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
@@ -7,7 +7,7 @@ import type { TableProps } from "../types";
  * @prop children
  * @prop footerSlot
  * @prop captionSlot
- * @prop items: tableItems
+ * @prop items
  * @prop divClass = "relative overflow-x-auto"
  * @prop striped
  * @prop hoverable

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flowbite-svelte",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Flowbite components for Svelte",
   "main": "dist/index.js",
   "author": {