@esri/solutions-components 0.8.30 → 0.8.31

Sign up to get free protection for your applications and to get access to all the features.
Files changed (37) hide show
  1. package/dist/cjs/calcite-alert_4.cjs.entry.js +1 -1
  2. package/dist/cjs/calcite-flow_6.cjs.entry.js +58 -34
  3. package/dist/cjs/crowdsource-reporter.cjs.entry.js +2 -2
  4. package/dist/cjs/feature-list.cjs.entry.js +1 -1
  5. package/dist/cjs/loader.cjs.js +1 -1
  6. package/dist/cjs/{popupUtils-e3fa775b.js → popupUtils-9ca69f8c.js} +1 -1
  7. package/dist/cjs/solutions-components.cjs.js +1 -1
  8. package/dist/collection/components/create-feature/create-feature.js +13 -8
  9. package/dist/collection/components/create-related-feature/create-related-feature.css +4 -0
  10. package/dist/collection/components/create-related-feature/create-related-feature.js +52 -26
  11. package/dist/collection/components/crowdsource-reporter/crowdsource-reporter.css +4 -0
  12. package/dist/collection/components/crowdsource-reporter/crowdsource-reporter.js +1 -1
  13. package/dist/collection/utils/popupUtils.js +1 -1
  14. package/dist/collection/utils/popupUtils.ts +1 -1
  15. package/dist/components/create-feature2.js +13 -8
  16. package/dist/components/create-related-feature2.js +57 -30
  17. package/dist/components/crowdsource-reporter.js +2 -2
  18. package/dist/components/popupUtils.js +1 -1
  19. package/dist/esm/calcite-alert_4.entry.js +1 -1
  20. package/dist/esm/calcite-flow_6.entry.js +58 -34
  21. package/dist/esm/crowdsource-reporter.entry.js +2 -2
  22. package/dist/esm/feature-list.entry.js +1 -1
  23. package/dist/esm/loader.js +1 -1
  24. package/dist/esm/{popupUtils-17193415.js → popupUtils-8efd3cde.js} +1 -1
  25. package/dist/esm/solutions-components.js +1 -1
  26. package/dist/solutions-components/p-2455bcb0.js +21 -0
  27. package/dist/solutions-components/{p-bb90a138.entry.js → p-3365a6de.entry.js} +2 -2
  28. package/dist/solutions-components/p-4ae34862.entry.js +17 -0
  29. package/dist/solutions-components/{p-16fb8296.entry.js → p-628874a6.entry.js} +1 -1
  30. package/dist/solutions-components/{p-2f7bfd8d.entry.js → p-90c3bc54.entry.js} +1 -1
  31. package/dist/solutions-components/solutions-components.esm.js +1 -1
  32. package/dist/solutions-components/utils/popupUtils.ts +1 -1
  33. package/dist/types/components/create-feature/create-feature.d.ts +1 -1
  34. package/dist/types/components/create-related-feature/create-related-feature.d.ts +19 -1
  35. package/package.json +1 -1
  36. package/dist/solutions-components/p-2e23ac2c.js +0 -21
  37. package/dist/solutions-components/p-c21a6940.entry.js +0 -17
@@ -17,7 +17,7 @@ const t9n = require('./t9n-9d199056.js');
17
17
  const resources = require('./resources-6146eb17.js');
18
18
  const locale$1 = require('./locale-48d76c59.js');
19
19
  const mapViewUtils = require('./mapViewUtils-911698e5.js');
20
- const popupUtils = require('./popupUtils-e3fa775b.js');
20
+ const popupUtils = require('./popupUtils-9ca69f8c.js');
21
21
  require('./guid-a7528dfa.js');
22
22
  require('./resources-1c0e54c1.js');
23
23
  require('./key-7ed07912.js');
@@ -360,7 +360,7 @@ const CreateFeature = class {
360
360
  this.customizeSubmit = false;
361
361
  this.searchConfiguration = undefined;
362
362
  this._editorLoading = false;
363
- this.showSearchWidget = undefined;
363
+ this._showSearchWidget = undefined;
364
364
  }
365
365
  //--------------------------------------------------------------------------
366
366
  //
@@ -433,10 +433,10 @@ const CreateFeature = class {
433
433
  * Renders the component.
434
434
  */
435
435
  render() {
436
- const showSearchWidget = this.showSearchWidget ? '' : 'display-none';
436
+ const showSearchWidget = this._showSearchWidget ? '' : 'display-none';
437
437
  const loaderClass = this._editorLoading ? "" : "display-none";
438
438
  const featureFormClass = this._editorLoading ? "display-none" : "";
439
- return (index.h(index.Fragment, { key: '2e790defdd5592fed729853888ee06143c95c84d' }, index.h("calcite-loader", { key: 'a0f1de0064ea80305d4aaf83f78939c0236c955a', class: loaderClass, label: "", scale: "s" }), index.h("div", { key: '1af391d6d7fd0dffa2e8e4b43905f8081a5f9820', class: featureFormClass, id: "feature-form" }), index.h("div", { key: '88d12115c3c2e0d34a5d6fd8895fb60cec6e9b5d', class: `search-widget ${showSearchWidget} ${featureFormClass}`, id: "search-widget-ref" })));
439
+ return (index.h(index.Fragment, { key: 'a4ccd565a52a4cde4e76439629425f19bd4c222e' }, index.h("calcite-loader", { key: '30e8a3753985a734dd7cba461f26691b51f49ab9', class: loaderClass, label: "", scale: "s" }), index.h("div", { key: '0845f1fa85a21b578fd18200b43d4a77c34e6808', class: featureFormClass, id: "feature-form" }), index.h("div", { key: 'af74b6337f5a0dcfdbd552145c88eae5282a3307', class: `search-widget ${showSearchWidget} ${featureFormClass}`, id: "search-widget-ref" })));
440
440
  }
441
441
  //--------------------------------------------------------------------------
442
442
  //
@@ -526,7 +526,7 @@ const CreateFeature = class {
526
526
  const formHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
527
527
  if (state === 'creating-features') {
528
528
  this._editorLoading = true;
529
- this.showSearchWidget = true;
529
+ this._showSearchWidget = true;
530
530
  }
531
531
  });
532
532
  this._editor.viewModel.addHandles(formHandle);
@@ -550,11 +550,12 @@ const CreateFeature = class {
550
550
  //on sketch complete emit the event
551
551
  this._editor.viewModel.sketchViewModel.on("create", (evt) => {
552
552
  if (evt.state === "complete") {
553
- this.showSearchWidget = false;
553
+ this._showSearchWidget = false;
554
554
  this.progressStatus.emit(1);
555
555
  this.drawComplete.emit();
556
556
  }
557
557
  });
558
+ //hides the header and footer elements in editor widget
558
559
  this.hideEditorsElements().then(() => {
559
560
  resolve({});
560
561
  }, e => reject(e));
@@ -565,8 +566,12 @@ const CreateFeature = class {
565
566
  if (items.length === 1) {
566
567
  this._editor.viewModel.featureTemplatesViewModel.select(items[0]);
567
568
  }
568
- //hides the header and footer elements in editor widget
569
- void this.hideEditorsElements();
569
+ const resolvePromise = items.length > 1;
570
+ this.hideEditorsElements().then(() => {
571
+ if (resolvePromise) {
572
+ resolve({});
573
+ }
574
+ }, e => resolvePromise && reject(e));
570
575
  }
571
576
  });
572
577
  }
@@ -728,7 +733,7 @@ const CreateFeature = class {
728
733
  };
729
734
  CreateFeature.style = CreateFeatureStyle0;
730
735
 
731
- const createRelatedFeatureCss = ":host{display:block}.esri-editor__panel-toolbar{display:none !important}";
736
+ const createRelatedFeatureCss = ":host{display:block}.esri-editor__panel-toolbar{display:none !important}.display-none{display:none !important}";
732
737
  const CreateRelatedFeatureStyle0 = createRelatedFeatureCss;
733
738
 
734
739
  const CreateRelatedFeature = class {
@@ -745,6 +750,7 @@ const CreateRelatedFeature = class {
745
750
  this.table = undefined;
746
751
  this.selectedFeature = undefined;
747
752
  this.customizeSubmit = false;
753
+ this._editorLoading = false;
748
754
  }
749
755
  //--------------------------------------------------------------------------
750
756
  //
@@ -759,6 +765,18 @@ const CreateRelatedFeature = class {
759
765
  await this.init();
760
766
  });
761
767
  }
768
+ /**
769
+ * When _editorLoading is true the container node will be hidden while starting the create workflow
770
+ */
771
+ async _editorLoadingWatchHandler(v) {
772
+ var _a, _b;
773
+ if (v) {
774
+ (_a = this._container) === null || _a === void 0 ? void 0 : _a.classList.add("display-none");
775
+ await this.startCreate();
776
+ (_b = this._container) === null || _b === void 0 ? void 0 : _b.classList.remove("display-none");
777
+ this._editorLoading = false;
778
+ }
779
+ }
762
780
  //--------------------------------------------------------------------------
763
781
  //
764
782
  // Methods (public)
@@ -815,7 +833,8 @@ const CreateRelatedFeature = class {
815
833
  this.reactiveUtils = reactiveUtils;
816
834
  }
817
835
  render() {
818
- return (index.h(index.Host, { key: 'c8516898db79b35b7fba909810afdc56b0602ebd' }));
836
+ const loaderClass = this._editorLoading ? "" : "display-none";
837
+ return (index.h("calcite-loader", { key: 'a8fd1e83a4a9614779be19a11e6028b3a402cbd2', class: loaderClass, label: "", scale: "s" }));
819
838
  }
820
839
  /**
821
840
  * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -828,29 +847,24 @@ const CreateRelatedFeature = class {
828
847
  * @protected
829
848
  */
830
849
  async createEditorWidget() {
850
+ var _a;
831
851
  if (this._editor) {
832
852
  this._editor.destroy();
833
853
  }
834
- const container = document.createElement("div");
854
+ this._container = document.createElement("div");
855
+ (_a = this._container) === null || _a === void 0 ? void 0 : _a.classList.add("display-none");
835
856
  this._editor = new this.Editor({
836
857
  view: this.mapView,
837
858
  visibleElements: {
838
859
  snappingControls: false
839
860
  },
840
- container
841
- });
842
- this.el.appendChild(container);
843
- //Add handle to watch featureFormViewModel ready state and hide the editor elements
844
- const hideElementHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
845
- if (state === 'ready') {
846
- this.hideEditorsElements();
847
- }
861
+ container: this._container
848
862
  });
849
- this._editor.viewModel.addHandles(hideElementHandle);
863
+ this.el.appendChild(this._container);
850
864
  //Add handle to watch featureTemplatesViewModel ready state and then start the creation
851
865
  const handle = this.reactiveUtils.watch(() => this._editor.viewModel.featureTemplatesViewModel.state, (state) => {
852
866
  if (state === 'ready') {
853
- void this.startCreate();
867
+ this._editorLoading = true;
854
868
  }
855
869
  });
856
870
  this._editor.viewModel.addHandles(handle);
@@ -891,6 +905,8 @@ const CreateRelatedFeature = class {
891
905
  template,
892
906
  };
893
907
  await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
908
+ //hides the header and footer elements in editor widget
909
+ await this.hideEditorsElements();
894
910
  // Emit an event to show submit cancel buttons
895
911
  this.isActionPending.emit(false);
896
912
  this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
@@ -899,22 +915,21 @@ const CreateRelatedFeature = class {
899
915
  * Hides the elements of editor widget
900
916
  * @protected
901
917
  */
902
- hideEditorsElements() {
918
+ async hideEditorsElements() {
919
+ var _a, _b;
903
920
  if (!this.customizeSubmit) {
904
921
  return;
905
922
  }
906
- setTimeout(() => {
907
- var _a;
908
- //hides the header and footer on the featureForm
909
- (_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null || _a === void 0 ? void 0 : _a.forEach((flowItem) => {
910
- var _a, _b, _c, _d, _e;
911
- 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');
912
- //hide the header
913
- (_d = article === null || article === void 0 ? void 0 : article.querySelector('header')) === null || _d === void 0 ? void 0 : _d.setAttribute('style', 'display: none');
914
- //hide the footer
915
- (_e = article === null || article === void 0 ? void 0 : article.querySelector('footer')) === null || _e === void 0 ? void 0 : _e.setAttribute('style', 'display: none');
916
- });
917
- }, 700);
923
+ await this.timeout(700);
924
+ //hides the header and footer on the featureForm
925
+ (_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) => {
926
+ var _a, _b, _c, _d, _e;
927
+ 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');
928
+ //hide the header
929
+ (_d = article === null || article === void 0 ? void 0 : article.querySelector('header')) === null || _d === void 0 ? void 0 : _d.setAttribute('style', 'display: none');
930
+ //hide the footer
931
+ (_e = article === null || article === void 0 ? void 0 : article.querySelector('footer')) === null || _e === void 0 ? void 0 : _e.setAttribute('style', 'display: none');
932
+ });
918
933
  }
919
934
  /**
920
935
  * Makes attributes for related feature
@@ -970,9 +985,18 @@ const CreateRelatedFeature = class {
970
985
  this.success.emit();
971
986
  }
972
987
  }
988
+ /**
989
+ * call setTimeout in Promise wrapper
990
+ * @param delay The time, in milliseconds that the timer should wait before the promise is resolved
991
+ * @protected
992
+ */
993
+ timeout(delay) {
994
+ return new Promise(resolve => setTimeout(resolve, delay));
995
+ }
973
996
  get el() { return index.getElement(this); }
974
997
  static get watchers() { return {
975
- "mapView": ["mapViewWatchHandler"]
998
+ "mapView": ["mapViewWatchHandler"],
999
+ "_editorLoading": ["_editorLoadingWatchHandler"]
976
1000
  }; }
977
1001
  };
978
1002
  CreateRelatedFeature.style = CreateRelatedFeatureStyle0;
@@ -13,7 +13,7 @@ const mapViewUtils = require('./mapViewUtils-911698e5.js');
13
13
  require('./esri-loader-fce6a9cb.js');
14
14
  require('./interfaces-7cd0a48a.js');
15
15
 
16
- const crowdsourceReporterCss = ":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}";
16
+ const crowdsourceReporterCss = ":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}";
17
17
  const CrowdsourceReporterStyle0 = crowdsourceReporterCss;
18
18
 
19
19
  const CrowdsourceReporter = class {
@@ -575,7 +575,7 @@ const CrowdsourceReporter = class {
575
575
  getFeatureDetailsFlowItem() {
576
576
  var _a;
577
577
  const showCommentBtn = ((_a = this._getLayersConfig(this._selectedLayerId)) === null || _a === void 0 ? void 0 : _a.comment) && this._selectedLayer.relationships.length > 0;
578
- return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, loading: this._showLoadingIndicator, onCalciteFlowItemBack: this.backFromSelectedPanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("instant-apps-social-share", { autoUpdateShareUrl: false, embed: false, popoverButtonIconScale: "s", ref: el => this._shareNode = el, removePopoverOffset: true, scale: "s", shareButtonColor: "neutral", shareButtonType: "action", slot: "header-actions-end", socialMedia: true, view: this.mapView }), this._selectedFeature.length > 1 && this.getFeaturesPagination(), index.h("calcite-panel", null, index.h("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: (evt) => void this.updatingFeatureDetails(evt.detail), ref: el => this._featureDetails = el, reportingOptions: this.reportingOptions }), showCommentBtn &&
578
+ return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, loading: this._showLoadingIndicator, onCalciteFlowItemBack: this.backFromSelectedPanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("instant-apps-social-share", { autoUpdateShareUrl: false, class: "share-node", embed: false, popoverButtonIconScale: "s", ref: el => this._shareNode = el, removePopoverOffset: true, scale: "m", shareButtonColor: "neutral", shareButtonType: "action", slot: "header-actions-end", socialMedia: true, view: this.mapView }), this._selectedFeature.length > 1 && this.getFeaturesPagination(), index.h("calcite-panel", null, index.h("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: (evt) => void this.updatingFeatureDetails(evt.detail), ref: el => this._featureDetails = el, reportingOptions: this.reportingOptions }), showCommentBtn &&
579
579
  index.h("calcite-button", { appearance: "solid", onClick: () => this._flowItems = [...this._flowItems, "add-comment"], slot: "footer", width: "full" }, this._translations.comment))));
580
580
  }
581
581
  /**
@@ -9,7 +9,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
10
  const index = require('./index-79b35510.js');
11
11
  const locale = require('./locale-48d76c59.js');
12
- const popupUtils = require('./popupUtils-e3fa775b.js');
12
+ const popupUtils = require('./popupUtils-9ca69f8c.js');
13
13
  const mapViewUtils = require('./mapViewUtils-911698e5.js');
14
14
  require('./esri-loader-fce6a9cb.js');
15
15
  require('./downloadUtils-83bf79ba.js');