@db-ux/v-core-components 4.10.1 → 4.11.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @db-ux/v-core-components
 
+## 4.11.0
+
+### Minor Changes
+
+- feat: add DBTable, DBTableHead, DBTableBody, DBTableFooter, DBTableRow, DBTableHeaderCell, and DBTableDataCell components - [see commit f64b6e0](https://github.com/db-ux-design-system/core-web/commit/f64b6e0f4b36ea4987c1d9ac7a0328bf317cdcad)
+
+### Patch Changes
+
+- fix: Add missing `propertyName` parameter to all `getBooleanAsString` calls across components for consistent string-based boolean parsing. - [see commit 6c11be5](https://github.com/db-ux-design-system/core-web/commit/6c11be54397c425607103f44b987b752efffb6d5)
+
+- fix: Remove unwanted whitespace characters from rendered output to prevent layout shifts - [see commit a0f23a4](https://github.com/db-ux-design-system/core-web/commit/a0f23a4a3e715414de3d045b59b88dc3ac28d5e7)
+
+## 4.10.2
+
+_version bump_
+
 ## 4.10.1
 
 ### Patch Changes

package/README.md

@@ -269,7 +269,7 @@ Contributions are very welcome, please refer to the [contribution guide](https:/
 ## Code of conduct
 
 We as members, contributors, and leaders pledge to make participation in our
-community a harassment-free experience for everyone – have a look at our [Contributor Covenant Code of Conduct](https://github.com/db-ux-design-system/core-web/blob/main/CODE-OF-CONDUCT.md).
+community a harassment-free experience for everyone – have a look at our [Contributor Covenant Code of Conduct](https://github.com/db-ux-design-system/.github/blob/main/CODE-OF-CONDUCT.md).
 
 ## License
 

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

@@ -0,0 +1,9 @@
+import type { 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 type { GlobalProps, GlobalState, WidthProps } from '../../shared/model';
+import type { 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 ["flat", "zebra", "spaced"];
+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 DBTableStickyHeaderList: readonly ["none", "both", "horizontal", "vertical"];
+export type DBTableStickyHeaderType = (typeof DBTableStickyHeaderList)[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
+     * spaced: card style table
+     * flat: 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?: DBTableStickyHeaderType;
+    /**
+     * 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").DBTableStickyHeaderType;
+    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 type { GlobalProps, GlobalState } from '../../shared/model';
+import type { 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 type { 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 type { 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 type { GlobalProps, GlobalState } from '../../shared/model';
+import type { 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 type { GlobalProps, GlobalState } from '../../shared/model';
+import type { 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 type { 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 type { GlobalProps, GlobalState } from '../../shared/model';
+import type { DBLinkProps } from '../link/model';
+import type { DBTableDataCellProps } from '../table-data-cell/model';
+import type { 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-trigger="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;
+    };
+};

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

@@ -40,9 +40,9 @@ declare const __VLS_export: import("vue").DefineComponent<DBTextareaProps, {}, {
     readOnly: boolean | string;
     readonly: boolean | string;
     fieldSizing: import("../../shared/model").FieldSizingType;
+    rows: number | string;
     cols: number | string;
     showResizer: boolean | string;
-    rows: number | string;
     spellCheck: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;