flowbite-svelte 0.37.2 → 0.37.4

package/dist/tables/TableBodyCell.svelte.d.ts

@@ -6,13 +6,6 @@ declare const __propDef: {
     };
     events: {
         click: MouseEvent;
-        focus: FocusEvent;
-        keydown: KeyboardEvent;
-        keypress: KeyboardEvent;
-        keyup: KeyboardEvent;
-        mouseenter: MouseEvent;
-        mouseleave: MouseEvent;
-        mouseover: MouseEvent;
     } & {
         [evt: string]: CustomEvent<any>;
     };

package/dist/tables/TableBodyCell.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableBodyCell.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/tables/TableBodyCell.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AA8BD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACxD,MAAM,MAAM,mBAAmB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAC1D,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAExD;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,oBAAoB,CAAC,kBAAkB,EAAE,mBAAmB,EAAE,kBAAkB,CAAC;CAC3H"}
+{"version":3,"file":"TableBodyCell.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/tables/TableBodyCell.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AA8BD,QAAA,MAAM,SAAS;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACxD,MAAM,MAAM,mBAAmB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAC1D,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAExD;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,oBAAoB,CAAC,kBAAkB,EAAE,mBAAmB,EAAE,kBAAkB,CAAC;CAC3H"}

package/dist/toasts/Toast.svelte

@@ -3,14 +3,13 @@ import classNames from 'classnames';
 import CloseButton from '../utils/CloseButton.svelte';
 import { fade } from 'svelte/transition';
 export let simple = false;
+export let color = 'primary';
 export let position = 'none';
 export let open = true;
-export let divClass = 'w-full max-w-xs p-4';
-export let defaultIconClass = 'inline-flex items-center justify-center flex-shrink-0 w-8 h-8 mr-3';
-$: {
-    // override default Frame value
-    $$restProps.color = $$restProps.color ?? 'blue';
-}
+export let divClass = 'w-full max-w-xs p-4 text-gray-500 bg-white shadow dark:text-gray-400 dark:bg-gray-800 gap-3';
+export let defaultIconClass = 'w-8 h-8';
+export let contentClass = 'w-full text-sm font-normal';
+export let align = true;
 const positions = {
     'top-left': 'absolute top-5 left-5',
     'top-right': 'absolute top-5 right-5',
@@ -18,27 +17,40 @@ const positions = {
     'bottom-right': 'absolute bottom-5 right-5',
     none: ''
 };
-let classDiv;
-$: classDiv = classNames(divClass, positions[position], $$props.class);
+let finalDivClass;
+$: finalDivClass = classNames('flex', align ? 'items-center' : 'items-start', divClass, positions[position], $$props.class);
+const colors = {
+    primary: 'text-primary-500 bg-primary-100 dark:bg-primary-800 dark:text-primary-200',
+    gray: 'text-gray-500 bg-gray-100 dark:bg-gray-700 dark:text-gray-200',
+    red: 'text-red-500 bg-red-100 dark:bg-red-800 dark:text-red-200',
+    yellow: 'text-yellow-500 bg-yellow-100 dark:bg-yellow-800 dark:text-yellow-200',
+    green: 'text-green-500 bg-green-100 dark:bg-green-800 dark:text-green-200',
+    blue: 'text-blue-500 bg-blue-100 dark:bg-blue-800 dark:text-blue-200',
+    indigo: 'text-indigo-500 bg-indigo-100 dark:bg-indigo-800 dark:text-indigo-200',
+    purple: 'text-purple-500 bg-purple-100 dark:bg-purple-800 dark:text-purple-200',
+    orange: 'text-orange-500 bg-orange-100 dark:bg-orange-700 dark:text-orange-200',
+    none: ''
+};
 let iconClass;
-$: iconClass = classNames(defaultIconClass);
+$: iconClass = classNames('inline-flex items-center justify-center shrink-0', colors[color], defaultIconClass);
+const clsBtnExtraClass = '-mx-1.5 -my-1.5 text-gray-400 hover:text-gray-900 focus:!ring-gray-300 hover:bg-gray-100 dark:text-gray-500 dark:hover:text-white dark:hover:bg-gray-700';
 </script>
 
 {#if open}
-  <Frame rounded border transition={fade} {...$$restProps} class={classDiv} role="alert">
-    <div class="flex {$$slots.extra ? 'items-start' : 'items-center'}">
-      {#if $$slots.icon}
-        <Frame rounded class={iconClass}><slot name="icon" /></Frame>
-      {/if}
+  <Frame rounded transition={fade} color="none" {...$$restProps} class={finalDivClass} role="alert">
+    {#if $$slots.icon}
+      <Frame rounded color="none" class={iconClass}>
+        <slot name="icon" />
+      </Frame>
+    {/if}
 
-      <div class="text-sm font-normal w-full">
-        <slot />
-        <slot name="extra" />
-      </div>
-      {#if !simple}
-        <CloseButton on:click={() => (open = false)} />
-      {/if}
+    <div class={contentClass}>
+      <slot />
     </div>
+
+    {#if !simple}
+      <CloseButton class={clsBtnExtraClass} on:click={() => (open = false)} />
+    {/if}
   </Frame>
 {/if}
 
@@ -56,7 +68,7 @@ $: iconClass = classNames(defaultIconClass);
   - Blur examples
   - Fly examples
   - Undo button
-  - Extra content
+  - Advanced examples
   - Toast message
   - Push notification
   - Interactive toast

package/dist/toasts/Toast.svelte.d.ts

@@ -45,7 +45,7 @@ declare const __propDef: {
         autocapitalize?: string | null | undefined;
         autocorrect?: string | null | undefined;
         autosave?: string | null | undefined;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "none" | undefined;
+        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "blue" | "orange" | "none" | undefined;
         itemprop?: string | null | undefined;
         itemscope?: boolean | null | undefined;
         itemtype?: string | null | undefined;
@@ -246,6 +246,9 @@ declare const __propDef: {
         position?: "none" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | undefined;
         open?: boolean | undefined;
         divClass?: string | undefined;
+        defaultIconClass?: string | undefined;
+        extraIconClass?: string | undefined;
+        contentClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;
@@ -253,7 +256,6 @@ declare const __propDef: {
     slots: {
         icon: {};
         default: {};
-        extra: {};
     };
 };
 export type ToastProps = typeof __propDef.props;
@@ -272,7 +274,7 @@ export type ToastSlots = typeof __propDef.slots;
  * - Blur examples
  * - Fly examples
  * - Undo button
- * - Extra content
+ * - Advanced examples
  * - Toast message
  * - Push notification
  * - Interactive toast

package/dist/toasts/Toast.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/toasts/Toast.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAsED,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}
+{"version":3,"file":"Toast.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/toasts/Toast.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAsHD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}

package/dist/tooltips/Tooltip.svelte.d.ts

@@ -45,7 +45,7 @@ declare const __propDef: {
         autocapitalize?: string | null | undefined;
         autocorrect?: string | null | undefined;
         autosave?: string | null | undefined;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "none" | undefined;
+        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none" | undefined;
         itemprop?: string | null | undefined;
         itemscope?: boolean | null | undefined;
         itemtype?: string | null | undefined;

package/dist/utils/ChevronDown.svelte

@@ -2,6 +2,7 @@
 export let color = 'currentColor';
 export let variation = 'outline';
 export let ariaLabel = 'chevron down';
+export let role = 'img';
 let viewBox;
 let svgpath;
 let svgoutline = `<path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" stroke="${color}"></path>`;
@@ -30,6 +31,7 @@ $: switch (variation) {
   aria-label={ariaLabel}
   fill="none"
   {viewBox}
+  {role}
   stroke-width="2"
   on:click>
   {@html svgpath}

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

@@ -6,6 +6,7 @@ declare const __propDef: {
         color?: string | undefined;
         variation?: "solid" | "outline" | undefined;
         ariaLabel?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/utils/ChevronDown.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronDown.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronDown.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAiCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACtD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACxD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEtD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,oBAAoB,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;CACnH"}
+{"version":3,"file":"ChevronDown.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronDown.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAmCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACtD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACxD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEtD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,oBAAoB,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;CACnH"}

package/dist/utils/ChevronLeft.svelte

@@ -2,6 +2,7 @@
 export let color = 'currentColor';
 export let variation = 'outline';
 export let ariaLabel = 'chevron left';
+export let role = 'img';
 let viewBox;
 let svgpath;
 let svgoutline = `<path clip-rule="evenodd" fill-rule="evenodd" d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z" stroke="${color}"></path>`;
@@ -30,6 +31,7 @@ $: switch (variation) {
   aria-label={ariaLabel}
   fill="none"
   {viewBox}
+  {role}
   stroke-width="2"
   on:click>
   {@html svgpath}

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

@@ -6,6 +6,7 @@ declare const __propDef: {
         color?: string | undefined;
         variation?: "solid" | "outline" | undefined;
         ariaLabel?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/utils/ChevronLeft.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronLeft.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronLeft.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAkCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACtD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACxD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEtD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,oBAAoB,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;CACnH"}
+{"version":3,"file":"ChevronLeft.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronLeft.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAmCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACtD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACxD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEtD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,oBAAoB,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;CACnH"}

package/dist/utils/ChevronRight.svelte

@@ -2,6 +2,7 @@
 export let color = 'currentColor';
 export let variation = 'outline';
 export let ariaLabel = 'chevron right';
+export let role = 'img';
 let viewBox;
 let svgpath;
 let svgoutline = `<path clip-rule="evenodd" fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" stroke="${color}"></path> `;
@@ -30,6 +31,7 @@ $: switch (variation) {
   aria-label={ariaLabel}
   fill="none"
   {viewBox}
+  {role}
   stroke-width="2"
   on:click>
   {@html svgpath}

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

@@ -6,6 +6,7 @@ declare const __propDef: {
         color?: string | undefined;
         variation?: "solid" | "outline" | undefined;
         ariaLabel?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/utils/ChevronRight.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronRight.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronRight.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAkCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACvD,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACzD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEvD;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,oBAAoB,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CACvH"}
+{"version":3,"file":"ChevronRight.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronRight.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAmCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACvD,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACzD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEvD;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,oBAAoB,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CACvH"}

package/dist/utils/ChevronUp.svelte

@@ -2,6 +2,7 @@
 export let color = 'currentColor';
 export let variation = 'outline';
 export let ariaLabel = 'chevron up';
+export let role = 'img';
 let viewBox;
 let svgpath;
 let svgoutline = `<path clip-rule="evenodd" fill-rule="evenodd" d="M14.707 12.707a1 1 0 01-1.414 0L10 9.414l-3.293 3.293a1 1 0 01-1.414-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 010 1.414z" stroke="${color}"></path>`;
@@ -30,6 +31,7 @@ $: switch (variation) {
   aria-label={ariaLabel}
   fill="none"
   {viewBox}
+  {role}
   stroke-width="2"
   on:click>
   {@html svgpath}

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

@@ -6,6 +6,7 @@ declare const __propDef: {
         color?: string | undefined;
         variation?: "solid" | "outline" | undefined;
         ariaLabel?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/utils/ChevronUp.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronUp.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronUp.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAkCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,cAAc,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACpD,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACtD,MAAM,MAAM,cAAc,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEpD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,oBAAoB,CAAC,cAAc,EAAE,eAAe,EAAE,cAAc,CAAC;CAC3G"}
+{"version":3,"file":"ChevronUp.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/ChevronUp.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAmCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,cAAc,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACpD,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACtD,MAAM,MAAM,cAAc,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEpD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,oBAAoB,CAAC,cAAc,EAAE,eAAe,EAAE,cAAc,CAAC;CAC3G"}

package/dist/utils/Frame.svelte

@@ -36,6 +36,7 @@ const bgColors = {
     navbarUl: 'bg-gray-50 dark:bg-gray-800',
     form: 'bg-gray-50 dark:bg-gray-700',
     primary: 'bg-primary-50 dark:bg-gray-800 ',
+    orange: 'bg-orange-50 dark:bg-orange-800',
     none: ''
 };
 const textColors = {
@@ -55,6 +56,7 @@ const textColors = {
     navbarUl: 'text-gray-700 dark:text-gray-400',
     form: 'text-gray-900 dark:text-white',
     primary: 'text-primary-800 dark:text-primary-400',
+    orange: 'text-orange-800 dark:text-orange-400',
     none: ''
 };
 const borderColors = {
@@ -74,6 +76,7 @@ const borderColors = {
     navbarUl: 'border-gray-100 dark:border-gray-700',
     form: 'border-gray-300 dark:border-gray-700',
     primary: 'border-primary-500 dark:bg-primary-200 ',
+    orange: 'border-orange-300 dark:bg-orange-800',
     none: ''
 };
 let divClass;

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

@@ -47,7 +47,7 @@ declare const __propDef: {
         autocapitalize?: string | null | undefined;
         autocorrect?: string | null | undefined;
         autosave?: string | null | undefined;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "none" | undefined;
+        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none" | undefined;
         itemprop?: string | null | undefined;
         itemscope?: boolean | null | undefined;
         itemtype?: string | null | undefined;

package/dist/utils/Frame.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Frame.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/Frame.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAKD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AA2I1D,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA/HgB,WAAW,UAAU,GAAG,KAAK,gBAAgB;;eAWjE,WAAW,GAAG,SAAS;;;;;;;;;;;;;;;;CAoHqB,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}
+{"version":3,"file":"Frame.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/Frame.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAKD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AA8I1D,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAlIgB,WAAW,UAAU,GAAG,KAAK,gBAAgB;;eAWjE,WAAW,GAAG,SAAS;;;;;;;;;;;;;;;;CAuHqB,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}

package/dist/utils/InformationCircle.svelte

@@ -2,6 +2,7 @@
 export let color = 'currentColor';
 export let variation = 'outline';
 export let ariaLabel = 'information circle';
+export let role = 'img';
 let viewBox;
 let svgpath;
 let svgoutline = `<path d="M11.25 11.25L11.2915 11.2293C11.8646 10.9427 12.5099 11.4603 12.3545 12.082L11.6455 14.918C11.4901 15.5397 12.1354 16.0573 12.7085 15.7707L12.75 15.75M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12ZM12 8.25H12.0075V8.2575H12V8.25Z" stroke="${color}" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> `;
@@ -30,6 +31,7 @@ $: switch (variation) {
   aria-label={ariaLabel}
   fill="none"
   {viewBox}
+  {role}
   stroke-width="2"
   on:click>
   {@html svgpath}

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

@@ -6,6 +6,7 @@ declare const __propDef: {
         color?: string | undefined;
         variation?: "solid" | "outline" | undefined;
         ariaLabel?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/utils/InformationCircle.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InformationCircle.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/InformationCircle.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAkCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,sBAAsB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC5D,MAAM,MAAM,uBAAuB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAC9D,MAAM,MAAM,sBAAsB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE5D;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,iBAAkB,SAAQ,oBAAoB,CAAC,sBAAsB,EAAE,uBAAuB,EAAE,sBAAsB,CAAC;CAC3I"}
+{"version":3,"file":"InformationCircle.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/InformationCircle.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAmCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,sBAAsB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC5D,MAAM,MAAM,uBAAuB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAC9D,MAAM,MAAM,sBAAsB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE5D;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,iBAAkB,SAAQ,oBAAoB,CAAC,sBAAsB,EAAE,uBAAuB,EAAE,sBAAsB,CAAC;CAC3I"}

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

@@ -46,7 +46,7 @@ declare const __propDef: {
         autocapitalize?: string | null | undefined;
         autocorrect?: string | null | undefined;
         autosave?: string | null | undefined;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "none" | undefined;
+        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "pink" | "blue" | "light" | "dark" | "default" | "dropdown" | "navbar" | "navbarUl" | "form" | "primary" | "orange" | "none" | undefined;
         itemprop?: string | null | undefined;
         itemscope?: boolean | null | undefined;
         itemtype?: string | null | undefined;

package/dist/utils/UserCircle.svelte

@@ -2,6 +2,7 @@
 export let color = 'currentColor';
 export let variation = 'outline';
 export let ariaLabel = 'user circle';
+export let role = 'img';
 let viewBox;
 let svgpath;
 let svgoutline = `<path d="M17.9815 18.7248C16.6121 16.9175 14.4424 15.75 12 15.75C9.55761 15.75 7.38789 16.9175 6.01846 18.7248M17.9815 18.7248C19.8335 17.0763 21 14.6744 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 14.6744 4.1665 17.0763 6.01846 18.7248M17.9815 18.7248C16.3915 20.1401 14.2962 21 12 21C9.70383 21 7.60851 20.1401 6.01846 18.7248M15 9.75C15 11.4069 13.6569 12.75 12 12.75C10.3431 12.75 9 11.4069 9 9.75C9 8.09315 10.3431 6.75 12 6.75C13.6569 6.75 15 8.09315 15 9.75Z" stroke="${color}" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> `;
@@ -30,6 +31,7 @@ $: switch (variation) {
   aria-label={ariaLabel}
   fill="none"
   {viewBox}
+  {role}
   stroke-width="2"
   on:click>
   {@html svgpath}

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

@@ -6,6 +6,7 @@ declare const __propDef: {
         color?: string | undefined;
         variation?: "solid" | "outline" | undefined;
         ariaLabel?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/utils/UserCircle.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserCircle.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/UserCircle.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAkCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACrD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACvD,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAErD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,oBAAoB,CAAC,eAAe,EAAE,gBAAgB,EAAE,eAAe,CAAC;CAC/G"}
+{"version":3,"file":"UserCircle.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/UserCircle.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAmCD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACrD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACvD,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAErD;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,oBAAoB,CAAC,eAAe,EAAE,gBAAgB,EAAE,eAAe,CAAC;CAC/G"}

package/dist/utils/focusTrap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"focusTrap.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/focusTrap.js"],"names":[],"mappings":"AA0Cm4B,oJAA2G"}
+{"version":3,"file":"focusTrap.d.ts","sourceRoot":"","sources":["../../../src/lib/utils/focusTrap.js"],"names":[],"mappings":"AA0Ci4B,oJAA2G"}

package/dist/utils/focusTrap.js

@@ -12,8 +12,6 @@ const selectorTabbable = `
 
 /** @type {import('svelte/action').Action} */
 export default function focusTrap(node) {
-  const tabbable = Array.from(node.querySelectorAll(selectorTabbable));
-
   /** @type {(e:KeyboardEvent)=>void} */
   function handleFocusTrap(e) {
     let isTabPressed = e.key === 'Tab' || e.keyCode === 9;
@@ -22,6 +20,8 @@ export default function focusTrap(node) {
       return;
     }
 
+    const tabbable = Array.from(node.querySelectorAll(selectorTabbable));
+
     let index = tabbable.indexOf(document.activeElement ?? node);
     if (index === -1 && e.shiftKey) index = 0;
     index += tabbable.length + (e.shiftKey ? -1 : 1);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flowbite-svelte",
-  "version": "0.37.2",
+  "version": "0.37.4",
   "description": "Flowbite components for Svelte",
   "main": "dist/index.js",
   "author": {
@@ -28,20 +28,14 @@
     "package:publish": "standard-version && git push --follow-tags origin main && npm run package && npm run add-exports && npm run write-package-json && npm publish",
     "gen:props": "createprops && npm run format"
   },
-  "peerDependencies": {
-    "@popperjs/core": "^2.11.6",
-    "classnames": "^2.3.2",
-    "flowbite": "^1.6.3",
-    "svelte": "^3.55.1"
-  },
   "devDependencies": {
-    "@docsearch/js": "^3.3.5",
-    "@playwright/test": "^1.34.0",
+    "@docsearch/js": "^3.4.0",
+    "@playwright/test": "^1.34.3",
     "@sveltejs/adapter-vercel": "^3.0.0",
-    "@sveltejs/kit": "^1.18.0",
+    "@sveltejs/kit": "^1.20.0",
     "@sveltejs/package": "2.0.2",
-    "@typescript-eslint/eslint-plugin": "^5.59.6",
-    "@typescript-eslint/parser": "^5.59.6",
+    "@typescript-eslint/eslint-plugin": "^5.59.8",
+    "@typescript-eslint/parser": "^5.59.8",
     "autoprefixer": "^10.4.14",
     "createprops": "^0.5.5",
     "esbuild": "0.17.19",
@@ -50,22 +44,25 @@
     "eslint-plugin-svelte3": "^4.0.0",
     "mdsvex": "^0.10.6",
     "mdsvexamples": "^0.3.3",
-    "postcss": "^8.4.23",
+    "postcss": "^8.4.24",
     "postcss-load-config": "^4.0.1",
     "prettier": "^2.8.8",
-    "prettier-plugin-svelte": "^2.10.0",
+    "prettier-plugin-svelte": "^2.10.1",
     "prism-themes": "^1.9.0",
     "publint": "^0.1.12",
     "svelte": "^3.59.1",
-    "svelte-check": "^3.3.2",
+    "svelte-check": "^3.4.3",
     "svelte-meta-tags": "^2.7.2",
-    "svelte-preprocess": "^5.0.3",
-    "svelte2tsx": "^0.6.14",
+    "svelte-preprocess": "^5.0.4",
+    "svelte2tsx": "^0.6.15",
     "tailwindcss": "^3.3.2",
     "tslib": "^2.5.2",
     "typescript": "^5.0.4",
-    "vite": "^4.3.8",
-    "vitest": "^0.31.1"
+    "vite": "^4.3.9",
+    "vitest": "^0.31.3"
+  },
+  "peerDependencies": {
+    "svelte": "^3.55.1 || ^4.0.0"
   },
   "type": "module",
   "keywords": [
@@ -111,7 +108,7 @@
     "url": "https://github.com/themesberg/flowbite-svelte"
   },
   "dependencies": {
-    "@popperjs/core": "^2.11.7",
+    "@popperjs/core": "^2.11.8",
     "classnames": "^2.3.2",
     "flowbite": "^1.6.5"
   },