@anker-in/headless-ui 0.0.27-alpha.59 → 0.0.27-alpha.60

package/dist/cjs/types/props.d.ts

@@ -3,6 +3,7 @@ export interface ComponentCommonProps {
     event?: any;
     condition?: any;
     className?: string;
+    id?: string;
     key?: string;
 }
 export type Img = {

package/dist/cjs/types/props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/types/props.ts"],
-  "sourcesContent": ["export interface ComponentCommonProps {\n  style?: string\n  event?: any\n  condition?: any\n  className?: string\n  key?: string\n}\n\nexport type Img = {\n  url: string\n  alt?: string\n}\n\nexport type Video = {\n  url: string\n}\n\nexport type Theme = 'light' | 'dark'\nexport type Shape = 'rounded' | 'square'\nexport type Align = 'left' | 'center' | 'right'\n\nexport type Media = {\n  alt: string\n  url: string\n  thumbnailURL: string\n  mimeType: 'video/mp4' | 'image/jpeg' | 'image/png' | 'image/webp'\n  width?: number\n  height?: number\n  focalX?: number\n  focalY?: number\n}\n"],
+  "sourcesContent": ["export interface ComponentCommonProps {\n  style?: string\n  event?: any\n  condition?: any\n  className?: string\n  id?: string\n  key?: string\n}\n\nexport type Img = {\n  url: string\n  alt?: string\n}\n\nexport type Video = {\n  url: string\n}\n\nexport type Theme = 'light' | 'dark'\nexport type Shape = 'rounded' | 'square'\nexport type Align = 'left' | 'center' | 'right'\n\nexport type Media = {\n  alt: string\n  url: string\n  thumbnailURL: string\n  mimeType: 'video/mp4' | 'image/jpeg' | 'image/png' | 'image/webp'\n  width?: number\n  height?: number\n  focalX?: number\n  focalY?: number\n}\n"],
   "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
   "names": ["props_exports", "__toCommonJS"]
 }

package/dist/esm/biz-components/BrandEquity/BrandEquity.d.ts

@@ -1,21 +1,4 @@
-import type { ComponentCommonProps, Img } from '../../types/props.js';
-export interface BrandEquityItem {
-    icon?: Img;
-    type?: 'icon' | 'avatar';
-    title: string;
-    description: string;
-    avatarList?: {
-        avatar: Img;
-    }[];
-}
-export interface BrandEquityProps extends ComponentCommonProps {
-    data: {
-        items: BrandEquityItem[];
-    };
-    itemShape?: 'round' | 'square';
-    className?: string;
-    theme?: 'light' | 'dark';
-}
+import type { BrandEquityProps } from './types.js';
 declare const _default: {
     (props: Omit<BrandEquityProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
         className?: string;

package/dist/esm/biz-components/BrandEquity/BrandEquity.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,jsxs as p}from"react/jsx-runtime";import"react";import{cn as a}from"../../helpers/utils.js";import s from"../../components/picture.js";import{withStyles as c}from"../../shared/Styles.js";const m=({data:{items:i=[]},itemShape:l="square",className:d=""})=>e("div",{className:a("brand-equity-wrapper w-full",d),children:e("div",{className:a("grid gap-3","tablet:grid-cols-2 grid-cols-1","laptop:gap-4 laptop:grid-cols-10"),children:i.map((t,o)=>p("div",{className:a("brand-equity-item","flex flex-col bg-white p-4","desktop:p-6","desktop:gap-16 gap-12","laptop:col-span-3 lg-desktop:p-8",{"laptop:col-span-4":[0,5,6,11].includes(o)},l==="round"?"rounded-[16px]":"rounded-none"),children:[p("div",{className:"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3",children:[e("h3",{className:"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]",children:t.title}),t.type==="avatar"?e("div",{className:"flex -space-x-2",children:t?.avatarList?.map((r,n)=>e("div",{className:a("size-[30px] overflow-hidden rounded-full border-2 border-white","relative inline-block","lg-desktop:size-[36px]"),children:e(s,{source:r.avatar.url,alt:r.avatar?.alt,className:"size-full object-cover"})},n))}):e(s,{className:"lg-desktop:size-[36px] size-[30px] object-cover",source:t.icon?.url,alt:t.icon?.alt,imgClassName:"w-full h-full object-cover"})]}),e("p",{className:"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]",children:t.description})]},o))})});var y=c(m);export{y as default};
+"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import"react";import{cn as a}from"../../helpers/utils.js";import o from"../../components/picture.js";import{withStyles as n}from"../../shared/Styles.js";const m=({data:{items:r=[]},itemShape:i="square",className:d=""})=>e("div",{className:a("brand-equity-wrapper w-full",d),children:e("div",{className:a("grid gap-3","tablet:grid-cols-2 grid-cols-1","laptop:gap-4 laptop:grid-cols-10"),children:r.map((t,l)=>s("div",{className:a("brand-equity-item","flex flex-col bg-white p-4","desktop:p-6","desktop:gap-16 gap-12","laptop:col-span-3 lg-desktop:p-8",{"laptop:col-span-4":[0,5,6,11].includes(l)},i==="round"?"rounded-[16px]":"rounded-none"),children:[s("div",{className:"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3",children:[e("h3",{className:"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]",children:t.title}),t.type==="avatar"?e("div",{className:"flex -space-x-2",children:t?.avatarList?.map((p,c)=>e("div",{className:a("size-[30px] overflow-hidden rounded-full border-2 border-white","relative inline-block","lg-desktop:size-[36px]"),children:e(o,{source:p.avatar.url,alt:p.avatar?.alt,className:"size-full object-cover"})},c))}):e(o,{className:"lg-desktop:size-[36px] size-[30px] object-cover",source:t.icon?.url,alt:t.icon?.alt,imgClassName:"w-full h-full object-cover"})]}),e("p",{className:"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]",children:t.description})]},l))})});var b=n(m);export{b as default};
 //# sourceMappingURL=BrandEquity.js.map

package/dist/esm/biz-components/BrandEquity/BrandEquity.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/BrandEquity/BrandEquity.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\n\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { ComponentCommonProps, Img } from '../../types/props.js'\n\nexport interface BrandEquityItem {\n  icon?: Img\n  type?: 'icon' | 'avatar'\n  title: string\n  description: string\n  avatarList?: {\n    avatar: Img\n  }[]\n}\n\nexport interface BrandEquityProps extends ComponentCommonProps {\n  data: {\n    items: BrandEquityItem[]\n  }\n  itemShape?: 'round' | 'square'\n  className?: string\n  theme?: 'light' | 'dark'\n}\n\nconst BrandEquity: React.FC<BrandEquityProps> = ({ data: { items = [] }, itemShape = 'square', className = '' }) => {\n  return (\n    <div className={cn('brand-equity-wrapper w-full', className)}>\n      <div className={cn('grid gap-3', 'tablet:grid-cols-2 grid-cols-1', 'laptop:gap-4 laptop:grid-cols-10')}>\n        {items.map((item, index) => (\n          <div\n            key={index}\n            className={cn(\n              'brand-equity-item',\n              'flex flex-col bg-white p-4',\n              'desktop:p-6',\n              'desktop:gap-16 gap-12',\n              'laptop:col-span-3 lg-desktop:p-8',\n              {\n                ['laptop:col-span-4']: [0, 5, 6, 11].includes(index),\n              },\n              itemShape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n            )}\n          >\n            <div className=\"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3\">\n              <h3 className=\"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]\">\n                {item.title}\n              </h3>\n              {item.type === 'avatar' ? (\n                <div className=\"flex -space-x-2\">\n                  {item?.avatarList?.map((item: { avatar: Img }, index: number) => (\n                    <div\n                      key={index}\n                      className={cn(\n                        'size-[30px] overflow-hidden rounded-full border-2 border-white',\n                        'relative inline-block',\n                        'lg-desktop:size-[36px]'\n                      )}\n                    >\n                      <Picture source={item.avatar.url} alt={item.avatar?.alt} className=\"size-full object-cover\" />\n                    </div>\n                  ))}\n                </div>\n              ) : (\n                <Picture\n                  className=\"lg-desktop:size-[36px] size-[30px] object-cover\"\n                  source={item.icon?.url}\n                  alt={item.icon?.alt}\n                  imgClassName=\"w-full h-full object-cover\"\n                />\n              )}\n            </div>\n            <p className=\"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]\">\n              {item.description}\n            </p>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withStyles(BrandEquity)\n"],
-  "mappings": "aA8CY,OACE,OAAAA,EADF,QAAAC,MAAA,oBA7CZ,MAAkB,QAElB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAS,cAAAC,MAAkB,yBAsB3B,MAAMC,EAA0C,CAAC,CAAE,KAAM,CAAE,MAAAC,EAAQ,CAAC,CAAE,EAAG,UAAAC,EAAY,SAAU,UAAAC,EAAY,EAAG,IAE1GR,EAAC,OAAI,UAAWE,EAAG,8BAA+BM,CAAS,EACzD,SAAAR,EAAC,OAAI,UAAWE,EAAG,aAAc,iCAAkC,kCAAkC,EAClG,SAAAI,EAAM,IAAI,CAACG,EAAMC,IAChBT,EAAC,OAEC,UAAWC,EACT,oBACA,6BACA,cACA,wBACA,mCACA,CACG,oBAAsB,CAAC,EAAG,EAAG,EAAG,EAAE,EAAE,SAASQ,CAAK,CACrD,EACAH,IAAc,QAAU,iBAAmB,cAC7C,EAEA,UAAAN,EAAC,OAAI,UAAU,uEACb,UAAAD,EAAC,MAAG,UAAU,mGACX,SAAAS,EAAK,MACR,EACCA,EAAK,OAAS,SACbT,EAAC,OAAI,UAAU,kBACZ,SAAAS,GAAM,YAAY,IAAI,CAACA,EAAuBC,IAC7CV,EAAC,OAEC,UAAWE,EACT,iEACA,wBACA,wBACF,EAEA,SAAAF,EAACG,EAAA,CAAQ,OAAQM,EAAK,OAAO,IAAK,IAAKA,EAAK,QAAQ,IAAK,UAAU,yBAAyB,GAPvFC,CAQP,CACD,EACH,EAEAV,EAACG,EAAA,CACC,UAAU,kDACV,OAAQM,EAAK,MAAM,IACnB,IAAKA,EAAK,MAAM,IAChB,aAAa,6BACf,GAEJ,EACAT,EAAC,KAAE,UAAU,+FACV,SAAAS,EAAK,YACR,IA3CKC,CA4CP,CACD,EACH,EACF,EAIJ,IAAOC,EAAQP,EAAWC,CAAW",
+  "sourcesContent": ["'use client'\nimport React from 'react'\n\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { BrandEquityProps } from './types.js'\n\nimport type { Img } from '../../types/props.js'\n\nconst BrandEquity: React.FC<BrandEquityProps> = ({ data: { items = [] }, itemShape = 'square', className = '' }) => {\n  return (\n    <div className={cn('brand-equity-wrapper w-full', className)}>\n      <div className={cn('grid gap-3', 'tablet:grid-cols-2 grid-cols-1', 'laptop:gap-4 laptop:grid-cols-10')}>\n        {items.map((item, index) => (\n          <div\n            key={index}\n            className={cn(\n              'brand-equity-item',\n              'flex flex-col bg-white p-4',\n              'desktop:p-6',\n              'desktop:gap-16 gap-12',\n              'laptop:col-span-3 lg-desktop:p-8',\n              {\n                ['laptop:col-span-4']: [0, 5, 6, 11].includes(index),\n              },\n              itemShape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n            )}\n          >\n            <div className=\"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3\">\n              <h3 className=\"lg-desktop:text-[18px] text-[14px] font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]\">\n                {item.title}\n              </h3>\n              {item.type === 'avatar' ? (\n                <div className=\"flex -space-x-2\">\n                  {item?.avatarList?.map((item: { avatar: Img }, index: number) => (\n                    <div\n                      key={index}\n                      className={cn(\n                        'size-[30px] overflow-hidden rounded-full border-2 border-white',\n                        'relative inline-block',\n                        'lg-desktop:size-[36px]'\n                      )}\n                    >\n                      <Picture source={item.avatar.url} alt={item.avatar?.alt} className=\"size-full object-cover\" />\n                    </div>\n                  ))}\n                </div>\n              ) : (\n                <Picture\n                  className=\"lg-desktop:size-[36px] size-[30px] object-cover\"\n                  source={item.icon?.url}\n                  alt={item.icon?.alt}\n                  imgClassName=\"w-full h-full object-cover\"\n                />\n              )}\n            </div>\n            <p className=\"lg-desktop:text-[24px] text-[20px] font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]\">\n              {item.description}\n            </p>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withStyles(BrandEquity)\n"],
+  "mappings": "aA6BY,OACE,OAAAA,EADF,QAAAC,MAAA,oBA5BZ,MAAkB,QAElB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAS,cAAAC,MAAkB,yBAK3B,MAAMC,EAA0C,CAAC,CAAE,KAAM,CAAE,MAAAC,EAAQ,CAAC,CAAE,EAAG,UAAAC,EAAY,SAAU,UAAAC,EAAY,EAAG,IAE1GR,EAAC,OAAI,UAAWE,EAAG,8BAA+BM,CAAS,EACzD,SAAAR,EAAC,OAAI,UAAWE,EAAG,aAAc,iCAAkC,kCAAkC,EAClG,SAAAI,EAAM,IAAI,CAACG,EAAMC,IAChBT,EAAC,OAEC,UAAWC,EACT,oBACA,6BACA,cACA,wBACA,mCACA,CACG,oBAAsB,CAAC,EAAG,EAAG,EAAG,EAAE,EAAE,SAASQ,CAAK,CACrD,EACAH,IAAc,QAAU,iBAAmB,cAC7C,EAEA,UAAAN,EAAC,OAAI,UAAU,uEACb,UAAAD,EAAC,MAAG,UAAU,mGACX,SAAAS,EAAK,MACR,EACCA,EAAK,OAAS,SACbT,EAAC,OAAI,UAAU,kBACZ,SAAAS,GAAM,YAAY,IAAI,CAACA,EAAuBC,IAC7CV,EAAC,OAEC,UAAWE,EACT,iEACA,wBACA,wBACF,EAEA,SAAAF,EAACG,EAAA,CAAQ,OAAQM,EAAK,OAAO,IAAK,IAAKA,EAAK,QAAQ,IAAK,UAAU,yBAAyB,GAPvFC,CAQP,CACD,EACH,EAEAV,EAACG,EAAA,CACC,UAAU,kDACV,OAAQM,EAAK,MAAM,IACnB,IAAKA,EAAK,MAAM,IAChB,aAAa,6BACf,GAEJ,EACAT,EAAC,KAAE,UAAU,+FACV,SAAAS,EAAK,YACR,IA3CKC,CA4CP,CACD,EACH,EACF,EAIJ,IAAOC,EAAQP,EAAWC,CAAW",
   "names": ["jsx", "jsxs", "cn", "Picture", "withStyles", "BrandEquity", "items", "itemShape", "className", "item", "index", "BrandEquity_default"]
 }

package/dist/esm/biz-components/BrandEquity/types.d.ts

@@ -0,0 +1,18 @@
+import type { ComponentCommonProps, Img } from '../../types/props.js';
+export interface BrandEquityItem {
+    icon?: Img;
+    type?: 'icon' | 'avatar';
+    title: string;
+    description: string;
+    avatarList?: {
+        avatar: Img;
+    }[];
+}
+export interface BrandEquityProps extends ComponentCommonProps {
+    data: {
+        items: BrandEquityItem[];
+    };
+    itemShape?: 'round' | 'square';
+    className?: string;
+    theme?: 'light' | 'dark';
+}

package/dist/esm/biz-components/BrandEquity/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/biz-components/BrandEquity/types.js.map

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

package/dist/esm/biz-components/MediaPlayerSticky/index.d.ts

@@ -0,0 +1,9 @@
+import type { MediaPlayerBaseProps } from './types.js';
+declare const _default: {
+    (props: Omit<MediaPlayerBaseProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
+        className?: string;
+        data?: Record<string, any>;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default _default;

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

@@ -0,0 +1,2 @@
+"use client";import{Fragment as p,jsx as e,jsxs as o}from"react/jsx-runtime";import{useState as b,useRef as N,useEffect as k}from"react";import{cn as P}from"../../helpers/utils.js";import{withStyles as h}from"../../shared/Styles.js";import w from"../Slogan/index.js";import{Grid as n,GridItem as a}from"../../components/gird.js";import{Container as l}from"../../components/container.js";import x from"../BrandEquity/index.js";import G from"../MemberEquity/index.js";import{gsap as c}from"gsap/dist/gsap";import{ScrollTrigger as M}from"gsap/dist/ScrollTrigger";import{convertLexicalToHTML as d}from"@payloadcms/richtext-lexical/html";const C=({children:s,id:r,components:i})=>(k(()=>{const t=window.screen.height;c.registerPlugin(M),c.timeline({scrollTrigger:{trigger:`#${r}`,start:"top top",end:`top+=${t*1.8}px bottom`,markers:!0,scrub:0}}).to(`#${r} .sticky-cover`,{opacity:1,duration:.3}).to(`#${r} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")},[]),o("div",{id:r,className:"relative z-10",children:[e(p,{children:s}),e(p,{children:i?.map(t=>{switch(t.blockType){case"ipc-brand-equity":return e("div",{className:"bg-[#1D1D1F]",children:e(l,{className:"!my-0",children:o(n,{children:[e(a,{span:1}),e(a,{span:10,children:e(x,{data:t})}),e(a,{span:1})]})})});case"ipc-member-equity":return e("div",{className:"w-full bg-[#1D1D1F] py-10",children:e(l,{className:"!my-0",children:o(n,{children:[e(a,{span:1}),e(a,{span:10,children:e(G,{data:t,className:"w-full"})}),e(a,{span:1})]})})});default:return null}})})]})),S=({className:s="",id:r,data:{title:i,videoTitle:t,btnText:R,img:z,video:u,theme:m,shape:y,components:f}})=>{const[B,I]=b(!1),g=N(null),v=typeof i=="string"?i:i&&d({data:i});return typeof t=="string"||t&&d({data:t}),e(C,{id:r,components:f,children:o("div",{className:P("relative w-full h-screen",s,{"aiui-dark":m==="dark","rounded-box":y==="rounded"}),children:[e("div",{className:"media-content absolute w-full left-1/2 top-1/2 z-20 -translate-x-1/2 -translate-y-1/2",children:e(l,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:o(n,{children:[e(a,{span:1}),e(a,{span:10,children:e(w,{className:"sticky-title",data:{title:v||"",theme:m}})}),e(a,{span:1})]})})}),o("div",{className:"media-cover w-full h-screen relative overflow-hidden",children:[e("video",{ref:g,className:"size-full object-cover",src:u?.url,autoPlay:!0,muted:!0,loop:!0}),e("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full opacity-0",style:{background:"linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #1D1D1F 100%)"}})]})]})})};var A=h(S);export{A as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/MediaPlayerSticky/index.tsx"],
+  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport { gsap } from 'gsap/dist/gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\n\nconst StickyBox = ({\n  children,\n  id,\n  components,\n}: {\n  children: React.ReactNode\n  id?: string\n  components?: MediaPlayerComponent[]\n}) => {\n  useEffect(() => {\n    const height = window.screen.height\n\n    gsap.registerPlugin(ScrollTrigger)\n    gsap\n      .timeline({\n        scrollTrigger: {\n          trigger: `#${id}`,\n          start: 'top top',\n          end: `top+=${height * 1.8}px bottom`,\n          markers: true,\n          scrub: 0,\n        },\n      })\n      .to(`#${id} .sticky-cover`, {\n        opacity: 1,\n        duration: 0.3,\n      })\n      .to(\n        `#${id} .media-content`,\n        {\n          top: '100%',\n          transform: 'translate(-50%, -100%)',\n          duration: 1,\n        },\n        '<'\n      )\n  }, [])\n\n  return (\n    <div id={id} className=\"relative z-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"bg-[#1D1D1F]\">\n                  <Container className=\"!my-0\">\n                    <Grid>\n                      <GridItem span={1} />\n                      <GridItem span={10}>\n                        <BrandEquity data={componentData} />\n                      </GridItem>\n                      <GridItem span={1} />\n                    </Grid>\n                  </Container>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"w-full bg-[#1D1D1F] py-10\">\n                  <Container className=\"!my-0\">\n                    <Grid>\n                      <GridItem span={1} />\n                      <GridItem span={10}>\n                        <MemberEquity data={componentData} className=\"w-full\" />\n                      </GridItem>\n                      <GridItem span={1} />\n                    </Grid>\n                  </Container>\n                </div>\n              )\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n}\n\nconst MediaPlayerSticky: React.FC<MediaPlayerBaseProps> = ({\n  className = '',\n  id,\n  data: { title, videoTitle, btnText, img, video, theme, shape, components },\n}) => {\n  const [isPlaying, setIsPlaying] = useState(false)\n  const videoRef = useRef<HTMLVideoElement>(null)\n\n  const title_html = typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title })\n  typeof videoTitle === 'string' ? videoTitle : videoTitle && convertLexicalToHTML({ data: videoTitle })\n\n  return (\n    <StickyBox id={id} components={components}>\n      <div\n        className={cn('relative w-full h-screen', className, {\n          'aiui-dark': theme === 'dark',\n          'rounded-box': shape === 'rounded',\n        })}\n      >\n        <div className=\"media-content absolute w-full left-1/2 top-1/2 z-20 -translate-x-1/2 -translate-y-1/2\">\n          <Container spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n            <Grid>\n              <GridItem span={1} />\n              <GridItem span={10}>\n                <Slogan className=\"sticky-title\" data={{ title: title_html || '', theme }} />\n              </GridItem>\n              <GridItem span={1} />\n            </Grid>\n          </Container>\n        </div>\n        <div className=\"media-cover w-full h-screen relative overflow-hidden\">\n          <video ref={videoRef} className=\"size-full object-cover\" src={video?.url} autoPlay muted loop />\n          <div\n            className=\"sticky-cover absolute left-0 top-0 z-10 size-full opacity-0\"\n            style={{\n              background: 'linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #1D1D1F 100%)',\n            }}\n          />\n        </div>\n      </div>\n    </StickyBox>\n  )\n}\n\nexport default withStyles(MediaPlayerSticky)\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "useState", "useRef", "useEffect", "cn", "withStyles", "Slogan", "Grid", "GridItem", "Container", "BrandEquity", "MemberEquity", "gsap", "ScrollTrigger", "convertLexicalToHTML", "StickyBox", "children", "id", "components", "height", "componentData", "MediaPlayerSticky", "className", "title", "videoTitle", "btnText", "img", "video", "theme", "shape", "isPlaying", "setIsPlaying", "videoRef", "title_html", "MediaPlayerSticky_default"]
+}

package/dist/esm/biz-components/MediaPlayerSticky/types.d.ts

@@ -0,0 +1,16 @@
+import type { ComponentCommonProps, Shape, Theme, Video, Img } from '../../types/props.js';
+import type { BrandEquityProps } from '../BrandEquity/types.js';
+import type { MemberEquityProps } from '../MemberEquity/types.js';
+export type MediaPlayerComponent = BrandEquityProps | MemberEquityProps;
+export interface MediaPlayerBaseProps extends ComponentCommonProps {
+    data: {
+        shape?: Shape;
+        theme?: Theme;
+        title?: string;
+        videoTitle?: string;
+        btnText?: string;
+        img?: Img;
+        video?: Video;
+        components?: MediaPlayerComponent[];
+    };
+}

package/dist/esm/biz-components/MediaPlayerSticky/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/biz-components/MediaPlayerSticky/types.js.map

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

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

@@ -1,2 +1,2 @@
-"use client";import{jsx as n,jsxs as G}from"react/jsx-runtime";import s,{useRef as D}from"react";import{useGSAP as $}from"@gsap/react";import{gsap as y}from"gsap";import{SplitText as N}from"gsap/SplitText";import{ScrollTrigger as S}from"gsap/ScrollTrigger";import{cn as I}from"../../helpers/utils.js";import{Heading as j,Text as z}from"../../components/index.js";import{withStyles as L}from"../../shared/Styles.js";y.registerPlugin(N,S);function U(a=[],i=3){const p=[];for(let r=0;r<a.length;r+=i)p.push(a.slice(r,r+i));return p}const E=s.forwardRef(({data:a,className:i=""},p)=>{const{title:r,features:c=[],featureChunkSize:T=3}=a,[g,b]=s.useState(0),[R,d]=s.useState(!0),u=U(c,T),x=u.length,o=c.length>T,F=o?[...u,u[0]]:u,h=40;s.useEffect(()=>{if(!o)return;const t=setInterval(()=>{b(e=>e+1),d(!0)},3e3);return()=>clearInterval(t)},[x,o]),s.useEffect(()=>{if(o)if(g===x){const t=setTimeout(()=>{d(!1),b(0)},500);return()=>clearTimeout(t)}else d(!0)},[g,x,o]);const f=D(null),m=D(null);return $(()=>{if(!f.current)return;m.current=new N(f.current,{type:"words",wordsClass:"word"});const t=m.current.words;return y.set(t,{opacity:0}),S.create({trigger:f.current,start:"top 80%",end:"top 50%",scrub:!0,onUpdate:e=>{const w=e.progress,l=t.length,H=1/l,k=.5;t.forEach((P,A)=>{const C=A/l*(1-k),M=H*(1+k);let v=(w-C)/M;v=Math.max(0,Math.min(v,1)),y.set(P,{opacity:v})})}}),()=>{m.current&&m.current.revert(),S.getAll().forEach(e=>e.kill())}},[]),G("div",{ref:p,className:I("laptop:flex-row laptop:items-end laptop:justify-between text-info-primary laptop:min-h-[64px] lg-desktop:min-h-[128px] flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center",i),children:[n(j,{ref:f,as:"h2",size:2,weight:"bold",align:"left",className:"slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none text-[#1D1D1F]",children:r}),c&&c.length>0&&n("div",{className:"relative w-full max-w-[500px] overflow-hidden",style:{height:`${h}px`},children:n("div",{className:I(["flex flex-col",R?"transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]":"!transition-none"]),style:{transform:`translateY(-${g*h}px)`},children:F.map((t,e)=>n("div",{className:"flex w-full flex-row items-stretch gap-3 overflow-hidden",style:{height:`${h}px`},children:t.map((w,l)=>G(s.Fragment,{children:[l>0&&n("div",{className:"slogan-feature-divider w-px self-stretch bg-[#D9D9D9]"}),n(z,{align:"left",as:"p",className:"slogan-feature-text tablet:text-[13px] laptop:text-[14px] line-clamp-2 text-[12px] font-medium leading-[1.4] text-[#1D1D1F]",html:w.title})]},l))},e))})})]})});E.displayName="Slogan";var W=L(E);export{W as default};
+"use client";import{jsx as n,jsxs as R}from"react/jsx-runtime";import o,{useRef as E}from"react";import{useGSAP as z}from"@gsap/react";import{gsap as y}from"gsap";import{SplitText as I}from"gsap/dist/SplitText";import{ScrollTrigger as b}from"gsap/dist/ScrollTrigger";import{cn as S}from"../../helpers/utils.js";import{Heading as L,Text as U}from"../../components/index.js";import{withStyles as Y}from"../../shared/Styles.js";y.registerPlugin(I,b);function q(i=[],p=3){const c=[];for(let r=0;r<i.length;r+=p)c.push(i.slice(r,r+p));return c}const G=o.forwardRef(({data:i,className:p=""},c)=>{const{title:r,features:u=[],featureChunkSize:T=3,theme:k}=i,[d,D]=o.useState(0),[F,x]=o.useState(!0),f=q(u,T),h=f.length,s=u.length>T,M=s?[...f,f[0]]:f,w=40;o.useEffect(()=>{if(!s)return;const t=setInterval(()=>{D(e=>e+1),x(!0)},3e3);return()=>clearInterval(t)},[h,s]),o.useEffect(()=>{if(s)if(d===h){const t=setTimeout(()=>{x(!1),D(0)},500);return()=>clearTimeout(t)}else x(!0)},[d,h,s]);const l=E(null),m=E(null);return z(()=>{if(!l.current)return;m.current=new I(l.current,{type:"words",wordsClass:"word"});const t=l.current?.clientHeight||100,e=m.current.words;return y.set(e,{opacity:0}),b.create({trigger:l.current,start:"bottom bottom",end:`bottom bottom-=${t+40}px`,scrub:!0,onUpdate:a=>{const g=a.progress,N=e.length,P=1/N,H=.5;e.forEach(($,A)=>{const C=A/N*(1-H),j=P*(1+H);let v=(g-C)/j;v=Math.max(0,Math.min(v,1)),y.set($,{opacity:v})})}}),()=>{m.current&&m.current.revert(),b.getAll().forEach(a=>a.kill())}},[]),R("div",{ref:c,className:S("laptop:flex-row laptop:items-end laptop:justify-between text-info-primary laptop:min-h-[64px] lg-desktop:min-h-[128px] flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center",p),children:[n(L,{ref:l,as:"h2",size:2,weight:"bold",align:"left",className:S("slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none",{"text-[#1D1D1F]":k!=="dark","text-[#fff]":k==="dark"}),children:r}),u&&u.length>0&&n("div",{className:"relative w-full max-w-[500px] overflow-hidden",style:{height:`${w}px`},children:n("div",{className:S(["flex flex-col",F?"transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]":"!transition-none"]),style:{transform:`translateY(-${d*w}px)`},children:M.map((t,e)=>n("div",{className:"flex w-full flex-row items-stretch gap-3 overflow-hidden",style:{height:`${w}px`},children:t.map((a,g)=>R(o.Fragment,{children:[g>0&&n("div",{className:"slogan-feature-divider w-px self-stretch bg-[#D9D9D9]"}),n(U,{align:"left",as:"p",className:"slogan-feature-text tablet:text-[13px] laptop:text-[14px] line-clamp-2 text-[12px] font-medium leading-[1.4] text-[#1D1D1F]",html:a.title})]},g))},e))})})]})});G.displayName="Slogan";var Z=Y(G);export{Z as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Slogan/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useRef } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/SplitText'\nimport { ScrollTrigger } from 'gsap/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SloganProps } from './types.js'\n\ngsap.registerPlugin(SplitText, ScrollTrigger)\n\nfunction chunkArray(array: { title: string }[] = [], size: number = 3) {\n  const result = []\n  for (let i = 0; i < array.length; i += size) {\n    result.push(array.slice(i, i + size))\n  }\n  return result\n}\n\nconst Slogan = React.forwardRef<HTMLDivElement, SloganProps>(({ data, className = '' }, ref) => {\n  const { title, features = [], featureChunkSize = 3 } = data\n  const [groupIndex, setGroupIndex] = React.useState(0)\n  const [isTransitioning, setIsTransitioning] = React.useState(true)\n  const featuresGroups = chunkArray(features, featureChunkSize)\n  const totalGroups = featuresGroups.length\n  const needCarousel = features.length > featureChunkSize\n  const displayGroups = needCarousel ? [...featuresGroups, featuresGroups[0]] : featuresGroups\n  const groupHeight = 40\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u542F\u7528\u5B9A\u65F6\u5668\n  React.useEffect(() => {\n    if (!needCarousel) return\n    const timer = setInterval(() => {\n      setGroupIndex(i => i + 1)\n      setIsTransitioning(true)\n    }, 3000)\n    return () => clearInterval(timer)\n  }, [totalGroups, needCarousel])\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u5904\u7406\u65E0\u7F1D\u8DF3\u8F6C\n  React.useEffect(() => {\n    if (!needCarousel) return\n    if (groupIndex === totalGroups) {\n      const handle = setTimeout(() => {\n        setIsTransitioning(false)\n        setGroupIndex(0)\n      }, 500) // 500ms\u7B49\u4E8E\u52A8\u753B\u65F6\u957F\n      return () => clearTimeout(handle)\n    } else {\n      setIsTransitioning(true)\n    }\n  }, [groupIndex, totalGroups, needCarousel])\n\n  // \u6807\u9898\u52A8\u753B\u903B\u8F91\u4FDD\u6301\u4E0D\u53D8\n  const titleRef = useRef(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    if (!titleRef.current) return\n    splitTextInstance.current = new SplitText(titleRef.current, {\n      type: 'words',\n      wordsClass: 'word',\n    })\n    const words = splitTextInstance.current.words\n    gsap.set(words, { opacity: 0 })\n    ScrollTrigger.create({\n      trigger: titleRef.current,\n      start: 'top 80%',\n      end: 'top 50%',\n      scrub: true,\n      onUpdate: self => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word, i) => {\n          const start = (i / total) * (1 - overlap)\n          const width = interval * (1 + overlap)\n          let opacity = (progress - start) / width\n          opacity = Math.max(0, Math.min(opacity, 1))\n          gsap.set(word, { opacity })\n        })\n      },\n    })\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach(t => t.kill())\n    }\n  }, [])\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'laptop:flex-row laptop:items-end laptop:justify-between text-info-primary laptop:min-h-[64px] lg-desktop:min-h-[128px] flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center',\n        className\n      )}\n    >\n      <Heading\n        ref={titleRef}\n        as=\"h2\"\n        size={2}\n        weight={'bold'}\n        align={'left'}\n        className=\"slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none text-[#1D1D1F]\"\n      >\n        {title}\n      </Heading>\n      {features && features.length > 0 && (\n        <div className=\"relative w-full max-w-[500px] overflow-hidden\" style={{ height: `${groupHeight}px` }}>\n          <div\n            className={cn([\n              'flex flex-col',\n              isTransitioning ? 'transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]' : '!transition-none',\n            ])}\n            style={{\n              transform: `translateY(-${groupIndex * groupHeight}px)`,\n            }}\n          >\n            {displayGroups.map((group, idx) => (\n              <div\n                className=\"flex w-full flex-row items-stretch gap-3 overflow-hidden\"\n                style={{ height: `${groupHeight}px` }}\n                key={idx}\n              >\n                {group.map((feature, index) => (\n                  <React.Fragment key={index}>\n                    {index > 0 && <div className=\"slogan-feature-divider w-px self-stretch bg-[#D9D9D9]\" />}\n                    <Text\n                      align=\"left\"\n                      as=\"p\"\n                      className=\"slogan-feature-text tablet:text-[13px] laptop:text-[14px] line-clamp-2 text-[12px] font-medium leading-[1.4] text-[#1D1D1F]\"\n                      html={feature.title}\n                    />\n                  </React.Fragment>\n                ))}\n              </div>\n            ))}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n})\n\nSlogan.displayName = 'Slogan'\n\nexport default withStyles(Slogan)\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "React", "useRef", "useGSAP", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "Text", "withStyles", "chunkArray", "array", "size", "result", "i", "Slogan", "data", "className", "ref", "title", "features", "featureChunkSize", "groupIndex", "setGroupIndex", "isTransitioning", "setIsTransitioning", "featuresGroups", "totalGroups", "needCarousel", "displayGroups", "groupHeight", "timer", "handle", "titleRef", "splitTextInstance", "words", "self", "progress", "total", "interval", "overlap", "word", "start", "width", "opacity", "t", "group", "idx", "feature", "index", "Slogan_default"]
+  "sourcesContent": ["'use client'\nimport React, { useRef } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SloganProps } from './types.js'\n\ngsap.registerPlugin(SplitText, ScrollTrigger)\n\nfunction chunkArray(array: { title: string }[] = [], size: number = 3) {\n  const result = []\n  for (let i = 0; i < array.length; i += size) {\n    result.push(array.slice(i, i + size))\n  }\n  return result\n}\n\nconst Slogan = React.forwardRef<HTMLDivElement, SloganProps>(({ data, className = '' }, ref) => {\n  const { title, features = [], featureChunkSize = 3, theme } = data\n  const [groupIndex, setGroupIndex] = React.useState(0)\n  const [isTransitioning, setIsTransitioning] = React.useState(true)\n  const featuresGroups = chunkArray(features, featureChunkSize)\n  const totalGroups = featuresGroups.length\n  const needCarousel = features.length > featureChunkSize\n  const displayGroups = needCarousel ? [...featuresGroups, featuresGroups[0]] : featuresGroups\n  const groupHeight = 40\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u542F\u7528\u5B9A\u65F6\u5668\n  React.useEffect(() => {\n    if (!needCarousel) return\n    const timer = setInterval(() => {\n      setGroupIndex(i => i + 1)\n      setIsTransitioning(true)\n    }, 3000)\n    return () => clearInterval(timer)\n  }, [totalGroups, needCarousel])\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u5904\u7406\u65E0\u7F1D\u8DF3\u8F6C\n  React.useEffect(() => {\n    if (!needCarousel) return\n    if (groupIndex === totalGroups) {\n      const handle = setTimeout(() => {\n        setIsTransitioning(false)\n        setGroupIndex(0)\n      }, 500) // 500ms\u7B49\u4E8E\u52A8\u753B\u65F6\u957F\n      return () => clearTimeout(handle)\n    } else {\n      setIsTransitioning(true)\n    }\n  }, [groupIndex, totalGroups, needCarousel])\n\n  // \u6807\u9898\u52A8\u753B\u903B\u8F91\u4FDD\u6301\u4E0D\u53D8\n  const titleRef = useRef<HTMLHeadingElement>(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    if (!titleRef.current) return\n    splitTextInstance.current = new SplitText(titleRef.current, {\n      type: 'words',\n      wordsClass: 'word',\n    })\n    const height = titleRef.current?.clientHeight || 100\n\n    const words = splitTextInstance.current.words\n    gsap.set(words, { opacity: 0 })\n    ScrollTrigger.create({\n      trigger: titleRef.current,\n      start: 'bottom bottom',\n      end: `bottom bottom-=${height + 40}px`,\n      scrub: true,\n      onUpdate: self => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word, i) => {\n          const start = (i / total) * (1 - overlap)\n          const width = interval * (1 + overlap)\n          let opacity = (progress - start) / width\n          opacity = Math.max(0, Math.min(opacity, 1))\n          gsap.set(word, { opacity })\n        })\n      },\n    })\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach(t => t.kill())\n    }\n  }, [])\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'laptop:flex-row laptop:items-end laptop:justify-between text-info-primary laptop:min-h-[64px] lg-desktop:min-h-[128px] flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center',\n        className\n      )}\n    >\n      <Heading\n        ref={titleRef}\n        as=\"h2\"\n        size={2}\n        weight={'bold'}\n        align={'left'}\n        className={cn(\n          'slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none',\n          {\n            'text-[#1D1D1F]': theme !== 'dark',\n            'text-[#fff]': theme === 'dark',\n          }\n        )}\n      >\n        {title}\n      </Heading>\n      {features && features.length > 0 && (\n        <div className=\"relative w-full max-w-[500px] overflow-hidden\" style={{ height: `${groupHeight}px` }}>\n          <div\n            className={cn([\n              'flex flex-col',\n              isTransitioning ? 'transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]' : '!transition-none',\n            ])}\n            style={{\n              transform: `translateY(-${groupIndex * groupHeight}px)`,\n            }}\n          >\n            {displayGroups.map((group, idx) => (\n              <div\n                className=\"flex w-full flex-row items-stretch gap-3 overflow-hidden\"\n                style={{ height: `${groupHeight}px` }}\n                key={idx}\n              >\n                {group.map((feature, index) => (\n                  <React.Fragment key={index}>\n                    {index > 0 && <div className=\"slogan-feature-divider w-px self-stretch bg-[#D9D9D9]\" />}\n                    <Text\n                      align=\"left\"\n                      as=\"p\"\n                      className=\"slogan-feature-text tablet:text-[13px] laptop:text-[14px] line-clamp-2 text-[12px] font-medium leading-[1.4] text-[#1D1D1F]\"\n                      html={feature.title}\n                    />\n                  </React.Fragment>\n                ))}\n              </div>\n            ))}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n})\n\nSlogan.displayName = 'Slogan'\n\nexport default withStyles(Slogan)\n"],
+  "mappings": "aAqGM,cAAAA,EAkCY,QAAAC,MAlCZ,oBApGN,OAAOC,GAAS,UAAAC,MAAc,QAC9B,OAAS,WAAAC,MAAe,cACxB,OAAS,QAAAC,MAAY,OACrB,OAAS,aAAAC,MAAiB,sBAC1B,OAAS,iBAAAC,MAAqB,0BAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC9B,OAAS,cAAAC,MAAkB,yBAG3BN,EAAK,eAAeC,EAAWC,CAAa,EAE5C,SAASK,EAAWC,EAA6B,CAAC,EAAGC,EAAe,EAAG,CACrE,MAAMC,EAAS,CAAC,EAChB,QAASC,EAAI,EAAGA,EAAIH,EAAM,OAAQG,GAAKF,EACrCC,EAAO,KAAKF,EAAM,MAAMG,EAAGA,EAAIF,CAAI,CAAC,EAEtC,OAAOC,CACT,CAEA,MAAME,EAASf,EAAM,WAAwC,CAAC,CAAE,KAAAgB,EAAM,UAAAC,EAAY,EAAG,EAAGC,IAAQ,CAC9F,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAW,CAAC,EAAG,iBAAAC,EAAmB,EAAG,MAAAC,CAAM,EAAIN,EACxD,CAACO,EAAYC,CAAa,EAAIxB,EAAM,SAAS,CAAC,EAC9C,CAACyB,EAAiBC,CAAkB,EAAI1B,EAAM,SAAS,EAAI,EAC3D2B,EAAiBjB,EAAWU,EAAUC,CAAgB,EACtDO,EAAcD,EAAe,OAC7BE,EAAeT,EAAS,OAASC,EACjCS,EAAgBD,EAAe,CAAC,GAAGF,EAAgBA,EAAe,CAAC,CAAC,EAAIA,EACxEI,EAAc,GAGpB/B,EAAM,UAAU,IAAM,CACpB,GAAI,CAAC6B,EAAc,OACnB,MAAMG,EAAQ,YAAY,IAAM,CAC9BR,EAAcV,GAAKA,EAAI,CAAC,EACxBY,EAAmB,EAAI,CACzB,EAAG,GAAI,EACP,MAAO,IAAM,cAAcM,CAAK,CAClC,EAAG,CAACJ,EAAaC,CAAY,CAAC,EAG9B7B,EAAM,UAAU,IAAM,CACpB,GAAK6B,EACL,GAAIN,IAAeK,EAAa,CAC9B,MAAMK,EAAS,WAAW,IAAM,CAC9BP,EAAmB,EAAK,EACxBF,EAAc,CAAC,CACjB,EAAG,GAAG,EACN,MAAO,IAAM,aAAaS,CAAM,CAClC,MACEP,EAAmB,EAAI,CAE3B,EAAG,CAACH,EAAYK,EAAaC,CAAY,CAAC,EAG1C,MAAMK,EAAWjC,EAA2B,IAAI,EAC1CkC,EAAoBlC,EAAyB,IAAI,EACvD,OAAAC,EAAQ,IAAM,CACZ,GAAI,CAACgC,EAAS,QAAS,OACvBC,EAAkB,QAAU,IAAI/B,EAAU8B,EAAS,QAAS,CAC1D,KAAM,QACN,WAAY,MACd,CAAC,EACD,MAAME,EAASF,EAAS,SAAS,cAAgB,IAE3CG,EAAQF,EAAkB,QAAQ,MACxC,OAAAhC,EAAK,IAAIkC,EAAO,CAAE,QAAS,CAAE,CAAC,EAC9BhC,EAAc,OAAO,CACnB,QAAS6B,EAAS,QAClB,MAAO,gBACP,IAAK,kBAAkBE,EAAS,EAAE,KAClC,MAAO,GACP,SAAUE,GAAQ,CAChB,MAAMC,EAAWD,EAAK,SAChBE,EAAQH,EAAM,OACdI,EAAW,EAAID,EACfE,EAAU,GAChBL,EAAM,QAAQ,CAACM,EAAM7B,IAAM,CACzB,MAAM8B,EAAS9B,EAAI0B,GAAU,EAAIE,GAC3BG,EAAQJ,GAAY,EAAIC,GAC9B,IAAII,GAAWP,EAAWK,GAASC,EACnCC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAIA,EAAS,CAAC,CAAC,EAC1C3C,EAAK,IAAIwC,EAAM,CAAE,QAAAG,CAAQ,CAAC,CAC5B,CAAC,CACH,CACF,CAAC,EACM,IAAM,CACXX,EAAkB,SAAWA,EAAkB,QAAQ,OAAO,EAC9D9B,EAAc,OAAO,EAAE,QAAQ0C,GAAKA,EAAE,KAAK,CAAC,CAC9C,CACF,EAAG,CAAC,CAAC,EAGHhD,EAAC,OACC,IAAKmB,EACL,UAAWZ,EACT,uMACAW,CACF,EAEA,UAAAnB,EAACS,EAAA,CACC,IAAK2B,EACL,GAAG,KACH,KAAM,EACN,OAAQ,OACR,MAAO,OACP,UAAW5B,EACT,uGACA,CACE,iBAAkBgB,IAAU,OAC5B,cAAeA,IAAU,MAC3B,CACF,EAEC,SAAAH,EACH,EACCC,GAAYA,EAAS,OAAS,GAC7BtB,EAAC,OAAI,UAAU,gDAAgD,MAAO,CAAE,OAAQ,GAAGiC,CAAW,IAAK,EACjG,SAAAjC,EAAC,OACC,UAAWQ,EAAG,CACZ,gBACAmB,EAAkB,mEAAqE,kBACzF,CAAC,EACD,MAAO,CACL,UAAW,eAAeF,EAAaQ,CAAW,KACpD,EAEC,SAAAD,EAAc,IAAI,CAACkB,EAAOC,IACzBnD,EAAC,OACC,UAAU,2DACV,MAAO,CAAE,OAAQ,GAAGiC,CAAW,IAAK,EAGnC,SAAAiB,EAAM,IAAI,CAACE,EAASC,IACnBpD,EAACC,EAAM,SAAN,CACE,UAAAmD,EAAQ,GAAKrD,EAAC,OAAI,UAAU,wDAAwD,EACrFA,EAACU,EAAA,CACC,MAAM,OACN,GAAG,IACH,UAAU,8HACV,KAAM0C,EAAQ,MAChB,IAPmBC,CAQrB,CACD,GAZIF,CAaP,CACD,EACH,EACF,GAEJ,CAEJ,CAAC,EAEDlC,EAAO,YAAc,SAErB,IAAOqC,EAAQ3C,EAAWM,CAAM",
+  "names": ["jsx", "jsxs", "React", "useRef", "useGSAP", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "Text", "withStyles", "chunkArray", "array", "size", "result", "i", "Slogan", "data", "className", "ref", "title", "features", "featureChunkSize", "theme", "groupIndex", "setGroupIndex", "isTransitioning", "setIsTransitioning", "featuresGroups", "totalGroups", "needCarousel", "displayGroups", "groupHeight", "timer", "handle", "titleRef", "splitTextInstance", "height", "words", "self", "progress", "total", "interval", "overlap", "word", "start", "width", "opacity", "t", "group", "idx", "feature", "index", "Slogan_default"]
 }

package/dist/esm/biz-components/Slogan/types.d.ts

@@ -1,3 +1,4 @@
+import type { Theme } from '../../types/props.js';
 export interface Feature {
     /**
      * 特性标题
@@ -18,6 +19,10 @@ export interface SloganProps {
          * 特性列表
          */
         features?: Feature[];
+        /**
+         * 主题
+         */
+        theme?: Theme;
     };
     /**
      * 自定义类名

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

@@ -1,2 +1,2 @@
-"use client";import{jsx as f}from"react/jsx-runtime";import S,{useRef as a}from"react";import{useGSAP as b}from"@gsap/react";import{gsap as i}from"gsap";import{SplitText as m}from"gsap/SplitText";import{ScrollTrigger as l}from"gsap/ScrollTrigger";import{cn as P}from"../../helpers/utils.js";import{Heading as R}from"../../components/index.js";import{withStyles as E}from"../../shared/Styles.js";i.registerPlugin(m,l);const u=S.forwardRef(({data:d,className:g})=>{const{title:n}=d,t=a(null),r=a(null);return b(()=>{if(!t.current)return;r.current=new m(t.current,{type:"words",wordsClass:"word"});const e=r.current.words;return i.set(e,{opacity:0}),l.create({trigger:t.current,start:"top 80%",end:"top 50%",scrub:!0,onUpdate:o=>{const h=o.progress,p=e.length,w=1/p,c=.5;e.forEach((T,y)=>{const v=y/p*(1-c),x=w*(1+c);let s=(h-v)/x;s=Math.max(0,Math.min(s,1)),i.set(T,{opacity:s})})}}),()=>{r.current&&r.current.revert(),l.getAll().forEach(o=>o.kill())}},[]),n&&f("div",{className:P("tablet:mb-[32px] mb-[24px] space-y-4",g),children:f(R,{ref:t,as:"h2",size:5,html:n})})});u.displayName="Title";var G=E(u);export{G as default};
+"use client";import{jsx as f}from"react/jsx-runtime";import S,{useRef as m}from"react";import{useGSAP as E}from"@gsap/react";import{gsap as i}from"gsap";import{SplitText as p}from"gsap/SplitText";import{ScrollTrigger as n}from"gsap/ScrollTrigger";import{cn as M}from"../../helpers/utils.js";import{Heading as P}from"../../components/index.js";import{withStyles as R}from"../../shared/Styles.js";i.registerPlugin(p,n);const u=S.forwardRef(({data:d,className:g})=>{const{title:l,theme:h}=d,t=m(null),r=m(null);return E(()=>{if(!t.current)return;const T=t.current?.clientHeight||80;r.current=new p(t.current,{type:"words",wordsClass:"word"});const e=r.current.words;return i.set(e,{opacity:0}),n.create({trigger:t.current,start:"bottom bottom",end:`bottom bottom+=${T+20}px`,scrub:!0,onUpdate:o=>{const w=o.progress,c=e.length,b=1/c,a=.5;e.forEach((y,x)=>{const v=x/c*(1-a),H=b*(1+a);let s=(w-v)/H;s=Math.max(0,Math.min(s,1)),i.set(y,{opacity:s})})}}),()=>{r.current&&r.current.revert(),n.getAll().forEach(o=>o.kill())}},[]),l&&f("div",{className:M("tablet:mb-[32px] mb-[24px] space-y-4",g,{"aiui-dark":h==="dark"}),children:f(P,{ref:t,as:"h2",size:5,html:l})})});u.displayName="Title";var I=R(u);export{I as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Title/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useRef } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/SplitText'\nimport { ScrollTrigger } from 'gsap/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { TitleProps } from './types.js'\n\ngsap.registerPlugin(SplitText, ScrollTrigger)\nconst Title = React.forwardRef<HTMLDivElement, TitleProps>(({ data, className }) => {\n  const { title } = data\n  const titleRef = useRef(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    if (!titleRef.current) return\n    splitTextInstance.current = new SplitText(titleRef.current, {\n      type: 'words',\n      wordsClass: 'word',\n    })\n    const words = splitTextInstance.current.words\n    gsap.set(words, { opacity: 0 })\n    ScrollTrigger.create({\n      trigger: titleRef.current,\n      start: 'top 80%',\n      end: 'top 50%',\n      scrub: true,\n      onUpdate: self => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word, i) => {\n          const start = (i / total) * (1 - overlap)\n          const width = interval * (1 + overlap)\n          let opacity = (progress - start) / width\n          opacity = Math.max(0, Math.min(opacity, 1))\n          gsap.set(word, { opacity })\n        })\n      },\n    })\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach(t => t.kill())\n    }\n  }, [])\n\n  return (\n    title && (\n      <div className={cn('tablet:mb-[32px] mb-[24px] space-y-4', className)}>\n        <Heading ref={titleRef} as=\"h2\" size={5} html={title} />\n      </div>\n    )\n  )\n})\n\nTitle.displayName = 'Title'\n\nexport default withStyles(Title)\n"],
-  "mappings": "aAoDQ,cAAAA,MAAA,oBAnDR,OAAOC,GAAS,UAAAC,MAAc,QAC9B,OAAS,WAAAC,MAAe,cACxB,OAAS,QAAAC,MAAY,OACrB,OAAS,aAAAC,MAAiB,iBAC1B,OAAS,iBAAAC,MAAqB,qBAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,MAAe,4BACxB,OAAS,cAAAC,MAAkB,yBAG3BL,EAAK,eAAeC,EAAWC,CAAa,EAC5C,MAAMI,EAAQT,EAAM,WAAuC,CAAC,CAAE,KAAAU,EAAM,UAAAC,CAAU,IAAM,CAClF,KAAM,CAAE,MAAAC,CAAM,EAAIF,EACZG,EAAWZ,EAAO,IAAI,EACtBa,EAAoBb,EAAyB,IAAI,EACvD,OAAAC,EAAQ,IAAM,CACZ,GAAI,CAACW,EAAS,QAAS,OACvBC,EAAkB,QAAU,IAAIV,EAAUS,EAAS,QAAS,CAC1D,KAAM,QACN,WAAY,MACd,CAAC,EACD,MAAME,EAAQD,EAAkB,QAAQ,MACxC,OAAAX,EAAK,IAAIY,EAAO,CAAE,QAAS,CAAE,CAAC,EAC9BV,EAAc,OAAO,CACnB,QAASQ,EAAS,QAClB,MAAO,UACP,IAAK,UACL,MAAO,GACP,SAAUG,GAAQ,CAChB,MAAMC,EAAWD,EAAK,SAChBE,EAAQH,EAAM,OACdI,EAAW,EAAID,EACfE,EAAU,GAChBL,EAAM,QAAQ,CAACM,EAAMC,IAAM,CACzB,MAAMC,EAASD,EAAIJ,GAAU,EAAIE,GAC3BI,EAAQL,GAAY,EAAIC,GAC9B,IAAIK,GAAWR,EAAWM,GAASC,EACnCC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAIA,EAAS,CAAC,CAAC,EAC1CtB,EAAK,IAAIkB,EAAM,CAAE,QAAAI,CAAQ,CAAC,CAC5B,CAAC,CACH,CACF,CAAC,EACM,IAAM,CACXX,EAAkB,SAAWA,EAAkB,QAAQ,OAAO,EAC9DT,EAAc,OAAO,EAAE,QAAQqB,GAAKA,EAAE,KAAK,CAAC,CAC9C,CACF,EAAG,CAAC,CAAC,EAGHd,GACEb,EAAC,OAAI,UAAWO,EAAG,uCAAwCK,CAAS,EAClE,SAAAZ,EAACQ,EAAA,CAAQ,IAAKM,EAAU,GAAG,KAAK,KAAM,EAAG,KAAMD,EAAO,EACxD,CAGN,CAAC,EAEDH,EAAM,YAAc,QAEpB,IAAOkB,EAAQnB,EAAWC,CAAK",
-  "names": ["jsx", "React", "useRef", "useGSAP", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "withStyles", "Title", "data", "className", "title", "titleRef", "splitTextInstance", "words", "self", "progress", "total", "interval", "overlap", "word", "i", "start", "width", "opacity", "t", "Title_default"]
+  "sourcesContent": ["'use client'\nimport React, { useRef } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/SplitText'\nimport { ScrollTrigger } from 'gsap/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { TitleProps } from './types.js'\n\ngsap.registerPlugin(SplitText, ScrollTrigger)\nconst Title = React.forwardRef<HTMLDivElement, TitleProps>(({ data, className }) => {\n  const { title, theme } = data\n  const titleRef = useRef<HTMLHeadingElement>(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    if (!titleRef.current) return\n    const height = titleRef.current?.clientHeight || 80\n    splitTextInstance.current = new SplitText(titleRef.current, {\n      type: 'words',\n      wordsClass: 'word',\n    })\n    const words = splitTextInstance.current.words\n    gsap.set(words, { opacity: 0 })\n    ScrollTrigger.create({\n      trigger: titleRef.current,\n      start: 'bottom bottom',\n      end: `bottom bottom+=${height + 20}px`,\n      scrub: true,\n      onUpdate: self => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word, i) => {\n          const start = (i / total) * (1 - overlap)\n          const width = interval * (1 + overlap)\n          let opacity = (progress - start) / width\n          opacity = Math.max(0, Math.min(opacity, 1))\n          gsap.set(word, { opacity })\n        })\n      },\n    })\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach(t => t.kill())\n    }\n  }, [])\n\n  return (\n    title && (\n      <div className={cn('tablet:mb-[32px] mb-[24px] space-y-4', className, { 'aiui-dark': theme === 'dark' })}>\n        <Heading ref={titleRef} as=\"h2\" size={5} html={title} />\n      </div>\n    )\n  )\n})\n\nTitle.displayName = 'Title'\n\nexport default withStyles(Title)\n"],
+  "mappings": "aAqDQ,cAAAA,MAAA,oBApDR,OAAOC,GAAS,UAAAC,MAAc,QAC9B,OAAS,WAAAC,MAAe,cACxB,OAAS,QAAAC,MAAY,OACrB,OAAS,aAAAC,MAAiB,iBAC1B,OAAS,iBAAAC,MAAqB,qBAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,MAAe,4BACxB,OAAS,cAAAC,MAAkB,yBAG3BL,EAAK,eAAeC,EAAWC,CAAa,EAC5C,MAAMI,EAAQT,EAAM,WAAuC,CAAC,CAAE,KAAAU,EAAM,UAAAC,CAAU,IAAM,CAClF,KAAM,CAAE,MAAAC,EAAO,MAAAC,CAAM,EAAIH,EACnBI,EAAWb,EAA2B,IAAI,EAC1Cc,EAAoBd,EAAyB,IAAI,EACvD,OAAAC,EAAQ,IAAM,CACZ,GAAI,CAACY,EAAS,QAAS,OACvB,MAAME,EAASF,EAAS,SAAS,cAAgB,GACjDC,EAAkB,QAAU,IAAIX,EAAUU,EAAS,QAAS,CAC1D,KAAM,QACN,WAAY,MACd,CAAC,EACD,MAAMG,EAAQF,EAAkB,QAAQ,MACxC,OAAAZ,EAAK,IAAIc,EAAO,CAAE,QAAS,CAAE,CAAC,EAC9BZ,EAAc,OAAO,CACnB,QAASS,EAAS,QAClB,MAAO,gBACP,IAAK,kBAAkBE,EAAS,EAAE,KAClC,MAAO,GACP,SAAUE,GAAQ,CAChB,MAAMC,EAAWD,EAAK,SAChBE,EAAQH,EAAM,OACdI,EAAW,EAAID,EACfE,EAAU,GAChBL,EAAM,QAAQ,CAACM,EAAMC,IAAM,CACzB,MAAMC,EAASD,EAAIJ,GAAU,EAAIE,GAC3BI,EAAQL,GAAY,EAAIC,GAC9B,IAAIK,GAAWR,EAAWM,GAASC,EACnCC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAIA,EAAS,CAAC,CAAC,EAC1CxB,EAAK,IAAIoB,EAAM,CAAE,QAAAI,CAAQ,CAAC,CAC5B,CAAC,CACH,CACF,CAAC,EACM,IAAM,CACXZ,EAAkB,SAAWA,EAAkB,QAAQ,OAAO,EAC9DV,EAAc,OAAO,EAAE,QAAQuB,GAAKA,EAAE,KAAK,CAAC,CAC9C,CACF,EAAG,CAAC,CAAC,EAGHhB,GACEb,EAAC,OAAI,UAAWO,EAAG,uCAAwCK,EAAW,CAAE,YAAaE,IAAU,MAAO,CAAC,EACrG,SAAAd,EAACQ,EAAA,CAAQ,IAAKO,EAAU,GAAG,KAAK,KAAM,EAAG,KAAMF,EAAO,EACxD,CAGN,CAAC,EAEDH,EAAM,YAAc,QAEpB,IAAOoB,EAAQrB,EAAWC,CAAK",
+  "names": ["jsx", "React", "useRef", "useGSAP", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "withStyles", "Title", "data", "className", "title", "theme", "titleRef", "splitTextInstance", "height", "words", "self", "progress", "total", "interval", "overlap", "word", "i", "start", "width", "opacity", "t", "Title_default"]
 }

package/dist/esm/biz-components/Title/types.d.ts

@@ -1,3 +1,4 @@
+import type { Theme } from '../../types/props.js';
 export interface Feature {
     /**
      * 特性标题
@@ -14,6 +15,10 @@ export interface TitleProps {
          * 特性列表，最多支持3个
          */
         features?: Feature[];
+        /**
+         * 主题色
+         */
+        theme?: Theme;
     };
     /**
      * 自定义类名

package/dist/esm/biz-components/index.d.ts

@@ -10,6 +10,7 @@ export { default as HeroBanner } from './HeroBanner/index.js';
 export { default as AccordionCards } from './AccordionCards/index.js';
 export { default as Graphic } from './Graphic/index.js';
 export { default as MediaPlayerBase } from './MediaPlayerBase/index.js';
+export { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js';
 export { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js';
 export { default as Marquee } from './Marquee/index.js';
 export { MarqueeList, MarqueeImageContent, MarqueeTextContent, type FastMarqueeProps, type MarqueeListProps, type MarqueeImageContentProps, type MarqueeTextContentProps, } from './Marquee/index.js';

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

@@ -1,2 +1,2 @@
-import{default as r}from"./Shelf/index.js";import{default as o}from"./BrandEquity/index.js";import{default as f}from"./MemberEquity/index.js";import{default as u}from"./Slogan/index.js";import{default as i}from"./Title/index.js";import{default as x}from"./ShelfDisplay/index.js";import{default as c}from"./Evaluate/index.js";import{default as y}from"./Category/index.js";import{default as q}from"./HeroBanner/index.js";import{default as B}from"./AccordionCards/index.js";import{default as G}from"./Graphic/index.js";import{default as C}from"./MediaPlayerBase/index.js";import{default as g}from"./MediaPlayerMulti/index.js";import{default as E}from"./Marquee/index.js";import{MarqueeList as T,MarqueeImageContent as j,MarqueeTextContent as I}from"./Marquee/index.js";import{default as v}from"./MultiLayoutGraphicBlock/index.js";import{default as F}from"./GraphicAttractionBlock/index.js";export{B as AccordionCards,o as BrandEquity,y as Category,c as Evaluate,G as Graphic,F as GraphicAttractionBlock,q as HeroBanner,E as Marquee,j as MarqueeImageContent,T as MarqueeList,I as MarqueeTextContent,C as MediaPlayerBase,g as MediaPlayerMulti,f as MemberEquity,v as MultiLayoutGraphicBlock,r as Shelf,x as ShelfDisplay,u as Slogan,i as Title};
+import{default as r}from"./Shelf/index.js";import{default as o}from"./BrandEquity/index.js";import{default as f}from"./MemberEquity/index.js";import{default as u}from"./Slogan/index.js";import{default as i}from"./Title/index.js";import{default as x}from"./ShelfDisplay/index.js";import{default as c}from"./Evaluate/index.js";import{default as y}from"./Category/index.js";import{default as q}from"./HeroBanner/index.js";import{default as B}from"./AccordionCards/index.js";import{default as k}from"./Graphic/index.js";import{default as C}from"./MediaPlayerBase/index.js";import{default as g}from"./MediaPlayerSticky/index.js";import{default as S}from"./MediaPlayerMulti/index.js";import{default as T}from"./Marquee/index.js";import{MarqueeList as I,MarqueeImageContent as b,MarqueeTextContent as v}from"./Marquee/index.js";import{default as F}from"./MultiLayoutGraphicBlock/index.js";import{default as w}from"./GraphicAttractionBlock/index.js";export{B as AccordionCards,o as BrandEquity,y as Category,c as Evaluate,k as Graphic,w as GraphicAttractionBlock,q as HeroBanner,T as Marquee,b as MarqueeImageContent,I as MarqueeList,v as MarqueeTextContent,C as MediaPlayerBase,S as MediaPlayerMulti,g as MediaPlayerSticky,f as MemberEquity,F as MultiLayoutGraphicBlock,r as Shelf,x as ShelfDisplay,u as Slogan,i as Title};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/biz-components/index.ts"],
-  "sourcesContent": ["export { default as Shelf } from './Shelf/index.js'\nexport { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport {\n  MarqueeList,\n  MarqueeImageContent,\n  MarqueeTextContent,\n  type FastMarqueeProps,\n  type MarqueeListProps,\n  type MarqueeImageContentProps,\n  type MarqueeTextContentProps,\n} from './Marquee/index.js'\nexport { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js'\nexport type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js'\nexport { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js'\nexport type { GraphicAttractionBlockProps } from './GraphicAttractionBlock/index.js'\n"],
-  "mappings": "AAAA,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAA8B,yBACvC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAAyB,oBAClC,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA6B,wBACtC,OAAoB,WAAXA,MAAiC,4BAC1C,OAAoB,WAAXA,MAA0B,qBACnC,OAAoB,WAAXA,MAAkC,6BAC3C,OAAoB,WAAXA,MAAmC,8BAC5C,OAAoB,WAAXA,MAA0B,qBACnC,OACE,eAAAC,EACA,uBAAAC,EACA,sBAAAC,MAKK,qBACP,OAAoB,WAAXH,MAA0C,qCAEnD,OAAoB,WAAXA,MAAyC",
+  "sourcesContent": ["export { default as Shelf } from './Shelf/index.js'\nexport { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport {\n  MarqueeList,\n  MarqueeImageContent,\n  MarqueeTextContent,\n  type FastMarqueeProps,\n  type MarqueeListProps,\n  type MarqueeImageContentProps,\n  type MarqueeTextContentProps,\n} from './Marquee/index.js'\nexport { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js'\nexport type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js'\nexport { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js'\nexport type { GraphicAttractionBlockProps } from './GraphicAttractionBlock/index.js'\n"],
+  "mappings": "AAAA,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAA8B,yBACvC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAAyB,oBAClC,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA6B,wBACtC,OAAoB,WAAXA,MAAiC,4BAC1C,OAAoB,WAAXA,MAA0B,qBACnC,OAAoB,WAAXA,MAAkC,6BAC3C,OAAoB,WAAXA,MAAoC,+BAC7C,OAAoB,WAAXA,MAAmC,8BAC5C,OAAoB,WAAXA,MAA0B,qBACnC,OACE,eAAAC,EACA,uBAAAC,EACA,sBAAAC,MAKK,qBACP,OAAoB,WAAXH,MAA0C,qCAEnD,OAAoB,WAAXA,MAAyC",
   "names": ["default", "MarqueeList", "MarqueeImageContent", "MarqueeTextContent"]
 }

package/dist/esm/components/container.d.ts

@@ -4,12 +4,14 @@ type ContainerProps = {
     children?: React.ReactNode;
     className?: string;
     overflow?: 'hidden';
+    spaceY?: string;
 } & React.ComponentPropsWithoutRef<'div'>;
 declare const Container: React.ForwardRefExoticComponent<{
     asChild?: boolean;
     children?: React.ReactNode;
     className?: string;
     overflow?: "hidden";
+    spaceY?: string;
 } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { Container };
 export type { ContainerProps };

package/dist/esm/components/container.js

@@ -1,2 +1,2 @@
-import{jsx as o}from"react/jsx-runtime";import i from"react";import{cn as e}from"../helpers/utils.js";import{Slot as d}from"@radix-ui/react-slot";const r=i.forwardRef(({...m},p)=>{const{asChild:s,children:t,className:a,overflow:x,...l}=m,n=s?d:"div";return x==="hidden"?o("div",{className:e("overflow-hidden","tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]",a),children:o(n,{className:e("mx-auto box-border w-full max-w-[1772px]","tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-32 px-8"),...l,ref:p,children:t})}):o(n,{...l,ref:p,className:e("mx-auto w-full","tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-8","tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]",a),children:t})});r.displayName="Container";export{r as Container};
+import{jsx as o}from"react/jsx-runtime";import d from"react";import{cn as p}from"../helpers/utils.js";import{Slot as c}from"@radix-ui/react-slot";const s=d.forwardRef(({...m},t)=>{const{asChild:i,children:a,className:l,overflow:x,spaceY:e,...n}=m,r=i?c:"div";return x==="hidden"?o("div",{className:p("overflow-hidden",e||"tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]",l),children:o(r,{className:p("mx-auto box-border w-full max-w-[1772px]","tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-32 px-8"),...n,ref:t,children:a})}):o(r,{...n,ref:t,className:p("mx-auto w-full","tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-8",e||"tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]",l),children:a})});s.displayName="Container";export{s as Container};
 //# sourceMappingURL=container.js.map

package/dist/esm/components/container.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/container.tsx"],
-  "sourcesContent": ["import React from 'react'\nimport { cn } from '../helpers/utils.js'\nimport { Slot } from '@radix-ui/react-slot'\n\ntype ContainerElement = React.ElementRef<'div'>\ntype ContainerProps = {\n  asChild?: boolean\n  children?: React.ReactNode\n  className?: string\n  overflow?: 'hidden'\n} & React.ComponentPropsWithoutRef<'div'>\nconst Container = React.forwardRef<ContainerElement, ContainerProps>(({ ...props }, forwardedRef) => {\n  const { asChild, children, className, overflow, ...containerProps } = props\n  const Comp = asChild ? Slot : 'div'\n\n  if (overflow === 'hidden') {\n    return (\n      <div\n        className={cn(\n          'overflow-hidden',\n          'tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]',\n          className\n        )}\n      >\n        <Comp\n          className={cn(\n            'mx-auto box-border w-full max-w-[1772px]',\n            'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-32 px-8'\n          )}\n          {...containerProps}\n          ref={forwardedRef}\n        >\n          {children}\n        </Comp>\n      </div>\n    )\n  }\n  return (\n    <Comp\n      {...containerProps}\n      ref={forwardedRef}\n      className={cn(\n        'mx-auto w-full',\n        'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-8',\n        'tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]',\n        className\n      )}\n    >\n      {children}\n    </Comp>\n  )\n})\n\nContainer.displayName = 'Container'\n\nexport { Container }\nexport type { ContainerProps }\n"],
-  "mappings": "AAwBQ,cAAAA,MAAA,oBAxBR,OAAOC,MAAW,QAClB,OAAS,MAAAC,MAAU,sBACnB,OAAS,QAAAC,MAAY,uBASrB,MAAMC,EAAYH,EAAM,WAA6C,CAAC,CAAE,GAAGI,CAAM,EAAGC,IAAiB,CACnG,KAAM,CAAE,QAAAC,EAAS,SAAAC,EAAU,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAe,EAAIN,EAChEO,EAAOL,EAAUJ,EAAO,MAE9B,OAAIO,IAAa,SAEbV,EAAC,OACC,UAAWE,EACT,kBACA,uFACAO,CACF,EAEA,SAAAT,EAACY,EAAA,CACC,UAAWV,EACT,2CACA,8DACF,EACC,GAAGS,EACJ,IAAKL,EAEJ,SAAAE,EACH,EACF,EAIFR,EAACY,EAAA,CACE,GAAGD,EACJ,IAAKL,EACL,UAAWJ,EACT,iBACA,8EACA,uFACAO,CACF,EAEC,SAAAD,EACH,CAEJ,CAAC,EAEDJ,EAAU,YAAc",
-  "names": ["jsx", "React", "cn", "Slot", "Container", "props", "forwardedRef", "asChild", "children", "className", "overflow", "containerProps", "Comp"]
+  "sourcesContent": ["import React from 'react'\nimport { cn } from '../helpers/utils.js'\nimport { Slot } from '@radix-ui/react-slot'\n\ntype ContainerElement = React.ElementRef<'div'>\ntype ContainerProps = {\n  asChild?: boolean\n  children?: React.ReactNode\n  className?: string\n  overflow?: 'hidden'\n  spaceY?: string\n} & React.ComponentPropsWithoutRef<'div'>\nconst Container = React.forwardRef<ContainerElement, ContainerProps>(({ ...props }, forwardedRef) => {\n  const { asChild, children, className, overflow, spaceY, ...containerProps } = props\n  const Comp = asChild ? Slot : 'div'\n\n  if (overflow === 'hidden') {\n    return (\n      <div\n        className={cn(\n          'overflow-hidden',\n          spaceY ? spaceY : 'tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]',\n          className\n        )}\n      >\n        <Comp\n          className={cn(\n            'mx-auto box-border w-full max-w-[1772px]',\n            'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-32 px-8'\n          )}\n          {...containerProps}\n          ref={forwardedRef}\n        >\n          {children}\n        </Comp>\n      </div>\n    )\n  }\n  return (\n    <Comp\n      {...containerProps}\n      ref={forwardedRef}\n      className={cn(\n        'mx-auto w-full',\n        'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-8',\n        spaceY ? spaceY : 'tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]',\n        className\n      )}\n    >\n      {children}\n    </Comp>\n  )\n})\n\nContainer.displayName = 'Container'\n\nexport { Container }\nexport type { ContainerProps }\n"],
+  "mappings": "AAyBQ,cAAAA,MAAA,oBAzBR,OAAOC,MAAW,QAClB,OAAS,MAAAC,MAAU,sBACnB,OAAS,QAAAC,MAAY,uBAUrB,MAAMC,EAAYH,EAAM,WAA6C,CAAC,CAAE,GAAGI,CAAM,EAAGC,IAAiB,CACnG,KAAM,CAAE,QAAAC,EAAS,SAAAC,EAAU,UAAAC,EAAW,SAAAC,EAAU,OAAAC,EAAQ,GAAGC,CAAe,EAAIP,EACxEQ,EAAON,EAAUJ,EAAO,MAE9B,OAAIO,IAAa,SAEbV,EAAC,OACC,UAAWE,EACT,kBACAS,GAAkB,uFAClBF,CACF,EAEA,SAAAT,EAACa,EAAA,CACC,UAAWX,EACT,2CACA,8DACF,EACC,GAAGU,EACJ,IAAKN,EAEJ,SAAAE,EACH,EACF,EAIFR,EAACa,EAAA,CACE,GAAGD,EACJ,IAAKN,EACL,UAAWJ,EACT,iBACA,8EACAS,GAAkB,uFAClBF,CACF,EAEC,SAAAD,EACH,CAEJ,CAAC,EAEDJ,EAAU,YAAc",
+  "names": ["jsx", "React", "cn", "Slot", "Container", "props", "forwardedRef", "asChild", "children", "className", "overflow", "spaceY", "containerProps", "Comp"]
 }

package/dist/esm/stories/brandEquity.stories.d.ts

@@ -2,7 +2,7 @@ import type { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
     component: {
-        (props: Omit<import("../biz-components/BrandEquity/BrandEquity.js").BrandEquityProps, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
+        (props: Omit<import("../biz-components/BrandEquity/types.js").BrandEquityProps, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
             className?: string;
             data?: Record<string, any>;
         }): import("react/jsx-runtime").JSX.Element;

package/dist/esm/stories/brandEquity.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/brandEquity.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport BrandEquity from '../biz-components/BrandEquity/BrandEquity.js'\nimport type { BrandEquityItem } from '../biz-components/BrandEquity/BrandEquity.js'\n\nconst meta = {\n  title: 'Biz-Components/BrandEquity',\n  component: BrandEquity,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof BrandEquity>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nconst mockItems = [\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Hassle-Free Warranty',\n    },\n    title: 'Hassle-Free Warranty',\n    description: 'Comprehensive warranty protection on all purchases.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Our Happy Customers',\n    },\n    title: 'Our Happy Customers',\n    description: 'Join millions of satisfied Anker users worldwide.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Anker credits rewards',\n    },\n    title: 'Anker credits rewards',\n    description: 'Buy more, save more, and earn more.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Pay with Ease',\n    },\n    title: 'Pay with Ease',\n    description: 'Pay immediately or in installments with Affirm.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: '30-day money-back guarantee',\n    },\n    title: '30-day money-back guarantee',\n    description: 'Return within 30 days for a full refund.',\n  },\n  {\n    avatarList: [\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/25954496272e3aad27d750494d4748ca_c591cb1a-5f47-42d9-b356-0acd9e87fed0.png?v=1744612103',\n        },\n      },\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ee5edd6de20a7af2f30f2fa976d779c9_6ddc29a7-c287-4afc-909c-383fe1f1a74b.png?v=1744612102',\n        },\n      },\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/b0b7c87fb0819b6cd109bf4b0d865006_e0f7c15a-7d1a-45e7-aee3-783e681a3864.png?v=1744612102',\n        },\n      },\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/85087c9c0ec8c86b481eaea247812c3e.png?v=1744612102',\n        },\n      },\n    ],\n    type: 'avatar',\n    title: 'We are Here to Help',\n    description: 'Contact our expert team via email or live chat for assistance.',\n  },\n] satisfies BrandEquityItem[]\n\nexport const Default: Story = {\n  args: {\n    data: {\n      items: mockItems,\n    },\n    className: 'bg-[#eeeeee] p-4',\n  },\n}\n\nexport const CustomBackground: Story = {\n  args: {\n    data: {\n      items: mockItems,\n    },\n    className: 'bg-gray-900 p-4',\n    itemShape: 'round',\n  },\n}\n"],
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport BrandEquity from '../biz-components/BrandEquity/BrandEquity.js'\nimport type { BrandEquityItem } from '../biz-components/BrandEquity/types.js'\n\nconst meta = {\n  title: 'Biz-Components/BrandEquity',\n  component: BrandEquity,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof BrandEquity>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nconst mockItems = [\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Hassle-Free Warranty',\n    },\n    title: 'Hassle-Free Warranty',\n    description: 'Comprehensive warranty protection on all purchases.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Our Happy Customers',\n    },\n    title: 'Our Happy Customers',\n    description: 'Join millions of satisfied Anker users worldwide.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Anker credits rewards',\n    },\n    title: 'Anker credits rewards',\n    description: 'Buy more, save more, and earn more.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: 'Pay with Ease',\n    },\n    title: 'Pay with Ease',\n    description: 'Pay immediately or in installments with Affirm.',\n  },\n  {\n    icon: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/c3269421a5343c0e59065b53bd81c8f5_ba2fc271-206e-4480-b815-9eb76b45f691.png?v=1744612102',\n      alt: '30-day money-back guarantee',\n    },\n    title: '30-day money-back guarantee',\n    description: 'Return within 30 days for a full refund.',\n  },\n  {\n    avatarList: [\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/25954496272e3aad27d750494d4748ca_c591cb1a-5f47-42d9-b356-0acd9e87fed0.png?v=1744612103',\n        },\n      },\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ee5edd6de20a7af2f30f2fa976d779c9_6ddc29a7-c287-4afc-909c-383fe1f1a74b.png?v=1744612102',\n        },\n      },\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/b0b7c87fb0819b6cd109bf4b0d865006_e0f7c15a-7d1a-45e7-aee3-783e681a3864.png?v=1744612102',\n        },\n      },\n      {\n        avatar: {\n          url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/85087c9c0ec8c86b481eaea247812c3e.png?v=1744612102',\n        },\n      },\n    ],\n    type: 'avatar',\n    title: 'We are Here to Help',\n    description: 'Contact our expert team via email or live chat for assistance.',\n  },\n] satisfies BrandEquityItem[]\n\nexport const Default: Story = {\n  args: {\n    data: {\n      items: mockItems,\n    },\n    className: 'bg-[#eeeeee] p-4',\n  },\n}\n\nexport const CustomBackground: Story = {\n  args: {\n    data: {\n      items: mockItems,\n    },\n    className: 'bg-gray-900 p-4',\n    itemShape: 'round',\n  },\n}\n"],
   "mappings": "AACA,OAAOA,MAAiB,+CAGxB,MAAMC,EAAO,CACX,MAAO,6BACP,UAAWD,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOE,EAAQD,EAGf,MAAME,EAAY,CAChB,CACE,KAAM,CACJ,IAAK,gJACL,IAAK,sBACP,EACA,MAAO,uBACP,YAAa,qDACf,EACA,CACE,KAAM,CACJ,IAAK,gJACL,IAAK,qBACP,EACA,MAAO,sBACP,YAAa,mDACf,EACA,CACE,KAAM,CACJ,IAAK,gJACL,IAAK,uBACP,EACA,MAAO,wBACP,YAAa,qCACf,EACA,CACE,KAAM,CACJ,IAAK,gJACL,IAAK,eACP,EACA,MAAO,gBACP,YAAa,iDACf,EACA,CACE,KAAM,CACJ,IAAK,gJACL,IAAK,6BACP,EACA,MAAO,8BACP,YAAa,0CACf,EACA,CACE,WAAY,CACV,CACE,OAAQ,CACN,IAAK,+IACP,CACF,EACA,CACE,OAAQ,CACN,IAAK,+IACP,CACF,EACA,CACE,OAAQ,CACN,IAAK,+IACP,CACF,EACA,CACE,OAAQ,CACN,IAAK,0GACP,CACF,CACF,EACA,KAAM,SACN,MAAO,sBACP,YAAa,gEACf,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,CACJ,MAAOD,CACT,EACA,UAAW,kBACb,CACF,EAEaE,EAA0B,CACrC,KAAM,CACJ,KAAM,CACJ,MAAOF,CACT,EACA,UAAW,kBACX,UAAW,OACb,CACF",
   "names": ["BrandEquity", "meta", "brandEquity_stories_default", "mockItems", "Default", "CustomBackground"]
 }

package/dist/esm/stories/container.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
         children?: React.ReactNode;
         className?: string;
         overflow?: "hidden";
+        spaceY?: string;
     } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
     parameters: {
         layout: string;

package/dist/esm/stories/graphic.stories.d.ts

@@ -33,6 +33,7 @@ declare const meta: {
     decorators: ((Story: import("@storybook/core/csf").PartialStoryFn<import("@storybook/react").ReactRenderer, {
         ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
         className?: string | undefined;
+        id?: string | undefined;
         key?: string | undefined;
         data: {
             title?: string;

package/dist/esm/types/props.d.ts

@@ -3,6 +3,7 @@ export interface ComponentCommonProps {
     event?: any;
     condition?: any;
     className?: string;
+    id?: string;
     key?: string;
 }
 export type Img = {

package/package.json

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