diff --git a/api-generator/components/confirmpopup.js b/api-generator/components/confirmpopup.js index 9cd5870d1..27b47f4a4 100644 --- a/api-generator/components/confirmpopup.js +++ b/api-generator/components/confirmpopup.js @@ -4,6 +4,12 @@ const ConfirmPopupProps = [ type: 'string', default: 'null', description: 'Optional key to match the key of the confirmation, useful to target a specific confirm dialog instance.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Uses to pass attributes to DOM elements inside the component.' } ]; diff --git a/components/lib/confirmpopup/ConfirmPopup.d.ts b/components/lib/confirmpopup/ConfirmPopup.d.ts index a6a6ca86c..002fbded5 100644 --- a/components/lib/confirmpopup/ConfirmPopup.d.ts +++ b/components/lib/confirmpopup/ConfirmPopup.d.ts @@ -11,6 +11,81 @@ import { VNode } from 'vue'; import { ConfirmationOptions } from '../confirmationoptions'; import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers'; +export declare type ConfirmPopupPassThroughOptionType = ConfirmPopupPassThroughAttributes | ((options: ConfirmPopupPassThroughMethodOptions) => ConfirmPopupPassThroughAttributes) | null | undefined; + +/** + * Custom passthrough(pt) option method. + */ +export interface ConfirmPopupPassThroughMethodOptions { + props: ConfirmPopupProps; + state: ConfirmPopupState; +} + +/** + * Custom passthrough(pt) options. + * @see {@link ConfirmPopupProps.pt} + */ +export interface ConfirmPopupPassThroughOptions { + /** + * Uses to pass attributes to the root's DOM element. + */ + root?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the content's DOM element. + */ + content?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the icon's DOM element. + */ + icon?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the message's DOM element. + */ + message?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the footer's DOM element. + */ + footer?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the reject button's DOM element. + */ + rejectButton?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the reject icon's DOM element. + */ + rejectIcon?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the accept button's DOM element. + */ + acceptButton?: ConfirmPopupPassThroughOptionType; + /** + * Uses to pass attributes to the accept icon's DOM element. + */ + acceptIcon?: ConfirmPopupPassThroughOptionType; +} + +/** + * Custom passthrough attributes for each DOM elements + */ +export interface ConfirmPopupPassThroughAttributes { + [key: string]: any; +} + +/** + * Defines current inline state in ConfirmPopup component. + */ +export interface ConfirmPopupState { + /** + * Current visible state as a boolean. + * @defaultValue false + */ + visible: boolean; + /** + * Current confirmation message. + */ + confirmation: ConfirmationOptions; +} + /** * Defines valid properties in ConfirmPopup component. */ @@ -19,6 +94,11 @@ export interface ConfirmPopupProps { * Optional key to match the key of the confirmation, useful to target a specific confirm dialog instance. */ group?: string; + /** + * Uses to pass attributes to DOM elements inside the component. + * @type {ConfirmPopupPassThroughOptions} + */ + pt?: ConfirmPopupPassThroughOptions; } /** diff --git a/components/lib/confirmpopup/ConfirmPopup.vue b/components/lib/confirmpopup/ConfirmPopup.vue index 4ecf001e2..81f1e0d3b 100644 --- a/components/lib/confirmpopup/ConfirmPopup.vue +++ b/components/lib/confirmpopup/ConfirmPopup.vue @@ -1,29 +1,29 @@