@luomus/laji-form 15.1.52 → 15.1.54

package/lib/components/components.js

@@ -401,8 +401,8 @@ function Label({ label, children, id, required, registry = {}, uiSchema = {} })
     }, []);
     const LabelComponent = labelComponent || "label";
     const labelElem = (React.createElement(LabelComponent, { htmlFor: id, "aria-describedby": `${id}--help` },
-        React.createElement("div", null,
-            React.createElement("strong", { dangerouslySetInnerHTML: { __html: label + requiredHtml } }),
+        React.createElement("div", { style: { whiteSpace: "normal" } },
+            React.createElement("span", { dangerouslySetInnerHTML: { __html: label + requiredHtml } }),
             showHelp ? React.createElement(Help, { focusable: true, onFocus: onHelpFocus, onBlur: onHelpBlur, onClick: onHelpClick, id: id }) : null),
         children));
     return help ? React.createElement(React.Fragment, null,

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

@@ -33,6 +33,7 @@ export default class MapField extends React.Component<any, any, any> {
     getDrawOptions: (props: any) => any;
     getGeometry: (props: any) => any;
     getMobileGeometry: () => any;
+    setMoved: (moved: any) => void;
     onOptionsChanged: (options: any) => void;
     onChange: (events: any) => void;
     onMobileEditorChange: (point: any) => void;

package/lib/components/fields/MapField.js

@@ -128,9 +128,15 @@ class MapField extends React.Component {
                 };
             }
             else {
-                return undefined;
+                return {
+                    type: "Point",
+                    coordinates: [24.94782264266911, 60.17522413438655]
+                };
             }
         };
+        this.setMoved = (moved) => {
+            this.setState({ moved });
+        };
         this.onOptionsChanged = (options) => {
             this.setState({ mapOptions: Object.assign(Object.assign({}, this.state.mapOptions), options) });
         };
@@ -210,7 +216,10 @@ class MapField extends React.Component {
                 },
             });
         };
-        this.state = { located: false };
+        this.state = {
+            located: false,
+            moved: false
+        };
         this.props.formContext.services.settings.bind(this, props);
     }
     componentDidMount() {
@@ -238,6 +247,7 @@ class MapField extends React.Component {
         }
     }
     render() {
+        var _a;
         const TitleFieldTemplate = utils_3.getTemplate("TitleFieldTemplate", this.props.registry, utils_1.getUiOptions(this.props.uiSchema));
         const { uiSchema, formData } = this.props;
         const { height = 400, emptyHelp, mapOptions = {}, mobileEditor: _mobileEditor, data } = utils_1.getUiOptions(uiSchema);
@@ -283,7 +293,7 @@ class MapField extends React.Component {
                     React.createElement(MapArrayField_1.MapComponent, Object.assign({}, _mapOptions, { ref: this.setMapRef, draw: this.getDrawOptions(this.props), data: extraData, lang: lang, zoomToData: { paddingInMeters: 200 }, panel: emptyHelp && isEmpty ? { panelTextContent: emptyHelp } : undefined, formContext: this.props.formContext, onOptionsChanged: this.onOptionsChanged })),
                     this.map && this.map.container && react_dom_1.createPortal(this.renderBlocker(), this.map.container))),
             this.state.mapRendered && mobileEditor && mobileEditor.visible &&
-                React.createElement(MobileEditorMap, Object.assign({}, mobileEditorOptions, { options: mobileEditor.options, onChange: this.onMobileEditorChange, onClose: this.onHideMobileEditorMap, map: this.map, formContext: this.props.formContext, geometry: this.getMobileGeometry() }))));
+                React.createElement(MobileEditorMap, Object.assign({}, mobileEditorOptions, { options: mobileEditor.options, onChange: this.onMobileEditorChange, onClose: this.onHideMobileEditorMap, map: this.map, formContext: this.props.formContext, geometry: this.getMobileGeometry(), moved: this.state.moved, setMoved: this.setMoved, defaultLocation: !this.props.formData && !((_a = this.map) === null || _a === void 0 ? void 0 : _a.userLocation) }))));
     }
     renderBlocker() {
         const { blockBeforeLocation } = utils_1.getUiOptions(this.props.uiSchema);
@@ -340,8 +350,8 @@ class MobileEditorMap extends React.Component {
             this.onClose();
         };
         this.handleMapClick = (e) => {
-            if (!this.state.moved) {
-                this.setState({ moved: true });
+            if (!this.props.moved) {
+                this.props.setMoved(true);
             }
             this.setMarkerLatLng(e.latlng);
         };
@@ -369,8 +379,7 @@ class MobileEditorMap extends React.Component {
         };
         const { geometry } = this.props;
         this.state = {
-            geometry: [{ geoData: geometry }],
-            moved: false
+            geometry: [{ geoData: geometry }]
         };
     }
     componentDidMount() {
@@ -379,10 +388,16 @@ class MobileEditorMap extends React.Component {
         if (this.props.geometry) {
             const [lng, lat] = this.props.geometry.coordinates;
             this.setMarkerLatLng({ lng, lat });
-            this.map.map.setView({ lng, lat }, 12);
+            if (this.props.defaultLocation) {
+                this.map.map.setView({ lng, lat }, 4);
+            }
+            else {
+                this.map.map.setView({ lng, lat }, 12);
+                this.props.setMoved(true);
+            }
             this.marker.on("dragend", () => {
-                if (!this.state.moved) {
-                    this.setState({ moved: true });
+                if (!this.props.moved) {
+                    this.props.setMoved(true);
                 }
             });
         }
@@ -409,6 +424,6 @@ class MobileEditorMap extends React.Component {
         return (React.createElement(components_2.Fullscreen, { onKeyDown: this.onKeyDown, tabIndex: -1, ref: this.setContainerRef, formContext: this.props.formContext },
             React.createElement(MapArrayField_1.MapComponent, Object.assign({}, mapComponentProps)),
             React.createElement("div", { className: "floating-buttons-container" },
-                React.createElement(components_2.Button, { block: true, onClick: this.onChange, ref: this.setOkButtonRef, disabled: !this.state.moved }, translations.ChooseThisLocation))));
+                React.createElement(components_2.Button, { block: true, onClick: this.onChange, variant: "primary", ref: this.setOkButtonRef, disabled: !this.props.moved }, translations.ChooseThisLocation))));
     }
 }

package/lib/components/widgets/AutosuggestWidget.js

@@ -1026,7 +1026,8 @@ class ReactAutosuggest extends React.Component {
             this.onBlur(e);
         };
         this.onInputKeyDown = (e) => {
-            let state, suggestion;
+            var _a, _b;
+            let state;
             switch (e.key) {
                 case "ArrowDown":
                     e.preventDefault();
@@ -1056,10 +1057,7 @@ class ReactAutosuggest extends React.Component {
                     break;
                 case "Enter":
                     e.preventDefault();
-                    suggestion = (this.props.suggestions || [])[this.state.focusedIdx];
-                    if (suggestion) {
-                        this.onSuggestionSelected(suggestion);
-                    }
+                    this.inputElem.blur();
                     break;
                 case "Control":
                 case "Meta":
@@ -1070,7 +1068,7 @@ class ReactAutosuggest extends React.Component {
                 default:
                     this.setState({ touched: true });
             }
-            this.props.inputProps && this.props.inputProps.onKeyDown && this.props.inputProps.onKeyDown(e);
+            (_b = (_a = this.props.inputProps) === null || _a === void 0 ? void 0 : _a.onKeyDown) === null || _b === void 0 ? void 0 : _b.call(_a, e);
         };
         this.onInputChange = (e) => {
             this._onInputChange(e.target.value, "keystroke");
@@ -1121,13 +1119,14 @@ class ReactAutosuggest extends React.Component {
             this.renderSuggestions()));
     }
     onBlur(e) {
+        var _a, _b;
         if (e.relatedTarget && e.relatedTarget === react_dom_1.findDOMNode(this.listRef.current)) {
             return;
         }
         const suggestion = (this.props.suggestions || [])[this.state.focusedIdx];
         suggestion && this.onSuggestionSelected(this.props.suggestions[this.state.focusedIdx]);
         this.setState({ focused: false, focusedIdx: undefined, touched: false });
-        this.props.inputProps && this.props.inputProps.onBlur && this.props.inputProps.onBlur(e);
+        (_b = (_a = this.props.inputProps) === null || _a === void 0 ? void 0 : _a.onBlur) === null || _b === void 0 ? void 0 : _b.call(_a, e);
     }
     renderInput() {
         const { inputProps, renderInputComponent = this.renderDefaultInputComponent } = this.props;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luomus/laji-form",
-  "version": "15.1.52",
+  "version": "15.1.54",
   "description": "React module capable of building dynamic forms from Laji form json schemas",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",