@anker-in/headless-ui 0.0.27-alpha.111 → 0.0.27-alpha.113

package/dist/cjs/biz-components/MediaPlayerMulti/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerMulti/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Picture } from '../../components/index.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerMultiProps, MediaPlayerItemProps } from './types.js'\n\nconst MediaPlayerItem = ({ data, configuration }: { data: MediaPlayerItemProps; configuration?: any }) => {\n  const [isPlaying, setIsPlaying] = useState<boolean>(false)\n  const videoRef = useRef<HTMLVideoElement>(null)\n  return (\n    <div\n      className={cn(\n        'laptop:max-w-full w-full overflow-hidden',\n        'laptop:flex-row flex shrink-0 flex-col',\n        'lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[360px] h-auto',\n        configuration.shape === 'round' ? 'rounded-2xl' : ''\n      )}\n    >\n      <div className=\"laptop:w-[49%] laptop:h-full relative h-1/3 w-full flex-none\">\n        {isPlaying ? (\n          <video ref={videoRef} className=\"size-full object-cover\" src={data?.video?.url} muted loop />\n        ) : (\n          <Picture\n            source={data.img?.url}\n            alt={data.img?.alt || ''}\n            className=\"size-full\"\n            imgClassName=\"w-full h-full object-cover hover:scale-110 transition-all duration-300\"\n          />\n        )}\n        <div className=\"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4\">\n          {data.video && (\n            <button\n              onClick={() => {\n                if (isPlaying) {\n                  if (videoRef.current) {\n                    videoRef.current.pause()\n                  }\n                  setIsPlaying(false)\n                } else {\n                  if (videoRef.current) {\n                    videoRef.current.play()\n                  }\n                  setIsPlaying(true)\n                }\n              }}\n              className=\"tablet:size-12 flex size-10 items-center justify-center rounded-full bg-white bg-opacity-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        </div>\n      </div>\n\n      <div className=\"laptop:gap-[60px] lg-desktop:p-8 tablet:p-6 bg-container-secondary-1 flex min-h-[200px] flex-1 flex-col justify-between gap-4 overflow-hidden p-4\">\n        <div className=\"flex flex-col\">\n          <h3 className=\"desktop:text-lg text-info-primary mb-2 text-sm font-bold leading-[1.2] tracking-[-0.02em]\">\n            {data.title}\n          </h3>\n          {data.quote && (\n            <p className=\"desktop:text-lg text-info-primary text-sm font-bold leading-[1.2] tracking-[-0.02em]\">\n              {data.quote}\n            </p>\n          )}\n        </div>\n\n        <p className=\"lg-desktop:text-2xl text-info-primary desktop:max-h-[186px] line-clamp-6 max-h-[144px] min-h-[100px] text-xl font-bold leading-[1.2] tracking-[-0.04em]\">\n          {data.description}\n        </p>\n      </div>\n    </div>\n  )\n}\n\nconst MediaPlayerMulti: React.FC<MediaPlayerMultiProps> = ({\n  data: { items = [], shape = 'square', title },\n  className = '',\n  key,\n}) => {\n  const title_html = typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title })\n  return (\n    <div className={className}>\n      {title && <Title data={{ title: title_html || '' }} />}\n      <SwiperBox\n        className=\"!overflow-visible\"\n        id={'MediaPlayerMultiSwiper' + key}\n        data={{ list: items, configuration: { shape: shape } }}\n        Slide={MediaPlayerItem}\n      />\n    </div>\n  )\n}\n\nexport default withStyles(MediaPlayerMulti)\n"],
-  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsBM,IAAAI,EAAA,6BArBNC,EAAwC,iBACxCC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAwB,qCACxBC,EAAkB,gCAClBC,EAAsB,oCACtBC,EAAqC,6CAGrC,MAAMC,EAAkB,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAA2D,CACxG,KAAM,CAACC,EAAWC,CAAY,KAAI,YAAkB,EAAK,EACnDC,KAAW,UAAyB,IAAI,EAC9C,SACE,QAAC,OACC,aAAW,MACT,2CACA,yCACA,iEACAH,EAAc,QAAU,QAAU,cAAgB,EACpD,EAEA,qBAAC,OAAI,UAAU,+DACZ,UAAAC,KACC,OAAC,SAAM,IAAKE,EAAU,UAAU,yBAAyB,IAAKJ,GAAM,OAAO,IAAK,MAAK,GAAC,KAAI,GAAC,KAE3F,OAAC,WACC,OAAQA,EAAK,KAAK,IAClB,IAAKA,EAAK,KAAK,KAAO,GACtB,UAAU,YACV,aAAa,yEACf,KAEF,OAAC,OAAI,UAAU,2DACZ,SAAAA,EAAK,UACJ,OAAC,UACC,QAAS,IAAM,CACTE,GACEE,EAAS,SACXA,EAAS,QAAQ,MAAM,EAEzBD,EAAa,EAAK,IAEdC,EAAS,SACXA,EAAS,QAAQ,KAAK,EAExBD,EAAa,EAAI,EAErB,EACA,UAAU,gHAEV,mBAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,mBAAC,QAAK,EAAE,uBAAuB,KAAK,QAAQ,EAC9C,EACF,EAEJ,GACF,KAEA,QAAC,OAAI,UAAU,oJACb,qBAAC,OAAI,UAAU,gBACb,oBAAC,MAAG,UAAU,4FACX,SAAAH,EAAK,MACR,EACCA,EAAK,UACJ,OAAC,KAAE,UAAU,uFACV,SAAAA,EAAK,MACR,GAEJ,KAEA,OAAC,KAAE,UAAU,0JACV,SAAAA,EAAK,YACR,GACF,GACF,CAEJ,EAEMK,EAAoD,CAAC,CACzD,KAAM,CAAE,MAAAC,EAAQ,CAAC,EAAG,MAAAC,EAAQ,SAAU,MAAAC,CAAM,EAC5C,UAAAC,EAAY,GACZ,IAAAC,CACF,IAAM,CACJ,MAAMC,EAAa,OAAOH,GAAU,SAAWA,EAAQA,MAAS,wBAAqB,CAAE,KAAMA,CAAM,CAAC,EACpG,SACE,QAAC,OAAI,UAAWC,EACb,UAAAD,MAAS,OAAC,EAAAI,QAAA,CAAM,KAAM,CAAE,MAAOD,GAAc,EAAG,EAAG,KACpD,OAAC,EAAAE,QAAA,CACC,UAAU,oBACV,GAAI,yBAA2BH,EAC/B,KAAM,CAAE,KAAMJ,EAAO,cAAe,CAAE,MAAOC,CAAM,CAAE,EACrD,MAAOR,EACT,GACF,CAEJ,EAEA,IAAOV,KAAQ,cAAWgB,CAAgB",
-  "names": ["MediaPlayerMulti_exports", "__export", "MediaPlayerMulti_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_components", "import_Title", "import_SwiperBox", "import_html", "MediaPlayerItem", "data", "configuration", "isPlaying", "setIsPlaying", "videoRef", "MediaPlayerMulti", "items", "shape", "title", "className", "key", "title_html", "Title", "SwiperBox"]
+  "sourcesContent": ["'use client'\nimport React, { useState, useRef, forwardRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Picture } from '../../components/index.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerMultiProps, MediaPlayerItemProps } from './types.js'\n\nconst MediaPlayerItem = ({ data, configuration }: { data: MediaPlayerItemProps; configuration?: any }) => {\n  const [isPlaying, setIsPlaying] = useState<boolean>(false)\n  const videoRef = useRef<HTMLVideoElement>(null)\n  return (\n    <div\n      className={cn(\n        'laptop:max-w-full w-full overflow-hidden',\n        'laptop:flex-row flex shrink-0 flex-col',\n        'lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[360px] h-auto',\n        configuration.shape === 'round' ? 'rounded-2xl' : ''\n      )}\n    >\n      <div className=\"laptop:w-[49%] laptop:h-full relative h-1/3 w-full flex-none\">\n        {isPlaying ? (\n          <video ref={videoRef} className=\"size-full object-cover\" src={data?.video?.url} muted loop />\n        ) : (\n          <Picture\n            source={data.img?.url}\n            alt={data.img?.alt || ''}\n            className=\"size-full\"\n            imgClassName=\"w-full h-full object-cover hover:scale-110 transition-all duration-300\"\n          />\n        )}\n        <div className=\"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4\">\n          {data.video && (\n            <button\n              onClick={() => {\n                if (isPlaying) {\n                  if (videoRef.current) {\n                    videoRef.current.pause()\n                  }\n                  setIsPlaying(false)\n                } else {\n                  if (videoRef.current) {\n                    videoRef.current.play()\n                  }\n                  setIsPlaying(true)\n                }\n                configuration?.onVideoPlayBtnClick && configuration?.onVideoPlayBtnClick?.(configuration?.index || 0)\n              }}\n              className=\"tablet:size-12 flex size-10 items-center justify-center rounded-full bg-white bg-opacity-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        </div>\n      </div>\n\n      <div className=\"laptop:gap-[60px] lg-desktop:p-8 tablet:p-6 bg-container-secondary-1 flex min-h-[200px] flex-1 flex-col justify-between gap-4 overflow-hidden p-4\">\n        <div className=\"flex flex-col\">\n          <h3 className=\"desktop:text-lg text-info-primary mb-2 text-sm font-bold leading-[1.2] tracking-[-0.02em]\">\n            {data.title}\n          </h3>\n          {data.quote && (\n            <p className=\"desktop:text-lg text-info-primary text-sm font-bold leading-[1.2] tracking-[-0.02em]\">\n              {data.quote}\n            </p>\n          )}\n        </div>\n\n        <p className=\"lg-desktop:text-2xl text-info-primary desktop:max-h-[186px] line-clamp-6 max-h-[144px] min-h-[100px] text-xl font-bold leading-[1.2] tracking-[-0.04em]\">\n          {data.description}\n        </p>\n      </div>\n    </div>\n  )\n}\n\nconst MediaPlayerMulti = forwardRef<HTMLDivElement, MediaPlayerMultiProps>(\n  ({ data: { items = [], shape = 'square', title }, className = '', key, onVideoPlayBtnClick }, ref) => {\n    const title_html = typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title })\n    return (\n      <div className={className} ref={ref}>\n        {title && <Title data={{ title: title_html || '' }} />}\n        <SwiperBox\n          className=\"!overflow-visible\"\n          id={'MediaPlayerMultiSwiper' + key}\n          data={{ list: items, configuration: { shape: shape, onVideoPlayBtnClick } }}\n          Slide={MediaPlayerItem}\n        />\n      </div>\n    )\n  }\n)\n\nexport default withStyles(MediaPlayerMulti)\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsBM,IAAAI,EAAA,6BArBNC,EAAoD,iBACpDC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAwB,qCACxBC,EAAkB,gCAClBC,EAAsB,oCACtBC,EAAqC,6CAGrC,MAAMC,EAAkB,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAA2D,CACxG,KAAM,CAACC,EAAWC,CAAY,KAAI,YAAkB,EAAK,EACnDC,KAAW,UAAyB,IAAI,EAC9C,SACE,QAAC,OACC,aAAW,MACT,2CACA,yCACA,iEACAH,EAAc,QAAU,QAAU,cAAgB,EACpD,EAEA,qBAAC,OAAI,UAAU,+DACZ,UAAAC,KACC,OAAC,SAAM,IAAKE,EAAU,UAAU,yBAAyB,IAAKJ,GAAM,OAAO,IAAK,MAAK,GAAC,KAAI,GAAC,KAE3F,OAAC,WACC,OAAQA,EAAK,KAAK,IAClB,IAAKA,EAAK,KAAK,KAAO,GACtB,UAAU,YACV,aAAa,yEACf,KAEF,OAAC,OAAI,UAAU,2DACZ,SAAAA,EAAK,UACJ,OAAC,UACC,QAAS,IAAM,CACTE,GACEE,EAAS,SACXA,EAAS,QAAQ,MAAM,EAEzBD,EAAa,EAAK,IAEdC,EAAS,SACXA,EAAS,QAAQ,KAAK,EAExBD,EAAa,EAAI,GAEnBF,GAAe,qBAAuBA,GAAe,sBAAsBA,GAAe,OAAS,CAAC,CACtG,EACA,UAAU,gHAEV,mBAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,mBAAC,QAAK,EAAE,uBAAuB,KAAK,QAAQ,EAC9C,EACF,EAEJ,GACF,KAEA,QAAC,OAAI,UAAU,oJACb,qBAAC,OAAI,UAAU,gBACb,oBAAC,MAAG,UAAU,4FACX,SAAAD,EAAK,MACR,EACCA,EAAK,UACJ,OAAC,KAAE,UAAU,uFACV,SAAAA,EAAK,MACR,GAEJ,KAEA,OAAC,KAAE,UAAU,0JACV,SAAAA,EAAK,YACR,GACF,GACF,CAEJ,EAEMK,KAAmB,cACvB,CAAC,CAAE,KAAM,CAAE,MAAAC,EAAQ,CAAC,EAAG,MAAAC,EAAQ,SAAU,MAAAC,CAAM,EAAG,UAAAC,EAAY,GAAI,IAAAC,EAAK,oBAAAC,CAAoB,EAAGC,IAAQ,CACpG,MAAMC,EAAa,OAAOL,GAAU,SAAWA,EAAQA,MAAS,wBAAqB,CAAE,KAAMA,CAAM,CAAC,EACpG,SACE,QAAC,OAAI,UAAWC,EAAW,IAAKG,EAC7B,UAAAJ,MAAS,OAAC,EAAAM,QAAA,CAAM,KAAM,CAAE,MAAOD,GAAc,EAAG,EAAG,KACpD,OAAC,EAAAE,QAAA,CACC,UAAU,oBACV,GAAI,yBAA2BL,EAC/B,KAAM,CAAE,KAAMJ,EAAO,cAAe,CAAE,MAAOC,EAAO,oBAAAI,CAAoB,CAAE,EAC1E,MAAOZ,EACT,GACF,CAEJ,CACF,EAEA,IAAOV,KAAQ,cAAWgB,CAAgB",
+  "names": ["MediaPlayerMulti_exports", "__export", "MediaPlayerMulti_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_components", "import_Title", "import_SwiperBox", "import_html", "MediaPlayerItem", "data", "configuration", "isPlaying", "setIsPlaying", "videoRef", "MediaPlayerMulti", "items", "shape", "title", "className", "key", "onVideoPlayBtnClick", "ref", "title_html", "Title", "SwiperBox"]
 }

package/dist/cjs/biz-components/MediaPlayerMulti/types.d.ts

@@ -13,4 +13,5 @@ export interface MediaPlayerMultiProps extends ComponentCommonProps {
         shape?: 'round' | 'square';
         items: MediaPlayerItemProps[];
     };
+    onVideoPlayBtnClick?: (jIndex: number) => void;
 }

package/dist/cjs/biz-components/MediaPlayerMulti/types.js

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

package/dist/cjs/biz-components/MediaPlayerMulti/types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerMulti/types.ts"],
-  "sourcesContent": ["import type { ComponentCommonProps, Img, Video } from '../../types/props.js'\n\nexport interface MediaPlayerItemProps {\n  title: string\n  name: string\n  description: string\n  img: Img\n  video?: Video\n  quote?: string\n}\n\nexport interface MediaPlayerMultiProps extends ComponentCommonProps {\n  data: {\n    title?: string\n    shape?: 'round' | 'square'\n    items: MediaPlayerItemProps[]\n  }\n}\n"],
+  "sourcesContent": ["import type { ComponentCommonProps, Img, Video } from '../../types/props.js'\n\nexport interface MediaPlayerItemProps {\n  title: string\n  name: string\n  description: string\n  img: Img\n  video?: Video\n  quote?: string\n}\n\nexport interface MediaPlayerMultiProps extends ComponentCommonProps {\n  data: {\n    title?: string\n    shape?: 'round' | 'square'\n    items: MediaPlayerItemProps[]\n  }\n  onVideoPlayBtnClick?: (jIndex: number) => void\n}\n"],
   "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
   "names": ["types_exports", "__toCommonJS"]
 }

package/dist/cjs/biz-components/MediaPlayerSticky/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { MediaPlayerBaseProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<MediaPlayerBaseProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
+declare const _default: React.ForwardRefExoticComponent<Omit<Omit<MediaPlayerBaseProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
     className?: string;
     data?: Record<string, any>;
-} & React.RefAttributes<any>>;
+}, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/cjs/biz-components/MediaPlayerSticky/index.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var L=Object.create;var c=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var B=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var Y=(r,a)=>{for(var t in a)c(r,t,{get:a[t],enumerable:!0})},v=(r,a,t,s)=>{if(a&&typeof a=="object"||typeof a=="function")for(let o of q(a))!H.call(r,o)&&o!==t&&c(r,o,{get:()=>a[o],enumerable:!(s=T(a,o))||s.enumerable});return r};var l=(r,a,t)=>(t=r!=null?L(B(r)):{},v(a||!r||!r.__esModule?c(t,"default",{value:r,enumerable:!0}):t,r)),E=r=>v(c({},"__esModule",{value:!0}),r);var I={};Y(I,{default:()=>j});module.exports=E(I);var e=require("react/jsx-runtime"),n=require("react"),m=require("../../helpers/utils.js"),g=require("../../shared/Styles.js"),h=l(require("../Slogan/index.js")),i=require("../../components/gird.js"),x=require("../../components/container.js"),w=l(require("../BrandEquity/index.js")),k=l(require("../MemberEquity/index.js")),N=l(require("../Spacer/index.js")),C=l(require("gsap")),u=require("@payloadcms/richtext-lexical/html"),M=require("react-responsive"),S=l(require("../../components/picture.js"));const b=({defaultConverters:r})=>({...r,text:a=>{const{node:t}=a;return t.$&&t.$.color?`<div class="lexical-${t.$.color}">${t.text}</div>`:t.text}}),d=({children:r,spaceY:a})=>{const t=(0,M.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(x.Container,{spaceY:a,children:(0,e.jsxs)(i.Grid,{children:[!t&&(0,e.jsx)(i.GridItem,{span:1}),(0,e.jsx)(i.GridItem,{span:t?12:10,children:r}),!t&&(0,e.jsx)(i.GridItem,{span:1})]})})},F=({children:r,id:a,components:t})=>((0,n.useEffect)(()=>{const s=window.screen.height;C.default.timeline({scrollTrigger:{trigger:`#${a}`,start:"top top",end:`top+=${s*1.8}px bottom`,scrub:0}}).to(`#${a} .sticky-cover`,{opacity:1,duration:.3}).to(`#${a} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")},[]),(0,e.jsxs)("div",{id:a,className:"relative z-10 pb-10",children:[(0,e.jsx)(e.Fragment,{children:r}),(0,e.jsx)(e.Fragment,{children:t?.map(s=>{switch(s.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(d,{spaceY:"!my-0",children:(0,e.jsx)(w.default,{data:s,style:s?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(d,{spaceY:"!my-0",children:(0,e.jsx)(k.default,{data:s,className:"w-full",style:s?.style})})});case"ipc-spacer":return(0,e.jsx)(N.default,{data:s,style:s?.style});default:return null}})})]})),G=({className:r="",id:a,data:{title:t,videoTitle:s,btnText:o,img:p,video:y,theme:f,shape:z,components:P}})=>{const $=(0,n.useRef)(null),R=typeof t=="string"?t:t&&(0,u.convertLexicalToHTML)({data:t,converters:b});return typeof s=="string"||s&&(0,u.convertLexicalToHTML)({data:s,converters:b}),(0,e.jsxs)(F,{id:a,components:P,children:[(0,e.jsx)("div",{className:(0,m.cn)("sticky-box absolute left-0 top-0 h-screen w-full",r,{"aiui-dark":f==="dark","rounded-box":z==="rounded"}),children:(0,e.jsx)("div",{className:"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2",children:(0,e.jsx)(d,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)(h.default,{className:"sticky-title",data:{title:R||"",theme:f}})})})}),(0,e.jsx)("div",{className:"sticky left-0 top-0 w-full",children:(0,e.jsxs)("div",{className:(0,m.cn)("media-cover","relative h-screen w-full","lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]"),children:[y?.url&&(0,e.jsx)("video",{ref:$,className:"size-full object-cover",src:y?.url,autoPlay:!0,muted:!0,loop:!0,playsInline:!0}),p?.url&&(0,e.jsx)(S.default,{className:"z-1 absolute left-0 top-0 size-full object-cover",source:p?.url,alt:p?.alt,imgClassName:"w-full h-full object-cover"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full opacity-0",style:{background:"linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #1D1D1F 100%)"}})]})})]})};var j=(0,g.withStyles)(G);
+"use strict";"use client";var T=Object.create;var n=Object.defineProperty;var H=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var B=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var Y=(r,a)=>{for(var t in a)n(r,t,{get:a[t],enumerable:!0})},v=(r,a,t,s)=>{if(a&&typeof a=="object"||typeof a=="function")for(let o of q(a))!E.call(r,o)&&o!==t&&n(r,o,{get:()=>a[o],enumerable:!(s=H(a,o))||s.enumerable});return r};var l=(r,a,t)=>(t=r!=null?T(B(r)):{},v(a||!r||!r.__esModule?n(t,"default",{value:r,enumerable:!0}):t,r)),G=r=>v(n({},"__esModule",{value:!0}),r);var Q={};Y(Q,{default:()=>I});module.exports=G(Q);var e=require("react/jsx-runtime"),c=require("react"),m=require("../../helpers/utils.js"),g=require("../../shared/Styles.js"),h=l(require("../Slogan/index.js")),i=require("../../components/gird.js"),w=require("../../components/container.js"),x=l(require("../BrandEquity/index.js")),k=l(require("../MemberEquity/index.js")),N=l(require("../Spacer/index.js")),M=l(require("gsap")),u=require("@payloadcms/richtext-lexical/html"),C=require("react-responsive"),S=l(require("../../components/picture.js"));const b=({defaultConverters:r})=>({...r,text:a=>{const{node:t}=a;return t.$&&t.$.color?`<div class="lexical-${t.$.color}">${t.text}</div>`:t.text}}),d=({children:r,spaceY:a})=>{const t=(0,C.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(w.Container,{spaceY:a,children:(0,e.jsxs)(i.Grid,{children:[!t&&(0,e.jsx)(i.GridItem,{span:1}),(0,e.jsx)(i.GridItem,{span:t?12:10,children:r}),!t&&(0,e.jsx)(i.GridItem,{span:1})]})})},j=({children:r,id:a,components:t})=>((0,c.useEffect)(()=>{const s=window.screen.height;M.default.timeline({scrollTrigger:{trigger:`#${a}`,start:"top top",end:`top+=${s*1.8}px bottom`,scrub:0}}).to(`#${a} .sticky-cover`,{opacity:1,duration:.3}).to(`#${a} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")},[]),(0,e.jsxs)("div",{id:a,className:"relative z-10 pb-10",children:[(0,e.jsx)(e.Fragment,{children:r}),(0,e.jsx)(e.Fragment,{children:t?.map(s=>{switch(s.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(d,{spaceY:"!my-0",children:(0,e.jsx)(x.default,{data:s,style:s?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(d,{spaceY:"!my-0",children:(0,e.jsx)(k.default,{data:s,className:"w-full",style:s?.style})})});case"ipc-spacer":return(0,e.jsx)(N.default,{data:s,style:s?.style});default:return null}})})]})),F=(0,c.forwardRef)(({className:r="",id:a,data:{title:t,videoTitle:s,btnText:o,img:p,video:f,theme:y,shape:z,components:P}},$)=>{const R=(0,c.useRef)(null),L=typeof t=="string"?t:t&&(0,u.convertLexicalToHTML)({data:t,converters:b});return typeof s=="string"||s&&(0,u.convertLexicalToHTML)({data:s,converters:b}),(0,e.jsxs)(j,{id:a,components:P,children:[(0,e.jsx)("div",{ref:$,className:(0,m.cn)("sticky-box absolute left-0 top-0 h-screen w-full",r,{"aiui-dark":y==="dark","rounded-box":z==="rounded"}),children:(0,e.jsx)("div",{className:"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2",children:(0,e.jsx)(d,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)(h.default,{className:"sticky-title",data:{title:L||"",theme:y}})})})}),(0,e.jsx)("div",{className:"sticky left-0 top-0 w-full",children:(0,e.jsxs)("div",{className:(0,m.cn)("media-cover","relative h-screen w-full","lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]"),children:[f?.url&&(0,e.jsx)("video",{ref:R,className:"size-full object-cover",src:f?.url,autoPlay:!0,muted:!0,loop:!0,playsInline:!0}),p?.url&&(0,e.jsx)(S.default,{className:"z-1 absolute left-0 top-0 size-full object-cover",source:p?.url,alt:p?.alt,imgClassName:"w-full h-full object-cover"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full opacity-0",style:{background:"linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #1D1D1F 100%)"}})]})})]})});var I=(0,g.withStyles)(F);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/MediaPlayerSticky/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerSticky/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\n// import ScrollTrigger from 'gsap/ScrollTrigger'\nimport { defaultHTMLConverters, convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport Picture from '../../components/picture.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<div class=\"lexical-${node.$.color}\">${node.text}</div>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({ children, spaceY }: { children: React.ReactNode; spaceY?: string }) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst StickyBox = ({\n  children,\n  id,\n  components,\n}: {\n  children: React.ReactNode\n  id?: string\n  components?: MediaPlayerComponent[]\n}) => {\n  useEffect(() => {\n    const height = window.screen.height\n\n    gsap\n      .timeline({\n        scrollTrigger: {\n          trigger: `#${id}`,\n          start: 'top top',\n          end: `top+=${height * 1.8}px bottom`,\n          scrub: 0,\n        },\n      })\n      .to(`#${id} .sticky-cover`, {\n        opacity: 1,\n        duration: 0.3,\n      })\n      .to(\n        `#${id} .media-content`,\n        {\n          top: '100%',\n          transform: 'translate(-50%, -100%)',\n          duration: 1,\n        },\n        '<'\n      )\n  }, [])\n\n  return (\n    <div id={id} className=\"relative z-10 pb-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"!my-0\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"!my-0\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n}\n\nconst MediaPlayerSticky: React.FC<MediaPlayerBaseProps> = ({\n  className = '',\n  id,\n  data: { title, videoTitle, btnText, img, video, theme, shape, components },\n}) => {\n  const videoRef = useRef<HTMLVideoElement>(null)\n\n  const title_html =\n    typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n  typeof videoTitle === 'string'\n    ? videoTitle\n    : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n  return (\n    <StickyBox id={id} components={components}>\n      <div\n        className={cn('sticky-box absolute left-0 top-0 h-screen w-full', className, {\n          'aiui-dark': theme === 'dark',\n          'rounded-box': shape === 'rounded',\n        })}\n      >\n        <div className=\"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2\">\n          <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n            <Slogan className=\"sticky-title\" data={{ title: title_html || '', theme }} />\n          </SubContainer>\n        </div>\n      </div>\n      <div className=\"sticky left-0 top-0 w-full\">\n        <div\n          className={cn(\n            'media-cover',\n            'relative h-screen w-full',\n            'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n          )}\n        >\n          {video?.url && (\n            <video ref={videoRef} className=\"size-full object-cover\" src={video?.url} autoPlay muted loop playsInline />\n          )}\n          {img?.url && (\n            <Picture\n              className=\"z-1 absolute left-0 top-0 size-full object-cover\"\n              source={img?.url}\n              alt={img?.alt}\n              imgClassName=\"w-full h-full object-cover\"\n            />\n          )}\n          <div\n            className=\"sticky-cover absolute left-0 top-0 z-10 size-full opacity-0\"\n            style={{\n              background: 'linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #1D1D1F 100%)',\n            }}\n          />\n        </div>\n      </div>\n    </StickyBox>\n  )\n}\n\nexport default withStyles(MediaPlayerSticky)\n"],
-  "mappings": "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",
-  "names": ["MediaPlayerSticky_exports", "__export", "MediaPlayerSticky_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_Slogan", "import_gird", "import_container", "import_BrandEquity", "import_MemberEquity", "import_Spacer", "import_gsap", "import_html", "import_react_responsive", "import_picture", "htmlConverters", "defaultConverters", "args", "node", "SubContainer", "children", "spaceY", "isMobile", "StickyBox", "id", "components", "height", "gsap", "componentData", "BrandEquity", "MemberEquity", "Spacer", "MediaPlayerSticky", "className", "title", "videoTitle", "btnText", "img", "video", "theme", "shape", "videoRef", "title_html", "Slogan", "Picture"]
+  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect, forwardRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\n// import ScrollTrigger from 'gsap/ScrollTrigger'\nimport { defaultHTMLConverters, convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport Picture from '../../components/picture.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<div class=\"lexical-${node.$.color}\">${node.text}</div>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({ children, spaceY }: { children: React.ReactNode; spaceY?: string }) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst StickyBox = ({\n  children,\n  id,\n  components,\n}: {\n  children: React.ReactNode\n  id?: string\n  components?: MediaPlayerComponent[]\n}) => {\n  useEffect(() => {\n    const height = window.screen.height\n\n    gsap\n      .timeline({\n        scrollTrigger: {\n          trigger: `#${id}`,\n          start: 'top top',\n          end: `top+=${height * 1.8}px bottom`,\n          scrub: 0,\n        },\n      })\n      .to(`#${id} .sticky-cover`, {\n        opacity: 1,\n        duration: 0.3,\n      })\n      .to(\n        `#${id} .media-content`,\n        {\n          top: '100%',\n          transform: 'translate(-50%, -100%)',\n          duration: 1,\n        },\n        '<'\n      )\n  }, [])\n\n  return (\n    <div id={id} className=\"relative z-10 pb-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"!my-0\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"!my-0\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n}\n\nconst MediaPlayerSticky = forwardRef<HTMLDivElement, MediaPlayerBaseProps>(\n  ({ className = '', id, data: { title, videoTitle, btnText, img, video, theme, shape, components } }, ref) => {\n    const videoRef = useRef<HTMLVideoElement>(null)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    typeof videoTitle === 'string'\n      ? videoTitle\n      : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    return (\n      <StickyBox id={id} components={components}>\n        <div\n          ref={ref}\n          className={cn('sticky-box absolute left-0 top-0 h-screen w-full', className, {\n            'aiui-dark': theme === 'dark',\n            'rounded-box': shape === 'rounded',\n          })}\n        >\n          <div className=\"media-content absolute left-1/2 top-1/2 z-20 w-full -translate-x-1/2 -translate-y-1/2\">\n            <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n              <Slogan className=\"sticky-title\" data={{ title: title_html || '', theme }} />\n            </SubContainer>\n          </div>\n        </div>\n        <div className=\"sticky left-0 top-0 w-full\">\n          <div\n            className={cn(\n              'media-cover',\n              'relative h-screen w-full',\n              'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]'\n            )}\n          >\n            {video?.url && (\n              <video\n                ref={videoRef}\n                className=\"size-full object-cover\"\n                src={video?.url}\n                autoPlay\n                muted\n                loop\n                playsInline\n              />\n            )}\n            {img?.url && (\n              <Picture\n                className=\"z-1 absolute left-0 top-0 size-full object-cover\"\n                source={img?.url}\n                alt={img?.alt}\n                imgClassName=\"w-full h-full object-cover\"\n              />\n            )}\n            <div\n              className=\"sticky-cover absolute left-0 top-0 z-10 size-full opacity-0\"\n              style={{\n                background: 'linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #1D1D1F 100%)',\n              }}\n            />\n          </div>\n        </div>\n      </StickyBox>\n    )\n  }\n)\n\nexport default withStyles(MediaPlayerSticky)\n"],
+  "mappings": "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",
+  "names": ["MediaPlayerSticky_exports", "__export", "MediaPlayerSticky_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_Slogan", "import_gird", "import_container", "import_BrandEquity", "import_MemberEquity", "import_Spacer", "import_gsap", "import_html", "import_react_responsive", "import_picture", "htmlConverters", "defaultConverters", "args", "node", "SubContainer", "children", "spaceY", "isMobile", "StickyBox", "id", "components", "height", "gsap", "componentData", "BrandEquity", "MemberEquity", "Spacer", "MediaPlayerSticky", "className", "title", "videoTitle", "btnText", "img", "video", "theme", "shape", "ref", "videoRef", "title_html", "Slogan", "Picture"]
 }

package/dist/cjs/biz-components/SwiperBox/types.d.ts

@@ -3,6 +3,7 @@ export interface SwiperBoxProps {
     data: {
         list: any[];
         configuration?: any;
+        onVideoPlayBtnClick?: (jIndex: number) => void;
     };
     id: string;
     className?: string;
@@ -10,5 +11,6 @@ export interface SwiperBoxProps {
     Slide: React.ComponentType<{
         data: any;
         configuration?: any;
+        jIndex?: number;
     }>;
 }

package/dist/cjs/biz-components/SwiperBox/types.js

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

package/dist/cjs/biz-components/SwiperBox/types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/SwiperBox/types.ts"],
-  "sourcesContent": ["import React from 'react'\n\nexport interface SwiperBoxProps {\n  data: {\n    list: any[]\n    configuration?: any\n  }\n  id: string\n  className?: string\n  breakpoints?: Record<number, Object>\n  Slide: React.ComponentType<{ data: any, configuration?: any }>\n}\n"],
+  "sourcesContent": ["import React from 'react'\n\nexport interface SwiperBoxProps {\n  data: {\n    list: any[]\n    configuration?: any\n    onVideoPlayBtnClick?: (jIndex: number) => void\n  }\n  id: string\n  className?: string\n  breakpoints?: Record<number, Object>\n  Slide: React.ComponentType<{ data: any; configuration?: any; jIndex?: number }>\n}\n"],
   "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD,GAAA,IAAAE,EAAkB",
   "names": ["types_exports", "__toCommonJS", "import_react"]
 }

package/dist/cjs/stories/accordionCards.stories.d.ts

@@ -19,6 +19,9 @@ declare const meta: {
             primaryButton?: string;
             theme?: "light" | "dark";
         };
+        event?: {
+            primaryButton?: (v: any, index: number) => void;
+        };
     } & import("react").RefAttributes<HTMLDivElement>, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
         className?: string;
         data?: Record<string, any>;

package/dist/cjs/stories/brandEquity.stories.d.ts

@@ -1,10 +1,10 @@
 import type { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Omit<import("../biz-components/BrandEquity/types.js").BrandEquityProps, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
+    component: import("react").ForwardRefExoticComponent<Omit<Omit<import("../biz-components/BrandEquity/types.js").BrandEquityProps & import("react").RefAttributes<HTMLDivElement>, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
         className?: string;
         data?: Record<string, any>;
-    } & import("react").RefAttributes<any>>;
+    }, "ref"> & import("react").RefAttributes<any>>;
     parameters: {
         layout: string;
     };

package/dist/cjs/stories/mediaplayerMulti.stories.d.ts

@@ -1,10 +1,10 @@
 import type { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Omit<import("../biz-components/MediaPlayerMulti/types.js").MediaPlayerMultiProps, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
+    component: import("react").ForwardRefExoticComponent<Omit<Omit<import("../biz-components/MediaPlayerMulti/types.js").MediaPlayerMultiProps & import("react").RefAttributes<HTMLDivElement>, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
         className?: string;
         data?: Record<string, any>;
-    } & import("react").RefAttributes<any>>;
+    }, "ref"> & import("react").RefAttributes<any>>;
     parameters: {
         layout: string;
     };

package/dist/esm/biz-components/AccordionCards/index.d.ts

@@ -25,6 +25,10 @@ type AccordionCardsType = {
         primaryButton?: string;
         theme?: 'light' | 'dark';
     };
+    /** 按钮事件*/
+    event?: {
+        primaryButton?: (v: any, index: number) => void;
+    };
 };
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<AccordionCardsType & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
     className?: string;

package/dist/esm/biz-components/AccordionCards/index.js

@@ -1,2 +1,2 @@
-"use client";import{Fragment as H,jsx as r,jsxs as s}from"react/jsx-runtime";import S from"../Title/index.js";import{cn as n}from"../../helpers/utils.js";import b from"../../components/picture.js";import h from"../../components/button.js";import M from"../SwiperBox/index.js";import"../../components/link.js";import{withStyles as C}from"../../shared/Styles.js";import L,{useState as x,useEffect as I,useRef as c,useCallback as A}from"react";const R=L.forwardRef(({data:o,className:m=""},y)=>{const[a,k]=x(0),[g,w]=x({0:!0}),d=c([]),u=c({0:!0}),l=c(!1),N=(e,t)=>{t&&(d.current[e]=t)},p=e=>{u.current?.[e]&&(l.current=!1,w({[e]:!0}))};I(()=>{const e=d.current;return e?.forEach((t,i)=>{i?(t.style.flex="1 1 0%",t.style.transition="all 0.6s"):(t.style.flex="5 1 0%",t.style.transition="all 0.6s"),t.addEventListener("transitionend",()=>{p(i)})}),()=>{e?.forEach((t,i)=>{t.removeEventListener("transitionend",()=>p(i))})}},[]);const T=({data:e,configuration:t})=>s("div",{className:n("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",t?.itemShape==="round"?"rounded-2xl":""),children:[r(b,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:e?.img?.url}),s("div",{className:n("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[s("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[r("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:e?.title}),r("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),r("a",{href:e.link,children:r(h,{variant:"secondary",className:n("text-info-primary text-sm font-bold"),children:t?.primaryButton})})]})]}),f=A(e=>{a===e||l.current||(l.current=!0,u.current={[e]:!0},k(e))},[a,l]);return s(H,{children:[o?.title&&r(S,{data:{title:o?.title}}),r("div",{ref:y,className:n("laptop:block hidden",{"aiui-dark":o?.theme==="dark"}),children:r("div",{className:n("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",m),children:o?.products?.map((e,t)=>{const i=a===t,B=i?5:1,E=g?.[t]&&i;return s("div",{style:{flex:B},ref:v=>{v&&N(t,v)},className:n("relative cursor-pointer overflow-hidden",o?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>f(t),onMouseLeave:()=>{l.current=!1},onClick:()=>f(t),children:[r(b,{source:e?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),s("div",{className:n("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",E?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[s("div",{className:"mr-16 flex-1 overflow-hidden",children:[r("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:e?.title}),r("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),r("a",{href:e?.link,children:r(h,{variant:"secondary",className:n("desktop:text-base mb-1.5 text-sm font-bold"),children:o?.primaryButton})})]})]},t)})})}),r("div",{className:n("laptop:hidden block",{"aiui-dark":o?.theme==="dark"}),children:r(M,{className:n("h-[400px] !overflow-visible",m),id:"AccordionCards"+o?.key,data:{list:o?.products,configuration:{shape:o?.shape,itemShape:o?.itemShape,primaryButton:o?.primaryButton}},Slide:T,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.1},768:{spaceBetween:"12px",freeMode:!1,slidesPerView:2.3}}})})]})});var G=C(R);export{G as default};
+"use client";import{Fragment as j,jsx as r,jsxs as s}from"react/jsx-runtime";import S from"../Title/index.js";import{cn as n}from"../../helpers/utils.js";import h from"../../components/picture.js";import y from"../../components/button.js";import M from"../SwiperBox/index.js";import"../../components/link.js";import{withStyles as L}from"../../shared/Styles.js";import I,{useState as x,useEffect as A,useRef as m,useCallback as R}from"react";const H=I.forwardRef(({data:o,className:c="",event:d},k)=>{const[a,w]=x(0),[g,N]=x({0:!0}),p=m([]),u=m({0:!0}),l=m(!1),B=(t,e)=>{e&&(p.current[t]=e)},f=t=>{u.current?.[t]&&(l.current=!1,N({[t]:!0}))};A(()=>{const t=p.current;return t?.forEach((e,i)=>{i?(e.style.flex="1 1 0%",e.style.transition="all 0.6s"):(e.style.flex="5 1 0%",e.style.transition="all 0.6s"),e.addEventListener("transitionend",()=>{f(i)})}),()=>{t?.forEach((e,i)=>{e.removeEventListener("transitionend",()=>f(i))})}},[]);const T=({data:t,configuration:e})=>s("div",{className:n("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",e?.itemShape==="round"?"rounded-2xl":""),children:[r(h,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:t?.img?.url}),s("div",{className:n("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[s("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[r("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:t?.title}),r("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:t?.subTitle})]}),r("a",{href:t.link,onClick:()=>e?.event?.primaryButton(t,e),children:r(y,{variant:"secondary",className:n("text-info-primary text-sm font-bold"),children:e?.primaryButton})})]})]}),v=R(t=>{a===t||l.current||(l.current=!0,u.current={[t]:!0},w(t))},[a,l]);return s(j,{children:[o?.title&&r(S,{data:{title:o?.title}}),r("div",{ref:k,className:n("laptop:block hidden",{"aiui-dark":o?.theme==="dark"}),children:r("div",{className:n("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",c),children:o?.products?.map((t,e)=>{const i=a===e,E=i?5:1,C=g?.[e]&&i;return s("div",{style:{flex:E},ref:b=>{b&&B(e,b)},className:n("relative cursor-pointer overflow-hidden",o?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>v(e),onMouseLeave:()=>{l.current=!1},onClick:()=>v(e),children:[r(h,{source:t?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),s("div",{className:n("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",C?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[s("div",{className:"mr-16 flex-1 overflow-hidden",children:[r("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:t?.title}),r("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:t?.subTitle})]}),r("a",{href:t?.link,onClick:()=>d?.primaryButton?.(o,e),children:r(y,{variant:"secondary",className:n("desktop:text-base mb-1.5 text-sm font-bold"),children:o?.primaryButton})})]})]},e)})})}),r("div",{className:n("laptop:hidden block",{"aiui-dark":o?.theme==="dark"}),children:r(M,{className:n("h-[400px] !overflow-visible",c),id:"AccordionCards"+o?.key,data:{list:o?.products,configuration:{shape:o?.shape,itemShape:o?.itemShape,primaryButton:o?.primaryButton,event:d}},Slide:T,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.1},768:{spaceBetween:"12px",freeMode:!1,slidesPerView:2.3}}})})]})});var J=L(H);export{J as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/AccordionCards/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/AccordionCards/index.tsx"],
-  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport Link from '../../components/link.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback } from 'react'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: {\n    url: string\n  }\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n}\n\ntype AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(({ data, className = '' }, ref) => {\n  const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n  const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({ 0: true })\n\n  const accordionRef = useRef<HTMLDivElement[]>([])\n  const enterRef = useRef<{ [key: number]: boolean }>({ 0: true })\n  const isAnimation = useRef<boolean>(false)\n\n  const getRef = (index: number, el: HTMLDivElement) => {\n    if (el) {\n      accordionRef.current[index] = el\n    }\n  }\n\n  const handleTransitionEnd = (index: number) => {\n    if (enterRef.current?.[index]) {\n      isAnimation.current = false\n      setCurrentWidth({ [index]: true })\n    }\n  }\n\n  useEffect(() => {\n    const element = accordionRef.current\n    element?.forEach((item, index) => {\n      if (!index) {\n        item.style.flex = '5 1 0%'\n        item.style.transition = 'all 0.6s'\n      } else {\n        item.style.flex = '1 1 0%'\n        item.style.transition = 'all 0.6s'\n      }\n      item.addEventListener('transitionend', () => {\n        handleTransitionEnd(index)\n      })\n    })\n    return () => {\n      element?.forEach((item, index) => {\n        item.removeEventListener('transitionend', () => handleTransitionEnd(index))\n      })\n    }\n  }, [])\n\n  const MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n    return (\n      <div\n        className={cn(\n          'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n          configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n        )}\n      >\n        <Picture className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" source={data?.img?.url} />\n        <div className={cn('absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4')}>\n          <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n            <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n            <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n          </div>\n          <a href={data.link}>\n            <Button variant=\"secondary\" className={cn('text-info-primary text-sm font-bold')}>\n              {configuration?.primaryButton}\n            </Button>\n          </a>\n        </div>\n      </div>\n    )\n  }\n\n  const handleSwiperItemClick = useCallback(\n    (idx: number) => {\n      if (hoverIndex === idx || isAnimation.current) return\n      isAnimation.current = true\n      // \u66F4\u65B0 ref \u72B6\u6001\n      enterRef.current = { [idx]: true }\n      // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n      setHoverIndex(idx)\n    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={ref} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n        <div\n          className={cn(\n            'lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden',\n            className\n          )}\n        >\n          {data?.products?.map((item, idx) => {\n            const isExpanded = hoverIndex === idx\n            const flexValue = isExpanded ? 5 : 1\n            const isShowContent = currentWidth?.[idx] && isExpanded\n            return (\n              <div\n                key={idx}\n                style={{\n                  flex: flexValue,\n                }}\n                ref={(el: HTMLDivElement | null) => {\n                  if (el) getRef(idx, el)\n                }}\n                className={cn(\n                  'relative cursor-pointer overflow-hidden',\n                  data?.itemShape === 'round' ? 'rounded-2xl' : ''\n                )}\n                onMouseEnter={() => handleSwiperItemClick(idx)}\n                onMouseLeave={() => {\n                  isAnimation.current = false\n                }}\n                onClick={() => handleSwiperItemClick(idx)}\n              >\n                <Picture\n                  source={item?.img?.url}\n                  className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n                />\n                <div\n                  className={cn(\n                    'absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8',\n                    isShowContent ? 'translate-x-0 opacity-100 transition-transform ease-out' : 'opacity-0'\n                  )}\n                >\n                  <div className=\"mr-16 flex-1 overflow-hidden\">\n                    <p className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n                      {item?.title}\n                    </p>\n                    <h3 className=\"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold\">\n                      {item?.subTitle}\n                    </h3>\n                  </div>\n                  <a href={item?.link}>\n                    <Button variant=\"secondary\" className={cn('desktop:text-base mb-1.5 text-sm font-bold')}>\n                      {data?.primaryButton}\n                    </Button>\n                  </a>\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n      <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n        <SwiperBox\n          className={cn('h-[400px] !overflow-visible', className)}\n          id={'AccordionCards' + data?.key}\n          data={{\n            list: data?.products,\n            configuration: {\n              shape: data?.shape,\n              itemShape: data?.itemShape,\n              primaryButton: data?.primaryButton,\n            },\n          }}\n          Slide={MobileItem}\n          breakpoints={{\n            0: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1.1,\n            },\n            768: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n})\nexport default withStyles(AccordionCards)\n"],
-  "mappings": "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",
-  "names": ["Fragment", "jsx", "jsxs", "Title", "cn", "Picture", "Button", "SwiperBox", "withStyles", "React", "useState", "useEffect", "useRef", "useCallback", "AccordionCards", "data", "className", "ref", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "enterRef", "isAnimation", "getRef", "index", "el", "handleTransitionEnd", "element", "item", "MobileItem", "configuration", "handleSwiperItemClick", "idx", "isExpanded", "flexValue", "isShowContent", "AccordionCards_default"]
+  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport Link from '../../components/link.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback } from 'react'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: {\n    url: string\n  }\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n}\n\ntype AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(({ data, className = '', event }, ref) => {\n  const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n  const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({ 0: true })\n\n  const accordionRef = useRef<HTMLDivElement[]>([])\n  const enterRef = useRef<{ [key: number]: boolean }>({ 0: true })\n  const isAnimation = useRef<boolean>(false)\n\n  const getRef = (index: number, el: HTMLDivElement) => {\n    if (el) {\n      accordionRef.current[index] = el\n    }\n  }\n\n  const handleTransitionEnd = (index: number) => {\n    if (enterRef.current?.[index]) {\n      isAnimation.current = false\n      setCurrentWidth({ [index]: true })\n    }\n  }\n\n  useEffect(() => {\n    const element = accordionRef.current\n    element?.forEach((item, index) => {\n      if (!index) {\n        item.style.flex = '5 1 0%'\n        item.style.transition = 'all 0.6s'\n      } else {\n        item.style.flex = '1 1 0%'\n        item.style.transition = 'all 0.6s'\n      }\n      item.addEventListener('transitionend', () => {\n        handleTransitionEnd(index)\n      })\n    })\n    return () => {\n      element?.forEach((item, index) => {\n        item.removeEventListener('transitionend', () => handleTransitionEnd(index))\n      })\n    }\n  }, [])\n\n  const MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n    return (\n      <div\n        className={cn(\n          'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n          configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n        )}\n      >\n        <Picture className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" source={data?.img?.url} />\n        <div className={cn('absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4')}>\n          <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n            <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n            <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n          </div>\n          <a href={data.link} onClick={() => configuration?.event?.primaryButton(data, configuration)}>\n            <Button variant=\"secondary\" className={cn('text-info-primary text-sm font-bold')}>\n              {configuration?.primaryButton}\n            </Button>\n          </a>\n        </div>\n      </div>\n    )\n  }\n\n  const handleSwiperItemClick = useCallback(\n    (idx: number) => {\n      if (hoverIndex === idx || isAnimation.current) return\n      isAnimation.current = true\n      // \u66F4\u65B0 ref \u72B6\u6001\n      enterRef.current = { [idx]: true }\n      // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n      setHoverIndex(idx)\n    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={ref} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n        <div\n          className={cn(\n            'lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden',\n            className\n          )}\n        >\n          {data?.products?.map((item, idx) => {\n            const isExpanded = hoverIndex === idx\n            const flexValue = isExpanded ? 5 : 1\n            const isShowContent = currentWidth?.[idx] && isExpanded\n            return (\n              <div\n                key={idx}\n                style={{\n                  flex: flexValue,\n                }}\n                ref={(el: HTMLDivElement | null) => {\n                  if (el) getRef(idx, el)\n                }}\n                className={cn(\n                  'relative cursor-pointer overflow-hidden',\n                  data?.itemShape === 'round' ? 'rounded-2xl' : ''\n                )}\n                onMouseEnter={() => handleSwiperItemClick(idx)}\n                onMouseLeave={() => {\n                  isAnimation.current = false\n                }}\n                onClick={() => handleSwiperItemClick(idx)}\n              >\n                <Picture\n                  source={item?.img?.url}\n                  className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n                />\n                <div\n                  className={cn(\n                    'absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8',\n                    isShowContent ? 'translate-x-0 opacity-100 transition-transform ease-out' : 'opacity-0'\n                  )}\n                >\n                  <div className=\"mr-16 flex-1 overflow-hidden\">\n                    <p className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n                      {item?.title}\n                    </p>\n                    <h3 className=\"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold\">\n                      {item?.subTitle}\n                    </h3>\n                  </div>\n                  <a href={item?.link} onClick={() => event?.primaryButton?.(data, idx)}>\n                    <Button variant=\"secondary\" className={cn('desktop:text-base mb-1.5 text-sm font-bold')}>\n                      {data?.primaryButton}\n                    </Button>\n                  </a>\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n      <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n        <SwiperBox\n          className={cn('h-[400px] !overflow-visible', className)}\n          id={'AccordionCards' + data?.key}\n          data={{\n            list: data?.products,\n            configuration: {\n              shape: data?.shape,\n              itemShape: data?.itemShape,\n              primaryButton: data?.primaryButton,\n              event: event,\n            },\n          }}\n          Slide={MobileItem}\n          breakpoints={{\n            0: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1.1,\n            },\n            768: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n})\nexport default withStyles(AccordionCards)\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "Title", "cn", "Picture", "Button", "SwiperBox", "withStyles", "React", "useState", "useEffect", "useRef", "useCallback", "AccordionCards", "data", "className", "event", "ref", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "enterRef", "isAnimation", "getRef", "index", "el", "handleTransitionEnd", "element", "item", "MobileItem", "configuration", "handleSwiperItemClick", "idx", "isExpanded", "flexValue", "isShowContent", "AccordionCards_default"]
 }

package/dist/esm/biz-components/BrandEquity/BrandEquity.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { BrandEquityProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<BrandEquityProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
+declare const _default: React.ForwardRefExoticComponent<Omit<Omit<BrandEquityProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
     className?: string;
     data?: Record<string, any>;
-} & React.RefAttributes<any>>;
+}, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/BrandEquity/BrandEquity.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import"react";import{cn as a}from"../../helpers/utils.js";import p from"../../components/picture.js";import{withStyles as n}from"../../shared/Styles.js";const m=({data:{items:r=[],itemShape:i},className:d})=>e("div",{className:a("brand-equity-wrapper w-full",d),children:e("div",{className:a("grid grid-cols-1 gap-3","tablet:grid-cols-2","laptop:gap-4 laptop:grid-cols-10"),children:r.map((t,l)=>s("div",{className:a("brand-equity-item","flex flex-col bg-white p-4","desktop:p-6 desktop:gap-16 gap-12","laptop:col-span-3 lg-desktop:p-8",{"laptop:col-span-4":[0,5,6,11].includes(l)},i==="round"?"rounded-2xl":"rounded-none"),children:[s("div",{className:"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3",children:[e("h3",{className:"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]",children:t.title}),t.type==="avatar"?e("div",{className:"flex -space-x-2",children:t?.avatarList?.map((o,c)=>e("div",{className:a("size-[30px] overflow-hidden rounded-full border-2 border-white","relative inline-block","lg-desktop:size-[36px]"),children:e(p,{source:o.avatar.url,alt:o.avatar?.alt,className:"size-full object-cover"})},c))}):e(p,{className:"lg-desktop:size-[36px] size-[30px] shrink-0 object-cover",source:t.icon?.url,alt:t.icon?.alt,imgClassName:"w-full h-full object-cover"})]}),e("p",{className:"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]",children:t.description})]},l))})});var b=n(m);export{b as default};
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{forwardRef as m}from"react";import{cn as a}from"../../helpers/utils.js";import p from"../../components/picture.js";import{withStyles as u}from"../../shared/Styles.js";const f=m(({data:{items:s=[],itemShape:i},className:d},c)=>e("div",{ref:c,className:a("brand-equity-wrapper w-full",d),children:e("div",{className:a("grid grid-cols-1 gap-3","tablet:grid-cols-2","laptop:gap-4 laptop:grid-cols-10"),children:s.map((t,l)=>r("div",{className:a("brand-equity-item","flex flex-col bg-white p-4","desktop:p-6 desktop:gap-16 gap-12","laptop:col-span-3 lg-desktop:p-8",{"laptop:col-span-4":[0,5,6,11].includes(l)},i==="round"?"rounded-2xl":"rounded-none"),children:[r("div",{className:"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3",children:[e("h3",{className:"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]",children:t.title}),t.type==="avatar"?e("div",{className:"flex -space-x-2",children:t?.avatarList?.map((o,n)=>e("div",{className:a("size-[30px] overflow-hidden rounded-full border-2 border-white","relative inline-block","lg-desktop:size-[36px]"),children:e(p,{source:o.avatar.url,alt:o.avatar?.alt,className:"size-full object-cover"})},n))}):e(p,{className:"lg-desktop:size-[36px] size-[30px] shrink-0 object-cover",source:t.icon?.url,alt:t.icon?.alt,imgClassName:"w-full h-full object-cover"})]}),e("p",{className:"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]",children:t.description})]},l))})}));var y=u(f);export{y as default};
 //# sourceMappingURL=BrandEquity.js.map

package/dist/esm/biz-components/BrandEquity/BrandEquity.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/BrandEquity/BrandEquity.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\n\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { BrandEquityProps } from './types.js'\n\nimport type { Img } from '../../types/props.js'\n\nconst BrandEquity: React.FC<BrandEquityProps> = ({ data: { items = [], itemShape }, className }) => {\n  return (\n    <div className={cn('brand-equity-wrapper w-full', className)}>\n      <div className={cn('grid grid-cols-1 gap-3', 'tablet:grid-cols-2', 'laptop:gap-4 laptop:grid-cols-10')}>\n        {items.map((item, index) => (\n          <div\n            key={index}\n            className={cn(\n              'brand-equity-item',\n              'flex flex-col bg-white p-4',\n              'desktop:p-6 desktop:gap-16 gap-12',\n              'laptop:col-span-3 lg-desktop:p-8',\n              {\n                ['laptop:col-span-4']: [0, 5, 6, 11].includes(index),\n              },\n              itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n            )}\n          >\n            <div className=\"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3\">\n              <h3 className=\"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]\">\n                {item.title}\n              </h3>\n              {item.type === 'avatar' ? (\n                <div className=\"flex -space-x-2\">\n                  {item?.avatarList?.map((item: { avatar: Img }, index: number) => (\n                    <div\n                      key={index}\n                      className={cn(\n                        'size-[30px] overflow-hidden rounded-full border-2 border-white',\n                        'relative inline-block',\n                        'lg-desktop:size-[36px]'\n                      )}\n                    >\n                      <Picture source={item.avatar.url} alt={item.avatar?.alt} className=\"size-full object-cover\" />\n                    </div>\n                  ))}\n                </div>\n              ) : (\n                <Picture\n                  className=\"lg-desktop:size-[36px] size-[30px] shrink-0 object-cover\"\n                  source={item.icon?.url}\n                  alt={item.icon?.alt}\n                  imgClassName=\"w-full h-full object-cover\"\n                />\n              )}\n            </div>\n            <p className=\"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]\">\n              {item.description}\n            </p>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withStyles(BrandEquity)\n"],
-  "mappings": "aA4BY,OACE,OAAAA,EADF,QAAAC,MAAA,oBA3BZ,MAAkB,QAElB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAS,cAAAC,MAAkB,yBAK3B,MAAMC,EAA0C,CAAC,CAAE,KAAM,CAAE,MAAAC,EAAQ,CAAC,EAAG,UAAAC,CAAU,EAAG,UAAAC,CAAU,IAE1FR,EAAC,OAAI,UAAWE,EAAG,8BAA+BM,CAAS,EACzD,SAAAR,EAAC,OAAI,UAAWE,EAAG,yBAA0B,qBAAsB,kCAAkC,EAClG,SAAAI,EAAM,IAAI,CAACG,EAAMC,IAChBT,EAAC,OAEC,UAAWC,EACT,oBACA,6BACA,oCACA,mCACA,CACG,oBAAsB,CAAC,EAAG,EAAG,EAAG,EAAE,EAAE,SAASQ,CAAK,CACrD,EACAH,IAAc,QAAU,cAAgB,cAC1C,EAEA,UAAAN,EAAC,OAAI,UAAU,uEACb,UAAAD,EAAC,MAAG,UAAU,mGACX,SAAAS,EAAK,MACR,EACCA,EAAK,OAAS,SACbT,EAAC,OAAI,UAAU,kBACZ,SAAAS,GAAM,YAAY,IAAI,CAACA,EAAuBC,IAC7CV,EAAC,OAEC,UAAWE,EACT,iEACA,wBACA,wBACF,EAEA,SAAAF,EAACG,EAAA,CAAQ,OAAQM,EAAK,OAAO,IAAK,IAAKA,EAAK,QAAQ,IAAK,UAAU,yBAAyB,GAPvFC,CAQP,CACD,EACH,EAEAV,EAACG,EAAA,CACC,UAAU,2DACV,OAAQM,EAAK,MAAM,IACnB,IAAKA,EAAK,MAAM,IAChB,aAAa,6BACf,GAEJ,EACAT,EAAC,KAAE,UAAU,+FACV,SAAAS,EAAK,YACR,IA1CKC,CA2CP,CACD,EACH,EACF,EAIJ,IAAOC,EAAQP,EAAWC,CAAW",
-  "names": ["jsx", "jsxs", "cn", "Picture", "withStyles", "BrandEquity", "items", "itemShape", "className", "item", "index", "BrandEquity_default"]
+  "sourcesContent": ["'use client'\nimport React, { forwardRef } from 'react'\n\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { BrandEquityProps } from './types.js'\n\nimport type { Img } from '../../types/props.js'\n\nconst BrandEquity = forwardRef<HTMLDivElement, BrandEquityProps>(\n  ({ data: { items = [], itemShape }, className }, ref) => {\n    return (\n      <div ref={ref} className={cn('brand-equity-wrapper w-full', className)}>\n        <div className={cn('grid grid-cols-1 gap-3', 'tablet:grid-cols-2', 'laptop:gap-4 laptop:grid-cols-10')}>\n          {items.map((item, index) => (\n            <div\n              key={index}\n              className={cn(\n                'brand-equity-item',\n                'flex flex-col bg-white p-4',\n                'desktop:p-6 desktop:gap-16 gap-12',\n                'laptop:col-span-3 lg-desktop:p-8',\n                {\n                  ['laptop:col-span-4']: [0, 5, 6, 11].includes(index),\n                },\n                itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n              )}\n            >\n              <div className=\"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3\">\n                <h3 className=\"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]\">\n                  {item.title}\n                </h3>\n                {item.type === 'avatar' ? (\n                  <div className=\"flex -space-x-2\">\n                    {item?.avatarList?.map((item: { avatar: Img }, index: number) => (\n                      <div\n                        key={index}\n                        className={cn(\n                          'size-[30px] overflow-hidden rounded-full border-2 border-white',\n                          'relative inline-block',\n                          'lg-desktop:size-[36px]'\n                        )}\n                      >\n                        <Picture source={item.avatar.url} alt={item.avatar?.alt} className=\"size-full object-cover\" />\n                      </div>\n                    ))}\n                  </div>\n                ) : (\n                  <Picture\n                    className=\"lg-desktop:size-[36px] size-[30px] shrink-0 object-cover\"\n                    source={item.icon?.url}\n                    alt={item.icon?.alt}\n                    imgClassName=\"w-full h-full object-cover\"\n                  />\n                )}\n              </div>\n              <p className=\"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]\">\n                {item.description}\n              </p>\n            </div>\n          ))}\n        </div>\n      </div>\n    )\n  }\n)\n\nexport default withStyles(BrandEquity)\n"],
+  "mappings": "aA6Bc,OACE,OAAAA,EADF,QAAAC,MAAA,oBA5Bd,OAAgB,cAAAC,MAAkB,QAElC,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAS,cAAAC,MAAkB,yBAK3B,MAAMC,EAAcJ,EAClB,CAAC,CAAE,KAAM,CAAE,MAAAK,EAAQ,CAAC,EAAG,UAAAC,CAAU,EAAG,UAAAC,CAAU,EAAGC,IAE7CV,EAAC,OAAI,IAAKU,EAAK,UAAWP,EAAG,8BAA+BM,CAAS,EACnE,SAAAT,EAAC,OAAI,UAAWG,EAAG,yBAA0B,qBAAsB,kCAAkC,EAClG,SAAAI,EAAM,IAAI,CAACI,EAAMC,IAChBX,EAAC,OAEC,UAAWE,EACT,oBACA,6BACA,oCACA,mCACA,CACG,oBAAsB,CAAC,EAAG,EAAG,EAAG,EAAE,EAAE,SAASS,CAAK,CACrD,EACAJ,IAAc,QAAU,cAAgB,cAC1C,EAEA,UAAAP,EAAC,OAAI,UAAU,uEACb,UAAAD,EAAC,MAAG,UAAU,mGACX,SAAAW,EAAK,MACR,EACCA,EAAK,OAAS,SACbX,EAAC,OAAI,UAAU,kBACZ,SAAAW,GAAM,YAAY,IAAI,CAACA,EAAuBC,IAC7CZ,EAAC,OAEC,UAAWG,EACT,iEACA,wBACA,wBACF,EAEA,SAAAH,EAACI,EAAA,CAAQ,OAAQO,EAAK,OAAO,IAAK,IAAKA,EAAK,QAAQ,IAAK,UAAU,yBAAyB,GAPvFC,CAQP,CACD,EACH,EAEAZ,EAACI,EAAA,CACC,UAAU,2DACV,OAAQO,EAAK,MAAM,IACnB,IAAKA,EAAK,MAAM,IAChB,aAAa,6BACf,GAEJ,EACAX,EAAC,KAAE,UAAU,+FACV,SAAAW,EAAK,YACR,IA1CKC,CA2CP,CACD,EACH,EACF,CAGN,EAEA,IAAOC,EAAQR,EAAWC,CAAW",
+  "names": ["jsx", "jsxs", "forwardRef", "cn", "Picture", "withStyles", "BrandEquity", "items", "itemShape", "className", "ref", "item", "index", "BrandEquity_default"]
 }

package/dist/esm/biz-components/Category/index.d.ts

@@ -22,6 +22,10 @@ export interface CategoryProps {
         categories: any[];
         products: any[];
     };
+    /** 按钮事件*/
+    event?: {
+        primaryButton?: (v: any, index: number) => void;
+    };
     key?: string;
 }
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<CategoryProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {

package/dist/esm/biz-components/Category/index.js

@@ -1,2 +1,2 @@
-"use client";import{Fragment as u,jsx as t,jsxs as i}from"react/jsx-runtime";import f from"react";import{cn as n}from"../../helpers/utils.js";import l from"../../components/picture.js";import{withStyles as h}from"../../shared/Styles.js";import x from"../Title/index.js";import d from"./SwiperCategory.js";import c from"../../components/link.js";const b=(e,r)=>{const o=[];for(let a=0;a<e.length;a+=r)o.push(e.slice(a,a+r));return o},y=({data:e,configuration:r})=>i("div",{className:n("bg-container-secondary-1 group box-border flex size-full flex-col overflow-hidden","laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300",r?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t(c,{href:e?.link||"",children:t(l,{source:e?.image?.url||e?.image,className:"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover"})})}),t("p",{className:"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-semibold",children:e?.name})]}),v=({data:e,configuration:r})=>i("div",{className:n("bg-container-secondary-1 box-border max-h-[126px] w-full overflow-hidden","hover:bg-info-white cursor-pointer px-3 py-4 duration-300",r?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t(c,{href:e?.link||"",children:t(l,{className:"m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})}),t("p",{className:"text-info-primary flex-1 truncate text-center text-sm font-semibold",children:e?.name})]},`${e?.name}`),k=({data:e,configuration:r})=>i("div",{className:n("aspect-h-[240] bg-container-secondary-1 group box-border h-auto flex-1 shrink-0 overflow-hidden","laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300",r?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t(c,{href:e?.link||"",children:t(l,{className:"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})})}),t("p",{className:"tablet:text-lg text-info-primary text-center text-sm font-semibold",children:e?.name})]}),w=({data:e,configuration:r,index:o})=>i("div",{className:n("bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden","hover:bg-info-white cursor-pointer p-4",o===0?"aspect-h-[252] row-span-2":"aspect-h-[120]",r?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t(c,{href:e?.link||"",children:t(l,{source:e?.image?.url||e?.image,className:n("mb-2 flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",o===0?"max-h-[146px] overflow-hidden":"max-h-[72px] max-w-[72px]")})}),t("p",{className:"text-info-primary line-clamp-2 text-center text-sm font-semibold",children:e?.name})]}),N=({data:e,configuration:r})=>t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((o,a)=>t(v,{data:o,configuration:r},a))}),C=({data:e,configuration:r})=>i(u,{children:[t("div",{className:"tablet:block hidden",children:t("div",{className:"mx-auto flex w-full gap-4",children:e?.map((o,a)=>t(k,{data:o,configuration:r},a))})}),t("div",{className:"tablet:hidden block",children:t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((o,a)=>t(w,{index:a,data:o,configuration:r},a))})})]}),I=f.forwardRef((e,r)=>{const{data:o,buildData:a,className:p="",key:m}=e,s=o?.isShowSelect?o?.products:o?.productData,g=s?.length<=5;return i("div",{ref:r,className:n("w-full overflow-hidden",p,{"aiui-dark":o?.theme==="dark"}),children:[o?.title&&t(x,{data:{title:o?.title}}),g?t(C,{data:s,configuration:{shape:o?.shape}}):i(u,{children:[t("div",{className:"tablet:block hidden",children:t(d,{id:`Category${m}`,Slide:y,data:{list:s,configuration:{shape:o?.shape}}})}),t("div",{className:"tablet:hidden block",children:t(d,{id:`Category1${m}`,Slide:N,data:{list:b(s,6),configuration:{shape:o?.shape}}})}),t("div",{className:"h-7"})]})]})});var M=h(I);export{M as default};
+"use client";import{Fragment as p,jsx as t,jsxs as n}from"react/jsx-runtime";import f from"react";import{cn as a}from"../../helpers/utils.js";import s from"../../components/picture.js";import{withStyles as h}from"../../shared/Styles.js";import v from"../Title/index.js";import u from"./SwiperCategory.js";import c from"../../components/link.js";const x=(e,o)=>{const r=[];for(let i=0;i<e.length;i+=o)r.push(e.slice(i,i+o));return r},y=({data:e,configuration:o})=>n("div",{className:a("bg-container-secondary-1 group box-border flex size-full flex-col overflow-hidden","laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t(c,{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{source:e?.image?.url||e?.image,className:"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover"})})}),t("p",{className:"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-semibold",children:e?.name})]}),b=({data:e,configuration:o})=>n("div",{className:a("bg-container-secondary-1 box-border max-h-[126px] w-full overflow-hidden","hover:bg-info-white cursor-pointer px-3 py-4 duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t(c,{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{className:"m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})}),t("p",{className:"text-info-primary flex-1 truncate text-center text-sm font-semibold",children:e?.name})]},`${e?.name}`),k=({data:e,configuration:o})=>n("div",{className:a("aspect-h-[240] bg-container-secondary-1 group box-border h-auto flex-1 shrink-0 overflow-hidden","laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t(c,{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{className:"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})})}),t("p",{className:"tablet:text-lg text-info-primary text-center text-sm font-semibold",children:e?.name})]}),w=({data:e,configuration:o,index:r})=>n("div",{className:a("bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden","hover:bg-info-white cursor-pointer p-4",r===0?"aspect-h-[252] row-span-2":"aspect-h-[120]",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t(c,{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{source:e?.image?.url||e?.image,className:a("mb-2 flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",r===0?"max-h-[146px] overflow-hidden":"max-h-[72px] max-w-[72px]")})}),t("p",{className:"text-info-primary line-clamp-2 text-center text-sm font-semibold",children:e?.name})]}),C=({data:e,configuration:o})=>t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,i)=>t(b,{data:r,configuration:o},i))}),N=({data:e,configuration:o})=>n(p,{children:[t("div",{className:"tablet:block hidden",children:t("div",{className:"mx-auto flex w-full gap-4",children:e?.map((r,i)=>t(k,{data:r,configuration:o},i))})}),t("div",{className:"tablet:hidden block",children:t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,i)=>t(w,{index:i,data:r,configuration:o},i))})})]}),I=f.forwardRef((e,o)=>{const{data:r,className:i="",key:d,event:m}=e,l=r?.isShowSelect?r?.products:r?.productData,g=l?.length<=5;return n("div",{ref:o,className:a("w-full overflow-hidden",i,{"aiui-dark":r?.theme==="dark"}),children:[r?.title&&t(v,{data:{title:r?.title}}),g?t(N,{data:l,configuration:{shape:r?.shape,event:m}}):n(p,{children:[t("div",{className:"tablet:block hidden",children:t(u,{id:`Category${d}`,Slide:y,data:{list:l,configuration:{shape:r?.shape,event:m}}})}),t("div",{className:"tablet:hidden block",children:t(u,{id:`Category1${d}`,Slide:C,data:{list:x(l,6),configuration:{shape:r?.shape,event:m}}})}),t("div",{className:"h-7"})]})]})});var P=h(I);export{P as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Category/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Category/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from './SwiperCategory.js'\nimport Link from '../../components/link.js'\n\nexport interface CategoryItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  image: any\n  name: string\n  link?: string\n}\n\nexport interface CategoryProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  data: {\n    isShowSelect: boolean\n    products: CategoryItem[]\n    productData: CategoryItem[]\n    /** \u5361\u7247\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    title?: string\n    link?: string\n    theme?: 'light' | 'dark'\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  key?: string\n}\n\nconst chunkArray = (arr: any[], size: number) => {\n  const chunks = []\n  for (let i = 0; i < arr.length; i += size) {\n    chunks.push(arr.slice(i, i + size))\n  }\n  return chunks\n}\n\nconst CategoryPcItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'bg-container-secondary-1 group box-border flex size-full flex-col overflow-hidden',\n        'laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className=\"transition-all duration-300 group-hover:scale-110\">\n        <Link href={data?.link || ''}>\n          <Picture\n            source={data?.image?.url || data?.image}\n            className=\"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n          />\n        </Link>\n      </div>\n      <p className=\"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-semibold\">\n        {data?.name}\n      </p>\n    </div>\n  )\n}\n\nconst SingleItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      key={`${data?.name}`}\n      className={cn(\n        'bg-container-secondary-1 box-border max-h-[126px] w-full overflow-hidden',\n        'hover:bg-info-white cursor-pointer px-3 py-4 duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <Link href={data?.link || ''}>\n        <Picture\n          className=\"m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n          source={data?.image?.url || data?.image}\n        />\n      </Link>\n      <p className=\"text-info-primary flex-1 truncate text-center text-sm font-semibold\">{data?.name}</p>\n    </div>\n  )\n}\n\n// soundcore pc\u5C55\u793A\nconst SinglePcCategoryItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'aspect-h-[240] bg-container-secondary-1 group box-border h-auto flex-1 shrink-0 overflow-hidden',\n        'laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className=\"transition-all duration-300 group-hover:scale-110\">\n        <Link href={data?.link || ''}>\n          <Picture\n            className=\"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n            source={data?.image?.url || data?.image}\n          />\n        </Link>\n      </div>\n      <p className=\"tablet:text-lg text-info-primary text-center text-sm font-semibold\">{data?.name}</p>\n    </div>\n  )\n}\n\n// soundcore mobile\u5C55\u793A\nconst SingleMobileCategoryItem = ({\n  data,\n  configuration,\n  index,\n}: {\n  data: CategoryItem\n  configuration?: any\n  index: number\n}) => {\n  return (\n    <div\n      className={cn(\n        'bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden',\n        'hover:bg-info-white cursor-pointer p-4',\n        index === 0 ? 'aspect-h-[252] row-span-2' : 'aspect-h-[120]',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <Link href={data?.link || ''}>\n        <Picture\n          source={data?.image?.url || data?.image}\n          className={cn(\n            'mb-2 flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover',\n            index === 0 ? 'max-h-[146px] overflow-hidden' : 'max-h-[72px] max-w-[72px]'\n          )}\n        />\n      </Link>\n      <p className=\"text-info-primary line-clamp-2 text-center text-sm font-semibold\">{data?.name}</p>\n    </div>\n  )\n}\n\n// \u5176\u5B83\u54C1\u724Cmobile\u5C55\u793A\nconst CategoryMobileItem = ({ data, configuration }: { data: CategoryItem[]; configuration?: any }) => {\n  return (\n    <div className=\"grid grid-cols-2 gap-3\">\n      {data?.map((item, index) => {\n        return <SingleItem key={index} data={item} configuration={configuration} />\n      })}\n    </div>\n  )\n}\n\n// soundcore\u5C55\u793A\nconst SoundCoreCategoryItem = ({ data, configuration }: { data: CategoryItem[]; configuration?: any }) => {\n  return (\n    <>\n      <div className=\"tablet:block hidden\">\n        <div className=\"mx-auto flex w-full gap-4\">\n          {data?.map((item, index) => {\n            return <SinglePcCategoryItem key={index} data={item} configuration={configuration} />\n          })}\n        </div>\n      </div>\n      <div className=\"tablet:hidden block\">\n        <div className=\"grid grid-cols-2 gap-3\">\n          {data?.map((item, index) => {\n            return <SingleMobileCategoryItem key={index} index={index} data={item} configuration={configuration} />\n          })}\n        </div>\n      </div>\n    </>\n  )\n}\n\nconst Category = React.forwardRef<HTMLDivElement, CategoryProps>((props, ref) => {\n  const { data, buildData, className = '', key } = props\n  // soundcore\u54C1\u724C\u54C1\u7C7B\u4E0D\u8D85\u8FC75\u4E2A\uFF0C\u5355\u72EC\u505A\u6837\u5F0F\u5904\u7406\n  const currentData = data?.isShowSelect ? data?.products : data?.productData\n  const isSoundCore = currentData?.length <= 5\n  return (\n    <div ref={ref} className={cn('w-full overflow-hidden', className, { 'aiui-dark': data?.theme === 'dark' })}>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      {isSoundCore ? (\n        <SoundCoreCategoryItem data={currentData} configuration={{ shape: data?.shape }} />\n      ) : (\n        <>\n          <div className=\"tablet:block hidden\">\n            <SwiperBox\n              id={`Category${key}`}\n              Slide={CategoryPcItem}\n              data={{ list: currentData, configuration: { shape: data?.shape } }}\n            />\n          </div>\n          <div className=\"tablet:hidden block\">\n            <SwiperBox\n              id={`Category1${key}`}\n              Slide={CategoryMobileItem}\n              data={{ list: chunkArray(currentData, 6), configuration: { shape: data?.shape } }}\n            />\n          </div>\n          <div className=\"h-7\" />\n        </>\n      )}\n    </div>\n  )\n})\n\nexport default withStyles(Category)\n"],
-  "mappings": "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",
-  "names": ["Fragment", "jsx", "jsxs", "React", "cn", "Picture", "withStyles", "Title", "SwiperBox", "Link", "chunkArray", "arr", "size", "chunks", "i", "CategoryPcItem", "data", "configuration", "SingleItem", "SinglePcCategoryItem", "SingleMobileCategoryItem", "index", "CategoryMobileItem", "item", "SoundCoreCategoryItem", "Category", "props", "ref", "buildData", "className", "key", "currentData", "isSoundCore", "Category_default"]
+  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from './SwiperCategory.js'\nimport Link from '../../components/link.js'\n\nexport interface CategoryItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  image: any\n  name: string\n  link?: string\n}\n\nexport interface CategoryProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  data: {\n    isShowSelect: boolean\n    products: CategoryItem[]\n    productData: CategoryItem[]\n    /** \u5361\u7247\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    title?: string\n    link?: string\n    theme?: 'light' | 'dark'\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n  key?: string\n}\n\nconst chunkArray = (arr: any[], size: number) => {\n  const chunks = []\n  for (let i = 0; i < arr.length; i += size) {\n    chunks.push(arr.slice(i, i + size))\n  }\n  return chunks\n}\n\nconst CategoryPcItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'bg-container-secondary-1 group box-border flex size-full flex-col overflow-hidden',\n        'laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className=\"transition-all duration-300 group-hover:scale-110\">\n        <Link href={data?.link || ''} onClick={() => configuration?.event?.primaryButton(data, configuration?.index)}>\n          <Picture\n            source={data?.image?.url || data?.image}\n            className=\"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n          />\n        </Link>\n      </div>\n      <p className=\"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-semibold\">\n        {data?.name}\n      </p>\n    </div>\n  )\n}\n\nconst SingleItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      key={`${data?.name}`}\n      className={cn(\n        'bg-container-secondary-1 box-border max-h-[126px] w-full overflow-hidden',\n        'hover:bg-info-white cursor-pointer px-3 py-4 duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <Link href={data?.link || ''} onClick={() => configuration?.event?.primaryButton(data, configuration?.index)}>\n        <Picture\n          className=\"m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n          source={data?.image?.url || data?.image}\n        />\n      </Link>\n      <p className=\"text-info-primary flex-1 truncate text-center text-sm font-semibold\">{data?.name}</p>\n    </div>\n  )\n}\n\n// soundcore pc\u5C55\u793A\nconst SinglePcCategoryItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'aspect-h-[240] bg-container-secondary-1 group box-border h-auto flex-1 shrink-0 overflow-hidden',\n        'laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className=\"transition-all duration-300 group-hover:scale-110\">\n        <Link href={data?.link || ''} onClick={() => configuration?.event?.primaryButton(data, configuration?.index)}>\n          <Picture\n            className=\"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n            source={data?.image?.url || data?.image}\n          />\n        </Link>\n      </div>\n      <p className=\"tablet:text-lg text-info-primary text-center text-sm font-semibold\">{data?.name}</p>\n    </div>\n  )\n}\n\n// soundcore mobile\u5C55\u793A\nconst SingleMobileCategoryItem = ({\n  data,\n  configuration,\n  index,\n}: {\n  data: CategoryItem\n  configuration?: any\n  index: number\n}) => {\n  return (\n    <div\n      className={cn(\n        'bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden',\n        'hover:bg-info-white cursor-pointer p-4',\n        index === 0 ? 'aspect-h-[252] row-span-2' : 'aspect-h-[120]',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <Link href={data?.link || ''} onClick={() => configuration?.event?.primaryButton(data, configuration?.index)}>\n        <Picture\n          source={data?.image?.url || data?.image}\n          className={cn(\n            'mb-2 flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover',\n            index === 0 ? 'max-h-[146px] overflow-hidden' : 'max-h-[72px] max-w-[72px]'\n          )}\n        />\n      </Link>\n      <p className=\"text-info-primary line-clamp-2 text-center text-sm font-semibold\">{data?.name}</p>\n    </div>\n  )\n}\n\n// \u5176\u5B83\u54C1\u724Cmobile\u5C55\u793A\nconst CategoryMobileItem = ({ data, configuration }: { data: CategoryItem[]; configuration?: any }) => {\n  return (\n    <div className=\"grid grid-cols-2 gap-3\">\n      {data?.map((item, index) => {\n        return <SingleItem key={index} data={item} configuration={configuration} />\n      })}\n    </div>\n  )\n}\n\n// soundcore\u5C55\u793A\nconst SoundCoreCategoryItem = ({ data, configuration }: { data: CategoryItem[]; configuration?: any }) => {\n  return (\n    <>\n      <div className=\"tablet:block hidden\">\n        <div className=\"mx-auto flex w-full gap-4\">\n          {data?.map((item, index) => {\n            return <SinglePcCategoryItem key={index} data={item} configuration={configuration} />\n          })}\n        </div>\n      </div>\n      <div className=\"tablet:hidden block\">\n        <div className=\"grid grid-cols-2 gap-3\">\n          {data?.map((item, index) => {\n            return <SingleMobileCategoryItem key={index} index={index} data={item} configuration={configuration} />\n          })}\n        </div>\n      </div>\n    </>\n  )\n}\n\nconst Category = React.forwardRef<HTMLDivElement, CategoryProps>((props, ref) => {\n  const { data, className = '', key, event } = props\n  // soundcore\u54C1\u724C\u54C1\u7C7B\u4E0D\u8D85\u8FC75\u4E2A\uFF0C\u5355\u72EC\u505A\u6837\u5F0F\u5904\u7406\n  const currentData = data?.isShowSelect ? data?.products : data?.productData\n  const isSoundCore = currentData?.length <= 5\n  return (\n    <div ref={ref} className={cn('w-full overflow-hidden', className, { 'aiui-dark': data?.theme === 'dark' })}>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      {isSoundCore ? (\n        <SoundCoreCategoryItem data={currentData} configuration={{ shape: data?.shape, event: event }} />\n      ) : (\n        <>\n          <div className=\"tablet:block hidden\">\n            <SwiperBox\n              id={`Category${key}`}\n              Slide={CategoryPcItem}\n              data={{ list: currentData, configuration: { shape: data?.shape, event: event } }}\n            />\n          </div>\n          <div className=\"tablet:hidden block\">\n            <SwiperBox\n              id={`Category1${key}`}\n              Slide={CategoryMobileItem}\n              data={{ list: chunkArray(currentData, 6), configuration: { shape: data?.shape, event: event } }}\n            />\n          </div>\n          <div className=\"h-7\" />\n        </>\n      )}\n    </div>\n  )\n})\n\nexport default withStyles(Category)\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "React", "cn", "Picture", "withStyles", "Title", "SwiperBox", "Link", "chunkArray", "arr", "size", "chunks", "CategoryPcItem", "data", "configuration", "SingleItem", "SinglePcCategoryItem", "SingleMobileCategoryItem", "index", "CategoryMobileItem", "item", "SoundCoreCategoryItem", "Category", "props", "ref", "className", "key", "event", "currentData", "isSoundCore", "Category_default"]
 }

package/dist/esm/biz-components/Evaluate/index.d.ts

@@ -23,6 +23,10 @@ export interface EvaluateProps {
         /** 主题色*/
         theme?: 'light' | 'dark';
     };
+    /** 按钮事件*/
+    event?: {
+        primaryButton?: (v: any, index: number) => void;
+    };
     key?: string;
 }
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<EvaluateProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {

package/dist/esm/biz-components/Evaluate/index.js

@@ -1,2 +1,2 @@
-"use client";import{Fragment as N,jsx as e,jsxs as r}from"react/jsx-runtime";import p from"react";import f from"../Title/index.js";import{cn as s}from"../../helpers/utils.js";import c from"../../components/picture.js";import v from"../SwiperBox/index.js";import{withStyles as u}from"../../shared/Styles.js";import{Avatar as w,AvatarImage as g,AvatarFallback as x}from"../../components/avatar.js";import h from"../../components/link.js";const b=({data:t,configuration:l})=>{const a=i=>i?Array.from(new Array(Number(i)))||[]:[];return r("div",{className:s("bg-container-secondary-1 hover:bg-info-white box-border flex w-full cursor-pointer flex-col overflow-hidden p-4 duration-300",l?.shape==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[480px] desktop:h-[384px] h-[360px]"),children:[r("div",{className:s("laptop:mb-11 desktop:mb-16 mb-16 flex w-full justify-between"),children:[r("div",{className:"flex-1",children:[e("h4",{className:"laptop:text-lg text-sm font-bold",children:t?.title}),e("div",{className:"mt-1 flex items-center",children:a(t?.rating)?.map?.((i,o)=>e("div",{className:"mr-1",children:e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:e("path",{d:"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z",fill:"#F77234"})})},o))})]}),e("div",{className:"desktop:size-12 size-10 overflow-hidden",children:e(w,{className:"size-full",isAdaptation:!t?.avatar?.url,children:t?.avatar?.url?r(N,{children:[e(g,{src:t?.avatar?.url}),e(x,{children:t?.title})]}):t?.title})})]}),e("p",{className:"desktop:text-2xl text-info-primary desktop:line-clamp-3 line-clamp-5 h-fit flex-1 break-words text-xl font-bold",children:t?.description||""}),e(h,{href:t?.link||"",children:r("div",{className:s("mt-3 flex items-center overflow-hidden bg-[#F7F8F9] p-3",l?.shape==="round"?"rounded-lg":"rounded-none"),children:[e("div",{className:"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center",children:e(c,{className:"w-full object-cover",source:t?.img?.url})}),e("p",{className:"lg-desktop:text-lg line-clamp-2 flex-1 text-sm font-bold",children:t?.subTitle||""})]})})]})},k=p.forwardRef(({className:t="",data:l,key:a},i)=>{const{products:o,title:n,theme:d,...m}=l;return r("div",{ref:i,className:s("w-full",t,{"aiui-dark":d==="dark"}),children:[n&&e(f,{data:{title:n}}),e(v,{className:"!overflow-visible",id:"Evaluate"+a,data:{list:o,configuration:{...m}},Slide:b,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})]})});var z=u(k);export{z as default};
+"use client";import{Fragment as L,jsx as e,jsxs as i}from"react/jsx-runtime";import f from"react";import v from"../Title/index.js";import{cn as s}from"../../helpers/utils.js";import c from"../../components/picture.js";import u from"../SwiperBox/index.js";import{withStyles as w}from"../../shared/Styles.js";import{Avatar as x,AvatarImage as g,AvatarFallback as h}from"../../components/avatar.js";import b from"../../components/link.js";const k=({data:t,configuration:r})=>{const a=l=>l?Array.from(new Array(Number(l)))||[]:[];return i("div",{className:s("bg-container-secondary-1 hover:bg-info-white box-border flex w-full cursor-pointer flex-col overflow-hidden p-4 duration-300",r?.shape==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[480px] desktop:h-[384px] h-[360px]"),children:[i("div",{className:s("laptop:mb-11 desktop:mb-16 mb-16 flex w-full justify-between"),children:[i("div",{className:"flex-1",children:[e("h4",{className:"laptop:text-lg text-sm font-bold",children:t?.title}),e("div",{className:"mt-1 flex items-center",children:a(t?.rating)?.map?.((l,o)=>e("div",{className:"mr-1",children:e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:e("path",{d:"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z",fill:"#F77234"})})},o))})]}),e("div",{className:"desktop:size-12 size-10 overflow-hidden",children:e(x,{className:"size-full",isAdaptation:!t?.avatar?.url,children:t?.avatar?.url?i(L,{children:[e(g,{src:t?.avatar?.url}),e(h,{children:t?.title})]}):t?.title})})]}),e("p",{className:"desktop:text-2xl text-info-primary desktop:line-clamp-3 line-clamp-5 h-fit flex-1 break-words text-xl font-bold",children:t?.description||""}),e(b,{href:t?.link||"",onClick:()=>{r?.event?.primaryButton(t,r?.index)},children:i("div",{className:s("mt-3 flex items-center overflow-hidden bg-[#F7F8F9] p-3",r?.shape==="round"?"rounded-lg":"rounded-none"),children:[e("div",{className:"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center",children:e(c,{className:"w-full object-cover",source:t?.img?.url})}),e("p",{className:"lg-desktop:text-lg line-clamp-2 flex-1 text-sm font-bold",children:t?.subTitle||""})]})})]})},N=f.forwardRef(({className:t="",data:r,key:a,event:l},o)=>{const{products:d,title:n,theme:m,...p}=r;return i("div",{ref:o,className:s("w-full",t,{"aiui-dark":m==="dark"}),children:[n&&e(v,{data:{title:n}}),e(u,{className:"!overflow-visible",id:"Evaluate"+a,data:{list:d,configuration:{...p,event:l}},Slide:k,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})]})});var F=w(N);export{F as default};
 //# sourceMappingURL=index.js.map