@reshape-biotech/design-system 0.0.43 → 0.0.44

package/dist/components/drawer/DrawerLabel.svelte

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

@@ -9,51 +9,53 @@
 	let { class: className = '', children }: Props = $props();
 </script>
 
-<button class={`${className}`}>{@render children()}</button>
+<div role="button" tabindex="0" class={`${className}`}>{@render children()}</div>
 
 <style>
-	button {
-		display: flex;
+	div {
 
-		width: 100%;
+    display: flex;
 
-		cursor: pointer;
+    width: 100%;
 
-		align-items: center;
+    cursor: pointer;
 
-		gap: 0.25rem;
+    align-items: center;
 
-		border-radius: 0.5rem;
+    gap: 0.25rem;
 
-		border-width: 1px;
+    border-radius: 0.5rem;
 
-		border-color: #12192a1a;
+    border-width: 1px;
 
-		--tw-bg-opacity: 1;
+    border-color: #12192A1A;
 
-		background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
+    --tw-bg-opacity: 1;
 
-		padding: 0.75rem;
+    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
 
-		--tw-text-opacity: 1;
+    padding: 0.75rem;
 
-		color: rgb(18 25 42 / var(--tw-text-opacity, 1));
+    --tw-text-opacity: 1;
 
-		--tw-shadow: 0px 1px 4px 0px rgba(18, 25, 42, 0.04);
+    color: rgb(18 25 42 / var(--tw-text-opacity, 1));
 
-		--tw-shadow-colored: 0px 1px 4px 0px var(--tw-shadow-color);
+    --tw-shadow: 0px 1px 4px 0px rgba(18, 25, 42, 0.04);
 
-		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
-			var(--tw-shadow);
-	}
+    --tw-shadow-colored: 0px 1px 4px 0px var(--tw-shadow-color);
 
-	button:not(:focus-within):hover {
-		border-color: #5750ee40;
-	}
+    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
+}
 
-	button:focus-within {
-		--tw-border-opacity: 1;
+	div:not(:focus-within):hover {
 
-		border-color: rgb(87 80 238 / var(--tw-border-opacity, 1));
-	}
+    border-color: #5750ee40
+}
+
+	div:focus-within {
+
+    --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,36 +1,19 @@
 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,48 +1,27 @@
 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,54 +123,60 @@
 <style>
 	input,
 	textarea {
-		width: 100%;
 
-		resize: none;
+    width: 100%;
 
-		overflow: hidden;
+    resize: none;
 
-		outline: 2px solid transparent;
+    overflow: hidden;
 
-		outline-offset: 2px;
-	}
+    outline: 2px solid transparent;
+
+    outline-offset: 2px
+}
 
 	div:not(:focus-within):hover {
-		border-color: #5750ee40;
-	}
+
+    border-color: #5750ee40
+}
 
 	div:focus-within {
-		--tw-border-opacity: 1;
 
-		border-color: rgb(87 80 238 / var(--tw-border-opacity, 1));
-	}
+    --tw-border-opacity: 1;
+
+    border-color: rgb(87 80 238 / var(--tw-border-opacity, 1))
+}
 
 	.size-xs {
-		padding: 0.5rem;
 
-		font-size: 0.75rem;
+    padding: 0.5rem;
 
-		line-height: 1rem;
-	}
+    font-size: 0.75rem;
+
+    line-height: 1rem
+}
 
 	.size-sm {
-		padding-left: 0.75rem;
 
-		padding-right: 0.75rem;
+    padding-left: 0.75rem;
 
-		padding-top: 0.5rem;
+    padding-right: 0.75rem;
 
-		padding-bottom: 0.5rem;
+    padding-top: 0.5rem;
 
-		font-size: 0.875rem;
+    padding-bottom: 0.5rem;
 
-		line-height: 1.25rem;
-	}
+    font-size: 0.875rem;
+
+    line-height: 1.25rem
+}
 
 	.size-md {
-		padding: 0.75rem;
 
-		font-size: 1rem;
+    padding: 0.75rem;
 
-		line-height: 1.5rem;
-	}
+    font-size: 1rem;
+
+    line-height: 1.5rem
+}
 </style>