@arcgis/lumina 4.33.0-next.99 → 4.34.0-next.0

package/dist/wrappersUtils.d.ts

@@ -27,7 +27,19 @@ export declare const makeReactWrapperFactory: (react: unknown, createComponent:
  *
  * @private
  */
-export declare const getReactWrapperOptions: <Element extends HTMLElement, Events extends EventNames>(tagNameAndElement: Element, events: Events) => Options<Element & {
+export declare const getReactWrapperOptions: <Element extends HTMLElement, Events extends EventNames>(
+/**
+ * We want "Events" type argument to be inferred, but Element type
+ * argument to be explicitly specified. That isn't possible until
+ * https://github.com/microsoft/TypeScript/issues/26242.
+ *
+ * As a workaround we are making Element inferred by passing Element type as
+ * a tag name:
+ * ```ts
+ * getReactWrapperOptions("te-st" as HTMLTeStElement, {});
+ * ```
+ */
+tagNameAndElement: Element, events: Events) => Options<Element & {
     class?: string;
 }, Events>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcgis/lumina",
-  "version": "4.33.0-next.99",
+  "version": "4.34.0-next.0",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -22,12 +22,12 @@
   ],
   "license": "SEE LICENSE IN LICENSE.md",
   "dependencies": {
-    "@arcgis/components-utils": "4.33.0-next.99",
+    "@arcgis/components-utils": "4.34.0-next.0",
     "@lit-labs/ssr": "^3.2.2",
     "@lit-labs/ssr-client": "^1.1.7",
-    "@lit/context": "^1.1.3",
+    "@lit/context": "^1.1.5",
     "csstype": "^3.1.3",
-    "lit": "^3.2.0",
-    "tslib": "^2.7.0"
+    "lit": "^3.3.0",
+    "tslib": "^2.8.1"
   }
 }

package/dist/utils-DBdf1Dqp.js

@@ -1,405 +0,0 @@
-import { Deferred, isEsriInternalEnv, camelToKebab } from "@arcgis/components-utils";
-import { lazyMetaSubItemJoiner, lazyMetaGroupJoiner, lazyMetaItemJoiner } from "./config.js";
-function devOnlyDetectIncorrectLazyUsages(LitClass) {
-  const genericPrototype = LitClass.prototype;
-  const descriptor = Object.getOwnPropertyDescriptor(genericPrototype, "innerText");
-  if (descriptor !== void 0 && descriptor.set?.name === "setWrapper") {
-    return;
-  }
-  const allowList = /* @__PURE__ */ new Set([
-    // We shouldn't be overwriting this property
-    "constructor",
-    // Called by Lit - we proxy it to this.el in ProxyComponent
-    "setAttribute",
-    // Called by Lit SSR - we proxy it to this.el in ProxyComponent
-    "removeAttribute",
-    // Called by Lit - we proxy it to this.el in ProxyComponent
-    "isConnected",
-    // Called by Lit, but only in dev mode for warnings, so we don't have to proxy.
-    "localName",
-    // Called by Lit Context - we proxy it to this.el in ProxyComponent.
-    // Interestingly, they never call removeEventListener.
-    "addEventListener"
-  ]);
-  const customErrorMessages = {
-    addEventListener: "use this.listen() or this.el.addEventListener()"
-  };
-  Object.entries({
-    ...Object.getOwnPropertyDescriptors(HTMLElement.prototype),
-    ...Object.getOwnPropertyDescriptors(Element.prototype),
-    ...Object.getOwnPropertyDescriptors(Node.prototype),
-    ...Object.getOwnPropertyDescriptors(EventTarget.prototype)
-  }).forEach(([key, value]) => {
-    if (allowList.has(key)) {
-      return;
-    }
-    function validateUsage(...args) {
-      const isDynamicallyCreatedComponentInTest = this === this.el;
-      if (isDynamicallyCreatedComponentInTest) {
-        return;
-      }
-      if (key === "hasAttribute" && args[0] === "defer-hydration") {
-        return false;
-      }
-      throw new Error(
-        `You should not be trying to access this.${key} directly as it won't work correctly in lazy-builds. Instead, ${customErrorMessages[key] ?? `use this.el.${key}`}`
-      );
-    }
-    if (typeof value.value === "function") {
-      genericPrototype[key] = function functionWrapper(...args) {
-        return validateUsage.call(this, ...args) ?? value.value.call(this, ...args);
-      };
-    } else if (typeof value.get === "function") {
-      Object.defineProperty(genericPrototype, key, {
-        get() {
-          validateUsage.call(this);
-          return value.get.call(this);
-        },
-        set: typeof value.set === "function" ? function setWrapper(setValue) {
-          validateUsage.call(this);
-          value.set.call(this, setValue);
-        } : void 0
-      });
-    } else if (key === key.toUpperCase() && typeof value.value === "number") {
-      return;
-    } else {
-      throw new Error(`Unexpected value type for ${key}: ${value}`);
-    }
-  });
-}
-function attachToAncestor(child) {
-  let ancestor = child;
-  while (ancestor = ancestor.parentNode ?? ancestor.host) {
-    if (ancestor?.constructor?.lumina) {
-      const litParent = ancestor;
-      if (!litParent.manager?.loadedCalled) {
-        litParent._offspring.push(child);
-      }
-      return litParent._postLoad.promise;
-    }
-  }
-  return false;
-}
-const makeDefineCustomElements = (runtime, structure) => function defineCustomElements(windowOrOptions, options) {
-  if (!globalThis.customElements) {
-    return;
-  }
-  const resolvedOptions = options ?? windowOrOptions ?? {};
-  const resourcesUrl = resolvedOptions.resourcesUrl;
-  if (resourcesUrl) {
-    runtime.setAssetPath(resourcesUrl);
-  }
-  Object.entries(structure).forEach(createLazyElement);
-};
-function createLazyElement([tagName, [load, compactMeta = ""]]) {
-  if (customElements.get(tagName)) {
-    return;
-  }
-  const [compactObservedProps, compactAsyncMethods, compactSyncMethods] = compactMeta.split(lazyMetaGroupJoiner);
-  const observedProps = compactObservedProps ? compactObservedProps?.split(lazyMetaItemJoiner).map(parseCondensedProp) : void 0;
-  const observedProperties = observedProps?.map(([property]) => property);
-  const ProxyClass = class extends ProxyComponent {
-    static {
-      this.observedAttributes = observedProps?.map(([, attribute]) => attribute).filter((attribute) => attribute !== "");
-    }
-    static {
-      this._properties = observedProperties;
-    }
-    static {
-      this._asyncMethods = compactAsyncMethods ? compactAsyncMethods?.split(lazyMetaItemJoiner) : void 0;
-    }
-    static {
-      this._syncMethods = compactSyncMethods?.split(lazyMetaItemJoiner);
-    }
-    static {
-      this._name = tagName;
-    }
-    constructor() {
-      const isFirstInstanceOfType = !ProxyClass._loadPromise;
-      if (isFirstInstanceOfType) {
-        ProxyClass._loadPromise = load();
-        ProxyClass._initializePrototype();
-      }
-      super();
-    }
-  };
-  customElements.define(tagName, ProxyClass);
-  if (process.env.NODE_ENV !== "production") {
-    globalThis.devOnly$ownTagNames?.add(tagName);
-  }
-}
-const defineProperty = Object.defineProperty;
-function parseCondensedProp(propAndAttribute) {
-  const name = propAndAttribute.split(lazyMetaSubItemJoiner);
-  return name.length === 1 ? [name[0], camelToKebab(name[0])] : name;
-}
-const HtmlElement = globalThis.HTMLElement ?? parseCondensedProp;
-class ProxyComponent extends HtmlElement {
-  constructor() {
-    super();
-    this._store = {};
-    this._pendingAttributes = [];
-    this._postLoad = new Deferred();
-    this._postLoaded = new Deferred();
-    this._offspring = [];
-    if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
-      this._hmrSetProps = /* @__PURE__ */ new Set();
-      this._hmrSetAttributes = /* @__PURE__ */ new Set();
-      globalThis.devOnly$createdElements ??= [];
-      globalThis.devOnly$createdElements.push(new WeakRef(this));
-    }
-    this._saveInstanceProperties();
-    const ProxyClass = this.constructor;
-    if (ProxyClass._LitConstructor) {
-      this._initializeComponent({ a: ProxyClass._LitConstructor });
-    } else {
-      void ProxyClass._loadPromise.then(awaitTopLevelPolyfill).then(this._initializeComponent.bind(this)).catch((error) => {
-        this._postLoaded.reject(error);
-        setTimeout(() => {
-          throw error;
-        });
-      });
-    }
-    if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
-      ProxyClass._hmrInstances ??= [];
-      ProxyClass._hmrInstances.push(new WeakRef(this));
-      Object.defineProperty(this, "_store", { value: this._store, enumerable: false, configurable: true });
-    }
-  }
-  static {
-    this.lumina = true;
-  }
-  /** private */
-  static _initializePrototype() {
-    this._properties?.forEach(this._bindProp, this);
-    this._asyncMethods?.forEach(this._bindAsync, this);
-    this._syncMethods?.forEach(this._bindSync, this);
-  }
-  static _bindProp(propName) {
-    defineProperty(this.prototype, propName, {
-      configurable: true,
-      enumerable: true,
-      get() {
-        return this._store[propName];
-      },
-      set(value) {
-        this._store[propName] = value;
-        if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
-          this._hmrSetProps.add(propName);
-        }
-      }
-    });
-  }
-  static _bindAsync(methodName) {
-    defineProperty(this.prototype, methodName, {
-      async value(...args) {
-        if (!this._litElement) {
-          await this._postLoaded.promise;
-        }
-        const genericLitElement = this._litElement;
-        return await genericLitElement[methodName](...args);
-      },
-      configurable: true
-    });
-  }
-  static _bindSync(methodName) {
-    defineProperty(this.prototype, methodName, {
-      value(...args) {
-        if (process.env.NODE_ENV !== "production" && !this._litElement) {
-          const ProxyClass = this.constructor;
-          throw new Error(
-            `Tried to call method ${methodName}() on <${ProxyClass._name}> component before it's fully loaded. Please do 'await component.componentOnReady();' before calling this method.`
-          );
-        }
-        const genericLitElement = this._litElement;
-        return genericLitElement[methodName](...args);
-      },
-      configurable: true
-    });
-  }
-  get manager() {
-    return this._litElement?.manager;
-  }
-  /**
-   * Until the custom element is registered on the page, an instance of that
-   * element can be constructed and some properties on that instance set.
-   *
-   * These properties are set before the element prototype is set to this proxy
-   * class and thus none of our getters/setters are yet registered - such
-   * properties will be set by JavaScript on the instance directly.
-   *
-   * Once element is registered, the properties set in the meanwhile will shadow
-   * the getter/setters, and thus break reactivity. The fix is to delete these
-   * properties from the instance, and re-apply them once accessors are set.
-   *
-   * @example
-   * ```ts
-   * import { defineCustomElements } from '@arcgis/map-components';
-   * const map = document.createElement('arcgis-map');
-   * // This will shadow the getter/setters
-   * map.itemId = '...';
-   * // This finally defines the custom elements and sets the property accessors
-   * defineCustomElements();
-   * ```
-   *
-   * @remarks
-   * This is an equivalent of the __saveInstanceProperties method in Lit's
-   * ReactiveElement. Lit takes care of this on LitElement, but we have to take
-   * care of this on the lazy proxy
-   */
-  _saveInstanceProperties() {
-    const ProxyClass = this.constructor;
-    const genericThis = this;
-    ProxyClass._properties?.forEach((propName) => {
-      if (Object.hasOwn(this, propName)) {
-        this._store[propName] = genericThis[propName];
-        delete genericThis[propName];
-      }
-    });
-  }
-  /*
-   * This method must be statically present rather than added later, or else,
-   * browsers won't call it. Same for connected and disconnected callbacks.
-   */
-  attributeChangedCallback(name, oldValue, newValue) {
-    this._litElement?.attributeChangedCallback(name, oldValue, newValue);
-    if (!this._litElement) {
-      this._pendingAttributes.push(name);
-    }
-    if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
-      this._hmrSetAttributes.add(name);
-    }
-  }
-  connectedCallback() {
-    if (this._litElement) {
-      this._litElement.connectedCallback?.();
-    } else {
-      queueMicrotask(() => {
-        this._ancestorLoad = attachToAncestor(this);
-      });
-    }
-  }
-  disconnectedCallback() {
-    this._litElement?.disconnectedCallback?.();
-  }
-  /**
-   * Create a promise that resolves once component is fully loaded
-   */
-  async componentOnReady() {
-    await this._postLoaded.promise;
-    return this;
-  }
-  /** private */
-  _initializeComponent(module) {
-    const ProxyClass = this.constructor;
-    const tagName = ProxyClass._name;
-    const store = this._store;
-    const LitConstructor = Object.values(module).find(
-      (LitConstructor2) => LitConstructor2.tagName === tagName
-    );
-    if (process.env.NODE_ENV !== "production" && isEsriInternalEnv() && !LitConstructor) {
-      throw new Error(
-        `Unable to find the LitElement class for the "${tagName}" custom element in the lazy-loaded module`
-      );
-    }
-    const lazyTagName = process.env.NODE_ENV !== "production" && isEsriInternalEnv() ? (ProxyClass._hmrIndex ?? 0) === 0 ? `${tagName}--lazy` : `${tagName}--lazy-${ProxyClass._hmrIndex}` : `${tagName}--lazy`;
-    let parentClass = LitConstructor;
-    while (parentClass && !Object.hasOwn(parentClass, "lumina")) {
-      parentClass = Object.getPrototypeOf(parentClass);
-    }
-    patchLitElement(parentClass);
-    const isFirstInitialization = !ProxyClass._LitConstructor;
-    if (isFirstInitialization) {
-      ProxyClass._LitConstructor = LitConstructor;
-      customElements.define(lazyTagName, LitConstructor);
-    }
-    LitConstructor.lazy = this;
-    const litElement = document.createElement(lazyTagName);
-    LitConstructor.lazy = void 0;
-    if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
-      Object.defineProperty(this, "_litElement", { value: litElement, configurable: true, enumerable: false });
-    } else {
-      this._litElement = litElement;
-    }
-    this._store = litElement;
-    this._pendingAttributes.forEach((name) => {
-      const value = this.getAttribute(name);
-      litElement.attributeChangedCallback(
-        name,
-        // Lit doesn't look at this value, thus even if attribute already exists, that's ok
-        null,
-        value
-      );
-    });
-    Object.entries(store).forEach(syncLitElement, litElement);
-    if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
-      const litObserved = LitConstructor.observedAttributes ?? [];
-      const lazyObserved = ProxyClass.observedAttributes ?? [];
-      const missingFromLazy = litObserved.filter((attribute) => !lazyObserved.includes(attribute));
-      const missingFromLit = lazyObserved.filter((attribute) => !litObserved.includes(attribute));
-      if (missingFromLazy.length > 0) {
-        console.warn(
-          `The following attributes on <${ProxyClass._name}> are present on the Lit element, but are missing from the lazy proxy component: ${missingFromLazy.join(", ")}. This either indicates a bug in Lumina, or you are creating the attribute dynamically in a way that compiler cannot infer statically. For these attributes, lazy-loading version of your component won't work correctly, thus this must be resolved`
-        );
-      }
-      if (missingFromLit.length > 0) {
-        console.warn(
-          `The following attributes on <${ProxyClass._name}> are defined on the lazy proxy component, but not on the actual Lit element: ${missingFromLit.join(", ")}. This either indicates a bug in Lumina, or you are creating the attribute dynamically in a way that compiler cannot infer statically. This is a non-critical issue, but does indicate that something is going wrong and should be fixed`
-        );
-      }
-    }
-    const isStillConnected = this.isConnected;
-    if (isStillConnected || this._ancestorLoad) {
-      litElement.connectedCallback?.();
-      if (!isStillConnected) {
-        litElement.disconnectedCallback();
-      }
-    }
-  }
-  /**
-   * Implemented on the proxy for compatibility with Lit Context.
-   */
-  addController() {
-  }
-  /**
-   * Implemented on the proxy for compatibility with Lit Context.
-   */
-  requestUpdate() {
-    this._litElement?.requestUpdate();
-  }
-}
-function syncLitElement([key, value]) {
-  this[key] = value;
-}
-function patchLitElement(parentClass) {
-  const litElementPrototype = parentClass.prototype;
-  const elementPrototype = Element.prototype;
-  const alreadyPatched = Object.hasOwn(litElementPrototype, "isConnected");
-  if (!alreadyPatched) {
-    litElementPrototype.setAttribute = function(qualifiedName, value) {
-      elementPrototype.setAttribute.call(this.el, qualifiedName, value);
-    };
-    litElementPrototype.removeAttribute = function(qualifiedName) {
-      elementPrototype.removeAttribute.call(this.el, qualifiedName);
-    };
-    defineProperty(litElementPrototype, "isConnected", {
-      get() {
-        return Reflect.get(elementPrototype, "isConnected", this.el);
-      }
-    });
-  }
-  if (process.env.NODE_ENV !== "production" && isEsriInternalEnv()) {
-    devOnlyDetectIncorrectLazyUsages(parentClass);
-  }
-}
-const awaitTopLevelPolyfill = async (module) => {
-  await module.$$;
-  return module;
-};
-const noShadowRoot = {};
-export {
-  ProxyComponent as P,
-  attachToAncestor as a,
-  makeDefineCustomElements as m,
-  noShadowRoot as n
-};