@arcgis/lumina 4.33.0-next.94 → 4.33.0-next.96

package/dist/controllers/useT9n.d.ts

@@ -0,0 +1,48 @@
+import { GenericT9nStrings, LocaleObserver } from '@arcgis/components-utils';
+export type T9nMeta<T9nStrings extends GenericT9nStrings> = {
+    _lang: LocaleObserver["lang"];
+    _t9nLocale: LocaleObserver["t9nLocale"];
+    _loading: boolean;
+    /**
+     * The "_overrides" property won't actually exist at runtime and exists only
+     * to simplify typing like so:
+     *
+     * @example
+     * ```ts
+     *   // Type of the messageOverrides is set automatically based on _overrides:
+     *   @Prop() messageOverrides?: typeof this.messages._overrides;
+     * ```
+     */
+    _overrides: DeepPartial<T9nStrings>;
+    /**
+     * If messageOverrides are in effect, this will contain original strings
+     */
+    _original?: T9nStrings;
+};
+type DeepPartial<T> = T extends object ? {
+    [P in keyof T]?: DeepPartial<T[P]>;
+} : T;
+type Options = {
+    readonly name?: string | null;
+    /** @default false */
+    readonly blocking?: boolean;
+};
+export interface UseT9n {
+    <Strings extends GenericT9nStrings>(options: Options & {
+        readonly blocking: true;
+    }): Strings & T9nMeta<Strings>;
+    <Strings extends GenericT9nStrings>(options?: Options & {
+        readonly blocking?: false;
+    }): Partial<Strings> & T9nMeta<Strings>;
+}
+/**
+ * Load component's localization strings.
+ *
+ * Documentation: https://qawebgis.esri.com/components/lumina/controllers/useT9n
+ *
+ * Design decisions:
+ * - https://devtopia.esri.com/WebGIS/arcgis-web-components/discussions/969
+ * - https://devtopia.esri.com/WebGIS/arcgis-web-components/discussions/987
+ */
+export declare const makeT9nController: (getAssetPath: (path: string) => string) => UseT9n;
+export {};

package/dist/controllers/useWatch.d.ts

@@ -0,0 +1,27 @@
+import { BaseComponent } from './types';
+/**
+ * Dynamically set a watcher for any reactive property
+ *
+ * @example
+ * ```ts
+ * this.manager.onLifecycle(()=>
+ *   watch(this, "myProp", (newValue,oldValue)=>console.log(newValue,oldValue))
+ * )
+ * ```
+ *
+ * @remarks
+ * If you are in Lit, you should prefer the willUpdate() lifecycle method
+ * over watch(). willUpdate() is going to be more memory-efficient, and more
+ * flexible (can watch multiple props at once or provide dynamic prop name)
+ *
+ * ```ts
+ * willUpdate(changes: PropertyValues<this>) {
+ *   if (changes.has('firstName') || changes.has('lastName')) {
+ *     this.sha = computeSHA(`${this.firstName} ${this.lastName}`);
+ *   }
+ * }
+ * ```
+ *
+ * @deprecated see https://qawebgis.esri.com/components/lumina/lifecycle#willupdate and https://qawebgis.esri.com/components/lumina/controllers/lifecycle
+ */
+export declare function watch<Component extends BaseComponent, Property extends keyof Component>(component: Component, property: Property, callback: (newValue: Component[Property], oldValue: Component[Property], property: Property) => void): () => void;

package/dist/controllers/useWatchAttributes.d.ts

@@ -0,0 +1,7 @@
+import { Controller } from './Controller';
+/**
+ * Watch when given attributes change on the component element.
+ *
+ * Documentation: https://qawebgis.esri.com/components/lumina/controllers/useWatchAttributes
+ */
+export declare const useWatchAttributes: <T extends string>(attributes: readonly T[], callback: (newValue: string | null, oldValue: string | null, attribute: T) => void) => Controller;

package/dist/controllers/utils.d.ts

@@ -0,0 +1,15 @@
+import { Controller } from './Controller';
+import { ControllerLifecycleMethods } from './types';
+export declare const isController: (value: unknown) => value is ControllerLifecycleMethods;
+/**
+ * In development, on hot module reload, controller would be re-initialized
+ * with all Props and State values persistent, but properties lost. This unsafe
+ * development-only API lets you set or get data for a controller that would
+ * persist across hot reloads.
+ */
+export declare const devOnlySetPersistentControllerData: ((controller: Controller<unknown>, data: unknown) => void) | undefined;
+export declare const devOnlyGetPersistentControllerData: (<T>(controller: Controller<unknown>) => T | undefined) | undefined;
+/**
+ * Checks if the argument is a promise by checking if it has a `then` method.
+ */
+export declare function isPromise<T>(arg: Promise<T> | T): arg is Promise<T>;

package/dist/createEvent.d.ts

@@ -1,4 +1,4 @@
-import { BaseComponent, EventEmitter } from '@arcgis/components-controllers';
+import { BaseComponent, EventEmitter } from './controllers/types';
 /**
  * While these defaults don't match DOM defaults (all false), they match
  * Stencil and Shoelace defaults. Also, they make more sense for our

package/dist/decorators.d.ts

@@ -1,4 +1,4 @@
-import { LuminaPropertyDeclaration } from '@arcgis/components-controllers';
+import { LuminaPropertyDeclaration } from './controllers/types';
 export { state } from '@lit/reactive-element/decorators/state.js';
 /**
  * A class field or accessor decorator which creates a reactive property that

package/dist/index.d.ts

@@ -6,8 +6,8 @@ export type { DefineCustomElements, LazyLoadOptions, GlobalThisWithPuppeteerEnv
 export { makeDefineCustomElements } from './lazyLoad';
 export { LitElement } from './LitElement';
 export type { PublicLitElement } from './PublicLitElement';
-export type { Runtime, RuntimeOptions, DevOnlyGlobalRuntime, DevOnlyGlobalComponentRefCallback } from './runtime';
-export { makeRuntime } from './runtime';
+export type { Runtime, RuntimeOptions, DevOnlyGlobalRuntime, DevOnlyGlobalComponentRefCallback } from './makeRuntime';
+export { makeRuntime } from './makeRuntime';
 export type { EventHandler } from './jsx/baseTypes';
 export * from './jsx/types';
 export { safeClassMap, safeStyleMap, deferLoad, deferredLoaders, directive, live } from './jsx/directives';

package/dist/index.js

@@ -1,12 +1,14 @@
-import { retrieveComponent, trackKey, keyTrackResolve, useControllerManager } from "@arcgis/components-controllers";
 import { ContextProvider, ContextConsumer } from "@lit/context";
-import { isEsriInternalEnv, Deferred, camelToKebab } from "@arcgis/components-utils";
+import { r as retrieveComponent } from "./useWatch-CFtSpNnN.js";
+import { c } from "./useWatch-CFtSpNnN.js";
 import { state } from "@lit/reactive-element/decorators/state.js";
 import { property as property$1 } from "@lit/reactive-element/decorators/property.js";
 import { n as noShadowRoot, a as attachToAncestor } from "./utils-GhKD5Lo-.js";
 import { m } from "./utils-GhKD5Lo-.js";
+import { Deferred, isEsriInternalEnv, camelToKebab } from "@arcgis/components-utils";
 import { LitElement as LitElement$1, isServer, noChange as noChange$1 } from "lit";
 import { PropertyFlags } from "./config.js";
+import { u as useControllerManager } from "./ControllerManager-B2comd8J.js";
 import { classMap } from "lit-html/directives/class-map.js";
 import { styleMap } from "lit/directives/style-map.js";
 import { directive as directive$1, Directive } from "lit-html/directive.js";
@@ -24,44 +26,6 @@ function useContextConsumer(options) {
   component.addController(controller);
   return controller;
 }
-const createEventFactory = (eventName = "", options = {}, component = retrieveComponent()) => {
-  const emitter = {
-    emit: (payload) => {
-      if (process.env.NODE_ENV !== "production" && isEsriInternalEnv() && !component.el.isConnected) {
-        console.warn(`Trying to emit an ${eventName} event on a disconnected element ${component.el.localName}`);
-      }
-      if (eventName === "") {
-        keyTrackResolve();
-        if (process.env.NODE_ENV !== "production" && isEsriInternalEnv() && eventName === "") {
-          throw new Error("Unable to resolve event name from property name");
-        }
-      }
-      const event = new CustomEvent(eventName, {
-        detail: payload,
-        cancelable: true,
-        bubbles: true,
-        composed: true,
-        ...options
-      });
-      component.el.dispatchEvent(event);
-      return event;
-    }
-  };
-  if (eventName === "") {
-    trackKey(
-      void 0,
-      (resolution) => {
-        if (process.env.NODE_ENV !== "production" && isEsriInternalEnv() && resolution === void 0) {
-          throw new Error(`createEvent must be called in property default value only`);
-        }
-        eventName = resolution.key;
-      },
-      emitter
-    );
-  }
-  return emitter;
-};
-const createEvent = createEventFactory.bind(null, "");
 const property = property$1;
 const method = void 0;
 const emptyFunction = () => void 0;
@@ -249,7 +213,6 @@ class LitElement extends LitElement$1 {
     return this;
   }
 }
-LitElement.$createEvent = createEventFactory;
 if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
   const globalWithLit = globalThis;
   globalWithLit.litIssuedWarnings ??= /* @__PURE__ */ new Set();
@@ -390,7 +353,7 @@ export {
   bindBooleanAttribute,
   bindEvent,
   bindProperty,
-  createEvent,
+  c as createEvent,
   deferLoad,
   deferredLoaders,
   directive,

package/dist/lazyLoad.d.ts

@@ -1,7 +1,7 @@
 import { Deferred } from '@arcgis/components-utils';
 import { LitElement } from './LitElement';
-import { Runtime } from './runtime';
-import { ControllerManager } from '@arcgis/components-controllers';
+import { Runtime } from './makeRuntime';
+import { ControllerManager } from './controllers/ControllerManager';
 /**
  * Defines lazy-loading proxy components for all web components in this package.
  *

package/dist/makeRuntime.d.ts

@@ -0,0 +1,109 @@
+import { CSSResult } from 'lit';
+import { LitElement } from './LitElement';
+/**
+ * `@arcgis/lumina` package may be bundled once but used by multiple packages with
+ * different configuration options. For that reason, the configuration options
+ * cannot be a global object, but has to be an object that you pass around.
+ */
+export type Runtime = RuntimeOptions & {
+    /**
+     * Get the base path to where the package assets can be found.
+     * By default, the package asset path is set to `https://js.arcgis.com/<simplified-package-name>/<released-verion>/`.
+     * We are hosting our assets on a CDN (Content Delivery Network) to ensure fast and reliable access.
+     * It is CORS-enabled, so you can load the assets from any domain.
+     * Use "setAssetPath(path)" if the path needs to be customized.
+     */
+    readonly getAssetPath: (suffix: string) => string;
+    /**
+     * Used to manually set the base path where package assets (like localization
+     * and icons) can be found.
+     *
+     * By default, the package asset path is set to `https://js.arcgis.com/<simplified-package-name>/<released-verion>/`.
+     * For example, `https://js.arcgis.com/map-components/4.30/`.
+     * We are hosting our assets on a CDN (Content Delivery Network) to ensure fast and reliable access.
+     * It is CORS-enabled, so you can load the assets from any domain.
+     * This is the recommended way to load the assets and avoid bundling them with your application.
+     * It means that by default, you don't need to use "setAssetPath" since the path is already set.
+     *
+     * However, if you need to host the assets locally, you can use "setAssetPath" to set the base path.
+     * 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.
+     */
+    readonly setAssetPath: (path: URL | string) => void;
+    /**
+     * The customElement decorator. Unlike default Lit's decorator this one
+     * provides runtime instance to the LitElement class
+     *
+     * @remarks
+     * You do not need to call this decorator in your component.
+     * It will be added automatically at build time.
+     *
+     * Instead, make sure your component file has the following:
+     * ```ts
+     * declare global {
+     *  interface DeclareElements {
+     *      "arcgis-your-component": ArcgisYourComponent;
+     *   }
+     * }
+     * ```
+     */
+    readonly customElement: (tagName: string, component: typeof LitElement) => void;
+};
+export type RuntimeOptions = {
+    /**
+     * The default asset path to use in NPM and CDN builds.
+     *
+     * This option will be set by Lumina compiler based on the value of the
+     * `assets.defaultPath` option in the `useLumina()` plugin.
+     */
+    readonly defaultAssetPath: string;
+    /**
+     * The attribute that indicates a component has rendered it's content.
+     * Usually this attribute is added after your component's `loaded()` lifecycle
+     * happened. However, during SSR, "hydrated" is added right away on the
+     * server.
+     *
+     * Until element has this attribute, it will have `visibility:hidden` style
+     * applied.
+     *
+     * This option will be set by the Lumina compiler based on the value of
+     * the `css.hydratedAttribute` option in the `useLumina()` plugin.
+     */
+    readonly hydratedAttribute: string;
+    /**
+     * Styles that you wish to make available in each component's shadow root, but
+     * to not apply outside the shadow root
+     *
+     * This option will be set by Lumina compiler based on the value of the
+     * `css.commonStylesPath` option in the `useLumina()` plugin.
+     */
+    readonly commonStyles?: CSSResult;
+};
+/**
+ * The options object will be provided by Lumina compiler at build-time.
+ * It should not be specified in the source code.
+ */
+export declare function makeRuntime(options?: RuntimeOptions): Runtime;
+/**
+ * Exposing the reference to the runtime globally when in tests or development.
+ * This is primarily for usage by dynamically created components in tests
+ *
+ * @private
+ */
+export type DevOnlyGlobalRuntime = typeof globalThis & {
+    devOnly$luminaRuntime?: Runtime;
+};
+/**
+ * Called from the component constructor when in development or test mode.
+ * Used primarily by mount to get a reference to the rendered component.
+ *
+ * @private
+ */
+export type DevOnlyGlobalComponentRefCallback = typeof globalThis & {
+    devOnly$luminaComponentRefCallback?: (component: LitElement) => void;
+};

package/dist/proxyExports-Dl5CHmHQ.js

@@ -0,0 +1,150 @@
+import { r as retrieveComponent, f as trackPropKey, o as devOnlyGetPersistentControllerData, p as shouldBypass, a as setParentController, b as retrieveParentControllers, q as setAmbientChildController, t as trackKey, w as watch } from "./useWatch-CFtSpNnN.js";
+import { isEsriInternalEnv } from "@arcgis/components-utils";
+function getSet(defaultValue, getSet2) {
+  const component = retrieveComponent();
+  return trackPropKey(
+    component,
+    (rawName) => {
+      if (process.env.NODE_ENV !== "production" && isEsriInternalEnv() && rawName === void 0) {
+        throw new Error(
+          "Unable to resolve get/set's prop name. Make sure you are using it like @Prop() someProp = getSet(defaultValue,{get,set})"
+        );
+      }
+      const name = rawName;
+      const manager = component.manager;
+      const genericComponent = component;
+      const value = genericComponent[name];
+      const isStencilHotReload = process.env.NODE_ENV !== "production" && isEsriInternalEnv() && !manager.isLit && devOnlyGetPersistentControllerData?.(manager) === true;
+      if (value != null && value !== defaultValue && typeof getSet2.set === "function" && !isStencilHotReload) {
+        const newValue = getSet2.set(value, defaultValue, name);
+        if (newValue !== value) {
+          if (manager.isLit) {
+            genericComponent[name] = newValue;
+          } else {
+            let firstConnected = true;
+            manager.onConnected(() => {
+              if (!firstConnected) {
+                return;
+              }
+              firstConnected = true;
+              bypassSetter(() => {
+                genericComponent[name] = newValue;
+              });
+            });
+          }
+        }
+      }
+      genericGetSet(component, name, getSet2);
+    },
+    defaultValue
+  );
+}
+const dynamicGetSet = (component, property, getSet2) => genericGetSet(component, property, getSet2);
+function bypassSetter(callback) {
+  shouldBypass.setter = true;
+  try {
+    return callback();
+  } finally {
+    shouldBypass.setter = false;
+  }
+}
+function bypassGetter(callback) {
+  shouldBypass.getter = true;
+  try {
+    return callback();
+  } finally {
+    shouldBypass.getter = false;
+  }
+}
+function genericGetSet(component, property, getSet2) {
+  const genericGetSet2 = getSet2;
+  const internals = component.manager.internals;
+  const get = typeof genericGetSet2.get === "function" ? genericGetSet2.get : void 0;
+  if (get) {
+    internals.getters[property] ??= [];
+    internals.getters[property].unshift(get);
+  }
+  const set = genericGetSet2.set === "ignore" ? ignoreSet : genericGetSet2.set;
+  if (set) {
+    internals.setters[property] ??= [];
+    internals.setters[property].unshift(
+      set
+    );
+  }
+}
+const ignoreSet = (_, value) => value;
+function readonly(value) {
+  const component = retrieveComponent();
+  return getSet(value, { set: component.manager.internals.readonlySetter });
+}
+function bypassReadOnly(callback) {
+  shouldBypass.readOnly = true;
+  try {
+    return callback();
+  } finally {
+    shouldBypass.readOnly = false;
+  }
+}
+const proxyExports = (Class) => (...args) => {
+  const ambientControllers = retrieveParentControllers();
+  const instance = new Class(...args);
+  const initialExports = instance.exports;
+  setParentController(ambientControllers.at(-1));
+  const internals = instance.component.manager.internals;
+  internals.markExports(instance, initialExports);
+  instance.watchExports((exports) => internals.markExports(instance, exports));
+  setAmbientChildController(instance);
+  const hostCandidates = [instance.component, ...ambientControllers].reverse();
+  return trackKey(
+    hostCandidates,
+    (resolution) => resolution === void 0 ? void 0 : setProxy(instance, resolution, initialExports),
+    initialExports
+  );
+};
+function setProxy(controller, { host, key, isReactive: assignedToProp }, initialExports) {
+  const genericHost = host;
+  const controllerValueChanged = genericHost[key] !== controller.exports;
+  const hostValueChanged = genericHost[key] !== initialExports;
+  const controllerUpdatedExports = initialExports !== controller.exports;
+  if (controllerValueChanged && !hostValueChanged && controllerUpdatedExports) {
+    genericHost[key] = controller.exports;
+  }
+  const isProxyExportsOnComponent = host === controller.component;
+  if (isProxyExportsOnComponent) {
+    if (assignedToProp) {
+      const internals = controller.component.manager.internals;
+      if (hostValueChanged) {
+        internals.markExports(controller, genericHost[key]);
+      }
+      watch(controller.component, key, (value) => {
+        if (value !== controller.exports) {
+          internals.markExports(controller, value);
+        }
+      });
+    }
+    controller.assignedProperty = assignedToProp ? void 0 : key;
+  }
+  controller.watchExports(() => {
+    if (genericHost[key] === controller.exports) {
+      return;
+    }
+    const manager = controller.component.manager;
+    const isReadOnly = manager.internals.setters[key]?.includes(manager.internals.readonlySetter);
+    if (isReadOnly) {
+      bypassReadOnly(() => {
+        genericHost[key] = controller.exports;
+      });
+    } else {
+      genericHost[key] = controller.exports;
+    }
+  });
+}
+export {
+  bypassGetter as a,
+  bypassReadOnly as b,
+  bypassSetter as c,
+  dynamicGetSet as d,
+  getSet as g,
+  proxyExports as p,
+  readonly as r
+};

package/dist/runtime.d.ts

@@ -1,109 +1,6 @@
-import { CSSResult } from 'lit';
-import { LitElement } from './LitElement';
+export declare const runtime: import('./makeRuntime').Runtime;
 /**
- * `@arcgis/lumina` package may be bundled once but used by multiple packages with
- * different configuration options. For that reason, the configuration options
- * cannot be a global object, but has to be an object that you pass around.
+ * "customElement" needs to be exported - it will be used by the build system.
+ * You should not call it directly.
  */
-export type Runtime = RuntimeOptions & {
-    /**
-     * Get the base path to where the package assets can be found.
-     * By default, the package asset path is set to `https://js.arcgis.com/<simplified-package-name>/<released-verion>/`.
-     * We are hosting our assets on a CDN (Content Delivery Network) to ensure fast and reliable access.
-     * It is CORS-enabled, so you can load the assets from any domain.
-     * Use "setAssetPath(path)" if the path needs to be customized.
-     */
-    readonly getAssetPath: (suffix: string) => string;
-    /**
-     * Used to manually set the base path where package assets (like localization
-     * and icons) can be found.
-     *
-     * By default, the package asset path is set to `https://js.arcgis.com/<simplified-package-name>/<released-verion>/`.
-     * For example, `https://js.arcgis.com/map-components/4.30/`.
-     * We are hosting our assets on a CDN (Content Delivery Network) to ensure fast and reliable access.
-     * It is CORS-enabled, so you can load the assets from any domain.
-     * This is the recommended way to load the assets and avoid bundling them with your application.
-     * It means that by default, you don't need to use "setAssetPath" since the path is already set.
-     *
-     * However, if you need to host the assets locally, you can use "setAssetPath" to set the base path.
-     * 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.
-     */
-    readonly setAssetPath: (path: URL | string) => void;
-    /**
-     * The customElement decorator. Unlike default Lit's decorator this one
-     * provides runtime instance to the LitElement class
-     *
-     * @remarks
-     * You do not need to call this decorator in your component.
-     * It will be added automatically at build time.
-     *
-     * Instead, make sure your component file has the following:
-     * ```ts
-     * declare global {
-     *  interface DeclareElements {
-     *      "arcgis-your-component": ArcgisYourComponent;
-     *   }
-     * }
-     * ```
-     */
-    readonly customElement: (tagName: string, component: typeof LitElement) => void;
-};
-export type RuntimeOptions = {
-    /**
-     * The default asset path to use in NPM and CDN builds.
-     *
-     * This option will be set by Lumina compiler based on the value of the
-     * `assets.defaultPath` option in the `useLumina()` plugin.
-     */
-    readonly defaultAssetPath: string;
-    /**
-     * The attribute that indicates a component has rendered it's content.
-     * Usually this attribute is added after your component's `loaded()` lifecycle
-     * happened. However, during SSR, "hydrated" is added right away on the
-     * server.
-     *
-     * Until element has this attribute, it will have `visibility:hidden` style
-     * applied.
-     *
-     * This option will be set by the Lumina compiler based on the value of
-     * the `css.hydratedAttribute` option in the `useLumina()` plugin.
-     */
-    readonly hydratedAttribute: string;
-    /**
-     * Styles that you wish to make available in each component's shadow root, but
-     * to not apply outside the shadow root
-     *
-     * This option will be set by Lumina compiler based on the value of the
-     * `css.commonStylesPath` option in the `useLumina()` plugin.
-     */
-    readonly commonStyles?: CSSResult;
-};
-/**
- * The options object will be provided by Lumina compiler at build-time.
- * It should not be specified in the source code.
- */
-export declare function makeRuntime(options?: RuntimeOptions): Runtime;
-/**
- * Exposing the reference to the runtime globally when in tests or development.
- * This is primarily for usage by dynamically created components in tests
- *
- * @private
- */
-export type DevOnlyGlobalRuntime = typeof globalThis & {
-    devOnly$luminaRuntime?: Runtime;
-};
-/**
- * Called from the component constructor when in development or test mode.
- * Used primarily by mount to get a reference to the rendered component.
- *
- * @private
- */
-export type DevOnlyGlobalComponentRefCallback = typeof globalThis & {
-    devOnly$luminaComponentRefCallback?: (component: LitElement) => void;
-};
+export declare const customElement: (tagName: string, component: typeof import('./LitElement').LitElement) => void;