flowbite-svelte 0.48.4 → 1.0.0-next.2

package/dist/typography/Span.svelte.d.ts

@@ -1,40 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { HTMLAttributes } from 'svelte/elements';
-declare const __propDef: {
-    props: HTMLAttributes<HTMLSpanElement> & {
-        italic?: boolean;
-        underline?: boolean;
-        linethrough?: boolean;
-        uppercase?: boolean;
-        gradient?: boolean;
-        highlight?: boolean;
-        highlightClass?: string;
-        decorationClass?: string;
-        gradientClass?: string;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export type SpanProps = typeof __propDef.props;
-export type SpanEvents = typeof __propDef.events;
-export type SpanSlots = typeof __propDef.slots;
-/**
- * [Go to docs](https://flowbite-svelte.com/)
- * ## Props
- * @prop export let italic: $$Props['italic'] = false;
- * @prop export let underline: $$Props['underline'] = false;
- * @prop export let linethrough: $$Props['linethrough'] = false;
- * @prop export let uppercase: $$Props['uppercase'] = false;
- * @prop export let gradient: $$Props['gradient'] = false;
- * @prop export let highlight: $$Props['highlight'] = false;
- * @prop export let highlightClass: $$Props['highlightClass'] = 'text-blue-600 dark:text-blue-500';
- * @prop export let decorationClass: $$Props['decorationClass'] = 'decoration-2 decoration-blue-400 dark:decoration-blue-600';
- * @prop export let gradientClass: $$Props['gradientClass'] = 'text-transparent bg-clip-text bg-linear-to-r to-emerald-600 from-sky-400';
- */
-export default class Span extends SvelteComponentTyped<SpanProps, SpanEvents, SpanSlots> {
-}
-export {};

package/dist/utils/Frame.svelte

@@ -1,116 +0,0 @@
-<script context="module">const bgColors = {
-  gray: "bg-gray-50 dark:bg-gray-800",
-  red: "bg-red-50 dark:bg-gray-800",
-  yellow: "bg-yellow-50 dark:bg-gray-800 ",
-  green: "bg-green-50 dark:bg-gray-800 ",
-  indigo: "bg-indigo-50 dark:bg-gray-800 ",
-  purple: "bg-purple-50 dark:bg-gray-800 ",
-  pink: "bg-pink-50 dark:bg-gray-800 ",
-  blue: "bg-blue-50 dark:bg-gray-800 ",
-  light: "bg-gray-50 dark:bg-gray-700",
-  dark: "bg-gray-50 dark:bg-gray-800",
-  default: "bg-white dark:bg-gray-800",
-  dropdown: "bg-white dark:bg-gray-700",
-  navbar: "bg-white dark:bg-gray-900",
-  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: ""
-};
-</script>
-
-<script>import { createEventDispatcher, setContext } from "svelte";
-import { twMerge } from "tailwind-merge";
-import {} from "svelte/transition";
-const noop = () => {
-};
-setContext("background", true);
-export let tag = $$restProps.href ? "a" : "div";
-export let color = "default";
-export let rounded = false;
-export let border = false;
-export let shadow = false;
-export let node = void 0;
-export let use = noop;
-export let options = {};
-export let role = void 0;
-export let transition = void 0;
-export let params = {};
-export let open = true;
-const dispatch = createEventDispatcher();
-$: dispatch(open ? "open" : "close");
-$: dispatch("show", open);
-$: color = color ?? "default";
-$: setContext("color", color);
-const textColors = {
-  gray: "text-gray-800 dark:text-gray-300",
-  red: "text-red-800 dark:text-red-400",
-  yellow: "text-yellow-800 dark:text-yellow-300",
-  green: "text-green-800 dark:text-green-400",
-  indigo: "text-indigo-800 dark:text-indigo-400",
-  purple: "text-purple-800 dark:text-purple-400",
-  pink: "text-pink-800 dark:text-pink-400",
-  blue: "text-blue-800 dark:text-blue-400",
-  light: "text-gray-700 dark:text-gray-300",
-  dark: "text-gray-700 dark:text-gray-300",
-  default: "text-gray-500 dark:text-gray-400",
-  dropdown: "text-gray-700 dark:text-gray-200",
-  navbar: "text-gray-700 dark:text-gray-200",
-  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 = {
-  gray: "border-gray-300 dark:border-gray-800 divide-gray-300 dark:divide-gray-800",
-  red: "border-red-300 dark:border-red-800 divide-red-300 dark:divide-red-800",
-  yellow: "border-yellow-300 dark:border-yellow-800 divide-yellow-300 dark:divide-yellow-800",
-  green: "border-green-300 dark:border-green-800 divide-green-300 dark:divide-green-800",
-  indigo: "border-indigo-300 dark:border-indigo-800 divide-indigo-300 dark:divide-indigo-800",
-  purple: "border-purple-300 dark:border-purple-800 divide-purple-300 dark:divide-purple-800",
-  pink: "border-pink-300 dark:border-pink-800 divide-pink-300 dark:divide-pink-800",
-  blue: "border-blue-300 dark:border-blue-800 divide-blue-300 dark:divide-blue-800",
-  light: "border-gray-500 divide-gray-500",
-  dark: "border-gray-500 divide-gray-500",
-  default: "border-gray-200 dark:border-gray-700 divide-gray-200 dark:divide-gray-700",
-  dropdown: "border-gray-100 dark:border-gray-600 divide-gray-100 dark:divide-gray-600",
-  navbar: "border-gray-100 dark:border-gray-700 divide-gray-100 dark:divide-gray-700",
-  navbarUl: "border-gray-100 dark:border-gray-700 divide-gray-100 dark:divide-gray-700",
-  form: "border-gray-300 dark:border-gray-700 divide-gray-300 dark:divide-gray-700",
-  primary: "border-primary-500 dark:border-primary-200  divide-primary-500 dark:divide-primary-200 ",
-  orange: "border-orange-300 dark:border-orange-800 divide-orange-300 dark:divide-orange-800",
-  none: ""
-};
-let divClass;
-$: divClass = twMerge(bgColors[color], textColors[color], rounded && "rounded-lg", border && "border", borderColors[color], shadow && "shadow-md", $$props.class);
-</script>
-
-{#if transition && open}
-  <svelte:element this={tag} transition:transition={params} use:use={options} bind:this={node} {role} {...$$restProps} class={divClass} on:click on:mouseenter on:mouseleave on:focusin on:focusout>
-    <slot />
-  </svelte:element>
-{:else if open}
-  <svelte:element this={tag} use:use={options} bind:this={node} {role} {...$$restProps} class={divClass} on:click on:mouseenter on:mouseleave on:focusin on:focusout>
-    <slot />
-  </svelte:element>
-{/if}
-
-<!--
-@component
-[Go to docs](https://flowbite-svelte.com/)
-## Props
-@prop export let tag: string = $$restProps.href ? 'a' : 'div';
-@prop export let color: FrameColor = 'default';
-@prop export let rounded: boolean = false;
-@prop export let border: boolean = false;
-@prop export let shadow: boolean = false;
-@prop export let node: HTMLElement | undefined = undefined;
-@prop export let use: Action<HTMLElement, any> = noop;
-@prop export let options = {};
-@prop export let role: string | undefined = undefined;
-@prop export let transition: TransitionFunc | undefined = undefined;
-@prop export let params: object = {};
-@prop export let open: boolean = true;
--->

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

@@ -1,77 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-export type FrameColor = keyof typeof bgColors;
-declare const bgColors: {
-    gray: string;
-    red: string;
-    yellow: string;
-    green: string;
-    indigo: string;
-    purple: string;
-    pink: string;
-    blue: string;
-    light: string;
-    dark: string;
-    default: string;
-    dropdown: string;
-    navbar: string;
-    navbarUl: string;
-    form: string;
-    primary: string;
-    orange: string;
-    none: string;
-};
-import type { Action } from 'svelte/action';
-import type { HTMLAttributes } from 'svelte/elements';
-import { type TransitionConfig } from 'svelte/transition';
-declare const __propDef: {
-    props: HTMLAttributes<HTMLElement> & {
-        tag?: string;
-        color?: FrameColor;
-        rounded?: boolean;
-        border?: boolean;
-        shadow?: boolean;
-        node?: HTMLElement | undefined;
-        use?: Action<HTMLElement, any>;
-        options?: object;
-        class?: string;
-        role?: string;
-        open?: boolean;
-        transition?: (node: HTMLElement, params: any) => TransitionConfig;
-        params?: any;
-    };
-    events: {
-        click: MouseEvent;
-        mouseenter: MouseEvent;
-        mouseleave: MouseEvent;
-        focusin: FocusEvent;
-        focusout: FocusEvent;
-        show: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export type FrameProps = typeof __propDef.props;
-export type FrameEvents = typeof __propDef.events;
-export type FrameSlots = typeof __propDef.slots;
-/**
- * [Go to docs](https://flowbite-svelte.com/)
- * ## Props
- * @prop export let tag: string = $$restProps.href ? 'a' : 'div';
- * @prop export let color: FrameColor = 'default';
- * @prop export let rounded: boolean = false;
- * @prop export let border: boolean = false;
- * @prop export let shadow: boolean = false;
- * @prop export let node: HTMLElement | undefined = undefined;
- * @prop export let use: Action<HTMLElement, any> = noop;
- * @prop export let options = {};
- * @prop export let role: string | undefined = undefined;
- * @prop export let transition: TransitionFunc | undefined = undefined;
- * @prop export let params: object = {};
- * @prop export let open: boolean = true;
- */
-export default class Frame extends SvelteComponentTyped<FrameProps, FrameEvents, FrameSlots> {
-}
-export {};

package/dist/utils/TransitionFrame.svelte

@@ -1,22 +0,0 @@
-<script>import {} from "svelte";
-import { fade } from "svelte/transition";
-import Frame from "./Frame.svelte";
-export let transition = fade;
-export let params = {};
-export let open = true;
-function close(ev) {
-  if (ev?.stopPropagation) ev.stopPropagation();
-  open = false;
-}
-</script>
-
-<Frame bind:open {transition} {params} {...$$restProps} on:show><slot {close} /></Frame>
-
-<!--
-@component
-[Go to docs](https://flowbite-svelte.com/)
-## Props
-@prop export let transition: TransitionFunc = fade;
-@prop export let params: object = {};
-@prop export let open: boolean = true;
--->

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

@@ -1,43 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Dismissable } from '../types';
-import { type TransitionConfig } from 'svelte/transition';
-declare const __propDef: {
-    props: import("svelte/elements").HTMLAttributes<HTMLElement> & {
-        tag?: string;
-        color?: import("./Frame.svelte").FrameColor;
-        rounded?: boolean;
-        border?: boolean;
-        shadow?: boolean;
-        node?: HTMLElement | undefined;
-        use?: import("svelte/action").Action<HTMLElement, any>;
-        options?: object;
-        class?: string;
-        role?: string;
-        open?: boolean;
-        transition?: (node: HTMLElement, params: any) => TransitionConfig;
-        params?: any;
-    } & Dismissable;
-    events: {
-        show: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {
-            close: (ev: MouseEvent | undefined) => void;
-        };
-    };
-};
-export type TransitionFrameProps = typeof __propDef.props;
-export type TransitionFrameEvents = typeof __propDef.events;
-export type TransitionFrameSlots = typeof __propDef.slots;
-/**
- * [Go to docs](https://flowbite-svelte.com/)
- * ## Props
- * @prop export let transition: TransitionFunc = fade;
- * @prop export let params: object = {};
- * @prop export let open: boolean = true;
- */
-export default class TransitionFrame extends SvelteComponentTyped<TransitionFrameProps, TransitionFrameEvents, TransitionFrameSlots> {
-}
-export {};

package/dist/utils/Wrapper.svelte

@@ -1,20 +0,0 @@
-<script>export let tag = "div";
-export let show;
-export let use = () => {
-};
-</script>
-
-{#if show}
-  <svelte:element this={tag} use:use {...$$restProps}><slot /></svelte:element>
-{:else}
-  <slot />
-{/if}
-
-<!--
-@component
-[Go to docs](https://flowbite-svelte.com/)
-## Props
-@prop export let tag: string = 'div';
-@prop export let show: boolean;
-@prop export let use: Action<HTMLElement, any> = () => {};
--->

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

@@ -1,29 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Action } from 'svelte/action';
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        tag?: string | undefined;
-        show: boolean;
-        use?: Action<HTMLElement, any> | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export type WrapperProps = typeof __propDef.props;
-export type WrapperEvents = typeof __propDef.events;
-export type WrapperSlots = typeof __propDef.slots;
-/**
- * [Go to docs](https://flowbite-svelte.com/)
- * ## Props
- * @prop export let tag: string = 'div';
- * @prop export let show: boolean;
- * @prop export let use: Action<HTMLElement, any> = () => {};
- */
-export default class Wrapper extends SvelteComponentTyped<WrapperProps, WrapperEvents, WrapperSlots> {
-}
-export {};

package/dist/utils/backdrop.d.ts

@@ -1,6 +0,0 @@
-export declare let open: boolean;
-export declare let placement: string;
-export declare const init: (node: HTMLElement, _open: boolean) => {
-    update(_open: boolean): void;
-    destroy(): void;
-};

package/dist/utils/backdrop.js

@@ -1,73 +0,0 @@
-import { createEventDispatcher } from 'svelte';
-export let open = false;
-const backdropClasses = 'bg-gray-900 bg-black/50 dark:bg-black/80 fixed inset-0 z-40';
-export let placement;
-export const init = (node, _open) => {
-    getPlacementClasses().map((c) => node.classList.add(c));
-    /* eslint-disable  @typescript-eslint/no-unused-expressions */
-    _open && createBackdrop(node);
-    return {
-        update(_open) {
-            allPlacementClasses.map((c) => node.classList.remove(c));
-            getPlacementClasses().map((c) => node.classList.add(c));
-            _open ? createBackdrop(node) : destroyBackdrop(node);
-        },
-        destroy() {
-            destroyBackdrop(node);
-        }
-    };
-};
-const getPlacementClasses = () => {
-    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 createBackdrop = (node) => {
-    if (!backdropEl) {
-        backdropEl = document.createElement('div');
-        backdropEl.classList.add(...backdropClasses.split(' '));
-        const body = document.body;
-        body.append(backdropEl);
-        body.style.overflow = 'hidden';
-        document.addEventListener('keydown', handleEscape, true);
-    }
-    dispatch('show', node);
-};
-const destroyBackdrop = (node) => {
-    const body = document.body;
-    body.style.overflow = 'auto';
-    if (backdropEl)
-        backdropEl.remove();
-    backdropEl = undefined;
-    document.removeEventListener('keydown', handleEscape, true);
-    dispatch('hide', node);
-};
-let backdropEl;
-const handleEscape = (e) => {
-    if (open && e.key === 'Escape')
-        open = false;
-};
-const dispatch = createEventDispatcher();
-const allPlacementClasses = ['justify-start', 'justify-center', 'justify-end', 'items-start', 'items-center', 'items-end'];

package/dist/utils/clickOutside.d.ts

@@ -1,3 +0,0 @@
-export declare const clickOutside: (node: HTMLElement, callback: () => void) => {
-    destroy(): void;
-};

package/dist/utils/clickOutside.js

@@ -1,15 +0,0 @@
-export const clickOutside = (node, callback) => {
-    const handleClick = (event) => {
-        if (!event?.target)
-            return;
-        if (node && !node.contains(event.target) && !event.defaultPrevented) {
-            callback();
-        }
-    };
-    document.addEventListener('click', handleClick, true);
-    return {
-        destroy() {
-            document.removeEventListener('click', handleClick, true);
-        }
-    };
-};

package/dist/utils/generateId.d.ts

@@ -1 +0,0 @@
-export default function _default(): string;

package/dist/utils/generateId.js

@@ -1,5 +0,0 @@
-let n = Date.now();
-
-export default function () {
-  return (++n).toString(36);
-}