Refactor #4103 - Update lifecycle names in Base* files

pull/4186/head
mertsincan 2023-07-10 10:34:48 +01:00
parent 2572561902
commit 63b5b8be8e
6 changed files with 71 additions and 33 deletions

View File

@ -1,12 +1,12 @@
export interface ComponentHooks {
beforeCreate?(): void;
created?(): void;
beforeMount?(): void;
mounted?(): void;
beforeUpdate?(): void;
updated?(): void;
beforeUnmount?(): void;
unmounted?(): void;
onBeforeCreate?(): void;
onCreated?(): void;
onBeforeMount?(): void;
onMounted?(): void;
onBeforeUpdate?(): void;
onUpdated?(): void;
onBeforeUnmount?(): void;
onUnmounted?(): void;
}
export interface BaseComponentPassThroughOptions {

View File

@ -400,30 +400,30 @@ export default {
}
},
beforeCreate() {
this.pt?.hooks?.['beforeCreate']?.();
this.$primevue?.config?.pt?.[this.$.type.name]?.hooks?.['beforeCreate']?.();
this.pt?.hooks?.['onBeforeCreate']?.();
this.$primevue?.config?.pt?.[this.$.type.name]?.hooks?.['onBeforeCreate']?.();
},
created() {
this._hook('created');
this._hook('onCreated');
},
beforeMount() {
loadBaseStyle();
this._hook('beforeMount');
this._hook('onBeforeMount');
},
mounted() {
this._hook('mounted');
this._hook('onMounted');
},
beforeUpdate() {
this._hook('beforeUpdate');
this._hook('onBeforeUpdate');
},
updated() {
this._hook('updated');
this._hook('onUpdated');
},
beforeUnmount() {
this._hook('beforeUnmount');
this._hook('onBeforeUnmount');
},
unmounted() {
this._hook('unmounted');
this._hook('onUnmounted');
},
methods: {
_hook(hookName) {
@ -437,12 +437,12 @@ export default {
return instance ? (this.$options.hostName ? (instance.$.type.name === this.$options.hostName ? instance : this._getHostInstance(instance.$parentInstance)) : instance.$parentInstance) : undefined;
},
_getOptionValue(options, key = '', params = {}) {
const fKeys = ObjectUtils.convertToFlatCase(key).split('.');
const fKeys = ObjectUtils.toFlatCase(key).split('.');
const fKey = fKeys.shift();
return fKey
? ObjectUtils.isObject(options)
? this._getOptionValue(ObjectUtils.getItemValue(options[Object.keys(options).find((k) => ObjectUtils.convertToFlatCase(k) === fKey) || ''], params), fKeys.join('.'), params)
? this._getOptionValue(ObjectUtils.getItemValue(options[Object.keys(options).find((k) => ObjectUtils.toFlatCase(k) === fKey) || ''], params), fKeys.join('.'), params)
: undefined
: ObjectUtils.getItemValue(options, params);
},
@ -451,8 +451,8 @@ export default {
const self = this._getOptionValue(obj, key, params);
const globalPT = searchInDefaultPT ? this._getOptionValue(this.defaultPT, key, params) : undefined;
const merged = mergeProps(self, globalPT, {
...(key === 'root' && { [`${datasetPrefix}name`]: ObjectUtils.convertToFlatCase(this.$.type.name) }),
[`${datasetPrefix}section`]: ObjectUtils.convertToFlatCase(key)
...(key === 'root' && { [`${datasetPrefix}name`]: ObjectUtils.toFlatCase(this.$.type.name) }),
[`${datasetPrefix}section`]: ObjectUtils.toFlatCase(key)
});
return merged;

View File

@ -1,6 +1,37 @@
import { ObjectDirective } from 'vue';
import { DirectiveBinding, VNode } from 'vue';
export interface DirectiveHooks extends Omit<ObjectDirective, 'getSSRProps' | 'deep'> {}
export interface DirectiveInstance<T = any, V = any> {
$name: string | undefined;
$host: T;
$binding: DirectiveBinding<V>;
$el: HTMLElement | undefined;
$css?: {
classes?: undefined;
inlineStyles?: undefined;
loadStyle?: () => void;
};
defaultPT: any;
isUnstyled: boolean;
[key: string]: any;
}
/* All parameters passed by the directive of Vue.js */
export interface DirectiveOptions<T = any, Prev = VNode<any, T> | null, V = any> {
el: T;
binding: DirectiveBinding<V>;
vnode: VNode<any, T>;
prevVNode: Prev;
}
export interface DirectiveHooks<T = any, V = any> {
onCreated?: (instance: DirectiveInstance<T, V> | undefined, options: DirectiveOptions<T, null, V>) => void;
onBeforeMount?: (instance: DirectiveInstance<T, V> | undefined, options: DirectiveOptions<T, null, V>) => void;
onMounted?: (instance: DirectiveInstance<T, V> | undefined, options: DirectiveOptions<T, null, V>) => void;
onBeforeUpdate?: (instance: DirectiveInstance<T, V> | undefined, options: DirectiveOptions<T, VNode<any, T>, V>) => void;
onUpdated?: (instance: DirectiveInstance<T, V> | undefined, options: DirectiveOptions<T, VNode<any, T>, V>) => void;
onBeforeUnmount?: (instance: DirectiveInstance<T, V> | undefined, options: DirectiveOptions<T, null, V>) => void;
onUnmounted?: (instance: DirectiveInstance<T, V> | undefined, options: DirectiveOptions<T, null, V>) => void;
}
export interface BaseDirectivePassThroughOptions {
hooks?: DirectiveHooks;

View File

@ -5,12 +5,12 @@ import { mergeProps } from 'vue';
const BaseDirective = {
_getMeta: (...args) => [ObjectUtils.isObject(args[0]) ? undefined : args[0], ObjectUtils.getItemValue(ObjectUtils.isObject(args[0]) ? args[0] : args[1])],
_getOptionValue: (options, key = '', params = {}) => {
const fKeys = ObjectUtils.convertToFlatCase(key).split('.');
const fKeys = ObjectUtils.toFlatCase(key).split('.');
const fKey = fKeys.shift();
return fKey
? ObjectUtils.isObject(options)
? BaseDirective._getOptionValue(ObjectUtils.getItemValue(options[Object.keys(options).find((k) => ObjectUtils.convertToFlatCase(k) === fKey) || ''], params), fKeys.join('.'), params)
? BaseDirective._getOptionValue(ObjectUtils.getItemValue(options[Object.keys(options).find((k) => ObjectUtils.toFlatCase(k) === fKey) || ''], params), fKeys.join('.'), params)
: undefined
: ObjectUtils.getItemValue(options, params);
},
@ -19,19 +19,21 @@ const BaseDirective = {
const self = BaseDirective._getOptionValue(obj, key, params);
const globalPT = searchInDefaultPT ? BaseDirective._getOptionValue(instance.defaultPT, key, params) : undefined;
const merged = mergeProps(self, globalPT, {
...(key === 'root' && { [`${datasetPrefix}name`]: ObjectUtils.convertToFlatCase(instance.$name) }),
[`${datasetPrefix}section`]: ObjectUtils.convertToFlatCase(key)
...(key === 'root' && { [`${datasetPrefix}name`]: ObjectUtils.toFlatCase(instance.$name) }),
[`${datasetPrefix}section`]: ObjectUtils.toFlatCase(key)
});
return merged;
},
_hook: (directiveName, hookName, el, binding, vnode, prevVnode) => {
const name = `on${ObjectUtils.toCapitalCase(hookName)}`;
const config = binding?.instance?.$primevue?.config;
const selfHook = binding?.value?.pt?.hooks?.[hookName];
const globalHook = config?.pt?.directives?.[directiveName]?.hooks?.[hookName];
const selfHook = binding?.value?.pt?.hooks?.[name];
const globalHook = config?.pt?.directives?.[directiveName]?.hooks?.[name];
const options = { el, binding, vnode, prevVnode };
selfHook?.(el, binding, vnode, prevVnode);
globalHook?.(el, binding, vnode, prevVnode);
selfHook?.(el?.$instance, options);
globalHook?.(el?.$instance, options);
},
_extend: (name, options = {}) => {
const handleHook = (hook, el, binding, vnode, prevVnode) => {

View File

@ -201,11 +201,15 @@ export default {
return null;
},
convertToFlatCase(str) {
toFlatCase(str) {
// convert snake, kebab, camel and pascal cases to flat case
return this.isNotEmpty(str) ? str.replace(/(-|_)/g, '').toLowerCase() : str;
},
toCapitalCase(str) {
return this.isNotEmpty(str) ? str[0].toUpperCase() + str.slice(1) : str;
},
isEmpty(value) {
return value === null || value === undefined || value === '' || (Array.isArray(value) && value.length === 0) || (!(value instanceof Date) && typeof value === 'object' && Object.keys(value).length === 0);
},

View File

@ -74,7 +74,8 @@ export declare class ObjectUtils {
static contains(value: any, list: any[]): boolean;
static insertIntoOrderedArray(item: any, index: number, arr: any[], sourceArr: any[]): void;
static removeAccents(str: any): string;
static convertToFlatCase(str: string): string;
static toFlatCase(str: string): string;
static toCapitalCase(str: string): string;
static isEmpty(value: any): boolean;
static isNotEmpty(value: any): boolean;
static isFunction(value: any): boolean;