@anker-in/headless-ui 1.1.9-alpha.1764038649043 → 1.1.9-alpha.1764056831196

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.
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var f=(o,e)=>{for(var l in e)a(o,l,{get:e[l],enumerable:!0})},u=(o,e,l,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let p of g(e))!x.call(o,p)&&p!==l&&a(o,p,{get:()=>e[p],enumerable:!(r=d(e,p))||r.enumerable});return o};var v=o=>u(a({},"__esModule",{value:!0}),o);var T={};f(T,{default:()=>N});module.exports=v(T);var t=require("react/jsx-runtime"),h=require("../../helpers/utils.js"),D=require("../SwiperBox/index.js"),c=require("../../shared/Styles.js"),s=require("../../components/index.js"),i=require("../../hooks/useExposure.js"),n=require("react");const y="image",S="select_store",b=({index:o,item:e})=>{const l=(0,n.useRef)(null);return(0,i.useExposure)(l,{componentType:y,componentName:S,position:o+1,componentTitle:e.title,componentDescription:e.desc}),(0,t.jsxs)("div",{ref:l,className:"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]",children:[(0,t.jsx)(s.Picture,{className:"object-cover",imgClassName:"w-full h-full object-cover",source:`${e?.img?.url}, ${e?.padImg?.url} 1439, ${e?.miniImg?.url} 1023, ${e?.mobileImg?.url} 767`}),(0,t.jsxs)("div",{className:"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4",children:[(0,t.jsx)(s.Text,{html:e?.title,className:"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold"}),(0,t.jsx)(s.Text,{html:e?.desc,className:"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]"})]})]})},I=o=>{const{data:e,className:l}=o,{list:r}=e;return(0,t.jsx)(t.Fragment,{children:(0,t.jsx)("div",{className:"",children:(0,t.jsx)("div",{className:"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4",children:r.map((p,m)=>(0,t.jsx)(b,{index:m,item:p},m))})})})};var N=(0,c.withLayout)(I);
1
+ "use strict";"use client";var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var f=(o,e)=>{for(var p in e)a(o,p,{get:e[p],enumerable:!0})},u=(o,e,p,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of g(e))!x.call(o,l)&&l!==p&&a(o,l,{get:()=>e[l],enumerable:!(r=d(e,l))||r.enumerable});return o};var v=o=>u(a({},"__esModule",{value:!0}),o);var T={};f(T,{default:()=>N});module.exports=v(T);var t=require("react/jsx-runtime"),w=require("../../helpers/utils.js"),E=require("../SwiperBox/index.js"),c=require("../../shared/Styles.js"),s=require("../../components/index.js"),i=require("../../hooks/useExposure.js"),n=require("react");const y="image",S="select_store",b=({index:o,item:e})=>{const p=(0,n.useRef)(null);return(0,i.useExposure)(p,{componentType:y,componentName:S,position:o+1,componentTitle:e.title,componentDescription:e.desc}),(0,t.jsxs)("div",{ref:p,className:"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]",children:[(0,t.jsx)(s.Picture,{className:"object-cover",imgClassName:"w-full object-cover",source:`${e?.img?.url}, ${e?.padImg?.url} 1439, ${e?.miniImg?.url} 1023, ${e?.mobileImg?.url} 767`}),(0,t.jsxs)("div",{className:"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4",children:[(0,t.jsx)(s.Text,{html:e?.title,className:"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold"}),(0,t.jsx)(s.Text,{html:e?.desc,className:"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]"})]})]})},I=o=>{const{data:e,className:p}=o,{list:r}=e;return(0,t.jsx)(t.Fragment,{children:(0,t.jsx)("div",{className:"",children:(0,t.jsx)("div",{className:"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4",children:r.map((l,m)=>(0,t.jsx)(b,{index:m,item:l},m))})})})};var N=(0,c.withLayout)(I);
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/SelectStore/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef } from 'react'\n\nexport type SelectStoreDataType = {\n title: string\n desc: string\n img: Img\n mobileImg: Img\n padImg: Img\n miniImg: Img\n // pay: {\n // img: Img\n // }[]\n // delivery: {\n // img: Img\n // }[]\n // service: {\n // title: string\n // img: Img\n // }[]\n}\n\ntype SelectStoreType = {\n data: {\n list: SelectStoreDataType[]\n }\n className?: string\n}\n\nconst componentType = 'image'\nconst componentName = 'select_store'\n\nconst Item = ({ index, item }: { index: number; item: SelectStoreDataType }) => {\n const ref = useRef<HTMLDivElement>(null)\n\n useExposure(ref, {\n componentType: componentType,\n componentName: componentName,\n position: index + 1,\n componentTitle: item.title,\n componentDescription: item.desc,\n })\n\n return (\n <div\n ref={ref}\n className=\"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]\"\n >\n <Picture\n className=\"object-cover\"\n imgClassName=\"w-full h-full object-cover\"\n source={`${item?.img?.url}, ${item?.padImg?.url} 1439, ${item?.miniImg?.url} 1023, ${item?.mobileImg?.url} 767`}\n />\n <div className=\"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4\">\n <Text\n html={item?.title}\n className=\"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold\"\n />\n <Text\n html={item?.desc}\n className=\"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]\"\n />\n </div>\n </div>\n )\n}\n\nconst SelectStore = (props: SelectStoreType) => {\n const { data, className } = props\n const { list } = data\n // const number = list?.[2]?.service?.length || 0\n return (\n <>\n <div className=\"\">\n <div className=\"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4\">\n {list.map((item, index) => (\n <Item key={index} index={index} item={item} />\n ))}\n </div>\n {/* <div className='grid desktop:grid-cols-3 tablet:grid-cols-2 grid-cols-1 gap-4'>\n {list.map((item, index) => (\n <div key={index} className='bg-[#EAEAEC] rounded-2xl min-h-[240px] laptop:min-h-[280px] lg-desktop:min-h-[320px]'>\n <div className='flex flex-col laptop:p-[24px] lg-desktop:p-[32px] p-[16px] justify-start h-full'>\n <div className=\"flex flex-col justify-center flex-1\">\n \n {item?.pay && (\n <div className='flex gap-[16px] flex-wrap items-center justify-center laptop:gap-[24px]'>\n {item?.pay?.map((pay, ind)=>{\n return (\n <div key={ind} className='laptop:w-[60px] w-[48px]'>\n <Picture\n className=\" w-full\"\n imgClassName=\"\"\n source={pay?.img?.url}\n alt={pay?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n )}\n \n {\n item?.delivery && (\n <div className='flex gap-[24px] items-center justify-center'>\n {item?.delivery?.map((delivery, ind)=>{\n return (\n <div key={ind} className=''>\n <Picture\n className={` ${ind === 0 ? 'laptop:w-[174px] w-[116px]' : 'laptop:w-[75px] w-[50px]'}`}\n imgClassName=\"\"\n source={delivery?.img?.url}\n alt={delivery?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n ) \n }\n \n {\n item?.service && (\n <div className=' desktop:gap-[24px] gap-[8px] tablet:gap-[12px] laptop:gap-[28px] grid l-tablet:grid-cols-2 tablet:flex flex-wrap desktop:grid-cols-4 items-center justify-center'>\n {item?.service?.map((service, ind)=>{\n // \u5224\u65AD\uFF1A\u53EA\u5BF9\u7B2C\u4E94\u6761\uFF08index === 4\uFF09\u5E94\u7528\u54CD\u5E94\u5F0F\u663E\u793A/\u9690\u85CF\n const isFifth = ind === 4;\n return (\n <div key={ind} className={`\n flex flex-col items-center desktop:h-full w-[157px] justify-start desktop:w-[81px]\n ${isFifth ? 'laptop:flex desktop:hidden hidden' : ''} \n `}>\n <div className='w-[70px] desktop:w-[54px]'>\n <Picture\n className=\"\"\n imgClassName=\"w-full h-auto\"\n source={service?.img?.url}\n alt={service?.img?.alt || ''}\n />\n </div>\n <div className='text-center'>\n <Text html={service?.title} className=' font-bold text-[12px] mt-[8px] leading-[1.4]' />\n </div>\n </div>\n )\n })}\n </div>\n )\n }\n </div>\n <div className='mt-auto'>\n <Text html={item?.title} className='text-[20px] lg-desktop:text-[24px] [&_*_strong]:!font-bold leading-[1.2] text-[#1d1d1f]'/>\n <Text html={item?.desc} className='text-[14px] line-clamp-1 lg-desktop:text-[16px] leading-[1.4] text-[#1d1d1f]'/>\n </div>\n \n </div>\n </div>\n ))}\n </div> */}\n </div>\n </>\n )\n}\n\nexport default withLayout(SelectStore)\n"],
5
- "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsDM,IAAAI,EAAA,6BArDNC,EAAmB,kCACnBC,EAAsB,iCAEtBC,EAA2B,kCAC3BC,EAA8B,qCAC9BC,EAA4B,sCAC5BC,EAAuB,iBA4BvB,MAAMC,EAAgB,QAChBC,EAAgB,eAEhBC,EAAO,CAAC,CAAE,MAAAC,EAAO,KAAAC,CAAK,IAAoD,CAC9E,MAAMC,KAAM,UAAuB,IAAI,EAEvC,wBAAYA,EAAK,CACf,cAAeL,EACf,cAAeC,EACf,SAAUE,EAAQ,EAClB,eAAgBC,EAAK,MACrB,qBAAsBA,EAAK,IAC7B,CAAC,KAGC,QAAC,OACC,IAAKC,EACL,UAAU,oLAEV,oBAAC,WACC,UAAU,eACV,aAAa,6BACb,OAAQ,GAAGD,GAAM,KAAK,GAAG,KAAKA,GAAM,QAAQ,GAAG,UAAUA,GAAM,SAAS,GAAG,UAAUA,GAAM,WAAW,GAAG,OAC3G,KACA,QAAC,OAAI,UAAU,oEACb,oBAAC,QACC,KAAMA,GAAM,MACZ,UAAU,0FACZ,KACA,OAAC,QACC,KAAMA,GAAM,KACZ,UAAU,+EACZ,GACF,GACF,CAEJ,EAEME,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,SACE,mBACE,mBAAC,OAAI,UAAU,GACb,mBAAC,OAAI,UAAU,+DACZ,SAAAE,EAAK,IAAI,CAACN,EAAMD,OACf,OAACD,EAAA,CAAiB,MAAOC,EAAO,KAAMC,GAA3BD,CAAiC,CAC7C,EACH,EAiFF,EACF,CAEJ,EAEA,IAAOZ,KAAQ,cAAWe,CAAW",
4
+ "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef } from 'react'\n\nexport type SelectStoreDataType = {\n title: string\n desc: string\n img: Img\n mobileImg: Img\n padImg: Img\n miniImg: Img\n // pay: {\n // img: Img\n // }[]\n // delivery: {\n // img: Img\n // }[]\n // service: {\n // title: string\n // img: Img\n // }[]\n}\n\ntype SelectStoreType = {\n data: {\n list: SelectStoreDataType[]\n }\n className?: string\n}\n\nconst componentType = 'image'\nconst componentName = 'select_store'\n\nconst Item = ({ index, item }: { index: number; item: SelectStoreDataType }) => {\n const ref = useRef<HTMLDivElement>(null)\n\n useExposure(ref, {\n componentType: componentType,\n componentName: componentName,\n position: index + 1,\n componentTitle: item.title,\n componentDescription: item.desc,\n })\n\n return (\n <div\n ref={ref}\n className=\"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]\"\n >\n <Picture\n className=\"object-cover\"\n imgClassName=\"w-full object-cover\"\n source={`${item?.img?.url}, ${item?.padImg?.url} 1439, ${item?.miniImg?.url} 1023, ${item?.mobileImg?.url} 767`}\n />\n <div className=\"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4\">\n <Text\n html={item?.title}\n className=\"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold\"\n />\n <Text\n html={item?.desc}\n className=\"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]\"\n />\n </div>\n </div>\n )\n}\n\nconst SelectStore = (props: SelectStoreType) => {\n const { data, className } = props\n const { list } = data\n // const number = list?.[2]?.service?.length || 0\n return (\n <>\n <div className=\"\">\n <div className=\"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4\">\n {list.map((item, index) => (\n <Item key={index} index={index} item={item} />\n ))}\n </div>\n {/* <div className='grid desktop:grid-cols-3 tablet:grid-cols-2 grid-cols-1 gap-4'>\n {list.map((item, index) => (\n <div key={index} className='bg-[#EAEAEC] rounded-2xl min-h-[240px] laptop:min-h-[280px] lg-desktop:min-h-[320px]'>\n <div className='flex flex-col laptop:p-[24px] lg-desktop:p-[32px] p-[16px] justify-start h-full'>\n <div className=\"flex flex-col justify-center flex-1\">\n \n {item?.pay && (\n <div className='flex gap-[16px] flex-wrap items-center justify-center laptop:gap-[24px]'>\n {item?.pay?.map((pay, ind)=>{\n return (\n <div key={ind} className='laptop:w-[60px] w-[48px]'>\n <Picture\n className=\" w-full\"\n imgClassName=\"\"\n source={pay?.img?.url}\n alt={pay?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n )}\n \n {\n item?.delivery && (\n <div className='flex gap-[24px] items-center justify-center'>\n {item?.delivery?.map((delivery, ind)=>{\n return (\n <div key={ind} className=''>\n <Picture\n className={` ${ind === 0 ? 'laptop:w-[174px] w-[116px]' : 'laptop:w-[75px] w-[50px]'}`}\n imgClassName=\"\"\n source={delivery?.img?.url}\n alt={delivery?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n ) \n }\n \n {\n item?.service && (\n <div className=' desktop:gap-[24px] gap-[8px] tablet:gap-[12px] laptop:gap-[28px] grid l-tablet:grid-cols-2 tablet:flex flex-wrap desktop:grid-cols-4 items-center justify-center'>\n {item?.service?.map((service, ind)=>{\n // \u5224\u65AD\uFF1A\u53EA\u5BF9\u7B2C\u4E94\u6761\uFF08index === 4\uFF09\u5E94\u7528\u54CD\u5E94\u5F0F\u663E\u793A/\u9690\u85CF\n const isFifth = ind === 4;\n return (\n <div key={ind} className={`\n flex flex-col items-center desktop:h-full w-[157px] justify-start desktop:w-[81px]\n ${isFifth ? 'laptop:flex desktop:hidden hidden' : ''} \n `}>\n <div className='w-[70px] desktop:w-[54px]'>\n <Picture\n className=\"\"\n imgClassName=\"w-full h-auto\"\n source={service?.img?.url}\n alt={service?.img?.alt || ''}\n />\n </div>\n <div className='text-center'>\n <Text html={service?.title} className=' font-bold text-[12px] mt-[8px] leading-[1.4]' />\n </div>\n </div>\n )\n })}\n </div>\n )\n }\n </div>\n <div className='mt-auto'>\n <Text html={item?.title} className='text-[20px] lg-desktop:text-[24px] [&_*_strong]:!font-bold leading-[1.2] text-[#1d1d1f]'/>\n <Text html={item?.desc} className='text-[14px] line-clamp-1 lg-desktop:text-[16px] leading-[1.4] text-[#1d1d1f]'/>\n </div>\n \n </div>\n </div>\n ))}\n </div> */}\n </div>\n </>\n )\n}\n\nexport default withLayout(SelectStore)\n"],
5
+ "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsDM,IAAAI,EAAA,6BArDNC,EAAmB,kCACnBC,EAAsB,iCAEtBC,EAA2B,kCAC3BC,EAA8B,qCAC9BC,EAA4B,sCAC5BC,EAAuB,iBA4BvB,MAAMC,EAAgB,QAChBC,EAAgB,eAEhBC,EAAO,CAAC,CAAE,MAAAC,EAAO,KAAAC,CAAK,IAAoD,CAC9E,MAAMC,KAAM,UAAuB,IAAI,EAEvC,wBAAYA,EAAK,CACf,cAAeL,EACf,cAAeC,EACf,SAAUE,EAAQ,EAClB,eAAgBC,EAAK,MACrB,qBAAsBA,EAAK,IAC7B,CAAC,KAGC,QAAC,OACC,IAAKC,EACL,UAAU,oLAEV,oBAAC,WACC,UAAU,eACV,aAAa,sBACb,OAAQ,GAAGD,GAAM,KAAK,GAAG,KAAKA,GAAM,QAAQ,GAAG,UAAUA,GAAM,SAAS,GAAG,UAAUA,GAAM,WAAW,GAAG,OAC3G,KACA,QAAC,OAAI,UAAU,oEACb,oBAAC,QACC,KAAMA,GAAM,MACZ,UAAU,0FACZ,KACA,OAAC,QACC,KAAMA,GAAM,KACZ,UAAU,+EACZ,GACF,GACF,CAEJ,EAEME,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,SACE,mBACE,mBAAC,OAAI,UAAU,GACb,mBAAC,OAAI,UAAU,+DACZ,SAAAE,EAAK,IAAI,CAACN,EAAMD,OACf,OAACD,EAAA,CAAiB,MAAOC,EAAO,KAAMC,GAA3BD,CAAiC,CAC7C,EACH,EAiFF,EACF,CAEJ,EAEA,IAAOZ,KAAQ,cAAWe,CAAW",
6
6
  "names": ["SelectStore_exports", "__export", "SelectStore_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_SwiperBox", "import_Styles", "import_components", "import_useExposure", "import_react", "componentType", "componentName", "Item", "index", "item", "ref", "SelectStore", "props", "data", "className", "list"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use client";import{Fragment as v,jsx as t,jsxs as r}from"react/jsx-runtime";import"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as c}from"../../shared/Styles.js";import{Picture as i,Text as s}from"../../components/index.js";import{useExposure as n}from"../../hooks/useExposure.js";import{useRef as d}from"react";const g="image",x="select_store",f=({index:o,item:e})=>{const l=d(null);return n(l,{componentType:g,componentName:x,position:o+1,componentTitle:e.title,componentDescription:e.desc}),r("div",{ref:l,className:"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]",children:[t(i,{className:"object-cover",imgClassName:"w-full h-full object-cover",source:`${e?.img?.url}, ${e?.padImg?.url} 1439, ${e?.miniImg?.url} 1023, ${e?.mobileImg?.url} 767`}),r("div",{className:"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4",children:[t(s,{html:e?.title,className:"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold"}),t(s,{html:e?.desc,className:"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]"})]})]})},u=o=>{const{data:e,className:l}=o,{list:a}=e;return t(v,{children:t("div",{className:"",children:t("div",{className:"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4",children:a.map((m,p)=>t(f,{index:p,item:m},p))})})})};var w=c(u);export{w as default};
1
+ "use client";import{Fragment as v,jsx as t,jsxs as r}from"react/jsx-runtime";import"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as c}from"../../shared/Styles.js";import{Picture as i,Text as s}from"../../components/index.js";import{useExposure as n}from"../../hooks/useExposure.js";import{useRef as d}from"react";const g="image",x="select_store",f=({index:o,item:e})=>{const p=d(null);return n(p,{componentType:g,componentName:x,position:o+1,componentTitle:e.title,componentDescription:e.desc}),r("div",{ref:p,className:"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]",children:[t(i,{className:"object-cover",imgClassName:"w-full object-cover",source:`${e?.img?.url}, ${e?.padImg?.url} 1439, ${e?.miniImg?.url} 1023, ${e?.mobileImg?.url} 767`}),r("div",{className:"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4",children:[t(s,{html:e?.title,className:"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold"}),t(s,{html:e?.desc,className:"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]"})]})]})},u=o=>{const{data:e,className:p}=o,{list:a}=e;return t(v,{children:t("div",{className:"",children:t("div",{className:"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4",children:a.map((m,l)=>t(f,{index:l,item:m},l))})})})};var D=c(u);export{D as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/SelectStore/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef } from 'react'\n\nexport type SelectStoreDataType = {\n title: string\n desc: string\n img: Img\n mobileImg: Img\n padImg: Img\n miniImg: Img\n // pay: {\n // img: Img\n // }[]\n // delivery: {\n // img: Img\n // }[]\n // service: {\n // title: string\n // img: Img\n // }[]\n}\n\ntype SelectStoreType = {\n data: {\n list: SelectStoreDataType[]\n }\n className?: string\n}\n\nconst componentType = 'image'\nconst componentName = 'select_store'\n\nconst Item = ({ index, item }: { index: number; item: SelectStoreDataType }) => {\n const ref = useRef<HTMLDivElement>(null)\n\n useExposure(ref, {\n componentType: componentType,\n componentName: componentName,\n position: index + 1,\n componentTitle: item.title,\n componentDescription: item.desc,\n })\n\n return (\n <div\n ref={ref}\n className=\"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]\"\n >\n <Picture\n className=\"object-cover\"\n imgClassName=\"w-full h-full object-cover\"\n source={`${item?.img?.url}, ${item?.padImg?.url} 1439, ${item?.miniImg?.url} 1023, ${item?.mobileImg?.url} 767`}\n />\n <div className=\"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4\">\n <Text\n html={item?.title}\n className=\"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold\"\n />\n <Text\n html={item?.desc}\n className=\"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]\"\n />\n </div>\n </div>\n )\n}\n\nconst SelectStore = (props: SelectStoreType) => {\n const { data, className } = props\n const { list } = data\n // const number = list?.[2]?.service?.length || 0\n return (\n <>\n <div className=\"\">\n <div className=\"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4\">\n {list.map((item, index) => (\n <Item key={index} index={index} item={item} />\n ))}\n </div>\n {/* <div className='grid desktop:grid-cols-3 tablet:grid-cols-2 grid-cols-1 gap-4'>\n {list.map((item, index) => (\n <div key={index} className='bg-[#EAEAEC] rounded-2xl min-h-[240px] laptop:min-h-[280px] lg-desktop:min-h-[320px]'>\n <div className='flex flex-col laptop:p-[24px] lg-desktop:p-[32px] p-[16px] justify-start h-full'>\n <div className=\"flex flex-col justify-center flex-1\">\n \n {item?.pay && (\n <div className='flex gap-[16px] flex-wrap items-center justify-center laptop:gap-[24px]'>\n {item?.pay?.map((pay, ind)=>{\n return (\n <div key={ind} className='laptop:w-[60px] w-[48px]'>\n <Picture\n className=\" w-full\"\n imgClassName=\"\"\n source={pay?.img?.url}\n alt={pay?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n )}\n \n {\n item?.delivery && (\n <div className='flex gap-[24px] items-center justify-center'>\n {item?.delivery?.map((delivery, ind)=>{\n return (\n <div key={ind} className=''>\n <Picture\n className={` ${ind === 0 ? 'laptop:w-[174px] w-[116px]' : 'laptop:w-[75px] w-[50px]'}`}\n imgClassName=\"\"\n source={delivery?.img?.url}\n alt={delivery?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n ) \n }\n \n {\n item?.service && (\n <div className=' desktop:gap-[24px] gap-[8px] tablet:gap-[12px] laptop:gap-[28px] grid l-tablet:grid-cols-2 tablet:flex flex-wrap desktop:grid-cols-4 items-center justify-center'>\n {item?.service?.map((service, ind)=>{\n // \u5224\u65AD\uFF1A\u53EA\u5BF9\u7B2C\u4E94\u6761\uFF08index === 4\uFF09\u5E94\u7528\u54CD\u5E94\u5F0F\u663E\u793A/\u9690\u85CF\n const isFifth = ind === 4;\n return (\n <div key={ind} className={`\n flex flex-col items-center desktop:h-full w-[157px] justify-start desktop:w-[81px]\n ${isFifth ? 'laptop:flex desktop:hidden hidden' : ''} \n `}>\n <div className='w-[70px] desktop:w-[54px]'>\n <Picture\n className=\"\"\n imgClassName=\"w-full h-auto\"\n source={service?.img?.url}\n alt={service?.img?.alt || ''}\n />\n </div>\n <div className='text-center'>\n <Text html={service?.title} className=' font-bold text-[12px] mt-[8px] leading-[1.4]' />\n </div>\n </div>\n )\n })}\n </div>\n )\n }\n </div>\n <div className='mt-auto'>\n <Text html={item?.title} className='text-[20px] lg-desktop:text-[24px] [&_*_strong]:!font-bold leading-[1.2] text-[#1d1d1f]'/>\n <Text html={item?.desc} className='text-[14px] line-clamp-1 lg-desktop:text-[16px] leading-[1.4] text-[#1d1d1f]'/>\n </div>\n \n </div>\n </div>\n ))}\n </div> */}\n </div>\n </>\n )\n}\n\nexport default withLayout(SelectStore)\n"],
5
- "mappings": "aAsDM,OAwBF,YAAAA,EAxBE,OAAAC,EAKA,QAAAC,MALA,oBArDN,MAAmB,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC9B,OAAS,eAAAC,MAAmB,6BAC5B,OAAS,UAAAC,MAAc,QA4BvB,MAAMC,EAAgB,QAChBC,EAAgB,eAEhBC,EAAO,CAAC,CAAE,MAAAC,EAAO,KAAAC,CAAK,IAAoD,CAC9E,MAAMC,EAAMN,EAAuB,IAAI,EAEvC,OAAAD,EAAYO,EAAK,CACf,cAAeL,EACf,cAAeC,EACf,SAAUE,EAAQ,EAClB,eAAgBC,EAAK,MACrB,qBAAsBA,EAAK,IAC7B,CAAC,EAGCV,EAAC,OACC,IAAKW,EACL,UAAU,oLAEV,UAAAZ,EAACG,EAAA,CACC,UAAU,eACV,aAAa,6BACb,OAAQ,GAAGQ,GAAM,KAAK,GAAG,KAAKA,GAAM,QAAQ,GAAG,UAAUA,GAAM,SAAS,GAAG,UAAUA,GAAM,WAAW,GAAG,OAC3G,EACAV,EAAC,OAAI,UAAU,oEACb,UAAAD,EAACI,EAAA,CACC,KAAMO,GAAM,MACZ,UAAU,0FACZ,EACAX,EAACI,EAAA,CACC,KAAMO,GAAM,KACZ,UAAU,+EACZ,GACF,GACF,CAEJ,EAEME,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,OACEf,EAAAD,EAAA,CACE,SAAAC,EAAC,OAAI,UAAU,GACb,SAAAA,EAAC,OAAI,UAAU,+DACZ,SAAAiB,EAAK,IAAI,CAACN,EAAMD,IACfV,EAACS,EAAA,CAAiB,MAAOC,EAAO,KAAMC,GAA3BD,CAAiC,CAC7C,EACH,EAiFF,EACF,CAEJ,EAEA,IAAOQ,EAAQhB,EAAWW,CAAW",
4
+ "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef } from 'react'\n\nexport type SelectStoreDataType = {\n title: string\n desc: string\n img: Img\n mobileImg: Img\n padImg: Img\n miniImg: Img\n // pay: {\n // img: Img\n // }[]\n // delivery: {\n // img: Img\n // }[]\n // service: {\n // title: string\n // img: Img\n // }[]\n}\n\ntype SelectStoreType = {\n data: {\n list: SelectStoreDataType[]\n }\n className?: string\n}\n\nconst componentType = 'image'\nconst componentName = 'select_store'\n\nconst Item = ({ index, item }: { index: number; item: SelectStoreDataType }) => {\n const ref = useRef<HTMLDivElement>(null)\n\n useExposure(ref, {\n componentType: componentType,\n componentName: componentName,\n position: index + 1,\n componentTitle: item.title,\n componentDescription: item.desc,\n })\n\n return (\n <div\n ref={ref}\n className=\"lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] select-store-wrapper relative flex aspect-[358/240] flex-col overflow-hidden rounded-2xl bg-[#EAEAEC]\"\n >\n <Picture\n className=\"object-cover\"\n imgClassName=\"w-full object-cover\"\n source={`${item?.img?.url}, ${item?.padImg?.url} 1439, ${item?.miniImg?.url} 1023, ${item?.mobileImg?.url} 767`}\n />\n <div className=\"laptop:px-6 laptop:pb-6 lg-desktop:px-8 lg-desktop:pb-8 px-4 pb-4\">\n <Text\n html={item?.title}\n className=\"lg-desktop:text-[24px] text-[20px] leading-[1.2] text-[#1d1d1f] [&_*_strong]:!font-bold\"\n />\n <Text\n html={item?.desc}\n className=\"lg-desktop:text-[16px] line-clamp-1 text-[14px] leading-[1.4] text-[#1d1d1f]\"\n />\n </div>\n </div>\n )\n}\n\nconst SelectStore = (props: SelectStoreType) => {\n const { data, className } = props\n const { list } = data\n // const number = list?.[2]?.service?.length || 0\n return (\n <>\n <div className=\"\">\n <div className=\"laptop:grid-cols-3 tablet:grid-cols-2 grid grid-cols-1 gap-4\">\n {list.map((item, index) => (\n <Item key={index} index={index} item={item} />\n ))}\n </div>\n {/* <div className='grid desktop:grid-cols-3 tablet:grid-cols-2 grid-cols-1 gap-4'>\n {list.map((item, index) => (\n <div key={index} className='bg-[#EAEAEC] rounded-2xl min-h-[240px] laptop:min-h-[280px] lg-desktop:min-h-[320px]'>\n <div className='flex flex-col laptop:p-[24px] lg-desktop:p-[32px] p-[16px] justify-start h-full'>\n <div className=\"flex flex-col justify-center flex-1\">\n \n {item?.pay && (\n <div className='flex gap-[16px] flex-wrap items-center justify-center laptop:gap-[24px]'>\n {item?.pay?.map((pay, ind)=>{\n return (\n <div key={ind} className='laptop:w-[60px] w-[48px]'>\n <Picture\n className=\" w-full\"\n imgClassName=\"\"\n source={pay?.img?.url}\n alt={pay?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n )}\n \n {\n item?.delivery && (\n <div className='flex gap-[24px] items-center justify-center'>\n {item?.delivery?.map((delivery, ind)=>{\n return (\n <div key={ind} className=''>\n <Picture\n className={` ${ind === 0 ? 'laptop:w-[174px] w-[116px]' : 'laptop:w-[75px] w-[50px]'}`}\n imgClassName=\"\"\n source={delivery?.img?.url}\n alt={delivery?.img?.alt || ''}\n />\n </div>\n )\n })}\n </div>\n ) \n }\n \n {\n item?.service && (\n <div className=' desktop:gap-[24px] gap-[8px] tablet:gap-[12px] laptop:gap-[28px] grid l-tablet:grid-cols-2 tablet:flex flex-wrap desktop:grid-cols-4 items-center justify-center'>\n {item?.service?.map((service, ind)=>{\n // \u5224\u65AD\uFF1A\u53EA\u5BF9\u7B2C\u4E94\u6761\uFF08index === 4\uFF09\u5E94\u7528\u54CD\u5E94\u5F0F\u663E\u793A/\u9690\u85CF\n const isFifth = ind === 4;\n return (\n <div key={ind} className={`\n flex flex-col items-center desktop:h-full w-[157px] justify-start desktop:w-[81px]\n ${isFifth ? 'laptop:flex desktop:hidden hidden' : ''} \n `}>\n <div className='w-[70px] desktop:w-[54px]'>\n <Picture\n className=\"\"\n imgClassName=\"w-full h-auto\"\n source={service?.img?.url}\n alt={service?.img?.alt || ''}\n />\n </div>\n <div className='text-center'>\n <Text html={service?.title} className=' font-bold text-[12px] mt-[8px] leading-[1.4]' />\n </div>\n </div>\n )\n })}\n </div>\n )\n }\n </div>\n <div className='mt-auto'>\n <Text html={item?.title} className='text-[20px] lg-desktop:text-[24px] [&_*_strong]:!font-bold leading-[1.2] text-[#1d1d1f]'/>\n <Text html={item?.desc} className='text-[14px] line-clamp-1 lg-desktop:text-[16px] leading-[1.4] text-[#1d1d1f]'/>\n </div>\n \n </div>\n </div>\n ))}\n </div> */}\n </div>\n </>\n )\n}\n\nexport default withLayout(SelectStore)\n"],
5
+ "mappings": "aAsDM,OAwBF,YAAAA,EAxBE,OAAAC,EAKA,QAAAC,MALA,oBArDN,MAAmB,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC9B,OAAS,eAAAC,MAAmB,6BAC5B,OAAS,UAAAC,MAAc,QA4BvB,MAAMC,EAAgB,QAChBC,EAAgB,eAEhBC,EAAO,CAAC,CAAE,MAAAC,EAAO,KAAAC,CAAK,IAAoD,CAC9E,MAAMC,EAAMN,EAAuB,IAAI,EAEvC,OAAAD,EAAYO,EAAK,CACf,cAAeL,EACf,cAAeC,EACf,SAAUE,EAAQ,EAClB,eAAgBC,EAAK,MACrB,qBAAsBA,EAAK,IAC7B,CAAC,EAGCV,EAAC,OACC,IAAKW,EACL,UAAU,oLAEV,UAAAZ,EAACG,EAAA,CACC,UAAU,eACV,aAAa,sBACb,OAAQ,GAAGQ,GAAM,KAAK,GAAG,KAAKA,GAAM,QAAQ,GAAG,UAAUA,GAAM,SAAS,GAAG,UAAUA,GAAM,WAAW,GAAG,OAC3G,EACAV,EAAC,OAAI,UAAU,oEACb,UAAAD,EAACI,EAAA,CACC,KAAMO,GAAM,MACZ,UAAU,0FACZ,EACAX,EAACI,EAAA,CACC,KAAMO,GAAM,KACZ,UAAU,+EACZ,GACF,GACF,CAEJ,EAEME,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,OACEf,EAAAD,EAAA,CACE,SAAAC,EAAC,OAAI,UAAU,GACb,SAAAA,EAAC,OAAI,UAAU,+DACZ,SAAAiB,EAAK,IAAI,CAACN,EAAMD,IACfV,EAACS,EAAA,CAAiB,MAAOC,EAAO,KAAMC,GAA3BD,CAAiC,CAC7C,EACH,EAiFF,EACF,CAEJ,EAEA,IAAOQ,EAAQhB,EAAWW,CAAW",
6
6
  "names": ["Fragment", "jsx", "jsxs", "withLayout", "Picture", "Text", "useExposure", "useRef", "componentType", "componentName", "Item", "index", "item", "ref", "SelectStore", "props", "data", "className", "list", "SelectStore_default"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/headless-ui",
3
- "version": "1.1.9-alpha.1764038649043",
3
+ "version": "1.1.9-alpha.1764056831196",
4
4
  "type": "commonjs",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "types": "./dist/cjs/index.d.ts",