flowbite-svelte 0.46.1 → 0.46.3

package/dist/gallery/Gallery.svelte

@@ -1,10 +1,9 @@
-<script>import { twMerge } from 'tailwind-merge';
+<script>import { twMerge } from "tailwind-merge";
 export let items = [];
-export let imgClass = 'h-auto max-w-full rounded-lg';
-$: divClass = twMerge('grid', $$props.class);
+export let imgClass = "h-auto max-w-full rounded-lg";
+$: divClass = twMerge("grid", $$props.class);
 function init(node) {
-    if (getComputedStyle(node).gap === 'normal')
-        node.style.gap = 'inherit';
+  if (getComputedStyle(node).gap === "normal") node.style.gap = "inherit";
 }
 </script>
 

package/dist/gallery/Gallery.svelte.d.ts

@@ -27,4 +27,3 @@ export type GallerySlots = typeof __propDef.slots;
 export default class Gallery extends SvelteComponentTyped<GalleryProps, GalleryEvents, GallerySlots> {
 }
 export {};
-//# sourceMappingURL=Gallery.svelte.d.ts.map

package/dist/index.d.ts

@@ -136,4 +136,3 @@ export { default as Frame } from "./utils/Frame.svelte";
 export { default as TransitionFrame } from "./utils/TransitionFrame.svelte";
 export { default as Video } from "./video/Video.svelte";
 export * from "./types";
-//# sourceMappingURL=index.d.ts.map

package/dist/indicators/Indicator.svelte

@@ -1,60 +1,60 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let color = 'gray';
+<script>import { twMerge } from "tailwind-merge";
+export let color = "gray";
 export let rounded = false;
-export let size = 'md';
+export let size = "md";
 export let border = false;
-export let placement = undefined;
+export let placement = void 0;
 export let offset = true;
 const colors = {
-    gray: 'bg-gray-200',
-    dark: 'bg-gray-900 dark:bg-gray-700',
-    blue: 'bg-blue-600',
-    orange: 'bg-orange-600',
-    green: 'bg-green-500',
-    red: 'bg-red-500',
-    purple: 'bg-purple-500',
-    indigo: 'bg-indigo-500',
-    yellow: 'bg-yellow-300',
-    teal: 'bg-teal-500',
-    none: ''
+  gray: "bg-gray-200",
+  dark: "bg-gray-900 dark:bg-gray-700",
+  blue: "bg-blue-600",
+  orange: "bg-orange-600",
+  green: "bg-green-500",
+  red: "bg-red-500",
+  purple: "bg-purple-500",
+  indigo: "bg-indigo-500",
+  yellow: "bg-yellow-300",
+  teal: "bg-teal-500",
+  none: ""
 };
 const sizes = {
-    xs: 'w-2 h-2',
-    sm: 'w-2.5 h-2.5',
-    md: 'w-3 h-3',
-    lg: 'w-3.5 h-3.5',
-    xl: 'w-6 h-6'
+  xs: "w-2 h-2",
+  sm: "w-2.5 h-2.5",
+  md: "w-3 h-3",
+  lg: "w-3.5 h-3.5",
+  xl: "w-6 h-6"
 };
 const placements = {
-    // top
-    'top-left': 'top-0 start-0',
-    'top-center': 'top-0 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rtl:translate-x-1/2',
-    'top-right': 'top-0 end-0',
-    // center
-    'center-left': 'top-1/2 -translate-y-1/2 start-0',
-    center: 'top-1/2 -translate-y-1/2 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rtl:translate-x-1/2',
-    'center-right': 'top-1/2 -translate-y-1/2 end-0',
-    // bottom
-    'bottom-left': 'bottom-0 start-0',
-    'bottom-center': 'bottom-0 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rtl:translate-x-1/2',
-    'bottom-right': 'bottom-0 end-0'
+  // top
+  "top-left": "top-0 start-0",
+  "top-center": "top-0 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rtl:translate-x-1/2",
+  "top-right": "top-0 end-0",
+  // center
+  "center-left": "top-1/2 -translate-y-1/2 start-0",
+  center: "top-1/2 -translate-y-1/2 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rtl:translate-x-1/2",
+  "center-right": "top-1/2 -translate-y-1/2 end-0",
+  // bottom
+  "bottom-left": "bottom-0 start-0",
+  "bottom-center": "bottom-0 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rtl:translate-x-1/2",
+  "bottom-right": "bottom-0 end-0"
 };
 const offsets = {
-    // top
-    'top-left': '-translate-x-1/3 rtl:translate-x-1/3 -translate-y-1/3',
-    'top-center': '-translate-y-1/3',
-    'top-right': 'translate-x-1/3 rtl:-translate-x-1/3 -translate-y-1/3',
-    // center
-    'center-left': '-translate-x-1/3 rtl:translate-x-1/3',
-    center: '',
-    'center-right': 'translate-x-1/3 rtl:-translate-x-1/3',
-    // bottom
-    'bottom-left': '-translate-x-1/3 rtl:translate-x-1/3 translate-y-1/3',
-    'bottom-center': 'translate-y-1/3',
-    'bottom-right': 'translate-x-1/3 rtl:-translate-x-1/3 translate-y-1/3'
+  // top
+  "top-left": "-translate-x-1/3 rtl:translate-x-1/3 -translate-y-1/3",
+  "top-center": "-translate-y-1/3",
+  "top-right": "translate-x-1/3 rtl:-translate-x-1/3 -translate-y-1/3",
+  // center
+  "center-left": "-translate-x-1/3 rtl:translate-x-1/3",
+  center: "",
+  "center-right": "translate-x-1/3 rtl:-translate-x-1/3",
+  // bottom
+  "bottom-left": "-translate-x-1/3 rtl:translate-x-1/3 translate-y-1/3",
+  "bottom-center": "translate-y-1/3",
+  "bottom-right": "translate-x-1/3 rtl:-translate-x-1/3 translate-y-1/3"
 };
 let dotClass;
-$: dotClass = twMerge('flex-shrink-0', rounded ? 'rounded' : 'rounded-full', border && 'border-2 border-white dark:border-gray-800', sizes[size], colors[color], $$slots.default && 'inline-flex items-center justify-center', placement && 'absolute ' + placements[placement], placement && offset && offsets[placement], $$props.class);
+$: dotClass = twMerge("flex-shrink-0", rounded ? "rounded" : "rounded-full", border && "border-2 border-white dark:border-gray-800", sizes[size], colors[color], $$slots.default && "inline-flex items-center justify-center", placement && "absolute " + placements[placement], placement && offset && offsets[placement], $$props.class);
 </script>
 
 <div class={dotClass}><slot /></div>

package/dist/indicators/Indicator.svelte.d.ts

@@ -33,4 +33,3 @@ export type IndicatorSlots = typeof __propDef.slots;
 export default class Indicator extends SvelteComponentTyped<IndicatorProps, IndicatorEvents, IndicatorSlots> {
 }
 export {};
-//# sourceMappingURL=Indicator.svelte.d.ts.map

package/dist/kbd/ArrowKeyDown.svelte

@@ -1,5 +1,5 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let svgClass = 'w-4 h-4';
+<script>import { twMerge } from "tailwind-merge";
+export let svgClass = "w-4 h-4";
 </script>
 
 <svg {...$$restProps} class={twMerge(svgClass, $$props.class)} aria-hidden="true" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">

package/dist/kbd/ArrowKeyDown.svelte.d.ts

@@ -20,4 +20,3 @@ export type ArrowKeyDownSlots = typeof __propDef.slots;
 export default class ArrowKeyDown extends SvelteComponentTyped<ArrowKeyDownProps, ArrowKeyDownEvents, ArrowKeyDownSlots> {
 }
 export {};
-//# sourceMappingURL=ArrowKeyDown.svelte.d.ts.map

package/dist/kbd/ArrowKeyLeft.svelte

@@ -1,5 +1,5 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let svgClass = 'w-4 h-4';
+<script>import { twMerge } from "tailwind-merge";
+export let svgClass = "w-4 h-4";
 </script>
 
 <svg {...$$restProps} class={twMerge(svgClass, $$props.class)} aria-hidden="true" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">

package/dist/kbd/ArrowKeyLeft.svelte.d.ts

@@ -20,4 +20,3 @@ export type ArrowKeyLeftSlots = typeof __propDef.slots;
 export default class ArrowKeyLeft extends SvelteComponentTyped<ArrowKeyLeftProps, ArrowKeyLeftEvents, ArrowKeyLeftSlots> {
 }
 export {};
-//# sourceMappingURL=ArrowKeyLeft.svelte.d.ts.map

package/dist/kbd/ArrowKeyRight.svelte

@@ -1,5 +1,5 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let svgClass = 'w-4 h-4';
+<script>import { twMerge } from "tailwind-merge";
+export let svgClass = "w-4 h-4";
 </script>
 
 <svg {...$$restProps} class={twMerge(svgClass, $$props.class)} aria-hidden="true" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">

package/dist/kbd/ArrowKeyRight.svelte.d.ts

@@ -20,4 +20,3 @@ export type ArrowKeyRightSlots = typeof __propDef.slots;
 export default class ArrowKeyRight extends SvelteComponentTyped<ArrowKeyRightProps, ArrowKeyRightEvents, ArrowKeyRightSlots> {
 }
 export {};
-//# sourceMappingURL=ArrowKeyRight.svelte.d.ts.map

package/dist/kbd/ArrowKeyUp.svelte

@@ -1,5 +1,5 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let svgClass = 'w-4 h-4';
+<script>import { twMerge } from "tailwind-merge";
+export let svgClass = "w-4 h-4";
 </script>
 
 <svg {...$$restProps} class={twMerge(svgClass, $$props.class)} aria-hidden="true" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">

package/dist/kbd/ArrowKeyUp.svelte.d.ts

@@ -20,4 +20,3 @@ export type ArrowKeyUpSlots = typeof __propDef.slots;
 export default class ArrowKeyUp extends SvelteComponentTyped<ArrowKeyUpProps, ArrowKeyUpEvents, ArrowKeyUpSlots> {
 }
 export {};
-//# sourceMappingURL=ArrowKeyUp.svelte.d.ts.map

package/dist/kbd/Kbd.svelte

@@ -1,5 +1,5 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let kbdClass = 'text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg dark:bg-gray-600 dark:text-gray-100 dark:border-gray-500';
+<script>import { twMerge } from "tailwind-merge";
+export let kbdClass = "text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg dark:bg-gray-600 dark:text-gray-100 dark:border-gray-500";
 </script>
 
 <kbd class={twMerge(kbdClass, $$props.class)}>

package/dist/kbd/Kbd.svelte.d.ts

@@ -22,4 +22,3 @@ export type KbdSlots = typeof __propDef.slots;
 export default class Kbd extends SvelteComponentTyped<KbdProps, KbdEvents, KbdSlots> {
 }
 export {};
-//# sourceMappingURL=Kbd.svelte.d.ts.map

package/dist/list-group/Listgroup.svelte

@@ -1,12 +1,12 @@
-<script>import { createEventDispatcher, setContext } from 'svelte';
-import { twMerge } from 'tailwind-merge';
-import Frame from '../utils/Frame.svelte';
-import ListgroupItem from './ListgroupItem.svelte';
+<script>import { createEventDispatcher, setContext } from "svelte";
+import { twMerge } from "tailwind-merge";
+import Frame from "../utils/Frame.svelte";
+import ListgroupItem from "./ListgroupItem.svelte";
 const dispatch = createEventDispatcher();
 export let items = [];
 export let active = false;
-export let defaultClass = 'divide-y divide-gray-200 dark:divide-gray-600';
-$: setContext('active', active);
+export let defaultClass = "divide-y divide-gray-200 dark:divide-gray-600";
+$: setContext("active", active);
 let groupClass;
 $: groupClass = twMerge(defaultClass, $$props.class);
 </script>

package/dist/list-group/Listgroup.svelte.d.ts

@@ -44,4 +44,3 @@ export type ListgroupSlots = typeof __propDef.slots;
 export default class Listgroup extends SvelteComponentTyped<ListgroupProps, ListgroupEvents, ListgroupSlots> {
 }
 export {};
-//# sourceMappingURL=Listgroup.svelte.d.ts.map

package/dist/list-group/ListgroupItem.svelte

@@ -1,25 +1,25 @@
-<script>import { getContext } from 'svelte';
-import { twMerge } from 'tailwind-merge';
-export let active = getContext('active');
+<script>import { getContext } from "svelte";
+import { twMerge } from "tailwind-merge";
+export let active = getContext("active");
 export let current = false;
 export let disabled = false;
-export let href = '';
-export let currentClass = 'text-white bg-primary-700 dark:text-white dark:bg-gray-800';
-export let normalClass = '';
-export let disabledClass = 'text-gray-900 bg-gray-100 dark:bg-gray-600 dark:text-gray-400';
-export let focusClass = 'focus:z-40 focus:outline-none focus:ring-2 focus:ring-primary-700 focus:text-primary-700 dark:focus:ring-gray-500 dark:focus:text-white';
-export let hoverClass = 'hover:bg-gray-100 hover:text-primary-700 dark:hover:bg-gray-600 dark:hover:text-white';
-export let itemDefaultClass = 'py-2 px-4 w-full text-sm font-medium list-none first:rounded-t-lg last:rounded-b-lg';
-export let attrs = undefined;
+export let href = "";
+export let currentClass = "text-white bg-primary-700 dark:text-white dark:bg-gray-800";
+export let normalClass = "";
+export let disabledClass = "text-gray-900 bg-gray-100 dark:bg-gray-600 dark:text-gray-400";
+export let focusClass = "focus:z-40 focus:outline-none focus:ring-2 focus:ring-primary-700 focus:text-primary-700 dark:focus:ring-gray-500 dark:focus:text-white";
+export let hoverClass = "hover:bg-gray-100 hover:text-primary-700 dark:hover:bg-gray-600 dark:hover:text-white";
+export let itemDefaultClass = "py-2 px-4 w-full text-sm font-medium list-none first:rounded-t-lg last:rounded-b-lg";
+export let attrs = void 0;
 const states = {
-    current: currentClass,
-    normal: normalClass,
-    disabled: disabledClass
+  current: currentClass,
+  normal: normalClass,
+  disabled: disabledClass
 };
 let state;
-$: state = disabled ? 'disabled' : current ? 'current' : 'normal';
+$: state = disabled ? "disabled" : current ? "current" : "normal";
 let itemClass;
-$: itemClass = twMerge(itemDefaultClass, states[state], active && state === 'disabled' && 'cursor-not-allowed', active && state === 'normal' && hoverClass, active && state === 'normal' && focusClass, $$props.class);
+$: itemClass = twMerge(itemDefaultClass, states[state], active && state === "disabled" && "cursor-not-allowed", active && state === "normal" && hoverClass, active && state === "normal" && focusClass, $$props.class);
 </script>
 
 {#if !active}

package/dist/list-group/ListgroupItem.svelte.d.ts

@@ -55,4 +55,3 @@ export type ListgroupItemSlots = typeof __propDef.slots;
 export default class ListgroupItem extends SvelteComponentTyped<ListgroupItemProps, ListgroupItemEvents, ListgroupItemSlots> {
 }
 export {};
-//# sourceMappingURL=ListgroupItem.svelte.d.ts.map

package/dist/marquee/Marquee.svelte

@@ -1,4 +1,4 @@
-<script>import { twMerge } from 'tailwind-merge';
+<script>import { twMerge } from "tailwind-merge";
 export let speed = 1;
 export let hoverSpeed = 1;
 export let shadow = false;
@@ -8,24 +8,21 @@ let shadowClass = `after:content-[''] after:absolute after:block after:z-10 afte
     before:block before:z-10 before:h-full before:end-0 after:shadow-[10px_0_50px_65px_rgba(256,256,256,1)] 
     before:shadow-[-10px_0_50px_65px_rgba(256,256,256,1)] dark:after:shadow-[10px_0_50px_65px_rgba(16,24,39,1)]
     dark:before:shadow-[-10px_0_50px_65px_rgba(16,24,39,1)]`;
-let divCls = twMerge('relative flex overflow-hidden w-full', shadow ? shadowClass : '', $$props.class);
+let divCls = twMerge("relative flex overflow-hidden w-full", shadow ? shadowClass : "", $$props.class);
 function init(marquee) {
-    const intervalId = setInterval(() => {
-        if (marquee && Math.abs(offset) >= marquee.offsetWidth) {
-            offset = 0;
-        }
-        else {
-            if (isHovering)
-                offset -= hoverSpeed;
-            else
-                offset -= speed;
-        }
-    }, 5);
-    return {
-        destroy() {
-            clearInterval(intervalId);
-        }
-    };
+  const intervalId = setInterval(() => {
+    if (marquee && Math.abs(offset) >= marquee.offsetWidth) {
+      offset = 0;
+    } else {
+      if (isHovering) offset -= hoverSpeed;
+      else offset -= speed;
+    }
+  }, 5);
+  return {
+    destroy() {
+      clearInterval(intervalId);
+    }
+  };
 }
 </script>
 

package/dist/marquee/Marquee.svelte.d.ts

@@ -26,4 +26,3 @@ export type MarqueeSlots = typeof __propDef.slots;
 export default class Marquee extends SvelteComponentTyped<MarqueeProps, MarqueeEvents, MarqueeSlots> {
 }
 export {};
-//# sourceMappingURL=Marquee.svelte.d.ts.map

package/dist/mega-menu/MegaMenu.svelte

@@ -1,13 +1,13 @@
-<script>import { twMerge } from 'tailwind-merge';
-import Popper from '../utils/Popper.svelte';
+<script>import { twMerge } from "tailwind-merge";
+import Popper from "../utils/Popper.svelte";
 export let items = [];
 export let full = false;
 export let open = false;
-export let ulClass = 'grid grid-flow-row gap-y-4 md:gap-x-0 auto-col-max auto-row-max';
+export let ulClass = "grid grid-flow-row gap-y-4 md:gap-x-0 auto-col-max auto-row-max";
 let wrapperClass;
-$: wrapperClass = twMerge(full && 'border-y w-full', $$props.class);
+$: wrapperClass = twMerge(full && "border-y w-full", $$props.class);
 let ulCls;
-$: ulCls = twMerge(ulClass, full && $$slots.extra ? 'grid-cols-2' : 'grid-cols-2 md:grid-cols-3', 'text-sm font-medium', full && $$slots.extra && 'md:w-2/3', $$props.classUl);
+$: ulCls = twMerge(ulClass, full && $$slots.extra ? "grid-cols-2" : "grid-cols-2 md:grid-cols-3", "text-sm font-medium", full && $$slots.extra && "md:w-2/3", $$props.classUl);
 </script>
 
 <Popper color={full ? 'default' : 'dropdown'} border={!full} rounded={!full} activeContent arrow={false} trigger="click" placement="bottom" yOnly={full} {...$$restProps} class={wrapperClass} on:show bind:open>

package/dist/mega-menu/MegaMenu.svelte.d.ts

@@ -62,4 +62,3 @@ export type MegaMenuSlots = typeof __propDef.slots;
 export default class MegaMenu extends SvelteComponentTyped<MegaMenuProps, MegaMenuEvents, MegaMenuSlots> {
 }
 export {};
-//# sourceMappingURL=MegaMenu.svelte.d.ts.map

package/dist/modal/Modal.svelte

@@ -1,98 +1,91 @@
-<script>import { twMerge } from 'tailwind-merge';
-import Frame from '../utils/Frame.svelte';
-import { createEventDispatcher } from 'svelte';
-import CloseButton from '../utils/CloseButton.svelte';
-import focusTrap from '../utils/focusTrap';
+<script>import { twMerge } from "tailwind-merge";
+import Frame from "../utils/Frame.svelte";
+import { createEventDispatcher } from "svelte";
+import CloseButton from "../utils/CloseButton.svelte";
+import focusTrap from "../utils/focusTrap";
 export let open = false;
-export let title = '';
-export let size = 'md';
-export let color = 'default';
-export let placement = 'center';
+export let title = "";
+export let size = "md";
+export let color = "default";
+export let placement = "center";
 export let autoclose = false;
 export let outsideclose = false;
 export let dismissable = true;
-export let backdropClass = 'fixed inset-0 z-40 bg-gray-900 bg-opacity-50 dark:bg-opacity-80';
-export let classBackdrop = undefined;
-export let dialogClass = 'fixed top-0 start-0 end-0 h-modal md:inset-0 md:h-full z-50 w-full p-4 flex';
-export let classDialog = undefined;
-export let defaultClass = 'relative flex flex-col mx-auto';
-export let headerClass = 'flex justify-between items-center p-4 md:p-5 rounded-t-lg';
-export let classHeader = undefined;
-export let bodyClass = 'p-4 md:p-5 space-y-4 flex-1 overflow-y-auto overscroll-contain';
-export let classBody = undefined;
-export let footerClass = 'flex items-center p-4 md:p-5 space-x-3 rtl:space-x-reverse rounded-b-lg';
-export let classFooter = undefined;
+export let backdropClass = "fixed inset-0 z-40 bg-gray-900 bg-opacity-50 dark:bg-opacity-80";
+export let classBackdrop = void 0;
+export let dialogClass = "fixed top-0 start-0 end-0 h-modal md:inset-0 md:h-full z-50 w-full p-4 flex";
+export let classDialog = void 0;
+export let defaultClass = "relative flex flex-col mx-auto";
+export let headerClass = "flex justify-between items-center p-4 md:p-5 rounded-t-lg";
+export let classHeader = void 0;
+export let bodyClass = "p-4 md:p-5 space-y-4 flex-1 overflow-y-auto overscroll-contain";
+export let classBody = void 0;
+export let footerClass = "flex items-center p-4 md:p-5 space-x-3 rtl:space-x-reverse rounded-b-lg";
+export let classFooter = void 0;
 const dispatch = createEventDispatcher();
-$: dispatch(open ? 'open' : 'close');
+$: dispatch(open ? "open" : "close");
 function prepareFocus(node) {
-    const walker = document.createTreeWalker(node, NodeFilter.SHOW_ELEMENT);
-    let n;
-    while ((n = walker.nextNode())) {
-        if (n instanceof HTMLElement) {
-            const el = n;
-            const [x, y] = isScrollable(el);
-            if (x || y)
-                el.tabIndex = 0;
-        }
+  const walker = document.createTreeWalker(node, NodeFilter.SHOW_ELEMENT);
+  let n;
+  while (n = walker.nextNode()) {
+    if (n instanceof HTMLElement) {
+      const el = n;
+      const [x, y] = isScrollable(el);
+      if (x || y) el.tabIndex = 0;
     }
-    node.focus();
+  }
+  node.focus();
 }
-const getPlacementClasses = (placement) => {
-    switch (placement) {
-        // top
-        case 'top-left':
-            return ['justify-start', 'items-start'];
-        case 'top-center':
-            return ['justify-center', 'items-start'];
-        case 'top-right':
-            return ['justify-end', 'items-start'];
-        // center
-        case 'center-left':
-            return ['justify-start', 'items-center'];
-        case 'center':
-            return ['justify-center', 'items-center'];
-        case 'center-right':
-            return ['justify-end', 'items-center'];
-        // bottom
-        case 'bottom-left':
-            return ['justify-start', 'items-end'];
-        case 'bottom-center':
-            return ['justify-center', 'items-end'];
-        case 'bottom-right':
-            return ['justify-end', 'items-end'];
-        default:
-            return ['justify-center', 'items-center'];
-    }
+const getPlacementClasses = (placement2) => {
+  switch (placement2) {
+    case "top-left":
+      return ["justify-start", "items-start"];
+    case "top-center":
+      return ["justify-center", "items-start"];
+    case "top-right":
+      return ["justify-end", "items-start"];
+    case "center-left":
+      return ["justify-start", "items-center"];
+    case "center":
+      return ["justify-center", "items-center"];
+    case "center-right":
+      return ["justify-end", "items-center"];
+    case "bottom-left":
+      return ["justify-start", "items-end"];
+    case "bottom-center":
+      return ["justify-center", "items-end"];
+    case "bottom-right":
+      return ["justify-end", "items-end"];
+    default:
+      return ["justify-center", "items-center"];
+  }
 };
 const sizes = {
-    xs: 'max-w-md',
-    sm: 'max-w-lg',
-    md: 'max-w-2xl',
-    lg: 'max-w-4xl',
-    xl: 'max-w-7xl'
+  xs: "max-w-md",
+  sm: "max-w-lg",
+  md: "max-w-2xl",
+  lg: "max-w-4xl",
+  xl: "max-w-7xl"
 };
 const onAutoClose = (e) => {
-    const target = e.target;
-    if (autoclose && target?.tagName === 'BUTTON')
-        hide(e); // close on any button click
+  const target = e.target;
+  if (autoclose && target?.tagName === "BUTTON") hide(e);
 };
 const onOutsideClose = (e) => {
-    const target = e.target;
-    if (outsideclose && target === e.currentTarget)
-        hide(e); // close on click outside
+  const target = e.target;
+  if (outsideclose && target === e.currentTarget) hide(e);
 };
 const hide = (e) => {
-    e.preventDefault();
-    open = false;
+  e.preventDefault();
+  open = false;
 };
-const isScrollable = (e) => [e.scrollWidth > e.clientWidth && ['scroll', 'auto'].indexOf(getComputedStyle(e).overflowX) >= 0, e.scrollHeight > e.clientHeight && ['scroll', 'auto'].indexOf(getComputedStyle(e).overflowY) >= 0];
+const isScrollable = (e) => [e.scrollWidth > e.clientWidth && ["scroll", "auto"].indexOf(getComputedStyle(e).overflowX) >= 0, e.scrollHeight > e.clientHeight && ["scroll", "auto"].indexOf(getComputedStyle(e).overflowY) >= 0];
 function handleKeys(e) {
-    if (e.key === 'Escape' && dismissable)
-        return hide(e);
+  if (e.key === "Escape" && dismissable) return hide(e);
 }
 $: backdropCls = twMerge(backdropClass, classBackdrop);
 $: dialogCls = twMerge(dialogClass, classDialog, getPlacementClasses(placement));
-$: frameCls = twMerge(defaultClass, 'w-full divide-y', $$props.class);
+$: frameCls = twMerge(defaultClass, "w-full divide-y", $$props.class);
 $: headerCls = twMerge(headerClass, classHeader);
 $: bodyCls = twMerge(bodyClass, classBody);
 $: footerCls = twMerge(footerClass, classFooter);
@@ -100,7 +93,7 @@ $: footerCls = twMerge(footerClass, classFooter);
 
 {#if open}
   <!-- backdrop -->
-  <div class={backdropCls} />
+  <div class={backdropCls}></div>
   <!-- dialog -->
   <!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
   <div on:keydown={handleKeys} on:wheel|preventDefault|nonpassive use:prepareFocus use:focusTrap on:click={onAutoClose} on:mousedown={onOutsideClose} class={dialogCls} tabindex="-1" aria-modal="true" role="dialog">
@@ -123,12 +116,12 @@ $: footerCls = twMerge(footerClass, classFooter);
           {#if dismissable && !$$slots.header && !title}
             <CloseButton name="Close modal" class="absolute top-3 end-2.5" {color} on:click={hide} />
           {/if}
-          <slot />
+          <slot></slot>
         </div>
         <!-- Modal footer -->
         {#if $$slots.footer}
           <Frame class={footerCls} {color}>
-            <slot name="footer" />
+            <slot name="footer"></slot>
           </Frame>
         {/if}
       </Frame>

package/dist/modal/Modal.svelte.d.ts

@@ -75,4 +75,3 @@ export type ModalSlots = typeof __propDef.slots;
 export default class Modal extends SvelteComponentTyped<ModalProps, ModalEvents, ModalSlots> {
 }
 export {};
-//# sourceMappingURL=Modal.svelte.d.ts.map

package/dist/navbar/Menu.svelte

@@ -1,23 +1,23 @@
-<script>export let size = '24';
-export let color = 'currentColor';
-export let variation = 'outline';
-export let ariaLabel = 'bars 3';
+<script>export let size = "24";
+export let color = "currentColor";
+export let variation = "outline";
+export let ariaLabel = "bars 3";
 let viewBox;
 let svgpath;
 let svgoutline = `<path stroke="${color}" stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16"></path> `;
 let svgsolid = `<path fill="${color}" clip-rule="evenodd" fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"></path> `;
 $: switch (variation) {
-    case 'outline':
-        svgpath = svgoutline;
-        viewBox = '0 0 24 24';
-        break;
-    case 'solid':
-        svgpath = svgsolid;
-        viewBox = '0 0 24 24';
-        break;
-    default:
-        svgpath = svgoutline;
-        viewBox = '0 0 24 24';
+  case "outline":
+    svgpath = svgoutline;
+    viewBox = "0 0 24 24";
+    break;
+  case "solid":
+    svgpath = svgsolid;
+    viewBox = "0 0 24 24";
+    break;
+  default:
+    svgpath = svgoutline;
+    viewBox = "0 0 24 24";
 }
 </script>
 

package/dist/navbar/Menu.svelte.d.ts

@@ -28,4 +28,3 @@ export type MenuSlots = typeof __propDef.slots;
 export default class Menu extends SvelteComponentTyped<MenuProps, MenuEvents, MenuSlots> {
 }
 export {};
-//# sourceMappingURL=Menu.svelte.d.ts.map