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

package/dist/lib/components/ui/data-table/data-table.svelte.js

@@ -1,111 +0,0 @@
-import { createTable, } from "@tanstack/table-core";
-/**
- * Creates a reactive TanStack table object for Svelte.
- * @param options Table options to create the table with.
- * @returns A reactive table object.
- * @example
- * ```svelte
- * <script>
- *   const table = createSvelteTable({ ... })
- * </script>
- *
- * <table>
- *   <thead>
- *     {#each table.getHeaderGroups() as headerGroup}
- *       <tr>
- *         {#each headerGroup.headers as header}
- *           <th colspan={header.colSpan}>
- *         	   <FlexRender content={header.column.columnDef.header} context={header.getContext()} />
- *         	 </th>
- *         {/each}
- *       </tr>
- *     {/each}
- *   </thead>
- * 	 <!-- ... -->
- * </table>
- * ```
- */
-export function createSvelteTable(options) {
-    const resolvedOptions = mergeObjects({
-        state: {},
-        onStateChange() { },
-        renderFallbackValue: null,
-        mergeOptions: (defaultOptions, options) => {
-            return mergeObjects(defaultOptions, options);
-        },
-    }, options);
-    const table = createTable(resolvedOptions);
-    let state = $state(table.initialState);
-    function updateOptions() {
-        table.setOptions((prev) => {
-            return mergeObjects(prev, options, {
-                state: mergeObjects(state, options.state || {}),
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                onStateChange: (updater) => {
-                    if (updater instanceof Function)
-                        state = updater(state);
-                    else
-                        state = mergeObjects(state, updater);
-                    options.onStateChange?.(updater);
-                },
-            });
-        });
-    }
-    updateOptions();
-    $effect.pre(() => {
-        updateOptions();
-    });
-    return table;
-}
-/**
- * Lazily merges several objects (or thunks) while preserving
- * getter semantics from every source.
- *
- * Proxy-based to avoid known WebKit recursion issue.
- */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function mergeObjects(...sources) {
-    const resolve = (src) => typeof src === "function" ? (src() ?? undefined) : src;
-    const findSourceWithKey = (key) => {
-        for (let i = sources.length - 1; i >= 0; i--) {
-            const obj = resolve(sources[i]);
-            if (obj && key in obj)
-                return obj;
-        }
-        return undefined;
-    };
-    return new Proxy(Object.create(null), {
-        get(_, key) {
-            const src = findSourceWithKey(key);
-            return src?.[key];
-        },
-        has(_, key) {
-            return !!findSourceWithKey(key);
-        },
-        ownKeys() {
-            // eslint-disable-next-line svelte/prefer-svelte-reactivity
-            const all = new Set();
-            for (const s of sources) {
-                const obj = resolve(s);
-                if (obj) {
-                    for (const k of Reflect.ownKeys(obj)) {
-                        all.add(k);
-                    }
-                }
-            }
-            return [...all];
-        },
-        getOwnPropertyDescriptor(_, key) {
-            const src = findSourceWithKey(key);
-            if (!src)
-                return undefined;
-            return {
-                configurable: true,
-                enumerable: true,
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                value: src[key],
-                writable: true,
-            };
-        },
-    });
-}

package/dist/lib/components/ui/data-table/flex-render.svelte

@@ -1,40 +0,0 @@
-<script
-	lang="ts"
-	generics="TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>"
->
-	import type { CellContext, ColumnDefTemplate, HeaderContext } from "@tanstack/table-core";
-	import { RenderComponentConfig, RenderSnippetConfig } from "./render-helpers.js";
-	import type { Attachment } from "svelte/attachments";
-	type Props = {
-		/** The cell or header field of the current cell's column definition. */
-		content?: TContext extends HeaderContext<TData, TValue>
-			? ColumnDefTemplate<HeaderContext<TData, TValue>>
-			: TContext extends CellContext<TData, TValue>
-				? ColumnDefTemplate<CellContext<TData, TValue>>
-				: never;
-		/** The result of the `getContext()` function of the header or cell */
-		context: TContext;
-
-		/** Used to pass attachments that can't be gotten through context */
-		attach?: Attachment;
-	};
-
-	let { content, context, attach }: Props = $props();
-</script>
-
-{#if typeof content === "string"}
-	{content}
-{:else if content instanceof Function}
-	<!-- It's unlikely that a CellContext will be passed to a Header -->
-	<!-- eslint-disable-next-line @typescript-eslint/no-explicit-any -->
-	{@const result = content(context as any)}
-	{#if result instanceof RenderComponentConfig}
-		{@const { component: Component, props } = result}
-		<Component {...props} {attach} />
-	{:else if result instanceof RenderSnippetConfig}
-		{@const { snippet, params } = result}
-		{@render snippet({ ...params, attach })}
-	{:else}
-		{result}
-	{/if}
-{/if}

package/dist/lib/components/ui/data-table/flex-render.svelte.d.ts

@@ -1,33 +0,0 @@
-import type { CellContext, ColumnDefTemplate, HeaderContext } from "@tanstack/table-core";
-import type { Attachment } from "svelte/attachments";
-declare function $$render<TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>>(): {
-    props: {
-        /** The cell or header field of the current cell's column definition. */
-        content?: TContext extends HeaderContext<TData, TValue> ? ColumnDefTemplate<HeaderContext<TData, TValue>> : TContext extends CellContext<TData, TValue> ? ColumnDefTemplate<CellContext<TData, TValue>> : never;
-        /** The result of the `getContext()` function of the header or cell */
-        context: TContext;
-        /** Used to pass attachments that can't be gotten through context */
-        attach?: Attachment;
-    };
-    exports: {};
-    bindings: "";
-    slots: {};
-    events: {};
-};
-declare class __sveltets_Render<TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>> {
-    props(): ReturnType<typeof $$render<TData, TValue, TContext>>['props'];
-    events(): ReturnType<typeof $$render<TData, TValue, TContext>>['events'];
-    slots(): ReturnType<typeof $$render<TData, TValue, TContext>>['slots'];
-    bindings(): "";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TData, TValue, TContext>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TData, TValue, TContext>['props']>, ReturnType<__sveltets_Render<TData, TValue, TContext>['events']>, ReturnType<__sveltets_Render<TData, TValue, TContext>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<TData, TValue, TContext>['bindings']>;
-    } & ReturnType<__sveltets_Render<TData, TValue, TContext>['exports']>;
-    <TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>>(internal: unknown, props: ReturnType<__sveltets_Render<TData, TValue, TContext>['props']> & {}): ReturnType<__sveltets_Render<TData, TValue, TContext>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any, any, any>['bindings']>;
-}
-declare const FlexRender: $$IsomorphicComponent;
-type FlexRender<TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>> = InstanceType<typeof FlexRender<TData, TValue, TContext>>;
-export default FlexRender;

package/dist/lib/components/ui/data-table/index.d.ts

@@ -1,3 +0,0 @@
-export { default as FlexRender } from "./flex-render.svelte";
-export { renderComponent, renderSnippet } from "./render-helpers.js";
-export { createSvelteTable } from "./data-table.svelte.js";

package/dist/lib/components/ui/data-table/index.js

@@ -1,3 +0,0 @@
-export { default as FlexRender } from "./flex-render.svelte";
-export { renderComponent, renderSnippet } from "./render-helpers.js";
-export { createSvelteTable } from "./data-table.svelte.js";

package/dist/lib/components/ui/data-table/render-helpers.d.ts

@@ -1,90 +0,0 @@
-import type { Component, ComponentProps, Snippet } from "svelte";
-/**
- * A helper class to make it easy to identify Svelte components in
- * `columnDef.cell` and `columnDef.header` properties.
- *
- * > NOTE: This class should only be used internally by the adapter. If you're
- * reading this and you don't know what this is for, you probably don't need it.
- *
- * @example
- * ```svelte
- * {@const result = content(context as any)}
- * {#if result instanceof RenderComponentConfig}
- *   {@const { component: Component, props } = result}
- *   <Component {...props} />
- * {/if}
- * ```
- */
-export declare class RenderComponentConfig<TComponent extends Component> {
-    component: TComponent;
-    props: ComponentProps<TComponent> | Record<string, never>;
-    constructor(component: TComponent, props?: ComponentProps<TComponent> | Record<string, never>);
-}
-/**
- * A helper class to make it easy to identify Svelte Snippets in `columnDef.cell` and `columnDef.header` properties.
- *
- * > NOTE: This class should only be used internally by the adapter. If you're
- * reading this and you don't know what this is for, you probably don't need it.
- *
- * @example
- * ```svelte
- * {@const result = content(context as any)}
- * {#if result instanceof RenderSnippetConfig}
- *   {@const { snippet, params } = result}
- *   {@render snippet(params)}
- * {/if}
- * ```
- */
-export declare class RenderSnippetConfig<TProps> {
-    snippet: Snippet<[TProps]>;
-    params: TProps;
-    constructor(snippet: Snippet<[TProps]>, params: TProps);
-}
-/**
- * A helper function to help create cells from Svelte components through ColumnDef's `cell` and `header` properties.
- *
- * This is only to be used with Svelte Components - use `renderSnippet` for Svelte Snippets.
- *
- * @param component A Svelte component
- * @param props The props to pass to `component`
- * @returns A `RenderComponentConfig` object that helps svelte-table know how to render the header/cell component.
- * @example
- * ```ts
- * // +page.svelte
- * const defaultColumns = [
- *   columnHelper.accessor('name', {
- *     header: header => renderComponent(SortHeader, { label: 'Name', header }),
- *   }),
- *   columnHelper.accessor('state', {
- *     header: header => renderComponent(SortHeader, { label: 'State', header }),
- *   }),
- * ]
- * ```
- * @see {@link https://tanstack.com/table/latest/docs/guide/column-defs}
- */
-export declare function renderComponent<T extends Component<any>, Props extends ComponentProps<T>>(component: T, props?: Props): RenderComponentConfig<T>;
-/**
- * A helper function to help create cells from Svelte Snippets through ColumnDef's `cell` and `header` properties.
- *
- * The snippet must only take one parameter.
- *
- * This is only to be used with Snippets - use `renderComponent` for Svelte Components.
- *
- * @param snippet
- * @param params
- * @returns - A `RenderSnippetConfig` object that helps svelte-table know how to render the header/cell snippet.
- * @example
- * ```ts
- * // +page.svelte
- * const defaultColumns = [
- *   columnHelper.accessor('name', {
- *     cell: cell => renderSnippet(nameSnippet, { name: cell.row.name }),
- *   }),
- *   columnHelper.accessor('state', {
- *     cell: cell => renderSnippet(stateSnippet, { state: cell.row.state }),
- *   }),
- * ]
- * ```
- * @see {@link https://tanstack.com/table/latest/docs/guide/column-defs}
- */
-export declare function renderSnippet<TProps>(snippet: Snippet<[TProps]>, params?: TProps): RenderSnippetConfig<TProps>;

package/dist/lib/components/ui/data-table/render-helpers.js

@@ -1,99 +0,0 @@
-/**
- * A helper class to make it easy to identify Svelte components in
- * `columnDef.cell` and `columnDef.header` properties.
- *
- * > NOTE: This class should only be used internally by the adapter. If you're
- * reading this and you don't know what this is for, you probably don't need it.
- *
- * @example
- * ```svelte
- * {@const result = content(context as any)}
- * {#if result instanceof RenderComponentConfig}
- *   {@const { component: Component, props } = result}
- *   <Component {...props} />
- * {/if}
- * ```
- */
-export class RenderComponentConfig {
-    component;
-    props;
-    constructor(component, props = {}) {
-        this.component = component;
-        this.props = props;
-    }
-}
-/**
- * A helper class to make it easy to identify Svelte Snippets in `columnDef.cell` and `columnDef.header` properties.
- *
- * > NOTE: This class should only be used internally by the adapter. If you're
- * reading this and you don't know what this is for, you probably don't need it.
- *
- * @example
- * ```svelte
- * {@const result = content(context as any)}
- * {#if result instanceof RenderSnippetConfig}
- *   {@const { snippet, params } = result}
- *   {@render snippet(params)}
- * {/if}
- * ```
- */
-export class RenderSnippetConfig {
-    snippet;
-    params;
-    constructor(snippet, params) {
-        this.snippet = snippet;
-        this.params = params;
-    }
-}
-/**
- * A helper function to help create cells from Svelte components through ColumnDef's `cell` and `header` properties.
- *
- * This is only to be used with Svelte Components - use `renderSnippet` for Svelte Snippets.
- *
- * @param component A Svelte component
- * @param props The props to pass to `component`
- * @returns A `RenderComponentConfig` object that helps svelte-table know how to render the header/cell component.
- * @example
- * ```ts
- * // +page.svelte
- * const defaultColumns = [
- *   columnHelper.accessor('name', {
- *     header: header => renderComponent(SortHeader, { label: 'Name', header }),
- *   }),
- *   columnHelper.accessor('state', {
- *     header: header => renderComponent(SortHeader, { label: 'State', header }),
- *   }),
- * ]
- * ```
- * @see {@link https://tanstack.com/table/latest/docs/guide/column-defs}
- */
-export function renderComponent(component, props = {}) {
-    return new RenderComponentConfig(component, props);
-}
-/**
- * A helper function to help create cells from Svelte Snippets through ColumnDef's `cell` and `header` properties.
- *
- * The snippet must only take one parameter.
- *
- * This is only to be used with Snippets - use `renderComponent` for Svelte Components.
- *
- * @param snippet
- * @param params
- * @returns - A `RenderSnippetConfig` object that helps svelte-table know how to render the header/cell snippet.
- * @example
- * ```ts
- * // +page.svelte
- * const defaultColumns = [
- *   columnHelper.accessor('name', {
- *     cell: cell => renderSnippet(nameSnippet, { name: cell.row.name }),
- *   }),
- *   columnHelper.accessor('state', {
- *     cell: cell => renderSnippet(stateSnippet, { state: cell.row.state }),
- *   }),
- * ]
- * ```
- * @see {@link https://tanstack.com/table/latest/docs/guide/column-defs}
- */
-export function renderSnippet(snippet, params = {}) {
-    return new RenderSnippetConfig(snippet, params);
-}

package/src/lib/components/ui/data-table/data-table.svelte.d.ts

@@ -1,40 +0,0 @@
-import { type RowData, type TableOptions } from "@tanstack/table-core";
-/**
- * Creates a reactive TanStack table object for Svelte.
- * @param options Table options to create the table with.
- * @returns A reactive table object.
- * @example
- * ```svelte
- * <script>
- *   const table = createSvelteTable({ ... })
- * </script>
- *
- * <table>
- *   <thead>
- *     {#each table.getHeaderGroups() as headerGroup}
- *       <tr>
- *         {#each headerGroup.headers as header}
- *           <th colspan={header.colSpan}>
- *         	   <FlexRender content={header.column.columnDef.header} context={header.getContext()} />
- *         	 </th>
- *         {/each}
- *       </tr>
- *     {/each}
- *   </thead>
- * 	 <!-- ... -->
- * </table>
- * ```
- */
-export declare function createSvelteTable<TData extends RowData>(options: TableOptions<TData>): import("@tanstack/table-core").Table<TData>;
-type MaybeThunk<T extends object> = T | (() => T | null | undefined);
-type Intersection<T extends readonly unknown[]> = (T extends [infer H, ...infer R] ? H & Intersection<R> : unknown) & {};
-/**
- * Lazily merges several objects (or thunks) while preserving
- * getter semantics from every source.
- *
- * Proxy-based to avoid known WebKit recursion issue.
- */
-export declare function mergeObjects<Sources extends readonly MaybeThunk<any>[]>(...sources: Sources): Intersection<{
-    [K in keyof Sources]: Sources[K];
-}>;
-export {};

package/src/lib/components/ui/data-table/data-table.svelte.ts

@@ -1,142 +0,0 @@
-import {
-	type RowData,
-	type TableOptions,
-	type TableOptionsResolved,
-	type TableState,
-	createTable,
-} from "@tanstack/table-core";
-
-/**
- * Creates a reactive TanStack table object for Svelte.
- * @param options Table options to create the table with.
- * @returns A reactive table object.
- * @example
- * ```svelte
- * <script>
- *   const table = createSvelteTable({ ... })
- * </script>
- *
- * <table>
- *   <thead>
- *     {#each table.getHeaderGroups() as headerGroup}
- *       <tr>
- *         {#each headerGroup.headers as header}
- *           <th colspan={header.colSpan}>
- *         	   <FlexRender content={header.column.columnDef.header} context={header.getContext()} />
- *         	 </th>
- *         {/each}
- *       </tr>
- *     {/each}
- *   </thead>
- * 	 <!-- ... -->
- * </table>
- * ```
- */
-export function createSvelteTable<TData extends RowData>(options: TableOptions<TData>) {
-	const resolvedOptions: TableOptionsResolved<TData> = mergeObjects(
-		{
-			state: {},
-			onStateChange() {},
-			renderFallbackValue: null,
-			mergeOptions: (
-				defaultOptions: TableOptions<TData>,
-				options: Partial<TableOptions<TData>>
-			) => {
-				return mergeObjects(defaultOptions, options);
-			},
-		},
-		options
-	);
-
-	const table = createTable(resolvedOptions);
-	let state = $state<Partial<TableState>>(table.initialState);
-
-	function updateOptions() {
-		table.setOptions((prev) => {
-			return mergeObjects(prev, options, {
-				state: mergeObjects(state, options.state || {}),
-
-				// eslint-disable-next-line @typescript-eslint/no-explicit-any
-				onStateChange: (updater: any) => {
-					if (updater instanceof Function) state = updater(state);
-					else state = mergeObjects(state, updater);
-
-					options.onStateChange?.(updater);
-				},
-			});
-		});
-	}
-
-	updateOptions();
-
-	$effect.pre(() => {
-		updateOptions();
-	});
-
-	return table;
-}
-
-type MaybeThunk<T extends object> = T | (() => T | null | undefined);
-type Intersection<T extends readonly unknown[]> = (T extends [infer H, ...infer R]
-	? H & Intersection<R>
-	: unknown) & {};
-
-/**
- * Lazily merges several objects (or thunks) while preserving
- * getter semantics from every source.
- *
- * Proxy-based to avoid known WebKit recursion issue.
- */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function mergeObjects<Sources extends readonly MaybeThunk<any>[]>(
-	...sources: Sources
-): Intersection<{ [K in keyof Sources]: Sources[K] }> {
-	const resolve = <T extends object>(src: MaybeThunk<T>): T | undefined =>
-		typeof src === "function" ? (src() ?? undefined) : src;
-
-	const findSourceWithKey = (key: PropertyKey) => {
-		for (let i = sources.length - 1; i >= 0; i--) {
-			const obj = resolve(sources[i]);
-			if (obj && key in obj) return obj;
-		}
-		return undefined;
-	};
-
-	return new Proxy(Object.create(null), {
-		get(_, key) {
-			const src = findSourceWithKey(key);
-
-			return src?.[key as never];
-		},
-
-		has(_, key) {
-			return !!findSourceWithKey(key);
-		},
-
-		ownKeys(): (string | symbol)[] {
-			// eslint-disable-next-line svelte/prefer-svelte-reactivity
-			const all = new Set<string | symbol>();
-			for (const s of sources) {
-				const obj = resolve(s);
-				if (obj) {
-					for (const k of Reflect.ownKeys(obj) as (string | symbol)[]) {
-						all.add(k);
-					}
-				}
-			}
-			return [...all];
-		},
-
-		getOwnPropertyDescriptor(_, key) {
-			const src = findSourceWithKey(key);
-			if (!src) return undefined;
-			return {
-				configurable: true,
-				enumerable: true,
-				// eslint-disable-next-line @typescript-eslint/no-explicit-any
-				value: (src as any)[key],
-				writable: true,
-			};
-		},
-	}) as Intersection<{ [K in keyof Sources]: Sources[K] }>;
-}

package/src/lib/components/ui/data-table/flex-render.svelte

@@ -1,40 +0,0 @@
-<script
-	lang="ts"
-	generics="TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>"
->
-	import type { CellContext, ColumnDefTemplate, HeaderContext } from "@tanstack/table-core";
-	import { RenderComponentConfig, RenderSnippetConfig } from "./render-helpers.js";
-	import type { Attachment } from "svelte/attachments";
-	type Props = {
-		/** The cell or header field of the current cell's column definition. */
-		content?: TContext extends HeaderContext<TData, TValue>
-			? ColumnDefTemplate<HeaderContext<TData, TValue>>
-			: TContext extends CellContext<TData, TValue>
-				? ColumnDefTemplate<CellContext<TData, TValue>>
-				: never;
-		/** The result of the `getContext()` function of the header or cell */
-		context: TContext;
-
-		/** Used to pass attachments that can't be gotten through context */
-		attach?: Attachment;
-	};
-
-	let { content, context, attach }: Props = $props();
-</script>
-
-{#if typeof content === "string"}
-	{content}
-{:else if content instanceof Function}
-	<!-- It's unlikely that a CellContext will be passed to a Header -->
-	<!-- eslint-disable-next-line @typescript-eslint/no-explicit-any -->
-	{@const result = content(context as any)}
-	{#if result instanceof RenderComponentConfig}
-		{@const { component: Component, props } = result}
-		<Component {...props} {attach} />
-	{:else if result instanceof RenderSnippetConfig}
-		{@const { snippet, params } = result}
-		{@render snippet({ ...params, attach })}
-	{:else}
-		{result}
-	{/if}
-{/if}

package/src/lib/components/ui/data-table/index.ts

@@ -1,3 +0,0 @@
-export { default as FlexRender } from "./flex-render.svelte";
-export { renderComponent, renderSnippet } from "./render-helpers.js";
-export { createSvelteTable } from "./data-table.svelte.js";