@anker-in/headless-ui 1.0.19-temp-101102 → 1.0.19-temp-101103
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/AiuiProvider/index.d.ts +1 -0
- package/dist/cjs/biz-components/AiuiProvider/index.js +1 -1
- package/dist/cjs/biz-components/AiuiProvider/index.js.map +2 -2
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js.map +3 -3
- package/dist/cjs/biz-components/CollectionsFilters/FilterList.d.ts +1 -3
- package/dist/cjs/biz-components/CollectionsFilters/FilterList.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/FilterList.js.map +3 -3
- package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.d.ts +5 -1
- package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.js.map +3 -3
- package/dist/cjs/biz-components/CollectionsFilters/component/filtersFun.d.ts +6 -2
- package/dist/cjs/biz-components/CollectionsFilters/component/filtersFun.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/component/filtersFun.js.map +3 -3
- package/dist/cjs/biz-components/CollectionsFilters/index.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/index.js.map +3 -3
- package/dist/cjs/tsconfig.tsbuildinfo +1 -1
- package/dist/esm/biz-components/AiuiProvider/index.d.ts +1 -0
- package/dist/esm/biz-components/AiuiProvider/index.js +1 -1
- package/dist/esm/biz-components/AiuiProvider/index.js.map +2 -2
- 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/FilterList.d.ts +1 -3
- package/dist/esm/biz-components/CollectionsFilters/FilterList.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterList.js.map +3 -3
- package/dist/esm/biz-components/CollectionsFilters/component/TabFilter.d.ts +5 -1
- package/dist/esm/biz-components/CollectionsFilters/component/TabFilter.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/component/TabFilter.js.map +3 -3
- package/dist/esm/biz-components/CollectionsFilters/component/filtersFun.d.ts +6 -2
- package/dist/esm/biz-components/CollectionsFilters/component/filtersFun.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/component/filtersFun.js.map +3 -3
- package/dist/esm/biz-components/CollectionsFilters/index.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/index.js.map +3 -3
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var k=(n,e)=>{for(var o in e)p(n,o,{get:e[o],enumerable:!0})},x=(n,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!A.call(n,t)&&t!==o&&p(n,t,{get:()=>e[t],enumerable:!(s=f(e,t))||s.enumerable});return n};var C=n=>x(p({},"__esModule",{value:!0}),n);var T={};k(T,{AiuiContext:()=>c,default:()=>P,useAiuiContext:()=>_});module.exports=C(T);var
|
|
1
|
+
"use strict";var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var k=(n,e)=>{for(var o in e)p(n,o,{get:e[o],enumerable:!0})},x=(n,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!A.call(n,t)&&t!==o&&p(n,t,{get:()=>e[t],enumerable:!(s=f(e,t))||s.enumerable});return n};var C=n=>x(p({},"__esModule",{value:!0}),n);var T={};k(T,{AiuiContext:()=>c,default:()=>P,useAiuiContext:()=>_});module.exports=C(T);var h=require("react/jsx-runtime"),g=require("../../shared/track.js"),r=require("react");const c=(0,r.createContext)({trackingData:{},locale:void 0,copyWriting:{}}),_=()=>{if(!(0,r.useContext)(c))throw new Error("useAiui must be used in <AiuiProvider>");return(0,r.useContext)(c)},E=({children:n,...e})=>((0,r.useEffect)(()=>{const o=(t,a)=>{const i={};if(!a||!a.attributes)return i;for(const y of Array.from(a.attributes)){const u=y?.name;u?.startsWith("data-headless-")&&(i[u]=a.getAttribute(u))}const b=i?.["data-headless-sku"],l=i?.["data-headless-type-name"]?.split?.("#"),d=i?.["data-headless-title-desc-button"]?.split?.("#"),m=i?.["data-headless-nav-postion"]?.split?.("#");(0,g.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:e?.trackingData?.pageGroup||"Home Page",component_type:l?.[0]||"",component_name:l?.[1]||"",position:m?.[1]||"",navigation:m?.[0]||"",button_name:d?.[2]||"",SKU:b||"",component_title:d?.[0]||"",component_description:d?.[1]||""}})},s=new MutationObserver(()=>{document.querySelectorAll("[data-headless-type-name]").forEach(t=>{t.hasAttribute("data-headless-track-bound")||(t.addEventListener("click",a=>o(a,t)),t.setAttribute("data-headless-track-bound","true"))})});return s.observe(document.body,{childList:!0,subtree:!0}),document.querySelectorAll("[data-headless-type-name]").forEach(t=>{t.hasAttribute("data-headless-track-bound")||(t.addEventListener("click",a=>o(a,t)),t.setAttribute("data-headless-track-bound","true"))}),()=>s.disconnect()},[]),(0,h.jsx)(c.Provider,{value:e,children:n}));var P=E;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/AiuiProvider/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { gaTrack } from '../../shared/track.js'\nimport React, { createContext, useContext, useEffect } from 'react'\n\ninterface AiuiContextType {\n trackingData: Record<string, any>\n locale?: string\n storeDomain?: string\n isLogin?: boolean\n currencyCode?: string\n copyWriting?: Record<string, string>\n}\n\nexport const AiuiContext = createContext<AiuiContextType>({\n trackingData: {},\n locale: undefined,\n copyWriting: {},\n})\n\nexport const useAiuiContext = () => {\n const context = useContext(AiuiContext)\n if (!context) {\n throw new Error('useAiui must be used in <AiuiProvider>')\n }\n return useContext(AiuiContext)\n}\n\nconst AiuiProvider = ({\n children,\n ...rest\n}: {\n children: React.ReactNode\n} & AiuiContextType) => {\n useEffect(() => {\n const handleTrackClick = (e: any, el: any) => {\n // e?.stopPropagation?.()\n const out: any = {}\n if (!el || !el.attributes) return out\n for (const attr of Array.from(el.attributes)) {\n const name = (attr as any)?.name\n if (name?.startsWith('data-headless-')) {\n out[name] = el.getAttribute(name)\n }\n }\n const sku = out?.['data-headless-sku']\n const nameType = out?.['data-headless-type-name']?.split?.('#')\n const titleDesc = out?.['data-headless-title-desc-button']?.split?.('#')\n const navPosition = out?.['data-headless-nav-postion']?.split?.('#')\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_click',\n event_parameters: {\n page_group: rest?.trackingData?.pageGroup || 'Home Page',\n component_type: nameType?.[0] || '',\n component_name: nameType?.[1] || '',\n position: navPosition?.[1] || '',\n navigation: navPosition?.[0] || '',\n button_name: titleDesc?.[2] || '',\n SKU: sku || '',\n component_title: titleDesc?.[0] || '',\n component_description: titleDesc?.[1] || '',\n },\n })\n }\n const observer = new MutationObserver(() => {\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true') // \u907F\u514D\u91CD\u590D\u7ED1\u5B9A\n }\n })\n })\n observer.observe(document.body, { childList: true, subtree: true })\n // \u521D\u59CB\u5316\u4E00\u6B21\u73B0\u6709\u8282\u70B9\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true')\n }\n })\n return () => observer.disconnect()\n }, [])\n\n return <AiuiContext.Provider value={rest}>{children}</AiuiContext.Provider>\n}\n\nexport default AiuiProvider\n"],
|
|
5
|
-
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,EAAA,YAAAC,EAAA,mBAAAC,IAAA,eAAAC,EAAAL,
|
|
4
|
+
"sourcesContent": ["import { gaTrack } from '../../shared/track.js'\nimport React, { createContext, useContext, useEffect } from 'react'\n\ninterface AiuiContextType {\n trackingData: Record<string, any>\n locale?: string\n pathname?: string\n storeDomain?: string\n isLogin?: boolean\n currencyCode?: string\n copyWriting?: Record<string, string>\n}\n\nexport const AiuiContext = createContext<AiuiContextType>({\n trackingData: {},\n locale: undefined,\n copyWriting: {},\n})\n\nexport const useAiuiContext = () => {\n const context = useContext(AiuiContext)\n if (!context) {\n throw new Error('useAiui must be used in <AiuiProvider>')\n }\n return useContext(AiuiContext)\n}\n\nconst AiuiProvider = ({\n children,\n ...rest\n}: {\n children: React.ReactNode\n} & AiuiContextType) => {\n useEffect(() => {\n const handleTrackClick = (e: any, el: any) => {\n // e?.stopPropagation?.()\n const out: any = {}\n if (!el || !el.attributes) return out\n for (const attr of Array.from(el.attributes)) {\n const name = (attr as any)?.name\n if (name?.startsWith('data-headless-')) {\n out[name] = el.getAttribute(name)\n }\n }\n const sku = out?.['data-headless-sku']\n const nameType = out?.['data-headless-type-name']?.split?.('#')\n const titleDesc = out?.['data-headless-title-desc-button']?.split?.('#')\n const navPosition = out?.['data-headless-nav-postion']?.split?.('#')\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_click',\n event_parameters: {\n page_group: rest?.trackingData?.pageGroup || 'Home Page',\n component_type: nameType?.[0] || '',\n component_name: nameType?.[1] || '',\n position: navPosition?.[1] || '',\n navigation: navPosition?.[0] || '',\n button_name: titleDesc?.[2] || '',\n SKU: sku || '',\n component_title: titleDesc?.[0] || '',\n component_description: titleDesc?.[1] || '',\n },\n })\n }\n const observer = new MutationObserver(() => {\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true') // \u907F\u514D\u91CD\u590D\u7ED1\u5B9A\n }\n })\n })\n observer.observe(document.body, { childList: true, subtree: true })\n // \u521D\u59CB\u5316\u4E00\u6B21\u73B0\u6709\u8282\u70B9\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true')\n }\n })\n return () => observer.disconnect()\n }, [])\n\n return <AiuiContext.Provider value={rest}>{children}</AiuiContext.Provider>\n}\n\nexport default AiuiProvider\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,EAAA,YAAAC,EAAA,mBAAAC,IAAA,eAAAC,EAAAL,GAmFS,IAAAM,EAAA,6BAnFTC,EAAwB,iCACxBC,EAA4D,iBAYrD,MAAMN,KAAc,iBAA+B,CACxD,aAAc,CAAC,EACf,OAAQ,OACR,YAAa,CAAC,CAChB,CAAC,EAEYE,EAAiB,IAAM,CAElC,GAAI,IADY,cAAWF,CAAW,EAEpC,MAAM,IAAI,MAAM,wCAAwC,EAE1D,SAAO,cAAWA,CAAW,CAC/B,EAEMO,EAAe,CAAC,CACpB,SAAAC,EACA,GAAGC,CACL,QAGE,aAAU,IAAM,CACd,MAAMC,EAAmB,CAACC,EAAQC,IAAY,CAE5C,MAAMC,EAAW,CAAC,EAClB,GAAI,CAACD,GAAM,CAACA,EAAG,WAAY,OAAOC,EAClC,UAAWC,KAAQ,MAAM,KAAKF,EAAG,UAAU,EAAG,CAC5C,MAAMG,EAAQD,GAAc,KACxBC,GAAM,WAAW,gBAAgB,IACnCF,EAAIE,CAAI,EAAIH,EAAG,aAAaG,CAAI,EAEpC,CACA,MAAMC,EAAMH,IAAM,mBAAmB,EAC/BI,EAAWJ,IAAM,yBAAyB,GAAG,QAAQ,GAAG,EACxDK,EAAYL,IAAM,iCAAiC,GAAG,QAAQ,GAAG,EACjEM,EAAcN,IAAM,2BAA2B,GAAG,QAAQ,GAAG,KACnE,WAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,WAAYJ,GAAM,cAAc,WAAa,YAC7C,eAAgBQ,IAAW,CAAC,GAAK,GACjC,eAAgBA,IAAW,CAAC,GAAK,GACjC,SAAUE,IAAc,CAAC,GAAK,GAC9B,WAAYA,IAAc,CAAC,GAAK,GAChC,YAAaD,IAAY,CAAC,GAAK,GAC/B,IAAKF,GAAO,GACZ,gBAAiBE,IAAY,CAAC,GAAK,GACnC,sBAAuBA,IAAY,CAAC,GAAK,EAC3C,CACF,CAAC,CACH,EACME,EAAW,IAAI,iBAAiB,IAAM,CAC1C,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAASD,GAAKD,EAAiBC,EAAGC,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,CACH,CAAC,EACD,OAAAQ,EAAS,QAAQ,SAAS,KAAM,CAAE,UAAW,GAAM,QAAS,EAAK,CAAC,EAElE,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAASD,GAAKD,EAAiBC,EAAGC,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,EACM,IAAMQ,EAAS,WAAW,CACnC,EAAG,CAAC,CAAC,KAEE,OAACpB,EAAY,SAAZ,CAAqB,MAAOS,EAAO,SAAAD,EAAS,GAGtD,IAAOP,EAAQM",
|
|
6
6
|
"names": ["AiuiProvider_exports", "__export", "AiuiContext", "AiuiProvider_default", "useAiuiContext", "__toCommonJS", "import_jsx_runtime", "import_track", "import_react", "AiuiProvider", "children", "rest", "handleTrackClick", "e", "el", "out", "attr", "name", "sku", "nameType", "titleDesc", "navPosition", "observer"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var xe=Object.create;var y=Object.defineProperty;var ve=Object.getOwnPropertyDescriptor;var ye=Object.getOwnPropertyNames;var he=Object.getPrototypeOf,ke=Object.prototype.hasOwnProperty;var Ce=(e,r)=>{for(var n in r)y(e,n,{get:r[n],enumerable:!0})},U=(e,r,n,g)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of ye(r))!ke.call(e,m)&&m!==n&&y(e,m,{get:()=>r[m],enumerable:!(g=ve(r,m))||g.enumerable});return e};var _=(e,r,n)=>(n=e!=null?xe(he(e)):{},U(r||!e||!e.__esModule?y(n,"default",{value:e,enumerable:!0}):n,e)),_e=e=>U(y({},"__esModule",{value:!0}),e);var Te={};Ce(Te,{default:()=>Pe});module.exports=_e(Te);var t=require("react/jsx-runtime"),f=require("../../helpers/utils.js"),E=require("../AiuiProvider/index.js"),R=require("../ShelfDisplay/shelfDisplay.js"),V=_(require("../../components/badge.js")),
|
|
1
|
+
"use strict";var xe=Object.create;var y=Object.defineProperty;var ve=Object.getOwnPropertyDescriptor;var ye=Object.getOwnPropertyNames;var he=Object.getPrototypeOf,ke=Object.prototype.hasOwnProperty;var Ce=(e,r)=>{for(var n in r)y(e,n,{get:r[n],enumerable:!0})},U=(e,r,n,g)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of ye(r))!ke.call(e,m)&&m!==n&&y(e,m,{get:()=>r[m],enumerable:!(g=ve(r,m))||g.enumerable});return e};var _=(e,r,n)=>(n=e!=null?xe(he(e)):{},U(r||!e||!e.__esModule?y(n,"default",{value:e,enumerable:!0}):n,e)),_e=e=>U(y({},"__esModule",{value:!0}),e);var Te={};Ce(Te,{default:()=>Pe});module.exports=_e(Te);var t=require("react/jsx-runtime"),f=require("../../helpers/utils.js"),E=require("../AiuiProvider/index.js"),R=require("../ShelfDisplay/shelfDisplay.js"),V=_(require("../../components/badge.js")),q=require("../../components/text.js"),w=_(require("../../components/button.js")),P=_(require("../../components/picture.js")),h=require("../../shared/trackUrlRef.js"),G=require("./component/price.js"),l=require("react");const N="image",S="product_shelf",Ne=999999999e-2,Se=e=>{let r;return e?.includes("products")?r=e?.split("products")[0]+"files/":r=e?.replace(e?.split("files")?.pop()||"","")+"/",r},we=({data:e,buttonText:r,itemShape:n,metafields:g,onPrimaryChange:m,onSecondaryChange:J})=>{const{memberPriceDiscount:K,memberSetting:T,discounts:$,shopCommon:Q}=g,[d,I]=(0,l.useState)(""),[X,B]=(0,l.useState)(""),[b,M]=(0,l.useState)(""),[z,Y]=(0,l.useState)(!1),[L,Z]=(0,l.useState)({}),[ee,te]=(0,l.useState)(!1),[F,se]=(0,l.useState)({price:"",basePrice:""}),[O,oe]=(0,l.useState)([]),[re,ie]=(0,l.useState)([]),[x,le]=(0,l.useState)(""),[ne,ae]=(0,l.useState)(""),{locale:a="us",currencyCode:ce,isLogin:j}=(0,E.useAiuiContext)(),k=e?.custom_name||e?.title||e?.name,D=e?.custom_description||e?.description||e?.descriptionHtml,c=e?.filter_variants||e?.variants||[],me=s=>M(s),C=(s,i,o,u)=>{te(u),le(s||""),se({basePrice:i||"",price:o||""})};return(0,l.useEffect)(()=>{if(b){const o=c?.find(u=>u?.name?.includes?.(b));I(o?.sku||c?.[0]?.sku||""),B(o?.image?.url||c?.[0]?.image?.url||"");return}const s=e?.options?.find(o=>o?.displayName==="color")?.values?.[0]?.label;s&&M(s);const i=c?.find(o=>o?.name?.includes?.(s));I(i?.sku||c?.[0]?.sku||""),B(i?.image?.url||c?.[0]?.image?.url||"")},[b]),(0,l.useEffect)(()=>{if(!d)return;oe(e?.tags||[]);const s=c?.find(p=>p?.sku===d)||c?.[0]||{};Z(s),Y(!s?.availableForSale||s?.price?.amount===Ne);const{infos:i}=s?.metafields||{},{productInfos:o,preRender:u}=e?.metafields||{};ae(i?.comingSoon||o?.comingSoon||u?.soldOut||Q?.soldOut||"");const v=s?.coupons?.[0],{price:W,basePrice:H,discount:de,discountAmount:ue}=(0,R.formatVariantPrice)({locale:a,amount:v?v.variant_price4wscode:s.price,baseAmount:v?s.price:0,currencyCode:e?.price?.currencyCode||"USD"}),A=(v?.value_type==="fixed_amount"?ue:de)||"";if(j){const p=(0,G.getFunctionMemberPrice)({locale:a,variant:s,shopMemberPriceDiscountConfig:K,currencyCode:ce||e?.price?.currencyCode||"USD"});if(p){const{hasMemberPrice:pe,salePriceWithCurrency:fe,originalPriceWithCurrency:ge,savePriceWithCurrency:be}=p;C(be||"",ge||"",pe?fe:"",p?.hasMemberPrice)}else C(A,H||"",W||"",!1)}else C(A,H||"",W||"",!1)},[e,d]),(0,l.useEffect)(()=>{let s=[];if(x){const o=`${x}${$?.off}`;s.push(o)}const i=O?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,x?1:2);ie(s.concat(i))},[O,x]),(0,t.jsx)("div",{className:(0,f.cn)(n==="round"?"rounded-2xl":"rounded-none","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:"size-full box-border overflow-hidden hover:[&_img]:scale-105",children:(0,t.jsx)("div",{className:"relative inset-0 size-full",children:(0,t.jsxs)("a",{className:"size-full",href:(0,h.trackUrlRef)(e?.link,`${N}_${S}`),children:[(0,t.jsx)(P.default,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full",imgClassName:"size-full object-cover transition-all duration-300"}),(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:"desktop:mb-2 mb-1 text-info-primary desktop:text-base text-sm font-semibold",dangerouslySetInnerHTML:{__html:e?.subTitle}}),(0,t.jsx)("span",{className:"text-info-secondary desktop:text-[32px] text-[20px] font-semibold desktop:leading-9 line-clamp-4",dangerouslySetInnerHTML:{__html:e?.title}})]})]})})}):(0,t.jsxs)("div",{className:"size-full desktop:p-6 desktop:pt-4 box-border overflow-hidden flex flex-col justify-between tablet:p-4 p-2 pb-4",children:[(0,t.jsx)("div",{className:"flex flex-wrap gap-1 overflow-hidden collection-filter-tags",children:re?.map?.((s,i)=>(0,t.jsx)(V.default,{className:"whitespace-nowrap max-w-full truncate px-1 box-border font-semibold item-badge",children:s},i))}),(0,t.jsx)("a",{target:"_blank","aria-label":k,className:"my-1",href:(0,h.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${N}_${S}`),children:(0,t.jsx)("div",{className:(0,f.cn)("m-auto desktop:size-[196px] size-[120px] overflow-hidden"),children:(0,t.jsx)(P.default,{alt:"",source:X,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:()=>me(i?.label),className:(0,f.cn)("size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent",`${b===i?.label?"border-[#00BEFA]":""}`),children:(0,t.jsx)("img",{alt:o,className:"h-full w-full object-cover",src:`${Se(e?.images?.[0]?.url)}${o?.toLowerCase().split(" ")?.join("-")}_50x.png`})},i?.label)})})}),(0,t.jsxs)("div",{children:[k?(0,t.jsx)("span",{dangerouslySetInnerHTML:{__html:k||""},className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:text-xl text-base font-semibold"}):null,e?.metafields?.judgemeBadge?(0,t.jsx)("a",{target:"_blank",className:"font-semibold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:(0,h.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${N}_${S}`)}):null,D?(0,t.jsx)(q.Text,{size:2,html:D||"",className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs font-semibold"}):null,(0,t.jsxs)("div",{className:"mt-3 mb-2",children:[(0,t.jsx)("p",{dangerouslySetInnerHTML:{__html:j&&ee&&($?.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-semibold"}),(0,t.jsx)("div",{className:"flex items-center",children:z?(0,t.jsx)("div",{className:"desktop:text-2xl tablet:text-xl text-info-primary text-base font-semibold",children:ne||""}):(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-semibold",children:L?.availableForSale&&F?.price||""}),(0,t.jsx)("div",{className:"origin-price desktop:text-xl tablet:text-lg text-info-secondary ml-1 text-sm font-semibold line-through",children:L?.availableForSale&&F?.basePrice||""})]})})]}),(0,t.jsxs)("div",{className:(0,f.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col"),children:[(0,t.jsx)(w.default,{variant:"secondary",className:"m-tablet:w-full font-semibold",onClick:()=>J?.(e,d),children:r?.secondaryButton||"Learn More"}),(0,t.jsx)(w.default,{variant:"primary",className:"m-tablet:w-full font-semibold",disabled:z,onClick:()=>m?.(e,d),children:r?.primaryButton||"Shop Now"})]})]})]})},e?.id||e?.handle)};var Pe=we;
|
|
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, shopCommon } = 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>(false)\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 const [soldOutText, setSoldOutText] = useState<string>('')\n\n const { locale = 'us', 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 const handleBasePrice = (discount: string, priceCurrency: string, salePrice: string, status: boolean) => {\n setPlusMemberStatus(status)\n setDiscountCollection(discount || '')\n setPriceCollection({\n basePrice: priceCurrency || '',\n price: salePrice || '',\n })\n }\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 const { infos } = variant?.metafields || {}\n const { productInfos, preRender } = data?.metafields || {}\n setSoldOutText(infos?.comingSoon || productInfos?.comingSoon || preRender?.soldOut || shopCommon?.soldOut || '')\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n const { price, basePrice, discount, discountAmount } = 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 const showPrice = (coupon?.value_type === 'fixed_amount' ? discountAmount : discount) || ''\n // \u4F1A\u5458\u6298\u6263\n if (isLogin) {\n const result = getFunctionMemberPrice({\n locale: locale,\n variant: variant,\n shopMemberPriceDiscountConfig: memberPriceDiscount,\n currencyCode: currencyCode || data?.price?.currencyCode || 'USD',\n })\n if (result) {\n const { hasMemberPrice, salePriceWithCurrency, originalPriceWithCurrency, savePriceWithCurrency } = result\n handleBasePrice(\n savePriceWithCurrency || '',\n originalPriceWithCurrency || '',\n hasMemberPrice ? salePriceWithCurrency : '',\n result?.hasMemberPrice\n )\n } else {\n handleBasePrice(showPrice, basePrice || '', price || '', false)\n }\n } else {\n handleBasePrice(showPrice, basePrice || '', price || '', false)\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 'tablet:hover:bg-info-white 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=\"size-full box-border overflow-hidden hover:[&_img]:scale-105\">\n <div className=\"relative inset-0 size-full\">\n <a className=\"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 imgClassName=\"size-full object-cover transition-all duration-300\"\n />\n <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n <p\n className=\"desktop:mb-2 mb-1 text-info-primary desktop:text-base text-sm font-semibold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n />\n <span\n className=\"text-info-secondary desktop:text-[32px] text-[20px] font-semibold desktop:leading-9 line-clamp-4\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n </div>\n ) : (\n <div className=\"size-full desktop:p-6 desktop:pt-4 box-border overflow-hidden flex flex-col justify-between 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\n key={index}\n className=\"whitespace-nowrap max-w-full truncate px-1 box-border font-semibold item-badge\"\n >\n {item}\n </Badge>\n ))}\n </div>\n <a\n target=\"_blank\"\n aria-label={displayTitle}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n >\n <div className={cn('my-1 m-auto desktop:size-[196px] 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 <span\n dangerouslySetInnerHTML={{ __html: displayTitle || '' }}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:text-xl text-base font-semibold\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-semibold 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 font-semibold\"\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-semibold\"\n />\n <div className=\"flex items-center\">\n {isSoldOut ? (\n <div className=\"desktop:text-2xl tablet:text-xl text-info-primary text-base font-semibold\">\n {soldOutText || ''}\n </div>\n ) : (\n <>\n <div className=\"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-semibold\">\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-semibold 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 font-semibold\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full font-semibold\"\n disabled={isSoldOut}\n onClick={() => onPrimaryChange?.(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": "skBAAA,IAAAA,GAAA,GAAAC,GAAAD,GAAA,aAAAE,KAAA,eAAAC,GAAAH,
|
|
6
|
-
"names": ["FilterCardWrapItem_exports", "__export", "FilterCardWrapItem_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_AiuiProvider", "import_shelfDisplay", "import_badge", "
|
|
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 { 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, shopCommon } = 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>(false)\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 const [soldOutText, setSoldOutText] = useState<string>('')\n\n const { locale = 'us', 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 const handleBasePrice = (discount: string, priceCurrency: string, salePrice: string, status: boolean) => {\n setPlusMemberStatus(status)\n setDiscountCollection(discount || '')\n setPriceCollection({\n basePrice: priceCurrency || '',\n price: salePrice || '',\n })\n }\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 const { infos } = variant?.metafields || {}\n const { productInfos, preRender } = data?.metafields || {}\n setSoldOutText(infos?.comingSoon || productInfos?.comingSoon || preRender?.soldOut || shopCommon?.soldOut || '')\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n const { price, basePrice, discount, discountAmount } = 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 const showPrice = (coupon?.value_type === 'fixed_amount' ? discountAmount : discount) || ''\n // \u4F1A\u5458\u6298\u6263\n if (isLogin) {\n const result = getFunctionMemberPrice({\n locale: locale,\n variant: variant,\n shopMemberPriceDiscountConfig: memberPriceDiscount,\n currencyCode: currencyCode || data?.price?.currencyCode || 'USD',\n })\n if (result) {\n const { hasMemberPrice, salePriceWithCurrency, originalPriceWithCurrency, savePriceWithCurrency } = result\n handleBasePrice(\n savePriceWithCurrency || '',\n originalPriceWithCurrency || '',\n hasMemberPrice ? salePriceWithCurrency : '',\n result?.hasMemberPrice\n )\n } else {\n handleBasePrice(showPrice, basePrice || '', price || '', false)\n }\n } else {\n handleBasePrice(showPrice, basePrice || '', price || '', false)\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 'tablet:hover:bg-info-white 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=\"size-full box-border overflow-hidden hover:[&_img]:scale-105\">\n <div className=\"relative inset-0 size-full\">\n <a className=\"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 imgClassName=\"size-full object-cover transition-all duration-300\"\n />\n <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n <p\n className=\"desktop:mb-2 mb-1 text-info-primary desktop:text-base text-sm font-semibold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n />\n <span\n className=\"text-info-secondary desktop:text-[32px] text-[20px] font-semibold desktop:leading-9 line-clamp-4\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n </div>\n ) : (\n <div className=\"size-full desktop:p-6 desktop:pt-4 box-border overflow-hidden flex flex-col justify-between 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\n key={index}\n className=\"whitespace-nowrap max-w-full truncate px-1 box-border font-semibold item-badge\"\n >\n {item}\n </Badge>\n ))}\n </div>\n <a\n target=\"_blank\"\n aria-label={displayTitle}\n className=\"my-1\"\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n >\n <div className={cn('m-auto desktop:size-[196px] 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 <span\n dangerouslySetInnerHTML={{ __html: displayTitle || '' }}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:text-xl text-base font-semibold\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-semibold 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 font-semibold\"\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-semibold\"\n />\n <div className=\"flex items-center\">\n {isSoldOut ? (\n <div className=\"desktop:text-2xl tablet:text-xl text-info-primary text-base font-semibold\">\n {soldOutText || ''}\n </div>\n ) : (\n <>\n <div className=\"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-semibold\">\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-semibold 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 font-semibold\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full font-semibold\"\n disabled={isSoldOut}\n onClick={() => onPrimaryChange?.(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
|
+
"names": ["FilterCardWrapItem_exports", "__export", "FilterCardWrapItem_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_AiuiProvider", "import_shelfDisplay", "import_badge", "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", "shopCommon", "currentSku", "setCurrentSku", "currentImage", "setCurrentImage", "selectedColor", "setSelectedColor", "isSoldOut", "setIsSoldOut", "currentVariant", "setCurrentVariant", "plusMemberStatus", "setPlusMemberStatus", "priceCollection", "setPriceCollection", "tags", "setTags", "showTags", "setShowTags", "discountCollection", "setDiscountCollection", "soldOutText", "setSoldOutText", "locale", "currencyCode", "isLogin", "displayTitle", "displayDescription", "skuArray", "onColorClick", "color", "handleBasePrice", "discount", "priceCurrency", "salePrice", "status", "findSku", "item", "firstOption", "variant", "infos", "productInfos", "preRender", "coupon", "price", "basePrice", "discountAmount", "showPrice", "result", "hasMemberPrice", "salePriceWithCurrency", "originalPriceWithCurrency", "savePriceWithCurrency", "handleTags", "discountTag", "newTags", "Picture", "index", "Badge", "option", "Button"]
|
|
7
7
|
}
|
|
@@ -2,10 +2,8 @@ interface FilterListProps {
|
|
|
2
2
|
onFilteredChange: (filtered: any, filter: any, opt: any) => void;
|
|
3
3
|
onOpenOptions: (openOpt: any[]) => void;
|
|
4
4
|
closeFilter: boolean;
|
|
5
|
-
result: any;
|
|
6
|
-
filterPrice: any;
|
|
7
5
|
shopifyData?: any;
|
|
8
|
-
|
|
6
|
+
filtersPair: any;
|
|
9
7
|
filtered: any;
|
|
10
8
|
openOptions: any[];
|
|
11
9
|
mobileDrawerVisible: boolean;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var H=Object.create;var v=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,U=Object.prototype.hasOwnProperty;var V=(l,n)=>{for(var s in n)v(l,s,{get:n[s],enumerable:!0})},N=(l,n,s,p)=>{if(n&&typeof n=="object"||typeof n=="function")for(let c of z(n))!U.call(l,c)&&c!==s&&v(l,c,{get:()=>n[c],enumerable:!(p=R(n,c))||p.enumerable});return l};var j=(l,n,s)=>(s=l!=null?H(I(l)):{},N(n||!l||!l.__esModule?v(s,"default",{value:l,enumerable:!0}):s,l)),q=l=>N(v({},"__esModule",{value:!0}),l);var Q={};V(Q,{default:()=>L});module.exports=q(Q);var e=require("react/jsx-runtime"),k=j(require("./component/AnimatedUL")),b=require("../../helpers/utils"),w=require("es-toolkit"),f=require("react"),F=require("react-responsive"),r=require("../../components/index.js");const D="!pt-4 transition-all duration-400 ease-in-out";function L(l){const n=(0,F.useMediaQuery)({query:"(max-width: 768px)"}),s=(0,f.useRef)(!1),{filtersPair:p,closeFilter:c,filtered:O,shopifyData:E,openOptions:y,mobileDrawerVisible:B,onCloseDrawer:h,onFilteredChange:$,onOpenOptions:x,onClearFiltered:M}=l,{drawerText:g}=E,P=(t,d,o,a)=>{const i=t.target,m=(0,w.cloneDeep)(O)||{};let u=m?.[i?.name]||[];i.checked?a==="checkbox"?u.push(i?.value):u=[i?.value]:(0,w.remove)(u,A=>A===i.value),m[i.name]=u,u.length<=0&&Reflect.deleteProperty(m,i.name),$?.({...m},d,o)},T=t=>{let d=y?.concat?.();d?.map?.(o=>o.label===t?o.show=!o.show:o),x?.(d)},C=()=>p?.length>0&&(0,e.jsx)("div",{className:"filter-list",children:p.map((t,d)=>{const o=y?.find?.(a=>a.label==t.label);return(0,e.jsxs)("div",{className:(0,b.cn)("mb-4 overflow-hidden duration-300 ease-in-out"),children:[(0,e.jsxs)("div",{onClick:()=>T(t.label),className:"relative flex items-center justify-between md-tablet:justify-center text-base font-semibold cursor-pointer leading-none",children:[(0,e.jsx)("button",{className:"w-full whitespace-nowrap text-left font-medium overflow-hidden box-border",children:(0,e.jsx)("span",{className:"pr-2 font-semibold truncate",children:t.label})}),(0,e.jsx)("div",{className:`duration-300 ease-in-out ${o?.show&&"rotate-180"}`,children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"7",viewBox:"0 0 12 7",fill:"none",children:(0,e.jsx)("path",{d:"M5.5268 0.668525C5.82138 0.428262 6.25563 0.445208 6.53022 0.719795L11.0302 5.2198C11.3231 5.51269 11.3231 5.98745 11.0302 6.28034C10.7373 6.57324 10.2626 6.57324 9.96967 6.28034L5.99994 2.31062L2.03022 6.28034C1.73732 6.57324 1.26256 6.57324 0.96967 6.28034C0.676777 5.98745 0.676777 5.51269 0.96967 5.2198L5.46967 0.719795L5.5268 0.668525Z",fill:"#1D1D1F"})})})]}),(0,e.jsx)("div",{className:"transition-all duration-400 ease-in-out overflow-hidden",children:(0,e.jsx)(k.default,{className:"!pt-4 transition-all duration-400 ease-in-out","data-label":t.label,isOpen:!!o?.show,children:t?.options?.map?.((a,i)=>{const m=t.type?t.type==="checkbox"?"checkbox":"radio":"checkbox";return(0,e.jsx)("li",{className:(0,b.cn)("w-full mb-4 box-border",{"text-[#32323266] cursor-not-allowed":a?.count<=0,"mb-0":i>=t?.options?.length-1}),children:(0,e.jsxs)("label",{className:"flex items-center overflow-hidden box-border",htmlFor:`${t.value}-${i}`,children:[(0,e.jsx)("input",{type:m,name:t.value,value:a.value,id:`${t.value}-${i}`,disabled:a?.count<=0,checked:a.checked,className:(0,b.cn)("size-4 cursor-pointer",a.checked?"accent-[#000000]":`appearance-none bg-transparent border border-[#000000] ${m==="radio"?"rounded-full":"rounded-[2px]"}`),onChange:u=>P(u,t,a,m)}),(0,e.jsx)("p",{className:(0,b.cn)("pt-0.5 pl-0.5 inline-block cursor-pointer font-semibold leading-none text-base"),children:a.label})]})},a.value)})})})]},`${t.label}${d}`)})});return(0,f.useEffect)(()=>{if(p?.length&&!y?.length&&!s.current){s.current=!0;let t=[];const d=document?.getElementsByClassName(D);for(let o=0;o<d.length;o++){let a={};a.label=d?.[o]?.getAttribute("data-label"),a.show=n?!1:o<6,a.height=document?.getElementsByClassName(D)?.[o]?.clientHeight,t.push(a)}x?.(t)}},[p]),(0,f.useEffect)(()=>{!n&&h?.(!1)},[n]),(0,e.jsxs)("div",{className:(0,b.cn)("transition-all duration-400 ease-in-out","desktop:w-60 tablet:w-48 laptop:w-[210px] l-tablet:hidden tablet:pt-4 tablet:border-t tablet:border-[#E4E5E6]","md-tablet:fixed md-tablet:bottom-0 md-tablet:left-0 md-tablet:right-0 md-tablet:top-0 md-tablet:z-[99]",c?"md-tablet:pointer-events-auto md-tablet:opacity-100":"md-tablet:pointer-events-none md-tablet:opacity-0"),children:[(0,e.jsx)("div",{className:(0,b.cn)("transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full",c?"md-tablet:translate-y-0":"md-tablet:translate-y-[100%]"),children:C()}),(0,e.jsx)(r.Drawer,{open:B,onOpenChange:()=>h(!1),children:(0,e.jsxs)(r.DrawerContent,{className:"px-4 pb-4 max-h-[94.5vh] flex flex-col",children:[(0,e.jsx)(r.DrawerHeader,{className:"sticky top-0 inset-x-0 py-0 mb-6",children:(0,e.jsx)(r.DrawerTitle,{children:g?.drawerTitle||"Mobile Filter"})}),(0,e.jsx)("div",{className:"flex-1 overflow-y-auto",children:C()}),(0,e.jsx)(r.DrawerFooter,{className:"pb-0 pt-4",children:(0,e.jsxs)("div",{className:(0,b.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2"),children:[(0,e.jsx)(r.Button,{variant:"secondary",className:"m-tablet:w-full",onClick:()=>{M?.(),h(!1)},children:g?.secondaryButton||"Clear"}),(0,e.jsx)(r.Button,{variant:"primary",className:"m-tablet:w-full",onClick:()=>{h(!1)},children:g?.primaryButton||"Apply"})]})})]})})]})}
|
|
2
2
|
//# sourceMappingURL=FilterList.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/FilterList.tsx"],
|
|
4
|
-
"sourcesContent": ["import AnimatedUL from './component/AnimatedUL'\nimport { cn } from '../../helpers/utils'\nimport type { ChangeEvent } from 'react'\nimport { remove, cloneDeep } from 'es-toolkit'\nimport { useEffect, useRef, useMemo } from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport { handleFilterOptions } from './component/filtersFun'\nimport { Button, Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerFooter } from '../../components/index.js'\n\ninterface FilterListProps {\n onFilteredChange: (filtered: any, filter: any, opt: any) => void\n onOpenOptions: (openOpt: any[]) => void\n closeFilter: boolean // \u662F\u5426\u5173\u95ED\u7B5B\u9009\u9879\u5C55\u793A\n result: any\n filterPrice: any\n shopifyData?: any\n metafields: any\n filtered: any // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n openOptions: any[] // \u5C55\u5F00\u7B5B\u9009\u9879\n mobileDrawerVisible: boolean\n onClearFiltered: () => void\n onCloseDrawer: (closeDrawer: boolean) => void\n}\n\nconst filterListItemClassName = '!pt-4 transition-all duration-400 ease-in-out'\n\nexport default function FilterList(props: FilterListProps) {\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n const onceRef = useRef<boolean>(false)\n\n const {\n closeFilter,\n filtered,\n result,\n shopifyData,\n filterPrice,\n openOptions,\n metafields,\n mobileDrawerVisible,\n onCloseDrawer,\n onFilteredChange,\n onOpenOptions,\n onClearFiltered,\n } = props\n\n const { drawerText } = shopifyData\n\n const { shop_filters_pair: shopFiltersPair } = metafields\n\n // \u5904\u7406\u7B5B\u9009\u9879\u6570\u636E\n const filtersOptions = useMemo(() => {\n return handleFilterOptions(result, filterPrice, shopFiltersPair)\n }, [\n filterPrice,\n result?.filters,\n shopFiltersPair?.filter_txt?.offers?.name,\n shopFiltersPair?.filter_txt?.offers?.onsale,\n ])\n\n const filtersPair = useMemo(() => {\n if (!filtersOptions?.length) return []\n return filtersOptions?.map?.((filter: any) => {\n return {\n ...filter,\n options: filter?.options?.map?.((opt: any) => {\n return {\n ...opt,\n checked: filtered?.[filter?.value]?.indexOf?.(opt?.value) > -1,\n }\n }),\n }\n })\n }, [filtered, filtersOptions])\n\n const filterChange = (event: ChangeEvent<HTMLInputElement>, filter: any, opt: any, type: string) => {\n const target = event.target\n const clonefiltered = cloneDeep(filtered) || {}\n let current = clonefiltered?.[target?.name] || []\n if (target.checked) {\n type === 'checkbox' ? current.push(target?.value) : (current = [target?.value])\n } else {\n remove(current, (v: string) => v === target.value)\n }\n clonefiltered[target.name] = current\n if (current.length <= 0) {\n Reflect.deleteProperty(clonefiltered, target.name)\n }\n onFilteredChange?.({ ...clonefiltered }, filter, opt)\n }\n\n const handleFilterOpt = (label: string) => {\n let res = openOptions?.concat?.()\n res?.map?.((item: any) => {\n if (item.label === label) return (item.show = !item.show)\n return item\n })\n onOpenOptions?.(res)\n }\n\n const MobileFilterList = () => {\n return (\n filtersPair?.length > 0 && (\n <div className=\"filter-list\">\n {filtersPair.map((filter: any, i: number) => {\n const openOption = openOptions?.find?.((item: any) => item.label == filter.label) as any\n return (\n <div key={`${filter.label}${i}`} className={cn('mb-4 overflow-hidden duration-300 ease-in-out')}>\n <div\n onClick={() => handleFilterOpt(filter.label)}\n className={\n 'relative flex items-center justify-between md-tablet:justify-center text-base font-semibold cursor-pointer leading-none'\n }\n >\n <button className=\"w-full whitespace-nowrap text-left font-medium overflow-hidden box-border\">\n <span className=\"pr-2 font-semibold truncate\">{filter.label}</span>\n </button>\n <div className={`duration-300 ease-in-out ${openOption?.show && 'rotate-180'}`}>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"7\" viewBox=\"0 0 12 7\" fill=\"none\">\n <path\n d=\"M5.5268 0.668525C5.82138 0.428262 6.25563 0.445208 6.53022 0.719795L11.0302 5.2198C11.3231 5.51269 11.3231 5.98745 11.0302 6.28034C10.7373 6.57324 10.2626 6.57324 9.96967 6.28034L5.99994 2.31062L2.03022 6.28034C1.73732 6.57324 1.26256 6.57324 0.96967 6.28034C0.676777 5.98745 0.676777 5.51269 0.96967 5.2198L5.46967 0.719795L5.5268 0.668525Z\"\n fill=\"#1D1D1F\"\n />\n </svg>\n </div>\n </div>\n <div className={'transition-all duration-400 ease-in-out overflow-hidden'}>\n <AnimatedUL\n className={'!pt-4 transition-all duration-400 ease-in-out'}\n data-label={filter.label}\n isOpen={!!openOption?.show}\n >\n {filter?.options?.map?.((opt: any, p: number) => {\n const type = filter.type ? (filter.type === 'checkbox' ? 'checkbox' : 'radio') : 'checkbox'\n return (\n <li\n key={opt.value}\n className={cn('w-full mb-4 box-border', {\n 'text-[#32323266] cursor-not-allowed': opt?.count <= 0,\n 'mb-0': p >= filter?.options?.length - 1,\n })}\n >\n <label\n className=\"flex items-center overflow-hidden box-border\"\n htmlFor={`${filter.value}-${p}`}\n >\n <input\n type={type}\n name={filter.value}\n value={opt.value}\n id={`${filter.value}-${p}`}\n disabled={opt?.count <= 0}\n checked={opt.checked}\n className={cn(\n 'size-4 cursor-pointer',\n opt.checked\n ? 'accent-[#000000]'\n : `appearance-none bg-transparent border border-[#000000] ${type === 'radio' ? 'rounded-full' : 'rounded-[2px]'}`\n )}\n onChange={e => filterChange(e, filter, opt, type)}\n />\n <p\n className={cn(\n 'pt-0.5 pl-0.5 inline-block cursor-pointer font-semibold leading-none text-base'\n )}\n >\n {opt.label}\n </p>\n </label>\n </li>\n )\n })}\n </AnimatedUL>\n </div>\n </div>\n )\n })}\n </div>\n )\n )\n }\n\n useEffect(() => {\n if (filtersPair?.length && !openOptions?.length && !onceRef.current) {\n onceRef.current = true\n let res = []\n const domList = document?.getElementsByClassName(filterListItemClassName)\n for (let index = 0; index < domList.length; index++) {\n let data = {} as any\n data.label = domList?.[index]?.getAttribute('data-label')\n data.show = isMobile ? false : index < 6 ? true : false\n data.height = document?.getElementsByClassName(filterListItemClassName)?.[index]?.clientHeight\n res.push(data)\n }\n onOpenOptions?.(res)\n }\n }, [filtersPair])\n\n useEffect(() => {\n !isMobile && onCloseDrawer?.(false)\n }, [isMobile])\n\n return (\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out',\n 'desktop:w-60 tablet:w-48 laptop:w-[210px] l-tablet:hidden tablet:pt-4 tablet:border-t tablet:border-[#E4E5E6]',\n 'md-tablet:fixed md-tablet:bottom-0 md-tablet:left-0 md-tablet:right-0 md-tablet:top-0 md-tablet:z-[99]',\n closeFilter\n ? 'md-tablet:pointer-events-auto md-tablet:opacity-100'\n : 'md-tablet:pointer-events-none md-tablet:opacity-0'\n )}\n >\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full',\n closeFilter ? 'md-tablet:translate-y-0' : 'md-tablet:translate-y-[100%]'\n )}\n >\n {MobileFilterList()}\n </div>\n <Drawer open={mobileDrawerVisible} onOpenChange={() => onCloseDrawer(false)}>\n <DrawerContent className=\"px-4 pb-4 max-h-[94.5vh] flex flex-col\">\n <DrawerHeader className=\"sticky top-0 inset-x-0 py-0 mb-6\">\n <DrawerTitle>{drawerText?.drawerTitle || 'Mobile Filter'}</DrawerTitle>\n </DrawerHeader>\n <div className=\"flex-1 overflow-y-auto\">{MobileFilterList()}</div>\n <DrawerFooter className=\"pb-0 pt-4\">\n <div className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2')}>\n <Button\n variant=\"secondary\"\n className=\"m-tablet:w-full\"\n onClick={() => {\n onClearFiltered?.()\n onCloseDrawer(false)\n }}\n >\n {drawerText?.secondaryButton || 'Clear'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\n onClick={() => {\n onCloseDrawer(false)\n }}\n >\n {drawerText?.primaryButton || 'Apply'}\n </Button>\n </div>\n </DrawerFooter>\n </DrawerContent>\n </Drawer>\n </div>\n )\n}\n"],
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
6
|
-
"names": ["FilterList_exports", "__export", "FilterList", "__toCommonJS", "import_jsx_runtime", "import_AnimatedUL", "import_utils", "import_es_toolkit", "import_react", "import_react_responsive", "
|
|
4
|
+
"sourcesContent": ["import AnimatedUL from './component/AnimatedUL'\nimport { cn } from '../../helpers/utils'\nimport type { ChangeEvent } from 'react'\nimport { remove, cloneDeep } from 'es-toolkit'\nimport { useEffect, useRef } from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport { Button, Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerFooter } from '../../components/index.js'\n\ninterface FilterListProps {\n onFilteredChange: (filtered: any, filter: any, opt: any) => void\n onOpenOptions: (openOpt: any[]) => void\n closeFilter: boolean // \u662F\u5426\u5173\u95ED\u7B5B\u9009\u9879\u5C55\u793A\n shopifyData?: any\n filtersPair: any\n filtered: any // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n openOptions: any[] // \u5C55\u5F00\u7B5B\u9009\u9879\n mobileDrawerVisible: boolean\n onClearFiltered: () => void\n onCloseDrawer: (closeDrawer: boolean) => void\n}\n\nconst filterListItemClassName = '!pt-4 transition-all duration-400 ease-in-out'\n\nexport default function FilterList(props: FilterListProps) {\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n const onceRef = useRef<boolean>(false)\n\n const {\n filtersPair,\n closeFilter,\n filtered,\n shopifyData,\n openOptions,\n mobileDrawerVisible,\n onCloseDrawer,\n onFilteredChange,\n onOpenOptions,\n onClearFiltered,\n } = props\n\n const { drawerText } = shopifyData\n\n const filterChange = (event: ChangeEvent<HTMLInputElement>, filter: any, opt: any, type: string) => {\n const target = event.target\n const clonefiltered = cloneDeep(filtered) || {}\n let current = clonefiltered?.[target?.name] || []\n if (target.checked) {\n type === 'checkbox' ? current.push(target?.value) : (current = [target?.value])\n } else {\n remove(current, (v: string) => v === target.value)\n }\n clonefiltered[target.name] = current\n if (current.length <= 0) {\n Reflect.deleteProperty(clonefiltered, target.name)\n }\n onFilteredChange?.({ ...clonefiltered }, filter, opt)\n }\n\n const handleFilterOpt = (label: string) => {\n let res = openOptions?.concat?.()\n res?.map?.((item: any) => {\n if (item.label === label) return (item.show = !item.show)\n return item\n })\n onOpenOptions?.(res)\n }\n\n const MobileFilterList = () => {\n return (\n filtersPair?.length > 0 && (\n <div className=\"filter-list\">\n {filtersPair.map((filter: any, i: number) => {\n const openOption = openOptions?.find?.((item: any) => item.label == filter.label) as any\n return (\n <div key={`${filter.label}${i}`} className={cn('mb-4 overflow-hidden duration-300 ease-in-out')}>\n <div\n onClick={() => handleFilterOpt(filter.label)}\n className={\n 'relative flex items-center justify-between md-tablet:justify-center text-base font-semibold cursor-pointer leading-none'\n }\n >\n <button className=\"w-full whitespace-nowrap text-left font-medium overflow-hidden box-border\">\n <span className=\"pr-2 font-semibold truncate\">{filter.label}</span>\n </button>\n <div className={`duration-300 ease-in-out ${openOption?.show && 'rotate-180'}`}>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"7\" viewBox=\"0 0 12 7\" fill=\"none\">\n <path\n d=\"M5.5268 0.668525C5.82138 0.428262 6.25563 0.445208 6.53022 0.719795L11.0302 5.2198C11.3231 5.51269 11.3231 5.98745 11.0302 6.28034C10.7373 6.57324 10.2626 6.57324 9.96967 6.28034L5.99994 2.31062L2.03022 6.28034C1.73732 6.57324 1.26256 6.57324 0.96967 6.28034C0.676777 5.98745 0.676777 5.51269 0.96967 5.2198L5.46967 0.719795L5.5268 0.668525Z\"\n fill=\"#1D1D1F\"\n />\n </svg>\n </div>\n </div>\n <div className={'transition-all duration-400 ease-in-out overflow-hidden'}>\n <AnimatedUL\n className={'!pt-4 transition-all duration-400 ease-in-out'}\n data-label={filter.label}\n isOpen={!!openOption?.show}\n >\n {filter?.options?.map?.((opt: any, p: number) => {\n const type = filter.type ? (filter.type === 'checkbox' ? 'checkbox' : 'radio') : 'checkbox'\n return (\n <li\n key={opt.value}\n className={cn('w-full mb-4 box-border', {\n 'text-[#32323266] cursor-not-allowed': opt?.count <= 0,\n 'mb-0': p >= filter?.options?.length - 1,\n })}\n >\n <label\n className=\"flex items-center overflow-hidden box-border\"\n htmlFor={`${filter.value}-${p}`}\n >\n <input\n type={type}\n name={filter.value}\n value={opt.value}\n id={`${filter.value}-${p}`}\n disabled={opt?.count <= 0}\n checked={opt.checked}\n className={cn(\n 'size-4 cursor-pointer',\n opt.checked\n ? 'accent-[#000000]'\n : `appearance-none bg-transparent border border-[#000000] ${type === 'radio' ? 'rounded-full' : 'rounded-[2px]'}`\n )}\n onChange={e => filterChange(e, filter, opt, type)}\n />\n <p\n className={cn(\n 'pt-0.5 pl-0.5 inline-block cursor-pointer font-semibold leading-none text-base'\n )}\n >\n {opt.label}\n </p>\n </label>\n </li>\n )\n })}\n </AnimatedUL>\n </div>\n </div>\n )\n })}\n </div>\n )\n )\n }\n\n useEffect(() => {\n if (filtersPair?.length && !openOptions?.length && !onceRef.current) {\n onceRef.current = true\n let res = []\n const domList = document?.getElementsByClassName(filterListItemClassName)\n for (let index = 0; index < domList.length; index++) {\n let data = {} as any\n data.label = domList?.[index]?.getAttribute('data-label')\n data.show = isMobile ? false : index < 6 ? true : false\n data.height = document?.getElementsByClassName(filterListItemClassName)?.[index]?.clientHeight\n res.push(data)\n }\n onOpenOptions?.(res)\n }\n }, [filtersPair])\n\n useEffect(() => {\n !isMobile && onCloseDrawer?.(false)\n }, [isMobile])\n\n return (\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out',\n 'desktop:w-60 tablet:w-48 laptop:w-[210px] l-tablet:hidden tablet:pt-4 tablet:border-t tablet:border-[#E4E5E6]',\n 'md-tablet:fixed md-tablet:bottom-0 md-tablet:left-0 md-tablet:right-0 md-tablet:top-0 md-tablet:z-[99]',\n closeFilter\n ? 'md-tablet:pointer-events-auto md-tablet:opacity-100'\n : 'md-tablet:pointer-events-none md-tablet:opacity-0'\n )}\n >\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full',\n closeFilter ? 'md-tablet:translate-y-0' : 'md-tablet:translate-y-[100%]'\n )}\n >\n {MobileFilterList()}\n </div>\n <Drawer open={mobileDrawerVisible} onOpenChange={() => onCloseDrawer(false)}>\n <DrawerContent className=\"px-4 pb-4 max-h-[94.5vh] flex flex-col\">\n <DrawerHeader className=\"sticky top-0 inset-x-0 py-0 mb-6\">\n <DrawerTitle>{drawerText?.drawerTitle || 'Mobile Filter'}</DrawerTitle>\n </DrawerHeader>\n <div className=\"flex-1 overflow-y-auto\">{MobileFilterList()}</div>\n <DrawerFooter className=\"pb-0 pt-4\">\n <div className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2')}>\n <Button\n variant=\"secondary\"\n className=\"m-tablet:w-full\"\n onClick={() => {\n onClearFiltered?.()\n onCloseDrawer(false)\n }}\n >\n {drawerText?.secondaryButton || 'Clear'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\n onClick={() => {\n onCloseDrawer(false)\n }}\n >\n {drawerText?.primaryButton || 'Apply'}\n </Button>\n </div>\n </DrawerFooter>\n </DrawerContent>\n </Drawer>\n </div>\n )\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["FilterList_exports", "__export", "FilterList", "__toCommonJS", "import_jsx_runtime", "import_AnimatedUL", "import_utils", "import_es_toolkit", "import_react", "import_react_responsive", "import_components", "filterListItemClassName", "props", "isMobile", "onceRef", "filtersPair", "closeFilter", "filtered", "shopifyData", "openOptions", "mobileDrawerVisible", "onCloseDrawer", "onFilteredChange", "onOpenOptions", "onClearFiltered", "drawerText", "filterChange", "event", "filter", "opt", "type", "target", "clonefiltered", "current", "v", "handleFilterOpt", "label", "res", "item", "MobileFilterList", "i", "openOption", "AnimatedUL", "p", "e", "domList", "index", "data"]
|
|
7
7
|
}
|
|
@@ -1,8 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
interface TabsProps {
|
|
3
3
|
tabs: any[];
|
|
4
|
+
filtered: any;
|
|
5
|
+
metafields: any;
|
|
6
|
+
filtersPair: any;
|
|
7
|
+
filtersData: any;
|
|
4
8
|
tabShape?: 'rounded' | 'square';
|
|
5
|
-
onTabClick?: (
|
|
9
|
+
onTabClick?: (value: any, item: any) => void;
|
|
6
10
|
}
|
|
7
11
|
declare const TabFilter: React.FC<TabsProps>;
|
|
8
12
|
export default TabFilter;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var q=Object.create;var p=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var O=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var B=(t,a)=>{for(var n in a)p(t,n,{get:a[n],enumerable:!0})},P=(t,a,n,d)=>{if(a&&typeof a=="object"||typeof a=="function")for(let l of M(a))!j.call(t,l)&&l!==n&&p(t,l,{get:()=>a[l],enumerable:!(d=F(a,l))||d.enumerable});return t};var H=(t,a,n)=>(n=t!=null?q(O(t)):{},P(a||!t||!t.__esModule?p(n,"default",{value:t,enumerable:!0}):n,t)),I=t=>P(p({},"__esModule",{value:!0}),t);var z={};B(z,{default:()=>_});module.exports=I(z);var c=require("react/jsx-runtime"),w=require("es-toolkit"),o=require("react"),D=H(require("../../../components/link")),b=require("../../../helpers/utils.js"),L=require("../../AiuiProvider/index.js");const g="All",X=t=>{const{metafields:a,tabs:n,onTabClick:d,tabShape:l="square",filtersPair:m,filtered:u,filtersData:f}=t,{name:h}=a,{pathname:C}=(0,L.useAiuiContext)(),k=(0,o.useRef)(null),[y,E]=(0,o.useState)([]),[T,R]=(0,o.useState)([]),W=e=>{const i=(0,w.cloneDeep)(u)||{};let s=i?.[r?.value]||[];e?.options===(f?.mainPair?.alltxt||h||g)?s=[]:s=[e?.value||e],i[r?.value]=s,s.length<=0&&Reflect.deleteProperty(i,r?.value),d?.({...i},e);const v=document.getElementById(`tab-${e?.label||e}`),x=k.current;if(v&&x){const A=v.offsetLeft,N=v.offsetWidth,S=x.offsetWidth,$=A-S/2+N/2;x.scrollTo({left:$,behavior:"smooth"})}},r=(0,o.useMemo)(()=>m?.find(e=>e.mainPair),[m]);return(0,o.useEffect)(()=>{if(n?.length)E(n);else{const e=r?.options||[],s=[{label:f?.mainPair?.alltxt||h||g,value:r?.value,options:f?.mainPair?.alltxt||h||g},...e];R(s)}},[r,f,n]),y?.length>0||T?.length>0?(0,c.jsx)("div",{ref:k,className:(0,b.cn)(l==="rounded"?"rounded-[28px]":"","tab-switch-wrap bg-tabs-list-bg relative flex gap-x-1 w-fit max-w-full overflow-x-auto overflow-y-hidden p-1 laptop:m-auto"),children:y?.length>0?y?.map?.(e=>(0,c.jsx)(D.default,{id:`tab-${e?.label}`,href:e?.href,className:(0,b.cn)("relative flex-1 shrink-0 whitespace-nowrap transition-all","text-info-primary px-5 py-2.5 text-sm lg-desktop:text-base font-semibold no-underline","lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5 hover:bg-btn-primary-disabled-foreground hover:text-info-primary",l==="rounded"?"rounded-[28px]":"",e?.href&&e?.href===C?"bg-btn-primary-disabled-foreground":""),children:e?.label||""},e?.label)):T?.map?.(e=>(0,c.jsx)("div",{id:`tab-${e?.label||e}`,onClick:()=>W(e),className:(0,b.cn)("relative flex-1 shrink-0 whitespace-nowrap transition-all","text-info-primary px-5 py-2.5 text-sm lg-desktop:text-base font-semibold no-underline","lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5 hover:bg-btn-primary-disabled-foreground hover:text-info-primary",l==="rounded"?"rounded-[28px]":"",u?.[r?.value]?.includes?.(e?.value||e)||!u?.[r?.value]?.length&&e?.options?"bg-btn-primary-disabled-foreground":""),children:e?.label||e},e?.value||e))}):null};var _=X;
|
|
2
2
|
//# sourceMappingURL=TabFilter.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/biz-components/CollectionsFilters/component/TabFilter.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React, { useRef, useState } from 'react'\nimport Link from '../../../components/link'\nimport { cn } from '../../../helpers/utils.js'\
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
6
|
-
"names": ["TabFilter_exports", "__export", "TabFilter_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_link", "import_utils", "TabFilter", "tabs", "onTabClick", "tabShape", "tabRef", "
|
|
4
|
+
"sourcesContent": ["'use client'\nimport { remove, cloneDeep } from 'es-toolkit'\nimport React, { useRef, useState, useMemo, useEffect } from 'react'\nimport Link from '../../../components/link'\nimport { cn } from '../../../helpers/utils.js'\nimport { useAiuiContext } from '../../AiuiProvider/index.js'\ninterface TabsProps {\n tabs: any[]\n filtered: any\n metafields: any\n filtersPair: any\n filtersData: any\n tabShape?: 'rounded' | 'square'\n onTabClick?: (value: any, item: any) => void\n}\n\nconst ALL_TEXT = 'All'\n\nconst TabFilter: React.FC<TabsProps> = (props: TabsProps) => {\n const { metafields, tabs, onTabClick, tabShape = 'square', filtersPair, filtered, filtersData } = props\n const { name } = metafields\n\n const { pathname } = useAiuiContext()\n\n const tabRef = useRef<HTMLDivElement>(null)\n const [linkData, setLinkData] = useState<any[]>([])\n const [tabData, setTabData] = useState<any[]>([])\n\n const handleTabClick = (item: any) => {\n const clonefiltered = cloneDeep(filtered) || {}\n let current = clonefiltered?.[mainPair?.value] || []\n if (item?.options === (filtersData?.mainPair?.alltxt || name || ALL_TEXT)) {\n current = []\n } else {\n current = [item?.value || item]\n }\n clonefiltered[mainPair?.value] = current\n if (current.length <= 0) {\n Reflect.deleteProperty(clonefiltered, mainPair?.value)\n }\n onTabClick?.({ ...clonefiltered }, item)\n\n // \u83B7\u53D6\u5F53\u524D\u9009\u4E2D\u7684 tab \u5E76\u8BA1\u7B97\u4E0B\u5212\u7EBF\u4F4D\u7F6E\n const tabElement = document.getElementById(`tab-${item?.label || item}`)\n // **\u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E**\n const container = tabRef.current\n if (tabElement && container) {\n const tabLeft = tabElement.offsetLeft // \u9009\u4E2D tab \u7684\u5DE6\u4FA7\u504F\u79FB\u91CF\n const tabWidth = tabElement.offsetWidth\n const containerWidth = container.offsetWidth\n // \u8BA1\u7B97\u76EE\u6807\u6EDA\u52A8\u4F4D\u7F6E\uFF0C\u4F7F tab \u5C45\u4E2D\n const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n container.scrollTo({\n left: scrollTo,\n behavior: 'smooth',\n })\n }\n }\n\n const mainPair = useMemo(() => {\n return filtersPair?.find((item: any) => item.mainPair)\n }, [filtersPair])\n\n useEffect(() => {\n if (tabs?.length) {\n setLinkData(tabs)\n } else {\n const currentData = mainPair?.options || []\n const allObject = {\n label: filtersData?.mainPair?.alltxt || name || ALL_TEXT,\n value: mainPair?.value,\n options: filtersData?.mainPair?.alltxt || name || ALL_TEXT,\n }\n const tabData = [allObject, ...currentData]\n setTabData(tabData)\n }\n }, [mainPair, filtersData, tabs])\n\n return linkData?.length > 0 || tabData?.length > 0 ? (\n <div\n ref={tabRef}\n className={cn(\n tabShape === 'rounded' ? 'rounded-[28px]' : '',\n 'tab-switch-wrap bg-tabs-list-bg relative flex gap-x-1 w-fit max-w-full overflow-x-auto overflow-y-hidden p-1 laptop:m-auto'\n )}\n >\n {linkData?.length > 0\n ? linkData?.map?.((item: any) => (\n <Link\n key={item?.label}\n id={`tab-${item?.label}`}\n href={item?.href}\n className={cn(\n 'relative flex-1 shrink-0 whitespace-nowrap transition-all',\n 'text-info-primary px-5 py-2.5 text-sm lg-desktop:text-base font-semibold no-underline',\n 'lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5 hover:bg-btn-primary-disabled-foreground hover:text-info-primary',\n tabShape === 'rounded' ? 'rounded-[28px]' : '',\n item?.href && item?.href === pathname ? 'bg-btn-primary-disabled-foreground' : ''\n )}\n >\n {item?.label || ''}\n </Link>\n ))\n : tabData?.map?.((item: any) => {\n return (\n <div\n key={item?.value || item}\n id={`tab-${item?.label || item}`}\n onClick={() => handleTabClick(item)}\n className={cn(\n 'relative flex-1 shrink-0 whitespace-nowrap transition-all',\n 'text-info-primary px-5 py-2.5 text-sm lg-desktop:text-base font-semibold no-underline',\n 'lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5 hover:bg-btn-primary-disabled-foreground hover:text-info-primary',\n tabShape === 'rounded' ? 'rounded-[28px]' : '',\n filtered?.[mainPair?.value]?.includes?.(item?.value || item) ||\n (!filtered?.[mainPair?.value]?.length && item?.options)\n ? 'bg-btn-primary-disabled-foreground'\n : ''\n )}\n >\n {item?.label || item}\n </div>\n )\n })}\n </div>\n ) : null\n}\n\nexport default TabFilter\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["TabFilter_exports", "__export", "TabFilter_default", "__toCommonJS", "import_jsx_runtime", "import_es_toolkit", "import_react", "import_link", "import_utils", "import_AiuiProvider", "ALL_TEXT", "TabFilter", "props", "metafields", "tabs", "onTabClick", "tabShape", "filtersPair", "filtered", "filtersData", "name", "pathname", "tabRef", "linkData", "setLinkData", "tabData", "setTabData", "handleTabClick", "item", "clonefiltered", "current", "mainPair", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo", "currentData", "Link"]
|
|
7
7
|
}
|
|
@@ -4,5 +4,9 @@ declare const handleFilters: (filtered: any) => {
|
|
|
4
4
|
};
|
|
5
5
|
declare const handleSortKeyAndReverse: (sortList: any, sortKeyIndx: number) => any[];
|
|
6
6
|
declare const handleChunkNumber: (filtered: any) => 18 | 150;
|
|
7
|
-
declare const handleFilterOptions: (result: any, filterPrice: any, shop_filters_pair: any) => any;
|
|
8
|
-
|
|
7
|
+
declare const handleFilterOptions: (result: any, filterPrice: any, shop_filters_pair: any, filterProductData?: any) => any;
|
|
8
|
+
declare function getComponentData(metafields: any, dataKey: string, variant?: any, components?: any): {
|
|
9
|
+
key: string;
|
|
10
|
+
data: {};
|
|
11
|
+
};
|
|
12
|
+
export { handleFilters, handleSortKeyAndReverse, handleChunkNumber, handleFilterOptions, getComponentData };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var p=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var O=Object.prototype.hasOwnProperty;var E=(n,e)=>{for(var i in e)p(n,i,{get:e[i],enumerable:!0})},g=(n,e,i,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of h(e))!O.call(n,l)&&l!==i&&p(n,l,{get:()=>e[l],enumerable:!(t=d(e,l))||t.enumerable});return n};var x=n=>g(p({},"__esModule",{value:!0}),n);var F={};E(F,{getComponentData:()=>c,handleChunkNumber:()=>m,handleFilterOptions:()=>y,handleFilters:()=>v,handleSortKeyAndReverse:()=>b});module.exports=x(F);const v=n=>{const e=[];let i=18;return Object.keys(n).forEach(t=>{if(t==="price"){const l=n[t]?.join("|")?.split("|")?.map(s=>Number(s))||[],f=Math.max(...l),r=Math.min(...l);f&&r&&e.push({price:{max:f,min:r}})}if(t.includes("filter.p.tag")&&n[t]?.forEach(l=>{e.push({tag:l})}),t.includes("filter.p.product_type")&&n[t]?.forEach(l=>{e.push({productType:l})}),t.includes("filter.v.availability")&&n[t]?.forEach(l=>{const f=l.split("filter.v.availability.")?.pop();e.push({available:f==="1"})}),t.includes("filter.v.m.filter.")){const l=t.split("filter.v.m.filter.")?.pop();n[t]?.forEach(f=>{e.push({variantMetafield:{namespace:"filter",key:l,value:f}})})}t.includes("offers")&&(i=150)}),{allFilters:e,chunkNumber:i}},b=(n,e)=>{if(n&&e>=0){const i=n?.[e];if(!i?.type?.includes("filter.")){const[t,l]=i?.type?.split("|");return[t,!!l]}}return["COLLECTION_DEFAULT",!1]},m=n=>Object.keys(n)?.some(e=>e==="offers")?150:18,y=(n,e,i,t)=>{const l={label:i?.filter_txt?.offers?.name||"Offers",value:"offers",mainPair:!1,options:[{label:i?.filter_txt?.offers?.onsale||"On Sale",value:"onsale"}]};e.mainPair=!1;const f=[e,l];return n?.filters&&n.filters.reduce((r,s)=>{const u={label:s?.label,options:[],value:s?.id,mainPair:t?.mainPair?.type===s?.id};return s?.id==="filter.v.price"||s?.id==="filter.p.product_type"?r:s?.id==="filter.v.availability"?(u.options=s.values.reduce((o,a)=>(a.id==="filter.v.availability.1"&&o.push({count:a.count,label:a.label,value:a.id}),[...o]),[]),r.push(u),[...r]):s?.id==="filter.v.m.filter.capacity"?(u.options=s.values.reduce((o,a)=>(a?.label?.includes("Over")?o.unshift({count:a.count,label:a.label,value:a.label}):o.push({count:a.count,label:a.label,value:a.label}),[...o]),[]),r.push(u),[...r]):(u.options=s.values.reduce((o,a)=>(o.push({count:a.count,label:a.label,value:a.label}),[...o]),[]),r.push(u),[...r])},f)};function c(n,e,i=null,t=null){let l={};if(t?l=t[e?.trim()]||{}:l=n?.components?n.components[e?.trim()]:{},i){const{variantsMetafields:f={}}=t||n?.components||{},r=Array.isArray(f)?f?.find(s=>s.id===i?.id):{};r?.metafields&&r.metafields[e]&&(l=r.metafields[e])}return{key:e.split("_")[0],data:l}}
|
|
2
2
|
//# sourceMappingURL=filtersFun.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/biz-components/CollectionsFilters/component/filtersFun.ts"],
|
|
4
|
-
"sourcesContent": ["const handleFilters = (filtered: any) => {\n const allFilters: any[] = []\n let chunkNumber: number = 18\n Object.keys(filtered).forEach(key => {\n if (key === 'price') {\n const priceOptions =\n filtered[key]\n ?.join('|')\n ?.split('|')\n ?.map((item: any) => Number(item)) || []\n const maxValue = Math.max(...priceOptions)\n const minValue = Math.min(...priceOptions)\n maxValue &&\n minValue &&\n allFilters.push({\n price: {\n max: maxValue,\n min: minValue,\n },\n })\n }\n if (key.includes('filter.p.tag')) {\n filtered[key]?.forEach((item: any) => {\n allFilters.push({\n tag: item,\n })\n })\n }\n if (key.includes('filter.p.product_type')) {\n filtered[key]?.forEach((item: any) => {\n allFilters.push({\n productType: item,\n })\n })\n }\n if (key.includes('filter.v.availability')) {\n filtered[key]?.forEach((item: string) => {\n const val = item.split('filter.v.availability.')?.pop()\n allFilters.push({\n available: val === '1',\n })\n })\n }\n if (key.includes('filter.v.m.filter.')) {\n const metafieldsKey = key.split('filter.v.m.filter.')?.pop()\n filtered[key]?.forEach((item: any) => {\n allFilters.push({\n variantMetafield: {\n namespace: 'filter',\n key: metafieldsKey,\n value: item,\n },\n })\n })\n }\n if (key.includes('offers')) {\n chunkNumber = 150\n }\n })\n return { allFilters: allFilters, chunkNumber: chunkNumber }\n}\n\nconst handleSortKeyAndReverse = (sortList: any, sortKeyIndx: number) => {\n if (sortList && sortKeyIndx >= 0) {\n const current = sortList?.[sortKeyIndx]\n if (!current?.type?.includes('filter.')) {\n const [sortKey, reverse] = current?.type?.split('|')\n return [sortKey, !!reverse]\n }\n }\n return ['COLLECTION_DEFAULT', false]\n}\n\nconst handleChunkNumber = (filtered: any) => {\n if (Object.keys(filtered)?.some(key => key === 'offers')) return 150\n return 18\n}\n\n\nconst handleFilterOptions = (result: any, filterPrice: any, shop_filters_pair: any) => {\n const Offers = {\n label: shop_filters_pair?.filter_txt?.offers?.name || 'Offers',\n value: 'offers',\n mainPair: false,\n options: [\n {\n label: shop_filters_pair?.filter_txt?.offers?.onsale || 'On Sale',\n value: 'onsale',\n },\n ],\n }\n filterPrice.mainPair = false\n const initOption = [filterPrice, Offers]\n return (\n result?.filters &&\n result.filters.reduce((ac: any, cu: any) => {\n const filter = {\n label: cu?.label,\n options: [],\n value: cu?.id,\n mainPair: false,\n }\n // if (cu?.id === 'filter.p.tag') return ac\n if (cu?.id === 'filter.v.price') return ac\n if (cu?.id === 'filter.p.product_type') return ac\n if (cu?.id === 'filter.v.availability') {\n filter.options = cu.values.reduce((acV: any, cuV: any) => {\n if (cuV.id === 'filter.v.availability.1') {\n acV.push({\n count: cuV.count,\n label: cuV.label,\n value: cuV.id,\n })\n }\n return [...acV]\n }, [])\n ac.push(filter)\n return [...ac]\n }\n if (cu?.id === 'filter.v.m.filter.capacity') {\n filter.options = cu.values.reduce((acV: any, cuV: any) => {\n if (cuV?.label?.includes('Over')) {\n acV.unshift({\n count: cuV.count,\n label: cuV.label,\n value: cuV.label,\n })\n } else {\n acV.push({\n count: cuV.count,\n label: cuV.label,\n value: cuV.label,\n })\n }\n return [...acV]\n }, [])\n ac.push(filter)\n return [...ac]\n }\n filter.options = cu.values.reduce((acV: any, cuV: any) => {\n acV.push({\n count: cuV.count,\n label: cuV.label,\n value: cuV.label,\n })\n return [...acV]\n }, [])\n ac.push(filter)\n return [...ac]\n }, initOption)\n )\n}\n\nexport { handleFilters, handleSortKeyAndReverse, handleChunkNumber, handleFilterOptions }"],
|
|
5
|
-
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,
|
|
6
|
-
"names": ["filtersFun_exports", "__export", "handleChunkNumber", "handleFilterOptions", "handleFilters", "handleSortKeyAndReverse", "__toCommonJS", "filtered", "allFilters", "chunkNumber", "key", "priceOptions", "item", "maxValue", "minValue", "val", "metafieldsKey", "sortList", "sortKeyIndx", "current", "sortKey", "reverse", "result", "filterPrice", "shop_filters_pair", "Offers", "initOption", "ac", "cu", "filter", "acV", "cuV"]
|
|
4
|
+
"sourcesContent": ["const handleFilters = (filtered: any) => {\n const allFilters: any[] = []\n let chunkNumber: number = 18\n Object.keys(filtered).forEach(key => {\n if (key === 'price') {\n const priceOptions =\n filtered[key]\n ?.join('|')\n ?.split('|')\n ?.map((item: any) => Number(item)) || []\n const maxValue = Math.max(...priceOptions)\n const minValue = Math.min(...priceOptions)\n maxValue &&\n minValue &&\n allFilters.push({\n price: {\n max: maxValue,\n min: minValue,\n },\n })\n }\n if (key.includes('filter.p.tag')) {\n filtered[key]?.forEach((item: any) => {\n allFilters.push({\n tag: item,\n })\n })\n }\n if (key.includes('filter.p.product_type')) {\n filtered[key]?.forEach((item: any) => {\n allFilters.push({\n productType: item,\n })\n })\n }\n if (key.includes('filter.v.availability')) {\n filtered[key]?.forEach((item: string) => {\n const val = item.split('filter.v.availability.')?.pop()\n allFilters.push({\n available: val === '1',\n })\n })\n }\n if (key.includes('filter.v.m.filter.')) {\n const metafieldsKey = key.split('filter.v.m.filter.')?.pop()\n filtered[key]?.forEach((item: any) => {\n allFilters.push({\n variantMetafield: {\n namespace: 'filter',\n key: metafieldsKey,\n value: item,\n },\n })\n })\n }\n if (key.includes('offers')) {\n chunkNumber = 150\n }\n })\n return { allFilters: allFilters, chunkNumber: chunkNumber }\n}\n\nconst handleSortKeyAndReverse = (sortList: any, sortKeyIndx: number) => {\n if (sortList && sortKeyIndx >= 0) {\n const current = sortList?.[sortKeyIndx]\n if (!current?.type?.includes('filter.')) {\n const [sortKey, reverse] = current?.type?.split('|')\n return [sortKey, !!reverse]\n }\n }\n return ['COLLECTION_DEFAULT', false]\n}\n\nconst handleChunkNumber = (filtered: any) => {\n if (Object.keys(filtered)?.some(key => key === 'offers')) return 150\n return 18\n}\n\n\nconst handleFilterOptions = (result: any, filterPrice: any, shop_filters_pair: any, filterProductData?: any) => {\n const Offers = {\n label: shop_filters_pair?.filter_txt?.offers?.name || 'Offers',\n value: 'offers',\n mainPair: false,\n options: [\n {\n label: shop_filters_pair?.filter_txt?.offers?.onsale || 'On Sale',\n value: 'onsale',\n },\n ],\n }\n filterPrice.mainPair = false\n const initOption = [filterPrice, Offers]\n return (\n result?.filters &&\n result.filters.reduce((ac: any, cu: any) => {\n const filter = {\n label: cu?.label,\n options: [],\n value: cu?.id,\n mainPair: filterProductData?.mainPair?.type === cu?.id ? true : false,\n }\n // if (cu?.id === 'filter.p.tag') return ac\n if (cu?.id === 'filter.v.price') return ac\n if (cu?.id === 'filter.p.product_type') return ac\n if (cu?.id === 'filter.v.availability') {\n filter.options = cu.values.reduce((acV: any, cuV: any) => {\n if (cuV.id === 'filter.v.availability.1') {\n acV.push({\n count: cuV.count,\n label: cuV.label,\n value: cuV.id,\n })\n }\n return [...acV]\n }, [])\n ac.push(filter)\n return [...ac]\n }\n if (cu?.id === 'filter.v.m.filter.capacity') {\n filter.options = cu.values.reduce((acV: any, cuV: any) => {\n if (cuV?.label?.includes('Over')) {\n acV.unshift({\n count: cuV.count,\n label: cuV.label,\n value: cuV.label,\n })\n } else {\n acV.push({\n count: cuV.count,\n label: cuV.label,\n value: cuV.label,\n })\n }\n return [...acV]\n }, [])\n ac.push(filter)\n return [...ac]\n }\n filter.options = cu.values.reduce((acV: any, cuV: any) => {\n acV.push({\n count: cuV.count,\n label: cuV.label,\n value: cuV.label,\n })\n return [...acV]\n }, [])\n ac.push(filter)\n return [...ac]\n }, initOption)\n )\n}\n\nfunction getComponentData(\n metafields: any,\n dataKey: string,\n variant: any = null,\n components: any = null\n) {\n // console.log(\"metafields\", metafields)\n // \u83B7\u53D6 component \u7684\u6587\u6848\n\n let data = {}\n if (components) {\n data = components[dataKey?.trim()] || {}\n } else {\n data = metafields?.components ? metafields.components[dataKey?.trim()] : {}\n }\n\n if (variant) {\n // \u5982\u679C\u6709\u4E14 variant \u6709\u5BF9\u5E94\u6587\u6848\uFF0Cvariant \u8986\u76D6 component\n const { variantsMetafields = {} } =\n components || metafields?.components || {}\n\n const variantMetafields = Array.isArray(variantsMetafields)\n ? variantsMetafields?.find((f) => f.id === variant?.id)\n : {}\n if (\n variantMetafields?.metafields &&\n variantMetafields.metafields[dataKey]\n ) {\n data = variantMetafields.metafields[dataKey]\n }\n }\n\n return {\n key: dataKey.split('_')[0],\n data,\n }\n}\n\nexport { handleFilters, handleSortKeyAndReverse, handleChunkNumber, handleFilterOptions, getComponentData }"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["filtersFun_exports", "__export", "getComponentData", "handleChunkNumber", "handleFilterOptions", "handleFilters", "handleSortKeyAndReverse", "__toCommonJS", "filtered", "allFilters", "chunkNumber", "key", "priceOptions", "item", "maxValue", "minValue", "val", "metafieldsKey", "sortList", "sortKeyIndx", "current", "sortKey", "reverse", "result", "filterPrice", "shop_filters_pair", "filterProductData", "Offers", "initOption", "ac", "cu", "filter", "acV", "cuV", "metafields", "dataKey", "variant", "components", "data", "variantsMetafields", "variantMetafields", "f"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var Y=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,ee=Object.prototype.hasOwnProperty;var te=(t,o)=>{for(var n in o)g(t,n,{get:o[n],enumerable:!0})},L=(t,o,n,f)=>{if(o&&typeof o=="object"||typeof o=="function")for(let l of $(o))!ee.call(t,l)&&l!==n&&g(t,l,{get:()=>o[l],enumerable:!(f=Z(o,l))||f.enumerable});return t};var y=(t,o,n)=>(n=t!=null?Y(j(t)):{},L(o||!t||!t.__esModule?g(n,"default",{value:t,enumerable:!0}):n,t)),oe=t=>L(g({},"__esModule",{value:!0}),t);var ae={};te(ae,{default:()=>ne});module.exports=oe(ae);var s=require("react/jsx-runtime"),R=y(require("./FilterList")),I=y(require("./FilterHeader")),K=y(require("./FilterCardWrap")),_=require("../../shared/Styles.js"),k=y(require("./component/TabFilter")),r=require("react"),i=require("./component/filtersFun");function re(t){const{data:o,result:n={},allResult:f={},loadMore:l=null,metafields:c={},filterPrice:C={},isLoading:M=!1,onFilteredChange:F,onSortAndReverseChange:A,onPrimaryChange:V,onSecondaryChange:z,onNextPage:T,onPrevPage:E}=t,{shop_filters_pair:m}=c,{data:P}=(0,i.getComponentData)(c,"FilterProduct"),[p,H]=(0,r.useState)(!1),[W,x]=(0,r.useState)(!1),[q,B]=(0,r.useState)([]),[d,S]=(0,r.useState)({}),[v,G]=(0,r.useState)(0),[h,u]=(0,r.useState)(1),[J,Q]=(0,r.useState)(!1);(0,r.useMemo)(()=>{const e=m?.filter_txt?.sortList,[a,X]=(0,i.handleSortKeyAndReverse)(e,v);A?.(a,X)},[m?.filter_txt?.sortList,d,v]);const U=e=>!e?.metafields?.seoSetting?.noindex,D=(0,r.useMemo)(()=>f?.products?.filter(U)?.length||0,[f?.products]),b=(0,r.useMemo)(()=>(0,i.handleFilterOptions)(n,C,m,P),[C,n?.filters,m?.filter_txt?.offers?.name,m?.filter_txt?.offers?.onsale]),O=(0,r.useMemo)(()=>b?.length?b?.map?.(e=>({...e,options:e?.options?.map?.(a=>({...a,checked:d?.[e?.value]?.indexOf?.(a?.value)>-1}))})):[],[d,b]),w=e=>{S?.({}),e&&u(1),F?.((0,i.handleFilters)({}))},N=e=>{S(e),u(1),F?.((0,i.handleFilters)(e))};return(0,r.useEffect)(()=>{const a=(d?.offers||[])?.includes?.("onsale");Q(a)},[d]),(0,s.jsxs)("div",{className:"size-full box-border",children:[(0,s.jsx)("div",{className:"laptop:mb-12 mb-6",children:(0,s.jsx)(k.default,{tabs:o?.tabItems,filtered:d,filtersPair:O,filtersData:P,metafields:c,onTabClick:e=>N(e)})}),(0,s.jsx)(I.default,{total:D||0,metafields:c,closeFilter:p,sortKeyIndx:v,shopifyData:o,onSortChange:G,onCloseFilter:H,onClearFiltered:()=>w(),onMobileOpenDrawer:x}),(0,s.jsxs)("div",{className:"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8",children:[!p&&(0,s.jsx)(R.default,{shopifyData:o,filtered:d,openOptions:q,closeFilter:p,filtersPair:O,mobileDrawerVisible:W,onFilteredChange:e=>N(e),onClearFiltered:()=>w(!1),onOpenOptions:B,onCloseDrawer:x}),(0,s.jsxs)("div",{className:"flex-1 overflow-y-auto relative",children:[(0,s.jsx)(K.default,{page:h,result:n,shopifyData:o,total:D,isSale:J,metafields:c,closeFilter:p,onNextPage:e=>{u(h+1),T?.(e)},onPrevPage:e=>{u(h-1),E?.(e)},onPrimaryChange:(e,a)=>V?.(e,a),onSecondaryChange:(e,a)=>z?.(e,a)}),M&&l||null]})]})]})}var ne=(0,_.withLayout)(re);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|