@luomus/laji-form 15.1.63 → 15.1.65

package/lib/components/fields/SingleActiveArrayField.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -17,13 +21,23 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -65,7 +79,7 @@ const popupMappers = {
     }
 };
 const getPopupDataPromise = (props, itemFormData) => {
-    const { popupFields } = utils_1.getUiOptions(props.uiSchema);
+    const { popupFields } = (0, utils_1.getUiOptions)(props.uiSchema);
     if (!props.formData)
         return Promise.resolve({});
     return Promise.all(popupFields.map(field => {
@@ -98,11 +112,11 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
         this.getInitialActiveIdx = (props) => {
             const { formData, uiSchema, schema } = props;
             const formDataLength = (formData || []).length;
-            const options = utils_1.getUiOptions(uiSchema);
+            const options = (0, utils_1.getUiOptions)(uiSchema);
             return (formDataLength === 1 || formDataLength === 0 && schema.minItems) ? 0 : options.initialActiveIdx;
         };
         this.updatePopups = (props) => {
-            const { popupFields } = utils_1.getUiOptions(this.props.uiSchema);
+            const { popupFields } = (0, utils_1.getUiOptions)(this.props.uiSchema);
             let { popups } = this.state;
             let count = 0;
             if (popupFields)
@@ -126,7 +140,7 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
             }
             this.localContextKey = this.state.scrollHeightFixed;
             this.localContext = Object.assign(Object.assign({}, this.props.formContext), { topOffset: this.props.formContext.topOffset + this.state.scrollHeightFixed });
-            this.localContext.utils = utils_1.ReactUtils(this.localContext);
+            this.localContext.utils = (0, utils_1.ReactUtils)(this.localContext);
             return this.localContext;
         };
         this.updateRenderingMode = (normalRendering, callback) => {
@@ -139,7 +153,7 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
             if (this.state.activeIdx === idx) {
                 idx = undefined;
             }
-            const { onActiveChange } = utils_1.getUiOptions(this.props.uiSchema);
+            const { onActiveChange } = (0, utils_1.getUiOptions)(this.props.uiSchema);
             onActiveChange ? onActiveChange(idx, prop, callback) : this.setState({ activeIdx: idx }, callback);
         };
         this.onDelete = (item) => (e) => {
@@ -165,10 +179,10 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
                     const idx = this.state.activeIdx !== undefined ?
                         this.state.activeIdx :
                         formData.length - 1;
-                    ArrayFieldTemplate_1.beforeAdd(this.props, idx + 1);
+                    (0, ArrayFieldTemplate_1.beforeAdd)(this.props, idx + 1);
                     this.props.onChange([
                         ...formData.slice(0, idx + 1),
-                        ArrayField_1.copyItemFunction(this, formData[idx])(...params),
+                        (0, ArrayField_1.copyItemFunction)(this, formData[idx])(...params),
                         ...formData.slice(idx + 1)
                     ]);
                 },
@@ -192,13 +206,13 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
     componentDidMount() {
         this.mounted = true;
         this.updatePopups(this.props);
-        if (utils_1.getUiOptions(this.props.uiSchema).receiveActiveIdxEvents !== false) {
+        if ((0, utils_1.getUiOptions)(this.props.uiSchema).receiveActiveIdxEvents !== false) {
             this.props.formContext.services.customEvents.add(this.props.idSchema.$id, "activeIdx", this.onActiveChange);
         }
     }
     componentWillUnmount() {
         this.mounted = false;
-        if (utils_1.getUiOptions(this.props.uiSchema).receiveActiveIdxEvents !== false) {
+        if ((0, utils_1.getUiOptions)(this.props.uiSchema).receiveActiveIdxEvents !== false) {
             this.props.formContext.services.customEvents.remove(this.props.idSchema.$id, "activeIdx", this.onActiveChange);
         }
     }
@@ -208,14 +222,14 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
         this.updatePopups(props);
     }
     componentDidUpdate(prevProps, prevState) {
-        const options = utils_1.getUiOptions(this.props);
-        const prevOptions = utils_1.getUiOptions(prevProps);
+        const options = (0, utils_1.getUiOptions)(this.props);
+        const prevOptions = (0, utils_1.getUiOptions)(prevProps);
         this.props.formContext.globals[`${this.props.idSchema.$id}.activeIdx`] = this.state.activeIdx;
-        const { idToFocusAfterNavigate, idToScrollAfterNavigate, focusOnNavigate = true, renderer = "accordion", affixed } = utils_1.getUiOptions(this.props.uiSchema);
+        const { idToFocusAfterNavigate, idToScrollAfterNavigate, focusOnNavigate = true, renderer = "accordion", affixed } = (0, utils_1.getUiOptions)(this.props.uiSchema);
         if (renderer === "uncontrolled")
             return;
         if ((prevProps.formData || []).length === (this.props.formData || []).length && ("activeIdx" in options && options.activeIdx !== prevOptions.activeIdx || (!("activeIdx" in options) && this.state.activeIdx !== prevState.activeIdx))) {
-            const id = `${this.props.idSchema.$id}_${utils_1.getFormDataIndex(this.state.activeIdx, this.props.uiSchema)}`;
+            const id = `${this.props.idSchema.$id}_${(0, utils_1.getFormDataIndex)(this.state.activeIdx, this.props.uiSchema)}`;
             const idToScroll = idToScrollAfterNavigate
                 ? idToScrollAfterNavigate
                 : !affixed && (renderer === "accordion" || renderer === "pager")
@@ -237,7 +251,7 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
     }
     getStateFromProps(props) {
         const state = {};
-        const options = utils_1.getUiOptions(props.uiSchema);
+        const options = (0, utils_1.getUiOptions)(props.uiSchema);
         if ("activeIdx" in options) {
             state.activeIdx = options.activeIdx;
         }
@@ -247,13 +261,13 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
         if (!state.activeIdx && this.props && props.idSchema.$id !== this.props.idSchema.$id) {
             state.activeIdx = this.getInitialActiveIdx(props);
         }
-        if (options.sortCols && options.sortCols !== utils_1.getUiOptions(this.props.uiSchema).sortCols) {
+        if (options.sortCols && options.sortCols !== (0, utils_1.getUiOptions)(this.props.uiSchema).sortCols) {
             state.activeIdx = undefined;
         }
         return state;
     }
     render() {
-        const { renderer = "accordion", tableActiveItemClassNames } = utils_1.getUiOptions(this.props.uiSchema);
+        const { renderer = "accordion", tableActiveItemClassNames } = (0, utils_1.getUiOptions)(this.props.uiSchema);
         let ArrayFieldTemplate = undefined;
         switch (renderer) {
             case "accordion":
@@ -273,9 +287,9 @@ let SingleActiveArrayField = class SingleActiveArrayField extends React.Componen
         }
         const formContext = Object.assign(Object.assign({}, this.getLocalFormContext()), { this: this, prevActiveIdx: this.prevActiveIdx, activeIdx: this.state.activeIdx });
         const { registry: { fields: { ArrayField } } } = this.props;
-        const { buttons = [], buttonDefinitions } = utils_1.getUiOptions(this.props.uiSchema);
-        let uiSchema = Object.assign(Object.assign({}, this.props.uiSchema), { "ui:field": undefined, "ui:classNames": undefined, "ui:options": Object.assign(Object.assign({}, utils_1.getUiOptions(this.props.uiSchema)), { buttons, buttonDefinitions: buttonDefinitions
-                    ? deepmerge_1.default(this.buttonDefinitions, buttonDefinitions)
+        const { buttons = [], buttonDefinitions } = (0, utils_1.getUiOptions)(this.props.uiSchema);
+        let uiSchema = Object.assign(Object.assign({}, this.props.uiSchema), { "ui:field": undefined, "ui:classNames": undefined, "ui:options": Object.assign(Object.assign({}, (0, utils_1.getUiOptions)(this.props.uiSchema)), { buttons, buttonDefinitions: buttonDefinitions
+                    ? (0, deepmerge_1.default)(this.buttonDefinitions, buttonDefinitions)
                     : this.buttonDefinitions }) });
         if (renderer === "table" && tableActiveItemClassNames && !this.state.normalRendering) {
             uiSchema = Object.assign(Object.assign({}, uiSchema), { items: Object.assign(Object.assign({}, uiSchema.items), { "ui:classNames": tableActiveItemClassNames }) });
@@ -321,7 +335,7 @@ function handlesButtonsAndFocus(ComposedComponent) {
             this.getFocusHandlers = (props) => {
                 const that = props.formContext.this;
                 return props.items.map((_, i) => {
-                    const idx = utils_1.getFormDataIndex(i, that.props.uiSchema);
+                    const idx = (0, utils_1.getFormDataIndex)(i, that.props.uiSchema);
                     return [`${that.props.idSchema.$id}_${idx}`, () => {
                             if (!isActive(i, that.state.activeIdx))
                                 return new Promise(resolve => {
@@ -333,7 +347,7 @@ function handlesButtonsAndFocus(ComposedComponent) {
             this.getSetOpenHandlers = (props) => {
                 const that = props.formContext.this;
                 return props.items.map((_, i) => {
-                    const idx = utils_1.getFormDataIndex(i, that.props.uiSchema);
+                    const idx = (0, utils_1.getFormDataIndex)(i, that.props.uiSchema);
                     return [`${that.props.idSchema.$id}_${idx}`, (open) => {
                             if (!Array.isArray(that.state.activeIdx)) {
                                 return;
@@ -347,7 +361,7 @@ function handlesButtonsAndFocus(ComposedComponent) {
             };
         }
         getKeyHandlers(props) {
-            const { renderer = "accordion" } = utils_1.getUiOptions(props.uiSchema);
+            const { renderer = "accordion" } = (0, utils_1.getUiOptions)(props.uiSchema);
             const that = props.formContext.this;
             return [ArrayFieldTemplate_1.arrayKeyFunctions, {
                     getProps: () => this.props,
@@ -407,7 +421,7 @@ function handlesButtonsAndFocus(ComposedComponent) {
             const that = props.formContext.this;
             const handlers = [];
             if (that.state.activeIdx !== undefined) {
-                const activeIdxs = utils_1.asArray(that.state.activeIdx);
+                const activeIdxs = (0, utils_1.asArray)(that.state.activeIdx);
                 activeIdxs.forEach((idx) => {
                     const id = `${props.idSchema.$id}_${idx}`;
                     handlers.push([id, ArrayFieldTemplate_1.arrayItemKeyFunctions, { id, getProps: () => this.props, getDeleteButton: () => {
@@ -418,7 +432,7 @@ function handlesButtonsAndFocus(ComposedComponent) {
             return handlers;
         }
     };
-    SingleAndMultiActiveArrayTemplateField.displayName = utils_1.getReactComponentName(ComposedComponent);
+    SingleAndMultiActiveArrayTemplateField.displayName = (0, utils_1.getReactComponentName)(ComposedComponent);
     SingleAndMultiActiveArrayTemplateField = __decorate([
         ArrayFieldTemplate_1.handlesArrayKeys
     ], SingleAndMultiActiveArrayTemplateField);
@@ -426,15 +440,15 @@ function handlesButtonsAndFocus(ComposedComponent) {
 }
 // Swallow unknown prop warnings.
 const ButtonsWrapper = ({ props }) => {
-    const buttons = utils_1.getUiOptions(props.uiSchema).buttons;
-    return React.createElement("div", null, ArrayFieldTemplate_1.getButtonElems(buttons, props));
+    const buttons = (0, utils_1.getUiOptions)(props.uiSchema).buttons;
+    return React.createElement("div", null, (0, ArrayFieldTemplate_1.getButtonElems)(buttons, props));
 };
 const AccordionButtonsWrapper = ({ props, position }) => {
-    const buttons = ArrayFieldTemplate_1.getButtonsForPosition(props, ArrayFieldTemplate_1.getButtons(utils_1.getUiOptions(props.uiSchema).buttons, props), position);
+    const buttons = (0, ArrayFieldTemplate_1.getButtonsForPosition)(props, (0, ArrayFieldTemplate_1.getButtons)((0, utils_1.getUiOptions)(props.uiSchema).buttons, props), position);
     const { Row, Col } = React.useContext(ReactContext_1.default).theme;
     if (!buttons)
         return null;
-    const cols = Object.keys(utils_1.getBootstrapCols()).reduce((cols, colType) => {
+    const cols = Object.keys((0, utils_1.getBootstrapCols)()).reduce((cols, colType) => {
         cols[colType] = (colType === "xs" || buttons.length > 3) ? 12 : 12 / buttons.length;
         return cols;
     }, {});
@@ -457,15 +471,15 @@ let AccordionArrayFieldTemplate = class AccordionArrayFieldTemplate extends Reac
         const that = this.props.formContext.this;
         const arrayFieldTemplateProps = this.props;
         const activeIdx = that.state.activeIdx;
-        const { confirmDelete, closeButton, affixed } = utils_1.getUiOptions(arrayFieldTemplateProps.uiSchema);
+        const { confirmDelete, closeButton, affixed } = (0, utils_1.getUiOptions)(arrayFieldTemplateProps.uiSchema);
         const { translations } = this.props.formContext;
         const { disabled, readonly } = arrayFieldTemplateProps;
         const containerRefs = {};
-        utils_1.asArray(activeIdx).forEach(idx => {
+        (0, utils_1.asArray)(activeIdx).forEach(idx => {
             containerRefs[idx] = React.createRef();
         });
         const getHeader = (item, idx) => {
-            let header = React.createElement(AccordionHeader, { ref: this.setHeaderRef, that: that, idx: idx, wrapperClassName: "panel-title", className: "laji-form-panel-header laji-form-clickable-panel-header laji-form-accordion-header" }, item.hasRemove && React.createElement(components_1.DeleteButton, { id: `${that.props.idSchema.$id}_${utils_1.getFormDataIndex(idx, that.props.uiSchema)}`, disabled: disabled || readonly, ref: this.setDeleteButtonRef(idx), className: "pull-right", confirm: confirmDelete, translations: translations, onClick: that.onDelete(item) }));
+            let header = React.createElement(AccordionHeader, { ref: this.setHeaderRef, that: that, idx: idx, wrapperClassName: "panel-title", className: "laji-form-panel-header laji-form-clickable-panel-header laji-form-accordion-header" }, item.hasRemove && React.createElement(components_1.DeleteButton, { id: `${that.props.idSchema.$id}_${(0, utils_1.getFormDataIndex)(idx, that.props.uiSchema)}`, disabled: disabled || readonly, ref: this.setDeleteButtonRef(idx), className: "pull-right", confirm: confirmDelete, translations: translations, onClick: that.onDelete(item) }));
             if (affixed && isActive(idx, activeIdx)) {
                 const offset = this.props.formContext.topOffset - (that.state.scrollHeightFixed);
                 header = (React.createElement(components_1.Affix, { containerRef: containerRefs[idx], topOffset: offset, onAffixChange: this.onHeaderAffixChange }, header));
@@ -476,7 +490,7 @@ let AccordionArrayFieldTemplate = class AccordionArrayFieldTemplate extends Reac
         return (React.createElement("div", { className: "laji-form-single-active-array no-transition" },
             React.createElement(AccordionButtonsWrapper, { props: arrayFieldTemplateProps, position: "top" }),
             React.createElement(Accordion, { onSelect: this.onSelect, activeKey: activeIdx === undefined ? -1 : activeIdx, id: `${that.props.idSchema.$id}-accordion` },
-                arrayFieldTemplateProps.items.map((item, idx) => (React.createElement(Panel, { key: idx, ref: containerRefs[idx], id: `${this.props.idSchema.$id}_${utils_1.getFormDataIndex(idx, that.props.uiSchema)}-panel`, className: "laji-form-panel laji-form-clickable-panel", eventKey: idx, variant: utils_1.filteredErrors(that.props.errorSchema)[utils_1.getFormDataIndex(idx, that.props.uiSchema)] ? "danger" : "default" },
+                arrayFieldTemplateProps.items.map((item, idx) => (React.createElement(Panel, { key: idx, ref: containerRefs[idx], id: `${this.props.idSchema.$id}_${(0, utils_1.getFormDataIndex)(idx, that.props.uiSchema)}-panel`, className: "laji-form-panel laji-form-clickable-panel", eventKey: idx, variant: (0, utils_1.filteredErrors)(that.props.errorSchema)[(0, utils_1.getFormDataIndex)(idx, that.props.uiSchema)] ? "danger" : "default" },
                     React.createElement(Panel.Heading, null, getHeader(item, idx)),
                     isActive(idx, activeIdx) ? (React.createElement(Panel.Body, null,
                         item.children,
@@ -487,11 +501,11 @@ let AccordionArrayFieldTemplate = class AccordionArrayFieldTemplate extends Reac
                 React.createElement(AccordionButtonsWrapper, { props: arrayFieldTemplateProps, position: "bottom" }))));
     }
 };
+exports.AccordionArrayFieldTemplate = AccordionArrayFieldTemplate;
 AccordionArrayFieldTemplate.contextType = ReactContext_1.default;
-AccordionArrayFieldTemplate = __decorate([
+exports.AccordionArrayFieldTemplate = AccordionArrayFieldTemplate = __decorate([
     handlesButtonsAndFocus
 ], AccordionArrayFieldTemplate);
-exports.AccordionArrayFieldTemplate = AccordionArrayFieldTemplate;
 // does not support MultiActiveArrayField
 let PagerArrayFieldTemplate = class PagerArrayFieldTemplate extends React.Component {
     constructor() {
@@ -513,7 +527,7 @@ let PagerArrayFieldTemplate = class PagerArrayFieldTemplate extends React.Compon
         const that = this.props.formContext.this;
         const arrayTemplateFieldProps = this.props;
         const { translations } = that.props.formContext;
-        const { buttons, affixed, headerClassName, confirmDelete } = utils_1.getUiOptions(arrayTemplateFieldProps.uiSchema);
+        const { buttons, affixed, headerClassName, confirmDelete } = (0, utils_1.getUiOptions)(arrayTemplateFieldProps.uiSchema);
         const activeIdx = that.state.activeIdx;
         const { Pager } = this.context.theme;
         let header = (React.createElement("div", { className: `laji-form-panel-header laji-form-accordion-header${headerClassName ? ` ${headerClassName}` : ""}`, ref: this.setHeaderRef },
@@ -538,10 +552,10 @@ let PagerArrayFieldTemplate = class PagerArrayFieldTemplate extends React.Compon
                     React.createElement(Panel, { className: "laji-form-panel" },
                         React.createElement(Panel.Heading, null, header),
                         React.createElement(Panel.Body, null,
-                            React.createElement("div", { key: utils_1.getUUID(this.props.formData[activeIdx]) || activeIdx }, activeIdx !== undefined && arrayTemplateFieldProps.items && arrayTemplateFieldProps.items[activeIdx] ? arrayTemplateFieldProps.items[activeIdx].children : null))),
-                    ArrayFieldTemplate_1.getButtonElems(buttons, arrayTemplateFieldProps)),
+                            React.createElement("div", { key: (0, utils_1.getUUID)(this.props.formData[activeIdx]) || activeIdx }, activeIdx !== undefined && arrayTemplateFieldProps.items && arrayTemplateFieldProps.items[activeIdx] ? arrayTemplateFieldProps.items[activeIdx].children : null))),
+                    (0, ArrayFieldTemplate_1.getButtonElems)(buttons, arrayTemplateFieldProps)),
                 React.createElement("div", { className: "laji-form-field-template-buttons" }, activeIdx !== undefined && arrayTemplateFieldProps.items[activeIdx].hasRemove
-                    ? (React.createElement(components_1.DeleteButton, { id: `${that.props.idSchema.$id}_${utils_1.getFormDataIndex(activeIdx, that.props.uiSchema)}`, ref: this.setDeleteButtonRef(activeIdx), className: "pull-right", confirm: confirmDelete, translations: translations, onClick: that.onDelete(arrayTemplateFieldProps.items[activeIdx]) }))
+                    ? (React.createElement(components_1.DeleteButton, { id: `${that.props.idSchema.$id}_${(0, utils_1.getFormDataIndex)(activeIdx, that.props.uiSchema)}`, ref: this.setDeleteButtonRef(activeIdx), className: "pull-right", confirm: confirmDelete, translations: translations, onClick: that.onDelete(arrayTemplateFieldProps.items[activeIdx]) }))
                     : null))));
     }
 };
@@ -555,14 +569,14 @@ let UncontrolledArrayFieldTemplate = class UncontrolledArrayFieldTemplate extend
         const that = this.props.formContext.this;
         const arrayTemplateFieldProps = this.props;
         const activeIdx = that.state.activeIdx;
-        const TitleFieldTemplate = utils_3.getTemplate("TitleFieldTemplate", this.props.registry, utils_1.getUiOptions(this.props.uiSchema));
-        const DescriptionFieldTemplate = utils_3.getTemplate("DescriptionFieldTemplate", this.props.registry, utils_1.getUiOptions(this.props.uiSchema));
+        const TitleFieldTemplate = (0, utils_3.getTemplate)("TitleFieldTemplate", this.props.registry, (0, utils_1.getUiOptions)(this.props.uiSchema));
+        const DescriptionFieldTemplate = (0, utils_3.getTemplate)("DescriptionFieldTemplate", this.props.registry, (0, utils_1.getUiOptions)(this.props.uiSchema));
         const { Label } = this.props.formContext;
-        const Title = utils_1.getUiOptions(that.props.uiSchema).renderTitleAsLabel ? Label : TitleFieldTemplate;
-        const title = utils_1.getTitle(this.props, activeIdx);
-        const titleUiSchema = Object.assign(Object.assign({}, arrayTemplateFieldProps.uiSchema), { "ui:options": Object.assign(Object.assign({}, utils_1.getUiOptions(arrayTemplateFieldProps.uiSchema)), { titleFormatters: that.props.uiSchema.titleFormatters }) });
+        const Title = (0, utils_1.getUiOptions)(that.props.uiSchema).renderTitleAsLabel ? Label : TitleFieldTemplate;
+        const title = (0, utils_1.getTitle)(this.props, activeIdx);
+        const titleUiSchema = Object.assign(Object.assign({}, arrayTemplateFieldProps.uiSchema), { "ui:options": Object.assign(Object.assign({}, (0, utils_1.getUiOptions)(arrayTemplateFieldProps.uiSchema)), { titleFormatters: that.props.uiSchema.titleFormatters }) });
         return activeIdx !== undefined && arrayTemplateFieldProps.items && arrayTemplateFieldProps.items[activeIdx] ?
-            React.createElement("div", { key: utils_1.getUUID(this.props.formData[activeIdx]) || activeIdx },
+            React.createElement("div", { key: (0, utils_1.getUUID)(this.props.formData[activeIdx]) || activeIdx },
                 React.createElement(Title, { title: title, label: title, schema: this.props.schema, uiSchema: titleUiSchema, formData: that.props.formData, registry: this.props.registry, id: this.props.idSchema.$id }),
                 React.createElement(DescriptionFieldTemplate, { description: this.props.uiSchema["ui:description"], schema: this.props.schema }),
                 arrayTemplateFieldProps.items[activeIdx].children)
@@ -583,12 +597,12 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
         // Sets state.normalRendering on if screen is too small for table layout.
         this.updateRenderingMode = (callback) => {
             const _callback = (updateLayout = true) => {
-                if (updateLayout && this._lastWidth && utils_1.pixelsToBsSize(this._lastWidth) !== utils_1.pixelsToBsSize(window.innerWidth)) {
+                if (updateLayout && this._lastWidth && (0, utils_1.pixelsToBsSize)(this._lastWidth) !== (0, utils_1.pixelsToBsSize)(window.innerWidth)) {
                     this.updateLayout(null, callback);
                 }
             };
             const that = this.props.formContext.this;
-            const { normalRenderingTreshold } = utils_1.getUiOptions(this.props.uiSchema);
+            const { normalRenderingTreshold } = (0, utils_1.getUiOptions)(this.props.uiSchema);
             let initialized = false;
             if (Object.keys(this.state).length === 0) {
                 initialized = true;
@@ -603,7 +617,7 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
                 }
                 return;
             }
-            let treshold = utils_1.bsSizeToPixels(normalRenderingTreshold);
+            let treshold = (0, utils_1.bsSizeToPixels)(normalRenderingTreshold);
             requestAnimationFrame(() => {
                 let normalRendering = undefined;
                 if (!this.state.normalRendering && window.innerWidth <= treshold) {
@@ -650,7 +664,7 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
         this.getStyles = () => {
             const that = this.props.formContext.this;
             const { activeIdx } = that.state;
-            const { activeHeightOffset = 0 } = utils_1.getUiOptions(this.props.uiSchema);
+            const { activeHeightOffset = 0 } = (0, utils_1.getUiOptions)(this.props.uiSchema);
             const rowElem = this.itemElems[activeIdx];
             if (!rowElem || !this.activeElem)
                 return;
@@ -674,22 +688,22 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
                 });
             return that.deleteButtonRefSetters[idx];
         };
-        this.customEventSender = memoizee_1.default((eventName) => memoizee_1.default((idx) => () => {
+        this.customEventSender = (0, memoizee_1.default)((eventName) => (0, memoizee_1.default)((idx) => () => {
             const that = this.props.formContext.this;
             that.props.formContext.services.customEvents.send(that.props.idSchema.$id, eventName, { idx });
         }));
-        this.onKeyDownActivate = memoizee_1.default((idx) => (e) => {
+        this.onKeyDownActivate = (0, memoizee_1.default)((idx) => (e) => {
             if (idx !== this.state.activeIdx && (e.key === " " || e.key === "Enter")) {
                 this.getOnChangeActive(idx)();
                 e.preventDefault();
                 e.stopPropagation();
             }
         });
-        this.getOnChangeActive = memoizee_1.default(idx => () => {
+        this.getOnChangeActive = (0, memoizee_1.default)(idx => () => {
             const that = this.props.formContext.this;
             idx !== that.state.activeIdx && that.onActiveChange(idx, undefined, this.updateLayout);
         });
-        this.getOnHeaderClick = memoizee_1.default((col, onSortToggle) => () => onSortToggle(col));
+        this.getOnHeaderClick = (0, memoizee_1.default)((col, onSortToggle) => () => onSortToggle(col));
         this.state = {};
         this.itemElems = [];
         this.resizeObserver = new ResizeObserver(this.onResize);
@@ -734,12 +748,12 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
         }
     }
     getSortableHeaderProps(col, props) {
-        const { onSortToggle, sortCols, ui, sortableColumns, sortColTooltips } = utils_1.getUiOptions(props.uiSchema);
+        const { onSortToggle, sortCols, ui, sortableColumns, sortColTooltips } = (0, utils_1.getUiOptions)(props.uiSchema);
         if (!onSortToggle || sortableColumns && !sortableColumns.includes(col)) {
             return {};
         }
         const sortCol = sortCols.find(({ name }) => name === col);
-        const className = utils_1.classNames((sortCol === null || sortCol === void 0 ? void 0 : sortCol.descending)
+        const className = (0, utils_1.classNames)((sortCol === null || sortCol === void 0 ? void 0 : sortCol.descending)
             ? "laji-form-col-desc"
             : (sortCol === null || sortCol === void 0 ? void 0 : sortCol.descending) === false
                 ? "laji-form-col-asc"
@@ -752,26 +766,26 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
             return React.createElement(ArrayFieldTemplate_1.default, Object.assign({}, this.props));
         }
         const { schema, uiSchema = {}, formData = [], items, disabled, readonly } = this.props;
-        const TitleFieldTemplate = utils_3.getTemplate("TitleFieldTemplate", this.props.registry, utils_1.getUiOptions(uiSchema));
-        const DescriptionFieldTemplate = utils_3.getTemplate("DescriptionFieldTemplate", this.props.registry, utils_1.getUiOptions(uiSchema));
-        const { renderTitleAsLabel, formatters = {}, shownColumns = [], removable = true } = utils_1.getUiOptions(uiSchema);
+        const TitleFieldTemplate = (0, utils_3.getTemplate)("TitleFieldTemplate", this.props.registry, (0, utils_1.getUiOptions)(uiSchema));
+        const DescriptionFieldTemplate = (0, utils_3.getTemplate)("DescriptionFieldTemplate", this.props.registry, (0, utils_1.getUiOptions)(uiSchema));
+        const { renderTitleAsLabel, formatters = {}, shownColumns = [], removable = true } = (0, utils_1.getUiOptions)(uiSchema);
         const { Label } = this.props.formContext;
         const Title = renderTitleAsLabel ? Label : TitleFieldTemplate;
         const foundProps = {};
-        const shownColumnsDict = utils_1.dictionarify(shownColumns);
-        const { tmpImgs = {} } = Context_1.default("IMAGE_ARRAY_FIELD");
+        const shownColumnsDict = (0, utils_1.dictionarify)(shownColumns);
+        const { tmpImgs = {} } = (0, Context_1.default)("IMAGE_ARRAY_FIELD");
         let cols = Object.keys(schema.items.properties).reduce((_cols, prop) => {
             if (formData.some(item => {
                 const found = shownColumnsDict[prop]
                     || foundProps[prop]
                     || (prop in item
-                        && !utils_1.isEmptyString(item[prop])
+                        && !(0, utils_1.isEmptyString)(item[prop])
                         && (!Array.isArray(item[prop])
                             || Array.isArray(item[prop]) && !item[prop].every(utils_1.isEmptyString))
-                        && !utils_1.isDefaultData(item[prop], schema.items.properties[prop])
-                        && !utils_1.isHidden(uiSchema.items || {}, prop)
-                        && !utils_1.isHidden(utils_1.getNestedTailUiSchema(uiSchema.items || {}), prop))
-                    || uiSchema.items && uiSchema.items[prop] && uiSchema.items[prop]["ui:field"] === "ImageArrayField" && utils_1.getUUID(item) && tmpImgs[utils_1.getUUID(item)];
+                        && !(0, utils_1.isDefaultData)(item[prop], schema.items.properties[prop])
+                        && !(0, utils_1.isHidden)(uiSchema.items || {}, prop)
+                        && !(0, utils_1.isHidden)((0, utils_1.getNestedTailUiSchema)(uiSchema.items || {}), prop))
+                    || uiSchema.items && uiSchema.items[prop] && uiSchema.items[prop]["ui:field"] === "ImageArrayField" && (0, utils_1.getUUID)(item) && tmpImgs[(0, utils_1.getUUID)(item)];
                 if (found)
                     foundProps[prop] = true;
                 return found;
@@ -782,18 +796,18 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
         }, []);
         const { "ui:order": order } = (uiSchema.items || {});
         if (order)
-            cols = utils_2.orderProperties(cols, order.filter(field => field === "*" || foundProps[field]));
+            cols = (0, utils_2.orderProperties)(cols, order.filter(field => field === "*" || foundProps[field]));
         const that = this.props.formContext.this;
         const { errorSchema } = that.props;
         const activeIdx = that.state.activeIdx;
-        const { confirmDelete } = utils_1.getUiOptions(uiSchema);
+        const { confirmDelete } = (0, utils_1.getUiOptions)(uiSchema);
         const getDeleteButtonFor = (idx, item) => {
-            return removable && React.createElement(components_1.DeleteButton, { id: `${that.props.idSchema.$id}_${idx}`, disabled: disabled || readonly, ref: this.getDeleteButtonRef(idx), key: utils_1.getUUID(this.props.formData[item.index]) || item.key, confirm: confirmDelete, translations: this.props.formContext.translations, onClick: that.onDelete(item) });
+            return removable && React.createElement(components_1.DeleteButton, { id: `${that.props.idSchema.$id}_${idx}`, disabled: disabled || readonly, ref: this.getDeleteButtonRef(idx), key: (0, utils_1.getUUID)(this.props.formData[item.index]) || item.key, confirm: confirmDelete, translations: this.props.formContext.translations, onClick: that.onDelete(item) });
         };
         const setItemRef = idx => elem => {
             this.itemElems[idx] = elem;
         };
-        const title = utils_1.getTitle(this.props, that.state.activeIdx);
+        const title = (0, utils_1.getTitle)(this.props, that.state.activeIdx);
         const onMouseEnter = this.customEventSender("startHighlight");
         const onMouseLeave = this.customEventSender("endHighlight");
         const { Table } = this.context.theme;
@@ -808,7 +822,7 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
                                 cols.length ? cols.map(col => {
                                     const sortableHeaderProps = this.getSortableHeaderProps(col, this.props);
                                     const { ui, tooltip } = sortableHeaderProps, _sortableHeaderProps = __rest(sortableHeaderProps, ["ui", "tooltip"]);
-                                    const className = utils_1.classNames("darker", sortableHeaderProps.className);
+                                    const className = (0, utils_1.classNames)("darker", sortableHeaderProps.className);
                                     return (React.createElement(components_1.TooltipComponent, { key: col, tooltip: tooltip, placement: "top", id: `${this.props.idSchema[col].$id}-header` },
                                         React.createElement("th", Object.assign({ key: col }, _sortableHeaderProps, { className: className }),
                                             ((uiSchema.items || {})[col] || {})["ui:title"] || schema.items.properties[col].title,
@@ -819,12 +833,12 @@ let TableArrayFieldTemplate = class TableArrayFieldTemplate extends React.Compon
                         React.createElement("tbody", null, formData.map((_, idx) => {
                             const item = items[idx];
                             let className = "";
-                            if (utils_1.filteredErrors(errorSchema)[utils_1.getFormDataIndex(idx, uiSchema)])
+                            if ((0, utils_1.filteredErrors)(errorSchema)[(0, utils_1.getFormDataIndex)(idx, uiSchema)])
                                 className = className ? `${className} bg-danger` : "bg-danger";
                             return [
-                                React.createElement("tr", { key: utils_1.getUUID(this.props.formData[item.index]) || item.key, onClick: this.getOnChangeActive(idx), className: className, tabIndex: idx === activeIdx ? undefined : 0, role: idx === activeIdx ? undefined : "button", id: idx !== activeIdx ? `_laji-form_${ArrayField_2.ArrayFieldPatched.prototype.getIdSchema(this.props, idx).$id}` : undefined, ref: setItemRef(idx), style: idx === activeIdx ? this.state.activeTrStyle : undefined, onMouseEnter: onMouseEnter(idx), onMouseLeave: onMouseLeave(idx), onKeyDown: this.onKeyDownActivate(idx) },
-                                    cols.length ? cols.map(col => React.createElement("td", { key: col }, utils_1.formatValue(Object.assign(Object.assign({}, that.props), { schema: schema.items.properties[col], uiSchema: (uiSchema.items || {})[col], formData: formData[idx][col] }), formatters[col], { formData: formData[idx] }))) : React.createElement("td", null),
-                                    (activeIdx !== undefined && items[activeIdx] && idx === activeIdx) ? (React.createElement("td", { key: utils_1.getUUID(formData[activeIdx]) || activeIdx, className: "single-active-array-table-content-col" },
+                                React.createElement("tr", { key: (0, utils_1.getUUID)(this.props.formData[item.index]) || item.key, onClick: this.getOnChangeActive(idx), className: className, tabIndex: idx === activeIdx ? undefined : 0, role: idx === activeIdx ? undefined : "button", id: idx !== activeIdx ? `_laji-form_${ArrayField_2.ArrayFieldPatched.prototype.getIdSchema(this.props, idx).$id}` : undefined, ref: setItemRef(idx), style: idx === activeIdx ? this.state.activeTrStyle : undefined, onMouseEnter: onMouseEnter(idx), onMouseLeave: onMouseLeave(idx), onKeyDown: this.onKeyDownActivate(idx) },
+                                    cols.length ? cols.map(col => React.createElement("td", { key: col }, (0, utils_1.formatValue)(Object.assign(Object.assign({}, that.props), { schema: schema.items.properties[col], uiSchema: (uiSchema.items || {})[col], formData: formData[idx][col] }), formatters[col], { formData: formData[idx] }))) : React.createElement("td", null),
+                                    (activeIdx !== undefined && items[activeIdx] && idx === activeIdx) ? (React.createElement("td", { key: (0, utils_1.getUUID)(formData[activeIdx]) || activeIdx, className: "single-active-array-table-content-col" },
                                         React.createElement("div", { className: "laji-form-field-template-item keep-vertical", style: this.state.activeStyle, ref: this.setActiveRef },
                                             React.createElement("div", { className: "laji-form-field-template-schema" }, items[activeIdx].children),
                                             React.createElement("div", { className: "laji-form-field-template-buttons" })))) : React.createElement("td", { className: "single-active-array-table-content-col" }),
@@ -866,10 +880,10 @@ const headerFormatters = {
             that.hoveredIdx = idx;
             if (!force && isActive(idx, that.state.activeIdx))
                 return;
-            const map = Context_1.default(`${that.props.formContext.contextId}_MAP`).map;
+            const map = (0, Context_1.default)(`${that.props.formContext.contextId}_MAP`).map;
             const gatheringGeometries = (item && item.geometry && item.geometry.geometries) ? item.geometry.geometries : [];
             const unitGeometries = [...(item && item.units ? item.units : [])]
-                .filter(unit => unit.unitGathering && utils_1.hasData(unit.unitGathering.geometry))
+                .filter(unit => unit.unitGathering && (0, utils_1.hasData)(unit.unitGathering.geometry))
                 .map(unit => unit.unitGathering.geometry);
             const geometries = [...gatheringGeometries, ...unitGeometries]
                 .map(geometry => {
@@ -882,7 +896,7 @@ const headerFormatters = {
             });
         },
         onMouseLeave: (that) => {
-            const map = Context_1.default(`${that.props.formContext.contextId}_MAP`).map;
+            const map = (0, Context_1.default)(`${that.props.formContext.contextId}_MAP`).map;
             const lastData = map.data[map.data.length - 1];
             if (lastData && lastData.temp) {
                 map.removeData(map.data.length - 1);
@@ -920,7 +934,7 @@ const headerFormatters = {
             render() {
                 const { name } = this.state;
                 const { locality } = (this.props.that.props.formData || {})[this.props.idx] || {};
-                return React.createElement("span", { className: "text-muted" }, !utils_1.isEmptyString(name) ? name : locality);
+                return React.createElement("span", { className: "text-muted" }, !(0, utils_1.isEmptyString)(name) ? name : locality);
             }
         }
     },
@@ -938,10 +952,10 @@ const headerFormatters = {
     },
     lolife: {
         onMouseEnter: (that, idx) => {
-            that.props.formContext.services.customEvents.send(that.props.idSchema.$id, "startHighlight", { id: utils_1.getUUID(that.props.formData[idx]) });
+            that.props.formContext.services.customEvents.send(that.props.idSchema.$id, "startHighlight", { id: (0, utils_1.getUUID)(that.props.formData[idx]) });
         },
         onMouseLeave: (that, idx) => {
-            that.props.formContext.services.customEvents.send(that.props.idSchema.$id, "endHighlight", { id: utils_1.getUUID(that.props.formData[idx]) });
+            that.props.formContext.services.customEvents.send(that.props.idSchema.$id, "endHighlight", { id: (0, utils_1.getUUID)(that.props.formData[idx]) });
         }
     },
     unitTaxons: {
@@ -956,13 +970,13 @@ const headerFormatters = {
                     `/identifications/${idx}/author`
                 ];
                 const taxonString = taxonFields.reduce((res, field) => {
-                    const formattedValue = utils_1.formatValue(Object.assign(Object.assign({}, _props), { schema: utils_1.parseSchemaFromFormDataPointer(_props.schema.items, field), uiSchema: utils_1.parseUiSchemaFromFormDataPointer(_props.uiSchema.items, field), formData: utils_1.parseJSONPointer(unit, field, !!"safely") }));
-                    if (!utils_1.isEmptyString(formattedValue)) {
+                    const formattedValue = (0, utils_1.formatValue)(Object.assign(Object.assign({}, _props), { schema: (0, utils_1.parseSchemaFromFormDataPointer)(_props.schema.items, field), uiSchema: (0, utils_1.parseUiSchemaFromFormDataPointer)(_props.uiSchema.items, field), formData: (0, utils_1.parseJSONPointer)(unit, field, !!"safely") }));
+                    if (!(0, utils_1.isEmptyString)(formattedValue)) {
                         res.push(formattedValue);
                     }
                     return res;
                 }, []).join(" ");
-                if (!utils_1.isEmptyString(taxonString)) {
+                if (!(0, utils_1.isEmptyString)(taxonString)) {
                     result.push(taxonString);
                 }
                 return result;
@@ -978,7 +992,7 @@ const headerFormatters = {
                 return null;
             }
             return React.createElement("span", { className: "text-muted" },
-                React.createElement("small", null, utils_1.getLajiUri(id)));
+                React.createElement("small", null, (0, utils_1.getLajiUri)(id)));
         }
     }
 };
@@ -1009,7 +1023,7 @@ class AccordionHeader extends React.Component {
             const { uiSchema, schema } = that.props;
             const formData = (that.props.formData || {})[this.props.idx];
             // try both headerFormatters & headerFormatter for backward compatibility. TODO: Remove in future.
-            const options = utils_1.getUiOptions(uiSchema);
+            const options = (0, utils_1.getUiOptions)(uiSchema);
             let _headerFormatters = options.headerFormatters || options.headerFormatter || [];
             if (_headerFormatters && !Array.isArray(_headerFormatters))
                 _headerFormatters = [_headerFormatters];
@@ -1022,9 +1036,9 @@ class AccordionHeader extends React.Component {
                 else
                     return {
                         component: () => {
-                            const { field, default: _default } = utils_1.isObject(formatter) ? formatter : { field: formatter };
-                            const formattedValue = utils_1.formatValue(Object.assign(Object.assign({}, that.props), { schema: utils_1.parseSchemaFromFormDataPointer(schema.items, field), uiSchema: utils_1.parseUiSchemaFromFormDataPointer(uiSchema.items, field), formData: utils_1.parseJSONPointer(formData, field, !!"safely") }));
-                            const value = utils_1.isEmptyString(formattedValue) ? _default : formattedValue;
+                            const { field, default: _default } = (0, utils_1.isObject)(formatter) ? formatter : { field: formatter };
+                            const formattedValue = (0, utils_1.formatValue)(Object.assign(Object.assign({}, that.props), { schema: (0, utils_1.parseSchemaFromFormDataPointer)(schema.items, field), uiSchema: (0, utils_1.parseUiSchemaFromFormDataPointer)(uiSchema.items, field), formData: (0, utils_1.parseJSONPointer)(formData, field, !!"safely") }));
+                            const value = (0, utils_1.isEmptyString)(formattedValue) ? _default : formattedValue;
                             return React.createElement("span", { className: "text-muted" }, value);
                         }
                     };
@@ -1044,7 +1058,7 @@ class AccordionHeader extends React.Component {
     render() {
         var _a;
         const { that, idx } = this.props;
-        const title = utils_1.getTitle(that.props, idx);
+        const title = (0, utils_1.getTitle)(that.props, idx);
         const popupData = (_a = that.state.popups) === null || _a === void 0 ? void 0 : _a[idx];
         const { uiSchema } = that.props;
         const hasHelp = uiSchema && uiSchema["ui:help"];
@@ -1066,11 +1080,11 @@ class AccordionHeader extends React.Component {
         const { Tooltip } = this.context.theme;
         const tooltip = React.createElement(Tooltip, { id: `${that.props.idSchema.$id}_${idx}-help` }, uiSchema["ui:help"]);
         const headerTextComponent = hasHelp ? React.createElement(components_1.OverlayTrigger, { placement: "right", overlay: tooltip, show: this.state && this.state.focused || undefined }, headerText) : headerText;
-        const header = (React.createElement("div", { className: this.props.className, role: "tab", id: `${that.props.idSchema.$id}_${utils_1.getFormDataIndex(idx, that.props.uiSchema)}-header`, onClick: this.onHeaderClick, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onKeyDown: this.onKeyDown, tabIndex: "0" },
+        const header = (React.createElement("div", { className: this.props.className, role: "tab", id: `${that.props.idSchema.$id}_${(0, utils_1.getFormDataIndex)(idx, that.props.uiSchema)}-header`, onClick: this.onHeaderClick, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onKeyDown: this.onKeyDown, tabIndex: "0" },
             React.createElement("div", { className: this.props.wrapperClassName },
                 headerTextComponent,
                 this.props.children)));
-        return utils_1.hasData(popupData) ? (React.createElement(components_1.OverlayTrigger, { placement: "left", overlay: React.createElement(Tooltip, { id: "nav-tooltip-" + idx },
+        return (0, utils_1.hasData)(popupData) ? (React.createElement(components_1.OverlayTrigger, { placement: "left", overlay: React.createElement(Tooltip, { id: "nav-tooltip-" + idx },
                 React.createElement(Popup, { data: popupData })) }, header)) : (header);
     }
 }

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

@@ -1,12 +1,13 @@
 export default class SingleItemArrayField extends React.Component<any, any, any> {
     static propTypes: {
-        schema: PropTypes.Validator<PropTypes.InferProps<{
+        schema: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
-        }>>;
+        }>>>;
         formData: PropTypes.Requireable<any[]>;
     };
     static getName(): string;
     constructor(props: any);
+    componentDidUpdate(): void;
     getStateFromProps(props: any): any;
     getActiveIdx: (props: any) => any;
     onChange: (formData: any) => void;