@gem-sdk/components 4.0.0-staging.1159 → 4.0.0-staging.1162

package/dist/cjs/post-purchase/product/components/product-image/carousel-post-purchase/CarouselWrapperPostPurchase.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var jsxRuntime=require("react/jsx-runtime"),React=require("react"),helper=require("../../../../common/helper.js"),system=require("@gem-sdk/system"),Arrow=require("./Arrow.js"),CarouselPostPurchase=require("./CarouselPostPurchase.js"),useCarousel=require("../../../hooks/useCarousel.js"),classes=require("../../../common/classes.js"),styles=require("../../../common/styles.js");const CarouselWrapperPostPurchase=({styles:e,setting:s,productImages:r,objectFit:t="cover",aspectRatio:a,itemPerSlide:o=1,spacing:u,navigation:c="none",vertical:l=!1,border:i="none",idxActive:n})=>{let m={...e,...s},{layoutType:P}=m||{},{setMoveToIdx:h,setMaxIdx:p}=useCarousel.useCarousel(),j=helper.postPurchaseSpacing[u||"none"]??"0px",x="one-col"===P,y=system.createClass(classes.getImageListClass()),C=system.createStyle(styles.getImageListStyle({gap:j,vertical:l}));return React.useEffect(()=>{let e=r.length-Number(o||0);p(e)},[r.length,o,p]),React.useEffect(()=>{n&&1===o&&h(n)},[n,o,h]),jsxRuntime.jsxs("div",{className:y,style:C,children:[jsxRuntime.jsx(Arrow.ArrowPostPurchase,{type:"prev",navigation:c,vertical:l,hidden:x}),jsxRuntime.jsx(CarouselPostPurchase.CarouselPostPurchase,{productImages:r,itemPerRow:o,border:i,aspectRatio:a,objectFit:t,vertical:l}),jsxRuntime.jsx(Arrow.ArrowPostPurchase,{type:"next",navigation:c,vertical:l,hidden:x})]})};exports.CarouselWrapperPostPurchase=CarouselWrapperPostPurchase;
+"use strict";var jsxRuntime=require("react/jsx-runtime"),React=require("react"),helper=require("../../../../common/helper.js"),system=require("@gem-sdk/system"),Arrow=require("./Arrow.js"),CarouselPostPurchase=require("./CarouselPostPurchase.js"),useCarousel=require("../../../hooks/useCarousel.js"),classes=require("../../../common/classes.js"),styles=require("../../../common/styles.js");const CarouselWrapperPostPurchase=({styles:e,setting:s,productImages:r,objectFit:t="cover",aspectRatio:a,itemPerSlide:o=1,spacing:u,navigation:c="none",vertical:l=!1,border:i="none",idxActive:n})=>{let m={...e,...s},{layoutType:P}=m||{},{setMoveToIdx:h,setMaxIdx:p}=useCarousel.useCarousel(),j=helper.postPurchaseSpacing[u||"none"]??"0px",x="one-col"===P,y=system.createClass(classes.getImageListClass()),C=system.createStyle(styles.getImageListStyle({gap:j,vertical:l}));return React.useEffect(()=>{let e=r.length-Number(o||0);p(e)},[r.length,o,p]),React.useEffect(()=>{(n||0===n)&&1===o&&h(n)},[n,o,h]),jsxRuntime.jsxs("div",{className:y,style:C,children:[jsxRuntime.jsx(Arrow.ArrowPostPurchase,{type:"prev",navigation:c,vertical:l,hidden:x}),jsxRuntime.jsx(CarouselPostPurchase.CarouselPostPurchase,{productImages:r,itemPerRow:o,border:i,aspectRatio:a,objectFit:t,vertical:l}),jsxRuntime.jsx(Arrow.ArrowPostPurchase,{type:"next",navigation:c,vertical:l,hidden:x})]})};exports.CarouselWrapperPostPurchase=CarouselWrapperPostPurchase;

package/dist/cjs/product/components/product-variants/common/main/const.js

@@ -0,0 +1 @@
+"use strict";const VAR_WIDTH_BY_DEVICE={desktop:"--w",tablet:"--w-tablet",mobile:"--w-mobile"},HORIZONTAL_WIDTH="120px",DEFAULT_WIDTH_LABEL="fit-content";exports.DEFAULT_WIDTH_LABEL="fit-content",exports.HORIZONTAL_WIDTH="120px",exports.VAR_WIDTH_BY_DEVICE=VAR_WIDTH_BY_DEVICE;

package/dist/cjs/product/components/product-variants/common/main/getData.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),mappingVariantStyles=require("../../utils/mappingVariantStyles.js"),common=require("../common.js");const getDropdownGroupData=t=>{let{styles:e,setting:a}=t,{dropdownItemWidth:o}=e??{},r=mappingVariantStyles.mappingVariantStyles(a?.variantPresets,e),l={...a,variantPresets:r},i=()=>{let t={};return core.DEVICES.forEach(e=>{t[e]=o?.[e]==="fill"}),t};return{...e,...l,swatchAutoWidth:i()}},getTextVariantTitleData=(t,e,a)=>{let{styles:o,setting:r}=t,{layout:l}=r??{},{labelGap:i}=o??{},{optionName:n,hasPreSelected:p,isChangeVariant:s,selectedOptions:m,styleOptionSelected:g}=a??{},c=core.composeTypographyClassName(o?.labelTypo,o?.labelTypography),u=()=>{let t={};return l?.desktop==="horizontal"?t["--w"]="120px":l?.tablet==="horizontal"?t["--w-tablet"]="120px":l?.mobile==="horizontal"&&(t["--w-mobile"]="120px"),t},y=()=>"Liquid"===e?"{{option.name}}":`${n}${(!1!=p||s)&&"dropdown"!==g?`: ${m?.[n]}`:""}`;return{className:core.cls(c,"Liquid"===e?"{{showVariantClass}}":""),styles:{typo:o?.labelTypo},style:{...common.makeStyleGapForLabel(l,i)},setting:{htmlTag:"legend",text:y(),tagWidth:u(),excludeFlex:!0}}};exports.getDropdownGroupData=getDropdownGroupData,exports.getTextVariantTitleData=getTextVariantTitleData;
+"use strict";var core=require("@gem-sdk/core"),mappingVariantStyles=require("../../utils/mappingVariantStyles.js"),common=require("../common.js"),_const=require("./const.js");const getDropdownGroupData=e=>{let{styles:t,setting:a}=e,{dropdownItemWidth:r}=t??{},o=mappingVariantStyles.mappingVariantStyles(a?.variantPresets,t),n={...a,variantPresets:o},s=()=>{let e={};return core.DEVICES.forEach(t=>{e[t]=r?.[t]==="fill"}),e};return{...t,...n,swatchAutoWidth:s()}},getTextVariantTitleData=(e,t,a)=>{let{styles:r,setting:o}=e,{layout:n}=o??{},{labelGap:s}=r??{},{optionName:i,hasPreSelected:l,isChangeVariant:p,selectedOptions:c,styleOptionSelected:m}=a??{},g=core.composeTypographyClassName(r?.labelTypo,r?.labelTypography),u=e=>{let t=Object.fromEntries(core.DEVICES.map(t=>[_const.VAR_WIDTH_BY_DEVICE[t],"horizontal"===core.getResponsiveValueByScreen(e,t)?_const.HORIZONTAL_WIDTH:_const.DEFAULT_WIDTH_LABEL]));return t},D=()=>"Liquid"===t?"{{option.name}}":`${i}${(!1!=l||p)&&"dropdown"!==m?`: ${c?.[i]}`:""}`;return{className:core.cls(g,"Liquid"===t?"{{showVariantClass}}":""),styles:{typo:r?.labelTypo},style:{...common.makeStyleGapForLabel(n,s)},setting:{htmlTag:"legend",text:D(),tagWidth:u(n),excludeFlex:!0}}};exports.getDropdownGroupData=getDropdownGroupData,exports.getTextVariantTitleData=getTextVariantTitleData;

package/dist/esm/post-purchase/product/components/product-image/carousel-post-purchase/CarouselWrapperPostPurchase.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import{useEffect as o}from"react";import{postPurchaseSpacing as t}from"../../../../common/helper.js";import{createClass as s,createStyle as m}from"@gem-sdk/system";import{ArrowPostPurchase as a}from"./Arrow.js";import{CarouselPostPurchase as i}from"./CarouselPostPurchase.js";import{useCarousel as n}from"../../../hooks/useCarousel.js";import{getImageListClass as p}from"../../../common/classes.js";import{getImageListStyle as c}from"../../../common/styles.js";let CarouselWrapperPostPurchase=({styles:l,setting:u,productImages:h,objectFit:d="cover",aspectRatio:f,itemPerSlide:j=1,spacing:v,navigation:g="none",vertical:P=!1,border:y="none",idxActive:x})=>{let C={...l,...u},{layoutType:b}=C||{},{setMoveToIdx:k,setMaxIdx:w}=n(),N=t[v||"none"]??"0px",R="one-col"===b,W=s(p()),A=m(c({gap:N,vertical:P}));return o(()=>{let e=h.length-Number(j||0);w(e)},[h.length,j,w]),o(()=>{x&&1===j&&k(x)},[x,j,k]),e("div",{className:W,style:A,children:[r(a,{type:"prev",navigation:g,vertical:P,hidden:R}),r(i,{productImages:h,itemPerRow:j,border:y,aspectRatio:f,objectFit:d,vertical:P}),r(a,{type:"next",navigation:g,vertical:P,hidden:R})]})};export{CarouselWrapperPostPurchase};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import{useEffect as o}from"react";import{postPurchaseSpacing as t}from"../../../../common/helper.js";import{createClass as s,createStyle as m}from"@gem-sdk/system";import{ArrowPostPurchase as a}from"./Arrow.js";import{CarouselPostPurchase as i}from"./CarouselPostPurchase.js";import{useCarousel as n}from"../../../hooks/useCarousel.js";import{getImageListClass as p}from"../../../common/classes.js";import{getImageListStyle as c}from"../../../common/styles.js";let CarouselWrapperPostPurchase=({styles:l,setting:u,productImages:h,objectFit:d="cover",aspectRatio:f,itemPerSlide:j=1,spacing:v,navigation:g="none",vertical:P=!1,border:y="none",idxActive:x})=>{let C={...l,...u},{layoutType:b}=C||{},{setMoveToIdx:k,setMaxIdx:w}=n(),N=t[v||"none"]??"0px",R="one-col"===b,W=s(p()),A=m(c({gap:N,vertical:P}));return o(()=>{let e=h.length-Number(j||0);w(e)},[h.length,j,w]),o(()=>{(x||0===x)&&1===j&&k(x)},[x,j,k]),e("div",{className:W,style:A,children:[r(a,{type:"prev",navigation:g,vertical:P,hidden:R}),r(i,{productImages:h,itemPerRow:j,border:y,aspectRatio:f,objectFit:d,vertical:P}),r(a,{type:"next",navigation:g,vertical:P,hidden:R})]})};export{CarouselWrapperPostPurchase};

package/dist/esm/product/components/product-variants/common/main/const.js

@@ -0,0 +1 @@
+let VAR_WIDTH_BY_DEVICE={desktop:"--w",tablet:"--w-tablet",mobile:"--w-mobile"},HORIZONTAL_WIDTH="120px",DEFAULT_WIDTH_LABEL="fit-content";export{DEFAULT_WIDTH_LABEL,HORIZONTAL_WIDTH,VAR_WIDTH_BY_DEVICE};

package/dist/esm/product/components/product-variants/common/main/getData.js

@@ -1 +1 @@
-import{composeTypographyClassName as t,cls as e,DEVICES as a}from"@gem-sdk/core";import{mappingVariantStyles as o}from"../../utils/mappingVariantStyles.js";import{makeStyleGapForLabel as l}from"../common.js";let getDropdownGroupData=t=>{let{styles:e,setting:l}=t,{dropdownItemWidth:r}=e??{},i=o(l?.variantPresets,e),n={...l,variantPresets:i},p=()=>{let t={};return a.forEach(e=>{t[e]=r?.[e]==="fill"}),t};return{...e,...n,swatchAutoWidth:p()}},getTextVariantTitleData=(a,o,r)=>{let{styles:i,setting:n}=a,{layout:p}=n??{},{labelGap:s}=i??{},{optionName:m,hasPreSelected:d,isChangeVariant:g,selectedOptions:u,styleOptionSelected:h}=r??{},x=t(i?.labelTypo,i?.labelTypography),w=()=>{let t={};return p?.desktop==="horizontal"?t["--w"]="120px":p?.tablet==="horizontal"?t["--w-tablet"]="120px":p?.mobile==="horizontal"&&(t["--w-mobile"]="120px"),t},y=()=>"Liquid"===o?"{{option.name}}":`${m}${(!1!=d||g)&&"dropdown"!==h?`: ${u?.[m]}`:""}`;return{className:e(x,"Liquid"===o?"{{showVariantClass}}":""),styles:{typo:i?.labelTypo},style:{...l(p,s)},setting:{htmlTag:"legend",text:y(),tagWidth:w(),excludeFlex:!0}}};export{getDropdownGroupData,getTextVariantTitleData};
+import{composeTypographyClassName as t,cls as e,DEVICES as r,getResponsiveValueByScreen as a}from"@gem-sdk/core";import{mappingVariantStyles as o}from"../../utils/mappingVariantStyles.js";import{makeStyleGapForLabel as l}from"../common.js";import{VAR_WIDTH_BY_DEVICE as i,HORIZONTAL_WIDTH as n,DEFAULT_WIDTH_LABEL as s}from"./const.js";let getDropdownGroupData=t=>{let{styles:e,setting:a}=t,{dropdownItemWidth:l}=e??{},i=o(a?.variantPresets,e),n={...a,variantPresets:i},s=()=>{let t={};return r.forEach(e=>{t[e]=l?.[e]==="fill"}),t};return{...e,...n,swatchAutoWidth:s()}},getTextVariantTitleData=(o,p,m)=>{let{styles:d,setting:g}=o,{layout:u}=g??{},{labelGap:c}=d??{},{optionName:h,hasPreSelected:y,isChangeVariant:T,selectedOptions:f,styleOptionSelected:x}=m??{},D=t(d?.labelTypo,d?.labelTypography),w=t=>{let e=Object.fromEntries(r.map(e=>[i[e],"horizontal"===a(t,e)?n:s]));return e},b=()=>"Liquid"===p?"{{option.name}}":`${h}${(!1!=y||T)&&"dropdown"!==x?`: ${f?.[h]}`:""}`;return{className:e(D,"Liquid"===p?"{{showVariantClass}}":""),styles:{typo:d?.labelTypo},style:{...l(u,c)},setting:{htmlTag:"legend",text:b(),tagWidth:w(u),excludeFlex:!0}}};export{getDropdownGroupData,getTextVariantTitleData};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/components",
-  "version": "4.0.0-staging.1159",
+  "version": "4.0.0-staging.1162",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",