@anker-in/headless-ui 1.0.19-temp-092903 → 1.0.19-temp-100901
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/AplusDesc/index.d.ts +22 -0
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.d.ts +1 -0
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js.map +3 -3
- package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.d.ts +2 -1
- 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/FilterHeader.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/FilterHeader.js.map +2 -2
- 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/index.js +1 -1
- package/dist/cjs/biz-components/CollectionsFilters/index.js.map +3 -3
- package/dist/cjs/biz-components/DownLoad/index.d.ts +17 -0
- package/dist/cjs/biz-components/Features/index.d.ts +26 -0
- package/dist/cjs/biz-components/FootCharger/index.d.ts +12 -0
- package/dist/cjs/biz-components/GiftBox/index.d.ts +17 -0
- package/dist/cjs/biz-components/GraphicMore/index.d.ts +22 -0
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.d.ts +1 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/index.d.ts +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/types.d.ts +1 -11
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.d.ts +1 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGridBox.d.ts +6 -0
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/types.d.ts +0 -8
- package/dist/cjs/biz-components/Listing/types/product.d.ts +2 -0
- package/dist/cjs/biz-components/SelectStore/index.d.ts +26 -0
- package/dist/cjs/stories/aplusdesc.stories.d.ts +27 -0
- package/dist/cjs/stories/download.stories.d.ts +23 -0
- package/dist/cjs/stories/features.stories.d.ts +21 -0
- package/dist/cjs/stories/footcharger.stories.d.ts +19 -0
- package/dist/cjs/stories/giftbox.stories.d.ts +18 -0
- package/dist/cjs/stories/graphicMore.stories.d.ts +19 -0
- package/dist/cjs/stories/selectstore.stories.d.ts +18 -0
- package/dist/cjs/tsconfig.tsbuildinfo +1 -1
- package/dist/esm/biz-components/AplusDesc/index.d.ts +22 -0
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.d.ts +1 -0
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.js.map +3 -3
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.d.ts +2 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.js.map +3 -3
- package/dist/esm/biz-components/CollectionsFilters/FilterHeader.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/FilterHeader.js.map +2 -2
- 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/index.js +1 -1
- package/dist/esm/biz-components/CollectionsFilters/index.js.map +3 -3
- package/dist/esm/biz-components/DownLoad/index.d.ts +17 -0
- package/dist/esm/biz-components/Features/index.d.ts +26 -0
- package/dist/esm/biz-components/FootCharger/index.d.ts +12 -0
- package/dist/esm/biz-components/GiftBox/index.d.ts +17 -0
- package/dist/esm/biz-components/GraphicMore/index.d.ts +22 -0
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.d.ts +1 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/index.d.ts +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/types.d.ts +1 -11
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.d.ts +1 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGridBox.d.ts +6 -0
- package/dist/esm/biz-components/Listing/components/PurchaseBar/types.d.ts +0 -8
- package/dist/esm/biz-components/Listing/types/product.d.ts +2 -0
- package/dist/esm/biz-components/SelectStore/index.d.ts +26 -0
- package/dist/esm/stories/aplusdesc.stories.d.ts +27 -0
- package/dist/esm/stories/download.stories.d.ts +23 -0
- package/dist/esm/stories/features.stories.d.ts +21 -0
- package/dist/esm/stories/footcharger.stories.d.ts +19 -0
- package/dist/esm/stories/giftbox.stories.d.ts +18 -0
- package/dist/esm/stories/graphicMore.stories.d.ts +19 -0
- package/dist/esm/stories/selectstore.stories.d.ts +18 -0
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type { Img } from '../../types/props.js';
|
|
2
|
+
type AplusItem = {
|
|
3
|
+
img: Img;
|
|
4
|
+
mobileImg: Img;
|
|
5
|
+
title: string;
|
|
6
|
+
desc: string;
|
|
7
|
+
theme: 'light' | 'dark';
|
|
8
|
+
};
|
|
9
|
+
type AplusDescType = {
|
|
10
|
+
data: {
|
|
11
|
+
title: string;
|
|
12
|
+
img: Img;
|
|
13
|
+
mobileImg: Img;
|
|
14
|
+
list: AplusItem[];
|
|
15
|
+
};
|
|
16
|
+
className?: string;
|
|
17
|
+
};
|
|
18
|
+
declare const _default: import("react").ForwardRefExoticComponent<Omit<AplusDescType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
19
|
+
className?: string;
|
|
20
|
+
data?: Record<string, any>;
|
|
21
|
+
} & import("react").RefAttributes<any>>;
|
|
22
|
+
export default _default;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var B=Object.create;var h=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var O=(t,o)=>{for(var i in o)h(t,i,{get:o[i],enumerable:!0})},S=(t,o,i,f)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of A(o))!E.call(t,a)&&a!==i&&h(t,a,{get:()=>o[a],enumerable:!(f=T(o,a))||f.enumerable});return t};var Q=(t,o,i)=>(i=t!=null?B(q(t)):{},S(o||!t||!t.__esModule?h(i,"default",{value:t,enumerable:!0}):i,t)),V=t=>S(h({},"__esModule",{value:!0}),t);var G={};O(G,{default:()=>M});module.exports=V(G);var e=require("react/jsx-runtime"),C=require("../../helpers/utils.js"),F=require("react-responsive"),J=require("../Paginator/index.js"),D=Q(require("./FilterCardWrapItem")),m=require("react"),I=require("es-toolkit");function M(t){const{shopifyData:o={},isSale:i=!1,total:f,result:a,closeFilter:p,page:v,metafields:w,onPrimaryChange:N,onSecondaryChange:L,onNextPage:y,onPrevPage:j}=t,{advertisingSpace:k}=w,{buttonText:z,loadMoreText:W}=o,d=k||o?.advertisingSpace,[x,b]=(0,m.useState)([]),s=(0,F.useMediaQuery)({query:"(max-width: 768px)"}),P=c=>{const n=(0,I.cloneDeep)(c||[]);if(d){const r=n.findIndex(g=>g.mImage);if(r===-1){const g=Math.min(p?d?.maxLocation||7:d?.minLocation||5,n.length);n.splice(g,0,d)}else{n.splice(r,1);const g=Math.min(p?d?.maxLocation||7:d?.minLocation||5,n.length);n.splice(g,0,d)}}return n};return(0,m.useEffect)(()=>{(a?.slug||a?.id)&&((v===1||!s)&&b([]),a?.products&&b(c=>{const n=a.products?.filter?.(l=>!c.some(u=>u.id===l.id));let r=[...c,...n];const g=r.filter(l=>!(!l?.metafields?.seoSetting?.noindex&&l.availableForSale&&l?.variants?.some(u=>u.availableForSale)));return r=r.filter(l=>!l?.metafields?.seoSetting?.noindex&&l.availableForSale&&l?.variants?.some(u=>u.availableForSale)),r.push(...g),(v===1&&!s||s)&&(r=P(r)),r}))},[a?.products,v,s,k]),(0,m.useEffect)(()=>{x?.length&&v===1&&!s&&b(P(x))},[p]),(0,e.jsxs)("div",{className:"filter-card-wrap-container",children:[(0,e.jsx)("div",{className:(0,C.cn)("min-h-[60vh] w-full grid gap-3 grid-cols-2",{"laptop:grid-cols-4 tablet:grid-cols-3":p&&!s,"laptop:grid-cols-3 tablet:grid-cols-2":!p&&!s},"filter-card-wrap"),children:x?.map?.(c=>(0,e.jsx)(D.default,{data:c,isSale:i,buttonText:z,metafields:w,onPrimaryChange:(n,r)=>N?.(n,r),onSecondaryChange:(n,r)=>L?.(n,r)},c.id))}),s?(0,e.jsxs)("div",{onClick:()=>{y?.(a?.pageInfo?.endCursor)},className:"mt-6 text-sm font-semibold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more",children:[(0,e.jsx)("span",{children:W||"View More"}),(0,e.jsx)("div",{className:"size-[18px]",children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon",children:(0,e.jsx)("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"})})})]}):null,!s&&f>18?(0,e.jsxs)("div",{className:"mt-6 flex items-center justify-end gap-4 cursor-pointer",children:[(0,e.jsx)("button",{name:"perv page",disabled:!a?.pageInfo?.hasPreviousPage,className:"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",onClick:()=>{j?.(a?.pageInfo?.startCursor)},children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M12 5L7 10L12 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})}),(0,e.jsx)("button",{name:"next page",className:"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",disabled:!a?.pageInfo?.hasNextPage,onClick:()=>{y?.(a?.pageInfo?.endCursor)},children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M7.5 5L12.5 10L7.5 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})})]}):null]})}
|
|
2
2
|
//# sourceMappingURL=FilterCardWrap.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrap.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\nimport Paginator from '../Paginator/index.js'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport { useState, useEffect } from 'react'\nimport { cloneDeep } from 'es-toolkit';\n\ntype FilterCardWrapProps = {\n result?: any\n total: number\n shopifyData?: any\n currentPage?: number\n closeFilter: boolean\n page: number\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n}\n\nexport default function FilterCardWrap(props: FilterCardWrapProps) {\n const {
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
6
|
-
"names": ["FilterCardWrap_exports", "__export", "FilterCardWrap", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_react_responsive", "import_Paginator", "import_FilterCardWrapItem", "import_react", "import_es_toolkit", "props", "shopifyData", "total", "result", "closeFilter", "page", "metafields", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "advertisingSpace", "buttonText", "loadMoreText", "currentAdvertisingSpace", "data", "setData", "isMobile", "handleAdvertisingSpace", "products", "updatedProducts", "findIndex", "item", "insertIndex", "prevProducts", "newProducts", "product", "prev", "soldOutProducts", "FilterCardWrapItem", "e"]
|
|
4
|
+
"sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\nimport Paginator from '../Paginator/index.js'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport { useState, useEffect } from 'react'\nimport { cloneDeep } from 'es-toolkit';\n\ntype FilterCardWrapProps = {\n isSale?: boolean\n result?: any\n total: number\n shopifyData?: any\n currentPage?: number\n closeFilter: boolean\n page: number\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n}\n\nexport default function FilterCardWrap(props: FilterCardWrapProps) {\n const {\n shopifyData = {},\n isSale = false,\n total,\n result,\n closeFilter,\n page,\n metafields,\n onPrimaryChange,\n onSecondaryChange,\n onNextPage,\n onPrevPage,\n } = props\n const { advertisingSpace } = metafields\n const { buttonText, loadMoreText } = shopifyData\n\n const currentAdvertisingSpace = advertisingSpace || shopifyData?.advertisingSpace\n\n const [data, setData] = useState<any[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const handleAdvertisingSpace = (products: any[]) => {\n const updatedProducts = cloneDeep(products || [])\n if (currentAdvertisingSpace) {\n const findIndex = updatedProducts.findIndex(item => item.mImage)\n if (findIndex === -1) {\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n } else {\n updatedProducts.splice(findIndex, 1)\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n }\n }\n return updatedProducts\n }\n\n // \u5904\u7406\u4EA7\u54C1\u6570\u636E\n useEffect(() => {\n if (result?.slug || result?.id) {\n (page === 1 || !isMobile) && setData([])\n if (result?.products) {\n setData(prevProducts => {\n // \u68C0\u67E5\u662F\u5426\u5DF2\u7ECF\u5B58\u5728\u4E8E prevProducts \u4E2D\uFF0C\u907F\u514D\u91CD\u590D\u6DFB\u52A0\n const newProducts = result.products?.filter?.(\n (product: { id: any }) => !prevProducts.some(prev => prev.id === product.id)\n )\n let updatedProducts = [...prevProducts, ...newProducts]\n /** \u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1 */\n const soldOutProducts = updatedProducts.filter(\n item =>\n !(\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n )\n // \u8FC7\u6EE4\u6389 availableForSale \u4E3A false \u7684\u4EA7\u54C1\n updatedProducts = updatedProducts.filter(\n item =>\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n // \u5C06\u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1\u6DFB\u52A0\u5230\u6700\u540E\n updatedProducts.push(...soldOutProducts)\n // \u5982\u679C advertisingSpace \u5B58\u5728\u4E14\u5C1A\u672A\u6DFB\u52A0\u5230\u6570\u7EC4\u4E2D\n if ((page === 1 && !isMobile) || isMobile) {\n updatedProducts = handleAdvertisingSpace(updatedProducts)\n }\n return updatedProducts\n })\n }\n }\n }, [result?.products, page, isMobile, advertisingSpace])\n\n useEffect(() => {\n if(!data?.length) return\n if(page === 1 && !isMobile) {\n setData(handleAdvertisingSpace(data))\n }\n }, [closeFilter])\n\n return (\n <div className=\"filter-card-wrap-container\">\n <div\n className={cn(\n 'min-h-[60vh] w-full grid gap-3 grid-cols-2',\n {\n 'laptop:grid-cols-4 tablet:grid-cols-3': closeFilter && !isMobile,\n 'laptop:grid-cols-3 tablet:grid-cols-2': !closeFilter && !isMobile,\n },\n 'filter-card-wrap'\n )}\n >\n {data?.map?.(item => {\n return (\n <FilterCardWrapItem\n data={item}\n key={item.id}\n isSale={isSale}\n buttonText={buttonText}\n metafields={metafields}\n onPrimaryChange={(e, data) => onPrimaryChange?.(e, data)}\n onSecondaryChange={(e, data) => onSecondaryChange?.(e, data)}\n />\n )\n })}\n </div>\n {isMobile ? (\n <div\n onClick={() => {\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n className=\"mt-6 text-sm font-semibold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more\"\n >\n <span>{loadMoreText || 'View More'}</span>\n <div className=\"size-[18px]\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n data-slot=\"icon\"\n >\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" />\n </svg>\n </div>\n </div>\n ) : null}\n {!isMobile && total > 18 ? (\n <div className=\"mt-6 flex items-center justify-end gap-4 cursor-pointer\">\n <button\n name=\"perv page\"\n disabled={!result?.pageInfo?.hasPreviousPage}\n className=\"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]\"\n onClick={() => {\n onPrevPage?.(result?.pageInfo?.startCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M12 5L7 10L12 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n <button\n name=\"next page\"\n className=\"flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]\"\n disabled={!result?.pageInfo?.hasNextPage}\n onClick={() => {\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M7.5 5L12.5 10L7.5 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n </div>\n ) : // <Paginator\n // className=\"mt-6\"\n // currentPage={currentPage}\n // onPageChange={(v: number) => {\n // setData([])\n // if(v > currentPage) {\n // onNextPage?.(result?.pageInfo?.endCursor)\n // } else {\n // onPrevPage?.(result?.pageInfo?.startCursor)\n // }\n // setCurrentPage(v)\n // }}\n // total={100}\n // />\n null}\n </div>\n )\n}"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["FilterCardWrap_exports", "__export", "FilterCardWrap", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_react_responsive", "import_Paginator", "import_FilterCardWrapItem", "import_react", "import_es_toolkit", "props", "shopifyData", "isSale", "total", "result", "closeFilter", "page", "metafields", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "advertisingSpace", "buttonText", "loadMoreText", "currentAdvertisingSpace", "data", "setData", "isMobile", "handleAdvertisingSpace", "products", "updatedProducts", "findIndex", "item", "insertIndex", "prevProducts", "newProducts", "product", "prev", "soldOutProducts", "FilterCardWrapItem", "e"]
|
|
7
7
|
}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
type FilterCardWrapItemProps = {
|
|
2
2
|
data: any;
|
|
3
|
+
isSale?: boolean;
|
|
3
4
|
buttonText?: any;
|
|
4
5
|
itemShape?: string;
|
|
5
6
|
metafields: any;
|
|
6
7
|
onPrimaryChange?: (item: any, sku: string) => void;
|
|
7
8
|
onSecondaryChange?: (item: any, sku: string) => void;
|
|
8
9
|
};
|
|
9
|
-
declare const FilterCardWrapItem: ({ data, buttonText, itemShape, metafields, onPrimaryChange, onSecondaryChange, }: FilterCardWrapItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
declare const FilterCardWrapItem: ({ data, isSale, buttonText, itemShape, metafields, onPrimaryChange, onSecondaryChange, }: FilterCardWrapItemProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
10
11
|
export default FilterCardWrapItem;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var xe=Object.create;var h=Object.defineProperty;var ve=Object.getOwnPropertyDescriptor;var he=Object.getOwnPropertyNames;var ye=Object.getPrototypeOf,ke=Object.prototype.hasOwnProperty;var Ce=(e,r)=>{for(var n in r)h(e,n,{get:r[n],enumerable:!0})},U=(e,r,n,g)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of he(r))!ke.call(e,m)&&m!==n&&h(e,m,{get:()=>r[m],enumerable:!(g=ve(r,m))||g.enumerable});return e};var _=(e,r,n)=>(n=e!=null?xe(ye(e)):{},U(r||!e||!e.__esModule?h(n,"default",{value:e,enumerable:!0}):n,e)),Ne=e=>U(h({},"__esModule",{value:!0}),e);var $e={};Ce($e,{default:()=>Pe});module.exports=Ne($e);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/heading.js"),G=require("../../components/text.js"),P=_(require("../../components/button.js")),$=_(require("../../components/picture.js")),y=require("../../shared/trackUrlRef.js"),J=require("./component/price.js"),l=require("react");const S="image",w="product_shelf",_e=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,isSale:r=!1,buttonText:n,itemShape:g,metafields:m,onPrimaryChange:K,onSecondaryChange:Q})=>{const{memberPriceDiscount:X,memberSetting:T,discounts:I,shopCommon:Y}=m,[p,B]=(0,l.useState)(""),[Z,M]=(0,l.useState)(""),[b,L]=(0,l.useState)(""),[z,ee]=(0,l.useState)(!1),[F,te]=(0,l.useState)({}),[se,oe]=(0,l.useState)(!1),[k,re]=(0,l.useState)({price:"",basePrice:""}),[O,ie]=(0,l.useState)([]),[le,ne]=(0,l.useState)([]),[x,ae]=(0,l.useState)(""),[ce,me]=(0,l.useState)(""),{locale:a="us",currencyCode:pe,isLogin:j}=(0,E.useAiuiContext)(),v=e?.custom_name||e?.title||e?.name,D=e?.custom_description||e?.description||e?.descriptionHtml,c=e?.filter_variants||e?.variants||[],ue=s=>L(s),C=(s,i,o,u)=>{oe(u),ae(s||""),re({basePrice:i||"",price:o||""})};return(0,l.useEffect)(()=>{if(b){const o=c?.find(u=>u?.name?.includes?.(b));B(o?.sku||c?.[0]?.sku||""),M(o?.image?.url||c?.[0]?.image?.url||"");return}const s=e?.options?.find(o=>o?.displayName==="color")?.values?.[0]?.label;s&&L(s);const i=c?.find(o=>o?.name?.includes?.(s));B(i?.sku||c?.[0]?.sku||""),M(i?.image?.url||c?.[0]?.image?.url||"")},[b]),(0,l.useEffect)(()=>{if(!p)return;ie(e?.tags||[]);const s=c?.find(d=>d?.sku===p)||c?.[0]||{};te(s),ee(!s?.availableForSale||s?.price?.amount===_e);const{infos:i}=s?.metafields||{},{productInfos:o,preRender:u}=e?.metafields||{};me(i?.comingSoon||o?.comingSoon||u?.soldOut||Y?.soldOut||"");const N=s?.coupons?.[0],{price:W,basePrice:H,discount:Te,discountAmount:A}=(0,R.formatVariantPrice)({locale:a,amount:N?N.variant_price4wscode:s.price,baseAmount:N?s.price:0,currencyCode:e?.price?.currencyCode||"USD"});if(j){const d=(0,J.getFunctionMemberPrice)({locale:a,variant:s,shopMemberPriceDiscountConfig:X,currencyCode:pe||e?.price?.currencyCode||"USD"});if(d){const{hasMemberPrice:de,salePriceWithCurrency:fe,originalPriceWithCurrency:ge,savePriceWithCurrency:be}=d;C(be||"",ge||"",de?fe:"",d?.hasMemberPrice)}else C(A||"",H||"",W||"",!1)}else C(A||"",H||"",W||"",!1)},[e,p]),(0,l.useEffect)(()=>{let s=[];if(x){const o=`${x}${I?.off}`;s.push(o)}const i=O?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,x?1:2);ne(s.concat(i))},[O,x]),r&&!k?.basePrice&&!e?.mImage?null:(0,t.jsx)("div",{className:(0,f.cn)(g==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white","bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300",{"aiui-dark":e.theme==="dark"}),children:e?.mImage?(0,t.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden hover:[&_img]:scale-105",children:(0,t.jsxs)("a",{className:"relative inset-0 size-full",href:(0,y.trackUrlRef)(e?.link,`${S}_${w}`),children:[(0,t.jsx)($.default,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full",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-xl font-semibold leading-6 line-clamp-4",dangerouslySetInnerHTML:{__html:e?.title}})]})]})}):(0,t.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4",children:[(0,t.jsx)("div",{className:"flex flex-wrap gap-1 overflow-hidden collection-filter-tags",children:le?.map?.((s,i)=>(0,t.jsx)(V.default,{className:"whitespace-nowrap max-w-full truncate px-1 box-border item-badge",children:s},i))}),(0,t.jsx)("a",{target:"_blank","aria-label":v,href:(0,y.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${S}_${w}`),children:(0,t.jsx)("div",{className:(0,f.cn)("m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden"),children:(0,t.jsx)($.default,{alt:"",source:Z,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:()=>ue(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:[v?(0,t.jsx)(q.Heading,{html:v||"",title:v||"",className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base"}):null,e?.metafields?.judgemeBadge?(0,t.jsx)("a",{target:"_blank",className:"font-semibold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:(0,y.trackUrlRef)(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${S}_${w}`)}):null,D?(0,t.jsx)(G.Text,{size:2,html:D||"",className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs"}):null,(0,t.jsxs)("div",{className:"mt-3 mb-2",children:[(0,t.jsx)("p",{dangerouslySetInnerHTML:{__html:j&&se&&(I?.memberPrice||T?.member_price||T?.plus_member_price)||""},className:"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-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:ce||""}):(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:F?.availableForSale&&k?.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:F?.availableForSale&&k?.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)(P.default,{variant:"secondary",className:"m-tablet:w-full",onClick:()=>Q?.(e,p),children:n?.secondaryButton||"Learn More"}),(0,t.jsx)(P.default,{variant:"primary",className:"m-tablet:w-full",disabled:z,onClick:()=>K?.(e,p),children:n?.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 // \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(discountAmount || '', basePrice || '', price || '', false)\n }\n } else {\n handleBasePrice(discountAmount || '', 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 'lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white',\n 'bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n {\n 'aiui-dark': data.theme === 'dark',\n }\n )}\n >\n {data?.mImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden hover:[&_img]:scale-105\">\n <a className=\"relative inset-0 size-full\" href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}>\n <Picture\n alt=\"\"\n source={data?.mImage?.url || data?.mImage}\n className=\"size-full [&_img]:object-cover [&_img]:size-full\"\n 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-xl font-semibold leading-6 line-clamp-4\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4\">\n <div className=\"flex flex-wrap gap-1 overflow-hidden collection-filter-tags\">\n {showTags?.map?.((item: string, index: number) => (\n <Badge key={index} className=\"whitespace-nowrap max-w-full truncate px-1 box-border item-badge\">\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('m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden')}>\n <Picture\n alt=\"\"\n source={currentImage}\n className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n />\n </div>\n </a>\n {data?.options?.map((option: any) => {\n if (option?.displayName === 'color') {\n return (\n <div className=\"flex items-center gap-1\">\n {option?.values?.map((item: any) => {\n const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n return (\n <button\n key={item?.label}\n onClick={() => onColorClick(item?.label)}\n className={cn(\n 'size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent',\n `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n )}\n >\n <img\n alt={color}\n className=\"h-full w-full object-cover\"\n src={`${getShopifyCdnBaseUrl(data?.images?.[0]?.url)}${color\n ?.toLowerCase()\n .split(' ')\n ?.join('-')}_${'50x'}.png`}\n />\n </button>\n )\n })}\n </div>\n )\n }\n })}\n <div>\n {displayTitle ? (\n <Heading\n as=\"h3\"\n html={displayTitle || ''}\n title={displayTitle || ''}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-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\"\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\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\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", "import_heading", "import_text", "import_button", "import_picture", "import_trackUrlRef", "import_price", "import_react", "componentType", "componentName", "SOLD_OUT_PRICE", "getShopifyCdnBaseUrl", "imagePath", "path", "FilterCardWrapItem", "data", "buttonText", "itemShape", "metafields", "onPrimaryChange", "onSecondaryChange", "memberPriceDiscount", "memberSetting", "discounts", "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", "result", "hasMemberPrice", "salePriceWithCurrency", "originalPriceWithCurrency", "savePriceWithCurrency", "handleTags", "discountTag", "newTags", "Picture", "index", "Badge", "option", "Button"]
|
|
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 isSale?: boolean\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 isSale = false,\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 // \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(discountAmount || '', basePrice || '', price || '', false)\n }\n } else {\n handleBasePrice(discountAmount || '', 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 if (isSale && !priceCollection?.basePrice && !data?.mImage) {\n return null\n }\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white',\n 'bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n {\n 'aiui-dark': data.theme === 'dark',\n }\n )}\n >\n {data?.mImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden hover:[&_img]:scale-105\">\n <a\n className=\"relative inset-0 size-full\"\n href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}\n >\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-xl font-semibold leading-6 line-clamp-4\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4\">\n <div className=\"flex flex-wrap gap-1 overflow-hidden collection-filter-tags\">\n {showTags?.map?.((item: string, index: number) => (\n <Badge key={index} className=\"whitespace-nowrap max-w-full truncate px-1 box-border item-badge\">\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('m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden')}>\n <Picture\n alt=\"\"\n source={currentImage}\n className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n />\n </div>\n </a>\n {data?.options?.map((option: any) => {\n if (option?.displayName === 'color') {\n return (\n <div className=\"flex items-center gap-1\">\n {option?.values?.map((item: any) => {\n const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n return (\n <button\n key={item?.label}\n onClick={() => onColorClick(item?.label)}\n className={cn(\n 'size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent',\n `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n )}\n >\n <img\n alt={color}\n className=\"h-full w-full object-cover\"\n src={`${getShopifyCdnBaseUrl(data?.images?.[0]?.url)}${color\n ?.toLowerCase()\n .split(' ')\n ?.join('-')}_${'50x'}.png`}\n />\n </button>\n )\n })}\n </div>\n )\n }\n })}\n <div>\n {displayTitle ? (\n <Heading\n html={displayTitle || ''}\n title={displayTitle || ''}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-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\"\n />\n ) : null}\n <div className=\"mt-3 mb-2\">\n <p\n dangerouslySetInnerHTML={{\n __html:\n isLogin && plusMemberStatus\n ? discounts?.memberPrice ||\n memberSetting?.member_price ||\n memberSetting?.plus_member_price ||\n ''\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\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full\"\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_heading", "import_text", "import_button", "import_picture", "import_trackUrlRef", "import_price", "import_react", "componentType", "componentName", "SOLD_OUT_PRICE", "getShopifyCdnBaseUrl", "imagePath", "path", "FilterCardWrapItem", "data", "isSale", "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", "result", "hasMemberPrice", "salePriceWithCurrency", "originalPriceWithCurrency", "savePriceWithCurrency", "handleTags", "discountTag", "newTags", "Picture", "index", "Badge", "option", "Button"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var b=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var w=(o,t)=>{for(var i in t)b(o,i,{get:t[i],enumerable:!0})},S=(o,t,i,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of _(t))!k.call(o,a)&&a!==i&&b(o,a,{get:()=>t[a],enumerable:!(d=g(t,a))||d.enumerable});return o};var D=o=>S(b({},"__esModule",{value:!0}),o);var I={};w(I,{default:()=>v});module.exports=D(I);var e=require("react/jsx-runtime"),r=require("../../helpers/utils"),l=require("../../components/index.js"),u=require("react");function v(o){const{total:t,closeFilter:i,metafields:d,shopifyData:a,onSortChange:h,onCloseFilter:N,onClearFiltered:
|
|
1
|
+
"use strict";var b=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var w=(o,t)=>{for(var i in t)b(o,i,{get:t[i],enumerable:!0})},S=(o,t,i,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of _(t))!k.call(o,a)&&a!==i&&b(o,a,{get:()=>t[a],enumerable:!(d=g(t,a))||d.enumerable});return o};var D=o=>S(b({},"__esModule",{value:!0}),o);var I={};w(I,{default:()=>v});module.exports=D(I);var e=require("react/jsx-runtime"),r=require("../../helpers/utils"),l=require("../../components/index.js"),u=require("react");function v(o){const{total:t,closeFilter:i,metafields:d,shopifyData:a,onSortChange:h,onCloseFilter:N,onClearFiltered:F,onMobileOpenDrawer:y,sortKeyIndx:f}=o,{drawerText:C}=a,{shop_filters_pair:s}=d,[m,p]=(0,u.useState)(!1),x=n=>N?.(n);return(0,e.jsxs)("div",{className:"filter-header",children:[(0,e.jsxs)("div",{className:(0,r.cn)("desktop:gap-x-16 tablet:gap-x-8","relative flex md-tablet:p-0 text-base font-semibold box-border tablet:mb-4 mb-2"),children:[!i&&(0,e.jsxs)("div",{className:(0,r.cn)("md-tablet:hidden flex-shrink-0 flex justify-between items-center","desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:w-fit box-border"),children:[(0,e.jsxs)("div",{className:"flex items-center cursor-pointer",onClick:()=>x?.(!0),children:[(0,e.jsx)(l.Picture,{className:"mb-0.5 size-5",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),(0,e.jsx)("span",{className:"font-semibold inline-block pl-2 leading-none",children:s?.filter_txt?.filter||"Close Filter"})]}),(0,e.jsx)("span",{onClick:()=>F?.(),className:"text-center text-base decoration-1 md:hidden font-semibold text-[#1D1D1F] cursor-pointer box-border",children:C?.secondaryButton||"Clear"})]}),(0,e.jsxs)("div",{className:"flex-1 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"md-tablet:hidden flex items-center gap-x-4",children:[i&&(0,e.jsxs)("div",{className:"flex items-center cursor-pointer",onClick:()=>x?.(!1),children:[(0,e.jsx)(l.Picture,{className:"mb-0.5 size-5",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),(0,e.jsx)("span",{className:"font-semibold inline-block pl-2 leading-none",children:s?.filter_txt?.filter||"Open Filter"})]}),s?.filter_txt?.found?(0,e.jsx)(l.Text,{className:"text-base font-semibold text-[#86868C] md:hidden",html:s?.filter_txt?.found?.replace("${number}",t||0)}):(0,e.jsx)(l.Text,{className:"text-base font-semibold text-[#86868C] md:hidden",html:`${t||0} Item(s) Found`})]}),(0,e.jsx)("div",{className:"hidden md-tablet:block",children:(0,e.jsxs)("div",{className:"flex items-center",onClick:()=>y?.(!0),children:[(0,e.jsx)(l.Picture,{className:"inline-block size-[20px]",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),(0,e.jsx)("span",{className:"font-semibold inline-block pl-2 leading-none tablet:text-base text-sm",children:s?.filter_txt?.filter||"Close Filter"})]})}),(0,e.jsxs)("div",{className:"flex items-center relative cursor-pointer",onClick:()=>p(!m),children:[(0,e.jsx)("span",{className:"tablet:text-base text-sm pr-1 text-[#777]",dangerouslySetInnerHTML:{__html:`${s?.filter_txt?.sort||"Sort by"}: `}}),(0,e.jsx)(l.Text,{html:s?.filter_txt?.sortList?.[f]?.txt||"Recommended",className:"tablet:text-base text-sm font-[700] text-[#333]"}),(0,e.jsx)("div",{className:`ml-1 size-4 duration-300 ease-in-out ${m&&"rotate-180"}`,children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon",children:(0,e.jsx)("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"})})}),(0,e.jsx)("ul",{className:(0,r.cn)("w-full bg-[#FFFFFF] z-10 py-2 px-0 transition-all duration-400 ease-in-out","md-tablet:left-0 md-tablet:top-[120%] md-tablet:text-left absolute top-[110%] right-0",m?"visibility opacity-100":"invisible opacity-0"),children:s?.filter_txt?.sortList?.map?.((n,c)=>(0,e.jsx)("li",{className:(0,r.cn)("cursor-pointer w-full p-4 text-base font-semibold text-[#333] [&:hover]:bg-[#EAEAEC]",c===f?"bg-[#EAEAEC]":""),children:(0,e.jsx)("button",{name:n?.txt,className:"md-tablet:text-left",dangerouslySetInnerHTML:{__html:n?.txt},onClick:()=>{p(!1),h?.(c)}})},n?.txt+c))})]})]})]}),(0,e.jsx)("div",{className:"mb-2 hidden md-tablet:block",children:s?.filter_txt?.found?(0,e.jsx)(l.Text,{className:"tablet:text-base text-sm font-semibold text-[#86868C]",html:s?.filter_txt?.found?.replace("${number}",t||0)}):(0,e.jsx)(l.Text,{className:"tablet:text-base text-sm font-semibold text-[#86868C]",html:`${t||0} Item(s) Found`})})]})}
|
|
2
2
|
//# sourceMappingURL=FilterHeader.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/CollectionsFilters/FilterHeader.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../../helpers/utils'\nimport { Picture, Text } from '../../components/index.js'\nimport { useState } from 'react'\n\ntype FilterHeaderProps = {\n total?: number\n sortKeyIndx: number\n metafields: any\n closeFilter: boolean\n shopifyData?: any\n onClearFiltered: () => void\n onSortChange: (sortKeyIndx: number) => void\n onCloseFilter: (closeFilter: boolean) => void\n onMobileOpenDrawer: (openDrawer: boolean) => void\n}\n\nexport default function FilterHeader(props: FilterHeaderProps) {\n const {\n total,\n closeFilter,\n metafields,\n shopifyData,\n onSortChange,\n onCloseFilter,\n onClearFiltered,\n onMobileOpenDrawer,\n sortKeyIndx,\n } = props\n \n const { drawerText } = shopifyData\n\n const { shop_filters_pair: shopFiltersPair } = metafields\n\n const [openSort, setOpenSort] = useState<boolean>(false)\n\n const onCloseOrOpenFilter = (closeFilter: boolean) => onCloseFilter?.(closeFilter)\n\n return (\n <div className=\"filter-header\">\n <div\n className={cn(\n 'desktop:gap-x-16 tablet:gap-x-8',\n 'relative flex md-tablet:p-0 text-base font-semibold box-border tablet:mb-4 mb-2'\n )}\n >\n {/* pc\u5C55\u793A\u7684\u7B5B\u9009(open\u72B6\u6001) */}\n {!closeFilter && (\n <div\n className={cn(\n 'md-tablet:hidden flex-shrink-0 flex justify-between items-center',\n 'desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:w-fit box-border'\n )}\n >\n <div className=\"flex items-center cursor-pointer\" onClick={() => onCloseOrOpenFilter?.(true)}>\n <Picture\n className=\"mb-0.5 size-5\"\n source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n />\n <span className=\"font-semibold inline-block pl-2 leading-none\">\n {shopFiltersPair?.filter_txt?.filter || 'Close Filter'}\n </span>\n </div>\n <span\n onClick={() => onClearFiltered?.()}\n className=\"text-center text-base decoration-1 md:hidden font-semibold text-[#1D1D1F] cursor-pointer box-border\"\n >\n {drawerText?.secondaryButton || 'Clear'}\n </span>\n </div>\n )}\n <div className=\"flex-1 flex items-center justify-between\">\n {/* pc\u7AEF\u5C55\u793A\u7684\u7B5B\u9009\uFF08close\u72B6\u6001\uFF09 */}\n <div className=\"md-tablet:hidden flex items-center gap-x-4\">\n {closeFilter && (\n <div className=\"flex items-center cursor-pointer\" onClick={() => onCloseOrOpenFilter?.(false)}>\n <Picture\n className=\"mb-0.5 size-5\"\n source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n />\n <span className=\"font-semibold inline-block pl-2 leading-none\">\n {shopFiltersPair?.filter_txt?.filter || 'Open Filter'}\n </span>\n </div>\n )}\n {shopFiltersPair?.filter_txt?.found ? (\n <Text\n className=\"text-base font-semibold text-[#86868C] md:hidden\"\n html={shopFiltersPair?.filter_txt?.found?.replace('${number}', total || 0)}\n />\n ) : (\n <Text className=\"text-base font-semibold text-[#86868C] md:hidden\" html={`${total || 0} Item(s) Found`} />\n )}\n </div>\n {/* \u79FB\u52A8\u7AEF\u5C55\u793A\u7684\u7B5B\u9009 */}\n <div className=\"hidden md-tablet:block\">\n <div className=\"flex items-center\" onClick={() => onMobileOpenDrawer?.(true)}>\n <Picture\n className=\"inline-block size-[20px]\"\n source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n />\n <span className=\"font-semibold inline-block pl-2 leading-none tablet:text-base text-sm\">\n {shopFiltersPair?.filter_txt?.filter || 'Close Filter'}\n </span>\n </div>\n </div>\n {/* \u6392\u5E8F */}\n <div className=\"flex items-center relative cursor-pointer\" onClick={() => setOpenSort(!openSort)}>\n <span\n className=\"tablet:text-base text-sm pr-1 text-[#777]\"\n dangerouslySetInnerHTML={{\n __html: `${shopFiltersPair?.filter_txt?.sort || 'Sort by'}: `,\n }}\n />\n <Text\n html={shopFiltersPair?.filter_txt
|
|
5
|
-
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqDY,IAAAI,EAAA,6BArDZC,EAAmB,+BACnBC,EAA8B,qCAC9BC,EAAyB,iBAcV,SAARL,EAA8BM,EAA0B,CAC7D,KAAM,CACJ,MAAAC,EACA,YAAAC,EACA,WAAAC,EACA,YAAAC,EACA,aAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,mBAAAC,EACA,YAAAC,CACF,EAAIT,EAEE,CAAE,WAAAU,CAAW,EAAIN,EAEjB,CAAE,kBAAmBO,CAAgB,EAAIR,EAEzC,CAACS,EAAUC,CAAW,KAAI,YAAkB,EAAK,EAEjDC,EAAuBZ,GAAyBI,IAAgBJ,CAAW,EAEjF,SACE,QAAC,OAAI,UAAU,gBACb,qBAAC,OACC,aAAW,MACT,kCACA,iFACF,EAGC,WAACA,MACA,QAAC,OACC,aAAW,MACT,mEACA,sEACF,EAEA,qBAAC,OAAI,UAAU,mCAAmC,QAAS,IAAMY,IAAsB,EAAI,EACzF,oBAAC,WACC,UAAU,gBACV,OAAO,iGACT,KACA,OAAC,QAAK,UAAU,+CACb,SAAAH,GAAiB,YAAY,QAAU,eAC1C,GACF,KACA,OAAC,QACC,QAAS,IAAMJ,IAAkB,EACjC,UAAU,sGAET,SAAAG,GAAY,iBAAmB,QAClC,GACF,KAEF,QAAC,OAAI,UAAU,2CAEb,qBAAC,OAAI,UAAU,6CACZ,UAAAR,MACC,QAAC,OAAI,UAAU,mCAAmC,QAAS,IAAMY,IAAsB,EAAK,EAC1F,oBAAC,WACC,UAAU,gBACV,OAAO,iGACT,KACA,OAAC,QAAK,UAAU,+CACb,SAAAH,GAAiB,YAAY,QAAU,cAC1C,GACF,EAEDA,GAAiB,YAAY,SAC5B,OAAC,QACC,UAAU,mDACV,KAAMA,GAAiB,YAAY,OAAO,QAAQ,YAAaV,GAAS,CAAC,EAC3E,KAEA,OAAC,QAAK,UAAU,mDAAmD,KAAM,GAAGA,GAAS,CAAC,iBAAkB,GAE5G,KAEA,OAAC,OAAI,UAAU,yBACb,oBAAC,OAAI,UAAU,oBAAoB,QAAS,IAAMO,IAAqB,EAAI,EACzE,oBAAC,WACC,UAAU,2BACV,OAAO,iGACT,KACA,OAAC,QAAK,UAAU,wEACb,SAAAG,GAAiB,YAAY,QAAU,eAC1C,GACF,EACF,KAEA,QAAC,OAAI,UAAU,4CAA4C,QAAS,IAAME,EAAY,CAACD,CAAQ,EAC7F,oBAAC,QACC,UAAU,4CACV,wBAAyB,CACvB,OAAQ,GAAGD,GAAiB,YAAY,MAAQ,SAAS,IAC3D,EACF,KACA,OAAC,QACC,KAAMA,GAAiB,
|
|
4
|
+
"sourcesContent": ["import { cn } from '../../helpers/utils'\nimport { Picture, Text } from '../../components/index.js'\nimport { useState } from 'react'\n\ntype FilterHeaderProps = {\n total?: number\n sortKeyIndx: number\n metafields: any\n closeFilter: boolean\n shopifyData?: any\n onClearFiltered: () => void\n onSortChange: (sortKeyIndx: number) => void\n onCloseFilter: (closeFilter: boolean) => void\n onMobileOpenDrawer: (openDrawer: boolean) => void\n}\n\nexport default function FilterHeader(props: FilterHeaderProps) {\n const {\n total,\n closeFilter,\n metafields,\n shopifyData,\n onSortChange,\n onCloseFilter,\n onClearFiltered,\n onMobileOpenDrawer,\n sortKeyIndx,\n } = props\n \n const { drawerText } = shopifyData\n\n const { shop_filters_pair: shopFiltersPair } = metafields\n\n const [openSort, setOpenSort] = useState<boolean>(false)\n\n const onCloseOrOpenFilter = (closeFilter: boolean) => onCloseFilter?.(closeFilter)\n\n return (\n <div className=\"filter-header\">\n <div\n className={cn(\n 'desktop:gap-x-16 tablet:gap-x-8',\n 'relative flex md-tablet:p-0 text-base font-semibold box-border tablet:mb-4 mb-2'\n )}\n >\n {/* pc\u5C55\u793A\u7684\u7B5B\u9009(open\u72B6\u6001) */}\n {!closeFilter && (\n <div\n className={cn(\n 'md-tablet:hidden flex-shrink-0 flex justify-between items-center',\n 'desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:w-fit box-border'\n )}\n >\n <div className=\"flex items-center cursor-pointer\" onClick={() => onCloseOrOpenFilter?.(true)}>\n <Picture\n className=\"mb-0.5 size-5\"\n source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n />\n <span className=\"font-semibold inline-block pl-2 leading-none\">\n {shopFiltersPair?.filter_txt?.filter || 'Close Filter'}\n </span>\n </div>\n <span\n onClick={() => onClearFiltered?.()}\n className=\"text-center text-base decoration-1 md:hidden font-semibold text-[#1D1D1F] cursor-pointer box-border\"\n >\n {drawerText?.secondaryButton || 'Clear'}\n </span>\n </div>\n )}\n <div className=\"flex-1 flex items-center justify-between\">\n {/* pc\u7AEF\u5C55\u793A\u7684\u7B5B\u9009\uFF08close\u72B6\u6001\uFF09 */}\n <div className=\"md-tablet:hidden flex items-center gap-x-4\">\n {closeFilter && (\n <div className=\"flex items-center cursor-pointer\" onClick={() => onCloseOrOpenFilter?.(false)}>\n <Picture\n className=\"mb-0.5 size-5\"\n source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n />\n <span className=\"font-semibold inline-block pl-2 leading-none\">\n {shopFiltersPair?.filter_txt?.filter || 'Open Filter'}\n </span>\n </div>\n )}\n {shopFiltersPair?.filter_txt?.found ? (\n <Text\n className=\"text-base font-semibold text-[#86868C] md:hidden\"\n html={shopFiltersPair?.filter_txt?.found?.replace('${number}', total || 0)}\n />\n ) : (\n <Text className=\"text-base font-semibold text-[#86868C] md:hidden\" html={`${total || 0} Item(s) Found`} />\n )}\n </div>\n {/* \u79FB\u52A8\u7AEF\u5C55\u793A\u7684\u7B5B\u9009 */}\n <div className=\"hidden md-tablet:block\">\n <div className=\"flex items-center\" onClick={() => onMobileOpenDrawer?.(true)}>\n <Picture\n className=\"inline-block size-[20px]\"\n source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n />\n <span className=\"font-semibold inline-block pl-2 leading-none tablet:text-base text-sm\">\n {shopFiltersPair?.filter_txt?.filter || 'Close Filter'}\n </span>\n </div>\n </div>\n {/* \u6392\u5E8F */}\n <div className=\"flex items-center relative cursor-pointer\" onClick={() => setOpenSort(!openSort)}>\n <span\n className=\"tablet:text-base text-sm pr-1 text-[#777]\"\n dangerouslySetInnerHTML={{\n __html: `${shopFiltersPair?.filter_txt?.sort || 'Sort by'}: `,\n }}\n />\n <Text\n html={shopFiltersPair?.filter_txt?.sortList?.[sortKeyIndx]?.txt || 'Recommended'}\n className=\"tablet:text-base text-sm font-[700] text-[#333]\"\n />\n <div className={`ml-1 size-4 duration-300 ease-in-out ${openSort && 'rotate-180'}`}>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n data-slot=\"icon\"\n >\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" />\n </svg>\n </div>\n <ul\n className={cn(\n 'w-full bg-[#FFFFFF] z-10 py-2 px-0 transition-all duration-400 ease-in-out',\n 'md-tablet:left-0 md-tablet:top-[120%] md-tablet:text-left absolute top-[110%] right-0',\n openSort ? 'visibility opacity-100' : 'invisible opacity-0'\n )}\n >\n {shopFiltersPair?.filter_txt?.sortList?.map?.((l: any, k: number) => (\n <li\n key={l?.txt + k}\n className={cn(\n 'cursor-pointer w-full p-4 text-base font-semibold text-[#333] [&:hover]:bg-[#EAEAEC]',\n k === sortKeyIndx ? 'bg-[#EAEAEC]' : ''\n )}\n >\n <button\n name={l?.txt}\n className={'md-tablet:text-left'}\n dangerouslySetInnerHTML={{ __html: l?.txt }}\n onClick={() => {\n setOpenSort(false)\n onSortChange?.(k)\n }}\n />\n </li>\n ))}\n </ul>\n </div>\n </div>\n </div>\n <div className=\"mb-2 hidden md-tablet:block\">\n {shopFiltersPair?.filter_txt?.found ? (\n <Text\n className=\"tablet:text-base text-sm font-semibold text-[#86868C]\"\n html={shopFiltersPair?.filter_txt?.found?.replace('${number}', total || 0)}\n />\n ) : (\n <Text\n className=\"tablet:text-base text-sm font-semibold text-[#86868C]\"\n html={`${total || 0} Item(s) Found`}\n />\n )}\n </div>\n </div>\n )\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["FilterHeader_exports", "__export", "FilterHeader", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_components", "import_react", "props", "total", "closeFilter", "metafields", "shopifyData", "onSortChange", "onCloseFilter", "onClearFiltered", "onMobileOpenDrawer", "sortKeyIndx", "drawerText", "shopFiltersPair", "openSort", "setOpenSort", "onCloseOrOpenFilter", "l", "k"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var V=Object.create;var y=Object.defineProperty;var j=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var
|
|
1
|
+
"use strict";var V=Object.create;var y=Object.defineProperty;var j=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var Q=Object.getPrototypeOf,Z=Object.prototype.hasOwnProperty;var G=(n,l)=>{for(var i in l)y(n,i,{get:l[i],enumerable:!0})},O=(n,l,i,f)=>{if(l&&typeof l=="object"||typeof l=="function")for(let m of q(l))!Z.call(n,m)&&m!==i&&y(n,m,{get:()=>l[m],enumerable:!(f=j(l,m))||f.enumerable});return n};var J=(n,l,i)=>(i=n!=null?V(Q(n)):{},O(l||!n||!n.__esModule?y(i,"default",{value:n,enumerable:!0}):i,n)),K=n=>O(y({},"__esModule",{value:!0}),n);var S={};G(S,{default:()=>P});module.exports=K(S);var e=require("react/jsx-runtime"),B=J(require("./component/AnimatedUL")),p=require("../../helpers/utils"),w=require("es-toolkit"),u=require("react"),$=require("react-responsive"),M=require("./component/filtersFun"),r=require("../../components/index.js");const E="!pt-4 transition-all duration-400 ease-in-out";function P(n){const l=(0,$.useMediaQuery)({query:"(max-width: 768px)"}),i=(0,u.useRef)(!1),{closeFilter:f,filtered:m,result:D,shopifyData:T,filterPrice:k,openOptions:g,metafields:A,mobileDrawerVisible:H,onCloseDrawer:h,onFilteredChange:_,onOpenOptions:F,onClearFiltered:R}=n,{drawerText:x}=T,{shop_filters_pair:C}=A,N=(0,u.useMemo)(()=>(0,M.handleFilterOptions)(D,k,C),[k,D?.filters,C?.filter_txt?.offers?.name,C?.filter_txt?.offers?.onsale]),v=(0,u.useMemo)(()=>N?.length?N?.map?.(t=>({...t,options:t?.options?.map?.(s=>({...s,checked:m?.[t?.value]?.indexOf?.(s?.value)>-1}))})):[],[m,N]),z=(t,s,o,a)=>{const d=t.target,c=(0,w.cloneDeep)(m)||{};let b=c?.[d?.name]||[];d.checked?a==="checkbox"?b.push(d?.value):b=[d?.value]:(0,w.remove)(b,U=>U===d.value),c[d.name]=b,b.length<=0&&Reflect.deleteProperty(c,d.name),_?.({...c},s,o)},I=t=>{let s=g?.concat?.();s?.map?.(o=>o.label===t?o.show=!o.show:o),F?.(s)},L=()=>v?.length>0&&(0,e.jsx)("div",{className:"filter-list",children:v.map((t,s)=>{const o=g?.find?.(a=>a.label==t.label);return(0,e.jsxs)("div",{className:(0,p.cn)("mb-4 overflow-hidden duration-300 ease-in-out"),children:[(0,e.jsxs)("div",{onClick:()=>I(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)(B.default,{className:"!pt-4 transition-all duration-400 ease-in-out","data-label":t.label,isOpen:!!o?.show,children:t?.options?.map?.((a,d)=>{const c=t.type?t.type==="checkbox"?"checkbox":"radio":"checkbox";return(0,e.jsx)("li",{className:(0,p.cn)("w-full mb-4 box-border",{disabled:a?.count<=0,"mb-0":d>=t?.options?.length-1}),children:(0,e.jsxs)("label",{className:"flex items-center overflow-hidden box-border",htmlFor:`${t.value}-${d}`,children:[(0,e.jsx)("input",{type:c,name:t.value,value:a.value,id:`${t.value}-${d}`,disabled:a?.count<=0,checked:a.checked,className:(0,p.cn)("size-4 cursor-pointer",a.checked?"accent-[#000000]":`appearance-none bg-transparent border border-[#000000] ${c==="radio"?"rounded-full":"rounded-[2px]"}`),onChange:b=>z(b,t,a,c)}),(0,e.jsx)("p",{className:(0,p.cn)("pt-0.5 pl-0.5 inline-block cursor-pointer font-semibold leading-none text-base"),children:a.label})]})},a.value)})})})]},`${t.label}${s}`)})});return(0,u.useEffect)(()=>{if(v?.length&&!g?.length&&!i.current){i.current=!0;let t=[];const s=document?.getElementsByClassName(E);for(let o=0;o<s.length;o++){let a={};a.label=s?.[o]?.getAttribute("data-label"),a.show=l?!1:o<6,a.height=document?.getElementsByClassName(E)?.[o]?.clientHeight,t.push(a)}F?.(t)}},[v]),(0,u.useEffect)(()=>{!l&&h?.(!1)},[l]),(0,e.jsxs)("div",{className:(0,p.cn)("transition-all duration-400 ease-in-out","desktop:w-60 tablet:w-48 laptop:w-[210px] md-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]",f?"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,p.cn)("transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full",f?"md-tablet:translate-y-0":"md-tablet:translate-y-[100%]"),children:L()}),(0,e.jsx)(r.Drawer,{open:H,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:x?.drawerTitle||"Mobile Filter"})}),(0,e.jsx)("div",{className:"flex-1 overflow-y-auto",children:L()}),(0,e.jsx)(r.DrawerFooter,{className:"pb-0 pt-4",children:(0,e.jsxs)("div",{className:(0,p.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:()=>{R?.(),h(!1)},children:x?.secondaryButton||"Clear"}),(0,e.jsx)(r.Button,{variant:"primary",className:"m-tablet:w-full",onClick:()=>{h(!1)},children:x?.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\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 ['disabled']: 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('!pt-4 transition-all duration-400 ease-in-out')\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('!pt-4 transition-all duration-400 ease-in-out')?.[\n index\n ]?.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] md-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=\"py-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", "import_filtersFun", "import_components", "props", "isMobile", "onceRef", "closeFilter", "filtered", "result", "shopifyData", "filterPrice", "openOptions", "metafields", "mobileDrawerVisible", "onCloseDrawer", "onFilteredChange", "onOpenOptions", "onClearFiltered", "drawerText", "shopFiltersPair", "filtersOptions", "filtersPair", "filter", "opt", "filterChange", "event", "type", "target", "clonefiltered", "current", "v", "handleFilterOpt", "label", "res", "item", "MobileFilterList", "openOption", "AnimatedUL", "p", "e", "domList", "index", "data"]
|
|
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 ['disabled']: 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] md-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,GA2GgB,IAAAI,EAAA,6BA3GhBC,EAAuB,qCACvBC,EAAmB,+BAEnBC,EAAkC,sBAClCC,EAA2C,iBAC3CC,EAA8B,4BAC9BC,EAAoC,kCACpCC,EAAuF,qCAiBvF,MAAMC,EAA0B,gDAEjB,SAARV,EAA4BW,EAAwB,CACzD,MAAMC,KAAW,iBAAc,CAAE,MAAO,oBAAqB,CAAC,EACxDC,KAAU,UAAgB,EAAK,EAE/B,CACJ,YAAAC,EACA,SAAAC,EACA,OAAAC,EACA,YAAAC,EACA,YAAAC,EACA,YAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,cAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,gBAAAC,CACF,EAAId,EAEE,CAAE,WAAAe,CAAW,EAAIT,EAEjB,CAAE,kBAAmBU,CAAgB,EAAIP,EAGzCQ,KAAiB,WAAQ,OACtB,uBAAoBZ,EAAQE,EAAaS,CAAe,EAC9D,CACDT,EACAF,GAAQ,QACRW,GAAiB,YAAY,QAAQ,KACrCA,GAAiB,YAAY,QAAQ,MACvC,CAAC,EAEKE,KAAc,WAAQ,IACrBD,GAAgB,OACdA,GAAgB,MAAOE,IACrB,CACL,GAAGA,EACH,QAASA,GAAQ,SAAS,MAAOC,IACxB,CACL,GAAGA,EACH,QAAShB,IAAWe,GAAQ,KAAK,GAAG,UAAUC,GAAK,KAAK,EAAI,EAC9D,EACD,CACH,EACD,EAXmC,CAAC,EAYpC,CAAChB,EAAUa,CAAc,CAAC,EAEvBI,EAAe,CAACC,EAAsCH,EAAaC,EAAUG,IAAiB,CAClG,MAAMC,EAASF,EAAM,OACfG,KAAgB,aAAUrB,CAAQ,GAAK,CAAC,EAC9C,IAAIsB,EAAUD,IAAgBD,GAAQ,IAAI,GAAK,CAAC,EAC5CA,EAAO,QACTD,IAAS,WAAaG,EAAQ,KAAKF,GAAQ,KAAK,EAAKE,EAAU,CAACF,GAAQ,KAAK,KAE7E,UAAOE,EAAUC,GAAcA,IAAMH,EAAO,KAAK,EAEnDC,EAAcD,EAAO,IAAI,EAAIE,EACzBA,EAAQ,QAAU,GACpB,QAAQ,eAAeD,EAAeD,EAAO,IAAI,EAEnDZ,IAAmB,CAAE,GAAGa,CAAc,EAAGN,EAAQC,CAAG,CACtD,EAEMQ,EAAmBC,GAAkB,CACzC,IAAIC,EAAMtB,GAAa,SAAS,EAChCsB,GAAK,MAAOC,GACNA,EAAK,QAAUF,EAAeE,EAAK,KAAO,CAACA,EAAK,KAC7CA,CACR,EACDlB,IAAgBiB,CAAG,CACrB,EAEME,EAAmB,IAErBd,GAAa,OAAS,MACpB,OAAC,OAAI,UAAU,cACZ,SAAAA,EAAY,IAAI,CAACC,EAAac,IAAc,CAC3C,MAAMC,EAAa1B,GAAa,OAAQuB,GAAcA,EAAK,OAASZ,EAAO,KAAK,EAChF,SACE,QAAC,OAAgC,aAAW,MAAG,+CAA+C,EAC5F,qBAAC,OACC,QAAS,IAAMS,EAAgBT,EAAO,KAAK,EAC3C,UACE,0HAGF,oBAAC,UAAO,UAAU,4EAChB,mBAAC,QAAK,UAAU,8BAA+B,SAAAA,EAAO,MAAM,EAC9D,KACA,OAAC,OAAI,UAAW,4BAA4Be,GAAY,MAAQ,YAAY,GAC1E,mBAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,IAAI,QAAQ,WAAW,KAAK,OACpF,mBAAC,QACC,EAAE,wVACF,KAAK,UACP,EACF,EACF,GACF,KACA,OAAC,OAAI,UAAW,0DACd,mBAAC,EAAAC,QAAA,CACG,UAAW,gDACX,aAAYhB,EAAO,MACnB,OAAQ,CAAC,CAACe,GAAY,KAErB,SAAAf,GAAQ,SAAS,MAAM,CAACC,EAAUgB,IAAc,CAC/C,MAAMb,EAAOJ,EAAO,KAAQA,EAAO,OAAS,WAAa,WAAa,QAAW,WACjF,SACE,OAAC,MAEC,aAAW,MAAG,yBAA0B,CACrC,SAAaC,GAAK,OAAS,EAC5B,OAAQgB,GAAKjB,GAAQ,SAAS,OAAS,CACzC,CAAC,EAED,oBAAC,SACC,UAAU,+CACV,QAAS,GAAGA,EAAO,KAAK,IAAIiB,CAAC,GAE7B,oBAAC,SACC,KAAMb,EACN,KAAMJ,EAAO,MACb,MAAOC,EAAI,MACX,GAAI,GAAGD,EAAO,KAAK,IAAIiB,CAAC,GACxB,SAAUhB,GAAK,OAAS,EACxB,QAASA,EAAI,QACb,aAAW,MACT,wBACAA,EAAI,QACA,mBACA,0DAA0DG,IAAS,QAAU,eAAiB,eAAe,EACnH,EACA,SAAUc,GAAKhB,EAAagB,EAAGlB,EAAQC,EAAKG,CAAI,EAClD,KACA,OAAC,KACC,aAAW,MACT,gFACF,EAEC,SAAAH,EAAI,MACP,GACF,GAhCKA,EAAI,KAiCX,CAEJ,CAAC,EACH,EACJ,IAlEQ,GAAGD,EAAO,KAAK,GAAGc,CAAC,EAmE7B,CAEJ,CAAC,EACH,EAKN,sBAAU,IAAM,CACd,GAAIf,GAAa,QAAU,CAACV,GAAa,QAAU,CAACN,EAAQ,QAAS,CACnEA,EAAQ,QAAU,GAClB,IAAI4B,EAAM,CAAC,EACX,MAAMQ,EAAU,UAAU,uBAAuBvC,CAAuB,EACxE,QAASwC,EAAQ,EAAGA,EAAQD,EAAQ,OAAQC,IAAS,CACnD,IAAIC,EAAO,CAAC,EACZA,EAAK,MAAQF,IAAUC,CAAK,GAAG,aAAa,YAAY,EACxDC,EAAK,KAAOvC,EAAW,GAAQsC,EAAQ,EACvCC,EAAK,OAAS,UAAU,uBAAuBzC,CAAuB,IAAIwC,CAAK,GAAG,aAClFT,EAAI,KAAKU,CAAI,CACf,CACA3B,IAAgBiB,CAAG,CACrB,CACF,EAAG,CAACZ,CAAW,CAAC,KAEhB,aAAU,IAAM,CACd,CAACjB,GAAYU,IAAgB,EAAK,CACpC,EAAG,CAACV,CAAQ,CAAC,KAGX,QAAC,OACC,aAAW,MACT,0CACA,iHACA,yGACAE,EACI,sDACA,mDACN,EAEA,oBAAC,OACC,aAAW,MACT,oHACAA,EAAc,0BAA4B,8BAC5C,EAEC,SAAA6B,EAAiB,EACpB,KACA,OAAC,UAAO,KAAMtB,EAAqB,aAAc,IAAMC,EAAc,EAAK,EACxE,oBAAC,iBAAc,UAAU,yCACvB,oBAAC,gBAAa,UAAU,mCACtB,mBAAC,eAAa,SAAAI,GAAY,aAAe,gBAAgB,EAC3D,KACA,OAAC,OAAI,UAAU,yBAA0B,SAAAiB,EAAiB,EAAE,KAC5D,OAAC,gBAAa,UAAU,YACtB,oBAAC,OAAI,aAAW,MAAG,0BAA2B,0CAA0C,EACtF,oBAAC,UACC,QAAQ,YACR,UAAU,kBACV,QAAS,IAAM,CACblB,IAAkB,EAClBH,EAAc,EAAK,CACrB,EAEC,SAAAI,GAAY,iBAAmB,QAClC,KACA,OAAC,UACC,QAAQ,UACR,UAAU,kBACV,QAAS,IAAM,CACbJ,EAAc,EAAK,CACrB,EAEC,SAAAI,GAAY,eAAiB,QAChC,GACF,EACF,GACF,EACF,GACF,CAEJ",
|
|
6
|
+
"names": ["FilterList_exports", "__export", "FilterList", "__toCommonJS", "import_jsx_runtime", "import_AnimatedUL", "import_utils", "import_es_toolkit", "import_react", "import_react_responsive", "import_filtersFun", "import_components", "filterListItemClassName", "props", "isMobile", "onceRef", "closeFilter", "filtered", "result", "shopifyData", "filterPrice", "openOptions", "metafields", "mobileDrawerVisible", "onCloseDrawer", "onFilteredChange", "onOpenOptions", "onClearFiltered", "drawerText", "shopFiltersPair", "filtersOptions", "filtersPair", "filter", "opt", "filterChange", "event", "type", "target", "clonefiltered", "current", "v", "handleFilterOpt", "label", "res", "item", "MobileFilterList", "i", "openOption", "AnimatedUL", "p", "e", "domList", "index", "data"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var G=Object.create;var g=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var U=Object.getPrototypeOf,X=Object.prototype.hasOwnProperty;var Y=(e,t)=>{for(var n in t)g(e,n,{get:t[n],enumerable:!0})},x=(e,t,n,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of Q(t))!X.call(e,a)&&a!==n&&g(e,a,{get:()=>t[a],enumerable:!(d=J(t,a))||d.enumerable});return e};var u=(e,t,n)=>(n=e!=null?G(U(e)):{},x(t||!e||!e.__esModule?g(n,"default",{value:e,enumerable:!0}):n,e)),Z=e=>x(g({},"__esModule",{value:!0}),e);var ee={};Y(ee,{default:()=>j});module.exports=Z(ee);var s=require("react/jsx-runtime"),S=u(require("./FilterList")),w=u(require("./FilterHeader")),N=u(require("./FilterCardWrap")),D=require("../../shared/Styles.js"),L=u(require("./component/TabFilter")),r=require("react"),i=require("./component/filtersFun");function $(e){const{data:t,result:n={},allResult:d={},loadMore:a=null,metafields:f={},filterPrice:O={},isLoading:R=!1,onFilteredChange:y,onSortAndReverseChange:I,onPrimaryChange:K,onSecondaryChange:M,onNextPage:_,onPrevPage:k}=e,{shop_filters_pair:C}=f,[c,A]=(0,r.useState)(!1),[V,F]=(0,r.useState)(!1),[z,E]=(0,r.useState)([]),[m,v]=(0,r.useState)({}),[b,H]=(0,r.useState)(0),[h,p]=(0,r.useState)(1),[T,W]=(0,r.useState)(!1);(0,r.useMemo)(()=>{const o=C?.filter_txt?.sortList,[l,B]=(0,i.handleSortKeyAndReverse)(o,b);I?.(l,B)},[C?.filter_txt?.sortList,m,b]);const q=o=>!o?.metafields?.seoSetting?.noindex,P=(0,r.useMemo)(()=>d?.products?.filter(q)?.length||0,[d?.products]);return(0,r.useEffect)(()=>{const l=(m?.offers||[])?.includes?.("onsale");W(l)},[m]),(0,s.jsxs)("div",{className:"size-full box-border",children:[(0,s.jsx)("div",{className:"laptop:mb-12 mb-6",children:(0,s.jsx)(L.default,{tabs:t?.tabItems})}),(0,s.jsx)(w.default,{total:P||0,metafields:f,closeFilter:c,sortKeyIndx:b,shopifyData:t,onSortChange:H,onCloseFilter:A,onClearFiltered:()=>{v?.({}),y?.((0,i.handleFilters)({}))},onMobileOpenDrawer:F}),(0,s.jsxs)("div",{className:"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8",children:[!c&&(0,s.jsx)(S.default,{result:n,filtered:m,filterPrice:O,openOptions:z,closeFilter:c,shopifyData:t,metafields:f,mobileDrawerVisible:V,onFilteredChange:o=>{v(o),p(1),y?.((0,i.handleFilters)(o))},onClearFiltered:()=>{v?.({}),p(1),y?.((0,i.handleFilters)({}))},onOpenOptions:E,onCloseDrawer:F}),(0,s.jsxs)("div",{className:"flex-1 overflow-y-auto relative",children:[(0,s.jsx)(N.default,{page:h,result:n,shopifyData:t,total:P,isSale:T,metafields:f,closeFilter:c,onNextPage:o=>{p(h+1),_?.(o)},onPrevPage:o=>{p(h-1),k?.(o)},onPrimaryChange:(o,l)=>K?.(o,l),onSecondaryChange:(o,l)=>M?.(o,l)}),R&&a||null]})]})]})}var j=(0,D.withLayout)($);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|