@luomus/laji-form 15.1.0 → 15.1.1

package/lib/components/fields/NamedPlaceChooserField.js

@@ -1,380 +0,0 @@
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const react_dom_1 = require("react-dom");
-const PropTypes = require("prop-types");
-const utils_1 = require("../../utils");
-const components_1 = require("../components");
-const Spinner = require("react-spinner");
-const Context_1 = require("../../Context");
-const ReactContext_1 = require("../../ReactContext");
-const BaseComponent_1 = require("../BaseComponent");
-const MapArrayField_1 = require("./MapArrayField");
-const globals_1 = require("@luomus/laji-map/lib/globals");
-const SelectWidget_1 = require("../widgets/SelectWidget");
-const PLACES_FETCH_FAIL = "PLACES_FETCH_FAIL";
-const PLACE_USE_FAIL = "PLACE_USE_FAIL";
-const PLACE_DELETE_FAIL = "PLACE_DELETE_FAIL";
-/**
- * Compatible only with gatherings array and gathering object.
- */
-let NamedPlaceChooserField = class NamedPlaceChooserField extends React.Component {
-    constructor(props) {
-        super(props);
-        this.getUiSchema = (props) => {
-            if (this.buttonDefinition) {
-                this.buttonDefinition = Object.assign(Object.assign({}, this.buttonDefinition), { label: props.formContext.translations.ChooseFromNamedPlace });
-                const innerUiSchema = utils_1.getInnerUiSchema(props.uiSchema);
-                const options = utils_1.getUiOptions(innerUiSchema);
-                return Object.assign(Object.assign({}, innerUiSchema), { "ui:options": Object.assign(Object.assign({}, options), { buttons: [
-                            this.buttonDefinition,
-                            ...(options.buttons || [])
-                        ] }) });
-            }
-            else {
-                return utils_1.getInnerUiSchema(props.uiSchema);
-            }
-        };
-        this.isGatheringsArray = () => this.props.schema.type === "array";
-        this.onPlaceSelected = (place) => {
-            const getGathering = (schema) => {
-                const whitelist = ["geometry", "country", "administrativeProvince", "biologicalProvince", "municipality", "locality", "localityDescription", "habitat", "habitatDescription"];
-                let gathering = utils_1.getDefaultFormState(schema);
-                const placeGathering = place.prepopulatedDocument.gatherings[0];
-                whitelist.forEach(prop => {
-                    if (prop in placeGathering && prop in schema.properties) {
-                        gathering[prop] = placeGathering[prop];
-                    }
-                });
-                gathering.namedPlaceID = place.id;
-                const tmpIdTree = this.props.formContext.services.ids.getRelativeTmpIdTree(this.props.idSchema.$id);
-                const [withLajiFormIds] = utils_1.addLajiFormIds(gathering, tmpIdTree, false);
-                return withLajiFormIds;
-            };
-            try {
-                let targetId, gathering, newFormData, zoomToData;
-                if (this.isGatheringsArray()) {
-                    gathering = getGathering(this.props.schema.items);
-                    newFormData = [
-                        ...(this.props.formData || []),
-                        gathering
-                    ];
-                    this.setState({ show: false });
-                    targetId = this.props.idSchema.$id;
-                    this.props.formContext.services.customEvents.send(targetId, "activeIdx", (this.props.formData || []).length);
-                }
-                else { // gathering object
-                    gathering = getGathering(this.props.schema);
-                    gathering.namedPlaceID = place.id;
-                    newFormData = Object.assign(Object.assign({}, this.props.formData), gathering);
-                    this.setState({ show: false });
-                    const splits = this.props.idSchema.$id.split("_");
-                    splits.pop();
-                    targetId = splits.join("_");
-                    zoomToData = true;
-                }
-                this.props.onChange(newFormData);
-                if (zoomToData)
-                    this.props.formContext.services.customEvents.send(targetId, "zoomToData", undefined);
-            }
-            catch (e) {
-                this.setState({ failed: PLACE_USE_FAIL });
-            }
-        };
-        this.onPlaceDeleted = (place, success) => {
-            this.apiClient.fetchRaw(`/named-places/${place.id}`, undefined, { method: "DELETE" }).then(response => {
-                if (response.status === 204) {
-                    // It takes a while for API to remove the place, so we remove it locally and then invalidate again after some time.
-                    this.removeIds[place.id] = true;
-                    this.apiClient.invalidateCachePath("/named-places");
-                    setTimeout(() => this.apiClient.invalidateCachePath("/named-places"), 2000);
-                    success();
-                }
-            }).catch(() => {
-                this.setState({ failed: PLACE_DELETE_FAIL });
-                this.props.formContext.notifier.error(this.props.formContext.translations.PlaceRemovalFailed);
-            });
-        };
-        this.onButtonClick = () => () => {
-            this.setState({ show: true });
-        };
-        this.updatePlaces = () => {
-            this.buttonDefinition = undefined;
-            this.apiClient.fetchCached("/named-places", { includePublic: false, pageSize: 10000 }).then(response => {
-                if (!this.mounted)
-                    return;
-                const state = { places: response.results.filter(p => !this.removeIds[p.id]).sort((a, b) => {
-                        if (a.name < b.name)
-                            return -1;
-                        if (a.name > b.name)
-                            return 1;
-                        return 0;
-                    }) };
-                if (response.results && response.results.length) {
-                    this.buttonDefinition = {
-                        fn: this.onButtonClick,
-                        fnName: "addNamedPlace",
-                        glyph: "map-marker",
-                        label: this.props.formContext.translations.ChooseFromNamedPlace,
-                        id: this.props.idSchema.$id,
-                        changesFormData: true,
-                        variant: "primary"
-                    };
-                    if (this.isGatheringsArray()) {
-                        this.buttonDefinition.rules = { canAdd: true };
-                    }
-                    else {
-                        this.buttonDefinition.position = "top";
-                    }
-                    const uiSchema = this.getUiSchema(this.props);
-                    state.uiSchema = uiSchema;
-                }
-                this.setState(state);
-            }).catch(() => {
-                this.setState({ failed: PLACES_FETCH_FAIL });
-            });
-        };
-        this.onHide = () => this.setState({ show: false });
-        this.apiClient = props.formContext.apiClient;
-        this.removeIds = {};
-    }
-    getStateFromProps(props) {
-        return { uiSchema: this.getUiSchema(props) };
-    }
-    componentDidMount() {
-        this.mounted = true;
-        this.updatePlaces();
-        this.apiClient.onCachePathInvalidation("/named-places", this.updatePlaces);
-    }
-    componentWillUnmount() {
-        this.mounted = false;
-        this.apiClient.removeOnCachePathInvalidation("/named-places", this.updatePlaces);
-    }
-    render() {
-        const { registry: { fields: { SchemaField } }, formContext } = this.props;
-        const { translations } = formContext;
-        const { failed } = this.state;
-        const { Modal, Alert } = this.context.theme;
-        return (React.createElement(React.Fragment, null,
-            React.createElement(SchemaField, Object.assign({}, this.props, { uiSchema: this.state.uiSchema })),
-            this.state.show ? (React.createElement(Modal, { dialogClassName: "laji-form map-dialog named-place-chooser-modal", show: true, onHide: this.onHide },
-                React.createElement(Modal.Header, { closeButton: true }, translations.ChooseNamedPlace),
-                React.createElement(Modal.Body, null,
-                    failed === PLACE_USE_FAIL && React.createElement(Alert, { variant: "danger" }, translations.NamedPlacesUseFail),
-                    failed === PLACES_FETCH_FAIL && React.createElement(Alert, { variant: "danger" }, translations.NamedPlacesFetchFail),
-                    React.createElement(NamedPlaceChooser, { places: this.state.places, failed: failed === PLACES_FETCH_FAIL ? true : false, formContext: formContext, onSelected: this.onPlaceSelected, onDeleted: this.onPlaceDeleted })))) : null));
-    }
-};
-NamedPlaceChooserField.contextType = ReactContext_1.default;
-NamedPlaceChooserField.propTypes = {
-    schema: PropTypes.shape({
-        type: PropTypes.oneOf(["object", "array"])
-    }).isRequired,
-    formData: PropTypes.oneOfType([PropTypes.object, PropTypes.array])
-};
-NamedPlaceChooserField = __decorate([
-    BaseComponent_1.default
-], NamedPlaceChooserField);
-exports.default = NamedPlaceChooserField;
-class NamedPlaceChooser extends React.Component {
-    constructor(props) {
-        super(props);
-        this.onPlaceSelected = (place) => {
-            this.props.onSelected(place);
-        };
-        this.onPlaceDeleted = (place) => {
-            const onDelete = () => {
-                if (this.popupContainerElem && this.popupElem) {
-                    this.popupContainerElem.appendChild(react_dom_1.findDOMNode(this.popupElem));
-                }
-                this.mapElem.map.map.closePopup();
-                this.setState({ deleting: false, popupIdx: undefined });
-            };
-            this.setState({ deleting: true });
-            this.props.onDeleted(place, onDelete);
-        };
-        this.onSelectChange = (idx) => {
-            if (idx === undefined) {
-                return;
-            }
-            const { map } = this.mapElem;
-            const layers = this.idxToLayer[idx];
-            const [layer] = layers;
-            const bounds = map.getBoundsForLayers(layers);
-            const center = bounds.getCenter();
-            map.fitBounds(bounds, { animate: false });
-            this.props.formContext.setTimeout(() => layer.fire("click", { latlng: center }), 10);
-        };
-        this.onMapChange = (events) => {
-            events.some(({ type, idx }) => {
-                if (type === "active") {
-                    this.setState({ popupIdx: idx });
-                    const { map } = this.mapElem;
-                    if (this.geometryCollectionData) {
-                        map.setData();
-                    }
-                    this.geometryCollectionData = {
-                        geoData: this.props.places[idx].geometry
-                    };
-                    map.setData(this.geometryCollectionData);
-                    return true;
-                }
-            });
-        };
-        this.getFeatureStyle = (data) => {
-            const { feature = {} } = data || {};
-            function getColor(idx) {
-                const r = globals_1.NORMAL_COLOR.substring(1, 3);
-                const g = globals_1.NORMAL_COLOR.substring(3, 5);
-                const b = globals_1.NORMAL_COLOR.substring(5, 7);
-                return [r, g, b].reduce((rgb, hex) => {
-                    const decimal = parseInt(hex, 16);
-                    const amount = 40;
-                    const _decimal = (idx % 2) ? decimal : Math.min(decimal + amount, 255);
-                    return rgb + _decimal.toString(16);
-                }, "#");
-            }
-            const { idx } = feature.properties || {};
-            const color = idx === this.state.popupIdx ? globals_1.ACTIVE_COLOR : getColor(idx);
-            return { color, fillColor: color };
-        };
-        this.setPopupContainerRef = (elem) => {
-            this.popupContainerElem = elem;
-        };
-        this.state = {};
-    }
-    componentDidUpdate(prevProps, prevState) {
-        const { map } = this.mapElem;
-        this.idxToLayer = map.data.reduce((idxToLayer, item) => {
-            const layerGroup = item.group;
-            layerGroup.eachLayer(layer => {
-                if (!idxToLayer[layer.feature.properties.idx]) {
-                    idxToLayer[layer.feature.properties.idx] = [];
-                }
-                idxToLayer[layer.feature.properties.idx].push(layer);
-            });
-            return idxToLayer;
-        }, {});
-        if (this.state.popupIdx !== prevState.popupIdx) {
-            const prevLayers = this.idxToLayer[prevState.popupIdx] || [];
-            const layers = this.idxToLayer[this.state.popupIdx] || [];
-            [prevLayers, layers].forEach(layers => {
-                layers.forEach(layer => {
-                    if (layer) {
-                        map.setLayerStyle(layer, this.getFeatureStyle({ feature: layer.feature }));
-                    }
-                });
-            });
-        }
-    }
-    render() {
-        const { places, failed, formContext: { translations } } = this.props;
-        const that = this;
-        function getPopupRef(elem) {
-            that.popupElem = elem;
-        }
-        function getMapRef(elem) {
-            that.mapElem = elem;
-        }
-        function getPopup({ feature }, callback) {
-            const { idx } = feature.properties;
-            that.setState({ popupIdx: idx });
-            callback(react_dom_1.findDOMNode(that.popupElem));
-        }
-        const { Alert } = this.context.theme;
-        if (failed) {
-            return React.createElement(Alert, { variant: "danger" }, `${translations.NamedPlacesFetchFail} ${translations.TryAgainLater}`);
-        }
-        else {
-            const enums = (places || []).map((place, idx) => {
-                return { value: idx, label: place.name };
-            });
-            let pointer = 1;
-            const data = (places || []).reduce((data, place, i) => {
-                const { geometry } = place;
-                let isCollection = false;
-                if (geometry.type === "GeometryCollection") {
-                    isCollection = true;
-                }
-                if (isCollection) {
-                    data[pointer] = {
-                        geoData: { type: "FeatureCollection", features: geometry.geometries.map(geom => { return { type: "Feature", geometry: geom, properties: { idx: i } }; }) },
-                        getFeatureStyle: this.getFeatureStyle,
-                        getPopup,
-                        highlightOnHover: true
-                    };
-                    pointer++;
-                }
-                else {
-                    if (!data[0])
-                        data[0] = {
-                            geoData: { type: "FeatureCollection", features: [] },
-                            getFeatureStyle: this.getFeatureStyle,
-                            getPopup,
-                            cluster: true,
-                            highlightOnHover: true
-                        };
-                    data[0].geoData.features.push({ type: "Feature", geometry, properties: { idx: i } });
-                }
-                return data;
-            }, []);
-            return (React.createElement("div", { style: { height: "inherit" } },
-                React.createElement(SelectWidget_1.default, { disabled: !places, options: { enumOptions: enums, placeholder: `${translations.SelectPlaceFromList}...` }, onChange: this.onSelectChange, selectOnChange: false, schema: {}, id: "named-place-chooser-select", formContext: this.props.formContext }),
-                React.createElement(MapArrayField_1.Map, { ref: getMapRef, data: data, markerPopupOffset: 45, featurePopupOffset: 5, controls: { draw: false }, lang: this.props.formContext.lang, bodyAsDialogRoot: false, formContext: this.props.formContext }),
-                (!places) ? React.createElement(Spinner, null) : null,
-                React.createElement("div", { style: { display: "none" }, ref: this.setPopupContainerRef },
-                    React.createElement(Popup, { ref: getPopupRef, place: (places || [])[this.state.popupIdx], onPlaceSelected: this.onPlaceSelected, onPlaceDeleted: this.onPlaceDeleted, deleting: this.state.deleting, formContext: this.props.formContext, translations: translations }))));
-        }
-    }
-}
-NamedPlaceChooser.contextType = ReactContext_1.default;
-class Popup extends React.Component {
-    constructor() {
-        super(...arguments);
-        this._onPlaceSelected = () => {
-            this.props.onPlaceSelected(this.props.place);
-        };
-        this._onPlaceDeleted = () => {
-            this.props.onPlaceDeleted(this.props.place);
-        };
-        this.getButtonRef = (elem) => {
-            this.buttonElem = elem;
-        };
-    }
-    componentDidUpdate() {
-        this.props.formContext.setTimeout(() => {
-            if (this.buttonElem)
-                react_dom_1.findDOMNode(this.buttonElem).focus();
-        });
-    }
-    render() {
-        const { place, translations, deleting } = this.props;
-        return place ? (React.createElement("div", { className: "named-place-popup" },
-            React.createElement("table", null,
-                React.createElement("tbody", null, [
-                    ["Name", "name"],
-                    ["Notes", "notes"]
-                ].reduce((fieldset, [translationKey, fieldName], i) => {
-                    if (!utils_1.isEmptyString(place[fieldName]))
-                        fieldset.push(React.createElement("tr", { key: i },
-                            React.createElement("td", null,
-                                React.createElement("b", null,
-                                    translations[translationKey],
-                                    ": ")),
-                            React.createElement("td", null, place[fieldName])));
-                    return fieldset;
-                }, []))),
-            React.createElement(components_1.Button, { block: true, ref: this.getButtonRef, onClick: this._onPlaceSelected }, translations.UseThisPlace),
-            React.createElement(components_1.DeleteButton, { block: true, onClick: this._onPlaceDeleted, disabled: deleting, glyphButton: false, confirm: true, confirmStyle: "browser", translations: translations },
-                translations.Remove,
-                " ",
-                deleting && React.createElement(Spinner, null)))) : React.createElement(Spinner, null);
-    }
-}
-Context_1.default("SCHEMA_FIELD_WRAPPERS").NamedPlaceChooserField = true;

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

@@ -1,29 +0,0 @@
-/**
- * Compatible only with gathering field.
- */
-export default class NamedPlaceSaverField extends React.Component<any, any, any> {
-    static contextType: React.Context<import("../../ReactContext").ContextProps>;
-    static propTypes: {
-        schema: PropTypes.Validator<PropTypes.InferProps<{
-            type: PropTypes.Requireable<string>;
-        }>>;
-        formData: PropTypes.Requireable<object>;
-    };
-    constructor(props: any);
-    constructor(props: any, context: any);
-    getStateFromProps(props: any): {
-        uiSchema: any;
-    };
-    getButton(props: any): {
-        label: any;
-        fn: () => () => void;
-        glyph: string;
-        position: string;
-        disabled: boolean;
-    };
-    onButtonClick: () => () => void;
-    onSave: (place: any) => void;
-    onHide: () => void;
-}
-import * as React from "react";
-import * as PropTypes from "prop-types";

package/lib/components/fields/NamedPlaceSaverField.js

@@ -1,237 +0,0 @@
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    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 __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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const react_dom_1 = require("react-dom");
-const PropTypes = require("prop-types");
-const utils_1 = require("../../utils");
-const components_1 = require("../components");
-const Context_1 = require("../../Context");
-const ReactContext_1 = require("../../ReactContext");
-const BaseComponent_1 = require("../BaseComponent");
-const Spinner = require("react-spinner");
-const MapArrayField_1 = require("./MapArrayField");
-const SAVE = "SAVE", FETCH = "FETCH";
-/**
- * Compatible only with gathering field.
- */
-let NamedPlaceSaverField = class NamedPlaceSaverField extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.onButtonClick = () => () => {
-            this.setState({ show: !this.state.show });
-        };
-        this.onSave = (place) => {
-            this.setState({ show: false }, () => {
-                this.props.onChange(Object.assign(Object.assign({}, (this.props.formData || {})), { namedPlaceID: place.id }));
-            });
-        };
-        this.onHide = () => this.setState({ show: false });
-    }
-    getStateFromProps(props) {
-        const innerUiSchema = utils_1.getInnerUiSchema(props.uiSchema);
-        const uiSchema = Object.assign(Object.assign({}, innerUiSchema), { "ui:options": Object.assign(Object.assign({}, utils_1.getUiOptions(innerUiSchema)), { buttons: [
-                    ...(utils_1.getUiOptions(innerUiSchema).buttons || []),
-                    this.getButton(props)
-                ] }) });
-        return { uiSchema };
-    }
-    getButton(props) {
-        return {
-            label: props.formContext.translations.SaveNamedPlace,
-            fn: this.onButtonClick,
-            glyph: "floppy-disk",
-            position: "top",
-            disabled: !MapArrayField_1.parseGeometries((props.formData || {}).geometry).length
-        };
-    }
-    componentDidUpdate(prevProps, prevState) {
-        if (prevState.show !== this.state.show)
-            this.setState(this.getStateFromProps(this.props));
-    }
-    render() {
-        const { registry: { fields: { SchemaField } }, formContext } = this.props;
-        const { uiSchema } = this.state;
-        const { Modal } = this.context.theme;
-        return (React.createElement("div", null,
-            React.createElement(SchemaField, Object.assign({}, this.props, { uiSchema: uiSchema })),
-            this.state && this.state.show
-                ? (React.createElement(Modal, { dialogClassName: "laji-form", show: true, onHide: this.onHide },
-                    React.createElement(Modal.Header, null,
-                        React.createElement(Modal.Title, null, formContext.translations.NamedPlaces)),
-                    React.createElement(Modal.Body, null,
-                        React.createElement(PlaceSaverDialog, { formContext: formContext, onSave: this.onSave, gathering: this.props.formData || {} })))) : null));
-    }
-};
-NamedPlaceSaverField.contextType = ReactContext_1.default;
-NamedPlaceSaverField.propTypes = {
-    schema: PropTypes.shape({
-        type: PropTypes.oneOf(["object"])
-    }).isRequired,
-    formData: PropTypes.object
-};
-NamedPlaceSaverField = __decorate([
-    BaseComponent_1.default
-], NamedPlaceSaverField);
-exports.default = NamedPlaceSaverField;
-class PlaceSaverDialog extends React.Component {
-    constructor(props) {
-        super(props);
-        this.onInputChange = ({ target: { value } }) => {
-            this.setState({ value });
-        };
-        this.getGathering = () => {
-            return ["geometry", "country", "administrativeProvince", "biologicalProvince", "municipality", "locality", "localityDescription", "habitat", "habitatDescription", "coordinateRadius"].reduce((gathering, key) => {
-                gathering[key] = this.props.gathering[key];
-                return gathering;
-            }, {});
-        };
-        this.onSaveNew = (e) => {
-            e.preventDefault();
-            const _a = this.getGathering(), { namedPlaceID } = _a, gathering = __rest(_a, ["namedPlaceID"]); //eslint-disable-line @typescript-eslint/no-unused-vars
-            this.onSave({
-                name: this.state.value,
-                prepopulatedDocument: { gatherings: [gathering] }
-            });
-        };
-        this.onOverwriteCurrent = () => {
-            const { namedPlaceID } = this.props.gathering;
-            const gathering = this.getGathering(); //eslint-disable-line no-unused-vars
-            this.onSave(Object.assign(Object.assign({}, this.state.placeIdsToPlaces[namedPlaceID]), { name: this.state.value, prepopulatedDocument: { gatherings: [gathering] } }));
-        };
-        this.onOverwriteSelected = (place) => () => {
-            const gathering = this.getGathering(); //eslint-disable-line no-unused-vars
-            this.onSave(Object.assign(Object.assign({}, place), { name: this.state.value, prepopulatedDocument: { gatherings: [gathering] } }));
-        };
-        this.onOverwriteExisting = () => {
-            this.onOverwriteSelected(this.state.placeNamesToPlaces[this.state.value])();
-        };
-        // Hack that fixed autofocus cursor position
-        this.onFocus = (e) => {
-            var val = e.target.value;
-            e.target.value = "";
-            e.target.value = val;
-        };
-        this.onSubmit = (e) => {
-            e.preventDefault();
-        };
-        this.setInputRef = (elem) => {
-            this.inputRef = elem;
-        };
-        const { namedPlaceID, locality = "" } = props.gathering;
-        this.state = { value: locality };
-        if (namedPlaceID) {
-            this.state = { value: "", loading: true };
-        }
-        this.apiClient = props.formContext.apiClient;
-    }
-    componentWillUnmount() {
-        this.mounted = false;
-    }
-    componentDidMount() {
-        this.mounted = true;
-        this.apiClient.fetchCached("/named-places", { includePublic: false, pageSize: 10000 }).then(response => {
-            if (!this.mounted)
-                return;
-            const state = {
-                places: response.results,
-                placeIdsToPlaces: response.results.reduce((idsToPlaces, place) => {
-                    idsToPlaces[place.id] = place;
-                    return idsToPlaces;
-                }, {}),
-                placeNamesToPlaces: response.results.reduce((namesToPlaces, place) => {
-                    if (!namesToPlaces[place.name])
-                        namesToPlaces[place.name] = [];
-                    namesToPlaces[place.name].push(place);
-                    return namesToPlaces;
-                }, {})
-            };
-            const { namedPlaceID } = this.props.gathering;
-            if (namedPlaceID) {
-                state.value = state.placeIdsToPlaces[namedPlaceID].name;
-                state.loading = false;
-            }
-            this.setState(state, () => {
-                if (namedPlaceID) {
-                    react_dom_1.findDOMNode(this.inputRef).focus();
-                }
-            });
-        }).catch(() => {
-            this.setState({ failed: FETCH });
-        });
-    }
-    onSave(place) {
-        place = Object.assign(Object.assign({}, place), { geometry: place.prepopulatedDocument.gatherings[0].geometry });
-        this.props.formContext.services.blocker.push();
-        this.apiClient.fetchRaw(`/named-places${place.id ? `/${place.id}` : ""}`, undefined, {
-            method: place.id ? "PUT" : "POST",
-            headers: {
-                "accept": "application/json",
-                "content-type": "application/json"
-            },
-            body: JSON.stringify(place)
-        }).then(response => {
-            this.props.formContext.services.blocker.pop();
-            this.apiClient.invalidateCachePath("/named-places");
-            return response.json();
-        }).then(this.props.onSave)
-            .catch(() => {
-            this.props.formContext.services.blocker.pop();
-            this.setState({ failed: SAVE });
-        });
-    }
-    render() {
-        const { value, placeNamesToPlaces = {}, loading } = this.state;
-        const { translations } = this.props.formContext;
-        const existingPlaces = (placeNamesToPlaces[value] || []).filter(place => {
-            return (place.owners || []).includes(this.props.formContext.uiSchemaContext.creator);
-        });
-        const getButton = (onClick, text) => {
-            return React.createElement(components_1.Button, { small: true, onClick: onClick, disabled: loading || utils_1.isEmptyString(value) }, text);
-        };
-        const { Panel, FormGroup, FormControl, ListGroup, ListGroupItem, Alert, Form, ControlLabel } = this.context.theme;
-        return this.state.failed ? (React.createElement(Alert, { variant: "danger" }, `${translations[`NamedPlaces${this.state.failed === FETCH ? "Fetch" : "Save"}Fail`]} ${translations.TryAgainLater}`)) : (React.createElement("div", { className: "place-saver-dialog" },
-            React.createElement(Form, { inline: true, onSubmit: this.onSubmit },
-                React.createElement(FormGroup, null,
-                    React.createElement(ControlLabel, null,
-                        translations.Name,
-                        ": "),
-                    " ",
-                    React.createElement(FormControl, { type: "text", value: value, onChange: this.onInputChange, autoFocus: true, onFocus: this.onFocus, disabled: loading, ref: this.setInputRef }),
-                    " ",
-                    !existingPlaces.length ?
-                        getButton(this.onSaveNew, `${translations.Save} ${translations.new}`) : null,
-                    " ",
-                    this.props.gathering.namedPlaceID ?
-                        getButton(this.onOverwriteCurrent, translations.SaveCurrentOverwrite) : null,
-                    existingPlaces.length === 1 && !this.props.gathering.namedPlaceID ?
-                        getButton(this.onOverwriteExisting, translations.SaveExistingOverwrite) : null),
-                loading ? React.createElement("div", { className: "pull-right" },
-                    React.createElement(Spinner, null)) : null),
-            !this.props.gathering.namedPlaceID && existingPlaces.length ?
-                React.createElement(Alert, { variant: "warning" }, `${translations.Warning}: ${translations.UsedNamedPlaceName}.${existingPlaces.length > 1 ? ` ${translations.UsedNamedPlaceNameMultiple}.` : ""}`)
-                : null,
-            existingPlaces.length > 1 ? (React.createElement(FormGroup, null,
-                React.createElement(Panel, null,
-                    React.createElement(Panel.Heading, null, translations.ClickPlaceToOverwrite),
-                    React.createElement(ListGroup, { fill: "fill" }, existingPlaces.map(place => React.createElement(ListGroupItem, { header: place.name, key: place.id, onClick: loading ? undefined : this.onOverwriteSelected(place), disabled: loading }, place.notes)))))) : null));
-    }
-}
-PlaceSaverDialog.contextType = ReactContext_1.default;
-Context_1.default("SCHEMA_FIELD_WRAPPERS").NamedPlaceSaverField = true;