npm - @anker-in/headless-ui - Versions diffs - 1.3.20 → 1.3.22 - Mend

@anker-in/headless-ui 1.3.20 → 1.3.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (76) hide show

package/dist/esm/biz-components/EventSchedule/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/EventSchedule/index.tsx"],
-  "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"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "React", "cn", "withLayout", "Text", "Picture", "Heading", "Container", "Swiper", "SwiperSlide", "dayjs", "cva", "getTimeStatus", "startDate", "endDate", "now", "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", "EventSchedule_default"]
+  "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 { 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\uFF0C\u5982 '2024-12-01T00:00:00Z'\uFF09 */\n  startDate: string\n  /** \u7ED3\u675F\u65E5\u671F\uFF08ISO 8601 \u683C\u5F0F\uFF0C\u5982 '2024-12-31T23:59:59Z'\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 = Date.now()\n  const start = new Date(startDate).getTime()\n  const end = new Date(endDate).getTime()\n\n  // \u5F53\u524D\u65F6\u95F4\u5728\u7ED3\u675F\u65F6\u95F4\u4E4B\u540E - \u5DF2\u5B8C\u6210\n  if (now > end) {\n    return 'completed'\n  }\n\n  // \u5F53\u524D\u65F6\u95F4\u5728\u5F00\u59CB\u65F6\u95F4\u4E4B\u524D - \u672A\u5F00\u59CB\n  if (now < 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"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "React", "cn", "withLayout", "Text", "Picture", "Heading", "Container", "Swiper", "SwiperSlide", "cva", "getTimeStatus", "startDate", "endDate", "now", "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", "EventSchedule_default"]
 }

package/dist/esm/biz-components/FooterNavigation/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useEffect as w,useMemo as D,useState as v}from"react";import{Text as d,Container as F,Link as x}from"../../components/index.js";import S from"../Subscribe/index.js";import{FooterNavigationBlockType as y}from"./types.js";import{AddIcon as B,SubtractIcon as C,ArrowRightIcon as z,CountryIcon as E}from"./icons/index.js";import{useMediaQuery as M}from"react-responsive";import{cn as m,getLocalizedPath as u}from"../../helpers/utils.js";import{useAiuiContext as k}from"../AiuiProvider/index.js";import{withLayout as $}from"../../shared/Styles.js";const T=({data:{footer:a}={},currentCountry:p,event:n,subscribeLoading:f,classNames:i,className:l,moduleIds:s,...b})=>{const[c,r]=v(!1),g=M({query:"(max-width: 1439px)"});w(()=>{r(g)},[g]);const h=D(()=>a?.blocks?.find(t=>t?.blockType===y.Brand)?.country||{},[a]);return e("footer",{...b,className:m(i?.root,l),children:o(F,{className:m(i?.child),childClassName:m("laptop:py-16 desktop:gap-16 flex flex-col gap-8 bg-black py-8"),children:[e(d,{html:a?.story,className:"desktop:text-sm text-xs font-bold text-[#6D6D6F]"}),a?.blocks?.map(t=>{if(t?.blockType===y.Signup)return e(P,{subscribeLoading:f,data:t,onSubmit:n?.signup,id:s?.marketingConversion},t.id);if(t?.blockType===y.Brand)return e(j,{data:t,isMobile:c,event:n,currentCountry:p,id:s?.footerBrand},t?.id);if(t?.blockType===y.Main)return e(O,{data:{...t,country:h},event:n,isMobile:c,currentCountry:p,id:s?.mainServices},t.id)})]})})},P=({data:a,onSubmit:p,subscribeLoading:n,id:f="footer-marketing-conversion"})=>{const{locale:i="us"}=k();return o("div",{id:f,className:"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#1E2024] px-4 py-8",children:[e(S,{subscribeMetadata:a?.signup,className:"desktop:flex-[744]",onSubmit:p,loading:n}),e("div",{className:"desktop:hidden h-px w-full bg-[#3D3E3F]"}),o("div",{className:"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4",children:[o("div",{className:"flex-1",children:[e(d,{html:a?.enjoy?.title,className:" text-xl font-bold leading-[1.2] text-white"}),e("div",{className:"mt-4 flex flex-col gap-2",children:a?.enjoy?.enjoys?.map(l=>o("div",{className:"flex-start flex gap-2",children:[e("img",{src:l?.icon?.url,loading:"lazy",alt:l?.icon?.alt||"",className:"size-5 shrink-0"}),e(d,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})]},l?.id))})]}),e("div",{className:"desktop:block hidden w-px bg-[#3D3E3F]"}),o("div",{className:"flex-1",children:[e(d,{html:a?.benefit?.title,className:"text-xl font-bold leading-[1.2] text-white"}),e("div",{className:"mt-4 flex flex-col gap-2",children:a?.benefit?.benefits?.map(l=>e(x,{href:`${u(l?.link,i)}?ref=footer`,asChild:!l?.link,className:"no-underline",children:e(d,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},l?.id))})]})]})]})},O=({data:a,event:p,isMobile:n,currentCountry:f,id:i="footer-main-services"})=>{const{locale:l="us"}=k(),[s,b]=v(!1),{services:c,mainNav:r,country:g}=a,h="contact-section";return o("nav",{id:i,className:"flex flex-col gap-8","aria-label":"Main navigation",children:[o("div",{className:m({"desktop:gap-16 flex":c?.download?.title}),children:[o("div",{className:m("w-full",{"desktop:flex-[1260]":c?.download?.title}),children:[e(d,{html:c?.storeBenefits?.title,className:" text-xl font-bold leading-[1.2] text-white"}),e("div",{className:m("laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2",{"desktop:max-w-[648px]":c?.download?.title}),children:c?.storeBenefits?.reasons?.map(t=>o("div",{className:"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2",children:[e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt||"",className:"size-5 shrink-0"}),e(x,{href:`${u(t?.link,l)}?ref=footer`,asChild:!t?.link,className:"no-underline",children:e(d,{html:t?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})})]},t?.id))})]}),e(L,{className:m({"desktop:flex-[404] hidden desktop:block":c?.download?.title}),title:c?.download?.title,apps:c?.download?.apps})]}),e("div",{className:"desktop:block hidden h-px bg-[#3D3E3F]","aria-hidden":"true"}),o("div",{className:"desktop:grid grid-cols-4 gap-4",children:[e(N,{title:r?.products?.title,lists:r?.products?.products}),e(N,{title:r?.explore?.title,lists:r?.explore?.explores}),e(N,{title:r?.support?.title,lists:r?.support?.supports}),o("div",{className:"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4",children:[o("div",{className:"desktop:pb-0 flex items-center justify-between pb-4",children:[e(d,{as:"p",html:r?.contact?.title,className:"text-xl font-bold leading-[1.2] text-white",id:h}),n&&e("button",{onClick:()=>b(!s),"aria-expanded":s,"aria-controls":h,"aria-label":s?"Collapse contact section":"Expand contact section",children:s?e(C,{width:20,height:20}):e(B,{width:20,height:20})})]}),(s&&n||!n)&&e("div",{className:"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2",role:"region","aria-labelledby":h,children:r?.contact?.contacts?.map(t=>o(x,{href:t?.link,className:"group flex items-start gap-2 no-underline",children:[e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt,className:"size-5 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100"}),e(d,{html:t?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] transition-colors duration-200 group-hover:text-white"})]},t?.id))}),e(A,{country:f||g,className:"desktop:hidden border-b border-[#3D3E3F]",isMobile:n,onChangeCountry:p?.country}),e("div",{className:"desktop:hidden mt-8",children:e(L,{title:c?.download?.title,apps:c?.download?.apps})}),!!r?.socials?.length&&e("div",{className:"mt-8 flex items-center gap-2",role:"list","aria-label":"Social media links",children:r?.socials?.map(t=>e(x,{href:`${u(t?.link,l)}?ref=footer`,className:"group",role:"listitem","aria-label":t?.icon?.alt||"Social media",children:e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt,className:"size-8 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100"})},t?.id))}),e("div",{className:"mt-4 flex flex-wrap gap-2",role:"list","aria-label":"Payment methods",children:r?.payment?.map(t=>e(x,{href:u(t?.link,l),asChild:!t?.link,role:"listitem","aria-label":t?.icon?.alt||"Payment method",children:e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt||"",className:"h-[28px] w-[44px] shrink-0"})},t?.id))})]})]})]})},j=({data:a,isMobile:p,event:n,currentCountry:f,id:i="footer-brand"})=>{const{locale:l="us"}=k();return o("div",{id:i,className:"flex flex-col gap-4",children:[o("div",{className:"desktop:items-center desktop:flex desktop:gap-4",children:[o("div",{className:"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4",children:[e(x,{href:`${u(a?.brand?.link,l)}?ref=footer`,asChild:!a?.brand?.link,children:e(d,{html:a?.brand?.currentBrand,className:"cursor-pointer text-[#B6B6BA] hover:text-white"})}),e("div",{className:"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]"}),e("div",{className:"desktop:gap-6 flex flex-wrap items-center gap-4",children:a?.brand?.brands?.map(s=>e(x,{href:`${u(s?.link,l)}?ref=footer`,children:e(d,{html:s?.icon,className:"text-[#B6B6BA] hover:text-white"})},s?.id))})]}),e(A,{country:f||a?.country,className:"desktop:flex-[316] desktop:block hidden",isMobile:p,onChangeCountry:n?.country})]}),e("div",{className:"h-px bg-[#3D3E3F]"}),o("div",{className:"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1",children:[e(d,{html:a?.copyright?.label,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]"}),o("div",{className:"flex flex-wrap items-center gap-x-2 gap-y-1",children:[a?.policy?.policies?.map(s=>e(x,{href:`${u(s?.link,l)}?ref=footer`,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white",children:s?.label},s?.id)),a?.policy?.cookies&&e("button",{"data-cc":"show-preferencesModal",onClick:n?.cookiesSet,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black","aria-label":`Cookie preferences: ${a?.policy?.cookies}`,children:a?.policy?.cookies})]})]})]})},N=({title:a,lists:p,className:n})=>{const{locale:f="us"}=k(),[i,l]=v(!1),[s,b]=v(!1),c=M({query:"(max-width: 1439px)"});w(()=>{b(c)},[c]);const r=`nav-section-${a?.replace(/\s+/g,"-").toLowerCase()}`;return o("div",{className:m("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",n),children:[o("div",{className:"flex items-center justify-between",children:[e(d,{as:"p",html:a,className:"text-xl font-bold leading-[1.2] text-white",id:r}),s&&e("button",{onClick:()=>l(!i),"aria-expanded":i,"aria-controls":r,"aria-label":i?`Collapse ${a}`:`Expand ${a}`,className:"focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black",children:i?e(C,{width:20,height:20}):e(B,{width:20,height:20})})]}),(i&&s||!s)&&e("nav",{className:"mt-4 flex flex-col gap-2",role:"region","aria-labelledby":r,children:p?.map(g=>e(x,{href:`${u(g?.link,f)}?ref=footer`,className:"no-underline",children:e(d,{html:g?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},g?.id))})]})},L=({title:a,apps:p,className:n})=>{const{locale:f="us"}=k();return p?.length?o("div",{className:n,children:[e(d,{html:a,className:" text-xl font-bold leading-[1.2] text-white"}),e("div",{className:"mt-4 flex items-center gap-4",role:"list","aria-label":"Download apps",children:p?.map(i=>o(x,{href:u(i?.link,f),className:"group flex flex-col items-center gap-[6px]",role:"listitem","aria-label":i?.icon?.alt||i?.label||"Download app",children:[e("img",{src:i?.icon?.url,loading:"lazy",alt:i?.icon?.alt,className:"size-10 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100"}),i?.label&&e(d,{html:i?.label,className:"text-xs font-bold text-[#999999] transition-colors duration-200 group-hover:text-white"})]},i?.id))})]}):null},A=({country:a,isMobile:p,className:n,onChangeCountry:f})=>e("div",{className:m("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",n),children:o("button",{onClick:()=>f?.(),className:"flex w-full items-center justify-between focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black","aria-label":`Change country/region, current: ${a?.countryName||a?.country}`,children:[o("div",{className:"group flex items-center gap-2",children:[e(E,{width:20,height:20,className:"shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100","aria-hidden":"true"}),e(d,{as:"span",html:a?.countryName||a?.country,className:"desktop:text-[#B6B6BA] desktop:group-hover:text-white text-base font-bold leading-[1.4] text-white transition-colors duration-200"})]}),p&&e(z,{width:20,height:20,"aria-hidden":"true"})]})});var V=$(T);export{V as default};
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useEffect as w,useMemo as D,useState as v}from"react";import{Text as d,Container as F,Link as x}from"../../components/index.js";import S from"../Subscribe/index.js";import{FooterNavigationBlockType as y}from"./types.js";import{AddIcon as B,SubtractIcon as C,ArrowRightIcon as z,CountryIcon as E}from"./icons/index.js";import{useMediaQuery as M}from"react-responsive";import{cn as m,getLocalizedPath as u}from"../../helpers/utils.js";import{useAiuiContext as k}from"../AiuiProvider/index.js";import{withLayout as T}from"../../shared/Styles.js";const P=({data:{footer:a}={},currentCountry:p,event:n,subscribeLoading:f,classNames:i,className:l,moduleIds:s,...b})=>{const[c,r]=v(!1),g=M({query:"(max-width: 1439px)"});w(()=>{r(g)},[g]);const h=D(()=>a?.blocks?.find(t=>t?.blockType===y.Brand)?.country||{},[a]);return e("footer",{...b,className:m(i?.root,l),children:o(F,{className:m(i?.child),childClassName:m("laptop:py-16 desktop:gap-16 flex flex-col gap-8 bg-black py-8"),children:[e(d,{html:a?.story,className:"desktop:text-sm text-xs font-bold text-[#6D6D6F]"}),a?.blocks?.map(t=>{if(t?.blockType===y.Signup)return e($,{subscribeLoading:f,data:t,onSubmit:n?.signup,id:s?.marketingConversion},t.id);if(t?.blockType===y.Brand)return e(j,{data:t,isMobile:c,event:n,currentCountry:p,id:s?.footerBrand},t?.id);if(t?.blockType===y.Main)return e(O,{data:{...t,country:h},event:n,isMobile:c,currentCountry:p,id:s?.mainServices},t.id)})]})})},$=({data:a,onSubmit:p,subscribeLoading:n,id:f="footer-marketing-conversion"})=>{const{locale:i="us"}=k();return o("div",{id:f,className:"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#1E2024] px-4 py-8",children:[e(S,{subscribeMetadata:a?.signup,className:"desktop:flex-[744]",onSubmit:p,loading:n}),e("div",{className:"desktop:hidden h-px w-full bg-[#3D3E3F]"}),o("div",{className:"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4",children:[o("div",{className:"flex-1",children:[e(d,{html:a?.enjoy?.title,className:" text-xl font-bold leading-[1.2] text-white"}),e("div",{className:"mt-4 flex flex-col gap-2",children:a?.enjoy?.enjoys?.map(l=>o("div",{className:"flex-start flex gap-2",children:[e("img",{src:l?.icon?.url,loading:"lazy",alt:l?.icon?.alt||"",className:"size-5 shrink-0"}),e(d,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})]},l?.id))})]}),e("div",{className:"desktop:block hidden w-px bg-[#3D3E3F]"}),o("div",{className:"flex-1",children:[e(d,{html:a?.benefit?.title,className:"text-xl font-bold leading-[1.2] text-white"}),e("div",{className:"mt-4 flex flex-col gap-2",children:a?.benefit?.benefits?.map(l=>e(x,{href:u(l?.link,i,"ref=footer"),asChild:!l?.link,className:"no-underline",children:e(d,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},l?.id))})]})]})]})},O=({data:a,event:p,isMobile:n,currentCountry:f,id:i="footer-main-services"})=>{const{locale:l="us"}=k(),[s,b]=v(!1),{services:c,mainNav:r,country:g}=a,h="contact-section";return o("nav",{id:i,className:"flex flex-col gap-8","aria-label":"Main navigation",children:[o("div",{className:m({"desktop:gap-16 flex":c?.download?.title}),children:[o("div",{className:m("w-full",{"desktop:flex-[1260]":c?.download?.title}),children:[e(d,{html:c?.storeBenefits?.title,className:" text-xl font-bold leading-[1.2] text-white"}),e("div",{className:m("laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2",{"desktop:max-w-[648px]":c?.download?.title}),children:c?.storeBenefits?.reasons?.map(t=>o("div",{className:"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2",children:[e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt||"",className:"size-5 shrink-0"}),e(x,{href:u(t?.link,l,"ref=footer"),asChild:!t?.link,className:"no-underline",children:e(d,{html:t?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})})]},t?.id))})]}),e(L,{className:m({"desktop:flex-[404] hidden desktop:block":c?.download?.title}),title:c?.download?.title,apps:c?.download?.apps})]}),e("div",{className:"desktop:block hidden h-px bg-[#3D3E3F]","aria-hidden":"true"}),o("div",{className:"desktop:grid grid-cols-4 gap-4",children:[e(N,{title:r?.products?.title,lists:r?.products?.products}),e(N,{title:r?.explore?.title,lists:r?.explore?.explores}),e(N,{title:r?.support?.title,lists:r?.support?.supports}),o("div",{className:"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4",children:[o("div",{className:"desktop:pb-0 flex items-center justify-between pb-4",children:[e(d,{as:"p",html:r?.contact?.title,className:"text-xl font-bold leading-[1.2] text-white",id:h}),n&&e("button",{onClick:()=>b(!s),"aria-expanded":s,"aria-controls":h,"aria-label":s?"Collapse contact section":"Expand contact section",children:s?e(C,{width:20,height:20}):e(B,{width:20,height:20})})]}),(s&&n||!n)&&e("div",{className:"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2",role:"region","aria-labelledby":h,children:r?.contact?.contacts?.map(t=>o(x,{href:t?.link,className:"group flex items-start gap-2 no-underline",children:[e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt,className:"size-5 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100"}),e(d,{html:t?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] transition-colors duration-200 group-hover:text-white"})]},t?.id))}),e(A,{country:f||g,className:"desktop:hidden border-b border-[#3D3E3F]",isMobile:n,onChangeCountry:p?.country}),e("div",{className:"desktop:hidden mt-8",children:e(L,{title:c?.download?.title,apps:c?.download?.apps})}),!!r?.socials?.length&&e("div",{className:"mt-8 flex items-center gap-2",role:"list","aria-label":"Social media links",children:r?.socials?.map(t=>e(x,{href:u(t?.link,l,"ref=footer"),className:"group",role:"listitem","aria-label":t?.icon?.alt||"Social media",children:e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt,className:"size-8 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100"})},t?.id))}),e("div",{className:"mt-4 flex flex-wrap gap-2",role:"list","aria-label":"Payment methods",children:r?.payment?.map(t=>e(x,{href:u(t?.link,l),asChild:!t?.link,role:"listitem","aria-label":t?.icon?.alt||"Payment method",children:e("img",{src:t?.icon?.url,loading:"lazy",alt:t?.icon?.alt||"",className:"h-[28px] w-[44px] shrink-0"})},t?.id))})]})]})]})},j=({data:a,isMobile:p,event:n,currentCountry:f,id:i="footer-brand"})=>{const{locale:l="us"}=k();return o("div",{id:i,className:"flex flex-col gap-4",children:[o("div",{className:"desktop:items-center desktop:flex desktop:gap-4",children:[o("div",{className:"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4",children:[e(x,{href:u(a?.brand?.link,l,"ref=footer"),asChild:!a?.brand?.link,children:e(d,{html:a?.brand?.currentBrand,className:"cursor-pointer text-[#B6B6BA] hover:text-white"})}),e("div",{className:"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]"}),e("div",{className:"desktop:gap-6 flex flex-wrap items-center gap-4",children:a?.brand?.brands?.map(s=>e(x,{href:u(s?.link,l,"ref=footer"),children:e(d,{html:s?.icon,className:"text-[#B6B6BA] hover:text-white"})},s?.id))})]}),e(A,{country:f||a?.country,className:"desktop:flex-[316] desktop:block hidden",isMobile:p,onChangeCountry:n?.country})]}),e("div",{className:"h-px bg-[#3D3E3F]"}),o("div",{className:"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1",children:[e(d,{html:a?.copyright?.label,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]"}),o("div",{className:"flex flex-wrap items-center gap-x-2 gap-y-1",children:[a?.policy?.policies?.map(s=>e(x,{href:u(s?.link,l,"ref=footer"),className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white",children:s?.label},s?.id)),a?.policy?.cookies&&e("button",{"data-cc":"show-preferencesModal",onClick:n?.cookiesSet,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black","aria-label":`Cookie preferences: ${a?.policy?.cookies}`,children:a?.policy?.cookies})]})]})]})},N=({title:a,lists:p,className:n})=>{const{locale:f="us"}=k(),[i,l]=v(!1),[s,b]=v(!1),c=M({query:"(max-width: 1439px)"});w(()=>{b(c)},[c]);const r=`nav-section-${a?.replace(/\s+/g,"-").toLowerCase()}`;return o("div",{className:m("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",n),children:[o("div",{className:"flex items-center justify-between",children:[e(d,{as:"p",html:a,className:"text-xl font-bold leading-[1.2] text-white",id:r}),s&&e("button",{onClick:()=>l(!i),"aria-expanded":i,"aria-controls":r,"aria-label":i?`Collapse ${a}`:`Expand ${a}`,className:"focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black",children:i?e(C,{width:20,height:20}):e(B,{width:20,height:20})})]}),(i&&s||!s)&&e("nav",{className:"mt-4 flex flex-col gap-2",role:"region","aria-labelledby":r,children:p?.map(g=>e(x,{href:u(g?.link,f,"ref=footer"),className:"no-underline",children:e(d,{html:g?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},g?.id))})]})},L=({title:a,apps:p,className:n})=>{const{locale:f="us"}=k();return p?.length?o("div",{className:n,children:[e(d,{html:a,className:" text-xl font-bold leading-[1.2] text-white"}),e("div",{className:"mt-4 flex items-center gap-4",role:"list","aria-label":"Download apps",children:p?.map(i=>o(x,{href:u(i?.link,f),className:"group flex flex-col items-center gap-[6px]",role:"listitem","aria-label":i?.icon?.alt||i?.label||"Download app",children:[e("img",{src:i?.icon?.url,loading:"lazy",alt:i?.icon?.alt,className:"size-10 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100"}),i?.label&&e(d,{html:i?.label,className:"text-xs font-bold text-[#999999] transition-colors duration-200 group-hover:text-white"})]},i?.id))})]}):null},A=({country:a,isMobile:p,className:n,onChangeCountry:f})=>e("div",{className:m("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",n),children:o("button",{onClick:()=>f?.(),className:"flex w-full items-center justify-between focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black","aria-label":`Change country/region, current: ${a?.countryName||a?.country}`,children:[o("div",{className:"group flex items-center gap-2",children:[e(E,{width:20,height:20,className:"shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100","aria-hidden":"true"}),e(d,{as:"span",html:a?.countryName||a?.country,className:"desktop:text-[#B6B6BA] desktop:group-hover:text-white text-base font-bold leading-[1.4] text-white transition-colors duration-200"})]}),p&&e(z,{width:20,height:20,"aria-hidden":"true"})]})});var V=T(P);export{V as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/FooterNavigation/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/FooterNavigation/index.tsx"],
-  "sourcesContent": ["import { useEffect, useMemo, useState } from 'react'\nimport { Text, Container, Link } from '../../components/index.js'\nimport Subscribe from '../Subscribe/index.js'\nimport type { FooterNavigationProps } from './types.js'\nimport { FooterNavigationBlockType } from './types.js'\nimport { AddIcon, SubtractIcon, ArrowRightIcon, CountryIcon } from './icons/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { cn, getLocalizedPath } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst FooterNavigation = ({\n  data: { footer } = {},\n  currentCountry,\n  event,\n  subscribeLoading,\n  classNames,\n  className,\n  moduleIds,\n  ...rest\n}: FooterNavigationProps) => {\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const country = useMemo(() => {\n    return footer?.blocks?.find((block: any) => block?.blockType === FooterNavigationBlockType.Brand)?.country || {}\n  }, [footer])\n\n  return (\n    <footer {...rest} className={cn(classNames?.root, className)}>\n      <Container\n        className={cn(classNames?.child)}\n        childClassName={cn('laptop:py-16 desktop:gap-16 flex flex-col gap-8 bg-black py-8')}\n      >\n        <Text html={footer?.story} className=\"desktop:text-sm text-xs font-bold text-[#6D6D6F]\" />\n        {footer?.blocks?.map((block: any) => {\n          if (block?.blockType === FooterNavigationBlockType.Signup) {\n            return (\n              <MarketingConversion\n                key={block.id}\n                subscribeLoading={subscribeLoading}\n                data={block}\n                onSubmit={event?.signup}\n                id={moduleIds?.marketingConversion}\n              />\n            )\n          }\n          if (block?.blockType === FooterNavigationBlockType.Brand) {\n            return (\n              <FooterBrand\n                key={block?.id}\n                data={block}\n                isMobile={isMobile}\n                event={event}\n                currentCountry={currentCountry}\n                id={moduleIds?.footerBrand}\n              />\n            )\n          }\n          if (block?.blockType === FooterNavigationBlockType.Main) {\n            return (\n              <MainServices\n                key={block.id}\n                data={{ ...block, country }}\n                event={event}\n                isMobile={isMobile}\n                currentCountry={currentCountry}\n                id={moduleIds?.mainServices}\n              />\n            )\n          }\n        })}\n      </Container>\n    </footer>\n  )\n}\n\n/**\n * MarketingConversion \u8425\u9500\u8F6C\u5316\u6A21\u5757\n * @param data\n * @param onSubmit signup\u63D0\u4EA4\u4E8B\u4EF6\n * @returns\n */\nconst MarketingConversion = ({\n  data,\n  onSubmit,\n  subscribeLoading,\n  id = 'footer-marketing-conversion',\n}: {\n  data: any\n  onSubmit?: (_params: any) => void\n  subscribeLoading?: boolean\n  id?: string\n}) => {\n  const { locale = 'us' } = useAiuiContext()\n\n  return (\n    <div\n      id={id}\n      className=\"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#1E2024] px-4 py-8\"\n    >\n      <Subscribe\n        subscribeMetadata={data?.signup}\n        className=\"desktop:flex-[744]\"\n        onSubmit={onSubmit}\n        loading={subscribeLoading}\n      />\n      <div className=\"desktop:hidden h-px w-full bg-[#3D3E3F]\" />\n      <div className=\"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4\">\n        <div className=\"flex-1\">\n          <Text html={data?.enjoy?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.enjoy?.enjoys?.map((enjoyItem: any) => (\n              <div key={enjoyItem?.id} className=\"flex-start flex gap-2\">\n                <img\n                  src={enjoyItem?.icon?.url}\n                  loading=\"lazy\"\n                  alt={enjoyItem?.icon?.alt || ''}\n                  className=\"size-5 shrink-0\"\n                />\n                <Text\n                  html={enjoyItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                />\n              </div>\n            ))}\n          </div>\n        </div>\n        <div className=\"desktop:block hidden w-px bg-[#3D3E3F]\" />\n        <div className=\"flex-1\">\n          <Text html={data?.benefit?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.benefit?.benefits?.map((benefitItem: any) => (\n              <Link\n                href={`${getLocalizedPath(benefitItem?.link, locale)}?ref=footer`}\n                asChild={!benefitItem?.link}\n                key={benefitItem?.id}\n                className=\"no-underline\"\n              >\n                <Text\n                  html={benefitItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/**\n * MainServices \u4E3B\u5BFC\u822A\u4E0E\u670D\u52A1\u6A21\u5757\n * @param services \u670D\u52A1\n * @param mainNav \u4E3B\u5BFC\u822A\n * @param event \u4E8B\u4EF6\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @param currentCountry \u5F53\u524D\u56FD\u5BB6\n * @returns\n */\nconst MainServices = ({\n  data,\n  event,\n  isMobile,\n  currentCountry,\n  id = 'footer-main-services',\n}: {\n  data: any\n  event: any\n  isMobile: boolean\n  currentCountry: any\n  id?: string\n}) => {\n  const { locale = 'us' } = useAiuiContext()\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const { services, mainNav, country } = data\n  const contactSectionId = 'contact-section'\n\n  return (\n    <nav id={id} className=\"flex flex-col gap-8\" aria-label=\"Main navigation\">\n      <div\n        className={cn({\n          'desktop:gap-16 flex': services?.download?.title,\n        })}\n      >\n        <div\n          className={cn('w-full', {\n            'desktop:flex-[1260]': services?.download?.title,\n          })}\n        >\n          <Text html={services?.storeBenefits?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div\n            className={cn('laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2', {\n              'desktop:max-w-[648px]': services?.download?.title,\n            })}\n          >\n            {services?.storeBenefits?.reasons?.map((reasonItem: any) => (\n              <div key={reasonItem?.id} className=\"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2\">\n                <img\n                  src={reasonItem?.icon?.url}\n                  loading=\"lazy\"\n                  alt={reasonItem?.icon?.alt || ''}\n                  className=\"size-5 shrink-0\"\n                />\n                <Link\n                  href={`${getLocalizedPath(reasonItem?.link, locale)}?ref=footer`}\n                  asChild={!reasonItem?.link}\n                  className=\"no-underline\"\n                >\n                  <Text\n                    html={reasonItem?.label}\n                    className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                  />\n                </Link>\n              </div>\n            ))}\n          </div>\n        </div>\n        <DownloadApp\n          className={cn({\n            'desktop:flex-[404] hidden desktop:block': services?.download?.title,\n          })}\n          title={services?.download?.title}\n          apps={services?.download?.apps}\n        />\n      </div>\n      <div className=\"desktop:block hidden h-px bg-[#3D3E3F]\" aria-hidden=\"true\" />\n      <div className=\"desktop:grid grid-cols-4 gap-4\">\n        <MainNavMenu title={mainNav?.products?.title} lists={mainNav?.products?.products} />\n        <MainNavMenu title={mainNav?.explore?.title} lists={mainNav?.explore?.explores} />\n        <MainNavMenu title={mainNav?.support?.title} lists={mainNav?.support?.supports} />\n        <div className=\"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4\">\n          <div className=\"desktop:pb-0 flex items-center justify-between pb-4\">\n            <Text\n              as=\"p\"\n              html={mainNav?.contact?.title}\n              className=\"text-xl font-bold leading-[1.2] text-white\"\n              id={contactSectionId}\n            />\n            {isMobile && (\n              <button\n                onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}\n                aria-expanded={mainNavMenuOpen}\n                aria-controls={contactSectionId}\n                aria-label={mainNavMenuOpen ? 'Collapse contact section' : 'Expand contact section'}\n              >\n                {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n              </button>\n            )}\n          </div>\n          {((mainNavMenuOpen && isMobile) || !isMobile) && (\n            <div\n              className=\"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2\"\n              role=\"region\"\n              aria-labelledby={contactSectionId}\n            >\n              {mainNav?.contact?.contacts?.map((contactItem: any) => (\n                <Link\n                  key={contactItem?.id}\n                  href={contactItem?.link}\n                  className=\"group flex items-start gap-2 no-underline\"\n                >\n                  <img\n                    src={contactItem?.icon?.url}\n                    loading=\"lazy\"\n                    alt={contactItem?.icon?.alt}\n                    className=\"size-5 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n                  />\n                  <Text\n                    html={contactItem?.label}\n                    className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] transition-colors duration-200 group-hover:text-white\"\n                  />\n                </Link>\n              ))}\n            </div>\n          )}\n          <ChangeCountry\n            country={currentCountry || country}\n            className=\"desktop:hidden border-b border-[#3D3E3F]\"\n            isMobile={isMobile}\n            onChangeCountry={event?.country}\n          />\n          <div className=\"desktop:hidden mt-8\">\n            <DownloadApp title={services?.download?.title} apps={services?.download?.apps} />\n          </div>\n          {!!mainNav?.socials?.length && (\n            <div className=\"mt-8 flex items-center gap-2\" role=\"list\" aria-label=\"Social media links\">\n              {mainNav?.socials?.map((socialItem: any) => (\n                <Link\n                  href={`${getLocalizedPath(socialItem?.link, locale)}?ref=footer`}\n                  key={socialItem?.id}\n                  className=\"group\"\n                  role=\"listitem\"\n                  aria-label={socialItem?.icon?.alt || 'Social media'}\n                >\n                  <img\n                    src={socialItem?.icon?.url}\n                    loading=\"lazy\"\n                    alt={socialItem?.icon?.alt}\n                    className=\"size-8 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n                  />\n                </Link>\n              ))}\n            </div>\n          )}\n          <div className=\"mt-4 flex flex-wrap gap-2\" role=\"list\" aria-label=\"Payment methods\">\n            {mainNav?.payment?.map((paymentItem: any) => (\n              <Link\n                href={getLocalizedPath(paymentItem?.link, locale)}\n                asChild={!paymentItem?.link}\n                key={paymentItem?.id}\n                role=\"listitem\"\n                aria-label={paymentItem?.icon?.alt || 'Payment method'}\n              >\n                <img\n                  src={paymentItem?.icon?.url}\n                  loading=\"lazy\"\n                  alt={paymentItem?.icon?.alt || ''}\n                  className=\"h-[28px] w-[44px] shrink-0\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </nav>\n  )\n}\n\nconst FooterBrand = ({\n  data,\n  isMobile,\n  event,\n  currentCountry,\n  id = 'footer-brand',\n}: {\n  data: any\n  isMobile: boolean\n  event: any\n  currentCountry: any\n  id?: string\n}) => {\n  const { locale = 'us' } = useAiuiContext()\n\n  return (\n    <div id={id} className=\"flex flex-col gap-4\">\n      <div className=\"desktop:items-center desktop:flex desktop:gap-4\">\n        <div className=\"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4\">\n          <Link href={`${getLocalizedPath(data?.brand?.link, locale)}?ref=footer`} asChild={!data?.brand?.link}>\n            <Text html={data?.brand?.currentBrand} className=\"cursor-pointer text-[#B6B6BA] hover:text-white\" />\n          </Link>\n          <div className=\"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]\" />\n          <div className=\"desktop:gap-6 flex flex-wrap items-center gap-4\">\n            {data?.brand?.brands?.map((brandItem: any) => (\n              <Link href={`${getLocalizedPath(brandItem?.link, locale)}?ref=footer`} key={brandItem?.id}>\n                <Text html={brandItem?.icon} className=\"text-[#B6B6BA] hover:text-white\" />\n              </Link>\n            ))}\n          </div>\n        </div>\n        <ChangeCountry\n          country={currentCountry || data?.country}\n          className=\"desktop:flex-[316] desktop:block hidden\"\n          isMobile={isMobile}\n          onChangeCountry={event?.country}\n        />\n      </div>\n      <div className=\"h-px bg-[#3D3E3F]\" />\n      <div className=\"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1\">\n        <Text\n          html={data?.copyright?.label}\n          className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n        />\n        <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n          {data?.policy?.policies?.map((policyItem: any) => (\n            <Link\n              href={`${getLocalizedPath(policyItem?.link, locale)}?ref=footer`}\n              key={policyItem?.id}\n              className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white\"\n            >\n              {policyItem?.label}\n            </Link>\n          ))}\n          {data?.policy?.cookies && (\n            <button\n              data-cc=\"show-preferencesModal\"\n              onClick={event?.cookiesSet}\n              className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black\"\n              aria-label={`Cookie preferences: ${data?.policy?.cookies}`}\n            >\n              {data?.policy?.cookies}\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst MainNavMenu = ({ title, lists, className }: { title: string; lists: any[]; className?: string }) => {\n  const { locale = 'us' } = useAiuiContext()\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const sectionId = `nav-section-${title?.replace(/\\s+/g, '-').toLowerCase()}`\n\n  return (\n    <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n      <div className=\"flex items-center justify-between\">\n        <Text as=\"p\" html={title} className=\"text-xl font-bold leading-[1.2] text-white\" id={sectionId} />\n        {isMobile && (\n          <button\n            onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}\n            aria-expanded={mainNavMenuOpen}\n            aria-controls={sectionId}\n            aria-label={mainNavMenuOpen ? `Collapse ${title}` : `Expand ${title}`}\n            className=\"focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black\"\n          >\n            {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n          </button>\n        )}\n      </div>\n      {((mainNavMenuOpen && isMobile) || !isMobile) && (\n        <nav className=\"mt-4 flex flex-col gap-2\" role=\"region\" aria-labelledby={sectionId}>\n          {lists?.map((item: any) => (\n            <Link href={`${getLocalizedPath(item?.link, locale)}?ref=footer`} key={item?.id} className=\"no-underline\">\n              <Text\n                html={item?.label}\n                className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n              />\n            </Link>\n          ))}\n        </nav>\n      )}\n    </div>\n  )\n}\n\n/**\n * DownloadApp \u4E0B\u8F7D\u5E94\u7528\u6A21\u5757\n * @param title\n * @param apps\n * @param className\n * @returns\n */\nconst DownloadApp = ({ title, apps, className }: { title: string; apps: any[]; className?: string }) => {\n  const { locale = 'us' } = useAiuiContext()\n\n  if (!apps?.length) return null\n  return (\n    <div className={className}>\n      <Text html={title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n      <div className=\"mt-4 flex items-center gap-4\" role=\"list\" aria-label=\"Download apps\">\n        {apps?.map((appItem: any) => (\n          <Link\n            key={appItem?.id}\n            href={getLocalizedPath(appItem?.link, locale)}\n            className=\"group flex flex-col items-center gap-[6px]\"\n            role=\"listitem\"\n            aria-label={appItem?.icon?.alt || appItem?.label || 'Download app'}\n          >\n            <img\n              src={appItem?.icon?.url}\n              loading=\"lazy\"\n              alt={appItem?.icon?.alt}\n              className=\"size-10 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n            />\n            {appItem?.label && (\n              <Text\n                html={appItem?.label}\n                className=\"text-xs font-bold text-[#999999] transition-colors duration-200 group-hover:text-white\"\n              />\n            )}\n          </Link>\n        ))}\n      </div>\n    </div>\n  )\n}\n\n/**\n * ChangeCountry \u5207\u6362\u56FD\u5BB6\u6A21\u5757\n * @param data \u6570\u636E\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @returns\n */\nconst ChangeCountry = ({\n  country,\n  isMobile,\n  className,\n  onChangeCountry,\n}: {\n  country: any\n  isMobile: boolean\n  className?: string\n  onChangeCountry?: () => void\n}) => {\n  return (\n    <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n      <button\n        onClick={() => onChangeCountry?.()}\n        className=\"flex w-full items-center justify-between focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black\"\n        aria-label={`Change country/region, current: ${country?.countryName || country?.country}`}\n      >\n        <div className=\"group flex items-center gap-2\">\n          <CountryIcon\n            width={20}\n            height={20}\n            className=\"shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n            aria-hidden=\"true\"\n          />\n          <Text\n            as=\"span\"\n            html={country?.countryName || country?.country}\n            className=\"desktop:text-[#B6B6BA] desktop:group-hover:text-white text-base font-bold leading-[1.4] text-white transition-colors duration-200\"\n          />\n        </div>\n        {isMobile && <ArrowRightIcon width={20} height={20} aria-hidden=\"true\" />}\n      </button>\n    </div>\n  )\n}\n\nexport default withLayout(FooterNavigation)\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { useEffect, useMemo, useState } from 'react'\nimport { Text, Container, Link } from '../../components/index.js'\nimport Subscribe from '../Subscribe/index.js'\nimport type { FooterNavigationProps } from './types.js'\nimport { FooterNavigationBlockType } from './types.js'\nimport { AddIcon, SubtractIcon, ArrowRightIcon, CountryIcon } from './icons/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { cn, getLocalizedPath } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst FooterNavigation = ({\n  data: { footer } = {},\n  currentCountry,\n  event,\n  subscribeLoading,\n  classNames,\n  className,\n  moduleIds,\n  ...rest\n}: FooterNavigationProps) => {\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const country = useMemo(() => {\n    return footer?.blocks?.find((block: any) => block?.blockType === FooterNavigationBlockType.Brand)?.country || {}\n  }, [footer])\n\n  return (\n    <footer {...rest} className={cn(classNames?.root, className)}>\n      <Container\n        className={cn(classNames?.child)}\n        childClassName={cn('laptop:py-16 desktop:gap-16 flex flex-col gap-8 bg-black py-8')}\n      >\n        <Text html={footer?.story} className=\"desktop:text-sm text-xs font-bold text-[#6D6D6F]\" />\n        {footer?.blocks?.map((block: any) => {\n          if (block?.blockType === FooterNavigationBlockType.Signup) {\n            return (\n              <MarketingConversion\n                key={block.id}\n                subscribeLoading={subscribeLoading}\n                data={block}\n                onSubmit={event?.signup}\n                id={moduleIds?.marketingConversion}\n              />\n            )\n          }\n          if (block?.blockType === FooterNavigationBlockType.Brand) {\n            return (\n              <FooterBrand\n                key={block?.id}\n                data={block}\n                isMobile={isMobile}\n                event={event}\n                currentCountry={currentCountry}\n                id={moduleIds?.footerBrand}\n              />\n            )\n          }\n          if (block?.blockType === FooterNavigationBlockType.Main) {\n            return (\n              <MainServices\n                key={block.id}\n                data={{ ...block, country }}\n                event={event}\n                isMobile={isMobile}\n                currentCountry={currentCountry}\n                id={moduleIds?.mainServices}\n              />\n            )\n          }\n        })}\n      </Container>\n    </footer>\n  )\n}\n\n/**\n * MarketingConversion \u8425\u9500\u8F6C\u5316\u6A21\u5757\n * @param data\n * @param onSubmit signup\u63D0\u4EA4\u4E8B\u4EF6\n * @returns\n */\nconst MarketingConversion = ({\n  data,\n  onSubmit,\n  subscribeLoading,\n  id = 'footer-marketing-conversion',\n}: {\n  data: any\n  onSubmit?: (_params: any) => void\n  subscribeLoading?: boolean\n  id?: string\n}) => {\n  const { locale = 'us' } = useAiuiContext()\n\n  return (\n    <div\n      id={id}\n      className=\"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#1E2024] px-4 py-8\"\n    >\n      <Subscribe\n        subscribeMetadata={data?.signup}\n        className=\"desktop:flex-[744]\"\n        onSubmit={onSubmit}\n        loading={subscribeLoading}\n      />\n      <div className=\"desktop:hidden h-px w-full bg-[#3D3E3F]\" />\n      <div className=\"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4\">\n        <div className=\"flex-1\">\n          <Text html={data?.enjoy?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.enjoy?.enjoys?.map((enjoyItem: any) => (\n              <div key={enjoyItem?.id} className=\"flex-start flex gap-2\">\n                <img\n                  src={enjoyItem?.icon?.url}\n                  loading=\"lazy\"\n                  alt={enjoyItem?.icon?.alt || ''}\n                  className=\"size-5 shrink-0\"\n                />\n                <Text\n                  html={enjoyItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                />\n              </div>\n            ))}\n          </div>\n        </div>\n        <div className=\"desktop:block hidden w-px bg-[#3D3E3F]\" />\n        <div className=\"flex-1\">\n          <Text html={data?.benefit?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.benefit?.benefits?.map((benefitItem: any) => (\n              <Link\n                href={getLocalizedPath(benefitItem?.link, locale, 'ref=footer')}\n                asChild={!benefitItem?.link}\n                key={benefitItem?.id}\n                className=\"no-underline\"\n              >\n                <Text\n                  html={benefitItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/**\n * MainServices \u4E3B\u5BFC\u822A\u4E0E\u670D\u52A1\u6A21\u5757\n * @param services \u670D\u52A1\n * @param mainNav \u4E3B\u5BFC\u822A\n * @param event \u4E8B\u4EF6\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @param currentCountry \u5F53\u524D\u56FD\u5BB6\n * @returns\n */\nconst MainServices = ({\n  data,\n  event,\n  isMobile,\n  currentCountry,\n  id = 'footer-main-services',\n}: {\n  data: any\n  event: any\n  isMobile: boolean\n  currentCountry: any\n  id?: string\n}) => {\n  const { locale = 'us' } = useAiuiContext()\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const { services, mainNav, country } = data\n  const contactSectionId = 'contact-section'\n\n  return (\n    <nav id={id} className=\"flex flex-col gap-8\" aria-label=\"Main navigation\">\n      <div\n        className={cn({\n          'desktop:gap-16 flex': services?.download?.title,\n        })}\n      >\n        <div\n          className={cn('w-full', {\n            'desktop:flex-[1260]': services?.download?.title,\n          })}\n        >\n          <Text html={services?.storeBenefits?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div\n            className={cn('laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2', {\n              'desktop:max-w-[648px]': services?.download?.title,\n            })}\n          >\n            {services?.storeBenefits?.reasons?.map((reasonItem: any) => (\n              <div key={reasonItem?.id} className=\"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2\">\n                <img\n                  src={reasonItem?.icon?.url}\n                  loading=\"lazy\"\n                  alt={reasonItem?.icon?.alt || ''}\n                  className=\"size-5 shrink-0\"\n                />\n                <Link\n                  href={getLocalizedPath(reasonItem?.link, locale, 'ref=footer')}\n                  asChild={!reasonItem?.link}\n                  className=\"no-underline\"\n                >\n                  <Text\n                    html={reasonItem?.label}\n                    className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                  />\n                </Link>\n              </div>\n            ))}\n          </div>\n        </div>\n        <DownloadApp\n          className={cn({\n            'desktop:flex-[404] hidden desktop:block': services?.download?.title,\n          })}\n          title={services?.download?.title}\n          apps={services?.download?.apps}\n        />\n      </div>\n      <div className=\"desktop:block hidden h-px bg-[#3D3E3F]\" aria-hidden=\"true\" />\n      <div className=\"desktop:grid grid-cols-4 gap-4\">\n        <MainNavMenu title={mainNav?.products?.title} lists={mainNav?.products?.products} />\n        <MainNavMenu title={mainNav?.explore?.title} lists={mainNav?.explore?.explores} />\n        <MainNavMenu title={mainNav?.support?.title} lists={mainNav?.support?.supports} />\n        <div className=\"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4\">\n          <div className=\"desktop:pb-0 flex items-center justify-between pb-4\">\n            <Text\n              as=\"p\"\n              html={mainNav?.contact?.title}\n              className=\"text-xl font-bold leading-[1.2] text-white\"\n              id={contactSectionId}\n            />\n            {isMobile && (\n              <button\n                onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}\n                aria-expanded={mainNavMenuOpen}\n                aria-controls={contactSectionId}\n                aria-label={mainNavMenuOpen ? 'Collapse contact section' : 'Expand contact section'}\n              >\n                {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n              </button>\n            )}\n          </div>\n          {((mainNavMenuOpen && isMobile) || !isMobile) && (\n            <div\n              className=\"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2\"\n              role=\"region\"\n              aria-labelledby={contactSectionId}\n            >\n              {mainNav?.contact?.contacts?.map((contactItem: any) => (\n                <Link\n                  key={contactItem?.id}\n                  href={contactItem?.link}\n                  className=\"group flex items-start gap-2 no-underline\"\n                >\n                  <img\n                    src={contactItem?.icon?.url}\n                    loading=\"lazy\"\n                    alt={contactItem?.icon?.alt}\n                    className=\"size-5 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n                  />\n                  <Text\n                    html={contactItem?.label}\n                    className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] transition-colors duration-200 group-hover:text-white\"\n                  />\n                </Link>\n              ))}\n            </div>\n          )}\n          <ChangeCountry\n            country={currentCountry || country}\n            className=\"desktop:hidden border-b border-[#3D3E3F]\"\n            isMobile={isMobile}\n            onChangeCountry={event?.country}\n          />\n          <div className=\"desktop:hidden mt-8\">\n            <DownloadApp title={services?.download?.title} apps={services?.download?.apps} />\n          </div>\n          {!!mainNav?.socials?.length && (\n            <div className=\"mt-8 flex items-center gap-2\" role=\"list\" aria-label=\"Social media links\">\n              {mainNav?.socials?.map((socialItem: any) => (\n                <Link\n                  href={getLocalizedPath(socialItem?.link, locale, 'ref=footer')}\n                  key={socialItem?.id}\n                  className=\"group\"\n                  role=\"listitem\"\n                  aria-label={socialItem?.icon?.alt || 'Social media'}\n                >\n                  <img\n                    src={socialItem?.icon?.url}\n                    loading=\"lazy\"\n                    alt={socialItem?.icon?.alt}\n                    className=\"size-8 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n                  />\n                </Link>\n              ))}\n            </div>\n          )}\n          <div className=\"mt-4 flex flex-wrap gap-2\" role=\"list\" aria-label=\"Payment methods\">\n            {mainNav?.payment?.map((paymentItem: any) => (\n              <Link\n                href={getLocalizedPath(paymentItem?.link, locale)}\n                asChild={!paymentItem?.link}\n                key={paymentItem?.id}\n                role=\"listitem\"\n                aria-label={paymentItem?.icon?.alt || 'Payment method'}\n              >\n                <img\n                  src={paymentItem?.icon?.url}\n                  loading=\"lazy\"\n                  alt={paymentItem?.icon?.alt || ''}\n                  className=\"h-[28px] w-[44px] shrink-0\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </nav>\n  )\n}\n\nconst FooterBrand = ({\n  data,\n  isMobile,\n  event,\n  currentCountry,\n  id = 'footer-brand',\n}: {\n  data: any\n  isMobile: boolean\n  event: any\n  currentCountry: any\n  id?: string\n}) => {\n  const { locale = 'us' } = useAiuiContext()\n\n  return (\n    <div id={id} className=\"flex flex-col gap-4\">\n      <div className=\"desktop:items-center desktop:flex desktop:gap-4\">\n        <div className=\"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4\">\n          <Link href={getLocalizedPath(data?.brand?.link, locale, 'ref=footer')} asChild={!data?.brand?.link}>\n            <Text html={data?.brand?.currentBrand} className=\"cursor-pointer text-[#B6B6BA] hover:text-white\" />\n          </Link>\n          <div className=\"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]\" />\n          <div className=\"desktop:gap-6 flex flex-wrap items-center gap-4\">\n            {data?.brand?.brands?.map((brandItem: any) => (\n              <Link href={getLocalizedPath(brandItem?.link, locale, 'ref=footer')} key={brandItem?.id}>\n                <Text html={brandItem?.icon} className=\"text-[#B6B6BA] hover:text-white\" />\n              </Link>\n            ))}\n          </div>\n        </div>\n        <ChangeCountry\n          country={currentCountry || data?.country}\n          className=\"desktop:flex-[316] desktop:block hidden\"\n          isMobile={isMobile}\n          onChangeCountry={event?.country}\n        />\n      </div>\n      <div className=\"h-px bg-[#3D3E3F]\" />\n      <div className=\"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1\">\n        <Text\n          html={data?.copyright?.label}\n          className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n        />\n        <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n          {data?.policy?.policies?.map((policyItem: any) => (\n            <Link\n              href={getLocalizedPath(policyItem?.link, locale, 'ref=footer')}\n              key={policyItem?.id}\n              className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white\"\n            >\n              {policyItem?.label}\n            </Link>\n          ))}\n          {data?.policy?.cookies && (\n            <button\n              data-cc=\"show-preferencesModal\"\n              onClick={event?.cookiesSet}\n              className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black\"\n              aria-label={`Cookie preferences: ${data?.policy?.cookies}`}\n            >\n              {data?.policy?.cookies}\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst MainNavMenu = ({ title, lists, className }: { title: string; lists: any[]; className?: string }) => {\n  const { locale = 'us' } = useAiuiContext()\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const sectionId = `nav-section-${title?.replace(/\\s+/g, '-').toLowerCase()}`\n\n  return (\n    <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n      <div className=\"flex items-center justify-between\">\n        <Text as=\"p\" html={title} className=\"text-xl font-bold leading-[1.2] text-white\" id={sectionId} />\n        {isMobile && (\n          <button\n            onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}\n            aria-expanded={mainNavMenuOpen}\n            aria-controls={sectionId}\n            aria-label={mainNavMenuOpen ? `Collapse ${title}` : `Expand ${title}`}\n            className=\"focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black\"\n          >\n            {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n          </button>\n        )}\n      </div>\n      {((mainNavMenuOpen && isMobile) || !isMobile) && (\n        <nav className=\"mt-4 flex flex-col gap-2\" role=\"region\" aria-labelledby={sectionId}>\n          {lists?.map((item: any) => (\n            <Link href={getLocalizedPath(item?.link, locale, 'ref=footer')} key={item?.id} className=\"no-underline\">\n              <Text\n                html={item?.label}\n                className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n              />\n            </Link>\n          ))}\n        </nav>\n      )}\n    </div>\n  )\n}\n\n/**\n * DownloadApp \u4E0B\u8F7D\u5E94\u7528\u6A21\u5757\n * @param title\n * @param apps\n * @param className\n * @returns\n */\nconst DownloadApp = ({ title, apps, className }: { title: string; apps: any[]; className?: string }) => {\n  const { locale = 'us' } = useAiuiContext()\n\n  if (!apps?.length) return null\n  return (\n    <div className={className}>\n      <Text html={title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n      <div className=\"mt-4 flex items-center gap-4\" role=\"list\" aria-label=\"Download apps\">\n        {apps?.map((appItem: any) => (\n          <Link\n            key={appItem?.id}\n            href={getLocalizedPath(appItem?.link, locale)}\n            className=\"group flex flex-col items-center gap-[6px]\"\n            role=\"listitem\"\n            aria-label={appItem?.icon?.alt || appItem?.label || 'Download app'}\n          >\n            <img\n              src={appItem?.icon?.url}\n              loading=\"lazy\"\n              alt={appItem?.icon?.alt}\n              className=\"size-10 shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n            />\n            {appItem?.label && (\n              <Text\n                html={appItem?.label}\n                className=\"text-xs font-bold text-[#999999] transition-colors duration-200 group-hover:text-white\"\n              />\n            )}\n          </Link>\n        ))}\n      </div>\n    </div>\n  )\n}\n\n/**\n * ChangeCountry \u5207\u6362\u56FD\u5BB6\u6A21\u5757\n * @param data \u6570\u636E\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @returns\n */\nconst ChangeCountry = ({\n  country,\n  isMobile,\n  className,\n  onChangeCountry,\n}: {\n  country: any\n  isMobile: boolean\n  className?: string\n  onChangeCountry?: () => void\n}) => {\n  return (\n    <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n      <button\n        onClick={() => onChangeCountry?.()}\n        className=\"flex w-full items-center justify-between focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-black\"\n        aria-label={`Change country/region, current: ${country?.countryName || country?.country}`}\n      >\n        <div className=\"group flex items-center gap-2\">\n          <CountryIcon\n            width={20}\n            height={20}\n            className=\"shrink-0 opacity-70 transition-opacity duration-200 group-hover:opacity-100\"\n            aria-hidden=\"true\"\n          />\n          <Text\n            as=\"span\"\n            html={country?.countryName || country?.country}\n            className=\"desktop:text-[#B6B6BA] desktop:group-hover:text-white text-base font-bold leading-[1.4] text-white transition-colors duration-200\"\n          />\n        </div>\n        {isMobile && <ArrowRightIcon width={20} height={20} aria-hidden=\"true\" />}\n      </button>\n    </div>\n  )\n}\n\nexport default withLayout(FooterNavigation)\n"],
+  "mappings": "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",
   "names": ["jsx", "jsxs", "useEffect", "useMemo", "useState", "Text", "Container", "Link", "Subscribe", "FooterNavigationBlockType", "AddIcon", "SubtractIcon", "ArrowRightIcon", "CountryIcon", "useMediaQuery", "cn", "getLocalizedPath", "useAiuiContext", "withLayout", "FooterNavigation", "footer", "currentCountry", "event", "subscribeLoading", "classNames", "className", "moduleIds", "rest", "isMobile", "setIsMobile", "mediaQuery", "country", "block", "MarketingConversion", "FooterBrand", "MainServices", "data", "onSubmit", "id", "locale", "enjoyItem", "benefitItem", "mainNavMenuOpen", "setMainNavMenuOpen", "services", "mainNav", "contactSectionId", "reasonItem", "DownloadApp", "MainNavMenu", "contactItem", "ChangeCountry", "socialItem", "paymentItem", "brandItem", "policyItem", "title", "lists", "sectionId", "item", "apps", "appItem", "onChangeCountry", "FooterNavigation_default"]
 }

package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import{Text as s,Button as _,Grid as Y,GridItem as q,Picture as z,Heading as Z}from"../../../../../components/index.js";import{useBizProductContext as A}from"../../../BizProductProvider.js";import{useComponentData as ee}from"../../../hooks/useComponentData.js";import{useEffect as te,useMemo as S,useState as ae}from"react";import{formatPrice as y}from"../../../utils/index.js";import{useAiuiContext as T}from"../../../../AiuiProvider/index.js";import J from"decimal.js";import{replaceTemplate as oe}from"../../../utils/textFormat.js";import{withLayout as ne}from"../../../../../shared/Styles.js";import{ExposureDetector as le}from"../../../../../components/index.js";import{gaTrack as ie}from"../../../../../shared/track.js";import re from"../../CartActionButtons/index.js";const ce=()=>{const{locale:m="us",copyWriting:a}=T(),{product:x,variant:n,finalPrice:g,comparePrice:f,coupon:P,selectedOptions:d,selectedVariants:v,totalSavings:i,onAddToCart:D,onBuyNow:E,savingDetail:b,checkedBundle:C,joinedRecommendBuyProducts:t,setJoinedRecommendBuyProducts:p,setSavingDetail:j,addToCartLoading:O,buyNowLoading:L,profile:G,addOrder:$,setAddOrder:w}=A(),B=ee("ProductSummary")??{},[F]=v,I=S(()=>{const r=C?.variants.find(N=>N.variant.sku===F?.sku),l=new J(F?.price?.amount||0).minus(r?.price||F?.price?.amount).toNumber();let u=new J(F?.price?.amount||0);G?.email&&(u=u.minus(b?.member||0));const h=u.minus(b?.coupon).minus(l).toNumber();return parseFloat(h.toFixed(2))},[F,C,G,b?.member,b?.coupon]),{bundleVariant:V,giftVariant:R,exchangeVariant:W}=se()||{},[c,k]=ae();te(()=>{k({bundle:t.bundle?.value?void 0:V,gift:t.gift?.value?void 0:R,exchange:t.exchange?.value?void 0:W})},[V,R,W,t]);const M=S(()=>{const r=[];return $&&$.forEach((l,u)=>{t[l]?.value&&r.push({type:l,key:`${l}-${u}`})}),r},[$,t]),U=S(()=>{const r=d?.quantity||"",l=d?.color||d?.colour||d?.couleur||"";return`${r&&l?`${r} | ${l}`:r||l}`},[d?.quantity,d?.color,d?.colour,d?.couleur]),X=S(()=>{const{image_1920:r,image_1440:l,image_1024:u,image_768:h,image_390:N}=B?.thumbnail||{};return(B?.thumbnail?`${r} 1920, ${l} 1440, ${u} 1024, ${h} 768, ${N} 390`:n.image?.url)||n.image?.url},[B?.thumbnail,n.image?.url]);return n.availableForSale?e("div",{className:"ipc-product-summary laptop:px-16 laptop-md:px-0 laptop-md:mt-[96px] lg-desktop:mt-[128px] mt-16",children:e("div",{className:"laptop:rounded-2xl bg-[#F5F5F7]",children:o(Y,{className:"tablet:p-8 tablet:!pb-0 px-4 pt-6",children:[o(q,{className:"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4",children:[e(Z,{className:"lg-desktop:text-[48px] laptop:text-[32px] laptop-md:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]",html:B?.readyWant?.replace?.("{title}",x?.title)}),e("div",{className:"",children:e(z,{source:X,className:"lg-desktop:aspect-[644/320]  laptop-md:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]",imgClassName:"object-cover h-full"})})]}),o(q,{className:"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6",children:[o("div",{children:[o("div",{className:"flex flex-col gap-4",children:[e(le,{exposureKey:"listing_selector",onExposure:()=>{ie({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${n.sku}`,component_type:"image",component_name:"listing_selector",position:1}})},children:o("div",{className:"flex items-center justify-between gap-6",children:[o("div",{className:"flex items-center gap-4",children:[e(z,{source:n.image?.url||x?.images?.[0]?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),o("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:x.title}),e(s,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:U})]})]}),o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:y({amount:I,currencyCode:n.price.currencyCode,locale:m})}),I<n?.price?.amount&&e(s,{className:"laptop-md:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:n?.price?.amount,currencyCode:n.price.currencyCode,locale:m})})]})]})}),M.map(({type:r,key:l})=>r==="gift"&&t?.gift?.value?e(H,{giftOperation:u=>{p?.({...t,gift:{value:void 0,canOperate:!0}}),k?.({...c,gift:u}),w?.(h=>h.filter(N=>N!=="gift"))},status:!!t?.gift,gift:t?.gift?.value,canOperate:t?.gift?.canOperate},l):r==="bundle"&&t?.bundle?.value?e(Q,{bundleOperation:u=>{p?.({...t,bundle:{value:void 0,canOperate:!0}}),k?.({...c,bundle:u}),w?.(h=>h.filter(N=>N!=="bundle"))},status:!!t?.bundle,bundleListItem:t?.bundle?.value,canOperate:t?.bundle?.canOperate},l):r==="exchange"&&t?.exchange?.value?e(K,{exchangeOperation:u=>{p?.({...t,exchange:{value:void 0,canOperate:!0}}),k?.({...c,exchange:u}),w?.(h=>h.filter(N=>N!=="exchange"))},status:!!t?.exchange,canOperate:t?.exchange?.canOperate,exchange:t?.exchange?.value},l):null)]}),(c?.bundle||c?.gift||c?.exchange)&&o("div",{className:"laptop-md:mt-8 mt-6",children:[e(s,{className:"laptop-md:text-[18px] text-sm font-bold",html:B?.recommendBuy}),o("div",{className:"laptop-md:gap-4 mt-4 flex flex-col gap-6",children:[c?.exchange&&e(K,{exchangeOperation:r=>{p?.({...t,exchange:{value:r,canOperate:!0}}),k?.({...c,exchange:void 0}),w?.(l=>[...l,"exchange"])},canOperate:t?.exchange?.canOperate,status:!c?.exchange,exchange:c?.exchange}),c?.bundle&&e(Q,{bundleOperation:r=>{j?.({...b,exchangePurchase:0}),p?.({...t,bundle:{value:r,canOperate:!0}}),k?.({...c,bundle:void 0}),w?.(l=>[...l,"bundle"])},canOperate:t?.bundle?.canOperate,status:!c?.bundle,bundleListItem:c?.bundle}),c?.gift&&e(H,{giftOperation:r=>{p?.({...t,gift:{value:r,canOperate:!0}}),k?.({...c,gift:void 0}),w?.(l=>[...l,"gift"])},canOperate:t?.gift?.canOperate,status:!c?.gift,gift:c?.gift})]})]})]}),o("div",{className:"text-right",children:[e(s,{className:"laptop:text-xl laptop-md:text-2xl text-right font-bold",html:`${oe(a?.totalPrice||"",{amount:y({amount:parseFloat(g.toFixed(2)),currencyCode:n.price.currencyCode,locale:m})})}`}),i>0&&e(s,{className:"laptop:text-xl laptop-md:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through",html:y({amount:f,currencyCode:n.price.currencyCode,locale:m})}),e("div",{className:"mt-4 flex justify-end gap-3",children:e(re,{availableForSale:n.availableForSale,addToCartText:a?.addToCart,buyNowText:a?.shopNow,addToCartLoading:O,buyNowLoading:L,addToCartClassName:"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2",buyNowClassName:"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2",onAddToCart:D,onBuyNow:E})})]})]})]})})}):null},se=()=>{const{bundle:m,variant:a,checkedBundle:x,freeGift:n,checkedGift:g,exchangePurchase:f,checkedExchangePurchase:P}=A();let d,v,i;const{bundleList:D}=m||{},{giftList:E=[]}=n||{},{giftList:b=[]}=f||{},C=D?.filter(O=>O.variants.slice(1,O.variants.length).every(L=>L.variant.availableForSale))||[],[t]=C;d=x||t;const[p]=E?.filter(O=>O.availableForSale)??[];v=g||p;const[j]=b?.filter(O=>O.availableForSale)??[];return i=P||j,{bundleVariant:d,giftVariant:v,exchangeVariant:i}},Q=({bundleOperation:m,bundleListItem:a,canOperate:x,status:n})=>{const{locale:g="us",copyWriting:f}=T(),{variant:P,setCheckedBundle:d}=A(),v=a?.variants.filter(i=>i.variant.sku!==P.sku);return e("div",{className:"",children:v?.map(i=>o("div",{className:"flex items-center justify-between gap-4",children:[o("div",{className:"flex items-center gap-4",children:[e(z,{source:i?.variant?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),e("div",{className:"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]",children:e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold",html:i.variant.product.title})})]}),o("div",{className:"flex flex-col items-end justify-center gap-1",children:[!!a&&o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:y({amount:i?.price||0,locale:g,currencyCode:i.variant?.price?.currencyCode||""})}),i.price<i.variant.price.amount&&e(s,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:i.variant.price.amount||0,locale:g,currencyCode:i.variant?.price?.currencyCode||""})})]}),x&&e(_,{size:"icon",variant:"link",onClick:()=>{d?.(n?void 0:a),m?.(a)},className:"size-auto shrink-0 underline",children:n?f?.remove:f?.add})]})]},i.variant.id))})},H=({giftOperation:m,gift:a,status:x,canOperate:n})=>{const{locale:g="us",copyWriting:f}=T(),{freeGift:P,setCheckedGift:d}=A(),{freeLabel:v}=P||{},{options:i}=a||{},D=S(()=>{const E=i?.find(p=>p.name==="color"||p.name==="colour"||p.name==="couleur")||{},b=i?.find(p=>p.name==="quantity")||{},C=E?E.values?.[0]?.label:"",t=b?b.values?.[0]?.label:"";return`${C&&t?t+" | "+C:t||C} | ${v}`},[v,i]);return o("div",{className:"flex items-center justify-between gap-6",children:[o("div",{className:"flex items-center gap-4",children:[e(z,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),o("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:D})]})]}),o("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:v}),e(s,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:a.price.amount,locale:g,currencyCode:a.price.currencyCode})})]}),n&&e(_,{size:"icon",variant:"link",onClick:()=>{d?.(x?void 0:a),m(a)},className:"size-auto shrink-0 underline",children:x?f?.remove:f?.add})]})]})},K=({exchangeOperation:m,exchange:a,canOperate:x,status:n})=>{const{locale:g="us",copyWriting:f}=T(),{setCheckedExchangePurchase:P}=A();return o("div",{className:"flex items-center justify-between gap-6",children:[o("div",{className:"flex items-center gap-4",children:[e(z,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),o("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]"})]})]}),o("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:y({amount:a.finalPrice?.amount||0,locale:g,currencyCode:a.price.currencyCode})}),e(s,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:y({amount:a.price?.amount||0,locale:g,currencyCode:a.price.currencyCode})})]}),x&&e(_,{size:"icon",variant:"link",onClick:()=>{P?.(n?void 0:a),m(a)},className:"size-auto shrink-0 underline",children:n?f?.remove:f?.add})]})]})};var Oe=ne(ce);export{Oe as default};
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import{Text as s,Button as _,Grid as ee,GridItem as J,Picture as A,Heading as te}from"../../../../../components/index.js";import{useBizProductContext as S}from"../../../BizProductProvider.js";import{useComponentData as ae}from"../../../hooks/useComponentData.js";import{useEffect as oe,useMemo as T,useState as ne}from"react";import{formatPrice as N}from"../../../utils/index.js";import{useAiuiContext as j}from"../../../../AiuiProvider/index.js";import Q from"decimal.js";import{replaceTemplate as le}from"../../../utils/textFormat.js";import{withLayout as re}from"../../../../../shared/Styles.js";import{ExposureDetector as ie}from"../../../../../components/index.js";import{gaTrack as ce}from"../../../../../shared/track.js";import se from"../../CartActionButtons/index.js";const de=()=>{const{locale:m="us",copyWriting:a,trackingData:g}=j(),{product:p,variant:n,finalPrice:x,comparePrice:v,coupon:k,selectedOptions:d,selectedVariants:r,totalSavings:B,onAddToCart:w,onBuyNow:E,savingDetail:f,checkedBundle:y,joinedRecommendBuyProducts:t,setJoinedRecommendBuyProducts:P,setSavingDetail:C,addToCartLoading:L,buyNowLoading:U,profile:G,addOrder:$,setAddOrder:D}=S(),I=g?.showComparePrice??!0,F=ae("ProductSummary")??{},[z]=r,V=T(()=>{const i=y?.variants.find(h=>h.variant.sku===z?.sku),l=new Q(z?.price?.amount||0).minus(i?.price||z?.price?.amount).toNumber();let u=new Q(z?.price?.amount||0);G?.email&&(u=u.minus(f?.member||0));const b=u.minus(f?.coupon).minus(l).toNumber();return parseFloat(b.toFixed(2))},[z,y,G,f?.member,f?.coupon]),{bundleVariant:R,giftVariant:W,exchangeVariant:q}=pe()||{},[c,O]=ne();oe(()=>{O({bundle:t.bundle?.value?void 0:R,gift:t.gift?.value?void 0:W,exchange:t.exchange?.value?void 0:q})},[R,W,q,t]);const X=T(()=>{const i=[];return $&&$.forEach((l,u)=>{t[l]?.value&&i.push({type:l,key:`${l}-${u}`})}),i},[$,t]),Y=T(()=>{const i=d?.quantity||"",l=d?.color||d?.colour||d?.couleur||"";return`${i&&l?`${i} | ${l}`:i||l}`},[d?.quantity,d?.color,d?.colour,d?.couleur]),Z=T(()=>{const{image_1920:i,image_1440:l,image_1024:u,image_768:b,image_390:h}=F?.thumbnail||{};return(F?.thumbnail?`${i} 1920, ${l} 1440, ${u} 1024, ${b} 768, ${h} 390`:n.image?.url)||n.image?.url},[F?.thumbnail,n.image?.url]);return n.availableForSale?e("div",{className:"ipc-product-summary laptop:px-16 laptop-md:px-0 laptop-md:mt-[96px] lg-desktop:mt-[128px] mt-16",children:e("div",{className:"laptop:rounded-2xl bg-[#F5F5F7]",children:o(ee,{className:"tablet:p-8 tablet:!pb-0 px-4 pt-6",children:[o(J,{className:"laptop:col-start-1 laptop:col-span-5 col-span-12 flex flex-col justify-between gap-4",children:[e(te,{className:"lg-desktop:text-[48px] laptop:text-[32px] laptop-md:text-[40px] mb-4 text-[24px] font-bold leading-none [&>span]:text-[#D1D1D1]",html:F?.readyWant?.replace?.("{title}",p?.title)}),e("div",{className:"",children:e(A,{source:Z,className:"lg-desktop:aspect-[644/320]  laptop-md:aspect-[503/270] laptop:aspect-[332/190] tablet:aspect-[704/380] aspect-[358/190]",imgClassName:"object-cover h-full"})})]}),o(J,{className:"tablet:pb-8 laptop:col-start-7 laptop:mt-0 laptop:col-span-6 col-span-12 mt-8 flex flex-col justify-between gap-6 pb-6",children:[o("div",{children:[o("div",{className:"flex flex-col gap-4",children:[e(ie,{exposureKey:"listing_selector",onExposure:()=>{ce({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${n.sku}`,component_type:"image",component_name:"listing_selector",position:1}})},children:o("div",{className:"flex items-center justify-between gap-6",children:[o("div",{className:"flex items-center gap-4",children:[e(A,{source:n.image?.url||p?.images?.[0]?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),o("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:p.title}),e(s,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:Y})]})]}),o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:N({amount:V,currencyCode:n.price.currencyCode,locale:m})}),I&&V<n?.price?.amount&&e(s,{className:"laptop-md:text-2xl laptop:text-xl text-base font-bold text-[#6D6D6F] line-through",html:N({amount:n?.price?.amount,currencyCode:n.price.currencyCode,locale:m})})]})]})}),X.map(({type:i,key:l})=>i==="gift"&&t?.gift?.value?e(K,{giftOperation:u=>{P?.({...t,gift:{value:void 0,canOperate:!0}}),O?.({...c,gift:u}),D?.(b=>b.filter(h=>h!=="gift"))},status:!!t?.gift,gift:t?.gift?.value,canOperate:t?.gift?.canOperate},l):i==="bundle"&&t?.bundle?.value?e(H,{bundleOperation:u=>{P?.({...t,bundle:{value:void 0,canOperate:!0}}),O?.({...c,bundle:u}),D?.(b=>b.filter(h=>h!=="bundle"))},status:!!t?.bundle,bundleListItem:t?.bundle?.value,canOperate:t?.bundle?.canOperate},l):i==="exchange"&&t?.exchange?.value?e(M,{exchangeOperation:u=>{P?.({...t,exchange:{value:void 0,canOperate:!0}}),O?.({...c,exchange:u}),D?.(b=>b.filter(h=>h!=="exchange"))},status:!!t?.exchange,canOperate:t?.exchange?.canOperate,exchange:t?.exchange?.value},l):null)]}),(c?.bundle||c?.gift||c?.exchange)&&o("div",{className:"laptop-md:mt-8 mt-6",children:[e(s,{className:"laptop-md:text-[18px] text-sm font-bold",html:F?.recommendBuy}),o("div",{className:"laptop-md:gap-4 mt-4 flex flex-col gap-6",children:[c?.exchange&&e(M,{exchangeOperation:i=>{P?.({...t,exchange:{value:i,canOperate:!0}}),O?.({...c,exchange:void 0}),D?.(l=>[...l,"exchange"])},canOperate:t?.exchange?.canOperate,status:!c?.exchange,exchange:c?.exchange}),c?.bundle&&e(H,{bundleOperation:i=>{C?.({...f,exchangePurchase:0}),P?.({...t,bundle:{value:i,canOperate:!0}}),O?.({...c,bundle:void 0}),D?.(l=>[...l,"bundle"])},canOperate:t?.bundle?.canOperate,status:!c?.bundle,bundleListItem:c?.bundle}),c?.gift&&e(K,{giftOperation:i=>{P?.({...t,gift:{value:i,canOperate:!0}}),O?.({...c,gift:void 0}),D?.(l=>[...l,"gift"])},canOperate:t?.gift?.canOperate,status:!c?.gift,gift:c?.gift})]})]})]}),o("div",{className:"text-right",children:[e(s,{className:"laptop:text-xl laptop-md:text-2xl text-right font-bold",html:`${le(a?.totalPrice||"",{amount:N({amount:parseFloat(x.toFixed(2)),currencyCode:n.price.currencyCode,locale:m})})}`}),I&&B>0&&e(s,{className:"laptop:text-xl laptop-md:text-2xl ml-1 text-base font-bold text-[#6D6D6F] line-through",html:N({amount:v,currencyCode:n.price.currencyCode,locale:m})}),e("div",{className:"mt-4 flex justify-end gap-3",children:e(se,{availableForSale:n.availableForSale,addToCartText:a?.addToCart,buyNowText:a?.shopNow,addToCartLoading:L,buyNowLoading:U,addToCartClassName:"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2",buyNowClassName:"tablet:w-auto laptop:w-1/2 laptop-md:w-auto w-1/2",onAddToCart:w,onBuyNow:E})})]})]})]})})}):null},pe=()=>{const{bundle:m,variant:a,checkedBundle:g,freeGift:p,checkedGift:n,exchangePurchase:x,checkedExchangePurchase:v}=S();let k,d,r;const{bundleList:B}=m||{},{giftList:w=[]}=p||{},{giftList:E=[]}=x||{},f=B?.filter(C=>C.variants.slice(1,C.variants.length).every(L=>L.variant.availableForSale))||[],[y]=f;k=g||y;const[t]=w?.filter(C=>C.availableForSale)??[];d=n||t;const[P]=E?.filter(C=>C.availableForSale)??[];return r=v||P,{bundleVariant:k,giftVariant:d,exchangeVariant:r}},H=({bundleOperation:m,bundleListItem:a,canOperate:g,status:p})=>{const{locale:n="us",copyWriting:x}=j(),{variant:v,setCheckedBundle:k}=S(),d=a?.variants.filter(r=>r.variant.sku!==v.sku);return e("div",{className:"",children:d?.map(r=>o("div",{className:"flex items-center justify-between gap-4",children:[o("div",{className:"flex items-center gap-4",children:[e(A,{source:r?.variant?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),e("div",{className:"tablet:max-w-none line-clamp-2 flex max-w-[178px] flex-col gap-[6px]",children:e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] text-[14px] font-bold",html:r.variant.product.title})})]}),o("div",{className:"flex flex-col items-end justify-center gap-1",children:[!!a&&o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:N({amount:r?.price||0,locale:n,currencyCode:r.variant?.price?.currencyCode||""})}),r.price<r.variant.price.amount&&e(s,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:N({amount:r.variant.price.amount||0,locale:n,currencyCode:r.variant?.price?.currencyCode||""})})]}),g&&e(_,{size:"icon",variant:"link",onClick:()=>{k?.(p?void 0:a),m?.(a)},className:"size-auto shrink-0 underline",children:p?x?.remove:x?.add})]})]},r.variant.id))})},K=({giftOperation:m,gift:a,status:g,canOperate:p})=>{const{locale:n="us",copyWriting:x}=j(),{freeGift:v,setCheckedGift:k}=S(),{freeLabel:d}=v||{},{options:r}=a||{},B=T(()=>{const w=r?.find(t=>t.name==="color"||t.name==="colour"||t.name==="couleur")||{},E=r?.find(t=>t.name==="quantity")||{},f=w?w.values?.[0]?.label:"",y=E?E.values?.[0]?.label:"";return`${f&&y?y+" | "+f:y||f} | ${d}`},[d,r]);return o("div",{className:"flex items-center justify-between gap-6",children:[o("div",{className:"flex items-center gap-4",children:[e(A,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),o("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]",html:B})]})]}),o("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:d}),e(s,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:N({amount:a.price.amount,locale:n,currencyCode:a.price.currencyCode})})]}),p&&e(_,{size:"icon",variant:"link",onClick:()=>{k?.(g?void 0:a),m(a)},className:"size-auto shrink-0 underline",children:g?x?.remove:x?.add})]})]})},M=({exchangeOperation:m,exchange:a,canOperate:g,status:p})=>{const{locale:n="us",copyWriting:x}=j(),{setCheckedExchangePurchase:v}=S();return o("div",{className:"flex items-center justify-between gap-6",children:[o("div",{className:"flex items-center gap-4",children:[e(A,{source:a?.image?.url,className:"laptop:size-12 lg-desktop:size-16 border-1 size-10 shrink-0 rounded-lg border-[#E4E5E6] bg-[#EAEAEC] object-cover p-2"}),o("div",{className:"tablet:max-w-none flex max-w-[178px] flex-col gap-[6px]",children:[e(s,{className:"laptop-md:text-[16px] lg-desktop:text-[18px] line-clamp-2 text-[14px] font-bold",html:a?.product?.title}),e(s,{className:"laptop:text-[14px] laptop-md:text-[18px] text-[12px] font-bold text-[#6D6D6F]"})]})]}),o("div",{className:"flex flex-col items-end justify-center gap-2",children:[!!a&&o("div",{className:"flex items-center gap-1",children:[e(s,{className:"laptop-md:text-2xl text-base font-bold",html:N({amount:a.finalPrice?.amount||0,locale:n,currencyCode:a.price.currencyCode})}),e(s,{className:"laptop-md:text-2xl text-base font-bold text-[#6D6D6F] line-through",html:N({amount:a.price?.amount||0,locale:n,currencyCode:a.price.currencyCode})})]}),g&&e(_,{size:"icon",variant:"link",onClick:()=>{v?.(p?void 0:a),m(a)},className:"size-auto shrink-0 underline",children:p?x?.remove:x?.add})]})]})};var we=re(de);export{we as default};
 //# sourceMappingURL=index.js.map