@anker-in/headless-ui 0.0.27-alpha.109 → 0.0.27-alpha.110

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/dist/cjs/biz-components/AccordionCards/index.d.ts +3 -2
  2. package/dist/cjs/biz-components/AccordionCards/index.js +1 -1
  3. package/dist/cjs/biz-components/AccordionCards/index.js.map +3 -3
  4. package/dist/cjs/biz-components/Category/index.d.ts +2 -2
  5. package/dist/cjs/biz-components/Category/index.js +1 -1
  6. package/dist/cjs/biz-components/Category/index.js.map +3 -3
  7. package/dist/cjs/biz-components/Evaluate/index.d.ts +2 -2
  8. package/dist/cjs/biz-components/Evaluate/index.js +1 -1
  9. package/dist/cjs/biz-components/Evaluate/index.js.map +3 -3
  10. package/dist/cjs/biz-components/MediaPlayerBase/index.js +1 -1
  11. package/dist/cjs/biz-components/MediaPlayerBase/index.js.map +3 -3
  12. package/dist/cjs/biz-components/MediaPlayerBase/types.d.ts +1 -0
  13. package/dist/cjs/biz-components/MediaPlayerBase/types.js +1 -1
  14. package/dist/cjs/biz-components/MediaPlayerBase/types.js.map +1 -1
  15. package/dist/cjs/biz-components/MediaPlayerSticky/index.js +1 -1
  16. package/dist/cjs/biz-components/MediaPlayerSticky/index.js.map +3 -3
  17. package/dist/cjs/biz-components/ShelfDisplay/index.d.ts +2 -2
  18. package/dist/cjs/biz-components/ShelfDisplay/index.js +3 -3
  19. package/dist/cjs/biz-components/ShelfDisplay/index.js.map +3 -3
  20. package/dist/cjs/biz-components/Slogan/index.js +1 -1
  21. package/dist/cjs/biz-components/Slogan/index.js.map +2 -2
  22. package/dist/cjs/stories/accordionCards.stories.d.ts +3 -3
  23. package/dist/cjs/stories/category.stories.d.ts +2 -2
  24. package/dist/cjs/stories/evaluate.stories.d.ts +2 -2
  25. package/dist/cjs/stories/shelfDisplay.stories.d.ts +2 -2
  26. package/dist/esm/biz-components/AccordionCards/index.d.ts +3 -2
  27. package/dist/esm/biz-components/AccordionCards/index.js +1 -1
  28. package/dist/esm/biz-components/AccordionCards/index.js.map +3 -3
  29. package/dist/esm/biz-components/Category/index.d.ts +2 -2
  30. package/dist/esm/biz-components/Category/index.js +1 -1
  31. package/dist/esm/biz-components/Category/index.js.map +3 -3
  32. package/dist/esm/biz-components/Evaluate/index.d.ts +2 -2
  33. package/dist/esm/biz-components/Evaluate/index.js +1 -1
  34. package/dist/esm/biz-components/Evaluate/index.js.map +3 -3
  35. package/dist/esm/biz-components/MediaPlayerBase/index.js +1 -1
  36. package/dist/esm/biz-components/MediaPlayerBase/index.js.map +3 -3
  37. package/dist/esm/biz-components/MediaPlayerBase/types.d.ts +1 -0
  38. package/dist/esm/biz-components/MediaPlayerSticky/index.js +1 -1
  39. package/dist/esm/biz-components/MediaPlayerSticky/index.js.map +3 -3
  40. package/dist/esm/biz-components/ShelfDisplay/index.d.ts +2 -2
  41. package/dist/esm/biz-components/ShelfDisplay/index.js +3 -3
  42. package/dist/esm/biz-components/ShelfDisplay/index.js.map +3 -3
  43. package/dist/esm/biz-components/Slogan/index.js +1 -1
  44. package/dist/esm/biz-components/Slogan/index.js.map +2 -2
  45. package/dist/esm/stories/accordionCards.stories.d.ts +3 -3
  46. package/dist/esm/stories/category.stories.d.ts +2 -2
  47. package/dist/esm/stories/evaluate.stories.d.ts +2 -2
  48. package/dist/esm/stories/shelfDisplay.stories.d.ts +2 -2
  49. package/package.json +2 -2
  50. package/style.css +21 -0
@@ -1,3 +1,4 @@
1
+ import React from 'react';
1
2
  /** Hook:监听窗口宽度 */
2
3
  type ItemType = {
3
4
  /** 标题文本 */
@@ -25,8 +26,8 @@ type AccordionCardsType = {
25
26
  theme?: 'light' | 'dark';
26
27
  };
27
28
  };
28
- declare const _default: import("react").ForwardRefExoticComponent<Omit<AccordionCardsType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
29
+ declare const _default: React.ForwardRefExoticComponent<Omit<Omit<AccordionCardsType & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
29
30
  className?: string;
30
31
  data?: Record<string, any>;
31
- } & import("react").RefAttributes<any>>;
32
+ }, "ref"> & React.RefAttributes<any>>;
32
33
  export default _default;
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var I=Object.create;var u=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var P=(e,n)=>{for(var s in n)u(e,s,{get:n[s],enumerable:!0})},g=(e,n,s,d)=>{if(n&&typeof n=="object"||typeof n=="function")for(let a of A(n))!H.call(e,a)&&a!==s&&u(e,a,{get:()=>n[a],enumerable:!(d=L(n,a))||d.enumerable});return e};var p=(e,n,s)=>(s=e!=null?I(j(e)):{},g(n||!e||!e.__esModule?u(s,"default",{value:e,enumerable:!0}):s,e)),R=e=>g(u({},"__esModule",{value:!0}),e);var D={};P(D,{default:()=>_});module.exports=R(D);var t=require("react/jsx-runtime"),w=p(require("../Title/index.js")),i=require("../../helpers/utils.js"),f=p(require("../../components/picture.js")),b=p(require("../../components/button.js")),N=p(require("../SwiperBox/index.js")),z=require("../../components/link.js"),T=require("../../shared/Styles.js"),l=require("react");const V=({data:e,className:n=""})=>{const[s,d]=(0,l.useState)(0),[a,B]=(0,l.useState)({0:!0}),v=(0,l.useRef)([]),h=(0,l.useRef)({0:!0}),m=(0,l.useRef)(!1),E=(r,o)=>{o&&(v.current[r]=o)},x=r=>{h.current?.[r]&&(m.current=!1,B({[r]:!0}))};(0,l.useEffect)(()=>{const r=v.current;return r?.forEach((o,c)=>{c?(o.style.flex="1 1 0%",o.style.transition="all 0.6s"):(o.style.flex="5 1 0%",o.style.transition="all 0.6s"),o.addEventListener("transitionend",()=>{x(c)})}),()=>{r?.forEach((o,c)=>{o.removeEventListener("transitionend",()=>x(c))})}},[]);const S=({data:r,configuration:o})=>(0,t.jsxs)("div",{className:(0,i.cn)("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",o?.itemShape==="round"?"rounded-2xl":""),children:[(0,t.jsx)(f.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:r?.img?.url}),(0,t.jsxs)("div",{className:(0,i.cn)("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[(0,t.jsxs)("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:r?.title}),(0,t.jsx)("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:r.link,children:(0,t.jsx)(b.default,{variant:"secondary",className:(0,i.cn)("text-info-primary text-sm font-bold"),children:o?.primaryButton})})]})]}),y=(0,l.useCallback)(r=>{s===r||m.current||(m.current=!0,h.current={[r]:!0},d(r))},[s,m]);return(0,t.jsxs)(t.Fragment,{children:[e?.title&&(0,t.jsx)(w.default,{data:{title:e?.title}}),(0,t.jsx)("div",{className:(0,i.cn)("laptop:block hidden",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)("div",{className:(0,i.cn)("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",n),children:e?.products?.map((r,o)=>{const c=s===o,C=c?5:1,M=a?.[o]&&c;return(0,t.jsxs)("div",{style:{flex:C},ref:k=>{k&&E(o,k)},className:(0,i.cn)("relative cursor-pointer overflow-hidden",e?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>y(o),onMouseLeave:()=>{m.current=!1},onClick:()=>y(o),children:[(0,t.jsx)(f.default,{source:r?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),(0,t.jsxs)("div",{className:(0,i.cn)("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",M?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[(0,t.jsxs)("div",{className:"mr-16 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:r?.title}),(0,t.jsx)("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:r?.link,children:(0,t.jsx)(b.default,{variant:"secondary",className:(0,i.cn)("desktop:text-base mb-1.5 text-sm font-bold"),children:e?.primaryButton})})]})]},o)})})}),(0,t.jsx)("div",{className:(0,i.cn)("laptop:hidden block",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)(N.default,{className:(0,i.cn)("h-[400px] !overflow-visible",n),id:"AccordionCards"+e?.key,data:{list:e?.products,configuration:{shape:e?.shape,itemShape:e?.itemShape,primaryButton:e?.primaryButton}},Slide:S,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 _=(0,T.withStyles)(V);
1
+ "use strict";"use client";var I=Object.create;var p=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var H=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var D=(e,n)=>{for(var l in n)p(e,l,{get:n[l],enumerable:!0})},g=(e,n,l,m)=>{if(n&&typeof n=="object"||typeof n=="function")for(let a of R(n))!j.call(e,a)&&a!==l&&p(e,a,{get:()=>n[a],enumerable:!(m=A(n,a))||m.enumerable});return e};var u=(e,n,l)=>(l=e!=null?I(H(e)):{},g(n||!e||!e.__esModule?p(l,"default",{value:e,enumerable:!0}):l,e)),P=e=>g(p({},"__esModule",{value:!0}),e);var q={};D(q,{default:()=>_});module.exports=P(q);var t=require("react/jsx-runtime"),w=u(require("../Title/index.js")),s=require("../../helpers/utils.js"),f=u(require("../../components/picture.js")),v=u(require("../../components/button.js")),N=u(require("../SwiperBox/index.js")),W=require("../../components/link.js"),T=require("../../shared/Styles.js"),i=u(require("react"));const V=i.default.forwardRef(({data:e,className:n=""},l)=>{const[m,a]=(0,i.useState)(0),[B,E]=(0,i.useState)({0:!0}),b=(0,i.useRef)([]),h=(0,i.useRef)({0:!0}),d=(0,i.useRef)(!1),S=(r,o)=>{o&&(b.current[r]=o)},x=r=>{h.current?.[r]&&(d.current=!1,E({[r]:!0}))};(0,i.useEffect)(()=>{const r=b.current;return r?.forEach((o,c)=>{c?(o.style.flex="1 1 0%",o.style.transition="all 0.6s"):(o.style.flex="5 1 0%",o.style.transition="all 0.6s"),o.addEventListener("transitionend",()=>{x(c)})}),()=>{r?.forEach((o,c)=>{o.removeEventListener("transitionend",()=>x(c))})}},[]);const M=({data:r,configuration:o})=>(0,t.jsxs)("div",{className:(0,s.cn)("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",o?.itemShape==="round"?"rounded-2xl":""),children:[(0,t.jsx)(f.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:r?.img?.url}),(0,t.jsxs)("div",{className:(0,s.cn)("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[(0,t.jsxs)("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:r?.title}),(0,t.jsx)("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:r.link,children:(0,t.jsx)(v.default,{variant:"secondary",className:(0,s.cn)("text-info-primary text-sm font-bold"),children:o?.primaryButton})})]})]}),y=(0,i.useCallback)(r=>{m===r||d.current||(d.current=!0,h.current={[r]:!0},a(r))},[m,d]);return(0,t.jsxs)(t.Fragment,{children:[e?.title&&(0,t.jsx)(w.default,{data:{title:e?.title}}),(0,t.jsx)("div",{ref:l,className:(0,s.cn)("laptop:block hidden",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)("div",{className:(0,s.cn)("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",n),children:e?.products?.map((r,o)=>{const c=m===o,C=c?5:1,L=B?.[o]&&c;return(0,t.jsxs)("div",{style:{flex:C},ref:k=>{k&&S(o,k)},className:(0,s.cn)("relative cursor-pointer overflow-hidden",e?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>y(o),onMouseLeave:()=>{d.current=!1},onClick:()=>y(o),children:[(0,t.jsx)(f.default,{source:r?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),(0,t.jsxs)("div",{className:(0,s.cn)("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",L?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[(0,t.jsxs)("div",{className:"mr-16 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:r?.title}),(0,t.jsx)("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:r?.link,children:(0,t.jsx)(v.default,{variant:"secondary",className:(0,s.cn)("desktop:text-base mb-1.5 text-sm font-bold"),children:e?.primaryButton})})]})]},o)})})}),(0,t.jsx)("div",{className:(0,s.cn)("laptop:hidden block",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)(N.default,{className:(0,s.cn)("h-[400px] !overflow-visible",n),id:"AccordionCards"+e?.key,data:{list:e?.products,configuration:{shape:e?.shape,itemShape:e?.itemShape,primaryButton:e?.primaryButton}},Slide:M,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 _=(0,T.withStyles)(V);
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/AccordionCards/index.tsx"],
4
- "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 { 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 = ({ data, className = '' }: AccordionCardsType) => {\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 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}\n\nexport default withStyles(AccordionCards)\n"],
5
- "mappings": "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",
6
- "names": ["AccordionCards_exports", "__export", "AccordionCards_default", "__toCommonJS", "import_jsx_runtime", "import_Title", "import_utils", "import_picture", "import_button", "import_SwiperBox", "import_link", "import_Styles", "import_react", "AccordionCards", "data", "className", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "enterRef", "isAnimation", "getRef", "index", "el", "handleTransitionEnd", "element", "item", "MobileItem", "configuration", "Picture", "Button", "handleSwiperItemClick", "idx", "Title", "isExpanded", "flexValue", "isShowContent", "SwiperBox"]
4
+ "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"],
5
+ "mappings": "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",
6
+ "names": ["AccordionCards_exports", "__export", "AccordionCards_default", "__toCommonJS", "import_jsx_runtime", "import_Title", "import_utils", "import_picture", "import_button", "import_SwiperBox", "import_link", "import_Styles", "import_react", "AccordionCards", "React", "data", "className", "ref", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "enterRef", "isAnimation", "getRef", "index", "el", "handleTransitionEnd", "element", "item", "MobileItem", "configuration", "Picture", "Button", "handleSwiperItemClick", "idx", "Title", "isExpanded", "flexValue", "isShowContent", "SwiperBox"]
7
7
  }
@@ -24,8 +24,8 @@ export interface CategoryProps {
24
24
  };
25
25
  key?: string;
26
26
  }
27
- declare const _default: React.ForwardRefExoticComponent<Omit<CategoryProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
27
+ declare const _default: React.ForwardRefExoticComponent<Omit<Omit<CategoryProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
28
28
  className?: string;
29
29
  data?: Record<string, any>;
30
- } & React.RefAttributes<any>>;
30
+ }, "ref"> & React.RefAttributes<any>>;
31
31
  export default _default;
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var x=Object.create;var m=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var v=Object.getPrototypeOf,k=Object.prototype.hasOwnProperty;var N=(e,o)=>{for(var r in o)m(e,r,{get:o[r],enumerable:!0})},p=(e,o,r,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of y(o))!k.call(e,i)&&i!==r&&m(e,i,{get:()=>o[i],enumerable:!(a=b(o,i))||a.enumerable});return e};var d=(e,o,r)=>(r=e!=null?x(v(e)):{},p(o||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),w=e=>p(m({},"__esModule",{value:!0}),e);var $={};N($,{default:()=>P});module.exports=w($);var t=require("react/jsx-runtime"),R=require("react"),n=require("../../helpers/utils.js"),s=d(require("../../components/picture.js")),g=require("../../shared/Styles.js"),f=d(require("../Title/index.js")),u=d(require("./SwiperCategory.js")),l=d(require("../../components/link.js"));const C=(e,o)=>{const r=[];for(let a=0;a<e.length;a+=o)r.push(e.slice(a,a+o));return r},I=({data:e,configuration:o})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)("div",{className:"transition-all duration-300 group-hover:scale-110",children:(0,t.jsx)(l.default,{href:e?.link||"",children:(0,t.jsx)(s.default,{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"})})}),(0,t.jsx)("p",{className:"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-semibold",children:e?.name})]}),S=({data:e,configuration:o})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)(l.default,{href:e?.link||"",children:(0,t.jsx)(s.default,{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})}),(0,t.jsx)("p",{className:"text-info-primary flex-1 truncate text-center text-sm font-semibold",children:e?.name})]},`${e?.name}`),j=({data:e,configuration:o})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)("div",{className:"transition-all duration-300 group-hover:scale-110",children:(0,t.jsx)(l.default,{href:e?.link||"",children:(0,t.jsx)(s.default,{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})})}),(0,t.jsx)("p",{className:"tablet:text-lg text-info-primary text-center text-sm font-semibold",children:e?.name})]}),_=({data:e,configuration:o,index:r})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)(l.default,{href:e?.link||"",children:(0,t.jsx)(s.default,{source:e?.image?.url||e?.image,className:(0,n.cn)("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]")})}),(0,t.jsx)("p",{className:"text-info-primary line-clamp-2 text-center text-sm font-semibold",children:e?.name})]}),z=({data:e,configuration:o})=>(0,t.jsx)("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,a)=>(0,t.jsx)(S,{data:r,configuration:o},a))}),D=({data:e,configuration:o})=>(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"tablet:block hidden",children:(0,t.jsx)("div",{className:"mx-auto flex w-full gap-4",children:e?.map((r,a)=>(0,t.jsx)(j,{data:r,configuration:o},a))})}),(0,t.jsx)("div",{className:"tablet:hidden block",children:(0,t.jsx)("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,a)=>(0,t.jsx)(_,{index:a,data:r,configuration:o},a))})})]}),L=e=>{const{data:o,buildData:r,className:a="",key:i}=e,c=o?.isShowSelect?o?.products:o?.productData,h=c?.length<=5;return(0,t.jsxs)("div",{className:(0,n.cn)("w-full overflow-hidden",a,{"aiui-dark":o?.theme==="dark"}),children:[o?.title&&(0,t.jsx)(f.default,{data:{title:o?.title}}),h?(0,t.jsx)(D,{data:c,configuration:{shape:o?.shape}}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"tablet:block hidden",children:(0,t.jsx)(u.default,{id:`Category${i}`,Slide:I,data:{list:c,configuration:{shape:o?.shape}}})}),(0,t.jsx)("div",{className:"tablet:hidden block",children:(0,t.jsx)(u.default,{id:`Category1${i}`,Slide:z,data:{list:C(c,6),configuration:{shape:o?.shape}}})}),(0,t.jsx)("div",{className:"h-7"})]})]})};var P=(0,g.withStyles)(L);
1
+ "use strict";"use client";var y=Object.create;var d=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var w=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var C=(e,r)=>{for(var o in r)d(e,o,{get:r[o],enumerable:!0})},g=(e,r,o,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of k(r))!N.call(e,i)&&i!==o&&d(e,i,{get:()=>r[i],enumerable:!(a=v(r,i))||a.enumerable});return e};var s=(e,r,o)=>(o=e!=null?y(w(e)):{},g(r||!e||!e.__esModule?d(o,"default",{value:e,enumerable:!0}):o,e)),I=e=>g(d({},"__esModule",{value:!0}),e);var R={};C(R,{default:()=>$});module.exports=I(R);var t=require("react/jsx-runtime"),f=s(require("react")),n=require("../../helpers/utils.js"),l=s(require("../../components/picture.js")),h=require("../../shared/Styles.js"),x=s(require("../Title/index.js")),u=s(require("./SwiperCategory.js")),c=s(require("../../components/link.js"));const S=(e,r)=>{const o=[];for(let a=0;a<e.length;a+=r)o.push(e.slice(a,a+r));return o},j=({data:e,configuration:r})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)("div",{className:"transition-all duration-300 group-hover:scale-110",children:(0,t.jsx)(c.default,{href:e?.link||"",children:(0,t.jsx)(l.default,{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"})})}),(0,t.jsx)("p",{className:"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-semibold",children:e?.name})]}),_=({data:e,configuration:r})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)(c.default,{href:e?.link||"",children:(0,t.jsx)(l.default,{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})}),(0,t.jsx)("p",{className:"text-info-primary flex-1 truncate text-center text-sm font-semibold",children:e?.name})]},`${e?.name}`),D=({data:e,configuration:r})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)("div",{className:"transition-all duration-300 group-hover:scale-110",children:(0,t.jsx)(c.default,{href:e?.link||"",children:(0,t.jsx)(l.default,{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})})}),(0,t.jsx)("p",{className:"tablet:text-lg text-info-primary text-center text-sm font-semibold",children:e?.name})]}),L=({data:e,configuration:r,index:o})=>(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsx)(c.default,{href:e?.link||"",children:(0,t.jsx)(l.default,{source:e?.image?.url||e?.image,className:(0,n.cn)("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]")})}),(0,t.jsx)("p",{className:"text-info-primary line-clamp-2 text-center text-sm font-semibold",children:e?.name})]}),z=({data:e,configuration:r})=>(0,t.jsx)("div",{className:"grid grid-cols-2 gap-3",children:e?.map((o,a)=>(0,t.jsx)(_,{data:o,configuration:r},a))}),P=({data:e,configuration:r})=>(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"tablet:block hidden",children:(0,t.jsx)("div",{className:"mx-auto flex w-full gap-4",children:e?.map((o,a)=>(0,t.jsx)(D,{data:o,configuration:r},a))})}),(0,t.jsx)("div",{className:"tablet:hidden block",children:(0,t.jsx)("div",{className:"grid grid-cols-2 gap-3",children:e?.map((o,a)=>(0,t.jsx)(L,{index:a,data:o,configuration:r},a))})})]}),M=f.default.forwardRef((e,r)=>{const{data:o,buildData:a,className:i="",key:p}=e,m=o?.isShowSelect?o?.products:o?.productData,b=m?.length<=5;return(0,t.jsxs)("div",{ref:r,className:(0,n.cn)("w-full overflow-hidden",i,{"aiui-dark":o?.theme==="dark"}),children:[o?.title&&(0,t.jsx)(x.default,{data:{title:o?.title}}),b?(0,t.jsx)(P,{data:m,configuration:{shape:o?.shape}}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"tablet:block hidden",children:(0,t.jsx)(u.default,{id:`Category${p}`,Slide:j,data:{list:m,configuration:{shape:o?.shape}}})}),(0,t.jsx)("div",{className:"tablet:hidden block",children:(0,t.jsx)(u.default,{id:`Category1${p}`,Slide:z,data:{list:S(m,6),configuration:{shape:o?.shape}}})}),(0,t.jsx)("div",{className:"h-7"})]})]})});var $=(0,h.withStyles)(M);
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Category/index.tsx"],
4
- "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.FC<CategoryProps> = props => {\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 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"],
5
- "mappings": "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",
6
- "names": ["Category_exports", "__export", "Category_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_Styles", "import_Title", "import_SwiperCategory", "import_link", "chunkArray", "arr", "size", "chunks", "i", "CategoryPcItem", "data", "configuration", "Link", "Picture", "SingleItem", "SinglePcCategoryItem", "SingleMobileCategoryItem", "index", "CategoryMobileItem", "item", "SoundCoreCategoryItem", "Category", "props", "buildData", "className", "key", "currentData", "isSoundCore", "Title", "SwiperBox"]
4
+ "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"],
5
+ "mappings": "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",
6
+ "names": ["Category_exports", "__export", "Category_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_Styles", "import_Title", "import_SwiperCategory", "import_link", "chunkArray", "arr", "size", "chunks", "i", "CategoryPcItem", "data", "configuration", "Link", "Picture", "SingleItem", "SinglePcCategoryItem", "SingleMobileCategoryItem", "index", "CategoryMobileItem", "item", "SoundCoreCategoryItem", "Category", "React", "props", "ref", "buildData", "className", "key", "currentData", "isSoundCore", "Title", "SwiperBox"]
7
7
  }
@@ -25,8 +25,8 @@ export interface EvaluateProps {
25
25
  };
26
26
  key?: string;
27
27
  }
28
- declare const _default: React.ForwardRefExoticComponent<Omit<EvaluateProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
28
+ declare const _default: React.ForwardRefExoticComponent<Omit<Omit<EvaluateProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
29
29
  className?: string;
30
30
  data?: Record<string, any>;
31
- } & React.RefAttributes<any>>;
31
+ }, "ref"> & React.RefAttributes<any>>;
32
32
  export default _default;
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var x=Object.create;var n=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var L=(e,r)=>{for(var i in r)n(e,i,{get:r[i],enumerable:!0})},m=(e,r,i,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let l of b(r))!N.call(e,l)&&l!==i&&n(e,l,{get:()=>r[l],enumerable:!(s=h(r,l))||s.enumerable});return e};var d=(e,r,i)=>(i=e!=null?x(k(e)):{},m(r||!e||!e.__esModule?n(i,"default",{value:e,enumerable:!0}):i,e)),C=e=>m(n({},"__esModule",{value:!0}),e);var P={};L(P,{default:()=>E});module.exports=C(P);var t=require("react/jsx-runtime"),F=require("react"),p=d(require("../Title/index.js")),o=require("../../helpers/utils.js"),c=d(require("../../components/picture.js")),f=d(require("../SwiperBox/index.js")),u=require("../../shared/Styles.js"),a=require("../../components/avatar.js"),v=d(require("../../components/link.js"));const y=({data:e,configuration:r})=>{const i=s=>s?Array.from(new Array(Number(s)))||[]:[];return(0,t.jsxs)("div",{className:(0,o.cn)("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:[(0,t.jsxs)("div",{className:(0,o.cn)("laptop:mb-11 desktop:mb-16 mb-16 flex w-full justify-between"),children:[(0,t.jsxs)("div",{className:"flex-1",children:[(0,t.jsx)("h4",{className:"laptop:text-lg text-sm font-bold",children:e?.title}),(0,t.jsx)("div",{className:"mt-1 flex items-center",children:i(e?.rating)?.map?.((s,l)=>(0,t.jsx)("div",{className:"mr-1",children:(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:(0,t.jsx)("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"})})},l))})]}),(0,t.jsx)("div",{className:"desktop:size-12 size-10 overflow-hidden",children:(0,t.jsx)(a.Avatar,{className:"size-full",isAdaptation:!e?.avatar?.url,children:e?.avatar?.url?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(a.AvatarImage,{src:e?.avatar?.url}),(0,t.jsx)(a.AvatarFallback,{children:e?.title})]}):e?.title})})]}),(0,t.jsx)("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:e?.description||""}),(0,t.jsx)(v.default,{href:e?.link||"",children:(0,t.jsxs)("div",{className:(0,o.cn)("mt-3 flex items-center overflow-hidden bg-[#F7F8F9] p-3",r?.shape==="round"?"rounded-lg":"rounded-none"),children:[(0,t.jsx)("div",{className:"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center",children:(0,t.jsx)(c.default,{className:"w-full object-cover",source:e?.img?.url})}),(0,t.jsx)("p",{className:"lg-desktop:text-lg line-clamp-2 flex-1 text-sm font-bold",children:e?.subTitle||""})]})})]})},A=({className:e="",data:r,key:i})=>{const{products:s,title:l,theme:g,...w}=r;return(0,t.jsxs)("div",{className:(0,o.cn)("w-full",e,{"aiui-dark":g==="dark"}),children:[l&&(0,t.jsx)(p.default,{data:{title:l}}),(0,t.jsx)(f.default,{className:"!overflow-visible",id:"Evaluate"+i,data:{list:s,configuration:{...w}},Slide:y,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 E=(0,u.withStyles)(A);
1
+ "use strict";"use client";var b=Object.create;var d=Object.defineProperty;var k=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var y=(e,r)=>{for(var i in r)d(e,i,{get:r[i],enumerable:!0})},p=(e,r,i,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let l of N(r))!C.call(e,l)&&l!==i&&d(e,l,{get:()=>r[l],enumerable:!(s=k(r,l))||s.enumerable});return e};var o=(e,r,i)=>(i=e!=null?b(L(e)):{},p(r||!e||!e.__esModule?d(i,"default",{value:e,enumerable:!0}):i,e)),E=e=>p(d({},"__esModule",{value:!0}),e);var M={};y(M,{default:()=>B});module.exports=E(M);var t=require("react/jsx-runtime"),f=o(require("react")),c=o(require("../Title/index.js")),n=require("../../helpers/utils.js"),v=o(require("../../components/picture.js")),u=o(require("../SwiperBox/index.js")),w=require("../../shared/Styles.js"),a=require("../../components/avatar.js"),g=o(require("../../components/link.js"));const A=({data:e,configuration:r})=>{const i=s=>s?Array.from(new Array(Number(s)))||[]:[];return(0,t.jsxs)("div",{className:(0,n.cn)("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:[(0,t.jsxs)("div",{className:(0,n.cn)("laptop:mb-11 desktop:mb-16 mb-16 flex w-full justify-between"),children:[(0,t.jsxs)("div",{className:"flex-1",children:[(0,t.jsx)("h4",{className:"laptop:text-lg text-sm font-bold",children:e?.title}),(0,t.jsx)("div",{className:"mt-1 flex items-center",children:i(e?.rating)?.map?.((s,l)=>(0,t.jsx)("div",{className:"mr-1",children:(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:(0,t.jsx)("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"})})},l))})]}),(0,t.jsx)("div",{className:"desktop:size-12 size-10 overflow-hidden",children:(0,t.jsx)(a.Avatar,{className:"size-full",isAdaptation:!e?.avatar?.url,children:e?.avatar?.url?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(a.AvatarImage,{src:e?.avatar?.url}),(0,t.jsx)(a.AvatarFallback,{children:e?.title})]}):e?.title})})]}),(0,t.jsx)("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:e?.description||""}),(0,t.jsx)(g.default,{href:e?.link||"",children:(0,t.jsxs)("div",{className:(0,n.cn)("mt-3 flex items-center overflow-hidden bg-[#F7F8F9] p-3",r?.shape==="round"?"rounded-lg":"rounded-none"),children:[(0,t.jsx)("div",{className:"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center",children:(0,t.jsx)(v.default,{className:"w-full object-cover",source:e?.img?.url})}),(0,t.jsx)("p",{className:"lg-desktop:text-lg line-clamp-2 flex-1 text-sm font-bold",children:e?.subTitle||""})]})})]})},P=f.default.forwardRef(({className:e="",data:r,key:i},s)=>{const{products:l,title:m,theme:x,...h}=r;return(0,t.jsxs)("div",{ref:s,className:(0,n.cn)("w-full",e,{"aiui-dark":x==="dark"}),children:[m&&(0,t.jsx)(c.default,{data:{title:m}}),(0,t.jsx)(u.default,{className:"!overflow-visible",id:"Evaluate"+i,data:{list:l,configuration:{...h}},Slide:A,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 B=(0,w.withStyles)(P);
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Evaluate/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport React from 'react'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Avatar, AvatarImage, AvatarFallback } from '../../components/avatar.js'\nimport Link from '../../components/link.js'\n\nexport interface EvaluateItem {\n /** \u4EA7\u54C1\u56FE\u7247*/\n img: {\n url: string\n }\n title: string\n subTitle: string\n description: string\n avatar?: {\n url: string\n }\n rating: number\n link?: string\n}\n\nexport interface EvaluateProps {\n className?: string\n data: {\n title?: string\n products: EvaluateItem[]\n /** \u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u4E3B\u9898\u8272*/\n theme?: 'light' | 'dark'\n }\n key?: string\n}\n\nconst EvaluateItem = ({ data, configuration }: { data: EvaluateItem; configuration?: any }) => {\n const handleRating = (num: number) => {\n if (num) {\n return Array.from(new Array(Number(num))) || []\n }\n return []\n }\n\n return (\n <div\n className={cn(\n 'bg-container-secondary-1 hover:bg-info-white box-border flex w-full cursor-pointer flex-col overflow-hidden p-4 duration-300',\n configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:h-[480px] desktop:h-[384px] h-[360px]'\n )}\n >\n <div className={cn('laptop:mb-11 desktop:mb-16 mb-16 flex w-full justify-between')}>\n <div className=\"flex-1\">\n <h4 className=\"laptop:text-lg text-sm font-bold\">{data?.title}</h4>\n <div className=\"mt-1 flex items-center\">\n {handleRating(data?.rating)?.map?.((_, index) => {\n return (\n <div key={index} className=\"mr-1\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n 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\"\n fill=\"#F77234\"\n />\n </svg>\n </div>\n )\n })}\n </div>\n </div>\n <div className=\"desktop:size-12 size-10 overflow-hidden\">\n <Avatar className=\"size-full\" isAdaptation={!data?.avatar?.url}>\n {data?.avatar?.url ? (\n <>\n <AvatarImage src={data?.avatar?.url} />\n <AvatarFallback>{data?.title}</AvatarFallback>\n </>\n ) : (\n data?.title\n )}\n </Avatar>\n </div>\n </div>\n <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\">\n {data?.description || ''}\n </p>\n <Link href={data?.link || ''}>\n <div\n className={cn(\n 'mt-3 flex items-center overflow-hidden bg-[#F7F8F9] p-3',\n configuration?.shape === 'round' ? 'rounded-lg' : 'rounded-none'\n )}\n >\n <div className=\"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center\">\n <Picture className=\"w-full object-cover\" source={data?.img?.url} />\n </div>\n <p className=\"lg-desktop:text-lg line-clamp-2 flex-1 text-sm font-bold\">{data?.subTitle || ''}</p>\n </div>\n </Link>\n </div>\n )\n}\n\nconst Evaluate: React.FC<EvaluateProps> = ({ className = '', data, key }) => {\n const { products, title, theme, ...ohter } = data\n return (\n <div className={cn('w-full', className, { 'aiui-dark': theme === 'dark' })}>\n {title && <Title data={{ title: title }} />}\n <SwiperBox\n className=\"!overflow-visible\"\n id={'Evaluate' + key}\n data={{ list: products, configuration: { ...ohter } }}\n Slide={EvaluateItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.1,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2.3,\n },\n 1024: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 3.1,\n },\n 1440: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 4,\n },\n }}\n />\n </div>\n )\n}\n\nexport default withStyles(Evaluate)\n"],
5
- "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAuDQ,IAAAI,EAAA,6BAtDRC,EAAkB,iBAClBC,EAAkB,gCAClBC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAAsB,oCACtBC,EAA2B,kCAC3BC,EAAoD,sCACpDC,EAAiB,uCA8BjB,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAAmD,CAC7F,MAAMC,EAAgBC,GAChBA,EACK,MAAM,KAAK,IAAI,MAAM,OAAOA,CAAG,CAAC,CAAC,GAAK,CAAC,EAEzC,CAAC,EAGV,SACE,QAAC,OACC,aAAW,MACT,+HACAF,GAAe,QAAU,QAAU,cAAgB,eACnD,kDACF,EAEA,qBAAC,OAAI,aAAW,MAAG,8DAA8D,EAC/E,qBAAC,OAAI,UAAU,SACb,oBAAC,MAAG,UAAU,mCAAoC,SAAAD,GAAM,MAAM,KAC9D,OAAC,OAAI,UAAU,yBACZ,SAAAE,EAAaF,GAAM,MAAM,GAAG,MAAM,CAACI,EAAGC,OAEnC,OAAC,OAAgB,UAAU,OACzB,mBAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,mBAAC,QACC,EAAE,6oBACF,KAAK,UACP,EACF,GANQA,CAOV,CAEH,EACH,GACF,KACA,OAAC,OAAI,UAAU,0CACb,mBAAC,UAAO,UAAU,YAAY,aAAc,CAACL,GAAM,QAAQ,IACxD,SAAAA,GAAM,QAAQ,OACb,oBACE,oBAAC,eAAY,IAAKA,GAAM,QAAQ,IAAK,KACrC,OAAC,kBAAgB,SAAAA,GAAM,MAAM,GAC/B,EAEAA,GAAM,MAEV,EACF,GACF,KACA,OAAC,KAAE,UAAU,kHACV,SAAAA,GAAM,aAAe,GACxB,KACA,OAAC,EAAAM,QAAA,CAAK,KAAMN,GAAM,MAAQ,GACxB,oBAAC,OACC,aAAW,MACT,0DACAC,GAAe,QAAU,QAAU,aAAe,cACpD,EAEA,oBAAC,OAAI,UAAU,gEACb,mBAAC,EAAAM,QAAA,CAAQ,UAAU,sBAAsB,OAAQP,GAAM,KAAK,IAAK,EACnE,KACA,OAAC,KAAE,UAAU,2DAA4D,SAAAA,GAAM,UAAY,GAAG,GAChG,EACF,GACF,CAEJ,EAEMQ,EAAoC,CAAC,CAAE,UAAAC,EAAY,GAAI,KAAAT,EAAM,IAAAU,CAAI,IAAM,CAC3E,KAAM,CAAE,SAAAC,EAAU,MAAAC,EAAO,MAAAC,EAAO,GAAGC,CAAM,EAAId,EAC7C,SACE,QAAC,OAAI,aAAW,MAAG,SAAUS,EAAW,CAAE,YAAaI,IAAU,MAAO,CAAC,EACtE,UAAAD,MAAS,OAAC,EAAAG,QAAA,CAAM,KAAM,CAAE,MAAOH,CAAM,EAAG,KACzC,OAAC,EAAAI,QAAA,CACC,UAAU,oBACV,GAAI,WAAaN,EACjB,KAAM,CAAE,KAAMC,EAAU,cAAe,CAAE,GAAGG,CAAM,CAAE,EACpD,MAAOf,EACP,YAAa,CACX,EAAG,CACD,aAAc,GACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,KAAM,CACJ,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,KAAM,CACJ,aAAc,GACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,GACF,CAEJ,EAEA,IAAOX,KAAQ,cAAWoB,CAAQ",
6
- "names": ["Evaluate_exports", "__export", "Evaluate_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_Title", "import_utils", "import_picture", "import_SwiperBox", "import_Styles", "import_avatar", "import_link", "EvaluateItem", "data", "configuration", "handleRating", "num", "_", "index", "Link", "Picture", "Evaluate", "className", "key", "products", "title", "theme", "ohter", "Title", "SwiperBox"]
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Avatar, AvatarImage, AvatarFallback } from '../../components/avatar.js'\nimport Link from '../../components/link.js'\n\nexport interface EvaluateItem {\n /** \u4EA7\u54C1\u56FE\u7247*/\n img: {\n url: string\n }\n title: string\n subTitle: string\n description: string\n avatar?: {\n url: string\n }\n rating: number\n link?: string\n}\n\nexport interface EvaluateProps {\n className?: string\n data: {\n title?: string\n products: EvaluateItem[]\n /** \u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u4E3B\u9898\u8272*/\n theme?: 'light' | 'dark'\n }\n key?: string\n}\n\nconst EvaluateItem = ({ data, configuration }: { data: EvaluateItem; configuration?: any }) => {\n const handleRating = (num: number) => {\n if (num) {\n return Array.from(new Array(Number(num))) || []\n }\n return []\n }\n\n return (\n <div\n className={cn(\n 'bg-container-secondary-1 hover:bg-info-white box-border flex w-full cursor-pointer flex-col overflow-hidden p-4 duration-300',\n configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:h-[480px] desktop:h-[384px] h-[360px]'\n )}\n >\n <div className={cn('laptop:mb-11 desktop:mb-16 mb-16 flex w-full justify-between')}>\n <div className=\"flex-1\">\n <h4 className=\"laptop:text-lg text-sm font-bold\">{data?.title}</h4>\n <div className=\"mt-1 flex items-center\">\n {handleRating(data?.rating)?.map?.((_, index) => {\n return (\n <div key={index} className=\"mr-1\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n 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\"\n fill=\"#F77234\"\n />\n </svg>\n </div>\n )\n })}\n </div>\n </div>\n <div className=\"desktop:size-12 size-10 overflow-hidden\">\n <Avatar className=\"size-full\" isAdaptation={!data?.avatar?.url}>\n {data?.avatar?.url ? (\n <>\n <AvatarImage src={data?.avatar?.url} />\n <AvatarFallback>{data?.title}</AvatarFallback>\n </>\n ) : (\n data?.title\n )}\n </Avatar>\n </div>\n </div>\n <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\">\n {data?.description || ''}\n </p>\n <Link href={data?.link || ''}>\n <div\n className={cn(\n 'mt-3 flex items-center overflow-hidden bg-[#F7F8F9] p-3',\n configuration?.shape === 'round' ? 'rounded-lg' : 'rounded-none'\n )}\n >\n <div className=\"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center\">\n <Picture className=\"w-full object-cover\" source={data?.img?.url} />\n </div>\n <p className=\"lg-desktop:text-lg line-clamp-2 flex-1 text-sm font-bold\">{data?.subTitle || ''}</p>\n </div>\n </Link>\n </div>\n )\n}\n\nconst Evaluate = React.forwardRef<HTMLDivElement, EvaluateProps>(({ className = '', data, key }, ref) => {\n const { products, title, theme, ...ohter } = data\n return (\n <div ref={ref} className={cn('w-full', className, { 'aiui-dark': theme === 'dark' })}>\n {title && <Title data={{ title: title }} />}\n <SwiperBox\n className=\"!overflow-visible\"\n id={'Evaluate' + key}\n data={{ list: products, configuration: { ...ohter } }}\n Slide={EvaluateItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.1,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2.3,\n },\n 1024: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 3.1,\n },\n 1440: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 4,\n },\n }}\n />\n </div>\n )\n})\n\nexport default withStyles(Evaluate)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAuDQ,IAAAI,EAAA,6BAtDRC,EAAkB,oBAClBC,EAAkB,gCAClBC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAAsB,oCACtBC,EAA2B,kCAC3BC,EAAoD,sCACpDC,EAAiB,uCA8BjB,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAAmD,CAC7F,MAAMC,EAAgBC,GAChBA,EACK,MAAM,KAAK,IAAI,MAAM,OAAOA,CAAG,CAAC,CAAC,GAAK,CAAC,EAEzC,CAAC,EAGV,SACE,QAAC,OACC,aAAW,MACT,+HACAF,GAAe,QAAU,QAAU,cAAgB,eACnD,kDACF,EAEA,qBAAC,OAAI,aAAW,MAAG,8DAA8D,EAC/E,qBAAC,OAAI,UAAU,SACb,oBAAC,MAAG,UAAU,mCAAoC,SAAAD,GAAM,MAAM,KAC9D,OAAC,OAAI,UAAU,yBACZ,SAAAE,EAAaF,GAAM,MAAM,GAAG,MAAM,CAACI,EAAGC,OAEnC,OAAC,OAAgB,UAAU,OACzB,mBAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,mBAAC,QACC,EAAE,6oBACF,KAAK,UACP,EACF,GANQA,CAOV,CAEH,EACH,GACF,KACA,OAAC,OAAI,UAAU,0CACb,mBAAC,UAAO,UAAU,YAAY,aAAc,CAACL,GAAM,QAAQ,IACxD,SAAAA,GAAM,QAAQ,OACb,oBACE,oBAAC,eAAY,IAAKA,GAAM,QAAQ,IAAK,KACrC,OAAC,kBAAgB,SAAAA,GAAM,MAAM,GAC/B,EAEAA,GAAM,MAEV,EACF,GACF,KACA,OAAC,KAAE,UAAU,kHACV,SAAAA,GAAM,aAAe,GACxB,KACA,OAAC,EAAAM,QAAA,CAAK,KAAMN,GAAM,MAAQ,GACxB,oBAAC,OACC,aAAW,MACT,0DACAC,GAAe,QAAU,QAAU,aAAe,cACpD,EAEA,oBAAC,OAAI,UAAU,gEACb,mBAAC,EAAAM,QAAA,CAAQ,UAAU,sBAAsB,OAAQP,GAAM,KAAK,IAAK,EACnE,KACA,OAAC,KAAE,UAAU,2DAA4D,SAAAA,GAAM,UAAY,GAAG,GAChG,EACF,GACF,CAEJ,EAEMQ,EAAW,EAAAC,QAAM,WAA0C,CAAC,CAAE,UAAAC,EAAY,GAAI,KAAAV,EAAM,IAAAW,CAAI,EAAGC,IAAQ,CACvG,KAAM,CAAE,SAAAC,EAAU,MAAAC,EAAO,MAAAC,EAAO,GAAGC,CAAM,EAAIhB,EAC7C,SACE,QAAC,OAAI,IAAKY,EAAK,aAAW,MAAG,SAAUF,EAAW,CAAE,YAAaK,IAAU,MAAO,CAAC,EAChF,UAAAD,MAAS,OAAC,EAAAG,QAAA,CAAM,KAAM,CAAE,MAAOH,CAAM,EAAG,KACzC,OAAC,EAAAI,QAAA,CACC,UAAU,oBACV,GAAI,WAAaP,EACjB,KAAM,CAAE,KAAME,EAAU,cAAe,CAAE,GAAGG,CAAM,CAAE,EACpD,MAAOjB,EACP,YAAa,CACX,EAAG,CACD,aAAc,GACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,KAAM,CACJ,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,KAAM,CACJ,aAAc,GACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,GACF,CAEJ,CAAC,EAED,IAAOX,KAAQ,cAAWoB,CAAQ",
6
+ "names": ["Evaluate_exports", "__export", "Evaluate_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_Title", "import_utils", "import_picture", "import_SwiperBox", "import_Styles", "import_avatar", "import_link", "EvaluateItem", "data", "configuration", "handleRating", "num", "_", "index", "Link", "Picture", "Evaluate", "React", "className", "key", "ref", "products", "title", "theme", "ohter", "Title", "SwiperBox"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var j=Object.create;var p=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var A=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var D=(e,t)=>{for(var r in t)p(e,r,{get:t[r],enumerable:!0})},k=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of V(t))!q.call(e,s)&&s!==r&&p(e,s,{get:()=>t[s],enumerable:!(n=C(t,s))||n.enumerable});return e};var w=(e,t,r)=>(r=e!=null?j(A(e)):{},k(t||!e||!e.__esModule?p(r,"default",{value:e,enumerable:!0}):r,e)),F=e=>k(p({},"__esModule",{value:!0}),e);var J={};D(J,{default:()=>U});module.exports=F(J);var o=require("react/jsx-runtime"),a=require("react"),N=require("@gsap/react"),H=require("gsap"),m=require("gsap/dist/ScrollTrigger"),g=require("../../helpers/utils.js"),M=require("../../shared/Styles.js"),P=w(require("../../components/picture.js")),L=w(require("../../components/button.js")),y=require("@payloadcms/richtext-lexical/html"),z=require("react-intersection-observer");const G=({className:e="",data:{title:t,videoTitle:r,btnText:n,img:s,video:R,theme:S,shape:_}})=>{const[c,i]=(0,a.useState)(!1),l=(0,a.useRef)(null),f=(0,a.useRef)(null),u=(0,a.useRef)(null),{ref:B,inView:v}=(0,z.useInView)(),x=typeof t=="string"?t:t&&(0,y.convertLexicalToHTML)({data:t}),b=typeof r=="string"?r:r&&(0,y.convertLexicalToHTML)({data:r});return(0,a.useEffect)(()=>{v&&!n?(l.current?.play(),i(!0)):(l.current?.pause(),i(!1))},[v]),(0,N.useGSAP)(()=>{if(!u.current)return;const E=f.current?.clientHeight||100,h=u.current?.clientHeight||100,I=h+E;return m.ScrollTrigger.create({trigger:f.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:d=>{const T=d.progress*I-h;H.gsap.set(u.current,{y:T})}}),()=>{m.ScrollTrigger.getAll().forEach(d=>d.kill())}},[]),(0,o.jsxs)("div",{ref:f,className:(0,g.cn)(" relative w-full overflow-hidden"," 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]",e,{"aiui-dark":S==="dark","rounded-box":_==="rounded"}),children:[(0,o.jsx)("div",{children:(0,o.jsxs)("div",{ref:B,className:"media-content absolute left-1/2 top-1/2 z-20 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center gap-5",children:[x&&!c&&(0,o.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:x}}),b&&c&&(0,o.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:b}}),!c&&n&&(0,o.jsx)(L.default,{variant:"link",className:(0,g.cn)("member-equity-button-secondary text-btn-primary-foreground"),onClick:()=>{c?(l.current&&l.current.pause(),i(!1)):(l.current&&l.current.play(),i(!0))},children:n})]})}),(0,o.jsx)("div",{children:(0,o.jsxs)("div",{ref:u,className:"media-cover sticky left-0 top-0 h-screen w-screen",children:[(0,o.jsx)("video",{ref:l,className:"size-full object-cover",src:R?.url,muted:!0,loop:!0}),!c&&s?.url&&(0,o.jsx)(P.default,{className:"z-1 absolute left-0 top-0 size-full object-cover",source:s?.url,alt:s?.alt,imgClassName:"w-full h-full object-cover"}),(0,o.jsx)("div",{className:"absolute left-0 top-0 z-10 size-full"})]})})]})};var U=(0,M.withStyles)(G);
1
+ "use strict";"use client";var j=Object.create;var f=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var Y=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var D=(e,t)=>{for(var r in t)f(e,r,{get:t[r],enumerable:!0})},y=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of Y(t))!A.call(e,s)&&s!==r&&f(e,s,{get:()=>t[s],enumerable:!(n=V(t,s))||n.enumerable});return e};var w=(e,t,r)=>(r=e!=null?j(q(e)):{},y(t||!e||!e.__esModule?f(r,"default",{value:e,enumerable:!0}):r,e)),F=e=>y(f({},"__esModule",{value:!0}),e);var $={};D($,{default:()=>O});module.exports=F($);var o=require("react/jsx-runtime"),a=require("react"),U=require("@gsap/react"),X=require("gsap"),ee=require("gsap/dist/ScrollTrigger"),d=require("../../helpers/utils.js"),k=require("../../shared/Styles.js"),N=w(require("../../components/picture.js")),H=w(require("../../components/button.js")),u=require("@payloadcms/richtext-lexical/html"),P=require("react-intersection-observer");const G=({className:e="",data:{title:t,videoTitle:r,btnText:n,img:s,video:B,theme:M,shape:T,...L}})=>{const{sticky:c}=L,[i,p]=(0,a.useState)(!1),[R,z]=(0,a.useState)(0),l=(0,a.useRef)(null),m=(0,a.useRef)(null),S=(0,a.useRef)(null),{ref:_,inView:g}=(0,P.useInView)(),v=typeof t=="string"?t:t&&(0,u.convertLexicalToHTML)({data:t}),b=typeof r=="string"?r:r&&(0,u.convertLexicalToHTML)({data:r});return(0,a.useEffect)(()=>{g&&!n?(l.current?.play(),p(!0)):(l.current?.pause(),p(!1))},[g]),(0,a.useEffect)(()=>{if(m.current&&c){const E=m.current.getBoundingClientRect(),h=window.innerHeight,I=window.scrollY||window.pageYOffset,C=E.bottom+I,x=document.documentElement.scrollHeight-C;z(x>h?h:x)}},[]),(0,o.jsx)("div",{ref:m,style:c?{marginBottom:`-${R}px`}:{},className:(0,d.cn)("relative",c&&"mt-[-100vh]",c&&'after:content-[" "] after:relative after:box-content after:block after:h-screen',c&&"lg-desktop:after:aspect-w-[1920] lg-desktop:after:aspect-h-[930] desktop:after:aspect-w-[1024] desktop:after:aspect-h-[520] tablet:after:aspect-w-[768] tablet:after:aspect-h-[660] after:aspect-w-[390] after:aspect-h-[660]"),children:(0,o.jsx)("div",{className:"sticky top-0 ",children:(0,o.jsxs)("div",{className:(0,d.cn)("relative overflow-hidden",c?"h-screen w-screen":"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]",e,{"aiui-dark":M==="dark","rounded-box":T==="rounded"}),children:[(0,o.jsx)("div",{children:(0,o.jsxs)("div",{ref:_,className:"media-content absolute left-1/2 top-1/2 z-20 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center gap-5",children:[v&&!i&&(0,o.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:v}}),b&&i&&(0,o.jsx)("div",{className:"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl",dangerouslySetInnerHTML:{__html:b}}),!i&&n&&(0,o.jsx)(H.default,{variant:"link",className:(0,d.cn)("member-equity-button-secondary text-btn-primary-foreground"),onClick:()=>{i?(l.current&&l.current.pause(),p(!1)):(l.current&&l.current.play(),p(!0))},children:n})]})}),(0,o.jsx)("div",{children:(0,o.jsxs)("div",{ref:S,className:"media-cover left-0 top-0 h-screen w-screen",children:[(0,o.jsx)("video",{ref:l,className:"size-full object-cover",src:B?.url,muted:!0,loop:!0}),!i&&s?.url&&(0,o.jsx)(N.default,{className:"z-1 absolute left-0 top-0 size-full object-cover",source:s?.url,alt:s?.alt,imgClassName:"w-full h-full object-cover"}),(0,o.jsx)("div",{className:"absolute left-0 top-0 z-10 size-full"})]})})]})})})};var O=(0,k.withStyles)(G);
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/MediaPlayerBase/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\n// import { Right } from './right.js'\nimport { useInView } from 'react-intersection-observer'\n\nconst MediaPlayerBase: React.FC<MediaPlayerBaseProps> = ({\n className = '',\n data: { title, videoTitle, btnText, img, video, theme, shape },\n}) => {\n const [isPlaying, setIsPlaying] = useState(false)\n\n const videoRef = useRef<HTMLVideoElement>(null)\n const boxRef = useRef<HTMLDivElement>(null)\n const bgRef = useRef<HTMLImageElement>(null)\n\n const { ref, inView } = useInView()\n\n const title_html = typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title })\n const videoTitle_html =\n typeof videoTitle === 'string' ? videoTitle : videoTitle && convertLexicalToHTML({ data: videoTitle })\n\n useEffect(() => {\n if (inView && !btnText) {\n videoRef.current?.play()\n setIsPlaying(true)\n } else {\n videoRef.current?.pause()\n setIsPlaying(false)\n }\n }, [inView])\n\n useGSAP(() => {\n if (!bgRef.current) return\n const height = boxRef.current?.clientHeight || 100\n const screenHeight = bgRef.current?.clientHeight || 100\n const base = screenHeight + height\n\n ScrollTrigger.create({\n trigger: boxRef.current,\n start: 'top bottom',\n end: 'bottom top',\n scrub: true,\n onUpdate: (self: any) => {\n const value = self.progress * base - screenHeight\n gsap.set(bgRef.current, { y: value })\n },\n })\n return () => {\n ScrollTrigger.getAll().forEach((t: any) => t.kill())\n }\n }, [])\n\n return (\n <div\n ref={boxRef}\n className={cn(\n ' relative w-full overflow-hidden',\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 className,\n {\n 'aiui-dark': theme === 'dark',\n 'rounded-box': shape === 'rounded',\n }\n )}\n >\n <div>\n <div\n ref={ref}\n className=\"media-content absolute left-1/2 top-1/2 z-20 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center gap-5\"\n >\n {title_html && !isPlaying && (\n <div\n className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n dangerouslySetInnerHTML={{ __html: title_html }}\n />\n )}\n {videoTitle_html && isPlaying && (\n <div\n className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n />\n )}\n {!isPlaying && btnText && (\n <Button\n variant=\"link\"\n className={cn('member-equity-button-secondary text-btn-primary-foreground')}\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 >\n {btnText}\n {/* <Right /> */}\n </Button>\n )}\n </div>\n </div>\n <div>\n <div ref={bgRef} className=\"media-cover sticky left-0 top-0 h-screen w-screen\">\n <video ref={videoRef} className=\"size-full object-cover\" src={video?.url} muted loop />\n {!isPlaying && 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 className=\"absolute left-0 top-0 z-10 size-full\" />\n </div>\n </div>\n </div>\n )\n}\n\nexport default withStyles(MediaPlayerBase)\n"],
5
- "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA2EQ,IAAAI,EAAA,6BA1ERC,EAAmD,iBACnDA,EAAwB,uBACxBC,EAAqB,gBACrBC,EAA8B,mCAC9BC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAoB,0CACpBC,EAAmB,yCACnBC,EAAqC,6CAGrCC,EAA0B,uCAE1B,MAAMC,EAAkD,CAAC,CACvD,UAAAC,EAAY,GACZ,KAAM,CAAE,MAAAC,EAAO,WAAAC,EAAY,QAAAC,EAAS,IAAAC,EAAK,MAAAC,EAAO,MAAAC,EAAO,MAAAC,CAAM,CAC/D,IAAM,CACJ,KAAM,CAACC,EAAWC,CAAY,KAAI,YAAS,EAAK,EAE1CC,KAAW,UAAyB,IAAI,EACxCC,KAAS,UAAuB,IAAI,EACpCC,KAAQ,UAAyB,IAAI,EAErC,CAAE,IAAAC,EAAK,OAAAC,CAAO,KAAI,aAAU,EAE5BC,EAAa,OAAOd,GAAU,SAAWA,EAAQA,MAAS,wBAAqB,CAAE,KAAMA,CAAM,CAAC,EAC9Fe,EACJ,OAAOd,GAAe,SAAWA,EAAaA,MAAc,wBAAqB,CAAE,KAAMA,CAAW,CAAC,EAEvG,sBAAU,IAAM,CACVY,GAAU,CAACX,GACbO,EAAS,SAAS,KAAK,EACvBD,EAAa,EAAI,IAEjBC,EAAS,SAAS,MAAM,EACxBD,EAAa,EAAK,EAEtB,EAAG,CAACK,CAAM,CAAC,KAEX,WAAQ,IAAM,CACZ,GAAI,CAACF,EAAM,QAAS,OACpB,MAAMK,EAASN,EAAO,SAAS,cAAgB,IACzCO,EAAeN,EAAM,SAAS,cAAgB,IAC9CO,EAAOD,EAAeD,EAE5B,uBAAc,OAAO,CACnB,QAASN,EAAO,QAChB,MAAO,aACP,IAAK,aACL,MAAO,GACP,SAAWS,GAAc,CACvB,MAAMC,EAAQD,EAAK,SAAWD,EAAOD,EACrC,OAAK,IAAIN,EAAM,QAAS,CAAE,EAAGS,CAAM,CAAC,CACtC,CACF,CAAC,EACM,IAAM,CACX,gBAAc,OAAO,EAAE,QAASC,GAAWA,EAAE,KAAK,CAAC,CACrD,CACF,EAAG,CAAC,CAAC,KAGH,QAAC,OACC,IAAKX,EACL,aAAW,MACT,mCACA,sNACAX,EACA,CACE,YAAaM,IAAU,OACvB,cAAeC,IAAU,SAC3B,CACF,EAEA,oBAAC,OACC,oBAAC,OACC,IAAKM,EACL,UAAU,kHAET,UAAAE,GAAc,CAACP,MACd,OAAC,OACC,UAAU,gHACV,wBAAyB,CAAE,OAAQO,CAAW,EAChD,EAEDC,GAAmBR,MAClB,OAAC,OACC,UAAU,gHACV,wBAAyB,CAAE,OAAQQ,CAAgB,EACrD,EAED,CAACR,GAAaL,MACb,OAAC,EAAAoB,QAAA,CACC,QAAQ,OACR,aAAW,MAAG,4DAA4D,EAC1E,QAAS,IAAM,CACTf,GACEE,EAAS,SACXA,EAAS,QAAQ,MAAM,EAEzBD,EAAa,EAAK,IAEdC,EAAS,SACXA,EAAS,QAAQ,KAAK,EAExBD,EAAa,EAAI,EAErB,EAEC,SAAAN,EAEH,GAEJ,EACF,KACA,OAAC,OACC,oBAAC,OAAI,IAAKS,EAAO,UAAU,oDACzB,oBAAC,SAAM,IAAKF,EAAU,UAAU,yBAAyB,IAAKL,GAAO,IAAK,MAAK,GAAC,KAAI,GAAC,EACpF,CAACG,GAAaJ,GAAK,QAClB,OAAC,EAAAoB,QAAA,CACC,UAAU,mDACV,OAAQpB,GAAK,IACb,IAAKA,GAAK,IACV,aAAa,6BACf,KAEF,OAAC,OAAI,UAAU,uCAAuC,GACxD,EACF,GACF,CAEJ,EAEA,IAAOjB,KAAQ,cAAWY,CAAe",
6
- "names": ["MediaPlayerBase_exports", "__export", "MediaPlayerBase_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_ScrollTrigger", "import_utils", "import_Styles", "import_picture", "import_button", "import_html", "import_react_intersection_observer", "MediaPlayerBase", "className", "title", "videoTitle", "btnText", "img", "video", "theme", "shape", "isPlaying", "setIsPlaying", "videoRef", "boxRef", "bgRef", "ref", "inView", "title_html", "videoTitle_html", "height", "screenHeight", "base", "self", "value", "t", "Button", "Picture"]
4
+ "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { MediaPlayerBaseProps } from './types.js'\n// import { Right } from './right.js'\nimport { useInView } from 'react-intersection-observer'\n\nconst MediaPlayerBase: React.FC<MediaPlayerBaseProps> = ({\n className = '',\n data: { title, videoTitle, btnText, img, video, theme, shape, ...rest },\n}) => {\n const { sticky } = rest\n const [isPlaying, setIsPlaying] = useState(false)\n const [btb, setbtb] = useState(0)\n\n const videoRef = useRef<HTMLVideoElement>(null)\n const boxRef = useRef<HTMLDivElement>(null)\n const bgRef = useRef<HTMLImageElement>(null)\n\n const { ref, inView } = useInView()\n\n const title_html = typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title })\n const videoTitle_html =\n typeof videoTitle === 'string' ? videoTitle : videoTitle && convertLexicalToHTML({ data: videoTitle })\n\n useEffect(() => {\n if (inView && !btnText) {\n videoRef.current?.play()\n setIsPlaying(true)\n } else {\n videoRef.current?.pause()\n setIsPlaying(false)\n }\n }, [inView])\n\n useEffect(() => {\n if (boxRef.current && sticky) {\n const rect = boxRef.current.getBoundingClientRect()\n const screenHeight = window.innerHeight\n const scrollTop = window.scrollY || window.pageYOffset\n const elementBottomToPageTop = rect.bottom + scrollTop\n const pageHeight = document.documentElement.scrollHeight\n const distanceToPageBottom = pageHeight - elementBottomToPageTop\n setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n }\n }, [])\n\n // useGSAP(() => {\n // if (!bgRef.current) return\n // const height = boxRef.current?.clientHeight || 100\n // const screenHeight = bgRef.current?.clientHeight || 100\n // const base = screenHeight + height\n\n // ScrollTrigger.create({\n // trigger: boxRef.current,\n // start: 'top bottom',\n // end: 'bottom top',\n // scrub: true,\n // onUpdate: (self: any) => {\n // const value = self.progress * base - screenHeight\n // gsap.set(bgRef.current, { y: value })\n // },\n // })\n // return () => {\n // ScrollTrigger.getAll().forEach((t: any) => t.kill())\n // }\n // }, [])\n\n return (\n <div\n ref={boxRef}\n style={sticky ? { marginBottom: `-${btb}px` } : {}}\n className={cn(\n 'relative',\n sticky && 'mt-[-100vh]',\n sticky && 'after:content-[\" \"] after:relative after:box-content after:block after:h-screen',\n sticky &&\n 'lg-desktop:after:aspect-w-[1920] lg-desktop:after:aspect-h-[930] desktop:after:aspect-w-[1024] desktop:after:aspect-h-[520] tablet:after:aspect-w-[768] tablet:after:aspect-h-[660] after:aspect-w-[390] after:aspect-h-[660]'\n )}\n >\n <div className=\"sticky top-0 \">\n <div\n className={cn(\n 'relative overflow-hidden',\n sticky\n ? 'h-screen w-screen'\n : 'lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]',\n className,\n {\n 'aiui-dark': theme === 'dark',\n 'rounded-box': shape === 'rounded',\n }\n )}\n >\n <div>\n <div\n ref={ref}\n className=\"media-content absolute left-1/2 top-1/2 z-20 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center gap-5\"\n >\n {title_html && !isPlaying && (\n <div\n className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n dangerouslySetInnerHTML={{ __html: title_html }}\n />\n )}\n {videoTitle_html && isPlaying && (\n <div\n className=\"lg-desktop:text-[64px] text-btn-primary-foreground text-center text-[40px] font-bold leading-none lg:text-5xl\"\n dangerouslySetInnerHTML={{ __html: videoTitle_html }}\n />\n )}\n {!isPlaying && btnText && (\n <Button\n variant=\"link\"\n className={cn('member-equity-button-secondary text-btn-primary-foreground')}\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 >\n {btnText}\n {/* <Right /> */}\n </Button>\n )}\n </div>\n </div>\n <div>\n <div ref={bgRef} className=\"media-cover left-0 top-0 h-screen w-screen\">\n <video ref={videoRef} className=\"size-full object-cover\" src={video?.url} muted loop />\n {!isPlaying && 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 className=\"absolute left-0 top-0 z-10 size-full\" />\n </div>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default withStyles(MediaPlayerBase)\n"],
5
+ "mappings": "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",
6
+ "names": ["MediaPlayerBase_exports", "__export", "MediaPlayerBase_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_ScrollTrigger", "import_utils", "import_Styles", "import_picture", "import_button", "import_html", "import_react_intersection_observer", "MediaPlayerBase", "className", "title", "videoTitle", "btnText", "img", "video", "theme", "shape", "rest", "sticky", "isPlaying", "setIsPlaying", "btb", "setbtb", "videoRef", "boxRef", "bgRef", "ref", "inView", "title_html", "videoTitle_html", "rect", "screenHeight", "scrollTop", "elementBottomToPageTop", "distanceToPageBottom", "Button", "Picture"]
7
7
  }
@@ -1,6 +1,7 @@
1
1
  import type { ComponentCommonProps, Shape, Theme, Video, Img } from '../../types/props.js';
2
2
  export interface MediaPlayerBaseProps extends ComponentCommonProps {
3
3
  data: {
4
+ sticky?: boolean;
4
5
  shape?: Shape;
5
6
  theme?: Theme;
6
7
  title?: string;
@@ -1,2 +1,2 @@
1
- "use strict";var p=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var r=Object.getOwnPropertyNames;var s=Object.prototype.hasOwnProperty;var a=(o,e,i,m)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of r(e))!s.call(o,t)&&t!==i&&p(o,t,{get:()=>e[t],enumerable:!(m=n(e,t))||m.enumerable});return o};var d=o=>a(p({},"__esModule",{value:!0}),o);var g={};module.exports=d(g);
1
+ "use strict";var m=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var r=Object.prototype.hasOwnProperty;var a=(o,e,p,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of s(e))!r.call(o,t)&&t!==p&&m(o,t,{get:()=>e[t],enumerable:!(i=n(e,t))||i.enumerable});return o};var d=o=>a(m({},"__esModule",{value:!0}),o);var g={};module.exports=d(g);
2
2
  //# sourceMappingURL=types.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/MediaPlayerBase/types.ts"],
4
- "sourcesContent": ["import type { ComponentCommonProps, Shape, Theme, Video, Img } from '../../types/props.js'\n\nexport interface MediaPlayerBaseProps extends ComponentCommonProps {\n data: {\n shape?: Shape\n theme?: Theme\n title?: string\n videoTitle?: string\n btnText?: string\n img?: Img\n video?: Video\n }\n}\n"],
4
+ "sourcesContent": ["import type { ComponentCommonProps, Shape, Theme, Video, Img } from '../../types/props.js'\n\nexport interface MediaPlayerBaseProps extends ComponentCommonProps {\n data: {\n sticky?: boolean\n shape?: Shape\n theme?: Theme\n title?: string\n videoTitle?: string\n btnText?: string\n img?: Img\n video?: Video\n }\n}\n"],
5
5
  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
6
6
  "names": ["types_exports", "__toCommonJS"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var R=Object.create;var c=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var B=Object.getPrototypeOf,Y=Object.prototype.hasOwnProperty;var E=(t,a)=>{for(var r in a)c(t,r,{get:a[r],enumerable:!0})},y=(t,a,r,s)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of q(a))!Y.call(t,i)&&i!==r&&c(t,i,{get:()=>a[i],enumerable:!(s=z(a,i))||s.enumerable});return t};var l=(t,a,r)=>(r=t!=null?R(B(t)):{},y(a||!t||!t.__esModule?c(r,"default",{value:t,enumerable:!0}):r,t)),G=t=>y(c({},"__esModule",{value:!0}),t);var T={};E(T,{default:()=>L});module.exports=G(T);var e=require("react/jsx-runtime"),n=require("react"),d=require("../../helpers/utils.js"),f=require("../../shared/Styles.js"),b=l(require("../Slogan/index.js")),o=require("../../components/gird.js"),g=require("../../components/container.js"),v=l(require("../BrandEquity/index.js")),h=l(require("../MemberEquity/index.js")),k=l(require("../Spacer/index.js")),w=l(require("gsap")),m=require("@payloadcms/richtext-lexical/html"),N=require("react-responsive");const p=({children:t,spaceY:a})=>{const r=(0,N.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(g.Container,{spaceY:a,children:(0,e.jsxs)(o.Grid,{children:[!r&&(0,e.jsx)(o.GridItem,{span:1}),(0,e.jsx)(o.GridItem,{span:r?12:10,children:t}),!r&&(0,e.jsx)(o.GridItem,{span:1})]})})},$=({children:t,id:a,components:r})=>((0,n.useEffect)(()=>{const s=window.screen.height;w.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:t}),(0,e.jsx)(e.Fragment,{children:r?.map(s=>{switch(s.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(p,{spaceY:"!my-0",children:(0,e.jsx)(v.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)(p,{spaceY:"!my-0",children:(0,e.jsx)(h.default,{data:s,className:"w-full",style:s?.style})})});case"ipc-spacer":return(0,e.jsx)(k.default,{data:s,style:s?.style});default:return null}})})]})),I=({className:t="",id:a,data:{title:r,videoTitle:s,btnText:i,img:F,video:x,theme:u,shape:S,components:M}})=>{const C=(0,n.useRef)(null),P=typeof r=="string"?r:r&&(0,m.convertLexicalToHTML)({data:r});return typeof s=="string"||s&&(0,m.convertLexicalToHTML)({data:s}),(0,e.jsxs)($,{id:a,components:M,children:[(0,e.jsx)("div",{className:(0,d.cn)("sticky-box absolute left-0 top-0 h-screen w-full",t,{"aiui-dark":u==="dark","rounded-box":S==="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)(p,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)(b.default,{className:"sticky-title",data:{title:P||"",theme:u}})})})}),(0,e.jsx)("div",{className:"sticky left-0 top-0 w-full",children:(0,e.jsxs)("div",{className:(0,d.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:[(0,e.jsx)("video",{ref:C,className:"size-full object-cover",src:x?.url,autoPlay:!0,muted:!0,loop:!0,playsInline:!0}),(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 L=(0,f.withStyles)(I);
1
+ "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);
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/MediaPlayerSticky/index.tsx"],
4
- "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 { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\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 = typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title })\n typeof videoTitle === 'string' ? videoTitle : videoTitle && convertLexicalToHTML({ data: videoTitle })\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 ref={videoRef} className=\"size-full object-cover\" src={video?.url} autoPlay muted loop playsInline />\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"],
5
- "mappings": "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",
6
- "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", "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"]
4
+ "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"],
5
+ "mappings": "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",
6
+ "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"]
7
7
  }
@@ -51,8 +51,8 @@ export interface ShelfDisplayProps {
51
51
  className?: string;
52
52
  key?: string;
53
53
  }
54
- declare const _default: React.ForwardRefExoticComponent<Omit<ShelfDisplayProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
54
+ declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ShelfDisplayProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
55
55
  className?: string;
56
56
  data?: Record<string, any>;
57
- } & React.RefAttributes<any>>;
57
+ }, "ref"> & React.RefAttributes<any>>;
58
58
  export default _default;