@anker-in/headless-ui 0.0.27-alpha.17 → 0.0.27-alpha.18

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 (155) hide show
  1. package/dist/cjs/biz-components/AccordionCards/index.js +1 -1
  2. package/dist/cjs/biz-components/AccordionCards/index.js.map +2 -2
  3. package/dist/cjs/biz-components/BrandEquity/BrandEquity.js +1 -1
  4. package/dist/cjs/biz-components/BrandEquity/BrandEquity.js.map +2 -2
  5. package/dist/cjs/biz-components/Category/index.js +1 -1
  6. package/dist/cjs/biz-components/Category/index.js.map +2 -2
  7. package/dist/cjs/biz-components/Evaluate/index.js +1 -1
  8. package/dist/cjs/biz-components/Evaluate/index.js.map +2 -2
  9. package/dist/cjs/biz-components/Graphic/index.js +1 -1
  10. package/dist/cjs/biz-components/Graphic/index.js.map +2 -2
  11. package/dist/cjs/biz-components/HeroBanner/HeroBanner.js +1 -1
  12. package/dist/cjs/biz-components/HeroBanner/HeroBanner.js.map +2 -2
  13. package/dist/cjs/biz-components/HeroBanner/index.js.map +1 -1
  14. package/dist/cjs/biz-components/Marquee/index.js +1 -1
  15. package/dist/cjs/biz-components/Marquee/index.js.map +2 -2
  16. package/dist/cjs/biz-components/MediaPlayerBase/index.d.ts +15 -0
  17. package/dist/cjs/biz-components/MediaPlayerBase/index.js +2 -0
  18. package/dist/cjs/biz-components/MediaPlayerBase/index.js.map +7 -0
  19. package/dist/cjs/biz-components/MediaPlayerMulti/index.d.ts +18 -0
  20. package/dist/cjs/biz-components/MediaPlayerMulti/index.js +2 -0
  21. package/dist/cjs/biz-components/MediaPlayerMulti/index.js.map +7 -0
  22. package/dist/cjs/biz-components/MemberEquity/index.js +1 -1
  23. package/dist/cjs/biz-components/MemberEquity/index.js.map +2 -2
  24. package/dist/cjs/biz-components/Slogan/index.js +1 -1
  25. package/dist/cjs/biz-components/Slogan/index.js.map +2 -2
  26. package/dist/cjs/biz-components/Tabs/Tabs.js +1 -1
  27. package/dist/cjs/biz-components/Tabs/Tabs.js.map +2 -2
  28. package/dist/cjs/biz-components/Tabs/index.js.map +1 -1
  29. package/dist/cjs/components/checkbox.js +1 -1
  30. package/dist/cjs/components/checkbox.js.map +2 -2
  31. package/dist/cjs/components/container.js +1 -1
  32. package/dist/cjs/components/container.js.map +2 -2
  33. package/dist/cjs/components/dialog.js +1 -1
  34. package/dist/cjs/components/dialog.js.map +2 -2
  35. package/dist/cjs/components/drawer.js +1 -1
  36. package/dist/cjs/components/drawer.js.map +2 -2
  37. package/dist/cjs/components/drop-down.js +1 -1
  38. package/dist/cjs/components/drop-down.js.map +2 -2
  39. package/dist/cjs/components/gird.js +1 -1
  40. package/dist/cjs/components/gird.js.map +2 -2
  41. package/dist/cjs/components/heading.js +1 -1
  42. package/dist/cjs/components/heading.js.map +2 -2
  43. package/dist/cjs/components/index.js.map +1 -1
  44. package/dist/cjs/components/input.js +1 -1
  45. package/dist/cjs/components/input.js.map +1 -1
  46. package/dist/cjs/components/radio.js +1 -1
  47. package/dist/cjs/components/radio.js.map +2 -2
  48. package/dist/cjs/components/skeleton.js +3 -3
  49. package/dist/cjs/components/skeleton.js.map +1 -1
  50. package/dist/cjs/components/tabs.js.map +2 -2
  51. package/dist/cjs/components/text.js.map +2 -2
  52. package/dist/cjs/components/theme.js.map +1 -1
  53. package/dist/cjs/stories/HeroBanner.stories.js.map +2 -2
  54. package/dist/cjs/stories/accordionCards.stories.js.map +2 -2
  55. package/dist/cjs/stories/badge.stories.js.map +1 -1
  56. package/dist/cjs/stories/bizTabs.stories.js.map +2 -2
  57. package/dist/cjs/stories/container.stories.js +2 -2
  58. package/dist/cjs/stories/container.stories.js.map +2 -2
  59. package/dist/cjs/stories/drawer.stories.js +1 -1
  60. package/dist/cjs/stories/drawer.stories.js.map +2 -2
  61. package/dist/cjs/stories/evaluate.stories.js.map +2 -2
  62. package/dist/cjs/stories/grid.stories.d.ts +1 -1
  63. package/dist/cjs/stories/grid.stories.js.map +2 -2
  64. package/dist/cjs/stories/heading.stories.js.map +2 -2
  65. package/dist/cjs/stories/marquee.stories.js.map +1 -1
  66. package/dist/cjs/stories/mediaplayerBase.stories.d.ts +6 -0
  67. package/dist/cjs/stories/mediaplayerBase.stories.js +2 -0
  68. package/dist/cjs/stories/mediaplayerBase.stories.js.map +7 -0
  69. package/dist/cjs/stories/mediaplayerMulti.stories.d.ts +18 -0
  70. package/dist/cjs/stories/mediaplayerMulti.stories.js +2 -0
  71. package/dist/cjs/stories/mediaplayerMulti.stories.js.map +7 -0
  72. package/dist/cjs/stories/shelfDisplay.stories.js.map +2 -2
  73. package/dist/cjs/stories/skeleton.stories.js +1 -1
  74. package/dist/cjs/stories/skeleton.stories.js.map +2 -2
  75. package/dist/cjs/stories/slogan.stories.js.map +2 -2
  76. package/dist/cjs/stories/text.stories.js.map +2 -2
  77. package/dist/esm/biz-components/AccordionCards/index.js +1 -1
  78. package/dist/esm/biz-components/AccordionCards/index.js.map +2 -2
  79. package/dist/esm/biz-components/BrandEquity/BrandEquity.js +1 -1
  80. package/dist/esm/biz-components/BrandEquity/BrandEquity.js.map +2 -2
  81. package/dist/esm/biz-components/Category/index.js +1 -1
  82. package/dist/esm/biz-components/Category/index.js.map +2 -2
  83. package/dist/esm/biz-components/Evaluate/index.js +1 -1
  84. package/dist/esm/biz-components/Evaluate/index.js.map +2 -2
  85. package/dist/esm/biz-components/Graphic/index.js +1 -1
  86. package/dist/esm/biz-components/Graphic/index.js.map +2 -2
  87. package/dist/esm/biz-components/HeroBanner/HeroBanner.js +1 -1
  88. package/dist/esm/biz-components/HeroBanner/HeroBanner.js.map +2 -2
  89. package/dist/esm/biz-components/HeroBanner/index.js.map +1 -1
  90. package/dist/esm/biz-components/Marquee/index.js +1 -1
  91. package/dist/esm/biz-components/Marquee/index.js.map +2 -2
  92. package/dist/esm/biz-components/MediaPlayerBase/index.d.ts +15 -0
  93. package/dist/esm/biz-components/MediaPlayerBase/index.js +2 -0
  94. package/dist/esm/biz-components/MediaPlayerBase/index.js.map +7 -0
  95. package/dist/esm/biz-components/MediaPlayerMulti/index.d.ts +18 -0
  96. package/dist/esm/biz-components/MediaPlayerMulti/index.js +2 -0
  97. package/dist/esm/biz-components/MediaPlayerMulti/index.js.map +7 -0
  98. package/dist/esm/biz-components/MemberEquity/index.js +1 -1
  99. package/dist/esm/biz-components/MemberEquity/index.js.map +2 -2
  100. package/dist/esm/biz-components/Slogan/index.js +1 -1
  101. package/dist/esm/biz-components/Slogan/index.js.map +2 -2
  102. package/dist/esm/biz-components/Tabs/Tabs.js +1 -1
  103. package/dist/esm/biz-components/Tabs/Tabs.js.map +2 -2
  104. package/dist/esm/biz-components/Tabs/index.js.map +1 -1
  105. package/dist/esm/components/checkbox.js +1 -1
  106. package/dist/esm/components/checkbox.js.map +2 -2
  107. package/dist/esm/components/container.js +1 -1
  108. package/dist/esm/components/container.js.map +2 -2
  109. package/dist/esm/components/dialog.js +1 -1
  110. package/dist/esm/components/dialog.js.map +2 -2
  111. package/dist/esm/components/drawer.js +1 -1
  112. package/dist/esm/components/drawer.js.map +2 -2
  113. package/dist/esm/components/drop-down.js +1 -1
  114. package/dist/esm/components/drop-down.js.map +2 -2
  115. package/dist/esm/components/gird.js +1 -1
  116. package/dist/esm/components/gird.js.map +2 -2
  117. package/dist/esm/components/heading.js +1 -1
  118. package/dist/esm/components/heading.js.map +2 -2
  119. package/dist/esm/components/index.js.map +1 -1
  120. package/dist/esm/components/input.js +1 -1
  121. package/dist/esm/components/input.js.map +1 -1
  122. package/dist/esm/components/radio.js +1 -1
  123. package/dist/esm/components/radio.js.map +2 -2
  124. package/dist/esm/components/skeleton.js +3 -3
  125. package/dist/esm/components/skeleton.js.map +1 -1
  126. package/dist/esm/components/tabs.js.map +2 -2
  127. package/dist/esm/components/text.js.map +2 -2
  128. package/dist/esm/components/theme.js.map +1 -1
  129. package/dist/esm/stories/HeroBanner.stories.js.map +2 -2
  130. package/dist/esm/stories/accordionCards.stories.js.map +2 -2
  131. package/dist/esm/stories/badge.stories.js.map +1 -1
  132. package/dist/esm/stories/bizTabs.stories.js.map +2 -2
  133. package/dist/esm/stories/container.stories.js +1 -1
  134. package/dist/esm/stories/container.stories.js.map +2 -2
  135. package/dist/esm/stories/drawer.stories.js +1 -1
  136. package/dist/esm/stories/drawer.stories.js.map +3 -3
  137. package/dist/esm/stories/evaluate.stories.js.map +2 -2
  138. package/dist/esm/stories/grid.stories.d.ts +1 -1
  139. package/dist/esm/stories/grid.stories.js.map +2 -2
  140. package/dist/esm/stories/heading.stories.js.map +2 -2
  141. package/dist/esm/stories/marquee.stories.js.map +1 -1
  142. package/dist/esm/stories/mediaplayerBase.stories.d.ts +6 -0
  143. package/dist/esm/stories/mediaplayerBase.stories.js +2 -0
  144. package/dist/esm/stories/mediaplayerBase.stories.js.map +7 -0
  145. package/dist/esm/stories/mediaplayerMulti.stories.d.ts +18 -0
  146. package/dist/esm/stories/mediaplayerMulti.stories.js +2 -0
  147. package/dist/esm/stories/mediaplayerMulti.stories.js.map +7 -0
  148. package/dist/esm/stories/shelfDisplay.stories.js.map +2 -2
  149. package/dist/esm/stories/skeleton.stories.js +1 -1
  150. package/dist/esm/stories/skeleton.stories.js.map +2 -2
  151. package/dist/esm/stories/slogan.stories.js.map +2 -2
  152. package/dist/esm/stories/text.stories.js.map +2 -2
  153. package/package.json +5 -1
  154. package/style.css +106 -16
  155. package/tailwind.config.ts +3 -0
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var L=Object.create;var f=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var M=Object.getPrototypeOf,R=Object.prototype.hasOwnProperty;var j=(t,r)=>{for(var o in r)f(t,o,{get:r[o],enumerable:!0})},w=(t,r,o,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let l of B(r))!R.call(t,l)&&l!==o&&f(t,l,{get:()=>r[l],enumerable:!(c=T(r,l))||c.enumerable});return t};var g=(t,r,o)=>(o=t!=null?L(M(t)):{},w(r||!t||!t.__esModule?f(o,"default",{value:t,enumerable:!0}):o,t)),q=t=>w(f({},"__esModule",{value:!0}),t);var H={};j(H,{default:()=>_});module.exports=q(H);var s=require("react/jsx-runtime"),d=require("../../helpers/utils.js"),v=g(require("../../components/picture.js")),y=g(require("../../components/button.js")),i=require("react");function z(){const[t,r]=(0,i.useState)(window?.innerWidth||0);return(0,i.useEffect)(()=>{const o=()=>r(window?.innerWidth||0);return window?.addEventListener("resize",o),()=>window?.removeEventListener("resize",o)},[]),t<=768}const A=({products:t=[],className:r="",shape:o="square",itemShape:c="square",event:l,primaryButton:k=""})=>{const E=z(),[N,b]=(0,i.useState)(null),[W,h]=(0,i.useState)({}),F=(0,i.useRef)([]),m=(0,i.useRef)({}),p=(0,i.useRef)({}),C=(n,e)=>{e&&(F.current[n]=e)},x=n=>{if(p.current?.[n]){const e={...m.current,[n]:!0};h(e),m.current=e}};return(0,i.useEffect)(()=>{const n=F.current;return n?.forEach((e,a)=>{e.addEventListener("transitionend",()=>x(a))}),()=>{n?.forEach((e,a)=>{e.removeEventListener("transitionend",()=>x(a))})}},[]),E?(0,s.jsx)("div",{className:(0,d.cn)("flex gap-4 overflow-x-auto w-full h-[400px]",r),children:t?.map((n,e)=>(0,s.jsx)("div",{className:"grow-0 shrink-0 basis-[296px] bg-[#FFFFFF] border border-solid border-[#dddddd]",children:(0,s.jsx)(v.default,{className:"w-full h-full object-cover [&_img]:h-full [&_img]:object-cover",source:n?.img})},e))}):(0,s.jsx)("div",{className:(0,d.cn)("h-[336px] gap-4 flex w-full overflow-hidden laptop:h-[448px] desktop:h-[560px]",r),children:t?.map((n,e)=>{const a=N===e;return(0,s.jsxs)("div",{style:{flex:a?6:1,transition:"all 0.3s ease-in-out"},ref:u=>u&&C(e,u),className:(0,d.cn)("relative overflow-hidden cursor-pointer",c==="round"?"rounded-2xl":""),onMouseEnter:()=>{b(e),p.current[e]=!0},onMouseLeave:()=>{b(null);const u={...m.current,[e]:!1};h(u),m.current=u,p.current[e]=!1},children:[(0,s.jsx)(v.default,{source:n?.img,className:"w-full h-full object-cover [&_img]:h-full [&_img]:object-cover"}),W?.[e]?(0,s.jsxs)("div",{className:(0,d.cn)("absolute left-0 right-0 bottom-0 px-6 pb-6 overflow-hidden flex justify-between items-end","transition-all duration-[50ms] delay-[300ms]",a?"opacity-100":"opacity-0"),children:[(0,s.jsxs)("div",{className:"mr-1 flex-1 overflow-hidden",children:[(0,s.jsx)("p",{className:"mb-1 text-xl font-bold text-[#FFFFFF] laptop:text-2xl desktop:text-[32px]",children:n?.title}),(0,s.jsx)("h3",{className:"text-sm font-medium text-[#FFFFFF] desktop:text-lg",children:n?.subTitle})]}),(0,s.jsx)(y.default,{size:"sm",hoverEffect:"slide",variant:"secondary",onClick:()=>l?.primaryButton?.onClick?.(n),className:(0,d.cn)("mb-1.5 overflow-hidden bg-transparent text-[#FFFFFF] border-[#FFFFFF] font-bold text-sm desktop:text-base",o==="round"?"rounded-2xl":""),children:k})]}):null]},e)})})};var _=A;
1
+ "use strict";"use client";var L=Object.create;var f=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var B=Object.getPrototypeOf,M=Object.prototype.hasOwnProperty;var R=(t,r)=>{for(var o in r)f(t,o,{get:r[o],enumerable:!0})},w=(t,r,o,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let l of z(r))!M.call(t,l)&&l!==o&&f(t,l,{get:()=>r[l],enumerable:!(c=T(r,l))||c.enumerable});return t};var g=(t,r,o)=>(o=t!=null?L(B(t)):{},w(r||!t||!t.__esModule?f(o,"default",{value:t,enumerable:!0}):o,t)),j=t=>w(f({},"__esModule",{value:!0}),t);var H={};R(H,{default:()=>_});module.exports=j(H);var s=require("react/jsx-runtime"),d=require("../../helpers/utils.js"),v=g(require("../../components/picture.js")),y=g(require("../../components/button.js")),i=require("react");function q(){const[t,r]=(0,i.useState)(window?.innerWidth||0);return(0,i.useEffect)(()=>{const o=()=>r(window?.innerWidth||0);return window?.addEventListener("resize",o),()=>window?.removeEventListener("resize",o)},[]),t<=768}const A=({products:t=[],className:r="",shape:o="square",itemShape:c="square",event:l,primaryButton:k=""})=>{const E=q(),[N,b]=(0,i.useState)(null),[W,F]=(0,i.useState)({}),h=(0,i.useRef)([]),m=(0,i.useRef)({}),p=(0,i.useRef)({}),C=(n,e)=>{e&&(h.current[n]=e)},x=n=>{if(p.current?.[n]){const e={...m.current,[n]:!0};F(e),m.current=e}};return(0,i.useEffect)(()=>{const n=h.current;return n?.forEach((e,a)=>{e.addEventListener("transitionend",()=>x(a))}),()=>{n?.forEach((e,a)=>{e.removeEventListener("transitionend",()=>x(a))})}},[]),E?(0,s.jsx)("div",{className:(0,d.cn)("flex h-[400px] w-full gap-4 overflow-x-auto",r),children:t?.map((n,e)=>(0,s.jsx)("div",{className:"shrink-0 grow-0 basis-[296px] border border-solid border-[#dddddd] bg-[#FFFFFF]",children:(0,s.jsx)(v.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:n?.img})},e))}):(0,s.jsx)("div",{className:(0,d.cn)("laptop:h-[448px] desktop:h-[560px] flex h-[336px] w-full gap-4 overflow-hidden",r),children:t?.map((n,e)=>{const a=N===e;return(0,s.jsxs)("div",{style:{flex:a?6:1,transition:"all 0.3s ease-in-out"},ref:u=>u&&C(e,u),className:(0,d.cn)("relative cursor-pointer overflow-hidden",c==="round"?"rounded-2xl":""),onMouseEnter:()=>{b(e),p.current[e]=!0},onMouseLeave:()=>{b(null);const u={...m.current,[e]:!1};F(u),m.current=u,p.current[e]=!1},children:[(0,s.jsx)(v.default,{source:n?.img,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),W?.[e]?(0,s.jsxs)("div",{className:(0,d.cn)("absolute inset-x-0 bottom-0 flex items-end justify-between overflow-hidden px-6 pb-6","transition-all delay-300 duration-[50ms]",a?"opacity-100":"opacity-0"),children:[(0,s.jsxs)("div",{className:"mr-1 flex-1 overflow-hidden",children:[(0,s.jsx)("p",{className:"laptop:text-2xl desktop:text-[32px] mb-1 text-xl font-bold text-[#FFFFFF]",children:n?.title}),(0,s.jsx)("h3",{className:"desktop:text-lg text-sm font-medium text-[#FFFFFF]",children:n?.subTitle})]}),(0,s.jsx)(y.default,{size:"sm",hoverEffect:"slide",variant:"secondary",onClick:()=>l?.primaryButton?.onClick?.(n),className:(0,d.cn)("desktop:text-base mb-1.5 overflow-hidden border-[#FFFFFF] bg-transparent text-sm font-bold text-[#FFFFFF]",o==="round"?"rounded-2xl":""),children:k})]}):null]},e)})})};var _=A;
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 { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { useState, useEffect, useRef } from 'react'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\nfunction useWindowWidth() {\n const [width, setWidth] = useState(window?.innerWidth || 0);\n useEffect(() => {\n const onResize = () => setWidth(window?.innerWidth || 0);\n window?.addEventListener('resize', onResize);\n return () => window?.removeEventListener('resize', onResize);\n }, []);\n return width <= 768;\n}\n\ntype AccordionCardsType = {\n products: Array<{\n /** \u6807\u9898\u6587\u672C */\n title: string\n /** \u56FE\u7247*/\n img: string\n /** \u5185\u5BB9\u8282\u70B9 */\n subTitle: string\n }>\n className?: string\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 /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: {\n primaryButton?: {\n onClick: (v: any) => void\n },\n },\n}\n\nconst AccordionCards = ({\n products = [],\n className = '',\n shape = 'square',\n itemShape = 'square',\n event,\n primaryButton = '',\n}: AccordionCardsType) => {\n const isMobile = useWindowWidth();\n const [hoverIndex, setHoverIndex] = useState<number | null>(null);\n const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({});\n\n const accordionRef = useRef<HTMLDivElement[]>([]);\n const refWidth = useRef<{ [key: number]: boolean }>({});\n const enterRef = useRef<{ [key: number]: boolean }>({});\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 const current = { ...refWidth.current, [index]: true }\n setCurrentWidth(current)\n refWidth.current = current\n }\n };\n\n useEffect(() => {\n const element = accordionRef.current;\n element?.forEach((item, index) => {\n item.addEventListener('transitionend', () => handleTransitionEnd(index));\n })\n return () => {\n element?.forEach((item, index) => {\n item.removeEventListener('transitionend', () => handleTransitionEnd(index)); \n })\n };\n }, [])\n\n // \u79FB\u52A8\u7AEF\n if (isMobile) {\n return (\n <div className={cn(\"flex gap-4 overflow-x-auto w-full h-[400px]\", className)}>\n {products?.map((item, idx) => (\n <div\n key={idx}\n className=\"grow-0 shrink-0 basis-[296px] bg-[#FFFFFF] border border-solid border-[#dddddd]\"\n >\n <Picture\n className=\"w-full h-full object-cover [&_img]:h-full [&_img]:object-cover\"\n source={item?.img}\n />\n </div>\n ))}\n </div>\n );\n }\n\n // \u684C\u9762\u7AEF\n return (\n <div className={cn(\"h-[336px] gap-4 flex w-full overflow-hidden laptop:h-[448px] desktop:h-[560px]\", className)}>\n {products?.map((item, idx) => {\n const isExpanded = hoverIndex === idx;\n const flexValue = isExpanded ? 6 : 1;\n return (\n <div\n key={idx}\n style={{\n flex: flexValue,\n transition: 'all 0.3s ease-in-out',\n }}\n ref={(el) => el && getRef(idx, el)}\n className={cn(\n 'relative overflow-hidden cursor-pointer',\n itemShape === 'round' ? 'rounded-2xl' : ''\n )}\n onMouseEnter={() => {\n setHoverIndex(idx)\n enterRef.current[idx] = true\n }}\n onMouseLeave={() => {\n setHoverIndex(null)\n const current = { ...refWidth.current, [idx]: false }\n setCurrentWidth(current)\n refWidth.current = current\n enterRef.current[idx] = false\n }}\n >\n <Picture\n source={item?.img}\n className=\"w-full h-full object-cover [&_img]:h-full [&_img]:object-cover\"\n />\n {\n currentWidth?.[idx] ?\n <div className={cn(\n 'absolute left-0 right-0 bottom-0 px-6 pb-6 overflow-hidden flex justify-between items-end',\n 'transition-all duration-[50ms] delay-[300ms]',\n isExpanded ? 'opacity-100' : 'opacity-0'\n )}>\n <div className=\"mr-1 flex-1 overflow-hidden\">\n <p className=\"mb-1 text-xl font-bold text-[#FFFFFF] laptop:text-2xl desktop:text-[32px]\">{item?.title}</p>\n <h3 className=\"text-sm font-medium text-[#FFFFFF] desktop:text-lg\">{item?.subTitle}</h3>\n </div>\n <Button\n size=\"sm\"\n hoverEffect=\"slide\"\n variant=\"secondary\"\n onClick={() => event?.primaryButton?.onClick?.(item)}\n className={cn(\n 'mb-1.5 overflow-hidden bg-transparent text-[#FFFFFF] border-[#FFFFFF] font-bold text-sm desktop:text-base',\n shape === 'round' ? 'rounded-2xl' : ''\n )}\n >\n {primaryButton}\n </Button>\n </div>: null\n }\n </div>\n );\n })}\n </div>\n );\n};\n\nexport default AccordionCards\n"],
5
- "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA4FwB,IAAAI,EAAA,6BA3FxBC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAAmB,yCACnBC,EAA4C,iBAG5C,SAASC,GAAiB,CACtB,KAAM,CAACC,EAAOC,CAAQ,KAAI,YAAS,QAAQ,YAAc,CAAC,EAC1D,sBAAU,IAAM,CACZ,MAAMC,EAAW,IAAMD,EAAS,QAAQ,YAAc,CAAC,EACvD,eAAQ,iBAAiB,SAAUC,CAAQ,EACpC,IAAM,QAAQ,oBAAoB,SAAUA,CAAQ,CAC/D,EAAG,CAAC,CAAC,EACEF,GAAS,GACpB,CA0BA,MAAMG,EAAiB,CAAC,CACpB,SAAAC,EAAW,CAAC,EACZ,UAAAC,EAAY,GACZ,MAAAC,EAAQ,SACR,UAAAC,EAAY,SACZ,MAAAC,EACA,cAAAC,EAAgB,EACpB,IAA0B,CACtB,MAAMC,EAAWX,EAAe,EAC1B,CAACY,EAAYC,CAAa,KAAI,YAAwB,IAAI,EAC1D,CAACC,EAAcC,CAAe,KAAI,YAAqC,CAAC,CAAC,EAEzEC,KAAe,UAAyB,CAAC,CAAC,EAC1CC,KAAW,UAAmC,CAAC,CAAC,EAChDC,KAAW,UAAmC,CAAC,CAAC,EAEhDC,EAAS,CAACC,EAAeC,IAAuB,CAC9CA,IACAL,EAAa,QAAQI,CAAK,EAAIC,EAEtC,EAEMC,EAAuBF,GAAkB,CAC3C,GAAIF,EAAS,UAAUE,CAAK,EAAG,CAC3B,MAAMG,EAAU,CAAE,GAAGN,EAAS,QAAS,CAACG,CAAK,EAAG,EAAK,EACrDL,EAAgBQ,CAAO,EACvBN,EAAS,QAAUM,CACvB,CACJ,EAeA,SAbA,aAAU,IAAM,CACZ,MAAMC,EAAUR,EAAa,QAC7B,OAAAQ,GAAS,QAAQ,CAACC,EAAML,IAAU,CAC9BK,EAAK,iBAAiB,gBAAiB,IAAMH,EAAoBF,CAAK,CAAC,CAC3E,CAAC,EACM,IAAM,CACTI,GAAS,QAAQ,CAACC,EAAML,IAAU,CAC9BK,EAAK,oBAAoB,gBAAiB,IAAMH,EAAoBF,CAAK,CAAC,CAC9E,CAAC,CACL,CACJ,EAAG,CAAC,CAAC,EAGDT,KAEI,OAAC,OAAI,aAAW,MAAG,8CAA+CL,CAAS,EACtE,SAAAD,GAAU,IAAI,CAACoB,EAAMC,OAClB,OAAC,OAEG,UAAU,kFAEV,mBAAC,EAAAC,QAAA,CACG,UAAU,iEACV,OAAQF,GAAM,IAClB,GANKC,CAOT,CACH,EACL,KAMJ,OAAC,OAAI,aAAW,MAAG,iFAAkFpB,CAAS,EACzG,SAAAD,GAAU,IAAI,CAACoB,EAAMC,IAAQ,CAC1B,MAAME,EAAahB,IAAec,EAElC,SACI,QAAC,OAEG,MAAO,CACH,KALME,EAAa,EAAI,EAMvB,WAAY,sBAChB,EACA,IAAMP,GAAOA,GAAMF,EAAOO,EAAKL,CAAE,EACjC,aAAW,MACP,0CACAb,IAAc,QAAU,cAAgB,EAC5C,EACA,aAAc,IAAM,CAChBK,EAAca,CAAG,EACjBR,EAAS,QAAQQ,CAAG,EAAI,EAC5B,EACA,aAAc,IAAM,CAChBb,EAAc,IAAI,EAClB,MAAMU,EAAU,CAAE,GAAGN,EAAS,QAAS,CAACS,CAAG,EAAG,EAAM,EACpDX,EAAgBQ,CAAO,EACvBN,EAAS,QAAUM,EACnBL,EAAS,QAAQQ,CAAG,EAAI,EAC5B,EAEA,oBAAC,EAAAC,QAAA,CACG,OAAQF,GAAM,IACd,UAAU,iEACd,EAEIX,IAAeY,CAAG,KACd,QAAC,OAAI,aAAW,MACZ,4FACA,+CACAE,EAAa,cAAgB,WACjC,EACI,qBAAC,OAAI,UAAU,8BACX,oBAAC,KAAE,UAAU,4EAA6E,SAAAH,GAAM,MAAM,KACtG,OAAC,MAAG,UAAU,qDAAsD,SAAAA,GAAM,SAAS,GACvF,KACA,OAAC,EAAAI,QAAA,CACG,KAAK,KACL,YAAY,QACZ,QAAQ,YACR,QAAS,IAAMpB,GAAO,eAAe,UAAUgB,CAAI,EACnD,aAAW,MACP,4GACAlB,IAAU,QAAU,cAAgB,EACxC,EAEC,SAAAG,EACL,GACJ,EAAQ,OAjDXgB,CAmDT,CAER,CAAC,EACL,CAER,EAEA,IAAOjC,EAAQW",
4
+ "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { useState, useEffect, useRef } from 'react'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\nfunction useWindowWidth() {\n const [width, setWidth] = useState(window?.innerWidth || 0)\n useEffect(() => {\n const onResize = () => setWidth(window?.innerWidth || 0)\n window?.addEventListener('resize', onResize)\n return () => window?.removeEventListener('resize', onResize)\n }, [])\n return width <= 768\n}\n\ntype AccordionCardsType = {\n products: Array<{\n /** \u6807\u9898\u6587\u672C */\n title: string\n /** \u56FE\u7247*/\n img: string\n /** \u5185\u5BB9\u8282\u70B9 */\n subTitle: string\n }>\n className?: string\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 /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: {\n primaryButton?: {\n onClick: (v: any) => void\n }\n }\n}\n\nconst AccordionCards = ({\n products = [],\n className = '',\n shape = 'square',\n itemShape = 'square',\n event,\n primaryButton = '',\n}: AccordionCardsType) => {\n const isMobile = useWindowWidth()\n const [hoverIndex, setHoverIndex] = useState<number | null>(null)\n const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({})\n\n const accordionRef = useRef<HTMLDivElement[]>([])\n const refWidth = useRef<{ [key: number]: boolean }>({})\n const enterRef = useRef<{ [key: number]: boolean }>({})\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 const current = { ...refWidth.current, [index]: true }\n setCurrentWidth(current)\n refWidth.current = current\n }\n }\n\n useEffect(() => {\n const element = accordionRef.current\n element?.forEach((item, index) => {\n item.addEventListener('transitionend', () => handleTransitionEnd(index))\n })\n return () => {\n element?.forEach((item, index) => {\n item.removeEventListener('transitionend', () => handleTransitionEnd(index))\n })\n }\n }, [])\n\n // \u79FB\u52A8\u7AEF\n if (isMobile) {\n return (\n <div className={cn('flex h-[400px] w-full gap-4 overflow-x-auto', className)}>\n {products?.map((item, idx) => (\n <div key={idx} className=\"shrink-0 grow-0 basis-[296px] border border-solid border-[#dddddd] bg-[#FFFFFF]\">\n <Picture className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" source={item?.img} />\n </div>\n ))}\n </div>\n )\n }\n\n // \u684C\u9762\u7AEF\n return (\n <div className={cn('laptop:h-[448px] desktop:h-[560px] flex h-[336px] w-full gap-4 overflow-hidden', className)}>\n {products?.map((item, idx) => {\n const isExpanded = hoverIndex === idx\n const flexValue = isExpanded ? 6 : 1\n return (\n <div\n key={idx}\n style={{\n flex: flexValue,\n transition: 'all 0.3s ease-in-out',\n }}\n ref={el => el && getRef(idx, el)}\n className={cn('relative cursor-pointer overflow-hidden', itemShape === 'round' ? 'rounded-2xl' : '')}\n onMouseEnter={() => {\n setHoverIndex(idx)\n enterRef.current[idx] = true\n }}\n onMouseLeave={() => {\n setHoverIndex(null)\n const current = { ...refWidth.current, [idx]: false }\n setCurrentWidth(current)\n refWidth.current = current\n enterRef.current[idx] = false\n }}\n >\n <Picture source={item?.img} className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" />\n {currentWidth?.[idx] ? (\n <div\n className={cn(\n 'absolute inset-x-0 bottom-0 flex items-end justify-between overflow-hidden px-6 pb-6',\n 'transition-all delay-300 duration-[50ms]',\n isExpanded ? 'opacity-100' : 'opacity-0'\n )}\n >\n <div className=\"mr-1 flex-1 overflow-hidden\">\n <p className=\"laptop:text-2xl desktop:text-[32px] mb-1 text-xl font-bold text-[#FFFFFF]\">\n {item?.title}\n </p>\n <h3 className=\"desktop:text-lg text-sm font-medium text-[#FFFFFF]\">{item?.subTitle}</h3>\n </div>\n <Button\n size=\"sm\"\n hoverEffect=\"slide\"\n variant=\"secondary\"\n onClick={() => event?.primaryButton?.onClick?.(item)}\n className={cn(\n 'desktop:text-base mb-1.5 overflow-hidden border-[#FFFFFF] bg-transparent text-sm font-bold text-[#FFFFFF]',\n shape === 'round' ? 'rounded-2xl' : ''\n )}\n >\n {primaryButton}\n </Button>\n </div>\n ) : null}\n </div>\n )\n })}\n </div>\n )\n}\n\nexport default AccordionCards\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAyFY,IAAAI,EAAA,6BAxFZC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAAmB,yCACnBC,EAA4C,iBAG5C,SAASC,GAAiB,CACxB,KAAM,CAACC,EAAOC,CAAQ,KAAI,YAAS,QAAQ,YAAc,CAAC,EAC1D,sBAAU,IAAM,CACd,MAAMC,EAAW,IAAMD,EAAS,QAAQ,YAAc,CAAC,EACvD,eAAQ,iBAAiB,SAAUC,CAAQ,EACpC,IAAM,QAAQ,oBAAoB,SAAUA,CAAQ,CAC7D,EAAG,CAAC,CAAC,EACEF,GAAS,GAClB,CA0BA,MAAMG,EAAiB,CAAC,CACtB,SAAAC,EAAW,CAAC,EACZ,UAAAC,EAAY,GACZ,MAAAC,EAAQ,SACR,UAAAC,EAAY,SACZ,MAAAC,EACA,cAAAC,EAAgB,EAClB,IAA0B,CACxB,MAAMC,EAAWX,EAAe,EAC1B,CAACY,EAAYC,CAAa,KAAI,YAAwB,IAAI,EAC1D,CAACC,EAAcC,CAAe,KAAI,YAAqC,CAAC,CAAC,EAEzEC,KAAe,UAAyB,CAAC,CAAC,EAC1CC,KAAW,UAAmC,CAAC,CAAC,EAChDC,KAAW,UAAmC,CAAC,CAAC,EAEhDC,EAAS,CAACC,EAAeC,IAAuB,CAChDA,IACFL,EAAa,QAAQI,CAAK,EAAIC,EAElC,EAEMC,EAAuBF,GAAkB,CAC7C,GAAIF,EAAS,UAAUE,CAAK,EAAG,CAC7B,MAAMG,EAAU,CAAE,GAAGN,EAAS,QAAS,CAACG,CAAK,EAAG,EAAK,EACrDL,EAAgBQ,CAAO,EACvBN,EAAS,QAAUM,CACrB,CACF,EAeA,SAbA,aAAU,IAAM,CACd,MAAMC,EAAUR,EAAa,QAC7B,OAAAQ,GAAS,QAAQ,CAACC,EAAML,IAAU,CAChCK,EAAK,iBAAiB,gBAAiB,IAAMH,EAAoBF,CAAK,CAAC,CACzE,CAAC,EACM,IAAM,CACXI,GAAS,QAAQ,CAACC,EAAML,IAAU,CAChCK,EAAK,oBAAoB,gBAAiB,IAAMH,EAAoBF,CAAK,CAAC,CAC5E,CAAC,CACH,CACF,EAAG,CAAC,CAAC,EAGDT,KAEA,OAAC,OAAI,aAAW,MAAG,8CAA+CL,CAAS,EACxE,SAAAD,GAAU,IAAI,CAACoB,EAAMC,OACpB,OAAC,OAAc,UAAU,kFACvB,mBAAC,EAAAC,QAAA,CAAQ,UAAU,6DAA6D,OAAQF,GAAM,IAAK,GAD3FC,CAEV,CACD,EACH,KAMF,OAAC,OAAI,aAAW,MAAG,iFAAkFpB,CAAS,EAC3G,SAAAD,GAAU,IAAI,CAACoB,EAAMC,IAAQ,CAC5B,MAAME,EAAahB,IAAec,EAElC,SACE,QAAC,OAEC,MAAO,CACL,KALYE,EAAa,EAAI,EAM7B,WAAY,sBACd,EACA,IAAKP,GAAMA,GAAMF,EAAOO,EAAKL,CAAE,EAC/B,aAAW,MAAG,0CAA2Cb,IAAc,QAAU,cAAgB,EAAE,EACnG,aAAc,IAAM,CAClBK,EAAca,CAAG,EACjBR,EAAS,QAAQQ,CAAG,EAAI,EAC1B,EACA,aAAc,IAAM,CAClBb,EAAc,IAAI,EAClB,MAAMU,EAAU,CAAE,GAAGN,EAAS,QAAS,CAACS,CAAG,EAAG,EAAM,EACpDX,EAAgBQ,CAAO,EACvBN,EAAS,QAAUM,EACnBL,EAAS,QAAQQ,CAAG,EAAI,EAC1B,EAEA,oBAAC,EAAAC,QAAA,CAAQ,OAAQF,GAAM,IAAK,UAAU,6DAA6D,EAClGX,IAAeY,CAAG,KACjB,QAAC,OACC,aAAW,MACT,uFACA,2CACAE,EAAa,cAAgB,WAC/B,EAEA,qBAAC,OAAI,UAAU,8BACb,oBAAC,KAAE,UAAU,4EACV,SAAAH,GAAM,MACT,KACA,OAAC,MAAG,UAAU,qDAAsD,SAAAA,GAAM,SAAS,GACrF,KACA,OAAC,EAAAI,QAAA,CACC,KAAK,KACL,YAAY,QACZ,QAAQ,YACR,QAAS,IAAMpB,GAAO,eAAe,UAAUgB,CAAI,EACnD,aAAW,MACT,4GACAlB,IAAU,QAAU,cAAgB,EACtC,EAEC,SAAAG,EACH,GACF,EACE,OA/CCgB,CAgDP,CAEJ,CAAC,EACH,CAEJ,EAEA,IAAOjC,EAAQW",
6
6
  "names": ["AccordionCards_exports", "__export", "AccordionCards_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_picture", "import_button", "import_react", "useWindowWidth", "width", "setWidth", "onResize", "AccordionCards", "products", "className", "shape", "itemShape", "event", "primaryButton", "isMobile", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "refWidth", "enterRef", "getRef", "index", "el", "handleTransitionEnd", "current", "element", "item", "idx", "Picture", "isExpanded", "Button"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var x=Object.create;var i=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,v=Object.prototype.hasOwnProperty;var b=(e,t)=>{for(var o in t)i(e,o,{get:t[o],enumerable:!0})},l=(e,t,o,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of u(t))!v.call(e,p)&&p!==o&&i(e,p,{get:()=>t[p],enumerable:!(s=g(t,p))||s.enumerable});return e};var y=(e,t,o)=>(o=e!=null?x(f(e)):{},l(t||!e||!e.__esModule?i(o,"default",{value:e,enumerable:!0}):o,e)),N=e=>l(i({},"__esModule",{value:!0}),e);var q={};b(q,{default:()=>h});module.exports=N(q);var a=require("react/jsx-runtime"),F=require("react"),r=require("../../helpers/utils.js"),n=y(require("../../components/picture.js")),d=require("../../shared/Styles.js");const k=({items:e=[],itemShape:t="square",className:o=""})=>(0,a.jsx)("div",{className:(0,r.cn)("brand-equity-wrapper w-full bg-[#F7F8F9]",o),children:(0,a.jsx)("div",{className:(0,r.cn)("grid gap-3 px-4","tablet:px-8 tablet:grid-cols-2 grid-cols-1","laptop:gap-4 laptop:px-[140px] laptop:grid-cols-10","desktop:px-[175px] lg-desktop:px-[268px]"),children:e.map((s,p)=>(0,a.jsxs)("div",{className:(0,r.cn)("brand-equity-item","flex flex-col bg-white p-4","desktop:p-6","desktop:gap-16 gap-12","laptop:col-span-3",{"laptop:col-span-4":[0,5,6,11].includes(p)},t==="round"?"rounded-[16px]":"rounded-none"),children:[(0,a.jsxs)("div",{className:"flex items-center justify-between gap-3",children:[(0,a.jsx)("h3",{className:"text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] 2xl:text-lg",children:s.title}),s.avatarList?.length?(0,a.jsx)("div",{className:"flex -space-x-2",children:s.avatarList.map((c,m)=>(0,a.jsx)("div",{className:(0,r.cn)("size-[30px] overflow-hidden rounded-full border-2 border-white","relative inline-block","lg-desktop:size-[36px]"),children:(0,a.jsx)(n.default,{source:c,className:"size-full object-cover"})},m))}):(0,a.jsx)("span",{className:"text-[#1D1D1F]",children:s.icon})]}),(0,a.jsx)("p",{className:"text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F] 2xl:text-2xl",children:s.description})]},p))})});var h=(0,d.withStyles)(k);
1
+ "use strict";"use client";var x=Object.create;var r=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,v=Object.prototype.hasOwnProperty;var b=(e,t)=>{for(var s in t)r(e,s,{get:t[s],enumerable:!0})},l=(e,t,s,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of u(t))!v.call(e,p)&&p!==s&&r(e,p,{get:()=>t[p],enumerable:!(o=g(t,p))||o.enumerable});return e};var y=(e,t,s)=>(s=e!=null?x(f(e)):{},l(t||!e||!e.__esModule?r(s,"default",{value:e,enumerable:!0}):s,e)),N=e=>l(r({},"__esModule",{value:!0}),e);var q={};b(q,{default:()=>h});module.exports=N(q);var a=require("react/jsx-runtime"),F=require("react"),i=require("../../helpers/utils.js"),n=y(require("../../components/picture.js")),d=require("../../shared/Styles.js");const k=({items:e=[],itemShape:t="square",className:s=""})=>(0,a.jsx)("div",{className:(0,i.cn)("brand-equity-wrapper w-full bg-[#F7F8F9]",s),children:(0,a.jsx)("div",{className:(0,i.cn)("grid gap-3 px-4","tablet:px-8 tablet:grid-cols-2 grid-cols-1","laptop:gap-4 laptop:px-[140px] laptop:grid-cols-10","desktop:px-[175px] lg-desktop:px-[268px]"),children:e.map((o,p)=>(0,a.jsxs)("div",{className:(0,i.cn)("brand-equity-item","flex flex-col bg-white p-4","desktop:p-6","desktop:gap-16 gap-12","laptop:col-span-3",{"laptop:col-span-4":[0,5,6,11].includes(p)},t==="round"?"rounded-[16px]":"rounded-none"),children:[(0,a.jsxs)("div",{className:"flex items-center justify-between gap-3",children:[(0,a.jsx)("h3",{className:"text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] 2xl:text-lg",children:o.title}),o.avatarList?.length?(0,a.jsx)("div",{className:"flex -space-x-2",children:o.avatarList.map((c,m)=>(0,a.jsx)("div",{className:(0,i.cn)("size-[30px] overflow-hidden rounded-full border-2 border-white","relative inline-block","lg-desktop:size-[36px]"),children:(0,a.jsx)(n.default,{source:c,className:"size-full object-cover"})},m))}):(0,a.jsx)("span",{className:"text-[#1D1D1F]",children:o.icon})]}),(0,a.jsx)("p",{className:"text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F] 2xl:text-2xl",children:o.description})]},p))})});var h=(0,d.withStyles)(k);
2
2
  //# sourceMappingURL=BrandEquity.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/BrandEquity/BrandEquity.tsx"],
4
- "sourcesContent": ["import React from 'react'\n\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { ComponentCommonProps } from '../../types/props.js'\n\nexport interface BrandEquityItem {\n icon?: React.ReactNode\n title: string\n description: string\n avatarList?: string[]\n}\n\nexport interface BrandEquityProps extends ComponentCommonProps {\n items: BrandEquityItem[]\n itemShape?: 'round' | 'square'\n className?: string\n theme?: 'light' | 'dark'\n}\n\nconst BrandEquity: React.FC<BrandEquityProps> = ({ items = [], itemShape = 'square', className = '' }) => {\n return (\n <div className={cn('brand-equity-wrapper w-full bg-[#F7F8F9]', className)}>\n <div\n className={cn(\n 'grid gap-3 px-4',\n 'tablet:px-8 tablet:grid-cols-2 grid-cols-1',\n 'laptop:gap-4 laptop:px-[140px] laptop:grid-cols-10',\n 'desktop:px-[175px] lg-desktop:px-[268px]'\n )}\n >\n {items.map((item, index) => (\n <div\n key={index}\n className={cn(\n 'brand-equity-item',\n 'flex flex-col bg-white p-4',\n 'desktop:p-6',\n 'desktop:gap-16 gap-12',\n 'laptop:col-span-3',\n {\n ['laptop:col-span-4']: [0, 5, 6, 11].includes(index),\n },\n itemShape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n )}\n >\n <div className=\"flex items-center justify-between gap-3\">\n <h3 className=\"text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] 2xl:text-lg\">\n {item.title}\n </h3>\n {item.avatarList?.length ? (\n <div className=\"flex -space-x-2\">\n {item.avatarList.map((avatarUrl: string, index: number) => (\n <div\n key={index}\n className={cn(\n 'size-[30px] overflow-hidden rounded-full border-2 border-white',\n 'relative inline-block',\n 'lg-desktop:size-[36px]'\n )}\n >\n <Picture source={avatarUrl} className=\"size-full object-cover\" />\n </div>\n ))}\n </div>\n ) : (\n <span className=\"text-[#1D1D1F]\">{item.icon}</span>\n )}\n </div>\n <p className=\"text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F] 2xl:text-2xl\">\n {item.description}\n </p>\n </div>\n ))}\n </div>\n </div>\n )\n}\n\nexport default withStyles(BrandEquity)\n"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA+CY,IAAAI,EAAA,6BA/CZC,EAAkB,iBAElBC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAA2B,kCAiB3B,MAAMC,EAA0C,CAAC,CAAE,MAAAC,EAAQ,CAAC,EAAG,UAAAC,EAAY,SAAU,UAAAC,EAAY,EAAG,OAEhG,OAAC,OAAI,aAAW,MAAG,2CAA4CA,CAAS,EACtE,mBAAC,OACC,aAAW,MACT,kBACA,6CACA,qDACA,0CACF,EAEC,SAAAF,EAAM,IAAI,CAACG,EAAMC,OAChB,QAAC,OAEC,aAAW,MACT,oBACA,6BACA,cACA,wBACA,oBACA,CACG,oBAAsB,CAAC,EAAG,EAAG,EAAG,EAAE,EAAE,SAASA,CAAK,CACrD,EACAH,IAAc,QAAU,iBAAmB,cAC7C,EAEA,qBAAC,OAAI,UAAU,0CACb,oBAAC,MAAG,UAAU,oFACX,SAAAE,EAAK,MACR,EACCA,EAAK,YAAY,UAChB,OAAC,OAAI,UAAU,kBACZ,SAAAA,EAAK,WAAW,IAAI,CAACE,EAAmBD,OACvC,OAAC,OAEC,aAAW,MACT,iEACA,wBACA,wBACF,EAEA,mBAAC,EAAAE,QAAA,CAAQ,OAAQD,EAAW,UAAU,yBAAyB,GAP1DD,CAQP,CACD,EACH,KAEA,OAAC,QAAK,UAAU,iBAAkB,SAAAD,EAAK,KAAK,GAEhD,KACA,OAAC,KAAE,UAAU,iFACV,SAAAA,EAAK,YACR,IAtCKC,CAuCP,CACD,EACH,EACF,EAIJ,IAAOZ,KAAQ,cAAWO,CAAW",
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\n\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { ComponentCommonProps } from '../../types/props.js'\n\nexport interface BrandEquityItem {\n icon?: React.ReactNode\n title: string\n description: string\n avatarList?: string[]\n}\n\nexport interface BrandEquityProps extends ComponentCommonProps {\n items: BrandEquityItem[]\n itemShape?: 'round' | 'square'\n className?: string\n theme?: 'light' | 'dark'\n}\n\nconst BrandEquity: React.FC<BrandEquityProps> = ({ items = [], itemShape = 'square', className = '' }) => {\n return (\n <div className={cn('brand-equity-wrapper w-full bg-[#F7F8F9]', className)}>\n <div\n className={cn(\n 'grid gap-3 px-4',\n 'tablet:px-8 tablet:grid-cols-2 grid-cols-1',\n 'laptop:gap-4 laptop:px-[140px] laptop:grid-cols-10',\n 'desktop:px-[175px] lg-desktop:px-[268px]'\n )}\n >\n {items.map((item, index) => (\n <div\n key={index}\n className={cn(\n 'brand-equity-item',\n 'flex flex-col bg-white p-4',\n 'desktop:p-6',\n 'desktop:gap-16 gap-12',\n 'laptop:col-span-3',\n {\n ['laptop:col-span-4']: [0, 5, 6, 11].includes(index),\n },\n itemShape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n )}\n >\n <div className=\"flex items-center justify-between gap-3\">\n <h3 className=\"text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] 2xl:text-lg\">\n {item.title}\n </h3>\n {item.avatarList?.length ? (\n <div className=\"flex -space-x-2\">\n {item.avatarList.map((avatarUrl: string, index: number) => (\n <div\n key={index}\n className={cn(\n 'size-[30px] overflow-hidden rounded-full border-2 border-white',\n 'relative inline-block',\n 'lg-desktop:size-[36px]'\n )}\n >\n <Picture source={avatarUrl} className=\"size-full object-cover\" />\n </div>\n ))}\n </div>\n ) : (\n <span className=\"text-[#1D1D1F]\">{item.icon}</span>\n )}\n </div>\n <p className=\"text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F] 2xl:text-2xl\">\n {item.description}\n </p>\n </div>\n ))}\n </div>\n </div>\n )\n}\n\nexport default withStyles(BrandEquity)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAgDY,IAAAI,EAAA,6BA/CZC,EAAkB,iBAElBC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAA2B,kCAiB3B,MAAMC,EAA0C,CAAC,CAAE,MAAAC,EAAQ,CAAC,EAAG,UAAAC,EAAY,SAAU,UAAAC,EAAY,EAAG,OAEhG,OAAC,OAAI,aAAW,MAAG,2CAA4CA,CAAS,EACtE,mBAAC,OACC,aAAW,MACT,kBACA,6CACA,qDACA,0CACF,EAEC,SAAAF,EAAM,IAAI,CAACG,EAAMC,OAChB,QAAC,OAEC,aAAW,MACT,oBACA,6BACA,cACA,wBACA,oBACA,CACG,oBAAsB,CAAC,EAAG,EAAG,EAAG,EAAE,EAAE,SAASA,CAAK,CACrD,EACAH,IAAc,QAAU,iBAAmB,cAC7C,EAEA,qBAAC,OAAI,UAAU,0CACb,oBAAC,MAAG,UAAU,oFACX,SAAAE,EAAK,MACR,EACCA,EAAK,YAAY,UAChB,OAAC,OAAI,UAAU,kBACZ,SAAAA,EAAK,WAAW,IAAI,CAACE,EAAmBD,OACvC,OAAC,OAEC,aAAW,MACT,iEACA,wBACA,wBACF,EAEA,mBAAC,EAAAE,QAAA,CAAQ,OAAQD,EAAW,UAAU,yBAAyB,GAP1DD,CAQP,CACD,EACH,KAEA,OAAC,QAAK,UAAU,iBAAkB,SAAAD,EAAK,KAAK,GAEhD,KACA,OAAC,KAAE,UAAU,iFACV,SAAAA,EAAK,YACR,IAtCKC,CAuCP,CACD,EACH,EACF,EAIJ,IAAOZ,KAAQ,cAAWO,CAAW",
6
6
  "names": ["BrandEquity_exports", "__export", "BrandEquity_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_Styles", "BrandEquity", "items", "itemShape", "className", "item", "index", "avatarUrl", "Picture"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var m=Object.create;var s=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var c=Object.getPrototypeOf,f=Object.prototype.hasOwnProperty;var g=(e,o)=>{for(var r in o)s(e,r,{get:o[r],enumerable:!0})},d=(e,o,r,p)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of x(o))!f.call(e,a)&&a!==r&&s(e,a,{get:()=>o[a],enumerable:!(p=n(o,a))||p.enumerable});return e};var u=(e,o,r)=>(r=e!=null?m(c(e)):{},d(o||!e||!e.__esModule?s(r,"default",{value:e,enumerable:!0}):r,e)),v=e=>d(s({},"__esModule",{value:!0}),e);var C={};g(C,{default:()=>y});module.exports=v(C);var t=require("react/jsx-runtime"),h=require("react"),l=require("../../helpers/utils.js"),i=u(require("../../components/picture.js"));const w=({className:e="",shape:o="square",products:r=[]})=>(0,t.jsx)(t.Fragment,{children:(0,t.jsx)("div",{className:(0,l.cn)("w-full",e),children:(0,t.jsx)("div",{className:(0,l.cn)("flex overflow-hidden"),children:(0,t.jsx)("div",{className:(0,l.cn)("w-full flex","gap-3 laptop:gap-4 overflow-x-auto overflow-y-hidden"),children:r?.map((p,a)=>(0,t.jsxs)("div",{className:(0,l.cn)("bg-[#EAEAEC] p-4 flex flex-col min-w-[167px] max-w-[167px] box-border overflow-hidden","laptop:min-w-[205px] laptop:max-w-[205px] desktop:min-w-[264px] desktop:max-w-[264px] laptop:p-6 desktop:p-8",o==="round"?"rounded-[16px]":"rounded-none"),children:[(0,t.jsx)(i.default,{className:"w-full object-cover",source:p?.img}),(0,t.jsx)("p",{className:"flex-1 text-sm text-center font-semibold desktop:text-lg",children:p?.title})]},a))})})})});var y=w;
1
+ "use strict";"use client";var m=Object.create;var s=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var c=Object.getPrototypeOf,f=Object.prototype.hasOwnProperty;var u=(e,o)=>{for(var r in o)s(e,r,{get:o[r],enumerable:!0})},d=(e,o,r,p)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of x(o))!f.call(e,a)&&a!==r&&s(e,a,{get:()=>o[a],enumerable:!(p=n(o,a))||p.enumerable});return e};var g=(e,o,r)=>(r=e!=null?m(c(e)):{},d(o||!e||!e.__esModule?s(r,"default",{value:e,enumerable:!0}):r,e)),v=e=>d(s({},"__esModule",{value:!0}),e);var C={};u(C,{default:()=>y});module.exports=v(C);var t=require("react/jsx-runtime"),h=require("react"),l=require("../../helpers/utils.js"),i=g(require("../../components/picture.js"));const w=({className:e="",shape:o="square",products:r=[]})=>(0,t.jsx)(t.Fragment,{children:(0,t.jsx)("div",{className:(0,l.cn)("w-full",e),children:(0,t.jsx)("div",{className:(0,l.cn)("flex overflow-hidden"),children:(0,t.jsx)("div",{className:(0,l.cn)("flex w-full","laptop:gap-4 gap-3 overflow-x-auto overflow-y-hidden"),children:r?.map((p,a)=>(0,t.jsxs)("div",{className:(0,l.cn)("box-border flex min-w-[167px] max-w-[167px] flex-col overflow-hidden bg-[#EAEAEC] p-4","laptop:min-w-[205px] laptop:max-w-[205px] desktop:min-w-[264px] desktop:max-w-[264px] laptop:p-6 desktop:p-8",o==="round"?"rounded-[16px]":"rounded-none"),children:[(0,t.jsx)(i.default,{className:"w-full object-cover",source:p?.img}),(0,t.jsx)("p",{className:"desktop:text-lg flex-1 text-center text-sm font-semibold",children:p?.title})]},a))})})})});var y=w;
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": ["import React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\n\nexport interface CategoryItem {\n /** \u4EA7\u54C1\u56FE\u7247*/\n img: string\n title: string\n}\n\nexport interface CategoryProps {\n products: CategoryItem[]\n className?: string\n /** \u4E3B\u9898\u8272*/\n theme?: 'light' | 'dark'\n /** \u5361\u7247\u5F62\u72B6 */\n shape?: 'round' | 'square'\n}\n\nconst Category: React.FC<CategoryProps> = ({\n className = '',\n shape = 'square',\n products = [],\n}) => {\n return (\n <>\n <div className={cn('w-full', className)}>\n <div className={cn('flex overflow-hidden')}>\n <div className={cn('w-full flex', 'gap-3 laptop:gap-4 overflow-x-auto overflow-y-hidden')}>\n {products?.map((item, index) => {\n return (\n <div\n key={index}\n className={cn(\n 'bg-[#EAEAEC] p-4 flex flex-col min-w-[167px] max-w-[167px] box-border overflow-hidden',\n 'laptop:min-w-[205px] laptop:max-w-[205px] desktop:min-w-[264px] desktop:max-w-[264px] laptop:p-6 desktop:p-8',\n shape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n )}\n >\n <Picture\n className=\"w-full object-cover\"\n source={item?.img}\n />\n <p className=\"flex-1 text-sm text-center font-semibold desktop:text-lg\">\n {item?.title}\n </p>\n </div>\n )\n })}\n </div>\n </div>\n </div>\n </>\n )\n}\n\nexport default Category\n"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAyBI,IAAAI,EAAA,6BAzBJC,EAAkB,iBAClBC,EAAmB,kCACnBC,EAAoB,0CAiBpB,MAAMC,EAAoC,CAAC,CACzC,UAAAC,EAAY,GACZ,MAAAC,EAAQ,SACR,SAAAC,EAAW,CAAC,CACd,OAEI,mBACE,mBAAC,OAAI,aAAW,MAAG,SAAUF,CAAS,EACpC,mBAAC,OAAI,aAAW,MAAG,sBAAsB,EACvC,mBAAC,OAAI,aAAW,MAAG,cAAe,sDAAsD,EACrF,SAAAE,GAAU,IAAI,CAACC,EAAMC,OAElB,QAAC,OAEC,aAAW,MACT,wFACA,+GACAH,IAAU,QAAU,iBAAmB,cACzC,EAEA,oBAAC,EAAAI,QAAA,CACC,UAAU,sBACV,OAAQF,GAAM,IAChB,KACA,OAAC,KAAE,UAAU,2DACV,SAAAA,GAAM,MACT,IAbKC,CAcP,CAEH,EACH,EACF,EACF,EACF,EAIJ,IAAOX,EAAQM",
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\n\nexport interface CategoryItem {\n /** \u4EA7\u54C1\u56FE\u7247*/\n img: string\n title: string\n}\n\nexport interface CategoryProps {\n products: CategoryItem[]\n className?: string\n /** \u4E3B\u9898\u8272*/\n theme?: 'light' | 'dark'\n /** \u5361\u7247\u5F62\u72B6 */\n shape?: 'round' | 'square'\n}\n\nconst Category: React.FC<CategoryProps> = ({ className = '', shape = 'square', products = [] }) => {\n return (\n <>\n <div className={cn('w-full', className)}>\n <div className={cn('flex overflow-hidden')}>\n <div className={cn('flex w-full', 'laptop:gap-4 gap-3 overflow-x-auto overflow-y-hidden')}>\n {products?.map((item, index) => {\n return (\n <div\n key={index}\n className={cn(\n 'box-border flex min-w-[167px] max-w-[167px] flex-col overflow-hidden bg-[#EAEAEC] p-4',\n 'laptop:min-w-[205px] laptop:max-w-[205px] desktop:min-w-[264px] desktop:max-w-[264px] laptop:p-6 desktop:p-8',\n shape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n )}\n >\n <Picture className=\"w-full object-cover\" source={item?.img} />\n <p className=\"desktop:text-lg flex-1 text-center text-sm font-semibold\">{item?.title}</p>\n </div>\n )\n })}\n </div>\n </div>\n </div>\n </>\n )\n}\n\nexport default Category\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsBI,IAAAI,EAAA,6BArBJC,EAAkB,iBAClBC,EAAmB,kCACnBC,EAAoB,0CAiBpB,MAAMC,EAAoC,CAAC,CAAE,UAAAC,EAAY,GAAI,MAAAC,EAAQ,SAAU,SAAAC,EAAW,CAAC,CAAE,OAEzF,mBACE,mBAAC,OAAI,aAAW,MAAG,SAAUF,CAAS,EACpC,mBAAC,OAAI,aAAW,MAAG,sBAAsB,EACvC,mBAAC,OAAI,aAAW,MAAG,cAAe,sDAAsD,EACrF,SAAAE,GAAU,IAAI,CAACC,EAAMC,OAElB,QAAC,OAEC,aAAW,MACT,wFACA,+GACAH,IAAU,QAAU,iBAAmB,cACzC,EAEA,oBAAC,EAAAI,QAAA,CAAQ,UAAU,sBAAsB,OAAQF,GAAM,IAAK,KAC5D,OAAC,KAAE,UAAU,2DAA4D,SAAAA,GAAM,MAAM,IARhFC,CASP,CAEH,EACH,EACF,EACF,EACF,EAIJ,IAAOX,EAAQM",
6
6
  "names": ["Category_exports", "__export", "Category_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "Category", "className", "shape", "products", "item", "index", "Picture"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var c=Object.create;var d=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var g=(t,l)=>{for(var s in l)d(t,s,{get:l[s],enumerable:!0})},p=(t,l,s,i)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of x(l))!w.call(t,a)&&a!==s&&d(t,a,{get:()=>l[a],enumerable:!(i=f(l,a))||i.enumerable});return t};var b=(t,l,s)=>(s=t!=null?c(u(t)):{},p(l||!t||!t.__esModule?d(s,"default",{value:t,enumerable:!0}):s,t)),N=t=>p(d({},"__esModule",{value:!0}),t);var C={};g(C,{default:()=>k});module.exports=N(C);var e=require("react/jsx-runtime"),E=require("react"),r=require("../../helpers/utils.js"),n=b(require("../../components/picture.js")),o=require("../../components/avatar.js");const h=({className:t="",shape:l="square",products:s=[]})=>{const i=a=>a?Array.from(new Array(Number(a)))||[]:[];return(0,e.jsx)(e.Fragment,{children:(0,e.jsx)("div",{className:(0,r.cn)("w-full",t),children:(0,e.jsx)("div",{className:(0,r.cn)("flex overflow-hidden"),children:(0,e.jsx)("div",{className:(0,r.cn)("w-full flex","gap-3 laptop:gap-4 overflow-x-auto overflow-y-hidden"),children:s?.map((a,m)=>(0,e.jsxs)("div",{className:(0,r.cn)("bg-[#EAEAEC] p-4 flex flex-col min-w-[288px] max-w-[288px] box-border overflow-hidden","laptop:min-w-[316px] laptop:max-w-[316px] desktop:min-w-[404px] desktop:max-w-[404px] desktop:pt-4 desktop:px-6 desktop:pb-6",l==="round"?"rounded-2xl":"rounded-none"),children:[(0,e.jsxs)("div",{className:(0,r.cn)("mb-8 w-full flex justify-between laptop:mb-11 desktop:mb-16"),children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)("h4",{className:"text-sm font-semibold laptop:text-lg",children:a?.title}),(0,e.jsx)("div",{className:"mt-1 flex items-center",children:i(a?.rating)?.map?.((L,v)=>(0,e.jsx)("div",{className:"mr-1",children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:(0,e.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"})})},v))})]}),(0,e.jsx)("div",{className:"size-10 overflow-hidden desktop:size-12",children:(0,e.jsxs)(o.Avatar,{className:"w-full h-full",children:[(0,e.jsx)(o.AvatarImage,{src:a?.avatar}),(0,e.jsx)(o.AvatarFallback,{children:a?.title})]})})]}),(0,e.jsx)("p",{className:"flex-1 line-clamp-6 font-bold text-xl text-[#1D1D1F] desktop:text-2xl",children:a?.description||""}),(0,e.jsxs)("div",{className:(0,r.cn)("mt-11 p-3 flex items-center bg-[#F7F8F9] overflow-hidden",l==="round"?"rounded-[8px]":"rounded-none"),children:[(0,e.jsx)("div",{className:"flex items-center mr-3 size-12 laptop:size-16 desktop:size-20",children:(0,e.jsx)(n.default,{className:"w-full object-cover",source:a?.img})}),(0,e.jsx)("p",{className:"flex-1 text-sm font-semibold line-clamp-2 desktop:text-lg",children:a?.subTitle||""})]})]},m))})})})})};var k=h;
1
+ "use strict";"use client";var c=Object.create;var d=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var w=(t,l)=>{for(var s in l)d(t,s,{get:l[s],enumerable:!0})},p=(t,l,s,o)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of f(l))!g.call(t,a)&&a!==s&&d(t,a,{get:()=>l[a],enumerable:!(o=x(l,a))||o.enumerable});return t};var b=(t,l,s)=>(s=t!=null?c(u(t)):{},p(l||!t||!t.__esModule?d(s,"default",{value:t,enumerable:!0}):s,t)),N=t=>p(d({},"__esModule",{value:!0}),t);var C={};w(C,{default:()=>k});module.exports=N(C);var e=require("react/jsx-runtime"),E=require("react"),r=require("../../helpers/utils.js"),n=b(require("../../components/picture.js")),i=require("../../components/avatar.js");const h=({className:t="",shape:l="square",products:s=[]})=>{const o=a=>a?Array.from(new Array(Number(a)))||[]:[];return(0,e.jsx)(e.Fragment,{children:(0,e.jsx)("div",{className:(0,r.cn)("w-full",t),children:(0,e.jsx)("div",{className:(0,r.cn)("flex overflow-hidden"),children:(0,e.jsx)("div",{className:(0,r.cn)("flex w-full","laptop:gap-4 gap-3 overflow-x-auto overflow-y-hidden"),children:s?.map((a,m)=>(0,e.jsxs)("div",{className:(0,r.cn)("box-border flex min-w-[288px] max-w-[288px] flex-col overflow-hidden bg-[#EAEAEC] p-4","laptop:min-w-[316px] laptop:max-w-[316px] desktop:min-w-[404px] desktop:max-w-[404px] desktop:pt-4 desktop:px-6 desktop:pb-6",l==="round"?"rounded-2xl":"rounded-none"),children:[(0,e.jsxs)("div",{className:(0,r.cn)("laptop:mb-11 desktop:mb-16 mb-8 flex w-full justify-between"),children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)("h4",{className:"laptop:text-lg text-sm font-semibold",children:a?.title}),(0,e.jsx)("div",{className:"mt-1 flex items-center",children:o(a?.rating)?.map?.((L,v)=>(0,e.jsx)("div",{className:"mr-1",children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:(0,e.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"})})},v))})]}),(0,e.jsx)("div",{className:"desktop:size-12 size-10 overflow-hidden",children:(0,e.jsxs)(i.Avatar,{className:"size-full",children:[(0,e.jsx)(i.AvatarImage,{src:a?.avatar}),(0,e.jsx)(i.AvatarFallback,{children:a?.title})]})})]}),(0,e.jsx)("p",{className:"desktop:text-2xl line-clamp-6 flex-1 text-xl font-bold text-[#1D1D1F]",children:a?.description||""}),(0,e.jsxs)("div",{className:(0,r.cn)("mt-11 flex items-center overflow-hidden bg-[#F7F8F9] p-3",l==="round"?"rounded-[8px]":"rounded-none"),children:[(0,e.jsx)("div",{className:"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center",children:(0,e.jsx)(n.default,{className:"w-full object-cover",source:a?.img})}),(0,e.jsx)("p",{className:"desktop:text-lg line-clamp-2 flex-1 text-sm font-semibold",children:a?.subTitle||""})]})]},m))})})})})};var k=h;
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": ["import React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Avatar, AvatarImage, AvatarFallback } from '../../components/avatar.js'\n\nexport interface EvaluateItem {\n /** \u4EA7\u54C1\u56FE\u7247*/\n img: string\n title: string\n subTitle: string\n description: string\n avatar?: string\n rating: number\n}\n\nexport interface EvaluateProps {\n products: EvaluateItem[]\n className?: string\n /** \u4E3B\u9898\u8272*/\n theme?: 'light' | 'dark'\n /** \u5F62\u72B6 */\n shape?: 'round' | 'square'\n}\n\nconst Evaluate: React.FC<EvaluateProps> = ({\n className = '',\n shape = 'square',\n products = [],\n}) => {\n\n const handleRating = (num: number) => {\n if (num) {\n return Array.from(new Array(Number(num))) || []\n }\n return []\n }\n\n return (\n <>\n <div className={cn('w-full', className)}>\n <div className={cn('flex overflow-hidden')}>\n <div className={cn('w-full flex', 'gap-3 laptop:gap-4 overflow-x-auto overflow-y-hidden')}>\n {products?.map((item, index) => {\n return (\n <div\n key={index}\n className={cn(\n 'bg-[#EAEAEC] p-4 flex flex-col min-w-[288px] max-w-[288px] box-border overflow-hidden',\n 'laptop:min-w-[316px] laptop:max-w-[316px] desktop:min-w-[404px] desktop:max-w-[404px] desktop:pt-4 desktop:px-6 desktop:pb-6',\n shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n )}\n >\n <div className={cn('mb-8 w-full flex justify-between laptop:mb-11 desktop:mb-16')}>\n <div className=\"flex-1\">\n <h4 className=\"text-sm font-semibold laptop:text-lg\">{item?.title}</h4>\n <div className=\"mt-1 flex items-center\">\n {\n handleRating(item?.rating)?.map?.((_, index) => {\n return <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=\"size-10 overflow-hidden desktop:size-12\">\n <Avatar className=\"w-full h-full\">\n <AvatarImage src={item?.avatar} />\n <AvatarFallback>{item?.title}</AvatarFallback>\n </Avatar>\n </div>\n </div>\n <p className=\"flex-1 line-clamp-6 font-bold text-xl text-[#1D1D1F] desktop:text-2xl\">\n {item?.description || ''}\n </p>\n <div className={cn('mt-11 p-3 flex items-center bg-[#F7F8F9] overflow-hidden', shape === 'round' ? 'rounded-[8px]' : 'rounded-none')}>\n <div className=\"flex items-center mr-3 size-12 laptop:size-16 desktop:size-20\">\n <Picture\n className=\"w-full object-cover\"\n source={item?.img}\n />\n </div>\n <p className=\"flex-1 text-sm font-semibold line-clamp-2 desktop:text-lg\">\n {item?.subTitle || ''}\n </p>\n </div>\n </div>\n )\n })}\n </div>\n </div>\n </div>\n </>\n )\n}\n\nexport default Evaluate\n"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsCI,IAAAI,EAAA,6BAtCJC,EAAkB,iBAClBC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAAoD,sCAqBpD,MAAMC,EAAoC,CAAC,CACzC,UAAAC,EAAY,GACZ,MAAAC,EAAQ,SACR,SAAAC,EAAW,CAAC,CACd,IAAM,CAEJ,MAAMC,EAAgBC,GAChBA,EACK,MAAM,KAAK,IAAI,MAAM,OAAOA,CAAG,CAAC,CAAC,GAAK,CAAC,EAEzC,CAAC,EAGV,SACE,mBACE,mBAAC,OAAI,aAAW,MAAG,SAAUJ,CAAS,EACpC,mBAAC,OAAI,aAAW,MAAG,sBAAsB,EACvC,mBAAC,OAAI,aAAW,MAAG,cAAe,sDAAsD,EACrF,SAAAE,GAAU,IAAI,CAACG,EAAMC,OAElB,QAAC,OAEC,aAAW,MACT,wFACA,+HACAL,IAAU,QAAU,cAAgB,cACtC,EAEA,qBAAC,OAAI,aAAW,MAAG,6DAA6D,EAC9E,qBAAC,OAAI,UAAU,SACb,oBAAC,MAAG,UAAU,uCAAwC,SAAAI,GAAM,MAAM,KAClE,OAAC,OAAI,UAAU,yBAEb,SAAAF,EAAaE,GAAM,MAAM,GAAG,MAAM,CAACE,EAAGD,OAC7B,OAAC,OAAgB,UAAU,OAChC,mBAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,mBAAC,QACC,EAAE,6oBACF,KAAK,UACP,EACF,GANeA,CAOjB,CACD,EAEH,GACF,KACA,OAAC,OAAI,UAAU,0CACb,oBAAC,UAAO,UAAU,gBAChB,oBAAC,eAAY,IAAKD,GAAM,OAAQ,KAChC,OAAC,kBAAgB,SAAAA,GAAM,MAAM,GAC/B,EACF,GACF,KACA,OAAC,KAAE,UAAU,wEACV,SAAAA,GAAM,aAAe,GACxB,KACA,QAAC,OAAI,aAAW,MAAG,2DAA4DJ,IAAU,QAAU,gBAAkB,cAAc,EACjI,oBAAC,OAAI,UAAU,gEACb,mBAAC,EAAAO,QAAA,CACC,UAAU,sBACV,OAAQH,GAAM,IAChB,EACF,KACA,OAAC,KAAE,UAAU,4DACV,SAAAA,GAAM,UAAY,GACrB,GACF,IA7CKC,CA8CP,CAEH,EACH,EACF,EACF,EACF,CAEJ,EAEA,IAAOd,EAAQO",
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Avatar, AvatarImage, AvatarFallback } from '../../components/avatar.js'\n\nexport interface EvaluateItem {\n /** \u4EA7\u54C1\u56FE\u7247*/\n img: string\n title: string\n subTitle: string\n description: string\n avatar?: string\n rating: number\n}\n\nexport interface EvaluateProps {\n products: EvaluateItem[]\n className?: string\n /** \u4E3B\u9898\u8272*/\n theme?: 'light' | 'dark'\n /** \u5F62\u72B6 */\n shape?: 'round' | 'square'\n}\n\nconst Evaluate: React.FC<EvaluateProps> = ({ className = '', shape = 'square', products = [] }) => {\n const handleRating = (num: number) => {\n if (num) {\n return Array.from(new Array(Number(num))) || []\n }\n return []\n }\n\n return (\n <>\n <div className={cn('w-full', className)}>\n <div className={cn('flex overflow-hidden')}>\n <div className={cn('flex w-full', 'laptop:gap-4 gap-3 overflow-x-auto overflow-y-hidden')}>\n {products?.map((item, index) => {\n return (\n <div\n key={index}\n className={cn(\n 'box-border flex min-w-[288px] max-w-[288px] flex-col overflow-hidden bg-[#EAEAEC] p-4',\n 'laptop:min-w-[316px] laptop:max-w-[316px] desktop:min-w-[404px] desktop:max-w-[404px] desktop:pt-4 desktop:px-6 desktop:pb-6',\n shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n )}\n >\n <div className={cn('laptop:mb-11 desktop:mb-16 mb-8 flex w-full justify-between')}>\n <div className=\"flex-1\">\n <h4 className=\"laptop:text-lg text-sm font-semibold\">{item?.title}</h4>\n <div className=\"mt-1 flex items-center\">\n {handleRating(item?.rating)?.map?.((_, index) => {\n return (\n <div key={index} className=\"mr-1\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\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\">\n <AvatarImage src={item?.avatar} />\n <AvatarFallback>{item?.title}</AvatarFallback>\n </Avatar>\n </div>\n </div>\n <p className=\"desktop:text-2xl line-clamp-6 flex-1 text-xl font-bold text-[#1D1D1F]\">\n {item?.description || ''}\n </p>\n <div\n className={cn(\n 'mt-11 flex items-center overflow-hidden bg-[#F7F8F9] p-3',\n shape === 'round' ? 'rounded-[8px]' : '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={item?.img} />\n </div>\n <p className=\"desktop:text-lg line-clamp-2 flex-1 text-sm font-semibold\">{item?.subTitle || ''}</p>\n </div>\n </div>\n )\n })}\n </div>\n </div>\n </div>\n </>\n )\n}\n\nexport default Evaluate\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAkCI,IAAAI,EAAA,6BAjCJC,EAAkB,iBAClBC,EAAmB,kCACnBC,EAAoB,0CACpBC,EAAoD,sCAqBpD,MAAMC,EAAoC,CAAC,CAAE,UAAAC,EAAY,GAAI,MAAAC,EAAQ,SAAU,SAAAC,EAAW,CAAC,CAAE,IAAM,CACjG,MAAMC,EAAgBC,GAChBA,EACK,MAAM,KAAK,IAAI,MAAM,OAAOA,CAAG,CAAC,CAAC,GAAK,CAAC,EAEzC,CAAC,EAGV,SACE,mBACE,mBAAC,OAAI,aAAW,MAAG,SAAUJ,CAAS,EACpC,mBAAC,OAAI,aAAW,MAAG,sBAAsB,EACvC,mBAAC,OAAI,aAAW,MAAG,cAAe,sDAAsD,EACrF,SAAAE,GAAU,IAAI,CAACG,EAAMC,OAElB,QAAC,OAEC,aAAW,MACT,wFACA,+HACAL,IAAU,QAAU,cAAgB,cACtC,EAEA,qBAAC,OAAI,aAAW,MAAG,6DAA6D,EAC9E,qBAAC,OAAI,UAAU,SACb,oBAAC,MAAG,UAAU,uCAAwC,SAAAI,GAAM,MAAM,KAClE,OAAC,OAAI,UAAU,yBACZ,SAAAF,EAAaE,GAAM,MAAM,GAAG,MAAM,CAACE,EAAGD,OAEnC,OAAC,OAAgB,UAAU,OACzB,mBAAC,OACC,MAAM,6BACN,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,mBAAC,QACC,EAAE,6oBACF,KAAK,UACP,EACF,GAZQA,CAaV,CAEH,EACH,GACF,KACA,OAAC,OAAI,UAAU,0CACb,oBAAC,UAAO,UAAU,YAChB,oBAAC,eAAY,IAAKD,GAAM,OAAQ,KAChC,OAAC,kBAAgB,SAAAA,GAAM,MAAM,GAC/B,EACF,GACF,KACA,OAAC,KAAE,UAAU,wEACV,SAAAA,GAAM,aAAe,GACxB,KACA,QAAC,OACC,aAAW,MACT,2DACAJ,IAAU,QAAU,gBAAkB,cACxC,EAEA,oBAAC,OAAI,UAAU,gEACb,mBAAC,EAAAO,QAAA,CAAQ,UAAU,sBAAsB,OAAQH,GAAM,IAAK,EAC9D,KACA,OAAC,KAAE,UAAU,4DAA6D,SAAAA,GAAM,UAAY,GAAG,GACjG,IAnDKC,CAoDP,CAEH,EACH,EACF,EACF,EACF,CAEJ,EAEA,IAAOd,EAAQO",
6
6
  "names": ["Evaluate_exports", "__export", "Evaluate_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_avatar", "Evaluate", "className", "shape", "products", "handleRating", "num", "item", "index", "_", "Picture"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var b=Object.create;var x=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var v=(t,e)=>{for(var s in e)x(t,s,{get:e[s],enumerable:!0})},f=(t,e,s,m)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of k(e))!N.call(t,a)&&a!==s&&x(t,a,{get:()=>e[a],enumerable:!(m=C(e,a))||m.enumerable});return t};var G=(t,e,s)=>(s=t!=null?b(y(t)):{},f(e||!t||!t.__esModule?x(s,"default",{value:t,enumerable:!0}):s,t)),P=t=>f(x({},"__esModule",{value:!0}),t);var w={};v(w,{default:()=>S});module.exports=P(w);var l=require("react/jsx-runtime"),n=G(require("react")),c=require("../../helpers/utils.js"),g=require("../../shared/Styles.js"),r=require("../../components/index.js"),d=require("../../components/index.js");const u=n.default.forwardRef(({items:t,shape:e,className:s,...m},a)=>{const i=t?.length||0,h=(0,n.useMemo)(()=>{const p="basis-[296px]";let o="";return i===1&&(o="basis-[100%]"),i===2&&(o="tablet:basis-1/2"),i===3&&(o="laptop:basis-1/3"),i>3&&(o="laptop:basis-[288px] desktop:basis-[316px] lg-desktop:basis-[404px]"),`${p} ${o}`},[i]);return(0,l.jsx)(r.Carousel,{ref:a,opts:{align:"start"},className:(0,c.cn)("px-4 tablet:px-8 laptop:px-16",s),...m,children:(0,l.jsx)(n.default.Fragment,{children:(0,l.jsx)(r.CarouselContent,{children:t.map((p,o)=>(0,l.jsx)(r.CarouselItem,{className:(0,c.cn)("pl-3 laptop:pl-4 flex-shrink-0 h-[360px]",h),children:(0,l.jsxs)("div",{className:(0,c.cn)("relative h-full",{"rounded-xl overflow-hidden laptop:rounded-2xl":e==="round"}),children:[(0,l.jsx)(d.Picture,{className:"h-full ",imgClassName:"h-full object-cover",source:p?.imgUrl}),(0,l.jsx)("div",{className:"p-4 absolute inset-0 laptop:p-6 flex flex-col justify-end z-[1]",children:(0,l.jsx)(d.Text,{html:p?.title,style:{color:p?.textColor},className:"text-[24px] lg-desktop:text-[32px] font-bold leading-[1.2] [&_span]:font-medium desktop:text-[24px] desktop:[&_span]:text-[18px] [&_span]:text-[14px] text-lines-2"})})]})},o+p?.title))})},".0")})});u.displayName="Graphic";var S=(0,g.withStyles)(u);
1
+ "use strict";"use client";var b=Object.create;var x=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var v=(t,e)=>{for(var s in e)x(t,s,{get:e[s],enumerable:!0})},f=(t,e,s,m)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of k(e))!N.call(t,a)&&a!==s&&x(t,a,{get:()=>e[a],enumerable:!(m=C(e,a))||m.enumerable});return t};var G=(t,e,s)=>(s=t!=null?b(y(t)):{},f(e||!t||!t.__esModule?x(s,"default",{value:t,enumerable:!0}):s,t)),P=t=>f(x({},"__esModule",{value:!0}),t);var w={};v(w,{default:()=>S});module.exports=P(w);var l=require("react/jsx-runtime"),n=G(require("react")),c=require("../../helpers/utils.js"),g=require("../../shared/Styles.js"),r=require("../../components/index.js"),d=require("../../components/index.js");const u=n.default.forwardRef(({items:t,shape:e,className:s,...m},a)=>{const i=t?.length||0,h=(0,n.useMemo)(()=>{const p="basis-[296px]";let o="";return i===1&&(o="basis-[100%]"),i===2&&(o="tablet:basis-1/2"),i===3&&(o="laptop:basis-1/3"),i>3&&(o="laptop:basis-[288px] desktop:basis-[316px] lg-desktop:basis-[404px]"),`${p} ${o}`},[i]);return(0,l.jsx)(r.Carousel,{ref:a,opts:{align:"start"},className:(0,c.cn)("tablet:px-8 laptop:px-16 px-4",s),...m,children:(0,l.jsx)(n.default.Fragment,{children:(0,l.jsx)(r.CarouselContent,{children:t.map((p,o)=>(0,l.jsx)(r.CarouselItem,{className:(0,c.cn)("laptop:pl-4 h-[360px] shrink-0 pl-3",h),children:(0,l.jsxs)("div",{className:(0,c.cn)("relative h-full",{"rounded-xl overflow-hidden laptop:rounded-2xl":e==="round"}),children:[(0,l.jsx)(d.Picture,{className:"h-full ",imgClassName:"h-full object-cover",source:p?.imgUrl}),(0,l.jsx)("div",{className:"laptop:p-6 absolute inset-0 z-[1] flex flex-col justify-end p-4",children:(0,l.jsx)(d.Text,{html:p?.title,style:{color:p?.textColor},className:"lg-desktop:text-[32px] desktop:text-[24px] desktop:[&_span]:text-[18px] text-lines-2 text-[24px] font-bold leading-[1.2] [&_span]:text-[14px] [&_span]:font-medium"})})]})},o+p?.title))})},".0")})});u.displayName="Graphic";var S=(0,g.withStyles)(u);
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Graphic/index.tsx"],
4
- "sourcesContent": ["import React, { useMemo } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Carousel, CarouselContent, CarouselItem } from '../../components/index.js'\nimport { Picture, Text } from '../../components/index.js'\n\nexport interface GraphicProps {\n className?: string\n items: {\n imgUrl: string\n title: string\n textColor?: string\n }[]\n shape?: 'round' | 'square'\n}\n\nconst Graphic = React.forwardRef<HTMLDivElement, GraphicProps>(({ items, shape, className, ...props }, ref) => {\n const itemsLength = items?.length || 0\n\n const itemStyle = useMemo(() => {\n const basisStyle = 'basis-[296px]'\n let breakPointStyle = ''\n if (itemsLength === 1) {\n breakPointStyle = 'basis-[100%]'\n }\n if (itemsLength === 2) {\n breakPointStyle = 'tablet:basis-1/2'\n }\n if (itemsLength === 3) {\n breakPointStyle = 'laptop:basis-1/3'\n }\n if (itemsLength > 3) {\n breakPointStyle = 'laptop:basis-[288px] desktop:basis-[316px] lg-desktop:basis-[404px]'\n }\n return `${basisStyle} ${breakPointStyle}`\n }, [itemsLength])\n\n return (\n <Carousel\n ref={ref}\n opts={{\n align: 'start',\n }}\n className={cn('px-4 tablet:px-8 laptop:px-16', className)}\n {...props}\n >\n <React.Fragment key=\".0\">\n <CarouselContent>\n {items.map((item, index) => (\n <CarouselItem\n key={index + item?.title}\n className={cn('pl-3 laptop:pl-4 flex-shrink-0 h-[360px]', itemStyle)}\n >\n <div className={cn(\"relative h-full\", {\n ['rounded-xl overflow-hidden laptop:rounded-2xl']: shape === 'round'\n })}>\n <Picture className=\"h-full \" imgClassName=\"h-full object-cover\" source={item?.imgUrl} />\n <div className=\"p-4 absolute inset-0 laptop:p-6 flex flex-col justify-end z-[1]\">\n <Text\n html={item?.title}\n style={{\n color: item?.textColor,\n }}\n className=\"text-[24px] lg-desktop:text-[32px] font-bold leading-[1.2] [&_span]:font-medium desktop:text-[24px] desktop:[&_span]:text-[18px] [&_span]:text-[14px] text-lines-2\"\n />\n </div>\n </div>\n </CarouselItem>\n ))}\n </CarouselContent>\n </React.Fragment>\n </Carousel>\n )\n})\n\nGraphic.displayName = 'Graphic'\n\nexport default withStyles(Graphic)\n"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqDc,IAAAI,EAAA,6BArDdC,EAA+B,oBAC/BC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAwD,qCACxDA,EAA8B,qCAY9B,MAAMC,EAAU,EAAAC,QAAM,WAAyC,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAAQ,CAC7G,MAAMC,EAAcL,GAAO,QAAU,EAE/BM,KAAY,WAAQ,IAAM,CAC9B,MAAMC,EAAa,gBACnB,IAAIC,EAAkB,GACtB,OAAIH,IAAgB,IAClBG,EAAkB,gBAEhBH,IAAgB,IAClBG,EAAkB,oBAEhBH,IAAgB,IAClBG,EAAkB,oBAEhBH,EAAc,IAChBG,EAAkB,uEAEb,GAAGD,CAAU,IAAIC,CAAe,EACzC,EAAG,CAACH,CAAW,CAAC,EAEhB,SACE,OAAC,YACC,IAAKD,EACL,KAAM,CACJ,MAAO,OACT,EACA,aAAW,MAAG,gCAAiCF,CAAS,EACvD,GAAGC,EAEJ,mBAAC,EAAAJ,QAAM,SAAN,CACC,mBAAC,mBACE,SAAAC,EAAM,IAAI,CAACS,EAAMC,OAChB,OAAC,gBAEC,aAAW,MAAG,2CAA4CJ,CAAS,EAEnE,oBAAC,OAAI,aAAW,MAAG,kBAAmB,CACnC,gDAAkDL,IAAU,OAC/D,CAAC,EACC,oBAAC,WAAQ,UAAU,UAAU,aAAa,sBAAsB,OAAQQ,GAAM,OAAQ,KACtF,OAAC,OAAI,UAAU,kEACb,mBAAC,QACC,KAAMA,GAAM,MACZ,MAAO,CACL,MAAOA,GAAM,SACf,EACA,UAAU,qKACZ,EACF,GACF,GAhBKC,EAAQD,GAAM,KAiBrB,CACD,EACH,GAvBkB,IAwBpB,EACF,CAEJ,CAAC,EAEDX,EAAQ,YAAc,UAEtB,IAAOP,KAAQ,cAAWO,CAAO",
4
+ "sourcesContent": ["'use client'\nimport React, { useMemo } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Carousel, CarouselContent, CarouselItem } from '../../components/index.js'\nimport { Picture, Text } from '../../components/index.js'\n\nexport interface GraphicProps {\n className?: string\n items: {\n imgUrl: string\n title: string\n textColor?: string\n }[]\n shape?: 'round' | 'square'\n}\n\nconst Graphic = React.forwardRef<HTMLDivElement, GraphicProps>(({ items, shape, className, ...props }, ref) => {\n const itemsLength = items?.length || 0\n\n const itemStyle = useMemo(() => {\n const basisStyle = 'basis-[296px]'\n let breakPointStyle = ''\n if (itemsLength === 1) {\n breakPointStyle = 'basis-[100%]'\n }\n if (itemsLength === 2) {\n breakPointStyle = 'tablet:basis-1/2'\n }\n if (itemsLength === 3) {\n breakPointStyle = 'laptop:basis-1/3'\n }\n if (itemsLength > 3) {\n breakPointStyle = 'laptop:basis-[288px] desktop:basis-[316px] lg-desktop:basis-[404px]'\n }\n return `${basisStyle} ${breakPointStyle}`\n }, [itemsLength])\n\n return (\n <Carousel\n ref={ref}\n opts={{\n align: 'start',\n }}\n className={cn('tablet:px-8 laptop:px-16 px-4', className)}\n {...props}\n >\n <React.Fragment key=\".0\">\n <CarouselContent>\n {items.map((item, index) => (\n <CarouselItem key={index + item?.title} className={cn('laptop:pl-4 h-[360px] shrink-0 pl-3', itemStyle)}>\n <div\n className={cn('relative h-full', {\n ['rounded-xl overflow-hidden laptop:rounded-2xl']: shape === 'round',\n })}\n >\n <Picture className=\"h-full \" imgClassName=\"h-full object-cover\" source={item?.imgUrl} />\n <div className=\"laptop:p-6 absolute inset-0 z-[1] flex flex-col justify-end p-4\">\n <Text\n html={item?.title}\n style={{\n color: item?.textColor,\n }}\n className=\"lg-desktop:text-[32px] desktop:text-[24px] desktop:[&_span]:text-[18px] text-lines-2 text-[24px] font-bold leading-[1.2] [&_span]:text-[14px] [&_span]:font-medium\"\n />\n </div>\n </div>\n </CarouselItem>\n ))}\n </CarouselContent>\n </React.Fragment>\n </Carousel>\n )\n})\n\nGraphic.displayName = 'Graphic'\n\nexport default withStyles(Graphic)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmDc,IAAAI,EAAA,6BAlDdC,EAA+B,oBAC/BC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAwD,qCACxDA,EAA8B,qCAY9B,MAAMC,EAAU,EAAAC,QAAM,WAAyC,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAAQ,CAC7G,MAAMC,EAAcL,GAAO,QAAU,EAE/BM,KAAY,WAAQ,IAAM,CAC9B,MAAMC,EAAa,gBACnB,IAAIC,EAAkB,GACtB,OAAIH,IAAgB,IAClBG,EAAkB,gBAEhBH,IAAgB,IAClBG,EAAkB,oBAEhBH,IAAgB,IAClBG,EAAkB,oBAEhBH,EAAc,IAChBG,EAAkB,uEAEb,GAAGD,CAAU,IAAIC,CAAe,EACzC,EAAG,CAACH,CAAW,CAAC,EAEhB,SACE,OAAC,YACC,IAAKD,EACL,KAAM,CACJ,MAAO,OACT,EACA,aAAW,MAAG,gCAAiCF,CAAS,EACvD,GAAGC,EAEJ,mBAAC,EAAAJ,QAAM,SAAN,CACC,mBAAC,mBACE,SAAAC,EAAM,IAAI,CAACS,EAAMC,OAChB,OAAC,gBAAuC,aAAW,MAAG,sCAAuCJ,CAAS,EACpG,oBAAC,OACC,aAAW,MAAG,kBAAmB,CAC9B,gDAAkDL,IAAU,OAC/D,CAAC,EAED,oBAAC,WAAQ,UAAU,UAAU,aAAa,sBAAsB,OAAQQ,GAAM,OAAQ,KACtF,OAAC,OAAI,UAAU,kEACb,mBAAC,QACC,KAAMA,GAAM,MACZ,MAAO,CACL,MAAOA,GAAM,SACf,EACA,UAAU,qKACZ,EACF,GACF,GAhBiBC,EAAQD,GAAM,KAiBjC,CACD,EACH,GAtBkB,IAuBpB,EACF,CAEJ,CAAC,EAEDX,EAAQ,YAAc,UAEtB,IAAOP,KAAQ,cAAWO,CAAO",
6
6
  "names": ["Graphic_exports", "__export", "Graphic_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_components", "Graphic", "React", "items", "shape", "className", "props", "ref", "itemsLength", "itemStyle", "basisStyle", "breakPointStyle", "item", "index"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var u=Object.create;var m=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var H=(e,a)=>{for(var r in a)m(e,r,{get:a[r],enumerable:!0})},g=(e,a,r,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let l of D(a))!F.call(e,l)&&l!==r&&m(e,l,{get:()=>a[l],enumerable:!(i=w(a,l))||i.enumerable});return e};var z=(e,a,r)=>(r=e!=null?u(y(e)):{},g(a||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),C=e=>g(m({},"__esModule",{value:!0}),e);var P={};H(P,{default:()=>B});module.exports=C(P);var t=require("react/jsx-runtime"),p=z(require("react")),s=require("../../components/index.js"),n=require("../../helpers/index.js"),v=require("../../shared/Styles.js");const b=p.default.forwardRef(({title:e,subtitle:a,background:r,primaryButton:i,secondaryButton:l,theme:o="light",className:f,products:c=[]},h)=>{const d=o==="dark"?"text-white":"text-[#1D1D1F]",k=o==="dark"?"bg-white":"bg-[#1D1D1F]";return(0,t.jsxs)("div",{ref:h,className:(0,n.cn)(o==="dark"?"aiui-dark":"","lg-desktop:aspect-[1920/930] tablet:aspect-[768/660] relative aspect-[390/660] w-full",f),children:[(0,t.jsx)(s.Picture,{className:"absolute top-0",source:r}),(0,t.jsxs)("div",{className:"relative z-10 flex flex-col gap-8 px-32",children:[(0,t.jsxs)("div",{className:"max-w-[686px] space-y-4",children:[(0,t.jsx)("h1",{className:(0,n.cn)("hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]",d),children:e}),(0,t.jsx)("p",{className:(0,n.cn)("hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]",d),children:a})]}),(0,t.jsxs)("div",{className:"flex items-center gap-4",children:[l&&(0,t.jsx)(s.Button,{size:"lg",variant:"primary",className:"hero-banner-primary-button",...l,children:l.text}),i&&(0,t.jsx)(s.Button,{size:"lg",variant:"secondary",...i,className:"hero-banner-secondary-button border-black bg-transparent text-black hover:bg-black hover:text-white",children:i.text})]})]}),c.length>0&&(0,t.jsx)("div",{className:"relative z-10 flex items-center gap-3 px-32 pb-6",children:c.map((N,x)=>(0,t.jsxs)(p.default.Fragment,{children:[(0,t.jsx)(s.Text,{className:(0,n.cn)("hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]",o==="dark"?"text-white":"text-[#1D1D1F]"),children:N.title}),x<c.length-1&&(0,t.jsx)("div",{className:(0,n.cn)("h-4 w-px",k)})]},x))})]})});b.displayName="HeroBanner";var B=(0,v.withStyles)(b);
1
+ "use strict";"use client";var u=Object.create;var m=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var H=(e,a)=>{for(var r in a)m(e,r,{get:a[r],enumerable:!0})},g=(e,a,r,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let l of D(a))!F.call(e,l)&&l!==r&&m(e,l,{get:()=>a[l],enumerable:!(i=w(a,l))||i.enumerable});return e};var z=(e,a,r)=>(r=e!=null?u(y(e)):{},g(a||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),C=e=>g(m({},"__esModule",{value:!0}),e);var P={};H(P,{default:()=>B});module.exports=C(P);var t=require("react/jsx-runtime"),p=z(require("react")),s=require("../../components/index.js"),n=require("../../helpers/index.js"),v=require("../../shared/Styles.js");const b=p.default.forwardRef(({title:e,subtitle:a,background:r,primaryButton:i,secondaryButton:l,theme:o="light",className:f,products:c=[]},h)=>{const d=o==="dark"?"text-white":"text-[#1D1D1F]",k=o==="dark"?"bg-white":"bg-[#1D1D1F]";return(0,t.jsxs)("div",{ref:h,className:(0,n.cn)(o==="dark"?"aiui-dark":"","lg-desktop:aspect-[1920/930] tablet:aspect-[768/660] relative aspect-[390/660] w-full",f),children:[(0,t.jsx)(s.Picture,{className:"absolute top-0",source:r}),(0,t.jsxs)("div",{className:"relative z-10 flex flex-col gap-8 px-32",children:[(0,t.jsxs)("div",{className:"max-w-[686px] space-y-4",children:[(0,t.jsx)("h1",{className:(0,n.cn)("hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]",d),children:e}),(0,t.jsx)("p",{className:(0,n.cn)("hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]",d),children:a})]}),(0,t.jsxs)("div",{className:"flex items-center gap-4",children:[l&&(0,t.jsx)(s.Button,{size:"lg",variant:"primary",className:"hero-banner-primary-button",...l,children:l.text}),i&&(0,t.jsx)(s.Button,{size:"lg",variant:"secondary",...i,className:"hero-banner-secondary-button border-black bg-transparent text-black hover:bg-black hover:text-white",children:i.text})]})]}),c.length>0&&(0,t.jsx)("div",{className:"relative z-10 flex items-center gap-3 px-32 pb-6",children:c.map((N,x)=>(0,t.jsxs)(p.default.Fragment,{children:[(0,t.jsx)(s.Text,{className:(0,n.cn)("hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]",o==="dark"?"text-white":"text-[#1D1D1F]"),children:N.title}),x<c.length-1&&(0,t.jsx)("div",{className:(0,n.cn)("h-4 w-px",k)})]},x))})]})});b.displayName="HeroBanner";var B=(0,v.withStyles)(b);
2
2
  //# sourceMappingURL=HeroBanner.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/HeroBanner/HeroBanner.tsx"],
4
- "sourcesContent": ["import React from 'react'\nimport type { HeroBannerProps } from './types.js'\nimport { Button, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { withStyles } from '../../shared/Styles.js'\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(\n ({ title, subtitle, background, primaryButton, secondaryButton, theme = 'light', className, products = [] }, ref) => {\n const textColorClass = theme === 'dark' ? 'text-white' : 'text-[#1D1D1F]'\n const dividerColorClass = theme === 'dark' ? 'bg-white' : 'bg-[#1D1D1F]'\n\n return (\n <div\n ref={ref}\n className={cn(\n theme === 'dark' ? 'aiui-dark' : '',\n 'lg-desktop:aspect-[1920/930] tablet:aspect-[768/660] relative aspect-[390/660] w-full',\n className\n )}\n >\n <Picture className=\"absolute top-0\" source={background} />\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"relative z-10 flex flex-col gap-8 px-32\">\n <div className=\"max-w-[686px] space-y-4\">\n <h1\n className={cn(\n 'hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]',\n textColorClass\n )}\n >\n {title}\n </h1>\n <p\n className={cn(\n 'hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]',\n textColorClass\n )}\n >\n {subtitle}\n </p>\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"flex items-center gap-4\">\n {secondaryButton && (\n <Button size=\"lg\" variant=\"primary\" className=\"hero-banner-primary-button\" {...secondaryButton}>\n {secondaryButton.text}\n </Button>\n )}\n {primaryButton && (\n <Button\n size=\"lg\"\n variant=\"secondary\"\n {...primaryButton}\n className=\"hero-banner-secondary-button border-black bg-transparent text-black hover:bg-black hover:text-white\"\n >\n {primaryButton.text}\n </Button>\n )}\n </div>\n </div>\n\n {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n {products.length > 0 && (\n <div className=\"relative z-10 flex items-center gap-3 px-32 pb-6\">\n {products.map((product, index) => (\n <React.Fragment key={index}>\n <Text\n className={cn(\n 'hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]',\n theme === 'dark' ? 'text-white' : 'text-[#1D1D1F]'\n )}\n >\n {product.title}\n </Text>\n {index < products.length - 1 && <div className={cn('h-4 w-px', dividerColorClass)} />}\n </React.Fragment>\n ))}\n </div>\n )}\n </div>\n )\n }\n)\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withStyles(HeroBanner)\n"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAoBQ,IAAAI,EAAA,6BApBRC,EAAkB,oBAElBC,EAAsC,qCACtCC,EAAmB,kCACnBC,EAA2B,kCAE3B,MAAMC,EAAa,EAAAC,QAAM,WACvB,CAAC,CAAE,MAAAC,EAAO,SAAAC,EAAU,WAAAC,EAAY,cAAAC,EAAe,gBAAAC,EAAiB,MAAAC,EAAQ,QAAS,UAAAC,EAAW,SAAAC,EAAW,CAAC,CAAE,EAAGC,IAAQ,CACnH,MAAMC,EAAiBJ,IAAU,OAAS,aAAe,iBACnDK,EAAoBL,IAAU,OAAS,WAAa,eAE1D,SACE,QAAC,OACC,IAAKG,EACL,aAAW,MACTH,IAAU,OAAS,YAAc,GACjC,wFACAC,CACF,EAEA,oBAAC,WAAQ,UAAU,iBAAiB,OAAQJ,EAAY,KAExD,QAAC,OAAI,UAAU,0CACb,qBAAC,OAAI,UAAU,0BACb,oBAAC,MACC,aAAW,MACT,oFACAO,CACF,EAEC,SAAAT,EACH,KACA,OAAC,KACC,aAAW,MACT,4EACAS,CACF,EAEC,SAAAR,EACH,GACF,KAGA,QAAC,OAAI,UAAU,0BACZ,UAAAG,MACC,OAAC,UAAO,KAAK,KAAK,QAAQ,UAAU,UAAU,6BAA8B,GAAGA,EAC5E,SAAAA,EAAgB,KACnB,EAEDD,MACC,OAAC,UACC,KAAK,KACL,QAAQ,YACP,GAAGA,EACJ,UAAU,sGAET,SAAAA,EAAc,KACjB,GAEJ,GACF,EAGCI,EAAS,OAAS,MACjB,OAAC,OAAI,UAAU,mDACZ,SAAAA,EAAS,IAAI,CAACI,EAASC,OACtB,QAAC,EAAAb,QAAM,SAAN,CACC,oBAAC,QACC,aAAW,MACT,gFACAM,IAAU,OAAS,aAAe,gBACpC,EAEC,SAAAM,EAAQ,MACX,EACCC,EAAQL,EAAS,OAAS,MAAK,OAAC,OAAI,aAAW,MAAG,WAAYG,CAAiB,EAAG,IAThEE,CAUrB,CACD,EACH,GAEJ,CAEJ,CACF,EAEAd,EAAW,YAAc,aAEzB,IAAOP,KAAQ,cAAWO,CAAU",
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\nimport type { HeroBannerProps } from './types.js'\nimport { Button, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { withStyles } from '../../shared/Styles.js'\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(\n ({ title, subtitle, background, primaryButton, secondaryButton, theme = 'light', className, products = [] }, ref) => {\n const textColorClass = theme === 'dark' ? 'text-white' : 'text-[#1D1D1F]'\n const dividerColorClass = theme === 'dark' ? 'bg-white' : 'bg-[#1D1D1F]'\n\n return (\n <div\n ref={ref}\n className={cn(\n theme === 'dark' ? 'aiui-dark' : '',\n 'lg-desktop:aspect-[1920/930] tablet:aspect-[768/660] relative aspect-[390/660] w-full',\n className\n )}\n >\n <Picture className=\"absolute top-0\" source={background} />\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"relative z-10 flex flex-col gap-8 px-32\">\n <div className=\"max-w-[686px] space-y-4\">\n <h1\n className={cn(\n 'hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]',\n textColorClass\n )}\n >\n {title}\n </h1>\n <p\n className={cn(\n 'hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]',\n textColorClass\n )}\n >\n {subtitle}\n </p>\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"flex items-center gap-4\">\n {secondaryButton && (\n <Button size=\"lg\" variant=\"primary\" className=\"hero-banner-primary-button\" {...secondaryButton}>\n {secondaryButton.text}\n </Button>\n )}\n {primaryButton && (\n <Button\n size=\"lg\"\n variant=\"secondary\"\n {...primaryButton}\n className=\"hero-banner-secondary-button border-black bg-transparent text-black hover:bg-black hover:text-white\"\n >\n {primaryButton.text}\n </Button>\n )}\n </div>\n </div>\n\n {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n {products.length > 0 && (\n <div className=\"relative z-10 flex items-center gap-3 px-32 pb-6\">\n {products.map((product, index) => (\n <React.Fragment key={index}>\n <Text\n className={cn(\n 'hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]',\n theme === 'dark' ? 'text-white' : 'text-[#1D1D1F]'\n )}\n >\n {product.title}\n </Text>\n {index < products.length - 1 && <div className={cn('h-4 w-px', dividerColorClass)} />}\n </React.Fragment>\n ))}\n </div>\n )}\n </div>\n )\n }\n)\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withStyles(HeroBanner)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqBQ,IAAAI,EAAA,6BApBRC,EAAkB,oBAElBC,EAAsC,qCACtCC,EAAmB,kCACnBC,EAA2B,kCAE3B,MAAMC,EAAa,EAAAC,QAAM,WACvB,CAAC,CAAE,MAAAC,EAAO,SAAAC,EAAU,WAAAC,EAAY,cAAAC,EAAe,gBAAAC,EAAiB,MAAAC,EAAQ,QAAS,UAAAC,EAAW,SAAAC,EAAW,CAAC,CAAE,EAAGC,IAAQ,CACnH,MAAMC,EAAiBJ,IAAU,OAAS,aAAe,iBACnDK,EAAoBL,IAAU,OAAS,WAAa,eAE1D,SACE,QAAC,OACC,IAAKG,EACL,aAAW,MACTH,IAAU,OAAS,YAAc,GACjC,wFACAC,CACF,EAEA,oBAAC,WAAQ,UAAU,iBAAiB,OAAQJ,EAAY,KAExD,QAAC,OAAI,UAAU,0CACb,qBAAC,OAAI,UAAU,0BACb,oBAAC,MACC,aAAW,MACT,oFACAO,CACF,EAEC,SAAAT,EACH,KACA,OAAC,KACC,aAAW,MACT,4EACAS,CACF,EAEC,SAAAR,EACH,GACF,KAGA,QAAC,OAAI,UAAU,0BACZ,UAAAG,MACC,OAAC,UAAO,KAAK,KAAK,QAAQ,UAAU,UAAU,6BAA8B,GAAGA,EAC5E,SAAAA,EAAgB,KACnB,EAEDD,MACC,OAAC,UACC,KAAK,KACL,QAAQ,YACP,GAAGA,EACJ,UAAU,sGAET,SAAAA,EAAc,KACjB,GAEJ,GACF,EAGCI,EAAS,OAAS,MACjB,OAAC,OAAI,UAAU,mDACZ,SAAAA,EAAS,IAAI,CAACI,EAASC,OACtB,QAAC,EAAAb,QAAM,SAAN,CACC,oBAAC,QACC,aAAW,MACT,gFACAM,IAAU,OAAS,aAAe,gBACpC,EAEC,SAAAM,EAAQ,MACX,EACCC,EAAQL,EAAS,OAAS,MAAK,OAAC,OAAI,aAAW,MAAG,WAAYG,CAAiB,EAAG,IAThEE,CAUrB,CACD,EACH,GAEJ,CAEJ,CACF,EAEAd,EAAW,YAAc,aAEzB,IAAOP,KAAQ,cAAWO,CAAU",
6
6
  "names": ["HeroBanner_exports", "__export", "HeroBanner_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_helpers", "import_Styles", "HeroBanner", "React", "title", "subtitle", "background", "primaryButton", "secondaryButton", "theme", "className", "products", "ref", "textColorClass", "dividerColorClass", "product", "index"]
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/HeroBanner/index.tsx"],
4
- "sourcesContent": ["export { default } from './HeroBanner.js'"],
4
+ "sourcesContent": ["export { default } from './HeroBanner.js'\n"],
5
5
  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wCAAAE,EAAAF,GAAA,IAAAG,EAAwB",
6
6
  "names": ["HeroBanner_exports", "__export", "__toCommonJS", "import_HeroBanner"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var g=Object.create;var n=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var r in t)n(e,r,{get:t[r],enumerable:!0})},q=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of P(t))!C.call(e,a)&&a!==r&&n(e,a,{get:()=>t[a],enumerable:!(o=x(t,a))||o.enumerable});return e};var f=(e,t,r)=>(r=e!=null?g(N(e)):{},q(t||!e||!e.__esModule?n(r,"default",{value:e,enumerable:!0}):r,e)),L=e=>q(n({},"__esModule",{value:!0}),e);var v={};T(v,{Marquee:()=>u,MarqueeImageContent:()=>M,MarqueeList:()=>c,MarqueeTextContent:()=>l});module.exports=L(v);var s=require("react/jsx-runtime"),p=f(require("react")),d=f(require("react-fast-marquee")),y=require("react-fast-marquee"),m=require("../../components/index.js"),i=require("../../helpers/utils.js");const u=p.default.forwardRef(({children:e,...t},r)=>(0,s.jsx)(d.default,{ref:r,...t,children:e}));u.displayName="Marquee";const c=p.default.forwardRef(({className:e,children:t,...r},o)=>(0,s.jsx)("div",{className:(0,i.cn)("flex gap-6 items-center laptop:gap-16",e),ref:o,children:t}));c.displayName="MarqueeList";const M=({image:e,className:t})=>(0,s.jsx)(m.Picture,{source:e,className:(0,i.cn)("aspect-w-[120] w-[72px] aspect-h-[80] laptop:w-[120px]",t),imgClassName:"object-cover"});M.displayName="MarqueeImageContent";const l=p.default.forwardRef(({text:e,className:t},r)=>(0,s.jsx)(m.Text,{as:"div",ref:r,html:e,className:(0,i.cn)("size-14 text-nowrap flex items-center justify-center leading-[1.2] text-lines-2 font-medium",t)}));l.displayName="MarqueeTextContent";
1
+ "use strict";"use client";var g=Object.create;var n=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var r in t)n(e,r,{get:t[r],enumerable:!0})},q=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of P(t))!C.call(e,a)&&a!==r&&n(e,a,{get:()=>t[a],enumerable:!(o=x(t,a))||o.enumerable});return e};var f=(e,t,r)=>(r=e!=null?g(N(e)):{},q(t||!e||!e.__esModule?n(r,"default",{value:e,enumerable:!0}):r,e)),L=e=>q(n({},"__esModule",{value:!0}),e);var v={};T(v,{Marquee:()=>u,MarqueeImageContent:()=>M,MarqueeList:()=>c,MarqueeTextContent:()=>l});module.exports=L(v);var s=require("react/jsx-runtime"),i=f(require("react")),d=f(require("react-fast-marquee")),y=require("react-fast-marquee"),m=require("../../components/index.js"),p=require("../../helpers/utils.js");const u=i.default.forwardRef(({children:e,...t},r)=>(0,s.jsx)(d.default,{ref:r,...t,children:e}));u.displayName="Marquee";const c=i.default.forwardRef(({className:e,children:t,...r},o)=>(0,s.jsx)("div",{className:(0,p.cn)("laptop:gap-16 flex items-center gap-6",e),ref:o,children:t}));c.displayName="MarqueeList";const M=({image:e,className:t})=>(0,s.jsx)(m.Picture,{source:e,className:(0,p.cn)("aspect-w-[120] aspect-h-[80] laptop:w-[120px] w-[72px]",t),imgClassName:"object-cover"});M.displayName="MarqueeImageContent";const l=i.default.forwardRef(({text:e,className:t},r)=>(0,s.jsx)(m.Text,{as:"div",ref:r,html:e,className:(0,p.cn)("text-lines-2 flex size-14 items-center justify-center text-nowrap font-medium leading-[1.2]",t)}));l.displayName="MarqueeTextContent";
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Marquee/index.tsx"],
4
- "sourcesContent": ["import React from 'react'\nimport { default as FastMarquee } from 'react-fast-marquee'\nimport { type MarqueeProps as FastMarqueeProps } from 'react-fast-marquee'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\n\nconst Marquee = React.forwardRef<HTMLDivElement, FastMarqueeProps>(\n ({children, ...props}, ref) => {\n return (\n <FastMarquee\n ref={ref}\n {...props}\n >\n {children}\n </FastMarquee>\n )\n }\n)\n\nMarquee.displayName = 'Marquee'\n\ninterface MarqueeListProps {\n children?: React.ReactNode;\n className?: string;\n}\n\nconst MarqueeList = React.forwardRef<\nHTMLDivElement,\nMarqueeListProps\n>(({ className, children, ...props }, ref) => {\n return (\n <div className={cn(\"flex gap-6 items-center laptop:gap-16\", className)} ref={ref}>\n {children}\n </div>\n )\n})\n\nMarqueeList.displayName = 'MarqueeList'\n\ninterface MarqueeImageContentProps {\n image: string\n className?: string;\n}\n\nconst MarqueeImageContent = ({ image, className }: MarqueeImageContentProps) => {\n return (\n <Picture \n source={image}\n className={cn(\"aspect-w-[120] w-[72px] aspect-h-[80] laptop:w-[120px]\", className)}\n imgClassName=\"object-cover\"\n />\n )\n}\n\nMarqueeImageContent.displayName = 'MarqueeImageContent'\n\ninterface MarqueeTextContentProps {\n text: string\n className?: string;\n}\n\nconst MarqueeTextContent = React.forwardRef<\nHTMLDivElement,\nMarqueeTextContentProps\n>(({ text, className }, ref) => {\n return (\n <Text\n as=\"div\"\n ref={ref}\n html={text}\n className={cn(\"size-14 text-nowrap flex items-center justify-center leading-[1.2] text-lines-2 font-medium\", className)}\n />\n )\n})\n\nMarqueeTextContent.displayName = 'MarqueeTextContent'\n\nexport { Marquee, MarqueeList, MarqueeImageContent, MarqueeTextContent }\nexport type { FastMarqueeProps, MarqueeListProps, MarqueeImageContentProps, MarqueeTextContentProps }"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,wBAAAC,EAAA,gBAAAC,EAAA,uBAAAC,IAAA,eAAAC,EAAAN,GASM,IAAAO,EAAA,6BATNC,EAAkB,oBAClBC,EAAuC,iCACvCA,EAAsD,8BACtDC,EAA8B,qCAC9BC,EAAmB,kCAEnB,MAAMT,EAAU,EAAAU,QAAM,WACpB,CAAC,CAAC,SAAAC,EAAU,GAAGC,CAAK,EAAGC,OAEnB,OAAC,EAAAC,QAAA,CACC,IAAKD,EACJ,GAAGD,EAEH,SAAAD,EACH,CAGN,EAEAX,EAAQ,YAAc,UAOtB,MAAME,EAAc,EAAAQ,QAAM,WAGxB,CAAC,CAAE,UAAAK,EAAW,SAAAJ,EAAU,GAAGC,CAAM,EAAGC,OAElC,OAAC,OAAI,aAAW,MAAG,wCAAyCE,CAAS,EAAG,IAAKF,EAC1E,SAAAF,EACH,CAEH,EAEDT,EAAY,YAAc,cAO1B,MAAMD,EAAsB,CAAC,CAAE,MAAAe,EAAO,UAAAD,CAAU,OAE5C,OAAC,WACC,OAAQC,EACR,aAAW,MAAG,yDAA0DD,CAAS,EACjF,aAAa,eACf,EAIJd,EAAoB,YAAc,sBAOlC,MAAME,EAAqB,EAAAO,QAAM,WAG/B,CAAC,CAAE,KAAAO,EAAM,UAAAF,CAAU,EAAGF,OAEpB,OAAC,QACC,GAAG,MACH,IAAKA,EACL,KAAMI,EACN,aAAW,MAAG,8FAA+FF,CAAS,EACxH,CAEH,EAEDZ,EAAmB,YAAc",
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\nimport { default as FastMarquee } from 'react-fast-marquee'\nimport { type MarqueeProps as FastMarqueeProps } from 'react-fast-marquee'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\n\nconst Marquee = React.forwardRef<HTMLDivElement, FastMarqueeProps>(({ children, ...props }, ref) => {\n return (\n <FastMarquee ref={ref} {...props}>\n {children}\n </FastMarquee>\n )\n})\n\nMarquee.displayName = 'Marquee'\n\ninterface MarqueeListProps {\n children?: React.ReactNode\n className?: string\n}\n\nconst MarqueeList = React.forwardRef<HTMLDivElement, MarqueeListProps>(({ className, children, ...props }, ref) => {\n return (\n <div className={cn('laptop:gap-16 flex items-center gap-6', className)} ref={ref}>\n {children}\n </div>\n )\n})\n\nMarqueeList.displayName = 'MarqueeList'\n\ninterface MarqueeImageContentProps {\n image: string\n className?: string\n}\n\nconst MarqueeImageContent = ({ image, className }: MarqueeImageContentProps) => {\n return (\n <Picture\n source={image}\n className={cn('aspect-w-[120] aspect-h-[80] laptop:w-[120px] w-[72px]', className)}\n imgClassName=\"object-cover\"\n />\n )\n}\n\nMarqueeImageContent.displayName = 'MarqueeImageContent'\n\ninterface MarqueeTextContentProps {\n text: string\n className?: string\n}\n\nconst MarqueeTextContent = React.forwardRef<HTMLDivElement, MarqueeTextContentProps>(({ text, className }, ref) => {\n return (\n <Text\n as=\"div\"\n ref={ref}\n html={text}\n className={cn(\n 'text-lines-2 flex size-14 items-center justify-center text-nowrap font-medium leading-[1.2]',\n className\n )}\n />\n )\n})\n\nMarqueeTextContent.displayName = 'MarqueeTextContent'\n\nexport { Marquee, MarqueeList, MarqueeImageContent, MarqueeTextContent }\nexport type { FastMarqueeProps, MarqueeListProps, MarqueeImageContentProps, MarqueeTextContentProps }\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,wBAAAC,EAAA,gBAAAC,EAAA,uBAAAC,IAAA,eAAAC,EAAAN,GASI,IAAAO,EAAA,6BARJC,EAAkB,oBAClBC,EAAuC,iCACvCA,EAAsD,8BACtDC,EAA8B,qCAC9BC,EAAmB,kCAEnB,MAAMT,EAAU,EAAAU,QAAM,WAA6C,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAM,EAAGC,OAExF,OAAC,EAAAC,QAAA,CAAY,IAAKD,EAAM,GAAGD,EACxB,SAAAD,EACH,CAEH,EAEDX,EAAQ,YAAc,UAOtB,MAAME,EAAc,EAAAQ,QAAM,WAA6C,CAAC,CAAE,UAAAK,EAAW,SAAAJ,EAAU,GAAGC,CAAM,EAAGC,OAEvG,OAAC,OAAI,aAAW,MAAG,wCAAyCE,CAAS,EAAG,IAAKF,EAC1E,SAAAF,EACH,CAEH,EAEDT,EAAY,YAAc,cAO1B,MAAMD,EAAsB,CAAC,CAAE,MAAAe,EAAO,UAAAD,CAAU,OAE5C,OAAC,WACC,OAAQC,EACR,aAAW,MAAG,yDAA0DD,CAAS,EACjF,aAAa,eACf,EAIJd,EAAoB,YAAc,sBAOlC,MAAME,EAAqB,EAAAO,QAAM,WAAoD,CAAC,CAAE,KAAAO,EAAM,UAAAF,CAAU,EAAGF,OAEvG,OAAC,QACC,GAAG,MACH,IAAKA,EACL,KAAMI,EACN,aAAW,MACT,8FACAF,CACF,EACF,CAEH,EAEDZ,EAAmB,YAAc",
6
6
  "names": ["Marquee_exports", "__export", "Marquee", "MarqueeImageContent", "MarqueeList", "MarqueeTextContent", "__toCommonJS", "import_jsx_runtime", "import_react", "import_react_fast_marquee", "import_components", "import_utils", "React", "children", "props", "ref", "FastMarquee", "className", "image", "text"]
7
7
  }
@@ -0,0 +1,15 @@
1
+ export interface MediaPlayerBaseProps {
2
+ className?: string;
3
+ title: string;
4
+ videoTitle?: string;
5
+ btnText: string;
6
+ img: string;
7
+ media: string;
8
+ }
9
+ declare const _default: {
10
+ (props: Omit<MediaPlayerBaseProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
11
+ className?: string;
12
+ }): import("react/jsx-runtime").JSX.Element;
13
+ displayName: string;
14
+ };
15
+ export default _default;
@@ -0,0 +1,2 @@
1
+ "use strict";"use client";var y=Object.create;var p=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var w=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var P=(e,t)=>{for(var s in t)p(e,s,{get:t[s],enumerable:!0})},n=(e,t,s,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of h(t))!N.call(e,r)&&r!==s&&p(e,r,{get:()=>t[r],enumerable:!(i=b(t,r))||i.enumerable});return e};var x=(e,t,s)=>(s=e!=null?y(w(e)):{},n(t||!e||!e.__esModule?p(s,"default",{value:e,enumerable:!0}):s,e)),B=e=>n(p({},"__esModule",{value:!0}),e);var z={};P(z,{default:()=>k});module.exports=B(z);var a=require("react/jsx-runtime"),c=require("react"),d=require("../../helpers/utils.js"),u=require("../../shared/Styles.js"),f=x(require("../../components/picture.js")),g=x(require("../../components/button.js"));const M=({className:e="",title:t="\u6807\u9898",videoTitle:s="\u89C6\u9891\u6807\u9898",btnText:i="\u6309\u94AE",img:r="https://img.anker.com/product/1719161555161.jpg",media:v="https://img.anker.com/product/1719161555161.mp4"})=>{const[o,m]=(0,c.useState)(!1),l=(0,c.useRef)(null);return(0,a.jsxs)("div",{className:(0,d.cn)(" relative w-full",e),children:[(0,a.jsxs)("div",{className:"media-content absolute left-1/2 top-1/2 z-10 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center gap-5",children:[(0,a.jsx)("div",{className:"text-center text-[40px] font-bold text-white lg:text-5xl xl:text-[64px]",dangerouslySetInnerHTML:{__html:o?s:t}}),!o&&(0,a.jsx)(g.default,{className:"member-equity-button-primary mx-auto border border-white bg-transparent px-4 py-2 text-xs text-white hover:bg-white hover:text-black sm:px-5 sm:py-[10px] sm:text-sm md:px-6 md:py-[11px] md:text-sm lg:px-7 lg:py-[12px] lg:text-base xl:px-7 xl:py-[14px] xl:text-base",variant:"primary",onClick:()=>{o?(l.current&&l.current.pause(),m(!1)):(l.current&&l.current.play(),m(!0))},children:i})]}),(0,a.jsxs)("div",{className:"media-cover xl:aspect-w-[1920] xl:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] md:aspect-w-[1024] md:aspect-h-[520] sm:aspect-w-[768] sm:aspect-h-[660] aspect-w-[390] aspect-h-[660] relative",children:[(0,a.jsx)("video",{ref:l,className:"size-full object-cover",src:v,muted:!0,loop:!0}),!o&&(0,a.jsx)(f.default,{className:"z-1 absolute left-0 top-0 size-full object-cover",source:r})]})]})};var k=(0,u.withStyles)(M);
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/MediaPlayerBase/index.tsx"],
4
+ "sourcesContent": ["'use client'\nimport React, { useState, useRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\n\nexport interface MediaPlayerBaseProps {\n className?: string\n title: string\n videoTitle?: string\n btnText: string\n img: string\n media: string\n}\n\nconst MediaPlayerBase: React.FC<MediaPlayerBaseProps> = ({\n className = '',\n title = '\u6807\u9898',\n videoTitle = '\u89C6\u9891\u6807\u9898',\n btnText = '\u6309\u94AE',\n img = 'https://img.anker.com/product/1719161555161.jpg',\n media = 'https://img.anker.com/product/1719161555161.mp4',\n}) => {\n const [isPlaying, setIsPlaying] = useState(false)\n const videoRef = useRef<HTMLVideoElement>(null)\n return (\n <div className={cn(' relative w-full', className)}>\n <div className=\"media-content absolute left-1/2 top-1/2 z-10 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center gap-5\">\n <div\n className=\"text-center text-[40px] font-bold text-white lg:text-5xl xl:text-[64px]\"\n dangerouslySetInnerHTML={{ __html: isPlaying ? videoTitle : title }}\n />\n {!isPlaying && (\n <Button\n className=\"member-equity-button-primary mx-auto border border-white bg-transparent px-4 py-2 text-xs text-white hover:bg-white hover:text-black sm:px-5 sm:py-[10px] sm:text-sm md:px-6 md:py-[11px] md:text-sm lg:px-7 lg:py-[12px] lg:text-base xl:px-7 xl:py-[14px] xl:text-base\"\n variant=\"primary\"\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 </Button>\n )}\n </div>\n <div className=\"media-cover xl:aspect-w-[1920] xl:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] md:aspect-w-[1024] md:aspect-h-[520] sm:aspect-w-[768] sm:aspect-h-[660] aspect-w-[390] aspect-h-[660] relative\">\n <video ref={videoRef} className=\"size-full object-cover\" src={media} muted loop />\n {!isPlaying && <Picture className=\"z-1 absolute left-0 top-0 size-full object-cover\" source={img} />}\n </div>\n </div>\n )\n}\n\nexport default withStyles(MediaPlayerBase)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA4BM,IAAAI,EAAA,6BA3BNC,EAAwC,iBACxCC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAoB,0CACpBC,EAAmB,yCAWnB,MAAMC,EAAkD,CAAC,CACvD,UAAAC,EAAY,GACZ,MAAAC,EAAQ,eACR,WAAAC,EAAa,2BACb,QAAAC,EAAU,eACV,IAAAC,EAAM,kDACN,MAAAC,EAAQ,iDACV,IAAM,CACJ,KAAM,CAACC,EAAWC,CAAY,KAAI,YAAS,EAAK,EAC1CC,KAAW,UAAyB,IAAI,EAC9C,SACE,QAAC,OAAI,aAAW,MAAG,mBAAoBR,CAAS,EAC9C,qBAAC,OAAI,UAAU,kHACb,oBAAC,OACC,UAAU,0EACV,wBAAyB,CAAE,OAAQM,EAAYJ,EAAaD,CAAM,EACpE,EACC,CAACK,MACA,OAAC,EAAAG,QAAA,CACC,UAAU,2QACV,QAAQ,UACR,QAAS,IAAM,CACTH,GACEE,EAAS,SACXA,EAAS,QAAQ,MAAM,EAEzBD,EAAa,EAAK,IAEdC,EAAS,SACXA,EAAS,QAAQ,KAAK,EAExBD,EAAa,EAAI,EAErB,EAEC,SAAAJ,EACH,GAEJ,KACA,QAAC,OAAI,UAAU,wMACb,oBAAC,SAAM,IAAKK,EAAU,UAAU,yBAAyB,IAAKH,EAAO,MAAK,GAAC,KAAI,GAAC,EAC/E,CAACC,MAAa,OAAC,EAAAI,QAAA,CAAQ,UAAU,mDAAmD,OAAQN,EAAK,GACpG,GACF,CAEJ,EAEA,IAAOb,KAAQ,cAAWQ,CAAe",
6
+ "names": ["MediaPlayerBase_exports", "__export", "MediaPlayerBase_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_picture", "import_button", "MediaPlayerBase", "className", "title", "videoTitle", "btnText", "img", "media", "isPlaying", "setIsPlaying", "videoRef", "Button", "Picture"]
7
+ }
@@ -0,0 +1,18 @@
1
+ import type { ComponentCommonProps } from '../../types/props.js';
2
+ export interface TestimonialItem {
3
+ name: string;
4
+ description: string;
5
+ quote: string;
6
+ backgroundImage: string;
7
+ }
8
+ export interface TestimonialSectionProps extends ComponentCommonProps {
9
+ items: TestimonialItem[];
10
+ className?: string;
11
+ }
12
+ declare const _default: {
13
+ (props: Omit<TestimonialSectionProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
14
+ className?: string;
15
+ }): import("react/jsx-runtime").JSX.Element;
16
+ displayName: string;
17
+ };
18
+ export default _default;
@@ -0,0 +1,2 @@
1
+ "use strict";"use client";var p=Object.create;var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var g=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var v=(e,i)=>{for(var s in i)a(e,s,{get:i[s],enumerable:!0})},n=(e,i,s,l)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of f(i))!x.call(e,o)&&o!==s&&a(e,o,{get:()=>i[o],enumerable:!(l=d(i,o))||l.enumerable});return e};var u=(e,i,s)=>(s=e!=null?p(g(e)):{},n(i||!e||!e.__esModule?a(s,"default",{value:e,enumerable:!0}):s,e)),w=e=>n(a({},"__esModule",{value:!0}),e);var b={};v(b,{default:()=>N});module.exports=w(b);var t=require("react/jsx-runtime"),k=require("react"),m=require("../../helpers/utils.js"),r=require("../../shared/Styles.js"),c=u(require("../../components/picture.js"));const h=({items:e=[],style:i="",className:s=""})=>(0,t.jsx)("div",{className:(0,m.cn)("flex gap-4 overflow-x-auto",s),children:e.map((l,o)=>(0,t.jsxs)("div",{className:(0,m.cn)("w-swiper-1/2 flex shrink-0 flex-col overflow-hidden sm:flex-row"),children:[(0,t.jsxs)("div",{className:"relative w-full flex-none sm:w-[49%]",children:[(0,t.jsx)(c.default,{source:l.backgroundImage,alt:l.name,className:"size-full",imgClassName:"w-full h-full object-cover"}),(0,t.jsx)("div",{className:"absolute bottom-6 right-6 flex items-center justify-center",children:(0,t.jsx)("div",{className:"flex size-10 items-center justify-center rounded-full bg-white bg-opacity-20 sm:size-12",children:(0,t.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,t.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})})})]}),(0,t.jsxs)("div",{className:"flex flex-col gap-[30px] bg-white p-4 sm:gap-[60px] sm:p-6",children:[(0,t.jsxs)("div",{className:"flex flex-col gap-2",children:[(0,t.jsx)("h3",{className:"text-sm font-medium leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] xl:text-lg",children:l.name}),(0,t.jsx)("p",{className:"text-sm font-medium leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] xl:text-lg",children:l.description})]}),(0,t.jsx)("p",{className:"text-lg font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F] xl:text-2xl",children:l.quote})]})]},o))});var N=(0,r.withStyles)(h);
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/MediaPlayerMulti/index.tsx"],
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { ComponentCommonProps } from '../../types/props.js'\nimport Picture from '../../components/picture.js'\n\nexport interface TestimonialItem {\n name: string\n description: string\n quote: string\n backgroundImage: string\n}\n\nexport interface TestimonialSectionProps extends ComponentCommonProps {\n items: TestimonialItem[]\n className?: string\n}\n\nconst MediaPlayerMulti: React.FC<TestimonialSectionProps> = ({ items = [], style = '', className = '' }) => {\n return (\n <div className={cn('flex gap-4 overflow-x-auto', className)}>\n {items.map((item, index) => (\n <div key={index} className={cn('w-swiper-1/2 flex shrink-0 flex-col overflow-hidden sm:flex-row')}>\n <div className=\"relative w-full flex-none sm:w-[49%]\">\n <Picture\n source={item.backgroundImage}\n alt={item.name}\n className=\"size-full\"\n imgClassName=\"w-full h-full object-cover\"\n />\n <div className=\"absolute bottom-6 right-6 flex items-center justify-center\">\n <div className=\"flex size-10 items-center justify-center rounded-full bg-white bg-opacity-20 sm:size-12\">\n <svg width=\"12\" height=\"14\" viewBox=\"0 0 12 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12 7L0 14L0 0L12 7Z\" fill=\"white\" />\n </svg>\n </div>\n </div>\n </div>\n\n <div className=\"flex flex-col gap-[30px] bg-white p-4 sm:gap-[60px] sm:p-6\">\n <div className=\"flex flex-col gap-2\">\n <h3 className=\"text-sm font-medium leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] xl:text-lg\">\n {item.name}\n </h3>\n <p className=\"text-sm font-medium leading-[1.2] tracking-[-0.02em] text-[#1D1D1F] xl:text-lg\">\n {item.description}\n </p>\n </div>\n\n <p className=\"text-lg font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F] xl:text-2xl\">\n {item.quote}\n </p>\n </div>\n </div>\n ))}\n </div>\n )\n}\n\nexport default withStyles(MediaPlayerMulti)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAwBU,IAAAI,EAAA,6BAvBVC,EAAkB,iBAClBC,EAAmB,kCACnBC,EAA2B,kCAE3BC,EAAoB,0CAcpB,MAAMC,EAAsD,CAAC,CAAE,MAAAC,EAAQ,CAAC,EAAG,MAAAC,EAAQ,GAAI,UAAAC,EAAY,EAAG,OAElG,OAAC,OAAI,aAAW,MAAG,6BAA8BA,CAAS,EACvD,SAAAF,EAAM,IAAI,CAACG,EAAMC,OAChB,QAAC,OAAgB,aAAW,MAAG,iEAAiE,EAC9F,qBAAC,OAAI,UAAU,uCACb,oBAAC,EAAAC,QAAA,CACC,OAAQF,EAAK,gBACb,IAAKA,EAAK,KACV,UAAU,YACV,aAAa,6BACf,KACA,OAAC,OAAI,UAAU,6DACb,mBAAC,OAAI,UAAU,0FACb,mBAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,mBAAC,QAAK,EAAE,uBAAuB,KAAK,QAAQ,EAC9C,EACF,EACF,GACF,KAEA,QAAC,OAAI,UAAU,6DACb,qBAAC,OAAI,UAAU,sBACb,oBAAC,MAAG,UAAU,iFACX,SAAAA,EAAK,KACR,KACA,OAAC,KAAE,UAAU,iFACV,SAAAA,EAAK,YACR,GACF,KAEA,OAAC,KAAE,UAAU,gFACV,SAAAA,EAAK,MACR,GACF,IA9BQC,CA+BV,CACD,EACH,EAIJ,IAAOZ,KAAQ,cAAWO,CAAgB",
6
+ "names": ["MediaPlayerMulti_exports", "__export", "MediaPlayerMulti_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "import_picture", "MediaPlayerMulti", "items", "style", "className", "item", "index", "Picture"]
7
+ }
@@ -1,4 +1,4 @@
1
- "use strict";var x=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var c=(p,e)=>{for(var o in e)x(p,o,{get:e[o],enumerable:!0})},y=(p,e,o,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of k(e))!u.call(p,a)&&a!==o&&x(p,a,{get:()=>e[a],enumerable:!(l=b(e,a))||l.enumerable});return p};var f=p=>y(x({},"__esModule",{value:!0}),p);var h={};c(h,{default:()=>v});module.exports=f(h);var t=require("react/jsx-runtime"),q=require("react"),s=require("../../components/index.js"),r=require("../../shared/Styles.js");const w=({title:p,description:e,backgroundImage:o,primaryButton:l,secondaryButton:a,shape:d="square",theme:n="light",className:i=""})=>{const m=()=>{},g=()=>{};return(0,t.jsxs)("section",{"data-ui-component-id":"MemberEquity",className:`
1
+ "use strict";"use client";var x=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var c=(p,e)=>{for(var o in e)x(p,o,{get:e[o],enumerable:!0})},y=(p,e,o,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of k(e))!u.call(p,a)&&a!==o&&x(p,a,{get:()=>e[a],enumerable:!(l=b(e,a))||l.enumerable});return p};var f=p=>y(x({},"__esModule",{value:!0}),p);var h={};c(h,{default:()=>v});module.exports=f(h);var t=require("react/jsx-runtime"),q=require("react"),s=require("../../components/index.js"),r=require("../../shared/Styles.js");const w=({title:p,description:e,backgroundImage:o,primaryButton:l,secondaryButton:a,shape:d="square",theme:n="light",className:i=""})=>{const m=()=>{},g=()=>{};return(0,t.jsxs)("section",{"data-ui-component-id":"MemberEquity",className:`
2
2
  ${n==="dark"?"aiui-dark":""}
3
3
  relative w-full overflow-hidden bg-[#242426]
4
4
  ${d==="rounded"?"tablet:rounded-lg laptop:rounded-xl desktop:rounded-2xl rounded-none":""}
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/MemberEquity/index.tsx"],
4
- "sourcesContent": ["import React from 'react'\nimport { Button } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MemberEquityProps } from './types.js'\n\nconst MemberEquity: React.FC<MemberEquityProps> = ({\n title,\n description,\n backgroundImage,\n primaryButton,\n secondaryButton,\n shape = 'square',\n theme = 'light',\n className = '',\n}) => {\n const handleButtonPrimaryClick = () => {\n // \u6267\u884C\u4E3B\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n }\n\n const handleButtonSecondaryClick = () => {\n // \u6267\u884C\u526F\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n }\n\n return (\n <section\n data-ui-component-id=\"MemberEquity\"\n className={`\n ${theme === 'dark' ? 'aiui-dark' : ''}\n relative w-full overflow-hidden bg-[#242426]\n ${shape === 'rounded' ? 'tablet:rounded-lg laptop:rounded-xl desktop:rounded-2xl rounded-none' : ''}\n ${className}\n `}\n >\n <div\n className=\"absolute inset-0 size-full\"\n style={{\n backgroundImage: `\n radial-gradient(circle at 70% 176%, rgba(84, 85, 87, 0) 72%, rgba(84, 85, 87, 1) 100%),\n url(${backgroundImage})\n `,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n }}\n />\n <div\n className={`\n xs:aspect-[343/200] tablet:aspect-[343/200] laptop:aspect-[592/336]\n desktop:aspect-[800/448] lg-desktop:aspect-[1000/560]\n relative \n mx-auto\n flex\n aspect-[343/200]\n w-full items-center\n `}\n >\n <div\n className={`\n tablet:px-6 laptop:px-[76px] desktop:px-[111px] lg-desktop:px-[139px] tablet:gap-5 laptop:gap-6\n desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-4 px-4\n `}\n >\n <div className=\"tablet:gap-2 laptop:gap-3 desktop:gap-3 lg-desktop:gap-4 flex flex-col gap-2\">\n <h2\n className={`\n member-equity-title font-mont tablet:text-2xl laptop:text-3xl desktop:text-4xl\n lg-desktop:text-[32px] tablet:max-w-[300px] laptop:max-w-[400px] desktop:max-w-[500px] lg-desktop:max-w-[547px]\n max-w-[280px]\n text-xl font-bold leading-[1.2] tracking-[-0.04em] text-white\n `}\n >\n {title}\n </h2>\n <p\n className={`\n member-equity-description font-pingfang tablet:text-sm laptop:text-base desktop:text-lg\n lg-desktop:text-lg tablet:max-w-[286px] laptop:max-w-[350px] desktop:max-w-[426px] lg-desktop:max-w-[547px]\n max-w-[260px]\n text-sm font-semibold leading-[1.4] tracking-[-0.02em] text-white\n `}\n >\n {description}\n </p>\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"tablet:gap-3 laptop:gap-4 desktop:gap-4 lg-desktop:gap-4 flex items-center gap-3\">\n <Button\n variant=\"primary\"\n onClick={handleButtonPrimaryClick}\n className={`\n member-equity-button-primary tablet:text-sm laptop:text-sm desktop:text-base lg-desktop:text-base tablet:px-5 laptop:px-6 desktop:px-7 lg-desktop:px-7 tablet:py-[10px]\n laptop:py-[11px] desktop:py-[12px] lg-desktop:py-[14px] border border-white bg-transparent px-4\n py-2 text-xs text-white hover:bg-white hover:text-black\n ${shape === 'rounded' ? 'tablet:rounded-[19px] laptop:rounded-[20px] desktop:rounded-[22px] lg-desktop:rounded-[24px] rounded-[16px]' : ''}\n `}\n >\n {primaryButton.text}\n </Button>\n <Button\n variant=\"secondary\"\n onClick={handleButtonSecondaryClick}\n className={`\n member-equity-button-secondary tablet:text-sm laptop:text-sm desktop:text-base lg-desktop:text-base tablet:px-5\n laptop:px-6 desktop:px-7 lg-desktop:px-7 tablet:py-[10px] laptop:py-[11px]\n desktop:py-[12px] lg-desktop:py-[14px] px-4 py-2 text-xs\n ${shape === 'rounded' ? 'tablet:rounded-[19px] laptop:rounded-[20px] desktop:rounded-[22px] lg-desktop:rounded-[24px] rounded-[16px]' : ''}\n `}\n >\n {secondaryButton.text}\n </Button>\n </div>\n </div>\n </div>\n </section>\n )\n}\n\nexport default withStyles(MemberEquity)\n"],
5
- "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAiCM,IAAAI,EAAA,6BAjCNC,EAAkB,iBAClBC,EAAuB,qCACvBC,EAA2B,kCAG3B,MAAMC,EAA4C,CAAC,CACjD,MAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,SACR,MAAAC,EAAQ,QACR,UAAAC,EAAY,EACd,IAAM,CACJ,MAAMC,EAA2B,IAAM,CAEvC,EAEMC,EAA6B,IAAM,CAEzC,EAEA,SACE,QAAC,WACC,uBAAqB,eACrB,UAAW;AAAA,UACPH,IAAU,OAAS,YAAc,EAAE;AAAA;AAAA,UAEnCD,IAAU,UAAY,uEAAyE,EAAE;AAAA,UACjGE,CAAS;AAAA,QAGb,oBAAC,OACC,UAAU,6BACV,MAAO,CACL,gBAAiB;AAAA;AAAA,kBAETL,CAAe;AAAA,YAEvB,eAAgB,QAChB,mBAAoB,QACtB,EACF,KACA,OAAC,OACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAUX,oBAAC,OACC,UAAW;AAAA;AAAA;AAAA,UAKX,qBAAC,OAAI,UAAU,+EACb,oBAAC,MACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA,cAOV,SAAAF,EACH,KACA,OAAC,KACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA,cAOV,SAAAC,EACH,GACF,KAGA,QAAC,OAAI,UAAU,mFACb,oBAAC,UACC,QAAQ,UACR,QAASO,EACT,UAAW;AAAA;AAAA;AAAA;AAAA,kBAIPH,IAAU,UAAY,8GAAgH,EAAE;AAAA,gBAG3I,SAAAF,EAAc,KACjB,KACA,OAAC,UACC,QAAQ,YACR,QAASM,EACT,UAAW;AAAA;AAAA;AAAA;AAAA,kBAIPJ,IAAU,UAAY,8GAAgH,EAAE;AAAA,gBAG3I,SAAAD,EAAgB,KACnB,GACF,GACF,EACF,GACF,CAEJ,EAEA,IAAOX,KAAQ,cAAWM,CAAY",
4
+ "sourcesContent": ["'use client'\nimport React from 'react'\nimport { Button } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MemberEquityProps } from './types.js'\n\nconst MemberEquity: React.FC<MemberEquityProps> = ({\n title,\n description,\n backgroundImage,\n primaryButton,\n secondaryButton,\n shape = 'square',\n theme = 'light',\n className = '',\n}) => {\n const handleButtonPrimaryClick = () => {\n // \u6267\u884C\u4E3B\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n }\n\n const handleButtonSecondaryClick = () => {\n // \u6267\u884C\u526F\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n }\n\n return (\n <section\n data-ui-component-id=\"MemberEquity\"\n className={`\n ${theme === 'dark' ? 'aiui-dark' : ''}\n relative w-full overflow-hidden bg-[#242426]\n ${shape === 'rounded' ? 'tablet:rounded-lg laptop:rounded-xl desktop:rounded-2xl rounded-none' : ''}\n ${className}\n `}\n >\n <div\n className=\"absolute inset-0 size-full\"\n style={{\n backgroundImage: `\n radial-gradient(circle at 70% 176%, rgba(84, 85, 87, 0) 72%, rgba(84, 85, 87, 1) 100%),\n url(${backgroundImage})\n `,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n }}\n />\n <div\n className={`\n xs:aspect-[343/200] tablet:aspect-[343/200] laptop:aspect-[592/336]\n desktop:aspect-[800/448] lg-desktop:aspect-[1000/560]\n relative \n mx-auto\n flex\n aspect-[343/200]\n w-full items-center\n `}\n >\n <div\n className={`\n tablet:px-6 laptop:px-[76px] desktop:px-[111px] lg-desktop:px-[139px] tablet:gap-5 laptop:gap-6\n desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-4 px-4\n `}\n >\n <div className=\"tablet:gap-2 laptop:gap-3 desktop:gap-3 lg-desktop:gap-4 flex flex-col gap-2\">\n <h2\n className={`\n member-equity-title font-mont tablet:text-2xl laptop:text-3xl desktop:text-4xl\n lg-desktop:text-[32px] tablet:max-w-[300px] laptop:max-w-[400px] desktop:max-w-[500px] lg-desktop:max-w-[547px]\n max-w-[280px]\n text-xl font-bold leading-[1.2] tracking-[-0.04em] text-white\n `}\n >\n {title}\n </h2>\n <p\n className={`\n member-equity-description font-pingfang tablet:text-sm laptop:text-base desktop:text-lg\n lg-desktop:text-lg tablet:max-w-[286px] laptop:max-w-[350px] desktop:max-w-[426px] lg-desktop:max-w-[547px]\n max-w-[260px]\n text-sm font-semibold leading-[1.4] tracking-[-0.02em] text-white\n `}\n >\n {description}\n </p>\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"tablet:gap-3 laptop:gap-4 desktop:gap-4 lg-desktop:gap-4 flex items-center gap-3\">\n <Button\n variant=\"primary\"\n onClick={handleButtonPrimaryClick}\n className={`\n member-equity-button-primary tablet:text-sm laptop:text-sm desktop:text-base lg-desktop:text-base tablet:px-5 laptop:px-6 desktop:px-7 lg-desktop:px-7 tablet:py-[10px]\n laptop:py-[11px] desktop:py-[12px] lg-desktop:py-[14px] border border-white bg-transparent px-4\n py-2 text-xs text-white hover:bg-white hover:text-black\n ${shape === 'rounded' ? 'tablet:rounded-[19px] laptop:rounded-[20px] desktop:rounded-[22px] lg-desktop:rounded-[24px] rounded-[16px]' : ''}\n `}\n >\n {primaryButton.text}\n </Button>\n <Button\n variant=\"secondary\"\n onClick={handleButtonSecondaryClick}\n className={`\n member-equity-button-secondary tablet:text-sm laptop:text-sm desktop:text-base lg-desktop:text-base tablet:px-5\n laptop:px-6 desktop:px-7 lg-desktop:px-7 tablet:py-[10px] laptop:py-[11px]\n desktop:py-[12px] lg-desktop:py-[14px] px-4 py-2 text-xs\n ${shape === 'rounded' ? 'tablet:rounded-[19px] laptop:rounded-[20px] desktop:rounded-[22px] lg-desktop:rounded-[24px] rounded-[16px]' : ''}\n `}\n >\n {secondaryButton.text}\n </Button>\n </div>\n </div>\n </div>\n </section>\n )\n}\n\nexport default withStyles(MemberEquity)\n"],
5
+ "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAkCM,IAAAI,EAAA,6BAjCNC,EAAkB,iBAClBC,EAAuB,qCACvBC,EAA2B,kCAG3B,MAAMC,EAA4C,CAAC,CACjD,MAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,SACR,MAAAC,EAAQ,QACR,UAAAC,EAAY,EACd,IAAM,CACJ,MAAMC,EAA2B,IAAM,CAEvC,EAEMC,EAA6B,IAAM,CAEzC,EAEA,SACE,QAAC,WACC,uBAAqB,eACrB,UAAW;AAAA,UACPH,IAAU,OAAS,YAAc,EAAE;AAAA;AAAA,UAEnCD,IAAU,UAAY,uEAAyE,EAAE;AAAA,UACjGE,CAAS;AAAA,QAGb,oBAAC,OACC,UAAU,6BACV,MAAO,CACL,gBAAiB;AAAA;AAAA,kBAETL,CAAe;AAAA,YAEvB,eAAgB,QAChB,mBAAoB,QACtB,EACF,KACA,OAAC,OACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAUX,oBAAC,OACC,UAAW;AAAA;AAAA;AAAA,UAKX,qBAAC,OAAI,UAAU,+EACb,oBAAC,MACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA,cAOV,SAAAF,EACH,KACA,OAAC,KACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA,cAOV,SAAAC,EACH,GACF,KAGA,QAAC,OAAI,UAAU,mFACb,oBAAC,UACC,QAAQ,UACR,QAASO,EACT,UAAW;AAAA;AAAA;AAAA;AAAA,kBAIPH,IAAU,UAAY,8GAAgH,EAAE;AAAA,gBAG3I,SAAAF,EAAc,KACjB,KACA,OAAC,UACC,QAAQ,YACR,QAASM,EACT,UAAW;AAAA;AAAA;AAAA;AAAA,kBAIPJ,IAAU,UAAY,8GAAgH,EAAE;AAAA,gBAG3I,SAAAD,EAAgB,KACnB,GACF,GACF,EACF,GACF,CAEJ,EAEA,IAAOX,KAAQ,cAAWM,CAAY",
6
6
  "names": ["MemberEquity_exports", "__export", "MemberEquity_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_Styles", "MemberEquity", "title", "description", "backgroundImage", "primaryButton", "secondaryButton", "shape", "theme", "className", "handleButtonPrimaryClick", "handleButtonSecondaryClick"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var g=Object.create;var s=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var w=Object.getPrototypeOf,v=Object.prototype.hasOwnProperty;var D=(t,e)=>{for(var l in e)s(t,l,{get:e[l],enumerable:!0})},n=(t,e,l,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of y(e))!v.call(t,a)&&a!==l&&s(t,a,{get:()=>e[a],enumerable:!(o=c(e,a))||o.enumerable});return t};var k=(t,e,l)=>(l=t!=null?g(w(t)):{},n(e||!t||!t.__esModule?s(l,"default",{value:t,enumerable:!0}):l,t)),N=t=>n(s({},"__esModule",{value:!0}),t);var h={};D(h,{default:()=>b});module.exports=N(h);var p=require("react/jsx-runtime"),i=k(require("react")),d=require("../../helpers/utils.js"),x=require("../../components/index.js"),f=require("../../shared/Styles.js");const r=i.default.forwardRef(({title:t,features:e,className:l},o)=>(0,p.jsxs)("div",{ref:o,className:(0,d.cn)("laptop:flex-row laptop:items-end laptop:justify-between flex w-full flex-col items-start justify-center text-center","tablet:px-6 laptop:px-8 desktop:px-16 lg-desktop:px-32 px-4","tablet:py-10 laptop:py-12 desktop:py-16 lg-desktop:py-20 gap-8 py-8",l),children:[(0,p.jsx)(x.Heading,{as:"h2",size:2,weight:"bold",align:"left",className:"slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none text-[#1D1D1F]",children:t}),e&&e.length>0&&(0,p.jsx)("div",{className:"flex w-full max-w-[423px] flex-row items-center gap-3",children:e.slice(0,3).map((a,m)=>(0,p.jsxs)(i.default.Fragment,{children:[m>0&&(0,p.jsx)("div",{className:"w-px self-stretch bg-[#D9D9D9]"}),(0,p.jsx)("div",{className:"flex-1",children:(0,p.jsx)(x.Text,{align:"left",className:"slogan-feature-text laptop:line-clamp-2 tablet:text-[13px] laptop:text-[14px] line-clamp-3 text-[12px] font-medium leading-[1.4] text-[#1D1D1F]",html:a})})]},m))})]}));r.displayName="Slogan";var b=(0,f.withStyles)(r);
1
+ "use strict";"use client";var g=Object.create;var s=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var w=Object.getPrototypeOf,v=Object.prototype.hasOwnProperty;var D=(t,e)=>{for(var l in e)s(t,l,{get:e[l],enumerable:!0})},n=(t,e,l,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of y(e))!v.call(t,a)&&a!==l&&s(t,a,{get:()=>e[a],enumerable:!(o=c(e,a))||o.enumerable});return t};var k=(t,e,l)=>(l=t!=null?g(w(t)):{},n(e||!t||!t.__esModule?s(l,"default",{value:t,enumerable:!0}):l,t)),N=t=>n(s({},"__esModule",{value:!0}),t);var h={};D(h,{default:()=>b});module.exports=N(h);var p=require("react/jsx-runtime"),x=k(require("react")),d=require("../../helpers/utils.js"),i=require("../../components/index.js"),f=require("../../shared/Styles.js");const r=x.default.forwardRef(({title:t,features:e,className:l},o)=>(0,p.jsxs)("div",{ref:o,className:(0,d.cn)("laptop:flex-row laptop:items-end laptop:justify-between flex w-full flex-col items-start justify-center text-center","tablet:px-6 laptop:px-8 desktop:px-16 lg-desktop:px-32 px-4","tablet:py-10 laptop:py-12 desktop:py-16 lg-desktop:py-20 gap-8 py-8",l),children:[(0,p.jsx)(i.Heading,{as:"h2",size:2,weight:"bold",align:"left",className:"slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none text-[#1D1D1F]",children:t}),e&&e.length>0&&(0,p.jsx)("div",{className:"flex w-full max-w-[423px] flex-row items-center gap-3",children:e.slice(0,3).map((a,m)=>(0,p.jsxs)(x.default.Fragment,{children:[m>0&&(0,p.jsx)("div",{className:"w-px self-stretch bg-[#D9D9D9]"}),(0,p.jsx)("div",{className:"flex-1",children:(0,p.jsx)(i.Text,{align:"left",className:"slogan-feature-text laptop:line-clamp-2 tablet:text-[13px] laptop:text-[14px] line-clamp-3 text-[12px] font-medium leading-[1.4] text-[#1D1D1F]",html:a})})]},m))})]}));r.displayName="Slogan";var b=(0,f.withStyles)(r);
2
2
  //# sourceMappingURL=index.js.map