@pisell/materials 1.0.1023 → 1.8.1

package/es/components/pisellUrl/types.d.ts

@@ -0,0 +1,160 @@
+import type { CSSProperties } from 'react';
+import type { BaseTextInputProps } from '@pisell/utils';
+/**
+ * PisellUrl 组件 Props 类型定义
+ *
+ * 继承 BaseTextInputProps，添加 URL 特有的配置
+ */
+export interface PisellUrlProps extends BaseTextInputProps {
+    /**
+     * 状态模式
+     * @default 'edit'
+     */
+    mode?: 'read' | 'edit';
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * 是否使用严格校验
+     * @default true
+     */
+    strictValidation?: boolean;
+    /**
+     * 允许的协议列表
+     * @example ['http', 'https']
+     * @default ['http', 'https']
+     */
+    allowedProtocols?: string[];
+    /**
+     * 是否要求必须有协议
+     * @default false
+     */
+    requireProtocol?: boolean;
+    /**
+     * 是否自动补全协议
+     * @default true
+     */
+    autoCompleteProtocol?: boolean;
+    /**
+     * 默认协议
+     * @default 'https://'
+     */
+    defaultProtocol?: 'http://' | 'https://';
+    /**
+     * 协议补全回调
+     * @param url 补全后的 URL
+     */
+    onProtocolComplete?: (url: string) => void;
+    /**
+     * 是否启用链接跳转（只读态）
+     * @default true
+     */
+    enableLinkClick?: boolean;
+    /**
+     * 是否新窗口打开
+     * @default true
+     */
+    openInNewWindow?: boolean;
+    /**
+     * 是否显示链接图标
+     * @default true
+     */
+    showLinkIcon?: boolean;
+    /**
+     * 链接点击回调
+     * @param url URL 地址
+     */
+    onLinkClick?: (url: string) => void;
+    /**
+     * 是否显示协议（只读态）
+     * @default false
+     */
+    showProtocol?: boolean;
+    /**
+     * 是否显示 www 前缀（只读态）
+     * @default false
+     */
+    showWww?: boolean;
+    /**
+     * 是否显示路径（只读态）
+     * @default true
+     */
+    showPathname?: boolean;
+    /**
+     * 显示格式（只读态）
+     * - full: 完整 URL
+     * - domain: 仅域名
+     * - custom: 自定义格式
+     * @default 'full'
+     */
+    displayFormat?: 'full' | 'domain' | 'custom';
+    /**
+     * 自定义格式化函数（只读态）
+     * @param url URL 地址
+     * @returns 格式化后的显示文本
+     */
+    customFormat?: (url: string) => string;
+    /**
+     * 字号
+     * @example '14px' 或 14
+     * @default 16
+     */
+    fontSize?: string | number;
+    /**
+     * 字重
+     * @example 'bold' 或 600
+     * @default 500
+     */
+    fontWeight?: string | number;
+    /**
+     * 文本颜色
+     * @example '#000000'
+     * @default '#101828'
+     */
+    color?: string;
+    /**
+     * 链接颜色（只读态）
+     * @example '#1890ff'
+     * @default '#7F56DA'
+     */
+    linkColor?: string;
+    /**
+     * 占位文本
+     * @default '请输入 URL 地址'
+     */
+    placeholder?: string;
+    /**
+     * 最大长度
+     * @default 2048
+     */
+    maxLength?: number;
+    /**
+     * 是否显示清空按钮
+     * @default false
+     */
+    allowClear?: boolean;
+    /**
+     * 是否自动聚焦
+     * @default false
+     */
+    autoFocus?: boolean;
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式
+     */
+    style?: CSSProperties;
+    /**
+     * ARIA 标签
+     */
+    'aria-label'?: string;
+    /**
+     * ARIA 描述
+     */
+    'aria-describedby'?: string;
+}
+export type { DisplayState, ValidationResult, TextInputState } from '@pisell/utils';

package/es/components/pisellUrl/utils/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * PisellUrl 工具函数导出
+ */
+export * from './urlValidator';
+export * from './urlHelper';
+export * from './urlFormatter';

package/es/components/pisellUrl/utils/urlFormatter.d.ts

@@ -0,0 +1,38 @@
+/**
+ * URL 格式化工具函数
+ */
+/**
+ * 格式化 URL 显示
+ * @param url URL 地址
+ * @param options 格式化选项
+ * @returns 格式化后的 URL
+ *
+ * @example
+ * formatUrlDisplay('https://www.example.com/path', { showProtocol: false })
+ * // 'www.example.com/path'
+ */
+export declare function formatUrlDisplay(url: string, options: {
+    showProtocol?: boolean;
+    showWww?: boolean;
+    showPathname?: boolean;
+    displayFormat?: 'full' | 'domain' | 'custom';
+    customFormat?: (url: string) => string;
+}): string;
+/**
+ * 隐藏 URL 协议
+ * @param url URL 地址
+ * @returns 隐藏协议后的 URL
+ *
+ * @example
+ * hideUrlProtocol('https://example.com') // 'example.com'
+ */
+export declare function hideUrlProtocol(url: string): string;
+/**
+ * 隐藏 www 前缀
+ * @param url URL 地址
+ * @returns 隐藏 www 后的 URL
+ *
+ * @example
+ * hideWwwPrefix('https://www.example.com') // 'https://example.com'
+ */
+export declare function hideWwwPrefix(url: string): string;

package/es/components/pisellUrl/utils/urlHelper.d.ts

@@ -0,0 +1,63 @@
+/**
+ * URL 辅助函数
+ */
+/**
+ * 规范化 URL（补全协议）
+ * @param url URL 地址
+ * @param defaultProtocol 默认协议
+ * @returns 规范化后的 URL
+ *
+ * @example
+ * normalizeUrl('example.com', 'https://') // 'https://example.com'
+ * normalizeUrl('http://example.com', 'https://') // 'http://example.com'
+ */
+export declare function normalizeUrl(url: string, defaultProtocol?: string): string;
+/**
+ * 智能补全协议（识别 localhost）
+ * @param url URL 地址
+ * @returns 规范化后的 URL
+ *
+ * @example
+ * smartNormalizeUrl('localhost:3000') // 'http://localhost:3000'
+ * smartNormalizeUrl('example.com') // 'https://example.com'
+ */
+export declare function smartNormalizeUrl(url: string): string;
+/**
+ * 提取域名
+ * @param url URL 地址
+ * @returns 域名
+ *
+ * @example
+ * extractDomain('https://www.example.com/path') // 'www.example.com'
+ */
+export declare function extractDomain(url: string): string;
+/**
+ * 处理链接跳转（安全性保障）
+ * @param url URL 地址
+ * @param openInNewWindow 是否新窗口打开
+ * @param defaultProtocol 默认协议
+ *
+ * @example
+ * handleUrlClick('example.com', true, 'https://')
+ */
+export declare function handleUrlClick(url: string, openInNewWindow?: boolean, defaultProtocol?: string): void;
+/**
+ * 检测是否为安全链接（HTTPS）
+ * @param url URL 地址
+ * @returns 是否为 HTTPS
+ *
+ * @example
+ * isSecureUrl('https://example.com') // true
+ * isSecureUrl('http://example.com') // false
+ */
+export declare function isSecureUrl(url: string): boolean;
+/**
+ * 提取 URL 参数
+ * @param url URL 地址
+ * @returns 参数对象
+ *
+ * @example
+ * extractUrlParams('https://example.com?foo=bar&baz=qux')
+ * // { foo: 'bar', baz: 'qux' }
+ */
+export declare function extractUrlParams(url: string): Record<string, string>;

package/es/components/pisellUrl/utils/urlValidator.d.ts

@@ -0,0 +1,46 @@
+/**
+ * URL 校验工具函数
+ */
+/**
+ * URL 格式校验（使用 URL 构造函数）
+ * @param url URL 地址
+ * @returns 是否通过校验
+ *
+ * @example
+ * validateUrl('https://example.com') // true
+ * validateUrl('invalid-url') // false
+ */
+export declare function validateUrl(url: string): boolean;
+/**
+ * URL 正则校验（备选方法）
+ * @param url URL 地址
+ * @returns 是否通过校验
+ */
+export declare function validateUrlByRegex(url: string): boolean;
+/**
+ * 解析 URL 各部分
+ * @param url URL 地址
+ * @returns URL 各部分或 null
+ *
+ * @example
+ * parseUrl('https://example.com:8080/path?key=value#hash')
+ * // { protocol: 'https', host: 'example.com', port: '8080', ... }
+ */
+export declare function parseUrl(url: string): {
+    protocol: string;
+    host: string;
+    port: string;
+    pathname: string;
+    search: string;
+    hash: string;
+} | null;
+/**
+ * 协议白名单校验
+ * @param url URL 地址
+ * @param allowedProtocols 允许的协议列表
+ * @returns 校验结果
+ */
+export declare function validateUrlProtocol(url: string, allowedProtocols: string[]): {
+    isValid: boolean;
+    errors: string[];
+};

package/es/components/pisellWalletPassCard/index.d.ts

@@ -0,0 +1,146 @@
+import React from 'react';
+import './index.less';
+export interface FormatOption {
+    /** 原始 DOM 元素 */
+    originDom: React.ReactNode;
+    /** 是否选中状态 */
+    active: boolean;
+    /** 完整的组件数据 */
+    data: PisellWalletPassCardProps;
+}
+export interface PisellWalletPassCardProps {
+    id: number;
+    /** 卡片样式 */
+    type: 'default' | 'mini';
+    /** 商品名称 */
+    name: string;
+    /** 二维码 */
+    qrCode: string;
+    /** 共享店铺名称 */
+    storeName: string;
+    /** 余额 */
+    balance?: number;
+    /** 识别码编号 */
+    code: string;
+    /** 有效期 */
+    validDate: string;
+    /** 使用金额 */
+    redeem?: number;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 禁用原因 */
+    disabledReason?: string;
+    /** 是否展示禁用原因 */
+    showDisabledReason?: boolean;
+    /** 封面图 */
+    cover?: string;
+    /** 余额标题文案 */
+    balanceTitle?: string;
+    /** 使用金额标题文案 */
+    redeemTitle?: string;
+    /** 是否选中 */
+    active?: boolean;
+    /** 是否展示商品名称 */
+    showName?: boolean;
+    /** 是否展示共享店铺名称 */
+    showStoreName?: boolean | ((data: any) => boolean);
+    /** 是否展示使用金额 */
+    showRedeem?: boolean;
+    /** 是否展示余额 */
+    showBalance?: boolean;
+    /** 是否展示识别码编号 */
+    showCode?: boolean;
+    /** 是否展示有效期 */
+    showValidDate?: boolean;
+    /** 使用日程信息计算有效期 */
+    validDateBySchedule?: boolean;
+    /** 日程列表 */
+    scheduleList?: any[];
+    /** 是否展示右上角详情按钮 */
+    showDetail?: boolean;
+    /** 是否展示qrCode */
+    showQrCode?: boolean;
+    /** 是否展示封面 */
+    showCover?: boolean;
+    /** 是否展示余额货币符号 */
+    showBalanceSymbol?: boolean;
+    /** 展示操作按钮 */
+    showActions?: boolean;
+    /** 操作按钮配置 */
+    actions?: {
+        /** 按钮展示方式 */
+        layout: 'expanded' | 'collapsed';
+        /** detail 按钮配置 */
+        detail?: {
+            visible: boolean;
+            iconColor: string;
+        };
+        /** edit按钮配置 */
+        edit?: {
+            visible: boolean;
+            iconColor: string;
+            dialogTitle: string;
+            enableDialog: boolean;
+            fields: {
+                name: string;
+                label: string;
+            };
+        };
+    };
+    /** 编辑编辑按钮后，弹窗展示之前 */
+    beforeEdit?: (value: any) => Promise<any> | boolean | void;
+    /** 编辑弹窗点击提交 */
+    onConfirmEdit?: (value: any) => void;
+    /** 编辑金额事件 */
+    onConfirmEditAmount?: (value: number) => void;
+    /** 详情按钮点击事件 */
+    onDetail?: (data: {
+        id: number;
+        name: string;
+        storeName: string;
+        balance?: number;
+        redeem?: number;
+        code: string;
+        validDate: string;
+        originData?: any;
+    }) => void;
+    /** 是否使用外部详情处理（当为 true 且提供了 onDetail 时，不显示内部模态框） */
+    useExternalDetail?: boolean;
+    /** 单选或者多选 */
+    mode?: 'multiple' | 'single';
+    /** 是否展示选中图标 */
+    showActiveIcon?: boolean;
+    /** 开启编辑金额 */
+    enableEditAmount?: boolean;
+    /** 显示状态标识 */
+    showStatus?: boolean;
+    /** 名称标题字号字重颜色配置 */
+    nameTitleStyle?: {
+        fontSize: number;
+        fontWeight: number;
+        color: string;
+    };
+    /** 卡片状态 */
+    cardStatus?: 'used' | 'expired' | 'disabled' | 'conflict' | 'lastPayment';
+    /** 自定义余额格式化函数，如果提供则优先使用 */
+    formatBalance?: (balance?: number, option?: FormatOption) => React.ReactNode;
+    /** 自定义余额标题格式化函数，如果提供则优先使用 */
+    formatBalanceTitle?: (balanceTitle?: string, option?: FormatOption) => React.ReactNode;
+    /** 自定义使用金额格式化函数，如果提供则优先使用 */
+    formatRedeem?: (redeem?: number, option?: FormatOption) => React.ReactNode;
+    /** 自定义使用金额标题格式化函数，如果提供则优先使用 */
+    formatRedeemTitle?: (redeemTitle?: string, option?: FormatOption) => React.ReactNode;
+    /** 最大使用金额 */
+    maxRedeem?: number;
+    /** 编辑金额前事件 */
+    onBeforeEditAmount?: (value: any) => Promise<any> | boolean | void;
+    /** 是否显示持有人 */
+    showHolderName?: boolean;
+    /** 持有人, 表单记录，展示时一般取main_field */
+    holder?: any;
+    /** 持有人点击回调 */
+    onSetHolder?: (currentValue?: any) => void;
+    [key: string]: any;
+}
+declare const PisellWalletPassCard: (props: PisellWalletPassCardProps) => React.JSX.Element;
+export default PisellWalletPassCard;

package/es/components/pisellWalletPassCard/index.js

@@ -21,8 +21,8 @@ import { Button, Dropdown, Form, Input, InputNumber, DatePicker, Radio } from 'a
 import dayjs from 'dayjs';
 import Iconfont from "../iconfont";
 import { PisellModal, usePisellConfig } from "../../index";
-import PisellTag from "../pisellTags";
 import { getScheduleSummary } from '@pisell/utils';
+import PisellTag from "../pisellTags";
 import Amount from "../pisellText/components/Amount";
 import AmountCpt from "../virtual-keyboard/Amount";
 
@@ -146,12 +146,12 @@ var PisellWalletPassCard = function PisellWalletPassCard(props) {
     formatRedeem = props.formatRedeem,
     formatRedeemTitle = props.formatRedeemTitle,
     maxRedeem = props.maxRedeem,
-    validDateBySchedule = props.validDateBySchedule,
-    scheduleList = props.scheduleList,
     _props$showHolderName = props.showHolderName,
     showHolderName = _props$showHolderName === void 0 ? true : _props$showHolderName,
     holder = props.holder,
-    onSetHolder = props.onSetHolder;
+    onSetHolder = props.onSetHolder,
+    validDateBySchedule = props.validDateBySchedule,
+    scheduleList = props.scheduleList;
   useEffect(function () {
     document.body.id = 'body';
   }, []);
@@ -487,9 +487,7 @@ var PisellWalletPassCard = function PisellWalletPassCard(props) {
       className: "pisell-card-amount-item-value",
       useThousandsSeparator: true,
       value: balance,
-      showCurrencySymbol: showBalanceSymbol,
-      precision: 2,
-      hideDecimalForWholeNumbers: false
+      showCurrencySymbol: showBalanceSymbol
     });
   };
 
@@ -510,9 +508,7 @@ var PisellWalletPassCard = function PisellWalletPassCard(props) {
       className: "pisell-card-amount-item-value",
       useThousandsSeparator: true,
       value: redeem,
-      showCurrencySymbol: true,
-      precision: 2,
-      hideDecimalForWholeNumbers: false
+      showCurrencySymbol: true
       // onClick={handleEditAmount}
     });
   };
@@ -548,11 +544,9 @@ var PisellWalletPassCard = function PisellWalletPassCard(props) {
     }, getText('pisell-discount-card-title'), ': '), /*#__PURE__*/React.createElement("div", {
       className: "pisell-card-amount-item-value"
     }, ((_props$metadata = props.metadata) === null || _props$metadata === void 0 ? void 0 : _props$metadata.discount_card_type) === 'fixed_amount' ? /*#__PURE__*/React.createElement(React.Fragment, null, getText('pisell-discount-card-fixed-amount-prefix'), ' ', /*#__PURE__*/React.createElement(Amount, {
-      className: "pisell-card-amount-item-value test1",
+      className: "pisell-card-amount-item-value",
       useThousandsSeparator: true,
-      value: discount,
-      precision: 2,
-      hideDecimalForWholeNumbers: false
+      value: discount
     })) : /*#__PURE__*/React.createElement(React.Fragment, null, discount, "% ", getText('pisell-discount-card-unit'))))), /*#__PURE__*/React.createElement("div", {
       className: "pisell-card-code-wrap",
       style: {

package/es/components/productCard/cartSkuCard/components/AmountFooter/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.less';
+declare const Footer: ({ item, hideDivider, type, isOnlyTotal }: any) => React.JSX.Element;
+export default Footer;

package/es/components/productCard/cartSkuCard/components/Gift/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { IGiftProps } from './types';
+import './index.less';
+declare const Gift: (props: IGiftProps) => React.JSX.Element | null;
+export default Gift;

package/es/components/productCard/cartSkuCard/components/Gift/index.js

@@ -0,0 +1,60 @@
+import React, { useMemo, useCallback } from 'react';
+import Icon from "../../../../icon";
+import { locales, imageAli } from '@pisell/utils';
+import "./index.less";
+var prefixCls = 'pisell-cart-sku-card__gift';
+var Gift = function Gift(props) {
+  var _displayGifts$;
+  var _props$isShow = props.isShow,
+    isShow = _props$isShow === void 0 ? false : _props$isShow,
+    _props$totalCount = props.totalCount,
+    totalCount = _props$totalCount === void 0 ? 0 : _props$totalCount,
+    _props$selectedGifts = props.selectedGifts,
+    selectedGifts = _props$selectedGifts === void 0 ? [] : _props$selectedGifts,
+    _props$promptText = props.promptText,
+    promptText = _props$promptText === void 0 ? '' : _props$promptText,
+    onClick = props.onClick;
+  var selectedCount = (selectedGifts === null || selectedGifts === void 0 ? void 0 : selectedGifts.length) || 0;
+  var displayGifts = useMemo(function () {
+    return (selectedGifts === null || selectedGifts === void 0 ? void 0 : selectedGifts.slice(0, 5)) || [];
+  }, [selectedGifts]);
+  var renderImage = useCallback(function (item) {
+    if (item !== null && item !== void 0 && item.image) {
+      return /*#__PURE__*/React.createElement("img", {
+        src: imageAli.ali(item === null || item === void 0 ? void 0 : item.image, 48),
+        className: "product-cover"
+      });
+    }
+    var displayText = item !== null && item !== void 0 && item.title ? item === null || item === void 0 ? void 0 : item.title.slice(0, 2) : '';
+    return /*#__PURE__*/React.createElement("div", {
+      className: "product-cover-text"
+    }, displayText);
+  }, [displayGifts]);
+  if (!isShow) return null;
+  console.log('Gift777', props, selectedCount);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls),
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "__label")
+  }, locales.getText('pisell2.cart.sku-card.gift.title')), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "__content")
+  }, !selectedCount ? /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "__text")
+  }, promptText || locales.getText('pisell2.cart.sku-card.gift.select.title')) : /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "__images ").concat(selectedCount === 1 ? "".concat(prefixCls, "__images-single") : '')
+  }, displayGifts.map(function (gift, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: (gift === null || gift === void 0 ? void 0 : gift.id) || index,
+      className: "".concat(prefixCls, "__image")
+    }, renderImage(gift));
+  }), selectedCount === 1 && /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "__title")
+  }, (_displayGifts$ = displayGifts[0]) === null || _displayGifts$ === void 0 ? void 0 : _displayGifts$.title)), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "__total")
+  }, locales.getText('pisell2.cart.sku-card.gift.total')(totalCount)), /*#__PURE__*/React.createElement(Icon, {
+    type: "pisell2-chevron-right",
+    className: "".concat(prefixCls, "__arrow")
+  })));
+};
+export default Gift;

package/es/components/productCard/cartSkuCard/components/Gift/index.less

@@ -0,0 +1,84 @@
+@prefix: pisell-cart-sku-card__gift;
+
+.@{prefix} {
+  padding: 8px;
+  background: #F2F4F7;
+  border-radius: 8px;
+  align-items: center;
+  gap: 16px;
+  display: flex;
+  justify-content: space-between;
+  margin-top: 4px;
+  color: #475467;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 20px;
+  min-width: 0; // 确保内容可以正确缩小
+  justify-content: space-between;
+  cursor: pointer;
+
+  // 标签
+  &__label {
+    flex-shrink: 0;
+  }
+
+  &__content {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex: 1;
+    justify-content: flex-end;
+  }
+
+  &__text {
+    color: #7F56D9;
+    font-weight: 600;
+  }
+
+  &__title {
+    color: #101828;
+  }
+
+  &__images {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+
+  &__images-single {
+    gap: 2px;
+  }
+
+  &__arrow {
+    color: #667085;
+    font-size: 20px;
+  }
+
+  &__total {
+    white-space: nowrap;
+  }
+
+  .product-cover {
+    width: 24px;
+    height: 24px;
+    border-radius: 4px;
+    flex-shrink: 0;
+  }
+
+  .product-cover-text {
+    width: 24px;
+    height: 24px;
+    flex-shrink: 0;
+    border-radius: 4px;
+    background-color: #DEDEDE;
+    color: #7E7E7E;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 12px;
+    line-height: 1;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}

package/es/components/productCard/cartSkuCard/components/Gift/types.js

@@ -0,0 +1 @@
+export {};

package/es/components/productCard/cartSkuCard/components/MultiDay/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.less';
+declare const MultiDay: ({ dataSource, hideDivider }: any) => React.JSX.Element;
+export default MultiDay;