@sunggang/ui-lib 0.4.66 → 0.4.68
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/Form.cjs.js +14 -13
- package/Form.esm.js +14 -13
- package/index.cjs.css +3 -0
- package/index.esm.css +3 -0
- package/package.json +1 -1
- package/src/lib/Form/demo.d.ts +55 -1
- package/src/lib/Form/types.d.ts +3 -0
package/Form.cjs.js
CHANGED
|
@@ -7517,7 +7517,7 @@ var EditableCombobox = function(param) {
|
|
|
7517
7517
|
onChange: handleInputChange,
|
|
7518
7518
|
onClick: handleInputClick,
|
|
7519
7519
|
placeholder: placeholder,
|
|
7520
|
-
|
|
7520
|
+
readOnly: disabled,
|
|
7521
7521
|
className: [
|
|
7522
7522
|
"w-full h-11 rounded-2xl px-4 pr-20 border border-solid border-[#B4B4B4] customInput editable-combobox",
|
|
7523
7523
|
"transition-colors duration-200",
|
|
@@ -7553,7 +7553,7 @@ var EditableCombobox = function(param) {
|
|
|
7553
7553
|
]
|
|
7554
7554
|
}),
|
|
7555
7555
|
isOpen && !disabled && /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
7556
|
-
className: "absolute z-
|
|
7556
|
+
className: "absolute z-[9999] w-full mt-1 bg-white border border-[#B4B4B4] rounded-2xl shadow-lg max-h-60 overflow-hidden",
|
|
7557
7557
|
children: /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
7558
7558
|
className: "overflow-y-auto max-h-60",
|
|
7559
7559
|
children: filteredOptions.length > 0 ? filteredOptions.map(function(option, index) {
|
|
@@ -8247,8 +8247,9 @@ var FieldArray = function(param) {
|
|
|
8247
8247
|
var maxItems = config === null || config === void 0 ? void 0 : config.maxItems;
|
|
8248
8248
|
var minItems = (config === null || config === void 0 ? void 0 : config.minItems) || 0;
|
|
8249
8249
|
var defaultItemCount = (config === null || config === void 0 ? void 0 : config.defaultItemCount) || 1;
|
|
8250
|
-
var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "
|
|
8250
|
+
var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "";
|
|
8251
8251
|
var addButtonClassName = config === null || config === void 0 ? void 0 : config.addButtonClassName;
|
|
8252
|
+
var hideAddButton = (config === null || config === void 0 ? void 0 : config.hideAddButton) || false;
|
|
8252
8253
|
var canAdd = !maxItems || fields.length < maxItems;
|
|
8253
8254
|
var canRemove = fields.length > minItems;
|
|
8254
8255
|
React__default["default"].useEffect(function() {
|
|
@@ -8323,7 +8324,7 @@ var FieldArray = function(param) {
|
|
|
8323
8324
|
(item === null || item === void 0 ? void 0 : item.label) && /*#__PURE__*/ jsxRuntime.jsx(FieldLabel.FieldLabel, {
|
|
8324
8325
|
item: item
|
|
8325
8326
|
}),
|
|
8326
|
-
addButtonPosition === "top" && canAdd && /*#__PURE__*/ jsxRuntime.jsxs("button", {
|
|
8327
|
+
addButtonPosition === "top" && canAdd && !hideAddButton && /*#__PURE__*/ jsxRuntime.jsxs("button", {
|
|
8327
8328
|
type: "button",
|
|
8328
8329
|
onClick: handleAdd,
|
|
8329
8330
|
className: addButtonClassName || [
|
|
@@ -8359,7 +8360,7 @@ var FieldArray = function(param) {
|
|
|
8359
8360
|
].join(" "),
|
|
8360
8361
|
children: [
|
|
8361
8362
|
/*#__PURE__*/ jsxRuntime.jsxs("div", {
|
|
8362
|
-
className: "flex-1",
|
|
8363
|
+
className: "flex-1 min-h-[96px]",
|
|
8363
8364
|
children: [
|
|
8364
8365
|
/*#__PURE__*/ jsxRuntime.jsxs("div", {
|
|
8365
8366
|
className: "font-medium mb-2",
|
|
@@ -8392,16 +8393,16 @@ var FieldArray = function(param) {
|
|
|
8392
8393
|
};
|
|
8393
8394
|
}),
|
|
8394
8395
|
placeholder: fieldConfig.placeholder || fieldConfig.label,
|
|
8395
|
-
disabled: (
|
|
8396
|
+
disabled: (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disable) || (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disabled)
|
|
8396
8397
|
}) : // ✅ 使用一般 input
|
|
8397
8398
|
/*#__PURE__*/ jsxRuntime.jsx("input", _object_spread_props(_object_spread({}, controllerField), {
|
|
8398
8399
|
type: "text",
|
|
8399
8400
|
className: [
|
|
8400
|
-
(
|
|
8401
|
-
"w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
|
|
8401
|
+
(fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disable) || (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
|
|
8402
|
+
"customInput w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
|
|
8402
8403
|
].join(" "),
|
|
8403
8404
|
placeholder: fieldConfig.placeholder || fieldConfig.label,
|
|
8404
|
-
|
|
8405
|
+
readOnly: (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disable) || (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disabled)
|
|
8405
8406
|
}))
|
|
8406
8407
|
});
|
|
8407
8408
|
}
|
|
@@ -8423,7 +8424,7 @@ var FieldArray = function(param) {
|
|
|
8423
8424
|
"mt-[30px]"
|
|
8424
8425
|
].join(" "),
|
|
8425
8426
|
children: [
|
|
8426
|
-
addButtonPosition === "inline" && canAdd && index === fields.length - 1 && /*#__PURE__*/ jsxRuntime.jsxs("button", {
|
|
8427
|
+
addButtonPosition === "inline" && canAdd && !hideAddButton && index === fields.length - 1 && /*#__PURE__*/ jsxRuntime.jsxs("button", {
|
|
8427
8428
|
type: "button",
|
|
8428
8429
|
onClick: handleAdd,
|
|
8429
8430
|
className: addButtonClassName || [
|
|
@@ -8440,7 +8441,7 @@ var FieldArray = function(param) {
|
|
|
8440
8441
|
addButtonText
|
|
8441
8442
|
]
|
|
8442
8443
|
}),
|
|
8443
|
-
canRemove && fields.length > 1 && /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
8444
|
+
canRemove && !hideAddButton && fields.length > 1 && /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
8444
8445
|
className: "p-2 rounded-2xl text-[#EF5533] bg-white hover:bg-[#FFF5F3] transition-colors duration-200 cursor-pointer",
|
|
8445
8446
|
children: /*#__PURE__*/ jsxRuntime.jsx(react$1.Icon, {
|
|
8446
8447
|
icon: "fluent-mdl2:delete",
|
|
@@ -8459,7 +8460,7 @@ var FieldArray = function(param) {
|
|
|
8459
8460
|
})
|
|
8460
8461
|
}, field.id);
|
|
8461
8462
|
}),
|
|
8462
|
-
addButtonPosition === "bottom" && canAdd && /*#__PURE__*/ jsxRuntime.jsxs("button", {
|
|
8463
|
+
addButtonPosition === "bottom" && canAdd && !hideAddButton && /*#__PURE__*/ jsxRuntime.jsxs("button", {
|
|
8463
8464
|
type: "button",
|
|
8464
8465
|
onClick: handleAdd,
|
|
8465
8466
|
className: addButtonClassName || [
|
|
@@ -8477,7 +8478,7 @@ var FieldArray = function(param) {
|
|
|
8477
8478
|
]
|
|
8478
8479
|
}),
|
|
8479
8480
|
maxItems && /*#__PURE__*/ jsxRuntime.jsxs("div", {
|
|
8480
|
-
className: "text-xs text-[#777777]",
|
|
8481
|
+
className: "text-xs text-[#777777] pb-4",
|
|
8481
8482
|
children: [
|
|
8482
8483
|
"已新增 ",
|
|
8483
8484
|
fields.length,
|
package/Form.esm.js
CHANGED
|
@@ -7490,7 +7490,7 @@ var EditableCombobox = function(param) {
|
|
|
7490
7490
|
onChange: handleInputChange,
|
|
7491
7491
|
onClick: handleInputClick,
|
|
7492
7492
|
placeholder: placeholder,
|
|
7493
|
-
|
|
7493
|
+
readOnly: disabled,
|
|
7494
7494
|
className: [
|
|
7495
7495
|
"w-full h-11 rounded-2xl px-4 pr-20 border border-solid border-[#B4B4B4] customInput editable-combobox",
|
|
7496
7496
|
"transition-colors duration-200",
|
|
@@ -7526,7 +7526,7 @@ var EditableCombobox = function(param) {
|
|
|
7526
7526
|
]
|
|
7527
7527
|
}),
|
|
7528
7528
|
isOpen && !disabled && /*#__PURE__*/ jsx$1("div", {
|
|
7529
|
-
className: "absolute z-
|
|
7529
|
+
className: "absolute z-[9999] w-full mt-1 bg-white border border-[#B4B4B4] rounded-2xl shadow-lg max-h-60 overflow-hidden",
|
|
7530
7530
|
children: /*#__PURE__*/ jsx$1("div", {
|
|
7531
7531
|
className: "overflow-y-auto max-h-60",
|
|
7532
7532
|
children: filteredOptions.length > 0 ? filteredOptions.map(function(option, index) {
|
|
@@ -8220,8 +8220,9 @@ var FieldArray = function(param) {
|
|
|
8220
8220
|
var maxItems = config === null || config === void 0 ? void 0 : config.maxItems;
|
|
8221
8221
|
var minItems = (config === null || config === void 0 ? void 0 : config.minItems) || 0;
|
|
8222
8222
|
var defaultItemCount = (config === null || config === void 0 ? void 0 : config.defaultItemCount) || 1;
|
|
8223
|
-
var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "
|
|
8223
|
+
var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "";
|
|
8224
8224
|
var addButtonClassName = config === null || config === void 0 ? void 0 : config.addButtonClassName;
|
|
8225
|
+
var hideAddButton = (config === null || config === void 0 ? void 0 : config.hideAddButton) || false;
|
|
8225
8226
|
var canAdd = !maxItems || fields.length < maxItems;
|
|
8226
8227
|
var canRemove = fields.length > minItems;
|
|
8227
8228
|
React__default.useEffect(function() {
|
|
@@ -8296,7 +8297,7 @@ var FieldArray = function(param) {
|
|
|
8296
8297
|
(item === null || item === void 0 ? void 0 : item.label) && /*#__PURE__*/ jsx$1(FieldLabel, {
|
|
8297
8298
|
item: item
|
|
8298
8299
|
}),
|
|
8299
|
-
addButtonPosition === "top" && canAdd && /*#__PURE__*/ jsxs("button", {
|
|
8300
|
+
addButtonPosition === "top" && canAdd && !hideAddButton && /*#__PURE__*/ jsxs("button", {
|
|
8300
8301
|
type: "button",
|
|
8301
8302
|
onClick: handleAdd,
|
|
8302
8303
|
className: addButtonClassName || [
|
|
@@ -8332,7 +8333,7 @@ var FieldArray = function(param) {
|
|
|
8332
8333
|
].join(" "),
|
|
8333
8334
|
children: [
|
|
8334
8335
|
/*#__PURE__*/ jsxs("div", {
|
|
8335
|
-
className: "flex-1",
|
|
8336
|
+
className: "flex-1 min-h-[96px]",
|
|
8336
8337
|
children: [
|
|
8337
8338
|
/*#__PURE__*/ jsxs("div", {
|
|
8338
8339
|
className: "font-medium mb-2",
|
|
@@ -8365,16 +8366,16 @@ var FieldArray = function(param) {
|
|
|
8365
8366
|
};
|
|
8366
8367
|
}),
|
|
8367
8368
|
placeholder: fieldConfig.placeholder || fieldConfig.label,
|
|
8368
|
-
disabled: (
|
|
8369
|
+
disabled: (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disable) || (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disabled)
|
|
8369
8370
|
}) : // ✅ 使用一般 input
|
|
8370
8371
|
/*#__PURE__*/ jsx$1("input", _object_spread_props(_object_spread({}, controllerField), {
|
|
8371
8372
|
type: "text",
|
|
8372
8373
|
className: [
|
|
8373
|
-
(
|
|
8374
|
-
"w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
|
|
8374
|
+
(fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disable) || (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
|
|
8375
|
+
"customInput w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
|
|
8375
8376
|
].join(" "),
|
|
8376
8377
|
placeholder: fieldConfig.placeholder || fieldConfig.label,
|
|
8377
|
-
|
|
8378
|
+
readOnly: (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disable) || (fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.disabled)
|
|
8378
8379
|
}))
|
|
8379
8380
|
});
|
|
8380
8381
|
}
|
|
@@ -8396,7 +8397,7 @@ var FieldArray = function(param) {
|
|
|
8396
8397
|
"mt-[30px]"
|
|
8397
8398
|
].join(" "),
|
|
8398
8399
|
children: [
|
|
8399
|
-
addButtonPosition === "inline" && canAdd && index === fields.length - 1 && /*#__PURE__*/ jsxs("button", {
|
|
8400
|
+
addButtonPosition === "inline" && canAdd && !hideAddButton && index === fields.length - 1 && /*#__PURE__*/ jsxs("button", {
|
|
8400
8401
|
type: "button",
|
|
8401
8402
|
onClick: handleAdd,
|
|
8402
8403
|
className: addButtonClassName || [
|
|
@@ -8413,7 +8414,7 @@ var FieldArray = function(param) {
|
|
|
8413
8414
|
addButtonText
|
|
8414
8415
|
]
|
|
8415
8416
|
}),
|
|
8416
|
-
canRemove && fields.length > 1 && /*#__PURE__*/ jsx$1("div", {
|
|
8417
|
+
canRemove && !hideAddButton && fields.length > 1 && /*#__PURE__*/ jsx$1("div", {
|
|
8417
8418
|
className: "p-2 rounded-2xl text-[#EF5533] bg-white hover:bg-[#FFF5F3] transition-colors duration-200 cursor-pointer",
|
|
8418
8419
|
children: /*#__PURE__*/ jsx$1(Icon, {
|
|
8419
8420
|
icon: "fluent-mdl2:delete",
|
|
@@ -8432,7 +8433,7 @@ var FieldArray = function(param) {
|
|
|
8432
8433
|
})
|
|
8433
8434
|
}, field.id);
|
|
8434
8435
|
}),
|
|
8435
|
-
addButtonPosition === "bottom" && canAdd && /*#__PURE__*/ jsxs("button", {
|
|
8436
|
+
addButtonPosition === "bottom" && canAdd && !hideAddButton && /*#__PURE__*/ jsxs("button", {
|
|
8436
8437
|
type: "button",
|
|
8437
8438
|
onClick: handleAdd,
|
|
8438
8439
|
className: addButtonClassName || [
|
|
@@ -8450,7 +8451,7 @@ var FieldArray = function(param) {
|
|
|
8450
8451
|
]
|
|
8451
8452
|
}),
|
|
8452
8453
|
maxItems && /*#__PURE__*/ jsxs("div", {
|
|
8453
|
-
className: "text-xs text-[#777777]",
|
|
8454
|
+
className: "text-xs text-[#777777] pb-4",
|
|
8454
8455
|
children: [
|
|
8455
8456
|
"已新增 ",
|
|
8456
8457
|
fields.length,
|
package/index.cjs.css
CHANGED
package/index.esm.css
CHANGED
package/package.json
CHANGED
package/src/lib/Form/demo.d.ts
CHANGED
|
@@ -9,7 +9,61 @@ export declare const ticketBundleOptions: {
|
|
|
9
9
|
name: string;
|
|
10
10
|
value: number;
|
|
11
11
|
}[];
|
|
12
|
-
export declare const config: (getValues: (name: string) => unknown) => (FormItem[] |
|
|
12
|
+
export declare const config: (getValues: (name: string) => unknown) => (FormItem[] | {
|
|
13
|
+
type: string;
|
|
14
|
+
name: string;
|
|
15
|
+
label: string;
|
|
16
|
+
fieldArrayConfig: {
|
|
17
|
+
hideAddButton: boolean;
|
|
18
|
+
fields: ({
|
|
19
|
+
name: string;
|
|
20
|
+
label: string;
|
|
21
|
+
placeholder: string;
|
|
22
|
+
validateOption: {
|
|
23
|
+
required: string;
|
|
24
|
+
validate: (value: any) => true | "姓名至少需要 2 個字元";
|
|
25
|
+
};
|
|
26
|
+
disabled: boolean;
|
|
27
|
+
options?: undefined;
|
|
28
|
+
} | {
|
|
29
|
+
name: string;
|
|
30
|
+
label: string;
|
|
31
|
+
placeholder: string;
|
|
32
|
+
options: {
|
|
33
|
+
value: string;
|
|
34
|
+
name: string;
|
|
35
|
+
}[];
|
|
36
|
+
validateOption: {
|
|
37
|
+
required: string;
|
|
38
|
+
validate?: undefined;
|
|
39
|
+
};
|
|
40
|
+
disabled: boolean;
|
|
41
|
+
} | {
|
|
42
|
+
name: string;
|
|
43
|
+
label: string;
|
|
44
|
+
options: {
|
|
45
|
+
value: string;
|
|
46
|
+
name: string;
|
|
47
|
+
}[];
|
|
48
|
+
placeholder?: undefined;
|
|
49
|
+
validateOption?: undefined;
|
|
50
|
+
disabled?: undefined;
|
|
51
|
+
} | {
|
|
52
|
+
name: string;
|
|
53
|
+
label: string;
|
|
54
|
+
placeholder: string;
|
|
55
|
+
validateOption?: undefined;
|
|
56
|
+
disabled?: undefined;
|
|
57
|
+
options?: undefined;
|
|
58
|
+
})[];
|
|
59
|
+
addButtonText: string;
|
|
60
|
+
removeButtonText: string;
|
|
61
|
+
maxItems: number;
|
|
62
|
+
minItems: number;
|
|
63
|
+
defaultItemCount: number;
|
|
64
|
+
addButtonPosition: string;
|
|
65
|
+
};
|
|
66
|
+
}[] | ({
|
|
13
67
|
type: string;
|
|
14
68
|
name: string;
|
|
15
69
|
label: string;
|
package/src/lib/Form/types.d.ts
CHANGED
|
@@ -39,6 +39,8 @@ export interface FieldArrayField {
|
|
|
39
39
|
message: string;
|
|
40
40
|
};
|
|
41
41
|
};
|
|
42
|
+
disable?: boolean;
|
|
43
|
+
disabled?: boolean;
|
|
42
44
|
}
|
|
43
45
|
interface RadioOption {
|
|
44
46
|
label?: string;
|
|
@@ -177,6 +179,7 @@ export interface FormItem {
|
|
|
177
179
|
defaultItemCount?: number;
|
|
178
180
|
addButtonPosition?: 'inline' | 'bottom' | 'top';
|
|
179
181
|
addButtonClassName?: string;
|
|
182
|
+
hideAddButton?: boolean;
|
|
180
183
|
};
|
|
181
184
|
}
|
|
182
185
|
export interface FormType {
|