Refactor on default pt option

pull/3949/head
mertsincan 2023-05-10 12:49:54 +01:00
parent ff4d5786d6
commit 133f9e2e5a
3 changed files with 105 additions and 88 deletions

View File

@ -1,5 +1,6 @@
<script>
import { ObjectUtils } from 'primevue/utils';
import { mergeProps } from 'vue';
export default {
name: 'BaseComponent',
@ -10,17 +11,22 @@ export default {
}
},
methods: {
getPTItem(obj = {}, key = '') {
getOption(obj = {}, key = '') {
const fKey = ObjectUtils.convertToFlatCase(key);
return obj[Object.keys(obj).find((k) => ObjectUtils.convertToFlatCase(k) === fKey) || ''];
},
getPTValue(obj = {}, key = '', params = {}) {
const self = ObjectUtils.getItemValue(this.getPTItem(obj, key), params);
const globalComponentPT = this.getPTItem(this.$primevue.config.pt, this.$.type.name);
const global = ObjectUtils.getItemValue(this.getPTItem(globalComponentPT, key), params);
const self = ObjectUtils.getItemValue(this.getOption(obj, key), params);
const globalPT = ObjectUtils.getItemValue(this.getOption(this.defaultPT, key), params);
const merged = mergeProps(self, globalPT);
return { ...global, ...self };
return merged;
/*
* @todo: The 'class' option in self can always be more powerful to style the component easily.
*
* return self && self['class'] ? { ...merged, ...{ class: self['class'] } } : merged;
*/
},
ptm(key = '', params = {}) {
return this.getPTValue(this.pt, key, { props: this.$props, state: this.$data, ...params });
@ -28,6 +34,14 @@ export default {
ptmo(obj = {}, key = '', params = {}) {
return this.getPTValue(obj, key, params);
}
},
computed: {
defaultPT() {
return ObjectUtils.getItemValue(this.getOption(this.$primevue.config.pt, this.$.type.name), this.defaultsParams);
},
defaultsParams() {
return { instance: this.$ };
}
}
};
</script>

View File

@ -78,6 +78,7 @@ import { ToastPassThroughOptions } from '../toast';
import { ToolbarPassThroughOptions } from '../toolbar';
import { TreePassThroughOptions } from '../tree';
import { TreeSelectPassThroughOptions } from '../treeselect';
import { DefaultPTOptions } from '../ts-helpers';
import { VirtualScrollerPassThroughOptions } from '../virtualscroller';
interface PrimeVueConfiguration {
@ -97,88 +98,88 @@ interface PrimeVueZIndexOptions {
}
interface PrimeVuePTOptions {
accordion?: AccordionPassThroughOptions;
accordiontab?: AccordionTabPassThroughOptions;
autocomplete?: AutoCompletePassThroughOptions;
avatar?: AvatarPassThroughOptions;
badge?: BadgePassThroughOptions;
blockui?: BlockUIPassThroughOptions;
breadcrumb?: BreadcrumbPassThroughOptions;
button?: ButtonPassThroughOptions;
calendar?: CalendarPassThroughOptions;
card?: CardPassThroughOptions;
carousel?: CarouselPassThroughOptions;
cascadeselect?: CascadeSelectPassThroughOptions;
chart?: ChartPassThroughOptions;
checkbox?: CheckboxPassThroughOptions;
chip?: ChipPassThroughOptions;
chips?: ChipsPassThroughOptions;
colorpicker?: ColorPickerPassThroughOptions;
columngroup?: ColumnGroupPassThroughOptions;
confirmdialog?: ConfirmDialogPassThroughOptions;
confirmpopup?: ConfirmPopupPassThroughOptions;
contextmenu?: ContextMenuPassThroughOptions;
datatable?: DataTablePassThroughOptions;
dataview?: DataViewPassThroughOptions;
dataviewlayoutoptions?: DataViewLayoutOptionsPassThroughOptions;
deferredcontent?: DeferredContentPassThroughOptions;
divider?: DividerPassThroughOptions;
dialog?: DialogPassThroughOptions;
dock?: DockPassThroughOptions;
dropdown?: DropdownPassThroughOptions;
dynamicdialog?: DialogPassThroughOptions;
editor?: EditorPassThroughOptions;
fieldset?: FieldsetPassThroughOptions;
fileupload?: FileUploadPassThroughOptions;
galleria?: GalleriaPassThroughOptions;
image?: ImagePassThroughOptions;
inlinemessage?: InlineMessagePassThroughOptions;
inplace?: InplacePassThroughOptions;
inputmask?: InputMaskPassThroughOptions;
inputnumber?: InputNumberPassThroughOptions;
inputswitch?: InputSwitchPassThroughOptions;
inputtext?: InputTextPassThroughOptions;
knob?: KnobPassThroughOptions;
listbox?: ListboxPassThroughOptions;
megamenu?: MegaMenuPassThroughOptions;
menu?: MenuPassThroughOptions;
menubar?: MenubarPassThroughOptions;
message?: MessagePassThroughOptions;
multiselect?: MultiSelectPassThroughOptions;
orderlist?: OrderListPassThroughOptions;
organizationchart?: OrganizationChartPassThroughOptions;
overlaypanel?: OverlayPanelPassThroughOptions;
paginator?: PaginatorPassThroughOptions;
panel?: PanelPassThroughOptions;
panelmenu?: PanelMenuPassThroughOptions;
password?: PasswordPassThroughOptions;
picklist?: PickListPassThroughOptions;
progressbar?: ProgressBarPassThroughOptions;
progressspinner?: ProgressSpinnerPassThroughOptions;
radiobutton?: RadioButtonPassThroughOptions;
row?: RowPassThroughOptions;
scrollpanel?: ScrollPanelPassThroughOptions;
scrolltop?: ScrollTopPassThroughOptions;
sidebar?: SidebarPassThroughOptions;
skeleton?: SkeletonPassThroughOptions;
speeddial?: SpeedDialPassThroughOptions;
selectbutton?: SelectButtonPassThroughOptions;
splitbutton?: SplitButtonPassThroughOptions;
splitter?: SplitterPassThroughOptions;
steps?: PanelMenuPassThroughOptions;
tabmenu?: TabMenuPassThroughOptions;
tabpanel?: TabPanelPassThroughOptions;
tabview?: TabViewPassThroughOptions;
tag?: TagPassThroughOptions;
terminal?: TerminalPassThroughOptions;
textarea?: TextareaPassThroughOptions;
tieredmenu?: TieredMenuPassThroughOptions;
timeline?: TimelinePassThroughOptions;
toast?: ToastPassThroughOptions;
toolbar?: ToolbarPassThroughOptions;
tree?: TreePassThroughOptions;
treeselect?: TreeSelectPassThroughOptions;
virtualscroller?: VirtualScrollerPassThroughOptions;
accordion?: DefaultPTOptions<AccordionPassThroughOptions>;
accordiontab?: DefaultPTOptions<AccordionTabPassThroughOptions>;
autocomplete?: DefaultPTOptions<AutoCompletePassThroughOptions>;
avatar?: DefaultPTOptions<AvatarPassThroughOptions>;
badge?: DefaultPTOptions<BadgePassThroughOptions>;
blockui?: DefaultPTOptions<BlockUIPassThroughOptions>;
breadcrumb?: DefaultPTOptions<BreadcrumbPassThroughOptions>;
button?: DefaultPTOptions<ButtonPassThroughOptions>;
calendar?: DefaultPTOptions<CalendarPassThroughOptions>;
card?: DefaultPTOptions<CardPassThroughOptions>;
carousel?: DefaultPTOptions<CarouselPassThroughOptions>;
cascadeselect?: DefaultPTOptions<CascadeSelectPassThroughOptions>;
chart?: DefaultPTOptions<ChartPassThroughOptions>;
checkbox?: DefaultPTOptions<CheckboxPassThroughOptions>;
chip?: DefaultPTOptions<ChipPassThroughOptions>;
chips?: DefaultPTOptions<ChipsPassThroughOptions>;
colorpicker?: DefaultPTOptions<ColorPickerPassThroughOptions>;
columngroup?: DefaultPTOptions<ColumnGroupPassThroughOptions>;
confirmdialog?: DefaultPTOptions<ConfirmDialogPassThroughOptions>;
confirmpopup?: DefaultPTOptions<ConfirmPopupPassThroughOptions>;
contextmenu?: DefaultPTOptions<ContextMenuPassThroughOptions>;
datatable?: DefaultPTOptions<DataTablePassThroughOptions>;
dataview?: DefaultPTOptions<DataViewPassThroughOptions>;
dataviewlayoutoptions?: DefaultPTOptions<DataViewLayoutOptionsPassThroughOptions>;
deferredcontent?: DefaultPTOptions<DeferredContentPassThroughOptions>;
divider?: DefaultPTOptions<DividerPassThroughOptions>;
dialog?: DefaultPTOptions<DialogPassThroughOptions>;
dock?: DefaultPTOptions<DockPassThroughOptions>;
dropdown?: DefaultPTOptions<DropdownPassThroughOptions>;
dynamicdialog?: DefaultPTOptions<DialogPassThroughOptions>;
editor?: DefaultPTOptions<EditorPassThroughOptions>;
fieldset?: DefaultPTOptions<FieldsetPassThroughOptions>;
fileupload?: DefaultPTOptions<FileUploadPassThroughOptions>;
galleria?: DefaultPTOptions<GalleriaPassThroughOptions>;
image?: DefaultPTOptions<ImagePassThroughOptions>;
inlinemessage?: DefaultPTOptions<InlineMessagePassThroughOptions>;
inplace?: DefaultPTOptions<InplacePassThroughOptions>;
inputmask?: DefaultPTOptions<InputMaskPassThroughOptions>;
inputnumber?: DefaultPTOptions<InputNumberPassThroughOptions>;
inputswitch?: DefaultPTOptions<InputSwitchPassThroughOptions>;
inputtext?: DefaultPTOptions<InputTextPassThroughOptions>;
knob?: DefaultPTOptions<KnobPassThroughOptions>;
listbox?: DefaultPTOptions<ListboxPassThroughOptions>;
megamenu?: DefaultPTOptions<MegaMenuPassThroughOptions>;
menu?: DefaultPTOptions<MenuPassThroughOptions>;
menubar?: DefaultPTOptions<MenubarPassThroughOptions>;
message?: DefaultPTOptions<MessagePassThroughOptions>;
multiselect?: DefaultPTOptions<MultiSelectPassThroughOptions>;
orderlist?: DefaultPTOptions<OrderListPassThroughOptions>;
organizationchart?: DefaultPTOptions<OrganizationChartPassThroughOptions>;
overlaypanel?: DefaultPTOptions<OverlayPanelPassThroughOptions>;
paginator?: DefaultPTOptions<PaginatorPassThroughOptions>;
panel?: DefaultPTOptions<PanelPassThroughOptions>;
panelmenu?: DefaultPTOptions<PanelMenuPassThroughOptions>;
password?: DefaultPTOptions<PasswordPassThroughOptions>;
picklist?: DefaultPTOptions<PickListPassThroughOptions>;
progressbar?: DefaultPTOptions<ProgressBarPassThroughOptions>;
progressspinner?: DefaultPTOptions<ProgressSpinnerPassThroughOptions>;
radiobutton?: DefaultPTOptions<RadioButtonPassThroughOptions>;
row?: DefaultPTOptions<RowPassThroughOptions>;
scrollpanel?: DefaultPTOptions<ScrollPanelPassThroughOptions>;
scrolltop?: DefaultPTOptions<ScrollTopPassThroughOptions>;
sidebar?: DefaultPTOptions<SidebarPassThroughOptions>;
skeleton?: DefaultPTOptions<SkeletonPassThroughOptions>;
speeddial?: DefaultPTOptions<SpeedDialPassThroughOptions>;
selectbutton?: DefaultPTOptions<SelectButtonPassThroughOptions>;
splitbutton?: DefaultPTOptions<SplitButtonPassThroughOptions>;
splitter?: DefaultPTOptions<SplitterPassThroughOptions>;
steps?: DefaultPTOptions<PanelMenuPassThroughOptions>;
tabmenu?: DefaultPTOptions<TabMenuPassThroughOptions>;
tabpanel?: DefaultPTOptions<TabPanelPassThroughOptions>;
tabview?: DefaultPTOptions<TabViewPassThroughOptions>;
tag?: DefaultPTOptions<TagPassThroughOptions>;
terminal?: DefaultPTOptions<TerminalPassThroughOptions>;
textarea?: DefaultPTOptions<TextareaPassThroughOptions>;
tieredmenu?: DefaultPTOptions<TieredMenuPassThroughOptions>;
timeline?: DefaultPTOptions<TimelinePassThroughOptions>;
toast?: DefaultPTOptions<ToastPassThroughOptions>;
toolbar?: DefaultPTOptions<ToolbarPassThroughOptions>;
tree?: DefaultPTOptions<TreePassThroughOptions>;
treeselect?: DefaultPTOptions<TreeSelectPassThroughOptions>;
virtualscroller?: DefaultPTOptions<VirtualScrollerPassThroughOptions>;
}
interface PrimeVueLocaleAriaOptions {

View File

@ -1,4 +1,4 @@
import { AllowedComponentProps, ComponentCustomProps, ObjectEmitsOptions, VNodeProps } from 'vue';
import { AllowedComponentProps, ComponentCustomProps, ObjectEmitsOptions, VNode, VNodeProps } from 'vue';
declare type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps;
@ -32,3 +32,5 @@ export declare type Booleanish = boolean | 'true' | 'false';
export declare type Numberish = number | string;
export declare type Nullable<T = void> = T | null | undefined;
export declare type DefaultPTOptions<T = void> = T | ((instance?: VNode) => T | undefined) | undefined;