@db-ux/v-core-components 4.5.4-mcp-e4cd7e6 → 4.5.4-table-c758ae7

package/README.md

@@ -49,6 +49,36 @@ import "@db-ux/core-components/build/styles/rollup.css";
 
 </details>
 
+> **Vite 8 Note:** Starting with Vite 8, the default CSS minifier was changed to [LightningCSS](https://lightningcss.dev/), which provides buggy transformations for modern CSS features used by the DB UX Design System (e.g. `light-dark()` CSS function). We might provide a specific configuration necessary to mitigate those problems in the near future. To keep CSS output stable in the meantime, configure `vite.config.ts` like this:
+
+```ts
+// vite.config.ts
+export default defineConfig({
+	build: {
+		cssMinify: "esbuild"
+	}
+});
+```
+
+> Alternatively, you could define a [browserslist](https://browsersl.ist/) based on your individual browser support strategy — which might be totally different from the list Vite 8 defines by default (targeting browsers from the early 2020s):
+
+```ts
+// Note: You need to install the required packages first:
+// npm install -D lightningcss browserslist
+
+// vite.config.ts
+import { browserslistToTargets } from "lightningcss";
+import browserslist from "browserslist";
+
+export default defineConfig({
+	css: {
+		lightningcss: {
+			targets: browserslistToTargets(browserslist(">= 0.5%, last 2 major versions, Firefox ESR, not dead"))
+		}
+	}
+});
+```
+
 > **Note:** The `@db-ux/core-components/build/styles/relative` file contains optional and all components styles. If you consider performance issues see [@db-ux/core-components](https://www.npmjs.com/package/@db-ux/core-components) for more information.
 
 ### DB Theme

package/dist/components/table/examples/data.d.ts

@@ -0,0 +1,9 @@
+import { DBTableData } from '../model';
+export declare const defaultTable: DBTableData;
+export declare const horizontalAlignmentStartTable: DBTableData;
+export declare const horizontalAlignmentCenterTable: DBTableData;
+export declare const horizontalAlignmentEndTable: DBTableData;
+export declare const subHeaderEmphasisNoneTable: DBTableData;
+export declare const subHeaderEmphasisWeakTable: DBTableData;
+export declare const subHeaderEmphasisStrongTable: DBTableData;
+export declare const overflowTable: DBTableData;

package/dist/components/table/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTable } from "./table.vue";

package/dist/components/table/model.d.ts

@@ -0,0 +1,74 @@
+import { GlobalProps, GlobalState, WidthProps } from '../../shared/model';
+import { DBTableRowDefaultProps } from '../table-row/model';
+export declare const DBTableRowSizeList: readonly ["x-small", "small", "medium", "large"];
+export type DBTableRowSizeType = (typeof DBTableRowSizeList)[number];
+export declare const DBTableVariantList: readonly ["joined", "zebra", "floating"];
+export type DBTableVariantType = (typeof DBTableVariantList)[number];
+export declare const DBTableDividerList: readonly ["none", "both", "horizontal", "vertical"];
+export type DBTableDividerType = (typeof DBTableDividerList)[number];
+export declare const DBTableMobileVariantList: readonly ["table", "list"];
+export type DBTableMobileVariantType = (typeof DBTableMobileVariantList)[number];
+export declare const DBTableStickHeaderList: readonly ["none", "both", "horizontal", "vertical"];
+export type DBTableStickHederType = (typeof DBTableStickHeaderList)[number];
+export type DBTableData = {
+    header?: DBTableRowDefaultProps[];
+    body?: DBTableRowDefaultProps[];
+    footer?: DBTableRowDefaultProps[];
+};
+export declare const DBTableColumnsSizeList: readonly ["auto", "1fr", "min-content", "max-content"];
+export type DBTableColumnsSizeType = (typeof DBTableColumnsSizeList)[number];
+export type DBTableDefaultProps = {
+    /**
+     * Slot for table caption
+     */
+    caption?: any;
+    /**
+     * String alternative for table caption slot
+     */
+    captionPlain?: string;
+    /**
+     * Table data if you don't use default slot/children
+     */
+    data?: DBTableData | string;
+    /**
+     * Show the divider between the rows and cells
+     */
+    divider?: DBTableDividerType;
+    /**
+     * Show caption above table default is hidden
+     */
+    showCaption?: boolean | string;
+    /**
+     * Size of the table rows
+     */
+    size?: DBTableRowSizeType;
+    /**
+     * Change the layout of the table
+     * floating: card style table
+     * joined: classic table
+     */
+    variant?: DBTableVariantType;
+    /**
+     * Change the layout of the table on mobile
+     * list: list style
+     * table: classic table
+     */
+    mobileVariant?: DBTableMobileVariantType;
+    /**
+     * Change the header cells to be sticky when scrolling the table
+     */
+    stickyHeader?: DBTableStickHederType;
+    /**
+     * Set the width of the columns based in their index.
+     * Alternative: Use `--db-table-column-size-$index` inside CSS to control it.
+     * See: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/grid-template-columns
+     */
+    columnSizes?: Record<number, DBTableColumnsSizeType | string>;
+};
+export type DBTableProps = DBTableDefaultProps & GlobalProps & WidthProps;
+export type DBTableDefaultState = {
+    _data?: DBTableData;
+    _style?: any;
+    convertData: () => DBTableData;
+};
+export type DBTableState = DBTableDefaultState & GlobalState;

package/dist/components/table/table.vue.d.ts

@@ -0,0 +1,30 @@
+import { DBTableData, DBTableProps } from "./model";
+declare var __VLS_1: {}, __VLS_18: {};
+type __VLS_Slots = {} & {
+    caption?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_18) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DBTableProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBTableProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+    data: DBTableData | string;
+    divider: import("./model").DBTableDividerType;
+    variant: import("./model").DBTableVariantType;
+    size: import("./model").DBTableRowSizeType;
+    width: import("../..").WidthType | string;
+    captionPlain: string;
+    showCaption: boolean | string;
+    mobileVariant: import("./model").DBTableMobileVariantType;
+    stickyHeader: import("./model").DBTableStickHederType;
+    columnSizes: Record<number, import("./model").DBTableColumnsSizeType | string>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table-body/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTableBody } from "./table-body.vue";

package/dist/components/table-body/model.d.ts

@@ -0,0 +1,8 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+import { DBTableRowProps } from '../table-row/model';
+export type DBTableBodyDefaultProps = {
+    rows?: DBTableRowProps[];
+};
+export type DBTableBodyProps = DBTableBodyDefaultProps & GlobalProps;
+export type DBTableBodyDefaultState = {};
+export type DBTableBodyState = DBTableBodyDefaultState & GlobalState;

package/dist/components/table-body/table-body.vue.d.ts

@@ -0,0 +1,20 @@
+import { DBTableRowProps } from "../table-row/model";
+import { DBTableBodyProps } from "./model";
+declare var __VLS_6: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_6) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DBTableBodyProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBTableBodyProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+    rows: DBTableRowProps[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table-caption/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTableCaption } from "./table-caption.vue";

package/dist/components/table-caption/model.d.ts

@@ -0,0 +1,5 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+export type DBTableCaptionDefaultProps = {};
+export type DBTableCaptionProps = DBTableCaptionDefaultProps & GlobalProps;
+export type DBTableCaptionDefaultState = {};
+export type DBTableCaptionState = DBTableCaptionDefaultState & GlobalState;

package/dist/components/table-caption/table-caption.vue.d.ts

@@ -0,0 +1,17 @@
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("../..").GlobalProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("../..").GlobalProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table-data-cell/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTableDataCell } from "./table-data-cell.vue";

package/dist/components/table-data-cell/model.d.ts

@@ -0,0 +1,5 @@
+import { DBTableCellProps, GlobalProps, GlobalState } from '../../shared/model';
+export type DBTableDataCellDefaultProps = {};
+export type DBTableDataCellProps = DBTableDataCellDefaultProps & GlobalProps & DBTableCellProps;
+export type DBTableDataCellDefaultState = {};
+export type DBTableDataCellState = DBTableDataCellDefaultState & GlobalState;

package/dist/components/table-data-cell/table-data-cell.vue.d.ts

@@ -0,0 +1,25 @@
+import { DBTableDataCellProps } from "./model";
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DBTableDataCellProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBTableDataCellProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+    colSpan: number | string;
+    colspan: number | string;
+    headers: string;
+    rowSpan: number | string;
+    rowspan: number | string;
+    horizontalAlignment: import("../..").AlignmentType;
+    verticalAlignment: import("../..").AlignmentType;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table-footer/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTableFooter } from "./table-footer.vue";

package/dist/components/table-footer/model.d.ts

@@ -0,0 +1,8 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+import { DBTableRowProps } from '../table-row/model';
+export type DBTableFooterDefaultProps = {
+    rows?: DBTableRowProps[];
+};
+export type DBTableFooterProps = DBTableFooterDefaultProps & GlobalProps;
+export type DBTableFooterDefaultState = {};
+export type DBTableFooterState = DBTableFooterDefaultState & GlobalState;

package/dist/components/table-footer/table-footer.vue.d.ts

@@ -0,0 +1,20 @@
+import { DBTableRowProps } from "../table-row/model";
+import { DBTableFooterProps } from "./model";
+declare var __VLS_6: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_6) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DBTableFooterProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBTableFooterProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+    rows: DBTableRowProps[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table-head/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTableHead } from "./table-head.vue";

package/dist/components/table-head/model.d.ts

@@ -0,0 +1,10 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+import { DBTableRowCell, DBTableRowProps } from '../table-row/model';
+export type DBTableHeadDefaultProps = {
+    rows?: DBTableRowProps[];
+};
+export type DBTableHeadProps = DBTableHeadDefaultProps & GlobalProps;
+export type DBTableHeadDefaultState = {
+    getCells: (cells?: DBTableRowCell[]) => DBTableRowCell[] | undefined;
+};
+export type DBTableHeadState = DBTableHeadDefaultState & GlobalState;

package/dist/components/table-head/table-head.vue.d.ts

@@ -0,0 +1,20 @@
+import { DBTableRowProps } from "../table-row/model";
+import { DBTableHeadProps } from "./model";
+declare var __VLS_6: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_6) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DBTableHeadProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBTableHeadProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+    rows: DBTableRowProps[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table-header-cell/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTableHeaderCell } from "./table-header-cell.vue";

package/dist/components/table-header-cell/model.d.ts

@@ -0,0 +1,24 @@
+import { DBTableCellProps, GlobalProps, GlobalState } from '../../shared/model';
+export declare const DBTableHeaderCellScopeList: readonly ["row", "col", "rowgroup", "colgroup"];
+export type DBTableHeaderCellScopeType = (typeof DBTableHeaderCellScopeList)[number];
+export type DBTableHeaderCellDefaultProps = {
+    /**
+     * The **`abbr`** property of the HTMLTableCellElement interface indicates an abbreviation associated with the cell.
+     *
+     * [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLTableCellElement/abbr)
+     */
+    abbr?: string;
+    /**
+     * The **`scope`** property of the HTMLTableCellElement interface indicates the scope of a th cell.
+     *
+     * [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLTableCellElement/scope)
+     */
+    scope?: DBTableHeaderCellScopeType;
+    /**
+     * Hide the text content of the cell.
+     */
+    noText?: boolean | string;
+};
+export type DBTableHeaderCellProps = DBTableHeaderCellDefaultProps & GlobalProps & DBTableCellProps;
+export type DBTableHeaderCellDefaultState = {};
+export type DBTableHeaderCellState = DBTableHeaderCellDefaultState & GlobalState;

package/dist/components/table-header-cell/table-header-cell.vue.d.ts

@@ -0,0 +1,28 @@
+import { DBTableHeaderCellProps } from "./model";
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DBTableHeaderCellProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBTableHeaderCellProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+    abbr: string;
+    noText: boolean | string;
+    colSpan: number | string;
+    colspan: number | string;
+    headers: string;
+    rowSpan: number | string;
+    rowspan: number | string;
+    horizontalAlignment: import("../..").AlignmentType;
+    verticalAlignment: import("../..").AlignmentType;
+    scope: import("./model").DBTableHeaderCellScopeType;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/table-row/index.d.ts

@@ -0,0 +1 @@
+export { default as DBTableRow } from "./table-row.vue";

package/dist/components/table-row/model.d.ts

@@ -0,0 +1,30 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+import { DBLinkProps } from '../link/model';
+import { DBTableDataCellProps } from '../table-data-cell/model';
+import { DBTableHeaderCellProps } from '../table-header-cell/model';
+export declare const DBTableRowSubHeaderEmphasisList: readonly ["none", "weak", "strong"];
+export type DBTableRowSubHeaderEmphasisType = (typeof DBTableRowSubHeaderEmphasisList)[number];
+export type DBTableRowCell = (DBTableHeaderCellProps | DBTableDataCellProps) & {
+    headerCell?: boolean;
+    content?: any;
+    link?: DBLinkProps;
+};
+export type DBTableRowDefaultProps = {
+    /**
+     * All cells of the row
+     */
+    cells?: DBTableRowCell[];
+    /**
+     * Change styling of row only if it is inside thead
+     */
+    subHeaderEmphasis?: DBTableRowSubHeaderEmphasisType;
+    /**
+     * If true marks the row as interactive, which checks for child with data-table-row-action="true"
+     */
+    interactive?: boolean | string;
+};
+export type DBTableRowProps = DBTableRowDefaultProps & GlobalProps;
+export type DBTableRowDefaultState = {
+    getHeaderCell: (cell: DBTableRowCell) => DBTableHeaderCellProps | undefined;
+};
+export type DBTableRowState = DBTableRowDefaultState & GlobalState;

package/dist/components/table-row/table-row.vue.d.ts

@@ -0,0 +1,21 @@
+import { DBTableRowCell, DBTableRowProps } from "./model";
+declare var __VLS_25: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_25) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DBTableRowProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBTableRowProps> & Readonly<{}>, {
+    id: string;
+    children: any;
+    className: string;
+    interactive: boolean | string;
+    cells: DBTableRowCell[];
+    subHeaderEmphasis: import("./model").DBTableRowSubHeaderEmphasisType;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};