Refactor on default pt option

This commit is contained in:
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> <script>
import { ObjectUtils } from 'primevue/utils'; import { ObjectUtils } from 'primevue/utils';
import { mergeProps } from 'vue';
export default { export default {
name: 'BaseComponent', name: 'BaseComponent',
@ -10,17 +11,22 @@ export default {
} }
}, },
methods: { methods: {
getPTItem(obj = {}, key = '') { getOption(obj = {}, key = '') {
const fKey = ObjectUtils.convertToFlatCase(key); const fKey = ObjectUtils.convertToFlatCase(key);
return obj[Object.keys(obj).find((k) => ObjectUtils.convertToFlatCase(k) === fKey) || '']; return obj[Object.keys(obj).find((k) => ObjectUtils.convertToFlatCase(k) === fKey) || ''];
}, },
getPTValue(obj = {}, key = '', params = {}) { getPTValue(obj = {}, key = '', params = {}) {
const self = ObjectUtils.getItemValue(this.getPTItem(obj, key), params); const self = ObjectUtils.getItemValue(this.getOption(obj, key), params);
const globalComponentPT = this.getPTItem(this.$primevue.config.pt, this.$.type.name); const globalPT = ObjectUtils.getItemValue(this.getOption(this.defaultPT, key), params);
const global = ObjectUtils.getItemValue(this.getPTItem(globalComponentPT, 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 = {}) { ptm(key = '', params = {}) {
return this.getPTValue(this.pt, key, { props: this.$props, state: this.$data, ...params }); return this.getPTValue(this.pt, key, { props: this.$props, state: this.$data, ...params });
@ -28,6 +34,14 @@ export default {
ptmo(obj = {}, key = '', params = {}) { ptmo(obj = {}, key = '', params = {}) {
return this.getPTValue(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> </script>

View file

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