@gem-sdk/core 2.0.0-dev.896 → 2.0.0

package/dist/cjs/hooks/animation/useAnimationConfig.js

@@ -1 +1,30 @@
-"use strict";var react=require("react"),useCurrentDevice=require("../use-current-device.js");const useAnimationConfig=e=>{let n=useCurrentDevice.useCurrentDevice(),t=react.useMemo(()=>e?.advanced?.animation?.[n],[n,e?.advanced?.animation]),r=react.useCallback(()=>{let{trigger:e,triggerConfig:n}=t,{animation:r,setting:i}=n[e];return{type:r,setting:i[r]}},[t]),i=t?.enabled;return{isEnabledAnimation:i,getAnimationConfig:r}};exports.useAnimationConfig=useAnimationConfig;
+'use strict';
+
+var react = require('react');
+var useCurrentDevice = require('../use-current-device.js');
+
+const useAnimationConfig = (props)=>{
+    const currentDevice = useCurrentDevice.useCurrentDevice();
+    const configByDevices = react.useMemo(()=>props?.advanced?.animation?.[currentDevice], [
+        currentDevice,
+        props?.advanced?.animation
+    ]);
+    const getAnimationConfig = react.useCallback(()=>{
+        const { trigger, triggerConfig } = configByDevices;
+        const { animation, setting } = triggerConfig[trigger];
+        return {
+            type: animation,
+            setting: setting[animation],
+            reverse: trigger === "hidden"
+        };
+    }, [
+        configByDevices
+    ]);
+    const isEnabledAnimation = configByDevices?.enabled;
+    return {
+        isEnabledAnimation,
+        getAnimationConfig
+    };
+};
+
+exports.useAnimationConfig = useAnimationConfig;

package/dist/cjs/hooks/animation/useAnimationPreview.js

@@ -1 +1,31 @@
-"use strict";var react=require("react");const useAnimationPreview=({props:e,playAnimation:i,cancelAnimation:r,setAnimationOnFinish:t,setToolbarActive:a})=>{let u=react.useCallback(u=>{let{uid:n,isCancel:s}=u.detail;if(e.uid===n){if(r(),s){a(!0);return}i(),a(!1),t(()=>{a(!0)})}},[e.uid,r,i,a,t]);return{previewAnimation:u}};exports.useAnimationPreview=useAnimationPreview;
+'use strict';
+
+var react = require('react');
+
+const useAnimationPreview = ({ props, playAnimation, cancelAnimation, setAnimationOnFinish, setToolbarActive })=>{
+    const previewAnimation = react.useCallback((e)=>{
+        const { uid, isCancel } = e.detail;
+        if (props.uid !== uid) return;
+        cancelAnimation();
+        if (isCancel) {
+            setToolbarActive(true);
+            return;
+        }
+        playAnimation();
+        setToolbarActive(false);
+        setAnimationOnFinish(()=>{
+            setToolbarActive(true);
+        });
+    }, [
+        props.uid,
+        cancelAnimation,
+        playAnimation,
+        setToolbarActive,
+        setAnimationOnFinish
+    ]);
+    return {
+        previewAnimation
+    };
+};
+
+exports.useAnimationPreview = useAnimationPreview;

package/dist/cjs/hooks/animation/useAnimationTarget.js

@@ -1 +1,122 @@
-"use strict";var react=require("react"),useAnimationConfig=require("./useAnimationConfig.js");const SPACING_ACTIVE_ATTRIBUTE="data-spacing-margin-bottom-active",TOOLBAR_ACTIVE_ATTRIBUTE="data-toolbar-active",OUTLINE_ACTIVE_ATTRIBUTE="data-outline-active",TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE="data-toolbar-add-active",useAnimationTarget=t=>{let{isEnabledAnimation:e}=useAnimationConfig.useAnimationConfig(t),r=t.tag,a=t.uid,o=react.useRef(null),T=react.useRef([]),u=t=>{if(T.current)for(let e of T.current)t?(e.toolbar?.setAttribute(TOOLBAR_ACTIVE_ATTRIBUTE,"true"),e.outline?.setAttribute(OUTLINE_ACTIVE_ATTRIBUTE,"true"),e.spacing?.setAttribute(SPACING_ACTIVE_ATTRIBUTE,"true"),e.addSectionTop?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true"),e.addSectionBottom?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true")):(e.toolbar?.removeAttribute(TOOLBAR_ACTIVE_ATTRIBUTE),e.outline?.removeAttribute(OUTLINE_ACTIVE_ATTRIBUTE),e.spacing?.removeAttribute(SPACING_ACTIVE_ATTRIBUTE),e.addSectionTop?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE),e.addSectionBottom?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE))},i=t=>{let e=t.querySelector("[data-toolbar-add-top]"),r=t.querySelector("[data-toolbar-add-bottom]"),a=Array.from(t.children),o=a.find(t=>null!==t.getAttribute("data-toolbar")),T=a.find(t=>null!==t.getAttribute("data-outline"));return{sectionToolbar:o,sectionOutline:T,sectionAddTop:e,sectionAddBottom:r}},n=react.useCallback(t=>t.reduce((t,e)=>{let a=null,o=null,T=e,u=e.querySelector("[data-toolbar][data-toolbar-active]"),n=e.querySelector("[data-outline][data-outline-active]"),A=e.querySelector("[data-spacing] [data-spacing-margin-bottom]");switch(r){case"Button":case"SubmitButton":case"ProductButton":case"DynamicCheckout":T=e.querySelector(".gp-button-base");break;case"ProductProperties":T=e.querySelector("input");break;case"Icon":T=e.firstElementChild;break;case"ProductTag":T=e?.children[0]?.children[0];break;case"Section":{T=e;let{sectionOutline:t,sectionToolbar:r,sectionAddTop:A,sectionAddBottom:c}=i(T);n=t,u=r,a=A,o=c;break}default:T=e}let c={target:T,toolbar:u,outline:n,spacing:A,addSectionTop:a,addSectionBottom:o};return t.push(c),t},[]),[r]),A=react.useCallback(()=>{if(!e)return;o.current||(o.current=document.querySelectorAll(`[data-uid="${a}"]`));let t=Array.from(o.current);if(!t.length)return;let r=n(t);T.current=r},[a,n,e]);return{targetObjects:T,setToolbarActive:u,initListOfTargets:A}};exports.useAnimationTarget=useAnimationTarget;
+'use strict';
+
+var react = require('react');
+var useAnimationConfig = require('./useAnimationConfig.js');
+
+const SPACING_ACTIVE_ATTRIBUTE = 'data-spacing-margin-bottom-active';
+const TOOLBAR_ACTIVE_ATTRIBUTE = 'data-toolbar-active';
+const OUTLINE_ACTIVE_ATTRIBUTE = 'data-outline-active';
+const TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE = 'data-toolbar-add-active';
+const useAnimationTarget = (props)=>{
+    const { isEnabledAnimation } = useAnimationConfig.useAnimationConfig(props);
+    const componentTag = props.tag;
+    const componentUid = props.uid;
+    const targets = react.useRef(null);
+    const targetObjects = react.useRef([]);
+    const setToolbarActive = (isActive)=>{
+        if (!targetObjects.current) return;
+        for (const item of targetObjects.current){
+            if (isActive) {
+                item.toolbar?.setAttribute(TOOLBAR_ACTIVE_ATTRIBUTE, 'true');
+                item.outline?.setAttribute(OUTLINE_ACTIVE_ATTRIBUTE, 'true');
+                item.spacing?.setAttribute(SPACING_ACTIVE_ATTRIBUTE, 'true');
+                item.addSectionTop?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE, 'true');
+                item.addSectionBottom?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE, 'true');
+            } else {
+                item.toolbar?.removeAttribute(TOOLBAR_ACTIVE_ATTRIBUTE);
+                item.outline?.removeAttribute(OUTLINE_ACTIVE_ATTRIBUTE);
+                item.spacing?.removeAttribute(SPACING_ACTIVE_ATTRIBUTE);
+                item.addSectionTop?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE);
+                item.addSectionBottom?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE);
+            }
+        }
+    };
+    const getSectionProperties = (target)=>{
+        const sectionAddTop = target.querySelector('[data-toolbar-add-top]');
+        const sectionAddBottom = target.querySelector('[data-toolbar-add-bottom]');
+        const sectionChild = Array.from(target.children);
+        const sectionToolbar = sectionChild.find((child)=>child.getAttribute('data-toolbar') !== null);
+        const sectionOutline = sectionChild.find((child)=>child.getAttribute('data-outline') !== null);
+        return {
+            sectionToolbar,
+            sectionOutline,
+            sectionAddTop,
+            sectionAddBottom
+        };
+    };
+    const getUpdatedTargetObjects = react.useCallback((targets)=>{
+        return targets.reduce((accumulator, $rootTarget)=>{
+            let addSectionTop = null;
+            let addSectionBottom = null;
+            let target = $rootTarget;
+            let toolbar = $rootTarget.querySelector('[data-toolbar][data-toolbar-active]');
+            let outline = $rootTarget.querySelector('[data-outline][data-outline-active]');
+            const spacing = $rootTarget.querySelector('[data-spacing] [data-spacing-margin-bottom]');
+            switch(componentTag){
+                case 'Button':
+                case 'SubmitButton':
+                case 'ProductButton':
+                case 'DynamicCheckout':
+                    target = $rootTarget.querySelector('.gp-button-base');
+                    break;
+                case 'ProductProperties':
+                    target = $rootTarget.querySelector('input');
+                    break;
+                case 'Icon':
+                    target = $rootTarget.firstElementChild;
+                    break;
+                case 'ProductTag':
+                    target = $rootTarget?.children[0]?.children[0];
+                    break;
+                case 'Section':
+                    {
+                        target = $rootTarget;
+                        const { sectionOutline, sectionToolbar, sectionAddTop, sectionAddBottom } = getSectionProperties(target);
+                        outline = sectionOutline;
+                        toolbar = sectionToolbar;
+                        addSectionTop = sectionAddTop;
+                        addSectionBottom = sectionAddBottom;
+                        break;
+                    }
+                default:
+                    target = $rootTarget;
+            }
+            const newTargetObject = {
+                target,
+                toolbar,
+                outline,
+                spacing,
+                addSectionTop,
+                addSectionBottom
+            };
+            accumulator.push(newTargetObject);
+            return accumulator;
+        }, []);
+    }, [
+        componentTag
+    ]);
+    const initListOfTargets = react.useCallback(()=>{
+        if (!isEnabledAnimation) return;
+        if (!targets.current) {
+            const $storefront = document.body.querySelector('#storefront');
+            if ($storefront) {
+                targets.current = $storefront.querySelectorAll(`[data-uid="${componentUid}"]`);
+            }
+        }
+        const targetsArray = Array.from(targets.current || []);
+        if (!targetsArray.length) return;
+        const updatedTargetObjects = getUpdatedTargetObjects(targetsArray);
+        targetObjects.current = updatedTargetObjects;
+    }, [
+        componentUid,
+        getUpdatedTargetObjects,
+        isEnabledAnimation
+    ]);
+    return {
+        targetObjects,
+        setToolbarActive,
+        initListOfTargets
+    };
+};
+
+exports.useAnimationTarget = useAnimationTarget;

package/dist/cjs/hooks/animation/useApplyAnimation.js

@@ -1 +1,89 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var react=require("react"),useAnimations=require("../useAnimations.js"),useAnimationTarget=require("./useAnimationTarget.js"),useAnimationConfig=require("./useAnimationConfig.js"),useAnimationActions=require("./useAnimationActions.js"),useAnimationPreview=require("./useAnimationPreview.js"),animations=require("../../types/animations.js");const useApplyAnimation=({props:e})=>{let{uid:i}=e,n=useAnimations.useAnimations(),{initListOfTargets:t,targetObjects:a,setToolbarActive:s}=useAnimationTarget.useAnimationTarget(e),{isEnabledAnimation:r,getAnimationConfig:o}=useAnimationConfig.useAnimationConfig(e),{setAnimation:u,cancelAnimation:m,playAnimation:A,setAnimationOnFinish:c}=useAnimationActions.useAnimationActions(),{previewAnimation:p}=useAnimationPreview.useAnimationPreview({props:e,playAnimation:A,cancelAnimation:m,setAnimationOnFinish:c,setToolbarActive:s}),v=react.useCallback(({target:e,setting:i,type:t})=>n[t](e,i),[n]),w=react.useCallback(()=>{let{type:e,setting:i}=o();if(!e||e===animations.AnimationType.None||!a.current.length){m();return}let n=a.current.map(n=>v({type:e,setting:i,target:n.target}));m(),u(n)},[o,a,m,u,v]);react.useEffect(()=>(r?(t(),w()):m(),()=>{m()}),[i,w,m,r,t]),react.useEffect(()=>(window.addEventListener("preview-animation",p),()=>{window.removeEventListener("preview-animation",p)}),[p]),react.useEffect(()=>(window.addEventListener("init-animation-target",t),()=>{window.removeEventListener("init-animation-target",t)}),[t])};exports.default=useApplyAnimation;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+var useAnimations = require('../useAnimations.js');
+var useAnimationTarget = require('./useAnimationTarget.js');
+var useAnimationConfig = require('./useAnimationConfig.js');
+var useAnimationActions = require('./useAnimationActions.js');
+var useAnimationPreview = require('./useAnimationPreview.js');
+require('../../types/custom.js');
+var animations = require('../../types/animations.js');
+
+const useApplyAnimation = ({ props })=>{
+    const currentProps = props;
+    const { uid: componentUid } = currentProps;
+    const animation = useAnimations.useAnimations();
+    const { initListOfTargets, targetObjects, setToolbarActive } = useAnimationTarget.useAnimationTarget(currentProps);
+    const { isEnabledAnimation, getAnimationConfig } = useAnimationConfig.useAnimationConfig(currentProps);
+    const { setAnimation, cancelAnimation, playAnimation, setAnimationOnFinish } = useAnimationActions.useAnimationActions();
+    const { previewAnimation } = useAnimationPreview.useAnimationPreview({
+        props: currentProps,
+        playAnimation,
+        cancelAnimation,
+        setAnimationOnFinish,
+        setToolbarActive
+    });
+    const generateAnimation = react.useCallback(({ target, setting, type, reverse })=>{
+        return animation[type](target, setting, reverse);
+    }, [
+        animation
+    ]);
+    const initListAnimations = react.useCallback(()=>{
+        const { type, setting, reverse } = getAnimationConfig();
+        if (!type || type === animations.AnimationType.None || !targetObjects.current.length) {
+            cancelAnimation();
+            return;
+        }
+        const listAnimations = targetObjects.current.map((item)=>generateAnimation({
+                type,
+                setting,
+                target: item.target,
+                reverse
+            }));
+        cancelAnimation();
+        setAnimation(listAnimations);
+    }, [
+        getAnimationConfig,
+        targetObjects,
+        cancelAnimation,
+        setAnimation,
+        generateAnimation
+    ]);
+    react.useEffect(()=>{
+        if (isEnabledAnimation) {
+            initListOfTargets();
+            initListAnimations();
+        } else {
+            cancelAnimation();
+        }
+        return ()=>{
+            cancelAnimation();
+        };
+    }, [
+        componentUid,
+        initListAnimations,
+        cancelAnimation,
+        isEnabledAnimation,
+        initListOfTargets
+    ]);
+    react.useEffect(()=>{
+        window.addEventListener('preview-animation', previewAnimation);
+        return ()=>{
+            window.removeEventListener('preview-animation', previewAnimation);
+        };
+    }, [
+        previewAnimation
+    ]);
+    react.useEffect(()=>{
+        window.addEventListener('init-animation-target', initListOfTargets);
+        return ()=>{
+            window.removeEventListener('init-animation-target', initListOfTargets);
+        };
+    }, [
+        initListOfTargets
+    ]);
+};
+
+exports.default = useApplyAnimation;

package/dist/cjs/hooks/articles/useArticlesQuery.js

@@ -1 +1,33 @@
-"use strict";const mock=[{baseID:"gid://shopify/OnlineStoreBlog/592066740457",id:592066740457,title:"Blog post might appear in a search engine listing",created_at:"2024-05-09T04:06:12-04:00",body_html:'<span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span>',blog_id:91970044137,author:"Dev Team",user_id:90371653865,published_at:"2024-05-09T04:06:12-04:00",updated_at:"2024-05-09T04:06:13-04:00",summary_html:"",template_suffix:"",handle:"blog-post-might-appear-in-a-search-engine-listing",tags:"vintage",admin_graphql_api_id:"gid://shopify/OnlineStoreArticle/592066740457",image:{created_at:"2024-05-09T04:06:12-04:00",alt:"",width:1073,height:719,src:"https://cdn.shopify.com/s/files/1/0692/6562/1225/articles/Screenshot_2.jpg?v=1715241973"}},{baseID:"gid://shopify/OnlineStoreBlog/592066707689",id:592066707689,title:"ar on your home page or blog.",created_at:"2024-05-09T04:05:26-04:00",body_html:'<span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span>',blog_id:91970044137,author:"Dev Team",user_id:90371653865,published_at:"2024-05-09T04:05:25-04:00",updated_at:"2024-05-09T05:35:29-04:00",summary_html:"",template_suffix:"",handle:"ar-on-your-home-page-or-blog",tags:"cotton, vintage",admin_graphql_api_id:"gid://shopify/OnlineStoreArticle/592066707689",image:{created_at:"2024-05-09T04:05:26-04:00",alt:"",width:1080,height:719,src:"https://cdn.shopify.com/s/files/1/0692/6562/1225/articles/Screenshot_1.jpg?v=1715241926"}},{baseID:"gid://shopify/OnlineStoreBlog/592066674921",id:592066674921,title:"Add a summary of the post.",created_at:"2024-05-09T04:04:44-04:00",body_html:'<span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span><span data-mce-fragment="1">Add a title and description to see how this Blog post might appear in a search engine listing</span>',blog_id:91970044137,author:"Dev Team",user_id:90371653865,published_at:"2024-05-09T04:04:44-04:00",updated_at:"2024-05-09T04:04:45-04:00",summary_html:"",template_suffix:"",handle:"add-a-summary-of-the-post",tags:"",admin_graphql_api_id:"gid://shopify/OnlineStoreArticle/592066674921",image:{created_at:"2024-05-09T04:04:44-04:00",alt:"",width:1086,height:718,src:"https://cdn.shopify.com/s/files/1/0692/6562/1225/articles/Screenshot_7.jpg?v=1715241885"}},{baseID:"gid://shopify/OnlineStoreBlog/592058777833",id:592058777833,title:"Article Page - May 7, 10:47:14",created_at:"2024-05-06T23:47:59-04:00",body_html:'<h2>\n<span>Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span>\n</h2>',blog_id:91970044137,author:"GemPages",user_id:null,published_at:"2024-05-06T23:47:59-04:00",updated_at:"2024-05-09T04:06:48-04:00",summary_html:"",template_suffix:"gp-template-512584275137135821",handle:"article-page-may-7-10-47-14",tags:"vintage",admin_graphql_api_id:"gid://shopify/OnlineStoreArticle/592058777833",image:{created_at:"2024-05-09T04:06:41-04:00",alt:"",width:578,height:585,src:"https://cdn.shopify.com/s/files/1/0692/6562/1225/articles/Screenshot_3.png?v=1715242002"}},{baseID:"gid://shopify/OnlineStoreBlog/592058679529",id:592058679529,title:"Blog about your latest products or deals",created_at:"2024-05-06T22:36:55-04:00",body_html:'<span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span><span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span>',blog_id:91970044137,author:"Dev Team",user_id:90371653865,published_at:"2024-05-06T22:36:54-04:00",updated_at:"2024-05-09T03:46:39-04:00",summary_html:'<span data-mce-fragment="1">Add a summary of the post to appear on your home page or blog.</span>',template_suffix:"gp-template-512584275137135821",handle:"blog-about-your-latest-products-or-deals",tags:"",admin_graphql_api_id:"gid://shopify/OnlineStoreArticle/592058679529",image:{created_at:"2024-05-06T22:36:55-04:00",alt:"",width:497,height:618,src:"https://cdn.shopify.com/s/files/1/0692/6562/1225/articles/Screenshot_3.jpg?v=1715049415"}}],useArticlesQuery=()=>mock,useBlogsQuery=()=>({blogs:{edges:[{node:{id:"511006979737518962",title:"News",baseID:"gid://shopify/OnlineStoreBlog/91970044137",tags:[],handle:"news",descriptionMeta:"",description:"",titleMeta:"",templateSuffix:"",platform:"SHOPIFY"}}]}});exports.useArticlesQuery=useArticlesQuery,exports.useBlogsQuery=useBlogsQuery;
+'use strict';
+
+var articles_generated = require('../../graphql/queries/articles.generated.js');
+var useFetchHandle = require('../useFetchHandle.js');
+var useSWR = require('swr');
+var blogs_generated = require('../../graphql/queries/blogs.generated.js');
+
+const useArticlesQuery = (variables, options)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    const fetchArticles = ()=>fetcher([
+            articles_generated.ArticlesDocument,
+            variables ?? {}
+        ]);
+    return useSWR(variables ? [
+        'query/articles',
+        variables
+    ] : null, fetchArticles, options);
+};
+const useBlogsQuery = (variables, options)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    //@ts-ignore
+    const fetchBlogs = ()=>fetcher([
+            blogs_generated.BlogsDocument,
+            variables ?? {}
+        ]);
+    return useSWR(variables ? [
+        'query/blogs',
+        variables
+    ] : null, fetchBlogs, options);
+};
+
+exports.useArticlesQuery = useArticlesQuery;
+exports.useBlogsQuery = useBlogsQuery;

package/dist/cjs/hooks/cart/use-add-to-cart.js

@@ -1 +1,20 @@
-"use strict";var adapterShopify=require("@gem-sdk/adapter-shopify"),useSWR=require("swr"),useSWRMutation=require("swr/mutation"),shop=require("../shop.js");const useAddToCart=e=>{let r=shop.useStoreFront(),{mutate:s}=useSWR.useSWRConfig();return useSWRMutation("add-to-cart",(e,{arg:s})=>adapterShopify.addToCartOperation(r)(s),{...e,onSuccess:(r,t,o)=>{s("cart",r,!1),e?.onSuccess?.(r,t,o)}})};exports.useAddToCart=useAddToCart;
+'use strict';
+
+var adapterShopify = require('@gem-sdk/adapter-shopify');
+var useSWR = require('swr');
+var useSWRMutation = require('swr/mutation');
+var shop = require('../shop.js');
+
+const useAddToCart = (options)=>{
+    const shop$1 = shop.useStoreFront();
+    const { mutate } = useSWR.useSWRConfig();
+    return useSWRMutation('add-to-cart', (_, { arg })=>adapterShopify.addToCartOperation(shop$1)(arg), {
+        ...options,
+        onSuccess: (result, key, config)=>{
+            mutate('cart', result, false);
+            options?.onSuccess?.(result, key, config);
+        }
+    });
+};
+
+exports.useAddToCart = useAddToCart;

package/dist/cjs/hooks/cart/use-cart-data.js

@@ -1 +1,28 @@
-"use strict";var adapterShopify=require("@gem-sdk/adapter-shopify"),useSWR=require("swr"),shop=require("../shop.js"),useCartId=require("../useCartId.js");const useCartData=e=>{let{cartId:r,clearCartId:a}=useCartId.default(),t=shop.useStoreFront();return useSWR(r?"cart":null,()=>adapterShopify.getCartOperation(t)({cartId:r}),{revalidateOnMount:!0,revalidateOnFocus:!0,keepPreviousData:!1,dedupingInterval:2e3,...e,onSuccess(r,t,s){r||a(),e?.onSuccess?.(r,t,s)}})};exports.useCartData=useCartData;
+'use strict';
+
+var adapterShopify = require('@gem-sdk/adapter-shopify');
+var useSWR = require('swr');
+var shop = require('../shop.js');
+var useCartId = require('../useCartId.js');
+
+const useCartData = (options)=>{
+    const { cartId, clearCartId } = useCartId.default();
+    const shop$1 = shop.useStoreFront();
+    return useSWR(cartId ? 'cart' : null, ()=>adapterShopify.getCartOperation(shop$1)({
+            cartId: cartId
+        }), {
+        revalidateOnMount: true,
+        revalidateOnFocus: true,
+        keepPreviousData: false,
+        dedupingInterval: 2000,
+        ...options,
+        onSuccess (data, key, config) {
+            if (!data) {
+                clearCartId();
+            }
+            options?.onSuccess?.(data, key, config);
+        }
+    });
+};
+
+exports.useCartData = useCartData;

package/dist/cjs/hooks/cart/use-cart-discount-codes-update.js

@@ -1 +1,20 @@
-"use strict";var adapterShopify=require("@gem-sdk/adapter-shopify"),useSWR=require("swr"),useSWRMutation=require("swr/mutation"),shop=require("../shop.js");const useCartDiscountCodesUpdate=e=>{let s=shop.useStoreFront(),{mutate:t}=useSWR.useSWRConfig();return useSWRMutation("cart-discount-codes-update",(e,{arg:t})=>adapterShopify.cartDiscountCodesUpdateOperation(s)(t),{...e,onSuccess:(s,o,r)=>{t("cart",s,!1),e?.onSuccess?.(s,o,r)}})};exports.useCartDiscountCodesUpdate=useCartDiscountCodesUpdate;
+'use strict';
+
+var adapterShopify = require('@gem-sdk/adapter-shopify');
+var useSWR = require('swr');
+var useSWRMutation = require('swr/mutation');
+var shop = require('../shop.js');
+
+const useCartDiscountCodesUpdate = (options)=>{
+    const shop$1 = shop.useStoreFront();
+    const { mutate } = useSWR.useSWRConfig();
+    return useSWRMutation('cart-discount-codes-update', (_, { arg })=>adapterShopify.cartDiscountCodesUpdateOperation(shop$1)(arg), {
+        ...options,
+        onSuccess: (result, key, config)=>{
+            mutate('cart', result, false);
+            options?.onSuccess?.(result, key, config);
+        }
+    });
+};
+
+exports.useCartDiscountCodesUpdate = useCartDiscountCodesUpdate;

package/dist/cjs/hooks/cart/use-cart-note-update.js

@@ -1 +1,20 @@
-"use strict";var adapterShopify=require("@gem-sdk/adapter-shopify"),useSWR=require("swr"),useSWRMutation=require("swr/mutation"),shop=require("../shop.js");const useCartNoteUpdate=e=>{let t=shop.useStoreFront(),{mutate:r}=useSWR.useSWRConfig();return useSWRMutation("cart-note-update",(e,{arg:r})=>adapterShopify.cartNoteUpdateOperation(t)(r),{...e,onSuccess:(t,s,a)=>{r("cart",t,!1),e?.onSuccess?.(t,s,a)}})};exports.useCartNoteUpdate=useCartNoteUpdate;
+'use strict';
+
+var adapterShopify = require('@gem-sdk/adapter-shopify');
+var useSWR = require('swr');
+var useSWRMutation = require('swr/mutation');
+var shop = require('../shop.js');
+
+const useCartNoteUpdate = (options)=>{
+    const shop$1 = shop.useStoreFront();
+    const { mutate } = useSWR.useSWRConfig();
+    return useSWRMutation('cart-note-update', (_, { arg })=>adapterShopify.cartNoteUpdateOperation(shop$1)(arg), {
+        ...options,
+        onSuccess: (result, key, config)=>{
+            mutate('cart', result, false);
+            options?.onSuccess?.(result, key, config);
+        }
+    });
+};
+
+exports.useCartNoteUpdate = useCartNoteUpdate;

package/dist/cjs/hooks/cart/use-create-cart.js

@@ -1 +1,22 @@
-"use strict";var adapterShopify=require("@gem-sdk/adapter-shopify"),useSWR=require("swr"),useSWRMutation=require("swr/mutation"),shop=require("../shop.js");const useCreateCart=e=>{let r=shop.useStoreFront(),{mutate:t}=useSWR.useSWRConfig();return useSWRMutation("create-cart",(e,{arg:t})=>adapterShopify.createCartOperation(r)(t),{...e,onSuccess:(r,s,a)=>{t("cart",r,!1),e?.onSuccess?.(r,s,a)}})};exports.useCreateCart=useCreateCart;
+'use strict';
+
+var adapterShopify = require('@gem-sdk/adapter-shopify');
+var useSWR = require('swr');
+var useSWRMutation = require('swr/mutation');
+var shop = require('../shop.js');
+
+const useCreateCart = (options)=>{
+    const shop$1 = shop.useStoreFront();
+    const { mutate } = useSWR.useSWRConfig();
+    return useSWRMutation('create-cart', (_, { arg })=>{
+        return adapterShopify.createCartOperation(shop$1)(arg);
+    }, {
+        ...options,
+        onSuccess: (result, key, config)=>{
+            mutate('cart', result, false);
+            options?.onSuccess?.(result, key, config);
+        }
+    });
+};
+
+exports.useCreateCart = useCreateCart;

package/dist/cjs/hooks/cart/use-remove-cart-item.js

@@ -1 +1,20 @@
-"use strict";var adapterShopify=require("@gem-sdk/adapter-shopify"),useSWR=require("swr"),useSWRMutation=require("swr/mutation"),shop=require("../shop.js");const useRemoveCartItem=e=>{let r=shop.useStoreFront(),{mutate:t}=useSWR.useSWRConfig();return useSWRMutation("remove-cart-item",(e,{arg:t})=>adapterShopify.removeCartItemOperation(r)(t),{...e,onSuccess:(r,s,o)=>{t("cart",r,!1),e?.onSuccess?.(r,s,o)}})};exports.useRemoveCartItem=useRemoveCartItem;
+'use strict';
+
+var adapterShopify = require('@gem-sdk/adapter-shopify');
+var useSWR = require('swr');
+var useSWRMutation = require('swr/mutation');
+var shop = require('../shop.js');
+
+const useRemoveCartItem = (options)=>{
+    const shop$1 = shop.useStoreFront();
+    const { mutate } = useSWR.useSWRConfig();
+    return useSWRMutation('remove-cart-item', (_, { arg })=>adapterShopify.removeCartItemOperation(shop$1)(arg), {
+        ...options,
+        onSuccess: (result, key, config)=>{
+            mutate('cart', result, false);
+            options?.onSuccess?.(result, key, config);
+        }
+    });
+};
+
+exports.useRemoveCartItem = useRemoveCartItem;

package/dist/cjs/hooks/cart/use-update-cart-item.js

@@ -1 +1,20 @@
-"use strict";var adapterShopify=require("@gem-sdk/adapter-shopify"),useSWR=require("swr"),useSWRMutation=require("swr/mutation"),shop=require("../shop.js");const useUpdateCartItem=e=>{let t=shop.useStoreFront(),{mutate:r}=useSWR.useSWRConfig();return useSWRMutation("update-cart-item",(e,{arg:r})=>adapterShopify.updateCartLineOperation(t)(r),{...e,onSuccess:(t,s,a)=>{r("cart",t,!1),e?.onSuccess?.(t,s,a)}})};exports.useUpdateCartItem=useUpdateCartItem;
+'use strict';
+
+var adapterShopify = require('@gem-sdk/adapter-shopify');
+var useSWR = require('swr');
+var useSWRMutation = require('swr/mutation');
+var shop = require('../shop.js');
+
+const useUpdateCartItem = (options)=>{
+    const shop$1 = shop.useStoreFront();
+    const { mutate } = useSWR.useSWRConfig();
+    return useSWRMutation('update-cart-item', (_, { arg })=>adapterShopify.updateCartLineOperation(shop$1)(arg), {
+        ...options,
+        onSuccess: (result, key, config)=>{
+            mutate('cart', result, false);
+            options?.onSuccess?.(result, key, config);
+        }
+    });
+};
+
+exports.useUpdateCartItem = useUpdateCartItem;

package/dist/cjs/hooks/shop/use-collection-query.js

@@ -1 +1,22 @@
-"use strict";var useSWR=require("swr"),getCollection=require("../../helpers/queries/get-collection.js"),shop=require("../shop.js"),useFetchHandle=require("../useFetchHandle.js"),query=require("../../helpers/query.js");const useCollectionQuery=(e,r)=>{let s=useFetchHandle.useFetchHandle(),u=shop.useIsSampleProduct(),t=shop.useIsStorefrontProduct();return useSWR(e?query.generateCollectionQueryKey({...e,isSample:u,isStorefront:t}):null,([,e])=>getCollection.getCollection(s,e),r)};exports.useCollectionQuery=useCollectionQuery;
+'use strict';
+
+var useSWR = require('swr');
+var getCollection = require('../../helpers/queries/get-collection.js');
+var shop = require('../shop.js');
+var useFetchHandle = require('../useFetchHandle.js');
+var query = require('../../helpers/query.js');
+
+const useCollectionQuery = (args, options)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    const isSample = shop.useIsSampleProduct();
+    const isStorefront = shop.useIsStorefrontProduct();
+    return useSWR(args ? query.generateCollectionQueryKey({
+        ...args,
+        isSample,
+        isStorefront
+    }) : null, ([, arg])=>{
+        return getCollection.getCollection(fetcher, arg);
+    }, options);
+};
+
+exports.useCollectionQuery = useCollectionQuery;

package/dist/cjs/hooks/shop/use-collections-query.js

@@ -1 +1,17 @@
-"use strict";var useSWR=require("swr"),getCollections=require("../../helpers/queries/get-collections.js"),useFetchHandle=require("../useFetchHandle.js");const useCollectionsQuery=(e,s)=>{let l=useFetchHandle.useFetchHandle();return useSWR(e?["query/collections",e]:null,async([,e])=>getCollections.getCollections(l,e),s)};exports.useCollectionsQuery=useCollectionsQuery;
+'use strict';
+
+var useSWR = require('swr');
+var getCollections = require('../../helpers/queries/get-collections.js');
+var useFetchHandle = require('../useFetchHandle.js');
+
+const useCollectionsQuery = (variable, options)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    return useSWR(variable ? [
+        'query/collections',
+        variable
+    ] : null, async ([, arg])=>{
+        return getCollections.getCollections(fetcher, arg);
+    }, options);
+};
+
+exports.useCollectionsQuery = useCollectionsQuery;

package/dist/cjs/hooks/shop/use-product-query.js

@@ -1 +1,22 @@
-"use strict";var useSWR=require("swr"),getProduct=require("../../helpers/queries/get-product.js"),shop=require("../shop.js"),useFetchHandle=require("../useFetchHandle.js"),query=require("../../helpers/query.js");const useProductQuery=(e,r,u)=>{let s=useFetchHandle.useFetchHandle(),t=shop.useIsSampleProduct(),o=shop.useIsStorefrontProduct();return useSWR(e?query.generateProductQueryKey({id:e,isSample:t,isStorefront:o}):null,async([,e])=>getProduct.getProduct(u||s,e),r)};exports.useProductQuery=useProductQuery;
+'use strict';
+
+var useSWR = require('swr');
+var getProduct = require('../../helpers/queries/get-product.js');
+var shop = require('../shop.js');
+var useFetchHandle = require('../useFetchHandle.js');
+var query = require('../../helpers/query.js');
+
+const useProductQuery = (productId, options, customFetcher)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    const isSample = shop.useIsSampleProduct();
+    const isStorefront = shop.useIsStorefrontProduct();
+    return useSWR(productId ? query.generateProductQueryKey({
+        id: productId,
+        isSample,
+        isStorefront
+    }) : null, async ([, arg])=>{
+        return getProduct.getProduct(customFetcher || fetcher, arg);
+    }, options);
+};
+
+exports.useProductQuery = useProductQuery;

package/dist/cjs/hooks/shop/use-products-query.js

@@ -1 +1,63 @@
-"use strict";var useSWR=require("swr"),getProducts=require("../../helpers/queries/get-products.js"),query=require("../../helpers/query.js"),shop=require("../shop.js"),useFetchHandle=require("../useFetchHandle.js");const useProductsQuery=(e,u,r)=>{let t=useFetchHandle.useFetchHandle(),s=shop.useIsSampleProduct(),c=shop.useIsStorefrontProduct();return useSWR(e?query.generateProductsQueryKey({ids:e,isSample:s,isStorefront:c,defaultSelectedProductCount:r?.defaultSelectedProductCount,allStatus:r?.allStatus}):null,async([,e])=>getProducts.getProducts(r?.fetcher||t,e),u)},useListProductQuery=(e,u)=>{let r=useFetchHandle.useFetchHandle();return useSWR(e?["query/products",e]:null,async([,e])=>getProducts.getListProductByVariables(r,e),u)},useProductsQueryAll=(e,u)=>{let r=useFetchHandle.useFetchHandle();return useSWR(e?["query/products",e]:null,async([,e])=>getProducts.getProductQueryAll(r,e),u)};exports.useListProductQuery=useListProductQuery,exports.useProductsQuery=useProductsQuery,exports.useProductsQueryAll=useProductsQueryAll;
+'use strict';
+
+var useSWR = require('swr');
+var useSWRInfinite = require('swr/infinite');
+var getProducts = require('../../helpers/queries/get-products.js');
+var query = require('../../helpers/query.js');
+var shop = require('../shop.js');
+var useFetchHandle = require('../useFetchHandle.js');
+
+const useProductsQuery = (ids, options, params)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    const isSample = shop.useIsSampleProduct();
+    const isStorefront = shop.useIsStorefrontProduct();
+    return useSWR(ids ? query.generateProductsQueryKey({
+        ids,
+        isSample,
+        isStorefront,
+        defaultSelectedProductCount: params?.defaultSelectedProductCount,
+        allStatus: params?.allStatus
+    }) : null, async ([, arg])=>{
+        return getProducts.getProducts(params?.fetcher || fetcher, arg);
+    }, options);
+};
+const getKey = (variable)=>{
+    return (pageIndex, previousPageData)=>{
+        if (!variable || previousPageData && !previousPageData.products?.pageInfo?.hasNextPage) {
+            return null;
+        }
+        if (pageIndex === 0) {
+            return [
+                'query/products',
+                variable
+            ];
+        }
+        return [
+            'query/products',
+            {
+                ...variable,
+                after: previousPageData.products?.pageInfo?.endCursor
+            }
+        ];
+    };
+};
+const useListProductQuery = (variable, options)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    const data = useSWRInfinite(getKey(variable), async ([, arg])=>{
+        return getProducts.getListProductByVariables(fetcher, arg);
+    }, options);
+    return data;
+};
+const useProductsQueryAll = (variable, options)=>{
+    const fetcher = useFetchHandle.useFetchHandle();
+    return useSWR(variable ? [
+        'query/products',
+        variable
+    ] : null, async ([, arg])=>{
+        return getProducts.getProductQueryAll(fetcher, arg);
+    }, options);
+};
+
+exports.useListProductQuery = useListProductQuery;
+exports.useProductsQuery = useProductsQuery;
+exports.useProductsQueryAll = useProductsQueryAll;