npm - @anker-in/headless-ui - Versions diffs - 1.2.2 → 1.2.3-alpha.1778583232121 - Mend

@anker-in/headless-ui 1.2.2 → 1.2.3-alpha.1778583232121

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 (323) hide show

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ProductNav/ProductNav.tsx"],
-  "sourcesContent": ["'use client'\nimport { useState, useEffect, useCallback, forwardRef, useImperativeHandle, useRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Button, Text } from '../../components/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { ProductNavProps } from './types.js'\nimport * as Popover from '@radix-ui/react-popover'\n\nconst componentType = 'navigation'\nconst componentName = 'product_nav'\n\nconst ChevronDownIcon = (props: React.SVGProps<SVGSVGElement>) => {\n  return (\n    <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n      <path\n        d=\"M5 7.5L10 12.5L15 7.5\"\n        stroke=\"currentColor\"\n        strokeWidth=\"1.66667\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  )\n}\n\nconst ProductNav = forwardRef<HTMLDivElement, ProductNavProps>(\n  ({ className = '', data, id, onAnchorClick, scrollOffsetExtra = 0 }, ref) => {\n    const { tabLinks = [], anchorList = [], textLink, buyBtn, theme = 'light' } = data || {}\n    const [activeAnchorId, setActiveAnchorId] = useState('')\n    const innerRef = useRef<HTMLDivElement>(null)\n    const isScrollingRef = useRef(false) // \u6807\u8BB0\u662F\u5426\u6B63\u5728\u7A0B\u5E8F\u5316\u6EDA\u52A8\u4E2D\n    const targetAnchorIdRef = useRef<string>('') // \u8BB0\u5F55\u70B9\u51FB\u76EE\u6807\u951A\u70B9\n    const scrollEndTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null) // \u6EDA\u52A8\u7ED3\u675F\u68C0\u6D4B\u5B9A\u65F6\u5668\n    const anchorPositionsRef = useRef<Map<string, number>>(new Map()) // \u7F13\u5B58\u951A\u70B9\u539F\u59CB\u4F4D\u7F6E\n\n    useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n    useExposure(innerRef, {\n      componentType,\n      componentName,\n    })\n\n    // \u7F13\u5B58\u6240\u6709\u951A\u70B9\u7684\u7EDD\u5BF9\u4F4D\u7F6E\uFF08\u6EDA\u52A8\u5230\u9876\u90E8\u540E\u8BA1\u7B97\uFF0C\u907F\u514D sticky \u5F71\u54CD\uFF09\n    const updateAnchorPositions = useCallback(() => {\n      if (anchorList.length === 0) return\n\n      const originalScrollY = window.scrollY\n      window.scrollTo({ top: 0, behavior: 'instant' as ScrollBehavior })\n\n      requestAnimationFrame(() => {\n        const positions = new Map<string, number>()\n        anchorList.forEach(anchor => {\n          const element = document.getElementById(anchor.id)\n          if (element) {\n            const rect = element.getBoundingClientRect()\n            positions.set(anchor.id, rect.top + window.scrollY)\n          }\n        })\n        anchorPositionsRef.current = positions\n\n        window.scrollTo({ top: originalScrollY, behavior: 'instant' as ScrollBehavior })\n      })\n    }, [anchorList])\n\n    // \u521D\u59CB\u5316\u65F6\u7F13\u5B58\u6240\u6709\u951A\u70B9\u7684\u539F\u59CB\u4F4D\u7F6E\n    useEffect(() => {\n      if (anchorList.length === 0) return\n\n      // \u9875\u9762\u52A0\u8F7D\u540E\u5EF6\u8FDF\u8BA1\u7B97\uFF0C\u786E\u4FDD\u5E03\u5C40\u5B8C\u6210\n      const timer = setTimeout(updateAnchorPositions, 100)\n\n      return () => clearTimeout(timer)\n    }, [anchorList, updateAnchorPositions])\n\n    // \u76D1\u542C body \u9AD8\u5EA6\u53D8\u5316\uFF0C\u9AD8\u5EA6\u6539\u53D8\u65F6\u91CD\u65B0\u8BA1\u7B97\u951A\u70B9\u4F4D\u7F6E\n    useEffect(() => {\n      if (anchorList.length === 0) return\n\n      let resizeTimer: ReturnType<typeof setTimeout> | null = null\n\n      const observer = new ResizeObserver(() => {\n        // debounce\uFF0C\u907F\u514D\u9AD8\u9891\u89E6\u53D1\n        if (resizeTimer) clearTimeout(resizeTimer)\n        resizeTimer = setTimeout(updateAnchorPositions, 150)\n      })\n\n      observer.observe(document.body)\n\n      return () => {\n        observer.disconnect()\n        if (resizeTimer) clearTimeout(resizeTimer)\n      }\n    }, [anchorList, updateAnchorPositions])\n\n    // \u6EDA\u52A8\u76D1\u542C\uFF1A\u68C0\u6D4B\u5F53\u524D\u6EDA\u52A8\u4F4D\u7F6E\u5BF9\u5E94\u7684\u951A\u70B9\n    useEffect(() => {\n      if (anchorList.length === 0) return\n\n      const handleScroll = () => {\n        // \u5982\u679C\u6B63\u5728\u7A0B\u5E8F\u5316\u6EDA\u52A8\u4E2D\uFF0C\u4F7F\u7528 debounce \u68C0\u6D4B\u6EDA\u52A8\u7ED3\u675F\n        if (isScrollingRef.current) {\n          // \u6E05\u9664\u4E4B\u524D\u7684\u5B9A\u65F6\u5668\n          if (scrollEndTimerRef.current) {\n            clearTimeout(scrollEndTimerRef.current)\n          }\n          // \u8BBE\u7F6E\u65B0\u7684\u5B9A\u65F6\u5668\uFF0C100ms \u6CA1\u6709\u65B0\u6EDA\u52A8\u4E8B\u4EF6\u5219\u8BA4\u4E3A\u6EDA\u52A8\u7ED3\u675F\n          scrollEndTimerRef.current = setTimeout(() => {\n            isScrollingRef.current = false\n            // \u6EDA\u52A8\u7ED3\u675F\u540E\uFF0C\u786E\u4FDD\u9AD8\u4EAE\u505C\u7559\u5728\u76EE\u6807\u951A\u70B9\n            if (targetAnchorIdRef.current) {\n              setActiveAnchorId(targetAnchorIdRef.current)\n              targetAnchorIdRef.current = ''\n            }\n          }, 100)\n          return\n        }\n\n        const navHeight = innerRef.current?.offsetHeight || 0\n        const scrollPosition = window.scrollY + navHeight + scrollOffsetExtra + 10 // 10px \u7F13\u51B2\n\n        let currentAnchorId = ''\n\n        // \u4F7F\u7528\u7F13\u5B58\u7684\u951A\u70B9\u4F4D\u7F6E\n        const positions = anchorPositionsRef.current\n\n        // \u904D\u5386\u6240\u6709\u951A\u70B9\uFF0C\u627E\u5230\u5F53\u524D\u6EDA\u52A8\u4F4D\u7F6E\u5BF9\u5E94\u7684\u951A\u70B9\n        for (let i = anchorList.length - 1; i >= 0; i--) {\n          const anchor = anchorList[i]\n          const elementTop = positions.get(anchor.id)\n          if (elementTop !== undefined && scrollPosition >= elementTop) {\n            currentAnchorId = anchor.id\n            break\n          }\n        }\n\n        // \u5982\u679C\u6CA1\u6709\u627E\u5230\u4E14\u7F13\u5B58\u4E2D\u6709\u7B2C\u4E00\u4E2A\u951A\u70B9\u7684\u4F4D\u7F6E\n        if (!currentAnchorId && anchorList.length > 0) {\n          const firstElementTop = positions.get(anchorList[0].id)\n          if (firstElementTop !== undefined && scrollPosition < firstElementTop) {\n            currentAnchorId = ''\n          }\n        }\n\n        setActiveAnchorId(currentAnchorId)\n      }\n\n      // \u5EF6\u8FDF\u521D\u59CB\u5316\uFF0C\u7B49\u5F85\u4F4D\u7F6E\u7F13\u5B58\u5B8C\u6210\n      const timer = setTimeout(() => {\n        handleScroll()\n      }, 200)\n\n      window.addEventListener('scroll', handleScroll, { passive: true })\n      return () => {\n        clearTimeout(timer)\n        window.removeEventListener('scroll', handleScroll)\n        // \u6E05\u7406\u5B9A\u65F6\u5668\n        if (scrollEndTimerRef.current) {\n          clearTimeout(scrollEndTimerRef.current)\n        }\n      }\n    }, [anchorList, scrollOffsetExtra])\n\n    // \u8BBE\u7F6E\u9875\u9762\u4E2Dheader\u5143\u7D20\u7684position\u4E3Arelative\n    useEffect(() => {\n      const headerElements = document.querySelectorAll('.header')\n      const originalStyles: { element: HTMLElement; originalPosition: string }[] = []\n\n      headerElements.forEach(element => {\n        const htmlElement = element as HTMLElement\n        // \u4FDD\u5B58\u539F\u59CB\u6837\u5F0F\n        originalStyles.push({\n          element: htmlElement,\n          originalPosition: htmlElement.style.position || getComputedStyle(htmlElement).position,\n        })\n        // \u8BBE\u7F6E\u4E3Arelative\n        htmlElement.style.position = 'relative'\n      })\n\n      // \u6E05\u7406\u51FD\u6570\uFF1A\u6062\u590D\u539F\u59CB\u6837\u5F0F\n      return () => {\n        originalStyles.forEach(({ element, originalPosition }) => {\n          element.style.position = originalPosition === 'static' ? '' : originalPosition\n        })\n      }\n    }, [])\n\n    // \u5904\u7406\u951A\u70B9\u70B9\u51FB\u6EDA\u52A8\n    const handleAnchorClick = (e: React.MouseEvent, anchorId: string) => {\n      e.preventDefault()\n\n      // \u4F7F\u7528\u7F13\u5B58\u7684\u4F4D\u7F6E\n      const elementAbsoluteTop = anchorPositionsRef.current.get(anchorId)\n      if (elementAbsoluteTop === undefined) {\n        console.warn(`Cached position for \"${anchorId}\" not found`)\n        return\n      }\n\n      // \u7ACB\u5373\u66F4\u65B0\u9AD8\u4EAE\u72B6\u6001\uFF0C\u907F\u514D\u6EDA\u52A8\u8FC7\u7A0B\u4E2D\u95EA\u70C1\n      setActiveAnchorId(anchorId)\n\n      // \u8BB0\u5F55\u76EE\u6807\u951A\u70B9\uFF0C\u7528\u4E8E\u6EDA\u52A8\u7ED3\u675F\u540E\u786E\u4FDD\u9AD8\u4EAE\u6B63\u786E\n      targetAnchorIdRef.current = anchorId\n\n      // \u6807\u8BB0\u6B63\u5728\u7A0B\u5E8F\u5316\u6EDA\u52A8\uFF0C\u6682\u505C\u6EDA\u52A8\u76D1\u542C\n      isScrollingRef.current = true\n\n      // \u83B7\u53D6\u5BFC\u822A\u680F\u9AD8\u5EA6\n      const navHeight = innerRef.current?.offsetHeight || 0\n\n      // \u76EE\u6807\u6EDA\u52A8\u4F4D\u7F6E = \u7F13\u5B58\u7684\u5143\u7D20\u7EDD\u5BF9\u4F4D\u7F6E - \u5BFC\u822A\u680F\u9AD8\u5EA6 - \u989D\u5916\u504F\u79FB\n      const targetPosition = elementAbsoluteTop - navHeight - scrollOffsetExtra\n\n      // \u5E73\u6ED1\u6EDA\u52A8\u5230\u76EE\u6807\u4F4D\u7F6E\n      window.scrollTo({\n        top: targetPosition,\n        behavior: 'smooth',\n      })\n\n      // \u66F4\u65B0 URL hash\uFF08\u4E0D\u89E6\u53D1\u9875\u9762\u8DF3\u8F6C\uFF09\n      window.history.pushState(null, '', `#${anchorId}`)\n\n      // \u6CE8\u610F\uFF1A\u6EDA\u52A8\u7ED3\u675F\u68C0\u6D4B\u7531 handleScroll \u4E2D\u7684 debounce \u903B\u8F91\u5904\u7406\n      // \u4E0D\u518D\u4F7F\u7528\u56FA\u5B9A 800ms \u8D85\u65F6\uFF0C\u800C\u662F\u68C0\u6D4B\u5B9E\u9645\u6EDA\u52A8\u7ED3\u675F\n    }\n\n    return (\n      <div\n        id={id}\n        ref={innerRef}\n        className={cn(\n          'product-nav text-info-primary bg-container-primary tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] !sticky top-0 !z-[51] flex w-full justify-between overflow-hidden px-4 py-0',\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          className\n        )}\n      >\n        <div className=\"product-nav-main desktop:flex-row desktop:gap-[48px] flex w-full flex-col justify-start\">\n          {/* Tab Links Section */}\n          <div className=\"product-nav-header laptop:w-full desktop:w-fit desktop:gap-[24px] desktop:py-0 flex w-full flex-row items-center justify-between gap-[16px] pt-[14px]\">\n            <div className=\"product-nav-tabs flex flex-row items-center gap-[8px]\">\n              {tabLinks.map((tabLink, index) => {\n                return (\n                  <div key={tabLink.link || index} className=\"product-nav-tab-item flex items-center gap-[8px]\">\n                    <a\n                      href={tabLink.link}\n                      className={cn(\n                        'product-nav-tab-link hover:text-brand-color text-nowrap text-[14px] font-bold tracking-[-0.04em]',\n                        {\n                          'text-[#6D6D6F]': index !== 0,\n                          'hidden desktop:block': index === 1,\n                        }\n                      )}\n                      // onClick={() => onShowSpecs?.(false)}\n                    >\n                      <span>{tabLink.label}</span>\n                    </a>\n                    {index !== tabLinks.length - 1 && (\n                      <div className=\"product-nav-tab-divider desktop:inline-block hidden h-[14px] w-px bg-[#E4E5E6]\" />\n                    )}\n                  </div>\n                )\n              })}\n\n              {/* Mobile Dropdown */}\n              {tabLinks.length > 1 && (\n                <Popover.Root>\n                  <Popover.Trigger asChild>\n                    <button\n                      className=\"product-nav-dropdown-trigger desktop:hidden -ml-1 inline-block\"\n                      aria-label=\"More products\"\n                    >\n                      <ChevronDownIcon className=\"text-[#1D1D1F]\" />\n                    </button>\n                  </Popover.Trigger>\n                  <Popover.Content\n                    className=\"product-nav-dropdown-content rounded-[6px] border border-[#E4E5E6] bg-white p-[6px] px-[8px] py-[4px]\"\n                    style={{\n                      boxShadow: '0px 4px 8px 0px rgba(0,0,0,0.12)',\n                    }}\n                    side=\"bottom\"\n                    align=\"end\"\n                    alignOffset={10}\n                    sideOffset={10}\n                  >\n                    {tabLinks.slice(1).map(tabLink => (\n                      <a\n                        key={tabLink.link}\n                        href={tabLink.link}\n                        className=\"product-nav-dropdown-link hover:text-brand-color text-nowrap\"\n                      >\n                        <span>{tabLink.label}</span>\n                      </a>\n                    ))}\n                  </Popover.Content>\n                </Popover.Root>\n              )}\n            </div>\n\n            {/* Mobile Actions */}\n            <div className=\"product-nav-mobile-actions desktop:hidden desktop:gap-[24px] flex items-center gap-[16px]\">\n              {/* {specs?.text && (\n                <Text\n                  size={2}\n                  onClick={handleSpecsClick}\n                  className=\"product-nav-specs-button cursor-pointer hover:text-brand-color\"\n                >\n                  {specs.text}\n                </Text>\n              )} */}\n              {textLink?.link && (\n                <a\n                  href={textLink.link}\n                  target={textLink.target || '_self'}\n                  className=\"product-nav-text-link hover:text-brand-color cursor-pointer\"\n                >\n                  <Text size={2} className=\"text-nowrap\">\n                    {textLink.text}\n                  </Text>\n                </a>\n              )}\n              {buyBtn?.link && (\n                <Button as=\"a\" href={buyBtn.link} size=\"sm\" className=\"product-nav-buy-button text-nowrap\">\n                  {buyBtn.text}\n                </Button>\n              )}\n            </div>\n          </div>\n\n          {/* Anchor Navigation */}\n          <div className=\"product-nav-anchors laptop:w-fit desktop:gap-[24px] desktop:py-[8px] flex w-full items-center gap-[16px] overflow-x-scroll py-[12px] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n            {anchorList.map((anchor, index) => (\n              <a\n                key={anchor.id}\n                href={`#${anchor.id}`}\n                className=\"product-nav-anchor-link\"\n                onClick={e => {\n                  // \u5982\u679C\u63D0\u4F9B\u4E86\u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6,\u4F7F\u7528\u81EA\u5B9A\u4E49\u4E8B\u4EF6\u5E76\u963B\u6B62\u9ED8\u8BA4\u884C\u4E3A\n                  if (onAnchorClick) {\n                    e.preventDefault()\n                    // \u6807\u8BB0\u7A0B\u5E8F\u5316\u6EDA\u52A8\uFF0C\u907F\u514D\u6EDA\u52A8\u8FC7\u7A0B\u4E2D\u9AD8\u4EAE\u95EA\u70C1\n                    setActiveAnchorId(anchor.id)\n                    targetAnchorIdRef.current = anchor.id\n                    isScrollingRef.current = true\n                    onAnchorClick(anchor, index)\n                  } else {\n                    // \u4F7F\u7528\u9ED8\u8BA4\u7684\u951A\u70B9\u6EDA\u52A8\u884C\u4E3A\uFF0C\u5E26\u504F\u79FB\u91CF\n                    handleAnchorClick(e, anchor.id)\n                  }\n                }}\n              >\n                <Text size={2} className=\"product-nav-anchor-text text-nowrap\">\n                  {anchor.label}\n                </Text>\n                <div\n                  className={cn(\n                    'product-nav-anchor-indicator laptop:top-[12px] desktop:top-[10px] relative top-[12px] h-[4px] w-full bg-transparent',\n                    {\n                      '!bg-brand-0': activeAnchorId === anchor.id,\n                    }\n                  )}\n                />\n              </a>\n            ))}\n          </div>\n        </div>\n\n        {/* Desktop Actions */}\n        <div className=\"product-nav-desktop-actions desktop:flex desktop:gap-[24px] desktop:py-[8px] hidden items-center gap-[16px]\">\n          {/* {specs?.text && (\n            <Text\n              size={2}\n              onClick={handleSpecsClick}\n              className=\"product-nav-specs-button cursor-pointer text-black hover:text-brand-color\"\n            >\n              {specs.text}\n            </Text>\n          )} */}\n          {textLink?.link && (\n            <a\n              href={textLink.link}\n              target={textLink.target || '_self'}\n              className=\"product-nav-text-link hover:text-brand-color cursor-pointer text-black\"\n            >\n              <Text size={2} className=\"text-nowrap\">\n                {textLink.text}\n              </Text>\n            </a>\n          )}\n          {buyBtn?.link && (\n            <Button as=\"a\" href={buyBtn.link} size=\"sm\" className=\"product-nav-buy-button text-nowrap\">\n              {buyBtn.text}\n            </Button>\n          )}\n        </div>\n      </div>\n    )\n  }\n)\n\nProductNav.displayName = 'ProductNav'\n\nexport default withLayout(ProductNav)\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "useState", "useEffect", "useCallback", "forwardRef", "useImperativeHandle", "useRef", "cn", "withLayout", "Button", "Text", "useExposure", "Popover", "componentType", "componentName", "ChevronDownIcon", "props", "ProductNav", "className", "data", "id", "onAnchorClick", "scrollOffsetExtra", "ref", "tabLinks", "anchorList", "textLink", "buyBtn", "theme", "activeAnchorId", "setActiveAnchorId", "innerRef", "isScrollingRef", "targetAnchorIdRef", "scrollEndTimerRef", "anchorPositionsRef", "updateAnchorPositions", "originalScrollY", "positions", "anchor", "element", "rect", "timer", "resizeTimer", "observer", "handleScroll", "navHeight", "scrollPosition", "currentAnchorId", "i", "elementTop", "firstElementTop", "headerElements", "originalStyles", "htmlElement", "originalPosition", "handleAnchorClick", "anchorId", "elementAbsoluteTop", "targetPosition", "tabLink", "index", "e", "ProductNav_default"]
+  "sourcesContent": ["'use client'\nimport { useState, useEffect, useCallback, forwardRef, useImperativeHandle, useRef } from 'react'\nimport { cn, getLocalizedPath } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Button, Text } from '../../components/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport type { ProductNavProps } from './types.js'\nimport * as Popover from '@radix-ui/react-popover'\n\nconst componentType = 'navigation'\nconst componentName = 'product_nav'\n\nconst ChevronDownIcon = (props: React.SVGProps<SVGSVGElement>) => {\n  return (\n    <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n      <path\n        d=\"M5 7.5L10 12.5L15 7.5\"\n        stroke=\"currentColor\"\n        strokeWidth=\"1.66667\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  )\n}\n\nconst ProductNav = forwardRef<HTMLDivElement, ProductNavProps>(\n  ({ className = '', data, id, onAnchorClick, scrollOffsetExtra = 0 }, ref) => {\n    const { tabLinks = [], anchorList = [], textLink, buyBtn, theme = 'light' } = data || {}\n    const { locale = 'us', trackingData } = useAiuiContext()\n    const contextHandle = trackingData?.contextHandle || ''\n    const [activeAnchorId, setActiveAnchorId] = useState('')\n    const innerRef = useRef<HTMLDivElement>(null)\n    const isScrollingRef = useRef(false) // \u6807\u8BB0\u662F\u5426\u6B63\u5728\u7A0B\u5E8F\u5316\u6EDA\u52A8\u4E2D\n    const targetAnchorIdRef = useRef<string>('') // \u8BB0\u5F55\u70B9\u51FB\u76EE\u6807\u951A\u70B9\n    const scrollEndTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null) // \u6EDA\u52A8\u7ED3\u675F\u68C0\u6D4B\u5B9A\u65F6\u5668\n    const anchorPositionsRef = useRef<Map<string, number>>(new Map()) // \u7F13\u5B58\u951A\u70B9\u539F\u59CB\u4F4D\u7F6E\n\n    useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n    useExposure(innerRef, {\n      componentType,\n      componentName,\n    })\n\n    // \u7F13\u5B58\u6240\u6709\u951A\u70B9\u7684\u7EDD\u5BF9\u4F4D\u7F6E\uFF08\u6EDA\u52A8\u5230\u9876\u90E8\u540E\u8BA1\u7B97\uFF0C\u907F\u514D sticky \u5F71\u54CD\uFF09\n    const updateAnchorPositions = useCallback(() => {\n      if (anchorList.length === 0) return\n\n      const originalScrollY = window.scrollY\n      window.scrollTo({ top: 0, behavior: 'instant' as ScrollBehavior })\n\n      requestAnimationFrame(() => {\n        const positions = new Map<string, number>()\n        anchorList.forEach(anchor => {\n          const element = document.getElementById(anchor.id)\n          if (element) {\n            const rect = element.getBoundingClientRect()\n            positions.set(anchor.id, rect.top + window.scrollY)\n          }\n        })\n        anchorPositionsRef.current = positions\n\n        window.scrollTo({ top: originalScrollY, behavior: 'instant' as ScrollBehavior })\n      })\n    }, [anchorList])\n\n    // \u521D\u59CB\u5316\u65F6\u7F13\u5B58\u6240\u6709\u951A\u70B9\u7684\u539F\u59CB\u4F4D\u7F6E\n    useEffect(() => {\n      if (anchorList.length === 0) return\n\n      // \u9875\u9762\u52A0\u8F7D\u540E\u5EF6\u8FDF\u8BA1\u7B97\uFF0C\u786E\u4FDD\u5E03\u5C40\u5B8C\u6210\n      const timer = setTimeout(updateAnchorPositions, 100)\n\n      return () => clearTimeout(timer)\n    }, [anchorList, updateAnchorPositions])\n\n    // \u76D1\u542C body \u9AD8\u5EA6\u53D8\u5316\uFF0C\u9AD8\u5EA6\u6539\u53D8\u65F6\u91CD\u65B0\u8BA1\u7B97\u951A\u70B9\u4F4D\u7F6E\n    useEffect(() => {\n      if (anchorList.length === 0) return\n\n      let resizeTimer: ReturnType<typeof setTimeout> | null = null\n\n      const observer = new ResizeObserver(() => {\n        // debounce\uFF0C\u907F\u514D\u9AD8\u9891\u89E6\u53D1\n        if (resizeTimer) clearTimeout(resizeTimer)\n        resizeTimer = setTimeout(updateAnchorPositions, 150)\n      })\n\n      observer.observe(document.body)\n\n      return () => {\n        observer.disconnect()\n        if (resizeTimer) clearTimeout(resizeTimer)\n      }\n    }, [anchorList, updateAnchorPositions])\n\n    // \u6EDA\u52A8\u76D1\u542C\uFF1A\u68C0\u6D4B\u5F53\u524D\u6EDA\u52A8\u4F4D\u7F6E\u5BF9\u5E94\u7684\u951A\u70B9\n    useEffect(() => {\n      if (anchorList.length === 0) return\n\n      const handleScroll = () => {\n        // \u5982\u679C\u6B63\u5728\u7A0B\u5E8F\u5316\u6EDA\u52A8\u4E2D\uFF0C\u4F7F\u7528 debounce \u68C0\u6D4B\u6EDA\u52A8\u7ED3\u675F\n        if (isScrollingRef.current) {\n          // \u6E05\u9664\u4E4B\u524D\u7684\u5B9A\u65F6\u5668\n          if (scrollEndTimerRef.current) {\n            clearTimeout(scrollEndTimerRef.current)\n          }\n          // \u8BBE\u7F6E\u65B0\u7684\u5B9A\u65F6\u5668\uFF0C100ms \u6CA1\u6709\u65B0\u6EDA\u52A8\u4E8B\u4EF6\u5219\u8BA4\u4E3A\u6EDA\u52A8\u7ED3\u675F\n          scrollEndTimerRef.current = setTimeout(() => {\n            isScrollingRef.current = false\n            // \u6EDA\u52A8\u7ED3\u675F\u540E\uFF0C\u786E\u4FDD\u9AD8\u4EAE\u505C\u7559\u5728\u76EE\u6807\u951A\u70B9\n            if (targetAnchorIdRef.current) {\n              setActiveAnchorId(targetAnchorIdRef.current)\n              targetAnchorIdRef.current = ''\n            }\n          }, 100)\n          return\n        }\n\n        const navHeight = innerRef.current?.offsetHeight || 0\n        const scrollPosition = window.scrollY + navHeight + scrollOffsetExtra + 10 // 10px \u7F13\u51B2\n\n        let currentAnchorId = ''\n\n        // \u4F7F\u7528\u7F13\u5B58\u7684\u951A\u70B9\u4F4D\u7F6E\n        const positions = anchorPositionsRef.current\n\n        // \u904D\u5386\u6240\u6709\u951A\u70B9\uFF0C\u627E\u5230\u5F53\u524D\u6EDA\u52A8\u4F4D\u7F6E\u5BF9\u5E94\u7684\u951A\u70B9\n        for (let i = anchorList.length - 1; i >= 0; i--) {\n          const anchor = anchorList[i]\n          const elementTop = positions.get(anchor.id)\n          if (elementTop !== undefined && scrollPosition >= elementTop) {\n            currentAnchorId = anchor.id\n            break\n          }\n        }\n\n        // \u5982\u679C\u6CA1\u6709\u627E\u5230\u4E14\u7F13\u5B58\u4E2D\u6709\u7B2C\u4E00\u4E2A\u951A\u70B9\u7684\u4F4D\u7F6E\n        if (!currentAnchorId && anchorList.length > 0) {\n          const firstElementTop = positions.get(anchorList[0].id)\n          if (firstElementTop !== undefined && scrollPosition < firstElementTop) {\n            currentAnchorId = ''\n          }\n        }\n\n        setActiveAnchorId(currentAnchorId)\n      }\n\n      // \u5EF6\u8FDF\u521D\u59CB\u5316\uFF0C\u7B49\u5F85\u4F4D\u7F6E\u7F13\u5B58\u5B8C\u6210\n      const timer = setTimeout(() => {\n        handleScroll()\n      }, 200)\n\n      window.addEventListener('scroll', handleScroll, { passive: true })\n      return () => {\n        clearTimeout(timer)\n        window.removeEventListener('scroll', handleScroll)\n        // \u6E05\u7406\u5B9A\u65F6\u5668\n        if (scrollEndTimerRef.current) {\n          clearTimeout(scrollEndTimerRef.current)\n        }\n      }\n    }, [anchorList, scrollOffsetExtra])\n\n    // \u8BBE\u7F6E\u9875\u9762\u4E2Dheader\u5143\u7D20\u7684position\u4E3Arelative\n    useEffect(() => {\n      const headerElements = document.querySelectorAll('.header')\n      const originalStyles: { element: HTMLElement; originalPosition: string }[] = []\n\n      headerElements.forEach(element => {\n        const htmlElement = element as HTMLElement\n        // \u4FDD\u5B58\u539F\u59CB\u6837\u5F0F\n        originalStyles.push({\n          element: htmlElement,\n          originalPosition: htmlElement.style.position || getComputedStyle(htmlElement).position,\n        })\n        // \u8BBE\u7F6E\u4E3Arelative\n        htmlElement.style.position = 'relative'\n      })\n\n      // \u6E05\u7406\u51FD\u6570\uFF1A\u6062\u590D\u539F\u59CB\u6837\u5F0F\n      return () => {\n        originalStyles.forEach(({ element, originalPosition }) => {\n          element.style.position = originalPosition === 'static' ? '' : originalPosition\n        })\n      }\n    }, [])\n\n    // \u5904\u7406\u951A\u70B9\u70B9\u51FB\u6EDA\u52A8\n    const handleAnchorClick = (e: React.MouseEvent, anchorId: string) => {\n      e.preventDefault()\n\n      // \u4F7F\u7528\u7F13\u5B58\u7684\u4F4D\u7F6E\n      const elementAbsoluteTop = anchorPositionsRef.current.get(anchorId)\n      if (elementAbsoluteTop === undefined) {\n        console.warn(`Cached position for \"${anchorId}\" not found`)\n        return\n      }\n\n      // \u7ACB\u5373\u66F4\u65B0\u9AD8\u4EAE\u72B6\u6001\uFF0C\u907F\u514D\u6EDA\u52A8\u8FC7\u7A0B\u4E2D\u95EA\u70C1\n      setActiveAnchorId(anchorId)\n\n      // \u8BB0\u5F55\u76EE\u6807\u951A\u70B9\uFF0C\u7528\u4E8E\u6EDA\u52A8\u7ED3\u675F\u540E\u786E\u4FDD\u9AD8\u4EAE\u6B63\u786E\n      targetAnchorIdRef.current = anchorId\n\n      // \u6807\u8BB0\u6B63\u5728\u7A0B\u5E8F\u5316\u6EDA\u52A8\uFF0C\u6682\u505C\u6EDA\u52A8\u76D1\u542C\n      isScrollingRef.current = true\n\n      // \u83B7\u53D6\u5BFC\u822A\u680F\u9AD8\u5EA6\n      const navHeight = innerRef.current?.offsetHeight || 0\n\n      // \u76EE\u6807\u6EDA\u52A8\u4F4D\u7F6E = \u7F13\u5B58\u7684\u5143\u7D20\u7EDD\u5BF9\u4F4D\u7F6E - \u5BFC\u822A\u680F\u9AD8\u5EA6 - \u989D\u5916\u504F\u79FB\n      const targetPosition = elementAbsoluteTop - navHeight - scrollOffsetExtra\n\n      // \u5E73\u6ED1\u6EDA\u52A8\u5230\u76EE\u6807\u4F4D\u7F6E\n      window.scrollTo({\n        top: targetPosition,\n        behavior: 'smooth',\n      })\n\n      // \u66F4\u65B0 URL hash\uFF08\u4E0D\u89E6\u53D1\u9875\u9762\u8DF3\u8F6C\uFF09\n      window.history.pushState(null, '', `#${anchorId}`)\n\n      // \u6CE8\u610F\uFF1A\u6EDA\u52A8\u7ED3\u675F\u68C0\u6D4B\u7531 handleScroll \u4E2D\u7684 debounce \u903B\u8F91\u5904\u7406\n      // \u4E0D\u518D\u4F7F\u7528\u56FA\u5B9A 800ms \u8D85\u65F6\uFF0C\u800C\u662F\u68C0\u6D4B\u5B9E\u9645\u6EDA\u52A8\u7ED3\u675F\n    }\n\n    return (\n      <div\n        id={id}\n        ref={innerRef}\n        className={cn(\n          'product-nav text-info-primary bg-container-primary tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] !sticky top-0 !z-[51] flex w-full justify-between overflow-hidden px-4 py-0',\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          className\n        )}\n      >\n        <div className=\"product-nav-main desktop:flex-row desktop:gap-[48px] flex w-full flex-col justify-start\">\n          {/* Tab Links Section */}\n          <div className=\"product-nav-header laptop:w-full desktop:w-fit desktop:gap-[24px] desktop:py-0 flex w-full flex-row items-center justify-between gap-[16px] pt-[14px]\">\n            <div className=\"product-nav-tabs flex flex-row items-center gap-[8px]\">\n              {tabLinks.map((tabLink, index) => {\n                return (\n                  <div key={tabLink.link || index} className=\"product-nav-tab-item flex items-center gap-[8px]\">\n                    <a\n                      href={trackUrlRef(\n                        getLocalizedPath(tabLink.link, locale),\n                        `${contextHandle}_${componentType}_${componentName}`\n                      )}\n                      className={cn(\n                        'product-nav-tab-link hover:text-brand-color text-nowrap text-[14px] font-bold tracking-[-0.04em]',\n                        {\n                          'text-[#6D6D6F]': index !== 0,\n                          'hidden desktop:block': index === 1,\n                        }\n                      )}\n                      // onClick={() => onShowSpecs?.(false)}\n                    >\n                      <span>{tabLink.label}</span>\n                    </a>\n                    {index !== tabLinks.length - 1 && (\n                      <div className=\"product-nav-tab-divider desktop:inline-block hidden h-[14px] w-px bg-[#E4E5E6]\" />\n                    )}\n                  </div>\n                )\n              })}\n\n              {/* Mobile Dropdown */}\n              {tabLinks.length > 1 && (\n                <Popover.Root>\n                  <Popover.Trigger asChild>\n                    <button\n                      className=\"product-nav-dropdown-trigger desktop:hidden -ml-1 inline-block\"\n                      aria-label=\"More products\"\n                    >\n                      <ChevronDownIcon className=\"text-[#1D1D1F]\" />\n                    </button>\n                  </Popover.Trigger>\n                  <Popover.Content\n                    className=\"product-nav-dropdown-content rounded-[6px] border border-[#E4E5E6] bg-white p-[6px] px-[8px] py-[4px]\"\n                    style={{\n                      boxShadow: '0px 4px 8px 0px rgba(0,0,0,0.12)',\n                    }}\n                    side=\"bottom\"\n                    align=\"end\"\n                    alignOffset={10}\n                    sideOffset={10}\n                  >\n                    {tabLinks.slice(1).map(tabLink => (\n                      <a\n                        key={tabLink.link}\n                        href={trackUrlRef(\n                          getLocalizedPath(tabLink.link, locale),\n                          `${contextHandle}_${componentType}_${componentName}`\n                        )}\n                        className=\"product-nav-dropdown-link hover:text-brand-color text-nowrap\"\n                      >\n                        <span>{tabLink.label}</span>\n                      </a>\n                    ))}\n                  </Popover.Content>\n                </Popover.Root>\n              )}\n            </div>\n\n            {/* Mobile Actions */}\n            <div className=\"product-nav-mobile-actions desktop:hidden desktop:gap-[24px] flex items-center gap-[16px]\">\n              {/* {specs?.text && (\n                <Text\n                  size={2}\n                  onClick={handleSpecsClick}\n                  className=\"product-nav-specs-button cursor-pointer hover:text-brand-color\"\n                >\n                  {specs.text}\n                </Text>\n              )} */}\n              {textLink?.link && (\n                <a\n                  href={trackUrlRef(\n                    getLocalizedPath(textLink.link, locale),\n                    `${contextHandle}_${componentType}_${componentName}`\n                  )}\n                  target={textLink.target || '_self'}\n                  className=\"product-nav-text-link hover:text-brand-color cursor-pointer\"\n                >\n                  <Text size={2} className=\"text-nowrap\">\n                    {textLink.text}\n                  </Text>\n                </a>\n              )}\n              {buyBtn?.link && (\n                <Button\n                  as=\"a\"\n                  href={trackUrlRef(\n                    getLocalizedPath(buyBtn.link, locale),\n                    `${contextHandle}_${componentType}_${componentName}`\n                  )}\n                  size=\"sm\"\n                  className=\"product-nav-buy-button text-nowrap\"\n                >\n                  {buyBtn.text}\n                </Button>\n              )}\n            </div>\n          </div>\n\n          {/* Anchor Navigation */}\n          <div className=\"product-nav-anchors laptop:w-fit desktop:gap-[24px] desktop:py-[8px] flex w-full items-center gap-[16px] overflow-x-scroll py-[12px] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n            {anchorList.map((anchor, index) => (\n              <a\n                key={anchor.id}\n                href={`#${anchor.id}`}\n                className=\"product-nav-anchor-link\"\n                onClick={e => {\n                  // \u5982\u679C\u63D0\u4F9B\u4E86\u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6,\u4F7F\u7528\u81EA\u5B9A\u4E49\u4E8B\u4EF6\u5E76\u963B\u6B62\u9ED8\u8BA4\u884C\u4E3A\n                  if (onAnchorClick) {\n                    e.preventDefault()\n                    // \u6807\u8BB0\u7A0B\u5E8F\u5316\u6EDA\u52A8\uFF0C\u907F\u514D\u6EDA\u52A8\u8FC7\u7A0B\u4E2D\u9AD8\u4EAE\u95EA\u70C1\n                    setActiveAnchorId(anchor.id)\n                    targetAnchorIdRef.current = anchor.id\n                    isScrollingRef.current = true\n                    onAnchorClick(anchor, index)\n                  } else {\n                    // \u4F7F\u7528\u9ED8\u8BA4\u7684\u951A\u70B9\u6EDA\u52A8\u884C\u4E3A\uFF0C\u5E26\u504F\u79FB\u91CF\n                    handleAnchorClick(e, anchor.id)\n                  }\n                }}\n              >\n                <Text size={2} className=\"product-nav-anchor-text text-nowrap\">\n                  {anchor.label}\n                </Text>\n                <div\n                  className={cn(\n                    'product-nav-anchor-indicator laptop:top-[12px] desktop:top-[10px] relative top-[12px] h-[4px] w-full bg-transparent',\n                    {\n                      '!bg-brand-0': activeAnchorId === anchor.id,\n                    }\n                  )}\n                />\n              </a>\n            ))}\n          </div>\n        </div>\n\n        {/* Desktop Actions */}\n        <div className=\"product-nav-desktop-actions desktop:flex desktop:gap-[24px] desktop:py-[8px] hidden items-center gap-[16px]\">\n          {/* {specs?.text && (\n            <Text\n              size={2}\n              onClick={handleSpecsClick}\n              className=\"product-nav-specs-button cursor-pointer text-black hover:text-brand-color\"\n            >\n              {specs.text}\n            </Text>\n          )} */}\n          {textLink?.link && (\n            <a\n              href={trackUrlRef(\n                getLocalizedPath(textLink.link, locale),\n                `${contextHandle}_${componentType}_${componentName}`\n              )}\n              target={textLink.target || '_self'}\n              className=\"product-nav-text-link hover:text-brand-color cursor-pointer text-black\"\n            >\n              <Text size={2} className=\"text-nowrap\">\n                {textLink.text}\n              </Text>\n            </a>\n          )}\n          {buyBtn?.link && (\n            <Button\n              as=\"a\"\n              href={trackUrlRef(\n                getLocalizedPath(buyBtn.link, locale),\n                `${contextHandle}_${componentType}_${componentName}`\n              )}\n              size=\"sm\"\n              className=\"product-nav-buy-button text-nowrap\"\n            >\n              {buyBtn.text}\n            </Button>\n          )}\n        </div>\n      </div>\n    )\n  }\n)\n\nProductNav.displayName = 'ProductNav'\n\nexport default withLayout(ProductNav)\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "useState", "useEffect", "useCallback", "forwardRef", "useImperativeHandle", "useRef", "cn", "getLocalizedPath", "withLayout", "Button", "Text", "useExposure", "trackUrlRef", "useAiuiContext", "Popover", "componentType", "componentName", "ChevronDownIcon", "props", "ProductNav", "className", "data", "id", "onAnchorClick", "scrollOffsetExtra", "ref", "tabLinks", "anchorList", "textLink", "buyBtn", "theme", "locale", "trackingData", "contextHandle", "activeAnchorId", "setActiveAnchorId", "innerRef", "isScrollingRef", "targetAnchorIdRef", "scrollEndTimerRef", "anchorPositionsRef", "updateAnchorPositions", "originalScrollY", "positions", "anchor", "element", "rect", "timer", "resizeTimer", "observer", "handleScroll", "navHeight", "scrollPosition", "currentAnchorId", "i", "elementTop", "firstElementTop", "headerElements", "originalStyles", "htmlElement", "originalPosition", "handleAnchorClick", "anchorId", "elementAbsoluteTop", "targetPosition", "tabLink", "index", "e", "ProductNav_default"]
 }

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

@@ -1,2 +1,2 @@
-"use client";import{jsx as l,jsxs as h}from"react/jsx-runtime";import*as g from"react";import{cn as p}from"../../helpers/index.js";import{Heading as k,Button as v,Picture as B}from"../../components/index.js";import{withLayout as P}from"../../shared/Styles.js";import{getLocalizedPath as T}from"../../helpers/index.js";import{useAiuiContext as M}from"../AiuiProvider/index.js";import{trackUrlRef as N}from"../../shared/trackUrlRef.js";const D="image",y="PromotionalBar",R=i=>{if(!i)return;const{mobile:e,tablet:m,laptop:u,desktop:d,lgDesktop:f}=i,t=[],r=b=>b?.url,o=r(f),n=r(d),a=r(u),s=r(m),c=r(e);return o?t.push(o):n?t.push(n):a?t.push(a):s?t.push(s):c&&t.push(c),n&&o&&t.push(`${n} 1920`),a&&(n||o)&&t.push(`${a} 1440`),s&&(a||n||o)&&t.push(`${s} 1024`),c&&(s||a||n||o)&&t.push(`${c} 768`),t.length>0?t.join(", "):void 0},x=g.forwardRef(({classNames:i,data:e,className:m,...u},d)=>{const{locale:f="us",pageHandle:t}=M(),{backgroundImage:r,theme:o="dark"}=e,n=g.useMemo(()=>R(r),[r]);return l("div",{ref:d,...u,className:p("laptop:h-[192px] lg-desktop:h-[240px] h-[240px] text-[#080A0F]",{"text-[#F5F6F7]":o==="dark"},i?.root,m),children:h("div",{className:"promotional-bar-content rounded-card relative h-full overflow-hidden",children:[h("div",{className:p("laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4",i?.content),children:[e.contentTitle&&l(k,{className:p("line-clamp-2 ",i?.title),html:e.contentTitle,size:3}),e.contentDesc&&l("p",{className:p("laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] ",i?.description),dangerouslySetInnerHTML:{__html:e.contentDesc}}),l("div",{className:"laptop:mt-4 mt-2",children:e.buttonText&&l(v,{as:"a",variant:"link",className:p("!p-0 text-[#F5F6F7]",{"text-[#080A0F]":o==="light"},i?.button),href:N(T(e.buttonLink||"",f),`${t}_${D}_${y}`),iconClassName:"size-4",children:e.buttonText})})]}),l(B,{source:n,className:"absolute inset-0 z-10 ",imgClassName:"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]"})]})})});x.displayName="PromotionalBar";var I=P(x);export{I as default};
+"use client";import{jsx as a,jsxs as k}from"react/jsx-runtime";import*as f from"react";import{cn as p}from"../../helpers/index.js";import{Heading as T,Button as D,Picture as B}from"../../components/index.js";import{withLayout as M}from"../../shared/Styles.js";import{getLocalizedPath as P}from"../../helpers/index.js";import{useAiuiContext as $}from"../AiuiProvider/index.js";import{useExposure as N}from"../../hooks/useExposure.js";import{trackUrlRef as R}from"../../shared/trackUrlRef.js";const x="image",g="promotional_bar",y=r=>{if(!r)return;const{mobile:t,tablet:m,laptop:u,desktop:h,lgDesktop:d}=r,e=[],s=v=>v?.url,o=s(d),n=s(h),i=s(u),l=s(m),c=s(t);return o?e.push(o):n?e.push(n):i?e.push(i):l?e.push(l):c&&e.push(c),n&&o&&e.push(`${n} 1920`),i&&(n||o)&&e.push(`${i} 1440`),l&&(i||n||o)&&e.push(`${l} 1024`),c&&(l||i||n||o)&&e.push(`${c} 768`),e.length>0?e.join(", "):void 0},b=f.forwardRef(({classNames:r,data:t,className:m,...u},h)=>{const{locale:d="us",trackingData:e}=$(),{backgroundImage:s,theme:o="dark"}=t,n=f.useMemo(()=>y(s),[s]),i=f.useRef(null);return N(i,{componentType:x,componentName:g,componentTitle:t.contentTitle||"",componentDescription:t.contentDesc||""}),a("div",{ref:i,...u,className:p("laptop:h-[192px] lg-desktop:h-[240px] h-[240px] text-[#080A0F]",{"text-[#F5F6F7]":o==="dark"},r?.root,m),children:k("div",{className:"promotional-bar-content rounded-card relative h-full overflow-hidden",children:[k("div",{className:p("laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4",r?.content),children:[t.contentTitle&&a(T,{className:p("line-clamp-2 ",r?.title),html:t.contentTitle,size:3}),t.contentDesc&&a("p",{className:p("laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] ",r?.description),dangerouslySetInnerHTML:{__html:t.contentDesc}}),a("div",{className:"laptop:mt-4 mt-2",children:t.buttonText&&a(D,{as:"a",variant:"link",className:p("!p-0 text-[#F5F6F7]",{"text-[#080A0F]":o==="light"},r?.button),href:R(P(t.buttonLink||"",d),`${e?.contextHandle||""}_${x}_${g}`),iconClassName:"size-4","data-headless-type-name":`${x}#${g}`,"data-headless-title-desc-button":`${t.contentTitle||""}#${t.contentDesc||""}#${t.buttonText||""}`,children:t.buttonText})})]}),a(B,{source:n,className:"absolute inset-0 z-10 ",imgClassName:"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]"})]})})});b.displayName="PromotionalBar";var S=M(b);export{S as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/PromotionalBar/index.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Heading, Button, Picture } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media, Theme } from '../../types/props.js'\nimport { getLocalizedPath } from '../../helpers/index.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\n\nexport interface PromotionalBarSemanticName {\n  root: 'root'\n  content: 'content'\n  title: 'title'\n  description: 'description'\n  button: 'button'\n}\n\n/**\n * \u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u914D\u7F6E\n */\nexport interface ResponsiveBackgroundImage {\n  /** \u79FB\u52A8\u7AEF\u56FE\u7247 (<768px) */\n  mobile?: Media\n  /** \u5E73\u677F\u56FE\u7247 (768-1440px) */\n  tablet?: Media\n  /** \u7B14\u8BB0\u672C\u56FE\u7247 (1025-1440px) */\n  laptop?: Media\n  /** \u684C\u9762\u56FE\u7247 (1441-1920px) */\n  desktop?: Media\n  /** \u8D85\u5927\u684C\u9762\u56FE\u7247 (\u22651921px) */\n  lgDesktop?: Media\n}\n\n/**\n * PromotionalBar \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface PromotionalBarData {\n  theme: Theme\n  /** \u7EC4\u4EF6\u5185\u5BB9\u6807\u9898 */\n  contentTitle?: string\n  /** \u7EC4\u4EF6\u5185\u5BB9\u63CF\u8FF0 */\n  contentDesc?: string\n  /** \u6309\u94AE\u6587\u672C */\n  buttonText?: string\n  /** \u6309\u94AE\u94FE\u63A5 */\n  buttonLink?: string\n  /** \u80CC\u666F\u56FE\u7247 - \u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61 */\n  backgroundImage?: ResponsiveBackgroundImage\n}\n\nexport interface PromotionalBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: PromotionalBarData\n  classNames?: Partial<Record<keyof PromotionalBarSemanticName, string>>\n}\n\nconst componentType = 'image'\nconst componentName = 'PromotionalBar'\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u5BF9\u8C61\u8F6C\u6362\u4E3A Picture \u7EC4\u4EF6\u6240\u9700\u7684\u5B57\u7B26\u4E32\u683C\u5F0F\n */\nconst convertResponsiveImageToString = (backgroundImage: ResponsiveBackgroundImage | undefined): string | undefined => {\n  if (!backgroundImage) return undefined\n\n  const { mobile, tablet, laptop, desktop, lgDesktop } = backgroundImage\n  const parts: string[] = []\n\n  // \u8F85\u52A9\u51FD\u6570\uFF1A\u4ECE Media \u5BF9\u8C61\u4E2D\u63D0\u53D6 URL\n  const getUrl = (media: Media | undefined): string | undefined => {\n    return media?.url\n  }\n\n  // \u9ED8\u8BA4\u56FE\u7247\uFF08\u6700\u5927\u5C3A\u5BF8\uFF09\u653E\u5728\u6700\u524D\u9762\uFF0C\u4E0D\u9700\u8981\u65AD\u70B9\n  const lgDesktopUrl = getUrl(lgDesktop)\n  const desktopUrl = getUrl(desktop)\n  const laptopUrl = getUrl(laptop)\n  const tabletUrl = getUrl(tablet)\n  const mobileUrl = getUrl(mobile)\n\n  if (lgDesktopUrl) parts.push(lgDesktopUrl)\n  else if (desktopUrl) parts.push(desktopUrl)\n  else if (laptopUrl) parts.push(laptopUrl)\n  else if (tabletUrl) parts.push(tabletUrl)\n  else if (mobileUrl) parts.push(mobileUrl)\n\n  // \u6309\u65AD\u70B9\u4ECE\u5927\u5230\u5C0F\u6DFB\u52A0\n  if (desktopUrl && lgDesktopUrl) parts.push(`${desktopUrl} 1920`)\n  if (laptopUrl && (desktopUrl || lgDesktopUrl)) parts.push(`${laptopUrl} 1440`)\n  if (tabletUrl && (laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${tabletUrl} 1024`)\n  if (mobileUrl && (tabletUrl || laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${mobileUrl} 768`)\n\n  return parts.length > 0 ? parts.join(', ') : undefined\n}\n\n/**\n * PromotionalBar - \u63A8\u5E7F\u680F\n *\n * @description \u63A8\u5E7F\u680F\n */\nconst PromotionalBar = React.forwardRef<HTMLDivElement, PromotionalBarProps>(\n  ({ classNames, data, className, ...rest }, ref) => {\n    const { locale = 'us', pageHandle } = useAiuiContext()\n    const { backgroundImage, theme = 'dark' } = data\n    const pictureSource = React.useMemo(() => {\n      return convertResponsiveImageToString(backgroundImage)\n    }, [backgroundImage])\n    return (\n      <div\n        ref={ref}\n        {...rest}\n        className={cn(\n          'laptop:h-[192px] lg-desktop:h-[240px] h-[240px] text-[#080A0F]',\n          {\n            'text-[#F5F6F7]': theme === 'dark',\n          },\n          classNames?.root,\n          className\n        )}\n      >\n        {/* \u63A8\u5E7F\u680F\u5185\u5BB9\u533A\u57DF - \u6839\u636E\u5177\u4F53\u4E1A\u52A1\u9700\u6C42\u5B9A\u5236 */}\n        <div className=\"promotional-bar-content rounded-card relative h-full overflow-hidden\">\n          <div\n            className={cn(\n              'laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4',\n              classNames?.content\n            )}\n          >\n            {data.contentTitle && (\n              <Heading className={cn('line-clamp-2 ', classNames?.title)} html={data.contentTitle} size={3} />\n            )}\n            {data.contentDesc && (\n              <p\n                className={cn(\n                  'laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] ',\n                  classNames?.description\n                )}\n                dangerouslySetInnerHTML={{ __html: data.contentDesc }}\n              />\n            )}\n            <div className=\"laptop:mt-4 mt-2\">\n              {data.buttonText && (\n                <Button\n                  as=\"a\"\n                  variant=\"link\"\n                  className={cn(\n                    '!p-0 text-[#F5F6F7]',\n                    {\n                      'text-[#080A0F]': theme === 'light',\n                    },\n                    classNames?.button\n                  )}\n                  href={trackUrlRef(\n                    getLocalizedPath(data.buttonLink || '', locale),\n                    `${pageHandle}_${componentType}_${componentName}`\n                  )}\n                  iconClassName=\"size-4\"\n                >\n                  {data.buttonText}\n                </Button>\n              )}\n            </div>\n          </div>\n          <Picture\n            source={pictureSource}\n            className=\"absolute inset-0 z-10 \"\n            imgClassName=\"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]\"\n          />\n        </div>\n      </div>\n    )\n  }\n)\n\nPromotionalBar.displayName = 'PromotionalBar'\nexport default withLayout(PromotionalBar)\n"],
-  "mappings": "aA4HU,OAOI,OAAAA,EAPJ,QAAAC,MAAA,oBA1HV,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,EAAS,UAAAC,EAAQ,WAAAC,MAAe,4BACzC,OAAS,cAAAC,MAAkB,yBAE3B,OAAS,oBAAAC,MAAwB,yBACjC,OAAS,kBAAAC,MAAsB,2BAC/B,OAAS,eAAAC,MAAmB,8BAiD5B,MAAMC,EAAgB,QAChBC,EAAgB,iBAKhBC,EAAkCC,GAA+E,CACrH,GAAI,CAACA,EAAiB,OAEtB,KAAM,CAAE,OAAAC,EAAQ,OAAAC,EAAQ,OAAAC,EAAQ,QAAAC,EAAS,UAAAC,CAAU,EAAIL,EACjDM,EAAkB,CAAC,EAGnBC,EAAUC,GACPA,GAAO,IAIVC,EAAeF,EAAOF,CAAS,EAC/BK,EAAaH,EAAOH,CAAO,EAC3BO,EAAYJ,EAAOJ,CAAM,EACzBS,EAAYL,EAAOL,CAAM,EACzBW,EAAYN,EAAON,CAAM,EAE/B,OAAIQ,EAAcH,EAAM,KAAKG,CAAY,EAChCC,EAAYJ,EAAM,KAAKI,CAAU,EACjCC,EAAWL,EAAM,KAAKK,CAAS,EAC/BC,EAAWN,EAAM,KAAKM,CAAS,EAC/BC,GAAWP,EAAM,KAAKO,CAAS,EAGpCH,GAAcD,GAAcH,EAAM,KAAK,GAAGI,CAAU,OAAO,EAC3DC,IAAcD,GAAcD,IAAeH,EAAM,KAAK,GAAGK,CAAS,OAAO,EACzEC,IAAcD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGM,CAAS,OAAO,EACtFC,IAAcD,GAAaD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGO,CAAS,MAAM,EAE/FP,EAAM,OAAS,EAAIA,EAAM,KAAK,IAAI,EAAI,MAC/C,EAOMQ,EAAiB1B,EAAM,WAC3B,CAAC,CAAE,WAAA2B,EAAY,KAAAC,EAAM,UAAAC,EAAW,GAAGC,CAAK,EAAGC,IAAQ,CACjD,KAAM,CAAE,OAAAC,EAAS,KAAM,WAAAC,CAAW,EAAI1B,EAAe,EAC/C,CAAE,gBAAAK,EAAiB,MAAAsB,EAAQ,MAAO,EAAIN,EACtCO,EAAgBnC,EAAM,QAAQ,IAC3BW,EAA+BC,CAAe,EACpD,CAACA,CAAe,CAAC,EACpB,OACEd,EAAC,OACC,IAAKiC,EACJ,GAAGD,EACJ,UAAW7B,EACT,iEACA,CACE,iBAAkBiC,IAAU,MAC9B,EACAP,GAAY,KACZE,CACF,EAGA,SAAA9B,EAAC,OAAI,UAAU,uEACb,UAAAA,EAAC,OACC,UAAWE,EACT,mLACA0B,GAAY,OACd,EAEC,UAAAC,EAAK,cACJ9B,EAACI,EAAA,CAAQ,UAAWD,EAAG,gBAAiB0B,GAAY,KAAK,EAAG,KAAMC,EAAK,aAAc,KAAM,EAAG,EAE/FA,EAAK,aACJ9B,EAAC,KACC,UAAWG,EACT,+GACA0B,GAAY,WACd,EACA,wBAAyB,CAAE,OAAQC,EAAK,WAAY,EACtD,EAEF9B,EAAC,OAAI,UAAU,mBACZ,SAAA8B,EAAK,YACJ9B,EAACK,EAAA,CACC,GAAG,IACH,QAAQ,OACR,UAAWF,EACT,sBACA,CACE,iBAAkBiC,IAAU,OAC9B,EACAP,GAAY,MACd,EACA,KAAMnB,EACJF,EAAiBsB,EAAK,YAAc,GAAII,CAAM,EAC9C,GAAGC,CAAU,IAAIxB,CAAa,IAAIC,CAAa,EACjD,EACA,cAAc,SAEb,SAAAkB,EAAK,WACR,EAEJ,GACF,EACA9B,EAACM,EAAA,CACC,OAAQ+B,EACR,UAAU,yBACV,aAAa,uFACf,GACF,EACF,CAEJ,CACF,EAEAT,EAAe,YAAc,iBAC7B,IAAOU,EAAQ/B,EAAWqB,CAAc",
-  "names": ["jsx", "jsxs", "React", "cn", "Heading", "Button", "Picture", "withLayout", "getLocalizedPath", "useAiuiContext", "trackUrlRef", "componentType", "componentName", "convertResponsiveImageToString", "backgroundImage", "mobile", "tablet", "laptop", "desktop", "lgDesktop", "parts", "getUrl", "media", "lgDesktopUrl", "desktopUrl", "laptopUrl", "tabletUrl", "mobileUrl", "PromotionalBar", "classNames", "data", "className", "rest", "ref", "locale", "pageHandle", "theme", "pictureSource", "PromotionalBar_default"]
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Heading, Button, Picture } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media, Theme } from '../../types/props.js'\nimport { getLocalizedPath } from '../../helpers/index.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\n\nconst componentType = 'image'\nconst componentName = 'promotional_bar'\nexport interface PromotionalBarSemanticName {\n  root: 'root'\n  content: 'content'\n  title: 'title'\n  description: 'description'\n  button: 'button'\n}\n\n/**\n * \u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u914D\u7F6E\n */\nexport interface ResponsiveBackgroundImage {\n  /** \u79FB\u52A8\u7AEF\u56FE\u7247 (<768px) */\n  mobile?: Media\n  /** \u5E73\u677F\u56FE\u7247 (768-1440px) */\n  tablet?: Media\n  /** \u7B14\u8BB0\u672C\u56FE\u7247 (1025-1440px) */\n  laptop?: Media\n  /** \u684C\u9762\u56FE\u7247 (1441-1920px) */\n  desktop?: Media\n  /** \u8D85\u5927\u684C\u9762\u56FE\u7247 (\u22651921px) */\n  lgDesktop?: Media\n}\n\n/**\n * PromotionalBar \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface PromotionalBarData {\n  theme: Theme\n  /** \u7EC4\u4EF6\u5185\u5BB9\u6807\u9898 */\n  contentTitle?: string\n  /** \u7EC4\u4EF6\u5185\u5BB9\u63CF\u8FF0 */\n  contentDesc?: string\n  /** \u6309\u94AE\u6587\u672C */\n  buttonText?: string\n  /** \u6309\u94AE\u94FE\u63A5 */\n  buttonLink?: string\n  /** \u80CC\u666F\u56FE\u7247 - \u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61 */\n  backgroundImage?: ResponsiveBackgroundImage\n}\n\nexport interface PromotionalBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: PromotionalBarData\n  classNames?: Partial<Record<keyof PromotionalBarSemanticName, string>>\n}\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u5BF9\u8C61\u8F6C\u6362\u4E3A Picture \u7EC4\u4EF6\u6240\u9700\u7684\u5B57\u7B26\u4E32\u683C\u5F0F\n */\nconst convertResponsiveImageToString = (backgroundImage: ResponsiveBackgroundImage | undefined): string | undefined => {\n  if (!backgroundImage) return undefined\n\n  const { mobile, tablet, laptop, desktop, lgDesktop } = backgroundImage\n  const parts: string[] = []\n\n  // \u8F85\u52A9\u51FD\u6570\uFF1A\u4ECE Media \u5BF9\u8C61\u4E2D\u63D0\u53D6 URL\n  const getUrl = (media: Media | undefined): string | undefined => {\n    return media?.url\n  }\n\n  // \u9ED8\u8BA4\u56FE\u7247\uFF08\u6700\u5927\u5C3A\u5BF8\uFF09\u653E\u5728\u6700\u524D\u9762\uFF0C\u4E0D\u9700\u8981\u65AD\u70B9\n  const lgDesktopUrl = getUrl(lgDesktop)\n  const desktopUrl = getUrl(desktop)\n  const laptopUrl = getUrl(laptop)\n  const tabletUrl = getUrl(tablet)\n  const mobileUrl = getUrl(mobile)\n\n  if (lgDesktopUrl) parts.push(lgDesktopUrl)\n  else if (desktopUrl) parts.push(desktopUrl)\n  else if (laptopUrl) parts.push(laptopUrl)\n  else if (tabletUrl) parts.push(tabletUrl)\n  else if (mobileUrl) parts.push(mobileUrl)\n\n  // \u6309\u65AD\u70B9\u4ECE\u5927\u5230\u5C0F\u6DFB\u52A0\n  if (desktopUrl && lgDesktopUrl) parts.push(`${desktopUrl} 1920`)\n  if (laptopUrl && (desktopUrl || lgDesktopUrl)) parts.push(`${laptopUrl} 1440`)\n  if (tabletUrl && (laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${tabletUrl} 1024`)\n  if (mobileUrl && (tabletUrl || laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${mobileUrl} 768`)\n\n  return parts.length > 0 ? parts.join(', ') : undefined\n}\n\n/**\n * PromotionalBar - \u63A8\u5E7F\u680F\n *\n * @description \u63A8\u5E7F\u680F\n */\nconst PromotionalBar = React.forwardRef<HTMLDivElement, PromotionalBarProps>(\n  ({ classNames, data, className, ...rest }, ref) => {\n    const { locale = 'us', trackingData } = useAiuiContext()\n    const { backgroundImage, theme = 'dark' } = data\n    const pictureSource = React.useMemo(() => {\n      return convertResponsiveImageToString(backgroundImage)\n    }, [backgroundImage])\n    const innerRef = React.useRef<HTMLDivElement>(null)\n\n    // \u66DD\u5149\u57CB\u70B9\n    useExposure(innerRef, {\n      componentType,\n      componentName,\n      componentTitle: data.contentTitle || '',\n      componentDescription: data.contentDesc || '',\n    })\n\n    return (\n      <div\n        ref={innerRef}\n        {...rest}\n        className={cn(\n          'laptop:h-[192px] lg-desktop:h-[240px] h-[240px] text-[#080A0F]',\n          {\n            'text-[#F5F6F7]': theme === 'dark',\n          },\n          classNames?.root,\n          className\n        )}\n      >\n        {/* \u63A8\u5E7F\u680F\u5185\u5BB9\u533A\u57DF - \u6839\u636E\u5177\u4F53\u4E1A\u52A1\u9700\u6C42\u5B9A\u5236 */}\n        <div className=\"promotional-bar-content rounded-card relative h-full overflow-hidden\">\n          <div\n            className={cn(\n              'laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4',\n              classNames?.content\n            )}\n          >\n            {data.contentTitle && (\n              <Heading className={cn('line-clamp-2 ', classNames?.title)} html={data.contentTitle} size={3} />\n            )}\n            {data.contentDesc && (\n              <p\n                className={cn(\n                  'laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] ',\n                  classNames?.description\n                )}\n                dangerouslySetInnerHTML={{ __html: data.contentDesc }}\n              />\n            )}\n            <div className=\"laptop:mt-4 mt-2\">\n              {data.buttonText && (\n                <Button\n                  as=\"a\"\n                  variant=\"link\"\n                  className={cn(\n                    '!p-0 text-[#F5F6F7]',\n                    {\n                      'text-[#080A0F]': theme === 'light',\n                    },\n                    classNames?.button\n                  )}\n                  href={trackUrlRef(\n                    getLocalizedPath(data.buttonLink || '', locale),\n                    `${trackingData?.contextHandle || ''}_${componentType}_${componentName}`\n                  )}\n                  iconClassName=\"size-4\"\n                  data-headless-type-name={`${componentType}#${componentName}`}\n                  data-headless-title-desc-button={`${data.contentTitle || ''}#${data.contentDesc || ''}#${data.buttonText || ''}`}\n                >\n                  {data.buttonText}\n                </Button>\n              )}\n            </div>\n          </div>\n          <Picture\n            source={pictureSource}\n            className=\"absolute inset-0 z-10 \"\n            imgClassName=\"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]\"\n          />\n        </div>\n      </div>\n    )\n  }\n)\n\nPromotionalBar.displayName = 'PromotionalBar'\nexport default withLayout(PromotionalBar)\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "React", "cn", "Heading", "Button", "Picture", "withLayout", "getLocalizedPath", "useAiuiContext", "useExposure", "trackUrlRef", "componentType", "componentName", "convertResponsiveImageToString", "backgroundImage", "mobile", "tablet", "laptop", "desktop", "lgDesktop", "parts", "getUrl", "media", "lgDesktopUrl", "desktopUrl", "laptopUrl", "tabletUrl", "mobileUrl", "PromotionalBar", "classNames", "data", "className", "rest", "ref", "locale", "trackingData", "theme", "pictureSource", "innerRef", "PromotionalBar_default"]
 }

package/dist/esm/biz-components/SecondaryBanner/SecondaryBannerCarousel.d.ts CHANGED Viewed

@@ -7,6 +7,7 @@ interface SecondaryBannerCarouselProps extends React.HTMLAttributes<HTMLElement>
     data: SecondaryBannerData;
     classNames?: Partial<Record<SecondaryBannerSemanticName, string>>;
     jumpOptions?: JumpOptions;
+    theme?: 'light' | 'dark';
 }
 /**
  * SecondaryBannerCarousel — arrows-only Navigation Swiper wrapping SecondaryBanner slides.

package/dist/esm/biz-components/SecondaryBanner/SecondaryBannerCarousel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,jsxs as o}from"react/jsx-runtime";import m,{useRef as w,useCallback as R,useState as T}from"react";import{Swiper as j,SwiperSlide as M}from"swiper/react";import{Navigation as b,Pagination as f,Autoplay as A}from"swiper/modules";import{cn as O}from"../../helpers/index.js";import P from"./index.js";import"swiper/css";import"swiper/css/navigation";import"swiper/css/pagination";const D=()=>o("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[e("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M23 13L16 20L23 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),E=()=>o("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[e("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M17 13L24 20L17 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),y=m.forwardRef(({data:c,className:h,classNames:g,jumpOptions:v,...S},x)=>{const i=c.items||[],r=c.carousel,s=w(null),[H,C]=T(0),d=w(i.map(()=>m.createRef())),_=(r?.showArrows??!0)&&i.length>1,p=r?.showDots??!0,l=r?.autoplaySeconds,k=l!==void 0?[b,f,A]:[b,f],L=l!==void 0?{delay:l*1e3,disableOnInteraction:!1}:!1,N=R(n=>{const t=n.realIndex;d.current.forEach((a,B)=>{B!==t&&a.current&&a.current.querySelectorAll("video").forEach(u=>{u.pause(),u.currentTime=0})}),C(t)},[]);return o("section",{ref:x,className:O("secondary-banner-carousel relative w-full overflow-hidden",h),...S,children:[e(j,{onSwiper:n=>s.current=n,onSlideChange:N,modules:k,slidesPerView:1,loop:r?.loop??!0,initialSlide:0,allowTouchMove:!0,autoplay:L,pagination:p?{clickable:!0,el:".secondary-banner-pagination",renderBullet:(n,t)=>`<span class="${t} banner-dot"></span>`}:!1,children:i.map((n,t)=>e(M,{children:({isActive:a})=>e("div",{ref:d.current[t],children:e(P,{data:n,isActive:a,classNames:g,jumpOptions:v})})},t))}),_&&o("div",{className:"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4",children:[e("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>s.current?.slidePrev(),"aria-label":"Previous banner",children:e(D,{})}),e("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>s.current?.slideNext(),"aria-label":"Next banner",children:e(E,{})})]}),p&&e("div",{className:"secondary-banner-pagination swiper-pagination tablet:bottom-6 absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot.swiper-pagination-bullet-active]:bg-[#080A0F] [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100"})]})});y.displayName="SecondaryBannerCarousel";var G=y;export{G as default};
+"use client";import{jsx as t,jsxs as d}from"react/jsx-runtime";import b,{useRef as h,useCallback as R,useState as O,useEffect as D}from"react";import{Swiper as I,SwiperSlide as P}from"swiper/react";import{Navigation as w,Pagination as y,Autoplay as z}from"swiper/modules";import{cn as H}from"../../helpers/index.js";import q from"./index.js";import{secondaryBannerVariants as V}from"./index.js";import"swiper/css";import"swiper/css/navigation";import"swiper/css/pagination";const J=()=>d("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),t("path",{d:"M23 13L16 20L23 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),W=()=>d("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[t("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),t("path",{d:"M17 13L24 20L17 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),v=b.forwardRef(({data:m,className:g,classNames:S,jumpOptions:x,theme:k,...C},L)=>{const i=m.items||[],p=m.carousel,_=i[0]?.size??"base",s=h(null),[B,N]=O(0),E=(k??i[B]?.theme??"light")==="dark";D(()=>{const n=()=>{const e=s.current;if(e)if(document.visibilityState==="hidden")e.autoplay?.stop();else{e.autoplay?.start();const a=e.realIndex??0;l.current.forEach((r,c)=>{r.current&&r.current.querySelectorAll("video").forEach(u=>{c!==a&&u.pause()})})}};return document.addEventListener("visibilitychange",n),()=>document.removeEventListener("visibilitychange",n)},[]);const l=h(i.map(()=>b.createRef())),T=(p?.showArrows??!0)&&i.length>1,f=p?.showDots??!0,o=p?.autoplaySeconds??void 0,M=o!=null&&o>0?[w,y,z]:[w,y],j=o!=null&&o>0?{delay:Math.max(o*1e3,3e3),disableOnInteraction:!1}:!1,A=R(n=>{const e=n.realIndex;l.current.forEach((r,c)=>{c!==e&&r.current&&r.current.querySelectorAll("video").forEach(u=>{u.pause(),u.currentTime=0})});const a=l.current[e];a?.current&&a.current.querySelectorAll("video").forEach(r=>{r.paused&&r.play()?.catch(()=>{})}),N(e)},[]);return d("section",{ref:L,className:H("secondary-banner-carousel relative w-full overflow-hidden",V({size:_}),{"aiui-dark":E},g),...C,children:[t(I,{onSwiper:n=>s.current=n,onSlideChange:A,modules:M,slidesPerView:1,loop:!0,initialSlide:0,allowTouchMove:!0,autoplay:j,pagination:f?{clickable:!0,el:".secondary-banner-pagination",renderBullet:(n,e)=>`<span class="${e} banner-dot"></span>`}:!1,children:i.map((n,e)=>t(P,{children:({isActive:a})=>t("div",{ref:l.current[e],children:t(q,{data:n,isActive:a,classNames:S,jumpOptions:x})})},e))}),T&&d("div",{className:"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4",children:[t("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>s.current?.slidePrev(),"aria-label":"Previous banner",children:t(J,{})}),t("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>s.current?.slideNext(),"aria-label":"Next banner",children:t(W,{})})]}),f&&t("div",{className:"secondary-banner-pagination swiper-pagination tablet:bottom-6 [&_.banner-dot.swiper-pagination-bullet-active]:bg-info-primary absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100"})]})});v.displayName="SecondaryBannerCarousel";var te=v;export{te as default};
 //# sourceMappingURL=SecondaryBannerCarousel.js.map

package/dist/esm/biz-components/SecondaryBanner/SecondaryBannerCarousel.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/SecondaryBanner/SecondaryBannerCarousel.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useRef, useCallback, useState } from 'react'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, Pagination, Autoplay } from 'swiper/modules'\nimport type { Swiper as SwiperType } from 'swiper'\nimport { cn } from '../../helpers/index.js'\nimport SecondaryBanner from './index.js'\nimport type { SecondaryBannerData, SecondaryBannerSemanticName, JumpOptions } from './index.js'\n\nimport 'swiper/css'\nimport 'swiper/css/navigation'\nimport 'swiper/css/pagination'\n\n// \u2500\u2500 Arrow icons \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\nconst ChevronLeft = () => (\n  <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n    <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n    <path d=\"M23 13L16 20L23 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\nconst ChevronRight = () => (\n  <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n    <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n    <path d=\"M17 13L24 20L17 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\n// \u2500\u2500 Props \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\ninterface SecondaryBannerCarouselProps extends React.HTMLAttributes<HTMLElement> {\n  data: SecondaryBannerData\n  classNames?: Partial<Record<SecondaryBannerSemanticName, string>>\n  jumpOptions?: JumpOptions\n}\n\n/**\n * SecondaryBannerCarousel \u2014 arrows-only Navigation Swiper wrapping SecondaryBanner slides.\n *\n * Architecture:\n *  - DECISION-A007: Navigation only, loop=false, slidesPerView=1\n *  - DECISION-A005: isActive pass-through to SecondaryBanner; querySelectorAll for video pause\n *  - DECISION-008:  SecondaryBanner.isActive => autoPlay={isActive ?? true}\n *  - DECISION-A006: arrow buttons at z-[20], above any overlay\n */\nconst SecondaryBannerCarousel = React.forwardRef<HTMLElement, SecondaryBannerCarouselProps>(\n  ({ data, className, classNames, jumpOptions, ...rest }, ref) => {\n    const items = data.items || []\n    const carousel = data.carousel\n\n    const swiperRef = useRef<SwiperType | null>(null)\n    const [_activeIndex, setActiveIndex] = useState(0)\n\n    // Slide container refs for imperative video pause via querySelectorAll (DECISION-A005)\n    // Used as defense-in-depth; isActive prop is the primary control mechanism.\n    const slideContainerRefs = useRef<React.RefObject<HTMLDivElement>[]>(\n      items.map(() => React.createRef<HTMLDivElement>())\n    )\n\n    // Arrow visibility formula \u2014 DECISION-011\n    const showArrowControls = (carousel?.showArrows ?? true) && items.length > 1\n\n    // Pagination dots visibility formula \u2014 DECISION-006\n    const showDots = carousel?.showDots ?? true\n\n    // Autoplay module configuration \u2014 DECISION-006\n    const autoplaySeconds = carousel?.autoplaySeconds\n    const swiperModules = autoplaySeconds !== undefined ? [Navigation, Pagination, Autoplay] : [Navigation, Pagination]\n    const autoplayConfig =\n      autoplaySeconds !== undefined ? { delay: autoplaySeconds * 1000, disableOnInteraction: false } : false\n\n    // Slide transition handler \u2014 pause inactive slide videos via querySelectorAll (DECISION-A005)\n    const handleSlideChange = useCallback((swiper: SwiperType) => {\n      const newIndex = swiper.realIndex\n      // Defense-in-depth: imperatively pause videos in inactive slides\n      slideContainerRefs.current.forEach((cRef, i) => {\n        if (i !== newIndex && cRef.current) {\n          cRef.current.querySelectorAll('video').forEach(v => {\n            v.pause()\n            v.currentTime = 0\n          })\n        }\n      })\n      setActiveIndex(newIndex)\n    }, [])\n\n    return (\n      <section\n        ref={ref}\n        className={cn('secondary-banner-carousel relative w-full overflow-hidden', className)}\n        {...rest}\n      >\n        <Swiper\n          onSwiper={s => (swiperRef.current = s)}\n          onSlideChange={handleSlideChange}\n          modules={swiperModules}\n          slidesPerView={1}\n          loop={carousel?.loop ?? true}\n          initialSlide={0}\n          allowTouchMove={true}\n          autoplay={autoplayConfig}\n          pagination={\n            showDots\n              ? {\n                  clickable: true,\n                  el: '.secondary-banner-pagination',\n                  renderBullet: (_index: number, className: string) => `<span class=\"${className} banner-dot\"></span>`,\n                }\n              : false\n          }\n        >\n          {items.map((slideData, index) => (\n            <SwiperSlide key={index}>\n              {({ isActive }) => (\n                <div ref={slideContainerRefs.current[index]}>\n                  <SecondaryBanner\n                    data={slideData}\n                    isActive={isActive}\n                    classNames={classNames}\n                    jumpOptions={jumpOptions}\n                  />\n                </div>\n              )}\n            </SwiperSlide>\n          ))}\n        </Swiper>\n\n        {/* Arrow navigation \u2014 z-[20] for consistency with HeroBannerCarousel \u2014 DECISION-A006 */}\n        {showArrowControls && (\n          <div className=\"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4\">\n            <button\n              type=\"button\"\n              className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n              onClick={() => swiperRef.current?.slidePrev()}\n              aria-label=\"Previous banner\"\n            >\n              <ChevronLeft />\n            </button>\n            <button\n              type=\"button\"\n              className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n              onClick={() => swiperRef.current?.slideNext()}\n              aria-label=\"Next banner\"\n            >\n              <ChevronRight />\n            </button>\n          </div>\n        )}\n\n        {/* Pagination dots \u2014 visible on all devices */}\n        {showDots && (\n          <div className=\"secondary-banner-pagination swiper-pagination tablet:bottom-6 absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot.swiper-pagination-bullet-active]:bg-[#080A0F] [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100\" />\n        )}\n      </section>\n    )\n  }\n)\n\nSecondaryBannerCarousel.displayName = 'SecondaryBannerCarousel'\n\nexport default SecondaryBannerCarousel\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "React", "useRef", "useCallback", "useState", "Swiper", "SwiperSlide", "Navigation", "Pagination", "Autoplay", "cn", "SecondaryBanner", "ChevronLeft", "ChevronRight", "SecondaryBannerCarousel", "data", "className", "classNames", "jumpOptions", "rest", "ref", "items", "carousel", "swiperRef", "_activeIndex", "setActiveIndex", "slideContainerRefs", "showArrowControls", "showDots", "autoplaySeconds", "swiperModules", "autoplayConfig", "handleSlideChange", "swiper", "newIndex", "cRef", "i", "v", "s", "_index", "slideData", "index", "isActive", "SecondaryBannerCarousel_default"]
+  "sourcesContent": ["'use client'\nimport React, { useRef, useCallback, useState, useEffect } from 'react'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, Pagination, Autoplay } from 'swiper/modules'\nimport type { Swiper as SwiperType } from 'swiper'\nimport { cn } from '../../helpers/index.js'\nimport SecondaryBanner from './index.js'\nimport type { SecondaryBannerData, SecondaryBannerSemanticName, JumpOptions } from './index.js'\nimport { secondaryBannerVariants } from './index.js'\n\nimport 'swiper/css'\nimport 'swiper/css/navigation'\nimport 'swiper/css/pagination'\n\n// \u2500\u2500 Arrow icons \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\nconst ChevronLeft = () => (\n  <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n    <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n    <path d=\"M23 13L16 20L23 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\nconst ChevronRight = () => (\n  <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n    <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n    <path d=\"M17 13L24 20L17 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n)\n\n// \u2500\u2500 Props \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\ninterface SecondaryBannerCarouselProps extends React.HTMLAttributes<HTMLElement> {\n  data: SecondaryBannerData\n  classNames?: Partial<Record<SecondaryBannerSemanticName, string>>\n  jumpOptions?: JumpOptions\n  theme?: 'light' | 'dark'\n}\n\n/**\n * SecondaryBannerCarousel \u2014 arrows-only Navigation Swiper wrapping SecondaryBanner slides.\n *\n * Architecture:\n *  - DECISION-A007: Navigation only, loop=false, slidesPerView=1\n *  - DECISION-A005: isActive pass-through to SecondaryBanner; querySelectorAll for video pause\n *  - DECISION-008:  SecondaryBanner.isActive => autoPlay={isActive ?? true}\n *  - DECISION-A006: arrow buttons at z-[20], above any overlay\n */\nconst SecondaryBannerCarousel = React.forwardRef<HTMLElement, SecondaryBannerCarouselProps>(\n  ({ data, className, classNames, jumpOptions, theme, ...rest }, ref) => {\n    const items = data.items || []\n    const carousel = data.carousel\n    const containerSize = items[0]?.size ?? 'base'\n\n    const swiperRef = useRef<SwiperType | null>(null)\n    const [activeIndex, setActiveIndex] = useState(0)\n\n    const activeTheme = theme ?? items[activeIndex]?.theme ?? 'light'\n    const isDark = activeTheme === 'dark'\n\n    useEffect(() => {\n      const handleVisibilityChange = () => {\n        const swiper = swiperRef.current\n        if (!swiper) return\n\n        if (document.visibilityState === 'hidden') {\n          swiper.autoplay?.stop()\n        } else {\n          swiper.autoplay?.start()\n          const currentIndex = swiper.realIndex ?? 0\n          slideContainerRefs.current.forEach((cRef, i) => {\n            if (!cRef.current) return\n            cRef.current.querySelectorAll('video').forEach(v => {\n              if (i !== currentIndex) v.pause()\n            })\n          })\n        }\n      }\n      document.addEventListener('visibilitychange', handleVisibilityChange)\n      return () => document.removeEventListener('visibilitychange', handleVisibilityChange)\n    }, [])\n\n    // Slide container refs for imperative video pause via querySelectorAll (DECISION-A005)\n    const slideContainerRefs = useRef<React.RefObject<HTMLDivElement>[]>(\n      items.map(() => React.createRef<HTMLDivElement>())\n    )\n\n    // Arrow visibility formula \u2014 DECISION-011\n    const showArrowControls = (carousel?.showArrows ?? true) && items.length > 1\n\n    // Pagination dots visibility formula \u2014 DECISION-006\n    const showDots = carousel?.showDots ?? true\n\n    // Autoplay module configuration \u2014 DECISION-006\n    const autoplaySeconds = carousel?.autoplaySeconds ?? undefined\n    const swiperModules =\n      autoplaySeconds != null && autoplaySeconds > 0 ? [Navigation, Pagination, Autoplay] : [Navigation, Pagination]\n    const autoplayConfig =\n      autoplaySeconds != null && autoplaySeconds > 0\n        ? { delay: Math.max(autoplaySeconds * 1000, 3000), disableOnInteraction: false }\n        : false\n\n    const handleSlideChange = useCallback((swiper: SwiperType) => {\n      const newIndex = swiper.realIndex\n      slideContainerRefs.current.forEach((cRef, i) => {\n        if (i !== newIndex && cRef.current) {\n          cRef.current.querySelectorAll('video').forEach(v => {\n            v.pause()\n            v.currentTime = 0\n          })\n        }\n      })\n      const activeContainer = slideContainerRefs.current[newIndex]\n      if (activeContainer?.current) {\n        activeContainer.current.querySelectorAll('video').forEach(v => {\n          if (v.paused) {\n            const p = v.play()\n            p?.catch(() => {})\n          }\n        })\n      }\n      setActiveIndex(newIndex)\n    }, [])\n\n    return (\n      <section\n        ref={ref}\n        className={cn(\n          'secondary-banner-carousel relative w-full overflow-hidden',\n          secondaryBannerVariants({ size: containerSize }),\n          { 'aiui-dark': isDark },\n          className\n        )}\n        {...rest}\n      >\n        <Swiper\n          onSwiper={s => (swiperRef.current = s)}\n          onSlideChange={handleSlideChange}\n          modules={swiperModules}\n          slidesPerView={1}\n          loop={true}\n          initialSlide={0}\n          allowTouchMove={true}\n          autoplay={autoplayConfig}\n          pagination={\n            showDots\n              ? {\n                  clickable: true,\n                  el: '.secondary-banner-pagination',\n                  renderBullet: (_index: number, className: string) => `<span class=\"${className} banner-dot\"></span>`,\n                }\n              : false\n          }\n        >\n          {items.map((slideData, index) => (\n            <SwiperSlide key={index}>\n              {({ isActive }) => (\n                <div ref={slideContainerRefs.current[index]}>\n                  <SecondaryBanner\n                    data={slideData}\n                    isActive={isActive}\n                    classNames={classNames}\n                    jumpOptions={jumpOptions}\n                  />\n                </div>\n              )}\n            </SwiperSlide>\n          ))}\n        </Swiper>\n\n        {/* Arrow navigation \u2014 z-[20] for consistency with HeroBannerCarousel \u2014 DECISION-A006 */}\n        {showArrowControls && (\n          <div className=\"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4\">\n            <button\n              type=\"button\"\n              className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n              onClick={() => swiperRef.current?.slidePrev()}\n              aria-label=\"Previous banner\"\n            >\n              <ChevronLeft />\n            </button>\n            <button\n              type=\"button\"\n              className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n              onClick={() => swiperRef.current?.slideNext()}\n              aria-label=\"Next banner\"\n            >\n              <ChevronRight />\n            </button>\n          </div>\n        )}\n\n        {/* Pagination dots \u2014 visible on all devices */}\n        {showDots && (\n          <div className=\"secondary-banner-pagination swiper-pagination tablet:bottom-6 [&_.banner-dot.swiper-pagination-bullet-active]:bg-info-primary absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100\" />\n        )}\n      </section>\n    )\n  }\n)\n\nSecondaryBannerCarousel.displayName = 'SecondaryBannerCarousel'\n\nexport default SecondaryBannerCarousel\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "React", "useRef", "useCallback", "useState", "useEffect", "Swiper", "SwiperSlide", "Navigation", "Pagination", "Autoplay", "cn", "SecondaryBanner", "secondaryBannerVariants", "ChevronLeft", "ChevronRight", "SecondaryBannerCarousel", "data", "className", "classNames", "jumpOptions", "theme", "rest", "ref", "items", "carousel", "containerSize", "swiperRef", "activeIndex", "setActiveIndex", "isDark", "handleVisibilityChange", "swiper", "currentIndex", "slideContainerRefs", "cRef", "i", "v", "showArrowControls", "showDots", "autoplaySeconds", "swiperModules", "autoplayConfig", "handleSlideChange", "newIndex", "activeContainer", "s", "_index", "slideData", "index", "isActive", "SecondaryBannerCarousel_default"]
 }

package/dist/esm/biz-components/SecondaryBanner/index.d.ts CHANGED Viewed

@@ -64,6 +64,9 @@ export interface JumpOptions {
     /** 是否考虑 a11y @default false */
     a11y?: boolean;
 }
+export declare const secondaryBannerVariants: (props?: ({
+    size?: "base" | "lg" | "sm" | "xlg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 /**
  * SecondaryBanner 业务组件数据接口
  */
@@ -128,6 +131,12 @@ export interface SecondaryBannerData {
      * Single-banner mode is used when absent or empty (DECISION-002).
      */
     items?: SecondaryBannerSlideData[];
+    /**
+     * Display mode: 'single' renders the first frame only; 'carousel' activates Swiper.
+     * Mirrors the CMS `mode` field (single | carousel). Defaults to single-banner path
+     * when absent (backward-compatible with legacy data that has no mode field).
+     */
+    mode?: 'single' | 'carousel';
     /**
      * Carousel navigation configuration.
      * Only meaningful when data.items is present and has 2+ items.

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

@@ -1,2 +1,2 @@
-"use client";import{jsx as t,jsxs as p}from"react/jsx-runtime";import*as v from"react";import{cva as J}from"class-variance-authority";import T from"jump.js";import{cn as n,getLocalizedPath as I}from"../../helpers/index.js";import{Text as S,Button as C,Heading as R,Picture as V,Countdown as F}from"../../components/index.js";import{withLayout as W}from"../../shared/Styles.js";import _ from"../Media/index.js";import{useAiuiContext as $}from"../AiuiProvider/index.js";import q from"./SecondaryBannerCarousel.js";const G=J("text-info-primary relative w-full",{variants:{size:{sm:"tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]",base:"tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]",lg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]",xlg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible"}},defaultVariants:{size:"base"}}),M=v.forwardRef(({className:u,classNames:a={},data:e,jumpOptions:g={},isActive:z,...b},y)=>{const{pcImage:D,padImage:N,mobileImage:A,isVideoLoop:L=!0,endDate:f,endDate_tz:O,dateFormat:P,size:c="base",iconArray:m,theme:w="light",primaryButton:o,secondaryButton:i,title:j,titleTag:H="h1"}=e,{locale:x="us"}=$(),k={...{duration:500,offset:0},...g},d=v.useId(),l=j?`${d}-title`:void 0,h=e.subtitle?`${d}-subtitle`:void 0,B=e.superTitle?`${d}-super-title`:void 0,E=[B,h].filter(Boolean).join(" ")||void 0;return e.items&&e.items.length>0?t(q,{data:e,className:u,classNames:a,jumpOptions:g,ref:y,...b}):p("section",{ref:y,role:"banner","aria-labelledby":l,"aria-describedby":E,className:n({"aiui-dark":w==="dark"},G({size:c}),u,a?.root),...b,children:[t(_,{pcImage:D,padImage:N,mobileImage:A,className:n("absolute inset-0 size-full object-cover",{"h-fit":c==="xlg"}),imgClassName:"object-cover",videoClassName:"object-cover",muted:!0,loop:L,playsInline:!0,autoPlay:z??!0}),p("div",{className:n("banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left",a?.content),children:[p("div",{className:"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1",children:[e.superTitle&&t(S,{as:"p",size:2,id:B,className:n("banner-super-title desktop:text-[16px] lg-desktop:text-[18px]",a?.superTitle),html:e.superTitle}),e.title&&t(R,{as:H,size:["xlg","lg"].includes(c)?5:4,id:l,className:n("banner-title ",a?.title),html:e.title}),e.subtitle&&t(S,{as:"p",size:3,id:h,className:n("banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]",a?.subtitle),html:e.subtitle})]}),f&&t("div",{className:"banner-countdown",children:t(F,{endDate:f,endDate_tz:O,dateFormat:P,variant:"spacious",className:"lg-desktop:mt-8 mt-6"})}),p("div",{className:n("banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2",a?.buttonGroup),children:[i?.text&&t(C,{variant:"secondary",onClick:s=>{if(i.link?.startsWith("#")){s.preventDefault();const r=document.querySelector(i.link);r&&T(r,k)}i.onClick?.()},className:n("",a?.secondaryButton),"aria-describedby":l,...i.link&&!i.link.startsWith("#")?{as:"a",href:I(i.link,x)}:{},children:i.text}),o?.text&&t(C,{onClick:s=>{if(o.link?.startsWith("#")){s.preventDefault();const r=document.querySelector(o.link);r&&T(r,k)}o.onClick?.()},className:n("",a?.primaryButton),"aria-describedby":l,...o.link&&!o.link.startsWith("#")?{as:"a",href:I(o.link,x)}:{},children:o.text})]}),Array.isArray(m)&&m.length>0&&t("div",{className:"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2",role:"group","aria-label":"brand icons",children:m.map((s,r)=>s.pcImage?t(V,{source:s.pcImage.url,alt:s.pcImage.alt||`icon ${r+1}`,role:"img",className:"laptop:h-auto h-[48px] max-w-none",imgClassName:"h-full"},r):null)})]})]})});M.displayName="SecondaryBanner";var ne=W(M);export{ne as default};
+"use client";import{jsx as t,jsxs as c}from"react/jsx-runtime";import*as T from"react";import{cva as R}from"class-variance-authority";import v from"jump.js";import{cn as n,getLocalizedPath as I}from"../../helpers/index.js";import{Text as S,Button as _,Heading as F,Picture as W,Countdown as q}from"../../components/index.js";import{withLayout as G}from"../../shared/Styles.js";import K from"../Media/index.js";import{useAiuiContext as Q}from"../AiuiProvider/index.js";import U from"./SecondaryBannerCarousel.js";const X=R("text-info-primary relative w-full",{variants:{size:{sm:"tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]",base:"tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]",lg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]",xlg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible"}},defaultVariants:{size:"base"}}),z=T.forwardRef(({className:g,classNames:a={},data:e,jumpOptions:b={},isActive:C,...l},y)=>{const{pcImage:M,padImage:D,mobileImage:N,isVideoLoop:L,endDate:f,endDate_tz:A,dateFormat:O,size:P,iconArray:d,theme:w,primaryButton:o,secondaryButton:i,title:j,titleTag:H}=e,V=L??!0,m=P??"base",E=w??"light",J=H??"h1",{locale:k="us"}=Q(),x={...{duration:500,offset:0},...b},u=T.useId(),p=j?`${u}-title`:void 0,h=e.subtitle?`${u}-subtitle`:void 0,B=e.superTitle?`${u}-super-title`:void 0,$=[B,h].filter(Boolean).join(" ")||void 0;return e.mode==="carousel"&&e.items&&e.items.length>0?t(U,{data:e,className:g,classNames:a,jumpOptions:b,theme:e.theme??e.items?.[0]?.theme,ref:y,...l}):c("section",{ref:y,role:"banner","aria-labelledby":p,"aria-describedby":$,className:n({"aiui-dark":E==="dark"},X({size:m}),g,a?.root),...l,children:[t("div",{className:n("absolute inset-0",{"h-fit":m==="xlg"}),children:t(K,{pcImage:M,padImage:D,mobileImage:N,className:"size-full",imgClassName:"object-cover",videoClassName:"object-cover",muted:!0,loop:V,playsInline:!0,autoPlay:C??!0})}),c("div",{className:n("banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left",a?.content),children:[c("div",{className:"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1",children:[e.superTitle&&t(S,{as:"p",size:2,id:B,className:n("banner-super-title desktop:text-[16px] lg-desktop:text-[18px]",a?.superTitle),html:e.superTitle}),e.title&&t(F,{as:J,size:["xlg","lg"].includes(m)?5:4,id:p,className:n("banner-title ",a?.title),html:e.title}),e.subtitle&&t(S,{as:"p",size:3,id:h,className:n("banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]",a?.subtitle),html:e.subtitle})]}),f&&t("div",{className:"banner-countdown",children:t(q,{endDate:f,endDate_tz:A,dateFormat:O,variant:"spacious",className:"lg-desktop:mt-8 mt-6"})}),c("div",{className:n("banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2",a?.buttonGroup),children:[i?.text&&t(_,{variant:"secondary","data-track":l.id?`${l.id}_secondary_button_click`:"SecondaryBanner_secondary_button_click",onClick:s=>{if(i.link?.startsWith("#")){s.preventDefault();const r=document.querySelector(i.link);r&&v(r,x)}i.onClick?.()},className:n("",a?.secondaryButton),"aria-describedby":p,...i.link&&!i.link.startsWith("#")?{as:"a",href:I(i.link,k)}:{},children:i.text}),o?.text&&t(_,{"data-track":l.id?`${l.id}_primary_button_click`:"SecondaryBanner_primary_button_click",onClick:s=>{if(o.link?.startsWith("#")){s.preventDefault();const r=document.querySelector(o.link);r&&v(r,x)}o.onClick?.()},className:n("",a?.primaryButton),"aria-describedby":p,...o.link&&!o.link.startsWith("#")?{as:"a",href:I(o.link,k)}:{},children:o.text})]}),Array.isArray(d)&&d.length>0&&t("div",{className:"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2",role:"group","aria-label":"brand icons",children:d.map((s,r)=>s.pcImage?t(W,{source:s.pcImage.url,alt:s.pcImage.alt||`icon ${r+1}`,role:"img",className:"laptop:h-auto h-[48px] max-w-none",imgClassName:"h-full"},r):null)})]})]})});z.displayName="SecondaryBanner";var se=G(z);export{se as default,X as secondaryBannerVariants};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/SecondaryBanner/index.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cva } from 'class-variance-authority'\nimport jump from 'jump.js'\nimport { cn, getLocalizedPath } from '../../helpers/index.js'\nimport type { Media as MediaType, Theme } from '../../types/props.js'\nimport { Text, Button, Heading, Picture, Countdown } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Media from '../Media/index.js'\nimport type { ButtonProps } from '../../components/button.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\n// Task 15: static import (no require()) for carousel delegation (DECISION-002)\nimport SecondaryBannerCarouselImpl from './SecondaryBannerCarousel.js'\n\nexport type SecondaryBannerSemanticName =\n  | 'root'\n  | 'title'\n  | 'superTitle'\n  | 'subtitle'\n  | 'content'\n  | 'buttonGroup'\n  | 'primaryButton'\n  | 'secondaryButton'\n\n/**\n * Carousel navigation configuration for SecondaryBanner. v1: arrows only.\n * autoplay, dots, and progress are intentionally EXCLUDED from v1.\n */\nexport interface SecondaryBannerCarouselConfig {\n  /**\n   * Show prev/next arrow navigation controls.\n   * Only used when data.items has 2+ slides.\n   * @default true\n   */\n  showArrows?: boolean\n  showDots?: boolean\n  loop?: boolean\n  autoplaySeconds?: number\n}\n\n/**\n * Per-slide data for SecondaryBanner carousel mode.\n * All fields optional (mirrors SecondaryBannerData permissiveness).\n */\nexport interface SecondaryBannerSlideData {\n  title?: string\n  titleTag?: 'h1' | 'h2'\n  superTitle?: string\n  subtitle?: string\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  isVideoLoop?: boolean\n  endDate?: string\n  endDate_tz?: string\n  dateFormat?: string\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n}\n/**\n * jump.js \u914D\u7F6E\u9009\u9879\n */\nexport interface JumpOptions {\n  /** \u52A8\u753B\u6301\u7EED\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09 @default 500 */\n  duration?: number\n  /** \u504F\u79FB\u91CF\uFF08\u50CF\u7D20\uFF09 @default 0 */\n  offset?: number\n  /** \u52A8\u753B\u5B8C\u6210\u56DE\u8C03 */\n  callback?: () => void\n  /** \u7F13\u52A8\u51FD\u6570 */\n  easing?: (t: number, b: number, c: number, d: number) => number\n  /** \u662F\u5426\u8003\u8651 a11y @default false */\n  a11y?: boolean\n}\n\nconst secondaryBannerVariants = cva(\n  // \u57FA\u7840\u6837\u5F0F\n  'text-info-primary relative w-full',\n  {\n    variants: {\n      size: {\n        sm: 'tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]',\n        base: 'tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]',\n        lg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]',\n        xlg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible',\n      },\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\n/**\n * SecondaryBanner \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface SecondaryBannerData {\n  /** \u4E3B\u6807\u9898*/\n  title?: string\n  /**\n   * \u4E3B\u6807\u9898\u6807\u7B7E\n   * @default 'h1'\n   */\n  titleTag?: 'h1' | 'h2'\n  /**\n   * \u4E0A\u6807\u9898/\u5F15\u5BFC\u6807\u9898\n   * \u901A\u5E38\u7528\u4E8E\u5206\u7C7B\u3001\u5F15\u5BFC\u6027\u6587\u5B57\n   */\n  superTitle?: string\n  /**\n   * \u526F\u6807\u9898/\u63CF\u8FF0\u6587\u5B57\n   * \u901A\u5E38\u7528\u4E8E\u8865\u5145\u8BF4\u660E\u3001\u8BE6\u7EC6\u63CF\u8FF0\n   */\n  subtitle?: string\n  /**\n   * \u5C3A\u5BF8:\n   *  sm: \u5C0F\u5C3A\u5BF8\u7528\u4E8E\u7B5B\u9009\u9875\u9762\n   *  base: \u57FA\u7840\u5C3A\u5BF8\u7528\u4E8E\n   *  lg: \u5927\u5C3A\u5BF8\u7528\u4E8E\u4E13\u9898\u9875\n   *  xlg: \u6D3B\u52A8\u9875\uFF08\u901A\u680F\uFF09\n   */\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  /** \u89C6\u9891\u662F\u5426\u5FAA\u73AF\u64AD\u653E */\n  isVideoLoop?: boolean\n  /** \u7ED3\u675F\u65F6\u95F4\uFF08ISO \u5B57\u7B26\u4E32\uFF09 */\n  endDate?: string\n  /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF08\u5982: America/Los_Angeles\uFF09 */\n  endDate_tz?: string\n  /**\n   * \u65F6\u95F4\u683C\u5F0F\u5316\u914D\u7F6E\uFF08JSON \u5B57\u7B26\u4E32\uFF09\n   * {\"day\":\"\u65E5\",\"hour\":\"\u65F6\",\"minute\":\"\u5206\",\"second\":\"\u79D2\"}\n   */\n  dateFormat?: string\n\n  /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  /** \u6B21\u7EA7\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n  /**\n   * Carousel slide items. When present and non-empty, activates carousel mode.\n   * Single-banner mode is used when absent or empty (DECISION-002).\n   */\n  items?: SecondaryBannerSlideData[]\n  /**\n   * Carousel navigation configuration.\n   * Only meaningful when data.items is present and has 2+ items.\n   */\n  carousel?: SecondaryBannerCarouselConfig\n}\n\nexport interface SecondaryBannerProps extends React.HTMLAttributes<HTMLElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: SecondaryBannerData\n  classNames?: Partial<Record<SecondaryBannerSemanticName, string>>\n  /**\n   * \u951A\u70B9\u8DF3\u8F6C\u914D\u7F6E\uFF08\u7528\u4E8E # \u5F00\u5934\u7684\u94FE\u63A5\uFF09\n   * @default { duration: 500, offset: 0 }\n   */\n  jumpOptions?: JumpOptions\n  /**\n   * Whether this banner is the active slide in a carousel.\n   * Controls video autoPlay: autoPlay={isActive ?? true}.\n   * When absent (legacy single-banner), defaults to true (DECISION-008).\n   * @default true\n   */\n  isActive?: boolean\n}\n\n/**\n * SecondaryBanner - \u6B21\u7EA7\u6A2A\u5E45banner\n *\n * @description \u662F\u6307\u7528\u6237\u8FDB\u5165\u4E8C\u7EA7\u9875\u9762\u540E\uFF0C\u65E0\u9700\u6EDA\u52A8\u9875\u9762\u5C31\u80FD\u5728\u7B2C\u4E00\u5C4F\uFF08\u5373\"\u9996\u5C4F\"\uFF09\u770B\u5230\u7684\u3001\u901A\u5E38\u6A2A\u8DE8\u6574\u4E2A\u6D4F\u89C8\u5668\u7A97\u53E3\u5BBD\u5EA6\u7684\u6838\u5FC3\u89C6\u89C9\u533A\u57DF\u3002\n */\nconst SecondaryBanner = React.forwardRef<HTMLElement, SecondaryBannerProps>(\n  ({ className, classNames = {}, data, jumpOptions = {}, isActive, ...props }, ref) => {\n    const {\n      pcImage,\n      padImage,\n      mobileImage,\n      isVideoLoop = true,\n      endDate,\n      endDate_tz,\n      dateFormat,\n      size = 'base',\n      iconArray: icons,\n      theme = 'light',\n      primaryButton,\n      secondaryButton,\n      title,\n      titleTag = 'h1',\n    } = data\n\n    // Hooks must be called unconditionally before any early return (React rules)\n    const { locale = 'us' } = useAiuiContext()\n\n    const defaultJumpOptions: JumpOptions = { duration: 500, offset: 0 }\n    const mergedJumpOptions = { ...defaultJumpOptions, ...jumpOptions }\n\n    const bannerId = React.useId()\n    const titleId = title ? `${bannerId}-title` : undefined\n    const subtitleId = data.subtitle ? `${bannerId}-subtitle` : undefined\n    const superTitleId = data.superTitle ? `${bannerId}-super-title` : undefined\n    const describedBy = [superTitleId, subtitleId].filter(Boolean).join(' ') || undefined\n\n    // Task 15: Carousel mode early return AFTER all hooks (DECISION-002 / DECISION-A008)\n    if (data.items && data.items.length > 0) {\n      return (\n        <SecondaryBannerCarouselImpl\n          data={data}\n          className={className}\n          classNames={classNames}\n          jumpOptions={jumpOptions}\n          ref={ref}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <section\n        ref={ref}\n        role=\"banner\"\n        aria-labelledby={titleId}\n        aria-describedby={describedBy}\n        className={cn(\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          secondaryBannerVariants({ size: size }),\n          className,\n          classNames?.root\n        )}\n        {...props}\n      >\n        <Media\n          pcImage={pcImage}\n          padImage={padImage}\n          mobileImage={mobileImage}\n          className={cn('absolute inset-0 size-full object-cover', {\n            'h-fit': size === 'xlg',\n          })}\n          imgClassName=\"object-cover\"\n          videoClassName=\"object-cover\"\n          muted={true}\n          loop={isVideoLoop}\n          playsInline={true}\n          autoPlay={isActive ?? true}\n        />\n        <div\n          className={cn(\n            'banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left',\n            classNames?.content\n          )}\n        >\n          <div className=\"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1\">\n            {data.superTitle && (\n              <Text\n                as=\"p\"\n                size={2}\n                id={superTitleId}\n                className={cn('banner-super-title desktop:text-[16px] lg-desktop:text-[18px]', classNames?.superTitle)}\n                html={data.superTitle}\n              />\n            )}\n\n            {data.title && (\n              <Heading\n                as={titleTag}\n                size={['xlg', 'lg'].includes(size) ? 5 : 4}\n                id={titleId}\n                className={cn('banner-title ', classNames?.title)}\n                html={data.title}\n              />\n            )}\n\n            {data.subtitle && (\n              <Text\n                as=\"p\"\n                size={3}\n                id={subtitleId}\n                className={cn('banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]', classNames?.subtitle)}\n                html={data.subtitle}\n              />\n            )}\n          </div>\n\n          {endDate && (\n            <div className=\"banner-countdown\">\n              <Countdown\n                endDate={endDate}\n                endDate_tz={endDate_tz}\n                dateFormat={dateFormat}\n                variant=\"spacious\"\n                className=\"lg-desktop:mt-8 mt-6\"\n              />\n            </div>\n          )}\n\n          <div\n            className={cn(\n              'banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2',\n              classNames?.buttonGroup\n            )}\n          >\n            {secondaryButton?.text && (\n              <Button\n                variant=\"secondary\"\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  if (secondaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(secondaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  secondaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.secondaryButton)}\n                aria-describedby={titleId}\n                {...(secondaryButton.link && !secondaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(secondaryButton.link, locale) }\n                  : {})}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton?.text && (\n              <Button\n                onClick={e => {\n                  if (primaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(primaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  primaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.primaryButton)}\n                aria-describedby={titleId}\n                {...(primaryButton.link && !primaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(primaryButton.link, locale) }\n                  : {})}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n\n          {Array.isArray(icons) && icons.length > 0 && (\n            <div\n              className=\"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2\"\n              role=\"group\"\n              aria-label=\"brand icons\"\n            >\n              {icons.map((icon, index) =>\n                icon.pcImage ? (\n                  <Picture\n                    key={index}\n                    source={icon.pcImage.url}\n                    alt={icon.pcImage.alt || `icon ${index + 1}`}\n                    role=\"img\"\n                    className=\"laptop:h-auto h-[48px] max-w-none\"\n                    imgClassName=\"h-full\"\n                  />\n                ) : null\n              )}\n            </div>\n          )}\n        </div>\n      </section>\n    )\n  }\n)\n\nSecondaryBanner.displayName = 'SecondaryBanner'\nexport default withLayout(SecondaryBanner)\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "React", "cva", "jump", "cn", "getLocalizedPath", "Text", "Button", "Heading", "Picture", "Countdown", "withLayout", "Media", "useAiuiContext", "SecondaryBannerCarouselImpl", "secondaryBannerVariants", "SecondaryBanner", "className", "classNames", "data", "jumpOptions", "isActive", "props", "ref", "pcImage", "padImage", "mobileImage", "isVideoLoop", "endDate", "endDate_tz", "dateFormat", "size", "icons", "theme", "primaryButton", "secondaryButton", "title", "titleTag", "locale", "mergedJumpOptions", "bannerId", "titleId", "subtitleId", "superTitleId", "describedBy", "e", "element", "icon", "index", "SecondaryBanner_default"]
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cva } from 'class-variance-authority'\nimport jump from 'jump.js'\nimport { cn, getLocalizedPath } from '../../helpers/index.js'\nimport type { Media as MediaType, Theme } from '../../types/props.js'\nimport { Text, Button, Heading, Picture, Countdown } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Media from '../Media/index.js'\nimport type { ButtonProps } from '../../components/button.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport SecondaryBannerCarouselImpl from './SecondaryBannerCarousel.js'\n\nexport type SecondaryBannerSemanticName =\n  | 'root'\n  | 'title'\n  | 'superTitle'\n  | 'subtitle'\n  | 'content'\n  | 'buttonGroup'\n  | 'primaryButton'\n  | 'secondaryButton'\n\n/**\n * Carousel navigation configuration for SecondaryBanner. v1: arrows only.\n * autoplay, dots, and progress are intentionally EXCLUDED from v1.\n */\nexport interface SecondaryBannerCarouselConfig {\n  /**\n   * Show prev/next arrow navigation controls.\n   * Only used when data.items has 2+ slides.\n   * @default true\n   */\n  showArrows?: boolean\n  showDots?: boolean\n  loop?: boolean\n  autoplaySeconds?: number\n}\n\n/**\n * Per-slide data for SecondaryBanner carousel mode.\n * All fields optional (mirrors SecondaryBannerData permissiveness).\n */\nexport interface SecondaryBannerSlideData {\n  title?: string\n  titleTag?: 'h1' | 'h2'\n  superTitle?: string\n  subtitle?: string\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  isVideoLoop?: boolean\n  endDate?: string\n  endDate_tz?: string\n  dateFormat?: string\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n}\n/**\n * jump.js \u914D\u7F6E\u9009\u9879\n */\nexport interface JumpOptions {\n  /** \u52A8\u753B\u6301\u7EED\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09 @default 500 */\n  duration?: number\n  /** \u504F\u79FB\u91CF\uFF08\u50CF\u7D20\uFF09 @default 0 */\n  offset?: number\n  /** \u52A8\u753B\u5B8C\u6210\u56DE\u8C03 */\n  callback?: () => void\n  /** \u7F13\u52A8\u51FD\u6570 */\n  easing?: (t: number, b: number, c: number, d: number) => number\n  /** \u662F\u5426\u8003\u8651 a11y @default false */\n  a11y?: boolean\n}\n\nexport const secondaryBannerVariants = cva(\n  // \u57FA\u7840\u6837\u5F0F\n  'text-info-primary relative w-full',\n  {\n    variants: {\n      size: {\n        sm: 'tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]',\n        base: 'tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]',\n        lg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]',\n        xlg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible',\n      },\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\n/**\n * SecondaryBanner \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface SecondaryBannerData {\n  /** \u4E3B\u6807\u9898*/\n  title?: string\n  /**\n   * \u4E3B\u6807\u9898\u6807\u7B7E\n   * @default 'h1'\n   */\n  titleTag?: 'h1' | 'h2'\n  /**\n   * \u4E0A\u6807\u9898/\u5F15\u5BFC\u6807\u9898\n   * \u901A\u5E38\u7528\u4E8E\u5206\u7C7B\u3001\u5F15\u5BFC\u6027\u6587\u5B57\n   */\n  superTitle?: string\n  /**\n   * \u526F\u6807\u9898/\u63CF\u8FF0\u6587\u5B57\n   * \u901A\u5E38\u7528\u4E8E\u8865\u5145\u8BF4\u660E\u3001\u8BE6\u7EC6\u63CF\u8FF0\n   */\n  subtitle?: string\n  /**\n   * \u5C3A\u5BF8:\n   *  sm: \u5C0F\u5C3A\u5BF8\u7528\u4E8E\u7B5B\u9009\u9875\u9762\n   *  base: \u57FA\u7840\u5C3A\u5BF8\u7528\u4E8E\n   *  lg: \u5927\u5C3A\u5BF8\u7528\u4E8E\u4E13\u9898\u9875\n   *  xlg: \u6D3B\u52A8\u9875\uFF08\u901A\u680F\uFF09\n   */\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  /** \u89C6\u9891\u662F\u5426\u5FAA\u73AF\u64AD\u653E */\n  isVideoLoop?: boolean\n  /** \u7ED3\u675F\u65F6\u95F4\uFF08ISO \u5B57\u7B26\u4E32\uFF09 */\n  endDate?: string\n  /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF08\u5982: America/Los_Angeles\uFF09 */\n  endDate_tz?: string\n  /**\n   * \u65F6\u95F4\u683C\u5F0F\u5316\u914D\u7F6E\uFF08JSON \u5B57\u7B26\u4E32\uFF09\n   * {\"day\":\"\u65E5\",\"hour\":\"\u65F6\",\"minute\":\"\u5206\",\"second\":\"\u79D2\"}\n   */\n  dateFormat?: string\n\n  /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  /** \u6B21\u7EA7\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n  /**\n   * Carousel slide items. When present and non-empty, activates carousel mode.\n   * Single-banner mode is used when absent or empty (DECISION-002).\n   */\n  items?: SecondaryBannerSlideData[]\n  /**\n   * Display mode: 'single' renders the first frame only; 'carousel' activates Swiper.\n   * Mirrors the CMS `mode` field (single | carousel). Defaults to single-banner path\n   * when absent (backward-compatible with legacy data that has no mode field).\n   */\n  mode?: 'single' | 'carousel'\n  /**\n   * Carousel navigation configuration.\n   * Only meaningful when data.items is present and has 2+ items.\n   */\n  carousel?: SecondaryBannerCarouselConfig\n}\n\nexport interface SecondaryBannerProps extends React.HTMLAttributes<HTMLElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: SecondaryBannerData\n  classNames?: Partial<Record<SecondaryBannerSemanticName, string>>\n  /**\n   * \u951A\u70B9\u8DF3\u8F6C\u914D\u7F6E\uFF08\u7528\u4E8E # \u5F00\u5934\u7684\u94FE\u63A5\uFF09\n   * @default { duration: 500, offset: 0 }\n   */\n  jumpOptions?: JumpOptions\n  /**\n   * Whether this banner is the active slide in a carousel.\n   * Controls video autoPlay: autoPlay={isActive ?? true}.\n   * When absent (legacy single-banner), defaults to true (DECISION-008).\n   * @default true\n   */\n  isActive?: boolean\n}\n\n/**\n * SecondaryBanner - \u6B21\u7EA7\u6A2A\u5E45banner\n *\n * @description \u662F\u6307\u7528\u6237\u8FDB\u5165\u4E8C\u7EA7\u9875\u9762\u540E\uFF0C\u65E0\u9700\u6EDA\u52A8\u9875\u9762\u5C31\u80FD\u5728\u7B2C\u4E00\u5C4F\uFF08\u5373\"\u9996\u5C4F\"\uFF09\u770B\u5230\u7684\u3001\u901A\u5E38\u6A2A\u8DE8\u6574\u4E2A\u6D4F\u89C8\u5668\u7A97\u53E3\u5BBD\u5EA6\u7684\u6838\u5FC3\u89C6\u89C9\u533A\u57DF\u3002\n */\nconst SecondaryBanner = React.forwardRef<HTMLElement, SecondaryBannerProps>(\n  ({ className, classNames = {}, data, jumpOptions = {}, isActive, ...props }, ref) => {\n    const {\n      pcImage,\n      padImage,\n      mobileImage,\n      isVideoLoop: _isVideoLoop,\n      endDate,\n      endDate_tz,\n      dateFormat,\n      size: _size,\n      iconArray: icons,\n      theme: _theme,\n      primaryButton,\n      secondaryButton,\n      title,\n      titleTag: _titleTag,\n    } = data\n\n    const isVideoLoop = _isVideoLoop ?? true\n    const size = _size ?? 'base'\n    const theme = _theme ?? 'light'\n    const titleTag = _titleTag ?? 'h1'\n\n    // Hooks must be called unconditionally before any early return (React rules)\n    const { locale = 'us' } = useAiuiContext()\n\n    const defaultJumpOptions: JumpOptions = { duration: 500, offset: 0 }\n    const mergedJumpOptions = { ...defaultJumpOptions, ...jumpOptions }\n\n    const bannerId = React.useId()\n    const titleId = title ? `${bannerId}-title` : undefined\n    const subtitleId = data.subtitle ? `${bannerId}-subtitle` : undefined\n    const superTitleId = data.superTitle ? `${bannerId}-super-title` : undefined\n    const describedBy = [superTitleId, subtitleId].filter(Boolean).join(' ') || undefined\n\n    // Task 15: Carousel mode early return AFTER all hooks (DECISION-002 / DECISION-A008)\n    if (data.mode === 'carousel' && data.items && data.items.length > 0) {\n      return (\n        <SecondaryBannerCarouselImpl\n          data={data}\n          className={className}\n          classNames={classNames}\n          jumpOptions={jumpOptions}\n          theme={data.theme ?? data.items?.[0]?.theme}\n          ref={ref}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <section\n        ref={ref}\n        role=\"banner\"\n        aria-labelledby={titleId}\n        aria-describedby={describedBy}\n        className={cn(\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          secondaryBannerVariants({ size: size }),\n          className,\n          classNames?.root\n        )}\n        {...props}\n      >\n        <div className={cn('absolute inset-0', { 'h-fit': size === 'xlg' })}>\n          <Media\n            pcImage={pcImage}\n            padImage={padImage}\n            mobileImage={mobileImage}\n            className=\"size-full\"\n            imgClassName=\"object-cover\"\n            videoClassName=\"object-cover\"\n            muted={true}\n            loop={isVideoLoop}\n            playsInline={true}\n            autoPlay={isActive ?? true}\n          />\n        </div>\n        <div\n          className={cn(\n            'banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left',\n            classNames?.content\n          )}\n        >\n          <div className=\"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1\">\n            {data.superTitle && (\n              <Text\n                as=\"p\"\n                size={2}\n                id={superTitleId}\n                className={cn('banner-super-title desktop:text-[16px] lg-desktop:text-[18px]', classNames?.superTitle)}\n                html={data.superTitle}\n              />\n            )}\n\n            {data.title && (\n              <Heading\n                as={titleTag}\n                size={['xlg', 'lg'].includes(size) ? 5 : 4}\n                id={titleId}\n                className={cn('banner-title ', classNames?.title)}\n                html={data.title}\n              />\n            )}\n\n            {data.subtitle && (\n              <Text\n                as=\"p\"\n                size={3}\n                id={subtitleId}\n                className={cn('banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]', classNames?.subtitle)}\n                html={data.subtitle}\n              />\n            )}\n          </div>\n\n          {endDate && (\n            <div className=\"banner-countdown\">\n              <Countdown\n                endDate={endDate}\n                endDate_tz={endDate_tz}\n                dateFormat={dateFormat}\n                variant=\"spacious\"\n                className=\"lg-desktop:mt-8 mt-6\"\n              />\n            </div>\n          )}\n\n          <div\n            className={cn(\n              'banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2',\n              classNames?.buttonGroup\n            )}\n          >\n            {secondaryButton?.text && (\n              <Button\n                variant=\"secondary\"\n                data-track={props.id ? `${props.id}_secondary_button_click` : 'SecondaryBanner_secondary_button_click'}\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  if (secondaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(secondaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  secondaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.secondaryButton)}\n                aria-describedby={titleId}\n                {...(secondaryButton.link && !secondaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(secondaryButton.link, locale) }\n                  : {})}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton?.text && (\n              <Button\n                data-track={props.id ? `${props.id}_primary_button_click` : 'SecondaryBanner_primary_button_click'}\n                onClick={e => {\n                  if (primaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(primaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  primaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.primaryButton)}\n                aria-describedby={titleId}\n                {...(primaryButton.link && !primaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(primaryButton.link, locale) }\n                  : {})}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n\n          {Array.isArray(icons) && icons.length > 0 && (\n            <div\n              className=\"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2\"\n              role=\"group\"\n              aria-label=\"brand icons\"\n            >\n              {icons.map((icon, index) =>\n                icon.pcImage ? (\n                  <Picture\n                    key={index}\n                    source={icon.pcImage.url}\n                    alt={icon.pcImage.alt || `icon ${index + 1}`}\n                    role=\"img\"\n                    className=\"laptop:h-auto h-[48px] max-w-none\"\n                    imgClassName=\"h-full\"\n                  />\n                ) : null\n              )}\n            </div>\n          )}\n        </div>\n      </section>\n    )\n  }\n)\n\nSecondaryBanner.displayName = 'SecondaryBanner'\nexport default withLayout(SecondaryBanner)\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "React", "cva", "jump", "cn", "getLocalizedPath", "Text", "Button", "Heading", "Picture", "Countdown", "withLayout", "Media", "useAiuiContext", "SecondaryBannerCarouselImpl", "secondaryBannerVariants", "SecondaryBanner", "className", "classNames", "data", "jumpOptions", "isActive", "props", "ref", "pcImage", "padImage", "mobileImage", "_isVideoLoop", "endDate", "endDate_tz", "dateFormat", "_size", "icons", "_theme", "primaryButton", "secondaryButton", "title", "_titleTag", "isVideoLoop", "size", "theme", "titleTag", "locale", "mergedJumpOptions", "bannerId", "titleId", "subtitleId", "superTitleId", "describedBy", "e", "element", "icon", "index", "SecondaryBanner_default"]
 }

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

@@ -1,2 +1,2 @@
-"use client";import{jsx as l,jsxs as be}from"react/jsx-runtime";import ne,{useState as L,useEffect as y,useRef as g,useImperativeHandle as se}from"react";import{cn as ae}from"../../helpers/utils.js";import{Tabs as re,TabsList as ie,TabsTrigger as oe}from"../../components/tabs.js";import le from"../Title/index.js";import ce from"../SwiperBox/index.js";import{withLayout as me}from"../../shared/Styles.js";import{gaTrack as V}from"../../shared/track.js";import{useMediaQuery as fe}from"react-responsive";import{useRollout as pe}from"../../hooks/useRollout.js";import{ShelfDisplayWrapItem as ue,ShelfDisplayHorizontalItem as de}from"./shelfDisplayItem.js";const he="image",ge="product_shelf",we=f=>f==null?"default":String(f).replace(/[^a-zA-Z0-9_-]/g,"")||"default",_e=()=>`shelf-display-${Math.random().toString(36).slice(2,9)}`,B=ne.forwardRef(({key:f,data:p,event:E,buildData:T,breakpoints:N,className:z="",recommendedData:i,target:A="_self",metafields:$,isDisplayGudgments:S=!1,isDisplayBackImage:q=!1,onAddCart:O,onBuyNow:K,onLearnMore:Q,...W},Z)=>{const{productsTab:a=[],productsCard:v=[],title:k,isShowTab:u=!0,tabShape:j="square",isShowTag:F=!1,isShowOriginalPrice:G=!0,isShowRecommendedCard:I=!1,...J}=p,[d,R]=L(""),[r,w]=L([]),D=g(!1),_=g(!1),M=g(null),U=g(_e()),X=fe({query:"(max-width: 768px)"}),[Y,x]=pe({threshold:0}),h=r?.length<=1&&S,c=!X&&r?.length<=2&&S,b=e=>{switch(e){case 1440:return c?r?.length:4;case 1024:return c?r?.length:3;default:return c?r?.length:2.3}},P=()=>{V({event:"ga4Event",event_name:"view_item_list",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:i?.map((e,t)=>{const s=e?.variants?.find(n=>n?.sku===e?.sku)||e?.variants?.[0];return{item_id:e?.sku||s?.sku,item_name:e?.name,item_variant:s?.name,price:s?.price,index:t+1}})}})},m=(e,t)=>{if(t){const o=i?.map?.(s=>({...s,isShowRecommended:!0}));w(o?.length?o||[]:[])}else if(Array.isArray(e)){const s=e?.map?.(n=>{const H=T?.products?.find(te=>te?.handle===n?.handle);if(H)return{sku:n.sku,isShowRecommended:!1,custom_name:n.custom_name,custom_description:n.custom_description,custom_image:n.custom_image,custom_theme:n.custom_theme,custom_primary_link:n?.custom_primary_link||"",custom_secondary_link:n?.custom_secondary_link||"",...H}})?.filter(n=>n);w(s?.length?s||[]:[])}else w([])};se(Z,()=>M.current),y(()=>{x&&i?.length&&!D.current&&(D.current=!0,P())},[x,i]),y(()=>{if(!_.current){if(!_.current&&i?.length&&(_.current=!0),u){const e=a?.find(t=>t?.tab===d)||a?.[0];R(e?.tab||""),m(e?.data||[],e?.isShowRecommendedTab);return}m(v,I)}},[i]),y(()=>{if(u){const e=a?.find(t=>t?.tab===d)||a?.[0];m(e?.data||[],e?.isShowRecommendedTab);return}m(v,I)},[T]);const ee=we(d),C=`${U.current}-${ee}`;return be("div",{ref:M,...W,className:ae("shelf-display-wrap text-info-primary w-full",z,{"aiui-dark":p?.theme==="dark"}),children:[k&&l(le,{data:{title:k}}),u&&a?.length>0&&l(re,{value:d,onValueChange:e=>{const t=a?.find(o=>o?.tab===e);if(t){if(R(e),m(t.data||[],t.isShowRecommendedTab),!t.isShowRecommendedTab){V({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:he,component_name:ge,component_title:p?.title,component_position:1,navigation:e}});return}P()}},shape:j==="rounded"?"rounded":"square",children:l(ie,{children:a.map(e=>l(oe,{value:e?.tab,children:e?.tab||""},e?.id||e?.tab))})}),l("div",{ref:Y,className:"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]",children:l(ce,{data:{list:r,configuration:{...J,event:E,isShowTag:F,isShowOriginalPrice:G,target:A,metafields:$,itemLength:r?.length,isDisplayBackImage:q,onAddCart:O,onBuyNow:K,onLearnMore:Q}},id:C,className:`${u?"mt-6":""} shelf-display-swiper-box !overflow-visible`,itemClassName:c?"flex-1":"",Slide:c?de:ue,breakpoints:N||{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:h?1:1.2},768:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:b()},1024:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:b(1024)},1440:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:b(1440)}}},C)})]})});B.displayName="ShelfDisplay";var Pe=me(B);export{Pe as default};
+"use client";import{jsx as l,jsxs as be}from"react/jsx-runtime";import se,{useState as L,useEffect as y,useRef as g,useImperativeHandle as ne}from"react";import{cn as ae}from"../../helpers/utils.js";import{Tabs as re,TabsList as ie,TabsTrigger as oe}from"../../components/tabs.js";import le from"../Title/index.js";import ce from"../SwiperBox/index.js";import{withLayout as me}from"../../shared/Styles.js";import{gaTrack as V}from"../../shared/track.js";import{useMediaQuery as fe}from"react-responsive";import{useRollout as pe}from"../../hooks/useRollout.js";import{ShelfDisplayWrapItem as ue,ShelfDisplayHorizontalItem as de}from"./shelfDisplayItem.js";const he="image",ge="product_shelf",_e=f=>f==null?"default":String(f).replace(/[^a-zA-Z0-9_-]/g,"")||"default",we=()=>`shelf-display-${Math.random().toString(36).slice(2,9)}`,B=se.forwardRef(({key:f,data:p,event:E,buildData:T,breakpoints:N,className:z="",recommendedData:i,target:A="_self",metafields:$,isDisplayGudgments:S=!1,isDisplayBackImage:q=!1,onAddCart:O,onBuyNow:K,onLearnMore:Q,...W},Z)=>{const{productsTab:a=[],productsCard:v=[],title:k,isShowTab:u=!0,tabShape:j="square",isShowTag:F=!1,isShowOriginalPrice:G=!0,isShowRecommendedCard:I=!1,...J}=p,[d,R]=L(""),[r,_]=L([]),D=g(!1),w=g(!1),M=g(null),U=g(we()),X=fe({query:"(max-width: 768px)"}),[Y,x]=pe({threshold:0}),h=r?.length<=1&&S,c=!X&&r?.length<=2&&S,b=e=>{switch(e){case 1440:return c?r?.length:4;case 1024:return c?r?.length:3;default:return c?r?.length:2.3}},P=()=>{V({event:"ga4Event",event_name:"view_item_list",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:i?.map((e,s)=>{const n=e?.variants?.find(t=>t?.sku===e?.sku)||e?.variants?.[0];return{item_id:e?.sku||n?.sku,item_name:e?.name,item_variant:n?.name,price:n?.price,index:s+1}})}})},m=(e,s)=>{if(s){const o=i?.map?.(n=>({...n,isShowRecommended:!0}));_(o?.length?o||[]:[])}else if(Array.isArray(e)){const n=e?.map?.(t=>{const H=T?.products?.find(te=>te?.handle===t?.handle);if(H)return{sku:t.sku,isShowRecommended:!1,custom_name:t.custom_name,custom_description:t.custom_description,custom_image:t.custom_image,custom_theme:t.custom_theme,custom_primary_link:t?.custom_primary_link||"",custom_secondary_link:t?.custom_secondary_link||"",custom_bg_image:t?.custom_bg_image||"",...H}})?.filter(t=>t);_(n?.length?n||[]:[])}else _([])};ne(Z,()=>M.current),y(()=>{x&&i?.length&&!D.current&&(D.current=!0,P())},[x,i]),y(()=>{if(!w.current){if(!w.current&&i?.length&&(w.current=!0),u){const e=a?.find(s=>s?.tab===d)||a?.[0];R(e?.tab||""),m(e?.data||[],e?.isShowRecommendedTab);return}m(v,I)}},[i]),y(()=>{if(u){const e=a?.find(s=>s?.tab===d)||a?.[0];m(e?.data||[],e?.isShowRecommendedTab);return}m(v,I)},[T]);const ee=_e(d),C=`${U.current}-${ee}`;return be("div",{ref:M,...W,className:ae("shelf-display-wrap text-info-primary w-full",z,{"aiui-dark":p?.theme==="dark"}),children:[k&&l(le,{data:{title:k}}),u&&a?.length>0&&l(re,{value:d,onValueChange:e=>{const s=a?.find(o=>o?.tab===e);if(s){if(R(e),m(s.data||[],s.isShowRecommendedTab),!s.isShowRecommendedTab){V({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:he,component_name:ge,component_title:p?.title,component_position:1,navigation:e}});return}P()}},shape:j==="rounded"?"rounded":"square",children:l(ie,{children:a.map(e=>l(oe,{value:e?.tab,children:e?.tab||""},e?.id||e?.tab))})}),l("div",{ref:Y,className:"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]",children:l(ce,{data:{list:r,configuration:{...J,event:E,isShowTag:F,isShowOriginalPrice:G,target:A,metafields:$,itemLength:r?.length,isDisplayBackImage:q,onAddCart:O,onBuyNow:K,onLearnMore:Q}},id:C,className:`${u?"mt-6":""} shelf-display-swiper-box !overflow-visible`,itemClassName:c?"flex-1":"",Slide:c?de:ue,breakpoints:N||{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:h?1:1.2},768:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:b()},1024:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:b(1024)},1440:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:b(1440)}}},C)})]})});B.displayName="ShelfDisplay";var Pe=me(B);export{Pe as default};
 //# sourceMappingURL=index.js.map