@arcgis/common-components 1.0.0-beta.1

package/dist/cjs/index.cjs.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-e8c59179.js');
+
+/*
+ Stencil Client Patch Esm v2.22.3 | MIT Licensed | https://stenciljs.com
+ */
+const patchEsm = () => {
+    return index.promiseResolve();
+};
+
+const defineCustomElements = (win, options) => {
+  if (typeof window === 'undefined') return Promise.resolve();
+  return patchEsm().then(() => {
+  return index.bootstrapLazy([["arcgis-api-key.cjs",[[0,"arcgis-api-key",{"apiKey":[1,"api-key"]}]]],["arcgis-identity.cjs",[[0,"arcgis-identity",{"identity":[1040],"appId":[1,"app-id"],"credential":[1040],"expiration":[1026],"locale":[1],"usePopup":[4,"use-popup"],"popupCallbackUrl":[1,"popup-callback-url"],"portalUrl":[1,"portal-url"],"preserveUrlHash":[4,"preserve-url-hash"],"signIn":[64],"signOut":[64]}]]]], options);
+  });
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;

package/dist/components/arcgis-api-key.d.ts

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

package/dist/components/arcgis-api-key.js

@@ -0,0 +1,67 @@
+import { proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
+import { i as importConfig } from './index2.js';
+
+const arcgisApiKeyCss = ":host{display:none}arcgis-api-key{display:none}";
+
+const ArcgisApiKey$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.apiKeyReady = createEvent(this, "apiKeyReady", 7);
+    this.apiKey = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  apiKeyWatcher(value) {
+    this._setApiKey(value);
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async connectedCallback() {
+    if (this.apiKey) {
+      await this._setApiKey(this.apiKey);
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async _setApiKey(value) {
+    const config = await importConfig();
+    config.apiKey = value;
+    this.apiKeyReady.emit(true);
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "apiKey": ["apiKeyWatcher"]
+  }; }
+  static get style() { return arcgisApiKeyCss; }
+}, [0, "arcgis-api-key", {
+    "apiKey": [1, "api-key"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-api-key"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-api-key":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisApiKey$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisApiKey = ArcgisApiKey$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisApiKey, defineCustomElement };

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

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

package/dist/components/arcgis-identity.js

@@ -0,0 +1,165 @@
+import { proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
+import { a as importCoreReactiveUtils, n as newIdentityOAuthInfo, b as importIdentityIdentityManager } from './index2.js';
+
+const arcgisIdentityCss = ":host{display:none}arcgis-identity{display:none}";
+
+const ArcgisIdentity$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.identityReady = createEvent(this, "identityReady", 7);
+    this.credentialCreate = createEvent(this, "credentialCreate", 7);
+    this.dialogCreate = createEvent(this, "dialogCreate", 7);
+    this.identity = undefined;
+    this.appId = undefined;
+    this.credential = undefined;
+    this.expiration = undefined;
+    this.locale = undefined;
+    this.usePopup = false;
+    this.popupCallbackUrl = undefined;
+    this.portalUrl = undefined;
+    this.preserveUrlHash = false;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  appIdWatcher(value, oldValue) {
+    if (oldValue !== value) {
+      this._registerOAuth();
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Methods
+  //
+  //--------------------------------------------------------------------------
+  async signIn() {
+    if (!this.credential) {
+      try {
+        this.credential = await this._checkCurrentStatus();
+      }
+      catch (error) {
+        this.credential = await this._fetchCredential();
+      }
+    }
+    return this.credential;
+  }
+  async signOut() {
+    if (!this.credential) {
+      try {
+        this.identity.destroyCredentials();
+      }
+      catch (error) {
+        this.credential = undefined;
+      }
+    }
+    this.credential = undefined;
+    return;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async connectedCallback() {
+    if (this.appId) {
+      await this._registerOAuth();
+    }
+    this._proxyEvents();
+    await this._addWatchers();
+    this.identityReady.emit({ identity: this.identity, ready: true });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async _addWatchers() {
+    const { watch } = await importCoreReactiveUtils();
+    watch(() => this._info.expiration, (value) => (this.expiration = value), {
+      initial: true
+    });
+  }
+  _checkCurrentStatus() {
+    return this.identity.checkSignInStatus(`${this._info.portalUrl}/sharing`);
+  }
+  async _createOAuthInfo() {
+    const params = {};
+    if (this.appId !== undefined) {
+      params.appId = this.appId;
+    }
+    if (this.locale !== undefined) {
+      params.locale = this.locale;
+    }
+    if (this.popupCallbackUrl !== undefined) {
+      params.popupCallbackUrl = this.popupCallbackUrl;
+    }
+    if (this.preserveUrlHash !== undefined) {
+      params.preserveUrlHash = this.preserveUrlHash;
+    }
+    if (this.usePopup !== undefined) {
+      params.popup = this.usePopup;
+    }
+    if (this.portalUrl !== undefined) {
+      params.portalUrl = this.portalUrl;
+    }
+    const info = await newIdentityOAuthInfo(params);
+    this._info = info;
+    return info;
+  }
+  async _fetchCredential() {
+    const credential = await this.identity.getCredential(`${this._info?.portalUrl}/sharing`, {
+      error: null,
+      oAuthPopupConfirmation: false,
+      token: null
+    });
+    return credential;
+  }
+  async _registerOAuth() {
+    this.identity = await importIdentityIdentityManager();
+    const info = await this._createOAuthInfo();
+    this.identity.registerOAuthInfos([info]);
+  }
+  _proxyEvents() {
+    this.identity.on("credential-create", (e) => this.credentialCreate.emit(e));
+    this.identity.on("dialog-create", (e) => this.dialogCreate.emit(e));
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "appId": ["appIdWatcher"]
+  }; }
+  static get style() { return arcgisIdentityCss; }
+}, [0, "arcgis-identity", {
+    "identity": [1040],
+    "appId": [1, "app-id"],
+    "credential": [1040],
+    "expiration": [1026],
+    "locale": [1],
+    "usePopup": [4, "use-popup"],
+    "popupCallbackUrl": [1, "popup-callback-url"],
+    "portalUrl": [1, "portal-url"],
+    "preserveUrlHash": [4, "preserve-url-hash"],
+    "signIn": [64],
+    "signOut": [64]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["arcgis-identity"];
+  components.forEach(tagName => { switch (tagName) {
+    case "arcgis-identity":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ArcgisIdentity$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ArcgisIdentity = ArcgisIdentity$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisIdentity, defineCustomElement };

package/dist/components/index.d.ts

@@ -0,0 +1,32 @@
+/* ArcgisCommonComponents custom elements */
+export { ArcgisApiKey as ArcgisApiKey } from '../types/components/arcgis-api-key/arcgis-api-key';
+export { ArcgisIdentity as ArcgisIdentity } from '../types/components/arcgis-identity/arcgis-identity';
+
+/**
+ * Used to manually set the base path where assets can be found.
+ * If the script is used as "module", it's recommended to use "import.meta.url",
+ * such as "setAssetPath(import.meta.url)". Other options include
+ * "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
+ * dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
+ * But do note that this configuration depends on how your script is bundled, or lack of
+ * bundling, and where your assets can be loaded from. Additionally custom bundling
+ * will have to ensure the static assets are copied to its build directory.
+ */
+export declare const setAssetPath: (path: string) => void;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare const setNonce: (nonce: string) => void
+
+export interface SetPlatformOptions {
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
+export * from '../types';

package/dist/components/index.js

@@ -0,0 +1,3 @@
+export { setAssetPath, setNonce, setPlatformOptions } from '@stencil/core/internal/client';
+export { ArcgisApiKey, defineCustomElement as defineCustomElementArcgisApiKey } from './arcgis-api-key.js';
+export { ArcgisIdentity, defineCustomElement as defineCustomElementArcgisIdentity } from './arcgis-identity.js';

package/dist/components/index2.js

@@ -0,0 +1,40 @@
+const amd = "define" in window && typeof window.define === "function" && "amd" in window.define;
+function requireModule(modulePath) {
+    return new Promise((resolve) => window.require([modulePath], (moduleDefault) => {
+        resolve(moduleDefault);
+    }));
+}
+async function importIdentityIdentityManager() {
+    if (amd) {
+        return requireModule("esri/identity/IdentityManager");
+    }
+    const module = await import('@arcgis/core/identity/IdentityManager.js');
+    return module.default;
+}
+async function importIdentityOAuthInfo() {
+    if (amd) {
+        return requireModule("esri/identity/OAuthInfo");
+    }
+    const module = await import('@arcgis/core/identity/OAuthInfo.js');
+    return module.default;
+}
+async function newIdentityOAuthInfo(properties) {
+    const ModConstructor = await importIdentityOAuthInfo();
+    return new ModConstructor(properties);
+}
+async function importConfig() {
+    if (amd) {
+        return requireModule("esri/config");
+    }
+    const module = await import('@arcgis/core/config.js');
+    return module.default;
+}
+async function importCoreReactiveUtils() {
+    if (amd) {
+        return requireModule("esri/core/reactiveUtils");
+    }
+    const module = await import('@arcgis/core/core/reactiveUtils.js');
+    return module;
+}
+
+export { importCoreReactiveUtils as a, importIdentityIdentityManager as b, importConfig as i, newIdentityOAuthInfo as n };

package/dist/esm/arcgis-api-key.entry.js

@@ -0,0 +1,47 @@
+import { r as registerInstance, c as createEvent, g as getElement } from './index-1f7e8e45.js';
+import { i as importConfig } from './index-386f07e9.js';
+
+const arcgisApiKeyCss = ":host{display:none}arcgis-api-key{display:none}";
+
+const ArcgisApiKey = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.apiKeyReady = createEvent(this, "apiKeyReady", 7);
+    this.apiKey = undefined;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  apiKeyWatcher(value) {
+    this._setApiKey(value);
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async connectedCallback() {
+    if (this.apiKey) {
+      await this._setApiKey(this.apiKey);
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async _setApiKey(value) {
+    const config = await importConfig();
+    config.apiKey = value;
+    this.apiKeyReady.emit(true);
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "apiKey": ["apiKeyWatcher"]
+  }; }
+};
+ArcgisApiKey.style = arcgisApiKeyCss;
+
+export { ArcgisApiKey as arcgis_api_key };

package/dist/esm/arcgis-common-components.js

@@ -0,0 +1,18 @@
+import { p as promiseResolve, b as bootstrapLazy } from './index-1f7e8e45.js';
+export { s as setNonce } from './index-1f7e8e45.js';
+
+/*
+ Stencil Client Patch Browser v2.22.3 | MIT Licensed | https://stenciljs.com
+ */
+const patchBrowser = () => {
+    const importMeta = import.meta.url;
+    const opts = {};
+    if (importMeta !== '') {
+        opts.resourcesUrl = new URL('.', importMeta).href;
+    }
+    return promiseResolve(opts);
+};
+
+patchBrowser().then(options => {
+  return bootstrapLazy([["arcgis-api-key",[[0,"arcgis-api-key",{"apiKey":[1,"api-key"]}]]],["arcgis-identity",[[0,"arcgis-identity",{"identity":[1040],"appId":[1,"app-id"],"credential":[1040],"expiration":[1026],"locale":[1],"usePopup":[4,"use-popup"],"popupCallbackUrl":[1,"popup-callback-url"],"portalUrl":[1,"portal-url"],"preserveUrlHash":[4,"preserve-url-hash"],"signIn":[64],"signOut":[64]}]]]], options);
+});

package/dist/esm/arcgis-identity.entry.js

@@ -0,0 +1,135 @@
+import { r as registerInstance, c as createEvent, g as getElement } from './index-1f7e8e45.js';
+import { a as importCoreReactiveUtils, n as newIdentityOAuthInfo, b as importIdentityIdentityManager } from './index-386f07e9.js';
+
+const arcgisIdentityCss = ":host{display:none}arcgis-identity{display:none}";
+
+const ArcgisIdentity = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.identityReady = createEvent(this, "identityReady", 7);
+    this.credentialCreate = createEvent(this, "credentialCreate", 7);
+    this.dialogCreate = createEvent(this, "dialogCreate", 7);
+    this.identity = undefined;
+    this.appId = undefined;
+    this.credential = undefined;
+    this.expiration = undefined;
+    this.locale = undefined;
+    this.usePopup = false;
+    this.popupCallbackUrl = undefined;
+    this.portalUrl = undefined;
+    this.preserveUrlHash = false;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Watchers
+  //
+  //--------------------------------------------------------------------------
+  appIdWatcher(value, oldValue) {
+    if (oldValue !== value) {
+      this._registerOAuth();
+    }
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Methods
+  //
+  //--------------------------------------------------------------------------
+  async signIn() {
+    if (!this.credential) {
+      try {
+        this.credential = await this._checkCurrentStatus();
+      }
+      catch (error) {
+        this.credential = await this._fetchCredential();
+      }
+    }
+    return this.credential;
+  }
+  async signOut() {
+    if (!this.credential) {
+      try {
+        this.identity.destroyCredentials();
+      }
+      catch (error) {
+        this.credential = undefined;
+      }
+    }
+    this.credential = undefined;
+    return;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  async connectedCallback() {
+    if (this.appId) {
+      await this._registerOAuth();
+    }
+    this._proxyEvents();
+    await this._addWatchers();
+    this.identityReady.emit({ identity: this.identity, ready: true });
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  async _addWatchers() {
+    const { watch } = await importCoreReactiveUtils();
+    watch(() => this._info.expiration, (value) => (this.expiration = value), {
+      initial: true
+    });
+  }
+  _checkCurrentStatus() {
+    return this.identity.checkSignInStatus(`${this._info.portalUrl}/sharing`);
+  }
+  async _createOAuthInfo() {
+    const params = {};
+    if (this.appId !== undefined) {
+      params.appId = this.appId;
+    }
+    if (this.locale !== undefined) {
+      params.locale = this.locale;
+    }
+    if (this.popupCallbackUrl !== undefined) {
+      params.popupCallbackUrl = this.popupCallbackUrl;
+    }
+    if (this.preserveUrlHash !== undefined) {
+      params.preserveUrlHash = this.preserveUrlHash;
+    }
+    if (this.usePopup !== undefined) {
+      params.popup = this.usePopup;
+    }
+    if (this.portalUrl !== undefined) {
+      params.portalUrl = this.portalUrl;
+    }
+    const info = await newIdentityOAuthInfo(params);
+    this._info = info;
+    return info;
+  }
+  async _fetchCredential() {
+    const credential = await this.identity.getCredential(`${this._info?.portalUrl}/sharing`, {
+      error: null,
+      oAuthPopupConfirmation: false,
+      token: null
+    });
+    return credential;
+  }
+  async _registerOAuth() {
+    this.identity = await importIdentityIdentityManager();
+    const info = await this._createOAuthInfo();
+    this.identity.registerOAuthInfos([info]);
+  }
+  _proxyEvents() {
+    this.identity.on("credential-create", (e) => this.credentialCreate.emit(e));
+    this.identity.on("dialog-create", (e) => this.dialogCreate.emit(e));
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "appId": ["appIdWatcher"]
+  }; }
+};
+ArcgisIdentity.style = arcgisIdentityCss;
+
+export { ArcgisIdentity as arcgis_identity };