@anker-in/headless-ui 1.3.37 → 1.3.39-alpha.1784616869310

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

@@ -0,0 +1,132 @@
+export interface CartKspCopy {
+    /** 展开更多文案，默认 'Show product details' */
+    showMore?: string;
+    /** 收起文案，默认 'Hide product details' */
+    showLess?: string;
+}
+export interface CartItemRowCopy {
+    /** 售罄遮罩文案，默认 'Sold Out' */
+    soldOutText?: string;
+    /** 预售遮罩文案，默认 'Pre-sale' */
+    presaleBadgeText?: string;
+    /** 赠品 badge 文案，默认 'Gift' */
+    giftBadgeText?: string;
+    /** 会员 badge 文案，默认 'Member' */
+    memberBadgeText?: string;
+    /** Plus 会员 badge 文案，默认 'Plus Member' */
+    plusMemberBadgeText?: string;
+    /** 配送信息文案 */
+    shippingText?: string;
+    /** KSP 展开更多文案，默认 'Show product details' */
+    showProductDetails?: string;
+    /** KSP 收起文案，默认 'Hide product details' */
+    hideProductDetails?: string;
+    /** 桌面端移除按钮文案，默认 'Remove' */
+    remove?: string;
+}
+export interface GiftOptionRowCopy {
+    /** 赠品标签文案，默认 'Gift' */
+    badge?: string;
+    /** 免费价格文案，默认 'Free' */
+    free?: string;
+}
+export interface GiftConfirmDialogCopy {
+    /** 确认按钮文案，默认 'Confirm' */
+    confirm?: string;
+    /** 取消按钮文案，默认 'Cancel' */
+    cancel?: string;
+    /** 弹窗 aria-label，默认 'Confirm' */
+    ariaLabel?: string;
+    /** 取消赠品确认文案 */
+    cancelGiftConfirm?: string;
+    /** 移除赠品确认文案 */
+    removeGiftConfirm?: string;
+}
+export interface CartPerksSectionCopy {
+    /** 加入购物车按钮文案，默认 'Add to Cart' */
+    addButton?: string;
+    /** 了解更多按钮文案，默认 'Learn More' */
+    learnMoreButton?: string;
+}
+export interface CartSummaryHeaderCopy {
+    /** 操作按钮文案，默认 'View my shopping cart' */
+    actionText?: string;
+}
+export interface CartPriceSummaryCopy {
+    /** 操作按钮文案，默认 'View my shopping cart' (deprecated, use checkOut) */
+    actionText?: string;
+    /** 售罄状态标题文案 */
+    soldOutTitleText?: string;
+    /** 折扣码输入框占位文案，默认 'Enter Code' */
+    couponPlaceholder?: string;
+    /** 折扣码应用按钮文案，默认 'Apply' */
+    couponApply?: string;
+    /** 折扣码标题文案，默认 'Have a discount code?' */
+    couponTitle?: string;
+    /** 折扣码链接文案，默认 'Apply/Check' */
+    couponLink?: string;
+    /** 小计行标签，默认 'Subtotal:' */
+    subtotalLabel?: string;
+    /** 运费行标签，默认 'Shipping:' */
+    shippingLabel?: string;
+    /** 税费行标签，默认 'Taxes:' */
+    taxesLabel?: string;
+    /** 产品折扣标签，默认 'Product discounts:' */
+    productDiscountsLabel?: string;
+    /** 订单折扣标签，默认 'Order discount:' */
+    orderDiscountLabel?: string;
+    /** 折扣总计标签，默认 'Discount total:' */
+    discountTotalLabel?: string;
+    /** 总计标签，默认 'Total:' */
+    totalLabel?: string;
+    /** 结账按钮文案，默认 'Check Out' */
+    checkOut?: string;
+    /** 现金减免提示文案 */
+    cashReductionText?: string;
+    /** 分期付款信息文案 */
+    installmentText?: string;
+}
+export interface CartItemRemoveConfirmCopy {
+    /** 确认按钮文案，默认 'Confirm' */
+    removeConfirmConfirm?: string;
+    /** 取消按钮文案，默认 'Cancel' */
+    removeConfirmCancel?: string;
+    /** 确认提示文案，默认 'Are you sure you want to delete the product?' */
+    removeConfirmText?: string;
+}
+/** 单个赠品选项 */
+export interface GiftOption {
+    /** 赠品唯一标识（SKU） */
+    sku: string;
+    /** 赠品名称 */
+    name: string;
+    /** 赠品图片 */
+    image: {
+        src: string;
+        alt?: string;
+    };
+    /** 赠品详情页跳转链接 */
+    listingHref?: string;
+    /** 展示数量（业务侧计算后传入）
+     * effectMode=multiple：displayQuantity = mainQty × perQty
+     * effectMode=once：displayQuantity = perQty
+     */
+    displayQuantity: number;
+    /** 原价展示文案，如 "$299.00" */
+    originalPriceText: string;
+    /** 变体信息文案，如 "Color: White" */
+    variantText?: string;
+    /** 是否可选，false 时整行置灰 */
+    disabled?: boolean;
+    /** 价格区域的附加内容，如 Badge */
+    extra?: React.ReactNode;
+}
+/** 一个赠品 slot 配置 */
+export interface GiftSlotConfig {
+    /** 赠品选项列表 */
+    options: GiftOption[];
+    /** 选择模式：radio(单选) 或 checkbox(多选) */
+    mode?: 'radio' | 'checkbox';
+    /** 最多可选数量（checkbox 模式下生效） */
+    maxSelectable?: number;
+}

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

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

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/CartDetail/types.ts"],
+  "sourcesContent": ["// \u2500\u2500 Copy\uFF08\u6587\u6848\u96C6\u4E2D\u7BA1\u7406\uFF09\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\nexport interface CartKspCopy {\n  /** \u5C55\u5F00\u66F4\u591A\u6587\u6848\uFF0C\u9ED8\u8BA4 'Show product details' */\n  showMore?: string\n  /** \u6536\u8D77\u6587\u6848\uFF0C\u9ED8\u8BA4 'Hide product details' */\n  showLess?: string\n}\n\nexport interface CartItemRowCopy {\n  /** \u552E\u7F44\u906E\u7F69\u6587\u6848\uFF0C\u9ED8\u8BA4 'Sold Out' */\n  soldOutText?: string\n  /** \u9884\u552E\u906E\u7F69\u6587\u6848\uFF0C\u9ED8\u8BA4 'Pre-sale' */\n  presaleBadgeText?: string\n  /** \u8D60\u54C1 badge \u6587\u6848\uFF0C\u9ED8\u8BA4 'Gift' */\n  giftBadgeText?: string\n  /** \u4F1A\u5458 badge \u6587\u6848\uFF0C\u9ED8\u8BA4 'Member' */\n  memberBadgeText?: string\n  /** Plus \u4F1A\u5458 badge \u6587\u6848\uFF0C\u9ED8\u8BA4 'Plus Member' */\n  plusMemberBadgeText?: string\n  /** \u914D\u9001\u4FE1\u606F\u6587\u6848 */\n  shippingText?: string\n  /** KSP \u5C55\u5F00\u66F4\u591A\u6587\u6848\uFF0C\u9ED8\u8BA4 'Show product details' */\n  showProductDetails?: string\n  /** KSP \u6536\u8D77\u6587\u6848\uFF0C\u9ED8\u8BA4 'Hide product details' */\n  hideProductDetails?: string\n  /** \u684C\u9762\u7AEF\u79FB\u9664\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Remove' */\n  remove?: string\n}\n\nexport interface GiftOptionRowCopy {\n  /** \u8D60\u54C1\u6807\u7B7E\u6587\u6848\uFF0C\u9ED8\u8BA4 'Gift' */\n  badge?: string\n  /** \u514D\u8D39\u4EF7\u683C\u6587\u6848\uFF0C\u9ED8\u8BA4 'Free' */\n  free?: string\n}\n\nexport interface GiftConfirmDialogCopy {\n  /** \u786E\u8BA4\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Confirm' */\n  confirm?: string\n  /** \u53D6\u6D88\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Cancel' */\n  cancel?: string\n  /** \u5F39\u7A97 aria-label\uFF0C\u9ED8\u8BA4 'Confirm' */\n  ariaLabel?: string\n  /** \u53D6\u6D88\u8D60\u54C1\u786E\u8BA4\u6587\u6848 */\n  cancelGiftConfirm?: string\n  /** \u79FB\u9664\u8D60\u54C1\u786E\u8BA4\u6587\u6848 */\n  removeGiftConfirm?: string\n}\n\nexport interface CartPerksSectionCopy {\n  /** \u52A0\u5165\u8D2D\u7269\u8F66\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Add to Cart' */\n  addButton?: string\n  /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Learn More' */\n  learnMoreButton?: string\n}\n\nexport interface CartSummaryHeaderCopy {\n  /** \u64CD\u4F5C\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'View my shopping cart' */\n  actionText?: string\n}\n\nexport interface CartPriceSummaryCopy {\n  /** \u64CD\u4F5C\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'View my shopping cart' (deprecated, use checkOut) */\n  actionText?: string\n  /** \u552E\u7F44\u72B6\u6001\u6807\u9898\u6587\u6848 */\n  soldOutTitleText?: string\n  /** \u6298\u6263\u7801\u8F93\u5165\u6846\u5360\u4F4D\u6587\u6848\uFF0C\u9ED8\u8BA4 'Enter Code' */\n  couponPlaceholder?: string\n  /** \u6298\u6263\u7801\u5E94\u7528\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Apply' */\n  couponApply?: string\n  /** \u6298\u6263\u7801\u6807\u9898\u6587\u6848\uFF0C\u9ED8\u8BA4 'Have a discount code?' */\n  couponTitle?: string\n  /** \u6298\u6263\u7801\u94FE\u63A5\u6587\u6848\uFF0C\u9ED8\u8BA4 'Apply/Check' */\n  couponLink?: string\n  /** \u5C0F\u8BA1\u884C\u6807\u7B7E\uFF0C\u9ED8\u8BA4 'Subtotal:' */\n  subtotalLabel?: string\n  /** \u8FD0\u8D39\u884C\u6807\u7B7E\uFF0C\u9ED8\u8BA4 'Shipping:' */\n  shippingLabel?: string\n  /** \u7A0E\u8D39\u884C\u6807\u7B7E\uFF0C\u9ED8\u8BA4 'Taxes:' */\n  taxesLabel?: string\n  /** \u4EA7\u54C1\u6298\u6263\u6807\u7B7E\uFF0C\u9ED8\u8BA4 'Product discounts:' */\n  productDiscountsLabel?: string\n  /** \u8BA2\u5355\u6298\u6263\u6807\u7B7E\uFF0C\u9ED8\u8BA4 'Order discount:' */\n  orderDiscountLabel?: string\n  /** \u6298\u6263\u603B\u8BA1\u6807\u7B7E\uFF0C\u9ED8\u8BA4 'Discount total:' */\n  discountTotalLabel?: string\n  /** \u603B\u8BA1\u6807\u7B7E\uFF0C\u9ED8\u8BA4 'Total:' */\n  totalLabel?: string\n  /** \u7ED3\u8D26\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Check Out' */\n  checkOut?: string\n  /** \u73B0\u91D1\u51CF\u514D\u63D0\u793A\u6587\u6848 */\n  cashReductionText?: string\n  /** \u5206\u671F\u4ED8\u6B3E\u4FE1\u606F\u6587\u6848 */\n  installmentText?: string\n}\n\nexport interface CartItemRemoveConfirmCopy {\n  /** \u786E\u8BA4\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Confirm' */\n  removeConfirmConfirm?: string\n  /** \u53D6\u6D88\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 'Cancel' */\n  removeConfirmCancel?: string\n  /** \u786E\u8BA4\u63D0\u793A\u6587\u6848\uFF0C\u9ED8\u8BA4 'Are you sure you want to delete the product?' */\n  removeConfirmText?: string\n}\n\n// \u2500\u2500 Domain types \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\n/** \u5355\u4E2A\u8D60\u54C1\u9009\u9879 */\nexport interface GiftOption {\n  /** \u8D60\u54C1\u552F\u4E00\u6807\u8BC6\uFF08SKU\uFF09 */\n  sku: string\n  /** \u8D60\u54C1\u540D\u79F0 */\n  name: string\n  /** \u8D60\u54C1\u56FE\u7247 */\n  image: { src: string; alt?: string }\n  /** \u8D60\u54C1\u8BE6\u60C5\u9875\u8DF3\u8F6C\u94FE\u63A5 */\n  listingHref?: string\n  /** \u5C55\u793A\u6570\u91CF\uFF08\u4E1A\u52A1\u4FA7\u8BA1\u7B97\u540E\u4F20\u5165\uFF09\n   * effectMode=multiple\uFF1AdisplayQuantity = mainQty \u00D7 perQty\n   * effectMode=once\uFF1AdisplayQuantity = perQty\n   */\n  displayQuantity: number\n  /** \u539F\u4EF7\u5C55\u793A\u6587\u6848\uFF0C\u5982 \"$299.00\" */\n  originalPriceText: string\n  /** \u53D8\u4F53\u4FE1\u606F\u6587\u6848\uFF0C\u5982 \"Color: White\" */\n  variantText?: string\n  /** \u662F\u5426\u53EF\u9009\uFF0Cfalse \u65F6\u6574\u884C\u7F6E\u7070 */\n  disabled?: boolean\n  /** \u4EF7\u683C\u533A\u57DF\u7684\u9644\u52A0\u5185\u5BB9\uFF0C\u5982 Badge */\n  extra?: React.ReactNode\n}\n\n/** \u4E00\u4E2A\u8D60\u54C1 slot \u914D\u7F6E */\nexport interface GiftSlotConfig {\n  /** \u8D60\u54C1\u9009\u9879\u5217\u8868 */\n  options: GiftOption[]\n  /** \u9009\u62E9\u6A21\u5F0F\uFF1Aradio(\u5355\u9009) \u6216 checkbox(\u591A\u9009) */\n  mode?: 'radio' | 'checkbox'\n  /** \u6700\u591A\u53EF\u9009\u6570\u91CF\uFF08checkbox \u6A21\u5F0F\u4E0B\u751F\u6548\uFF09 */\n  maxSelectable?: number\n}\n"],
+  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
+  "names": ["types_exports", "__toCommonJS"]
+}

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var B=Object.create;var n=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var S=(e,t)=>{for(var r in t)n(e,r,{get:t[r],enumerable:!0})},h=(e,t,r,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of w(t))!C.call(e,p)&&p!==r&&n(e,p,{get:()=>t[p],enumerable:!(l=I(t,p))||l.enumerable});return e};var k=(e,t,r)=>(r=e!=null?B(R(e)):{},h(t||!e||!e.__esModule?n(r,"default",{value:e,enumerable:!0}):r,e)),M=e=>h(n({},"__esModule",{value:!0}),e);var j={};S(j,{default:()=>H});module.exports=M(j);var a=require("react/jsx-runtime"),m=k(require("react")),s=require("../../helpers/index.js"),b=k(require("../../components/picture.js")),i=require("../../index.js"),v=require("../../shared/Styles.js");const D=e=>{const t=[{key:"lgDesktop",width:1920},{key:"desktop",width:1440},{key:"laptop",width:1024},{key:"pad",width:768},{key:"mobile",width:390}],r=t.filter(({key:l})=>e[l]?.url).map(({key:l,width:p})=>`${e[l].url} ${p}`);if(r.length>0)return r.join(", ");for(const{key:l}of t)if(e[l]?.url)return e[l].url;return""},N=(e,t)=>{const r=["desktop","laptop","pad","mobile","lgDesktop"];for(const l of r)if(e[l]?.alt)return e[l].alt;return t},z=(e="full")=>({full:"laptop:col-span-3","2/3":"laptop:col-span-2","1/3":"laptop:col-span-1"})[e],T=(e="full")=>e==="1/3"?"":"laptop:flex-row",L=(e="full")=>({full:"laptop:h-full laptop:w-2/3","2/3":"laptop:h-full laptop:w-1/2","1/3":"laptop:flex-1 h-[200px] lg-desktop:h-[240px]"})[e],x=m.forwardRef(({className:e,classNames:t={},data:r,onItemClick:l,...p},y)=>{const{title:g,subtitle:c,items:f}=r,P=m.useCallback((o,d)=>u=>{l?.(o,d,u)},[l]);return(0,a.jsxs)("div",{ref:y,className:(0,s.cn)("blog-posts-root","text-info-primary w-full",e,t.root),...p,children:[(g||c)&&(0,a.jsxs)("div",{className:(0,s.cn)("blog-posts-header mb-6",t.header),children:[g&&(0,a.jsx)(i.Heading,{as:"h2",size:4,html:g,className:(0,s.cn)("blog-posts-title",t.title)}),c&&(0,a.jsx)(i.Text,{as:"p",size:3,className:(0,s.cn)("",t?.subtitle),html:c})]}),(0,a.jsx)("div",{className:(0,s.cn)("blog-posts-grid","laptop:grid-cols-3 grid grid-cols-1 gap-4",t.grid),children:f.map((o,d)=>{const u=o.link?"a":"div",F=o.link?{href:o.link}:{};return(0,a.jsxs)(m.Fragment,{children:[(0,a.jsxs)(u,{...F,className:(0,s.cn)("blog-posts-card rounded-box","flex cursor-pointer flex-col gap-4","laptop:h-[336px] desktop:h-[448px] lg-desktop:h-[560px]","laptop:bg-container-secondary-0 laptop:p-4 desktop:p-6 lg-desktop:p-8","laptop:overflow-hidden laptop:transition-opacity ","bg-container-secondary-1",z(o.width||"full"),T(o.width||"full"),t.card),onClick:P(o,d),children:[(0,a.jsx)("div",{className:(0,s.cn)("blog-posts-card-image","relative w-full overflow-hidden","h-[200px] shrink-0",L(o.width||"full"),t.cardImage),children:(0,a.jsx)(b.default,{source:D(o.image),alt:N(o.image,o.title),className:"rounded-box h-full object-cover",imgClassName:"h-full"})}),(0,a.jsxs)("div",{className:(0,s.cn)("blog-posts-card-content","desktop:gap-6 flex flex-col justify-center gap-4",t.cardContent),children:[(0,a.jsxs)("div",{className:"desktop:gap-2 flex flex-col gap-1",children:[(0,a.jsx)(i.Heading,{size:2,as:"h6",className:(0,s.cn)("blog-posts-card-title line-clamp-3",t.cardTitle),html:o.title}),o.description&&(0,a.jsx)(i.Text,{className:(0,s.cn)("blog-posts-card-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-3 text-[14px]",t.cardDescription),html:o.description})]}),o.date&&(0,a.jsx)(i.Text,{className:(0,s.cn)("blog-posts-card-meta","text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",t.cardMeta),html:o.date})]})]}),d<f.length-1&&(0,a.jsx)("div",{className:(0,s.cn)("blog-posts-separator","bg-lines-primary laptop:hidden h-px w-full",t.separator)})]},d)})})]})});x.displayName="FeaturedBlogPosts";const E=(0,v.withLayout)(x);var H=E;
+"use strict";"use client";var F=Object.create;var n=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var S=(e,t)=>{for(var s in t)n(e,s,{get:t[s],enumerable:!0})},k=(e,t,s,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of I(t))!C.call(e,r)&&r!==s&&n(e,r,{get:()=>t[r],enumerable:!(p=B(t,r))||p.enumerable});return e};var b=(e,t,s)=>(s=e!=null?F(R(e)):{},k(t||!e||!e.__esModule?n(s,"default",{value:e,enumerable:!0}):s,e)),M=e=>k(n({},"__esModule",{value:!0}),e);var H={};S(H,{default:()=>E});module.exports=M(H);var a=require("react/jsx-runtime"),m=b(require("react")),l=require("../../helpers/index.js"),x=b(require("../../components/picture.js")),i=require("../../index.js"),v=require("../../shared/Styles.js");const D=e=>{const t=[{key:"lgDesktop",width:1920},{key:"desktop",width:1440},{key:"laptop",width:1024},{key:"pad",width:768},{key:"mobile",width:390}],s=t.filter(({key:p})=>e[p]?.url).map(({key:p,width:r})=>`${e[p].url} ${r}`);if(s.length>0)return s.join(", ");for(const{key:p}of t)if(e[p]?.url)return e[p].url;return""},N=(e,t)=>{const s=["desktop","laptop","pad","mobile","lgDesktop"];for(const p of s)if(e[p]?.alt)return e[p].alt;return t},z=(e="full")=>({full:"laptop:col-span-3","2/3":"laptop:col-span-2","1/3":"laptop:col-span-1"})[e],T=(e="full")=>e==="1/3"?"":"laptop:flex-row",j=(e="full")=>({full:"laptop:w-2/3 aspect-[356/200] tablet:aspect-[704/200] laptop:aspect-[2/1] desktop:aspect-[19/9] lg-desktop:aspect-[7/3]","2/3":"laptop:w-1/2 aspect-[356/200] tablet:aspect-[704/200] laptop:aspect-[1/1] desktop:aspect-[16/15] lg-desktop:aspect-[8/7]","1/3":"laptop:flex-1 aspect-[356/200] tablet:aspect-[704/200] laptop:aspect-[256/153] desktop:aspect-[379/192] lg-desktop:aspect-[480/248]"})[e],h=m.forwardRef(({className:e,classNames:t={},data:s,onItemClick:p,...r},y)=>{const{title:c,subtitle:g,items:f}=s,P=m.useCallback((o,d)=>u=>{p?.(o,d,u)},[p]);return(0,a.jsxs)("div",{ref:y,className:(0,l.cn)("blog-posts-root","text-info-primary w-full",e,t.root),...r,children:[(c||g)&&(0,a.jsxs)("div",{className:(0,l.cn)("blog-posts-header mb-6",t.header),children:[c&&(0,a.jsx)(i.Heading,{as:"h2",size:4,html:c,className:(0,l.cn)("blog-posts-title",t.title)}),g&&(0,a.jsx)(i.Text,{as:"p",size:3,className:(0,l.cn)("",t?.subtitle),html:g})]}),(0,a.jsx)("div",{className:(0,l.cn)("blog-posts-grid","laptop:grid-cols-3 grid grid-cols-1 gap-4",t.grid),children:f.map((o,d)=>{const u=o.link?"a":"div",w=o.link?{href:o.link}:{};return(0,a.jsxs)(m.Fragment,{children:[(0,a.jsxs)(u,{...w,className:(0,l.cn)("blog-posts-card rounded-box","flex cursor-pointer flex-col gap-4","laptop:bg-container-secondary-0 laptop:p-4 desktop:p-6 lg-desktop:p-8","laptop:overflow-hidden laptop:transition-opacity ","bg-container-secondary-1",z(o.width||"full"),T(o.width||"full"),t.card),onClick:P(o,d),children:[(0,a.jsx)("div",{className:(0,l.cn)("blog-posts-card-image","relative w-full overflow-hidden","laptop:min-h-0 min-h-[200px] shrink-0",j(o.width||"full"),t.cardImage),children:(0,a.jsx)(x.default,{source:D(o.image),alt:N(o.image,o.title),className:"rounded-t-box h-full object-cover",imgClassName:o.width==="1/3"?"h-auto object-cover":"w-full laptop:h-full laptop:w-[unset] object-cover"})}),(0,a.jsxs)("div",{className:(0,l.cn)("blog-posts-card-content","desktop:gap-6 flex flex-col justify-center gap-4",t.cardContent),children:[(0,a.jsxs)("div",{className:"desktop:gap-2 flex flex-col gap-1",children:[(0,a.jsx)(i.Heading,{size:2,as:"h6",className:(0,l.cn)("blog-posts-card-title line-clamp-3",t.cardTitle),html:o.title}),o.description&&(0,a.jsx)(i.Text,{className:(0,l.cn)("blog-posts-card-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-3 text-[14px]",t.cardDescription),html:o.description})]}),o.date&&(0,a.jsx)(i.Text,{className:(0,l.cn)("blog-posts-card-meta","text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",t.cardMeta),html:o.date})]})]}),d<f.length-1&&(0,a.jsx)("div",{className:(0,l.cn)("blog-posts-separator","bg-lines-primary laptop:hidden h-px w-full",t.separator)})]},d)})})]})});h.displayName="FeaturedBlogPosts";const L=(0,v.withLayout)(h);var E=L;
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/FeaturedBlogPosts/index.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport Picture from '../../components/picture.js'\nimport type { Img } from '../../types/props.js'\nimport { Heading, Text } from '../../index.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nexport type FeaturedBlogPostsSemanticName =\n  | 'root'\n  | 'header'\n  | 'title'\n  | 'subtitle'\n  | 'grid'\n  | 'card'\n  | 'cardImage'\n  | 'cardContent'\n  | 'cardTitle'\n  | 'cardDescription'\n  | 'cardMeta'\n  | 'separator'\n\n/**\n * \u5361\u7247\u5BBD\u5EA6\u6BD4\u4F8B\n */\nexport type FeaturedBlogPostSpan = 'full' | '2/3' | '1/3'\n\n/**\n * \u535A\u6587\u5361\u7247\u9879\u6570\u636E\u63A5\u53E3\n */\nexport interface FeaturedBlogPostItem {\n  /** \u5C01\u9762\u56FE\u7247 */\n  image: {\n    mobile?: Img\n    pad?: Img\n    laptop?: Img\n    desktop?: Img\n    lgDesktop?: Img\n  }\n  /** \u6587\u7AE0\u6807\u9898 */\n  title: string\n  /** \u6587\u7AE0\u63CF\u8FF0 */\n  description?: string\n  /** \u65E5\u671F\u4FE1\u606F\uFF08\u5206\u7C7B\u00B7\u65E5\u671F\u00B7\u4F5C\u8005\uFF09 */\n  date?: string\n  /** \u6587\u7AE0\u94FE\u63A5 */\n  link?: string\n  /** \u5361\u7247\u5BBD\u5EA6\u6BD4\u4F8B\uFF0C\u9ED8\u8BA4 full */\n  width?: FeaturedBlogPostSpan\n}\n\n/**\n * FeaturedBlogPosts \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface FeaturedBlogPostsData {\n  /** \u4E3B\u6807\u9898 */\n  title?: string\n  /** \u526F\u6807\u9898 */\n  subtitle?: string\n  /** \u535A\u6587\u5217\u8868 */\n  items: FeaturedBlogPostItem[]\n}\n\nexport interface FeaturedBlogPostsProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: FeaturedBlogPostsData\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n  classNames?: Partial<Record<FeaturedBlogPostsSemanticName, string>>\n  /** \u5361\u7247\u70B9\u51FB\u56DE\u8C03 */\n  onItemClick?: (item: FeaturedBlogPostItem, index: number, event: React.MouseEvent) => void\n}\n\n/**\n * \u54CD\u5E94\u5F0F\u56FE\u7247\u7C7B\u578B\n */\ntype ResponsiveImage = FeaturedBlogPostItem['image']\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61\u8F6C\u4E3A Picture source \u683C\u5F0F\u5B57\u7B26\u4E32\n * \u683C\u5F0F: \"url1 1920, url2 1440, url3 1024, url4 768, url5 390\"\n */\nconst getImageSource = (image: ResponsiveImage): string => {\n  const breakpoints: { key: keyof ResponsiveImage; width: number }[] = [\n    { key: 'lgDesktop', width: 1920 },\n    { key: 'desktop', width: 1440 },\n    { key: 'laptop', width: 1024 },\n    { key: 'pad', width: 768 },\n    { key: 'mobile', width: 390 },\n  ]\n\n  const sources = breakpoints\n    .filter(({ key }) => image[key]?.url)\n    .map(({ key, width }) => `${image[key]!.url} ${width}`)\n\n  // \u5982\u679C\u6709 sources\uFF0C\u8FD4\u56DE\u62FC\u63A5\u7ED3\u679C\uFF1B\u5426\u5219\u8FD4\u56DE\u7B2C\u4E00\u4E2A\u6709\u6548\u7684 url\n  if (sources.length > 0) {\n    return sources.join(', ')\n  }\n\n  // fallback: \u8FD4\u56DE\u4EFB\u610F\u4E00\u4E2A\u6709\u6548\u7684 url\n  for (const { key } of breakpoints) {\n    if (image[key]?.url) return image[key]!.url\n  }\n\n  return ''\n}\n\n/**\n * \u4ECE\u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61\u83B7\u53D6 alt \u6587\u672C\n */\nconst getImageAlt = (image: ResponsiveImage, fallback: string): string => {\n  const keys: (keyof ResponsiveImage)[] = ['desktop', 'laptop', 'pad', 'mobile', 'lgDesktop']\n  for (const key of keys) {\n    if (image[key]?.alt) return image[key]!.alt!\n  }\n  return fallback\n}\n\n/**\n * \u6839\u636E span \u83B7\u53D6\u5361\u7247 grid \u5217\u6570 (laptop+)\n */\nconst getSpanClass = (span: FeaturedBlogPostSpan = 'full') => {\n  const spanMap: Record<FeaturedBlogPostSpan, string> = {\n    full: 'laptop:col-span-3',\n    '2/3': 'laptop:col-span-2',\n    '1/3': 'laptop:col-span-1',\n  }\n  return spanMap[span]\n}\n\n/**\n * \u6839\u636E span \u83B7\u53D6\u5361\u7247\u5E03\u5C40\u65B9\u5411 (laptop+)\n * 1/3: \u4E0A\u4E0B\u5E03\u5C40\uFF0C\u5176\u4ED6: \u5DE6\u53F3\u5E03\u5C40\n */\nconst getLayoutClass = (span: FeaturedBlogPostSpan = 'full') => {\n  return span === '1/3' ? '' : 'laptop:flex-row'\n}\n\n/**\n * \u6839\u636E span \u83B7\u53D6\u56FE\u7247\u5C3A\u5BF8\u6837\u5F0F (laptop+)\n * full: \u5DE6\u53F3\u5E03\u5C40\uFF0C\u56FE\u7247\u5BBD\u5EA6\u5360 2/3\n * 2/3: \u5DE6\u53F3\u5E03\u5C40\uFF0C\u56FE\u7247\u5BBD\u5EA6\u5360 1/2\n * 1/3: \u4E0A\u4E0B\u5E03\u5C40\uFF0C\u56FE\u7247\u9AD8\u5EA6\u586B\u6EE1\u5269\u4F59\u7A7A\u95F4\n */\nconst getImageSizeClass = (span: FeaturedBlogPostSpan = 'full') => {\n  const sizeMap: Record<FeaturedBlogPostSpan, string> = {\n    full: 'laptop:h-full laptop:w-2/3',\n    '2/3': 'laptop:h-full laptop:w-1/2',\n    '1/3': 'laptop:flex-1 h-[200px] lg-desktop:h-[240px]',\n  }\n  return sizeMap[span]\n}\n\n/**\n * FeaturedBlogPosts - \u7CBE\u9009\u535A\u6587\n *\n * @description \u5C55\u793A\u7ECF\u8FC7\u7B5B\u9009\u7684\u4F18\u8D28\u6587\u7AE0\uFF0C\u652F\u6301\u4E0D\u540C\u5BBD\u5EA6\u548C\u5E03\u5C40\u7684\u5361\u7247\u7EC4\u5408\n */\nconst FeaturedBlogPostsBase = React.forwardRef<HTMLDivElement, FeaturedBlogPostsProps>(\n  ({ className, classNames = {}, data, onItemClick, ...props }, ref) => {\n    const { title, subtitle, items } = data\n\n    const handleCardClick = React.useCallback(\n      (item: FeaturedBlogPostItem, index: number) => (event: React.MouseEvent) => {\n        onItemClick?.(item, index, event)\n      },\n      [onItemClick]\n    )\n\n    return (\n      <div\n        ref={ref}\n        className={cn('blog-posts-root', 'text-info-primary w-full', className, classNames.root)}\n        {...props}\n      >\n        {/* \u6807\u9898\u533A\u57DF */}\n        {(title || subtitle) && (\n          <div className={cn('blog-posts-header mb-6', classNames.header)}>\n            {title && <Heading as=\"h2\" size={4} html={title} className={cn('blog-posts-title', classNames.title)} />}\n            {subtitle && <Text as=\"p\" size={3} className={cn('', classNames?.subtitle)} html={subtitle} />}\n          </div>\n        )}\n        <div className={cn('blog-posts-grid', 'laptop:grid-cols-3 grid grid-cols-1 gap-4', classNames.grid)}>\n          {items.map((item, index) => {\n            const CardWrapper = item.link ? 'a' : 'div'\n            const cardProps = item.link ? { href: item.link } : {}\n\n            return (\n              <React.Fragment key={index}>\n                <CardWrapper\n                  {...cardProps}\n                  className={cn(\n                    'blog-posts-card rounded-box',\n                    'flex cursor-pointer flex-col gap-4',\n                    'laptop:h-[336px] desktop:h-[448px] lg-desktop:h-[560px]',\n                    'laptop:bg-container-secondary-0 laptop:p-4 desktop:p-6 lg-desktop:p-8',\n                    'laptop:overflow-hidden laptop:transition-opacity ',\n                    'bg-container-secondary-1',\n                    getSpanClass(item.width || 'full'),\n                    getLayoutClass(item.width || 'full'),\n                    classNames.card\n                  )}\n                  onClick={handleCardClick(item, index)}\n                >\n                  {/* \u56FE\u7247 */}\n                  <div\n                    className={cn(\n                      'blog-posts-card-image',\n                      'relative w-full overflow-hidden',\n                      'h-[200px] shrink-0',\n                      getImageSizeClass(item.width || 'full'),\n                      classNames.cardImage\n                    )}\n                  >\n                    <Picture\n                      source={getImageSource(item.image)}\n                      alt={getImageAlt(item.image, item.title)}\n                      className=\"rounded-box h-full object-cover\"\n                      imgClassName=\"h-full\"\n                    />\n                  </div>\n\n                  {/* \u5185\u5BB9 */}\n                  <div\n                    className={cn(\n                      'blog-posts-card-content',\n                      'desktop:gap-6 flex flex-col justify-center gap-4',\n                      classNames.cardContent\n                    )}\n                  >\n                    <div className=\"desktop:gap-2 flex flex-col gap-1\">\n                      <Heading\n                        size={2}\n                        as=\"h6\"\n                        className={cn('blog-posts-card-title line-clamp-3', classNames.cardTitle)}\n                        html={item.title}\n                      />\n\n                      {item.description && (\n                        <Text\n                          className={cn(\n                            'blog-posts-card-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-3 text-[14px]',\n                            classNames.cardDescription\n                          )}\n                          html={item.description}\n                        />\n                      )}\n                    </div>\n                    {item.date && (\n                      <Text\n                        className={cn(\n                          'blog-posts-card-meta',\n                          'text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[14px]',\n                          classNames.cardMeta\n                        )}\n                        html={item.date}\n                      />\n                    )}\n                  </div>\n                </CardWrapper>\n\n                {/* \u5206\u5272\u7EBF - \u4EC5 mobile/tablet \u663E\u793A */}\n                {index < items.length - 1 && (\n                  <div\n                    className={cn(\n                      'blog-posts-separator',\n                      'bg-lines-primary laptop:hidden h-px w-full',\n                      classNames.separator\n                    )}\n                  />\n                )}\n              </React.Fragment>\n            )\n          })}\n        </div>\n      </div>\n    )\n  }\n)\n\nFeaturedBlogPostsBase.displayName = 'FeaturedBlogPosts'\n\nconst FeaturedBlogPosts = withLayout(FeaturedBlogPostsBase)\n\nexport default FeaturedBlogPosts\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport Picture from '../../components/picture.js'\nimport type { Img } from '../../types/props.js'\nimport { Heading, Text } from '../../index.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nexport type FeaturedBlogPostsSemanticName =\n  | 'root'\n  | 'header'\n  | 'title'\n  | 'subtitle'\n  | 'grid'\n  | 'card'\n  | 'cardImage'\n  | 'cardContent'\n  | 'cardTitle'\n  | 'cardDescription'\n  | 'cardMeta'\n  | 'separator'\n\n/**\n * \u5361\u7247\u5BBD\u5EA6\u6BD4\u4F8B\n */\nexport type FeaturedBlogPostSpan = 'full' | '2/3' | '1/3'\n\n/**\n * \u535A\u6587\u5361\u7247\u9879\u6570\u636E\u63A5\u53E3\n */\nexport interface FeaturedBlogPostItem {\n  /** \u5C01\u9762\u56FE\u7247 */\n  image: {\n    mobile?: Img\n    pad?: Img\n    laptop?: Img\n    desktop?: Img\n    lgDesktop?: Img\n  }\n  /** \u6587\u7AE0\u6807\u9898 */\n  title: string\n  /** \u6587\u7AE0\u63CF\u8FF0 */\n  description?: string\n  /** \u65E5\u671F\u4FE1\u606F\uFF08\u5206\u7C7B\u00B7\u65E5\u671F\u00B7\u4F5C\u8005\uFF09 */\n  date?: string\n  /** \u6587\u7AE0\u94FE\u63A5 */\n  link?: string\n  /** \u5361\u7247\u5BBD\u5EA6\u6BD4\u4F8B\uFF0C\u9ED8\u8BA4 full */\n  width?: FeaturedBlogPostSpan\n}\n\n/**\n * FeaturedBlogPosts \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface FeaturedBlogPostsData {\n  /** \u4E3B\u6807\u9898 */\n  title?: string\n  /** \u526F\u6807\u9898 */\n  subtitle?: string\n  /** \u535A\u6587\u5217\u8868 */\n  items: FeaturedBlogPostItem[]\n}\n\nexport interface FeaturedBlogPostsProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: FeaturedBlogPostsData\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n  classNames?: Partial<Record<FeaturedBlogPostsSemanticName, string>>\n  /** \u5361\u7247\u70B9\u51FB\u56DE\u8C03 */\n  onItemClick?: (item: FeaturedBlogPostItem, index: number, event: React.MouseEvent) => void\n}\n\n/**\n * \u54CD\u5E94\u5F0F\u56FE\u7247\u7C7B\u578B\n */\ntype ResponsiveImage = FeaturedBlogPostItem['image']\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61\u8F6C\u4E3A Picture source \u683C\u5F0F\u5B57\u7B26\u4E32\n * \u683C\u5F0F: \"url1 1920, url2 1440, url3 1024, url4 768, url5 390\"\n */\nconst getImageSource = (image: ResponsiveImage): string => {\n  const breakpoints: { key: keyof ResponsiveImage; width: number }[] = [\n    { key: 'lgDesktop', width: 1920 },\n    { key: 'desktop', width: 1440 },\n    { key: 'laptop', width: 1024 },\n    { key: 'pad', width: 768 },\n    { key: 'mobile', width: 390 },\n  ]\n\n  const sources = breakpoints\n    .filter(({ key }) => image[key]?.url)\n    .map(({ key, width }) => `${image[key]!.url} ${width}`)\n\n  // \u5982\u679C\u6709 sources\uFF0C\u8FD4\u56DE\u62FC\u63A5\u7ED3\u679C\uFF1B\u5426\u5219\u8FD4\u56DE\u7B2C\u4E00\u4E2A\u6709\u6548\u7684 url\n  if (sources.length > 0) {\n    return sources.join(', ')\n  }\n\n  // fallback: \u8FD4\u56DE\u4EFB\u610F\u4E00\u4E2A\u6709\u6548\u7684 url\n  for (const { key } of breakpoints) {\n    if (image[key]?.url) return image[key]!.url\n  }\n\n  return ''\n}\n\n/**\n * \u4ECE\u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61\u83B7\u53D6 alt \u6587\u672C\n */\nconst getImageAlt = (image: ResponsiveImage, fallback: string): string => {\n  const keys: (keyof ResponsiveImage)[] = ['desktop', 'laptop', 'pad', 'mobile', 'lgDesktop']\n  for (const key of keys) {\n    if (image[key]?.alt) return image[key]!.alt!\n  }\n  return fallback\n}\n\n/**\n * \u6839\u636E span \u83B7\u53D6\u5361\u7247 grid \u5217\u6570 (laptop+)\n */\nconst getSpanClass = (span: FeaturedBlogPostSpan = 'full') => {\n  const spanMap: Record<FeaturedBlogPostSpan, string> = {\n    full: 'laptop:col-span-3',\n    '2/3': 'laptop:col-span-2',\n    '1/3': 'laptop:col-span-1',\n  }\n  return spanMap[span]\n}\n\n/**\n * \u6839\u636E span \u83B7\u53D6\u5361\u7247\u5E03\u5C40\u65B9\u5411 (laptop+)\n * 1/3: \u4E0A\u4E0B\u5E03\u5C40\uFF0C\u5176\u4ED6: \u5DE6\u53F3\u5E03\u5C40\n */\nconst getLayoutClass = (span: FeaturedBlogPostSpan = 'full') => {\n  return span === '1/3' ? '' : 'laptop:flex-row'\n}\n\n/**\n * \u6839\u636E span \u83B7\u53D6\u56FE\u7247\u5C3A\u5BF8\u6837\u5F0F (laptop+)\n * full: \u5DE6\u53F3\u5E03\u5C40\uFF0C\u56FE\u7247\u5BBD\u5EA6\u5360 2/3\n * 2/3: \u5DE6\u53F3\u5E03\u5C40\uFF0C\u56FE\u7247\u5BBD\u5EA6\u5360 1/2\n * 1/3: \u4E0A\u4E0B\u5E03\u5C40\uFF0C\u56FE\u7247\u9AD8\u5EA6\u586B\u6EE1\u5269\u4F59\u7A7A\u95F4\n */\nconst getImageSizeClass = (span: FeaturedBlogPostSpan = 'full') => {\n  const sizeMap: Record<FeaturedBlogPostSpan, string> = {\n    full: 'laptop:w-2/3 aspect-[356/200] tablet:aspect-[704/200] laptop:aspect-[2/1] desktop:aspect-[19/9] lg-desktop:aspect-[7/3]',\n    '2/3':\n      'laptop:w-1/2 aspect-[356/200] tablet:aspect-[704/200] laptop:aspect-[1/1] desktop:aspect-[16/15] lg-desktop:aspect-[8/7]',\n    '1/3':\n      'laptop:flex-1 aspect-[356/200] tablet:aspect-[704/200] laptop:aspect-[256/153] desktop:aspect-[379/192] lg-desktop:aspect-[480/248]',\n  }\n  return sizeMap[span]\n}\n\n/**\n * FeaturedBlogPosts - \u7CBE\u9009\u535A\u6587\n *\n * @description \u5C55\u793A\u7ECF\u8FC7\u7B5B\u9009\u7684\u4F18\u8D28\u6587\u7AE0\uFF0C\u652F\u6301\u4E0D\u540C\u5BBD\u5EA6\u548C\u5E03\u5C40\u7684\u5361\u7247\u7EC4\u5408\n */\nconst FeaturedBlogPostsBase = React.forwardRef<HTMLDivElement, FeaturedBlogPostsProps>(\n  ({ className, classNames = {}, data, onItemClick, ...props }, ref) => {\n    const { title, subtitle, items } = data\n\n    const handleCardClick = React.useCallback(\n      (item: FeaturedBlogPostItem, index: number) => (event: React.MouseEvent) => {\n        onItemClick?.(item, index, event)\n      },\n      [onItemClick]\n    )\n\n    return (\n      <div\n        ref={ref}\n        className={cn('blog-posts-root', 'text-info-primary w-full', className, classNames.root)}\n        {...props}\n      >\n        {/* \u6807\u9898\u533A\u57DF */}\n        {(title || subtitle) && (\n          <div className={cn('blog-posts-header mb-6', classNames.header)}>\n            {title && <Heading as=\"h2\" size={4} html={title} className={cn('blog-posts-title', classNames.title)} />}\n            {subtitle && <Text as=\"p\" size={3} className={cn('', classNames?.subtitle)} html={subtitle} />}\n          </div>\n        )}\n        <div className={cn('blog-posts-grid', 'laptop:grid-cols-3 grid grid-cols-1 gap-4', classNames.grid)}>\n          {items.map((item, index) => {\n            const CardWrapper = item.link ? 'a' : 'div'\n            const cardProps = item.link ? { href: item.link } : {}\n\n            return (\n              <React.Fragment key={index}>\n                <CardWrapper\n                  {...cardProps}\n                  className={cn(\n                    'blog-posts-card rounded-box',\n                    'flex cursor-pointer flex-col gap-4',\n                    'laptop:bg-container-secondary-0 laptop:p-4 desktop:p-6 lg-desktop:p-8',\n                    'laptop:overflow-hidden laptop:transition-opacity ',\n                    'bg-container-secondary-1',\n                    getSpanClass(item.width || 'full'),\n                    getLayoutClass(item.width || 'full'),\n                    classNames.card\n                  )}\n                  onClick={handleCardClick(item, index)}\n                >\n                  {/* \u56FE\u7247 */}\n                  <div\n                    className={cn(\n                      'blog-posts-card-image',\n                      'relative w-full overflow-hidden',\n                      'laptop:min-h-0 min-h-[200px] shrink-0',\n                      getImageSizeClass(item.width || 'full'),\n                      classNames.cardImage\n                    )}\n                  >\n                    <Picture\n                      source={getImageSource(item.image)}\n                      alt={getImageAlt(item.image, item.title)}\n                      className=\"rounded-t-box h-full object-cover\"\n                      imgClassName={\n                        item.width === '1/3'\n                          ? 'h-auto object-cover'\n                          : 'w-full laptop:h-full laptop:w-[unset] object-cover'\n                      }\n                    />\n                  </div>\n\n                  {/* \u5185\u5BB9 */}\n                  <div\n                    className={cn(\n                      'blog-posts-card-content',\n                      'desktop:gap-6 flex flex-col justify-center gap-4',\n                      classNames.cardContent\n                    )}\n                  >\n                    <div className=\"desktop:gap-2 flex flex-col gap-1\">\n                      <Heading\n                        size={2}\n                        as=\"h6\"\n                        className={cn('blog-posts-card-title line-clamp-3', classNames.cardTitle)}\n                        html={item.title}\n                      />\n\n                      {item.description && (\n                        <Text\n                          className={cn(\n                            'blog-posts-card-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-3 text-[14px]',\n                            classNames.cardDescription\n                          )}\n                          html={item.description}\n                        />\n                      )}\n                    </div>\n                    {item.date && (\n                      <Text\n                        className={cn(\n                          'blog-posts-card-meta',\n                          'text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[14px]',\n                          classNames.cardMeta\n                        )}\n                        html={item.date}\n                      />\n                    )}\n                  </div>\n                </CardWrapper>\n\n                {/* \u5206\u5272\u7EBF - \u4EC5 mobile/tablet \u663E\u793A */}\n                {index < items.length - 1 && (\n                  <div\n                    className={cn(\n                      'blog-posts-separator',\n                      'bg-lines-primary laptop:hidden h-px w-full',\n                      classNames.separator\n                    )}\n                  />\n                )}\n              </React.Fragment>\n            )\n          })}\n        </div>\n      </div>\n    )\n  }\n)\n\nFeaturedBlogPostsBase.displayName = 'FeaturedBlogPosts'\n\nconst FeaturedBlogPosts = withLayout(FeaturedBlogPostsBase)\n\nexport default FeaturedBlogPosts\n"],
+  "mappings": "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",
   "names": ["FeaturedBlogPosts_exports", "__export", "FeaturedBlogPosts_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_picture", "import__", "import_Styles", "getImageSource", "image", "breakpoints", "sources", "key", "width", "getImageAlt", "fallback", "keys", "getSpanClass", "span", "getLayoutClass", "getImageSizeClass", "FeaturedBlogPostsBase", "className", "classNames", "data", "onItemClick", "props", "ref", "title", "subtitle", "items", "handleCardClick", "item", "index", "event", "CardWrapper", "cardProps", "Picture", "FeaturedBlogPosts"]
 }

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

@@ -38,6 +38,8 @@ export interface KspData {
     items: KspCardItem[];
     /** 主题，默认 light */
     theme?: Theme;
+    /** 栅格列数，默认 "10" */
+    gridColumns?: string;
 }
 /**
  * Ksp 组件语义化类名配置

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var M=Object.defineProperty;var H=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var V=(p,t)=>{for(var e in t)M(p,e,{get:t[e],enumerable:!0})},E=(p,t,e,k)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of O(t))!R.call(p,s)&&s!==e&&M(p,s,{get:()=>t[s],enumerable:!(k=H(t,s))||k.enumerable});return p};var F=p=>E(M({},"__esModule",{value:!0}),p);var _={};V(_,{default:()=>Y});module.exports=F(_);var a=require("react/jsx-runtime"),x=require("react-responsive"),d=require("../../components/index.js"),c=require("../../helpers/utils.js"),z=require("../../shared/Styles.js");const G=({title:p,desc:t,mobImage:e,mobVideo:k,tabletImage:s,tabletVideo:r,laptopImage:h,laptopVideo:i,desktopImage:l,desktopVideo:m,image:w,video:f,className:L,theme:j,classNames:o})=>{const N=(0,x.useMediaQuery)({query:"(max-width: 767px)"}),K=(0,x.useMediaQuery)({query:"(min-width: 768px) and (max-width: 1024px)"}),T=(0,x.useMediaQuery)({query:"(min-width: 1025px) and (max-width: 1439px)"}),D=()=>N?k||r||i||m||f:K?r||i||m||f:T?i||m||f:m||f,I=()=>N?e||s||h||l||w:K?s||h||l||w:T?h||l||w:l||w,v=D(),P=I(),$=()=>{const n=[],y=w?.url||l?.url,b=l?.url||w?.url,g=h?.url||b,u=s?.url||g,C=e?.url||u;return y&&n.push(y),b&&b!==y&&n.push(`${b} 1920`),g&&g!==b&&n.push(`${g} 1440`),u&&u!==g&&n.push(`${u} 1025`),C&&C!==u&&n.push(`${C} 768`),n.length>0?n.join(", "):void 0},q=!!v?.url,A=!!(e?.url||s?.url||h?.url||l?.url||w?.url);return(0,a.jsxs)("div",{className:(0,c.cn)("ksp-card rounded-box text-info-primary relative overflow-hidden",{"aiui-dark":j==="dark"},L,o?.card),children:[q?(0,a.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,loop:!0,src:v?.url,poster:P?.url,className:(0,c.cn)("ksp-card-video absolute bottom-0 w-full object-cover",o?.cardVideo)}):A&&(0,a.jsx)(d.Picture,{source:$(),alt:P?.alt||"",className:(0,c.cn)("ksp-card-image size-full",o?.cardImage),imgClassName:(0,c.cn)("size-full object-cover object-bottom",o?.cardImageImg)}),(0,a.jsxs)("div",{className:(0,c.cn)("ksp-card-content desktop:p-6 lg-desktop:p-8 p-4",o?.cardContent),children:[(0,a.jsx)(d.Heading,{size:3,html:p,className:(0,c.cn)("ksp-card-title tablet:block hidden w-full",o?.cardTitle)}),(0,a.jsx)(d.Heading,{size:2,html:p,className:(0,c.cn)("ksp-card-title tablet:hidden tablet:w-[340px] xs-tablet:text-[16px] block w-full",o?.cardTitle)}),(0,a.jsx)(d.Text,{size:2,html:t,className:(0,c.cn)("ksp-card-desc text-info-primary tablet:block tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",o?.cardDesc)})]})]})},Q={4:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",3:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]"},5:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",4:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]"},6:{0:"col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",5:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"},7:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",5:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",6:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]"},8:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",3:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",5:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",6:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",7:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"},9:{0:"col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-1 tablet:col-span-2 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",5:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",6:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",7:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",8:"col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"}},S=(p,t)=>Q[t]?.[p]||"";function U({data:p,className:t,classNames:e,...k}){const{title:s,items:r,theme:h="light"}=p;return(0,a.jsxs)("section",{...k,"data-ui-component-id":"ksp",className:(0,c.cn)("ksp-container text-info-primary laptop:scroll-mt-[46px] flex scroll-mt-[108px] flex-col justify-center",{"aiui-dark":h==="dark"},t,e?.root),children:[(0,a.jsx)(d.Heading,{as:"h1",size:4,html:s,className:(0,c.cn)("ksp-title laptop:text-center text-left",e?.title)}),(0,a.jsx)("div",{className:(0,c.cn)("ksp-layout tablet:grid-cols-3 laptop:grid-cols-10 laptop:gap-4 mt-[24px] grid grid-cols-2 gap-3",e?.layout),children:r.map((i,l)=>(0,a.jsx)(G,{...i,className:S(l,r.length),classNames:e},l))})]})}var Y=(0,z.withLayout)(U);
+"use strict";"use client";var M=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var q=Object.prototype.hasOwnProperty;var H=(a,t)=>{for(var p in t)M(a,p,{get:t[p],enumerable:!0})},V=(a,t,p,k)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of $(t))!q.call(a,e)&&e!==p&&M(a,e,{get:()=>t[e],enumerable:!(k=_(t,e))||k.enumerable});return a};var F=a=>V(M({},"__esModule",{value:!0}),a);var B={};H(B,{default:()=>S});module.exports=F(B);var s=require("react/jsx-runtime"),x=require("react-responsive"),h=require("../../components/index.js"),c=require("../../helpers/utils.js"),L=require("../../shared/Styles.js");const G=({title:a,desc:t,mobImage:p,mobVideo:k,tabletImage:e,tabletVideo:i,laptopImage:n,laptopVideo:b,desktopImage:o,desktopVideo:r,image:l,video:w,className:z,theme:I,classNames:d})=>{const N=(0,x.useMediaQuery)({query:"(max-width: 767px)"}),T=(0,x.useMediaQuery)({query:"(min-width: 768px) and (max-width: 1024px)"}),K=(0,x.useMediaQuery)({query:"(min-width: 1025px) and (max-width: 1439px)"}),j=()=>N?k||i||b||r||w:T?i||b||r||w:K?b||r||w:r||w,D=()=>N?p||e||n||o||l:T?e||n||o||l:K?n||o||l:o||l,v=j(),P=D(),O=()=>{const g=[],C=l?.url||o?.url,u=o?.url||l?.url,m=n?.url||u,f=e?.url||m,y=p?.url||f;return C&&g.push(C),u&&u!==C&&g.push(`${u} 1920`),m&&m!==u&&g.push(`${m} 1440`),f&&f!==m&&g.push(`${f} 1025`),y&&y!==f&&g.push(`${y} 768`),g.length>0?g.join(", "):void 0},R=!!v?.url,A=!!(p?.url||e?.url||n?.url||o?.url||l?.url);return(0,s.jsxs)("div",{className:(0,c.cn)("ksp-card rounded-box text-info-primary relative overflow-hidden",{"aiui-dark":I==="dark"},z,d?.card),children:[R?(0,s.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,loop:!0,src:v?.url,poster:P?.url,className:(0,c.cn)("ksp-card-video absolute bottom-0 w-full object-cover",d?.cardVideo)}):A&&(0,s.jsx)(h.Picture,{source:O(),alt:P?.alt||"",className:(0,c.cn)("ksp-card-image size-full",d?.cardImage),imgClassName:(0,c.cn)("size-full object-cover object-bottom",d?.cardImageImg)}),(0,s.jsxs)("div",{className:(0,c.cn)("ksp-card-content desktop:p-6 lg-desktop:p-8 p-4",d?.cardContent),children:[(0,s.jsx)(h.Heading,{size:3,html:a,className:(0,c.cn)("ksp-card-title tablet:block hidden w-full",d?.cardTitle)}),(0,s.jsx)(h.Heading,{size:2,html:a,className:(0,c.cn)("ksp-card-title tablet:hidden tablet:w-[340px] xs-tablet:text-[16px] block w-full",d?.cardTitle)}),(0,s.jsx)(h.Text,{size:2,html:t,className:(0,c.cn)("ksp-card-desc text-info-primary tablet:block tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",d?.cardDesc)})]})]})},U={4:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",3:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]"},5:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",4:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]"},6:{0:"col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",5:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"},7:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",5:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",6:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]"},8:{0:"col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",3:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",5:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",6:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",7:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"},9:{0:"col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",1:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",2:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",3:"col-span-1 tablet:col-span-2 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",4:"col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",5:"col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",6:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",7:"col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]",8:"col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"}},Y={4:{0:"col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",1:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",2:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]"},5:{0:"col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",1:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",2:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",3:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",4:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"},6:{0:"col-span-2 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",1:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",2:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",4:"col-span-1 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",5:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]"},7:{0:"col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",1:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",2:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",4:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",5:"col-span-1 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",6:"col-span-2 tablet:col-span-2 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"},8:{0:"col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",1:"col-span-2 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",2:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",3:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",4:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",5:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",6:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",7:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]"},9:{0:"col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",1:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",2:"col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]",3:"col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",4:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",5:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",6:"col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]",7:"col-span-1 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]",8:"col-span-2 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]"}},E=(a,t,p)=>(p===12?Y:U)[t]?.[a]||"";function Q({data:a,className:t,classNames:p,...k}){const{title:e,items:i,theme:n="light",gridColumns:b}=a,o=b?Number(b):10,r=o===12;return(0,s.jsxs)("section",{...k,"data-ui-component-id":"ksp",className:(0,c.cn)("ksp-container text-info-primary laptop:scroll-mt-[46px] flex scroll-mt-[108px] flex-col justify-center",{"aiui-dark":n==="dark"},t,p?.root),children:[(0,s.jsx)(h.Heading,{as:"h1",size:4,html:e,className:(0,c.cn)("ksp-title laptop:text-center text-left",p?.title)}),(0,s.jsx)("div",{className:(0,c.cn)("ksp-layout tablet:grid-cols-3 laptop:gap-4 mt-[24px] grid grid-cols-2 gap-3",r?"laptop:grid-cols-12":"laptop:grid-cols-10",p?.layout),children:i.map((l,w)=>(0,s.jsx)(G,{...l,className:E(w,i.length,o),classNames:p},w))})]})}var S=(0,L.withLayout)(Q);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Ksp/index.tsx"],
-  "sourcesContent": ["'use client'\n\nimport { useMediaQuery } from 'react-responsive'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media, Theme } from '../../types/props.js'\n\n/**\n * KSP \u5361\u7247\u9879\u6570\u636E\u7ED3\u6784\n */\nexport interface KspCardItem {\n  /** \u6807\u9898 */\n  title?: string\n  /** \u63CF\u8FF0 */\n  desc?: string\n  /** \u79FB\u52A8\u7AEF\u56FE\u7247 */\n  mobImage?: Media\n  /** \u79FB\u52A8\u7AEF\u89C6\u9891 */\n  mobVideo?: Media\n\n  /** \u5E73\u677F\u7AEF\u56FE\u7247 (\u2265768px) */\n  tabletImage?: Media\n  /** \u5E73\u677F\u7AEF\u89C6\u9891 (\u2265768px) */\n  tabletVideo?: Media\n\n  /** \u5C0F\u684C\u9762\u7AEF\u56FE\u7247 (\u22651025px) */\n  laptopImage?: Media\n  /** \u5C0F\u684C\u9762\u7AEF\u89C6\u9891 (\u22651025px) */\n  laptopVideo?: Media\n\n  /** \u684C\u9762\u7AEF\u56FE\u7247 (\u22651440px) */\n  desktopImage?: Media\n  /** \u684C\u9762\u7AEF\u89C6\u9891 (\u22651440px) */\n  desktopVideo?: Media\n  /** \u5927\u684C\u9762\u7AEF\u56FE\u7247 */\n  image?: Media\n  /** \u5927\u684C\u9762\u7AEF\u89C6\u9891 */\n  video?: Media\n}\n\n/**\n * KSP \u6570\u636E\u7ED3\u6784\n */\nexport interface KspData {\n  /** \u4E3B\u6807\u9898 */\n  title?: string\n  /** KSP \u5361\u7247\u5217\u8868\uFF08\u9700\u8981 7 \u4E2A\u9879\uFF09 */\n  items: KspCardItem[]\n  /** \u4E3B\u9898\uFF0C\u9ED8\u8BA4 light */\n  theme?: Theme\n}\n\n/**\n * Ksp \u7EC4\u4EF6\u8BED\u4E49\u5316\u7C7B\u540D\u914D\u7F6E\n */\nexport interface KspClassNames {\n  /** \u6574\u4F53\u5BB9\u5668\u7C7B\u540D */\n  root?: string\n  /** \u4E3B\u6807\u9898\u7C7B\u540D */\n  title?: string\n  /** \u5361\u7247\u5E03\u5C40\u5BB9\u5668\u7C7B\u540D */\n  layout?: string\n  /** \u5355\u4E2A\u5361\u7247\u7C7B\u540D */\n  card?: string\n  /** \u5361\u7247\u89C6\u9891\u7C7B\u540D */\n  cardVideo?: string\n  /** \u5361\u7247\u56FE\u7247\u7C7B\u540D */\n  cardImage?: string\n  /** \u5361\u7247\u56FE\u7247 img \u5143\u7D20\u7C7B\u540D */\n  cardImageImg?: string\n  /** \u5361\u7247\u5185\u5BB9\u533A\u7C7B\u540D */\n  cardContent?: string\n  /** \u5361\u7247\u6807\u9898\u7C7B\u540D */\n  cardTitle?: string\n  /** \u5361\u7247\u63CF\u8FF0\u7C7B\u540D */\n  cardDesc?: string\n}\n\n/**\n * Ksp \u7EC4\u4EF6 Props\n */\nexport interface KspProps extends Omit<React.HTMLAttributes<HTMLElement>, 'className'> {\n  /** KSP \u6570\u636E */\n  data: KspData\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u914D\u7F6E */\n  classNames?: KspClassNames\n}\n\ninterface ImageCardProps extends KspCardItem {\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n  /** \u4E3B\u9898 */\n  theme?: Theme\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u914D\u7F6E */\n  classNames?: KspClassNames\n}\n\nconst ImageCard = ({\n  title,\n  desc,\n  // \u65B0\u7684\u65AD\u70B9\u5A92\u4F53\u5C5E\u6027\n  mobImage,\n  mobVideo,\n  tabletImage,\n  tabletVideo,\n  laptopImage,\n  laptopVideo,\n  desktopImage,\n  desktopVideo,\n  // \u4FDD\u7559\u65E7\u5C5E\u6027\u4F5C\u4E3A\u5927\u5C4F\u9ED8\u8BA4\u503C\n  image,\n  video,\n  className,\n  theme,\n  classNames,\n}: ImageCardProps) => {\n  // \u54CD\u5E94\u5F0F\u65AD\u70B9\u68C0\u6D4B\n  const isMobile = useMediaQuery({ query: '(max-width: 767px)' })\n  const isTablet = useMediaQuery({ query: '(min-width: 768px) and (max-width: 1024px)' })\n  const isLaptop = useMediaQuery({ query: '(min-width: 1025px) and (max-width: 1439px)' })\n  // desktop \u53CA\u4EE5\u4E0A\u4F7F\u7528\u9ED8\u8BA4\n\n  // \u83B7\u53D6\u5F53\u524D\u65AD\u70B9\u7684\u89C6\u9891\u6E90\uFF08\u5E26 fallback\uFF09\n  const getCurrentVideo = (): Media | undefined => {\n    if (isMobile) return mobVideo || tabletVideo || laptopVideo || desktopVideo || video\n    if (isTablet) return tabletVideo || laptopVideo || desktopVideo || video\n    if (isLaptop) return laptopVideo || desktopVideo || video\n    return desktopVideo || video\n  }\n\n  // \u83B7\u53D6\u5F53\u524D\u65AD\u70B9\u7684\u5C01\u9762\u56FE\n  const getCurrentPoster = (): Media | undefined => {\n    if (isMobile) return mobImage || tabletImage || laptopImage || desktopImage || image\n    if (isTablet) return tabletImage || laptopImage || desktopImage || image\n    if (isLaptop) return laptopImage || desktopImage || image\n    return desktopImage || image\n  }\n\n  const currentVideo = getCurrentVideo()\n  const currentPoster = getCurrentPoster()\n\n  // \u6784\u5EFA\u54CD\u5E94\u5F0F\u56FE\u7247\u6E90\n  const buildImageSource = (): string | undefined => {\n    const sources: string[] = []\n    const lgDesktop = image?.url || desktopImage?.url\n    const desktop = desktopImage?.url || image?.url\n    const laptop = laptopImage?.url || desktop\n    const tablet = tabletImage?.url || laptop\n    const mobile = mobImage?.url || tablet\n\n    if (lgDesktop) sources.push(lgDesktop)\n    if (desktop && desktop !== lgDesktop) sources.push(`${desktop} 1920`)\n    if (laptop && laptop !== desktop) sources.push(`${laptop} 1440`)\n    if (tablet && tablet !== laptop) sources.push(`${tablet} 1025`)\n    if (mobile && mobile !== tablet) sources.push(`${mobile} 768`)\n\n    return sources.length > 0 ? sources.join(', ') : undefined\n  }\n\n  // \u5224\u65AD\u662F\u5426\u6709\u89C6\u9891\n  const hasVideo = !!currentVideo?.url\n\n  // \u5224\u65AD\u662F\u5426\u6709\u4EFB\u4F55\u56FE\u7247\n  const hasAnyImage = !!(mobImage?.url || tabletImage?.url || laptopImage?.url || desktopImage?.url || image?.url)\n\n  return (\n    <div\n      className={cn(\n        'ksp-card rounded-box text-info-primary relative overflow-hidden',\n        {\n          'aiui-dark': theme === 'dark',\n        },\n        className,\n        classNames?.card\n      )}\n    >\n      {hasVideo ? (\n        <video\n          playsInline\n          autoPlay\n          muted\n          loop\n          src={currentVideo?.url}\n          poster={currentPoster?.url}\n          className={cn('ksp-card-video absolute bottom-0 w-full object-cover', classNames?.cardVideo)}\n        />\n      ) : (\n        hasAnyImage && (\n          <Picture\n            source={buildImageSource()}\n            alt={currentPoster?.alt || ''}\n            className={cn('ksp-card-image size-full', classNames?.cardImage)}\n            imgClassName={cn('size-full object-cover object-bottom', classNames?.cardImageImg)}\n          />\n        )\n      )}\n      <div className={cn('ksp-card-content desktop:p-6 lg-desktop:p-8 p-4', classNames?.cardContent)}>\n        <Heading\n          size={3}\n          html={title}\n          className={cn('ksp-card-title tablet:block hidden w-full', classNames?.cardTitle)}\n        />\n        <Heading\n          size={2}\n          html={title}\n          className={cn(\n            'ksp-card-title tablet:hidden tablet:w-[340px] xs-tablet:text-[16px] block w-full',\n            classNames?.cardTitle\n          )}\n        />\n        <Text\n          size={2}\n          html={desc}\n          className={cn(\n            'ksp-card-desc text-info-primary tablet:block tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]',\n            classNames?.cardDesc\n          )}\n        />\n      </div>\n    </div>\n  )\n}\n\n/**\n * \u5E03\u5C40\u914D\u7F6E\u6620\u5C04\u8868\n * \u6839\u636E items \u6570\u91CF\u548C\u7D22\u5F15\u4F4D\u7F6E\uFF0C\u5B9A\u4E49\u6BCF\u4E2A\u5361\u7247\u7684\u6805\u683C\u5E03\u5C40\u7C7B\u540D\n */\nconst LAYOUT_CONFIG: Record<number, Record<number, string>> = {\n  4: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n  },\n  5: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    4: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n  },\n  6: {\n    0: 'col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n  7: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    6: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n  },\n  8: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    5: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    6: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    7: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n  9: {\n    0: 'col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 tablet:col-span-2 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    5: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    6: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    7: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    8: 'col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n}\n\n/**\n * \u83B7\u53D6\u5361\u7247\u7684\u5E03\u5C40\u7C7B\u540D\n * @param index - \u5361\u7247\u7D22\u5F15\n * @param totalCount - \u5361\u7247\u603B\u6570\n * @returns \u5E03\u5C40\u7C7B\u540D\n */\nconst getCardLayoutClass = (index: number, totalCount: number): string => {\n  return LAYOUT_CONFIG[totalCount]?.[index] || ''\n}\n\n/**\n * Ksp - Key Selling Point \u5173\u952E\u5356\u70B9\u7EC4\u4EF6\n *\n * \u5C55\u793A\u4EA7\u54C1\u7684\u5173\u952E\u5356\u70B9\uFF0C\u652F\u6301\u56FE\u7247\u548C\u89C6\u9891\uFF0C\u5177\u6709\u590D\u6742\u7684\u54CD\u5E94\u5F0F\u5E03\u5C40\u3002\n * \u5E03\u5C40\u652F\u6301 4-9 \u4E2A\u5361\u7247\u9879\uFF0C\u5206\u522B\u5BF9\u5E94\u4E0D\u540C\u5C3A\u5BF8\u548C\u4F4D\u7F6E\u3002\n *\n * @example\n * ```tsx\n * <Ksp\n *   data={{\n *     title: '\u4E3A\u4EC0\u4E48\u9009\u62E9\u6211\u4EEC',\n *     items: [\n *       {\n *         title: '\u9AD8\u6027\u80FD',\n *         desc: '\u5F3A\u5927\u7684\u5904\u7406\u80FD\u529B',\n *         image: '/desktop.jpg',\n *         mobImage: '/mobile.jpg'\n *       },\n *       // ... \u9700\u8981 4-9 \u4E2A\u9879\n *     ]\n *   }}\n * />\n * ```\n */\nfunction Ksp({ data, className, classNames, ...rest }: KspProps) {\n  const { title, items, theme = 'light' } = data\n  return (\n    <section\n      {...rest}\n      data-ui-component-id=\"ksp\"\n      className={cn(\n        'ksp-container text-info-primary laptop:scroll-mt-[46px] flex scroll-mt-[108px] flex-col justify-center',\n        {\n          'aiui-dark': theme === 'dark',\n        },\n        className,\n        classNames?.root\n      )}\n    >\n      <Heading\n        as=\"h1\"\n        size={4}\n        html={title}\n        className={cn('ksp-title laptop:text-center text-left', classNames?.title)}\n      />\n      <div\n        className={cn(\n          'ksp-layout tablet:grid-cols-3 laptop:grid-cols-10 laptop:gap-4 mt-[24px] grid grid-cols-2 gap-3',\n          classNames?.layout\n        )}\n      >\n        {items.map((item, index) => (\n          <ImageCard\n            key={index}\n            {...item}\n            className={getCardLayoutClass(index, items.length)}\n            classNames={classNames}\n          />\n        ))}\n      </div>\n    </section>\n  )\n}\n\nexport default withLayout(Ksp)\n"],
-  "mappings": "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",
-  "names": ["Ksp_exports", "__export", "Ksp_default", "__toCommonJS", "import_jsx_runtime", "import_react_responsive", "import_components", "import_utils", "import_Styles", "ImageCard", "title", "desc", "mobImage", "mobVideo", "tabletImage", "tabletVideo", "laptopImage", "laptopVideo", "desktopImage", "desktopVideo", "image", "video", "className", "theme", "classNames", "isMobile", "isTablet", "isLaptop", "getCurrentVideo", "getCurrentPoster", "currentVideo", "currentPoster", "buildImageSource", "sources", "lgDesktop", "desktop", "laptop", "tablet", "mobile", "hasVideo", "hasAnyImage", "LAYOUT_CONFIG", "getCardLayoutClass", "index", "totalCount", "Ksp", "data", "rest", "items", "item"]
+  "sourcesContent": ["'use client'\n\nimport { useMediaQuery } from 'react-responsive'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media, Theme } from '../../types/props.js'\n\n/**\n * KSP \u5361\u7247\u9879\u6570\u636E\u7ED3\u6784\n */\nexport interface KspCardItem {\n  /** \u6807\u9898 */\n  title?: string\n  /** \u63CF\u8FF0 */\n  desc?: string\n  /** \u79FB\u52A8\u7AEF\u56FE\u7247 */\n  mobImage?: Media\n  /** \u79FB\u52A8\u7AEF\u89C6\u9891 */\n  mobVideo?: Media\n\n  /** \u5E73\u677F\u7AEF\u56FE\u7247 (\u2265768px) */\n  tabletImage?: Media\n  /** \u5E73\u677F\u7AEF\u89C6\u9891 (\u2265768px) */\n  tabletVideo?: Media\n\n  /** \u5C0F\u684C\u9762\u7AEF\u56FE\u7247 (\u22651025px) */\n  laptopImage?: Media\n  /** \u5C0F\u684C\u9762\u7AEF\u89C6\u9891 (\u22651025px) */\n  laptopVideo?: Media\n\n  /** \u684C\u9762\u7AEF\u56FE\u7247 (\u22651440px) */\n  desktopImage?: Media\n  /** \u684C\u9762\u7AEF\u89C6\u9891 (\u22651440px) */\n  desktopVideo?: Media\n  /** \u5927\u684C\u9762\u7AEF\u56FE\u7247 */\n  image?: Media\n  /** \u5927\u684C\u9762\u7AEF\u89C6\u9891 */\n  video?: Media\n}\n\n/**\n * KSP \u6570\u636E\u7ED3\u6784\n */\nexport interface KspData {\n  /** \u4E3B\u6807\u9898 */\n  title?: string\n  /** KSP \u5361\u7247\u5217\u8868\uFF08\u9700\u8981 7 \u4E2A\u9879\uFF09 */\n  items: KspCardItem[]\n  /** \u4E3B\u9898\uFF0C\u9ED8\u8BA4 light */\n  theme?: Theme\n  /** \u6805\u683C\u5217\u6570\uFF0C\u9ED8\u8BA4 \"10\" */\n  gridColumns?: string\n}\n\n/**\n * Ksp \u7EC4\u4EF6\u8BED\u4E49\u5316\u7C7B\u540D\u914D\u7F6E\n */\nexport interface KspClassNames {\n  /** \u6574\u4F53\u5BB9\u5668\u7C7B\u540D */\n  root?: string\n  /** \u4E3B\u6807\u9898\u7C7B\u540D */\n  title?: string\n  /** \u5361\u7247\u5E03\u5C40\u5BB9\u5668\u7C7B\u540D */\n  layout?: string\n  /** \u5355\u4E2A\u5361\u7247\u7C7B\u540D */\n  card?: string\n  /** \u5361\u7247\u89C6\u9891\u7C7B\u540D */\n  cardVideo?: string\n  /** \u5361\u7247\u56FE\u7247\u7C7B\u540D */\n  cardImage?: string\n  /** \u5361\u7247\u56FE\u7247 img \u5143\u7D20\u7C7B\u540D */\n  cardImageImg?: string\n  /** \u5361\u7247\u5185\u5BB9\u533A\u7C7B\u540D */\n  cardContent?: string\n  /** \u5361\u7247\u6807\u9898\u7C7B\u540D */\n  cardTitle?: string\n  /** \u5361\u7247\u63CF\u8FF0\u7C7B\u540D */\n  cardDesc?: string\n}\n\n/**\n * Ksp \u7EC4\u4EF6 Props\n */\nexport interface KspProps extends Omit<React.HTMLAttributes<HTMLElement>, 'className'> {\n  /** KSP \u6570\u636E */\n  data: KspData\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u914D\u7F6E */\n  classNames?: KspClassNames\n}\n\ninterface ImageCardProps extends KspCardItem {\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n  /** \u4E3B\u9898 */\n  theme?: Theme\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u914D\u7F6E */\n  classNames?: KspClassNames\n}\n\nconst ImageCard = ({\n  title,\n  desc,\n  // \u65B0\u7684\u65AD\u70B9\u5A92\u4F53\u5C5E\u6027\n  mobImage,\n  mobVideo,\n  tabletImage,\n  tabletVideo,\n  laptopImage,\n  laptopVideo,\n  desktopImage,\n  desktopVideo,\n  // \u4FDD\u7559\u65E7\u5C5E\u6027\u4F5C\u4E3A\u5927\u5C4F\u9ED8\u8BA4\u503C\n  image,\n  video,\n  className,\n  theme,\n  classNames,\n}: ImageCardProps) => {\n  // \u54CD\u5E94\u5F0F\u65AD\u70B9\u68C0\u6D4B\n  const isMobile = useMediaQuery({ query: '(max-width: 767px)' })\n  const isTablet = useMediaQuery({ query: '(min-width: 768px) and (max-width: 1024px)' })\n  const isLaptop = useMediaQuery({ query: '(min-width: 1025px) and (max-width: 1439px)' })\n  // desktop \u53CA\u4EE5\u4E0A\u4F7F\u7528\u9ED8\u8BA4\n\n  // \u83B7\u53D6\u5F53\u524D\u65AD\u70B9\u7684\u89C6\u9891\u6E90\uFF08\u5E26 fallback\uFF09\n  const getCurrentVideo = (): Media | undefined => {\n    if (isMobile) return mobVideo || tabletVideo || laptopVideo || desktopVideo || video\n    if (isTablet) return tabletVideo || laptopVideo || desktopVideo || video\n    if (isLaptop) return laptopVideo || desktopVideo || video\n    return desktopVideo || video\n  }\n\n  // \u83B7\u53D6\u5F53\u524D\u65AD\u70B9\u7684\u5C01\u9762\u56FE\n  const getCurrentPoster = (): Media | undefined => {\n    if (isMobile) return mobImage || tabletImage || laptopImage || desktopImage || image\n    if (isTablet) return tabletImage || laptopImage || desktopImage || image\n    if (isLaptop) return laptopImage || desktopImage || image\n    return desktopImage || image\n  }\n\n  const currentVideo = getCurrentVideo()\n  const currentPoster = getCurrentPoster()\n\n  // \u6784\u5EFA\u54CD\u5E94\u5F0F\u56FE\u7247\u6E90\n  const buildImageSource = (): string | undefined => {\n    const sources: string[] = []\n    const lgDesktop = image?.url || desktopImage?.url\n    const desktop = desktopImage?.url || image?.url\n    const laptop = laptopImage?.url || desktop\n    const tablet = tabletImage?.url || laptop\n    const mobile = mobImage?.url || tablet\n\n    if (lgDesktop) sources.push(lgDesktop)\n    if (desktop && desktop !== lgDesktop) sources.push(`${desktop} 1920`)\n    if (laptop && laptop !== desktop) sources.push(`${laptop} 1440`)\n    if (tablet && tablet !== laptop) sources.push(`${tablet} 1025`)\n    if (mobile && mobile !== tablet) sources.push(`${mobile} 768`)\n\n    return sources.length > 0 ? sources.join(', ') : undefined\n  }\n\n  // \u5224\u65AD\u662F\u5426\u6709\u89C6\u9891\n  const hasVideo = !!currentVideo?.url\n\n  // \u5224\u65AD\u662F\u5426\u6709\u4EFB\u4F55\u56FE\u7247\n  const hasAnyImage = !!(mobImage?.url || tabletImage?.url || laptopImage?.url || desktopImage?.url || image?.url)\n\n  return (\n    <div\n      className={cn(\n        'ksp-card rounded-box text-info-primary relative overflow-hidden',\n        {\n          'aiui-dark': theme === 'dark',\n        },\n        className,\n        classNames?.card\n      )}\n    >\n      {hasVideo ? (\n        <video\n          playsInline\n          autoPlay\n          muted\n          loop\n          src={currentVideo?.url}\n          poster={currentPoster?.url}\n          className={cn('ksp-card-video absolute bottom-0 w-full object-cover', classNames?.cardVideo)}\n        />\n      ) : (\n        hasAnyImage && (\n          <Picture\n            source={buildImageSource()}\n            alt={currentPoster?.alt || ''}\n            className={cn('ksp-card-image size-full', classNames?.cardImage)}\n            imgClassName={cn('size-full object-cover object-bottom', classNames?.cardImageImg)}\n          />\n        )\n      )}\n      <div className={cn('ksp-card-content desktop:p-6 lg-desktop:p-8 p-4', classNames?.cardContent)}>\n        <Heading\n          size={3}\n          html={title}\n          className={cn('ksp-card-title tablet:block hidden w-full', classNames?.cardTitle)}\n        />\n        <Heading\n          size={2}\n          html={title}\n          className={cn(\n            'ksp-card-title tablet:hidden tablet:w-[340px] xs-tablet:text-[16px] block w-full',\n            classNames?.cardTitle\n          )}\n        />\n        <Text\n          size={2}\n          html={desc}\n          className={cn(\n            'ksp-card-desc text-info-primary tablet:block tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]',\n            classNames?.cardDesc\n          )}\n        />\n      </div>\n    </div>\n  )\n}\n\n/**\n * 10 \u5217\u6805\u683C\u5E03\u5C40\u914D\u7F6E\u6620\u5C04\u8868\uFF08\u73B0\u6709\uFF0C\u9ED8\u8BA4\uFF09\n * \u6839\u636E items \u6570\u91CF\u548C\u7D22\u5F15\u4F4D\u7F6E\uFF0C\u5B9A\u4E49\u6BCF\u4E2A\u5361\u7247\u7684\u6805\u683C\u5E03\u5C40\u7C7B\u540D\n */\nconst LAYOUT_CONFIG_10: Record<number, Record<number, string>> = {\n  4: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n  },\n  5: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    4: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n  },\n  6: {\n    0: 'col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n  7: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-1 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    6: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n  },\n  8: {\n    0: 'col-span-2 laptop:col-span-6 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[440] laptop:aspect-h-[240] desktop:aspect-w-[648] desktop:aspect-h-[256] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    5: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    6: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    7: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n  9: {\n    0: 'col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 tablet:col-span-2 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 laptop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    5: 'col-span-2 tablet:col-span-1 laptop:col-span-3 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    6: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    7: 'col-span-1 laptop:col-span-3 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[212] laptop:aspect-h-[240] desktop:aspect-w-[316] desktop:aspect-h-[256] lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[320]',\n    8: 'col-span-2 laptop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n}\n\n/**\n * 12 \u5217\u6805\u683C\u5E03\u5C40\u914D\u7F6E\u6620\u5C04\u8868\uFF08\u65B0\u589E\uFF09\n * \u5BB9\u5668\u4F7F\u7528 grid-cols-12\uFF0C\u9002\u914D\u66F4\u5927\u7684\u5185\u5BB9\u5BBD\u5EA6\n */\nconst LAYOUT_CONFIG_12: Record<number, Record<number, string>> = {\n  4: {\n    0: 'col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n  },\n  5: {\n    0: 'col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n  6: {\n    0: 'col-span-2 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n  },\n  7: {\n    0: 'col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 tablet:col-span-1 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    6: 'col-span-2 tablet:col-span-2 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-4 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n  8: {\n    0: 'col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    1: 'col-span-2 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    3: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    6: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    7: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n  },\n  9: {\n    0: 'col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    1: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    2: 'col-span-1 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n    3: 'col-span-2 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    4: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    5: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[226] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    6: 'col-span-1 tablet:col-span-1 laptop:col-span-4 desktop:col-span-4 lg-desktop:col-span-4 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[288] laptop:aspect-h-[240] desktop:aspect-w-[426] desktop:aspect-h-[256] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[320]',\n    7: 'col-span-1 tablet:col-span-2 laptop:col-span-7 desktop:col-span-7 lg-desktop:col-span-7 aspect-w-[173] aspect-h-[240] tablet:aspect-w-[465] tablet:aspect-h-[240] laptop:aspect-w-[516] laptop:aspect-h-[240] desktop:aspect-w-[758] desktop:aspect-h-[256] lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[320]',\n    8: 'col-span-2 tablet:col-span-1 laptop:col-span-5 desktop:col-span-5 lg-desktop:col-span-5 aspect-w-[358] aspect-h-[240] tablet:aspect-w-[227] tablet:aspect-h-[240] laptop:aspect-w-[364] laptop:aspect-h-[240] desktop:aspect-w-[538] desktop:aspect-h-[256] lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[320]',\n  },\n}\n\n/**\n * \u83B7\u53D6\u5361\u7247\u7684\u5E03\u5C40\u7C7B\u540D\n * @param index - \u5361\u7247\u7D22\u5F15\n * @param totalCount - \u5361\u7247\u603B\u6570\n * @param gridColumns - \u6805\u683C\u5217\u6570\n * @returns \u5E03\u5C40\u7C7B\u540D\n */\nconst getCardLayoutClass = (index: number, totalCount: number, gridColumns: number): string => {\n  const config = gridColumns === 12 ? LAYOUT_CONFIG_12 : LAYOUT_CONFIG_10\n  return config[totalCount]?.[index] || ''\n}\n\n/**\n * Ksp - Key Selling Point \u5173\u952E\u5356\u70B9\u7EC4\u4EF6\n *\n * \u5C55\u793A\u4EA7\u54C1\u7684\u5173\u952E\u5356\u70B9\uFF0C\u652F\u6301\u56FE\u7247\u548C\u89C6\u9891\uFF0C\u5177\u6709\u590D\u6742\u7684\u54CD\u5E94\u5F0F\u5E03\u5C40\u3002\n * \u5E03\u5C40\u652F\u6301 4-9 \u4E2A\u5361\u7247\u9879\uFF0C\u5206\u522B\u5BF9\u5E94\u4E0D\u540C\u5C3A\u5BF8\u548C\u4F4D\u7F6E\u3002\n *\n * @example\n * ```tsx\n * <Ksp\n *   data={{\n *     title: '\u4E3A\u4EC0\u4E48\u9009\u62E9\u6211\u4EEC',\n *     items: [\n *       {\n *         title: '\u9AD8\u6027\u80FD',\n *         desc: '\u5F3A\u5927\u7684\u5904\u7406\u80FD\u529B',\n *         image: '/desktop.jpg',\n *         mobImage: '/mobile.jpg'\n *       },\n *       // ... \u9700\u8981 4-9 \u4E2A\u9879\n *     ]\n *   }}\n * />\n * ```\n */\nfunction Ksp({ data, className, classNames, ...rest }: KspProps) {\n  const { title, items, theme = 'light', gridColumns } = data\n  const columns = gridColumns ? Number(gridColumns) : 10\n  const is12Col = columns === 12\n  return (\n    <section\n      {...rest}\n      data-ui-component-id=\"ksp\"\n      className={cn(\n        'ksp-container text-info-primary laptop:scroll-mt-[46px] flex scroll-mt-[108px] flex-col justify-center',\n        {\n          'aiui-dark': theme === 'dark',\n        },\n        className,\n        classNames?.root\n      )}\n    >\n      <Heading\n        as=\"h1\"\n        size={4}\n        html={title}\n        className={cn('ksp-title laptop:text-center text-left', classNames?.title)}\n      />\n      <div\n        className={cn(\n          'ksp-layout tablet:grid-cols-3 laptop:gap-4 mt-[24px] grid grid-cols-2 gap-3',\n          is12Col ? 'laptop:grid-cols-12' : 'laptop:grid-cols-10',\n          classNames?.layout\n        )}\n      >\n        {items.map((item, index) => (\n          <ImageCard\n            key={index}\n            {...item}\n            className={getCardLayoutClass(index, items.length, columns)}\n            classNames={classNames}\n          />\n        ))}\n      </div>\n    </section>\n  )\n}\n\nexport default withLayout(Ksp)\n"],
+  "mappings": "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",
+  "names": ["Ksp_exports", "__export", "Ksp_default", "__toCommonJS", "import_jsx_runtime", "import_react_responsive", "import_components", "import_utils", "import_Styles", "ImageCard", "title", "desc", "mobImage", "mobVideo", "tabletImage", "tabletVideo", "laptopImage", "laptopVideo", "desktopImage", "desktopVideo", "image", "video", "className", "theme", "classNames", "isMobile", "isTablet", "isLaptop", "getCurrentVideo", "getCurrentPoster", "currentVideo", "currentPoster", "buildImageSource", "sources", "lgDesktop", "desktop", "laptop", "tablet", "mobile", "hasVideo", "hasAnyImage", "LAYOUT_CONFIG_10", "LAYOUT_CONFIG_12", "getCardLayoutClass", "index", "totalCount", "gridColumns", "Ksp", "data", "rest", "items", "columns", "is12Col", "item"]
 }

package/dist/cjs/biz-components/Listing/BizProductProvider.d.ts

@@ -1,5 +1,7 @@
 import React, { type Dispatch, type SetStateAction, type PropsWithChildren } from 'react';
-import type { Product, ProductPrice, ProductVariant, VariantCoupon, Options, FreeGift, BundleListItem, Bundle } from './types/product';
+import type { Product, ProductPrice, ProductVariant, VariantCoupon, Options, FreeGift } from './types/product';
+import type { BundleOption, ProductBundleProps } from './components/ProductCard/ProductDetail/ProductBundle/types.js';
+import type { ProductFunctionFreeGiftProps } from './components/ProductCard/ProductDetail/ProductFunctionFreeGift';
 import type { CompareData, DiscountData } from './types.js';
 type Country = {
     id?: number;
@@ -60,7 +62,7 @@ export type ModalData = {
 };
 export type JoinedRecommendBuyProducts = {
     bundle?: {
-        value?: BundleListItem;
+        value?: ProductBundleProps;
         canOperate?: boolean;
     };
     gift?: {
@@ -105,16 +107,16 @@ export interface ProductContextType {
     freeGift?: FreeGift;
     checkedGift?: ProductVariant;
     setCheckedGift?: Dispatch<SetStateAction<ProductVariant | undefined>>;
-    exchangePurchase?: FreeGift;
-    checkedExchangePurchase?: ProductVariant;
-    setCheckedExchangePurchase?: Dispatch<SetStateAction<ProductVariant | undefined>>;
-    checkedBundle?: BundleListItem;
-    setCheckedBundle: Dispatch<SetStateAction<BundleListItem | undefined>>;
+    functionFreeGift?: ProductFunctionFreeGiftProps;
+    checkedFunctionGifts?: Set<string>;
+    setCheckedFunctionGifts?: Dispatch<SetStateAction<Set<string>>>;
+    checkedBundle?: BundleOption;
+    setCheckedBundle?: Dispatch<SetStateAction<BundleOption | undefined>>;
     joinedRecommendBuyProducts: JoinedRecommendBuyProducts;
     setJoinedRecommendBuyProducts?: Dispatch<SetStateAction<JoinedRecommendBuyProducts>>;
     checkedCareBundle?: ProductVariant;
     setCheckedCareBundle?: Dispatch<SetStateAction<ProductVariant | undefined>>;
-    bundle?: Bundle;
+    bundle?: ProductBundleProps;
     compareData?: CompareData['data'];
     onAddToCart?: () => void;
     onBuyNow?: () => void;
@@ -132,8 +134,10 @@ export interface ProductContextType {
     addToCartLoading?: boolean;
     addOrder?: Array<'bundle' | 'gift' | 'exchange'>;
     setAddOrder?: Dispatch<SetStateAction<Array<'bundle' | 'gift' | 'exchange'>>>;
+    notifyMeMode?: 'normal' | 'notify_me';
+    onNotifyMeClick?: (open: boolean) => void;
 }
 export declare const BizProductContext: React.Context<ProductContextType>;
 export declare const useBizProductContext: () => ProductContextType;
-declare const ProductProvider: ({ product, isLogin, profile, isMobile, isDesktop, children, renderRating, freeGift, exchangePurchase, bundle, checkedBundle, checkedGift, setCheckedBundle, setCheckedGift, checkedExchangePurchase, setCheckedExchangePurchase, variant, selectedOptions, setSelectedOptions, compareData, coupon, finalPrice, comparePrice, totalSavings, savingDetail, setSavingDetail, selectedVariants, onAddToCart, onBuyNow, creditsRedemption, memberFunctionResult, openModal, openSignInPopup, openAuthCodePopup, openSignUpPopup, renderInstallments, onUseCouponChange, onUseMemberDiscountChange, discount, buyNowLoading, addToCartLoading, }: PropsWithChildren<Omit<ProductContextType, "joinedRecommendBuyProducts" | "setJoinedRecommendBuyProducts" | "addOrder" | "setAddOrder" | "resolvedPayload">>) => import("react/jsx-runtime").JSX.Element;
+declare const ProductProvider: ({ product, isLogin, profile, isMobile, isDesktop, children, renderRating, freeGift, bundle, checkedBundle, checkedGift, setCheckedBundle, setCheckedGift, functionFreeGift, checkedFunctionGifts, setCheckedFunctionGifts, variant, selectedOptions, setSelectedOptions, compareData, coupon, finalPrice, comparePrice, totalSavings, savingDetail, setSavingDetail, selectedVariants, onAddToCart, onBuyNow, creditsRedemption, memberFunctionResult, openModal, openSignInPopup, openAuthCodePopup, openSignUpPopup, renderInstallments, onUseCouponChange, onUseMemberDiscountChange, discount, buyNowLoading, addToCartLoading, notifyMeMode, onNotifyMeClick, }: PropsWithChildren<Omit<ProductContextType, "joinedRecommendBuyProducts" | "setJoinedRecommendBuyProducts" | "addOrder" | "setAddOrder" | "resolvedPayload">>) => import("react/jsx-runtime").JSX.Element;
 export default ProductProvider;