@anker-in/headless-ui 0.0.28-alpha.1 → 0.0.29

package/dist/cjs/biz-components/AccordionCards/index.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var j=Object.create;var d=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var W=(e,i)=>{for(var s in i)d(e,s,{get:i[s],enumerable:!0})},E=(e,i,s,u)=>{if(i&&typeof i=="object"||typeof i=="function")for(let a of $(i))!z.call(e,a)&&a!==s&&d(e,a,{get:()=>i[a],enumerable:!(u=V(i,a))||u.enumerable});return e};var p=(e,i,s)=>(s=e!=null?j(q(e)):{},E(i||!e||!e.__esModule?d(s,"default",{value:e,enumerable:!0}):s,e)),U=e=>E(d({},"__esModule",{value:!0}),e);var J={};W(J,{default:()=>G});module.exports=U(J);var t=require("react/jsx-runtime"),B=p(require("../Title/index.js")),l=require("../../helpers/utils.js"),h=p(require("../../components/picture.js")),y=p(require("../../components/button.js")),_=p(require("../SwiperBox/index.js")),M=require("../../shared/Styles.js"),n=p(require("react")),C=require("../../hooks/useExposure.js"),x=require("../../shared/trackUrlRef.js"),S=require("../../shared/track.js");const f="image",v="scene_banner",F=n.default.forwardRef(({data:e,className:i="",event:s},u)=>{const[a,H]=(0,n.useState)(0),[L,I]=(0,n.useState)({0:!0}),k=(0,n.useRef)([]),g=(0,n.useRef)({0:!0}),c=(0,n.useRef)(!1),b=(0,n.useRef)(null);(0,n.useImperativeHandle)(u,()=>b.current),(0,C.useExposure)(b,{componentType:f,componentName:v,componentTitle:e?.title});const R=(r,o)=>{o&&(k.current[r]=o)},w=r=>{g.current?.[r]&&(c.current=!1,I({[r]:!0}))};(0,n.useEffect)(()=>{const r=k.current;return r?.forEach((o,m)=>{m?(o.style.flex="1 1 0%",o.style.transition="all 0.6s"):(o.style.flex="8 1 0%",o.style.transition="all 0.6s"),o.addEventListener("transitionend",()=>{w(m)})}),()=>{r?.forEach((o,m)=>{o.removeEventListener("transitionend",()=>w(m))})}},[]);const A=({data:r,configuration:o})=>(0,t.jsxs)("div",{className:(0,l.cn)("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",o?.itemShape==="round"?"rounded-2xl":""),children:[(0,t.jsx)(h.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:r?.img?.url}),(0,t.jsxs)("div",{className:(0,l.cn)("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[(0,t.jsxs)("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:r?.title}),(0,t.jsx)("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:(0,x.trackUrlRef)(r.link,`${f}_${v}`),onClick:()=>o?.event?.primaryButton(r,o),children:(0,t.jsx)(y.default,{variant:"secondary",className:(0,l.cn)("text-info-primary text-sm font-bold"),children:o?.primaryButton})})]})]}),N=(0,n.useCallback)(r=>{a===r||c.current||(c.current=!0,g.current={[r]:!0},H(r),(0,S.gaTrack)({event:"ga4Event",eventName:"component_click",event_parameters:{page_group:"Home Page",component_type:f,component_name:v,component_title:e?.products[r]?.title,component_description:e?.products[r]?.subTitle,position:r+1}}))},[a,c]);return(0,t.jsxs)(t.Fragment,{children:[e?.title&&(0,t.jsx)(B.default,{data:{title:e?.title}}),(0,t.jsx)("div",{ref:b,className:(0,l.cn)("laptop:block hidden",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)("div",{className:(0,l.cn)("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",i),children:e?.products?.map((r,o)=>{const m=a===o,D=m?8:1,P=L?.[o]&&m;return(0,t.jsxs)("div",{style:{flex:D},ref:T=>{T&&R(o,T)},className:(0,l.cn)("relative cursor-pointer overflow-hidden",e?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>N(o),onMouseLeave:()=>{c.current=!1},onClick:()=>N(o),children:[(0,t.jsx)(h.default,{source:r?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),(0,t.jsxs)("div",{className:(0,l.cn)("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",P?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[(0,t.jsxs)("div",{className:"mr-16 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:r?.title}),(0,t.jsx)("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:(0,x.trackUrlRef)(r?.link,`${f}_${v}`),onClick:()=>s?.primaryButton?.(e,o),children:(0,t.jsx)(y.default,{variant:"secondary",className:(0,l.cn)("desktop:text-base mb-1.5 text-sm font-bold"),children:e?.primaryButton})})]})]},o)})})}),(0,t.jsx)("div",{className:(0,l.cn)("laptop:hidden block",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)(_.default,{className:(0,l.cn)("h-[400px] !overflow-visible",i),id:"AccordionCards"+e?.key,data:{list:e?.products,configuration:{shape:e?.shape,itemShape:e?.itemShape,primaryButton:e?.primaryButton,event:s}},Slide:A,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3}}})})]})});var G=(0,M.withStyles)(F);
+"use strict";"use client";var j=Object.create;var d=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var W=(e,i)=>{for(var s in i)d(e,s,{get:i[s],enumerable:!0})},E=(e,i,s,u)=>{if(i&&typeof i=="object"||typeof i=="function")for(let a of $(i))!z.call(e,a)&&a!==s&&d(e,a,{get:()=>i[a],enumerable:!(u=V(i,a))||u.enumerable});return e};var p=(e,i,s)=>(s=e!=null?j(q(e)):{},E(i||!e||!e.__esModule?d(s,"default",{value:e,enumerable:!0}):s,e)),U=e=>E(d({},"__esModule",{value:!0}),e);var J={};W(J,{default:()=>G});module.exports=U(J);var t=require("react/jsx-runtime"),B=p(require("../Title/index.js")),l=require("../../helpers/utils.js"),h=p(require("../../components/picture.js")),y=p(require("../../components/button.js")),_=p(require("../SwiperBox/index.js")),M=require("../../shared/Styles.js"),n=p(require("react")),C=require("../../hooks/useExposure.js"),x=require("../../shared/trackUrlRef.js"),S=require("../../shared/track.js");const f="image",v="scene_banner",F=n.default.forwardRef(({data:e,className:i="",event:s},u)=>{const[a,H]=(0,n.useState)(0),[L,I]=(0,n.useState)({0:!0}),k=(0,n.useRef)([]),g=(0,n.useRef)({0:!0}),c=(0,n.useRef)(!1),b=(0,n.useRef)(null);(0,n.useImperativeHandle)(u,()=>b.current),(0,C.useExposure)(b,{componentType:f,componentName:v,componentTitle:e?.title});const R=(r,o)=>{o&&(k.current[r]=o)},w=r=>{g.current?.[r]&&(c.current=!1,I({[r]:!0}))};(0,n.useEffect)(()=>{const r=k.current;return r?.forEach((o,m)=>{m?(o.style.flex="1 1 0%",o.style.transition="all 0.6s"):(o.style.flex="8 1 0%",o.style.transition="all 0.6s"),o.addEventListener("transitionend",()=>{w(m)})}),()=>{r?.forEach((o,m)=>{o.removeEventListener("transitionend",()=>w(m))})}},[]);const A=({data:r,configuration:o})=>(0,t.jsxs)("div",{className:(0,l.cn)("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",o?.itemShape==="round"?"rounded-2xl":""),children:[(0,t.jsx)(h.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:r?.img?.url}),(0,t.jsxs)("div",{className:(0,l.cn)("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[(0,t.jsxs)("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:r?.title}),(0,t.jsx)("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:(0,x.trackUrlRef)(r.link,`${f}_${v}`),onClick:()=>o?.event?.primaryButton(r,o),children:(0,t.jsx)(y.default,{variant:"secondary",className:(0,l.cn)("text-info-primary text-sm font-bold"),children:o?.primaryButton})})]})]}),T=(0,n.useCallback)(r=>{a===r||c.current||(c.current=!0,g.current={[r]:!0},H(r),(0,S.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:f,component_name:v,component_title:e?.products[r]?.title,component_description:e?.products[r]?.subTitle,position:r+1}}))},[a,c]);return(0,t.jsxs)(t.Fragment,{children:[e?.title&&(0,t.jsx)(B.default,{data:{title:e?.title}}),(0,t.jsx)("div",{ref:b,className:(0,l.cn)("laptop:block hidden",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)("div",{className:(0,l.cn)("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",i),children:e?.products?.map((r,o)=>{const m=a===o,D=m?8:1,P=L?.[o]&&m;return(0,t.jsxs)("div",{style:{flex:D},ref:N=>{N&&R(o,N)},className:(0,l.cn)("relative cursor-pointer overflow-hidden",e?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>T(o),onMouseLeave:()=>{c.current=!1},onClick:()=>T(o),children:[(0,t.jsx)(h.default,{source:r?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),(0,t.jsxs)("div",{className:(0,l.cn)("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",P?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[(0,t.jsxs)("div",{className:"mr-16 flex-1 overflow-hidden",children:[(0,t.jsx)("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:r?.title}),(0,t.jsx)("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:r?.subTitle})]}),(0,t.jsx)("a",{href:(0,x.trackUrlRef)(r?.link,`${f}_${v}`),onClick:()=>s?.primaryButton?.(e,o),children:(0,t.jsx)(y.default,{variant:"secondary",className:(0,l.cn)("desktop:text-base mb-1.5 text-sm font-bold"),children:e?.primaryButton})})]})]},o)})})}),(0,t.jsx)("div",{className:(0,l.cn)("laptop:hidden block",{"aiui-dark":e?.theme==="dark"}),children:(0,t.jsx)(_.default,{className:(0,l.cn)("h-[400px] !overflow-visible",i),id:"AccordionCards"+e?.key,data:{list:e?.products,configuration:{shape:e?.shape,itemShape:e?.itemShape,primaryButton:e?.primaryButton,event:s}},Slide:A,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3}}})})]})});var G=(0,M.withStyles)(F);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/AccordionCards/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/AccordionCards/index.tsx"],
-  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback, useImperativeHandle } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { gaTrack } from '../../shared/track.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: {\n    url: string\n  }\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n}\n\ntype AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(({ data, className = '', event }, ref) => {\n  const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n  const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({ 0: true })\n\n  const accordionRef = useRef<HTMLDivElement[]>([])\n  const enterRef = useRef<{ [key: number]: boolean }>({ 0: true })\n  const isAnimation = useRef<boolean>(false)\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n  })\n\n  const getRef = (index: number, el: HTMLDivElement) => {\n    if (el) {\n      accordionRef.current[index] = el\n    }\n  }\n\n  const handleTransitionEnd = (index: number) => {\n    if (enterRef.current?.[index]) {\n      isAnimation.current = false\n      setCurrentWidth({ [index]: true })\n    }\n  }\n\n  useEffect(() => {\n    const element = accordionRef.current\n    element?.forEach((item, index) => {\n      if (!index) {\n        item.style.flex = '8 1 0%'\n        item.style.transition = 'all 0.6s'\n      } else {\n        item.style.flex = '1 1 0%'\n        item.style.transition = 'all 0.6s'\n      }\n      item.addEventListener('transitionend', () => {\n        handleTransitionEnd(index)\n      })\n    })\n    return () => {\n      element?.forEach((item, index) => {\n        item.removeEventListener('transitionend', () => handleTransitionEnd(index))\n      })\n    }\n  }, [])\n\n  const MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n    return (\n      <div\n        className={cn(\n          'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n          configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n        )}\n      >\n        <Picture className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" source={data?.img?.url} />\n        <div className={cn('absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4')}>\n          <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n            <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n            <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n          </div>\n          <a\n            href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n            onClick={() => configuration?.event?.primaryButton(data, configuration)}\n          >\n            <Button variant=\"secondary\" className={cn('text-info-primary text-sm font-bold')}>\n              {configuration?.primaryButton}\n            </Button>\n          </a>\n        </div>\n      </div>\n    )\n  }\n\n  const handleSwiperItemClick = useCallback(\n    (idx: number) => {\n      if (hoverIndex === idx || isAnimation.current) return\n      isAnimation.current = true\n      // \u66F4\u65B0 ref \u72B6\u6001\n      enterRef.current = { [idx]: true }\n      // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n      setHoverIndex(idx)\n      gaTrack({\n        event: 'ga4Event',\n        eventName: 'component_click',\n        event_parameters: {\n          page_group: 'Home Page',\n          component_type: componentType,\n          component_name: componentName,\n          component_title: data?.products[idx]?.title,\n          component_description: data?.products[idx]?.subTitle,\n          position: idx + 1,\n        },\n      })\n    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={innerRef} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n        <div\n          className={cn(\n            'lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden',\n            className\n          )}\n        >\n          {data?.products?.map((item, idx) => {\n            const isExpanded = hoverIndex === idx\n            const flexValue = isExpanded ? 8 : 1\n            const isShowContent = currentWidth?.[idx] && isExpanded\n            return (\n              <div\n                key={idx}\n                style={{\n                  flex: flexValue,\n                }}\n                ref={(el: HTMLDivElement | null) => {\n                  if (el) getRef(idx, el)\n                }}\n                className={cn(\n                  'relative cursor-pointer overflow-hidden',\n                  data?.itemShape === 'round' ? 'rounded-2xl' : ''\n                )}\n                onMouseEnter={() => handleSwiperItemClick(idx)}\n                onMouseLeave={() => {\n                  isAnimation.current = false\n                }}\n                onClick={() => handleSwiperItemClick(idx)}\n              >\n                <Picture\n                  source={item?.img?.url}\n                  className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n                />\n                <div\n                  className={cn(\n                    'absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8',\n                    isShowContent ? 'translate-x-0 opacity-100 transition-transform ease-out' : 'opacity-0'\n                  )}\n                >\n                  <div className=\"mr-16 flex-1 overflow-hidden\">\n                    <p className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n                      {item?.title}\n                    </p>\n                    <h3 className=\"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold\">\n                      {item?.subTitle}\n                    </h3>\n                  </div>\n                  <a\n                    href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n                    onClick={() => event?.primaryButton?.(data, idx)}\n                  >\n                    <Button variant=\"secondary\" className={cn('desktop:text-base mb-1.5 text-sm font-bold')}>\n                      {data?.primaryButton}\n                    </Button>\n                  </a>\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n      <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n        <SwiperBox\n          className={cn('h-[400px] !overflow-visible', className)}\n          id={'AccordionCards' + data?.key}\n          data={{\n            list: data?.products,\n            configuration: {\n              shape: data?.shape,\n              itemShape: data?.itemShape,\n              primaryButton: data?.primaryButton,\n              event: event,\n            },\n          }}\n          Slide={MobileItem}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1.1,\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n})\nexport default withStyles(AccordionCards)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback, useImperativeHandle } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { gaTrack } from '../../shared/track.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: {\n    url: string\n  }\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n}\n\ntype AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(({ data, className = '', event }, ref) => {\n  const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n  const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({ 0: true })\n\n  const accordionRef = useRef<HTMLDivElement[]>([])\n  const enterRef = useRef<{ [key: number]: boolean }>({ 0: true })\n  const isAnimation = useRef<boolean>(false)\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n  })\n\n  const getRef = (index: number, el: HTMLDivElement) => {\n    if (el) {\n      accordionRef.current[index] = el\n    }\n  }\n\n  const handleTransitionEnd = (index: number) => {\n    if (enterRef.current?.[index]) {\n      isAnimation.current = false\n      setCurrentWidth({ [index]: true })\n    }\n  }\n\n  useEffect(() => {\n    const element = accordionRef.current\n    element?.forEach((item, index) => {\n      if (!index) {\n        item.style.flex = '8 1 0%'\n        item.style.transition = 'all 0.6s'\n      } else {\n        item.style.flex = '1 1 0%'\n        item.style.transition = 'all 0.6s'\n      }\n      item.addEventListener('transitionend', () => {\n        handleTransitionEnd(index)\n      })\n    })\n    return () => {\n      element?.forEach((item, index) => {\n        item.removeEventListener('transitionend', () => handleTransitionEnd(index))\n      })\n    }\n  }, [])\n\n  const MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n    return (\n      <div\n        className={cn(\n          'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n          configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n        )}\n      >\n        <Picture className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" source={data?.img?.url} />\n        <div className={cn('absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4')}>\n          <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n            <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n            <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n          </div>\n          <a\n            href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n            onClick={() => configuration?.event?.primaryButton(data, configuration)}\n          >\n            <Button variant=\"secondary\" className={cn('text-info-primary text-sm font-bold')}>\n              {configuration?.primaryButton}\n            </Button>\n          </a>\n        </div>\n      </div>\n    )\n  }\n\n  const handleSwiperItemClick = useCallback(\n    (idx: number) => {\n      if (hoverIndex === idx || isAnimation.current) return\n      isAnimation.current = true\n      // \u66F4\u65B0 ref \u72B6\u6001\n      enterRef.current = { [idx]: true }\n      // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n      setHoverIndex(idx)\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'component_click',\n        event_parameters: {\n          page_group: 'Home Page',\n          component_type: componentType,\n          component_name: componentName,\n          component_title: data?.products[idx]?.title,\n          component_description: data?.products[idx]?.subTitle,\n          position: idx + 1,\n        },\n      })\n    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={innerRef} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n        <div\n          className={cn(\n            'lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden',\n            className\n          )}\n        >\n          {data?.products?.map((item, idx) => {\n            const isExpanded = hoverIndex === idx\n            const flexValue = isExpanded ? 8 : 1\n            const isShowContent = currentWidth?.[idx] && isExpanded\n            return (\n              <div\n                key={idx}\n                style={{\n                  flex: flexValue,\n                }}\n                ref={(el: HTMLDivElement | null) => {\n                  if (el) getRef(idx, el)\n                }}\n                className={cn(\n                  'relative cursor-pointer overflow-hidden',\n                  data?.itemShape === 'round' ? 'rounded-2xl' : ''\n                )}\n                onMouseEnter={() => handleSwiperItemClick(idx)}\n                onMouseLeave={() => {\n                  isAnimation.current = false\n                }}\n                onClick={() => handleSwiperItemClick(idx)}\n              >\n                <Picture\n                  source={item?.img?.url}\n                  className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n                />\n                <div\n                  className={cn(\n                    'absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8',\n                    isShowContent ? 'translate-x-0 opacity-100 transition-transform ease-out' : 'opacity-0'\n                  )}\n                >\n                  <div className=\"mr-16 flex-1 overflow-hidden\">\n                    <p className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n                      {item?.title}\n                    </p>\n                    <h3 className=\"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold\">\n                      {item?.subTitle}\n                    </h3>\n                  </div>\n                  <a\n                    href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n                    onClick={() => event?.primaryButton?.(data, idx)}\n                  >\n                    <Button variant=\"secondary\" className={cn('desktop:text-base mb-1.5 text-sm font-bold')}>\n                      {data?.primaryButton}\n                    </Button>\n                  </a>\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n      <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n        <SwiperBox\n          className={cn('h-[400px] !overflow-visible', className)}\n          id={'AccordionCards' + data?.key}\n          data={{\n            list: data?.products,\n            configuration: {\n              shape: data?.shape,\n              itemShape: data?.itemShape,\n              primaryButton: data?.primaryButton,\n              event: event,\n            },\n          }}\n          Slide={MobileItem}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1.1,\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n})\nexport default withStyles(AccordionCards)\n"],
+  "mappings": "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",
   "names": ["AccordionCards_exports", "__export", "AccordionCards_default", "__toCommonJS", "import_jsx_runtime", "import_Title", "import_utils", "import_picture", "import_button", "import_SwiperBox", "import_Styles", "import_react", "import_useExposure", "import_trackUrlRef", "import_track", "componentType", "componentName", "AccordionCards", "React", "data", "className", "event", "ref", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "enterRef", "isAnimation", "innerRef", "getRef", "index", "el", "handleTransitionEnd", "element", "item", "MobileItem", "configuration", "Picture", "Button", "handleSwiperItemClick", "idx", "Title", "isExpanded", "flexValue", "isShowContent", "SwiperBox"]
 }

package/dist/esm/biz-components/AccordionCards/index.js

@@ -1,2 +1,2 @@
-"use client";import{Fragment as z,jsx as o,jsxs as s}from"react/jsx-runtime";import L from"../Title/index.js";import{cn as n}from"../../helpers/utils.js";import k from"../../components/picture.js";import g from"../../components/button.js";import I from"../SwiperBox/index.js";import{withStyles as R}from"../../shared/Styles.js";import A,{useState as w,useEffect as D,useRef as a,useCallback as P,useImperativeHandle as j}from"react";import{useExposure as V}from"../../hooks/useExposure.js";import{trackUrlRef as N}from"../../shared/trackUrlRef.js";import{gaTrack as $}from"../../shared/track.js";const m="image",c="scene_banner",q=A.forwardRef(({data:r,className:d="",event:f},T)=>{const[p,E]=w(0),[B,_]=w({0:!0}),v=a([]),b=a({0:!0}),l=a(!1),u=a(null);j(T,()=>u.current),V(u,{componentType:m,componentName:c,componentTitle:r?.title});const M=(e,t)=>{t&&(v.current[e]=t)},h=e=>{b.current?.[e]&&(l.current=!1,_({[e]:!0}))};D(()=>{const e=v.current;return e?.forEach((t,i)=>{i?(t.style.flex="1 1 0%",t.style.transition="all 0.6s"):(t.style.flex="8 1 0%",t.style.transition="all 0.6s"),t.addEventListener("transitionend",()=>{h(i)})}),()=>{e?.forEach((t,i)=>{t.removeEventListener("transitionend",()=>h(i))})}},[]);const C=({data:e,configuration:t})=>s("div",{className:n("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",t?.itemShape==="round"?"rounded-2xl":""),children:[o(k,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:e?.img?.url}),s("div",{className:n("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[s("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[o("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:e?.title}),o("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),o("a",{href:N(e.link,`${m}_${c}`),onClick:()=>t?.event?.primaryButton(e,t),children:o(g,{variant:"secondary",className:n("text-info-primary text-sm font-bold"),children:t?.primaryButton})})]})]}),y=P(e=>{p===e||l.current||(l.current=!0,b.current={[e]:!0},E(e),$({event:"ga4Event",eventName:"component_click",event_parameters:{page_group:"Home Page",component_type:m,component_name:c,component_title:r?.products[e]?.title,component_description:r?.products[e]?.subTitle,position:e+1}}))},[p,l]);return s(z,{children:[r?.title&&o(L,{data:{title:r?.title}}),o("div",{ref:u,className:n("laptop:block hidden",{"aiui-dark":r?.theme==="dark"}),children:o("div",{className:n("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",d),children:r?.products?.map((e,t)=>{const i=p===t,S=i?8:1,H=B?.[t]&&i;return s("div",{style:{flex:S},ref:x=>{x&&M(t,x)},className:n("relative cursor-pointer overflow-hidden",r?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>y(t),onMouseLeave:()=>{l.current=!1},onClick:()=>y(t),children:[o(k,{source:e?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),s("div",{className:n("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",H?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[s("div",{className:"mr-16 flex-1 overflow-hidden",children:[o("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:e?.title}),o("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),o("a",{href:N(e?.link,`${m}_${c}`),onClick:()=>f?.primaryButton?.(r,t),children:o(g,{variant:"secondary",className:n("desktop:text-base mb-1.5 text-sm font-bold"),children:r?.primaryButton})})]})]},t)})})}),o("div",{className:n("laptop:hidden block",{"aiui-dark":r?.theme==="dark"}),children:o(I,{className:n("h-[400px] !overflow-visible",d),id:"AccordionCards"+r?.key,data:{list:r?.products,configuration:{shape:r?.shape,itemShape:r?.itemShape,primaryButton:r?.primaryButton,event:f}},Slide:C,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3}}})})]})});var Z=R(q);export{Z as default};
+"use client";import{Fragment as z,jsx as o,jsxs as s}from"react/jsx-runtime";import L from"../Title/index.js";import{cn as n}from"../../helpers/utils.js";import k from"../../components/picture.js";import g from"../../components/button.js";import I from"../SwiperBox/index.js";import{withStyles as R}from"../../shared/Styles.js";import A,{useState as w,useEffect as D,useRef as a,useCallback as P,useImperativeHandle as j}from"react";import{useExposure as V}from"../../hooks/useExposure.js";import{trackUrlRef as T}from"../../shared/trackUrlRef.js";import{gaTrack as $}from"../../shared/track.js";const m="image",c="scene_banner",q=A.forwardRef(({data:r,className:d="",event:f},N)=>{const[p,E]=w(0),[B,_]=w({0:!0}),v=a([]),b=a({0:!0}),l=a(!1),u=a(null);j(N,()=>u.current),V(u,{componentType:m,componentName:c,componentTitle:r?.title});const M=(e,t)=>{t&&(v.current[e]=t)},h=e=>{b.current?.[e]&&(l.current=!1,_({[e]:!0}))};D(()=>{const e=v.current;return e?.forEach((t,i)=>{i?(t.style.flex="1 1 0%",t.style.transition="all 0.6s"):(t.style.flex="8 1 0%",t.style.transition="all 0.6s"),t.addEventListener("transitionend",()=>{h(i)})}),()=>{e?.forEach((t,i)=>{t.removeEventListener("transitionend",()=>h(i))})}},[]);const C=({data:e,configuration:t})=>s("div",{className:n("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",t?.itemShape==="round"?"rounded-2xl":""),children:[o(k,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:e?.img?.url}),s("div",{className:n("absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4"),children:[s("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[o("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:e?.title}),o("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),o("a",{href:T(e.link,`${m}_${c}`),onClick:()=>t?.event?.primaryButton(e,t),children:o(g,{variant:"secondary",className:n("text-info-primary text-sm font-bold"),children:t?.primaryButton})})]})]}),y=P(e=>{p===e||l.current||(l.current=!0,b.current={[e]:!0},E(e),$({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:m,component_name:c,component_title:r?.products[e]?.title,component_description:r?.products[e]?.subTitle,position:e+1}}))},[p,l]);return s(z,{children:[r?.title&&o(L,{data:{title:r?.title}}),o("div",{ref:u,className:n("laptop:block hidden",{"aiui-dark":r?.theme==="dark"}),children:o("div",{className:n("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",d),children:r?.products?.map((e,t)=>{const i=p===t,S=i?8:1,H=B?.[t]&&i;return s("div",{style:{flex:S},ref:x=>{x&&M(t,x)},className:n("relative cursor-pointer overflow-hidden",r?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>y(t),onMouseLeave:()=>{l.current=!1},onClick:()=>y(t),children:[o(k,{source:e?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover"}),s("div",{className:n("absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8",H?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[s("div",{className:"mr-16 flex-1 overflow-hidden",children:[o("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:e?.title}),o("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),o("a",{href:T(e?.link,`${m}_${c}`),onClick:()=>f?.primaryButton?.(r,t),children:o(g,{variant:"secondary",className:n("desktop:text-base mb-1.5 text-sm font-bold"),children:r?.primaryButton})})]})]},t)})})}),o("div",{className:n("laptop:hidden block",{"aiui-dark":r?.theme==="dark"}),children:o(I,{className:n("h-[400px] !overflow-visible",d),id:"AccordionCards"+r?.key,data:{list:r?.products,configuration:{shape:r?.shape,itemShape:r?.itemShape,primaryButton:r?.primaryButton,event:f}},Slide:C,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3}}})})]})});var Z=R(q);export{Z as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/AccordionCards/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/AccordionCards/index.tsx"],
-  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback, useImperativeHandle } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { gaTrack } from '../../shared/track.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: {\n    url: string\n  }\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n}\n\ntype AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(({ data, className = '', event }, ref) => {\n  const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n  const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({ 0: true })\n\n  const accordionRef = useRef<HTMLDivElement[]>([])\n  const enterRef = useRef<{ [key: number]: boolean }>({ 0: true })\n  const isAnimation = useRef<boolean>(false)\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n  })\n\n  const getRef = (index: number, el: HTMLDivElement) => {\n    if (el) {\n      accordionRef.current[index] = el\n    }\n  }\n\n  const handleTransitionEnd = (index: number) => {\n    if (enterRef.current?.[index]) {\n      isAnimation.current = false\n      setCurrentWidth({ [index]: true })\n    }\n  }\n\n  useEffect(() => {\n    const element = accordionRef.current\n    element?.forEach((item, index) => {\n      if (!index) {\n        item.style.flex = '8 1 0%'\n        item.style.transition = 'all 0.6s'\n      } else {\n        item.style.flex = '1 1 0%'\n        item.style.transition = 'all 0.6s'\n      }\n      item.addEventListener('transitionend', () => {\n        handleTransitionEnd(index)\n      })\n    })\n    return () => {\n      element?.forEach((item, index) => {\n        item.removeEventListener('transitionend', () => handleTransitionEnd(index))\n      })\n    }\n  }, [])\n\n  const MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n    return (\n      <div\n        className={cn(\n          'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n          configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n        )}\n      >\n        <Picture className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" source={data?.img?.url} />\n        <div className={cn('absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4')}>\n          <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n            <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n            <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n          </div>\n          <a\n            href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n            onClick={() => configuration?.event?.primaryButton(data, configuration)}\n          >\n            <Button variant=\"secondary\" className={cn('text-info-primary text-sm font-bold')}>\n              {configuration?.primaryButton}\n            </Button>\n          </a>\n        </div>\n      </div>\n    )\n  }\n\n  const handleSwiperItemClick = useCallback(\n    (idx: number) => {\n      if (hoverIndex === idx || isAnimation.current) return\n      isAnimation.current = true\n      // \u66F4\u65B0 ref \u72B6\u6001\n      enterRef.current = { [idx]: true }\n      // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n      setHoverIndex(idx)\n      gaTrack({\n        event: 'ga4Event',\n        eventName: 'component_click',\n        event_parameters: {\n          page_group: 'Home Page',\n          component_type: componentType,\n          component_name: componentName,\n          component_title: data?.products[idx]?.title,\n          component_description: data?.products[idx]?.subTitle,\n          position: idx + 1,\n        },\n      })\n    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={innerRef} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n        <div\n          className={cn(\n            'lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden',\n            className\n          )}\n        >\n          {data?.products?.map((item, idx) => {\n            const isExpanded = hoverIndex === idx\n            const flexValue = isExpanded ? 8 : 1\n            const isShowContent = currentWidth?.[idx] && isExpanded\n            return (\n              <div\n                key={idx}\n                style={{\n                  flex: flexValue,\n                }}\n                ref={(el: HTMLDivElement | null) => {\n                  if (el) getRef(idx, el)\n                }}\n                className={cn(\n                  'relative cursor-pointer overflow-hidden',\n                  data?.itemShape === 'round' ? 'rounded-2xl' : ''\n                )}\n                onMouseEnter={() => handleSwiperItemClick(idx)}\n                onMouseLeave={() => {\n                  isAnimation.current = false\n                }}\n                onClick={() => handleSwiperItemClick(idx)}\n              >\n                <Picture\n                  source={item?.img?.url}\n                  className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n                />\n                <div\n                  className={cn(\n                    'absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8',\n                    isShowContent ? 'translate-x-0 opacity-100 transition-transform ease-out' : 'opacity-0'\n                  )}\n                >\n                  <div className=\"mr-16 flex-1 overflow-hidden\">\n                    <p className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n                      {item?.title}\n                    </p>\n                    <h3 className=\"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold\">\n                      {item?.subTitle}\n                    </h3>\n                  </div>\n                  <a\n                    href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n                    onClick={() => event?.primaryButton?.(data, idx)}\n                  >\n                    <Button variant=\"secondary\" className={cn('desktop:text-base mb-1.5 text-sm font-bold')}>\n                      {data?.primaryButton}\n                    </Button>\n                  </a>\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n      <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n        <SwiperBox\n          className={cn('h-[400px] !overflow-visible', className)}\n          id={'AccordionCards' + data?.key}\n          data={{\n            list: data?.products,\n            configuration: {\n              shape: data?.shape,\n              itemShape: data?.itemShape,\n              primaryButton: data?.primaryButton,\n              event: event,\n            },\n          }}\n          Slide={MobileItem}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1.1,\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n})\nexport default withStyles(AccordionCards)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback, useImperativeHandle } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { gaTrack } from '../../shared/track.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: {\n    url: string\n  }\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n}\n\ntype AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(({ data, className = '', event }, ref) => {\n  const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n  const [currentWidth, setCurrentWidth] = useState<{ [key: number]: boolean }>({ 0: true })\n\n  const accordionRef = useRef<HTMLDivElement[]>([])\n  const enterRef = useRef<{ [key: number]: boolean }>({ 0: true })\n  const isAnimation = useRef<boolean>(false)\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n  })\n\n  const getRef = (index: number, el: HTMLDivElement) => {\n    if (el) {\n      accordionRef.current[index] = el\n    }\n  }\n\n  const handleTransitionEnd = (index: number) => {\n    if (enterRef.current?.[index]) {\n      isAnimation.current = false\n      setCurrentWidth({ [index]: true })\n    }\n  }\n\n  useEffect(() => {\n    const element = accordionRef.current\n    element?.forEach((item, index) => {\n      if (!index) {\n        item.style.flex = '8 1 0%'\n        item.style.transition = 'all 0.6s'\n      } else {\n        item.style.flex = '1 1 0%'\n        item.style.transition = 'all 0.6s'\n      }\n      item.addEventListener('transitionend', () => {\n        handleTransitionEnd(index)\n      })\n    })\n    return () => {\n      element?.forEach((item, index) => {\n        item.removeEventListener('transitionend', () => handleTransitionEnd(index))\n      })\n    }\n  }, [])\n\n  const MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n    return (\n      <div\n        className={cn(\n          'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n          configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n        )}\n      >\n        <Picture className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\" source={data?.img?.url} />\n        <div className={cn('absolute inset-x-0 bottom-0 flex flex-col overflow-hidden px-4 pb-4')}>\n          <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n            <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n            <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n          </div>\n          <a\n            href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n            onClick={() => configuration?.event?.primaryButton(data, configuration)}\n          >\n            <Button variant=\"secondary\" className={cn('text-info-primary text-sm font-bold')}>\n              {configuration?.primaryButton}\n            </Button>\n          </a>\n        </div>\n      </div>\n    )\n  }\n\n  const handleSwiperItemClick = useCallback(\n    (idx: number) => {\n      if (hoverIndex === idx || isAnimation.current) return\n      isAnimation.current = true\n      // \u66F4\u65B0 ref \u72B6\u6001\n      enterRef.current = { [idx]: true }\n      // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n      setHoverIndex(idx)\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'component_click',\n        event_parameters: {\n          page_group: 'Home Page',\n          component_type: componentType,\n          component_name: componentName,\n          component_title: data?.products[idx]?.title,\n          component_description: data?.products[idx]?.subTitle,\n          position: idx + 1,\n        },\n      })\n    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={innerRef} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n        <div\n          className={cn(\n            'lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden',\n            className\n          )}\n        >\n          {data?.products?.map((item, idx) => {\n            const isExpanded = hoverIndex === idx\n            const flexValue = isExpanded ? 8 : 1\n            const isShowContent = currentWidth?.[idx] && isExpanded\n            return (\n              <div\n                key={idx}\n                style={{\n                  flex: flexValue,\n                }}\n                ref={(el: HTMLDivElement | null) => {\n                  if (el) getRef(idx, el)\n                }}\n                className={cn(\n                  'relative cursor-pointer overflow-hidden',\n                  data?.itemShape === 'round' ? 'rounded-2xl' : ''\n                )}\n                onMouseEnter={() => handleSwiperItemClick(idx)}\n                onMouseLeave={() => {\n                  isAnimation.current = false\n                }}\n                onClick={() => handleSwiperItemClick(idx)}\n              >\n                <Picture\n                  source={item?.img?.url}\n                  className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n                />\n                <div\n                  className={cn(\n                    'absolute inset-x-0 bottom-0 flex w-full translate-x-4 items-end justify-between overflow-hidden px-8 pb-8',\n                    isShowContent ? 'translate-x-0 opacity-100 transition-transform ease-out' : 'opacity-0'\n                  )}\n                >\n                  <div className=\"mr-16 flex-1 overflow-hidden\">\n                    <p className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n                      {item?.title}\n                    </p>\n                    <h3 className=\"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold\">\n                      {item?.subTitle}\n                    </h3>\n                  </div>\n                  <a\n                    href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n                    onClick={() => event?.primaryButton?.(data, idx)}\n                  >\n                    <Button variant=\"secondary\" className={cn('desktop:text-base mb-1.5 text-sm font-bold')}>\n                      {data?.primaryButton}\n                    </Button>\n                  </a>\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n      <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n        <SwiperBox\n          className={cn('h-[400px] !overflow-visible', className)}\n          id={'AccordionCards' + data?.key}\n          data={{\n            list: data?.products,\n            configuration: {\n              shape: data?.shape,\n              itemShape: data?.itemShape,\n              primaryButton: data?.primaryButton,\n              event: event,\n            },\n          }}\n          Slide={MobileItem}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1.1,\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n})\nexport default withStyles(AccordionCards)\n"],
+  "mappings": "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",
   "names": ["Fragment", "jsx", "jsxs", "Title", "cn", "Picture", "Button", "SwiperBox", "withStyles", "React", "useState", "useEffect", "useRef", "useCallback", "useImperativeHandle", "useExposure", "trackUrlRef", "gaTrack", "componentType", "componentName", "AccordionCards", "data", "className", "event", "ref", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "enterRef", "isAnimation", "innerRef", "getRef", "index", "el", "handleTransitionEnd", "element", "item", "MobileItem", "configuration", "handleSwiperItemClick", "idx", "isExpanded", "flexValue", "isShowContent", "AccordionCards_default"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/headless-ui",
-  "version": "0.0.28-alpha.1",
+  "version": "0.0.29",
   "type": "commonjs",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",

package/dist/cjs/biz-components/SectionHeading/SectionHeading.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { SectionHeadingProps } from './types.js';
-declare const SectionHeading: React.ForwardRefExoticComponent<SectionHeadingProps & React.RefAttributes<HTMLDivElement>>;
-export default SectionHeading;

package/dist/cjs/biz-components/SectionHeading/SectionHeading.js

@@ -1,2 +0,0 @@
-"use strict";var f=Object.create;var n=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var g=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var S=(e,t)=>{for(var o in t)n(e,o,{get:t[o],enumerable:!0})},a=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of l(t))!H.call(e,r)&&r!==o&&n(e,r,{get:()=>t[r],enumerable:!(i=d(t,r))||i.enumerable});return e};var h=(e,t,o)=>(o=e!=null?f(g(e)):{},a(t||!e||!e.__esModule?n(o,"default",{value:e,enumerable:!0}):o,e)),y=e=>a(n({},"__esModule",{value:!0}),e);var R={};S(R,{default:()=>P});module.exports=y(R);var p=require("react/jsx-runtime"),m=h(require("react")),s=require("../../helpers/utils.js"),c=require("../../components/index.js");const N=m.default.forwardRef((e,t)=>{const{title:o,className:i,...r}=e;return(0,p.jsx)(c.Heading,{ref:t,className:(0,s.cn)("section-heading",i),html:o,...r})});var P=N;
-//# sourceMappingURL=SectionHeading.js.map

package/dist/cjs/biz-components/SectionHeading/SectionHeading.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/biz-components/SectionHeading/SectionHeading.tsx"],
-  "sourcesContent": ["import React from 'react'\nimport type { SectionHeadingProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading } from '../../components/index.js'\n\nconst SectionHeading = React.forwardRef<HTMLDivElement, SectionHeadingProps>((props, ref) => {\n  const { title, className, ...rest } = props\n\n  return <Heading ref={ref} className={cn('section-heading', className)} html={title} {...rest} />\n})\n\nexport default SectionHeading\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAQS,IAAAI,EAAA,6BARTC,EAAkB,oBAElBC,EAAmB,kCACnBC,EAAwB,qCAExB,MAAMC,EAAiB,EAAAC,QAAM,WAAgD,CAACC,EAAOC,IAAQ,CAC3F,KAAM,CAAE,MAAAC,EAAO,UAAAC,EAAW,GAAGC,CAAK,EAAIJ,EAEtC,SAAO,OAAC,WAAQ,IAAKC,EAAK,aAAW,MAAG,kBAAmBE,CAAS,EAAG,KAAMD,EAAQ,GAAGE,EAAM,CAChG,CAAC,EAED,IAAOZ,EAAQM",
-  "names": ["SectionHeading_exports", "__export", "SectionHeading_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_components", "SectionHeading", "React", "props", "ref", "title", "className", "rest"]
-}

package/dist/cjs/biz-components/SectionHeading/index.js

@@ -1,2 +0,0 @@
-"use strict";
-//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/SectionHeading/index.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}

package/dist/cjs/biz-components/SectionHeading/types.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-export interface SectionHeadingProps {
-    title: string;
-    className?: string;
-    children: React.ReactNode;
-}

package/dist/cjs/biz-components/SectionHeading/types.js

@@ -1,2 +0,0 @@
-"use strict";var a=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var s=Object.prototype.hasOwnProperty;var d=(t,e,c,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of o(e))!s.call(t,i)&&i!==c&&a(t,i,{get:()=>e[i],enumerable:!(r=n(e,i))||r.enumerable});return t};var g=t=>d(a({},"__esModule",{value:!0}),t);var l={};module.exports=g(l);var p=require("react");
-//# sourceMappingURL=types.js.map

package/dist/cjs/biz-components/SectionHeading/types.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/biz-components/SectionHeading/types.ts"],
-  "sourcesContent": ["import React from 'react'\nexport interface SectionHeadingProps {\n  title: string\n  className?: string\n  children: React.ReactNode\n}\n"],
-  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD,GAAA,IAAAE,EAAkB",
-  "names": ["types_exports", "__toCommonJS", "import_react"]
-}

package/dist/cjs/biz-components/Shelf/Shelf.d.ts

@@ -1,6 +0,0 @@
-import type { ShelfProps } from './types.js';
-declare const _default: import("react").ForwardRefExoticComponent<Omit<ShelfProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
-    className?: string;
-    data?: Record<string, any>;
-} & import("react").RefAttributes<any>>;
-export default _default;

package/dist/cjs/biz-components/Shelf/Shelf.js

@@ -1,2 +0,0 @@
-"use strict";var h=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var r=(e,t)=>{for(var i in t)h(e,i,{get:t[i],enumerable:!0})},S=(e,t,i,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of m(t))!v.call(e,o)&&o!==i&&h(e,o,{get:()=>t[o],enumerable:!(s=f(t,o))||s.enumerable});return e};var a=e=>S(h({},"__esModule",{value:!0}),e);var y={};r(y,{default:()=>p});module.exports=a(y);var l=require("react/jsx-runtime"),d=require("../../shared/Styles.js");const n=e=>(console.log("~ Shelf props",e),(0,l.jsxs)("div",{children:[(0,l.jsx)("h1",{className:"text-2xl font-bold",children:e.title}),(0,l.jsx)("h2",{children:e.subtitle}),(0,l.jsx)("div",{children:e.products.map(t=>(0,l.jsx)("div",{children:t.name},t.sku))})]}));var p=(0,d.withStyles)(n);
-//# sourceMappingURL=Shelf.js.map

package/dist/cjs/biz-components/Shelf/Shelf.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/biz-components/Shelf/Shelf.tsx"],
-  "sourcesContent": ["/**\n * \u8FD9\u662F\u4E00\u4E2Ademo \u6A21\u7248\n */\nimport { withStyles } from '../../shared/Styles.js'\nimport type { ShelfProps } from './types.js'\n\nconst Shelf = (props: ShelfProps) => {\n  console.log('~ Shelf props', props)\n  return (\n    <div>\n      <h1 className=\"text-2xl font-bold\">{props.title}</h1>\n      <h2>{props.subtitle}</h2>\n      <div>\n        {props.products.map(product => (\n          <div key={product.sku}>{product.name}</div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withStyles(Shelf)\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GASI,IAAAI,EAAA,6BANJC,EAA2B,kCAG3B,MAAMC,EAASC,IACb,QAAQ,IAAI,gBAAiBA,CAAK,KAEhC,QAAC,OACC,oBAAC,MAAG,UAAU,qBAAsB,SAAAA,EAAM,MAAM,KAChD,OAAC,MAAI,SAAAA,EAAM,SAAS,KACpB,OAAC,OACE,SAAAA,EAAM,SAAS,IAAIC,MAClB,OAAC,OAAuB,SAAAA,EAAQ,MAAtBA,EAAQ,GAAmB,CACtC,EACH,GACF,GAIJ,IAAON,KAAQ,cAAWI,CAAK",
-  "names": ["Shelf_exports", "__export", "Shelf_default", "__toCommonJS", "import_jsx_runtime", "import_Styles", "Shelf", "props", "product"]
-}

package/dist/cjs/biz-components/Shelf/index.d.ts

@@ -1 +0,0 @@
-export { default } from './Shelf.js';

package/dist/cjs/biz-components/Shelf/index.js

@@ -1,2 +0,0 @@
-"use strict";var m=Object.create;var t=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty;var c=(e,f)=>{for(var o in f)t(e,o,{get:f[o],enumerable:!0})},d=(e,f,o,a)=>{if(f&&typeof f=="object"||typeof f=="function")for(let r of u(f))!b.call(e,r)&&r!==o&&t(e,r,{get:()=>f[r],enumerable:!(a=p(f,r))||a.enumerable});return e};var g=(e,f,o)=>(o=e!=null?m(x(e)):{},d(f||!e||!e.__esModule?t(o,"default",{value:e,enumerable:!0}):o,e)),h=e=>d(t({},"__esModule",{value:!0}),e);var i={};c(i,{default:()=>l.default});module.exports=h(i);var l=g(require("./Shelf.js"));
-//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/Shelf/index.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/biz-components/Shelf/index.ts"],
-  "sourcesContent": ["export { default } from './Shelf.js'\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wCAAAE,EAAAF,GAAA,IAAAG,EAAwB",
-  "names": ["Shelf_exports", "__export", "__toCommonJS", "import_Shelf"]
-}

package/dist/cjs/biz-components/Shelf/types.d.ts

@@ -1,6 +0,0 @@
-export type ShelfProps = {
-    id: string;
-    title: string;
-    subtitle: string;
-    products: any[];
-};

package/dist/cjs/biz-components/Shelf/types.js

@@ -1,2 +0,0 @@
-"use strict";var e=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var l=Object.prototype.hasOwnProperty;var o=(i,t,n,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of g(t))!l.call(i,r)&&r!==n&&e(i,r,{get:()=>t[r],enumerable:!(s=p(t,r))||s.enumerable});return i};var d=i=>o(e({},"__esModule",{value:!0}),i);var u={};module.exports=d(u);
-//# sourceMappingURL=types.js.map

package/dist/cjs/biz-components/Shelf/types.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/biz-components/Shelf/types.ts"],
-  "sourcesContent": ["export type ShelfProps = {\n  id: string\n  title: string\n  subtitle: string\n  products: any[]\n}\n"],
-  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
-  "names": ["types_exports", "__toCommonJS"]
-}

package/dist/cjs/helpers/GloablContext.d.ts

@@ -1,10 +0,0 @@
-export declare const GlobalContext: import("react").Context<{
-    gsap: null;
-    ScrollTrigger: null;
-    SplitText: null;
-}>;
-export declare const useGlobalContext: () => {
-    gsap: null;
-    ScrollTrigger: null;
-    SplitText: null;
-};

package/dist/cjs/helpers/GloablContext.js

@@ -1,2 +0,0 @@
-"use strict";var r=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var a=Object.prototype.hasOwnProperty;var c=(e,t)=>{for(var o in t)r(e,o,{get:t[o],enumerable:!0})},C=(e,t,o,x)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of s(t))!a.call(e,l)&&l!==o&&r(e,l,{get:()=>t[l],enumerable:!(x=p(t,l))||x.enumerable});return e};var g=e=>C(r({},"__esModule",{value:!0}),e);var b={};c(b,{GlobalContext:()=>u,useGlobalContext:()=>i});module.exports=g(b);var n=require("react");const u=(0,n.createContext)({gsap:null,ScrollTrigger:null,SplitText:null}),i=()=>(0,n.useContext)(u);
-//# sourceMappingURL=GloablContext.js.map

package/dist/cjs/helpers/GloablContext.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/helpers/GloablContext.ts"],
-  "sourcesContent": ["import { createContext, useContext } from 'react'\n\nexport const GlobalContext = createContext({\n  gsap: null,\n  ScrollTrigger: null,\n  SplitText: null,\n})\n\nexport const useGlobalContext = () => {\n  return useContext(GlobalContext)\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,EAAA,qBAAAC,IAAA,eAAAC,EAAAJ,GAAA,IAAAK,EAA0C,iBAEnC,MAAMH,KAAgB,iBAAc,CACzC,KAAM,KACN,cAAe,KACf,UAAW,IACb,CAAC,EAEYC,EAAmB,OACvB,cAAWD,CAAa",
-  "names": ["GloablContext_exports", "__export", "GlobalContext", "useGlobalContext", "__toCommonJS", "import_react"]
-}

package/dist/cjs/hooks/useMergeRefs.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-export type ReactRef<T> = React.RefCallback<T> | React.MutableRefObject<T>;
-export declare function assignRef<T = any>(ref: ReactRef<T> | null | undefined, value: T): void;
-export declare function useMergeRefs<T>(...refs: (ReactRef<T> | null | undefined)[]): (node: T | null) => void;

package/dist/cjs/stories/shelf.stories.d.ts

@@ -1,16 +0,0 @@
-import type { StoryObj } from '@storybook/react';
-import React from 'react';
-declare const meta: {
-    title: string;
-    component: React.ForwardRefExoticComponent<Omit<import("../biz-components/Shelf/types.js").ShelfProps, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
-        className?: string;
-        data?: Record<string, any>;
-    } & React.RefAttributes<any>>;
-    parameters: {
-        layout: string;
-    };
-    tags: string[];
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;

package/dist/cjs/stories/shelf.stories.js

@@ -1,2 +0,0 @@
-"use strict";var r=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var f=(e,t)=>{for(var s in t)r(e,s,{get:t[s],enumerable:!0})},l=(e,t,s,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of m(t))!u.call(e,o)&&o!==s&&r(e,o,{get:()=>t[o],enumerable:!(a=p(t,o))||a.enumerable});return e};var c=e=>l(r({},"__esModule",{value:!0}),e);var S={};f(S,{Default:()=>d,default:()=>n});module.exports=c(S);var i=require("../biz-components/index.js"),b=require("react");const y={title:"Biz-Components/Shelf",component:i.Shelf,parameters:{layout:"centered"},tags:["autodocs"]};var n=y;const d={args:{id:"shelf",title:"this is title",subtitle:"this is subtitle",products:[{sku:"sku1",name:"product 1"},{sku:"sku2",name:"product 2"}]}};
-//# sourceMappingURL=shelf.stories.js.map

package/dist/cjs/stories/shelf.stories.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/stories/shelf.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Shelf } from '../biz-components/index.js'\nimport React from 'react'\n\nconst meta = {\n  title: 'Biz-Components/Shelf',\n  component: Shelf,\n  parameters: {\n    layout: 'centered',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof Shelf>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    id: 'shelf',\n    title: 'this is title',\n    subtitle: 'this is subtitle',\n    products: [\n      {\n        sku: 'sku1',\n        name: 'product 1',\n      },\n      {\n        sku: 'sku2',\n        name: 'product 2',\n      },\n    ],\n  },\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,YAAAC,IAAA,eAAAC,EAAAJ,GAEA,IAAAK,EAAsB,sCACtBC,EAAkB,iBAElB,MAAMC,EAAO,CACX,MAAO,uBACP,UAAW,QACX,WAAY,CACV,OAAQ,UACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOJ,EAAQI,EAIR,MAAML,EAAiB,CAC5B,KAAM,CACJ,GAAI,QACJ,MAAO,gBACP,SAAU,mBACV,SAAU,CACR,CACE,IAAK,OACL,KAAM,WACR,EACA,CACE,IAAK,OACL,KAAM,WACR,CACF,CACF,CACF",
-  "names": ["shelf_stories_exports", "__export", "Default", "shelf_stories_default", "__toCommonJS", "import_biz_components", "import_react", "meta"]
-}