@reshape-biotech/design-system 0.0.41 → 0.0.43

package/dist/components/drawer/DrawerLabel.svelte

@@ -14,49 +14,47 @@
 
 <style>
 	label {
+		display: flex;
 
-    display: flex;
+		width: 100%;
 
-    width: 100%;
+		cursor: pointer;
 
-    cursor: pointer;
+		align-items: center;
 
-    align-items: center;
+		gap: 0.25rem;
 
-    gap: 0.25rem;
+		border-radius: 0.5rem;
 
-    border-radius: 0.5rem;
+		border-width: 1px;
 
-    border-width: 1px;
+		border-color: #12192a1a;
 
-    border-color: #12192A1A;
+		--tw-bg-opacity: 1;
 
-    --tw-bg-opacity: 1;
+		background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
 
-    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
+		padding: 0.75rem;
 
-    padding: 0.75rem;
+		--tw-text-opacity: 1;
 
-    --tw-text-opacity: 1;
+		color: rgb(18 25 42 / var(--tw-text-opacity, 1));
 
-    color: rgb(18 25 42 / var(--tw-text-opacity, 1));
+		--tw-shadow: 0px 1px 4px 0px rgba(18, 25, 42, 0.04);
 
-    --tw-shadow: 0px 1px 4px 0px rgba(18, 25, 42, 0.04);
+		--tw-shadow-colored: 0px 1px 4px 0px var(--tw-shadow-color);
 
-    --tw-shadow-colored: 0px 1px 4px 0px var(--tw-shadow-color);
-
-    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
-}
+		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
+			var(--tw-shadow);
+	}
 
 	label:not(:focus-within):hover {
-
-    border-color: #5750ee40
-}
+		border-color: #5750ee40;
+	}
 
 	label:focus-within {
+		--tw-border-opacity: 1;
 
-    --tw-border-opacity: 1;
-
-    border-color: rgb(87 80 238 / var(--tw-border-opacity, 1))
-}
+		border-color: rgb(87 80 238 / var(--tw-border-opacity, 1));
+	}
 </style>

package/dist/components/drawer/DrawerLabel.svelte.d.ts

@@ -1,9 +1,9 @@
 import type { Snippet } from 'svelte';
 interface Props {
-    id: string;
-    classes?: string;
-    children: Snippet;
+	id: string;
+	classes?: string;
+	children: Snippet;
 }
-declare const DrawerLabel: import("svelte").Component<Props, {}, "">;
+declare const DrawerLabel: import('svelte').Component<Props, {}, ''>;
 type DrawerLabel = ReturnType<typeof DrawerLabel>;
 export default DrawerLabel;

package/dist/components/dropdown/Dropdown.stories.svelte.d.ts

@@ -1,27 +1,48 @@
 export default Dropdown;
-type Dropdown = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
+type Dropdown = SvelteComponent<
+	{
+		[x: string]: never;
+	},
+	{
+		[evt: string]: CustomEvent<any>;
+	},
+	{}
+> & {
+	$$bindings?: string | undefined;
 };
-declare const Dropdown: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+declare const Dropdown: $$__sveltets_2_IsomorphicComponent<
+	{
+		[x: string]: never;
+	},
+	{
+		[evt: string]: CustomEvent<any>;
+	},
+	{},
+	{},
+	string
+>;
 import Dropdown from './Dropdown.svelte';
-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;
+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/components/dropdown/Dropdown.svelte.d.ts

@@ -4,23 +4,29 @@ import DropdownMenu from './components/DropdownMenu.svelte';
 import DropdownTrigger from './components/DropdownTrigger.svelte';
 import OutlinedButton from './components/OutlinedButton.svelte';
 interface Props {
-    side?: 'dropdown-top' | 'dropdown-bottom' | 'dropdown-left' | 'dropdown-right';
-    open?: boolean;
-    alignEnd?: boolean;
-    openOnHover?: boolean;
-    closeOnItemClick?: boolean;
-    class?: string;
-    trigger?: Snippet<[{
-        Trigger: typeof DropdownTrigger;
-        OutlinedButton: typeof OutlinedButton;
-    }]>;
-    content?: Snippet<[
-        {
-            DropdownContent: typeof DropdownContent;
-            DropdownMenu: typeof DropdownMenu;
-        }
-    ]>;
+	side?: 'dropdown-top' | 'dropdown-bottom' | 'dropdown-left' | 'dropdown-right';
+	open?: boolean;
+	alignEnd?: boolean;
+	openOnHover?: boolean;
+	closeOnItemClick?: boolean;
+	class?: string;
+	trigger?: Snippet<
+		[
+			{
+				Trigger: typeof DropdownTrigger;
+				OutlinedButton: typeof OutlinedButton;
+			}
+		]
+	>;
+	content?: Snippet<
+		[
+			{
+				DropdownContent: typeof DropdownContent;
+				DropdownMenu: typeof DropdownMenu;
+			}
+		]
+	>;
 }
-declare const Dropdown: import("svelte").Component<Props, {}, "open">;
+declare const Dropdown: import('svelte').Component<Props, {}, 'open'>;
 type Dropdown = ReturnType<typeof Dropdown>;
 export default Dropdown;

package/dist/components/dropdown/components/DropdownContent.svelte.d.ts

@@ -1,10 +1,10 @@
 import type { Snippet } from 'svelte';
 type Variant = 'primary' | 'secondary';
 interface Props {
-    class?: string;
-    variant?: Variant;
-    children?: Snippet;
+	class?: string;
+	variant?: Variant;
+	children?: Snippet;
 }
-declare const DropdownContent: import("svelte").Component<Props, {}, "">;
+declare const DropdownContent: import('svelte').Component<Props, {}, ''>;
 type DropdownContent = ReturnType<typeof DropdownContent>;
 export default DropdownContent;

package/dist/components/dropdown/components/DropdownMenu.svelte

@@ -18,6 +18,6 @@
 
 <style>
 	:global(.menu li > *:not(ul):not(.menu-title):not(details):active) {
-    background-color: #12192A1A
-}
+		background-color: #12192a1a;
+	}
 </style>

package/dist/components/dropdown/components/DropdownMenu.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 interface Props {
-    class?: string;
-    children?: Snippet;
+	class?: string;
+	children?: Snippet;
 }
-declare const DropdownMenu: import("svelte").Component<Props, {}, "">;
+declare const DropdownMenu: import('svelte').Component<Props, {}, ''>;
 type DropdownMenu = ReturnType<typeof DropdownMenu>;
 export default DropdownMenu;

package/dist/components/dropdown/components/DropdownTrigger.svelte.d.ts

@@ -1,12 +1,12 @@
 import type { Snippet } from 'svelte';
 type Color = 'primary' | 'secondary' | 'transparent' | 'danger';
 interface Props {
-    size?: 'sm' | 'md' | 'lg';
-    class?: string;
-    variant?: Color;
-    children?: Snippet;
-    noPadding?: boolean;
+	size?: 'sm' | 'md' | 'lg';
+	class?: string;
+	variant?: Color;
+	children?: Snippet;
+	noPadding?: boolean;
 }
-declare const DropdownTrigger: import("svelte").Component<Props, {}, "">;
+declare const DropdownTrigger: import('svelte').Component<Props, {}, ''>;
 type DropdownTrigger = ReturnType<typeof DropdownTrigger>;
 export default DropdownTrigger;

package/dist/components/dropdown/components/OutlinedButton.svelte

@@ -13,49 +13,47 @@
 
 <style>
 	button {
+		display: flex;
 
-    display: flex;
+		width: 100%;
 
-    width: 100%;
+		cursor: pointer;
 
-    cursor: pointer;
+		align-items: center;
 
-    align-items: center;
+		gap: 0.25rem;
 
-    gap: 0.25rem;
+		border-radius: 0.5rem;
 
-    border-radius: 0.5rem;
+		border-width: 1px;
 
-    border-width: 1px;
+		border-color: #12192a1a;
 
-    border-color: #12192A1A;
+		--tw-bg-opacity: 1;
 
-    --tw-bg-opacity: 1;
+		background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
 
-    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
+		padding: 0.75rem;
 
-    padding: 0.75rem;
+		--tw-text-opacity: 1;
 
-    --tw-text-opacity: 1;
+		color: rgb(18 25 42 / var(--tw-text-opacity, 1));
 
-    color: rgb(18 25 42 / var(--tw-text-opacity, 1));
+		--tw-shadow: 0px 1px 4px 0px rgba(18, 25, 42, 0.04);
 
-    --tw-shadow: 0px 1px 4px 0px rgba(18, 25, 42, 0.04);
+		--tw-shadow-colored: 0px 1px 4px 0px var(--tw-shadow-color);
 
-    --tw-shadow-colored: 0px 1px 4px 0px var(--tw-shadow-color);
-
-    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
-}
+		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
+			var(--tw-shadow);
+	}
 
 	button:not(:focus-within):hover {
-
-    border-color: #5750ee40
-}
+		border-color: #5750ee40;
+	}
 
 	button:focus-within {
+		--tw-border-opacity: 1;
 
-    --tw-border-opacity: 1;
-
-    border-color: rgb(87 80 238 / var(--tw-border-opacity, 1))
-}
+		border-color: rgb(87 80 238 / var(--tw-border-opacity, 1));
+	}
 </style>

package/dist/components/dropdown/components/OutlinedButton.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 interface Props {
-    class?: string;
-    children: Snippet;
+	class?: string;
+	children: Snippet;
 }
-declare const OutlinedButton: import("svelte").Component<Props, {}, "">;
+declare const OutlinedButton: import('svelte').Component<Props, {}, ''>;
 type OutlinedButton = ReturnType<typeof OutlinedButton>;
 export default OutlinedButton;

package/dist/components/icon-button/IconButton.stories.svelte.d.ts

@@ -1,19 +1,36 @@
 import IconButton from '../icon-button/IconButton.svelte';
-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;
+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 IconButton: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+declare const IconButton: $$__sveltets_2_IsomorphicComponent<
+	Record<string, never>,
+	{
+		[evt: string]: CustomEvent<any>;
+	},
+	{},
+	{},
+	string
+>;
 type IconButton = InstanceType<typeof IconButton>;
 export default IconButton;

package/dist/components/icon-button/IconButton.svelte.d.ts

@@ -1,14 +1,14 @@
 import type { Snippet } from 'svelte';
 interface Props {
-    color?: 'primary' | 'transparent' | 'secondary' | 'danger';
-    type?: 'button' | 'submit' | 'reset' | null | undefined;
-    loading?: boolean;
-    disabled?: boolean;
-    size?: 'xs' | 'sm' | 'md';
-    children?: Snippet;
-    onclick?: () => void;
-    tabindex?: number | undefined;
+	color?: 'primary' | 'transparent' | 'secondary' | 'danger';
+	type?: 'button' | 'submit' | 'reset' | null | undefined;
+	loading?: boolean;
+	disabled?: boolean;
+	size?: 'xs' | 'sm' | 'md';
+	children?: Snippet;
+	onclick?: () => void;
+	tabindex?: number | undefined;
 }
-declare const IconButton: import("svelte").Component<Props, {}, "">;
+declare const IconButton: import('svelte').Component<Props, {}, ''>;
 type IconButton = ReturnType<typeof IconButton>;
 export default IconButton;

package/dist/components/image/Image.svelte

@@ -50,7 +50,7 @@
 
 <style>
 	.image {
-    border-start-start-radius: 0.5rem;
-    border-end-start-radius: 0.5rem
-}
+		border-start-start-radius: 0.5rem;
+		border-end-start-radius: 0.5rem;
+	}
 </style>

package/dist/components/image/Image.svelte.d.ts

@@ -1,7 +1,7 @@
 interface Props {
-    src: string;
-    alt: string;
+	src: string;
+	alt: string;
 }
-declare const Image: import("svelte").Component<Props, {}, "">;
+declare const Image: import('svelte').Component<Props, {}, ''>;
 type Image = ReturnType<typeof Image>;
 export default Image;

package/dist/components/input/Input.stories.svelte.d.ts

@@ -1,27 +1,48 @@
 export default Input;
-type Input = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
+type Input = SvelteComponent<
+	{
+		[x: string]: never;
+	},
+	{
+		[evt: string]: CustomEvent<any>;
+	},
+	{}
+> & {
+	$$bindings?: string | undefined;
 };
-declare const Input: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+declare const Input: $$__sveltets_2_IsomorphicComponent<
+	{
+		[x: string]: never;
+	},
+	{
+		[evt: string]: CustomEvent<any>;
+	},
+	{},
+	{},
+	string
+>;
 import Input from './Input.svelte';
-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;
+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/components/input/Input.svelte

@@ -123,60 +123,54 @@
 <style>
 	input,
 	textarea {
+		width: 100%;
 
-    width: 100%;
+		resize: none;
 
-    resize: none;
+		overflow: hidden;
 
-    overflow: hidden;
+		outline: 2px solid transparent;
 
-    outline: 2px solid transparent;
-
-    outline-offset: 2px
-}
+		outline-offset: 2px;
+	}
 
 	div:not(:focus-within):hover {
-
-    border-color: #5750ee40
-}
+		border-color: #5750ee40;
+	}
 
 	div:focus-within {
+		--tw-border-opacity: 1;
 
-    --tw-border-opacity: 1;
-
-    border-color: rgb(87 80 238 / var(--tw-border-opacity, 1))
-}
+		border-color: rgb(87 80 238 / var(--tw-border-opacity, 1));
+	}
 
 	.size-xs {
+		padding: 0.5rem;
 
-    padding: 0.5rem;
+		font-size: 0.75rem;
 
-    font-size: 0.75rem;
-
-    line-height: 1rem
-}
+		line-height: 1rem;
+	}
 
 	.size-sm {
+		padding-left: 0.75rem;
 
-    padding-left: 0.75rem;
-
-    padding-right: 0.75rem;
+		padding-right: 0.75rem;
 
-    padding-top: 0.5rem;
+		padding-top: 0.5rem;
 
-    padding-bottom: 0.5rem;
+		padding-bottom: 0.5rem;
 
-    font-size: 0.875rem;
+		font-size: 0.875rem;
 
-    line-height: 1.25rem
-}
+		line-height: 1.25rem;
+	}
 
 	.size-md {
+		padding: 0.75rem;
 
-    padding: 0.75rem;
-
-    font-size: 1rem;
+		font-size: 1rem;
 
-    line-height: 1.5rem
-}
+		line-height: 1.5rem;
+	}
 </style>

package/dist/components/input/Input.svelte.d.ts

@@ -1,21 +1,25 @@
 import type { Snippet } from 'svelte';
-declare const Input: import("svelte").Component<{
-    label?: string | null;
-    value: string | number;
-    type?: "text" | "password" | "textarea" | "number";
-    required?: boolean;
-    autofocus?: boolean;
-    placeholder?: string;
-    id?: string | undefined;
-    validator?: (a: string | number) => boolean;
-    onBlur?: (e: Event) => void;
-    onkeydown?: (e: KeyboardEvent) => void;
-    prefix?: Snippet<[any]>;
-    suffix?: Snippet;
-    error?: Snippet;
-    input?: HTMLInputElement | HTMLTextAreaElement;
-    maxlength?: number | null;
-    size?: "xs" | "sm" | "md";
-}, {}, "input" | "value">;
+declare const Input: import('svelte').Component<
+	{
+		label?: string | null;
+		value: string | number;
+		type?: 'text' | 'password' | 'textarea' | 'number';
+		required?: boolean;
+		autofocus?: boolean;
+		placeholder?: string;
+		id?: string | undefined;
+		validator?: (a: string | number) => boolean;
+		onBlur?: (e: Event) => void;
+		onkeydown?: (e: KeyboardEvent) => void;
+		prefix?: Snippet<[any]>;
+		suffix?: Snippet;
+		error?: Snippet;
+		input?: HTMLInputElement | HTMLTextAreaElement;
+		maxlength?: number | null;
+		size?: 'xs' | 'sm' | 'md';
+	},
+	{},
+	'input' | 'value'
+>;
 type Input = ReturnType<typeof Input>;
 export default Input;