@anker-in/headless-ui 1.1.34-alpha.1768461697532 → 1.1.34-alpha.1768472366452

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 (30) hide show
  1. package/dist/cjs/biz-components/EventSchedule/index.js +1 -1
  2. package/dist/cjs/biz-components/EventSchedule/index.js.map +3 -3
  3. package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.js +1 -1
  4. package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.js.map +2 -2
  5. package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js +1 -1
  6. package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js.map +2 -2
  7. package/dist/cjs/biz-components/PromotionalBar/index.js +1 -1
  8. package/dist/cjs/biz-components/PromotionalBar/index.js.map +2 -2
  9. package/dist/cjs/biz-components/Title/Countdown.js +1 -1
  10. package/dist/cjs/biz-components/Title/Countdown.js.map +2 -2
  11. package/dist/cjs/biz-components/Title/index.js +1 -1
  12. package/dist/cjs/biz-components/Title/index.js.map +2 -2
  13. package/dist/esm/biz-components/EventSchedule/index.js +1 -1
  14. package/dist/esm/biz-components/EventSchedule/index.js.map +3 -3
  15. package/dist/esm/biz-components/HeaderNavigation/MobileMenuComponents.js +1 -1
  16. package/dist/esm/biz-components/HeaderNavigation/MobileMenuComponents.js.map +2 -2
  17. package/dist/esm/biz-components/HeaderNavigation/SidebarDropdown.js +1 -1
  18. package/dist/esm/biz-components/HeaderNavigation/SidebarDropdown.js.map +2 -2
  19. package/dist/esm/biz-components/PromotionalBar/index.js +1 -1
  20. package/dist/esm/biz-components/PromotionalBar/index.js.map +2 -2
  21. package/dist/esm/biz-components/Title/Countdown.js +1 -1
  22. package/dist/esm/biz-components/Title/Countdown.js.map +2 -2
  23. package/dist/esm/biz-components/Title/index.js +1 -1
  24. package/dist/esm/biz-components/Title/index.js.map +2 -2
  25. package/dist/tokens/anker.css +1 -0
  26. package/dist/tokens/base.css +8 -0
  27. package/dist/tokens/solix.css +1 -0
  28. package/package.json +1 -1
  29. package/style.css +19 -0
  30. package/tailwind.config.js +1 -0
package/dist/cjs/biz-components/EventSchedule/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var F=Object.create;var S=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var $=(e,t)=>{for(var s in t)S(e,s,{get:t[s],enumerable:!0})},C=(e,t,s,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of R(t))!H.call(e,n)&&n!==s&&S(e,n,{get:()=>t[n],enumerable:!(c=z(t,n))||c.enumerable});return e};var A=(e,t,s)=>(s=e!=null?F(j(e)):{},C(t||!e||!e.__esModule?S(s,"default",{value:e,enumerable:!0}):s,e)),O=e=>C(S({},"__esModule",{value:!0}),e);var Y={};$(Y,{default:()=>X});module.exports=O(Y);var a=require("react/jsx-runtime"),l=A(require("react")),p=require("../../helpers/index.js"),v=require("../../components/index.js"),f=require("swiper/react"),b=A(require("dayjs")),h=require("class-variance-authority");const q=(e,t)=>{const s=(0,b.default)(),c=(0,b.default)(e).startOf("day"),n=(0,b.default)(t).endOf("day");return s.isAfter(c)&&s.isBefore(n)},w=e=>q(e.startDate,e.endDate),G=(0,h.cva)("h-2 w-full overflow-hidden",{variants:{state:{"active-light":"bg-[#F6CD4E]","inactive-light":"bg-[#EAEAEC]","active-dark":"bg-[#D79941]","inactive-dark":"bg-[#75787F]"}},defaultVariants:{state:"inactive-light"}}),J=(0,h.cva)("size-4 rounded-full transition-colors",{variants:{state:{"active-light":"bg-[#F6CD4E]","inactive-light":"bg-[#EAEAEC]","active-dark":"bg-[#D79941]","inactive-dark":"bg-[#75787F]"}},defaultVariants:{state:"inactive-light"}}),I=(0,h.cva)("font-bold leading-[1.2]",{variants:{state:{"active-light":"text-[#080A0F]","inactive-light":"text-[#4A4C56]","active-dark":"text-white","inactive-dark":"text-[#8A8D92]"}},defaultVariants:{state:"inactive-light"}}),K=(0,h.cva)("laptop:h-[160px] rounded-box relative flex h-[120px] min-w-0 flex-col justify-between gap-2 overflow-hidden",{variants:{state:{"active-light":"bg-[#F4E8BC]","inactive-light":"bg-[#EAEAEC]","active-dark":"bg-[#D79941]","inactive-dark":"bg-[#1E2024]"}},defaultVariants:{state:"inactive-light"}}),Q=({active:e,theme:t="light",className:s,index:c,nodeLength:n})=>{const o=`${e?"active":"inactive"}-${t}`,r=c===0,d=c===n-1;return(0,a.jsxs)("div",{className:"relative my-1 flex h-2 w-full items-center justify-center",children:[(0,a.jsx)("div",{className:(0,p.cn)(G({state:o}),r&&"rounded-l-full",d&&"rounded-r-full",s)}),(0,a.jsx)("div",{className:"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",children:(0,a.jsx)("div",{className:J({state:o})})})]})},U=(e,t)=>{if(e)return t?e.active:e.inactive},W=({active:e,item:t,theme:s="light",className:c})=>{const n=l.useMemo(()=>U(t.icon,e),[t.icon,e]),o=`${e?"active":"inactive"}-${s}`;return(0,a.jsxs)("div",{className:(0,p.cn)(K({state:o}),c),children:[n&&(0,a.jsx)("div",{className:"laptop:w-[128px] desktop:w-[160px] absolute bottom-0 right-0 z-10 w-[120px]",children:(0,a.jsx)(v.Picture,{source:n.url,alt:n.alt,className:"aspect-square"})}),(0,a.jsxs)("div",{className:"tablet:px-4 tablet:py-3 laptop:p-4 desktop:px-6 relative z-20 flex h-full flex-col justify-between px-6 py-4",children:[(0,a.jsx)(v.Heading,{html:t.title,className:(0,p.cn)("desktop:text-[32px] laptop:text-[24px] line-clamp-1 text-[20px]",I({state:o}))}),(0,a.jsx)("div",{className:"flex flex-col gap-0.5",children:t.items.map((r,d)=>(0,a.jsxs)("div",{className:"flex items-center gap-2",children:[r.icon&&(0,a.jsx)("div",{className:"desktop:size-6 size-5 shrink-0",children:(0,a.jsx)(v.Picture,{source:r.icon.url,alt:r.icon.alt,className:"size-full"})}),(0,a.jsx)(v.Text,{html:r.label,className:(0,p.cn)("lg-desktop:text-[18px] desktop:text-[16px] line-clamp-1 flex-1 text-[14px] leading-[1.4]",I({state:o}))})]},d))})]})]})},V=l.forwardRef(({classNames:e={},data:t},s)=>{const c=t.theme||"light",n=l.useRef(null),o=l.useRef(null),r=l.useRef(!1),d=l.useMemo(()=>t?.scheduleList?.length||2,[t?.scheduleList]),g=l.useMemo(()=>t.scheduleList.findIndex(i=>w(i)),[t.scheduleList]),x=l.useCallback((i,m=!1)=>{const u=P=>{switch(P){case"mobile":return{slidesPerView:1.17};case"tablet":return i===2?{slidesPerView:2}:{slidesPerView:2.4};case"laptop":return i===2?{}:i===4?{slidesPerView:3.2}:{slidesPerView:i};case"desktop":return i===2?{slidesPerView:2}:{slidesPerView:i}}},N=u("mobile"),E=u("tablet"),T=u("laptop"),y=u("desktop");return m?{0:{...N,spaceBetween:12},768:{...E,spaceBetween:i===1?12:void 0},1024:{...T,spaceBetween:16},1440:{...y,spaceBetween:16}}:{0:N,768:E,1024:T,1440:y}},[]),D=l.useMemo(()=>x(d,!0),[d,x]),L=l.useMemo(()=>x(d,!1),[d,x]),k=t.showTimeline!==!1,M=l.useCallback(i=>{r.current||!o.current||(r.current=!0,o.current.slideTo(i.activeIndex,i.params.speed),setTimeout(()=>{r.current=!1},50))},[]),B=l.useCallback(i=>{r.current||!n.current||(r.current=!0,n.current.slideTo(i.activeIndex,i.params.speed),setTimeout(()=>{r.current=!1},50))},[]);return l.useEffect(()=>{n.current&&o.current&&g>=0&&setTimeout(()=>{r.current=!0,n.current?.slideTo(g,500),o.current?.slideTo(g,500),setTimeout(()=>{r.current=!1},600)},100)},[g]),(0,a.jsxs)("div",{ref:s,className:(0,p.cn)("tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] overflow-hidden px-4",e?.root),children:[k&&(0,a.jsx)(f.Swiper,{breakpoints:L,className:"h-4 w-full !overflow-visible",onSwiper:i=>{o.current=i},onSlideChange:B,children:t.scheduleList.map((i,m)=>{const u=w(i);return(0,a.jsx)(f.SwiperSlide,{className:"",children:(0,a.jsx)(Q,{className:e?.timeline,active:u,theme:c,index:m,nodeLength:t.scheduleList.length})},"timelineNode"+m)})}),(0,a.jsx)(f.Swiper,{breakpoints:D,className:"w-full !overflow-visible",onSwiper:i=>{n.current=i},onSlideChange:M,children:t.scheduleList.map((i,m)=>{const u=w(i);return(0,a.jsx)(f.SwiperSlide,{children:(0,a.jsx)(W,{active:u,className:(0,p.cn)(k?"laptop:mt-4 mt-2":"",e?.eventScheduleCard),item:i,theme:c})},"SwiperSlideItem"+m)})})]})});V.displayName="EventSchedule";var X=V;
1
+ "use strict";"use client";var F=Object.create;var S=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var $=(e,t)=>{for(var a in t)S(e,a,{get:t[a],enumerable:!0})},y=(e,t,a,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of R(t))!H.call(e,s)&&s!==a&&S(e,s,{get:()=>t[s],enumerable:!(c=z(t,s))||c.enumerable});return e};var A=(e,t,a)=>(a=e!=null?F(j(e)):{},y(t||!e||!e.__esModule?S(a,"default",{value:e,enumerable:!0}):a,e)),O=e=>y(S({},"__esModule",{value:!0}),e);var Y={};$(Y,{default:()=>X});module.exports=O(Y);var n=require("react/jsx-runtime"),l=A(require("react")),p=require("../../helpers/index.js"),v=require("../../components/index.js"),h=require("swiper/react"),b=A(require("dayjs")),g=require("class-variance-authority");const q=(e,t)=>{const a=(0,b.default)(),c=(0,b.default)(e).startOf("day"),s=(0,b.default)(t).endOf("day");return a.isAfter(c)&&a.isBefore(s)},w=e=>q(e.startDate,e.endDate),G=(0,g.cva)("h-1 w-full overflow-hidden",{variants:{state:{"active-light":"bg-[#F6CD4E]","inactive-light":"bg-[#EAEAEC]","active-dark":"bg-[#D79941]","inactive-dark":"bg-[#75787F]"}},defaultVariants:{state:"inactive-light"}}),J=(0,g.cva)("size-4 rounded-full transition-colors",{variants:{state:{"active-light":"bg-[#F6CD4E]","inactive-light":"bg-[#EAEAEC]","active-dark":"bg-[#D79941]","inactive-dark":"bg-[#75787F]"}},defaultVariants:{state:"inactive-light"}}),I=(0,g.cva)("font-bold leading-[1.2]",{variants:{state:{"active-light":"text-[#080A0F]","inactive-light":"text-[#4A4C56]","active-dark":"text-white","inactive-dark":"text-[#8A8D92]"}},defaultVariants:{state:"inactive-light"}}),K=(0,g.cva)("laptop:h-[160px] rounded-box relative flex h-[120px] min-w-0 flex-col justify-between gap-2 overflow-hidden",{variants:{state:{"active-light":"bg-[#F4E8BC]","inactive-light":"bg-[#EAEAEC]","active-dark":"bg-[#D79941]","inactive-dark":"bg-[#1E2024]"}},defaultVariants:{state:"inactive-light"}}),Q=({active:e,theme:t="light",className:a,index:c,nodeLength:s})=>{const o=`${e?"active":"inactive"}-${t}`,r=c===0,d=c===s-1;return(0,n.jsxs)("div",{className:"relative my-2 flex h-1 w-full items-center justify-center",children:[(0,n.jsx)("div",{className:(0,p.cn)(G({state:o}),r&&"rounded-l-full",d&&"rounded-r-full",a)}),(0,n.jsx)("div",{className:"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",children:(0,n.jsx)("div",{className:J({state:o})})})]})},U=(e,t)=>{if(e)return t?e.active:e.inactive},W=({active:e,item:t,theme:a="light",className:c,scheduleCount:s})=>{const o=l.useMemo(()=>U(t.icon,e),[t.icon,e]),r=`${e?"active":"inactive"}-${a}`;return(0,n.jsxs)("div",{className:(0,p.cn)(K({state:r}),c),children:[o&&(0,n.jsx)("div",{className:"laptop:w-[128px] desktop:w-[160px] absolute bottom-0 right-0 z-10 w-[120px]",children:(0,n.jsx)(v.Picture,{source:o.url,alt:o.alt,className:"aspect-square"})}),(0,n.jsxs)("div",{className:"tablet:px-4 tablet:py-3 desktop:pl-6 desktop:pr-16 relative z-20 flex h-full flex-col justify-between p-4 pr-8",children:[(0,n.jsx)(v.Heading,{html:t.title,className:(0,p.cn)(s>=4?"desktop:text-[24px]":"desktop:text-[32px]","laptop:text-[24px] line-clamp-1 text-[20px]",I({state:r}))}),(0,n.jsx)("div",{className:"flex flex-col gap-0.5",children:t.items.map((d,m)=>(0,n.jsxs)("div",{className:"flex items-center gap-2",children:[d.icon&&(0,n.jsx)("div",{className:"desktop:size-6 size-5 shrink-0",children:(0,n.jsx)(v.Picture,{source:d.icon.url,alt:d.icon.alt,className:"size-full"})}),(0,n.jsx)(v.Text,{html:d.label,className:(0,p.cn)("lg-desktop:text-[18px] desktop:text-[16px] line-clamp-1 flex-1 text-[14px] leading-[1.4]",I({state:r}))})]},m))})]})]})},L=l.forwardRef(({classNames:e={},data:t},a)=>{const c=t.theme||"light",s=l.useRef(null),o=l.useRef(null),r=l.useRef(!1),d=l.useMemo(()=>t?.scheduleList?.length||2,[t?.scheduleList]),m=l.useMemo(()=>t.scheduleList.findIndex(i=>w(i)),[t.scheduleList]),x=l.useCallback((i,f=!1)=>{const u=P=>{switch(P){case"mobile":return{slidesPerView:1.17};case"tablet":return i===2?{slidesPerView:2}:{slidesPerView:2.4};case"laptop":return i===2?{}:i===4?{slidesPerView:3.2}:{slidesPerView:i};case"desktop":return i===2?{slidesPerView:2}:{slidesPerView:i}}},N=u("mobile"),E=u("tablet"),C=u("laptop"),T=u("desktop");return f?{0:{...N,spaceBetween:12},768:{...E,spaceBetween:i===1?12:void 0},1024:{...C,spaceBetween:16},1440:{...T,spaceBetween:16}}:{0:N,768:E,1024:C,1440:T}},[]),V=l.useMemo(()=>x(d,!0),[d,x]),D=l.useMemo(()=>x(d,!1),[d,x]),k=t.showTimeline!==!1,M=l.useCallback(i=>{r.current||!o.current||(r.current=!0,o.current.slideTo(i.activeIndex,i.params.speed),setTimeout(()=>{r.current=!1},50))},[]),B=l.useCallback(i=>{r.current||!s.current||(r.current=!0,s.current.slideTo(i.activeIndex,i.params.speed),setTimeout(()=>{r.current=!1},50))},[]);return l.useEffect(()=>{s.current&&o.current&&m>=0&&setTimeout(()=>{r.current=!0,s.current?.slideTo(m,500),o.current?.slideTo(m,500),setTimeout(()=>{r.current=!1},600)},100)},[m]),(0,n.jsxs)("div",{ref:a,className:(0,p.cn)("tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] overflow-hidden px-4",e?.root),children:[k&&(0,n.jsx)(h.Swiper,{breakpoints:D,className:"h-4 w-full !overflow-visible",onSwiper:i=>{o.current=i},onSlideChange:B,children:t.scheduleList.map((i,f)=>{const u=w(i);return(0,n.jsx)(h.SwiperSlide,{className:"",children:(0,n.jsx)(Q,{className:e?.timeline,active:u,theme:c,index:f,nodeLength:t.scheduleList.length})},"timelineNode"+f)})}),(0,n.jsx)(h.Swiper,{breakpoints:V,className:"w-full !overflow-visible",onSwiper:i=>{s.current=i},onSlideChange:M,children:t.scheduleList.map((i,f)=>{const u=w(i);return(0,n.jsx)(h.SwiperSlide,{children:(0,n.jsx)(W,{active:u,className:(0,p.cn)(k?"laptop:mt-4 mt-2":"",e?.eventScheduleCard),item:i,theme:c,scheduleCount:t.scheduleList.length})},"SwiperSlideItem"+f)})})]})});L.displayName="EventSchedule";var X=L;
2
2
  //# sourceMappingURL=index.js.map
package/dist/cjs/biz-components/EventSchedule/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/EventSchedule/index.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Text, Picture, Heading } from '../../components/index.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport type { Swiper as SwiperType } from 'swiper'\nimport dayjs from 'dayjs'\nimport { cva } from 'class-variance-authority'\nimport type { Media } from '../../types/props.js'\nexport type EventScheduleSemanticName = 'root' | 'timeline' | 'eventScheduleCard'\n\n/**\n * \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n */\nexport interface StateIcon {\n /** \u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807 */\n active: Media\n /** \u975E\u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807 */\n inactive: Media\n}\n\n/**\n * \u6D3B\u52A8\u65E5\u7A0B\u9879\u6570\u636E\u63A5\u53E3\n */\nexport interface EventScheduleItem {\n /** \u6807\u9898 */\n title: string\n /** \u5F00\u59CB\u65E5\u671F\uFF08ISO 8601 \u683C\u5F0F\u6216\u4EFB\u4F55 dayjs \u652F\u6301\u7684\u683C\u5F0F\uFF0C\u5982 '2024-12-01'\uFF09 */\n startDate: string\n /** \u7ED3\u675F\u65E5\u671F\uFF08ISO 8601 \u683C\u5F0F\u6216\u4EFB\u4F55 dayjs \u652F\u6301\u7684\u683C\u5F0F\uFF0C\u5982 '2024-12-31'\uFF09 */\n endDate: string\n /**\n * \u5361\u7247\u80CC\u666F\u56FE\u6807\u914D\u7F6E\uFF0C\u72B6\u6001\u5316\u56FE\u6807\uFF08\u5FC5\u987B\u5305\u542B active \u548C inactive\uFF09\n *\n * @example\n * icon: {\n * active: { url: \"https://example.com/active-icon.svg\", alt: \"Active Icon\" },\n * inactive: { url: \"https://example.com/inactive-icon.svg\", alt: \"Inactive Icon\" }\n * }\n */\n icon?: StateIcon\n /** \u8BE6\u7EC6\u4FE1\u606F\u5217\u8868 */\n items: {\n /** \u56FE\u6807 (SVG \u5B57\u7B26\u4E32\u6216 URL) */\n icon?: Media\n /** \u6587\u672C\u5185\u5BB9 */\n label: string\n }[]\n}\n\n/**\n * EventSchedule \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface EventScheduleData {\n /** \u65E5\u7A0B\u5217\u8868 */\n scheduleList: EventScheduleItem[]\n /** \u662F\u5426\u663E\u793A\u65F6\u95F4\u8F74\uFF0C\u9ED8\u8BA4\u4E3A true */\n showTimeline?: boolean\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n}\n\nexport interface EventScheduleProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: EventScheduleData\n classNames?: Partial<Record<EventScheduleSemanticName, string>>\n}\n\n/**\n * \u5224\u65AD\u5F53\u524D\u65F6\u95F4\u662F\u5426\u5728\u6307\u5B9A\u7684\u65F6\u95F4\u533A\u95F4\u5185\n * @param startDate \u5F00\u59CB\u65E5\u671F\n * @param endDate \u7ED3\u675F\u65E5\u671F\n * @returns \u662F\u5426\u5728\u533A\u95F4\u5185\n */\nconst isInTimeRange = (startDate: string, endDate: string): boolean => {\n const now = dayjs()\n const start = dayjs(startDate).startOf('day')\n const end = dayjs(endDate).endOf('day')\n return now.isAfter(start) && now.isBefore(end)\n}\n\n/**\n * \u83B7\u53D6\u6D3B\u52A8\u9879\u7684\u6FC0\u6D3B\u72B6\u6001\n * @param item \u6D3B\u52A8\u9879\n * @returns \u662F\u5426\u6FC0\u6D3B\n */\nconst getItemActiveStatus = (item: EventScheduleItem): boolean => {\n // \u5426\u5219\u6839\u636E\u65F6\u95F4\u533A\u95F4\u81EA\u52A8\u5224\u65AD\n return isInTimeRange(item.startDate, item.endDate)\n}\n\n/**\n * \u65F6\u95F4\u8F74\u8FDB\u5EA6\u6761\u6FC0\u6D3B\u72B6\u6001\u6837\u5F0F\u53D8\u4F53\n */\nconst timelineProgressActiveVariants = cva('h-2 w-full overflow-hidden', {\n variants: {\n state: {\n 'active-light': 'bg-[#F6CD4E]',\n 'inactive-light': 'bg-[#EAEAEC]',\n 'active-dark': 'bg-[#D79941]',\n 'inactive-dark': 'bg-[#75787F]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n})\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u6FC0\u6D3B\u72B6\u6001\u6837\u5F0F\u53D8\u4F53\n */\nconst timelineNodeActiveVariants = cva('size-4 rounded-full transition-colors', {\n variants: {\n state: {\n 'active-light': 'bg-[#F6CD4E]',\n 'inactive-light': 'bg-[#EAEAEC]',\n 'active-dark': 'bg-[#D79941]',\n 'inactive-dark': 'bg-[#75787F]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n})\n\n/**\n * \u5361\u7247\u6587\u672C\u6837\u5F0F\u53D8\u4F53\n */\nconst cardTextVariants = cva('font-bold leading-[1.2]', {\n variants: {\n state: {\n 'active-light': 'text-[#080A0F]',\n 'inactive-light': 'text-[#4A4C56]',\n 'active-dark': 'text-white',\n 'inactive-dark': 'text-[#8A8D92]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n})\n\n/**\n * \u5361\u7247\u5BB9\u5668\u6837\u5F0F\u53D8\u4F53\n */\nconst eventScheduleCardVariants = cva(\n 'laptop:h-[160px] rounded-box relative flex h-[120px] min-w-0 flex-col justify-between gap-2 overflow-hidden',\n {\n variants: {\n state: {\n 'active-light': 'bg-[#F4E8BC]',\n 'inactive-light': 'bg-[#EAEAEC]',\n 'active-dark': 'bg-[#D79941]',\n 'inactive-dark': 'bg-[#1E2024]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n }\n)\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u7EC4\u4EF6 Props\n */\ninterface TimelineNodeProps {\n /** \u662F\u5426\u6FC0\u6D3B\u72B6\u6001 */\n active: boolean\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n /** \u5F53\u524D\u8282\u70B9\u7D22\u5F15 */\n index: number\n /** \u8282\u70B9\u603B\u6570 */\n nodeLength: number\n}\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u7EC4\u4EF6\n */\nconst TimelineNode = ({ active, theme = 'light', className, index, nodeLength }: TimelineNodeProps) => {\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const state = `${active ? 'active' : 'inactive'}-${theme}` as\n | 'active-light'\n | 'inactive-light'\n | 'active-dark'\n | 'inactive-dark'\n\n // \u5224\u65AD\u9996\u5C3E\u4F4D\u7F6E\n const isFirst = index === 0\n const isLast = index === nodeLength - 1\n\n return (\n <div className=\"relative my-1 flex h-2 w-full items-center justify-center\">\n {/* \u8FDB\u5EA6\u6761\u80CC\u666F */}\n <div\n className={cn(\n timelineProgressActiveVariants({ state }),\n isFirst && 'rounded-l-full',\n isLast && 'rounded-r-full',\n className\n )}\n />\n {/* \u65F6\u95F4\u8282\u70B9\u5706\u70B9 */}\n <div className=\"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2\">\n <div className={timelineNodeActiveVariants({ state })} />\n </div>\n </div>\n )\n}\n\n/**\n * \u6839\u636E\u6FC0\u6D3B\u72B6\u6001\u83B7\u53D6\u5BF9\u5E94\u7684\u56FE\u6807\n * @param icon \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n * @param isActive \u662F\u5426\u6FC0\u6D3B\u72B6\u6001\n * @returns \u56FE\u6807 Media \u5BF9\u8C61\n */\nconst getIconByState = (icon: StateIcon | undefined, isActive: boolean): Media | undefined => {\n if (!icon) return undefined\n return isActive ? icon.active : icon.inactive\n}\n\n/**\n * \u6D3B\u52A8\u65E5\u7A0B\u5361\u7247\u7EC4\u4EF6\n */\nconst EventScheduleCard = ({\n active,\n item,\n theme = 'light',\n className,\n}: {\n active: boolean\n item: EventScheduleItem\n theme?: 'light' | 'dark'\n className?: string\n}) => {\n const currentIcon = React.useMemo(() => {\n return getIconByState(item.icon, active)\n }, [item.icon, active])\n\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const cardState = `${active ? 'active' : 'inactive'}-${theme}` as\n | 'active-light'\n | 'inactive-light'\n | 'active-dark'\n | 'inactive-dark'\n\n return (\n <div className={cn(eventScheduleCardVariants({ state: cardState }), className)}>\n {/* \u80CC\u666F\u56FE\u6807 */}\n {currentIcon && (\n <div className=\"laptop:w-[128px] desktop:w-[160px] absolute bottom-0 right-0 z-10 w-[120px]\">\n <Picture source={currentIcon.url} alt={currentIcon.alt} className=\"aspect-square\" />\n </div>\n )}\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"tablet:px-4 tablet:py-3 laptop:p-4 desktop:px-6 relative z-20 flex h-full flex-col justify-between px-6 py-4\">\n <Heading\n html={item.title}\n className={cn(\n 'desktop:text-[32px] laptop:text-[24px] line-clamp-1 text-[20px]',\n cardTextVariants({ state: cardState })\n )}\n />\n {/* \u8BE6\u7EC6\u4FE1\u606F\u5217\u8868 */}\n <div className=\"flex flex-col gap-0.5\">\n {item.items.map((detail, index) => (\n <div key={index} className=\"flex items-center gap-2\">\n {/* \u56FE\u6807 */}\n {detail.icon && (\n <div className=\"desktop:size-6 size-5 shrink-0\">\n <Picture source={detail.icon.url} alt={detail.icon.alt} className=\"size-full\" />\n </div>\n )}\n {/* \u6587\u672C */}\n <Text\n html={detail.label}\n className={cn(\n 'lg-desktop:text-[18px] desktop:text-[16px] line-clamp-1 flex-1 text-[14px] leading-[1.4]',\n cardTextVariants({ state: cardState })\n )}\n />\n </div>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\n/**\n * EventSchedule - \u6D3B\u52A8\u65E5\u7A0B\u7EC4\u4EF6\n *\n * @description \u663E\u793A\u6D3B\u52A8\u65E5\u7A0B\u65F6\u95F4\u8F74\u548C\u6D3B\u52A8\u5361\u7247\u5217\u8868\n */\nconst EventSchedule = React.forwardRef<HTMLDivElement, EventScheduleProps>(({ classNames = {}, data }, ref) => {\n const theme = data.theme || 'light'\n const swiperRef = React.useRef<SwiperType | null>(null)\n const timelineSwiperRef = React.useRef<SwiperType | null>(null)\n const isSyncingRef = React.useRef(false) // \u9632\u6B62\u5FAA\u73AF\u89E6\u53D1\n const itemsPerRow = React.useMemo(() => {\n return data?.scheduleList?.length || 2\n }, [data?.scheduleList])\n\n // \u8BA1\u7B97 active item \u7684\u7D22\u5F15\n const activeIndex = React.useMemo(() => {\n return data.scheduleList.findIndex(item => getItemActiveStatus(item))\n }, [data.scheduleList])\n\n /**\n * \u751F\u6210\u7EDF\u4E00\u7684 Swiper \u65AD\u70B9\u914D\u7F6E\n * @param itemsPerRow \u6BCF\u884C\u663E\u793A\u7684\u9879\u76EE\u6570\n * @param withSpaceBetween \u662F\u5426\u5305\u542B\u95F4\u8DDD\u914D\u7F6E\n * @returns Swiper \u65AD\u70B9\u914D\u7F6E\u5BF9\u8C61\n */\n const generateSwiperBreakpoints = React.useCallback((itemsPerRow: number, withSpaceBetween: boolean = false) => {\n // \u6839\u636E itemsPerRow \u786E\u5B9A\u4E0D\u540C\u65AD\u70B9\u4E0B\u7684 slidesPerView\n const getBreakpointConfig = (breakpoint: 'mobile' | 'tablet' | 'laptop' | 'desktop') => {\n switch (breakpoint) {\n case 'mobile':\n return { slidesPerView: 1.17 }\n case 'tablet':\n if (itemsPerRow === 2) return { slidesPerView: 2 }\n return { slidesPerView: 2.4 }\n case 'laptop':\n if (itemsPerRow === 2) return {}\n if (itemsPerRow === 4) return { slidesPerView: 3.2 }\n return { slidesPerView: itemsPerRow }\n case 'desktop':\n if (itemsPerRow === 2) return { slidesPerView: 2 }\n return { slidesPerView: itemsPerRow }\n }\n }\n\n const mobileConfig = getBreakpointConfig('mobile')\n const tabletConfig = getBreakpointConfig('tablet')\n const laptopConfig = getBreakpointConfig('laptop')\n const desktopConfig = getBreakpointConfig('desktop')\n\n // \u5982\u679C\u9700\u8981 spaceBetween\uFF0C\u5219\u6DFB\u52A0\u5230\u914D\u7F6E\u4E2D\n if (withSpaceBetween) {\n return {\n 0: { ...mobileConfig, spaceBetween: 12 },\n 768: { ...tabletConfig, spaceBetween: itemsPerRow === 1 ? 12 : undefined },\n 1024: { ...laptopConfig, spaceBetween: 16 },\n 1440: { ...desktopConfig, spaceBetween: 16 },\n }\n }\n\n return {\n 0: mobileConfig,\n 768: tabletConfig,\n 1024: laptopConfig,\n 1440: desktopConfig,\n }\n }, [])\n\n // \u6839\u636E itemsPerRow \u914D\u7F6E\u54CD\u5E94\u5F0F\u65AD\u70B9\uFF08\u5361\u7247 Swiper - \u5305\u542B\u95F4\u8DDD\uFF09\n const swiperBreakpoints = React.useMemo(() => {\n return generateSwiperBreakpoints(itemsPerRow, true)\n }, [itemsPerRow, generateSwiperBreakpoints])\n\n // \u65F6\u95F4\u8F74 Swiper \u65AD\u70B9\u914D\u7F6E\uFF08\u4E0D\u5305\u542B\u95F4\u8DDD\uFF09\n const timeNodeSwiperBreakpoints = React.useMemo(() => {\n return generateSwiperBreakpoints(itemsPerRow, false)\n }, [itemsPerRow, generateSwiperBreakpoints])\n\n const showTimeline = data.showTimeline !== false // \u9ED8\u8BA4\u4E3A true\n\n // \u540C\u6B65\u4E24\u4E2A Swiper \u7684\u6ED1\u52A8\n const handleCardSwiperSlideChange = React.useCallback((swiper: SwiperType) => {\n if (isSyncingRef.current || !timelineSwiperRef.current) return\n isSyncingRef.current = true\n timelineSwiperRef.current.slideTo(swiper.activeIndex, swiper.params.speed)\n // \u5EF6\u8FDF\u91CD\u7F6E\u6807\u5FD7\uFF0C\u786E\u4FDD\u540C\u6B65\u5B8C\u6210\n setTimeout(() => {\n isSyncingRef.current = false\n }, 50)\n }, [])\n\n const handleTimelineSwiperSlideChange = React.useCallback((swiper: SwiperType) => {\n if (isSyncingRef.current || !swiperRef.current) return\n isSyncingRef.current = true\n swiperRef.current.slideTo(swiper.activeIndex, swiper.params.speed)\n // \u5EF6\u8FDF\u91CD\u7F6E\u6807\u5FD7\uFF0C\u786E\u4FDD\u540C\u6B65\u5B8C\u6210\n setTimeout(() => {\n isSyncingRef.current = false\n }, 50)\n }, [])\n\n // \u81EA\u52A8\u6EDA\u52A8\u5230 active item\n React.useEffect(() => {\n if (swiperRef.current && timelineSwiperRef.current && activeIndex >= 0) {\n // \u5EF6\u8FDF\u6267\u884C\uFF0C\u786E\u4FDD Swiper \u5DF2\u7ECF\u5B8C\u5168\u521D\u59CB\u5316\n setTimeout(() => {\n isSyncingRef.current = true\n swiperRef.current?.slideTo(activeIndex, 500)\n timelineSwiperRef.current?.slideTo(activeIndex, 500)\n setTimeout(() => {\n isSyncingRef.current = false\n }, 600)\n }, 100)\n }\n }, [activeIndex])\n\n return (\n <div\n ref={ref}\n className={cn(\n 'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] overflow-hidden px-4',\n classNames?.root\n )}\n >\n {showTimeline && (\n <Swiper\n breakpoints={timeNodeSwiperBreakpoints}\n className=\"h-4 w-full !overflow-visible\"\n onSwiper={swiper => {\n timelineSwiperRef.current = swiper\n }}\n onSlideChange={handleTimelineSwiperSlideChange}\n >\n {data.scheduleList.map((item, index) => {\n const isActive = getItemActiveStatus(item)\n return (\n <SwiperSlide key={'timelineNode' + index} className=\"\">\n <TimelineNode\n className={classNames?.timeline}\n active={isActive}\n theme={theme}\n index={index}\n nodeLength={data.scheduleList.length}\n />\n </SwiperSlide>\n )\n })}\n </Swiper>\n )}\n <Swiper\n breakpoints={swiperBreakpoints}\n className=\"w-full !overflow-visible\"\n onSwiper={swiper => {\n swiperRef.current = swiper\n }}\n onSlideChange={handleCardSwiperSlideChange}\n >\n {data.scheduleList.map((item, index) => {\n const isActive = getItemActiveStatus(item)\n return (\n <SwiperSlide key={'SwiperSlideItem' + index}>\n <EventScheduleCard\n active={isActive}\n className={cn(showTimeline ? 'laptop:mt-4 mt-2' : '', classNames?.eventScheduleCard)}\n item={item}\n theme={theme}\n />\n </SwiperSlide>\n )\n })}\n </Swiper>\n </div>\n )\n})\n\nEventSchedule.displayName = 'EventSchedule'\nexport default EventSchedule\n\n// \u5BFC\u51FA\u7C7B\u578B\u4F9B\u5916\u90E8\u4F7F\u7528\n// export type { StateIcon, EventScheduleItem, EventScheduleData, EventScheduleProps }\n"],
5
- "mappings": "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",
6
- "names": ["EventSchedule_exports", "__export", "EventSchedule_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "import_react", "import_dayjs", "import_class_variance_authority", "isInTimeRange", "startDate", "endDate", "now", "dayjs", "start", "end", "getItemActiveStatus", "item", "timelineProgressActiveVariants", "timelineNodeActiveVariants", "cardTextVariants", "eventScheduleCardVariants", "TimelineNode", "active", "theme", "className", "index", "nodeLength", "state", "isFirst", "isLast", "getIconByState", "icon", "isActive", "EventScheduleCard", "currentIcon", "cardState", "detail", "EventSchedule", "classNames", "data", "ref", "swiperRef", "timelineSwiperRef", "isSyncingRef", "itemsPerRow", "activeIndex", "generateSwiperBreakpoints", "withSpaceBetween", "getBreakpointConfig", "breakpoint", "mobileConfig", "tabletConfig", "laptopConfig", "desktopConfig", "swiperBreakpoints", "timeNodeSwiperBreakpoints", "showTimeline", "handleCardSwiperSlideChange", "swiper", "handleTimelineSwiperSlideChange"]
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Text, Picture, Heading } from '../../components/index.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport type { Swiper as SwiperType } from 'swiper'\nimport dayjs from 'dayjs'\nimport { cva } from 'class-variance-authority'\nimport type { Media } from '../../types/props.js'\nexport type EventScheduleSemanticName = 'root' | 'timeline' | 'eventScheduleCard'\n\n/**\n * \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n */\nexport interface StateIcon {\n /** \u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807 */\n active: Media\n /** \u975E\u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807 */\n inactive: Media\n}\n\n/**\n * \u6D3B\u52A8\u65E5\u7A0B\u9879\u6570\u636E\u63A5\u53E3\n */\nexport interface EventScheduleItem {\n /** \u6807\u9898 */\n title: string\n /** \u5F00\u59CB\u65E5\u671F\uFF08ISO 8601 \u683C\u5F0F\u6216\u4EFB\u4F55 dayjs \u652F\u6301\u7684\u683C\u5F0F\uFF0C\u5982 '2024-12-01'\uFF09 */\n startDate: string\n /** \u7ED3\u675F\u65E5\u671F\uFF08ISO 8601 \u683C\u5F0F\u6216\u4EFB\u4F55 dayjs \u652F\u6301\u7684\u683C\u5F0F\uFF0C\u5982 '2024-12-31'\uFF09 */\n endDate: string\n /**\n * \u5361\u7247\u80CC\u666F\u56FE\u6807\u914D\u7F6E\uFF0C\u72B6\u6001\u5316\u56FE\u6807\uFF08\u5FC5\u987B\u5305\u542B active \u548C inactive\uFF09\n *\n * @example\n * icon: {\n * active: { url: \"https://example.com/active-icon.svg\", alt: \"Active Icon\" },\n * inactive: { url: \"https://example.com/inactive-icon.svg\", alt: \"Inactive Icon\" }\n * }\n */\n icon?: StateIcon\n /** \u8BE6\u7EC6\u4FE1\u606F\u5217\u8868 */\n items: {\n /** \u56FE\u6807 (SVG \u5B57\u7B26\u4E32\u6216 URL) */\n icon?: Media\n /** \u6587\u672C\u5185\u5BB9 */\n label: string\n }[]\n}\n\n/**\n * EventSchedule \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface EventScheduleData {\n /** \u65E5\u7A0B\u5217\u8868 */\n scheduleList: EventScheduleItem[]\n /** \u662F\u5426\u663E\u793A\u65F6\u95F4\u8F74\uFF0C\u9ED8\u8BA4\u4E3A true */\n showTimeline?: boolean\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n}\n\nexport interface EventScheduleProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: EventScheduleData\n classNames?: Partial<Record<EventScheduleSemanticName, string>>\n}\n\n/**\n * \u5224\u65AD\u5F53\u524D\u65F6\u95F4\u662F\u5426\u5728\u6307\u5B9A\u7684\u65F6\u95F4\u533A\u95F4\u5185\n * @param startDate \u5F00\u59CB\u65E5\u671F\n * @param endDate \u7ED3\u675F\u65E5\u671F\n * @returns \u662F\u5426\u5728\u533A\u95F4\u5185\n */\nconst isInTimeRange = (startDate: string, endDate: string): boolean => {\n const now = dayjs()\n const start = dayjs(startDate).startOf('day')\n const end = dayjs(endDate).endOf('day')\n return now.isAfter(start) && now.isBefore(end)\n}\n\n/**\n * \u83B7\u53D6\u6D3B\u52A8\u9879\u7684\u6FC0\u6D3B\u72B6\u6001\n * @param item \u6D3B\u52A8\u9879\n * @returns \u662F\u5426\u6FC0\u6D3B\n */\nconst getItemActiveStatus = (item: EventScheduleItem): boolean => {\n // \u5426\u5219\u6839\u636E\u65F6\u95F4\u533A\u95F4\u81EA\u52A8\u5224\u65AD\n return isInTimeRange(item.startDate, item.endDate)\n}\n\n/**\n * \u65F6\u95F4\u8F74\u8FDB\u5EA6\u6761\u6FC0\u6D3B\u72B6\u6001\u6837\u5F0F\u53D8\u4F53\n */\nconst timelineProgressActiveVariants = cva('h-1 w-full overflow-hidden', {\n variants: {\n state: {\n 'active-light': 'bg-[#F6CD4E]',\n 'inactive-light': 'bg-[#EAEAEC]',\n 'active-dark': 'bg-[#D79941]',\n 'inactive-dark': 'bg-[#75787F]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n})\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u6FC0\u6D3B\u72B6\u6001\u6837\u5F0F\u53D8\u4F53\n */\nconst timelineNodeActiveVariants = cva('size-4 rounded-full transition-colors', {\n variants: {\n state: {\n 'active-light': 'bg-[#F6CD4E]',\n 'inactive-light': 'bg-[#EAEAEC]',\n 'active-dark': 'bg-[#D79941]',\n 'inactive-dark': 'bg-[#75787F]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n})\n\n/**\n * \u5361\u7247\u6587\u672C\u6837\u5F0F\u53D8\u4F53\n */\nconst cardTextVariants = cva('font-bold leading-[1.2]', {\n variants: {\n state: {\n 'active-light': 'text-[#080A0F]',\n 'inactive-light': 'text-[#4A4C56]',\n 'active-dark': 'text-white',\n 'inactive-dark': 'text-[#8A8D92]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n})\n\n/**\n * \u5361\u7247\u5BB9\u5668\u6837\u5F0F\u53D8\u4F53\n */\nconst eventScheduleCardVariants = cva(\n 'laptop:h-[160px] rounded-box relative flex h-[120px] min-w-0 flex-col justify-between gap-2 overflow-hidden',\n {\n variants: {\n state: {\n 'active-light': 'bg-[#F4E8BC]',\n 'inactive-light': 'bg-[#EAEAEC]',\n 'active-dark': 'bg-[#D79941]',\n 'inactive-dark': 'bg-[#1E2024]',\n },\n },\n defaultVariants: {\n state: 'inactive-light',\n },\n }\n)\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u7EC4\u4EF6 Props\n */\ninterface TimelineNodeProps {\n /** \u662F\u5426\u6FC0\u6D3B\u72B6\u6001 */\n active: boolean\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n /** \u5F53\u524D\u8282\u70B9\u7D22\u5F15 */\n index: number\n /** \u8282\u70B9\u603B\u6570 */\n nodeLength: number\n}\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u7EC4\u4EF6\n */\nconst TimelineNode = ({ active, theme = 'light', className, index, nodeLength }: TimelineNodeProps) => {\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const state = `${active ? 'active' : 'inactive'}-${theme}` as\n | 'active-light'\n | 'inactive-light'\n | 'active-dark'\n | 'inactive-dark'\n\n // \u5224\u65AD\u9996\u5C3E\u4F4D\u7F6E\n const isFirst = index === 0\n const isLast = index === nodeLength - 1\n\n return (\n <div className=\"relative my-2 flex h-1 w-full items-center justify-center\">\n {/* \u8FDB\u5EA6\u6761\u80CC\u666F */}\n <div\n className={cn(\n timelineProgressActiveVariants({ state }),\n isFirst && 'rounded-l-full',\n isLast && 'rounded-r-full',\n className\n )}\n />\n {/* \u65F6\u95F4\u8282\u70B9\u5706\u70B9 */}\n <div className=\"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2\">\n <div className={timelineNodeActiveVariants({ state })} />\n </div>\n </div>\n )\n}\n\n/**\n * \u6839\u636E\u6FC0\u6D3B\u72B6\u6001\u83B7\u53D6\u5BF9\u5E94\u7684\u56FE\u6807\n * @param icon \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n * @param isActive \u662F\u5426\u6FC0\u6D3B\u72B6\u6001\n * @returns \u56FE\u6807 Media \u5BF9\u8C61\n */\nconst getIconByState = (icon: StateIcon | undefined, isActive: boolean): Media | undefined => {\n if (!icon) return undefined\n return isActive ? icon.active : icon.inactive\n}\n\n/**\n * \u6D3B\u52A8\u65E5\u7A0B\u5361\u7247\u7EC4\u4EF6\n */\nconst EventScheduleCard = ({\n active,\n item,\n theme = 'light',\n className,\n scheduleCount,\n}: {\n active: boolean\n item: EventScheduleItem\n theme?: 'light' | 'dark'\n className?: string\n scheduleCount: number\n}) => {\n const currentIcon = React.useMemo(() => {\n return getIconByState(item.icon, active)\n }, [item.icon, active])\n\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const cardState = `${active ? 'active' : 'inactive'}-${theme}` as\n | 'active-light'\n | 'inactive-light'\n | 'active-dark'\n | 'inactive-dark'\n\n return (\n <div className={cn(eventScheduleCardVariants({ state: cardState }), className)}>\n {/* \u80CC\u666F\u56FE\u6807 */}\n {currentIcon && (\n <div className=\"laptop:w-[128px] desktop:w-[160px] absolute bottom-0 right-0 z-10 w-[120px]\">\n <Picture source={currentIcon.url} alt={currentIcon.alt} className=\"aspect-square\" />\n </div>\n )}\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"tablet:px-4 tablet:py-3 desktop:pl-6 desktop:pr-16 relative z-20 flex h-full flex-col justify-between p-4 pr-8\">\n <Heading\n html={item.title}\n className={cn(\n scheduleCount >= 4 ? 'desktop:text-[24px]' : 'desktop:text-[32px]',\n 'laptop:text-[24px] line-clamp-1 text-[20px]',\n cardTextVariants({ state: cardState })\n )}\n />\n {/* \u8BE6\u7EC6\u4FE1\u606F\u5217\u8868 */}\n <div className=\"flex flex-col gap-0.5\">\n {item.items.map((detail, index) => (\n <div key={index} className=\"flex items-center gap-2\">\n {/* \u56FE\u6807 */}\n {detail.icon && (\n <div className=\"desktop:size-6 size-5 shrink-0\">\n <Picture source={detail.icon.url} alt={detail.icon.alt} className=\"size-full\" />\n </div>\n )}\n {/* \u6587\u672C */}\n <Text\n html={detail.label}\n className={cn(\n 'lg-desktop:text-[18px] desktop:text-[16px] line-clamp-1 flex-1 text-[14px] leading-[1.4]',\n cardTextVariants({ state: cardState })\n )}\n />\n </div>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\n/**\n * EventSchedule - \u6D3B\u52A8\u65E5\u7A0B\u7EC4\u4EF6\n *\n * @description \u663E\u793A\u6D3B\u52A8\u65E5\u7A0B\u65F6\u95F4\u8F74\u548C\u6D3B\u52A8\u5361\u7247\u5217\u8868\n */\nconst EventSchedule = React.forwardRef<HTMLDivElement, EventScheduleProps>(({ classNames = {}, data }, ref) => {\n const theme = data.theme || 'light'\n const swiperRef = React.useRef<SwiperType | null>(null)\n const timelineSwiperRef = React.useRef<SwiperType | null>(null)\n const isSyncingRef = React.useRef(false) // \u9632\u6B62\u5FAA\u73AF\u89E6\u53D1\n const itemsPerRow = React.useMemo(() => {\n return data?.scheduleList?.length || 2\n }, [data?.scheduleList])\n\n // \u8BA1\u7B97 active item \u7684\u7D22\u5F15\n const activeIndex = React.useMemo(() => {\n return data.scheduleList.findIndex(item => getItemActiveStatus(item))\n }, [data.scheduleList])\n\n /**\n * \u751F\u6210\u7EDF\u4E00\u7684 Swiper \u65AD\u70B9\u914D\u7F6E\n * @param itemsPerRow \u6BCF\u884C\u663E\u793A\u7684\u9879\u76EE\u6570\n * @param withSpaceBetween \u662F\u5426\u5305\u542B\u95F4\u8DDD\u914D\u7F6E\n * @returns Swiper \u65AD\u70B9\u914D\u7F6E\u5BF9\u8C61\n */\n const generateSwiperBreakpoints = React.useCallback((itemsPerRow: number, withSpaceBetween: boolean = false) => {\n // \u6839\u636E itemsPerRow \u786E\u5B9A\u4E0D\u540C\u65AD\u70B9\u4E0B\u7684 slidesPerView\n const getBreakpointConfig = (breakpoint: 'mobile' | 'tablet' | 'laptop' | 'desktop') => {\n switch (breakpoint) {\n case 'mobile':\n return { slidesPerView: 1.17 }\n case 'tablet':\n if (itemsPerRow === 2) return { slidesPerView: 2 }\n return { slidesPerView: 2.4 }\n case 'laptop':\n if (itemsPerRow === 2) return {}\n if (itemsPerRow === 4) return { slidesPerView: 3.2 }\n return { slidesPerView: itemsPerRow }\n case 'desktop':\n if (itemsPerRow === 2) return { slidesPerView: 2 }\n return { slidesPerView: itemsPerRow }\n }\n }\n\n const mobileConfig = getBreakpointConfig('mobile')\n const tabletConfig = getBreakpointConfig('tablet')\n const laptopConfig = getBreakpointConfig('laptop')\n const desktopConfig = getBreakpointConfig('desktop')\n\n // \u5982\u679C\u9700\u8981 spaceBetween\uFF0C\u5219\u6DFB\u52A0\u5230\u914D\u7F6E\u4E2D\n if (withSpaceBetween) {\n return {\n 0: { ...mobileConfig, spaceBetween: 12 },\n 768: { ...tabletConfig, spaceBetween: itemsPerRow === 1 ? 12 : undefined },\n 1024: { ...laptopConfig, spaceBetween: 16 },\n 1440: { ...desktopConfig, spaceBetween: 16 },\n }\n }\n\n return {\n 0: mobileConfig,\n 768: tabletConfig,\n 1024: laptopConfig,\n 1440: desktopConfig,\n }\n }, [])\n\n // \u6839\u636E itemsPerRow \u914D\u7F6E\u54CD\u5E94\u5F0F\u65AD\u70B9\uFF08\u5361\u7247 Swiper - \u5305\u542B\u95F4\u8DDD\uFF09\n const swiperBreakpoints = React.useMemo(() => {\n return generateSwiperBreakpoints(itemsPerRow, true)\n }, [itemsPerRow, generateSwiperBreakpoints])\n\n // \u65F6\u95F4\u8F74 Swiper \u65AD\u70B9\u914D\u7F6E\uFF08\u4E0D\u5305\u542B\u95F4\u8DDD\uFF09\n const timeNodeSwiperBreakpoints = React.useMemo(() => {\n return generateSwiperBreakpoints(itemsPerRow, false)\n }, [itemsPerRow, generateSwiperBreakpoints])\n\n const showTimeline = data.showTimeline !== false // \u9ED8\u8BA4\u4E3A true\n\n // \u540C\u6B65\u4E24\u4E2A Swiper \u7684\u6ED1\u52A8\n const handleCardSwiperSlideChange = React.useCallback((swiper: SwiperType) => {\n if (isSyncingRef.current || !timelineSwiperRef.current) return\n isSyncingRef.current = true\n timelineSwiperRef.current.slideTo(swiper.activeIndex, swiper.params.speed)\n // \u5EF6\u8FDF\u91CD\u7F6E\u6807\u5FD7\uFF0C\u786E\u4FDD\u540C\u6B65\u5B8C\u6210\n setTimeout(() => {\n isSyncingRef.current = false\n }, 50)\n }, [])\n\n const handleTimelineSwiperSlideChange = React.useCallback((swiper: SwiperType) => {\n if (isSyncingRef.current || !swiperRef.current) return\n isSyncingRef.current = true\n swiperRef.current.slideTo(swiper.activeIndex, swiper.params.speed)\n // \u5EF6\u8FDF\u91CD\u7F6E\u6807\u5FD7\uFF0C\u786E\u4FDD\u540C\u6B65\u5B8C\u6210\n setTimeout(() => {\n isSyncingRef.current = false\n }, 50)\n }, [])\n\n // \u81EA\u52A8\u6EDA\u52A8\u5230 active item\n React.useEffect(() => {\n if (swiperRef.current && timelineSwiperRef.current && activeIndex >= 0) {\n // \u5EF6\u8FDF\u6267\u884C\uFF0C\u786E\u4FDD Swiper \u5DF2\u7ECF\u5B8C\u5168\u521D\u59CB\u5316\n setTimeout(() => {\n isSyncingRef.current = true\n swiperRef.current?.slideTo(activeIndex, 500)\n timelineSwiperRef.current?.slideTo(activeIndex, 500)\n setTimeout(() => {\n isSyncingRef.current = false\n }, 600)\n }, 100)\n }\n }, [activeIndex])\n\n return (\n <div\n ref={ref}\n className={cn(\n 'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] overflow-hidden px-4',\n classNames?.root\n )}\n >\n {showTimeline && (\n <Swiper\n breakpoints={timeNodeSwiperBreakpoints}\n className=\"h-4 w-full !overflow-visible\"\n onSwiper={swiper => {\n timelineSwiperRef.current = swiper\n }}\n onSlideChange={handleTimelineSwiperSlideChange}\n >\n {data.scheduleList.map((item, index) => {\n const isActive = getItemActiveStatus(item)\n return (\n <SwiperSlide key={'timelineNode' + index} className=\"\">\n <TimelineNode\n className={classNames?.timeline}\n active={isActive}\n theme={theme}\n index={index}\n nodeLength={data.scheduleList.length}\n />\n </SwiperSlide>\n )\n })}\n </Swiper>\n )}\n <Swiper\n breakpoints={swiperBreakpoints}\n className=\"w-full !overflow-visible\"\n onSwiper={swiper => {\n swiperRef.current = swiper\n }}\n onSlideChange={handleCardSwiperSlideChange}\n >\n {data.scheduleList.map((item, index) => {\n const isActive = getItemActiveStatus(item)\n return (\n <SwiperSlide key={'SwiperSlideItem' + index}>\n <EventScheduleCard\n active={isActive}\n className={cn(showTimeline ? 'laptop:mt-4 mt-2' : '', classNames?.eventScheduleCard)}\n item={item}\n theme={theme}\n scheduleCount={data.scheduleList.length}\n />\n </SwiperSlide>\n )\n })}\n </Swiper>\n </div>\n )\n})\n\nEventSchedule.displayName = 'EventSchedule'\nexport default EventSchedule\n\n// \u5BFC\u51FA\u7C7B\u578B\u4F9B\u5916\u90E8\u4F7F\u7528\n// export type { StateIcon, EventScheduleItem, EventScheduleData, EventScheduleProps }\n"],
5
+ "mappings": "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",
6
+ "names": ["EventSchedule_exports", "__export", "EventSchedule_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "import_react", "import_dayjs", "import_class_variance_authority", "isInTimeRange", "startDate", "endDate", "now", "dayjs", "start", "end", "getItemActiveStatus", "item", "timelineProgressActiveVariants", "timelineNodeActiveVariants", "cardTextVariants", "eventScheduleCardVariants", "TimelineNode", "active", "theme", "className", "index", "nodeLength", "state", "isFirst", "isLast", "getIconByState", "icon", "isActive", "EventScheduleCard", "scheduleCount", "currentIcon", "cardState", "detail", "EventSchedule", "classNames", "data", "ref", "swiperRef", "timelineSwiperRef", "isSyncingRef", "itemsPerRow", "activeIndex", "generateSwiperBreakpoints", "withSpaceBetween", "getBreakpointConfig", "breakpoint", "mobileConfig", "tabletConfig", "laptopConfig", "desktopConfig", "swiperBreakpoints", "timeNodeSwiperBreakpoints", "showTimeline", "handleCardSwiperSlideChange", "swiper", "handleTimelineSwiperSlideChange"]
7
7
  }
package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var g=(t,n)=>{for(var l in n)a(t,l,{get:n[l],enumerable:!0})},x=(t,n,l,s)=>{if(n&&typeof n=="object"||typeof n=="function")for(let r of u(n))!f.call(t,r)&&r!==l&&a(t,r,{get:()=>n[r],enumerable:!(s=d(n,r))||s.enumerable});return t};var v=t=>x(a({},"__esModule",{value:!0}),t);var k={};g(k,{MenuItem:()=>h,SubSubCategoryContentComp:()=>y,SubSubCategoryItemComp:()=>N});module.exports=v(k);var e=require("react/jsx-runtime"),C=require("react"),o=require("../../components/index.js"),i=require("../../helpers/utils.js"),p=require("./icons/index.js"),c=require("./SidebarDropdown.js");const h=({label:t,href:n,onClick:l,active:s,icon:r,className:m})=>{const b=(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(o.Text,{html:t,className:(0,i.cn)("text-sm font-bold leading-[1.4]",{underline:r})}),r&&(0,e.jsx)(o.Text,{html:r,"aria-hidden":"true"})]}),(0,e.jsx)("svg",{className:`size-5 ${s?"rotate-90":""}`,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:(0,e.jsx)("path",{d:"M9 5L16 12L9 19",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})]});return n?(0,e.jsx)(o.Link,{href:n,className:(0,i.cn)("flex cursor-pointer items-center justify-between py-4 no-underline",m),onClick:l,children:b}):(0,e.jsx)("button",{onClick:l,className:(0,i.cn)("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left",m),"aria-expanded":s,children:b})},N=({matchSeriesMetadata:t,onSubSubCategoryItemClick:n,expanded:l})=>{const s=(0,e.jsxs)(e.Fragment,{children:[t?.label&&(0,e.jsx)(o.Text,{html:t?.label,className:"text-sm font-bold leading-[1.4]"}),n&&(0,e.jsx)(p.DownArrow,{"aria-hidden":"true",className:(0,i.cn)("size-5",{"rotate-180":l})})]});return n?(0,e.jsx)("button",{className:"tablet:pt-0 flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left",onClick:n,"aria-expanded":l,children:s}):(0,e.jsx)("div",{className:"tablet:pt-0 flex items-center justify-between py-4",children:s})},y=({matchSeriesMetadata:t})=>(0,e.jsx)("div",{className:"laptop:gap-3 flex flex-col gap-2",children:!!t?.series?.length&&t?.series?.map((n,l)=>(0,e.jsxs)("div",{children:[n.label&&(0,e.jsx)(o.Text,{html:n.label,as:"p",className:"mb-2 text-sm font-bold leading-[1.4] text-[#3D3D3F]"}),(0,e.jsxs)("div",{className:"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2",children:[!!t?.banner&&(0,e.jsx)(o.Link,{asChild:!t?.banner?.href,href:t?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(o.Picture,{source:t?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(o.Heading,{size:2,html:t?.banner?.title||"Buy in Guide",className:(0,i.cn)("font-bold text-white",{"text-black":t?.banner?.theme==="dark"})}),(0,e.jsx)(o.Text,{html:t?.banner?.desc||"20.000mAh",className:(0,i.cn)("text-sm font-bold text-white",{"text-black":t?.banner?.theme==="dark"})})]})]})}),n.products?.map((s,r)=>(0,e.jsx)(c.SeriesProductItem,{position:r,product:s,seriesLabel:t?.label,isCollection:t?.isCollection},`seriesProductItem-${l}-${r}`))]})]},`seriesItem-${l}`))});
1
+ "use strict";var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var g=(t,l)=>{for(var n in l)a(t,n,{get:l[n],enumerable:!0})},x=(t,l,n,i)=>{if(l&&typeof l=="object"||typeof l=="function")for(let r of u(l))!f.call(t,r)&&r!==n&&a(t,r,{get:()=>l[r],enumerable:!(i=d(l,r))||i.enumerable});return t};var v=t=>x(a({},"__esModule",{value:!0}),t);var k={};g(k,{MenuItem:()=>h,SubSubCategoryContentComp:()=>y,SubSubCategoryItemComp:()=>N});module.exports=v(k);var e=require("react/jsx-runtime"),C=require("react"),o=require("../../components/index.js"),s=require("../../helpers/utils.js"),p=require("./icons/index.js"),c=require("./SidebarDropdown.js");const h=({label:t,href:l,onClick:n,active:i,icon:r,className:b})=>{const m=(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(o.Text,{html:t,className:(0,s.cn)("text-sm font-bold leading-[1.4]",{underline:r})}),r&&(0,e.jsx)(o.Text,{html:r,"aria-hidden":"true"})]}),(0,e.jsx)("svg",{className:`size-5 ${i?"rotate-90":""}`,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:(0,e.jsx)("path",{d:"M9 5L16 12L9 19",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})]});return l?(0,e.jsx)(o.Link,{href:l,className:(0,s.cn)("flex cursor-pointer items-center justify-between py-4 no-underline",b),onClick:n,children:m}):(0,e.jsx)("button",{onClick:n,className:(0,s.cn)("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left",b),"aria-expanded":i,children:m})},N=({matchSeriesMetadata:t,onSubSubCategoryItemClick:l,expanded:n})=>{const i=(0,e.jsxs)(e.Fragment,{children:[t?.label&&(0,e.jsx)(o.Text,{html:t?.label,className:"text-sm font-bold leading-[1.4]"}),l&&(0,e.jsx)(p.DownArrow,{"aria-hidden":"true",className:(0,s.cn)("size-5",{"rotate-180":n})})]});return l?(0,e.jsx)("button",{className:"tablet:pt-0 flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left",onClick:l,"aria-expanded":n,children:i}):(0,e.jsx)("div",{className:"tablet:pt-0 flex items-center justify-between py-4",children:i})},y=({matchSeriesMetadata:t})=>(0,e.jsx)("div",{className:"laptop:gap-3 flex flex-col gap-2",children:!!t?.series?.length&&t?.series?.map((l,n)=>(0,e.jsxs)("div",{children:[l.label&&(0,e.jsx)(o.Text,{html:l.label,as:"p",className:"mb-2 text-sm font-bold leading-[1.4] text-[#3D3D3F]"}),(0,e.jsxs)("div",{className:"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2",children:[!!t?.banner&&(0,e.jsx)(o.Link,{asChild:!t?.banner?.href,href:t?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(o.Picture,{source:t?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(o.Heading,{size:2,html:t?.banner?.title||"Buy in Guide",className:(0,s.cn)("font-bold text-white",{"text-black":t?.banner?.theme==="dark"})}),(0,e.jsx)(o.Text,{html:t?.banner?.desc||"20.000mAh",className:(0,s.cn)("text-sm font-bold text-white",{"text-black":t?.banner?.theme==="dark"})})]})]})}),l.products?.map((i,r)=>(0,e.jsx)(c.SeriesProductItem,{position:r,product:i,seriesLabel:t?.label,isCollection:t?.isCollection},`seriesProductItem-${l?.label||""}-${n}-${r}`))]})]},`seriesItem-${l?.label||""}-${n}`))});
2
2
  //# sourceMappingURL=MobileMenuComponents.js.map
package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/HeaderNavigation/MobileMenuComponents.tsx"],
4
- "sourcesContent": ["import React from 'react'\nimport { Text, Link, Heading, Picture } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { DownArrow } from './icons/index.js'\nimport { SeriesProductItem } from './SidebarDropdown.js'\n\n/**\n * \u79FB\u52A8\u7AEF\u83DC\u5355\u9879\n */\nexport const MenuItem = ({\n label,\n href,\n onClick,\n active,\n icon,\n className,\n}: {\n label: string\n href?: string\n onClick?: () => void\n active?: boolean\n icon?: string\n className?: string\n}) => {\n const content = (\n <>\n <div className=\"flex items-center gap-4\">\n <Text html={label} className={cn('text-sm font-bold leading-[1.4]', { underline: icon })} />\n {icon && <Text html={icon} aria-hidden=\"true\" />}\n </div>\n <svg\n className={`size-5 ${active ? 'rotate-90' : ''}`}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path d=\"M9 5L16 12L9 19\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </>\n )\n\n return href ? (\n <Link\n href={href}\n className={cn('flex cursor-pointer items-center justify-between py-4 no-underline', className)}\n onClick={onClick}\n >\n {content}\n </Link>\n ) : (\n <button\n onClick={onClick}\n className={cn(\n 'flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left',\n className\n )}\n aria-expanded={active}\n >\n {content}\n </button>\n )\n}\n\n/**\n * \u79FB\u52A8\u7AEF\u5B50\u5206\u7C7B\u6807\u9898\u7EC4\u4EF6\n */\nexport const SubSubCategoryItemComp = ({\n matchSeriesMetadata,\n onSubSubCategoryItemClick,\n expanded,\n}: {\n matchSeriesMetadata: any\n onSubSubCategoryItemClick?: () => void\n expanded?: boolean\n}) => {\n const content = (\n <>\n {matchSeriesMetadata?.label && (\n <Text html={matchSeriesMetadata?.label} className=\"text-sm font-bold leading-[1.4]\" />\n )}\n {onSubSubCategoryItemClick && (\n <DownArrow\n aria-hidden=\"true\"\n className={cn('size-5', {\n ['rotate-180']: expanded,\n })}\n />\n )}\n </>\n )\n\n return onSubSubCategoryItemClick ? (\n <button\n className=\"tablet:pt-0 flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left\"\n onClick={onSubSubCategoryItemClick}\n aria-expanded={expanded}\n >\n {content}\n </button>\n ) : (\n <div className=\"tablet:pt-0 flex items-center justify-between py-4\">{content}</div>\n )\n}\n\n/**\n * \u79FB\u52A8\u7AEF\u5B50\u5206\u7C7B\u5185\u5BB9\u7EC4\u4EF6\n */\nexport const SubSubCategoryContentComp = ({ matchSeriesMetadata }: { matchSeriesMetadata: any }) => {\n return (\n <div className=\"laptop:gap-3 flex flex-col gap-2\">\n {!!matchSeriesMetadata?.series?.length &&\n matchSeriesMetadata?.series?.map((seriesItem: any, pIndex: number) => (\n <div key={`seriesItem-${pIndex}`}>\n {seriesItem.label && (\n <Text html={seriesItem.label} as=\"p\" className=\"mb-2 text-sm font-bold leading-[1.4] text-[#3D3D3F]\" />\n )}\n <div className=\"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2\">\n {!!matchSeriesMetadata?.banner && (\n <Link asChild={!matchSeriesMetadata?.banner?.href} href={matchSeriesMetadata?.banner?.href}>\n <div className=\"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Picture\n source={matchSeriesMetadata?.banner?.imageUrl}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={matchSeriesMetadata?.banner?.title || 'Buy in Guide'}\n className={cn('font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n <Text\n html={matchSeriesMetadata?.banner?.desc || '20.000mAh'}\n className={cn('text-sm font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n </div>\n </div>\n </Link>\n )}\n {seriesItem.products?.map((product: any, index: number) => (\n <SeriesProductItem\n position={index}\n key={`seriesProductItem-${pIndex}-${index}`}\n product={product}\n seriesLabel={matchSeriesMetadata?.label}\n isCollection={matchSeriesMetadata?.isCollection}\n />\n ))}\n </div>\n </div>\n ))}\n </div>\n )\n}\n"],
5
- "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,cAAAE,EAAA,8BAAAC,EAAA,2BAAAC,IAAA,eAAAC,EAAAL,GAyBI,IAAAM,EAAA,6BAzBJC,EAAkB,iBAClBC,EAA6C,qCAC7CC,EAAmB,kCACnBC,EAA0B,4BAC1BC,EAAkC,gCAK3B,MAAMT,EAAW,CAAC,CACvB,MAAAU,EACA,KAAAC,EACA,QAAAC,EACA,OAAAC,EACA,KAAAC,EACA,UAAAC,CACF,IAOM,CACJ,MAAMC,KACJ,oBACE,qBAAC,OAAI,UAAU,0BACb,oBAAC,QAAK,KAAMN,EAAO,aAAW,MAAG,kCAAmC,CAAE,UAAWI,CAAK,CAAC,EAAG,EACzFA,MAAQ,OAAC,QAAK,KAAMA,EAAM,cAAY,OAAO,GAChD,KACA,OAAC,OACC,UAAW,UAAUD,EAAS,YAAc,EAAE,GAC9C,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,cAAY,OAEZ,mBAAC,QAAK,EAAE,kBAAkB,OAAO,eAAe,YAAY,IAAI,cAAc,QAAQ,eAAe,QAAQ,EAC/G,GACF,EAGF,OAAOF,KACL,OAAC,QACC,KAAMA,EACN,aAAW,MAAG,qEAAsEI,CAAS,EAC7F,QAASH,EAER,SAAAI,EACH,KAEA,OAAC,UACC,QAASJ,EACT,aAAW,MACT,iGACAG,CACF,EACA,gBAAeF,EAEd,SAAAG,EACH,CAEJ,EAKad,EAAyB,CAAC,CACrC,oBAAAe,EACA,0BAAAC,EACA,SAAAC,CACF,IAIM,CACJ,MAAMH,KACJ,oBACG,UAAAC,GAAqB,UACpB,OAAC,QAAK,KAAMA,GAAqB,MAAO,UAAU,kCAAkC,EAErFC,MACC,OAAC,aACC,cAAY,OACZ,aAAW,MAAG,SAAU,CACrB,aAAeC,CAClB,CAAC,EACH,GAEJ,EAGF,OAAOD,KACL,OAAC,UACC,UAAU,6GACV,QAASA,EACT,gBAAeC,EAEd,SAAAH,EACH,KAEA,OAAC,OAAI,UAAU,qDAAsD,SAAAA,EAAQ,CAEjF,EAKaf,EAA4B,CAAC,CAAE,oBAAAgB,CAAoB,OAE5D,OAAC,OAAI,UAAU,mCACZ,UAAC,CAACA,GAAqB,QAAQ,QAC9BA,GAAqB,QAAQ,IAAI,CAACG,EAAiBC,OACjD,QAAC,OACE,UAAAD,EAAW,UACV,OAAC,QAAK,KAAMA,EAAW,MAAO,GAAG,IAAI,UAAU,sDAAsD,KAEvG,QAAC,OAAI,UAAU,kGACZ,WAAC,CAACH,GAAqB,WACtB,OAAC,QAAK,QAAS,CAACA,GAAqB,QAAQ,KAAM,KAAMA,GAAqB,QAAQ,KACpF,oBAAC,OAAI,UAAU,2FACb,oBAAC,WACC,OAAQA,GAAqB,QAAQ,SACrC,UAAU,6BACV,aAAa,sBACf,KACA,QAAC,OAAI,UAAU,kCACb,oBAAC,WACC,KAAM,EACN,KAAMA,GAAqB,QAAQ,OAAS,eAC5C,aAAW,MAAG,uBAAwB,CACpC,aAAcA,GAAqB,QAAQ,QAAU,MACvD,CAAC,EACH,KACA,OAAC,QACC,KAAMA,GAAqB,QAAQ,MAAQ,YAC3C,aAAW,MAAG,+BAAgC,CAC5C,aAAcA,GAAqB,QAAQ,QAAU,MACvD,CAAC,EACH,GACF,GACF,EACF,EAEDG,EAAW,UAAU,IAAI,CAACE,EAAcC,OACvC,OAAC,qBACC,SAAUA,EAEV,QAASD,EACT,YAAaL,GAAqB,MAClC,aAAcA,GAAqB,cAH9B,qBAAqBI,CAAM,IAAIE,CAAK,EAI3C,CACD,GACH,IAxCQ,cAAcF,CAAM,EAyC9B,CACD,EACL",
4
+ "sourcesContent": ["import React from 'react'\nimport { Text, Link, Heading, Picture } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { DownArrow } from './icons/index.js'\nimport { SeriesProductItem } from './SidebarDropdown.js'\n\n/**\n * \u79FB\u52A8\u7AEF\u83DC\u5355\u9879\n */\nexport const MenuItem = ({\n label,\n href,\n onClick,\n active,\n icon,\n className,\n}: {\n label: string\n href?: string\n onClick?: () => void\n active?: boolean\n icon?: string\n className?: string\n}) => {\n const content = (\n <>\n <div className=\"flex items-center gap-4\">\n <Text html={label} className={cn('text-sm font-bold leading-[1.4]', { underline: icon })} />\n {icon && <Text html={icon} aria-hidden=\"true\" />}\n </div>\n <svg\n className={`size-5 ${active ? 'rotate-90' : ''}`}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path d=\"M9 5L16 12L9 19\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </>\n )\n\n return href ? (\n <Link\n href={href}\n className={cn('flex cursor-pointer items-center justify-between py-4 no-underline', className)}\n onClick={onClick}\n >\n {content}\n </Link>\n ) : (\n <button\n onClick={onClick}\n className={cn(\n 'flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left',\n className\n )}\n aria-expanded={active}\n >\n {content}\n </button>\n )\n}\n\n/**\n * \u79FB\u52A8\u7AEF\u5B50\u5206\u7C7B\u6807\u9898\u7EC4\u4EF6\n */\nexport const SubSubCategoryItemComp = ({\n matchSeriesMetadata,\n onSubSubCategoryItemClick,\n expanded,\n}: {\n matchSeriesMetadata: any\n onSubSubCategoryItemClick?: () => void\n expanded?: boolean\n}) => {\n const content = (\n <>\n {matchSeriesMetadata?.label && (\n <Text html={matchSeriesMetadata?.label} className=\"text-sm font-bold leading-[1.4]\" />\n )}\n {onSubSubCategoryItemClick && (\n <DownArrow\n aria-hidden=\"true\"\n className={cn('size-5', {\n ['rotate-180']: expanded,\n })}\n />\n )}\n </>\n )\n\n return onSubSubCategoryItemClick ? (\n <button\n className=\"tablet:pt-0 flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left\"\n onClick={onSubSubCategoryItemClick}\n aria-expanded={expanded}\n >\n {content}\n </button>\n ) : (\n <div className=\"tablet:pt-0 flex items-center justify-between py-4\">{content}</div>\n )\n}\n\n/**\n * \u79FB\u52A8\u7AEF\u5B50\u5206\u7C7B\u5185\u5BB9\u7EC4\u4EF6\n */\nexport const SubSubCategoryContentComp = ({ matchSeriesMetadata }: { matchSeriesMetadata: any }) => {\n return (\n <div className=\"laptop:gap-3 flex flex-col gap-2\">\n {!!matchSeriesMetadata?.series?.length &&\n matchSeriesMetadata?.series?.map((seriesItem: any, pIndex: number) => (\n <div key={`seriesItem-${seriesItem?.label || ''}-${pIndex}`}>\n {seriesItem.label && (\n <Text html={seriesItem.label} as=\"p\" className=\"mb-2 text-sm font-bold leading-[1.4] text-[#3D3D3F]\" />\n )}\n <div className=\"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2\">\n {!!matchSeriesMetadata?.banner && (\n <Link asChild={!matchSeriesMetadata?.banner?.href} href={matchSeriesMetadata?.banner?.href}>\n <div className=\"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Picture\n source={matchSeriesMetadata?.banner?.imageUrl}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={matchSeriesMetadata?.banner?.title || 'Buy in Guide'}\n className={cn('font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n <Text\n html={matchSeriesMetadata?.banner?.desc || '20.000mAh'}\n className={cn('text-sm font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n </div>\n </div>\n </Link>\n )}\n {seriesItem.products?.map((product: any, index: number) => (\n <SeriesProductItem\n position={index}\n key={`seriesProductItem-${seriesItem?.label || ''}-${pIndex}-${index}`}\n product={product}\n seriesLabel={matchSeriesMetadata?.label}\n isCollection={matchSeriesMetadata?.isCollection}\n />\n ))}\n </div>\n </div>\n ))}\n </div>\n )\n}\n"],
5
+ "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,cAAAE,EAAA,8BAAAC,EAAA,2BAAAC,IAAA,eAAAC,EAAAL,GAyBI,IAAAM,EAAA,6BAzBJC,EAAkB,iBAClBC,EAA6C,qCAC7CC,EAAmB,kCACnBC,EAA0B,4BAC1BC,EAAkC,gCAK3B,MAAMT,EAAW,CAAC,CACvB,MAAAU,EACA,KAAAC,EACA,QAAAC,EACA,OAAAC,EACA,KAAAC,EACA,UAAAC,CACF,IAOM,CACJ,MAAMC,KACJ,oBACE,qBAAC,OAAI,UAAU,0BACb,oBAAC,QAAK,KAAMN,EAAO,aAAW,MAAG,kCAAmC,CAAE,UAAWI,CAAK,CAAC,EAAG,EACzFA,MAAQ,OAAC,QAAK,KAAMA,EAAM,cAAY,OAAO,GAChD,KACA,OAAC,OACC,UAAW,UAAUD,EAAS,YAAc,EAAE,GAC9C,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,cAAY,OAEZ,mBAAC,QAAK,EAAE,kBAAkB,OAAO,eAAe,YAAY,IAAI,cAAc,QAAQ,eAAe,QAAQ,EAC/G,GACF,EAGF,OAAOF,KACL,OAAC,QACC,KAAMA,EACN,aAAW,MAAG,qEAAsEI,CAAS,EAC7F,QAASH,EAER,SAAAI,EACH,KAEA,OAAC,UACC,QAASJ,EACT,aAAW,MACT,iGACAG,CACF,EACA,gBAAeF,EAEd,SAAAG,EACH,CAEJ,EAKad,EAAyB,CAAC,CACrC,oBAAAe,EACA,0BAAAC,EACA,SAAAC,CACF,IAIM,CACJ,MAAMH,KACJ,oBACG,UAAAC,GAAqB,UACpB,OAAC,QAAK,KAAMA,GAAqB,MAAO,UAAU,kCAAkC,EAErFC,MACC,OAAC,aACC,cAAY,OACZ,aAAW,MAAG,SAAU,CACrB,aAAeC,CAClB,CAAC,EACH,GAEJ,EAGF,OAAOD,KACL,OAAC,UACC,UAAU,6GACV,QAASA,EACT,gBAAeC,EAEd,SAAAH,EACH,KAEA,OAAC,OAAI,UAAU,qDAAsD,SAAAA,EAAQ,CAEjF,EAKaf,EAA4B,CAAC,CAAE,oBAAAgB,CAAoB,OAE5D,OAAC,OAAI,UAAU,mCACZ,UAAC,CAACA,GAAqB,QAAQ,QAC9BA,GAAqB,QAAQ,IAAI,CAACG,EAAiBC,OACjD,QAAC,OACE,UAAAD,EAAW,UACV,OAAC,QAAK,KAAMA,EAAW,MAAO,GAAG,IAAI,UAAU,sDAAsD,KAEvG,QAAC,OAAI,UAAU,kGACZ,WAAC,CAACH,GAAqB,WACtB,OAAC,QAAK,QAAS,CAACA,GAAqB,QAAQ,KAAM,KAAMA,GAAqB,QAAQ,KACpF,oBAAC,OAAI,UAAU,2FACb,oBAAC,WACC,OAAQA,GAAqB,QAAQ,SACrC,UAAU,6BACV,aAAa,sBACf,KACA,QAAC,OAAI,UAAU,kCACb,oBAAC,WACC,KAAM,EACN,KAAMA,GAAqB,QAAQ,OAAS,eAC5C,aAAW,MAAG,uBAAwB,CACpC,aAAcA,GAAqB,QAAQ,QAAU,MACvD,CAAC,EACH,KACA,OAAC,QACC,KAAMA,GAAqB,QAAQ,MAAQ,YAC3C,aAAW,MAAG,+BAAgC,CAC5C,aAAcA,GAAqB,QAAQ,QAAU,MACvD,CAAC,EACH,GACF,GACF,EACF,EAEDG,EAAW,UAAU,IAAI,CAACE,EAAcC,OACvC,OAAC,qBACC,SAAUA,EAEV,QAASD,EACT,YAAaL,GAAqB,MAClC,aAAcA,GAAqB,cAH9B,qBAAqBG,GAAY,OAAS,EAAE,IAAIC,CAAM,IAAIE,CAAK,EAItE,CACD,GACH,IAxCQ,cAAcH,GAAY,OAAS,EAAE,IAAIC,CAAM,EAyCzD,CACD,EACL",
6
6
  "names": ["MobileMenuComponents_exports", "__export", "MenuItem", "SubSubCategoryContentComp", "SubSubCategoryItemComp", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_icons", "import_SidebarDropdown", "label", "href", "onClick", "active", "icon", "className", "content", "matchSeriesMetadata", "onSubSubCategoryItemClick", "expanded", "seriesItem", "pIndex", "product", "index"]
7
7
  }
package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var $=Object.create;var N=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var j=(t,i)=>{for(var d in i)N(t,d,{get:i[d],enumerable:!0})},w=(t,i,d,x)=>{if(i&&typeof i=="object"||typeof i=="function")for(let p of A(i))!_.call(t,p)&&p!==d&&N(t,p,{get:()=>i[p],enumerable:!(x=P(i,p))||x.enumerable});return t};var B=(t,i,d)=>(d=t!=null?$(z(t)):{},w(i||!t||!t.__esModule?N(d,"default",{value:t,enumerable:!0}):d,t)),E=t=>w(N({},"__esModule",{value:!0}),t);var O={};j(O,{SeriesProductItem:()=>D,SidebarDropdown:()=>F});module.exports=E(O);var e=require("react/jsx-runtime"),m=B(require("react")),n=require("../../components/index.js"),g=require("../../helpers/utils.js"),C=require("./icons/index.js"),S=require("./NavProvider.js");const F=m.default.memo(({sidebarCategoriesMetadata:t,seriesMetadata:i})=>{const{buildProps:d,onSidebarNavClick:x}=(0,S.useNavContext)(),[p,y]=(0,m.useState)([]),[u,b]=(0,m.useState)(-1),v=(0,m.useRef)(null),h=(0,m.useCallback)(()=>{const l=t?.subcategories;if(!l?.length)return;const o=l.findIndex(c=>!!c?.subSubCategories),s=l.findIndex(c=>!c?.subSubCategories),r=l.map((c,f)=>({index:f,open:o===f||s===f}));y(r)},[t]);(0,m.useEffect)(()=>{h()},[h]);const a=(0,m.useMemo)(()=>{const l=t?.subcategories?.[p?.find(s=>s.open)?.index||0],o=i?.find(s=>s?.label?.toLowerCase()===l?.label?.toLowerCase())||{};if(l?.collections){const s=d?.categories?.[l?.collections]||{};return{label:o?.label,isCollection:!0,banner:o?.banner,primary:o?.primary,series:[{products:s?.products}]}}else if(l?.subSubCategories){const s=l?.subSubCategories?.[u],r=i?.find(c=>c?.label?.toLowerCase()===s?.label?.toLowerCase())||{};if(s?.collections){const c=d?.categories?.[s?.collections]||{};return{label:r?.label,isCollection:!0,banner:r?.banner,primary:r?.primary,series:[{products:c?.products}]}}else return r}else return o},[t,p,u,i,d]),k=(0,m.useCallback)((l,o)=>{o?.subSubCategories?.length>0?b(0):b(-1),y(s=>s.map((r,c)=>({...r,open:c===l?!r.open:!1})))},[]),L=(l,o)=>{y(s=>s.map(r=>r.index===l?{...r,open:!0}:{...r,open:!1})),b(o)};return(0,e.jsxs)(n.Container,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[(0,e.jsxs)("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:v,children:[(0,e.jsx)("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:t?.subcategories?.map((l,o)=>{const s=Array.isArray(l?.subSubCategories)&&l?.subSubCategories?.length>0,r=p?.find(c=>c.index===o)?.open;return(0,e.jsxs)("div",{children:[(0,e.jsxs)("button",{className:(0,g.cn)("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left",{"bg-[#F5F5F7]":!s&&r}),onClick:()=>{k(o,l),x?.(l,o)},"aria-expanded":s?r:void 0,"aria-haspopup":s?"true":void 0,children:[(0,e.jsx)(n.Text,{html:l.label,className:"p-4 text-sm font-bold leading-[1.4]"}),s&&(0,e.jsx)(C.DownArrow,{"aria-hidden":"true",className:(0,g.cn)("size-4",{"rotate-180":r})})]}),r&&(0,e.jsx)("div",{className:"flex flex-col",role:"menu",children:l.subSubCategories?.map((c,f)=>(0,e.jsx)("button",{onClick:()=>{L(o,f),x?.(c,f)},className:(0,g.cn)("w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]",{"bg-[#F5F5F7]":u===f}),role:"menuitem","aria-label":c.label,children:(0,e.jsx)(n.Text,{html:c.label,className:"text-sm font-bold leading-[1.4] text-[#4A4C56]"})},`subSubItem-${o}-${f}`))})]},`subcategoryItem-${o}`)})}),t&&(0,e.jsx)("div",{className:"flex",children:(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[t?.primary&&(0,e.jsx)(n.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"lg-desktop:text-base text-sm",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(n.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",iconClassName:"size-4",className:"lg-desktop:text-base justify-start !p-0 text-sm",children:t?.secondary?.label})]})})]}),(0,e.jsxs)("div",{className:"flex-1 py-4",children:[Reflect.ownKeys(a).length>0&&(0,e.jsxs)("div",{className:"mb-4 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)(n.Text,{html:a?.label,className:"lg-desktop:text-2xl text-xl font-bold leading-[1.4]"}),a?.primary&&!a?.primary?.hide&&(0,e.jsx)(n.Button,{as:"a",href:`${a?.primary?.url}?ref=${a?.label}_viewmore`,variant:"link",size:"lg",iconClassName:"size-4",className:"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline",children:a?.primary?.label})]}),t?.guide?.label&&(0,e.jsx)(n.Link,{href:t?.guide?.url,className:"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]",children:t?.guide?.label})]}),(0,e.jsx)("div",{className:"flex h-[426px] flex-col gap-4 overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:a?.series?.map((l,o)=>(0,e.jsxs)("div",{children:[l.label&&(0,e.jsx)(n.Text,{html:l.label,as:"p",className:"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"grid grid-cols-3 gap-4",children:[!!a?.banner&&(0,e.jsx)(n.Link,{asChild:!a?.banner?.href,href:a?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(n.Picture,{source:a?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(n.Heading,{size:2,html:a?.banner?.title||"Buy in Guide",className:(0,g.cn)("font-bold text-white",{"text-black":a?.banner?.theme==="dark"})}),(0,e.jsx)(n.Text,{html:a?.banner?.desc||"20.000mAh",className:(0,g.cn)("text-sm font-bold text-white",{"text-black":a?.banner?.theme==="dark"})})]})]})}),l.products?.map((s,r)=>(0,e.jsx)(D,{seriesLabel:a?.label,product:s,isCollection:a?.isCollection},`seriesProductItem-${r}`))]})]},`seriesItem-${o}`))})]})]})});F.displayName="SidebarDropdown";const D=({product:t,isCollection:i,position:d,seriesLabel:x})=>{const{buildProps:p,onSeriesProductClick:y}=(0,S.useNavContext)();let u=i?t:p?.products?.find(a=>a.handle===t.handle);const b=u?.variants?.find(a=>a.sku===t.sku)||u?.variants?.[0],v=(0,m.useMemo)(()=>`/products/${u?.handle}?variant=${(0,g.atobID)(b?.id)}`,[u?.handle,b?.id]),h=(0,m.useMemo)(()=>u?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,2),[u?.tags]);return b?.availableForSale?(0,e.jsx)(n.Link,{href:v,onClick:a=>{a.preventDefault(),window.open(v,"_self"),y?.(u,d||0,x)},className:"no-underline hover:text-current",children:(0,e.jsxs)("div",{className:"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500",children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)("img",{src:`${b?.image?.url||t?.images?.[0]?.url}`,loading:"lazy",alt:u?.title||t?.name,width:90,height:90,className:"size-[96px] object-contain"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:"flex gap-1",children:Array.isArray(h)&&h?.map((a,k)=>(0,e.jsx)(n.Text,{as:"p",html:a,className:"text-brand-0 mb-1 inline-block h-[24px] whitespace-nowrap rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-xs font-bold !leading-[22px]"},k))}),(0,e.jsx)(n.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:u?.title||t?.name}),t?.desc&&(0,e.jsx)(n.Text,{as:"p",html:t?.desc,className:"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]})}):null};
1
+ "use strict";var L=Object.create;var N=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var j=(t,i)=>{for(var d in i)N(t,d,{get:i[d],enumerable:!0})},w=(t,i,d,x)=>{if(i&&typeof i=="object"||typeof i=="function")for(let u of A(i))!_.call(t,u)&&u!==d&&N(t,u,{get:()=>i[u],enumerable:!(x=P(i,u))||x.enumerable});return t};var B=(t,i,d)=>(d=t!=null?L(z(t)):{},w(i||!t||!t.__esModule?N(d,"default",{value:t,enumerable:!0}):d,t)),E=t=>w(N({},"__esModule",{value:!0}),t);var O={};j(O,{SeriesProductItem:()=>$,SidebarDropdown:()=>F});module.exports=E(O);var e=require("react/jsx-runtime"),m=B(require("react")),n=require("../../components/index.js"),g=require("../../helpers/utils.js"),C=require("./icons/index.js"),S=require("./NavProvider.js");const F=m.default.memo(({sidebarCategoriesMetadata:t,seriesMetadata:i})=>{const{buildProps:d,onSidebarNavClick:x}=(0,S.useNavContext)(),[u,y]=(0,m.useState)([]),[p,b]=(0,m.useState)(-1),v=(0,m.useRef)(null),h=(0,m.useCallback)(()=>{const l=t?.subcategories;if(!l?.length)return;const r=l.findIndex(c=>!!c?.subSubCategories),s=l.findIndex(c=>!c?.subSubCategories),o=l.map((c,f)=>({index:f,open:r===f||s===f}));y(o)},[t]);(0,m.useEffect)(()=>{h()},[h]);const a=(0,m.useMemo)(()=>{const l=t?.subcategories?.[u?.find(s=>s.open)?.index||0],r=i?.find(s=>s?.label?.toLowerCase()===l?.label?.toLowerCase())||{};if(l?.collections){const s=d?.categories?.[l?.collections]||{};return{label:r?.label,isCollection:!0,banner:r?.banner,primary:r?.primary,series:[{products:s?.products}]}}else if(l?.subSubCategories){const s=l?.subSubCategories?.[p],o=i?.find(c=>c?.label?.toLowerCase()===s?.label?.toLowerCase())||{};if(s?.collections){const c=d?.categories?.[s?.collections]||{};return{label:o?.label,isCollection:!0,banner:o?.banner,primary:o?.primary,series:[{products:c?.products}]}}else return o}else return r},[t,u,p,i,d]),k=(0,m.useCallback)((l,r)=>{r?.subSubCategories?.length>0?b(0):b(-1),y(s=>s.map((o,c)=>({...o,open:c===l?!o.open:!1})))},[]),D=(l,r)=>{y(s=>s.map(o=>o.index===l?{...o,open:!0}:{...o,open:!1})),b(r)};return(0,e.jsxs)(n.Container,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[(0,e.jsxs)("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:v,children:[(0,e.jsx)("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:t?.subcategories?.map((l,r)=>{const s=Array.isArray(l?.subSubCategories)&&l?.subSubCategories?.length>0,o=u?.find(c=>c.index===r)?.open;return(0,e.jsxs)("div",{children:[(0,e.jsxs)("button",{className:(0,g.cn)("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left",{"bg-[#F5F5F7]":!s&&o}),onClick:()=>{k(r,l),x?.(l,r)},"aria-expanded":s?o:void 0,"aria-haspopup":s?"true":void 0,children:[(0,e.jsx)(n.Text,{html:l.label,className:"p-4 text-sm font-bold leading-[1.4]"}),s&&(0,e.jsx)(C.DownArrow,{"aria-hidden":"true",className:(0,g.cn)("size-4",{"rotate-180":o})})]}),o&&(0,e.jsx)("div",{className:"flex flex-col",role:"menu",children:l.subSubCategories?.map((c,f)=>(0,e.jsx)("button",{onClick:()=>{D(r,f),x?.(c,f)},className:(0,g.cn)("w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]",{"bg-[#F5F5F7]":p===f}),role:"menuitem","aria-label":c.label,children:(0,e.jsx)(n.Text,{html:c.label,className:"text-sm font-bold leading-[1.4] text-[#4A4C56]"})},`subSubItem-${r}-${f}`))})]},`${l?.label||""}subcategoryItem-${r}`)})}),t&&(0,e.jsx)("div",{className:"flex",children:(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[t?.primary&&(0,e.jsx)(n.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"lg-desktop:text-base text-sm",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(n.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",iconClassName:"size-4",className:"lg-desktop:text-base justify-start !p-0 text-sm",children:t?.secondary?.label})]})})]}),(0,e.jsxs)("div",{className:"flex-1 py-4",children:[Reflect.ownKeys(a).length>0&&(0,e.jsxs)("div",{className:"mb-4 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)(n.Text,{html:a?.label,className:"lg-desktop:text-2xl text-xl font-bold leading-[1.4]"}),a?.primary&&!a?.primary?.hide&&(0,e.jsx)(n.Button,{as:"a",href:`${a?.primary?.url}?ref=${a?.label}_viewmore`,variant:"link",size:"lg",iconClassName:"size-4",className:"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline",children:a?.primary?.label})]}),t?.guide?.label&&(0,e.jsx)(n.Link,{href:t?.guide?.url,className:"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]",children:t?.guide?.label})]}),(0,e.jsx)("div",{className:"flex h-[426px] flex-col gap-4 overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:a?.series?.map((l,r)=>(0,e.jsxs)("div",{children:[l.label&&(0,e.jsx)(n.Text,{html:l.label,as:"p",className:"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"grid grid-cols-3 gap-4",children:[!!a?.banner&&(0,e.jsx)(n.Link,{asChild:!a?.banner?.href,href:a?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(n.Picture,{source:a?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(n.Heading,{size:2,html:a?.banner?.title||"Buy in Guide",className:(0,g.cn)("font-bold text-white",{"text-black":a?.banner?.theme==="dark"})}),(0,e.jsx)(n.Text,{html:a?.banner?.desc||"20.000mAh",className:(0,g.cn)("text-sm font-bold text-white",{"text-black":a?.banner?.theme==="dark"})})]})]})}),l.products?.map((s,o)=>(0,e.jsx)($,{seriesLabel:a?.label,product:s,isCollection:a?.isCollection},`seriesProductItem-${l?.label||""}-${r}-${o}`))]})]},`seriesItem-${r}`))})]})]})});F.displayName="SidebarDropdown";const $=({product:t,isCollection:i,position:d,seriesLabel:x})=>{const{buildProps:u,onSeriesProductClick:y}=(0,S.useNavContext)();let p=i?t:u?.products?.find(a=>a.handle===t.handle);const b=p?.variants?.find(a=>a.sku===t.sku)||p?.variants?.[0],v=(0,m.useMemo)(()=>`/products/${p?.handle}?variant=${(0,g.atobID)(b?.id)}`,[p?.handle,b?.id]),h=(0,m.useMemo)(()=>p?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,2),[p?.tags]);return b?.availableForSale?(0,e.jsx)(n.Link,{href:v,onClick:a=>{a.preventDefault(),window.open(v,"_self"),y?.(p,d||0,x)},className:"no-underline hover:text-current",children:(0,e.jsxs)("div",{className:"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500",children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)("img",{src:`${b?.image?.url||t?.images?.[0]?.url}&width=200`,loading:"lazy",alt:p?.title||t?.name,width:90,height:90,className:"size-[96px] object-contain"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:"flex gap-1",children:Array.isArray(h)&&h?.map((a,k)=>(0,e.jsx)(n.Text,{as:"p",html:a,className:"text-brand-0 mb-1 inline-block h-[24px] whitespace-nowrap rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-xs font-bold !leading-[22px]"},k))}),(0,e.jsx)(n.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:p?.title||t?.name}),t?.desc&&(0,e.jsx)(n.Text,{as:"p",html:t?.desc,className:"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]})}):null};
2
2
  //# sourceMappingURL=SidebarDropdown.js.map
package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/HeaderNavigation/SidebarDropdown.tsx"],
4
- "sourcesContent": ["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { Button, Container, Text, Link, Heading, Picture } from '../../components/index.js'\nimport { cn, atobID } from '../../helpers/utils.js'\nimport { DownArrow } from './icons/index.js'\nimport { useNavContext } from './NavProvider.js'\nimport type { Product, ProductVariant } from '../../cpn-components/CpnProductCard/types.js'\n\n/**\n * \u4FA7\u8FB9\u680F\u4E0B\u62C9\n * @param categoriesItem \u5206\u7C7B\u9879\n */\nexport const SidebarDropdown = React.memo(\n ({ sidebarCategoriesMetadata, seriesMetadata }: { sidebarCategoriesMetadata: any; seriesMetadata: any }) => {\n const { buildProps, onSidebarNavClick } = useNavContext()\n const [expandedSubcategory, setExpandedSubcategory] = useState<{ index: number; open: boolean }[]>([])\n const [activeSubSubcategoryIndex, setActiveSubSubcategoryIndex] = useState(-1)\n const sidebarDropdownRef = useRef<HTMLDivElement>(null)\n\n const initExpandedSubcategory = useCallback(() => {\n const subcategories = sidebarCategoriesMetadata?.subcategories\n if (!subcategories?.length) return\n\n const withSubSubCategoriesIndex = subcategories.findIndex((item: any) => !!item?.subSubCategories)\n const withoutSubSubCategoriesIndex = subcategories.findIndex((item: any) => !item?.subSubCategories)\n\n // \u521B\u5EFA\u5C55\u5F00\u72B6\u6001\u6570\u7EC4\n const expandedStates = subcategories.map((_: any, index: number) => ({\n index,\n open: withSubSubCategoriesIndex === index || withoutSubSubCategoriesIndex === index,\n }))\n\n setExpandedSubcategory(expandedStates)\n }, [sidebarCategoriesMetadata])\n\n useEffect(() => {\n initExpandedSubcategory()\n }, [initExpandedSubcategory])\n\n // \u901A\u8FC7categoriesMetadata\u7684subSubCategories\u7684label\u4E0Eseries\u7684label\u5339\u914D\n const matchSeriesMetadata = useMemo(() => {\n const subCategory =\n sidebarCategoriesMetadata?.subcategories?.[expandedSubcategory?.find(item => item.open)?.index || 0]\n const currentSeriesMetadata =\n seriesMetadata?.find((item: any) => item?.label?.toLowerCase() === subCategory?.label?.toLowerCase()) || {}\n if (subCategory?.collections) {\n const category = buildProps?.categories?.[subCategory?.collections] || {}\n return {\n label: currentSeriesMetadata?.label,\n isCollection: true,\n banner: currentSeriesMetadata?.banner,\n primary: currentSeriesMetadata?.primary,\n series: [\n {\n products: category?.products,\n },\n ],\n }\n } else {\n if (subCategory?.subSubCategories) {\n const activeSubSubcategory = subCategory?.subSubCategories?.[activeSubSubcategoryIndex]\n const currentActiveSeriesMetadata =\n seriesMetadata?.find(\n (item: any) => item?.label?.toLowerCase() === activeSubSubcategory?.label?.toLowerCase()\n ) || {}\n if (activeSubSubcategory?.collections) {\n const category = buildProps?.categories?.[activeSubSubcategory?.collections] || {}\n return {\n label: currentActiveSeriesMetadata?.label,\n isCollection: true,\n banner: currentActiveSeriesMetadata?.banner,\n primary: currentActiveSeriesMetadata?.primary,\n series: [\n {\n products: category?.products,\n },\n ],\n }\n } else {\n return currentActiveSeriesMetadata\n }\n } else {\n return currentSeriesMetadata\n }\n }\n }, [sidebarCategoriesMetadata, expandedSubcategory, activeSubSubcategoryIndex, seriesMetadata, buildProps])\n\n const handleSubcategoryOpen = useCallback((index: number, subcategoryItem: any) => {\n subcategoryItem?.subSubCategories?.length > 0 ? setActiveSubSubcategoryIndex(0) : setActiveSubSubcategoryIndex(-1)\n\n setExpandedSubcategory(prev => prev.map((item, i) => ({ ...item, open: i === index ? !item.open : false })))\n }, [])\n\n const handleSubSubcategoryOpen = (index: number, subSubindex: number) => {\n setExpandedSubcategory(prev =>\n prev.map(item => (item.index === index ? { ...item, open: true } : { ...item, open: false }))\n )\n setActiveSubSubcategoryIndex(subSubindex)\n }\n\n return (\n <Container childClassName=\"lg-desktop:gap-12 flex bg-white gap-8\">\n <div\n className=\"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4\"\n style={{\n userSelect: 'none',\n }}\n ref={sidebarDropdownRef}\n >\n <div\n className=\"desktop:h-[416px] flex flex-col overflow-y-auto\"\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n >\n {sidebarCategoriesMetadata?.subcategories?.map((subItem: any, index: number) => {\n const hasSubSubCategory =\n Array.isArray(subItem?.subSubCategories) && subItem?.subSubCategories?.length > 0\n const isExpanded = expandedSubcategory?.find(item => item.index === index)?.open\n return (\n <div key={`subcategoryItem-${index}`}>\n <button\n className={cn(\n 'flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left',\n {\n 'bg-[#F5F5F7]': !hasSubSubCategory && isExpanded,\n }\n )}\n onClick={() => {\n handleSubcategoryOpen(index, subItem)\n onSidebarNavClick?.(subItem, index)\n }}\n aria-expanded={hasSubSubCategory ? isExpanded : undefined}\n aria-haspopup={hasSubSubCategory ? 'true' : undefined}\n >\n <Text html={subItem.label} className=\"p-4 text-sm font-bold leading-[1.4]\" />\n {hasSubSubCategory && (\n <DownArrow\n aria-hidden=\"true\"\n className={cn('size-4', {\n ['rotate-180']: isExpanded,\n })}\n />\n )}\n </button>\n {isExpanded && (\n <div className=\"flex flex-col\" role=\"menu\">\n {subItem.subSubCategories?.map((subSubItem: any, subSubindex: number) => (\n <button\n onClick={() => {\n handleSubSubcategoryOpen(index, subSubindex)\n onSidebarNavClick?.(subSubItem, subSubindex)\n }}\n key={`subSubItem-${index}-${subSubindex}`}\n className={cn(\n 'w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]',\n {\n 'bg-[#F5F5F7]': activeSubSubcategoryIndex === subSubindex,\n }\n )}\n role=\"menuitem\"\n aria-label={subSubItem.label}\n >\n <Text html={subSubItem.label} className=\"text-sm font-bold leading-[1.4] text-[#4A4C56]\" />\n </button>\n ))}\n </div>\n )}\n </div>\n )\n })}\n </div>\n {sidebarCategoriesMetadata && (\n <div className=\"flex\">\n <div className=\"flex flex-col gap-4\">\n {sidebarCategoriesMetadata?.primary && (\n <Button\n as=\"a\"\n href={`${sidebarCategoriesMetadata?.primary?.url}?ref=${sidebarCategoriesMetadata?.primary?.label}_shopall`}\n variant=\"primary\"\n size=\"lg\"\n className=\"lg-desktop:text-base text-sm\"\n >\n {sidebarCategoriesMetadata?.primary?.label}\n </Button>\n )}\n {sidebarCategoriesMetadata?.secondary && (\n <Button\n as=\"a\"\n href={sidebarCategoriesMetadata?.secondary?.url}\n variant=\"link\"\n size=\"lg\"\n iconClassName=\"size-4\"\n className=\"lg-desktop:text-base justify-start !p-0 text-sm\"\n >\n {sidebarCategoriesMetadata?.secondary?.label}\n </Button>\n )}\n </div>\n </div>\n )}\n </div>\n <div className=\"flex-1 py-4\">\n {Reflect.ownKeys(matchSeriesMetadata).length > 0 && (\n <div className=\"mb-4 flex items-center justify-between\">\n <div className=\"flex items-center gap-2\">\n <Text\n html={matchSeriesMetadata?.label}\n className=\"lg-desktop:text-2xl text-xl font-bold leading-[1.4]\"\n />\n {matchSeriesMetadata?.primary && !matchSeriesMetadata?.primary?.hide && (\n <Button\n as=\"a\"\n href={`${matchSeriesMetadata?.primary?.url}?ref=${matchSeriesMetadata?.label}_viewmore`}\n variant=\"link\"\n size=\"lg\"\n iconClassName=\"size-4\"\n className=\"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline\"\n >\n {matchSeriesMetadata?.primary?.label}\n </Button>\n )}\n </div>\n {sidebarCategoriesMetadata?.guide?.label && (\n <Link\n href={sidebarCategoriesMetadata?.guide?.url}\n className=\"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]\"\n >\n {sidebarCategoriesMetadata?.guide?.label}\n </Link>\n )}\n </div>\n )}\n <div\n className=\"flex h-[426px] flex-col gap-4 overflow-y-auto\"\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n >\n {matchSeriesMetadata?.series?.map((seriesItem: any, seriesIndex: number) => (\n <div key={`seriesItem-${seriesIndex}`}>\n {seriesItem.label && (\n <Text\n html={seriesItem.label}\n as=\"p\"\n className=\"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n <div className=\"grid grid-cols-3 gap-4\">\n {!!matchSeriesMetadata?.banner && (\n <Link asChild={!matchSeriesMetadata?.banner?.href} href={matchSeriesMetadata?.banner?.href}>\n <div className=\"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Picture\n source={matchSeriesMetadata?.banner?.imageUrl}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={matchSeriesMetadata?.banner?.title || 'Buy in Guide'}\n className={cn('font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n <Text\n html={matchSeriesMetadata?.banner?.desc || '20.000mAh'}\n className={cn('text-sm font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n </div>\n </div>\n </Link>\n )}\n {seriesItem.products?.map((product: any, index: number) => (\n <SeriesProductItem\n seriesLabel={matchSeriesMetadata?.label}\n key={`seriesProductItem-${index}`}\n product={product}\n isCollection={matchSeriesMetadata?.isCollection}\n />\n ))}\n </div>\n </div>\n ))}\n </div>\n </div>\n </Container>\n )\n }\n)\n\nSidebarDropdown.displayName = 'SidebarDropdown'\n\n/**\n * \u7CFB\u5217\u4EA7\u54C1\u9879\u7EC4\u4EF6\n */\nexport const SeriesProductItem = ({\n product,\n isCollection,\n position,\n seriesLabel,\n}: {\n product: any\n isCollection?: boolean\n position?: number\n seriesLabel?: string\n}) => {\n const { buildProps, onSeriesProductClick } = useNavContext()\n let productData = isCollection\n ? product\n : buildProps?.products?.find((item: Product) => item.handle === product.handle)\n const variant =\n productData?.variants?.find((item: ProductVariant) => item.sku === product.sku) || productData?.variants?.[0]\n\n const listingLink = useMemo(() => {\n return `/products/${productData?.handle}?variant=${atobID(variant?.id as string)}`\n }, [productData?.handle, variant?.id])\n\n const tags = useMemo(() => {\n return productData?.tags\n ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, 2)\n }, [productData?.tags])\n\n if (!variant?.availableForSale) return null\n\n return (\n <Link\n href={listingLink}\n onClick={e => {\n e.preventDefault()\n window.open(listingLink, '_self')\n onSeriesProductClick?.(productData, position || 0, seriesLabel)\n }}\n className=\"no-underline hover:text-current\"\n >\n <div className=\"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500\">\n <div className=\"shrink-0\">\n <img\n src={`${variant?.image?.url || product?.images?.[0]?.url}`}\n loading=\"lazy\"\n alt={productData?.title || product?.name}\n width={90}\n height={90}\n className=\"size-[96px] object-contain\"\n />\n </div>\n <div className=\"relative\">\n <div className=\"flex gap-1\">\n {Array.isArray(tags) &&\n tags?.map((tag: string, index: number) => (\n <Text\n key={index}\n as=\"p\"\n html={tag}\n className=\"text-brand-0 mb-1 inline-block h-[24px] whitespace-nowrap rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-xs font-bold !leading-[22px]\"\n />\n ))}\n </div>\n <Text\n className=\"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]\"\n html={productData?.title || product?.name}\n />\n {product?.desc && (\n <Text\n as=\"p\"\n html={product?.desc}\n className=\"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n </div>\n </div>\n </Link>\n )\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { Button, Container, Text, Link, Heading, Picture } from '../../components/index.js'\nimport { cn, atobID } from '../../helpers/utils.js'\nimport { DownArrow } from './icons/index.js'\nimport { useNavContext } from './NavProvider.js'\nimport type { Product, ProductVariant } from '../../cpn-components/CpnProductCard/types.js'\n\n/**\n * \u4FA7\u8FB9\u680F\u4E0B\u62C9\n * @param categoriesItem \u5206\u7C7B\u9879\n */\nexport const SidebarDropdown = React.memo(\n ({ sidebarCategoriesMetadata, seriesMetadata }: { sidebarCategoriesMetadata: any; seriesMetadata: any }) => {\n const { buildProps, onSidebarNavClick } = useNavContext()\n const [expandedSubcategory, setExpandedSubcategory] = useState<{ index: number; open: boolean }[]>([])\n const [activeSubSubcategoryIndex, setActiveSubSubcategoryIndex] = useState(-1)\n const sidebarDropdownRef = useRef<HTMLDivElement>(null)\n\n const initExpandedSubcategory = useCallback(() => {\n const subcategories = sidebarCategoriesMetadata?.subcategories\n if (!subcategories?.length) return\n\n const withSubSubCategoriesIndex = subcategories.findIndex((item: any) => !!item?.subSubCategories)\n const withoutSubSubCategoriesIndex = subcategories.findIndex((item: any) => !item?.subSubCategories)\n\n // \u521B\u5EFA\u5C55\u5F00\u72B6\u6001\u6570\u7EC4\n const expandedStates = subcategories.map((_: any, index: number) => ({\n index,\n open: withSubSubCategoriesIndex === index || withoutSubSubCategoriesIndex === index,\n }))\n\n setExpandedSubcategory(expandedStates)\n }, [sidebarCategoriesMetadata])\n\n useEffect(() => {\n initExpandedSubcategory()\n }, [initExpandedSubcategory])\n\n // \u901A\u8FC7categoriesMetadata\u7684subSubCategories\u7684label\u4E0Eseries\u7684label\u5339\u914D\n const matchSeriesMetadata = useMemo(() => {\n const subCategory =\n sidebarCategoriesMetadata?.subcategories?.[expandedSubcategory?.find(item => item.open)?.index || 0]\n const currentSeriesMetadata =\n seriesMetadata?.find((item: any) => item?.label?.toLowerCase() === subCategory?.label?.toLowerCase()) || {}\n if (subCategory?.collections) {\n const category = buildProps?.categories?.[subCategory?.collections] || {}\n return {\n label: currentSeriesMetadata?.label,\n isCollection: true,\n banner: currentSeriesMetadata?.banner,\n primary: currentSeriesMetadata?.primary,\n series: [\n {\n products: category?.products,\n },\n ],\n }\n } else {\n if (subCategory?.subSubCategories) {\n const activeSubSubcategory = subCategory?.subSubCategories?.[activeSubSubcategoryIndex]\n const currentActiveSeriesMetadata =\n seriesMetadata?.find(\n (item: any) => item?.label?.toLowerCase() === activeSubSubcategory?.label?.toLowerCase()\n ) || {}\n if (activeSubSubcategory?.collections) {\n const category = buildProps?.categories?.[activeSubSubcategory?.collections] || {}\n return {\n label: currentActiveSeriesMetadata?.label,\n isCollection: true,\n banner: currentActiveSeriesMetadata?.banner,\n primary: currentActiveSeriesMetadata?.primary,\n series: [\n {\n products: category?.products,\n },\n ],\n }\n } else {\n return currentActiveSeriesMetadata\n }\n } else {\n return currentSeriesMetadata\n }\n }\n }, [sidebarCategoriesMetadata, expandedSubcategory, activeSubSubcategoryIndex, seriesMetadata, buildProps])\n\n const handleSubcategoryOpen = useCallback((index: number, subcategoryItem: any) => {\n subcategoryItem?.subSubCategories?.length > 0 ? setActiveSubSubcategoryIndex(0) : setActiveSubSubcategoryIndex(-1)\n\n setExpandedSubcategory(prev => prev.map((item, i) => ({ ...item, open: i === index ? !item.open : false })))\n }, [])\n\n const handleSubSubcategoryOpen = (index: number, subSubindex: number) => {\n setExpandedSubcategory(prev =>\n prev.map(item => (item.index === index ? { ...item, open: true } : { ...item, open: false }))\n )\n setActiveSubSubcategoryIndex(subSubindex)\n }\n\n return (\n <Container childClassName=\"lg-desktop:gap-12 flex bg-white gap-8\">\n <div\n className=\"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4\"\n style={{\n userSelect: 'none',\n }}\n ref={sidebarDropdownRef}\n >\n <div\n className=\"desktop:h-[416px] flex flex-col overflow-y-auto\"\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n >\n {sidebarCategoriesMetadata?.subcategories?.map((subItem: any, index: number) => {\n const hasSubSubCategory =\n Array.isArray(subItem?.subSubCategories) && subItem?.subSubCategories?.length > 0\n const isExpanded = expandedSubcategory?.find(item => item.index === index)?.open\n return (\n <div key={`${subItem?.label || ''}subcategoryItem-${index}`}>\n <button\n className={cn(\n 'flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left',\n {\n 'bg-[#F5F5F7]': !hasSubSubCategory && isExpanded,\n }\n )}\n onClick={() => {\n handleSubcategoryOpen(index, subItem)\n onSidebarNavClick?.(subItem, index)\n }}\n aria-expanded={hasSubSubCategory ? isExpanded : undefined}\n aria-haspopup={hasSubSubCategory ? 'true' : undefined}\n >\n <Text html={subItem.label} className=\"p-4 text-sm font-bold leading-[1.4]\" />\n {hasSubSubCategory && (\n <DownArrow\n aria-hidden=\"true\"\n className={cn('size-4', {\n ['rotate-180']: isExpanded,\n })}\n />\n )}\n </button>\n {isExpanded && (\n <div className=\"flex flex-col\" role=\"menu\">\n {subItem.subSubCategories?.map((subSubItem: any, subSubindex: number) => (\n <button\n onClick={() => {\n handleSubSubcategoryOpen(index, subSubindex)\n onSidebarNavClick?.(subSubItem, subSubindex)\n }}\n key={`subSubItem-${index}-${subSubindex}`}\n className={cn(\n 'w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]',\n {\n 'bg-[#F5F5F7]': activeSubSubcategoryIndex === subSubindex,\n }\n )}\n role=\"menuitem\"\n aria-label={subSubItem.label}\n >\n <Text html={subSubItem.label} className=\"text-sm font-bold leading-[1.4] text-[#4A4C56]\" />\n </button>\n ))}\n </div>\n )}\n </div>\n )\n })}\n </div>\n {sidebarCategoriesMetadata && (\n <div className=\"flex\">\n <div className=\"flex flex-col gap-4\">\n {sidebarCategoriesMetadata?.primary && (\n <Button\n as=\"a\"\n href={`${sidebarCategoriesMetadata?.primary?.url}?ref=${sidebarCategoriesMetadata?.primary?.label}_shopall`}\n variant=\"primary\"\n size=\"lg\"\n className=\"lg-desktop:text-base text-sm\"\n >\n {sidebarCategoriesMetadata?.primary?.label}\n </Button>\n )}\n {sidebarCategoriesMetadata?.secondary && (\n <Button\n as=\"a\"\n href={sidebarCategoriesMetadata?.secondary?.url}\n variant=\"link\"\n size=\"lg\"\n iconClassName=\"size-4\"\n className=\"lg-desktop:text-base justify-start !p-0 text-sm\"\n >\n {sidebarCategoriesMetadata?.secondary?.label}\n </Button>\n )}\n </div>\n </div>\n )}\n </div>\n <div className=\"flex-1 py-4\">\n {Reflect.ownKeys(matchSeriesMetadata).length > 0 && (\n <div className=\"mb-4 flex items-center justify-between\">\n <div className=\"flex items-center gap-2\">\n <Text\n html={matchSeriesMetadata?.label}\n className=\"lg-desktop:text-2xl text-xl font-bold leading-[1.4]\"\n />\n {matchSeriesMetadata?.primary && !matchSeriesMetadata?.primary?.hide && (\n <Button\n as=\"a\"\n href={`${matchSeriesMetadata?.primary?.url}?ref=${matchSeriesMetadata?.label}_viewmore`}\n variant=\"link\"\n size=\"lg\"\n iconClassName=\"size-4\"\n className=\"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline\"\n >\n {matchSeriesMetadata?.primary?.label}\n </Button>\n )}\n </div>\n {sidebarCategoriesMetadata?.guide?.label && (\n <Link\n href={sidebarCategoriesMetadata?.guide?.url}\n className=\"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]\"\n >\n {sidebarCategoriesMetadata?.guide?.label}\n </Link>\n )}\n </div>\n )}\n <div\n className=\"flex h-[426px] flex-col gap-4 overflow-y-auto\"\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n >\n {matchSeriesMetadata?.series?.map((seriesItem: any, seriesIndex: number) => (\n <div key={`seriesItem-${seriesIndex}`}>\n {seriesItem.label && (\n <Text\n html={seriesItem.label}\n as=\"p\"\n className=\"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n <div className=\"grid grid-cols-3 gap-4\">\n {!!matchSeriesMetadata?.banner && (\n <Link asChild={!matchSeriesMetadata?.banner?.href} href={matchSeriesMetadata?.banner?.href}>\n <div className=\"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Picture\n source={matchSeriesMetadata?.banner?.imageUrl}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={matchSeriesMetadata?.banner?.title || 'Buy in Guide'}\n className={cn('font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n <Text\n html={matchSeriesMetadata?.banner?.desc || '20.000mAh'}\n className={cn('text-sm font-bold text-white', {\n 'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n })}\n />\n </div>\n </div>\n </Link>\n )}\n {seriesItem.products?.map((product: any, index: number) => (\n <SeriesProductItem\n seriesLabel={matchSeriesMetadata?.label}\n key={`seriesProductItem-${seriesItem?.label || ''}-${seriesIndex}-${index}`}\n product={product}\n isCollection={matchSeriesMetadata?.isCollection}\n />\n ))}\n </div>\n </div>\n ))}\n </div>\n </div>\n </Container>\n )\n }\n)\n\nSidebarDropdown.displayName = 'SidebarDropdown'\n\n/**\n * \u7CFB\u5217\u4EA7\u54C1\u9879\u7EC4\u4EF6\n */\nexport const SeriesProductItem = ({\n product,\n isCollection,\n position,\n seriesLabel,\n}: {\n product: any\n isCollection?: boolean\n position?: number\n seriesLabel?: string\n}) => {\n const { buildProps, onSeriesProductClick } = useNavContext()\n let productData = isCollection\n ? product\n : buildProps?.products?.find((item: Product) => item.handle === product.handle)\n const variant =\n productData?.variants?.find((item: ProductVariant) => item.sku === product.sku) || productData?.variants?.[0]\n\n const listingLink = useMemo(() => {\n return `/products/${productData?.handle}?variant=${atobID(variant?.id as string)}`\n }, [productData?.handle, variant?.id])\n\n const tags = useMemo(() => {\n return productData?.tags\n ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, 2)\n }, [productData?.tags])\n\n if (!variant?.availableForSale) return null\n\n return (\n <Link\n href={listingLink}\n onClick={e => {\n e.preventDefault()\n window.open(listingLink, '_self')\n onSeriesProductClick?.(productData, position || 0, seriesLabel)\n }}\n className=\"no-underline hover:text-current\"\n >\n <div className=\"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500\">\n <div className=\"shrink-0\">\n <img\n src={`${variant?.image?.url || product?.images?.[0]?.url}&width=200`}\n loading=\"lazy\"\n alt={productData?.title || product?.name}\n width={90}\n height={90}\n className=\"size-[96px] object-contain\"\n />\n </div>\n <div className=\"relative\">\n <div className=\"flex gap-1\">\n {Array.isArray(tags) &&\n tags?.map((tag: string, index: number) => (\n <Text\n key={index}\n as=\"p\"\n html={tag}\n className=\"text-brand-0 mb-1 inline-block h-[24px] whitespace-nowrap rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-xs font-bold !leading-[22px]\"\n />\n ))}\n </div>\n <Text\n className=\"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]\"\n html={productData?.title || product?.name}\n />\n {product?.desc && (\n <Text\n as=\"p\"\n html={product?.desc}\n className=\"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n </div>\n </div>\n </Link>\n )\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["SidebarDropdown_exports", "__export", "SeriesProductItem", "SidebarDropdown", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_icons", "import_NavProvider", "React", "sidebarCategoriesMetadata", "seriesMetadata", "buildProps", "onSidebarNavClick", "expandedSubcategory", "setExpandedSubcategory", "activeSubSubcategoryIndex", "setActiveSubSubcategoryIndex", "sidebarDropdownRef", "initExpandedSubcategory", "subcategories", "withSubSubCategoriesIndex", "item", "withoutSubSubCategoriesIndex", "expandedStates", "_", "index", "matchSeriesMetadata", "subCategory", "currentSeriesMetadata", "category", "activeSubSubcategory", "currentActiveSeriesMetadata", "handleSubcategoryOpen", "subcategoryItem", "prev", "i", "handleSubSubcategoryOpen", "subSubindex", "subItem", "hasSubSubCategory", "isExpanded", "subSubItem", "seriesItem", "seriesIndex", "product", "isCollection", "position", "seriesLabel", "onSeriesProductClick", "productData", "variant", "listingLink", "tags", "e", "tag"]
7
7
  }
package/dist/cjs/biz-components/PromotionalBar/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var M=Object.create;var x=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var D=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var N=(t,e)=>{for(var o in e)x(t,o,{get:e[o],enumerable:!0})},g=(t,e,o,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of T(e))!F.call(t,r)&&r!==o&&x(t,r,{get:()=>e[r],enumerable:!(a=P(e,r))||a.enumerable});return t};var y=(t,e,o)=>(o=t!=null?M(D(t)):{},g(e||!t||!t.__esModule?x(o,"default",{value:t,enumerable:!0}):o,t)),R=t=>g(x({},"__esModule",{value:!0}),t);var I={};N(I,{default:()=>w});module.exports=R(I);var i=require("react/jsx-runtime"),b=y(require("react")),c=require("../../helpers/index.js"),m=require("../../components/index.js"),v=require("../../shared/Styles.js");const L=t=>{if(!t)return;const{mobile:e,tablet:o,laptop:a,desktop:r,lgDesktop:k}=t,n=[],u=B=>B?.url,p=u(k),l=u(r),s=u(a),d=u(o),f=u(e);return p?n.push(p):l?n.push(l):s?n.push(s):d?n.push(d):f&&n.push(f),l&&p&&n.push(`${l} 1920`),s&&(l||p)&&n.push(`${s} 1440`),d&&(s||l||p)&&n.push(`${d} 1024`),f&&(d||s||l||p)&&n.push(`${f} 768`),n.length>0?n.join(", "):void 0},h=b.forwardRef(({classNames:t,data:e},o)=>{const{backgroundImage:a}=e,r=b.useMemo(()=>L(a),[a]);return(0,i.jsx)("div",{ref:o,className:(0,c.cn)("laptop:h-[192px] lg-desktop:h-[240px] h-[240px]",t?.root),children:(0,i.jsxs)("div",{className:"promotional-bar-content rounded-box relative h-full overflow-hidden",children:[(0,i.jsxs)("div",{className:(0,c.cn)("laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4",t?.content),children:[e.contentTitle&&(0,i.jsx)(m.Heading,{className:(0,c.cn)("line-clamp-2 text-[#F5F6F7]",t?.title),html:e.contentTitle,size:3}),e.contentDesc&&(0,i.jsx)("p",{className:(0,c.cn)("laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] text-[#F5F6F7]",t?.description),dangerouslySetInnerHTML:{__html:e.contentDesc}}),(0,i.jsx)("div",{className:"laptop:mt-4 mt-2",children:e.buttonText&&(0,i.jsx)(m.Button,{as:"a",variant:"link",className:(0,c.cn)("!p-0 text-[#F5F6F7]",t?.button),href:e.buttonLink,children:e.buttonText})})]}),(0,i.jsx)(m.Picture,{source:r,className:"absolute inset-0 z-10 ",imgClassName:"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]"})]})})});h.displayName="PromotionalBar";var w=(0,v.withLayout)(h);
1
+ "use strict";"use client";var M=Object.create;var g=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var D=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var F=(t,e)=>{for(var o in e)g(t,o,{get:e[o],enumerable:!0})},x=(t,e,o,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of T(e))!N.call(t,r)&&r!==o&&g(t,r,{get:()=>e[r],enumerable:!(a=P(e,r))||a.enumerable});return t};var y=(t,e,o)=>(o=t!=null?M(D(t)):{},x(e||!t||!t.__esModule?g(o,"default",{value:t,enumerable:!0}):o,t)),R=t=>x(g({},"__esModule",{value:!0}),t);var I={};F(I,{default:()=>w});module.exports=R(I);var i=require("react/jsx-runtime"),h=y(require("react")),c=require("../../helpers/index.js"),m=require("../../components/index.js"),v=require("../../shared/Styles.js");const L=t=>{if(!t)return;const{mobile:e,tablet:o,laptop:a,desktop:r,lgDesktop:k}=t,n=[],u=B=>B?.url,l=u(k),s=u(r),p=u(a),d=u(o),f=u(e);return l?n.push(l):s?n.push(s):p?n.push(p):d?n.push(d):f&&n.push(f),s&&l&&n.push(`${s} 1920`),p&&(s||l)&&n.push(`${p} 1440`),d&&(p||s||l)&&n.push(`${d} 1024`),f&&(d||p||s||l)&&n.push(`${f} 768`),n.length>0?n.join(", "):void 0},b=h.forwardRef(({classNames:t,data:e},o)=>{const{backgroundImage:a}=e,r=h.useMemo(()=>L(a),[a]);return(0,i.jsx)("div",{ref:o,className:(0,c.cn)("laptop:h-[192px] lg-desktop:h-[240px] h-[240px]",t?.root),children:(0,i.jsxs)("div",{className:"promotional-bar-content rounded-card relative h-full overflow-hidden",children:[(0,i.jsxs)("div",{className:(0,c.cn)("laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4",t?.content),children:[e.contentTitle&&(0,i.jsx)(m.Heading,{className:(0,c.cn)("line-clamp-2 text-[#F5F6F7]",t?.title),html:e.contentTitle,size:3}),e.contentDesc&&(0,i.jsx)("p",{className:(0,c.cn)("laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] text-[#F5F6F7]",t?.description),dangerouslySetInnerHTML:{__html:e.contentDesc}}),(0,i.jsx)("div",{className:"laptop:mt-4 mt-2",children:e.buttonText&&(0,i.jsx)(m.Button,{as:"a",variant:"link",className:(0,c.cn)("!p-0 text-[#F5F6F7]",t?.button),href:e.buttonLink,iconClassName:"size-4",children:e.buttonText})})]}),(0,i.jsx)(m.Picture,{source:r,className:"absolute inset-0 z-10 ",imgClassName:"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]"})]})})});b.displayName="PromotionalBar";var w=(0,v.withLayout)(b);
2
2
  //# sourceMappingURL=index.js.map
package/dist/cjs/biz-components/PromotionalBar/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/PromotionalBar/index.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Heading, Button, Picture } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media } from '../../types/props.js'\n\nexport interface PromotionalBarSemanticName {\n root: 'root'\n content: 'content'\n title: 'title'\n description: 'description'\n button: 'button'\n}\n\n/**\n * \u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u914D\u7F6E\n */\nexport interface ResponsiveBackgroundImage {\n /** \u79FB\u52A8\u7AEF\u56FE\u7247 (<768px) */\n mobile?: Media\n /** \u5E73\u677F\u56FE\u7247 (768-1440px) */\n tablet?: Media\n /** \u7B14\u8BB0\u672C\u56FE\u7247 (1025-1440px) */\n laptop?: Media\n /** \u684C\u9762\u56FE\u7247 (1441-1920px) */\n desktop?: Media\n /** \u8D85\u5927\u684C\u9762\u56FE\u7247 (\u22651921px) */\n lgDesktop?: Media\n}\n\n/**\n * PromotionalBar \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface PromotionalBarData {\n /** \u7EC4\u4EF6\u5185\u5BB9\u6807\u9898 */\n contentTitle?: string\n /** \u7EC4\u4EF6\u5185\u5BB9\u63CF\u8FF0 */\n contentDesc?: string\n /** \u6309\u94AE\u6587\u672C */\n buttonText?: string\n /** \u6309\u94AE\u94FE\u63A5 */\n buttonLink?: string\n /** \u80CC\u666F\u56FE\u7247 - \u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61 */\n backgroundImage?: ResponsiveBackgroundImage\n}\n\nexport interface PromotionalBarProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: PromotionalBarData\n classNames?: Partial<Record<keyof PromotionalBarSemanticName, string>>\n}\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u5BF9\u8C61\u8F6C\u6362\u4E3A Picture \u7EC4\u4EF6\u6240\u9700\u7684\u5B57\u7B26\u4E32\u683C\u5F0F\n */\nconst convertResponsiveImageToString = (backgroundImage: ResponsiveBackgroundImage | undefined): string | undefined => {\n if (!backgroundImage) return undefined\n\n const { mobile, tablet, laptop, desktop, lgDesktop } = backgroundImage\n const parts: string[] = []\n\n // \u8F85\u52A9\u51FD\u6570\uFF1A\u4ECE Media \u5BF9\u8C61\u4E2D\u63D0\u53D6 URL\n const getUrl = (media: Media | undefined): string | undefined => {\n return media?.url\n }\n\n // \u9ED8\u8BA4\u56FE\u7247\uFF08\u6700\u5927\u5C3A\u5BF8\uFF09\u653E\u5728\u6700\u524D\u9762\uFF0C\u4E0D\u9700\u8981\u65AD\u70B9\n const lgDesktopUrl = getUrl(lgDesktop)\n const desktopUrl = getUrl(desktop)\n const laptopUrl = getUrl(laptop)\n const tabletUrl = getUrl(tablet)\n const mobileUrl = getUrl(mobile)\n\n if (lgDesktopUrl) parts.push(lgDesktopUrl)\n else if (desktopUrl) parts.push(desktopUrl)\n else if (laptopUrl) parts.push(laptopUrl)\n else if (tabletUrl) parts.push(tabletUrl)\n else if (mobileUrl) parts.push(mobileUrl)\n\n // \u6309\u65AD\u70B9\u4ECE\u5927\u5230\u5C0F\u6DFB\u52A0\n if (desktopUrl && lgDesktopUrl) parts.push(`${desktopUrl} 1920`)\n if (laptopUrl && (desktopUrl || lgDesktopUrl)) parts.push(`${laptopUrl} 1440`)\n if (tabletUrl && (laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${tabletUrl} 1024`)\n if (mobileUrl && (tabletUrl || laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${mobileUrl} 768`)\n\n return parts.length > 0 ? parts.join(', ') : undefined\n}\n\n/**\n * PromotionalBar - \u63A8\u5E7F\u680F\n *\n * @description \u63A8\u5E7F\u680F\n */\nconst PromotionalBar = React.forwardRef<HTMLDivElement, PromotionalBarProps>(({ classNames, data }, ref) => {\n const { backgroundImage } = data\n const pictureSource = React.useMemo(() => {\n return convertResponsiveImageToString(backgroundImage)\n }, [backgroundImage])\n return (\n <div ref={ref} className={cn('laptop:h-[192px] lg-desktop:h-[240px] h-[240px]', classNames?.root)}>\n {/* \u63A8\u5E7F\u680F\u5185\u5BB9\u533A\u57DF - \u6839\u636E\u5177\u4F53\u4E1A\u52A1\u9700\u6C42\u5B9A\u5236 */}\n <div className=\"promotional-bar-content rounded-box relative h-full overflow-hidden\">\n <div\n className={cn(\n 'laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4',\n classNames?.content\n )}\n >\n {data.contentTitle && (\n <Heading\n className={cn('line-clamp-2 text-[#F5F6F7]', classNames?.title)}\n html={data.contentTitle}\n size={3}\n />\n )}\n {data.contentDesc && (\n <p\n className={cn(\n 'laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] text-[#F5F6F7]',\n classNames?.description\n )}\n dangerouslySetInnerHTML={{ __html: data.contentDesc }}\n />\n )}\n <div className=\"laptop:mt-4 mt-2\">\n {data.buttonText && (\n <Button\n as=\"a\"\n variant=\"link\"\n className={cn('!p-0 text-[#F5F6F7]', classNames?.button)}\n href={data.buttonLink}\n >\n {data.buttonText}\n </Button>\n )}\n </div>\n </div>\n <Picture\n source={pictureSource}\n className=\"absolute inset-0 z-10 \"\n imgClassName=\"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]\"\n />\n </div>\n </div>\n )\n})\n\nPromotionalBar.displayName = 'PromotionalBar'\nexport default withLayout(PromotionalBar)\n"],
5
- "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAwGQ,IAAAI,EAAA,6BAtGRC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAAyC,qCACzCC,EAA2B,kCAoD3B,MAAMC,EAAkCC,GAA+E,CACrH,GAAI,CAACA,EAAiB,OAEtB,KAAM,CAAE,OAAAC,EAAQ,OAAAC,EAAQ,OAAAC,EAAQ,QAAAC,EAAS,UAAAC,CAAU,EAAIL,EACjDM,EAAkB,CAAC,EAGnBC,EAAUC,GACPA,GAAO,IAIVC,EAAeF,EAAOF,CAAS,EAC/BK,EAAaH,EAAOH,CAAO,EAC3BO,EAAYJ,EAAOJ,CAAM,EACzBS,EAAYL,EAAOL,CAAM,EACzBW,EAAYN,EAAON,CAAM,EAE/B,OAAIQ,EAAcH,EAAM,KAAKG,CAAY,EAChCC,EAAYJ,EAAM,KAAKI,CAAU,EACjCC,EAAWL,EAAM,KAAKK,CAAS,EAC/BC,EAAWN,EAAM,KAAKM,CAAS,EAC/BC,GAAWP,EAAM,KAAKO,CAAS,EAGpCH,GAAcD,GAAcH,EAAM,KAAK,GAAGI,CAAU,OAAO,EAC3DC,IAAcD,GAAcD,IAAeH,EAAM,KAAK,GAAGK,CAAS,OAAO,EACzEC,IAAcD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGM,CAAS,OAAO,EACtFC,IAAcD,GAAaD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGO,CAAS,MAAM,EAE/FP,EAAM,OAAS,EAAIA,EAAM,KAAK,IAAI,EAAI,MAC/C,EAOMQ,EAAiBnB,EAAM,WAAgD,CAAC,CAAE,WAAAoB,EAAY,KAAAC,CAAK,EAAGC,IAAQ,CAC1G,KAAM,CAAE,gBAAAjB,CAAgB,EAAIgB,EACtBE,EAAgBvB,EAAM,QAAQ,IAC3BI,EAA+BC,CAAe,EACpD,CAACA,CAAe,CAAC,EACpB,SACE,OAAC,OAAI,IAAKiB,EAAK,aAAW,MAAG,kDAAmDF,GAAY,IAAI,EAE9F,oBAAC,OAAI,UAAU,sEACb,qBAAC,OACC,aAAW,MACT,mLACAA,GAAY,OACd,EAEC,UAAAC,EAAK,iBACJ,OAAC,WACC,aAAW,MAAG,8BAA+BD,GAAY,KAAK,EAC9D,KAAMC,EAAK,aACX,KAAM,EACR,EAEDA,EAAK,gBACJ,OAAC,KACC,aAAW,MACT,6HACAD,GAAY,WACd,EACA,wBAAyB,CAAE,OAAQC,EAAK,WAAY,EACtD,KAEF,OAAC,OAAI,UAAU,mBACZ,SAAAA,EAAK,eACJ,OAAC,UACC,GAAG,IACH,QAAQ,OACR,aAAW,MAAG,sBAAuBD,GAAY,MAAM,EACvD,KAAMC,EAAK,WAEV,SAAAA,EAAK,WACR,EAEJ,GACF,KACA,OAAC,WACC,OAAQE,EACR,UAAU,yBACV,aAAa,uFACf,GACF,EACF,CAEJ,CAAC,EAEDJ,EAAe,YAAc,iBAC7B,IAAOtB,KAAQ,cAAWsB,CAAc",
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Heading, Button, Picture } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media } from '../../types/props.js'\n\nexport interface PromotionalBarSemanticName {\n root: 'root'\n content: 'content'\n title: 'title'\n description: 'description'\n button: 'button'\n}\n\n/**\n * \u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u914D\u7F6E\n */\nexport interface ResponsiveBackgroundImage {\n /** \u79FB\u52A8\u7AEF\u56FE\u7247 (<768px) */\n mobile?: Media\n /** \u5E73\u677F\u56FE\u7247 (768-1440px) */\n tablet?: Media\n /** \u7B14\u8BB0\u672C\u56FE\u7247 (1025-1440px) */\n laptop?: Media\n /** \u684C\u9762\u56FE\u7247 (1441-1920px) */\n desktop?: Media\n /** \u8D85\u5927\u684C\u9762\u56FE\u7247 (\u22651921px) */\n lgDesktop?: Media\n}\n\n/**\n * PromotionalBar \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface PromotionalBarData {\n /** \u7EC4\u4EF6\u5185\u5BB9\u6807\u9898 */\n contentTitle?: string\n /** \u7EC4\u4EF6\u5185\u5BB9\u63CF\u8FF0 */\n contentDesc?: string\n /** \u6309\u94AE\u6587\u672C */\n buttonText?: string\n /** \u6309\u94AE\u94FE\u63A5 */\n buttonLink?: string\n /** \u80CC\u666F\u56FE\u7247 - \u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61 */\n backgroundImage?: ResponsiveBackgroundImage\n}\n\nexport interface PromotionalBarProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: PromotionalBarData\n classNames?: Partial<Record<keyof PromotionalBarSemanticName, string>>\n}\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u5BF9\u8C61\u8F6C\u6362\u4E3A Picture \u7EC4\u4EF6\u6240\u9700\u7684\u5B57\u7B26\u4E32\u683C\u5F0F\n */\nconst convertResponsiveImageToString = (backgroundImage: ResponsiveBackgroundImage | undefined): string | undefined => {\n if (!backgroundImage) return undefined\n\n const { mobile, tablet, laptop, desktop, lgDesktop } = backgroundImage\n const parts: string[] = []\n\n // \u8F85\u52A9\u51FD\u6570\uFF1A\u4ECE Media \u5BF9\u8C61\u4E2D\u63D0\u53D6 URL\n const getUrl = (media: Media | undefined): string | undefined => {\n return media?.url\n }\n\n // \u9ED8\u8BA4\u56FE\u7247\uFF08\u6700\u5927\u5C3A\u5BF8\uFF09\u653E\u5728\u6700\u524D\u9762\uFF0C\u4E0D\u9700\u8981\u65AD\u70B9\n const lgDesktopUrl = getUrl(lgDesktop)\n const desktopUrl = getUrl(desktop)\n const laptopUrl = getUrl(laptop)\n const tabletUrl = getUrl(tablet)\n const mobileUrl = getUrl(mobile)\n\n if (lgDesktopUrl) parts.push(lgDesktopUrl)\n else if (desktopUrl) parts.push(desktopUrl)\n else if (laptopUrl) parts.push(laptopUrl)\n else if (tabletUrl) parts.push(tabletUrl)\n else if (mobileUrl) parts.push(mobileUrl)\n\n // \u6309\u65AD\u70B9\u4ECE\u5927\u5230\u5C0F\u6DFB\u52A0\n if (desktopUrl && lgDesktopUrl) parts.push(`${desktopUrl} 1920`)\n if (laptopUrl && (desktopUrl || lgDesktopUrl)) parts.push(`${laptopUrl} 1440`)\n if (tabletUrl && (laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${tabletUrl} 1024`)\n if (mobileUrl && (tabletUrl || laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${mobileUrl} 768`)\n\n return parts.length > 0 ? parts.join(', ') : undefined\n}\n\n/**\n * PromotionalBar - \u63A8\u5E7F\u680F\n *\n * @description \u63A8\u5E7F\u680F\n */\nconst PromotionalBar = React.forwardRef<HTMLDivElement, PromotionalBarProps>(({ classNames, data }, ref) => {\n const { backgroundImage } = data\n const pictureSource = React.useMemo(() => {\n return convertResponsiveImageToString(backgroundImage)\n }, [backgroundImage])\n return (\n <div ref={ref} className={cn('laptop:h-[192px] lg-desktop:h-[240px] h-[240px]', classNames?.root)}>\n {/* \u63A8\u5E7F\u680F\u5185\u5BB9\u533A\u57DF - \u6839\u636E\u5177\u4F53\u4E1A\u52A1\u9700\u6C42\u5B9A\u5236 */}\n <div className=\"promotional-bar-content rounded-card relative h-full overflow-hidden\">\n <div\n className={cn(\n 'laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4',\n classNames?.content\n )}\n >\n {data.contentTitle && (\n <Heading\n className={cn('line-clamp-2 text-[#F5F6F7]', classNames?.title)}\n html={data.contentTitle}\n size={3}\n />\n )}\n {data.contentDesc && (\n <p\n className={cn(\n 'laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] text-[#F5F6F7]',\n classNames?.description\n )}\n dangerouslySetInnerHTML={{ __html: data.contentDesc }}\n />\n )}\n <div className=\"laptop:mt-4 mt-2\">\n {data.buttonText && (\n <Button\n as=\"a\"\n variant=\"link\"\n className={cn('!p-0 text-[#F5F6F7]', classNames?.button)}\n href={data.buttonLink}\n iconClassName=\"size-4\"\n >\n {data.buttonText}\n </Button>\n )}\n </div>\n </div>\n <Picture\n source={pictureSource}\n className=\"absolute inset-0 z-10 \"\n imgClassName=\"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]\"\n />\n </div>\n </div>\n )\n})\n\nPromotionalBar.displayName = 'PromotionalBar'\nexport default withLayout(PromotionalBar)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAwGQ,IAAAI,EAAA,6BAtGRC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAAyC,qCACzCC,EAA2B,kCAoD3B,MAAMC,EAAkCC,GAA+E,CACrH,GAAI,CAACA,EAAiB,OAEtB,KAAM,CAAE,OAAAC,EAAQ,OAAAC,EAAQ,OAAAC,EAAQ,QAAAC,EAAS,UAAAC,CAAU,EAAIL,EACjDM,EAAkB,CAAC,EAGnBC,EAAUC,GACPA,GAAO,IAIVC,EAAeF,EAAOF,CAAS,EAC/BK,EAAaH,EAAOH,CAAO,EAC3BO,EAAYJ,EAAOJ,CAAM,EACzBS,EAAYL,EAAOL,CAAM,EACzBW,EAAYN,EAAON,CAAM,EAE/B,OAAIQ,EAAcH,EAAM,KAAKG,CAAY,EAChCC,EAAYJ,EAAM,KAAKI,CAAU,EACjCC,EAAWL,EAAM,KAAKK,CAAS,EAC/BC,EAAWN,EAAM,KAAKM,CAAS,EAC/BC,GAAWP,EAAM,KAAKO,CAAS,EAGpCH,GAAcD,GAAcH,EAAM,KAAK,GAAGI,CAAU,OAAO,EAC3DC,IAAcD,GAAcD,IAAeH,EAAM,KAAK,GAAGK,CAAS,OAAO,EACzEC,IAAcD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGM,CAAS,OAAO,EACtFC,IAAcD,GAAaD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGO,CAAS,MAAM,EAE/FP,EAAM,OAAS,EAAIA,EAAM,KAAK,IAAI,EAAI,MAC/C,EAOMQ,EAAiBnB,EAAM,WAAgD,CAAC,CAAE,WAAAoB,EAAY,KAAAC,CAAK,EAAGC,IAAQ,CAC1G,KAAM,CAAE,gBAAAjB,CAAgB,EAAIgB,EACtBE,EAAgBvB,EAAM,QAAQ,IAC3BI,EAA+BC,CAAe,EACpD,CAACA,CAAe,CAAC,EACpB,SACE,OAAC,OAAI,IAAKiB,EAAK,aAAW,MAAG,kDAAmDF,GAAY,IAAI,EAE9F,oBAAC,OAAI,UAAU,uEACb,qBAAC,OACC,aAAW,MACT,mLACAA,GAAY,OACd,EAEC,UAAAC,EAAK,iBACJ,OAAC,WACC,aAAW,MAAG,8BAA+BD,GAAY,KAAK,EAC9D,KAAMC,EAAK,aACX,KAAM,EACR,EAEDA,EAAK,gBACJ,OAAC,KACC,aAAW,MACT,6HACAD,GAAY,WACd,EACA,wBAAyB,CAAE,OAAQC,EAAK,WAAY,EACtD,KAEF,OAAC,OAAI,UAAU,mBACZ,SAAAA,EAAK,eACJ,OAAC,UACC,GAAG,IACH,QAAQ,OACR,aAAW,MAAG,sBAAuBD,GAAY,MAAM,EACvD,KAAMC,EAAK,WACX,cAAc,SAEb,SAAAA,EAAK,WACR,EAEJ,GACF,KACA,OAAC,WACC,OAAQE,EACR,UAAU,yBACV,aAAa,uFACf,GACF,EACF,CAEJ,CAAC,EAEDJ,EAAe,YAAc,iBAC7B,IAAOtB,KAAQ,cAAWsB,CAAc",
6
6
  "names": ["PromotionalBar_exports", "__export", "PromotionalBar_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "import_Styles", "convertResponsiveImageToString", "backgroundImage", "mobile", "tablet", "laptop", "desktop", "lgDesktop", "parts", "getUrl", "media", "lgDesktopUrl", "desktopUrl", "laptopUrl", "tabletUrl", "mobileUrl", "PromotionalBar", "classNames", "data", "ref", "pictureSource"]
7
7
  }
package/dist/cjs/biz-components/Title/Countdown.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var S=Object.create;var p=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var H=(e,t)=>{for(var s in t)p(e,s,{get:t[s],enumerable:!0})},v=(e,t,s,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of V(t))!F.call(e,a)&&a!==s&&p(e,a,{get:()=>t[a],enumerable:!(n=D(t,a))||n.enumerable});return e};var w=(e,t,s)=>(s=e!=null?S(j(e)):{},v(t||!e||!e.__esModule?p(s,"default",{value:e,enumerable:!0}):s,e)),I=e=>v(p({},"__esModule",{value:!0}),e);var U={};H(U,{default:()=>P});module.exports=I(U);var o=require("react/jsx-runtime"),i=w(require("react")),b=w(require("dayjs")),h=require("../../helpers/utils.js"),y=require("class-variance-authority");const T=e=>{const t=(0,b.default)(),n=(0,b.default)(e).diff(t,"second");if(n<=0)return{days:0,hours:0,minutes:0,seconds:0};const a=Math.floor(n/(24*60*60)),c=Math.floor(n%(24*60*60)/(60*60)),g=Math.floor(n%(60*60)/60),x=n%60;return{days:a,hours:c,minutes:g,seconds:x}},R=(0,y.cva)("lg-desktop:size-12 lg-desktop:px-1 flex size-10 flex-col items-center justify-center px-[2px] text-center",{variants:{theme:{light:"bg-info-primary",dark:"bg-[#f5f6f7]"}},defaultVariants:{theme:"light"}}),k=(0,y.cva)("",{variants:{theme:{light:"text-white",dark:"text-[#080A0F]"}},defaultVariants:{theme:"light"}}),z=({value:e,label:t,theme:s="light"})=>(0,o.jsxs)("div",{className:R({theme:s}),children:[(0,o.jsx)("p",{className:(0,h.cn)("lg-desktop:text-2xl text-[20px] font-bold leading-[1.2] tracking-[-0.96px]",k({theme:s})),children:String(e).padStart(2,"0")}),(0,o.jsx)("p",{className:(0,h.cn)("text-[12px] font-bold leading-[1.4] tracking-[-0.24px]",k({theme:s})),children:t})]}),E=()=>(0,o.jsx)("p",{className:"lg-desktop:text-2xl text-info-primary text-center text-xl font-bold leading-[1.2] tracking-[-0.96px]",children:":"}),C=i.default.forwardRef(({config:e,className:t,onCountdownEnd:s,theme:n="light"},a)=>{const{targetDate:c,showDays:g=!0,showHours:x=!0,showMinutes:L=!0,showSeconds:N=!0,labels:d={}}=e,[m,M]=(0,i.useState)(()=>T(c));(0,i.useEffect)(()=>{const u=setInterval(()=>{const r=T(c);M(r),r.days===0&&r.hours===0&&r.minutes===0&&r.seconds===0&&(s?.(),clearInterval(u))},1e3);return()=>clearInterval(u)},[c,s]);const f={days:d.days||"Day",hours:d.hours||"Hours",minutes:d.minutes||"Mins",seconds:d.seconds||"Secs"},l=[];return g&&l.push({value:m.days,label:f.days}),x&&l.push({value:m.hours,label:f.hours}),L&&l.push({value:m.minutes,label:f.minutes}),N&&l.push({value:m.seconds,label:f.seconds}),(0,o.jsx)("div",{ref:a,className:(0,h.cn)("flex items-center gap-1",t),children:l.map((u,r)=>(0,o.jsxs)(i.default.Fragment,{children:[(0,o.jsx)(z,{value:u.value,label:u.label,theme:n}),r<l.length-1&&(0,o.jsx)(E,{})]},u.label))})});C.displayName="Countdown";var P=C;
1
+ "use strict";"use client";var S=Object.create;var p=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var H=(e,t)=>{for(var s in t)p(e,s,{get:t[s],enumerable:!0})},v=(e,t,s,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of V(t))!F.call(e,a)&&a!==s&&p(e,a,{get:()=>t[a],enumerable:!(n=D(t,a))||n.enumerable});return e};var w=(e,t,s)=>(s=e!=null?S(j(e)):{},v(t||!e||!e.__esModule?p(s,"default",{value:e,enumerable:!0}):s,e)),I=e=>v(p({},"__esModule",{value:!0}),e);var U={};H(U,{default:()=>P});module.exports=I(U);var o=require("react/jsx-runtime"),i=w(require("react")),b=w(require("dayjs")),h=require("../../helpers/utils.js"),y=require("class-variance-authority");const T=e=>{const t=(0,b.default)(),n=(0,b.default)(e).diff(t,"second");if(n<=0)return{days:0,hours:0,minutes:0,seconds:0};const a=Math.floor(n/(24*60*60)),c=Math.floor(n%(24*60*60)/(60*60)),g=Math.floor(n%(60*60)/60),x=n%60;return{days:a,hours:c,minutes:g,seconds:x}},R=(0,y.cva)("lg-desktop:size-12 lg-desktop:px-1 flex size-10 flex-col items-center justify-center px-[2px] text-center",{variants:{theme:{light:"bg-info-primary",dark:"bg-[#f5f6f7]"}},defaultVariants:{theme:"light"}}),k=(0,y.cva)("",{variants:{theme:{light:"text-white",dark:"text-[#080A0F]"}},defaultVariants:{theme:"light"}}),z=({value:e,label:t,theme:s="light"})=>(0,o.jsxs)("div",{className:R({theme:s}),children:[(0,o.jsx)("p",{className:(0,h.cn)("lg-desktop:text-2xl text-[20px] font-bold leading-[1.2] tracking-[-0.96px]",k({theme:s})),children:String(e).padStart(2,"0")}),(0,o.jsx)("p",{className:(0,h.cn)("mt-[-6px] text-[12px] font-bold leading-[1.4] tracking-[-0.24px]",k({theme:s})),children:t})]}),E=()=>(0,o.jsx)("p",{className:"lg-desktop:text-2xl text-info-primary text-center text-xl font-bold leading-[1.2] tracking-[-0.96px]",children:":"}),C=i.default.forwardRef(({config:e,className:t,onCountdownEnd:s,theme:n="light"},a)=>{const{targetDate:c,showDays:g=!0,showHours:x=!0,showMinutes:L=!0,showSeconds:N=!0,labels:m={}}=e,[d,M]=(0,i.useState)(()=>T(c));(0,i.useEffect)(()=>{const u=setInterval(()=>{const r=T(c);M(r),r.days===0&&r.hours===0&&r.minutes===0&&r.seconds===0&&(s?.(),clearInterval(u))},1e3);return()=>clearInterval(u)},[c,s]);const f={days:m.days||"Day",hours:m.hours||"Hours",minutes:m.minutes||"Mins",seconds:m.seconds||"Secs"},l=[];return g&&l.push({value:d.days,label:f.days}),x&&l.push({value:d.hours,label:f.hours}),L&&l.push({value:d.minutes,label:f.minutes}),N&&l.push({value:d.seconds,label:f.seconds}),(0,o.jsx)("div",{ref:a,className:(0,h.cn)("flex items-center gap-1",t),children:l.map((u,r)=>(0,o.jsxs)(i.default.Fragment,{children:[(0,o.jsx)(z,{value:u.value,label:u.label,theme:n}),r<l.length-1&&(0,o.jsx)(E,{})]},u.label))})});C.displayName="Countdown";var P=C;
2
2
  //# sourceMappingURL=Countdown.js.map
package/dist/cjs/biz-components/Title/Countdown.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Title/Countdown.tsx"],
4
- "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport dayjs from 'dayjs'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport type { CountdownConfig } from './types.js'\nimport type { Theme } from '../../types/props.js'\n\ninterface CountdownProps {\n config: CountdownConfig\n className?: string\n onCountdownEnd?: () => void\n theme?: Theme\n}\n\ninterface TimeLeft {\n days: number\n hours: number\n minutes: number\n seconds: number\n}\n\n/**\n * \u8BA1\u7B97\u5269\u4F59\u65F6\u95F4\n */\nconst calculateTimeLeft = (targetDate: string): TimeLeft => {\n const now = dayjs()\n const target = dayjs(targetDate)\n const diff = target.diff(now, 'second')\n\n if (diff <= 0) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 }\n }\n\n const days = Math.floor(diff / (24 * 60 * 60))\n const hours = Math.floor((diff % (24 * 60 * 60)) / (60 * 60))\n const minutes = Math.floor((diff % (60 * 60)) / 60)\n const seconds = diff % 60\n\n return { days, hours, minutes, seconds }\n}\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u80CC\u666F\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownUnitVariants = cva(\n 'lg-desktop:size-12 lg-desktop:px-1 flex size-10 flex-col items-center justify-center px-[2px] text-center',\n {\n variants: {\n theme: {\n light: 'bg-info-primary',\n dark: 'bg-[#f5f6f7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\n/**\n * \u5012\u8BA1\u65F6\u6587\u5B57\u989C\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownTextVariants = cva('', {\n variants: {\n theme: {\n light: 'text-white',\n dark: 'text-[#080A0F]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u7EC4\u4EF6\n */\nconst CountdownUnit = ({ value, label, theme = 'light' }: { value: number; label: string; theme?: Theme }) => {\n return (\n <div className={countdownUnitVariants({ theme })}>\n <p\n className={cn(\n 'lg-desktop:text-2xl text-[20px] font-bold leading-[1.2] tracking-[-0.96px]',\n countdownTextVariants({ theme })\n )}\n >\n {String(value).padStart(2, '0')}\n </p>\n <p className={cn('text-[12px] font-bold leading-[1.4] tracking-[-0.24px]', countdownTextVariants({ theme }))}>\n {label}\n </p>\n </div>\n )\n}\n\n/**\n * \u5012\u8BA1\u65F6\u5206\u9694\u7B26\n */\nconst CountdownSeparator = () => {\n return (\n <p className=\"lg-desktop:text-2xl text-info-primary text-center text-xl font-bold leading-[1.2] tracking-[-0.96px]\">\n :\n </p>\n )\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u7EC4\u4EF6\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n ({ config, className, onCountdownEnd, theme = 'light' }, ref) => {\n const {\n targetDate,\n showDays = true,\n showHours = true,\n showMinutes = true,\n showSeconds = true,\n labels = {},\n } = config\n\n const [timeLeft, setTimeLeft] = useState<TimeLeft>(() => calculateTimeLeft(targetDate))\n\n useEffect(() => {\n const timer = setInterval(() => {\n const newTimeLeft = calculateTimeLeft(targetDate)\n setTimeLeft(newTimeLeft)\n\n // \u68C0\u67E5\u5012\u8BA1\u65F6\u662F\u5426\u7ED3\u675F\n if (\n newTimeLeft.days === 0 &&\n newTimeLeft.hours === 0 &&\n newTimeLeft.minutes === 0 &&\n newTimeLeft.seconds === 0\n ) {\n onCountdownEnd?.()\n clearInterval(timer)\n }\n }, 1000)\n\n return () => clearInterval(timer)\n }, [targetDate, onCountdownEnd])\n\n const defaultLabels = {\n days: labels.days || 'Day',\n hours: labels.hours || 'Hours',\n minutes: labels.minutes || 'Mins',\n seconds: labels.seconds || 'Secs',\n }\n\n const units = []\n if (showDays) units.push({ value: timeLeft.days, label: defaultLabels.days })\n if (showHours) units.push({ value: timeLeft.hours, label: defaultLabels.hours })\n if (showMinutes) units.push({ value: timeLeft.minutes, label: defaultLabels.minutes })\n if (showSeconds) units.push({ value: timeLeft.seconds, label: defaultLabels.seconds })\n\n return (\n <div ref={ref} className={cn('flex items-center gap-1', className)}>\n {units.map((unit, index) => (\n <React.Fragment key={unit.label}>\n <CountdownUnit value={unit.value} label={unit.label} theme={theme} />\n {index < units.length - 1 && <CountdownSeparator />}\n </React.Fragment>\n ))}\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport dayjs from 'dayjs'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport type { CountdownConfig } from './types.js'\nimport type { Theme } from '../../types/props.js'\n\ninterface CountdownProps {\n config: CountdownConfig\n className?: string\n onCountdownEnd?: () => void\n theme?: Theme\n}\n\ninterface TimeLeft {\n days: number\n hours: number\n minutes: number\n seconds: number\n}\n\n/**\n * \u8BA1\u7B97\u5269\u4F59\u65F6\u95F4\n */\nconst calculateTimeLeft = (targetDate: string): TimeLeft => {\n const now = dayjs()\n const target = dayjs(targetDate)\n const diff = target.diff(now, 'second')\n\n if (diff <= 0) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 }\n }\n\n const days = Math.floor(diff / (24 * 60 * 60))\n const hours = Math.floor((diff % (24 * 60 * 60)) / (60 * 60))\n const minutes = Math.floor((diff % (60 * 60)) / 60)\n const seconds = diff % 60\n\n return { days, hours, minutes, seconds }\n}\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u80CC\u666F\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownUnitVariants = cva(\n 'lg-desktop:size-12 lg-desktop:px-1 flex size-10 flex-col items-center justify-center px-[2px] text-center',\n {\n variants: {\n theme: {\n light: 'bg-info-primary',\n dark: 'bg-[#f5f6f7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\n/**\n * \u5012\u8BA1\u65F6\u6587\u5B57\u989C\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownTextVariants = cva('', {\n variants: {\n theme: {\n light: 'text-white',\n dark: 'text-[#080A0F]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u7EC4\u4EF6\n */\nconst CountdownUnit = ({ value, label, theme = 'light' }: { value: number; label: string; theme?: Theme }) => {\n return (\n <div className={countdownUnitVariants({ theme })}>\n <p\n className={cn(\n 'lg-desktop:text-2xl text-[20px] font-bold leading-[1.2] tracking-[-0.96px]',\n countdownTextVariants({ theme })\n )}\n >\n {String(value).padStart(2, '0')}\n </p>\n <p\n className={cn(\n 'mt-[-6px] text-[12px] font-bold leading-[1.4] tracking-[-0.24px]',\n countdownTextVariants({ theme })\n )}\n >\n {label}\n </p>\n </div>\n )\n}\n\n/**\n * \u5012\u8BA1\u65F6\u5206\u9694\u7B26\n */\nconst CountdownSeparator = () => {\n return (\n <p className=\"lg-desktop:text-2xl text-info-primary text-center text-xl font-bold leading-[1.2] tracking-[-0.96px]\">\n :\n </p>\n )\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u7EC4\u4EF6\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n ({ config, className, onCountdownEnd, theme = 'light' }, ref) => {\n const {\n targetDate,\n showDays = true,\n showHours = true,\n showMinutes = true,\n showSeconds = true,\n labels = {},\n } = config\n\n const [timeLeft, setTimeLeft] = useState<TimeLeft>(() => calculateTimeLeft(targetDate))\n\n useEffect(() => {\n const timer = setInterval(() => {\n const newTimeLeft = calculateTimeLeft(targetDate)\n setTimeLeft(newTimeLeft)\n\n // \u68C0\u67E5\u5012\u8BA1\u65F6\u662F\u5426\u7ED3\u675F\n if (\n newTimeLeft.days === 0 &&\n newTimeLeft.hours === 0 &&\n newTimeLeft.minutes === 0 &&\n newTimeLeft.seconds === 0\n ) {\n onCountdownEnd?.()\n clearInterval(timer)\n }\n }, 1000)\n\n return () => clearInterval(timer)\n }, [targetDate, onCountdownEnd])\n\n const defaultLabels = {\n days: labels.days || 'Day',\n hours: labels.hours || 'Hours',\n minutes: labels.minutes || 'Mins',\n seconds: labels.seconds || 'Secs',\n }\n\n const units = []\n if (showDays) units.push({ value: timeLeft.days, label: defaultLabels.days })\n if (showHours) units.push({ value: timeLeft.hours, label: defaultLabels.hours })\n if (showMinutes) units.push({ value: timeLeft.minutes, label: defaultLabels.minutes })\n if (showSeconds) units.push({ value: timeLeft.seconds, label: defaultLabels.seconds })\n\n return (\n <div ref={ref} className={cn('flex items-center gap-1', className)}>\n {units.map((unit, index) => (\n <React.Fragment key={unit.label}>\n <CountdownUnit value={unit.value} label={unit.label} theme={theme} />\n {index < units.length - 1 && <CountdownSeparator />}\n </React.Fragment>\n ))}\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
5
+ "mappings": "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",
6
6
  "names": ["Countdown_exports", "__export", "Countdown_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_dayjs", "import_utils", "import_class_variance_authority", "calculateTimeLeft", "targetDate", "now", "dayjs", "diff", "days", "hours", "minutes", "seconds", "countdownUnitVariants", "countdownTextVariants", "CountdownUnit", "value", "label", "theme", "CountdownSeparator", "Countdown", "React", "config", "className", "onCountdownEnd", "ref", "showDays", "showHours", "showMinutes", "showSeconds", "labels", "timeLeft", "setTimeLeft", "timer", "newTimeLeft", "defaultLabels", "units", "unit", "index"]
7
7
  }