@gem-sdk/core 1.21.10 → 1.22.0-hotfix.0

package/dist/cjs/hooks/useProduct.js

@@ -28,11 +28,32 @@ const useQuantity = ()=>{
     const decrement = ProductContext.useProductStore((s)=>s.decrementQuantity);
     const increment = ProductContext.useProductStore((s)=>s.incrementQuantity);
     const updateQuantity = ProductContext.useProductStore((s)=>s.setQuantity);
+    const isSyncProduct = ProductContext.useProductStore((s)=>s.isSyncProduct);
+    const product = ProductContext.useProductStore((s)=>s.product);
+    const productId = product?.id;
     const reset = react.useCallback(()=>{
         updateQuantity(1);
     }, [
         updateQuantity
     ]);
+    react.useEffect(()=>{
+        if (isSyncProduct) {
+            const setOption = new CustomEvent('set-product-quantity', {
+                bubbles: true,
+                cancelable: true,
+                composed: true,
+                detail: {
+                    quantity,
+                    productId
+                }
+            });
+            window.dispatchEvent(setOption);
+        }
+    }, [
+        quantity,
+        isSyncProduct,
+        productId
+    ]);
     return react.useMemo(()=>({
             quantity,
             increment,
@@ -51,8 +72,9 @@ const useSelectedOption = ()=>{
     const setSelectedOption = ProductContext.useProductStore((s)=>s.setSelectedOption);
     const selectedOptions = ProductContext.useProductStore((s)=>s.selectedOptions);
     const forceSelectedOption = ProductContext.useProductStore((s)=>s.forceSelectedOption);
+    const isSyncProduct = ProductContext.useProductStore((s)=>s.isSyncProduct);
     const updateOption = react.useCallback((optionId, optionValue, productId, noEmit)=>{
-        if (!noEmit) {
+        if (!noEmit && isSyncProduct) {
             const setOption = new CustomEvent('set-selected-option', {
                 bubbles: true,
                 cancelable: true,
@@ -67,10 +89,11 @@ const useSelectedOption = ()=>{
         }
         setSelectedOption(optionId, optionValue);
     }, [
-        setSelectedOption
+        setSelectedOption,
+        isSyncProduct
     ]);
     const forceOption = react.useCallback((selectedOption, productId, noEmit)=>{
-        if (!noEmit) {
+        if (!noEmit && isSyncProduct) {
             const forceOption = new CustomEvent('force-selected-option', {
                 bubbles: true,
                 cancelable: true,
@@ -84,7 +107,8 @@ const useSelectedOption = ()=>{
         }
         forceSelectedOption(selectedOption);
     }, [
-        forceSelectedOption
+        forceSelectedOption,
+        isSyncProduct
     ]);
     return react.useMemo(()=>({
             selectedOptions,

package/dist/esm/hooks/useProduct.js

@@ -1,4 +1,4 @@
-import { useCallback, useMemo } from 'react';
+import { useCallback, useEffect, useMemo } from 'react';
 import { useProductStore } from '../contexts/ProductContext.js';
 import { flattenConnection } from '../helpers/flatten-connection.js';
 import 'swr';
@@ -26,11 +26,32 @@ const useQuantity = ()=>{
     const decrement = useProductStore((s)=>s.decrementQuantity);
     const increment = useProductStore((s)=>s.incrementQuantity);
     const updateQuantity = useProductStore((s)=>s.setQuantity);
+    const isSyncProduct = useProductStore((s)=>s.isSyncProduct);
+    const product = useProductStore((s)=>s.product);
+    const productId = product?.id;
     const reset = useCallback(()=>{
         updateQuantity(1);
     }, [
         updateQuantity
     ]);
+    useEffect(()=>{
+        if (isSyncProduct) {
+            const setOption = new CustomEvent('set-product-quantity', {
+                bubbles: true,
+                cancelable: true,
+                composed: true,
+                detail: {
+                    quantity,
+                    productId
+                }
+            });
+            window.dispatchEvent(setOption);
+        }
+    }, [
+        quantity,
+        isSyncProduct,
+        productId
+    ]);
     return useMemo(()=>({
             quantity,
             increment,
@@ -49,8 +70,9 @@ const useSelectedOption = ()=>{
     const setSelectedOption = useProductStore((s)=>s.setSelectedOption);
     const selectedOptions = useProductStore((s)=>s.selectedOptions);
     const forceSelectedOption = useProductStore((s)=>s.forceSelectedOption);
+    const isSyncProduct = useProductStore((s)=>s.isSyncProduct);
     const updateOption = useCallback((optionId, optionValue, productId, noEmit)=>{
-        if (!noEmit) {
+        if (!noEmit && isSyncProduct) {
             const setOption = new CustomEvent('set-selected-option', {
                 bubbles: true,
                 cancelable: true,
@@ -65,10 +87,11 @@ const useSelectedOption = ()=>{
         }
         setSelectedOption(optionId, optionValue);
     }, [
-        setSelectedOption
+        setSelectedOption,
+        isSyncProduct
     ]);
     const forceOption = useCallback((selectedOption, productId, noEmit)=>{
-        if (!noEmit) {
+        if (!noEmit && isSyncProduct) {
             const forceOption = new CustomEvent('force-selected-option', {
                 bubbles: true,
                 cancelable: true,
@@ -82,7 +105,8 @@ const useSelectedOption = ()=>{
         }
         forceSelectedOption(selectedOption);
     }, [
-        forceSelectedOption
+        forceSelectedOption,
+        isSyncProduct
     ]);
     return useMemo(()=>({
             selectedOptions,

package/dist/types/index.d.ts

@@ -171,7 +171,7 @@ type HyperlinkInfo = {
     link?: string;
     modal?: CommonModalApp;
 };
-type Mapped$4<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
+type Mapped$5<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     id: K;
     label?: string;
     info?: string;
@@ -237,7 +237,7 @@ type Mapped$4<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     default?: T;
 };
 type SharedControlType<T> = {
-    [K in keyof T]-?: Mapped$4<K, T[K]>;
+    [K in keyof T]-?: Mapped$5<K, T[K]>;
 }[keyof T];
 
 type AngleControlType<T> = SharedControlType<T> & {
@@ -254,7 +254,7 @@ type Option$3<T> = {
     text: string | number;
     desc?: any;
 };
-type Mapped$3<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
+type Mapped$4<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     id: K;
     label: string;
     hideOnMode?: {
@@ -292,7 +292,7 @@ type Mapped$3<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     default?: T;
 };
 type CheckboxControlType<T> = {
-    [K in keyof T]-?: Mapped$3<K, T[K]>;
+    [K in keyof T]-?: Mapped$4<K, T[K]>;
 }[keyof T];
 
 type ChildrensControlType = {
@@ -428,7 +428,7 @@ type Option$2<T> = {
     type?: string;
     icon?: string;
 };
-type Mapped$2<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
+type Mapped$3<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     id: K;
     label?: string;
     info?: string;
@@ -472,7 +472,7 @@ type Mapped$2<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     default?: T;
 };
 type SegmentControlType<T> = {
-    [K in keyof T]-?: Mapped$2<K, T[K]>;
+    [K in keyof T]-?: Mapped$3<K, T[K]>;
 }[keyof T];
 
 type Option$1<T> = {
@@ -480,7 +480,7 @@ type Option$1<T> = {
     label: string | number;
     hideOnPage?: string[];
 };
-type Mapped$1<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
+type Mapped$2<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     id: K;
     label?: string;
     info?: string;
@@ -522,7 +522,7 @@ type Mapped$1<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     default?: T;
 };
 type SelectControlType<T> = {
-    [K in keyof T]-?: Mapped$1<K, T[K]>;
+    [K in keyof T]-?: Mapped$2<K, T[K]>;
 }[keyof T];
 
 type TextareaControlType<T> = SharedControlType<T> & {
@@ -729,7 +729,7 @@ type Option<T> = {
     type?: string;
     icon?: string;
 };
-type Mapped<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
+type Mapped$1<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     id: K;
     label: string;
     info?: string;
@@ -775,7 +775,7 @@ type Mapped<K, T> = NonNullable<T> extends ObjectDevices<infer U> ? {
     default?: T;
 };
 type LayoutSegmentControlType<T> = {
-    [K in keyof T]-?: Mapped<K, T[K]>;
+    [K in keyof T]-?: Mapped$1<K, T[K]>;
 }[keyof T];
 
 type InputSpacing<T> = SharedControlType<T> & {
@@ -858,7 +858,36 @@ type SyncProductPropertiesControlType<T> = SharedControlType<T> & {
     type: 'sync-product-properties';
 };
 
-type ControlProp<T> = AngleControlType<T> | CheckboxControlType<T> | ColorPickerControlType<T> | GroupControlType<T> | IconControlType<T> | InputFixContentControlType<T> | InputNumberControlType<T> | InputUnitControlType<T> | InputUnitSpacingControlType<T> | InputUnitWidthControlType<T> | InputControlType<T> | MarginControlType<T> | PaddingControlType<T> | PositionControlType<T> | RadioGroupControlType | RangeControlType<T> | SegmentControlType<T> | SelectControlType<T> | TextareaControlType<T> | ToggleControlType<T> | ImageControlType<T> | ChildrensControlType | GridControlType<T> | FlexControlType<T> | TextEditorControlType<T> | ProductControlType<T> | TypographyControlType<T> | TypographyV2ControlType<T> | MenuControlType<T> | BehaviorStateControlType<T> | PickLinkControlType<T> | BoxShadowControlType<T> | TextShadowControlType<T> | BorderControlType<T> | BorderRadiusControlType<T> | RadiusPresetControlType<T> | SizeControlType<T> | ChildItemType<T> | PickMultiProductControlType<T> | CollectionControlType<T> | BackgroundControlType<T> | VisibilityControlType<T> | SelectVariantControlType | CountdownEvergreenType | Timezone<T> | CustomContentControlType<T> | DateTimePickerControlType | CountdownDailyType | KlaviyoCodes | YotpoLoyaltyCodes | InputWidthControlType<T> | LayoutSegmentControlType<T> | InputSpacing<T> | UniqueIdControlType<T> | PositionSquareControlType<T> | CustomCodeEditor | LayoutControlType<T> | SwatchesLinkControlType<T> | ProductListControlType<T> | CollectionBannerControlType<T> | Ratio<T> | StickyDisplayControlType<T> | SyncProductPropertiesControlType<T>;
+type Steps<T> = {
+    label?: string | number;
+    type?: string;
+    icon?: string;
+    value: T;
+    actions?: Actions[];
+};
+type Actions = {
+    label?: string | number;
+    type?: 'tertiary' | 'primary';
+    size?: 'large' | 'medium' | 'small';
+    icon?: string;
+    iconPosition?: 'left' | 'right';
+    buttonType?: 'link' | 'action';
+    actionHandle?: string;
+    link?: string;
+};
+type Mapped<K, T> = {
+    id: K;
+    label: string;
+    info?: string;
+    type: 'steps-guide';
+    steps?: Steps<T>[];
+    default?: T;
+};
+type StepsGuide<T> = {
+    [K in keyof T]-?: Mapped<K, T[K]>;
+}[keyof T];
+
+type ControlProp<T> = AngleControlType<T> | CheckboxControlType<T> | ColorPickerControlType<T> | GroupControlType<T> | IconControlType<T> | InputFixContentControlType<T> | InputNumberControlType<T> | InputUnitControlType<T> | InputUnitSpacingControlType<T> | InputUnitWidthControlType<T> | InputControlType<T> | MarginControlType<T> | PaddingControlType<T> | PositionControlType<T> | RadioGroupControlType | RangeControlType<T> | SegmentControlType<T> | SelectControlType<T> | TextareaControlType<T> | ToggleControlType<T> | ImageControlType<T> | ChildrensControlType | GridControlType<T> | FlexControlType<T> | TextEditorControlType<T> | ProductControlType<T> | TypographyControlType<T> | TypographyV2ControlType<T> | MenuControlType<T> | BehaviorStateControlType<T> | PickLinkControlType<T> | BoxShadowControlType<T> | TextShadowControlType<T> | BorderControlType<T> | BorderRadiusControlType<T> | RadiusPresetControlType<T> | SizeControlType<T> | ChildItemType<T> | PickMultiProductControlType<T> | CollectionControlType<T> | BackgroundControlType<T> | VisibilityControlType<T> | SelectVariantControlType | CountdownEvergreenType | Timezone<T> | CustomContentControlType<T> | DateTimePickerControlType | CountdownDailyType | KlaviyoCodes | YotpoLoyaltyCodes | InputWidthControlType<T> | LayoutSegmentControlType<T> | InputSpacing<T> | UniqueIdControlType<T> | PositionSquareControlType<T> | CustomCodeEditor | LayoutControlType<T> | SwatchesLinkControlType<T> | ProductListControlType<T> | CollectionBannerControlType<T> | Ratio<T> | StickyDisplayControlType<T> | SyncProductPropertiesControlType<T> | StepsGuide<T>;
 type Setting<P extends BaseProps> = {
     id: 'setting';
     note?: string;
@@ -948,6 +977,7 @@ type ControlUI = {
         };
         hideOnPages?: PageType[];
     };
+    isMoreSetting?: boolean;
 };
 type PageType = 'ARTICLE' | 'BLOG' | 'COLLECTION' | 'GP_ARTICLE' | 'GP_BLOG' | 'GP_COLLECTION' | 'GP_INDEX' | 'GP_PRODUCT' | 'GP_STATIC' | 'PRODUCT' | 'STATIC';
 type ComponentPreset = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/core",
-  "version": "1.21.10",
+  "version": "1.22.0-hotfix.0",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",