@arcgis/map-components 1.0.0-beta.14

package/dist/components/arcgis-print.js

@@ -0,0 +1,197 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { M as newWidgetsPrint, i as importCoreReactiveUtils } from './index2.js';
+import { r as referenceElementHelper, c as checkForView, o as onDisconnectedHelper } from './disconnected.js';
+import { d as defineCustomElement$2 } from './arcgis-expand2.js';
+
+const arcgisPrintCss = "";
+
+const ArcgisPrint$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.printComplete = createEvent(this, "printComplete", 7);
+    this.printSubmit = createEvent(this, "printSubmit", 7);
+    this.widgetReady = createEvent(this, "widgetReady", 7);
+    this.referenceElement = undefined;
+    this.allowedFormats = undefined;
+    this.allowedLayouts = undefined;
+    this.exportedLinks = undefined;
+    this.extraParameters = undefined;
+    this.includeDefaultTemplates = undefined;
+    this.portal = undefined;
+    this.printServiceUrl = undefined;
+    this.templateCustomTextElements = undefined;
+    this.templateOptions = undefined;
+    this.position = "bottom-left";
+    this.expandable = false;
+    this.view = undefined;
+    this.widget = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  positionWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      if (typeof this.view !== "string") {
+        this.view.ui.move(this.childElem, newValue);
+      }
+    }
+  }
+  allowedFormatsWatcher(value) {
+    if (value && this.widget) {
+      this.widget.allowedFormats = value.split(",");
+    }
+  }
+  allowedLayoutsWatcher(value) {
+    if (value && this.widget) {
+      this.widget.allowedLayouts = value.split(",");
+    }
+  }
+  extraParametersWatcher(value) {
+    if (value && this.widget) {
+      this.widget.extraParameters = value;
+    }
+  }
+  includeDefaultTemplatesWatcher(value) {
+    if (value && this.widget) {
+      this.widget.includeDefaultTemplates = value;
+    }
+  }
+  portalWatcher(value) {
+    if (value && this.widget) {
+      this.widget.portal = value;
+    }
+  }
+  printServiceUrlWatcher(value) {
+    if (value && this.widget) {
+      this.widget.printServiceUrl = value;
+    }
+  }
+  templateCustomTextElementsWatcher(value) {
+    if (value && this.widget) {
+      this.widget.templateCustomTextElements = value;
+    }
+  }
+  templateOptionsWatcher(value) {
+    if (value && this.widget) {
+      this.widget.templateOptions = value;
+    }
+  }
+  referenceElementWatcher(newValue) {
+    referenceElementHelper(this, newValue);
+  }
+  viewWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.view = newValue;
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async componentDidLoad() {
+    const params = this._createParams();
+    const widget = await newWidgetsPrint(params);
+    this.widget = widget;
+    await this._addWatchers();
+    this._proxyEvents();
+    this.widgetReady.emit(true);
+    checkForView(this);
+  }
+  disconnectedCallback() {
+    onDisconnectedHelper(this);
+  }
+  render() {
+    if (this.expandable) {
+      return (h("arcgis-expand", { position: this.position, ref: (el) => (this.expandElem = el) }, h("div", { ref: (el) => (this.childElem = el) })));
+    }
+    return h("div", { ref: (el) => (this.childElem = el) });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async _addWatchers() {
+    const { watch } = await importCoreReactiveUtils();
+    watch(() => this.widget.exportedLinks, (value) => (this.exportedLinks = value), {
+      initial: true
+    });
+  }
+  _createParams() {
+    const params = {
+      container: this.childElem
+    };
+    if (this.allowedFormats) {
+      params.allowedFormats = this.allowedFormats;
+    }
+    if (this.allowedLayouts) {
+      params.allowedLayouts = this.allowedLayouts;
+    }
+    if (this.view) {
+      params.view = this.view;
+    }
+    return params;
+  }
+  _proxyEvents() {
+    this.widget.on("complete", (e) => this.printComplete.emit(e));
+    this.widget.on("submit", (e) => this.printSubmit.emit(e));
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "position": ["positionWatcher"],
+    "allowedFormats": ["allowedFormatsWatcher"],
+    "allowedLayouts": ["allowedLayoutsWatcher"],
+    "extraParameters": ["extraParametersWatcher"],
+    "includeDefaultTemplates": ["includeDefaultTemplatesWatcher"],
+    "portal": ["portalWatcher"],
+    "printServiceUrl": ["printServiceUrlWatcher"],
+    "templateCustomTextElements": ["templateCustomTextElementsWatcher"],
+    "templateOptions": ["templateOptionsWatcher"],
+    "referenceElement": ["referenceElementWatcher"],
+    "view": ["viewWatcher"]
+  }; }
+  static get style() { return arcgisPrintCss; }
+}, [0, "arcgis-print", {
+    "referenceElement": [1, "reference-element"],
+    "allowedFormats": [1, "allowed-formats"],
+    "allowedLayouts": [1, "allowed-layouts"],
+    "exportedLinks": [1040],
+    "extraParameters": [8, "extra-parameters"],
+    "includeDefaultTemplates": [4, "include-default-templates"],
+    "portal": [16],
+    "printServiceUrl": [1, "print-service-url"],
+    "templateCustomTextElements": [16],
+    "templateOptions": [16],
+    "position": [1],
+    "expandable": [4],
+    "view": [16],
+    "widget": [1040]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-print", "arcgis-expand"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-print":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisPrint$1);
+      }
+      break;
+    case "arcgis-expand":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisPrint = ArcgisPrint$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisPrint, defineCustomElement };

package/dist/components/arcgis-scale-bar.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ArcgisScaleBar extends Components.ArcgisScaleBar, HTMLElement {}
+export const ArcgisScaleBar: {
+  prototype: ArcgisScaleBar;
+  new (): ArcgisScaleBar;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/arcgis-scale-bar.js

@@ -0,0 +1,133 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { N as newWidgetsScaleBar } from './index2.js';
+import { r as referenceElementHelper, c as checkForView, o as onDisconnectedHelper } from './disconnected.js';
+import { d as defineCustomElement$2 } from './arcgis-expand2.js';
+
+const arcgisScaleBarCss = "arcgis-scale-bar{}";
+
+const ArcgisScaleBar$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.widgetReady = createEvent(this, "widgetReady", 7);
+    this.referenceElement = undefined;
+    this.view = undefined;
+    this.position = "bottom-left";
+    this.expandable = false;
+    this.barStyle = undefined;
+    this.unit = undefined;
+    this.widget = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  positionWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      if (typeof this.view !== "string") {
+        this.view.ui.move(this.childElem, newValue);
+      }
+    }
+  }
+  referenceElementWatcher(newValue) {
+    referenceElementHelper(this, newValue);
+  }
+  viewWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.view = newValue;
+    }
+  }
+  styleWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.style = newValue;
+    }
+  }
+  unitWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.unit = newValue;
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async componentDidLoad() {
+    const params = this._createParams();
+    const widget = await newWidgetsScaleBar(params);
+    this.widget = widget;
+    this.widgetReady.emit(true);
+    checkForView(this);
+  }
+  disconnectedCallback() {
+    onDisconnectedHelper(this);
+  }
+  render() {
+    if (this.expandable) {
+      return (h("arcgis-expand", { position: this.position, ref: (el) => (this.expandElem = el) }, h("div", { ref: (el) => (this.childElem = el) })));
+    }
+    return h("div", { ref: (el) => (this.childElem = el) });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  _createParams() {
+    const params = {
+      container: this.childElem
+    };
+    if (this.unit) {
+      params.unit = this.unit;
+    }
+    if (this.barStyle) {
+      params.style = this.barStyle;
+    }
+    if (this.view) {
+      params.view = this.view;
+    }
+    return params;
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "position": ["positionWatcher"],
+    "referenceElement": ["referenceElementWatcher"],
+    "view": ["viewWatcher"],
+    "barStyle": ["styleWatcher"],
+    "unit": ["unitWatcher"]
+  }; }
+  static get style() { return arcgisScaleBarCss; }
+}, [0, "arcgis-scale-bar", {
+    "referenceElement": [1, "reference-element"],
+    "view": [16],
+    "position": [1],
+    "expandable": [4],
+    "barStyle": [1, "bar-style"],
+    "unit": [1],
+    "widget": [1040]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-scale-bar", "arcgis-expand"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-scale-bar":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisScaleBar$1);
+      }
+      break;
+    case "arcgis-expand":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisScaleBar = ArcgisScaleBar$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisScaleBar, defineCustomElement };

package/dist/components/arcgis-scale-range-slider.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ArcgisScaleRangeSlider extends Components.ArcgisScaleRangeSlider, HTMLElement {}
+export const ArcgisScaleRangeSlider: {
+  prototype: ArcgisScaleRangeSlider;
+  new (): ArcgisScaleRangeSlider;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/arcgis-scale-range-slider.js

@@ -0,0 +1,177 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { O as newWidgetsScaleRangeSlider } from './index2.js';
+import { r as referenceElementHelper, c as checkForView, o as onDisconnectedHelper } from './disconnected.js';
+import { d as defineCustomElement$2 } from './arcgis-expand2.js';
+
+const arcgisScaleRangeSliderCss = "arcgis-scale-range-slider{}";
+
+const ArcgisScaleRangeSlider$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.widgetReady = createEvent(this, "widgetReady", 7);
+    this.referenceElement = undefined;
+    this.view = undefined;
+    this.position = "bottom-left";
+    this.expandable = false;
+    this.widget = undefined;
+    this.layer = undefined;
+    this.maxScale = undefined;
+    this.maxScaleLimit = undefined;
+    this.minScale = undefined;
+    this.minScaleLimit = undefined;
+    this.region = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  positionWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      if (typeof this.view !== "string") {
+        this.view.ui.move(this.childElem, newValue);
+      }
+    }
+  }
+  maxScaleWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.maxScale = newValue;
+    }
+  }
+  minScaleWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.minScale = newValue;
+    }
+  }
+  maxScaleLimitWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.maxScaleLimit = newValue;
+    }
+  }
+  minScaleLimitWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.minScaleLimit = newValue;
+    }
+  }
+  layerWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.layer = newValue;
+    }
+  }
+  regionWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.region = newValue;
+    }
+  }
+  referenceElementWatcher(newValue) {
+    referenceElementHelper(this, newValue);
+  }
+  viewWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.view = newValue;
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async componentDidLoad() {
+    const params = this._createParams();
+    const widget = await newWidgetsScaleRangeSlider(params);
+    this.widget = widget;
+    this.widgetReady.emit(true);
+    checkForView(this);
+  }
+  disconnectedCallback() {
+    onDisconnectedHelper(this);
+  }
+  render() {
+    if (this.expandable) {
+      return (h("arcgis-expand", { position: this.position, ref: (el) => (this.expandElem = el) }, h("div", { ref: (el) => (this.childElem = el) })));
+    }
+    return h("div", { ref: (el) => (this.childElem = el) });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  _createParams() {
+    const params = {
+      container: this.childElem
+    };
+    if (this.layer) {
+      params.layer = this.layer;
+    }
+    if (this.maxScale !== undefined) {
+      params.maxScale = this.maxScale;
+    }
+    if (this.minScale !== undefined) {
+      params.minScale = this.minScale;
+    }
+    if (this.maxScaleLimit !== undefined) {
+      params.maxScaleLimit = this.maxScaleLimit;
+    }
+    if (this.minScaleLimit !== undefined) {
+      params.minScaleLimit = this.minScaleLimit;
+    }
+    if (this.region !== undefined) {
+      params.region = this.region;
+    }
+    if (this.view) {
+      params.view = this.view;
+    }
+    return params;
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "position": ["positionWatcher"],
+    "maxScale": ["maxScaleWatcher"],
+    "minScale": ["minScaleWatcher"],
+    "maxScaleLimit": ["maxScaleLimitWatcher"],
+    "minScaleLimit": ["minScaleLimitWatcher"],
+    "layer": ["layerWatcher"],
+    "region": ["regionWatcher"],
+    "referenceElement": ["referenceElementWatcher"],
+    "view": ["viewWatcher"]
+  }; }
+  static get style() { return arcgisScaleRangeSliderCss; }
+}, [0, "arcgis-scale-range-slider", {
+    "referenceElement": [1, "reference-element"],
+    "view": [16],
+    "position": [1],
+    "expandable": [4],
+    "widget": [1040],
+    "layer": [16],
+    "maxScale": [2, "max-scale"],
+    "maxScaleLimit": [2, "max-scale-limit"],
+    "minScale": [2, "min-scale"],
+    "minScaleLimit": [2, "min-scale-limit"],
+    "region": [1]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-scale-range-slider", "arcgis-expand"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-scale-range-slider":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisScaleRangeSlider$1);
+      }
+      break;
+    case "arcgis-expand":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisScaleRangeSlider = ArcgisScaleRangeSlider$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisScaleRangeSlider, defineCustomElement };

package/dist/components/arcgis-scene.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ArcgisScene extends Components.ArcgisScene, HTMLElement {}
+export const ArcgisScene: {
+  prototype: ArcgisScene;
+  new (): ArcgisScene;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/arcgis-scene.js

@@ -0,0 +1,127 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { H as importConfig, P as newWebScene, Q as newViewsSceneView, i as importCoreReactiveUtils } from './index2.js';
+import { d as disableNavigation } from './mapping-utils.js';
+
+const arcgisSceneCss = ".arcgis-scene{padding:0;margin:0;height:100%;width:100%}";
+
+const ArcgisScene$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.viewReady = createEvent(this, "viewReady", 7);
+    this.apiKey = undefined;
+    this.itemId = undefined;
+    this.zoom = undefined;
+    this.center = undefined;
+    this.view = undefined;
+    this.disableNavigation = false;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  apiKeyWatcher(value) {
+    this.config.apiKey = value;
+  }
+  itemIdWatcher(value, old) {
+    if (value && value !== old) {
+      this.loadMap();
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async componentWillLoad() {
+    this.config = await importConfig();
+    if (this.apiKey) {
+      this.config.apiKey = this.apiKey;
+    }
+    if (this.itemId) {
+      this.loadMap();
+    }
+  }
+  componentDidRender() {
+    if (this.view) {
+      this.view.container = this.el;
+    }
+  }
+  render() {
+    return h("div", { class: "arcgis-scene", ref: (el) => (this.el = el) });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async loadMap() {
+    const mapParams = {};
+    if (this.itemId) {
+      mapParams.portalItem = {
+        id: this.itemId
+      };
+    }
+    const map = await newWebScene(mapParams);
+    const params = {};
+    if (this.zoom) {
+      params.zoom = this.zoom;
+    }
+    if (this.center) {
+      if (typeof this.center === "string") {
+        params.center = this.center.split(",").map((x) => Number(x));
+      }
+      else {
+        params.center = this.center;
+      }
+    }
+    const view = await newViewsSceneView({
+      map,
+      ...params
+    });
+    const { watch } = await importCoreReactiveUtils();
+    this.view = view;
+    watch(() => this.view.center, (center) => {
+      const value = `${center.longitude},${center.latitude}`;
+      this.center = value;
+    });
+    watch(() => this.view.zoom, (value) => (this.zoom = value));
+    if (this.disableNavigation) {
+      disableNavigation(this.view);
+    }
+    this.viewReady.emit(true);
+  }
+  get hostElem() { return this; }
+  static get watchers() { return {
+    "apiKey": ["apiKeyWatcher"],
+    "itemId": ["itemIdWatcher"]
+  }; }
+  static get style() { return arcgisSceneCss; }
+}, [0, "arcgis-scene", {
+    "apiKey": [1, "api-key"],
+    "itemId": [1, "item-id"],
+    "zoom": [514],
+    "center": [513],
+    "view": [1040],
+    "disableNavigation": [4, "disable-navigation"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-scene"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-scene":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisScene$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisScene = ArcgisScene$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisScene, defineCustomElement };

package/dist/components/arcgis-search.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ArcgisSearch extends Components.ArcgisSearch, HTMLElement {}
+export const ArcgisSearch: {
+  prototype: ArcgisSearch;
+  new (): ArcgisSearch;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;