@anker-in/headless-ui 1.1.12 → 1.1.13
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/DownLoad/index.js +1 -1
- package/dist/cjs/biz-components/DownLoad/index.js.map +1 -1
- package/dist/cjs/biz-components/Features/index.js +1 -1
- package/dist/cjs/biz-components/Features/index.js.map +1 -1
- package/dist/cjs/biz-components/GraphicMore/index.js +1 -1
- package/dist/cjs/biz-components/GraphicMore/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js.map +2 -2
- package/dist/cjs/biz-components/SelectStore/index.js +1 -1
- package/dist/cjs/biz-components/SelectStore/index.js.map +1 -1
- package/dist/cjs/biz-components/Specs/index.js +1 -1
- package/dist/cjs/biz-components/Specs/index.js.map +2 -2
- package/dist/cjs/biz-components/Tabs/Tabs.js +1 -1
- package/dist/cjs/biz-components/Tabs/Tabs.js.map +2 -2
- package/dist/esm/biz-components/DownLoad/index.js +1 -1
- package/dist/esm/biz-components/DownLoad/index.js.map +1 -1
- package/dist/esm/biz-components/Features/index.js +1 -1
- package/dist/esm/biz-components/Features/index.js.map +1 -1
- package/dist/esm/biz-components/GraphicMore/index.js +1 -1
- package/dist/esm/biz-components/GraphicMore/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.js.map +2 -2
- package/dist/esm/biz-components/SelectStore/index.js +1 -1
- package/dist/esm/biz-components/SelectStore/index.js.map +1 -1
- package/dist/esm/biz-components/Specs/index.js +1 -1
- package/dist/esm/biz-components/Specs/index.js.map +2 -2
- package/dist/esm/biz-components/Tabs/Tabs.js +1 -1
- package/dist/esm/biz-components/Tabs/Tabs.js.map +2 -2
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var q=Object.create;var h=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,J=Object.prototype.hasOwnProperty;var K=(
|
|
1
|
+
"use strict";"use client";var q=Object.create;var h=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,J=Object.prototype.hasOwnProperty;var K=(l,o)=>{for(var c in o)h(l,c,{get:o[c],enumerable:!0})},F=(l,o,c,u)=>{if(o&&typeof o=="object"||typeof o=="function")for(let f of Q(o))!J.call(l,f)&&f!==c&&h(l,f,{get:()=>o[f],enumerable:!(u=z(o,f))||u.enumerable});return l};var A=(l,o,c)=>(c=l!=null?q(G(l)):{},F(o||!l||!l.__esModule?h(c,"default",{value:l,enumerable:!0}):c,l)),W=l=>F(h({},"__esModule",{value:!0}),l);var Y={};K(Y,{default:()=>X});module.exports=W(Y);var e=require("react/jsx-runtime"),H=A(require("./dropdown.js")),R=require("../AiuiProvider/index.js"),I=require("react-responsive"),p=require("react"),O=require("../../shared/Styles.js"),P=require("../ShelfDisplay/shelfDisplay.js"),d=require("../../components/index.js"),g=A(require("react"));const L=g.default.forwardRef((l,o)=>{const{data:c,buildData:u,onChange:f,onSecondaryChange:Z}=l||{},N=(0,I.useMediaQuery)({query:"(max-width: 768px)"}),[r,k]=(0,p.useState)({}),[D,S]=(0,p.useState)(!1),[w,C]=(0,p.useState)({}),E=(0,g.useRef)(null),{locale:_="us"}=(0,R.useAiuiContext)(),{LeftMenu:M,RightMenu:j,DefaultSelectMenu:v}=(0,p.useMemo)(()=>c?.data||{},[c?.data]),$=t=>{try{const n=new URL(t).pathname.toLowerCase();return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(n)}catch{return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(t)}},U=(t,s)=>{const n=j?.menus?.find?.(y=>y?.handle===t?.handle),a=t?.variants?.find?.(y=>y?.sku===t?.sku||n?.sku),i=a?.coupons?.[0],{price:m,basePrice:x}=(0,P.formatVariantPrice)({locale:_||"us",amount:i?i?.variant_price4wscode:a?.price,baseAmount:i?a?.price:0,currencyCode:t?.price?.currencyCode||"USD"}),b=typeof v?.buttonText=="string"?v?.buttonText:v?.buttonText?.[String(s)]||"";return(0,e.jsxs)("div",{className:"specs-sku-node-wrap box-border",children:[(0,e.jsxs)(d.Text,{className:"md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold",onClick:()=>{if(Object.keys(r||{})?.length<=2)return null;C({...w,[s]:!w?.[s]})},children:[(0,e.jsxs)("div",{className:"flex items-center justify-between overflow-hidden",children:[(0,e.jsx)("div",{className:"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base",title:r?.[s]?.name||"",children:r?.[s]?.name||""}),Object.keys(r||{})?.length>2?(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"25",viewBox:"0 0 24 25",fill:"none",className:"openDropDown",children:(0,e.jsx)("path",{d:"M6 9.5L12 15.5L18 9.5",stroke:"#1D1D1F","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"})}):null]}),(0,e.jsx)(H.default,{index:s,list:u?.products,active:r,filterActive:r,setActive:k,visible:w,setVisible:C})]}),(0,e.jsx)("div",{className:"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]",children:(0,e.jsx)(d.Picture,{source:a?.image?.url||"",className:"aspect-h-[280] aspect-w-[280]",imgClassName:"w-full h-full object-cover hover:scale-105 transition-all duration-300"})}),a?.availableForSale?(0,e.jsxs)("div",{className:"lg-desktop:text-2xl mb-2 mt-6 flex items-center text-xl font-bold",children:[(0,e.jsx)("div",{className:"specs-sku-node-price text-[#1D1D1F]",children:m||""}),x&&(0,e.jsx)("div",{className:"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through",children:x})]}):!1,b?(0,e.jsx)(d.Button,{onClick:()=>{f?.(t,s)},className:"specs-sku-node-button",children:b}):null]})},V=t=>t&&typeof t!="string"?(0,e.jsxs)("div",{className:"size-full",children:[(0,e.jsx)("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#1D1D1F] md:text-sm",dangerouslySetInnerHTML:{__html:t?.text||""}}),(0,e.jsx)(d.Picture,{source:t?.imgUrl,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"})]}):(0,e.jsx)("div",{className:"break-all",children:$(t)?(0,e.jsx)(d.Picture,{source:t,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"}):(0,e.jsx)("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#1D1D1F] md:text-sm",dangerouslySetInnerHTML:{__html:t||""}})}),T=t=>t.map((s,n)=>{const a=n===0;return(0,e.jsxs)("div",{className:"l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] specs-product-node-wrap",children:[(0,e.jsx)(d.Heading,{as:"h3",html:s||"",className:"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm"}),(0,e.jsx)("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${D?3:2} specs-product-node-body col-span-2 grid flex-1 py-6`,children:Object.keys(r)?.map?.(i=>{const m=r?.[i],x=j?.menus?.find?.(b=>b?.handle===m?.handle)?.subTitle;return V(x?.[s])})})]},s)}),B=t=>{if(!r)return;const{subTitle:s,isProduct:n}=t;return n?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("div",{className:"l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]",children:[t?.title&&(0,e.jsx)(d.Heading,{as:"h3",html:t?.title||"",className:"l:hidden specs-item-product-title"}),(0,e.jsx)("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${D?3:2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`,children:Object.keys(r)?.map((a,i)=>{const m=r?.[a],x=u?.products?.find?.(b=>b?.handle===m?.handle);return(0,e.jsx)("div",{children:U({...x,sku:m?.sku,item:a},i)},a)})})]}),s?.length?T(s):null]}):T(s)};return(0,g.useImperativeHandle)(o,()=>E.current),(0,p.useEffect)(()=>{if(!u?.products?.length)return;const t=v?.sku?.split?.(",")||[];let s={};t?.forEach?.((n,a)=>{const i=u?.products?.find?.(m=>{if(m?.variants?.find?.(b=>b?.sku===n))return!0});i&&(s={...s,[a]:{sku:n,name:i?.name||i?.title,handle:i?.handle}})}),k(s),S(t?.length>2)},[u]),(0,p.useEffect)(()=>{if(N){const t=Object.keys(r||{});if(t?.length>2){const s=t?.slice?.(0,2);let n={};s?.forEach?.(a=>{n={...n,[a]:r?.[a]}}),S(!1),k(n)}}},[N]),(0,e.jsx)("div",{className:"specs-wrapper w-full overflow-hidden bg-[#F5F5F7]",ref:E,children:M?.data?(0,e.jsx)("div",{className:"specs-wrapper-content box-border w-full overflow-hidden",children:M?.data?.map?.((t,s)=>(0,e.jsx)("div",{className:"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0",children:B(t)},s))}):null})});L.displayName="Specs";var X=(0,O.withLayout)(L);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Specs/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport DropDown from './dropdown.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useMemo, useState, useEffect } from 'react'\nimport { withLayout } from '../../shared/Styles.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport { Picture, Text, Button, Container, Heading } from '../../components/index.js'\nimport React, { useImperativeHandle, useRef } from 'react'\n\nconst Specs = React.forwardRef<HTMLDivElement, any>((page: any, ref) => {\n const { data, buildData, onChange, onSecondaryChange } = page || {}\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const [active, setActive] = useState<any>({})\n const [isShowMax, setIsShowMax] = useState<boolean>(false)\n const [visibleActive, setVisibleActive] = useState<{ [key: number]: boolean }>({})\n\n const innerRef = useRef<HTMLDivElement>(null)\n\n const { locale = 'us' } = useAiuiContext()\n\n const { LeftMenu, RightMenu, DefaultSelectMenu } = useMemo(() => data?.data || {}, [data?.data])\n\n const isImageUrl = (urlPath: string) => {\n try {\n const url = new URL(urlPath)\n const path = url.pathname.toLowerCase()\n return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(path)\n } catch (e) {\n // \u5982\u679C\u4F20\u5165\u7684\u4E0D\u662F\u6709\u6548URL\uFF08\u5982\u76F8\u5BF9\u8DEF\u5F84\uFF09\uFF0C\u76F4\u63A5\u68C0\u67E5\u8DEF\u5F84\n return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(urlPath)\n }\n }\n\n const skuNode = (product: any, index: number) => {\n const findCurrentData = RightMenu?.menus?.find?.((item: any) => item?.handle === product?.handle)\n const findSku = product?.variants?.find?.((item: any) => item?.sku === product?.sku || findCurrentData?.sku)\n const coupon = findSku?.coupons?.[0]\n const { price, basePrice } = formatVariantPrice({\n locale: locale || 'us',\n amount: coupon ? coupon?.variant_price4wscode : findSku?.price,\n baseAmount: coupon ? findSku?.price : 0,\n currencyCode: product?.price?.currencyCode || 'USD',\n })\n const buttonTextValue =\n typeof DefaultSelectMenu?.buttonText === 'string'\n ? DefaultSelectMenu?.buttonText\n : DefaultSelectMenu?.buttonText?.[String(index)] || ''\n return (\n <div className=\"specs-sku-node-wrap box-border\">\n <Text\n className={`md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold`}\n onClick={() => setVisibleActive({ ...visibleActive, [index]: !visibleActive?.[index] })}\n >\n <div className=\"flex items-center justify-between overflow-hidden\">\n <div\n className=\"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base\"\n title={active?.[index]?.name || ''}\n >\n {active?.[index]?.name || ''}\n </div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"25\"\n viewBox=\"0 0 24 25\"\n fill=\"none\"\n className=\"openDropDown\"\n >\n <path\n d=\"M6 9.5L12 15.5L18 9.5\"\n stroke=\"#1D1D1F\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n <DropDown\n index={index}\n list={buildData?.products}\n active={active}\n filterActive={active}\n setActive={setActive}\n visible={visibleActive}\n setVisible={setVisibleActive}\n />\n </Text>\n <div className=\"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]\">\n <Picture\n source={findSku?.image?.url || ''}\n className=\"aspect-h-[280] aspect-w-[280]\"\n imgClassName=\"w-full h-full object-cover hover:scale-105 transition-all duration-300\"\n />\n </div>\n {findSku?.availableForSale ? (\n <div className=\"lg-desktop:text-2xl mb-2 mt-6 flex items-center text-xl font-bold\">\n <div className=\"specs-sku-node-price text-[#1D1D1F]\">{price || ''}</div>\n {basePrice && (\n <div className=\"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through\">\n {basePrice}\n </div>\n )}\n </div>\n ) : (\n false\n )}\n {buttonTextValue ? (\n <Button\n onClick={() => {\n onChange?.(product, index)\n }}\n className=\"specs-sku-node-button\"\n >\n {buttonTextValue}\n </Button>\n ) : null}\n </div>\n )\n }\n\n const normalNode = (v: any) => {\n if (v && typeof v !== 'string') {\n return (\n <div className=\"size-full\">\n <p\n className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#1D1D1F] md:text-sm\"\n dangerouslySetInnerHTML={{\n __html: v?.text || '',\n }}\n />\n <Picture\n source={v?.imgUrl}\n className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n imgClassName=\"w-full h-full object-cover\"\n />\n </div>\n )\n }\n return (\n <div className=\"break-all\">\n {isImageUrl(v) ? (\n <Picture\n source={v}\n className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n imgClassName=\"w-full h-full object-cover\"\n />\n ) : (\n <p\n className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#1D1D1F] md:text-sm\"\n dangerouslySetInnerHTML={{\n __html: v || '',\n }}\n />\n )}\n </div>\n )\n }\n\n const productNode = (data: any) => {\n return data.map((st: any, idx: number) => {\n const isFirstParameter = idx === 0\n return (\n <div\n key={st}\n className={`l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] ${isFirstParameter ? '' : ''} specs-product-node-wrap`}\n >\n <Heading\n as=\"h3\"\n html={st || ''}\n className=\"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm\"\n />\n <div\n className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols- col-span-2 grid flex-1 py-6${isShowMax ? 3 : 2} specs-product-node-body`}\n >\n {Object.keys(active)?.map?.((item: string) => {\n const currentData = active?.[item]\n const currentMenus = RightMenu?.menus?.find?.(\n (item: any) => item?.handle === currentData?.handle\n )?.subTitle\n return normalNode(currentMenus?.[st])\n })}\n </div>\n </div>\n )\n })\n }\n\n // \u5DE6\u4FA7\u6807\u9898\u83DC\u5355\n const childrenNode = (node: any) => {\n if (!active) return\n const { subTitle, isProduct } = node\n // \u5982\u679C\u662F\u4EA7\u54C1\n if (isProduct) {\n return (\n <>\n <div\n className={`l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]`}\n >\n {node?.title && <Heading as=\"h3\" html={node?.title || ''} className=\"l:hidden specs-item-product-title\" />}\n <div\n className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols- col-span-2 grid flex-1 pb-4${isShowMax ? 3 : 2} specs-item-product-body pr-0`}\n >\n {Object.keys(active)?.map((item: string, index: number) => {\n const currentData = active?.[item]\n const currentProduct = buildData?.products?.find?.((item: any) => item?.handle === currentData?.handle)\n return <div key={item}>{skuNode({ ...currentProduct, sku: currentData?.sku, item: item }, index)}</div>\n })}\n </div>\n </div>\n {subTitle?.length ? productNode(subTitle) : null}\n </>\n )\n }\n return productNode(subTitle)\n }\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n useEffect(() => {\n if (!buildData?.products?.length) return\n const skus = DefaultSelectMenu?.sku?.split?.(',') || []\n let currentActive = {}\n skus?.forEach?.((sku: string, index: number) => {\n const findData = buildData?.products?.find?.((item: any) => {\n const findSku = item?.variants?.find?.((v: any) => v?.sku === sku)\n if (findSku) return true\n })\n if (findData) {\n currentActive = {\n ...currentActive,\n [index]: {\n sku: sku,\n name: findData?.name || findData?.title,\n handle: findData?.handle,\n },\n }\n }\n })\n setActive(currentActive)\n setIsShowMax(skus?.length > 2)\n }, [buildData])\n\n useEffect(() => {\n if (isMobile) {\n const currentActive = Object.keys(active || {})\n if (currentActive?.length > 2) {\n const newActive = currentActive?.slice?.(0, 2)\n let newShowActive = {}\n newActive?.forEach?.((item: string) => {\n newShowActive = { ...newShowActive, [item]: active?.[item] }\n })\n setIsShowMax(false)\n setActive(newShowActive)\n }\n }\n }, [isMobile])\n\n return (\n <div className=\"specs-wrapper w-full overflow-hidden bg-[#F5F5F7]\" ref={innerRef}>\n {LeftMenu?.data ? (\n <div className=\"specs-wrapper-content box-border w-full overflow-hidden\">\n {LeftMenu?.data?.map?.((item: any, index: number) => {\n return (\n <div key={index} className=\"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0\">\n {childrenNode(item)}\n </div>\n )\n })}\n </div>\n ) : null}\n </div>\n )\n})\n\nSpecs.displayName = 'Specs'\n\nexport default withLayout(Specs)\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport DropDown from './dropdown.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useMemo, useState, useEffect } from 'react'\nimport { withLayout } from '../../shared/Styles.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport { Picture, Text, Button, Container, Heading } from '../../components/index.js'\nimport React, { useImperativeHandle, useRef } from 'react'\n\nconst Specs = React.forwardRef<HTMLDivElement, any>((page: any, ref) => {\n const { data, buildData, onChange, onSecondaryChange } = page || {}\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const [active, setActive] = useState<any>({})\n const [isShowMax, setIsShowMax] = useState<boolean>(false)\n const [visibleActive, setVisibleActive] = useState<{ [key: number]: boolean }>({})\n\n const innerRef = useRef<HTMLDivElement>(null)\n\n const { locale = 'us' } = useAiuiContext()\n\n const { LeftMenu, RightMenu, DefaultSelectMenu } = useMemo(() => data?.data || {}, [data?.data])\n\n const isImageUrl = (urlPath: string) => {\n try {\n const url = new URL(urlPath)\n const path = url.pathname.toLowerCase()\n return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(path)\n } catch (e) {\n // \u5982\u679C\u4F20\u5165\u7684\u4E0D\u662F\u6709\u6548URL\uFF08\u5982\u76F8\u5BF9\u8DEF\u5F84\uFF09\uFF0C\u76F4\u63A5\u68C0\u67E5\u8DEF\u5F84\n return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(urlPath)\n }\n }\n\n const skuNode = (product: any, index: number) => {\n const findCurrentData = RightMenu?.menus?.find?.((item: any) => item?.handle === product?.handle)\n const findSku = product?.variants?.find?.((item: any) => item?.sku === product?.sku || findCurrentData?.sku)\n const coupon = findSku?.coupons?.[0]\n const { price, basePrice } = formatVariantPrice({\n locale: locale || 'us',\n amount: coupon ? coupon?.variant_price4wscode : findSku?.price,\n baseAmount: coupon ? findSku?.price : 0,\n currencyCode: product?.price?.currencyCode || 'USD',\n })\n const buttonTextValue =\n typeof DefaultSelectMenu?.buttonText === 'string'\n ? DefaultSelectMenu?.buttonText\n : DefaultSelectMenu?.buttonText?.[String(index)] || ''\n return (\n <div className=\"specs-sku-node-wrap box-border\">\n <Text\n className={`md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold`}\n onClick={() => {\n if (Object.keys(active || {})?.length <= 2) return null\n\n setVisibleActive({\n ...visibleActive,\n [index]: !visibleActive?.[index],\n })\n }}\n >\n <div className=\"flex items-center justify-between overflow-hidden\">\n <div\n className=\"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base\"\n title={active?.[index]?.name || ''}\n >\n {active?.[index]?.name || ''}\n </div>\n {Object.keys(active || {})?.length > 2 ? (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"25\"\n viewBox=\"0 0 24 25\"\n fill=\"none\"\n className=\"openDropDown\"\n >\n <path\n d=\"M6 9.5L12 15.5L18 9.5\"\n stroke=\"#1D1D1F\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n ) : null}\n </div>\n <DropDown\n index={index}\n list={buildData?.products}\n active={active}\n filterActive={active}\n setActive={setActive}\n visible={visibleActive}\n setVisible={setVisibleActive}\n />\n </Text>\n <div className=\"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]\">\n <Picture\n source={findSku?.image?.url || ''}\n className=\"aspect-h-[280] aspect-w-[280]\"\n imgClassName=\"w-full h-full object-cover hover:scale-105 transition-all duration-300\"\n />\n </div>\n {findSku?.availableForSale ? (\n <div className=\"lg-desktop:text-2xl mb-2 mt-6 flex items-center text-xl font-bold\">\n <div className=\"specs-sku-node-price text-[#1D1D1F]\">{price || ''}</div>\n {basePrice && (\n <div className=\"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through\">\n {basePrice}\n </div>\n )}\n </div>\n ) : (\n false\n )}\n {buttonTextValue ? (\n <Button\n onClick={() => {\n onChange?.(product, index)\n }}\n className=\"specs-sku-node-button\"\n >\n {buttonTextValue}\n </Button>\n ) : null}\n </div>\n )\n }\n\n const normalNode = (v: any) => {\n if (v && typeof v !== 'string') {\n return (\n <div className=\"size-full\">\n <p\n className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#1D1D1F] md:text-sm\"\n dangerouslySetInnerHTML={{\n __html: v?.text || '',\n }}\n />\n <Picture\n source={v?.imgUrl}\n className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n imgClassName=\"w-full h-full object-cover\"\n />\n </div>\n )\n }\n return (\n <div className=\"break-all\">\n {isImageUrl(v) ? (\n <Picture\n source={v}\n className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n imgClassName=\"w-full h-full object-cover\"\n />\n ) : (\n <p\n className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#1D1D1F] md:text-sm\"\n dangerouslySetInnerHTML={{\n __html: v || '',\n }}\n />\n )}\n </div>\n )\n }\n\n const productNode = (data: any) => {\n return data.map((st: any, idx: number) => {\n const isFirstParameter = idx === 0\n return (\n <div\n key={st}\n className={`l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] ${isFirstParameter ? '' : ''} specs-product-node-wrap`}\n >\n <Heading\n as=\"h3\"\n html={st || ''}\n className=\"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm\"\n />\n <div\n className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${isShowMax ? 3 : 2} specs-product-node-body col-span-2 grid flex-1 py-6`}\n >\n {Object.keys(active)?.map?.((item: string) => {\n const currentData = active?.[item]\n const currentMenus = RightMenu?.menus?.find?.(\n (item: any) => item?.handle === currentData?.handle\n )?.subTitle\n return normalNode(currentMenus?.[st])\n })}\n </div>\n </div>\n )\n })\n }\n\n // \u5DE6\u4FA7\u6807\u9898\u83DC\u5355\n const childrenNode = (node: any) => {\n if (!active) return\n const { subTitle, isProduct } = node\n // \u5982\u679C\u662F\u4EA7\u54C1\n if (isProduct) {\n return (\n <>\n <div\n className={`l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]`}\n >\n {node?.title && <Heading as=\"h3\" html={node?.title || ''} className=\"l:hidden specs-item-product-title\" />}\n <div\n className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${isShowMax ? 3 : 2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`}\n >\n {Object.keys(active)?.map((item: string, index: number) => {\n const currentData = active?.[item]\n const currentProduct = buildData?.products?.find?.((item: any) => item?.handle === currentData?.handle)\n return <div key={item}>{skuNode({ ...currentProduct, sku: currentData?.sku, item: item }, index)}</div>\n })}\n </div>\n </div>\n {subTitle?.length ? productNode(subTitle) : null}\n </>\n )\n }\n return productNode(subTitle)\n }\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n useEffect(() => {\n if (!buildData?.products?.length) return\n const skus = DefaultSelectMenu?.sku?.split?.(',') || []\n let currentActive = {}\n skus?.forEach?.((sku: string, index: number) => {\n const findData = buildData?.products?.find?.((item: any) => {\n const findSku = item?.variants?.find?.((v: any) => v?.sku === sku)\n if (findSku) return true\n })\n if (findData) {\n currentActive = {\n ...currentActive,\n [index]: {\n sku: sku,\n name: findData?.name || findData?.title,\n handle: findData?.handle,\n },\n }\n }\n })\n setActive(currentActive)\n setIsShowMax(skus?.length > 2)\n }, [buildData])\n\n useEffect(() => {\n if (isMobile) {\n const currentActive = Object.keys(active || {})\n if (currentActive?.length > 2) {\n const newActive = currentActive?.slice?.(0, 2)\n let newShowActive = {}\n newActive?.forEach?.((item: string) => {\n newShowActive = { ...newShowActive, [item]: active?.[item] }\n })\n setIsShowMax(false)\n setActive(newShowActive)\n }\n }\n }, [isMobile])\n\n return (\n <div className=\"specs-wrapper w-full overflow-hidden bg-[#F5F5F7]\" ref={innerRef}>\n {LeftMenu?.data ? (\n <div className=\"specs-wrapper-content box-border w-full overflow-hidden\">\n {LeftMenu?.data?.map?.((item: any, index: number) => {\n return (\n <div key={index} className=\"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0\">\n {childrenNode(item)}\n </div>\n )\n })}\n </div>\n ) : null}\n </div>\n )\n})\n\nSpecs.displayName = 'Specs'\n\nexport default withLayout(Specs)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Specs_exports", "__export", "Specs_default", "__toCommonJS", "import_jsx_runtime", "import_dropdown", "import_AiuiProvider", "import_react_responsive", "import_react", "import_Styles", "import_shelfDisplay", "import_components", "Specs", "React", "page", "ref", "data", "buildData", "onChange", "onSecondaryChange", "isMobile", "active", "setActive", "isShowMax", "setIsShowMax", "visibleActive", "setVisibleActive", "innerRef", "locale", "LeftMenu", "RightMenu", "DefaultSelectMenu", "isImageUrl", "urlPath", "path", "skuNode", "product", "index", "findCurrentData", "item", "findSku", "coupon", "price", "basePrice", "buttonTextValue", "DropDown", "normalNode", "v", "productNode", "st", "idx", "isFirstParameter", "currentData", "currentMenus", "childrenNode", "node", "subTitle", "isProduct", "currentProduct", "skus", "currentActive", "sku", "findData", "newActive", "newShowActive"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var L=Object.create;var p=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var B=(r
|
|
1
|
+
"use strict";"use client";var L=Object.create;var p=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var B=(e,r)=>{for(var s in r)p(e,s,{get:r[s],enumerable:!0})},f=(e,r,s,l)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of G(r))!w.call(e,m)&&m!==s&&p(e,m,{get:()=>r[m],enumerable:!(l=A(r,m))||l.enumerable});return e};var o=(e,r,s)=>(s=e!=null?L(q(e)):{},f(r||!e||!e.__esModule?p(s,"default",{value:e,enumerable:!0}):s,e)),D=e=>f(p({},"__esModule",{value:!0}),e);var x={};B(x,{default:()=>R});module.exports=D(x);var i=require("react/jsx-runtime"),n=require("../../shared/Styles.js"),c=o(require("../../components/tabs.js")),d=require("../../helpers/index.js"),u=o(require("react")),b=o(require("../ShelfDisplay/index.js")),y=o(require("../AccordionCards/index.js")),h=o(require("../Faq/index.js")),g=o(require("../MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js")),k=o(require("../Title/index.js")),N=o(require("../Graphic/index.js"));const M=u.default.forwardRef(({data:e,className:r},s)=>{const{theme:l,shape:m,align:v,tabs:t=[],sectionTitle:T}=e,P=a=>a?.blockType==="ipc-shelfdisplay"?(0,i.jsx)(b.default,{data:a}):a?.blockType==="ipc-multiLayoutGraphicBlock"?(0,i.jsx)(g.default,{data:a}):a?.blockType==="ipc-accordioncards"?(0,i.jsx)(y.default,{data:a}):a?.blockType==="ipc-faq"?(0,i.jsx)(h.default,{data:a}):a?.blockType==="ipc-graphic"?(0,i.jsx)(N.default,{data:a}):null;return(0,i.jsxs)("section",{ref:s,className:(0,d.cn)(l==="dark"?"aiui-dark":"",r),children:[T&&(0,i.jsx)(k.default,{className:"section-title",data:{title:T}}),(0,i.jsxs)(c.Tabs,{shape:m,align:v,defaultValue:t?.[0]?.id||t?.[0]?.tabName,children:[Array.isArray(t)&&t.length>1&&(0,i.jsx)(c.TabsList,{className:"tabs-list",children:t.map(a=>(0,i.jsx)(c.TabsTrigger,{value:a.id||a.tabName,className:"tabs-trigger",children:a.tabName},a.id||a.tabName))}),(Array.isArray(t)?t:[])?.map(a=>(0,i.jsx)(c.TabsContent,{value:a.id||a.tabName,className:`tabs-content ${t?.length>1?"mt-[24px]":""}`,children:a.tabContent?.[0]?P(a.tabContent?.[0]):null},a.id||a.tabName))]})]})});var R=(0,n.withLayout)(M);
|
|
2
2
|
//# sourceMappingURL=Tabs.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Tabs/Tabs.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport { withLayout } from '../../shared/Styles.js'\nimport * as TabsPrimitive from '../../components/tabs.js'\nimport { cn } from '../../helpers/index.js'\nimport type { TabsProps } from './types.js'\nimport React from 'react'\nimport ShelfDisplay from '../ShelfDisplay/index.js'\nimport AccordionCards from '../AccordionCards/index.js'\nimport Faq from '../Faq/index.js'\nimport MultiLayoutGraphicBlock from '../MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js'\nimport Title from '../Title/index.js'\nimport Graphic from '../Graphic/index.js'\n\nconst Tabs = React.forwardRef<HTMLDivElement, TabsProps>(({ data, className }, forwardedRef) => {\n const { theme, shape, align, tabs = [], sectionTitle } = data\n\n const renderTabContent = (tabContent: TabsProps['data']['tabs'][number]['tabContent'][number]) => {\n if (tabContent?.blockType === 'ipc-shelfdisplay') {\n return <ShelfDisplay data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-multiLayoutGraphicBlock') {\n return <MultiLayoutGraphicBlock data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-accordioncards') {\n return <AccordionCards data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-faq') {\n return <Faq data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-graphic') {\n return <Graphic data={tabContent} />\n } else {\n return null\n }\n }\n\n return (\n <section ref={forwardedRef} className={cn(theme === 'dark' ? 'aiui-dark' : '', className)}>\n {sectionTitle && <Title className=\"section-title\" data={{ title: sectionTitle }} />}\n <TabsPrimitive.Tabs shape={shape} align={align} defaultValue={tabs?.[0]?.id || tabs?.[0]?.tabName}>\n {/* <TabsPrimitive.TabsList className=\"tabs-list\">\n {(Array.isArray(tabs) ? tabs : [])?.map(tab => (\n <TabsPrimitive.TabsTrigger\n key={tab.id || tab.tabName}\n value={tab.id || tab.tabName}\n className=\"tabs-trigger\"\n >\n {tab.tabName}\n </TabsPrimitive.TabsTrigger>\n ))}\n </TabsPrimitive.TabsList> */}\n {/* Tab\u4E3A1\u65F6\uFF0C\u4E0D\u5C55\u793Atab\u6309\u94AE */}\n {Array.isArray(tabs) && tabs.length > 1 && (\n <TabsPrimitive.TabsList className=\"tabs-list\">\n {tabs.map(tab => (\n <TabsPrimitive.TabsTrigger\n key={tab.id || tab.tabName}\n value={tab.id || tab.tabName}\n className=\"tabs-trigger\"\n >\n {tab.tabName}\n </TabsPrimitive.TabsTrigger>\n ))}\n </TabsPrimitive.TabsList>\n )}\n {(Array.isArray(tabs) ? tabs : [])?.map((tab: any) => (\n <TabsPrimitive.TabsContent\n key={tab.id || tab.tabName}\n value={tab.id || tab.tabName}\n className
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAkBa,IAAAI,EAAA,6BAjBbC,EAA2B,kCAC3BC,EAA+B,uCAC/BC,EAAmB,kCAEnBC,EAAkB,oBAClBC,EAAyB,uCACzBC,EAA2B,yCAC3BC,EAAgB,8BAChBC,EAAoC,oEACpCC,EAAkB,gCAClBC,EAAoB,kCAEpB,MAAMC,EAAO,EAAAC,QAAM,WAAsC,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAGC,IAAiB,CAC9F,KAAM,CAAE,MAAAC,EAAO,MAAAC,EAAO,MAAAC,EAAO,KAAAC,EAAO,CAAC,EAAG,aAAAC,CAAa,EAAIP,EAEnDQ,EAAoBC,GACpBA,GAAY,YAAc,sBACrB,OAAC,EAAAC,QAAA,CAAa,KAAMD,EAAY,EAC9BA,GAAY,YAAc,iCAC5B,OAAC,EAAAE,QAAA,CAAwB,KAAMF,EAAY,EACzCA,GAAY,YAAc,wBAC5B,OAAC,EAAAG,QAAA,CAAe,KAAMH,EAAY,EAChCA,GAAY,YAAc,aAC5B,OAAC,EAAAI,QAAA,CAAI,KAAMJ,EAAY,EACrBA,GAAY,YAAc,iBAC5B,OAAC,EAAAK,QAAA,CAAQ,KAAML,EAAY,EAE3B,KAIX,SACE,QAAC,WAAQ,IAAKP,EAAc,aAAW,MAAGC,IAAU,OAAS,YAAc,GAAIF,CAAS,EACrF,UAAAM,MAAgB,OAAC,EAAAQ,QAAA,CAAM,UAAU,gBAAgB,KAAM,CAAE,MAAOR,CAAa,EAAG,KACjF,QAAClB,EAAc,KAAd,CAAmB,MAAOe,EAAO,MAAOC,EAAO,aAAcC,IAAO,CAAC,GAAG,IAAMA,IAAO,CAAC,GAAG,QAavF,gBAAM,QAAQA,CAAI,GAAKA,EAAK,OAAS,MACpC,OAACjB,EAAc,SAAd,CAAuB,UAAU,YAC/B,SAAAiB,EAAK,IAAIU,MACR,OAAC3B,EAAc,YAAd,CAEC,MAAO2B,EAAI,IAAMA,EAAI,QACrB,UAAU,eAET,SAAAA,EAAI,SAJAA,EAAI,IAAMA,EAAI,OAKrB,CACD,EACH,GAEA,MAAM,QAAQV,CAAI,EAAIA,EAAO,CAAC,IAAI,IAAKU,MACvC,OAAC3B,EAAc,YAAd,CAEC,MAAO2B,EAAI,IAAMA,EAAI,QACrB,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport { withLayout } from '../../shared/Styles.js'\nimport * as TabsPrimitive from '../../components/tabs.js'\nimport { cn } from '../../helpers/index.js'\nimport type { TabsProps } from './types.js'\nimport React from 'react'\nimport ShelfDisplay from '../ShelfDisplay/index.js'\nimport AccordionCards from '../AccordionCards/index.js'\nimport Faq from '../Faq/index.js'\nimport MultiLayoutGraphicBlock from '../MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js'\nimport Title from '../Title/index.js'\nimport Graphic from '../Graphic/index.js'\n\nconst Tabs = React.forwardRef<HTMLDivElement, TabsProps>(({ data, className }, forwardedRef) => {\n const { theme, shape, align, tabs = [], sectionTitle } = data\n\n const renderTabContent = (tabContent: TabsProps['data']['tabs'][number]['tabContent'][number]) => {\n if (tabContent?.blockType === 'ipc-shelfdisplay') {\n return <ShelfDisplay data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-multiLayoutGraphicBlock') {\n return <MultiLayoutGraphicBlock data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-accordioncards') {\n return <AccordionCards data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-faq') {\n return <Faq data={tabContent} />\n } else if (tabContent?.blockType === 'ipc-graphic') {\n return <Graphic data={tabContent} />\n } else {\n return null\n }\n }\n\n return (\n <section ref={forwardedRef} className={cn(theme === 'dark' ? 'aiui-dark' : '', className)}>\n {sectionTitle && <Title className=\"section-title\" data={{ title: sectionTitle }} />}\n <TabsPrimitive.Tabs shape={shape} align={align} defaultValue={tabs?.[0]?.id || tabs?.[0]?.tabName}>\n {/* <TabsPrimitive.TabsList className=\"tabs-list\">\n {(Array.isArray(tabs) ? tabs : [])?.map(tab => (\n <TabsPrimitive.TabsTrigger\n key={tab.id || tab.tabName}\n value={tab.id || tab.tabName}\n className=\"tabs-trigger\"\n >\n {tab.tabName}\n </TabsPrimitive.TabsTrigger>\n ))}\n </TabsPrimitive.TabsList> */}\n {/* Tab\u4E3A1\u65F6\uFF0C\u4E0D\u5C55\u793Atab\u6309\u94AE */}\n {Array.isArray(tabs) && tabs.length > 1 && (\n <TabsPrimitive.TabsList className=\"tabs-list\">\n {tabs.map(tab => (\n <TabsPrimitive.TabsTrigger\n key={tab.id || tab.tabName}\n value={tab.id || tab.tabName}\n className=\"tabs-trigger\"\n >\n {tab.tabName}\n </TabsPrimitive.TabsTrigger>\n ))}\n </TabsPrimitive.TabsList>\n )}\n {(Array.isArray(tabs) ? tabs : [])?.map((tab: any) => (\n <TabsPrimitive.TabsContent\n key={tab.id || tab.tabName}\n value={tab.id || tab.tabName}\n className={`tabs-content ${tabs?.length > 1 ? 'mt-[24px]' : ''}`}\n >\n {tab.tabContent?.[0] ? renderTabContent(tab.tabContent?.[0]) : null}\n </TabsPrimitive.TabsContent>\n ))}\n </TabsPrimitive.Tabs>\n </section>\n )\n})\n\nexport default withLayout(Tabs)\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAkBa,IAAAI,EAAA,6BAjBbC,EAA2B,kCAC3BC,EAA+B,uCAC/BC,EAAmB,kCAEnBC,EAAkB,oBAClBC,EAAyB,uCACzBC,EAA2B,yCAC3BC,EAAgB,8BAChBC,EAAoC,oEACpCC,EAAkB,gCAClBC,EAAoB,kCAEpB,MAAMC,EAAO,EAAAC,QAAM,WAAsC,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAGC,IAAiB,CAC9F,KAAM,CAAE,MAAAC,EAAO,MAAAC,EAAO,MAAAC,EAAO,KAAAC,EAAO,CAAC,EAAG,aAAAC,CAAa,EAAIP,EAEnDQ,EAAoBC,GACpBA,GAAY,YAAc,sBACrB,OAAC,EAAAC,QAAA,CAAa,KAAMD,EAAY,EAC9BA,GAAY,YAAc,iCAC5B,OAAC,EAAAE,QAAA,CAAwB,KAAMF,EAAY,EACzCA,GAAY,YAAc,wBAC5B,OAAC,EAAAG,QAAA,CAAe,KAAMH,EAAY,EAChCA,GAAY,YAAc,aAC5B,OAAC,EAAAI,QAAA,CAAI,KAAMJ,EAAY,EACrBA,GAAY,YAAc,iBAC5B,OAAC,EAAAK,QAAA,CAAQ,KAAML,EAAY,EAE3B,KAIX,SACE,QAAC,WAAQ,IAAKP,EAAc,aAAW,MAAGC,IAAU,OAAS,YAAc,GAAIF,CAAS,EACrF,UAAAM,MAAgB,OAAC,EAAAQ,QAAA,CAAM,UAAU,gBAAgB,KAAM,CAAE,MAAOR,CAAa,EAAG,KACjF,QAAClB,EAAc,KAAd,CAAmB,MAAOe,EAAO,MAAOC,EAAO,aAAcC,IAAO,CAAC,GAAG,IAAMA,IAAO,CAAC,GAAG,QAavF,gBAAM,QAAQA,CAAI,GAAKA,EAAK,OAAS,MACpC,OAACjB,EAAc,SAAd,CAAuB,UAAU,YAC/B,SAAAiB,EAAK,IAAIU,MACR,OAAC3B,EAAc,YAAd,CAEC,MAAO2B,EAAI,IAAMA,EAAI,QACrB,UAAU,eAET,SAAAA,EAAI,SAJAA,EAAI,IAAMA,EAAI,OAKrB,CACD,EACH,GAEA,MAAM,QAAQV,CAAI,EAAIA,EAAO,CAAC,IAAI,IAAKU,MACvC,OAAC3B,EAAc,YAAd,CAEC,MAAO2B,EAAI,IAAMA,EAAI,QACrB,UAAW,gBAAgBV,GAAM,OAAS,EAAI,YAAc,EAAE,GAE7D,SAAAU,EAAI,aAAa,CAAC,EAAIR,EAAiBQ,EAAI,aAAa,CAAC,CAAC,EAAI,MAJ1DA,EAAI,IAAMA,EAAI,OAKrB,CACD,GACH,GACF,CAEJ,CAAC,EAED,IAAO/B,KAAQ,cAAWa,CAAI",
|
|
6
6
|
"names": ["Tabs_exports", "__export", "Tabs_default", "__toCommonJS", "import_jsx_runtime", "import_Styles", "TabsPrimitive", "import_helpers", "import_react", "import_ShelfDisplay", "import_AccordionCards", "import_Faq", "import_MultiLayoutGraphicBlock", "import_Title", "import_Graphic", "Tabs", "React", "data", "className", "forwardedRef", "theme", "shape", "align", "tabs", "sectionTitle", "renderTabContent", "tabContent", "ShelfDisplay", "MultiLayoutGraphicBlock", "AccordionCards", "Faq", "Graphic", "Title", "tab"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{Fragment as d,jsx as t,jsxs as p}from"react/jsx-runtime";import"../../helpers/utils.js";import{withLayout as n}from"../../shared/Styles.js";import{Text as l,Link as x}from"../../components/index.js";const r=a=>{const{data:o}=a,{list:s}=o;return t(d,{children:t("div",{className:"flex w-full flex-col gap-[12px]
|
|
1
|
+
"use client";import{Fragment as d,jsx as t,jsxs as p}from"react/jsx-runtime";import"../../helpers/utils.js";import{withLayout as n}from"../../shared/Styles.js";import{Text as l,Link as x}from"../../components/index.js";const r=a=>{const{data:o}=a,{list:s}=o;return t(d,{children:t("div",{className:"rounded-box flex w-full flex-col gap-[12px] bg-[#EAEAEC] p-[12px]",children:s?.map((e,i)=>t("div",{className:"w-full",children:p(x,{href:e?.link,target:"_blank",className:"flex w-full items-center justify-between px-[24px] py-[12px]",children:[p("div",{className:"laptop:gap-[24px] flex flex-row items-center gap-[12px]",children:[t(l,{html:e?.title,className:"laptop:text-[16px] text-[14px] font-bold leading-[1.4]"}),e?.text&&t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"2",height:"17",viewBox:"0 0 2 17",fill:"none",children:t("path",{d:"M1 0.5V16.5",stroke:"#3D3D3F"})}),t(l,{html:e?.text,className:"laptop:text-[16px] text-[14px] font-bold leading-[1.4]"})]}),p("div",{className:"laptop:gap-[24px] flex flex-row items-center justify-center gap-[4px]",children:[t(l,{html:e?.time,className:"laptop:text-[16px] text-[14px] font-bold leading-[1.4]"}),t("svg",{className:"icon",xmlns:"http://www.w3.org/2000/svg",width:"24",height:"25",viewBox:"0 0 24 25",fill:"none",children:t("path",{d:"M21 11.5C21.5523 11.5 22 11.9477 22 12.5V18.5C22 20.1569 20.6569 21.5 19 21.5H5C3.34315 21.5 2 20.1569 2 18.5V12.5C2 11.9477 2.44772 11.5 3 11.5C3.55228 11.5 4 11.9477 4 12.5V18.5C4 19.0523 4.44772 19.5 5 19.5H19C19.5523 19.5 20 19.0523 20 18.5V12.5C20 11.9477 20.4477 11.5 21 11.5ZM12.0039 2.25391C12.5562 2.25391 13.0039 2.70162 13.0039 3.25391V13.4736L16.4893 9.98828C16.8798 9.59777 17.5128 9.59779 17.9033 9.98828C18.2938 10.3788 18.2938 11.0118 17.9033 11.4023L13.4541 15.8516C12.6471 16.6583 11.3392 16.6582 10.5322 15.8516L6.08984 11.4092C5.69932 11.0187 5.69932 10.3856 6.08984 9.99512C6.48037 9.60466 7.11341 9.60462 7.50391 9.99512L11.0039 13.4951V3.25391C11.0039 2.70162 11.4516 2.25391 12.0039 2.25391Z",fill:"currentColor"})})]})]})},i))})})};var C=n(r);export{C as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/DownLoad/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text, Link } from '../../components/index.js'\n\nexport type DownLoadDataType = {\n title: string\n text: string\n time: string\n link: string\n line: Img\n icon: Img\n}\n\ntype DownLoadType = {\n data: {\n list: DownLoadDataType[]\n }\n className?: string\n}\n\nconst DownLoad = (props: DownLoadType) => {\n const { data } = props\n const { list } = data\n\n return (\n <>\n <div className=\"flex w-full flex-col gap-[12px]
|
|
4
|
+
"sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text, Link } from '../../components/index.js'\n\nexport type DownLoadDataType = {\n title: string\n text: string\n time: string\n link: string\n line: Img\n icon: Img\n}\n\ntype DownLoadType = {\n data: {\n list: DownLoadDataType[]\n }\n className?: string\n}\n\nconst DownLoad = (props: DownLoadType) => {\n const { data } = props\n const { list } = data\n\n return (\n <>\n <div className=\"rounded-box flex w-full flex-col gap-[12px] bg-[#EAEAEC] p-[12px]\">\n {list?.map((item, index) => (\n <div key={index} className=\"w-full\">\n <Link\n href={item?.link}\n target=\"_blank\"\n className=\"flex w-full items-center justify-between px-[24px] py-[12px]\"\n >\n <div className=\"laptop:gap-[24px] flex flex-row items-center gap-[12px]\">\n <Text html={item?.title} className=\"laptop:text-[16px] text-[14px] font-bold leading-[1.4]\" />\n {/* <Picture\n className=\"h-[16px]\"\n source={item.line?.url}\n alt={item.line?.alt || ''}\n /> */}\n {item?.text && (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2\" height=\"17\" viewBox=\"0 0 2 17\" fill=\"none\">\n <path d=\"M1 0.5V16.5\" stroke=\"#3D3D3F\" />\n </svg>\n )}\n <Text html={item?.text} className=\"laptop:text-[16px] text-[14px] font-bold leading-[1.4]\" />\n </div>\n\n {/* <Link\n href={item?.link}\n target=\"_blank\"\n > */}\n <div className=\"laptop:gap-[24px] flex flex-row items-center justify-center gap-[4px]\">\n <Text html={item?.time} className=\"laptop:text-[16px] text-[14px] font-bold leading-[1.4]\" />\n {/* <Picture\n className=\"w-[24px]\"\n imgClassName=\"w-full h-auto\"\n source={item.icon?.url}\n alt={item.icon?.alt || ''}\n /> */}\n <svg\n className=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"25\"\n viewBox=\"0 0 24 25\"\n fill=\"none\"\n >\n <path\n d=\"M21 11.5C21.5523 11.5 22 11.9477 22 12.5V18.5C22 20.1569 20.6569 21.5 19 21.5H5C3.34315 21.5 2 20.1569 2 18.5V12.5C2 11.9477 2.44772 11.5 3 11.5C3.55228 11.5 4 11.9477 4 12.5V18.5C4 19.0523 4.44772 19.5 5 19.5H19C19.5523 19.5 20 19.0523 20 18.5V12.5C20 11.9477 20.4477 11.5 21 11.5ZM12.0039 2.25391C12.5562 2.25391 13.0039 2.70162 13.0039 3.25391V13.4736L16.4893 9.98828C16.8798 9.59777 17.5128 9.59779 17.9033 9.98828C18.2938 10.3788 18.2938 11.0118 17.9033 11.4023L13.4541 15.8516C12.6471 16.6583 11.3392 16.6582 10.5322 15.8516L6.08984 11.4092C5.69932 11.0187 5.69932 10.3856 6.08984 9.99512C6.48037 9.60466 7.11341 9.60462 7.50391 9.99512L11.0039 13.4951V3.25391C11.0039 2.70162 11.4516 2.25391 12.0039 2.25391Z\"\n fill=\"currentColor\"\n />\n </svg>\n </div>\n\n {/* </Link> */}\n </Link>\n </div>\n ))}\n </div>\n </>\n )\n}\n\nexport default withLayout(DownLoad)\n"],
|
|
5
5
|
"mappings": "aA2BI,mBAAAA,EAUY,OAAAC,EADF,QAAAC,MATV,oBA1BJ,MAAmB,yBAEnB,OAAS,cAAAC,MAAkB,yBAC3B,OAAkB,QAAAC,EAAM,QAAAC,MAAY,4BAkBpC,MAAMC,EAAYC,GAAwB,CACxC,KAAM,CAAE,KAAAC,CAAK,EAAID,EACX,CAAE,KAAAE,CAAK,EAAID,EAEjB,OACEP,EAAAD,EAAA,CACE,SAAAC,EAAC,OAAI,UAAU,oEACZ,SAAAQ,GAAM,IAAI,CAACC,EAAMC,IAChBV,EAAC,OAAgB,UAAU,SACzB,SAAAC,EAACG,EAAA,CACC,KAAMK,GAAM,KACZ,OAAO,SACP,UAAU,+DAEV,UAAAR,EAAC,OAAI,UAAU,0DACb,UAAAD,EAACG,EAAA,CAAK,KAAMM,GAAM,MAAO,UAAU,yDAAyD,EAM3FA,GAAM,MACLT,EAAC,OAAI,MAAM,6BAA6B,MAAM,IAAI,OAAO,KAAK,QAAQ,WAAW,KAAK,OACpF,SAAAA,EAAC,QAAK,EAAE,cAAc,OAAO,UAAU,EACzC,EAEFA,EAACG,EAAA,CAAK,KAAMM,GAAM,KAAM,UAAU,yDAAyD,GAC7F,EAMAR,EAAC,OAAI,UAAU,wEACb,UAAAD,EAACG,EAAA,CAAK,KAAMM,GAAM,KAAM,UAAU,yDAAyD,EAO3FT,EAAC,OACC,UAAU,OACV,MAAM,6BACN,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,SAAAA,EAAC,QACC,EAAE,8sBACF,KAAK,eACP,EACF,GACF,GAGF,GAjDQU,CAkDV,CACD,EACH,EACF,CAEJ,EAEA,IAAOC,EAAQT,EAAWG,CAAQ",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "withLayout", "Text", "Link", "DownLoad", "props", "data", "list", "item", "index", "DownLoad_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{Fragment as x,jsx as t,jsxs as
|
|
1
|
+
"use client";import{Fragment as x,jsx as t,jsxs as s}from"react/jsx-runtime";import"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as d}from"../../shared/Styles.js";import{Picture as p,Text as a}from"../../components/index.js";const n=i=>{const{data:l,className:g}=i,{list:r}=l;return t(x,{children:s("div",{className:"",children:[l?.title&&t("div",{className:"desktop:w-[800px] pb-[24px]",children:t(a,{html:l?.title,className:" desktop:!text-[32px] lg-desktop:text-lg line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold"})}),l?.img?.url&&t(p,{className:"md-tablet:hidden aspect-[1664/560] rounded-2xl",imgClassName:"",source:l?.img?.url,alt:l?.img?.alt||""}),l?.mobileImg?.url&&t(p,{className:"tablet:hidden aspect-[358/360] rounded-2xl",imgClassName:"",source:l?.mobileImg?.url,alt:l?.mobileImg?.alt||""}),t("div",{className:"",children:t("div",{className:"flex flex-col gap-0",children:r.map((e,o)=>s("div",{className:`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${o%2===0?"laptop:flex-row-reverse":""}`,children:[s("div",{className:"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center",children:[t(a,{html:e?.title,className:"graphic-title desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold"}),t(a,{html:e?.description,className:"graphic-title desktop:pt-[8px] lg-desktop:text-[18px] desktop:text-[16px] pt-[4px] text-[14px] leading-[1.2] [&_*_strong]:!font-bold"}),e?.numberOne&&s("div",{className:"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]",children:[s("div",{className:"",children:[t(a,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:e?.numberOne,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),t(a,{html:e?.textOne,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]}),s("div",{children:[t(a,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:e?.numberTwo,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),t(a,{html:e?.textTwo,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]})]}),e?.icon?.url&&t("div",{className:"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]",children:t(p,{className:"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]",source:e?.icon?.url,alt:e?.icon?.alt||""})})]}),t("div",{className:"md-tablet:hidden laptop:mt-[24px] desktop:pt-0 mt-[24px] aspect-[964/560] overflow-hidden rounded-2xl",children:t(p,{className:"size-full object-cover ",source:e?.img?.url,alt:e?.img?.alt||""})}),t("div",{className:"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl",children:t(p,{className:"size-full object-cover",source:e?.mobileImg?.url,alt:e?.mobileImg?.alt||""})})]},o))})})]})})};var f=d(n);export{f as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Features/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'\nexport type FeaturesDataType = {\n img: Img\n mobileImg: Img\n title: string\n description: string\n numberOne: string\n textOne: string\n numberTwo: string\n textTwo: string\n icon: Img\n}\ntype FeaturesType = {\n data: {\n title: string\n img: Img\n mobileImg: Img\n list: FeaturesDataType[]\n }\n className?: string\n}\n\nconst Features = (props: FeaturesType) => {\n const { data, className } = props\n const { list } = data\n\n return (\n <>\n <div className=\"\">\n {data?.title && (\n <div className=\"desktop:w-[800px] pb-[24px]\">\n <Text\n html={data?.title}\n className=\" desktop:!text-[32px] lg-desktop:text-lg line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold\"\n />\n </div>\n )}\n {data?.img?.url && (\n <Picture\n className=\"md-tablet:hidden aspect-[1664/560] rounded-2xl\"\n imgClassName=\"\"\n source={data?.img?.url}\n alt={data?.img?.alt || ''}\n />\n )}\n {data?.mobileImg?.url && (\n <Picture\n className=\"tablet:hidden aspect-[358/360] rounded-2xl\"\n imgClassName=\"\"\n source={data?.mobileImg?.url}\n alt={data?.mobileImg?.alt || ''}\n />\n )}\n <div className=\"\">\n <div className=\"flex flex-col gap-
|
|
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'\nexport type FeaturesDataType = {\n img: Img\n mobileImg: Img\n title: string\n description: string\n numberOne: string\n textOne: string\n numberTwo: string\n textTwo: string\n icon: Img\n}\ntype FeaturesType = {\n data: {\n title: string\n img: Img\n mobileImg: Img\n list: FeaturesDataType[]\n }\n className?: string\n}\n\nconst Features = (props: FeaturesType) => {\n const { data, className } = props\n const { list } = data\n\n return (\n <>\n <div className=\"\">\n {data?.title && (\n <div className=\"desktop:w-[800px] pb-[24px]\">\n <Text\n html={data?.title}\n className=\" desktop:!text-[32px] lg-desktop:text-lg line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold\"\n />\n </div>\n )}\n {data?.img?.url && (\n <Picture\n className=\"md-tablet:hidden aspect-[1664/560] rounded-2xl\"\n imgClassName=\"\"\n source={data?.img?.url}\n alt={data?.img?.alt || ''}\n />\n )}\n {data?.mobileImg?.url && (\n <Picture\n className=\"tablet:hidden aspect-[358/360] rounded-2xl\"\n imgClassName=\"\"\n source={data?.mobileImg?.url}\n alt={data?.mobileImg?.alt || ''}\n />\n )}\n <div className=\"\">\n <div className=\"flex flex-col gap-0\">\n {list.map((item, index) => (\n <div\n key={index}\n className={`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${index % 2 === 0 ? 'laptop:flex-row-reverse' : ''}`}\n >\n <div className=\"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center\">\n <Text\n html={item?.title}\n className=\"graphic-title desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold\"\n />\n <Text\n html={item?.description}\n className=\"graphic-title desktop:pt-[8px] lg-desktop:text-[18px] desktop:text-[16px] pt-[4px] text-[14px] leading-[1.2] [&_*_strong]:!font-bold\"\n />\n {/* \u6E10\u53D8\u8272 */}\n {item?.numberOne && (\n <div className=\"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]\">\n <div className=\"\">\n <Text\n style={{\n background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n backgroundClip: 'text',\n WebkitBackgroundClip: 'text',\n WebkitTextFillColor: 'transparent',\n color: 'transparent', // \u5EFA\u8BAE\u52A0\u4E0A\uFF0C\u517C\u5BB9\u90E8\u5206\u6D4F\u89C8\u5668\n }}\n html={item?.numberOne}\n className=\"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold\"\n />\n <Text\n html={item?.textOne}\n className=\"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold\"\n />\n </div>\n <div>\n <Text\n style={{\n background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n backgroundClip: 'text',\n WebkitBackgroundClip: 'text',\n WebkitTextFillColor: 'transparent',\n color: 'transparent', // \u5EFA\u8BAE\u52A0\u4E0A\uFF0C\u517C\u5BB9\u90E8\u5206\u6D4F\u89C8\u5668\n }}\n html={item?.numberTwo}\n className=\"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold\"\n />\n <Text\n html={item?.textTwo}\n className=\"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold\"\n />\n </div>\n </div>\n )}\n {item?.icon?.url && (\n <div className=\"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]\">\n <Picture\n className=\"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]\"\n source={item?.icon?.url}\n alt={item?.icon?.alt || ''}\n />\n </div>\n )}\n </div>\n <div className=\"md-tablet:hidden laptop:mt-[24px] desktop:pt-0 mt-[24px] aspect-[964/560] overflow-hidden rounded-2xl\">\n <Picture className=\"size-full object-cover \" source={item?.img?.url} alt={item?.img?.alt || ''} />\n </div>\n <div className=\"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl\">\n <Picture\n className=\"size-full object-cover\"\n source={item?.mobileImg?.url}\n alt={item?.mobileImg?.alt || ''}\n />\n </div>\n </div>\n ))}\n </div>\n </div>\n </div>\n </>\n )\n}\n\nexport default withLayout(Features)\n"],
|
|
5
5
|
"mappings": "aAgCI,mBAAAA,EAIQ,OAAAC,EAyCU,QAAAC,MA7ClB,oBA/BJ,MAAmB,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAsB9B,MAAMC,EAAYC,GAAwB,CACxC,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,OACEP,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,UAAU,GACZ,UAAAM,GAAM,OACLP,EAAC,OAAI,UAAU,8BACb,SAAAA,EAACI,EAAA,CACC,KAAMG,GAAM,MACZ,UAAU,4GACZ,EACF,EAEDA,GAAM,KAAK,KACVP,EAACG,EAAA,CACC,UAAU,iDACV,aAAa,GACb,OAAQI,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,KAChBP,EAACG,EAAA,CACC,UAAU,6CACV,aAAa,GACb,OAAQI,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,EAEFP,EAAC,OAAI,UAAU,GACb,SAAAA,EAAC,OAAI,UAAU,sBACZ,SAAAS,EAAK,IAAI,CAACC,EAAMC,IACfV,EAAC,OAEC,UAAW,+DAA+DU,EAAQ,IAAM,EAAI,0BAA4B,EAAE,GAE1H,UAAAV,EAAC,OAAI,UAAU,+EACb,UAAAD,EAACI,EAAA,CACC,KAAMM,GAAM,MACZ,UAAU,oGACZ,EACAV,EAACI,EAAA,CACC,KAAMM,GAAM,YACZ,UAAU,uIACZ,EAECA,GAAM,WACLT,EAAC,OAAI,UAAU,2FACb,UAAAA,EAAC,OAAI,UAAU,GACb,UAAAD,EAACI,EAAA,CACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMM,GAAM,UACZ,UAAU,kGACZ,EACAV,EAACI,EAAA,CACC,KAAMM,GAAM,QACZ,UAAU,sHACZ,GACF,EACAT,EAAC,OACC,UAAAD,EAACI,EAAA,CACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMM,GAAM,UACZ,UAAU,kGACZ,EACAV,EAACI,EAAA,CACC,KAAMM,GAAM,QACZ,UAAU,sHACZ,GACF,GACF,EAEDA,GAAM,MAAM,KACXV,EAAC,OAAI,UAAU,mDACb,SAAAA,EAACG,EAAA,CACC,UAAU,mDACV,OAAQO,GAAM,MAAM,IACpB,IAAKA,GAAM,MAAM,KAAO,GAC1B,EACF,GAEJ,EACAV,EAAC,OAAI,UAAU,wGACb,SAAAA,EAACG,EAAA,CAAQ,UAAU,0BAA0B,OAAQO,GAAM,KAAK,IAAK,IAAKA,GAAM,KAAK,KAAO,GAAI,EAClG,EACAV,EAAC,OAAI,UAAU,uEACb,SAAAA,EAACG,EAAA,CACC,UAAU,yBACV,OAAQO,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,EACF,IAtEKC,CAuEP,CACD,EACH,EACF,GACF,EACF,CAEJ,EAEA,IAAOC,EAAQV,EAAWG,CAAQ",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "withLayout", "Picture", "Text", "Features", "props", "data", "className", "list", "item", "index", "Features_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{Fragment as g,jsx as t,jsxs as l}from"react/jsx-runtime";import{cn as o}from"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as c}from"../../shared/Styles.js";import{Grid as x,GridItem as f}from"../../components/gird.js";import{Picture as i,Text as a}from"../../components/index.js";const u=p=>{const{data:m,className:n}=p,{productsTab:d,shape:s}=m;return l(g,{children:[t("div",{className:o("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]"),children:t(x,{className:o("tablet:gap-4 grid grid-cols-12 gap-3 ",n),children:d?.map((e,r)=>l(f,{span:e.span,className:o("text-info-primary relative w-full overflow-hidden",s==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":e
|
|
1
|
+
"use client";import{Fragment as g,jsx as t,jsxs as l}from"react/jsx-runtime";import{cn as o}from"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as c}from"../../shared/Styles.js";import{Grid as x,GridItem as f}from"../../components/gird.js";import{Picture as i,Text as a}from"../../components/index.js";const u=p=>{const{data:m,className:n}=p,{productsTab:d,shape:s}=m;return l(g,{children:[t("div",{className:o("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]"),children:t(x,{className:o("tablet:gap-4 grid grid-cols-12 gap-3 ",n),children:d?.map((e,r)=>l(f,{span:e.span,className:o("text-info-primary relative w-full overflow-hidden",s==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":e?.theme==="dark"}),children:[t(i,{source:e?.img?.url,className:"size-full",imgClassName:""}),l("div",{className:"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[e?.title&&t(a,{html:e?.title,as:"p",className:"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]"}),e?.description&&t(a,{html:e?.description,className:"desktop:text-lg line-clamp-2 text-sm font-bold"})]})]},r))})}),t("div",{className:"tablet:hidden block text-[#1D1D1F]",children:t("div",{className:" flex flex-wrap gap-[12px]",children:d?.map((e,r)=>l("div",{className:o("text-info-primary relative overflow-hidden",s==="rounded"?"rounded-xl":"rounded-none",{"aiui-dark":e?.theme==="dark"},e?.fullWidth==="true"?"w-full flex-none":" w-[calc(50%-6px)]"),children:[t(i,{source:e?.mobileImg?.url,className:"size-full",imgClassName:"h-full object-cover"}),l("div",{className:"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[e?.title&&t(a,{html:e?.title,as:"p",className:"line-clamp-3 text-xl font-bold leading-[1.2]"}),e?.description&&t(a,{html:e?.description,className:"line-clamp-2 text-xl font-bold"})]})]},r))})})]})};var w=c(u);export{w as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/GraphicMore/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 { Grid, GridItem } from '../../components/gird.js'\nimport { Picture, Text } from '../../components/index.js'\nexport type GraphicMoreDataType = {\n img: Img\n mobileImg: Img\n title: string\n description: string\n theme: 'light' | 'dark'\n fullWidth: 'true' | 'false'\n span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\ntype GraphicMoreType = {\n data: {\n shape?: 'rounded' | 'square'\n productsTab: GraphicMoreDataType[]\n }\n className?: string\n}\n\nconst GraphicMore = (props: GraphicMoreType) => {\n const { data, className } = props\n const { productsTab, shape } = data\n\n return (\n <>\n <div\n className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]')}\n >\n <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n {productsTab?.map((item, index) => {\n return (\n <GridItem\n key={index}\n span={item.span}\n className={cn(\n 'text-info-primary relative w-full overflow-hidden',\n shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n '',\n {\n 'aiui-dark': item
|
|
5
|
-
"mappings": "aA6BI,mBAAAA,EAmBY,OAAAC,EACA,QAAAC,MApBZ,oBA5BJ,OAAS,MAAAC,MAAU,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,QAAAC,EAAM,YAAAC,MAAgB,2BAC/B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAkB9B,MAAMC,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,YAAAG,EAAa,MAAAC,CAAM,EAAIH,EAE/B,OACET,EAAAF,EAAA,CACE,UAAAC,EAAC,OACC,UAAWE,EAAG,sBAAuB,sEAAsE,EAE3G,SAAAF,EAACI,EAAA,CAAK,UAAWF,EAAG,wCAAyCS,CAAS,EACnE,SAAAC,GAAa,IAAI,CAACE,EAAMC,IAErBd,EAACI,EAAA,CAEC,KAAMS,EAAK,KACX,UAAWZ,EACT,oDACAW,IAAU,UAAY,cAAgB,eACtC,GACA,CACE,YAAaC,
|
|
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 { Grid, GridItem } from '../../components/gird.js'\nimport { Picture, Text } from '../../components/index.js'\nexport type GraphicMoreDataType = {\n img: Img\n mobileImg: Img\n title: string\n description: string\n theme: 'light' | 'dark'\n fullWidth: 'true' | 'false'\n span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\ntype GraphicMoreType = {\n data: {\n shape?: 'rounded' | 'square'\n productsTab: GraphicMoreDataType[]\n }\n className?: string\n}\n\nconst GraphicMore = (props: GraphicMoreType) => {\n const { data, className } = props\n const { productsTab, shape } = data\n\n return (\n <>\n <div\n className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]')}\n >\n <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n {productsTab?.map((item, index) => {\n return (\n <GridItem\n key={index}\n span={item.span}\n className={cn(\n 'text-info-primary relative w-full overflow-hidden',\n shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n '',\n {\n 'aiui-dark': item?.theme === 'dark',\n }\n )}\n >\n <Picture source={item?.img?.url} className=\"size-full\" imgClassName=\"\" />\n <div className=\"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n {item?.title && (\n <Text\n html={item?.title}\n as=\"p\"\n className=\"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]\"\n />\n )}\n {item?.description && (\n <Text html={item?.description} className=\"desktop:text-lg line-clamp-2 text-sm font-bold\" />\n )}\n </div>\n </GridItem>\n )\n })}\n </Grid>\n </div>\n <div className=\"tablet:hidden block text-[#1D1D1F]\">\n <div className=\" flex flex-wrap gap-[12px]\">\n {productsTab?.map((it, ind) => {\n return (\n <div\n key={ind}\n className={cn(\n 'text-info-primary relative overflow-hidden',\n shape === 'rounded' ? 'rounded-xl' : 'rounded-none',\n { 'aiui-dark': it?.theme === 'dark' },\n it?.fullWidth === 'true'\n ? 'w-full flex-none' // \u5360\u6EE1\u6574\u884C\n : ' w-[calc(50%-6px)]' // \u666E\u901A\u5143\u7D20\n )}\n >\n <Picture source={it?.mobileImg?.url} className=\"size-full\" imgClassName=\"h-full object-cover\" />\n <div className=\"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n {it?.title && (\n <Text html={it?.title} as=\"p\" className=\"line-clamp-3 text-xl font-bold leading-[1.2]\" />\n )}\n {it?.description && <Text html={it?.description} className=\"line-clamp-2 text-xl font-bold\" />}\n </div>\n </div>\n )\n })}\n </div>\n </div>\n </>\n )\n}\n\nexport default withLayout(GraphicMore)\n"],
|
|
5
|
+
"mappings": "aA6BI,mBAAAA,EAmBY,OAAAC,EACA,QAAAC,MApBZ,oBA5BJ,OAAS,MAAAC,MAAU,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,QAAAC,EAAM,YAAAC,MAAgB,2BAC/B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAkB9B,MAAMC,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,YAAAG,EAAa,MAAAC,CAAM,EAAIH,EAE/B,OACET,EAAAF,EAAA,CACE,UAAAC,EAAC,OACC,UAAWE,EAAG,sBAAuB,sEAAsE,EAE3G,SAAAF,EAACI,EAAA,CAAK,UAAWF,EAAG,wCAAyCS,CAAS,EACnE,SAAAC,GAAa,IAAI,CAACE,EAAMC,IAErBd,EAACI,EAAA,CAEC,KAAMS,EAAK,KACX,UAAWZ,EACT,oDACAW,IAAU,UAAY,cAAgB,eACtC,GACA,CACE,YAAaC,GAAM,QAAU,MAC/B,CACF,EAEA,UAAAd,EAACM,EAAA,CAAQ,OAAQQ,GAAM,KAAK,IAAK,UAAU,YAAY,aAAa,GAAG,EACvEb,EAAC,OAAI,UAAU,+IACZ,UAAAa,GAAM,OACLd,EAACO,EAAA,CACC,KAAMO,GAAM,MACZ,GAAG,IACH,UAAU,0EACZ,EAEDA,GAAM,aACLd,EAACO,EAAA,CAAK,KAAMO,GAAM,YAAa,UAAU,iDAAiD,GAE9F,IAvBKC,CAwBP,CAEH,EACH,EACF,EACAf,EAAC,OAAI,UAAU,qCACb,SAAAA,EAAC,OAAI,UAAU,6BACZ,SAAAY,GAAa,IAAI,CAACI,EAAIC,IAEnBhB,EAAC,OAEC,UAAWC,EACT,6CACAW,IAAU,UAAY,aAAe,eACrC,CAAE,YAAaG,GAAI,QAAU,MAAO,EACpCA,GAAI,YAAc,OACd,mBACA,oBACN,EAEA,UAAAhB,EAACM,EAAA,CAAQ,OAAQU,GAAI,WAAW,IAAK,UAAU,YAAY,aAAa,sBAAsB,EAC9Ff,EAAC,OAAI,UAAU,sFACZ,UAAAe,GAAI,OACHhB,EAACO,EAAA,CAAK,KAAMS,GAAI,MAAO,GAAG,IAAI,UAAU,+CAA+C,EAExFA,GAAI,aAAehB,EAACO,EAAA,CAAK,KAAMS,GAAI,YAAa,UAAU,iCAAiC,GAC9F,IAhBKC,CAiBP,CAEH,EACH,EACF,GACF,CAEJ,EAEA,IAAOC,EAAQf,EAAWK,CAAW",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "cn", "withLayout", "Grid", "GridItem", "Picture", "Text", "GraphicMore", "props", "data", "className", "productsTab", "shape", "item", "index", "it", "ind", "GraphicMore_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Fragment as Te,jsx as e,jsxs as h}from"react/jsx-runtime";import{useAiuiContext as Z}from"../../../../AiuiProvider/index.js";import{Text as J,Picture as j,Badge as ie}from"../../../../../components/index.js";import{useCallback as L,useMemo as W,useState as P,forwardRef as Q,useRef as D,useEffect as B,useImperativeHandle as oe}from"react";import{Swiper as H,SwiperSlide as F}from"swiper/react";import{Navigation as Y,Mousewheel as X,Thumbs as O,Pagination as ee,Autoplay as re}from"swiper/modules";import{cn as k}from"../../../../../helpers/index.js";import{GalleryTabType as A}from"./types.js";import{Content as ne,List as se,Root as ce,Trigger as de}from"@radix-ui/react-tabs";import{useBizProductContext as K}from"../../../BizProductProvider.js";import{useVariantMedia as ue}from"../../../hooks/use-variant-media.js";import{SpecsModal as pe}from"./components/SpecsModal.js";import me from"./components/CompareModal.js";import{formatPrice as be}from"../../../utils/index.js";import{withLayout as ge}from"../../../../../shared/Styles.js";import{gaTrack as fe}from"../../../../../shared/track.js";import{ExposureDetector as ve}from"../../../../../components/index.js";import{debounce as te}from"es-toolkit";const ae=t=>h("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t,children:[e("rect",{x:"48",y:"48",width:"48",height:"48",rx:"24",transform:"rotate(-180 48 48)",fill:"white"}),e("path",{d:"M25.1035 16.8545C25.5372 16.3818 26.246 16.3818 26.6797 16.8545C27.1067 17.3201 27.1067 18.0706 26.6797 18.5361L21.668 24L26.6797 29.4639C27.1067 29.9294 27.1067 30.6799 26.6797 31.1455C26.246 31.6182 25.5372 31.6182 25.1035 31.1455L19.3203 24.8408C18.8933 24.3752 18.8933 23.6248 19.3203 23.1592L25.1035 16.8545Z",fill:"currentColor"})]}),le=t=>h("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t,children:[e("rect",{width:"48",height:"48",rx:"24",transform:"matrix(1 -8.74228e-08 -8.74228e-08 -1 0 48)",fill:"white"}),e("path",{d:"M22.8965 16.8545C22.4628 16.3818 21.754 16.3818 21.3203 16.8545C20.8933 17.3201 20.8933 18.0706 21.3203 18.5361L26.332 24L21.3203 29.4639C20.8933 29.9294 20.8933 30.6799 21.3203 31.1455C21.754 31.6182 22.4628 31.6182 22.8965 31.1455L28.6797 24.8408C29.1067 24.3752 29.1067 23.6248 28.6797 23.1592L22.8965 16.8545Z",fill:"currentColor"})]}),ye=()=>{const{copyWriting:t}=Z(),{product:c,variant:m,selectedOptions:C}=K(),b=ue({product:c,variant:m}),[u,w]=P(null),I=D(null),g=m?.metafields?.component?.custom_media_list;let r,x,S,G;g&&g?.available?(r=g?.product||[],x=g?.scenarios||[],S=g?.keyFeatures||[],G=g?.video||[]):(r=b?.productList,x=b?.sceneList,S=b?.keyFeaturesList,G=b?.videoList);const n=W(()=>[...r,...x,...G],[r,x,G]),p={productList:r,sceneList:x,keyFeaturesList:S,videoList:G},a=W(()=>{const i=c?.payload?.components?.find(f=>f.componentKey==="ProductGallery")?.data||[],s=m?.payload?.components?.find(f=>f.componentKey==="ProductGallery")?.data||[];return i?.map(f=>{const E=s?.find(z=>f?.galleries===z?.galleries);let V=p[f?.galleries]||[];if(E?.images&&Array.isArray(E.images)&&E.images.length>0){const z=E.images.map(d=>{const _=[];if(d.image_1920&&d.image_1920.trim()&&_.push(`${d.image_1920} 1920`),d.image_1440&&d.image_1440.trim()&&_.push(`${d.image_1440} 1440`),d.image_1024&&d.image_1024.trim()&&_.push(`${d.image_1024} 1024`),d.image_768&&d.image_768.trim()&&_.push(`${d.image_768} 767`),d.image_390&&d.image_390.trim()&&_.push(`${d.image_390} 390`),_.length>0){const U=_.join(", ");return{image:{url:U,altText:f.comment?.content||""},_fromImages:!0,_responsiveSource:U}}return null}).filter(d=>d!==null);z.length>0&&(V=z)}return{...f,galleries:V}}).filter(f=>f.galleries.length>0)},[m?.payload,p,c?.payload]),[y,l]=P(a?.[0]),[o,N]=P(0),[v,T]=P(null),M=L(()=>{const i=(o+1)%a.length;N(i),l(a[i]),T(0)},[o,a]),R=L(()=>{const i=o===0?a.length-1:o-1;N(i),l(a[i]);const s=a[i]?.galleries||[];T(s.length-1)},[o,a]);B(()=>{o!=null&&requestAnimationFrame(()=>{I.current?.scrollToTab(o)})},[o]),B(()=>{l(a[0]),N(0)},[m?.id]);const $=(i,s)=>{switch(i?.galleryTabType){case A.GALLERY_IMAGE_MAIN:return e(q,{...i,index:s,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});case A.GALLERY_IMAGE_FEATURES:return e(q,{...i,index:s,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});case A.GALLERY_IMAGE_SCENE:return e(q,{...i,index:s,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});case A.GALLERY_VIDEO:return e(xe,{...i,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});default:return null}};return e("div",{id:"ipc-product-gallery",children:h(ce,{className:"relative",value:y?.tabValue,defaultValue:a?.[0]?.tabValue,children:[e("div",{className:"tablet:h-[620px] laptop-md:rounded-2xl laptop-md:h-[560px] lg-desktop:h-[700px] laptop-md:relative h-[420px] overflow-hidden bg-[#EAEAEC] ",children:a.map((i,s)=>e(ne,{className:"h-full",value:i.tabValue,children:$(i,s)},i.tabValue))}),e(he,{ref:I,galleryTabs:a,activeGalleryTab:y,setActiveGalleryTab:l,setActiveTabIndex:N,setTargetSlideIndex:T})]})})},he=Q((t,c)=>{const{galleryTabs:m,activeGalleryTab:C,setActiveGalleryTab:b,setActiveTabIndex:u,setTargetSlideIndex:w}=t,{product:I}=K(),g=D(null),r=D(new Map),x=L(n=>{if(g.current){const p=g.current,a=n.currentTarget,y=a.offsetLeft-p.offsetWidth/2+a.offsetWidth/2;p.scrollTo({left:y,behavior:"smooth"})}},[]),S=L((n,p,a)=>{b(p),u(a),w(0),x(n)},[b,u,w,x]),G=L(n=>{if(g.current&&m[n]){const p=g.current,a=m[n],y=r.current.get(a.tabValue);if(y){const l=y.offsetLeft-p.offsetWidth/2+y.offsetWidth/2;p.scrollTo({left:l,behavior:"smooth"})}}},[m]);return oe(c,()=>({scrollToTab:G})),h("div",{className:"laptop:inset-x-16 tablet:mt-3 laptop-md:static absolute inset-x-4 bottom-4 z-[2] flex items-center justify-between",children:[e(se,{ref:g,className:"laptop:p-0 laptop-md:p-1 overflow-x-auto rounded-full bg-[#EAEAEC] p-1",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:e("div",{className:"whitespace-nowrap",children:m?.map((n,p)=>e(de,{ref:a=>{a?r.current.set(n.tabValue,a):r.current.delete(n.tabValue)},className:k("lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] rounded-full px-5 pb-[10px] pt-[11px] text-[14px] font-bold leading-tight",n.tabValue===C?.tabValue&&"bg-white"),onClick:a=>S(a,n,p),value:n.tabValue,children:n.tabLabel},n.tabValue+p))})}),e("div",{className:"laptop:gap-2 laptop:flex hidden",children:I.metafields?.global?.specifications&&h(Te,{children:[e(pe,{})," | ",e(me,{})]})})]})}),q=Q((t,c)=>{const{locale:m="us",copyWriting:C}=Z(),{variant:b,totalSavings:u}=K(),w=D(null),[I,g]=P(null),[r,x]=P(null),[S,G]=P([]),n=D(null),p=W(()=>{if(t?.galleryTabType===A.GALLERY_IMAGE_MAIN)return"size-[240px] mx-auto mt-[42px] tablet:mt-16 tablet:size-[420px] lg-desktop:size-[560px]";t?.galleryTabType===A.GALLERY_IMAGE_FEATURES||(t?.galleryTabType,A.GALLERY_IMAGE_SCENE)},[t?.galleryTabType]),a=L(()=>{r?.isBeginning?t.onPrevTab?.():r?.slidePrev()},[r,t]),y=L(()=>{r?.isEnd?t.onNextTab?.():r?.slideNext()},[r,t]);return B(()=>{r&&t.targetSlideIndex&&(r.slideTo(t.targetSlideIndex,0),t.onSlideChange?.())},[r,t.targetSlideIndex,t]),B(()=>{const l=()=>{if(!t?.comment?.content||!n.current)return;const v=n.current;v.textContent="Test";const M=v.offsetHeight*2+2,$=t.comment.content.replace(/<[^>]*>/g," ").replace(/\s+/g," ").trim().split(" "),i=[];let s="";for(let f=0;f<$.length;f++){const E=$[f],V=s?`${s} ${E}`:E;v.textContent=V,v.offsetHeight>M?s?(i.push(s),s=E):(i.push(E),s=""):s=V}s&&i.push(s),v.textContent="",G(i)},o=requestAnimationFrame(()=>{requestAnimationFrame(()=>{l()})}),N=()=>{l()};return window.addEventListener("resize",te(N,500)),()=>{cancelAnimationFrame(o),window.removeEventListener("resize",te(N,500))}},[t?.comment?.content]),h("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[e(H,{ref:c,className:"h-full",onSwiper:x,onTouchEnd:(l,o)=>{l.isBeginning&&l.swipeDirection==="prev"?a():l.isEnd&&l.swipeDirection==="next"&&y()},pagination:{clickable:!0,el:w.current},thumbs:{swiper:I},modules:[X,O,Y,ee],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:t?.galleries?.map((l,o)=>{const N=`${t.tabValue}-${o}`,v=()=>{fe({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${b.sku}`,component_type:"image",component_name:t?.tabLabel||"",position:o+1,creative_id:"",component_title:"",component_description:"",navigation:""}})},T=l?._responsiveSource||l?.image?.url||"";return e(F,{className:"h-full",children:e(ve,{onExposure:v,exposureKey:N,threshold:.5,duration:2e3,className:"h-full",children:e(j,{source:T,alt:l?.image?.altText,className:k("h-full",p),imgClassName:"object-cover h-full"})})},t?.id+"SwiperSlideItem"+o)})}),b.availableForSale&&!!u&&!t.index&&e(ie,{size:"lg",className:"bg-brand laptop:left-16 laptop:top-5 laptop-md:left-6 laptop-md:top-6 absolute left-4 top-3 z-[2] text-white",children:`${be({amount:u,currencyCode:b?.price?.currencyCode,locale:m})} ${C?.off}`}),e("div",{className:k("tablet:opacity-0 tablet:block tablet:absolute tablet:top-1/2 laptop:left-16 tablet:left-6 laptop-md:left-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:a,children:e(ae,{className:k("tablet:size-10 lg-desktop:size-12")})}),e("div",{className:k("tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 laptop:right-16 tablet:right-6 laptop-md:right-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:y,children:e(le,{className:k("tablet:size-10 lg-desktop:size-12")})}),h("div",{className:"tablet:bottom-[70px] tablet:flex laptop:inset-x-16 laptop-md:bottom-[20px] laptop-md:inset-x-6 absolute inset-x-4 bottom-[94px] z-10 items-center justify-between",children:[e("div",{className:"tablet:block hidden",children:e(H,{className:"flex items-center justify-between",onSwiper:g,spaceBetween:12,slidesPerView:6,freeMode:!0,watchSlidesProgress:!0,modules:[Y,O],children:t?.galleries?.map((l,o)=>e(F,{className:"[&.swiper-slide-thumb-active]:border-brand !w-auto cursor-pointer border border-transparent [&.swiper-slide-thumb-active]:rounded",children:e(j,{source:l.image?.url,alt:l.image?.altText,className:"lg-desktop:size-12 size-10 overflow-hidden rounded bg-white",imgClassName:"object-cover h-full"})},t?.id+"SwiperSlideThumbItem"+o))})}),!t?.index&&h("div",{className:"flex items-center gap-2",children:[e(j,{source:t?.comment?.avatar?.url,className:"laptop:size-10 size-8 shrink-0 rounded-full",imgClassName:"object-cover "}),h("div",{className:"relative max-w-[528px]",children:[e("div",{ref:n,className:"lg-desktop:text-base pointer-events-none text-sm font-bold text-[#1D1D1F] opacity-0",style:{visibility:"hidden"}}),e(H,{modules:[re],loop:S.length>1,className:"h-[44px]",direction:"vertical",autoplay:{delay:5e3,disableOnInteraction:!1},children:S.length>0?S.map((l,o)=>e(F,{children:e(J,{html:l,as:"div",className:"lg-desktop:text-base overflow-hidden text-sm font-bold text-[#1D1D1F]"})},o+"text-group")):e(F,{children:e(J,{as:"div",html:t?.comment?.content,className:"lg-desktop:text-base text-sm font-bold text-[#1D1D1F]"})})})]})]})]}),e("div",{ref:w,className:"tablet:hidden absolute inset-x-4 !bottom-[70px] z-10 text-center [&_.swiper-pagination-bullet-active]:!bg-[#1D1D1F] [&_.swiper-pagination-bullet]:bg-white [&_.swiper-pagination-bullet]:opacity-100"})]})}),xe=t=>{const[c,m]=P(null),C=L(()=>{c?.isBeginning?t.onPrevTab?.():c?.slidePrev()},[c,t]),b=L(()=>{c?.isEnd?t.onNextTab?.():c?.slideNext()},[c,t]);return B(()=>{c&&t.targetSlideIndex!==null&&t.targetSlideIndex!==void 0&&(c.slideTo(t.targetSlideIndex,0),t.onSlideChange?.())},[c,t.targetSlideIndex,t]),h("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[e(H,{className:"h-full",onSwiper:m,onTouchEnd:(u,w)=>{u.isBeginning&&u.swipeDirection==="prev"?C():u.isEnd&&u.swipeDirection==="next"&&b()},modules:[X,O,Y,ee],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:t?.galleries?.map((u,w)=>e(F,{className:"h-full",children:h("video",{controls:!0,className:"size-full object-cover",children:[e("track",{kind:"captions"}),e("source",{src:u?.sources?.[0]?.url,type:"video/mp4"}),e("source",{src:u?.sources?.[0]?.url,type:"video/webm"}),e("source",{src:u?.sources?.[0]?.url,type:"video/ogg"})]})},t?.id+"SwiperSlideItem"+w))}),e("div",{className:k("swiper-button tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:left-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:C,children:e(ae,{className:"tablet:size-10 lg-desktop:size-12"})}),e("div",{className:k("tablet:block swiper-button tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:right-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:b,children:e(le,{className:"tablet:size-10 lg-desktop:size-12"})})]})},Fe=t=>e("div",{children:"3D View"});var $e=ge(ye);export{$e as default};
|
|
1
|
+
import{Fragment as Te,jsx as e,jsxs as h}from"react/jsx-runtime";import{useAiuiContext as Z}from"../../../../AiuiProvider/index.js";import{Text as J,Picture as j,Badge as ie}from"../../../../../components/index.js";import{useCallback as L,useMemo as W,useState as P,forwardRef as Q,useRef as D,useEffect as B,useImperativeHandle as oe}from"react";import{Swiper as H,SwiperSlide as F}from"swiper/react";import{Navigation as Y,Mousewheel as X,Thumbs as O,Pagination as ee,Autoplay as re}from"swiper/modules";import{cn as k}from"../../../../../helpers/index.js";import{GalleryTabType as A}from"./types.js";import{Content as ne,List as se,Root as ce,Trigger as de}from"@radix-ui/react-tabs";import{useBizProductContext as K}from"../../../BizProductProvider.js";import{useVariantMedia as ue}from"../../../hooks/use-variant-media.js";import{SpecsModal as pe}from"./components/SpecsModal.js";import me from"./components/CompareModal.js";import{formatPrice as be}from"../../../utils/index.js";import{withLayout as ge}from"../../../../../shared/Styles.js";import{gaTrack as fe}from"../../../../../shared/track.js";import{ExposureDetector as ve}from"../../../../../components/index.js";import{debounce as te}from"es-toolkit";const ae=t=>h("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t,children:[e("rect",{x:"48",y:"48",width:"48",height:"48",rx:"24",transform:"rotate(-180 48 48)",fill:"white"}),e("path",{d:"M25.1035 16.8545C25.5372 16.3818 26.246 16.3818 26.6797 16.8545C27.1067 17.3201 27.1067 18.0706 26.6797 18.5361L21.668 24L26.6797 29.4639C27.1067 29.9294 27.1067 30.6799 26.6797 31.1455C26.246 31.6182 25.5372 31.6182 25.1035 31.1455L19.3203 24.8408C18.8933 24.3752 18.8933 23.6248 19.3203 23.1592L25.1035 16.8545Z",fill:"currentColor"})]}),le=t=>h("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t,children:[e("rect",{width:"48",height:"48",rx:"24",transform:"matrix(1 -8.74228e-08 -8.74228e-08 -1 0 48)",fill:"white"}),e("path",{d:"M22.8965 16.8545C22.4628 16.3818 21.754 16.3818 21.3203 16.8545C20.8933 17.3201 20.8933 18.0706 21.3203 18.5361L26.332 24L21.3203 29.4639C20.8933 29.9294 20.8933 30.6799 21.3203 31.1455C21.754 31.6182 22.4628 31.6182 22.8965 31.1455L28.6797 24.8408C29.1067 24.3752 29.1067 23.6248 28.6797 23.1592L22.8965 16.8545Z",fill:"currentColor"})]}),ye=()=>{const{copyWriting:t}=Z(),{product:c,variant:m,selectedOptions:C}=K(),b=ue({product:c,variant:m}),[u,w]=P(null),I=D(null),g=m?.metafields?.component?.custom_media_list;let r,x,S,G;g&&g?.available?(r=g?.product||[],x=g?.scenarios||[],S=g?.keyFeatures||[],G=g?.video||[]):(r=b?.productList,x=b?.sceneList,S=b?.keyFeaturesList,G=b?.videoList);const n=W(()=>[...r,...x,...G],[r,x,G]),p={productList:r,sceneList:x,keyFeaturesList:S,videoList:G},a=W(()=>{const i=c?.payload?.components?.find(f=>f.componentKey==="ProductGallery")?.data||[],s=m?.payload?.components?.find(f=>f.componentKey==="ProductGallery")?.data||[];return i?.map(f=>{const E=s?.find(z=>f?.galleries===z?.galleries);let V=p[f?.galleries]||[];if(E?.images&&Array.isArray(E.images)&&E.images.length>0){const z=E.images.map(d=>{const _=[];if(d.image_1920&&d.image_1920.trim()&&_.push(`${d.image_1920}`),d.image_1440&&d.image_1440.trim()&&_.push(`${d.image_1440} 1919`),d.image_1024&&d.image_1024.trim()&&_.push(`${d.image_1024} 1439`),d.image_768&&d.image_768.trim()&&_.push(`${d.image_768} 1023`),d.image_390&&d.image_390.trim()&&_.push(`${d.image_390} 767`),_.length>0){const U=_.join(", ");return{image:{url:U,altText:f.comment?.content||""},_fromImages:!0,_responsiveSource:U}}return null}).filter(d=>d!==null);z.length>0&&(V=z)}return{...f,galleries:V}}).filter(f=>f.galleries.length>0)},[m?.payload,p,c?.payload]),[y,l]=P(a?.[0]),[o,N]=P(0),[v,T]=P(null),M=L(()=>{const i=(o+1)%a.length;N(i),l(a[i]),T(0)},[o,a]),R=L(()=>{const i=o===0?a.length-1:o-1;N(i),l(a[i]);const s=a[i]?.galleries||[];T(s.length-1)},[o,a]);B(()=>{o!=null&&requestAnimationFrame(()=>{I.current?.scrollToTab(o)})},[o]),B(()=>{l(a[0]),N(0)},[m?.id]);const $=(i,s)=>{switch(i?.galleryTabType){case A.GALLERY_IMAGE_MAIN:return e(q,{...i,index:s,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});case A.GALLERY_IMAGE_FEATURES:return e(q,{...i,index:s,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});case A.GALLERY_IMAGE_SCENE:return e(q,{...i,index:s,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});case A.GALLERY_VIDEO:return e(xe,{...i,onNextTab:M,onPrevTab:R,targetSlideIndex:v,onSlideChange:()=>T(null)});default:return null}};return e("div",{id:"ipc-product-gallery",children:h(ce,{className:"relative",value:y?.tabValue,defaultValue:a?.[0]?.tabValue,children:[e("div",{className:"tablet:h-[620px] laptop-md:rounded-2xl laptop-md:h-[560px] lg-desktop:h-[700px] laptop-md:relative h-[420px] overflow-hidden bg-[#EAEAEC] ",children:a.map((i,s)=>e(ne,{className:"h-full",value:i.tabValue,children:$(i,s)},i.tabValue))}),e(he,{ref:I,galleryTabs:a,activeGalleryTab:y,setActiveGalleryTab:l,setActiveTabIndex:N,setTargetSlideIndex:T})]})})},he=Q((t,c)=>{const{galleryTabs:m,activeGalleryTab:C,setActiveGalleryTab:b,setActiveTabIndex:u,setTargetSlideIndex:w}=t,{product:I}=K(),g=D(null),r=D(new Map),x=L(n=>{if(g.current){const p=g.current,a=n.currentTarget,y=a.offsetLeft-p.offsetWidth/2+a.offsetWidth/2;p.scrollTo({left:y,behavior:"smooth"})}},[]),S=L((n,p,a)=>{b(p),u(a),w(0),x(n)},[b,u,w,x]),G=L(n=>{if(g.current&&m[n]){const p=g.current,a=m[n],y=r.current.get(a.tabValue);if(y){const l=y.offsetLeft-p.offsetWidth/2+y.offsetWidth/2;p.scrollTo({left:l,behavior:"smooth"})}}},[m]);return oe(c,()=>({scrollToTab:G})),h("div",{className:"laptop:inset-x-16 tablet:mt-3 laptop-md:static absolute inset-x-4 bottom-4 z-[2] flex items-center justify-between",children:[e(se,{ref:g,className:"laptop:p-0 laptop-md:p-1 overflow-x-auto rounded-full bg-[#EAEAEC] p-1",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:e("div",{className:"whitespace-nowrap",children:m?.map((n,p)=>e(de,{ref:a=>{a?r.current.set(n.tabValue,a):r.current.delete(n.tabValue)},className:k("lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] rounded-full px-5 pb-[10px] pt-[11px] text-[14px] font-bold leading-tight",n.tabValue===C?.tabValue&&"bg-white"),onClick:a=>S(a,n,p),value:n.tabValue,children:n.tabLabel},n.tabValue+p))})}),e("div",{className:"laptop:gap-2 laptop:flex hidden",children:I.metafields?.global?.specifications&&h(Te,{children:[e(pe,{})," | ",e(me,{})]})})]})}),q=Q((t,c)=>{const{locale:m="us",copyWriting:C}=Z(),{variant:b,totalSavings:u}=K(),w=D(null),[I,g]=P(null),[r,x]=P(null),[S,G]=P([]),n=D(null),p=W(()=>{if(t?.galleryTabType===A.GALLERY_IMAGE_MAIN)return"size-[240px] mx-auto mt-[42px] tablet:mt-16 tablet:size-[420px] lg-desktop:size-[560px]";t?.galleryTabType===A.GALLERY_IMAGE_FEATURES||(t?.galleryTabType,A.GALLERY_IMAGE_SCENE)},[t?.galleryTabType]),a=L(()=>{r?.isBeginning?t.onPrevTab?.():r?.slidePrev()},[r,t]),y=L(()=>{r?.isEnd?t.onNextTab?.():r?.slideNext()},[r,t]);return B(()=>{r&&t.targetSlideIndex&&(r.slideTo(t.targetSlideIndex,0),t.onSlideChange?.())},[r,t.targetSlideIndex,t]),B(()=>{const l=()=>{if(!t?.comment?.content||!n.current)return;const v=n.current;v.textContent="Test";const M=v.offsetHeight*2+2,$=t.comment.content.replace(/<[^>]*>/g," ").replace(/\s+/g," ").trim().split(" "),i=[];let s="";for(let f=0;f<$.length;f++){const E=$[f],V=s?`${s} ${E}`:E;v.textContent=V,v.offsetHeight>M?s?(i.push(s),s=E):(i.push(E),s=""):s=V}s&&i.push(s),v.textContent="",G(i)},o=requestAnimationFrame(()=>{requestAnimationFrame(()=>{l()})}),N=()=>{l()};return window.addEventListener("resize",te(N,500)),()=>{cancelAnimationFrame(o),window.removeEventListener("resize",te(N,500))}},[t?.comment?.content]),h("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[e(H,{ref:c,className:"h-full",onSwiper:x,onTouchEnd:(l,o)=>{l.isBeginning&&l.swipeDirection==="prev"?a():l.isEnd&&l.swipeDirection==="next"&&y()},pagination:{clickable:!0,el:w.current},thumbs:{swiper:I},modules:[X,O,Y,ee],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:t?.galleries?.map((l,o)=>{const N=`${t.tabValue}-${o}`,v=()=>{fe({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${b.sku}`,component_type:"image",component_name:t?.tabLabel||"",position:o+1,creative_id:"",component_title:"",component_description:"",navigation:""}})},T=l?._responsiveSource||l?.image?.url||"";return e(F,{className:"h-full",children:e(ve,{onExposure:v,exposureKey:N,threshold:.5,duration:2e3,className:"h-full",children:e(j,{source:T,alt:l?.image?.altText,className:k("h-full",p),imgClassName:"object-cover h-full"})})},t?.id+"SwiperSlideItem"+o)})}),b.availableForSale&&!!u&&!t.index&&e(ie,{size:"lg",className:"bg-brand laptop:left-16 laptop:top-5 laptop-md:left-6 laptop-md:top-6 absolute left-4 top-3 z-[2] text-white",children:`${be({amount:u,currencyCode:b?.price?.currencyCode,locale:m})} ${C?.off}`}),e("div",{className:k("tablet:opacity-0 tablet:block tablet:absolute tablet:top-1/2 laptop:left-16 tablet:left-6 laptop-md:left-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:a,children:e(ae,{className:k("tablet:size-10 lg-desktop:size-12")})}),e("div",{className:k("tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 laptop:right-16 tablet:right-6 laptop-md:right-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:y,children:e(le,{className:k("tablet:size-10 lg-desktop:size-12")})}),h("div",{className:"tablet:bottom-[70px] tablet:flex laptop:inset-x-16 laptop-md:bottom-[20px] laptop-md:inset-x-6 absolute inset-x-4 bottom-[94px] z-10 items-center justify-between",children:[e("div",{className:"tablet:block hidden",children:e(H,{className:"flex items-center justify-between",onSwiper:g,spaceBetween:12,slidesPerView:6,freeMode:!0,watchSlidesProgress:!0,modules:[Y,O],children:t?.galleries?.map((l,o)=>e(F,{className:"[&.swiper-slide-thumb-active]:border-brand !w-auto cursor-pointer border border-transparent [&.swiper-slide-thumb-active]:rounded",children:e(j,{source:l.image?.url,alt:l.image?.altText,className:"lg-desktop:size-12 size-10 overflow-hidden rounded bg-white",imgClassName:"object-cover h-full"})},t?.id+"SwiperSlideThumbItem"+o))})}),!t?.index&&h("div",{className:"flex items-center gap-2",children:[e(j,{source:t?.comment?.avatar?.url,className:"laptop:size-10 size-8 shrink-0 rounded-full",imgClassName:"object-cover "}),h("div",{className:"relative max-w-[528px]",children:[e("div",{ref:n,className:"lg-desktop:text-base pointer-events-none text-sm font-bold text-[#1D1D1F] opacity-0",style:{visibility:"hidden"}}),e(H,{modules:[re],loop:S.length>1,className:"h-[44px]",direction:"vertical",autoplay:{delay:5e3,disableOnInteraction:!1},children:S.length>0?S.map((l,o)=>e(F,{children:e(J,{html:l,as:"div",className:"lg-desktop:text-base overflow-hidden text-sm font-bold text-[#1D1D1F]"})},o+"text-group")):e(F,{children:e(J,{as:"div",html:t?.comment?.content,className:"lg-desktop:text-base text-sm font-bold text-[#1D1D1F]"})})})]})]})]}),e("div",{ref:w,className:"tablet:hidden absolute inset-x-4 !bottom-[70px] z-10 text-center [&_.swiper-pagination-bullet-active]:!bg-[#1D1D1F] [&_.swiper-pagination-bullet]:bg-white [&_.swiper-pagination-bullet]:opacity-100"})]})}),xe=t=>{const[c,m]=P(null),C=L(()=>{c?.isBeginning?t.onPrevTab?.():c?.slidePrev()},[c,t]),b=L(()=>{c?.isEnd?t.onNextTab?.():c?.slideNext()},[c,t]);return B(()=>{c&&t.targetSlideIndex!==null&&t.targetSlideIndex!==void 0&&(c.slideTo(t.targetSlideIndex,0),t.onSlideChange?.())},[c,t.targetSlideIndex,t]),h("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[e(H,{className:"h-full",onSwiper:m,onTouchEnd:(u,w)=>{u.isBeginning&&u.swipeDirection==="prev"?C():u.isEnd&&u.swipeDirection==="next"&&b()},modules:[X,O,Y,ee],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:t?.galleries?.map((u,w)=>e(F,{className:"h-full",children:h("video",{controls:!0,className:"size-full object-cover",children:[e("track",{kind:"captions"}),e("source",{src:u?.sources?.[0]?.url,type:"video/mp4"}),e("source",{src:u?.sources?.[0]?.url,type:"video/webm"}),e("source",{src:u?.sources?.[0]?.url,type:"video/ogg"})]})},t?.id+"SwiperSlideItem"+w))}),e("div",{className:k("swiper-button tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:left-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:C,children:e(ae,{className:"tablet:size-10 lg-desktop:size-12"})}),e("div",{className:k("tablet:block swiper-button tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:right-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:b,children:e(le,{className:"tablet:size-10 lg-desktop:size-12"})})]})},Fe=t=>e("div",{children:"3D View"});var $e=ge(ye);export{$e as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|