@jsonforms/material-renderers 3.7.0-alpha.1 → 3.7.0-alpha.3

package/lib/jsonforms-react-material.cjs.js

@@ -1064,17 +1064,19 @@ var materialBooleanToggleControlTester = core.rankWith(3, core.and(core.isBoolea
 var MaterialBooleanToggleControl$1 = react.withJsonFormsControlProps(MaterialBooleanToggleControl);
 
 var MaterialDateControl = function (props) {
-    var _a, _b, _c;
-    var _d = useFocus(), focused = _d[0], onFocus = _d[1], onBlur = _d[2];
+    var _a, _b, _c, _d;
+    var _e = useFocus(), focused = _e[0], onFocus = _e[1], onBlur = _e[2];
+    var inputVariant = useInputVariant();
     var description = props.description, id = props.id, errors = props.errors, label = props.label, uischema = props.uischema, visible = props.visible, enabled = props.enabled, required = props.required, path = props.path, handleChange = props.handleChange, data = props.data, config = props.config;
     var isValid = errors.length === 0;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
-    var _e = React.useState(0), key = _e[0], setKey = _e[1];
-    var _f = React.useState(false), open = _f[0], setOpen = _f[1];
+    var _f = React.useState(0), key = _f[0], setKey = _f[1];
+    var _g = React.useState(false), open = _g[0], setOpen = _g[1];
     var format = (_a = appliedUiSchemaOptions.dateFormat) !== null && _a !== void 0 ? _a : 'YYYY-MM-DD';
     var saveFormat = (_b = appliedUiSchemaOptions.dateSaveFormat) !== null && _b !== void 0 ? _b : core.defaultDateFormat;
     var views = (_c = appliedUiSchemaOptions.views) !== null && _c !== void 0 ? _c : ['year', 'day'];
+    var closeOnSelect = (_d = appliedUiSchemaOptions.closeOnSelect) !== null && _d !== void 0 ? _d : true;
     var firstFormHelperText = showDescription
         ? description
         : !isValid
@@ -1085,31 +1087,32 @@ var MaterialDateControl = function (props) {
     var onChange = React.useMemo(function () { return createOnChangeHandler(path, handleChange, saveFormat); }, [path, handleChange, saveFormat]);
     var onBlurHandler = React.useMemo(function () {
         return createOnBlurHandler(path, handleChange, format, saveFormat, updateChild, onBlur);
-    }, [path, handleChange, format, saveFormat, updateChild]);
+    }, [path, handleChange, format, saveFormat, updateChild, onBlur]);
     var value = getData(data, saveFormat);
     if (!visible) {
         return null;
     }
     return (React__default["default"].createElement(xDatePickers.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs },
-        React__default["default"].createElement(xDatePickers.DatePicker, { open: open, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, key: key, label: label, value: value, onAccept: onChange, format: format, views: views, disabled: !enabled, slotProps: {
+        React__default["default"].createElement(xDatePickers.DatePicker, { open: open, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, key: key, label: label, value: value, onAccept: onChange, format: format, views: views, disabled: !enabled, closeOnSelect: closeOnSelect, slotProps: {
                 actionBar: function (_a) {
-                    var wrapperVariant = _a.wrapperVariant;
+                    var pickerVariant = _a.pickerVariant;
                     return ({
-                        actions: wrapperVariant === 'desktop' ? [] : ['clear', 'cancel', 'accept'],
+                        actions: pickerVariant === 'desktop' ? [] : ['clear', 'cancel', 'accept'],
                     });
                 },
                 textField: {
                     id: id + '-input',
                     required: required && !appliedUiSchemaOptions.hideRequiredAsterisk,
-                    autoFocus: appliedUiSchemaOptions.focus,
                     error: !isValid,
                     fullWidth: !appliedUiSchemaOptions.trim,
+                    variant: inputVariant,
                     inputProps: {
+                        autoFocus: appliedUiSchemaOptions.focus,
                         type: 'text',
+                        onFocus: onFocus,
+                        onBlur: onBlurHandler,
                     },
                     InputLabelProps: data ? { shrink: true } : undefined,
-                    onFocus: onFocus,
-                    onBlur: onBlurHandler,
                 },
             } }),
         React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
@@ -1119,22 +1122,24 @@ var materialDateControlTester = core.rankWith(4, core.isDateControl);
 var MaterialDateControl$1 = react.withJsonFormsControlProps(MaterialDateControl);
 
 var MaterialDateTimeControl = function (props) {
-    var _a, _b, _c;
-    var _d = useFocus(), focused = _d[0], onFocus = _d[1], onBlur = _d[2];
+    var _a, _b, _c, _d;
+    var _e = useFocus(), focused = _e[0], onFocus = _e[1], onBlur = _e[2];
+    var inputVariant = useInputVariant();
     var id = props.id, description = props.description, errors = props.errors, label = props.label, uischema = props.uischema, visible = props.visible, enabled = props.enabled, required = props.required, path = props.path, handleChange = props.handleChange, data = props.data, config = props.config;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var isValid = errors.length === 0;
     var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
     var format = (_a = appliedUiSchemaOptions.dateTimeFormat) !== null && _a !== void 0 ? _a : 'YYYY-MM-DD HH:mm';
     var saveFormat = (_b = appliedUiSchemaOptions.dateTimeSaveFormat) !== null && _b !== void 0 ? _b : core.defaultDateTimeFormat;
-    var _e = React.useState(0), key = _e[0], setKey = _e[1];
-    var _f = React.useState(false), open = _f[0], setOpen = _f[1];
+    var _f = React.useState(0), key = _f[0], setKey = _f[1];
+    var _g = React.useState(false), open = _g[0], setOpen = _g[1];
     var views = (_c = appliedUiSchemaOptions.views) !== null && _c !== void 0 ? _c : [
         'year',
         'day',
         'hours',
         'minutes',
     ];
+    var closeOnSelect = (_d = appliedUiSchemaOptions.closeOnSelect) !== null && _d !== void 0 ? _d : true;
     var firstFormHelperText = showDescription
         ? description
         : !isValid
@@ -1151,25 +1156,26 @@ var MaterialDateTimeControl = function (props) {
         return null;
     }
     return (React__default["default"].createElement(xDatePickers.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs },
-        React__default["default"].createElement(xDatePickers.DateTimePicker, { open: open, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, key: key, label: label, value: value, onAccept: onChange, format: format, ampm: !!appliedUiSchemaOptions.ampm, views: views, disabled: !enabled, slotProps: {
+        React__default["default"].createElement(xDatePickers.DateTimePicker, { open: open, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, key: key, label: label, value: value, onAccept: onChange, onChange: onChange, format: format, ampm: !!appliedUiSchemaOptions.ampm, views: views, closeOnSelect: closeOnSelect, disabled: !enabled, slotProps: {
                 actionBar: function (_a) {
-                    var wrapperVariant = _a.wrapperVariant;
+                    var pickerVariant = _a.pickerVariant;
                     return ({
-                        actions: wrapperVariant === 'desktop' ? [] : ['clear', 'cancel', 'accept'],
+                        actions: pickerVariant === 'desktop' ? [] : ['clear', 'cancel', 'accept'],
                     });
                 },
                 textField: {
                     id: id + '-input',
                     required: required && !appliedUiSchemaOptions.hideRequiredAsterisk,
-                    autoFocus: appliedUiSchemaOptions.focus,
                     error: !isValid,
                     fullWidth: !appliedUiSchemaOptions.trim,
+                    variant: inputVariant,
                     inputProps: {
+                        autoFocus: appliedUiSchemaOptions.focus,
                         type: 'text',
+                        onFocus: onFocus,
+                        onBlur: onBlurHandler,
                     },
                     InputLabelProps: data ? { shrink: true } : undefined,
-                    onFocus: onFocus,
-                    onBlur: onBlurHandler,
                 },
             } }),
         React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
@@ -1291,17 +1297,19 @@ var materialTextControlTester = core.rankWith(1, core.isStringControl);
 var MaterialTextControl$1 = react.withJsonFormsControlProps(MaterialTextControl);
 
 var MaterialTimeControl = function (props) {
-    var _a, _b, _c;
-    var _d = useFocus(), focused = _d[0], onFocus = _d[1], onBlur = _d[2];
+    var _a, _b, _c, _d;
+    var _e = useFocus(), focused = _e[0], onFocus = _e[1], onBlur = _e[2];
+    var inputVariant = useInputVariant();
     var id = props.id, description = props.description, errors = props.errors, label = props.label, uischema = props.uischema, visible = props.visible, enabled = props.enabled, required = props.required, path = props.path, handleChange = props.handleChange, data = props.data, config = props.config;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var isValid = errors.length === 0;
-    var _e = React.useState(0), key = _e[0], setKey = _e[1];
-    var _f = React.useState(false), open = _f[0], setOpen = _f[1];
+    var _f = React.useState(0), key = _f[0], setKey = _f[1];
+    var _g = React.useState(false), open = _g[0], setOpen = _g[1];
     var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
     var format = (_a = appliedUiSchemaOptions.timeFormat) !== null && _a !== void 0 ? _a : 'HH:mm';
     var saveFormat = (_b = appliedUiSchemaOptions.timeSaveFormat) !== null && _b !== void 0 ? _b : core.defaultTimeFormat;
     var views = (_c = appliedUiSchemaOptions.views) !== null && _c !== void 0 ? _c : ['hours', 'minutes'];
+    var closeOnSelect = (_d = appliedUiSchemaOptions.closeOnSelect) !== null && _d !== void 0 ? _d : true;
     var firstFormHelperText = showDescription
         ? description
         : !isValid
@@ -1318,25 +1326,26 @@ var MaterialTimeControl = function (props) {
         return null;
     }
     return (React__default["default"].createElement(xDatePickers.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs },
-        React__default["default"].createElement(xDatePickers.TimePicker, { open: open, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, key: key, label: label, value: value, onAccept: onChange, format: format, ampm: !!appliedUiSchemaOptions.ampm, views: views, disabled: !enabled, slotProps: {
+        React__default["default"].createElement(xDatePickers.TimePicker, { open: open, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, key: key, label: label, value: value, onAccept: onChange, onChange: onChange, format: format, ampm: !!appliedUiSchemaOptions.ampm, views: views, closeOnSelect: closeOnSelect, disabled: !enabled, slotProps: {
                 actionBar: function (_a) {
-                    var wrapperVariant = _a.wrapperVariant;
+                    var pickerVariant = _a.pickerVariant;
                     return ({
-                        actions: wrapperVariant === 'desktop' ? [] : ['clear', 'cancel', 'accept'],
+                        actions: pickerVariant === 'desktop' ? [] : ['clear', 'cancel', 'accept'],
                     });
                 },
                 textField: {
                     id: id + '-input',
                     required: required && !appliedUiSchemaOptions.hideRequiredAsterisk,
-                    autoFocus: appliedUiSchemaOptions.focus,
                     error: !isValid,
                     fullWidth: !appliedUiSchemaOptions.trim,
+                    variant: inputVariant,
                     inputProps: {
+                        autoFocus: appliedUiSchemaOptions.focus,
                         type: 'text',
+                        onBlur: onBlurHandler,
+                        onFocus: onFocus,
                     },
                     InputLabelProps: data ? { shrink: true } : undefined,
-                    onFocus: onFocus,
-                    onBlur: onBlurHandler,
                 },
             } }),
         React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
@@ -1520,15 +1529,15 @@ var isSingleLevelCategorization = core.and(core.uiTypeIs('Categorization'), func
 });
 var materialCategorizationTester = core.rankWith(1, isSingleLevelCategorization);
 var MaterialCategorizationLayoutRenderer = function (props) {
-    var data = props.data, path = props.path, renderers = props.renderers, cells = props.cells, schema = props.schema, uischema = props.uischema, visible = props.visible, enabled = props.enabled, selected = props.selected, onChange = props.onChange, ajv = props.ajv, t = props.t;
+    var data = props.data, path = props.path, renderers = props.renderers, cells = props.cells, schema = props.schema, uischema = props.uischema, visible = props.visible, enabled = props.enabled, selected = props.selected, onChange = props.onChange, config = props.config, ajv = props.ajv, t = props.t;
     var categorization = uischema;
     var _a = React.useState(uischema), previousCategorization = _a[0], setPreviousCategorization = _a[1];
     var _b = React.useState(selected !== null && selected !== void 0 ? selected : 0), activeCategory = _b[0], setActiveCategory = _b[1];
     var categories = React.useMemo(function () {
         return categorization.elements.filter(function (category) {
-            return core.isVisible(category, data, undefined, ajv);
+            return core.isVisible(category, data, undefined, ajv, config);
         });
-    }, [categorization, data, ajv]);
+    }, [categorization, data, ajv, config]);
     if (categorization !== previousCategorization) {
         setActiveCategory(0);
         setPreviousCategorization(categorization);
@@ -1682,9 +1691,9 @@ var MaterialCategorizationStepperLayoutRenderer = function (props) {
     };
     var categories = React.useMemo(function () {
         return categorization.elements.filter(function (category) {
-            return core.isVisible(category, data, undefined, ajv);
+            return core.isVisible(category, data, undefined, ajv, config);
         });
-    }, [categorization, data, ajv]);
+    }, [categorization, data, ajv, config]);
     var childProps = {
         elements: categories[activeCategory].elements,
         schema: schema,