@rjsf/chakra-ui 6.1.2 → 6.2.5

package/dist/chakra-ui.umd.js

@@ -142,12 +142,22 @@
       autofocus,
       placeholder,
       disabled,
-      uiSchema
+      uiSchema,
+      registry
     } = props;
     const inputProps = utils.getInputProps(schema, type, options);
+    const { ClearButton: ClearButton2 } = registry.templates.ButtonTemplates;
     const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
     const _onBlur = ({ target }) => onBlur(id, target && target.value);
     const _onFocus = ({ target }) => onFocus(id, target && target.value);
+    const onClear = react.useCallback(
+      (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        onChange(options.emptyValue ?? "");
+      },
+      [onChange, options.emptyValue]
+    );
     const chakraProps = getChakra({ });
     return /* @__PURE__ */ jsxRuntime.jsxs(
       Field,
@@ -176,6 +186,7 @@
               "aria-describedby": utils.ariaDescribedByIds(id, !!schema.examples)
             }
           ),
+          options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ jsxRuntime.jsx(ClearButton2, { registry, onClick: onClear }),
           Array.isArray(schema.examples) ? /* @__PURE__ */ jsxRuntime.jsx("datalist", { id: utils.examplesId(id), children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map((example) => {
             return /* @__PURE__ */ jsxRuntime.jsx("option", { value: example }, example);
           }) }) : null
@@ -262,6 +273,12 @@
       }
     );
   }
+  function ClearButton(props) {
+    const {
+      registry: { translateString }
+    } = props;
+    return /* @__PURE__ */ jsxRuntime.jsx(ChakraIconButton_default, { title: translateString(utils.TranslatableString.ClearButton), ...props, icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, {}) });
+  }
   function FieldErrorTemplate(props) {
     const { errors = [], fieldPathId } = props;
     if (errors.length === 0) {
@@ -557,7 +574,8 @@
         MoveDownButton,
         MoveUpButton,
         RemoveButton,
-        SubmitButton
+        SubmitButton,
+        ClearButton
       },
       DescriptionFieldTemplate: DescriptionField,
       ErrorListTemplate: ErrorList,
@@ -573,10 +591,29 @@
     };
   }
   var Templates_default = generateTemplates();
-  function AltDateWidget(props) {
-    const { autofocus, disabled, id, onBlur, onFocus, options, readonly, registry } = props;
+  function AltDateTimeWidget({
+    time = true,
+    ...props
+  }) {
+    const { AltDateWidget: AltDateWidget2 } = props.registry.widgets;
+    return /* @__PURE__ */ jsxRuntime.jsx(AltDateWidget2, { ...props, time });
+  }
+  var AltDateTimeWidget_default = AltDateTimeWidget;
+  function AltDateWidget({
+    autofocus = false,
+    disabled = false,
+    readonly = false,
+    time = false,
+    options,
+    ...props
+  }) {
+    const { id, onBlur, onFocus, registry } = props;
     const { translateString } = registry;
-    const { elements, handleChange, handleClear, handleSetNow } = utils.useAltDateWidgetProps(props);
+    const realOptions = { yearsRange: [1900, (/* @__PURE__ */ new Date()).getFullYear() + 2], ...options };
+    const { elements, handleChange, handleClear, handleSetNow } = utils.useAltDateWidgetProps({
+      ...props,
+      options: realOptions
+    });
     const chakraProps = getChakra({ uiSchema: props.uiSchema });
     return /* @__PURE__ */ jsxRuntime.jsxs(react$1.FieldsetRoot, { ...chakraProps, children: [
       /* @__PURE__ */ jsxRuntime.jsx(react$1.Box, { display: "flex", flexWrap: "wrap", alignItems: "center", children: elements.map((elemProps, i) => {
@@ -605,25 +642,7 @@
       ] })
     ] });
   }
-  AltDateWidget.defaultProps = {
-    autofocus: false,
-    disabled: false,
-    readonly: false,
-    time: false,
-    options: {
-      yearsRange: [1900, (/* @__PURE__ */ new Date()).getFullYear() + 2]
-    }
-  };
   var AltDateWidget_default = AltDateWidget;
-  function AltDateTimeWidget(props) {
-    const { AltDateWidget: AltDateWidget2 } = props.registry.widgets;
-    return /* @__PURE__ */ jsxRuntime.jsx(AltDateWidget2, { ...props, time: true });
-  }
-  AltDateTimeWidget.defaultProps = {
-    ...AltDateWidget_default.defaultProps,
-    time: true
-  };
-  var AltDateTimeWidget_default = AltDateTimeWidget;
   var Checkbox = react.forwardRef(function Checkbox2(props, ref) {
     const { icon, children, inputProps, rootRef, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Checkbox.Root, { ref: rootRef, ...rest, children: [