Divider pt updates

pull/3841/head
Bahadır Sofuoğlu 2023-03-28 15:30:44 +03:00
parent 917b09a67b
commit 49fc4462e4
3 changed files with 46 additions and 2 deletions

View File

@ -16,6 +16,12 @@ const DividerProps = [
type: 'string',
default: 'solid',
description: 'Border style type, default is "solid" and other options are "dashed" and "dotted".'
},
{
name: 'pt',
type: 'any',
default: 'null',
description: 'Uses to pass attributes to DOM elements inside the component.'
}
];

View File

@ -10,6 +10,37 @@
import { VNode } from 'vue';
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
export declare type DividerPassThroughOptionType = DividerPassThroughAttributes | ((options: DividerPassThroughMethodOptions) => DividerPassThroughAttributes) | null | undefined;
/**
* Custom passthrough(pt) option method.
*/
export interface DividerPassThroughMethodOptions {
props: DividerProps;
}
/**
* Custom passthrough(pt) options.
* @see {@link DividerProps.pt}
*/
export interface DividerPassThroughOptions {
/**
* Uses to pass attributes to the root's DOM element.
*/
root?: DividerPassThroughOptionType;
/**
* Uses to pass attributes to the content's DOM element.
*/
content?: DividerPassThroughOptionType;
}
/**
* Custom passthrough attributes for each DOM elements
*/
export interface DividerPassThroughAttributes {
[key: string]: any;
}
/**
* Defines valid properties in Divider component.
*/
@ -28,6 +59,11 @@ export interface DividerProps {
* @defaultValue solid
*/
type?: 'solid' | 'dashed' | 'dotted' | undefined;
/**
* Uses to pass attributes to DOM elements inside the component.
* @type {DividerPassThroughOptions}
*/
pt?: DividerPassThroughOptions;
}
/**

View File

@ -1,14 +1,16 @@
<template>
<div :class="containerClass" role="separator" :aria-orientation="layout">
<div v-if="$slots.default" class="p-divider-content">
<div :class="containerClass" role="separator" :aria-orientation="layout" v-bind="ptm('root')">
<div v-if="$slots.default" class="p-divider-content" v-bind="ptm('content')">
<slot></slot>
</div>
</div>
</template>
<script>
import ComponentBase from 'primevue/base';
export default {
name: 'Divider',
extends: ComponentBase,
props: {
align: {
type: String,