npm - @anker-in/headless-ui - Versions diffs - 1.1.78 → 1.1.80 - Mend

@anker-in/headless-ui 1.1.78 → 1.1.80

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.

Files changed (173) hide show

package/dist/cjs/biz-components/Faq/Faq.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var x=Object.create;var d=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var w=(e,a)=>{for(var t in a)d(e,t,{get:a[t],enumerable:!0})},f=(e,a,t,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let r of b(a))!q.call(e,r)&&r!==t&&d(e,r,{get:()=>a[r],enumerable:!(i=h(a,r))||i.enumerable});return e};var N=(e,a,t)=>(t=e!=null?x(F(e)):{},f(a||!e||!e.__esModule?d(t,"default",{value:e,enumerable:!0}):t,e)),L=e=>f(d({},"__esModule",{value:!0}),e);var C={};w(C,{FaqItem:()=>l,default:()=>k});module.exports=L(C);var o=require("react/jsx-runtime"),s=N(require("react")),p=require("../../components/index.js"),n=require("../../helpers/index.js"),y=require("../../shared/Styles.js");const v=s.default.forwardRef(({data:e,className:a,defaultOpenIndex:t,classNames:i={}},r)=>{const m=(0,s.useRef)(null);(0,s.useImperativeHandle)(r,()=>m.current);const g=Array.isArray(t)?t:t!==void 0?[t]:[];return(0,o.jsx)("div",{ref:m,className:(0,n.cn)(a,i.root),children:(0,o.jsx)("div",{children:e?.productData?.map((u,c)=>(0,o.jsx)(l,{data:u,defaultOpen:g.includes(c),classNames:i},c))})})});v.displayName="Faq";const l=({data:e,defaultOpen:a=!1,classNames:t={}})=>{const[i,r]=(0,s.useState)(a),m=()=>{r(!i)};return(0,o.jsx)("div",{className:(0,n.cn)("tablet:py-6 border-b border-[#E4E5E6] py-4",t.item),children:(0,o.jsxs)("div",{children:[(0,o.jsxs)("div",{onClick:m,className:(0,n.cn)("tablet:gap-[128px] flex cursor-pointer items-center justify-between gap-4",t.itemHeader),children:[(0,o.jsx)(p.Heading,{as:"h3",html:e?.title,className:(0,n.cn)("desktop:text-base lg-desktop:text-lg text-info-primary text-sm font-bold leading-[1.4]",t.title)}),(0,o.jsx)("div",{className:(0,n.cn)("transition-transform duration-300",t.icon),children:(0,o.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:(0,n.cn)("w-[20px] transition-transform duration-300",i&&"rotate-180"),width:"20",height:"21",viewBox:"0 0 20 21",fill:"none",children:(0,o.jsx)("path",{d:"M14.4111 7.41107C14.7365 7.08563 15.264 7.08563 15.5895 7.41107C15.9149 7.73651 15.9149 8.26402 15.5895 8.58946L10.5895 13.5895C10.264 13.9149 9.73651 13.9149 9.41107 13.5895L4.41107 8.58946C4.08563 8.26402 4.08563 7.73651 4.41107 7.41107C4.73651 7.08563 5.26402 7.08563 5.58946 7.41107L10.0003 11.8219L14.4111 7.41107Z",fill:"#1D1D1F"})})})]}),(0,o.jsx)("div",{className:(0,n.cn)("overflow-hidden transition-all duration-300",i?"mt-2 max-h-[500px] opacity-100":"max-h-0 opacity-0",t.content),children:(0,o.jsx)(p.Text,{html:e?.desc,className:(0,n.cn)("desktop:text-base lg-desktop:text-lg text-info-secondary text-sm font-bold leading-[1.4]",t.description)})})]})})};l.displayName="FaqItem";var k=(0,y.withLayout)(v);
+"use strict";"use client";var x=Object.create;var d=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var w=(e,a)=>{for(var t in a)d(e,t,{get:a[t],enumerable:!0})},f=(e,a,t,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let r of b(a))!q.call(e,r)&&r!==t&&d(e,r,{get:()=>a[r],enumerable:!(i=h(a,r))||i.enumerable});return e};var N=(e,a,t)=>(t=e!=null?x(F(e)):{},f(a||!e||!e.__esModule?d(t,"default",{value:e,enumerable:!0}):t,e)),C=e=>f(d({},"__esModule",{value:!0}),e);var k={};w(k,{FaqItem:()=>l,default:()=>L});module.exports=C(k);var o=require("react/jsx-runtime"),s=N(require("react")),p=require("../../components/index.js"),n=require("../../helpers/index.js"),y=require("../../shared/Styles.js");const v=s.default.forwardRef(({data:e,className:a,defaultOpenIndex:t,classNames:i={}},r)=>{const m=(0,s.useRef)(null);(0,s.useImperativeHandle)(r,()=>m.current);const g=Array.isArray(t)?t:t!==void 0?[t]:[];return(0,o.jsx)("div",{ref:m,className:(0,n.cn)(a,i.root),children:(0,o.jsx)("div",{children:e?.productData?.map((u,c)=>(0,o.jsx)(l,{data:u,defaultOpen:g.includes(c),classNames:i},c))})})});v.displayName="Faq";const l=({data:e,defaultOpen:a=!1,classNames:t={}})=>{const[i,r]=(0,s.useState)(a),m=()=>{r(!i)};return(0,o.jsx)("div",{className:(0,n.cn)("tablet:py-6 border-b border-[#E4E5E6] py-4",t.item),children:(0,o.jsxs)("div",{children:[(0,o.jsxs)("div",{onClick:m,className:(0,n.cn)("tablet:gap-[128px] flex cursor-pointer items-center justify-between gap-4",t.itemHeader),children:[(0,o.jsx)(p.Heading,{as:"h3",html:e?.title,className:(0,n.cn)("desktop:text-base lg-desktop:text-lg text-info-primary text-sm font-bold leading-[1.4]",t.title)}),(0,o.jsx)("div",{className:(0,n.cn)("transition-transform duration-300",t.icon),children:(0,o.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:(0,n.cn)("w-[20px] transition-transform duration-300",i&&"rotate-180"),width:"20",height:"21",viewBox:"0 0 20 21",fill:"none",children:(0,o.jsx)("path",{d:"M14.4111 7.41107C14.7365 7.08563 15.264 7.08563 15.5895 7.41107C15.9149 7.73651 15.9149 8.26402 15.5895 8.58946L10.5895 13.5895C10.264 13.9149 9.73651 13.9149 9.41107 13.5895L4.41107 8.58946C4.08563 8.26402 4.08563 7.73651 4.41107 7.41107C4.73651 7.08563 5.26402 7.08563 5.58946 7.41107L10.0003 11.8219L14.4111 7.41107Z",fill:"#1D1D1F"})})})]}),(0,o.jsx)("div",{className:(0,n.cn)("overflow-hidden text-[#4A4C56] transition-all duration-300",i?"mt-2 max-h-[500px] opacity-100":"max-h-0 opacity-0",t.content),children:(0,o.jsx)(p.Text,{html:e?.desc,className:(0,n.cn)("desktop:text-base lg-desktop:text-lg text-info-secondary text-sm font-bold leading-[1.4]",t.description)})})]})})};l.displayName="FaqItem";var L=(0,y.withLayout)(v);
 //# sourceMappingURL=Faq.js.map

package/dist/cjs/biz-components/Faq/Faq.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Faq/Faq.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState } from 'react'\nimport type { FaqProps, FaqItem as ItemType, FaqSemanticName } from './types.js'\nimport { Text, Heading } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst Faq = React.forwardRef<HTMLDivElement, FaqProps>(\n  ({ data, className, defaultOpenIndex, classNames = {} }, ref) => {\n    const innerRef = useRef<HTMLDivElement>(null)\n    useImperativeHandle(ref, () => innerRef.current!)\n\n    // \u5C06 defaultOpenIndex \u8F6C\u6362\u4E3A\u6570\u7EC4\u65B9\u4FBF\u5224\u65AD\n    const openIndexes = Array.isArray(defaultOpenIndex)\n      ? defaultOpenIndex\n      : defaultOpenIndex !== undefined\n        ? [defaultOpenIndex]\n        : []\n\n    return (\n      <div ref={innerRef} className={cn(className, classNames.root)}>\n        <div>\n          {data?.productData?.map((item: any, index: number) => (\n            <FaqItem key={index} data={item} defaultOpen={openIndexes.includes(index)} classNames={classNames} />\n          ))}\n        </div>\n      </div>\n    )\n  }\n)\n\nFaq.displayName = 'Faq'\n\ninterface FaqItemProps {\n  data: ItemType\n  defaultOpen?: boolean\n  classNames?: Partial<Record<FaqSemanticName, string>>\n}\n\nconst FaqItem = ({ data, defaultOpen = false, classNames = {} }: FaqItemProps) => {\n  const [open, setOpen] = useState(defaultOpen)\n\n  const handleToggle = () => {\n    setOpen(!open)\n  }\n\n  return (\n    <div className={cn('tablet:py-6 border-b border-[#E4E5E6] py-4', classNames.item)}>\n      <div>\n        <div\n          onClick={handleToggle}\n          className={cn(\n            'tablet:gap-[128px] flex cursor-pointer items-center justify-between gap-4',\n            classNames.itemHeader\n          )}\n        >\n          <Heading\n            as=\"h3\"\n            html={data?.title}\n            className={cn(\n              'desktop:text-base lg-desktop:text-lg text-info-primary text-sm font-bold leading-[1.4]',\n              classNames.title\n            )}\n          />\n          <div className={cn('transition-transform duration-300', classNames.icon)}>\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className={cn('w-[20px] transition-transform duration-300', open && 'rotate-180')}\n              width=\"20\"\n              height=\"21\"\n              viewBox=\"0 0 20 21\"\n              fill=\"none\"\n            >\n              <path\n                d=\"M14.4111 7.41107C14.7365 7.08563 15.264 7.08563 15.5895 7.41107C15.9149 7.73651 15.9149 8.26402 15.5895 8.58946L10.5895 13.5895C10.264 13.9149 9.73651 13.9149 9.41107 13.5895L4.41107 8.58946C4.08563 8.26402 4.08563 7.73651 4.41107 7.41107C4.73651 7.08563 5.26402 7.08563 5.58946 7.41107L10.0003 11.8219L14.4111 7.41107Z\"\n                fill=\"#1D1D1F\"\n              />\n            </svg>\n          </div>\n        </div>\n\n        {/* \u5E26\u8FC7\u6E21\u7684\u5185\u5BB9\u533A\u57DF */}\n        <div\n          className={cn(\n            'overflow-hidden transition-all duration-300',\n            open ? 'mt-2 max-h-[500px] opacity-100' : 'max-h-0 opacity-0',\n            classNames.content\n          )}\n        >\n          <Text\n            html={data?.desc}\n            className={cn(\n              'desktop:text-base lg-desktop:text-lg text-info-secondary text-sm font-bold leading-[1.4]',\n              classNames.description\n            )}\n          />\n        </div>\n      </div>\n    </div>\n  )\n}\n\nFaqItem.displayName = 'FaqItem'\n\nexport default withLayout(Faq)\nexport { FaqItem }\n"],
-  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,YAAAC,IAAA,eAAAC,EAAAJ,GAuBY,IAAAK,EAAA,6BAtBZC,EAA6D,oBAE7DC,EAA8B,qCAC9BC,EAAmB,kCACnBC,EAA2B,kCAE3B,MAAMC,EAAM,EAAAC,QAAM,WAChB,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAW,iBAAAC,EAAkB,WAAAC,EAAa,CAAC,CAAE,EAAGC,IAAQ,CAC/D,MAAMC,KAAW,UAAuB,IAAI,KAC5C,uBAAoBD,EAAK,IAAMC,EAAS,OAAQ,EAGhD,MAAMC,EAAc,MAAM,QAAQJ,CAAgB,EAC9CA,EACAA,IAAqB,OACnB,CAACA,CAAgB,EACjB,CAAC,EAEP,SACE,OAAC,OAAI,IAAKG,EAAU,aAAW,MAAGJ,EAAWE,EAAW,IAAI,EAC1D,mBAAC,OACE,SAAAH,GAAM,aAAa,IAAI,CAACO,EAAWC,OAClC,OAAClB,EAAA,CAAoB,KAAMiB,EAAM,YAAaD,EAAY,SAASE,CAAK,EAAG,WAAYL,GAAzEK,CAAqF,CACpG,EACH,EACF,CAEJ,CACF,EAEAV,EAAI,YAAc,MAQlB,MAAMR,EAAU,CAAC,CAAE,KAAAU,EAAM,YAAAS,EAAc,GAAO,WAAAN,EAAa,CAAC,CAAE,IAAoB,CAChF,KAAM,CAACO,EAAMC,CAAO,KAAI,YAASF,CAAW,EAEtCG,EAAe,IAAM,CACzBD,EAAQ,CAACD,CAAI,CACf,EAEA,SACE,OAAC,OAAI,aAAW,MAAG,6CAA8CP,EAAW,IAAI,EAC9E,oBAAC,OACC,qBAAC,OACC,QAASS,EACT,aAAW,MACT,4EACAT,EAAW,UACb,EAEA,oBAAC,WACC,GAAG,KACH,KAAMH,GAAM,MACZ,aAAW,MACT,yFACAG,EAAW,KACb,EACF,KACA,OAAC,OAAI,aAAW,MAAG,oCAAqCA,EAAW,IAAI,EACrE,mBAAC,OACC,MAAM,6BACN,aAAW,MAAG,6CAA8CO,GAAQ,YAAY,EAChF,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,mBAAC,QACC,EAAE,kUACF,KAAK,UACP,EACF,EACF,GACF,KAGA,OAAC,OACC,aAAW,MACT,8CACAA,EAAO,iCAAmC,oBAC1CP,EAAW,OACb,EAEA,mBAAC,QACC,KAAMH,GAAM,KACZ,aAAW,MACT,2FACAG,EAAW,WACb,EACF,EACF,GACF,EACF,CAEJ,EAEAb,EAAQ,YAAc,UAEtB,IAAOC,KAAQ,cAAWO,CAAG",
+  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState } from 'react'\nimport type { FaqProps, FaqItem as ItemType, FaqSemanticName } from './types.js'\nimport { Text, Heading } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst Faq = React.forwardRef<HTMLDivElement, FaqProps>(\n  ({ data, className, defaultOpenIndex, classNames = {} }, ref) => {\n    const innerRef = useRef<HTMLDivElement>(null)\n    useImperativeHandle(ref, () => innerRef.current!)\n\n    // \u5C06 defaultOpenIndex \u8F6C\u6362\u4E3A\u6570\u7EC4\u65B9\u4FBF\u5224\u65AD\n    const openIndexes = Array.isArray(defaultOpenIndex)\n      ? defaultOpenIndex\n      : defaultOpenIndex !== undefined\n        ? [defaultOpenIndex]\n        : []\n\n    return (\n      <div ref={innerRef} className={cn(className, classNames.root)}>\n        <div>\n          {data?.productData?.map((item: any, index: number) => (\n            <FaqItem key={index} data={item} defaultOpen={openIndexes.includes(index)} classNames={classNames} />\n          ))}\n        </div>\n      </div>\n    )\n  }\n)\n\nFaq.displayName = 'Faq'\n\ninterface FaqItemProps {\n  data: ItemType\n  defaultOpen?: boolean\n  classNames?: Partial<Record<FaqSemanticName, string>>\n}\n\nconst FaqItem = ({ data, defaultOpen = false, classNames = {} }: FaqItemProps) => {\n  const [open, setOpen] = useState(defaultOpen)\n\n  const handleToggle = () => {\n    setOpen(!open)\n  }\n\n  return (\n    <div className={cn('tablet:py-6 border-b border-[#E4E5E6] py-4', classNames.item)}>\n      <div>\n        <div\n          onClick={handleToggle}\n          className={cn(\n            'tablet:gap-[128px] flex cursor-pointer items-center justify-between gap-4',\n            classNames.itemHeader\n          )}\n        >\n          <Heading\n            as=\"h3\"\n            html={data?.title}\n            className={cn(\n              'desktop:text-base lg-desktop:text-lg text-info-primary text-sm font-bold leading-[1.4]',\n              classNames.title\n            )}\n          />\n          <div className={cn('transition-transform duration-300', classNames.icon)}>\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className={cn('w-[20px] transition-transform duration-300', open && 'rotate-180')}\n              width=\"20\"\n              height=\"21\"\n              viewBox=\"0 0 20 21\"\n              fill=\"none\"\n            >\n              <path\n                d=\"M14.4111 7.41107C14.7365 7.08563 15.264 7.08563 15.5895 7.41107C15.9149 7.73651 15.9149 8.26402 15.5895 8.58946L10.5895 13.5895C10.264 13.9149 9.73651 13.9149 9.41107 13.5895L4.41107 8.58946C4.08563 8.26402 4.08563 7.73651 4.41107 7.41107C4.73651 7.08563 5.26402 7.08563 5.58946 7.41107L10.0003 11.8219L14.4111 7.41107Z\"\n                fill=\"#1D1D1F\"\n              />\n            </svg>\n          </div>\n        </div>\n\n        {/* \u5E26\u8FC7\u6E21\u7684\u5185\u5BB9\u533A\u57DF */}\n        <div\n          className={cn(\n            'overflow-hidden text-[#4A4C56] transition-all duration-300',\n            open ? 'mt-2 max-h-[500px] opacity-100' : 'max-h-0 opacity-0',\n            classNames.content\n          )}\n        >\n          <Text\n            html={data?.desc}\n            className={cn(\n              'desktop:text-base lg-desktop:text-lg text-info-secondary text-sm font-bold leading-[1.4]',\n              classNames.description\n            )}\n          />\n        </div>\n      </div>\n    </div>\n  )\n}\n\nFaqItem.displayName = 'FaqItem'\n\nexport default withLayout(Faq)\nexport { FaqItem }\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,YAAAC,IAAA,eAAAC,EAAAJ,GAuBY,IAAAK,EAAA,6BAtBZC,EAA6D,oBAE7DC,EAA8B,qCAC9BC,EAAmB,kCACnBC,EAA2B,kCAE3B,MAAMC,EAAM,EAAAC,QAAM,WAChB,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAW,iBAAAC,EAAkB,WAAAC,EAAa,CAAC,CAAE,EAAGC,IAAQ,CAC/D,MAAMC,KAAW,UAAuB,IAAI,KAC5C,uBAAoBD,EAAK,IAAMC,EAAS,OAAQ,EAGhD,MAAMC,EAAc,MAAM,QAAQJ,CAAgB,EAC9CA,EACAA,IAAqB,OACnB,CAACA,CAAgB,EACjB,CAAC,EAEP,SACE,OAAC,OAAI,IAAKG,EAAU,aAAW,MAAGJ,EAAWE,EAAW,IAAI,EAC1D,mBAAC,OACE,SAAAH,GAAM,aAAa,IAAI,CAACO,EAAWC,OAClC,OAAClB,EAAA,CAAoB,KAAMiB,EAAM,YAAaD,EAAY,SAASE,CAAK,EAAG,WAAYL,GAAzEK,CAAqF,CACpG,EACH,EACF,CAEJ,CACF,EAEAV,EAAI,YAAc,MAQlB,MAAMR,EAAU,CAAC,CAAE,KAAAU,EAAM,YAAAS,EAAc,GAAO,WAAAN,EAAa,CAAC,CAAE,IAAoB,CAChF,KAAM,CAACO,EAAMC,CAAO,KAAI,YAASF,CAAW,EAEtCG,EAAe,IAAM,CACzBD,EAAQ,CAACD,CAAI,CACf,EAEA,SACE,OAAC,OAAI,aAAW,MAAG,6CAA8CP,EAAW,IAAI,EAC9E,oBAAC,OACC,qBAAC,OACC,QAASS,EACT,aAAW,MACT,4EACAT,EAAW,UACb,EAEA,oBAAC,WACC,GAAG,KACH,KAAMH,GAAM,MACZ,aAAW,MACT,yFACAG,EAAW,KACb,EACF,KACA,OAAC,OAAI,aAAW,MAAG,oCAAqCA,EAAW,IAAI,EACrE,mBAAC,OACC,MAAM,6BACN,aAAW,MAAG,6CAA8CO,GAAQ,YAAY,EAChF,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,mBAAC,QACC,EAAE,kUACF,KAAK,UACP,EACF,EACF,GACF,KAGA,OAAC,OACC,aAAW,MACT,6DACAA,EAAO,iCAAmC,oBAC1CP,EAAW,OACb,EAEA,mBAAC,QACC,KAAMH,GAAM,KACZ,aAAW,MACT,2FACAG,EAAW,WACb,EACF,EACF,GACF,EACF,CAEJ,EAEAb,EAAQ,YAAc,UAEtB,IAAOC,KAAQ,cAAWO,CAAG",
   "names": ["Faq_exports", "__export", "FaqItem", "Faq_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_helpers", "import_Styles", "Faq", "React", "data", "className", "defaultOpenIndex", "classNames", "ref", "innerRef", "openIndexes", "item", "index", "defaultOpen", "open", "setOpen", "handleToggle"]
 }

package/dist/cjs/biz-components/Features/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var d=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var m=(s,e)=>{for(var o in e)d(s,o,{get:e[o],enumerable:!0})},u=(s,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let p of g(e))!c.call(s,p)&&p!==o&&d(s,p,{get:()=>e[p],enumerable:!(i=x(e,p))||i.enumerable});return s};var b=s=>u(d({},"__esModule",{value:!0}),s);var N={};m(N,{default:()=>v});module.exports=b(N);var t=require("react/jsx-runtime"),n=require("../../shared/Styles.js"),a=require("../../components/index.js");const k=s=>{const{data:e,className:o,...i}=s,{list:p}=e;return(0,t.jsx)(t.Fragment,{children:(0,t.jsxs)("div",{...i,className:o,children:[e?.title&&(0,t.jsx)("div",{className:"desktop:w-[800px] pb-[24px]",children:(0,t.jsx)(a.Text,{html:e?.title,className:" desktop:!text-[32px] lg-desktop:text-lg line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold"})}),e?.img?.url&&(0,t.jsx)(a.Picture,{className:"md-tablet:hidden aspect-[1664/560] rounded-2xl",imgClassName:"",source:e?.img?.url,alt:e?.img?.alt||""}),e?.mobileImg?.url&&(0,t.jsx)(a.Picture,{className:"tablet:hidden aspect-[358/360] rounded-2xl",imgClassName:"",source:e?.mobileImg?.url,alt:e?.mobileImg?.alt||""}),(0,t.jsx)("div",{className:"",children:(0,t.jsx)("div",{className:"flex flex-col gap-0",children:p.map((l,r)=>(0,t.jsxs)("div",{className:`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${r%2===0?"laptop:flex-row-reverse":""}`,children:[(0,t.jsxs)("div",{className:"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center",children:[(0,t.jsx)(a.Text,{html:l?.title,className:"graphic-title  desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold"}),(0,t.jsx)(a.Text,{html:l?.description,className:"graphic-title desktop:pt-[8px] lg-desktop:text-[18px] desktop:text-[16px] pt-[4px] text-[14px] leading-[1.2] [&_*_strong]:!font-bold"}),l?.numberOne&&(0,t.jsxs)("div",{className:"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]",children:[(0,t.jsxs)("div",{className:"",children:[(0,t.jsx)(a.Text,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:l?.numberOne,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),(0,t.jsx)(a.Text,{html:l?.textOne,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]}),(0,t.jsxs)("div",{children:[(0,t.jsx)(a.Text,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:l?.numberTwo,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),(0,t.jsx)(a.Text,{html:l?.textTwo,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]})]}),l?.icon?.url&&(0,t.jsx)("div",{className:"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]",children:(0,t.jsx)(a.Picture,{className:"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]",source:l?.icon?.url,alt:l?.icon?.alt||""})})]}),(0,t.jsx)("div",{className:"md-tablet:hidden laptop:mt-[24px] desktop:pt-0 mt-[24px] aspect-[964/560] overflow-hidden rounded-2xl",children:(0,t.jsx)(a.Picture,{className:"size-full object-cover ",source:l?.img?.url,alt:l?.img?.alt||""})}),(0,t.jsx)("div",{className:"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl",children:(0,t.jsx)(a.Picture,{className:"size-full object-cover",source:l?.mobileImg?.url,alt:l?.mobileImg?.alt||""})})]},r))})})]})})};var v=(0,n.withLayout)(k);
+"use strict";"use client";var d=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var c=(p,e)=>{for(var o in e)d(p,o,{get:e[o],enumerable:!0})},u=(p,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of g(e))!m.call(p,s)&&s!==o&&d(p,s,{get:()=>e[s],enumerable:!(i=x(e,s))||i.enumerable});return p};var b=p=>u(d({},"__esModule",{value:!0}),p);var N={};c(N,{default:()=>v});module.exports=b(N);var t=require("react/jsx-runtime"),n=require("../../shared/Styles.js"),a=require("../../components/index.js");const k=p=>{const{data:e,className:o,...i}=p,{list:s}=e;return(0,t.jsx)(t.Fragment,{children:(0,t.jsxs)("div",{...i,className:o,children:[e?.title&&(0,t.jsx)("div",{className:"desktop:w-[800px] pb-[24px]",children:(0,t.jsx)(a.Text,{html:e?.title,className:" desktop:!text-[32px] lg-desktop:text-lg line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold"})}),e?.img?.url&&(0,t.jsx)(a.Picture,{className:"md-tablet:hidden aspect-[1664/560] rounded-2xl",imgClassName:"",source:e?.img?.url,alt:e?.img?.alt||""}),e?.mobileImg?.url&&(0,t.jsx)(a.Picture,{className:"tablet:hidden aspect-[358/360] rounded-2xl",imgClassName:"",source:e?.mobileImg?.url,alt:e?.mobileImg?.alt||""}),(0,t.jsx)("div",{className:"",children:(0,t.jsx)("div",{className:"flex flex-col gap-0",children:s.map((l,r)=>(0,t.jsxs)("div",{className:`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${r%2===0?"laptop:flex-row-reverse":""}`,children:[(0,t.jsxs)("div",{className:"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center",children:[(0,t.jsx)(a.Text,{html:l?.title,className:"graphic-title  desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold"}),(0,t.jsx)(a.Text,{html:l?.description,className:"graphic-title desktop:pt-[8px] lg-desktop:text-[18px] tablet:max-w-[463px] laptop:max-w-[563px] desktop:max-w-none desktop:text-[16px] pt-[4px] text-[14px] leading-[1.4] [&_*_strong]:!font-bold"}),l?.numberOne&&(0,t.jsxs)("div",{className:"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]",children:[(0,t.jsxs)("div",{className:"",children:[(0,t.jsx)(a.Text,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:l?.numberOne,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),(0,t.jsx)(a.Text,{html:l?.textOne,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]}),(0,t.jsxs)("div",{children:[(0,t.jsx)(a.Text,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:l?.numberTwo,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),(0,t.jsx)(a.Text,{html:l?.textTwo,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]})]}),l?.icon?.url&&(0,t.jsx)("div",{className:"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]",children:(0,t.jsx)(a.Picture,{className:"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]",source:l?.icon?.url,alt:l?.icon?.alt||""})})]}),(0,t.jsx)("div",{className:"md-tablet:hidden laptop:mt-[24px] desktop:pt-0 mt-[24px] aspect-[964/560] overflow-hidden rounded-2xl",children:(0,t.jsx)(a.Picture,{className:"size-full object-cover ",source:l?.img?.url,alt:l?.img?.alt||""})}),(0,t.jsx)("div",{className:"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl",children:(0,t.jsx)(a.Picture,{className:"size-full object-cover",source:l?.mobileImg?.url,alt:l?.mobileImg?.alt||""})})]},r))})})]})})};var v=(0,n.withLayout)(k);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/Features/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Features/index.tsx"],
-  "sourcesContent": ["'use client'\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 = React.HTMLAttributes<HTMLDivElement> & {\n  data: {\n    title: string\n    img: Img\n    mobileImg: Img\n    list: FeaturesDataType[]\n  }\n}\n\nconst Features = (props: FeaturesType) => {\n  const { data, className, ...rest } = props\n  const { list } = data\n\n  return (\n    <>\n      <div {...rest} className={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"],
-  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6BI,IAAAI,EAAA,6BA3BJC,EAA2B,kCAC3BC,EAA8B,qCAqB9B,MAAMC,EAAYC,GAAwB,CACxC,KAAM,CAAE,KAAAC,EAAM,UAAAC,EAAW,GAAGC,CAAK,EAAIH,EAC/B,CAAE,KAAAI,CAAK,EAAIH,EAEjB,SACE,mBACE,oBAAC,OAAK,GAAGE,EAAM,UAAWD,EACvB,UAAAD,GAAM,UACL,OAAC,OAAI,UAAU,8BACb,mBAAC,QACC,KAAMA,GAAM,MACZ,UAAU,4GACZ,EACF,EAEDA,GAAM,KAAK,QACV,OAAC,WACC,UAAU,iDACV,aAAa,GACb,OAAQA,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,QAChB,OAAC,WACC,UAAU,6CACV,aAAa,GACb,OAAQA,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,KAEF,OAAC,OAAI,UAAU,GACb,mBAAC,OAAI,UAAU,sBACZ,SAAAG,EAAK,IAAI,CAACC,EAAMC,OACf,QAAC,OAEC,UAAW,+DAA+DA,EAAQ,IAAM,EAAI,0BAA4B,EAAE,GAE1H,qBAAC,OAAI,UAAU,+EACb,oBAAC,QACC,KAAMD,GAAM,MACZ,UAAU,oGACZ,KACA,OAAC,QACC,KAAMA,GAAM,YACZ,UAAU,uIACZ,EAECA,GAAM,cACL,QAAC,OAAI,UAAU,2FACb,qBAAC,OAAI,UAAU,GACb,oBAAC,QACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMA,GAAM,UACZ,UAAU,kGACZ,KACA,OAAC,QACC,KAAMA,GAAM,QACZ,UAAU,sHACZ,GACF,KACA,QAAC,OACC,oBAAC,QACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMA,GAAM,UACZ,UAAU,kGACZ,KACA,OAAC,QACC,KAAMA,GAAM,QACZ,UAAU,sHACZ,GACF,GACF,EAEDA,GAAM,MAAM,QACX,OAAC,OAAI,UAAU,mDACb,mBAAC,WACC,UAAU,mDACV,OAAQA,GAAM,MAAM,IACpB,IAAKA,GAAM,MAAM,KAAO,GAC1B,EACF,GAEJ,KACA,OAAC,OAAI,UAAU,wGACb,mBAAC,WAAQ,UAAU,0BAA0B,OAAQA,GAAM,KAAK,IAAK,IAAKA,GAAM,KAAK,KAAO,GAAI,EAClG,KACA,OAAC,OAAI,UAAU,uEACb,mBAAC,WACC,UAAU,yBACV,OAAQA,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,EACF,IAtEKC,CAuEP,CACD,EACH,EACF,GACF,EACF,CAEJ,EAEA,IAAOZ,KAAQ,cAAWK,CAAQ",
+  "sourcesContent": ["'use client'\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 = React.HTMLAttributes<HTMLDivElement> & {\n  data: {\n    title: string\n    img: Img\n    mobileImg: Img\n    list: FeaturesDataType[]\n  }\n}\n\nconst Features = (props: FeaturesType) => {\n  const { data, className, ...rest } = props\n  const { list } = data\n\n  return (\n    <>\n      <div {...rest} className={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] tablet:max-w-[463px] laptop:max-w-[563px] desktop:max-w-none desktop:text-[16px] pt-[4px] text-[14px] leading-[1.4] [&_*_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"],
+  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6BI,IAAAI,EAAA,6BA3BJC,EAA2B,kCAC3BC,EAA8B,qCAqB9B,MAAMC,EAAYC,GAAwB,CACxC,KAAM,CAAE,KAAAC,EAAM,UAAAC,EAAW,GAAGC,CAAK,EAAIH,EAC/B,CAAE,KAAAI,CAAK,EAAIH,EAEjB,SACE,mBACE,oBAAC,OAAK,GAAGE,EAAM,UAAWD,EACvB,UAAAD,GAAM,UACL,OAAC,OAAI,UAAU,8BACb,mBAAC,QACC,KAAMA,GAAM,MACZ,UAAU,4GACZ,EACF,EAEDA,GAAM,KAAK,QACV,OAAC,WACC,UAAU,iDACV,aAAa,GACb,OAAQA,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,QAChB,OAAC,WACC,UAAU,6CACV,aAAa,GACb,OAAQA,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,KAEF,OAAC,OAAI,UAAU,GACb,mBAAC,OAAI,UAAU,sBACZ,SAAAG,EAAK,IAAI,CAACC,EAAMC,OACf,QAAC,OAEC,UAAW,+DAA+DA,EAAQ,IAAM,EAAI,0BAA4B,EAAE,GAE1H,qBAAC,OAAI,UAAU,+EACb,oBAAC,QACC,KAAMD,GAAM,MACZ,UAAU,oGACZ,KACA,OAAC,QACC,KAAMA,GAAM,YACZ,UAAU,oMACZ,EAECA,GAAM,cACL,QAAC,OAAI,UAAU,2FACb,qBAAC,OAAI,UAAU,GACb,oBAAC,QACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMA,GAAM,UACZ,UAAU,kGACZ,KACA,OAAC,QACC,KAAMA,GAAM,QACZ,UAAU,sHACZ,GACF,KACA,QAAC,OACC,oBAAC,QACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMA,GAAM,UACZ,UAAU,kGACZ,KACA,OAAC,QACC,KAAMA,GAAM,QACZ,UAAU,sHACZ,GACF,GACF,EAEDA,GAAM,MAAM,QACX,OAAC,OAAI,UAAU,mDACb,mBAAC,WACC,UAAU,mDACV,OAAQA,GAAM,MAAM,IACpB,IAAKA,GAAM,MAAM,KAAO,GAC1B,EACF,GAEJ,KACA,OAAC,OAAI,UAAU,wGACb,mBAAC,WAAQ,UAAU,0BAA0B,OAAQA,GAAM,KAAK,IAAK,IAAKA,GAAM,KAAK,KAAO,GAAI,EAClG,KACA,OAAC,OAAI,UAAU,uEACb,mBAAC,WACC,UAAU,yBACV,OAAQA,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,EACF,IAtEKC,CAuEP,CACD,EACH,EACF,GACF,EACF,CAEJ,EAEA,IAAOZ,KAAQ,cAAWK,CAAQ",
   "names": ["Features_exports", "__export", "Features_default", "__toCommonJS", "import_jsx_runtime", "import_Styles", "import_components", "Features", "props", "data", "className", "rest", "list", "item", "index"]
 }

package/dist/cjs/biz-components/GiftBox/index.d.ts CHANGED Viewed

@@ -1,8 +1,5 @@
-import type { Img } from '../../types/props.js';
-export type GiftBoxDataType = {
-    img: Img;
-    mobileImg: Img;
-    title: string;
-};
+import 'swiper/css';
+import 'swiper/css/navigation';
+import 'swiper/css/pagination';
 declare const _default: any;
 export default _default;

package/dist/cjs/biz-components/GiftBox/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var s=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var x=(l,e)=>{for(var o in e)s(l,o,{get:e[o],enumerable:!0})},n=(l,e,o,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of g(e))!f.call(l,t)&&t!==o&&s(l,t,{get:()=>e[t],enumerable:!(p=c(e,t))||p.enumerable});return l};var u=l=>n(s({},"__esModule",{value:!0}),l);var b={};x(b,{default:()=>v});module.exports=u(b);var a=require("react/jsx-runtime"),I=require("react"),m=require("../../helpers/utils.js"),r=require("../../shared/Styles.js"),i=require("../../components/index.js");const y=({data:l,className:e,...o})=>{const{list:p}=l;return(0,a.jsx)("div",{...o,className:(0,m.cn)("w-full rounded-2xl bg-[#EAEAEC]",e),children:(0,a.jsx)("div",{className:"laptop:gap-4 tablet:grid-cols-4 laptop:grid-cols-3 desktop:grid-cols-5 lg-desktop:grid-cols-6 grid grid-cols-2 gap-3",children:p.map((t,d)=>(0,a.jsxs)("div",{className:"laptop:p-[20px] flex flex-col items-center justify-center p-[12px]",children:[(0,a.jsxs)("div",{children:[t?.img?.url&&(0,a.jsx)(i.Picture,{className:"laptop:hidden aspect-[194/194]",imgClassName:"",source:t?.img?.url,alt:t?.img?.alt||""}),t?.mobileImg?.url&&(0,a.jsx)(i.Picture,{className:"laptop:hidden aspect-[120/120]",imgClassName:"",source:t?.mobileImg?.url,alt:t?.mobileImg?.alt||""})]}),(0,a.jsx)(i.Text,{html:t?.title,className:"laptop:text-[18px] text-[14px] font-bold leading-[1.4]"})]},d))})})};var v=(0,r.withLayout)(y);
+"use strict";"use client";var d=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var x=(e,i)=>{for(var a in i)d(e,a,{get:i[a],enumerable:!0})},b=(e,i,a,p)=>{if(i&&typeof i=="object"||typeof i=="function")for(let l of w(i))!g.call(e,l)&&l!==a&&d(e,l,{get:()=>i[l],enumerable:!(p=f(i,l))||p.enumerable});return e};var h=e=>b(d({},"__esModule",{value:!0}),e);var y={};x(y,{default:()=>N});module.exports=h(y);var t=require("react/jsx-runtime"),B=require("react"),u=require("../../shared/Styles.js"),o=require("../../components/index.js"),c=require("../../helpers/index.js"),r=require("swiper/react"),s=require("swiper/modules"),G=require("swiper/css"),P=require("swiper/css/navigation"),T=require("swiper/css/pagination");const n=({item:e})=>(0,t.jsxs)("div",{className:"rounded-card laptop:p-[20px] tablet:h-full tablet:px-3 laptop:px-4 lg-desktop:p-8 flex h-[120px] flex-col items-center justify-center overflow-hidden bg-[#EAEAEC] px-4 py-[12px]",children:[(0,t.jsxs)("div",{className:"min-h-0 flex-1",children:[e?.img?.url&&(0,t.jsx)(o.Picture,{className:"laptop:block desktop:w-[116px] lg-desktop:w-[146px] hidden aspect-[194/194] w-[88px]",imgClassName:"",source:e?.img?.url,alt:e?.img?.alt||""}),e?.mobileImg?.url&&(0,t.jsx)(o.Picture,{className:"laptop:hidden block aspect-[120/120] h-full",imgClassName:"",source:e?.mobileImg?.url,alt:e?.mobileImg?.alt||""})]}),(0,t.jsx)(o.Text,{html:e?.title,className:"laptop:text-[18px] line-clamp-2 shrink-0 text-center text-[14px] font-bold leading-[1.4]"})]}),v=e=>{const{data:i,className:a}=e,{list:p}=i;return(0,t.jsxs)("div",{className:"w-full",children:[(0,t.jsx)("div",{className:(0,c.cn)("tablet:hidden grid grid-cols-2 gap-3",a),children:p.map((l,m)=>(0,t.jsx)(n,{item:l},`mobile-${m}`))}),(0,t.jsx)("div",{className:(0,c.cn)("tablet:block hidden",a),children:(0,t.jsxs)("div",{className:"relative",children:[(0,t.jsx)(r.Swiper,{modules:[s.Pagination,s.Mousewheel,s.FreeMode],freeMode:!0,spaceBetween:16,slidesPerView:"auto",pagination:{clickable:!0,el:".gift-box-pagination"},mousewheel:{forceToAxis:!0},breakpoints:{768:{spaceBetween:12,slidesPerView:4},1025:{spaceBetween:16,slidesPerView:4},1440:{spaceBetween:16,slidesPerView:6}},className:"laptop:!overflow-visible [&_.swiper-slide]:!h-auto [&_.swiper-wrapper]:items-stretch",children:p.map((l,m)=>(0,t.jsx)(r.SwiperSlide,{className:"!h-full items-stretch",children:(0,t.jsx)(n,{item:l})},`carousel-${m}`))}),(0,t.jsx)("div",{className:"gift-box-pagination laptop:hidden mt-3 flex justify-center [&_.swiper-pagination-bullet-active]:!bg-[#080A0F] [&_.swiper-pagination-bullet]:size-2 [&_.swiper-pagination-bullet]:rounded-full [&_.swiper-pagination-bullet]:bg-[#767880] [&_.swiper-pagination-bullet]:opacity-100"})]})})]})};var N=(0,u.withLayout)(v);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/GiftBox/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/GiftBox/index.tsx"],
-  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport type { Img } from '../../types/props.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\n\nexport type GiftBoxDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n}\n\ninterface GiftBoxType extends React.HTMLAttributes<HTMLDivElement> {\n  data: {\n    list: GiftBoxDataType[]\n  }\n}\n\nconst GiftBox = ({ data, className, ...rest }: GiftBoxType) => {\n  const { list } = data\n\n  return (\n    <div {...rest} className={cn('w-full rounded-2xl bg-[#EAEAEC]', className)}>\n      <div className=\"laptop:gap-4 tablet:grid-cols-4 laptop:grid-cols-3 desktop:grid-cols-5 lg-desktop:grid-cols-6 grid grid-cols-2 gap-3\">\n        {list.map((item, index) => (\n          <div key={index} className=\"laptop:p-[20px] flex flex-col items-center justify-center p-[12px]\">\n            <div>\n              {item?.img?.url && (\n                <Picture\n                  className=\"laptop:hidden aspect-[194/194]\"\n                  imgClassName=\"\"\n                  source={item?.img?.url}\n                  alt={item?.img?.alt || ''}\n                />\n              )}\n              {item?.mobileImg?.url && (\n                <Picture\n                  className=\"laptop:hidden aspect-[120/120]\"\n                  imgClassName=\"\"\n                  source={item?.mobileImg?.url}\n                  alt={item?.mobileImg?.alt || ''}\n                />\n              )}\n            </div>\n            <Text html={item?.title} className=\"laptop:text-[18px] text-[14px] font-bold leading-[1.4]\" />\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(GiftBox)\n"],
-  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA2BY,IAAAI,EAAA,6BA1BZC,EAAuB,iBAEvBC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAA8B,qCAc9B,MAAMC,EAAU,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAW,GAAGC,CAAK,IAAmB,CAC7D,KAAM,CAAE,KAAAC,CAAK,EAAIH,EAEjB,SACE,OAAC,OAAK,GAAGE,EAAM,aAAW,MAAG,kCAAmCD,CAAS,EACvE,mBAAC,OAAI,UAAU,uHACZ,SAAAE,EAAK,IAAI,CAACC,EAAMC,OACf,QAAC,OAAgB,UAAU,qEACzB,qBAAC,OACE,UAAAD,GAAM,KAAK,QACV,OAAC,WACC,UAAU,iCACV,aAAa,GACb,OAAQA,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,QAChB,OAAC,WACC,UAAU,iCACV,aAAa,GACb,OAAQA,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,GAEJ,KACA,OAAC,QAAK,KAAMA,GAAM,MAAO,UAAU,yDAAyD,IAnBpFC,CAoBV,CACD,EACH,EACF,CAEJ,EAEA,IAAOb,KAAQ,cAAWO,CAAO",
-  "names": ["GiftBox_exports", "__export", "GiftBox_default", "__toCommonJS", "import_jsx_runtime", "React", "import_utils", "import_Styles", "import_components", "GiftBox", "data", "className", "rest", "list", "item", "index"]
+  "sourcesContent": ["'use client'\nimport React, { useState } from 'react'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Pagination, Mousewheel, FreeMode } from 'swiper/modules'\nimport 'swiper/css'\nimport 'swiper/css/navigation'\nimport 'swiper/css/pagination'\nimport type { GiftBoxDataType, GiftBoxType } from './types.js'\n\nconst GiftItem = ({ item }: { item: GiftBoxDataType }) => (\n  <div className=\"rounded-card laptop:p-[20px] tablet:h-full tablet:px-3 laptop:px-4 lg-desktop:p-8 flex h-[120px] flex-col items-center justify-center overflow-hidden bg-[#EAEAEC] px-4 py-[12px]\">\n    <div className=\"min-h-0 flex-1\">\n      {item?.img?.url && (\n        <Picture\n          className=\"laptop:block desktop:w-[116px] lg-desktop:w-[146px] hidden aspect-[194/194] w-[88px]\"\n          imgClassName=\"\"\n          source={item?.img?.url}\n          alt={item?.img?.alt || ''}\n        />\n      )}\n      {item?.mobileImg?.url && (\n        <Picture\n          className=\"laptop:hidden block aspect-[120/120] h-full\"\n          imgClassName=\"\"\n          source={item?.mobileImg?.url}\n          alt={item?.mobileImg?.alt || ''}\n        />\n      )}\n    </div>\n    <Text\n      html={item?.title}\n      className=\"laptop:text-[18px] line-clamp-2 shrink-0 text-center text-[14px] font-bold leading-[1.4]\"\n    />\n  </div>\n)\n\nconst GiftBox = (props: GiftBoxType) => {\n  const { data, className } = props\n  const { list } = data\n\n  return (\n    <div className=\"w-full\">\n      {/* Mobile: Grid \u9759\u6001\u5E03\u5C40 2 \u5217 (<768px) */}\n      <div className={cn('tablet:hidden grid grid-cols-2 gap-3', className)}>\n        {list.map((item, index) => (\n          <GiftItem key={`mobile-${index}`} item={item} />\n        ))}\n      </div>\n\n      {/* Tablet+: Swiper \u8F6E\u64AD (\u2265768px)\n          - 768px~1024px (tablet~laptop): 4 \u4E2A\u53EF\u89C1\n          - \u22651025px (laptop+): 4.2 \u4E2A\u53EF\u89C1\n          - \u22651440px (desktop+): 6 \u4E2A\u53EF\u89C1\n      */}\n      <div className={cn('tablet:block hidden', className)}>\n        <div className=\"relative\">\n          <Swiper\n            modules={[Pagination, Mousewheel, FreeMode]}\n            freeMode={true}\n            spaceBetween={16}\n            slidesPerView=\"auto\"\n            pagination={{\n              clickable: true,\n              el: '.gift-box-pagination',\n            }}\n            mousewheel={{\n              forceToAxis: true,\n            }}\n            breakpoints={{\n              768: {\n                spaceBetween: 12,\n                slidesPerView: 4,\n              },\n              1025: {\n                spaceBetween: 16,\n                slidesPerView: 4,\n              },\n              1440: {\n                spaceBetween: 16,\n                slidesPerView: 6,\n              },\n            }}\n            className=\"laptop:!overflow-visible [&_.swiper-slide]:!h-auto [&_.swiper-wrapper]:items-stretch\"\n          >\n            {list.map((item, index) => (\n              <SwiperSlide key={`carousel-${index}`} className=\"!h-full items-stretch\">\n                <GiftItem item={item} />\n              </SwiperSlide>\n            ))}\n          </Swiper>\n          {/* \u81EA\u5B9A\u4E49 Pagination - \u4EC5 tablet \u663E\u793A */}\n          <div className=\"gift-box-pagination laptop:hidden mt-3 flex justify-center [&_.swiper-pagination-bullet-active]:!bg-[#080A0F] [&_.swiper-pagination-bullet]:size-2 [&_.swiper-pagination-bullet]:rounded-full [&_.swiper-pagination-bullet]:bg-[#767880] [&_.swiper-pagination-bullet]:opacity-100\" />\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(GiftBox)\n"],
+  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAcI,IAAAI,EAAA,6BAbJC,EAAgC,iBAChCC,EAA2B,kCAC3BC,EAA8B,qCAC9BC,EAAmB,kCACnBH,EAAoC,wBACpCI,EAAiD,0BACjDC,EAAO,sBACPC,EAAO,iCACPC,EAAO,iCAGP,MAAMC,EAAW,CAAC,CAAE,KAAAC,CAAK,OACvB,QAAC,OAAI,UAAU,oLACb,qBAAC,OAAI,UAAU,iBACZ,UAAAA,GAAM,KAAK,QACV,OAAC,WACC,UAAU,uFACV,aAAa,GACb,OAAQA,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,QAChB,OAAC,WACC,UAAU,8CACV,aAAa,GACb,OAAQA,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,GAEJ,KACA,OAAC,QACC,KAAMA,GAAM,MACZ,UAAU,2FACZ,GACF,EAGIC,EAAWC,GAAuB,CACtC,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,SACE,QAAC,OAAI,UAAU,SAEb,oBAAC,OAAI,aAAW,MAAG,uCAAwCC,CAAS,EACjE,SAAAC,EAAK,IAAI,CAACL,EAAMM,OACf,OAACP,EAAA,CAAiC,KAAMC,GAAzB,UAAUM,CAAK,EAAgB,CAC/C,EACH,KAOA,OAAC,OAAI,aAAW,MAAG,sBAAuBF,CAAS,EACjD,oBAAC,OAAI,UAAU,WACb,oBAAC,UACC,QAAS,CAAC,aAAY,aAAY,UAAQ,EAC1C,SAAU,GACV,aAAc,GACd,cAAc,OACd,WAAY,CACV,UAAW,GACX,GAAI,sBACN,EACA,WAAY,CACV,YAAa,EACf,EACA,YAAa,CACX,IAAK,CACH,aAAc,GACd,cAAe,CACjB,EACA,KAAM,CACJ,aAAc,GACd,cAAe,CACjB,EACA,KAAM,CACJ,aAAc,GACd,cAAe,CACjB,CACF,EACA,UAAU,uFAET,SAAAC,EAAK,IAAI,CAACL,EAAMM,OACf,OAAC,eAAsC,UAAU,wBAC/C,mBAACP,EAAA,CAAS,KAAMC,EAAM,GADN,YAAYM,CAAK,EAEnC,CACD,EACH,KAEA,OAAC,OAAI,UAAU,qRAAqR,GACtS,EACF,GACF,CAEJ,EAEA,IAAOlB,KAAQ,cAAWa,CAAO",
+  "names": ["GiftBox_exports", "__export", "GiftBox_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_Styles", "import_components", "import_helpers", "import_modules", "import_css", "import_navigation", "import_pagination", "GiftItem", "item", "GiftBox", "props", "data", "className", "list", "index"]
 }

package/dist/cjs/biz-components/GiftBox/types.d.ts ADDED Viewed

@@ -0,0 +1,13 @@
+import type { Img } from '../../types/props.js';
+export type GiftBoxDataType = {
+    img: Img;
+    mobileImg: Img;
+    title: string;
+};
+export type GiftBoxData = {
+    list: GiftBoxDataType[];
+};
+export type GiftBoxType = {
+    data: GiftBoxData;
+    className?: string;
+};

package/dist/cjs/biz-components/GiftBox/types.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";var i=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var r=Object.getOwnPropertyNames;var s=Object.prototype.hasOwnProperty;var x=(e,t,o,a)=>{if(t&&typeof t=="object"\|\|typeof t=="function")for(let p of r(t))!s.call(e,p)&&p!==o&&i(e,p,{get:()=>t[p],enumerable:!(a=m(t,p))\|\|a.enumerable});return e};var y=e=>x(i({},"__esModule",{value:!0}),e);var g={};module.exports=y(g);
2	+ //# sourceMappingURL=types.js.map

package/dist/cjs/biz-components/GiftBox/types.js.map ADDED Viewed

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/GiftBox/types.ts"],
+  "sourcesContent": ["import type { Img } from '../../types/props.js'\n\nexport type GiftBoxDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n}\n\nexport type GiftBoxData = {\n  list: GiftBoxDataType[]\n}\n\nexport type GiftBoxType = {\n  data: GiftBoxData\n  className?: string\n}\n"],
+  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
+  "names": ["types_exports", "__toCommonJS"]
+}

package/dist/cjs/biz-components/Graphic/index.d.ts CHANGED Viewed

@@ -14,6 +14,13 @@ type GraphicType = {
     buttonText?: string;
     icon?: Img;
     theme?: Theme;
+    backgroundImage?: {
+        default?: Img;
+        tablet?: Img;
+        laptop?: Img;
+        desktop?: Img;
+        lgDesktop?: Img;
+    };
     extension?: {
         text: string;
         textDesc: string;

package/dist/cjs/biz-components/Graphic/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var Y=Object.create;var g=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var X=Object.getPrototypeOf,Z=Object.prototype.hasOwnProperty;var F=(e,s)=>{for(var i in s)g(e,i,{get:s[i],enumerable:!0})},N=(e,s,i,c)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of Q(s))!Z.call(e,n)&&n!==i&&g(e,n,{get:()=>s[n],enumerable:!(c=q(s,n))||c.enumerable});return e};var w=(e,s,i)=>(i=e!=null?Y(X(e)):{},N(s||!e||!e.__esModule?g(i,"default",{value:e,enumerable:!0}):i,e)),J=e=>N(g({},"__esModule",{value:!0}),e);var W={};F(W,{default:()=>O});module.exports=J(W);var t=require("react/jsx-runtime"),V=require("react-responsive"),o=w(require("react")),$=require("react-dom"),m=require("../../helpers/utils.js"),P=require("../../shared/Styles.js"),L=w(require("../SwiperBox/index.js")),p=require("../../components/index.js"),G=w(require("../Title/index.js")),S=require("../VideoModal/index.js"),H=require("../TextModal/index.js"),y=require("../../hooks/useExposure.js"),T=require("../../shared/trackUrlRef.js"),B=require("../AiuiProvider/index.js");const h="image",u="graphic",I="descTitle lg-desktop:text-[32px] desktop:mt-2 desktop:text-[24px] text-lines-2 mt-1 line-clamp-3 flex-1 text-[24px] font-bold leading-[1.2]",K=({data:e,configuration:s})=>{const i=(0,o.useRef)(null),[c,n]=(0,o.useState)({visible:!1,x:0,y:0,text:""}),d=()=>{switch(s.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[346] tablet:aspect-h-[360] laptop:aspect-w-[440] laptop:aspect-h-[360] desktop:aspect-w-[648] desktop:aspect-h-[384] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[427] desktop:aspect-h-[384] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[480]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[316] desktop:aspect-h-[384] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480]"}},v=l=>{e?.description&&n({visible:!0,x:l.clientX,y:l.clientY,text:e.description})},b=()=>{n(l=>({...l,visible:!1}))};return(0,y.useExposure)(i,{componentType:h,componentName:u,componentTitle:e?.title,componentDescription:e?.description,position:s?.index+1}),(0,t.jsx)("div",{ref:i,className:(0,m.cn)(d(),"graphicItem","laptop:h-auto text-info-primary md-tablet:h-[360px] flex-1 shrink-0 md:basis-[296px]",{"aiui-dark":e.theme==="dark"}),children:(0,t.jsx)("div",{className:(0,m.cn)("absolute inset-0",{"rounded-xl overflow-hidden laptop:rounded-2xl":s?.itemShape==="round"}),children:(0,t.jsxs)("div",{className:`graphic-children relative block size-full overflow-hidden ${e?.href?"cursor-pointer":""}`,children:[e?.href?(0,t.jsx)("a",{"aria-label":e?.title??e?.description,href:(0,T.trackUrlRef)((0,m.getLocalizedPath)(e?.href||"",s?.locale||"us"),`${h}_${u}`),className:"block size-full overflow-hidden","data-headless-nav-position":`''#${s?.index+1}`,"data-headless-type-name":`${h}#${u}`,"data-headless-title-desc-button":`${e?.title}#${e?.description}`,children:(0,t.jsx)(p.Picture,{className:"h-full",imgClassName:"h-full object-cover tablet:hover:scale-110 transition-all duration-300",source:e?.imgUrl?.url,alt:e?.imgUrl?.alt||""})}):(0,t.jsx)("div",{className:"block size-full overflow-hidden",children:(0,t.jsx)(p.Picture,{className:"h-full",imgClassName:"h-full object-cover tablet:hover:scale-110 transition-all duration-300",source:e?.imgUrl?.url,alt:e?.imgUrl?.alt||""})}),(0,t.jsxs)("div",{className:"laptop:p-6 absolute bottom-0 z-[1] box-border flex w-full flex-col p-4",children:[(0,t.jsxs)("div",{className:(0,m.cn)("flex items-end gap-1 overflow-hidden","graphic-bottom"),children:[(0,t.jsxs)("div",{className:"flex-1 overflow-hidden",children:[(0,t.jsx)(p.Text,{html:e?.title,style:{color:e?.textColor},className:"spanTitle graphic-title lg-desktop:text-lg desktop:text-base line-clamp-3 text-sm font-bold leading-[1.2]"}),e?.description&&(0,t.jsxs)("div",{onMouseMove:v,onMouseLeave:b,children:[e?.title?(0,t.jsx)(p.Heading,{html:e?.description,style:{color:e?.textColor},as:"h3",className:`${I} graphic-description`}):(0,t.jsx)("h3",{style:{color:e?.textColor},dangerouslySetInnerHTML:{__html:e?.description||""},className:`${I} graphic-description-item`}),typeof window<"u"&&c.visible&&(0,$.createPortal)((0,t.jsx)("div",{className:"pointer-events-none fixed z-[9999] max-w-xs rounded-lg bg-black/60 px-3 py-2 text-sm text-white shadow-lg backdrop-blur-sm transition-opacity duration-200",style:{left:`${c.x+16}px`,top:`${c.y+16}px`},children:c.text}),document.body)]})]}),!e?.isShowIcon&&(e?.video?.url||e?.youtubeId)&&(0,t.jsx)("button",{"aria-label":"Play Video",onClick:l=>{l.preventDefault(),l.stopPropagation(),s?.onVideoPlayBtnClick?.(s?.index||0,e)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white/20 hover:bg-black/75",children:(0,t.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})}),e?.isShowIcon&&e?.icon?.url&&(0,t.jsx)("button",{onClick:l=>{l.preventDefault(),l.stopPropagation(),s?.onIconClick?.(e,s)},className:"laptop:size-9 flex size-8 items-center justify-center overflow-hidden rounded-full bg-white/20 hover:bg-black/75",children:(0,t.jsx)(p.Picture,{className:"h-full",imgClassName:"h-full object-cover",source:e?.icon?.url,alt:e?.icon?.alt||""})})]}),e.buttonText&&(0,t.jsx)(p.Button,{as:"a","aria-label":e?.title??e?.description,variant:"secondary",className:"bgButton mt-[8px] self-start",href:(0,T.trackUrlRef)((0,m.getLocalizedPath)(e?.href||"",s?.locale||"us"),`${h}_${u}`),"data-headless-nav-position":`''#${s?.index+1}`,"data-headless-type-name":`${h}#${u}`,"data-headless-title-desc-button":`${e?.title}#${e?.description}#${e?.buttonText}`,children:e.buttonText})]})]})})})},C=o.default.forwardRef(({data:e,className:s,...i},c)=>{const n=(0,V.useMediaQuery)({query:"(max-width: 768px)"}),d=(0,o.useRef)(null),[v,b]=(0,o.useState)(!1),[l,E]=(0,o.useState)(""),[D,U]=(0,o.useState)(""),[z,R]=(0,o.useState)(""),[j,k]=(0,o.useState)(null),[_,M]=(0,o.useState)(!1),{locale:A="us"}=(0,B.useAiuiContext)(),x=a=>{const r=e?.items?.length>3,f=e?.items?.length>2;switch(a){case 1440:return r?4:e?.items?.length;case 1024:return r?3:e?.items?.length;case 768:return e?.items?.length===1?1:r||f?2.3:2;default:return e?.items?.length===1?1:1.2}};return(0,o.useImperativeHandle)(c,()=>d.current),(0,y.useExposure)(d,{componentType:h,componentName:u,componentTitle:e?.title}),(0,o.useEffect)(()=>{const a=d.current?.querySelectorAll(".graphic-description");if(a&&a.length>0){let r=0;a.forEach(f=>{r=Math.max(r,f.offsetHeight)}),a.forEach(f=>{f.style.height=`${r}px`})}},[]),(0,t.jsxs)("div",{...i,ref:d,className:(0,m.cn)("graphicBlock",s),children:[(0,t.jsxs)("div",{className:"graphic-box",children:[e?.title&&(0,t.jsx)(G.default,{data:{title:e?.title}}),(0,t.jsx)(L.default,{id:"Graphic",className:(0,m.cn)("!overflow-visible"),data:{list:e?.items||[],configuration:{itemShape:e.itemShape,num:e?.items?.length||0,locale:A,onVideoPlayBtnClick:(a,r)=>{b(!0),r?.isYouTube?U?.(r?.youtubeId||""):(E?.(r?.video?.url||""),R?.(r?.mobileVideo?.url||""))},onIconClick:a=>{M(!0),k(a)},title:e?.title}},Slide:K,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:x()},768:{spaceBetween:16,freeMode:!1,slidesPerView:x(768)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:x(1024)},1440:{spaceBetween:16,freeMode:!1,slidesPerView:x(1440)}}})]}),(0,t.jsx)(S.VideoModal,{visible:v,youTubeId:D,onCloseModal:()=>b(!1),videoUrl:n&&z||l}),(0,t.jsx)(H.TextModal,{textVisible:_,extension:j?.extension,onCloseModal:()=>{M(!1),k(null)}})]})});C.displayName="Graphic";var O=(0,P.withLayout)(C);
+"use strict";"use client";var q=Object.create;var x=Object.defineProperty;var Q=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames;var Z=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var J=(e,o)=>{for(var s in o)x(e,s,{get:o[s],enumerable:!0})},I=(e,o,s,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of X(o))!F.call(e,r)&&r!==s&&x(e,r,{get:()=>o[r],enumerable:!(n=Q(o,r))||n.enumerable});return e};var v=(e,o,s)=>(s=e!=null?q(Z(e)):{},I(o||!e||!e.__esModule?x(s,"default",{value:e,enumerable:!0}):s,e)),K=e=>I(x({},"__esModule",{value:!0}),e);var ee={};J(ee,{default:()=>W});module.exports=K(ee);var t=require("react/jsx-runtime"),C=require("react-responsive"),i=v(require("react")),V=require("react-dom"),a=require("../../helpers/utils.js"),S=require("../../shared/Styles.js"),P=v(require("../SwiperBox/index.js")),p=require("../../components/index.js"),G=v(require("../Title/index.js")),D=require("../VideoModal/index.js"),L=require("../TextModal/index.js"),w=require("../../hooks/useExposure.js"),k=require("../../shared/trackUrlRef.js"),B=require("../AiuiProvider/index.js");const u="image",h="graphic",M=e=>{let o="";const s=l=>(l?.url&&(o=l.url),o),n=s(e.lgDesktop),r=s(e.desktop),m=s(e.laptop),b=s(e.tablet),d=e.default?.url;return[`${n} 9999`,`${r} 1919`,`${m} 1439`,`${b} 1024`,`${d} 768`].join(", ")},N="descTitle lg-desktop:text-[32px] desktop:mt-2 desktop:text-[24px] text-lines-2 mt-1 line-clamp-3 flex-1 text-[24px] font-bold leading-[1.2]",O=({data:e,configuration:o})=>{const s=(0,i.useRef)(null),[n,r]=(0,i.useState)({visible:!1,x:0,y:0,text:""}),m=()=>{switch(o.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[346] tablet:aspect-h-[360] laptop:aspect-w-[440] laptop:aspect-h-[360] desktop:aspect-w-[648] desktop:aspect-h-[384] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[427] desktop:aspect-h-[384] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[480]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[316] desktop:aspect-h-[384] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480]"}},b=l=>{e?.description&&r({visible:!0,x:l.clientX,y:l.clientY,text:e.description})},d=()=>{r(l=>({...l,visible:!1}))};return(0,w.useExposure)(s,{componentType:u,componentName:h,componentTitle:e?.title,componentDescription:e?.description,position:o?.index+1}),(0,t.jsx)("div",{ref:s,className:(0,a.cn)(m(),"graphicItem","laptop:h-auto text-info-primary md-tablet:h-[360px] flex-1 shrink-0 md:basis-[296px]",{"aiui-dark":e.theme==="dark"}),children:(0,t.jsx)("div",{className:(0,a.cn)("absolute inset-0",{"rounded-xl overflow-hidden laptop:rounded-2xl":o?.itemShape==="round"}),children:(0,t.jsxs)("div",{className:`graphic-children relative block size-full overflow-hidden ${e?.href?"cursor-pointer":""}`,children:[e?.href?(0,t.jsx)("a",{"aria-label":e?.title??e?.description,href:(0,k.trackUrlRef)(e?.href||"",`${u}_${h}`),className:"rounded-card block size-full overflow-hidden","data-headless-nav-postion":`''#${o?.index+1}`,"data-headless-type-name":`${u}#${h}`,"data-headless-title-desc-button":`${e?.title}#${e?.description}`,children:(0,t.jsx)(p.Picture,{className:"h-full",imgClassName:"h-full object-cover tablet:hover:scale-110 transition-all duration-300",source:e?.backgroundImage?.default?M(e.backgroundImage):e?.imgUrl?.url,alt:e?.backgroundImage?.lgDesktop?.alt||e?.backgroundImage?.default?.alt||e?.imgUrl?.alt||""})}):(0,t.jsx)("div",{className:"rounded-card block size-full overflow-hidden",children:(0,t.jsx)(p.Picture,{className:"h-full",imgClassName:"h-full object-cover tablet:hover:scale-110 transition-all duration-300",source:e?.backgroundImage?.default?M(e.backgroundImage):e?.imgUrl?.url||"",alt:e?.backgroundImage?.lgDesktop?.alt||e?.backgroundImage?.default?.alt||e?.imgUrl?.alt||""})}),(0,t.jsxs)("div",{className:"laptop:p-6 absolute bottom-0 z-[1] box-border flex w-full flex-col p-4",children:[(0,t.jsxs)("div",{className:(0,a.cn)("flex items-end gap-1 overflow-hidden","graphic-bottom"),children:[(0,t.jsxs)("div",{className:"flex-1 overflow-hidden",children:[(0,t.jsx)(p.Text,{html:e?.title,style:{color:e?.textColor},className:"spanTitle graphic-title lg-desktop:text-lg desktop:text-base line-clamp-3 text-sm font-bold leading-[1.2]"}),e?.description&&(0,t.jsxs)("div",{onMouseMove:b,onMouseLeave:d,children:[e?.title?(0,t.jsx)(p.Heading,{html:e?.description,style:{color:e?.textColor},as:"h3",className:`${N} graphic-description`}):(0,t.jsx)("h3",{style:{color:e?.textColor},dangerouslySetInnerHTML:{__html:e?.description||""},className:`${N} graphic-description-item`}),typeof window<"u"&&n.visible&&(0,V.createPortal)((0,t.jsx)("div",{className:"pointer-events-none fixed z-[9999] max-w-xs rounded-lg bg-black/60 px-3 py-2 text-sm text-white shadow-lg backdrop-blur-sm transition-opacity duration-200",style:{left:`${n.x+16}px`,top:`${n.y+16}px`},children:n.text}),document.body)]})]}),!e?.isShowIcon&&(e?.video?.url||e?.youtubeId)&&(0,t.jsx)("button",{"aria-label":"Play Video",onClick:l=>{l.preventDefault(),l.stopPropagation(),o?.onVideoPlayBtnClick?.(o?.index||0,e)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white/20 hover:bg-black/75",children:(0,t.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})}),e?.isShowIcon&&e?.icon?.url&&(0,t.jsx)("button",{onClick:l=>{l.preventDefault(),l.stopPropagation(),o?.onIconClick?.(e,o)},className:"laptop:size-9 flex size-8 items-center justify-center overflow-hidden rounded-full bg-white/20 hover:bg-black/75",children:(0,t.jsx)(p.Picture,{className:"h-full",imgClassName:"h-full object-cover",source:e?.icon?.url,alt:e?.icon?.alt||""})})]}),e.buttonText&&(0,t.jsx)(p.Button,{as:"a","aria-label":e?.title??e?.description,variant:"secondary",className:"bgButton mt-[8px] self-start",href:(0,k.trackUrlRef)((0,a.getLocalizedPath)(e?.href||"",o?.locale||"us"),`${u}_${h}`),"data-headless-nav-position":`''#${o?.index+1}`,"data-headless-type-name":`${u}#${h}`,"data-headless-title-desc-button":`${e?.title}#${e?.description}#${e?.buttonText}`,children:e.buttonText})]})]})})})},$=i.default.forwardRef(({data:e,className:o,...s},n)=>{const r=(0,C.useMediaQuery)({query:"(max-width: 768px)"}),m=(0,i.useRef)(null),[b,d]=(0,i.useState)(!1),[l,U]=(0,i.useState)(""),[z,H]=(0,i.useState)(""),[E,R]=(0,i.useState)(""),[j,y]=(0,i.useState)(null),[_,T]=(0,i.useState)(!1),{locale:Y="us"}=(0,B.useAiuiContext)(),f=g=>{const c=e?.items?.length>3,A=e?.items?.length>2;switch(g){case 1440:return c?4:e?.items?.length;case 1024:return c?3:e?.items?.length;case 768:return e?.items?.length===1?1:c||A?2.3:2;default:return e?.items?.length===1?1:1.2}};return(0,i.useImperativeHandle)(n,()=>m.current),(0,w.useExposure)(m,{componentType:u,componentName:h,componentTitle:e?.title}),(0,t.jsxs)("div",{...s,ref:m,className:(0,a.cn)("graphicBlock",o),children:[(0,t.jsxs)("div",{className:"graphic-box",children:[e?.title&&(0,t.jsx)(G.default,{data:{title:e?.title}}),(0,t.jsx)(P.default,{id:"Graphic",className:(0,a.cn)("!overflow-visible"),data:{list:e?.items||[],configuration:{itemShape:e.itemShape,num:e?.items?.length||0,locale:Y,onVideoPlayBtnClick:(g,c)=>{d(!0),c?.isYouTube?H?.(c?.youtubeId||""):(U?.(c?.video?.url||""),R?.(c?.mobileVideo?.url||""))},onIconClick:g=>{T(!0),y(g)},title:e?.title}},Slide:O,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:f()},768:{spaceBetween:16,freeMode:!1,slidesPerView:f(768)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:f(1024)},1440:{spaceBetween:16,freeMode:!1,slidesPerView:f(1440)}}})]}),(0,t.jsx)(D.VideoModal,{visible:b,youTubeId:z,onCloseModal:()=>d(!1),videoUrl:r&&E||l}),(0,t.jsx)(L.TextModal,{textVisible:_,extension:j?.extension,onCloseModal:()=>{T(!1),y(null)}})]})});$.displayName="Graphic";var W=(0,S.withLayout)($);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/Graphic/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Graphic/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { useMediaQuery } from 'react-responsive'\nimport React, { useEffect, useImperativeHandle, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { cn, getLocalizedPath } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { Button, Heading, Picture, Text } from '../../components/index.js'\nimport Title from '../Title/index.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { TextModal } from '../TextModal/index.js'\nimport type { ComponentCommonProps, Video, Img, Theme } from '../../types/props.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\n\nconst componentType = 'image'\nconst componentName = 'graphic'\n\ntype GraphicType = {\n  imgUrl: Img\n  title: string\n  description?: string\n  textColor?: string\n  href?: string\n  video?: Video\n  mobileVideo?: Video\n  youtubeId?: string\n  isYouTube?: boolean\n  isShowIcon?: boolean\n  buttonText?: string\n  icon?: Img\n  theme?: Theme\n  extension?: {\n    text: string\n    textDesc: string\n    textTitle: string\n    textPcImg: Img\n    textMobileImg: Img\n  }\n}\n\nconst descriptionClass =\n  'descTitle lg-desktop:text-[32px] desktop:mt-2 desktop:text-[24px] text-lines-2 mt-1 line-clamp-3 flex-1 text-[24px] font-bold leading-[1.2]'\nexport interface GraphicProps extends ComponentCommonProps, React.HTMLAttributes<HTMLDivElement> {\n  data: {\n    title?: string\n    items?: GraphicType[]\n    itemShape?: 'round' | 'square'\n    itemTheme?: Theme\n  }\n}\n\nconst Item = ({ data, configuration }: { data: GraphicType; configuration?: any }) => {\n  const ref = useRef<HTMLDivElement>(null)\n  const [tooltip, setTooltip] = useState<{ visible: boolean; x: number; y: number; text: string }>({\n    visible: false,\n    x: 0,\n    y: 0,\n    text: '',\n  })\n\n  const handleAspect = () => {\n    switch (configuration.num) {\n      case 1:\n        return 'tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]'\n      case 2:\n        return 'tablet:aspect-w-[346] tablet:aspect-h-[360] laptop:aspect-w-[440] laptop:aspect-h-[360] desktop:aspect-w-[648] desktop:aspect-h-[384] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480]'\n      case 3:\n        return 'tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[427] desktop:aspect-h-[384] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[480]'\n      default:\n        return 'tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[316] desktop:aspect-h-[384] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480]'\n    }\n  }\n\n  const handleMouseMove = (e: React.MouseEvent) => {\n    if (data?.description) {\n      setTooltip({\n        visible: true,\n        x: e.clientX,\n        y: e.clientY,\n        text: data.description,\n      })\n    }\n  }\n\n  const handleMouseLeave = () => {\n    setTooltip(prev => ({ ...prev, visible: false }))\n  }\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n    componentDescription: data?.description,\n    position: configuration?.index + 1,\n  })\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        handleAspect(),\n        'graphicItem',\n        'laptop:h-auto text-info-primary md-tablet:h-[360px] flex-1 shrink-0 md:basis-[296px]',\n        {\n          'aiui-dark': data.theme === 'dark',\n        }\n      )}\n    >\n      <div\n        className={cn('absolute inset-0', {\n          ['rounded-xl overflow-hidden laptop:rounded-2xl']: configuration?.itemShape === 'round',\n        })}\n      >\n        <div\n          className={`graphic-children relative block size-full overflow-hidden ${data?.href ? 'cursor-pointer' : ''}`}\n        >\n          {data?.href ? (\n            <a\n              aria-label={data?.title ?? data?.description}\n              href={trackUrlRef(\n                getLocalizedPath(data?.href || '', configuration?.locale || 'us'),\n                `${componentType}_${componentName}`\n              )}\n              className=\"block size-full overflow-hidden\"\n              data-headless-nav-position={`''#${configuration?.index + 1}`}\n              data-headless-type-name={`${componentType}#${componentName}`}\n              data-headless-title-desc-button={`${data?.title}#${data?.description}`}\n            >\n              <Picture\n                className=\"h-full\"\n                imgClassName=\"h-full object-cover tablet:hover:scale-110 transition-all duration-300\"\n                source={data?.imgUrl?.url}\n                alt={data?.imgUrl?.alt || ''}\n              />\n            </a>\n          ) : (\n            <div className=\"block size-full overflow-hidden\">\n              <Picture\n                className=\"h-full\"\n                imgClassName=\"h-full object-cover tablet:hover:scale-110 transition-all duration-300\"\n                source={data?.imgUrl?.url}\n                alt={data?.imgUrl?.alt || ''}\n              />\n            </div>\n          )}\n          <div className=\"laptop:p-6 absolute bottom-0 z-[1] box-border flex w-full flex-col p-4\">\n            <div className={cn('flex items-end gap-1 overflow-hidden', 'graphic-bottom')}>\n              <div className=\"flex-1 overflow-hidden\">\n                <Text\n                  html={data?.title}\n                  style={{ color: data?.textColor }}\n                  className=\"spanTitle graphic-title lg-desktop:text-lg desktop:text-base line-clamp-3 text-sm font-bold leading-[1.2]\"\n                />\n                {data?.description && (\n                  <div onMouseMove={handleMouseMove} onMouseLeave={handleMouseLeave}>\n                    {data?.title ? (\n                      <Heading\n                        html={data?.description}\n                        style={{\n                          color: data?.textColor,\n                        }}\n                        as=\"h3\"\n                        className={`${descriptionClass} graphic-description`}\n                      />\n                    ) : (\n                      <h3\n                        style={{\n                          color: data?.textColor,\n                        }}\n                        dangerouslySetInnerHTML={{ __html: data?.description || '' }}\n                        className={`${descriptionClass} graphic-description-item`}\n                      />\n                    )}\n                    {typeof window !== 'undefined' &&\n                      tooltip.visible &&\n                      createPortal(\n                        <div\n                          className=\"pointer-events-none fixed z-[9999] max-w-xs rounded-lg bg-black/60 px-3 py-2 text-sm text-white shadow-lg backdrop-blur-sm transition-opacity duration-200\"\n                          style={{\n                            left: `${tooltip.x + 16}px`,\n                            top: `${tooltip.y + 16}px`,\n                          }}\n                        >\n                          {tooltip.text}\n                        </div>,\n                        document.body\n                      )}\n                  </div>\n                )}\n              </div>\n              {!data?.isShowIcon && (data?.video?.url || data?.youtubeId) && (\n                <button\n                  aria-label=\"Play Video\"\n                  onClick={(e: any) => {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    configuration?.onVideoPlayBtnClick?.(configuration?.index || 0, data)\n                  }}\n                  className=\"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white/20 hover:bg-black/75\"\n                >\n                  <svg width=\"12\" height=\"14\" viewBox=\"0 0 12 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path d=\"M12 7L0 14L0 0L12 7Z\" fill=\"white\" />\n                  </svg>\n                </button>\n              )}\n              {data?.isShowIcon && data?.icon?.url && (\n                <button\n                  onClick={(e: any) => {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    configuration?.onIconClick?.(data, configuration)\n                  }}\n                  className=\"laptop:size-9 flex size-8 items-center justify-center overflow-hidden rounded-full bg-white/20 hover:bg-black/75\"\n                >\n                  <Picture\n                    className=\"h-full\"\n                    imgClassName=\"h-full object-cover\"\n                    source={data?.icon?.url}\n                    alt={data?.icon?.alt || ''}\n                  />\n                </button>\n              )}\n            </div>\n            {data.buttonText && (\n              <Button\n                as=\"a\"\n                aria-label={data?.title ?? data?.description}\n                variant=\"secondary\"\n                className=\"bgButton mt-[8px] self-start\"\n                href={trackUrlRef(\n                  getLocalizedPath(data?.href || '', configuration?.locale || 'us'),\n                  `${componentType}_${componentName}`\n                )}\n                data-headless-nav-position={`''#${configuration?.index + 1}`}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${data?.title}#${data?.description}#${data?.buttonText}`}\n              >\n                {data.buttonText}\n              </Button>\n            )}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst Graphic = React.forwardRef<HTMLDivElement, GraphicProps>(({ data, className, ...rest }, ref) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  const innerRef = useRef<HTMLDivElement>(null)\n  const [visible, setVisible] = useState<boolean>(false)\n  const [videoUrl, setVideoUrl] = useState<string>('')\n  const [youTubeId, setYouTubeId] = useState<string>('')\n  const [mobileVideoUrl, setMobileVideoUrl] = useState<string>('')\n  const [currentItem, setCurrentItem] = useState<GraphicType | null>(null)\n  const [textVisible, setTextVisible] = useState<boolean>(false)\n  const { locale = 'us' } = useAiuiContext()\n\n  const handleSwiperShow = (width?: number) => {\n    const isShow = (data?.items as GraphicType[])?.length > 3\n    const isMobile = (data?.items as GraphicType[])?.length > 2\n    switch (width) {\n      case 1440:\n        return isShow ? 4 : data?.items?.length\n      case 1024:\n        return isShow ? 3 : data?.items?.length\n      case 768:\n        if ((data?.items as GraphicType[])?.length === 1) return 1 // \u2705 \u65B0\u589E\uFF1A\u53EA\u6709\u4E00\u4E2A item \u65F6\uFF0C\u5C55\u793A 1 \u4E2A\n        return isShow ? 2.3 : isMobile ? 2.3 : 2\n      default:\n        if ((data?.items as GraphicType[])?.length === 1) return 1 // \u2705 \u65B0\u589E\uFF1A\u53EA\u6709\u4E00\u4E2A item \u65F6\uFF0C\u5C55\u793A 1 \u4E2A\n        return 1.2\n    }\n  }\n\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n  })\n\n  useEffect(() => {\n    const descriptions = innerRef.current?.querySelectorAll<HTMLDivElement>('.graphic-description')\n    if (descriptions && descriptions.length > 0) {\n      let maxHeight = 0\n      descriptions.forEach((el: HTMLDivElement) => {\n        maxHeight = Math.max(maxHeight, el.offsetHeight)\n      })\n      descriptions.forEach((el: HTMLDivElement) => {\n        el.style.height = `${maxHeight}px`\n      })\n    }\n  }, [])\n\n  return (\n    <div {...rest} ref={innerRef} className={cn('graphicBlock', className)}>\n      <div className=\"graphic-box\">\n        {data?.title && <Title data={{ title: data?.title }} />}\n        <SwiperBox\n          id=\"Graphic\"\n          className={cn('!overflow-visible')}\n          data={{\n            list: data?.items || [],\n            configuration: {\n              itemShape: data.itemShape,\n              num: data?.items?.length || 0,\n              locale,\n              onVideoPlayBtnClick: (_: number, data: GraphicType) => {\n                setVisible(true)\n                if (data?.isYouTube) {\n                  setYouTubeId?.(data?.youtubeId || '')\n                } else {\n                  setVideoUrl?.(data?.video?.url || '')\n                  setMobileVideoUrl?.(data?.mobileVideo?.url || '')\n                }\n              },\n              onIconClick: (data: GraphicType) => {\n                setTextVisible(true)\n                setCurrentItem(data)\n              },\n              title: data?.title,\n            },\n          }}\n          Slide={Item}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(),\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(768),\n            },\n            1024: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(1024),\n            },\n            1440: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(1440),\n            },\n          }}\n        />\n      </div>\n      <VideoModal\n        visible={visible}\n        youTubeId={youTubeId}\n        onCloseModal={() => setVisible(false)}\n        videoUrl={isMobile ? mobileVideoUrl || videoUrl : videoUrl}\n      />\n      <TextModal\n        textVisible={textVisible}\n        extension={currentItem?.extension}\n        onCloseModal={() => {\n          setTextVisible(false)\n          setCurrentItem(null)\n        }}\n      />\n    </div>\n  )\n})\n\nGraphic.displayName = 'Graphic'\n\nexport default withLayout(Graphic)\n"],
-  "mappings": "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",
-  "names": ["Graphic_exports", "__export", "Graphic_default", "__toCommonJS", "import_jsx_runtime", "import_react_responsive", "import_react", "import_react_dom", "import_utils", "import_Styles", "import_SwiperBox", "import_components", "import_Title", "import_VideoModal", "import_TextModal", "import_useExposure", "import_trackUrlRef", "import_AiuiProvider", "componentType", "componentName", "descriptionClass", "Item", "data", "configuration", "ref", "tooltip", "setTooltip", "handleAspect", "handleMouseMove", "e", "handleMouseLeave", "prev", "Graphic", "React", "className", "rest", "isMobile", "innerRef", "visible", "setVisible", "videoUrl", "setVideoUrl", "youTubeId", "setYouTubeId", "mobileVideoUrl", "setMobileVideoUrl", "currentItem", "setCurrentItem", "textVisible", "setTextVisible", "locale", "handleSwiperShow", "width", "isShow", "descriptions", "maxHeight", "el", "Title", "SwiperBox", "_"]
+  "sourcesContent": ["'use client'\nimport { useMediaQuery } from 'react-responsive'\nimport React, { useEffect, useImperativeHandle, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { cn, getLocalizedPath } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { Button, Heading, Picture, Text } from '../../components/index.js'\nimport Title from '../Title/index.js'\nimport { VideoModal } from '../VideoModal/index.js'\nimport { TextModal } from '../TextModal/index.js'\nimport type { ComponentCommonProps, Video, Img, Theme } from '../../types/props.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\n\nconst componentType = 'image'\nconst componentName = 'graphic'\n\ntype GraphicType = {\n  imgUrl: Img\n  title: string\n  description?: string\n  textColor?: string\n  href?: string\n  video?: Video\n  mobileVideo?: Video\n  youtubeId?: string\n  isYouTube?: boolean\n  isShowIcon?: boolean\n  buttonText?: string\n  icon?: Img\n  theme?: Theme\n  backgroundImage?: {\n    default?: Img\n    tablet?: Img\n    laptop?: Img\n    desktop?: Img\n    lgDesktop?: Img\n  }\n  extension?: {\n    text: string\n    textDesc: string\n    textTitle: string\n    textPcImg: Img\n    textMobileImg: Img\n  }\n}\n\n/**\n * \u5C06 backgroundImage \u5404\u5C3A\u5BF8\u5B57\u6BB5\u62FC\u63A5\u6210 Picture source \u5B57\u7B26\u4E32\u683C\u5F0F\n *\n * Picture \u5185\u90E8\u5339\u914D\u89C4\u5219\uFF1A\u5BF9\u6BCF\u4E2A deviceSize\uFF0C\u8FC7\u6EE4 breakpoint >= deviceSize \u7684\u6761\u76EE\uFF0C\u53D6\u6700\u540E\u4E00\u4E2A (.pop())\u3002\n * \u56E0\u6B64 source \u5B57\u7B26\u4E32\u5185\u65AD\u70B9\u5FC5\u987B\u300C\u7531\u5927\u5230\u5C0F\u300D\u6392\u5217\uFF0C\u624D\u80FD\u8BA9 .pop() \u5339\u914D\u5230\u6700\u63A5\u8FD1\u81EA\u8EAB\u7684\u65AD\u70B9\u3002\n *\n * \u65AD\u70B9\u5BF9\u5E94\u5173\u7CFB (max-width):\n *   lgDesktop \u2192 1919px  (\u22641920px, \u5145\u5F53\u6700\u5927\u5C4F\u5C4F\u5E55\u5339\u914D\u5C42)\n *   desktop  \u2192 1439px  (1440px - 1919px)\n *   laptop   \u2192 1024px  (1025px - 1439px)\n *   tablet   \u2192 767px   (768px - 1024px)\n *   default  \u2192 \u9996\u4F4D\u65E0\u65AD\u70B9\uFF0C\u5145\u5F53 <img src> (\u79FB\u52A8\u7AEF <768px \u5C4F\u5E55)\n *\n * \u7EE7\u627F\u89C4\u5219\uFF08\u5927 \u2192 \u5C0F\uFF09\uFF1A\u672A\u914D\u7F6E\u7684\u5C3A\u5BF8\u81EA\u52A8\u7EE7\u627F\u4E0A\u4E00\u5C3A\u5BF8\uFF0C\u6700\u7EC8 fallback \u5230 default\n */\nconst buildPictureSource = (bg: NonNullable<GraphicType['backgroundImage']>): string => {\n  // \u7531\u5927\u5230\u5C0F\u7EE7\u627F\uFF1A\u672A\u914D\u7F6E\u7684\u5C3A\u5BF8\u7EE7\u627F\u4E0A\u4E00\u5C3A\u5BF8\n  let last = ''\n  const resolve = (img?: Img) => {\n    if (img?.url) last = img.url\n    return last\n  }\n  const lgDesktopSrc = resolve(bg.lgDesktop)\n  const desktopSrc = resolve(bg.desktop)\n  const laptopSrc = resolve(bg.laptop)\n  const tabletSrc = resolve(bg.tablet)\n  // default \u65E0\u65AD\u70B9\uFF0C\u4F5C\u4E3A\u9996\u4F4D\u5145\u5F53 <img src>(\u79FB\u52A8\u7AEF\u5C4F\u5E55)\n  const defaultSrc = bg.default?.url\n  return [\n    `${lgDesktopSrc} 9999`, // \u22641920px\n    `${desktopSrc} 1919`, // 1440-1919px\n    `${laptopSrc} 1439`, // 1025-1439px\n    `${tabletSrc} 1024`, // 768-1024px\n    `${defaultSrc} 768`, // \u9996\u4F4D\u65E0\u65AD\u70B9 \u2192 <img src>(<768px)\n  ].join(', ')\n}\nconst descriptionClass =\n  'descTitle lg-desktop:text-[32px] desktop:mt-2 desktop:text-[24px] text-lines-2 mt-1 line-clamp-3 flex-1 text-[24px] font-bold leading-[1.2]'\nexport interface GraphicProps extends ComponentCommonProps, React.HTMLAttributes<HTMLDivElement> {\n  data: {\n    title?: string\n    items?: GraphicType[]\n    itemShape?: 'round' | 'square'\n    itemTheme?: Theme\n  }\n}\n\nconst Item = ({ data, configuration }: { data: GraphicType; configuration?: any }) => {\n  const ref = useRef<HTMLDivElement>(null)\n  const [tooltip, setTooltip] = useState<{ visible: boolean; x: number; y: number; text: string }>({\n    visible: false,\n    x: 0,\n    y: 0,\n    text: '',\n  })\n\n  const handleAspect = () => {\n    switch (configuration.num) {\n      case 1:\n        return 'tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]'\n      case 2:\n        return 'tablet:aspect-w-[346] tablet:aspect-h-[360] laptop:aspect-w-[440] laptop:aspect-h-[360] desktop:aspect-w-[648] desktop:aspect-h-[384] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480]'\n      case 3:\n        return 'tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[427] desktop:aspect-h-[384] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[480]'\n      default:\n        return 'tablet:aspect-w-[296] tablet:aspect-h-[360] laptop:aspect-w-[288] laptop:aspect-h-[360] desktop:aspect-w-[316] desktop:aspect-h-[384] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480]'\n    }\n  }\n\n  const handleMouseMove = (e: React.MouseEvent) => {\n    if (data?.description) {\n      setTooltip({\n        visible: true,\n        x: e.clientX,\n        y: e.clientY,\n        text: data.description,\n      })\n    }\n  }\n\n  const handleMouseLeave = () => {\n    setTooltip(prev => ({ ...prev, visible: false }))\n  }\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n    componentDescription: data?.description,\n    position: configuration?.index + 1,\n  })\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        handleAspect(),\n        'graphicItem',\n        'laptop:h-auto text-info-primary md-tablet:h-[360px] flex-1 shrink-0 md:basis-[296px]',\n        {\n          'aiui-dark': data.theme === 'dark',\n        }\n      )}\n    >\n      <div\n        className={cn('absolute inset-0', {\n          ['rounded-xl overflow-hidden laptop:rounded-2xl']: configuration?.itemShape === 'round',\n        })}\n      >\n        <div\n          className={`graphic-children relative block size-full overflow-hidden ${data?.href ? 'cursor-pointer' : ''}`}\n        >\n          {data?.href ? (\n            <a\n              aria-label={data?.title ?? data?.description}\n              href={trackUrlRef(data?.href || '', `${componentType}_${componentName}`)}\n              className=\"rounded-card block size-full overflow-hidden\"\n              data-headless-nav-postion={`''#${configuration?.index + 1}`}\n              data-headless-type-name={`${componentType}#${componentName}`}\n              data-headless-title-desc-button={`${data?.title}#${data?.description}`}\n            >\n              <Picture\n                className=\"h-full\"\n                imgClassName=\"h-full object-cover tablet:hover:scale-110 transition-all duration-300\"\n                source={data?.backgroundImage?.default ? buildPictureSource(data.backgroundImage) : data?.imgUrl?.url}\n                alt={\n                  data?.backgroundImage?.lgDesktop?.alt ||\n                  data?.backgroundImage?.default?.alt ||\n                  data?.imgUrl?.alt ||\n                  ''\n                }\n              />\n            </a>\n          ) : (\n            <div className=\"rounded-card block size-full overflow-hidden\">\n              <Picture\n                className=\"h-full\"\n                imgClassName=\"h-full object-cover tablet:hover:scale-110 transition-all duration-300\"\n                source={\n                  data?.backgroundImage?.default ? buildPictureSource(data.backgroundImage) : data?.imgUrl?.url || ''\n                }\n                alt={\n                  data?.backgroundImage?.lgDesktop?.alt ||\n                  data?.backgroundImage?.default?.alt ||\n                  data?.imgUrl?.alt ||\n                  ''\n                }\n              />\n            </div>\n          )}\n          <div className=\"laptop:p-6 absolute bottom-0 z-[1] box-border flex w-full flex-col p-4\">\n            <div className={cn('flex items-end gap-1 overflow-hidden', 'graphic-bottom')}>\n              <div className=\"flex-1 overflow-hidden\">\n                <Text\n                  html={data?.title}\n                  style={{ color: data?.textColor }}\n                  className=\"spanTitle graphic-title lg-desktop:text-lg desktop:text-base line-clamp-3 text-sm font-bold leading-[1.2]\"\n                />\n                {data?.description && (\n                  <div onMouseMove={handleMouseMove} onMouseLeave={handleMouseLeave}>\n                    {data?.title ? (\n                      <Heading\n                        html={data?.description}\n                        style={{\n                          color: data?.textColor,\n                        }}\n                        as=\"h3\"\n                        className={`${descriptionClass} graphic-description`}\n                      />\n                    ) : (\n                      <h3\n                        style={{\n                          color: data?.textColor,\n                        }}\n                        dangerouslySetInnerHTML={{ __html: data?.description || '' }}\n                        className={`${descriptionClass} graphic-description-item`}\n                      />\n                    )}\n                    {typeof window !== 'undefined' &&\n                      tooltip.visible &&\n                      createPortal(\n                        <div\n                          className=\"pointer-events-none fixed z-[9999] max-w-xs rounded-lg bg-black/60 px-3 py-2 text-sm text-white shadow-lg backdrop-blur-sm transition-opacity duration-200\"\n                          style={{\n                            left: `${tooltip.x + 16}px`,\n                            top: `${tooltip.y + 16}px`,\n                          }}\n                        >\n                          {tooltip.text}\n                        </div>,\n                        document.body\n                      )}\n                  </div>\n                )}\n              </div>\n              {!data?.isShowIcon && (data?.video?.url || data?.youtubeId) && (\n                <button\n                  aria-label=\"Play Video\"\n                  onClick={(e: any) => {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    configuration?.onVideoPlayBtnClick?.(configuration?.index || 0, data)\n                  }}\n                  className=\"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white/20 hover:bg-black/75\"\n                >\n                  <svg width=\"12\" height=\"14\" viewBox=\"0 0 12 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path d=\"M12 7L0 14L0 0L12 7Z\" fill=\"white\" />\n                  </svg>\n                </button>\n              )}\n              {data?.isShowIcon && data?.icon?.url && (\n                <button\n                  onClick={(e: any) => {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    configuration?.onIconClick?.(data, configuration)\n                  }}\n                  className=\"laptop:size-9 flex size-8 items-center justify-center overflow-hidden rounded-full bg-white/20 hover:bg-black/75\"\n                >\n                  <Picture\n                    className=\"h-full\"\n                    imgClassName=\"h-full object-cover\"\n                    source={data?.icon?.url}\n                    alt={data?.icon?.alt || ''}\n                  />\n                </button>\n              )}\n            </div>\n            {data.buttonText && (\n              <Button\n                as=\"a\"\n                aria-label={data?.title ?? data?.description}\n                variant=\"secondary\"\n                className=\"bgButton mt-[8px] self-start\"\n                href={trackUrlRef(\n                  getLocalizedPath(data?.href || '', configuration?.locale || 'us'),\n                  `${componentType}_${componentName}`\n                )}\n                data-headless-nav-position={`''#${configuration?.index + 1}`}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${data?.title}#${data?.description}#${data?.buttonText}`}\n              >\n                {data.buttonText}\n              </Button>\n            )}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst Graphic = React.forwardRef<HTMLDivElement, GraphicProps>(({ data, className, ...rest }, ref) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  const innerRef = useRef<HTMLDivElement>(null)\n  const [visible, setVisible] = useState<boolean>(false)\n  const [videoUrl, setVideoUrl] = useState<string>('')\n  const [youTubeId, setYouTubeId] = useState<string>('')\n  const [mobileVideoUrl, setMobileVideoUrl] = useState<string>('')\n  const [currentItem, setCurrentItem] = useState<GraphicType | null>(null)\n  const [textVisible, setTextVisible] = useState<boolean>(false)\n  const { locale = 'us' } = useAiuiContext()\n\n  const handleSwiperShow = (width?: number) => {\n    const isShow = (data?.items as GraphicType[])?.length > 3\n    const isMobile = (data?.items as GraphicType[])?.length > 2\n    switch (width) {\n      case 1440:\n        return isShow ? 4 : data?.items?.length\n      case 1024:\n        return isShow ? 3 : data?.items?.length\n      case 768:\n        if ((data?.items as GraphicType[])?.length === 1) return 1 // \u2705 \u65B0\u589E\uFF1A\u53EA\u6709\u4E00\u4E2A item \u65F6\uFF0C\u5C55\u793A 1 \u4E2A\n        return isShow ? 2.3 : isMobile ? 2.3 : 2\n      default:\n        if ((data?.items as GraphicType[])?.length === 1) return 1 // \u2705 \u65B0\u589E\uFF1A\u53EA\u6709\u4E00\u4E2A item \u65F6\uFF0C\u5C55\u793A 1 \u4E2A\n        return 1.2\n    }\n  }\n\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n  })\n\n  return (\n    <div {...rest} ref={innerRef} className={cn('graphicBlock', className)}>\n      <div className=\"graphic-box\">\n        {data?.title && <Title data={{ title: data?.title }} />}\n        <SwiperBox\n          id=\"Graphic\"\n          className={cn('!overflow-visible')}\n          data={{\n            list: data?.items || [],\n            configuration: {\n              itemShape: data.itemShape,\n              num: data?.items?.length || 0,\n              locale,\n              onVideoPlayBtnClick: (_: number, data: GraphicType) => {\n                setVisible(true)\n                if (data?.isYouTube) {\n                  setYouTubeId?.(data?.youtubeId || '')\n                } else {\n                  setVideoUrl?.(data?.video?.url || '')\n                  setMobileVideoUrl?.(data?.mobileVideo?.url || '')\n                }\n              },\n              onIconClick: (data: GraphicType) => {\n                setTextVisible(true)\n                setCurrentItem(data)\n              },\n              title: data?.title,\n            },\n          }}\n          Slide={Item}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(),\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(768),\n            },\n            1024: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(1024),\n            },\n            1440: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: handleSwiperShow(1440),\n            },\n          }}\n        />\n      </div>\n      <VideoModal\n        visible={visible}\n        youTubeId={youTubeId}\n        onCloseModal={() => setVisible(false)}\n        videoUrl={isMobile ? mobileVideoUrl || videoUrl : videoUrl}\n      />\n      <TextModal\n        textVisible={textVisible}\n        extension={currentItem?.extension}\n        onCloseModal={() => {\n          setTextVisible(false)\n          setCurrentItem(null)\n        }}\n      />\n    </div>\n  )\n})\n\nGraphic.displayName = 'Graphic'\n\nexport default withLayout(Graphic)\n"],
+  "mappings": "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",
+  "names": ["Graphic_exports", "__export", "Graphic_default", "__toCommonJS", "import_jsx_runtime", "import_react_responsive", "import_react", "import_react_dom", "import_utils", "import_Styles", "import_SwiperBox", "import_components", "import_Title", "import_VideoModal", "import_TextModal", "import_useExposure", "import_trackUrlRef", "import_AiuiProvider", "componentType", "componentName", "buildPictureSource", "bg", "last", "resolve", "img", "lgDesktopSrc", "desktopSrc", "laptopSrc", "tabletSrc", "defaultSrc", "descriptionClass", "Item", "data", "configuration", "ref", "tooltip", "setTooltip", "handleAspect", "handleMouseMove", "e", "handleMouseLeave", "prev", "Graphic", "React", "className", "rest", "isMobile", "innerRef", "visible", "setVisible", "videoUrl", "setVideoUrl", "youTubeId", "setYouTubeId", "mobileVideoUrl", "setMobileVideoUrl", "currentItem", "setCurrentItem", "textVisible", "setTextVisible", "locale", "handleSwiperShow", "width", "isShow", "Title", "SwiperBox", "_"]
 }

package/dist/cjs/biz-components/GraphicMore/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var n=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var g=(o,l)=>{for(var r in l)n(o,r,{get:l[r],enumerable:!0})},h=(o,l,r,i)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of f(l))!x.call(o,a)&&a!==r&&n(o,a,{get:()=>l[a],enumerable:!(i=u(l,a))||i.enumerable});return o};var v=o=>h(n({},"__esModule",{value:!0}),o);var N={};g(N,{default:()=>k});module.exports=v(N);var e=require("react/jsx-runtime"),s=require("../../helpers/utils.js"),c=require("../../shared/Styles.js"),p=require("../../components/grid.js"),d=require("../../components/index.js");const b=({data:o,className:l,...r})=>{const{productsTab:i,shape:a}=o;return(0,e.jsxs)("div",{...r,className:(0,s.cn)(l),children:[(0,e.jsx)("div",{className:(0,s.cn)("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#080A0F]"),children:(0,e.jsx)(p.Grid,{className:(0,s.cn)("tablet:gap-4 grid grid-cols-12 gap-3 ",l),children:i?.map((t,m)=>(0,e.jsxs)(p.GridItem,{span:t.span,className:(0,s.cn)("text-info-primary relative w-full overflow-hidden",a==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":t?.theme==="dark"}),children:[(0,e.jsx)(d.Picture,{source:t?.img?.url,className:"size-full",imgClassName:""}),(0,e.jsxs)("div",{className:"footBottom desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4",children:[t?.title&&(0,e.jsx)(d.Text,{html:t?.title,as:"p",className:"desktop:text-[32px] line-clamp-2 text-2xl font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(d.Text,{html:t?.description,className:"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold"})]})]},m))})}),(0,e.jsx)("div",{className:"tablet:hidden block text-[#080A0F]",children:(0,e.jsx)("div",{className:" flex flex-wrap gap-[12px]",children:i?.map((t,m)=>(0,e.jsxs)("div",{className:(0,s.cn)("text-info-primary relative overflow-hidden",a==="rounded"?"rounded-xl":"rounded-none",{"aiui-dark":t?.theme==="dark"},t?.fullWidth==="true"?"w-full flex-none":" w-[calc(50%-6px)]"),children:[(0,e.jsx)(d.Picture,{source:t?.mobileImg?.url,className:"size-full",imgClassName:"h-full object-cover"}),(0,e.jsxs)("div",{className:"footBottomMob desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4",children:[t?.title&&(0,e.jsx)(d.Text,{html:t?.title,as:"p",className:"desktop:text-[32px] line-clamp-2 text-2xl font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(d.Text,{html:t?.description,className:"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold leading-[1.4]"})]})]},m))})})]})};var k=(0,c.withLayout)(b);
+"use strict";"use client";var n=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var g=(o,l)=>{for(var r in l)n(o,r,{get:l[r],enumerable:!0})},h=(o,l,r,i)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of f(l))!x.call(o,a)&&a!==r&&n(o,a,{get:()=>l[a],enumerable:!(i=u(l,a))||i.enumerable});return o};var v=o=>h(n({},"__esModule",{value:!0}),o);var N={};g(N,{default:()=>k});module.exports=v(N);var e=require("react/jsx-runtime"),s=require("../../helpers/utils.js"),c=require("../../shared/Styles.js"),p=require("../../components/grid.js"),d=require("../../components/index.js");const b=({data:o,className:l,...r})=>{const{productsTab:i,shape:a}=o;return(0,e.jsxs)("div",{...r,className:(0,s.cn)(l),children:[(0,e.jsx)("div",{className:(0,s.cn)("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#080A0F]"),children:(0,e.jsx)(p.Grid,{className:(0,s.cn)("laptop:gap-4 grid grid-cols-12 gap-3 ",l),children:i?.map((t,m)=>(0,e.jsxs)(p.GridItem,{span:t.span,className:(0,s.cn)("text-info-primary relative w-full overflow-hidden",a==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":t?.theme==="dark"}),children:[(0,e.jsx)(d.Picture,{source:t?.img?.url,className:"size-full",imgClassName:""}),(0,e.jsxs)("div",{className:"footBottom desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4",children:[t?.title&&(0,e.jsx)(d.Text,{html:t?.title,as:"p",className:"desktop:text-2xl line-clamp-2 text-xl font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(d.Text,{html:t?.description,className:"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold"})]})]},m))})}),(0,e.jsx)("div",{className:"tablet:hidden block text-[#080A0F]",children:(0,e.jsx)("div",{className:" flex flex-wrap gap-[12px]",children:i?.map((t,m)=>(0,e.jsxs)("div",{className:(0,s.cn)("text-info-primary relative overflow-hidden",a==="rounded"?"rounded-xl":"rounded-none",{"aiui-dark":t?.theme==="dark"},t?.fullWidth==="true"?"w-full flex-none":" w-[calc(50%-6px)]"),children:[(0,e.jsx)(d.Picture,{source:t?.mobileImg?.url,className:"size-full",imgClassName:"h-full object-cover"}),(0,e.jsxs)("div",{className:"footBottomMob desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4",children:[t?.title&&(0,e.jsx)(d.Text,{html:t?.title,as:"p",className:"lg-desktop:text-2xl text-xl font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(d.Text,{html:t?.description,className:"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold leading-[1.4]"})]})]},m))})})]})};var k=(0,c.withLayout)(b);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/GraphicMore/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/GraphicMore/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/grid.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}\ninterface GraphicMoreType extends React.HTMLAttributes<HTMLDivElement> {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: GraphicMoreDataType[]\n  }\n}\n\nconst GraphicMore = ({ data, className, ...rest }: GraphicMoreType) => {\n  const { productsTab, shape } = data\n\n  return (\n    <div {...rest} className={cn(className)}>\n      <div\n        className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#080A0F]')}\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 desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4\">\n                  {item?.title && (\n                    <Text\n                      html={item?.title}\n                      as=\"p\"\n                      className=\"desktop:text-[32px] line-clamp-2 text-2xl font-bold leading-[1.2]\"\n                    />\n                  )}\n                  {item?.description && (\n                    <Text\n                      html={item?.description}\n                      className=\"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold\"\n                    />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"tablet:hidden block text-[#080A0F]\">\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 desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4\">\n                  {it?.title && (\n                    <Text\n                      html={it?.title}\n                      as=\"p\"\n                      className=\"desktop:text-[32px] line-clamp-2 text-2xl font-bold leading-[1.2]\"\n                    />\n                  )}\n                  {it?.description && (\n                    <Text\n                      html={it?.description}\n                      className=\"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold leading-[1.4]\"\n                    />\n                  )}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(GraphicMore)\n"],
-  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6CgB,IAAAI,EAAA,6BA5ChBC,EAAmB,kCAEnBC,EAA2B,kCAC3BC,EAA+B,oCAC/BC,EAA8B,qCAiB9B,MAAMC,EAAc,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAW,GAAGC,CAAK,IAAuB,CACrE,KAAM,CAAE,YAAAC,EAAa,MAAAC,CAAM,EAAIJ,EAE/B,SACE,QAAC,OAAK,GAAGE,EAAM,aAAW,MAAGD,CAAS,EACpC,oBAAC,OACC,aAAW,MAAG,sBAAuB,sEAAsE,EAE3G,mBAAC,QAAK,aAAW,MAAG,wCAAyCA,CAAS,EACnE,SAAAE,GAAa,IAAI,CAACE,EAAMC,OAErB,QAAC,YAEC,KAAMD,EAAK,KACX,aAAW,MACT,oDACAD,IAAU,UAAY,cAAgB,eACtC,GACA,CACE,YAAaC,GAAM,QAAU,MAC/B,CACF,EAEA,oBAAC,WAAQ,OAAQA,GAAM,KAAK,IAAK,UAAU,YAAY,aAAa,GAAG,KACvE,QAAC,OAAI,UAAU,kFACZ,UAAAA,GAAM,UACL,OAAC,QACC,KAAMA,GAAM,MACZ,GAAG,IACH,UAAU,oEACZ,EAEDA,GAAM,gBACL,OAAC,QACC,KAAMA,GAAM,YACZ,UAAU,2EACZ,GAEJ,IA1BKC,CA2BP,CAEH,EACH,EACF,KACA,OAAC,OAAI,UAAU,qCACb,mBAAC,OAAI,UAAU,6BACZ,SAAAH,GAAa,IAAI,CAACI,EAAIC,OAEnB,QAAC,OAEC,aAAW,MACT,6CACAJ,IAAU,UAAY,aAAe,eACrC,CAAE,YAAaG,GAAI,QAAU,MAAO,EACpCA,GAAI,YAAc,OACd,mBACA,oBACN,EAEA,oBAAC,WAAQ,OAAQA,GAAI,WAAW,IAAK,UAAU,YAAY,aAAa,sBAAsB,KAC9F,QAAC,OAAI,UAAU,qFACZ,UAAAA,GAAI,UACH,OAAC,QACC,KAAMA,GAAI,MACV,GAAG,IACH,UAAU,oEACZ,EAEDA,GAAI,gBACH,OAAC,QACC,KAAMA,GAAI,YACV,UAAU,yFACZ,GAEJ,IAzBKC,CA0BP,CAEH,EACH,EACF,GACF,CAEJ,EAEA,IAAOhB,KAAQ,cAAWO,CAAW",
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/grid.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}\ninterface GraphicMoreType extends React.HTMLAttributes<HTMLDivElement> {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: GraphicMoreDataType[]\n  }\n}\n\nconst GraphicMore = ({ data, className, ...rest }: GraphicMoreType) => {\n  const { productsTab, shape } = data\n\n  return (\n    <div {...rest} className={cn(className)}>\n      <div\n        className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#080A0F]')}\n      >\n        <Grid className={cn('laptop: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 desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4\">\n                  {item?.title && (\n                    <Text\n                      html={item?.title}\n                      as=\"p\"\n                      className=\"desktop:text-2xl line-clamp-2 text-xl font-bold leading-[1.2]\"\n                    />\n                  )}\n                  {item?.description && (\n                    <Text\n                      html={item?.description}\n                      className=\"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold\"\n                    />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"tablet:hidden block text-[#080A0F]\">\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 desktop:p-6 lg-desktop:p-8 absolute inset-0 z-10 overflow-hidden p-4\">\n                  {it?.title && (\n                    <Text html={it?.title} as=\"p\" className=\"lg-desktop:text-2xl text-xl font-bold leading-[1.2]\" />\n                  )}\n                  {it?.description && (\n                    <Text\n                      html={it?.description}\n                      className=\"desktop:text-base lg-desktop:text-lg mt-1 line-clamp-2 text-sm font-bold leading-[1.4]\"\n                    />\n                  )}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(GraphicMore)\n"],
+  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6CgB,IAAAI,EAAA,6BA5ChBC,EAAmB,kCAEnBC,EAA2B,kCAC3BC,EAA+B,oCAC/BC,EAA8B,qCAiB9B,MAAMC,EAAc,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAW,GAAGC,CAAK,IAAuB,CACrE,KAAM,CAAE,YAAAC,EAAa,MAAAC,CAAM,EAAIJ,EAE/B,SACE,QAAC,OAAK,GAAGE,EAAM,aAAW,MAAGD,CAAS,EACpC,oBAAC,OACC,aAAW,MAAG,sBAAuB,sEAAsE,EAE3G,mBAAC,QAAK,aAAW,MAAG,wCAAyCA,CAAS,EACnE,SAAAE,GAAa,IAAI,CAACE,EAAMC,OAErB,QAAC,YAEC,KAAMD,EAAK,KACX,aAAW,MACT,oDACAD,IAAU,UAAY,cAAgB,eACtC,GACA,CACE,YAAaC,GAAM,QAAU,MAC/B,CACF,EAEA,oBAAC,WAAQ,OAAQA,GAAM,KAAK,IAAK,UAAU,YAAY,aAAa,GAAG,KACvE,QAAC,OAAI,UAAU,kFACZ,UAAAA,GAAM,UACL,OAAC,QACC,KAAMA,GAAM,MACZ,GAAG,IACH,UAAU,gEACZ,EAEDA,GAAM,gBACL,OAAC,QACC,KAAMA,GAAM,YACZ,UAAU,2EACZ,GAEJ,IA1BKC,CA2BP,CAEH,EACH,EACF,KACA,OAAC,OAAI,UAAU,qCACb,mBAAC,OAAI,UAAU,6BACZ,SAAAH,GAAa,IAAI,CAACI,EAAIC,OAEnB,QAAC,OAEC,aAAW,MACT,6CACAJ,IAAU,UAAY,aAAe,eACrC,CAAE,YAAaG,GAAI,QAAU,MAAO,EACpCA,GAAI,YAAc,OACd,mBACA,oBACN,EAEA,oBAAC,WAAQ,OAAQA,GAAI,WAAW,IAAK,UAAU,YAAY,aAAa,sBAAsB,KAC9F,QAAC,OAAI,UAAU,qFACZ,UAAAA,GAAI,UACH,OAAC,QAAK,KAAMA,GAAI,MAAO,GAAG,IAAI,UAAU,sDAAsD,EAE/FA,GAAI,gBACH,OAAC,QACC,KAAMA,GAAI,YACV,UAAU,yFACZ,GAEJ,IArBKC,CAsBP,CAEH,EACH,EACF,GACF,CAEJ,EAEA,IAAOhB,KAAQ,cAAWO,CAAW",
   "names": ["GraphicMore_exports", "__export", "GraphicMore_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_Styles", "import_grid", "import_components", "GraphicMore", "data", "className", "rest", "productsTab", "shape", "item", "index", "it", "ind"]
 }

package/dist/cjs/biz-components/ImageWithText/ImageWithText.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var ue=Object.create;var M=Object.defineProperty;var fe=Object.getOwnPropertyDescriptor;var he=Object.getOwnPropertyNames;var ge=Object.getPrototypeOf,ve=Object.prototype.hasOwnProperty;var be=(n,c)=>{for(var g in c)M(n,g,{get:c[g],enumerable:!0})},U=(n,c,g,b)=>{if(c&&typeof c=="object"||typeof c=="function")for(let v of he(c))!ve.call(n,v)&&v!==g&&M(n,v,{get:()=>c[v],enumerable:!(b=fe(c,v))||b.enumerable});return n};var we=(n,c,g)=>(g=n!=null?ue(ge(n)):{},U(c||!n||!n.__esModule?M(g,"default",{value:n,enumerable:!0}):g,n)),_e=n=>U(M({},"__esModule",{value:!0}),n);var Te={};be(Te,{default:()=>Ne});module.exports=_e(Te);var e=require("react/jsx-runtime"),a=we(require("react")),r=require("../../components/index.js"),l=require("../../helpers/utils.js"),ee=require("../../shared/Styles.js"),te=require("../../hooks/useExposure.js"),ie=require("../../hooks/useIntersectionObserver.js"),ae=require("../AiuiProvider/index.js"),k=require("framer-motion");const ye="image",ke="image_with_text",X=(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),Y=a.default.forwardRef(({data:n,className:c},g)=>{const{title:b,subtitle:v,desc:_,descIcon:L,image:N,padImage:z,mobileImage:E,theme:oe="dark",items:H=[],layout:le="left",mediaType:se="image",datalist:d=[],video:j,padVideo:R,mobVideo:W,button:w,textAlign:m="left"}=n,i=le,{locale:C="us"}=(0,ae.useAiuiContext)(),D=(0,a.useRef)(null),P=(0,a.useRef)(null),V=(0,a.useRef)(null),S=(0,a.useRef)(null),A=(0,a.useRef)(null),[u,re]=(0,a.useState)(0),q=(0,a.useRef)([]),[$,ne]=(0,a.useState)({left:0,width:0}),[y,B]=(0,a.useState)(""),[F,O]=(0,a.useState)(""),[Z,G]=(0,a.useState)(""),x=d.length>0,T=se==="video";(0,te.useExposure)(D,{componentType:ye,componentName:ke,componentTitle:b,componentDescription:v}),(0,a.useImperativeHandle)(g,()=>D.current),(0,a.useEffect)(()=>{if(d.length>0){const t=q.current[u];if(t){const{offsetLeft:s,offsetWidth:o}=t;ne({left:s,width:o})}}},[u,d.length]);const[J,me]=(0,a.useState)(!1);(0,ie.useIntersectionObserverDelay)(A,{once:!0,threshold:.01,callback:()=>{me(!0)}}),(0,a.useEffect)(()=>{if(!J||!T)return;let t="",s="",o="";if(x&&d[u]){const f=d[u];t=f.video?.url||"",s=f.padVideo?.url||t,o=f.mobVideo?.url||t}else t=j?.url||"",s=R?.url||t,o=W?.url||t;t&&B(t),s&&O(s),o&&G(o),setTimeout(()=>{[P.current?.querySelector("video"),V.current?.querySelector("video"),S.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},200)},[J,T,x,u,d,j?.url,R?.url,W?.url]);const de=(t,s)=>{if(re(t),s.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),T&&x&&d[t]){const o=d[t];o.video?.url&&B(o.video.url),o.padVideo?.url&&O(o.padVideo.url),o.mobVideo?.url&&G(o.mobVideo.url),setTimeout(()=>{[P.current?.querySelector("video"),V.current?.querySelector("video"),S.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},300)}},pe=()=>!I||!w?.text?null:(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":m==="center","flex justify-start":m==="left","laptop:hidden":i==="top"||i==="bottom"}),children:(0,e.jsx)(r.Link,{href:(0,l.getLocalizedPath)(w.link||"",C),className:"image-with-text__button whitespace-nowrap no-underline",suffixIcon:X,children:w.text})}),p=H.length>0,I=!!w,K=()=>{if(x&&d[u]){const t=d[u];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return N?`${N?.url},${z?.url||N?.url} 1024, ${E?.url||N?.url} 768`:""},Q=()=>{if(x){const f=d[u],h=f.image?.url,ce=f.imgPad?.url||h,xe=f.imageMob?.url||h;return(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:P,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:h,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:V,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:ce,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:S,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:xe,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},f.video?.url||f.image?.url)})}const t=N?.url,s=z?.url||t,o=E?.url||t;return(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:P,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:V,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:s,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:S,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:o,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return(0,e.jsxs)("section",{ref:D,"data-ui-component-id":"ImageWithText",className:(0,l.cn)("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!x,"flex-col":!x&&(i==="top"||i==="bottom"),"items-center":i==="left"||i==="right","flex-col laptop:flex-row":!x&&(i==="left"||i==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":x,"aiui-dark":oe==="dark"},c),children:[x&&(b||_||d.length>0)&&(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":m==="left","text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:"image-with-text__header",children:[(0,e.jsx)(r.Heading,{as:"h3",size:4,html:b,className:"image-with-text__title"}),(0,e.jsx)(r.Text,{as:"p",size:1,html:_,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":m==="center"}),children:(0,e.jsxs)("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[(0,e.jsx)("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:$.left,width:$.width}}),d.map((t,s)=>(0,e.jsx)("div",{ref:o=>{q.current[s]=o},onClick:o=>de(s,o),className:(0,l.cn)("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",u===s?"image-with-text__tab--active text-black":"text-white"),children:(0,e.jsx)(r.Heading,{as:"h1",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},s))]})})]}),!x&&(b||v||_||L||p||I)&&(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__content flex flex-col",{"justify-center":!I,"justify-between":I,"w-full laptop:w-fit":p,"items-start":m==="left","items-center":m==="center","text-left":m==="left","text-center":m==="center","laptop:order-1":i==="left"}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__main-content",{"flex flex-col":I}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__header",{"laptop:flex laptop:items-end laptop:justify-between laptop:gap-16":(i==="top"||i==="bottom")&&w?.text}),children:[(0,e.jsxs)("div",{className:"image-with-text__title-wrapper flex flex-col",children:[(0,e.jsx)(r.Heading,{as:"h2",size:4,html:b,className:(0,l.cn)("image-with-text__title",{"w-full":p,"text-left":p&&m==="left","text-center":p&&m==="center"})}),v&&(0,e.jsx)(r.Text,{as:"p",size:p?4:3,html:v,className:(0,l.cn)("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!p,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":p,"text-left":p&&m==="left","text-center":p&&m==="center"})})]}),(i==="top"||i==="bottom")&&w?.text&&(0,e.jsx)(r.Link,{href:(0,l.getLocalizedPath)(w.link||"",C),className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:X,children:w.text})]}),!p&&(_||L)&&(0,e.jsxs)("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[L&&(0,e.jsx)("img",{src:L,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),_&&(0,e.jsx)(r.Heading,{as:"h4",size:5,html:_,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),p&&(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4 laptop:grid-cols-2":i==="left"||i==="right"}),children:H.map((t,s)=>(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__item",{"text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":m==="center","justify-start":m==="left"}),children:[(0,e.jsx)(r.Picture,{source:t.icon?.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),(0,e.jsx)(r.Heading,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),(0,e.jsx)(r.Text,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},s))})]}),pe()]}),(0,e.jsx)("div",{ref:A,className:(0,l.cn)("image-with-text__media-wrapper",{"w-[60%] shrink-0":i==="left"||i==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":p,"laptop:basis-[63%] desktop:basis-[57%]":p&&i==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":x,"!max-w-none !max-h-none aspect-auto":i==="top"||i==="bottom"}),children:x?T?Q():(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:(0,e.jsx)(r.Picture,{source:K(),alt:d[u].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},d[u].image?.url)}):T?Q():(0,e.jsx)(r.Picture,{source:K(),className:(0,l.cn)("image-with-text__image rounded-box laptop:rounded-box")})})]})});Y.displayName="ImageWithText";var Ne=(0,ee.withLayout)(Y);
+"use strict";"use client";var ue=Object.create;var S=Object.defineProperty;var fe=Object.getOwnPropertyDescriptor;var he=Object.getOwnPropertyNames;var ge=Object.getPrototypeOf,ve=Object.prototype.hasOwnProperty;var be=(n,p)=>{for(var g in p)S(n,g,{get:p[g],enumerable:!0})},U=(n,p,g,b)=>{if(p&&typeof p=="object"||typeof p=="function")for(let v of he(p))!ve.call(n,v)&&v!==g&&S(n,v,{get:()=>p[v],enumerable:!(b=fe(p,v))||b.enumerable});return n};var we=(n,p,g)=>(g=n!=null?ue(ge(n)):{},U(p||!n||!n.__esModule?S(g,"default",{value:n,enumerable:!0}):g,n)),_e=n=>U(S({},"__esModule",{value:!0}),n);var Te={};be(Te,{default:()=>Ne});module.exports=_e(Te);var e=require("react/jsx-runtime"),a=we(require("react")),r=require("../../components/index.js"),l=require("../../helpers/utils.js"),ee=require("../../shared/Styles.js"),te=require("../../hooks/useExposure.js"),ie=require("../../hooks/useIntersectionObserver.js"),ae=require("../AiuiProvider/index.js"),k=require("framer-motion");const ye="image",ke="image_with_text",X=(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),Y=a.default.forwardRef(({data:n,className:p},g)=>{const{title:b,subtitle:v,desc:_,descIcon:M,image:N,padImage:z,mobileImage:E,theme:oe="dark",items:H=[],layout:le="left",mediaType:se="image",datalist:d=[],video:j,padVideo:R,mobVideo:W,button:w,textAlign:m="left"}=n,i=le,{locale:C="us"}=(0,ae.useAiuiContext)(),D=(0,a.useRef)(null),I=(0,a.useRef)(null),L=(0,a.useRef)(null),P=(0,a.useRef)(null),A=(0,a.useRef)(null),[u,re]=(0,a.useState)(0),q=(0,a.useRef)([]),[$,ne]=(0,a.useState)({left:0,width:0}),[y,B]=(0,a.useState)(""),[F,O]=(0,a.useState)(""),[Z,G]=(0,a.useState)(""),c=d.length>0,T=se==="video";(0,te.useExposure)(D,{componentType:ye,componentName:ke,componentTitle:b,componentDescription:v}),(0,a.useImperativeHandle)(g,()=>D.current),(0,a.useEffect)(()=>{if(d.length>0){const t=q.current[u];if(t){const{offsetLeft:s,offsetWidth:o}=t;ne({left:s,width:o})}}},[u,d.length]);const[J,me]=(0,a.useState)(!1);(0,ie.useIntersectionObserverDelay)(A,{once:!0,threshold:.01,callback:()=>{me(!0)}}),(0,a.useEffect)(()=>{if(!J||!T)return;let t="",s="",o="";if(c&&d[u]){const f=d[u];t=f.video?.url||"",s=f.padVideo?.url||t,o=f.mobVideo?.url||t}else t=j?.url||"",s=R?.url||t,o=W?.url||t;t&&B(t),s&&O(s),o&&G(o),setTimeout(()=>{[I.current?.querySelector("video"),L.current?.querySelector("video"),P.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},200)},[J,T,c,u,d,j?.url,R?.url,W?.url]);const de=(t,s)=>{if(re(t),s.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),T&&c&&d[t]){const o=d[t];o.video?.url&&B(o.video.url),o.padVideo?.url&&O(o.padVideo.url),o.mobVideo?.url&&G(o.mobVideo.url),setTimeout(()=>{[I.current?.querySelector("video"),L.current?.querySelector("video"),P.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},300)}},pe=()=>!V||!w?.text?null:(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":m==="center","flex justify-start":m==="left","laptop:hidden":i==="top"||i==="bottom"}),children:(0,e.jsx)(r.Link,{href:(0,l.getLocalizedPath)(w.link||"",C),className:"image-with-text__button whitespace-nowrap no-underline",suffixIcon:X,children:w.text})}),x=H.length>0,V=!!w,K=()=>{if(c&&d[u]){const t=d[u];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return N?`${N?.url},${z?.url||N?.url} 1024, ${E?.url||N?.url} 768`:""},Q=()=>{if(c){const f=d[u],h=f.image?.url,ce=f.imgPad?.url||h,xe=f.imageMob?.url||h;return(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:I,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:h,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:L,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:ce,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:P,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:xe,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},f.video?.url||f.image?.url)})}const t=N?.url,s=z?.url||t,o=E?.url||t;return(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:I,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:L,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:s,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:P,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:o,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return(0,e.jsxs)("section",{ref:D,"data-ui-component-id":"ImageWithText",className:(0,l.cn)("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!c,"flex-col":!c&&(i==="top"||i==="bottom"),"items-center":i==="left"||i==="right","flex-col laptop:flex-row":!c&&(i==="left"||i==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":c,"aiui-dark":oe==="dark"},p),children:[c&&(b||_||d.length>0)&&(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":m==="left","text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:"image-with-text__header",children:[(0,e.jsx)(r.Heading,{as:"h3",size:4,html:b,className:"image-with-text__title"}),(0,e.jsx)(r.Text,{as:"p",size:1,html:_,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":m==="center"}),children:(0,e.jsxs)("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[(0,e.jsx)("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:$.left,width:$.width}}),d.map((t,s)=>(0,e.jsx)("div",{ref:o=>{q.current[s]=o},onClick:o=>de(s,o),className:(0,l.cn)("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",u===s?"image-with-text__tab--active text-black":"text-white"),children:(0,e.jsx)(r.Heading,{as:"h1",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},s))]})})]}),!c&&(b||v||_)&&(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__content flex flex-col",{"justify-center":!V,"justify-between":V,"w-full laptop:w-fit":x,"items-start":m==="left","items-center":m==="center","text-left":m==="left","text-center":m==="center","laptop:order-1":i==="left"}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__main-content",{"flex flex-col":V}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__header",{"laptop:flex laptop:items-end laptop:justify-between laptop:gap-16":(i==="top"||i==="bottom")&&w?.text}),children:[(0,e.jsxs)("div",{className:"image-with-text__title-wrapper flex flex-col",children:[(0,e.jsx)(r.Heading,{as:"h2",size:4,html:b,className:(0,l.cn)("image-with-text__title",{"w-full":x,"text-left":x&&m==="left","text-center":x&&m==="center"})}),v&&(0,e.jsx)(r.Text,{as:"p",size:x?4:3,html:v,className:(0,l.cn)("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!x,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":x,"text-left":x&&m==="left","text-center":x&&m==="center"})})]}),(i==="top"||i==="bottom")&&w?.text&&(0,e.jsx)(r.Link,{href:(0,l.getLocalizedPath)(w.link||"",C),className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:X,children:w.text})]}),!x&&(_||M)&&(0,e.jsxs)("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[M&&(0,e.jsx)("img",{src:M,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),_&&(0,e.jsx)(r.Heading,{as:"h4",size:5,html:_,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),x&&(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4 laptop:grid-cols-2":i==="left"||i==="right"}),children:H.map((t,s)=>(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__item",{"text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":m==="center","justify-start":m==="left"}),children:[(0,e.jsx)(r.Picture,{source:t.icon?.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),(0,e.jsx)(r.Heading,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),(0,e.jsx)(r.Text,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},s))})]}),pe()]}),(0,e.jsx)("div",{ref:A,className:(0,l.cn)("image-with-text__media-wrapper",{"laptop:w-[60%] w-full shrink-0":i==="left"||i==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":x,"laptop:basis-[63%] desktop:basis-[57%]":x&&i==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":c,"!max-w-none !max-h-none aspect-auto":i==="top"||i==="bottom"}),children:c?T?Q():(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:(0,e.jsx)(r.Picture,{source:K(),alt:d[u].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},d[u].image?.url)}):T?Q():(0,e.jsx)(r.Picture,{source:K(),className:(0,l.cn)("image-with-text__image rounded-box laptop:rounded-box")})})]})});Y.displayName="ImageWithText";var Ne=(0,ee.withLayout)(Y);
 //# sourceMappingURL=ImageWithText.js.map