@pisell/private-materials 6.6.60 → 6.6.62
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/build/lowcode/assets-daily.json +11 -11
- package/build/lowcode/assets-dev.json +2 -2
- package/build/lowcode/assets-prod.json +11 -11
- package/build/lowcode/index.js +1 -1
- package/build/lowcode/meta.js +2 -2
- package/build/lowcode/preview.js +8 -8
- package/build/lowcode/render/default/view.css +1 -1
- package/build/lowcode/render/default/view.js +10 -10
- package/build/lowcode/view.css +1 -1
- package/build/lowcode/view.js +10 -10
- package/es/components/booking/components/footer/amount.js +3 -4
- package/es/components/booking/components/footer/utils.js +82 -85
- package/es/components/booking/components/voucher/index.js +1 -1
- package/es/components/booking/dashboard/index.d.ts +5 -0
- package/es/components/booking/dashboard/index.js +9 -6
- package/es/components/booking/info/service2/Group/utils.js +30 -1
- package/es/components/booking/info2/service/editService/index.js +6 -49
- package/es/components/booking/info2/service/editService/utils.d.ts +0 -1
- package/es/components/booking/info2/service/editService/utils.js +0 -16
- package/es/components/booking/payments/index.js +1 -1
- package/es/components/checkout/hooks/useWalletPass.d.ts +1 -1
- package/es/components/checkout/hooks/useWalletPass.js +23 -15
- package/es/components/index.d.ts +2 -1
- package/es/components/index.js +2 -1
- package/es/components/pisellCashCounting/PisellCashCounting.d.ts +5 -0
- package/es/components/pisellCashCounting/PisellCashCounting.js +121 -0
- package/es/components/pisellCashCounting/PisellCashCounting.less +263 -0
- package/es/components/pisellCashCounting/components/CashCountingModal/index.d.ts +20 -0
- package/es/components/pisellCashCounting/components/CashCountingModal/index.js +250 -0
- package/es/components/pisellCashCounting/components/CashCountingModal/index.less +279 -0
- package/es/components/pisellCashCounting/hooks.d.ts +21 -0
- package/es/components/pisellCashCounting/hooks.js +193 -0
- package/es/components/pisellCashCounting/index.d.ts +2 -0
- package/es/components/pisellCashCounting/index.js +1 -0
- package/es/components/pisellCashCounting/locales.d.ts +118 -0
- package/es/components/pisellCashCounting/locales.js +117 -0
- package/es/components/pisellCashCounting/types.d.ts +85 -0
- package/es/components/pisellCashCounting/types.js +1 -0
- package/es/components/pisellCashCounting/utils.d.ts +10 -0
- package/es/components/pisellCashCounting/utils.js +40 -0
- package/es/components/ticketBooking/components/addServiceVariant/addService.js +0 -1
- package/es/components/ticketBooking/components/bookingDataPanel/bookingDashboard/index.d.ts +2 -0
- package/es/components/ticketBooking/components/bookingDataPanel/bookingDashboard/index.js +5 -2
- package/es/components/ticketBooking/components/bookingDataPanel/index.d.ts +2 -0
- package/es/components/ticketBooking/components/bookingDataPanel/index.js +5 -2
- package/es/components/ticketBooking/components/bookingDataPanel/pisellFloatingPanel/index.js +2 -1
- package/es/components/ticketBooking/components/ticketBooking/index.js +156 -37
- package/es/components/ticketBooking/index.js +7 -1
- package/es/components/ticketBooking/utils/formatProductMessage.js +47 -2
- package/es/hooks/useResponsive.d.ts +8 -0
- package/es/hooks/useResponsive.js +43 -0
- package/es/hooks/useThemeTokens.d.ts +7 -0
- package/es/hooks/useThemeTokens.js +20 -0
- package/es/index.d.ts +1 -0
- package/es/index.js +2 -1
- package/es/pro/Login2.0/components/phoneValidation.js +65 -58
- package/es/pro/NumericStepper/index.d.ts +75 -0
- package/es/pro/NumericStepper/index.js +301 -0
- package/es/pro/NumericStepper/index.less +364 -0
- package/es/pro/keyboards/index.d.ts +2 -0
- package/es/pro/keyboards/index.js +1 -0
- package/es/pro/keyboards/locales.d.ts +38 -0
- package/es/pro/keyboards/locales.js +57 -0
- package/es/pro/keyboards/numberKeyboard/index.d.ts +16 -0
- package/es/pro/keyboards/numberKeyboard/index.js +523 -0
- package/es/pro/keyboards/numberKeyboard/index.less +59 -0
- package/es/pro/keyboards/numberKeyboard/types.d.ts +63 -0
- package/es/pro/keyboards/numberKeyboard/types.js +1 -0
- package/es/pro/pisellPriceKeyboardModal/PisellPriceKeyboardModal.js +3 -1
- package/es/pro/pisellPriceKeyboardModal/types.d.ts +2 -0
- package/lib/components/booking/components/footer/amount.js +3 -3
- package/lib/components/booking/components/footer/utils.js +11 -15
- package/lib/components/booking/components/voucher/index.js +1 -1
- package/lib/components/booking/dashboard/index.d.ts +5 -0
- package/lib/components/booking/dashboard/index.js +6 -5
- package/lib/components/booking/info/service2/Group/utils.js +42 -3
- package/lib/components/booking/info2/service/editService/index.js +5 -39
- package/lib/components/booking/info2/service/editService/utils.d.ts +0 -1
- package/lib/components/booking/info2/service/editService/utils.js +0 -16
- package/lib/components/booking/payments/index.js +1 -1
- package/lib/components/checkout/hooks/useWalletPass.d.ts +1 -1
- package/lib/components/checkout/hooks/useWalletPass.js +23 -16
- package/lib/components/index.d.ts +2 -1
- package/lib/components/index.js +3 -0
- package/lib/components/pisellCashCounting/PisellCashCounting.d.ts +5 -0
- package/lib/components/pisellCashCounting/PisellCashCounting.js +168 -0
- package/lib/components/pisellCashCounting/PisellCashCounting.less +263 -0
- package/lib/components/pisellCashCounting/components/CashCountingModal/index.d.ts +20 -0
- package/lib/components/pisellCashCounting/components/CashCountingModal/index.js +171 -0
- package/lib/components/pisellCashCounting/components/CashCountingModal/index.less +279 -0
- package/lib/components/pisellCashCounting/hooks.d.ts +21 -0
- package/lib/components/pisellCashCounting/hooks.js +189 -0
- package/lib/components/pisellCashCounting/index.d.ts +2 -0
- package/lib/components/pisellCashCounting/index.js +35 -0
- package/lib/components/pisellCashCounting/locales.d.ts +118 -0
- package/lib/components/pisellCashCounting/locales.js +141 -0
- package/lib/components/pisellCashCounting/types.d.ts +85 -0
- package/lib/components/pisellCashCounting/types.js +17 -0
- package/lib/components/pisellCashCounting/utils.d.ts +10 -0
- package/lib/components/pisellCashCounting/utils.js +59 -0
- package/lib/components/ticketBooking/components/addServiceVariant/addService.js +0 -1
- package/lib/components/ticketBooking/components/bookingDataPanel/bookingDashboard/index.d.ts +2 -0
- package/lib/components/ticketBooking/components/bookingDataPanel/bookingDashboard/index.js +3 -2
- package/lib/components/ticketBooking/components/bookingDataPanel/index.d.ts +2 -0
- package/lib/components/ticketBooking/components/bookingDataPanel/index.js +10 -3
- package/lib/components/ticketBooking/components/bookingDataPanel/pisellFloatingPanel/index.js +10 -1
- package/lib/components/ticketBooking/components/ticketBooking/index.js +114 -14
- package/lib/components/ticketBooking/index.js +11 -1
- package/lib/components/ticketBooking/utils/formatProductMessage.js +44 -2
- package/lib/hooks/useResponsive.d.ts +8 -0
- package/lib/hooks/useResponsive.js +48 -0
- package/lib/hooks/useThemeTokens.d.ts +7 -0
- package/lib/hooks/useThemeTokens.js +40 -0
- package/lib/index.d.ts +1 -0
- package/lib/index.js +3 -0
- package/lib/pro/Login2.0/components/phoneValidation.js +4 -2
- package/lib/pro/NumericStepper/index.d.ts +75 -0
- package/lib/pro/NumericStepper/index.js +338 -0
- package/lib/pro/NumericStepper/index.less +364 -0
- package/lib/pro/keyboards/index.d.ts +2 -0
- package/lib/pro/keyboards/index.js +39 -0
- package/lib/pro/keyboards/locales.d.ts +38 -0
- package/lib/pro/keyboards/locales.js +61 -0
- package/lib/pro/keyboards/numberKeyboard/index.d.ts +16 -0
- package/lib/pro/keyboards/numberKeyboard/index.js +400 -0
- package/lib/pro/keyboards/numberKeyboard/index.less +59 -0
- package/lib/pro/keyboards/numberKeyboard/types.d.ts +63 -0
- package/lib/pro/keyboards/numberKeyboard/types.js +17 -0
- package/lib/pro/pisellPriceKeyboardModal/PisellPriceKeyboardModal.js +3 -1
- package/lib/pro/pisellPriceKeyboardModal/types.d.ts +2 -0
- package/lowcode/pisell-cash-counting/meta.ts +167 -0
- package/lowcode/pisell-cash-counting/snippets.ts +13 -0
- package/package.json +4 -4
|
@@ -24,7 +24,21 @@ __export(formatProductMessage_exports, {
|
|
|
24
24
|
module.exports = __toCommonJS(formatProductMessage_exports);
|
|
25
25
|
var import_utils = require("@pisell/utils");
|
|
26
26
|
var import_formatTime = require("./formatTime");
|
|
27
|
+
var import_utils2 = require("@pisell/utils");
|
|
28
|
+
var UNIT_LABEL = {
|
|
29
|
+
KILOGRAMS: "kg",
|
|
30
|
+
GRAMS: "g",
|
|
31
|
+
POUNDS: "lb",
|
|
32
|
+
OUNCES: "oz"
|
|
33
|
+
};
|
|
34
|
+
var DEFAULT_WEIGHT_PRECISION = 3;
|
|
35
|
+
var formatWeightValue = (value) => {
|
|
36
|
+
const parsedValue = Number(value);
|
|
37
|
+
const displayValue = Number.isFinite(parsedValue) ? parsedValue : 0;
|
|
38
|
+
return displayValue.toFixed(DEFAULT_WEIGHT_PRECISION);
|
|
39
|
+
};
|
|
27
40
|
var formatProductMessage = (product, utils) => {
|
|
41
|
+
var _a, _b;
|
|
28
42
|
const {
|
|
29
43
|
product_option_string,
|
|
30
44
|
options,
|
|
@@ -64,6 +78,28 @@ var formatProductMessage = (product, utils) => {
|
|
|
64
78
|
}
|
|
65
79
|
});
|
|
66
80
|
}
|
|
81
|
+
const weighing = (_b = (_a = product == null ? void 0 : product._origin) == null ? void 0 : _a._extend) == null ? void 0 : _b.weighing;
|
|
82
|
+
if (weighing) {
|
|
83
|
+
const { mode, unit_price, unit, weight, tare, net_weight } = weighing;
|
|
84
|
+
const unitLabel = UNIT_LABEL[unit] || unit;
|
|
85
|
+
const weightText = formatWeightValue(weight);
|
|
86
|
+
const tareText = formatWeightValue(tare == null ? void 0 : tare.value);
|
|
87
|
+
const netWeightText = formatWeightValue(net_weight);
|
|
88
|
+
const tareValue = Number((tare == null ? void 0 : tare.value) || 0);
|
|
89
|
+
const isManualWeight = mode === "manual";
|
|
90
|
+
const unitPriceText = `${currency_symbol || ""}${unit_price ?? "0.00"}`;
|
|
91
|
+
const manualPrefix = isManualWeight ? "(M) " : "";
|
|
92
|
+
if (tareValue > 0) {
|
|
93
|
+
str += `${manualPrefix}${import_utils2.locales.getText("pisell2.cart.sku-card.weighing.gross")}: ${weightText} ${unitLabel}
|
|
94
|
+
`;
|
|
95
|
+
}
|
|
96
|
+
if (tareValue > 0) {
|
|
97
|
+
str += `${import_utils2.locales.getText("pisell2.cart.sku-card.weighing.tare")}: ${tareText} ${UNIT_LABEL[tare == null ? void 0 : tare.unit] || (tare == null ? void 0 : tare.unit) || unitLabel}
|
|
98
|
+
`;
|
|
99
|
+
}
|
|
100
|
+
str += `${tareValue > 0 ? "" : manualPrefix}${netWeightText} ${unitLabel} ${import_utils2.locales.getText("pisell2.cart.sku-card.weighing.net")} @ ${unitPriceText}/${unitLabel}
|
|
101
|
+
`;
|
|
102
|
+
}
|
|
67
103
|
if (product_option_string) str += `${product_option_string}
|
|
68
104
|
`;
|
|
69
105
|
if (Array.isArray(options) && options.length) {
|
|
@@ -74,9 +110,15 @@ var formatProductMessage = (product, utils) => {
|
|
|
74
110
|
}
|
|
75
111
|
if (Array.isArray(bundle) && bundle.length) {
|
|
76
112
|
bundle.forEach((item) => {
|
|
77
|
-
str += `${item.title}
|
|
113
|
+
str += `${item.title} ${(0, import_utils.formatAmount)(item.price, 2, currency_symbol)} x ${item.num}
|
|
114
|
+
`;
|
|
115
|
+
const bundleOptions = item == null ? void 0 : item.options;
|
|
116
|
+
if (Array.isArray(bundleOptions) && bundleOptions.length) {
|
|
117
|
+
bundleOptions.forEach((opt) => {
|
|
118
|
+
str += ` ${opt == null ? void 0 : opt.name} ${(0, import_utils.formatAmount)(opt == null ? void 0 : opt.price, 2, currency_symbol)} x ${opt == null ? void 0 : opt.num}
|
|
78
119
|
`;
|
|
79
|
-
|
|
120
|
+
});
|
|
121
|
+
}
|
|
80
122
|
});
|
|
81
123
|
}
|
|
82
124
|
return str;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
|
|
19
|
+
// src/hooks/useResponsive.ts
|
|
20
|
+
var useResponsive_exports = {};
|
|
21
|
+
__export(useResponsive_exports, {
|
|
22
|
+
useResponsive: () => useResponsive
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(useResponsive_exports);
|
|
25
|
+
var import_react = require("react");
|
|
26
|
+
function useResponsive(breakpoint = 768) {
|
|
27
|
+
const [isMobile, setIsMobile] = (0, import_react.useState)(
|
|
28
|
+
typeof window !== "undefined" ? window.innerWidth < breakpoint : false
|
|
29
|
+
);
|
|
30
|
+
(0, import_react.useEffect)(() => {
|
|
31
|
+
if (typeof window === "undefined") {
|
|
32
|
+
return;
|
|
33
|
+
}
|
|
34
|
+
const handleResize = () => {
|
|
35
|
+
setIsMobile(window.innerWidth < breakpoint);
|
|
36
|
+
};
|
|
37
|
+
window.addEventListener("resize", handleResize);
|
|
38
|
+
handleResize();
|
|
39
|
+
return () => {
|
|
40
|
+
window.removeEventListener("resize", handleResize);
|
|
41
|
+
};
|
|
42
|
+
}, [breakpoint]);
|
|
43
|
+
return isMobile;
|
|
44
|
+
}
|
|
45
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
46
|
+
0 && (module.exports = {
|
|
47
|
+
useResponsive
|
|
48
|
+
});
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
|
|
19
|
+
// src/hooks/useThemeTokens.ts
|
|
20
|
+
var useThemeTokens_exports = {};
|
|
21
|
+
__export(useThemeTokens_exports, {
|
|
22
|
+
default: () => useThemeTokens_default
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(useThemeTokens_exports);
|
|
25
|
+
var import_antd = require("antd");
|
|
26
|
+
var themeTokenCache = /* @__PURE__ */ new Map();
|
|
27
|
+
var useThemeTokens = (themeInput) => {
|
|
28
|
+
var _a;
|
|
29
|
+
const { useToken, getDesignToken } = import_antd.theme;
|
|
30
|
+
const { token: antdToken } = useToken();
|
|
31
|
+
const overrideColorPrimary = ((_a = themeInput == null ? void 0 : themeInput.token) == null ? void 0 : _a.colorPrimary) || antdToken.colorPrimary;
|
|
32
|
+
const cached = themeTokenCache.get(overrideColorPrimary);
|
|
33
|
+
if (cached) return cached;
|
|
34
|
+
const computed = getDesignToken({
|
|
35
|
+
token: { colorPrimary: overrideColorPrimary }
|
|
36
|
+
});
|
|
37
|
+
themeTokenCache.set(overrideColorPrimary, computed);
|
|
38
|
+
return computed;
|
|
39
|
+
};
|
|
40
|
+
var useThemeTokens_default = useThemeTokens;
|
package/lib/index.d.ts
CHANGED
|
@@ -77,3 +77,4 @@ export { default as SaasRole } from './plus/saasRole';
|
|
|
77
77
|
export { default as SaasTeamMembers } from './plus/saasTeamMembers';
|
|
78
78
|
export type { SaasTeamMembersProps } from './plus/saasTeamMembers/type';
|
|
79
79
|
export { default as SaasAttendance } from './plus/saasAttendance';
|
|
80
|
+
export { default as PisellCashCounting } from './components/pisellCashCounting';
|
package/lib/index.js
CHANGED
|
@@ -77,6 +77,7 @@ __export(src_exports, {
|
|
|
77
77
|
POSOperatorAuth: () => import_admin.POSOperatorAuth,
|
|
78
78
|
PinModal: () => import_pinModal.default,
|
|
79
79
|
PinVerifyModal: () => import_pinVerifyModal.default,
|
|
80
|
+
PisellCashCounting: () => import_pisellCashCounting.default,
|
|
80
81
|
PisellSelectCustomerModal: () => import_pisellSelectCustomerModal.default,
|
|
81
82
|
ProNumberKeyboard: () => import_numberKeyboard.default,
|
|
82
83
|
ProNumberSelector: () => import_pisellNumberSelector.default,
|
|
@@ -196,6 +197,7 @@ var import_registry = __toESM(require("./components/systemSettings/registry"));
|
|
|
196
197
|
var import_saasRole = __toESM(require("./plus/saasRole"));
|
|
197
198
|
var import_saasTeamMembers = __toESM(require("./plus/saasTeamMembers"));
|
|
198
199
|
var import_saasAttendance = __toESM(require("./plus/saasAttendance"));
|
|
200
|
+
var import_pisellCashCounting = __toESM(require("./components/pisellCashCounting"));
|
|
199
201
|
import_dayjs.default.extend(import_weekday.default);
|
|
200
202
|
import_dayjs.default.extend(import_localeData.default);
|
|
201
203
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -248,6 +250,7 @@ import_dayjs.default.extend(import_localeData.default);
|
|
|
248
250
|
POSOperatorAuth,
|
|
249
251
|
PinModal,
|
|
250
252
|
PinVerifyModal,
|
|
253
|
+
PisellCashCounting,
|
|
251
254
|
PisellSelectCustomerModal,
|
|
252
255
|
ProNumberKeyboard,
|
|
253
256
|
ProNumberSelector,
|
|
@@ -68,7 +68,8 @@ var validatePhoneNumber = async (value, getText) => {
|
|
|
68
68
|
}
|
|
69
69
|
break;
|
|
70
70
|
case "1":
|
|
71
|
-
|
|
71
|
+
const usCanadaReg = /^[2-9]\d{2}[2-9]\d{6}$/;
|
|
72
|
+
if (!usCanadaReg.test(phone)) {
|
|
72
73
|
throw new Error(getText("pisell-phone-validation-us-canada"));
|
|
73
74
|
}
|
|
74
75
|
break;
|
|
@@ -78,7 +79,8 @@ var validatePhoneNumber = async (value, getText) => {
|
|
|
78
79
|
}
|
|
79
80
|
break;
|
|
80
81
|
case "61":
|
|
81
|
-
|
|
82
|
+
const auReg = /^0?[2-578]\d{8}$/;
|
|
83
|
+
if (!auReg.test(phone)) {
|
|
82
84
|
throw new Error(getText("pisell-phone-validation-australia"));
|
|
83
85
|
}
|
|
84
86
|
break;
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
declare global {
|
|
4
|
+
namespace JSX {
|
|
5
|
+
interface IntrinsicElements {
|
|
6
|
+
[elemName: string]: any;
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* 样式变体类型
|
|
12
|
+
* - separated: 分离式,按钮独立显示(默认)
|
|
13
|
+
* - capsule: 胶囊式,按钮和数字在一个圆角容器内
|
|
14
|
+
*/
|
|
15
|
+
export declare type NumericStepperVariant = 'separated' | 'capsule';
|
|
16
|
+
export interface NumericStepperProps {
|
|
17
|
+
/** 当前值 */
|
|
18
|
+
value?: number;
|
|
19
|
+
/** 默认值 */
|
|
20
|
+
defaultValue?: number;
|
|
21
|
+
/** 最小值 */
|
|
22
|
+
min?: number;
|
|
23
|
+
/** 最大值 */
|
|
24
|
+
max?: number;
|
|
25
|
+
/** 步长 */
|
|
26
|
+
step?: number;
|
|
27
|
+
/** 是否禁用 */
|
|
28
|
+
disabled?: boolean;
|
|
29
|
+
/** 值变化回调 */
|
|
30
|
+
onChange?: (value: number) => void;
|
|
31
|
+
/** 自定义类名 */
|
|
32
|
+
className?: string;
|
|
33
|
+
theme?: {
|
|
34
|
+
token?: {
|
|
35
|
+
colorPrimary?: string;
|
|
36
|
+
};
|
|
37
|
+
};
|
|
38
|
+
/** 自定义样式 */
|
|
39
|
+
styles?: {
|
|
40
|
+
container?: React.CSSProperties;
|
|
41
|
+
};
|
|
42
|
+
/** 值为 0 时是否折叠为仅展示加号(隐藏减号与中间数字) */
|
|
43
|
+
plusOnlyAtZero?: boolean;
|
|
44
|
+
horizontalPadding?: number | string;
|
|
45
|
+
/** 尺寸 */
|
|
46
|
+
size?: 'small' | 'middle' | 'large';
|
|
47
|
+
/** 按钮形状(仅在 variant='separated' 时生效) */
|
|
48
|
+
shape?: 'round' | 'square';
|
|
49
|
+
/** 减号按钮的自定义内容 */
|
|
50
|
+
minusIcon?: React.ReactNode;
|
|
51
|
+
/** 加号按钮的自定义内容 */
|
|
52
|
+
plusIcon?: React.ReactNode;
|
|
53
|
+
/**
|
|
54
|
+
* 样式变体
|
|
55
|
+
* - separated: 分离式,按钮独立显示(默认)
|
|
56
|
+
* - capsule: 胶囊式,按钮和数字在一个圆角容器内
|
|
57
|
+
* @default 'separated'
|
|
58
|
+
*/
|
|
59
|
+
variant?: NumericStepperVariant;
|
|
60
|
+
/**
|
|
61
|
+
* 是否启用输入功能(点击数字弹出键盘)
|
|
62
|
+
* - 开启时:展示区域 cursor 为 pointer,点击弹出键盘
|
|
63
|
+
* - 关闭后:展示区域无边框,点击不会弹出键盘
|
|
64
|
+
* @default true
|
|
65
|
+
*/
|
|
66
|
+
enableInput?: boolean;
|
|
67
|
+
/**
|
|
68
|
+
* 展示区域最大宽度(仅胶囊模式生效)
|
|
69
|
+
* - 设置后:展示区域最大宽度受限,超出部分截断
|
|
70
|
+
* - 不设置:展示区域宽度随内容自适应
|
|
71
|
+
*/
|
|
72
|
+
displayMaxWidth?: number | string;
|
|
73
|
+
}
|
|
74
|
+
declare const NumericStepper: React.FC<NumericStepperProps>;
|
|
75
|
+
export default NumericStepper;
|
|
@@ -0,0 +1,338 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
|
|
29
|
+
// src/pro/NumericStepper/index.tsx
|
|
30
|
+
var NumericStepper_exports = {};
|
|
31
|
+
__export(NumericStepper_exports, {
|
|
32
|
+
default: () => NumericStepper_default
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(NumericStepper_exports);
|
|
35
|
+
var React = __toESM(require("react"));
|
|
36
|
+
var import_react = require("react");
|
|
37
|
+
var import_classnames = __toESM(require("classnames"));
|
|
38
|
+
var import_utils = require("@pisell/utils");
|
|
39
|
+
var import_keyboards = require("../keyboards");
|
|
40
|
+
var import_useThemeTokens = __toESM(require("../../hooks/useThemeTokens"));
|
|
41
|
+
var import_index = require("./index.less");
|
|
42
|
+
var NumericStepper = ({
|
|
43
|
+
value,
|
|
44
|
+
defaultValue = 0,
|
|
45
|
+
min = 0,
|
|
46
|
+
max = Infinity,
|
|
47
|
+
step = 1,
|
|
48
|
+
disabled = false,
|
|
49
|
+
onChange,
|
|
50
|
+
className,
|
|
51
|
+
styles,
|
|
52
|
+
size = "middle",
|
|
53
|
+
shape = "round",
|
|
54
|
+
minusIcon,
|
|
55
|
+
plusIcon,
|
|
56
|
+
horizontalPadding = 0,
|
|
57
|
+
variant = "separated",
|
|
58
|
+
enableInput = true,
|
|
59
|
+
displayMaxWidth,
|
|
60
|
+
theme,
|
|
61
|
+
plusOnlyAtZero = true
|
|
62
|
+
}) => {
|
|
63
|
+
const [open, setOpen] = (0, import_react.useState)(false);
|
|
64
|
+
const [internalValue, setInternalValue] = (0, import_react.useState)(
|
|
65
|
+
value !== void 0 ? value : defaultValue
|
|
66
|
+
);
|
|
67
|
+
const _isMobile = (0, import_react.useMemo)(() => (0, import_utils.isMobile)(), [import_utils.isMobile]);
|
|
68
|
+
const { colorPrimary } = (0, import_useThemeTokens.default)(theme);
|
|
69
|
+
const [tempValue, setTempValue] = (0, import_react.useState)("");
|
|
70
|
+
const currentValue = value !== void 0 ? value : internalValue;
|
|
71
|
+
(0, import_react.useEffect)(() => {
|
|
72
|
+
if (value !== void 0) {
|
|
73
|
+
setInternalValue(value);
|
|
74
|
+
}
|
|
75
|
+
}, [value]);
|
|
76
|
+
const handleValueChange = (0, import_react.useCallback)(
|
|
77
|
+
(newValue) => {
|
|
78
|
+
const clampedValue = Math.max(min, Math.min(max, newValue));
|
|
79
|
+
if (value === void 0) {
|
|
80
|
+
setInternalValue(clampedValue);
|
|
81
|
+
}
|
|
82
|
+
onChange == null ? void 0 : onChange(clampedValue);
|
|
83
|
+
},
|
|
84
|
+
[min, max, value, onChange]
|
|
85
|
+
);
|
|
86
|
+
const handleDecrease = (0, import_react.useCallback)(() => {
|
|
87
|
+
if (disabled) return;
|
|
88
|
+
const newValue = currentValue - step;
|
|
89
|
+
if (newValue >= min) {
|
|
90
|
+
handleValueChange(newValue);
|
|
91
|
+
}
|
|
92
|
+
}, [currentValue, step, min, disabled, handleValueChange]);
|
|
93
|
+
const handleIncrease = (0, import_react.useCallback)(() => {
|
|
94
|
+
if (disabled) return;
|
|
95
|
+
if (currentValue < min) {
|
|
96
|
+
handleValueChange(min);
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
const newValue = currentValue + step;
|
|
100
|
+
if (newValue <= max) {
|
|
101
|
+
handleValueChange(newValue);
|
|
102
|
+
}
|
|
103
|
+
}, [currentValue, step, min, max, disabled, handleValueChange]);
|
|
104
|
+
const handleChange = (e) => {
|
|
105
|
+
if (!e) {
|
|
106
|
+
setTempValue(min.toString());
|
|
107
|
+
return;
|
|
108
|
+
}
|
|
109
|
+
if (e === "delete") {
|
|
110
|
+
const newTempValue = tempValue.slice(0, -1);
|
|
111
|
+
setTempValue(newTempValue || "0");
|
|
112
|
+
return;
|
|
113
|
+
} else if (e === "verify") {
|
|
114
|
+
const newValue = parseInt(tempValue) || 0;
|
|
115
|
+
const clampedValue = Math.max(min, Math.min(max, newValue));
|
|
116
|
+
onChange == null ? void 0 : onChange(clampedValue);
|
|
117
|
+
setOpen(false);
|
|
118
|
+
return;
|
|
119
|
+
} else {
|
|
120
|
+
setTempValue(e);
|
|
121
|
+
}
|
|
122
|
+
};
|
|
123
|
+
const handleNumberClick = () => {
|
|
124
|
+
if (disabled || !enableInput) return;
|
|
125
|
+
setTempValue(currentValue.toString());
|
|
126
|
+
if (_isMobile) {
|
|
127
|
+
setOpen(true);
|
|
128
|
+
}
|
|
129
|
+
};
|
|
130
|
+
const handleOpenChange = (visible) => {
|
|
131
|
+
setOpen(visible);
|
|
132
|
+
if (visible) {
|
|
133
|
+
setTempValue(currentValue.toString());
|
|
134
|
+
} else {
|
|
135
|
+
const tempNumber = parseInt(tempValue) || 0;
|
|
136
|
+
const clampedValue = Math.max(min, Math.min(max, tempNumber));
|
|
137
|
+
if (clampedValue !== value) {
|
|
138
|
+
onChange == null ? void 0 : onChange(clampedValue);
|
|
139
|
+
}
|
|
140
|
+
setTempValue(currentValue.toString());
|
|
141
|
+
}
|
|
142
|
+
};
|
|
143
|
+
const isDecreaseDisabled = disabled || currentValue <= min;
|
|
144
|
+
const isIncreaseDisabled = disabled || currentValue >= max;
|
|
145
|
+
const isPlusOnly = variant === "capsule" ? false : Boolean(
|
|
146
|
+
plusOnlyAtZero && (currentValue === 0 || currentValue === void 0)
|
|
147
|
+
);
|
|
148
|
+
const outOfRange = currentValue < min || currentValue > max;
|
|
149
|
+
const stepperClasses = (0, import_classnames.default)(
|
|
150
|
+
"numeric-stepper",
|
|
151
|
+
`numeric-stepper-${size}`,
|
|
152
|
+
`numeric-stepper-${variant}`,
|
|
153
|
+
{
|
|
154
|
+
// shape 仅在分离式下生效
|
|
155
|
+
[`numeric-stepper-${shape}`]: variant === "separated",
|
|
156
|
+
"numeric-stepper-disabled": disabled,
|
|
157
|
+
"numeric-stepper-simple": currentValue === 0 || currentValue === void 0,
|
|
158
|
+
"numeric-stepper-out-of-range": outOfRange,
|
|
159
|
+
"numeric-stepper-plus-only": isPlusOnly,
|
|
160
|
+
"numeric-stepper-input-disabled": !enableInput
|
|
161
|
+
},
|
|
162
|
+
className
|
|
163
|
+
);
|
|
164
|
+
const _minus = !isPlusOnly && /* @__PURE__ */ React.createElement(
|
|
165
|
+
"div",
|
|
166
|
+
{
|
|
167
|
+
className: "numeric-stepper-button-wrapper numeric-stepper-minus-button-wrapper",
|
|
168
|
+
onClick: handleDecrease,
|
|
169
|
+
style: {
|
|
170
|
+
paddingLeft: horizontalPadding
|
|
171
|
+
}
|
|
172
|
+
},
|
|
173
|
+
/* @__PURE__ */ React.createElement(
|
|
174
|
+
"button",
|
|
175
|
+
{
|
|
176
|
+
type: "button",
|
|
177
|
+
className: (0, import_classnames.default)(
|
|
178
|
+
"numeric-stepper-button",
|
|
179
|
+
"numeric-stepper-minus",
|
|
180
|
+
{
|
|
181
|
+
"numeric-stepper-button-disabled": isDecreaseDisabled
|
|
182
|
+
}
|
|
183
|
+
),
|
|
184
|
+
disabled: isDecreaseDisabled
|
|
185
|
+
},
|
|
186
|
+
minusIcon || /* @__PURE__ */ React.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ React.createElement(
|
|
187
|
+
"path",
|
|
188
|
+
{
|
|
189
|
+
d: "M3 8h10",
|
|
190
|
+
stroke: "currentColor",
|
|
191
|
+
strokeWidth: "1.5",
|
|
192
|
+
strokeLinecap: "round"
|
|
193
|
+
}
|
|
194
|
+
))
|
|
195
|
+
)
|
|
196
|
+
);
|
|
197
|
+
const _display = (0, import_react.useMemo)(() => {
|
|
198
|
+
if (isPlusOnly) {
|
|
199
|
+
return null;
|
|
200
|
+
}
|
|
201
|
+
const displayWrapperStyle = variant === "capsule" && displayMaxWidth ? {
|
|
202
|
+
maxWidth: typeof displayMaxWidth === "number" ? `${displayMaxWidth}px` : displayMaxWidth
|
|
203
|
+
} : {};
|
|
204
|
+
const displayElement = /* @__PURE__ */ React.createElement(
|
|
205
|
+
"span",
|
|
206
|
+
{
|
|
207
|
+
className: "numeric-stepper-display-wrapper",
|
|
208
|
+
onClick: handleNumberClick,
|
|
209
|
+
style: displayWrapperStyle
|
|
210
|
+
},
|
|
211
|
+
/* @__PURE__ */ React.createElement("span", { className: (0, import_classnames.default)("numeric-stepper-display") }, currentValue)
|
|
212
|
+
);
|
|
213
|
+
if (!enableInput) {
|
|
214
|
+
return displayElement;
|
|
215
|
+
}
|
|
216
|
+
if (_isMobile) {
|
|
217
|
+
return displayElement;
|
|
218
|
+
}
|
|
219
|
+
return /* @__PURE__ */ React.createElement(
|
|
220
|
+
import_keyboards.NumberKeyboard,
|
|
221
|
+
{
|
|
222
|
+
max,
|
|
223
|
+
min,
|
|
224
|
+
originalValue: currentValue.toString(),
|
|
225
|
+
defaultValue: currentValue.toString(),
|
|
226
|
+
onEnter: (newValue) => {
|
|
227
|
+
handleValueChange == null ? void 0 : handleValueChange(Number(newValue));
|
|
228
|
+
setOpen(false);
|
|
229
|
+
},
|
|
230
|
+
containerProps: {
|
|
231
|
+
className: "numeric-stepper-keyboard-popover",
|
|
232
|
+
renderType: "popover",
|
|
233
|
+
open,
|
|
234
|
+
onOpenChange: handleOpenChange,
|
|
235
|
+
content: /* @__PURE__ */ React.createElement(
|
|
236
|
+
import_keyboards.NumberKeyboard,
|
|
237
|
+
{
|
|
238
|
+
max,
|
|
239
|
+
min,
|
|
240
|
+
originalValue: currentValue.toString(),
|
|
241
|
+
defaultValue: currentValue.toString(),
|
|
242
|
+
onEnter: (newValue) => {
|
|
243
|
+
handleValueChange == null ? void 0 : handleValueChange(Number(newValue));
|
|
244
|
+
setOpen(false);
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
)
|
|
248
|
+
}
|
|
249
|
+
},
|
|
250
|
+
displayElement
|
|
251
|
+
);
|
|
252
|
+
}, [
|
|
253
|
+
_isMobile,
|
|
254
|
+
open,
|
|
255
|
+
isPlusOnly,
|
|
256
|
+
currentValue,
|
|
257
|
+
handleNumberClick,
|
|
258
|
+
handleOpenChange,
|
|
259
|
+
handleChange,
|
|
260
|
+
max,
|
|
261
|
+
min,
|
|
262
|
+
onChange,
|
|
263
|
+
tempValue,
|
|
264
|
+
enableInput,
|
|
265
|
+
variant,
|
|
266
|
+
displayMaxWidth
|
|
267
|
+
]);
|
|
268
|
+
const _plus = /* @__PURE__ */ React.createElement(
|
|
269
|
+
"div",
|
|
270
|
+
{
|
|
271
|
+
className: "numeric-stepper-button-wrapper numeric-stepper-plus-button-wrapper",
|
|
272
|
+
onClick: handleIncrease,
|
|
273
|
+
style: {
|
|
274
|
+
paddingLeft: isPlusOnly ? horizontalPadding : 0,
|
|
275
|
+
paddingRight: horizontalPadding
|
|
276
|
+
}
|
|
277
|
+
},
|
|
278
|
+
/* @__PURE__ */ React.createElement(
|
|
279
|
+
"button",
|
|
280
|
+
{
|
|
281
|
+
type: "button",
|
|
282
|
+
className: (0, import_classnames.default)(
|
|
283
|
+
"numeric-stepper-button",
|
|
284
|
+
"numeric-stepper-plus",
|
|
285
|
+
{
|
|
286
|
+
"numeric-stepper-button-disabled": isIncreaseDisabled
|
|
287
|
+
}
|
|
288
|
+
),
|
|
289
|
+
disabled: isIncreaseDisabled
|
|
290
|
+
},
|
|
291
|
+
plusIcon || /* @__PURE__ */ React.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ React.createElement(
|
|
292
|
+
"path",
|
|
293
|
+
{
|
|
294
|
+
d: "M8 3v10M3 8h10",
|
|
295
|
+
stroke: "currentColor",
|
|
296
|
+
strokeWidth: "1.5",
|
|
297
|
+
strokeLinecap: "round"
|
|
298
|
+
}
|
|
299
|
+
))
|
|
300
|
+
)
|
|
301
|
+
);
|
|
302
|
+
return /* @__PURE__ */ React.createElement(
|
|
303
|
+
"div",
|
|
304
|
+
{
|
|
305
|
+
className: stepperClasses,
|
|
306
|
+
style: {
|
|
307
|
+
...(styles == null ? void 0 : styles.container) || {},
|
|
308
|
+
["--color-primary"]: colorPrimary
|
|
309
|
+
},
|
|
310
|
+
onClick: (e) => e.stopPropagation()
|
|
311
|
+
},
|
|
312
|
+
_minus,
|
|
313
|
+
_display,
|
|
314
|
+
_plus,
|
|
315
|
+
_isMobile && /* @__PURE__ */ React.createElement(
|
|
316
|
+
import_keyboards.NumberKeyboard,
|
|
317
|
+
{
|
|
318
|
+
containerProps: {
|
|
319
|
+
className: "numeric-stepper-keyboard-modal",
|
|
320
|
+
renderType: "modal",
|
|
321
|
+
open,
|
|
322
|
+
onCancel: () => {
|
|
323
|
+
setOpen(false);
|
|
324
|
+
}
|
|
325
|
+
},
|
|
326
|
+
max,
|
|
327
|
+
min,
|
|
328
|
+
defaultValue: currentValue.toString(),
|
|
329
|
+
originalValue: currentValue.toString(),
|
|
330
|
+
onEnter: (newValue) => {
|
|
331
|
+
handleValueChange == null ? void 0 : handleValueChange(Number(newValue));
|
|
332
|
+
setOpen(false);
|
|
333
|
+
}
|
|
334
|
+
}
|
|
335
|
+
)
|
|
336
|
+
);
|
|
337
|
+
};
|
|
338
|
+
var NumericStepper_default = NumericStepper;
|