@rjsf/core 6.0.0-alpha.0 → 6.0.0-beta.2

package/lib/components/fields/ObjectField.js

@@ -2,148 +2,22 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Component } from 'react';
 import { getTemplate, getUiOptions, orderProperties, TranslatableString, ADDITIONAL_PROPERTY_FLAG, PROPERTIES_KEY, REF_KEY, ANY_OF_KEY, ONE_OF_KEY, } from '@rjsf/utils';
 import Markdown from 'markdown-to-jsx';
-import get from 'lodash/get';
-import has from 'lodash/has';
-import isObject from 'lodash/isObject';
-import set from 'lodash/set';
-import unset from 'lodash/unset';
+import get from 'lodash-es/get.js';
+import has from 'lodash-es/has.js';
+import isObject from 'lodash-es/isObject.js';
+import set from 'lodash-es/set.js';
+import unset from 'lodash-es/unset.js';
 /** The `ObjectField` component is used to render a field in the schema that is of type `object`. It tracks whether an
  * additional property key was modified and what it was modified to
  *
  * @param props - The `FieldProps` for this template
  */
 class ObjectField extends Component {
-    constructor() {
-        super(...arguments);
-        /** Set up the initial state */
-        this.state = {
-            wasPropertyKeyModified: false,
-            additionalProperties: {},
-        };
-        /** Returns the `onPropertyChange` handler for the `name` field. Handles the special case where a user is attempting
-         * to clear the data for a field added as an additional property. Calls the `onChange()` handler with the updated
-         * formData.
-         *
-         * @param name - The name of the property
-         * @param addedByAdditionalProperties - Flag indicating whether this property is an additional property
-         * @returns - The onPropertyChange callback for the `name` property
-         */
-        this.onPropertyChange = (name, addedByAdditionalProperties = false) => {
-            return (value, newErrorSchema, id) => {
-                const { formData, onChange, errorSchema } = this.props;
-                if (value === undefined && addedByAdditionalProperties) {
-                    // Don't set value = undefined for fields added by
-                    // additionalProperties. Doing so removes them from the
-                    // formData, which causes them to completely disappear
-                    // (including the input field for the property name). Unlike
-                    // fields which are "mandated" by the schema, these fields can
-                    // be set to undefined by clicking a "delete field" button, so
-                    // set empty values to the empty string.
-                    value = '';
-                }
-                const newFormData = { ...formData, [name]: value };
-                onChange(newFormData, errorSchema &&
-                    errorSchema && {
-                    ...errorSchema,
-                    [name]: newErrorSchema,
-                }, id);
-            };
-        };
-        /** Returns a callback to handle the onDropPropertyClick event for the given `key` which removes the old `key` data
-         * and calls the `onChange` callback with it
-         *
-         * @param key - The key for which the drop callback is desired
-         * @returns - The drop property click callback
-         */
-        this.onDropPropertyClick = (key) => {
-            return (event) => {
-                event.preventDefault();
-                const { onChange, formData } = this.props;
-                const copiedFormData = { ...formData };
-                unset(copiedFormData, key);
-                onChange(copiedFormData);
-            };
-        };
-        /** Computes the next available key name from the `preferredKey`, indexing through the already existing keys until one
-         * that is already not assigned is found.
-         *
-         * @param preferredKey - The preferred name of a new key
-         * @param [formData] - The form data in which to check if the desired key already exists
-         * @returns - The name of the next available key from `preferredKey`
-         */
-        this.getAvailableKey = (preferredKey, formData) => {
-            const { uiSchema, registry } = this.props;
-            const { duplicateKeySuffixSeparator = '-' } = getUiOptions(uiSchema, registry.globalUiOptions);
-            let index = 0;
-            let newKey = preferredKey;
-            while (has(formData, newKey)) {
-                newKey = `${preferredKey}${duplicateKeySuffixSeparator}${++index}`;
-            }
-            return newKey;
-        };
-        /** Returns a callback function that deals with the rename of a key for an additional property for a schema. That
-         * callback will attempt to rename the key and move the existing data to that key, calling `onChange` when it does.
-         *
-         * @param oldValue - The old value of a field
-         * @returns - The key change callback function
-         */
-        this.onKeyChange = (oldValue) => {
-            return (value, newErrorSchema) => {
-                if (oldValue === value) {
-                    return;
-                }
-                const { formData, onChange, errorSchema } = this.props;
-                value = this.getAvailableKey(value, formData);
-                const newFormData = {
-                    ...formData,
-                };
-                const newKeys = { [oldValue]: value };
-                const keyValues = Object.keys(newFormData).map((key) => {
-                    const newKey = newKeys[key] || key;
-                    return { [newKey]: newFormData[key] };
-                });
-                const renamedObj = Object.assign({}, ...keyValues);
-                this.setState({ wasPropertyKeyModified: true });
-                onChange(renamedObj, errorSchema &&
-                    errorSchema && {
-                    ...errorSchema,
-                    [value]: newErrorSchema,
-                });
-            };
-        };
-        /** Handles the adding of a new additional property on the given `schema`. Calls the `onChange` callback once the new
-         * default data for that field has been added to the formData.
-         *
-         * @param schema - The schema element to which the new property is being added
-         */
-        this.handleAddClick = (schema) => () => {
-            if (!schema.additionalProperties) {
-                return;
-            }
-            const { formData, onChange, registry } = this.props;
-            const newFormData = { ...formData };
-            let type = undefined;
-            let defaultValue = undefined;
-            if (isObject(schema.additionalProperties)) {
-                type = schema.additionalProperties.type;
-                defaultValue = schema.additionalProperties.default;
-                let apSchema = schema.additionalProperties;
-                if (REF_KEY in apSchema) {
-                    const { schemaUtils } = registry;
-                    apSchema = schemaUtils.retrieveSchema({ $ref: apSchema[REF_KEY] }, formData);
-                    type = apSchema.type;
-                    defaultValue = apSchema.default;
-                }
-                if (!type && (ANY_OF_KEY in apSchema || ONE_OF_KEY in apSchema)) {
-                    type = 'object';
-                }
-            }
-            const newKey = this.getAvailableKey('newKey', newFormData);
-            // Cast this to make the `set` work properly
-            set(newFormData, newKey, defaultValue !== null && defaultValue !== void 0 ? defaultValue : this.getDefaultValue(type));
-            onChange(newFormData);
-        };
-    }
+    /** Set up the initial state */
+    state = {
+        wasPropertyKeyModified: false,
+        additionalProperties: {},
+    };
     /** Returns a flag indicating whether the `name` field is required in the object schema
      *
      * @param name - The name of the field to check for required-ness
@@ -153,6 +27,97 @@ class ObjectField extends Component {
         const { schema } = this.props;
         return Array.isArray(schema.required) && schema.required.indexOf(name) !== -1;
     }
+    /** Returns the `onPropertyChange` handler for the `name` field. Handles the special case where a user is attempting
+     * to clear the data for a field added as an additional property. Calls the `onChange()` handler with the updated
+     * formData.
+     *
+     * @param name - The name of the property
+     * @param addedByAdditionalProperties - Flag indicating whether this property is an additional property
+     * @returns - The onPropertyChange callback for the `name` property
+     */
+    onPropertyChange = (name, addedByAdditionalProperties = false) => {
+        return (value, newErrorSchema, id) => {
+            const { formData, onChange, errorSchema } = this.props;
+            if (value === undefined && addedByAdditionalProperties) {
+                // Don't set value = undefined for fields added by
+                // additionalProperties. Doing so removes them from the
+                // formData, which causes them to completely disappear
+                // (including the input field for the property name). Unlike
+                // fields which are "mandated" by the schema, these fields can
+                // be set to undefined by clicking a "delete field" button, so
+                // set empty values to the empty string.
+                value = '';
+            }
+            const newFormData = { ...formData, [name]: value };
+            onChange(newFormData, errorSchema &&
+                errorSchema && {
+                ...errorSchema,
+                [name]: newErrorSchema,
+            }, id);
+        };
+    };
+    /** Returns a callback to handle the onDropPropertyClick event for the given `key` which removes the old `key` data
+     * and calls the `onChange` callback with it
+     *
+     * @param key - The key for which the drop callback is desired
+     * @returns - The drop property click callback
+     */
+    onDropPropertyClick = (key) => {
+        return (event) => {
+            event.preventDefault();
+            const { onChange, formData } = this.props;
+            const copiedFormData = { ...formData };
+            unset(copiedFormData, key);
+            onChange(copiedFormData);
+        };
+    };
+    /** Computes the next available key name from the `preferredKey`, indexing through the already existing keys until one
+     * that is already not assigned is found.
+     *
+     * @param preferredKey - The preferred name of a new key
+     * @param [formData] - The form data in which to check if the desired key already exists
+     * @returns - The name of the next available key from `preferredKey`
+     */
+    getAvailableKey = (preferredKey, formData) => {
+        const { uiSchema, registry } = this.props;
+        const { duplicateKeySuffixSeparator = '-' } = getUiOptions(uiSchema, registry.globalUiOptions);
+        let index = 0;
+        let newKey = preferredKey;
+        while (has(formData, newKey)) {
+            newKey = `${preferredKey}${duplicateKeySuffixSeparator}${++index}`;
+        }
+        return newKey;
+    };
+    /** Returns a callback function that deals with the rename of a key for an additional property for a schema. That
+     * callback will attempt to rename the key and move the existing data to that key, calling `onChange` when it does.
+     *
+     * @param oldValue - The old value of a field
+     * @returns - The key change callback function
+     */
+    onKeyChange = (oldValue) => {
+        return (value, newErrorSchema) => {
+            if (oldValue === value) {
+                return;
+            }
+            const { formData, onChange, errorSchema } = this.props;
+            value = this.getAvailableKey(value, formData);
+            const newFormData = {
+                ...formData,
+            };
+            const newKeys = { [oldValue]: value };
+            const keyValues = Object.keys(newFormData).map((key) => {
+                const newKey = newKeys[key] || key;
+                return { [newKey]: newFormData[key] };
+            });
+            const renamedObj = Object.assign({}, ...keyValues);
+            this.setState({ wasPropertyKeyModified: true });
+            onChange(renamedObj, errorSchema &&
+                errorSchema && {
+                ...errorSchema,
+                [value]: newErrorSchema,
+            });
+        };
+    };
     /** Returns a default value to be used for a new additional schema property of the given `type`
      *
      * @param type - The type of the new additional schema property
@@ -176,25 +141,66 @@ class ObjectField extends Component {
                 return translateString(TranslatableString.NewStringDefault);
         }
     }
+    /** Handles the adding of a new additional property on the given `schema`. Calls the `onChange` callback once the new
+     * default data for that field has been added to the formData.
+     *
+     * @param schema - The schema element to which the new property is being added
+     */
+    handleAddClick = (schema) => () => {
+        if (!(schema.additionalProperties || schema.patternProperties)) {
+            return;
+        }
+        const { formData, onChange, registry } = this.props;
+        const newFormData = { ...formData };
+        const newKey = this.getAvailableKey('newKey', newFormData);
+        if (schema.patternProperties) {
+            // Cast this to make the `set` work properly
+            set(newFormData, newKey, null);
+        }
+        else {
+            let type = undefined;
+            let constValue = undefined;
+            let defaultValue = undefined;
+            if (isObject(schema.additionalProperties)) {
+                type = schema.additionalProperties.type;
+                constValue = schema.additionalProperties.const;
+                defaultValue = schema.additionalProperties.default;
+                let apSchema = schema.additionalProperties;
+                if (REF_KEY in apSchema) {
+                    const { schemaUtils } = registry;
+                    apSchema = schemaUtils.retrieveSchema({ $ref: apSchema[REF_KEY] }, formData);
+                    type = apSchema.type;
+                    constValue = apSchema.const;
+                    defaultValue = apSchema.default;
+                }
+                if (!type && (ANY_OF_KEY in apSchema || ONE_OF_KEY in apSchema)) {
+                    type = 'object';
+                }
+            }
+            const newValue = constValue ?? defaultValue ?? this.getDefaultValue(type);
+            // Cast this to make the `set` work properly
+            set(newFormData, newKey, newValue);
+        }
+        onChange(newFormData);
+    };
     /** Renders the `ObjectField` from the given props
      */
     render() {
-        var _a, _b, _c, _d;
         const { schema: rawSchema, uiSchema = {}, formData, errorSchema, idSchema, name, required = false, disabled, readonly, hideError, idPrefix, idSeparator, onBlur, onFocus, registry, title, } = this.props;
         const { fields, formContext, schemaUtils, translateString, globalUiOptions } = registry;
         const { SchemaField } = fields;
         const schema = schemaUtils.retrieveSchema(rawSchema, formData);
         const uiOptions = getUiOptions(uiSchema, globalUiOptions);
         const { properties: schemaProperties = {} } = schema;
-        const templateTitle = (_c = (_b = (_a = uiOptions.title) !== null && _a !== void 0 ? _a : schema.title) !== null && _b !== void 0 ? _b : title) !== null && _c !== void 0 ? _c : name;
-        const description = (_d = uiOptions.description) !== null && _d !== void 0 ? _d : schema.description;
+        const templateTitle = uiOptions.title ?? schema.title ?? title ?? name;
+        const description = uiOptions.description ?? schema.description;
         let orderedProperties;
         try {
             const properties = Object.keys(schemaProperties);
             orderedProperties = orderProperties(properties, uiOptions.order);
         }
         catch (err) {
-            return (_jsxs("div", { children: [_jsx("p", { className: 'config-error', style: { color: 'red' }, children: _jsx(Markdown, { options: { disableParsingRawHTML: true }, children: translateString(TranslatableString.InvalidObjectField, [name || 'root', err.message]) }) }), _jsx("pre", { children: JSON.stringify(schema) })] }));
+            return (_jsxs("div", { children: [_jsx("p", { className: 'rjsf-config-error', style: { color: 'red' }, children: _jsx(Markdown, { options: { disableParsingRawHTML: true }, children: translateString(TranslatableString.InvalidObjectField, [name || 'root', err.message]) }) }), _jsx("pre", { children: JSON.stringify(schema) })] }));
         }
         const Template = getTemplate('ObjectFieldTemplate', registry, uiOptions);
         const templateProps = {
@@ -230,4 +236,3 @@ class ObjectField extends Component {
     }
 }
 export default ObjectField;
-//# sourceMappingURL=ObjectField.js.map

package/lib/components/fields/SchemaField.d.ts

@@ -8,3 +8,4 @@ declare class SchemaField<T = any, S extends StrictRJSFSchema = RJSFSchema, F ex
     render(): import("react/jsx-runtime").JSX.Element;
 }
 export default SchemaField;
+//# sourceMappingURL=SchemaField.d.ts.map

package/lib/components/fields/SchemaField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaField.d.ts","sourceRoot":"","sources":["../../../src/components/fields/SchemaField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,SAAS,EAAiB,MAAM,OAAO,CAAC;AAC9D,OAAO,EAKL,UAAU,EAEV,eAAe,EAQf,UAAU,EACV,gBAAgB,EAIjB,MAAM,aAAa,CAAC;AA6TrB;;GAEG;AACH,cAAM,WAAW,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,SAAS,gBAAgB,GAAG,UAAU,EAAE,CAAC,SAAS,eAAe,GAAG,GAAG,CAAE,SAAQ,SAAS,CACpH,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CACpB;IACC,qBAAqB,CAAC,SAAS,EAAE,QAAQ,CAAC,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAI9D,MAAM;CAGP;AAED,eAAe,WAAW,CAAC"}

package/lib/components/fields/SchemaField.js

@@ -1,9 +1,8 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, Component } from 'react';
 import { ADDITIONAL_PROPERTY_FLAG, deepEquals, descriptionId, getSchemaType, getTemplate, getUiOptions, ID_KEY, mergeObjects, TranslatableString, UI_OPTIONS_KEY, } from '@rjsf/utils';
-import isObject from 'lodash/isObject';
-import omit from 'lodash/omit';
-import Markdown from 'markdown-to-jsx';
+import isObject from 'lodash-es/isObject.js';
+import omit from 'lodash-es/omit.js';
 /** The map of component type to FieldName */
 const COMPONENT_TYPES = {
     array: 'ArrayField',
@@ -59,7 +58,6 @@ function getFieldComponent(schema, uiOptions, idSchema, registry) {
  * @param props - The `FieldProps` for this component
  */
 function SchemaFieldRender(props) {
-    var _a, _b, _c;
     const { schema: _schema, idSchema: _idSchema, uiSchema, formData, errorSchema, idPrefix, idSeparator, name, onChange, onKeyChange, onDropPropertyClick, required, registry, wasPropertyKeyModified = false, } = props;
     const { formContext, schemaUtils, globalUiOptions } = registry;
     const uiOptions = getUiOptions(uiSchema, globalUiOptions);
@@ -78,12 +76,12 @@ function SchemaFieldRender(props) {
         return onChange(formData, newErrorSchema, theId);
     }, [fieldId, onChange]);
     const FieldComponent = getFieldComponent(schema, uiOptions, idSchema, registry);
-    const disabled = Boolean((_a = uiOptions.disabled) !== null && _a !== void 0 ? _a : props.disabled);
-    const readonly = Boolean((_b = uiOptions.readonly) !== null && _b !== void 0 ? _b : (props.readonly || props.schema.readOnly || schema.readOnly));
+    const disabled = Boolean(uiOptions.disabled ?? props.disabled);
+    const readonly = Boolean(uiOptions.readonly ?? (props.readonly || props.schema.readOnly || schema.readOnly));
     const uiSchemaHideError = uiOptions.hideError;
     // Set hideError to the value provided in the uiSchema, otherwise stick with the prop to propagate to children
     const hideError = uiSchemaHideError === undefined ? props.hideError : Boolean(uiSchemaHideError);
-    const autofocus = Boolean((_c = uiOptions.autofocus) !== null && _c !== void 0 ? _c : props.autofocus);
+    const autofocus = Boolean(uiOptions.autofocus ?? props.autofocus);
     if (Object.keys(schema).length === 0) {
         return null;
     }
@@ -108,18 +106,11 @@ function SchemaFieldRender(props) {
                 : uiOptions.title || props.schema.title || schema.title || props.title || name;
     }
     const description = uiOptions.description || props.schema.description || schema.description || '';
-    const richDescription = uiOptions.enableMarkdownInDescription ? (_jsx(Markdown, { options: { disableParsingRawHTML: true }, children: description })) : (description);
     const help = uiOptions.help;
     const hidden = uiOptions.widget === 'hidden';
-    const classNames = ['form-group', 'field', `field-${getSchemaType(schema)}`];
+    const classNames = ['rjsf-field', `rjsf-field-${getSchemaType(schema)}`];
     if (!hideError && __errors && __errors.length > 0) {
-        classNames.push('field-error has-error has-danger');
-    }
-    if (uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema.classNames) {
-        if (process.env.NODE_ENV !== 'production') {
-            console.warn("'uiSchema.classNames' is deprecated and may be removed in a major release; Use 'ui:classNames' instead.");
-        }
-        classNames.push(uiSchema.classNames);
+        classNames.push('rjsf-field-error');
     }
     if (uiOptions.classNames) {
         classNames.push(uiOptions.classNames);
@@ -131,7 +122,7 @@ function SchemaFieldRender(props) {
      */
     const errorsComponent = hideError || ((schema.anyOf || schema.oneOf) && !schemaUtils.isSelect(schema)) ? undefined : (_jsx(FieldErrorTemplate, { errors: __errors, errorSchema: errorSchema, idSchema: idSchema, schema: schema, uiSchema: uiSchema, registry: registry }));
     const fieldProps = {
-        description: (_jsx(DescriptionFieldTemplate, { id: descriptionId(id), description: richDescription, schema: schema, uiSchema: uiSchema, registry: registry })),
+        description: (_jsx(DescriptionFieldTemplate, { id: descriptionId(id), description: description, schema: schema, uiSchema: uiSchema, registry: registry })),
         rawDescription: description,
         help: helpComponent,
         rawHelp: typeof help === 'string' ? help : undefined,
@@ -158,8 +149,8 @@ function SchemaFieldRender(props) {
     };
     const _AnyOfField = registry.fields.AnyOfField;
     const _OneOfField = registry.fields.OneOfField;
-    const isReplacingAnyOrOneOf = (uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:field']) && (uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:fieldReplacesAnyOrOneOf']) === true;
-    return (_jsx(FieldTemplate, { ...fieldProps, children: _jsxs(_Fragment, { children: [field, schema.anyOf && !isReplacingAnyOrOneOf && !schemaUtils.isSelect(schema) && (_jsx(_AnyOfField, { name: name, disabled: disabled, readonly: readonly, hideError: hideError, errorSchema: errorSchema, formData: formData, formContext: formContext, idPrefix: idPrefix, idSchema: idSchema, idSeparator: idSeparator, onBlur: props.onBlur, onChange: props.onChange, onFocus: props.onFocus, options: schema.anyOf.map((_schema) => schemaUtils.retrieveSchema(isObject(_schema) ? _schema : {}, formData)), registry: registry, schema: schema, uiSchema: uiSchema })), schema.oneOf && !isReplacingAnyOrOneOf && !schemaUtils.isSelect(schema) && (_jsx(_OneOfField, { name: name, disabled: disabled, readonly: readonly, hideError: hideError, errorSchema: errorSchema, formData: formData, formContext: formContext, idPrefix: idPrefix, idSchema: idSchema, idSeparator: idSeparator, onBlur: props.onBlur, onChange: props.onChange, onFocus: props.onFocus, options: schema.oneOf.map((_schema) => schemaUtils.retrieveSchema(isObject(_schema) ? _schema : {}, formData)), registry: registry, schema: schema, uiSchema: uiSchema }))] }) }));
+    const isReplacingAnyOrOneOf = uiSchema?.['ui:field'] && uiSchema?.['ui:fieldReplacesAnyOrOneOf'] === true;
+    return (_jsx(FieldTemplate, { ...fieldProps, children: _jsxs(_Fragment, { children: [field, schema.anyOf && !isReplacingAnyOrOneOf && !schemaUtils.isSelect(schema) && (_jsx(_AnyOfField, { name: name, disabled: disabled, readonly: readonly, hideError: hideError, errorSchema: errorSchema, formData: formData, formContext: formContext, idPrefix: idPrefix, idSchema: idSchema, idSeparator: idSeparator, onBlur: props.onBlur, onChange: props.onChange, onFocus: props.onFocus, options: schema.anyOf.map((_schema) => schemaUtils.retrieveSchema(isObject(_schema) ? _schema : {}, formData)), registry: registry, required: required, schema: schema, uiSchema: uiSchema })), schema.oneOf && !isReplacingAnyOrOneOf && !schemaUtils.isSelect(schema) && (_jsx(_OneOfField, { name: name, disabled: disabled, readonly: readonly, hideError: hideError, errorSchema: errorSchema, formData: formData, formContext: formContext, idPrefix: idPrefix, idSchema: idSchema, idSeparator: idSeparator, onBlur: props.onBlur, onChange: props.onChange, onFocus: props.onFocus, options: schema.oneOf.map((_schema) => schemaUtils.retrieveSchema(isObject(_schema) ? _schema : {}, formData)), registry: registry, required: required, schema: schema, uiSchema: uiSchema }))] }) }));
 }
 /** The `SchemaField` component determines whether it is necessary to rerender the component based on any props changes
  * and if so, calls the `SchemaFieldRender` component with the props.
@@ -173,4 +164,3 @@ class SchemaField extends Component {
     }
 }
 export default SchemaField;
-//# sourceMappingURL=SchemaField.js.map

package/lib/components/fields/StringField.d.ts

@@ -5,3 +5,4 @@ import { FieldProps, FormContextType, RJSFSchema, StrictRJSFSchema } from '@rjsf
  */
 declare function StringField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(props: FieldProps<T, S, F>): import("react/jsx-runtime").JSX.Element;
 export default StringField;
+//# sourceMappingURL=StringField.d.ts.map

package/lib/components/fields/StringField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StringField.d.ts","sourceRoot":"","sources":["../../../src/components/fields/StringField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,UAAU,EACV,eAAe,EACf,UAAU,EACV,gBAAgB,EACjB,MAAM,aAAa,CAAC;AAErB;;;GAGG;AACH,iBAAS,WAAW,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,SAAS,gBAAgB,GAAG,UAAU,EAAE,CAAC,SAAS,eAAe,GAAG,GAAG,EACpG,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,2CAsD3B;AAED,eAAe,WAAW,CAAC"}

package/lib/components/fields/StringField.js

@@ -5,7 +5,6 @@ import { getWidget, getUiOptions, optionsList, hasWidget, } from '@rjsf/utils';
  * @param props - The `FieldProps` for this template
  */
 function StringField(props) {
-    var _a;
     const { schema, name, uiSchema, idSchema, formData, required, disabled = false, readonly = false, autofocus = false, onChange, onBlur, onFocus, registry, rawErrors, hideError, } = props;
     const { title, format } = schema;
     const { widgets, formContext, schemaUtils, globalUiOptions } = registry;
@@ -16,9 +15,8 @@ function StringField(props) {
     }
     const { widget = defaultWidget, placeholder = '', title: uiTitle, ...options } = getUiOptions(uiSchema);
     const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema, globalUiOptions);
-    const label = (_a = uiTitle !== null && uiTitle !== void 0 ? uiTitle : title) !== null && _a !== void 0 ? _a : name;
+    const label = uiTitle ?? title ?? name;
     const Widget = getWidget(schema, widget, widgets);
     return (_jsx(Widget, { options: { ...options, enumOptions }, schema: schema, uiSchema: uiSchema, id: idSchema.$id, name: name, label: label, hideLabel: !displayLabel, hideError: hideError, value: formData, onChange: onChange, onBlur: onBlur, onFocus: onFocus, required: required, disabled: disabled, readonly: readonly, formContext: formContext, autofocus: autofocus, registry: registry, placeholder: placeholder, rawErrors: rawErrors }));
 }
 export default StringField;
-//# sourceMappingURL=StringField.js.map

package/lib/components/fields/index.d.ts

@@ -1,3 +1,4 @@
 import { FormContextType, RegistryFieldsType, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
 declare function fields<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(): RegistryFieldsType<T, S, F>;
 export default fields;
+//# sourceMappingURL=index.d.ts.map

package/lib/components/fields/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/fields/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,eAAe,EAAE,kBAAkB,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAcvG,iBAAS,MAAM,CACb,CAAC,GAAG,GAAG,EACP,CAAC,SAAS,gBAAgB,GAAG,UAAU,EACvC,CAAC,SAAS,eAAe,GAAG,GAAG,KAC5B,kBAAkB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAgB/B;AAED,eAAe,MAAM,CAAC"}

package/lib/components/fields/index.js

@@ -1,17 +1,23 @@
-import ArrayField from './ArrayField';
-import BooleanField from './BooleanField';
-import MultiSchemaField from './MultiSchemaField';
-import NumberField from './NumberField';
-import ObjectField from './ObjectField';
-import SchemaField from './SchemaField';
-import StringField from './StringField';
-import NullField from './NullField';
+import ArrayField from './ArrayField.js';
+import BooleanField from './BooleanField.js';
+import LayoutGridField from './LayoutGridField.js';
+import LayoutHeaderField from './LayoutHeaderField.js';
+import LayoutMultiSchemaField from './LayoutMultiSchemaField.js';
+import MultiSchemaField from './MultiSchemaField.js';
+import NumberField from './NumberField.js';
+import ObjectField from './ObjectField.js';
+import SchemaField from './SchemaField.js';
+import StringField from './StringField.js';
+import NullField from './NullField.js';
 function fields() {
     return {
         AnyOfField: MultiSchemaField,
         ArrayField: ArrayField,
         // ArrayField falls back to SchemaField if ArraySchemaField is not defined, which it isn't by default
         BooleanField,
+        LayoutGridField,
+        LayoutHeaderField,
+        LayoutMultiSchemaField,
         NumberField,
         ObjectField,
         OneOfField: MultiSchemaField,
@@ -21,4 +27,3 @@ function fields() {
     };
 }
 export default fields;
-//# sourceMappingURL=index.js.map

package/lib/components/templates/ArrayFieldDescriptionTemplate.d.ts

@@ -5,3 +5,4 @@ import { ArrayFieldDescriptionProps, FormContextType, RJSFSchema, StrictRJSFSche
  * @param props - The `ArrayFieldDescriptionProps` for the component
  */
 export default function ArrayFieldDescriptionTemplate<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(props: ArrayFieldDescriptionProps<T, S, F>): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=ArrayFieldDescriptionTemplate.d.ts.map

package/lib/components/templates/ArrayFieldDescriptionTemplate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayFieldDescriptionTemplate.d.ts","sourceRoot":"","sources":["../../../src/components/templates/ArrayFieldDescriptionTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,0BAA0B,EAC1B,eAAe,EACf,UAAU,EACV,gBAAgB,EACjB,MAAM,aAAa,CAAC;AAErB;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,6BAA6B,CACnD,CAAC,GAAG,GAAG,EACP,CAAC,SAAS,gBAAgB,GAAG,UAAU,EACvC,CAAC,SAAS,eAAe,GAAG,GAAG,EAC/B,KAAK,EAAE,0BAA0B,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,kDAqB3C"}

package/lib/components/templates/ArrayFieldDescriptionTemplate.js

@@ -15,4 +15,3 @@ export default function ArrayFieldDescriptionTemplate(props) {
     const DescriptionFieldTemplate = getTemplate('DescriptionFieldTemplate', registry, options);
     return (_jsx(DescriptionFieldTemplate, { id: descriptionId(idSchema), description: description, schema: schema, uiSchema: uiSchema, registry: registry }));
 }
-//# sourceMappingURL=ArrayFieldDescriptionTemplate.js.map

package/lib/components/templates/ArrayFieldItemButtonsTemplate.d.ts

@@ -0,0 +1,8 @@
+import { ArrayFieldItemButtonsTemplateType, FormContextType, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
+/** The `ArrayFieldTemplateItemButtons` component is the template used to render the buttons associate3d with items of
+ * an array.
+ *
+ * @param props - The `ArrayFieldItemButtonsTemplateType` props for the component
+ */
+export default function ArrayFieldItemButtonsTemplate<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(props: ArrayFieldItemButtonsTemplateType<T, S, F>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ArrayFieldItemButtonsTemplate.d.ts.map

package/lib/components/templates/ArrayFieldItemButtonsTemplate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayFieldItemButtonsTemplate.d.ts","sourceRoot":"","sources":["../../../src/components/templates/ArrayFieldItemButtonsTemplate.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,iCAAiC,EAEjC,eAAe,EACf,UAAU,EACV,gBAAgB,EACjB,MAAM,aAAa,CAAC;AAErB;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,6BAA6B,CACnD,CAAC,GAAG,GAAG,EACP,CAAC,SAAS,gBAAgB,GAAG,UAAU,EACvC,CAAC,SAAS,eAAe,GAAG,GAAG,EAC/B,KAAK,EAAE,iCAAiC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,2CAkElD"}

package/lib/components/templates/ArrayFieldItemButtonsTemplate.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { buttonId, } from '@rjsf/utils';
+/** The `ArrayFieldTemplateItemButtons` component is the template used to render the buttons associate3d with items of
+ * an array.
+ *
+ * @param props - The `ArrayFieldItemButtonsTemplateType` props for the component
+ */
+export default function ArrayFieldItemButtonsTemplate(props) {
+    const { disabled, hasCopy, hasMoveDown, hasMoveUp, hasRemove, idSchema, index, onCopyIndexClick, onDropIndexClick, onReorderClick, readonly, registry, uiSchema, } = props;
+    const { CopyButton, MoveDownButton, MoveUpButton, RemoveButton } = registry.templates.ButtonTemplates;
+    const onCopyClick = useMemo(() => onCopyIndexClick(index), [index, onCopyIndexClick]);
+    const onRemoveClick = useMemo(() => onDropIndexClick(index), [index, onDropIndexClick]);
+    const onArrowUpClick = useMemo(() => onReorderClick(index, index - 1), [index, onReorderClick]);
+    const onArrowDownClick = useMemo(() => onReorderClick(index, index + 1), [index, onReorderClick]);
+    return (_jsxs(_Fragment, { children: [(hasMoveUp || hasMoveDown) && (_jsx(MoveUpButton, { id: buttonId(idSchema, 'moveUp'), className: 'rjsf-array-item-move-up', disabled: disabled || readonly || !hasMoveUp, onClick: onArrowUpClick, uiSchema: uiSchema, registry: registry })), (hasMoveUp || hasMoveDown) && (_jsx(MoveDownButton, { id: buttonId(idSchema, 'moveDown'), className: 'rjsf-array-item-move-down', disabled: disabled || readonly || !hasMoveDown, onClick: onArrowDownClick, uiSchema: uiSchema, registry: registry })), hasCopy && (_jsx(CopyButton, { id: buttonId(idSchema, 'copy'), className: 'rjsf-array-item-copy', disabled: disabled || readonly, onClick: onCopyClick, uiSchema: uiSchema, registry: registry })), hasRemove && (_jsx(RemoveButton, { id: buttonId(idSchema, 'remove'), className: 'rjsf-array-item-remove', disabled: disabled || readonly, onClick: onRemoveClick, uiSchema: uiSchema, registry: registry }))] }));
+}

package/lib/components/templates/ArrayFieldItemTemplate.d.ts

@@ -1,6 +1,7 @@
-import { ArrayFieldTemplateItemType, FormContextType, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
+import { ArrayFieldItemTemplateType, FormContextType, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
 /** The `ArrayFieldItemTemplate` component is the template used to render an items of an array.
  *
- * @param props - The `ArrayFieldTemplateItemType` props for the component
+ * @param props - The `ArrayFieldItemTemplateType` props for the component
  */
-export default function ArrayFieldItemTemplate<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(props: ArrayFieldTemplateItemType<T, S, F>): import("react/jsx-runtime").JSX.Element;
+export default function ArrayFieldItemTemplate<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(props: ArrayFieldItemTemplateType<T, S, F>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ArrayFieldItemTemplate.d.ts.map

package/lib/components/templates/ArrayFieldItemTemplate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayFieldItemTemplate.d.ts","sourceRoot":"","sources":["../../../src/components/templates/ArrayFieldItemTemplate.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,0BAA0B,EAC1B,eAAe,EAGf,UAAU,EACV,gBAAgB,EACjB,MAAM,aAAa,CAAC;AAErB;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAC5C,CAAC,GAAG,GAAG,EACP,CAAC,SAAS,gBAAgB,GAAG,UAAU,EACvC,CAAC,SAAS,eAAe,GAAG,GAAG,EAC/B,KAAK,EAAE,0BAA0B,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,2CAgC3C"}

package/lib/components/templates/ArrayFieldItemTemplate.js

@@ -1,20 +1,21 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getTemplate, getUiOptions, } from '@rjsf/utils';
 /** The `ArrayFieldItemTemplate` component is the template used to render an items of an array.
  *
- * @param props - The `ArrayFieldTemplateItemType` props for the component
+ * @param props - The `ArrayFieldItemTemplateType` props for the component
  */
 export default function ArrayFieldItemTemplate(props) {
-    const { children, className, disabled, hasToolbar, hasMoveDown, hasMoveUp, hasRemove, hasCopy, index, onCopyIndexClick, onDropIndexClick, onReorderClick, readonly, registry, uiSchema, } = props;
-    const { CopyButton, MoveDownButton, MoveUpButton, RemoveButton } = registry.templates.ButtonTemplates;
+    const { children, className, buttonsProps, hasToolbar, registry, uiSchema } = props;
+    const uiOptions = getUiOptions(uiSchema);
+    const ArrayFieldItemButtonsTemplate = getTemplate('ArrayFieldItemButtonsTemplate', registry, uiOptions);
     const btnStyle = {
         flex: 1,
         paddingLeft: 6,
         paddingRight: 6,
         fontWeight: 'bold',
     };
-    return (_jsxs("div", { className: className, children: [_jsx("div", { className: hasToolbar ? 'col-xs-9' : 'col-xs-12', children: children }), hasToolbar && (_jsx("div", { className: 'col-xs-3 array-item-toolbox', children: _jsxs("div", { className: 'btn-group', style: {
+    return (_jsxs("div", { className: className, children: [_jsx("div", { className: hasToolbar ? 'col-xs-9' : 'col-xs-12', children: children }), hasToolbar && (_jsx("div", { className: 'col-xs-3 array-item-toolbox', children: _jsx("div", { className: 'btn-group', style: {
                         display: 'flex',
                         justifyContent: 'space-around',
-                    }, children: [(hasMoveUp || hasMoveDown) && (_jsx(MoveUpButton, { style: btnStyle, disabled: disabled || readonly || !hasMoveUp, onClick: onReorderClick(index, index - 1), uiSchema: uiSchema, registry: registry })), (hasMoveUp || hasMoveDown) && (_jsx(MoveDownButton, { style: btnStyle, disabled: disabled || readonly || !hasMoveDown, onClick: onReorderClick(index, index + 1), uiSchema: uiSchema, registry: registry })), hasCopy && (_jsx(CopyButton, { style: btnStyle, disabled: disabled || readonly, onClick: onCopyIndexClick(index), uiSchema: uiSchema, registry: registry })), hasRemove && (_jsx(RemoveButton, { style: btnStyle, disabled: disabled || readonly, onClick: onDropIndexClick(index), uiSchema: uiSchema, registry: registry }))] }) }))] }));
+                    }, children: _jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: btnStyle }) }) }))] }));
 }
-//# sourceMappingURL=ArrayFieldItemTemplate.js.map

package/lib/components/templates/ArrayFieldTemplate.d.ts

@@ -1,6 +1,7 @@
 import { ArrayFieldTemplateProps, FormContextType, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
 /** The `ArrayFieldTemplate` component is the template used to render all items in an array.
  *
- * @param props - The `ArrayFieldTemplateItemType` props for the component
+ * @param props - The `ArrayFieldItemTemplateType` props for the component
  */
 export default function ArrayFieldTemplate<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(props: ArrayFieldTemplateProps<T, S, F>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ArrayFieldTemplate.d.ts.map

package/lib/components/templates/ArrayFieldTemplate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayFieldTemplate.d.ts","sourceRoot":"","sources":["../../../src/components/templates/ArrayFieldTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,uBAAuB,EAEvB,eAAe,EACf,UAAU,EACV,gBAAgB,EAEjB,MAAM,aAAa,CAAC;AAErB;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CACxC,CAAC,GAAG,GAAG,EACP,CAAC,SAAS,gBAAgB,GAAG,UAAU,EACvC,CAAC,SAAS,eAAe,GAAG,GAAG,EAC/B,KAAK,EAAE,uBAAuB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,2CAsExC"}