odj-svelte-ui 0.1.0

package/dist/elements/typography/DescriptionList.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let tag: 'dt' | 'dd';
+  export let dtClass: string = 'text-neutral-500 md:text-lg dark:text-neutral-400';
+  export let ddClass: string = 'text-lg font-semibold';
+
+  let classDesc = twMerge(tag === 'dt' ? dtClass : ddClass, $$props.class);
+</script>
+
+<svelte:element this={tag} {...$$restProps} class={classDesc}>
+  <slot />
+</svelte:element>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let tag: 'dt' | 'dd';
+@prop export let dtClass: string = 'text-neutral-500 md:text-lg dark:text-neutral-400';
+@prop export let ddClass: string = 'text-lg font-semibold';
+-->

package/dist/elements/typography/DescriptionList.svelte.d.ts

@@ -0,0 +1,39 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let tag: 'dt' | 'dd';
+ * @prop export let dtClass: string = 'text-neutral-500 md:text-lg dark:text-neutral-400';
+ * @prop export let ddClass: string = 'text-lg font-semibold';
+ */
+declare const DescriptionList: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    tag: "dt" | "dd";
+    dtClass?: string | undefined;
+    ddClass?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type DescriptionList = InstanceType<typeof DescriptionList>;
+export default DescriptionList;

package/dist/elements/typography/Heading.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' = 'h1';
+  export let color: string = 'text-neutral-900 dark:text-white';
+  export let customSize: string = '';
+  const textSizes = {
+    h1: 'text-5xl font-extrabold',
+    h2: 'text-4xl font-bold',
+    h3: 'text-3xl font-bold',
+    h4: 'text-2xl font-bold',
+    h5: 'text-xl font-bold',
+    h6: 'text-lg font-bold'
+  };
+</script>
+
+<svelte:element this={tag} {...$$restProps} class={twMerge(customSize ? customSize : textSizes[tag], color, 'w-full', $$props.class)}>
+  <slot />
+</svelte:element>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' = 'h1';
+@prop export let color: string = 'text-neutral-900 dark:text-white';
+@prop export let customSize: string = '';
+-->

package/dist/elements/typography/Heading.svelte.d.ts

@@ -0,0 +1,39 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' = 'h1';
+ * @prop export let color: string = 'text-neutral-900 dark:text-white';
+ * @prop export let customSize: string = '';
+ */
+declare const Heading: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    tag?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | undefined;
+    color?: string | undefined;
+    customSize?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Heading = InstanceType<typeof Heading>;
+export default Heading;

package/dist/elements/typography/Hr.svelte

@@ -0,0 +1,37 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let icon: boolean = false;
+  export let divClass: string = 'inline-flex items-center justify-center w-full';
+  export let hrClass: string = 'h-px my-8 bg-neutral-200 border-0 dark:bg-neutral-700';
+  export let iconDivClass: string = 'absolute left-1/2 px-4 bg-white -translate-x-1/2 ';
+  export let textSpanClass: string = 'absolute px-3 font-medium text-neutral-900 -translate-x-1/2 bg-white left-1/2 dark:text-white dark:bg-neutral-900 ';
+  export let innerDivClass: string = 'absolute px-4 -translate-x-1/2 bg-white left-1/2 dark:bg-neutral-900';
+
+  let horizontalCls: string = twMerge(hrClass, $$props.classHr);
+  let divCls = twMerge(divClass, $$slots && 'relative', $$props.classDiv);
+  let innerDivCls = twMerge(innerDivClass, icon ? iconDivClass : textSpanClass, $$props.classInnerDiv);
+</script>
+
+{#if $$slots.default}
+  <div {...$$restProps} class={divCls}>
+    <hr class={horizontalCls} />
+    <div class={innerDivCls}>
+      <slot />
+    </div>
+  </div>
+{:else}
+  <hr class={horizontalCls} />
+{/if}
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let icon: boolean = false;
+@prop export let divClass: string = 'inline-flex items-center justify-center w-full';
+@prop export let hrClass: string = 'h-px my-8 bg-neutral-200 border-0 dark:bg-neutral-700';
+@prop export let iconDivClass: string = 'absolute left-1/2 px-4 bg-white -translate-x-1/2 ';
+@prop export let textSpanClass: string = 'absolute px-3 font-medium text-neutral-900 -translate-x-1/2 bg-white left-1/2 dark:text-white dark:bg-neutral-900 ';
+@prop export let innerDivClass: string = 'absolute px-4 -translate-x-1/2 bg-white left-1/2 dark:bg-neutral-900';
+-->

package/dist/elements/typography/Hr.svelte.d.ts

@@ -0,0 +1,45 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let icon: boolean = false;
+ * @prop export let divClass: string = 'inline-flex items-center justify-center w-full';
+ * @prop export let hrClass: string = 'h-px my-8 bg-neutral-200 border-0 dark:bg-neutral-700';
+ * @prop export let iconDivClass: string = 'absolute left-1/2 px-4 bg-white -translate-x-1/2 ';
+ * @prop export let textSpanClass: string = 'absolute px-3 font-medium text-neutral-900 -translate-x-1/2 bg-white left-1/2 dark:text-white dark:bg-neutral-900 ';
+ * @prop export let innerDivClass: string = 'absolute px-4 -translate-x-1/2 bg-white left-1/2 dark:bg-neutral-900';
+ */
+declare const Hr: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    icon?: boolean | undefined;
+    divClass?: string | undefined;
+    hrClass?: string | undefined;
+    iconDivClass?: string | undefined;
+    textSpanClass?: string | undefined;
+    innerDivClass?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Hr = InstanceType<typeof Hr>;
+export default Hr;

package/dist/elements/typography/Img.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let caption: string | undefined = undefined;
+  export let src: string | undefined = undefined;
+  export let srcset: string | undefined = undefined;
+  export let size: string = 'max-w-full';
+  export let alignment: string = '';
+  export let imgClass: string = 'h-auto';
+  export let figClass: string = 'max-w-lg';
+  export let alt: string = '';
+  export let effect: string = '';
+  export let captionClass: string = 'mt-2 text-sm text-center text-neutral-500 dark:text-neutral-400';
+</script>
+
+{#if caption}
+  <figure class={figClass}>
+    <img class={twMerge(imgClass, size, alignment, effect, $$props.class)} {src} {srcset} {alt} />
+    <figcaption class={captionClass}>{@html caption}</figcaption>
+  </figure>
+{:else}
+  <img {...$$restProps} class={twMerge(imgClass, size, alignment, effect, $$props.class)} {src} {srcset} {alt} />
+{/if}
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let caption: string | undefined = undefined;
+@prop export let src: string | undefined = undefined;
+@prop export let srcset: string | undefined = undefined;
+@prop export let size: string = 'max-w-full';
+@prop export let alignment: string = '';
+@prop export let imgClass: string = 'h-auto';
+@prop export let figClass: string = 'max-w-lg';
+@prop export let alt: string = '';
+@prop export let effect: string = '';
+@prop export let captionClass: string = 'mt-2 text-sm text-center text-neutral-500 dark:text-neutral-400';
+-->

package/dist/elements/typography/Img.svelte.d.ts

@@ -0,0 +1,44 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let caption: string | undefined = undefined;
+ * @prop export let src: string | undefined = undefined;
+ * @prop export let srcset: string | undefined = undefined;
+ * @prop export let size: string = 'max-w-full';
+ * @prop export let alignment: string = '';
+ * @prop export let imgClass: string = 'h-auto';
+ * @prop export let figClass: string = 'max-w-lg';
+ * @prop export let alt: string = '';
+ * @prop export let effect: string = '';
+ * @prop export let captionClass: string = 'mt-2 text-sm text-center text-neutral-500 dark:text-neutral-400';
+ */
+declare const Img: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: any;
+    caption?: string | undefined | undefined;
+    src?: string | undefined | undefined;
+    srcset?: string | undefined | undefined;
+    size?: string | undefined;
+    alignment?: string | undefined;
+    imgClass?: string | undefined;
+    figClass?: string | undefined;
+    alt?: string | undefined;
+    effect?: string | undefined;
+    captionClass?: string | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type Img = InstanceType<typeof Img>;
+export default Img;

package/dist/elements/typography/Layout.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let divClass: string = 'grid';
+  export let cols: string = 'grid-cols-1 sm:grid-cols-2';
+  export let gap: number;
+  let classDiv = twMerge(divClass, 'gap-' + String(gap), cols);
+</script>
+
+<div {...$$restProps} class={classDiv}>
+  <slot />
+</div>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let divClass: string = 'grid';
+@prop export let cols: string = 'grid-cols-1 sm:grid-cols-2';
+@prop export let gap: number;
+-->

package/dist/elements/typography/Layout.svelte.d.ts

@@ -0,0 +1,39 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let divClass: string = 'grid';
+ * @prop export let cols: string = 'grid-cols-1 sm:grid-cols-2';
+ * @prop export let gap: number;
+ */
+declare const Layout: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    divClass?: string | undefined;
+    cols?: string | undefined;
+    gap: number;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Layout = InstanceType<typeof Layout>;
+export default Layout;

package/dist/elements/typography/Li.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let icon: boolean = false;
+  export let liClass: string = '';
+  let classLi: string = twMerge(liClass, icon && 'flex items-center', $$props.class);
+</script>
+
+<li {...$$restProps} class={classLi}>
+  <slot />
+</li>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let icon: boolean = false;
+@prop export let liClass: string = '';
+-->

package/dist/elements/typography/Li.svelte.d.ts

@@ -0,0 +1,37 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let icon: boolean = false;
+ * @prop export let liClass: string = '';
+ */
+declare const Li: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    icon?: boolean | undefined;
+    liClass?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Li = InstanceType<typeof Li>;
+export default Li;

package/dist/elements/typography/List.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let tag: 'ul' | 'ol' | 'dl' = 'ul';
+  export let list: 'disc' | 'none' | 'decimal' | undefined = undefined;
+  export let position: 'inside' | 'outside' = 'inside';
+
+  let lists = {
+    disc: 'list-disc',
+    none: 'list-none',
+    decimal: 'list-decimal'
+  };
+
+  let positions = {
+    inside: 'list-inside',
+    outside: 'list-outside'
+  };
+
+  let classList = twMerge(lists[list ?? (tag === 'ul' ? 'disc' : 'ol' ? 'decimal' : 'none')], positions[position], $$props.class);
+</script>
+
+<svelte:element this={tag} {...$$restProps} class={classList}>
+  <slot />
+</svelte:element>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let tag: 'ul' | 'ol' | 'dl' = 'ul';
+@prop export let list: 'disc' | 'none' | 'decimal' | undefined = undefined;
+@prop export let position: 'inside' | 'outside' = 'inside';
+-->

package/dist/elements/typography/List.svelte.d.ts

@@ -0,0 +1,39 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let tag: 'ul' | 'ol' | 'dl' = 'ul';
+ * @prop export let list: 'disc' | 'none' | 'decimal' | undefined = undefined;
+ * @prop export let position: 'inside' | 'outside' = 'inside';
+ */
+declare const List: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    tag?: "ul" | "ol" | "dl" | undefined;
+    list?: "disc" | "none" | "decimal" | undefined | undefined;
+    position?: "inside" | "outside" | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type List = InstanceType<typeof List>;
+export default List;

package/dist/elements/typography/Mark.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+
+  export let color: string = 'text-white dark:bg-blue-500';
+  export let bgColor: string = 'bg-blue-600';
+  export let markClass: string = 'px-2 rounded';
+</script>
+
+<mark {...$$restProps} class={twMerge(markClass, bgColor, color, $$props.class)}>
+  <slot />
+</mark>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let color: string = 'text-white dark:bg-blue-500';
+@prop export let bgColor: string = 'bg-blue-600';
+@prop export let markClass: string = 'px-2 rounded';
+-->

package/dist/elements/typography/Mark.svelte.d.ts

@@ -0,0 +1,39 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+/**
+ * [Go to docs](https://flowbite-svelte.com/)
+ * ## Props
+ * @prop export let color: string = 'text-white dark:bg-blue-500';
+ * @prop export let bgColor: string = 'bg-blue-600';
+ * @prop export let markClass: string = 'px-2 rounded';
+ */
+declare const Mark: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    color?: string | undefined;
+    bgColor?: string | undefined;
+    markClass?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Mark = InstanceType<typeof Mark>;
+export default Mark;

package/dist/elements/typography/P.svelte

@@ -0,0 +1,102 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+  import type { PsizeType, PweightType } from '../types';
+
+  export let color: string = 'text-neutral-900 dark:text-white';
+  export let height: 'normal' | 'relaxed' | 'loose' = 'normal';
+  export let align: 'left' | 'center' | 'right' = 'left';
+  export let justify: boolean = false;
+  export let italic: boolean = false;
+  export let firstupper: boolean = false;
+  export let upperClass: string = 'first-line:uppercase first-line:tracking-widest first-letter:text-7xl first-letter:font-bold first-letter:text-neutral-900 dark:first-letter:text-neutral-100 first-letter:mr-3 first-letter:float-left';
+  export let opacity: number | undefined = undefined;
+  export let whitespace: 'normal' | 'nowrap' | 'pre' | 'preline' | 'prewrap' = 'normal';
+  export let size: PsizeType = 'base';
+  export let space: 'tighter' | 'tight' | 'normal' | 'wide' | 'wider' | 'widest' | undefined = undefined;
+  export let weight: PweightType = 'normal';
+
+  const sizes = {
+    xs: 'text-xs',
+    sm: 'text-sm',
+    base: 'text-base',
+    lg: 'text-lg',
+    xl: 'text-xl',
+    '2xl': 'text-2xl',
+    '3xl': 'text-3xl',
+    '4xl': 'text-4xl',
+    '5xl': 'text-5xl',
+    '6xl': 'text-6xl',
+    '7xl': 'text-7xl',
+    '8xl': 'text-8xl',
+    '9xl': 'text-9xl'
+  };
+  const weights = {
+    thin: 'font-thin',
+    extralight: 'font-extralight',
+    light: 'font-light',
+    normal: 'font-normal',
+    medium: 'font-medium',
+    semibold: 'font-semibold',
+    bold: 'font-bold',
+    extrabold: 'font-extrabold',
+    black: 'font-black'
+  };
+  const spaces = {
+    tighter: 'tracking-tighter',
+    tight: 'tracking-tight',
+    normal: 'tracking-normal',
+    wide: 'tracking-wide',
+    wider: 'tracking-wider',
+    widest: 'tracking-widest'
+  };
+
+  const heights = {
+    normal: 'leading-normal',
+    relaxed: 'leading-relaxed',
+    loose: 'leading-loose'
+  };
+
+  const aligns = {
+    left: 'text-left',
+    center: 'text-center',
+    right: 'text-right'
+  };
+
+  const whitespaces = {
+    normal: 'whitespace-normal',
+    nowrap: 'whitespace-nowrap',
+    pre: 'whitespace-pre',
+    preline: 'whitespace-pre-line',
+    prewrap: 'whitespace-pre-wrap'
+  };
+
+  let colorAndopacity = color
+    .split(' ')
+    .map((element) => element.trim())
+    .map((element) => element + '/' + String(opacity))
+    .join(' ');
+
+  let classP = twMerge(size && sizes[size], (opacity && colorAndopacity) || (color && color), height && heights[height], weight && weights[weight], space && spaces[space], align && aligns[align], justify && 'text-justify', italic && 'italic', firstupper && upperClass, whitespace && whitespaces[whitespace], $$props.class);
+</script>
+
+<p {...$$restProps} class={classP}>
+  <slot />
+</p>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let color: string = 'text-neutral-900 dark:text-white';
+@prop export let height: 'normal' | 'relaxed' | 'loose' = 'normal';
+@prop export let align: 'left' | 'center' | 'right' = 'left';
+@prop export let justify: boolean = false;
+@prop export let italic: boolean = false;
+@prop export let firstupper: boolean = false;
+@prop export let upperClass: string = 'first-line:uppercase first-line:tracking-widest first-letter:text-7xl first-letter:font-bold first-letter:text-neutral-900 dark:first-letter:text-neutral-100 first-letter:mr-3 first-letter:float-left';
+@prop export let opacity: number | undefined = undefined;
+@prop export let whitespace: 'normal' | 'nowrap' | 'pre' | 'preline' | 'prewrap' = 'normal';
+@prop export let size: PsizeType = 'base';
+@prop export let space: 'tighter' | 'tight' | 'normal' | 'wide' | 'wider' | 'widest' | undefined = undefined;
+@prop export let weight: PweightType = 'normal';
+-->