@flightlesslabs/dodo-ui 0.19.1 → 1.0.0--beta-2

package/dist/stories/components/Form/Button/IconButton/IconButton.stories.svelte

@@ -1,43 +0,0 @@
-<script module>
-  import { defineMeta } from '@storybook/addon-svelte-csf';
-  import Button from '../Button.svelte';
-  import { storyButtonArgTypes } from '../Button.stories.svelte';
-  import Icon from '@iconify/svelte';
-
-  // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-  const { Story } = defineMeta({
-    component: Button,
-    tags: ['autodocs'],
-    argTypes: storyButtonArgTypes,
-  });
-</script>
-
-<!-- Compact button with paddings stripped out and fixed size. We are using this icon library https://iconify.design/docs/icon-components/svelte/ -->
-<Story name="Icon Button" args={{ compact: true }}>
-  <Icon icon="material-symbols:app-badging" width="18" height="18" />
-</Story>
-
-<!-- Circualr Icon button. -->
-<Story name="Icon Button Circular" args={{ compact: true, roundness: 'full' }}>
-  <Icon icon="material-symbols:app-badging" width="18" height="18" />
-</Story>
-
-<!-- Button with an icon in front. -->
-<Story name="Icon Before" asChild>
-  <Button>
-    {#snippet before()}
-      <Icon icon="material-symbols:content-copy" />
-    {/snippet}
-    Copy
-  </Button>
-</Story>
-
-<!-- Button with an icon in front. -->
-<Story name="Icon After" asChild>
-  <Button>
-    {#snippet after()}
-      <Icon icon="material-symbols:download-2" />
-    {/snippet}
-    Download
-  </Button>
-</Story>

package/dist/stories/components/Form/Button/IconButton/IconButton.stories.svelte.d.ts

@@ -1,26 +0,0 @@
-export default IconButton;
-type IconButton = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const IconButton: $$__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/components/Form/Button/Roundness/Roundness.stories.svelte

@@ -1,23 +0,0 @@
-<script module>
-  import { defineMeta } from '@storybook/addon-svelte-csf';
-  import Button from '../Button.svelte';
-  import { storyButtonArgTypes } from '../Button.stories.svelte';
-
-  // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-  const { Story } = defineMeta({
-    component: Button,
-    tags: ['autodocs'],
-    argTypes: storyButtonArgTypes,
-  });
-</script>
-
-<Story name="Roundness 1">Click me!</Story>
-
-<Story name="Roundness 2" args={{ roundness: 2 }}>Click me!</Story>
-
-<Story name="Roundness 3" args={{ roundness: 3 }}>Click me!</Story>
-
-<Story name="Roundness 0" args={{ roundness: 0 }}>Click me!</Story>
-
-<!-- Button with 50% roundness usefull for icon (Compact) buttons -->
-<Story name="Roundness Full" args={{ roundness: 'full', compact: true }}>C</Story>

package/dist/stories/components/Form/Button/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;
-}

package/dist/stories/components/Form/Button/Size/Size.stories.svelte

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

package/dist/stories/components/Form/Button/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/components/Form/Button/Variant/Variant.stories.svelte

@@ -1,18 +0,0 @@
-<script module>
-  import { defineMeta } from '@storybook/addon-svelte-csf';
-  import Button from '../Button.svelte';
-  import { storyButtonArgTypes } from '../Button.stories.svelte';
-
-  // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-  const { Story } = defineMeta({
-    component: Button,
-    tags: ['autodocs'],
-    argTypes: storyButtonArgTypes,
-  });
-</script>
-
-<Story name="Solid">Click me!</Story>
-
-<Story name="Text" args={{ variant: 'text' }}>Click me!</Story>
-
-<Story name="Text Outline" args={{ variant: 'text', outline: true }}>Click me!</Story>

package/dist/stories/components/Form/Button/Variant/Variant.stories.svelte.d.ts

@@ -1,26 +0,0 @@
-export default Variant;
-type Variant = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Variant: $$__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/components/Form/Button/utils/scss/mixins.scss

@@ -1,86 +0,0 @@
-/// Mixin: generate-dodo-ui-button-colors
-/// Generates CSS custom properties for Dodo UI button styles (text & solid)
-/// across different interaction states (default, hover, active).
-/// @param {String} $color-name - The theme color name (e.g., "primary", "safe", etc.)
-@mixin generate-dodo-ui-button-colors($color-name) {
-  --dodo-ui-Button-outline-#{$color-name}: var(--dodo-color-#{$color-name}-400);
-
-  --dodo-ui-Button-text-#{$color-name}-bg: var(--dodo-color-#{$color-name}-100);
-  --dodo-ui-Button-text-#{$color-name}-hover-bg: var(--dodo-color-#{$color-name}-200);
-  --dodo-ui-Button-text-#{$color-name}-active-bg: var(--dodo-color-#{$color-name}-300);
-
-  --dodo-ui-Button-solid-#{$color-name}-bg: var(--dodo-color-#{$color-name}-500);
-  --dodo-ui-Button-solid-#{$color-name}-hover-bg: var(--dodo-color-#{$color-name}-600);
-  --dodo-ui-Button-solid-#{$color-name}-active-bg: var(--dodo-color-#{$color-name}-700);
-}
-
-/// Mixin: generate-dodo-ui-button-colors
-/// Generates CSS custom properties for Dodo UI button styles (text & solid)
-/// across different interaction states (default, hover, active).
-/// @param {String} $color-name - The theme color name (e.g., "primary", "safe", etc.)
-@mixin generate-dodo-ui-button-colors-dark($color-name) {
-  --dodo-ui-Button-outline-#{$color-name}: color-mix(
-    in oklab,
-    var(--dodo-color-#{$color-name}-300) 90%,
-    #fff
-  );
-
-  --dodo-ui-Button-text-#{$color-name}-bg: color-mix(
-    in oklab,
-    var(--dodo-color-#{$color-name}-50) 90%,
-    #fff
-  );
-  --dodo-ui-Button-text-#{$color-name}-hover-bg: color-mix(
-    in oklab,
-    var(--dodo-color-#{$color-name}-100) 90%,
-    #fff
-  );
-  --dodo-ui-Button-text-#{$color-name}-active-bg: color-mix(
-    in oklab,
-    var(--dodo-color-#{$color-name}-200) 90%,
-    #fff
-  );
-
-  --dodo-ui-Button-solid-#{$color-name}-bg: var(--dodo-color-#{$color-name}-400);
-  --dodo-ui-Button-solid-#{$color-name}-hover-bg: var(--dodo-color-#{$color-name}-300);
-  --dodo-ui-Button-solid-#{$color-name}-active-bg: var(--dodo-color-#{$color-name}-200);
-}
-
-/// Mixin: generate-dodo-ui-button-color
-/// Auto-generates .color--[theme] > .variant--text & .variant--solid styles
-/// @param {String} $theme - e.g., default, safe, danger, etc.
-@mixin generate-dodo-ui-button-color($theme) {
-  &--#{$theme} {
-    &.variant {
-      &--text {
-        color: var(--dodo-color-#{$theme}-800);
-        background-color: var(--dodo-ui-Button-text-#{$theme}-bg);
-
-        &:hover {
-          background-color: var(--dodo-ui-Button-text-#{$theme}-hover-bg);
-        }
-
-        &:active {
-          background-color: var(--dodo-ui-Button-text-#{$theme}-active-bg);
-        }
-
-        &.outline {
-          border-color: var(--dodo-ui-Button-outline-#{$theme});
-        }
-      }
-
-      &--solid {
-        color: var(--dodo-color-constant-white);
-        background-color: var(--dodo-ui-Button-solid-#{$theme}-bg);
-
-        &:hover {
-          background-color: var(--dodo-ui-Button-solid-#{$theme}-hover-bg);
-        }
-
-        &:active {
-          background-color: var(--dodo-ui-Button-solid-#{$theme}-active-bg);
-        }
-      }
-    }
-  }
-}

package/dist/stories/components/Form/Checkbox/Checkbox.stories.svelte

@@ -1,39 +0,0 @@
-<script module lang="ts">import { defineMeta } from '@storybook/addon-svelte-csf';
-import Checkbox from './Checkbox.svelte';
-import { componentRoundnessArray } from '../../../../types/roundness.js';
-import { componentColorArray } from '../../../../types/colors.js';
-import { componentSizeArray } from '../../../../types/size.js';
-export const storyCheckboxArgTypes = {
-    color: {
-        control: { type: 'select' },
-        options: componentColorArray,
-    },
-    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: Checkbox,
-    tags: ['autodocs'],
-    argTypes: storyCheckboxArgTypes,
-});
-</script>
-
-<!-- Checkbox with default style -->
-<Story name="Primary" />
-
-<Story name="WithText">This is Checkbox</Story>
-
-<Story name="Checked" args={{ checked: true }} />
-
-<Story name="Indeterminate" args={{ checked: true, indeterminate: true }} />
-
-<Story name="Disabled" args={{ disabled: true }} />
-
-<Story name="Checked Disabled" args={{ checked: true, disabled: true }} />

package/dist/stories/components/Form/Checkbox/Checkbox.stories.svelte.d.ts

@@ -1,21 +0,0 @@
-import Checkbox from './Checkbox.svelte';
-import type { StoryBookArgTypes } from '../../../../storybook-types.js';
-export declare const storyCheckboxArgTypes: 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 Checkbox: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type Checkbox = InstanceType<typeof Checkbox>;
-export default Checkbox;