@anker-in/headless-ui 0.0.27-alpha.36 → 0.0.27-alpha.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/biz-components/ShelfDisplay/index.d.ts +6 -2
- package/dist/cjs/biz-components/ShelfDisplay/index.js +5 -5
- package/dist/cjs/biz-components/ShelfDisplay/index.js.map +3 -3
- package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.d.ts +23 -0
- package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js +2 -0
- package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js.map +7 -0
- package/dist/cjs/cpn-components/CpnBanner/index.d.ts +3 -0
- package/dist/cjs/cpn-components/CpnBanner/index.js +2 -0
- package/dist/cjs/cpn-components/CpnBanner/index.js.map +7 -0
- package/dist/cjs/cpn-components/CpnBanner/types.d.ts +42 -0
- package/dist/cjs/cpn-components/CpnBanner/types.js +2 -0
- package/dist/cjs/cpn-components/CpnBanner/types.js.map +7 -0
- package/dist/cjs/cpn-components/CpnCountDown/index.d.ts +3 -0
- package/dist/cjs/cpn-components/CpnCountDown/index.js +2 -0
- package/dist/cjs/cpn-components/CpnCountDown/index.js.map +7 -0
- package/dist/cjs/cpn-components/CpnCountDown/types.d.ts +28 -0
- package/dist/cjs/cpn-components/CpnCountDown/types.js +2 -0
- package/dist/cjs/cpn-components/CpnCountDown/types.js.map +7 -0
- package/dist/cjs/cpn-components/CpnNavigation/index.d.ts +3 -0
- package/dist/cjs/cpn-components/CpnNavigation/index.js +2 -0
- package/dist/cjs/cpn-components/CpnNavigation/index.js.map +7 -0
- package/dist/cjs/cpn-components/CpnNavigation/types.d.ts +19 -0
- package/dist/cjs/cpn-components/CpnNavigation/types.js +2 -0
- package/dist/cjs/cpn-components/CpnNavigation/types.js.map +7 -0
- package/dist/cjs/cpn-components/CpnProductCard/index.d.ts +3 -0
- package/dist/cjs/cpn-components/CpnProductCard/index.js +2 -0
- package/dist/cjs/cpn-components/CpnProductCard/index.js.map +7 -0
- package/dist/cjs/cpn-components/CpnProductCard/types.d.ts +109 -0
- package/dist/cjs/cpn-components/CpnProductCard/types.js +2 -0
- package/dist/cjs/cpn-components/CpnProductCard/types.js.map +7 -0
- package/dist/cjs/cpn-components/CpnTitle/index.d.ts +3 -0
- package/dist/cjs/cpn-components/CpnTitle/index.js +2 -0
- package/dist/cjs/cpn-components/CpnTitle/index.js.map +7 -0
- package/dist/cjs/cpn-components/CpnTitle/types.d.ts +10 -0
- package/dist/cjs/cpn-components/CpnTitle/types.js +2 -0
- package/dist/cjs/cpn-components/CpnTitle/types.js.map +7 -0
- package/dist/cjs/cpn-components/index.d.ts +5 -0
- package/dist/cjs/cpn-components/index.js +2 -0
- package/dist/cjs/cpn-components/index.js.map +7 -0
- package/dist/cjs/hooks/useCountDown.d.ts +10 -0
- package/dist/cjs/hooks/useCountDown.js +2 -0
- package/dist/cjs/hooks/useCountDown.js.map +7 -0
- package/dist/cjs/stories/cpnBanner.stories.d.ts +14 -0
- package/dist/cjs/stories/cpnBanner.stories.js +2 -0
- package/dist/cjs/stories/cpnBanner.stories.js.map +7 -0
- package/dist/cjs/stories/cpnCountdown.stories.d.ts +12 -0
- package/dist/cjs/stories/cpnCountdown.stories.js +2 -0
- package/dist/cjs/stories/cpnCountdown.stories.js.map +7 -0
- package/dist/cjs/stories/cpnNavigation.stories.d.ts +14 -0
- package/dist/cjs/stories/cpnNavigation.stories.js +2 -0
- package/dist/cjs/stories/cpnNavigation.stories.js.map +7 -0
- package/dist/cjs/stories/cpnProductcard.stories.d.ts +14 -0
- package/dist/cjs/stories/cpnProductcard.stories.js +2 -0
- package/dist/cjs/stories/cpnProductcard.stories.js.map +7 -0
- package/dist/cjs/stories/cpnTitle.stories.d.ts +14 -0
- package/dist/cjs/stories/cpnTitle.stories.js +2 -0
- package/dist/cjs/stories/cpnTitle.stories.js.map +7 -0
- package/dist/cjs/stories/shelfDisplay.stories.js +1 -1
- package/dist/cjs/stories/shelfDisplay.stories.js.map +2 -2
- package/dist/esm/biz-components/ShelfDisplay/index.d.ts +6 -2
- package/dist/esm/biz-components/ShelfDisplay/index.js +3 -3
- package/dist/esm/biz-components/ShelfDisplay/index.js.map +3 -3
- package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.d.ts +23 -0
- package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.js +2 -0
- package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.js.map +7 -0
- package/dist/esm/cpn-components/CpnBanner/index.d.ts +3 -0
- package/dist/esm/cpn-components/CpnBanner/index.js +2 -0
- package/dist/esm/cpn-components/CpnBanner/index.js.map +7 -0
- package/dist/esm/cpn-components/CpnBanner/types.d.ts +42 -0
- package/dist/esm/cpn-components/CpnBanner/types.js +1 -0
- package/dist/esm/cpn-components/CpnBanner/types.js.map +7 -0
- package/dist/esm/cpn-components/CpnCountDown/index.d.ts +3 -0
- package/dist/esm/cpn-components/CpnCountDown/index.js +2 -0
- package/dist/esm/cpn-components/CpnCountDown/index.js.map +7 -0
- package/dist/esm/cpn-components/CpnCountDown/types.d.ts +28 -0
- package/dist/esm/cpn-components/CpnCountDown/types.js +1 -0
- package/dist/esm/cpn-components/CpnCountDown/types.js.map +7 -0
- package/dist/esm/cpn-components/CpnNavigation/index.d.ts +3 -0
- package/dist/esm/cpn-components/CpnNavigation/index.js +2 -0
- package/dist/esm/cpn-components/CpnNavigation/index.js.map +7 -0
- package/dist/esm/cpn-components/CpnNavigation/types.d.ts +19 -0
- package/dist/esm/cpn-components/CpnNavigation/types.js +1 -0
- package/dist/esm/cpn-components/CpnNavigation/types.js.map +7 -0
- package/dist/esm/cpn-components/CpnProductCard/index.d.ts +3 -0
- package/dist/esm/cpn-components/CpnProductCard/index.js +2 -0
- package/dist/esm/cpn-components/CpnProductCard/index.js.map +7 -0
- package/dist/esm/cpn-components/CpnProductCard/types.d.ts +109 -0
- package/dist/esm/cpn-components/CpnProductCard/types.js +1 -0
- package/dist/esm/cpn-components/CpnProductCard/types.js.map +7 -0
- package/dist/esm/cpn-components/CpnTitle/index.d.ts +3 -0
- package/dist/esm/cpn-components/CpnTitle/index.js +2 -0
- package/dist/esm/cpn-components/CpnTitle/index.js.map +7 -0
- package/dist/esm/cpn-components/CpnTitle/types.d.ts +10 -0
- package/dist/esm/cpn-components/CpnTitle/types.js +1 -0
- package/dist/esm/cpn-components/CpnTitle/types.js.map +7 -0
- package/dist/esm/cpn-components/index.d.ts +5 -0
- package/dist/esm/cpn-components/index.js +2 -0
- package/dist/esm/cpn-components/index.js.map +7 -0
- package/dist/esm/hooks/useCountDown.d.ts +10 -0
- package/dist/esm/hooks/useCountDown.js +2 -0
- package/dist/esm/hooks/useCountDown.js.map +7 -0
- package/dist/esm/stories/cpnBanner.stories.d.ts +14 -0
- package/dist/esm/stories/cpnBanner.stories.js +2 -0
- package/dist/esm/stories/cpnBanner.stories.js.map +7 -0
- package/dist/esm/stories/cpnCountdown.stories.d.ts +12 -0
- package/dist/esm/stories/cpnCountdown.stories.js +2 -0
- package/dist/esm/stories/cpnCountdown.stories.js.map +7 -0
- package/dist/esm/stories/cpnNavigation.stories.d.ts +14 -0
- package/dist/esm/stories/cpnNavigation.stories.js +2 -0
- package/dist/esm/stories/cpnNavigation.stories.js.map +7 -0
- package/dist/esm/stories/cpnProductcard.stories.d.ts +14 -0
- package/dist/esm/stories/cpnProductcard.stories.js +2 -0
- package/dist/esm/stories/cpnProductcard.stories.js.map +7 -0
- package/dist/esm/stories/cpnTitle.stories.d.ts +14 -0
- package/dist/esm/stories/cpnTitle.stories.js +2 -0
- package/dist/esm/stories/cpnTitle.stories.js.map +7 -0
- package/dist/esm/stories/shelfDisplay.stories.js +1 -1
- package/dist/esm/stories/shelfDisplay.stories.js.map +2 -2
- package/package.json +11 -1
|
@@ -22,8 +22,8 @@ export interface ShelfDisplayProps {
|
|
|
22
22
|
title?: string;
|
|
23
23
|
isShowTab?: boolean;
|
|
24
24
|
align?: 'left' | 'center' | 'right';
|
|
25
|
-
productsTab?:
|
|
26
|
-
productsCard?:
|
|
25
|
+
productsTab?: any;
|
|
26
|
+
productsCard?: any;
|
|
27
27
|
/** 卡片形状 */
|
|
28
28
|
itemShape?: 'round' | 'square';
|
|
29
29
|
/** 按钮形状 */
|
|
@@ -35,6 +35,10 @@ export interface ShelfDisplayProps {
|
|
|
35
35
|
/** 副按钮配置 */
|
|
36
36
|
secondaryButton?: string;
|
|
37
37
|
};
|
|
38
|
+
buildData?: {
|
|
39
|
+
categories: any[];
|
|
40
|
+
products: any[];
|
|
41
|
+
};
|
|
38
42
|
/** 主题色*/
|
|
39
43
|
theme?: 'light' | 'dark';
|
|
40
44
|
className?: string;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var V=Object.create;var b=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,R=Object.prototype.hasOwnProperty;var U=(e,r)=>{for(var s in r)b(e,s,{get:r[s],enumerable:!0})},w=(e,r,s,l)=>{if(r&&typeof r=="object"||typeof r=="function")for(let a of M(r))!R.call(e,a)&&a!==s&&b(e,a,{get:()=>r[a],enumerable:!(l=q(r,a))||l.enumerable});return e};var f=(e,r,s)=>(s=e!=null?V(L(e)):{},w(r||!e||!e.__esModule?b(s,"default",{value:e,enumerable:!0}):s,e)),$=e=>w(b({},"__esModule",{value:!0}),e);var G={};U(G,{default:()=>_});module.exports=$(G);var t=require("react/jsx-runtime"),m=require("react"),y=require("../../helpers/utils.js"),B=f(require("../../components/picture.js")),d=require("../../components/tabs.js"),g=f(require("../../components/button.js")),N=f(require("../Title/index.js")),T=f(require("../SwiperBox/index.js")),C=require("../../shared/Styles.js"),I=require("./shelfDisplay.js");const j=({data:e,configuration:r})=>{const s=n=>{},l=n=>{},{price:a,basePrice:u}=(0,I.formatVariantPrice)({amount:e?.price.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price.amount||0,currencyCode:e?.price.currencyCode||"USD",locale:"us"}),k=()=>{const n=e?.sku,o=e?.variants;return o?.find(x=>x?.sku===n)?.image?.url||o?.[0]?.image?.url||""};return(0,t.jsxs)("div",{className:(0,y.cn)("desktop:pt-4 desktop:px-6 desktop:pb-6 flex size-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4",r?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[(0,t.jsx)("div",{className:(0,y.cn)("relative mb-2 inline-block h-[137px] overflow-hidden","desktop:mb-3 desktop:h-[195px]"),children:(0,t.jsx)(B.default,{source:k(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),(0,t.jsx)("div",{className:"desktop:mb-2 mb-1 flex h-8 flex-wrap gap-1",children:e?.tags?.slice(0,1)?.map?.((n,o)=>(0,t.jsx)("div",{className:"desktop:text-base rounded-3xl border-2 border-[#00BEFA] px-2 py-1 text-sm font-bold text-[#00BEFA]",children:n},o))}),(0,t.jsx)("p",{title:e?.title||"",className:"desktop:text-2xl line-clamp-2 max-h-[48px] flex-1 text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]",children:e?.title||""}),(0,t.jsx)("h3",{title:e?.description||"",className:"desktop:mt-2 desktop:mb-6 desktop:text-lg mb-5 mt-1 truncate text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]",children:e?.description||""}),(0,t.jsxs)("div",{className:"mb-2 flex items-center",children:[(0,t.jsx)("div",{className:"desktop:text-2xl text-xl font-bold text-[#1D1D1F]",children:a||""}),(0,t.jsx)("div",{className:"desktop:text-2xl ml-1 text-xl font-bold text-[#86868C]",children:u||""})]}),(0,t.jsxs)("div",{className:"flex items-center gap-3",children:[(0,t.jsx)(g.default,{variant:"primary",onClick:()=>s(e),className:`
|
|
2
2
|
laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border
|
|
3
3
|
border-[#1D1D1F] bg-transparent px-4 py-2 text-xs tracking-[-0.04em] text-[#1D1D1F] hover:bg-transparent hover:text-black
|
|
4
|
-
${
|
|
5
|
-
`,children:
|
|
4
|
+
${r?.shape==="round"?"desktop:rounded-3xl rounded-[20px]":""}
|
|
5
|
+
`,children:r?.primaryButton||""}),(0,t.jsx)(g.default,{variant:"secondary",onClick:()=>l(e),className:`
|
|
6
6
|
laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border
|
|
7
7
|
border-[#1D1D1F] bg-[#1D1D1F] px-4 py-2 text-xs tracking-[-0.04em] text-white
|
|
8
|
-
${
|
|
9
|
-
`,children:
|
|
8
|
+
${r?.shape==="round"?"desktop:rounded-3xl rounded-[20px]":""}
|
|
9
|
+
`,children:r?.secondaryButton||""})]})]},e?.id||e?.handle)},z=({data:e,buildData:r,className:s="",key:l})=>{const[a,u]=(0,m.useState)(""),[k,n]=(0,m.useState)([]),{productsTab:o=[],productsCard:v=[],title:x,align:P="left",isShowTab:D=!0,tabShape:F="square",...A}=e,h=i=>{const c=i?.map(p=>{const S=r?.products?.find(E=>E?.handle===p?.handle);if(S)return{sku:p.sku,...S}})?.filter(p=>p);n(c)};return(0,m.useEffect)(()=>{if(D){u(o?.[0]?.tab||""),h(o?.[0]?.data||[]);return}h(v)},[]),(0,t.jsxs)("div",{className:(0,y.cn)("w-full",s),children:[x&&(0,t.jsx)(N.default,{data:{title:x}}),D&&(0,t.jsx)(d.Tabs,{shape:F,align:P,value:a,onValueChange:i=>{u(i);const c=o?.find(p=>p?.tab===i);h(c?.data||[])},className:"mb-8",children:(0,t.jsx)(d.TabsList,{children:o?.map((i,c)=>(0,t.jsx)(d.TabsTrigger,{value:i?.tab||"",children:i?.tab},c))})}),(0,t.jsx)(T.default,{className:"!overflow-visible",id:"ShelfDisplay"+l,data:{list:k,configuration:{...A}},Slide:j,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.3},768:{spaceBetween:"16px",freeMode:!1,slidesPerView:4}}})]})};var _=(0,C.withStyles)(z);
|
|
10
10
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/ShelfDisplay/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport {
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
6
|
-
"names": ["ShelfDisplay_exports", "__export", "ShelfDisplay_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_tabs", "import_button", "import_Title", "import_SwiperBox", "import_Styles", "
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nexport interface ShelfDisplayItem {\n id?: string\n /** \u4EA7\u54C1\u56FE\u7247*/\n img?: {\n url: string\n }\n handle?: string\n sku?: string\n /** \u6298\u6263\u540E\u4EF7\u683C*/\n price?: string\n title?: string\n /** \u6298\u6263\u524D\u4EF7\u683C*/\n basePrice?: string\n subTitle?: string\n /** \u6807\u7B7E*/\n tagItems?: string[]\n tab?: string\n data?: ShelfDisplayItem[]\n}\n\nexport interface ShelfDisplayProps {\n data: {\n title?: string\n isShowTab?: boolean\n align?: 'left' | 'center' | 'right'\n productsTab?: any\n productsCard?: any\n /** \u5361\u7247\u5F62\u72B6 */\n itemShape?: 'round' | 'square'\n /** \u6309\u94AE\u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n tabShape?: 'rounded' | 'square'\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton?: string\n /** \u526F\u6309\u94AE\u914D\u7F6E */\n secondaryButton?: string\n }\n buildData?: {\n categories: any[]\n products: any[]\n }\n /** \u4E3B\u9898\u8272*/\n theme?: 'light' | 'dark'\n className?: string\n /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: {\n primaryButton?: {\n onClick: (v: any) => void\n }\n secondaryButton?: {\n onClick: (v: any) => void\n }\n }\n key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const onPrimaryButton = (params: ShelfDisplayItem) => {\n // event?.primaryButton?.onClick?.(params)\n }\n\n const onSecondaryButton = (params: ShelfDisplayItem) => {\n // event?.secondaryButton?.onClick(params)\n }\n\n const { price, basePrice } = formatVariantPrice({\n amount: data?.price.amount || 0,\n baseAmount: data?.compareAtPrice?.amount || data?.price.amount || 0,\n currencyCode: data?.price.currencyCode || 'USD',\n locale: 'us',\n })\n\n const handleUrl = () => {\n const sku = data?.sku\n const skuArray = data?.variants\n const findSku = skuArray?.find((item: any) => item?.sku === sku)\n return findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n }\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n 'desktop:pt-4 desktop:px-6 desktop:pb-6 flex size-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4',\n configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n )}\n >\n <div className={cn('relative mb-2 inline-block h-[137px] overflow-hidden', 'desktop:mb-3 desktop:h-[195px]')}>\n <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n </div>\n <div className=\"desktop:mb-2 mb-1 flex h-8 flex-wrap gap-1\">\n {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n return (\n <div\n key={index}\n className=\"desktop:text-base rounded-3xl border-2 border-[#00BEFA] px-2 py-1 text-sm font-bold text-[#00BEFA]\"\n >\n {item}\n </div>\n )\n })}\n </div>\n <p\n title={data?.title || ''}\n className=\"desktop:text-2xl line-clamp-2 max-h-[48px] flex-1 text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]\"\n >\n {data?.title || ''}\n </p>\n <h3\n title={data?.description || ''}\n className=\"desktop:mt-2 desktop:mb-6 desktop:text-lg mb-5 mt-1 truncate text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]\"\n >\n {data?.description || ''}\n </h3>\n <div className=\"mb-2 flex items-center\">\n <div className=\"desktop:text-2xl text-xl font-bold text-[#1D1D1F]\">{price || ''}</div>\n <div className=\"desktop:text-2xl ml-1 text-xl font-bold text-[#86868C]\">{basePrice || ''}</div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"flex items-center gap-3\">\n <Button\n variant=\"primary\"\n onClick={() => onPrimaryButton(data)}\n className={`\n laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border\n border-[#1D1D1F] bg-transparent px-4 py-2 text-xs tracking-[-0.04em] text-[#1D1D1F] hover:bg-transparent hover:text-black\n ${configuration?.shape === 'round' ? 'desktop:rounded-3xl rounded-[20px]' : ''}\n `}\n >\n {configuration?.primaryButton || ''}\n </Button>\n <Button\n variant=\"secondary\"\n onClick={() => onSecondaryButton(data)}\n className={`\n laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border\n border-[#1D1D1F] bg-[#1D1D1F] px-4 py-2 text-xs tracking-[-0.04em] text-white\n ${configuration?.shape === 'round' ? 'desktop:rounded-3xl rounded-[20px]' : ''}\n `}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n </div>\n </div>\n )\n}\n\nconst ShelfDisplay: React.FC<ShelfDisplayProps> = ({ data, buildData, className = '', key }) => {\n const [tabId, setTabId] = useState<string>('')\n const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n const {\n productsTab = [],\n productsCard = [],\n title,\n align = 'left',\n isShowTab = true,\n tabShape = 'square',\n ...other\n } = data\n\n const handleCurrentTab = (currentData: ShelfDisplayItem[]) => {\n const newCurrentData = currentData\n ?.map(item => {\n const findData = buildData?.products?.find(params => params?.handle === item?.handle)\n if (findData) {\n return {\n sku: item.sku,\n ...findData,\n }\n }\n })\n ?.filter(item => item)\n setCurrentItems(newCurrentData)\n }\n\n useEffect(() => {\n if (isShowTab) {\n setTabId(productsTab?.[0]?.tab || '')\n handleCurrentTab(productsTab?.[0]?.data || [])\n return\n }\n handleCurrentTab(productsCard)\n }, [])\n\n return (\n <div className={cn('w-full', className)}>\n {title && <Title data={{ title: title }} />}\n {isShowTab && (\n <Tabs\n shape={tabShape}\n align={align}\n value={tabId}\n onValueChange={v => {\n setTabId(v)\n const findData = productsTab?.find((item: any) => item?.tab === v)\n handleCurrentTab(findData?.data || [])\n }}\n className=\"mb-8\"\n >\n <TabsList>\n {productsTab?.map((item: any, index: number) => {\n return (\n <TabsTrigger key={index} value={item?.tab || ''}>\n {item?.tab}\n </TabsTrigger>\n )\n })}\n </TabsList>\n </Tabs>\n )}\n <SwiperBox\n className=\"!overflow-visible\"\n id={'ShelfDisplay' + key}\n data={{ list: currentItems, configuration: { ...other } }}\n Slide={ShelfDisplayItem}\n breakpoints={{\n 0: {\n spaceBetween: '12px',\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: '12px',\n freeMode: false,\n slidesPerView: 1.3,\n },\n 768: {\n spaceBetween: '16px',\n freeMode: false,\n slidesPerView: 4,\n },\n }}\n />\n </div>\n )\n}\n\nexport default withStyles(ShelfDisplay)\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmGQ,IAAAI,EAAA,6BAlGRC,EAA2C,iBAC3CC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAA4C,oCAC5CC,EAAmB,yCACnBC,EAAkB,gCAClBC,EAAsB,oCACtBC,EAA2B,kCAC3BC,EAAmC,6BA0DnC,MAAMC,EAAmB,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAA0C,CACxF,MAAMC,EAAmBC,GAA6B,CAEtD,EAEMC,EAAqBD,GAA6B,CAExD,EAEM,CAAE,MAAAE,EAAO,UAAAC,CAAU,KAAI,sBAAmB,CAC9C,OAAQN,GAAM,MAAM,QAAU,EAC9B,WAAYA,GAAM,gBAAgB,QAAUA,GAAM,MAAM,QAAU,EAClE,aAAcA,GAAM,MAAM,cAAgB,MAC1C,OAAQ,IACV,CAAC,EAEKO,EAAY,IAAM,CACtB,MAAMC,EAAMR,GAAM,IACZS,EAAWT,GAAM,SAEvB,OADgBS,GAAU,KAAMC,GAAcA,GAAM,MAAQF,CAAG,GAC/C,OAAO,KAAOC,IAAW,CAAC,GAAG,OAAO,KAAO,EAC7D,EAEA,SACE,QAAC,OAEC,aAAW,MACT,iHACAR,GAAe,YAAc,QAAU,cAAgB,cACzD,EAEA,oBAAC,OAAI,aAAW,MAAG,uDAAwD,gCAAgC,EACzG,mBAAC,EAAAU,QAAA,CAAQ,OAAQJ,EAAU,EAAG,UAAU,yDAAyD,EACnG,KACA,OAAC,OAAI,UAAU,6CACZ,SAAAP,GAAM,MAAM,MAAM,EAAG,CAAC,GAAG,MAAM,CAACU,EAAWE,OAExC,OAAC,OAEC,UAAU,qGAET,SAAAF,GAHIE,CAIP,CAEH,EACH,KACA,OAAC,KACC,MAAOZ,GAAM,OAAS,GACtB,UAAU,sHAET,SAAAA,GAAM,OAAS,GAClB,KACA,OAAC,MACC,MAAOA,GAAM,aAAe,GAC5B,UAAU,qIAET,SAAAA,GAAM,aAAe,GACxB,KACA,QAAC,OAAI,UAAU,yBACb,oBAAC,OAAI,UAAU,oDAAqD,SAAAK,GAAS,GAAG,KAChF,OAAC,OAAI,UAAU,yDAA0D,SAAAC,GAAa,GAAG,GAC3F,KAEA,QAAC,OAAI,UAAU,0BACb,oBAAC,EAAAO,QAAA,CACC,QAAQ,UACR,QAAS,IAAMX,EAAgBF,CAAI,EACnC,UAAW;AAAA;AAAA;AAAA,cAGPC,GAAe,QAAU,QAAU,qCAAuC,EAAE;AAAA,YAG/E,SAAAA,GAAe,eAAiB,GACnC,KACA,OAAC,EAAAY,QAAA,CACC,QAAQ,YACR,QAAS,IAAMT,EAAkBJ,CAAI,EACrC,UAAW;AAAA;AAAA;AAAA,cAGPC,GAAe,QAAU,QAAU,qCAAuC,EAAE;AAAA,YAG/E,SAAAA,GAAe,iBAAmB,GACrC,GACF,IA7DKD,GAAM,IAAMA,GAAM,MA8DzB,CAEJ,EAEMc,EAA4C,CAAC,CAAE,KAAAd,EAAM,UAAAe,EAAW,UAAAC,EAAY,GAAI,IAAAC,CAAI,IAAM,CAC9F,KAAM,CAACC,EAAOC,CAAQ,KAAI,YAAiB,EAAE,EACvC,CAACC,EAAcC,CAAe,KAAI,YAA6B,CAAC,CAAC,EAEjE,CACJ,YAAAC,EAAc,CAAC,EACf,aAAAC,EAAe,CAAC,EAChB,MAAAC,EACA,MAAAC,EAAQ,OACR,UAAAC,EAAY,GACZ,SAAAC,EAAW,SACX,GAAGC,CACL,EAAI5B,EAEE6B,EAAoBC,GAAoC,CAC5D,MAAMC,EAAiBD,GACnB,IAAIpB,GAAQ,CACZ,MAAMsB,EAAWjB,GAAW,UAAU,KAAKZ,GAAUA,GAAQ,SAAWO,GAAM,MAAM,EACpF,GAAIsB,EACF,MAAO,CACL,IAAKtB,EAAK,IACV,GAAGsB,CACL,CAEJ,CAAC,GACC,OAAOtB,GAAQA,CAAI,EACvBW,EAAgBU,CAAc,CAChC,EAEA,sBAAU,IAAM,CACd,GAAIL,EAAW,CACbP,EAASG,IAAc,CAAC,GAAG,KAAO,EAAE,EACpCO,EAAiBP,IAAc,CAAC,GAAG,MAAQ,CAAC,CAAC,EAC7C,MACF,CACAO,EAAiBN,CAAY,CAC/B,EAAG,CAAC,CAAC,KAGH,QAAC,OAAI,aAAW,MAAG,SAAUP,CAAS,EACnC,UAAAQ,MAAS,OAAC,EAAAS,QAAA,CAAM,KAAM,CAAE,MAAOT,CAAM,EAAG,EACxCE,MACC,OAAC,QACC,MAAOC,EACP,MAAOF,EACP,MAAOP,EACP,cAAegB,GAAK,CAClBf,EAASe,CAAC,EACV,MAAMF,EAAWV,GAAa,KAAMZ,GAAcA,GAAM,MAAQwB,CAAC,EACjEL,EAAiBG,GAAU,MAAQ,CAAC,CAAC,CACvC,EACA,UAAU,OAEV,mBAAC,YACE,SAAAV,GAAa,IAAI,CAACZ,EAAWE,OAE1B,OAAC,eAAwB,MAAOF,GAAM,KAAO,GAC1C,SAAAA,GAAM,KADSE,CAElB,CAEH,EACH,EACF,KAEF,OAAC,EAAAuB,QAAA,CACC,UAAU,oBACV,GAAI,eAAiBlB,EACrB,KAAM,CAAE,KAAMG,EAAc,cAAe,CAAE,GAAGQ,CAAM,CAAE,EACxD,MAAO7B,EACP,YAAa,CACX,EAAG,CACD,aAAc,OACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,GACF,CAEJ,EAEA,IAAOZ,KAAQ,cAAW2B,CAAY",
|
|
6
|
+
"names": ["ShelfDisplay_exports", "__export", "ShelfDisplay_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_tabs", "import_button", "import_Title", "import_SwiperBox", "import_Styles", "import_shelfDisplay", "ShelfDisplayItem", "data", "configuration", "onPrimaryButton", "params", "onSecondaryButton", "price", "basePrice", "handleUrl", "sku", "skuArray", "item", "Picture", "index", "Button", "ShelfDisplay", "buildData", "className", "key", "tabId", "setTabId", "currentItems", "setCurrentItems", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "Title", "v", "SwiperBox"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
export declare const PRICE_SYMBOL: any;
|
|
2
|
+
export declare const languageTerritory: (locale: string) => string;
|
|
3
|
+
export declare function formatPrice({ amount, currencyCode, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
|
|
4
|
+
amount: number;
|
|
5
|
+
currencyCode: string;
|
|
6
|
+
locale: string;
|
|
7
|
+
maximumFractionDigits?: number;
|
|
8
|
+
minimumFractionDigits?: number;
|
|
9
|
+
removeTrailingZeros?: boolean;
|
|
10
|
+
}): string;
|
|
11
|
+
export declare function formatVariantPrice({ amount, baseAmount, currencyCode, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
|
|
12
|
+
baseAmount: number;
|
|
13
|
+
amount: number;
|
|
14
|
+
currencyCode: string;
|
|
15
|
+
locale: string;
|
|
16
|
+
maximumFractionDigits?: number;
|
|
17
|
+
minimumFractionDigits?: number;
|
|
18
|
+
removeTrailingZeros?: boolean;
|
|
19
|
+
}): {
|
|
20
|
+
price: string;
|
|
21
|
+
basePrice: string | undefined;
|
|
22
|
+
discount: string | null;
|
|
23
|
+
};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var o=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var D=(r,e)=>{for(var t in e)o(r,t,{get:e[t],enumerable:!0})},F=(r,e,t,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of $(e))!y.call(r,i)&&i!==t&&o(r,i,{get:()=>e[i],enumerable:!(n=p(e,i))||n.enumerable});return r};var v=r=>F(o({},"__esModule",{value:!0}),r);var P={};D(P,{PRICE_SYMBOL:()=>c,formatPrice:()=>f,formatVariantPrice:()=>x,languageTerritory:()=>m});module.exports=v(P);const c={us:"$",uk:"\xA3",ca:"$",eu:"\u20AC",fr:"\u20AC",de:"\u20AC",vn:"\u20AB",cl:"$",sg:"$",ae:"AED"},m=r=>({us:"en-us",uk:"en-gb",ca:"en-ca",au:"en-au",eu:"en",fr:"fr-fr",de:"de-de",vn:"vi-vn",sg:"en-sg","ae-en":"ae-en",plus:"en-us",cl:"es-cl"})[r]||"";function f({amount:r,currencyCode:e,locale:t,maximumFractionDigits:n,minimumFractionDigits:i,removeTrailingZeros:s=!1}){let u=new Intl.NumberFormat(m(t),{style:"currency",currency:e||"USD",minimumFractionDigits:n===0?0:i,maximumFractionDigits:n}).format(r);return["eu-de","eu-en","de","eu"].includes(t)&&(u=u?.toString()?.replace(/[\s]/g,"")),s&&(u=u.replace(/(\.\d*?[1-9])0+\b/,"$1").replace(/\.0+\b/,"").replace(/(\,\d*?[1-9])0+\b/,"$1").replace(/\,0+\b/,"")),u}function x({amount:r,baseAmount:e,currencyCode:t,locale:n,maximumFractionDigits:i,minimumFractionDigits:s,removeTrailingZeros:a}){if(typeof Intl>"u")return{price:`${c[n]}${r}`,basePrice:`${c[n]}${e}`,discount:`${c[n]}${e-r||0}`};const u=e>r,g=new Intl.NumberFormat(m(n),{style:"percent"}),d=u?g.format((e-r)/e):null,l=f({amount:r,currencyCode:t,locale:n,removeTrailingZeros:a}),b=u?f({amount:e,currencyCode:t,locale:n,maximumFractionDigits:i,minimumFractionDigits:s,removeTrailingZeros:a}):void 0;return{price:l,basePrice:b,discount:d}}
|
|
2
|
+
//# sourceMappingURL=shelfDisplay.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/biz-components/ShelfDisplay/shelfDisplay.ts"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable no-useless-escape */\nexport const PRICE_SYMBOL = {\n us: '$',\n uk: '\u00A3',\n ca: '$',\n eu: '\u20AC',\n fr: '\u20AC',\n de: '\u20AC',\n vn: '\u20AB',\n cl: '$',\n sg: '$',\n ae: 'AED',\n} as any\n\nexport const languageTerritory = (locale: string) =>\n // https://unicode-org.github.io/cldr-staging/charts/37/supplemental/language_territory_information.html\n ({\n us: 'en-us',\n uk: 'en-gb',\n ca: 'en-ca',\n au: 'en-au',\n eu: 'en',\n fr: 'fr-fr',\n de: 'de-de',\n vn: 'vi-vn',\n sg: 'en-sg',\n 'ae-en': 'ae-en',\n plus: 'en-us',\n cl: 'es-cl',\n })[locale] || ''\n\nexport function formatPrice({\n amount,\n currencyCode,\n locale,\n maximumFractionDigits,\n minimumFractionDigits,\n removeTrailingZeros = false,\n}: {\n amount: number\n currencyCode: string\n locale: string\n maximumFractionDigits?: number\n minimumFractionDigits?: number\n removeTrailingZeros?: boolean\n}) {\n const formatCurrency = new Intl.NumberFormat(languageTerritory(locale), {\n style: 'currency',\n currency: currencyCode || 'USD',\n minimumFractionDigits: maximumFractionDigits === 0 ? 0 : minimumFractionDigits,\n maximumFractionDigits,\n })\n\n let formattedValue = formatCurrency.format(amount)\n\n if (['eu-de', 'eu-en', 'de', 'eu'].includes(locale)) {\n formattedValue = formattedValue?.toString()?.replace(/[\\s]/g, '')\n }\n\n if (removeTrailingZeros) {\n // Adjust the regex to match comma as decimal separator\n formattedValue = formattedValue\n .replace(/(\\.\\d*?[1-9])0+\\b/, '$1')\n .replace(/\\.0+\\b/, '')\n .replace(/(\\,\\d*?[1-9])0+\\b/, '$1')\n .replace(/\\,0+\\b/, '')\n }\n\n return formattedValue\n}\n\nexport function formatVariantPrice({\n amount,\n baseAmount,\n currencyCode,\n locale,\n maximumFractionDigits,\n minimumFractionDigits,\n removeTrailingZeros,\n}: {\n baseAmount: number\n amount: number\n currencyCode: string\n locale: string\n maximumFractionDigits?: number\n minimumFractionDigits?: number\n removeTrailingZeros?: boolean\n}) {\n if (typeof Intl === 'undefined') {\n return {\n price: `${PRICE_SYMBOL[locale]}${amount}`,\n basePrice: `${PRICE_SYMBOL[locale]}${baseAmount}`,\n discount: `${PRICE_SYMBOL[locale]}${baseAmount - amount || 0}`,\n }\n }\n\n const hasDiscount = baseAmount > amount\n const formatDiscount = new Intl.NumberFormat(languageTerritory(locale), {\n style: 'percent',\n })\n const discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n\n const price = formatPrice({ amount, currencyCode, locale, removeTrailingZeros })\n const basePrice = hasDiscount\n ? formatPrice({\n amount: baseAmount,\n currencyCode,\n locale,\n maximumFractionDigits,\n minimumFractionDigits,\n removeTrailingZeros,\n })\n : undefined\n\n return { price, basePrice, discount }\n}\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,kBAAAE,EAAA,gBAAAC,EAAA,uBAAAC,EAAA,sBAAAC,IAAA,eAAAC,EAAAN,GACO,MAAME,EAAe,CAC1B,GAAI,IACJ,GAAI,OACJ,GAAI,IACJ,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,GAAI,IACJ,GAAI,IACJ,GAAI,KACN,EAEaG,EAAqBE,IAE/B,CACC,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,KACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,QAAS,QACT,KAAM,QACN,GAAI,OACN,GAAGA,CAAM,GAAK,GAET,SAASJ,EAAY,CAC1B,OAAAK,EACA,aAAAC,EACA,OAAAF,EACA,sBAAAG,EACA,sBAAAC,EACA,oBAAAC,EAAsB,EACxB,EAOG,CAQD,IAAIC,EAPmB,IAAI,KAAK,aAAaR,EAAkBE,CAAM,EAAG,CACtE,MAAO,WACP,SAAUE,GAAgB,MAC1B,sBAAuBC,IAA0B,EAAI,EAAIC,EACzD,sBAAAD,CACF,CAAC,EAEmC,OAAOF,CAAM,EAEjD,MAAI,CAAC,QAAS,QAAS,KAAM,IAAI,EAAE,SAASD,CAAM,IAChDM,EAAiBA,GAAgB,SAAS,GAAG,QAAQ,QAAS,EAAE,GAG9DD,IAEFC,EAAiBA,EACd,QAAQ,oBAAqB,IAAI,EACjC,QAAQ,SAAU,EAAE,EACpB,QAAQ,oBAAqB,IAAI,EACjC,QAAQ,SAAU,EAAE,GAGlBA,CACT,CAEO,SAAST,EAAmB,CACjC,OAAAI,EACA,WAAAM,EACA,aAAAL,EACA,OAAAF,EACA,sBAAAG,EACA,sBAAAC,EACA,oBAAAC,CACF,EAQG,CACD,GAAI,OAAO,KAAS,IAClB,MAAO,CACL,MAAO,GAAGV,EAAaK,CAAM,CAAC,GAAGC,CAAM,GACvC,UAAW,GAAGN,EAAaK,CAAM,CAAC,GAAGO,CAAU,GAC/C,SAAU,GAAGZ,EAAaK,CAAM,CAAC,GAAGO,EAAaN,GAAU,CAAC,EAC9D,EAGF,MAAMO,EAAcD,EAAaN,EAC3BQ,EAAiB,IAAI,KAAK,aAAaX,EAAkBE,CAAM,EAAG,CACtE,MAAO,SACT,CAAC,EACKU,EAAWF,EAAcC,EAAe,QAAQF,EAAaN,GAAUM,CAAU,EAAI,KAErFI,EAAQf,EAAY,CAAE,OAAAK,EAAQ,aAAAC,EAAc,OAAAF,EAAQ,oBAAAK,CAAoB,CAAC,EACzEO,EAAYJ,EACdZ,EAAY,CACV,OAAQW,EACR,aAAAL,EACA,OAAAF,EACA,sBAAAG,EACA,sBAAAC,EACA,oBAAAC,CACF,CAAC,EACD,OAEJ,MAAO,CAAE,MAAAM,EAAO,UAAAC,EAAW,SAAAF,CAAS,CACtC",
|
|
6
|
+
"names": ["shelfDisplay_exports", "__export", "PRICE_SYMBOL", "formatPrice", "formatVariantPrice", "languageTerritory", "__toCommonJS", "locale", "amount", "currencyCode", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "formattedValue", "baseAmount", "hasDiscount", "formatDiscount", "discount", "price", "basePrice"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var w=Object.create;var m=Object.defineProperty;var k=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,h=Object.prototype.hasOwnProperty;var N=(n,a)=>{for(var o in a)m(n,o,{get:a[o],enumerable:!0})},x=(n,a,o,b)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of g(a))!h.call(n,i)&&i!==o&&m(n,i,{get:()=>a[i],enumerable:!(b=k(a,i))||b.enumerable});return n};var B=(n,a,o)=>(o=n!=null?w(y(n)):{},x(a||!n||!n.__esModule?m(o,"default",{value:n,enumerable:!0}):o,n)),C=n=>x(m({},"__esModule",{value:!0}),n);var P={};N(P,{default:()=>z});module.exports=C(P);var e=require("react/jsx-runtime"),s=require("../../helpers/utils.js"),c=require("../../components/index.js"),d=B(require("../CpnCountDown/index.js"));const j=n=>{const{id:a,image:o,imageMob:b,imageLink:i,content:f=[],cns:l}=n,u=t=>{if(t?.startsWith("http")&&(location.href=t),t?.startsWith("#")){const r=document.querySelector(t);r&&r.scrollIntoView({behavior:"smooth"})}};return(0,e.jsxs)("div",{id:a,className:(0,s.cn)("cpn-banner-container relative w-full",l?.container),children:[(0,e.jsx)(c.Picture,{loading:"eager",source:`${o}, ${b||o} 768`,className:(0,s.cn)("cpn-banner-picture",l?.picture),imgClassName:(0,s.cn)("cpn-banner-image h-full object-cover",l?.image),alt:""}),i&&(0,e.jsx)("a",{href:i,className:"absolute left-0 top-0 z-[1] size-full"}),(0,e.jsx)("div",{className:(0,s.cn)("cpn-banner-box tablet:flex tablet:flex-col tablet:justify-center tablet:pt-0 tablet:text-left absolute left-0 top-0 size-full pt-10 text-center",l?.box),children:(0,e.jsx)("div",{className:"tablet:px-10 desktop:px-20 px-6",children:(0,e.jsx)("div",{className:(0,s.cn)("cpn-banner-content tablet:mx-0 tablet:max-w-[40vw] mx-auto max-w-[70vw]",l?.content),children:f?.map((t,r)=>{switch(t.type){case"subheading":return(0,e.jsx)(c.Text,{as:"div",html:t.text,className:(0,s.cn)("cpn-banner-subheading tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium",l?.subheading)},r);case"title":return(0,e.jsx)(c.Text,{as:"div",html:t.text,className:(0,s.cn)("cpn-banner-title tablet:mt-5 tablet:text-[2.7vw] lg-desktop:text-[56px] mt-4 text-[32px] font-bold leading-[1.12]",l?.title)},r);case"subtitle":return(0,e.jsx)(c.Text,{as:"div",html:t.text,className:(0,s.cn)("cpn-banner-subtitle tablet:mt-5 tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium",l?.subtitle)},r);case"button":return(0,e.jsx)("div",{className:(0,s.cn)("cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center",l?.buttonBox),children:(0,e.jsx)(c.Button,{className:(0,s.cn)("cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5",l?.button,t.cns),onClick:t.onClick?t.onClick:()=>u(t.target||""),children:t.text},r)});case"buttons":return(0,e.jsx)("div",{className:(0,s.cn)("cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center",l?.buttonBox),children:t.buttons.map((p,v)=>(0,e.jsx)(c.Button,{className:(0,s.cn)("cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5",l?.button,p.cns),onClick:p.onClick?p.onClick:()=>u(p.target||""),children:p.text},v))});case"countdown":return(0,e.jsx)("div",{className:"cpn-banner-countdown tablet:mt-6 tablet:justify-start mt-4 flex justify-center",children:(0,e.jsx)(d.default,{endTime:t.endTime,copy:t.copy,cns:l?.countdown})},r)}})})})})]})};var z=j;
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnBanner/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import type { BannerProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Picture, Text, Button } from '../../components/index.js'\nimport CountDown from '../CpnCountDown/index.js'\n\nconst CpnBanner = (props: BannerProps) => {\n const { id, image, imageMob, imageLink, content = [], cns } = props\n\n const btnClick = (target: string) => {\n if (target?.startsWith('http')) {\n location.href = target\n }\n if (target?.startsWith('#')) {\n const element = document.querySelector(target)\n if (element) {\n element.scrollIntoView({ behavior: 'smooth' })\n }\n }\n }\n\n return (\n <div id={id} className={cn('cpn-banner-container relative w-full', cns?.container)}>\n <Picture\n loading=\"eager\"\n source={`${image}, ${imageMob || image} 768`}\n className={cn('cpn-banner-picture', cns?.picture)}\n imgClassName={cn('cpn-banner-image h-full object-cover', cns?.image)}\n alt=\"\"\n />\n {imageLink && <a href={imageLink} className=\"absolute left-0 top-0 z-[1] size-full\"></a>}\n <div\n className={cn(\n 'cpn-banner-box tablet:flex tablet:flex-col tablet:justify-center tablet:pt-0 tablet:text-left absolute left-0 top-0 size-full pt-10 text-center',\n cns?.box\n )}\n >\n <div className=\"tablet:px-10 desktop:px-20 px-6\">\n <div className={cn('cpn-banner-content tablet:mx-0 tablet:max-w-[40vw] mx-auto max-w-[70vw]', cns?.content)}>\n {content?.map((item, index) => {\n switch (item.type) {\n case 'subheading':\n return (\n <Text\n key={index}\n as=\"div\"\n html={item.text}\n className={cn(\n 'cpn-banner-subheading tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium',\n cns?.subheading\n )}\n />\n )\n case 'title':\n return (\n <Text\n key={index}\n as=\"div\"\n html={item.text}\n className={cn(\n 'cpn-banner-title tablet:mt-5 tablet:text-[2.7vw] lg-desktop:text-[56px] mt-4 text-[32px] font-bold leading-[1.12]',\n cns?.title\n )}\n />\n )\n case 'subtitle':\n return (\n <Text\n key={index}\n as=\"div\"\n html={item.text}\n className={cn(\n 'cpn-banner-subtitle tablet:mt-5 tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium',\n cns?.subtitle\n )}\n />\n )\n case 'button':\n return (\n <div\n className={cn(\n 'cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center',\n cns?.buttonBox\n )}\n >\n <Button\n key={index}\n className={cn(\n 'cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5',\n cns?.button,\n item.cns\n )}\n onClick={item.onClick ? item.onClick : () => btnClick(item.target || '')}\n >\n {item.text}\n </Button>\n </div>\n )\n case 'buttons':\n return (\n <div\n className={cn(\n 'cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center',\n cns?.buttonBox\n )}\n >\n {item.buttons.map((button, index) => (\n <Button\n key={index}\n className={cn(\n 'cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5',\n cns?.button,\n button.cns\n )}\n onClick={button.onClick ? button.onClick : () => btnClick(button.target || '')}\n >\n {button.text}\n </Button>\n ))}\n </div>\n )\n case 'countdown':\n return (\n <div\n key={index}\n className=\"cpn-banner-countdown tablet:mt-6 tablet:justify-start mt-4 flex justify-center\"\n >\n <CountDown endTime={item.endTime} copy={item.copy} cns={cns?.countdown} />\n </div>\n )\n }\n })}\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default CpnBanner\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqBI,IAAAI,EAAA,6BApBJC,EAAmB,kCACnBC,EAAsC,qCACtCC,EAAsB,uCAEtB,MAAMC,EAAaC,GAAuB,CACxC,KAAM,CAAE,GAAAC,EAAI,MAAAC,EAAO,SAAAC,EAAU,UAAAC,EAAW,QAAAC,EAAU,CAAC,EAAG,IAAAC,CAAI,EAAIN,EAExDO,EAAYC,GAAmB,CAInC,GAHIA,GAAQ,WAAW,MAAM,IAC3B,SAAS,KAAOA,GAEdA,GAAQ,WAAW,GAAG,EAAG,CAC3B,MAAMC,EAAU,SAAS,cAAcD,CAAM,EACzCC,GACFA,EAAQ,eAAe,CAAE,SAAU,QAAS,CAAC,CAEjD,CACF,EAEA,SACE,QAAC,OAAI,GAAIR,EAAI,aAAW,MAAG,uCAAwCK,GAAK,SAAS,EAC/E,oBAAC,WACC,QAAQ,QACR,OAAQ,GAAGJ,CAAK,KAAKC,GAAYD,CAAK,OACtC,aAAW,MAAG,qBAAsBI,GAAK,OAAO,EAChD,gBAAc,MAAG,uCAAwCA,GAAK,KAAK,EACnE,IAAI,GACN,EACCF,MAAa,OAAC,KAAE,KAAMA,EAAW,UAAU,wCAAwC,KACpF,OAAC,OACC,aAAW,MACT,kJACAE,GAAK,GACP,EAEA,mBAAC,OAAI,UAAU,kCACb,mBAAC,OAAI,aAAW,MAAG,0EAA2EA,GAAK,OAAO,EACvG,SAAAD,GAAS,IAAI,CAACK,EAAMC,IAAU,CAC7B,OAAQD,EAAK,KAAM,CACjB,IAAK,aACH,SACE,OAAC,QAEC,GAAG,MACH,KAAMA,EAAK,KACX,aAAW,MACT,qFACAJ,GAAK,UACP,GANKK,CAOP,EAEJ,IAAK,QACH,SACE,OAAC,QAEC,GAAG,MACH,KAAMD,EAAK,KACX,aAAW,MACT,oHACAJ,GAAK,KACP,GANKK,CAOP,EAEJ,IAAK,WACH,SACE,OAAC,QAEC,GAAG,MACH,KAAMD,EAAK,KACX,aAAW,MACT,+FACAJ,GAAK,QACP,GANKK,CAOP,EAEJ,IAAK,SACH,SACE,OAAC,OACC,aAAW,MACT,iFACAL,GAAK,SACP,EAEA,mBAAC,UAEC,aAAW,MACT,qIACAA,GAAK,OACLI,EAAK,GACP,EACA,QAASA,EAAK,QAAUA,EAAK,QAAU,IAAMH,EAASG,EAAK,QAAU,EAAE,EAEtE,SAAAA,EAAK,MARDC,CASP,EACF,EAEJ,IAAK,UACH,SACE,OAAC,OACC,aAAW,MACT,iFACAL,GAAK,SACP,EAEC,SAAAI,EAAK,QAAQ,IAAI,CAACE,EAAQD,OACzB,OAAC,UAEC,aAAW,MACT,qIACAL,GAAK,OACLM,EAAO,GACT,EACA,QAASA,EAAO,QAAUA,EAAO,QAAU,IAAML,EAASK,EAAO,QAAU,EAAE,EAE5E,SAAAA,EAAO,MARHD,CASP,CACD,EACH,EAEJ,IAAK,YACH,SACE,OAAC,OAEC,UAAU,iFAEV,mBAAC,EAAAE,QAAA,CAAU,QAASH,EAAK,QAAS,KAAMA,EAAK,KAAM,IAAKJ,GAAK,UAAW,GAHnEK,CAIP,CAEN,CACF,CAAC,EACH,EACF,EACF,GACF,CAEJ,EAEA,IAAOlB,EAAQM",
|
|
6
|
+
"names": ["CpnBanner_exports", "__export", "CpnBanner_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_components", "import_CpnCountDown", "CpnBanner", "props", "id", "image", "imageMob", "imageLink", "content", "cns", "btnClick", "target", "element", "item", "index", "button", "CountDown"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import type { CountDownProps } from '../CpnCountDown/types';
|
|
2
|
+
type TextType = 'title' | 'subtitle' | 'subheading';
|
|
3
|
+
type TextContent = {
|
|
4
|
+
type: TextType;
|
|
5
|
+
text: string;
|
|
6
|
+
};
|
|
7
|
+
type ButtonContent = {
|
|
8
|
+
type: 'button';
|
|
9
|
+
text: string;
|
|
10
|
+
target?: string;
|
|
11
|
+
cns?: string;
|
|
12
|
+
onClick?: () => void;
|
|
13
|
+
};
|
|
14
|
+
type ButtonsContent = {
|
|
15
|
+
type: 'buttons';
|
|
16
|
+
buttons: Omit<ButtonContent, 'type'>[];
|
|
17
|
+
};
|
|
18
|
+
type CountDownContent = {
|
|
19
|
+
type: 'countdown';
|
|
20
|
+
} & CountDownProps;
|
|
21
|
+
type BannerContent = TextContent | ButtonContent | ButtonsContent | CountDownContent;
|
|
22
|
+
export type BannerProps = {
|
|
23
|
+
id?: string;
|
|
24
|
+
image: string;
|
|
25
|
+
imageMob?: string;
|
|
26
|
+
imageLink?: string;
|
|
27
|
+
content?: BannerContent[];
|
|
28
|
+
cns?: {
|
|
29
|
+
container?: string;
|
|
30
|
+
picture?: string;
|
|
31
|
+
image?: string;
|
|
32
|
+
box?: string;
|
|
33
|
+
content?: string;
|
|
34
|
+
subheading?: string;
|
|
35
|
+
title?: string;
|
|
36
|
+
subtitle?: string;
|
|
37
|
+
buttonBox?: string;
|
|
38
|
+
button?: string;
|
|
39
|
+
countdown?: CountDownProps['cns'];
|
|
40
|
+
};
|
|
41
|
+
};
|
|
42
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var i=Object.defineProperty;var r=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var u=(n,t,s,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of g(t))!p.call(n,e)&&e!==s&&i(n,e,{get:()=>t[e],enumerable:!(o=r(t,e))||o.enumerable});return n};var C=n=>u(i({},"__esModule",{value:!0}),n);var y={};module.exports=C(y);
|
|
2
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnBanner/types.ts"],
|
|
4
|
+
"sourcesContent": ["import type { CountDownProps } from '../CpnCountDown/types'\n\ntype TextType = 'title' | 'subtitle' | 'subheading'\n\ntype TextContent = {\n type: TextType\n text: string\n}\n\ninterface BaseType {\n text?: string\n target?: string\n end?: string\n copy?: CountDownProps['copy']\n}\n\ntype ButtonContent = {\n type: 'button'\n text: string\n target?: string\n cns?: string\n onClick?: () => void\n}\n\ntype ButtonsContent = {\n type: 'buttons'\n buttons: Omit<ButtonContent, 'type'>[]\n}\n\ntype CountDownContent = {\n type: 'countdown'\n} & CountDownProps\n\ntype BannerContent = TextContent | ButtonContent | ButtonsContent | CountDownContent\n\nexport type BannerProps = {\n id?: string\n image: string\n imageMob?: string\n imageLink?: string\n content?: BannerContent[]\n cns?: {\n container?: string\n picture?: string\n image?: string\n box?: string\n content?: string\n subheading?: string\n title?: string\n subtitle?: string\n buttonBox?: string\n button?: string\n countdown?: CountDownProps['cns']\n }\n}\n"],
|
|
5
|
+
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
|
+
"names": ["types_exports", "__toCommonJS"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var x=Object.create;var l=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var w=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var g=(t,n)=>{for(var o in n)l(t,o,{get:n[o],enumerable:!0})},m=(t,n,o,c)=>{if(n&&typeof n=="object"||typeof n=="function")for(let p of b(n))!y.call(t,p)&&p!==o&&l(t,p,{get:()=>n[p],enumerable:!(c=v(n,p))||c.enumerable});return t};var N=(t,n,o)=>(o=t!=null?x(w(t)):{},m(n||!t||!t.__esModule?l(o,"default",{value:t,enumerable:!0}):o,t)),z=t=>m(l({},"__esModule",{value:!0}),t);var P={};g(P,{default:()=>h});module.exports=z(P);var e=require("react/jsx-runtime"),s=require("../../helpers/utils.js"),r=require("../../components/index.js"),u=N(require("../../hooks/useCountDown.js"));const a=({time:t,copy:n,image:o,cns:c})=>(0,e.jsx)(e.Fragment,{children:t?(0,e.jsxs)("div",{className:(0,s.cn)("cpn-countdown-item laptop:size-[54px] tablet:size-[3.2vw] relative size-[34px] rounded bg-black",c?.item),children:[o&&(0,e.jsx)(r.Picture,{className:(0,s.cn)("cpn-countdown-picture absolute left-0 top-0 size-full",c?.picture),imgClassName:(0,s.cn)("cpn-countdown-image h-full object-cover",c?.image),source:`${o}`}),(0,e.jsx)("div",{className:(0,s.cn)("cpn-countdown-time tablet:text-[1.25vw] laptop:text-[24px] absolute left-0 top-0 flex size-full items-center justify-center text-[16px] font-[600] text-white",c?.time),children:t}),n&&(0,e.jsx)("div",{className:(0,s.cn)("cpn-countdown-copy tablet:text-[12px] laptop:text-[14px] tablet:-bottom-6 absolute -bottom-4 left-1/2 -translate-x-1/2 text-[9px] font-medium",c?.copy),children:n})]}):(0,e.jsx)("div",{className:(0,s.cn)("cpn-countdown-colonBox relative flex flex-col gap-1",c?.colonBox),children:Array.from({length:2}).map((p,i)=>(0,e.jsx)("span",{className:(0,s.cn)("cpn-countdown-colon size-1 rounded-full bg-black",c?.colon)},i))})}),C=t=>{const{endTime:n,copy:o,cns:c}=t,{days:p,hours:i,minutes:d,seconds:f}=(0,u.default)({endTime:n});return(0,e.jsxs)("div",{className:(0,s.cn)("cpn-countdown-container laptop:gap-4 relative flex items-center justify-center gap-2",{"mb-5":o?.days},c?.container),children:[(0,e.jsx)(a,{time:p,copy:o?.days,cns:c}),(0,e.jsx)(a,{}),(0,e.jsx)(a,{time:i,copy:o?.hours,cns:c}),(0,e.jsx)(a,{}),(0,e.jsx)(a,{time:d,copy:o?.minutes,cns:c}),(0,e.jsx)(a,{}),(0,e.jsx)(a,{time:f,copy:o?.seconds,cns:c})]})};var h=C;
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnCountDown/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import type { CountDownProps, ItemProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Picture } from '../../components/index.js'\nimport useCountDown from '../../hooks/useCountDown.js'\n\nconst Item = ({ time, copy, image, cns }: ItemProps) => (\n <>\n {time ? (\n <div\n className={cn(\n 'cpn-countdown-item laptop:size-[54px] tablet:size-[3.2vw] relative size-[34px] rounded bg-black',\n cns?.item\n )}\n >\n {image && (\n <Picture\n className={cn('cpn-countdown-picture absolute left-0 top-0 size-full', cns?.picture)}\n imgClassName={cn('cpn-countdown-image h-full object-cover', cns?.image)}\n source={`${image}`}\n />\n )}\n <div\n className={cn(\n 'cpn-countdown-time tablet:text-[1.25vw] laptop:text-[24px] absolute left-0 top-0 flex size-full items-center justify-center text-[16px] font-[600] text-white',\n cns?.time\n )}\n >\n {time}\n </div>\n {copy && (\n <div\n className={cn(\n 'cpn-countdown-copy tablet:text-[12px] laptop:text-[14px] tablet:-bottom-6 absolute -bottom-4 left-1/2 -translate-x-1/2 text-[9px] font-medium',\n cns?.copy\n )}\n >\n {copy}\n </div>\n )}\n </div>\n ) : (\n <div className={cn('cpn-countdown-colonBox relative flex flex-col gap-1', cns?.colonBox)}>\n {Array.from({ length: 2 }).map((_, index) => (\n <span key={index} className={cn('cpn-countdown-colon size-1 rounded-full bg-black', cns?.colon)}></span>\n ))}\n </div>\n )}\n </>\n)\n\nconst CpnCountDown = (props: CountDownProps) => {\n const { endTime, copy, cns } = props\n\n const { days, hours, minutes, seconds } = useCountDown({ endTime })\n\n return (\n <div\n className={cn(\n 'cpn-countdown-container laptop:gap-4 relative flex items-center justify-center gap-2',\n {\n 'mb-5': copy?.days,\n },\n cns?.container\n )}\n >\n <Item time={days} copy={copy?.days} cns={cns} />\n <Item />\n <Item time={hours} copy={copy?.hours} cns={cns} />\n <Item />\n <Item time={minutes} copy={copy?.minutes} cns={cns} />\n <Item />\n <Item time={seconds} copy={copy?.seconds} cns={cns} />\n </div>\n )\n}\n\nexport default CpnCountDown\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAME,IAAAI,EAAA,6BALFC,EAAmB,kCACnBC,EAAwB,qCACxBC,EAAyB,0CAEzB,MAAMC,EAAO,CAAC,CAAE,KAAAC,EAAM,KAAAC,EAAM,MAAAC,EAAO,IAAAC,CAAI,OACrC,mBACG,SAAAH,KACC,QAAC,OACC,aAAW,MACT,kGACAG,GAAK,IACP,EAEC,UAAAD,MACC,OAAC,WACC,aAAW,MAAG,wDAAyDC,GAAK,OAAO,EACnF,gBAAc,MAAG,0CAA2CA,GAAK,KAAK,EACtE,OAAQ,GAAGD,CAAK,GAClB,KAEF,OAAC,OACC,aAAW,MACT,gKACAC,GAAK,IACP,EAEC,SAAAH,EACH,EACCC,MACC,OAAC,OACC,aAAW,MACT,gJACAE,GAAK,IACP,EAEC,SAAAF,EACH,GAEJ,KAEA,OAAC,OAAI,aAAW,MAAG,sDAAuDE,GAAK,QAAQ,EACpF,eAAM,KAAK,CAAE,OAAQ,CAAE,CAAC,EAAE,IAAI,CAACC,EAAGC,OACjC,OAAC,QAAiB,aAAW,MAAG,mDAAoDF,GAAK,KAAK,GAAnFE,CAAsF,CAClG,EACH,EAEJ,EAGIC,EAAgBC,GAA0B,CAC9C,KAAM,CAAE,QAAAC,EAAS,KAAAP,EAAM,IAAAE,CAAI,EAAII,EAEzB,CAAE,KAAAE,EAAM,MAAAC,EAAO,QAAAC,EAAS,QAAAC,CAAQ,KAAI,EAAAC,SAAa,CAAE,QAAAL,CAAQ,CAAC,EAElE,SACE,QAAC,OACC,aAAW,MACT,uFACA,CACE,OAAQP,GAAM,IAChB,EACAE,GAAK,SACP,EAEA,oBAACJ,EAAA,CAAK,KAAMU,EAAM,KAAMR,GAAM,KAAM,IAAKE,EAAK,KAC9C,OAACJ,EAAA,EAAK,KACN,OAACA,EAAA,CAAK,KAAMW,EAAO,KAAMT,GAAM,MAAO,IAAKE,EAAK,KAChD,OAACJ,EAAA,EAAK,KACN,OAACA,EAAA,CAAK,KAAMY,EAAS,KAAMV,GAAM,QAAS,IAAKE,EAAK,KACpD,OAACJ,EAAA,EAAK,KACN,OAACA,EAAA,CAAK,KAAMa,EAAS,KAAMX,GAAM,QAAS,IAAKE,EAAK,GACtD,CAEJ,EAEA,IAAOV,EAAQa",
|
|
6
|
+
"names": ["CpnCountDown_exports", "__export", "CpnCountDown_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_components", "import_useCountDown", "Item", "time", "copy", "image", "cns", "_", "index", "CpnCountDown", "props", "endTime", "days", "hours", "minutes", "seconds", "useCountDown"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
type Cns = {
|
|
2
|
+
container?: string;
|
|
3
|
+
item?: string;
|
|
4
|
+
picture?: string;
|
|
5
|
+
image?: string;
|
|
6
|
+
time?: string;
|
|
7
|
+
copy?: string;
|
|
8
|
+
colonBox?: string;
|
|
9
|
+
colon?: string;
|
|
10
|
+
};
|
|
11
|
+
type Copy = {
|
|
12
|
+
days?: string;
|
|
13
|
+
hours?: string;
|
|
14
|
+
minutes?: string;
|
|
15
|
+
seconds?: string;
|
|
16
|
+
};
|
|
17
|
+
export type CountDownProps = {
|
|
18
|
+
endTime?: string;
|
|
19
|
+
copy?: Copy;
|
|
20
|
+
cns?: Cns;
|
|
21
|
+
};
|
|
22
|
+
export type ItemProps = {
|
|
23
|
+
time?: string;
|
|
24
|
+
copy?: string;
|
|
25
|
+
image?: string;
|
|
26
|
+
cns?: Cns;
|
|
27
|
+
};
|
|
28
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var r=Object.defineProperty;var e=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var c=(t,n,o,i)=>{if(n&&typeof n=="object"||typeof n=="function")for(let s of g(n))!p.call(t,s)&&s!==o&&r(t,s,{get:()=>n[s],enumerable:!(i=e(n,s))||i.enumerable});return t};var y=t=>c(r({},"__esModule",{value:!0}),t);var m={};module.exports=y(m);
|
|
2
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnCountDown/types.ts"],
|
|
4
|
+
"sourcesContent": ["type Cns = {\n container?: string\n item?: string\n picture?: string\n image?: string\n time?: string\n copy?: string\n colonBox?: string\n colon?: string\n}\n\ntype Copy = {\n days?: string\n hours?: string\n minutes?: string\n seconds?: string\n}\n\nexport type CountDownProps = {\n endTime?: string\n copy?: Copy\n cns?: Cns\n}\n\nexport type ItemProps = {\n time?: string\n copy?: string\n image?: string\n cns?: Cns\n}\n"],
|
|
5
|
+
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
|
+
"names": ["types_exports", "__toCommonJS"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var y=Object.create;var s=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,R=Object.prototype.hasOwnProperty;var S=(e,t)=>{for(var o in t)s(e,o,{get:t[o],enumerable:!0})},h=(e,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of N(t))!R.call(e,n)&&n!==o&&s(e,n,{get:()=>t[n],enumerable:!(a=E(t,n))||a.enumerable});return e};var k=(e,t,o)=>(o=e!=null?y(I(e)):{},h(t||!e||!e.__esModule?s(o,"default",{value:e,enumerable:!0}):o,e)),H=e=>h(s({},"__esModule",{value:!0}),e);var $={};S($,{default:()=>T});module.exports=H($);var f=require("react/jsx-runtime"),l=require("react"),v=require("../../helpers/utils.js"),g=k(require("lodash.debounce"));const L=e=>{const{lists:t,styles:o,cns:a,offset:n=0}=e,[x,d]=(0,l.useState)(0),u=(0,l.useRef)(null),C=r=>{r.scrollIntoView({behavior:"smooth",inline:"center"})},w=(r,c,i)=>{d(c);const p=i.target;C(p),r.anchor&&document.querySelector(`#${r.anchor}`)?.scrollIntoView({behavior:"smooth"}),i.preventDefault()};return(0,l.useEffect)(()=>{const r=(0,g.default)(()=>{const i=[];t?.forEach(m=>{const b=document.querySelector(`#${m.anchor}`);b&&i.push(b.getBoundingClientRect().top)});const p=i.findIndex(m=>m>c+n)-1;d(p)},100),c=u.current?.getBoundingClientRect().height||0;return window.addEventListener("scroll",r),()=>{window.removeEventListener("scroll",r)}},[t,n]),(0,f.jsx)("div",{id:"nav",className:(0,v.cn)("cpn-nav-container sticky top-0 z-10 w-full bg-[var(--bgColor)]",a?.container),style:{"--bgColor":o?.bgColor||"#C6F1FF","--color":o?.color||"#333","--activeColor":o?.activeColor||"#000"},children:(0,f.jsx)("div",{className:(0,v.cn)("cpn-nav-box relative flex items-center justify-start gap-[18px] overflow-scroll px-6 text-center [&::-webkit-scrollbar]:hidden","tablet:gap-[80px] tablet:justify-center",a?.box),ref:u,children:t?.map((r,c)=>(0,f.jsx)("a",{href:`#${r.anchor}`,className:(0,v.cn)("cpn-nav-item relative cursor-pointer whitespace-nowrap py-[14px] text-[16px] font-medium leading-[1.2] text-[var(--color)] transition-all duration-200",a?.item,{[`border-[var(--activeColor)] text-[var(--activeColor)] after:absolute after:bottom-0 after:left-0 after:h-[2px] after:w-full after:bg-[var(--activeColor)] after:transition-all after:duration-200 after:content-[""] ${a?.activeItem}`]:x===c}),onClick:i=>w(r,c,i),children:r.label},r.label))})})};var T=L;
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnNavigation/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import React, { useEffect, useRef, useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport type { Nav, NavigationProps } from './types.js'\nimport debounce from 'lodash.debounce'\n\nconst CpnNavigation = (props: NavigationProps) => {\n const { lists, styles, cns, offset = 0 } = props\n const [activeIndex, setActiveIndex] = useState(0)\n const navBox = useRef<HTMLDivElement>(null)\n\n const scrollIntoView = (ele: HTMLElement) => {\n ele.scrollIntoView({ behavior: 'smooth', inline: 'center' })\n }\n\n const handleNavItemClick = (nav: Nav, index: number, e: React.SyntheticEvent<EventTarget>) => {\n setActiveIndex(index)\n const ele = e.target as HTMLAnchorElement\n scrollIntoView(ele)\n if (nav.anchor) {\n document.querySelector(`#${nav.anchor}`)?.scrollIntoView({ behavior: 'smooth' })\n }\n e.preventDefault()\n }\n\n useEffect(() => {\n const scrollHandler = debounce(() => {\n const sectionTops: number[] = []\n lists?.forEach(nav => {\n const section = document.querySelector(`#${nav.anchor}`)\n if (section) {\n sectionTops.push(section.getBoundingClientRect().top)\n }\n })\n const index = sectionTops.findIndex(sectionTop => sectionTop > navHeight + offset) - 1\n setActiveIndex(index)\n }, 100)\n const navHeight = navBox.current?.getBoundingClientRect().height || 0\n window.addEventListener('scroll', scrollHandler)\n return () => {\n window.removeEventListener('scroll', scrollHandler)\n }\n }, [lists, offset])\n\n return (\n <div\n id=\"nav\"\n className={cn('cpn-nav-container sticky top-0 z-10 w-full bg-[var(--bgColor)]', cns?.container)}\n style={\n {\n '--bgColor': styles?.bgColor || '#C6F1FF',\n '--color': styles?.color || '#333',\n '--activeColor': styles?.activeColor || '#000',\n } as React.CSSProperties\n }\n >\n <div\n className={cn(\n 'cpn-nav-box relative flex items-center justify-start gap-[18px] overflow-scroll px-6 text-center [&::-webkit-scrollbar]:hidden',\n 'tablet:gap-[80px] tablet:justify-center',\n cns?.box\n )}\n ref={navBox}\n >\n {lists?.map((nav, index) => {\n return (\n <a\n key={nav.label}\n href={`#${nav.anchor}`}\n className={cn(\n 'cpn-nav-item relative cursor-pointer whitespace-nowrap py-[14px] text-[16px] font-medium leading-[1.2] text-[var(--color)] transition-all duration-200',\n cns?.item,\n {\n [`border-[var(--activeColor)] text-[var(--activeColor)] after:absolute after:bottom-0 after:left-0 after:h-[2px] after:w-full after:bg-[var(--activeColor)] after:transition-all after:duration-200 after:content-[\"\"] ${cns?.activeItem}`]:\n activeIndex === index,\n }\n )}\n onClick={e => handleNavItemClick(nav, index, e)}\n >\n {nav.label}\n </a>\n )\n })}\n </div>\n </div>\n )\n}\n\nexport default CpnNavigation\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAiEY,IAAAI,EAAA,6BAjEZC,EAAmD,iBACnDC,EAAmB,kCAEnBC,EAAqB,8BAErB,MAAMC,EAAiBC,GAA2B,CAChD,KAAM,CAAE,MAAAC,EAAO,OAAAC,EAAQ,IAAAC,EAAK,OAAAC,EAAS,CAAE,EAAIJ,EACrC,CAACK,EAAaC,CAAc,KAAI,YAAS,CAAC,EAC1CC,KAAS,UAAuB,IAAI,EAEpCC,EAAkBC,GAAqB,CAC3CA,EAAI,eAAe,CAAE,SAAU,SAAU,OAAQ,QAAS,CAAC,CAC7D,EAEMC,EAAqB,CAACC,EAAUC,EAAeC,IAAyC,CAC5FP,EAAeM,CAAK,EACpB,MAAMH,EAAMI,EAAE,OACdL,EAAeC,CAAG,EACdE,EAAI,QACN,SAAS,cAAc,IAAIA,EAAI,MAAM,EAAE,GAAG,eAAe,CAAE,SAAU,QAAS,CAAC,EAEjFE,EAAE,eAAe,CACnB,EAEA,sBAAU,IAAM,CACd,MAAMC,KAAgB,EAAAC,SAAS,IAAM,CACnC,MAAMC,EAAwB,CAAC,EAC/Bf,GAAO,QAAQU,GAAO,CACpB,MAAMM,EAAU,SAAS,cAAc,IAAIN,EAAI,MAAM,EAAE,EACnDM,GACFD,EAAY,KAAKC,EAAQ,sBAAsB,EAAE,GAAG,CAExD,CAAC,EACD,MAAML,EAAQI,EAAY,UAAUE,GAAcA,EAAaC,EAAYf,CAAM,EAAI,EACrFE,EAAeM,CAAK,CACtB,EAAG,GAAG,EACAO,EAAYZ,EAAO,SAAS,sBAAsB,EAAE,QAAU,EACpE,cAAO,iBAAiB,SAAUO,CAAa,EACxC,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAa,CACpD,CACF,EAAG,CAACb,EAAOG,CAAM,CAAC,KAGhB,OAAC,OACC,GAAG,MACH,aAAW,MAAG,iEAAkED,GAAK,SAAS,EAC9F,MACE,CACE,YAAaD,GAAQ,SAAW,UAChC,UAAWA,GAAQ,OAAS,OAC5B,gBAAiBA,GAAQ,aAAe,MAC1C,EAGF,mBAAC,OACC,aAAW,MACT,iIACA,0CACAC,GAAK,GACP,EACA,IAAKI,EAEJ,SAAAN,GAAO,IAAI,CAACU,EAAKC,OAEd,OAAC,KAEC,KAAM,IAAID,EAAI,MAAM,GACpB,aAAW,MACT,yJACAR,GAAK,KACL,CACE,CAAC,wNAAwNA,GAAK,UAAU,EAAE,EACxOE,IAAgBO,CACpB,CACF,EACA,QAASC,GAAKH,EAAmBC,EAAKC,EAAOC,CAAC,EAE7C,SAAAF,EAAI,OAZAA,EAAI,KAaX,CAEH,EACH,EACF,CAEJ,EAEA,IAAOlB,EAAQM",
|
|
6
|
+
"names": ["CpnNavigation_exports", "__export", "CpnNavigation_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_lodash", "CpnNavigation", "props", "lists", "styles", "cns", "offset", "activeIndex", "setActiveIndex", "navBox", "scrollIntoView", "ele", "handleNavItemClick", "nav", "index", "e", "scrollHandler", "debounce", "sectionTops", "section", "sectionTop", "navHeight"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
type Cns = {
|
|
2
|
+
container?: string;
|
|
3
|
+
box?: string;
|
|
4
|
+
item?: string;
|
|
5
|
+
activeItem?: string;
|
|
6
|
+
};
|
|
7
|
+
export interface Nav {
|
|
8
|
+
label: string;
|
|
9
|
+
anchor: string;
|
|
10
|
+
}
|
|
11
|
+
export type NavigationProps = {
|
|
12
|
+
lists: Nav[];
|
|
13
|
+
styles?: {
|
|
14
|
+
[key: string]: string;
|
|
15
|
+
};
|
|
16
|
+
cns?: Cns;
|
|
17
|
+
offset?: number;
|
|
18
|
+
};
|
|
19
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var i=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var o=Object.prototype.hasOwnProperty;var c=(n,t,r,e)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of g(t))!o.call(n,s)&&s!==r&&i(n,s,{get:()=>t[s],enumerable:!(e=a(t,s))||e.enumerable});return n};var p=n=>c(i({},"__esModule",{value:!0}),n);var l={};module.exports=p(l);
|
|
2
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnNavigation/types.ts"],
|
|
4
|
+
"sourcesContent": ["type Cns = {\n container?: string\n box?: string\n item?: string\n activeItem?: string\n}\n\nexport interface Nav {\n label: string\n anchor: string\n}\n\nexport type NavigationProps = {\n lists: Nav[]\n styles?: {\n [key: string]: string\n }\n cns?: Cns\n offset?: number\n}\n"],
|
|
5
|
+
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
|
+
"names": ["types_exports", "__toCommonJS"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var p=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var u=(a,t)=>{for(var o in t)p(a,o,{get:t[o],enumerable:!0})},v=(a,t,o,e)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of d(t))!x.call(a,r)&&r!==o&&p(a,r,{get:()=>t[r],enumerable:!(e=i(t,r))||e.enumerable});return a};var f=a=>v(p({},"__esModule",{value:!0}),a);var g={};u(g,{default:()=>b});module.exports=f(g);var s=require("react/jsx-runtime"),l=require("../../helpers/utils.js"),c=require("../../components/index.js");const N=a=>{const{content:t,cns:o}=a;return(0,s.jsx)("div",{className:(0,l.cn)("cpn-card-container relative box-border w-[177px] px-2 pb-3 pt-4 text-center",o?.container),children:t?.map((e,r)=>{switch(e.type){case"tag":return(0,s.jsx)(c.Text,{as:"div",html:e.text},r);case"image":return(0,s.jsx)(c.Picture,{source:`${e.image}, ${e.imageMob||e.image} 768`,className:(0,l.cn)("mx-auto h-[100px]"),imgClassName:(0,l.cn)("h-full object-cover")},r);case"title":return(0,s.jsx)(c.Text,{as:"div",html:e.text,className:(0,l.cn)("text-[14px] font-semibold text-[#333]")},r);case"price":return(0,s.jsx)("div",{className:"mt-3",children:(0,s.jsx)(c.Text,{html:`${e.text}`,className:(0,l.cn)("text-[14px] font-semibold text-[#333]")})});case"buttons":return(0,s.jsx)("div",{className:"mt-2 flex flex-col gap-2",children:e.buttons?.map((n,m)=>(0,s.jsx)(c.Button,{variant:n.variant,className:"w-full",onClick:n.onClick,children:n.text},m))})}})})};var b=N;
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnProductCard/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport type { ProductCardProps } from './types.js'\nimport { Button, Picture, Text } from '../../components/index.js'\n\nconst CpnProductCard = (props: ProductCardProps) => {\n const { content, cns } = props\n\n return (\n <div className={cn('cpn-card-container relative box-border w-[177px] px-2 pb-3 pt-4 text-center', cns?.container)}>\n {content?.map((item, index) => {\n switch (item.type) {\n case 'tag':\n return <Text key={index} as=\"div\" html={item.text} />\n case 'image':\n return (\n <Picture\n key={index}\n source={`${item.image}, ${item.imageMob || item.image} 768`}\n className={cn('mx-auto h-[100px]')}\n imgClassName={cn('h-full object-cover')}\n />\n )\n case 'title':\n return (\n <Text key={index} as=\"div\" html={item.text} className={cn('text-[14px] font-semibold text-[#333]')} />\n )\n case 'price':\n return (\n <div className=\"mt-3\">\n <Text html={`${item.text}`} className={cn('text-[14px] font-semibold text-[#333]')} />\n </div>\n )\n case 'buttons':\n return (\n <div className=\"mt-2 flex flex-col gap-2\">\n {item.buttons?.map((button, index) => (\n <Button key={index} variant={button.variant} className=\"w-full\" onClick={button.onClick}>\n {button.text}\n </Button>\n ))}\n </div>\n )\n }\n })}\n </div>\n )\n}\n\nexport default CpnProductCard\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAYmB,IAAAI,EAAA,6BAZnBC,EAAmB,kCAEnBC,EAAsC,qCAEtC,MAAMC,EAAkBC,GAA4B,CAClD,KAAM,CAAE,QAAAC,EAAS,IAAAC,CAAI,EAAIF,EAEzB,SACE,OAAC,OAAI,aAAW,MAAG,8EAA+EE,GAAK,SAAS,EAC7G,SAAAD,GAAS,IAAI,CAACE,EAAMC,IAAU,CAC7B,OAAQD,EAAK,KAAM,CACjB,IAAK,MACH,SAAO,OAAC,QAAiB,GAAG,MAAM,KAAMA,EAAK,MAA3BC,CAAiC,EACrD,IAAK,QACH,SACE,OAAC,WAEC,OAAQ,GAAGD,EAAK,KAAK,KAAKA,EAAK,UAAYA,EAAK,KAAK,OACrD,aAAW,MAAG,mBAAmB,EACjC,gBAAc,MAAG,qBAAqB,GAHjCC,CAIP,EAEJ,IAAK,QACH,SACE,OAAC,QAAiB,GAAG,MAAM,KAAMD,EAAK,KAAM,aAAW,MAAG,uCAAuC,GAAtFC,CAAyF,EAExG,IAAK,QACH,SACE,OAAC,OAAI,UAAU,OACb,mBAAC,QAAK,KAAM,GAAGD,EAAK,IAAI,GAAI,aAAW,MAAG,uCAAuC,EAAG,EACtF,EAEJ,IAAK,UACH,SACE,OAAC,OAAI,UAAU,2BACZ,SAAAA,EAAK,SAAS,IAAI,CAACE,EAAQD,OAC1B,OAAC,UAAmB,QAASC,EAAO,QAAS,UAAU,SAAS,QAASA,EAAO,QAC7E,SAAAA,EAAO,MADGD,CAEb,CACD,EACH,CAEN,CACF,CAAC,EACH,CAEJ,EAEA,IAAOV,EAAQK",
|
|
6
|
+
"names": ["CpnProductCard_exports", "__export", "CpnProductCard_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_components", "CpnProductCard", "props", "content", "cns", "item", "index", "button"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
export type ProductImage = {
|
|
2
|
+
url: string;
|
|
3
|
+
altText?: string;
|
|
4
|
+
width?: number;
|
|
5
|
+
height?: number;
|
|
6
|
+
};
|
|
7
|
+
export type ProductPrice = {
|
|
8
|
+
value: number;
|
|
9
|
+
currencyCode?: 'USD' | 'EUR' | 'ARS' | string;
|
|
10
|
+
retailPrice?: number;
|
|
11
|
+
salePrice?: number;
|
|
12
|
+
listPrice?: number;
|
|
13
|
+
extendedSalePrice?: number;
|
|
14
|
+
extendedListPrice?: number;
|
|
15
|
+
};
|
|
16
|
+
export type ProductOption = {
|
|
17
|
+
__typename?: 'MultipleChoiceOption';
|
|
18
|
+
id: string;
|
|
19
|
+
displayName: string;
|
|
20
|
+
name?: string;
|
|
21
|
+
values: ProductOptionValues[];
|
|
22
|
+
};
|
|
23
|
+
export type ProductOptionValues = {
|
|
24
|
+
label: string;
|
|
25
|
+
hexColors?: string[];
|
|
26
|
+
};
|
|
27
|
+
export type SellingPlans = {
|
|
28
|
+
id: string;
|
|
29
|
+
name: string;
|
|
30
|
+
options: {
|
|
31
|
+
name: string;
|
|
32
|
+
value: string;
|
|
33
|
+
}[];
|
|
34
|
+
};
|
|
35
|
+
export type SellingPlanGroups = {
|
|
36
|
+
name: string;
|
|
37
|
+
sellingPlans: SellingPlans[];
|
|
38
|
+
};
|
|
39
|
+
export type SellingPlanAllocations = {
|
|
40
|
+
priceAdjustments: [];
|
|
41
|
+
sellingPlan: SellingPlans;
|
|
42
|
+
}[];
|
|
43
|
+
export type ProductVariant = {
|
|
44
|
+
barcode?: string;
|
|
45
|
+
id: string | number;
|
|
46
|
+
options: ProductOption[];
|
|
47
|
+
availableForSale?: boolean;
|
|
48
|
+
quantityAvailable: number;
|
|
49
|
+
metafields?: Record<string, any>;
|
|
50
|
+
sellingPlanAllocations?: SellingPlanAllocations;
|
|
51
|
+
price: number;
|
|
52
|
+
weight?: number;
|
|
53
|
+
name?: string;
|
|
54
|
+
image?: ProductImage;
|
|
55
|
+
requiresShipping?: boolean;
|
|
56
|
+
[key: string]: any;
|
|
57
|
+
};
|
|
58
|
+
export type Product = {
|
|
59
|
+
availableForSale?: boolean;
|
|
60
|
+
id: string;
|
|
61
|
+
name: string;
|
|
62
|
+
description: string;
|
|
63
|
+
descriptionHtml?: string;
|
|
64
|
+
productType?: string;
|
|
65
|
+
onlineStoreUrl?: string | null;
|
|
66
|
+
publishedAt?: string;
|
|
67
|
+
title?: string;
|
|
68
|
+
slug?: string;
|
|
69
|
+
handle?: string;
|
|
70
|
+
path?: string;
|
|
71
|
+
images: ProductImage[];
|
|
72
|
+
variants: ProductVariant[];
|
|
73
|
+
price: ProductPrice;
|
|
74
|
+
listPrice?: number;
|
|
75
|
+
options: ProductOption[];
|
|
76
|
+
seo?: any;
|
|
77
|
+
tags?: string[];
|
|
78
|
+
metafields?: {
|
|
79
|
+
[key: string]: any;
|
|
80
|
+
};
|
|
81
|
+
vendor: string;
|
|
82
|
+
totalInventory: number;
|
|
83
|
+
requiresSellingPlan: boolean;
|
|
84
|
+
sellingPlanGroups: SellingPlanGroups[];
|
|
85
|
+
};
|
|
86
|
+
type Cns = {
|
|
87
|
+
container?: string;
|
|
88
|
+
box?: string;
|
|
89
|
+
item?: string;
|
|
90
|
+
activeItem?: string;
|
|
91
|
+
};
|
|
92
|
+
type ContentType = 'tag' | 'image' | 'title' | 'subtitle' | 'price' | 'buttons' | 'code';
|
|
93
|
+
interface Content {
|
|
94
|
+
type: ContentType;
|
|
95
|
+
text?: string;
|
|
96
|
+
image?: string;
|
|
97
|
+
imageMob?: string;
|
|
98
|
+
url?: string;
|
|
99
|
+
buttons?: {
|
|
100
|
+
text: string;
|
|
101
|
+
variant?: "primary" | "secondary";
|
|
102
|
+
onClick?: () => void;
|
|
103
|
+
}[];
|
|
104
|
+
}
|
|
105
|
+
export type ProductCardProps = {
|
|
106
|
+
content?: Content[];
|
|
107
|
+
cns?: Cns;
|
|
108
|
+
};
|
|
109
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var r=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var o=Object.prototype.hasOwnProperty;var g=(t,e,s,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of l(e))!o.call(t,n)&&n!==s&&r(t,n,{get:()=>e[n],enumerable:!(i=a(e,n))||i.enumerable});return t};var p=t=>g(r({},"__esModule",{value:!0}),t);var c={};module.exports=p(c);
|
|
2
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/cpn-components/CpnProductCard/types.ts"],
|
|
4
|
+
"sourcesContent": ["export type ProductImage = {\n url: string\n altText?: string\n width?: number\n height?: number\n}\n\nexport type ProductPrice = {\n value: number\n currencyCode?: 'USD' | 'EUR' | 'ARS' | string\n retailPrice?: number\n salePrice?: number\n listPrice?: number\n extendedSalePrice?: number\n extendedListPrice?: number\n}\n\nexport type ProductOption = {\n __typename?: 'MultipleChoiceOption'\n id: string\n displayName: string\n name?: string\n values: ProductOptionValues[]\n}\n\nexport type ProductOptionValues = {\n label: string\n hexColors?: string[]\n}\n\nexport type SellingPlans = {\n id: string\n name: string\n options: {\n name: string\n value: string\n }[]\n}\n\nexport type SellingPlanGroups = {\n name: string\n sellingPlans: SellingPlans[]\n}\n\nexport type SellingPlanAllocations = {\n priceAdjustments: []\n sellingPlan: SellingPlans\n}[]\n\nexport type ProductVariant = {\n barcode?: string\n id: string | number\n options: ProductOption[]\n availableForSale?: boolean\n quantityAvailable: number\n metafields?: Record<string, any>\n sellingPlanAllocations?: SellingPlanAllocations\n price: number\n weight?: number\n name?: string\n image?: ProductImage\n requiresShipping?: boolean\n [key: string]: any\n}\n\nexport type Product = {\n availableForSale?: boolean\n id: string\n name: string\n description: string\n descriptionHtml?: string\n productType?: string\n onlineStoreUrl?: string | null\n publishedAt?: string\n title?: string\n slug?: string\n handle?: string\n path?: string\n images: ProductImage[]\n variants: ProductVariant[]\n price: ProductPrice\n listPrice?: number\n options: ProductOption[]\n seo?: any\n tags?: string[]\n metafields?: { [key: string]: any }\n vendor: string\n totalInventory: number\n requiresSellingPlan: boolean\n sellingPlanGroups: SellingPlanGroups[]\n}\n\ntype Cns = {\n container?: string\n box?: string\n item?: string\n activeItem?: string\n}\n\ninterface TagType {\n type: 'tag'\n text: string\n}\n\ninterface ImageType {\n type: 'image'\n image: string\n imageMob?: string\n imageLink?: string\n}\n\ninterface TitleType {\n type: 'title'\n text: string\n}\n\ninterface SubtitleType {\n type: 'subtitle'\n text: string\n}\n\ninterface PriceType {\n type: 'price'\n price: string\n comparePrice?: string\n soldOut?: boolean\n}\n\ntype ContentType = 'tag' | 'image' | 'title' | 'subtitle' | 'price' | 'buttons' | 'code'\n\ninterface Content {\n type: ContentType\n text?: string\n image?: string\n imageMob?: string\n url?: string\n buttons?: {\n text: string\n variant?: \"primary\" | \"secondary\"\n onClick?: () => void\n }[]\n}\n\nexport type ProductCardProps = {\n content?: Content[]\n cns?: Cns\n}\n"],
|
|
5
|
+
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
|
+
"names": ["types_exports", "__toCommonJS"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var s=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var a=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var x=(e,t)=>{for(var o in t)s(e,o,{get:t[o],enumerable:!0})},f=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let c of a(t))!m.call(e,c)&&c!==o&&s(e,c,{get:()=>t[c],enumerable:!(n=p(t,c))||n.enumerable});return e};var u=e=>f(s({},"__esModule",{value:!0}),e);var T={};x(T,{default:()=>N});module.exports=u(T);var i=require("react/jsx-runtime"),r=require("../../helpers/utils.js"),l=require("../../components/index.js");const d=e=>{const{html:t,icon_l:o,icon_r:n,cns:c}=e;return(0,i.jsxs)("div",{className:(0,r.cn)("cpn-title-container flex items-start justify-center gap-5 text-center",c?.container),children:[o&&(0,i.jsx)(l.Picture,{source:o,className:(0,r.cn)("cpn-title-icon-l",c?.icon_l)}),(0,i.jsx)(l.Text,{html:t,className:"cpn-title-text laptop:text-[40px] text-[24px] font-bold"}),n&&(0,i.jsx)(l.Picture,{source:n,className:(0,r.cn)("cpn-title-icon-r",c?.icon_r)})]})};var N=d;
|
|
2
|
+
//# sourceMappingURL=index.js.map
|