@rjsf/daisyui 6.1.2 → 6.2.4

package/dist/chakra-ui.umd.js

@@ -199,8 +199,10 @@
       schema,
       type,
       label,
-      placeholder
+      placeholder,
+      registry
     } = props;
+    const { ClearButton: ClearButton2 } = registry.templates.ButtonTemplates;
     const inputProps = utils.getInputProps(schema, type, options);
     let className = "input input-bordered w-full";
     let isMulti = multiple;
@@ -222,29 +224,40 @@
       ({ target }) => onFocus && onFocus(id, target.value),
       [onFocus, id]
     );
+    const _onClear = react.useCallback(
+      (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        onChange(options.emptyValue ?? "");
+      },
+      [onChange, options.emptyValue]
+    );
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "form-control", children: [
         /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: id, className: "label hidden", style: { display: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "label-text", children: label }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "input",
-          {
-            id,
-            name: htmlName || id,
-            value: value || value === 0 ? value : "",
-            placeholder,
-            required,
-            disabled: disabled || readonly,
-            autoFocus: autofocus,
-            className,
-            multiple: isMulti,
-            ...rest,
-            ...htmlInputProps,
-            onChange: onChangeOverride || _onChange,
-            onBlur: _onBlur,
-            onFocus: _onFocus,
-            "aria-describedby": utils.ariaDescribedByIds(id, !!schema.examples)
-          }
-        )
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              id,
+              name: htmlName || id,
+              value: value || value === 0 ? value : "",
+              placeholder,
+              required,
+              disabled: disabled || readonly,
+              autoFocus: autofocus,
+              className,
+              multiple: isMulti,
+              ...rest,
+              ...htmlInputProps,
+              onChange: onChangeOverride || _onChange,
+              onBlur: _onBlur,
+              onFocus: _onFocus,
+              "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);
@@ -341,6 +354,20 @@
       }
     );
   }
+  function ClearButton(props) {
+    const {
+      registry: { translateString }
+    } = props;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      DaisyUIButton_default,
+      {
+        title: translateString(utils.TranslatableString.ClearButton),
+        ...props,
+        iconType: "default",
+        icon: freeSolidSvgIcons.faXmark
+      }
+    );
+  }
   function DescriptionField(props) {
     const { id, description, registry, uiSchema } = props;
     if (!description) {
@@ -389,6 +416,7 @@
       rawDescription,
       hidden,
       onChange,
+      fieldPathId,
       ...divProps
     } = props;
     const isCheckbox = schema.type === "boolean";
@@ -633,7 +661,8 @@
         CopyButton,
         MoveDownButton,
         MoveUpButton,
-        RemoveButton
+        RemoveButton,
+        ClearButton
       },
       DescriptionFieldTemplate: DescriptionField,
       ErrorListTemplate: ErrorList,

package/dist/index.cjs

@@ -248,8 +248,10 @@ function BaseInputTemplate(props) {
     schema,
     type,
     label,
-    placeholder
+    placeholder,
+    registry
   } = props;
+  const { ClearButton: ClearButton2 } = registry.templates.ButtonTemplates;
   const inputProps = (0, import_utils4.getInputProps)(schema, type, options);
   let className = "input input-bordered w-full";
   let isMulti = multiple;
@@ -271,29 +273,40 @@ function BaseInputTemplate(props) {
     ({ target }) => onFocus && onFocus(id, target.value),
     [onFocus, id]
   );
+  const _onClear = (0, import_react2.useCallback)(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      onChange(options.emptyValue ?? "");
+    },
+    [onChange, options.emptyValue]
+  );
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "form-control", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { htmlFor: id, className: "label hidden", style: { display: "none" }, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "label-text", children: label }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        "input",
-        {
-          id,
-          name: htmlName || id,
-          value: value || value === 0 ? value : "",
-          placeholder,
-          required,
-          disabled: disabled || readonly,
-          autoFocus: autofocus,
-          className,
-          multiple: isMulti,
-          ...rest,
-          ...htmlInputProps,
-          onChange: onChangeOverride || _onChange,
-          onBlur: _onBlur,
-          onFocus: _onFocus,
-          "aria-describedby": (0, import_utils4.ariaDescribedByIds)(id, !!schema.examples)
-        }
-      )
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { position: "relative" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "input",
+          {
+            id,
+            name: htmlName || id,
+            value: value || value === 0 ? value : "",
+            placeholder,
+            required,
+            disabled: disabled || readonly,
+            autoFocus: autofocus,
+            className,
+            multiple: isMulti,
+            ...rest,
+            ...htmlInputProps,
+            onChange: onChangeOverride || _onChange,
+            onBlur: _onBlur,
+            onFocus: _onFocus,
+            "aria-describedby": (0, import_utils4.ariaDescribedByIds)(id, !!schema.examples)
+          }
+        ),
+        options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ClearButton2, { registry, onClick: _onClear })
+      ] })
     ] }),
     Array.isArray(schema.examples) && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("datalist", { id: (0, import_utils4.examplesId)(id), children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map((example) => {
       return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: example }, example);
@@ -412,6 +425,20 @@ function RemoveButton(props) {
     }
   );
 }
+function ClearButton(props) {
+  const {
+    registry: { translateString }
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    DaisyUIButton_default,
+    {
+      title: translateString(import_utils7.TranslatableString.ClearButton),
+      ...props,
+      iconType: "default",
+      icon: import_free_solid_svg_icons2.faXmark
+    }
+  );
+}
 
 // src/templates/DescriptionField/DescriptionField.tsx
 var import_core = require("@rjsf/core");
@@ -479,6 +506,7 @@ function FieldTemplate(props) {
     rawDescription,
     hidden,
     onChange,
+    fieldPathId,
     ...divProps
   } = props;
   const isCheckbox = schema.type === "boolean";
@@ -745,7 +773,8 @@ function generateTemplates() {
       CopyButton,
       MoveDownButton,
       MoveUpButton,
-      RemoveButton
+      RemoveButton,
+      ClearButton
     },
     DescriptionFieldTemplate: DescriptionField,
     ErrorListTemplate: ErrorList,