mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 11:36:36 +00:00
refactor(types): use typed SvelteComponent interface for typing components
This commit is contained in:
parent
4226535338
commit
dab82d3479
156 changed files with 1379 additions and 1667 deletions
40
types/DataTable/DataTable.d.ts
vendored
40
types/DataTable/DataTable.d.ts
vendored
|
@ -1,4 +1,5 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export type DataTableKey = string;
|
||||
|
||||
|
@ -125,31 +126,22 @@ export interface DataTableProps {
|
|||
stickyHeader?: boolean;
|
||||
}
|
||||
|
||||
export default class DataTable {
|
||||
$$prop_def: DataTableProps;
|
||||
$$slot_def: {
|
||||
export default class DataTable extends SvelteComponent<
|
||||
DataTableProps,
|
||||
{
|
||||
click: CustomEvent<{ header?: DataTableHeader; row?: DataTableRow; cell?: DataTableCell }>;
|
||||
["click:header--expand"]: CustomEvent<{ expanded: boolean }>;
|
||||
["click:header"]: CustomEvent<{ header: DataTableHeader; sortDirection: "ascending" | "descending" | "none" }>;
|
||||
["click:row"]: CustomEvent<DataTableRow>;
|
||||
["mouseenter:row"]: CustomEvent<DataTableRow>;
|
||||
["mouseleave:row"]: CustomEvent<DataTableRow>;
|
||||
["click:row--expand"]: CustomEvent<{ expanded: boolean; row: DataTableRow }>;
|
||||
["click:cell"]: CustomEvent<DataTableCell>;
|
||||
},
|
||||
{
|
||||
default: {};
|
||||
cell: { row: DataTableRow; cell: DataTableCell };
|
||||
["cell-header"]: { header: DataTableNonEmptyHeader };
|
||||
["expanded-row"]: { row: DataTableRow };
|
||||
};
|
||||
|
||||
$on(
|
||||
eventname: "click",
|
||||
cb: (event: CustomEvent<{ header?: DataTableHeader; row?: DataTableRow; cell?: DataTableCell }>) => void
|
||||
): () => void;
|
||||
$on(eventname: "click:header--expand", cb: (event: CustomEvent<{ expanded: boolean }>) => void): () => void;
|
||||
$on(
|
||||
eventname: "click:header",
|
||||
cb: (event: CustomEvent<{ header: DataTableHeader; sortDirection: "ascending" | "descending" | "none" }>) => void
|
||||
): () => void;
|
||||
$on(eventname: "click:row", cb: (event: CustomEvent<DataTableRow>) => void): () => void;
|
||||
$on(eventname: "mouseenter:row", cb: (event: CustomEvent<DataTableRow>) => void): () => void;
|
||||
$on(eventname: "mouseleave:row", cb: (event: CustomEvent<DataTableRow>) => void): () => void;
|
||||
$on(
|
||||
eventname: "click:row--expand",
|
||||
cb: (event: CustomEvent<{ expanded: boolean; row: DataTableRow }>) => void
|
||||
): () => void;
|
||||
$on(eventname: "click:cell", cb: (event: CustomEvent<DataTableCell>) => void): () => void;
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
}
|
||||
> {}
|
||||
|
|
10
types/DataTable/Table.d.ts
vendored
10
types/DataTable/Table.d.ts
vendored
|
@ -1,4 +1,5 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface TableProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["section"]> {
|
||||
/**
|
||||
|
@ -37,11 +38,4 @@ export interface TableProps extends svelte.JSX.HTMLAttributes<HTMLElementTagName
|
|||
stickyHeader?: boolean;
|
||||
}
|
||||
|
||||
export default class Table {
|
||||
$$prop_def: TableProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class Table extends SvelteComponent<TableProps, {}, { default: {} }> {}
|
||||
|
|
10
types/DataTable/TableBody.d.ts
vendored
10
types/DataTable/TableBody.d.ts
vendored
|
@ -1,12 +1,6 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface TableBodyProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["tbody"]> {}
|
||||
|
||||
export default class TableBody {
|
||||
$$prop_def: TableBodyProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class TableBody extends SvelteComponent<TableBodyProps, {}, { default: {} }> {}
|
||||
|
|
23
types/DataTable/TableCell.d.ts
vendored
23
types/DataTable/TableCell.d.ts
vendored
|
@ -1,16 +1,15 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface TableCellProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["td"]> {}
|
||||
|
||||
export default class TableCell {
|
||||
$$prop_def: TableCellProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
|
||||
$on(eventname: "mouseover", cb: (event: WindowEventMap["mouseover"]) => void): () => void;
|
||||
$on(eventname: "mouseenter", cb: (event: WindowEventMap["mouseenter"]) => void): () => void;
|
||||
$on(eventname: "mouseleave", cb: (event: WindowEventMap["mouseleave"]) => void): () => void;
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class TableCell extends SvelteComponent<
|
||||
TableCellProps,
|
||||
{
|
||||
click: WindowEventMap["click"];
|
||||
mouseover: WindowEventMap["mouseover"];
|
||||
mouseenter: WindowEventMap["mouseenter"];
|
||||
mouseleave: WindowEventMap["mouseleave"];
|
||||
},
|
||||
{ default: {} }
|
||||
> {}
|
||||
|
|
10
types/DataTable/TableContainer.d.ts
vendored
10
types/DataTable/TableContainer.d.ts
vendored
|
@ -1,4 +1,5 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface TableContainerProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
|
||||
/**
|
||||
|
@ -20,11 +21,4 @@ export interface TableContainerProps extends svelte.JSX.HTMLAttributes<HTMLEleme
|
|||
stickyHeader?: boolean;
|
||||
}
|
||||
|
||||
export default class TableContainer {
|
||||
$$prop_def: TableContainerProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class TableContainer extends SvelteComponent<TableContainerProps, {}, { default: {} }> {}
|
||||
|
|
23
types/DataTable/TableHead.d.ts
vendored
23
types/DataTable/TableHead.d.ts
vendored
|
@ -1,16 +1,15 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface TableHeadProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["thead"]> {}
|
||||
|
||||
export default class TableHead {
|
||||
$$prop_def: TableHeadProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
|
||||
$on(eventname: "mouseover", cb: (event: WindowEventMap["mouseover"]) => void): () => void;
|
||||
$on(eventname: "mouseenter", cb: (event: WindowEventMap["mouseenter"]) => void): () => void;
|
||||
$on(eventname: "mouseleave", cb: (event: WindowEventMap["mouseleave"]) => void): () => void;
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class TableHead extends SvelteComponent<
|
||||
TableHeadProps,
|
||||
{
|
||||
click: WindowEventMap["click"];
|
||||
mouseover: WindowEventMap["mouseover"];
|
||||
mouseenter: WindowEventMap["mouseenter"];
|
||||
mouseleave: WindowEventMap["mouseleave"];
|
||||
},
|
||||
{ default: {} }
|
||||
> {}
|
||||
|
|
23
types/DataTable/TableHeader.d.ts
vendored
23
types/DataTable/TableHeader.d.ts
vendored
|
@ -1,4 +1,5 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface TableHeaderProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["th"]> {
|
||||
/**
|
||||
|
@ -20,15 +21,13 @@ export interface TableHeaderProps extends svelte.JSX.HTMLAttributes<HTMLElementT
|
|||
id?: string;
|
||||
}
|
||||
|
||||
export default class TableHeader {
|
||||
$$prop_def: TableHeaderProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: "mouseover", cb: (event: WindowEventMap["mouseover"]) => void): () => void;
|
||||
$on(eventname: "mouseenter", cb: (event: WindowEventMap["mouseenter"]) => void): () => void;
|
||||
$on(eventname: "mouseleave", cb: (event: WindowEventMap["mouseleave"]) => void): () => void;
|
||||
$on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class TableHeader extends SvelteComponent<
|
||||
TableHeaderProps,
|
||||
{
|
||||
mouseover: WindowEventMap["mouseover"];
|
||||
mouseenter: WindowEventMap["mouseenter"];
|
||||
mouseleave: WindowEventMap["mouseleave"];
|
||||
click: WindowEventMap["click"];
|
||||
},
|
||||
{ default: {} }
|
||||
> {}
|
||||
|
|
23
types/DataTable/TableRow.d.ts
vendored
23
types/DataTable/TableRow.d.ts
vendored
|
@ -1,16 +1,15 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface TableRowProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["tr"]> {}
|
||||
|
||||
export default class TableRow {
|
||||
$$prop_def: TableRowProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
|
||||
$on(eventname: "mouseover", cb: (event: WindowEventMap["mouseover"]) => void): () => void;
|
||||
$on(eventname: "mouseenter", cb: (event: WindowEventMap["mouseenter"]) => void): () => void;
|
||||
$on(eventname: "mouseleave", cb: (event: WindowEventMap["mouseleave"]) => void): () => void;
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class TableRow extends SvelteComponent<
|
||||
TableRowProps,
|
||||
{
|
||||
click: WindowEventMap["click"];
|
||||
mouseover: WindowEventMap["mouseover"];
|
||||
mouseenter: WindowEventMap["mouseenter"];
|
||||
mouseleave: WindowEventMap["mouseleave"];
|
||||
},
|
||||
{ default: {} }
|
||||
> {}
|
||||
|
|
10
types/DataTable/Toolbar.d.ts
vendored
10
types/DataTable/Toolbar.d.ts
vendored
|
@ -1,4 +1,5 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface ToolbarProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["section"]> {
|
||||
/**
|
||||
|
@ -8,11 +9,4 @@ export interface ToolbarProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNa
|
|||
size?: "sm" | "default";
|
||||
}
|
||||
|
||||
export default class Toolbar {
|
||||
$$prop_def: ToolbarProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class Toolbar extends SvelteComponent<ToolbarProps, {}, { default: {} }> {}
|
||||
|
|
10
types/DataTable/ToolbarBatchActions.d.ts
vendored
10
types/DataTable/ToolbarBatchActions.d.ts
vendored
|
@ -1,4 +1,5 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface ToolbarBatchActionsProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
|
||||
/**
|
||||
|
@ -8,11 +9,4 @@ export interface ToolbarBatchActionsProps extends svelte.JSX.HTMLAttributes<HTML
|
|||
formatTotalSelected?: (totalSelected: number) => string;
|
||||
}
|
||||
|
||||
export default class ToolbarBatchActions {
|
||||
$$prop_def: ToolbarBatchActionsProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class ToolbarBatchActions extends SvelteComponent<ToolbarBatchActionsProps, {}, { default: {} }> {}
|
||||
|
|
10
types/DataTable/ToolbarContent.d.ts
vendored
10
types/DataTable/ToolbarContent.d.ts
vendored
|
@ -1,12 +1,6 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface ToolbarContentProps {}
|
||||
|
||||
export default class ToolbarContent {
|
||||
$$prop_def: ToolbarContentProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class ToolbarContent extends SvelteComponent<ToolbarContentProps, {}, { default: {} }> {}
|
||||
|
|
10
types/DataTable/ToolbarMenu.d.ts
vendored
10
types/DataTable/ToolbarMenu.d.ts
vendored
|
@ -1,13 +1,7 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
import { OverflowMenuProps } from "../OverflowMenu/OverflowMenu";
|
||||
|
||||
export interface ToolbarMenuProps extends OverflowMenuProps {}
|
||||
|
||||
export default class ToolbarMenu {
|
||||
$$prop_def: ToolbarMenuProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class ToolbarMenu extends SvelteComponent<ToolbarMenuProps, {}, { default: {} }> {}
|
||||
|
|
16
types/DataTable/ToolbarMenuItem.d.ts
vendored
16
types/DataTable/ToolbarMenuItem.d.ts
vendored
|
@ -1,15 +1,11 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
import { OverflowMenuItemProps } from "../OverflowMenu/OverflowMenuItem";
|
||||
|
||||
export interface ToolbarMenuItemProps extends OverflowMenuItemProps {}
|
||||
|
||||
export default class ToolbarMenuItem {
|
||||
$$prop_def: ToolbarMenuItemProps;
|
||||
$$slot_def: {
|
||||
default: {};
|
||||
};
|
||||
|
||||
$on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
|
||||
$on(eventname: "keydown", cb: (event: WindowEventMap["keydown"]) => void): () => void;
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class ToolbarMenuItem extends SvelteComponent<
|
||||
ToolbarMenuItemProps,
|
||||
{ click: WindowEventMap["click"]; keydown: WindowEventMap["keydown"] },
|
||||
{ default: {} }
|
||||
> {}
|
||||
|
|
21
types/DataTable/ToolbarSearch.d.ts
vendored
21
types/DataTable/ToolbarSearch.d.ts
vendored
|
@ -1,4 +1,5 @@
|
|||
/// <reference types="svelte" />
|
||||
import { SvelteComponent } from "svelte";
|
||||
|
||||
export interface ToolbarSearchProps {
|
||||
/**
|
||||
|
@ -32,13 +33,13 @@ export interface ToolbarSearchProps {
|
|||
ref?: null | HTMLInputElement;
|
||||
}
|
||||
|
||||
export default class ToolbarSearch {
|
||||
$$prop_def: ToolbarSearchProps;
|
||||
$$slot_def: {};
|
||||
|
||||
$on(eventname: "change", cb: (event: WindowEventMap["change"]) => void): () => void;
|
||||
$on(eventname: "input", cb: (event: WindowEventMap["input"]) => void): () => void;
|
||||
$on(eventname: "focus", cb: (event: WindowEventMap["focus"]) => void): () => void;
|
||||
$on(eventname: "blur", cb: (event: WindowEventMap["blur"]) => void): () => void;
|
||||
$on(eventname: string, cb: (event: Event) => void): () => void;
|
||||
}
|
||||
export default class ToolbarSearch extends SvelteComponent<
|
||||
ToolbarSearchProps,
|
||||
{
|
||||
change: WindowEventMap["change"];
|
||||
input: WindowEventMap["input"];
|
||||
focus: WindowEventMap["focus"];
|
||||
blur: WindowEventMap["blur"];
|
||||
},
|
||||
{}
|
||||
> {}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue