odj-svelte-ui 0.1.0

package/dist/elements/dropdown/Dropdown.svelte

@@ -0,0 +1,81 @@
+<script lang="ts" context="module">
+  export type DropdownType = {
+    activeClass: string;
+  };
+</script>
+
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+  import Popper from '../utils/Popper.svelte';
+  import type { ComponentProps } from 'svelte';
+  import { setContext } from 'svelte';
+  import { writable } from 'svelte/store';
+
+  const activeUrlStore = writable('');
+
+  export let activeUrl: string = '';
+  export let open: boolean = false;
+  export let containerClass: string = 'divide-y z-50';
+  export let headerClass: string = 'py-1 overflow-hidden rounded-t-lg';
+  export let footerClass: string = 'py-1 overflow-hidden rounded-b-lg';
+  export let activeClass: string = 'text-primary-700 dark:text-primary-700 hover:text-primary-900 dark:hover:text-primary-900';
+
+  let activeCls = twMerge(activeClass, $$props.classActive);
+
+  setContext<DropdownType>('DropdownType', { activeClass: activeCls });
+
+  $: activeUrlStore.set(activeUrl);
+
+  setContext('activeUrl', activeUrlStore);
+  // propagate props type from underlying Frame
+  interface $$Props extends ComponentProps<Popper> {
+    open?: boolean;
+    containerClass?: string;
+    headerClass?: string;
+    footerClass?: string;
+    activeUrl?: string;
+  }
+
+  let containerCls: string = twMerge(containerClass, $$props.classContainer);
+  let headerCls: string = twMerge(headerClass, $$props.classHeader);
+  let ulCls: string = twMerge('p-1 flex flex-col', $$props.class);
+  let footerCls: string = twMerge(footerClass, $$props.classFooter);
+
+  $: {
+    // set default values
+    $$restProps.arrow = $$restProps.arrow ?? false;
+    $$restProps.trigger = $$restProps.trigger ?? 'click';
+    $$restProps.placement = $$restProps.placement ?? 'bottom';
+    $$restProps.color = $$restProps.color ?? 'dropdown';
+    $$restProps.shadow = $$restProps.shadow ?? true;
+    $$restProps.rounded = $$restProps.rounded ?? true;
+  }
+</script>
+
+<Popper activeContent {...$$restProps} class={containerCls} on:show bind:open>
+  {#if $$slots.header}
+    <div class={headerCls}>
+      <slot name="header" />
+    </div>
+  {/if}
+  <ul class={ulCls}>
+    <slot />
+  </ul>
+  {#if $$slots.footer}
+    <div class={footerCls}>
+      <slot name="footer" />
+    </div>
+  {/if}
+</Popper>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let activeUrl: string = '';
+@prop export let open: boolean = false;
+@prop export let containerClass: string = 'divide-y z-50';
+@prop export let headerClass: string = 'py-1 overflow-hidden rounded-t-lg';
+@prop export let footerClass: string = 'py-1 overflow-hidden rounded-b-lg';
+@prop export let activeClass: string = 'text-primary-700 dark:text-primary-700 hover:text-primary-900 dark:hover:text-primary-900';
+-->

package/dist/elements/dropdown/Dropdown.svelte.d.ts

@@ -0,0 +1,80 @@
+export type DropdownType = {
+    activeClass: string;
+};
+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 activeUrl: string = '';
+ * @prop export let open: boolean = false;
+ * @prop export let containerClass: string = 'divide-y z-50';
+ * @prop export let headerClass: string = 'py-1 overflow-hidden rounded-t-lg';
+ * @prop export let footerClass: string = 'py-1 overflow-hidden rounded-b-lg';
+ * @prop export let activeClass: string = 'text-primary-700 dark:text-primary-700 hover:text-primary-900 dark:hover:text-primary-900';
+ */
+declare const Dropdown: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<import("svelte/elements").HTMLAnchorAttributes & {
+    tag?: string;
+    color?: "primary" | "red" | "orange" | "yellow" | "green" | "blue" | "indigo" | "purple" | "pink" | "dark" | "default" | "none" | "form" | "light" | "neutral" | "dropdown" | "navbar" | "navbarUl";
+    rounded?: boolean;
+    border?: boolean;
+    shadow?: boolean;
+    transition?: (node: HTMLElement, params: any) => import("svelte/transition").TransitionConfig;
+    params?: object;
+    node?: HTMLElement | undefined;
+    use?: import("svelte/action").Action<HTMLElement, any>;
+    options?: object;
+    class?: string;
+    role?: string;
+} & {
+    children?: any;
+} & {
+    activeContent?: boolean;
+    arrow?: boolean;
+    offset?: number;
+    placement?: import("@floating-ui/utils").Placement;
+    trigger?: "hover" | "click";
+    triggeredBy?: string;
+    reference?: string;
+    strategy?: "absolute" | "fixed";
+    open?: boolean;
+    yOnly?: boolean;
+} & {
+    children?: any;
+} & {
+    open?: boolean;
+    containerClass?: string;
+    headerClass?: string;
+    footerClass?: string;
+    activeUrl?: string;
+}, {
+    header: {};
+    default: {};
+    footer: {};
+}>, {
+    show: CustomEvent<any>;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {
+    header: {};
+    default: {};
+    footer: {};
+}, {}, string>;
+type Dropdown = InstanceType<typeof Dropdown>;
+export default Dropdown;

package/dist/elements/dropdown/DropdownDivider.svelte

@@ -0,0 +1,13 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+  export let divClass: string = 'my-1 h-px bg-neutral-100 dark:bg-neutral-600';
+</script>
+
+<div {...$$restProps} class={twMerge(divClass, $$props.class)} />
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let divClass: string = 'my-1 h-px bg-neutral-100 dark:bg-neutral-600';
+-->

package/dist/elements/dropdown/DropdownDivider.svelte.d.ts

@@ -0,0 +1,26 @@
+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 divClass: string = 'my-1 h-px bg-neutral-100 dark:bg-neutral-600';
+ */
+declare const DropdownDivider: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: any;
+    divClass?: string | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type DropdownDivider = InstanceType<typeof DropdownDivider>;
+export default DropdownDivider;

package/dist/elements/dropdown/DropdownHeader.svelte

@@ -0,0 +1,29 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+  import DropdownDivider from './DropdownDivider.svelte';
+  export let divClass: string = 'py-2 px-4 text-neutral-700 dark:text-white rounded-t-lg';
+  export let dividerClass: string = '';
+  export let divider: boolean = true;
+  export let href: string = '';
+</script>
+
+{#if href}
+  <a {href} {...$$restProps} class={twMerge(divClass + ' block cursor-pointer', $$props.class)}>
+    <slot />
+  </a>
+{:else}
+  <div {...$$restProps} class={twMerge(divClass, $$props.class)}>
+    <slot />
+  </div>
+{/if}
+{#if divider}
+  <DropdownDivider class={dividerClass} />
+{/if}
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let divClass: string = 'py-2 px-4 text-neutral-700 dark:text-white';
+@prop export let divider: boolean = true;
+-->

package/dist/elements/dropdown/DropdownHeader.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 = 'py-2 px-4 text-neutral-700 dark:text-white';
+ * @prop export let divider: boolean = true;
+ */
+declare const DropdownHeader: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    divClass?: string | undefined;
+    dividerClass?: string | undefined;
+    divider?: boolean | undefined;
+    href?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type DropdownHeader = InstanceType<typeof DropdownHeader>;
+export default DropdownHeader;

package/dist/elements/dropdown/DropdownItem.svelte

@@ -0,0 +1,54 @@
+<script lang="ts">
+  import Wrapper from '../utils/Wrapper.svelte';
+  import { twMerge } from 'tailwind-merge';
+  import { getContext, onDestroy } from 'svelte';
+  import type { DropdownType } from './Dropdown.svelte';
+
+  export let triggeredBy;
+  export let stay;
+  onDestroy(() => {
+    if (stay) document.querySelector(triggeredBy)?.focus();
+    stay = false;
+  })
+
+  export let defaultClass: string = 'font-medium py-2 px-3 text-sm rounded-lg hover:bg-neutral-100 dark:hover:bg-neutral-600' + ` popper_${triggeredBy}`;
+  export let href: string | undefined = undefined;
+  export let activeClass: string | undefined = undefined;
+  // export let active: boolean = false;
+
+  const context = getContext<DropdownType>('DropdownType') ?? {};
+  const activeUrlStore = getContext('activeUrl') as { subscribe: (callback: (value: string) => void) => void };
+
+  let sidebarUrl = '';
+  activeUrlStore.subscribe((value) => {
+    // console.log('value: ', value)
+    sidebarUrl = value;
+  });
+
+  $: active = sidebarUrl ? href === sidebarUrl : false;
+
+  // let liClass: string;
+  $: liClass = twMerge(defaultClass, href ? 'block' : 'w-full text-left', active && (activeClass ?? context.activeClass), $$props.class);
+  // twMerge(active ? activeClass ?? context.activeClass : nonActiveClass ?? context.nonActiveClass, $$props.class);
+  // console.log('active: ', active)
+  let wrap: boolean = true;
+  function init(node: HTMLElement) {
+    wrap = node.parentElement?.tagName === 'UL';
+  }
+</script>
+
+<Wrapper tag="li" show={wrap} use={init}>
+  <svelte:element this={href ? 'a' : 'button'} {href} type={href ? undefined : 'button'} role={href ? 'link' : 'button'} {...$$restProps} class={liClass} on:click on:change on:keydown on:keyup on:focus on:blur on:mouseenter on:mouseleave>
+    <slot />
+  </svelte:element>
+</Wrapper>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let defaultClass: string = 'font-medium py-2 px-4 text-sm hover:bg-neutral-100 dark:hover:bg-neutral-600';
+@prop export let href: string | undefined = undefined;
+@prop export let activeClass: string | undefined = undefined;
+@prop export let active: boolean = false;
+-->

package/dist/elements/dropdown/DropdownItem.svelte.d.ts

@@ -0,0 +1,51 @@
+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 defaultClass: string = 'font-medium py-2 px-4 text-sm hover:bg-neutral-100 dark:hover:bg-neutral-600';
+ * @prop export let href: string | undefined = undefined;
+ * @prop export let activeClass: string | undefined = undefined;
+ * @prop export let active: boolean = false;
+ */
+declare const DropdownItem: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    triggeredBy: any;
+    stay: any;
+    defaultClass?: string | undefined;
+    href?: string | undefined | undefined;
+    activeClass?: string | undefined | undefined;
+}, {
+    default: {};
+}>, {
+    click: MouseEvent;
+    change: Event;
+    keydown: KeyboardEvent;
+    keyup: KeyboardEvent;
+    focus: FocusEvent;
+    blur: FocusEvent;
+    mouseenter: MouseEvent;
+    mouseleave: MouseEvent;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type DropdownItem = InstanceType<typeof DropdownItem>;
+export default DropdownItem;

package/dist/elements/footer/Footer.svelte

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

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

@@ -0,0 +1,35 @@
+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 footerType: 'sitemap' | 'default' | 'logo' | 'socialmedia' = 'default';
+ */
+declare const Footer: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    footerType?: "sitemap" | "default" | "logo" | "socialmedia" | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Footer = InstanceType<typeof Footer>;
+export default Footer;

package/dist/elements/footer/FooterBrand.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+  export let aClass: string = 'flex items-center';
+  export let spanClass: string = 'self-center text-2xl font-semibold whitespace-nowrap dark:text-white';
+  export let imgClass: string = 'mr-3 h-8';
+  export let href: string = '';
+  export let src: string = '';
+  export let alt: string = '';
+  export let name: string = '';
+  export let target: string | undefined = undefined;
+
+  let aCls: string = twMerge(aClass, $$props.classA);
+  let spanCls: string = twMerge(spanClass, $$props.classSpan);
+  let imgCls: string = twMerge(imgClass, $$props.classImg);
+</script>
+
+{#if href}
+  <a {...$$restProps} {href} {target} class={aCls}>
+    <img {src} class={imgCls} {alt} />
+    <span class={spanCls}>{name}</span>
+    <slot />
+  </a>
+{:else}
+  <img {...$$restProps} {src} class={imgCls} {alt} />
+{/if}
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let aClass: string = 'flex items-center';
+@prop export let spanClass: string = 'self-center text-2xl font-semibold whitespace-nowrap dark:text-white';
+@prop export let imgClass: string = 'mr-3 h-8';
+@prop export let href: string = '';
+@prop export let src: string = '';
+@prop export let alt: string = '';
+@prop export let name: string = '';
+@prop export let target: string | undefined = undefined;
+-->

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

@@ -0,0 +1,49 @@
+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 aClass: string = 'flex items-center';
+ * @prop export let spanClass: string = 'self-center text-2xl font-semibold whitespace-nowrap dark:text-white';
+ * @prop export let imgClass: string = 'mr-3 h-8';
+ * @prop export let href: string = '';
+ * @prop export let src: string = '';
+ * @prop export let alt: string = '';
+ * @prop export let name: string = '';
+ * @prop export let target: string | undefined = undefined;
+ */
+declare const FooterBrand: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    aClass?: string | undefined;
+    spanClass?: string | undefined;
+    imgClass?: string | undefined;
+    href?: string | undefined;
+    src?: string | undefined;
+    alt?: string | undefined;
+    name?: string | undefined;
+    target?: string | undefined | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type FooterBrand = InstanceType<typeof FooterBrand>;
+export default FooterBrand;

package/dist/elements/footer/FooterCopyright.svelte

@@ -0,0 +1,38 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+  export let spanClass: string = 'block text-sm text-neutral-500 sm:text-center dark:text-neutral-400';
+  export let aClass: string = 'hover:underline';
+  export let year: number = new Date().getFullYear();
+  export let href: string = '';
+  export let by: string = '';
+  export let target: string | undefined = undefined;
+  export let copyrightMessage: string = 'All Rights Reserved.';
+
+  let spanCls: string = twMerge(spanClass, $$props.classSpan);
+  let aCls: string = twMerge(aClass, $$props.classA);
+</script>
+
+<span class={spanCls}>
+  &copy; {year}
+  {#if href}
+    <a {...$$restProps} {href} {target} class={aCls}>
+      {by}
+    </a>
+  {:else}
+    <span class="ml-1">{by}</span>
+  {/if}
+  {copyrightMessage}
+</span>
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let spanClass: string = 'block text-sm text-neutral-500 sm:text-center dark:text-neutral-400';
+@prop export let aClass: string = 'hover:underline';
+@prop export let year: number = new Date().getFullYear();
+@prop export let href: string = '';
+@prop export let by: string = '';
+@prop export let target: string | undefined = undefined;
+@prop export let copyrightMessage: string = 'All Rights Reserved.';
+-->

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

@@ -0,0 +1,38 @@
+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 spanClass: string = 'block text-sm text-neutral-500 sm:text-center dark:text-neutral-400';
+ * @prop export let aClass: string = 'hover:underline';
+ * @prop export let year: number = new Date().getFullYear();
+ * @prop export let href: string = '';
+ * @prop export let by: string = '';
+ * @prop export let target: string | undefined = undefined;
+ * @prop export let copyrightMessage: string = 'All Rights Reserved.';
+ */
+declare const FooterCopyright: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: any;
+    spanClass?: string | undefined;
+    aClass?: string | undefined;
+    year?: number | undefined;
+    href?: string | undefined;
+    by?: string | undefined;
+    target?: string | undefined | undefined;
+    copyrightMessage?: string | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type FooterCopyright = InstanceType<typeof FooterCopyright>;
+export default FooterCopyright;

package/dist/elements/footer/FooterIcon.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+  import { twMerge } from 'tailwind-merge';
+  export let href: string = '';
+  export let ariaLabel: string = '';
+  export let aClass: string = 'text-neutral-500 hover:text-neutral-900 dark:hover:text-white';
+  export let target: string | undefined = undefined;
+</script>
+
+{#if href}
+  <a {...$$restProps} {href} {target} aria-label={ariaLabel} class={twMerge(aClass, $$props.class)}>
+    <slot />
+  </a>
+{:else}
+  <slot />
+{/if}
+
+<!--
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let href: string = '';
+@prop export let ariaLabel: string = '';
+@prop export let aClass: string = 'text-neutral-500 hover:text-neutral-900 dark:hover:text-white';
+@prop export let target: string | undefined = undefined;
+-->

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

@@ -0,0 +1,41 @@
+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 href: string = '';
+ * @prop export let ariaLabel: string = '';
+ * @prop export let aClass: string = 'text-neutral-500 hover:text-neutral-900 dark:hover:text-white';
+ * @prop export let target: string | undefined = undefined;
+ */
+declare const FooterIcon: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+    href?: string | undefined;
+    ariaLabel?: string | undefined;
+    aClass?: string | undefined;
+    target?: string | undefined | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type FooterIcon = InstanceType<typeof FooterIcon>;
+export default FooterIcon;