flowbite-svelte 0.48.4 → 1.0.0-next.2

package/dist/list-group/Listgroup.svelte

@@ -1,34 +1,45 @@
-<script generics="T extends ListGroupItemType | string">import { createEventDispatcher, setContext } from "svelte";
-import { twMerge } from "tailwind-merge";
-import Frame from "../utils/Frame.svelte";
-import ListgroupItem from "./ListgroupItem.svelte";
-const dispatch = createEventDispatcher();
-export let items = [];
-export let active = false;
-export let defaultClass = "divide-y divide-gray-200 dark:divide-gray-600";
-$: setContext("active", active);
-let groupClass;
-$: groupClass = twMerge(defaultClass, $$props.class);
+<script lang="ts">
+  import { setContext } from "svelte";
+  import ListgroupItem from "./ListgroupItem.svelte";
+  import { type ListgroupProps as Props, listGroup } from ".";
+  import clsx from "clsx";
+
+  let { children, items, active, onclick, horizontal, rounded, border, class: className, itemClass, iconClass, ...restProps }: Props = $props();
+
+  const base = $derived(listGroup({ rounded, border, horizontal, class: clsx(className) }));
+
+  let tag = active ? "div" : "ul";
+  setContext("active", active);
 </script>
 
-<Frame tag={active ? 'div' : 'ul'} {...$$restProps} rounded border class={groupClass}>
-  {#each items as item, index}
-    {#if typeof item === 'string'}
-      <ListgroupItem {active} {index} on:click={() => dispatch('click', item)}><slot {item} {index} /></ListgroupItem>
-    {:else}
-      <ListgroupItem {active} {...item} {index} on:click={() => dispatch('click', item)}><slot {item} {index} /></ListgroupItem>
-    {/if}
+<svelte:element this={tag} {...restProps} class={base}>
+  {#if items?.length}
+    {#each items as item}
+      {#if children}
+        {@render children(item)}
+      {:else if typeof item === "string"}
+        <ListgroupItem href={null} class={itemClass} {iconClass} {active} {horizontal} {onclick}>{item}</ListgroupItem>
+      {:else}
+        <ListgroupItem href={item.href ?? null} class={itemClass} {iconClass} {active} {horizontal} {...item} onclick={item.onclick ?? onclick} />
+      {/if}
+    {/each}
   {:else}
-    {@const item = items[0]}
-    <slot {item} index={0} />
-  {/each}
-</Frame>
+    {@render children?.(items?.[0])}
+  {/if}
+</svelte:element>
 
 <!--
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
-@prop export let items: NonNullable<$$Props['items']> = [];
-@prop export let active: $$Props['active'] = false;
-@prop export let defaultClass: $$Props['defaultClass'] = 'divide-y divide-gray-200 dark:divide-gray-600';
+@props: children: any;
+@props:items: any;
+@props:active: any;
+@props:onclick: any;
+@props:horizontal: any;
+@props:rounded: any;
+@props:border: any;
+@props:class: string;
+@props:itemClass: any;
+@props:iconClass: any;
 -->

package/dist/list-group/Listgroup.svelte.d.ts

@@ -1,47 +1,28 @@
 import { SvelteComponentTyped } from "svelte";
-import type { ListGroupItemType } from '../types';
-declare class __sveltets_Render<T extends ListGroupItemType | string> {
-    props(): import("svelte/elements").HTMLAttributes<HTMLElement> & {
-        tag?: string;
-        color?: import("../utils/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) => import("svelte/transition").TransitionConfig;
-        params?: any;
-    } & {
-        items?: T[] | undefined;
-        active?: boolean;
-        defaultClass?: string;
-    };
-    events(): {
-        click: CustomEvent<any>;
-    } & {
+declare const __propDef: {
+    props: Record<string, never>;
+    events: {
         [evt: string]: CustomEvent<any>;
     };
-    slots(): {
-        default: {
-            item: T;
-            index: number;
-        };
-    };
-}
-export type ListgroupProps<T extends ListGroupItemType | string> = ReturnType<__sveltets_Render<T>['props']>;
-export type ListgroupEvents<T extends ListGroupItemType | string> = ReturnType<__sveltets_Render<T>['events']>;
-export type ListgroupSlots<T extends ListGroupItemType | string> = ReturnType<__sveltets_Render<T>['slots']>;
+    slots: {};
+};
+type ListgroupProps_ = typeof __propDef.props;
+export { ListgroupProps_ as ListgroupProps };
+export type ListgroupEvents = typeof __propDef.events;
+export type ListgroupSlots = typeof __propDef.slots;
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop export let items: NonNullable<$$Props['items']> = [];
- * @prop export let active: $$Props['active'] = false;
- * @prop export let defaultClass: $$Props['defaultClass'] = 'divide-y divide-gray-200 dark:divide-gray-600';
+ * @props: children: any;
+ * @props:items: any;
+ * @props:active: any;
+ * @props:onclick: any;
+ * @props:horizontal: any;
+ * @props:rounded: any;
+ * @props:border: any;
+ * @props:class: string;
+ * @props:itemClass: any;
+ * @props:iconClass: any;
  */
-export default class Listgroup<T extends ListGroupItemType | string> extends SvelteComponentTyped<ListgroupProps<T>, ListgroupEvents<T>, ListgroupSlots<T>> {
+export default class Listgroup extends SvelteComponentTyped<ListgroupProps_, ListgroupEvents, ListgroupSlots> {
 }
-export {};

package/dist/list-group/ListgroupItem.svelte

@@ -1,54 +1,53 @@
-<script>import { getContext } from "svelte";
-import { twMerge } from "tailwind-merge";
-export let active = getContext("active");
-export let current = false;
-export let disabled = false;
-export let href = "";
-export let currentClass = "text-white bg-primary-700 dark:text-white dark:bg-gray-800";
-export let normalClass = "";
-export let disabledClass = "text-gray-900 bg-gray-100 dark:bg-gray-600 dark:text-gray-400";
-export let focusClass = "focus:z-40 focus:outline-hidden focus:ring-2 focus:ring-primary-700 focus:text-primary-700 dark:focus:ring-gray-500 dark:focus:text-white";
-export let hoverClass = "hover:bg-gray-100 hover:text-primary-700 dark:hover:bg-gray-600 dark:hover:text-white";
-export let itemDefaultClass = "py-2 px-4 w-full text-sm font-medium list-none first:rounded-t-lg last:rounded-b-lg";
-export let attrs = void 0;
-const states = {
-  current: currentClass,
-  normal: normalClass,
-  disabled: disabledClass
-};
-let state;
-$: state = disabled ? "disabled" : current ? "current" : "normal";
-let itemClass;
-$: itemClass = twMerge(itemDefaultClass, states[state], active && state === "disabled" && "cursor-not-allowed", active && state === "normal" && hoverClass, active && state === "normal" && focusClass, $$props.class);
+<script lang="ts">
+  import { getContext } from "svelte";
+  import { type ListgroupItemProps as Props } from "./type";
+  import { type ListgroupItemVariants, listGroupItem } from "./theme";
+  import clsx from "clsx";
+
+  let { children, active, current, disabled, horizontal, name, Icon, class: className, iconClass = "me-2.5 h-5 w-5", ...restProps }: Props = $props();
+
+  active = active ?? getContext("active");
+
+  let state: ListgroupItemVariants["state"] = $derived(disabled ? "disabled" : current ? "current" : "normal");
+  let itemClass = $derived(listGroupItem({ state, active, horizontal, class: clsx(className) }));
 </script>
 
-{#if !active}
+{#snippet nameOrChildren()}
+  {#if Icon}
+    <Icon class={iconClass} />
+  {/if}
+  {#if children}
+    {@render children()}
+  {:else}
+    {name}
+  {/if}
+{/snippet}
+
+{#if restProps.href === null && !active}
   <li class={itemClass}>
-    <slot item={$$props} />
+    {@render nameOrChildren()}
   </li>
-{:else if href}
-  <a {...attrs} {href} class="block {itemClass}" aria-current={current} on:blur on:change on:click on:focus on:keydown on:keypress on:keyup on:mouseenter on:mouseleave on:mouseover>
-    <slot item={$$props} />
-  </a>
-{:else}
-  <button type="button" {...attrs} class="flex items-center text-left {itemClass}" {disabled} aria-current={current} on:blur on:change on:click on:focus on:keydown on:keypress on:keyup on:mouseenter on:mouseleave on:mouseover>
-    <slot item={$$props} />
+{:else if restProps.href === null}
+  <button type="button" {...restProps} class={itemClass} {disabled} aria-current={current}>
+    {@render nameOrChildren()}
   </button>
+{:else}
+  <a {...restProps} class={itemClass} aria-current={current}>
+    {@render nameOrChildren()}
+  </a>
 {/if}
 
 <!--
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
-@prop export let active: boolean = getContext('active');
-@prop export let current: boolean = false;
-@prop export let disabled: boolean = false;
-@prop export let href: string = '';
-@prop export let currentClass: string = 'text-white bg-primary-700 dark:text-white dark:bg-gray-800';
-@prop export let normalClass: string = '';
-@prop export let disabledClass: string = 'text-gray-900 bg-gray-100 dark:bg-gray-600 dark:text-gray-400';
-@prop export let focusClass: string = 'focus:z-40 focus:outline-hidden focus:ring-2 focus:ring-primary-700 focus:text-primary-700 dark:focus:ring-gray-500 dark:focus:text-white';
-@prop export let hoverClass: string = 'hover:bg-gray-100 hover:text-primary-700 dark:hover:bg-gray-600 dark:hover:text-white';
-@prop export let itemDefaultClass: string = 'py-2 px-4 w-full text-sm font-medium list-none first:rounded-t-lg last:rounded-b-lg';
-@prop export let attrs: any = undefined;
+@props: children: any;
+@props:active: any;
+@props:current: any;
+@props:disabled: any;
+@props:horizontal: any;
+@props:name: any;
+@props:Icon: any;
+@props:class: string;
+@props:iconClass: any = "me-2.5 h-5 w-5";
 -->

package/dist/list-group/ListgroupItem.svelte.d.ts

@@ -1,57 +1,27 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
-    props: {
-        [x: string]: any;
-        active?: boolean | undefined;
-        current?: boolean | undefined;
-        disabled?: boolean | undefined;
-        href?: string | undefined;
-        currentClass?: string | undefined;
-        normalClass?: string | undefined;
-        disabledClass?: string | undefined;
-        focusClass?: string | undefined;
-        hoverClass?: string | undefined;
-        itemDefaultClass?: string | undefined;
-        attrs?: any;
-    };
+    props: Record<string, never>;
     events: {
-        blur: FocusEvent;
-        change: Event;
-        click: MouseEvent;
-        focus: FocusEvent;
-        keydown: KeyboardEvent;
-        keypress: KeyboardEvent;
-        keyup: KeyboardEvent;
-        mouseenter: MouseEvent;
-        mouseleave: MouseEvent;
-        mouseover: MouseEvent;
-    } & {
         [evt: string]: CustomEvent<any>;
     };
-    slots: {
-        default: {
-            item: SvelteAllProps;
-        };
-    };
+    slots: {};
 };
-export type ListgroupItemProps = typeof __propDef.props;
+type ListgroupItemProps_ = typeof __propDef.props;
+export { ListgroupItemProps_ as ListgroupItemProps };
 export type ListgroupItemEvents = typeof __propDef.events;
 export type ListgroupItemSlots = typeof __propDef.slots;
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop export let active: boolean = getContext('active');
- * @prop export let current: boolean = false;
- * @prop export let disabled: boolean = false;
- * @prop export let href: string = '';
- * @prop export let currentClass: string = 'text-white bg-primary-700 dark:text-white dark:bg-gray-800';
- * @prop export let normalClass: string = '';
- * @prop export let disabledClass: string = 'text-gray-900 bg-gray-100 dark:bg-gray-600 dark:text-gray-400';
- * @prop export let focusClass: string = 'focus:z-40 focus:outline-hidden focus:ring-2 focus:ring-primary-700 focus:text-primary-700 dark:focus:ring-gray-500 dark:focus:text-white';
- * @prop export let hoverClass: string = 'hover:bg-gray-100 hover:text-primary-700 dark:hover:bg-gray-600 dark:hover:text-white';
- * @prop export let itemDefaultClass: string = 'py-2 px-4 w-full text-sm font-medium list-none first:rounded-t-lg last:rounded-b-lg';
- * @prop export let attrs: any = undefined;
+ * @props: children: any;
+ * @props:active: any;
+ * @props:current: any;
+ * @props:disabled: any;
+ * @props:horizontal: any;
+ * @props:name: any;
+ * @props:Icon: any;
+ * @props:class: string;
+ * @props:iconClass: any = "me-2.5 h-5 w-5";
  */
-export default class ListgroupItem extends SvelteComponentTyped<ListgroupItemProps, ListgroupItemEvents, ListgroupItemSlots> {
+export default class ListgroupItem extends SvelteComponentTyped<ListgroupItemProps_, ListgroupItemEvents, ListgroupItemSlots> {
 }
-export {};

package/dist/list-group/index.d.ts

@@ -0,0 +1,5 @@
+import type { ListgroupProps, ListgroupItemProps, ListGroupItemType } from "./type";
+import Listgroup from "./Listgroup.svelte";
+import ListgroupItem from "./ListgroupItem.svelte";
+import { listGroup, listGroupItem } from "./theme";
+export { Listgroup, ListgroupItem, listGroup, listGroupItem, type ListgroupProps, type ListgroupItemProps, type ListGroupItemType };

package/dist/list-group/index.js

@@ -0,0 +1,4 @@
+import Listgroup from "./Listgroup.svelte";
+import ListgroupItem from "./ListgroupItem.svelte";
+import { listGroup, listGroupItem } from "./theme";
+export { Listgroup, ListgroupItem, listGroup, listGroupItem };

package/dist/list-group/theme.d.ts

@@ -0,0 +1,86 @@
+import { type VariantProps } from "tailwind-variants";
+export type ListgroupVariants = VariantProps<typeof listGroup>;
+export declare const listGroup: import("tailwind-variants").TVReturnType<{
+    rounded: {
+        true: string;
+        false: string;
+    };
+    border: {
+        true: string;
+        false: string;
+    };
+    horizontal: {
+        true: string;
+        false: string;
+    };
+}, undefined, "flex w-fit bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400 divide-gray-200 dark:divide-gray-600", {
+    rounded: {
+        true: string;
+        false: string;
+    };
+    border: {
+        true: string;
+        false: string;
+    };
+    horizontal: {
+        true: string;
+        false: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    rounded: {
+        true: string;
+        false: string;
+    };
+    border: {
+        true: string;
+        false: string;
+    };
+    horizontal: {
+        true: string;
+        false: string;
+    };
+}, undefined, "flex w-fit bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400 divide-gray-200 dark:divide-gray-600", unknown, unknown, undefined>>;
+export type ListgroupItemVariants = VariantProps<typeof listGroupItem>;
+export declare const listGroupItem: import("tailwind-variants").TVReturnType<{
+    state: {
+        normal: string;
+        current: string;
+        disabled: string;
+    };
+    active: {
+        true: string;
+        false: string;
+    };
+    horizontal: {
+        true: string;
+        false: string;
+    };
+}, undefined, "py-2 px-4 w-full text-sm font-medium list-none flex items-center text-left", {
+    state: {
+        normal: string;
+        current: string;
+        disabled: string;
+    };
+    active: {
+        true: string;
+        false: string;
+    };
+    horizontal: {
+        true: string;
+        false: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    state: {
+        normal: string;
+        current: string;
+        disabled: string;
+    };
+    active: {
+        true: string;
+        false: string;
+    };
+    horizontal: {
+        true: string;
+        false: string;
+    };
+}, undefined, "py-2 px-4 w-full text-sm font-medium list-none flex items-center text-left", unknown, unknown, undefined>>;

package/dist/list-group/theme.js

@@ -0,0 +1,59 @@
+import { tv } from "tailwind-variants";
+export const listGroup = tv({
+    base: "flex w-fit bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400 divide-gray-200 dark:divide-gray-600",
+    variants: {
+        rounded: {
+            true: "rounded-lg",
+            false: ""
+        },
+        border: {
+            true: "border border-gray-200 dark:border-gray-700",
+            false: ""
+        },
+        horizontal: {
+            true: "flex-row divide-x",
+            false: "flex-col divide-y"
+        }
+    },
+    compoundVariants: [
+        {
+            border: true,
+            class: "divide-gray-200 dark:divide-gray-700"
+        }
+    ],
+    defaultVariants: {
+        rounded: true,
+        border: true,
+        horizontal: false
+    }
+});
+export const listGroupItem = tv({
+    base: "py-2 px-4 w-full text-sm font-medium list-none flex items-center text-left",
+    variants: {
+        state: {
+            normal: "",
+            current: "text-white bg-primary-700 dark:text-white dark:bg-gray-800",
+            disabled: "text-gray-900 bg-gray-100 dark:bg-gray-600 dark:text-gray-400"
+        },
+        active: {
+            true: "",
+            false: ""
+        },
+        horizontal: {
+            true: "first:rounded-s-lg last:rounded-e-lg",
+            false: "first:rounded-t-lg last:rounded-b-lg"
+        }
+    },
+    compoundVariants: [
+        {
+            active: true,
+            state: "disabled",
+            class: "cursor-not-allowed"
+        },
+        {
+            active: true,
+            state: "normal",
+            class: "hover:bg-gray-100 hover:text-primary-700 dark:hover:bg-gray-600 dark:hover:text-white focus:z-40 focus:outline-hidden focus:ring-2 focus:ring-primary-700 focus:text-primary-700 dark:focus:ring-gray-500 dark:focus:text-white"
+        }
+    ]
+});

package/dist/list-group/type.d.ts

@@ -0,0 +1,32 @@
+import type { Component, Snippet } from "svelte";
+import type { HTMLAttributes } from "svelte/elements";
+import type { ListgroupItemVariants, ListgroupVariants } from "./theme";
+import type { AnchorButtonAttributes } from "../types";
+interface ListGroupItemType {
+    name: string;
+    Icon?: Component;
+    onclick?: () => void;
+    href?: string;
+    active?: boolean;
+    current?: boolean;
+    disabled?: boolean;
+    [key: string]: any;
+}
+interface ListgroupProps extends ListgroupVariants, Omit<HTMLAttributes<HTMLUListElement>, "children"> {
+    children?: Snippet<[item: ListGroupItemType | string | undefined]>;
+    items?: (ListGroupItemType | string)[];
+    active?: boolean;
+    onclick?: (event?: MouseEvent) => void;
+    itemClass?: string;
+    aClasss?: string;
+    btnClass?: string;
+    iconClass?: string;
+}
+type ListgroupItemProps = Omit<ListgroupItemVariants, "state"> & AnchorButtonAttributes & {
+    current?: boolean;
+    disabled?: boolean;
+    Icon?: Component;
+    iconClass?: string;
+    name?: string;
+};
+export { type ListgroupItemProps, type ListGroupItemType, type ListgroupProps };

package/dist/list-group/type.js

@@ -0,0 +1 @@
+export {};

package/dist/mega-menu/MegaMenu.svelte

@@ -1,36 +1,43 @@
-<script>import { twMerge } from "tailwind-merge";
-import Popper from "../utils/Popper.svelte";
-export let items = [];
-export let full = false;
-export let open = false;
-export let ulClass = "grid grid-flow-row gap-y-4 md:gap-x-0 auto-col-max auto-row-max";
-let wrapperClass;
-$: wrapperClass = twMerge(full && "border-y w-full ml-0!", $$props.class);
-let ulCls;
-$: ulCls = twMerge(ulClass, full && $$slots.extra ? "grid-cols-2" : "grid-cols-2 md:grid-cols-3", "text-sm font-medium", full && $$slots.extra && "md:w-2/3", $$props.classUl);
+<script lang="ts">
+  import clsx from "clsx";
+  import { type MegaMenuProps as Props, megamenu } from ".";
+
+  let { children, footer, items = [], full, open = $bindable(), class: className, ...restProps }: Props = $props();
+
+  const { base, div, ul, footerDiv } = $derived(megamenu());
+  $inspect("open", open);
 </script>
 
-<Popper color={full ? 'default' : 'dropdown'} border={!full} rounded={!full} activeContent arrow={false} trigger="click" placement="bottom" yOnly={full} {...$$restProps} class={wrapperClass} on:show bind:open>
-  <div class="flex flex-col md:flex-row p-4 max-w-(--breakpoint-md) justify-center mx-auto mt-2">
-    <ul class={ulCls}>
-      {#each items as item, index}
-        <li>
-          <slot {item} {index} />
-        </li>
-      {:else}
-        <slot item={items[0]} index={0} />
-      {/each}
-    </ul>
-    {#if full && $$slots.extra}<div class="md:w-1/3 mt-4 md:mt-0"><slot name="extra" /></div>{/if}
+<!-- Dropdown menu -->
+{#if open}
+  <div {...restProps} class={base({ class: clsx(className) })}>
+    <div class={div()}>
+      <ul class={ul()}>
+        {#each items as item, index}
+          <li>
+            {@render children({ item, index })}
+          </li>
+        {:else}
+          {@render children({ item: items[0], index: 0 })}
+        {/each}
+      </ul>
+      {#if full && footer}
+        <div class={footerDiv()}>
+          {@render footer()}
+        </div>
+      {/if}
+    </div>
   </div>
-</Popper>
+{/if}
 
 <!--
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
-@prop export let items: $$Props['items'] = [];
-@prop export let full: $$Props['full'] = false;
-@prop export let open: $$Props['open'] = false;
-@prop export let ulClass: $$Props['ulClass'] = 'grid grid-flow-row gap-y-4 md:gap-x-0 auto-col-max auto-row-max';
+@props: children: any;
+@props:footer: any;
+@props:items: any = [];
+@props:full: any;
+@props:open: any = $bindable();
+@props:class: string;
 -->

package/dist/mega-menu/MegaMenu.svelte.d.ts

@@ -1,65 +1,24 @@
 import { SvelteComponentTyped } from "svelte";
-import type { LinkType } from '../types';
 declare const __propDef: {
-    props: import("svelte/elements").HTMLAttributes<HTMLElement> & {
-        tag?: string;
-        color?: import("../utils/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) => import("svelte/transition").TransitionConfig;
-        params?: any;
-    } & {
-        activeContent?: boolean;
-        arrow?: boolean;
-        offset?: number;
-        placement?: import("@floating-ui/dom").Placement;
-        trigger?: "hover" | "click" | "focus";
-        triggeredBy?: string;
-        reference?: string;
-        strategy?: "absolute" | "fixed";
-        open?: boolean;
-        yOnly?: boolean;
-    } & {
-        items: (LinkType & {
-            [propName: string]: any;
-        })[];
-        full?: boolean;
-        open?: boolean;
-        ulClass?: string;
-    };
+    props: Record<string, never>;
     events: {
-        show: CustomEvent<any>;
-    } & {
         [evt: string]: CustomEvent<any>;
     };
-    slots: {
-        default: {
-            item: LinkType & {
-                [propName: string]: any;
-            };
-            index: number;
-        };
-        extra: {};
-    };
+    slots: {};
 };
-export type MegaMenuProps = typeof __propDef.props;
+type MegaMenuProps_ = typeof __propDef.props;
+export { MegaMenuProps_ as MegaMenuProps };
 export type MegaMenuEvents = typeof __propDef.events;
 export type MegaMenuSlots = typeof __propDef.slots;
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop export let items: $$Props['items'] = [];
- * @prop export let full: $$Props['full'] = false;
- * @prop export let open: $$Props['open'] = false;
- * @prop export let ulClass: $$Props['ulClass'] = 'grid grid-flow-row gap-y-4 md:gap-x-0 auto-col-max auto-row-max';
+ * @props: children: any;
+ * @props:footer: any;
+ * @props:items: any = [];
+ * @props:full: any;
+ * @props:open: any = $bindable();
+ * @props:class: string;
  */
-export default class MegaMenu extends SvelteComponentTyped<MegaMenuProps, MegaMenuEvents, MegaMenuSlots> {
+export default class MegaMenu extends SvelteComponentTyped<MegaMenuProps_, MegaMenuEvents, MegaMenuSlots> {
 }
-export {};

package/dist/mega-menu/index.d.ts

@@ -0,0 +1,4 @@
+import type { MegaMenuProps } from "./type";
+import MegaMenu from "./MegaMenu.svelte";
+import { megamenu } from "./theme";
+export { MegaMenu, type MegaMenuProps, megamenu };