npm - @anker-in/headless-ui - Versions diffs - 1.1.9-temp.120303 → 1.1.9-tmp-01 - Mend

@anker-in/headless-ui 1.1.9-temp.120303 → 1.1.9-tmp-01

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

Files changed (1326) hide show

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { FeatureCardsProps } from './types.js';
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<FeatureCardsProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/FeatureCards/FeatureCards.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{Fragment as D,jsx as t,jsxs as l}from"react/jsx-runtime";import g,{useImperativeHandle as F,useRef as T}from"react";import{Heading as u,Picture as v,Text as c}from"../../components/index.js";import{cn as f}from"../../helpers/utils.js";import{withLayout as z}from"../../shared/Styles.js";import{useExposure as H}from"../../hooks/useExposure.js";import{trackUrlRef as R}from"../../shared/trackUrlRef.js";import{Swiper as $,SwiperSlide as S}from"swiper/react";const n="image",x="feature_cards",j=(a,r)=>r===2?a===0?"laptop:flex-[2]":"laptop:flex-[3]":r===3?"laptop:flex-[1]":r===4?a===0?"laptop:flex-[2]":a===1||a===2?"laptop:flex-[3]":"laptop:flex-[2]":r===5?a<3?"laptop:flex-[1]":a===3?"laptop:flex-[2]":"laptop:flex-[3]":"laptop:flex-[1]",L=(a,r)=>r===4&&a===1||r===5&&a===2,b=g.forwardRef(({data:a,className:r},k)=>{const{title:i,subtitle:o,items:p=[],theme:N="light"}=a,d=T(null);H(d,{componentType:n,componentName:x,componentTitle:i,componentDescription:o}),F(k,()=>d.current);const m="rounded-box",w=(e,s)=>{const h=l(D,{children:[t(v,{source:e.image?.url,alt:e.image?.alt||e.title,className:"feature-cards__card-image absolute inset-0 !h-full",imgClassName:"!h-full object-cover"}),l("div",{className:"feature-cards__card-content z-10",children:[t(u,{size:3,as:"h2",className:"feature-cards__card-title laptop:text-[20px] desktop:text-[32px] lg-desktop:text-[32px]",children:e.title}),t(c,{size:4,as:"p",className:"feature-cards__card-subtitle laptop:h-[44px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[40px] text-[14px]",children:e.subtitle})]})]}),y="feature-cards__card relative flex h-[360px] max-h-[560px] flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px] text-info-primary tablet:h-[336px] laptop:h-[336px] laptop:px-[16px] laptop:py-[16px] desktop:h-[448px] desktop:px-[32px] desktop:py-[24px] lg-desktop:h-[560px]",C=s!==void 0?j(s,p.length):"flex-1",_=f(y,m,C,{"aiui-dark":e.theme==="dark","aiui-light":e.theme==="light"});return e.link?t("a",{href:R(e.link,`${n}_${x}`),className:_,"data-headless-type-name":`${n}#${x}`,"data-headless-title-desc-button":`${i}#${e.title}#${e.subtitle}`,children:h}):t("div",{className:_,children:h})};return l("section",{ref:d,"data-ui-component-id":"FeatureCards",className:f("feature-cards text-info-primary flex w-full flex-col justify-center",{"aiui-dark":N==="dark"},r),children:[l("div",{className:"feature-cards__header",children:[t(u,{size:4,as:"h1",className:"feature-cards__title laptop:text-center text-left",children:i}),o&&t(c,{size:2,as:"p",className:"feature-cards__subtitle laptop:text-center desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-left text-[14px]",children:o})]}),t("div",{className:"feature-cards__grid laptop:mt-[32px] laptop:flex desktop:mt-[40px] lg-desktop:mt-[24px] mt-[24px] hidden w-full flex-wrap gap-[16px]",children:p.map((e,s)=>l(g.Fragment,{children:[w(e,s),L(s,p.length)&&t("div",{className:"laptop:basis-full laptop:h-0"})]},e.title))}),t("div",{className:"feature-cards__swiper-container laptop:hidden mt-[24px] w-full",children:t($,{spaceBetween:12,slidesPerView:"auto",grabCursor:!0,className:"feature-cards__swiper relative w-full !overflow-visible",children:p.map(e=>t(S,{className:"feature-cards__swiper-slide relative !h-[360px] !w-[296px]",children:l("div",{className:f("feature-cards__card feature-cards__card--mobile text-info-primary absolute inset-0 flex flex-1 flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px]",m,{"aiui-dark":e.theme==="dark","aiui-light":e.theme==="light"}),children:[t(v,{source:e.image?.url,alt:e.image?.alt||e.title,className:"feature-cards__card-image absolute inset-0 !h-full",imgClassName:"!h-full object-cover"}),l("div",{className:"feature-cards__card-content z-10",children:[t(u,{size:3,as:"h2",className:"feature-cards__card-title",children:e.title}),t(c,{size:4,as:"p",className:"feature-cards__card-subtitle laptop:h-[50px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[40px] overflow-visible text-[14px]",children:e.subtitle})]})]},e.title)},e.title))})})]})});b.displayName="FeatureCards";var q=z(b);export{q as default};
+"use client";import{Fragment as D,jsx as t,jsxs as l}from"react/jsx-runtime";import g,{useImperativeHandle as F,useRef as T}from"react";import{Heading as u,Picture as v,Text as c}from"../../components/index.js";import{cn as f}from"../../helpers/utils.js";import{withLayout as z}from"../../shared/Styles.js";import{useExposure as H}from"../../hooks/useExposure.js";import{trackUrlRef as R}from"../../shared/trackUrlRef.js";import{Swiper as $,SwiperSlide as S}from"swiper/react";const n="image",x="feature_cards",j=(a,r)=>r===2?a===0?"laptop:flex-[2]":"laptop:flex-[3]":r===3?"laptop:flex-[1]":r===4?a===0?"laptop:flex-[2]":a===1||a===2?"laptop:flex-[3]":"laptop:flex-[2]":r===5?a<3?"laptop:flex-[1]":a===3?"laptop:flex-[2]":"laptop:flex-[3]":"laptop:flex-[1]",L=(a,r)=>r===4&&a===1||r===5&&a===2,b=g.forwardRef(({data:a,className:r},k)=>{const{title:o,subtitle:i,items:p=[],theme:N="light"}=a,d=T(null);H(d,{componentType:n,componentName:x,componentTitle:o,componentDescription:i}),F(k,()=>d.current);const m="rounded-box",w=(e,s)=>{const h=l(D,{children:[t(v,{source:e.image?.url,alt:e.image?.alt||e.title,className:"feature-cards__card-image absolute inset-0 !h-full",imgClassName:"!h-full object-cover"}),l("div",{className:"feature-cards__card-content z-10",children:[t(u,{size:3,as:"h2",className:"feature-cards__card-title laptop:text-[20px] desktop:text-[32px] lg-desktop:text-[32px]",children:e.title}),t(c,{size:4,as:"p",className:"feature-cards__card-subtitle laptop:h-[42px] lg-desktop:h-[54px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[42px] text-[14px]",children:e.subtitle})]})]}),y="feature-cards__card relative flex h-[360px] max-h-[560px] flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px] text-info-primary tablet:h-[336px] laptop:h-[336px] laptop:px-[16px] laptop:py-[16px] desktop:h-[448px] desktop:px-[32px] desktop:py-[24px] lg-desktop:h-[560px]",C=s!==void 0?j(s,p.length):"flex-1",_=f(y,m,C,{"aiui-dark":e.theme==="dark","aiui-light":e.theme==="light"});return e.link?t("a",{href:R(e.link,`${n}_${x}`),className:_,"data-headless-type-name":`${n}#${x}`,"data-headless-title-desc-button":`${o}#${e.title}#${e.subtitle}`,children:h}):t("div",{className:_,children:h})};return l("section",{ref:d,"data-ui-component-id":"FeatureCards",className:f("feature-cards text-info-primary flex w-full flex-col justify-center",{"aiui-dark":N==="dark"},r),children:[l("div",{className:"feature-cards__header",children:[t(u,{size:4,as:"h1",className:"feature-cards__title laptop:text-center text-left",children:o}),i&&t(c,{size:2,as:"p",className:"feature-cards__subtitle laptop:text-center desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-left text-[14px]",children:i})]}),t("div",{className:"feature-cards__grid laptop:mt-[32px] laptop:flex desktop:mt-[40px] lg-desktop:mt-[24px] mt-[24px] hidden w-full flex-wrap gap-[16px]",children:p.map((e,s)=>l(g.Fragment,{children:[w(e,s),L(s,p.length)&&t("div",{className:"laptop:basis-full laptop:h-0"})]},e.title))}),t("div",{className:"feature-cards__swiper-container laptop:hidden mt-[24px] w-full",children:t($,{spaceBetween:12,slidesPerView:"auto",grabCursor:!0,className:"feature-cards__swiper relative w-full !overflow-visible",children:p.map(e=>t(S,{className:"feature-cards__swiper-slide relative !h-[360px] !w-[296px]",children:l("div",{className:f("feature-cards__card feature-cards__card--mobile text-info-primary absolute inset-0 flex flex-1 flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px]",m,{"aiui-dark":e.theme==="dark","aiui-light":e.theme==="light"}),children:[t(v,{source:e.image?.url,alt:e.image?.alt||e.title,className:"feature-cards__card-image absolute inset-0 !h-full",imgClassName:"!h-full object-cover"}),l("div",{className:"feature-cards__card-content z-10",children:[t(u,{size:3,as:"h2",className:"feature-cards__card-title",children:e.title}),t(c,{size:4,as:"p",className:"feature-cards__card-subtitle laptop:h-[42px] lg-desktop:h-[54px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[42px] overflow-visible text-[14px]",children:e.subtitle})]})]},e.title)},e.title))})})]})});b.displayName="FeatureCards";var q=z(b,{style:"overflow: hidden;"});export{q as default};
 //# sourceMappingURL=FeatureCards.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/FeatureCards/FeatureCards.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { FeatureCardsProps, FeatureCardItem } from './types.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\n\nconst componentType = 'image'\nconst componentName = 'feature_cards'\n\n/**\n * \u6839\u636E\u5361\u7247\u6570\u91CF\u83B7\u53D6\u684C\u9762\u7AEF\uFF08laptop+\uFF09\u7684\u7F51\u683C\u5E03\u5C40\u7C7B\u540D\n * - 2\u5F20\u5361\u7247: 2:3\n * - 3\u5F20\u5361\u7247: 1:1:1\n * - 4\u5F20\u5361\u7247: \u7B2C\u4E00\u884C 2:3\uFF0C\u7B2C\u4E8C\u884C 3:2\n * - 5\u5F20\u5361\u7247: \u7B2C\u4E00\u884C 1:1:1\uFF0C\u7B2C\u4E8C\u884C 2:3\n */\nconst getCardLayoutClasses = (index: number, totalCards: number): string => {\n  if (totalCards === 2) {\n    // 2:3 \u6BD4\u4F8B\n    return index === 0 ? 'laptop:flex-[2]' : 'laptop:flex-[3]'\n  }\n\n  if (totalCards === 3) {\n    // 1:1:1 \u6BD4\u4F8B\n    return 'laptop:flex-[1]'\n  }\n\n  if (totalCards === 4) {\n    // \u7B2C\u4E00\u884C 2:3\uFF0C\u7B2C\u4E8C\u884C 3:2\n    if (index === 0) return 'laptop:flex-[2]'\n    if (index === 1) return 'laptop:flex-[3]'\n    if (index === 2) return 'laptop:flex-[3]'\n    return 'laptop:flex-[2]'\n  }\n\n  if (totalCards === 5) {\n    // \u7B2C\u4E00\u884C 1:1:1\uFF0C\u7B2C\u4E8C\u884C 2:3\n    if (index < 3) return 'laptop:flex-[1]'\n    if (index === 3) return 'laptop:flex-[2]'\n    return 'laptop:flex-[3]'\n  }\n\n  // \u9ED8\u8BA4\u7B49\u5BBD\n  return 'laptop:flex-[1]'\n}\n\n/**\n * \u6839\u636E\u5361\u7247\u6570\u91CF\u786E\u5B9A\u662F\u5426\u9700\u8981\u6362\u884C\n * - 4\u5F20\u5361\u7247: \u7B2C\u4E00\u884C2\u5F20\uFF0C\u7B2C\u4E8C\u884C2\u5F20\n * - 5\u5F20\u5361\u7247: \u7B2C\u4E00\u884C3\u5F20\uFF0C\u7B2C\u4E8C\u884C2\u5F20\n */\nconst shouldBreakRow = (index: number, totalCards: number): boolean => {\n  if (totalCards === 4 && index === 1) return true\n  if (totalCards === 5 && index === 2) return true\n  return false\n}\n\nconst FeatureCards = React.forwardRef<HTMLDivElement, FeatureCardsProps>(({ data, className }, ref) => {\n  const { title, subtitle, items = [], theme = 'light' } = data\n\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n    componentDescription: subtitle,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  // \u7EDF\u4E00\u4F7F\u7528 rounded-box\n  const roundedClasses = 'rounded-box'\n\n  const renderCard = (item: FeatureCardItem, index?: number) => {\n    const cardContent = (\n      <>\n        <Picture\n          source={item.image?.url}\n          alt={item.image?.alt || item.title}\n          className=\"feature-cards__card-image absolute inset-0 !h-full\"\n          imgClassName=\"!h-full object-cover\"\n        />\n        <div className=\"feature-cards__card-content z-10\">\n          <Heading\n            size={3}\n            as=\"h2\"\n            className=\"feature-cards__card-title laptop:text-[20px] desktop:text-[32px] lg-desktop:text-[32px]\"\n          >\n            {item.title}\n          </Heading>\n          <Text\n            size={4}\n            as=\"p\"\n            className=\"feature-cards__card-subtitle laptop:h-[44px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[40px] text-[14px]\"\n          >\n            {item.subtitle}\n          </Text>\n        </div>\n      </>\n    )\n\n    // \u57FA\u7840\u6837\u5F0F\uFF08\u79FB\u9664\u539F\u6709\u7684 rounded \u7C7B\uFF09\n    const baseClasses =\n      'feature-cards__card relative flex h-[360px] max-h-[560px] flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px] text-info-primary tablet:h-[336px] laptop:h-[336px] laptop:px-[16px] laptop:py-[16px] desktop:h-[448px] desktop:px-[32px] desktop:py-[24px] lg-desktop:h-[560px]'\n\n    // \u83B7\u53D6\u54CD\u5E94\u5F0F\u5E03\u5C40\u7C7B\u540D\uFF08\u4EC5\u7528\u4E8E\u684C\u9762\u7AEF\uFF09\n    const layoutClasses = index !== undefined ? getCardLayoutClasses(index, items.length) : 'flex-1'\n\n    const cardClasses = cn(baseClasses, roundedClasses, layoutClasses, {\n      'aiui-dark': item.theme === 'dark',\n      'aiui-light': item.theme === 'light',\n    })\n\n    if (item.link) {\n      return (\n        <a\n          href={trackUrlRef(item.link, `${componentType}_${componentName}`)}\n          className={cardClasses}\n          data-headless-type-name={`${componentType}#${componentName}`}\n          data-headless-title-desc-button={`${title}#${item.title}#${item.subtitle}`}\n        >\n          {cardContent}\n        </a>\n      )\n    }\n\n    return <div className={cardClasses}>{cardContent}</div>\n  }\n\n  return (\n    <section\n      ref={boxRef}\n      data-ui-component-id=\"FeatureCards\"\n      className={cn(\n        'feature-cards text-info-primary flex w-full flex-col justify-center',\n        {\n          'aiui-dark': theme === 'dark',\n        },\n        className\n      )}\n    >\n      {/* \u6807\u9898\u533A\u57DF */}\n      <div className=\"feature-cards__header\">\n        <Heading size={4} as=\"h1\" className=\"feature-cards__title laptop:text-center text-left\">\n          {title}\n        </Heading>\n        {subtitle && (\n          <Text\n            size={2}\n            as=\"p\"\n            className=\"feature-cards__subtitle laptop:text-center desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-left text-[14px]\"\n          >\n            {subtitle}\n          </Text>\n        )}\n      </div>\n\n      {/* \u684C\u9762\u7AEF\u7F51\u683C\u5E03\u5C40 */}\n      <div className=\"feature-cards__grid laptop:mt-[32px] laptop:flex desktop:mt-[40px] lg-desktop:mt-[24px] mt-[24px] hidden w-full flex-wrap gap-[16px]\">\n        {items.map((item, index) => (\n          <React.Fragment key={item.title}>\n            {renderCard(item, index)}\n            {/* \u5728\u7279\u5B9A\u4F4D\u7F6E\u63D2\u5165\u6362\u884C */}\n            {shouldBreakRow(index, items.length) && <div className=\"laptop:basis-full laptop:h-0\" />}\n          </React.Fragment>\n        ))}\n      </div>\n\n      {/* \u79FB\u52A8\u7AEF Swiper \u5E03\u5C40 */}\n      <div className=\"feature-cards__swiper-container laptop:hidden mt-[24px] w-full\">\n        <Swiper\n          spaceBetween={12}\n          slidesPerView=\"auto\"\n          grabCursor\n          className=\"feature-cards__swiper relative w-full !overflow-visible\"\n        >\n          {items.map(item => (\n            <SwiperSlide key={item.title} className=\"feature-cards__swiper-slide relative !h-[360px] !w-[296px]\">\n              <div\n                key={item.title}\n                className={cn(\n                  'feature-cards__card feature-cards__card--mobile text-info-primary absolute inset-0 flex flex-1 flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px]',\n                  roundedClasses,\n                  {\n                    'aiui-dark': item.theme === 'dark',\n                    'aiui-light': item.theme === 'light',\n                  }\n                )}\n              >\n                <Picture\n                  source={item.image?.url}\n                  alt={item.image?.alt || item.title}\n                  className=\"feature-cards__card-image absolute inset-0 !h-full\"\n                  imgClassName=\"!h-full object-cover\"\n                />\n                <div className=\"feature-cards__card-content z-10\">\n                  <Heading size={3} as=\"h2\" className=\"feature-cards__card-title\">\n                    {item.title}\n                  </Heading>\n                  <Text\n                    size={4}\n                    as=\"p\"\n                    className=\"feature-cards__card-subtitle laptop:h-[50px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[40px] overflow-visible text-[14px]\"\n                  >\n                    {item.subtitle}\n                  </Text>\n                </div>\n              </div>\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n    </section>\n  )\n})\n\nFeatureCards.displayName = 'FeatureCards'\n\nexport default withLayout(FeatureCards)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { FeatureCardsProps, FeatureCardItem } from './types.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\n\nconst componentType = 'image'\nconst componentName = 'feature_cards'\n\n/**\n * \u6839\u636E\u5361\u7247\u6570\u91CF\u83B7\u53D6\u684C\u9762\u7AEF\uFF08laptop+\uFF09\u7684\u7F51\u683C\u5E03\u5C40\u7C7B\u540D\n * - 2\u5F20\u5361\u7247: 2:3\n * - 3\u5F20\u5361\u7247: 1:1:1\n * - 4\u5F20\u5361\u7247: \u7B2C\u4E00\u884C 2:3\uFF0C\u7B2C\u4E8C\u884C 3:2\n * - 5\u5F20\u5361\u7247: \u7B2C\u4E00\u884C 1:1:1\uFF0C\u7B2C\u4E8C\u884C 2:3\n */\nconst getCardLayoutClasses = (index: number, totalCards: number): string => {\n  if (totalCards === 2) {\n    // 2:3 \u6BD4\u4F8B\n    return index === 0 ? 'laptop:flex-[2]' : 'laptop:flex-[3]'\n  }\n\n  if (totalCards === 3) {\n    // 1:1:1 \u6BD4\u4F8B\n    return 'laptop:flex-[1]'\n  }\n\n  if (totalCards === 4) {\n    // \u7B2C\u4E00\u884C 2:3\uFF0C\u7B2C\u4E8C\u884C 3:2\n    if (index === 0) return 'laptop:flex-[2]'\n    if (index === 1) return 'laptop:flex-[3]'\n    if (index === 2) return 'laptop:flex-[3]'\n    return 'laptop:flex-[2]'\n  }\n\n  if (totalCards === 5) {\n    // \u7B2C\u4E00\u884C 1:1:1\uFF0C\u7B2C\u4E8C\u884C 2:3\n    if (index < 3) return 'laptop:flex-[1]'\n    if (index === 3) return 'laptop:flex-[2]'\n    return 'laptop:flex-[3]'\n  }\n\n  // \u9ED8\u8BA4\u7B49\u5BBD\n  return 'laptop:flex-[1]'\n}\n\n/**\n * \u6839\u636E\u5361\u7247\u6570\u91CF\u786E\u5B9A\u662F\u5426\u9700\u8981\u6362\u884C\n * - 4\u5F20\u5361\u7247: \u7B2C\u4E00\u884C2\u5F20\uFF0C\u7B2C\u4E8C\u884C2\u5F20\n * - 5\u5F20\u5361\u7247: \u7B2C\u4E00\u884C3\u5F20\uFF0C\u7B2C\u4E8C\u884C2\u5F20\n */\nconst shouldBreakRow = (index: number, totalCards: number): boolean => {\n  if (totalCards === 4 && index === 1) return true\n  if (totalCards === 5 && index === 2) return true\n  return false\n}\n\nconst FeatureCards = React.forwardRef<HTMLDivElement, FeatureCardsProps>(({ data, className }, ref) => {\n  const { title, subtitle, items = [], theme = 'light' } = data\n\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n    componentDescription: subtitle,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  // \u7EDF\u4E00\u4F7F\u7528 rounded-box\n  const roundedClasses = 'rounded-box'\n\n  const renderCard = (item: FeatureCardItem, index?: number) => {\n    const cardContent = (\n      <>\n        <Picture\n          source={item.image?.url}\n          alt={item.image?.alt || item.title}\n          className=\"feature-cards__card-image absolute inset-0 !h-full\"\n          imgClassName=\"!h-full object-cover\"\n        />\n        <div className=\"feature-cards__card-content z-10\">\n          <Heading\n            size={3}\n            as=\"h2\"\n            className=\"feature-cards__card-title laptop:text-[20px] desktop:text-[32px] lg-desktop:text-[32px]\"\n          >\n            {item.title}\n          </Heading>\n          <Text\n            size={4}\n            as=\"p\"\n            className=\"feature-cards__card-subtitle laptop:h-[42px] lg-desktop:h-[54px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[42px] text-[14px]\"\n          >\n            {item.subtitle}\n          </Text>\n        </div>\n      </>\n    )\n\n    // \u57FA\u7840\u6837\u5F0F\uFF08\u79FB\u9664\u539F\u6709\u7684 rounded \u7C7B\uFF09\n    const baseClasses =\n      'feature-cards__card relative flex h-[360px] max-h-[560px] flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px] text-info-primary tablet:h-[336px] laptop:h-[336px] laptop:px-[16px] laptop:py-[16px] desktop:h-[448px] desktop:px-[32px] desktop:py-[24px] lg-desktop:h-[560px]'\n\n    // \u83B7\u53D6\u54CD\u5E94\u5F0F\u5E03\u5C40\u7C7B\u540D\uFF08\u4EC5\u7528\u4E8E\u684C\u9762\u7AEF\uFF09\n    const layoutClasses = index !== undefined ? getCardLayoutClasses(index, items.length) : 'flex-1'\n\n    const cardClasses = cn(baseClasses, roundedClasses, layoutClasses, {\n      'aiui-dark': item.theme === 'dark',\n      'aiui-light': item.theme === 'light',\n    })\n\n    if (item.link) {\n      return (\n        <a\n          href={trackUrlRef(item.link, `${componentType}_${componentName}`)}\n          className={cardClasses}\n          data-headless-type-name={`${componentType}#${componentName}`}\n          data-headless-title-desc-button={`${title}#${item.title}#${item.subtitle}`}\n        >\n          {cardContent}\n        </a>\n      )\n    }\n\n    return <div className={cardClasses}>{cardContent}</div>\n  }\n\n  return (\n    <section\n      ref={boxRef}\n      data-ui-component-id=\"FeatureCards\"\n      className={cn(\n        'feature-cards text-info-primary flex w-full flex-col justify-center',\n        {\n          'aiui-dark': theme === 'dark',\n        },\n        className\n      )}\n    >\n      {/* \u6807\u9898\u533A\u57DF */}\n      <div className=\"feature-cards__header\">\n        <Heading size={4} as=\"h1\" className=\"feature-cards__title laptop:text-center text-left\">\n          {title}\n        </Heading>\n        {subtitle && (\n          <Text\n            size={2}\n            as=\"p\"\n            className=\"feature-cards__subtitle laptop:text-center desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-left text-[14px]\"\n          >\n            {subtitle}\n          </Text>\n        )}\n      </div>\n\n      {/* \u684C\u9762\u7AEF\u7F51\u683C\u5E03\u5C40 */}\n      <div className=\"feature-cards__grid laptop:mt-[32px] laptop:flex desktop:mt-[40px] lg-desktop:mt-[24px] mt-[24px] hidden w-full flex-wrap gap-[16px]\">\n        {items.map((item, index) => (\n          <React.Fragment key={item.title}>\n            {renderCard(item, index)}\n            {/* \u5728\u7279\u5B9A\u4F4D\u7F6E\u63D2\u5165\u6362\u884C */}\n            {shouldBreakRow(index, items.length) && <div className=\"laptop:basis-full laptop:h-0\" />}\n          </React.Fragment>\n        ))}\n      </div>\n\n      {/* \u79FB\u52A8\u7AEF Swiper \u5E03\u5C40 */}\n      <div className=\"feature-cards__swiper-container laptop:hidden mt-[24px] w-full\">\n        <Swiper\n          spaceBetween={12}\n          slidesPerView=\"auto\"\n          grabCursor\n          className=\"feature-cards__swiper relative w-full !overflow-visible\"\n        >\n          {items.map(item => (\n            <SwiperSlide key={item.title} className=\"feature-cards__swiper-slide relative !h-[360px] !w-[296px]\">\n              <div\n                key={item.title}\n                className={cn(\n                  'feature-cards__card feature-cards__card--mobile text-info-primary absolute inset-0 flex flex-1 flex-col justify-end gap-[16px] overflow-hidden px-[16px] py-[12px]',\n                  roundedClasses,\n                  {\n                    'aiui-dark': item.theme === 'dark',\n                    'aiui-light': item.theme === 'light',\n                  }\n                )}\n              >\n                <Picture\n                  source={item.image?.url}\n                  alt={item.image?.alt || item.title}\n                  className=\"feature-cards__card-image absolute inset-0 !h-full\"\n                  imgClassName=\"!h-full object-cover\"\n                />\n                <div className=\"feature-cards__card-content z-10\">\n                  <Heading size={3} as=\"h2\" className=\"feature-cards__card-title\">\n                    {item.title}\n                  </Heading>\n                  <Text\n                    size={4}\n                    as=\"p\"\n                    className=\"feature-cards__card-subtitle laptop:h-[42px] lg-desktop:h-[54px] lg-desktop:text-[18px] mt-[4px] line-clamp-2 h-[42px] overflow-visible text-[14px]\"\n                  >\n                    {item.subtitle}\n                  </Text>\n                </div>\n              </div>\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n    </section>\n  )\n})\n\nFeatureCards.displayName = 'FeatureCards'\n\nexport default withLayout(FeatureCards, { style: 'overflow: hidden;' })\n"],
+  "mappings": "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",
   "names": ["Fragment", "jsx", "jsxs", "React", "useImperativeHandle", "useRef", "Heading", "Picture", "Text", "cn", "withLayout", "useExposure", "trackUrlRef", "Swiper", "SwiperSlide", "componentType", "componentName", "getCardLayoutClasses", "index", "totalCards", "shouldBreakRow", "FeatureCards", "data", "className", "ref", "title", "subtitle", "items", "theme", "boxRef", "roundedClasses", "renderCard", "item", "cardContent", "baseClasses", "layoutClasses", "cardClasses", "FeatureCards_default"]
 }

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { FeatureShowcaseProps } from './types.js';
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<FeatureShowcaseProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Img } from '../../types/props.js';
 export type FeaturesDataType = {
     img: Img;
@@ -21,7 +20,7 @@ type FeaturesType = {
     className?: string;
 };
 declare const _default: import("react").ForwardRefExoticComponent<Omit<FeaturesType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 } & import("react").RefAttributes<any>>;
 export default _default;

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

@@ -1,2 +1,2 @@
-"use client";import{Fragment as b,jsx as e,jsxs as o}from"react/jsx-runtime";import"../../helpers/utils.js";import"../SwiperBox/index.js";import{useExposure as d}from"../../hooks/useExposure.js";import{withLayout as m}from"../../shared/Styles.js";import{Picture as s,Text as l}from"../../components/index.js";import{useRef as x}from"react";const c="image",g="features",u=({index:p,item:t})=>{const a=x(null);return d(a,{componentType:c,componentName:g,position:p+1,componentTitle:t.title,componentDescription:t.description}),o("div",{className:`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${p%2===0?"laptop:flex-row-reverse":""}`,ref:a,children:[o("div",{className:"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center",children:[e(l,{html:t?.title,className:"graphic-title desktop:text-base desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold"}),e(l,{html:t?.description,className:"graphic-title desktop:pt-[8px] lg-desktop:text-lg desktop:text-base lg-desktop:text-[18px] desktop:text-[16px] pt-[4px] text-[14px] leading-[1.2] [&_*_strong]:!font-bold"}),t?.numberOne&&o("div",{className:"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]",children:[o("div",{className:"",children:[e(l,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:t?.numberOne,className:"graphic-title desktop:text-base desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),e(l,{html:t?.textOne,className:"graphic-title lg-desktop:text-lg desktop:text-base desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]}),o("div",{children:[e(l,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:t?.numberTwo,className:"graphic-title desktop:text-base desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),e(l,{html:t?.textTwo,className:"graphic-title lg-desktop:text-lg desktop:text-base desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]})]}),t?.icon?.url&&e("div",{className:"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]",children:e(s,{className:"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]",source:t?.icon?.url,alt:t?.icon?.alt||""})})]}),e("div",{className:"md-tablet:hidden laptop:pt-[32px] desktop:pt-0 aspect-[964/560] overflow-hidden rounded-2xl pt-[24px]",children:e(s,{className:"size-full object-cover ",source:t?.img?.url,alt:t?.img?.alt||""})}),e("div",{className:"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl",children:e(s,{className:"size-full object-cover",source:t?.mobileImg?.url,alt:t?.mobileImg?.alt||""})})]})},k=p=>{const{data:t,className:a}=p,{list:n}=t;return e(b,{children:o("div",{className:"",children:[t?.title&&e("div",{className:"desktop:w-[800px] pb-[24px]",children:e(l,{html:t?.title,className:" desktop:!text-[32px] lg-desktop:text-lg desktop:text-base line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold"})}),t?.img?.url&&e(s,{className:"md-tablet:hidden aspect-[1664/560] rounded-2xl",imgClassName:"",source:t?.img?.url,alt:t?.img?.alt||""}),t?.mobileImg?.url&&e(s,{className:"tablet:hidden aspect-[358/360] rounded-2xl",imgClassName:"",source:t?.mobileImg?.url,alt:t?.mobileImg?.alt||""}),e("div",{className:"flex flex-col gap-4",children:n.map((r,i)=>e(u,{index:i,item:r},i))})]})})};var _=m(k);export{_ as default};
+"use client";import{Fragment as x,jsx as t,jsxs as p}from"react/jsx-runtime";import"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as d}from"../../shared/Styles.js";import{Picture as s,Text as a}from"../../components/index.js";const n=i=>{const{data:l,className:g}=i,{list:r}=l;return t(x,{children:p("div",{className:"",children:[l?.title&&t("div",{className:"desktop:w-[800px] pb-[24px]",children:t(a,{html:l?.title,className:" desktop:!text-[32px] lg-desktop:text-lg line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold"})}),l?.img?.url&&t(s,{className:"md-tablet:hidden aspect-[1664/560] rounded-2xl",imgClassName:"",source:l?.img?.url,alt:l?.img?.alt||""}),l?.mobileImg?.url&&t(s,{className:"tablet:hidden aspect-[358/360] rounded-2xl",imgClassName:"",source:l?.mobileImg?.url,alt:l?.mobileImg?.alt||""}),t("div",{className:"",children:t("div",{className:"flex flex-col gap-4",children:r.map((e,o)=>p("div",{className:`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${o%2===0?"laptop:flex-row-reverse":""}`,children:[p("div",{className:"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center",children:[t(a,{html:e?.title,className:"graphic-title  desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold"}),t(a,{html:e?.description,className:"graphic-title desktop:pt-[8px] lg-desktop:text-[18px] desktop:text-[16px] pt-[4px] text-[14px] leading-[1.2] [&_*_strong]:!font-bold"}),e?.numberOne&&p("div",{className:"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]",children:[p("div",{className:"",children:[t(a,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:e?.numberOne,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),t(a,{html:e?.textOne,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]}),p("div",{children:[t(a,{style:{background:"var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))",backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent"},html:e?.numberTwo,className:"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold"}),t(a,{html:e?.textTwo,className:"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold"})]})]}),e?.icon?.url&&t("div",{className:"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]",children:t(s,{className:"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]",source:e?.icon?.url,alt:e?.icon?.alt||""})})]}),t("div",{className:"md-tablet:hidden laptop:pt-[32px] desktop:pt-0 aspect-[964/560] overflow-hidden rounded-2xl pt-[24px]",children:t(s,{className:"size-full object-cover ",source:e?.img?.url,alt:e?.img?.alt||""})}),t("div",{className:"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl",children:t(s,{className:"size-full object-cover",source:e?.mobileImg?.url,alt:e?.mobileImg?.alt||""})})]},o))})})]})})};var f=d(n);export{f as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Features/index.tsx"],
-  "sourcesContent": ["/* eslint-disable tailwindcss/no-contradicting-classname */\n'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { useRef } from 'react'\n\nexport type FeaturesDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  numberOne: string\n  textOne: string\n  numberTwo: string\n  textTwo: string\n  icon: Img\n}\ntype FeaturesType = {\n  data: {\n    title: string\n    img: Img\n    mobileImg: Img\n    list: FeaturesDataType[]\n  }\n  className?: string\n}\n\nconst componentType = 'image'\nconst componentName = 'features'\n\nconst Item = ({ index, item }: { index: number; item: FeaturesDataType }) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType: componentType,\n    componentName: componentName,\n    position: index + 1,\n    componentTitle: item.title,\n    componentDescription: item.description,\n  })\n\n  return (\n    <div\n      className={`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${index % 2 === 0 ? 'laptop:flex-row-reverse' : ''}`}\n      ref={ref}\n    >\n      <div className=\"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center\">\n        <Text\n          html={item?.title}\n          className=\"graphic-title desktop:text-base desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold\"\n        />\n        <Text\n          html={item?.description}\n          className=\"graphic-title desktop:pt-[8px] lg-desktop:text-lg desktop:text-base lg-desktop:text-[18px] desktop:text-[16px] pt-[4px] text-[14px] leading-[1.2] [&_*_strong]:!font-bold\"\n        />\n        {/* \u6E10\u53D8\u8272 */}\n        {item?.numberOne && (\n          <div className=\"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]\">\n            <div className=\"\">\n              <Text\n                style={{\n                  background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n                  backgroundClip: 'text',\n                  WebkitBackgroundClip: 'text',\n                  WebkitTextFillColor: 'transparent',\n                  color: 'transparent', // \u5EFA\u8BAE\u52A0\u4E0A\uFF0C\u517C\u5BB9\u90E8\u5206\u6D4F\u89C8\u5668\n                }}\n                html={item?.numberOne}\n                className=\"graphic-title desktop:text-base desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold\"\n              />\n              <Text\n                html={item?.textOne}\n                className=\"graphic-title lg-desktop:text-lg desktop:text-base desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold\"\n              />\n            </div>\n            <div>\n              <Text\n                style={{\n                  background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n                  backgroundClip: 'text',\n                  WebkitBackgroundClip: 'text',\n                  WebkitTextFillColor: 'transparent',\n                  color: 'transparent', // \u5EFA\u8BAE\u52A0\u4E0A\uFF0C\u517C\u5BB9\u90E8\u5206\u6D4F\u89C8\u5668\n                }}\n                html={item?.numberTwo}\n                className=\"graphic-title desktop:text-base desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold\"\n              />\n              <Text\n                html={item?.textTwo}\n                className=\"graphic-title lg-desktop:text-lg desktop:text-base desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold\"\n              />\n            </div>\n          </div>\n        )}\n        {item?.icon?.url && (\n          <div className=\"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]\">\n            <Picture\n              className=\"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]\"\n              source={item?.icon?.url}\n              alt={item?.icon?.alt || ''}\n            />\n          </div>\n        )}\n      </div>\n      <div className=\"md-tablet:hidden laptop:pt-[32px] desktop:pt-0 aspect-[964/560] overflow-hidden rounded-2xl pt-[24px]\">\n        <Picture className=\"size-full object-cover \" source={item?.img?.url} alt={item?.img?.alt || ''} />\n      </div>\n      <div className=\"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl\">\n        <Picture className=\"size-full object-cover\" source={item?.mobileImg?.url} alt={item?.mobileImg?.alt || ''} />\n      </div>\n    </div>\n  )\n}\n\nconst Features = (props: FeaturesType) => {\n  const { data, className } = props\n  const { list } = data\n\n  return (\n    <>\n      <div className=\"\">\n        {data?.title && (\n          <div className=\"desktop:w-[800px] pb-[24px]\">\n            <Text\n              html={data?.title}\n              className=\" desktop:!text-[32px] lg-desktop:text-lg desktop:text-base line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold\"\n            />\n          </div>\n        )}\n        {data?.img?.url && (\n          <Picture\n            className=\"md-tablet:hidden aspect-[1664/560] rounded-2xl\"\n            imgClassName=\"\"\n            source={data?.img?.url}\n            alt={data?.img?.alt || ''}\n          />\n        )}\n        {data?.mobileImg?.url && (\n          <Picture\n            className=\"tablet:hidden aspect-[358/360] rounded-2xl\"\n            imgClassName=\"\"\n            source={data?.mobileImg?.url}\n            alt={data?.mobileImg?.alt || ''}\n          />\n        )}\n        <div className=\"flex flex-col gap-4\">\n          {list.map((item, index) => (\n            <Item key={index} index={index} item={item} />\n          ))}\n        </div>\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(Features)\n"],
-  "mappings": "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",
-  "names": ["Fragment", "jsx", "jsxs", "useExposure", "withLayout", "Picture", "Text", "useRef", "componentType", "componentName", "Item", "index", "item", "ref", "Features", "props", "data", "className", "list", "Features_default"]
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nexport type FeaturesDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  numberOne: string\n  textOne: string\n  numberTwo: string\n  textTwo: string\n  icon: Img\n}\ntype FeaturesType = {\n  data: {\n    title: string\n    img: Img\n    mobileImg: Img\n    list: FeaturesDataType[]\n  }\n  className?: string\n}\n\nconst Features = (props: FeaturesType) => {\n  const { data, className } = props\n  const { list } = data\n\n  return (\n    <>\n      <div className=\"\">\n        {data?.title && (\n          <div className=\"desktop:w-[800px] pb-[24px]\">\n            <Text\n              html={data?.title}\n              className=\" desktop:!text-[32px] lg-desktop:text-lg line-clamp-3 !text-[24px] !leading-[1.2] [&_*_strong]:!font-bold\"\n            />\n          </div>\n        )}\n        {data?.img?.url && (\n          <Picture\n            className=\"md-tablet:hidden aspect-[1664/560] rounded-2xl\"\n            imgClassName=\"\"\n            source={data?.img?.url}\n            alt={data?.img?.alt || ''}\n          />\n        )}\n        {data?.mobileImg?.url && (\n          <Picture\n            className=\"tablet:hidden aspect-[358/360] rounded-2xl\"\n            imgClassName=\"\"\n            source={data?.mobileImg?.url}\n            alt={data?.mobileImg?.alt || ''}\n          />\n        )}\n        <div className=\"\">\n          <div className=\"flex flex-col gap-4\">\n            {list.map((item, index) => (\n              <div\n                key={index}\n                className={`desktop:flex tablet:gap-8 laptop:gap-[64px] gap-4 pt-[64px] ${index % 2 === 0 ? 'laptop:flex-row-reverse' : ''}`}\n              >\n                <div className=\"desktop:w-[500px] lg-desktop:w-[640px] flex shrink-0 flex-col justify-center\">\n                  <Text\n                    html={item?.title}\n                    className=\"graphic-title  desktop:text-[32px] line-clamp-3 text-[24px] leading-[1.2] [&_*_strong]:!font-bold\"\n                  />\n                  <Text\n                    html={item?.description}\n                    className=\"graphic-title desktop:pt-[8px] lg-desktop:text-[18px] desktop:text-[16px] pt-[4px] text-[14px] leading-[1.2] [&_*_strong]:!font-bold\"\n                  />\n                  {/* \u6E10\u53D8\u8272 */}\n                  {item?.numberOne && (\n                    <div className=\"desktop:pt-[48px] desktop:flex-col desktop:gap-[48px] flex flex-row gap-[24px] pt-[24px]\">\n                      <div className=\"\">\n                        <Text\n                          style={{\n                            background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n                            backgroundClip: 'text',\n                            WebkitBackgroundClip: 'text',\n                            WebkitTextFillColor: 'transparent',\n                            color: 'transparent', // \u5EFA\u8BAE\u52A0\u4E0A\uFF0C\u517C\u5BB9\u90E8\u5206\u6D4F\u89C8\u5668\n                          }}\n                          html={item?.numberOne}\n                          className=\"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold\"\n                        />\n                        <Text\n                          html={item?.textOne}\n                          className=\"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold\"\n                        />\n                      </div>\n                      <div>\n                        <Text\n                          style={{\n                            background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n                            backgroundClip: 'text',\n                            WebkitBackgroundClip: 'text',\n                            WebkitTextFillColor: 'transparent',\n                            color: 'transparent', // \u5EFA\u8BAE\u52A0\u4E0A\uFF0C\u517C\u5BB9\u90E8\u5206\u6D4F\u89C8\u5668\n                          }}\n                          html={item?.numberTwo}\n                          className=\"graphic-title desktop:text-[64px] line-clamp-3 text-[40px] leading-none [&_*_strong]:!font-bold\"\n                        />\n                        <Text\n                          html={item?.textTwo}\n                          className=\"graphic-title lg-desktop:text-lg desktop:text-[18px] line-clamp-3 text-[14px] leading-[1.4] [&_*_strong]:!font-bold\"\n                        />\n                      </div>\n                    </div>\n                  )}\n                  {item?.icon?.url && (\n                    <div className=\"desktop:pt-[24px] lg-desktop:pt-[48px] pt-[24px]\">\n                      <Picture\n                        className=\"desktop:w-[368px] lg-desktop:w-[488px] w-[358px]\"\n                        source={item?.icon?.url}\n                        alt={item?.icon?.alt || ''}\n                      />\n                    </div>\n                  )}\n                </div>\n                <div className=\"md-tablet:hidden laptop:pt-[32px] desktop:pt-0 aspect-[964/560] overflow-hidden rounded-2xl pt-[24px]\">\n                  <Picture className=\"size-full object-cover \" source={item?.img?.url} alt={item?.img?.alt || ''} />\n                </div>\n                <div className=\"tablet:hidden mt-[24px] aspect-[358/360] overflow-hidden rounded-2xl\">\n                  <Picture\n                    className=\"size-full object-cover\"\n                    source={item?.mobileImg?.url}\n                    alt={item?.mobileImg?.alt || ''}\n                  />\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(Features)\n"],
+  "mappings": "aAgCI,mBAAAA,EAIQ,OAAAC,EAyCU,QAAAC,MA7ClB,oBA/BJ,MAAmB,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAsB9B,MAAMC,EAAYC,GAAwB,CACxC,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,OACEP,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,UAAU,GACZ,UAAAM,GAAM,OACLP,EAAC,OAAI,UAAU,8BACb,SAAAA,EAACI,EAAA,CACC,KAAMG,GAAM,MACZ,UAAU,4GACZ,EACF,EAEDA,GAAM,KAAK,KACVP,EAACG,EAAA,CACC,UAAU,iDACV,aAAa,GACb,OAAQI,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,KAChBP,EAACG,EAAA,CACC,UAAU,6CACV,aAAa,GACb,OAAQI,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,EAEFP,EAAC,OAAI,UAAU,GACb,SAAAA,EAAC,OAAI,UAAU,sBACZ,SAAAS,EAAK,IAAI,CAACC,EAAMC,IACfV,EAAC,OAEC,UAAW,+DAA+DU,EAAQ,IAAM,EAAI,0BAA4B,EAAE,GAE1H,UAAAV,EAAC,OAAI,UAAU,+EACb,UAAAD,EAACI,EAAA,CACC,KAAMM,GAAM,MACZ,UAAU,oGACZ,EACAV,EAACI,EAAA,CACC,KAAMM,GAAM,YACZ,UAAU,uIACZ,EAECA,GAAM,WACLT,EAAC,OAAI,UAAU,2FACb,UAAAA,EAAC,OAAI,UAAU,GACb,UAAAD,EAACI,EAAA,CACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMM,GAAM,UACZ,UAAU,kGACZ,EACAV,EAACI,EAAA,CACC,KAAMM,GAAM,QACZ,UAAU,sHACZ,GACF,EACAT,EAAC,OACC,UAAAD,EAACI,EAAA,CACC,MAAO,CACL,WAAY,6DACZ,eAAgB,OAChB,qBAAsB,OACtB,oBAAqB,cACrB,MAAO,aACT,EACA,KAAMM,GAAM,UACZ,UAAU,kGACZ,EACAV,EAACI,EAAA,CACC,KAAMM,GAAM,QACZ,UAAU,sHACZ,GACF,GACF,EAEDA,GAAM,MAAM,KACXV,EAAC,OAAI,UAAU,mDACb,SAAAA,EAACG,EAAA,CACC,UAAU,mDACV,OAAQO,GAAM,MAAM,IACpB,IAAKA,GAAM,MAAM,KAAO,GAC1B,EACF,GAEJ,EACAV,EAAC,OAAI,UAAU,wGACb,SAAAA,EAACG,EAAA,CAAQ,UAAU,0BAA0B,OAAQO,GAAM,KAAK,IAAK,IAAKA,GAAM,KAAK,KAAO,GAAI,EAClG,EACAV,EAAC,OAAI,UAAU,uEACb,SAAAA,EAACG,EAAA,CACC,UAAU,yBACV,OAAQO,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,EACF,IAtEKC,CAuEP,CACD,EACH,EACF,GACF,EACF,CAEJ,EAEA,IAAOC,EAAQV,EAAWG,CAAQ",
+  "names": ["Fragment", "jsx", "jsxs", "withLayout", "Picture", "Text", "Features", "props", "data", "className", "list", "item", "index", "Features_default"]
 }

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type FootChargerType = {
     data: {
         title: string;
@@ -7,7 +6,7 @@ type FootChargerType = {
     className?: string;
 };
 declare const _default: import("react").ForwardRefExoticComponent<Omit<FootChargerType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 } & import("react").RefAttributes<any>>;
 export default _default;

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

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

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Img } from '../../types/props.js';
 export type GiftBoxDataType = {
     img: Img;
@@ -12,7 +11,7 @@ type GiftBoxType = {
     className?: string;
 };
 declare const _default: import("react").ForwardRefExoticComponent<Omit<GiftBoxType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 } & import("react").RefAttributes<any>>;
 export default _default;

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

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as r}from"../../shared/Styles.js";import{Picture as p,Text as c}from"../../components/index.js";import{useExposure as n}from"../../hooks/useExposure.js";import{useRef as g}from"react";const d="image",f="gift_box",x=({index:o,item:t})=>{const l=g(null);return n(l,{componentType:d,componentName:f,position:o+1,componentTitle:t.title}),a("div",{className:"laptop:p-[20px] flex flex-col items-center justify-center p-[12px]",children:[a("div",{children:[t?.img?.url&&e(p,{className:"l-tablet:hidden aspect-[194/194]",imgClassName:"",source:t?.img?.url,alt:t?.img?.alt||""}),t?.mobileImg?.url&&e(p,{className:"laptop:hidden aspect-[120/120]",imgClassName:"",source:t?.mobileImg?.url,alt:t?.mobileImg?.alt||""})]}),e(c,{html:t?.title,className:"laptop:text-[18px] text-[14px] font-bold leading-[1.4]"})]},o)},u=o=>{const{data:t,className:l}=o,{list:s}=t;return e("div",{className:"w-full rounded-2xl bg-[#EAEAEC]",children:e("div",{className:"laptop:gap-4 tablet:grid-cols-4 laptop:grid-cols-3 desktop:grid-cols-5 lg-desktop:grid-cols-6 grid grid-cols-2 gap-3",children:s.map((m,i)=>e(x,{index:i,item:m},i))})})};var E=r(u);export{E as default};
+"use client";import{jsx as l,jsxs as a}from"react/jsx-runtime";import"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as m}from"../../shared/Styles.js";import{Picture as e,Text as r}from"../../components/index.js";const d=o=>{const{data:s,className:g}=o,{list:i}=s;return l("div",{className:"w-full rounded-2xl bg-[#EAEAEC]",children:l("div",{className:"laptop:gap-4 tablet:grid-cols-4 laptop:grid-cols-3 desktop:grid-cols-5 lg-desktop:grid-cols-6 grid grid-cols-2 gap-3",children:i.map((t,p)=>a("div",{className:"laptop:p-[20px] flex flex-col items-center justify-center p-[12px]",children:[a("div",{children:[t?.img?.url&&l(e,{className:"l-tablet:hidden aspect-[194/194]",imgClassName:"",source:t?.img?.url,alt:t?.img?.alt||""}),t?.mobileImg?.url&&l(e,{className:"laptop:hidden aspect-[120/120]",imgClassName:"",source:t?.mobileImg?.url,alt:t?.mobileImg?.alt||""})]}),l(r,{html:t?.title,className:"laptop:text-[18px] text-[14px] font-bold leading-[1.4]"})]},p))})})};var N=m(d);export{N as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/GiftBox/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef } from 'react'\n\nexport type GiftBoxDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n}\n\ntype GiftBoxType = {\n  data: {\n    list: GiftBoxDataType[]\n  }\n  className?: string\n}\n\nconst componentType = 'image'\nconst componentName = 'gift_box'\n\nconst Item = ({ index, item }: { index: number; item: GiftBoxDataType }) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType: componentType,\n    componentName: componentName,\n    position: index + 1,\n    componentTitle: item.title,\n  })\n  return (\n    <div key={index} className=\"laptop:p-[20px] flex flex-col items-center justify-center p-[12px]\">\n      <div>\n        {item?.img?.url && (\n          <Picture\n            className=\"l-tablet:hidden aspect-[194/194]\"\n            imgClassName=\"\"\n            source={item?.img?.url}\n            alt={item?.img?.alt || ''}\n          />\n        )}\n        {item?.mobileImg?.url && (\n          <Picture\n            className=\"laptop:hidden aspect-[120/120]\"\n            imgClassName=\"\"\n            source={item?.mobileImg?.url}\n            alt={item?.mobileImg?.alt || ''}\n          />\n        )}\n      </div>\n      <Text html={item?.title} className=\"laptop:text-[18px] text-[14px] font-bold leading-[1.4]\" />\n    </div>\n  )\n}\n\nconst GiftBox = (props: GiftBoxType) => {\n  const { data, className } = props\n  const { list } = data\n\n  return (\n    <div className=\"w-full rounded-2xl bg-[#EAEAEC]\">\n      <div className=\"laptop:gap-4 tablet:grid-cols-4 laptop:grid-cols-3 desktop:grid-cols-5 lg-desktop:grid-cols-6 grid grid-cols-2 gap-3\">\n        {list.map((item, index) => (\n          <Item key={index} index={index} item={item} />\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(GiftBox)\n"],
-  "mappings": "aAoCM,OAEI,OAAAA,EAFJ,QAAAC,MAAA,oBAnCN,MAAmB,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC9B,OAAS,eAAAC,MAAmB,6BAC5B,OAAS,UAAAC,MAAc,QAevB,MAAMC,EAAgB,QAChBC,EAAgB,WAEhBC,EAAO,CAAC,CAAE,MAAAC,EAAO,KAAAC,CAAK,IAAgD,CAC1E,MAAMC,EAAMN,EAAuB,IAAI,EAEvC,OAAAD,EAAYO,EAAK,CACf,cAAeL,EACf,cAAeC,EACf,SAAUE,EAAQ,EAClB,eAAgBC,EAAK,KACvB,CAAC,EAECV,EAAC,OAAgB,UAAU,qEACzB,UAAAA,EAAC,OACE,UAAAU,GAAM,KAAK,KACVX,EAACG,EAAA,CACC,UAAU,mCACV,aAAa,GACb,OAAQQ,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,KAChBX,EAACG,EAAA,CACC,UAAU,iCACV,aAAa,GACb,OAAQQ,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,GAEJ,EACAX,EAACI,EAAA,CAAK,KAAMO,GAAM,MAAO,UAAU,yDAAyD,IAnBpFD,CAoBV,CAEJ,EAEMG,EAAWC,GAAuB,CACtC,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,OACEf,EAAC,OAAI,UAAU,kCACb,SAAAA,EAAC,OAAI,UAAU,uHACZ,SAAAiB,EAAK,IAAI,CAACN,EAAMD,IACfV,EAACS,EAAA,CAAiB,MAAOC,EAAO,KAAMC,GAA3BD,CAAiC,CAC7C,EACH,EACF,CAEJ,EAEA,IAAOQ,EAAQhB,EAAWW,CAAO",
-  "names": ["jsx", "jsxs", "withLayout", "Picture", "Text", "useExposure", "useRef", "componentType", "componentName", "Item", "index", "item", "ref", "GiftBox", "props", "data", "className", "list", "GiftBox_default"]
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\n\nexport type GiftBoxDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n}\n\ntype GiftBoxType = {\n  data: {\n    list: GiftBoxDataType[]\n  }\n  className?: string\n}\n\nconst GiftBox = (props: GiftBoxType) => {\n  const { data, className } = props\n  const { list } = data\n\n  return (\n    <div className=\"w-full rounded-2xl bg-[#EAEAEC]\">\n      <div className=\"laptop:gap-4 tablet:grid-cols-4 laptop:grid-cols-3 desktop:grid-cols-5 lg-desktop:grid-cols-6 grid grid-cols-2 gap-3\">\n        {list.map((item, index) => (\n          <div key={index} className=\"laptop:p-[20px] flex flex-col items-center justify-center p-[12px]\">\n            <div>\n              {item?.img?.url && (\n                <Picture\n                  className=\"l-tablet:hidden aspect-[194/194]\"\n                  imgClassName=\"\"\n                  source={item?.img?.url}\n                  alt={item?.img?.alt || ''}\n                />\n              )}\n              {item?.mobileImg?.url && (\n                <Picture\n                  className=\"laptop:hidden aspect-[120/120]\"\n                  imgClassName=\"\"\n                  source={item?.mobileImg?.url}\n                  alt={item?.mobileImg?.alt || ''}\n                />\n              )}\n            </div>\n            <Text html={item?.title} className=\"laptop:text-[18px] text-[14px] font-bold leading-[1.4]\" />\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(GiftBox)\n"],
+  "mappings": "aA6BY,OAEI,OAAAA,EAFJ,QAAAC,MAAA,oBA5BZ,MAAmB,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAe9B,MAAMC,EAAWC,GAAuB,CACtC,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,OACEP,EAAC,OAAI,UAAU,kCACb,SAAAA,EAAC,OAAI,UAAU,uHACZ,SAAAS,EAAK,IAAI,CAACC,EAAMC,IACfV,EAAC,OAAgB,UAAU,qEACzB,UAAAA,EAAC,OACE,UAAAS,GAAM,KAAK,KACVV,EAACG,EAAA,CACC,UAAU,mCACV,aAAa,GACb,OAAQO,GAAM,KAAK,IACnB,IAAKA,GAAM,KAAK,KAAO,GACzB,EAEDA,GAAM,WAAW,KAChBV,EAACG,EAAA,CACC,UAAU,iCACV,aAAa,GACb,OAAQO,GAAM,WAAW,IACzB,IAAKA,GAAM,WAAW,KAAO,GAC/B,GAEJ,EACAV,EAACI,EAAA,CAAK,KAAMM,GAAM,MAAO,UAAU,yDAAyD,IAnBpFC,CAoBV,CACD,EACH,EACF,CAEJ,EAEA,IAAOC,EAAQV,EAAWG,CAAO",
+  "names": ["jsx", "jsxs", "withLayout", "Picture", "Text", "GiftBox", "props", "data", "className", "list", "item", "index", "GiftBox_default"]
 }

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

@@ -32,7 +32,7 @@ export interface GraphicProps extends ComponentCommonProps {
     };
 }
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<GraphicProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -18,8 +18,8 @@ interface GraphicAttractionBlockProps extends ComponentCommonProps {
     };
 }
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<GraphicAttractionBlockProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;
 export type { GraphicAttractionBlockProps };

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Img } from '../../types/props.js';
 export type GraphicMoreDataType = {
     img: Img;
@@ -17,7 +16,7 @@ type GraphicMoreType = {
     className?: string;
 };
 declare const _default: import("react").ForwardRefExoticComponent<Omit<GraphicMoreType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 } & import("react").RefAttributes<any>>;
 export default _default;

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

@@ -1,2 +1,2 @@
-"use client";import{Fragment as g,jsx as t,jsxs as l}from"react/jsx-runtime";import{cn as o}from"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as c}from"../../shared/Styles.js";import{Grid as x,GridItem as f}from"../../components/gird.js";import{Picture as i,Text as a}from"../../components/index.js";const u=p=>{const{data:m,className:n}=p,{productsTab:d,shape:s}=m;return l(g,{children:[t("div",{className:o("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]"),children:t(x,{className:o("tablet:gap-4 grid grid-cols-12 gap-3 ",n),children:d?.map((e,r)=>l(f,{span:e.span,className:o("text-info-primary relative w-full overflow-hidden",s==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":e?.theme==="dark"}),children:[t(i,{source:e?.img?.url,className:"size-full",imgClassName:""}),l("div",{className:"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[e?.title&&t(a,{html:e?.title,as:"p",className:"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]"}),e?.description&&t(a,{html:e?.description,className:"desktop:text-lg line-clamp-2 text-sm font-bold"})]})]},r))})}),t("div",{className:"tablet:hidden block text-[#1D1D1F]",children:t("div",{className:" flex flex-wrap gap-[12px]",children:d?.map((e,r)=>l("div",{className:o("text-info-primary relative overflow-hidden",s==="rounded"?"rounded-xl":"rounded-none",{"aiui-dark":e?.theme==="dark"},e?.fullWidth==="true"?"w-full flex-none":" w-[calc(50%-6px)]"),children:[t(i,{source:e?.mobileImg?.url,className:"size-full",imgClassName:"h-full object-cover"}),l("div",{className:"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[e?.title&&t(a,{html:e?.title,as:"p",className:"line-clamp-3 text-xl font-bold leading-[1.2]"}),e?.description&&t(a,{html:e?.description,className:"line-clamp-2 text-xl font-bold"})]})]},r))})})]})};var w=c(u);export{w as default};
+"use client";import{Fragment as g,jsx as t,jsxs as l}from"react/jsx-runtime";import{cn as o}from"../../helpers/utils.js";import"../SwiperBox/index.js";import{withLayout as c}from"../../shared/Styles.js";import{Grid as x,GridItem as f}from"../../components/gird.js";import{Picture as i,Text as a}from"../../components/index.js";const u=p=>{const{data:m,className:n}=p,{productsTab:d,shape:s}=m;return l(g,{children:[t("div",{className:o("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]"),children:t(x,{className:o("tablet:gap-4 grid grid-cols-12 gap-3 ",n),children:d?.map((e,r)=>l(f,{span:e.span,className:o("text-info-primary relative w-full overflow-hidden",s==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":e.theme==="dark"}),children:[t(i,{source:e.img.url,className:"size-full",imgClassName:""}),l("div",{className:"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[e.title&&t(a,{html:e.title,as:"p",className:"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]"}),e.description&&t(a,{html:e.description,className:"desktop:text-lg line-clamp-2 text-sm font-bold"})]})]},r))})}),t("div",{className:"tablet:hidden block text-[#1D1D1F]",children:t("div",{className:" flex flex-wrap gap-[12px]",children:d?.map((e,r)=>l("div",{className:o("text-info-primary relative overflow-hidden",s==="rounded"?"rounded-xl":"rounded-none",{"aiui-dark":e.theme==="dark"},e?.fullWidth==="true"?"w-full flex-none":" w-[calc(50%-6px)]"),children:[t(i,{source:e.mobileImg.url,className:"size-full",imgClassName:"h-full object-cover"}),l("div",{className:"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[e.title&&t(a,{html:e.title,as:"p",className:"line-clamp-3 text-xl font-bold leading-[1.2]"}),e.description&&t(a,{html:e.description,className:"line-clamp-2 text-xl font-bold"})]})]},r))})})]})};var w=c(u);export{w as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/GraphicMore/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Picture, Text } from '../../components/index.js'\nexport type GraphicMoreDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  theme: 'light' | 'dark'\n  fullWidth: 'true' | 'false'\n  span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\ntype GraphicMoreType = {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: GraphicMoreDataType[]\n  }\n  className?: string\n}\n\nconst GraphicMore = (props: GraphicMoreType) => {\n  const { data, className } = props\n  const { productsTab, shape } = data\n\n  return (\n    <>\n      <div\n        className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]')}\n      >\n        <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n          {productsTab?.map((item, index) => {\n            return (\n              <GridItem\n                key={index}\n                span={item.span}\n                className={cn(\n                  'text-info-primary relative w-full overflow-hidden',\n                  shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n                  '',\n                  {\n                    'aiui-dark': item?.theme === 'dark',\n                  }\n                )}\n              >\n                <Picture source={item?.img?.url} className=\"size-full\" imgClassName=\"\" />\n                <div className=\"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {item?.title && (\n                    <Text\n                      html={item?.title}\n                      as=\"p\"\n                      className=\"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]\"\n                    />\n                  )}\n                  {item?.description && (\n                    <Text html={item?.description} className=\"desktop:text-lg line-clamp-2 text-sm font-bold\" />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"tablet:hidden block text-[#1D1D1F]\">\n        <div className=\" flex flex-wrap gap-[12px]\">\n          {productsTab?.map((it, ind) => {\n            return (\n              <div\n                key={ind}\n                className={cn(\n                  'text-info-primary relative overflow-hidden',\n                  shape === 'rounded' ? 'rounded-xl' : 'rounded-none',\n                  { 'aiui-dark': it?.theme === 'dark' },\n                  it?.fullWidth === 'true'\n                    ? 'w-full flex-none' // \u5360\u6EE1\u6574\u884C\n                    : ' w-[calc(50%-6px)]' // \u666E\u901A\u5143\u7D20\n                )}\n              >\n                <Picture source={it?.mobileImg?.url} className=\"size-full\" imgClassName=\"h-full object-cover\" />\n                <div className=\"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {it?.title && (\n                    <Text html={it?.title} as=\"p\" className=\"line-clamp-3 text-xl font-bold leading-[1.2]\" />\n                  )}\n                  {it?.description && <Text html={it?.description} className=\"line-clamp-2 text-xl font-bold\" />}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(GraphicMore)\n"],
-  "mappings": "aA6BI,mBAAAA,EAmBY,OAAAC,EACA,QAAAC,MApBZ,oBA5BJ,OAAS,MAAAC,MAAU,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,QAAAC,EAAM,YAAAC,MAAgB,2BAC/B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAkB9B,MAAMC,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,YAAAG,EAAa,MAAAC,CAAM,EAAIH,EAE/B,OACET,EAAAF,EAAA,CACE,UAAAC,EAAC,OACC,UAAWE,EAAG,sBAAuB,sEAAsE,EAE3G,SAAAF,EAACI,EAAA,CAAK,UAAWF,EAAG,wCAAyCS,CAAS,EACnE,SAAAC,GAAa,IAAI,CAACE,EAAMC,IAErBd,EAACI,EAAA,CAEC,KAAMS,EAAK,KACX,UAAWZ,EACT,oDACAW,IAAU,UAAY,cAAgB,eACtC,GACA,CACE,YAAaC,GAAM,QAAU,MAC/B,CACF,EAEA,UAAAd,EAACM,EAAA,CAAQ,OAAQQ,GAAM,KAAK,IAAK,UAAU,YAAY,aAAa,GAAG,EACvEb,EAAC,OAAI,UAAU,+IACZ,UAAAa,GAAM,OACLd,EAACO,EAAA,CACC,KAAMO,GAAM,MACZ,GAAG,IACH,UAAU,0EACZ,EAEDA,GAAM,aACLd,EAACO,EAAA,CAAK,KAAMO,GAAM,YAAa,UAAU,iDAAiD,GAE9F,IAvBKC,CAwBP,CAEH,EACH,EACF,EACAf,EAAC,OAAI,UAAU,qCACb,SAAAA,EAAC,OAAI,UAAU,6BACZ,SAAAY,GAAa,IAAI,CAACI,EAAIC,IAEnBhB,EAAC,OAEC,UAAWC,EACT,6CACAW,IAAU,UAAY,aAAe,eACrC,CAAE,YAAaG,GAAI,QAAU,MAAO,EACpCA,GAAI,YAAc,OACd,mBACA,oBACN,EAEA,UAAAhB,EAACM,EAAA,CAAQ,OAAQU,GAAI,WAAW,IAAK,UAAU,YAAY,aAAa,sBAAsB,EAC9Ff,EAAC,OAAI,UAAU,sFACZ,UAAAe,GAAI,OACHhB,EAACO,EAAA,CAAK,KAAMS,GAAI,MAAO,GAAG,IAAI,UAAU,+CAA+C,EAExFA,GAAI,aAAehB,EAACO,EAAA,CAAK,KAAMS,GAAI,YAAa,UAAU,iCAAiC,GAC9F,IAhBKC,CAiBP,CAEH,EACH,EACF,GACF,CAEJ,EAEA,IAAOC,EAAQf,EAAWK,CAAW",
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Picture, Text } from '../../components/index.js'\nexport type GraphicMoreDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  theme: 'light' | 'dark'\n  fullWidth: 'true' | 'false'\n  span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\ntype GraphicMoreType = {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: GraphicMoreDataType[]\n  }\n  className?: string\n}\n\nconst GraphicMore = (props: GraphicMoreType) => {\n  const { data, className } = props\n  const { productsTab, shape } = data\n\n  return (\n    <>\n      <div\n        className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]')}\n      >\n        <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n          {productsTab?.map((item, index) => {\n            return (\n              <GridItem\n                key={index}\n                span={item.span}\n                className={cn(\n                  'text-info-primary relative w-full overflow-hidden',\n                  shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n                  '',\n                  {\n                    'aiui-dark': item.theme === 'dark',\n                  }\n                )}\n              >\n                <Picture source={item.img.url} className=\"size-full\" imgClassName=\"\" />\n                <div className=\"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {item.title && (\n                    <Text\n                      html={item.title}\n                      as=\"p\"\n                      className=\"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]\"\n                    />\n                  )}\n                  {item.description && (\n                    <Text html={item.description} className=\"desktop:text-lg line-clamp-2 text-sm font-bold\" />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"tablet:hidden block text-[#1D1D1F]\">\n        <div className=\" flex flex-wrap gap-[12px]\">\n          {productsTab?.map((it, ind) => {\n            return (\n              <div\n                key={ind}\n                className={cn(\n                  'text-info-primary relative overflow-hidden',\n                  shape === 'rounded' ? 'rounded-xl' : 'rounded-none',\n                  { 'aiui-dark': it.theme === 'dark' },\n                  it?.fullWidth === 'true'\n                    ? 'w-full flex-none' // \u5360\u6EE1\u6574\u884C\n                    : ' w-[calc(50%-6px)]' // \u666E\u901A\u5143\u7D20\n                )}\n              >\n                <Picture source={it.mobileImg.url} className=\"size-full\" imgClassName=\"h-full object-cover\" />\n                <div className=\"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {it.title && <Text html={it.title} as=\"p\" className=\"line-clamp-3 text-xl font-bold leading-[1.2]\" />}\n                  {it.description && <Text html={it.description} className=\"line-clamp-2 text-xl font-bold\" />}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(GraphicMore)\n"],
+  "mappings": "aA6BI,mBAAAA,EAmBY,OAAAC,EACA,QAAAC,MApBZ,oBA5BJ,OAAS,MAAAC,MAAU,yBACnB,MAAsB,wBAEtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,QAAAC,EAAM,YAAAC,MAAgB,2BAC/B,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAkB9B,MAAMC,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,YAAAG,EAAa,MAAAC,CAAM,EAAIH,EAE/B,OACET,EAAAF,EAAA,CACE,UAAAC,EAAC,OACC,UAAWE,EAAG,sBAAuB,sEAAsE,EAE3G,SAAAF,EAACI,EAAA,CAAK,UAAWF,EAAG,wCAAyCS,CAAS,EACnE,SAAAC,GAAa,IAAI,CAACE,EAAMC,IAErBd,EAACI,EAAA,CAEC,KAAMS,EAAK,KACX,UAAWZ,EACT,oDACAW,IAAU,UAAY,cAAgB,eACtC,GACA,CACE,YAAaC,EAAK,QAAU,MAC9B,CACF,EAEA,UAAAd,EAACM,EAAA,CAAQ,OAAQQ,EAAK,IAAI,IAAK,UAAU,YAAY,aAAa,GAAG,EACrEb,EAAC,OAAI,UAAU,+IACZ,UAAAa,EAAK,OACJd,EAACO,EAAA,CACC,KAAMO,EAAK,MACX,GAAG,IACH,UAAU,0EACZ,EAEDA,EAAK,aACJd,EAACO,EAAA,CAAK,KAAMO,EAAK,YAAa,UAAU,iDAAiD,GAE7F,IAvBKC,CAwBP,CAEH,EACH,EACF,EACAf,EAAC,OAAI,UAAU,qCACb,SAAAA,EAAC,OAAI,UAAU,6BACZ,SAAAY,GAAa,IAAI,CAACI,EAAIC,IAEnBhB,EAAC,OAEC,UAAWC,EACT,6CACAW,IAAU,UAAY,aAAe,eACrC,CAAE,YAAaG,EAAG,QAAU,MAAO,EACnCA,GAAI,YAAc,OACd,mBACA,oBACN,EAEA,UAAAhB,EAACM,EAAA,CAAQ,OAAQU,EAAG,UAAU,IAAK,UAAU,YAAY,aAAa,sBAAsB,EAC5Ff,EAAC,OAAI,UAAU,sFACZ,UAAAe,EAAG,OAAShB,EAACO,EAAA,CAAK,KAAMS,EAAG,MAAO,GAAG,IAAI,UAAU,+CAA+C,EAClGA,EAAG,aAAehB,EAACO,EAAA,CAAK,KAAMS,EAAG,YAAa,UAAU,iCAAiC,GAC5F,IAdKC,CAeP,CAEH,EACH,EACF,GACF,CAEJ,EAEA,IAAOC,EAAQf,EAAWK,CAAW",
   "names": ["Fragment", "jsx", "jsxs", "cn", "withLayout", "Grid", "GridItem", "Picture", "Text", "GraphicMore", "props", "data", "className", "productsTab", "shape", "item", "index", "it", "ind", "GraphicMore_default"]
 }

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

@@ -1,8 +1,8 @@
 import React from 'react';
 import type { GraphicOverlayProps } from './types';
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<GraphicOverlayProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;
 export type { GraphicOverlayProps };

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { HeaderNavigationProps } from './types.js';
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<HeaderNavigationProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { HeroBannerProps } from './types.js';
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<HeroBannerProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { ImageTextFeatureProps } from './types.js';
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ImageTextFeatureProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { ImageWithTextProps } from './types.js';
 declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ImageWithTextProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string | undefined;
-    data?: Record<string, any> | undefined;
+    className?: string;
+    data?: Record<string, any>;
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/ImageWithText/ImageWithText.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,jsxs as d}from"react/jsx-runtime";import ue,{useImperativeHandle as fe,useRef as h,useState as v,useEffect as U}from"react";import{Heading as w,Picture as D,Text as z,Button as he,Link as ve}from"../../components/index.js";import{cn as s}from"../../helpers/utils.js";import{withLayout as ge}from"../../shared/Styles.js";import{useExposure as be}from"../../hooks/useExposure.js";import{useIntersectionObserverDelay as we}from"../../hooks/useIntersectionObserver.js";import{motion as X,AnimatePresence as Y}from"framer-motion";import{Cols as _}from"./types.js";const _e="image",ye="image_with_text",ke=e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:e("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),ee=ue.forwardRef(({data:te,className:ie},ae)=>{const{title:V,subtitle:P,desc:y,descIcon:S,image:g,padImage:E,mobileImage:H,theme:oe="dark",items:j=[],layout:le="left",mediaType:se="image",datalist:r=[],video:R,padVideo:W,mobVideo:C,cols:k=_.One,button:u,textAlign:l="left"}=te,i=le,M=h(null),N=h(null),T=h(null),I=h(null),A=h(null),[c,re]=v(0),q=h([]),[B,ne]=v({left:0,width:0}),[f,$]=v(""),[F,O]=v(""),[Z,G]=v(""),n=r.length>0,b=se==="video";be(M,{componentType:_e,componentName:ye,componentTitle:V,componentDescription:P}),fe(ae,()=>M.current),U(()=>{if(r.length>0){const t=q.current[c];if(t){const{offsetLeft:o,offsetWidth:a}=t;ne({left:o,width:a})}}},[c,r.length]);const[J,me]=v(!1);we(A,{once:!0,threshold:.01,callback:()=>{me(!0)}}),U(()=>{if(!J||!b)return;let t="",o="",a="";if(n&&r[c]){const p=r[c];t=p.video?.url||"",o=p.padVideo?.url||t,a=p.mobVideo?.url||t}else t=R?.url||"",o=W?.url||t,a=C?.url||t;t&&$(t),o&&O(o),a&&G(a),setTimeout(()=>{[N.current?.querySelector("video"),T.current?.querySelector("video"),I.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},200)},[J,b,n,c,r,R?.url,W?.url,C?.url]);const de=(t,o)=>{if(re(t),o.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),b&&n&&r[t]){const a=r[t];a.video?.url&&$(a.video.url),a.padVideo?.url&&O(a.padVideo.url),a.mobVideo?.url&&G(a.mobVideo.url),setTimeout(()=>{[N.current?.querySelector("video"),T.current?.querySelector("video"),I.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},300)}},ce=()=>!L||!u?.text?null:e("div",{className:s("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":l==="center","flex justify-start":l==="left","laptop:hidden":i==="top"||i==="bottom"}),children:e(he,{as:"a",href:u.link,variant:u.variant||"secondary",size:"base",className:"image-with-text__button",children:u.text})}),m=j.length>0,L=!!u,K=()=>{if(n&&r[c]){const t=r[c];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return g?`${g?.url},${E?.url||g?.url} 1024, ${H?.url||g?.url} 768`:""},Q=()=>{if(n){const p=r[c],x=p.image?.url,pe=p.imgPad?.url||x,xe=p.imageMob?.url||x;return e(Y,{mode:"wait",children:e(X.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:d("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[e("div",{ref:N,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:x,src:f,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:T,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:pe,src:F||f,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:I,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:xe,src:Z||f,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},p.video?.url||p.image?.url)})}const t=g?.url,o=E?.url||t,a=H?.url||t;return d("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[e("div",{ref:N,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:f,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:T,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:o,src:F||f,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:I,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:a,src:Z||f,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return d("section",{ref:M,"data-ui-component-id":"ImageWithText",className:s("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!n,"flex-col":!n&&(i==="top"||i==="bottom"),"items-center":i==="left"||i==="right","flex-col laptop:flex-row":!n&&(i==="left"||i==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":n,"aiui-dark":oe==="dark"},ie),children:[n&&d("div",{className:s("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":l==="left","text-center":l==="center"}),children:[d("div",{className:"image-with-text__header",children:[e(w,{as:"h3",size:4,html:V,className:"image-with-text__title"}),e(z,{as:"p",size:1,html:y,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),e("div",{className:s("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":l==="center"}),children:d("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[e("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:B.left,width:B.width}}),r.map((t,o)=>e("div",{ref:a=>{q.current[o]=a},onClick:a=>de(o,a),className:s("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",c===o?"image-with-text__tab--active text-black":"text-white"),children:e(w,{as:"h1",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},o))]})})]}),!n&&d("div",{className:s("image-with-text__content flex flex-col",{"justify-center":!L,"justify-between":L,"w-full laptop:w-fit":m,"items-start":l==="left","items-center":l==="center","text-left":l==="left","text-center":l==="center","laptop:order-1":i==="left"}),children:[d("div",{className:s("image-with-text__main-content",{"flex flex-col":L}),children:[d("div",{className:s("image-with-text__header",{"items-end justify-between gap-16 hidden laptop:flex":(i==="top"||i==="bottom")&&u?.text}),children:[d("div",{className:"image-with-text__title-wrapper flex flex-col",children:[e(w,{as:"h2",size:4,html:V,className:s("image-with-text__title",{"w-full":m,"text-left":m&&l==="left","text-center":m&&l==="center"})}),P&&e(z,{as:"p",size:m?4:3,html:P,className:s("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!m,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":m,"text-left":m&&l==="left","text-center":m&&l==="center"})})]}),(i==="top"||i==="bottom")&&u?.text&&e(ve,{href:u.link,className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:ke,children:u.text})]}),!m&&(y||S)&&d("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[S&&e("img",{src:S,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),y&&e(w,{as:"h4",size:5,html:y,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),m&&e("div",{className:s("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":i==="top"||i==="bottom","grid-cols-1":k===_.One,"grid-cols-2":k===_.Two,"grid-cols-3":k===_.Three,"grid-cols-4":k===_.Four}),children:j.map((t,o)=>d("div",{className:s("image-with-text__item",{"text-center":l==="center"}),children:[d("div",{className:s("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":l==="center","justify-start":l==="left"}),children:[e(D,{source:t.icon?.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),e(w,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),e(z,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},o))})]}),ce()]}),e("div",{ref:A,className:s("image-with-text__media-wrapper",{"w-[60%] shrink-0":i==="left"||i==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":m,"laptop:basis-[63%] desktop:basis-[57%]":m&&i==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":n,"!max-w-none !max-h-none aspect-auto":i==="top"||i==="bottom"}),children:n?b?Q():e(Y,{mode:"wait",children:e(X.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:e(D,{source:K(),alt:r[c].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},r[c].image?.url)}):b?Q():e(D,{source:K(),className:s("image-with-text__image rounded-box laptop:rounded-box")})})]})});ee.displayName="ImageWithText";var De=ge(ee);export{De as default};
+"use client";import{jsx as e,jsxs as m}from"react/jsx-runtime";import ue,{useImperativeHandle as fe,useRef as h,useState as g,useEffect as K}from"react";import{Heading as w,Picture as S,Text as M,Link as Q}from"../../components/index.js";import{cn as s}from"../../helpers/utils.js";import{withLayout as he}from"../../shared/Styles.js";import{useExposure as ge}from"../../hooks/useExposure.js";import{useIntersectionObserverDelay as ve}from"../../hooks/useIntersectionObserver.js";import{motion as U,AnimatePresence as X}from"framer-motion";const be="image",we="image_with_text",Y=e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:e("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),ee=ue.forwardRef(({data:te,className:ie},ae)=>{const{title:I,subtitle:L,desc:_,descIcon:V,image:v,padImage:D,mobileImage:z,theme:oe="dark",items:E=[],layout:le="left",mediaType:se="image",datalist:r=[],video:H,padVideo:j,mobVideo:R,button:u,textAlign:l="left"}=te,i=le,P=h(null),y=h(null),k=h(null),N=h(null),W=h(null),[p,re]=g(0),C=h([]),[A,ne]=g({left:0,width:0}),[f,q]=g(""),[$,B]=g(""),[F,O]=g(""),n=r.length>0,b=se==="video";ge(P,{componentType:be,componentName:we,componentTitle:I,componentDescription:L}),fe(ae,()=>P.current),K(()=>{if(r.length>0){const t=C.current[p];if(t){const{offsetLeft:o,offsetWidth:a}=t;ne({left:o,width:a})}}},[p,r.length]);const[Z,de]=g(!1);ve(W,{once:!0,threshold:.01,callback:()=>{de(!0)}}),K(()=>{if(!Z||!b)return;let t="",o="",a="";if(n&&r[p]){const c=r[p];t=c.video?.url||"",o=c.padVideo?.url||t,a=c.mobVideo?.url||t}else t=H?.url||"",o=j?.url||t,a=R?.url||t;t&&q(t),o&&B(o),a&&O(a),setTimeout(()=>{[y.current?.querySelector("video"),k.current?.querySelector("video"),N.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},200)},[Z,b,n,p,r,H?.url,j?.url,R?.url]);const me=(t,o)=>{if(re(t),o.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),b&&n&&r[t]){const a=r[t];a.video?.url&&q(a.video.url),a.padVideo?.url&&B(a.padVideo.url),a.mobVideo?.url&&O(a.mobVideo.url),setTimeout(()=>{[y.current?.querySelector("video"),k.current?.querySelector("video"),N.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},300)}},pe=()=>!T||!u?.text?null:e("div",{className:s("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":l==="center","flex justify-start":l==="left","laptop:hidden":i==="top"||i==="bottom"}),children:e(Q,{href:u.link,className:"image-with-text__button whitespace-nowrap no-underline",suffixIcon:Y,children:u.text})}),d=E.length>0,T=!!u,G=()=>{if(n&&r[p]){const t=r[p];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return v?`${v?.url},${D?.url||v?.url} 1024, ${z?.url||v?.url} 768`:""},J=()=>{if(n){const c=r[p],x=c.image?.url,ce=c.imgPad?.url||x,xe=c.imageMob?.url||x;return e(X,{mode:"wait",children:e(U.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:m("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[e("div",{ref:y,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:x,src:f,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:k,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:ce,src:$||f,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:N,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:xe,src:F||f,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},c.video?.url||c.image?.url)})}const t=v?.url,o=D?.url||t,a=z?.url||t;return m("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[e("div",{ref:y,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:f,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:k,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:o,src:$||f,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:N,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:a,src:F||f,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return m("section",{ref:P,"data-ui-component-id":"ImageWithText",className:s("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!n,"flex-col":!n&&(i==="top"||i==="bottom"),"items-center":i==="left"||i==="right","flex-col laptop:flex-row":!n&&(i==="left"||i==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":n,"aiui-dark":oe==="dark"},ie),children:[n&&m("div",{className:s("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":l==="left","text-center":l==="center"}),children:[m("div",{className:"image-with-text__header",children:[e(w,{as:"h3",size:4,html:I,className:"image-with-text__title"}),e(M,{as:"p",size:1,html:_,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),e("div",{className:s("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":l==="center"}),children:m("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[e("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:A.left,width:A.width}}),r.map((t,o)=>e("div",{ref:a=>{C.current[o]=a},onClick:a=>me(o,a),className:s("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",p===o?"image-with-text__tab--active text-black":"text-white"),children:e(w,{as:"h1",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},o))]})})]}),!n&&m("div",{className:s("image-with-text__content flex flex-col",{"justify-center":!T,"justify-between":T,"w-full laptop:w-fit":d,"items-start":l==="left","items-center":l==="center","text-left":l==="left","text-center":l==="center","laptop:order-1":i==="left"}),children:[m("div",{className:s("image-with-text__main-content",{"flex flex-col":T}),children:[m("div",{className:s("image-with-text__header",{"items-end justify-between gap-16 hidden laptop:flex":(i==="top"||i==="bottom")&&u?.text}),children:[m("div",{className:"image-with-text__title-wrapper flex flex-col",children:[e(w,{as:"h2",size:4,html:I,className:s("image-with-text__title",{"w-full":d,"text-left":d&&l==="left","text-center":d&&l==="center"})}),L&&e(M,{as:"p",size:d?4:3,html:L,className:s("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!d,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":d,"text-left":d&&l==="left","text-center":d&&l==="center"})})]}),(i==="top"||i==="bottom")&&u?.text&&e(Q,{href:u.link,className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:Y,children:u.text})]}),!d&&(_||V)&&m("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[V&&e("img",{src:V,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),_&&e(w,{as:"h4",size:5,html:_,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),d&&e("div",{className:s("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4 laptop:grid-cols-2":i==="left"||i==="right"}),children:E.map((t,o)=>m("div",{className:s("image-with-text__item",{"text-center":l==="center"}),children:[m("div",{className:s("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":l==="center","justify-start":l==="left"}),children:[e(S,{source:t.icon?.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),e(w,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),e(M,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},o))})]}),pe()]}),e("div",{ref:W,className:s("image-with-text__media-wrapper",{"w-[60%] shrink-0":i==="left"||i==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":d,"laptop:basis-[63%] desktop:basis-[57%]":d&&i==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":n,"!max-w-none !max-h-none aspect-auto":i==="top"||i==="bottom"}),children:n?b?J():e(X,{mode:"wait",children:e(U.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:e(S,{source:G(),alt:r[p].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},r[p].image?.url)}):b?J():e(S,{source:G(),className:s("image-with-text__image rounded-box laptop:rounded-box")})})]})});ee.displayName="ImageWithText";var Ve=he(ee);export{Ve as default};
 //# sourceMappingURL=ImageWithText.js.map