flowbite-svelte 0.46.1 → 0.46.3

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

@@ -36,4 +36,3 @@ export type FooterBrandSlots = typeof __propDef.slots;
 export default class FooterBrand extends SvelteComponentTyped<FooterBrandProps, FooterBrandEvents, FooterBrandSlots> {
 }
 export {};
-//# sourceMappingURL=FooterBrand.svelte.d.ts.map

package/dist/footer/FooterCopyright.svelte

@@ -1,11 +1,11 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let spanClass = 'block text-sm text-gray-500 sm:text-center dark:text-gray-400';
-export let aClass = 'hover:underline';
-export let year = new Date().getFullYear();
-export let href = '';
-export let by = '';
-export let target = undefined;
-export let copyrightMessage = 'All Rights Reserved.';
+<script>import { twMerge } from "tailwind-merge";
+export let spanClass = "block text-sm text-gray-500 sm:text-center dark:text-gray-400";
+export let aClass = "hover:underline";
+export let year = (/* @__PURE__ */ new Date()).getFullYear();
+export let href = "";
+export let by = "";
+export let target = void 0;
+export let copyrightMessage = "All Rights Reserved.";
 let spanCls = twMerge(spanClass, $$props.classSpan);
 let aCls = twMerge(aClass, $$props.classA);
 </script>

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

@@ -32,4 +32,3 @@ export type FooterCopyrightSlots = typeof __propDef.slots;
 export default class FooterCopyright extends SvelteComponentTyped<FooterCopyrightProps, FooterCopyrightEvents, FooterCopyrightSlots> {
 }
 export {};
-//# sourceMappingURL=FooterCopyright.svelte.d.ts.map

package/dist/footer/FooterIcon.svelte

@@ -1,8 +1,8 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let href = '';
-export let ariaLabel = '';
-export let aClass = 'text-gray-500 hover:text-gray-900 dark:hover:text-white';
-export let target = undefined;
+<script>import { twMerge } from "tailwind-merge";
+export let href = "";
+export let ariaLabel = "";
+export let aClass = "text-gray-500 hover:text-gray-900 dark:hover:text-white";
+export let target = void 0;
 </script>
 
 {#if href}

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

@@ -28,4 +28,3 @@ export type FooterIconSlots = typeof __propDef.slots;
 export default class FooterIcon extends SvelteComponentTyped<FooterIconProps, FooterIconEvents, FooterIconSlots> {
 }
 export {};
-//# sourceMappingURL=FooterIcon.svelte.d.ts.map

package/dist/footer/FooterLink.svelte

@@ -1,8 +1,8 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let liClass = 'me-4 last:me-0 md:me-6';
-export let aClass = 'hover:underline';
-export let href = '';
-export let target = undefined;
+<script>import { twMerge } from "tailwind-merge";
+export let liClass = "me-4 last:me-0 md:me-6";
+export let aClass = "hover:underline";
+export let href = "";
+export let target = void 0;
 let liCls = twMerge(liClass, $$props.classLi);
 let aCls = twMerge(aClass, $$props.classA);
 </script>

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

@@ -28,4 +28,3 @@ export type FooterLinkSlots = typeof __propDef.slots;
 export default class FooterLink extends SvelteComponentTyped<FooterLinkProps, FooterLinkEvents, FooterLinkSlots> {
 }
 export {};
-//# sourceMappingURL=FooterLink.svelte.d.ts.map

package/dist/footer/FooterLinkGroup.svelte

@@ -1,5 +1,5 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let ulClass = 'text-gray-600 dark:text-gray-400';
+<script>import { twMerge } from "tailwind-merge";
+export let ulClass = "text-gray-600 dark:text-gray-400";
 </script>
 
 <ul class={twMerge(ulClass, $$props.class)}>

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

@@ -22,4 +22,3 @@ export type FooterLinkGroupSlots = typeof __propDef.slots;
 export default class FooterLinkGroup extends SvelteComponentTyped<FooterLinkGroupProps, FooterLinkGroupEvents, FooterLinkGroupSlots> {
 }
 export {};
-//# sourceMappingURL=FooterLinkGroup.svelte.d.ts.map

package/dist/forms/Checkbox.svelte

@@ -1,47 +1,38 @@
-<script>import { twMerge } from 'tailwind-merge';
-import { getContext } from 'svelte';
-import { labelClass, inputClass } from './Radio.svelte';
-import Label from './Label.svelte';
-// properties forwarding
-export let color = 'primary';
+<script>import { twMerge } from "tailwind-merge";
+import { getContext } from "svelte";
+import { labelClass, inputClass } from "./Radio.svelte";
+import Label from "./Label.svelte";
+export let color = "primary";
 export let custom = false;
 export let inline = false;
 export let group = [];
-export let value = 'on';
-export let checked = undefined;
-export let spacing = $$slots.default ? 'me-2' : '';
-// tinted if put in component having its own background
-let background = getContext('background');
-// react on external group changes
+export let value = "on";
+export let checked = void 0;
+export let spacing = $$slots.default ? "me-2" : "";
+let background = getContext("background");
 function init(_, _group) {
-    if (checked === undefined)
-        checked = _group.includes(value);
-    onChange();
-    return {
-        update(_group) {
-            checked = _group.includes(value);
-        }
-    };
+  if (checked === void 0) checked = _group.includes(value);
+  onChange();
+  return {
+    update(_group2) {
+      checked = _group2.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;
-        }
+  const index = group.indexOf(value);
+  if (checked === void 0) checked = index >= 0;
+  if (checked) {
+    if (index < 0) {
+      group.push(value);
+      group = group;
     }
-    else {
-        if (index >= 0) {
-            group.splice(index, 1);
-            group = group;
-        }
+  } else {
+    if (index >= 0) {
+      group.splice(index, 1);
+      group = group;
     }
+  }
 }
 </script>
 

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

@@ -47,4 +47,3 @@ export type CheckboxSlots = typeof __propDef.slots;
 export default class Checkbox extends SvelteComponentTyped<CheckboxProps, CheckboxEvents, CheckboxSlots> {
 }
 export {};
-//# sourceMappingURL=Checkbox.svelte.d.ts.map

package/dist/forms/CheckboxButton.svelte

@@ -1,48 +1,40 @@
-<script>import Button from '../buttons/Button.svelte';
-import { twMerge } from 'tailwind-merge';
+<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 value = "on";
+export let checked = void 0;
 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 size = void 0;
+export let color = void 0;
 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);
-        }
-    };
+  if (checked === void 0) checked = _group.includes(value);
+  onChange();
+  return {
+    update(_group2) {
+      checked = _group2.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;
-        }
+  const index = group.indexOf(value);
+  if (checked === void 0) checked = index >= 0;
+  if (checked) {
+    if (index < 0) {
+      group.push(value);
+      group = group;
     }
-    else {
-        if (index >= 0) {
-            group.splice(index, 1);
-            group = group;
-        }
+  } else {
+    if (index >= 0) {
+      group.splice(index, 1);
+      group = group;
     }
+  }
 }
 let buttonClass;
-$: buttonClass = twMerge(inline ? 'inline-flex' : 'flex', $$props.class);
+$: buttonClass = twMerge(inline ? "inline-flex" : "flex", $$props.class);
 </script>
 
 <Button tag="label" {checked} {pill} {outline} {size} {color} {shadow} class={buttonClass}>

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

@@ -51,4 +51,3 @@ export type CheckboxButtonSlots = typeof __propDef.slots;
 export default class CheckboxButton extends SvelteComponentTyped<CheckboxButtonProps, CheckboxButtonEvents, CheckboxButtonSlots> {
 }
 export {};
-//# sourceMappingURL=CheckboxButton.svelte.d.ts.map

package/dist/forms/Dropzone.svelte

@@ -1,17 +1,17 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let value = '';
-export let files = undefined;
-export let defaultClass = 'flex flex-col justify-center items-center w-full h-64 bg-gray-50 rounded-lg border-2 border-gray-300 border-dashed cursor-pointer dark:hover:bg-bray-800 dark:bg-gray-700 hover:bg-gray-100 dark:border-gray-600 dark:hover:border-gray-500 dark:hover:bg-gray-600';
+<script>import { twMerge } from "tailwind-merge";
+export let value = "";
+export let files = void 0;
+export let defaultClass = "flex flex-col justify-center items-center w-full h-64 bg-gray-50 rounded-lg border-2 border-gray-300 border-dashed cursor-pointer dark:hover:bg-bray-800 dark:bg-gray-700 hover:bg-gray-100 dark:border-gray-600 dark:hover:border-gray-500 dark:hover:bg-gray-600";
 let input;
 function keydown(ev) {
-    if ([' ', 'Enter'].includes(ev.key)) {
-        ev.preventDefault();
-        input.click();
-    }
+  if ([" ", "Enter"].includes(ev.key)) {
+    ev.preventDefault();
+    input.click();
+  }
 }
 function onClick(event) {
-    event.preventDefault();
-    input.click();
+  event.preventDefault();
+  input.click();
 }
 </script>
 

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

@@ -38,4 +38,3 @@ export type DropzoneSlots = typeof __propDef.slots;
 export default class Dropzone extends SvelteComponentTyped<DropzoneProps, DropzoneEvents, DropzoneSlots> {
 }
 export {};
-//# sourceMappingURL=Dropzone.svelte.d.ts.map

package/dist/forms/Fileupload.svelte

@@ -1,8 +1,8 @@
-<script>import { twMerge } from 'tailwind-merge';
-import Input from './Input.svelte';
-export let value = '';
-export let files = undefined;
-export let inputClass = 'border !p-0 dark:text-gray-400';
+<script>import { twMerge } from "tailwind-merge";
+import Input from "./Input.svelte";
+export let value = "";
+export let files = void 0;
+export let inputClass = "border !p-0 dark:text-gray-400";
 </script>
 
 <Input {...$$restProps} class={twMerge(inputClass, $$props.class)} let:props>

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

@@ -36,4 +36,3 @@ export type FileuploadSlots = typeof __propDef.slots;
 export default class Fileupload extends SvelteComponentTyped<FileuploadProps, FileuploadEvents, FileuploadSlots> {
 }
 export {};
-//# sourceMappingURL=Fileupload.svelte.d.ts.map

package/dist/forms/FloatingLabelInput.svelte

@@ -1,63 +1,63 @@
-<script>import { twMerge } from 'tailwind-merge';
-import generateId from '../utils/generateId.js';
+<script>import { twMerge } from "tailwind-merge";
+import generateId from "../utils/generateId.js";
 export let id = generateId();
-export let style = 'standard';
-export let type = 'text';
-export let size = 'default';
-export let color = 'base';
-export let value = undefined;
+export let style = "standard";
+export let type = "text";
+export let size = "default";
+export let color = "base";
+export let value = void 0;
 const divClasses = {
-    filled: 'relative',
-    outlined: 'relative',
-    standard: 'relative z-0'
+  filled: "relative",
+  outlined: "relative",
+  standard: "relative z-0"
 };
 const inputSizes = {
-    filled: {
-        small: 'px-2.5 pb-1.5 pt-4',
-        default: 'px-2.5 pb-2.5 pt-5'
-    },
-    outlined: {
-        small: 'px-2.5 pb-1.5 pt-3',
-        default: 'px-2.5 pb-2.5 pt-4'
-    },
-    standard: {
-        small: 'py-2 px-0',
-        default: 'py-2.5 px-0'
-    }
+  filled: {
+    small: "px-2.5 pb-1.5 pt-4",
+    default: "px-2.5 pb-2.5 pt-5"
+  },
+  outlined: {
+    small: "px-2.5 pb-1.5 pt-3",
+    default: "px-2.5 pb-2.5 pt-4"
+  },
+  standard: {
+    small: "py-2 px-0",
+    default: "py-2.5 px-0"
+  }
 };
 const labelSizes = {
-    filled: {
-        small: 'top-3',
-        default: 'top-4'
-    },
-    outlined: {
-        small: 'top-1',
-        default: 'top-2'
-    },
-    standard: {
-        small: 'top-3',
-        default: 'top-3'
-    }
+  filled: {
+    small: "top-3",
+    default: "top-4"
+  },
+  outlined: {
+    small: "top-1",
+    default: "top-2"
+  },
+  standard: {
+    small: "top-3",
+    default: "top-3"
+  }
 };
 const inputClasses = {
-    filled: 'block rounded-t-lg w-full text-sm text-gray-900 bg-gray-50 dark:bg-gray-700 border-0 border-b-2 appearance-none dark:text-white focus:outline-none focus:ring-0 peer',
-    outlined: 'block w-full text-sm text-gray-900 bg-transparent rounded-lg border-1 appearance-none dark:text-white  focus:outline-none focus:ring-0 peer',
-    standard: 'block w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 appearance-none dark:text-white  focus:outline-none focus:ring-0 peer'
+  filled: "block rounded-t-lg w-full text-sm text-gray-900 bg-gray-50 dark:bg-gray-700 border-0 border-b-2 appearance-none dark:text-white focus:outline-none focus:ring-0 peer",
+  outlined: "block w-full text-sm text-gray-900 bg-transparent rounded-lg border-1 appearance-none dark:text-white  focus:outline-none focus:ring-0 peer",
+  standard: "block w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 appearance-none dark:text-white  focus:outline-none focus:ring-0 peer"
 };
 const labelClasses = {
-    filled: 'absolute text-sm duration-300 transform -translate-y-4 scale-75 top-4 z-10 origin-left rtl:origin-right start-2.5  peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-4',
-    outlined: 'absolute text-sm duration-300 transform -translate-y-4 scale-75 top-2 z-10 origin-left rtl:origin-right bg-white dark:bg-gray-900 px-2 peer-focus:px-2  peer-placeholder-shown:scale-100 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:top-1/2 peer-focus:top-2 peer-focus:scale-75 peer-focus:-translate-y-4 start-1',
-    standard: 'absolute text-sm duration-300 transform -translate-y-6 scale-75 top-3 -z-10 origin-left rtl:origin-right peer-focus:start-0  peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6'
+  filled: "absolute text-sm duration-300 transform -translate-y-4 scale-75 top-4 z-10 origin-left rtl:origin-right start-2.5  peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-4",
+  outlined: "absolute text-sm duration-300 transform -translate-y-4 scale-75 top-2 z-10 origin-left rtl:origin-right bg-white dark:bg-gray-900 px-2 peer-focus:px-2  peer-placeholder-shown:scale-100 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:top-1/2 peer-focus:top-2 peer-focus:scale-75 peer-focus:-translate-y-4 start-1",
+  standard: "absolute text-sm duration-300 transform -translate-y-6 scale-75 top-3 -z-10 origin-left rtl:origin-right peer-focus:start-0  peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6"
 };
 const inputColorClasses = {
-    base: 'border-gray-300 dark:border-gray-600 dark:focus:border-primary-500 focus:border-primary-600',
-    green: 'border-green-600 dark:border-green-500 dark:focus:border-green-500 focus:border-green-600',
-    red: 'border-red-600 dark:border-red-500 dark:focus:border-red-500  focus:border-red-600'
+  base: "border-gray-300 dark:border-gray-600 dark:focus:border-primary-500 focus:border-primary-600",
+  green: "border-green-600 dark:border-green-500 dark:focus:border-green-500 focus:border-green-600",
+  red: "border-red-600 dark:border-red-500 dark:focus:border-red-500  focus:border-red-600"
 };
 const labelColorClasses = {
-    base: 'text-gray-500 dark:text-gray-400 peer-focus:text-primary-600 peer-focus:dark:text-primary-500',
-    green: 'text-green-600 dark:text-green-500',
-    red: 'text-red-600 dark:text-red-500'
+  base: "text-gray-500 dark:text-gray-400 peer-focus:text-primary-600 peer-focus:dark:text-primary-500",
+  green: "text-green-600 dark:text-green-500",
+  red: "text-red-600 dark:text-red-500"
 };
 </script>
 

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

@@ -46,4 +46,3 @@ export type FloatingLabelInputSlots = typeof __propDef.slots;
 export default class FloatingLabelInput extends SvelteComponentTyped<FloatingLabelInputProps, FloatingLabelInputEvents, FloatingLabelInputSlots> {
 }
 export {};
-//# sourceMappingURL=FloatingLabelInput.svelte.d.ts.map

package/dist/forms/Helper.svelte

@@ -1,11 +1,11 @@
-<script>import { twMerge } from 'tailwind-merge';
-export let helperClass = 'text-xs font-normal text-gray-500 dark:text-gray-300';
-export let color = 'gray';
+<script>import { twMerge } from "tailwind-merge";
+export let helperClass = "text-xs font-normal text-gray-500 dark:text-gray-300";
+export let color = "gray";
 const colorClasses = {
-    gray: 'text-gray-900 dark:text-gray-300',
-    green: 'text-green-700 dark:text-green-500',
-    red: 'text-red-700 dark:text-red-500',
-    disabled: 'text-gray-400 dark:text-gray-500'
+  gray: "text-gray-900 dark:text-gray-300",
+  green: "text-green-700 dark:text-green-500",
+  red: "text-red-700 dark:text-red-500",
+  disabled: "text-gray-400 dark:text-gray-500"
 };
 </script>
 

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

@@ -24,4 +24,3 @@ export type HelperSlots = typeof __propDef.slots;
 export default class Helper extends SvelteComponentTyped<HelperProps, HelperEvents, HelperSlots> {
 }
 export {};
-//# sourceMappingURL=Helper.svelte.d.ts.map

package/dist/forms/Input.svelte

@@ -1,46 +1,45 @@
 <script context="module">export function clampSize(s) {
-    return s && s === 'xs' ? 'sm' : s === 'xl' ? 'lg' : s;
+  return s && s === "xs" ? "sm" : s === "xl" ? "lg" : s;
 }
 </script>
 
-<script>import Wrapper from '../utils/Wrapper.svelte';
-import { twMerge } from 'tailwind-merge';
-import { getContext } from 'svelte';
-export let type = 'text';
-export let value = undefined;
-export let size = undefined;
-export let defaultClass = 'block w-full disabled:cursor-not-allowed disabled:opacity-50 rtl:text-right';
-export let color = 'base';
-export let floatClass = 'flex absolute inset-y-0 items-center text-gray-500 dark:text-gray-400';
+<script>import Wrapper from "../utils/Wrapper.svelte";
+import { twMerge } from "tailwind-merge";
+import { getContext } from "svelte";
+export let type = "text";
+export let value = void 0;
+export let size = void 0;
+export let defaultClass = "block w-full disabled:cursor-not-allowed disabled:opacity-50 rtl:text-right";
+export let color = "base";
+export let floatClass = "flex absolute inset-y-0 items-center text-gray-500 dark:text-gray-400";
 const borderClasses = {
-    base: 'border-gray-300 dark:border-gray-600',
-    tinted: 'border-gray-300 dark:border-gray-500',
-    green: 'border-green-500 dark:border-green-400',
-    red: 'border-red-500 dark:border-red-400'
+  base: "border-gray-300 dark:border-gray-600",
+  tinted: "border-gray-300 dark:border-gray-500",
+  green: "border-green-500 dark:border-green-400",
+  red: "border-red-500 dark:border-red-400"
 };
 const ringClasses = {
-    base: 'focus:border-primary-500 focus:ring-primary-500 dark:focus:border-primary-500 dark:focus:ring-primary-500',
-    green: 'focus:ring-green-500 focus:border-green-500 dark:focus:border-green-500 dark:focus:ring-green-500',
-    red: 'focus:ring-red-500 focus:border-red-500 dark:focus:ring-red-500 dark:focus:border-red-500'
+  base: "focus:border-primary-500 focus:ring-primary-500 dark:focus:border-primary-500 dark:focus:ring-primary-500",
+  green: "focus:ring-green-500 focus:border-green-500 dark:focus:border-green-500 dark:focus:ring-green-500",
+  red: "focus:ring-red-500 focus:border-red-500 dark:focus:ring-red-500 dark:focus:border-red-500"
 };
 const colorClasses = {
-    base: 'bg-gray-50 text-gray-900 dark:bg-gray-700 dark:text-white dark:placeholder-gray-400',
-    tinted: 'bg-gray-50 text-gray-900 dark:bg-gray-600 dark:text-white dark:placeholder-gray-400',
-    green: 'bg-green-50 text-green-900 placeholder-green-700 dark:text-green-400 dark:placeholder-green-500 dark:bg-gray-700',
-    red: 'bg-red-50 text-red-900 placeholder-red-700 dark:text-red-500 dark:placeholder-red-500 dark:bg-gray-700'
+  base: "bg-gray-50 text-gray-900 dark:bg-gray-700 dark:text-white dark:placeholder-gray-400",
+  tinted: "bg-gray-50 text-gray-900 dark:bg-gray-600 dark:text-white dark:placeholder-gray-400",
+  green: "bg-green-50 text-green-900 placeholder-green-700 dark:text-green-400 dark:placeholder-green-500 dark:bg-gray-700",
+  red: "bg-red-50 text-red-900 placeholder-red-700 dark:text-red-500 dark:placeholder-red-500 dark:bg-gray-700"
 };
-// tinted if put in component having its own background
-let background = getContext('background');
-let group = getContext('group');
-const textSizes = { sm: 'sm:text-xs', md: 'text-sm', lg: 'sm:text-base' };
-const leftPadding = { sm: 'ps-9', md: 'ps-10', lg: 'ps-11' };
-const rightPadding = { sm: 'pe-9', md: 'pe-10', lg: 'pe-11' };
-const inputPadding = { sm: 'p-2', md: 'p-2.5', lg: 'p-3' };
-$: _size = size || clampSize(group?.size) || 'md';
+let background = getContext("background");
+let group = getContext("group");
+const textSizes = { sm: "sm:text-xs", md: "text-sm", lg: "sm:text-base" };
+const leftPadding = { sm: "ps-9", md: "ps-10", lg: "ps-11" };
+const rightPadding = { sm: "pe-9", md: "pe-10", lg: "pe-11" };
+const inputPadding = { sm: "p-2", md: "p-2.5", lg: "p-3" };
+$: _size = size || clampSize(group?.size) || "md";
 let inputClass;
 $: {
-    const _color = color === 'base' && background ? 'tinted' : color;
-    inputClass = twMerge([defaultClass, inputPadding[_size], ($$slots.left && leftPadding[_size]) || ($$slots.right && rightPadding[_size]), ringClasses[color], colorClasses[_color], borderClasses[_color], textSizes[_size], group || 'rounded-lg', group && 'first:rounded-s-lg last:rounded-e-lg', group && 'border-s-0 first:border-s last:border-e', $$props.class]);
+  const _color = color === "base" && background ? "tinted" : color;
+  inputClass = twMerge([defaultClass, inputPadding[_size], $$slots.left && leftPadding[_size] || $$slots.right && rightPadding[_size], ringClasses[color], colorClasses[_color], borderClasses[_color], textSizes[_size], group || "rounded-lg", group && "first:rounded-s-lg last:rounded-e-lg", group && "[&:not(:first-child)]:-ms-px", $$props.class]);
 }
 </script>
 

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

@@ -55,4 +55,3 @@ export type InputSlots = typeof __propDef.slots;
 export default class Input extends SvelteComponentTyped<InputProps, InputEvents, InputSlots> {
 }
 export {};
-//# sourceMappingURL=Input.svelte.d.ts.map

package/dist/forms/InputAddon.svelte

@@ -1,28 +1,25 @@
-<script>import { twMerge } from 'tailwind-merge';
-import { getContext } from 'svelte';
-import { clampSize } from './Input.svelte';
-export let size = undefined;
-// tinted if put in component having its own background
-let background = getContext('background');
-let group = getContext('group');
+<script>import { twMerge } from "tailwind-merge";
+import { getContext } from "svelte";
+import { clampSize } from "./Input.svelte";
+export let size = void 0;
+let background = getContext("background");
+let group = getContext("group");
 const borderClasses = {
-    base: 'border-gray-300 dark:border-gray-600',
-    tinted: 'border-gray-300 dark:border-gray-500'
+  base: "border-gray-300 dark:border-gray-600",
+  tinted: "border-gray-300 dark:border-gray-500"
 };
 const darkBgClasses = {
-    base: 'dark:bg-gray-600 dark:text-gray-400',
-    tinted: 'dark:bg-gray-500 dark:text-gray-300'
+  base: "dark:bg-gray-600 dark:text-gray-400",
+  tinted: "dark:bg-gray-500 dark:text-gray-300"
 };
 const divider = {
-    base: 'dark:border-e-gray-700 dark:last:border-e-gray-600',
-    tinted: 'dark:border-e-gray-600 dark:last:border-e-gray-500'
+  base: "dark:border-e-gray-700 dark:last:border-e-gray-600",
+  tinted: "dark:border-e-gray-600 dark:last:border-e-gray-500"
 };
-const textSizes = { sm: 'sm:text-xs', md: 'text-sm', lg: 'sm:text-base' };
-const prefixPadding = { sm: 'px-2', md: 'px-3', lg: 'px-4' };
-// size: explicit, inherited, default
-$: _size = size || clampSize(group?.size) || 'md';
-$: divClass = twMerge(textSizes[_size], prefixPadding[_size], 'text-gray-500 bg-gray-200', background ? darkBgClasses.tinted : darkBgClasses.base, background ? divider.tinted : divider.base, background ? borderClasses['tinted'] : borderClasses['base'], 'inline-flex items-center border border-e-0', 'first:rounded-s-lg last:rounded-e-lg', $$props.class);
-console.log('borderClasses', borderClasses['base']);
+const textSizes = { sm: "sm:text-xs", md: "text-sm", lg: "sm:text-base" };
+const prefixPadding = { sm: "px-2", md: "px-3", lg: "px-4" };
+$: _size = size || clampSize(group?.size) || "md";
+$: divClass = twMerge(textSizes[_size], prefixPadding[_size], "text-gray-500 bg-gray-200", background ? darkBgClasses.tinted : darkBgClasses.base, background ? divider.tinted : divider.base, background ? borderClasses["tinted"] : borderClasses["base"], "inline-flex items-center border", group && "[&:not(:first-child)]:-ms-px", "first:rounded-s-lg last:rounded-e-lg", $$props.class);
 </script>
 
 <div {...$$restProps} class={divClass}>

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

@@ -22,4 +22,3 @@ export type InputAddonSlots = typeof __propDef.slots;
 export default class InputAddon extends SvelteComponentTyped<InputAddonProps, InputAddonEvents, InputAddonSlots> {
 }
 export {};
-//# sourceMappingURL=InputAddon.svelte.d.ts.map