@pisell/materials 3.3.81 → 3.3.83

package/lib/components/page/index.js

@@ -44,6 +44,7 @@ var import_zh_TW = __toESM(require("antd/es/locale/zh_TW"));
 var import_zh_HK = __toESM(require("antd/es/locale/zh_HK"));
 var import_pisell_config_provider = __toESM(require("../pisell-config-provider"));
 var import_useEngineContext = __toESM(require("../../hooks/useEngineContext"));
+var import_tokens = require("../../theme/tokens");
 var localMap = {
   "zh-TW": import_zh_TW.default,
   "zh-CN": import_zh_CN.default,
@@ -79,7 +80,6 @@ var Page = (props) => {
     if (props == null ? void 0 : props.theme) {
       return {
         ...props.theme,
-        // cssVar: { key: 'app' },
         token: {
           ...props.theme.token,
           // 外部透传主题时，如果没有传入colorPrimary 默认使用主项目内主题色
@@ -87,126 +87,8 @@ var Page = (props) => {
         }
       };
     }
-    return {
-      // cssVar: { key: 'app' },
-      components: {
-        Table: {
-          colorFillContent: "#EAECF0",
-          colorFillSecondary: "#F2F4F7",
-          colorBorderSecondary: "#EAECF0",
-          colorFillAlter: "#F9FAFB",
-          controlItemBgHover: "#F9FAFB",
-          colorTextHeading: "#475467",
-          colorTextDescription: "#667085",
-          colorText: "#101828",
-          controlHeight: 32,
-          padding: 24,
-          margin: 16
-        },
-        Message: {
-          contentBg: "#101828"
-        },
-        Button: {
-          borderRadiusSM: 6,
-          borderRadiusLG: 9,
-          borderRadius: 8,
-          controlHeight: 36,
-          colorBgContainerDisabled: "#F2F4F7",
-          colorBgTextHover: "#F9FAFB",
-          colorBorder: "#D0D5DD",
-          colorError: "#D92D20",
-          colorErrorActive: "#D92D20",
-          colorErrorHover: "#B42318",
-          colorErrorBg: "#FEF3F2",
-          colorErrorBorderHover: "#FDA29B",
-          colorErrorOutline: "rgba(217, 45, 32, 0.06)",
-          colorLink: "#7F56DA",
-          colorLinkActive: "#5F3DA8",
-          colorLinkHover: "#6D48C4",
-          // colorPrimaryActive: '#5D3F9F',
-          // colorPrimaryBorder: '#E9D7FE',
-          colorText: "#344054",
-          colorTextDisabled: "#D0D5DD",
-          colorTextLightSolid: "#fff",
-          colorBgTextActive: "#D0D5DD",
-          controlOutline: "rgba(127, 86, 217, 0.04)",
-          controlTmpOutline: "#F9FAFB",
-          paddingContentHorizontal: 14,
-          marginXS: 8
-        },
-        Divider: {
-          colorSplit: "#EAECF0"
-        },
-        Breadcrumb: {
-          itemColor: "#475467",
-          colorTextDescription: "#475467",
-          // lastItemColor: '#6941C6',
-          separatorMargin: 12,
-          separatorColor: "#D0D5DD",
-          linkHoverColor: "#1D2939",
-          linkColor: "#475467",
-          colorBgTextHover: "#F9FAFB",
-          paddingXXS: 8
-        },
-        Dropdown: {
-          borderRadiusLG: 8,
-          // "boxShadowPopoverArrow": "2px 2px 5px rgba(0, 0, 0, 0.05)",
-          controlHeight: 42,
-          fontSize: 14
-        },
-        DatePicker: {
-          borderRadius: 8,
-          colorTextPlaceholder: "#667085",
-          colorIcon: "#667085",
-          colorTextQuaternary: "#D0D5DD",
-          colorBgContainerDisabled: "#F9FAFB",
-          colorTextDisabled: "#98A2B3"
-        },
-        Input: {
-          fontSizeIcon: 16,
-          addonBg: "#fff"
-          // "lineHeight": 1
-        },
-        Select: {
-          fontSizeIcon: 16
-          // "lineHeight": 1
-        },
-        Menu: {
-          subMenuItemSelectedColor: "#9976e3"
-        }
-      },
-      token: {
-        colorPrimary: themeColor || "#5D3F9F",
-        colorPrimaryBg: "#eee5ff",
-        colorPrimaryBgHover: "#e4d9fc",
-        colorPrimaryBorder: "#d4c3f7",
-        colorSuccess: "#5f9e3f",
-        colorInfo: "#5d3f9f",
-        colorError: "#f5222d",
-        colorSuccessBg: "#e5fcd9",
-        colorSuccessBgHover: "#d5f7c3",
-        // 链接色
-        colorLink: "#7F56DA",
-        colorLinkActive: "#5F3DA8",
-        colorLinkHover: "#6D48C4",
-        colorText: "#101828",
-        colorTextSecondary: "#475467",
-        colorTextTertiary: "#667085",
-        colorTextQuaternary: "#D0D5DD",
-        colorBorder: "#D0D5DD",
-        colorBorderSecondary: "#EAECF0",
-        colorFill: "#D0D5DD",
-        colorFillSecondary: "#EAECF0",
-        colorFillTertiary: "#F2F4F7",
-        colorFillQuaternary: "#F9FAFB",
-        colorBgLayout: "#F2F4F7",
-        colorBgSpotlight: "#101828",
-        colorBgMask: "rgba(0, 0, 0, 0.5)",
-        wireframe: false,
-        borderRadius: 8
-      }
-    };
-  }, [platform, themeColor, props == null ? void 0 : props.theme]);
+    return (0, import_tokens.getThemeConfig)(themeColor);
+  }, [themeColor, props == null ? void 0 : props.theme]);
   const datePickerTheme = (0, import_react.useMemo)(() => {
     var _a2;
     return (0, import_date_picker.createTheme)({
@@ -215,6 +97,9 @@ var Page = (props) => {
       }
     });
   }, [platform, themeColor]);
+  (0, import_react.useEffect)(() => {
+    document.body.id = "body";
+  }, []);
   return /* @__PURE__ */ import_react.default.createElement(
     import_config_provider.default,
     {

package/lib/components/pisellAdjustPrice/PisellAdjustPriceInputNumber.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { InputNumberProps } from 'antd/es/input-number';
 export interface PisellAdjustPriceInputNumberProps extends Omit<InputNumberProps, 'onChange'> {
     value?: number;
@@ -6,5 +6,5 @@ export interface PisellAdjustPriceInputNumberProps extends Omit<InputNumberProps
     defaultValue?: number;
     onChange?: (val: number) => void;
 }
-declare const PisellAdjustPriceInputNumber: (props: PisellAdjustPriceInputNumberProps) => JSX.Element;
+declare const PisellAdjustPriceInputNumber: (props: PisellAdjustPriceInputNumberProps) => React.JSX.Element;
 export default PisellAdjustPriceInputNumber;

package/lib/components/pisellAdjustPrice/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import './index.less';
 export interface PisellAdjustPriceProps {
     value?: number;
@@ -5,5 +6,5 @@ export interface PisellAdjustPriceProps {
     defaultValue?: number;
     onChange?: (val: number) => void;
 }
-declare const PisellAdjustPrice: (props: PisellAdjustPriceProps) => JSX.Element;
+declare const PisellAdjustPrice: (props: PisellAdjustPriceProps) => React.JSX.Element;
 export default PisellAdjustPrice;

package/lib/components/pisellBatchActionBar/PisellBatchActionBar.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import type { PisellBatchActionBarProps } from './types';
+import './PisellBatchActionBar.less';
+/**
+ * PisellBatchActionBar 批量操作栏组件
+ *
+ * @description 选择感知型的批量操作组件，用于承载基于选中对象的批量行为操作
+ * @author Pisell Team
+ * @version 1.0.0
+ *
+ * @example
+ * ```tsx
+ * <PisellBatchActionBar
+ *   selectedKeys={selectedKeys}
+ *   selectedRows={selectedRows}
+ *   total={total}
+ *   defaultActions={{
+ *     selectAll: true,
+ *     clear: true,
+ *   }}
+ *   onSelectAll={() => {
+ *     // 全选逻辑
+ *   }}
+ *   onClear={() => {
+ *     // 清空选择逻辑
+ *   }}
+ * />
+ * ```
+ */
+declare const PisellBatchActionBar: React.FC<PisellBatchActionBarProps>;
+export default PisellBatchActionBar;

package/lib/components/pisellBatchActionBar/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * PisellBatchActionBar 组件导出
+ * @description 批量操作栏组件，用于承载基于选中对象的批量行为操作
+ */
+export { default } from './PisellBatchActionBar';
+export type { PisellBatchActionBarProps, BatchActionItem, DefaultActionsConfig, BatchActionConfirmConfig, BatchActionBarPosition, } from './types';

package/lib/components/pisellCheckboxGroup/index.d.ts

@@ -33,5 +33,5 @@ export interface PisellCheckboxGroupProps extends React.HTMLAttributes<HTMLDivEl
  * @Author: zhiwei.Wang
  * @Date: 2024-08-16 10:34
  */
-declare const PisellCheckboxGroup: (props: PisellCheckboxGroupProps) => JSX.Element;
+declare const PisellCheckboxGroup: (props: PisellCheckboxGroupProps) => React.JSX.Element;
 export default PisellCheckboxGroup;

package/lib/components/pisellCountdown/index.d.ts

@@ -20,5 +20,5 @@ export declare type PisellCountdownProps = React.HTMLAttributes<HTMLSpanElement>
     /** 格式化倒计时展示 参考 dayjs */
     format?: string;
 };
-declare const PisellCountdown: (props: PisellCountdownProps) => JSX.Element;
+declare const PisellCountdown: (props: PisellCountdownProps) => React.JSX.Element;
 export default PisellCountdown;

package/lib/components/pisellCurrency/PisellCurrency.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import type { PisellCurrencyProps } from './types';
+import './PisellCurrency.less';
+/**
+ * PisellCurrency 货币组件
+ *
+ * 基于 PisellNumber 派生，专门处理货币数据。
+ * 默认启用千分位和2位小数，符合财务规范。
+ *
+ * @param props 组件 Props
+ *
+ * @example
+ * // 受控模式
+ * const [price, setPrice] = useState(0);
+ * <PisellCurrency
+ *   value={price}
+ *   onChange={setPrice}
+ *   currencySymbol="¥"
+ * />
+ *
+ * @example
+ * // 非受控模式
+ * <PisellCurrency
+ *   defaultValue={100}
+ *   currencySymbol="$"
+ * />
+ *
+ * @example
+ * // 只读态
+ * <PisellCurrency
+ *   mode="read"
+ *   value={1234.56}
+ *   currencySymbol="¥"
+ * />
+ * // 显示: ¥1,234.56
+ */
+export declare const PisellCurrency: React.FC<PisellCurrencyProps>;
+declare const MemoizedPisellCurrency: React.NamedExoticComponent<PisellCurrencyProps>;
+export default MemoizedPisellCurrency;

package/lib/components/pisellCurrency/PisellCurrency.js

@@ -0,0 +1,63 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellCurrency/PisellCurrency.tsx
+var PisellCurrency_exports = {};
+__export(PisellCurrency_exports, {
+  PisellCurrency: () => PisellCurrency,
+  default: () => PisellCurrency_default
+});
+module.exports = __toCommonJS(PisellCurrency_exports);
+var import_react = __toESM(require("react"));
+var import_utils = require("@pisell/utils");
+var import_ReadOnlyView = __toESM(require("./components/ReadOnlyView"));
+var import_EditView = __toESM(require("./components/EditView"));
+var import_DisabledView = __toESM(require("./components/DisabledView"));
+var import_PisellCurrency = require("./PisellCurrency.less");
+var PisellCurrency = (props) => {
+  const { mode = "edit", disabled = false } = props;
+  const displayState = (0, import_utils.getDisplayState)(mode, disabled);
+  switch (displayState) {
+    case "read":
+      return /* @__PURE__ */ import_react.default.createElement(import_ReadOnlyView.default, { ...props });
+    case "edit":
+      return /* @__PURE__ */ import_react.default.createElement(import_EditView.default, { ...props });
+    case "disabled":
+      return /* @__PURE__ */ import_react.default.createElement(import_DisabledView.default, { ...props });
+    default:
+      return null;
+  }
+};
+var MemoizedPisellCurrency = import_react.default.memo(PisellCurrency, (prevProps, nextProps) => {
+  return prevProps.value === nextProps.value && prevProps.mode === nextProps.mode && prevProps.disabled === nextProps.disabled && prevProps.currencySymbol === nextProps.currencySymbol && prevProps.symbolPosition === nextProps.symbolPosition;
+});
+var PisellCurrency_default = MemoizedPisellCurrency;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PisellCurrency
+});

package/lib/components/pisellCurrency/PisellCurrency.less

@@ -0,0 +1,43 @@
+// PisellCurrency 组件样式
+
+.pisell-currency {
+  // 基础样式
+  display: inline-block;
+
+  // 只读态样式
+  &-read {
+    color: rgba(0, 0, 0, 0.85);
+    line-height: 1.5715;
+    
+    // 货币数值可以加粗显示（可选）
+    font-weight: 500;
+  }
+
+  // 编辑态样式
+  &-edit {
+    position: relative;
+
+    // 错误提示
+    .pisell-currency-error {
+      margin-top: 4px;
+      color: #ff4d4f;
+      font-size: 14px;
+      line-height: 1.5;
+    }
+  }
+
+  // 禁用态样式
+  &-disabled {
+    // 继承 Ant Design InputNumber 的禁用样式
+  }
+  
+  // 负数显示为红色（可选）
+  &.negative {
+    color: #ff4d4f;
+  }
+  
+  // 正数显示为绿色（可选，用于收益场景）
+  &.positive {
+    color: #52c41a;
+  }
+}

package/lib/components/pisellCurrency/PisellCurrency.stories.d.ts

@@ -0,0 +1,56 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PisellCurrency } from './PisellCurrency';
+/**
+ * PisellCurrency 组件 Storybook
+ */
+declare const meta: Meta<typeof PisellCurrency>;
+export default meta;
+declare type Story = StoryObj<typeof PisellCurrency>;
+/**
+ * 基础示例 - 人民币
+ */
+export declare const Basic: Story;
+/**
+ * 不同货币
+ */
+export declare const DifferentCurrencies: Story;
+/**
+ * 只读态展示
+ */
+export declare const ReadOnly: Story;
+/**
+ * 禁用态
+ */
+export declare const Disabled: Story;
+/**
+ * 不显示货币符号
+ */
+export declare const WithoutSymbol: Story;
+/**
+ * 禁止负数（商品价格）
+ */
+export declare const NoNegative: Story;
+/**
+ * 允许负数（退款金额）
+ */
+export declare const AllowNegative: Story;
+/**
+ * 表单场景
+ */
+export declare const InForm: Story;
+/**
+ * 表格场景
+ */
+export declare const InTable: Story;
+/**
+ * 不同精度
+ */
+export declare const DifferentPrecision: Story;
+/**
+ * 只读态样式
+ */
+export declare const ReadOnlyStyles: Story;
+/**
+ * 空值处理
+ */
+export declare const EmptyValue: Story;