style: format files

components.json

@@ -1,17 +1,17 @@
 {
-	"$schema": "https://shadcn-svelte.com/schema.json",
-	"style": "default",
-	"tailwind": {
-		"config": "tailwind.config.ts",
-		"css": "src/app.css",
-		"baseColor": "gray"
-	},
-	"aliases": {
-		"components": "$lib/components",
-		"utils": "$lib/utils",
-		"ui": "$lib/components/ui",
-		"hooks": "$lib/hooks"
-	},
-	"typescript": true,
-	"registry": "https://next.shadcn-svelte.com/registry"
+  "$schema": "https://shadcn-svelte.com/schema.json",
+  "style": "default",
+  "tailwind": {
+    "config": "tailwind.config.ts",
+    "css": "src/app.css",
+    "baseColor": "gray"
+  },
+  "aliases": {
+    "components": "$lib/components",
+    "utils": "$lib/utils",
+    "ui": "$lib/components/ui",
+    "hooks": "$lib/hooks"
+  },
+  "typescript": true,
+  "registry": "https://next.shadcn-svelte.com/registry"
 }

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

@@ -1,10 +1,10 @@
 import {
-	type RowData,
-	type TableOptions,
-	type TableOptionsResolved,
-	type TableState,
-	createTable,
-} from "@tanstack/table-core";
+    type RowData,
+    type TableOptions,
+    type TableOptionsResolved,
+    type TableState,
+    createTable,
+} from "@tanstack/table-core"
 
 /**
  * Creates a reactive TanStack table object for Svelte.
@@ -32,81 +32,88 @@ import {
  * </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
-	);
+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);
+    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 || {}),
+    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);
+                // 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);
-				},
-			});
-		});
-	}
+                    options.onStateChange?.(updater)
+                },
+            })
+        })
+    }
 
-	updateOptions();
+    updateOptions()
 
-	$effect.pre(() => {
-		updateOptions();
-	});
+    $effect.pre(() => {
+        updateOptions()
+    })
 
-	return table;
+    return table
 }
 
 /**
  * Merges objects together while keeping their getters alive.
  * Taken from SolidJS: {@link https://github.com/solidjs/solid/blob/24abc825c0996fd2bc8c1de1491efe9a7e743aff/packages/solid/src/server/rendering.ts#L82-L115}
  */
-function mergeObjects<T>(source: T): T;
-function mergeObjects<T, U>(source: T, source1: U): T & U;
-function mergeObjects<T, U, V>(source: T, source1: U, source2: V): T & U & V;
-function mergeObjects<T, U, V, W>(source: T, source1: U, source2: V, source3: W): T & U & V & W;
+function mergeObjects<T>(source: T): T
+function mergeObjects<T, U>(source: T, source1: U): T & U
+function mergeObjects<T, U, V>(source: T, source1: U, source2: V): T & U & V
+function mergeObjects<T, U, V, W>(
+    source: T,
+    source1: U,
+    source2: V,
+    source3: W
+): T & U & V & W
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 function mergeObjects(...sources: any): any {
-	const target = {};
-	for (let i = 0; i < sources.length; i++) {
-		let source = sources[i];
-		if (typeof source === "function") source = source();
-		if (source) {
-			const descriptors = Object.getOwnPropertyDescriptors(source);
-			for (const key in descriptors) {
-				if (key in target) continue;
-				Object.defineProperty(target, key, {
-					enumerable: true,
-					get() {
-						for (let i = sources.length - 1; i >= 0; i--) {
-							let s = sources[i];
-							if (typeof s === "function") s = s();
-							const v = (s || {})[key];
-							if (v !== undefined) return v;
-						}
-					},
-				});
-			}
-		}
-	}
-	return target;
+    const target = {}
+    for (let i = 0; i < sources.length; i++) {
+        let source = sources[i]
+        if (typeof source === "function") source = source()
+        if (source) {
+            const descriptors = Object.getOwnPropertyDescriptors(source)
+            for (const key in descriptors) {
+                if (key in target) continue
+                Object.defineProperty(target, key, {
+                    enumerable: true,
+                    get() {
+                        for (let i = sources.length - 1; i >= 0; i--) {
+                            let s = sources[i]
+                            if (typeof s === "function") s = s()
+                            const v = (s || {})[key]
+                            if (v !== undefined) return v
+                        }
+                    },
+                })
+            }
+        }
+    }
+    return target
 }

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

@@ -1,43 +1,50 @@
 <script lang="ts" module>
-	import type { CellContext, ColumnDefTemplate, HeaderContext } from "@tanstack/table-core";
+    import type {
+        CellContext,
+        ColumnDefTemplate,
+        HeaderContext,
+    } from "@tanstack/table-core"
 
-	type TData = unknown;
-	type TValue = unknown;
-	type TContext = unknown;
+    type TData = unknown
+    type TValue = unknown
+    type TContext = unknown
 </script>
 
 <script
-	lang="ts"
-	generics="TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>"
+    lang="ts"
+    generics="TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>"
 >
-	import { RenderComponentConfig, RenderSnippetConfig } from "./render-helpers.js";
-	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;
-	};
+    import {
+        RenderComponentConfig,
+        RenderSnippetConfig,
+    } from "./render-helpers.js"
+    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
+    }
 
-	let { content, context }: Props = $props();
+    let { content, context }: Props = $props()
 </script>
 
 {#if typeof content === "string"}
-	{content}
+    {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} />
-	{:else if result instanceof RenderSnippetConfig}
-		{@const { snippet, params } = result}
-		{@render snippet(params)}
-	{:else}
-		{result}
-	{/if}
+    <!-- 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} />
+    {:else if result instanceof RenderSnippetConfig}
+        {@const { snippet, params } = result}
+        {@render snippet(params)}
+    {:else}
+        {result}
+    {/if}
 {/if}

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

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

src/lib/components/ui/data-table/render-helpers.ts

@@ -1,4 +1,4 @@
-import type { Component, ComponentProps, Snippet } from "svelte";
+import type { Component, ComponentProps, Snippet } from "svelte"
 
 /**
  * A helper class to make it easy to identify Svelte components in
@@ -17,15 +17,15 @@ import type { Component, ComponentProps, Snippet } from "svelte";
  * ```
  */
 export class RenderComponentConfig<TComponent extends Component> {
-	component: TComponent;
-	props: ComponentProps<TComponent> | Record<string, never>;
-	constructor(
-		component: TComponent,
-		props: ComponentProps<TComponent> | Record<string, never> = {}
-	) {
-		this.component = component;
-		this.props = props;
-	}
+    component: TComponent
+    props: ComponentProps<TComponent> | Record<string, never>
+    constructor(
+        component: TComponent,
+        props: ComponentProps<TComponent> | Record<string, never> = {}
+    ) {
+        this.component = component
+        this.props = props
+    }
 }
 
 /**
@@ -44,12 +44,12 @@ export class RenderComponentConfig<TComponent extends Component> {
  * ```
  */
 export class RenderSnippetConfig<TProps> {
-	snippet: Snippet<[TProps]>;
-	params: TProps;
-	constructor(snippet: Snippet<[TProps]>, params: TProps) {
-		this.snippet = snippet;
-		this.params = params;
-	}
+    snippet: Snippet<[TProps]>
+    params: TProps
+    constructor(snippet: Snippet<[TProps]>, params: TProps) {
+        this.snippet = snippet
+        this.params = params
+    }
 }
 
 /**
@@ -75,11 +75,11 @@ export class RenderSnippetConfig<TProps> {
  * @see {@link https://tanstack.com/table/latest/docs/guide/column-defs}
  */
 export function renderComponent<
-	// eslint-disable-next-line @typescript-eslint/no-explicit-any
-	T extends Component<any>,
-	Props extends ComponentProps<T>,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    T extends Component<any>,
+    Props extends ComponentProps<T>,
 >(component: T, props: Props) {
-	return new RenderComponentConfig(component, props);
+    return new RenderComponentConfig(component, props)
 }
 
 /**
@@ -106,6 +106,9 @@ export function renderComponent<
  * ```
  * @see {@link https://tanstack.com/table/latest/docs/guide/column-defs}
  */
-export function renderSnippet<TProps>(snippet: Snippet<[TProps]>, params: TProps) {
-	return new RenderSnippetConfig(snippet, params);
+export function renderSnippet<TProps>(
+    snippet: Snippet<[TProps]>,
+    params: TProps
+) {
+    return new RenderSnippetConfig(snippet, params)
 }