diff --git a/api-generator/components/columngroup.js b/api-generator/components/columngroup.js index 6fef6cdd8..cfd9b9605 100644 --- a/api-generator/components/columngroup.js +++ b/api-generator/components/columngroup.js @@ -1,7 +1,23 @@ +const ColumnGroupProps = [ + { + name: 'type', + type: 'string', + default: 'null', + description: 'Defines the type of the group.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Uses to pass attributes to DOM elements inside the component.' + } +]; + module.exports = { columngroup: { name: 'ColumnGroup', description: 'Columns can be grouped at header and footer sections by defining a ColumnGroup with nested rows and columns', - 'doc-url': 'datatable' + 'doc-url': 'datatable', + props: ColumnGroupProps } }; diff --git a/api-generator/components/row.js b/api-generator/components/row.js index 88fc8c91f..732575d73 100644 --- a/api-generator/components/row.js +++ b/api-generator/components/row.js @@ -1,7 +1,23 @@ +const RowProps = [ + { + name: 'type', + type: 'string', + default: 'null', + description: 'Defines the type of the group.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Uses to pass attributes to DOM elements inside the component.' + } +]; + module.exports = { row: { name: 'Row', description: 'DataTable can be grouped by defining a Row component with nested columns', - 'doc-url': 'datatable' + 'doc-url': 'datatable', + props: RowProps } }; diff --git a/components/lib/columngroup/ColumnGroup.d.ts b/components/lib/columngroup/ColumnGroup.d.ts index f605ffc2f..b74ba60f3 100755 --- a/components/lib/columngroup/ColumnGroup.d.ts +++ b/components/lib/columngroup/ColumnGroup.d.ts @@ -5,8 +5,37 @@ * [Live Demo](https://www.primevue.org/datatable/) * @module columngroup */ +import { DataTablePassThroughOptions } from '../datatable'; import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers'; +export declare type ColumnGroupPassThroughOptionType = ColumnGroupPassThroughAttributes | ((options: ColumnGroupPassThroughMethodOptions) => ColumnGroupPassThroughAttributes) | null | undefined; + +/** + * Custom passthrough(pt) option method. + */ +export interface ColumnGroupPassThroughMethodOptions { + props: ColumnGroupProps; + parent: DataTablePassThroughOptions; +} + +/** + * Custom passthrough(pt) options. + * @see {@link ColumnGroupProps.pt} + */ +export interface ColumnGroupPassThroughOptions { + /** + * Uses to pass attributes to the root's DOM element. + */ + root?: ColumnGroupPassThroughOptionType; +} + +/** + * Custom passthrough attributes for each DOM elements + */ +export interface ColumnGroupPassThroughAttributes { + [key: string]: any; +} + /** * Defines valid properties in ColumnGroup component. */ @@ -15,6 +44,11 @@ export interface ColumnGroupProps { * Type of column group */ type?: 'header' | 'footer' | undefined; + /** + * Uses to pass attributes to DOM elements inside the component. + * @type {ColumnGroupPassThroughOptions} + */ + pt?: ColumnGroupPassThroughOptions; } /** diff --git a/components/lib/columngroup/ColumnGroup.vue b/components/lib/columngroup/ColumnGroup.vue index 3a92bfc8b..2747ea869 100755 --- a/components/lib/columngroup/ColumnGroup.vue +++ b/components/lib/columngroup/ColumnGroup.vue @@ -1,6 +1,9 @@