@esri/solutions-components 0.8.67 → 0.9.0

package/dist/solutions-components/feature-details.entry.js

@@ -1,381 +0,0 @@
-/*!
- * 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, g as getElement } from './index-0eecd45f.js';
-import { l as loadModules } from './loadModules-18662c29.js';
-import { b as getAllTables } from './mapViewUtils-d4946a31.js';
-import './esri-loader-5bf2f164.js';
-import './_commonjsHelpers-9cd17aec.js';
-import './queryUtils-2ee0f383.js';
-import './interfaces-586e863c.js';
-
-const featureDetailsCss = ":host{display:block}.buttons-container{align-items:center;display:flex;padding:4px;color:var(--calcite-color-text-1) !important;background-color:var(--calcite-color-foreground-1) !important;border-block-start:1px solid var(--calcite-color-border-3);border-block-end:1px solid var(--calcite-color-border-3)}.comment-btn{display:flex;gap:10px;font-size:var(--calcite-font-size--1);align-items:center;padding:7px 0.75rem}";
-
-const FeatureDetails = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.loadingStatus = createEvent(this, "loadingStatus", 7);
-        this.commentSelect = createEvent(this, "commentSelect", 7);
-        this.featureSelectionChange = createEvent(this, "featureSelectionChange", 7);
-        /**
-         * string[]: Valid field types for like and dislike
-         */
-        this._validFieldTypes = ["small-integer", "integer", "big-integer", "single", "long"];
-        this.mapView = undefined;
-        this.graphics = undefined;
-        this.reportingOptions = undefined;
-        this.layerItemsHash = undefined;
-        this._likeFieldAvailable = false;
-        this._likeCount = 0;
-        this._disLikeCount = 0;
-        this._dislikeFieldAvailable = false;
-        this._commentsAvailable = false;
-        this._isLikeBtnClicked = false;
-        this._isDislikeBtnClicked = false;
-        this._relatedFeaturesOIDs = undefined;
-        this._updating = false;
-    }
-    //--------------------------------------------------------------------------
-    //
-    //  Watch handlers
-    //
-    //--------------------------------------------------------------------------
-    /**
-     * Called each time the graphics prop is changed
-     */
-    async graphicsWatchHandler() {
-        await this.getCompleteGraphic(this.graphics[0]);
-        this.checkLikeDislikeFields();
-        await this.processComments();
-    }
-    //--------------------------------------------------------------------------
-    //
-    //  Methods (public)
-    //
-    //--------------------------------------------------------------------------
-    /**
-     * Refresh the features comments which will fetch like, dislike and update the component
-     * @returns Promise that resolves when the operation is complete
-     */
-    async refresh(graphic) {
-        await this.getCompleteGraphic(graphic);
-        await this.processComments();
-        if (this.isLikeDislikeConfigured(graphic.layer)) {
-            // in case of multiple features selected fetch complete feature and update like dislike for current feature
-            if (graphic && this.graphics.length > 1) {
-                this.checkLikeDislikeFields();
-            }
-        }
-        else {
-            this._likeFieldAvailable = false;
-            this._dislikeFieldAvailable = false;
-        }
-    }
-    /**
-     * Go to the previous feature in the features widget
-     */
-    async back() {
-        void this._infoCard.back();
-    }
-    /**
-     * Go to the next feature in the features widget
-     */
-    async next() {
-        void this._infoCard.next();
-    }
-    /**
-     * Toggle the visibility of the features list view
-     */
-    async toggleListView() {
-        void this._infoCard.toggleListView();
-    }
-    /**
-     * StencilJS: Called once just after the component is first connected to the DOM.
-     *
-     * @returns Promise when complete
-     */
-    async componentWillLoad() {
-        await this._initModules();
-        //Apply query to get complete graphic with complete attributes
-        await this.getCompleteGraphic(this.graphics[0]);
-        this.checkLikeDislikeFields();
-        await this.processComments();
-    }
-    render() {
-        var _a, _b, _c, _d, _e;
-        //When related features found show comments list of only those features else comments list will be empty
-        const commentsListWhereClause = ((_a = this._relatedFeaturesOIDs) === null || _a === void 0 ? void 0 : _a.length) > 0 ? `objectId in(${this._relatedFeaturesOIDs})` : '1=0';
-        return (h("calcite-panel", { key: '7f1fa230117891c11ff6747b7d3c5d6c8771c998', "full-height": true }, h("info-card", { key: '2b9119b5a0533d2ed8136149dd322aa9211f503b', allowEditing: false, graphics: this.graphics, highlightEnabled: false, isLoading: false, isMobile: false, mapView: this.mapView, onSelectionChanged: (e) => { this.featureSelectionChange.emit(e.detail); }, paginationEnabled: false, position: "relative", ref: el => this._infoCard = el }), (this._likeFieldAvailable || this._dislikeFieldAvailable || this._commentsAvailable) &&
-            h("div", { key: '85974c4ff61890dc43c02b84b9c6622e83039cdd', class: "buttons-container" }, this._commentsAvailable &&
-                h("div", { key: '8b905e1ee273103247f6cab2c598b03f1f733396', class: "comment-btn" }, h("span", { key: '05439cbc1e6080006479ce3694f4d1f81684a9d7' }, this._relatedFeaturesOIDs.length), h("calcite-icon", { key: '0e7062d1bc383c2f2fdd50ff003ea6a854e1a121', icon: "speech-bubble", scale: 's' })), this._likeFieldAvailable &&
-                h("calcite-button", { key: '26a024436a8e0c4251c200f112e6cc687795c85a', appearance: "transparent", iconEnd: "thumbs-up", kind: this._isLikeBtnClicked ? "brand" : "neutral", loading: this._updating, onClick: this.onLikeButtonClick.bind(this), scale: 'm' }, (_c = (_b = this._likeCount) !== null && _b !== void 0 ? _b : this._selectedGraphic.attributes[this._likeField]) !== null && _c !== void 0 ? _c : 0), this._dislikeFieldAvailable &&
-                h("calcite-button", { key: '67d1ebe6b0ba1893aac9f26e4cebfe30569115d5', appearance: "transparent", iconEnd: "thumbs-down", kind: this._isDislikeBtnClicked ? "brand" : "neutral", loading: this._updating, onClick: this.onDislikeButtonClick.bind(this), scale: 'm' }, (_e = (_d = this._disLikeCount) !== null && _d !== void 0 ? _d : this._selectedGraphic.attributes[this._dislikeField]) !== null && _e !== void 0 ? _e : 0)), this.relatedTableId && this._commentsAvailable &&
-            h("feature-list", { key: '7ed006e8be5f7280fdd260102111aad4656526f6', class: "height-full", mapView: this.mapView, onFeatureSelect: (e) => { this.commentSelect.emit(e.detail); }, pageSize: 5, ref: el => this._commentsList = el, selectedLayerId: this.relatedTableId, showErrorWhenNoFeatures: false, showInitialLoading: false, textSize: "small", whereClause: commentsListWhereClause })));
-    }
-    /**
-     * Load esri javascript api modules
-     *
-     * @returns Promise resolving when function is done
-     *
-     * @protected
-     */
-    async _initModules() {
-        const [RelationshipQuery, Graphic] = await loadModules([
-            "esri/rest/support/RelationshipQuery",
-            "esri/Graphic"
-        ]);
-        this.RelationshipQuery = RelationshipQuery;
-        this.Graphic = Graphic;
-    }
-    /**
-     * Get complete graphic with complete attributes
-     * @param graphic selected feature graphic
-     * @protected
-     */
-    async getCompleteGraphic(graphic) {
-        const layer = graphic.layer;
-        const query = layer.createQuery();
-        query.objectIds = [graphic.getObjectId()];
-        const completeGraphic = await layer.queryFeatures(query);
-        this._selectedGraphic = completeGraphic.features[0];
-    }
-    /**
-     * Process the comments functionality.
-     * If comments are configured, fetches the related comments ans creates the input for comments list
-     * @protected
-     */
-    async processComments() {
-        var _a;
-        const selectedLayer = this._selectedGraphic.layer;
-        const commentsConfigured = this.reportingOptions && this.reportingOptions[selectedLayer.id] &&
-            this.reportingOptions[selectedLayer.id].comment && ((_a = selectedLayer.relationships) === null || _a === void 0 ? void 0 : _a.length) > 0;
-        if (commentsConfigured) {
-            //Get comments table id from map
-            const relatedTableIdFromRelnship = selectedLayer.relationships[0].relatedTableId;
-            const allTables = await getAllTables(this.mapView);
-            const relatedTable = allTables.filter((table) => selectedLayer.url === table.url && relatedTableIdFromRelnship === table.layerId);
-            this.relatedTableId = (relatedTable === null || relatedTable === void 0 ? void 0 : relatedTable.length) > 0 ? relatedTable[0].id : '';
-            //**Get the related records for the current selected feature**
-            if (this.relatedTableId) {
-                //current selected feature's objectId
-                const objectId = this._selectedGraphic.attributes[selectedLayer.objectIdField];
-                //create relationship query to get all the related records with the current selected feature
-                const relationshipQuery = new this.RelationshipQuery({
-                    objectIds: [objectId],
-                    outFields: ['*'],
-                    relationshipId: selectedLayer.relationships[0].id
-                });
-                const result = await selectedLayer.queryRelatedFeatures(relationshipQuery).catch((e) => {
-                    console.error(e);
-                });
-                const relatedOIDs = [];
-                if (result[objectId]) {
-                    result[objectId].features.forEach((feature) => {
-                        relatedOIDs.push(feature.attributes.OBJECTID);
-                    });
-                }
-                // Store the objectid's of the related features, this will be used to show the comments and its count
-                this._relatedFeaturesOIDs = relatedOIDs;
-                //Set comments available or not
-                this._commentsAvailable = true;
-            }
-            else {
-                this._relatedFeaturesOIDs = [];
-                this._commentsAvailable = false;
-            }
-        }
-        else {
-            this._relatedFeaturesOIDs = [];
-            this._commentsAvailable = false;
-            this.relatedTableId = '';
-        }
-    }
-    /**
-     * Checks if the layers is configured for like dislike or not
-     * @param selectedLayer Feature layer
-     * @returns boolean
-     * @protected
-     */
-    isLikeDislikeConfigured(selectedLayer) {
-        let likeFieldAvailable = false;
-        let dislikeFieldAvailable = false;
-        // check if reporting options are configured for the current selected feature's layer
-        if (this.reportingOptions && this.reportingOptions[selectedLayer.id]) {
-            //return false if both like and dislike are disabled for the layer
-            if (!this.reportingOptions[selectedLayer.id].like && !this.reportingOptions[selectedLayer.id].dislike) {
-                return false;
-            }
-            const likeField = this.reportingOptions[selectedLayer.id].likeField;
-            const dislikeField = this.reportingOptions[selectedLayer.id].dislikeField;
-            //if both fields are not configured return false
-            if (!likeField && !dislikeField) {
-                return false;
-            }
-            //Check if selected layer have the configured like and dislike field and it is of integer types
-            selectedLayer.fields.forEach((eachField) => {
-                if (this._validFieldTypes.indexOf(eachField.type) > -1 && this.layerItemsHash[selectedLayer.id].supportsUpdate) {
-                    if (eachField.name === likeField && this.reportingOptions[selectedLayer.id].like) {
-                        likeFieldAvailable = true;
-                    }
-                    else if (eachField.name === dislikeField && this.reportingOptions[selectedLayer.id].dislike) {
-                        dislikeFieldAvailable = true;
-                    }
-                }
-            });
-        }
-        return likeFieldAvailable || dislikeFieldAvailable;
-    }
-    /**
-     * Check if configured like or dislike fields are available in the selected layer
-     * @protected
-     */
-    checkLikeDislikeFields() {
-        this._likeFieldAvailable = false;
-        this._dislikeFieldAvailable = false;
-        this._isLikeBtnClicked = false;
-        this._isDislikeBtnClicked = false;
-        this._likeCount = 0;
-        this._disLikeCount = 0;
-        const selectedLayer = this._selectedGraphic.layer;
-        // check if reporting options are configured for the current selected feature's layer
-        if (this.reportingOptions && this.reportingOptions[selectedLayer.id]) {
-            this._likeField = this.reportingOptions[selectedLayer.id].likeField;
-            this._dislikeField = this.reportingOptions[selectedLayer.id].dislikeField;
-            //if both fields are not found return
-            if (!this._likeField && !this._dislikeField) {
-                return;
-            }
-            //Check if selected layer have the configured like and dislike fields
-            //also, get the current value for like and dislike field from the attributes
-            selectedLayer.fields.forEach((eachField) => {
-                if (this._validFieldTypes.indexOf(eachField.type) > -1 && this.layerItemsHash[selectedLayer.id].supportsUpdate) {
-                    if (eachField.name === this._likeField && this.reportingOptions[selectedLayer.id].like) {
-                        this._likeFieldAvailable = true;
-                        this._likeCount = this._selectedGraphic.attributes[eachField.name];
-                    }
-                    else if (eachField.name === this._dislikeField && this.reportingOptions[selectedLayer.id].dislike) {
-                        this._dislikeFieldAvailable = true;
-                        this._disLikeCount = this._selectedGraphic.attributes[eachField.name];
-                    }
-                }
-            });
-            this.getFromLocalStorage();
-        }
-    }
-    /**
-     * On like button click highlight the like button and update the feature
-     * @protected
-     */
-    onLikeButtonClick() {
-        if (this._isDislikeBtnClicked && this.reportingOptions[this._selectedGraphic.layer.id].dislike) {
-            this.onDislikeButtonClick();
-        }
-        this._isLikeBtnClicked = !this._isLikeBtnClicked;
-        if (this._isLikeBtnClicked) {
-            this._likeCount++;
-        }
-        else {
-            this._likeCount--;
-        }
-        void this.updateFeaturesLikeDislikeField(this._likeField, this._isLikeBtnClicked);
-    }
-    /**
-     * On dislike button click highlight the dislike button and update the feature
-     * @protected
-     */
-    onDislikeButtonClick() {
-        if (this._isLikeBtnClicked && this.reportingOptions[this._selectedGraphic.layer.id].like) {
-            this.onLikeButtonClick();
-        }
-        this._isDislikeBtnClicked = !this._isDislikeBtnClicked;
-        if (this._isDislikeBtnClicked) {
-            this._disLikeCount++;
-        }
-        else {
-            this._disLikeCount--;
-        }
-        void this.updateFeaturesLikeDislikeField(this._dislikeField, this._isDislikeBtnClicked);
-    }
-    /**
-     * Update the feature if user click on like or dislike button
-     * @param fieldName field name of the feature for like or dislike attribute
-     * @param buttonClicked is like or dislike button clicked
-     * @protected
-     */
-    async updateFeaturesLikeDislikeField(fieldName, buttonClicked) {
-        const attributesToUpdate = {};
-        const selectedLayer = this._selectedGraphic.layer;
-        this._updating = true;
-        //Increment the value if button is clicked or else decrement it
-        const selectFeatureAttr = this._selectedGraphic;
-        selectFeatureAttr.attributes[fieldName] = Number(selectFeatureAttr.attributes[fieldName]) + (buttonClicked ? 1 : -1);
-        //use the oid and like/dislike field value to update
-        attributesToUpdate[selectedLayer.objectIdField] = selectFeatureAttr.attributes[selectedLayer.objectIdField];
-        attributesToUpdate[fieldName] = selectFeatureAttr.attributes[fieldName];
-        const newGraphicInstance = new this.Graphic();
-        newGraphicInstance.attributes = attributesToUpdate;
-        // Update the feature attribute in the feature layer
-        const param = { updateFeatures: [newGraphicInstance] };
-        await selectedLayer.applyEdits(param).then(() => {
-            this._selectedGraphic = selectFeatureAttr;
-            //store the like dislike value for the current selected graphic in local storage
-            this.setInLocalStorage();
-            this._updating = false;
-        }, (err) => {
-            this._updating = false;
-            console.log(err);
-        });
-    }
-    /**
-     * Gets the like/dislike information form local storage and updates the like and dislike button states
-     * @protected
-     */
-    getFromLocalStorage() {
-        const uniqueLayerId = this._selectedGraphic.layer.id;
-        //get the data from local storage and check current feature is liked or disliked
-        const localStorageUser = localStorage[uniqueLayerId];
-        if (localStorageUser) {
-            const parseArr = JSON.parse(localStorageUser);
-            const res = parseArr.filter((arr) => arr.id === this._selectedGraphic.getObjectId());
-            if (res.length > 0) {
-                this._isLikeBtnClicked = res[0].like;
-                this._isDislikeBtnClicked = res[0].dislike;
-            }
-        }
-    }
-    /**
-     * Sets the like/dislike information for the current selected graphic in local storage
-     * @protected
-     */
-    setInLocalStorage() {
-        const uniqueLayerId = this._selectedGraphic.layer.id;
-        const localStorageInfo = localStorage[uniqueLayerId];
-        let information = [];
-        //if information for the current layer found in local storage update it
-        //else add new information for the current layer in the local storage
-        if (localStorageInfo) {
-            information = JSON.parse(localStorageInfo);
-            const index = information.findIndex((arr) => arr.id === this._selectedGraphic.getObjectId());
-            //if information for current objectid found delete it, so that we always have info for each oid in a layer only once
-            if (index >= 0) {
-                information.splice(index, 1);
-            }
-        }
-        //add the information for current selected graphic
-        information.push({
-            id: this._selectedGraphic.getObjectId(),
-            like: this._isLikeBtnClicked && this._likeCount !== 0,
-            dislike: this._isDislikeBtnClicked && this._disLikeCount !== 0
-        });
-        localStorage.setItem(uniqueLayerId, JSON.stringify(information));
-    }
-    get el() { return getElement(this); }
-    static get watchers() { return {
-        "graphics": ["graphicsWatchHandler"]
-    }; }
-};
-FeatureDetails.style = featureDetailsCss;
-
-export { FeatureDetails as feature_details };

package/dist/solutions-components/feature-form-flow-item.entry.js

@@ -1,56 +0,0 @@
-/*!
- * Copyright 2022 Esri
- * Licensed under the Apache License, Version 2.0
- * http://www.apache.org/licenses/LICENSE-2.0
- */
-import { r as registerInstance, h, a as Host, g as getElement } from './index-0eecd45f.js';
-
-const featureFormFlowItemCss = ":host{display:block}";
-
-const FeatureFormFlowItem = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    //--------------------------------------------------------------------------
-    //
-    //  Properties (public)
-    //
-    //--------------------------------------------------------------------------
-    //--------------------------------------------------------------------------
-    //
-    //  State (internal)
-    //
-    //--------------------------------------------------------------------------
-    //--------------------------------------------------------------------------
-    //
-    //  Properties (protected)
-    //
-    //--------------------------------------------------------------------------
-    //--------------------------------------------------------------------------
-    //
-    //  Watch handlers
-    //
-    //--------------------------------------------------------------------------
-    //--------------------------------------------------------------------------
-    //
-    //  Methods (public)
-    //
-    //--------------------------------------------------------------------------
-    //--------------------------------------------------------------------------
-    //
-    //  Events (public)
-    //
-    //--------------------------------------------------------------------------
-    //--------------------------------------------------------------------------
-    //
-    //  Functions (lifecycle)
-    //
-    //--------------------------------------------------------------------------
-    render() {
-        return (h(Host, { key: '32113dda304b2f7179d0275f04987e69ce386959' }, h("slot", { key: '358d5ea7a03cc7da16e98a92391cf74dfe9fa89b' })));
-    }
-    get el() { return getElement(this); }
-};
-FeatureFormFlowItem.style = featureFormFlowItemCss;
-
-export { FeatureFormFlowItem as feature_form_flow_item };