@redneckz/wildless-cms-uni-blocks 0.14.269 → 0.14.271

package/bundle/bundle.umd.js

@@ -467,7 +467,16 @@
         }
     }
 
-    const dataAttributes = (data = {}) => Object.entries(data).reduce((res, [k, v]) => ({ ...res, [`data-${k.toLowerCase()}`]: v }), {});
+    const getAspectsAttributes = (data) => {
+        try {
+            return {
+                'data-aspects': JSON.stringify(data),
+            };
+        }
+        catch (_) {
+            return {};
+        }
+    };
 
     /** @deprecated */
     const ButtonInner = JSX((props) => {
@@ -524,7 +533,7 @@
         const buttonInner = children ?? jsx(ButtonInner, { ...adjustedProps });
         return disabled ? (jsx(DisabledButton, { ...adjustedProps, children: buttonInner })) : (jsx(RegularButton, { ...adjustedProps, children: buttonInner }));
     });
-    const RegularButton = JSX(({ className = '', href, rel, target, ariaLabel, version, rounded, onClick, type, data, children, }) => (jsx("a", { className: getRegularButtonClasses({ className, version, rounded }), href: href, rel: rel, target: target, "aria-label": ariaLabel, role: href ? 'link' : 'button', onClick: onClick, type: type, ...dataAttributes(data), children: children })));
+    const RegularButton = JSX(({ className = '', href, rel, target, ariaLabel, version, rounded, onClick, type, data, children, }) => (jsx("a", { className: getRegularButtonClasses({ className, version, rounded }), href: href, rel: rel, target: target, "aria-label": ariaLabel, role: href ? 'link' : 'button', onClick: onClick, type: type, ...getAspectsAttributes(data), children: children })));
     const DisabledButton = JSX(({ className, ariaLabel, version, rounded, children }) => (jsx("button", { type: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: -1, className: getDisabledButtonClasses({ className, rounded, version }), children: children })));
 
     function renderBackwardButton(version, handleClick, alwaysVisible = false) {
@@ -5892,7 +5901,7 @@
     };
 
     const QUERY_STORAGE_KEY = 'rshb-query-params';
-    function getSessionQuery() {
+    function saveSessionQuery() {
         const result = globalThis.location?.search || globalThis.sessionStorage?.getItem(QUERY_STORAGE_KEY) || '';
         if (result) {
             globalThis.sessionStorage?.setItem(QUERY_STORAGE_KEY, result);
@@ -5900,8 +5909,23 @@
         return result;
     }
 
+    const applyAspects = (aspects) => (ev) => {
+        const element = ev.target?.closest('[data-aspects]');
+        try {
+            const aspectsAttributes = JSON.parse(element?.dataset?.aspects ?? '[]');
+            for (const { aspectName, params } of aspectsAttributes) {
+                aspects[aspectName ?? '']?.(ev, params);
+            }
+        }
+        catch (_) {
+            // Do nothing
+        }
+        // legal aspect, use always
+        aspects.forwardQuery?.(ev);
+    };
+
     const adjustSessionQuery = (href) => {
-        const sessionQuery = getSessionQuery();
+        const sessionQuery = saveSessionQuery();
         if (!isURL(href) || !sessionQuery) {
             return href;
         }
@@ -5912,41 +5936,18 @@
         return url.toString();
     };
 
-    const useNavigateHandler = handlerDecorator(() => {
-        useEffect(() => {
-            getSessionQuery(); //? Call first time for save query in sessionStorage
-        }, []);
-        const loadBot = useChatBot(projectSettings.CHAT_BOT);
-        const reachGoalYM = (targetName) => {
-            const [ymID] = projectSettings.YANDEX_METRIKA_ID?.split(',').reverse() ?? [];
-            if ([ymID, targetName, globalThis.ym].every(Boolean)) {
-                globalThis.ym(ymID, 'reachGoal', targetName);
-            }
-        };
-        useEventListener(globalThis, 'click', navigationHandler({ loadBot, reachGoalYM }));
-    });
-    const navigationHandler = (methods) => (ev) => {
-        const element = getAnchorElement(ev.target);
-        for (const key in element?.dataset) {
-            getScenario(key)?.(element, methods);
-        }
-        if (isURL(element?.href) && !element?.href?.startsWith(globalThis.location?.origin)) {
+    const forwardQuery = (ev) => {
+        const anchor = ev.target?.closest('a');
+        if (isURL(anchor?.href) && !anchor?.href?.startsWith(globalThis.location?.origin)) {
             ev.preventDefault();
             ev.stopPropagation();
-            const url = adjustSessionQuery(element?.href) || element?.href;
+            const url = adjustSessionQuery(anchor?.href) || anchor?.href;
             if (url) {
-                const transition = getTransition(element?.target);
+                const transition = getTransition(anchor?.target);
                 transition?.(url);
             }
         }
     };
-    const getAnchorElement = (target) => {
-        let _target = target;
-        while (Boolean(_target) && _target.tagName !== 'A') {
-            _target = _target?.parentNode;
-        }
-        return _target;
-    };
     const getTransition = tableFunc([
         [(_) => _ === '_blank', (url) => globalThis.open(url, '_blank')],
         [(_) => _ === '_parent', (url) => globalThis.parent && (globalThis.parent.location.href = url)],
@@ -5958,10 +5959,24 @@
         ],
         [() => true, (url) => globalThis.location && (globalThis.location.href = url)],
     ]);
-    const getScenario = tableFunc([
-        [(_) => _ === 'ymtarget', (target, methods) => methods?.reachGoalYM(target?.dataset?.ymtarget)],
-        [(_) => _ === 'chatbot', (target, methods) => methods?.loadBot({ target })],
-    ]);
+
+    function useAspects() {
+        return useAspects._impl();
+    }
+    useAspects._impl = () => ({
+        forwardQuery,
+    });
+    useAspects.setup = (impl) => {
+        useAspects._impl = impl;
+    };
+
+    const useClickHandler = handlerDecorator(() => {
+        useEffect(() => {
+            saveSessionQuery(); //? Call first time for save query in sessionStorage
+        }, []);
+        const aspects = useAspects();
+        useEventListener(globalThis, 'click', applyAspects(aspects));
+    });
 
     const COOKIE_DIALOG_ID = 'cookie';
     const DIALOG_INITIAL_DELAY = 3 * 1000;
@@ -6091,7 +6106,7 @@
     const ContentPage = JSX(({ className, data = EMPTY_DATA, blocksRegistry, blockDecorator }) => {
         const { slots, blocks, fallback, ...pageContent } = data;
         const resolvedPageContent = useJSONRef(pageContent, fallback);
-        useNavigateHandler();
+        useClickHandler();
         const options = {
             key: '',
             page: { slots, blocks, fallback, ...resolvedPageContent },
@@ -6113,7 +6128,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.268";
+    const packageVersion = "0.14.270";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;