@pisell/materials 6.4.7 → 6.4.9
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 +7 -7
- package/build/lowcode/preview.js +146 -146
- package/build/lowcode/render/default/view.css +1 -1
- package/build/lowcode/render/default/view.js +24 -23
- package/build/lowcode/view.css +1 -1
- package/build/lowcode/view.js +25 -24
- package/es/components/auto-resize-text/auto-text-size-standalone.d.ts +20 -0
- package/es/components/auto-resize-text/auto-text-size-standalone.js +258 -0
- package/es/components/auto-resize-text/index.d.ts +6 -0
- package/es/components/auto-resize-text/index.js +40 -0
- package/es/components/dataSourceComponents/dataSourceTable/BaseTable.js +11 -4
- package/es/components/dataSourceComponents/dataSourceTable/filter/index.d.ts +1 -0
- package/es/components/dataSourceComponents/dataSourceTable/filter/index.js +7 -2
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +6 -7
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.js +11 -4
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableQuery.d.ts +2 -1
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableQuery.js +92 -6
- package/es/components/dataSourceComponents/dataSourceTable/type.d.ts +5 -0
- package/es/components/filter/types.d.ts +2 -0
- package/es/components/keyboard/index.d.ts +22 -0
- package/es/components/keyboard/index.js +159 -0
- package/es/components/keyboard/index.less +44 -0
- package/es/components/pisellQRScanner/index.d.ts +0 -13
- package/es/components/pisellQRScanner/index.js +0 -8
- package/es/components/pisellWalletPassCard/index.d.ts +1 -1
- package/es/components/pisellWalletPassCard/index.js +2 -1
- package/es/components/productCard/cartSkuCard/components/packages/utils.d.ts +1 -1
- package/es/components/productCard/cartSkuCard/components/swipeAction/index.d.ts +1 -0
- package/es/components/productCard/cartSkuCard/components/swipeAction/index.js +73 -5
- package/es/components/productCard/cartSkuCard/components/swipeAction/index.less +39 -0
- package/es/components/productCard/cartSkuCard/index.js +2 -11
- package/es/components/productCard/components/Packages/utils.d.ts +1 -1
- package/es/components/table/Table/utils.d.ts +1 -1
- package/es/components/table/Table/utils.js +22 -1
- package/es/components/table/hooks/useTableSetting.d.ts +3 -4
- package/es/components/table/hooks/useTableSetting.js +113 -5
- package/es/components/table/index.js +14 -3
- package/es/components/table/types.d.ts +17 -0
- package/es/components/virtual-keyboard/BaseNumberKeyboard/Presets.d.ts +5 -1
- package/es/components/virtual-keyboard/BaseNumberKeyboard/Presets.js +21 -7
- package/es/components/virtual-keyboard/BaseNumberKeyboard/Presets.less +9 -5
- package/es/components/virtual-keyboard/BaseNumberKeyboard/index.d.ts +4 -0
- package/es/components/virtual-keyboard/BaseNumberKeyboard/index.js +44 -25
- package/es/components/virtualInput/BaseVirtualInput/index.d.ts +40 -0
- package/es/components/virtualInput/BaseVirtualInput/index.js +163 -0
- package/es/components/virtualInput/BaseVirtualInput/index.less +78 -0
- package/es/components/virtualInput/index.d.ts +24 -0
- package/es/components/virtualInput/index.js +60 -0
- package/es/components/virtualInput/index.less +42 -0
- package/es/index.d.ts +2 -0
- package/es/index.js +3 -1
- package/es/locales/en-US.d.ts +1 -0
- package/es/locales/en-US.js +1 -0
- package/es/locales/zh-CN.d.ts +1 -0
- package/es/locales/zh-CN.js +1 -0
- package/es/locales/zh-TW.d.ts +1 -0
- package/es/locales/zh-TW.js +1 -0
- package/es/utils/platform.d.ts +1 -1
- package/lib/components/auto-resize-text/auto-text-size-standalone.d.ts +20 -0
- package/lib/components/auto-resize-text/auto-text-size-standalone.js +273 -0
- package/lib/components/auto-resize-text/index.d.ts +6 -0
- package/lib/components/auto-resize-text/index.js +71 -0
- package/lib/components/dataSourceComponents/dataSourceTable/BaseTable.js +8 -2
- package/lib/components/dataSourceComponents/dataSourceTable/filter/index.d.ts +1 -0
- package/lib/components/dataSourceComponents/dataSourceTable/filter/index.js +7 -2
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +6 -7
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.js +11 -4
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableQuery.d.ts +2 -1
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableQuery.js +78 -7
- package/lib/components/dataSourceComponents/dataSourceTable/type.d.ts +5 -0
- package/lib/components/filter/types.d.ts +2 -0
- package/lib/components/keyboard/index.d.ts +22 -0
- package/lib/components/keyboard/index.js +223 -0
- package/lib/components/keyboard/index.less +44 -0
- package/lib/components/pisellQRScanner/index.d.ts +0 -13
- package/lib/components/pisellWalletPassCard/index.d.ts +1 -1
- package/lib/components/pisellWalletPassCard/index.js +2 -1
- package/lib/components/productCard/cartSkuCard/components/packages/utils.d.ts +1 -1
- package/lib/components/productCard/cartSkuCard/components/swipeAction/index.d.ts +1 -0
- package/lib/components/productCard/cartSkuCard/components/swipeAction/index.js +45 -11
- package/lib/components/productCard/cartSkuCard/components/swipeAction/index.less +39 -0
- package/lib/components/productCard/cartSkuCard/index.js +2 -13
- package/lib/components/productCard/components/Packages/utils.d.ts +1 -1
- package/lib/components/table/Table/utils.d.ts +1 -1
- package/lib/components/table/Table/utils.js +18 -1
- package/lib/components/table/hooks/useTableSetting.d.ts +3 -4
- package/lib/components/table/hooks/useTableSetting.js +114 -4
- package/lib/components/table/index.js +12 -1
- package/lib/components/table/types.d.ts +17 -0
- package/lib/components/virtual-keyboard/BaseNumberKeyboard/Presets.d.ts +5 -1
- package/lib/components/virtual-keyboard/BaseNumberKeyboard/Presets.js +19 -2
- package/lib/components/virtual-keyboard/BaseNumberKeyboard/Presets.less +9 -5
- package/lib/components/virtual-keyboard/BaseNumberKeyboard/index.d.ts +4 -0
- package/lib/components/virtual-keyboard/BaseNumberKeyboard/index.js +45 -27
- package/lib/components/virtualInput/BaseVirtualInput/index.d.ts +40 -0
- package/lib/components/virtualInput/BaseVirtualInput/index.js +179 -0
- package/lib/components/virtualInput/BaseVirtualInput/index.less +78 -0
- package/lib/components/virtualInput/index.d.ts +24 -0
- package/lib/components/virtualInput/index.js +102 -0
- package/lib/components/virtualInput/index.less +42 -0
- package/lib/index.d.ts +2 -0
- package/lib/index.js +6 -0
- package/lib/locales/en-US.d.ts +1 -0
- package/lib/locales/en-US.js +1 -0
- package/lib/locales/zh-CN.d.ts +1 -0
- package/lib/locales/zh-CN.js +1 -0
- package/lib/locales/zh-TW.d.ts +1 -0
- package/lib/locales/zh-TW.js +1 -0
- package/lib/utils/platform.d.ts +1 -1
- package/lowcode/data-source-table/meta.ts +239 -0
- package/lowcode/table/meta.ts +104 -0
- package/package.json +1 -1
- package/dist/umd/materials.min.css +0 -1
- package/dist/umd/materials.min.js +0 -1
- package/dist/umd/static/DotsSix.57d66266.svg +0 -1
- package/dist/umd/static/arrow-left.e542294f.svg +0 -1
- package/dist/umd/static/arrow-right.763f03e0.svg +0 -1
- package/dist/umd/static/filter-lines.04a54ae9.svg +0 -1
- package/dist/umd/static/help-circle.31c9be40.svg +0 -1
- package/dist/umd/static/switch-vertical-01.7ebe3ba8.svg +0 -1
|
@@ -1,6 +1,8 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
1
2
|
var __defProp = Object.defineProperty;
|
|
2
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
4
6
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
7
|
var __export = (target, all) => {
|
|
6
8
|
for (var name in all)
|
|
@@ -14,6 +16,14 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
14
16
|
}
|
|
15
17
|
return to;
|
|
16
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
|
+
));
|
|
17
27
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
28
|
|
|
19
29
|
// src/components/table/hooks/useTableSetting.ts
|
|
@@ -25,6 +35,7 @@ module.exports = __toCommonJS(useTableSetting_exports);
|
|
|
25
35
|
var import_react = require("react");
|
|
26
36
|
var import_utils = require("../Table/utils");
|
|
27
37
|
var import_ahooks = require("ahooks");
|
|
38
|
+
var import_react2 = __toESM(require("react"));
|
|
28
39
|
var useTableSetting = (params) => {
|
|
29
40
|
const {
|
|
30
41
|
tableId,
|
|
@@ -37,7 +48,8 @@ var useTableSetting = (params) => {
|
|
|
37
48
|
columns: propsColumns,
|
|
38
49
|
gallery,
|
|
39
50
|
currentSettingHash,
|
|
40
|
-
exportImport
|
|
51
|
+
exportImport,
|
|
52
|
+
localSettings
|
|
41
53
|
} = params;
|
|
42
54
|
const columnsMap = (0, import_react.useMemo)(() => {
|
|
43
55
|
return new Map(propsColumns.map((item) => [item.key, item]));
|
|
@@ -67,7 +79,8 @@ var useTableSetting = (params) => {
|
|
|
67
79
|
};
|
|
68
80
|
}, [gallery, columns]);
|
|
69
81
|
const localStorageSettingKeyArr = (0, import_react.useMemo)(() => {
|
|
70
|
-
|
|
82
|
+
var _a;
|
|
83
|
+
const keys = (0, import_utils.getSettingKeyArrByMode)({
|
|
71
84
|
filter,
|
|
72
85
|
columnSetting,
|
|
73
86
|
dataSourceGroup,
|
|
@@ -75,6 +88,12 @@ var useTableSetting = (params) => {
|
|
|
75
88
|
mode: "localStorage",
|
|
76
89
|
currentViewMode
|
|
77
90
|
});
|
|
91
|
+
if ((localSettings == null ? void 0 : localSettings.enable) && ((_a = localSettings.scope) == null ? void 0 : _a.includes("filters"))) {
|
|
92
|
+
if (!keys.includes("filters")) {
|
|
93
|
+
keys.push("filters");
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
return keys;
|
|
78
97
|
}, [tableId, filter, columnSetting, dataSourceGroup, sort, currentViewMode]);
|
|
79
98
|
const defaultKeyArr = (0, import_react.useMemo)(() => {
|
|
80
99
|
return (0, import_utils.getSettingKeyArrByMode)({
|
|
@@ -129,6 +148,8 @@ var useTableSetting = (params) => {
|
|
|
129
148
|
compactMode: ((_c = mergedSetting == null ? void 0 : mergedSetting[item]) == null ? void 0 : _c.compactMode) || defaultGalleryCoverSetting.compactMode,
|
|
130
149
|
isShowLabel: ((_d = mergedSetting == null ? void 0 : mergedSetting[item]) == null ? void 0 : _d.isShowLabel) ?? defaultGalleryCoverSetting.isShowLabel
|
|
131
150
|
};
|
|
151
|
+
} else if (item === "filters") {
|
|
152
|
+
setting[item] = (mergedSetting == null ? void 0 : mergedSetting[item]) || {};
|
|
132
153
|
} else {
|
|
133
154
|
setting[item] = mergedSetting == null ? void 0 : mergedSetting[item];
|
|
134
155
|
}
|
|
@@ -187,20 +208,109 @@ var useTableSetting = (params) => {
|
|
|
187
208
|
sortButtonShow
|
|
188
209
|
]);
|
|
189
210
|
const setTableSetting = (0, import_ahooks.useMemoizedFn)((values) => {
|
|
211
|
+
var _a;
|
|
212
|
+
let valuesForSave = values;
|
|
213
|
+
if ((localSettings == null ? void 0 : localSettings.enable) && ((_a = localSettings.scope) == null ? void 0 : _a.includes("filters"))) {
|
|
214
|
+
const excluded = new Set((localSettings == null ? void 0 : localSettings.excludedFilterFields) || []);
|
|
215
|
+
const filterValue = {};
|
|
216
|
+
((filter == null ? void 0 : filter.list) || []).forEach((item) => {
|
|
217
|
+
const rawName = item == null ? void 0 : item.name;
|
|
218
|
+
if (!rawName) return;
|
|
219
|
+
const key = Array.isArray(rawName) ? rawName.join(",") : String(rawName);
|
|
220
|
+
if (excluded.has(key)) return;
|
|
221
|
+
if (values.hasOwnProperty(key)) {
|
|
222
|
+
filterValue[key] = values[key];
|
|
223
|
+
}
|
|
224
|
+
});
|
|
225
|
+
valuesForSave = {
|
|
226
|
+
...values,
|
|
227
|
+
filters: filterValue
|
|
228
|
+
};
|
|
229
|
+
}
|
|
190
230
|
(0, import_utils.setFormValuesToLocalStorage)({
|
|
191
231
|
tableId,
|
|
192
|
-
allValues:
|
|
232
|
+
allValues: valuesForSave,
|
|
193
233
|
keys: localStorageSettingKeyArr,
|
|
194
234
|
currentViewMode,
|
|
195
235
|
currentSettingHash
|
|
196
236
|
});
|
|
197
237
|
});
|
|
198
238
|
const tableSetting = (0, import_react.useMemo)(() => {
|
|
199
|
-
|
|
239
|
+
var _a;
|
|
240
|
+
const merged = {
|
|
200
241
|
...tableLocalSetting,
|
|
201
242
|
...defaultTableSetting
|
|
202
243
|
};
|
|
244
|
+
if ((localSettings == null ? void 0 : localSettings.enable) && ((_a = localSettings.scope) == null ? void 0 : _a.includes("filters"))) {
|
|
245
|
+
const persistedFilter = tableLocalSetting == null ? void 0 : tableLocalSetting.filters;
|
|
246
|
+
if (persistedFilter && typeof persistedFilter === "object") {
|
|
247
|
+
return {
|
|
248
|
+
...merged,
|
|
249
|
+
...persistedFilter
|
|
250
|
+
};
|
|
251
|
+
}
|
|
252
|
+
}
|
|
253
|
+
return merged;
|
|
203
254
|
}, [tableLocalSetting, defaultTableSetting]);
|
|
255
|
+
(0, import_react.useMemo)(() => {
|
|
256
|
+
var _a;
|
|
257
|
+
try {
|
|
258
|
+
if (!tableId) return;
|
|
259
|
+
const current = (0, import_utils.getTableSettingByCurrentViewMode)(tableId, currentViewMode) || {};
|
|
260
|
+
const persistedFilters = (current == null ? void 0 : current.filters) || {};
|
|
261
|
+
let nextFilters = { ...persistedFilters };
|
|
262
|
+
let shouldUpdate = false;
|
|
263
|
+
const enableFiltersMemory = !!((localSettings == null ? void 0 : localSettings.enable) && ((_a = localSettings.scope) == null ? void 0 : _a.includes("filters")));
|
|
264
|
+
if (!enableFiltersMemory) {
|
|
265
|
+
if (Object.keys(persistedFilters || {}).length > 0) {
|
|
266
|
+
nextFilters = {};
|
|
267
|
+
shouldUpdate = true;
|
|
268
|
+
}
|
|
269
|
+
} else {
|
|
270
|
+
let names = /* @__PURE__ */ new Set();
|
|
271
|
+
if (import_react2.default.isValidElement(filter)) {
|
|
272
|
+
names = new Set(
|
|
273
|
+
((filter == null ? void 0 : filter.__items) || []).filter((item) => !item.isHidden).map((item) => {
|
|
274
|
+
const rawName = item == null ? void 0 : item.value;
|
|
275
|
+
if (!rawName) return void 0;
|
|
276
|
+
return Array.isArray(rawName) ? rawName.join(",") : String(rawName);
|
|
277
|
+
})
|
|
278
|
+
);
|
|
279
|
+
} else {
|
|
280
|
+
names = new Set(
|
|
281
|
+
((filter == null ? void 0 : filter.list) || []).map((item) => {
|
|
282
|
+
const rawName = item == null ? void 0 : item.name;
|
|
283
|
+
if (!rawName) return void 0;
|
|
284
|
+
return Array.isArray(rawName) ? rawName.join(",") : String(rawName);
|
|
285
|
+
}).filter(Boolean)
|
|
286
|
+
);
|
|
287
|
+
}
|
|
288
|
+
const excluded = new Set((localSettings == null ? void 0 : localSettings.excludedFilterFields) || []);
|
|
289
|
+
const allowed = new Set(Array.from(names).filter((k) => !excluded.has(k)));
|
|
290
|
+
const filtered = {};
|
|
291
|
+
Object.keys(persistedFilters || {}).forEach((k) => {
|
|
292
|
+
if (allowed.has(k)) {
|
|
293
|
+
filtered[k] = persistedFilters[k];
|
|
294
|
+
} else {
|
|
295
|
+
shouldUpdate = true;
|
|
296
|
+
}
|
|
297
|
+
});
|
|
298
|
+
if (Object.keys(filtered).length !== Object.keys(persistedFilters || {}).length) {
|
|
299
|
+
shouldUpdate = true;
|
|
300
|
+
}
|
|
301
|
+
nextFilters = filtered;
|
|
302
|
+
}
|
|
303
|
+
if (shouldUpdate) {
|
|
304
|
+
(0, import_utils.setTableSettingToLocalStorage)({
|
|
305
|
+
tableId,
|
|
306
|
+
tableSettingObj: { filters: nextFilters },
|
|
307
|
+
currentViewMode,
|
|
308
|
+
currentSettingHash
|
|
309
|
+
});
|
|
310
|
+
}
|
|
311
|
+
} catch (e) {
|
|
312
|
+
}
|
|
313
|
+
}, []);
|
|
204
314
|
return {
|
|
205
315
|
setTableSetting,
|
|
206
316
|
tableSetting
|
|
@@ -76,6 +76,7 @@ var GridView = (0, import_model.Provider)(
|
|
|
76
76
|
onValuesChange,
|
|
77
77
|
columnSetting,
|
|
78
78
|
dataSourceGroup: propsDataSourceGroup,
|
|
79
|
+
localSettings: _localSettings,
|
|
79
80
|
view = defaultView,
|
|
80
81
|
gallery,
|
|
81
82
|
currentSettingKey,
|
|
@@ -171,7 +172,8 @@ var GridView = (0, import_model.Provider)(
|
|
|
171
172
|
view,
|
|
172
173
|
currentViewMode,
|
|
173
174
|
gallery,
|
|
174
|
-
currentSettingHash
|
|
175
|
+
currentSettingHash,
|
|
176
|
+
localSettings: _localSettings
|
|
175
177
|
});
|
|
176
178
|
const getIsTriggerValuesChange = (0, import_useTriggerValuesChange.default)({
|
|
177
179
|
filter,
|
|
@@ -260,6 +262,15 @@ var GridView = (0, import_model.Provider)(
|
|
|
260
262
|
(0, import_react.useImperativeHandle)(ref, () => {
|
|
261
263
|
if (wrapRef.current) {
|
|
262
264
|
wrapRef.current.formInstance = form;
|
|
265
|
+
wrapRef.current.getCachedFilters = () => {
|
|
266
|
+
try {
|
|
267
|
+
if (!tableId) return {};
|
|
268
|
+
const setting = (0, import_utils.getTableSettingByCurrentViewMode)(tableId, currentViewMode);
|
|
269
|
+
return (setting == null ? void 0 : setting.filters) || {};
|
|
270
|
+
} catch (e) {
|
|
271
|
+
return {};
|
|
272
|
+
}
|
|
273
|
+
};
|
|
263
274
|
}
|
|
264
275
|
return wrapRef.current;
|
|
265
276
|
});
|
|
@@ -191,6 +191,21 @@ export declare type ExportImportType = {
|
|
|
191
191
|
apiUrl?: ApiProps;
|
|
192
192
|
otherParams?: any;
|
|
193
193
|
};
|
|
194
|
+
/**
|
|
195
|
+
* 设置记忆范围
|
|
196
|
+
*/
|
|
197
|
+
export declare type LocalSettingsScope = "filters" | "sorting" | "columns";
|
|
198
|
+
/**
|
|
199
|
+
* 本地记忆设置
|
|
200
|
+
*/
|
|
201
|
+
export declare type LocalSettingsType = {
|
|
202
|
+
/** 启用设置记忆 */
|
|
203
|
+
enable: boolean;
|
|
204
|
+
/** 记忆范围 */
|
|
205
|
+
scope: LocalSettingsScope[];
|
|
206
|
+
/** 不需要记忆的筛选字段(当 scope 包含 filters 时生效) */
|
|
207
|
+
excludedFilterFields?: string[];
|
|
208
|
+
};
|
|
194
209
|
export declare type GridViewProps = {
|
|
195
210
|
columns: any;
|
|
196
211
|
dataSource: any[];
|
|
@@ -247,5 +262,7 @@ export declare type GridViewProps = {
|
|
|
247
262
|
sortBy?: string;
|
|
248
263
|
}[];
|
|
249
264
|
};
|
|
265
|
+
/** 本地记忆设置 */
|
|
266
|
+
localSettings?: LocalSettingsType;
|
|
250
267
|
};
|
|
251
268
|
export {};
|
|
@@ -1,7 +1,11 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './Presets.less';
|
|
2
3
|
export declare type PresetsItem = {
|
|
3
4
|
label: string;
|
|
4
5
|
value: number | string;
|
|
6
|
+
style?: React.CSSProperties;
|
|
7
|
+
onClick?: (item: PresetsItem, _next: () => void) => void;
|
|
8
|
+
render?: (item: PresetsItem) => React.ReactNode;
|
|
5
9
|
};
|
|
6
10
|
export interface PresetsProps {
|
|
7
11
|
presets?: PresetsItem[];
|
|
@@ -36,11 +36,28 @@ var import_react = __toESM(require("react"));
|
|
|
36
36
|
var import_Presets = require("./Presets.less");
|
|
37
37
|
var Presets = (props) => {
|
|
38
38
|
const { presets, onChange } = props;
|
|
39
|
+
const handleItemClick = (item) => {
|
|
40
|
+
if (item.onClick) {
|
|
41
|
+
const _next = () => onChange(`${item.value}`);
|
|
42
|
+
item.onClick(item, _next);
|
|
43
|
+
} else {
|
|
44
|
+
onChange(`${item.value}`);
|
|
45
|
+
}
|
|
46
|
+
};
|
|
39
47
|
return (0, import_react.useMemo)(() => {
|
|
40
48
|
if (!(presets == null ? void 0 : presets.length)) {
|
|
41
49
|
return null;
|
|
42
50
|
}
|
|
43
|
-
return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-virtual-keyboard-preset" }, presets.map((item
|
|
44
|
-
|
|
51
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-virtual-keyboard-preset" }, presets.map((item, index) => {
|
|
52
|
+
var _a;
|
|
53
|
+
const itemProps = {
|
|
54
|
+
key: index,
|
|
55
|
+
className: "pisell-virtual-keyboard-preset-item",
|
|
56
|
+
style: item.style,
|
|
57
|
+
onClick: () => handleItemClick(item)
|
|
58
|
+
};
|
|
59
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { ...itemProps }, ((_a = item.render) == null ? void 0 : _a.call(item, item)) || item.label);
|
|
60
|
+
}));
|
|
61
|
+
}, [presets, onChange]);
|
|
45
62
|
};
|
|
46
63
|
var Presets_default = Presets;
|
|
@@ -1,18 +1,22 @@
|
|
|
1
1
|
.pisell-virtual-keyboard-preset {
|
|
2
|
-
display:
|
|
2
|
+
display: grid;
|
|
3
|
+
grid-template-columns: repeat(4, 1fr);
|
|
3
4
|
gap: 7px;
|
|
4
|
-
flex-wrap: wrap;
|
|
5
5
|
margin-bottom: 8px;
|
|
6
|
+
|
|
6
7
|
.pisell-virtual-keyboard-preset-item {
|
|
7
8
|
display: flex;
|
|
8
|
-
flex: 1;
|
|
9
9
|
padding: 12px 20px;
|
|
10
10
|
align-items: center;
|
|
11
11
|
justify-content: center;
|
|
12
|
-
height:
|
|
12
|
+
height: 40px;
|
|
13
13
|
border-radius: 8px;
|
|
14
|
-
border: 1px solid var(--Gray-300, #
|
|
14
|
+
border: 1px solid var(--Gray-300, #E9D7FE);
|
|
15
15
|
box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
|
|
16
16
|
background: var(--Primary-25, #FCFAFF);
|
|
17
|
+
font-weight: 600;
|
|
18
|
+
color: #6941C6;
|
|
19
|
+
cursor: pointer;
|
|
20
|
+
position: relative;
|
|
17
21
|
}
|
|
18
22
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { PresetsProps } from './Presets';
|
|
3
|
+
import { KeyboardProps } from '../Keyboard';
|
|
3
4
|
import { RightItemsStyleProps } from '../Amount';
|
|
4
5
|
import './index.less';
|
|
5
6
|
export interface BaseNumberKeyboardProps {
|
|
@@ -16,6 +17,9 @@ export interface BaseNumberKeyboardProps {
|
|
|
16
17
|
presets?: PresetsProps['presets'];
|
|
17
18
|
defaultSelect?: boolean;
|
|
18
19
|
rightItemsStyle?: RightItemsStyleProps;
|
|
20
|
+
customDisplay?: React.ReactNode | ((props: any) => React.ReactNode);
|
|
21
|
+
keyboardProps?: KeyboardProps;
|
|
22
|
+
style?: React.CSSProperties;
|
|
19
23
|
}
|
|
20
24
|
declare const BaseNumberKeyboard: (props: BaseNumberKeyboardProps) => JSX.Element;
|
|
21
25
|
export default BaseNumberKeyboard;
|
|
@@ -128,7 +128,9 @@ var BaseNumberKeyboard = (props) => {
|
|
|
128
128
|
onEnter,
|
|
129
129
|
presets,
|
|
130
130
|
defaultSelect,
|
|
131
|
-
rightItemsStyle
|
|
131
|
+
rightItemsStyle,
|
|
132
|
+
customDisplay,
|
|
133
|
+
style
|
|
132
134
|
} = props;
|
|
133
135
|
const [value, setValue] = (0, import_ahooks.useControllableValue)(props, {
|
|
134
136
|
defaultValue
|
|
@@ -200,6 +202,8 @@ var BaseNumberKeyboard = (props) => {
|
|
|
200
202
|
}
|
|
201
203
|
};
|
|
202
204
|
const handleChangeValue = (val) => {
|
|
205
|
+
var _a;
|
|
206
|
+
val = typeof val === "string" ? val : ((_a = val == null ? void 0 : val.target) == null ? void 0 : _a.value) || "";
|
|
203
207
|
const detail = checkValue(val);
|
|
204
208
|
if (detail) return;
|
|
205
209
|
setValue(val);
|
|
@@ -228,38 +232,52 @@ var BaseNumberKeyboard = (props) => {
|
|
|
228
232
|
const handleKeyboardChange = (0, import_ahooks.useMemoizedFn)((val) => {
|
|
229
233
|
return (actions[val] || actions.default)(val);
|
|
230
234
|
});
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
import_VirtualInput.default,
|
|
240
|
-
{
|
|
241
|
-
autoFocus: true,
|
|
242
|
-
placeholder,
|
|
243
|
-
value: props2.value
|
|
244
|
-
}
|
|
245
|
-
);
|
|
246
|
-
}
|
|
247
|
-
return (format == null ? void 0 : format(props2.value)) || props2.value;
|
|
248
|
-
},
|
|
249
|
-
showDelete: false,
|
|
250
|
-
onValueSelect: setSelect,
|
|
251
|
-
defaultSelect,
|
|
252
|
-
style: {
|
|
253
|
-
backgroundColor: (rightItemsStyle == null ? void 0 : rightItemsStyle.buttonBackgroundColor) || "#fff",
|
|
254
|
-
color: (rightItemsStyle == null ? void 0 : rightItemsStyle.textColor) || "#000000"
|
|
235
|
+
const renderDisplayField = () => {
|
|
236
|
+
if (customDisplay) {
|
|
237
|
+
if (typeof customDisplay === "function") {
|
|
238
|
+
return customDisplay({
|
|
239
|
+
value,
|
|
240
|
+
onChange: handleChangeValue,
|
|
241
|
+
onValueSelect: setSelect
|
|
242
|
+
});
|
|
255
243
|
}
|
|
244
|
+
return customDisplay;
|
|
256
245
|
}
|
|
257
|
-
|
|
246
|
+
return /* @__PURE__ */ import_react.default.createElement(
|
|
247
|
+
import_VirtualKeyInput.default,
|
|
248
|
+
{
|
|
249
|
+
value,
|
|
250
|
+
onChange: (e) => handleChangeValue(e.target.value),
|
|
251
|
+
renderInput: (props2) => {
|
|
252
|
+
if ((0, import_utils.isUndefined)(props2.value) || props2.value === "") {
|
|
253
|
+
return /* @__PURE__ */ import_react.default.createElement(
|
|
254
|
+
import_VirtualInput.default,
|
|
255
|
+
{
|
|
256
|
+
autoFocus: true,
|
|
257
|
+
placeholder,
|
|
258
|
+
value: props2.value
|
|
259
|
+
}
|
|
260
|
+
);
|
|
261
|
+
}
|
|
262
|
+
return (format == null ? void 0 : format(props2.value)) || props2.value;
|
|
263
|
+
},
|
|
264
|
+
showDelete: false,
|
|
265
|
+
onValueSelect: setSelect,
|
|
266
|
+
defaultSelect,
|
|
267
|
+
style: {
|
|
268
|
+
backgroundColor: (rightItemsStyle == null ? void 0 : rightItemsStyle.buttonBackgroundColor) || "#fff",
|
|
269
|
+
color: (rightItemsStyle == null ? void 0 : rightItemsStyle.textColor) || "#000000"
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
);
|
|
273
|
+
};
|
|
274
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-virtual-keyboard-base", style }, renderDisplayField(), /* @__PURE__ */ import_react.default.createElement(import_Presets.default, { presets, onChange: handleChangeValue }), /* @__PURE__ */ import_react.default.createElement(
|
|
258
275
|
import_Keyboard.default,
|
|
259
276
|
{
|
|
260
277
|
items: itemsWithStyle,
|
|
261
278
|
rightItems,
|
|
262
|
-
onChange: handleKeyboardChange
|
|
279
|
+
onChange: handleKeyboardChange,
|
|
280
|
+
...props.keyboardProps || {}
|
|
263
281
|
}
|
|
264
282
|
));
|
|
265
283
|
};
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
export interface BaseVirtualInputProps {
|
|
4
|
+
/** 输入值 */
|
|
5
|
+
value?: string | React.ReactNode;
|
|
6
|
+
/** 占位符 */
|
|
7
|
+
placeholder?: string;
|
|
8
|
+
/** 是否自动聚焦 */
|
|
9
|
+
autoFocus?: boolean;
|
|
10
|
+
/** 是否禁用 */
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
/** 组件高度,默认60px */
|
|
13
|
+
height?: number | string;
|
|
14
|
+
/** 字体大小,默认48px,如果不设置会根据高度自动计算 */
|
|
15
|
+
fontSize?: number | string;
|
|
16
|
+
/** 聚焦回调 */
|
|
17
|
+
onFocus?: () => void;
|
|
18
|
+
/** 失焦回调 */
|
|
19
|
+
onBlur?: () => void;
|
|
20
|
+
/** 文字位置 */
|
|
21
|
+
textAlign?: 'start' | 'center' | 'end';
|
|
22
|
+
/** 自定义样式 */
|
|
23
|
+
style?: React.CSSProperties;
|
|
24
|
+
/** 自定义类名 */
|
|
25
|
+
className?: string;
|
|
26
|
+
/** showCursor */
|
|
27
|
+
showCursor?: boolean;
|
|
28
|
+
/** 防止失焦的元素选择器或ref */
|
|
29
|
+
preventBlurElements?: Array<string | React.RefObject<HTMLElement>>;
|
|
30
|
+
/** 是否聚焦(受控模式) */
|
|
31
|
+
focused?: boolean;
|
|
32
|
+
}
|
|
33
|
+
export interface BaseVirtualInputRef {
|
|
34
|
+
/** 手动聚焦 */
|
|
35
|
+
focus: () => void;
|
|
36
|
+
/** 手动失焦 */
|
|
37
|
+
blur: () => void;
|
|
38
|
+
}
|
|
39
|
+
declare const BaseVirtualInput: React.ForwardRefExoticComponent<BaseVirtualInputProps & React.RefAttributes<BaseVirtualInputRef>>;
|
|
40
|
+
export default BaseVirtualInput;
|
|
@@ -0,0 +1,179 @@
|
|
|
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/components/virtualInput/BaseVirtualInput/index.tsx
|
|
30
|
+
var BaseVirtualInput_exports = {};
|
|
31
|
+
__export(BaseVirtualInput_exports, {
|
|
32
|
+
default: () => BaseVirtualInput_default
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(BaseVirtualInput_exports);
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_classnames = __toESM(require("classnames"));
|
|
37
|
+
var import_auto_resize_text = __toESM(require("../../auto-resize-text"));
|
|
38
|
+
var import_index = require("./index.less");
|
|
39
|
+
var BaseVirtualInput = (0, import_react.forwardRef)(
|
|
40
|
+
(props, ref) => {
|
|
41
|
+
const {
|
|
42
|
+
value = "",
|
|
43
|
+
placeholder = "",
|
|
44
|
+
autoFocus = false,
|
|
45
|
+
disabled = false,
|
|
46
|
+
height = 60,
|
|
47
|
+
fontSize,
|
|
48
|
+
onFocus,
|
|
49
|
+
onBlur,
|
|
50
|
+
style,
|
|
51
|
+
className,
|
|
52
|
+
preventBlurElements = [],
|
|
53
|
+
focused,
|
|
54
|
+
showCursor = true
|
|
55
|
+
} = props;
|
|
56
|
+
const [localFocused, setLocalFocused] = (0, import_react.useState)(focused ?? autoFocus);
|
|
57
|
+
const internalFocused = "focused" in props ? props.focused : localFocused;
|
|
58
|
+
const containerRef = (0, import_react.useRef)(null);
|
|
59
|
+
const handleFocus = (0, import_react.useCallback)(() => {
|
|
60
|
+
if (disabled) return;
|
|
61
|
+
setLocalFocused(true);
|
|
62
|
+
onFocus == null ? void 0 : onFocus();
|
|
63
|
+
}, [disabled, onFocus]);
|
|
64
|
+
const handleBlur = (0, import_react.useCallback)(() => {
|
|
65
|
+
setLocalFocused(false);
|
|
66
|
+
onBlur == null ? void 0 : onBlur();
|
|
67
|
+
}, [onBlur]);
|
|
68
|
+
const shouldPreventBlur = (0, import_react.useCallback)(
|
|
69
|
+
(target) => {
|
|
70
|
+
if (!target || !(target instanceof Element)) return false;
|
|
71
|
+
return preventBlurElements.some((element) => {
|
|
72
|
+
if (typeof element === "string") {
|
|
73
|
+
const matchedElements = document.querySelectorAll(element);
|
|
74
|
+
return Array.from(matchedElements).some(
|
|
75
|
+
(el) => el.contains(target) || el === target
|
|
76
|
+
);
|
|
77
|
+
} else if (element && "current" in element && element.current) {
|
|
78
|
+
return element.current.contains(target);
|
|
79
|
+
}
|
|
80
|
+
return false;
|
|
81
|
+
});
|
|
82
|
+
},
|
|
83
|
+
[preventBlurElements]
|
|
84
|
+
);
|
|
85
|
+
(0, import_react.useEffect)(() => {
|
|
86
|
+
const handleGlobalClick = (event) => {
|
|
87
|
+
if (!internalFocused) return;
|
|
88
|
+
const target = event.target;
|
|
89
|
+
if (containerRef.current && containerRef.current.contains(target)) {
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
if (shouldPreventBlur(target)) {
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
handleBlur();
|
|
96
|
+
};
|
|
97
|
+
if (internalFocused) {
|
|
98
|
+
document.addEventListener("mousedown", handleGlobalClick);
|
|
99
|
+
}
|
|
100
|
+
return () => {
|
|
101
|
+
document.removeEventListener("mousedown", handleGlobalClick);
|
|
102
|
+
};
|
|
103
|
+
}, [internalFocused, handleBlur, shouldPreventBlur]);
|
|
104
|
+
const handleClick = (0, import_react.useCallback)(
|
|
105
|
+
(event) => {
|
|
106
|
+
handleFocus();
|
|
107
|
+
},
|
|
108
|
+
[handleFocus]
|
|
109
|
+
);
|
|
110
|
+
(0, import_react.useImperativeHandle)(
|
|
111
|
+
ref,
|
|
112
|
+
() => ({
|
|
113
|
+
focus: handleFocus,
|
|
114
|
+
blur: handleBlur
|
|
115
|
+
}),
|
|
116
|
+
[handleFocus, handleBlur]
|
|
117
|
+
);
|
|
118
|
+
const componentHeight = typeof height === "number" ? `${height}px` : height;
|
|
119
|
+
const getBaseFontSize = (0, import_react.useCallback)(() => {
|
|
120
|
+
if (fontSize) {
|
|
121
|
+
return typeof fontSize === "number" ? fontSize : parseFloat(fontSize);
|
|
122
|
+
}
|
|
123
|
+
return typeof height === "number" ? height * 0.8 : 48;
|
|
124
|
+
}, [fontSize, height]);
|
|
125
|
+
const baseFontSize = getBaseFontSize();
|
|
126
|
+
const minFontSize = Math.max(10, baseFontSize * 0.2);
|
|
127
|
+
const maxFontSize = baseFontSize;
|
|
128
|
+
const caretHeight = `calc(${componentHeight} * 0.67)`;
|
|
129
|
+
const mergedStyle = {
|
|
130
|
+
...style,
|
|
131
|
+
"--virtual-input-height": componentHeight,
|
|
132
|
+
"--virtual-input-caret-height": caretHeight,
|
|
133
|
+
"--virtual-input-font-size": `${baseFontSize}px`
|
|
134
|
+
};
|
|
135
|
+
const showPlaceholder = value === void 0 || value === "";
|
|
136
|
+
return /* @__PURE__ */ import_react.default.createElement(
|
|
137
|
+
"div",
|
|
138
|
+
{
|
|
139
|
+
ref: containerRef,
|
|
140
|
+
className: (0, import_classnames.default)(
|
|
141
|
+
"pisell-base-virtual-input",
|
|
142
|
+
{
|
|
143
|
+
"pisell-base-virtual-input--focused": internalFocused,
|
|
144
|
+
"pisell-base-virtual-input--disabled": disabled
|
|
145
|
+
},
|
|
146
|
+
className
|
|
147
|
+
),
|
|
148
|
+
style: mergedStyle,
|
|
149
|
+
onClick: handleClick
|
|
150
|
+
},
|
|
151
|
+
showPlaceholder && /* @__PURE__ */ import_react.default.createElement(
|
|
152
|
+
import_auto_resize_text.default,
|
|
153
|
+
{
|
|
154
|
+
className: "pisell-base-virtual-input-placeholder",
|
|
155
|
+
mode: "oneline",
|
|
156
|
+
minFontSizePx: minFontSize,
|
|
157
|
+
maxFontSizePx: maxFontSize,
|
|
158
|
+
fontSizePrecisionPx: 0.5
|
|
159
|
+
},
|
|
160
|
+
placeholder
|
|
161
|
+
),
|
|
162
|
+
!!value && /* @__PURE__ */ import_react.default.createElement(
|
|
163
|
+
import_auto_resize_text.default,
|
|
164
|
+
{
|
|
165
|
+
className: "pisell-base-virtual-input-value",
|
|
166
|
+
mode: "oneline",
|
|
167
|
+
minFontSizePx: minFontSize,
|
|
168
|
+
maxFontSizePx: maxFontSize,
|
|
169
|
+
fontSizePrecisionPx: 0.5,
|
|
170
|
+
scrollToEnd: true
|
|
171
|
+
},
|
|
172
|
+
value
|
|
173
|
+
),
|
|
174
|
+
/* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-base-virtual-input-caret-container" }, internalFocused && !disabled && showCursor && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-base-virtual-input-caret" }))
|
|
175
|
+
);
|
|
176
|
+
}
|
|
177
|
+
);
|
|
178
|
+
BaseVirtualInput.displayName = "BaseVirtualInput";
|
|
179
|
+
var BaseVirtualInput_default = BaseVirtualInput;
|