@rjsf/chakra-ui 5.3.1 → 5.5.0

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

@@ -206,6 +206,7 @@ function BaseInputTemplate(props) {
     type = props.type,
     value = props.value,
     label = props.label,
+    hideLabel = props.hideLabel,
     schema = props.schema,
     uiSchema = props.uiSchema,
     onChange = props.onChange,
@@ -218,13 +219,11 @@ function BaseInputTemplate(props) {
     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);
@@ -237,7 +236,6 @@ function BaseInputTemplate(props) {
     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, {
@@ -245,11 +243,11 @@ function BaseInputTemplate(props) {
     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 : '',
@@ -476,16 +474,16 @@ function ObjectFieldTemplate(props) {
   // 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
@@ -821,6 +819,9 @@ function CheckboxWidget(props) {
     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({
@@ -830,6 +831,8 @@ function CheckboxWidget(props) {
   // 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);
@@ -842,11 +845,17 @@ function CheckboxWidget(props) {
     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,
@@ -855,10 +864,10 @@ function CheckboxWidget(props) {
       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)
+    })]
   }));
 }
 
@@ -873,10 +882,10 @@ function CheckboxesWidget(props) {
     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;
@@ -901,11 +910,11 @@ function CheckboxesWidget(props) {
     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));
       },
@@ -935,14 +944,15 @@ function CheckboxesWidget(props) {
 }
 
 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,
@@ -965,18 +975,18 @@ function RadioWidget(_ref) {
     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,
@@ -1010,9 +1020,8 @@ function RangeWidget(_ref) {
     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
   });
@@ -1021,7 +1030,6 @@ function RangeWidget(_ref) {
     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);
   };
@@ -1036,10 +1044,10 @@ function RangeWidget(_ref) {
   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,
@@ -1055,10 +1063,10 @@ function RangeWidget(_ref) {
 }
 
 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,
@@ -1123,10 +1131,11 @@ function SelectWidget(props) {
     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,
@@ -1148,6 +1157,7 @@ function TextareaWidget(_ref) {
     placeholder = _ref.placeholder,
     value = _ref.value,
     label = _ref.label,
+    hideLabel = _ref.hideLabel,
     disabled = _ref.disabled,
     autofocus = _ref.autofocus,
     readonly = _ref.readonly,
@@ -1155,16 +1165,12 @@ function TextareaWidget(_ref) {
     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);
@@ -1184,10 +1190,10 @@ function TextareaWidget(_ref) {
     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 : '',
@@ -1203,20 +1209,17 @@ function TextareaWidget(_ref) {
 
 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
   });
@@ -1238,10 +1241,10 @@ function UpDownWidget(props) {
     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,