@esri/solutions-components 0.8.33 → 0.8.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/dist/cjs/calcite-flow_6.cjs.entry.js +22 -19
  2. package/dist/cjs/crowdsource-reporter.cjs.entry.js +29 -6
  3. package/dist/collection/components/create-feature/create-feature.js +13 -12
  4. package/dist/collection/components/create-related-feature/create-related-feature.js +23 -3
  5. package/dist/collection/components/crowdsource-reporter/crowdsource-reporter.js +31 -8
  6. package/dist/collection/components/feature-details/feature-details.js +0 -4
  7. package/dist/collection/demos/crowdsource-reporter.html +32 -8
  8. package/dist/components/create-feature2.js +13 -12
  9. package/dist/components/create-related-feature2.js +9 -3
  10. package/dist/components/crowdsource-reporter.js +29 -6
  11. package/dist/components/feature-details2.js +0 -4
  12. package/dist/esm/calcite-flow_6.entry.js +22 -19
  13. package/dist/esm/crowdsource-reporter.entry.js +29 -6
  14. package/dist/solutions-components/demos/crowdsource-reporter.html +32 -8
  15. package/dist/solutions-components/p-0ce36a4a.entry.js +17 -0
  16. package/dist/solutions-components/p-5c5e3745.entry.js +6 -0
  17. package/dist/solutions-components/solutions-components.esm.js +1 -1
  18. package/dist/types/components/create-related-feature/create-related-feature.d.ts +4 -0
  19. package/dist/types/components/crowdsource-reporter/crowdsource-reporter.d.ts +16 -3
  20. package/dist/types/components.d.ts +7 -2
  21. package/dist/types/preact.d.ts +2 -1
  22. package/package.json +1 -1
  23. package/dist/solutions-components/p-4ae34862.entry.js +0 -17
  24. package/dist/solutions-components/p-90c3bc54.entry.js +0 -6
@@ -156,7 +156,7 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
156
156
  */
157
157
  render() {
158
158
  const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
159
- return (h(Host, { key: '119bb8b1c9115dca4e15c45ddd8e7fbed500b4d7' }, this._reportSubmitted && h("calcite-alert", { key: 'ef85c61fb5c9eaac9391c1e37494ef5e4244dadb', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '616a75103a227cf1b50d9e43fea129afc3fee4f9', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: '2faf9a9729bf90b87e044bfe8958571735f2cbf5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: '66cdf81166042ff4efddd4cc5801d790463d75fc', slot: "title" }, this._translations.error), h("div", { key: 'ad289b06742d2159d6fcfbdc42ecc9fb6d81f362', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: '27aee542bfd2cae8972035d17167407b35b5eb76', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '70a8a21de05b00d409adb226d6393817f7514930', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '107ab01eca03500faeb4db5a2ac0e9dc7261e6fc', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: '31e6fba8c28489f87897a13ebb4e7b8956452191', slot: "title" }, this._translations.error), h("div", { key: '6f0868946ef6e04490ba1e0806a03e26c756760b', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: 'e169b7b466023010d45151ca9b7dfb900d8d7f9f' }, h("calcite-shell", { key: '72899b8eff6622233224df91223ee5d59539905b', "content-behind": true }, this._getReporter())), this.filterModal()));
159
+ return (h(Host, { key: 'e512e2693a586f8a6da7bcfa171feb60da26aee3' }, this._reportSubmitted && h("calcite-alert", { key: 'e5805ba948f1dc43eba2a78716af452cf71a8222', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '95b9accf1f09186c09c81cfb02a8939c4869ae8d', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: 'cab7f0e0f0d882612b4fa6f00799be9870aea6c5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: 'b9453672d85e26cf7bdeae0923cd36020d259d49', slot: "title" }, this._translations.error), h("div", { key: '5084315857bc88b8f80aaa411ac3fd5e4493e918', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: '62b7d9818913c3331ca9c8e4ed23c7f0c48a7946', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '5f18444fd375657db0c2a403cb453ead75536181', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '732f08960095fc9fefcc79fc8df387a5a4c3f781', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: '16415430cf33ce53c0d49cab19dce2c3e34257d6', slot: "title" }, this._translations.error), h("div", { key: '83e5918e00902bd49512165f4aa62813cecb4619', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: '3e9dadd880319708e64e717ba7e7adaddf97b935' }, h("calcite-shell", { key: 'c72664d361b3904bc191668207c3ad31ff1f98c9', "content-behind": true }, this._getReporter())), this.filterModal()));
160
160
  }
161
161
  //--------------------------------------------------------------------------
162
162
  //
@@ -333,7 +333,7 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
333
333
  * @protected
334
334
  */
335
335
  getFeatureCreateFlowItem() {
336
- return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onDrawComplete.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
336
+ return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
337
337
  }
338
338
  /**
339
339
  * Update the progress bar status when editor panel changes
@@ -344,10 +344,12 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
344
344
  this._updatedProgressBarStatus = evt.detail;
345
345
  }
346
346
  /**
347
- * When drawing of incident location completed on map show the submit and cancel button
347
+ * When form is ready then show submit and cancel button
348
348
  * @protected
349
349
  */
350
- onDrawComplete() {
350
+ onFormReady() {
351
+ // update the form state when form is ready
352
+ this.updateFormState(true);
351
353
  this._showSubmitCancelButton = true;
352
354
  }
353
355
  /**
@@ -374,6 +376,10 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
374
376
  if (this._createFeature) {
375
377
  void this._createFeature.close();
376
378
  }
379
+ //on back form will be closed, so update the form state
380
+ if (this.isFormOpen) {
381
+ this.updateFormState(false);
382
+ }
377
383
  this.backFromSelectedPanel();
378
384
  }
379
385
  /**
@@ -394,6 +400,10 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
394
400
  void this._createRelatedFeature.close();
395
401
  this._showSubmitCancelButton = false;
396
402
  }
403
+ //on back form will be closed, so update the form state
404
+ if (this.isFormOpen) {
405
+ this.updateFormState(false);
406
+ }
397
407
  this.backFromSelectedPanel();
398
408
  }
399
409
  /**
@@ -410,6 +420,10 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
410
420
  * @protected
411
421
  */
412
422
  onReportSubmitted() {
423
+ //on report submit form will be closed, so update the form state
424
+ if (this.isFormOpen) {
425
+ this.updateFormState(false);
426
+ }
413
427
  this._reportSubmitted = true;
414
428
  void this.navigateToHomePage();
415
429
  }
@@ -546,7 +560,16 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
546
560
  */
547
561
  toggleSidePanel() {
548
562
  this._sidePanelCollapsed = !this._sidePanelCollapsed;
549
- this.togglePanel.emit(this._sidePanelCollapsed);
563
+ this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
564
+ }
565
+ /**
566
+ * Hide map when form open in case of mobile
567
+ * @param isFormOpen updated form state
568
+ * @protected
569
+ */
570
+ updateFormState(isFormOpen) {
571
+ this.isFormOpen = isFormOpen;
572
+ this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
550
573
  }
551
574
  /**
552
575
  * When feature is selected from list store that and show feature details
@@ -641,7 +664,7 @@ const CrowdsourceReporter$1 = /*@__PURE__*/ proxyCustomElement(class Crowdsource
641
664
  * @returns Node
642
665
  */
643
666
  getAddCommentFlowItem() {
644
- return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
667
+ return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onFormReady: this.onFormReady.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
645
668
  }
646
669
  /**
647
670
  * Sets the selected features and updates the first feature as the current selected feature
@@ -349,10 +349,6 @@ const FeatureDetails = /*@__PURE__*/ proxyCustomElement(class FeatureDetails ext
349
349
  const param = { updateFeatures: [newGraphicInstance] };
350
350
  await selectedLayer.applyEdits(param).then(() => {
351
351
  this._selectedGraphic = selectFeatureAttr;
352
- //update the current graphics in info card so that, the updated values are reflected in popup content
353
- if (this._infoCard) {
354
- void this._infoCard.updateCurrentGraphic(this._selectedGraphic);
355
- }
356
352
  //store the like dislike value for the current selected graphic in local storage
357
353
  this.setInLocalStorage();
358
354
  this._updating = false;
@@ -518,14 +518,23 @@ const CreateFeature = class {
518
518
  }
519
519
  });
520
520
  this._editor.viewModel.addHandles(handle);
521
+ //Add handle to watch featureFormViewModel ready state
522
+ const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
523
+ if (state === 'ready') {
524
+ this._showSearchWidget = false;
525
+ this.progressStatus.emit(1);
526
+ this.drawComplete.emit();
527
+ }
528
+ });
529
+ this._editor.viewModel.addHandles(formHandle);
521
530
  //Add handle to watch editor viewmodel state and then show the search widget
522
- const formHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
531
+ const createFeatureHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
523
532
  if (state === 'creating-features') {
524
533
  this._editorLoading = true;
525
534
  this._showSearchWidget = true;
526
535
  }
527
536
  });
528
- this._editor.viewModel.addHandles(formHandle);
537
+ this._editor.viewModel.addHandles(createFeatureHandle);
529
538
  }
530
539
  /**
531
540
  * Start creating the feature
@@ -543,14 +552,6 @@ const CreateFeature = class {
543
552
  setTimeout(() => {
544
553
  //on form submit
545
554
  this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
546
- //on sketch complete emit the event
547
- this._editor.viewModel.sketchViewModel.on("create", (evt) => {
548
- if (evt.state === "complete") {
549
- this._showSearchWidget = false;
550
- this.progressStatus.emit(1);
551
- this.drawComplete.emit();
552
- }
553
- });
554
555
  //hides the header and footer elements in editor widget
555
556
  this.hideEditorsElements().then(() => {
556
557
  resolve({});
@@ -664,13 +665,13 @@ const CreateFeature = class {
664
665
  * @protected
665
666
  */
666
667
  async hideEditorsElements() {
667
- var _a;
668
+ var _a, _b;
668
669
  if (!this.customizeSubmit) {
669
670
  return;
670
671
  }
671
672
  await this.timeout(700);
672
673
  //hides the header and footer on the featureForm
673
- (_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null || _a === void 0 ? void 0 : _a.forEach((flowItem) => {
674
+ (_b = (_a = this.el.querySelector('.esri-editor')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('calcite-flow-item')) === null || _b === void 0 ? void 0 : _b.forEach((flowItem) => {
674
675
  var _a, _b, _c, _d, _e;
675
676
  const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
676
677
  //hide the header
@@ -738,6 +739,7 @@ const CreateRelatedFeature = class {
738
739
  this.success = createEvent(this, "success", 7);
739
740
  this.fail = createEvent(this, "fail", 7);
740
741
  this.isActionPending = createEvent(this, "isActionPending", 7);
742
+ this.formReady = createEvent(this, "formReady", 7);
741
743
  /**
742
744
  * boolean: Flag to maintain form submission using submit button
743
745
  */
@@ -830,7 +832,7 @@ const CreateRelatedFeature = class {
830
832
  }
831
833
  render() {
832
834
  const loaderClass = this._editorLoading ? "" : "display-none";
833
- return (h("calcite-loader", { key: 'a8fd1e83a4a9614779be19a11e6028b3a402cbd2', class: loaderClass, label: "", scale: "s" }));
835
+ return (h("calcite-loader", { key: '5302b1166a175b0605604792cd40b9d3fbfabd02', class: loaderClass, label: "", scale: "s" }));
834
836
  }
835
837
  /**
836
838
  * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -878,6 +880,13 @@ const CreateRelatedFeature = class {
878
880
  }
879
881
  });
880
882
  this._editor.viewModel.addHandles(attachmentHandle);
883
+ //Add handle to watch featureFormViewModel ready state
884
+ const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
885
+ if (state === 'ready') {
886
+ this.formReady.emit();
887
+ }
888
+ });
889
+ this._editor.viewModel.addHandles(formHandle);
881
890
  }
882
891
  /**
883
892
  * Start creating the feature feature form
@@ -903,8 +912,6 @@ const CreateRelatedFeature = class {
903
912
  await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
904
913
  //hides the header and footer elements in editor widget
905
914
  await this.hideEditorsElements();
906
- // Emit an event to show submit cancel buttons
907
- this.isActionPending.emit(false);
908
915
  this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
909
916
  }
910
917
  /**
@@ -1312,10 +1319,6 @@ const FeatureDetails = class {
1312
1319
  const param = { updateFeatures: [newGraphicInstance] };
1313
1320
  await selectedLayer.applyEdits(param).then(() => {
1314
1321
  this._selectedGraphic = selectFeatureAttr;
1315
- //update the current graphics in info card so that, the updated values are reflected in popup content
1316
- if (this._infoCard) {
1317
- void this._infoCard.updateCurrentGraphic(this._selectedGraphic);
1318
- }
1319
1322
  //store the like dislike value for the current selected graphic in local storage
1320
1323
  this.setInLocalStorage();
1321
1324
  this._updating = false;
@@ -109,7 +109,7 @@ const CrowdsourceReporter = class {
109
109
  */
110
110
  render() {
111
111
  const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
112
- return (h(Host, { key: '119bb8b1c9115dca4e15c45ddd8e7fbed500b4d7' }, this._reportSubmitted && h("calcite-alert", { key: 'ef85c61fb5c9eaac9391c1e37494ef5e4244dadb', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '616a75103a227cf1b50d9e43fea129afc3fee4f9', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: '2faf9a9729bf90b87e044bfe8958571735f2cbf5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: '66cdf81166042ff4efddd4cc5801d790463d75fc', slot: "title" }, this._translations.error), h("div", { key: 'ad289b06742d2159d6fcfbdc42ecc9fb6d81f362', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: '27aee542bfd2cae8972035d17167407b35b5eb76', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '70a8a21de05b00d409adb226d6393817f7514930', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '107ab01eca03500faeb4db5a2ac0e9dc7261e6fc', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: '31e6fba8c28489f87897a13ebb4e7b8956452191', slot: "title" }, this._translations.error), h("div", { key: '6f0868946ef6e04490ba1e0806a03e26c756760b', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: 'e169b7b466023010d45151ca9b7dfb900d8d7f9f' }, h("calcite-shell", { key: '72899b8eff6622233224df91223ee5d59539905b', "content-behind": true }, this._getReporter())), this.filterModal()));
112
+ return (h(Host, { key: 'e512e2693a586f8a6da7bcfa171feb60da26aee3' }, this._reportSubmitted && h("calcite-alert", { key: 'e5805ba948f1dc43eba2a78716af452cf71a8222', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '95b9accf1f09186c09c81cfb02a8939c4869ae8d', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: 'cab7f0e0f0d882612b4fa6f00799be9870aea6c5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: 'b9453672d85e26cf7bdeae0923cd36020d259d49', slot: "title" }, this._translations.error), h("div", { key: '5084315857bc88b8f80aaa411ac3fd5e4493e918', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: '62b7d9818913c3331ca9c8e4ed23c7f0c48a7946', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '5f18444fd375657db0c2a403cb453ead75536181', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '732f08960095fc9fefcc79fc8df387a5a4c3f781', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: '16415430cf33ce53c0d49cab19dce2c3e34257d6', slot: "title" }, this._translations.error), h("div", { key: '83e5918e00902bd49512165f4aa62813cecb4619', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: '3e9dadd880319708e64e717ba7e7adaddf97b935' }, h("calcite-shell", { key: 'c72664d361b3904bc191668207c3ad31ff1f98c9', "content-behind": true }, this._getReporter())), this.filterModal()));
113
113
  }
114
114
  //--------------------------------------------------------------------------
115
115
  //
@@ -286,7 +286,7 @@ const CrowdsourceReporter = class {
286
286
  * @protected
287
287
  */
288
288
  getFeatureCreateFlowItem() {
289
- return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onDrawComplete.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
289
+ return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
290
290
  }
291
291
  /**
292
292
  * Update the progress bar status when editor panel changes
@@ -297,10 +297,12 @@ const CrowdsourceReporter = class {
297
297
  this._updatedProgressBarStatus = evt.detail;
298
298
  }
299
299
  /**
300
- * When drawing of incident location completed on map show the submit and cancel button
300
+ * When form is ready then show submit and cancel button
301
301
  * @protected
302
302
  */
303
- onDrawComplete() {
303
+ onFormReady() {
304
+ // update the form state when form is ready
305
+ this.updateFormState(true);
304
306
  this._showSubmitCancelButton = true;
305
307
  }
306
308
  /**
@@ -327,6 +329,10 @@ const CrowdsourceReporter = class {
327
329
  if (this._createFeature) {
328
330
  void this._createFeature.close();
329
331
  }
332
+ //on back form will be closed, so update the form state
333
+ if (this.isFormOpen) {
334
+ this.updateFormState(false);
335
+ }
330
336
  this.backFromSelectedPanel();
331
337
  }
332
338
  /**
@@ -347,6 +353,10 @@ const CrowdsourceReporter = class {
347
353
  void this._createRelatedFeature.close();
348
354
  this._showSubmitCancelButton = false;
349
355
  }
356
+ //on back form will be closed, so update the form state
357
+ if (this.isFormOpen) {
358
+ this.updateFormState(false);
359
+ }
350
360
  this.backFromSelectedPanel();
351
361
  }
352
362
  /**
@@ -363,6 +373,10 @@ const CrowdsourceReporter = class {
363
373
  * @protected
364
374
  */
365
375
  onReportSubmitted() {
376
+ //on report submit form will be closed, so update the form state
377
+ if (this.isFormOpen) {
378
+ this.updateFormState(false);
379
+ }
366
380
  this._reportSubmitted = true;
367
381
  void this.navigateToHomePage();
368
382
  }
@@ -499,7 +513,16 @@ const CrowdsourceReporter = class {
499
513
  */
500
514
  toggleSidePanel() {
501
515
  this._sidePanelCollapsed = !this._sidePanelCollapsed;
502
- this.togglePanel.emit(this._sidePanelCollapsed);
516
+ this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
517
+ }
518
+ /**
519
+ * Hide map when form open in case of mobile
520
+ * @param isFormOpen updated form state
521
+ * @protected
522
+ */
523
+ updateFormState(isFormOpen) {
524
+ this.isFormOpen = isFormOpen;
525
+ this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
503
526
  }
504
527
  /**
505
528
  * When feature is selected from list store that and show feature details
@@ -594,7 +617,7 @@ const CrowdsourceReporter = class {
594
617
  * @returns Node
595
618
  */
596
619
  getAddCommentFlowItem() {
597
- return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
620
+ return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onFormReady: this.onFormReady.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
598
621
  }
599
622
  /**
600
623
  * Sets the selected features and updates the first feature as the current selected feature
@@ -40,6 +40,7 @@
40
40
  }
41
41
  .over-map[dir="rtl"] {
42
42
  right: 0px;
43
+ left: auto;
43
44
  }
44
45
  .column {
45
46
  width: 360px;
@@ -72,6 +73,13 @@
72
73
  top: calc(100% - 100px);
73
74
  height: 100px;
74
75
  }
76
+
77
+ .map-collapsed {
78
+ height: 100%;
79
+ top: 0;
80
+ width: 100%;
81
+ z-index: 1000;
82
+ }
75
83
  }
76
84
  </style>
77
85
 
@@ -295,22 +303,38 @@
295
303
  //on change update the prop for is mobile
296
304
  mediaQueryList.onchange = (e) => {
297
305
  demo.isMobile = e.matches;
298
- togglePanel({ detail: false })
306
+ togglePanel({ detail: { panelState: false, isFormOpen: false } })
299
307
  }
300
308
  //listen to togglePanel event
301
309
  demo.addEventListener('togglePanel', togglePanel);
302
310
  });
303
311
 
304
- function togglePanel(evt) {
305
- const state = evt.detail;
312
+ function togglePanel(evt) {
313
+ const panelState = evt.detail.panelState;
314
+ const hideMap = evt.detail.isFormOpen;
306
315
  const viewDiv = document.getElementById("viewDiv");
307
316
  const demo = document.getElementById("demo");
308
- if (state) {
309
- demo.classList.add("column-collapsed");
310
- viewDiv.classList.add("map-with-panel-collapsed");
317
+ // in case of form is open then collapse the map
318
+ if (hideMap) {
319
+ if (panelState) {
320
+ demo.classList.remove("map-collapsed");
321
+ demo.classList.add("column-collapsed");
322
+ viewDiv.classList.add("map-with-panel-collapsed");
323
+ } else {
324
+ demo.classList.add("map-collapsed");
325
+ demo.classList.remove("column-collapsed");
326
+ viewDiv.classList.remove("map-with-panel-collapsed");
327
+ }
311
328
  } else {
312
- demo.classList.remove("column-collapsed");
313
- viewDiv.classList.remove("map-with-panel-collapsed");
329
+ if (panelState) {
330
+ demo.classList.add("column-collapsed");
331
+ viewDiv.classList.add("map-with-panel-collapsed");
332
+ demo.classList.remove("map-collapsed");
333
+ } else {
334
+ demo.classList.remove("column-collapsed");
335
+ viewDiv.classList.remove("map-with-panel-collapsed");
336
+ demo.classList.remove("map-collapsed");
337
+ }
314
338
  }
315
339
  }
316
340
  </script>
@@ -0,0 +1,17 @@
1
+ /*!
2
+ * Copyright 2022 Esri
3
+ * Licensed under the Apache License, Version 2.0
4
+ * http://www.apache.org/licenses/LICENSE-2.0
5
+ */
6
+ import{r as t,h as i,g as s,c as e,H as a,F as o}from"./p-6d753a3d.js";import{c as n}from"./p-bfd3d428.js";import{c as h,s as c,a as l}from"./p-a25bbcc1.js";import{a as r}from"./p-67b26725.js";import{c as d,u as b,d as f,I as p}from"./p-9db9645e.js";import{c as u,d as m}from"./p-b5bfe190.js";import{c as v,s as y,d as g,u as w}from"./p-2e625f11.js";import{S as k}from"./p-d2b66bd2.js";import{l as x,f as L,g as _}from"./p-896c9644.js";import{a as C,g as S,b as j,d as W}from"./p-5aaa05ef.js";import"./p-b85be429.js";import"./p-db50226e.js";import"./p-820d8935.js";import"./p-f50a294b.js";import"./p-82e085d0.js";import"./p-c1cf3ebc.js";
7
+ /*!
8
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
9
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
10
+ * v2.8.2
11
+ */const E="frame",I="frame--advancing",F="frame--retreating",z=class{constructor(i){t(this,i),this.itemMutationObserver=n("mutation",(()=>this.updateFlowProps())),this.getFlowDirection=(t,i)=>t&&i>1||t>1?i<t?"retreating":"advancing":null,this.updateFlowProps=()=>{const{customItemSelectors:t,el:i,items:s}=this,e=Array.from(i.querySelectorAll("calcite-flow-item"+(t?`,${t}`:""))).filter((t=>t.closest("calcite-flow")===i)),a=s.length,o=e.length,n=e[o-1],h=e[o-2];if(o&&n&&e.forEach((t=>{t.showBackButton=t===n&&o>1,t.hidden=t!==n})),h&&(h.menuOpen=!1),this.items=e,a!==o){const t=this.getFlowDirection(a,o);this.itemCount=o,this.flowDirection=t}},this.customItemSelectors=void 0,this.flowDirection=null,this.itemCount=0,this.items=[]}async back(){const{items:t}=this,i=t[t.length-1];if(!i)return;const s=i.beforeBack?i.beforeBack:()=>Promise.resolve();try{await s.call(i)}catch(t){return}return i.remove(),i}async setFocus(){await h(this);const{items:t}=this,i=t[t.length-1];return null==i?void 0:i.setFocus()}connectedCallback(){var t;null===(t=this.itemMutationObserver)||void 0===t||t.observe(this.el,{childList:!0,subtree:!0}),this.updateFlowProps()}async componentWillLoad(){c(this)}componentDidLoad(){l(this)}disconnectedCallback(){var t;null===(t=this.itemMutationObserver)||void 0===t||t.disconnect()}async handleItemBackClick(t){if(!t.defaultPrevented)return await this.back(),this.setFocus()}render(){const{flowDirection:t}=this;return i("div",{key:"9d405841d7a1ee2d7a5da28c02ef8d5bf08dd9f5",class:{[E]:!0,[I]:"advancing"===t,[F]:"retreating"===t}},i("slot",{key:"a02231a5002f8b19542e03529aad12771787b26f"}))}get el(){return s(this)}};z.style=":host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;align-items:stretch;overflow:hidden;background-color:transparent}:host .frame{position:relative;margin:0px;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;padding:0px}:host ::slotted(calcite-flow-item),:host ::slotted(calcite-panel){block-size:100%}:host ::slotted(.calcite-match-height:last-child){display:flex;flex:1 1 auto;overflow:hidden}:host .frame--advancing{animation:calcite-frame-advance var(--calcite-animation-timing)}:host .frame--retreating{animation:calcite-frame-retreat var(--calcite-animation-timing)}@keyframes calcite-frame-advance{0%{--tw-bg-opacity:0.5;transform:translate3d(50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-retreat{0%{--tw-bg-opacity:0.5;transform:translate3d(-50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}:host([hidden]){display:none}[hidden]{display:none}";
12
+ /*!
13
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
14
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
15
+ * v2.8.2
16
+ */
17
+ const D=class{constructor(i){t(this,i),this.calciteFlowItemBack=e(this,"calciteFlowItemBack",7),this.calciteFlowItemScroll=e(this,"calciteFlowItemScroll",6),this.calciteFlowItemClose=e(this,"calciteFlowItemClose",6),this.calciteFlowItemToggle=e(this,"calciteFlowItemToggle",6),this.handlePanelScroll=t=>{t.stopPropagation(),this.calciteFlowItemScroll.emit()},this.handlePanelClose=t=>{t.stopPropagation(),this.calciteFlowItemClose.emit()},this.handlePanelToggle=t=>{t.stopPropagation(),this.collapsed=t.target.collapsed,this.calciteFlowItemToggle.emit()},this.backButtonClick=()=>{this.calciteFlowItemBack.emit()},this.setBackRef=t=>{this.backButtonEl=t},this.setContainerRef=t=>{this.containerEl=t},this.closable=!1,this.closed=!1,this.collapsed=!1,this.collapseDirection="down",this.collapsible=!1,this.beforeBack=void 0,this.description=void 0,this.disabled=!1,this.heading=void 0,this.headingLevel=void 0,this.loading=!1,this.menuOpen=!1,this.messageOverrides=void 0,this.messages=void 0,this.overlayPositioning="absolute",this.showBackButton=!1,this.defaultMessages=void 0,this.effectiveLocale=""}onMessagesChange(){}connectedCallback(){d(this),u(this),v(this)}async componentWillLoad(){await y(this),c(this)}componentDidRender(){b(this)}disconnectedCallback(){f(this),m(this),g(this)}componentDidLoad(){l(this)}effectiveLocaleChange(){w(this,this.effectiveLocale)}async setFocus(){await h(this);const{backButtonEl:t,containerEl:i}=this;return t?t.setFocus():i?i.setFocus():void 0}async scrollContentTo(t){var i;await(null===(i=this.containerEl)||void 0===i?void 0:i.scrollContentTo(t))}renderBackButton(){const{el:t}=this,s="rtl"===r(t),{showBackButton:e,backButtonClick:a,messages:o}=this,n=o.back;return e?i("calcite-action",{"aria-label":n,class:"back-button",icon:s?"chevron-right":"chevron-left",key:"flow-back-button",onClick:a,scale:"s",slot:"header-actions-start",text:n,title:n,ref:this.setBackRef}):null}render(){const{collapsed:t,collapseDirection:s,collapsible:e,closable:o,closed:n,description:h,disabled:c,heading:l,headingLevel:r,loading:d,menuOpen:b,messages:f,overlayPositioning:u}=this;return i(a,{key:"ab926d381ff2493f3fd49a5c8724260211d69ca9"},i(p,{key:"6799b56c2116de5e08739ddc2ec1557bd291f3f8",disabled:c},i("calcite-panel",{key:"2e438b8abf573eabaaa2e966dcca5c4843a53cba",closable:o,closed:n,collapseDirection:s,collapsed:t,collapsible:e,description:h,disabled:c,heading:l,headingLevel:r,loading:d,menuOpen:b,messageOverrides:f,onCalcitePanelClose:this.handlePanelClose,onCalcitePanelScroll:this.handlePanelScroll,onCalcitePanelToggle:this.handlePanelToggle,overlayPositioning:u,ref:this.setContainerRef},this.renderBackButton(),i("slot",{key:"39b650abdf64df16f535d45f64dc1b367acfcc9e",name:"action-bar",slot:k.actionBar}),i("slot",{key:"5b36c56874ad762f842c81f9ffbdcdbd3168cf75",name:"header-actions-start",slot:k.headerActionsStart}),i("slot",{key:"2dbf552425d238a4479a12bbec79571d11124577",name:"header-actions-end",slot:k.headerActionsEnd}),i("slot",{key:"2dd0a30236844c91c2cf10a9fbacbe9935ea234c",name:"header-content",slot:k.headerContent}),i("slot",{key:"1b025f746e2e7d58fb057aab36b24e46872e607e",name:"header-menu-actions",slot:k.headerMenuActions}),i("slot",{key:"5dd5986e93dcc11e0b0fade6822814b160053c70",name:"fab",slot:k.fab}),i("slot",{key:"e7cf2702cd2e423d07a8a8ac57c142bc4738b3ef",name:"footer-actions",slot:k.footerActions}),i("slot",{key:"e2561d89aaebe4fbb82b1f546551d05ebb23b0bf",name:"footer",slot:k.footer}),i("slot",{key:"fb6bf40456038f84486b2858765bb9d147800e84"}))))}static get assetsDirs(){return["assets"]}get el(){return s(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};D.style=":host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;overflow:hidden}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);border-inline-end-width:1px}calcite-panel{--calcite-panel-footer-padding:var(--calcite-flow-item-footer-padding);--calcite-panel-header-border-block-end:var(--calcite-flow-item-header-border-block-end)}:host([hidden]){display:none}[hidden]{display:none}";const H=class{constructor(i){t(this,i),this.success=e(this,"success",7),this.fail=e(this,"fail",7),this.drawComplete=e(this,"drawComplete",7),this.editingAttachment=e(this,"editingAttachment",7),this.progressStatus=e(this,"progressStatus",7),this._isSubmitBtnClicked=!1,this.mapView=void 0,this.selectedLayerId=void 0,this.customizeSubmit=!1,this.searchConfiguration=void 0,this._editorLoading=!1,this._showSearchWidget=void 0}async mapViewWatchHandler(){await this.mapView.when((async()=>{await this.init()}))}async _editorLoadingWatchHandler(t){var i,s;t&&(null===(i=this._container)||void 0===i||i.classList.add("display-none"),await this.startCreate(),null===(s=this._container)||void 0===s||s.classList.remove("display-none"),this._editorLoading=!1)}async close(){this._editor&&this._editor.destroy()}async submit(){this._editor&&(this._isSubmitBtnClicked=!0,this._editor.viewModel.featureFormViewModel.submit())}async componentWillLoad(){await this.initModules()}async componentDidLoad(){await this.init()}render(){const t=this._showSearchWidget?"":"display-none",s=this._editorLoading?"display-none":"";return i(o,{key:"a4ccd565a52a4cde4e76439629425f19bd4c222e"},i("calcite-loader",{key:"30e8a3753985a734dd7cba461f26691b51f49ab9",class:this._editorLoading?"":"display-none",label:"",scale:"s"}),i("div",{key:"0845f1fa85a21b578fd18200b43d4a77c34e6808",class:s,id:"feature-form"}),i("div",{key:"af74b6337f5a0dcfdbd552145c88eae5282a3307",class:`search-widget ${t} ${s}`,id:"search-widget-ref"}))}async init(){this.mapView&&this.selectedLayerId&&(await this.createEditorWidget(),await this.createSearchWidget())}async initModules(){const[t,i,s]=await x(["esri/widgets/Editor","esri/core/reactiveUtils","esri/widgets/Search"]);this.Editor=t,this.reactiveUtils=i,this.Search=s}async createEditorWidget(){var t;this._editor&&this._editor.destroy();const i=[];this._container=document.createElement("div"),null===(t=this._container)||void 0===t||t.classList.add("display-none"),(await C(this.mapView)).forEach((async t=>{i.push({layer:t,enabled:"feature"===(null==t?void 0:t.type)&&(null==t?void 0:t.id)===this.selectedLayerId,addEnabled:!0,updateEnabled:!1,deleteEnabled:!1})})),this._editor=new this.Editor({allowedWorkflows:"create-features",view:this.mapView,layerInfos:i,visibleElements:{snappingControls:!1},container:this._container}),this.el.appendChild(this._container);const s=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"adding-attachment"===t||"editing-attachment"===t?(this._addingAttachment=!0,this.editingAttachment.emit(!0)):this._addingAttachment&&(this.editingAttachment.emit(!1),this._addingAttachment=!1)}));this._editor.viewModel.addHandles(s);const e=this.reactiveUtils.watch((()=>this._editor.viewModel.featureTemplatesViewModel.state),(t=>{"ready"===t&&(this.progressStatus.emit(.5),this._editorLoading=!0)}));this._editor.viewModel.addHandles(e);const a=this.reactiveUtils.watch((()=>{var t;return null===(t=this._editor.viewModel.featureFormViewModel)||void 0===t?void 0:t.state}),(t=>{"ready"===t&&(this._showSearchWidget=!1,this.progressStatus.emit(1),this.drawComplete.emit())}));this._editor.viewModel.addHandles(a);const o=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"creating-features"===t&&(this._editorLoading=!0,this._showSearchWidget=!0)}));this._editor.viewModel.addHandles(o)}async startCreate(){return new Promise(((t,i)=>{var s;if(null===(s=this._editor.viewModel.featureTemplatesViewModel.items)||void 0===s?void 0:s.length){const s=this._editor.viewModel.featureTemplatesViewModel.items[0].get("items");this._editor.viewModel.featureTemplatesViewModel.on("select",(()=>{this.progressStatus.emit(.75),setTimeout((()=>{this._editor.viewModel.featureFormViewModel.on("submit",this.submitted.bind(this)),this.hideEditorsElements().then((()=>{t({})}),(t=>i(t)))}),700)})),1===s.length&&this._editor.viewModel.featureTemplatesViewModel.select(s[0]);const e=s.length>1;this.hideEditorsElements().then((()=>{e&&t({})}),(t=>e&&i(t)))}}))}async createSearchWidget(){let t={view:this.mapView};if(this.searchConfiguration){const i=this._getSearchConfig(this.searchConfiguration,this.mapView);t=Object.assign({},i)}this._search=new this.Search(t),this._search.container="search-widget-ref",this._search.popupEnabled=!1,this._search.resultGraphicEnabled=!1;const i=await S(this.mapView,this.selectedLayerId);let s=null;this._search.on("search-complete",(t=>{var e;this.mapView.goTo(t.results[0].results[0].extent),"point"===i.geometryType&&(s=null===(e=t.results[0].results[0])||void 0===e?void 0:e.feature.geometry)}));const e=this.reactiveUtils.watch((()=>this._search.viewModel.state),(t=>{"ready"===t&&setTimeout((()=>{this._editor.viewModel.sketchViewModel.createGraphic&&s&&(this._editor.viewModel.sketchViewModel.createGraphic.set("geometry",s),this._editor.viewModel.sketchViewModel.complete(),this.hideEditorsElements())}),100)}));this._search.viewModel.addHandles(e)}_getSearchConfig(t,i){const s=t.sources;return(null==s?void 0:s.length)>0?(t.includeDefaultSources=!1,s.forEach((t=>{var s,e;if(t.hasOwnProperty("layer")){const a=t,o=null===(s=a.layer)||void 0===s?void 0:s.id,n=o?i.map.findLayerById(o):null,h=null===(e=null==a?void 0:a.layer)||void 0===e?void 0:e.url;n?a.layer=n:h&&(a.layer=new this.FeatureLayer(h))}})),null==s||s.forEach((t=>{if(t.hasOwnProperty("locator")){const i=t;"ArcGIS World Geocoding Service"===(null==i?void 0:i.name)&&(i.outFields=i.outFields||["Addr_type","Match_addr","StAddr","City"],i.singleLineFieldName="SingleLine"),i.url=i.url,delete i.url}}))):t=Object.assign(Object.assign({},t),{includeDefaultSources:!0}),t}async hideEditorsElements(){var t,i;this.customizeSubmit&&(await this.timeout(700),null===(i=null===(t=this.el.querySelector(".esri-editor"))||void 0===t?void 0:t.querySelectorAll("calcite-flow-item"))||void 0===i||i.forEach((t=>{var i,s,e,a,o;const n=null===(e=null===(s=null===(i=t.shadowRoot)||void 0===i?void 0:i.querySelector("calcite-panel"))||void 0===s?void 0:s.shadowRoot)||void 0===e?void 0:e.querySelector("article");null===(a=null==n?void 0:n.querySelector("header"))||void 0===a||a.setAttribute("style","display: none"),null===(o=null==n?void 0:n.querySelector("footer"))||void 0===o||o.setAttribute("style","display: none")})))}async submitted(t){var i;if(t.invalid.length)this._isSubmitBtnClicked=!1;else if(t.valid.length&&this._isSubmitBtnClicked){this._isSubmitBtnClicked=!1;try{await this._editor.activeWorkflow.commit(),(null===(i=this._editor.viewModel.failures)||void 0===i?void 0:i.length)&&this._editor.viewModel.failures.some((t=>{if(t.error)throw t.error}))}catch(t){return void this.fail.emit(t)}this.success.emit()}}timeout(t){return new Promise((i=>setTimeout(i,t)))}get el(){return s(this)}static get watchers(){return{mapView:["mapViewWatchHandler"],_editorLoading:["_editorLoadingWatchHandler"]}}};H.style=":host{display:block}.esri-editor__panel-toolbar{display:none !important}.esri-editor__update-actions{display:none !important}.esri-editor__panel-content{padding-block:0px !important}.esri-editor .esri-item-list__group__header{display:none !important}.esri-editor__panel-content__section .esri-widget__heading{display:none !important}.esri-editor .esri-item-list__filter-container--sticky{padding-block:0px !important;padding-inline:10px !important}.search-widget{width:92% !important;margin:5px 0 20px 14px}.display-none{display:none !important}";const O=class{constructor(i){t(this,i),this.success=e(this,"success",7),this.fail=e(this,"fail",7),this.isActionPending=e(this,"isActionPending",7),this.formReady=e(this,"formReady",7),this._isSubmitBtnClicked=!1,this.mapView=void 0,this.table=void 0,this.selectedFeature=void 0,this.customizeSubmit=!1,this._editorLoading=!1}async mapViewWatchHandler(){await this.mapView.when((async()=>{await this.init()}))}async _editorLoadingWatchHandler(t){var i,s;t&&(null===(i=this._container)||void 0===i||i.classList.add("display-none"),await this.startCreate(),null===(s=this._container)||void 0===s||s.classList.remove("display-none"),this._editorLoading=!1)}async close(){this._editor&&this._editor.destroy()}async submit(){this._editor&&(this._isSubmitBtnClicked=!0,this._editor.viewModel.featureFormViewModel.submit())}async componentWillLoad(){await this.initModules()}async init(){this.mapView&&await this.createEditorWidget()}async initModules(){const[t,i]=await x(["esri/widgets/Editor","esri/core/reactiveUtils"]);this.Editor=t,this.reactiveUtils=i}render(){return i("calcite-loader",{key:"5302b1166a175b0605604792cd40b9d3fbfabd02",class:this._editorLoading?"":"display-none",label:"",scale:"s"})}async componentDidLoad(){await this.init()}async createEditorWidget(){var t;this._editor&&this._editor.destroy(),this._container=document.createElement("div"),null===(t=this._container)||void 0===t||t.classList.add("display-none"),this._editor=new this.Editor({view:this.mapView,visibleElements:{snappingControls:!1},container:this._container}),this.el.appendChild(this._container);const i=this.reactiveUtils.watch((()=>this._editor.viewModel.featureTemplatesViewModel.state),(t=>{"ready"===t&&(this._editorLoading=!0)}));this._editor.viewModel.addHandles(i);const s=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"adding-attachment"===t||"editing-attachment"===t?(this._addingAttachment=!0,this.isActionPending.emit(!0)):this._addingAttachment&&(this.isActionPending.emit(!1),this._addingAttachment=!1)}));this._editor.viewModel.addHandles(s);const e=this.reactiveUtils.watch((()=>{var t;return null===(t=this._editor.viewModel.featureFormViewModel)||void 0===t?void 0:t.state}),(t=>{"ready"===t&&this.formReady.emit()}));this._editor.viewModel.addHandles(e)}async startCreate(){const t=this.selectedFeature.layer,i=this.table,s=t.relationships[0],e=i.relationships.find((i=>t.layerId===i.relatedTableId)),a=await t.queryFeatures({objectIds:[this.selectedFeature.getObjectId()],outFields:[t.objectIdField,s.keyField]}),o=i.templates[0],n={attributeOverrides:this.makeAttributesForRelatedFeature(a.features[0],s,e),layer:i,template:o};await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(n),await this.hideEditorsElements(),this._editor.viewModel.featureFormViewModel.on("submit",this.submitted.bind(this))}async hideEditorsElements(){var t,i;this.customizeSubmit&&(await this.timeout(700),null===(i=null===(t=this.el.querySelector(".esri-editor"))||void 0===t?void 0:t.querySelectorAll("calcite-flow-item"))||void 0===i||i.forEach((t=>{var i,s,e,a,o;const n=null===(e=null===(s=null===(i=t.shadowRoot)||void 0===i?void 0:i.querySelector("calcite-panel"))||void 0===s?void 0:s.shadowRoot)||void 0===e?void 0:e.querySelector("article");null===(a=null==n?void 0:n.querySelector("header"))||void 0===a||a.setAttribute("style","display: none"),null===(o=null==n?void 0:n.querySelector("footer"))||void 0===o||o.setAttribute("style","display: none")})))}makeAttributesForRelatedFeature(t,i,s){const e=t.getAttribute(i.keyField);let a=s.keyField;const o=this.table.fields.find((t=>t.name.toLocaleLowerCase()===a.toLocaleLowerCase()));return a=o.name,{[a]:e}}async submitted(t){var i;if(t.invalid.length)this._isSubmitBtnClicked=!1;else if(t.valid.length&&this._isSubmitBtnClicked){this._isSubmitBtnClicked=!1;try{await this._editor.activeWorkflow.commit(),(null===(i=this._editor.viewModel.failures)||void 0===i?void 0:i.length)&&this._editor.viewModel.failures.some((t=>{if(t.error)throw t.error}))}catch(t){return void this.fail.emit(t)}this.success.emit()}}timeout(t){return new Promise((i=>setTimeout(i,t)))}get el(){return s(this)}static get watchers(){return{mapView:["mapViewWatchHandler"],_editorLoading:["_editorLoadingWatchHandler"]}}};O.style=":host{display:block}.esri-editor__panel-toolbar{display:none !important}.display-none{display:none !important}";const B=class{constructor(i){t(this,i),this.loadingStatus=e(this,"loadingStatus",7),this.commentSelect=e(this,"commentSelect",7),this.featureSelectionChange=e(this,"featureSelectionChange",7),this._validFieldTypes=["small-integer","integer","big-integer","single","long"],this.mapView=void 0,this.graphics=void 0,this.reportingOptions=void 0,this.layerItemsHash=void 0,this._likeFieldAvailable=!1,this._likeCount=0,this._disLikeCount=0,this._dislikeFieldAvailable=!1,this._commentsAvailable=!1,this._isLikeBtnClicked=!1,this._isDislikeBtnClicked=!1,this._relatedFeaturesOIDs=void 0,this._updating=!1}async graphicsWatchHandler(){await this.getCompleteGraphic(this.graphics[0]),this.checkLikeDislikeFields(),await this.processComments()}async refresh(t){await this.getCompleteGraphic(t),await this.processComments(),this.isLikeDislikeConfigured(t.layer)?t&&this.graphics.length>1&&this.checkLikeDislikeFields():(this._likeFieldAvailable=!1,this._dislikeFieldAvailable=!1)}async back(){this._infoCard.back()}async next(){this._infoCard.next()}async toggleListView(){this._infoCard.toggleListView()}async componentWillLoad(){await this._initModules(),await this.getCompleteGraphic(this.graphics[0]),this.checkLikeDislikeFields(),await this.processComments()}render(){var t,s,e,a,o;const n=(null===(t=this._relatedFeaturesOIDs)||void 0===t?void 0:t.length)>0?`objectId in(${this._relatedFeaturesOIDs})`:"1=0";return i("calcite-panel",{key:"e42bbf7e4070b03c43aec1bf47c442b65cd35731","full-height":!0},i("info-card",{key:"f44099e2f8f87edbc656700e65daeb1bf934d41c",allowEditing:!1,graphics:this.graphics,highlightEnabled:!1,isLoading:!1,isMobile:!1,mapView:this.mapView,onSelectionChanged:t=>{this.featureSelectionChange.emit(t.detail)},paginationEnabled:!1,position:"relative",ref:t=>this._infoCard=t}),(this._likeFieldAvailable||this._dislikeFieldAvailable||this._commentsAvailable)&&i("div",{key:"aa65adf8d8b6a059d5e9d0e74a1896eb20c84eaf",class:"buttons-container"},this._commentsAvailable&&i("div",{key:"09dd5da4932a9a0526b413592d25469087eaf4c9",class:"comment-btn"},i("span",{key:"48f7080ace69de3589aa4f3b199eb25e53f61110"},this._relatedFeaturesOIDs.length),i("calcite-icon",{key:"f524b4d66a0a6427dda6a7a93e9dc362fe7337fc",icon:"speech-bubble",scale:"s"})),this._likeFieldAvailable&&i("calcite-button",{key:"278a685b13f7ae2a37cb649a0933006104fa7b9f",appearance:"transparent",iconEnd:"thumbs-up",kind:this._isLikeBtnClicked?"brand":"neutral",loading:this._updating,onClick:this.onLikeButtonClick.bind(this),scale:"m"},null!==(e=null!==(s=this._likeCount)&&void 0!==s?s:this._selectedGraphic.attributes[this._likeField])&&void 0!==e?e:0),this._dislikeFieldAvailable&&i("calcite-button",{key:"7010b6ef352be7c587d7ca49fe3b8411aeb163c6",appearance:"transparent",iconEnd:"thumbs-down",kind:this._isDislikeBtnClicked?"brand":"neutral",loading:this._updating,onClick:this.onDislikeButtonClick.bind(this),scale:"m"},null!==(o=null!==(a=this._disLikeCount)&&void 0!==a?a:this._selectedGraphic.attributes[this._dislikeField])&&void 0!==o?o:0)),this.relatedTableId&&this._commentsAvailable&&i("feature-list",{key:"526614c384fa627057a18528c1bd4aaf2b9c70d8",class:"height-full",mapView:this.mapView,onFeatureSelect:t=>{this.commentSelect.emit(t.detail)},pageSize:5,ref:t=>this._commentsList=t,selectedLayerId:this.relatedTableId,showErrorWhenNoFeatures:!1,showInitialLoading:!1,textSize:"small",whereClause:n}))}async _initModules(){const[t,i]=await x(["esri/rest/support/RelationshipQuery","esri/Graphic"]);this.RelationshipQuery=t,this.Graphic=i}async getCompleteGraphic(t){const i=t.layer,s=i.createQuery();s.objectIds=[t.getObjectId()];const e=await i.queryFeatures(s);this._selectedGraphic=e.features[0]}async processComments(){var t;const i=this._selectedGraphic.layer;if(this.reportingOptions&&this.reportingOptions[i.id]&&this.reportingOptions[i.id].comment&&(null===(t=i.relationships)||void 0===t?void 0:t.length)>0){const t=i.relationships[0].relatedTableId,s=(await j(this.mapView)).filter((i=>t===i.layerId));if(this.relatedTableId=(null==s?void 0:s.length)>0?s[0].id:"",this.relatedTableId){const t=this._selectedGraphic.attributes[i.objectIdField],s=new this.RelationshipQuery({objectIds:[t],outFields:["*"],relationshipId:i.relationships[0].id}),e=await i.queryRelatedFeatures(s).catch((t=>{console.error(t)})),a=[];e[t]&&e[t].features.forEach((t=>{a.push(t.attributes.OBJECTID)})),this._relatedFeaturesOIDs=a,this._commentsAvailable=!0}else this._relatedFeaturesOIDs=[],this._commentsAvailable=!1}else this._relatedFeaturesOIDs=[],this._commentsAvailable=!1,this.relatedTableId=""}isLikeDislikeConfigured(t){let i=!1,s=!1;if(this.reportingOptions&&this.reportingOptions[t.id]){if(!this.reportingOptions[t.id].like&&!this.reportingOptions[t.id].dislike)return!1;const e=this.reportingOptions[t.id].likeField,a=this.reportingOptions[t.id].dislikeField;if(!e&&!a)return!1;t.fields.forEach((o=>{this._validFieldTypes.indexOf(o.type)>-1&&this.layerItemsHash[t.id].supportsUpdate&&(o.name===e&&this.reportingOptions[t.id].like?i=!0:o.name===a&&this.reportingOptions[t.id].dislike&&(s=!0))}))}return i||s}checkLikeDislikeFields(){this._likeFieldAvailable=!1,this._dislikeFieldAvailable=!1,this._isLikeBtnClicked=!1,this._isDislikeBtnClicked=!1,this._likeCount=0,this._disLikeCount=0;const t=this._selectedGraphic.layer;if(this.reportingOptions&&this.reportingOptions[t.id]){if(this._likeField=this.reportingOptions[t.id].likeField,this._dislikeField=this.reportingOptions[t.id].dislikeField,!this._likeField&&!this._dislikeField)return;t.fields.forEach((i=>{this._validFieldTypes.indexOf(i.type)>-1&&this.layerItemsHash[t.id].supportsUpdate&&(i.name===this._likeField&&this.reportingOptions[t.id].like?(this._likeFieldAvailable=!0,this._likeCount=this._selectedGraphic.attributes[i.name]):i.name===this._dislikeField&&this.reportingOptions[t.id].dislike&&(this._dislikeFieldAvailable=!0,this._disLikeCount=this._selectedGraphic.attributes[i.name]))})),this.getFromLocalStorage()}}onLikeButtonClick(){this._isDislikeBtnClicked&&this.reportingOptions[this._selectedGraphic.layer.id].dislike&&this.onDislikeButtonClick(),this._isLikeBtnClicked=!this._isLikeBtnClicked,this._isLikeBtnClicked?this._likeCount++:this._likeCount--,this.updateFeaturesLikeDislikeField(this._likeField,this._isLikeBtnClicked)}onDislikeButtonClick(){this._isLikeBtnClicked&&this.reportingOptions[this._selectedGraphic.layer.id].like&&this.onLikeButtonClick(),this._isDislikeBtnClicked=!this._isDislikeBtnClicked,this._isDislikeBtnClicked?this._disLikeCount++:this._disLikeCount--,this.updateFeaturesLikeDislikeField(this._dislikeField,this._isDislikeBtnClicked)}async updateFeaturesLikeDislikeField(t,i){const s={},e=this._selectedGraphic.layer;this._updating=!0;const a=this._selectedGraphic;a.attributes[t]=i?Number(a.attributes[t])+1:Number(a.attributes[t])-1,s[e.objectIdField]=a.attributes[e.objectIdField],s[t]=a.attributes[t];const o=new this.Graphic;o.attributes=s;const n={updateFeatures:[o]};await e.applyEdits(n).then((()=>{this._selectedGraphic=a,this.setInLocalStorage(),this._updating=!1}),(t=>{this._updating=!1,console.log(t)}))}getFromLocalStorage(){const t=localStorage[this._selectedGraphic.layer.id];if(t){const i=JSON.parse(t).filter((t=>t.id===this._selectedGraphic.getObjectId()));i.length>0&&(this._isLikeBtnClicked=i[0].like,this._isDislikeBtnClicked=i[0].dislike)}}setInLocalStorage(){const t=this._selectedGraphic.layer.id,i=localStorage[t];let s=[];if(i){s=JSON.parse(i);const t=s.findIndex((t=>t.id===this._selectedGraphic.getObjectId()));t>=0&&s.splice(t,1)}s.push({id:this._selectedGraphic.getObjectId(),like:this._isLikeBtnClicked&&0!==this._likeCount,dislike:this._isDislikeBtnClicked&&0!==this._disLikeCount}),localStorage.setItem(t,JSON.stringify(s))}get el(){return s(this)}static get watchers(){return{graphics:["graphicsWatchHandler"]}}};B.style=":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 P=class{constructor(i){t(this,i),this.layerSelect=e(this,"layerSelect",7),this.layersListLoaded=e(this,"layersListLoaded",7),this.mapView=void 0,this.layers=void 0,this.showFeatureCount=!0,this.showNextIcon=!1,this._noLayersToDisplay=!1,this._mapLayerIds=[],this._isLoading=!1,this._translations=void 0}async refresh(){await this.setLayers()}async componentWillLoad(){await this._getTranslations(),this._isLoading=!0}async componentDidLoad(){await this.setLayers(),this._isLoading=!1}render(){return i(o,{key:"9366302a704c1dbdd7a65aef5c43d0ad84a44b23"},this._isLoading&&i("calcite-loader",{key:"69974a23fd42bc37ef13816efbe6d06e28cb2749",label:"",scale:"m"}),!this._isLoading&&this.mapView&&this._noLayersToDisplay&&i("calcite-notice",{key:"a93abb55b4db09727b3634cb1935e482c377d662",class:"error-msg",icon:"layers-reference",kind:"danger",open:!0},i("div",{key:"b9046685353b8894e6c6094cff47fab7a8e07ffa",slot:"title"},this._translations.error),i("div",{key:"90a052e1d80779a09a32fdd35563a1ce21d582e0",slot:"message"},this._translations.noLayerToDisplayErrorMsg)),!this._isLoading&&this.mapView&&i("calcite-list",{key:"709c1b8edd5710a2476ecef638199c2f929b4165","selection-appearance":"border","selection-mode":"none"},this.renderLayerList()))}async setLayers(){this.mapView&&await this.initLayerHash()}async initLayerHash(){const t=[];this._layerItemsHash=await W(this.mapView,!0),(await C(this.mapView)).forEach((async i=>{if("feature"===(null==i?void 0:i.type)&&this.showFeatureCount){const s=i.createQuery(),e=i.queryFeatureCount(s);t.push(e),e.then((async t=>{const s=isNaN(t)?"":await L(t,{places:0,api:4,type:"decimal"});this._layerItemsHash[i.id].formattedFeatureCount=s}))}})),await Promise.all(t).then((()=>{const t=this.getLayersToBeShownInList(this._layerItemsHash);this._mapLayerIds=t.reverse(),this.handleNoLayersToDisplay()}),(()=>{this._mapLayerIds=[],this.handleNoLayersToDisplay()}))}handleNoLayersToDisplay(){this._noLayersToDisplay=!(this._mapLayerIds.length>0),this.layersListLoaded.emit(this._mapLayerIds)}getLayersToBeShownInList(t){var i;const s=(null===(i=this.layers)||void 0===i?void 0:i.length)>0?this.layers:[];return Object.keys(t).reduce(((t,i)=>(s.indexOf(i)>-1&&t.push(i),t)),[])}renderLayerList(){return this._mapLayerIds.length>0&&this._mapLayerIds.reduce(((t,i)=>(this._layerItemsHash[i]&&t.push(this.getLayerListItem(i)),t)),[])}getLayerListItem(t){const s=this._layerItemsHash[t].formattedFeatureCount;return i("calcite-list-item",{onCalciteListItemSelect:()=>{this.onLayerItemSelected(t)}},i("div",{class:"layer-name",slot:"content-start"},this._layerItemsHash[t].name),this.showFeatureCount&&void 0!==s&&""!==s&&i("div",{class:this.showNextIcon?"":"feature-count",slot:"content-end"},"("+s+")"),this.showNextIcon&&i("calcite-icon",{flipRtl:!0,icon:"chevron-right",scale:"s",slot:"content-end"}))}onLayerItemSelected(t){this.layerSelect.emit({layerId:t,layerName:this._layerItemsHash[t].name})}async _getTranslations(){const t=await _(this.el);this._translations=t[0]}get el(){return s(this)}};P.style=":host{display:block}.error-msg{padding:10px}.layer-name{font-weight:500;padding:10px 12px}.feature-count{padding-right:12px}";export{z as calcite_flow,D as calcite_flow_item,H as create_feature,O as create_related_feature,B as feature_details,P as layer_list}
@@ -0,0 +1,6 @@
1
+ /*!
2
+ * Copyright 2022 Esri
3
+ * Licensed under the Apache License, Version 2.0
4
+ * http://www.apache.org/licenses/LICENSE-2.0
5
+ */
6
+ import{r as t,c as i,h as s,H as e,F as a,g as h}from"./p-6d753a3d.js";import{l as o,g as l}from"./p-896c9644.js";import{g as c,a as n,b as r,c as d,h as u,d as p,q as f}from"./p-5aaa05ef.js";import"./p-82e085d0.js";import"./p-c1cf3ebc.js";const m=class{constructor(s){t(this,s),this.togglePanel=i(this,"togglePanel",7),this.center=void 0,this.defaultWebmap="",this.description=void 0,this.enableAnonymousAccess=void 0,this.enableAnonymousComments=void 0,this.enableComments=void 0,this.enableHome=!0,this.enableLogin=void 0,this.enableNewReports=void 0,this.enableSearch=!0,this.enableZoom=!0,this.isMobile=void 0,this.layerExpressions=[],this.layerId=void 0,this.level=void 0,this.loginTitle=void 0,this.mapInfos=[],this.mapView=void 0,this.objectId=void 0,this.reportButtonText=void 0,this.reportingOptions=void 0,this.reportsHeader=void 0,this.reportSubmittedMessage=void 0,this.searchConfiguration=void 0,this.showComments=void 0,this.theme="light",this.zoomToScale=void 0,this._featureCreationFailedErrorMsg=void 0,this._filterActive=!1,this._filterOpen=!1,this._flowItems=[],this._hasValidLayers=!1,this._loadingFeatureDetails=void 0,this._mapInfo=void 0,this._reportSubmitted=!1,this._selectedLayerName=void 0,this._showSubmitCancelButton=!1,this._showLoadingIndicator=!1,this._sidePanelCollapsed=!1,this._translations=void 0,this._updatedProgressBarStatus=.25,this._updatedSorting=void 0,this._updatedSortOption="sortNewest",this._commentSubmitted=!1,this._addingCommentFailed=!1}async isMobileWatchHandler(){this._sidePanelCollapsed=!1}async mapViewWatchHandler(){await this.mapView.when((async()=>{await this.setMapView()}))}async componentWillLoad(){var t;this._urlParamsLoaded=!1,await this._initModules(),await this._getTranslations(),await(null===(t=this.mapView)||void 0===t?void 0:t.when((async()=>{this._layers=this.reportingOptions?Object.keys(this.reportingOptions).filter((t=>this.reportingOptions[t].visible)):[],await this.setMapView()})))}render(){const t="dark"===this.theme?"calcite-mode-dark":"calcite-mode-light";return s(e,{key:"e512e2693a586f8a6da7bcfa171feb60da26aee3"},this._reportSubmitted&&s("calcite-alert",{key:"e5805ba948f1dc43eba2a78716af452cf71a8222","auto-close":!0,class:t+" report-submitted-msg",icon:"check-circle",kind:"success",label:"",onCalciteAlertClose:()=>{this._reportSubmitted=!1},open:!0,placement:"top"},s("div",{key:"95b9accf1f09186c09c81cfb02a8939c4869ae8d",slot:"message"},this.reportSubmittedMessage?this.reportSubmittedMessage:this._translations.submitMsg)),this._featureCreationFailedErrorMsg&&s("calcite-alert",{key:"cab7f0e0f0d882612b4fa6f00799be9870aea6c5","auto-close":!0,class:t,icon:"x-octagon",kind:"danger",label:"",onCalciteAlertClose:()=>{this._featureCreationFailedErrorMsg=""},open:!0,placement:"top"},s("div",{key:"b9453672d85e26cf7bdeae0923cd36020d259d49",slot:"title"},this._translations.error),s("div",{key:"5084315857bc88b8f80aaa411ac3fd5e4493e918",slot:"message"},this._featureCreationFailedErrorMsg)),this._commentSubmitted&&s("calcite-alert",{key:"62b7d9818913c3331ca9c8e4ed23c7f0c48a7946","auto-close":!0,class:"report-submitted "+t,icon:"check-circle",kind:"success",label:"",onCalciteAlertClose:()=>{this._commentSubmitted=!1},open:!0,placement:"top"},s("div",{key:"5f18444fd375657db0c2a403cb453ead75536181",slot:"message"},this._translations.commentSubmittedMsg)),this._addingCommentFailed&&s("calcite-alert",{key:"732f08960095fc9fefcc79fc8df387a5a4c3f781","auto-close":!0,class:t,icon:"x-octagon",kind:"danger",label:"",onCalciteAlertClose:()=>{this._addingCommentFailed=!1},open:!0,placement:"top"},s("div",{key:"16415430cf33ce53c0d49cab19dce2c3e34257d6",slot:"title"},this._translations.error),s("div",{key:"83e5918e00902bd49512165f4aa62813cecb4619",slot:"message"},this._translations.addingCommentFailedMsg)),s("div",{key:"3e9dadd880319708e64e717ba7e7adaddf97b935"},s("calcite-shell",{key:"c72664d361b3904bc191668207c3ad31ff1f98c9","content-behind":!0},this._getReporter())),this.filterModal())}async _initModules(){const[t]=await o(["esri/core/reactiveUtils"]);this.reactiveUtils=t}async setSelectedLayer(t,i){this._selectedLayerId=t,this._selectedLayer=await c(this.mapView,t),this._selectedLayerName=i,this._validLayers.forEach((i=>{i.set("visible",!t||i.id===t)}))}_getLayersConfig(t){return this.reportingOptions&&this.reportingOptions[t]?this.reportingOptions[t]:null}_getReporter(){const t=[];return this._flowItems.forEach((i=>{switch(i){case"layer-list":t.push(this.getLayerListFlowItem());break;case"feature-list":t.push(this.getFeatureListFlowItem(this._selectedLayerId,this._selectedLayerName));break;case"feature-details":t.push(this.getFeatureDetailsFlowItem());break;case"reporting-layer-list":t.push(this.getChooseCategoryFlowItem());break;case"feature-create":t.push(this.getFeatureCreateFlowItem());break;case"comment-details":t.push(this.getCommentDetailsFlowItem());break;case"add-comment":t.push(this.getAddCommentFlowItem())}})),s("calcite-panel",{class:"width-full "+("dark"===this.theme?"calcite-mode-dark":"calcite-mode-light")},this.mapView?s("calcite-flow",null,(null==t?void 0:t.length)>0&&t):s("calcite-loader",{label:"",scale:"m"}))}filterModal(){var t,i;const e=this.layerExpressions?this.layerExpressions.filter((t=>t.id===this._selectedLayerId)):[];return e.length>0&&s("calcite-modal",{"aria-labelledby":"modal-title",class:"modal",kind:"brand",onCalciteModalClose:()=>{this._closeFilter()},open:this._filterOpen,widthScale:"s"},s("div",{class:"display-flex align-center",id:"modal-title",slot:"header"},null===(i=null===(t=this._translations)||void 0===t?void 0:t.filterLayerTitle)||void 0===i?void 0:i.replace("{{title}}",this._selectedLayerName)),s("div",{slot:"content"},s("instant-apps-filter-list",{autoUpdateUrl:!1,closeBtn:!0,closeBtnOnClick:()=>{this._closeFilter()},comboboxOverlayPositioning:"fixed",layerExpressions:e,onFilterListReset:()=>this._handleFilterListReset(),onFilterUpdate:()=>this._handleFilterUpdate(),ref:t=>this._filterList=t,view:this.mapView,zoomBtn:!1})))}_closeFilter(){this._filterOpen&&(this._filterOpen=!1)}_toggleFilter(){this._filterOpen=!this._filterOpen}async sortOptionClick(t,i,s){this._updatedSorting={field:t,order:i},this._updatedSortOption=s}_toggleSort(){const t=this.reportingOptions&&this.reportingOptions[this._selectedLayerId]&&this.reportingOptions[this._selectedLayerId].like&&this.reportingOptions[this._selectedLayerId].likeField;return s("calcite-popover",{autoClose:!0,label:"",offsetDistance:0,placement:this.isMobile?"leading-start":"auto",pointerDisabled:!0,referenceElement:"sort-popover"},s("calcite-list",{"selection-mode":"single"},s("calcite-list-item",{label:this._translations.sortNewest,onCalciteListItemSelect:()=>{this.sortOptionClick(this._selectedLayer.objectIdField,"desc","sortNewest")},selected:"sortNewest"===this._updatedSortOption,value:"sortNewest"}),s("calcite-list-item",{label:this._translations.sortOldest,onCalciteListItemSelect:()=>{this.sortOptionClick(this._selectedLayer.objectIdField,"asc","sortOldest")},selected:"sortOldest"===this._updatedSortOption,value:"sortOldest"}),t&&s(a,null,s("calcite-list-item",{label:this._translations.sortHighestVoted,onCalciteListItemSelect:()=>{this.sortOptionClick(this.reportingOptions[this._selectedLayerId].likeField,"desc","sortHighestVoted")},selected:"sortHighestVoted"===this._updatedSortOption,value:"sortHighestVoted"}),s("calcite-list-item",{label:this._translations.sortLowestVoted,onCalciteListItemSelect:()=>{this.sortOptionClick(this.reportingOptions[this._selectedLayerId].likeField,"asc","sortLowestVoted")},selected:"sortLowestVoted"===this._updatedSortOption,value:"sortLowestVoted"}))))}_handleFilterListReset(){this._filterActive=!1,this._featureList.refresh()}_handleFilterUpdate(){this._filterActive=this._filterList.urlParams.getAll("filter").length>0,this._featureList.refresh()}getLayerListFlowItem(){var t;return s("calcite-flow-item",{collapsed:this.isMobile&&this._sidePanelCollapsed,heading:this.reportsHeader},this.isMobile&&this.getActionToExpandCollapsePanel(),this._hasValidLayers&&this.enableNewReports&&s("calcite-button",{appearance:"solid",onClick:this.navigateToChooseCategory.bind(this),slot:"footer",width:"full"},this.reportButtonText?this.reportButtonText:this._translations.createReportButtonText),s("calcite-panel",{"full-height":!0,"full-width":!0},s("layer-list",{class:"height-full",layers:(null===(t=this._editableLayerIds)||void 0===t?void 0:t.length)>0?this._editableLayerIds:this._layers,mapView:this.mapView,onLayerSelect:this.displayFeaturesList.bind(this),onLayersListLoaded:this.layerListLoaded.bind(this),ref:t=>this._layerList=t,showFeatureCount:!0,showNextIcon:!0})))}getChooseCategoryFlowItem(){const t=this.reportingOptions?Object.keys(this.reportingOptions).filter((t=>this.reportingOptions[t].visible&&this.reportingOptions[t].reporting&&this._layerItemsHash[t]&&this._layerItemsHash[t].supportsAdd)):[];return s("calcite-flow-item",{collapsed:this.isMobile&&this._sidePanelCollapsed,heading:this.reportButtonText?this.reportButtonText:this._translations.createReportButtonText,onCalciteFlowItemBack:this.backFromSelectedPanel.bind(this)},this.isMobile&&this.getActionToExpandCollapsePanel(),s("calcite-panel",{"full-height":!0,"full-width":!0},s("div",{class:"progress-bar"},s("calcite-progress",{type:"determinate",value:this._updatedProgressBarStatus})),s("calcite-notice",{class:"notice-msg",icon:"lightbulb",kind:"success",open:!0},s("div",{slot:"message"},this._translations.chooseCategoryMsg)),s("layer-list",{class:"height-full",layers:t,mapView:this.mapView,onLayerSelect:this.navigateToCreateFeature.bind(this),showFeatureCount:!1,showNextIcon:!1})))}getFeatureCreateFlowItem(){return s("calcite-flow-item",{collapsed:this.isMobile&&this._sidePanelCollapsed,heading:this._selectedLayerName,onCalciteFlowItemBack:this.backFromCreateFeaturePanel.bind(this)},this.isMobile&&this.getActionToExpandCollapsePanel(),this._showSubmitCancelButton&&s("div",{class:"width-full",slot:"footer"},s("calcite-button",{appearance:"solid",class:"footer-top-button footer-button",onClick:this.onCreateFeatureSubmitButtonClick.bind(this),width:"full"},this._translations.submit),s("calcite-button",{appearance:"outline",class:"footer-button",onClick:this.backFromCreateFeaturePanel.bind(this),width:"full"},this._translations.cancel)),s("calcite-panel",{"full-height":!0,"full-width":!0},s("div",{class:"progress-bar"},s("calcite-progress",{type:"determinate",value:this._updatedProgressBarStatus})),s("calcite-notice",{class:"notice-msg",icon:"lightbulb",kind:"success",open:!0},s("div",{slot:"message"},this._translations.featureEditFormInfoMsg)),s("create-feature",{customizeSubmit:!0,mapView:this.mapView,onDrawComplete:this.onFormReady.bind(this),onEditingAttachment:this.showSubmitCancelButton.bind(this),onFail:this.createFeatureFailed.bind(this),onProgressStatus:this.updatedProgressStatus.bind(this),onSuccess:this.onReportSubmitted.bind(this),ref:t=>this._createFeature=t,searchConfiguration:this.searchConfiguration,selectedLayerId:this._selectedLayerId})))}updatedProgressStatus(t){this._updatedProgressBarStatus=t.detail}onFormReady(){this.updateFormState(!0),this._showSubmitCancelButton=!0}showSubmitCancelButton(t){this._showSubmitCancelButton=!t.detail}onCreateFeatureSubmitButtonClick(){this._createFeature&&this._createFeature.submit()}backFromCreateFeaturePanel(){this._createFeature&&this._createFeature.close(),this.isFormOpen&&this.updateFormState(!1),this.backFromSelectedPanel()}onCreateRelatedFeatureSubmitButtonClick(){this._createRelatedFeature&&this._createRelatedFeature.submit()}backFromCreateRelatedFeaturePanel(){this._createRelatedFeature&&(this._createRelatedFeature.close(),this._showSubmitCancelButton=!1),this.isFormOpen&&this.updateFormState(!1),this.backFromSelectedPanel()}createFeatureFailed(t){console.error(t.detail),this._featureCreationFailedErrorMsg=t.detail.message}onReportSubmitted(){this.isFormOpen&&this.updateFormState(!1),this._reportSubmitted=!0,this.navigateToHomePage()}addCommentFailed(t){console.error(t.detail),this._addingCommentFailed=!0}async onCommentSubmitted(){this._commentSubmitted=!0,this.backFromSelectedPanel(),this._showLoadingIndicator=!0,await this._featureDetails.refresh(this._currentFeature),setTimeout((()=>{this._showLoadingIndicator=!1}),300)}async navigateToHomePage(){this._createFeature&&this._createFeature.close(),this._layerList&&this._layerList.refresh(),await this.setSelectedFeatures([]),1===this._editableLayerIds.length?(await this._featureList.refresh(),this._flowItems=["feature-list"]):this._flowItems=["layer-list"]}async navigateToCreateFeature(t){t.detail.layerId&&t.detail.layerName&&this.setSelectedLayer(t.detail.layerId,t.detail.layerName),this._showSubmitCancelButton=!1,this._flowItems=[...this._flowItems,"feature-create"]}navigateToChooseCategory(){this._flowItems=[...this._flowItems,"reporting-layer-list"]}async layerListLoaded(t){const i=t.detail,s=await n(this.mapView),e=[];this._validLayers=[],s.forEach((t=>{var s;i.includes(t.id)&&(this._validLayers.push(t),(null===(s=this._getLayersConfig(t.id))||void 0===s?void 0:s.reporting)&&this._layerItemsHash[t.id]&&this._layerItemsHash[t.id].supportsAdd&&e.push(t.id))})),this.handleMapClick(),this._hasValidLayers=e.length>0,this._urlParamsLoaded||(this._urlParamsLoaded=!0,await this.loadFeatureFromURLParams())}displayFeaturesList(t){this._updatedSorting={field:"",order:"desc"},this._filterActive=!1,this._updatedSortOption="sortNewest",this.setSelectedLayer(t.detail.layerId,t.detail.layerName),this._flowItems=[...this._flowItems,"feature-list"]}backFromSelectedPanel(){this._updatedProgressBarStatus=.25;const t=[...this._flowItems];"comment-details"!==t[t.length-1]&&"add-comment"!==t[t.length-1]&&this.clearHighlights(),t.pop(),1!==t.length||"layer-list"!==t[0]?this._flowItems=[...t]:this.navigateToHomePage()}toggleSidePanel(){this._sidePanelCollapsed=!this._sidePanelCollapsed,this.togglePanel.emit({panelState:this._sidePanelCollapsed,isFormOpen:this.isFormOpen})}updateFormState(t){this.isFormOpen=t,this.togglePanel.emit({panelState:this._sidePanelCollapsed,isFormOpen:this.isFormOpen})}async onFeatureSelectFromList(t){this._showLoadingIndicator=!0,await this.setSelectedFeatures([t.detail]),this._flowItems=[...this._flowItems,"feature-details"]}async getRelatedTable(){const t=this._currentFeature.layer.relationships[0].relatedTableId,i=(await r(this.mapView)).filter((i=>t===i.layerId));this._relatedTable=i[0]}async updatingFeatureDetails(t){this._showLoadingIndicator=t}async selectionChanged(t){this.updatingFeatureDetails(!0),await this.setCurrentFeature(t.detail.selectedFeature[0]),this.highlightOnMap(t.detail.selectedFeature[0]),this._selectedFeatureIndex=t.detail.selectedFeatureIndex,await this._featureDetails.refresh(t.detail.selectedFeature[0])}async onCommentSelectFromList(t){this._selectedRelatedFeature=[t.detail],this._flowItems=[...this._flowItems,"comment-details"]}getFeatureListFlowItem(t,i){var e,a;const h=null===(e=this.layerExpressions)||void 0===e?void 0:e.filter((t=>t.id===this._selectedLayerId)),o=(null===(a=this._getLayersConfig(this._selectedLayerId))||void 0===a?void 0:a.reporting)&&this._layerItemsHash[this._selectedLayerId].supportsAdd,l=(null==h?void 0:h.length)>0;return s("calcite-flow-item",{collapsed:this.isMobile&&this._sidePanelCollapsed,heading:i,loading:this._showLoadingIndicator,onCalciteFlowItemBack:this.backFromSelectedPanel.bind(this)},this._toggleSort(),s("calcite-action",{icon:"sort-ascending-arrow",id:"sort-popover",slot:"header-actions-end",text:this._translations.sort,title:this._translations.sort}),l&&s("calcite-action",{icon:"filter",indicator:this._filterActive,onClick:this._toggleFilter.bind(this),slot:"header-actions-end",text:this._translations.filter,title:this._translations.filter}),this.isMobile&&this.getActionToExpandCollapsePanel(),this.enableNewReports&&o&&s("calcite-button",{appearance:"solid",onClick:this.navigateToCreateFeature.bind(this),slot:"footer",width:"full"},this.reportButtonText?this.reportButtonText:this._translations.createReportButtonText),s("calcite-panel",{"full-height":!0},s("feature-list",{class:"height-full",highlightOnHover:!0,mapView:this.mapView,noFeaturesFoundMsg:this._translations.featureErrorMsg,onFeatureSelect:this.onFeatureSelectFromList.bind(this),pageSize:30,ref:t=>this._featureList=t,selectedLayerId:t,sortingInfo:this._updatedSorting})))}getFeatureDetailsFlowItem(){var t;const i=(null===(t=this._getLayersConfig(this._selectedLayerId))||void 0===t?void 0:t.comment)&&this._selectedLayer.relationships.length>0;return s("calcite-flow-item",{collapsed:this.isMobile&&this._sidePanelCollapsed,heading:this._selectedLayerName,loading:this._showLoadingIndicator,onCalciteFlowItemBack:this.backFromSelectedPanel.bind(this)},this.isMobile&&this.getActionToExpandCollapsePanel(),s("instant-apps-social-share",{autoUpdateShareUrl:!1,class:"share-node",embed:!1,popoverButtonIconScale:"s",ref:t=>this._shareNode=t,removePopoverOffset:!0,scale:"m",shareButtonColor:"neutral",shareButtonType:"action",slot:"header-actions-end",socialMedia:!0,view:this.mapView}),this._selectedFeature.length>1&&this.getFeaturesPagination(),s("calcite-panel",null,s("feature-details",{class:"full-height",graphics:this._selectedFeature,layerItemsHash:this._layerItemsHash,mapView:this.mapView,onCommentSelect:this.onCommentSelectFromList.bind(this),onFeatureSelectionChange:this.selectionChanged.bind(this),onLoadingStatus:t=>{this.updatingFeatureDetails(t.detail)},ref:t=>this._featureDetails=t,reportingOptions:this.reportingOptions}),i&&s("calcite-button",{appearance:"solid",onClick:()=>this._flowItems=[...this._flowItems,"add-comment"],slot:"footer",width:"full"},this._translations.comment)))}getFeaturesPagination(){return s("div",{class:"feature-pagination"},s("div",null,s("calcite-button",{appearance:"transparent",disabled:!1,iconStart:"chevron-left",id:"solutions-back",onClick:()=>{this._featureDetails.back()},scale:"s",width:"full"}),s("calcite-tooltip",{label:"",placement:"top","reference-element":"solutions-back"},s("span",null,this._translations.back))),s("calcite-button",{appearance:"transparent",onClick:()=>{this._featureDetails.toggleListView()},scale:"s"},s("span",{class:"pagination-count"},this._getCount())),s("div",null,s("calcite-button",{appearance:"transparent",disabled:!1,iconStart:"chevron-right",id:"solutions-next",onClick:()=>{this._featureDetails.next()},scale:"s",width:"full"}),s("calcite-tooltip",{placement:"top","reference-element":"solutions-next"},s("span",null,this._translations.next))))}getCommentDetailsFlowItem(){return s("calcite-flow-item",{collapsed:this.isMobile&&this._sidePanelCollapsed,heading:this._relatedTable.title,onCalciteFlowItemBack:this.backFromSelectedPanel.bind(this)},this.isMobile&&this.getActionToExpandCollapsePanel(),s("calcite-panel",{"full-height":!0},s("info-card",{allowEditing:!1,graphics:this._selectedRelatedFeature,highlightEnabled:!1,isLoading:!1,isMobile:!1,mapView:this.mapView,paginationEnabled:!1})))}getAddCommentFlowItem(){return s("calcite-flow-item",{collapsed:this.isMobile&&this._sidePanelCollapsed,heading:this._relatedTable.title,onCalciteFlowItemBack:this.backFromCreateRelatedFeaturePanel.bind(this)},this.isMobile&&this.getActionToExpandCollapsePanel(),s("div",{class:"width-full",slot:"footer"},this._showSubmitCancelButton&&s("div",{class:"width-full",slot:"footer"},s("calcite-button",{appearance:"solid",class:"footer-top-button footer-button",onClick:this.onCreateRelatedFeatureSubmitButtonClick.bind(this),width:"full"},this._translations.submit),s("calcite-button",{appearance:"outline",class:"footer-button",onClick:this.backFromCreateRelatedFeaturePanel.bind(this),width:"full"},this._translations.cancel))),s("calcite-panel",null,s("create-related-feature",{customizeSubmit:!0,mapView:this.mapView,onFail:this.addCommentFailed.bind(this),onFormReady:this.onFormReady.bind(this),onIsActionPending:this.showSubmitCancelButton.bind(this),onSuccess:this.onCommentSubmitted.bind(this),ref:t=>this._createRelatedFeature=t,selectedFeature:this._currentFeature,table:this._relatedTable})))}async setSelectedFeatures(t){this._selectedFeature=t,await this.setCurrentFeature(this._selectedFeature.length?this._selectedFeature[0]:null)}async setCurrentFeature(t){var i;if(this._currentFeature=t,t&&t.layer){const s=t.layer;this.setSelectedLayer(s.id,s.title),this._currentFeatureId=t.attributes[s.objectIdField],(null===(i=this._getLayersConfig(s.id))||void 0===i?void 0:i.comment)&&s.relationships.length>0&&await this.getRelatedTable()}else this._editableLayerIds.length>1&&this.setSelectedLayer("",""),this._currentFeatureId="";this._updateShareURL()}async highlightOnMap(t){if(this.clearHighlights(),t&&t.geometry&&t.layer){const i=await d(this.mapView,t.layer.id);i.highlightOptions=null,this._highlightHandle=await u([t.getObjectId()],i,this.mapView,!0,this.zoomToScale)}this.updatingFeatureDetails(!1)}clearHighlights(){this._highlightHandle&&this._highlightHandle.remove()}getActionToExpandCollapsePanel(){return s("calcite-action",{icon:this._sidePanelCollapsed?"chevrons-up":"chevrons-down",onClick:this.toggleSidePanel.bind(this),slot:"header-actions-end",text:this._sidePanelCollapsed?this._translations.expand:this._translations.collapse})}async setMapView(){var t;await this.getLayersToShowInList(),1===(null===(t=this._editableLayerIds)||void 0===t?void 0:t.length)?await this.renderFeaturesList():this._flowItems=["layer-list"],this.mapView.popupEnabled=!1,this._defaultCenter&&this._defaultLevel&&(await this.mapView.goTo({center:this._defaultCenter,zoom:this._defaultLevel}),this._defaultCenter=void 0,this._defaultLevel=void 0)}handleMapClick(){this._mapClickHandle&&this._mapClickHandle.remove(),this._mapClickHandle=this.reactiveUtils.on((()=>this.mapView),"click",this.onMapClick.bind(this))}async onMapClick(t){this.mapView.popupEnabled=!1;const i=await this.mapView.hitTest(t);if(i.results.length>0){const t=[];i.results.forEach((function(i){"graphic"===i.type&&t.push(i.graphic)}));const s=t.filter((t=>this._validLayers.includes(t.layer))),e=t.filter((t=>{var i;return!this._validLayers.includes(t.layer)&&(null===(i=null==t?void 0:t.layer)||void 0===i?void 0:i.id)}));if(s.length>0&&(await this.setSelectedFeatures(s),this._flowItems.length&&this._flowItems.includes("feature-details")?(this._flowItems=[...this._flowItems.slice(0,this._flowItems.indexOf("feature-details")+1)],await this.highlightOnMap(t[0])):this._flowItems=[...this._flowItems,"feature-details"]),e.length>0){this.mapView.popupEnabled=!0;const t={features:e,updateLocationEnabled:!0};await this.mapView.openPopup(t)}}}_getCount(){const t=(this._selectedFeatureIndex+1).toString(),i=this._selectedFeature.length.toString();return this._translations.indexOfTotal.replace("{{index}}",t).replace("{{total}}",i)}async _getTranslations(){const t=await l(this.el);this._translations=t[0]}reduceToConfiguredLayers(t){return Object.keys(t).reduce(((i,s)=>{var e;return(this.reportingOptions?null===(e=this._getLayersConfig(s))||void 0===e?void 0:e.visible:t[s].supportsAdd)&&i.push(s),i}),[])}async getLayersToShowInList(){const t=await p(this.mapView,!0);(await n(this.mapView)).forEach((i=>{var s,e;"feature"===(null==i?void 0:i.type)&&(null==i?void 0:i.editingEnabled)&&(null===(e=null===(s=null==i?void 0:i.capabilities)||void 0===s?void 0:s.operations)||void 0===e?void 0:e.supportsAdd)&&(t[i.id].supportsAdd=!0)})),this._editableLayerIds=this.reduceToConfiguredLayers(t),this._layerItemsHash=t}async renderFeaturesList(){this._flowItems=["feature-list"];const t={detail:this._editableLayerIds};await this.layerListLoaded(t),this.setSelectedLayer(this._validLayers[0].id,this._validLayers[0].title)}_updateShareURL(){var t,i;const s=null===(t=this._shareNode)||void 0===t?void 0:t.shareUrl;if(!s)return;const e=new URL(s);this._selectedLayerId?e.searchParams.set("layerid",this._selectedLayerId):e.searchParams.delete("layerid"),(null===(i=this._selectedFeature)||void 0===i?void 0:i.length)?e.searchParams.set("oid",this._currentFeatureId):e.searchParams.delete("oid"),this._shareNode.shareUrl=e.href}async loadFeatureFromURLParams(){if(this.center&&this.level&&await this.mapView.goTo({center:this.center.split(";").map(Number),zoom:this.level}),this.layerId&&this.objectId){const t=await c(this.mapView,this.layerId);if(t){const i=await f([Number(this.objectId)],t,[],!0,this.mapView.spatialReference);i.length&&(await this.setSelectedFeatures(i),this._flowItems=this._flowItems.length&&"feature-details"!==this._flowItems[this._flowItems.length-1]?[...this._flowItems,"feature-details"]:[...this._flowItems])}}}get el(){return h(this)}static get watchers(){return{isMobile:["isMobileWatchHandler"],mapView:["mapViewWatchHandler"]}}};m.style=":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.width-full{width:100% !important}.width-0{width:0}.height-full{height:100% !important}.height-0{height:0}.overflow-hidden{overflow:hidden}.border{border:1px solid var(--calcite-color-border-3)}.notice-msg{padding:10px;width:calc(100% - 20px)}.progress-bar{padding:12px}.footer-top-button{padding-bottom:7px}.footer-button{height:35px}.feature-pagination{background-color:var(--calcite-color-foreground-1) !important;border-block-end:1px solid var(--calcite-color-border-3);display:flex;justify-content:center;padding:5px 0}.pagination-count{color:var(--calcite-color-brand);border-bottom:1px solid var(--calcite-color-brand);font-weight:bold}.report-submitted-msg{position:absolute;z-index:1000}.share-node{display:flex}";export{m as crowdsource_reporter}