includio-cms 0.1.4 → 0.5.0

package/dist/components/ui/select/select.stories.svelte.d.ts

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

@@ -0,0 +1,24 @@
+<script module>
+	import { defineMeta } from '@storybook/addon-svelte-csf';
+	import { Separator } from './index.js';
+
+	const { Story } = defineMeta({
+		title: 'UI/Feedback/Separator',
+		component: Separator,
+		tags: ['autodocs'],
+	});
+</script>
+
+<Story name="Horizontal">
+	<div style="max-width:300px;">
+		<Separator />
+	</div>
+</Story>
+
+<Story name="Vertical">
+	<div style="display:flex;align-items:center;gap:8px;height:32px;">
+		<span style="font-size:13px;">PL</span>
+		<Separator orientation="vertical" />
+		<span style="font-size:13px;">EN</span>
+	</div>
+</Story>

package/dist/components/ui/separator/separator.stories.svelte.d.ts

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

@@ -0,0 +1,29 @@
+<script module>
+	import { defineMeta } from '@storybook/addon-svelte-csf';
+	import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from './index.js';
+	import { Button } from '../button/index.js';
+
+	const { Story } = defineMeta({
+		title: 'UI/Overlays/Sheet',
+		component: Sheet,
+		tags: ['autodocs'],
+	});
+</script>
+
+<Story name="Publish Panel">
+	<Sheet>
+		<SheetTrigger>
+			<Button variant="ghost" size="icon">
+				<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.47 3.24l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-3.24-2.47l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 3.24-2.47l.06.06A1.65 1.65 0 0 0 9 4.68V3a2 2 0 0 1 4 0v.09c.04.63.36 1.2 1 1.51a1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.47 3.24l-.06.06A1.65 1.65 0 0 0 19.4 9c.33.58.87.96 1.51 1H21a2 2 0 0 1 0 4h-.09c-.63.04-1.2.36-1.51 1z"/></svg>
+			</Button>
+		</SheetTrigger>
+		<SheetContent>
+			<SheetHeader>
+				<SheetTitle>Publikacja</SheetTitle>
+			</SheetHeader>
+			<div style="padding:18px 0;font-size:14px;color:var(--muted-foreground);">
+				Panel publikacji z ustawieniami statusu, harmonogramem i checklistą a11y.
+			</div>
+		</SheetContent>
+	</Sheet>
+</Story>

package/dist/components/ui/sheet/sheet.stories.svelte.d.ts

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

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import type { HTMLAttributes } from "svelte/elements";
-	import { cn, type WithElementRef } from "../../../utils.js";
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { cn, type WithElementRef } from '../../../utils.js';
 
 	let {
 		ref = $bindable(null),
@@ -14,7 +14,7 @@
 	bind:this={ref}
 	data-slot="sidebar-group"
 	data-sidebar="group"
-	class={cn("relative flex w-full min-w-0 flex-col p-2", className)}
+	class={cn('relative flex w-full min-w-0 flex-col p-2', className)}
 	{...restProps}
 >
 	{@render children?.()}

package/dist/components/ui/sidebar/sidebar-group.svelte.d.ts

@@ -1,5 +1,5 @@
-import type { HTMLAttributes } from "svelte/elements";
-import { type WithElementRef } from "../../../utils.js";
+import type { HTMLAttributes } from 'svelte/elements';
+import { type WithElementRef } from '../../../utils.js';
 declare const SidebarGroup: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLElement>>, {}, "ref">;
 type SidebarGroup = ReturnType<typeof SidebarGroup>;
 export default SidebarGroup;

package/dist/components/ui/sidebar/sidebar-menu-button.svelte

@@ -1,47 +1,45 @@
 <script lang="ts" module>
-	import { tv, type VariantProps } from "tailwind-variants";
+	import { tv, type VariantProps } from 'tailwind-variants';
 
 	export const sidebarMenuButtonVariants = tv({
-		base: "peer/menu-button outline-hidden ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground group-has-data-[sidebar=menu-action]/menu-item:pr-8 data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm transition-[width,height,padding] focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:font-medium [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+		base: 'peer/menu-button outline-hidden ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground group-has-data-[sidebar=menu-action]/menu-item:pr-8 data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm transition-[width,height,padding] focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:font-medium [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',
 		variants: {
 			variant: {
-				default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+				default: 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
 				outline:
-					"bg-background hover:bg-sidebar-accent hover:text-sidebar-accent-foreground shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)]",
+					'bg-background hover:bg-sidebar-accent hover:text-sidebar-accent-foreground shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)]'
 			},
 			size: {
-				default: "h-8 text-sm",
-				sm: "h-7 text-xs",
-				lg: "group-data-[collapsible=icon]:p-0! h-12 text-sm",
-			},
+				default: 'h-8 text-sm',
+				sm: 'h-7 text-xs',
+				lg: 'group-data-[collapsible=icon]:p-0! h-12 text-sm'
+			}
 		},
 		defaultVariants: {
-			variant: "default",
-			size: "default",
-		},
+			variant: 'default',
+			size: 'default'
+		}
 	});
 
-	export type SidebarMenuButtonVariant = VariantProps<
-		typeof sidebarMenuButtonVariants
-	>["variant"];
-	export type SidebarMenuButtonSize = VariantProps<typeof sidebarMenuButtonVariants>["size"];
+	export type SidebarMenuButtonVariant = VariantProps<typeof sidebarMenuButtonVariants>['variant'];
+	export type SidebarMenuButtonSize = VariantProps<typeof sidebarMenuButtonVariants>['size'];
 </script>
 
 <script lang="ts">
-	import * as Tooltip from "../tooltip/index.js";
-	import { cn, type WithElementRef, type WithoutChildrenOrChild } from "../../../utils.js";
-	import { mergeProps } from "bits-ui";
-	import type { ComponentProps, Snippet } from "svelte";
-	import type { HTMLAttributes } from "svelte/elements";
-	import { useSidebar } from "./context.svelte.js";
+	import * as Tooltip from '../tooltip/index.js';
+	import { cn, type WithElementRef, type WithoutChildrenOrChild } from '../../../utils.js';
+	import { mergeProps } from 'bits-ui';
+	import type { ComponentProps, Snippet } from 'svelte';
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { useSidebar } from './context.svelte.js';
 
 	let {
 		ref = $bindable(null),
 		class: className,
 		children,
 		child,
-		variant = "default",
-		size = "default",
+		variant = 'default',
+		size = 'default',
 		isActive = false,
 		tooltipContent,
 		tooltipContentProps,
@@ -59,11 +57,11 @@
 
 	const buttonProps = $derived({
 		class: cn(sidebarMenuButtonVariants({ variant, size }), className),
-		"data-slot": "sidebar-menu-button",
-		"data-sidebar": "menu-button",
-		"data-size": size,
-		"data-active": isActive,
-		...restProps,
+		'data-slot': 'sidebar-menu-button',
+		'data-sidebar': 'menu-button',
+		'data-size': size,
+		'data-active': isActive,
+		...restProps
 	});
 </script>
 
@@ -90,10 +88,10 @@
 		<Tooltip.Content
 			side="right"
 			align="center"
-			hidden={sidebar.state !== "collapsed" || sidebar.isMobile}
+			hidden={sidebar.state !== 'collapsed' || sidebar.isMobile}
 			{...tooltipContentProps}
 		>
-			{#if typeof tooltipContent === "string"}
+			{#if typeof tooltipContent === 'string'}
 				{tooltipContent}
 			{:else if tooltipContent}
 				{@render tooltipContent()}

package/dist/components/ui/sidebar/sidebar-menu-button.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from "tailwind-variants";
+import { type VariantProps } from 'tailwind-variants';
 export declare const sidebarMenuButtonVariants: import("tailwind-variants").TVReturnType<{
     variant: {
         default: string;
@@ -30,12 +30,12 @@ export declare const sidebarMenuButtonVariants: import("tailwind-variants").TVRe
         lg: string;
     };
 }, undefined, "peer/menu-button outline-hidden ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground group-has-data-[sidebar=menu-action]/menu-item:pr-8 data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm transition-[width,height,padding] focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:font-medium [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0", unknown, unknown, undefined>>;
-export type SidebarMenuButtonVariant = VariantProps<typeof sidebarMenuButtonVariants>["variant"];
-export type SidebarMenuButtonSize = VariantProps<typeof sidebarMenuButtonVariants>["size"];
-import * as Tooltip from "../tooltip/index.js";
-import { type WithElementRef, type WithoutChildrenOrChild } from "../../../utils.js";
-import type { ComponentProps, Snippet } from "svelte";
-import type { HTMLAttributes } from "svelte/elements";
+export type SidebarMenuButtonVariant = VariantProps<typeof sidebarMenuButtonVariants>['variant'];
+export type SidebarMenuButtonSize = VariantProps<typeof sidebarMenuButtonVariants>['size'];
+import * as Tooltip from '../tooltip/index.js';
+import { type WithElementRef, type WithoutChildrenOrChild } from '../../../utils.js';
+import type { ComponentProps, Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
 type $$ComponentProps = WithElementRef<HTMLAttributes<HTMLButtonElement>, HTMLButtonElement> & {
     isActive?: boolean;
     variant?: SidebarMenuButtonVariant;

package/dist/components/ui/sidebar/sidebar-separator.svelte.d.ts

@@ -1,7 +1,7 @@
 declare const SidebarSeparator: import("svelte").Component<Omit<{
     orientation?: import("bits-ui").Orientation;
     decorative?: boolean;
-}, "child" | "children"> & {
+}, "children" | "child"> & {
     child?: import("svelte").Snippet<[{
         props: Record<string, unknown>;
     }]> | undefined;

package/dist/components/ui/sidebar/sidebar-trigger.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { Button } from "../button/index.js";
 	import { cn } from "../../../utils.js";
-	import PanelLeftIcon from "@lucide/svelte/icons/panel-left";
+	import LayoutSidebarIcon from "@tabler/icons-svelte/icons/layout-sidebar";
 	import type { ComponentProps } from "svelte";
 	import { useSidebar } from "./context.svelte.js";
 
@@ -22,7 +22,7 @@
 	data-slot="sidebar-trigger"
 	variant="ghost"
 	size="icon"
-	class={cn("size-7", className)}
+	class={cn("size-8", className)}
 	type="button"
 	onclick={(e) => {
 		onclick?.(e);
@@ -30,6 +30,6 @@
 	}}
 	{...restProps}
 >
-	<PanelLeftIcon />
-	<span class="sr-only">Toggle Sidebar</span>
+	<LayoutSidebarIcon class="size-[18px]" />
+	<span class="sr-only">Zwiń/rozwiń panel</span>
 </Button>

package/dist/components/ui/sonner/sonner.stories.svelte

@@ -0,0 +1,22 @@
+<script module>
+	import { defineMeta } from '@storybook/addon-svelte-csf';
+	import ToastDemo from './toast-demo.svelte';
+
+	const { Story } = defineMeta({
+		title: 'UI/Feedback/Toast',
+		component: ToastDemo,
+		tags: ['autodocs'],
+	});
+</script>
+
+<Story name="Success" args={{ variant: 'success' }} />
+
+<Story name="Error" args={{ variant: 'error' }} />
+
+<Story name="Warning" args={{ variant: 'warning' }} />
+
+<Story name="Info" args={{ variant: 'info' }} />
+
+<Story name="Default" args={{ variant: 'default' }} />
+
+<Story name="All Variants" args={{ variant: 'all' }} />

package/dist/components/ui/sonner/sonner.stories.svelte.d.ts

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

@@ -2,12 +2,18 @@
 	import { Toaster as Sonner, type ToasterProps as SonnerProps } from "svelte-sonner";
 	import { mode } from "mode-watcher";
 
-	let { ...restProps }: SonnerProps = $props();
+	let { richColors = false, ...restProps }: SonnerProps = $props();
 </script>
 
 <Sonner
 	theme={mode.current}
 	class="toaster group"
-	style="--normal-bg: var(--popover); --normal-text: var(--popover-foreground); --normal-border: var(--border);"
+	{richColors}
+	style="
+		--normal-bg: var(--popover, #fff);
+		--normal-text: var(--popover-foreground, #1A1A2E);
+		--normal-border: var(--border, #E2DFF0);
+		--border-radius: 12px;
+	"
 	{...restProps}
 />

package/dist/components/ui/sonner/toast-demo.svelte

@@ -0,0 +1,29 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { toast } from 'svelte-sonner';
+	import Sonner from './sonner.svelte';
+
+	let { variant = 'all' }: { variant?: 'success' | 'error' | 'warning' | 'info' | 'default' | 'all' } = $props();
+
+	const PERSIST = { duration: Infinity };
+
+	onMount(() => {
+		toast.dismiss();
+		setTimeout(() => {
+			if (variant === 'success' || variant === 'all')
+				toast.success('Wpis opublikowany', { description: 'Zmiany są już widoczne na stronie', ...PERSIST });
+			if (variant === 'error' || variant === 'all')
+				toast.error('Nie udało się zapisać', { description: 'Sprawdź wymagane pola i spróbuj ponownie', ...PERSIST });
+			if (variant === 'warning' || variant === 'all')
+				toast.warning('Brak opisu zdjęcia', { description: 'Dodaj opis alternatywny, żeby każdy mógł zrozumieć treść', ...PERSIST });
+			if (variant === 'info' || variant === 'all')
+				toast.info('Nowa wersja dostępna', { description: 'Odśwież stronę, żeby zobaczyć zmiany', ...PERSIST });
+			if (variant === 'default' || variant === 'all')
+				toast('Wersja robocza zapisana', PERSIST);
+		}, 100);
+	});
+</script>
+
+<div style="min-height: 420px; position: relative;">
+	<Sonner richColors visibleToasts={5} position="top-center" />
+</div>

package/dist/components/ui/sonner/toast-demo.svelte.d.ts

@@ -0,0 +1,6 @@
+type $$ComponentProps = {
+    variant?: 'success' | 'error' | 'warning' | 'info' | 'default' | 'all';
+};
+declare const ToastDemo: import("svelte").Component<$$ComponentProps, {}, "">;
+type ToastDemo = ReturnType<typeof ToastDemo>;
+export default ToastDemo;

package/dist/components/ui/textarea/textarea.stories.svelte

@@ -0,0 +1,22 @@
+<script module>
+	import { defineMeta } from '@storybook/addon-svelte-csf';
+	import { Textarea } from './index.js';
+
+	const { Story } = defineMeta({
+		title: 'UI/Forms/Textarea',
+		component: Textarea,
+		tags: ['autodocs'],
+	});
+</script>
+
+<Story name="Default">
+	<div style="max-width:400px;">
+		<Textarea placeholder="Treść artykułu..." rows={4} />
+	</div>
+</Story>
+
+<Story name="With Value">
+	<div style="max-width:400px;">
+		<Textarea rows={3} value="Praktyczny przewodnik po tworzeniu treści dostępnych dla wszystkich." />
+	</div>
+</Story>

package/dist/components/ui/textarea/textarea.stories.svelte.d.ts

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

@@ -16,9 +16,7 @@
 	data-slot={dataSlot}
 	class={cn(
 		"border-input placeholder:text-muted-foreground shadow-xs field-sizing-content flex min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base outline-none transition-[color,box-shadow] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
-		"dark:bg-slate-950/40 dark:border-slate-700/60 dark:shadow-[inset_0_2px_4px_rgb(0_0_0/0.15)]",
 		"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-		"dark:focus-visible:border-[#4975AE] dark:focus-visible:ring-[#2D4A77]/30",
 		"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
 		className
 	)}

package/dist/components/ui/toggle/toggle.stories.svelte

@@ -0,0 +1,22 @@
+<script module>
+	import { defineMeta } from '@storybook/addon-svelte-csf';
+	import { Toggle } from './index.js';
+
+	const { Story } = defineMeta({
+		title: 'UI/Actions/Toggle',
+		component: Toggle,
+		tags: ['autodocs'],
+	});
+</script>
+
+<Story name="Default">
+	<Toggle aria-label="Wyróżniony artykuł">
+		<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
+	</Toggle>
+</Story>
+
+<Story name="Pressed">
+	<Toggle pressed aria-label="Wyróżniony artykuł">
+		<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
+	</Toggle>
+</Story>

package/dist/components/ui/toggle/toggle.stories.svelte.d.ts

@@ -0,0 +1,27 @@
+export default Toggle;
+type Toggle = SvelteComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const Toggle: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+import { Toggle } from './index.js';
+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/ui/toggle-group/toggle-group.stories.svelte

@@ -0,0 +1,17 @@
+<script module>
+	import { defineMeta } from '@storybook/addon-svelte-csf';
+	import { ToggleGroup, ToggleGroupItem } from './index.js';
+
+	const { Story } = defineMeta({
+		title: 'UI/Actions/ToggleGroup',
+		component: ToggleGroup,
+		tags: ['autodocs'],
+	});
+</script>
+
+<Story name="Language Toggle">
+	<ToggleGroup type="single" value="pl">
+		<ToggleGroupItem value="pl" style="font-weight:600;font-size:12px;">PL</ToggleGroupItem>
+		<ToggleGroupItem value="en" style="font-weight:600;font-size:12px;">EN</ToggleGroupItem>
+	</ToggleGroup>
+</Story>

package/dist/components/ui/toggle-group/toggle-group.stories.svelte.d.ts

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

@@ -0,0 +1,26 @@
+<script module>
+	import { defineMeta } from '@storybook/addon-svelte-csf';
+	import { Tooltip, TooltipContent, TooltipTrigger, TooltipProvider } from './index.js';
+	import { Button } from '../button/index.js';
+
+	const { Story } = defineMeta({
+		title: 'UI/Feedback/Tooltip',
+		component: Tooltip,
+		tags: ['autodocs'],
+	});
+</script>
+
+<Story name="Plum Tooltip">
+	<TooltipProvider>
+		<Tooltip>
+			<TooltipTrigger>
+				<Button variant="ghost" size="icon">
+					<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
+				</Button>
+			</TooltipTrigger>
+			<TooltipContent>
+				<p>Historia</p>
+			</TooltipContent>
+		</Tooltip>
+	</TooltipProvider>
+</Story>