flowbite-svelte 0.44.17 → 0.44.19

package/dist/footer/Footer.svelte

@@ -1,5 +1,5 @@
 <script>import { twMerge } from 'tailwind-merge';
-export let footerType = 'default';
+export let footerType = undefined;
 let footerClass = twMerge(footerType === 'sitemap' && 'bg-gray-800', footerType === 'socialmedia' && 'p-4 bg-white sm:p-6 dark:bg-gray-800', footerType === 'logo' && 'p-4 bg-white rounded-lg shadow md:px-6 md:py-8 dark:bg-gray-800', footerType === 'default' && 'p-4 bg-white rounded-lg shadow md:flex md:items-center md:justify-between md:p-6 dark:bg-gray-800', $$props.class);
 </script>
 
@@ -11,5 +11,5 @@ let footerClass = twMerge(footerType === 'sitemap' && 'bg-gray-800', footerType
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
-@prop export let footerType: 'sitemap' | 'default' | 'logo' | 'socialmedia' = 'default';
+@prop export let footerType: 'sitemap' | 'default' | 'logo' | 'socialmedia' | undefined = undefined;
 -->

package/dist/footer/Footer.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        footerType?: "default" | "sitemap" | "logo" | "socialmedia" | undefined;
+        footerType?: 'sitemap' | 'default' | 'logo' | 'socialmedia' | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;
@@ -17,7 +17,7 @@ export type FooterSlots = typeof __propDef.slots;
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop export let footerType: 'sitemap' | 'default' | 'logo' | 'socialmedia' = 'default';
+ * @prop export let footerType: 'sitemap' | 'default' | 'logo' | 'socialmedia' | undefined = undefined;
  */
 export default class Footer extends SvelteComponent<FooterProps, FooterEvents, FooterSlots> {
 }

package/dist/footer/Footer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Footer.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/footer/Footer.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAmBD,QAAA,MAAM,SAAS;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACjD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEjD;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,eAAe,CAAC,WAAW,EAAE,YAAY,EAAE,WAAW,CAAC;CAC1F"}
+{"version":3,"file":"Footer.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/footer/Footer.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAmBD,QAAA,MAAM,SAAS;;;qBAD2C,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,aAAa,GAAG,SAAS;;;;;;;;CACtC,CAAC;AAC/E,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACjD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEjD;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,eAAe,CAAC,WAAW,EAAE,YAAY,EAAE,WAAW,CAAC;CAC1F"}

package/dist/forms/CheckboxButton.svelte

@@ -0,0 +1,84 @@
+<script>import Button from '../buttons/Button.svelte';
+import { twMerge } from 'tailwind-merge';
+export let group = [];
+export let value = 'on';
+export let checked = undefined;
+export let inline = true;
+// Button properties forwarding
+export let pill = false;
+export let outline = false;
+export let size = undefined;
+export let color = undefined;
+export let shadow = false;
+// react on external group changes
+function init(_, _group) {
+    if (checked === undefined)
+        checked = _group.includes(value);
+    onChange();
+    return {
+        update(_group) {
+            checked = _group.includes(value);
+        }
+    };
+}
+function onChange() {
+    // There's a bug in Svelte and bind:group is not working with wrapped checkbox
+    // This workaround is taken from:
+    // https://svelte.dev/repl/de117399559f4e7e9e14e2fc9ab243cc?version=3.12.1
+    const index = group.indexOf(value);
+    if (checked === undefined)
+        checked = index >= 0;
+    if (checked) {
+        if (index < 0) {
+            group.push(value);
+            group = group;
+        }
+    }
+    else {
+        if (index >= 0) {
+            group.splice(index, 1);
+            group = group;
+        }
+    }
+}
+let buttonClass;
+$: buttonClass = twMerge(inline ? 'inline-flex' : 'flex', $$props.class);
+</script>
+
+<Button tag="label" {checked} {pill} {outline} {size} {color} {shadow} class={buttonClass}>
+  <input
+    use:init={group}
+    type="checkbox"
+    bind:checked
+    {value}
+    {...$$restProps}
+    class="sr-only"
+    on:keyup
+    on:keydown
+    on:keypress
+    on:focus
+    on:blur
+    on:click
+    on:mouseover
+    on:mouseenter
+    on:mouseleave
+    on:paste
+    on:change={onChange}
+    on:change />
+  <slot />
+</Button>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let group: (string | number)[] = [];
+@prop export let value: string | number = 'on';
+@prop export let checked: boolean | undefined = undefined;
+@prop export let inline: boolean = true;
+@prop export let pill: boolean = false;
+@prop export let outline: boolean = false;
+@prop export let size: SizeType | undefined = undefined;
+@prop export let color: ButtonColorType | undefined = undefined;
+@prop export let shadow: boolean = false;
+-->

package/dist/forms/CheckboxButton.svelte.d.ts

@@ -0,0 +1,54 @@
+import { SvelteComponent } from "svelte";
+import type { ButtonColorType, SizeType } from '../types';
+declare const __propDef: {
+    props: {
+        [x: string]: any;
+        group?: (string | number)[] | undefined;
+        value?: string | number | undefined;
+        checked?: boolean | undefined;
+        inline?: boolean | undefined;
+        pill?: boolean | undefined;
+        outline?: boolean | undefined;
+        size?: SizeType | undefined;
+        color?: ButtonColorType | undefined;
+        shadow?: boolean | undefined;
+    };
+    events: {
+        keyup: KeyboardEvent;
+        keydown: KeyboardEvent;
+        keypress: KeyboardEvent;
+        focus: FocusEvent;
+        blur: FocusEvent;
+        click: MouseEvent;
+        mouseover: MouseEvent;
+        mouseenter: MouseEvent;
+        mouseleave: MouseEvent;
+        paste: ClipboardEvent;
+        change: Event;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type CheckboxButtonProps = typeof __propDef.props;
+export type CheckboxButtonEvents = typeof __propDef.events;
+export type CheckboxButtonSlots = typeof __propDef.slots;
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let group: (string | number)[] = [];
+ * @prop export let value: string | number = 'on';
+ * @prop export let checked: boolean | undefined = undefined;
+ * @prop export let inline: boolean = true;
+ * @prop export let pill: boolean = false;
+ * @prop export let outline: boolean = false;
+ * @prop export let size: SizeType | undefined = undefined;
+ * @prop export let color: ButtonColorType | undefined = undefined;
+ * @prop export let shadow: boolean = false;
+ */
+export default class CheckboxButton extends SvelteComponent<CheckboxButtonProps, CheckboxButtonEvents, CheckboxButtonSlots> {
+}
+export {};
+//# sourceMappingURL=CheckboxButton.svelte.d.ts.map

package/dist/forms/CheckboxButton.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxButton.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/forms/CheckboxButton.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAED,OAAO,KAAK,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAkE5D,QAAA,MAAM,SAAS;;;;;kBADoN,OAAO,GAAG,SAAS;;;;eAA8D,QAAQ,GAAG,SAAS;gBAAU,eAAe,GAAG,SAAS;;;;;;;;;;;;;;;;;;;;;CAC/R,CAAC;AAC/E,MAAM,MAAM,mBAAmB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACzD,MAAM,MAAM,oBAAoB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAC3D,MAAM,MAAM,mBAAmB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEzD;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,eAAe,CAAC,mBAAmB,EAAE,oBAAoB,EAAE,mBAAmB,CAAC;CAC1H"}

package/dist/forms/FloatingLabelInput.svelte

@@ -6,7 +6,6 @@ export let type = 'text';
 export let size = 'default';
 export let color = 'base';
 export let value = undefined;
-export let label = '';
 const divClasses = {
     filled: 'relative',
     outlined: 'relative',
@@ -66,7 +65,7 @@ const labelColorClasses = {
   <input {id} {...$$restProps} bind:value on:blur on:change on:click on:focus on:input on:keydown on:keypress on:keyup on:mouseenter on:mouseleave on:mouseover on:paste {...{ type }} placeholder=" " class={twMerge(inputClasses[style], inputColorClasses[color], inputSizes[style][size], $$props.classInput)} />
 
   <label for={id} class={twMerge(labelClasses[style], labelColorClasses[color], labelSizes[style][size], $$props.classLabel)}>
-    {label}
+    <slot />
   </label>
 </div>
 
@@ -80,5 +79,4 @@ const labelColorClasses = {
 @prop export let size: 'small' | 'default' = 'default';
 @prop export let color: 'base' | 'green' | 'red' = 'base';
 @prop export let value: any = undefined;
-@prop export let label: string = '';
 -->

package/dist/forms/FloatingLabelInput.svelte.d.ts

@@ -9,7 +9,6 @@ declare const __propDef: {
         size?: "default" | "small" | undefined;
         color?: "red" | "green" | "base" | undefined;
         value?: any;
-        label?: string | undefined;
     };
     events: {
         blur: FocusEvent;
@@ -27,7 +26,9 @@ declare const __propDef: {
     } & {
         [evt: string]: CustomEvent<any>;
     };
-    slots: {};
+    slots: {
+        default: {};
+    };
 };
 export type FloatingLabelInputProps = typeof __propDef.props;
 export type FloatingLabelInputEvents = typeof __propDef.events;
@@ -41,7 +42,6 @@ export type FloatingLabelInputSlots = typeof __propDef.slots;
  * @prop export let size: 'small' | 'default' = 'default';
  * @prop export let color: 'base' | 'green' | 'red' = 'base';
  * @prop export let value: any = undefined;
- * @prop export let label: string = '';
  */
 export default class FloatingLabelInput extends SvelteComponent<FloatingLabelInputProps, FloatingLabelInputEvents, FloatingLabelInputSlots> {
 }

package/dist/forms/FloatingLabelInput.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingLabelInput.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/forms/FloatingLabelInput.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAGD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAwF1C,QAAA,MAAM,SAAS;;;;;;;;gBADqP,GAAG;;;;;;;;;;;;;;;;;;;;CACzL,CAAC;AAC/E,MAAM,MAAM,uBAAuB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC7D,MAAM,MAAM,wBAAwB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAC/D,MAAM,MAAM,uBAAuB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE7D;;;;;;;;;;GAUG;AACH,MAAM,CAAC,OAAO,OAAO,kBAAmB,SAAQ,eAAe,CAAC,uBAAuB,EAAE,wBAAwB,EAAE,uBAAuB,CAAC;CAC1I"}
+{"version":3,"file":"FloatingLabelInput.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/forms/FloatingLabelInput.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAGD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAuF1C,QAAA,MAAM,SAAS;;;;;;;;gBADsO,GAAG;;;;;;;;;;;;;;;;;;;;;CAC1K,CAAC;AAC/E,MAAM,MAAM,uBAAuB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC7D,MAAM,MAAM,wBAAwB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAC/D,MAAM,MAAM,uBAAuB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE7D;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,kBAAmB,SAAQ,eAAe,CAAC,uBAAuB,EAAE,wBAAwB,EAAE,uBAAuB,CAAC;CAC1I"}

package/dist/forms/RadioButton.svelte

@@ -0,0 +1,49 @@
+<script>import Button from '../buttons/Button.svelte';
+import { twMerge } from 'tailwind-merge';
+export let group = '';
+export let value = '';
+export let inline = true;
+// Button properties forwarding
+export let pill = false;
+export let outline = false;
+export let size = undefined;
+export let color = undefined;
+export let shadow = false;
+let buttonClass;
+$: buttonClass = twMerge(inline ? 'inline-flex' : 'flex', $$props.class);
+</script>
+
+<Button tag="label" checked={value === group} {pill} {outline} {size} {color} {shadow} class={buttonClass}>
+  <input
+    type="radio"
+    bind:group
+    {value}
+    {...$$restProps}
+    class="sr-only"
+    on:keyup
+    on:keydown
+    on:keypress
+    on:focus
+    on:blur
+    on:click
+    on:mouseover
+    on:mouseenter
+    on:mouseleave
+    on:paste
+    on:change />
+  <slot />
+</Button>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let group: string | number = '';
+@prop export let value: string | number = '';
+@prop export let inline: boolean = true;
+@prop export let pill: boolean = false;
+@prop export let outline: boolean = false;
+@prop export let size: SizeType | undefined = undefined;
+@prop export let color: ButtonColorType | undefined = undefined;
+@prop export let shadow: boolean = false;
+-->

package/dist/forms/RadioButton.svelte.d.ts

@@ -0,0 +1,52 @@
+import { SvelteComponent } from "svelte";
+import type { ButtonColorType, SizeType } from '../types';
+declare const __propDef: {
+    props: {
+        [x: string]: any;
+        group?: string | number | undefined;
+        value?: string | number | undefined;
+        inline?: boolean | undefined;
+        pill?: boolean | undefined;
+        outline?: boolean | undefined;
+        size?: SizeType | undefined;
+        color?: ButtonColorType | undefined;
+        shadow?: boolean | undefined;
+    };
+    events: {
+        keyup: KeyboardEvent;
+        keydown: KeyboardEvent;
+        keypress: KeyboardEvent;
+        focus: FocusEvent;
+        blur: FocusEvent;
+        click: MouseEvent;
+        mouseover: MouseEvent;
+        mouseenter: MouseEvent;
+        mouseleave: MouseEvent;
+        paste: ClipboardEvent;
+        change: Event;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type RadioButtonProps = typeof __propDef.props;
+export type RadioButtonEvents = typeof __propDef.events;
+export type RadioButtonSlots = typeof __propDef.slots;
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let group: string | number = '';
+ * @prop export let value: string | number = '';
+ * @prop export let inline: boolean = true;
+ * @prop export let pill: boolean = false;
+ * @prop export let outline: boolean = false;
+ * @prop export let size: SizeType | undefined = undefined;
+ * @prop export let color: ButtonColorType | undefined = undefined;
+ * @prop export let shadow: boolean = false;
+ */
+export default class RadioButton extends SvelteComponent<RadioButtonProps, RadioButtonEvents, RadioButtonSlots> {
+}
+export {};
+//# sourceMappingURL=RadioButton.svelte.d.ts.map

package/dist/forms/RadioButton.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/forms/RadioButton.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAED,OAAO,KAAK,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAgC5D,QAAA,MAAM,SAAS;;;;;;;;eAD+O,QAAQ,GAAG,SAAS;gBAAU,eAAe,GAAG,SAAS;;;;;;;;;;;;;;;;;;;;;CACzO,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;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,eAAe,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;CAC9G"}

package/dist/index.d.ts

@@ -32,6 +32,7 @@ export { default as FooterIcon } from "./footer/FooterIcon.svelte";
 export { default as FooterLink } from "./footer/FooterLink.svelte";
 export { default as FooterLinkGroup } from "./footer/FooterLinkGroup.svelte";
 export { default as Checkbox } from "./forms/Checkbox.svelte";
+export { default as CheckboxButton } from "./forms/CheckboxButton.svelte";
 export { default as Dropzone } from "./forms/Dropzone.svelte";
 export { default as Fileupload } from "./forms/Fileupload.svelte";
 export { default as FloatingLabelInput } from "./forms/FloatingLabelInput.svelte";
@@ -42,6 +43,7 @@ export { default as Label } from "./forms/Label.svelte";
 export { default as MultiSelect } from "./forms/MultiSelect.svelte";
 export { default as NumberInput } from "./forms/NumberInput.svelte";
 export { default as Radio } from "./forms/Radio.svelte";
+export { default as RadioButton } from "./forms/RadioButton.svelte";
 export { default as Range } from "./forms/Range.svelte";
 export { default as Search } from "./forms/Search.svelte";
 export { default as Select } from "./forms/Select.svelte";
@@ -111,9 +113,6 @@ export { default as Activity } from "./timeline/Activity.svelte";
 export { default as ActivityItem } from "./timeline/ActivityItem.svelte";
 export { default as Timeline } from "./timeline/Timeline.svelte";
 export { default as TimelineItem } from "./timeline/TimelineItem.svelte";
-export { default as TimelineHorizontal } from "./timeline/TimelineHorizontal.svelte";
-export { default as TimelineItemHorizontal } from "./timeline/TimelineItemHorizontal.svelte";
-export { default as TimelineItemVertical } from "./timeline/TimelineItemVertical.svelte";
 export { default as Toast } from "./toast/Toast.svelte";
 export { default as Toolbar } from "./toolbar/Toolbar.svelte";
 export { default as ToolbarButton } from "./toolbar/ToolbarButton.svelte";

package/dist/index.js

@@ -69,6 +69,7 @@ export { default as FooterLinkGroup } from './footer/FooterLinkGroup.svelte';
 
 // Forms
 export { default as Checkbox } from './forms/Checkbox.svelte';
+export { default as CheckboxButton } from './forms/CheckboxButton.svelte';
 export { default as Dropzone } from './forms/Dropzone.svelte';
 export { default as Fileupload } from './forms/Fileupload.svelte';
 export { default as FloatingLabelInput } from './forms/FloatingLabelInput.svelte';
@@ -79,6 +80,7 @@ export { default as Label } from './forms/Label.svelte';
 export { default as MultiSelect } from './forms/MultiSelect.svelte';
 export { default as NumberInput } from './forms/NumberInput.svelte';
 export { default as Radio } from './forms/Radio.svelte';
+export { default as RadioButton } from './forms/RadioButton.svelte';
 export { default as Range } from './forms/Range.svelte';
 export { default as Search } from './forms/Search.svelte';
 export { default as Select } from './forms/Select.svelte';
@@ -188,9 +190,6 @@ export { default as Activity } from './timeline/Activity.svelte';
 export { default as ActivityItem } from './timeline/ActivityItem.svelte';
 export { default as Timeline } from './timeline/Timeline.svelte';
 export { default as TimelineItem } from './timeline/TimelineItem.svelte';
-export { default as TimelineHorizontal } from './timeline/TimelineHorizontal.svelte';
-export { default as TimelineItemHorizontal } from './timeline/TimelineItemHorizontal.svelte';
-export { default as TimelineItemVertical } from './timeline/TimelineItemVertical.svelte';
 
 // Toast
 export { default as Toast } from './toast/Toast.svelte';

package/dist/indicators/Indicator.svelte

@@ -67,6 +67,6 @@ $: dotClass = twMerge('flex-shrink-0', rounded ? 'rounded' : 'rounded-full', bor
 @prop export let rounded: boolean = false;
 @prop export let size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md';
 @prop export let border: boolean = false;
-@prop export let placement: PlacementType | undefined = undefined;
+@prop export let placement: IndicatorPlacementType | undefined = undefined;
 @prop export let offset: boolean = true;
 -->

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

@@ -1,5 +1,5 @@
 import { SvelteComponent } from "svelte";
-import type { PlacementType } from '../types';
+import type { IndicatorPlacementType } from '../types';
 declare const __propDef: {
     props: {
         [x: string]: any;
@@ -7,7 +7,7 @@ declare const __propDef: {
         rounded?: boolean | undefined;
         size?: "xs" | "sm" | "lg" | "xl" | "md" | undefined;
         border?: boolean | undefined;
-        placement?: PlacementType | undefined;
+        placement?: IndicatorPlacementType | undefined;
         offset?: boolean | undefined;
     };
     events: {
@@ -27,7 +27,7 @@ export type IndicatorSlots = typeof __propDef.slots;
  * @prop export let rounded: boolean = false;
  * @prop export let size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md';
  * @prop export let border: boolean = false;
- * @prop export let placement: PlacementType | undefined = undefined;
+ * @prop export let placement: IndicatorPlacementType | undefined = undefined;
  * @prop export let offset: boolean = true;
  */
 export default class Indicator extends SvelteComponent<IndicatorProps, IndicatorEvents, IndicatorSlots> {

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

@@ -1 +1 @@
-{"version":3,"file":"Indicator.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/indicators/Indicator.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAED,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAiF9C,QAAA,MAAM,SAAS;;;;;;;oBADmO,aAAa,GAAG,SAAS;;;;;;;;;CAC7L,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;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,eAAe,CAAC,cAAc,EAAE,eAAe,EAAE,cAAc,CAAC;CACtG"}
+{"version":3,"file":"Indicator.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/indicators/Indicator.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AACD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAkFzD,QAAA,MAAM,SAAS;;;;;;;oBADmO,sBAAsB,GAAG,SAAS;;;;;;;;;CACtM,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;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,eAAe,CAAC,cAAc,EAAE,eAAe,EAAE,cAAc,CAAC;CACtG"}

package/dist/modal/Modal.svelte

@@ -74,7 +74,7 @@ const hide = (e) => {
     open = false;
 };
 let frameClass;
-$: frameClass = twMerge(defaultClass, 'w-full', $$props.class);
+$: frameClass = twMerge(defaultClass, 'w-full divide-y', $$props.class);
 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];
 let backdropCls = twMerge(backdropClass, $$props.classBackdrop);
 function handleKeys(e) {
@@ -94,7 +94,7 @@ function handleKeys(e) {
       <Frame rounded shadow {...$$restProps} class={frameClass}>
         <!-- Modal header -->
         {#if $$slots.header || title}
-          <Frame color={$$restProps.color} class="flex justify-between items-center p-4 rounded-t border-b">
+          <Frame color={$$restProps.color} class="flex justify-between items-center p-4 rounded-t">
             <slot name="header">
               <h3 class="text-xl font-semibold {$$restProps.color ? '' : 'text-gray-900 dark:text-white'} p-0">
                 {title}
@@ -111,7 +111,7 @@ function handleKeys(e) {
         </div>
         <!-- Modal footer -->
         {#if $$slots.footer}
-          <Frame color={$$restProps.color} class="flex items-center p-6 space-x-2 rounded-b border-t">
+          <Frame color={$$restProps.color} class="flex items-center p-6 space-x-2 rounded-b">
             <slot name="footer" />
           </Frame>
         {/if}

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

@@ -1,5 +1,6 @@
 import { SvelteComponent } from "svelte";
 import type { Dismissable, SizeType } from '../types';
+import type { ModalPlacementType } from '../types';
 declare const __propDef: {
     props: import("svelte/elements").HTMLAnchorAttributes & {
         tag?: string | undefined;
@@ -18,11 +19,15 @@ declare const __propDef: {
         open?: boolean | undefined;
         title?: string | undefined;
         size?: SizeType | undefined;
-        placement?: "top-left" | "top-center" | "top-right" | "center-left" | "center" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right" | undefined;
+        placement?: ModalPlacementType | undefined;
         autoclose?: boolean | undefined;
         backdropClass?: string | undefined;
+        bodyClass?: string | undefined;
+        classBackdrop?: string | undefined;
+        classDialog?: string | undefined;
         defaultClass?: string | undefined;
         outsideclose?: boolean | undefined;
+        dialogClass?: string | undefined;
     };
     events: {
         wheel: WheelEvent;

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/modal/Modal.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAMD,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AA0JxD,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;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,eAAe,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CACtF"}
+{"version":3,"file":"Modal.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/modal/Modal.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAMD,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACxD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AA8JnD,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;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,eAAe,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CACtF"}

package/dist/navbar/NavContainer.svelte

@@ -0,0 +1,14 @@
+<script>import { twMerge } from 'tailwind-merge';
+export let fluid = false;
+</script>
+
+<div class={twMerge('mx-auto flex flex-wrap justify-between items-center ', fluid ? 'w-full' : 'container', $$props.class)}>
+  <slot />
+</div>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let fluid: boolean = false;
+-->

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

@@ -0,0 +1,25 @@
+import { SvelteComponent } from "svelte";
+import type { HTMLAttributes } from 'svelte/elements';
+declare const __propDef: {
+    props: HTMLAttributes<HTMLDivElement> & {
+        fluid?: boolean | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type NavContainerProps = typeof __propDef.props;
+export type NavContainerEvents = typeof __propDef.events;
+export type NavContainerSlots = typeof __propDef.slots;
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let fluid: boolean = false;
+ */
+export default class NavContainer extends SvelteComponent<NavContainerProps, NavContainerEvents, NavContainerSlots> {
+}
+export {};
+//# sourceMappingURL=NavContainer.svelte.d.ts.map

package/dist/navbar/NavContainer.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavContainer.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/navbar/NavContainer.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AACD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAsBtD,QAAA,MAAM,SAAS;;;;;;;;;;CAAwC,CAAC;AACxD,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;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CAClH"}

package/dist/navbar/NavHamburger.svelte

@@ -1,11 +1,16 @@
-<script>import ToolbarButton from '../toolbar/ToolbarButton.svelte';
+<script>import { getContext } from 'svelte';
+import { writable } from 'svelte/store';
 import { twMerge } from 'tailwind-merge';
+import ToolbarButton from '../toolbar/ToolbarButton.svelte';
 import Menu from './Menu.svelte';
-export let btnClass = 'ml-3 md:hidden';
 export let menuClass = 'h-6 w-6 shrink-0';
+export let onClick = undefined;
+let btnClass = 'ml-3 md:hidden';
+let hiddenStore = getContext('navHidden') ?? writable(true);
+const toggle = (ev) => hiddenStore.update((h) => !h);
 </script>
 
-<ToolbarButton name="Open main menu" on:click {...$$restProps} class={twMerge(btnClass, $$props.class)}>
+<ToolbarButton name="Open main menu" on:click={onClick || toggle} {...$$restProps} class={twMerge(btnClass, $$props.class)}>
   <Menu class={twMerge(menuClass, $$props.classMenu)} />
 </ToolbarButton>
 
@@ -13,6 +18,6 @@ export let menuClass = 'h-6 w-6 shrink-0';
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
-@prop export let btnClass: string = 'ml-3 md:hidden';
 @prop export let menuClass: string = 'h-6 w-6 shrink-0';
+@prop export let onClick: (() => void) | undefined = undefined;
 -->

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

@@ -2,12 +2,10 @@ import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        btnClass?: string | undefined;
         menuClass?: string | undefined;
+        onClick?: (() => void) | undefined;
     };
     events: {
-        click: MouseEvent;
-    } & {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
@@ -18,8 +16,8 @@ export type NavHamburgerSlots = typeof __propDef.slots;
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop export let btnClass: string = 'ml-3 md:hidden';
  * @prop export let menuClass: string = 'h-6 w-6 shrink-0';
+ * @prop export let onClick: (() => void) | undefined = undefined;
  */
 export default class NavHamburger extends SvelteComponent<NavHamburgerProps, NavHamburgerEvents, NavHamburgerSlots> {
 }

package/dist/navbar/NavHamburger.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavHamburger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/navbar/NavHamburger.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAsBD,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;;;;;GAKG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CAClH"}
+{"version":3,"file":"NavHamburger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/navbar/NavHamburger.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AA+BD,QAAA,MAAM,SAAS;;;;kBAD6E,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS;;;;;;CACtC,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;;;;;GAKG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CAClH"}