@anker-in/headless-ui 1.3.1 → 1.3.3
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.
- package/dist/cjs/biz-components/AccordionCards/index.js +1 -1
- package/dist/cjs/biz-components/AccordionCards/index.js.map +2 -2
- package/dist/cjs/biz-components/EventSchedule/index.js +1 -1
- package/dist/cjs/biz-components/EventSchedule/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefits/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefits/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/utils/index.js +1 -1
- package/dist/cjs/biz-components/Listing/utils/index.js.map +2 -2
- package/dist/cjs/biz-components/SceneShelf/ProductCard.js +1 -1
- package/dist/cjs/biz-components/SceneShelf/ProductCard.js.map +3 -3
- package/dist/cjs/biz-components/WebPushPopup/index.d.ts +44 -0
- package/dist/cjs/biz-components/WebPushPopup/index.js +2 -0
- package/dist/cjs/biz-components/WebPushPopup/index.js.map +7 -0
- package/dist/cjs/biz-components/index.d.ts +4 -0
- package/dist/cjs/biz-components/index.js +1 -1
- package/dist/cjs/biz-components/index.js.map +3 -3
- package/dist/cjs/hooks/useEmarsysWebPush.d.ts +111 -0
- package/dist/cjs/hooks/useEmarsysWebPush.js +2 -0
- package/dist/cjs/hooks/useEmarsysWebPush.js.map +7 -0
- package/dist/cjs/shared/LocalizedLink.d.ts +6 -0
- package/dist/cjs/shared/LocalizedLink.js +2 -0
- package/dist/cjs/shared/LocalizedLink.js.map +7 -0
- package/dist/esm/biz-components/AccordionCards/index.js +1 -1
- package/dist/esm/biz-components/AccordionCards/index.js.map +2 -2
- package/dist/esm/biz-components/EventSchedule/index.js +1 -1
- package/dist/esm/biz-components/EventSchedule/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefits/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBenefits/index.js.map +2 -2
- package/dist/esm/biz-components/Listing/utils/index.js +1 -1
- package/dist/esm/biz-components/Listing/utils/index.js.map +2 -2
- package/dist/esm/biz-components/SceneShelf/ProductCard.js +1 -1
- package/dist/esm/biz-components/SceneShelf/ProductCard.js.map +3 -3
- package/dist/esm/biz-components/WebPushPopup/index.d.ts +44 -0
- package/dist/esm/biz-components/WebPushPopup/index.js +2 -0
- package/dist/esm/biz-components/WebPushPopup/index.js.map +7 -0
- package/dist/esm/biz-components/index.d.ts +4 -0
- package/dist/esm/biz-components/index.js +1 -1
- package/dist/esm/biz-components/index.js.map +3 -3
- package/dist/esm/hooks/useEmarsysWebPush.d.ts +111 -0
- package/dist/esm/hooks/useEmarsysWebPush.js +2 -0
- package/dist/esm/hooks/useEmarsysWebPush.js.map +7 -0
- package/dist/esm/shared/LocalizedLink.d.ts +6 -0
- package/dist/esm/shared/LocalizedLink.js +2 -0
- package/dist/esm/shared/LocalizedLink.js.map +7 -0
- package/package.json +4 -2
- package/static/emarsys-service-worker.js +31 -0
- package/style.css +52 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var j=Object.create;var I=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var P=Object.getPrototypeOf,O=Object.prototype.hasOwnProperty;var V=(e,t)=>{for(var i in t)I(e,i,{get:t[i],enumerable:!0})},R=(e,t,i,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let c of z(t))!O.call(e,c)&&c!==i&&I(e,c,{get:()=>t[c],enumerable:!(d=A(t,c))||d.enumerable});return e};var h=(e,t,i)=>(i=e!=null?j(P(e)):{},R(t||!e||!e.__esModule?I(i,"default",{value:e,enumerable:!0}):i,e)),W=e=>R(I({},"__esModule",{value:!0}),e);var F={};V(F,{default:()=>U});module.exports=W(F);var n=require("react/jsx-runtime"),B=h(require("../Title/index.js")),l=require("../../helpers/utils.js"),g=h(require("../../components/picture.js")),N=h(require("../../components/button.js")),S=h(require("../SwiperBox/index.js")),C=require("../../shared/Styles.js"),r=h(require("react")),L=require("../../hooks/useExposure.js"),y=require("../../shared/trackUrlRef.js"),D=h(require("../../shared/throttle.js")),M=require("../../components/heading.js");const a="image",m="scene_banner",q=({item:e,idx:t,itemShape:i,hoverIndex:d,getRef:c,handleSwiperItemClick:x,contentWidth:p,primaryButton:u,event:f,data:b,accordionRef:$})=>{const T=d===t,k=T?8:1;return(0,L.useExposure)({current:$.current[t]},{componentType:a,componentName:m,componentTitle:e?.title,position:t+1,componentDescription:e?.subTitle}),(0,n.jsxs)("div",{style:{flex:`${k} 1 0%`,transition:"all 0.6s"},ref:w=>{w&&c(t,w)},className:(0,l.cn)("relative cursor-pointer overflow-hidden",i==="round"?"rounded-2xl":""),onMouseEnter:()=>x(t),onClick:()=>{x(t)},children:[e?.imgLink?(0,n.jsx)("a",{href:(0,y.trackUrlRef)(e.imgLink,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}`,children:(0,n.jsx)(g.default,{source:e?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",alt:e?.img?.alt||""})}):(0,n.jsx)(g.default,{source:e?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",alt:e?.img?.alt||""}),(0,n.jsxs)("div",{style:{width:p},className:(0,l.cn)("absolute inset-x-0 bottom-0 flex w-full items-end justify-between overflow-hidden px-8 pb-8 opacity-0 transition-opacity duration-[600ms] ease-in",T&&p?"opacity-100":"opacity-0"),children:[(0,n.jsxs)("div",{className:"mr-16 flex-1 overflow-hidden",children:[(0,n.jsx)(M.Heading,{as:"h3",className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:e?.title}),(0,n.jsx)(M.Heading,{as:"h4",className:"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary line-clamp-2 text-[14px] font-[700]",children:e?.subTitle})]}),u&&(0,n.jsxs)(N.default,{className:(0,l.cn)("mb-1.5 font-bold"),as:"a",href:(0,y.trackUrlRef)(e?.link,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}#${u}`,onClick:()=>f?.primaryButton?.(b,t),children:[u,(0,n.jsx)("span",{className:"sr-only",children:e?.title??e?.subTitle})]})]})]},t)},J=({data:e,configuration:t})=>{const i=(0,r.useRef)(null);return(0,L.useExposure)(i,{componentType:a,componentName:m,componentTitle:e?.title,position:t?.index+1,componentDescription:e?.subTitle}),(0,n.jsxs)("div",{ref:i,className:(0,l.cn)("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",t?.itemShape==="round"?"rounded-2xl":""),children:[e?.imgLink?(0,n.jsx)("a",{href:(0,y.trackUrlRef)(e.imgLink,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-title-desc-button":`${e?.title}@${e?.subTitle}`,"data-headless-nav-position":`''#${t?.index+1}`,children:(0,n.jsx)(g.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:e?.mobileImg?.url||"",alt:e?.mobileImg?.alt||""})}):(0,n.jsx)(g.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:e?.mobileImg?.url||"",alt:e?.mobileImg?.alt||""}),(0,n.jsxs)("div",{className:(0,l.cn)("absolute inset-x-0 bottom-0 overflow-hidden px-4 pb-4"),children:[(0,n.jsxs)("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[(0,n.jsx)("h3",{className:"text-info-primary line-clamp-3 text-2xl font-bold leading-[1.2]",dangerouslySetInnerHTML:{__html:e?.title}}),(0,n.jsx)("h4",{className:"text-info-primary line-clamp-2 text-sm font-bold",dangerouslySetInnerHTML:{__html:e?.subTitle}})]}),t?.primaryButton&&(0,n.jsx)(N.default,{as:"a",variant:"secondary","aria-label":e?.title??e?.subTitle,className:(0,l.cn)("text-info-primary text-sm font-bold"),href:(0,y.trackUrlRef)(e.link,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-nav-position":`''#${t?.index+1}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}#${t?.primaryButton}`,children:t?.primaryButton})]})]})},E=r.default.forwardRef(({data:e,autoplay:t={enabled:!1,loop:!1,interval:1500},className:i="",event:d,...c},x)=>{const[p,u]=(0,r.useState)(0),f=(0,r.useRef)(0),b=(0,r.useRef)([]),[$,T]=(0,r.useState)(0),k=(0,r.useRef)(null);(0,r.useImperativeHandle)(x,()=>k.current);const w=(o,s)=>{s&&(b.current[o]=s)};(0,r.useEffect)(()=>{const o=()=>{b.current[f.current]&&T(b.current[f.current].offsetWidth)};o();const s=(0,D.default)(o,300);return window.addEventListener("resize",s),()=>window.removeEventListener("resize",s)},[]);const H=(0,r.useCallback)(o=>{p!==o&&(u(o),f.current=o)},[e?.products,p]);return(0,r.useEffect)(()=>{let o;return t?.enabled&&(o=setInterval(()=>{u(s=>{const _=s??0;let v;if(t.loop!==!1)v=(_+1)%e?.products?.length;else if(v=_+1,v>=e?.products?.length)return v=e?.products?.length-1,o&&clearInterval(o),_;return f.current=v,v})},t?.interval)),()=>{o&&clearInterval(o)}},[t?.enabled,t?.interval,t?.loop,e?.products?.length,H]),(0,n.jsxs)("div",{...c,ref:k,children:[e?.title&&(0,n.jsx)(B.default,{data:{title:e?.title}}),(0,n.jsx)("div",{className:(0,l.cn)("laptop:block hidden",{"aiui-dark":e?.theme==="dark"}),children:(0,n.jsx)("div",{className:(0,l.cn)("lg-desktop:h-[calc(560_/_1920*100vw)] desktop:h-[calc(448_/_1440*100vw)] laptop:h-[calc(336_/_1025*100vw)] flex max-h-[560px] min-h-[336px] w-full gap-4 overflow-hidden",i),children:e?.products?.map((o,s)=>(0,n.jsx)(q,{item:o,idx:s,itemShape:e?.itemShape,hoverIndex:p,getRef:w,handleSwiperItemClick:H,contentWidth:$,primaryButton:e?.primaryButton,event:d,data:e,accordionRef:b},s))})}),(0,n.jsx)("div",{className:(0,l.cn)("laptop:hidden block",{"aiui-dark":e?.theme==="dark"}),children:(0,n.jsx)(S.default,{className:(0,l.cn)("h-[400px] !overflow-visible",i),id:"AccordionCards"+e?.key,data:{list:e?.products,configuration:{shape:e?.shape,itemShape:e?.itemShape,primaryButton:e?.primaryButton,event:d,title:e?.title}},Slide:J,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3}}})})]})});E.displayName="AccordionCards";var U=(0,C.withLayout)(E);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/AccordionCards/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport React, { useState, useRef, useCallback, useImperativeHandle, useEffect, type RefObject } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { Img } from '../../types/props.js'\nimport throttle from '../../shared/throttle.js'\nimport { Heading } from '../../components/heading.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n /** \u6807\u9898\u6587\u672C */\n title: string\n /** \u56FE\u7247*/\n img: Img\n mobileImg?: Img\n /** \u5185\u5BB9\u8282\u70B9 */\n subTitle: string\n link?: string\n imgLink?: string\n}\n\nexport type AccordionCardsType = Omit<React.HTMLAttributes<HTMLDivElement>, 'className'> & {\n className?: string\n data: {\n key?: string\n title?: string\n products: Array<ItemType>\n /** \u6309\u94AE\u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u5361\u7247\u5F62\u72B6 */\n itemShape?: 'round' | 'square'\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton?: string\n theme?: 'light' | 'dark'\n }\n /**\n * \u81EA\u52A8\u64AD\u653E\u914D\u7F6E\n */\n autoplay?: {\n /**\n * \u662F\u5426\u5F00\u542F\u81EA\u52A8\u64AD\u653E\n */\n enabled: boolean\n /**\n * \u662F\u5426\u5FAA\u73AF\u64AD\u653E\n */\n loop?: boolean\n /**\n * \u81EA\u52A8\u64AD\u653E\u95F4\u9694\u65F6\u95F4\uFF0C\u5355\u4F4D\u6BEB\u79D2\n */\n interval?: number\n }\n /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: {\n primaryButton?: (_v: any, _index: number) => void\n }\n}\n\nconst AccordionCardsPcItem = ({\n item,\n idx,\n itemShape,\n hoverIndex,\n getRef,\n handleSwiperItemClick,\n contentWidth,\n primaryButton,\n event,\n data,\n accordionRef,\n}: {\n item: ItemType\n idx: number\n itemShape: 'round' | 'square' | undefined\n hoverIndex: number | null\n getRef: (_idx: number, _el: HTMLDivElement) => void\n handleSwiperItemClick: (_idx: number) => void\n contentWidth: number\n primaryButton: string | undefined\n event: any\n data: AccordionCardsType['data']\n accordionRef: React.MutableRefObject<HTMLDivElement[]>\n}) => {\n const isExpanded = hoverIndex === idx\n const flexValue = isExpanded ? 8 : 1\n\n useExposure({ current: accordionRef.current[idx] } as RefObject<HTMLDivElement>, {\n componentType,\n componentName,\n componentTitle: item?.title,\n position: idx + 1,\n componentDescription: item?.subTitle,\n })\n\n return (\n <div\n key={idx}\n style={{\n flex: `${flexValue} 1 0%`,\n transition: 'all 0.6s',\n }}\n ref={(el: HTMLDivElement | null) => {\n if (el) getRef(idx, el)\n }}\n className={cn('relative cursor-pointer overflow-hidden', itemShape === 'round' ? 'rounded-2xl' : '')}\n onMouseEnter={() => handleSwiperItemClick(idx)}\n onClick={() => {\n handleSwiperItemClick(idx)\n }}\n >\n <a\n href={trackUrlRef(item?.imgLink, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${item?.title}#${item?.subTitle}`}\n >\n <Picture\n source={item?.img?.url}\n className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n alt={item?.img?.alt || ''}\n />\n </a>\n <div\n style={{\n width: contentWidth,\n }}\n className={cn(\n 'absolute inset-x-0 bottom-0 flex w-full items-end justify-between overflow-hidden px-8 pb-8 opacity-0 transition-opacity duration-[600ms] ease-in',\n isExpanded && contentWidth ? 'opacity-100' : 'opacity-0'\n )}\n >\n <div className=\"mr-16 flex-1 overflow-hidden\">\n <Heading as=\"h3\" className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n {item?.title}\n </Heading>\n <Heading\n as=\"h4\"\n className=\"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary line-clamp-2 text-[14px] font-[700]\"\n >\n {item?.subTitle}\n </Heading>\n </div>\n {primaryButton && (\n <Button\n className={cn('mb-1.5 font-bold')}\n as=\"a\"\n href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${item?.title}#${item?.subTitle}#${primaryButton}`}\n onClick={() => event?.primaryButton?.(data, idx)}\n >\n {primaryButton}\n <span className=\"sr-only\">{item?.title ?? item?.subTitle}</span>\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n const ref = useRef<HTMLDivElement>(null)\n\n useExposure(ref, {\n componentType,\n componentName,\n componentTitle: data?.title,\n position: configuration?.index + 1,\n componentDescription: data?.subTitle,\n })\n\n return (\n <div\n ref={ref}\n className={cn(\n 'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n )}\n >\n <a\n href={trackUrlRef(data?.imgLink, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${data?.title}@${data?.subTitle}`}\n data-headless-nav-position={`''#${configuration?.index + 1}`}\n >\n <Picture\n className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n source={data?.mobileImg?.url || ''}\n alt={data?.mobileImg?.alt || ''}\n />\n </a>\n <div className={cn('absolute inset-x-0 bottom-0 overflow-hidden px-4 pb-4')}>\n <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n <h3\n className=\"text-info-primary line-clamp-3 text-2xl font-bold leading-[1.2]\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n ></h3>\n <h4\n className=\"text-info-primary line-clamp-2 text-sm font-bold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n ></h4>\n </div>\n\n {configuration?.primaryButton && (\n <Button\n as=\"a\"\n variant=\"secondary\"\n aria-label={data?.title ?? data?.subTitle}\n className={cn('text-info-primary text-sm font-bold')}\n href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-nav-position={`''#${configuration?.index + 1}`}\n data-headless-title-desc-button={`${data?.title}#${data?.subTitle}#${configuration?.primaryButton}`}\n >\n {configuration?.primaryButton}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(\n ({ data, autoplay = { enabled: false, loop: false, interval: 1500 }, className = '', event, ...rest }, ref) => {\n const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n\n const hoverIndexRef = useRef<number>(0)\n const accordionRef = useRef<HTMLDivElement[]>([])\n const [contentWidth, setContentWidth] = useState<number>(0)\n\n const innerRef = useRef<HTMLDivElement>(null)\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n const getRef = (index: number, el: HTMLDivElement) => {\n if (el) {\n accordionRef.current[index] = el\n }\n }\n\n useEffect(() => {\n const handleResize = () => {\n if (accordionRef.current[hoverIndexRef.current]) {\n setContentWidth(accordionRef.current[hoverIndexRef.current].offsetWidth)\n }\n }\n handleResize()\n const throttleResize = throttle(handleResize, 300)\n window.addEventListener('resize', throttleResize)\n return () => window.removeEventListener('resize', throttleResize)\n }, [])\n\n const handleSwiperItemClick = useCallback(\n (idx: number) => {\n if (hoverIndex === idx) return\n // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n setHoverIndex(idx)\n hoverIndexRef.current = idx\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [data?.products, hoverIndex]\n )\n\n useEffect(() => {\n let autoPlayTimer: NodeJS.Timeout\n if (autoplay?.enabled) {\n autoPlayTimer = setInterval(() => {\n setHoverIndex(prev => {\n const currentIndex = prev ?? 0\n let nextIndex: number\n\n if (autoplay.loop !== false) {\n // \u9ED8\u8BA4\u5FAA\u73AF\u64AD\u653E\n nextIndex = (currentIndex + 1) % data?.products?.length\n } else {\n // \u4E0D\u5FAA\u73AF\uFF1A\u64AD\u653E\u5230\u6700\u540E\u4E00\u4E2A\u540E\u505C\u6B62\n nextIndex = currentIndex + 1\n if (nextIndex >= data?.products?.length) {\n nextIndex = data?.products?.length - 1\n // \u505C\u6B62\u81EA\u52A8\u64AD\u653E\n if (autoPlayTimer) {\n clearInterval(autoPlayTimer)\n }\n return currentIndex // \u4FDD\u6301\u5728\u6700\u540E\u4E00\u4E2A\n }\n }\n\n hoverIndexRef.current = nextIndex\n return nextIndex\n })\n }, autoplay?.interval)\n }\n return () => {\n if (autoPlayTimer) {\n clearInterval(autoPlayTimer)\n }\n }\n }, [autoplay?.enabled, autoplay?.interval, autoplay?.loop, data?.products?.length, handleSwiperItemClick])\n\n return (\n <div {...rest} ref={innerRef}>\n {data?.title && <Title data={{ title: data?.title }} />}\n <div className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n <div\n className={cn(\n 'lg-desktop:h-[calc(560_/_1920*100vw)] desktop:h-[calc(448_/_1440*100vw)] laptop:h-[calc(336_/_1025*100vw)] flex max-h-[560px] min-h-[336px] w-full gap-4 overflow-hidden',\n className\n )}\n >\n {data?.products?.map((item, idx) => (\n <AccordionCardsPcItem\n key={idx}\n item={item}\n idx={idx}\n itemShape={data?.itemShape}\n hoverIndex={hoverIndex}\n getRef={getRef}\n handleSwiperItemClick={handleSwiperItemClick}\n contentWidth={contentWidth}\n primaryButton={data?.primaryButton}\n event={event}\n data={data}\n accordionRef={accordionRef}\n />\n ))}\n </div>\n </div>\n <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n <SwiperBox\n className={cn('h-[400px] !overflow-visible', className)}\n id={'AccordionCards' + data?.key}\n data={{\n list: data?.products,\n configuration: {\n shape: data?.shape,\n itemShape: data?.itemShape,\n primaryButton: data?.primaryButton,\n event: event,\n title: data?.title,\n },\n }}\n Slide={MobileItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.2,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2.3,\n },\n }}\n />\n </div>\n </div>\n )\n }\n)\n\nAccordionCards.displayName = 'AccordionCards'\nexport default withLayout(AccordionCards)\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport React, { useState, useRef, useCallback, useImperativeHandle, useEffect, type RefObject } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { Img } from '../../types/props.js'\nimport throttle from '../../shared/throttle.js'\nimport { Heading } from '../../components/heading.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n /** \u6807\u9898\u6587\u672C */\n title: string\n /** \u56FE\u7247*/\n img: Img\n mobileImg?: Img\n /** \u5185\u5BB9\u8282\u70B9 */\n subTitle: string\n link?: string\n imgLink?: string\n}\n\nexport type AccordionCardsType = Omit<React.HTMLAttributes<HTMLDivElement>, 'className'> & {\n className?: string\n data: {\n key?: string\n title?: string\n products: Array<ItemType>\n /** \u6309\u94AE\u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u5361\u7247\u5F62\u72B6 */\n itemShape?: 'round' | 'square'\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton?: string\n theme?: 'light' | 'dark'\n }\n /**\n * \u81EA\u52A8\u64AD\u653E\u914D\u7F6E\n */\n autoplay?: {\n /**\n * \u662F\u5426\u5F00\u542F\u81EA\u52A8\u64AD\u653E\n */\n enabled: boolean\n /**\n * \u662F\u5426\u5FAA\u73AF\u64AD\u653E\n */\n loop?: boolean\n /**\n * \u81EA\u52A8\u64AD\u653E\u95F4\u9694\u65F6\u95F4\uFF0C\u5355\u4F4D\u6BEB\u79D2\n */\n interval?: number\n }\n /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: {\n primaryButton?: (_v: any, _index: number) => void\n }\n}\n\nconst AccordionCardsPcItem = ({\n item,\n idx,\n itemShape,\n hoverIndex,\n getRef,\n handleSwiperItemClick,\n contentWidth,\n primaryButton,\n event,\n data,\n accordionRef,\n}: {\n item: ItemType\n idx: number\n itemShape: 'round' | 'square' | undefined\n hoverIndex: number | null\n getRef: (_idx: number, _el: HTMLDivElement) => void\n handleSwiperItemClick: (_idx: number) => void\n contentWidth: number\n primaryButton: string | undefined\n event: any\n data: AccordionCardsType['data']\n accordionRef: React.MutableRefObject<HTMLDivElement[]>\n}) => {\n const isExpanded = hoverIndex === idx\n const flexValue = isExpanded ? 8 : 1\n\n useExposure({ current: accordionRef.current[idx] } as RefObject<HTMLDivElement>, {\n componentType,\n componentName,\n componentTitle: item?.title,\n position: idx + 1,\n componentDescription: item?.subTitle,\n })\n\n return (\n <div\n key={idx}\n style={{\n flex: `${flexValue} 1 0%`,\n transition: 'all 0.6s',\n }}\n ref={(el: HTMLDivElement | null) => {\n if (el) getRef(idx, el)\n }}\n className={cn('relative cursor-pointer overflow-hidden', itemShape === 'round' ? 'rounded-2xl' : '')}\n onMouseEnter={() => handleSwiperItemClick(idx)}\n onClick={() => {\n handleSwiperItemClick(idx)\n }}\n >\n {item?.imgLink ? (\n <a\n href={trackUrlRef(item.imgLink, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${item?.title}#${item?.subTitle}`}\n >\n <Picture\n source={item?.img?.url}\n className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n alt={item?.img?.alt || ''}\n />\n </a>\n ) : (\n <Picture\n source={item?.img?.url}\n className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n alt={item?.img?.alt || ''}\n />\n )}\n <div\n style={{\n width: contentWidth,\n }}\n className={cn(\n 'absolute inset-x-0 bottom-0 flex w-full items-end justify-between overflow-hidden px-8 pb-8 opacity-0 transition-opacity duration-[600ms] ease-in',\n isExpanded && contentWidth ? 'opacity-100' : 'opacity-0'\n )}\n >\n <div className=\"mr-16 flex-1 overflow-hidden\">\n <Heading as=\"h3\" className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n {item?.title}\n </Heading>\n <Heading\n as=\"h4\"\n className=\"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary line-clamp-2 text-[14px] font-[700]\"\n >\n {item?.subTitle}\n </Heading>\n </div>\n {primaryButton && (\n <Button\n className={cn('mb-1.5 font-bold')}\n as=\"a\"\n href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${item?.title}#${item?.subTitle}#${primaryButton}`}\n onClick={() => event?.primaryButton?.(data, idx)}\n >\n {primaryButton}\n <span className=\"sr-only\">{item?.title ?? item?.subTitle}</span>\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n const ref = useRef<HTMLDivElement>(null)\n\n useExposure(ref, {\n componentType,\n componentName,\n componentTitle: data?.title,\n position: configuration?.index + 1,\n componentDescription: data?.subTitle,\n })\n\n return (\n <div\n ref={ref}\n className={cn(\n 'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n )}\n >\n {data?.imgLink ? (\n <a\n href={trackUrlRef(data.imgLink, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${data?.title}@${data?.subTitle}`}\n data-headless-nav-position={`''#${configuration?.index + 1}`}\n >\n <Picture\n className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n source={data?.mobileImg?.url || ''}\n alt={data?.mobileImg?.alt || ''}\n />\n </a>\n ) : (\n <Picture\n className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n source={data?.mobileImg?.url || ''}\n alt={data?.mobileImg?.alt || ''}\n />\n )}\n <div className={cn('absolute inset-x-0 bottom-0 overflow-hidden px-4 pb-4')}>\n <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n <h3\n className=\"text-info-primary line-clamp-3 text-2xl font-bold leading-[1.2]\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n ></h3>\n <h4\n className=\"text-info-primary line-clamp-2 text-sm font-bold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n ></h4>\n </div>\n\n {configuration?.primaryButton && (\n <Button\n as=\"a\"\n variant=\"secondary\"\n aria-label={data?.title ?? data?.subTitle}\n className={cn('text-info-primary text-sm font-bold')}\n href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-nav-position={`''#${configuration?.index + 1}`}\n data-headless-title-desc-button={`${data?.title}#${data?.subTitle}#${configuration?.primaryButton}`}\n >\n {configuration?.primaryButton}\n </Button>\n )}\n </div>\n </div>\n )\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(\n ({ data, autoplay = { enabled: false, loop: false, interval: 1500 }, className = '', event, ...rest }, ref) => {\n const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n\n const hoverIndexRef = useRef<number>(0)\n const accordionRef = useRef<HTMLDivElement[]>([])\n const [contentWidth, setContentWidth] = useState<number>(0)\n\n const innerRef = useRef<HTMLDivElement>(null)\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n const getRef = (index: number, el: HTMLDivElement) => {\n if (el) {\n accordionRef.current[index] = el\n }\n }\n\n useEffect(() => {\n const handleResize = () => {\n if (accordionRef.current[hoverIndexRef.current]) {\n setContentWidth(accordionRef.current[hoverIndexRef.current].offsetWidth)\n }\n }\n handleResize()\n const throttleResize = throttle(handleResize, 300)\n window.addEventListener('resize', throttleResize)\n return () => window.removeEventListener('resize', throttleResize)\n }, [])\n\n const handleSwiperItemClick = useCallback(\n (idx: number) => {\n if (hoverIndex === idx) return\n // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n setHoverIndex(idx)\n hoverIndexRef.current = idx\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [data?.products, hoverIndex]\n )\n\n useEffect(() => {\n let autoPlayTimer: NodeJS.Timeout\n if (autoplay?.enabled) {\n autoPlayTimer = setInterval(() => {\n setHoverIndex(prev => {\n const currentIndex = prev ?? 0\n let nextIndex: number\n\n if (autoplay.loop !== false) {\n // \u9ED8\u8BA4\u5FAA\u73AF\u64AD\u653E\n nextIndex = (currentIndex + 1) % data?.products?.length\n } else {\n // \u4E0D\u5FAA\u73AF\uFF1A\u64AD\u653E\u5230\u6700\u540E\u4E00\u4E2A\u540E\u505C\u6B62\n nextIndex = currentIndex + 1\n if (nextIndex >= data?.products?.length) {\n nextIndex = data?.products?.length - 1\n // \u505C\u6B62\u81EA\u52A8\u64AD\u653E\n if (autoPlayTimer) {\n clearInterval(autoPlayTimer)\n }\n return currentIndex // \u4FDD\u6301\u5728\u6700\u540E\u4E00\u4E2A\n }\n }\n\n hoverIndexRef.current = nextIndex\n return nextIndex\n })\n }, autoplay?.interval)\n }\n return () => {\n if (autoPlayTimer) {\n clearInterval(autoPlayTimer)\n }\n }\n }, [autoplay?.enabled, autoplay?.interval, autoplay?.loop, data?.products?.length, handleSwiperItemClick])\n\n return (\n <div {...rest} ref={innerRef}>\n {data?.title && <Title data={{ title: data?.title }} />}\n <div className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n <div\n className={cn(\n 'lg-desktop:h-[calc(560_/_1920*100vw)] desktop:h-[calc(448_/_1440*100vw)] laptop:h-[calc(336_/_1025*100vw)] flex max-h-[560px] min-h-[336px] w-full gap-4 overflow-hidden',\n className\n )}\n >\n {data?.products?.map((item, idx) => (\n <AccordionCardsPcItem\n key={idx}\n item={item}\n idx={idx}\n itemShape={data?.itemShape}\n hoverIndex={hoverIndex}\n getRef={getRef}\n handleSwiperItemClick={handleSwiperItemClick}\n contentWidth={contentWidth}\n primaryButton={data?.primaryButton}\n event={event}\n data={data}\n accordionRef={accordionRef}\n />\n ))}\n </div>\n </div>\n <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n <SwiperBox\n className={cn('h-[400px] !overflow-visible', className)}\n id={'AccordionCards' + data?.key}\n data={{\n list: data?.products,\n configuration: {\n shape: data?.shape,\n itemShape: data?.itemShape,\n primaryButton: data?.primaryButton,\n event: event,\n title: data?.title,\n },\n }}\n Slide={MobileItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.2,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2.3,\n },\n }}\n />\n </div>\n </div>\n )\n }\n)\n\nAccordionCards.displayName = 'AccordionCards'\nexport default withLayout(AccordionCards)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["AccordionCards_exports", "__export", "AccordionCards_default", "__toCommonJS", "import_jsx_runtime", "import_Title", "import_utils", "import_picture", "import_button", "import_SwiperBox", "import_Styles", "import_react", "import_useExposure", "import_trackUrlRef", "import_throttle", "import_heading", "componentType", "componentName", "AccordionCardsPcItem", "item", "idx", "itemShape", "hoverIndex", "getRef", "handleSwiperItemClick", "contentWidth", "primaryButton", "event", "data", "accordionRef", "isExpanded", "flexValue", "el", "Picture", "Button", "MobileItem", "configuration", "ref", "AccordionCards", "React", "autoplay", "className", "rest", "setHoverIndex", "hoverIndexRef", "setContentWidth", "innerRef", "index", "handleResize", "throttleResize", "throttle", "autoPlayTimer", "prev", "currentIndex", "nextIndex", "Title", "SwiperBox"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var R=Object.create;var S=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var H=Object.getPrototypeOf,O=Object.prototype.hasOwnProperty;var q=(e,t)=>{for(var n in t)S(e,n,{get:t[n],enumerable:!0})},L=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of j(t))!O.call(e,i)&&i!==n&&S(e,i,{get:()=>t[i],enumerable:!(o=z(t,i))||o.enumerable});return e};var F=(e,t,n)=>(n=e!=null?R(H(e)):{},L(t||!e||!e.__esModule?S(n,"default",{value:e,enumerable:!0}):n,e)),G=e=>L(S({},"__esModule",{value:!0}),e);var Z={};q(Z,{default:()=>Y});module.exports=G(Z);var s=require("react/jsx-runtime"),l=F(require("react")),u=require("../../helpers/index.js"),$=require("../../shared/Styles.js"),m=require("../../components/index.js"),f=require("swiper/react"),k=F(require("dayjs")),v=require("class-variance-authority");const E=(e,t)=>{const n=(0,k.default)(),o=(0,k.default)(e).startOf("day"),i=(0,k.default)(t).endOf("day");return n.isAfter(i)?"completed":n.isBefore(o)?"not-started":"in-progress"},J=(0,v.cva)("h-1 w-full overflow-hidden",{variants:{state:{"in-progress-light":"bg-[#F6CD4E]","in-progress-dark":"bg-[#D79941]","not-started-light":"bg-[#EAEAEC]","not-started-dark":"bg-[#1E2024]","completed-light":"bg-[#F6CD4E]","completed-dark":"bg-[#D79941]"}},defaultVariants:{state:"not-started-light"}}),K=(0,v.cva)("size-4 rounded-full transition-colors",{variants:{state:{"in-progress-light":"bg-[#F6CD4E]","in-progress-dark":"bg-[#D79941]","not-started-light":"bg-[#EAEAEC]","not-started-dark":"bg-[#1E2024]","completed-light":"bg-[#F6CD4E]","completed-dark":"bg-[#D79941]"}},defaultVariants:{state:"not-started-light"}}),T=(0,v.cva)("font-bold leading-[1.2]",{variants:{state:{"in-progress-light":"text-[#080A0F]","in-progress-dark":"text-white","not-started-light":"text-[#080A0F]","not-started-dark":"text-[#F5F6F7]","completed-light":"text-[#4A4C56]/60","completed-dark":"text-[#F5F6F7]/60"}},defaultVariants:{state:"not-started-light"}}),Q=(0,v.cva)("laptop:h-[160px] rounded-box relative flex h-[120px] min-w-0 flex-col justify-between gap-2 overflow-hidden",{variants:{state:{"in-progress-light":"bg-[#F4E8BC]","in-progress-dark":"bg-[#D79941]","not-started-light":"bg-[#EAEAEC]","not-started-dark":"bg-[#1E2024]","completed-light":"bg-[#F4E8BC]","completed-dark":"bg-[#D79941]"}},defaultVariants:{state:"not-started-light"}}),U=({timeStatus:e,theme:t="light",className:n,index:o,nodeLength:i})=>{const p=`${e}-${t}`,a=o===0,d=o===i-1;return(0,s.jsxs)("div",{className:(0,u.cn)(`event-schedule-timeline-node event-schedule-timeline-node--${e} relative my-2 flex h-1 w-full items-center justify-center`,n),children:[(0,s.jsx)("div",{className:(0,u.cn)(`event-schedule-timeline-progress event-schedule-timeline-progress--${e}`,J({state:p}),a&&"rounded-l-full",d&&"rounded-r-full")}),(0,s.jsx)("div",{className:"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",children:(0,s.jsx)("div",{className:(0,u.cn)(`event-schedule-timeline-dot event-schedule-timeline-dot--${e}`,K({state:p}))})})]})},W=(e,t)=>{if(e)return t==="in-progress"?e.active:t==="completed"&&e.completed||e.inactive},X=({timeStatus:e,item:t,theme:n="light",className:o,scheduleCount:i})=>{const p=l.useMemo(()=>W(t.icon,e),[t.icon,e]),a=`${e}-${n}`;return(0,s.jsxs)("div",{className:(0,u.cn)(`event-schedule-card event-schedule-card--${e}`,Q({state:a}),o),children:[p&&(0,s.jsx)("div",{className:`event-schedule-card__background-icon event-schedule-card__background-icon--${e} laptop:w-[128px] desktop:w-[160px] absolute bottom-0 right-0 z-10 w-[120px]`,children:(0,s.jsx)(m.Picture,{source:p.url,alt:p.alt,className:"aspect-square"})}),(0,s.jsxs)("div",{className:`event-schedule-card__content event-schedule-card__content--${e} 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,s.jsx)(m.Heading,{html:t.title,className:(0,u.cn)(`event-schedule-card__title event-schedule-card__title--${e}`,i>=4?"desktop:text-[24px]":"desktop:text-[32px]","laptop:text-[24px] line-clamp-1 text-[20px]",T({state:a}))}),(0,s.jsx)("div",{className:`event-schedule-card__details event-schedule-card__details--${e} flex flex-col gap-0.5`,children:t.items.map((d,c)=>(0,s.jsxs)("div",{className:`event-schedule-card__detail-item event-schedule-card__detail-item--${e} flex items-center gap-2`,children:[d.icon&&(0,s.jsx)(m.Text,{className:(0,u.cn)(`event-schedule-card__detail-icon event-schedule-card__detail-icon--${e} desktop:size-6 size-5 shrink-0`,T({state:a})),html:d.icon}),(0,s.jsx)(m.Text,{html:d.label,className:(0,u.cn)(`event-schedule-card__detail-text event-schedule-card__detail-text--${e} lg-desktop:text-[18px] desktop:text-[16px] line-clamp-1 flex-1 text-[14px] leading-[1.4]`,T({state:a}))})]},c))})]})]})},V=l.forwardRef(({classNames:e={},data:t,className:n,...o},i)=>{const p=t.theme||"light",a=l.useRef(null),d=l.useRef(null),c=l.useRef(!1),b=l.useMemo(()=>t?.scheduleList?.length||2,[t?.scheduleList]),x=l.useMemo(()=>t.scheduleList.findIndex(r=>E(r.startDate,r.endDate)==="in-progress"),[t.scheduleList]),w=l.useCallback((r,g=!1)=>{const h=P=>{switch(P){case"mobile":return{slidesPerView:1.17};case"tablet":return r===2?{slidesPerView:2}:{slidesPerView:2.4};case"laptop":return r===2?{}:r===4?{slidesPerView:3.2}:{slidesPerView:r};case"desktop":return r===2?{slidesPerView:2}:{slidesPerView:r}}},N=h("mobile"),_=h("tablet"),y=h("laptop"),D=h("desktop");return g?{0:{...N,spaceBetween:12},768:{..._,spaceBetween:12},1024:{...y,spaceBetween:16},1440:{...D,spaceBetween:16}}:{0:N,768:_,1024:y,1440:D}},[]),A=l.useMemo(()=>w(b,!0),[b,w]),I=l.useMemo(()=>w(b,!1),[b,w]),C=t.showTimeline!==!1,M=l.useCallback(r=>{c.current||!d.current||(c.current=!0,d.current.slideTo(r.activeIndex,r.params.speed),setTimeout(()=>{c.current=!1},50))},[]),B=l.useCallback(r=>{c.current||!a.current||(c.current=!0,a.current.slideTo(r.activeIndex,r.params.speed),setTimeout(()=>{c.current=!1},50))},[]);return l.useEffect(()=>{a.current&&d.current&&x>=0&&setTimeout(()=>{c.current=!0,a.current?.slideTo(x,500),d.current?.slideTo(x,500),setTimeout(()=>{c.current=!1},600)},100)},[x]),(0,s.jsxs)(m.Container,{...o,ref:i,className:(0,u.cn)("event-schedule-root overflow-hidden",e?.root,n),children:[C&&(0,s.jsx)(f.Swiper,{breakpoints:I,className:"event-schedule-timeline h-4 w-full !overflow-visible",onSwiper:r=>{d.current=r},onSlideChange:B,children:t.scheduleList.map((r,g)=>{const h=E(r.startDate,r.endDate);return(0,s.jsx)(f.SwiperSlide,{className:"",children:(0,s.jsx)(U,{className:e?.timeline,timeStatus:h,theme:p,index:g,nodeLength:t.scheduleList.length})},"timelineNode"+g)})}),(0,s.jsx)(f.Swiper,{breakpoints:A,className:"event-schedule-cards w-full !overflow-visible",onSwiper:r=>{a.current=r},onSlideChange:M,children:t.scheduleList.map((r,g)=>{const h=E(r.startDate,r.endDate);return(0,s.jsx)(f.SwiperSlide,{children:(0,s.jsx)(X,{timeStatus:h,className:(0,u.cn)(C?"laptop:mt-4 mt-2":"",e?.eventScheduleCard),item:r,theme:p,scheduleCount:t.scheduleList.length})},"SwiperSlideItem"+g)})})]})});V.displayName="EventSchedule";var Y=(0,$.withLayout)(V);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -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 { withLayout } from '../../shared/Styles.js'\nimport { Text, Picture, Heading, Container } 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 * \u65F6\u95F4\u72B6\u6001\u7C7B\u578B\n */\nexport type TimeStatus = 'completed' | 'in-progress' | 'not-started'\n\n/**\n * \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n */\nexport interface StateIcon {\n /** \u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807\uFF08\u8FDB\u884C\u4E2D\uFF09 */\n active: Media\n /** \u975E\u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807\uFF08\u672A\u5F00\u59CB\uFF09 */\n inactive: Media\n /** \u5DF2\u5B8C\u6210\u72B6\u6001\u7684\u56FE\u6807\uFF08\u53EF\u9009\uFF0C\u4E0D\u63D0\u4F9B\u5219\u4F7F\u7528 inactive\uFF09 */\n completed?: 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?: string\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 * \u83B7\u53D6\u65F6\u95F4\u72B6\u6001\n * @param startDate \u5F00\u59CB\u65E5\u671F\n * @param endDate \u7ED3\u675F\u65E5\u671F\n * @returns \u65F6\u95F4\u72B6\u6001\uFF1Acompleted\uFF08\u5DF2\u5B8C\u6210\uFF09\u3001in-progress\uFF08\u8FDB\u884C\u4E2D\uFF09\u3001not-started\uFF08\u672A\u5F00\u59CB\uFF09\n */\nconst getTimeStatus = (startDate: string, endDate: string): TimeStatus => {\n const now = dayjs()\n const start = dayjs(startDate).startOf('day')\n const end = dayjs(endDate).endOf('day')\n\n // \u5F53\u524D\u65F6\u95F4\u5728\u7ED3\u675F\u65F6\u95F4\u4E4B\u540E - \u5DF2\u5B8C\u6210\n if (now.isAfter(end)) {\n return 'completed'\n }\n\n // \u5F53\u524D\u65F6\u95F4\u5728\u5F00\u59CB\u65F6\u95F4\u4E4B\u524D - \u672A\u5F00\u59CB\n if (now.isBefore(start)) {\n return 'not-started'\n }\n\n // \u5F53\u524D\u65F6\u95F4\u5728\u5F00\u59CB\u548C\u7ED3\u675F\u4E4B\u95F4 - \u8FDB\u884C\u4E2D\n return 'in-progress'\n}\n\n/**\n * \u65F6\u95F4\u8F74\u8FDB\u5EA6\u6761\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\n */\nconst timelineProgressActiveVariants = cva('h-1 w-full overflow-hidden', {\n variants: {\n state: {\n // \u8FDB\u884C\u4E2D\n 'in-progress-light': 'bg-[#F6CD4E]',\n 'in-progress-dark': 'bg-[#D79941]',\n // \u672A\u5F00\u59CB\n 'not-started-light': 'bg-[#EAEAEC]',\n 'not-started-dark': 'bg-[#1E2024]',\n // \u5DF2\u5B8C\u6210\n 'completed-light': 'bg-[#F6CD4E]',\n 'completed-dark': 'bg-[#D79941]',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n})\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\n */\nconst timelineNodeActiveVariants = cva('size-4 rounded-full transition-colors', {\n variants: {\n state: {\n // \u8FDB\u884C\u4E2D\n 'in-progress-light': 'bg-[#F6CD4E]',\n 'in-progress-dark': 'bg-[#D79941]',\n // \u672A\u5F00\u59CB\n 'not-started-light': 'bg-[#EAEAEC]',\n 'not-started-dark': 'bg-[#1E2024]',\n // \u5DF2\u5B8C\u6210\uFF08\u4E0E\u8FDB\u884C\u4E2D\u989C\u8272\u4E00\u81F4\uFF09\n 'completed-light': 'bg-[#F6CD4E]',\n 'completed-dark': 'bg-[#D79941]',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n})\n\n/**\n * \u5361\u7247\u6587\u672C\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\n */\nconst cardTextVariants = cva('font-bold leading-[1.2]', {\n variants: {\n state: {\n // \u8FDB\u884C\u4E2D\uFF08\u4FDD\u6301\u539F\u6709\u989C\u8272\uFF09\n 'in-progress-light': 'text-[#080A0F]',\n 'in-progress-dark': 'text-white',\n // \u672A\u5F00\u59CB\uFF0860% \u900F\u660E\u5EA6\uFF09\n 'not-started-light': 'text-[#080A0F]',\n 'not-started-dark': 'text-[#F5F6F7]',\n // \u5DF2\u5B8C\u6210\uFF0860% \u900F\u660E\u5EA6\uFF09\n 'completed-light': 'text-[#4A4C56]/60',\n 'completed-dark': 'text-[#F5F6F7]/60',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n})\n\n/**\n * \u5361\u7247\u5BB9\u5668\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\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 // \u8FDB\u884C\u4E2D\n 'in-progress-light': 'bg-[#F4E8BC]',\n 'in-progress-dark': 'bg-[#D79941]',\n // \u672A\u5F00\u59CB\n 'not-started-light': 'bg-[#EAEAEC]',\n 'not-started-dark': 'bg-[#1E2024]',\n // \u5DF2\u5B8C\u6210\n 'completed-light': 'bg-[#F4E8BC]',\n 'completed-dark': 'bg-[#D79941]',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n }\n)\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u7EC4\u4EF6 Props\n */\ninterface TimelineNodeProps {\n /** \u65F6\u95F4\u72B6\u6001 */\n timeStatus: TimeStatus\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 = ({ timeStatus, theme = 'light', className, index, nodeLength }: TimelineNodeProps) => {\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const state = `${timeStatus}-${theme}` as\n | 'in-progress-light'\n | 'in-progress-dark'\n | 'not-started-light'\n | 'not-started-dark'\n | 'completed-light'\n | 'completed-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\u65F6\u95F4\u72B6\u6001\u83B7\u53D6\u5BF9\u5E94\u7684\u56FE\u6807\n * @param icon \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n * @param timeStatus \u65F6\u95F4\u72B6\u6001\n * @returns \u56FE\u6807 Media \u5BF9\u8C61\n */\nconst getIconByTimeStatus = (icon: StateIcon | undefined, timeStatus: TimeStatus): Media | undefined => {\n if (!icon) return undefined\n // \u8FDB\u884C\u4E2D\u4F7F\u7528 active \u56FE\u6807\n if (timeStatus === 'in-progress') return icon.active\n // \u5DF2\u5B8C\u6210\u4F7F\u7528 completed \u56FE\u6807\uFF08\u5982\u679C\u6709\uFF09\uFF0C\u5426\u5219\u4F7F\u7528 inactive\n if (timeStatus === 'completed') return icon.completed || icon.inactive\n // \u672A\u5F00\u59CB\u4F7F\u7528 inactive \u56FE\u6807\n return icon.inactive\n}\n\n/**\n * \u6D3B\u52A8\u65E5\u7A0B\u5361\u7247\u7EC4\u4EF6\n */\nconst EventScheduleCard = ({\n timeStatus,\n item,\n theme = 'light',\n className,\n scheduleCount,\n}: {\n timeStatus: TimeStatus\n item: EventScheduleItem\n theme?: 'light' | 'dark'\n className?: string\n scheduleCount: number\n}) => {\n const currentIcon = React.useMemo(() => {\n return getIconByTimeStatus(item.icon, timeStatus)\n }, [item.icon, timeStatus])\n\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const cardState = `${timeStatus}-${theme}` as\n | 'in-progress-light'\n | 'in-progress-dark'\n | 'not-started-light'\n | 'not-started-dark'\n | 'completed-light'\n | 'completed-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 <Text\n className={cn('desktop:size-6 size-5 shrink-0', cardTextVariants({ state: cardState }))}\n html={detail.icon}\n />\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>(\n ({ classNames = {}, data, className, ...rest }, 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\u8FDB\u884C\u4E2D item \u7684\u7D22\u5F15\uFF08\u7528\u4E8E\u81EA\u52A8\u6EDA\u52A8\uFF09\n const activeIndex = React.useMemo(() => {\n return data.scheduleList.findIndex(item => {\n const timeStatus = getTimeStatus(item.startDate, item.endDate)\n return timeStatus === 'in-progress'\n })\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: 12 },\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 <Container {...rest} ref={ref} className={cn('overflow-hidden', classNames?.root, className)}>\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 timeStatus = getTimeStatus(item.startDate, item.endDate)\n return (\n <SwiperSlide key={'timelineNode' + index} className=\"\">\n <TimelineNode\n className={classNames?.timeline}\n timeStatus={timeStatus}\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 timeStatus = getTimeStatus(item.startDate, item.endDate)\n return (\n <SwiperSlide key={'SwiperSlideItem' + index}>\n <EventScheduleCard\n timeStatus={timeStatus}\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 </Container>\n )\n }\n)\n\nEventSchedule.displayName = 'EventSchedule'\nexport default withLayout(EventSchedule)\n\n// \u5BFC\u51FA\u7C7B\u578B\u4F9B\u5916\u90E8\u4F7F\u7528\n// export type { StateIcon, EventScheduleItem, EventScheduleData, EventScheduleProps }\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmOI,IAAAI,EAAA,6BAjOJC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAkD,qCAClDC,EAAoC,wBAEpCC,EAAkB,oBAClBC,EAAoB,oCA0EpB,MAAMC,EAAgB,CAACC,EAAmBC,IAAgC,CACxE,MAAMC,KAAM,EAAAC,SAAM,EACZC,KAAQ,EAAAD,SAAMH,CAAS,EAAE,QAAQ,KAAK,EACtCK,KAAM,EAAAF,SAAMF,CAAO,EAAE,MAAM,KAAK,EAGtC,OAAIC,EAAI,QAAQG,CAAG,EACV,YAILH,EAAI,SAASE,CAAK,EACb,cAIF,aACT,EAKME,KAAiC,OAAI,6BAA8B,CACvE,SAAU,CACR,MAAO,CAEL,oBAAqB,eACrB,mBAAoB,eAEpB,oBAAqB,eACrB,mBAAoB,eAEpB,kBAAmB,eACnB,iBAAkB,cACpB,CACF,EACA,gBAAiB,CACf,MAAO,mBACT,CACF,CAAC,EAKKC,KAA6B,OAAI,wCAAyC,CAC9E,SAAU,CACR,MAAO,CAEL,oBAAqB,eACrB,mBAAoB,eAEpB,oBAAqB,eACrB,mBAAoB,eAEpB,kBAAmB,eACnB,iBAAkB,cACpB,CACF,EACA,gBAAiB,CACf,MAAO,mBACT,CACF,CAAC,EAKKC,KAAmB,OAAI,0BAA2B,CACtD,SAAU,CACR,MAAO,CAEL,oBAAqB,iBACrB,mBAAoB,aAEpB,oBAAqB,iBACrB,mBAAoB,iBAEpB,kBAAmB,oBACnB,iBAAkB,mBACpB,CACF,EACA,gBAAiB,CACf,MAAO,mBACT,CACF,CAAC,EAKKC,KAA4B,OAChC,8GACA,CACE,SAAU,CACR,MAAO,CAEL,oBAAqB,eACrB,mBAAoB,eAEpB,oBAAqB,eACrB,mBAAoB,eAEpB,kBAAmB,eACnB,iBAAkB,cACpB,CACF,EACA,gBAAiB,CACf,MAAO,mBACT,CACF,CACF,EAqBMC,EAAe,CAAC,CAAE,WAAAC,EAAY,MAAAC,EAAQ,QAAS,UAAAC,EAAW,MAAAC,EAAO,WAAAC,CAAW,IAAyB,CAEzG,MAAMC,EAAQ,GAAGL,CAAU,IAAIC,CAAK,GAS9BK,EAAUH,IAAU,EACpBI,EAASJ,IAAUC,EAAa,EAEtC,SACE,QAAC,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Text, Picture, Heading, Container } 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 * \u65F6\u95F4\u72B6\u6001\u7C7B\u578B\n */\nexport type TimeStatus = 'completed' | 'in-progress' | 'not-started'\n\n/**\n * \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n */\nexport interface StateIcon {\n /** \u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807\uFF08\u8FDB\u884C\u4E2D\uFF09 */\n active: Media\n /** \u975E\u6FC0\u6D3B\u72B6\u6001\u7684\u56FE\u6807\uFF08\u672A\u5F00\u59CB\uFF09 */\n inactive: Media\n /** \u5DF2\u5B8C\u6210\u72B6\u6001\u7684\u56FE\u6807\uFF08\u53EF\u9009\uFF0C\u4E0D\u63D0\u4F9B\u5219\u4F7F\u7528 inactive\uFF09 */\n completed?: 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?: string\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 * \u83B7\u53D6\u65F6\u95F4\u72B6\u6001\n * @param startDate \u5F00\u59CB\u65E5\u671F\n * @param endDate \u7ED3\u675F\u65E5\u671F\n * @returns \u65F6\u95F4\u72B6\u6001\uFF1Acompleted\uFF08\u5DF2\u5B8C\u6210\uFF09\u3001in-progress\uFF08\u8FDB\u884C\u4E2D\uFF09\u3001not-started\uFF08\u672A\u5F00\u59CB\uFF09\n */\nconst getTimeStatus = (startDate: string, endDate: string): TimeStatus => {\n const now = dayjs()\n const start = dayjs(startDate).startOf('day')\n const end = dayjs(endDate).endOf('day')\n\n // \u5F53\u524D\u65F6\u95F4\u5728\u7ED3\u675F\u65F6\u95F4\u4E4B\u540E - \u5DF2\u5B8C\u6210\n if (now.isAfter(end)) {\n return 'completed'\n }\n\n // \u5F53\u524D\u65F6\u95F4\u5728\u5F00\u59CB\u65F6\u95F4\u4E4B\u524D - \u672A\u5F00\u59CB\n if (now.isBefore(start)) {\n return 'not-started'\n }\n\n // \u5F53\u524D\u65F6\u95F4\u5728\u5F00\u59CB\u548C\u7ED3\u675F\u4E4B\u95F4 - \u8FDB\u884C\u4E2D\n return 'in-progress'\n}\n\n/**\n * \u65F6\u95F4\u8F74\u8FDB\u5EA6\u6761\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\n */\nconst timelineProgressActiveVariants = cva('h-1 w-full overflow-hidden', {\n variants: {\n state: {\n // \u8FDB\u884C\u4E2D\n 'in-progress-light': 'bg-[#F6CD4E]',\n 'in-progress-dark': 'bg-[#D79941]',\n // \u672A\u5F00\u59CB\n 'not-started-light': 'bg-[#EAEAEC]',\n 'not-started-dark': 'bg-[#1E2024]',\n // \u5DF2\u5B8C\u6210\n 'completed-light': 'bg-[#F6CD4E]',\n 'completed-dark': 'bg-[#D79941]',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n})\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\n */\nconst timelineNodeActiveVariants = cva('size-4 rounded-full transition-colors', {\n variants: {\n state: {\n // \u8FDB\u884C\u4E2D\n 'in-progress-light': 'bg-[#F6CD4E]',\n 'in-progress-dark': 'bg-[#D79941]',\n // \u672A\u5F00\u59CB\n 'not-started-light': 'bg-[#EAEAEC]',\n 'not-started-dark': 'bg-[#1E2024]',\n // \u5DF2\u5B8C\u6210\uFF08\u4E0E\u8FDB\u884C\u4E2D\u989C\u8272\u4E00\u81F4\uFF09\n 'completed-light': 'bg-[#F6CD4E]',\n 'completed-dark': 'bg-[#D79941]',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n})\n\n/**\n * \u5361\u7247\u6587\u672C\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\n */\nconst cardTextVariants = cva('font-bold leading-[1.2]', {\n variants: {\n state: {\n // \u8FDB\u884C\u4E2D\uFF08\u4FDD\u6301\u539F\u6709\u989C\u8272\uFF09\n 'in-progress-light': 'text-[#080A0F]',\n 'in-progress-dark': 'text-white',\n // \u672A\u5F00\u59CB\uFF0860% \u900F\u660E\u5EA6\uFF09\n 'not-started-light': 'text-[#080A0F]',\n 'not-started-dark': 'text-[#F5F6F7]',\n // \u5DF2\u5B8C\u6210\uFF0860% \u900F\u660E\u5EA6\uFF09\n 'completed-light': 'text-[#4A4C56]/60',\n 'completed-dark': 'text-[#F5F6F7]/60',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n})\n\n/**\n * \u5361\u7247\u5BB9\u5668\u6837\u5F0F\u53D8\u4F53\uFF08\u652F\u6301\u4E09\u79CD\u65F6\u95F4\u72B6\u6001\uFF09\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 // \u8FDB\u884C\u4E2D\n 'in-progress-light': 'bg-[#F4E8BC]',\n 'in-progress-dark': 'bg-[#D79941]',\n // \u672A\u5F00\u59CB\n 'not-started-light': 'bg-[#EAEAEC]',\n 'not-started-dark': 'bg-[#1E2024]',\n // \u5DF2\u5B8C\u6210\n 'completed-light': 'bg-[#F4E8BC]',\n 'completed-dark': 'bg-[#D79941]',\n },\n },\n defaultVariants: {\n state: 'not-started-light',\n },\n }\n)\n\n/**\n * \u65F6\u95F4\u8F74\u8282\u70B9\u7EC4\u4EF6 Props\n */\ninterface TimelineNodeProps {\n /** \u65F6\u95F4\u72B6\u6001 */\n timeStatus: TimeStatus\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 = ({ timeStatus, theme = 'light', className, index, nodeLength }: TimelineNodeProps) => {\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const state = `${timeStatus}-${theme}` as\n | 'in-progress-light'\n | 'in-progress-dark'\n | 'not-started-light'\n | 'not-started-dark'\n | 'completed-light'\n | 'completed-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\n className={cn(\n `event-schedule-timeline-node event-schedule-timeline-node--${timeStatus} relative my-2 flex h-1 w-full items-center justify-center`,\n className\n )}\n >\n {/* \u8FDB\u5EA6\u6761\u80CC\u666F */}\n <div\n className={cn(\n `event-schedule-timeline-progress event-schedule-timeline-progress--${timeStatus}`,\n timelineProgressActiveVariants({ state }),\n isFirst && 'rounded-l-full',\n isLast && 'rounded-r-full'\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\n className={cn(\n `event-schedule-timeline-dot event-schedule-timeline-dot--${timeStatus}`,\n timelineNodeActiveVariants({ state })\n )}\n />\n </div>\n </div>\n )\n}\n\n/**\n * \u6839\u636E\u65F6\u95F4\u72B6\u6001\u83B7\u53D6\u5BF9\u5E94\u7684\u56FE\u6807\n * @param icon \u72B6\u6001\u5316\u56FE\u6807\u914D\u7F6E\n * @param timeStatus \u65F6\u95F4\u72B6\u6001\n * @returns \u56FE\u6807 Media \u5BF9\u8C61\n */\nconst getIconByTimeStatus = (icon: StateIcon | undefined, timeStatus: TimeStatus): Media | undefined => {\n if (!icon) return undefined\n // \u8FDB\u884C\u4E2D\u4F7F\u7528 active \u56FE\u6807\n if (timeStatus === 'in-progress') return icon.active\n // \u5DF2\u5B8C\u6210\u4F7F\u7528 completed \u56FE\u6807\uFF08\u5982\u679C\u6709\uFF09\uFF0C\u5426\u5219\u4F7F\u7528 inactive\n if (timeStatus === 'completed') return icon.completed || icon.inactive\n // \u672A\u5F00\u59CB\u4F7F\u7528 inactive \u56FE\u6807\n return icon.inactive\n}\n\n/**\n * \u6D3B\u52A8\u65E5\u7A0B\u5361\u7247\u7EC4\u4EF6\n */\nconst EventScheduleCard = ({\n timeStatus,\n item,\n theme = 'light',\n className,\n scheduleCount,\n}: {\n timeStatus: TimeStatus\n item: EventScheduleItem\n theme?: 'light' | 'dark'\n className?: string\n scheduleCount: number\n}) => {\n const currentIcon = React.useMemo(() => {\n return getIconByTimeStatus(item.icon, timeStatus)\n }, [item.icon, timeStatus])\n\n // \u8BA1\u7B97\u7EC4\u5408\u72B6\u6001\n const cardState = `${timeStatus}-${theme}` as\n | 'in-progress-light'\n | 'in-progress-dark'\n | 'not-started-light'\n | 'not-started-dark'\n | 'completed-light'\n | 'completed-dark'\n\n return (\n <div\n className={cn(\n `event-schedule-card event-schedule-card--${timeStatus}`,\n eventScheduleCardVariants({ state: cardState }),\n className\n )}\n >\n {/* \u80CC\u666F\u56FE\u6807 */}\n {currentIcon && (\n <div\n className={`event-schedule-card__background-icon event-schedule-card__background-icon--${timeStatus} laptop:w-[128px] desktop:w-[160px] absolute bottom-0 right-0 z-10 w-[120px]`}\n >\n <Picture source={currentIcon.url} alt={currentIcon.alt} className=\"aspect-square\" />\n </div>\n )}\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div\n className={`event-schedule-card__content event-schedule-card__content--${timeStatus} 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 >\n <Heading\n html={item.title}\n className={cn(\n `event-schedule-card__title event-schedule-card__title--${timeStatus}`,\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\n className={`event-schedule-card__details event-schedule-card__details--${timeStatus} flex flex-col gap-0.5`}\n >\n {item.items.map((detail, index) => (\n <div\n key={index}\n className={`event-schedule-card__detail-item event-schedule-card__detail-item--${timeStatus} flex items-center gap-2`}\n >\n {/* \u56FE\u6807 */}\n {detail.icon && (\n <Text\n className={cn(\n `event-schedule-card__detail-icon event-schedule-card__detail-icon--${timeStatus} desktop:size-6 size-5 shrink-0`,\n cardTextVariants({ state: cardState })\n )}\n html={detail.icon}\n />\n )}\n {/* \u6587\u672C */}\n <Text\n html={detail.label}\n className={cn(\n `event-schedule-card__detail-text event-schedule-card__detail-text--${timeStatus} 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>(\n ({ classNames = {}, data, className, ...rest }, 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\u8FDB\u884C\u4E2D item \u7684\u7D22\u5F15\uFF08\u7528\u4E8E\u81EA\u52A8\u6EDA\u52A8\uFF09\n const activeIndex = React.useMemo(() => {\n return data.scheduleList.findIndex(item => {\n const timeStatus = getTimeStatus(item.startDate, item.endDate)\n return timeStatus === 'in-progress'\n })\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: 12 },\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 <Container {...rest} ref={ref} className={cn('event-schedule-root overflow-hidden', classNames?.root, className)}>\n {showTimeline && (\n <Swiper\n breakpoints={timeNodeSwiperBreakpoints}\n className=\"event-schedule-timeline 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 timeStatus = getTimeStatus(item.startDate, item.endDate)\n return (\n <SwiperSlide key={'timelineNode' + index} className=\"\">\n <TimelineNode\n className={classNames?.timeline}\n timeStatus={timeStatus}\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=\"event-schedule-cards w-full !overflow-visible\"\n onSwiper={swiper => {\n swiperRef.current = swiper\n }}\n onSlideChange={handleCardSwiperSlideChange}\n >\n {data.scheduleList.map((item, index) => {\n const timeStatus = getTimeStatus(item.startDate, item.endDate)\n return (\n <SwiperSlide key={'SwiperSlideItem' + index}>\n <EventScheduleCard\n timeStatus={timeStatus}\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 </Container>\n )\n }\n)\n\nEventSchedule.displayName = 'EventSchedule'\nexport default withLayout(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
6
|
"names": ["EventSchedule_exports", "__export", "EventSchedule_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_Styles", "import_components", "import_react", "import_dayjs", "import_class_variance_authority", "getTimeStatus", "startDate", "endDate", "now", "dayjs", "start", "end", "timelineProgressActiveVariants", "timelineNodeActiveVariants", "cardTextVariants", "eventScheduleCardVariants", "TimelineNode", "timeStatus", "theme", "className", "index", "nodeLength", "state", "isFirst", "isLast", "getIconByTimeStatus", "icon", "EventScheduleCard", "item", "scheduleCount", "currentIcon", "cardState", "detail", "EventSchedule", "classNames", "data", "rest", "ref", "swiperRef", "timelineSwiperRef", "isSyncingRef", "itemsPerRow", "activeIndex", "generateSwiperBreakpoints", "withSpaceBetween", "getBreakpointConfig", "breakpoint", "mobileConfig", "tabletConfig", "laptopConfig", "desktopConfig", "swiperBreakpoints", "timeNodeSwiperBreakpoints", "showTimeline", "handleCardSwiperSlideChange", "swiper", "handleTimelineSwiperSlideChange"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var _=Object.create;var p=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var U=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var K=(t,s)=>{for(var i in s)p(t,i,{get:s[i],enumerable:!0})},V=(t,s,i,d)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of W(s))!j.call(t,n)&&n!==i&&p(t,n,{get:()=>s[n],enumerable:!(d=E(s,n))||d.enumerable});return t};var k=(t,s,i)=>(i=t!=null?_(U(t)):{},V(s||!t||!t.__esModule?p(i,"default",{value:t,enumerable:!0}):i,t)),q=t=>V(p({},"__esModule",{value:!0}),t);var o1={};K(o1,{BenefitsModal:()=>D,default:()=>i1});module.exports=q(o1);var e=require("react/jsx-runtime"),a=require("../../../../../../components/index.js"),B=require("../../../../BizProductProvider.js"),F=require("../../../../hooks/useBenefits.js"),v=require("../../../../utils/index.js"),b=require("../../../../utils/textFormat.js"),C=require("react"),A=require("../../../../../AiuiProvider/index.js"),h=require("../../../../../../helpers/index.js"),m=require("framer-motion"),w=k(require("../../../../../HeaderNavigation/icons/Close.js")),I=k(require("./../ProductBenefitsTabs/ModalContainer.js"));const D=({title:t,showModal:s,closeModal:i,children:d,className:n})=>(0,e.jsx)(m.motion.div,{animate:s?{opacity:1}:{opacity:0,pointerEvents:"none"},transition:{duration:.15,bounce:0},className:"fixed inset-0 z-[1000] bg-black/50 opacity-0 tablet:flex tablet:items-center tablet:justify-center",children:(0,e.jsxs)(m.motion.div,{animate:s?{y:0}:{y:"100%"},transition:{duration:.2,ease:"easeOut"},className:(0,h.cn)("absolute bottom-0 left-0 right-0 max-w-[80vh] rounded-t-box tablet:rounded-box overflow-hidden bg-white","tablet:static tablet:h-auto tablet:max-h-[80vh] tablet:w-[896px] tablet:max-w-[90vw]",n),children:[(0,e.jsx)(m.motion.div,{animate:s?{scale:1}:{scale:.95},transition:{duration:.15,bounce:0},className:"hidden size-full tablet:block",children:(0,e.jsxs)("div",{className:"relative size-full overflow-auto",children:[(0,e.jsxs)("div",{className:"sticky top-0 z-[2] bg-white",children:[t&&(0,e.jsx)(a.Heading,{size:2,className:"w-full py-6 px-4 text-xl tablet:px-8 tablet:pt-4 tablet:pb-2 font-bold",children:t}),(0,e.jsx)("button",{onClick:i,className:"absolute right-4 top-4 z-[2]","aria-label":"Close modal",children:(0,e.jsx)(w.default,{className:"size-6"})})]}),d]})}),(0,e.jsxs)("div",{className:"relative size-full overflow-auto tablet:hidden",children:[(0,e.jsxs)("div",{className:"sticky top-0 z-[2] bg-white",children:[t&&(0,e.jsx)("p",{className:"w-full py-4 pl-5 text-xl font-bold",children:t}),(0,e.jsx)("button",{onClick:i,className:"absolute right-4 top-4 z-[2]","aria-label":"Close modal",children:(0,e.jsx)(w.default,{className:"size-6"})})]}),d]})]})}),J=({})=>{const{profile:t,variant:s,renderInstallments:i,savingDetail:d,openSignInPopup:n,openAuthCodePopup:T,product:x}=(0,B.useBizProductContext)(),{activated:R=!1}=t||{},[M,P]=(0,C.useState)(i);(0,C.useEffect)(()=>{i&&P(i),typeof window<"u"&&window.affirm?.ui?.refresh&&window.affirm.ui.refresh()},[i,s.id]);const o=(0,C.useMemo)(()=>x?.payload?.components?.find(l=>l.componentKey==="ProductBenefits")?.data||{},[x?.payload]),[S,N]=(0,C.useState)(!1),[G,L]=(0,C.useState)(!1),O=(0,F.useBenefits)({variant:s}),{locale:H="us",copyWriting:a1}=(0,A.useAiuiContext)(),{creditsRedemption:c,freeGift:y,bundle:f,fullGift:u,levelDiscount:g}=O,Z=[c.enable?{title:o?.creditsRedemption?.creditsTitle,description:o?.creditsRedemption?.creditsDesc,icon:(0,e.jsx)(z,{className:"desktop:size-6 size-5"})}:null,c.enable?{title:(0,e.jsx)(e.Fragment,{children:!R&&t?.email?(0,e.jsxs)(e.Fragment,{children:[o?.creditsRedemption?.creditsAfterActivation,(0,e.jsx)("span",{role:"button",tabIndex:0,onClick:()=>T?.(),className:"underline",children:o?.creditsRedemption?.active})]}):c?.config?.label?.replace("{{amount}}",(0,v.formatPrice)({amount:c?.config?.amount??0,currencyCode:s.price.currencyCode,locale:H}))}),icon:(0,e.jsx)(z,{className:"desktop:size-6 size-5"})}:null,g.enable?{title:g?.config?.title??"",description:g?.config?.tag??"",icon:(0,e.jsx)(X,{className:"desktop:size-6 size-5"})}:null,u.enable?{title:u?.config?.title??"",description:u?.config?.desc??"",icon:(0,e.jsx)(e1,{className:"desktop:size-6 size-5"})}:null,y.enable?{title:y?.config?.title??"",icon:(0,e.jsx)(Y,{className:"desktop:size-6 size-5"})}:null,f.enable?{title:(0,b.replaceTemplate)(o?.bundle?.bundleSaveUpTo,{count:(0,v.formatPrice)({amount:Math.max(...f?.config?.bundleList?.map(l=>l.savings??0)??[]),currencyCode:s.price.currencyCode,locale:H})}),description:(0,b.replaceTemplate)(o?.bundle?.bundleOffer,{count:f?.config?.bundleList?.length?.toString()||""}),icon:(0,e.jsx)($,{className:"desktop:size-6 size-5"})}:null,{title:o?.paymentMethod?.title,image:o?.paymentMethod?.image,icon:(0,e.jsx)(l1,{className:"desktop:size-6 size-5"}),event:()=>N(!0)},{useAble:!0,isAutoUse:!!t?.email&&!!d?.member,title:t?.email?o?.member?.loginTitle:(0,e.jsxs)("div",{children:[(0,e.jsx)("span",{className:"mr-2 desktop:mr-3",dangerouslySetInnerHTML:{__html:o?.member?.unloginTitle}}),(0,e.jsx)("span",{role:"button",tabIndex:0,onClick:l=>{l?.stopPropagation(),n?.()},className:"underline text-nowrap",dangerouslySetInnerHTML:{__html:o?.member?.loginNow}})]}),icon:(0,e.jsx)(Q,{className:"desktop:size-6 size-5"}),event:()=>L(!0)},M?{customRenderTitle:M,icon:(0,e.jsx)(t1,{className:"desktop:size-6 size-5"})}:null].filter(Boolean);return(0,e.jsxs)("div",{children:[o?.benefitTitle&&(0,e.jsx)(a.Text,{as:"div",html:o?.benefitTitle,className:"text-sm mb-3 lg-desktop:mb-4 lg-desktop:text-base font-bold leading-[1.2]"}),(0,e.jsx)("ul",{className:"desktop:px-4 px-3 rounded-box bg-[#F5F6F7]",children:(0,e.jsx)(e.Fragment,{children:Z?.map((l,r)=>(0,e.jsxs)("li",{children:[(0,e.jsxs)("div",{className:"flex gap-3 items-start py-3 laptop:py-4",children:[(0,e.jsx)("div",{className:"shrink-0",children:l?.icon}),(0,e.jsxs)("div",{onClick:l?.event,className:(0,h.cn)("flex flex-1 items-center gap-1 desktop:gap-2",l?.event&&"cursor-pointer justify-between"),children:[(0,e.jsxs)("div",{children:[l?.customRenderTitle?(0,e.jsx)("div",{children:l?.customRenderTitle}):(0,e.jsxs)("div",{className:"flex items-center gap-2 desktop:gap-3 text-[14px] laptop:text-base font-bold leading-[1.2]",children:[l?.title,l?.image&&(0,e.jsx)(a.Picture,{source:l?.image,className:"w-[40px] h-[20px] shrink-0"})]}),l?.description&&(0,e.jsx)(a.Text,{...typeof l.description=="string"?{html:l.description}:{},as:"p",className:"laptop:text-[14px] text-[12px] font-bold text-[#2A2C32]",children:l.description})]}),l?.event&&(0,e.jsx)(s1,{className:"size-4 desktop:size-6"})]})]}),r!=Z?.length-1&&(0,e.jsx)("div",{className:"bg-[#DADCE0] h-[1px]"})]},r))})}),(0,e.jsx)(I.default,{showModal:S,closeModal:()=>N(!1),children:(0,e.jsx)(a.Picture,{source:o?.paymentMethod?.payImage})}),(0,e.jsx)(D,{title:o?.member?.modelTitle,showModal:G,closeModal:()=>L(!1),children:(0,e.jsx)("ul",{className:"flex flex-col overflow-y-auto tablet:max-h-[calc(80vh-52px)] tablet:py-8 gap-5 pb-6 tablet:pb-8 tablet:gap-8 px-4 tablet:px-8",children:o?.member?.modelBenefits?.map((l,r)=>(0,e.jsxs)("li",{className:"flex flex-col gap-1",children:[(0,e.jsx)(a.Text,{html:l?.title,className:"text-[16px] tablet:text-[18px] font-bold leading-[1.4]"}),(0,e.jsx)(a.Text,{html:l?.desc,className:"text-[14px] text-[#1D1D1F] tablet:text-[16px] font-bold leading-[1.4] opacity-75"})]},r))})})]})},z=({className:t})=>(0,e.jsx)("svg",{className:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1ZM12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM17 13C17.5523 13 18 13.4477 18 14C18 14.5523 17.5523 15 17 15H9.41406L9.70703 15.293C10.0976 15.6835 10.0976 16.3165 9.70703 16.707C9.31651 17.0976 8.68349 17.0976 8.29297 16.707L6.29297 14.707C6.00697 14.421 5.92139 13.9909 6.07617 13.6172C6.23098 13.2436 6.59558 13 7 13H17ZM14.293 7.29297C14.6835 6.90244 15.3165 6.90244 15.707 7.29297L17.707 9.29297C17.993 9.57897 18.0786 10.0091 17.9238 10.3828C17.769 10.7564 17.4044 11 17 11H7C6.44772 11 6 10.5523 6 10C6 9.44771 6.44772 9 7 9H14.5859L14.293 8.70703C13.9024 8.31651 13.9024 7.68349 14.293 7.29297Z",fill:"#1D1D1F"})}),Q=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M14.4294 1.58368C15.0354 1.5838 15.6026 1.88286 15.944 2.38348L19.4997 7.5993C19.9918 8.32123 19.9058 9.29041 19.2946 9.91473L11.8571 17.5104C10.8453 18.5435 9.18314 18.5447 8.16961 17.5134L0.696949 9.90692C0.0916662 9.29063 -0.000821769 8.3354 0.474293 7.61395L3.90203 2.4079C4.24121 1.89312 4.81678 1.58368 5.43328 1.58368H14.4294ZM2.00457 8.62177L9.47722 16.2292C9.77143 16.5282 10.2539 16.5278 10.5475 16.2282L17.9841 8.63153L14.4294 3.41669H5.43328L2.00457 8.62177ZM13.5759 7.74481C13.9008 7.41946 14.4279 7.41834 14.7536 7.74286C15.0792 8.06792 15.0804 8.59584 14.7555 8.92157L10.6247 13.0593C10.2833 13.401 9.72933 13.4013 9.38738 13.0602L5.24382 8.92352C4.91829 8.59852 4.9172 8.07056 5.24187 7.74481C5.56689 7.41925 6.09484 7.41813 6.42058 7.74286L10.0046 11.321L13.5759 7.74481Z",fill:"#080A0F"})}),X=({className:t})=>(0,e.jsxs)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[(0,e.jsx)("path",{d:"M13.1615 5.66083C13.4869 5.33539 14.0144 5.33539 14.3398 5.66083C14.6653 5.98626 14.6653 6.51378 14.3398 6.83921L6.83984 14.3392C6.51441 14.6646 5.98689 14.6646 5.66146 14.3392C5.33602 14.0138 5.33602 13.4863 5.66146 13.1608L13.1615 5.66083Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.709 11.0417C13.6295 11.0417 14.3756 11.7879 14.3756 12.7084C14.3756 13.6288 13.6295 14.375 12.709 14.375C11.7885 14.375 11.0423 13.6288 11.0423 12.7084C11.0423 11.7879 11.7885 11.0417 12.709 11.0417ZM12.709 12.2917C12.4789 12.2917 12.2923 12.4782 12.2923 12.7084C12.2923 12.9385 12.4789 13.125 12.709 13.125C12.9391 13.125 13.1256 12.9385 13.1256 12.7084C13.1256 12.4782 12.9391 12.2917 12.709 12.2917Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M7.29232 5.62502C8.21279 5.62502 8.95898 6.37121 8.95898 7.29169C8.95898 8.21216 8.21279 8.95835 7.29232 8.95835C6.37184 8.95835 5.62565 8.21216 5.62565 7.29169C5.62565 6.37121 6.37184 5.62502 7.29232 5.62502ZM7.29232 6.87502C7.0622 6.87502 6.87565 7.06157 6.87565 7.29169C6.87565 7.52181 7.0622 7.70835 7.29232 7.70835C7.52244 7.70835 7.70898 7.52181 7.70898 7.29169C7.70898 7.06157 7.52244 6.87502 7.29232 6.87502Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M16.6673 2.91669C18.048 2.91669 19.1673 4.03597 19.1673 5.41669V8.0469C19.1673 8.39923 18.9458 8.71388 18.6139 8.83221C18.0561 9.03101 17.652 9.57037 17.652 10.2084C17.652 10.8463 18.0561 11.3857 18.6139 11.5845C18.9458 11.7028 19.1673 12.0175 19.1673 12.3698V15C19.1673 16.3807 18.048 17.5 16.6673 17.5H3.33398C1.95327 17.5 0.833984 16.3807 0.833984 15V12.3698L0.84375 12.2396C0.890672 11.9418 1.09696 11.688 1.38737 11.5845C1.94519 11.3857 2.34928 10.8463 2.34928 10.2084C2.34928 9.57036 1.94519 9.03101 1.38737 8.83221C1.05551 8.71388 0.833984 8.39923 0.833984 8.0469V5.41669C0.833985 4.03598 1.95327 2.91669 3.33398 2.91669H16.6673ZM3.33398 4.58335C2.87375 4.58335 2.50065 4.95645 2.50065 5.41669V7.52606C3.40888 8.07233 4.01595 9.06946 4.01595 10.2084C4.01595 11.3471 3.40868 12.3435 2.50065 12.8898V15C2.50065 15.4603 2.87375 15.8334 3.33398 15.8334H16.6673C17.1276 15.8334 17.5006 15.4603 17.5006 15V12.8898C16.5926 12.3435 15.9853 11.3471 15.9853 10.2084C15.9853 9.06945 16.5924 8.07233 17.5006 7.52606V5.41669C17.5006 4.95645 17.1276 4.58335 16.6673 4.58335H3.33398Z",fill:"#080A0F"})]}),Y=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.4951 1.47201C12.791 1.17663 13.2707 1.17634 13.5664 1.47201C13.862 1.76788 13.8622 2.24851 13.5664 2.54428L11.8301 4.2806H17.5752C17.9935 4.28073 18.333 4.62012 18.333 5.03842V8.06869C18.333 8.48701 17.9935 8.82638 17.5752 8.8265H17.1982V17.1595C17.198 17.5776 16.8585 17.9171 16.4404 17.9173H3.56152C3.14327 17.9173 2.80394 17.5777 2.80371 17.1595V8.8265H2.42383C2.00543 8.8265 1.66602 8.48709 1.66602 8.06869V5.03842C1.66605 4.62005 2.00545 4.2806 2.42383 4.2806H8.16992L6.43359 2.54428C6.13775 2.24843 6.13776 1.76786 6.43359 1.47201C6.72945 1.17616 7.21001 1.17616 7.50586 1.47201L10 3.96615L12.4951 1.47201ZM4.31934 16.4017H9.24219V8.8265H4.31934V16.4017ZM10.7578 16.4017H15.6826V8.8265H10.7578V16.4017ZM3.18164 7.31088H16.8174V5.79623H3.18164V7.31088Z",fill:"#080A0F"})}),$=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M14.1152 1.18357L14.2551 1.26642L18.4546 3.9088C18.8514 4.15858 19.178 4.50301 19.4043 4.91029C19.6306 5.31758 19.7492 5.77458 19.7493 6.23909V16.0194C19.7495 16.3825 19.6772 16.742 19.5366 17.0775C19.396 17.413 19.1898 17.7179 18.9298 17.9747C18.6697 18.2315 18.361 18.4352 18.0212 18.5742C17.6814 18.7132 17.3172 18.7847 16.9494 18.7847H8.55091C8.1623 18.7852 7.77786 18.7056 7.42219 18.5511C7.06652 18.3965 6.74745 18.1704 6.48539 17.8871L1.61712 16.3743C1.35494 16.2904 1.11208 16.1563 0.902404 15.9797C0.692732 15.8031 0.520358 15.5875 0.395126 15.3451C0.269895 15.1027 0.194259 14.8384 0.172541 14.5672C0.150822 14.296 0.183446 14.0232 0.268548 13.7644L3.25386 4.69868C3.36315 4.36757 3.55522 4.06899 3.81232 3.83053C4.06942 3.59207 4.38326 3.42141 4.72484 3.33434L9.66236 2.26275L11.246 1.26642C11.6722 0.998206 12.1641 0.848941 12.6694 0.834475C13.1747 0.820008 13.6746 0.94088 14.1159 1.18426L14.1152 1.18357ZM11.9979 2.44503L7.79829 5.08741C7.59979 5.21229 7.43639 5.38454 7.32319 5.58825C7.20998 5.79196 7.15061 6.02055 7.15058 6.2529V16.0201C7.15058 16.7838 7.7773 17.4024 8.55021 17.4024H16.9494C17.1333 17.4025 17.3155 17.3668 17.4855 17.2974C17.6555 17.228 17.8099 17.1261 17.94 16.9978C18.0701 16.8694 18.1733 16.717 18.2438 16.5492C18.3142 16.3815 18.3504 16.2017 18.3504 16.0201V6.2529C18.3504 5.78063 18.1056 5.3415 17.7027 5.08741L13.5031 2.44503C13.2784 2.30354 13.0174 2.22837 12.7508 2.22837C12.4843 2.22837 12.2233 2.30354 11.9986 2.44503H11.9979ZM6.49449 4.36243L5.07457 4.67106C4.96068 4.70009 4.85604 4.757 4.77033 4.83654C4.68463 4.91607 4.62062 5.01565 4.58425 5.12608L1.59823 14.1911C1.56987 14.2774 1.559 14.3683 1.56626 14.4587C1.57351 14.5491 1.59875 14.6373 1.64051 14.7181C1.68228 14.7988 1.73976 14.8707 1.80968 14.9296C1.87959 14.9884 1.96057 15.0331 2.04799 15.0611L5.76005 16.2459C5.75394 16.1708 5.75091 16.0955 5.75095 16.0201V6.23978C5.75095 5.53552 6.02235 4.86715 6.49518 4.36243H6.49449ZM15.4938 11.8801C15.909 11.8803 16.3148 12.0019 16.6599 12.2297C17.005 12.4575 17.2739 12.7812 17.4327 13.1599C17.5914 13.5386 17.6329 13.9552 17.5517 14.3571C17.4706 14.759 17.2706 15.1282 16.9769 15.4178C16.6832 15.7075 16.3091 15.9048 15.9019 15.9846C15.4947 16.0644 15.0727 16.0232 14.6892 15.8663C14.3057 15.7093 13.9779 15.4436 13.7474 15.1028C13.5168 14.762 13.3939 14.3613 13.394 13.9515C13.394 12.8074 14.3341 11.8801 15.4938 11.8801ZM10.0995 13.5124L15.0489 8.63015C15.1753 8.50803 15.3437 8.4376 15.5204 8.43301C15.6972 8.42841 15.8691 8.48998 16.0018 8.60536C16.1344 8.72074 16.2179 8.88139 16.2355 9.05504C16.2532 9.22869 16.2036 9.40249 16.0967 9.54155L16.0387 9.60645L11.0893 14.4887C10.963 14.6108 10.7945 14.6812 10.6178 14.6858C10.4411 14.6904 10.2691 14.6288 10.1365 14.5135C10.0038 14.3981 9.92029 14.2374 9.90267 14.0638C9.88506 13.8901 9.93464 13.7163 10.0415 13.5773L10.0995 13.5124ZM15.4938 13.261C15.3083 13.261 15.1304 13.3338 14.9992 13.4633C14.868 13.5928 14.7943 13.7684 14.7943 13.9515C14.7943 14.1346 14.868 14.3102 14.9992 14.4397C15.1304 14.5692 15.3083 14.642 15.4938 14.642C15.6793 14.642 15.8572 14.5692 15.9884 14.4397C16.1196 14.3102 16.1933 14.1346 16.1933 13.9515C16.1933 13.7684 16.1196 13.5928 15.9884 13.4633C15.8572 13.3338 15.6793 13.261 15.4938 13.261ZM10.5947 7.04693C11.0099 7.04706 11.4157 7.16872 11.7608 7.39652C12.1059 7.62431 12.3749 7.94801 12.5336 8.32668C12.6924 8.70536 12.7338 9.12199 12.6527 9.5239C12.5715 9.92582 12.3715 10.295 12.0778 10.5846C11.7842 10.8743 11.4101 11.0716 11.0029 11.1514C10.5957 11.2312 10.1736 11.19 9.79012 11.0331C9.40661 10.8761 9.07886 10.6104 8.84833 10.2696C8.61779 9.92877 8.49482 9.52811 8.49496 9.1183C8.49496 7.97421 9.43504 7.04693 10.5947 7.04693ZM10.5947 8.42784C10.5029 8.4278 10.4119 8.44561 10.327 8.48027C10.2422 8.51492 10.165 8.56574 10.1 8.62983C9.96881 8.75925 9.89503 8.93483 9.89493 9.11795C9.89484 9.30107 9.96845 9.47673 10.0996 9.60628C10.2307 9.73583 10.4085 9.80866 10.594 9.80876C10.7796 9.80876 10.9575 9.73601 11.0886 9.60653C11.2198 9.47704 11.2935 9.30142 11.2935 9.1183C11.2935 8.93518 11.2198 8.75956 11.0886 8.63007C10.9575 8.50059 10.7796 8.42784 10.594 8.42784H10.5947Z",fill:"#080A0F",stroke:"#080A0F","stroke-width":"0.166667"})}),e1=({className:t})=>(0,e.jsxs)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M5.45492 6.28808C6.43123 5.31177 8.01457 5.31177 8.99089 6.28808C9.96696 7.26431 9.96685 8.84695 8.99089 9.82324C8.01457 10.7996 6.43123 10.7996 5.45492 9.82324C4.47891 8.84694 4.4788 7.26431 5.45492 6.28808ZM8.04769 7.23047C7.59205 6.77513 6.85282 6.77495 6.3973 7.23047C5.94188 7.686 5.94199 8.42526 6.3973 8.88086C6.85287 9.33643 7.59207 9.33636 8.04769 8.88086C8.5033 8.42525 8.5033 7.68608 8.04769 7.23047Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M9.07715 1.95703C9.58012 1.90116 10.0815 2.07705 10.4395 2.43473L18.1234 10.1187C18.7739 10.7695 18.7741 11.8246 18.1234 12.4754L11.6414 18.9574C10.9907 19.6081 9.93555 19.6079 9.28467 18.9574L1.60075 11.2734C1.28783 10.9603 1.11442 10.5376 1.11328 10.0999L1.12305 9.91113L1.77165 4.0778C1.85775 3.30308 2.46909 2.69171 3.24381 2.60563L9.07715 1.95703ZM3.42773 4.26172L2.77913 10.095L10.4631 17.779L16.945 11.297L9.26107 3.61312L3.42773 4.26172Z",fill:"#080A0F"})]}),t1=({className:t})=>(0,e.jsxs)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[(0,e.jsx)("path",{d:"M14.1673 11.8326C14.5355 11.8326 14.8338 12.131 14.8338 12.4991V13.4985H15.834C16.2022 13.4985 16.5005 13.7968 16.5005 14.165C16.5005 14.5332 16.2022 14.8315 15.834 14.8315H14.1844C14.1787 14.8316 14.173 14.8323 14.1673 14.8323C13.7991 14.8323 13.5008 14.534 13.5008 14.1658V12.4991C13.5008 12.131 13.7991 11.8326 14.1673 11.8326Z",fill:"#1D1D1F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M14.584 9.16581C17.1153 9.16581 19.1673 11.2178 19.1673 13.7491C19.1673 16.2805 17.1153 18.3325 14.584 18.3325C12.0527 18.3325 10.0007 16.2804 10.0007 13.7491C10.0007 11.2178 12.0527 9.16581 14.584 9.16581ZM14.584 10.4988C12.7891 10.4988 11.3337 11.9542 11.3337 13.7491C11.3337 15.5441 12.7891 16.9995 14.584 16.9995C16.3789 16.9995 17.8343 15.5441 17.8343 13.7491C17.8343 11.9542 16.3789 10.4988 14.584 10.4988Z",fill:"#1D1D1F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M16.6673 2.49915C18.048 2.49915 19.1673 3.61843 19.1673 4.99915V9.16581C19.1673 9.62605 18.7942 9.99915 18.334 9.99915C17.8737 9.99915 17.5006 9.62605 17.5006 9.16581V8.33248H2.50065V14.9991C2.50065 15.4594 2.87375 15.8325 3.33398 15.8325H9.16732C9.62755 15.8325 10.0007 16.2056 10.0007 16.6658C10.0007 17.126 9.62755 17.4991 9.16732 17.4991H3.33398C1.95327 17.4991 0.833984 16.3799 0.833984 14.9991V4.99915C0.833984 3.61843 1.95327 2.49915 3.33398 2.49915H16.6673ZM3.33398 4.16581C2.87375 4.16581 2.50065 4.53891 2.50065 4.99915V6.66581H17.5006V4.99915C17.5006 4.53891 17.1276 4.16581 16.6673 4.16581H3.33398Z",fill:"#1D1D1F"})]}),l1=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M16.667 2.49915C18.0476 2.49915 19.1668 3.61858 19.167 4.99915V14.9991C19.1668 16.3797 18.0476 17.4991 16.667 17.4991H3.33398C1.95353 17.499 0.834161 16.3796 0.833984 14.9991V4.99915C0.83416 3.61869 1.95353 2.49932 3.33398 2.49915H16.667ZM2.5 14.9991C2.50018 15.4591 2.87401 15.832 3.33398 15.8322H16.667C17.1271 15.8322 17.4998 15.4592 17.5 14.9991V8.33215H2.50098L2.5 8.33118V14.9991ZM10.001 12.5333C10.4426 12.5335 10.8007 12.8915 10.8008 13.3331C10.8008 13.7748 10.4427 14.1328 10.001 14.1329H5.00098C4.55915 14.1329 4.20117 13.775 4.20117 13.3331C4.20126 12.8914 4.5592 12.5333 5.00098 12.5333H10.001ZM3.33398 4.16516C2.874 4.16534 2.50018 4.53917 2.5 4.99915V6.66614H17.5V4.99915C17.4998 4.53906 17.1271 4.16516 16.667 4.16516H3.33398Z",fill:"#080A0F"})}),s1=({className:t})=>(0,e.jsx)("svg",{className:t,width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M6.91058 4.4108C7.23602 4.08536 7.76353 4.08536 8.08897 4.4108L13.089 9.41079C13.4144 9.73623 13.4144 10.2637 13.089 10.5892L8.08897 15.5892C7.76353 15.9146 7.23602 15.9146 6.91058 15.5892C6.58515 15.2637 6.58514 14.7362 6.91058 14.4108L11.3214 9.99999L6.91058 5.58918C6.58514 5.26374 6.58514 4.73623 6.91058 4.4108Z",fill:"#080A0F"})});var i1=J;
|
|
1
|
+
"use strict";var _=Object.create;var p=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var U=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var K=(t,s)=>{for(var o in s)p(t,o,{get:s[o],enumerable:!0})},V=(t,s,o,d)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of W(s))!j.call(t,n)&&n!==o&&p(t,n,{get:()=>s[n],enumerable:!(d=E(s,n))||d.enumerable});return t};var k=(t,s,o)=>(o=t!=null?_(U(t)):{},V(s||!t||!t.__esModule?p(o,"default",{value:t,enumerable:!0}):o,t)),q=t=>V(p({},"__esModule",{value:!0}),t);var o1={};K(o1,{BenefitsModal:()=>D,default:()=>i1});module.exports=q(o1);var e=require("react/jsx-runtime"),a=require("../../../../../../components/index.js"),B=require("../../../../BizProductProvider.js"),F=require("../../../../hooks/useBenefits.js"),v=require("../../../../utils/index.js"),b=require("../../../../utils/textFormat.js"),C=require("react"),A=require("../../../../../AiuiProvider/index.js"),h=require("../../../../../../helpers/index.js"),m=require("framer-motion"),w=k(require("../../../../../HeaderNavigation/icons/Close.js")),I=k(require("./../ProductBenefitsTabs/ModalContainer.js"));const D=({title:t,showModal:s,closeModal:o,children:d,className:n})=>(0,e.jsx)(m.motion.div,{animate:s?{opacity:1}:{opacity:0,pointerEvents:"none"},transition:{duration:.15,bounce:0},className:"fixed inset-0 z-[1000] bg-black/50 opacity-0 tablet:flex tablet:items-center tablet:justify-center",children:(0,e.jsxs)(m.motion.div,{animate:s?{y:0}:{y:"100%"},transition:{duration:.2,ease:"easeOut"},className:(0,h.cn)("absolute bottom-0 left-0 right-0 max-w-[80vh] rounded-t-box tablet:rounded-box overflow-hidden bg-white","tablet:static tablet:h-auto tablet:max-h-[80vh] tablet:w-[896px] tablet:max-w-[90vw]",n),children:[(0,e.jsx)(m.motion.div,{animate:s?{scale:1}:{scale:.95},transition:{duration:.15,bounce:0},className:"hidden size-full tablet:block",children:(0,e.jsxs)("div",{className:"relative size-full overflow-auto",children:[(0,e.jsxs)("div",{className:"sticky top-0 z-[2] bg-white",children:[t&&(0,e.jsx)(a.Heading,{size:2,className:"w-full py-6 px-4 text-xl tablet:px-8 tablet:pt-4 tablet:pb-2 font-bold",children:t}),(0,e.jsx)("button",{onClick:o,className:"absolute right-4 top-4 z-[2]","aria-label":"Close modal",children:(0,e.jsx)(w.default,{className:"size-6"})})]}),d]})}),(0,e.jsxs)("div",{className:"relative size-full overflow-auto tablet:hidden",children:[(0,e.jsxs)("div",{className:"sticky top-0 z-[2] bg-white",children:[t&&(0,e.jsx)("p",{className:"w-full py-4 pl-5 text-xl font-bold",children:t}),(0,e.jsx)("button",{onClick:o,className:"absolute right-4 top-4 z-[2]","aria-label":"Close modal",children:(0,e.jsx)(w.default,{className:"size-6"})})]}),d]})]})}),J=({})=>{const{profile:t,variant:s,renderInstallments:o,savingDetail:d,openSignInPopup:n,openAuthCodePopup:T,product:x}=(0,B.useBizProductContext)(),{activated:R=!1}=t||{},[M,P]=(0,C.useState)(o);(0,C.useEffect)(()=>{o&&P(o),typeof window<"u"&&window.affirm?.ui?.refresh&&window.affirm.ui.refresh()},[o,s.id]);const i=(0,C.useMemo)(()=>x?.payload?.components?.find(l=>l.componentKey==="ProductBenefits")?.data||{},[x?.payload]),[S,N]=(0,C.useState)(!1),[G,L]=(0,C.useState)(!1),O=(0,F.useBenefits)({variant:s}),{locale:H="us",copyWriting:a1}=(0,A.useAiuiContext)(),{creditsRedemption:c,freeGift:y,bundle:f,fullGift:u,levelDiscount:g}=O,Z=[c.enable?{title:i?.creditsRedemption?.creditsTitle,description:i?.creditsRedemption?.creditsDesc,icon:(0,e.jsx)(z,{className:"desktop:size-6 size-5"})}:null,c.enable?{title:(0,e.jsx)(e.Fragment,{children:!R&&t?.email?(0,e.jsxs)(e.Fragment,{children:[i?.creditsRedemption?.creditsAfterActivation,(0,e.jsx)("span",{role:"button",tabIndex:0,onClick:()=>T?.(),className:"underline",children:i?.creditsRedemption?.active})]}):c?.config?.label?.replace("{{amount}}",(0,v.formatPrice)({amount:c?.config?.amount??0,currencyCode:s.price.currencyCode,locale:H}))}),icon:(0,e.jsx)(z,{className:"desktop:size-6 size-5"})}:null,g.enable?{title:g?.config?.title??"",description:g?.config?.tag??"",icon:(0,e.jsx)(X,{className:"desktop:size-6 size-5"})}:null,u.enable?{title:u?.config?.title??"",description:u?.config?.desc??"",icon:(0,e.jsx)(e1,{className:"desktop:size-6 size-5"})}:null,y.enable?{title:y?.config?.title??"",icon:(0,e.jsx)(Y,{className:"desktop:size-6 size-5"})}:null,f.enable?{title:(0,b.replaceTemplate)(i?.bundle?.bundleSaveUpTo,{count:(0,v.formatPrice)({amount:Math.max(...f?.config?.bundleList?.map(l=>l.savings??0)??[]),currencyCode:s.price.currencyCode,locale:H})}),description:(0,b.replaceTemplate)(i?.bundle?.bundleOffer,{count:f?.config?.bundleList?.length?.toString()||""}),icon:(0,e.jsx)($,{className:"desktop:size-6 size-5"})}:null,i?.paymentMethod?.title?{title:i.paymentMethod.title,image:i.paymentMethod.image,icon:(0,e.jsx)(l1,{className:"desktop:size-6 size-5"}),event:()=>N(!0)}:null,{useAble:!0,isAutoUse:!!t?.email&&!!d?.member,title:t?.email?i?.member?.loginTitle:(0,e.jsxs)("div",{children:[(0,e.jsx)("span",{className:"mr-2 desktop:mr-3",dangerouslySetInnerHTML:{__html:i?.member?.unloginTitle}}),(0,e.jsx)("span",{role:"button",tabIndex:0,onClick:l=>{l?.stopPropagation(),n?.()},className:"underline text-nowrap",dangerouslySetInnerHTML:{__html:i?.member?.loginNow}})]}),icon:(0,e.jsx)(Q,{className:"desktop:size-6 size-5"}),event:()=>L(!0)},M?{customRenderTitle:M,icon:(0,e.jsx)(t1,{className:"desktop:size-6 size-5"})}:null].filter(Boolean);return(0,e.jsxs)("div",{children:[i?.benefitTitle&&(0,e.jsx)(a.Text,{as:"div",html:i?.benefitTitle,className:"text-sm mb-3 lg-desktop:mb-4 lg-desktop:text-base font-bold leading-[1.2]"}),(0,e.jsx)("ul",{className:"desktop:px-4 px-3 rounded-box bg-[#F5F6F7]",children:(0,e.jsx)(e.Fragment,{children:Z?.map((l,r)=>(0,e.jsxs)("li",{children:[(0,e.jsxs)("div",{className:"flex gap-3 items-start py-3 laptop:py-4",children:[(0,e.jsx)("div",{className:"shrink-0",children:l?.icon}),(0,e.jsxs)("div",{onClick:l?.event,className:(0,h.cn)("flex flex-1 items-center gap-1 desktop:gap-2",l?.event&&"cursor-pointer justify-between"),children:[(0,e.jsxs)("div",{children:[l?.customRenderTitle?(0,e.jsx)("div",{children:l?.customRenderTitle}):(0,e.jsxs)("div",{className:"flex items-center gap-2 desktop:gap-3 text-[14px] laptop:text-base font-bold leading-[1.2]",children:[l?.title,l?.image&&(0,e.jsx)(a.Picture,{source:l?.image,className:"w-[40px] h-[20px] shrink-0"})]}),l?.description&&(0,e.jsx)(a.Text,{...typeof l.description=="string"?{html:l.description}:{},as:"p",className:"laptop:text-[14px] text-[12px] font-bold text-[#2A2C32]",children:l.description})]}),l?.event&&(0,e.jsx)(s1,{className:"size-4 desktop:size-6"})]})]}),r!=Z?.length-1&&(0,e.jsx)("div",{className:"bg-[#DADCE0] h-[1px]"})]},r))})}),(0,e.jsx)(I.default,{showModal:S,closeModal:()=>N(!1),children:(0,e.jsx)(a.Picture,{source:i?.paymentMethod?.payImage})}),(0,e.jsx)(D,{title:i?.member?.modelTitle,showModal:G,closeModal:()=>L(!1),children:(0,e.jsx)("ul",{className:"flex flex-col overflow-y-auto tablet:max-h-[calc(80vh-52px)] tablet:py-8 gap-5 pb-6 tablet:pb-8 tablet:gap-8 px-4 tablet:px-8",children:i?.member?.modelBenefits?.map((l,r)=>(0,e.jsxs)("li",{className:"flex flex-col gap-1",children:[(0,e.jsx)(a.Text,{html:l?.title,className:"text-[16px] tablet:text-[18px] font-bold leading-[1.4]"}),(0,e.jsx)(a.Text,{html:l?.desc,className:"text-[14px] text-[#1D1D1F] tablet:text-[16px] font-bold leading-[1.4] opacity-75"})]},r))})})]})},z=({className:t})=>(0,e.jsx)("svg",{className:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1ZM12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM17 13C17.5523 13 18 13.4477 18 14C18 14.5523 17.5523 15 17 15H9.41406L9.70703 15.293C10.0976 15.6835 10.0976 16.3165 9.70703 16.707C9.31651 17.0976 8.68349 17.0976 8.29297 16.707L6.29297 14.707C6.00697 14.421 5.92139 13.9909 6.07617 13.6172C6.23098 13.2436 6.59558 13 7 13H17ZM14.293 7.29297C14.6835 6.90244 15.3165 6.90244 15.707 7.29297L17.707 9.29297C17.993 9.57897 18.0786 10.0091 17.9238 10.3828C17.769 10.7564 17.4044 11 17 11H7C6.44772 11 6 10.5523 6 10C6 9.44771 6.44772 9 7 9H14.5859L14.293 8.70703C13.9024 8.31651 13.9024 7.68349 14.293 7.29297Z",fill:"#1D1D1F"})}),Q=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M14.4294 1.58368C15.0354 1.5838 15.6026 1.88286 15.944 2.38348L19.4997 7.5993C19.9918 8.32123 19.9058 9.29041 19.2946 9.91473L11.8571 17.5104C10.8453 18.5435 9.18314 18.5447 8.16961 17.5134L0.696949 9.90692C0.0916662 9.29063 -0.000821769 8.3354 0.474293 7.61395L3.90203 2.4079C4.24121 1.89312 4.81678 1.58368 5.43328 1.58368H14.4294ZM2.00457 8.62177L9.47722 16.2292C9.77143 16.5282 10.2539 16.5278 10.5475 16.2282L17.9841 8.63153L14.4294 3.41669H5.43328L2.00457 8.62177ZM13.5759 7.74481C13.9008 7.41946 14.4279 7.41834 14.7536 7.74286C15.0792 8.06792 15.0804 8.59584 14.7555 8.92157L10.6247 13.0593C10.2833 13.401 9.72933 13.4013 9.38738 13.0602L5.24382 8.92352C4.91829 8.59852 4.9172 8.07056 5.24187 7.74481C5.56689 7.41925 6.09484 7.41813 6.42058 7.74286L10.0046 11.321L13.5759 7.74481Z",fill:"#080A0F"})}),X=({className:t})=>(0,e.jsxs)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[(0,e.jsx)("path",{d:"M13.1615 5.66083C13.4869 5.33539 14.0144 5.33539 14.3398 5.66083C14.6653 5.98626 14.6653 6.51378 14.3398 6.83921L6.83984 14.3392C6.51441 14.6646 5.98689 14.6646 5.66146 14.3392C5.33602 14.0138 5.33602 13.4863 5.66146 13.1608L13.1615 5.66083Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.709 11.0417C13.6295 11.0417 14.3756 11.7879 14.3756 12.7084C14.3756 13.6288 13.6295 14.375 12.709 14.375C11.7885 14.375 11.0423 13.6288 11.0423 12.7084C11.0423 11.7879 11.7885 11.0417 12.709 11.0417ZM12.709 12.2917C12.4789 12.2917 12.2923 12.4782 12.2923 12.7084C12.2923 12.9385 12.4789 13.125 12.709 13.125C12.9391 13.125 13.1256 12.9385 13.1256 12.7084C13.1256 12.4782 12.9391 12.2917 12.709 12.2917Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M7.29232 5.62502C8.21279 5.62502 8.95898 6.37121 8.95898 7.29169C8.95898 8.21216 8.21279 8.95835 7.29232 8.95835C6.37184 8.95835 5.62565 8.21216 5.62565 7.29169C5.62565 6.37121 6.37184 5.62502 7.29232 5.62502ZM7.29232 6.87502C7.0622 6.87502 6.87565 7.06157 6.87565 7.29169C6.87565 7.52181 7.0622 7.70835 7.29232 7.70835C7.52244 7.70835 7.70898 7.52181 7.70898 7.29169C7.70898 7.06157 7.52244 6.87502 7.29232 6.87502Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M16.6673 2.91669C18.048 2.91669 19.1673 4.03597 19.1673 5.41669V8.0469C19.1673 8.39923 18.9458 8.71388 18.6139 8.83221C18.0561 9.03101 17.652 9.57037 17.652 10.2084C17.652 10.8463 18.0561 11.3857 18.6139 11.5845C18.9458 11.7028 19.1673 12.0175 19.1673 12.3698V15C19.1673 16.3807 18.048 17.5 16.6673 17.5H3.33398C1.95327 17.5 0.833984 16.3807 0.833984 15V12.3698L0.84375 12.2396C0.890672 11.9418 1.09696 11.688 1.38737 11.5845C1.94519 11.3857 2.34928 10.8463 2.34928 10.2084C2.34928 9.57036 1.94519 9.03101 1.38737 8.83221C1.05551 8.71388 0.833984 8.39923 0.833984 8.0469V5.41669C0.833985 4.03598 1.95327 2.91669 3.33398 2.91669H16.6673ZM3.33398 4.58335C2.87375 4.58335 2.50065 4.95645 2.50065 5.41669V7.52606C3.40888 8.07233 4.01595 9.06946 4.01595 10.2084C4.01595 11.3471 3.40868 12.3435 2.50065 12.8898V15C2.50065 15.4603 2.87375 15.8334 3.33398 15.8334H16.6673C17.1276 15.8334 17.5006 15.4603 17.5006 15V12.8898C16.5926 12.3435 15.9853 11.3471 15.9853 10.2084C15.9853 9.06945 16.5924 8.07233 17.5006 7.52606V5.41669C17.5006 4.95645 17.1276 4.58335 16.6673 4.58335H3.33398Z",fill:"#080A0F"})]}),Y=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.4951 1.47201C12.791 1.17663 13.2707 1.17634 13.5664 1.47201C13.862 1.76788 13.8622 2.24851 13.5664 2.54428L11.8301 4.2806H17.5752C17.9935 4.28073 18.333 4.62012 18.333 5.03842V8.06869C18.333 8.48701 17.9935 8.82638 17.5752 8.8265H17.1982V17.1595C17.198 17.5776 16.8585 17.9171 16.4404 17.9173H3.56152C3.14327 17.9173 2.80394 17.5777 2.80371 17.1595V8.8265H2.42383C2.00543 8.8265 1.66602 8.48709 1.66602 8.06869V5.03842C1.66605 4.62005 2.00545 4.2806 2.42383 4.2806H8.16992L6.43359 2.54428C6.13775 2.24843 6.13776 1.76786 6.43359 1.47201C6.72945 1.17616 7.21001 1.17616 7.50586 1.47201L10 3.96615L12.4951 1.47201ZM4.31934 16.4017H9.24219V8.8265H4.31934V16.4017ZM10.7578 16.4017H15.6826V8.8265H10.7578V16.4017ZM3.18164 7.31088H16.8174V5.79623H3.18164V7.31088Z",fill:"#080A0F"})}),$=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M14.1152 1.18357L14.2551 1.26642L18.4546 3.9088C18.8514 4.15858 19.178 4.50301 19.4043 4.91029C19.6306 5.31758 19.7492 5.77458 19.7493 6.23909V16.0194C19.7495 16.3825 19.6772 16.742 19.5366 17.0775C19.396 17.413 19.1898 17.7179 18.9298 17.9747C18.6697 18.2315 18.361 18.4352 18.0212 18.5742C17.6814 18.7132 17.3172 18.7847 16.9494 18.7847H8.55091C8.1623 18.7852 7.77786 18.7056 7.42219 18.5511C7.06652 18.3965 6.74745 18.1704 6.48539 17.8871L1.61712 16.3743C1.35494 16.2904 1.11208 16.1563 0.902404 15.9797C0.692732 15.8031 0.520358 15.5875 0.395126 15.3451C0.269895 15.1027 0.194259 14.8384 0.172541 14.5672C0.150822 14.296 0.183446 14.0232 0.268548 13.7644L3.25386 4.69868C3.36315 4.36757 3.55522 4.06899 3.81232 3.83053C4.06942 3.59207 4.38326 3.42141 4.72484 3.33434L9.66236 2.26275L11.246 1.26642C11.6722 0.998206 12.1641 0.848941 12.6694 0.834475C13.1747 0.820008 13.6746 0.94088 14.1159 1.18426L14.1152 1.18357ZM11.9979 2.44503L7.79829 5.08741C7.59979 5.21229 7.43639 5.38454 7.32319 5.58825C7.20998 5.79196 7.15061 6.02055 7.15058 6.2529V16.0201C7.15058 16.7838 7.7773 17.4024 8.55021 17.4024H16.9494C17.1333 17.4025 17.3155 17.3668 17.4855 17.2974C17.6555 17.228 17.8099 17.1261 17.94 16.9978C18.0701 16.8694 18.1733 16.717 18.2438 16.5492C18.3142 16.3815 18.3504 16.2017 18.3504 16.0201V6.2529C18.3504 5.78063 18.1056 5.3415 17.7027 5.08741L13.5031 2.44503C13.2784 2.30354 13.0174 2.22837 12.7508 2.22837C12.4843 2.22837 12.2233 2.30354 11.9986 2.44503H11.9979ZM6.49449 4.36243L5.07457 4.67106C4.96068 4.70009 4.85604 4.757 4.77033 4.83654C4.68463 4.91607 4.62062 5.01565 4.58425 5.12608L1.59823 14.1911C1.56987 14.2774 1.559 14.3683 1.56626 14.4587C1.57351 14.5491 1.59875 14.6373 1.64051 14.7181C1.68228 14.7988 1.73976 14.8707 1.80968 14.9296C1.87959 14.9884 1.96057 15.0331 2.04799 15.0611L5.76005 16.2459C5.75394 16.1708 5.75091 16.0955 5.75095 16.0201V6.23978C5.75095 5.53552 6.02235 4.86715 6.49518 4.36243H6.49449ZM15.4938 11.8801C15.909 11.8803 16.3148 12.0019 16.6599 12.2297C17.005 12.4575 17.2739 12.7812 17.4327 13.1599C17.5914 13.5386 17.6329 13.9552 17.5517 14.3571C17.4706 14.759 17.2706 15.1282 16.9769 15.4178C16.6832 15.7075 16.3091 15.9048 15.9019 15.9846C15.4947 16.0644 15.0727 16.0232 14.6892 15.8663C14.3057 15.7093 13.9779 15.4436 13.7474 15.1028C13.5168 14.762 13.3939 14.3613 13.394 13.9515C13.394 12.8074 14.3341 11.8801 15.4938 11.8801ZM10.0995 13.5124L15.0489 8.63015C15.1753 8.50803 15.3437 8.4376 15.5204 8.43301C15.6972 8.42841 15.8691 8.48998 16.0018 8.60536C16.1344 8.72074 16.2179 8.88139 16.2355 9.05504C16.2532 9.22869 16.2036 9.40249 16.0967 9.54155L16.0387 9.60645L11.0893 14.4887C10.963 14.6108 10.7945 14.6812 10.6178 14.6858C10.4411 14.6904 10.2691 14.6288 10.1365 14.5135C10.0038 14.3981 9.92029 14.2374 9.90267 14.0638C9.88506 13.8901 9.93464 13.7163 10.0415 13.5773L10.0995 13.5124ZM15.4938 13.261C15.3083 13.261 15.1304 13.3338 14.9992 13.4633C14.868 13.5928 14.7943 13.7684 14.7943 13.9515C14.7943 14.1346 14.868 14.3102 14.9992 14.4397C15.1304 14.5692 15.3083 14.642 15.4938 14.642C15.6793 14.642 15.8572 14.5692 15.9884 14.4397C16.1196 14.3102 16.1933 14.1346 16.1933 13.9515C16.1933 13.7684 16.1196 13.5928 15.9884 13.4633C15.8572 13.3338 15.6793 13.261 15.4938 13.261ZM10.5947 7.04693C11.0099 7.04706 11.4157 7.16872 11.7608 7.39652C12.1059 7.62431 12.3749 7.94801 12.5336 8.32668C12.6924 8.70536 12.7338 9.12199 12.6527 9.5239C12.5715 9.92582 12.3715 10.295 12.0778 10.5846C11.7842 10.8743 11.4101 11.0716 11.0029 11.1514C10.5957 11.2312 10.1736 11.19 9.79012 11.0331C9.40661 10.8761 9.07886 10.6104 8.84833 10.2696C8.61779 9.92877 8.49482 9.52811 8.49496 9.1183C8.49496 7.97421 9.43504 7.04693 10.5947 7.04693ZM10.5947 8.42784C10.5029 8.4278 10.4119 8.44561 10.327 8.48027C10.2422 8.51492 10.165 8.56574 10.1 8.62983C9.96881 8.75925 9.89503 8.93483 9.89493 9.11795C9.89484 9.30107 9.96845 9.47673 10.0996 9.60628C10.2307 9.73583 10.4085 9.80866 10.594 9.80876C10.7796 9.80876 10.9575 9.73601 11.0886 9.60653C11.2198 9.47704 11.2935 9.30142 11.2935 9.1183C11.2935 8.93518 11.2198 8.75956 11.0886 8.63007C10.9575 8.50059 10.7796 8.42784 10.594 8.42784H10.5947Z",fill:"#080A0F",stroke:"#080A0F","stroke-width":"0.166667"})}),e1=({className:t})=>(0,e.jsxs)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M5.45492 6.28808C6.43123 5.31177 8.01457 5.31177 8.99089 6.28808C9.96696 7.26431 9.96685 8.84695 8.99089 9.82324C8.01457 10.7996 6.43123 10.7996 5.45492 9.82324C4.47891 8.84694 4.4788 7.26431 5.45492 6.28808ZM8.04769 7.23047C7.59205 6.77513 6.85282 6.77495 6.3973 7.23047C5.94188 7.686 5.94199 8.42526 6.3973 8.88086C6.85287 9.33643 7.59207 9.33636 8.04769 8.88086C8.5033 8.42525 8.5033 7.68608 8.04769 7.23047Z",fill:"#080A0F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M9.07715 1.95703C9.58012 1.90116 10.0815 2.07705 10.4395 2.43473L18.1234 10.1187C18.7739 10.7695 18.7741 11.8246 18.1234 12.4754L11.6414 18.9574C10.9907 19.6081 9.93555 19.6079 9.28467 18.9574L1.60075 11.2734C1.28783 10.9603 1.11442 10.5376 1.11328 10.0999L1.12305 9.91113L1.77165 4.0778C1.85775 3.30308 2.46909 2.69171 3.24381 2.60563L9.07715 1.95703ZM3.42773 4.26172L2.77913 10.095L10.4631 17.779L16.945 11.297L9.26107 3.61312L3.42773 4.26172Z",fill:"#080A0F"})]}),t1=({className:t})=>(0,e.jsxs)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[(0,e.jsx)("path",{d:"M14.1673 11.8326C14.5355 11.8326 14.8338 12.131 14.8338 12.4991V13.4985H15.834C16.2022 13.4985 16.5005 13.7968 16.5005 14.165C16.5005 14.5332 16.2022 14.8315 15.834 14.8315H14.1844C14.1787 14.8316 14.173 14.8323 14.1673 14.8323C13.7991 14.8323 13.5008 14.534 13.5008 14.1658V12.4991C13.5008 12.131 13.7991 11.8326 14.1673 11.8326Z",fill:"#1D1D1F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M14.584 9.16581C17.1153 9.16581 19.1673 11.2178 19.1673 13.7491C19.1673 16.2805 17.1153 18.3325 14.584 18.3325C12.0527 18.3325 10.0007 16.2804 10.0007 13.7491C10.0007 11.2178 12.0527 9.16581 14.584 9.16581ZM14.584 10.4988C12.7891 10.4988 11.3337 11.9542 11.3337 13.7491C11.3337 15.5441 12.7891 16.9995 14.584 16.9995C16.3789 16.9995 17.8343 15.5441 17.8343 13.7491C17.8343 11.9542 16.3789 10.4988 14.584 10.4988Z",fill:"#1D1D1F"}),(0,e.jsx)("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M16.6673 2.49915C18.048 2.49915 19.1673 3.61843 19.1673 4.99915V9.16581C19.1673 9.62605 18.7942 9.99915 18.334 9.99915C17.8737 9.99915 17.5006 9.62605 17.5006 9.16581V8.33248H2.50065V14.9991C2.50065 15.4594 2.87375 15.8325 3.33398 15.8325H9.16732C9.62755 15.8325 10.0007 16.2056 10.0007 16.6658C10.0007 17.126 9.62755 17.4991 9.16732 17.4991H3.33398C1.95327 17.4991 0.833984 16.3799 0.833984 14.9991V4.99915C0.833984 3.61843 1.95327 2.49915 3.33398 2.49915H16.6673ZM3.33398 4.16581C2.87375 4.16581 2.50065 4.53891 2.50065 4.99915V6.66581H17.5006V4.99915C17.5006 4.53891 17.1276 4.16581 16.6673 4.16581H3.33398Z",fill:"#1D1D1F"})]}),l1=({className:t})=>(0,e.jsx)("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M16.667 2.49915C18.0476 2.49915 19.1668 3.61858 19.167 4.99915V14.9991C19.1668 16.3797 18.0476 17.4991 16.667 17.4991H3.33398C1.95353 17.499 0.834161 16.3796 0.833984 14.9991V4.99915C0.83416 3.61869 1.95353 2.49932 3.33398 2.49915H16.667ZM2.5 14.9991C2.50018 15.4591 2.87401 15.832 3.33398 15.8322H16.667C17.1271 15.8322 17.4998 15.4592 17.5 14.9991V8.33215H2.50098L2.5 8.33118V14.9991ZM10.001 12.5333C10.4426 12.5335 10.8007 12.8915 10.8008 13.3331C10.8008 13.7748 10.4427 14.1328 10.001 14.1329H5.00098C4.55915 14.1329 4.20117 13.775 4.20117 13.3331C4.20126 12.8914 4.5592 12.5333 5.00098 12.5333H10.001ZM3.33398 4.16516C2.874 4.16534 2.50018 4.53917 2.5 4.99915V6.66614H17.5V4.99915C17.4998 4.53906 17.1271 4.16516 16.667 4.16516H3.33398Z",fill:"#080A0F"})}),s1=({className:t})=>(0,e.jsx)("svg",{className:t,width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M6.91058 4.4108C7.23602 4.08536 7.76353 4.08536 8.08897 4.4108L13.089 9.41079C13.4144 9.73623 13.4144 10.2637 13.089 10.5892L8.08897 15.5892C7.76353 15.9146 7.23602 15.9146 6.91058 15.5892C6.58515 15.2637 6.58514 14.7362 6.91058 14.4108L11.3214 9.99999L6.91058 5.58918C6.58514 5.26374 6.58514 4.73623 6.91058 4.4108Z",fill:"#080A0F"})});var i1=J;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|