@rjsf/chakra-ui 5.3.1 → 5.5.0

package/dist/chakra-ui.umd.development.js

@@ -197,6 +197,7 @@
       type = props.type,
       value = props.value,
       label = props.label,
+      hideLabel = props.hideLabel,
       schema = props.schema,
       uiSchema = props.uiSchema,
       onChange = props.onChange,
@@ -209,13 +210,11 @@
       rawErrors = props.rawErrors,
       autofocus = props.autofocus,
       placeholder = props.placeholder,
-      disabled = props.disabled,
-      registry = props.registry;
+      disabled = props.disabled;
     var inputProps = utils.getInputProps(schema, type, options);
     var chakraProps = getChakra({
       uiSchema: uiSchema
     });
-    var schemaUtils = registry.schemaUtils;
     var _onChange = function _onChange(_ref) {
       var value = _ref.target.value;
       return onChange(value === '' ? options.emptyValue : value);
@@ -228,7 +227,6 @@
       var value = _ref3.target.value;
       return onFocus(id, value);
     };
-    var displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema) && (!!label || !!schema.title);
     return jsxRuntime.jsxs(react.FormControl, _extends({
       mb: 1
     }, chakraProps, {
@@ -236,11 +234,11 @@
       isRequired: required,
       isReadOnly: readonly,
       isInvalid: rawErrors && rawErrors.length > 0,
-      children: [displayLabel ? jsxRuntime.jsx(react.FormLabel, {
+      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
         htmlFor: id,
         id: id + "-label",
-        children: label || schema.title
-      }) : null, jsxRuntime.jsx(react.Input, _extends({
+        children: label
+      }), hideLabel || !label), jsxRuntime.jsx(react.Input, _extends({
         id: id,
         name: id,
         value: value || value === 0 ? value : '',
@@ -467,16 +465,16 @@
     // Button templates are not overridden in the uiSchema
     var AddButton = registry.templates.ButtonTemplates.AddButton;
     return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [(uiOptions.title || title) && jsxRuntime.jsx(TitleFieldTemplate, {
+      children: [title && jsxRuntime.jsx(TitleFieldTemplate, {
         id: utils.titleId(idSchema),
-        title: uiOptions.title || title,
+        title: title,
         required: required,
         schema: schema,
         uiSchema: uiSchema,
         registry: registry
-      }), (uiOptions.description || description) && jsxRuntime.jsx(DescriptionFieldTemplate, {
+      }), description && jsxRuntime.jsx(DescriptionFieldTemplate, {
         id: utils.descriptionId(idSchema),
-        description: uiOptions.description || description,
+        description: description,
         schema: schema,
         uiSchema: uiSchema,
         registry: registry
@@ -812,6 +810,9 @@
       onBlur = props.onBlur,
       onFocus = props.onFocus,
       label = props.label,
+      hideLabel = props.hideLabel,
+      registry = props.registry,
+      options = props.options,
       uiSchema = props.uiSchema,
       schema = props.schema;
     var chakraProps = getChakra({
@@ -821,6 +822,8 @@
     // the "required" attribute if the field value must be "true", due to the
     // "const" or "enum" keywords
     var required = utils.schemaRequiresTrueValue(schema);
+    var DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, options);
+    var description = options.description || schema.description;
     var _onChange = function _onChange(_ref) {
       var checked = _ref.target.checked;
       return onChange(checked);
@@ -833,11 +836,17 @@
       var value = _ref3.target.value;
       return onFocus(id, value);
     };
-    return jsxRuntime.jsx(react.FormControl, _extends({
+    return jsxRuntime.jsxs(react.FormControl, _extends({
       mb: 1
     }, chakraProps, {
       isRequired: required,
-      children: jsxRuntime.jsx(react.Checkbox, {
+      children: [!hideLabel && !!description && jsxRuntime.jsx(DescriptionFieldTemplate, {
+        id: utils.descriptionId(id),
+        description: description,
+        schema: schema,
+        uiSchema: uiSchema,
+        registry: registry
+      }), jsxRuntime.jsx(react.Checkbox, {
         id: id,
         name: id,
         isChecked: typeof value === 'undefined' ? false : value,
@@ -846,10 +855,10 @@
         onBlur: _onBlur,
         onFocus: _onFocus,
         "aria-describedby": utils.ariaDescribedByIds(id),
-        children: label && jsxRuntime.jsx(react.Text, {
+        children: utils.labelValue(jsxRuntime.jsx(react.Text, {
           children: label
-        })
-      })
+        }), hideLabel || !label)
+      })]
     }));
   }
 
@@ -864,10 +873,10 @@
       onFocus = props.onFocus,
       required = props.required,
       label = props.label,
+      hideLabel = props.hideLabel,
       uiSchema = props.uiSchema,
       _props$rawErrors = props.rawErrors,
-      rawErrors = _props$rawErrors === void 0 ? [] : _props$rawErrors,
-      schema = props.schema;
+      rawErrors = _props$rawErrors === void 0 ? [] : _props$rawErrors;
     var enumOptions = options.enumOptions,
       enumDisabled = options.enumDisabled,
       emptyValue = options.emptyValue;
@@ -892,11 +901,11 @@
       isRequired: required,
       isReadOnly: readonly,
       isInvalid: rawErrors && rawErrors.length > 0,
-      children: [jsxRuntime.jsx(react.FormLabel, {
+      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
         htmlFor: id,
         id: id + "-label",
-        children: label || schema.title
-      }), jsxRuntime.jsx(react.CheckboxGroup, {
+        children: label
+      }), hideLabel || !label), jsxRuntime.jsx(react.CheckboxGroup, {
         onChange: function onChange(option) {
           return _onChange(utils.enumOptionsValueForIndex(option, enumOptions, emptyValue));
         },
@@ -926,14 +935,15 @@
   }
 
   function RadioWidget(_ref) {
+    var _enumOptionsIndexForV;
     var id = _ref.id,
-      schema = _ref.schema,
       options = _ref.options,
       value = _ref.value,
       required = _ref.required,
       disabled = _ref.disabled,
       readonly = _ref.readonly,
       label = _ref.label,
+      hideLabel = _ref.hideLabel,
       onChange = _ref.onChange,
       onBlur = _ref.onBlur,
       onFocus = _ref.onFocus,
@@ -956,18 +966,18 @@
       return onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
     };
     var row = options ? options.inline : false;
-    var selectedIndex = utils.enumOptionsIndexForValue(value, enumOptions);
+    var selectedIndex = (_enumOptionsIndexForV = utils.enumOptionsIndexForValue(value, enumOptions)) != null ? _enumOptionsIndexForV : null;
     return jsxRuntime.jsxs(react.FormControl, _extends({
       mb: 1
     }, chakraProps, {
       isDisabled: disabled || readonly,
       isRequired: required,
       isReadOnly: readonly,
-      children: [jsxRuntime.jsx(react.FormLabel, {
+      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
         htmlFor: id,
         id: id + "-label",
-        children: label || schema.title
-      }), jsxRuntime.jsx(react.RadioGroup, {
+        children: label
+      }), hideLabel || !label), jsxRuntime.jsx(react.RadioGroup, {
         onChange: _onChange,
         onBlur: _onBlur,
         onFocus: _onFocus,
@@ -1001,9 +1011,8 @@
       uiSchema = _ref.uiSchema,
       onChange = _ref.onChange,
       label = _ref.label,
-      id = _ref.id,
-      registry = _ref.registry;
-    var schemaUtils = registry.schemaUtils;
+      hideLabel = _ref.hideLabel,
+      id = _ref.id;
     var chakraProps = getChakra({
       uiSchema: uiSchema
     });
@@ -1012,7 +1021,6 @@
       label: label,
       id: id
     }, utils.rangeSpec(schema));
-    var displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema) && (!!label || !!schema.title);
     var _onChange = function _onChange(value) {
       return onChange(value === undefined ? options.emptyValue : value);
     };
@@ -1027,10 +1035,10 @@
     return jsxRuntime.jsxs(react.FormControl, _extends({
       mb: 1
     }, chakraProps, {
-      children: [displayLabel ? jsxRuntime.jsx(react.FormLabel, {
+      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
         htmlFor: id,
-        children: label || schema.title
-      }) : null, jsxRuntime.jsxs(react.Slider, _extends({}, sliderWidgetProps, {
+        children: label
+      }), hideLabel || !label), jsxRuntime.jsxs(react.Slider, _extends({}, sliderWidgetProps, {
         id: id,
         name: id,
         isDisabled: disabled || readonly,
@@ -1046,10 +1054,10 @@
   }
 
   function SelectWidget(props) {
-    var schema = props.schema,
-      id = props.id,
+    var id = props.id,
       options = props.options,
       label = props.label,
+      hideLabel = props.hideLabel,
       placeholder = props.placeholder,
       multiple = props.multiple,
       required = props.required,
@@ -1114,10 +1122,11 @@
       isRequired: required,
       isReadOnly: readonly,
       isInvalid: rawErrors && rawErrors.length > 0,
-      children: [(label || schema.title) && jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: isMultiple ? undefined : id,
-        children: label || schema.title
-      }), jsxRuntime.jsx(chakraReactSelect.Select, {
+      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
+        htmlFor: id,
+        id: id + "-label",
+        children: label
+      }), hideLabel || !label), jsxRuntime.jsx(chakraReactSelect.Select, {
         inputId: id,
         name: id,
         isMulti: isMultiple,
@@ -1139,6 +1148,7 @@
       placeholder = _ref.placeholder,
       value = _ref.value,
       label = _ref.label,
+      hideLabel = _ref.hideLabel,
       disabled = _ref.disabled,
       autofocus = _ref.autofocus,
       readonly = _ref.readonly,
@@ -1146,16 +1156,12 @@
       onFocus = _ref.onFocus,
       onChange = _ref.onChange,
       options = _ref.options,
-      schema = _ref.schema,
       uiSchema = _ref.uiSchema,
       required = _ref.required,
-      rawErrors = _ref.rawErrors,
-      registry = _ref.registry;
+      rawErrors = _ref.rawErrors;
     var chakraProps = getChakra({
       uiSchema: uiSchema
     });
-    var schemaUtils = registry.schemaUtils;
-    var displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema) && (!!label || !!schema.title);
     var _onChange = function _onChange(_ref2) {
       var value = _ref2.target.value;
       return onChange(value === '' ? options.emptyValue : value);
@@ -1175,10 +1181,10 @@
       isRequired: required,
       isReadOnly: readonly,
       isInvalid: rawErrors && rawErrors.length > 0,
-      children: [displayLabel ? jsxRuntime.jsx(react.FormLabel, {
+      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
         htmlFor: id,
-        children: label || schema.title
-      }) : null, jsxRuntime.jsx(react.Textarea, {
+        children: label
+      }), hideLabel || !label), jsxRuntime.jsx(react.Textarea, {
         id: id,
         name: id,
         value: value != null ? value : '',
@@ -1194,20 +1200,17 @@
 
   function UpDownWidget(props) {
     var id = props.id,
-      schema = props.schema,
       uiSchema = props.uiSchema,
       readonly = props.readonly,
       disabled = props.disabled,
       label = props.label,
+      hideLabel = props.hideLabel,
       value = props.value,
       onChange = props.onChange,
       onBlur = props.onBlur,
       onFocus = props.onFocus,
       rawErrors = props.rawErrors,
-      required = props.required,
-      registry = props.registry;
-    var schemaUtils = registry.schemaUtils;
-    var displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema) && (!!label || !!schema.title);
+      required = props.required;
     var chakraProps = getChakra({
       uiSchema: uiSchema
     });
@@ -1229,10 +1232,10 @@
       isRequired: required,
       isReadOnly: readonly,
       isInvalid: rawErrors && rawErrors.length > 0,
-      children: [displayLabel ? jsxRuntime.jsx(react.FormLabel, {
+      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
         htmlFor: id,
-        children: label || schema.title
-      }) : null, jsxRuntime.jsxs(react.NumberInput, {
+        children: label
+      }), hideLabel || !label), jsxRuntime.jsxs(react.NumberInput, {
         value: value != null ? value : '',
         onChange: _onChange,
         onBlur: _onBlur,