@arcgis/map-components 1.0.0-beta.14

package/dist/components/arcgis-locate.js

@@ -0,0 +1,184 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { G as newWidgetsLocate } from './index2.js';
+import { r as referenceElementHelper, c as checkForView, o as onDisconnectedHelper } from './disconnected.js';
+
+const arcgisLocateCss = "arcgis-locate{}";
+
+const ArcgisLocate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.widgetReady = createEvent(this, "widgetReady", 7);
+    this.locateSuccess = createEvent(this, "locateSuccess", 7);
+    this.locateError = createEvent(this, "locateError", 7);
+    this.referenceElement = undefined;
+    this.geolocationOptions = undefined;
+    this.goToLocationEnabled = undefined;
+    this.graphic = undefined;
+    this.popupEnabled = undefined;
+    this.scale = undefined;
+    this.position = "bottom-left";
+    this.view = undefined;
+    this.widget = undefined;
+    this.useHeadingEnabled = true;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  positionWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      if (typeof this.view !== "string") {
+        this.view.ui.move(this.childElem, newValue);
+      }
+    }
+  }
+  geolocationOptionsWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.geolocationOptions = newValue;
+    }
+  }
+  goToLocationEnabledWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.goToLocationEnabled = newValue;
+    }
+  }
+  graphicWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.graphic = newValue;
+    }
+  }
+  popupEnabledWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.popupEnabled = newValue;
+    }
+  }
+  scaleWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.scale = newValue;
+    }
+  }
+  referenceElementWatcher(newValue) {
+    referenceElementHelper(this, newValue);
+  }
+  viewWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.view = newValue;
+    }
+  }
+  useHeadingWatcher(newValue) {
+    if (this.widget) {
+      this.widget.useHeadingEnabled = newValue;
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Methods
+  //
+  //--------------------------------------------------------------------------
+  async cancelLocate() {
+    return this.widget?.cancelLocate();
+  }
+  async locate() {
+    return this.widget?.locate();
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async componentDidLoad() {
+    const params = this._createParams();
+    const widget = await newWidgetsLocate(params);
+    this.widget = widget;
+    this._proxyEvents();
+    this.widgetReady.emit(true);
+    checkForView(this);
+  }
+  disconnectedCallback() {
+    onDisconnectedHelper(this);
+  }
+  render() {
+    return h("div", { ref: (el) => (this.childElem = el) });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  _createParams() {
+    const params = {
+      container: this.childElem,
+      useHeadingEnabled: this.useHeadingEnabled
+    };
+    if (this.geolocationOptions !== undefined) {
+      params.geolocationOptions = this.geolocationOptions;
+    }
+    if (this.goToLocationEnabled !== undefined) {
+      params.goToLocationEnabled = this.goToLocationEnabled;
+    }
+    if (this.graphic !== undefined) {
+      params.graphic = this.graphic;
+    }
+    if (this.popupEnabled !== undefined) {
+      params.popupEnabled = this.popupEnabled;
+    }
+    if (this.scale !== undefined) {
+      params.scale = this.scale;
+    }
+    if (this.view) {
+      params.view = this.view;
+    }
+    return params;
+  }
+  async _proxyEvents() {
+    this.widget?.on("locate", (e) => this.locateSuccess.emit(e));
+    this.widget?.on("locate-error", (e) => this.locateError.emit(e));
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "position": ["positionWatcher"],
+    "geolocationOptions": ["geolocationOptionsWatcher"],
+    "goToLocationEnabled": ["goToLocationEnabledWatcher"],
+    "graphic": ["graphicWatcher"],
+    "popupEnabled": ["popupEnabledWatcher"],
+    "scale": ["scaleWatcher"],
+    "referenceElement": ["referenceElementWatcher"],
+    "view": ["viewWatcher"],
+    "useHeadingEnabled": ["useHeadingWatcher"]
+  }; }
+  static get style() { return arcgisLocateCss; }
+}, [0, "arcgis-locate", {
+    "referenceElement": [1, "reference-element"],
+    "geolocationOptions": [8, "geolocation-options"],
+    "goToLocationEnabled": [4, "go-to-location-enabled"],
+    "graphic": [16],
+    "popupEnabled": [4, "popup-enabled"],
+    "scale": [2],
+    "position": [1],
+    "view": [16],
+    "widget": [1040],
+    "useHeadingEnabled": [1028, "use-heading-enabled"],
+    "cancelLocate": [64],
+    "locate": [64]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-locate"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-locate":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisLocate$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisLocate = ArcgisLocate$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisLocate, defineCustomElement };

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

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

package/dist/components/arcgis-map.js

@@ -0,0 +1,130 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { H as importConfig, I as newWebMap, J as newViewsMapView, i as importCoreReactiveUtils } from './index2.js';
+import { d as disableNavigation } from './mapping-utils.js';
+
+const arcgisMapCss = ".arcgis-map{padding:0;margin:0;height:100%;width:100%}";
+
+const ArcgisMap$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.viewReady = createEvent(this, "viewReady", 7);
+    this.apiKey = undefined;
+    this.basemap = undefined;
+    this.disableNavigation = false;
+    this.itemId = undefined;
+    this.zoom = undefined;
+    this.center = undefined;
+    this.view = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  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;
+    }
+    await this.loadMap();
+  }
+  componentDidRender() {
+    if (this.view) {
+      this.view.container = this.el;
+    }
+  }
+  render() {
+    return h("div", { class: "arcgis-map", ref: (el) => (this.el = el) });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async loadMap() {
+    const mapParams = {};
+    if (this.itemId) {
+      mapParams.portalItem = {
+        id: this.itemId
+      };
+    }
+    if (this.basemap) {
+      mapParams.basemap = this.basemap;
+    }
+    const map = await newWebMap(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 newViewsMapView({
+      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 arcgisMapCss; }
+}, [0, "arcgis-map", {
+    "apiKey": [1, "api-key"],
+    "basemap": [1],
+    "disableNavigation": [4, "disable-navigation"],
+    "itemId": [1, "item-id"],
+    "zoom": [514],
+    "center": [513],
+    "view": [1040]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-map"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-map":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisMap$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisMap = ArcgisMap$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisMap, defineCustomElement };

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

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

package/dist/components/arcgis-measurement.js

@@ -0,0 +1,153 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { K as newWidgetsMeasurement, 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 arcgisMeasurementCss = "arcgis-measurement{}";
+
+const ArcgisMeasurement$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.widgetReady = createEvent(this, "widgetReady", 7);
+    this.referenceElement = undefined;
+    this.activeTool = undefined;
+    this.activeWidget = undefined;
+    this.areaUnit = undefined;
+    this.linearUnit = undefined;
+    this.position = "bottom-left";
+    this.expandable = false;
+    this.view = undefined;
+    this.widget = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  activeToolWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.activeTool = newValue;
+    }
+  }
+  areaUnitWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.areaUnit = newValue;
+    }
+  }
+  linearUnitWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.linearUnit = newValue;
+    }
+  }
+  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;
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Methods
+  //
+  //--------------------------------------------------------------------------
+  async startMeasurement() {
+    return this.widget?.startMeasurement();
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async componentDidLoad() {
+    const params = this._createParams();
+    const widget = await newWidgetsMeasurement(params);
+    this.widget = widget;
+    await this._addWatchers();
+    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.activeWidget, (value) => (this.activeWidget = value), {
+      initial: true
+    });
+  }
+  _createParams() {
+    const params = {
+      container: this.childElem
+    };
+    if (this.view) {
+      params.view = this.view;
+    }
+    return params;
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "activeTool": ["activeToolWatcher"],
+    "areaUnit": ["areaUnitWatcher"],
+    "linearUnit": ["linearUnitWatcher"],
+    "position": ["positionWatcher"],
+    "referenceElement": ["referenceElementWatcher"],
+    "view": ["viewWatcher"]
+  }; }
+  static get style() { return arcgisMeasurementCss; }
+}, [0, "arcgis-measurement", {
+    "referenceElement": [1, "reference-element"],
+    "activeTool": [1, "active-tool"],
+    "activeWidget": [1040],
+    "areaUnit": [1, "area-unit"],
+    "linearUnit": [1, "linear-unit"],
+    "position": [1],
+    "expandable": [4],
+    "view": [16],
+    "widget": [1040],
+    "startMeasurement": [64]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-measurement", "arcgis-expand"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-measurement":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisMeasurement$1);
+      }
+      break;
+    case "arcgis-expand":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisMeasurement = ArcgisMeasurement$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisMeasurement, defineCustomElement };

package/dist/components/arcgis-navigation-toggle.d.ts

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

package/dist/components/arcgis-navigation-toggle.js

@@ -0,0 +1,117 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { L as newWidgetsNavigationToggle } from './index2.js';
+import { r as referenceElementHelper, c as checkForView, o as onDisconnectedHelper } from './disconnected.js';
+
+const arcgisNavigationToggleCss = "arcgis-navigation-toggle{}";
+
+const ArcgisNavigationToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.widgetReady = createEvent(this, "widgetReady", 7);
+    this.referenceElement = undefined;
+    this.layout = undefined;
+    this.position = "bottom-left";
+    this.view = undefined;
+    this.widget = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  layoutWatcher(newValue) {
+    if (newValue !== undefined && this.widget) {
+      this.widget.layout = newValue;
+    }
+  }
+  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;
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  async toggle() {
+    return this.widget?.toggle();
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async componentDidLoad() {
+    const params = this._createParams();
+    const widget = await newWidgetsNavigationToggle(params);
+    this.widget = widget;
+    this.widgetReady.emit(true);
+    checkForView(this);
+  }
+  disconnectedCallback() {
+    onDisconnectedHelper(this);
+  }
+  render() {
+    return h("div", { ref: (el) => (this.childElem = el) });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  _createParams() {
+    const params = {
+      container: this.childElem
+    };
+    if (this.view) {
+      params.view = this.view;
+    }
+    return params;
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "layout": ["layoutWatcher"],
+    "position": ["positionWatcher"],
+    "referenceElement": ["referenceElementWatcher"],
+    "view": ["viewWatcher"]
+  }; }
+  static get style() { return arcgisNavigationToggleCss; }
+}, [0, "arcgis-navigation-toggle", {
+    "referenceElement": [1, "reference-element"],
+    "layout": [1537],
+    "position": [1],
+    "view": [16],
+    "widget": [1040],
+    "toggle": [64]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-navigation-toggle"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-navigation-toggle":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisNavigationToggle$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisNavigationToggle = ArcgisNavigationToggle$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisNavigationToggle, defineCustomElement };

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

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