@bsol-oss/react-datatable5 12.0.0-beta.42 → 12.0.0-beta.43
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.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -3651,13 +3651,17 @@ const ArrayRenderer = ({ schema, column, prefix, }) => {
|
|
|
3651
3651
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
3652
3652
|
const { formState: { errors }, setValue, watch, } = reactHookForm.useFormContext();
|
|
3653
3653
|
const fields = (watch(colLabel) ?? []);
|
|
3654
|
-
return (jsxRuntime.jsxs(react.
|
|
3655
|
-
|
|
3656
|
-
|
|
3657
|
-
|
|
3658
|
-
|
|
3659
|
-
|
|
3660
|
-
|
|
3654
|
+
return (jsxRuntime.jsxs(react.Flex, { gridRow, gridColumn, flexFlow: "column", gap: 2, children: [jsxRuntime.jsxs(react.Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsxRuntime.jsx("span", { children: "*" })] }), jsxRuntime.jsx(react.Flex, { flexFlow: "column", gap: 2, children: fields.map((field, index) => (jsxRuntime.jsxs(react.Flex, { flexFlow: "row", gap: 2, bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: 2, borderRadius: 4, borderWidth: 1, borderColor: {
|
|
3655
|
+
base: "colorPalette.200",
|
|
3656
|
+
_dark: "colorPalette.800",
|
|
3657
|
+
}, children: [jsxRuntime.jsx(react.Grid, { gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", children: jsxRuntime.jsx(SchemaRenderer, { column: `${index}`,
|
|
3658
|
+
prefix: `${colLabel}.`,
|
|
3659
|
+
// @ts-expect-error find suitable types
|
|
3660
|
+
schema: { showTitle: false, ...(items ?? {}) } }) }), jsxRuntime.jsx(react.Flex, { justifyContent: "end", children: jsxRuntime.jsx(react.Button, { variant: "ghost", onClick: () => {
|
|
3661
|
+
setValue(colLabel, fields.filter((_, curIndex) => {
|
|
3662
|
+
return curIndex !== index;
|
|
3663
|
+
}));
|
|
3664
|
+
}, children: jsxRuntime.jsx(react.Icon, { children: jsxRuntime.jsx(cg.CgTrash, {}) }) }) })] }, `${colLabel}.${index}`))) }), jsxRuntime.jsx(react.Flex, { children: jsxRuntime.jsx(react.Button, { onClick: () => {
|
|
3661
3665
|
if (type === "number") {
|
|
3662
3666
|
setValue(colLabel, [...fields, 0]);
|
|
3663
3667
|
return;
|
|
@@ -4545,7 +4549,7 @@ const NumberInputField = ({ schema, column, prefix, }) => {
|
|
|
4545
4549
|
};
|
|
4546
4550
|
|
|
4547
4551
|
const ObjectInput = ({ schema, column, prefix }) => {
|
|
4548
|
-
const { properties, gridColumn = "span 12", gridRow = "span 1", required, } = schema;
|
|
4552
|
+
const { properties, gridColumn = "span 12", gridRow = "span 1", required, showTitle = true, } = schema;
|
|
4549
4553
|
const { translate } = useSchemaContext();
|
|
4550
4554
|
const colLabel = `${prefix}${column}`;
|
|
4551
4555
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
@@ -4553,7 +4557,10 @@ const ObjectInput = ({ schema, column, prefix }) => {
|
|
|
4553
4557
|
if (properties === undefined) {
|
|
4554
4558
|
throw new Error(`properties is undefined when using ObjectInput`);
|
|
4555
4559
|
}
|
|
4556
|
-
return (jsxRuntime.jsxs(react.Box, { gridRow, gridColumn, children: [jsxRuntime.jsxs(react.Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsxRuntime.jsx("span", { children: "*" })] }), jsxRuntime.jsx(react.Grid, {
|
|
4560
|
+
return (jsxRuntime.jsxs(react.Box, { gridRow, gridColumn, children: [showTitle && (jsxRuntime.jsxs(react.Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsxRuntime.jsx("span", { children: "*" })] })), jsxRuntime.jsx(react.Grid, { bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: 2, borderRadius: 4, borderWidth: 1, borderColor: {
|
|
4561
|
+
base: "colorPalette.200",
|
|
4562
|
+
_dark: "colorPalette.800",
|
|
4563
|
+
}, gap: "4", padding: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", children: Object.keys(properties ?? {}).map((key) => {
|
|
4557
4564
|
return (
|
|
4558
4565
|
// @ts-expect-error find suitable types
|
|
4559
4566
|
jsxRuntime.jsx(ColumnRenderer, { column: `${key}`,
|
|
@@ -4955,15 +4962,19 @@ const ColumnRenderer = ({ column, properties, prefix, }) => {
|
|
|
4955
4962
|
};
|
|
4956
4963
|
|
|
4957
4964
|
const ArrayViewer = ({ schema, column, prefix }) => {
|
|
4958
|
-
const { gridColumn = "span
|
|
4965
|
+
const { gridColumn = "span 12", gridRow = "span 1", required, items, } = schema;
|
|
4959
4966
|
const { translate } = useSchemaContext();
|
|
4960
4967
|
const colLabel = `${prefix}${column}`;
|
|
4961
4968
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
4962
4969
|
const { watch, formState: { errors }, } = reactHookForm.useFormContext();
|
|
4963
4970
|
const values = watch(colLabel) ?? [];
|
|
4964
|
-
return (jsxRuntime.jsxs(react.Box, { gridRow, gridColumn, children: [jsxRuntime.jsxs(react.Box, { as: "label", gridColumn: "1/span12", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsxRuntime.jsx("span", { children: "*" })] }), values.map((field, index) => (jsxRuntime.jsx(react.Flex, { flexFlow: "column",
|
|
4965
|
-
|
|
4966
|
-
|
|
4971
|
+
return (jsxRuntime.jsxs(react.Box, { gridRow, gridColumn, children: [jsxRuntime.jsxs(react.Box, { as: "label", gridColumn: "1/span12", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsxRuntime.jsx("span", { children: "*" })] }), jsxRuntime.jsx(react.Flex, { flexFlow: "column", gap: 1, children: values.map((field, index) => (jsxRuntime.jsx(react.Flex, { flexFlow: "column", bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: "2", borderRadius: "md", borderWidth: "thin", borderColor: {
|
|
4972
|
+
base: "colorPalette.200",
|
|
4973
|
+
_dark: "colorPalette.800",
|
|
4974
|
+
}, children: jsxRuntime.jsx(react.Grid, { gap: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", children: jsxRuntime.jsx(SchemaViewer, { column: `${index}`,
|
|
4975
|
+
prefix: `${colLabel}.`,
|
|
4976
|
+
// @ts-expect-error find suitable types
|
|
4977
|
+
schema: { showTitle: false, ...(items ?? {}) } }) }) }, `form-${prefix}${column}.${index}`))) }), errors[`${column}`] && (jsxRuntime.jsx(react.Text, { color: "red.400", children: translate.t(removeIndex(`${colLabel}.field_required`)) }))] }));
|
|
4967
4978
|
};
|
|
4968
4979
|
|
|
4969
4980
|
const BooleanViewer = ({ schema, column, prefix, }) => {
|
|
@@ -5078,7 +5089,7 @@ const NumberViewer = ({ schema, column, prefix, }) => {
|
|
|
5078
5089
|
};
|
|
5079
5090
|
|
|
5080
5091
|
const ObjectViewer = ({ schema, column, prefix }) => {
|
|
5081
|
-
const { properties, gridColumn = "span 12", gridRow = "span 1", required, } = schema;
|
|
5092
|
+
const { properties, gridColumn = "span 12", gridRow = "span 1", required, showTitle = true, } = schema;
|
|
5082
5093
|
const { translate } = useSchemaContext();
|
|
5083
5094
|
const colLabel = `${prefix}${column}`;
|
|
5084
5095
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
@@ -5086,8 +5097,10 @@ const ObjectViewer = ({ schema, column, prefix }) => {
|
|
|
5086
5097
|
if (properties === undefined) {
|
|
5087
5098
|
throw new Error(`properties is undefined when using ObjectInput`);
|
|
5088
5099
|
}
|
|
5089
|
-
return (jsxRuntime.jsxs(react.Box, { gridRow, gridColumn, children: [jsxRuntime.jsxs(react.Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsxRuntime.jsx("span", { children: "*" })] }), jsxRuntime.jsx(react.Grid, { gap: "4", padding: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row",
|
|
5090
|
-
|
|
5100
|
+
return (jsxRuntime.jsxs(react.Box, { gridRow, gridColumn, children: [showTitle && (jsxRuntime.jsxs(react.Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsxRuntime.jsx("span", { children: "*" })] })), jsxRuntime.jsx(react.Grid, { gap: "4", padding: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: "1", borderRadius: "md", borderWidth: "thin", borderColor: {
|
|
5101
|
+
base: "colorPalette.200",
|
|
5102
|
+
_dark: "colorPalette.800",
|
|
5103
|
+
}, children: Object.keys(properties ?? {}).map((key) => {
|
|
5091
5104
|
return (
|
|
5092
5105
|
// @ts-expect-error find suitable types
|
|
5093
5106
|
jsxRuntime.jsx(ColumnViewer, { column: `${key}`,
|
package/dist/index.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import { LuX, LuCheck, LuChevronRight, LuChevronDown } from 'react-icons/lu';
|
|
|
7
7
|
import { MdOutlineSort, MdFilterAlt, MdSearch, MdClose, MdOutlineViewColumn, MdFilterListAlt, MdPushPin, MdCancel, MdClear, MdOutlineChecklist, MdDateRange } from 'react-icons/md';
|
|
8
8
|
import { FaUpDown, FaGripLinesVertical } from 'react-icons/fa6';
|
|
9
9
|
import { BiDownArrow, BiUpArrow, BiError } from 'react-icons/bi';
|
|
10
|
-
import { CgClose } from 'react-icons/cg';
|
|
10
|
+
import { CgClose, CgTrash } from 'react-icons/cg';
|
|
11
11
|
import Dayzed from '@bsol-oss/dayzed-react19';
|
|
12
12
|
import { HiMiniEllipsisHorizontal, HiChevronLeft, HiChevronRight } from 'react-icons/hi2';
|
|
13
13
|
import { IoMdEye, IoMdCheckbox, IoMdClock } from 'react-icons/io';
|
|
@@ -3631,13 +3631,17 @@ const ArrayRenderer = ({ schema, column, prefix, }) => {
|
|
|
3631
3631
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
3632
3632
|
const { formState: { errors }, setValue, watch, } = useFormContext();
|
|
3633
3633
|
const fields = (watch(colLabel) ?? []);
|
|
3634
|
-
return (jsxs(
|
|
3635
|
-
|
|
3636
|
-
|
|
3637
|
-
|
|
3638
|
-
|
|
3639
|
-
|
|
3640
|
-
|
|
3634
|
+
return (jsxs(Flex, { gridRow, gridColumn, flexFlow: "column", gap: 2, children: [jsxs(Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsx("span", { children: "*" })] }), jsx(Flex, { flexFlow: "column", gap: 2, children: fields.map((field, index) => (jsxs(Flex, { flexFlow: "row", gap: 2, bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: 2, borderRadius: 4, borderWidth: 1, borderColor: {
|
|
3635
|
+
base: "colorPalette.200",
|
|
3636
|
+
_dark: "colorPalette.800",
|
|
3637
|
+
}, children: [jsx(Grid, { gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", children: jsx(SchemaRenderer, { column: `${index}`,
|
|
3638
|
+
prefix: `${colLabel}.`,
|
|
3639
|
+
// @ts-expect-error find suitable types
|
|
3640
|
+
schema: { showTitle: false, ...(items ?? {}) } }) }), jsx(Flex, { justifyContent: "end", children: jsx(Button$1, { variant: "ghost", onClick: () => {
|
|
3641
|
+
setValue(colLabel, fields.filter((_, curIndex) => {
|
|
3642
|
+
return curIndex !== index;
|
|
3643
|
+
}));
|
|
3644
|
+
}, children: jsx(Icon, { children: jsx(CgTrash, {}) }) }) })] }, `${colLabel}.${index}`))) }), jsx(Flex, { children: jsx(Button$1, { onClick: () => {
|
|
3641
3645
|
if (type === "number") {
|
|
3642
3646
|
setValue(colLabel, [...fields, 0]);
|
|
3643
3647
|
return;
|
|
@@ -4525,7 +4529,7 @@ const NumberInputField = ({ schema, column, prefix, }) => {
|
|
|
4525
4529
|
};
|
|
4526
4530
|
|
|
4527
4531
|
const ObjectInput = ({ schema, column, prefix }) => {
|
|
4528
|
-
const { properties, gridColumn = "span 12", gridRow = "span 1", required, } = schema;
|
|
4532
|
+
const { properties, gridColumn = "span 12", gridRow = "span 1", required, showTitle = true, } = schema;
|
|
4529
4533
|
const { translate } = useSchemaContext();
|
|
4530
4534
|
const colLabel = `${prefix}${column}`;
|
|
4531
4535
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
@@ -4533,7 +4537,10 @@ const ObjectInput = ({ schema, column, prefix }) => {
|
|
|
4533
4537
|
if (properties === undefined) {
|
|
4534
4538
|
throw new Error(`properties is undefined when using ObjectInput`);
|
|
4535
4539
|
}
|
|
4536
|
-
return (jsxs(Box, { gridRow, gridColumn, children: [jsxs(Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsx("span", { children: "*" })] }), jsx(Grid, {
|
|
4540
|
+
return (jsxs(Box, { gridRow, gridColumn, children: [showTitle && (jsxs(Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsx("span", { children: "*" })] })), jsx(Grid, { bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: 2, borderRadius: 4, borderWidth: 1, borderColor: {
|
|
4541
|
+
base: "colorPalette.200",
|
|
4542
|
+
_dark: "colorPalette.800",
|
|
4543
|
+
}, gap: "4", padding: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", children: Object.keys(properties ?? {}).map((key) => {
|
|
4537
4544
|
return (
|
|
4538
4545
|
// @ts-expect-error find suitable types
|
|
4539
4546
|
jsx(ColumnRenderer, { column: `${key}`,
|
|
@@ -4935,15 +4942,19 @@ const ColumnRenderer = ({ column, properties, prefix, }) => {
|
|
|
4935
4942
|
};
|
|
4936
4943
|
|
|
4937
4944
|
const ArrayViewer = ({ schema, column, prefix }) => {
|
|
4938
|
-
const { gridColumn = "span
|
|
4945
|
+
const { gridColumn = "span 12", gridRow = "span 1", required, items, } = schema;
|
|
4939
4946
|
const { translate } = useSchemaContext();
|
|
4940
4947
|
const colLabel = `${prefix}${column}`;
|
|
4941
4948
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
4942
4949
|
const { watch, formState: { errors }, } = useFormContext();
|
|
4943
4950
|
const values = watch(colLabel) ?? [];
|
|
4944
|
-
return (jsxs(Box, { gridRow, gridColumn, children: [jsxs(Box, { as: "label", gridColumn: "1/span12", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsx("span", { children: "*" })] }), values.map((field, index) => (jsx(Flex, { flexFlow: "column",
|
|
4945
|
-
|
|
4946
|
-
|
|
4951
|
+
return (jsxs(Box, { gridRow, gridColumn, children: [jsxs(Box, { as: "label", gridColumn: "1/span12", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsx("span", { children: "*" })] }), jsx(Flex, { flexFlow: "column", gap: 1, children: values.map((field, index) => (jsx(Flex, { flexFlow: "column", bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: "2", borderRadius: "md", borderWidth: "thin", borderColor: {
|
|
4952
|
+
base: "colorPalette.200",
|
|
4953
|
+
_dark: "colorPalette.800",
|
|
4954
|
+
}, children: jsx(Grid, { gap: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", children: jsx(SchemaViewer, { column: `${index}`,
|
|
4955
|
+
prefix: `${colLabel}.`,
|
|
4956
|
+
// @ts-expect-error find suitable types
|
|
4957
|
+
schema: { showTitle: false, ...(items ?? {}) } }) }) }, `form-${prefix}${column}.${index}`))) }), errors[`${column}`] && (jsx(Text, { color: "red.400", children: translate.t(removeIndex(`${colLabel}.field_required`)) }))] }));
|
|
4947
4958
|
};
|
|
4948
4959
|
|
|
4949
4960
|
const BooleanViewer = ({ schema, column, prefix, }) => {
|
|
@@ -5058,7 +5069,7 @@ const NumberViewer = ({ schema, column, prefix, }) => {
|
|
|
5058
5069
|
};
|
|
5059
5070
|
|
|
5060
5071
|
const ObjectViewer = ({ schema, column, prefix }) => {
|
|
5061
|
-
const { properties, gridColumn = "span 12", gridRow = "span 1", required, } = schema;
|
|
5072
|
+
const { properties, gridColumn = "span 12", gridRow = "span 1", required, showTitle = true, } = schema;
|
|
5062
5073
|
const { translate } = useSchemaContext();
|
|
5063
5074
|
const colLabel = `${prefix}${column}`;
|
|
5064
5075
|
const isRequired = required?.some((columnId) => columnId === column);
|
|
@@ -5066,8 +5077,10 @@ const ObjectViewer = ({ schema, column, prefix }) => {
|
|
|
5066
5077
|
if (properties === undefined) {
|
|
5067
5078
|
throw new Error(`properties is undefined when using ObjectInput`);
|
|
5068
5079
|
}
|
|
5069
|
-
return (jsxs(Box, { gridRow, gridColumn, children: [jsxs(Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsx("span", { children: "*" })] }), jsx(Grid, { gap: "4", padding: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row",
|
|
5070
|
-
|
|
5080
|
+
return (jsxs(Box, { gridRow, gridColumn, children: [showTitle && (jsxs(Box, { as: "label", children: [`${translate.t(removeIndex(`${colLabel}.field_label`))}`, isRequired && jsx("span", { children: "*" })] })), jsx(Grid, { gap: "4", padding: "4", gridTemplateColumns: "repeat(12, 1fr)", autoFlow: "row", bgColor: { base: "colorPalette.100", _dark: "colorPalette.900" }, p: "1", borderRadius: "md", borderWidth: "thin", borderColor: {
|
|
5081
|
+
base: "colorPalette.200",
|
|
5082
|
+
_dark: "colorPalette.800",
|
|
5083
|
+
}, children: Object.keys(properties ?? {}).map((key) => {
|
|
5071
5084
|
return (
|
|
5072
5085
|
// @ts-expect-error find suitable types
|
|
5073
5086
|
jsx(ColumnViewer, { column: `${key}`,
|