@anker-in/headless-ui 1.0.16-temp-091813 → 1.0.16-temp-091815
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/CollectionsFilters/FilterCardWrap.d.ts +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js.map +3 -3
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js.map +2 -2
- package/dist/cjs/biz-components/CollectionsFilters/index.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/index.js.map +3 -3
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.d.ts +1 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.js.map +3 -3
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.js.map +2 -2
- package/dist/esm/biz-components/CollectionsFilters/index.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/index.js.map +3 -3
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ type FilterCardWrapProps = {
|
|
|
4
4
|
shopifyData?: any;
|
|
5
5
|
currentPage?: number;
|
|
6
6
|
closeFilter: boolean;
|
|
7
|
-
|
|
7
|
+
page: number;
|
|
8
8
|
metafields: any;
|
|
9
9
|
onPrimaryChange?: (item: any, sku: string) => void;
|
|
10
10
|
onSecondaryChange?: (item: any, sku: string) => void;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var z=Object.create;var v=Object.defineProperty;var W=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var A=Object.getPrototypeOf,T=Object.prototype.hasOwnProperty;var q=(t,n)=>{for(var s in n)v(t,s,{get:n[s],enumerable:!0})},P=(t,n,s,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of B(n))!T.call(t,i)&&i!==s&&v(t,i,{get:()=>n[i],enumerable:!(o=W(n,i))||o.enumerable});return t};var E=(t,n,s)=>(s=t!=null?z(A(t)):{},P(n||!t||!t.__esModule?v(s,"default",{value:t,enumerable:!0}):s,t)),O=t=>P(v({},"__esModule",{value:!0}),t);var Q={};q(Q,{default:()=>I});module.exports=O(Q);var e=require("react/jsx-runtime"),C=require("../../helpers/utils.js"),F=require("react-responsive"),G=require("../Paginator/index.js"),S=E(require("./FilterCardWrapItem")),m=require("react"),D=require("es-toolkit");function I(t){const{shopifyData:n={},total:s,result:o,closeFilter:i,page:f,metafields:b,onPrimaryChange:N,onSecondaryChange:M,onNextPage:w,onPrevPage:L}=t,{advertisingSpace:y}=b,{buttonText:j}=n,c=y||n?.advertisingSpace,[h,x]=(0,m.useState)([]),l=(0,F.useMediaQuery)({query:"(max-width: 768px)"}),k=g=>{const a=(0,D.cloneDeep)(g||[]);if(c){const r=a.findIndex(p=>p.mImage);if(r===-1){const p=Math.min(i?c?.maxLocation||7:c?.minLocation||5,a.length);a.splice(p,0,c)}else{a.splice(r,1);const p=Math.min(i?c?.maxLocation||7:c?.minLocation||5,a.length);a.splice(p,0,c)}}return a};return(0,m.useEffect)(()=>{(o?.slug||o?.id)&&((f===1||!l)&&x([]),o?.products&&x(g=>{const a=o.products?.filter?.(d=>!g.some(u=>u.id===d.id));let r=[...g,...a];const p=r.filter(d=>!(!d?.metafields?.seoSetting?.noindex&&d.availableForSale&&d?.variants?.some(u=>u.availableForSale)));return r=r.filter(d=>!d?.metafields?.seoSetting?.noindex&&d.availableForSale&&d?.variants?.some(u=>u.availableForSale)),r.push(...p),(f===1&&!l||l)&&(r=k(r)),r}))},[o?.products,f,l,y]),(0,m.useEffect)(()=>{h?.length&&f===1&&!l&&x(k(h))},[i]),(0,e.jsxs)("div",{className:"filter-card-wrap-container",children:[(0,e.jsx)("div",{className:(0,C.cn)("min-h-[60vh] w-full grid gap-3 grid-cols-2",{"laptop:grid-cols-4 tablet:grid-cols-3":i&&!l,"laptop:grid-cols-3 tablet:grid-cols-2":!i&&!l},"filter-card-wrap"),children:h?.map?.(g=>(0,e.jsx)(S.default,{data:g,buttonText:j,metafields:b,onPrimaryChange:(a,r)=>N?.(a,r),onSecondaryChange:(a,r)=>M?.(a,r)},g.id))}),l?(0,e.jsxs)("div",{onClick:()=>{w?.(o?.pageInfo?.endCursor)},className:"mt-6 text-base font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more",children:[(0,e.jsx)("span",{children:"View More"}),(0,e.jsx)("div",{className:"size-[18px]",children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon",children:(0,e.jsx)("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"})})})]}):null,!l&&s>18?(0,e.jsxs)("div",{className:"mt-6 flex items-center justify-end gap-4 cursor-pointer",children:[(0,e.jsx)("button",{name:"perv page",disabled:!o?.pageInfo?.hasPreviousPage,className:"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",onClick:()=>{L?.(o?.pageInfo?.startCursor)},children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M12 5L7 10L12 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})}),(0,e.jsx)("button",{name:"next page",className:"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",disabled:!o?.pageInfo?.hasNextPage,onClick:()=>{w?.(o?.pageInfo?.endCursor)},children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M7.5 5L12.5 10L7.5 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})})]}):null]})}
|
|
2
2
|
//# sourceMappingURL=FilterCardWrap.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrap.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\nimport Paginator from '../Paginator/index.js'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport { useState, useEffect } from 'react'\nimport { cloneDeep } from 'es-toolkit';\n\ntype FilterCardWrapProps = {\n result?: any\n total: number\n shopifyData?: any\n currentPage?: number\n closeFilter: boolean\n
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
6
|
-
"names": ["FilterCardWrap_exports", "__export", "FilterCardWrap", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_react_responsive", "import_Paginator", "import_FilterCardWrapItem", "import_react", "import_es_toolkit", "props", "shopifyData", "total", "result", "closeFilter", "
|
|
4
|
+
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\nimport Paginator from '../Paginator/index.js'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport { useState, useEffect } from 'react'\nimport { cloneDeep } from 'es-toolkit';\n\ntype FilterCardWrapProps = {\n result?: any\n total: number\n shopifyData?: any\n currentPage?: number\n closeFilter: boolean\n page: number\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n}\n\nexport default function FilterCardWrap(props: FilterCardWrapProps) {\n const { shopifyData = {}, total, result, closeFilter, page, metafields, onPrimaryChange, onSecondaryChange, onNextPage, onPrevPage } = props\n const { advertisingSpace } = metafields\n const { buttonText } = shopifyData\n\n const currentAdvertisingSpace = advertisingSpace || shopifyData?.advertisingSpace\n\n const [data, setData] = useState<any[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const handleAdvertisingSpace = (products: any[]) => {\n const updatedProducts = cloneDeep(products || [])\n if (currentAdvertisingSpace) {\n const findIndex = updatedProducts.findIndex(item => item.mImage)\n if (findIndex === -1) {\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n } else {\n updatedProducts.splice(findIndex, 1)\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n }\n }\n return updatedProducts\n }\n\n // \u5904\u7406\u4EA7\u54C1\u6570\u636E\n useEffect(() => {\n if (result?.slug || result?.id) {\n (page === 1 || !isMobile) && setData([])\n if (result?.products) {\n setData(prevProducts => {\n // \u68C0\u67E5\u662F\u5426\u5DF2\u7ECF\u5B58\u5728\u4E8E prevProducts \u4E2D\uFF0C\u907F\u514D\u91CD\u590D\u6DFB\u52A0\n const newProducts = result.products?.filter?.(\n (product: { id: any }) => !prevProducts.some(prev => prev.id === product.id)\n )\n let updatedProducts = [...prevProducts, ...newProducts]\n /** \u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1 */\n const soldOutProducts = updatedProducts.filter(\n item =>\n !(\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n )\n // \u8FC7\u6EE4\u6389 availableForSale \u4E3A false \u7684\u4EA7\u54C1\n updatedProducts = updatedProducts.filter(\n item =>\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n // \u5C06\u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1\u6DFB\u52A0\u5230\u6700\u540E\n updatedProducts.push(...soldOutProducts)\n // \u5982\u679C advertisingSpace \u5B58\u5728\u4E14\u5C1A\u672A\u6DFB\u52A0\u5230\u6570\u7EC4\u4E2D\n if ((page === 1 && !isMobile) || isMobile) {\n updatedProducts = handleAdvertisingSpace(updatedProducts)\n }\n return updatedProducts\n })\n }\n }\n }, [result?.products, page, isMobile, advertisingSpace])\n\n useEffect(() => {\n if(!data?.length) return\n if(page === 1 && !isMobile) {\n setData(handleAdvertisingSpace(data))\n }\n }, [closeFilter])\n\n return (\n <div className=\"filter-card-wrap-container\">\n <div\n className={cn(\n 'min-h-[60vh] w-full grid gap-3 grid-cols-2',\n {\n 'laptop:grid-cols-4 tablet:grid-cols-3': closeFilter && !isMobile,\n 'laptop:grid-cols-3 tablet:grid-cols-2': !closeFilter && !isMobile,\n },\n 'filter-card-wrap'\n )}\n >\n {data?.map?.(item => (\n <FilterCardWrapItem\n key={item.id}\n data={item}\n buttonText={buttonText}\n metafields={metafields}\n onPrimaryChange={(e, data) => onPrimaryChange?.(e, data)}\n onSecondaryChange={(e, data) => onSecondaryChange?.(e, data)}\n />\n ))}\n </div>\n {isMobile ? (\n <div\n onClick={() => {\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n className=\"mt-6 text-base font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more\"\n >\n <span>View More</span>\n <div className=\"size-[18px]\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n data-slot=\"icon\"\n >\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" />\n </svg>\n </div>\n </div>\n ) : null}\n {!isMobile && total > 18 ? (\n <div className=\"mt-6 flex items-center justify-end gap-4 cursor-pointer\">\n <button\n name=\"perv page\"\n disabled={!result?.pageInfo?.hasPreviousPage}\n className=\"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]\"\n onClick={() => {\n onPrevPage?.(result?.pageInfo?.startCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M12 5L7 10L12 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n <button\n name=\"next page\"\n className=\"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]\"\n disabled={!result?.pageInfo?.hasNextPage}\n onClick={() => {\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M7.5 5L12.5 10L7.5 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n </div>\n ) : // <Paginator\n // className=\"mt-6\"\n // currentPage={currentPage}\n // onPageChange={(v: number) => {\n // setData([])\n // if(v > currentPage) {\n // onNextPage?.(result?.pageInfo?.endCursor)\n // } else {\n // onPrevPage?.(result?.pageInfo?.startCursor)\n // }\n // setCurrentPage(v)\n // }}\n // total={100}\n // />\n null}\n </div>\n )\n}"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["FilterCardWrap_exports", "__export", "FilterCardWrap", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_react_responsive", "import_Paginator", "import_FilterCardWrapItem", "import_react", "import_es_toolkit", "props", "shopifyData", "total", "result", "closeFilter", "page", "metafields", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "advertisingSpace", "buttonText", "currentAdvertisingSpace", "data", "setData", "isMobile", "handleAdvertisingSpace", "products", "updatedProducts", "findIndex", "item", "insertIndex", "prevProducts", "newProducts", "product", "prev", "soldOutProducts", "FilterCardWrapItem", "e"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var me=Object.create;var y=Object.defineProperty;var pe=Object.getOwnPropertyDescriptor;var ue=Object.getOwnPropertyNames;var de=Object.getPrototypeOf,fe=Object.prototype.hasOwnProperty;var ge=(e,r)=>{for(var n in r)y(e,n,{get:r[n],enumerable:!0})},O=(e,r,n,f)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of ue(r))!fe.call(e,m)&&m!==n&&y(e,m,{get:()=>r[m],enumerable:!(f=pe(r,m))||f.enumerable});return e};var _=(e,r,n)=>(n=e!=null?me(de(e)):{},O(r||!e||!e.__esModule?y(n,"default",{value:e,enumerable:!0}):n,e)),be=e=>O(y({},"__esModule",{value:!0}),e);var ke={};ge(ke,{default:()=>he});module.exports=be(ke);var t=require("react/jsx-runtime"),d=require("../../helpers/utils.js"),U=require("../AiuiProvider/index.js"),A=require("../ShelfDisplay/shelfDisplay.js"),E=_(require("../../components/badge.js")),V=require("../../components/heading.js"),R=require("../../components/text.js"),P=_(require("../../components/button.js")),$=_(require("../../components/picture.js")),h=require("../../shared/trackUrlRef.js"),q=require("./component/price.js"),l=require("react");const S="image",w="product_shelf",xe=999999999e-2,ve=e=>{let r;return e?.includes("products")?r=e?.split("products")[0]+"files/":r=e?.replace(e?.split("files")?.pop()||"","")+"/",r},ye=({data:e,buttonText:r,itemShape:n,metafields:f,onPrimaryChange:m,onSecondaryChange:G})=>{const{memberPriceDiscount:J,memberSetting:T,discounts:I}=f,[p,B]=(0,l.useState)(""),[K,M]=(0,l.useState)(""),[g,L]=(0,l.useState)(""),[Q,X]=(0,l.useState)({}),[z,Y]=(0,l.useState)({}),[Z,k]=(0,l.useState)(!1),[F,C]=(0,l.useState)({price:"",basePrice:""}),[W,ee]=(0,l.useState)([]),[te,se]=(0,l.useState)([]),[b,N]=(0,l.useState)(""),{locale:a="us",copyWriting:re,currencyCode:oe,isLogin:j}=(0,U.useAiuiContext)(),x=e?.custom_name||e?.title||e?.name,D=e?.custom_description||e?.description||e?.descriptionHtml,c=e?.filter_variants||e?.variants||[],ie=s=>L(s);return(0,l.useEffect)(()=>{if(g){const o=c?.find(v=>v?.name?.includes?.(g));B(o?.sku||c?.[0]?.sku||""),M(o?.image?.url||c?.[0]?.image?.url||"");return}const s=e?.options?.find(o=>o?.displayName==="color")?.values?.[0]?.label;s&&L(s);const i=c?.find(o=>o?.name?.includes?.(s));B(i?.sku||c?.[0]?.sku||""),M(i?.image?.url||c?.[0]?.image?.url||"")},[g]),(0,l.useEffect)(()=>{if(!p)return;ee(e?.tags||[]);const s=c?.find(u=>u?.sku===p)||c?.[0]||{};Y(s),X(!s?.availableForSale&&s?.price?.amount===xe);const i=s?.coupons?.[0],{price:o,basePrice:v,discount:H}=(0,A.formatVariantPrice)({locale:a,amount:i?i.variant_price4wscode:s.price,baseAmount:i?s.price:0,currencyCode:e?.price?.currencyCode||"USD"});if(j){const u=(0,q.getFunctionMemberPrice)({locale:a,variant:s,currencyCode:oe||e?.price?.currencyCode||"USD",shopMemberPriceDiscountConfig:J});if(u){const{hasMemberPrice:le,salePriceWithCurrency:ne,originalPriceWithCurrency:ae,savePriceWithCurrency:ce}=u;N(ce||""),k(u?.hasMemberPrice),C({basePrice:ae||"",price:le?ne:""})}else k(!1),N(H||""),C({price:o,basePrice:v||""})}else k(!1),N(H||""),C({price:o,basePrice:v||""})},[e,p]),(0,l.useEffect)(()=>{let s=[];if(b){const o=`${b}${I?.off}`;s.push(o)}const i=W?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,b?1:2);se(s.concat(i))},[W,b]),(0,t.jsx)("div",{className:(0,d.cn)(n==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white","bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300",{"aiui-dark":e.theme==="dark"}),children:e?.mImage?(0,t.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden",children:(0,t.jsxs)("a",{className:"relative inset-0 size-full",href:(0,h.trackUrlRef)(e?.link,`${S}_${w}`),children:[(0,t.jsx)($.default,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full"}),(0,t.jsxs)("div",{className:"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4",children:[(0,t.jsx)("p",{className:"mb-2 text-info-primary desktop:text-base text-sm font-bold",dangerouslySetInnerHTML:{__html:e?.subTitle}}),(0,t.jsx)("span",{className:"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6",dangerouslySetInnerHTML:{__html:e?.title}})]})]})}):(0,t.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4",children:[(0,t.jsx)("div",{className:"flex flex-wrap gap-1 overflow-hidden collection-filter-tags",children:te?.map?.((s,i)=>(0,t.jsx)(E.default,{className:"item-badge",children:s},i))}),(0,t.jsx)("a",{"aria-label":x,target:"_blank",href:(0,h.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${S}_${w}`),children:(0,t.jsx)("div",{className:(0,d.cn)("m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden"),children:(0,t.jsx)($.default,{alt:"",source:K,className:"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit"})})}),e?.options?.map(s=>{if(s?.displayName==="color")return(0,t.jsx)("div",{className:"flex items-center gap-1",children:s?.values?.map(i=>{const o=i?.hexColors?i.hexColors?.[0]:i?.label;return(0,t.jsx)("button",{onClick:()=>ie(i?.label),className:(0,d.cn)("size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent",`${g===i?.label?"border-[#00BEFA]":""}`),children:(0,t.jsx)("img",{alt:o,className:"h-full w-full object-cover",src:`${ve(e?.images?.[0]?.url)}${o?.toLowerCase().split(" ")?.join("-")}_50x.png`})},i?.label)})})}),(0,t.jsxs)("div",{children:[x?(0,t.jsx)(V.Heading,{as:"h3",size:2,html:x||"",title:x||"",className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base"}):null,e?.metafields?.judgemeBadge?(0,t.jsx)("a",{target:"_blank",className:"font-bold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:(0,h.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${S}_${w}`)}):null,D?(0,t.jsx)(R.Text,{size:2,html:D||"",className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs"}):null,(0,t.jsxs)("div",{className:"mt-3 mb-2",children:[(0,t.jsx)("p",{dangerouslySetInnerHTML:{__html:j&&Z&&(I?.memberPrice||T?.member_price||T?.plus_member_price)||""},className:"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold"}),(0,t.jsx)("div",{className:"flex items-center",children:Q?(0,t.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:re?.soldOutText}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"final-price desktop:text-2xl text-info-primary text-base font-bold",children:z?.availableForSale&&F?.price||""}),(0,t.jsx)("div",{className:"origin-price desktop:text-xl text-info-secondary ml-1 text-sm font-bold line-through",children:z?.availableForSale&&F?.basePrice||""})]})})]}),(0,t.jsxs)("div",{className:(0,d.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col"),children:[(0,t.jsx)(P.default,{variant:"secondary",className:"m-tablet:w-full",onClick:()=>m?.(e,p),children:r?.secondaryButton||"Learn More"}),(0,t.jsx)(P.default,{variant:"primary",className:"m-tablet:w-full",onClick:()=>G?.(e,p),children:r?.primaryButton||"Shop Now"})]})]})]})},e?.id||e?.handle)};var he=ye;
|
|
1
|
+
"use strict";var me=Object.create;var y=Object.defineProperty;var pe=Object.getOwnPropertyDescriptor;var ue=Object.getOwnPropertyNames;var de=Object.getPrototypeOf,fe=Object.prototype.hasOwnProperty;var ge=(e,r)=>{for(var n in r)y(e,n,{get:r[n],enumerable:!0})},O=(e,r,n,f)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of ue(r))!fe.call(e,m)&&m!==n&&y(e,m,{get:()=>r[m],enumerable:!(f=pe(r,m))||f.enumerable});return e};var _=(e,r,n)=>(n=e!=null?me(de(e)):{},O(r||!e||!e.__esModule?y(n,"default",{value:e,enumerable:!0}):n,e)),be=e=>O(y({},"__esModule",{value:!0}),e);var ke={};ge(ke,{default:()=>he});module.exports=be(ke);var t=require("react/jsx-runtime"),d=require("../../helpers/utils.js"),U=require("../AiuiProvider/index.js"),A=require("../ShelfDisplay/shelfDisplay.js"),E=_(require("../../components/badge.js")),V=require("../../components/heading.js"),R=require("../../components/text.js"),P=_(require("../../components/button.js")),$=_(require("../../components/picture.js")),h=require("../../shared/trackUrlRef.js"),q=require("./component/price.js"),l=require("react");const S="image",w="product_shelf",xe=999999999e-2,ve=e=>{let r;return e?.includes("products")?r=e?.split("products")[0]+"files/":r=e?.replace(e?.split("files")?.pop()||"","")+"/",r},ye=({data:e,buttonText:r,itemShape:n,metafields:f,onPrimaryChange:m,onSecondaryChange:G})=>{const{memberPriceDiscount:J,memberSetting:T,discounts:I}=f,[p,B]=(0,l.useState)(""),[K,M]=(0,l.useState)(""),[g,L]=(0,l.useState)(""),[Q,X]=(0,l.useState)({}),[z,Y]=(0,l.useState)({}),[Z,k]=(0,l.useState)(!1),[F,C]=(0,l.useState)({price:"",basePrice:""}),[W,ee]=(0,l.useState)([]),[te,se]=(0,l.useState)([]),[b,N]=(0,l.useState)(""),{locale:a="us",copyWriting:re,currencyCode:oe,isLogin:j}=(0,U.useAiuiContext)(),x=e?.custom_name||e?.title||e?.name,D=e?.custom_description||e?.description||e?.descriptionHtml,c=e?.filter_variants||e?.variants||[],ie=s=>L(s);return(0,l.useEffect)(()=>{if(g){const o=c?.find(v=>v?.name?.includes?.(g));B(o?.sku||c?.[0]?.sku||""),M(o?.image?.url||c?.[0]?.image?.url||"");return}const s=e?.options?.find(o=>o?.displayName==="color")?.values?.[0]?.label;s&&L(s);const i=c?.find(o=>o?.name?.includes?.(s));B(i?.sku||c?.[0]?.sku||""),M(i?.image?.url||c?.[0]?.image?.url||"")},[g]),(0,l.useEffect)(()=>{if(!p)return;ee(e?.tags||[]);const s=c?.find(u=>u?.sku===p)||c?.[0]||{};Y(s),X(!s?.availableForSale&&s?.price?.amount===xe);const i=s?.coupons?.[0],{price:o,basePrice:v,discount:H}=(0,A.formatVariantPrice)({locale:a,amount:i?i.variant_price4wscode:s.price,baseAmount:i?s.price:0,currencyCode:e?.price?.currencyCode||"USD"});if(j){const u=(0,q.getFunctionMemberPrice)({locale:a,variant:s,currencyCode:oe||e?.price?.currencyCode||"USD",shopMemberPriceDiscountConfig:J});if(u){const{hasMemberPrice:le,salePriceWithCurrency:ne,originalPriceWithCurrency:ae,savePriceWithCurrency:ce}=u;N(ce||""),k(u?.hasMemberPrice),C({basePrice:ae||"",price:le?ne:""})}else k(!1),N(H||""),C({price:o,basePrice:v||""})}else k(!1),N(H||""),C({price:o,basePrice:v||""})},[e,p]),(0,l.useEffect)(()=>{let s=[];if(b){const o=`${b}${I?.off}`;s.push(o)}const i=W?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,b?1:2);se(s.concat(i))},[W,b]),(0,t.jsx)("div",{className:(0,d.cn)(n==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white","bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300",{"aiui-dark":e.theme==="dark"}),children:e?.mImage?(0,t.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden",children:(0,t.jsxs)("a",{className:"relative inset-0 size-full",href:(0,h.trackUrlRef)(e?.link,`${S}_${w}`),children:[(0,t.jsx)($.default,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full"}),(0,t.jsxs)("div",{className:"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4",children:[(0,t.jsx)("p",{className:"mb-2 text-info-primary desktop:text-base text-sm font-bold",dangerouslySetInnerHTML:{__html:e?.subTitle}}),(0,t.jsx)("span",{className:"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6",dangerouslySetInnerHTML:{__html:e?.title}})]})]})}):(0,t.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4",children:[(0,t.jsx)("div",{className:"flex flex-wrap gap-1 overflow-hidden collection-filter-tags",children:te?.map?.((s,i)=>(0,t.jsx)(E.default,{className:"item-badge",children:s},i))}),(0,t.jsx)("a",{"aria-label":x,target:"_blank",href:(0,h.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${S}_${w}`),children:(0,t.jsx)("div",{className:(0,d.cn)("m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden"),children:(0,t.jsx)($.default,{alt:"",source:K,className:"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit"})})}),e?.options?.map(s=>{if(s?.displayName==="color")return(0,t.jsx)("div",{className:"flex items-center gap-1",children:s?.values?.map(i=>{const o=i?.hexColors?i.hexColors?.[0]:i?.label;return(0,t.jsx)("button",{onClick:()=>ie(i?.label),className:(0,d.cn)("size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent",`${g===i?.label?"border-[#00BEFA]":""}`),children:(0,t.jsx)("img",{alt:o,className:"h-full w-full object-cover",src:`${ve(e?.images?.[0]?.url)}${o?.toLowerCase().split(" ")?.join("-")}_50x.png`})},i?.label)})})}),(0,t.jsxs)("div",{children:[x?(0,t.jsx)(V.Heading,{as:"h3",size:2,html:x||"",title:x||"",className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base"}):null,e?.metafields?.judgemeBadge?(0,t.jsx)("a",{target:"_blank",className:"font-bold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:(0,h.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${S}_${w}`)}):null,D?(0,t.jsx)(R.Text,{size:2,html:D||"",className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs"}):null,(0,t.jsxs)("div",{className:"mt-3 mb-2",children:[(0,t.jsx)("p",{dangerouslySetInnerHTML:{__html:j&&Z&&(I?.memberPrice||T?.member_price||T?.plus_member_price)||""},className:"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold"}),(0,t.jsx)("div",{className:"flex items-center",children:Q?(0,t.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:re?.soldOutText}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold",children:z?.availableForSale&&F?.price||""}),(0,t.jsx)("div",{className:"origin-price desktop:text-xl tablet:text-lg text-info-secondary ml-1 text-sm font-bold line-through",children:z?.availableForSale&&F?.basePrice||""})]})})]}),(0,t.jsxs)("div",{className:(0,d.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col"),children:[(0,t.jsx)(P.default,{variant:"secondary",className:"m-tablet:w-full",onClick:()=>m?.(e,p),children:r?.secondaryButton||"Learn More"}),(0,t.jsx)(P.default,{variant:"primary",className:"m-tablet:w-full",onClick:()=>G?.(e,p),children:r?.primaryButton||"Shop Now"})]})]})]})},e?.id||e?.handle)};var he=ye;
|
|
2
2
|
//# sourceMappingURL=FilterCardWrapItem.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrapItem.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport Badge from '../../components/badge.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getFunctionMemberPrice } from './component/price.js'\nimport { useState, useEffect } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nconst getShopifyCdnBaseUrl = (imagePath: string | null) => {\n // \u76EE\u524D\u77E5\u9053\u7684 shopify \u56FE\u7247\u8DEF\u7531\u7684\u5F62\u5F0F\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/files/Group_5581_2.jpg?v=1662379184\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/products/B2633123.jpg?v=1631264041_3840x\n // \u8FD4\u56DE https://cdn.shopify.com/s/files/1/0493/9834/9974/files/\n let path\n if (imagePath?.includes('products')) {\n path = imagePath?.split('products')[0] + 'files/'\n } else {\n path = imagePath?.replace(imagePath?.split('files')?.pop() || '', '') + '/'\n }\n return path\n}\n\ntype FilterCardWrapItemProps = {\n data: any\n buttonText?: any\n itemShape?: string\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\n\nconst FilterCardWrapItem = ({\n data,\n buttonText,\n itemShape,\n metafields,\n onPrimaryChange,\n onSecondaryChange,\n}: FilterCardWrapItemProps) => {\n const { memberPriceDiscount, memberSetting, discounts } = metafields\n const [currentSku, setCurrentSku] = useState<string>('')\n const [currentImage, setCurrentImage] = useState<string>('')\n const [selectedColor, setSelectedColor] = useState<string>('')\n const [isSoldOut, setIsSoldOut] = useState<any>({})\n const [currentVariant, setCurrentVariant] = useState<any>({})\n const [plusMemberStatus, setPlusMemberStatus] = useState<boolean>(false)\n const [priceCollection, setPriceCollection] = useState<{ price: string; basePrice: string }>({\n price: '',\n basePrice: '',\n })\n const [tags, setTags] = useState<string[]>([])\n const [showTags, setShowTags] = useState<string[]>([])\n const [discountCollection, setDiscountCollection] = useState<string>('')\n\n const { locale = 'us', copyWriting, currencyCode, isLogin } = useAiuiContext()\n\n const displayTitle = data?.custom_name || data?.title || data?.name\n const displayDescription = data?.custom_description || data?.description || data?.descriptionHtml\n const skuArray = data?.filter_variants || data?.variants || []\n\n const onColorClick = (color: string) => setSelectedColor(color)\n\n useEffect(() => {\n if (selectedColor) {\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(selectedColor))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n return\n }\n const firstOption = data?.options?.find((item: any) => item?.displayName === 'color')?.values?.[0]?.label\n firstOption && setSelectedColor(firstOption)\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(firstOption))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n }, [selectedColor])\n\n useEffect(() => {\n if (!currentSku) return\n setTags(data?.tags || [])\n const variant = skuArray?.find((item: any) => item?.sku === currentSku) || skuArray?.[0] || {}\n setCurrentVariant(variant)\n setIsSoldOut(!variant?.availableForSale && variant?.price?.amount === SOLD_OUT_PRICE)\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n const { price, basePrice, discount } = formatVariantPrice({\n locale: locale,\n amount: coupon ? coupon.variant_price4wscode : variant.price,\n baseAmount: coupon ? variant.price : 0,\n currencyCode: data?.price?.currencyCode || 'USD',\n })\n // \u4F1A\u5458\u6298\u6263\n if (isLogin) {\n const result = getFunctionMemberPrice({\n locale: locale,\n variant: variant,\n currencyCode: currencyCode || data?.price?.currencyCode || 'USD',\n shopMemberPriceDiscountConfig: memberPriceDiscount,\n })\n if (result) {\n const { hasMemberPrice, salePriceWithCurrency, originalPriceWithCurrency, savePriceWithCurrency } = result\n setDiscountCollection(savePriceWithCurrency || '')\n setPlusMemberStatus(result?.hasMemberPrice)\n setPriceCollection({\n basePrice: originalPriceWithCurrency || '',\n price: hasMemberPrice ? salePriceWithCurrency : ''\n })\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n }, [data, currentSku])\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discountCollection) {\n const discountTag = `${discountCollection}${discounts?.off}`\n handleTags.push(discountTag)\n }\n const newTags = tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discountCollection ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [tags, discountCollection])\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white',\n 'bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n {\n 'aiui-dark': data.theme === 'dark',\n }\n )}\n >\n {data?.mImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden\">\n <a className=\"relative inset-0 size-full\" href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}>\n <Picture\n alt=\"\"\n source={data?.mImage?.url || data?.mImage}\n className=\"size-full [&_img]:object-cover [&_img]:size-full\"\n />\n <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n <p\n className=\"mb-2 text-info-primary desktop:text-base text-sm font-bold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n />\n <span\n className=\"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4\">\n <div className=\"flex flex-wrap gap-1 overflow-hidden collection-filter-tags\">\n {showTags?.map?.((item: string, index: number) => (\n <Badge key={index} className=\"item-badge\">\n {item}\n </Badge>\n ))}\n </div>\n <a\n aria-label={displayTitle}\n target=\"_blank\"\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n >\n <div className={cn('m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden')}>\n <Picture\n alt=\"\"\n source={currentImage}\n className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n />\n </div>\n </a>\n {data?.options?.map((option: any) => {\n if (option?.displayName === 'color') {\n return (\n <div className=\"flex items-center gap-1\">\n {option?.values?.map((item: any) => {\n const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n return (\n <button\n key={item?.label}\n onClick={() => onColorClick(item?.label)}\n className={cn(\n 'size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent',\n `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n )}\n >\n <img\n alt={color}\n className=\"h-full w-full object-cover\"\n src={`${getShopifyCdnBaseUrl(data?.images?.[0]?.url)}${color\n ?.toLowerCase()\n .split(' ')\n ?.join('-')}_${'50x'}.png`}\n />\n </button>\n )\n })}\n </div>\n )\n }\n })}\n <div>\n {displayTitle ? (\n <Heading\n as=\"h3\"\n size={2}\n html={displayTitle || ''}\n title={displayTitle || ''}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-bold text-xs [&_.jdgm-star]:text-[#F77234]\"\n dangerouslySetInnerHTML={{ __html: data?.metafields?.judgemeBadge }}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n />\n ) : null}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription || ''}\n className=\"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs\"\n />\n ) : null}\n <div className=\"mt-3 mb-2\">\n <p\n dangerouslySetInnerHTML={{\n __html:\n isLogin && plusMemberStatus\n ? discounts?.memberPrice || memberSetting?.member_price || memberSetting?.plus_member_price || ''\n : '',\n }}\n className=\"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold\"\n />\n <div className=\"flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price desktop:text-2xl text-info-primary text-base font-bold\">\n {currentVariant?.availableForSale ? priceCollection?.price || '' : ''}\n </div>\n <div className=\"origin-price desktop:text-xl text-info-secondary ml-1 text-sm font-bold line-through\">\n {currentVariant?.availableForSale ? priceCollection?.basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col')}\n >\n <Button\n variant=\"secondary\"\n className=\"m-tablet:w-full\"\n onClick={() => onPrimaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.primaryButton || 'Shop Now'}\n </Button>\n </div>\n </div>\n </div>\n )}\n </div>\n )\n}\nexport default FilterCardWrapItem\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport Badge from '../../components/badge.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getFunctionMemberPrice } from './component/price.js'\nimport { useState, useEffect } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nconst getShopifyCdnBaseUrl = (imagePath: string | null) => {\n // \u76EE\u524D\u77E5\u9053\u7684 shopify \u56FE\u7247\u8DEF\u7531\u7684\u5F62\u5F0F\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/files/Group_5581_2.jpg?v=1662379184\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/products/B2633123.jpg?v=1631264041_3840x\n // \u8FD4\u56DE https://cdn.shopify.com/s/files/1/0493/9834/9974/files/\n let path\n if (imagePath?.includes('products')) {\n path = imagePath?.split('products')[0] + 'files/'\n } else {\n path = imagePath?.replace(imagePath?.split('files')?.pop() || '', '') + '/'\n }\n return path\n}\n\ntype FilterCardWrapItemProps = {\n data: any\n buttonText?: any\n itemShape?: string\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\n\nconst FilterCardWrapItem = ({\n data,\n buttonText,\n itemShape,\n metafields,\n onPrimaryChange,\n onSecondaryChange,\n}: FilterCardWrapItemProps) => {\n const { memberPriceDiscount, memberSetting, discounts } = metafields\n const [currentSku, setCurrentSku] = useState<string>('')\n const [currentImage, setCurrentImage] = useState<string>('')\n const [selectedColor, setSelectedColor] = useState<string>('')\n const [isSoldOut, setIsSoldOut] = useState<any>({})\n const [currentVariant, setCurrentVariant] = useState<any>({})\n const [plusMemberStatus, setPlusMemberStatus] = useState<boolean>(false)\n const [priceCollection, setPriceCollection] = useState<{ price: string; basePrice: string }>({\n price: '',\n basePrice: '',\n })\n const [tags, setTags] = useState<string[]>([])\n const [showTags, setShowTags] = useState<string[]>([])\n const [discountCollection, setDiscountCollection] = useState<string>('')\n\n const { locale = 'us', copyWriting, currencyCode, isLogin } = useAiuiContext()\n\n const displayTitle = data?.custom_name || data?.title || data?.name\n const displayDescription = data?.custom_description || data?.description || data?.descriptionHtml\n const skuArray = data?.filter_variants || data?.variants || []\n\n const onColorClick = (color: string) => setSelectedColor(color)\n\n useEffect(() => {\n if (selectedColor) {\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(selectedColor))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n return\n }\n const firstOption = data?.options?.find((item: any) => item?.displayName === 'color')?.values?.[0]?.label\n firstOption && setSelectedColor(firstOption)\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(firstOption))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n }, [selectedColor])\n\n useEffect(() => {\n if (!currentSku) return\n setTags(data?.tags || [])\n const variant = skuArray?.find((item: any) => item?.sku === currentSku) || skuArray?.[0] || {}\n setCurrentVariant(variant)\n setIsSoldOut(!variant?.availableForSale && variant?.price?.amount === SOLD_OUT_PRICE)\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n const { price, basePrice, discount } = formatVariantPrice({\n locale: locale,\n amount: coupon ? coupon.variant_price4wscode : variant.price,\n baseAmount: coupon ? variant.price : 0,\n currencyCode: data?.price?.currencyCode || 'USD',\n })\n // \u4F1A\u5458\u6298\u6263\n if (isLogin) {\n const result = getFunctionMemberPrice({\n locale: locale,\n variant: variant,\n currencyCode: currencyCode || data?.price?.currencyCode || 'USD',\n shopMemberPriceDiscountConfig: memberPriceDiscount,\n })\n if (result) {\n const { hasMemberPrice, salePriceWithCurrency, originalPriceWithCurrency, savePriceWithCurrency } = result\n setDiscountCollection(savePriceWithCurrency || '')\n setPlusMemberStatus(result?.hasMemberPrice)\n setPriceCollection({\n basePrice: originalPriceWithCurrency || '',\n price: hasMemberPrice ? salePriceWithCurrency : ''\n })\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n }, [data, currentSku])\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discountCollection) {\n const discountTag = `${discountCollection}${discounts?.off}`\n handleTags.push(discountTag)\n }\n const newTags = tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discountCollection ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [tags, discountCollection])\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white',\n 'bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n {\n 'aiui-dark': data.theme === 'dark',\n }\n )}\n >\n {data?.mImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden\">\n <a className=\"relative inset-0 size-full\" href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}>\n <Picture\n alt=\"\"\n source={data?.mImage?.url || data?.mImage}\n className=\"size-full [&_img]:object-cover [&_img]:size-full\"\n />\n <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n <p\n className=\"mb-2 text-info-primary desktop:text-base text-sm font-bold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n />\n <span\n className=\"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4\">\n <div className=\"flex flex-wrap gap-1 overflow-hidden collection-filter-tags\">\n {showTags?.map?.((item: string, index: number) => (\n <Badge key={index} className=\"item-badge\">\n {item}\n </Badge>\n ))}\n </div>\n <a\n aria-label={displayTitle}\n target=\"_blank\"\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n >\n <div className={cn('m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden')}>\n <Picture\n alt=\"\"\n source={currentImage}\n className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n />\n </div>\n </a>\n {data?.options?.map((option: any) => {\n if (option?.displayName === 'color') {\n return (\n <div className=\"flex items-center gap-1\">\n {option?.values?.map((item: any) => {\n const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n return (\n <button\n key={item?.label}\n onClick={() => onColorClick(item?.label)}\n className={cn(\n 'size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent',\n `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n )}\n >\n <img\n alt={color}\n className=\"h-full w-full object-cover\"\n src={`${getShopifyCdnBaseUrl(data?.images?.[0]?.url)}${color\n ?.toLowerCase()\n .split(' ')\n ?.join('-')}_${'50x'}.png`}\n />\n </button>\n )\n })}\n </div>\n )\n }\n })}\n <div>\n {displayTitle ? (\n <Heading\n as=\"h3\"\n size={2}\n html={displayTitle || ''}\n title={displayTitle || ''}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-bold text-xs [&_.jdgm-star]:text-[#F77234]\"\n dangerouslySetInnerHTML={{ __html: data?.metafields?.judgemeBadge }}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n />\n ) : null}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription || ''}\n className=\"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs\"\n />\n ) : null}\n <div className=\"mt-3 mb-2\">\n <p\n dangerouslySetInnerHTML={{\n __html:\n isLogin && plusMemberStatus\n ? discounts?.memberPrice || memberSetting?.member_price || memberSetting?.plus_member_price || ''\n : '',\n }}\n className=\"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold\"\n />\n <div className=\"flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold\">\n {currentVariant?.availableForSale ? priceCollection?.price || '' : ''}\n </div>\n <div className=\"origin-price desktop:text-xl tablet:text-lg text-info-secondary ml-1 text-sm font-bold line-through\">\n {currentVariant?.availableForSale ? priceCollection?.basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col')}\n >\n <Button\n variant=\"secondary\"\n className=\"m-tablet:w-full\"\n onClick={() => onPrimaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.primaryButton || 'Shop Now'}\n </Button>\n </div>\n </div>\n </div>\n )}\n </div>\n )\n}\nexport default FilterCardWrapItem\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["FilterCardWrapItem_exports", "__export", "FilterCardWrapItem_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_AiuiProvider", "import_shelfDisplay", "import_badge", "import_heading", "import_text", "import_button", "import_picture", "import_trackUrlRef", "import_price", "import_react", "componentType", "componentName", "SOLD_OUT_PRICE", "getShopifyCdnBaseUrl", "imagePath", "path", "FilterCardWrapItem", "data", "buttonText", "itemShape", "metafields", "onPrimaryChange", "onSecondaryChange", "memberPriceDiscount", "memberSetting", "discounts", "currentSku", "setCurrentSku", "currentImage", "setCurrentImage", "selectedColor", "setSelectedColor", "isSoldOut", "setIsSoldOut", "currentVariant", "setCurrentVariant", "plusMemberStatus", "setPlusMemberStatus", "priceCollection", "setPriceCollection", "tags", "setTags", "showTags", "setShowTags", "discountCollection", "setDiscountCollection", "locale", "copyWriting", "currencyCode", "isLogin", "displayTitle", "displayDescription", "skuArray", "onColorClick", "color", "findSku", "item", "firstOption", "variant", "coupon", "price", "basePrice", "discount", "result", "hasMemberPrice", "salePriceWithCurrency", "originalPriceWithCurrency", "savePriceWithCurrency", "handleTags", "discountTag", "newTags", "Picture", "index", "Badge", "option", "Button"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var B=Object.create;var
|
|
1
|
+
"use strict";var B=Object.create;var c=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var J=Object.getPrototypeOf,Q=Object.prototype.hasOwnProperty;var U=(e,t)=>{for(var r in t)c(e,r,{get:t[r],enumerable:!0})},x=(e,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of G(t))!Q.call(e,a)&&a!==r&&c(e,a,{get:()=>t[a],enumerable:!(s=E(t,a))||s.enumerable});return e};var g=(e,t,r)=>(r=e!=null?B(J(e)):{},x(t||!e||!e.__esModule?c(r,"default",{value:e,enumerable:!0}):r,e)),X=e=>x(c({},"__esModule",{value:!0}),e);var $={};U($,{default:()=>Z});module.exports=X($);var i=require("react/jsx-runtime"),S=g(require("./FilterList")),N=g(require("./FilterHeader")),w=g(require("./FilterCardWrap")),D=require("../../shared/Styles.js"),L=g(require("./component/TabFilter")),n=require("react"),l=require("./component/filtersFun");function Y(e){const{data:t,result:r={},allResult:s={},loadMore:a=null,metafields:f={},filterPrice:O={},isLoading:R=!1,onFilteredChange:y,onSortAndReverseChange:K,onPrimaryChange:I,onSecondaryChange:M,onNextPage:_,onPrevPage:k}=e,{shop_filters_pair:C}=f,[m,A]=(0,n.useState)(!1),[V,h]=(0,n.useState)(!1),[z,H]=(0,n.useState)([]),[F,u]=(0,n.useState)({}),[v,T]=(0,n.useState)(0),[b,p]=(0,n.useState)(1);(0,n.useMemo)(()=>{const o=C?.filter_txt?.sortList,[d,q]=(0,l.handleSortKeyAndReverse)(o,v);K?.(d,q)},[C?.filter_txt?.sortList,F,v]);const W=o=>!o?.metafields?.seoSetting?.noindex,P=(0,n.useMemo)(()=>s?.products?.filter(W)?.length||0,[s?.products]);return(0,i.jsxs)("div",{className:"size-full box-border",children:[(0,i.jsx)("div",{className:"laptop:mb-12 mb-6",children:(0,i.jsx)(L.default,{tabs:t?.tabItems})}),(0,i.jsx)(N.default,{total:P||0,metafields:f,closeFilter:m,sortKeyIndx:v,shopifyData:t,onSortChange:T,onCloseFilter:A,onClearFiltered:()=>{u?.({}),y?.((0,l.handleFilters)({}))},onMobileOpenDrawer:h}),(0,i.jsxs)("div",{className:"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8",children:[!m&&(0,i.jsx)(S.default,{result:r,filtered:F,filterPrice:O,openOptions:z,closeFilter:m,shopifyData:t,metafields:f,mobileDrawerVisible:V,onFilteredChange:o=>{u(o),p(1),y?.((0,l.handleFilters)(o))},onClearFiltered:()=>{u?.({}),p(1),y?.((0,l.handleFilters)({}))},onOpenOptions:H,onCloseDrawer:h}),(0,i.jsxs)("div",{className:"flex-1 overflow-y-auto relative",children:[(0,i.jsx)(w.default,{page:b,result:r,shopifyData:t,total:P,metafields:f,closeFilter:m,onNextPage:o=>{p(b+1),_?.(o)},onPrevPage:o=>{p(b-1),k?.(o)},onPrimaryChange:(o,d)=>I?.(o,d),onSecondaryChange:(o,d)=>M?.(o,d)}),R&&a||null]})]})]})}var Z=(0,D.withLayout)(Y);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import FilterList from './FilterList'\nimport FilterHeader from './FilterHeader'\nimport FilterCardWrap from './FilterCardWrap'\nimport { withLayout } from '../../shared/Styles.js'\nimport TabFilter from './component/TabFilter'\nimport { useState, useMemo } from 'react'\nimport { handleSortKeyAndReverse, handleFilters } from './component/filtersFun'\n\ntype CollectionsFiltersProps = {\n metafields: any\n result: any\n allResult: any\n pageSize?: number\n filterPrice: any\n isLoading?: boolean\n loadMore?: React.ReactNode\n data?: any\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n onFilteredChange?: (filtered: any) => void\n onSortAndReverseChange?: (sortKey: string, reverse: boolean) => void\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\nfunction CollectionsFilters(props: CollectionsFiltersProps) {\n const {\n data,\n result = {},\n allResult = {},\n loadMore = null,\n metafields = {},\n filterPrice = {},\n isLoading = false,\n onFilteredChange,\n onSortAndReverseChange,\n onPrimaryChange,\n onSecondaryChange,\n onNextPage,\n onPrevPage,\n } = props\n\n const { shop_filters_pair } = metafields\n\n const [closeFilter, setCloseFilter] = useState<boolean>(false)\n const [mobileDrawerVisible, setMobileDrawerVisible] = useState<boolean>(false) // \u79FB\u52A8\u7AEF\u7B5B\u9009\u9009\u9879\u5C55\u793A\u72B6\u6001\n const [openOptions, setOpenOptions] = useState<any[]>([]) // \u5C55\u5F00\u7684\u7B5B\u9009\u9879\n const [filtered, setFiltered] = useState<any>({}) // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n const [sortKeyIndx, setSortKeyIndx] = useState<number>(0) // \u6392\u5E8F\u65B9\u5F0F\n const [
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAwEQ,IAAAI,EAAA,6BAxERC,EAAuB,2BACvBC,EAAyB,6BACzBC,EAA2B,+BAC3BC,EAA2B,kCAC3BC,EAAsB,oCACtBC,EAAkC,iBAClCC,EAAuD,kCAkBvD,SAASC,EAAmBC,EAAgC,CAC1D,KAAM,CACJ,KAAAC,EACA,OAAAC,EAAS,CAAC,EACV,UAAAC,EAAY,CAAC,EACb,SAAAC,EAAW,KACX,WAAAC,EAAa,CAAC,EACd,YAAAC,EAAc,CAAC,EACf,UAAAC,EAAY,GACZ,iBAAAC,EACA,uBAAAC,EACA,gBAAAC,EACA,kBAAAC,EACA,WAAAC,EACA,WAAAC,CACF,EAAIb,EAEE,CAAE,kBAAAc,CAAkB,EAAIT,EAExB,CAACU,EAAaC,CAAc,KAAI,YAAkB,EAAK,EACvD,CAACC,EAAqBC,CAAsB,KAAI,YAAkB,EAAK,EACvE,CAACC,EAAaC,CAAc,KAAI,YAAgB,CAAC,CAAC,EAClD,CAACC,EAAUC,CAAW,KAAI,YAAc,CAAC,CAAC,EAC1C,CAACC,EAAaC,CAAc,KAAI,YAAiB,CAAC,EAClD,CAACC,
|
|
6
|
-
"names": ["CollectionsFilters_exports", "__export", "CollectionsFilters_default", "__toCommonJS", "import_jsx_runtime", "import_FilterList", "import_FilterHeader", "import_FilterCardWrap", "import_Styles", "import_TabFilter", "import_react", "import_filtersFun", "CollectionsFilters", "props", "data", "result", "allResult", "loadMore", "metafields", "filterPrice", "isLoading", "onFilteredChange", "onSortAndReverseChange", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "shop_filters_pair", "closeFilter", "setCloseFilter", "mobileDrawerVisible", "setMobileDrawerVisible", "openOptions", "setOpenOptions", "filtered", "setFiltered", "sortKeyIndx", "setSortKeyIndx", "
|
|
4
|
+
"sourcesContent": ["import FilterList from './FilterList'\nimport FilterHeader from './FilterHeader'\nimport FilterCardWrap from './FilterCardWrap'\nimport { withLayout } from '../../shared/Styles.js'\nimport TabFilter from './component/TabFilter'\nimport { useState, useMemo } from 'react'\nimport { handleSortKeyAndReverse, handleFilters } from './component/filtersFun'\n\ntype CollectionsFiltersProps = {\n metafields: any\n result: any\n allResult: any\n pageSize?: number\n filterPrice: any\n isLoading?: boolean\n loadMore?: React.ReactNode\n data?: any\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n onFilteredChange?: (filtered: any) => void\n onSortAndReverseChange?: (sortKey: string, reverse: boolean) => void\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\nfunction CollectionsFilters(props: CollectionsFiltersProps) {\n const {\n data,\n result = {},\n allResult = {},\n loadMore = null,\n metafields = {},\n filterPrice = {},\n isLoading = false,\n onFilteredChange,\n onSortAndReverseChange,\n onPrimaryChange,\n onSecondaryChange,\n onNextPage,\n onPrevPage,\n } = props\n\n const { shop_filters_pair } = metafields\n\n const [closeFilter, setCloseFilter] = useState<boolean>(false)\n const [mobileDrawerVisible, setMobileDrawerVisible] = useState<boolean>(false) // \u79FB\u52A8\u7AEF\u7B5B\u9009\u9009\u9879\u5C55\u793A\u72B6\u6001\n const [openOptions, setOpenOptions] = useState<any[]>([]) // \u5C55\u5F00\u7684\u7B5B\u9009\u9879\n const [filtered, setFiltered] = useState<any>({}) // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n const [sortKeyIndx, setSortKeyIndx] = useState<number>(0) // \u6392\u5E8F\u65B9\u5F0F\n const [currentPage, setCurrentPage] = useState<number>(1)\n\n // \u5904\u7406\u6392\u5E8F\u6570\u636E\n useMemo(() => {\n const sortList = shop_filters_pair?.filter_txt?.sortList\n const [sortKey, reverse] = handleSortKeyAndReverse(sortList, sortKeyIndx)\n onSortAndReverseChange?.(sortKey, reverse)\n }, [shop_filters_pair?.filter_txt?.sortList, filtered, sortKeyIndx])\n\n // // \u6570\u91CF\n // useMemo(() => {\n // onChunkNumberChange?.(handleChunkNumber(filtered))\n // }, [filtered])\n const hasNoIndex = (product: { metafields: { seoSetting: { noindex: any } } }) => {\n return !product?.metafields?.seoSetting?.noindex\n }\n const totalCount = useMemo(() => {\n return allResult?.products?.filter(hasNoIndex)?.length || 0\n }, [allResult?.products])\n\n return (\n <div className=\"size-full box-border\">\n {/* \u5934\u90E8 */}\n <div className=\"laptop:mb-12 mb-6\">\n <TabFilter tabs={data?.tabItems} />\n </div>\n <FilterHeader\n total={totalCount || 0}\n metafields={metafields}\n closeFilter={closeFilter}\n sortKeyIndx={sortKeyIndx}\n shopifyData={data}\n onSortChange={setSortKeyIndx}\n onCloseFilter={setCloseFilter}\n onClearFiltered={() => {\n setFiltered?.({})\n onFilteredChange?.(handleFilters({}))\n }}\n onMobileOpenDrawer={setMobileDrawerVisible}\n />\n {/* PC\u7B5B\u9009\u9009\u9879 */}\n <div className=\"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8\">\n {!closeFilter && (\n <FilterList\n result={result}\n filtered={filtered}\n filterPrice={filterPrice}\n openOptions={openOptions}\n closeFilter={closeFilter}\n shopifyData={data}\n metafields={metafields}\n mobileDrawerVisible={mobileDrawerVisible}\n onFilteredChange={v => {\n setFiltered(v)\n setCurrentPage(1)\n onFilteredChange?.(handleFilters(v))\n }}\n onClearFiltered={() => {\n setFiltered?.({})\n setCurrentPage(1)\n onFilteredChange?.(handleFilters({}))\n }}\n onOpenOptions={setOpenOptions}\n onCloseDrawer={setMobileDrawerVisible}\n />\n )}\n <div className=\"flex-1 overflow-y-auto relative\">\n <FilterCardWrap\n page={currentPage}\n result={result}\n shopifyData={data}\n total={totalCount}\n metafields={metafields}\n closeFilter={closeFilter}\n onNextPage={v => {\n setCurrentPage(currentPage + 1)\n onNextPage?.(v)\n }}\n onPrevPage={v => {\n setCurrentPage(currentPage - 1)\n onPrevPage?.(v)\n }}\n onPrimaryChange={(e, data) => onPrimaryChange?.(e, data)}\n onSecondaryChange={(e, data) => onSecondaryChange?.(e, data)}\n />\n {isLoading ? loadMore || null : null}\n </div>\n </div>\n </div>\n )\n}\n\nexport default withLayout(CollectionsFilters)"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAwEQ,IAAAI,EAAA,6BAxERC,EAAuB,2BACvBC,EAAyB,6BACzBC,EAA2B,+BAC3BC,EAA2B,kCAC3BC,EAAsB,oCACtBC,EAAkC,iBAClCC,EAAuD,kCAkBvD,SAASC,EAAmBC,EAAgC,CAC1D,KAAM,CACJ,KAAAC,EACA,OAAAC,EAAS,CAAC,EACV,UAAAC,EAAY,CAAC,EACb,SAAAC,EAAW,KACX,WAAAC,EAAa,CAAC,EACd,YAAAC,EAAc,CAAC,EACf,UAAAC,EAAY,GACZ,iBAAAC,EACA,uBAAAC,EACA,gBAAAC,EACA,kBAAAC,EACA,WAAAC,EACA,WAAAC,CACF,EAAIb,EAEE,CAAE,kBAAAc,CAAkB,EAAIT,EAExB,CAACU,EAAaC,CAAc,KAAI,YAAkB,EAAK,EACvD,CAACC,EAAqBC,CAAsB,KAAI,YAAkB,EAAK,EACvE,CAACC,EAAaC,CAAc,KAAI,YAAgB,CAAC,CAAC,EAClD,CAACC,EAAUC,CAAW,KAAI,YAAc,CAAC,CAAC,EAC1C,CAACC,EAAaC,CAAc,KAAI,YAAiB,CAAC,EAClD,CAACC,EAAaC,CAAc,KAAI,YAAiB,CAAC,KAGxD,WAAQ,IAAM,CACZ,MAAMC,EAAWb,GAAmB,YAAY,SAC1C,CAACc,EAASC,CAAO,KAAI,2BAAwBF,EAAUJ,CAAW,EACxEd,IAAyBmB,EAASC,CAAO,CAC3C,EAAG,CAACf,GAAmB,YAAY,SAAUO,EAAUE,CAAW,CAAC,EAMnE,MAAMO,EAAcC,GACX,CAACA,GAAS,YAAY,YAAY,QAErCC,KAAa,WAAQ,IAClB7B,GAAW,UAAU,OAAO2B,CAAU,GAAG,QAAU,EACzD,CAAC3B,GAAW,QAAQ,CAAC,EAExB,SACE,QAAC,OAAI,UAAU,uBAEb,oBAAC,OAAI,UAAU,oBACb,mBAAC,EAAA8B,QAAA,CAAU,KAAMhC,GAAM,SAAU,EACnC,KACA,OAAC,EAAAiC,QAAA,CACC,MAAOF,GAAc,EACrB,WAAY3B,EACZ,YAAaU,EACb,YAAaQ,EACb,YAAatB,EACb,aAAcuB,EACd,cAAeR,EACf,gBAAiB,IAAM,CACrBM,IAAc,CAAC,CAAC,EAChBd,OAAmB,iBAAc,CAAC,CAAC,CAAC,CACtC,EACA,mBAAoBU,EACtB,KAEA,QAAC,OAAI,UAAU,qEACZ,WAACH,MACA,OAAC,EAAAoB,QAAA,CACC,OAAQjC,EACR,SAAUmB,EACV,YAAaf,EACb,YAAaa,EACb,YAAaJ,EACb,YAAad,EACb,WAAYI,EACZ,oBAAqBY,EACrB,iBAAkBmB,GAAK,CACrBd,EAAYc,CAAC,EACbV,EAAe,CAAC,EAChBlB,OAAmB,iBAAc4B,CAAC,CAAC,CACrC,EACA,gBAAiB,IAAM,CACrBd,IAAc,CAAC,CAAC,EAChBI,EAAe,CAAC,EAChBlB,OAAmB,iBAAc,CAAC,CAAC,CAAC,CACtC,EACA,cAAeY,EACf,cAAeF,EACjB,KAEF,QAAC,OAAI,UAAU,kCACb,oBAAC,EAAAmB,QAAA,CACC,KAAMZ,EACN,OAAQvB,EACR,YAAaD,EACb,MAAO+B,EACP,WAAY3B,EACZ,YAAaU,EACb,WAAYqB,GAAK,CACfV,EAAeD,EAAc,CAAC,EAC9Bb,IAAawB,CAAC,CAChB,EACA,WAAYA,GAAK,CACfV,EAAeD,EAAc,CAAC,EAC9BZ,IAAauB,CAAC,CAChB,EACA,gBAAiB,CAACE,EAAGrC,IAASS,IAAkB4B,EAAGrC,CAAI,EACvD,kBAAmB,CAACqC,EAAGrC,IAASU,IAAoB2B,EAAGrC,CAAI,EAC7D,EACCM,GAAYH,GAAY,MAC3B,GACF,GACF,CAEJ,CAEA,IAAOf,KAAQ,cAAWU,CAAkB",
|
|
6
|
+
"names": ["CollectionsFilters_exports", "__export", "CollectionsFilters_default", "__toCommonJS", "import_jsx_runtime", "import_FilterList", "import_FilterHeader", "import_FilterCardWrap", "import_Styles", "import_TabFilter", "import_react", "import_filtersFun", "CollectionsFilters", "props", "data", "result", "allResult", "loadMore", "metafields", "filterPrice", "isLoading", "onFilteredChange", "onSortAndReverseChange", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "shop_filters_pair", "closeFilter", "setCloseFilter", "mobileDrawerVisible", "setMobileDrawerVisible", "openOptions", "setOpenOptions", "filtered", "setFiltered", "sortKeyIndx", "setSortKeyIndx", "currentPage", "setCurrentPage", "sortList", "sortKey", "reverse", "hasNoIndex", "product", "totalCount", "TabFilter", "FilterHeader", "FilterList", "v", "FilterCardWrap", "e"]
|
|
7
7
|
}
|
|
@@ -4,7 +4,7 @@ type FilterCardWrapProps = {
|
|
|
4
4
|
shopifyData?: any;
|
|
5
5
|
currentPage?: number;
|
|
6
6
|
closeFilter: boolean;
|
|
7
|
-
|
|
7
|
+
page: number;
|
|
8
8
|
metafields: any;
|
|
9
9
|
onPrimaryChange?: (item: any, sku: string) => void;
|
|
10
10
|
onSecondaryChange?: (item: any, sku: string) => void;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as a,jsxs as m}from"react/jsx-runtime";import{cn as D}from"../../helpers/utils.js";import{useMediaQuery as I}from"react-responsive";import"../Paginator/index.js";import N from"./FilterCardWrapItem";import{useState as M,useEffect as w}from"react";import{cloneDeep as L}from"es-toolkit";function j(y){const{shopifyData:f={},total:k,result:n,closeFilter:d,page:g,metafields:v,onPrimaryChange:P,onSecondaryChange:C,onNextPage:h,onPrevPage:F}=y,{advertisingSpace:x}=v,{buttonText:S}=f,i=x||f?.advertisingSpace,[p,u]=M([]),r=I({query:"(max-width: 768px)"}),b=s=>{const e=L(s||[]);if(i){const t=e.findIndex(l=>l.mImage);if(t===-1){const l=Math.min(d?i?.maxLocation||7:i?.minLocation||5,e.length);e.splice(l,0,i)}else{e.splice(t,1);const l=Math.min(d?i?.maxLocation||7:i?.minLocation||5,e.length);e.splice(l,0,i)}}return e};return w(()=>{(n?.slug||n?.id)&&((g===1||!r)&&u([]),n?.products&&u(s=>{const e=n.products?.filter?.(o=>!s.some(c=>c.id===o.id));let t=[...s,...e];const l=t.filter(o=>!(!o?.metafields?.seoSetting?.noindex&&o.availableForSale&&o?.variants?.some(c=>c.availableForSale)));return t=t.filter(o=>!o?.metafields?.seoSetting?.noindex&&o.availableForSale&&o?.variants?.some(c=>c.availableForSale)),t.push(...l),(g===1&&!r||r)&&(t=b(t)),t}))},[n?.products,g,r,x]),w(()=>{p?.length&&g===1&&!r&&u(b(p))},[d]),m("div",{className:"filter-card-wrap-container",children:[a("div",{className:D("min-h-[60vh] w-full grid gap-3 grid-cols-2",{"laptop:grid-cols-4 tablet:grid-cols-3":d&&!r,"laptop:grid-cols-3 tablet:grid-cols-2":!d&&!r},"filter-card-wrap"),children:p?.map?.(s=>a(N,{data:s,buttonText:S,metafields:v,onPrimaryChange:(e,t)=>P?.(e,t),onSecondaryChange:(e,t)=>C?.(e,t)},s.id))}),r?m("div",{onClick:()=>{h?.(n?.pageInfo?.endCursor)},className:"mt-6 text-base font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more",children:[a("span",{children:"View More"}),a("div",{className:"size-[18px]",children:a("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon",children:a("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"})})})]}):null,!r&&k>18?m("div",{className:"mt-6 flex items-center justify-end gap-4 cursor-pointer",children:[a("button",{name:"perv page",disabled:!n?.pageInfo?.hasPreviousPage,className:"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",onClick:()=>{F?.(n?.pageInfo?.startCursor)},children:a("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:a("path",{d:"M12 5L7 10L12 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})}),a("button",{name:"next page",className:"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",disabled:!n?.pageInfo?.hasNextPage,onClick:()=>{h?.(n?.pageInfo?.endCursor)},children:a("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:a("path",{d:"M7.5 5L12.5 10L7.5 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})})]}):null]})}export{j as default};
|
|
2
2
|
//# sourceMappingURL=FilterCardWrap.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrap.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\nimport Paginator from '../Paginator/index.js'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport { useState, useEffect } from 'react'\nimport { cloneDeep } from 'es-toolkit';\n\ntype FilterCardWrapProps = {\n result?: any\n total: number\n shopifyData?: any\n currentPage?: number\n closeFilter: boolean\n
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "cn", "useMediaQuery", "FilterCardWrapItem", "useState", "useEffect", "cloneDeep", "FilterCardWrap", "props", "shopifyData", "total", "result", "closeFilter", "
|
|
4
|
+
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\nimport Paginator from '../Paginator/index.js'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport { useState, useEffect } from 'react'\nimport { cloneDeep } from 'es-toolkit';\n\ntype FilterCardWrapProps = {\n result?: any\n total: number\n shopifyData?: any\n currentPage?: number\n closeFilter: boolean\n page: number\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n}\n\nexport default function FilterCardWrap(props: FilterCardWrapProps) {\n const { shopifyData = {}, total, result, closeFilter, page, metafields, onPrimaryChange, onSecondaryChange, onNextPage, onPrevPage } = props\n const { advertisingSpace } = metafields\n const { buttonText } = shopifyData\n\n const currentAdvertisingSpace = advertisingSpace || shopifyData?.advertisingSpace\n\n const [data, setData] = useState<any[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const handleAdvertisingSpace = (products: any[]) => {\n const updatedProducts = cloneDeep(products || [])\n if (currentAdvertisingSpace) {\n const findIndex = updatedProducts.findIndex(item => item.mImage)\n if (findIndex === -1) {\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n } else {\n updatedProducts.splice(findIndex, 1)\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n }\n }\n return updatedProducts\n }\n\n // \u5904\u7406\u4EA7\u54C1\u6570\u636E\n useEffect(() => {\n if (result?.slug || result?.id) {\n (page === 1 || !isMobile) && setData([])\n if (result?.products) {\n setData(prevProducts => {\n // \u68C0\u67E5\u662F\u5426\u5DF2\u7ECF\u5B58\u5728\u4E8E prevProducts \u4E2D\uFF0C\u907F\u514D\u91CD\u590D\u6DFB\u52A0\n const newProducts = result.products?.filter?.(\n (product: { id: any }) => !prevProducts.some(prev => prev.id === product.id)\n )\n let updatedProducts = [...prevProducts, ...newProducts]\n /** \u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1 */\n const soldOutProducts = updatedProducts.filter(\n item =>\n !(\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n )\n // \u8FC7\u6EE4\u6389 availableForSale \u4E3A false \u7684\u4EA7\u54C1\n updatedProducts = updatedProducts.filter(\n item =>\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n // \u5C06\u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1\u6DFB\u52A0\u5230\u6700\u540E\n updatedProducts.push(...soldOutProducts)\n // \u5982\u679C advertisingSpace \u5B58\u5728\u4E14\u5C1A\u672A\u6DFB\u52A0\u5230\u6570\u7EC4\u4E2D\n if ((page === 1 && !isMobile) || isMobile) {\n updatedProducts = handleAdvertisingSpace(updatedProducts)\n }\n return updatedProducts\n })\n }\n }\n }, [result?.products, page, isMobile, advertisingSpace])\n\n useEffect(() => {\n if(!data?.length) return\n if(page === 1 && !isMobile) {\n setData(handleAdvertisingSpace(data))\n }\n }, [closeFilter])\n\n return (\n <div className=\"filter-card-wrap-container\">\n <div\n className={cn(\n 'min-h-[60vh] w-full grid gap-3 grid-cols-2',\n {\n 'laptop:grid-cols-4 tablet:grid-cols-3': closeFilter && !isMobile,\n 'laptop:grid-cols-3 tablet:grid-cols-2': !closeFilter && !isMobile,\n },\n 'filter-card-wrap'\n )}\n >\n {data?.map?.(item => (\n <FilterCardWrapItem\n key={item.id}\n data={item}\n buttonText={buttonText}\n metafields={metafields}\n onPrimaryChange={(e, data) => onPrimaryChange?.(e, data)}\n onSecondaryChange={(e, data) => onSecondaryChange?.(e, data)}\n />\n ))}\n </div>\n {isMobile ? (\n <div\n onClick={() => {\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n className=\"mt-6 text-base font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more\"\n >\n <span>View More</span>\n <div className=\"size-[18px]\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n data-slot=\"icon\"\n >\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" />\n </svg>\n </div>\n </div>\n ) : null}\n {!isMobile && total > 18 ? (\n <div className=\"mt-6 flex items-center justify-end gap-4 cursor-pointer\">\n <button\n name=\"perv page\"\n disabled={!result?.pageInfo?.hasPreviousPage}\n className=\"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]\"\n onClick={() => {\n onPrevPage?.(result?.pageInfo?.startCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M12 5L7 10L12 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n <button\n name=\"next page\"\n className=\"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]\"\n disabled={!result?.pageInfo?.hasNextPage}\n onClick={() => {\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M7.5 5L12.5 10L7.5 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n </div>\n ) : // <Paginator\n // className=\"mt-6\"\n // currentPage={currentPage}\n // onPageChange={(v: number) => {\n // setData([])\n // if(v > currentPage) {\n // onNextPage?.(result?.pageInfo?.endCursor)\n // } else {\n // onPrevPage?.(result?.pageInfo?.startCursor)\n // }\n // setCurrentPage(v)\n // }}\n // total={100}\n // />\n null}\n </div>\n )\n}"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "cn", "useMediaQuery", "FilterCardWrapItem", "useState", "useEffect", "cloneDeep", "FilterCardWrap", "props", "shopifyData", "total", "result", "closeFilter", "page", "metafields", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "advertisingSpace", "buttonText", "currentAdvertisingSpace", "data", "setData", "isMobile", "handleAdvertisingSpace", "products", "updatedProducts", "findIndex", "item", "insertIndex", "prevProducts", "newProducts", "product", "prev", "soldOutProducts"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Fragment as ue,jsx as t,jsxs as a}from"react/jsx-runtime";import{cn as b}from"../../helpers/utils.js";import{useAiuiContext as re}from"../AiuiProvider/index.js";import{formatVariantPrice as oe}from"../ShelfDisplay/shelfDisplay.js";import ie from"../../components/badge.js";import{Heading as le}from"../../components/heading.js";import{Text as ne}from"../../components/text.js";import F from"../../components/button.js";import W from"../../components/picture.js";import{trackUrlRef as h}from"../../shared/trackUrlRef.js";import{getFunctionMemberPrice as ae}from"./component/price.js";import{useState as i,useEffect as k}from"react";const C="image",N="product_shelf",ce=999999999e-2,me=e=>{let c;return e?.includes("products")?c=e?.split("products")[0]+"files/":c=e?.replace(e?.split("files")?.pop()||"","")+"/",c},pe=({data:e,buttonText:c,itemShape:j,metafields:D,onPrimaryChange:H,onSecondaryChange:O})=>{const{memberPriceDiscount:U,memberSetting:_,discounts:S}=D,[m,w]=i(""),[A,P]=i(""),[u,$]=i(""),[E,V]=i({}),[T,R]=i({}),[q,x]=i(!1),[I,v]=i({price:"",basePrice:""}),[B,G]=i([]),[J,K]=i([]),[d,y]=i(""),{locale:l="us",copyWriting:Q,currencyCode:X,isLogin:M}=re(),f=e?.custom_name||e?.title||e?.name,L=e?.custom_description||e?.description||e?.descriptionHtml,n=e?.filter_variants||e?.variants||[],Y=s=>$(s);return k(()=>{if(u){const r=n?.find(g=>g?.name?.includes?.(u));w(r?.sku||n?.[0]?.sku||""),P(r?.image?.url||n?.[0]?.image?.url||"");return}const s=e?.options?.find(r=>r?.displayName==="color")?.values?.[0]?.label;s&&$(s);const o=n?.find(r=>r?.name?.includes?.(s));w(o?.sku||n?.[0]?.sku||""),P(o?.image?.url||n?.[0]?.image?.url||"")},[u]),k(()=>{if(!m)return;G(e?.tags||[]);const s=n?.find(p=>p?.sku===m)||n?.[0]||{};R(s),V(!s?.availableForSale&&s?.price?.amount===ce);const o=s?.coupons?.[0],{price:r,basePrice:g,discount:z}=oe({locale:l,amount:o?o.variant_price4wscode:s.price,baseAmount:o?s.price:0,currencyCode:e?.price?.currencyCode||"USD"});if(M){const p=ae({locale:l,variant:s,currencyCode:X||e?.price?.currencyCode||"USD",shopMemberPriceDiscountConfig:U});if(p){const{hasMemberPrice:Z,salePriceWithCurrency:ee,originalPriceWithCurrency:te,savePriceWithCurrency:se}=p;y(se||""),x(p?.hasMemberPrice),v({basePrice:te||"",price:Z?ee:""})}else x(!1),y(z||""),v({price:r,basePrice:g||""})}else x(!1),y(z||""),v({price:r,basePrice:g||""})},[e,m]),k(()=>{let s=[];if(d){const r=`${d}${S?.off}`;s.push(r)}const o=B?.filter?.(r=>r?.startsWith?.("CLtag"))?.map?.(r=>r?.replace?.("CLtag:",""))?.slice?.(0,d?1:2);K(s.concat(o))},[B,d]),t("div",{className:b(j==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white","bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300",{"aiui-dark":e.theme==="dark"}),children:e?.mImage?t("div",{className:"absolute inset-0 box-border overflow-hidden",children:a("a",{className:"relative inset-0 size-full",href:h(e?.link,`${C}_${N}`),children:[t(W,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full"}),a("div",{className:"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4",children:[t("p",{className:"mb-2 text-info-primary desktop:text-base text-sm font-bold",dangerouslySetInnerHTML:{__html:e?.subTitle}}),t("span",{className:"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6",dangerouslySetInnerHTML:{__html:e?.title}})]})]})}):a("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4",children:[t("div",{className:"flex flex-wrap gap-1 overflow-hidden collection-filter-tags",children:J?.map?.((s,o)=>t(ie,{className:"item-badge",children:s},o))}),t("a",{"aria-label":f,target:"_blank",href:h(`${l==="us"||!l?"":`/${l}`}/products/${e?.handle}`,`${C}_${N}`),children:t("div",{className:b("m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden"),children:t(W,{alt:"",source:A,className:"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit"})})}),e?.options?.map(s=>{if(s?.displayName==="color")return t("div",{className:"flex items-center gap-1",children:s?.values?.map(o=>{const r=o?.hexColors?o.hexColors?.[0]:o?.label;return t("button",{onClick:()=>Y(o?.label),className:b("size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent",`${u===o?.label?"border-[#00BEFA]":""}`),children:t("img",{alt:r,className:"h-full w-full object-cover",src:`${me(e?.images?.[0]?.url)}${r?.toLowerCase().split(" ")?.join("-")}_50x.png`})},o?.label)})})}),a("div",{children:[f?t(le,{as:"h3",size:2,html:f||"",title:f||"",className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base"}):null,e?.metafields?.judgemeBadge?t("a",{target:"_blank",className:"font-bold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:h(`${l==="us"||!l?"":`/${l}`}/products/${e?.handle}`,`${C}_${N}`)}):null,L?t(ne,{size:2,html:L||"",className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs"}):null,a("div",{className:"mt-3 mb-2",children:[t("p",{dangerouslySetInnerHTML:{__html:M&&q&&(S?.memberPrice||_?.member_price||_?.plus_member_price)||""},className:"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold"}),t("div",{className:"flex items-center",children:E?t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:Q?.soldOutText}):a(ue,{children:[t("div",{className:"final-price desktop:text-2xl text-info-primary text-base font-bold",children:T?.availableForSale&&I?.price||""}),t("div",{className:"origin-price desktop:text-xl text-info-secondary ml-1 text-sm font-bold line-through",children:T?.availableForSale&&I?.basePrice||""})]})})]}),a("div",{className:b("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col"),children:[t(F,{variant:"secondary",className:"m-tablet:w-full",onClick:()=>H?.(e,m),children:c?.secondaryButton||"Learn More"}),t(F,{variant:"primary",className:"m-tablet:w-full",onClick:()=>O?.(e,m),children:c?.primaryButton||"Shop Now"})]})]})]})},e?.id||e?.handle)};var _e=pe;export{_e as default};
|
|
1
|
+
import{Fragment as ue,jsx as t,jsxs as a}from"react/jsx-runtime";import{cn as b}from"../../helpers/utils.js";import{useAiuiContext as re}from"../AiuiProvider/index.js";import{formatVariantPrice as oe}from"../ShelfDisplay/shelfDisplay.js";import ie from"../../components/badge.js";import{Heading as le}from"../../components/heading.js";import{Text as ne}from"../../components/text.js";import F from"../../components/button.js";import W from"../../components/picture.js";import{trackUrlRef as h}from"../../shared/trackUrlRef.js";import{getFunctionMemberPrice as ae}from"./component/price.js";import{useState as i,useEffect as k}from"react";const C="image",N="product_shelf",ce=999999999e-2,me=e=>{let c;return e?.includes("products")?c=e?.split("products")[0]+"files/":c=e?.replace(e?.split("files")?.pop()||"","")+"/",c},pe=({data:e,buttonText:c,itemShape:j,metafields:D,onPrimaryChange:H,onSecondaryChange:O})=>{const{memberPriceDiscount:U,memberSetting:_,discounts:S}=D,[m,w]=i(""),[A,P]=i(""),[u,$]=i(""),[E,V]=i({}),[T,R]=i({}),[q,x]=i(!1),[I,v]=i({price:"",basePrice:""}),[B,G]=i([]),[J,K]=i([]),[d,y]=i(""),{locale:l="us",copyWriting:Q,currencyCode:X,isLogin:M}=re(),f=e?.custom_name||e?.title||e?.name,L=e?.custom_description||e?.description||e?.descriptionHtml,n=e?.filter_variants||e?.variants||[],Y=s=>$(s);return k(()=>{if(u){const r=n?.find(g=>g?.name?.includes?.(u));w(r?.sku||n?.[0]?.sku||""),P(r?.image?.url||n?.[0]?.image?.url||"");return}const s=e?.options?.find(r=>r?.displayName==="color")?.values?.[0]?.label;s&&$(s);const o=n?.find(r=>r?.name?.includes?.(s));w(o?.sku||n?.[0]?.sku||""),P(o?.image?.url||n?.[0]?.image?.url||"")},[u]),k(()=>{if(!m)return;G(e?.tags||[]);const s=n?.find(p=>p?.sku===m)||n?.[0]||{};R(s),V(!s?.availableForSale&&s?.price?.amount===ce);const o=s?.coupons?.[0],{price:r,basePrice:g,discount:z}=oe({locale:l,amount:o?o.variant_price4wscode:s.price,baseAmount:o?s.price:0,currencyCode:e?.price?.currencyCode||"USD"});if(M){const p=ae({locale:l,variant:s,currencyCode:X||e?.price?.currencyCode||"USD",shopMemberPriceDiscountConfig:U});if(p){const{hasMemberPrice:Z,salePriceWithCurrency:ee,originalPriceWithCurrency:te,savePriceWithCurrency:se}=p;y(se||""),x(p?.hasMemberPrice),v({basePrice:te||"",price:Z?ee:""})}else x(!1),y(z||""),v({price:r,basePrice:g||""})}else x(!1),y(z||""),v({price:r,basePrice:g||""})},[e,m]),k(()=>{let s=[];if(d){const r=`${d}${S?.off}`;s.push(r)}const o=B?.filter?.(r=>r?.startsWith?.("CLtag"))?.map?.(r=>r?.replace?.("CLtag:",""))?.slice?.(0,d?1:2);K(s.concat(o))},[B,d]),t("div",{className:b(j==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white","bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300",{"aiui-dark":e.theme==="dark"}),children:e?.mImage?t("div",{className:"absolute inset-0 box-border overflow-hidden",children:a("a",{className:"relative inset-0 size-full",href:h(e?.link,`${C}_${N}`),children:[t(W,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full"}),a("div",{className:"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4",children:[t("p",{className:"mb-2 text-info-primary desktop:text-base text-sm font-bold",dangerouslySetInnerHTML:{__html:e?.subTitle}}),t("span",{className:"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6",dangerouslySetInnerHTML:{__html:e?.title}})]})]})}):a("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4",children:[t("div",{className:"flex flex-wrap gap-1 overflow-hidden collection-filter-tags",children:J?.map?.((s,o)=>t(ie,{className:"item-badge",children:s},o))}),t("a",{"aria-label":f,target:"_blank",href:h(`${l==="us"||!l?"":`/${l}`}/products/${e?.handle}`,`${C}_${N}`),children:t("div",{className:b("m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden"),children:t(W,{alt:"",source:A,className:"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit"})})}),e?.options?.map(s=>{if(s?.displayName==="color")return t("div",{className:"flex items-center gap-1",children:s?.values?.map(o=>{const r=o?.hexColors?o.hexColors?.[0]:o?.label;return t("button",{onClick:()=>Y(o?.label),className:b("size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent",`${u===o?.label?"border-[#00BEFA]":""}`),children:t("img",{alt:r,className:"h-full w-full object-cover",src:`${me(e?.images?.[0]?.url)}${r?.toLowerCase().split(" ")?.join("-")}_50x.png`})},o?.label)})})}),a("div",{children:[f?t(le,{as:"h3",size:2,html:f||"",title:f||"",className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base"}):null,e?.metafields?.judgemeBadge?t("a",{target:"_blank",className:"font-bold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:h(`${l==="us"||!l?"":`/${l}`}/products/${e?.handle}`,`${C}_${N}`)}):null,L?t(ne,{size:2,html:L||"",className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs"}):null,a("div",{className:"mt-3 mb-2",children:[t("p",{dangerouslySetInnerHTML:{__html:M&&q&&(S?.memberPrice||_?.member_price||_?.plus_member_price)||""},className:"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold"}),t("div",{className:"flex items-center",children:E?t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:Q?.soldOutText}):a(ue,{children:[t("div",{className:"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold",children:T?.availableForSale&&I?.price||""}),t("div",{className:"origin-price desktop:text-xl tablet:text-lg text-info-secondary ml-1 text-sm font-bold line-through",children:T?.availableForSale&&I?.basePrice||""})]})})]}),a("div",{className:b("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col"),children:[t(F,{variant:"secondary",className:"m-tablet:w-full",onClick:()=>H?.(e,m),children:c?.secondaryButton||"Learn More"}),t(F,{variant:"primary",className:"m-tablet:w-full",onClick:()=>O?.(e,m),children:c?.primaryButton||"Shop Now"})]})]})]})},e?.id||e?.handle)};var _e=pe;export{_e as default};
|
|
2
2
|
//# sourceMappingURL=FilterCardWrapItem.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrapItem.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport Badge from '../../components/badge.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getFunctionMemberPrice } from './component/price.js'\nimport { useState, useEffect } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nconst getShopifyCdnBaseUrl = (imagePath: string | null) => {\n // \u76EE\u524D\u77E5\u9053\u7684 shopify \u56FE\u7247\u8DEF\u7531\u7684\u5F62\u5F0F\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/files/Group_5581_2.jpg?v=1662379184\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/products/B2633123.jpg?v=1631264041_3840x\n // \u8FD4\u56DE https://cdn.shopify.com/s/files/1/0493/9834/9974/files/\n let path\n if (imagePath?.includes('products')) {\n path = imagePath?.split('products')[0] + 'files/'\n } else {\n path = imagePath?.replace(imagePath?.split('files')?.pop() || '', '') + '/'\n }\n return path\n}\n\ntype FilterCardWrapItemProps = {\n data: any\n buttonText?: any\n itemShape?: string\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\n\nconst FilterCardWrapItem = ({\n data,\n buttonText,\n itemShape,\n metafields,\n onPrimaryChange,\n onSecondaryChange,\n}: FilterCardWrapItemProps) => {\n const { memberPriceDiscount, memberSetting, discounts } = metafields\n const [currentSku, setCurrentSku] = useState<string>('')\n const [currentImage, setCurrentImage] = useState<string>('')\n const [selectedColor, setSelectedColor] = useState<string>('')\n const [isSoldOut, setIsSoldOut] = useState<any>({})\n const [currentVariant, setCurrentVariant] = useState<any>({})\n const [plusMemberStatus, setPlusMemberStatus] = useState<boolean>(false)\n const [priceCollection, setPriceCollection] = useState<{ price: string; basePrice: string }>({\n price: '',\n basePrice: '',\n })\n const [tags, setTags] = useState<string[]>([])\n const [showTags, setShowTags] = useState<string[]>([])\n const [discountCollection, setDiscountCollection] = useState<string>('')\n\n const { locale = 'us', copyWriting, currencyCode, isLogin } = useAiuiContext()\n\n const displayTitle = data?.custom_name || data?.title || data?.name\n const displayDescription = data?.custom_description || data?.description || data?.descriptionHtml\n const skuArray = data?.filter_variants || data?.variants || []\n\n const onColorClick = (color: string) => setSelectedColor(color)\n\n useEffect(() => {\n if (selectedColor) {\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(selectedColor))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n return\n }\n const firstOption = data?.options?.find((item: any) => item?.displayName === 'color')?.values?.[0]?.label\n firstOption && setSelectedColor(firstOption)\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(firstOption))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n }, [selectedColor])\n\n useEffect(() => {\n if (!currentSku) return\n setTags(data?.tags || [])\n const variant = skuArray?.find((item: any) => item?.sku === currentSku) || skuArray?.[0] || {}\n setCurrentVariant(variant)\n setIsSoldOut(!variant?.availableForSale && variant?.price?.amount === SOLD_OUT_PRICE)\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n const { price, basePrice, discount } = formatVariantPrice({\n locale: locale,\n amount: coupon ? coupon.variant_price4wscode : variant.price,\n baseAmount: coupon ? variant.price : 0,\n currencyCode: data?.price?.currencyCode || 'USD',\n })\n // \u4F1A\u5458\u6298\u6263\n if (isLogin) {\n const result = getFunctionMemberPrice({\n locale: locale,\n variant: variant,\n currencyCode: currencyCode || data?.price?.currencyCode || 'USD',\n shopMemberPriceDiscountConfig: memberPriceDiscount,\n })\n if (result) {\n const { hasMemberPrice, salePriceWithCurrency, originalPriceWithCurrency, savePriceWithCurrency } = result\n setDiscountCollection(savePriceWithCurrency || '')\n setPlusMemberStatus(result?.hasMemberPrice)\n setPriceCollection({\n basePrice: originalPriceWithCurrency || '',\n price: hasMemberPrice ? salePriceWithCurrency : ''\n })\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n }, [data, currentSku])\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discountCollection) {\n const discountTag = `${discountCollection}${discounts?.off}`\n handleTags.push(discountTag)\n }\n const newTags = tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discountCollection ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [tags, discountCollection])\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white',\n 'bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n {\n 'aiui-dark': data.theme === 'dark',\n }\n )}\n >\n {data?.mImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden\">\n <a className=\"relative inset-0 size-full\" href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}>\n <Picture\n alt=\"\"\n source={data?.mImage?.url || data?.mImage}\n className=\"size-full [&_img]:object-cover [&_img]:size-full\"\n />\n <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n <p\n className=\"mb-2 text-info-primary desktop:text-base text-sm font-bold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n />\n <span\n className=\"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4\">\n <div className=\"flex flex-wrap gap-1 overflow-hidden collection-filter-tags\">\n {showTags?.map?.((item: string, index: number) => (\n <Badge key={index} className=\"item-badge\">\n {item}\n </Badge>\n ))}\n </div>\n <a\n aria-label={displayTitle}\n target=\"_blank\"\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n >\n <div className={cn('m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden')}>\n <Picture\n alt=\"\"\n source={currentImage}\n className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n />\n </div>\n </a>\n {data?.options?.map((option: any) => {\n if (option?.displayName === 'color') {\n return (\n <div className=\"flex items-center gap-1\">\n {option?.values?.map((item: any) => {\n const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n return (\n <button\n key={item?.label}\n onClick={() => onColorClick(item?.label)}\n className={cn(\n 'size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent',\n `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n )}\n >\n <img\n alt={color}\n className=\"h-full w-full object-cover\"\n src={`${getShopifyCdnBaseUrl(data?.images?.[0]?.url)}${color\n ?.toLowerCase()\n .split(' ')\n ?.join('-')}_${'50x'}.png`}\n />\n </button>\n )\n })}\n </div>\n )\n }\n })}\n <div>\n {displayTitle ? (\n <Heading\n as=\"h3\"\n size={2}\n html={displayTitle || ''}\n title={displayTitle || ''}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-bold text-xs [&_.jdgm-star]:text-[#F77234]\"\n dangerouslySetInnerHTML={{ __html: data?.metafields?.judgemeBadge }}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n />\n ) : null}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription || ''}\n className=\"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs\"\n />\n ) : null}\n <div className=\"mt-3 mb-2\">\n <p\n dangerouslySetInnerHTML={{\n __html:\n isLogin && plusMemberStatus\n ? discounts?.memberPrice || memberSetting?.member_price || memberSetting?.plus_member_price || ''\n : '',\n }}\n className=\"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold\"\n />\n <div className=\"flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price desktop:text-2xl text-info-primary text-base font-bold\">\n {currentVariant?.availableForSale ? priceCollection?.price || '' : ''}\n </div>\n <div className=\"origin-price desktop:text-xl text-info-secondary ml-1 text-sm font-bold line-through\">\n {currentVariant?.availableForSale ? priceCollection?.basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col')}\n >\n <Button\n variant=\"secondary\"\n className=\"m-tablet:w-full\"\n onClick={() => onPrimaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.primaryButton || 'Shop Now'}\n </Button>\n </div>\n </div>\n </div>\n )}\n </div>\n )\n}\nexport default FilterCardWrapItem\n"],
|
|
5
|
-
"mappings": "AA4JY,OAkHM,YAAAA,GAlHN,OAAAC,EAKA,QAAAC,MALA,oBA5JZ,OAAS,MAAAC,MAAU,yBACnB,OAAS,kBAAAC,OAAsB,2BAC/B,OAAS,sBAAAC,OAA0B,kCACnC,OAAOC,OAAW,4BAClB,OAAS,WAAAC,OAAe,8BACxB,OAAS,QAAAC,OAAY,2BACrB,OAAOC,MAAY,6BACnB,OAAOC,MAAa,8BACpB,OAAS,eAAAC,MAAmB,8BAC5B,OAAS,0BAAAC,OAA8B,uBACvC,OAAS,YAAAC,EAAU,aAAAC,MAAiB,QAEpC,MAAMC,EAAgB,QAChBC,EAAgB,gBAEhBC,GAAiB,aAEjBC,GAAwBC,GAA6B,CAKzD,IAAIC,EACJ,OAAID,GAAW,SAAS,UAAU,EAChCC,EAAOD,GAAW,MAAM,UAAU,EAAE,CAAC,EAAI,SAEzCC,EAAOD,GAAW,QAAQA,GAAW,MAAM,OAAO,GAAG,IAAI,GAAK,GAAI,EAAE,EAAI,IAEnEC,CACT,EAWMC,GAAqB,CAAC,CAC1B,KAAAC,EACA,WAAAC,EACA,UAAAC,EACA,WAAAC,EACA,gBAAAC,EACA,kBAAAC,CACF,IAA+B,CAC7B,KAAM,CAAE,oBAAAC,EAAqB,cAAAC,EAAe,UAAAC,CAAU,EAAIL,EACpD,CAACM,EAAYC,CAAa,EAAInB,EAAiB,EAAE,EACjD,CAACoB,EAAcC,CAAe,EAAIrB,EAAiB,EAAE,EACrD,CAACsB,EAAeC,CAAgB,EAAIvB,EAAiB,EAAE,EACvD,CAACwB,EAAWC,CAAY,EAAIzB,EAAc,CAAC,CAAC,EAC5C,CAAC0B,EAAgBC,CAAiB,EAAI3B,EAAc,CAAC,CAAC,EACtD,CAAC4B,EAAkBC,CAAmB,EAAI7B,EAAkB,EAAK,EACjE,CAAC8B,EAAiBC,CAAkB,EAAI/B,EAA+C,CAC3F,MAAO,GACP,UAAW,EACb,CAAC,EACK,CAACgC,EAAMC,CAAO,EAAIjC,EAAmB,CAAC,CAAC,EACvC,CAACkC,EAAUC,CAAW,EAAInC,EAAmB,CAAC,CAAC,EAC/C,CAACoC,EAAoBC,CAAqB,EAAIrC,EAAiB,EAAE,EAEjE,CAAE,OAAAsC,EAAS,KAAM,YAAAC,EAAa,aAAAC,EAAc,QAAAC,CAAQ,EAAIlD,GAAe,EAEvEmD,EAAejC,GAAM,aAAeA,GAAM,OAASA,GAAM,KACzDkC,EAAqBlC,GAAM,oBAAsBA,GAAM,aAAeA,GAAM,gBAC5EmC,EAAWnC,GAAM,iBAAmBA,GAAM,UAAY,CAAC,EAEvDoC,EAAgBC,GAAkBvB,EAAiBuB,CAAK,EAE9D,OAAA7C,EAAU,IAAM,CACd,GAAIqB,EAAe,CACjB,MAAMyB,EAAUH,GAAU,KAAMI,GAAcA,GAAM,MAAM,WAAW1B,CAAa,CAAC,EACnFH,EAAc4B,GAAS,KAAOH,IAAW,CAAC,GAAG,KAAO,EAAE,EACtDvB,EAAgB0B,GAAS,OAAO,KAAOH,IAAW,CAAC,GAAG,OAAO,KAAO,EAAE,EACtE,MACF,CACA,MAAMK,EAAcxC,GAAM,SAAS,KAAMuC,GAAcA,GAAM,cAAgB,OAAO,GAAG,SAAS,CAAC,GAAG,MACpGC,GAAe1B,EAAiB0B,CAAW,EAC3C,MAAMF,EAAUH,GAAU,KAAMI,GAAcA,GAAM,MAAM,WAAWC,CAAW,CAAC,EACjF9B,EAAc4B,GAAS,KAAOH,IAAW,CAAC,GAAG,KAAO,EAAE,EACtDvB,EAAgB0B,GAAS,OAAO,KAAOH,IAAW,CAAC,GAAG,OAAO,KAAO,EAAE,CACxE,EAAG,CAACtB,CAAa,CAAC,EAElBrB,EAAU,IAAM,CACd,GAAI,CAACiB,EAAY,OACjBe,EAAQxB,GAAM,MAAQ,CAAC,CAAC,EACxB,MAAMyC,EAAUN,GAAU,KAAMI,GAAcA,GAAM,MAAQ9B,CAAU,GAAK0B,IAAW,CAAC,GAAK,CAAC,EAC7FjB,EAAkBuB,CAAO,EACzBzB,EAAa,CAACyB,GAAS,kBAAoBA,GAAS,OAAO,SAAW9C,EAAc,EAEpF,MAAM+C,EAASD,GAAS,UAAU,CAAC,EAC7B,CAAE,MAAAE,EAAO,UAAAC,EAAW,SAAAC,CAAS,EAAI9D,GAAmB,CACxD,OAAQ8C,EACR,OAAQa,EAASA,EAAO,qBAAuBD,EAAQ,MACvD,WAAYC,EAASD,EAAQ,MAAQ,EACrC,aAAczC,GAAM,OAAO,cAAgB,KAC7C,CAAC,EAED,GAAIgC,EAAS,CACX,MAAMc,EAASxD,GAAuB,CACpC,OAAQuC,EACR,QAASY,EACT,aAAcV,GAAgB/B,GAAM,OAAO,cAAgB,MAC3D,8BAA+BM,CACjC,CAAC,EACD,GAAIwC,EAAQ,CACV,KAAM,CAAE,eAAAC,EAAgB,sBAAAC,GAAuB,0BAAAC,GAA2B,sBAAAC,EAAsB,EAAIJ,EACpGlB,EAAsBsB,IAAyB,EAAE,EACjD9B,EAAoB0B,GAAQ,cAAc,EAC1CxB,EAAmB,CACjB,UAAW2B,IAA6B,GACxC,MAAOF,EAAiBC,GAAwB,EAClD,CAAC,CACH,MACE5B,EAAoB,EAAK,EACzBQ,EAAsBiB,GAAY,EAAE,EACpCvB,EAAmB,CAAE,MAAOqB,EAAO,UAAWC,GAAa,EAAG,CAAC,CAEnE,MACExB,EAAoB,EAAK,EACzBQ,EAAsBiB,GAAY,EAAE,EACpCvB,EAAmB,CAAE,MAAOqB,EAAO,UAAWC,GAAa,EAAG,CAAC,CAEnE,EAAG,CAAC5C,EAAMS,CAAU,CAAC,EAGrBjB,EAAU,IAAM,CACd,IAAI2D,EAAuB,CAAC,EAC5B,GAAIxB,EAAoB,CACtB,MAAMyB,EAAc,GAAGzB,CAAkB,GAAGnB,GAAW,GAAG,GAC1D2C,EAAW,KAAKC,CAAW,CAC7B,CACA,MAAMC,EAAU9B,GACZ,SAAUgB,GAAiBA,GAAM,aAAa,OAAO,CAAC,GACtD,MAAOA,GAAiBA,GAAM,UAAU,SAAU,EAAE,CAAC,GACrD,QAAQ,EAAGZ,EAAqB,EAAI,CAAC,EACzCD,EAAYyB,EAAW,OAAOE,CAAO,CAAC,CACxC,EAAG,CAAC9B,EAAMI,CAAkB,CAAC,EAG3BhD,EAAC,OAEC,UAAWE,EACTqB,IAAc,QAAU,cAAgB,eACxC,sFACA,yFACA,CACE,YAAaF,EAAK,QAAU,MAC9B,CACF,EAEC,SAAAA,GAAM,OACLrB,EAAC,OAAI,UAAU,8CACb,SAAAC,EAAC,KAAE,UAAU,6BAA6B,KAAMS,EAAYW,GAAM,KAAM,GAAGP,CAAa,IAAIC,CAAa,EAAE,EACzG,UAAAf,EAACS,EAAA,CACC,IAAI,GACJ,OAAQY,GAAM,QAAQ,KAAOA,GAAM,OACnC,UAAU,mDACZ,EACApB,EAAC,OAAI,UAAU,sEACb,UAAAD,EAAC,KACC,UAAU,6DACV,wBAAyB,CAAE,OAAQqB,GAAM,QAAS,EACpD,EACArB,EAAC,QACC,UAAU,sEACV,wBAAyB,CAAE,OAAQqB,GAAM,KAAM,EACjD,GACF,GACF,EACF,EAEApB,EAAC,OAAI,UAAU,4GACb,UAAAD,EAAC,OAAI,UAAU,8DACZ,SAAA8C,GAAU,MAAM,CAACc,EAAce,IAC9B3E,EAACK,GAAA,CAAkB,UAAU,aAC1B,SAAAuD,GADSe,CAEZ,CACD,EACH,EACA3E,EAAC,KACC,aAAYsD,EACZ,OAAO,SACP,KAAM5C,EACJ,GAAGwC,IAAW,MAAQ,CAACA,EAAS,GAAK,IAAIA,CAAM,EAAE,aAAa7B,GAAM,MAAM,GAC1E,GAAGP,CAAa,IAAIC,CAAa,EACnC,EAEA,SAAAf,EAAC,OAAI,UAAWE,EAAG,kFAAkF,EACnG,SAAAF,EAACS,EAAA,CACC,IAAI,GACJ,OAAQuB,EACR,UAAU,2DACZ,EACF,EACF,EACCX,GAAM,SAAS,IAAKuD,GAAgB,CACnC,GAAIA,GAAQ,cAAgB,QAC1B,OACE5E,EAAC,OAAI,UAAU,0BACZ,SAAA4E,GAAQ,QAAQ,IAAKhB,GAAc,CAClC,MAAMF,EAAQE,GAAM,UAAYA,EAAK,YAAY,CAAC,EAAIA,GAAM,MAC5D,OACE5D,EAAC,UAEC,QAAS,IAAMyD,EAAaG,GAAM,KAAK,EACvC,UAAW1D,EACT,iFACA,GAAGgC,IAAkB0B,GAAM,MAAQ,mBAAqB,EAAE,EAC5D,EAEA,SAAA5D,EAAC,OACC,IAAK0D,EACL,UAAU,6BACV,IAAK,GAAGzC,GAAqBI,GAAM,SAAS,CAAC,GAAG,GAAG,CAAC,GAAGqC,GACnD,YAAY,EACb,MAAM,GAAG,GACR,KAAK,GAAG,CAAC,WACf,GAdKE,GAAM,KAeb,CAEJ,CAAC,EACH,CAGN,CAAC,EACD3D,EAAC,OACE,UAAAqD,EACCtD,EAACM,GAAA,CACC,GAAG,KACH,KAAM,EACN,KAAMgD,GAAgB,GACtB,MAAOA,GAAgB,GACvB,UAAU,wFACZ,EACE,KACHjC,GAAM,YAAY,aACjBrB,EAAC,KACC,OAAO,SACP,UAAU,kDACV,wBAAyB,CAAE,OAAQqB,GAAM,YAAY,YAAa,EAClE,KAAMX,EACJ,GAAGwC,IAAW,MAAQ,CAACA,EAAS,GAAK,IAAIA,CAAM,EAAE,aAAa7B,GAAM,MAAM,GAC1E,GAAGP,CAAa,IAAIC,CAAa,EACnC,EACF,EACE,KACHwC,EACCvD,EAACO,GAAA,CACC,KAAM,EACN,KAAMgD,GAAsB,GAC5B,UAAU,0FACZ,EACE,KACJtD,EAAC,OAAI,UAAU,YACb,UAAAD,EAAC,KACC,wBAAyB,CACvB,OACEqD,GAAWb,IACPX,GAAW,aAAeD,GAAe,cAAgBA,GAAe,oBAAqB,EAErG,EACA,UAAU,0FACZ,EACA5B,EAAC,OAAI,UAAU,oBACZ,SAAAoC,EACCpC,EAAC,OAAI,UAAU,sDAAuD,SAAAmD,GAAa,YAAY,EAE/FlD,EAAAF,GAAA,CACE,UAAAC,EAAC,OAAI,UAAU,
|
|
4
|
+
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport Badge from '../../components/badge.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getFunctionMemberPrice } from './component/price.js'\nimport { useState, useEffect } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nconst getShopifyCdnBaseUrl = (imagePath: string | null) => {\n // \u76EE\u524D\u77E5\u9053\u7684 shopify \u56FE\u7247\u8DEF\u7531\u7684\u5F62\u5F0F\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/files/Group_5581_2.jpg?v=1662379184\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/products/B2633123.jpg?v=1631264041_3840x\n // \u8FD4\u56DE https://cdn.shopify.com/s/files/1/0493/9834/9974/files/\n let path\n if (imagePath?.includes('products')) {\n path = imagePath?.split('products')[0] + 'files/'\n } else {\n path = imagePath?.replace(imagePath?.split('files')?.pop() || '', '') + '/'\n }\n return path\n}\n\ntype FilterCardWrapItemProps = {\n data: any\n buttonText?: any\n itemShape?: string\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\n\nconst FilterCardWrapItem = ({\n data,\n buttonText,\n itemShape,\n metafields,\n onPrimaryChange,\n onSecondaryChange,\n}: FilterCardWrapItemProps) => {\n const { memberPriceDiscount, memberSetting, discounts } = metafields\n const [currentSku, setCurrentSku] = useState<string>('')\n const [currentImage, setCurrentImage] = useState<string>('')\n const [selectedColor, setSelectedColor] = useState<string>('')\n const [isSoldOut, setIsSoldOut] = useState<any>({})\n const [currentVariant, setCurrentVariant] = useState<any>({})\n const [plusMemberStatus, setPlusMemberStatus] = useState<boolean>(false)\n const [priceCollection, setPriceCollection] = useState<{ price: string; basePrice: string }>({\n price: '',\n basePrice: '',\n })\n const [tags, setTags] = useState<string[]>([])\n const [showTags, setShowTags] = useState<string[]>([])\n const [discountCollection, setDiscountCollection] = useState<string>('')\n\n const { locale = 'us', copyWriting, currencyCode, isLogin } = useAiuiContext()\n\n const displayTitle = data?.custom_name || data?.title || data?.name\n const displayDescription = data?.custom_description || data?.description || data?.descriptionHtml\n const skuArray = data?.filter_variants || data?.variants || []\n\n const onColorClick = (color: string) => setSelectedColor(color)\n\n useEffect(() => {\n if (selectedColor) {\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(selectedColor))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n return\n }\n const firstOption = data?.options?.find((item: any) => item?.displayName === 'color')?.values?.[0]?.label\n firstOption && setSelectedColor(firstOption)\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(firstOption))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n }, [selectedColor])\n\n useEffect(() => {\n if (!currentSku) return\n setTags(data?.tags || [])\n const variant = skuArray?.find((item: any) => item?.sku === currentSku) || skuArray?.[0] || {}\n setCurrentVariant(variant)\n setIsSoldOut(!variant?.availableForSale && variant?.price?.amount === SOLD_OUT_PRICE)\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n const { price, basePrice, discount } = formatVariantPrice({\n locale: locale,\n amount: coupon ? coupon.variant_price4wscode : variant.price,\n baseAmount: coupon ? variant.price : 0,\n currencyCode: data?.price?.currencyCode || 'USD',\n })\n // \u4F1A\u5458\u6298\u6263\n if (isLogin) {\n const result = getFunctionMemberPrice({\n locale: locale,\n variant: variant,\n currencyCode: currencyCode || data?.price?.currencyCode || 'USD',\n shopMemberPriceDiscountConfig: memberPriceDiscount,\n })\n if (result) {\n const { hasMemberPrice, salePriceWithCurrency, originalPriceWithCurrency, savePriceWithCurrency } = result\n setDiscountCollection(savePriceWithCurrency || '')\n setPlusMemberStatus(result?.hasMemberPrice)\n setPriceCollection({\n basePrice: originalPriceWithCurrency || '',\n price: hasMemberPrice ? salePriceWithCurrency : ''\n })\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n } else {\n setPlusMemberStatus(false)\n setDiscountCollection(discount || '')\n setPriceCollection({ price: price, basePrice: basePrice || '' })\n }\n }, [data, currentSku])\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discountCollection) {\n const discountTag = `${discountCollection}${discounts?.off}`\n handleTags.push(discountTag)\n }\n const newTags = tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discountCollection ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [tags, discountCollection])\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white',\n 'bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n {\n 'aiui-dark': data.theme === 'dark',\n }\n )}\n >\n {data?.mImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden\">\n <a className=\"relative inset-0 size-full\" href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}>\n <Picture\n alt=\"\"\n source={data?.mImage?.url || data?.mImage}\n className=\"size-full [&_img]:object-cover [&_img]:size-full\"\n />\n <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n <p\n className=\"mb-2 text-info-primary desktop:text-base text-sm font-bold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n />\n <span\n className=\"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4\">\n <div className=\"flex flex-wrap gap-1 overflow-hidden collection-filter-tags\">\n {showTags?.map?.((item: string, index: number) => (\n <Badge key={index} className=\"item-badge\">\n {item}\n </Badge>\n ))}\n </div>\n <a\n aria-label={displayTitle}\n target=\"_blank\"\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n >\n <div className={cn('m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden')}>\n <Picture\n alt=\"\"\n source={currentImage}\n className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n />\n </div>\n </a>\n {data?.options?.map((option: any) => {\n if (option?.displayName === 'color') {\n return (\n <div className=\"flex items-center gap-1\">\n {option?.values?.map((item: any) => {\n const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n return (\n <button\n key={item?.label}\n onClick={() => onColorClick(item?.label)}\n className={cn(\n 'size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent',\n `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n )}\n >\n <img\n alt={color}\n className=\"h-full w-full object-cover\"\n src={`${getShopifyCdnBaseUrl(data?.images?.[0]?.url)}${color\n ?.toLowerCase()\n .split(' ')\n ?.join('-')}_${'50x'}.png`}\n />\n </button>\n )\n })}\n </div>\n )\n }\n })}\n <div>\n {displayTitle ? (\n <Heading\n as=\"h3\"\n size={2}\n html={displayTitle || ''}\n title={displayTitle || ''}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-bold text-xs [&_.jdgm-star]:text-[#F77234]\"\n dangerouslySetInnerHTML={{ __html: data?.metafields?.judgemeBadge }}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n />\n ) : null}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription || ''}\n className=\"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs\"\n />\n ) : null}\n <div className=\"mt-3 mb-2\">\n <p\n dangerouslySetInnerHTML={{\n __html:\n isLogin && plusMemberStatus\n ? discounts?.memberPrice || memberSetting?.member_price || memberSetting?.plus_member_price || ''\n : '',\n }}\n className=\"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold\"\n />\n <div className=\"flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold\">\n {currentVariant?.availableForSale ? priceCollection?.price || '' : ''}\n </div>\n <div className=\"origin-price desktop:text-xl tablet:text-lg text-info-secondary ml-1 text-sm font-bold line-through\">\n {currentVariant?.availableForSale ? priceCollection?.basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col')}\n >\n <Button\n variant=\"secondary\"\n className=\"m-tablet:w-full\"\n onClick={() => onPrimaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.primaryButton || 'Shop Now'}\n </Button>\n </div>\n </div>\n </div>\n )}\n </div>\n )\n}\nexport default FilterCardWrapItem\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "cn", "useAiuiContext", "formatVariantPrice", "Badge", "Heading", "Text", "Button", "Picture", "trackUrlRef", "getFunctionMemberPrice", "useState", "useEffect", "componentType", "componentName", "SOLD_OUT_PRICE", "getShopifyCdnBaseUrl", "imagePath", "path", "FilterCardWrapItem", "data", "buttonText", "itemShape", "metafields", "onPrimaryChange", "onSecondaryChange", "memberPriceDiscount", "memberSetting", "discounts", "currentSku", "setCurrentSku", "currentImage", "setCurrentImage", "selectedColor", "setSelectedColor", "isSoldOut", "setIsSoldOut", "currentVariant", "setCurrentVariant", "plusMemberStatus", "setPlusMemberStatus", "priceCollection", "setPriceCollection", "tags", "setTags", "showTags", "setShowTags", "discountCollection", "setDiscountCollection", "locale", "copyWriting", "currencyCode", "isLogin", "displayTitle", "displayDescription", "skuArray", "onColorClick", "color", "findSku", "item", "firstOption", "variant", "coupon", "price", "basePrice", "discount", "result", "hasMemberPrice", "salePriceWithCurrency", "originalPriceWithCurrency", "savePriceWithCurrency", "handleTags", "discountTag", "newTags", "index", "option", "FilterCardWrapItem_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r,jsxs as
|
|
1
|
+
import{jsx as r,jsxs as c}from"react/jsx-runtime";import V from"./FilterList";import z from"./FilterHeader";import H from"./FilterCardWrap";import{withLayout as T}from"../../shared/Styles.js";import W from"./component/TabFilter";import{useState as t,useMemo as h}from"react";import{handleSortKeyAndReverse as q,handleFilters as p}from"./component/filtersFun";function B(F){const{data:n,result:g={},allResult:y={},loadMore:P=null,metafields:i={},filterPrice:x={},isLoading:S=!1,onFilteredChange:s,onSortAndReverseChange:N,onPrimaryChange:w,onSecondaryChange:D,onNextPage:L,onPrevPage:O}=F,{shop_filters_pair:u}=i,[a,R]=t(!1),[K,v]=t(!1),[I,M]=t([]),[b,d]=t({}),[f,_]=t(0),[m,l]=t(1);h(()=>{const e=u?.filter_txt?.sortList,[o,A]=q(e,f);N?.(o,A)},[u?.filter_txt?.sortList,b,f]);const k=e=>!e?.metafields?.seoSetting?.noindex,C=h(()=>y?.products?.filter(k)?.length||0,[y?.products]);return c("div",{className:"size-full box-border",children:[r("div",{className:"laptop:mb-12 mb-6",children:r(W,{tabs:n?.tabItems})}),r(z,{total:C||0,metafields:i,closeFilter:a,sortKeyIndx:f,shopifyData:n,onSortChange:_,onCloseFilter:R,onClearFiltered:()=>{d?.({}),s?.(p({}))},onMobileOpenDrawer:v}),c("div",{className:"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8",children:[!a&&r(V,{result:g,filtered:b,filterPrice:x,openOptions:I,closeFilter:a,shopifyData:n,metafields:i,mobileDrawerVisible:K,onFilteredChange:e=>{d(e),l(1),s?.(p(e))},onClearFiltered:()=>{d?.({}),l(1),s?.(p({}))},onOpenOptions:M,onCloseDrawer:v}),c("div",{className:"flex-1 overflow-y-auto relative",children:[r(H,{page:m,result:g,shopifyData:n,total:C,metafields:i,closeFilter:a,onNextPage:e=>{l(m+1),L?.(e)},onPrevPage:e=>{l(m-1),O?.(e)},onPrimaryChange:(e,o)=>w?.(e,o),onSecondaryChange:(e,o)=>D?.(e,o)}),S&&P||null]})]})]})}var Z=T(B);export{Z as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import FilterList from './FilterList'\nimport FilterHeader from './FilterHeader'\nimport FilterCardWrap from './FilterCardWrap'\nimport { withLayout } from '../../shared/Styles.js'\nimport TabFilter from './component/TabFilter'\nimport { useState, useMemo } from 'react'\nimport { handleSortKeyAndReverse, handleFilters } from './component/filtersFun'\n\ntype CollectionsFiltersProps = {\n metafields: any\n result: any\n allResult: any\n pageSize?: number\n filterPrice: any\n isLoading?: boolean\n loadMore?: React.ReactNode\n data?: any\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n onFilteredChange?: (filtered: any) => void\n onSortAndReverseChange?: (sortKey: string, reverse: boolean) => void\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\nfunction CollectionsFilters(props: CollectionsFiltersProps) {\n const {\n data,\n result = {},\n allResult = {},\n loadMore = null,\n metafields = {},\n filterPrice = {},\n isLoading = false,\n onFilteredChange,\n onSortAndReverseChange,\n onPrimaryChange,\n onSecondaryChange,\n onNextPage,\n onPrevPage,\n } = props\n\n const { shop_filters_pair } = metafields\n\n const [closeFilter, setCloseFilter] = useState<boolean>(false)\n const [mobileDrawerVisible, setMobileDrawerVisible] = useState<boolean>(false) // \u79FB\u52A8\u7AEF\u7B5B\u9009\u9009\u9879\u5C55\u793A\u72B6\u6001\n const [openOptions, setOpenOptions] = useState<any[]>([]) // \u5C55\u5F00\u7684\u7B5B\u9009\u9879\n const [filtered, setFiltered] = useState<any>({}) // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n const [sortKeyIndx, setSortKeyIndx] = useState<number>(0) // \u6392\u5E8F\u65B9\u5F0F\n const [
|
|
5
|
-
"mappings": "AAwEQ,cAAAA,
|
|
6
|
-
"names": ["jsx", "jsxs", "FilterList", "FilterHeader", "FilterCardWrap", "withLayout", "TabFilter", "useState", "useMemo", "handleSortKeyAndReverse", "handleFilters", "CollectionsFilters", "props", "data", "result", "allResult", "loadMore", "metafields", "filterPrice", "isLoading", "onFilteredChange", "onSortAndReverseChange", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "shop_filters_pair", "closeFilter", "setCloseFilter", "mobileDrawerVisible", "setMobileDrawerVisible", "openOptions", "setOpenOptions", "filtered", "setFiltered", "sortKeyIndx", "setSortKeyIndx", "
|
|
4
|
+
"sourcesContent": ["import FilterList from './FilterList'\nimport FilterHeader from './FilterHeader'\nimport FilterCardWrap from './FilterCardWrap'\nimport { withLayout } from '../../shared/Styles.js'\nimport TabFilter from './component/TabFilter'\nimport { useState, useMemo } from 'react'\nimport { handleSortKeyAndReverse, handleFilters } from './component/filtersFun'\n\ntype CollectionsFiltersProps = {\n metafields: any\n result: any\n allResult: any\n pageSize?: number\n filterPrice: any\n isLoading?: boolean\n loadMore?: React.ReactNode\n data?: any\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n onFilteredChange?: (filtered: any) => void\n onSortAndReverseChange?: (sortKey: string, reverse: boolean) => void\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\nfunction CollectionsFilters(props: CollectionsFiltersProps) {\n const {\n data,\n result = {},\n allResult = {},\n loadMore = null,\n metafields = {},\n filterPrice = {},\n isLoading = false,\n onFilteredChange,\n onSortAndReverseChange,\n onPrimaryChange,\n onSecondaryChange,\n onNextPage,\n onPrevPage,\n } = props\n\n const { shop_filters_pair } = metafields\n\n const [closeFilter, setCloseFilter] = useState<boolean>(false)\n const [mobileDrawerVisible, setMobileDrawerVisible] = useState<boolean>(false) // \u79FB\u52A8\u7AEF\u7B5B\u9009\u9009\u9879\u5C55\u793A\u72B6\u6001\n const [openOptions, setOpenOptions] = useState<any[]>([]) // \u5C55\u5F00\u7684\u7B5B\u9009\u9879\n const [filtered, setFiltered] = useState<any>({}) // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n const [sortKeyIndx, setSortKeyIndx] = useState<number>(0) // \u6392\u5E8F\u65B9\u5F0F\n const [currentPage, setCurrentPage] = useState<number>(1)\n\n // \u5904\u7406\u6392\u5E8F\u6570\u636E\n useMemo(() => {\n const sortList = shop_filters_pair?.filter_txt?.sortList\n const [sortKey, reverse] = handleSortKeyAndReverse(sortList, sortKeyIndx)\n onSortAndReverseChange?.(sortKey, reverse)\n }, [shop_filters_pair?.filter_txt?.sortList, filtered, sortKeyIndx])\n\n // // \u6570\u91CF\n // useMemo(() => {\n // onChunkNumberChange?.(handleChunkNumber(filtered))\n // }, [filtered])\n const hasNoIndex = (product: { metafields: { seoSetting: { noindex: any } } }) => {\n return !product?.metafields?.seoSetting?.noindex\n }\n const totalCount = useMemo(() => {\n return allResult?.products?.filter(hasNoIndex)?.length || 0\n }, [allResult?.products])\n\n return (\n <div className=\"size-full box-border\">\n {/* \u5934\u90E8 */}\n <div className=\"laptop:mb-12 mb-6\">\n <TabFilter tabs={data?.tabItems} />\n </div>\n <FilterHeader\n total={totalCount || 0}\n metafields={metafields}\n closeFilter={closeFilter}\n sortKeyIndx={sortKeyIndx}\n shopifyData={data}\n onSortChange={setSortKeyIndx}\n onCloseFilter={setCloseFilter}\n onClearFiltered={() => {\n setFiltered?.({})\n onFilteredChange?.(handleFilters({}))\n }}\n onMobileOpenDrawer={setMobileDrawerVisible}\n />\n {/* PC\u7B5B\u9009\u9009\u9879 */}\n <div className=\"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8\">\n {!closeFilter && (\n <FilterList\n result={result}\n filtered={filtered}\n filterPrice={filterPrice}\n openOptions={openOptions}\n closeFilter={closeFilter}\n shopifyData={data}\n metafields={metafields}\n mobileDrawerVisible={mobileDrawerVisible}\n onFilteredChange={v => {\n setFiltered(v)\n setCurrentPage(1)\n onFilteredChange?.(handleFilters(v))\n }}\n onClearFiltered={() => {\n setFiltered?.({})\n setCurrentPage(1)\n onFilteredChange?.(handleFilters({}))\n }}\n onOpenOptions={setOpenOptions}\n onCloseDrawer={setMobileDrawerVisible}\n />\n )}\n <div className=\"flex-1 overflow-y-auto relative\">\n <FilterCardWrap\n page={currentPage}\n result={result}\n shopifyData={data}\n total={totalCount}\n metafields={metafields}\n closeFilter={closeFilter}\n onNextPage={v => {\n setCurrentPage(currentPage + 1)\n onNextPage?.(v)\n }}\n onPrevPage={v => {\n setCurrentPage(currentPage - 1)\n onPrevPage?.(v)\n }}\n onPrimaryChange={(e, data) => onPrimaryChange?.(e, data)}\n onSecondaryChange={(e, data) => onSecondaryChange?.(e, data)}\n />\n {isLoading ? loadMore || null : null}\n </div>\n </div>\n </div>\n )\n}\n\nexport default withLayout(CollectionsFilters)"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "FilterList", "FilterHeader", "FilterCardWrap", "withLayout", "TabFilter", "useState", "useMemo", "handleSortKeyAndReverse", "handleFilters", "CollectionsFilters", "props", "data", "result", "allResult", "loadMore", "metafields", "filterPrice", "isLoading", "onFilteredChange", "onSortAndReverseChange", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "shop_filters_pair", "closeFilter", "setCloseFilter", "mobileDrawerVisible", "setMobileDrawerVisible", "openOptions", "setOpenOptions", "filtered", "setFiltered", "sortKeyIndx", "setSortKeyIndx", "currentPage", "setCurrentPage", "sortList", "sortKey", "reverse", "hasNoIndex", "product", "totalCount", "v", "CollectionsFilters_default"]
|
|
7
7
|
}
|