flowbite-svelte 0.46.15 → 0.46.17

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

@@ -2,11 +2,11 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        size?: "small" | "default" | "large" | "custom";
-        group?: (string | number)[];
-        value?: string | number;
+        size?: ("small" | "default" | "large" | "custom") | undefined;
+        group?: (string | number)[] | undefined;
+        value?: (string | number) | undefined;
         checked?: boolean | undefined;
-        customSize?: string;
+        customSize?: string | undefined;
     };
     events: {
         click: MouseEvent;
@@ -15,6 +15,7 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {
+        offLabel: {};
         default: {};
     };
 };

package/dist/gallery/Gallery.svelte.d.ts

@@ -3,8 +3,8 @@ import type { ImgType } from '../types';
 declare const __propDef: {
     props: {
         [x: string]: any;
-        items?: ImgType[];
-        imgClass?: string;
+        items?: ImgType[] | undefined;
+        imgClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/indicators/Indicator.svelte.d.ts

@@ -3,12 +3,12 @@ import type { IndicatorPlacementType } from '../types';
 declare const __propDef: {
     props: {
         [x: string]: any;
-        color?: "gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "blue" | "dark" | "orange" | "none" | "teal";
-        rounded?: boolean;
-        size?: "xs" | "sm" | "md" | "lg" | "xl";
-        border?: boolean;
+        color?: ("gray" | "red" | "yellow" | "green" | "indigo" | "purple" | "blue" | "dark" | "orange" | "none" | "teal") | undefined;
+        rounded?: boolean | undefined;
+        size?: ("xs" | "sm" | "md" | "lg" | "xl") | undefined;
+        border?: boolean | undefined;
         placement?: IndicatorPlacementType | undefined;
-        offset?: boolean;
+        offset?: boolean | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/kbd/ArrowKeyDown.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        svgClass?: string;
+        svgClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/kbd/ArrowKeyLeft.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        svgClass?: string;
+        svgClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/kbd/ArrowKeyRight.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        svgClass?: string;
+        svgClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/kbd/ArrowKeyUp.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        svgClass?: string;
+        svgClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/kbd/Kbd.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        kbdClass?: string;
+        kbdClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/list-group/Listgroup.svelte

@@ -1,4 +1,4 @@
-<script>import { createEventDispatcher, setContext } from "svelte";
+<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";
@@ -28,7 +28,7 @@ $: groupClass = twMerge(defaultClass, $$props.class);
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
-@prop export let items: ListGroupItemType[] | string[] = [];
+@prop export let items: T[] = [];
 @prop export let active: boolean = false;
 @prop export let defaultClass: string = 'divide-y divide-gray-200 dark:divide-gray-600';
 -->

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

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

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

@@ -2,16 +2,16 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        active?: boolean;
-        current?: boolean;
-        disabled?: boolean;
-        href?: string;
-        currentClass?: string;
-        normalClass?: string;
-        disabledClass?: string;
-        focusClass?: string;
-        hoverClass?: string;
-        itemDefaultClass?: string;
+        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;
     };
     events: {

package/dist/marquee/Marquee.svelte.d.ts

@@ -2,9 +2,9 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        speed?: number;
-        hoverSpeed?: number;
-        shadow?: boolean;
+        speed?: number | undefined;
+        hoverSpeed?: number | undefined;
+        shadow?: boolean | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/navbar/Menu.svelte.d.ts

@@ -2,10 +2,10 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        size?: string;
-        color?: string;
-        variation?: "solid" | "outline";
-        ariaLabel?: string;
+        size?: string | undefined;
+        color?: string | undefined;
+        variation?: ("solid" | "outline") | undefined;
+        ariaLabel?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/navbar/NavBrand.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        href?: string;
+        href?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/navbar/NavHamburger.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        menuClass?: string;
+        menuClass?: string | undefined;
         onClick?: (() => void) | undefined;
     };
     events: {

package/dist/navbar/NavLi.svelte.d.ts

@@ -2,7 +2,7 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        href?: string;
+        href?: string | undefined;
         activeClass?: string | undefined;
         nonActiveClass?: string | undefined;
     };

package/dist/navbar/NavUl.svelte.d.ts

@@ -7,13 +7,13 @@ import { type SlideParams } from 'svelte/transition';
 declare const __propDef: {
     props: {
         [x: string]: any;
-        activeUrl?: string;
-        divClass?: string;
-        ulClass?: string;
+        activeUrl?: string | undefined;
+        divClass?: string | undefined;
+        ulClass?: string | undefined;
         hidden?: boolean | undefined;
-        slideParams?: SlideParams;
-        activeClass?: string;
-        nonActiveClass?: string;
+        slideParams?: SlideParams | undefined;
+        activeClass?: string | undefined;
+        nonActiveClass?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/pagination/Pagination.svelte.d.ts

@@ -3,13 +3,13 @@ import type { LinkType } from '../types';
 declare const __propDef: {
     props: {
         [x: string]: any;
-        pages?: LinkType[];
-        activeClass?: string;
-        normalClass?: string;
-        ulClass?: string;
-        table?: boolean;
-        large?: boolean;
-        ariaLabel?: string;
+        pages?: LinkType[] | undefined;
+        activeClass?: string | undefined;
+        normalClass?: string | undefined;
+        ulClass?: string | undefined;
+        table?: boolean | undefined;
+        large?: boolean | undefined;
+        ariaLabel?: string | undefined;
     };
     events: {
         blur: FocusEvent;

package/dist/pagination/PaginationItem.svelte.d.ts

@@ -3,10 +3,10 @@ declare const __propDef: {
     props: {
         [x: string]: any;
         href?: string | undefined;
-        active?: boolean;
-        activeClass?: string;
-        normalClass?: string;
-        large?: boolean;
+        active?: boolean | undefined;
+        activeClass?: string | undefined;
+        normalClass?: string | undefined;
+        large?: boolean | undefined;
     };
     events: {
         blur: FocusEvent;

package/dist/progress/Progressbar.svelte

@@ -1,6 +1,6 @@
 <script>import { cubicOut } from "svelte/easing";
 import { tweened } from "svelte/motion";
-import { twMerge, twJoin } from "tailwind-merge";
+import { twMerge } from "tailwind-merge";
 export let progress = "45";
 export let precision = 0;
 export let tweenDuration = 400;
@@ -12,6 +12,7 @@ export let easing = cubicOut;
 export let color = "primary";
 export let labelInsideClass = "text-primary-100 text-xs font-medium text-center p-0.5 leading-none rounded-full";
 export let divClass = "w-full bg-gray-200 rounded-full dark:bg-gray-700";
+export let progressClass;
 const _progress = tweened(0, {
   duration: animate ? tweenDuration : 0,
   easing
@@ -37,11 +38,11 @@ $: _progress.set(Number(progress));
 {/if}
 <div class={twMerge(divClass, size, $$props.class)}>
   {#if labelInside}
-    <div class={twJoin(labelInsideClass, barColors[color])} style="width: {$_progress}%">
+    <div class={twMerge(barColors[color], labelInsideClass)} style="width: {$_progress}%">
       {$_progress.toFixed(precision)}%
     </div>
   {:else}
-    <div class={twJoin(barColors[color], size, 'rounded-full')} style="width: {$_progress}%"></div>
+    <div class={twMerge(barColors[color], size, 'rounded-full', progressClass)} style="width: {$_progress}%"></div>
   {/if}
 </div>
 
@@ -60,4 +61,5 @@ $: _progress.set(Number(progress));
 @prop export let color: 'primary' | 'blue' | 'gray' | 'red' | 'green' | 'yellow' | 'purple' | 'indigo' = 'primary';
 @prop export let labelInsideClass: string = 'text-primary-100 text-xs font-medium text-center p-0.5 leading-none rounded-full';
 @prop export let divClass: string = 'w-full bg-gray-200 rounded-full dark:bg-gray-700';
+@prop export let progressClass: string;
 -->

package/dist/progress/Progressbar.svelte.d.ts

@@ -3,17 +3,18 @@ import type { EasingFunction } from 'svelte/transition';
 declare const __propDef: {
     props: {
         [x: string]: any;
-        progress?: string | number;
-        precision?: number;
-        tweenDuration?: number;
-        animate?: boolean;
-        size?: string;
-        labelInside?: boolean;
-        labelOutside?: string;
-        easing?: EasingFunction;
-        color?: "primary" | "blue" | "gray" | "red" | "green" | "yellow" | "purple" | "indigo";
-        labelInsideClass?: string;
-        divClass?: string;
+        progress?: (string | number) | undefined;
+        precision?: number | undefined;
+        tweenDuration?: number | undefined;
+        animate?: boolean | undefined;
+        size?: string | undefined;
+        labelInside?: boolean | undefined;
+        labelOutside?: string | undefined;
+        easing?: EasingFunction | undefined;
+        color?: ("primary" | "blue" | "gray" | "red" | "green" | "yellow" | "purple" | "indigo") | undefined;
+        labelInsideClass?: string | undefined;
+        divClass?: string | undefined;
+        progressClass: string;
     };
     events: {
         [evt: string]: CustomEvent<any>;
@@ -37,6 +38,7 @@ export type ProgressbarSlots = typeof __propDef.slots;
  * @prop export let color: 'primary' | 'blue' | 'gray' | 'red' | 'green' | 'yellow' | 'purple' | 'indigo' = 'primary';
  * @prop export let labelInsideClass: string = 'text-primary-100 text-xs font-medium text-center p-0.5 leading-none rounded-full';
  * @prop export let divClass: string = 'w-full bg-gray-200 rounded-full dark:bg-gray-700';
+ * @prop export let progressClass: string;
  */
 export default class Progressbar extends SvelteComponentTyped<ProgressbarProps, ProgressbarEvents, ProgressbarSlots> {
 }

package/dist/rating/AdvancedRating.svelte.d.ts

@@ -5,13 +5,13 @@ declare const __propDef: {
         ratings?: {
             label: string;
             rating: number;
-        }[];
-        divClass?: string;
-        labelClass?: string;
-        ratingDivClass?: string;
-        ratingClass?: string;
-        rightLabelClass?: string;
-        unit?: string;
+        }[] | undefined;
+        divClass?: string | undefined;
+        labelClass?: string | undefined;
+        ratingDivClass?: string | undefined;
+        ratingClass?: string | undefined;
+        rightLabelClass?: string | undefined;
+        unit?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/rating/Heart.svelte.d.ts

@@ -2,13 +2,13 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        fillPercent?: number;
-        fillColor?: string;
-        strokeColor?: string;
-        size?: number;
-        ariaLabel?: string;
-        id?: string;
-        role?: string;
+        fillPercent?: number | undefined;
+        fillColor?: string | undefined;
+        strokeColor?: string | undefined;
+        size?: number | undefined;
+        ariaLabel?: string | undefined;
+        id?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/rating/Rating.svelte

@@ -8,28 +8,30 @@ export let rating = 4;
 export let partialId = "partialStar" + generateId();
 export let icon = Star;
 export let count = false;
+export let iconFillColor;
+export let iconStrokeColor;
 const fullStarId = generateId();
 const grayStarId = generateId();
-let fullStars = Math.floor(rating);
-let rateDiffence = rating - fullStars;
-let percentRating = Math.round(rateDiffence * 100);
-let grayStars = total - (fullStars + Math.ceil(rateDiffence));
+$: fullStars = Math.floor(rating);
+$: rateDiffence = rating - fullStars;
+$: percentRating = Math.round(rateDiffence * 100);
+$: grayStars = total - (fullStars + Math.ceil(rateDiffence));
 </script>
 
 <div class={twMerge(divClass, $$props.class)}>
   {#if count}
-    <svelte:component this={icon} fillPercent={100} {size} />
+    <svelte:component this={icon} fillColor={iconFillColor} strokeColor={iconStrokeColor} fillPercent={100} {size} />
     <p class="ms-2 text-sm font-bold text-gray-900 dark:text-white">{rating}</p>
     <slot />
   {:else}
     {#each Array(fullStars) as star}
-      <svelte:component this={icon} {size} fillPercent={100} id={fullStarId} />
+      <svelte:component this={icon} fillColor={iconFillColor} strokeColor={iconStrokeColor} {size} fillPercent={100} id={fullStarId} />
     {/each}
     {#if percentRating}
-      <svelte:component this={icon} {size} fillPercent={percentRating} id={partialId} />
+      <svelte:component this={icon} fillColor={iconFillColor} strokeColor={iconStrokeColor} {size} fillPercent={percentRating} id={partialId} />
     {/if}
     {#each Array(grayStars) as star}
-      <svelte:component this={icon} {size} fillPercent={0} id={grayStarId} />
+      <svelte:component this={icon} fillColor={iconFillColor} strokeColor={iconStrokeColor} {size} fillPercent={0} id={grayStarId} />
     {/each}
     {#if $$slots.text}
       <slot name="text" />
@@ -41,11 +43,13 @@ let grayStars = total - (fullStars + Math.ceil(rateDiffence));
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Props
-@prop export let divClass: string = 'flex items-center';
-@prop export let size: number = 24;
-@prop export let total: number = 5;
-@prop export let rating: number = 4;
-@prop export let partialId: string = 'partialStar' + generateId();
-@prop export let icon: ComponentType = Star;
-@prop export let count: boolean = false;
+@prop export let divClass: $$Props['divClass'] = 'flex items-center';
+@prop export let size: $$Props['size'] = 24;
+@prop export let total: NonNullable<$$Props['total']> = 5;
+@prop export let rating: $$Props['rating'] = 4;
+@prop export let partialId: $$Props['partialId'] = 'partialStar' + generateId();
+@prop export let icon: $$Props['icon'] = Star;
+@prop export let count: $$Props['count'] = false;
+@prop export let iconFillColor: $$Props['iconFillColor'];
+@prop export let iconStrokeColor: $$Props['iconStrokeColor'];
 -->

package/dist/rating/Rating.svelte.d.ts

@@ -1,15 +1,17 @@
 import { SvelteComponentTyped } from "svelte";
 import type { ComponentType } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
 declare const __propDef: {
-    props: {
-        [x: string]: any;
+    props: HTMLAttributes<HTMLDivElement> & {
         divClass?: string;
         size?: number;
         total?: number;
-        rating?: number;
+        rating: number;
         partialId?: string;
         icon?: ComponentType;
         count?: boolean;
+        iconFillColor?: string;
+        iconStrokeColor?: string;
     };
     events: {
         [evt: string]: CustomEvent<any>;
@@ -25,13 +27,15 @@ export type RatingSlots = typeof __propDef.slots;
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop export let divClass: string = 'flex items-center';
- * @prop export let size: number = 24;
- * @prop export let total: number = 5;
- * @prop export let rating: number = 4;
- * @prop export let partialId: string = 'partialStar' + generateId();
- * @prop export let icon: ComponentType = Star;
- * @prop export let count: boolean = false;
+ * @prop export let divClass: $$Props['divClass'] = 'flex items-center';
+ * @prop export let size: $$Props['size'] = 24;
+ * @prop export let total: NonNullable<$$Props['total']> = 5;
+ * @prop export let rating: $$Props['rating'] = 4;
+ * @prop export let partialId: $$Props['partialId'] = 'partialStar' + generateId();
+ * @prop export let icon: $$Props['icon'] = Star;
+ * @prop export let count: $$Props['count'] = false;
+ * @prop export let iconFillColor: $$Props['iconFillColor'];
+ * @prop export let iconStrokeColor: $$Props['iconStrokeColor'];
  */
 export default class Rating extends SvelteComponentTyped<RatingProps, RatingEvents, RatingSlots> {
 }

package/dist/rating/Review.svelte.d.ts

@@ -4,11 +4,11 @@ declare const __propDef: {
     props: {
         [x: string]: any;
         review: ReviewType;
-        articleClass?: string;
-        divClass?: string;
-        imgClass?: string;
-        ulClass?: string;
-        liClass?: string;
+        articleClass?: string | undefined;
+        divClass?: string | undefined;
+        imgClass?: string | undefined;
+        ulClass?: string | undefined;
+        liClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/rating/Star.svelte.d.ts

@@ -2,13 +2,13 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        fillPercent?: number;
-        fillColor?: string;
-        strokeColor?: string;
-        size?: number;
-        ariaLabel?: string;
-        id?: string;
-        role?: string;
+        fillPercent?: number | undefined;
+        fillColor?: string | undefined;
+        strokeColor?: string | undefined;
+        size?: number | undefined;
+        ariaLabel?: string | undefined;
+        id?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/rating/Thumbup.svelte.d.ts

@@ -2,13 +2,13 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        fillPercent?: number;
-        fillColor?: string;
-        strokeColor?: string;
-        size?: number;
-        ariaLabel?: string;
-        id?: string;
-        role?: string;
+        fillPercent?: number | undefined;
+        fillColor?: string | undefined;
+        strokeColor?: string | undefined;
+        size?: number | undefined;
+        ariaLabel?: string | undefined;
+        id?: string | undefined;
+        role?: string | undefined;
     };
     events: {
         click: MouseEvent;

package/dist/sidebar/Sidebar.svelte.d.ts

@@ -6,11 +6,11 @@ export type SidebarType = {
 declare const __propDef: {
     props: {
         [x: string]: any;
-        activeUrl?: string;
-        asideClass?: string;
-        nonActiveClass?: string;
-        activeClass?: string;
-        ariaLabel?: string;
+        activeUrl?: string | undefined;
+        asideClass?: string | undefined;
+        nonActiveClass?: string | undefined;
+        activeClass?: string | undefined;
+        ariaLabel?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/sidebar/SidebarBrand.svelte.d.ts

@@ -4,9 +4,9 @@ declare const __propDef: {
     props: {
         [x: string]: any;
         site: SiteType;
-        aClass?: string;
-        imgClass?: string;
-        spanClass?: string;
+        aClass?: string | undefined;
+        imgClass?: string | undefined;
+        spanClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;