@gem-sdk/core 1.41.0-dev.20 → 1.41.0-dev.26

package/dist/esm/components/ai-generator/hooks/useListenEventGenerate.js

@@ -0,0 +1,61 @@
+import { useState, useCallback, useEffect } from 'react';
+
+const useListenEventGenerate = (componentInfo)=>{
+    const { uid: componentUid, tag: componentTag } = componentInfo;
+    const [isGenerating, setIsGenerating] = useState(false);
+    const onGenerate = (body)=>{
+        const eventCreate = new CustomEvent('editor:toolbar:ai-generate-content', {
+            bubbles: true,
+            detail: {
+                componentUid: componentUid,
+                componentTag: componentTag,
+                genRequest: body
+            }
+        });
+        window.dispatchEvent(eventCreate);
+        setIsGenerating(true);
+        onNotifyStatus('loading');
+    };
+    const onNotifyStatus = (status)=>{
+        const eventNotifyStatus = new CustomEvent('editor:ai-generate-content-status', {
+            bubbles: true,
+            detail: {
+                status: status,
+                generatingUid: componentUid
+            }
+        });
+        window.dispatchEvent(eventNotifyStatus);
+    };
+    const onGenerateContentStatus = useCallback((e)=>{
+        const detail = e.detail;
+        if (detail?.generatingUid === componentUid && detail.status === 'success') {
+            setIsGenerating(false);
+        }
+    }, [
+        componentUid
+    ]);
+    const onOpenProductElementSettings = (productElementUid)=>{
+        const eventCreate = new CustomEvent('editor:toolbar:open-product-element', {
+            bubbles: true,
+            detail: {
+                productElementUid: productElementUid
+            }
+        });
+        window.dispatchEvent(eventCreate);
+    };
+    useEffect(()=>{
+        window.addEventListener('editor:ai-generate-content-status', onGenerateContentStatus);
+        return ()=>{
+            window.removeEventListener('editor:ai-generate-content-status', onGenerateContentStatus);
+        };
+    }, [
+        onGenerateContentStatus
+    ]);
+    return {
+        isGenerating,
+        onGenerate,
+        onOpenProductElementSettings
+    };
+};
+
+export { useListenEventGenerate };

package/dist/esm/components/ai-generator/icons/AIIcon.js

@@ -0,0 +1,65 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+const AIIcon = ()=>{
+    const getRandomId = ()=>{
+        return Math.random().toString(36).substring(7);
+    };
+    const linearGradientId = getRandomId();
+    return /*#__PURE__*/ jsxs("svg", {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+            /*#__PURE__*/ jsx("path", {
+                d: "M11.6363 2.67137C11.5886 2.52361 11.3795 2.52361 11.3318 2.67137L11.1133 3.34797C11.0352 3.58971 10.8469 3.78 10.606 3.86067L9.93715 4.08465C9.79156 4.1334 9.79156 4.33933 9.93715 4.38809L10.606 4.61207C10.8469 4.69273 11.0352 4.88302 11.1133 5.12477L11.3318 5.80137C11.3795 5.94913 11.5886 5.94913 11.6363 5.80137L11.8549 5.12477C11.933 4.88302 12.1212 4.69273 12.3621 4.61207L13.031 4.38809C13.1766 4.33933 13.1766 4.1334 13.031 4.08465L12.3621 3.86067C12.1212 3.78 11.933 3.58971 11.8549 3.34797L11.6363 2.67137Z",
+                fill: `url(#${linearGradientId}_0)`
+            }),
+            /*#__PURE__*/ jsx("path", {
+                d: "M7.61245 3.30705C7.54086 3.08541 7.22728 3.08541 7.15569 3.30705L6.39541 5.6608C6.16115 6.38604 5.59636 6.9569 4.87367 7.19891L2.56369 7.97242C2.3453 8.04555 2.34531 8.35445 2.5637 8.42758L4.87367 9.2011C5.59636 9.4431 6.16115 10.014 6.39541 10.7392L7.15569 13.093C7.22728 13.3146 7.54086 13.3146 7.61245 13.093L8.37273 10.7392C8.60699 10.014 9.17178 9.4431 9.89447 9.2011L12.2044 8.42758C12.4228 8.35445 12.4228 8.04555 12.2044 7.97242L9.89447 7.1989C9.17178 6.9569 8.60699 6.38604 8.37273 5.6608L7.61245 3.30705Z",
+                fill: `url(#${linearGradientId}_1)`
+            }),
+            /*#__PURE__*/ jsxs("defs", {
+                children: [
+                    /*#__PURE__*/ jsxs("linearGradient", {
+                        id: `${linearGradientId}_0`,
+                        x1: "15.3433",
+                        y1: "2.56054",
+                        x2: "4.24885",
+                        y2: "1.00838",
+                        gradientUnits: "userSpaceOnUse",
+                        children: [
+                            /*#__PURE__*/ jsx("stop", {
+                                stopColor: "#D8E1FF"
+                            }),
+                            /*#__PURE__*/ jsx("stop", {
+                                offset: "1",
+                                stopColor: "#C8ACFF"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsxs("linearGradient", {
+                        id: `${linearGradientId}_1`,
+                        x1: "15.3433",
+                        y1: "2.56054",
+                        x2: "4.24885",
+                        y2: "1.00838",
+                        gradientUnits: "userSpaceOnUse",
+                        children: [
+                            /*#__PURE__*/ jsx("stop", {
+                                stopColor: "#D8E1FF"
+                            }),
+                            /*#__PURE__*/ jsx("stop", {
+                                offset: "1",
+                                stopColor: "#C8ACFF"
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+};
+
+export { AIIcon };

package/dist/esm/components/ai-generator/icons/CloseIcon.js

@@ -0,0 +1,17 @@
+import { jsx } from 'react/jsx-runtime';
+
+const CloseIcon = ()=>{
+    return /*#__PURE__*/ jsx("svg", {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M11.1755 12.0243C11.4099 12.2586 11.7898 12.2586 12.0241 12.0243C12.2584 11.79 12.2584 11.4101 12.0241 11.1757L8.84833 8L12.0241 4.82427C12.2584 4.58995 12.2584 4.21005 12.0241 3.97574C11.7898 3.74142 11.4099 3.74142 11.1755 3.97574L7.9998 7.15148L4.82407 3.97574C4.58975 3.74142 4.20986 3.74142 3.97554 3.97574C3.74123 4.21005 3.74123 4.58995 3.97554 4.82427L7.15128 8L3.97554 11.1757C3.74123 11.4101 3.74123 11.79 3.97554 12.0243C4.20986 12.2586 4.58975 12.2586 4.82407 12.0243L7.9998 8.84853L11.1755 12.0243Z",
+            fill: "#F9F9F9"
+        })
+    });
+};
+
+export { CloseIcon };

package/dist/esm/components/ai-generator/icons/DropdownIcon.js

@@ -0,0 +1,34 @@
+import { jsx } from 'react/jsx-runtime';
+
+const DropdownIcon = ()=>{
+    return /*#__PURE__*/ jsx("svg", {
+        width: "20",
+        height: "20",
+        viewBox: "0 0 20 20",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/ jsx("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M5.13313 7.62204C5.31064 7.45932 5.59845 7.45932 5.77596 7.62204L10 11.4941L14.224 7.62204C14.4016 7.45932 14.6894 7.45932 14.8669 7.62204C15.0444 7.78476 15.0444 8.04858 14.8669 8.21129L10.3214 12.378C10.1439 12.5407 9.8561 12.5407 9.67859 12.378L5.13313 8.21129C4.95562 8.04858 4.95562 7.78476 5.13313 7.62204Z",
+            fill: "#F9F9F9"
+        })
+    });
+};
+const TickIcon = ()=>{
+    return /*#__PURE__*/ jsx("svg", {
+        width: "20",
+        height: "20",
+        viewBox: "0 0 20 20",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/ jsx("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M15.8415 5.1766C16.0528 5.41207 16.0528 5.79383 15.8415 6.0293L7.95016 14.8234C7.84869 14.9365 7.71107 15 7.56757 15C7.42408 15 7.28645 14.9365 7.18499 14.8234L4.15846 11.4505C3.94717 11.215 3.94718 10.8333 4.15848 10.5978C4.36978 10.3623 4.71236 10.3623 4.92365 10.5978L7.56759 13.5443L15.0764 5.1766C15.2877 4.94113 15.6302 4.94113 15.8415 5.1766Z",
+            fill: "#00C853"
+        })
+    });
+};
+
+export { DropdownIcon, TickIcon };

package/dist/esm/components/ai-generator/icons/SearchIcon.js

@@ -0,0 +1,19 @@
+import { jsx } from 'react/jsx-runtime';
+
+const SearchIcon = ()=>{
+    return /*#__PURE__*/ jsx("svg", {
+        width: "20",
+        height: "20",
+        viewBox: "0 0 20 20",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/ jsx("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M8.75 2.5C5.29822 2.5 2.5 5.29822 2.5 8.75C2.5 12.2018 5.29822 15 8.75 15C10.2508 15 11.628 14.471 12.7055 13.5893L16.4775 17.3614C16.7216 17.6054 17.1173 17.6054 17.3614 17.3614C17.6054 17.1173 17.6054 16.7216 17.3614 16.4775L13.5893 12.7055C14.471 11.628 15 10.2508 15 8.75C15 5.29822 12.2018 2.5 8.75 2.5ZM3.75 8.75C3.75 5.98858 5.98858 3.75 8.75 3.75C11.5114 3.75 13.75 5.98858 13.75 8.75C13.75 11.5114 11.5114 13.75 8.75 13.75C5.98858 13.75 3.75 11.5114 3.75 8.75Z",
+            fill: "#AAAAAA"
+        })
+    });
+};
+
+export { SearchIcon };

package/dist/esm/components/ai-generator/icons/ShowMoreIcon.js

@@ -0,0 +1,19 @@
+import { jsx } from 'react/jsx-runtime';
+
+const ShowMoreIcon = ()=>{
+    return /*#__PURE__*/ jsx("svg", {
+        width: "17",
+        height: "16",
+        viewBox: "0 0 17 16",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/ jsx("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M4.60651 6.09763C4.74852 5.96746 4.97876 5.96746 5.12077 6.09763L8.5 9.19526L11.8792 6.09763C12.0212 5.96746 12.2515 5.96746 12.3935 6.09763C12.5355 6.22781 12.5355 6.43886 12.3935 6.56904L8.75713 9.90237C8.61512 10.0325 8.38488 10.0325 8.24287 9.90237L4.60651 6.56904C4.4645 6.43886 4.4645 6.22781 4.60651 6.09763Z",
+            fill: "#F9F9F9"
+        })
+    });
+};
+
+export { ShowMoreIcon };

package/dist/esm/components/constant.js

@@ -67,5 +67,17 @@ const postPurchaseWrapElements = [
     'PostPurchaseCalloutBox',
     'PostPurchaseProductOffer'
 ];
+const ableGenerateContentElements = [
+    'Section',
+    'Row',
+    'Text',
+    'Heading',
+    'Accordion',
+    'Product',
+    'HeroBanner',
+    'IconList',
+    'IconListV2',
+    'AdvancedList'
+];
 
-export { customRenderChildren, disableWrap, excludeApplyStyle, postPurchaseRequiredElements, postPurchaseWrapElements };
+export { ableGenerateContentElements, customRenderChildren, disableWrap, excludeApplyStyle, postPurchaseRequiredElements, postPurchaseWrapElements };

package/dist/esm/components/resize/Spacing.js

@@ -6,10 +6,12 @@ import 'swr';
 import '@gem-sdk/adapter-shopify';
 import 'swr/mutation';
 import { usePageType } from '../../hooks/shop.js';
+import 'swr/infinite';
 import 'vanilla-lazyload';
 import '../../hooks/useCartUI.js';
 import 'react-transition-group';
 import '@gem-sdk/core';
+import 'classnames';
 import '../../helpers/convert.js';
 
 function Spacing(props) {

package/dist/esm/components/theme-section/CreateThemeSection.js

@@ -6,8 +6,10 @@ import { useShopStore } from '../../contexts/ShopContext.js';
 import '@gem-sdk/adapter-shopify';
 import 'swr';
 import 'swr/mutation';
+import 'swr/infinite';
 import 'vanilla-lazyload';
 import '../../hooks/useCartUI.js';
+import 'classnames';
 import '../../helpers/convert.js';
 
 const SHOW_TOOLTIP_TIMEOUT = 600;

package/dist/esm/helpers/queries/get-products.js

@@ -72,9 +72,48 @@ const getProductQueryAll = async (fetcher, arg)=>{
         },
         where: {
             status: 'ACTIVE',
-            ...arg
+            ...arg,
+            or: [
+                {
+                    hasProductTags: false
+                },
+                {
+                    hasProductTagsWith: [
+                        {
+                            hasTagsWith: [
+                                {
+                                    nameNotIn: [
+                                        'bogos-gift'
+                                    ]
+                                }
+                            ]
+                        }
+                    ]
+                }
+            ]
         }
     };
+    return fetchProducts(fetcher, variables);
+};
+const getListProductByVariables = async (fetcher, arg)=>{
+    const variables = {
+        first: arg.first || 8,
+        firstMedia: 1,
+        firstVariant: 1,
+        orderBy: {
+            field: 'PLATFORM_CREATED_AT',
+            direction: 'DESC'
+        },
+        orderByMedia: {
+            field: 'POSITION',
+            direction: 'ASC'
+        },
+        where: {
+            status: 'ACTIVE',
+            ...arg.where
+        },
+        after: arg.after
+    };
     const pageData = await fetchProducts(fetcher, variables);
     return pageData;
 };
@@ -120,7 +159,25 @@ const loopFetchProducts = async (fetcher, { ids, isSample, isStorefront, default
                 },
                 ...ids?.length ? {
                     baseIDIn: ids
-                } : {}
+                } : {},
+                or: [
+                    {
+                        hasProductTags: false
+                    },
+                    {
+                        hasProductTagsWith: [
+                            {
+                                hasTagsWith: [
+                                    {
+                                        nameNotIn: [
+                                            'bogos-gift'
+                                        ]
+                                    }
+                                ]
+                            }
+                        ]
+                    }
+                ]
             },
             after: productAfterFetcher
         };
@@ -185,4 +242,4 @@ const mergeMediasToProducts = async ({ fetcher, products, isSample, isStorefront
  //   );
  // };
 
-export { getProductQueryAll, getProducts };
+export { getListProductByVariables, getProductQueryAll, getProducts };

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

@@ -1,5 +1,6 @@
 import useSWR from 'swr';
-import { getProducts, getProductQueryAll } from '../../helpers/queries/get-products.js';
+import useSWRInfinite from 'swr/infinite';
+import { getProducts, getProductQueryAll, getListProductByVariables } from '../../helpers/queries/get-products.js';
 import { generateProductsQueryKey } from '../../helpers/query.js';
 import { useIsSampleProduct, useIsStorefrontProduct } from '../shop.js';
 import { useFetchHandle } from '../useFetchHandle.js';
@@ -18,6 +19,33 @@ const useProductsQuery = (ids, options, params)=>{
         return 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();
+    const data = useSWRInfinite(getKey(variable), async ([, arg])=>{
+        return getListProductByVariables(fetcher, arg);
+    }, options);
+    return data;
+};
 const useProductsQueryAll = (variable, options)=>{
     const fetcher = useFetchHandle();
     return useSWR(variable ? [
@@ -28,4 +56,4 @@ const useProductsQueryAll = (variable, options)=>{
     }, options);
 };
 
-export { useProductsQuery, useProductsQueryAll };
+export { useListProductQuery, useProductsQuery, useProductsQueryAll };

package/dist/esm/hooks/useAnimations.js

@@ -5,10 +5,12 @@ import 'zustand';
 import 'swr';
 import '@gem-sdk/adapter-shopify';
 import 'swr/mutation';
+import 'swr/infinite';
 import 'vanilla-lazyload';
 import './useCartUI.js';
 import 'react-transition-group';
 import '@gem-sdk/core';
+import 'classnames';
 import '../helpers/convert.js';
 
 const useAnimations = ()=>{

package/dist/esm/hooks/useInitialSwatchesOptions.js

@@ -9,10 +9,12 @@ import 'react/jsx-runtime';
 import 'zustand';
 import '@gem-sdk/adapter-shopify';
 import 'swr/mutation';
+import 'swr/infinite';
 import 'vanilla-lazyload';
 import './useCartUI.js';
 import 'react-transition-group';
 import '@gem-sdk/core';
+import 'classnames';
 import isBrowser from '../helpers/is-browser.js';
 import '../helpers/convert.js';
 

package/dist/esm/hooks/useProduct.js

@@ -6,11 +6,13 @@ import 'swr';
 import { usePageStore } from '../contexts/PageContext.js';
 import '@gem-sdk/adapter-shopify';
 import 'swr/mutation';
+import 'swr/infinite';
 import 'vanilla-lazyload';
 import './useCartUI.js';
 import { checkInStock } from '../helpers/variant.js';
 import 'react-transition-group';
 import '@gem-sdk/core';
+import 'classnames';
 import { flattenConnection } from '../helpers/flatten-connection.js';
 import '../helpers/convert.js';
 import { getSelectedVariant } from '../helpers/product.js';

package/dist/types/index.d.ts

@@ -7787,6 +7787,7 @@ type ComponentSetting<P extends BaseProps> = {
             flowPage?: string;
             notAppendTags?: string[];
             notAppendLeftRight?: boolean;
+            allowAppendTags?: string[];
         };
         sideBar?: {
             hide?: boolean;
@@ -27059,7 +27060,7 @@ type RGBAColorType = `rgba(${number}, ${number}, ${number}, ${number})`;
 type RGBColorType = `rgb(${number}, ${number}, ${number})`;
 type HSLColorType = `hsl(${number}, ${number}%, ${number}%)`;
 type HSLAColorType = `hsla(${number}, ${number}%, ${number}%, ${number})`;
-type ColorValueType = ColorType$1 | HexColorType | RGBAColorType | RGBColorType | HSLColorType | HSLAColorType | ColorKey;
+type ColorValueType = ColorType$1 | HexColorType | RGBAColorType | RGBColorType | HSLColorType | HSLAColorType | ColorKey | string;
 type BrandColorObject = {
     brand: string;
     highlight: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/core",
-  "version": "1.41.0-dev.20",
+  "version": "1.41.0-dev.26",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",
@@ -27,8 +27,8 @@
     "type-check": "yarn tsc --noEmit"
   },
   "devDependencies": {
-    "@gem-sdk/adapter-shopify": "1.41.0-staging.13",
-    "@gem-sdk/styles": "1.41.0-dev.16"
+    "@gem-sdk/adapter-shopify": "1.41.0-dev.23",
+    "@gem-sdk/styles": "1.41.0-dev.26"
   },
   "dependencies": {
     "react-error-boundary": "4.0.10",