svelte-ux
Version:
A large collection of Svelte components, actions, stores and utils to simplify creating highly interactive and visual applications. Built using Tailwind with extensibility and customization in mind.
130 lines (129 loc) • 5.6 kB
TypeScript
import { SvelteComponentTyped } from "svelte";
import { type ColumnDef, getCellValue, getCellHeader } from '@layerstack/svelte-table';
declare class __sveltets_Render<TData> {
props(): {
[x: string]: any;
columns?: ColumnDef<TData>[] | undefined;
data?: TData[] | null | undefined;
order?: {
onHeaderClick: (e: any) => void;
set(this: void, value: {
by: string;
direction: "desc" | "asc";
handler: any;
}): void;
update(this: void, updater: import("svelte/store").Updater<{
by: string;
direction: "desc" | "asc";
handler: any;
}>): void;
subscribe(this: void, run: import("svelte/store").Subscriber<{
by: string;
direction: "desc" | "asc";
handler: any;
}>, invalidate?: () => void): import("svelte/store").Unsubscriber;
} | undefined;
classes?: {
container?: string;
wrapper?: string;
table?: string;
thead?: string;
tbody?: string;
tr?: string;
th?: string;
td?: string;
} | undefined;
styles?: {
container?: string;
wrapper?: string;
table?: string;
thead?: string;
tbody?: string;
tr?: string;
th?: string;
td?: string;
} | undefined;
};
events(): {
headerClick: CustomEvent<{
column: ColumnDef<TData>;
}>;
cellClick: CustomEvent<{
column: ColumnDef<TData>;
rowData: TData;
}>;
} & {
[evt: string]: CustomEvent<any>;
};
slots(): {
headers: {
headers: {
classes: {
th: string;
td: string;
};
name: string;
header?: string;
value?: string | ((rowData: any, rowIndex?: number) => any) | undefined;
format?: import("@layerstack/utils").FormatType | ((value: any, rowData: any, rowIndex: number) => string) | undefined;
html?: boolean;
orderBy?: string | boolean | ((a: any, b: any) => number);
columns?: ColumnDef<any>[] | undefined;
align?: "left" | "right" | "center" | "justify";
sticky?: { [edge in import("@layerstack/svelte-actions").Edge]?: boolean; };
style?: {
th?: import("@layerstack/svelte-table/dist/types").ResolvePropType<any, string | {
[property: string]: string;
}>;
td?: import("@layerstack/svelte-table/dist/types").ResolvePropType<any, string | {
[property: string]: string;
}>;
} | undefined;
dataBackground?: Partial<import("@layerstack/svelte-actions").DataBackgroundOptions> | ((context: import("@layerstack/svelte-table/dist/types").ResolveContext<any>) => Partial<import("@layerstack/svelte-actions").DataBackgroundOptions>) | undefined;
colSpan?: number;
rowSpan?: number;
hidden?: boolean;
}[][];
getCellHeader: typeof getCellHeader;
};
default: {};
data: {
data: TData[] | null;
columns: {
classes: {
th: string;
td: string;
};
name: string;
header?: string;
value?: string | ((rowData: any, rowIndex?: number) => any) | undefined;
format?: import("@layerstack/utils").FormatType | ((value: any, rowData: any, rowIndex: number) => string) | undefined;
html?: boolean;
orderBy?: string | boolean | ((a: any, b: any) => number);
columns?: ColumnDef<any>[] | undefined;
align?: "left" | "right" | "center" | "justify";
sticky?: { [edge in import("@layerstack/svelte-actions").Edge]?: boolean; };
style?: {
th?: import("@layerstack/svelte-table/dist/types").ResolvePropType<any, string | {
[property: string]: string;
}>;
td?: import("@layerstack/svelte-table/dist/types").ResolvePropType<any, string | {
[property: string]: string;
}>;
} | undefined;
dataBackground?: Partial<import("@layerstack/svelte-actions").DataBackgroundOptions> | ((context: import("@layerstack/svelte-table/dist/types").ResolveContext<any>) => Partial<import("@layerstack/svelte-actions").DataBackgroundOptions>) | undefined;
colSpan?: number;
rowSpan?: number;
hidden?: boolean;
}[];
getCellValue: typeof getCellValue;
getCellContent: (column: ColumnDef<TData>, rowData: TData, rowIndex: number) => any;
};
};
}
export type TableProps<TData> = ReturnType<__sveltets_Render<TData>['props']>;
export type TableEvents<TData> = ReturnType<__sveltets_Render<TData>['events']>;
export type TableSlots<TData> = ReturnType<__sveltets_Render<TData>['slots']>;
export default class Table<TData> extends SvelteComponentTyped<TableProps<TData>, TableEvents<TData>, TableSlots<TData>> {
}
export {};