@esri/solutions-components 0.8.2 → 0.8.3

package/dist/esm/queryUtils-2529c537.js

@@ -0,0 +1,244 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+/** @license
+ * Copyright 2022 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Query the layer for all features
+ *
+ * @param start zero-based index indicating where to begin retrieving features
+ * @param layer the layer to retrieve features from
+ * @param graphics stores the features
+ *
+ * @returns Promise with the featureSet from the layer that match the provided ids
+ */
+async function queryAllFeatures(start, layer, graphics) {
+    const num = layer.capabilities.query.maxRecordCount;
+    const query = layer.createQuery();
+    query.start = start;
+    query.num = num;
+    // TODO think through this once I'm back on crowdsource...seems like we may want an arg to control this
+    query.where = layer.definitionExpression || "1=1";
+    const result = await layer.queryFeatures(query);
+    graphics = graphics.concat(result.features);
+    return result.exceededTransferLimit ?
+        queryAllFeatures(start += num, layer, graphics) :
+        Promise.resolve(graphics);
+}
+/**
+ * Query the layer for all IDs
+ *
+ * @param layer the layer to retrieve features from
+ *
+ * @returns Promise with the featureSet from the layer that match the provided ids
+ */
+async function queryAllIds(layer) {
+    const query = layer.createQuery();
+    query.where = layer.definitionExpression || "1=1";
+    return await layer.queryObjectIds(query);
+}
+/**
+ * Query the feature for any image attachments
+ *
+ * @param layer the layer to retrieve attachments from
+ *
+ * @returns Promise with any attachments from the feature
+ */
+async function queryAttachments(layer, objectIds) {
+    return await layer.queryAttachments({
+        attachmentTypes: [
+            "image/jpeg",
+            "image/png",
+            "image/gif",
+            "image/jpg",
+            "image/tif",
+            "image/tiff",
+            "image/bmp"
+        ],
+        objectIds
+    });
+}
+/**
+ * Query the layer for OIDs based on any user drawn geometries or buffers
+ *
+ * @param geometries Array of geometries used for the selection of ids from the layer
+ * @param layer the layer to retrieve ids from
+ *
+ * @returns Promise with the OIDs of features from the layer that interset the provided geometries
+ */
+async function queryObjectIds(geometries, layer) {
+    let ids = [];
+    const queryDefs = geometries ? geometries.map(g => _intersectQuery(g, layer)) : [Promise.resolve()];
+    const results = await Promise.all(queryDefs);
+    results.forEach(resultIds => {
+        ids = [
+            ...ids,
+            ...resultIds || []
+        ];
+    });
+    return ids;
+}
+/**
+ * Query the layer for features that have the provided OIDs
+ * If no ids are provided all features will be returned
+ *
+ * @param ids array of ObjectIDs to be used to query for features in a layer
+ * @param layer the layer to retrieve features from
+ * @param graphics the result graphics array
+ *
+ * @returns Promise with the featureSet from the layer that match the provided ids
+ */
+async function queryFeaturesByID(ids, layer, graphics, returnGeometry, outSpatialReference, fields) {
+    var _a;
+    const num = (_a = layer.capabilities) === null || _a === void 0 ? void 0 : _a.query.maxRecordCount;
+    const start = 0;
+    if (ids.length === 0) {
+        ids = await layer.queryObjectIds();
+    }
+    const q = layer.createQuery();
+    q.returnGeometry = returnGeometry;
+    q.objectIds = ids.slice(start, num);
+    if (outSpatialReference) {
+        q.outSpatialReference = outSpatialReference;
+    }
+    if (fields) {
+        q.outFields = fields;
+    }
+    const result = await layer.queryFeatures(q);
+    graphics = graphics.concat(result.features);
+    const remainingIds = ids.slice(num, ids.length);
+    return remainingIds.length > 0 ?
+        queryFeaturesByID(remainingIds, layer, graphics, returnGeometry, outSpatialReference, fields) :
+        Promise.resolve(graphics);
+}
+/**
+ * Query the layer for features that have the provided globalId
+ *
+ * @param globalId globalId to be used to query for a feature in a layer
+ * @param layer the layer to retrieve features from
+ *
+ * @returns Promise with the featureSet from the layer that match the provided globalId
+ */
+async function queryFeaturesByGlobalID(globalIds, layer) {
+    const globalIdField = layer.globalIdField;
+    if (!globalIdField) {
+        return [];
+    }
+    const q = layer.createQuery();
+    q.returnGeometry = false;
+    q.outFields = [layer.objectIdField];
+    q.where = globalIds.map(g => `${globalIdField} = '${g}'`).join(" or ");
+    const result = await layer.queryFeatures(q);
+    return result.features;
+}
+/**
+ * Query the layer for features that intersect the provided geometry
+ *
+ * @param start zero-based index indicating where to begin retrieving features
+ * @param layer the layer to retrieve features from
+ * @param geometry the geometry to apply to the spatial filter
+ * @param featuresCollection
+ *
+ * @returns Promise with the featureSet from the layer that match the provided ids
+ */
+async function queryFeaturesByGeometry(start, layer, geometry, featuresCollection) {
+    const num = layer.capabilities.query.maxRecordCount;
+    const query = layer.createQuery();
+    query.start = start;
+    query.num = num;
+    query.geometry = geometry;
+    const result = await layer.queryFeatures(query);
+    featuresCollection[layer.id] = featuresCollection[layer.id].concat(result.features);
+    return result.exceededTransferLimit ?
+        queryFeaturesByGeometry(start += num, layer, geometry, featuresCollection) :
+        Promise.resolve(featuresCollection);
+}
+/**
+ * Query the layer for feature ids that match the provided where clause.
+ * If no where clause is provided all features will be returned.
+ *
+ * @param layer the layer to retrieve features from
+ * @param where the where clause for the query
+ * @param orderBy any sort order to apply to the query
+ *
+ * @returns Promise with the ids from the layer that match the where and are sorted as defined by orderBy
+ */
+async function queryFeatureIds(layer, where, orderBy) {
+    const query = layer.createQuery();
+    query.where = where ? where : "1=1";
+    query.orderByFields = orderBy;
+    return await layer.queryObjectIds(query);
+}
+/**
+ * Query the layer for the extent of features with the provided OIDs
+ *
+ * @param ids array of ObjectIDs to be used to query for features in a layer
+ * @param layer the layer to query
+ *
+ * @returns Promise with the Extent of all features that match the provided ids
+ */
+async function queryExtent(ids, layer) {
+    const query = layer.createQuery();
+    query.objectIds = ids;
+    return layer.queryExtent(query);
+}
+/**
+ * Union geometries based on geometry type
+ *
+ * @param geometries Array of geometries to union
+ * @param geometryEngine the geometry engine instance to perform the unions
+ *
+ * @returns Array of single unioned geometry for each geometry type
+ */
+function getQueryGeoms(geometries, geometryEngine) {
+    // sort and union by geom type so we have a single geom for each type to query with
+    return [
+        ..._unionGeoms(geometries, "polygon", geometryEngine),
+        ..._unionGeoms(geometries, "polyline", geometryEngine),
+        ..._unionGeoms(geometries, "point", geometryEngine)
+    ];
+}
+/**
+ * Union geometries based on geometry type
+ *
+ * @param geometries array of geometries to union
+ * @param type the current geometry type to union
+ * @param geometryEngine the geometry engine instance to perform the unions
+ *
+ * @returns Array of single unioned geometry for the provided geometry type
+ */
+function _unionGeoms(geometries, type, geometryEngine) {
+    const geoms = (geometries === null || geometries === void 0 ? void 0 : geometries.filter(g => g.type === type)) || [];
+    return geoms.length <= 1 ? geoms : [geometryEngine.union(geoms)];
+}
+/**
+ * Query the layer for ObjectIds of features that intersect the provided geometry
+ *
+ * @param geometry Geometry used for the selection of ids from the select layer view
+ * @param layer the layer to query
+ *
+ * @returns Promise that will contain the selected ids
+ */
+async function _intersectQuery(geometry, layer) {
+    const q = layer.createQuery();
+    q.spatialRelationship = "intersects";
+    q.geometry = geometry;
+    return layer.queryObjectIds(q);
+}
+
+export { queryFeaturesByID as a, queryAllIds as b, queryFeatureIds as c, queryFeaturesByGlobalID as d, queryObjectIds as e, queryFeaturesByGeometry as f, getQueryGeoms as g, queryExtent as q };

package/dist/esm/refine-results-flow-item.entry.js

@@ -3,7 +3,7 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-164d485a.js';
+import { r as registerInstance, h, a as Host, g as getElement } from './index-bdfaac50.js';
 
 const refineResultsFlowItemCss = ":host{display:block}";
 

package/dist/esm/refine-selection.entry.js

@@ -0,0 +1,407 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { r as registerInstance, e as createEvent, h, a as Host, g as getElement } from './index-bdfaac50.js';
+import { e as ESelectionMode, f as EDrawMode, a as EWorkflowType } from './interfaces-586e863c.js';
+import { b as getFeatureLayerView, e as getIdSets, f as highlightAllFeatures } from './mapViewUtils-436a516e.js';
+import { f as queryFeaturesByGeometry } from './queryUtils-2529c537.js';
+import { s as state } from './publicNotificationStore-208e26f0.js';
+import { g as getLocaleComponentStrings } from './locale-d9463a95.js';
+import './index-91eeaf01.js';
+import './loadModules-827c5581.js';
+import './esri-loader-af2bbfd5.js';
+import './_commonjsHelpers-3cd6d4ee.js';
+
+const refineSelectionCss = ":host{display:block}.div-visible{display:inherit}.div-not-visible{display:none !important}.padding-top-1-2{padding-top:.5rem}.main-label{display:flex;float:left}html[dir=\"rtl\"] .main-label{display:flex;float:right}.border{outline:1px solid var(--calcite-color-border-input)}.margin-top-1{margin-top:1rem}.esri-sketch{display:flex;flex-flow:column wrap}.esri-widget{box-sizing:border-box;color:#323232;font-size:14px;font-family:\"Avenir Next\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.3em;background-color:var(--calcite-color-foreground-1)}.esri-sketch__panel{align-items:center;display:flex;flex-flow:row nowrap;padding:0}*/ .esri-sketch__tool-section{border-right:1px solid rgba(110,110,110,.3)}.esri-sketch__section{align-items:center;display:flex;flex-flow:row nowrap;padding:0 7px;margin:6px 0;border-right:1px solid rgba(110,110,110,.3)}.display-flex{display:flex}.font-bold{font-weight:bold}.width-full{width:100%}.label-margin-0{--calcite-label-margin-bottom:0}.padding-start-1-2{padding-inline-start:0.5rem}.font-weight-500{font-weight:500}.word-wrap-anywhere{word-wrap:anywhere}";
+
+const RefineSelection = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.selectionLoadingChange = createEvent(this, "selectionLoadingChange", 7);
+        this.selectionSetsChanged = createEvent(this, "selectionSetsChanged", 7);
+        //--------------------------------------------------------------------------
+        //
+        //  Properties (protected)
+        //
+        //--------------------------------------------------------------------------
+        /**
+         * boolean: Indicates if any new graphics should be added or removed
+         */
+        this._addEnabled = true;
+        /**
+         * ISelectionSet[]: The current list of selection sets
+         */
+        this._refineSets = [];
+        /**
+         * string[]: The list of all layers that have current selections
+         */
+        this._enabledLayerIds = [];
+        /**
+         * {<layer id>: Graphic[]}: Collection of graphics returned from queries to the layer
+         */
+        this._featuresCollection = {};
+        this.addresseeLayer = undefined;
+        this.enabledLayerIds = [];
+        this.mapView = undefined;
+        this.selectionSets = [];
+        this.sketchLineSymbol = undefined;
+        this.sketchPointSymbol = undefined;
+        this.sketchPolygonSymbol = undefined;
+        this._translations = undefined;
+        this._selectionMode = ESelectionMode.ADD;
+        this._refineLayer = undefined;
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (lifecycle)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * StencilJS: Called once just after the component is first connected to the DOM.
+     */
+    async componentWillLoad() {
+        await this._getTranslations();
+        this._enabledLayerIds = this._getEnabledLayerIds();
+        await this._setRefineSet(this._enabledLayerIds[0]);
+    }
+    /**
+     * Renders the component.
+     */
+    render() {
+        var _a, _b;
+        const layerPickerClass = this._enabledLayerIds.length > 1 ? "display-block" : "display-none";
+        return (h(Host, null, h("div", { class: layerPickerClass + " padding-top-sides-1" }, h("div", { class: "display-flex" }, h("calcite-label", { class: "font-bold width-full label-margin-0" }, h("div", { class: "display-flex" }, this._translations.inputLayer, h("calcite-icon", { class: "padding-start-1-2 icon", icon: "question", id: "refine-input-layer", scale: "s" })), h("map-layer-picker", { enabledLayerIds: this._enabledLayerIds, mapView: this.mapView, onLayerSelectionChange: (evt) => { void this._layerSelectionChange(evt); }, ref: (el) => { this._layerPicker = el; }, selectedIds: [this._refineLayer.layer.id], showTables: false })), h("calcite-popover", { closable: true, label: "", referenceElement: "refine-input-layer" }, h("span", { class: "tooltip-message" }, this._translations.inputLayerTip)))), h("div", { class: "padding-1" }, h("div", { class: "padding-bottom-1" }, h("calcite-segmented-control", { class: "w-100", width: "full" }, h("calcite-segmented-control-item", { checked: this._addEnabled, class: "w-50 word-wrap-anywhere", onClick: () => this._setSelectionMode(ESelectionMode.ADD), value: ESelectionMode.ADD }, h("span", { class: "font-weight-500" }, this._translations.add)), h("calcite-segmented-control-item", { checked: !this._addEnabled, class: "w-50 word-wrap-anywhere", onClick: () => this._setSelectionMode(ESelectionMode.REMOVE), value: ESelectionMode.REMOVE }, h("span", { class: "font-weight-500" }, this._translations.remove)))), h("div", null, h("map-draw-tools", { active: true, drawMode: EDrawMode.REFINE, mapView: this.mapView, onDrawRedo: () => this._redo(), onDrawUndo: () => this._undo(), onSketchGraphicsChange: (evt) => this._sketchGraphicsChanged(evt), pointSymbol: this.sketchPointSymbol, polygonSymbol: this.sketchPolygonSymbol, polylineSymbol: this.sketchLineSymbol, redoEnabled: ((_a = this._refineSelectionSet) === null || _a === void 0 ? void 0 : _a.redoStack.length) > 0, ref: (el) => { this._drawTools = el; }, undoEnabled: ((_b = this._refineSelectionSet) === null || _b === void 0 ? void 0 : _b.undoStack.length) > 0 })), h("br", null), (h("calcite-list", { class: "list-border" }, this._getRefineSelectionSetList())))));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Functions (protected)
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Set the user selected layer as the current refine layer
+     *
+     * @param evt contains the selected layer id
+     *
+     * @protected
+     */
+    _layerSelectionChange(evt) {
+        const id = evt.detail[0];
+        void this._setRefineSet(id);
+    }
+    /**
+     * Store the current selection mode
+     *
+     * @param selectionMode the current selection mode ADD || REMOVE
+     *
+     * @protected
+     */
+    _setSelectionMode(selectionMode) {
+        this._selectionMode = selectionMode;
+    }
+    /**
+     * Select features based on the user drawn geometry
+     *
+     * @param evt ISketchGraphicsChange stores the new graphics and a boolean useOIDs
+     * useOIDs is leveraged in some situations to use the feature OIDs rather than the graphic geometry
+     *
+     * @protected
+     */
+    _sketchGraphicsChanged(evt) {
+        var _a;
+        const geom = (_a = evt.detail) === null || _a === void 0 ? void 0 : _a.graphics[0].geometry;
+        void this._selectFeatures(geom);
+    }
+    /**
+     * Get the layer ids for all layers in the selection sets
+     *
+     * @protected
+     */
+    _getEnabledLayerIds() {
+        return this.selectionSets.reduce((prev, cur) => {
+            var _a;
+            const id = (_a = cur === null || cur === void 0 ? void 0 : cur.layerView) === null || _a === void 0 ? void 0 : _a.layer.id;
+            if (id && prev.indexOf(id) < 0) {
+                prev.push(id);
+            }
+            else if (cur.workflowType === EWorkflowType.REFINE) {
+                Object.keys(cur.refineInfos).forEach(k => {
+                    if (prev.indexOf(k) < 0) {
+                        prev.push(k);
+                    }
+                });
+            }
+            return prev;
+        }, []);
+    }
+    /**
+     * Set the refine layer...any adds or removes will be done against this layer
+     *
+     * @param id the id of the layer that should be used as the current refine layer
+     *
+     * @protected
+     */
+    async _setRefineSet(id) {
+        if (!this.selectionSets.some((ss) => {
+            if (ss.workflowType === EWorkflowType.REFINE) {
+                this._refineSelectionSet = ss;
+                return Object.keys(ss.refineInfos).indexOf(id) > -1;
+            }
+        })) {
+            await this._initRefineSet(id, this._refineSelectionSet);
+        }
+        this._refineLayer = this._refineSelectionSet.refineInfos[id].layerView;
+    }
+    /**
+     * Initialize the refine selection set
+     *
+     * @param id the layer id to use for the refine selection set
+     * @param selectionSet the current refine selection set
+     *
+     * @protected
+     */
+    async _initRefineSet(id, selectionSet) {
+        const refineInfo = {};
+        refineInfo[id] = {
+            addIds: [],
+            removeIds: [],
+            layerView: await getFeatureLayerView(this.mapView, id)
+        };
+        if (selectionSet) {
+            selectionSet.refineInfos = Object.assign(Object.assign({}, selectionSet.refineInfos), refineInfo);
+        }
+        else {
+            this._refineSelectionSet = {
+                id: Date.now(),
+                searchResult: undefined,
+                buffer: undefined,
+                distance: 0,
+                download: true,
+                unit: "feet",
+                label: "Refine",
+                selectedIds: [],
+                layerView: undefined,
+                geometries: [],
+                graphics: [],
+                selectLayers: [],
+                workflowType: EWorkflowType.REFINE,
+                searchDistanceEnabled: false,
+                useLayerFeaturesEnabled: false,
+                refineInfos: refineInfo,
+                redoStack: [],
+                undoStack: [],
+                sketchGraphic: undefined
+            };
+            this.selectionSets.push(this._refineSelectionSet);
+        }
+    }
+    /**
+     * Undo the most current ADD or REMOVE operation
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    _undo() {
+        const undoOp = this._refineSelectionSet.undoStack.pop();
+        void this._updateIds(undoOp.ids, undoOp.mode === ESelectionMode.ADD ? ESelectionMode.REMOVE : ESelectionMode.ADD, this._refineSelectionSet.redoStack, undoOp.layerView);
+    }
+    /**
+     * Redo the most current ADD or REMOVE operation
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    _redo() {
+        const redoOp = this._refineSelectionSet.redoStack.pop();
+        void this._updateIds(redoOp.ids, redoOp.mode === ESelectionMode.ADD ? ESelectionMode.REMOVE : ESelectionMode.ADD, this._refineSelectionSet.undoStack, redoOp.layerView);
+    }
+    /**
+     * Create a list to show the number added/removed/total unique selected
+     *
+     * @returns the list node
+     * @protected
+     */
+    _getRefineSelectionSetList() {
+        const total = this._getTotal(this.selectionSets);
+        let refineSet;
+        this.selectionSets.some(ss => {
+            if (ss.workflowType === EWorkflowType.REFINE) {
+                refineSet = ss;
+                return true;
+            }
+        });
+        let numAdded = 0;
+        let numRemoved = 0;
+        Object.keys(refineSet.refineInfos).forEach(k => {
+            numAdded += refineSet.refineInfos[k].addIds.length;
+            numRemoved += refineSet.refineInfos[k].removeIds.length;
+        });
+        return [(h("calcite-list-item", { label: this._translations.featuresAdded.replace("{{n}}", numAdded.toString()), "non-interactive": true })), (h("calcite-list-item", { label: this._translations.featuresRemoved.replace("{{n}}", numRemoved.toString()), "non-interactive": true })), (h("calcite-list-item", { label: this._translations.totalSelected.replace("{{n}}", total.toString()), "non-interactive": true }))];
+    }
+    /**
+     * Get the total number od ids across all selection sets
+     *
+     * @returns the total number of ids
+     * @protected
+     */
+    _getTotal(selectionSets) {
+        const idSets = getIdSets(selectionSets);
+        return Object.keys(idSets).reduce((prev, cur) => {
+            const idSet = idSets[cur];
+            prev += idSet.ids.length;
+            return prev;
+        }, 0);
+    }
+    /**
+     * Fetches the component's translations
+     *
+     * @protected
+     */
+    async _getTranslations() {
+        const translations = await getLocaleComponentStrings(this.el);
+        this._translations = translations[0];
+    }
+    /**
+     * Select features based on the input geometry
+     *
+     * @param geom the geometry used for selection
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    async _selectFeatures(geom) {
+        var _a, _b;
+        this.selectionLoadingChange.emit(true);
+        this._featuresCollection[(_a = this._refineLayer) === null || _a === void 0 ? void 0 : _a.layer.id] = [];
+        const response = await queryFeaturesByGeometry(0, (_b = this._refineLayer) === null || _b === void 0 ? void 0 : _b.layer, geom, this._featuresCollection);
+        this.selectionLoadingChange.emit(false);
+        let graphics = [];
+        Object.keys(response).forEach(k => {
+            var _a;
+            if (k === ((_a = this._refineLayer) === null || _a === void 0 ? void 0 : _a.layer.id)) {
+                graphics = graphics.concat(response[k]);
+            }
+        });
+        const oids = Array.isArray(graphics) ? graphics.map(g => { var _a; return g.attributes[(_a = g === null || g === void 0 ? void 0 : g.layer) === null || _a === void 0 ? void 0 : _a.objectIdField]; }) : [];
+        await this._updateIds(oids, this._selectionMode, this._refineSelectionSet.undoStack, this._refineLayer);
+        this._drawTools.clear();
+    }
+    /**
+     * Highlight any selected features in the map
+     *
+     * @returns Promise resolving when function is done
+     * @protected
+     */
+    async _highlightFeatures() {
+        this._clearHighlight();
+        state.highlightHandles = await highlightAllFeatures(this.selectionSets);
+    }
+    /**
+     * Clear any highlighted features in the map
+     *
+     * @protected
+     */
+    _clearHighlight() {
+        state.removeHandles();
+    }
+    /**
+     * Update the ids for any ADD or REMOVE operation and highlight the features.
+     *
+     * @param oids the ids to add or remove
+     * @param mode ADD or REMOVE this will control if the ids are added or removed
+     * @param operationStack the undo or redo stack to push the operation to
+     * @param operationMode ADD or REMOVE the mode of the individual refine operation
+     *
+     * @returns Promise resolving when function is done
+     *
+     * @protected
+     */
+    async _updateIds(ids, mode, operationStack, layerView) {
+        let selectionSetsChanged = false;
+        const refineInfos = this._refineSelectionSet.refineInfos;
+        const layerId = layerView.layer.id;
+        const newRefineInfo = {};
+        newRefineInfo[layerId] = {
+            addIds: [],
+            removeIds: [],
+            layerView
+        };
+        const idUpdates = Object.keys(refineInfos).indexOf(layerId) > -1 ?
+            refineInfos[layerId] : newRefineInfo[layerId];
+        if (mode === ESelectionMode.ADD) {
+            idUpdates.addIds = [...new Set([...ids, ...idUpdates.addIds])];
+            if (idUpdates.addIds.length > 0) {
+                operationStack.push({
+                    ids,
+                    mode,
+                    layerView
+                });
+            }
+            if (idUpdates.removeIds.length > 0) {
+                idUpdates.removeIds = idUpdates.removeIds.filter(id => ids.indexOf(id) < 0);
+            }
+        }
+        else {
+            // ids are a result of the drawn geom...so it's possible they could contain ids that do
+            // not exist in other selection sets
+            const validIds = this.selectionSets.reduce((prev, cur) => {
+                ids.forEach(id => {
+                    if (cur.workflowType !== EWorkflowType.REFINE) {
+                        if (cur.selectedIds.indexOf(id) > -1) {
+                            prev.push(id);
+                        }
+                    }
+                    else {
+                        Object.keys(cur.refineInfos).some(k => {
+                            const refineInfo = cur.refineInfos[k];
+                            if (refineInfo.layerView.layer.id === layerView.layer.id && refineInfo.addIds.indexOf(id) > -1) {
+                                prev.push(id);
+                                return true;
+                            }
+                        });
+                    }
+                });
+                return prev;
+            }, []);
+            idUpdates.removeIds = [...new Set([...validIds, ...idUpdates.removeIds])];
+            idUpdates.addIds = idUpdates.addIds.filter(id => validIds.indexOf(id) < 0);
+            if (idUpdates.removeIds.length > 0) {
+                operationStack.push({
+                    ids: validIds,
+                    mode,
+                    layerView
+                });
+            }
+            this.selectionSets = this.selectionSets.reduce((prev, cur) => {
+                if (cur.workflowType !== EWorkflowType.REFINE &&
+                    cur.layerView.layer.id === layerView.layer.id) {
+                    cur.selectedIds = cur.selectedIds.filter(id => idUpdates.removeIds.indexOf(id) < 0);
+                    if (cur.selectedIds.length > 0) {
+                        prev.push(cur);
+                    }
+                    else {
+                        selectionSetsChanged = true;
+                    }
+                }
+                else {
+                    prev.push(cur);
+                }
+                return prev;
+            }, []);
+        }
+        this._refineSelectionSet.refineInfos[layerId] = idUpdates;
+        this.selectionSets = [...this.selectionSets];
+        if (selectionSetsChanged) {
+            this.selectionSetsChanged.emit(this.selectionSets);
+        }
+        await this._highlightFeatures();
+    }
+    get el() { return getElement(this); }
+};
+RefineSelection.style = refineSelectionCss;
+
+export { RefineSelection as refine_selection };