@anker-in/headless-ui 0.0.27-alpha.121 → 0.0.27-alpha.123

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.tsx"],
-  "sourcesContent": ["import React, { useState, useEffect } from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport type { MultiLayoutGraphicBlockProps, Item } from './types'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport { Carousel, CarouselContent, CarouselItem } from '../../components/carousel.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport Title from '../Title/index.js'\nimport type { Shape } from '../../types/props'\nimport { cn } from '../../helpers/utils.js'\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/tabs.js'\nconst ItemBlock = ({\n  item,\n  shape = 'square',\n  isTab = false,\n}: { item: Item } & { shape?: Shape } & { isTab?: boolean }) => {\n  const [isMobile, setIsMobile] = useState(false)\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1024px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const { theme = 'light', title, description, imageUrl, primaryButton, secondaryButton } = item\n  const lgButtonSize = 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]'\n\n  return (\n    <div\n      className={cn(\n        'item-wrapper group relative box-border w-full overflow-hidden',\n        {\n          'rounded-2xl': shape === 'rounded',\n          'aiui-dark': theme === 'dark',\n          'h-[480px]': isMobile && !isTab,\n          'h-[400px]': isMobile && isTab,\n        },\n        `text-info-primary`\n      )}\n    >\n      <Picture\n        source={imageUrl?.url}\n        className=\"inset-0 h-full overflow-hidden\"\n        imgClassName=\"h-full transition-all duration-300 group-hover:scale-105 object-cover\"\n        style={{ aspectRatio: `${imageUrl?.width}/${imageUrl?.height}` }}\n      />\n      <div className=\"laptop:p-6 desktop:p-[32px] absolute inset-x-0 bottom-0 flex flex-col gap-6 p-3\">\n        <div>\n          <Heading size={3} className=\"item-title\" html={title} />\n          <Text size={3} className=\"item-description desktop:mt-1 text-text-2 desktop:text-text-4\" html={description} />\n        </div>\n        <div className=\"flex gap-[16px]\">\n          {secondaryButton && secondaryButton.text && (\n            <a href={secondaryButton.link}>\n              <Button className={lgButtonSize} variant=\"secondary\">\n                {secondaryButton.text}\n              </Button>\n            </a>\n          )}\n          {primaryButton && primaryButton.text && (\n            <a href={primaryButton.link}>\n              <Button className={lgButtonSize} variant=\"primary\">\n                {primaryButton.text}\n              </Button>\n            </a>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst MultiLayoutGraphicBlock = React.forwardRef<HTMLDivElement, MultiLayoutGraphicBlockProps>((props, ref) => {\n  const { shape, sectionTitle, groupByTab = false, items = [], carousel } = props.data\n  const getSpan = (width: 'full' | 'half' | 'one-third') => {\n    switch (width) {\n      case 'full':\n        return 12\n      case 'half':\n        return 6\n      case 'one-third':\n        return 4\n    }\n  }\n\n  const tabNames = items\n    .map(item => item.tabName)\n    .filter(Boolean)\n    .filter((item, index, arr) => arr.indexOf(item) === index) as string[]\n\n  const tabItemsMaps = tabNames\n    .map(tabName => ({\n      tabName,\n      items: items.filter(item => item.tabName === tabName),\n    }))\n    .reduce(\n      (acc, cur) => {\n        acc[cur.tabName] = cur.items\n        return acc\n      },\n      {} as Record<string, (Item & { width?: 'full' | 'half' | 'one-third' })[]>\n    )\n\n  return (\n    <section data-ui-component-id=\"MultiLayoutGraphicBlock\" ref={ref} className=\"text-info-primary\">\n      {sectionTitle && <Title data={{ title: sectionTitle }} className=\"section-title\" />}\n\n      {groupByTab ? (\n        <Tabs shape={shape} align=\"left\" defaultValue={tabNames[0]!}>\n          <TabsList>\n            {tabNames.map((tabName, index) => (\n              <TabsTrigger key={index} value={tabName!}>\n                {tabName}\n              </TabsTrigger>\n            ))}\n          </TabsList>\n          {tabNames.map((tabName, index) => (\n            <TabsContent key={index} value={tabName!} className=\"desktop:mt-[36px] mt-[24px] w-full\">\n              <>\n                <Grid className=\"w-full\">\n                  {tabItemsMaps[tabName].map((item, index) => (\n                    <GridItem\n                      key={`${item?.title || ''}${index}`}\n                      span={getSpan(item.width ?? 'full')}\n                      className=\"laptop:block hidden\"\n                    >\n                      <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n                    </GridItem>\n                  ))}\n                  {\n                    <GridItem className=\"laptop:hidden block\" span={12}>\n                      <Carousel className=\"\">\n                        <CarouselContent className=\"flex\">\n                          {tabItemsMaps[tabName].map((item, index) => (\n                            <CarouselItem\n                              key={`${item?.title || ''}${index}`}\n                              className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\"\n                            >\n                              <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n                            </CarouselItem>\n                          ))}\n                        </CarouselContent>\n                      </Carousel>\n                    </GridItem>\n                  }\n                </Grid>\n                {carousel && carousel?.items.length > 0 ? (\n                  <Carousel className=\"laptop:mt-4 mt-3\">\n                    <CarouselContent className=\"flex\">\n                      {carousel.items.map((item, index) => (\n                        <CarouselItem key={index} className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\">\n                          <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n                        </CarouselItem>\n                      ))}\n                    </CarouselContent>\n                  </Carousel>\n                ) : null}\n              </>\n            </TabsContent>\n          ))}\n        </Tabs>\n      ) : (\n        <>\n          <Grid className=\"w-full\">\n            {items.map((item, index) => (\n              <GridItem\n                key={`${item?.title || ''}${index}`}\n                span={getSpan(item.width ?? 'full')}\n                className=\"laptop:block hidden\"\n              >\n                <ItemBlock item={item} shape={shape} />\n              </GridItem>\n            ))}\n            {items.map((item, index) => (\n              <GridItem key={`${item?.title || ''}${index}`} span={getSpan('full')} className=\"laptop:hidden block\">\n                <ItemBlock item={item} shape={shape} />\n              </GridItem>\n            ))}\n          </Grid>\n          {carousel && carousel?.items.length > 0 ? (\n            <Carousel className=\"laptop:mt-4 mt-3\">\n              <CarouselContent className=\"flex\">\n                {carousel.items.map((item, index) => (\n                  <CarouselItem\n                    key={`${item?.title || ''}${index}`}\n                    className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\"\n                  >\n                    <ItemBlock item={item} shape={shape} />\n                  </CarouselItem>\n                ))}\n              </CarouselContent>\n            </Carousel>\n          ) : null}\n        </>\n      )}\n    </section>\n  )\n})\n\nexport default withStyles(MultiLayoutGraphicBlock)\nexport type { MultiLayoutGraphicBlockProps }\n"],
-  "mappings": "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",
-  "names": ["MultiLayoutGraphicBlock_exports", "__export", "MultiLayoutGraphicBlock_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_react_responsive", "import_Styles", "import_picture", "import_button", "import_heading", "import_text", "import_carousel", "import_gird", "import_Title", "import_utils", "import_tabs", "ItemBlock", "item", "shape", "isTab", "isMobile", "setIsMobile", "mediaQuery", "theme", "title", "description", "imageUrl", "primaryButton", "secondaryButton", "lgButtonSize", "Picture", "Button", "MultiLayoutGraphicBlock", "React", "props", "ref", "sectionTitle", "groupByTab", "items", "carousel", "getSpan", "width", "tabNames", "index", "arr", "tabItemsMaps", "tabName", "acc", "cur", "Title"]
+  "sourcesContent": ["import React, { useState, useEffect } from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport type { MultiLayoutGraphicBlockProps, Item } from './types'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/tabs.js'\n\nconst ItemBlock = ({ data: item, configuration }: { data: Item } & { configuration?: any }) => {\n  const [isMobile, setIsMobile] = useState(false)\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1024px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const { theme = 'light', title, description, imageUrl, primaryButton, secondaryButton } = item\n  const lgButtonSize = 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]'\n\n  return (\n    <div\n      className={cn(\n        'item-wrapper text-info-primary group relative box-border w-full overflow-hidden',\n        'laptop:aspect-[288/384] desktop:aspect-[426/512] lg-desktop:aspect-[544/640]',\n        {\n          'rounded-2xl': configuration?.shape === 'rounded',\n          'aiui-dark': theme === 'dark',\n          'h-[480px]': isMobile && !configuration?.isTab,\n          'h-[400px]': isMobile && configuration?.isTab,\n        }\n      )}\n    >\n      <Picture\n        source={imageUrl?.url}\n        className=\"inset-0 h-full overflow-hidden\"\n        imgClassName=\"h-full transition-all duration-300 group-hover:scale-105 object-cover\"\n        style={{ aspectRatio: `${imageUrl?.width}/${imageUrl?.height}` }}\n      />\n      <div className=\"laptop:p-6 desktop:p-[32px] absolute inset-x-0 bottom-0 flex flex-col gap-6 p-3\">\n        <div>\n          <Heading size={3} className=\"item-title\" html={title} />\n          <Text size={3} className=\"item-description desktop:mt-1 text-text-2 desktop:text-text-4\" html={description} />\n        </div>\n        <div className=\"flex gap-[16px]\">\n          {secondaryButton && secondaryButton.text && (\n            <a href={secondaryButton.link}>\n              <Button className={lgButtonSize} variant=\"secondary\">\n                {secondaryButton.text}\n              </Button>\n            </a>\n          )}\n          {primaryButton && primaryButton.text && (\n            <a href={primaryButton.link}>\n              <Button className={lgButtonSize} variant=\"primary\">\n                {primaryButton.text}\n              </Button>\n            </a>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst MultiLayoutGraphicBlock = React.forwardRef<HTMLDivElement, MultiLayoutGraphicBlockProps>((props, ref) => {\n  const { shape, sectionTitle, groupByTab = false, items = [], carousel } = props.data\n  const getSpan = (width: 'full' | 'half' | 'one-third') => {\n    switch (width) {\n      case 'full':\n        return 12\n      case 'half':\n        return 6\n      case 'one-third':\n        return 4\n    }\n  }\n\n  const tabNames = items\n    .map(item => item.tabName)\n    .filter(Boolean)\n    .filter((item, index, arr) => arr.indexOf(item) === index) as string[]\n\n  const tabItemsMaps = tabNames\n    .map(tabName => ({\n      tabName,\n      items: items.filter(item => item.tabName === tabName),\n    }))\n    .reduce(\n      (acc, cur) => {\n        acc[cur.tabName] = cur.items\n        return acc\n      },\n      {} as Record<string, (Item & { width?: 'full' | 'half' | 'one-third' })[]>\n    )\n\n  return (\n    <section data-ui-component-id=\"MultiLayoutGraphicBlock\" ref={ref} className=\"text-info-primary\">\n      {sectionTitle && <Title data={{ title: sectionTitle }} className=\"section-title\" />}\n\n      {groupByTab ? (\n        <Tabs shape={shape} align=\"left\" defaultValue={tabNames[0]!}>\n          <TabsList>\n            {tabNames.map((tabName, index) => (\n              <TabsTrigger key={index} value={tabName!}>\n                {tabName}\n              </TabsTrigger>\n            ))}\n          </TabsList>\n          {tabNames.map((tabName, index) => (\n            <TabsContent key={index} value={tabName!} className=\"desktop:mt-[36px] mt-[24px] w-full\">\n              <>\n                <SwiperBox\n                  className=\"!overflow-visible\"\n                  id={'MultiLayoutGraphicBlock1'}\n                  data={{ list: tabItemsMaps?.[tabName] || [], configuration: { shape: shape, isTab: groupByTab } }}\n                  Slide={ItemBlock}\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                    1024: {\n                      spaceBetween: 16,\n                      freeMode: false,\n                      slidesPerView: 3,\n                    },\n                  }}\n                />\n                {carousel && carousel?.items.length > 0 ? (\n                  <SwiperBox\n                    className=\"!overflow-visible\"\n                    id={'MultiLayoutGraphicBlock2'}\n                    data={{ list: carousel?.items || [], configuration: { shape: shape, isTab: groupByTab } }}\n                    Slide={ItemBlock}\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                      1024: {\n                        spaceBetween: 16,\n                        freeMode: false,\n                        slidesPerView: 3.1,\n                      },\n                      1440: {\n                        spaceBetween: 16,\n                        freeMode: false,\n                        slidesPerView: 4,\n                      },\n                    }}\n                  />\n                ) : null}\n              </>\n            </TabsContent>\n          ))}\n        </Tabs>\n      ) : (\n        <>\n          <Grid className=\"w-full\">\n            {items.map((item, index) => (\n              <GridItem\n                key={`${item?.title || ''}${index}`}\n                span={getSpan(item.width ?? 'full')}\n                className=\"laptop:block hidden\"\n              >\n                <ItemBlock data={item} configuration={{ shape: shape }} />\n              </GridItem>\n            ))}\n            {items.map((item, index) => (\n              <GridItem key={`${item?.title || ''}${index}`} span={getSpan('full')} className=\"laptop:hidden block\">\n                <ItemBlock data={item} configuration={{ shape: shape }} />\n              </GridItem>\n            ))}\n          </Grid>\n          {carousel && carousel?.items.length > 0 ? (\n            // <Carousel className=\"laptop:mt-4 mt-3\">\n            //   <CarouselContent className=\"flex\">\n            //     {carousel.items.map((item, index) => (\n            //       <CarouselItem\n            //         key={`${item?.title || ''}${index}`}\n            //         className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\"\n            //       >\n            //         <ItemBlock item={item} shape={shape} />\n            //       </CarouselItem>\n            //     ))}\n            //   </CarouselContent>\n            // </Carousel>\n            <SwiperBox\n              className=\"!overflow-visible\"\n              id={'MultiLayoutGraphicBlock3'}\n              data={{ list: carousel?.items || [], configuration: { shape: shape } }}\n              Slide={ItemBlock}\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                1024: {\n                  spaceBetween: 16,\n                  freeMode: false,\n                  slidesPerView: 3.1,\n                },\n                1440: {\n                  spaceBetween: 16,\n                  freeMode: false,\n                  slidesPerView: 4,\n                },\n              }}\n            />\n          ) : null}\n        </>\n      )}\n    </section>\n  )\n})\n\nexport default withStyles(MultiLayoutGraphicBlock)\nexport type { MultiLayoutGraphicBlockProps }\n"],
+  "mappings": "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",
+  "names": ["MultiLayoutGraphicBlock_exports", "__export", "MultiLayoutGraphicBlock_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_react_responsive", "import_Styles", "import_picture", "import_button", "import_heading", "import_text", "import_gird", "import_Title", "import_utils", "import_SwiperBox", "import_tabs", "ItemBlock", "item", "configuration", "isMobile", "setIsMobile", "mediaQuery", "theme", "title", "description", "imageUrl", "primaryButton", "secondaryButton", "lgButtonSize", "Picture", "Button", "MultiLayoutGraphicBlock", "React", "props", "ref", "shape", "sectionTitle", "groupByTab", "items", "carousel", "getSpan", "width", "tabNames", "index", "arr", "tabItemsMaps", "tabName", "acc", "cur", "Title", "SwiperBox"]
 }

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

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

package/dist/cjs/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/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\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 featuresRef = useRef<HTMLDivElement>(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    gsap.registerPlugin(ScrollTrigger, SplitText)\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-=6%',\n      end: `bottom+=${height * 2 + 80}px bottom-=6%`,\n      scrub: true,\n      onUpdate: (self: any) => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word: any, i: number) => {\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\n    if (features && features.length > 0) {\n      ScrollTrigger.create({\n        trigger: featuresRef.current,\n        start: `bottom+=${height * 2}px bottom-=6%`,\n        end: `bottom+=${height * 2 + 100}px bottom-=6%`,\n        onUpdate: (self: any) => {\n          gsap.set(featuresRef.current, { opacity: self.progress })\n        },\n      })\n    }\n\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach((t: any) => t.kill())\n    }\n  }, [])\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'slogan-container 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        html={title}\n      />\n      {features && features.length > 0 && (\n        <div className={cn('relative w-full max-w-[500px] overflow-hidden', `tablet:h-[${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={cn(\n                  'flex w-full flex-row items-stretch gap-3 overflow-hidden',\n                  `tablet:h-[${groupHeight}px]`\n                )}\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-[#E4E5E6]\" />}\n                    <Text\n                      size={3}\n                      align=\"left\"\n                      as=\"p\"\n                      className=\"slogan-feature-text tablet:text-[13px] laptop:text-[14px] line-clamp-3 text-[12px] leading-[1.4]\"\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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",
+  "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\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 featuresRef = useRef<HTMLDivElement>(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    gsap.registerPlugin(ScrollTrigger, SplitText)\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-=6%',\n      end: `bottom+=${height * 2 + 80}px bottom-=6%`,\n      scrub: true,\n      onUpdate: (self: any) => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word: any, i: number) => {\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\n    if (features && features.length > 0) {\n      ScrollTrigger.create({\n        trigger: featuresRef.current,\n        start: `bottom+=${height * 2}px bottom-=6%`,\n        end: `bottom+=${height * 2 + 100}px bottom-=6%`,\n        onUpdate: (self: any) => {\n          gsap.set(featuresRef.current, { opacity: self.progress })\n        },\n      })\n    }\n\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach((t: any) => t.kill())\n    }\n  }, [])\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'slogan-container laptop:flex-row laptop:items-end laptop:justify-between text-info-primary 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        html={title}\n      />\n      {features && features.length > 0 && (\n        <div className={cn('relative w-full max-w-[500px] overflow-hidden', `tablet:h-[${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={cn(\n                  'flex w-full flex-row items-stretch gap-3 overflow-hidden',\n                  `tablet:h-[${groupHeight}px]`\n                )}\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-[#E4E5E6]\" />}\n                    <Text\n                      size={3}\n                      align=\"left\"\n                      as=\"p\"\n                      className=\"slogan-feature-text tablet:text-[13px] laptop:text-[14px] line-clamp-3 text-[12px] leading-[1.4]\"\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": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAiHM,IAAAI,EAAA,6BAhHNC,EAA8B,oBAC9BA,EAAwB,uBACxBC,EAAqB,gBACrBC,EAA0B,+BAC1BC,EAA8B,mCAC9BC,EAAmB,kCACnBC,EAA8B,qCAC9BC,EAA2B,kCAG3B,SAASC,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,EAAS,EAAAC,QAAM,WAAwC,CAAC,CAAE,KAAAC,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,EAAI,EAAAT,QAAM,SAAS,CAAC,EAC9C,CAACU,EAAiBC,CAAkB,EAAI,EAAAX,QAAM,SAAS,EAAI,EAC3DY,EAAiBlB,EAAWW,EAAUC,CAAgB,EACtDO,EAAcD,EAAe,OAC7BE,EAAeT,EAAS,OAASC,EACjCS,EAAgBD,EAAe,CAAC,GAAGF,EAAgBA,EAAe,CAAC,CAAC,EAAIA,EACxEI,EAAc,GAGpB,EAAAhB,QAAM,UAAU,IAAM,CACpB,GAAI,CAACc,EAAc,OACnB,MAAMG,EAAQ,YAAY,IAAM,CAC9BR,EAAc,GAAK,EAAI,CAAC,EACxBE,EAAmB,EAAI,CACzB,EAAG,GAAI,EACP,MAAO,IAAM,cAAcM,CAAK,CAClC,EAAG,CAACJ,EAAaC,CAAY,CAAC,EAG9B,EAAAd,QAAM,UAAU,IAAM,CACpB,GAAKc,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,KAAW,UAA2B,IAAI,EAC1CC,KAAc,UAAuB,IAAI,EACzCC,KAAoB,UAAyB,IAAI,EACvD,oBAAQ,IAAM,CAEZ,GADA,OAAK,eAAe,gBAAe,WAAS,EACxC,CAACF,EAAS,QAAS,OACvBE,EAAkB,QAAU,IAAI,YAAUF,EAAS,QAAS,CAC1D,KAAM,QACN,WAAY,MACd,CAAC,EACD,MAAMG,EAASH,EAAS,SAAS,cAAgB,IAE3CI,EAAQF,EAAkB,QAAQ,MACxC,cAAK,IAAIE,EAAO,CAAE,QAAS,CAAE,CAAC,EAC9B,gBAAc,OAAO,CACnB,QAASJ,EAAS,QAClB,MAAO,oBACP,IAAK,WAAWG,EAAS,EAAI,EAAE,gBAC/B,MAAO,GACP,SAAWE,GAAc,CACvB,MAAMC,EAAWD,EAAK,SAChBE,EAAQH,EAAM,OACdI,EAAW,EAAID,EACfE,EAAU,GAChBL,EAAM,QAAQ,CAACM,EAAW/B,IAAc,CACtC,MAAMgC,EAAShC,EAAI4B,GAAU,EAAIE,GAC3BG,EAAQJ,GAAY,EAAIC,GAC9B,IAAII,GAAWP,EAAWK,GAASC,EACnCC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAIA,EAAS,CAAC,CAAC,EAC1C,OAAK,IAAIH,EAAM,CAAE,QAAAG,CAAQ,CAAC,CAC5B,CAAC,CACH,CACF,CAAC,EAEG3B,GAAYA,EAAS,OAAS,GAChC,gBAAc,OAAO,CACnB,QAASe,EAAY,QACrB,MAAO,WAAWE,EAAS,CAAC,gBAC5B,IAAK,WAAWA,EAAS,EAAI,GAAG,gBAChC,SAAWE,GAAc,CACvB,OAAK,IAAIJ,EAAY,QAAS,CAAE,QAASI,EAAK,QAAS,CAAC,CAC1D,CACF,CAAC,EAGI,IAAM,CACXH,EAAkB,SAAWA,EAAkB,QAAQ,OAAO,EAC9D,gBAAc,OAAO,EAAE,QAASY,GAAWA,EAAE,KAAK,CAAC,CACrD,CACF,EAAG,CAAC,CAAC,KAGH,QAAC,OACC,IAAK9B,EACL,aAAW,MACT,2KACAD,CACF,EAEA,oBAAC,WACC,IAAKiB,EACL,GAAG,KACH,KAAM,EACN,OAAQ,OACR,MAAO,OACP,aAAW,MACT,sGACF,EACA,KAAMf,EACR,EACCC,GAAYA,EAAS,OAAS,MAC7B,OAAC,OAAI,aAAW,MAAG,gDAAiD,aAAaW,CAAW,KAAK,EAC/F,mBAAC,OACC,aAAW,MAAG,CACZ,gBACAN,EAAkB,mEAAqE,kBACzF,CAAC,EACD,MAAO,CACL,UAAW,eAAeF,EAAaQ,CAAW,KACpD,EAEC,SAAAD,EAAc,IAAI,CAACmB,EAAOC,OACzB,OAAC,OACC,aAAW,MACT,2DACA,aAAanB,CAAW,KAC1B,EAGC,SAAAkB,EAAM,IAAI,CAACE,EAASC,OACnB,QAAC,EAAArC,QAAM,SAAN,CACE,UAAAqC,EAAQ,MAAK,OAAC,OAAI,UAAU,wDAAwD,KACrF,OAAC,QACC,KAAM,EACN,MAAM,OACN,GAAG,IACH,UAAU,mGACV,KAAMD,EAAQ,MAChB,IARmBC,CASrB,CACD,GAbIF,CAcP,CACD,EACH,EACF,GAEJ,CAEJ,CAAC,EAEDpC,EAAO,YAAc,SAErB,IAAOf,KAAQ,cAAWe,CAAM",
   "names": ["Slogan_exports", "__export", "Slogan_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_SplitText", "import_ScrollTrigger", "import_utils", "import_components", "import_Styles", "chunkArray", "array", "size", "result", "i", "Slogan", "React", "data", "className", "ref", "title", "features", "featureChunkSize", "theme", "groupIndex", "setGroupIndex", "isTransitioning", "setIsTransitioning", "featuresGroups", "totalGroups", "needCarousel", "displayGroups", "groupHeight", "timer", "handle", "titleRef", "featuresRef", "splitTextInstance", "height", "words", "self", "progress", "total", "interval", "overlap", "word", "start", "width", "opacity", "t", "group", "idx", "feature", "index"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var l=Object.create;var o=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty;var u=(e,p)=>{for(var t in p)o(e,t,{get:p[t],enumerable:!0})},s=(e,p,t,a)=>{if(p&&typeof p=="object"||typeof p=="function")for(let r of n(p))!S.call(e,r)&&r!==t&&o(e,r,{get:()=>p[r],enumerable:!(a=h(p,r))||a.enumerable});return e};var y=(e,p,t)=>(t=e!=null?l(x(e)):{},s(p||!e||!e.__esModule?o(t,"default",{value:e,enumerable:!0}):t,e)),v=e=>s(o({},"__esModule",{value:!0}),e);var w={};u(w,{default:()=>k});module.exports=v(w);var m=require("react/jsx-runtime"),d=y(require("react")),f=require("../../helpers/utils.js"),i=require("../../shared/Styles.js");const c=d.default.forwardRef(({className:e,data:p})=>{const{space:t="default"}=p;return(0,m.jsx)("div",{className:(0,f.cn)(t==="default"&&"desktop:h-[96px] lg-desktop:h-[128px] h-[64px] ",t==="fixed"&&"h-[64px] ",e)})});c.displayName="Spacer";var k=(0,i.withStyles)(c);
+"use strict";"use client";var d=Object.create;var o=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var y=(e,t)=>{for(var p in t)o(e,p,{get:t[p],enumerable:!0})},s=(e,t,p,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of n(t))!u.call(e,r)&&r!==p&&o(e,r,{get:()=>t[r],enumerable:!(a=h(t,r))||a.enumerable});return e};var v=(e,t,p)=>(p=e!=null?d(S(e)):{},s(t||!e||!e.__esModule?o(p,"default",{value:e,enumerable:!0}):p,e)),w=e=>s(o({},"__esModule",{value:!0}),e);var N={};y(N,{default:()=>x});module.exports=w(N);var m=require("react/jsx-runtime"),c=v(require("react")),f=require("../../helpers/utils.js"),i=require("../../shared/Styles.js");const l=c.default.forwardRef(({className:e,data:t})=>{const{space:p="default"}=t;return(0,m.jsx)("div",{className:(0,f.cn)(p==="default"&&"laptop:h-16 lg-desktop:h-[128px] tablet:h-8 h-16",p==="fixed"&&"h-16",e)})});l.displayName="Spacer";var x=(0,i.withStyles)(l);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Spacer/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SpacerProps } from './types.js'\n\nconst Spacer = React.forwardRef<HTMLDivElement, SpacerProps>(({ className, data }) => {\n  const { space = 'default' } = data\n  return (\n    <div\n      className={cn(\n        space === 'default' && 'desktop:h-[96px] lg-desktop:h-[128px] h-[64px] ',\n        space === 'fixed' && 'h-[64px] ',\n        className\n      )}\n    ></div>\n  )\n})\n\nSpacer.displayName = 'Spacer'\n\nexport default withStyles(Spacer)\n"],
-  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GASI,IAAAI,EAAA,6BARJC,EAAkB,oBAClBC,EAAmB,kCACnBC,EAA2B,kCAG3B,MAAMC,EAAS,EAAAC,QAAM,WAAwC,CAAC,CAAE,UAAAC,EAAW,KAAAC,CAAK,IAAM,CACpF,KAAM,CAAE,MAAAC,EAAQ,SAAU,EAAID,EAC9B,SACE,OAAC,OACC,aAAW,MACTC,IAAU,WAAa,kDACvBA,IAAU,SAAW,YACrBF,CACF,EACD,CAEL,CAAC,EAEDF,EAAO,YAAc,SAErB,IAAON,KAAQ,cAAWM,CAAM",
+  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SpacerProps } from './types.js'\n\nconst Spacer = React.forwardRef<HTMLDivElement, SpacerProps>(({ className, data }) => {\n  const { space = 'default' } = data\n  return (\n    <div\n      className={cn(\n        space === 'default' && 'laptop:h-16 lg-desktop:h-[128px] tablet:h-8 h-16',\n        space === 'fixed' && 'h-16',\n        className\n      )}\n    ></div>\n  )\n})\n\nSpacer.displayName = 'Spacer'\n\nexport default withStyles(Spacer)\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GASI,IAAAI,EAAA,6BARJC,EAAkB,oBAClBC,EAAmB,kCACnBC,EAA2B,kCAG3B,MAAMC,EAAS,EAAAC,QAAM,WAAwC,CAAC,CAAE,UAAAC,EAAW,KAAAC,CAAK,IAAM,CACpF,KAAM,CAAE,MAAAC,EAAQ,SAAU,EAAID,EAC9B,SACE,OAAC,OACC,aAAW,MACTC,IAAU,WAAa,mDACvBA,IAAU,SAAW,OACrBF,CACF,EACD,CAEL,CAAC,EAEDF,EAAO,YAAc,SAErB,IAAON,KAAQ,cAAWM,CAAM",
   "names": ["Spacer_exports", "__export", "Spacer_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_Styles", "Spacer", "React", "className", "data", "space"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var A=Object.create;var l=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var D=(t,r)=>{for(var e in r)l(t,e,{get:r[e],enumerable:!0})},y=(t,r,e,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of N(r))!C.call(t,o)&&o!==e&&l(t,o,{get:()=>r[o],enumerable:!(s=L(r,o))||s.enumerable});return t};var G=(t,r,e)=>(e=t!=null?A(z(t)):{},y(r||!t||!t.__esModule?l(e,"default",{value:t,enumerable:!0}):e,t)),I=t=>y(l({},"__esModule",{value:!0}),t);var $={};D($,{default:()=>U});module.exports=I($);var d=require("react/jsx-runtime"),n=G(require("react")),b=require("@gsap/react"),a=require("gsap"),f=require("gsap/dist/SplitText"),c=require("gsap/dist/ScrollTrigger"),w=require("../../helpers/utils.js"),x=require("../../components/index.js"),v=require("../../shared/Styles.js");const T=n.default.forwardRef(({data:t,className:r})=>{const{title:e,theme:s}=t,o=(0,n.useRef)(null),i=(0,n.useRef)(null);return(0,b.useGSAP)(()=>{if(a.gsap.registerPlugin(f.SplitText,c.ScrollTrigger),!o.current)return;const H=o.current?.clientHeight||80;i.current=new f.SplitText(o.current,{type:"words",wordsClass:"word"});const m=i.current.words;return a.gsap.set(m,{opacity:0}),c.ScrollTrigger.create({trigger:o.current,start:"bottom bottom-=6%",end:`bottom+=${H*2+40}px bottom-=6%`,scrub:!0,onUpdate:p=>{const S=p.progress,g=m.length,k=1/g,h=.5;m.forEach((E,M)=>{const P=M/g*(1-h),R=k*(1+h);let u=(S-P)/R;u=Math.max(0,Math.min(u,1)),a.gsap.set(E,{opacity:u})})}}),()=>{i.current&&i.current.revert(),c.ScrollTrigger.getAll().forEach(p=>p.kill())}},[]),e&&(0,d.jsx)("div",{className:(0,w.cn)("tablet:mb-[32px] mb-[24px] space-y-4",r,{"aiui-dark":s==="dark"}),children:(0,d.jsx)(x.Heading,{ref:o,as:"h1",size:5,html:e})})});T.displayName="Title";var U=(0,v.withStyles)(T);
+"use strict";"use client";var A=Object.create;var l=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var D=(t,r)=>{for(var e in r)l(t,e,{get:r[e],enumerable:!0})},y=(t,r,e,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of N(r))!C.call(t,o)&&o!==e&&l(t,o,{get:()=>r[o],enumerable:!(s=L(r,o))||s.enumerable});return t};var G=(t,r,e)=>(e=t!=null?A(z(t)):{},y(r||!t||!t.__esModule?l(e,"default",{value:t,enumerable:!0}):e,t)),I=t=>y(l({},"__esModule",{value:!0}),t);var $={};D($,{default:()=>U});module.exports=I($);var d=require("react/jsx-runtime"),n=G(require("react")),b=require("@gsap/react"),a=require("gsap"),f=require("gsap/dist/SplitText"),c=require("gsap/dist/ScrollTrigger"),w=require("../../helpers/utils.js"),x=require("../../components/index.js"),v=require("../../shared/Styles.js");const T=n.default.forwardRef(({data:t,className:r})=>{const{title:e,theme:s}=t,o=(0,n.useRef)(null),i=(0,n.useRef)(null);return(0,b.useGSAP)(()=>{if(a.gsap.registerPlugin(f.SplitText,c.ScrollTrigger),!o.current)return;const H=o.current?.clientHeight||80;i.current=new f.SplitText(o.current,{type:"words",wordsClass:"word"});const m=i.current.words;return a.gsap.set(m,{opacity:0}),c.ScrollTrigger.create({trigger:o.current,start:"bottom bottom-=6%",end:`bottom+=${H*2+40}px bottom-=6%`,scrub:!0,onUpdate:p=>{const S=p.progress,g=m.length,k=1/g,h=.5;m.forEach((E,M)=>{const P=M/g*(1-h),R=k*(1+h);let u=(S-P)/R;u=Math.max(0,Math.min(u,1)),a.gsap.set(E,{opacity:u})})}}),()=>{i.current&&i.current.revert(),c.ScrollTrigger.getAll().forEach(p=>p.kill())}},[]),e&&(0,d.jsx)("div",{className:(0,w.cn)("tablet:mb-[32px] mb-[24px] space-y-4",r,{"aiui-dark":s==="dark"}),children:(0,d.jsx)(x.Heading,{ref:o,as:"h1",size:4,html:e})})});T.displayName="Title";var U=(0,v.withStyles)(T);
 //# sourceMappingURL=index.js.map

package/dist/cjs/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/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/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\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    gsap.registerPlugin(SplitText, ScrollTrigger)\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-=6%',\n      end: `bottom+=${height * 2 + 40}px bottom-=6%`,\n      scrub: true,\n      onUpdate: (self: any) => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word: any, i: number) => {\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: { kill: () => any }) => 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=\"h1\" size={5} html={title} />\n      </div>\n    )\n  )\n})\n\nTitle.displayName = 'Title'\n\nexport default withStyles(Title)\n"],
+  "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 } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { TitleProps } from './types.js'\n\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    gsap.registerPlugin(SplitText, ScrollTrigger)\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-=6%',\n      end: `bottom+=${height * 2 + 40}px bottom-=6%`,\n      scrub: true,\n      onUpdate: (self: any) => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word: any, i: number) => {\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: { kill: () => any }) => 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=\"h1\" size={4} html={title} />\n      </div>\n    )\n  )\n})\n\nTitle.displayName = 'Title'\n\nexport default withStyles(Title)\n"],
   "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqDQ,IAAAI,EAAA,6BApDRC,EAA8B,oBAC9BA,EAAwB,uBACxBC,EAAqB,gBACrBC,EAA0B,+BAC1BC,EAA8B,mCAC9BC,EAAmB,kCACnBC,EAAwB,qCACxBC,EAA2B,kCAG3B,MAAMC,EAAQ,EAAAC,QAAM,WAAuC,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,IAAM,CAClF,KAAM,CAAE,MAAAC,EAAO,MAAAC,CAAM,EAAIH,EACnBI,KAAW,UAA2B,IAAI,EAC1CC,KAAoB,UAAyB,IAAI,EACvD,oBAAQ,IAAM,CAEZ,GADA,OAAK,eAAe,YAAW,eAAa,EACxC,CAACD,EAAS,QAAS,OACvB,MAAME,EAASF,EAAS,SAAS,cAAgB,GACjDC,EAAkB,QAAU,IAAI,YAAUD,EAAS,QAAS,CAC1D,KAAM,QACN,WAAY,MACd,CAAC,EACD,MAAMG,EAAQF,EAAkB,QAAQ,MACxC,cAAK,IAAIE,EAAO,CAAE,QAAS,CAAE,CAAC,EAC9B,gBAAc,OAAO,CACnB,QAASH,EAAS,QAClB,MAAO,oBACP,IAAK,WAAWE,EAAS,EAAI,EAAE,gBAC/B,MAAO,GACP,SAAWE,GAAc,CACvB,MAAMC,EAAWD,EAAK,SAChBE,EAAQH,EAAM,OACdI,EAAW,EAAID,EACfE,EAAU,GAChBL,EAAM,QAAQ,CAACM,EAAWC,IAAc,CACtC,MAAMC,EAASD,EAAIJ,GAAU,EAAIE,GAC3BI,EAAQL,GAAY,EAAIC,GAC9B,IAAIK,GAAWR,EAAWM,GAASC,EACnCC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAIA,EAAS,CAAC,CAAC,EAC1C,OAAK,IAAIJ,EAAM,CAAE,QAAAI,CAAQ,CAAC,CAC5B,CAAC,CACH,CACF,CAAC,EACM,IAAM,CACXZ,EAAkB,SAAWA,EAAkB,QAAQ,OAAO,EAC9D,gBAAc,OAAO,EAAE,QAASa,GAA2BA,EAAE,KAAK,CAAC,CACrE,CACF,EAAG,CAAC,CAAC,EAGHhB,MACE,OAAC,OAAI,aAAW,MAAG,uCAAwCD,EAAW,CAAE,YAAaE,IAAU,MAAO,CAAC,EACrG,mBAAC,WAAQ,IAAKC,EAAU,GAAG,KAAK,KAAM,EAAG,KAAMF,EAAO,EACxD,CAGN,CAAC,EAEDJ,EAAM,YAAc,QAEpB,IAAOV,KAAQ,cAAWU,CAAK",
   "names": ["Title_exports", "__export", "Title_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_SplitText", "import_ScrollTrigger", "import_utils", "import_components", "import_Styles", "Title", "React", "data", "className", "title", "theme", "titleRef", "splitTextInstance", "height", "words", "self", "progress", "total", "interval", "overlap", "word", "i", "start", "width", "opacity", "t"]
 }

package/dist/cjs/components/heading.js

@@ -1,2 +1,2 @@
-"use strict";var u=Object.create;var l=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var E=Object.getPrototypeOf,L=Object.prototype.hasOwnProperty;var N=(t,e)=>{for(var o in e)l(t,o,{get:e[o],enumerable:!0})},g=(t,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of R(e))!L.call(t,a)&&a!==o&&l(t,a,{get:()=>e[a],enumerable:!(i=z(e,a))||i.enumerable});return t};var T=(t,e,o)=>(o=t!=null?u(E(t)):{},g(e||!t||!t.__esModule?l(o,"default",{value:t,enumerable:!0}):o,t)),V=t=>g(l({},"__esModule",{value:!0}),t);var C={};N(C,{Heading:()=>r});module.exports=V(C);var d=require("react/jsx-runtime"),h=require("../helpers/index.js"),x=require("@radix-ui/react-slot"),m=require("class-variance-authority"),c=T(require("react")),f=require("@payloadcms/richtext-lexical/html");const w=(0,m.cva)("leading-tight",{variants:{size:{none:"tracking",1:"text-heading-1 lg-desktop:text-[16px]",2:"text-heading-2 lg-desktop:text-[24px]",3:"text-heading-3 lg-desktop:text-[32px]",4:"text-heading-4 desktop:text-[36px] lg-desktop:text-[48px]",5:"text-heading-5 desktop:text-[48px] lg-desktop:text-[64px]"},weight:{medium:"font-medium",semibold:"font-semibold",bold:"font-bold",extraBold:"font-extrabold",black:"font-black"},align:{left:"text-left",center:"text-center",right:"text-right"}},defaultVariants:{size:"none",weight:"bold"}}),r=c.default.forwardRef((t,e)=>{const{children:o,className:i,size:a="none",align:k,weight:y,asChild:b,as:H="h1",color:s,html:n,...P}=t,p=n?{dangerouslySetInnerHTML:{__html:typeof n=="string"?n:(0,f.convertLexicalToHTML)({data:n})}}:null,S=s?{style:{color:s}}:null;return(0,d.jsx)(x.Slot,{...P,ref:e,className:(0,h.cn)(w({size:a,weight:y,align:k}),i),...p,...S,children:b?o:(0,d.jsx)(H,{children:p?null:o})})});r.displayName="Heading";
+"use strict";var u=Object.create;var l=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var E=Object.getPrototypeOf,L=Object.prototype.hasOwnProperty;var N=(e,t)=>{for(var o in t)l(e,o,{get:t[o],enumerable:!0})},g=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of R(t))!L.call(e,a)&&a!==o&&l(e,a,{get:()=>t[a],enumerable:!(i=z(t,a))||i.enumerable});return e};var T=(e,t,o)=>(o=e!=null?u(E(e)):{},g(t||!e||!e.__esModule?l(o,"default",{value:e,enumerable:!0}):o,e)),V=e=>g(l({},"__esModule",{value:!0}),e);var C={};N(C,{Heading:()=>r});module.exports=V(C);var d=require("react/jsx-runtime"),x=require("../helpers/index.js"),m=require("@radix-ui/react-slot"),c=require("class-variance-authority"),h=T(require("react")),f=require("@payloadcms/richtext-lexical/html");const w=(0,c.cva)("leading-tight tracking-[-0.04em]",{variants:{size:{none:"tracking-[-0.04em]",1:"lg-desktop:text-[16px] text-[14px] leading-[120%]",2:"lg-desktop:text-[24px] text-[20px] leading-[120%]",3:"lg-desktop:text-[32px] text-[24px] leading-[120%]",4:"desktop:text-[36px] lg-desktop:text-[48px] text-[32px] leading-[100%]",5:"desktop:text-[48px] lg-desktop:text-[64px] text-[40px] leading-[100%]"},weight:{medium:"font-medium",semibold:"font-semibold",bold:"font-bold",extraBold:"font-extrabold",black:"font-black"},align:{left:"text-left",center:"text-center",right:"text-right"}},defaultVariants:{size:"none",weight:"bold"}}),r=h.default.forwardRef((e,t)=>{const{children:o,className:i,size:a="none",align:k,weight:y,asChild:b,as:H="h1",color:s,html:n,...P}=e,p=n?{dangerouslySetInnerHTML:{__html:typeof n=="string"?n:(0,f.convertLexicalToHTML)({data:n})}}:null,S=s?{style:{color:s}}:null;return(0,d.jsx)(m.Slot,{...P,ref:t,className:(0,x.cn)(w({size:a,weight:y,align:k}),i),...p,...S,children:b?o:(0,d.jsx)(H,{children:p?null:o})})});r.displayName="Heading";
 //# sourceMappingURL=heading.js.map

package/dist/cjs/components/heading.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/heading.tsx"],
-  "sourcesContent": ["import { cn } from '../helpers/index.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport React from 'react'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\n\nconst headingVariants = cva('leading-tight', {\n  variants: {\n    size: {\n      none: 'tracking',\n      1: 'text-heading-1 lg-desktop:text-[16px]',\n      2: 'text-heading-2 lg-desktop:text-[24px]',\n      3: 'text-heading-3 lg-desktop:text-[32px]',\n      4: 'text-heading-4 desktop:text-[36px] lg-desktop:text-[48px]',\n      5: 'text-heading-5 desktop:text-[48px] lg-desktop:text-[64px]',\n    },\n    weight: {\n      medium: 'font-medium',\n      semibold: 'font-semibold',\n      bold: 'font-bold',\n      extraBold: 'font-extrabold',\n      black: 'font-black',\n    },\n    align: {\n      left: 'text-left',\n      center: 'text-center',\n      right: 'text-right',\n    },\n  },\n  defaultVariants: {\n    size: 'none',\n    weight: 'bold',\n  },\n})\n\ntype HeadingElement = React.ElementRef<'h1'>\n\ninterface HeadingProps extends React.ComponentPropsWithoutRef<'h1'>, VariantProps<typeof headingVariants> {\n  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n  asChild?: boolean\n  color?: string\n  html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\nconst Heading = React.forwardRef<HeadingElement, HeadingProps>((props, forwardedRef) => {\n  const {\n    children,\n    className,\n    size = 'none', // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A none\uFF0C\u6CA1\u6709\u9ED8\u8BA4\u7684\u5B57\u4F53\u5927\u5C0F\n    align,\n    weight,\n    asChild,\n    as: Tag = 'h1',\n    color,\n    html,\n    ...headingProps\n  } = props\n\n  const htmlContentProps = html\n    ? {\n        dangerouslySetInnerHTML: { __html: typeof html === 'string' ? html : convertLexicalToHTML({ data: html }) },\n      }\n    : null\n\n  const styleProps = color\n    ? {\n        style: {\n          color,\n        },\n      }\n    : null\n  return (\n    <Slot\n      {...headingProps}\n      ref={forwardedRef}\n      className={cn(\n        headingVariants({\n          size,\n          weight,\n          align,\n        }),\n        className\n      )}\n      {...htmlContentProps}\n      {...styleProps}\n    >\n      {asChild ? children : <Tag>{htmlContentProps ? null : children}</Tag>}\n    </Slot>\n  )\n})\n\nHeading.displayName = 'Heading'\n\nexport { Heading }\nexport type { HeadingProps }\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAuF4B,IAAAI,EAAA,6BAvF5BC,EAAmB,+BACnBC,EAAqB,gCACrBC,EAAuC,oCACvCC,EAAkB,oBAClBC,EAAqC,6CAGrC,MAAMC,KAAkB,OAAI,gBAAiB,CAC3C,SAAU,CACR,KAAM,CACJ,KAAM,WACN,EAAG,wCACH,EAAG,wCACH,EAAG,wCACH,EAAG,4DACH,EAAG,2DACL,EACA,OAAQ,CACN,OAAQ,cACR,SAAU,gBACV,KAAM,YACN,UAAW,iBACX,MAAO,YACT,EACA,MAAO,CACL,KAAM,YACN,OAAQ,cACR,MAAO,YACT,CACF,EACA,gBAAiB,CACf,KAAM,OACN,OAAQ,MACV,CACF,CAAC,EAWKR,EAAU,EAAAS,QAAM,WAAyC,CAACC,EAAOC,IAAiB,CACtF,KAAM,CACJ,SAAAC,EACA,UAAAC,EACA,KAAAC,EAAO,OACP,MAAAC,EACA,OAAAC,EACA,QAAAC,EACA,GAAIC,EAAM,KACV,MAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAIX,EAEEY,EAAmBF,EACrB,CACE,wBAAyB,CAAE,OAAQ,OAAOA,GAAS,SAAWA,KAAO,wBAAqB,CAAE,KAAMA,CAAK,CAAC,CAAE,CAC5G,EACA,KAEEG,EAAaJ,EACf,CACE,MAAO,CACL,MAAAA,CACF,CACF,EACA,KACJ,SACE,OAAC,QACE,GAAGE,EACJ,IAAKV,EACL,aAAW,MACTH,EAAgB,CACd,KAAAM,EACA,OAAAE,EACA,MAAAD,CACF,CAAC,EACDF,CACF,EACC,GAAGS,EACH,GAAGC,EAEH,SAAAN,EAAUL,KAAW,OAACM,EAAA,CAAK,SAAAI,EAAmB,KAAOV,EAAS,EACjE,CAEJ,CAAC,EAEDZ,EAAQ,YAAc",
+  "sourcesContent": ["import { cn } from '../helpers/index.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport React from 'react'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\n\nconst headingVariants = cva('leading-tight tracking-[-0.04em]', {\n  variants: {\n    size: {\n      none: 'tracking-[-0.04em]',\n      1: 'lg-desktop:text-[16px] text-[14px] leading-[120%]',\n      2: 'lg-desktop:text-[24px] text-[20px] leading-[120%]',\n      3: 'lg-desktop:text-[32px] text-[24px] leading-[120%]',\n      4: 'desktop:text-[36px] lg-desktop:text-[48px] text-[32px] leading-[100%]',\n      5: 'desktop:text-[48px] lg-desktop:text-[64px] text-[40px] leading-[100%]',\n    },\n    weight: {\n      medium: 'font-medium',\n      semibold: 'font-semibold',\n      bold: 'font-bold',\n      extraBold: 'font-extrabold',\n      black: 'font-black',\n    },\n    align: {\n      left: 'text-left',\n      center: 'text-center',\n      right: 'text-right',\n    },\n  },\n  defaultVariants: {\n    size: 'none',\n    weight: 'bold',\n  },\n})\n\ntype HeadingElement = React.ElementRef<'h1'>\n\ninterface HeadingProps extends React.ComponentPropsWithoutRef<'h1'>, VariantProps<typeof headingVariants> {\n  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n  asChild?: boolean\n  color?: string\n  html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\nconst Heading = React.forwardRef<HeadingElement, HeadingProps>((props, forwardedRef) => {\n  const {\n    children,\n    className,\n    size = 'none', // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A none\uFF0C\u6CA1\u6709\u9ED8\u8BA4\u7684\u5B57\u4F53\u5927\u5C0F\n    align,\n    weight,\n    asChild,\n    as: Tag = 'h1',\n    color,\n    html,\n    ...headingProps\n  } = props\n\n  const htmlContentProps = html\n    ? {\n        dangerouslySetInnerHTML: { __html: typeof html === 'string' ? html : convertLexicalToHTML({ data: html }) },\n      }\n    : null\n\n  const styleProps = color\n    ? {\n        style: {\n          color,\n        },\n      }\n    : null\n  return (\n    <Slot\n      {...headingProps}\n      ref={forwardedRef}\n      className={cn(\n        headingVariants({\n          size,\n          weight,\n          align,\n        }),\n        className\n      )}\n      {...htmlContentProps}\n      {...styleProps}\n    >\n      {asChild ? children : <Tag>{htmlContentProps ? null : children}</Tag>}\n    </Slot>\n  )\n})\n\nHeading.displayName = 'Heading'\n\nexport { Heading }\nexport type { HeadingProps }\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAuF4B,IAAAI,EAAA,6BAvF5BC,EAAmB,+BACnBC,EAAqB,gCACrBC,EAAuC,oCACvCC,EAAkB,oBAClBC,EAAqC,6CAGrC,MAAMC,KAAkB,OAAI,mCAAoC,CAC9D,SAAU,CACR,KAAM,CACJ,KAAM,qBACN,EAAG,oDACH,EAAG,oDACH,EAAG,oDACH,EAAG,wEACH,EAAG,uEACL,EACA,OAAQ,CACN,OAAQ,cACR,SAAU,gBACV,KAAM,YACN,UAAW,iBACX,MAAO,YACT,EACA,MAAO,CACL,KAAM,YACN,OAAQ,cACR,MAAO,YACT,CACF,EACA,gBAAiB,CACf,KAAM,OACN,OAAQ,MACV,CACF,CAAC,EAWKR,EAAU,EAAAS,QAAM,WAAyC,CAACC,EAAOC,IAAiB,CACtF,KAAM,CACJ,SAAAC,EACA,UAAAC,EACA,KAAAC,EAAO,OACP,MAAAC,EACA,OAAAC,EACA,QAAAC,EACA,GAAIC,EAAM,KACV,MAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAIX,EAEEY,EAAmBF,EACrB,CACE,wBAAyB,CAAE,OAAQ,OAAOA,GAAS,SAAWA,KAAO,wBAAqB,CAAE,KAAMA,CAAK,CAAC,CAAE,CAC5G,EACA,KAEEG,EAAaJ,EACf,CACE,MAAO,CACL,MAAAA,CACF,CACF,EACA,KACJ,SACE,OAAC,QACE,GAAGE,EACJ,IAAKV,EACL,aAAW,MACTH,EAAgB,CACd,KAAAM,EACA,OAAAE,EACA,MAAAD,CACF,CAAC,EACDF,CACF,EACC,GAAGS,EACH,GAAGC,EAEH,SAAAN,EAAUL,KAAW,OAACM,EAAA,CAAK,SAAAI,EAAmB,KAAOV,EAAS,EACjE,CAEJ,CAAC,EAEDZ,EAAQ,YAAc",
   "names": ["heading_exports", "__export", "Heading", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_react_slot", "import_class_variance_authority", "import_react", "import_html", "headingVariants", "React", "props", "forwardedRef", "children", "className", "size", "align", "weight", "asChild", "Tag", "color", "html", "headingProps", "htmlContentProps", "styleProps"]
 }

package/dist/cjs/components/text.js

@@ -1,2 +1,2 @@
-"use strict";var b=Object.create;var p=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var L=(t,e)=>{for(var o in e)p(t,o,{get:e[o],enumerable:!0})},x=(t,e,o,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of C(e))!z.call(t,r)&&r!==o&&p(t,r,{get:()=>e[r],enumerable:!(n=S(e,r))||n.enumerable});return t};var w=(t,e,o)=>(o=t!=null?b(R(t)):{},x(e||!t||!t.__esModule?p(o,"default",{value:t,enumerable:!0}):o,t)),E=t=>x(p({},"__esModule",{value:!0}),t);var W={};L(W,{Text:()=>a});module.exports=E(W);var i=require("react/jsx-runtime"),N=w(require("react")),d=require("@radix-ui/react-slot"),P=require("class-variance-authority"),c=require("@payloadcms/richtext-lexical/html"),f=require("../helpers/index.js");const V=(0,P.cva)("font-heading",{variants:{size:{none:"tracking",1:"text-text-1",2:"text-text-2",3:"text-text-3",4:"text-text-4"},weight:{light:"font-light",normal:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},align:{left:"text-left",center:"text-center",right:"text-right"}},defaultVariants:{size:"none",weight:"bold"}}),a=N.forwardRef((t,e)=>{const{children:o,size:n="none",weight:r,align:h,className:T,asChild:g,as:y="span",color:l,html:s,...u}=t,m=s?{dangerouslySetInnerHTML:{__html:typeof s=="string"?s:(0,c.convertLexicalToHTML)({data:s})}}:null,v=l?{style:{color:l}}:null;return(0,i.jsx)(d.Slot,{...u,ref:e,className:(0,f.cn)(V({size:n,weight:n==="none"?"medium":r,align:h}),T),...m,...v,children:g?o:(0,i.jsx)(y,{children:m?null:o})})});a.displayName="Text";
+"use strict";var b=Object.create;var a=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var L=(e,t)=>{for(var o in t)a(e,o,{get:t[o],enumerable:!0})},d=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of C(t))!z.call(e,r)&&r!==o&&a(e,r,{get:()=>t[r],enumerable:!(n=S(t,r))||n.enumerable});return e};var w=(e,t,o)=>(o=e!=null?b(R(e)):{},d(t||!e||!e.__esModule?a(o,"default",{value:e,enumerable:!0}):o,e)),E=e=>d(a({},"__esModule",{value:!0}),e);var W={};L(W,{Text:()=>s});module.exports=E(W);var i=require("react/jsx-runtime"),N=w(require("react")),x=require("@radix-ui/react-slot"),P=require("class-variance-authority"),c=require("@payloadcms/richtext-lexical/html"),f=require("../helpers/index.js");const V=(0,P.cva)("tracking-[-0.02em]",{variants:{size:{none:"tracking",1:"text-[12px] leading-[140%]",2:"text-[14px] leading-[140%]",3:"text-[16px] leading-[140%]",4:"text-[18px] leading-[140%]"},weight:{light:"font-light",normal:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},align:{left:"text-left",center:"text-center",right:"text-right"}},defaultVariants:{size:"none",weight:"bold"}}),s=N.forwardRef((e,t)=>{const{children:o,size:n="none",weight:r,align:g,className:T,asChild:h,as:y="span",color:l,html:p,...u}=e,m=p?{dangerouslySetInnerHTML:{__html:typeof p=="string"?p:(0,c.convertLexicalToHTML)({data:p})}}:null,v=l?{style:{color:l}}:null;return(0,i.jsx)(x.Slot,{...u,ref:t,className:(0,f.cn)(V({size:n,weight:n==="none"?"medium":r,align:g}),T),...m,...v,children:h?o:(0,i.jsx)(y,{children:m?null:o})})});s.displayName="Text";
 //# sourceMappingURL=text.js.map

package/dist/cjs/components/text.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/text.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\nimport { cn } from '../helpers/index.js'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\n\nconst textVariants = cva('font-heading', {\n  variants: {\n    size: {\n      none: 'tracking',\n      1: 'text-text-1',\n      2: 'text-text-2',\n      3: 'text-text-3',\n      4: 'text-text-4',\n    },\n    weight: {\n      light: 'font-light',\n      normal: 'font-normal',\n      medium: 'font-medium',\n      semibold: 'font-semibold',\n      bold: 'font-bold',\n    },\n    align: {\n      left: 'text-left',\n      center: 'text-center',\n      right: 'text-right',\n    },\n  },\n  defaultVariants: {\n    size: 'none',\n    weight: 'bold',\n  },\n})\n\ntype TextElement = React.ElementRef<'span'>\ntype TextSpanProps = { as?: 'span' } & ComponentPropsWithout<'span', RemovedProps>\ntype TextDivProps = { as: 'div' } & ComponentPropsWithout<'div', RemovedProps>\ntype TextLabelProps = { as: 'label' } & ComponentPropsWithout<'label', RemovedProps>\ntype TextPProps = { as: 'p' } & ComponentPropsWithout<'p', RemovedProps>\n\ninterface CommonTextProps extends VariantProps<typeof textVariants> {\n  as?: 'div' | 'label' | 'p' | 'span'\n  asChild?: boolean\n  color?: string\n  /** \u76F8\u5F53\u4E8E dangerouslySetInnerHTML */\n  html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\ntype TextProps = CommonTextProps & (TextSpanProps | TextDivProps | TextLabelProps | TextPProps)\n\nconst Text = React.forwardRef<TextElement, TextProps>((props, forwardedRef) => {\n  const {\n    children,\n    size = 'none', // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A none\uFF0C\u6CA1\u6709\u9ED8\u8BA4\u7684\u5B57\u4F53\u5927\u5C0F\n    weight,\n    align,\n    className,\n    asChild,\n    as: Tag = 'span',\n    color,\n    html,\n    ...textProps\n  } = props\n\n  const htmlContentProps = html\n    ? {\n        dangerouslySetInnerHTML: { __html: typeof html === 'string' ? html : convertLexicalToHTML({ data: html }) },\n      }\n    : null\n\n  const styleProps = color\n    ? {\n        style: {\n          color,\n        },\n      }\n    : null\n\n  return (\n    <Slot\n      {...textProps}\n      ref={forwardedRef}\n      className={cn(\n        textVariants({\n          size,\n          weight: size === 'none' ? 'medium' : weight, // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A medium\n          align,\n        }),\n        className\n      )}\n      {...htmlContentProps}\n      {...styleProps}\n    >\n      {asChild ? children : <Tag>{htmlContentProps ? null : children}</Tag>}\n    </Slot>\n  )\n})\nText.displayName = 'Text'\n\nexport { Text }\nexport type { TextProps }\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,IAAA,eAAAC,EAAAH,GA+F4B,IAAAI,EAAA,6BA/F5BC,EAAuB,oBACvBC,EAAqB,gCACrBC,EAAuC,oCACvCC,EAAqC,6CAErCC,EAAmB,+BAGnB,MAAMC,KAAe,OAAI,eAAgB,CACvC,SAAU,CACR,KAAM,CACJ,KAAM,WACN,EAAG,cACH,EAAG,cACH,EAAG,cACH,EAAG,aACL,EACA,OAAQ,CACN,MAAO,aACP,OAAQ,cACR,OAAQ,cACR,SAAU,gBACV,KAAM,WACR,EACA,MAAO,CACL,KAAM,YACN,OAAQ,cACR,MAAO,YACT,CACF,EACA,gBAAiB,CACf,KAAM,OACN,OAAQ,MACV,CACF,CAAC,EAkBKR,EAAOG,EAAM,WAAmC,CAACM,EAAOC,IAAiB,CAC7E,KAAM,CACJ,SAAAC,EACA,KAAAC,EAAO,OACP,OAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,GAAIC,EAAM,OACV,MAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAIX,EAEEY,EAAmBF,EACrB,CACE,wBAAyB,CAAE,OAAQ,OAAOA,GAAS,SAAWA,KAAO,wBAAqB,CAAE,KAAMA,CAAK,CAAC,CAAE,CAC5G,EACA,KAEEG,EAAaJ,EACf,CACE,MAAO,CACL,MAAAA,CACF,CACF,EACA,KAEJ,SACE,OAAC,QACE,GAAGE,EACJ,IAAKV,EACL,aAAW,MACTF,EAAa,CACX,KAAAI,EACA,OAAQA,IAAS,OAAS,SAAWC,EACrC,MAAAC,CACF,CAAC,EACDC,CACF,EACC,GAAGM,EACH,GAAGC,EAEH,SAAAN,EAAUL,KAAW,OAACM,EAAA,CAAK,SAAAI,EAAmB,KAAOV,EAAS,EACjE,CAEJ,CAAC,EACDX,EAAK,YAAc",
+  "sourcesContent": ["import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\nimport { cn } from '../helpers/index.js'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\n\nconst textVariants = cva('tracking-[-0.02em]', {\n  variants: {\n    size: {\n      none: 'tracking',\n      1: 'text-[12px] leading-[140%]',\n      2: 'text-[14px] leading-[140%]',\n      3: 'text-[16px] leading-[140%]',\n      4: 'text-[18px] leading-[140%]',\n    },\n    weight: {\n      light: 'font-light',\n      normal: 'font-normal',\n      medium: 'font-medium',\n      semibold: 'font-semibold',\n      bold: 'font-bold',\n    },\n    align: {\n      left: 'text-left',\n      center: 'text-center',\n      right: 'text-right',\n    },\n  },\n  defaultVariants: {\n    size: 'none',\n    weight: 'bold',\n  },\n})\n\ntype TextElement = React.ElementRef<'span'>\ntype TextSpanProps = { as?: 'span' } & ComponentPropsWithout<'span', RemovedProps>\ntype TextDivProps = { as: 'div' } & ComponentPropsWithout<'div', RemovedProps>\ntype TextLabelProps = { as: 'label' } & ComponentPropsWithout<'label', RemovedProps>\ntype TextPProps = { as: 'p' } & ComponentPropsWithout<'p', RemovedProps>\n\ninterface CommonTextProps extends VariantProps<typeof textVariants> {\n  as?: 'div' | 'label' | 'p' | 'span'\n  asChild?: boolean\n  color?: string\n  /** \u76F8\u5F53\u4E8E dangerouslySetInnerHTML */\n  html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\ntype TextProps = CommonTextProps & (TextSpanProps | TextDivProps | TextLabelProps | TextPProps)\n\nconst Text = React.forwardRef<TextElement, TextProps>((props, forwardedRef) => {\n  const {\n    children,\n    size = 'none', // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A none\uFF0C\u6CA1\u6709\u9ED8\u8BA4\u7684\u5B57\u4F53\u5927\u5C0F\n    weight,\n    align,\n    className,\n    asChild,\n    as: Tag = 'span',\n    color,\n    html,\n    ...textProps\n  } = props\n\n  const htmlContentProps = html\n    ? {\n        dangerouslySetInnerHTML: { __html: typeof html === 'string' ? html : convertLexicalToHTML({ data: html }) },\n      }\n    : null\n\n  const styleProps = color\n    ? {\n        style: {\n          color,\n        },\n      }\n    : null\n\n  return (\n    <Slot\n      {...textProps}\n      ref={forwardedRef}\n      className={cn(\n        textVariants({\n          size,\n          weight: size === 'none' ? 'medium' : weight, // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A medium\n          align,\n        }),\n        className\n      )}\n      {...htmlContentProps}\n      {...styleProps}\n    >\n      {asChild ? children : <Tag>{htmlContentProps ? null : children}</Tag>}\n    </Slot>\n  )\n})\nText.displayName = 'Text'\n\nexport { Text }\nexport type { TextProps }\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,IAAA,eAAAC,EAAAH,GA+F4B,IAAAI,EAAA,6BA/F5BC,EAAuB,oBACvBC,EAAqB,gCACrBC,EAAuC,oCACvCC,EAAqC,6CAErCC,EAAmB,+BAGnB,MAAMC,KAAe,OAAI,qBAAsB,CAC7C,SAAU,CACR,KAAM,CACJ,KAAM,WACN,EAAG,6BACH,EAAG,6BACH,EAAG,6BACH,EAAG,4BACL,EACA,OAAQ,CACN,MAAO,aACP,OAAQ,cACR,OAAQ,cACR,SAAU,gBACV,KAAM,WACR,EACA,MAAO,CACL,KAAM,YACN,OAAQ,cACR,MAAO,YACT,CACF,EACA,gBAAiB,CACf,KAAM,OACN,OAAQ,MACV,CACF,CAAC,EAkBKR,EAAOG,EAAM,WAAmC,CAACM,EAAOC,IAAiB,CAC7E,KAAM,CACJ,SAAAC,EACA,KAAAC,EAAO,OACP,OAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,GAAIC,EAAM,OACV,MAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAIX,EAEEY,EAAmBF,EACrB,CACE,wBAAyB,CAAE,OAAQ,OAAOA,GAAS,SAAWA,KAAO,wBAAqB,CAAE,KAAMA,CAAK,CAAC,CAAE,CAC5G,EACA,KAEEG,EAAaJ,EACf,CACE,MAAO,CACL,MAAAA,CACF,CACF,EACA,KAEJ,SACE,OAAC,QACE,GAAGE,EACJ,IAAKV,EACL,aAAW,MACTF,EAAa,CACX,KAAAI,EACA,OAAQA,IAAS,OAAS,SAAWC,EACrC,MAAAC,CACF,CAAC,EACDC,CACF,EACC,GAAGM,EACH,GAAGC,EAEH,SAAAN,EAAUL,KAAW,OAACM,EAAA,CAAK,SAAAI,EAAmB,KAAOV,EAAS,EACjE,CAEJ,CAAC,EACDX,EAAK,YAAc",
   "names": ["text_exports", "__export", "Text", "__toCommonJS", "import_jsx_runtime", "React", "import_react_slot", "import_class_variance_authority", "import_html", "import_helpers", "textVariants", "props", "forwardedRef", "children", "size", "weight", "align", "className", "asChild", "Tag", "color", "html", "textProps", "htmlContentProps", "styleProps"]
 }

package/dist/cjs/stories/heading.stories.js

@@ -1,4 +1,4 @@
-"use strict";var i=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var c=(r,o)=>{for(var a in o)i(r,a,{get:o[a],enumerable:!0})},m=(r,o,a,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let n of p(o))!d.call(r,n)&&n!==a&&i(r,n,{get:()=>o[n],enumerable:!(s=l(o,n))||s.enumerable});return r};var y=r=>m(i({},"__esModule",{value:!0}),r);var b={};c(b,{All:()=>u,Default:()=>g,Html:()=>f,default:()=>x});module.exports=y(b);var e=require("react/jsx-runtime"),t=require("../components/index.js"),v=require("react");const h={title:"Typography/Heading",component:t.Heading,parameters:{layout:"padded",docs:{description:{component:`Heading \u7EC4\u4EF6\uFF0C \u5206\u4E3A5\u4E2Asize , \u5185\u7F6E\u5B57\u4F53\u5927\u5C0F\u54CD\u5E94\u5F0F\u9884\u8BBE, \u57FA\u672C\u548Ctext \u7EC4\u4EF6\u4E00\u6837\uFF0C\u53EA\u662F\u9ED8\u8BA4\u7684\u6807\u7B7E\u7C7B\u578B\u4E0D\u4E00\u6837\u3002
+"use strict";var i=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var c=(r,o)=>{for(var n in o)i(r,n,{get:o[n],enumerable:!0})},m=(r,o,n,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of s(o))!d.call(r,a)&&a!==n&&i(r,a,{get:()=>o[a],enumerable:!(l=p(o,a))||l.enumerable});return r};var y=r=>m(i({},"__esModule",{value:!0}),r);var b={};c(b,{All:()=>u,Default:()=>g,Html:()=>f,default:()=>x});module.exports=y(b);var e=require("react/jsx-runtime"),t=require("../components/index.js"),v=require("react");const h={title:"Typography/Heading",component:t.Heading,parameters:{layout:"padded",docs:{description:{component:`Heading \u7EC4\u4EF6\uFF0C \u5206\u4E3A5\u4E2Asize , \u5185\u7F6E\u5B57\u4F53\u5927\u5C0F\u54CD\u5E94\u5F0F\u9884\u8BBE, \u57FA\u672C\u548Ctext \u7EC4\u4EF6\u4E00\u6837\uFF0C\u53EA\u662F\u9ED8\u8BA4\u7684\u6807\u7B7E\u7C7B\u578B\u4E0D\u4E00\u6837\u3002
 
 ### \u6807\u9898\u5C3A\u5BF8
 \u6807\u9898\u7684\u5927\u5C0F\uFF0C\u5C42\u7EA7\uFF0C\u5BF9\u6BD4\u5EA6\u7B49\u90FD\u662F\u5F71\u54CD\u89C6\u89C9\u53EF\u8BFB\u6027\u548C\u9605\u8BFB\u6548\u7387\u7684\u91CD\u8981\u56E0\u7D20\uFF0C\u4E3A\u4FDD\u969C\u6807\u9898\u7684\u6613\u8BFB\u6027\uFF0C\u754C\u9762\u6807\u9898\u9700\u6EE1\u8DB3\u4EE5\u4E0B\u8981\u6C42\uFF1A\u6700\u5C0F\u53EF\u8BC6\u522B\u6807\u9898\u5C3A\u5BF8\uFF1A14px, 
@@ -9,5 +9,5 @@
 - 2: \u4E09\u7EA7\u6807\u9898(24px, 20px, 20px)
 - 1: \u9875\u9762\u6309\u94AE/\u6807\u7B7E(16px, 14px, 14px)
 - none: \u65E0\u9ED8\u8BA4\u5B57\u4F53\u5927\u5C0F
-          `}}},tags:["autodocs"],argTypes:{size:{control:{type:"select"},options:["none",1,2,3,4,5],description:"\u6587\u672C\u5C3A\u5BF8\uFF0C\u4ECE1\u52305\uFF0Cfont-size\u8D8A\u6765\u8D8A\u5927",table:{defaultValue:{summary:"none"}}},weight:{control:{type:"select"},options:["medium","semibold","bold","extraBold","black"],description:"\u6587\u672C\u7C97\u7EC6, \u4ECE500\u5230900 \uFF0C\u9ED8\u8BA4\u662F700",table:{defaultValue:{summary:"bold"}}},align:{control:{type:"select"},options:["left","center","right"],table:{defaultValue:{summary:void 0}}},color:{control:{type:"color"}},as:{control:{type:"select"},options:["h1","h2","h3","h4","h5","h6"],description:"html \u6807\u7B7E\u7C7B\u578B",table:{defaultValue:{summary:"h1"}}},html:{type:"string",description:"\u76F8\u5F53\u4E8E dangerouslySetInnerHTML"}},args:{as:"h1",size:1,weight:"bold",align:"left"}};var x=h;const g={args:{as:"h1",children:" The quick brown fox jumps over the lazy dog."}},u={render:()=>(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(t.Heading,{size:1,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:2,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:3,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:4,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:5,children:"The quick brown fox jumps over the lazy dog."})]})},f={render:()=>(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(t.Heading,{size:1,children:"\u652F\u6301html \u683C\u5F0F \u548Cpayload cms JSON \u683C\u5F0F \u7684\u5BCC\u6587\u672C"}),(0,e.jsx)("hr",{}),(0,e.jsx)(t.Heading,{size:1,html:"The quick brown fox jumps over the <span style='color: #FBDB93'>lazy dog.</span>"}),(0,e.jsx)("hr",{}),(0,e.jsx)(t.Heading,{size:5,html:{root:{type:"root",format:"",indent:0,version:1,children:[{tag:"h1",type:"heading",format:"",indent:0,version:1,children:[{mode:"normal",text:"React to Every Noise as",type:"text",style:"",detail:0,format:0,version:1}],direction:"ltr"},{tag:"h1",type:"heading",format:"",indent:0,version:1,children:[{mode:"normal",text:"You Go",type:"text",style:"",detail:0,format:0,version:1}],direction:"ltr"}],direction:"ltr"}}})]})};
+          `}}},tags:["autodocs"],argTypes:{size:{control:{type:"select"},options:["none",1,2,3,4,5],description:"\u6587\u672C\u5C3A\u5BF8\uFF0C\u4ECE1\u52305\uFF0Cfont-size\u8D8A\u6765\u8D8A\u5927",table:{defaultValue:{summary:"none"}}},weight:{control:{type:"select"},options:["medium","semibold","bold","extraBold","black"],description:"\u6587\u672C\u7C97\u7EC6, \u4ECE500\u5230900 \uFF0C\u9ED8\u8BA4\u662F700",table:{defaultValue:{summary:"bold"}}},align:{control:{type:"select"},options:["left","center","right"],table:{defaultValue:{summary:void 0}}},color:{control:{type:"color"}},as:{control:{type:"select"},options:["h1","h2","h3","h4","h5","h6"],description:"html \u6807\u7B7E\u7C7B\u578B",table:{defaultValue:{summary:"h1"}}},html:{type:"string",description:"\u76F8\u5F53\u4E8E dangerouslySetInnerHTML"}},args:{as:"h1",size:1,weight:"bold",align:"left"}};var x=h;const g={args:{as:"h1",children:" The quick brown fox jumps over the lazy dog.",className:"tablet:text-[13px] laptop:text-[14px] line-clamp-3 text-[12px] "}},u={render:()=>(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(t.Heading,{size:1,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:2,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:3,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:4,children:"The quick brown fox jumps over the lazy dog."}),(0,e.jsx)(t.Heading,{size:5,children:"The quick brown fox jumps over the lazy dog."})]})},f={render:()=>(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(t.Heading,{size:1,children:"\u652F\u6301html \u683C\u5F0F \u548Cpayload cms JSON \u683C\u5F0F \u7684\u5BCC\u6587\u672C"}),(0,e.jsx)("hr",{}),(0,e.jsx)(t.Heading,{size:1,html:"The quick brown fox jumps over the <span style='color: #FBDB93'>lazy dog.</span>"}),(0,e.jsx)("hr",{}),(0,e.jsx)(t.Heading,{size:5,html:{root:{type:"root",format:"",indent:0,version:1,children:[{tag:"h1",type:"heading",format:"",indent:0,version:1,children:[{mode:"normal",text:"React to Every Noise as",type:"text",style:"",detail:0,format:0,version:1}],direction:"ltr"},{tag:"h1",type:"heading",format:"",indent:0,version:1,children:[{mode:"normal",text:"You Go",type:"text",style:"",detail:0,format:0,version:1}],direction:"ltr"}],direction:"ltr"}}})]})};
 //# sourceMappingURL=heading.stories.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/heading.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Heading } from '../components/index.js'\nimport React from 'react'\n\nconst meta = {\n  title: 'Typography/Heading',\n  component: Heading,\n  parameters: {\n    layout: 'padded',\n    docs: {\n      description: {\n        component: `Heading \u7EC4\u4EF6\uFF0C \u5206\u4E3A5\u4E2Asize , \u5185\u7F6E\u5B57\u4F53\u5927\u5C0F\u54CD\u5E94\u5F0F\u9884\u8BBE, \u57FA\u672C\u548Ctext \u7EC4\u4EF6\u4E00\u6837\uFF0C\u53EA\u662F\u9ED8\u8BA4\u7684\u6807\u7B7E\u7C7B\u578B\u4E0D\u4E00\u6837\u3002\n\n### \u6807\u9898\u5C3A\u5BF8\n\u6807\u9898\u7684\u5927\u5C0F\uFF0C\u5C42\u7EA7\uFF0C\u5BF9\u6BD4\u5EA6\u7B49\u90FD\u662F\u5F71\u54CD\u89C6\u89C9\u53EF\u8BFB\u6027\u548C\u9605\u8BFB\u6548\u7387\u7684\u91CD\u8981\u56E0\u7D20\uFF0C\u4E3A\u4FDD\u969C\u6807\u9898\u7684\u6613\u8BFB\u6027\uFF0C\u754C\u9762\u6807\u9898\u9700\u6EE1\u8DB3\u4EE5\u4E0B\u8981\u6C42\uFF1A\u6700\u5C0F\u53EF\u8BC6\u522B\u6807\u9898\u5C3A\u5BF8\uFF1A14px, \n\u4ECE\u5927\u4E8E1920px, 1441-1920, \u5C0F\u4E8E1440px, \u7684\u5C3A\u5BF8\uFF0C\u5B57\u4F53\u5927\u5C0F\u5206\u522B\u4E3A\uFF1A   \n- 5: \u7279\u5927\u6807\u9898(64px, 48px, 40px)\n- 4: \u4E00\u7EA7\u6807\u9898(48px, 36px, 32px)\n- 3: \u4E8C\u7EA7\u6807\u9898(32px, 24px\uFF0C 24px)\n- 2: \u4E09\u7EA7\u6807\u9898(24px, 20px, 20px)\n- 1: \u9875\u9762\u6309\u94AE/\u6807\u7B7E(16px, 14px, 14px)\n- none: \u65E0\u9ED8\u8BA4\u5B57\u4F53\u5927\u5C0F\n          `,\n      },\n    },\n  },\n  tags: ['autodocs'],\n  argTypes: {\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['none', 1, 2, 3, 4, 5],\n      description: '\u6587\u672C\u5C3A\u5BF8\uFF0C\u4ECE1\u52305\uFF0Cfont-size\u8D8A\u6765\u8D8A\u5927',\n      table: {\n        defaultValue: { summary: 'none' },\n      },\n    },\n    weight: {\n      control: {\n        type: 'select',\n      },\n      options: ['medium', 'semibold', 'bold', 'extraBold', 'black'],\n      description: '\u6587\u672C\u7C97\u7EC6, \u4ECE500\u5230900 \uFF0C\u9ED8\u8BA4\u662F700',\n      table: {\n        defaultValue: { summary: 'bold' },\n      },\n    },\n    align: {\n      control: {\n        type: 'select',\n      },\n      options: ['left', 'center', 'right'],\n      table: {\n        defaultValue: { summary: undefined },\n      },\n    },\n    color: {\n      control: {\n        type: 'color',\n      },\n    },\n    as: {\n      control: {\n        type: 'select',\n      },\n      options: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],\n      description: 'html \u6807\u7B7E\u7C7B\u578B',\n      table: {\n        defaultValue: { summary: 'h1' },\n      },\n    },\n    html: {\n      type: 'string',\n      description: '\u76F8\u5F53\u4E8E dangerouslySetInnerHTML',\n    },\n  },\n  args: {\n    as: 'h1',\n    size: 1,\n    weight: 'bold',\n    align: 'left',\n  },\n} satisfies Meta<typeof Heading>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    as: 'h1',\n    children: ' The quick brown fox jumps over the lazy dog.',\n  },\n}\n\nexport const All: Story = {\n  render: () => (\n    <>\n      <Heading size={1}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={2}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={3}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={4}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={5}>The quick brown fox jumps over the lazy dog.</Heading>\n    </>\n  ),\n}\n\nexport const Html: Story = {\n  render: () => (\n    <>\n      <Heading size={1}>\u652F\u6301html \u683C\u5F0F \u548Cpayload cms JSON \u683C\u5F0F \u7684\u5BCC\u6587\u672C</Heading>\n      <hr />\n      <Heading size={1} html=\"The quick brown fox jumps over the <span style='color: #FBDB93'>lazy dog.</span>\" />\n      <hr />\n      <Heading\n        size={5}\n        html={\n          {\n            root: {\n              type: 'root',\n              format: '',\n              indent: 0,\n              version: 1,\n              children: [\n                {\n                  tag: 'h1',\n                  type: 'heading',\n                  format: '',\n                  indent: 0,\n                  version: 1,\n                  children: [\n                    {\n                      mode: 'normal',\n                      text: 'React to Every Noise as',\n                      type: 'text',\n                      style: '',\n                      detail: 0,\n                      format: 0,\n                      version: 1,\n                    },\n                  ],\n                  direction: 'ltr',\n                },\n                {\n                  tag: 'h1',\n                  type: 'heading',\n                  format: '',\n                  indent: 0,\n                  version: 1,\n                  children: [\n                    {\n                      mode: 'normal',\n                      text: 'You Go',\n                      type: 'text',\n                      style: '',\n                      detail: 0,\n                      format: 0,\n                      version: 1,\n                    },\n                  ],\n                  direction: 'ltr',\n                },\n              ],\n              direction: 'ltr',\n            },\n          } as any\n        }\n      />\n    </>\n  ),\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,SAAAE,EAAA,YAAAC,EAAA,SAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAN,GAmGI,IAAAO,EAAA,6BAjGJC,EAAwB,kCACxBC,EAAkB,iBAElB,MAAMC,EAAO,CACX,MAAO,qBACP,UAAW,UACX,WAAY,CACV,OAAQ,SACR,KAAM,CACJ,YAAa,CACX,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAYb,CACF,CACF,EACA,KAAM,CAAC,UAAU,EACjB,SAAU,CACR,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,EAAG,EAAG,EAAG,EAAG,CAAC,EAC/B,YAAa,sFACb,MAAO,CACL,aAAc,CAAE,QAAS,MAAO,CAClC,CACF,EACA,OAAQ,CACN,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,SAAU,WAAY,OAAQ,YAAa,OAAO,EAC5D,YAAa,2EACb,MAAO,CACL,aAAc,CAAE,QAAS,MAAO,CAClC,CACF,EACA,MAAO,CACL,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,SAAU,OAAO,EACnC,MAAO,CACL,aAAc,CAAE,QAAS,MAAU,CACrC,CACF,EACA,MAAO,CACL,QAAS,CACP,KAAM,OACR,CACF,EACA,GAAI,CACF,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,KAAM,KAAM,KAAM,KAAM,IAAI,EAC5C,YAAa,gCACb,MAAO,CACL,aAAc,CAAE,QAAS,IAAK,CAChC,CACF,EACA,KAAM,CACJ,KAAM,SACN,YAAa,4CACf,CACF,EACA,KAAM,CACJ,GAAI,KACJ,KAAM,EACN,OAAQ,OACR,MAAO,MACT,CACF,EAEA,IAAOL,EAAQK,EAIR,MAAMP,EAAiB,CAC5B,KAAM,CACJ,GAAI,KACJ,SAAU,+CACZ,CACF,EAEaD,EAAa,CACxB,OAAQ,OACN,oBACE,oBAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,GAChE,CAEJ,EAEaE,EAAc,CACzB,OAAQ,OACN,oBACE,oBAAC,WAAQ,KAAM,EAAG,sGAAmC,KACrD,OAAC,OAAG,KACJ,OAAC,WAAQ,KAAM,EAAG,KAAK,mFAAmF,KAC1G,OAAC,OAAG,KACJ,OAAC,WACC,KAAM,EACN,KACE,CACE,KAAM,CACJ,KAAM,OACN,OAAQ,GACR,OAAQ,EACR,QAAS,EACT,SAAU,CACR,CACE,IAAK,KACL,KAAM,UACN,OAAQ,GACR,OAAQ,EACR,QAAS,EACT,SAAU,CACR,CACE,KAAM,SACN,KAAM,0BACN,KAAM,OACN,MAAO,GACP,OAAQ,EACR,OAAQ,EACR,QAAS,CACX,CACF,EACA,UAAW,KACb,EACA,CACE,IAAK,KACL,KAAM,UACN,OAAQ,GACR,OAAQ,EACR,QAAS,EACT,SAAU,CACR,CACE,KAAM,SACN,KAAM,SACN,KAAM,OACN,MAAO,GACP,OAAQ,EACR,OAAQ,EACR,QAAS,CACX,CACF,EACA,UAAW,KACb,CACF,EACA,UAAW,KACb,CACF,EAEJ,GACF,CAEJ",
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Heading } from '../components/index.js'\nimport React from 'react'\n\nconst meta = {\n  title: 'Typography/Heading',\n  component: Heading,\n  parameters: {\n    layout: 'padded',\n    docs: {\n      description: {\n        component: `Heading \u7EC4\u4EF6\uFF0C \u5206\u4E3A5\u4E2Asize , \u5185\u7F6E\u5B57\u4F53\u5927\u5C0F\u54CD\u5E94\u5F0F\u9884\u8BBE, \u57FA\u672C\u548Ctext \u7EC4\u4EF6\u4E00\u6837\uFF0C\u53EA\u662F\u9ED8\u8BA4\u7684\u6807\u7B7E\u7C7B\u578B\u4E0D\u4E00\u6837\u3002\n\n### \u6807\u9898\u5C3A\u5BF8\n\u6807\u9898\u7684\u5927\u5C0F\uFF0C\u5C42\u7EA7\uFF0C\u5BF9\u6BD4\u5EA6\u7B49\u90FD\u662F\u5F71\u54CD\u89C6\u89C9\u53EF\u8BFB\u6027\u548C\u9605\u8BFB\u6548\u7387\u7684\u91CD\u8981\u56E0\u7D20\uFF0C\u4E3A\u4FDD\u969C\u6807\u9898\u7684\u6613\u8BFB\u6027\uFF0C\u754C\u9762\u6807\u9898\u9700\u6EE1\u8DB3\u4EE5\u4E0B\u8981\u6C42\uFF1A\u6700\u5C0F\u53EF\u8BC6\u522B\u6807\u9898\u5C3A\u5BF8\uFF1A14px, \n\u4ECE\u5927\u4E8E1920px, 1441-1920, \u5C0F\u4E8E1440px, \u7684\u5C3A\u5BF8\uFF0C\u5B57\u4F53\u5927\u5C0F\u5206\u522B\u4E3A\uFF1A   \n- 5: \u7279\u5927\u6807\u9898(64px, 48px, 40px)\n- 4: \u4E00\u7EA7\u6807\u9898(48px, 36px, 32px)\n- 3: \u4E8C\u7EA7\u6807\u9898(32px, 24px\uFF0C 24px)\n- 2: \u4E09\u7EA7\u6807\u9898(24px, 20px, 20px)\n- 1: \u9875\u9762\u6309\u94AE/\u6807\u7B7E(16px, 14px, 14px)\n- none: \u65E0\u9ED8\u8BA4\u5B57\u4F53\u5927\u5C0F\n          `,\n      },\n    },\n  },\n  tags: ['autodocs'],\n  argTypes: {\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['none', 1, 2, 3, 4, 5],\n      description: '\u6587\u672C\u5C3A\u5BF8\uFF0C\u4ECE1\u52305\uFF0Cfont-size\u8D8A\u6765\u8D8A\u5927',\n      table: {\n        defaultValue: { summary: 'none' },\n      },\n    },\n    weight: {\n      control: {\n        type: 'select',\n      },\n      options: ['medium', 'semibold', 'bold', 'extraBold', 'black'],\n      description: '\u6587\u672C\u7C97\u7EC6, \u4ECE500\u5230900 \uFF0C\u9ED8\u8BA4\u662F700',\n      table: {\n        defaultValue: { summary: 'bold' },\n      },\n    },\n    align: {\n      control: {\n        type: 'select',\n      },\n      options: ['left', 'center', 'right'],\n      table: {\n        defaultValue: { summary: undefined },\n      },\n    },\n    color: {\n      control: {\n        type: 'color',\n      },\n    },\n    as: {\n      control: {\n        type: 'select',\n      },\n      options: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],\n      description: 'html \u6807\u7B7E\u7C7B\u578B',\n      table: {\n        defaultValue: { summary: 'h1' },\n      },\n    },\n    html: {\n      type: 'string',\n      description: '\u76F8\u5F53\u4E8E dangerouslySetInnerHTML',\n    },\n  },\n  args: {\n    as: 'h1',\n    size: 1,\n    weight: 'bold',\n    align: 'left',\n  },\n} satisfies Meta<typeof Heading>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    as: 'h1',\n    children: ' The quick brown fox jumps over the lazy dog.',\n    className: 'tablet:text-[13px] laptop:text-[14px] line-clamp-3 text-[12px] ',\n  },\n}\n\nexport const All: Story = {\n  render: () => (\n    <>\n      <Heading size={1}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={2}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={3}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={4}>The quick brown fox jumps over the lazy dog.</Heading>\n      <Heading size={5}>The quick brown fox jumps over the lazy dog.</Heading>\n    </>\n  ),\n}\n\nexport const Html: Story = {\n  render: () => (\n    <>\n      <Heading size={1}>\u652F\u6301html \u683C\u5F0F \u548Cpayload cms JSON \u683C\u5F0F \u7684\u5BCC\u6587\u672C</Heading>\n      <hr />\n      <Heading size={1} html=\"The quick brown fox jumps over the <span style='color: #FBDB93'>lazy dog.</span>\" />\n      <hr />\n      <Heading\n        size={5}\n        html={\n          {\n            root: {\n              type: 'root',\n              format: '',\n              indent: 0,\n              version: 1,\n              children: [\n                {\n                  tag: 'h1',\n                  type: 'heading',\n                  format: '',\n                  indent: 0,\n                  version: 1,\n                  children: [\n                    {\n                      mode: 'normal',\n                      text: 'React to Every Noise as',\n                      type: 'text',\n                      style: '',\n                      detail: 0,\n                      format: 0,\n                      version: 1,\n                    },\n                  ],\n                  direction: 'ltr',\n                },\n                {\n                  tag: 'h1',\n                  type: 'heading',\n                  format: '',\n                  indent: 0,\n                  version: 1,\n                  children: [\n                    {\n                      mode: 'normal',\n                      text: 'You Go',\n                      type: 'text',\n                      style: '',\n                      detail: 0,\n                      format: 0,\n                      version: 1,\n                    },\n                  ],\n                  direction: 'ltr',\n                },\n              ],\n              direction: 'ltr',\n            },\n          } as any\n        }\n      />\n    </>\n  ),\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,SAAAE,EAAA,YAAAC,EAAA,SAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAN,GAoGI,IAAAO,EAAA,6BAlGJC,EAAwB,kCACxBC,EAAkB,iBAElB,MAAMC,EAAO,CACX,MAAO,qBACP,UAAW,UACX,WAAY,CACV,OAAQ,SACR,KAAM,CACJ,YAAa,CACX,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAYb,CACF,CACF,EACA,KAAM,CAAC,UAAU,EACjB,SAAU,CACR,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,EAAG,EAAG,EAAG,EAAG,CAAC,EAC/B,YAAa,sFACb,MAAO,CACL,aAAc,CAAE,QAAS,MAAO,CAClC,CACF,EACA,OAAQ,CACN,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,SAAU,WAAY,OAAQ,YAAa,OAAO,EAC5D,YAAa,2EACb,MAAO,CACL,aAAc,CAAE,QAAS,MAAO,CAClC,CACF,EACA,MAAO,CACL,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,SAAU,OAAO,EACnC,MAAO,CACL,aAAc,CAAE,QAAS,MAAU,CACrC,CACF,EACA,MAAO,CACL,QAAS,CACP,KAAM,OACR,CACF,EACA,GAAI,CACF,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,KAAM,KAAM,KAAM,KAAM,IAAI,EAC5C,YAAa,gCACb,MAAO,CACL,aAAc,CAAE,QAAS,IAAK,CAChC,CACF,EACA,KAAM,CACJ,KAAM,SACN,YAAa,4CACf,CACF,EACA,KAAM,CACJ,GAAI,KACJ,KAAM,EACN,OAAQ,OACR,MAAO,MACT,CACF,EAEA,IAAOL,EAAQK,EAIR,MAAMP,EAAiB,CAC5B,KAAM,CACJ,GAAI,KACJ,SAAU,gDACV,UAAW,iEACb,CACF,EAEaD,EAAa,CACxB,OAAQ,OACN,oBACE,oBAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,KAC9D,OAAC,WAAQ,KAAM,EAAG,wDAA4C,GAChE,CAEJ,EAEaE,EAAc,CACzB,OAAQ,OACN,oBACE,oBAAC,WAAQ,KAAM,EAAG,sGAAmC,KACrD,OAAC,OAAG,KACJ,OAAC,WAAQ,KAAM,EAAG,KAAK,mFAAmF,KAC1G,OAAC,OAAG,KACJ,OAAC,WACC,KAAM,EACN,KACE,CACE,KAAM,CACJ,KAAM,OACN,OAAQ,GACR,OAAQ,EACR,QAAS,EACT,SAAU,CACR,CACE,IAAK,KACL,KAAM,UACN,OAAQ,GACR,OAAQ,EACR,QAAS,EACT,SAAU,CACR,CACE,KAAM,SACN,KAAM,0BACN,KAAM,OACN,MAAO,GACP,OAAQ,EACR,OAAQ,EACR,QAAS,CACX,CACF,EACA,UAAW,KACb,EACA,CACE,IAAK,KACL,KAAM,UACN,OAAQ,GACR,OAAQ,EACR,QAAS,EACT,SAAU,CACR,CACE,KAAM,SACN,KAAM,SACN,KAAM,OACN,MAAO,GACP,OAAQ,EACR,OAAQ,EACR,QAAS,CACX,CACF,EACA,UAAW,KACb,CACF,EACA,UAAW,KACb,CACF,EAEJ,GACF,CAEJ",
   "names": ["heading_stories_exports", "__export", "All", "Default", "Html", "heading_stories_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_react", "meta"]
 }

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

@@ -1,2 +1,2 @@
-"use client";import{Fragment as j,jsx as r,jsxs as s}from"react/jsx-runtime";import S from"../Title/index.js";import{cn as n}from"../../helpers/utils.js";import h from"../../components/picture.js";import y from"../../components/button.js";import M from"../SwiperBox/index.js";import"../../components/link.js";import{withStyles as L}from"../../shared/Styles.js";import I,{useState as x,useEffect as A,useRef as m,useCallback as R}from"react";const H=I.forwardRef(({data:o,className:c="",event:d},k)=>{const[a,w]=x(0),[g,N]=x({0:!0}),p=m([]),u=m({0:!0}),l=m(!1),B=(t,e)=>{e&&(p.current[t]=e)},f=t=>{u.current?.[t]&&(l.current=!1,N({[t]:!0}))};A(()=>{const t=p.current;return t?.forEach((e,i)=>{i?(e.style.flex="1 1 0%",e.style.transition="all 0.6s"):(e.style.flex="5 1 0%",e.style.transition="all 0.6s"),e.addEventListener("transitionend",()=>{f(i)})}),()=>{t?.forEach((e,i)=>{e.removeEventListener("transitionend",()=>f(i))})}},[]);const T=({data:t,configuration:e})=>s("div",{className:n("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",e?.itemShape==="round"?"rounded-2xl":""),children:[r(h,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:t?.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:[r("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:t?.title}),r("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:t?.subTitle})]}),r("a",{href:t.link,onClick:()=>e?.event?.primaryButton(t,e),children:r(y,{variant:"secondary",className:n("text-info-primary text-sm font-bold"),children:e?.primaryButton})})]})]}),v=R(t=>{a===t||l.current||(l.current=!0,u.current={[t]:!0},w(t))},[a,l]);return s(j,{children:[o?.title&&r(S,{data:{title:o?.title}}),r("div",{ref:k,className:n("laptop:block hidden",{"aiui-dark":o?.theme==="dark"}),children:r("div",{className:n("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",c),children:o?.products?.map((t,e)=>{const i=a===e,E=i?5:1,C=g?.[e]&&i;return s("div",{style:{flex:E},ref:b=>{b&&B(e,b)},className:n("relative cursor-pointer overflow-hidden",o?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>v(e),onMouseLeave:()=>{l.current=!1},onClick:()=>v(e),children:[r(h,{source:t?.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",C?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[s("div",{className:"mr-16 flex-1 overflow-hidden",children:[r("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:t?.title}),r("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:t?.subTitle})]}),r("a",{href:t?.link,onClick:()=>d?.primaryButton?.(o,e),children:r(y,{variant:"secondary",className:n("desktop:text-base mb-1.5 text-sm font-bold"),children:o?.primaryButton})})]})]},e)})})}),r("div",{className:n("laptop:hidden block",{"aiui-dark":o?.theme==="dark"}),children:r(M,{className:n("h-[400px] !overflow-visible",c),id:"AccordionCards"+o?.key,data:{list:o?.products,configuration:{shape:o?.shape,itemShape:o?.itemShape,primaryButton:o?.primaryButton,event:d}},Slide:T,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.1},768:{spaceBetween:"12px",freeMode:!1,slidesPerView:2.3}}})})]})});var J=L(H);export{J as default};
+"use client";import{Fragment as j,jsx as r,jsxs as s}from"react/jsx-runtime";import S from"../Title/index.js";import{cn as n}from"../../helpers/utils.js";import h from"../../components/picture.js";import y from"../../components/button.js";import M from"../SwiperBox/index.js";import"../../components/link.js";import{withStyles as L}from"../../shared/Styles.js";import I,{useState as x,useEffect as A,useRef as m,useCallback as R}from"react";const H=I.forwardRef(({data:o,className:c="",event:d},k)=>{const[a,w]=x(0),[g,N]=x({0:!0}),u=m([]),p=m({0:!0}),l=m(!1),B=(t,e)=>{e&&(u.current[t]=e)},f=t=>{p.current?.[t]&&(l.current=!1,N({[t]:!0}))};A(()=>{const t=u.current;return t?.forEach((e,i)=>{i?(e.style.flex="1 1 0%",e.style.transition="all 0.6s"):(e.style.flex="8 1 0%",e.style.transition="all 0.6s"),e.addEventListener("transitionend",()=>{f(i)})}),()=>{t?.forEach((e,i)=>{e.removeEventListener("transitionend",()=>f(i))})}},[]);const T=({data:t,configuration:e})=>s("div",{className:n("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",e?.itemShape==="round"?"rounded-2xl":""),children:[r(h,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:t?.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:[r("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:t?.title}),r("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:t?.subTitle})]}),r("a",{href:t.link,onClick:()=>e?.event?.primaryButton(t,e),children:r(y,{variant:"secondary",className:n("text-info-primary text-sm font-bold"),children:e?.primaryButton})})]})]}),v=R(t=>{a===t||l.current||(l.current=!0,p.current={[t]:!0},w(t))},[a,l]);return s(j,{children:[o?.title&&r(S,{data:{title:o?.title}}),r("div",{ref:k,className:n("laptop:block hidden",{"aiui-dark":o?.theme==="dark"}),children:r("div",{className:n("lg-desktop:h-[560px] desktop:h-[448px] flex h-[336px] w-full gap-4 overflow-hidden",c),children:o?.products?.map((t,e)=>{const i=a===e,E=i?8:1,C=g?.[e]&&i;return s("div",{style:{flex:E},ref:b=>{b&&B(e,b)},className:n("relative cursor-pointer overflow-hidden",o?.itemShape==="round"?"rounded-2xl":""),onMouseEnter:()=>v(e),onMouseLeave:()=>{l.current=!1},onClick:()=>v(e),children:[r(h,{source:t?.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",C?"translate-x-0 opacity-100 transition-transform ease-out":"opacity-0"),children:[s("div",{className:"mr-16 flex-1 overflow-hidden",children:[r("p",{className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:t?.title}),r("h3",{className:"desktop:text-lg text-info-primary line-clamp-2 text-sm font-semibold",children:t?.subTitle})]}),r("a",{href:t?.link,onClick:()=>d?.primaryButton?.(o,e),children:r(y,{variant:"secondary",className:n("desktop:text-base mb-1.5 text-sm font-bold"),children:o?.primaryButton})})]})]},e)})})}),r("div",{className:n("laptop:hidden block",{"aiui-dark":o?.theme==="dark"}),children:r(M,{className:n("h-[400px] !overflow-visible",c),id:"AccordionCards"+o?.key,data:{list:o?.products,configuration:{shape:o?.shape,itemShape:o?.itemShape,primaryButton:o?.primaryButton,event:d}},Slide:T,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 J=L(H);export{J 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 Link from '../../components/link.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback } from 'react'\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 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 = '5 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 href={data.link} onClick={() => configuration?.event?.primaryButton(data, configuration)}>\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    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={ref} 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 ? 5 : 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 href={item?.link} onClick={() => event?.primaryButton?.(data, idx)}>\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: '12px',\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1.1,\n            },\n            768: {\n              spaceBetween: '12px',\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 Link from '../../components/link.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport React, { useState, useEffect, useRef, useCallback } from 'react'\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 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 href={data.link} onClick={() => configuration?.event?.primaryButton(data, configuration)}>\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    },\n    [hoverIndex, isAnimation]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={ref} 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 href={item?.link} onClick={() => event?.primaryButton?.(data, idx)}>\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", "AccordionCards", "data", "className", "event", "ref", "hoverIndex", "setHoverIndex", "currentWidth", "setCurrentWidth", "accordionRef", "enterRef", "isAnimation", "getRef", "index", "el", "handleTransitionEnd", "element", "item", "MobileItem", "configuration", "handleSwiperItemClick", "idx", "isExpanded", "flexValue", "isShowContent", "AccordionCards_default"]
 }

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

@@ -1,2 +1,2 @@
-"use client";import{Fragment as u,jsx as t,jsxs as i}from"react/jsx-runtime";import g from"react";import{cn as n}from"../../helpers/utils.js";import s from"../../components/picture.js";import{withStyles as f}from"../../shared/Styles.js";import h from"../Title/index.js";import d from"./SwiperCategory.js";const v=(e,o)=>{const r=[];for(let a=0;a<e.length;a+=o)r.push(e.slice(a,a+o));return r},x=({data:e,configuration:o})=>i("div",{className:n("bg-container-secondary-1 group box-border flex size-full flex-col overflow-hidden","laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{source:e?.image?.url||e?.image,className:"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover"})})}),t("p",{className:"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-semibold",children:e?.name})]}),y=({data:e,configuration:o})=>i("div",{className:n("bg-container-secondary-1 box-border max-h-[126px] w-full overflow-hidden","hover:bg-info-white cursor-pointer px-3 py-4 duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{className:"m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})}),t("p",{className:"text-info-primary flex-1 truncate text-center text-sm font-semibold",children:e?.name})]},`${e?.name}`),b=({data:e,configuration:o})=>i("div",{className:n("aspect-h-[240] bg-container-secondary-1 group box-border h-auto flex-1 shrink-0 overflow-hidden","laptop:p-6 desktop:p-8 hover:bg-info-white cursor-pointer p-4 duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{className:"laptop:size-[146px] m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})})}),t("p",{className:"tablet:text-lg text-info-primary text-center text-sm font-semibold",children:e?.name})]}),k=({data:e,configuration:o,index:r})=>i("div",{className:n("bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden","hover:bg-info-white cursor-pointer p-4",r===0?"aspect-h-[252] row-span-2":"aspect-h-[120]",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{source:e?.image?.url||e?.image,className:n("mb-2 flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",r===0?"max-h-[146px] overflow-hidden":"max-h-[72px] max-w-[72px]")})}),t("p",{className:"text-info-primary line-clamp-2 text-center text-sm font-semibold",children:e?.name})]}),w=({data:e,configuration:o})=>t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,a)=>t(y,{data:r,configuration:o},a))}),C=({data:e,configuration:o})=>i(u,{children:[t("div",{className:"tablet:block hidden",children:t("div",{className:"mx-auto flex w-full gap-4",children:e?.map((r,a)=>t(b,{data:r,configuration:o},a))})}),t("div",{className:"tablet:hidden block",children:t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,a)=>t(k,{index:a,data:r,configuration:o},a))})})]}),N=g.forwardRef((e,o)=>{const{data:r,className:a="",key:m,event:c}=e,l=r?.isShowSelect?r?.products:r?.productData,p=l?.length<=5;return i("div",{ref:o,className:n("w-full overflow-hidden",a,{"aiui-dark":r?.theme==="dark"}),children:[r?.title&&t(h,{data:{title:r?.title}}),p?t(C,{data:l,configuration:{shape:r?.shape,event:c}}):i(u,{children:[t("div",{className:"tablet:block hidden",children:t(d,{id:`Category${m}`,Slide:x,data:{list:l,configuration:{shape:r?.shape,event:c}}})}),t("div",{className:"tablet:hidden block",children:t(d,{id:`Category1${m}`,Slide:w,data:{list:v(l,6),configuration:{shape:r?.shape,event:c}}})}),t("div",{className:"h-7"})]})]})});var D=f(N);export{D as default};
+"use client";import{Fragment as p,jsx as t,jsxs as i}from"react/jsx-runtime";import g from"react";import{cn as n}from"../../helpers/utils.js";import s from"../../components/picture.js";import{withStyles as x}from"../../shared/Styles.js";import f from"../Title/index.js";import m from"./SwiperCategory.js";const h=(e,o)=>{const r=[];for(let a=0;a<e.length;a+=o)r.push(e.slice(a,a+o));return r},v=({data:e,configuration:o})=>i("div",{className:n("tablet:h-[120px] laptop:h-[144px] desktop:h-[192px] lg-desktop:h-[240px]","tablet:p-3 laptop:p-4 desktop:p-6 lg-desktop:p-8","bg-container-secondary-1 hover:bg-info-white group box-border flex size-full cursor-pointer flex-col overflow-hidden duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{source:e?.image?.url||e?.image,className:"laptop:size-[88px] tablet:size-[72px] desktop:size-[116px] lg-desktop:size-[146px] m-auto flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover"})})}),t("p",{className:"tablet:text-lg text-info-primary box-border line-clamp-2 flex-1 text-center text-sm font-bold",children:e?.name})]}),y=({data:e,configuration:o})=>i("div",{className:n("bg-container-secondary-1 box-border max-h-[126px] w-full overflow-hidden","hover:bg-info-white cursor-pointer px-3 py-4 duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{className:"m-auto mb-2 flex size-[72px] justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})}),t("p",{className:"text-info-primary flex-1 truncate text-center text-sm font-bold",children:e?.name})]},`${e?.name}`),b=({data:e,configuration:o})=>i("div",{className:n("tablet:p-3 laptop:p-4 desktop:p-6 lg-desktop:p-8 h-auto","hover:bg-info-white bg-container-secondary-1 group box-border flex-1 shrink-0 cursor-pointer overflow-hidden duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:"transition-all duration-300 group-hover:scale-110",children:t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{className:"laptop:size-[88px] tablet:size-[72px] desktop:size-[116px] lg-desktop:size-[146px] m-auto flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",source:e?.image?.url||e?.image})})}),t("p",{className:"tablet:text-lg text-info-primary text-center text-sm font-bold",children:e?.name})]}),k=({data:e,configuration:o,index:r})=>i("div",{className:n("bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden","hover:bg-info-white cursor-pointer p-4",r===0?"aspect-h-[252] row-span-2":"aspect-h-[120]",o?.shape==="round"?"rounded-2xl":"rounded-none"),children:[t("a",{href:e?.link||"",onClick:()=>o?.event?.primaryButton(e,o?.index),children:t(s,{source:e?.image?.url||e?.image,className:n("mb-2 flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",r===0?"max-h-[146px] overflow-hidden":"max-h-[72px] max-w-[72px]")})}),t("p",{className:"text-info-primary line-clamp-2 text-center text-sm font-bold",children:e?.name})]}),N=({data:e,configuration:o})=>t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,a)=>t(y,{data:r,configuration:o},a))}),w=({data:e,configuration:o})=>i(p,{children:[t("div",{className:"tablet:block hidden",children:t("div",{className:"mx-auto flex w-full gap-4",children:e?.map((r,a)=>t(b,{data:r,configuration:o},a))})}),t("div",{className:"tablet:hidden block",children:t("div",{className:"grid grid-cols-2 gap-3",children:e?.map((r,a)=>t(k,{index:a,data:r,configuration:o},a))})})]}),C=g.forwardRef((e,o)=>{const{data:r,className:a="",key:c,event:d}=e,l=r?.isShowSelect?r?.products:r?.productData,u=l?.length<=5;return i("div",{ref:o,className:n("w-full overflow-hidden",a,{"aiui-dark":r?.theme==="dark"}),children:[r?.title&&t(f,{data:{title:r?.title},className:"text-4xl"}),u?t(w,{data:l,configuration:{shape:r?.shape,event:d}}):i(p,{children:[t("div",{className:"tablet:block hidden",children:t(m,{id:`Category${c}`,Slide:v,data:{list:l,configuration:{shape:r?.shape,event:d}}})}),t("div",{className:"tablet:hidden block",children:t(m,{id:`Category1${c}`,Slide:N,data:{list:h(l,6),configuration:{shape:r?.shape,event:d}}})}),t("div",{className:"h-7"})]})]})});var D=x(C);export{D as default};
 //# sourceMappingURL=index.js.map