@anker-in/headless-ui 1.3.70 → 1.3.72
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/HeaderNavigation/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/helpers/utils.js +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/HeaderNavigation/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/helpers/utils.js +1 -1
- package/package.json +1 -1
- package/style.css +129 -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);
|