@pisell/private-materials 6.8.86 → 6.8.87

package/lib/pro/keyboards/numberKeyboard/index.js

@@ -0,0 +1,400 @@
+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/pro/keyboards/numberKeyboard/index.tsx
+var numberKeyboard_exports = {};
+__export(numberKeyboard_exports, {
+  NumberKeyboardBase: () => NumberKeyboardBase,
+  default: () => numberKeyboard_default
+});
+module.exports = __toCommonJS(numberKeyboard_exports);
+var import_react = __toESM(require("react"));
+var import_classnames = __toESM(require("classnames"));
+var import_antd = require("antd");
+var import_ahooks = require("ahooks");
+var import_materials = require("@pisell/materials");
+var import_utils = require("@pisell/utils");
+var import_virtualInput = __toESM(require("../../../../../materials/src/components/virtualInput"));
+var import_useEngineContext = __toESM(require("../../../hooks/useEngineContext"));
+var import_locales = __toESM(require("../locales"));
+var import_index = require("./index.less");
+var generateSimpleUUID = () => {
+  return Math.random().toString(36).substring(2) + Date.now().toString(36);
+};
+var NumberKeyboardBase = (props) => {
+  var _a, _b;
+  const {
+    mode = "integer",
+    originalValue = "",
+    placeholder = "",
+    max,
+    min,
+    maxLength,
+    precision = 2,
+    disabled = false,
+    doneText,
+    resetText,
+    clearText,
+    label,
+    errorText,
+    style,
+    className,
+    keydown = true,
+    inputStyle,
+    inputWrapperStyle,
+    onEnter,
+    onReset
+  } = props;
+  const context = (0, import_useEngineContext.default)();
+  import_utils.locales.init(import_locales.default, ((_b = (_a = context == null ? void 0 : context.engine) == null ? void 0 : _a.props) == null ? void 0 : _b.locale) || "en");
+  const [internalValue, setInternalValue] = (0, import_ahooks.useControllableValue)(
+    props,
+    {
+      defaultValue: ""
+    }
+  );
+  const uniqueKeyboardId = (0, import_react.useMemo)(() => {
+    return `number-keyboard-${generateSimpleUUID()}`;
+  }, []);
+  const [isSelected, setIsSelected] = (0, import_react.useState)(!!internalValue);
+  (0, import_react.useEffect)(() => {
+    if (internalValue) {
+      setIsSelected(true);
+    }
+  }, []);
+  const isOutOfRange = (0, import_react.useMemo)(() => {
+    if (!internalValue) return false;
+    const numValue = parseFloat(internalValue);
+    if (isNaN(numValue)) return false;
+    if (max !== void 0 && numValue > max) return true;
+    if (min !== void 0 && numValue < min) return true;
+    return false;
+  }, [internalValue, max, min]);
+  const errorMessage = (0, import_react.useMemo)(() => {
+    if (!isOutOfRange) return "";
+    if (errorText) return errorText;
+    const numValue = parseFloat(internalValue);
+    if (max !== void 0 && numValue > max) {
+      return import_utils.locales.getText("pisell2.keyboard.number-keybard.max")(max);
+    }
+    if (min !== void 0 && numValue < min) {
+      return import_utils.locales.getText("pisell2.keyboard.number-keybard.min")(min);
+    }
+    return "";
+  }, [isOutOfRange, errorText, internalValue, max, min]);
+  const handleValueChange = (0, import_react.useCallback)(
+    (newValue) => {
+      if (isSelected && newValue !== "") {
+        setIsSelected(false);
+      }
+      setInternalValue(newValue);
+    },
+    [isSelected, setInternalValue]
+  );
+  const handleDelete = (0, import_react.useCallback)(() => {
+    if (isSelected) {
+      handleValueChange("");
+      setIsSelected(false);
+    } else if (internalValue.length > 0) {
+      handleValueChange(internalValue.slice(0, -1));
+    }
+  }, [internalValue, isSelected, handleValueChange]);
+  const handleClear = (0, import_react.useCallback)(() => {
+    handleValueChange("");
+    setIsSelected(false);
+  }, [handleValueChange]);
+  const handleReset = (0, import_react.useCallback)(() => {
+    setInternalValue(String(originalValue));
+    setIsSelected(true);
+    onReset == null ? void 0 : onReset();
+  }, [originalValue, setInternalValue, onReset]);
+  const handleDone = (0, import_react.useCallback)(() => {
+    if (isOutOfRange) return;
+    onEnter == null ? void 0 : onEnter(internalValue);
+  }, [internalValue, isOutOfRange, onEnter]);
+  const handleNumberInput = (0, import_react.useCallback)(
+    (num) => {
+      let newValue;
+      if (isSelected) {
+        newValue = num;
+        setIsSelected(false);
+      } else {
+        newValue = internalValue + num;
+      }
+      if (maxLength && newValue.replace(".", "").length > maxLength) {
+        return;
+      }
+      if (mode === "integer" && newValue.includes(".")) {
+        return;
+      }
+      if (mode === "decimal" && newValue.includes(".")) {
+        const parts = newValue.split(".");
+        if (parts[1] && parts[1].length > precision) {
+          return;
+        }
+      }
+      if (num === "." && internalValue.includes(".")) {
+        return;
+      }
+      if (newValue.length > 1 && newValue.startsWith("0") && !newValue.startsWith("0.")) {
+        newValue = newValue.replace(/^0+/, "") || "0";
+      }
+      if (num === "00") {
+        if (internalValue === "" || internalValue === "0") {
+          newValue = "0";
+        }
+      }
+      handleValueChange(newValue);
+    },
+    [internalValue, isSelected, maxLength, mode, precision, handleValueChange]
+  );
+  const handleKeyboardChange = (0, import_react.useCallback)(
+    (key) => {
+      if (key === void 0) return;
+      const keyStr = String(key);
+      switch (keyStr) {
+        case "delete":
+        case "backspace":
+          handleDelete();
+          break;
+        case "clear":
+          handleClear();
+          break;
+        case "reset":
+          handleReset();
+          break;
+        case "done":
+        case "ok":
+          handleDone();
+          break;
+        default:
+          if (/^[0-9.]$/.test(keyStr) || keyStr === "00") {
+            handleNumberInput(keyStr);
+          }
+          break;
+      }
+    },
+    [handleDelete, handleClear, handleReset, handleDone, handleNumberInput]
+  );
+  const integerKeyboardItems = (0, import_react.useMemo)(() => {
+    return [
+      { value: 1, label: "1", disabled: false, type: "text" },
+      { value: 2, label: "2", disabled: false, type: "text" },
+      { value: 3, label: "3", disabled: false, type: "text" },
+      { value: 4, label: "4", disabled: false, type: "text" },
+      { value: 5, label: "5", disabled: false, type: "text" },
+      { value: 6, label: "6", disabled: false, type: "text" },
+      { value: 7, label: "7", disabled: false, type: "text" },
+      { value: 8, label: "8", disabled: false, type: "text" },
+      { value: 9, label: "9", disabled: false, type: "text" },
+      {
+        value: "reset",
+        label: resetText || import_utils.locales.getText("pisell2.keyboard.number-keybard.reset"),
+        disabled: false,
+        type: "text",
+        style: { color: "#F04438", fontSize: 18 }
+      },
+      { value: 0, label: "0", disabled: false, type: "text" },
+      {
+        value: "done",
+        label: doneText || import_utils.locales.getText("pisell2.keyboard.number-keybard.ok"),
+        disabled: isOutOfRange,
+        type: "primary",
+        style: { fontSize: 18 }
+      }
+    ];
+  }, [resetText, doneText, isOutOfRange]);
+  const decimalKeyboardItems = (0, import_react.useMemo)(() => {
+    return [
+      { value: 1, label: "1", disabled: false, type: "text" },
+      { value: 2, label: "2", disabled: false, type: "text" },
+      { value: 3, label: "3", disabled: false, type: "text" },
+      { value: 4, label: "4", disabled: false, type: "text" },
+      { value: 5, label: "5", disabled: false, type: "text" },
+      { value: 6, label: "6", disabled: false, type: "text" },
+      { value: 7, label: "7", disabled: false, type: "text" },
+      { value: 8, label: "8", disabled: false, type: "text" },
+      { value: 9, label: "9", disabled: false, type: "text" },
+      { value: 0, label: "0", disabled: false, type: "text" },
+      { value: "00", label: "00", disabled: false, type: "text" },
+      { value: ".", label: ".", disabled: false, type: "text" }
+    ];
+  }, []);
+  const decimalRightItems = (0, import_react.useMemo)(() => {
+    return [
+      {
+        value: "clear",
+        label: clearText || import_utils.locales.getText("pisell2.keyboard.number-keybard.clear"),
+        disabled: false,
+        type: "text",
+        size: 1,
+        style: { fontSize: 18 }
+      },
+      {
+        value: "reset",
+        label: resetText || import_utils.locales.getText("pisell2.keyboard.number-keybard.reset"),
+        disabled: false,
+        type: "text",
+        size: 1,
+        style: { color: "#F04438", fontSize: 18 }
+      },
+      {
+        value: "done",
+        label: doneText || import_utils.locales.getText("pisell2.keyboard.number-keybard.ok"),
+        disabled: isOutOfRange,
+        type: "primary",
+        size: 2,
+        style: { fontSize: 18 }
+      }
+    ];
+  }, [clearText, resetText, doneText, isOutOfRange]);
+  const displayValue = (0, import_react.useMemo)(() => {
+    return internalValue || "";
+  }, [internalValue]);
+  const renderBottomContent = (0, import_react.useCallback)(() => {
+    if (isOutOfRange && errorMessage) {
+      return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-number-keyboard-error-message" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-alert-circle", size: 16 }), errorMessage);
+    }
+    return null;
+  }, [errorMessage]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)(
+        "pisell-number-keyboard",
+        `pisell-number-keyboard--${mode}`,
+        {
+          "pisell-number-keyboard--disabled": disabled
+        },
+        className
+      ),
+      style
+    },
+    label && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-number-keyboard-label" }, label),
+    /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("pisell-number-keyboard-input-wrapper") }, /* @__PURE__ */ import_react.default.createElement(
+      import_virtualInput.default,
+      {
+        focused: !disabled,
+        selected: isSelected && !!internalValue,
+        value: displayValue,
+        placeholder,
+        wrapperStyle: {
+          flex: 1,
+          padding: "19px 16px",
+          borderRadius: "8px",
+          backgroundColor: "white",
+          boxShadow: "0px 1px 2px rgba(16, 24, 40, 0.06)",
+          overflow: "hidden",
+          ...inputWrapperStyle
+        },
+        style: {
+          fontSize: "48px",
+          fontWeight: "bold",
+          border: "none",
+          background: "transparent",
+          width: "100%",
+          color: isOutOfRange ? "#D92D20" : void 0,
+          ...inputStyle
+        },
+        preventBlurElements: [`#${uniqueKeyboardId}`],
+        allowClear: true,
+        onClear: handleDelete,
+        textAlign: "center"
+      }
+    ), renderBottomContent()),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_materials.Keyboard,
+      {
+        id: uniqueKeyboardId,
+        className: (0, import_classnames.default)("pisell-number-keyboard-keys", {
+          "pisell-number-keyboard-keys--integer": mode === "integer",
+          "pisell-number-keyboard-keys--decimal": mode === "decimal"
+        }),
+        items: mode === "integer" ? integerKeyboardItems : decimalKeyboardItems,
+        rightItems: mode === "decimal" ? decimalRightItems : void 0,
+        keydown,
+        onChange: handleKeyboardChange
+      }
+    )
+  );
+};
+var NumberKeyboard = (props) => {
+  const { containerProps, children, ...keyboardProps } = props;
+  if (!containerProps) {
+    return /* @__PURE__ */ import_react.default.createElement(NumberKeyboardBase, { ...keyboardProps });
+  }
+  const { renderType, open, className, ...restProps } = containerProps || {};
+  if (renderType === "popover") {
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Popover,
+      {
+        key: `${open}`,
+        open,
+        trigger: ["click"],
+        overlayClassName: (0, import_classnames.default)(
+          "pisell-number-keyboard-popover",
+          className
+        ),
+        destroyTooltipOnHide: true,
+        overlayInnerStyle: {
+          padding: 0
+        },
+        arrow: false,
+        ...restProps,
+        content: /* @__PURE__ */ import_react.default.createElement(NumberKeyboardBase, { ...keyboardProps })
+      },
+      children
+    );
+  }
+  if (renderType === "modal") {
+    return open ? /* @__PURE__ */ import_react.default.createElement(
+      import_materials.PisellModal,
+      {
+        platform: "pc",
+        open: true,
+        width: "unset",
+        header: null,
+        footer: false,
+        mask: false,
+        maskClosable: true,
+        bodyStyle: { padding: "0px", backgroundColor: "transparent" },
+        closeIcon: null,
+        className: (0, import_classnames.default)("pisell-number-keyboard-modal", className),
+        destroyOnHidden: true,
+        ...restProps
+      },
+      /* @__PURE__ */ import_react.default.createElement(NumberKeyboardBase, { ...keyboardProps })
+    ) : null;
+  }
+  return /* @__PURE__ */ import_react.default.createElement(NumberKeyboardBase, { ...keyboardProps });
+};
+var numberKeyboard_default = NumberKeyboard;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  NumberKeyboardBase
+});

package/lib/pro/keyboards/numberKeyboard/index.less

@@ -0,0 +1,59 @@
+.pisell-number-keyboard-modal {
+  .ant-moda-content,
+  .pisell-lowcode-modal-content {
+    background-color: transparent;
+  }
+}
+
+.pisell-number-keyboard-popover {
+  .ant-popover-inner,
+  .pisell-lowcode-popover-inner {
+    background-color: transparent;
+  }
+}
+
+.pisell-number-keyboard {
+  padding: 10px;
+  border-radius: 10px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  background-color: rgba(0, 0, 0, 0.7);
+  width: 344px;
+
+  &--disabled {
+    pointer-events: none;
+    opacity: 0.6;
+  }
+
+  &-label {
+    font-size: 20px;
+    font-weight: 600;
+    color: #fff;
+  }
+
+  &-error-message {
+    user-select: none;
+    font-size: 12px;
+    color: #d92d20;
+    line-height: 18px;
+    padding: 0 4px;
+  }
+}
+
+.pisell-number-keyboard-input-wrapper {
+  position: relative;
+
+  .pisell-number-keyboard-error-message {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    font-size: 12px;
+    color: #f04438;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+  }
+}

package/lib/pro/keyboards/numberKeyboard/types.d.ts

@@ -0,0 +1,63 @@
+/// <reference types="react" />
+export declare type NumberKeyboardMode = 'integer' | 'decimal';
+export interface NumberKeyboardBaseProps {
+    /** 模式：整数 or 小数 */
+    mode?: NumberKeyboardMode;
+    /** 当前值（受控） */
+    value?: string;
+    /** 默认值（非受控） */
+    defaultValue?: string;
+    /** 原始值，用于重置 */
+    originalValue?: string;
+    /** 占位符 */
+    placeholder?: string;
+    /** 最大值 */
+    max?: number;
+    /** 最小值 */
+    min?: number;
+    /** 最大长度 */
+    maxLength?: number;
+    /** 小数位数，默认 2 */
+    precision?: number;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 确认按钮文本 */
+    doneText?: string;
+    /** 重置按钮文本 */
+    resetText?: string;
+    /** 清空按钮文本 */
+    clearText?: string;
+    /** 标签文本（显示在输入框上方） */
+    label?: string;
+    /** 超出范围时的提示文本 */
+    errorText?: string;
+    /** 值变化回调 */
+    onChange?: (value: string) => void;
+    /** 确认按钮点击回调 */
+    onEnter?: (value: string) => void;
+    /** 重置按钮点击回调 */
+    onReset?: () => void;
+    /** 外层样式 */
+    style?: React.CSSProperties;
+    /** 自定义类名 */
+    className?: string;
+    /** 键盘是否监听物理键盘 */
+    keydown?: boolean;
+    /** 输入框样式 */
+    inputStyle?: React.CSSProperties;
+    /** 输入框包裹样式 */
+    inputWrapperStyle?: React.CSSProperties;
+}
+export interface NumberKeyboardProps extends NumberKeyboardBaseProps {
+    /** 容器配置，用于控制键盘以 popover 或 modal 形态展示 */
+    containerProps?: {
+        /** 渲染类型：popover 或 modal */
+        renderType: 'modal' | 'popover';
+        /** 是否打开（受控模式） */
+        open?: boolean;
+        /** 其他传递给 Popover 或 Modal 的属性 */
+        [key: string]: any;
+    };
+    /** 子元素，用于 popover 模式的触发器 */
+    children?: React.ReactNode;
+}

package/lib/pro/keyboards/numberKeyboard/types.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/pro/keyboards/numberKeyboard/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/pro/priceKeyboard/components/cashKeyboard/CashKeyboardSimple.js

@@ -238,7 +238,8 @@ var CashKeyboardBase = (props) => {
           background: "transparent",
           width: "100%"
         },
-        preventBlurElements: [`#${uniqueKeyboardId}`, shortcutsRef]
+        preventBlurElements: [`#${uniqueKeyboardId}`, shortcutsRef],
+        selected: isFirstInput && !!internalValue
       }
     ), /* @__PURE__ */ import_react.default.createElement(
       "div",

package/lib/pro/priceKeyboard/components/discountKeyboard/index.js

@@ -261,7 +261,8 @@ var DiscountKeyboardBase = (props) => {
             color: _color
           },
           placeholder,
-          bottomContent: renderBottomContent()
+          bottomContent: renderBottomContent(),
+          selected: isFirstInput && updateMode === "priceOverride" && !!internalValue
         }
       ),
       /* @__PURE__ */ import_react.default.createElement(

package/lib/pro/priceKeyboard/components/paymentKeyboard/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PaymentKeyboardBaseProps } from './types';
 import './index.less';
 interface PaymentKeyboardProps extends PaymentKeyboardBaseProps {

package/lib/pro/priceKeyboard/components/paymentKeyboard/index.js

@@ -324,7 +324,8 @@ var PaymentKeyboardBase = (props) => {
           padding: 16
         },
         bottomContent: renderBottomContent(),
-        preventBlurElements: [uniqueKeyboardId]
+        preventBlurElements: [uniqueKeyboardId],
+        selected: firstInputStatus.payment && !!internalPaymentValue
       }
     );
   };
@@ -354,7 +355,8 @@ var PaymentKeyboardBase = (props) => {
             justifyContent: "center"
           },
           onFocus: () => setFocusedInput(KEYS.PERCENT),
-          preventBlurElements: [uniqueKeyboardId]
+          preventBlurElements: [uniqueKeyboardId],
+          selected: firstInputStatus.percent && !!(internalSurchargeValue == null ? void 0 : internalSurchargeValue.percent) && focusedInput !== KEYS.FIXED
         }
       ),
       /* @__PURE__ */ import_react.default.createElement(
@@ -383,7 +385,8 @@ var PaymentKeyboardBase = (props) => {
             justifyContent: "center"
           },
           onFocus: () => setFocusedInput(KEYS.FIXED),
-          preventBlurElements: [uniqueKeyboardId]
+          preventBlurElements: [uniqueKeyboardId],
+          selected: firstInputStatus.fixed && !!(internalSurchargeValue == null ? void 0 : internalSurchargeValue.fixed) && focusedInput === KEYS.FIXED
         }
       )
     );