-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
24 changed files
with
798 additions
and
480 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,46 @@ | ||
| <script lang="ts" module> | ||
| import type { CellContext, ColumnDefTemplate, HeaderContext } from "@tanstack/table-core"; | ||
| type TData = unknown; | ||
| type TValue = unknown; | ||
| type TContext = unknown; | ||
| </script> | ||
|
|
||
| <script | ||
| 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; | ||
| }; | ||
| let { content, context }: 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} /> | ||
| {:else if result instanceof RenderSnippetConfig} | ||
| {@const { snippet, params } = result} | ||
| {@render snippet(params)} | ||
| {:else} | ||
| {result} | ||
| {/if} | ||
| {/if} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| export { default as FlexRender } from "./flex-render.svelte" | ||
| export { renderComponent, renderSnippet } from "./render-helpers.js" | ||
| export { createSvelteTable } from "./table.svelte.js" | ||
| export { createVirtualizer, createWindowVirtualizer } from "./virtual.svelte.js" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,111 @@ | ||
| 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 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 | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * 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<TProps> { | ||
| snippet: Snippet<[TProps]> | ||
| params: TProps | ||
| constructor(snippet: Snippet<[TProps]>, params: TProps) { | ||
| 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< | ||
| // 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) | ||
| } | ||
|
|
||
| /** | ||
| * 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<TProps>(snippet: Snippet<[TProps]>, params: TProps) { | ||
| return new RenderSnippetConfig(snippet, params) | ||
| } |
Oops, something went wrong.