@bsol-oss/react-datatable5 7.3.5 → 7.3.6
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.js +16 -12
- package/dist/index.mjs +16 -12
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1689,6 +1689,7 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1689
1689
|
serverUrl,
|
|
1690
1690
|
in_table: in_table,
|
|
1691
1691
|
limit: limit,
|
|
1692
|
+
where: [{ id: column_ref, value: watchId }],
|
|
1692
1693
|
});
|
|
1693
1694
|
const newMap = Object.fromEntries((data ?? { data: [] }).data.map((item) => {
|
|
1694
1695
|
return [
|
|
@@ -1714,15 +1715,13 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1714
1715
|
setSearchText(event.target.value);
|
|
1715
1716
|
setLimit(10);
|
|
1716
1717
|
};
|
|
1717
|
-
const
|
|
1718
|
+
const watchId = watch(column);
|
|
1719
|
+
const watchIds = (watch(column) ?? []);
|
|
1718
1720
|
const getPickedValue = () => {
|
|
1719
|
-
if (selectedIds.length <= 0) {
|
|
1720
|
-
return "";
|
|
1721
|
-
}
|
|
1722
1721
|
if (Object.keys(idMap).length <= 0) {
|
|
1723
1722
|
return "";
|
|
1724
1723
|
}
|
|
1725
|
-
const record = idMap[
|
|
1724
|
+
const record = idMap[watchId];
|
|
1726
1725
|
if (record === undefined) {
|
|
1727
1726
|
return "";
|
|
1728
1727
|
}
|
|
@@ -1735,7 +1734,7 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1735
1734
|
return jsxRuntime.jsx(jsxRuntime.Fragment, { children: "undefined" });
|
|
1736
1735
|
}
|
|
1737
1736
|
return (jsxRuntime.jsx(Tag, { closable: true, onClick: () => {
|
|
1738
|
-
setValue(column,
|
|
1737
|
+
setValue(column, watchIds.filter((id) => id != item[column_ref]));
|
|
1739
1738
|
}, children: !!renderDisplay === true
|
|
1740
1739
|
? renderDisplay(item)
|
|
1741
1740
|
: item[display_column] }));
|
|
@@ -1751,15 +1750,17 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1751
1750
|
}, children: close ?? "Close" }), jsxRuntime.jsx(react.Flex, { flexFlow: "column wrap", children:
|
|
1752
1751
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1753
1752
|
dataList.map((item) => {
|
|
1754
|
-
const selected =
|
|
1753
|
+
const selected = isMultiple
|
|
1754
|
+
? watchIds.some((id) => item[column_ref] === id)
|
|
1755
|
+
: watchId === item[column_ref];
|
|
1755
1756
|
return (jsxRuntime.jsx(react.Box, { cursor: "pointer", onClick: () => {
|
|
1756
1757
|
if (!isMultiple) {
|
|
1757
1758
|
setOpenSearchResult(false);
|
|
1758
|
-
setValue(column,
|
|
1759
|
+
setValue(column, item[column_ref]);
|
|
1759
1760
|
return;
|
|
1760
1761
|
}
|
|
1761
1762
|
const newSet = new Set([
|
|
1762
|
-
...(
|
|
1763
|
+
...(watchIds ?? []),
|
|
1763
1764
|
item[column_ref],
|
|
1764
1765
|
]);
|
|
1765
1766
|
setValue(column, [...newSet]);
|
|
@@ -2221,6 +2222,7 @@ const EnumPicker = ({ column, isMultiple = false }) => {
|
|
|
2221
2222
|
const [limit, setLimit] = React.useState(10);
|
|
2222
2223
|
const [openSearchResult, setOpenSearchResult] = React.useState();
|
|
2223
2224
|
const ref = React.useRef(null);
|
|
2225
|
+
const watchEnum = watch(column);
|
|
2224
2226
|
const watchEnums = (watch(column) ?? []);
|
|
2225
2227
|
const properties = (schema.properties[column] ?? {});
|
|
2226
2228
|
const dataList = properties.enum ?? [];
|
|
@@ -2244,17 +2246,19 @@ const EnumPicker = ({ column, isMultiple = false }) => {
|
|
|
2244
2246
|
setOpenSearchResult(true);
|
|
2245
2247
|
}, children: "Add" })] })), !isMultiple && (jsxRuntime.jsx(Button, { variant: "outline", onClick: () => {
|
|
2246
2248
|
setOpenSearchResult(true);
|
|
2247
|
-
}, children:
|
|
2249
|
+
}, children: watchEnum })), jsxRuntime.jsxs(PopoverRoot, { open: openSearchResult, onOpenChange: (e) => setOpenSearchResult(e.open), closeOnInteractOutside: true, initialFocusEl: () => ref.current, positioning: { placement: "bottom-start" }, children: [jsxRuntime.jsx(PopoverTrigger, {}), jsxRuntime.jsx(PopoverContent, { children: jsxRuntime.jsxs(PopoverBody, { children: [jsxRuntime.jsx(react.Input, { placeholder: "Type to search", onChange: (event) => {
|
|
2248
2250
|
onSearchChange(event);
|
|
2249
2251
|
setOpenSearchResult(true);
|
|
2250
2252
|
}, autoComplete: "off", ref: ref }), jsxRuntime.jsx(PopoverTitle, {}), jsxRuntime.jsxs(react.Grid, { gridTemplateColumns: "repeat(auto-fit, minmax(15rem, 1fr))", overflow: "auto", maxHeight: "50vh", children: [jsxRuntime.jsx(react.Text, { children: `Search Result: ${count}, Showing ${limit}` }), jsxRuntime.jsx(Button, { onClick: async () => {
|
|
2251
2253
|
setOpenSearchResult(false);
|
|
2252
2254
|
}, children: "close" }), jsxRuntime.jsx(react.Flex, { flexFlow: "column wrap", children: dataList.map((item) => {
|
|
2253
|
-
const selected =
|
|
2255
|
+
const selected = isMultiple
|
|
2256
|
+
? watchEnums.some((enumValue) => item === enumValue)
|
|
2257
|
+
: watchEnum == item;
|
|
2254
2258
|
return (jsxRuntime.jsx(react.Box, { cursor: "pointer", onClick: () => {
|
|
2255
2259
|
if (!isMultiple) {
|
|
2256
2260
|
setOpenSearchResult(false);
|
|
2257
|
-
setValue(column,
|
|
2261
|
+
setValue(column, item);
|
|
2258
2262
|
return;
|
|
2259
2263
|
}
|
|
2260
2264
|
const newSet = new Set([...(watchEnums ?? []), item]);
|
package/dist/index.mjs
CHANGED
|
@@ -1669,6 +1669,7 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1669
1669
|
serverUrl,
|
|
1670
1670
|
in_table: in_table,
|
|
1671
1671
|
limit: limit,
|
|
1672
|
+
where: [{ id: column_ref, value: watchId }],
|
|
1672
1673
|
});
|
|
1673
1674
|
const newMap = Object.fromEntries((data ?? { data: [] }).data.map((item) => {
|
|
1674
1675
|
return [
|
|
@@ -1694,15 +1695,13 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1694
1695
|
setSearchText(event.target.value);
|
|
1695
1696
|
setLimit(10);
|
|
1696
1697
|
};
|
|
1697
|
-
const
|
|
1698
|
+
const watchId = watch(column);
|
|
1699
|
+
const watchIds = (watch(column) ?? []);
|
|
1698
1700
|
const getPickedValue = () => {
|
|
1699
|
-
if (selectedIds.length <= 0) {
|
|
1700
|
-
return "";
|
|
1701
|
-
}
|
|
1702
1701
|
if (Object.keys(idMap).length <= 0) {
|
|
1703
1702
|
return "";
|
|
1704
1703
|
}
|
|
1705
|
-
const record = idMap[
|
|
1704
|
+
const record = idMap[watchId];
|
|
1706
1705
|
if (record === undefined) {
|
|
1707
1706
|
return "";
|
|
1708
1707
|
}
|
|
@@ -1715,7 +1714,7 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1715
1714
|
return jsx(Fragment, { children: "undefined" });
|
|
1716
1715
|
}
|
|
1717
1716
|
return (jsx(Tag, { closable: true, onClick: () => {
|
|
1718
|
-
setValue(column,
|
|
1717
|
+
setValue(column, watchIds.filter((id) => id != item[column_ref]));
|
|
1719
1718
|
}, children: !!renderDisplay === true
|
|
1720
1719
|
? renderDisplay(item)
|
|
1721
1720
|
: item[display_column] }));
|
|
@@ -1731,15 +1730,17 @@ const IdPicker = ({ column, in_table, column_ref, display_column, isMultiple = f
|
|
|
1731
1730
|
}, children: close ?? "Close" }), jsx(Flex, { flexFlow: "column wrap", children:
|
|
1732
1731
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1733
1732
|
dataList.map((item) => {
|
|
1734
|
-
const selected =
|
|
1733
|
+
const selected = isMultiple
|
|
1734
|
+
? watchIds.some((id) => item[column_ref] === id)
|
|
1735
|
+
: watchId === item[column_ref];
|
|
1735
1736
|
return (jsx(Box, { cursor: "pointer", onClick: () => {
|
|
1736
1737
|
if (!isMultiple) {
|
|
1737
1738
|
setOpenSearchResult(false);
|
|
1738
|
-
setValue(column,
|
|
1739
|
+
setValue(column, item[column_ref]);
|
|
1739
1740
|
return;
|
|
1740
1741
|
}
|
|
1741
1742
|
const newSet = new Set([
|
|
1742
|
-
...(
|
|
1743
|
+
...(watchIds ?? []),
|
|
1743
1744
|
item[column_ref],
|
|
1744
1745
|
]);
|
|
1745
1746
|
setValue(column, [...newSet]);
|
|
@@ -2201,6 +2202,7 @@ const EnumPicker = ({ column, isMultiple = false }) => {
|
|
|
2201
2202
|
const [limit, setLimit] = useState(10);
|
|
2202
2203
|
const [openSearchResult, setOpenSearchResult] = useState();
|
|
2203
2204
|
const ref = useRef(null);
|
|
2205
|
+
const watchEnum = watch(column);
|
|
2204
2206
|
const watchEnums = (watch(column) ?? []);
|
|
2205
2207
|
const properties = (schema.properties[column] ?? {});
|
|
2206
2208
|
const dataList = properties.enum ?? [];
|
|
@@ -2224,17 +2226,19 @@ const EnumPicker = ({ column, isMultiple = false }) => {
|
|
|
2224
2226
|
setOpenSearchResult(true);
|
|
2225
2227
|
}, children: "Add" })] })), !isMultiple && (jsx(Button, { variant: "outline", onClick: () => {
|
|
2226
2228
|
setOpenSearchResult(true);
|
|
2227
|
-
}, children:
|
|
2229
|
+
}, children: watchEnum })), jsxs(PopoverRoot, { open: openSearchResult, onOpenChange: (e) => setOpenSearchResult(e.open), closeOnInteractOutside: true, initialFocusEl: () => ref.current, positioning: { placement: "bottom-start" }, children: [jsx(PopoverTrigger, {}), jsx(PopoverContent, { children: jsxs(PopoverBody, { children: [jsx(Input, { placeholder: "Type to search", onChange: (event) => {
|
|
2228
2230
|
onSearchChange(event);
|
|
2229
2231
|
setOpenSearchResult(true);
|
|
2230
2232
|
}, autoComplete: "off", ref: ref }), jsx(PopoverTitle, {}), jsxs(Grid, { gridTemplateColumns: "repeat(auto-fit, minmax(15rem, 1fr))", overflow: "auto", maxHeight: "50vh", children: [jsx(Text, { children: `Search Result: ${count}, Showing ${limit}` }), jsx(Button, { onClick: async () => {
|
|
2231
2233
|
setOpenSearchResult(false);
|
|
2232
2234
|
}, children: "close" }), jsx(Flex, { flexFlow: "column wrap", children: dataList.map((item) => {
|
|
2233
|
-
const selected =
|
|
2235
|
+
const selected = isMultiple
|
|
2236
|
+
? watchEnums.some((enumValue) => item === enumValue)
|
|
2237
|
+
: watchEnum == item;
|
|
2234
2238
|
return (jsx(Box, { cursor: "pointer", onClick: () => {
|
|
2235
2239
|
if (!isMultiple) {
|
|
2236
2240
|
setOpenSearchResult(false);
|
|
2237
|
-
setValue(column,
|
|
2241
|
+
setValue(column, item);
|
|
2238
2242
|
return;
|
|
2239
2243
|
}
|
|
2240
2244
|
const newSet = new Set([...(watchEnums ?? []), item]);
|