@tanglemedia/svelte-starter-ui-shadcn 0.0.6 → 0.2.0

package/dist/app.css

@@ -0,0 +1,121 @@
+@import "tailwindcss";
+
+@import "tw-animate-css";
+
+@custom-variant dark (&:is(.dark *));
+
+:root {
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.129 0.042 264.695);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.129 0.042 264.695);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.129 0.042 264.695);
+  --primary: oklch(0.208 0.042 265.755);
+  --primary-foreground: oklch(0.984 0.003 247.858);
+  --secondary: oklch(0.968 0.007 247.896);
+  --secondary-foreground: oklch(0.208 0.042 265.755);
+  --muted: oklch(0.968 0.007 247.896);
+  --muted-foreground: oklch(0.554 0.046 257.417);
+  --accent: oklch(0.968 0.007 247.896);
+  --accent-foreground: oklch(0.208 0.042 265.755);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.929 0.013 255.508);
+  --input: oklch(0.929 0.013 255.508);
+  --ring: oklch(0.704 0.04 256.788);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --sidebar: oklch(0.984 0.003 247.858);
+  --sidebar-foreground: oklch(0.129 0.042 264.695);
+  --sidebar-primary: oklch(0.208 0.042 265.755);
+  --sidebar-primary-foreground: oklch(0.984 0.003 247.858);
+  --sidebar-accent: oklch(0.968 0.007 247.896);
+  --sidebar-accent-foreground: oklch(0.208 0.042 265.755);
+  --sidebar-border: oklch(0.929 0.013 255.508);
+  --sidebar-ring: oklch(0.704 0.04 256.788);
+}
+
+.dark {
+  --background: oklch(0.129 0.042 264.695);
+  --foreground: oklch(0.984 0.003 247.858);
+  --card: oklch(0.208 0.042 265.755);
+  --card-foreground: oklch(0.984 0.003 247.858);
+  --popover: oklch(0.208 0.042 265.755);
+  --popover-foreground: oklch(0.984 0.003 247.858);
+  --primary: oklch(0.929 0.013 255.508);
+  --primary-foreground: oklch(0.208 0.042 265.755);
+  --secondary: oklch(0.279 0.041 260.031);
+  --secondary-foreground: oklch(0.984 0.003 247.858);
+  --muted: oklch(0.279 0.041 260.031);
+  --muted-foreground: oklch(0.704 0.04 256.788);
+  --accent: oklch(0.279 0.041 260.031);
+  --accent-foreground: oklch(0.984 0.003 247.858);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.551 0.027 264.364);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.208 0.042 265.755);
+  --sidebar-foreground: oklch(0.984 0.003 247.858);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.984 0.003 247.858);
+  --sidebar-accent: oklch(0.279 0.041 260.031);
+  --sidebar-accent-foreground: oklch(0.984 0.003 247.858);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.551 0.027 264.364);
+}
+
+@theme inline {
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+}

package/dist/index.d.ts

@@ -1 +1,2 @@
-export * from './lib';
+export * from "./lib/index.ts";
+export type * from "./lib/components/extra/types.ts";

package/dist/index.js

@@ -1 +1 @@
-export * from './lib';
+export * from "./lib/index.js";

package/dist/lib/components/extended/confirmation/confirmation-prompt.svelte

@@ -0,0 +1,78 @@
+<script lang="ts">
+	import { AlertDialog } from '@tanglemedia/svelte-starter-ui-shadcn';
+	import { cn } from '../../utils.js';
+	import { useConfirmationDialog } from './confirmation-state.svelte';
+
+	const dialog = useConfirmationDialog();
+
+	const { title, description, confirmLabel, cancelLabel, variant, onClose, onCancel, onConfirm } =
+		$derived(dialog.props);
+
+	/** Prevents double-settle when dismiss handlers and AlertDialog close both run. */
+	let settled = $state(false);
+
+	$effect(() => {
+		if (dialog.open) {
+			settled = false;
+		}
+	});
+
+	/**
+	 * Closes the dialog and reports the user's choice once.
+	 */
+	const close = (s: boolean): void => {
+		if (settled) {
+			return;
+		}
+
+		settled = true;
+		dialog.hide();
+		onClose?.(s);
+	};
+
+	/**
+	 * Confirms the pending action and closes the dialog.
+	 */
+	const handleOnConfirm = (): void => {
+		onConfirm?.();
+		close(true);
+	};
+
+	/**
+	 * Cancels the pending action and closes the dialog.
+	 */
+	const handleOnCancel = (): void => {
+		onCancel?.();
+		close(false);
+	};
+</script>
+
+<AlertDialog.Root bind:open={dialog.open}>
+	<AlertDialog.Content
+		class="sm:max-w-md"
+		interactOutsideBehavior="close"
+		onInteractOutside={handleOnCancel}
+		onEscapeKeydown={handleOnCancel}
+	>
+		<AlertDialog.Header>
+			<AlertDialog.Title>{title}</AlertDialog.Title>
+			<AlertDialog.Description>
+				{description}
+			</AlertDialog.Description>
+		</AlertDialog.Header>
+		<AlertDialog.Footer class="grid grid-cols-2 sm:flex-row sm:justify-stretch">
+			<AlertDialog.Cancel class="h-9 w-full min-w-0 sm:flex-1" onclick={handleOnCancel}>
+				{cancelLabel}
+			</AlertDialog.Cancel>
+			<AlertDialog.Action
+				class={cn(
+					'h-9 w-full min-w-0 sm:flex-1',
+					variant === 'destructive' && 'bg-destructive text-white hover:bg-destructive/90'
+				)}
+				onclick={handleOnConfirm}
+			>
+				{confirmLabel}
+			</AlertDialog.Action>
+		</AlertDialog.Footer>
+	</AlertDialog.Content>
+</AlertDialog.Root>

package/dist/lib/components/extended/confirmation/confirmation-prompt.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const ConfirmationPrompt: import("svelte").Component<Record<string, never>, {}, "">;
+type ConfirmationPrompt = ReturnType<typeof ConfirmationPrompt>;
+export default ConfirmationPrompt;

package/dist/lib/components/extended/confirmation/confirmation-provider.svelte

@@ -0,0 +1,19 @@
+<script lang="ts" module>
+</script>
+
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	import { initConfirmationDialog } from './confirmation-state.svelte';
+	import ConfirmationPrompt from './confirmation-prompt.svelte';
+
+	type Props = { children?: Snippet<[]> };
+
+	const { children }: Props = $props();
+
+	initConfirmationDialog();
+</script>
+
+{@render children?.()}
+
+<ConfirmationPrompt />

package/dist/lib/components/extended/confirmation/confirmation-provider.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { Snippet } from 'svelte';
+type Props = {
+    children?: Snippet<[]>;
+};
+declare const ConfirmationProvider: import("svelte").Component<Props, {}, "">;
+type ConfirmationProvider = ReturnType<typeof ConfirmationProvider>;
+export default ConfirmationProvider;

package/dist/lib/components/extended/confirmation/confirmation-state.svelte.d.ts

@@ -0,0 +1,36 @@
+export type ConfirmationDialogVariant = "default" | "destructive";
+export type ConfirmationDialogProps = {
+    title?: string;
+    description?: string;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    variant?: ConfirmationDialogVariant;
+    onConfirm?: () => void;
+    onCancel?: () => void;
+    onClose?: (state: boolean) => void;
+};
+/**
+ * Builds the shared copy for deleting a module entity.
+ *
+ * @example
+ * deleteConfirmation("character")
+ * // { title: "Delete Character", description: "Are you sure you would like to delete Character?", ... }
+ */
+export declare function deleteConfirmation(item: string): Required<Pick<ConfirmationDialogProps, "title" | "description" | "confirmLabel" | "cancelLabel" | "variant">>;
+/**
+ * Shared confirmation dialog state used by `Confirmation.Provider`.
+ */
+export declare class ConfirmationDialogState {
+    props: ConfirmationDialogProps;
+    open: boolean;
+    toggle(): void;
+    show(): void;
+    hide(): void;
+    /**
+     * Opens the confirmation dialog and resolves with the user's choice.
+     */
+    confirm(props: Partial<ConfirmationDialogProps>): Promise<boolean>;
+}
+export declare function initConfirmationDialog(): void;
+export declare function getConfirmationDialog(): ConfirmationDialogState | undefined;
+export declare function useConfirmationDialog(): ConfirmationDialogState;

package/dist/lib/components/extended/confirmation/confirmation-state.svelte.js

@@ -0,0 +1,93 @@
+import { getContext, setContext } from "svelte";
+const defaultProps = {
+    title: "Are you sure?",
+    description: "This action cannot be undone.",
+    confirmLabel: "Yes",
+    cancelLabel: "No",
+    variant: "default",
+};
+/**
+ * Title-cases entity labels used in delete confirmation copy.
+ *
+ * @example
+ * toTitleCaseLabel('chatbot') // 'Chatbot'
+ * toTitleCaseLabel('MCP server') // 'MCP Server'
+ */
+function toTitleCaseLabel(value) {
+    return value
+        .trim()
+        .split(/\s+/)
+        .map((word) => {
+        if (word === word.toUpperCase() && word.length > 1) {
+            return word;
+        }
+        return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
+    })
+        .join(" ");
+}
+/**
+ * Builds the shared copy for deleting a module entity.
+ *
+ * @example
+ * deleteConfirmation("character")
+ * // { title: "Delete Character", description: "Are you sure you would like to delete Character?", ... }
+ */
+export function deleteConfirmation(item) {
+    const label = toTitleCaseLabel(item);
+    return {
+        title: `Delete ${label}`,
+        description: `Are you sure you would like to delete ${label}?`,
+        confirmLabel: "Yes",
+        cancelLabel: "No",
+        variant: "destructive",
+    };
+}
+/**
+ * Shared confirmation dialog state used by `Confirmation.Provider`.
+ */
+export class ConfirmationDialogState {
+    props = $state({ ...defaultProps });
+    open = $state(false);
+    toggle() {
+        this.open = !this.open;
+    }
+    show() {
+        this.open = true;
+    }
+    hide() {
+        this.open = false;
+    }
+    /**
+     * Opens the confirmation dialog and resolves with the user's choice.
+     */
+    async confirm(props) {
+        const p = { ...defaultProps, ...props };
+        return new Promise((ok) => {
+            this.show();
+            const { onClose, ...rest } = p;
+            this.props = {
+                ...rest,
+                onClose: (s) => {
+                    if (onClose) {
+                        onClose(s);
+                    }
+                    ok(s);
+                },
+            };
+        });
+    }
+}
+const ctxKey = `--confirmation-dialog`;
+export function initConfirmationDialog() {
+    setContext(Symbol.for(ctxKey), new ConfirmationDialogState());
+}
+export function getConfirmationDialog() {
+    return getContext(Symbol.for(ctxKey));
+}
+export function useConfirmationDialog() {
+    const dialog = getConfirmationDialog();
+    if (!dialog) {
+        throw Error("Dialog has not been initialized. Please make sure you have called to confirmation provider");
+    }
+    return dialog;
+}

package/dist/lib/components/extended/confirmation/confirmation-state.svelte.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/lib/components/extended/confirmation/confirmation-state.svelte.test.js

@@ -0,0 +1,114 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { ConfirmationDialogState, deleteConfirmation, initConfirmationDialog, getConfirmationDialog, useConfirmationDialog, } from './confirmation-state.svelte.js';
+const { mockSetContext, mockGetContext } = vi.hoisted(() => ({
+    mockSetContext: vi.fn(),
+    mockGetContext: vi.fn(),
+}));
+vi.mock('svelte', async (ori) => {
+    const actual = await ori();
+    return { ...actual, setContext: mockSetContext, getContext: mockGetContext };
+});
+describe('ConfirmationDialogState', () => {
+    it('starts with open false and the default props', () => {
+        const state = new ConfirmationDialogState();
+        expect(state.open).toBe(false);
+        expect(state.props.title).toBe('Are you sure?');
+        expect(state.props.description).toBe('This action cannot be undone.');
+    });
+    it('show() sets open to true', () => {
+        const state = new ConfirmationDialogState();
+        state.show();
+        expect(state.open).toBe(true);
+    });
+    it('hide() sets open to false', () => {
+        const state = new ConfirmationDialogState();
+        state.show();
+        state.hide();
+        expect(state.open).toBe(false);
+    });
+    it('toggle() flips open between true and false', () => {
+        const state = new ConfirmationDialogState();
+        state.toggle();
+        expect(state.open).toBe(true);
+        state.toggle();
+        expect(state.open).toBe(false);
+    });
+    describe('confirm()', () => {
+        it('shows the dialog and merges the provided props', async () => {
+            const state = new ConfirmationDialogState();
+            state.confirm({ title: 'Delete?', description: 'Irreversible.' });
+            expect(state.open).toBe(true);
+            expect(state.props.title).toBe('Delete?');
+            expect(state.props.description).toBe('Irreversible.');
+        });
+        it('uses default title and description when props are omitted', async () => {
+            const state = new ConfirmationDialogState();
+            state.confirm({});
+            expect(state.props.title).toBe('Are you sure?');
+            expect(state.props.description).toBe('This action cannot be undone.');
+        });
+        it('resolves with true when onClose is called with true', async () => {
+            const state = new ConfirmationDialogState();
+            const promise = state.confirm({});
+            state.props.onClose?.(true);
+            await expect(promise).resolves.toBe(true);
+        });
+        it('resolves with false when onClose is called with false', async () => {
+            const state = new ConfirmationDialogState();
+            const promise = state.confirm({});
+            state.props.onClose?.(false);
+            await expect(promise).resolves.toBe(false);
+        });
+        it('invokes the provided onClose callback before resolving', async () => {
+            const onClose = vi.fn();
+            const state = new ConfirmationDialogState();
+            const promise = state.confirm({ onClose });
+            state.props.onClose?.(true);
+            await promise;
+            expect(onClose).toHaveBeenCalledWith(true);
+        });
+    });
+});
+describe('confirmation context helpers', () => {
+    beforeEach(() => {
+        mockSetContext.mockClear();
+        mockGetContext.mockClear();
+    });
+    it('initConfirmationDialog calls setContext with a ConfirmationDialogState instance', () => {
+        initConfirmationDialog();
+        expect(mockSetContext).toHaveBeenCalledOnce();
+        const [, instance] = mockSetContext.mock.calls[0];
+        expect(instance).toBeInstanceOf(ConfirmationDialogState);
+    });
+    it('getConfirmationDialog returns the value from getContext', () => {
+        const state = new ConfirmationDialogState();
+        mockGetContext.mockReturnValue(state);
+        expect(getConfirmationDialog()).toBe(state);
+        expect(mockGetContext).toHaveBeenCalledOnce();
+    });
+    it('useConfirmationDialog returns the dialog when context is initialized', () => {
+        const state = new ConfirmationDialogState();
+        mockGetContext.mockReturnValue(state);
+        expect(useConfirmationDialog()).toBe(state);
+    });
+    it('useConfirmationDialog throws when context has not been initialized', () => {
+        mockGetContext.mockReturnValue(undefined);
+        expect(() => useConfirmationDialog()).toThrowError('Dialog has not been initialized');
+    });
+});
+describe('deleteConfirmation', () => {
+    it('builds Title Case delete copy for a module entity', () => {
+        expect(deleteConfirmation('character')).toEqual({
+            title: 'Delete Character',
+            description: 'Are you sure you would like to delete Character?',
+            confirmLabel: 'Yes',
+            cancelLabel: 'No',
+            variant: 'destructive',
+        });
+    });
+    it('title-cases multi-word entity labels', () => {
+        expect(deleteConfirmation('input check').title).toBe('Delete Input Check');
+        expect(deleteConfirmation('MCP server').title).toBe('Delete MCP Server');
+        expect(deleteConfirmation('chatbot').title).toBe('Delete Chatbot');
+    });
+});

package/dist/lib/components/extended/confirmation/index.d.ts

@@ -0,0 +1,4 @@
+import Provider from "./confirmation-provider.svelte";
+import Prompt from "./confirmation-prompt.svelte";
+import { getConfirmationDialog, useConfirmationDialog, ConfirmationDialogState, deleteConfirmation } from "./confirmation-state.svelte";
+export { Provider, Provider as Root, Prompt, getConfirmationDialog, useConfirmationDialog, ConfirmationDialogState, deleteConfirmation, };

package/dist/lib/components/extended/confirmation/index.js

@@ -0,0 +1,4 @@
+import Provider from "./confirmation-provider.svelte";
+import Prompt from "./confirmation-prompt.svelte";
+import { getConfirmationDialog, useConfirmationDialog, ConfirmationDialogState, deleteConfirmation, } from "./confirmation-state.svelte";
+export { Provider, Provider as Root, Prompt, getConfirmationDialog, useConfirmationDialog, ConfirmationDialogState, deleteConfirmation, };

package/dist/lib/components/extended/image-link/image-link.svelte

@@ -0,0 +1,53 @@
+<script lang="ts">
+  import { cn } from '@tanglemedia/svelte-starter-ui-shadcn';
+  import type { Component, Snippet } from 'svelte';
+
+  type Props = {
+    href?: string;
+    children?: Snippet<[]>;
+    top?: Snippet<[{ class?: string }]>;
+    bottom?: Snippet<[]>;
+    class?: string;
+    icon?: Component<{ class?: string }>;
+    src?: string;
+  };
+
+  let {
+    href,
+    children,
+    class: cls,
+    icon: Icon,
+    src,
+    top,
+    bottom,
+  }: Props = $props();
+
+  const base =
+    'bg-primary/85 hover:bg-primary/95 text-primary-foreground rounded-md min-h-24 text-center';
+  const topCls = 'z-10 mx-auto mb-2';
+</script>
+
+<a href={href || '##'} class={cn('relative flex justify-center', base, cls)}>
+  <div class={cn('relative flex flex-col justify-center', 'z-10')}>
+    {#if top}
+      {@render top({ class: topCls })}
+    {/if}
+    {#if Icon}
+      <Icon class={topCls} />
+      <!-- <Fa {icon} class={'z-10 mx-auto mb-2 text-4xl'} /> -->
+    {/if}
+
+    {@render children?.()}
+
+    {#if bottom}
+      {@render bottom()}
+    {/if}
+  </div>
+  {#if src}
+    <img
+      {src}
+      alt={'background image'}
+      class={'absolute z-0 h-full w-full object-cover opacity-25'}
+    />
+  {/if}
+</a>

package/dist/lib/components/extended/image-link/image-link.svelte.d.ts

@@ -0,0 +1,17 @@
+import type { Component, Snippet } from 'svelte';
+type Props = {
+    href?: string;
+    children?: Snippet<[]>;
+    top?: Snippet<[{
+        class?: string;
+    }]>;
+    bottom?: Snippet<[]>;
+    class?: string;
+    icon?: Component<{
+        class?: string;
+    }>;
+    src?: string;
+};
+declare const ImageLink: Component<Props, {}, "">;
+type ImageLink = ReturnType<typeof ImageLink>;
+export default ImageLink;

package/dist/lib/components/extended/image-link/image-link.svelte.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/lib/components/extended/image-link/image-link.svelte.test.js

@@ -0,0 +1,27 @@
+import { render } from '@testing-library/svelte';
+import { describe, it, expect } from 'vitest';
+import ImageLink from './image-link.svelte';
+describe('ImageLink', () => {
+    it('renders an anchor element', () => {
+        const { container } = render(ImageLink);
+        expect(container.querySelector('a')).toBeTruthy();
+    });
+    it('uses the provided href', () => {
+        const { container } = render(ImageLink, { props: { href: '/dashboard' } });
+        expect(container.querySelector('a')?.getAttribute('href')).toBe('/dashboard');
+    });
+    it('falls back to ## when no href is provided', () => {
+        const { container } = render(ImageLink);
+        expect(container.querySelector('a')?.getAttribute('href')).toBe('##');
+    });
+    it('renders a background image when src is provided', () => {
+        const { container } = render(ImageLink, { props: { src: '/hero.jpg' } });
+        const img = container.querySelector('img');
+        expect(img).toBeTruthy();
+        expect(img?.getAttribute('src')).toBe('/hero.jpg');
+    });
+    it('does not render an img element when src is absent', () => {
+        const { container } = render(ImageLink);
+        expect(container.querySelector('img')).toBeNull();
+    });
+});

package/dist/lib/components/extended/image-link/index.d.ts

@@ -0,0 +1,2 @@
+import Root from "./image-link.svelte";
+export { Root, Root as ImageLink };

package/dist/lib/components/extended/image-link/index.js

@@ -0,0 +1,2 @@
+import Root from "./image-link.svelte";
+export { Root, Root as ImageLink };

package/dist/lib/components/extended/index.d.ts

@@ -0,0 +1,8 @@
+export * as Skeletons from "./skeletons/index.ts";
+export * as ImageLink from "./image-link/index.ts";
+export * as Confirmation from "./confirmation/index.ts";
+export * as Loaders from "./loaders/index.ts";
+export * as JsonViewer from "./json-viewer/index.ts";
+export * as InlineEdit from "./inline-edit/index.ts";
+export { InlineEditState } from "./inline-edit/index.ts";
+export type { InlineEditCommit, InlineEditNormalize, InlineEditStateOptions, InlineEditStatus, InlineEditValidate, } from "./inline-edit/index.ts";

package/dist/lib/components/extended/index.js

@@ -0,0 +1,7 @@
+export * as Skeletons from "./skeletons/index.js";
+export * as ImageLink from "./image-link/index.js";
+export * as Confirmation from "./confirmation/index.js";
+export * as Loaders from "./loaders/index.js";
+export * as JsonViewer from "./json-viewer/index.js";
+export * as InlineEdit from "./inline-edit/index.js";
+export { InlineEditState } from "./inline-edit/index.js";

package/dist/lib/components/extended/inline-edit/index.d.ts

@@ -0,0 +1,9 @@
+import Display from "./inline-edit-display.svelte";
+import Error from "./inline-edit-error.svelte";
+import Input from "./inline-edit-input.svelte";
+import Root from "./inline-edit-root.svelte";
+import Status from "./inline-edit-status.svelte";
+export { Display, Error, Input, Root, Status };
+export { useInlineEditContext } from "./inline-edit.context.svelte.js";
+export { InlineEditState } from "./inline-edit-state.class.svelte.js";
+export type { InlineEditCommit, InlineEditNormalize, InlineEditStateOptions, InlineEditStatus, InlineEditValidate, } from "./inline-edit-state.class.svelte.js";

package/dist/lib/components/extended/inline-edit/index.js

@@ -0,0 +1,8 @@
+import Display from "./inline-edit-display.svelte";
+import Error from "./inline-edit-error.svelte";
+import Input from "./inline-edit-input.svelte";
+import Root from "./inline-edit-root.svelte";
+import Status from "./inline-edit-status.svelte";
+export { Display, Error, Input, Root, Status };
+export { useInlineEditContext } from "./inline-edit.context.svelte.js";
+export { InlineEditState } from "./inline-edit-state.class.svelte.js";