@rjsf/core 6.7.0 → 6.8.0

package/dist/core.umd.js

@@ -1740,23 +1740,37 @@
     const { registry, onChange, formData, value: initialValue } = props;
     const [lastValue, setLastValue] = react.useState(initialValue);
     const { StringField: StringField2 } = registry.fields;
+    const separator = utils.getDecimalSeparator();
+    const escapedSeparator = separator === "." ? "\\." : separator;
     let value = formData;
     const handleChange = react.useCallback(
       (newValue, path, errorSchema, id) => {
         setLastValue(newValue);
-        const normalizedValue = `${newValue}`.startsWith(".") ? `0${newValue}` : newValue;
+        const standardValue = typeof newValue === "string" ? newValue.replace(separator, ".") : newValue;
+        const normalizedValue = `${standardValue}`.startsWith(".") ? `0${standardValue}` : standardValue;
         const processed = typeof normalizedValue === "string" && trailingCharMatcherWithPrefix.exec(normalizedValue) ? utils.asNumber(normalizedValue.replace(trailingCharMatcher, "")) : utils.asNumber(normalizedValue);
         onChange(processed, path, errorSchema, id);
       },
-      [onChange]
+      [onChange, separator]
     );
     if (typeof lastValue === "string" && typeof value === "number") {
-      const re = new RegExp(`^(${String(value).replace(".", "\\.")})?\\.?0*$`);
+      const re = new RegExp(`^(${String(value).replace(".", escapedSeparator)})?${escapedSeparator}?0*$`);
       if (lastValue.match(re)) {
         value = lastValue;
       }
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(StringField2, { ...props, formData: value, onChange: handleChange });
+    let displayValue = value;
+    if (typeof value === "number" && separator !== ".") {
+      const { schema, uiSchema } = props;
+      const { schemaUtils } = registry;
+      const enumOptions = schemaUtils.isSelect(schema) ? utils.optionsList(schema, uiSchema) : void 0;
+      const defaultWidget = enumOptions ? "select" : "text";
+      const { widget = defaultWidget } = utils.getUiOptions(uiSchema);
+      if (widget !== "radio" && widget !== "select" && widget !== "hidden") {
+        displayValue = String(value).replace(".", separator);
+      }
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(StringField2, { ...props, formData: displayValue, onChange: handleChange });
   }
   var NumberField_default = NumberField;
 
@@ -1783,6 +1797,12 @@
         return translateString(utils.TranslatableString.NewStringDefault);
     }
   }
+  function isAdditionalPropertySchema(schema) {
+    return Boolean(schema?.[utils.ADDITIONAL_PROPERTY_FLAG]);
+  }
+  function getAdditionalPropertyOrder(schemaProperties) {
+    return Object.keys(schemaProperties).filter((property) => isAdditionalPropertySchema(schemaProperties[property]));
+  }
   function ObjectFieldPropertyFn(props) {
     const {
       fieldPathId,
@@ -1892,9 +1912,16 @@
       [schemaUtils, rawSchema, formData]
     );
     const uiOptions = react.useMemo(() => utils.getUiOptions(uiSchema, globalUiOptions), [uiSchema, globalUiOptions]);
-    const { properties: schemaProperties = {} } = schema;
+    const schemaProperties = react.useMemo(() => schema.properties ?? {}, [schema.properties]);
     const childFieldPathId = props.childFieldPathId ?? fieldPathId;
     const lastRenamedProperty = react.useRef({ previousKey: "", currentKey: void 0 });
+    const [additionalPropertyOrder, setAdditionalPropertyOrder] = react.useState(
+      () => getAdditionalPropertyOrder(schemaProperties)
+    );
+    const definedPropertyOrder = react.useMemo(() => {
+      const additionalPropertySet = new Set(getAdditionalPropertyOrder(schemaProperties));
+      return Object.keys(schemaProperties).filter((property) => !additionalPropertySet.has(property));
+    }, [schemaProperties]);
     const templateTitle = uiOptions.title ?? schema.title ?? title ?? name;
     const description = uiOptions.description ?? schema.description;
     const renderOptionalField = utils.shouldRenderOptionalField(registry, schema, required, uiSchema);
@@ -1947,6 +1974,7 @@
         lastRenamedProperty.current.currentKey = newKey;
         lastRenamedProperty.current.previousKey = getAvailableKey(newKey, newFormData);
       }
+      setAdditionalPropertyOrder((order) => [...order, newKey]);
       onChange(newFormData, childFieldPathId.path);
     }, [formData, onChange, translateString, schemaUtils, childFieldPathId, getAvailableKey, schema]);
     const handleKeyRename = react.useCallback(
@@ -1968,6 +1996,7 @@
             lastRenamedProperty.current.previousKey = oldKey;
           }
           lastRenamedProperty.current.currentKey = actualNewKey;
+          setAdditionalPropertyOrder((order) => order.map((property) => property === oldKey ? actualNewKey : property));
           onChange(renamedObj, childFieldPathId.path);
         }
       },
@@ -1975,6 +2004,7 @@
     );
     const handleRemoveProperty = react.useCallback(
       (key) => {
+        setAdditionalPropertyOrder((order) => order.filter((property) => property !== key));
         onChange(ADDITIONAL_PROPERTY_KEY_REMOVE, [...childFieldPathId.path, key]);
       },
       [onChange, childFieldPathId]
@@ -1987,8 +2017,11 @@
     }, []);
     if (!renderOptionalField || hasFormData) {
       try {
-        const properties = Object.keys(schemaProperties);
-        orderedProperties = utils.orderProperties(properties, uiOptions.order);
+        const definedPropertySet = new Set(definedPropertyOrder);
+        const currentAdditionalProperties = additionalPropertyOrder.filter(
+          (property) => Object.hasOwn(schemaProperties, property) && !definedPropertySet.has(property)
+        );
+        orderedProperties = utils.orderProperties([...definedPropertyOrder, ...currentAdditionalProperties], uiOptions.order);
       } catch (err) {
         return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "rjsf-config-error", style: { color: "red" }, children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Markdown, { options: { disableParsingRawHTML: true }, children: translateString(utils.TranslatableString.InvalidObjectField, [name || "root", err.message]) }) }),
@@ -2003,9 +2036,7 @@
       title: uiOptions.label === false ? "" : templateTitle,
       description: uiOptions.label === false ? void 0 : description,
       properties: orderedProperties.map((propertyName) => {
-        const addedByAdditionalProperties = Boolean(
-          schema.properties?.[propertyName]?.[utils.ADDITIONAL_PROPERTY_FLAG]
-        );
+        const addedByAdditionalProperties = isAdditionalPropertySchema(schema.properties?.[propertyName]);
         const fieldUiSchema = addedByAdditionalProperties ? uiSchema.additionalProperties : uiSchema[propertyName];
         const hidden = utils.getUiOptions(fieldUiSchema).widget === "hidden";
         const content = /* @__PURE__ */ jsxRuntime.jsx(
@@ -3807,10 +3838,23 @@
     return /* @__PURE__ */ jsxRuntime.jsx(BaseInputTemplate2, { ...props });
   }
   function TimeWidget(props) {
-    const { onChange, options, registry } = props;
+    const { onChange, options, registry, schema, value } = props;
     const BaseInputTemplate2 = utils.getTemplate("BaseInputTemplate", registry, options);
-    const handleChange = react.useCallback((value) => onChange(value ? `${value}:00` : void 0), [onChange]);
-    return /* @__PURE__ */ jsxRuntime.jsx(BaseInputTemplate2, { type: "time", ...props, onChange: handleChange });
+    const hasSecondPrecision = typeof schema.multipleOf === "number" && Number.isFinite(schema.multipleOf) && schema.multipleOf < 60;
+    const handleChange = react.useCallback(
+      (newValue) => {
+        if (!newValue) {
+          onChange(void 0);
+        } else if (hasSecondPrecision) {
+          onChange(newValue);
+        } else {
+          onChange(`${newValue}:00`);
+        }
+      },
+      [hasSecondPrecision, onChange]
+    );
+    const displayValue = typeof value === "string" && !hasSecondPrecision && /^\d{2}:\d{2}:00$/.test(value) ? value.slice(0, -3) : value;
+    return /* @__PURE__ */ jsxRuntime.jsx(BaseInputTemplate2, { type: "time", ...props, value: displayValue, onChange: handleChange });
   }
   function UpDownWidget(props) {
     const { options, registry } = props;

package/dist/index.cjs

@@ -1865,23 +1865,37 @@ function NumberField(props) {
   const { registry, onChange, formData, value: initialValue } = props;
   const [lastValue, setLastValue] = (0, import_react9.useState)(initialValue);
   const { StringField: StringField2 } = registry.fields;
+  const separator = (0, import_utils9.getDecimalSeparator)();
+  const escapedSeparator = separator === "." ? "\\." : separator;
   let value = formData;
   const handleChange = (0, import_react9.useCallback)(
     (newValue, path, errorSchema, id) => {
       setLastValue(newValue);
-      const normalizedValue = `${newValue}`.startsWith(".") ? `0${newValue}` : newValue;
+      const standardValue = typeof newValue === "string" ? newValue.replace(separator, ".") : newValue;
+      const normalizedValue = `${standardValue}`.startsWith(".") ? `0${standardValue}` : standardValue;
       const processed = typeof normalizedValue === "string" && trailingCharMatcherWithPrefix.exec(normalizedValue) ? (0, import_utils9.asNumber)(normalizedValue.replace(trailingCharMatcher, "")) : (0, import_utils9.asNumber)(normalizedValue);
       onChange(processed, path, errorSchema, id);
     },
-    [onChange]
+    [onChange, separator]
   );
   if (typeof lastValue === "string" && typeof value === "number") {
-    const re = new RegExp(`^(${String(value).replace(".", "\\.")})?\\.?0*$`);
+    const re = new RegExp(`^(${String(value).replace(".", escapedSeparator)})?${escapedSeparator}?0*$`);
     if (lastValue.match(re)) {
       value = lastValue;
     }
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StringField2, { ...props, formData: value, onChange: handleChange });
+  let displayValue = value;
+  if (typeof value === "number" && separator !== ".") {
+    const { schema, uiSchema } = props;
+    const { schemaUtils } = registry;
+    const enumOptions = schemaUtils.isSelect(schema) ? (0, import_utils9.optionsList)(schema, uiSchema) : void 0;
+    const defaultWidget = enumOptions ? "select" : "text";
+    const { widget = defaultWidget } = (0, import_utils9.getUiOptions)(uiSchema);
+    if (widget !== "radio" && widget !== "select" && widget !== "hidden") {
+      displayValue = String(value).replace(".", separator);
+    }
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StringField2, { ...props, formData: displayValue, onChange: handleChange });
 }
 var NumberField_default = NumberField;
 
@@ -1920,6 +1934,12 @@ function getDefaultValue(translateString, type) {
       return translateString(import_utils10.TranslatableString.NewStringDefault);
   }
 }
+function isAdditionalPropertySchema(schema) {
+  return Boolean(schema?.[import_utils10.ADDITIONAL_PROPERTY_FLAG]);
+}
+function getAdditionalPropertyOrder(schemaProperties) {
+  return Object.keys(schemaProperties).filter((property) => isAdditionalPropertySchema(schemaProperties[property]));
+}
 function ObjectFieldPropertyFn(props) {
   const {
     fieldPathId,
@@ -2029,9 +2049,16 @@ function ObjectField(props) {
     [schemaUtils, rawSchema, formData]
   );
   const uiOptions = (0, import_react10.useMemo)(() => (0, import_utils10.getUiOptions)(uiSchema, globalUiOptions), [uiSchema, globalUiOptions]);
-  const { properties: schemaProperties = {} } = schema;
+  const schemaProperties = (0, import_react10.useMemo)(() => schema.properties ?? {}, [schema.properties]);
   const childFieldPathId = props.childFieldPathId ?? fieldPathId;
   const lastRenamedProperty = (0, import_react10.useRef)({ previousKey: "", currentKey: void 0 });
+  const [additionalPropertyOrder, setAdditionalPropertyOrder] = (0, import_react10.useState)(
+    () => getAdditionalPropertyOrder(schemaProperties)
+  );
+  const definedPropertyOrder = (0, import_react10.useMemo)(() => {
+    const additionalPropertySet = new Set(getAdditionalPropertyOrder(schemaProperties));
+    return Object.keys(schemaProperties).filter((property) => !additionalPropertySet.has(property));
+  }, [schemaProperties]);
   const templateTitle = uiOptions.title ?? schema.title ?? title ?? name;
   const description = uiOptions.description ?? schema.description;
   const renderOptionalField = (0, import_utils10.shouldRenderOptionalField)(registry, schema, required, uiSchema);
@@ -2084,6 +2111,7 @@ function ObjectField(props) {
       lastRenamedProperty.current.currentKey = newKey;
       lastRenamedProperty.current.previousKey = getAvailableKey(newKey, newFormData);
     }
+    setAdditionalPropertyOrder((order) => [...order, newKey]);
     onChange(newFormData, childFieldPathId.path);
   }, [formData, onChange, translateString, schemaUtils, childFieldPathId, getAvailableKey, schema]);
   const handleKeyRename = (0, import_react10.useCallback)(
@@ -2105,6 +2133,7 @@ function ObjectField(props) {
           lastRenamedProperty.current.previousKey = oldKey;
         }
         lastRenamedProperty.current.currentKey = actualNewKey;
+        setAdditionalPropertyOrder((order) => order.map((property) => property === oldKey ? actualNewKey : property));
         onChange(renamedObj, childFieldPathId.path);
       }
     },
@@ -2112,6 +2141,7 @@ function ObjectField(props) {
   );
   const handleRemoveProperty = (0, import_react10.useCallback)(
     (key) => {
+      setAdditionalPropertyOrder((order) => order.filter((property) => property !== key));
       onChange(ADDITIONAL_PROPERTY_KEY_REMOVE, [...childFieldPathId.path, key]);
     },
     [onChange, childFieldPathId]
@@ -2124,8 +2154,11 @@ function ObjectField(props) {
   }, []);
   if (!renderOptionalField || hasFormData) {
     try {
-      const properties = Object.keys(schemaProperties);
-      orderedProperties = (0, import_utils10.orderProperties)(properties, uiOptions.order);
+      const definedPropertySet = new Set(definedPropertyOrder);
+      const currentAdditionalProperties = additionalPropertyOrder.filter(
+        (property) => Object.hasOwn(schemaProperties, property) && !definedPropertySet.has(property)
+      );
+      orderedProperties = (0, import_utils10.orderProperties)([...definedPropertyOrder, ...currentAdditionalProperties], uiOptions.order);
     } catch (err) {
       return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { children: [
         /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "rjsf-config-error", style: { color: "red" }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react11.Markdown, { options: { disableParsingRawHTML: true }, children: translateString(import_utils10.TranslatableString.InvalidObjectField, [name || "root", err.message]) }) }),
@@ -2140,9 +2173,7 @@ function ObjectField(props) {
     title: uiOptions.label === false ? "" : templateTitle,
     description: uiOptions.label === false ? void 0 : description,
     properties: orderedProperties.map((propertyName) => {
-      const addedByAdditionalProperties = Boolean(
-        schema.properties?.[propertyName]?.[import_utils10.ADDITIONAL_PROPERTY_FLAG]
-      );
+      const addedByAdditionalProperties = isAdditionalPropertySchema(schema.properties?.[propertyName]);
       const fieldUiSchema = addedByAdditionalProperties ? uiSchema.additionalProperties : uiSchema[propertyName];
       const hidden = (0, import_utils10.getUiOptions)(fieldUiSchema).widget === "hidden";
       const content = /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
@@ -4152,10 +4183,23 @@ var import_react27 = require("react");
 var import_utils48 = require("@rjsf/utils");
 var import_jsx_runtime58 = require("react/jsx-runtime");
 function TimeWidget(props) {
-  const { onChange, options, registry } = props;
+  const { onChange, options, registry, schema, value } = props;
   const BaseInputTemplate2 = (0, import_utils48.getTemplate)("BaseInputTemplate", registry, options);
-  const handleChange = (0, import_react27.useCallback)((value) => onChange(value ? `${value}:00` : void 0), [onChange]);
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(BaseInputTemplate2, { type: "time", ...props, onChange: handleChange });
+  const hasSecondPrecision = typeof schema.multipleOf === "number" && Number.isFinite(schema.multipleOf) && schema.multipleOf < 60;
+  const handleChange = (0, import_react27.useCallback)(
+    (newValue) => {
+      if (!newValue) {
+        onChange(void 0);
+      } else if (hasSecondPrecision) {
+        onChange(newValue);
+      } else {
+        onChange(`${newValue}:00`);
+      }
+    },
+    [hasSecondPrecision, onChange]
+  );
+  const displayValue = typeof value === "string" && !hasSecondPrecision && /^\d{2}:\d{2}:00$/.test(value) ? value.slice(0, -3) : value;
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(BaseInputTemplate2, { type: "time", ...props, value: displayValue, onChange: handleChange });
 }
 
 // src/components/widgets/UpDownWidget.tsx