@flightlesslabs/dodo-ui 0.19.1 → 0.20.0

package/dist/stories/developer tools/components/DynamicInput/DynamicInput.stories.svelte

@@ -1,49 +0,0 @@
-<script module lang="ts">import { defineMeta } from '@storybook/addon-svelte-csf';
-import DynamicInput, { dynamicInputVariantArray } from './DynamicInput.svelte';
-import { componentSizeArray } from '../../../../types/size.js';
-import { textInputTypeArray } from '../../../components/Form/TextInput/TextInput.svelte';
-import Icon from '@iconify/svelte';
-export const storyDynamicInputArgTypes = {
-    type: {
-        control: { type: 'select' },
-        options: textInputTypeArray,
-    },
-    variant: {
-        control: { type: 'select' },
-        options: dynamicInputVariantArray,
-    },
-    size: {
-        control: { type: 'select' },
-        options: componentSizeArray,
-    },
-};
-// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-const { Story } = defineMeta({
-    component: DynamicInput,
-    tags: ['autodocs'],
-    argTypes: storyDynamicInputArgTypes,
-    args: { value: 'Hello world!' },
-});
-</script>
-
-<Story name="Default" />
-
-<!-- Clickable button type Variant -->
-<Story name="VariantButton" args={{ variant: 'button' }} />
-
-<!-- Clickable button type Variant with placeholder -->
-<Story
-  name="ButtonWithPlaceholder"
-  args={{ variant: 'button', placeholder: 'Type Something...', value: '' }}
-/>
-
-<Story name="CustomInputContent" asChild>
-  <DynamicInput variant="button" value="Hello world!">
-    {#snippet customInputContent(value)}
-      <div>
-        {`${value}`}
-        <Icon icon="material-symbols:ads-click" width="24" height="24" style="color: #d21313" />
-      </div>
-    {/snippet}
-  </DynamicInput>
-</Story>

package/dist/stories/developer tools/components/DynamicInput/DynamicInput.stories.svelte.d.ts

@@ -1,21 +0,0 @@
-import DynamicInput from './DynamicInput.svelte';
-import type { StoryBookArgTypes } from '../../../../storybook-types.js';
-export declare const storyDynamicInputArgTypes: StoryBookArgTypes;
-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: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const DynamicInput: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type DynamicInput = InstanceType<typeof DynamicInput>;
-export default DynamicInput;

package/dist/stories/developer tools/components/DynamicInput/DynamicInput.svelte

@@ -1,111 +0,0 @@
-<script lang="ts" module>import {} from '../../../../index.js';
-export const dynamicInputVariantArray = ['input', 'button'];
-</script>
-
-<script lang="ts">"use strict";
-let { type = 'text', name, id, class: className = '', disabled = false, onchange, oninput, onblur, onfocus, onpaste, oncopy, oncut, onkeydown, onkeypress, onkeyup, value = $bindable(), focused = $bindable(), placeholder, ref = $bindable(), readonly = false, variant = 'input', size = 'normal', onclick, customInputContent, } = $props();
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-let customInputContentTyped = customInputContent;
-function onclickMod(e) {
-    if (onfocus) {
-        onfocus(e);
-    }
-    if (onclick) {
-        onclick(e);
-    }
-}
-function onfocusMod(e) {
-    focused = true;
-    if (onfocus) {
-        onfocus(e);
-    }
-}
-function onblurMod(e) {
-    focused = false;
-    if (onblur) {
-        onblur(e);
-    }
-}
-</script>
-
-{#if variant === 'button'}
-  <button
-    {id}
-    class={[
-      'dodo-ui-DynamicInput',
-      `size--${size}`,
-      `variant--${variant}`,
-      `${!value ? 'placeholder' : ''}`,
-      className,
-    ].join(' ')}
-    bind:this={ref}
-    onclick={onclickMod}
-    {onkeydown}
-    {onkeypress}
-    {onkeyup}
-    onfocus={onfocusMod}
-    onblur={onblurMod}
-    {disabled}
-  >
-    {#if customInputContentTyped}
-      {@render customInputContentTyped(value)}
-    {:else}
-      {`${value}` || placeholder}
-    {/if}
-  </button>
-{:else}
-  <input
-    class={['dodo-ui-DynamicInput', `size--${size}`, `variant--${variant}`, className].join(' ')}
-    {type}
-    {name}
-    {id}
-    {disabled}
-    {oninput}
-    {onchange}
-    onfocus={onfocusMod}
-    onblur={onblurMod}
-    {onpaste}
-    {oncopy}
-    {oncut}
-    {onkeydown}
-    {onkeypress}
-    {onkeyup}
-    {placeholder}
-    bind:value
-    bind:this={ref}
-    {readonly}
-  />
-{/if}
-
-<style>.dodo-ui-DynamicInput {
-  flex: 1;
-  border: 0;
-  outline: 0;
-  height: 100%;
-  background-color: transparent;
-  font-family: inherit;
-  color: inherit;
-  letter-spacing: 0.3px;
-  margin: 0;
-}
-.dodo-ui-DynamicInput.variant--button {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  cursor: pointer;
-}
-.dodo-ui-DynamicInput.variant--button.placeholder {
-  opacity: 0.6;
-}
-.dodo-ui-DynamicInput.size--normal {
-  font-size: 1rem;
-  padding: 0 calc(var(--dodo-ui-space-small) * 2);
-}
-.dodo-ui-DynamicInput.size--small {
-  padding: 0 var(--dodo-ui-space);
-  font-size: 0.9rem;
-}
-.dodo-ui-DynamicInput.size--large {
-  font-size: 1.1rem;
-  padding: 0 calc(var(--dodo-ui-space) * 2);
-}</style>

package/dist/stories/developer tools/components/DynamicInput/DynamicInput.svelte.d.ts

@@ -1,71 +0,0 @@
-import { type ComponentSize, type TextInputType } from '../../../../index.js';
-import type { Snippet } from 'svelte';
-import type { ChangeEventHandler, ClipboardEventHandler, FocusEventHandler, FormEventHandler, KeyboardEventHandler, MouseEventHandler } from 'svelte/elements';
-export type DynamicInputVariant = 'input' | 'button';
-export declare const dynamicInputVariantArray: DynamicInputVariant[];
-export type DynamicInputClickEvent = MouseEvent & {
-    currentTarget: EventTarget & HTMLButtonElement;
-};
-export type DynamicInputFocusEvent = FocusEvent & {
-    currentTarget: EventTarget & (HTMLInputElement | HTMLButtonElement);
-};
-export type DynamicInputKeyboardEvent = KeyboardEvent & {
-    currentTarget: EventTarget & (HTMLInputElement | HTMLButtonElement);
-};
-export interface DynamicInputProps {
-    /** How large should the button be? */
-    size?: ComponentSize;
-    /** Input type? */
-    type?: TextInputType;
-    /** Input ref */
-    ref?: HTMLInputElement | HTMLButtonElement;
-    /** Input value */
-    value?: string | number;
-    /** is focused, set focused */
-    focused?: boolean;
-    /** variant */
-    variant?: DynamicInputVariant;
-    /** How round should the border radius be? */
-    placeholder?: string;
-    /** disabled state */
-    disabled?: boolean;
-    /** Read only ? */
-    readonly?: boolean;
-    /** Name */
-    name?: string;
-    /** Id */
-    id?: string;
-    /** Icon before button content */
-    before?: Snippet;
-    /** Icon after button content */
-    after?: Snippet;
-    /** Custom css class*/
-    class?: string;
-    /** The onclick event handler */
-    onclick?: MouseEventHandler<HTMLButtonElement>;
-    /** oninput event handler */
-    oninput?: FormEventHandler<HTMLInputElement>;
-    /** onchange event handler */
-    onchange?: ChangeEventHandler<HTMLInputElement>;
-    /** onblur event handler */
-    onblur?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;
-    /** onfocus event handler */
-    onfocus?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;
-    /** onpaste event handler */
-    onpaste?: ClipboardEventHandler<HTMLInputElement>;
-    /** oncopy event handler */
-    oncopy?: ClipboardEventHandler<HTMLInputElement>;
-    /** oncut event handler */
-    oncut?: ClipboardEventHandler<HTMLInputElement>;
-    /** onkeydown event handler */
-    onkeydown?: KeyboardEventHandler<HTMLInputElement | HTMLButtonElement>;
-    /** onkeypress event handler */
-    onkeypress?: KeyboardEventHandler<HTMLInputElement | HTMLButtonElement>;
-    /** onkeyup event handler */
-    onkeyup?: KeyboardEventHandler<HTMLInputElement | HTMLButtonElement>;
-    /** custom Content Formatting for variant button */
-    customInputContent?: (value: string | number) => Snippet;
-}
-declare const DynamicInput: import("svelte").Component<DynamicInputProps, {}, "ref" | "focused" | "value">;
-type DynamicInput = ReturnType<typeof DynamicInput>;
-export default DynamicInput;

package/dist/stories/developer tools/components/DynamicInput/Events/Events.stories.svelte

@@ -1,115 +0,0 @@
-<script module lang="ts">import { defineMeta } from '@storybook/addon-svelte-csf';
-import { storyDynamicInputArgTypes } from '../DynamicInput.stories.svelte';
-import DynamicInput, {} from '../DynamicInput.svelte';
-// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-const { Story } = defineMeta({
-    component: DynamicInput,
-    tags: ['autodocs'],
-    argTypes: storyDynamicInputArgTypes,
-    args: { value: 'Hello world!' },
-});
-</script>
-
-<Story
-  name="Input"
-  args={{
-    oninput: (e: Event) => {
-      const target = e.target as HTMLInputElement;
-
-      console.log('Input Event', target.value);
-    },
-  }}
-/>
-
-<Story
-  name="Change"
-  args={{
-    onchange: (e: Event) => {
-      const target = e.target as HTMLInputElement;
-
-      console.log('onChange Event', target.value);
-    },
-  }}
-/>
-
-<Story
-  name="Focus"
-  args={{
-    onfocus: (e: DynamicInputFocusEvent) => {
-      const target = e.target as HTMLInputElement;
-
-      console.log('onfocus Event', target);
-    },
-  }}
-/>
-
-<Story
-  name="Blur"
-  args={{
-    onblur: (e: DynamicInputFocusEvent) => {
-      const target = e.target as HTMLInputElement;
-
-      console.log('onblur Event', target);
-    },
-  }}
-/>
-
-<Story
-  name="Copy"
-  args={{
-    oncopy: (e: TextInputClipboardEvent) => {
-      const target = e.target as HTMLInputElement;
-
-      console.log('oncopy Event', target);
-    },
-  }}
-/>
-
-<Story
-  name="Cut"
-  args={{
-    oncut: (e: TextInputClipboardEvent) => {
-      const target = e.target as HTMLInputElement;
-
-      console.log('oncut Event', target);
-    },
-  }}
-/>
-
-<Story
-  name="Paste"
-  args={{
-    onpaste: (e: TextInputClipboardEvent) => {
-      const target = e.target as HTMLInputElement;
-
-      console.log('onpaste Event', target);
-    },
-  }}
-/>
-
-<Story
-  name="KeyDown"
-  args={{
-    onkeydown: (e: DynamicInputKeyboardEvent) => {
-      console.log('onkeydown Event', e.key);
-    },
-  }}
-/>
-
-<Story
-  name="KeyPress"
-  args={{
-    onkeypress: (e: DynamicInputKeyboardEvent) => {
-      console.log('onkeypress Event', e.key);
-    },
-  }}
-/>
-
-<Story
-  name="KeyUp"
-  args={{
-    onkeyup: (e: DynamicInputKeyboardEvent) => {
-      console.log('onkeyup Event', e.key);
-    },
-  }}
-/>

package/dist/stories/developer tools/components/DynamicInput/Events/Events.stories.svelte.d.ts

@@ -1,18 +0,0 @@
-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: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Events: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type Events = InstanceType<typeof Events>;
-export default Events;

package/dist/stories/developer tools/components/DynamicInput/Size/Size.stories.svelte

@@ -1,17 +0,0 @@
-<script module>
-  import { defineMeta } from '@storybook/addon-svelte-csf';
-  import DynamicInput from '../DynamicInput.svelte';
-  import { storyDynamicInputArgTypes } from '../DynamicInput.stories.svelte';
-
-  // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-  const { Story } = defineMeta({
-    component: DynamicInput,
-    tags: ['autodocs'],
-    argTypes: storyDynamicInputArgTypes,
-    args: { value: 'Hello world!' },
-  });
-</script>
-
-<Story name="Normal" />
-<Story name="Small" args={{ size: 'small' }} />
-<Story name="Large" args={{ size: 'large' }} />

package/dist/stories/developer tools/components/DynamicInput/Size/Size.stories.svelte.d.ts

@@ -1,26 +0,0 @@
-export default Size;
-type Size = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Size: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, 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: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}

package/dist/stories/developer tools/components/InputEnclosure/InputEnclosure.stories.svelte

@@ -1,34 +0,0 @@
-<script module lang="ts">import { defineMeta } from '@storybook/addon-svelte-csf';
-import InputEnclosure from './InputEnclosure.svelte';
-import { componentRoundnessArray } from '../../../../types/roundness.js';
-import { componentSizeArray } from '../../../../types/size.js';
-export const storyInputEnclosureArgTypes = {
-    roundness: {
-        control: { type: 'select' },
-        options: componentRoundnessArray,
-    },
-    size: {
-        control: { type: 'select' },
-        options: componentSizeArray,
-    },
-};
-// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-const { Story } = defineMeta({
-    component: InputEnclosure,
-    tags: ['autodocs'],
-    argTypes: storyInputEnclosureArgTypes,
-});
-</script>
-
-<!-- An ensloure for Form Inputs [TextInput](?path=/docs/components-form-textinput--docs) -->
-<Story name="Default" />
-
-<Story name="Focused" args={{ focused: true }} />
-
-<Story name="Error" args={{ error: true }} />
-
-<Story name="Disabled" args={{ disabled: true }} />
-
-<Story name="Input example">
-  <input type="text" style="flex: 1; border: 0;" placeholder="Enter name" />
-</Story>

package/dist/stories/developer tools/components/InputEnclosure/InputEnclosure.svelte

@@ -1,124 +0,0 @@
-<script lang="ts" module>export {};
-</script>
-
-<script lang="ts">"use strict";
-let { size = 'normal', roundness = 1, outline = true, class: className = '', disabled = false, before, after, error = false, focused = false, children, ref = $bindable(), } = $props();
-</script>
-
-<div
-  class:outline
-  class:disabled
-  class:error
-  class:focused
-  class={['dodo-ui-InputEnclosure', `size--${size}`, `roundness--${roundness}`, className].join(
-    ' ',
-  )}
-  bind:this={ref}
->
-  {#if before}
-    <span class="content--before">
-      {@render before()}
-    </span>
-  {/if}
-
-  {#if children}
-    {@render children()}
-  {/if}
-
-  {#if after}
-    <span class="content--after">
-      {@render after()}
-    </span>
-  {/if}
-</div>
-
-<style>:global(:root) {
-  --dodo-ui-InputEnclosure-border-color: var(--dodo-color-neutral-500);
-  --dodo-ui-InputEnclosure-focus-border-color: var(--dodo-color-primary-500);
-  --dodo-ui-InputEnclosure-error-border-color: var(--dodo-color-danger-500);
-  --dodo-ui-InputEnclosure-disabled-color: var(--dodo-color-neutral-400);
-  --dodo-ui-InputEnclosure-disabled-bg: var(--dodo-color-neutral-200);
-}
-
-:global(.dodo-theme--dark) {
-  --dodo-ui-InputEnclosure-border-color: var(--dodo-color-neutral-600);
-  --dodo-ui-InputEnclosure-focus-border-color: var(--dodo-color-primary-600);
-  --dodo-ui-InputEnclosure-error-border-color: var(--dodo-color-danger-600);
-  --dodo-ui-InputEnclosure-disabled-bg: var(--dodo-color-neutral-100);
-  --dodo-ui-InputEnclosure-disabled-color: var(--dodo-color-neutral-500);
-}
-
-.dodo-ui-InputEnclosure {
-  display: flex;
-  overflow: hidden;
-  color: var(--dodo-color-neutral-800);
-  transition: all 150ms;
-  border: 0;
-}
-.dodo-ui-InputEnclosure.outline {
-  border-style: solid;
-  border-width: var(--dodo-ui-element-border-width);
-  border-color: var(--dodo-ui-InputEnclosure-border-color);
-}
-.dodo-ui-InputEnclosure.focused {
-  border-color: var(--dodo-ui-InputEnclosure-focus-border-color);
-}
-.dodo-ui-InputEnclosure.error {
-  border-color: var(--dodo-ui-InputEnclosure-error-border-color);
-}
-.dodo-ui-InputEnclosure.disabled {
-  cursor: initial;
-  background-color: var(--dodo-ui-InputEnclosure-disabled-bg);
-  color: var(--dodo-ui-InputEnclosure-disabled-color);
-  border-color: var(--dodo-ui-InputEnclosure-disabled-bg);
-}
-.dodo-ui-InputEnclosure .content--after:empty, .dodo-ui-InputEnclosure .content--before:empty {
-  display: none;
-}
-.dodo-ui-InputEnclosure .content--after, .dodo-ui-InputEnclosure .content--before {
-  display: inline-flex;
-  height: 100%;
-  align-items: center;
-}
-.dodo-ui-InputEnclosure.size--normal {
-  height: var(--dodo-ui-element-height-normal);
-}
-.dodo-ui-InputEnclosure.size--normal .content--before {
-  margin-left: 12px;
-  margin-right: -4px;
-}
-.dodo-ui-InputEnclosure.size--normal .content--after {
-  margin-right: 12px;
-  margin-left: -4px;
-}
-.dodo-ui-InputEnclosure.size--small {
-  height: var(--dodo-ui-element-height-small);
-}
-.dodo-ui-InputEnclosure.size--small .content--before {
-  margin-left: 8px;
-  margin-right: -2px;
-}
-.dodo-ui-InputEnclosure.size--small .content--after {
-  margin-right: 8px;
-  margin-left: -2px;
-}
-.dodo-ui-InputEnclosure.size--large {
-  height: var(--dodo-ui-element-height-large);
-}
-.dodo-ui-InputEnclosure.size--large .content--before {
-  margin-left: 14px;
-  margin-right: -4px;
-}
-.dodo-ui-InputEnclosure.size--large .content--after {
-  margin-right: 14px;
-  margin-left: -4px;
-}
-.dodo-ui-InputEnclosure.roundness--1 {
-  border-radius: var(--dodo-ui-element-roundness-1);
-}
-.dodo-ui-InputEnclosure.roundness--2 {
-  border-radius: var(--dodo-ui-element-roundness-2);
-}
-.dodo-ui-InputEnclosure.roundness--3 {
-  border-radius: var(--dodo-ui-element-roundness-3);
-}</style>

package/dist/stories/developer tools/components/InputEnclosure/InputEnclosure.svelte.d.ts

@@ -1,30 +0,0 @@
-import type { ComponentRoundness } from '../../../../types/roundness.js';
-import type { ComponentSize } from '../../../../types/size.js';
-import type { Snippet } from 'svelte';
-export interface InputEnclosureProps {
-    /** InputEnclosure contents goes here */
-    children?: Snippet;
-    /** InputEnclosure ref */
-    ref?: HTMLDivElement;
-    /** How large should the button be? */
-    size?: ComponentSize;
-    /** How round should the border radius be? */
-    roundness?: ComponentRoundness;
-    /** Add a border around the button. Default True */
-    outline?: boolean;
-    /** disabled state */
-    disabled?: boolean;
-    /** is there any associated Error ? */
-    error?: boolean;
-    /** is focused */
-    focused?: boolean;
-    /** Icon before button content */
-    before?: Snippet;
-    /** Icon after button content */
-    after?: Snippet;
-    /** Custom css class*/
-    class?: string;
-}
-declare const InputEnclosure: import("svelte").Component<InputEnclosureProps, {}, "ref">;
-type InputEnclosure = ReturnType<typeof InputEnclosure>;
-export default InputEnclosure;

package/dist/stories/developer tools/components/InputEnclosure/Roundness/Roundness.stories.svelte

@@ -1,20 +0,0 @@
-<script module>
-  import { defineMeta } from '@storybook/addon-svelte-csf';
-  import InputEnclosure from '../InputEnclosure.svelte';
-  import { storyInputEnclosureArgTypes } from '../InputEnclosure.stories.svelte';
-
-  // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-  const { Story } = defineMeta({
-    component: InputEnclosure,
-    tags: ['autodocs'],
-    argTypes: storyInputEnclosureArgTypes,
-  });
-</script>
-
-<Story name="Roundness 1" />
-
-<Story name="Roundness 2" args={{ roundness: 2 }} />
-
-<Story name="Roundness 3" args={{ roundness: 3 }} />
-
-<Story name="Roundness 0" args={{ roundness: 0 }} />

package/dist/stories/developer tools/components/InputEnclosure/Roundness/Roundness.stories.svelte.d.ts

@@ -1,26 +0,0 @@
-export default Roundness;
-type Roundness = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Roundness: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, 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: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}