@pdg/react-form 1.0.119 → 1.0.121
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.esm.js +19 -4
- package/dist/index.js +19 -4
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -3045,7 +3045,7 @@ FormRadioGroup.displayName = 'FormRadioGroup';
|
|
|
3045
3045
|
FormRadioGroup.defaultProps = FormRadioGroupDefaultProps;var FormToggleButtonGroupDefaultProps = {
|
|
3046
3046
|
type: 'button',
|
|
3047
3047
|
formValueSeparator: ',',
|
|
3048
|
-
};var css_248z$d = ".FormToggleButtonGroup .ToggleButton {\n display: inline-
|
|
3048
|
+
};var css_248z$d = ".FormToggleButtonGroup .ToggleButton {\n display: inline-flex;\n padding: 0 10px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n align-items: center;\n}\n.FormToggleButtonGroup .ToggleButton .__label__ {\n height: 0;\n line-height: 0 !important;\n overflow: visible !important;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton, .FormToggleButtonGroup.type-radio .ToggleButton {\n padding-left: 3px;\n padding-right: 5px;\n border: 0 !important;\n margin-left: 0 !important;\n justify-content: flex-start;\n display: flex;\n background-color: transparent !important;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton:not(:last-child), .FormToggleButtonGroup.type-radio .ToggleButton:not(:last-child) {\n margin-right: 5px;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__,\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__,\n.FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-unchecked__ {\n margin-right: 3px;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__ {\n display: none;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-checked__ {\n display: block;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-unchecked__ {\n display: none;\n}\n.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap {\n margin-top: 15px;\n margin-bottom: -15px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap {\n margin-top: 15px;\n margin-bottom: -15px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 13px;\n margin-bottom: -13px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 13px;\n margin-bottom: -13px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}\n.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}\n\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}";
|
|
3049
3049
|
styleInject(css_248z$d);var FormToggleButtonGroup = ToForwardRefExoticComponent(AutoTypeForwardRef(function (_a, ref) {
|
|
3050
3050
|
/********************************************************************************************************************
|
|
3051
3051
|
* type
|
|
@@ -3453,7 +3453,7 @@ styleInject(css_248z$d);var FormToggleButtonGroup = ToForwardRefExoticComponent(
|
|
|
3453
3453
|
React.createElement(React.Fragment, null,
|
|
3454
3454
|
React.createElement(Icon, { className: '__checkbox-unchecked__' }, "radio_button_unchecked"),
|
|
3455
3455
|
React.createElement(Icon, { className: '__checkbox-checked__' }, "radio_button_checked"))))),
|
|
3456
|
-
label));
|
|
3456
|
+
React.createElement("span", { className: '__label__' }, label)));
|
|
3457
3457
|
}));
|
|
3458
3458
|
}, [
|
|
3459
3459
|
color,
|
|
@@ -3976,6 +3976,17 @@ FormTextEditor.defaultProps = FormTextEditorDefaultProps;var FormAutocompleteDef
|
|
|
3976
3976
|
return {};
|
|
3977
3977
|
}
|
|
3978
3978
|
}, [items]);
|
|
3979
|
+
var itemsInfos = useMemo(function () {
|
|
3980
|
+
if (items) {
|
|
3981
|
+
return items.reduce(function (res, info) {
|
|
3982
|
+
res[info.value.toString()] = info;
|
|
3983
|
+
return res;
|
|
3984
|
+
}, {});
|
|
3985
|
+
}
|
|
3986
|
+
else {
|
|
3987
|
+
return {};
|
|
3988
|
+
}
|
|
3989
|
+
}, [items]);
|
|
3979
3990
|
var style = useMemo(function () {
|
|
3980
3991
|
var style = __assign({ minWidth: 120 }, initStyle);
|
|
3981
3992
|
if (hidden) {
|
|
@@ -4097,7 +4108,11 @@ FormTextEditor.defaultProps = FormTextEditorDefaultProps;var FormAutocompleteDef
|
|
|
4097
4108
|
if (notEmpty(finalValue)) {
|
|
4098
4109
|
if (items) {
|
|
4099
4110
|
if (Array.isArray(finalValue)) {
|
|
4100
|
-
|
|
4111
|
+
finalValue.forEach(function (v) {
|
|
4112
|
+
if (itemsInfos[v]) {
|
|
4113
|
+
newComponentValue && newComponentValue.push(itemsInfos[v]);
|
|
4114
|
+
}
|
|
4115
|
+
});
|
|
4101
4116
|
}
|
|
4102
4117
|
else {
|
|
4103
4118
|
newComponentValue = (items.find(function (info) { return info.value === value; }) ||
|
|
@@ -4124,7 +4139,7 @@ FormTextEditor.defaultProps = FormTextEditorDefaultProps;var FormAutocompleteDef
|
|
|
4124
4139
|
oldComponentValueRef.current = newComponentValue;
|
|
4125
4140
|
return newComponentValue;
|
|
4126
4141
|
}
|
|
4127
|
-
}, [value, multiple, items, valueItem]);
|
|
4142
|
+
}, [value, multiple, items, valueItem, itemsInfos]);
|
|
4128
4143
|
useEffect(function () {
|
|
4129
4144
|
if (async && onAsyncLoadValueItem) {
|
|
4130
4145
|
if (value != null) {
|
package/dist/index.js
CHANGED
|
@@ -3045,7 +3045,7 @@ FormRadioGroup.displayName = 'FormRadioGroup';
|
|
|
3045
3045
|
FormRadioGroup.defaultProps = FormRadioGroupDefaultProps;var FormToggleButtonGroupDefaultProps = {
|
|
3046
3046
|
type: 'button',
|
|
3047
3047
|
formValueSeparator: ',',
|
|
3048
|
-
};var css_248z$d = ".FormToggleButtonGroup .ToggleButton {\n display: inline-
|
|
3048
|
+
};var css_248z$d = ".FormToggleButtonGroup .ToggleButton {\n display: inline-flex;\n padding: 0 10px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n align-items: center;\n}\n.FormToggleButtonGroup .ToggleButton .__label__ {\n height: 0;\n line-height: 0 !important;\n overflow: visible !important;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton, .FormToggleButtonGroup.type-radio .ToggleButton {\n padding-left: 3px;\n padding-right: 5px;\n border: 0 !important;\n margin-left: 0 !important;\n justify-content: flex-start;\n display: flex;\n background-color: transparent !important;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton:not(:last-child), .FormToggleButtonGroup.type-radio .ToggleButton:not(:last-child) {\n margin-right: 5px;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__,\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__,\n.FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-unchecked__ {\n margin-right: 3px;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__ {\n display: none;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-checked__ {\n display: block;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-unchecked__ {\n display: none;\n}\n.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap {\n margin-top: 15px;\n margin-bottom: -15px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap {\n margin-top: 15px;\n margin-bottom: -15px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 13px;\n margin-bottom: -13px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 13px;\n margin-bottom: -13px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}\n.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}\n\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}";
|
|
3049
3049
|
styleInject(css_248z$d);var FormToggleButtonGroup = ToForwardRefExoticComponent(AutoTypeForwardRef(function (_a, ref) {
|
|
3050
3050
|
/********************************************************************************************************************
|
|
3051
3051
|
* type
|
|
@@ -3453,7 +3453,7 @@ styleInject(css_248z$d);var FormToggleButtonGroup = ToForwardRefExoticComponent(
|
|
|
3453
3453
|
React.createElement(React.Fragment, null,
|
|
3454
3454
|
React.createElement(material.Icon, { className: '__checkbox-unchecked__' }, "radio_button_unchecked"),
|
|
3455
3455
|
React.createElement(material.Icon, { className: '__checkbox-checked__' }, "radio_button_checked"))))),
|
|
3456
|
-
label));
|
|
3456
|
+
React.createElement("span", { className: '__label__' }, label)));
|
|
3457
3457
|
}));
|
|
3458
3458
|
}, [
|
|
3459
3459
|
color,
|
|
@@ -3976,6 +3976,17 @@ FormTextEditor.defaultProps = FormTextEditorDefaultProps;var FormAutocompleteDef
|
|
|
3976
3976
|
return {};
|
|
3977
3977
|
}
|
|
3978
3978
|
}, [items]);
|
|
3979
|
+
var itemsInfos = React.useMemo(function () {
|
|
3980
|
+
if (items) {
|
|
3981
|
+
return items.reduce(function (res, info) {
|
|
3982
|
+
res[info.value.toString()] = info;
|
|
3983
|
+
return res;
|
|
3984
|
+
}, {});
|
|
3985
|
+
}
|
|
3986
|
+
else {
|
|
3987
|
+
return {};
|
|
3988
|
+
}
|
|
3989
|
+
}, [items]);
|
|
3979
3990
|
var style = React.useMemo(function () {
|
|
3980
3991
|
var style = __assign({ minWidth: 120 }, initStyle);
|
|
3981
3992
|
if (hidden) {
|
|
@@ -4097,7 +4108,11 @@ FormTextEditor.defaultProps = FormTextEditorDefaultProps;var FormAutocompleteDef
|
|
|
4097
4108
|
if (util.notEmpty(finalValue)) {
|
|
4098
4109
|
if (items) {
|
|
4099
4110
|
if (Array.isArray(finalValue)) {
|
|
4100
|
-
|
|
4111
|
+
finalValue.forEach(function (v) {
|
|
4112
|
+
if (itemsInfos[v]) {
|
|
4113
|
+
newComponentValue && newComponentValue.push(itemsInfos[v]);
|
|
4114
|
+
}
|
|
4115
|
+
});
|
|
4101
4116
|
}
|
|
4102
4117
|
else {
|
|
4103
4118
|
newComponentValue = (items.find(function (info) { return info.value === value; }) ||
|
|
@@ -4124,7 +4139,7 @@ FormTextEditor.defaultProps = FormTextEditorDefaultProps;var FormAutocompleteDef
|
|
|
4124
4139
|
oldComponentValueRef.current = newComponentValue;
|
|
4125
4140
|
return newComponentValue;
|
|
4126
4141
|
}
|
|
4127
|
-
}, [value, multiple, items, valueItem]);
|
|
4142
|
+
}, [value, multiple, items, valueItem, itemsInfos]);
|
|
4128
4143
|
React.useEffect(function () {
|
|
4129
4144
|
if (async && onAsyncLoadValueItem) {
|
|
4130
4145
|
if (value != null) {
|