@anker-in/headless-ui 1.3.70 → 1.3.72-alpha.1790070184778
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/biz-components/ActiveShelf/MemberLabel.d.ts +42 -0
- package/dist/cjs/biz-components/ActiveShelf/MemberLabel.js +1 -0
- package/dist/cjs/biz-components/ActiveShelf/ProductCard.d.ts +55 -2
- package/dist/cjs/biz-components/ActiveShelf/ProductCard.js +1 -1
- package/dist/cjs/biz-components/ActiveShelf/index.d.ts +55 -5
- package/dist/cjs/biz-components/ActiveShelf/index.js +1 -1
- package/dist/cjs/biz-components/ActiveShelf/styles.d.ts +55 -0
- package/dist/cjs/biz-components/ActiveShelf/styles.js +1 -0
- package/dist/cjs/biz-components/ActiveShelf/types.d.ts +88 -0
- package/dist/cjs/biz-components/ActiveShelf/types.js +1 -1
- package/dist/cjs/biz-components/ActivityMechanism/index.js +1 -1
- package/dist/cjs/biz-components/ActivitySchedule/index.js +1 -1
- package/dist/cjs/biz-components/BrandEquity/BrandEquity.js +1 -1
- package/dist/cjs/biz-components/FooterNavigation/index.js +1 -1
- package/dist/cjs/biz-components/GraphicOverlay/GraphicOverlay.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.d.ts +2 -1
- package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/MobileResourceSidebarMenu.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/MobileSidebarMenu.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/MobileSupportMenu.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/MulticolDropdown.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/ResourceItem.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/ResourceSidebarDropdown.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/SupportsDropdown.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/types.d.ts +1 -0
- package/dist/cjs/biz-components/HeaderNavigation/types.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/useNavCollapse.d.ts +30 -0
- package/dist/cjs/biz-components/HeaderNavigation/useNavCollapse.js +1 -0
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.js +1 -1
- package/dist/cjs/biz-components/ImageWithText/types.d.ts +2 -2
- package/dist/cjs/biz-components/Ksp/index.d.ts +2 -0
- package/dist/cjs/biz-components/Ksp/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGridBox.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.d.ts +7 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/types.d.ts +3 -0
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/types.js +1 -1
- package/dist/cjs/biz-components/Listing/utils/index.js +1 -1
- package/dist/cjs/biz-components/ProductNav/ProductNav.js +1 -1
- package/dist/cjs/biz-components/SearchPage/index.js +1 -1
- package/dist/cjs/biz-components/SecondaryBanner/index.d.ts +10 -0
- package/dist/cjs/biz-components/SecondaryBanner/index.js +1 -1
- package/dist/cjs/biz-components/Specs/dropdown.d.ts +2 -1
- package/dist/cjs/biz-components/Specs/dropdown.js +2 -2
- package/dist/cjs/biz-components/Specs/index.js +1 -1
- package/dist/cjs/biz-components/ThreeDCarousel/ThreeDCarousel.js +1 -1
- package/dist/cjs/components/badge.d.ts +1 -1
- package/dist/cjs/components/badge.js +1 -1
- package/dist/cjs/components/link.js +1 -1
- package/dist/cjs/helpers/utils.js +1 -1
- package/dist/cjs/hooks/useDraggableScroll.js +1 -1
- package/dist/cjs/hooks/useExposure.d.ts +1 -1
- package/dist/cjs/hooks/useExposure.js +1 -1
- package/dist/cjs/hooks/useViewItemList.d.ts +1 -1
- package/dist/esm/biz-components/ActiveShelf/MemberLabel.d.ts +42 -0
- package/dist/esm/biz-components/ActiveShelf/MemberLabel.js +1 -0
- package/dist/esm/biz-components/ActiveShelf/ProductCard.d.ts +55 -2
- package/dist/esm/biz-components/ActiveShelf/ProductCard.js +1 -1
- package/dist/esm/biz-components/ActiveShelf/index.d.ts +55 -5
- package/dist/esm/biz-components/ActiveShelf/index.js +1 -1
- package/dist/esm/biz-components/ActiveShelf/styles.d.ts +55 -0
- package/dist/esm/biz-components/ActiveShelf/styles.js +1 -0
- package/dist/esm/biz-components/ActiveShelf/types.d.ts +88 -0
- package/dist/esm/biz-components/ActivityMechanism/index.js +1 -1
- package/dist/esm/biz-components/ActivitySchedule/index.js +1 -1
- package/dist/esm/biz-components/BrandEquity/BrandEquity.js +1 -1
- package/dist/esm/biz-components/FooterNavigation/index.js +1 -1
- package/dist/esm/biz-components/GraphicOverlay/GraphicOverlay.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/MobileMenuComponents.d.ts +2 -1
- package/dist/esm/biz-components/HeaderNavigation/MobileMenuComponents.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/MobileResourceSidebarMenu.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/MobileSidebarMenu.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/MobileSupportMenu.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/MulticolDropdown.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/ResourceItem.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/ResourceSidebarDropdown.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/SidebarDropdown.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/SupportsDropdown.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/types.d.ts +1 -0
- package/dist/esm/biz-components/HeaderNavigation/useNavCollapse.d.ts +30 -0
- package/dist/esm/biz-components/HeaderNavigation/useNavCollapse.js +1 -0
- package/dist/esm/biz-components/ImageWithText/ImageWithText.js +1 -1
- package/dist/esm/biz-components/ImageWithText/types.d.ts +2 -2
- package/dist/esm/biz-components/Ksp/index.d.ts +2 -0
- package/dist/esm/biz-components/Ksp/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGridBox.js +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ProductActions/index.d.ts +7 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ProductActions/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/PurchaseBar/types.d.ts +3 -0
- package/dist/esm/biz-components/Listing/utils/index.js +1 -1
- package/dist/esm/biz-components/ProductNav/ProductNav.js +1 -1
- package/dist/esm/biz-components/SearchPage/index.js +1 -1
- package/dist/esm/biz-components/SecondaryBanner/index.d.ts +10 -0
- package/dist/esm/biz-components/SecondaryBanner/index.js +1 -1
- package/dist/esm/biz-components/Specs/dropdown.d.ts +2 -1
- package/dist/esm/biz-components/Specs/dropdown.js +2 -2
- package/dist/esm/biz-components/Specs/index.js +1 -1
- package/dist/esm/biz-components/ThreeDCarousel/ThreeDCarousel.js +1 -1
- package/dist/esm/components/badge.d.ts +1 -1
- package/dist/esm/components/badge.js +1 -1
- package/dist/esm/components/link.js +1 -1
- package/dist/esm/helpers/utils.js +1 -1
- package/dist/esm/hooks/useDraggableScroll.js +1 -1
- package/dist/esm/hooks/useExposure.d.ts +1 -1
- package/dist/esm/hooks/useExposure.js +1 -1
- package/dist/esm/hooks/useViewItemList.d.ts +1 -1
- package/dist/tokens/oneAnker.css +19 -0
- package/package.json +1 -1
- package/style.css +159 -9
- package/tailwind.config.js +5 -0
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { Img } from '../../types/props.js';
|
|
3
|
+
import type { UserType, CopyConfig, ActiveShelfLayoutMode } from './types.js';
|
|
4
|
+
export type { UserType };
|
|
5
|
+
/**
|
|
6
|
+
* 会员标签模块 Props
|
|
7
|
+
*/
|
|
8
|
+
export interface MemberLabelProps {
|
|
9
|
+
/** 用户身份 */
|
|
10
|
+
userType: UserType;
|
|
11
|
+
/** 文案配置 */
|
|
12
|
+
copy?: CopyConfig;
|
|
13
|
+
/** 三种状态的装饰图 */
|
|
14
|
+
images?: Partial<Record<UserType, Img>>;
|
|
15
|
+
/** 点击游客副标题(注册/登录)回调 */
|
|
16
|
+
onSignUp?: () => void;
|
|
17
|
+
/** 点击付费会员折扣文案(加购付费会员sku)回调 */
|
|
18
|
+
onPlusMemberAddCart?: () => void;
|
|
19
|
+
/** 样式类名 */
|
|
20
|
+
className?: string;
|
|
21
|
+
/** 是否配置会员活动(activityLabels 中存在 type=activity) */
|
|
22
|
+
hasActivity?: boolean;
|
|
23
|
+
/** 会员活动默认文案(来自 activityLabels 中对应 type 的 label,优先级高于 copy) */
|
|
24
|
+
activityLabel?: string;
|
|
25
|
+
/** 普通会员折扣金额(格式化后的字符串,如 '$20'),用于替换 copy.memberDiscountLabel 中的 {amount} 占位符 */
|
|
26
|
+
memberDiscountAmount?: string;
|
|
27
|
+
/** 付费会员折扣金额(格式化后的字符串,如 '$30'),用于替换 copy.plusMemberDiscountLabel 中的 {amount} 占位符 */
|
|
28
|
+
plusMemberDiscountAmount?: string;
|
|
29
|
+
/** 布局模式:flex=网格布局,horizontal=横向轮播,用于切换左右内边距 */
|
|
30
|
+
layoutMode?: ActiveShelfLayoutMode;
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* MemberLabel - 会员身份标签模块
|
|
34
|
+
*
|
|
35
|
+
* @description 展示用户身份对应的会员权益提示条,支持三种身份状态:
|
|
36
|
+
* - guest(游客):灰底 + 深色字,副标题为可点击的注册/登录链接
|
|
37
|
+
* - member(普通会员):浅青渐变 + 深色字
|
|
38
|
+
* - plus-member(付费会员):青→深蓝渐变 + 白字
|
|
39
|
+
*/
|
|
40
|
+
declare const MemberLabel: React.ForwardRefExoticComponent<MemberLabelProps & React.RefAttributes<HTMLDivElement>>;
|
|
41
|
+
export { MemberLabel };
|
|
42
|
+
export default MemberLabel;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";"use client";var R=Object.create;var b=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var K=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var j=(r,e)=>{for(var i in e)b(r,i,{get:e[i],enumerable:!0})},h=(r,e,i,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of I(e))!z.call(r,a)&&a!==i&&b(r,a,{get:()=>e[a],enumerable:!(o=w(e,a))||o.enumerable});return r};var F=(r,e,i)=>(i=r!=null?R(K(r)):{},h(e||!r||!r.__esModule?b(i,"default",{value:r,enumerable:!0}):i,r)),G=r=>h(b({},"__esModule",{value:!0}),r);var H={};j(H,{MemberLabel:()=>u,default:()=>B});module.exports=G(H);var n=require("react/jsx-runtime"),S=F(require("react")),l=require("../../helpers/index.js"),s=require("../../components/index.js"),U=require("./styles.js");const _={guest:{backgroundColor:"#d4d8d9"},member:{backgroundImage:"linear-gradient(228.5deg, #d4f3f7 35.268%, #93e0ec 97.62%)"},"plus-member":{backgroundImage:"linear-gradient(-11.59deg, #00cbeb 7.658%, #010f16 50.658%)"}},x={guest:"Unlock Member Price",member:"Member Exclusive","plus-member":"Plus Member Exclusive"},u=S.forwardRef(({userType:r,copy:e,images:i,onSignUp:o,onPlusMemberAddCart:a,className:M,hasActivity:d,activityLabel:p,memberDiscountAmount:v,plusMemberDiscountAmount:m,layoutMode:C},T)=>{const A=r==="plus-member",L=r==="guest",D=r==="member",f=i?.[r],c=U.layoutModeStyles[C??"flex"],N=(()=>{switch(r){case"guest":return e?.memberTitleLabelUpgrade??x.guest;case"member":return e?.memberTitleLabel??x.member;case"plus-member":return e?.plusmemberTitleLabel??x["plus-member"]}})(),y=(()=>{if(L){const t=[];return v&&e?.memberDiscountLabel?t.push({text:e.memberDiscountLabel.replace("{amount}",v),action:"signUp"}):m&&e?.plusMemberDiscountLabel&&t.push({text:e.plusMemberDiscountLabel.replace("{amount}",m),action:"plusAddCart"}),d&&t.push({text:p??e?.memberActivityLabelUnLogin??"",action:"signUp"}),t}if(D){const t=[];return m&&e?.plusMemberDiscountLabel&&t.push({text:e.plusMemberDiscountLabel.replace("{amount}",m),action:"plusAddCart"}),d&&t.push({text:p??e?.memberActivityLabel??"",action:"none"}),t}return d?[{text:p??e?.memberActivityLabel??"",action:"none"}]:[]})();if(L&&y.length===0)return null;const E=t=>{(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),o?.())},P=t=>{(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),a?.())};return(0,n.jsxs)("div",{ref:T,className:(0,l.cn)(c.memberLabelContainer,"laptop:min-h-[64px] desktop:min-h-[76px] lg-desktop:min-h-[82px] relative box-border flex min-h-[50px] flex-col items-start justify-center overflow-hidden",M,A&&"aiui-dark"),style:_[r],children:[f?.url&&(0,n.jsx)("div",{className:(0,l.cn)("laptop:size-[86px] lg-desktop:size-[114px] absolute -right-5 top-1/2 size-16 -translate-y-1/2 "),children:(0,n.jsx)("div",{className:"absolute inset-0",children:(0,n.jsx)(s.Picture,{source:f.url,alt:f.alt||"",className:"block size-full",imgClassName:"block max-w-none size-full object-left object-cover "})})}),(0,n.jsxs)("div",{className:"relative flex w-full shrink-0 flex-col items-start",children:[(0,n.jsx)(s.Text,{as:"p",className:(0,l.cn)("text-info-primary line-clamp-1 font-bold not-italic leading-[1.4] tracking-[-0.02em]",c.memberLabelText),html:N}),(0,n.jsx)("div",{className:"line-clamp-2 w-full !leading-[1.4]",children:y.map((t,k)=>{const g=t.action!=="none";return(0,n.jsxs)(S.Fragment,{children:[k>0&&(0,n.jsxs)(s.Text,{as:"span",className:(0,l.cn)("text-info-tertiary font-bold !leading-[1.4] tracking-[-0.02em]",c.memberLabelText),children:["\xA0","&","\xA0"]}),(0,n.jsx)(s.Text,{as:"span",role:g?"button":void 0,tabIndex:g?0:void 0,onClick:t.action==="signUp"?()=>o?.():t.action==="plusAddCart"?()=>a?.():void 0,onKeyDown:t.action==="signUp"?E:t.action==="plusAddCart"?P:void 0,className:(0,l.cn)("text-info-tertiary font-bold !leading-[1.4] tracking-[-0.02em]",c.memberLabelText),style:{...g?{textDecoration:"underline",textUnderlinePosition:"from-font",cursor:"pointer"}:{}},html:t.text})]},k)})})]})]})});u.displayName="ActiveShelf.MemberLabel";var B=u;
|
|
@@ -1,14 +1,21 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { ButtonFunctionType, CopyConfig } from './types.js';
|
|
2
|
+
import type { ButtonFunctionType, CopyConfig, UserType, ActivityLabel, DiscountTagStyle, ActiveShelfLayoutMode, TagTypeConfig, TagColorConfig } from './types.js';
|
|
3
3
|
import type { BadgeProps } from '../../components/badge.js';
|
|
4
|
+
import type { Img } from '../../types/props.js';
|
|
4
5
|
/**
|
|
5
6
|
* 语义化类名
|
|
6
7
|
*/
|
|
7
|
-
export type ActiveShelfSemanticName = 'root' | 'title' | 'description' | 'productCard' | 'productTitle' | 'productDescription' | 'productPriceLabel' | 'productPrice' | 'originalPrice' | 'buttonGroup' | 'secondaryButton' | 'primaryButton' | 'stockTrack' | 'stockBar';
|
|
8
|
+
export type ActiveShelfSemanticName = 'root' | 'title' | 'description' | 'tabsList' | 'promotionalBar' | 'productCard' | 'discountBadge' | 'discountBadgeText' | 'productTitle' | 'productDescription' | 'productPriceLabel' | 'productPrice' | 'originalPrice' | 'buttonGroup' | 'secondaryButton' | 'primaryButton' | 'stockTrack' | 'stockBar';
|
|
8
9
|
/**
|
|
9
10
|
* 库存展示模式
|
|
10
11
|
*/
|
|
11
12
|
export type StockDisplayMode = 'always' | 'never' | 'below-quantity' | 'below-percentage';
|
|
13
|
+
interface SocialEndorsementItem {
|
|
14
|
+
/** 图标:图片 URL 字符串,或 SVG React 节点 */
|
|
15
|
+
icon: string | React.ReactNode;
|
|
16
|
+
/** 无障碍标签 */
|
|
17
|
+
label?: string;
|
|
18
|
+
}
|
|
12
19
|
/**
|
|
13
20
|
* 基础产品数据接口(来自外部数据源)
|
|
14
21
|
*/
|
|
@@ -21,6 +28,10 @@ export interface BaseProductData {
|
|
|
21
28
|
shopify_id: string;
|
|
22
29
|
custom_name?: string;
|
|
23
30
|
custom_description?: string;
|
|
31
|
+
/** 自定义产品卡片背景图 URL */
|
|
32
|
+
custom_bg_image?: string | null;
|
|
33
|
+
/** 自定义产品卡片场景图 URL(鼠标 hover 时覆盖背景图) */
|
|
34
|
+
custom_scene_image?: string | null;
|
|
24
35
|
}
|
|
25
36
|
/**
|
|
26
37
|
* Shopify 变体数据接口
|
|
@@ -74,6 +85,16 @@ export interface VariantData {
|
|
|
74
85
|
* 通用折扣数据,包括折扣title, 类型和值
|
|
75
86
|
*/
|
|
76
87
|
coupon: any;
|
|
88
|
+
/** 社媒背书图标(socialEndorsements: SocialEndorsementItem[] */
|
|
89
|
+
socialEndorsements?: SocialEndorsementItem[];
|
|
90
|
+
/** 普通会员折扣金额(格式化后的字符串,如 '$20') */
|
|
91
|
+
memberDiscountAmount?: string;
|
|
92
|
+
/** 付费会员折扣金额(格式化后的字符串,如 '$30') */
|
|
93
|
+
plusMemberDiscountAmount?: string;
|
|
94
|
+
/** 折扣金额(string 类型,用于左上角折扣标签展示) */
|
|
95
|
+
discountAmount?: string;
|
|
96
|
+
/** SKU 会员活动配置(对象数组,每项含 type 与 label) */
|
|
97
|
+
activityLabels?: ActivityLabel[];
|
|
77
98
|
}
|
|
78
99
|
/**
|
|
79
100
|
* 完整的产品卡片数据接口
|
|
@@ -90,6 +111,12 @@ export interface ProductCardProps {
|
|
|
90
111
|
className?: string;
|
|
91
112
|
/** 是否展示标签系统 */
|
|
92
113
|
showTags?: boolean;
|
|
114
|
+
/** 是否展示价格标签 */
|
|
115
|
+
isShowPricesTag?: boolean;
|
|
116
|
+
/** 是否展示会员价格与价格标签(价格下方的会员标签,如 Member Price) */
|
|
117
|
+
showMemberPrice?: boolean;
|
|
118
|
+
/** 布局模式:网格布局(flex)或横向轮播(horizontal),用于切换 CardContent/MemberLabel 间距 */
|
|
119
|
+
layoutMode?: ActiveShelfLayoutMode;
|
|
93
120
|
/** 库存展示模式 */
|
|
94
121
|
stockDisplayMode?: StockDisplayMode;
|
|
95
122
|
/** 库存阈值(当模式为 below-quantity 或 below-percentage 时使用) */
|
|
@@ -123,7 +150,33 @@ export interface ProductCardProps {
|
|
|
123
150
|
}) => React.ReactNode;
|
|
124
151
|
/** 文案配置 */
|
|
125
152
|
copy?: CopyConfig;
|
|
153
|
+
/** 点击产品图片 / 场景图 / 标题跳转详情回调;未传时回退到 product.listingLink */
|
|
126
154
|
onProductImageClick?: (product: ProductCardData) => void;
|
|
155
|
+
/** 标签形态配置:按位置(第 0/第 1 个)指定形态,优先于 tag 数据自带 variant 与默认规则 */
|
|
156
|
+
tagTypeConfig?: TagTypeConfig;
|
|
157
|
+
/** fill 形态标签颜色(bgColor=背景色,outlineColor=描边色),覆盖默认品牌色 */
|
|
158
|
+
fill?: TagColorConfig['fill'];
|
|
159
|
+
/** outline 形态标签颜色(outlineColor=描边色,bgColor=背景色),覆盖默认品牌色 */
|
|
160
|
+
outline?: TagColorConfig['outline'];
|
|
161
|
+
/** 会员价标签(priceLabel,如 Member Price)文字颜色。设置后会覆盖默认的品牌色 */
|
|
162
|
+
memberPriceTextColor?: string;
|
|
163
|
+
/** 用户身份(会员标签模块) */
|
|
164
|
+
userType?: UserType;
|
|
165
|
+
/** 会员标签模块三种状态的装饰图 */
|
|
166
|
+
memberImages?: Partial<Record<UserType, Img>>;
|
|
167
|
+
/** 左上角自定义标签图标 */
|
|
168
|
+
customTagsIcon?: Img;
|
|
169
|
+
/** 自定义折扣标签图标样式(style1/style2/style3 为内置预设,custom 为自定义上传) */
|
|
170
|
+
customTagStyle?: DiscountTagStyle;
|
|
171
|
+
/** 点击会员标签模块游客副标题(注册/登录)回调 */
|
|
172
|
+
onMemberSignUp?: () => void;
|
|
173
|
+
/** 点击会员标签模块付费会员折扣文案(加购付费会员sku)回调 */
|
|
174
|
+
onPlusMemberAddCart?: () => void;
|
|
175
|
+
/** 自定义折扣标签渲染(仅 customTagStyle=custom 时生效) */
|
|
176
|
+
renderDiscountBadge?: (ctx: {
|
|
177
|
+
text?: string;
|
|
178
|
+
layoutMode: ActiveShelfLayoutMode;
|
|
179
|
+
}) => React.ReactNode;
|
|
127
180
|
}
|
|
128
181
|
/**
|
|
129
182
|
* 产品卡片组件
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var be=Object.create;var N=Object.defineProperty;var fe=Object.getOwnPropertyDescriptor;var ye=Object.getOwnPropertyNames;var pe=Object.getPrototypeOf,ve=Object.prototype.hasOwnProperty;var Se=(e,a)=>{for(var o in a)N(e,o,{get:a[o],enumerable:!0})},$=(e,a,o,d)=>{if(a&&typeof a=="object"||typeof a=="function")for(let c of ye(a))!ve.call(e,c)&&c!==o&&N(e,c,{get:()=>a[c],enumerable:!(d=fe(a,c))||d.enumerable});return e};var Ce=(e,a,o)=>(o=e!=null?be(pe(e)):{},$(a||!e||!e.__esModule?N(o,"default",{value:e,enumerable:!0}):o,e)),he=e=>$(N({},"__esModule",{value:!0}),e);var Ae={};Se(Ae,{ProductCard:()=>B,default:()=>Ne});module.exports=he(Ae);var t=require("react/jsx-runtime"),A=Ce(require("react")),n=require("../../helpers/index.js"),i=require("../../components/index.js"),G=require("./MemberLabel.js"),z=require("./styles.js");const xe=5;function Te(e,a,o,d){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return a===void 0?!0:o<=a;case"below-percentage":return a===void 0?!0:o/d*100<=a;default:return!0}}const ke=({items:e})=>e?.length?(0,t.jsx)("div",{className:"active-shelf-display-social-endorsements desktop:gap-2 laptop:flex absolute right-0 top-0 z-10 hidden flex-col items-center gap-1",children:e.slice(0,3).map((a,o)=>typeof a.icon=="string"?(0,t.jsx)("img",{src:a.icon,alt:a.label||"",loading:"lazy",className:"desktop:size-10 lg-desktop:size-12 size-8 object-contain"},o):(0,t.jsx)(i.Text,{"aria-label":a.label,className:"desktop:size-10 lg-desktop:size-12 size-8 [&_img]:size-full [&_svg]:size-full",children:a.icon},o))}):null,U={style1:{bg:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/2_7746fc9c-d4e4-4a59-a972-fa4cb0f3f8bd.png?v=1789381635",textClass:"aiui-dark text-info-primary"},style2:{bg:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_e0438358-493b-40cb-9a58-89d6ee2d3751.png?v=1789381628",textClass:"aiui-dark text-info-primary"},style3:{bg:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_19208ba4-71ea-4580-892d-72167f1cf606.png?v=1789381639",textClass:"aiui-dark text-info-primary"}},Pe=({text:e,style:a="style1",icon:o,className:d,textClassName:c,layoutMode:h="flex",renderBadge:v})=>{if(!e)return null;const b=a==="custom",s=b&&!!v,S=b&&!v&&!!o?.url,C=b?void 0:U[a],f=U.style1,u=z.layoutModeStyles[h],x={style1:u.discountBadgeText,style2:u.discountBadgeTextStyle2,style3:u.discountBadgeTextStyle3},T=b?u.discountBadgeTextCenter:x[a];return(0,t.jsxs)("div",{className:(0,n.cn)("active-shelf-discount-badge","absolute left-0 top-0 z-10",u.discountBadgeSize,d),children:[s?v({text:e,layoutMode:h}):S?(0,t.jsx)(i.Picture,{source:o.url,alt:o.alt||e,className:"block size-full",imgClassName:"block size-full object-contain"}):(0,t.jsx)("img",{src:(C??f).bg,alt:e,loading:"lazy",className:"block size-full object-contain"}),!s&&(0,t.jsx)(i.Text,{className:(0,n.cn)("active-shelf-discount-badge-text text-center","absolute inset-0 font-bold !leading-[1.2]",T,(C??f).textClass,c),html:e})]})},B=A.forwardRef(({product:e,className:a,showTags:o=!0,stockDisplayMode:d,stockThresholdValue:c,onLearnMore:h,onShopNow:v,onAddToCart:b,classNames:s,secondaryButtonText:S,secondaryButtonFun:C,primaryButtonText:f,primaryButtonFun:u,showOriginalPrice:x,renderOriginalPrice:T,copy:y,onProductImageClick:k,tagTypeConfig:_,fill:M,outline:w,memberPriceTextColor:R,userType:P,memberImages:H,customTagsIcon:K,customTagStyle:J,onMemberSignUp:Q,onPlusMemberAddCart:W,showMemberPrice:I,layoutMode:L,renderDiscountBadge:X},Y)=>{const[Z,ee]=A.useState(!1),[te,ae]=A.useState(!1),ie=e?.memberDiscountAmount,ne=e?.plusMemberDiscountAmount,oe=e?.activityLabels??[],se=P==="guest"?"guest":"member",E=oe.find(l=>l.type===se)?.label,re=P==="guest"?y?.memberActivityLabelUnLogin:y?.memberActivityLabel,le=!!E||!!re,ce=e?.discountAmount,r=z.layoutModeStyles[L??"flex"],de=A.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?xe:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),F=async(l,g)=>{if(!l)return;const m=g==="primary"?ee:ae;m(!0);try{switch(l){case"buyNow":await v?.(e);break;case"addCart":await b?.(e);break;case"learnMore":await h?.(e);break;default:break}}finally{m(!1)}},ue=e.availableForSale&&e.quantityAvailable<=0,ge=(l,g)=>{const m=l===0?_?.firstTagVariant:l===1?_?.secondTagVariant:void 0,D=(m||void 0)??(g==="fill"?"fill":g!==void 0?"outline":l===0?"fill":"outline"),p=D==="fill"?{outline:M?.outlineColor,bg:M?.bgColor}:{outline:w?.outlineColor,bg:w?.bgColor},O={...p.outline?{outlineColor:p.outline}:{},...p.bg?{backgroundColor:p.bg,backgroundImage:"none"}:{}};return D==="outline"&&p.outline&&(O.color=p.outline),{variant:D,style:O}},j=!!e.custom_bg_image,me=!!e.custom_scene_image,q=l=>l?{backgroundImage:`url(${l})`,backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat"}:void 0;return(0,t.jsxs)(i.Card,{ref:Y,className:(0,n.cn)("hover:bg-container-secondary-0 bg-container-primary relative flex h-full cursor-pointer flex-col overflow-hidden border-none",r.cardRadius,a,s?.productCard),children:[(0,t.jsx)(Pe,{text:ce,style:J,icon:K,layoutMode:L,renderBadge:X,className:s?.discountBadge,textClassName:s?.discountBadgeText}),(0,t.jsxs)(i.CardContent,{className:(0,n.cn)(r.cardContent,"relative flex flex-1 flex-col justify-between"),children:[(0,t.jsxs)("div",{className:"product-image-wrapper group/product-image relative mb-4",children:[j&&(0,t.jsx)("div",{"aria-hidden":!0,className:(0,n.cn)("pointer-events-none absolute inset-0 z-20",r.imageOffset),style:q(e.custom_bg_image)}),me&&(0,t.jsx)("div",{"aria-hidden":!0,className:(0,n.cn)("laptop:block laptop:group-hover/product-image:opacity-100 pointer-events-none absolute inset-0 z-20 hidden opacity-0 transition-opacity duration-300",r.imageOffset),style:q(e.custom_scene_image)}),(0,t.jsx)("div",{className:(0,n.cn)("product-image mx-auto cursor-pointer overflow-hidden",r.image),children:(0,t.jsx)("a",{onClick:()=>k?.(e),...!k&&{href:e?.listingLink},rel:"noreferrer",className:(0,n.cn)("block size-full",j&&"opacity-0"),children:(0,t.jsx)(i.Picture,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"size-full object-contain"})})}),(0,t.jsx)(ke,{items:e?.socialEndorsements})]}),o&&(0,t.jsx)("div",{className:"desktop:mb-2 mb-1 flex h-[24px] gap-1",children:e.tags?.map((l,g)=>{if(!l.label)return null;const{variant:m,style:V}=ge(g,l.variant);return(0,t.jsx)(i.Badge,{size:"sm",variant:m,className:"active-shelf-items-tag py-0",style:V,children:l.label},g)})}),(0,t.jsxs)("div",{className:"flex h-full flex-1 grow flex-col justify-between gap-4",children:[(0,t.jsxs)("div",{children:[(0,t.jsx)(i.Heading,{as:"h3",size:"none",className:(0,n.cn)("text-info-primary",r.title,s?.productTitle),children:(0,t.jsx)("a",{onClick:()=>k?.(e),...!k&&{href:e?.listingLink},rel:"noreferrer",className:"hover:text-brand-0 cursor-pointer ",children:e.custom_name||e.name})}),e?.description&&(0,t.jsx)(i.Text,{size:"none",className:(0,n.cn)("active-shelf-product-description text-info-primary",r.description,s?.productDescription),html:e.custom_description||e.description})]}),(0,t.jsxs)("div",{children:[(0,t.jsx)("div",{className:(0,n.cn)(s?.productPrice),children:(0,t.jsx)("div",{className:(0,n.cn)("flex items-baseline",r.priceGap),children:e.availableForSale?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(i.Heading,{size:"none",className:(0,n.cn)("text-info-primary",r.price),as:"h6",children:e.price}),T?T(e,{showOriginalPrice:x}):x&&e.originalPrice&&(0,t.jsx)(i.Heading,{size:"none",className:(0,n.cn)("text-info-tertiary line-through",r.price,s?.originalPrice),as:"h6",children:e.originalPrice})]}):(0,t.jsx)(i.Heading,{size:"none",className:(0,n.cn)("text-info-tertiary",r.price),children:y?.outOfStockLabel??"Sold Out"})})}),I&&e?.priceLabel&&e?.availableForSale&&(0,t.jsx)("div",{className:(0,n.cn)("min-h-[1lh]",r.priceLabel),children:(0,t.jsx)(i.Text,{size:"none",className:(0,n.cn)("text-brand-0",s?.productPriceLabel),style:{...R?{color:R}:{}},children:e.priceLabel})}),(0,t.jsxs)("div",{className:(0,n.cn)("mt-2 flex",r.buttonContainer,s?.buttonGroup),children:[S&&(0,t.jsx)(i.Button,{variant:"secondary",size:"lg",className:(0,n.cn)(r.buttonItem,s?.secondaryButton),onClick:()=>F(C,"secondary"),disabled:!e.availableForSale&&C!=="learnMore",loading:te,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${S}`,"data-headless-sku":e.sku,children:S}),f&&(0,t.jsx)(i.Button,{variant:"primary",size:"lg",className:(0,n.cn)(r.buttonItem,s?.primaryButton),onClick:()=>F(u,"primary"),disabled:!e.availableForSale&&u!=="learnMore",loading:Z,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${f}`,"data-headless-sku":e.sku,children:f})]}),Te(d,c,e?.quantityAvailable??0,e?.totalInventory??0)&&(0,t.jsxs)("div",{className:"mt-4 flex flex-col gap-1",children:[(0,t.jsx)(i.Progress,{value:de,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:(0,n.cn)("bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]",s?.stockTrack),progressBar:(0,n.cn)("bg-brand-0 transition-all duration-300 ease-in-out",s?.stockBar)}}),(0,t.jsx)(i.Text,{size:3,className:"text-info-tertiary text-[14px]",children:ue?y?.limitedStock:y?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]}),I&&P&&(0,t.jsx)(G.MemberLabel,{userType:P,copy:y,images:H,onSignUp:Q,onPlusMemberAddCart:W,hasActivity:le,activityLabel:E,memberDiscountAmount:ie,plusMemberDiscountAmount:ne,layoutMode:L})]})});B.displayName="ActiveShelf.ProductCard";var Ne=B;
|
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
import { type PromotionalBarProps } from '../PromotionalBar/index.js';
|
|
2
3
|
import 'swiper/css';
|
|
3
4
|
import 'swiper/css/navigation';
|
|
4
|
-
import type { ButtonFunctionType, CopyConfig } from './types.js';
|
|
5
|
+
import type { ButtonFunctionType, CopyConfig, UserType, DiscountTagStyle, ActiveShelfLayoutMode, TagTypeConfig, TagColorConfig } from './types.js';
|
|
5
6
|
import { ProductCard, type ProductCardData, type ActiveShelfSemanticName, type StockDisplayMode } from './ProductCard.js';
|
|
7
|
+
import type { Img } from '../../types/props.js';
|
|
6
8
|
/**
|
|
7
|
-
*
|
|
9
|
+
* 平铺布局桌面端(≥1440px)每行列数
|
|
10
|
+
* '4' 为默认(现状),'3' 表示桌面端降为 3 列
|
|
8
11
|
*/
|
|
9
|
-
export type
|
|
12
|
+
export type TileDesktopColumns = '3' | '4';
|
|
10
13
|
/**
|
|
11
14
|
* Code Channel 配置 - 折扣前缀
|
|
12
15
|
*/
|
|
@@ -21,6 +24,11 @@ export interface ProductTab {
|
|
|
21
24
|
tab: string;
|
|
22
25
|
/** 该分组下的产品数据 */
|
|
23
26
|
data: ProductCardData[];
|
|
27
|
+
/** 资源块(如 PromotionalBar) */
|
|
28
|
+
resourceBlocks?: Array<PromotionalBarProps['data'] & {
|
|
29
|
+
blockType: string;
|
|
30
|
+
display: 'visible' | 'hidden';
|
|
31
|
+
}>;
|
|
24
32
|
}
|
|
25
33
|
/**
|
|
26
34
|
* ActiveShelf 业务组件数据接口
|
|
@@ -45,7 +53,7 @@ export interface ActiveShelfData {
|
|
|
45
53
|
layoutMode?: ActiveShelfLayoutMode;
|
|
46
54
|
/** Code Channel 配置 - 折扣前缀 */
|
|
47
55
|
codeChannel?: CodeChannelConfig;
|
|
48
|
-
/**
|
|
56
|
+
/** 是否展示会员价格与价格标签(价格下方的会员标签,如 Member Price) */
|
|
49
57
|
showMemberPrice?: boolean;
|
|
50
58
|
/** 是否展示折扣标签 */
|
|
51
59
|
showDiscount?: boolean;
|
|
@@ -63,10 +71,41 @@ export interface ActiveShelfData {
|
|
|
63
71
|
showOriginalPrice?: boolean;
|
|
64
72
|
/** 文案配置 */
|
|
65
73
|
copy?: CopyConfig;
|
|
74
|
+
/** 标签形态配置:按位置(第 0/第 1 个)指定形态,优先于 tag 数据自带 variant 与默认规则 */
|
|
75
|
+
tagTypeConfig?: TagTypeConfig;
|
|
76
|
+
/** fill 形态标签颜色(bgColor=背景色,outlineColor=描边色),覆盖默认品牌色 */
|
|
77
|
+
fill?: TagColorConfig['fill'];
|
|
78
|
+
/** outline 形态标签颜色(outlineColor=描边色,bgColor=背景色),覆盖默认品牌色 */
|
|
79
|
+
outline?: TagColorConfig['outline'];
|
|
80
|
+
/** 会员价标签(priceLabel,如 Member Price)文字颜色。设置后会覆盖默认的品牌色 */
|
|
81
|
+
memberPriceTextColor?: string;
|
|
82
|
+
/** 用户身份(会员标签模块) */
|
|
83
|
+
userType?: UserType;
|
|
84
|
+
/** 会员标签模块三种状态的装饰图 */
|
|
85
|
+
memberImages?: Partial<Record<UserType, Img>>;
|
|
86
|
+
/** 左上角自定义标签图标 */
|
|
87
|
+
customTagsIcon?: Img;
|
|
88
|
+
/** 自定义折扣标签图标样式(style1/style2/style3 为内置预设,custom 为自定义上传) */
|
|
89
|
+
customTagStyle?: DiscountTagStyle;
|
|
90
|
+
/** PC 端(≥768px)平铺最多展示行数 */
|
|
91
|
+
tileMaxRowsPc?: number;
|
|
92
|
+
/** 移动端(<768px)平铺最多展示行数 */
|
|
93
|
+
tileMaxRowsMob?: number;
|
|
94
|
+
/** 平铺布局桌面端(≥1440px)每行列数,'3' 或 '4',默认 '4' */
|
|
95
|
+
tileDesktopColumns?: TileDesktopColumns;
|
|
96
|
+
/** 平铺布局折叠时「展开」按钮文案,默认 'Show more' */
|
|
97
|
+
tileExpandText?: string;
|
|
98
|
+
/** 平铺布局展开后「收起」按钮文案,默认 'Show less' */
|
|
99
|
+
tileCollapseText?: string;
|
|
66
100
|
/**
|
|
67
101
|
* 产品列表(当不使用 Tab 分组时可直接传入产品列表)
|
|
68
102
|
*/
|
|
69
103
|
productsCard: ProductCardData[];
|
|
104
|
+
/** 资源块(如 PromotionalBar),非 Tab 模式下生效 */
|
|
105
|
+
resourceBlocks?: Array<PromotionalBarProps['data'] & {
|
|
106
|
+
blockType: string;
|
|
107
|
+
display: 'visible' | 'hidden';
|
|
108
|
+
}>;
|
|
70
109
|
}
|
|
71
110
|
export interface ActiveShelfProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
72
111
|
/** 业务数据 */
|
|
@@ -77,6 +116,12 @@ export interface ActiveShelfProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
77
116
|
onShopNow?: (product: ProductCardData) => void;
|
|
78
117
|
/** 点击加入购物车回调 */
|
|
79
118
|
onAddToCart?: (product: ProductCardData) => void;
|
|
119
|
+
/** 点击产品图片 / 场景图 / 标题跳转详情回调;未传时回退到 product.listingLink */
|
|
120
|
+
onProductImageClick?: (product: ProductCardData) => void;
|
|
121
|
+
/** 点击会员标签模块游客副标题(注册/登录)回调 */
|
|
122
|
+
onMemberSignUp?: () => void;
|
|
123
|
+
/** 点击会员标签模块付费会员折扣文案(加购付费会员sku)回调 */
|
|
124
|
+
onPlusMemberAddCart?: () => void;
|
|
80
125
|
/** 语义化类名 */
|
|
81
126
|
classNames?: Partial<Record<ActiveShelfSemanticName, string>>;
|
|
82
127
|
/**
|
|
@@ -88,6 +133,11 @@ export interface ActiveShelfProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
88
133
|
renderOriginalPrice?: (product: ProductCardData, context: {
|
|
89
134
|
showOriginalPrice?: boolean;
|
|
90
135
|
}) => React.ReactNode;
|
|
136
|
+
/** 自定义折扣标签渲染(仅 customTagStyle=custom 时生效) */
|
|
137
|
+
renderDiscountBadge?: (ctx: {
|
|
138
|
+
text?: string;
|
|
139
|
+
layoutMode: ActiveShelfLayoutMode;
|
|
140
|
+
}) => React.ReactNode;
|
|
91
141
|
}
|
|
92
142
|
/**
|
|
93
143
|
* ActiveShelf 复合组件类型定义
|
|
@@ -101,4 +151,4 @@ declare const ActiveShelfWrapped: React.ForwardRefExoticComponent<Omit<ActiveShe
|
|
|
101
151
|
ProductCard: typeof ProductCard;
|
|
102
152
|
};
|
|
103
153
|
export default ActiveShelfWrapped;
|
|
104
|
-
export type { StockDisplayMode, ActiveShelfSemanticName, ProductCardData };
|
|
154
|
+
export type { StockDisplayMode, ActiveShelfSemanticName, ProductCardData, ActiveShelfLayoutMode };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var j=Object.create;var N=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var Z=Object.getPrototypeOf,G=Object.prototype.hasOwnProperty;var J=(i,o)=>{for(var r in o)N(i,r,{get:o[r],enumerable:!0})},O=(i,o,r,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let n of q(o))!G.call(i,n)&&n!==r&&N(i,n,{get:()=>o[n],enumerable:!(s=_(o,n))||s.enumerable});return i};var K=(i,o,r)=>(r=i!=null?j(Z(i)):{},O(o||!i||!i.__esModule?N(r,"default",{value:i,enumerable:!0}):r,i)),Q=i=>O(N({},"__esModule",{value:!0}),i);var ie={};J(ie,{default:()=>oe});module.exports=Q(ie);var t=require("react/jsx-runtime"),l=K(require("react")),E=require("../../helpers/index.js"),V=require("../../shared/Styles.js"),a=require("../../components/index.js"),R=require("swiper/react"),I=require("swiper/modules"),ae=require("swiper/css"),ne=require("swiper/css/navigation"),A=require("./ProductCard.js"),W=require("../../hooks/useExposure.js");const U="shelf",X="active_shelf",Y=({disabled:i})=>(0,t.jsxs)("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]",children:[(0,t.jsx)("path",{d:"M0 28C0 43.464 12.536 56 28 56C43.464 56 56 43.464 56 28C56 12.536 43.464 0 28 0C12.536 0 0 12.536 0 28Z",fill:"currentColor",fillOpacity:i?"0.2":"0.6"}),(0,t.jsx)("path",{d:"M31 22L25 28L31 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),ee=({disabled:i})=>(0,t.jsxs)("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]",children:[(0,t.jsx)("path",{d:"M0 28C0 12.536 12.536 0 28 0C43.464 0 56 12.536 56 28C56 43.464 43.464 56 28 56C12.536 56 0 43.464 0 28Z",fill:"currentColor",fillOpacity:i?"0.2":"0.6"}),(0,t.jsx)("path",{d:"M25 22L31 28L25 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),F=l.forwardRef(({products:i,layoutMode:o,className:r,copy:s,showTags:n,stockDisplayMode:c,stockThresholdValue:m,onLearnMore:P,onShopNow:B,onAddToCart:p,classNames:g,secondaryButtonText:y,secondaryButtonFun:f,primaryButtonText:T,primaryButtonFun:b,showOriginalPrice:v,renderOriginalPrice:w},M)=>{const C=l.useId().replace(/:/g,""),x=`swiper-button-next-custom-${C}`,L=`swiper-button-prev-custom-${C}`,[u,d]=l.useState({isBeginning:!0,isEnd:!1}),D=l.useRef(null),h=l.useCallback(()=>{const e=D.current;if(!e?.slides||e.slides.length===0)return;e.slides.forEach(k=>{k.style.height="auto"});const S=Array.from(e.slides).map(k=>k.scrollHeight),H=Math.max(...S);H>0&&e.slides.forEach(k=>{k.style.height=`${H}px`})},[]);return l.useEffect(()=>{const e=()=>{requestAnimationFrame(h)};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[h]),i?.length===0?null:(0,t.jsx)("div",{ref:M,className:r,children:o==="flex"?(0,t.jsx)("div",{className:"lg-desktop:gap-4 tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 laptop:gap-4 grid grid-cols-1 justify-start gap-3",children:i.map((e,S)=>(0,t.jsx)(A.ProductCard,{product:e,className:"shrink-0",showTags:n,stockDisplayMode:c,stockThresholdValue:m,onLearnMore:P,onShopNow:B,onAddToCart:p,classNames:g,secondaryButtonText:y,secondaryButtonFun:f,primaryButtonText:T,primaryButtonFun:b,showOriginalPrice:v,renderOriginalPrice:w,copy:s},e.shopify_id+"-"+e.sku||S))}):(0,t.jsxs)("div",{className:"group relative",children:[(0,t.jsx)(R.Swiper,{modules:[I.Navigation],spaceBetween:16,slidesPerView:"auto",navigation:{nextEl:`.${x}`,prevEl:`.${L}`},onSwiper:e=>{D.current=e,d({isBeginning:e.isBeginning,isEnd:e.isEnd}),setTimeout(h,100)},onReachEnd:()=>{d(e=>({...e,isEnd:!0}))},onReachBeginning:()=>{d(e=>({...e,isBeginning:!0}))},onFromEdge:()=>{d({isBeginning:!1,isEnd:!1})},className:"!overflow-visible",children:i.map((e,S)=>(0,t.jsx)(R.SwiperSlide,{className:"tablet:!w-[288px] desktop:!w-[316px] lg-desktop:!w-[404px] !w-[296px] overflow-hidden",children:(0,t.jsx)(A.ProductCard,{product:e,className:"w-full max-w-full",showTags:n,stockDisplayMode:c,stockThresholdValue:m,onLearnMore:P,onShopNow:B,onAddToCart:p,classNames:g,secondaryButtonText:y,secondaryButtonFun:f,primaryButtonText:T,primaryButtonFun:b,showOriginalPrice:v,renderOriginalPrice:w,copy:s})},e.shopify_id+"-"+e.sku||S))}),(0,t.jsx)("button",{className:`${L} tablet:block absolute left-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${u.isBeginning?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":s?.previousSlideLabel,children:(0,t.jsx)(Y,{disabled:u.isBeginning})}),(0,t.jsx)("button",{className:`${x} tablet:block absolute right-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${u.isEnd?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":s?.nextSlideLabel,children:(0,t.jsx)(ee,{disabled:u.isEnd})})]})})});F.displayName="ProductsList";const z=l.forwardRef(({className:i,data:o,onLearnMore:r,onShopNow:s,onAddToCart:n,classNames:c,renderOriginalPrice:m,...P},B)=>{const p=l.useRef(null);(0,W.useExposure)(p,{componentType:U,componentName:X,componentTitle:o.title,componentDescription:o.description}),l.useImperativeHandle(B,()=>p.current);const{theme:g="light",layoutMode:y="flex",showTags:f=!0,stockDisplayMode:T,stockThresholdValue:b,showOriginalPrice:v=!0,secondaryButtonText:w,primaryButtonText:M,secondaryButtonFun:C,primaryButtonFun:x,isShowTab:L=!0,copy:u}=o,d=u||{},D=o.productsTab&&o.productsTab.length>0,h=L&&D;return(0,t.jsxs)("div",{ref:p,className:(0,E.cn)("w-full",{"aiui-dark":g==="dark"},i,c?.root),style:{"--progress-track-bg":g==="dark"?"rgba(255, 255, 255, 0.2)":"rgba(0, 0, 0, 0.2)"},...P,children:[o.title&&(0,t.jsx)(a.Heading,{as:"h2",html:o.title,size:4,className:(0,E.cn)("text-info-primary mb-4",c?.title)}),o.description&&(0,t.jsx)(a.Text,{size:3,as:"p",html:o.description,className:(0,E.cn)("text-info-primary mb-6",c?.description)}),(0,t.jsxs)(a.Tabs,{defaultValue:o.productsTab?.[0]?.id,className:"w-full",children:[h&&(0,t.jsx)(a.TabsList,{className:"mb-6",children:o.productsTab?.map(e=>(0,t.jsx)(a.TabsTrigger,{value:e.id,children:e.tab},"tab-"+e.id))}),h?o.productsTab?.map(e=>(0,t.jsx)(a.TabsContent,{value:e.id,children:(0,t.jsx)(F,{products:e.data,layoutMode:y,copy:d,showTags:f,stockDisplayMode:T,stockThresholdValue:b,onLearnMore:r,onShopNow:s,onAddToCart:n,classNames:c,secondaryButtonText:w,secondaryButtonFun:C,primaryButtonText:M,primaryButtonFun:x,showOriginalPrice:v,renderOriginalPrice:m})},"tab-content-"+e.id)):(0,t.jsx)(F,{products:o.productsCard,layoutMode:y,copy:d,showTags:f,stockDisplayMode:T,stockThresholdValue:b,onLearnMore:r,onShopNow:s,onAddToCart:n,classNames:c,secondaryButtonText:w,secondaryButtonFun:C,primaryButtonText:M,primaryButtonFun:x,showOriginalPrice:v,renderOriginalPrice:m})]})]})});z.displayName="ActiveShelf";const $=z;$.ProductCard=A.ProductCard;const te=(0,V.withLayout)($);var oe=te;
|
|
1
|
+
"use strict";"use client";var ke=Object.create;var te=Object.defineProperty;var Se=Object.getOwnPropertyDescriptor;var Be=Object.getOwnPropertyNames;var De=Object.getPrototypeOf,Le=Object.prototype.hasOwnProperty;var Ne=(i,o)=>{for(var r in o)te(i,r,{get:o[r],enumerable:!0})},de=(i,o,r,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let l of Be(o))!Le.call(i,l)&&l!==r&&te(i,l,{get:()=>o[l],enumerable:!(c=Se(o,l))||c.enumerable});return i};var ue=(i,o,r)=>(r=i!=null?ke(De(i)):{},de(o||!i||!i.__esModule?te(r,"default",{value:i,enumerable:!0}):r,i)),Re=i=>de(te({},"__esModule",{value:!0}),i);var Oe={};Ne(Oe,{default:()=>He});module.exports=Re(Oe);var e=require("react/jsx-runtime"),s=ue(require("react")),p=require("../../helpers/index.js"),he=require("../../shared/Styles.js"),n=require("../../components/index.js"),ae=ue(require("../PromotionalBar/index.js")),ie=require("swiper/react"),Te=require("swiper/modules"),$e=require("swiper/css"),je=require("swiper/css/navigation"),oe=require("./ProductCard.js"),be=require("../../hooks/useExposure.js");const Ae="shelf",Ee="active_shelf",Ie=()=>(0,e.jsxs)("span",{className:"lg-desktop:size-14 relative flex size-10 items-center justify-center",children:[(0,e.jsx)("span",{className:"prev-mask bg-masks-0 group-hover/prev-mask:bg-masks-1 absolute inset-0 rounded-full transition-colors"}),(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",className:"lg-desktop:size-6 relative size-5",children:(0,e.jsx)("path",{d:"M15 6L9 12L15 18",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})]}),ze=()=>(0,e.jsxs)("span",{className:"lg-desktop:size-14 relative flex size-10 items-center justify-center",children:[(0,e.jsx)("span",{className:"next-mask bg-masks-0 group-hover/next-mask:bg-masks-1 absolute inset-0 rounded-full transition-colors"}),(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",className:"lg-desktop:size-6 relative size-5",children:(0,e.jsx)("path",{d:"M9 6L15 12L9 18",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})]});function pe(i){return typeof window>"u"?2:window.matchMedia("(min-width: 1440px)").matches?i==="3"?3:4:window.matchMedia("(min-width: 768px)").matches?3:2}function me(){return typeof window>"u"?!0:!window.matchMedia("(min-width: 768px)").matches}function ge(){return typeof window>"u"?!1:window.matchMedia("(min-width: 1025px)").matches}const re=s.forwardRef(({products:i,layoutMode:o,className:r,copy:c,showTags:l,stockDisplayMode:h,stockThresholdValue:T,onLearnMore:b,onShopNow:d,onAddToCart:w,onProductImageClick:C,classNames:j,secondaryButtonText:W,secondaryButtonFun:f,primaryButtonText:v,primaryButtonFun:x,showOriginalPrice:P,renderOriginalPrice:M,tagTypeConfig:k,fill:S,outline:B,memberPriceTextColor:D,renderDiscountBadge:L,userType:N,memberImages:_,customTagsIcon:R,customTagStyle:A,onMemberSignUp:E,onPlusMemberAddCart:I,tileMaxRowsPc:se,tileMaxRowsMob:q,tileDesktopColumns:u,tileExpandText:Z,tileCollapseText:G,showMemberPrice:z},J)=>{const F=s.useId().replace(/:/g,""),H=`swiper-button-next-custom-${F}`,O=`swiper-button-prev-custom-${F}`,[V,m]=s.useState({isBeginning:!0,isEnd:!1}),K=s.useRef(null),g=s.useCallback(()=>{const t=K.current;if(!t?.slides||t.slides.length===0)return;t.slides.forEach($=>{$.style.height="auto"});const U=Array.from(t.slides).map($=>$.scrollHeight),ce=Math.max(...U);ce>0&&t.slides.forEach($=>{$.style.height=`${ce}px`})},[]);s.useEffect(()=>{const t=()=>{requestAnimationFrame(g)};return window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)},[g]);const[y,a]=s.useState(!1),[Q,X]=s.useState(()=>pe(u)),[we,Ce]=s.useState(()=>me()),[ve,xe]=s.useState(()=>ge());s.useEffect(()=>{const t=()=>{X(pe(u)),Ce(me()),xe(ge())};return t(),window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)},[u]);const Y=o==="horizontal"&&!ve?"flex":o,ee=we?q:se,ne=Y==="flex"&&!!ee&&ee>0,le=ee?ee*Q:i.length,Pe=ne&&i.length>le,Me=ne&&!y?i.slice(0,le):i;return i?.length===0?null:(0,e.jsx)("div",{ref:J,className:r,children:Y==="flex"?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:(0,p.cn)("tablet:grid-cols-3 tablet:gap-4 grid grid-cols-2 justify-start gap-3",u==="3"?"desktop:grid-cols-3 lg-desktop:grid-cols-3":"desktop:grid-cols-4 lg-desktop:grid-cols-4"),children:Me.map((t,U)=>(0,e.jsx)(oe.ProductCard,{product:t,layoutMode:Y,className:"shrink-0",showTags:l,stockDisplayMode:h,stockThresholdValue:T,onLearnMore:b,onShopNow:d,onAddToCart:w,onProductImageClick:C,classNames:j,secondaryButtonText:W,secondaryButtonFun:f,primaryButtonText:v,primaryButtonFun:x,showOriginalPrice:P,renderOriginalPrice:M,renderDiscountBadge:L,tagTypeConfig:k,fill:S,outline:B,memberPriceTextColor:D,copy:c,userType:N,memberImages:_,customTagsIcon:R,customTagStyle:A,onMemberSignUp:E,onPlusMemberAddCart:I,showMemberPrice:z},t.shopify_id+"-"+t.sku||U))}),Pe&&(0,e.jsxs)("div",{className:"laptop:hover:text-brand-0 text-info-primary mt-6 flex items-center justify-center",children:[(0,e.jsx)("button",{className:"laptop:text-base text-sm font-bold",onClick:()=>a(t=>!t),children:y?G??"Show less":Z??"Show more"}),(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:(0,p.cn)("laptop:size-5 size-4",y&&"rotate-180"),width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",children:(0,e.jsx)("path",{d:"M17.2929 8.29302C17.6834 7.90249 18.3164 7.90249 18.707 8.29302C19.0975 8.68354 19.0975 9.31655 18.707 9.70708L12.707 15.7071C12.3164 16.0976 11.6834 16.0976 11.2929 15.7071L5.29289 9.70708C4.90237 9.31655 4.90237 8.68354 5.29289 8.29302C5.68342 7.90249 6.31643 7.90249 6.70696 8.29302L11.9999 13.586L17.2929 8.29302Z",fill:"currentColor"})})]})]}):(0,e.jsxs)("div",{className:"group relative",children:[(0,e.jsx)(ie.Swiper,{modules:[Te.Navigation],spaceBetween:16,navigation:{nextEl:`.${H}`,prevEl:`.${O}`},onSwiper:t=>{K.current=t,m({isBeginning:t.isBeginning,isEnd:t.isEnd}),setTimeout(g,100)},slidesPerView:3,breakpoints:{1025:{freeMode:!1,slidesPerView:3},1440:{freeMode:!1,slidesPerView:u==="3"?3:4}},onReachEnd:()=>{m(t=>({...t,isEnd:!0}))},onReachBeginning:()=>{m(t=>({...t,isBeginning:!0}))},onFromEdge:()=>{m({isBeginning:!1,isEnd:!1})},className:"!overflow-visible [&_.swiper-wrapper]:items-start",children:i.map((t,U)=>(0,e.jsx)(ie.SwiperSlide,{className:"overflow-hidden",children:(0,e.jsx)(oe.ProductCard,{product:t,layoutMode:Y,className:"w-full max-w-full",showTags:l,stockDisplayMode:h,stockThresholdValue:T,onLearnMore:b,onShopNow:d,onAddToCart:w,onProductImageClick:C,classNames:j,secondaryButtonText:W,secondaryButtonFun:f,primaryButtonText:v,primaryButtonFun:x,showOriginalPrice:P,renderOriginalPrice:M,renderDiscountBadge:L,tagTypeConfig:k,fill:S,outline:B,memberPriceTextColor:D,copy:c,userType:N,memberImages:_,customTagsIcon:R,customTagStyle:A,onMemberSignUp:E,onPlusMemberAddCart:I,showMemberPrice:z})},t.shopify_id+"-"+t.sku||U))}),(0,e.jsx)("button",{className:`${O} tablet:block group/prev-mask absolute left-4 top-1/2 z-10 hidden -translate-y-1/2 ${V.isBeginning?"pointer-events-none opacity-0":"opacity-100"}`,"aria-label":c?.previousSlideLabel,children:(0,e.jsx)(Ie,{})}),(0,e.jsx)("button",{className:`${H} tablet:block group/next-mask absolute right-4 top-1/2 z-10 hidden -translate-y-1/2 ${V.isEnd?"pointer-events-none opacity-0":"opacity-100"}`,"aria-label":c?.nextSlideLabel,children:(0,e.jsx)(ze,{})})]})})});re.displayName="ProductsList";const fe=s.forwardRef(({className:i,data:o,onLearnMore:r,onShopNow:c,onAddToCart:l,onProductImageClick:h,onMemberSignUp:T,onPlusMemberAddCart:b,classNames:d,renderOriginalPrice:w,renderDiscountBadge:C,...j},W)=>{const f=s.useRef(null);(0,be.useExposure)(f,{componentType:Ae,componentName:Ee,componentTitle:o.title,componentDescription:o.description}),s.useImperativeHandle(W,()=>f.current);const{theme:v="light",layoutMode:x="flex",showTags:P=!0,stockDisplayMode:M,stockThresholdValue:k,showOriginalPrice:S,secondaryButtonText:B,primaryButtonText:D,secondaryButtonFun:L,primaryButtonFun:N,isShowTab:_=!0,tagTypeConfig:R,fill:A,outline:E,memberPriceTextColor:I,copy:se,userType:q,memberImages:u,customTagsIcon:Z,customTagStyle:G,showMemberPrice:z,tileMaxRowsPc:J,tileMaxRowsMob:F,tileDesktopColumns:H,tileExpandText:O,tileCollapseText:V}=o,m=se||{},K=o.productsTab&&o.productsTab.length>0,g=_&&K,y=g?void 0:o.resourceBlocks?.find(a=>a.blockType==="PromotionalBar"&&a.display==="visible");return(0,e.jsxs)("div",{ref:f,className:(0,p.cn)("w-full",{"aiui-dark":v==="dark"},i,d?.root),style:{"--progress-track-bg":v==="dark"?"rgba(255, 255, 255, 0.2)":"rgba(0, 0, 0, 0.2)"},...j,children:[o.title&&(0,e.jsx)(n.Heading,{as:"h2",html:o.title,size:4,className:(0,p.cn)("text-info-primary mb-4 leading-tight",d?.title)}),o.description&&(0,e.jsx)(n.Text,{size:3,as:"p",html:o.description,className:(0,p.cn)("text-info-primary mb-6",d?.description)}),(0,e.jsxs)(n.Tabs,{defaultValue:o.productsTab?.[0]?.id,className:"w-full",children:[g&&(0,e.jsx)(n.TabsList,{className:"mb-6",children:o.productsTab?.map(a=>(0,e.jsx)(n.TabsTrigger,{value:a.id,children:a.tab},"tab-"+a.id))}),g?o.productsTab?.map(a=>{const Q=a.resourceBlocks?.find(X=>X.blockType==="PromotionalBar"&&X.display==="visible");return(0,e.jsxs)(n.TabsContent,{value:a.id,children:[Q&&(0,e.jsx)(ae.default,{data:Q,className:(0,p.cn)("laptop:mb-4 mb-3",d?.promotionalBar)}),(0,e.jsx)(re,{products:a.data,layoutMode:x,copy:m,showTags:P,stockDisplayMode:M,stockThresholdValue:k,onLearnMore:r,onShopNow:c,onAddToCart:l,onProductImageClick:h,classNames:d,secondaryButtonText:B,secondaryButtonFun:L,primaryButtonText:D,primaryButtonFun:N,showOriginalPrice:S,renderOriginalPrice:w,renderDiscountBadge:C,tagTypeConfig:R,fill:A,outline:E,memberPriceTextColor:I,userType:q,memberImages:u,customTagsIcon:Z,customTagStyle:G,onMemberSignUp:T,onPlusMemberAddCart:b,showMemberPrice:z,tileMaxRowsPc:J,tileMaxRowsMob:F,tileDesktopColumns:H,tileExpandText:O,tileCollapseText:V})]},"tab-content-"+a.id)}):(0,e.jsxs)(e.Fragment,{children:[y&&(0,e.jsx)(ae.default,{data:y,className:(0,p.cn)("laptop:mb-4 mb-3",d?.promotionalBar)}),(0,e.jsx)(re,{products:o.productsCard,layoutMode:x,copy:m,showTags:P,stockDisplayMode:M,stockThresholdValue:k,onLearnMore:r,onShopNow:c,onAddToCart:l,onProductImageClick:h,classNames:d,secondaryButtonText:B,secondaryButtonFun:L,primaryButtonText:D,primaryButtonFun:N,showOriginalPrice:S,renderOriginalPrice:w,renderDiscountBadge:C,tagTypeConfig:R,fill:A,outline:E,memberPriceTextColor:I,userType:q,memberImages:u,customTagsIcon:Z,customTagStyle:G,onMemberSignUp:T,onPlusMemberAddCart:b,showMemberPrice:z,tileMaxRowsPc:J,tileMaxRowsMob:F,tileDesktopColumns:H,tileExpandText:O,tileCollapseText:V})]})]})]})});fe.displayName="ActiveShelf";const ye=fe;ye.ProductCard=oe.ProductCard;const Fe=(0,he.withLayout)(ye);var He=Fe;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ActiveShelf 布局样式 key
|
|
3
|
+
* 每个 key 对应一个会随 layoutMode(flex=网格 / horizontal=横向轮播)切换的元素样式。
|
|
4
|
+
* 新增样式项时在此追加 key,TypeScript 会强制 flex / horizontal 两端都补齐,防止漂移。
|
|
5
|
+
*/
|
|
6
|
+
export type LayoutStyleKey = 'cardContent' | 'image' | 'imageOffset' | 'title' | 'description' | 'price' | 'priceLabel' | 'cardRadius' | 'priceGap' | 'discountBadgeSize' | 'discountBadgeText' | 'discountBadgeTextStyle2' | 'discountBadgeTextStyle3' | 'discountBadgeTextCenter' | 'buttonContainer' | 'buttonItem' | 'memberLabelContainer' | 'memberLabelText';
|
|
7
|
+
/**
|
|
8
|
+
* 布局样式映射表
|
|
9
|
+
* 每个元素按 mobile(默认)→ laptop(1025) → desktop(1440) → lg-desktop(1920) 四档声明。
|
|
10
|
+
* - cardContent / memberLabelContainer 控制内边距
|
|
11
|
+
* - image 控制产品图尺寸
|
|
12
|
+
* - title / description / price / priceLabel / memberLabelText 控制字号
|
|
13
|
+
*/
|
|
14
|
+
export declare const layoutModeStyles: {
|
|
15
|
+
flex: {
|
|
16
|
+
cardContent: string;
|
|
17
|
+
image: string;
|
|
18
|
+
imageOffset: string;
|
|
19
|
+
title: string;
|
|
20
|
+
description: string;
|
|
21
|
+
price: string;
|
|
22
|
+
priceLabel: string;
|
|
23
|
+
cardRadius: string;
|
|
24
|
+
priceGap: string;
|
|
25
|
+
discountBadgeSize: string;
|
|
26
|
+
discountBadgeText: string;
|
|
27
|
+
discountBadgeTextStyle2: string;
|
|
28
|
+
discountBadgeTextStyle3: string;
|
|
29
|
+
discountBadgeTextCenter: string;
|
|
30
|
+
buttonContainer: string;
|
|
31
|
+
buttonItem: string;
|
|
32
|
+
memberLabelContainer: string;
|
|
33
|
+
memberLabelText: string;
|
|
34
|
+
};
|
|
35
|
+
horizontal: {
|
|
36
|
+
cardContent: string;
|
|
37
|
+
image: string;
|
|
38
|
+
imageOffset: string;
|
|
39
|
+
title: string;
|
|
40
|
+
description: string;
|
|
41
|
+
price: string;
|
|
42
|
+
priceLabel: string;
|
|
43
|
+
cardRadius: string;
|
|
44
|
+
priceGap: string;
|
|
45
|
+
discountBadgeSize: string;
|
|
46
|
+
discountBadgeText: string;
|
|
47
|
+
discountBadgeTextStyle2: string;
|
|
48
|
+
discountBadgeTextStyle3: string;
|
|
49
|
+
discountBadgeTextCenter: string;
|
|
50
|
+
buttonContainer: string;
|
|
51
|
+
buttonItem: string;
|
|
52
|
+
memberLabelContainer: string;
|
|
53
|
+
memberLabelText: string;
|
|
54
|
+
};
|
|
55
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var l=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var i=(e,t)=>{for(var o in t)l(e,o,{get:t[o],enumerable:!0})},n=(e,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of s(t))!d.call(e,p)&&p!==o&&l(e,p,{get:()=>t[p],enumerable:!(a=x(t,p))||a.enumerable});return e};var g=e=>n(l({},"__esModule",{value:!0}),e);var c={};i(c,{layoutModeStyles:()=>r});module.exports=g(c);const r={flex:{cardContent:"px-2 pb-4 pt-6 laptop:px-4 desktop:p-6",image:"size-[125px] laptop:size-[180px] lg-desktop:size-[240px]",imageOffset:"-top-6 -left-2 -right-2 laptop:-left-4 laptop:-right-4 desktop:-left-6 desktop:-right-6",title:"text-[14px] leading-tight laptop:mb-1 laptop:text-[20px] lg-desktop:text-[24px] line-clamp-3 laptop:line-clamp-2",description:"hidden text-[14px] desktop:text-[16px] lg-desktop:text-[18px] laptop:block laptop:line-clamp-2 leading-normal",price:"text-[14px] leading-tight laptop:text-[20px] lg-desktop:text-[24px]",priceLabel:"text-[12px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px]",cardRadius:"rounded-box-small tablet:rounded-box",priceGap:"gap-[2px] laptop:gap-1",discountBadgeSize:"size-12 laptop:size-20 lg-desktop:size-24",discountBadgeText:"text-xs laptop:text-base lg-desktop:text-xl pl-2 pt-1 laptop:pl-4 laptop:pt-2",discountBadgeTextStyle2:"text-xs laptop:text-base lg-desktop:text-xl pt-2 desktop:pt-4",discountBadgeTextStyle3:"text-xs laptop:text-base lg-desktop:text-xl flex items-center pl-1 laptop:pl-2",discountBadgeTextCenter:"text-xs laptop:text-base lg-desktop:text-xl flex items-center justify-center",buttonContainer:"flex-wrap gap-2 laptop:flex-nowrap lg-desktop:gap-3",buttonItem:"w-full whitespace-nowrap laptop:w-fit laptop:min-w-0 laptop:whitespace-normal laptop:text-center",memberLabelContainer:"p-2 laptop:px-4 laptop:py-3 desktop:pl-6 desktop:py-4 desktop:pr-12 lg-desktop:pr-16",memberLabelText:"text-xs laptop:text-sm desktop:text-base lg-desktop:text-[18px]"},horizontal:{cardContent:"p-4 desktop:p-6",image:"size-[180px] lg-desktop:size-[240px]",imageOffset:"-top-4 -left-4 -right-4 desktop:-top-6 desktop:-left-6 desktop:-right-6",title:"mb-1 text-[20px] leading-[120%] lg-desktop:text-[24px] line-clamp-2",description:"text-[14px] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 leading-normal",price:"text-[20px] leading-[120%] lg-desktop:text-[24px]",priceLabel:"text-[14px] leading-[140%] desktop:text-[16px] lg-desktop:text-[18px]",cardRadius:"rounded-box",priceGap:"gap-1",discountBadgeSize:"size-20 lg-desktop:size-24",discountBadgeText:"text-base lg-desktop:text-xl pt-2 pl-4",discountBadgeTextStyle2:"text-base lg-desktop:text-xl pt-2 desktop:pt-4",discountBadgeTextStyle3:"text-base lg-desktop:text-xl flex items-center pl-1 laptop:pl-2",discountBadgeTextCenter:"text-base lg-desktop:text-xl flex items-center justify-center",buttonContainer:"gap-2 lg-desktop:gap-3",buttonItem:"w-full whitespace-nowrap tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center",memberLabelContainer:"px-4 py-3 desktop:pl-6 desktop:py-4 desktop:pr-12 lg-desktop:pr-16",memberLabelText:"text-xs laptop:text-sm desktop:text-base lg-desktop:text-[18px]"}};
|
|
@@ -2,6 +2,68 @@
|
|
|
2
2
|
* 按钮功能类型
|
|
3
3
|
*/
|
|
4
4
|
export type ButtonFunctionType = 'buyNow' | 'addCart' | 'learnMore';
|
|
5
|
+
/**
|
|
6
|
+
* 自定义折扣标签图标样式
|
|
7
|
+
* style1/style2/style3 为内置预设样式(写死在组件中),custom 为自定义上传图标
|
|
8
|
+
*/
|
|
9
|
+
export type DiscountTagStyle = 'style1' | 'style2' | 'style3' | 'custom';
|
|
10
|
+
/**
|
|
11
|
+
* 自定义标签形态
|
|
12
|
+
* fill=填充(品牌渐变背景),outline=描边(透明背景 + 描边)
|
|
13
|
+
*/
|
|
14
|
+
export type TagVariant = 'fill' | 'outline';
|
|
15
|
+
/**
|
|
16
|
+
* 标签形态配置(组件级)
|
|
17
|
+
* 按标签位置(第 0 个 / 第 1 个)统一指定形态,优先于 tag 数据自带 variant 与默认规则。
|
|
18
|
+
*/
|
|
19
|
+
export interface TagTypeConfig {
|
|
20
|
+
/** 第 0 个标签的形态(fill=填充 / outline=描边),空字符串视为未设置 */
|
|
21
|
+
firstTagVariant?: TagVariant | '';
|
|
22
|
+
/** 第 1 个标签的形态(fill=填充 / outline=描边),空字符串视为未设置 */
|
|
23
|
+
secondTagVariant?: TagVariant | '';
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* 标签颜色配置(组件级)
|
|
27
|
+
* 按形态(fill / outline)统一指定颜色,覆盖默认品牌色。
|
|
28
|
+
* - fill:bgColor=背景色,outlineColor=描边色
|
|
29
|
+
* - outline:outlineColor=描边色(文字色自动跟随),bgColor=背景色
|
|
30
|
+
*/
|
|
31
|
+
export interface TagColorConfig {
|
|
32
|
+
/** fill 形态标签颜色 */
|
|
33
|
+
fill?: {
|
|
34
|
+
bgColor?: string;
|
|
35
|
+
outlineColor?: string;
|
|
36
|
+
};
|
|
37
|
+
/** outline 形态标签颜色 */
|
|
38
|
+
outline?: {
|
|
39
|
+
outlineColor?: string;
|
|
40
|
+
bgColor?: string;
|
|
41
|
+
};
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* 组件布局模式
|
|
45
|
+
* flex=网格布局,horizontal=横向轮播
|
|
46
|
+
*/
|
|
47
|
+
export type ActiveShelfLayoutMode = 'flex' | 'horizontal';
|
|
48
|
+
/**
|
|
49
|
+
* 用户身份类型
|
|
50
|
+
*/
|
|
51
|
+
export type UserType = 'guest' | 'member' | 'plus-member';
|
|
52
|
+
/**
|
|
53
|
+
* SKU 会员活动标签类型
|
|
54
|
+
* guest=会员模块游客态活动文案,member=会员模块会员态活动文案(普通会员/付费会员共用)
|
|
55
|
+
*/
|
|
56
|
+
export type ActivityLabelType = 'guest' | 'member';
|
|
57
|
+
/**
|
|
58
|
+
* SKU 会员活动配置项
|
|
59
|
+
* 依据飞书规则矩阵:activityLabels 为对象数组,每项含 type 与 label
|
|
60
|
+
*/
|
|
61
|
+
export interface ActivityLabel {
|
|
62
|
+
/** 标签类型:guest=游客态活动,member=会员态活动(普通/付费共用) */
|
|
63
|
+
type: ActivityLabelType;
|
|
64
|
+
/** 标签文案 */
|
|
65
|
+
label: string;
|
|
66
|
+
}
|
|
5
67
|
/**
|
|
6
68
|
* ActiveShelf 文案配置接口
|
|
7
69
|
* 注意:secondaryButtonText 和 shopNowText 作为高频属性保持在 data 的直接属性中
|
|
@@ -21,4 +83,30 @@ export interface CopyConfig {
|
|
|
21
83
|
outOfStockLabel?: string;
|
|
22
84
|
limitedStock?: string;
|
|
23
85
|
couponTag?: string;
|
|
86
|
+
/** 作为 flooredOriginalPrice 的模板,支持 {amount} 占位符;无占位符时按纯前缀拼接 */
|
|
87
|
+
codeChannel?: string;
|
|
88
|
+
/** 会员模块游客状态标题文案 */
|
|
89
|
+
memberTitleLabelUpgrade?: string;
|
|
90
|
+
/** 会员模块普通会员状态标题文案 */
|
|
91
|
+
memberTitleLabel?: string;
|
|
92
|
+
/** 会员模块付费会员状态标题文案 */
|
|
93
|
+
plusmemberTitleLabel?: string;
|
|
94
|
+
/** 会员模块游客状态副标题文案 */
|
|
95
|
+
memberSubtitleLabelUpgrade?: string;
|
|
96
|
+
/** 会员模块普通会员状态副标题文案 */
|
|
97
|
+
memberSubtitleLabel?: string;
|
|
98
|
+
/** 会员模块付费会员状态副标题文案 */
|
|
99
|
+
plusmemberSubtitleLabel?: string;
|
|
100
|
+
/** 会员模块游客态活动文案 */
|
|
101
|
+
memberActivityLabelUnLogin?: string;
|
|
102
|
+
/** 会员模块会员态活动文案(普通会员/付费会员) */
|
|
103
|
+
memberActivityLabel?: string;
|
|
104
|
+
/** 会员模块游客态产品活动文案 */
|
|
105
|
+
productActivityLabelUnLogin?: string;
|
|
106
|
+
/** 会员模块会员态产品活动文案(普通会员/付费会员) */
|
|
107
|
+
productActivityLabel?: string;
|
|
108
|
+
/** 会员模块普通会员折扣文案,支持 {amount} 占位符(替换为普通会员折扣金额) */
|
|
109
|
+
memberDiscountLabel?: string;
|
|
110
|
+
/** 会员模块付费会员折扣文案,支持 {amount} 占位符(替换为付费会员折扣金额) */
|
|
111
|
+
plusMemberDiscountLabel?: string;
|
|
24
112
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var n=Object.defineProperty;var
|
|
1
|
+
"use strict";var n=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var s=Object.prototype.hasOwnProperty;var g=(t,e,l,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of o(e))!s.call(t,i)&&i!==l&&n(t,i,{get:()=>e[i],enumerable:!(r=a(e,i))||r.enumerable});return t};var b=t=>g(n({},"__esModule",{value:!0}),t);var p={};module.exports=b(p);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var C=Object.create;var f=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var H=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var w=(t,e)=>{for(var i in e)f(t,i,{get:e[i],enumerable:!0})},A=(t,e,i,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of D(e))!P.call(t,o)&&o!==i&&f(t,o,{get:()=>e[o],enumerable:!(l=z(e,o))||l.enumerable});return t};var L=(t,e,i)=>(i=t!=null?C(H(t)):{},A(e||!t||!t.__esModule?f(i,"default",{value:t,enumerable:!0}):i,t)),B=t=>A(f({},"__esModule",{value:!0}),t);var _={};w(_,{default:()=>j});module.exports=B(_);var s=require("react/jsx-runtime"),d=L(require("react")),a=require("../../components/index.js"),O=require("../../shared/Styles.js"),r=require("../../helpers/utils.js"),T=require("../../hooks/useExposure.js"),x=require("../../shared/trackUrlRef.js"),k=require("class-variance-authority"),y=require("../../helpers/index.js"),V=require("../AiuiProvider/index.js");const h="image",v="activity_mechanism",M=(0,k.cva)("line-clamp-2",{variants:{theme:{light:"text-[#080A0F]",dark:"text-white"}},defaultVariants:{theme:"light"}}),R=(0,k.cva)("desktop:text-[16px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] tracking-[-0.02em]",{variants:{theme:{light:"text-[#080A0F]",dark:"text-white/80"}},defaultVariants:{theme:"light"}}),E=(0,k.cva)("mt-2 !p-0 text-[14px]",{variants:{theme:{light:"text-[#080A0F]",dark:"text-white"}},defaultVariants:{theme:"light"}}),g={default:767,tablet:1024,laptop:1439,desktop:1919,lgDesktop:9999},S=t=>{if(!t)return"";const e=[];return t.lgDesktop?.url&&e.push(`${t.lgDesktop.url}`),t.desktop?.url&&e.push(`${t.desktop.url} ${g.desktop}`),t.laptop?.url&&e.push(`${t.laptop.url} ${g.laptop}`),t.tablet?.url&&e.push(`${t.tablet.url} ${g.tablet}`),t.default?.url&&e.push(`${t.default.url} ${g.default}`),e.join(", ")},b=t=>t&&(t.default?.alt||t.tablet?.alt||t.laptop?.alt||t.desktop?.alt||t.lgDesktop?.alt)||"",F=({item:t,theme:e,classNames:i})=>{const{title:l,description:o,linkText:n,linkHref:c,backgroundImage:m}=t,p=S(m),u=b(m),{locale:$="us"}=(0,V.useAiuiContext)();return(0,s.jsx)("div",{className:(0,r.cn)("rounded-card relative flex flex-col overflow-hidden","desktop:px-6 h-[280px] p-4","laptop:gap-4 gap-3","laptop:h-[320px] lg-desktop:[400px]",i?.card),"data-headless-type-name":`${h}#${v}`,children:c?(0,s.jsxs)(a.Link,{href:(0,y.getLocalizedPath)((0,x.trackUrlRef)(c,`${h}_${v}`),$),className:"no-underline",children:[p&&(0,s.jsx)(a.Picture,{source:p,alt:u||l,className:(0,r.cn)("absolute inset-0 size-full",i?.background),imgClassName:"size-full object-cover"}),(0,s.jsxs)("div",{className:"relative z-10",children:[(0,s.jsx)(a.Heading,{as:"h3",size:3,className:(0,r.cn)(M({theme:e}),i?.title),children:l}),(0,s.jsx)(a.Text,{as:"p",className:(0,r.cn)(R({theme:e}),i?.description),children:o}),n&&(0,s.jsx)(a.Button,{variant:"link",as:"a",href:(0,y.getLocalizedPath)((0,x.trackUrlRef)(c,`${h}_${v}`),$),className:(0,r.cn)(E({theme:e}),i?.link),"data-headless-title-desc-button":`${l}#${o}#${n}`,children:n})]})]}):(0,s.jsxs)(s.Fragment,{children:[p&&(0,s.jsx)(a.Picture,{source:p,alt:u||l,className:(0,r.cn)("absolute inset-0 size-full",i?.background),imgClassName:"size-full object-cover"}),(0,s.jsxs)("div",{className:"relative z-10",children:[(0,s.jsx)(a.Heading,{as:"h3",size:3,className:(0,r.cn)(M({theme:e}),i?.title),children:l}),(0,s.jsx)(a.Text,{as:"p",className:(0,r.cn)(R({theme:e}),i?.description),children:o})]})]})})},N=d.default.forwardRef(({data:t,classNames:e},i)=>{const{items:l=[],theme:o="light"}=t,n=(0,d.useRef)(null);if((0,d.useImperativeHandle)(i,()=>n.current),(0,T.useExposure)(n,{componentType:h,componentName:v,componentTitle:l[0]?.title||"",componentDescription:l[0]?.description||""}),!l||l.length===0)return null;const c={1:"laptop:grid-cols-1 desktop:grid-cols-1 lg-desktop:grid-cols-1",2:"laptop:grid-cols-2 desktop:grid-cols-2 lg-desktop:grid-cols-2",3:"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-3 lg-desktop:grid-cols-3",4:"laptop:grid-cols-4 desktop:grid-cols-4 lg-desktop:grid-cols-4"},m=c[Math.min(l.length,4)]||c[4];return(0,s.jsx)(a.Container,{"data-ui-component-id":"ActivityMechanism",className:(0,r.cn)("activity-mechanism","w-full",e?.root),ref:n,children:(0,s.jsx)("div",{className:(0,r.cn)("tablet:grid-cols-2 laptop:gap-4 grid grid-cols-1 gap-3",m,e?.grid),children:l.map((p,u)=>(0,s.jsx)(F,{item:p,theme:o,classNames:{...e,...l?.length===3&&{card:e?.card+" first:tablet:col-span-full first:laptop:col-span-1"}}},`${p.title}-${u}`))})})});N.displayName="ActivityMechanism";var j=N;
|
|
1
|
+
"use strict";"use client";var C=Object.create;var f=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var H=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var w=(t,e)=>{for(var i in e)f(t,i,{get:e[i],enumerable:!0})},A=(t,e,i,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of D(e))!P.call(t,o)&&o!==i&&f(t,o,{get:()=>e[o],enumerable:!(l=z(e,o))||l.enumerable});return t};var L=(t,e,i)=>(i=t!=null?C(H(t)):{},A(e||!t||!t.__esModule?f(i,"default",{value:t,enumerable:!0}):i,t)),B=t=>A(f({},"__esModule",{value:!0}),t);var _={};w(_,{default:()=>j});module.exports=B(_);var s=require("react/jsx-runtime"),d=L(require("react")),a=require("../../components/index.js"),O=require("../../shared/Styles.js"),r=require("../../helpers/utils.js"),T=require("../../hooks/useExposure.js"),x=require("../../shared/trackUrlRef.js"),k=require("class-variance-authority"),y=require("../../helpers/index.js"),V=require("../AiuiProvider/index.js");const h="image",v="activity_mechanism",M=(0,k.cva)("line-clamp-2",{variants:{theme:{light:"text-[#080A0F]",dark:"text-white"}},defaultVariants:{theme:"light"}}),R=(0,k.cva)("desktop:text-[16px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] tracking-[-0.02em]",{variants:{theme:{light:"text-[#080A0F]",dark:"text-white/80"}},defaultVariants:{theme:"light"}}),E=(0,k.cva)("mt-2 !p-0 text-[14px]",{variants:{theme:{light:"text-[#080A0F]",dark:"text-white"}},defaultVariants:{theme:"light"}}),g={default:767,tablet:1024,laptop:1439,desktop:1919,lgDesktop:9999},S=t=>{if(!t)return"";const e=[];return t.lgDesktop?.url&&e.push(`${t.lgDesktop.url}`),t.desktop?.url&&e.push(`${t.desktop.url} ${g.desktop}`),t.laptop?.url&&e.push(`${t.laptop.url} ${g.laptop}`),t.tablet?.url&&e.push(`${t.tablet.url} ${g.tablet}`),t.default?.url&&e.push(`${t.default.url} ${g.default}`),e.join(", ")},b=t=>t&&(t.default?.alt||t.tablet?.alt||t.laptop?.alt||t.desktop?.alt||t.lgDesktop?.alt)||"",F=({item:t,theme:e,classNames:i})=>{const{title:l,description:o,linkText:n,linkHref:c,backgroundImage:m}=t,p=S(m),u=b(m),{locale:$="us"}=(0,V.useAiuiContext)();return(0,s.jsx)("div",{className:(0,r.cn)("rounded-card relative flex flex-col overflow-hidden","desktop:px-6 h-[280px] p-4","laptop:gap-4 gap-3","laptop:h-[320px] lg-desktop:h-[400px]",i?.card),"data-headless-type-name":`${h}#${v}`,children:c?(0,s.jsxs)(a.Link,{href:(0,y.getLocalizedPath)((0,x.trackUrlRef)(c,`${h}_${v}`),$),className:"no-underline",children:[p&&(0,s.jsx)(a.Picture,{source:p,alt:u||l,className:(0,r.cn)("absolute inset-0 size-full",i?.background),imgClassName:"size-full object-cover"}),(0,s.jsxs)("div",{className:"relative z-10",children:[(0,s.jsx)(a.Heading,{as:"h3",size:3,className:(0,r.cn)(M({theme:e}),i?.title),children:l}),(0,s.jsx)(a.Text,{as:"p",className:(0,r.cn)(R({theme:e}),i?.description),children:o}),n&&(0,s.jsx)(a.Button,{variant:"link",as:"a",href:(0,y.getLocalizedPath)((0,x.trackUrlRef)(c,`${h}_${v}`),$),className:(0,r.cn)(E({theme:e}),i?.link),"data-headless-title-desc-button":`${l}#${o}#${n}`,children:n})]})]}):(0,s.jsxs)(s.Fragment,{children:[p&&(0,s.jsx)(a.Picture,{source:p,alt:u||l,className:(0,r.cn)("absolute inset-0 size-full",i?.background),imgClassName:"size-full object-cover"}),(0,s.jsxs)("div",{className:"relative z-10",children:[(0,s.jsx)(a.Heading,{as:"h3",size:3,className:(0,r.cn)(M({theme:e}),i?.title),children:l}),(0,s.jsx)(a.Text,{as:"p",className:(0,r.cn)(R({theme:e}),i?.description),children:o})]})]})})},N=d.default.forwardRef(({data:t,classNames:e},i)=>{const{items:l=[],theme:o="light"}=t,n=(0,d.useRef)(null);if((0,d.useImperativeHandle)(i,()=>n.current),(0,T.useExposure)(n,{componentType:h,componentName:v,componentTitle:l[0]?.title||"",componentDescription:l[0]?.description||""}),!l||l.length===0)return null;const c={1:"laptop:grid-cols-1 desktop:grid-cols-1 lg-desktop:grid-cols-1",2:"laptop:grid-cols-2 desktop:grid-cols-2 lg-desktop:grid-cols-2",3:"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-3 lg-desktop:grid-cols-3",4:"laptop:grid-cols-4 desktop:grid-cols-4 lg-desktop:grid-cols-4"},m=c[Math.min(l.length,4)]||c[4];return(0,s.jsx)(a.Container,{"data-ui-component-id":"ActivityMechanism",className:(0,r.cn)("activity-mechanism","w-full",e?.root),ref:n,children:(0,s.jsx)("div",{className:(0,r.cn)("tablet:grid-cols-2 laptop:gap-4 grid grid-cols-1 gap-3",m,e?.grid),children:l.map((p,u)=>(0,s.jsx)(F,{item:p,theme:o,classNames:{...e,...l?.length===3&&{card:e?.card+" first:tablet:col-span-full first:laptop:col-span-1"}}},`${p.title}-${u}`))})})});N.displayName="ActivityMechanism";var j=N;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var C=Object.create;var p=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var B=(e,t)=>{for(var a in t)p(e,a,{get:t[a],enumerable:!0})},g=(e,t,a,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of V(t))!I.call(e,s)&&s!==a&&p(e,s,{get:()=>t[s],enumerable:!(c=P(t,s))||c.enumerable});return e};var L=(e,t,a)=>(a=e!=null?C(z(e)):{},g(t||!e||!e.__esModule?p(a,"default",{value:e,enumerable:!0}):a,e)),E=e=>g(p({},"__esModule",{value:!0}),e);var R={};B(R,{default:()=>M});module.exports=E(R);var i=require("react/jsx-runtime"),v=L(require("react")),d=require("../../helpers/index.js"),l=require("../../components/index.js"),f=require("class-variance-authority"),h=require("swiper/react"),y=require("../../shared/Styles.js");const j=(0,f.cva)("rounded-card laptop:px-6 laptop:py-4 relative flex min-w-0 flex-col justify-between gap-2 overflow-hidden px-4 py-3",{variants:{state:{"active-light":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","active-dark":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","inactive-light":"bg-[#EAEAEC]","inactive-dark":"bg-[#1E2024]"},size:{small:"laptop:h-[160px] h-[120px]",large:"laptop:h-[240px] h-[200px]"}},defaultVariants:{state:"inactive-light",size:"small"}}),m=(0,f.cva)("font-bold leading-[1.2]",{variants:{state:{"active-light":"text-white","active-dark":"text-white","inactive-light":"text-[#080A0F]","inactive-dark":"text-white"}},defaultVariants:{state:"inactive-light"}}),w=v.memo(({item:e,theme:t="light",className:a,size:c})=>{const s=e.isActive||!1,o=`${s?"active":"inactive"}-${t}`;return(0,i.jsx)("div",{className:(0,d.cn)(j({state:o,size:c}),a),"data-ui-component-id":"ActivityScheduleCard",children:(0,i.jsxs)(l.Link,{asChild:!e?.link,href:e?.link,className:"size-full no-underline hover:text-current",children:[(s?e.activeIcon:e.inactiveIcon)&&(0,i.jsx)("div",{className:"laptop:w-[160px] aspect-1 absolute right-0 top-0 z-10 w-[120px]",children:(0,i.jsx)(l.Picture,{source:s?e.activeIcon.url:e.inactiveIcon.url,alt:s?e.activeIcon.alt:e.inactiveIcon.alt,className:"aspect-square"})}),(0,i.jsxs)("div",{className:"relative z-20 flex h-full flex-col justify-between",children:[(0,i.jsx)(l.Heading,{as:"h3",size:3,html:e.title,className:(0,d.cn)(m({state:o}))}),(0,i.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,i.jsx)("div",{className:"flex flex-col justify-end overflow-hidden",children:(0,i.jsx)(l.Heading,{as:"h4",size:2,html:e.subtitle,className:(0,d.cn)(" line-clamp-2",m({state:o}))})}),c==="large"&&e.description&&(0,i.jsx)(l.Text,{html:e.description,className:(0,d.cn)("lg-desktop:text-[18px] desktop:text-[16px] line-clamp-3 text-[14px] leading-[1.4]",m({state:o}))})]})]})]})})});w.displayName="ActivityScheduleCard";const x=v.forwardRef(({classNames:e={},data:t,...a},c)=>{const s=t.theme||"light",o=t.size||"
|
|
1
|
+
"use strict";"use client";var C=Object.create;var p=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var B=(e,t)=>{for(var a in t)p(e,a,{get:t[a],enumerable:!0})},g=(e,t,a,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of V(t))!I.call(e,s)&&s!==a&&p(e,s,{get:()=>t[s],enumerable:!(c=P(t,s))||c.enumerable});return e};var L=(e,t,a)=>(a=e!=null?C(z(e)):{},g(t||!e||!e.__esModule?p(a,"default",{value:e,enumerable:!0}):a,e)),E=e=>g(p({},"__esModule",{value:!0}),e);var R={};B(R,{default:()=>M});module.exports=E(R);var i=require("react/jsx-runtime"),v=L(require("react")),d=require("../../helpers/index.js"),l=require("../../components/index.js"),f=require("class-variance-authority"),h=require("swiper/react"),y=require("../../shared/Styles.js");const j=(0,f.cva)("rounded-card laptop:px-6 laptop:py-4 relative flex min-w-0 flex-col justify-between gap-2 overflow-hidden px-4 py-3",{variants:{state:{"active-light":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","active-dark":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","inactive-light":"bg-[#EAEAEC]","inactive-dark":"bg-[#1E2024]"},size:{small:"laptop:h-[160px] h-[120px]",large:"laptop:h-[240px] h-[200px]"}},defaultVariants:{state:"inactive-light",size:"small"}}),m=(0,f.cva)("font-bold leading-[1.2]",{variants:{state:{"active-light":"text-white","active-dark":"text-white","inactive-light":"text-[#080A0F]","inactive-dark":"text-white"}},defaultVariants:{state:"inactive-light"}}),w=v.memo(({item:e,theme:t="light",className:a,size:c})=>{const s=e.isActive||!1,o=`${s?"active":"inactive"}-${t}`;return(0,i.jsx)("div",{className:(0,d.cn)(j({state:o,size:c}),a),"data-ui-component-id":"ActivityScheduleCard",children:(0,i.jsxs)(l.Link,{asChild:!e?.link,href:e?.link,className:"size-full no-underline hover:text-current",children:[(s?e.activeIcon:e.inactiveIcon)&&(0,i.jsx)("div",{className:"laptop:w-[160px] aspect-1 absolute right-0 top-0 z-10 w-[120px]",children:(0,i.jsx)(l.Picture,{source:s?e.activeIcon.url:e.inactiveIcon.url,alt:s?e.activeIcon.alt:e.inactiveIcon.alt,className:"aspect-square"})}),(0,i.jsxs)("div",{className:"relative z-20 flex h-full flex-col justify-between",children:[(0,i.jsx)(l.Heading,{as:"h3",size:3,html:e.title,className:(0,d.cn)(m({state:o}))}),(0,i.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,i.jsx)("div",{className:"flex flex-col justify-end overflow-hidden",children:(0,i.jsx)(l.Heading,{as:"h4",size:2,html:e.subtitle,className:(0,d.cn)(" line-clamp-2",m({state:o}))})}),c==="large"&&e.description&&(0,i.jsx)(l.Text,{html:e.description,className:(0,d.cn)("lg-desktop:text-[18px] desktop:text-[16px] line-clamp-3 text-[14px] leading-[1.4]",m({state:o}))})]})]})]})})});w.displayName="ActivityScheduleCard";const x=v.forwardRef(({classNames:e={},data:t,...a},c)=>{const s=t.theme||"light",o=t.size||"small",r=v.useMemo(()=>t?.scheduleList?.length||2,[t?.scheduleList]),k=v.useMemo(()=>{const n=N=>{switch(N){case"mobile":return{slidesPerView:1.17,spaceBetween:12};case"tablet":return r===2?{slidesPerView:2,spaceBetween:12}:{slidesPerView:2.4,spaceBetween:12};case"laptop":return r===2?{}:r===4?{slidesPerView:3.2,spaceBetween:16}:{slidesPerView:r,spaceBetween:16};case"desktop":return r===2?{slidesPerView:2,spaceBetween:16}:{slidesPerView:r,spaceBetween:16}}},u=n("mobile"),S=n("tablet"),b=n("laptop"),A=n("desktop");return{0:u,768:S,1024:b,1440:A}},[r]);return(0,i.jsx)("div",{ref:c,className:(0,d.cn)(e?.root),"data-ui-component-id":"ActivitySchedule",...a,children:(0,i.jsx)(h.Swiper,{breakpoints:k,className:"w-full !overflow-visible",children:t?.scheduleList?.map((n,u)=>(0,i.jsx)(h.SwiperSlide,{children:(0,i.jsx)(w,{item:n,theme:s,size:o,className:e?.card})},"activityScheduleCardItem"+u))??null})})});x.displayName="ActivitySchedule";var M=(0,y.withLayout)(x);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var j=Object.create;var d=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var H=(e,r)=>{for(var
|
|
1
|
+
"use strict";"use client";var j=Object.create;var d=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var H=(e,r)=>{for(var a in r)d(e,a,{get:r[a],enumerable:!0})},k=(e,r,a,i)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of L(r))!A.call(e,o)&&o!==a&&d(e,o,{get:()=>r[o],enumerable:!(i=P(r,o))||i.enumerable});return e};var N=(e,r,a)=>(a=e!=null?j(z(e)):{},k(r||!e||!e.__esModule?d(a,"default",{value:e,enumerable:!0}):a,e)),D=e=>k(d({},"__esModule",{value:!0}),e);var F={};H(F,{default:()=>C});module.exports=D(F);var t=require("react/jsx-runtime"),s=require("react"),l=require("../../helpers/utils.js"),y=N(require("../../components/picture.js")),E=require("../../shared/Styles.js"),S=require("react-responsive"),M=require("../../hooks/useExposure.js"),c=require("swiper/react"),p=require("swiper/modules"),B=N(require("../Title/index.js"));const R="copy",Q="store_benefits",$=(e,r)=>{const a=[];for(let i=0;i<e.length;i+=r)a.push(e.slice(i,i+r));return a},w=(0,s.forwardRef)(({data:{items:e=[],itemShape:r,title:a,theme:i},className:o},u)=>{const[x,T]=(0,s.useState)(!1),v=(0,S.useMediaQuery)({query:"(max-width: 768px)"}),b=(0,s.useRef)(null),f=(0,s.useRef)(null);(0,s.useImperativeHandle)(u,()=>f.current),(0,M.useExposure)(f,{componentType:R,componentName:Q}),(0,s.useEffect)(()=>{T(v)},[v]);const I=x?$(e,3):e;return(0,t.jsxs)("div",{ref:f,className:(0,l.cn)("brand-equity-wrapper w-full",{"aiui-dark":i==="dark"},o),children:[a&&(0,t.jsx)(B.default,{data:{title:a}}),x?(0,t.jsxs)(c.Swiper,{className:(0,l.cn)(o),modules:[p.FreeMode,p.Mousewheel,p.Pagination],freeMode:!0,mousewheel:{forceToAxis:!0},pagination:{clickable:!0,el:b.current},breakpoints:{0:{spaceBetween:12}},children:[I?.map((n,m)=>(0,t.jsx)(c.SwiperSlide,{className:"!flex flex-col gap-3",children:Array.isArray(n)&&n?.map((g,h)=>(0,t.jsx)(q,{data:g,itemShape:r,index:h,theme:g.theme??i},h))},"SwiperSlide"+m)),(0,t.jsx)("div",{ref:b,className:"mt-3 flex justify-center"})]}):(0,t.jsx)("div",{className:(0,l.cn)("grid grid-cols-1 gap-3","tablet:grid-cols-2","laptop:gap-4 laptop:grid-cols-10"),children:e.map((n,m)=>(0,t.jsx)(q,{data:n,itemShape:r,index:m,theme:n.theme??i},m))})]})}),q=({data:e,itemShape:r,index:a,theme:i})=>(0,t.jsxs)("div",{className:(0,l.cn)("brand-equity-item",`brand-equity-item-${a+1}`,e.containerName?`brand-equity-item--${e.containerName}`:void 0,"bg-container-secondary-1 box-border flex w-full flex-col p-4","desktop:p-6 justify-between","laptop:col-span-3 lg-desktop:p-8","laptop:h-[192px] lg-desktop:h-[240px] h-[160px]",{"laptop:col-span-4":[0,5,6,11].includes(a),"bg-container-primary":i==="dark"},"rounded-box",e.className),children:[(0,t.jsxs)("div",{className:"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3",children:[(0,t.jsx)("h3",{className:"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary text-[14px] font-bold leading-[1.2] tracking-[-0.02em]",children:e.title}),e.type==="avatar"?(0,t.jsx)("div",{className:"flex shrink-0 -space-x-2",children:e?.avatarList?.map((o,u)=>(0,t.jsx)("div",{className:(0,l.cn)("border-container-primary size-[30px] overflow-hidden rounded-full border-2","relative inline-block shrink-0","lg-desktop:size-[36px]"),children:(0,t.jsx)(y.default,{source:o.avatar?.url,alt:o.avatar?.alt,className:"size-full object-cover"})},u))}):(0,t.jsx)("div",{className:"lg-desktop:size-[36px] size-[30px] shrink-0",children:(0,t.jsx)(y.default,{className:"size-full object-cover",source:e.icon?.url,alt:e.icon?.alt,imgClassName:"w-full h-full object-cover"})})]}),(0,t.jsx)("p",{className:"lg-desktop:text-[24px] text-info-primary line-clamp-3 text-[20px] font-bold leading-[1.2] tracking-[-0.04em]",children:e.description})]});w.displayName="BrandEquity";var C=(0,E.withLayout)(w);
|