@rjsf/mantine 6.4.2 → 6.5.1
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/dist/index.cjs +59 -45
- package/dist/index.cjs.map +2 -2
- package/dist/mantine.esm.js +69 -49
- package/dist/mantine.esm.js.map +3 -3
- package/dist/mantine.umd.js +59 -45
- package/lib/Form/index.js +1 -1
- package/lib/Theme/index.js +2 -2
- package/lib/index.d.ts +4 -4
- package/lib/index.js +4 -4
- package/lib/templates/BaseInputTemplate.js +3 -2
- package/lib/templates/BaseInputTemplate.js.map +1 -1
- package/lib/templates/ButtonTemplates/AddButton.js +2 -2
- package/lib/templates/ButtonTemplates/IconButton.js +1 -1
- package/lib/templates/ButtonTemplates/index.js +3 -3
- package/lib/templates/ErrorList.js +1 -1
- package/lib/templates/OptionalDataControlsTemplate.js +2 -2
- package/lib/templates/WrapIfAdditionalTemplate.js +1 -1
- package/lib/templates/WrapIfAdditionalTemplate.js.map +1 -1
- package/lib/templates/index.js +16 -16
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/widgets/CheckboxesWidget.js +10 -9
- package/lib/widgets/CheckboxesWidget.js.map +1 -1
- package/lib/widgets/ColorWidget.js +1 -1
- package/lib/widgets/DateTime/DateTimeWidget.js +1 -1
- package/lib/widgets/DateTime/DateWidget.js +1 -1
- package/lib/widgets/DateTime/index.d.ts +5 -5
- package/lib/widgets/DateTime/index.js +5 -5
- package/lib/widgets/FileWidget.js +1 -1
- package/lib/widgets/PasswordWidget.js +1 -1
- package/lib/widgets/RadioWidget.js +10 -9
- package/lib/widgets/RadioWidget.js.map +1 -1
- package/lib/widgets/RangeWidget.js +1 -1
- package/lib/widgets/SelectWidget.js +30 -13
- package/lib/widgets/SelectWidget.js.map +1 -1
- package/lib/widgets/TextareaWidget.js +1 -1
- package/lib/widgets/index.js +10 -10
- package/package.json +10 -10
- package/src/templates/BaseInputTemplate.tsx +5 -1
- package/src/templates/WrapIfAdditionalTemplate.tsx +1 -0
- package/src/widgets/CheckboxesWidget.tsx +11 -8
- package/src/widgets/RadioWidget.tsx +11 -8
- package/src/widgets/SelectWidget.tsx +40 -32
package/dist/mantine.esm.js
CHANGED
|
@@ -248,17 +248,20 @@ function BaseInputTemplate(props) {
|
|
|
248
248
|
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
|
|
249
249
|
list: schema.examples ? examplesId(id) : void 0
|
|
250
250
|
};
|
|
251
|
+
const { min, max, ...restInputProps } = inputProps;
|
|
251
252
|
const input = inputProps.type === "number" || inputProps.type === "integer" ? /* @__PURE__ */ jsx4(
|
|
252
253
|
NumberInput,
|
|
253
254
|
{
|
|
254
255
|
onChange: !readonly ? handleNumberChange : void 0,
|
|
255
256
|
...componentProps,
|
|
256
|
-
...
|
|
257
|
+
...restInputProps,
|
|
257
258
|
...themeProps,
|
|
258
259
|
step: typeof inputProps.step === "number" ? inputProps.step : 1,
|
|
259
260
|
type: "text",
|
|
260
261
|
description,
|
|
261
262
|
value,
|
|
263
|
+
min: typeof min === "number" ? min : void 0,
|
|
264
|
+
max: typeof max === "number" ? max : void 0,
|
|
262
265
|
"aria-describedby": ariaDescribedByIds(id, !!schema.examples)
|
|
263
266
|
}
|
|
264
267
|
) : /* @__PURE__ */ jsx4(
|
|
@@ -858,7 +861,8 @@ function WrapIfAdditionalTemplate(props) {
|
|
|
858
861
|
id: `${id}-key`,
|
|
859
862
|
name: `${id}-key`,
|
|
860
863
|
onBlur: !readonly ? onKeyRenameBlur : void 0
|
|
861
|
-
}
|
|
864
|
+
},
|
|
865
|
+
label
|
|
862
866
|
) }),
|
|
863
867
|
/* @__PURE__ */ jsx18(Grid4.Col, { span: 6, className: "form-additional", children })
|
|
864
868
|
] }),
|
|
@@ -1154,8 +1158,10 @@ function TimeWidget(props) {
|
|
|
1154
1158
|
import { useCallback as useCallback4 } from "react";
|
|
1155
1159
|
import {
|
|
1156
1160
|
ariaDescribedByIds as ariaDescribedByIds5,
|
|
1157
|
-
|
|
1161
|
+
enumOptionValueDecoder,
|
|
1162
|
+
enumOptionValueEncoder,
|
|
1158
1163
|
enumOptionsIndexForValue,
|
|
1164
|
+
getOptionValueFormat,
|
|
1159
1165
|
optionId,
|
|
1160
1166
|
titleId as titleId4
|
|
1161
1167
|
} from "@rjsf/utils";
|
|
@@ -1179,30 +1185,31 @@ function CheckboxesWidget(props) {
|
|
|
1179
1185
|
onFocus
|
|
1180
1186
|
} = props;
|
|
1181
1187
|
const { enumOptions, enumDisabled, inline, emptyValue } = options;
|
|
1188
|
+
const optionValueFormat = getOptionValueFormat(options);
|
|
1182
1189
|
const themeProps = cleanupOptions(options);
|
|
1183
1190
|
const handleChange = useCallback4(
|
|
1184
1191
|
(nextValue) => {
|
|
1185
1192
|
if (!disabled && !readonly && onChange) {
|
|
1186
|
-
onChange(
|
|
1193
|
+
onChange(enumOptionValueDecoder(nextValue, enumOptions, optionValueFormat, emptyValue));
|
|
1187
1194
|
}
|
|
1188
1195
|
},
|
|
1189
|
-
[onChange, disabled, readonly, enumOptions, emptyValue]
|
|
1196
|
+
[onChange, disabled, readonly, enumOptions, emptyValue, optionValueFormat]
|
|
1190
1197
|
);
|
|
1191
1198
|
const handleBlur = useCallback4(
|
|
1192
1199
|
({ target }) => {
|
|
1193
1200
|
if (onBlur) {
|
|
1194
|
-
onBlur(id,
|
|
1201
|
+
onBlur(id, enumOptionValueDecoder(target.value, enumOptions, optionValueFormat, emptyValue));
|
|
1195
1202
|
}
|
|
1196
1203
|
},
|
|
1197
|
-
[onBlur, id, enumOptions, emptyValue]
|
|
1204
|
+
[onBlur, id, enumOptions, emptyValue, optionValueFormat]
|
|
1198
1205
|
);
|
|
1199
1206
|
const handleFocus = useCallback4(
|
|
1200
1207
|
({ target }) => {
|
|
1201
1208
|
if (onFocus) {
|
|
1202
|
-
onFocus(id,
|
|
1209
|
+
onFocus(id, enumOptionValueDecoder(target.value, enumOptions, optionValueFormat, emptyValue));
|
|
1203
1210
|
}
|
|
1204
1211
|
},
|
|
1205
|
-
[onFocus, id, enumOptions, emptyValue]
|
|
1212
|
+
[onFocus, id, enumOptions, emptyValue, optionValueFormat]
|
|
1206
1213
|
);
|
|
1207
1214
|
const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, true);
|
|
1208
1215
|
return Array.isArray(enumOptions) && enumOptions.length > 0 ? /* @__PURE__ */ jsxs12(Fragment3, { children: [
|
|
@@ -1223,7 +1230,7 @@ function CheckboxesWidget(props) {
|
|
|
1223
1230
|
{
|
|
1224
1231
|
id: optionId(id, i),
|
|
1225
1232
|
name: htmlName || id,
|
|
1226
|
-
value:
|
|
1233
|
+
value: enumOptionValueEncoder(option.value, i, optionValueFormat),
|
|
1227
1234
|
label: option.label,
|
|
1228
1235
|
disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
|
|
1229
1236
|
autoFocus: i === 0 && autofocus,
|
|
@@ -1538,8 +1545,10 @@ function PasswordWidget(props) {
|
|
|
1538
1545
|
import { useCallback as useCallback9 } from "react";
|
|
1539
1546
|
import {
|
|
1540
1547
|
ariaDescribedByIds as ariaDescribedByIds10,
|
|
1548
|
+
enumOptionValueDecoder as enumOptionValueDecoder2,
|
|
1549
|
+
enumOptionValueEncoder as enumOptionValueEncoder2,
|
|
1541
1550
|
enumOptionsIndexForValue as enumOptionsIndexForValue2,
|
|
1542
|
-
|
|
1551
|
+
getOptionValueFormat as getOptionValueFormat2,
|
|
1543
1552
|
optionId as optionId2
|
|
1544
1553
|
} from "@rjsf/utils";
|
|
1545
1554
|
import { Radio, Flex as Flex5 } from "@mantine/core";
|
|
@@ -1562,30 +1571,31 @@ function RadioWidget(props) {
|
|
|
1562
1571
|
onFocus
|
|
1563
1572
|
} = props;
|
|
1564
1573
|
const { enumOptions, enumDisabled, inline, emptyValue } = options;
|
|
1574
|
+
const optionValueFormat = getOptionValueFormat2(options);
|
|
1565
1575
|
const themeProps = cleanupOptions(options);
|
|
1566
1576
|
const handleChange = useCallback9(
|
|
1567
1577
|
(nextValue) => {
|
|
1568
1578
|
if (!disabled && !readonly && onChange) {
|
|
1569
|
-
onChange(
|
|
1579
|
+
onChange(enumOptionValueDecoder2(nextValue, enumOptions, optionValueFormat, emptyValue));
|
|
1570
1580
|
}
|
|
1571
1581
|
},
|
|
1572
|
-
[onChange, disabled, readonly, enumOptions, emptyValue]
|
|
1582
|
+
[onChange, disabled, readonly, enumOptions, emptyValue, optionValueFormat]
|
|
1573
1583
|
);
|
|
1574
1584
|
const handleBlur = useCallback9(
|
|
1575
1585
|
({ target }) => {
|
|
1576
1586
|
if (onBlur) {
|
|
1577
|
-
onBlur(id,
|
|
1587
|
+
onBlur(id, enumOptionValueDecoder2(target && target.value, enumOptions, optionValueFormat, emptyValue));
|
|
1578
1588
|
}
|
|
1579
1589
|
},
|
|
1580
|
-
[onBlur, id, enumOptions, emptyValue]
|
|
1590
|
+
[onBlur, id, enumOptions, emptyValue, optionValueFormat]
|
|
1581
1591
|
);
|
|
1582
1592
|
const handleFocus = useCallback9(
|
|
1583
1593
|
({ target }) => {
|
|
1584
1594
|
if (onFocus) {
|
|
1585
|
-
onFocus(id,
|
|
1595
|
+
onFocus(id, enumOptionValueDecoder2(target && target.value, enumOptions, optionValueFormat, emptyValue));
|
|
1586
1596
|
}
|
|
1587
1597
|
},
|
|
1588
|
-
[onFocus, id, enumOptions, emptyValue]
|
|
1598
|
+
[onFocus, id, enumOptions, emptyValue, optionValueFormat]
|
|
1589
1599
|
);
|
|
1590
1600
|
const selected = enumOptionsIndexForValue2(value, enumOptions);
|
|
1591
1601
|
return /* @__PURE__ */ jsx30(
|
|
@@ -1605,7 +1615,7 @@ function RadioWidget(props) {
|
|
|
1605
1615
|
Radio,
|
|
1606
1616
|
{
|
|
1607
1617
|
id: optionId2(id, i),
|
|
1608
|
-
value:
|
|
1618
|
+
value: enumOptionValueEncoder2(option.value, i, optionValueFormat),
|
|
1609
1619
|
label: option.label,
|
|
1610
1620
|
disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
|
|
1611
1621
|
autoFocus: i === 0 && autofocus,
|
|
@@ -1694,8 +1704,10 @@ function RangeWidget(props) {
|
|
|
1694
1704
|
import { useCallback as useCallback11, useMemo } from "react";
|
|
1695
1705
|
import {
|
|
1696
1706
|
ariaDescribedByIds as ariaDescribedByIds12,
|
|
1697
|
-
|
|
1698
|
-
|
|
1707
|
+
enumOptionSelectedValue,
|
|
1708
|
+
enumOptionValueDecoder as enumOptionValueDecoder3,
|
|
1709
|
+
enumOptionValueEncoder as enumOptionValueEncoder3,
|
|
1710
|
+
getOptionValueFormat as getOptionValueFormat3,
|
|
1699
1711
|
labelValue as labelValue8
|
|
1700
1712
|
} from "@rjsf/utils";
|
|
1701
1713
|
import { Select as Select2, MultiSelect } from "@mantine/core";
|
|
@@ -1720,64 +1732,72 @@ function SelectWidget(props) {
|
|
|
1720
1732
|
onFocus
|
|
1721
1733
|
} = props;
|
|
1722
1734
|
const { enumOptions, enumDisabled, emptyValue } = options;
|
|
1735
|
+
const optionValueFormat = getOptionValueFormat3(options);
|
|
1723
1736
|
const themeProps = cleanupOptions(options);
|
|
1724
1737
|
const handleChange = useCallback11(
|
|
1725
1738
|
(nextValue) => {
|
|
1726
1739
|
if (!disabled && !readonly && onChange) {
|
|
1727
|
-
onChange(
|
|
1740
|
+
onChange(enumOptionValueDecoder3(nextValue, enumOptions, optionValueFormat, emptyValue));
|
|
1728
1741
|
}
|
|
1729
1742
|
},
|
|
1730
|
-
[onChange, disabled, readonly, enumOptions, emptyValue]
|
|
1743
|
+
[onChange, disabled, readonly, enumOptions, emptyValue, optionValueFormat]
|
|
1731
1744
|
);
|
|
1732
1745
|
const handleBlur = useCallback11(
|
|
1733
1746
|
({ target }) => {
|
|
1734
1747
|
if (onBlur) {
|
|
1735
|
-
onBlur(id,
|
|
1748
|
+
onBlur(id, enumOptionValueDecoder3(target && target.value, enumOptions, optionValueFormat, emptyValue));
|
|
1736
1749
|
}
|
|
1737
1750
|
},
|
|
1738
|
-
[onBlur, id, enumOptions, emptyValue]
|
|
1751
|
+
[onBlur, id, enumOptions, emptyValue, optionValueFormat]
|
|
1739
1752
|
);
|
|
1740
1753
|
const handleFocus = useCallback11(
|
|
1741
1754
|
({ target }) => {
|
|
1742
1755
|
if (onFocus) {
|
|
1743
|
-
onFocus(id,
|
|
1756
|
+
onFocus(id, enumOptionValueDecoder3(target && target.value, enumOptions, optionValueFormat, emptyValue));
|
|
1744
1757
|
}
|
|
1745
1758
|
},
|
|
1746
|
-
[onFocus, id, enumOptions, emptyValue]
|
|
1759
|
+
[onFocus, id, enumOptions, emptyValue, optionValueFormat]
|
|
1747
1760
|
);
|
|
1748
|
-
const selectedIndexes = enumOptionsIndexForValue3(value, enumOptions, multiple);
|
|
1749
1761
|
const selectOptions = useMemo(() => {
|
|
1750
1762
|
if (Array.isArray(enumOptions)) {
|
|
1751
1763
|
return enumOptions.map((option, index) => ({
|
|
1752
1764
|
key: String(index),
|
|
1753
|
-
value:
|
|
1765
|
+
value: enumOptionValueEncoder3(option.value, index, optionValueFormat),
|
|
1754
1766
|
label: option.label,
|
|
1755
1767
|
disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1
|
|
1756
1768
|
}));
|
|
1757
1769
|
}
|
|
1758
1770
|
return [];
|
|
1759
|
-
}, [enumDisabled, enumOptions]);
|
|
1760
|
-
const
|
|
1761
|
-
|
|
1762
|
-
|
|
1771
|
+
}, [enumDisabled, enumOptions, optionValueFormat]);
|
|
1772
|
+
const sharedProps = {
|
|
1773
|
+
id,
|
|
1774
|
+
name: htmlName || id,
|
|
1775
|
+
label: labelValue8(label || void 0, hideLabel, false),
|
|
1776
|
+
data: selectOptions,
|
|
1777
|
+
onChange: !readonly ? handleChange : void 0,
|
|
1778
|
+
onBlur: !readonly ? handleBlur : void 0,
|
|
1779
|
+
onFocus: !readonly ? handleFocus : void 0,
|
|
1780
|
+
autoFocus: autofocus,
|
|
1781
|
+
placeholder,
|
|
1782
|
+
disabled: disabled || readonly,
|
|
1783
|
+
required,
|
|
1784
|
+
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
|
|
1785
|
+
searchable: true,
|
|
1786
|
+
"aria-describedby": ariaDescribedByIds12(id),
|
|
1787
|
+
comboboxProps: { withinPortal: false },
|
|
1788
|
+
...themeProps
|
|
1789
|
+
};
|
|
1790
|
+
return multiple ? /* @__PURE__ */ jsx32(
|
|
1791
|
+
MultiSelect,
|
|
1763
1792
|
{
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
autoFocus: autofocus,
|
|
1773
|
-
placeholder,
|
|
1774
|
-
disabled: disabled || readonly,
|
|
1775
|
-
required,
|
|
1776
|
-
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
|
|
1777
|
-
searchable: true,
|
|
1778
|
-
...themeProps,
|
|
1779
|
-
"aria-describedby": ariaDescribedByIds12(id),
|
|
1780
|
-
comboboxProps: { withinPortal: false }
|
|
1793
|
+
...sharedProps,
|
|
1794
|
+
value: enumOptionSelectedValue(value, enumOptions, true, optionValueFormat, [])
|
|
1795
|
+
}
|
|
1796
|
+
) : /* @__PURE__ */ jsx32(
|
|
1797
|
+
Select2,
|
|
1798
|
+
{
|
|
1799
|
+
...sharedProps,
|
|
1800
|
+
value: enumOptionSelectedValue(value, enumOptions, false, optionValueFormat, null)
|
|
1781
1801
|
}
|
|
1782
1802
|
);
|
|
1783
1803
|
}
|