import { loadBaseStyle } from 'primevue/base';
import { ObjectUtils } from 'primevue/utils';
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 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)
                : undefined
            : ObjectUtils.getItemValue(options, params);
    },
    _getPTValue: (instance = {}, obj = {}, key = '', params = {}, searchInDefaultPT = true) => {
        const datasetPrefix = 'data-pc-';
        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)
        });

        return merged;
    },
    _hook: (directiveName, hookName, el, binding, vnode, prevVnode) => {
        const config = binding?.instance?.$primevue?.config;
        const globalHook = config?.pt?.directives?.[directiveName]?.hooks?.[hookName];
        const selfHook = binding?.value?.pt?.hooks?.[hookName];

        globalHook?.(el, binding, vnode, prevVnode);
        selfHook?.(el, binding, vnode, prevVnode);
    },
    _extend: (name, options = {}) => {
        const handleHook = (hook, el, binding, vnode, prevVnode) => {
            el.$instance = el.$instance || {};

            const config = binding?.instance?.$primevue?.config;
            const $instance = el.$instance[name] || {};
            const $options = ObjectUtils.isEmpty($instance) ? { ...options, ...options?.methods } : {};

            el.$instance[name] = {
                ...$instance,
                /* new instance variables to pass in directive methods */
                $name: name,
                $host: el,
                $binding: binding,
                $el: $instance['$el'] || undefined,
                $css: { classes: undefined, inlineStyles: undefined, loadStyle: () => {}, ...options?.css },
                /* computed instance variables */
                defaultPT: config?.pt?.directives?.[name],
                isUnstyled: config?.unstyled,
                /* instance's methods */
                ptm: (key = '', params = {}) => BaseDirective._getPTValue(el.$instance[name], el.$instance?.[name]?.$binding?.value?.pt, key, { ...params }),
                ptmo: (obj = {}, key = '', params = {}) => BaseDirective._getPTValue(el.$instance?.[name], obj, key, params, false),
                cx: (key = '', params = {}) => (!el.$instance?.[name]?.isUnstyled ? BaseDirective._getOptionValue(el.$instance?.[name]?.$css?.classes, key, { ...params }) : undefined),
                sx: (key = '', when = true, params = {}) => (when ? BaseDirective._getOptionValue(el.$instance?.[name]?.$css?.inlineStyles, key, { ...params }) : undefined),
                ...$options
            };

            $instance[hook]?.(el, binding, vnode, prevVnode); // handle hook in directive implementation
            BaseDirective._hook(name, hook, el, binding, vnode, prevVnode); // handle hooks during directive uses (global and self-definition)
        };

        return {
            created: (el, binding, vnode, prevVnode) => {
                handleHook('created', el, binding, vnode, prevVnode);
            },
            beforeMount: (el, binding, vnode, prevVnode) => {
                const instance = el.$instance[name];

                loadBaseStyle();
                !instance?.isUnstyled && instance?.$css?.loadStyle();
                handleHook('beforeMount', el, binding, vnode, prevVnode);
            },
            mounted: (el, binding, vnode, prevVnode) => {
                handleHook('mounted', el, binding, vnode, prevVnode);
            },
            beforeUpdate: (el, binding, vnode, prevVnode) => {
                handleHook('beforeUpdate', el, binding, vnode, prevVnode);
            },
            updated: (el, binding, vnode, prevVnode) => {
                handleHook('updated', el, binding, vnode, prevVnode);
            },
            beforeUnmount: (el, binding, vnode, prevVnode) => {
                handleHook('beforeUnmount', el, binding, vnode, prevVnode);
            },
            unmounted: (el, binding, vnode, prevVnode) => {
                handleHook('unmounted', el, binding, vnode, prevVnode);
            }
        };
    },
    extend: (...args) => {
        const [name, options] = BaseDirective._getMeta(...args);

        return {
            extend: (..._args) => {
                const [_name, _options] = BaseDirective._getMeta(..._args);

                return BaseDirective.extend(_name, { ...options, ...options?.methods, ..._options });
            },
            ...BaseDirective._extend(name, options)
        };
    }
};

export default BaseDirective;