@rjsf/antd 6.1.1 → 6.2.3

package/dist/index.cjs

@@ -144,6 +144,7 @@ function ArrayFieldTemplate(props) {
 }
 
 // src/templates/BaseInputTemplate/index.tsx
+var import_react2 = require("react");
 var import_antd3 = require("antd");
 var import_utils3 = require("@rjsf/utils");
 var import_jsx_runtime3 = require("react/jsx-runtime");
@@ -170,10 +171,19 @@ function BaseInputTemplate(props) {
   const { formContext } = registry;
   const inputProps = (0, import_utils3.getInputProps)(schema, type, options, false);
   const { readonlyAsDisabled = true } = formContext;
+  const { ClearButton: ClearButton2 } = registry.templates.ButtonTemplates;
   const handleNumberChange = (nextValue) => onChange(nextValue);
   const handleTextChange = onChangeOverride ? onChangeOverride : ({ target }) => onChange(target.value === "" ? options.emptyValue : target.value);
   const handleBlur = ({ target }) => onBlur(id, target && target.value);
   const handleFocus = ({ target }) => onFocus(id, target && target.value);
+  const handleClear = (0, import_react2.useCallback)(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      onChange(options.emptyValue ?? "");
+    },
+    [onChange, options.emptyValue]
+  );
   const input = inputProps.type === "number" || inputProps.type === "integer" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     import_antd3.InputNumber,
     {
@@ -209,6 +219,7 @@ function BaseInputTemplate(props) {
   );
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
     input,
+    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ClearButton2, { registry, onClick: handleClear }),
     Array.isArray(schema.examples) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("datalist", { id: (0, import_utils3.examplesId)(id), children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map((example) => {
       return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: example }, example);
     }) })
@@ -258,6 +269,7 @@ var import_ArrowUpOutlined = __toESM(require("@ant-design/icons/ArrowUpOutlined"
 var import_CopyOutlined = __toESM(require("@ant-design/icons/CopyOutlined"), 1);
 var import_DeleteOutlined = __toESM(require("@ant-design/icons/DeleteOutlined"), 1);
 var import_PlusCircleOutlined = __toESM(require("@ant-design/icons/PlusCircleOutlined"), 1);
+var import_CloseOutlined = __toESM(require("@ant-design/icons/CloseOutlined"), 1);
 var import_utils5 = require("@rjsf/utils");
 var import_jsx_runtime6 = require("react/jsx-runtime");
 function IconButton(props) {
@@ -327,6 +339,20 @@ function RemoveButton(props) {
     }
   );
 }
+function ClearButton(props) {
+  const {
+    registry: { translateString }
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    IconButton,
+    {
+      title: translateString(import_utils5.TranslatableString.ClearButton),
+      ...props,
+      iconType: "link",
+      icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_CloseOutlined.default, {})
+    }
+  );
+}
 
 // src/templates/FieldErrorTemplate/index.tsx
 var import_utils6 = require("@rjsf/utils");
@@ -440,7 +466,7 @@ var import_isNumber = __toESM(require("lodash/isNumber"), 1);
 var import_isString = __toESM(require("lodash/isString"), 1);
 var import_utils8 = require("@rjsf/utils");
 var import_antd8 = require("antd");
-var import_react2 = require("react");
+var import_react3 = require("react");
 var import_jsx_runtime11 = require("react/jsx-runtime");
 function ObjectFieldTemplate(props) {
   const {
@@ -493,7 +519,7 @@ function ObjectFieldTemplate(props) {
     }
     return defaultColSpan;
   };
-  const { getPrefixCls } = (0, import_react2.useContext)(import_antd8.ConfigProvider.ConfigContext);
+  const { getPrefixCls } = (0, import_react3.useContext)(import_antd8.ConfigProvider.ConfigContext);
   const prefixCls = getPrefixCls("form");
   const labelClsBasic = `${prefixCls}-item-label`;
   const labelColClassName = (0, import_classnames2.default)(
@@ -583,7 +609,7 @@ function SubmitButton({ uiSchema }) {
 // src/templates/TitleField/index.tsx
 var import_classnames3 = __toESM(require("classnames"), 1);
 var import_antd10 = require("antd");
-var import_react3 = require("react");
+var import_react4 = require("react");
 var import_jsx_runtime14 = require("react/jsx-runtime");
 function TitleField({
   id,
@@ -607,7 +633,7 @@ function TitleField({
       control.focus();
     }
   };
-  const { getPrefixCls } = (0, import_react3.useContext)(import_antd10.ConfigProvider.ConfigContext);
+  const { getPrefixCls } = (0, import_react4.useContext)(import_antd10.ConfigProvider.ConfigContext);
   const prefixCls = getPrefixCls("form");
   const labelClassName = (0, import_classnames3.default)({
     [`${prefixCls}-item-required`]: required,
@@ -740,7 +766,8 @@ function generateTemplates() {
       MoveDownButton,
       MoveUpButton,
       RemoveButton,
-      SubmitButton
+      SubmitButton,
+      ClearButton
     },
     DescriptionFieldTemplate: DescriptionField,
     ErrorListTemplate: ErrorList,
@@ -756,19 +783,31 @@ function generateTemplates() {
 }
 var templates_default = generateTemplates();
 
+// src/widgets/AltDateTimeWidget/index.tsx
+var import_jsx_runtime16 = require("react/jsx-runtime");
+function AltDateTimeWidget({ time = true, ...props }) {
+  const { AltDateWidget: AltDateWidget2 } = props.registry.widgets;
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AltDateWidget2, { time, ...props });
+}
+
 // src/widgets/AltDateWidget/index.tsx
 var import_antd12 = require("antd");
 var import_utils11 = require("@rjsf/utils");
-var import_jsx_runtime16 = require("react/jsx-runtime");
-function AltDateWidget(props) {
-  const { autofocus, disabled, id, name, onBlur, onFocus, options, readonly, registry } = props;
+var import_jsx_runtime17 = require("react/jsx-runtime");
+function AltDateWidget({ autofocus = false, disabled = false, options, readonly = false, time = false, ...props }) {
+  const { id, name, onBlur, onFocus, registry } = props;
   const { formContext, translateString } = registry;
   const { rowGutter = 24 } = formContext;
-  const { elements, handleChange, handleClear, handleSetNow } = (0, import_utils11.useAltDateWidgetProps)(props);
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_antd12.Row, { gutter: [Math.floor(rowGutter / 2), Math.floor(rowGutter / 2)], children: [
+  const realOptions = { yearsRange: [1900, (/* @__PURE__ */ new Date()).getFullYear() + 2], ...options };
+  const { elements, handleChange, handleClear, handleSetNow } = (0, import_utils11.useAltDateWidgetProps)({
+    ...props,
+    autofocus,
+    options: realOptions
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_antd12.Row, { gutter: [Math.floor(rowGutter / 2), Math.floor(rowGutter / 2)], children: [
     elements.map((elemProps, i) => {
       const elemId = `${id}_${elemProps.type}`;
-      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd12.Col, { flex: "88px", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd12.Col, { flex: "88px", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         import_utils11.DateElement,
         {
           rootId: id,
@@ -784,30 +823,10 @@ function AltDateWidget(props) {
         }
       ) }, elemId);
     }),
-    !options.hideNowButton && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd12.Col, { flex: "88px", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd12.Button, { block: true, className: "btn-now", onClick: handleSetNow, type: "primary", children: translateString(import_utils11.TranslatableString.NowLabel) }) }),
-    !options.hideClearButton && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd12.Col, { flex: "88px", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd12.Button, { block: true, className: "btn-clear", danger: true, onClick: handleClear, type: "primary", children: translateString(import_utils11.TranslatableString.ClearLabel) }) })
+    !options.hideNowButton && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd12.Col, { flex: "88px", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd12.Button, { block: true, className: "btn-now", onClick: handleSetNow, type: "primary", children: translateString(import_utils11.TranslatableString.NowLabel) }) }),
+    !options.hideClearButton && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd12.Col, { flex: "88px", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd12.Button, { block: true, className: "btn-clear", danger: true, onClick: handleClear, type: "primary", children: translateString(import_utils11.TranslatableString.ClearLabel) }) })
   ] });
 }
-AltDateWidget.defaultProps = {
-  autofocus: false,
-  disabled: false,
-  options: {
-    yearsRange: [1900, (/* @__PURE__ */ new Date()).getFullYear() + 2]
-  },
-  readonly: false,
-  time: false
-};
-
-// src/widgets/AltDateTimeWidget/index.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
-function AltDateTimeWidget(props) {
-  const { AltDateWidget: AltDateWidget2 } = props.registry.widgets;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(AltDateWidget2, { time: true, ...props });
-}
-AltDateTimeWidget.defaultProps = {
-  ...AltDateWidget.defaultProps,
-  time: true
-};
 
 // src/widgets/CheckboxesWidget/index.tsx
 var import_antd13 = require("antd");
@@ -1095,10 +1114,10 @@ function RangeWidget(props) {
 }
 
 // src/widgets/SelectWidget/index.tsx
+var import_react5 = require("react");
 var import_antd20 = require("antd");
 var import_utils19 = require("@rjsf/utils");
 var import_isString2 = __toESM(require("lodash/isString"), 1);
-var import_react4 = require("react");
 var import_jsx_runtime25 = require("react/jsx-runtime");
 var SELECT_STYLE = {
   width: "100%"
@@ -1119,6 +1138,7 @@ function SelectWidget({
   value,
   schema
 }) {
+  const [open, setOpen] = (0, import_react5.useState)(false);
   const { formContext } = registry;
   const { readonlyAsDisabled = true } = formContext;
   const { enumOptions, enumDisabled, emptyValue } = options;
@@ -1131,13 +1151,13 @@ function SelectWidget({
     }
     return false;
   };
-  const getPopupContainer = (node) => node.parentNode;
+  const getPopupContainer = SelectWidget.getPopupContainerCallback();
   const selectedIndexes = (0, import_utils19.enumOptionsIndexForValue)(value, enumOptions, multiple);
   const extraProps = {
     name: htmlName || id
   };
   const showPlaceholderOption = !multiple && schema.default === void 0;
-  const selectOptions = (0, import_react4.useMemo)(() => {
+  const selectOptions = (0, import_react5.useMemo)(() => {
     if (Array.isArray(enumOptions)) {
       const options2 = enumOptions.map(({ value: optionValue, label: optionLabel }, index) => ({
         disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(optionValue) !== -1,
@@ -1155,6 +1175,7 @@ function SelectWidget({
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     import_antd20.Select,
     {
+      open,
       autoFocus: autofocus,
       disabled: disabled || readonlyAsDisabled && readonly,
       getPopupContainer,
@@ -1167,12 +1188,14 @@ function SelectWidget({
       style: SELECT_STYLE,
       value: selectedIndexes,
       ...extraProps,
+      onOpenChange: setOpen,
       filterOption,
       "aria-describedby": (0, import_utils19.ariaDescribedByIds)(id),
       options: selectOptions
     }
   );
 }
+SelectWidget.getPopupContainerCallback = () => (node) => node.parentElement;
 
 // src/widgets/TextareaWidget/index.tsx
 var import_antd21 = require("antd");