@pisell/materials 2.2.86 → 2.2.88

package/es/components/virtual-keyboard/index.js

@@ -1,9 +1,26 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["virtualKeyInputProps", "style", "className", "keyboardProps", "onChange", "value", "rightPanel", "selectType"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { useEffect } from "react";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useEffect, useMemo } from "react";
 import Keyboard from "./Keyboard";
 import VirtualKeyInput from "./VirtualKeyInput";
 import "./index.less";
 import classNames from "classnames";
+import { setTheme } from '@pisell/utils';
+import usePisellConfig from "../pisell-config-provider/hooks/usePisellConfig";
 var items = [{
   value: 1,
   label: "1",
@@ -60,6 +77,33 @@ var items = [{
   disabled: false,
   type: "primary"
 }];
+// 默认主题配置
+var virtualKeyboardThemeConfig = {
+  dark: {
+    backgroundColor: 'rgba(0, 0, 0, 0.70)',
+    containerBackgroundColor: 'rgba(0, 0, 0, 0.40)',
+    buttonBackgroundColor: '#ffffff',
+    textColor: '#000000',
+    keyboardBackgroundColor: 'rgba(0, 0, 0, 0.40)',
+    keyboardButtonBackgroundColor: '#ffffff',
+    keyboardButtonTextColor: '#000000',
+    keyboardButtonHoverColor: '#f5f5f5',
+    primaryButtonBackgroundColor: '#4ca30d',
+    primaryButtonTextColor: '#ffffff'
+  },
+  light: {
+    backgroundColor: '#ffffff',
+    containerBackgroundColor: '#d0d5dd',
+    buttonBackgroundColor: '#ffffff',
+    textColor: '#000000',
+    keyboardBackgroundColor: '#f9f9f9',
+    keyboardButtonBackgroundColor: '#ffffff',
+    keyboardButtonTextColor: '#000000',
+    keyboardButtonHoverColor: '#f5f5f5',
+    primaryButtonBackgroundColor: '#4ca30d',
+    primaryButtonTextColor: '#ffffff'
+  }
+};
 var VirtualKeyboard = function VirtualKeyboard(props) {
   var virtualKeyInputProps = props.virtualKeyInputProps,
     style = props.style,
@@ -67,12 +111,53 @@ var VirtualKeyboard = function VirtualKeyboard(props) {
     keyboardProps = props.keyboardProps,
     onChange = props.onChange,
     value = props.value,
-    rightPanel = props.rightPanel;
+    rightPanel = props.rightPanel,
+    _props$selectType = props.selectType,
+    selectType = _props$selectType === void 0 ? 'light' : _props$selectType,
+    others = _objectWithoutProperties(props, _excluded);
+  var config = usePisellConfig();
   useEffect(function () {
     document.body.id = "body";
   }, []);
+
+  /**
+   * 配置颜色
+   * 根据 props 和 selectType 生成最终的配置颜色
+   */
+  var configColor = useMemo(function () {
+    var currentConfig = virtualKeyboardThemeConfig[selectType];
+
+    // 过滤出有效的 props 并合并到默认配置中
+    var validProps = Object.entries(props).reduce(function (acc, _ref) {
+      var _ref2 = _slicedToArray(_ref, 2),
+        key = _ref2[0],
+        value = _ref2[1];
+      if (value !== undefined && key in currentConfig) {
+        acc[key] = value;
+      }
+      return acc;
+    }, {});
+    return _objectSpread(_objectSpread({}, currentConfig), validProps);
+  }, [selectType, props]);
+  useEffect(function () {
+    setTheme({
+      '--virtual-keyboard-background-color': configColor.backgroundColor,
+      '--virtual-keyboard-container-background-color': configColor.containerBackgroundColor,
+      '--virtual-keyboard-button-background-color': configColor.buttonBackgroundColor,
+      '--virtual-keyboard-text-color': configColor.textColor,
+      '--virtual-keyboard-keyboard-background-color': configColor.keyboardBackgroundColor,
+      '--virtual-keyboard-keyboard-button-background-color': configColor.keyboardButtonBackgroundColor,
+      '--virtual-keyboard-keyboard-button-text-color': configColor.keyboardButtonTextColor,
+      '--virtual-keyboard-keyboard-button-hover-color': configColor.keyboardButtonHoverColor,
+      '--virtual-keyboard-primary-button-background-color': configColor.primaryButtonBackgroundColor,
+      '--virtual-keyboard-primary-button-text-color': configColor.primaryButtonTextColor
+    });
+  }, [configColor]);
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames("virtual-keyboard-component", className),
+    className: classNames("virtual-keyboard-component", className, {
+      'virtual-keyboard-component-dark': selectType === 'dark',
+      'virtual-keyboard-component-light': selectType === 'light'
+    }),
     style: style
   }, /*#__PURE__*/React.createElement("div", {
     className: classNames("virtual-keyboard-component-left")

package/es/components/virtual-keyboard/index.less

@@ -2,14 +2,46 @@
   display: flex;
   align-items: center;
   gap: 20px;
+  background-color: var(--virtual-keyboard-background-color, #ffffff);
+  
+  &.virtual-keyboard-component-dark {
+    background-color: var(--virtual-keyboard-background-color, rgba(0, 0, 0, 0.70));
+  }
+  
+  &.virtual-keyboard-component-light {
+    background-color: var(--virtual-keyboard-background-color, #ffffff);
+  }
 }
 
 .virtual-keyboard-component-left {
   padding: 10px;
   width: 380px;
   border-radius: 10px;
-  background: var(--Gray-300, #D0D5DD);
+  background: var(--virtual-keyboard-container-background-color, #D0D5DD);
   backdrop-filter: blur(50px);
+  
+  .pisell-virtual-keyboard-input {
+    background-color: var(--virtual-keyboard-button-background-color, #ffffff);
+    color: var(--virtual-keyboard-text-color, #000000);
+  }
+  
+  .pisell-keyboard {
+    background-color: var(--virtual-keyboard-keyboard-background-color, #f9f9f9);
+    
+    .pisell-keyboard-item {
+      background-color: var(--virtual-keyboard-keyboard-button-background-color, #ffffff);
+      color: var(--virtual-keyboard-keyboard-button-text-color, #000000);
+      
+      &:hover {
+        background-color: var(--virtual-keyboard-keyboard-button-hover-color, #f5f5f5);
+      }
+      
+      &.pisell-keyboard-item-primary {
+        background-color: var(--virtual-keyboard-primary-button-background-color, #4ca30d);
+        color: var(--virtual-keyboard-primary-button-text-color, #ffffff);
+      }
+    }
+  }
 }
 
 .virtual-keyboard-component-right {

package/es/utils/platform.d.ts

@@ -1 +1 @@
-export declare const isMobile: () => any;
+export declare const isMobile: () => boolean;

package/lib/components/dataSourceComponents/fields/Input.Subdomain/index.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 declare const Subdomain: React.FC<import("antd").InputProps & {
     onChange: (value: string) => void;
     onBlur?: ((e: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
-    rootDomain: "custom" | "saas" | "xzero";
+    rootDomain: "custom" | "xzero" | "saas";
     customDomain?: string | undefined;
     value?: string | undefined;
     tenantId: string;

package/lib/components/dataSourceComponents/fields/index.d.ts

@@ -20,7 +20,7 @@ declare const formFieldMap: {
         Subdomain: import("react").FC<import("antd").InputProps & {
             onChange: (value: string) => void;
             onBlur?: ((e: import("react").FocusEvent<HTMLInputElement, Element>) => void) | undefined;
-            rootDomain: "custom" | "saas" | "xzero";
+            rootDomain: "custom" | "xzero" | "saas";
             customDomain?: string | undefined;
             value?: string | undefined;
             tenantId: string;
@@ -60,11 +60,19 @@ declare const formFieldMap: {
     FormItemTranslation: import("react").FC<import("./Translation/type").TranslationProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     FormItemIconSelect: import("react").FC<import("./IconSelect/type").IconSelectProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
 };
-declare const getFieldComponent: (fieldComponent: string) => import("react").FC<any> | import("react").FC<import("./Input.Phone/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Input.Mobile/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps> | (import("react").FC<{}> & {
-    Group: import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps>;
+declare const getFieldComponent: (fieldComponent: string) => import("react").FC<any> | import("react").FC<import("./Input.Phone/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Input.Mobile/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./IconSelect/type").IconSelectProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Translation/type").TranslationProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Upload/type").UploadProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./DateRangePicker/type").DateRangePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./TimePicker/type").TimePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | ((props: import("antd").SelectProps<any, import("antd/es/select").DefaultOptionType> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps & {
+    options?: any;
+    optionSourceType?: "custom" | "default" | "api" | undefined;
+    labelField: string;
+    valueField: string;
+    extraParams?: Record<string, any> | undefined;
 } & {
-    Group: import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps>;
-}) | import("react").FC<import("./ColorPicker/type").ColorPickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<(import("antd").DatePickerProps & import("../dataSourceForm/utils").WithModeProps) & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd/es/input").PasswordProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd").InputProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd").InputProps & {
+    dataSource?: any;
+}) => JSX.Element) | import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps> | (import("react").FC<{}> & {
+    Group: import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps>;
+} & {
+    Group: import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps>;
+}) | import("react").FC<import("antd/es/input").PasswordProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd").InputProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd").InputProps & {
     onChange: (value: string) => void;
 } & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | (import("react").FC<import("./Input/type").InputProps> & {
     JSON: import("react").FC<any>;
@@ -79,24 +87,16 @@ declare const getFieldComponent: (fieldComponent: string) => import("react").FC<
     Subdomain: import("react").FC<import("antd").InputProps & {
         onChange: (value: string) => void;
         onBlur?: ((e: import("react").FocusEvent<HTMLInputElement, Element>) => void) | undefined;
-        rootDomain: "custom" | "saas" | "xzero";
+        rootDomain: "custom" | "xzero" | "saas";
         customDomain?: string | undefined;
         value?: string | undefined;
         tenantId: string;
         name?: string | undefined;
         fieldKey?: string | undefined;
     } & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
-}) | import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps> | (import("react").FC<{}> & {
-    Group: import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps>;
-} & {
-    Group: import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps>;
-}) | ((props: import("antd").SelectProps<any, import("antd/es/select").DefaultOptionType> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps & {
-    options?: any;
-    optionSourceType?: "custom" | "default" | "api" | undefined;
-    labelField: string;
-    valueField: string;
-    extraParams?: Record<string, any> | undefined;
+}) | import("react").FC<(import("antd").DatePickerProps & import("../dataSourceForm/utils").WithModeProps) & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./ColorPicker/type").ColorPickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps> | (import("react").FC<{}> & {
+    Group: import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps>;
 } & {
-    dataSource?: any;
-}) => JSX.Element) | import("react").FC<import("./TimePicker/type").TimePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./DateRangePicker/type").DateRangePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Upload/type").UploadProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Translation/type").TranslationProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./IconSelect/type").IconSelectProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+    Group: import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps>;
+});
 export { getFieldComponent, formFieldMap };

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputNumberProps } from 'antd/es/input-number';
 export interface PisellAdjustPriceInputNumberProps extends Omit<InputNumberProps, 'onChange'> {
     value?: number;

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

@@ -1,9 +1,5 @@
+/// <reference types="react" />
 import './index.less';
-export interface PisellAdjustPriceProps {
-    value?: number;
-    originValue: number;
-    defaultValue?: number;
-    onChange?: (val: number) => void;
-}
+import { PisellAdjustPriceProps } from './type';
 declare const PisellAdjustPrice: (props: PisellAdjustPriceProps) => JSX.Element;
 export default PisellAdjustPrice;

package/lib/components/pisellAdjustPrice/index.js

@@ -35,13 +35,22 @@ module.exports = __toCommonJS(pisellAdjustPrice_exports);
 var import_react = __toESM(require("react"));
 var import_antd = require("antd");
 var import_classnames = __toESM(require("classnames"));
+var import_utils = require("@pisell/utils");
 var import_pisellText = __toESM(require("../pisellText"));
 var import_Amount = __toESM(require("../virtual-keyboard/Amount"));
 var import_locales = require("../../locales");
 var import_index = require("./index.less");
 var import_usePisellConfig = __toESM(require("../pisell-config-provider/hooks/usePisellConfig"));
+var import_status = require("./status");
 var PisellAdjustPrice = (props) => {
-  const { value, onChange, defaultValue, originValue, ...others } = props;
+  const {
+    value,
+    onChange,
+    defaultValue,
+    originValue,
+    selectType = "light",
+    ...others
+  } = props;
   const config = (0, import_usePisellConfig.default)();
   const [newValue, setNewValue] = (0, import_react.useState)(value || 0);
   const [updateMode, setUpdateMode] = (0, import_react.useState)(
@@ -53,6 +62,16 @@ var PisellAdjustPrice = (props) => {
   (0, import_react.useEffect)(() => {
     document.body.id = "body";
   }, []);
+  const configColor = (0, import_react.useMemo)(() => {
+    const currentConfig = import_status.defaultConfig[selectType];
+    const validProps = Object.entries(props).reduce((acc, [key, value2]) => {
+      if (value2 !== void 0 && key in currentConfig) {
+        acc[key] = value2;
+      }
+      return acc;
+    }, {});
+    return { ...currentConfig, ...validProps };
+  }, [selectType, props]);
   const handleEnter = () => {
     if (isDiscountError) {
       return;
@@ -92,65 +111,107 @@ var PisellAdjustPrice = (props) => {
       return `${v}%`;
     }
   };
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-adjust-price-wrap" }, /* @__PURE__ */ import_react.default.createElement(
-    import_antd.Segmented,
-    {
-      size: "large",
-      options: [
-        {
-          label: (0, import_locales.getText)("pisell-adjust-price-price-override"),
-          value: "priceOverride"
-        },
-        { label: (0, import_locales.getText)("pisell-adjust-price-discount"), value: "discount" }
-      ],
-      value: updateMode,
-      onChange: handleUpdateMode,
-      block: true
-    }
-  ), updateMode === "discount" && /* @__PURE__ */ import_react.default.createElement(
-    import_antd.Segmented,
-    {
-      size: "large",
-      options: [
-        {
-          label: `${(0, import_locales.getText)("pisell-adjust-price-discount-amount")}(${(config == null ? void 0 : config.symbol) || "$"})`,
-          value: "amount"
-        },
-        {
-          label: `${(0, import_locales.getText)("pisell-adjust-price-discount-percentage")}(%)`,
-          value: "percentage"
-        }
-      ],
-      value: discountMode,
-      onChange: (val) => {
-        setNewValue("");
-        setDiscountMode(val);
-      },
-      block: true
-    }
-  ), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-adjust-price-amount-wrap" }, /* @__PURE__ */ import_react.default.createElement(
-    import_Amount.default,
-    {
-      ...others,
-      inputFormat,
-      defaultValue: updateMode === "priceOverride" ? defaultValue : "",
-      key: updateMode,
-      value: newValue,
-      defaultSelect: updateMode === "priceOverride",
-      onChange: handleChange,
-      onEnter: handleEnter,
-      placeholder: discountMode === "amount" ? "0" : "%"
-    }
-  )), updateMode === "discount" && /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-low-code-adjust-price-total" }, isDiscountError ? /* @__PURE__ */ import_react.default.createElement(import_pisellText.default.Amount, { value: originValue }) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, newValue && (0, import_locales.getText)("pisell-adjust-price-total-after-discount"), /* @__PURE__ */ import_react.default.createElement(import_pisellText.default.Amount, { value: totalAfterDiscount }))), /* @__PURE__ */ import_react.default.createElement(
+  (0, import_react.useEffect)(() => {
+    (0, import_utils.setTheme)({
+      "--pisell-adjust-price-text-color": configColor.textColor,
+      "--pisell-adjust-price-background-color": configColor.backgroundColor,
+      "--pisell-adjust-price-container-background-color": configColor.containerBackgroundColor,
+      "--pisell-adjust-price-button-background-color": configColor.buttonBackgroundColor,
+      "--pisell-adjust-price-main-text-color": configColor.mainTextColor,
+      "--pisell-adjust-price-sub-text-color": configColor.subTextColor
+    });
+  }, [configColor]);
+  return /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
-      className: (0, import_classnames.default)("pisell-low-code-adjust-price-amount-desc", {
-        ["pisell-low-code-adjust-price-amount-desc-error"]: isDiscountError
+      className: (0, import_classnames.default)("pisell-lowcode-adjust-price-wrap", {
+        "pisell-lowcode-adjust-price-dark": selectType === "dark",
+        "pisell-lowcode-adjust-price-light": selectType === "light"
       })
     },
-    (0, import_locales.getText)("pisell-adjust-price-discount-can-be-maximum"),
-    " ",
-    discountMode === "amount" ? /* @__PURE__ */ import_react.default.createElement(import_pisellText.default.Amount, { value: originValue }) : "100%"
-  )));
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Segmented,
+      {
+        size: "large",
+        options: [
+          {
+            label: (0, import_locales.getText)("pisell-adjust-price-price-override"),
+            value: "priceOverride"
+          },
+          { label: (0, import_locales.getText)("pisell-adjust-price-discount"), value: "discount" }
+        ],
+        value: updateMode,
+        onChange: handleUpdateMode,
+        block: true
+      }
+    ),
+    updateMode === "discount" && /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Segmented,
+      {
+        size: "large",
+        options: [
+          {
+            label: `${(0, import_locales.getText)("pisell-adjust-price-discount-amount")}(${(config == null ? void 0 : config.symbol) || "$"})`,
+            value: "amount"
+          },
+          {
+            label: `${(0, import_locales.getText)("pisell-adjust-price-discount-percentage")}(%)`,
+            value: "percentage"
+          }
+        ],
+        value: discountMode,
+        onChange: (val) => {
+          setNewValue("");
+          setDiscountMode(val);
+        },
+        block: true
+      }
+    ),
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-adjust-price-amount-wrap" }, /* @__PURE__ */ import_react.default.createElement(
+      import_Amount.default,
+      {
+        ...others,
+        inputFormat,
+        defaultValue: updateMode === "priceOverride" ? defaultValue : "",
+        key: updateMode,
+        value: newValue,
+        defaultSelect: updateMode === "priceOverride",
+        onChange: handleChange,
+        onEnter: handleEnter,
+        placeholder: discountMode === "amount" ? "0" : "%",
+        rightItemsStyle: {
+          buttonBackgroundColor: configColor.buttonBackgroundColor,
+          textColor: configColor.textColor,
+          resetButtonBackgroundColor: configColor.resetButtonBackgroundColor,
+          resetButtonTextColor: configColor.resetButtonTextColor,
+          isDoneButtonFollowTheme: configColor.isDoneButtonFollowTheme,
+          doneButtonBackgroundColor: configColor.doneButtonBackgroundColor,
+          doneButtonTextColor: configColor.doneButtonTextColor
+        }
+      }
+    )),
+    updateMode === "discount" && /* @__PURE__ */ import_react.default.createElement("div", null, configColor.isShowMainText ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-low-code-adjust-price-total" }, isDiscountError ? /* @__PURE__ */ import_react.default.createElement(import_pisellText.default.Amount, { value: originValue }) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, newValue && (0, import_locales.getText)("pisell-adjust-price-total-after-discount"), /* @__PURE__ */ import_react.default.createElement(import_pisellText.default.Amount, { value: totalAfterDiscount }))) : null, configColor.isShowSubText ? /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: (0, import_classnames.default)(
+          "pisell-low-code-adjust-price-amount-desc",
+          {
+            ["pisell-low-code-adjust-price-amount-desc-error"]: isDiscountError
+          }
+        )
+      },
+      (0, import_locales.getText)("pisell-adjust-price-discount-can-be-maximum"),
+      " ",
+      discountMode === "amount" ? /* @__PURE__ */ import_react.default.createElement(
+        import_pisellText.default.Amount,
+        {
+          value: originValue,
+          style: {
+            color: configColor.subTextColor
+          }
+        }
+      ) : "100%"
+    ) : null)
+  );
 };
 var pisellAdjustPrice_default = PisellAdjustPrice;

package/lib/components/pisellAdjustPrice/index.less

@@ -1,30 +1,59 @@
 .pisell-lowcode-adjust-price-wrap {
   width: 380px;
   border-radius: 10px;
-  background-color: #fff;
+  background-color: var(--pisell-adjust-price-background-color);
   padding: 10px;
   display: flex;
   flex-direction: column;
   gap: 10px;
+  transition: all 0.3s ease;
+
+  // 浅色模式样式
+  &.pisell-lowcode-adjust-price-light {
+    .pisell-lowcode-segmented-item-label {
+      color: #667085;
+    }
+  }
+
+  // 深色模式样式
+  &.pisell-lowcode-adjust-price-dark {
+    .pisell-lowcode-segmented-item-label {
+      color: #d0d5dd;
+    }
+  }
+
+  .pisell-lowcode-segmented {
+    background: var(--pisell-adjust-price-container-background-color);
+    :hover {
+      color: var(--pisell-adjust-price-text-color);
+    }
+    .pisell-lowcode-segmented-item-selected {
+      background: var(--pisell-adjust-price-button-background-color);
+      .pisell-lowcode-segmented-item-label {
+        color: var(--pisell-adjust-price-text-color) !important;
+      }
+    }
+  }
+
   .pisell-lowcode-adjust-price-amount-wrap {
     padding: 10px;
     border-radius: 10px;
-    background: var(--Gray-300, #D0D5DD);
+    background: var(--pisell-adjust-price-container-background-color);
   }
   .pisell-low-code-adjust-price-total {
-    color: var(--Gray-900, #101828);
+    color: var(--pisell-adjust-price-main-text-color);
     font-size: 20px;
     font-weight: 600;
     line-height: 30px; /* 150% */
   }
   .pisell-low-code-adjust-price-amount-desc {
-    color: var(--Gray-500, #667085);
+    color: var(--pisell-adjust-price-sub-text-color);
     font-size: 16px;
     font-style: normal;
     font-weight: 400;
     line-height: 24px; /* 150% */
   }
   .pisell-low-code-adjust-price-amount-desc-error {
-    color: var(--Error-600, #D92D20);
+    color: var(--Error-600, #d92d20);
   }
-}
+}

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

@@ -0,0 +1,32 @@
+export declare const defaultConfig: {
+    dark: {
+        backgroundColor: string;
+        containerBackgroundColor: string;
+        buttonBackgroundColor: string;
+        textColor: string;
+        resetButtonBackgroundColor: string;
+        resetButtonTextColor: string;
+        isDoneButtonFollowTheme: boolean;
+        doneButtonBackgroundColor: string;
+        doneButtonTextColor: string;
+        isShowMainText: boolean;
+        mainTextColor: string;
+        isShowSubText: boolean;
+        subTextColor: string;
+    };
+    light: {
+        backgroundColor: string;
+        containerBackgroundColor: string;
+        buttonBackgroundColor: string;
+        textColor: string;
+        resetButtonBackgroundColor: string;
+        resetButtonTextColor: string;
+        isDoneButtonFollowTheme: boolean;
+        doneButtonBackgroundColor: string;
+        doneButtonTextColor: string;
+        isShowMainText: boolean;
+        mainTextColor: string;
+        isShowSubText: boolean;
+        subTextColor: string;
+    };
+};

package/lib/components/pisellAdjustPrice/status.js

@@ -0,0 +1,60 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellAdjustPrice/status.ts
+var status_exports = {};
+__export(status_exports, {
+  defaultConfig: () => defaultConfig
+});
+module.exports = __toCommonJS(status_exports);
+var defaultConfig = {
+  dark: {
+    backgroundColor: "rgba(0, 0, 0, 0.70)",
+    containerBackgroundColor: "rgba(0, 0, 0, 0.40)",
+    buttonBackgroundColor: "#ffffff",
+    textColor: "#000000",
+    resetButtonBackgroundColor: "#ffffff",
+    resetButtonTextColor: "#d92d20",
+    isDoneButtonFollowTheme: true,
+    doneButtonBackgroundColor: "#4ca30d",
+    doneButtonTextColor: "#ffffff",
+    isShowMainText: true,
+    mainTextColor: "#ffffff",
+    isShowSubText: true,
+    subTextColor: "#d0d5dd"
+  },
+  light: {
+    backgroundColor: "#ffffff",
+    containerBackgroundColor: "#d0d5dd",
+    buttonBackgroundColor: "#ffffff",
+    textColor: "#000000",
+    resetButtonBackgroundColor: "#ffffff",
+    resetButtonTextColor: "#d92d20",
+    isDoneButtonFollowTheme: true,
+    doneButtonBackgroundColor: "#4ca30d",
+    doneButtonTextColor: "#ffffff",
+    isShowMainText: true,
+    mainTextColor: "#101828",
+    isShowSubText: true,
+    subTextColor: "#667085"
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  defaultConfig
+});