@arcgis/coding-components 4.31.0-next.2 → 4.31.0-next.21

package/dist/components/chunk-2JTWBRMN.js

@@ -0,0 +1,1154 @@
+/*!
+ * All material copyright Esri, All Rights Reserved, unless otherwise specified.
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.21
+ */
+import { a as isNotUndefined, D as Deferred, k as safeAsyncCall, l as devToolsAwareTimeout, m as safeCall } from './index2.js';
+
+// src/framework.ts
+function retrieveComponentMembers(component, isLit) {
+  if (isLit) {
+    const elementProperties = component.constructor.elementProperties;
+    component.manager.internals.members = Object.fromEntries(
+      Array.from(
+        elementProperties,
+        ([name, descriptor]) => descriptor.noAccessor ? void 0 : [
+          name,
+          [
+            (descriptor.readOnly ? 2048 /* ReadOnly */ : 0) | (descriptor.state ? 32 /* State */ : descriptor.type === Number ? 2 /* Number */ : descriptor.type === Boolean ? 4 /* Boolean */ : 1 /* String */)
+          ]
+        ]
+      ).filter(isNotUndefined)
+    );
+  } else {
+    const constructor = component.constructor;
+    const members = constructor.__registerControllers?.(component) ?? void 0;
+    constructor.__registerControllers = void 0;
+    if (typeof members !== "object") {
+      throw new Error(
+        "Failed to retrieve component meta" 
+      );
+    }
+    component.manager.internals.members = Object.fromEntries(
+      Object.entries(members).filter(([_name, [propType]]) => (propType & 63 /* PropLike */) !== 0)
+    );
+  }
+}
+function parsePropertyValue(value, type = 8 /* Any */) {
+  const isComplex = value == null || typeof value === "object" || typeof value === "function";
+  if (isComplex) {
+    return value;
+  }
+  if ((type & 4 /* Boolean */) !== 0) {
+    return value === "false" ? false : value === "" || !!value;
+  } else if ((type & 2 /* Number */) !== 0) {
+    return Number.parseFloat(value);
+  } else if ((type & 1 /* String */) !== 0) {
+    return String(value);
+  } else {
+    return value;
+  }
+}
+var getMemberType = (component, name) => component.manager.internals.members?.[name]?.[0];
+
+// src/types.ts
+var controllerSymbol = Symbol.for("controller");
+
+// src/utils.ts
+var isController = (value) => typeof value === "object" && value !== null && (controllerSymbol in value || "hostConnected" in value || "hostDisconnected" in value || "hostUpdate" in value || "hostUpdated" in value);
+
+// src/ControllerInternals.ts
+var ambientComponent;
+function setAmbientComponent(component) {
+  if (ambientComponent === component) {
+    return;
+  }
+  ambientComponent = component;
+  queueMicrotask(() => {
+    if (ambientComponent === component) {
+      ambientComponent = void 0;
+    }
+  });
+}
+function retrieveComponent(name2) {
+  return ambientComponent;
+}
+var ambientControllers = [];
+function setParentController(controller) {
+  if (controller === void 0) {
+    ambientControllers = [];
+    return;
+  }
+  const index = ambientControllers.indexOf(controller);
+  ambientControllers = index === -1 ? [...ambientControllers, controller] : ambientControllers.slice(0, index + 1);
+  queueMicrotask(() => {
+    ambientControllers = [];
+  });
+}
+function retrieveParentControllers() {
+  return ambientControllers;
+}
+var ambientChildController;
+function setAmbientChildController(controller) {
+  if (ambientChildController === controller) {
+    return;
+  }
+  ambientChildController = controller;
+  queueMicrotask(() => {
+    if (ambientChildController === controller) {
+      ambientChildController = void 0;
+    }
+  });
+}
+function retrieveAmbientChildController() {
+  const controller = ambientChildController;
+  ambientChildController = void 0;
+  return controller;
+}
+var use = async (value, watchExports) => {
+  const controller = useRefSync(value);
+  if (controller === void 0) {
+    return value;
+  }
+  await controller.ready;
+  if (typeof watchExports === "function") {
+    const unsubscribe = controller.watchExports(
+      (exports) => watchExports(exports, unsubscribe)
+    );
+  }
+  return controller.exports;
+};
+var useRef = async (value) => {
+  const controller = useRefSync(value);
+  await controller.ready;
+  return controller;
+};
+var useRefSync = (value) => {
+  const ambientChildController2 = retrieveAmbientChildController();
+  if (ambientChildController2 !== void 0) {
+    return ambientChildController2;
+  }
+  const component = retrieveComponent();
+  const controller = component.manager.internals.resolveExports(value);
+  if (controller !== void 0) {
+    return controller;
+  }
+  if (isController(value)) {
+    return value;
+  }
+  return void 0;
+};
+var shouldBypass = {
+  setter: false,
+  getter: false,
+  readOnly: false
+};
+var elementToInstance = /* @__PURE__ */ new WeakMap();
+var _a;
+_a = controllerSymbol;
+var Controller = class {
+  constructor(component) {
+    this._callbacks = {
+      hostConnected: [],
+      hostDisconnected: [],
+      hostLoad: [],
+      hostLoaded: [],
+      hostUpdate: [],
+      hostUpdated: [],
+      hostDestroy: [],
+      hostLifecycle: []
+    };
+    this._ready = new Deferred();
+    this._lifecycleCleanups = [];
+    this.connectedCalled = false;
+    this.willLoadCalled = false;
+    this.didLoadCalled = false;
+    this[_a] = true;
+    this.ready = this._ready.promise;
+    /*
+     * Setting default exports to "this" so that controllers that don't use
+     * exports/proxyExports(), could still be used as if they did
+     * (i.e with controller.use)
+     */
+    this._exports = makeProvisionalValue(this);
+    this._exportWatchers = /* @__PURE__ */ new Set();
+    const resolvedComponent = toControllerHost(component ?? retrieveComponent());
+    {
+      this.component = resolvedComponent;
+    }
+    this.component.addController(this);
+    setParentController(this);
+    const manager = this.component.manager;
+    const isInControllerManager = manager === void 0;
+    if (!isInControllerManager) {
+      queueMicrotask(() => this.catchUpLifecycle());
+    }
+  }
+  /**
+   * If controller is being added dynamically, after the component
+   * construction, then trigger connected and load right away
+   */
+  catchUpLifecycle() {
+    const { manager } = this.component;
+    const connectedWillStillHappen = !manager.connectedCalled;
+    if (!connectedWillStillHappen && !this.connectedCalled) {
+      this.triggerConnected();
+    }
+    const loadWillStillHappen = !manager.willLoadCalled;
+    if (loadWillStillHappen) {
+      return;
+    }
+    this.triggerLoad().then(() => {
+      const loadedWillStillHappen = !manager.didLoadCalled;
+      if (loadedWillStillHappen) {
+        return;
+      }
+      this.triggerLoaded();
+    }).catch(console.error);
+  }
+  get exports() {
+    return this._exports;
+  }
+  /**
+   * Set controller's exports property (for usage with proxyExports()) and mark
+   * controller as ready (for usage in other controllers). Also, triggers
+   * re-render of the component
+   */
+  set exports(exports) {
+    const oldExports = this._exports;
+    if (oldExports !== exports) {
+      this._exports = exports;
+      this._exportWatchers.forEach(safeCall);
+      if (this.connectedCalled && this.assignedProperty !== false) {
+        this.component.requestUpdate(this.assignedProperty, oldExports);
+      }
+    }
+    this._ready.resolve(exports);
+  }
+  setProvisionalExports(exports) {
+    this._exports = makeProvisionalValue(exports);
+    this._exportWatchers.forEach(safeCall);
+  }
+  watchExports(callback) {
+    const safeCallback = () => callback(this._exports);
+    this._exportWatchers.add(safeCallback);
+    return () => void this._exportWatchers.delete(safeCallback);
+  }
+  /**
+   * A flexible utility for making sure a controller is loaded before it's used,
+   * regardless of how or where a controller was defined:
+   *
+   * @example
+   * makeGenericController(async (component, controller) => {
+   *   // Await some controller from the component:
+   *   await controller.use(component.someController);
+   *   // Initialize new controllers
+   *   await controller.use(load(importCoreReactiveUtils));
+   *   await controller.use(new ViewModelController(component,newWidgetsHomeHomeViewModel));
+   *   await controller.use(someController(component));
+   * });
+   *
+   * @remarks
+   * If your controller is not async, and you are not creating it async, then
+   * you are not required to use controller.use - you can use it directly.
+   * Similarly, accessing controllers after componentWillLoad callback does not
+   * require awaiting them as they are guaranteed to be loaded by then.
+   */
+  get use() {
+    setAmbientComponent(this.component);
+    return use;
+  }
+  /**
+   * Just like controller.use, but returns the controller itself, rather than it's
+   * exports
+   *
+   * Use cases:
+   * - You have a controller and you want to make sure it's loaded before you
+   *   try to use it
+   * - Your controller is not using exports, so you wish to access some props on
+   *   it directly
+   * - You have a controller exports only, and you want to retrieve the
+   *   controller itself. This is useful if you wish to call .watchExports() or
+   *   some other method on the controller
+   */
+  get useRef() {
+    setAmbientComponent(this.component);
+    return useRef;
+  }
+  /**
+   * Like useRef, but doesn't wait for the controller to get ready
+   *
+   * @internal
+   */
+  get useRefSync() {
+    setAmbientComponent(this.component);
+    return useRefSync;
+  }
+  controllerRemoved() {
+    if (this.component.el.isConnected) {
+      this.triggerDisconnected();
+    }
+    this.triggerDestroy();
+  }
+  // Register a lifecycle callback
+  onConnected(callback) {
+    this._callbacks.hostConnected.push(callback);
+  }
+  onDisconnected(callback) {
+    this._callbacks.hostDisconnected.push(callback);
+  }
+  onLoad(callback) {
+    this._callbacks.hostLoad.push(callback);
+  }
+  onLoaded(callback) {
+    this._callbacks.hostLoaded.push(callback);
+  }
+  onUpdate(callback) {
+    this._callbacks.hostUpdate.push(callback);
+  }
+  onUpdated(callback) {
+    this._callbacks.hostUpdated.push(callback);
+  }
+  onDestroy(callback) {
+    this._callbacks.hostDestroy.push(callback);
+  }
+  onLifecycle(callback) {
+    this._callbacks.hostLifecycle.push(callback);
+    if (this.connectedCalled && this.component.el.isConnected) {
+      this._callLifecycle(callback);
+    }
+  }
+  // Call each lifecycle hook
+  /** @internal */
+  triggerConnected() {
+    const genericController = this;
+    if (genericController.hostConnected) {
+      safeCall(genericController.hostConnected, genericController);
+    }
+    this._callbacks.hostConnected.forEach(safeCall);
+    this.triggerLifecycle();
+    this.connectedCalled = true;
+  }
+  /** @internal */
+  triggerDisconnected() {
+    const genericController = this;
+    if (genericController.hostDisconnected) {
+      safeCall(genericController.hostDisconnected, genericController);
+    }
+    this._callbacks.hostDisconnected.forEach(safeCall);
+    this._lifecycleCleanups.forEach(safeCall);
+    this._lifecycleCleanups = [];
+  }
+  /** @internal */
+  async triggerLoad() {
+    if (this.willLoadCalled) {
+      return;
+    }
+    this.willLoadCalled = true;
+    const genericController = this;
+    if (genericController.hostLoad) {
+      await safeAsyncCall(genericController.hostLoad, genericController);
+    }
+    if (this._callbacks.hostLoad.length > 0) {
+      await Promise.allSettled(this._callbacks.hostLoad.map(safeAsyncCall));
+    }
+    this._ready.resolve(this._exports);
+  }
+  /** @internal */
+  triggerLoaded() {
+    if (this.didLoadCalled) {
+      return;
+    }
+    const genericController = this;
+    if (genericController.hostLoaded) {
+      safeCall(genericController.hostLoaded, genericController);
+    }
+    this._callbacks.hostLoaded.forEach(safeCall);
+    this.didLoadCalled = true;
+  }
+  /** @internal */
+  triggerUpdate(changedProperties) {
+    const genericController = this;
+    if (genericController.hostUpdate) {
+      safeCall(genericController.hostUpdate, genericController, changedProperties);
+    }
+    this._callbacks.hostUpdate.forEach(callUpdate, changedProperties);
+  }
+  /** @internal */
+  triggerUpdated(changedProperties) {
+    const genericController = this;
+    if (genericController.hostUpdated) {
+      safeCall(genericController.hostUpdated, genericController, changedProperties);
+    }
+    this._callbacks.hostUpdated.forEach(callUpdate, changedProperties);
+  }
+  /** @internal */
+  triggerDestroy() {
+    const genericController = this;
+    if (genericController.hostDestroy) {
+      safeCall(genericController.hostDestroy, genericController);
+    }
+    this._callbacks.hostDestroy.forEach(safeCall);
+  }
+  /** @internal */
+  triggerLifecycle() {
+    const genericController = this;
+    if (genericController.hostLifecycle) {
+      this._callLifecycle(() => genericController.hostLifecycle());
+    }
+    this._callbacks.hostLifecycle.forEach(this._callLifecycle, this);
+  }
+  _callLifecycle(callback) {
+    setAmbientComponent(this.component);
+    const cleanupRaw = safeCall(callback);
+    const cleanup = Array.isArray(cleanupRaw) ? cleanupRaw : [cleanupRaw];
+    cleanup.forEach((cleanup2) => {
+      if (typeof cleanup2 === "function") {
+        this._lifecycleCleanups.push(cleanup2);
+      } else if (typeof cleanup2 === "object" && typeof cleanup2.remove === "function") {
+        this._lifecycleCleanups.push(cleanup2.remove);
+      }
+    });
+  }
+};
+function callUpdate(callback) {
+  safeCall(callback, void 0, this);
+}
+var GenericController = Controller;
+function makeProvisionalValue(base) {
+  if (typeof base !== "object" && typeof base !== "function" || base === null) {
+    return base;
+  }
+  const proxy2 = new Proxy(base, {
+    get(target, prop, receiver) {
+      if (cyclical.has(prop) && prop in target && target[prop] === proxy2) {
+        return void 0;
+      }
+      if (prop in target || prop in Promise.prototype || typeof prop === "symbol") {
+        return typeof target === "function" ? target[prop] : Reflect.get(target, prop, receiver);
+      }
+      return void 0;
+    },
+    set: (target, prop, newValue, receiver) => {
+      return Reflect.set(target, prop, newValue, receiver);
+    }
+  });
+  return proxy2;
+}
+var cyclical = /* @__PURE__ */ new Set(["exports", "_exports"]);
+function toControllerHost(component) {
+  {
+    return component;
+  }
+}
+function trackPropertyKey(object, onResolved, defaultValue) {
+  const keys = Object.keys(object);
+  const keyCount = keys.length;
+  if (keyTrackMap === void 0) {
+    queueMicrotask(keyTrackResolve);
+  }
+  keyTrackMap ?? (keyTrackMap = /* @__PURE__ */ new Map());
+  let pendingTrackers = keyTrackMap.get(object);
+  if (pendingTrackers === void 0) {
+    pendingTrackers = { callbacks: [], keyCount };
+    keyTrackMap.set(object, pendingTrackers);
+  }
+  if (pendingTrackers.keyCount !== keyCount) {
+    pendingTrackers.callbacks.forEach((resolve) => resolve(keys));
+    pendingTrackers.callbacks = [];
+    pendingTrackers.keyCount = keyCount;
+  }
+  pendingTrackers.callbacks.push((keys2) => {
+    const callback = (key2) => safeCall(onResolved, null, key2);
+    const key = keys2[keyCount];
+    if (key === void 0) {
+      callback(void 0);
+    } else if (object[key] === defaultValue) {
+      callback(key);
+    } else {
+      callback(void 0);
+    }
+  });
+  return defaultValue;
+}
+var keyTrackMap = void 0;
+function keyTrackResolve() {
+  Array.from(keyTrackMap?.entries() ?? []).forEach(([object, { callbacks }]) => {
+    const keys = Object.keys(object);
+    callbacks.forEach((commit) => commit(keys));
+  });
+  keyTrackMap = void 0;
+}
+function watch(component, property, callback) {
+  var _a2;
+  const genericProperty = property;
+  const internals = component.manager.internals;
+  (_a2 = internals.allWatchers)[genericProperty] ?? (_a2[genericProperty] = []);
+  const watchers = internals.allWatchers[genericProperty];
+  const genericCallback = callback;
+  const safeCallback = (newValue, oldValue, propertyName) => safeCall(genericCallback, null, newValue, oldValue, propertyName);
+  watchers.push(safeCallback);
+  return () => {
+    const index = watchers.indexOf(safeCallback);
+    if (index !== -1) {
+      watchers.splice(index, 1);
+    }
+  };
+}
+
+// src/ComponentInternals.ts
+var ComponentInternals = class {
+  constructor(component) {
+    /**
+     * When watchers are set, set then into `allWatchers`. When watchers are read
+     * in the setter, read from `enabledWatchers`.
+     * On connectedCallback(), controller manager does `enabledWatchers=allWatchers`.
+     * Reasoning:
+     * - This disables watchers until connected callback (matches behavior of
+     *   Stencil's watchers)
+     * - This removes in the setter to check if watchers were enabled already or
+     *   not (as getters/setters are hot path, and should be streamlined)
+     */
+    this.enabledWatchers = {};
+    this.allWatchers = {};
+    /**
+     * "readOnly" is not enabled initially since we need to allow to set property
+     * default values in the constructor.
+     * For Stencil, readonly is enabled by the `readonly()` controller.
+     * For Lit, we have the following logic:
+     */
+    this.enableReadonly = () => {
+      this.enableReadonly = void 0;
+      if (!this.component.manager.isLit) {
+        return;
+      }
+      const internals = this.component.manager.internals;
+      Object.entries(internals.members).forEach(([name2, [type]]) => {
+        var _a2;
+        const isReadOnly = type & 2048 /* ReadOnly */;
+        if (isReadOnly) {
+          (_a2 = internals.setters)[name2] ?? (_a2[name2] = []);
+          internals.setters[name2].push(internals.readonlySetter);
+        }
+      });
+    };
+    this.trackedValue = nothing;
+    this.keyTrackers = [];
+    this.getters = {};
+    this.setters = {};
+    this.accessorGetter = {};
+    this.accessorSetter = {};
+    this.reactiveUtilsIntegrations = /* @__PURE__ */ new Set();
+    this._exports = /* @__PURE__ */ new WeakMap();
+    this.readonlySetter = (newValue, _oldValue, property) => {
+      if (shouldBypass.readOnly) {
+        return newValue;
+      }
+      throw new Error(
+        `Cannot assign to read-only property "${property}" of ${this.component.el.tagName.toLowerCase()}. Trying to assign "${String(
+          newValue
+        )}"`
+      );
+    };
+    {
+      this.component = component;
+    }
+  }
+  firePropTrackers(key, value) {
+    const trackers = this.keyTrackers;
+    this.trackedValue = nothing;
+    this.keyTrackers = [];
+    trackers.forEach((tracker) => tracker(key, value));
+  }
+  // REFACTOR: once Stencil is no longer supported, simplify this with Lit's getPropertyDescriptor(), or https://github.com/shoelace-style/shoelace/issues/1990
+  /**
+   * Configure a getter or setter for a given \@Prop/\@State
+   *
+   * Note, since props are defined on the prototype, they are shared between all
+   * instances of a component. Thus, instead of passing a reference to the
+   * getter/setter function, you should update the
+   * ComponentInternals.getters/setters properties, and then call getSetProxy
+   * to apply the changes to the prototype
+   */
+  getSetProxy(property) {
+    const component = this.component;
+    const classPrototype = component.constructor.prototype;
+    this._getSetProxy(classPrototype, property, "class");
+    if (component.manager.isLit) {
+      return;
+    }
+    const htmlPrototype = component.el.constructor.prototype;
+    if (classPrototype !== htmlPrototype) {
+      this._getSetProxy(htmlPrototype, property, "html");
+    }
+  }
+  _getSetProxy(prototype, name2, type) {
+    const component = this.component;
+    const propType = getMemberType(component, name2);
+    const descriptor = Object.getOwnPropertyDescriptor(prototype, name2);
+    if (!descriptor) {
+      return void 0;
+    }
+    const originalGet = descriptor.get;
+    const originalSet = descriptor.set;
+    const isGetterAlreadyOverwritten = customAccessor in originalGet;
+    const isSetterAlreadyOverwritten = customAccessor in originalSet;
+    const shouldOverwriteGet = !isGetterAlreadyOverwritten;
+    const shouldOverwriteSet = !isSetterAlreadyOverwritten;
+    if (!shouldOverwriteGet && !shouldOverwriteSet) {
+      return;
+    }
+    const finalGetter = shouldOverwriteGet ? function getter() {
+      let value = originalGet.call(this);
+      const component2 = elementToInstance.get(this);
+      if (component2 === void 0) {
+        return value;
+      }
+      const internals = component2.manager.internals;
+      value = internals.accessorGetter[name2](value, name2);
+      const getters = internals.getters[name2] ?? emptyArray;
+      for (let i = 0; i < getters.length; i++) {
+        value = getters[i](value, name2);
+      }
+      return value;
+    } : originalGet;
+    const finalSetter = shouldOverwriteSet ? function setter(rawNewValue) {
+      const oldValue = originalGet.call(this);
+      const component2 = elementToInstance.get(this);
+      if (component2 === void 0) {
+        originalSet.call(this, rawNewValue);
+        return;
+      }
+      let newValue = component2.manager.isLit ? rawNewValue : parsePropertyValue(rawNewValue, propType);
+      const internals = component2.manager.internals;
+      if (newValue === oldValue) {
+        originalSet.call(this, rawNewValue);
+      } else {
+        const setters = shouldBypass.setter ? emptyArray : internals.setters[name2] ?? emptyArray;
+        for (let i = 0; i < setters.length; i++) {
+          newValue = setters[i](newValue, oldValue, name2);
+          if (newValue === oldValue) {
+            break;
+          }
+        }
+        newValue = internals.accessorSetter[name2](newValue, oldValue, name2);
+        originalSet.call(this, newValue);
+        if (newValue !== oldValue) {
+          internals.enabledWatchers[name2]?.forEach((watcher) => watcher(newValue, oldValue, name2));
+        }
+      }
+      if (internals.keyTrackers.length > 0) {
+        internals?.firePropTrackers(name2, rawNewValue);
+      }
+    } : originalSet;
+    if (shouldOverwriteGet) {
+      finalGetter[customAccessor] = true;
+    }
+    if (shouldOverwriteSet) {
+      finalSetter[customAccessor] = true;
+    }
+    Object.defineProperty(prototype, name2, {
+      ...descriptor,
+      get: finalGetter,
+      set: finalSetter
+    });
+  }
+  /**
+   * Associate an exports object with a controller for reverse lookup in
+   * controller.use
+   */
+  markExports(controller, exports) {
+    if (typeof exports === "object" && exports !== null || typeof exports === "function") {
+      this._exports.set(exports, controller);
+    }
+  }
+  resolveExports(exports) {
+    if (typeof exports === "object" && exports !== null || typeof exports === "function") {
+      return this._exports.get(exports);
+    } else {
+      return void 0;
+    }
+  }
+};
+var emptyArray = [];
+var customAccessor = Symbol();
+var nothing = (
+  // eslint-disable-next-line symbol-description
+  Symbol()
+) ;
+var useControllerManager = (component, forceUpdate) => new ControllerManager(component, forceUpdate);
+var ControllerManager = class extends GenericController {
+  constructor(component, forceUpdate) {
+    const isLit = "addController" in component;
+    const controllers = /* @__PURE__ */ new Set();
+    function addController(controller) {
+      controllers.add(controller);
+      if (isLit && !(controllerSymbol in controller) && component.el.isConnected) {
+        controller.hostConnected?.();
+      }
+    }
+    function removeController(controller) {
+      void controllers.delete(controller);
+      controller.controllerRemoved?.();
+    }
+    const controllerHost = component;
+    controllerHost.addController = addController;
+    controllerHost.removeController = removeController;
+    if (!isLit) {
+      const update = forceUpdate ?? component.constructor.__forceUpdate;
+      controllerHost.requestUpdate = () => update(component);
+    }
+    super(component);
+    /** @internal */
+    this.internals = new ComponentInternals(this.component);
+    this.destroyed = false;
+    this._updatePromise = new Deferred();
+    this._originalLifecycles = {};
+    this.isLit = isLit;
+    this.component.manager = this;
+    retrieveComponentMembers(component, isLit);
+    this._controllers = controllers;
+    this.exports = void 0;
+    this.hasDestroy = autoDestroyDisabledPropName in this.component && typeof this.component.destroy === "function";
+    if (this.hasDestroy) {
+      watch(component, autoDestroyDisabledPropName, () => this._setAutoDestroyTimeout());
+    }
+    this._bindLifecycleMethods();
+    const internals = this.internals;
+    Object.keys(internals.members).forEach((name2) => {
+      internals.accessorGetter[name2] = defaultGetterSetter;
+      internals.accessorSetter[name2] = defaultGetterSetter;
+      internals.getSetProxy(name2);
+    });
+    if (!isLit) {
+      Object.defineProperty(component, "updateComplete", {
+        get: async () => await this._updatePromise.promise
+      });
+    }
+    queueMicrotask(internals.enableReadonly);
+    setParentController(void 0);
+    setAmbientComponent(component);
+    elementToInstance.set(component.el, component);
+    elementToInstance.set(component, component);
+  }
+  _bindLifecycleMethods() {
+    const component = this.component;
+    const isLit = this.isLit;
+    const isStencilDistBuild = component.el === component;
+    this._originalLifecycles = {
+      // These component's callbacks will be called by Lit, so we don't have to
+      connectedCallback: isLit || isStencilDistBuild ? void 0 : component.connectedCallback,
+      disconnectedCallback: isLit || isStencilDistBuild ? void 0 : component.disconnectedCallback,
+      componentWillLoad: isLit ? void 0 : component.componentWillLoad,
+      componentDidLoad: isLit ? void 0 : component.componentDidLoad,
+      componentWillUpdate: isLit ? void 0 : component.componentWillUpdate,
+      componentDidUpdate: isLit ? void 0 : component.componentDidUpdate,
+      destroy: component.destroy
+    };
+    const hostConnected = this._connectedCallback.bind(this);
+    const hostDisconnected = this._disconnectedCallback.bind(this);
+    const hostUpdate = this._update.bind(this);
+    const hostUpdated = this._updated.bind(this);
+    if (isLit) {
+      component.constructor.prototype.addController.call(component, {
+        // Lit will call these callbacks
+        hostConnected,
+        hostDisconnected,
+        hostUpdate,
+        hostUpdated
+      });
+    } else {
+      component.connectedCallback = hostConnected;
+      component.disconnectedCallback = hostDisconnected;
+      component.componentWillLoad = this._load.bind(this);
+      component.componentDidLoad = this._loaded.bind(this);
+      component.componentWillUpdate = hostUpdate;
+      component.componentDidUpdate = hostUpdated;
+    }
+    if (this.hasDestroy) {
+      component.destroy = this.destroy.bind(this);
+    }
+  }
+  /**
+   * Private because this is not supposed to be called by Component directly.
+   * Instead, _bindLifecycleMethods will take care of that. Otherwise, you risk
+   * calling lifecycle methods twice.
+   *
+   * @internal
+   */
+  _connectedCallback() {
+    if (this.destroyed) {
+      const tagName = this.component.el.tagName.toLowerCase();
+      this.component.el.remove();
+      throw new Error(
+        `The ${tagName} component has already been destroyed. It can not be used again. If you meant to disconnect and reconnect a component without automatic destroy, set the ${autoDestroyDisabledPropName} prop.`
+      );
+    }
+    if (this._autoDestroyTimeout !== void 0) {
+      clearTimeout(this._autoDestroyTimeout);
+    }
+    const internals = this.internals;
+    internals.enabledWatchers = internals.allWatchers;
+    keyTrackResolve();
+    internals.enableReadonly?.();
+    this._controllers.forEach(callConnected);
+    this._originalLifecycles.connectedCallback?.call(this.component);
+  }
+  /** @internal */
+  _disconnectedCallback() {
+    if (this.destroyed) {
+      return;
+    }
+    this._controllers.forEach(callDisconnected);
+    this._originalLifecycles.disconnectedCallback?.call(this.component);
+    if (this.hasDestroy) {
+      this._setAutoDestroyTimeout();
+    }
+  }
+  /** @internal */
+  async _load() {
+    const integrations = this.internals.reactiveUtilsIntegrations;
+    if (integrations.size > 0) {
+      for (const controller of integrations) {
+        if ("triggerLoad" in controller) {
+          await controller.triggerLoad();
+        } else {
+          await safeAsyncCall(controller.hostLoad, controller);
+        }
+      }
+    }
+    await Promise.allSettled(Array.from(this._controllers, callLoad, integrations));
+    await this._originalLifecycles.componentWillLoad?.call(this.component);
+  }
+  /** @internal */
+  _loaded() {
+    this._controllers.forEach(callLoaded);
+    this._originalLifecycles.componentDidLoad?.call(this.component);
+  }
+  _update() {
+    const changedProperties = this.component.changedProperties;
+    this._controllers.forEach(callUpdate2, changedProperties);
+    void this._originalLifecycles.componentWillUpdate?.call(this.component);
+  }
+  _updated() {
+    const maybeLitComponent = this.component;
+    this._controllers.forEach(callUpdated, maybeLitComponent.changedProperties);
+    this._originalLifecycles.componentDidUpdate?.call(this.component);
+    if (this.isLit) {
+      maybeLitComponent.changedProperties = /* @__PURE__ */ new Map();
+    } else {
+      const updatePromise = this._updatePromise;
+      this._updatePromise = new Deferred();
+      updatePromise.resolve(true);
+    }
+  }
+  async destroy() {
+    if (this.destroyed) {
+      return;
+    }
+    if (this.component.el.isConnected) {
+      this.hasDestroy = false;
+      try {
+        this.component.el.remove();
+      } finally {
+        this.hasDestroy = true;
+      }
+    }
+    this._autoDestroyTimeout = void 0;
+    this.destroyed = true;
+    this._controllers.forEach(callDestroy);
+    this._controllers.clear();
+    await this._originalLifecycles.destroy?.call(this.component);
+  }
+  _setAutoDestroyTimeout() {
+    if (!this.component.el.isConnected && !this.component.autoDestroyDisabled) {
+      if (this._autoDestroyTimeout !== void 0) {
+        clearTimeout(this._autoDestroyTimeout);
+      }
+      const destroy = () => void this.destroy().catch(console.error);
+      {
+        this._autoDestroyTimeout = devToolsAwareTimeout(destroy, autoDestroyOnDisconnectTimeout);
+      }
+    }
+  }
+};
+var autoDestroyDisabledPropName = "autoDestroyDisabled";
+var autoDestroyOnDisconnectTimeout = 1e3;
+var defaultGetterSetter = (value) => value;
+function callConnected(controller) {
+  if ("triggerConnected" in controller) {
+    controller.triggerConnected();
+  } else {
+    safeCall(controller.hostConnected, controller);
+  }
+}
+function callDisconnected(controller) {
+  if ("triggerDisconnected" in controller) {
+    controller.triggerDisconnected();
+  } else {
+    safeCall(controller.hostDisconnected, controller);
+  }
+}
+async function callLoad(controller) {
+  if (!this.has(controller)) {
+    if ("triggerLoad" in controller) {
+      await controller.triggerLoad();
+    } else {
+      await safeAsyncCall(controller.hostLoad, controller);
+    }
+  }
+}
+function callLoaded(controller) {
+  if ("triggerLoaded" in controller) {
+    controller.triggerLoaded();
+  } else {
+    safeCall(controller.hostLoaded, controller);
+  }
+}
+function callUpdate2(controller) {
+  if ("triggerUpdate" in controller) {
+    controller.triggerUpdate(this);
+  } else {
+    safeCall(controller.hostUpdate, controller, this);
+  }
+}
+function callUpdated(controller) {
+  if ("triggerUpdated" in controller) {
+    controller.triggerUpdated(this);
+  } else {
+    safeCall(controller.hostUpdated, controller, this);
+  }
+}
+function callDestroy(controller) {
+  if ("triggerDestroy" in controller) {
+    controller.triggerDestroy();
+  } else {
+    safeCall(controller.hostDestroy, controller);
+  }
+}
+function trackPropKey(component, onResolved, defaultValue) {
+  const internals = component.manager.internals;
+  if (internals.trackedValue !== nothing && internals.trackedValue !== defaultValue) {
+    internals.firePropTrackers(void 0, void 0);
+  }
+  if (internals.keyTrackers.length === 0) {
+    queueMicrotask(() => internals.firePropTrackers(void 0, void 0));
+  }
+  internals.trackedValue = defaultValue;
+  internals.keyTrackers.push((key, value) => safeCall(onResolved, void 0, defaultValue === value ? key : void 0));
+  return defaultValue;
+}
+
+// src/trackKey.ts
+function trackKey(hostsCandidates, onResolved, defaultValue) {
+  const candidateHosts = Array.isArray(hostsCandidates) ? hostsCandidates : [hostsCandidates];
+  let leftToResolve = candidateHosts.length + 1;
+  const resolved = (resolution) => {
+    leftToResolve -= 1;
+    if (resolution !== void 0) {
+      leftToResolve = 0;
+    }
+    if (leftToResolve === 0) {
+      onResolved(resolution);
+    }
+  };
+  candidateHosts.forEach(
+    (host) => trackPropertyKey(
+      host,
+      (key) => resolved(
+        key === void 0 ? void 0 : {
+          key,
+          host,
+          isReactive: false
+        }
+      ),
+      defaultValue
+    )
+  );
+  const component = candidateHosts.find(
+    (host) => "manager" in host && typeof host.manager === "object" && host.manager.component === host
+  );
+  if (component) {
+    trackPropKey(
+      component,
+      (key) => resolved(
+        key === void 0 ? void 0 : {
+          key,
+          host: component,
+          isReactive: getMemberType(component, key) !== void 0
+        }
+      ),
+      defaultValue
+    );
+  }
+  return defaultValue;
+}
+
+// src/getSet.ts
+function getSet(defaultValue, getSet2) {
+  const component = retrieveComponent();
+  return trackPropKey(
+    component,
+    (rawName) => {
+      const name2 = rawName;
+      const manager = component.manager;
+      const genericComponent = component;
+      const value = genericComponent[name2];
+      const isStencilHotReload = "production" !== "production"  ;
+      const initialSet = getSet2.initialSet ?? true;
+      if (value != null && value !== defaultValue && typeof getSet2.set === "function" && initialSet && !isStencilHotReload) {
+        const newValue = getSet2.set(value, defaultValue, name2);
+        if (newValue !== value) {
+          if (manager.isLit) {
+            genericComponent[name2] = newValue;
+          } else {
+            let firstConnected = true;
+            manager.onConnected(() => {
+              if (!firstConnected) {
+                return;
+              }
+              firstConnected = true;
+              bypassSetter(() => {
+                genericComponent[name2] = newValue;
+              });
+            });
+          }
+        }
+      }
+      genericGetSet(component, name2, getSet2);
+    },
+    defaultValue
+  );
+}
+function bypassSetter(callback) {
+  shouldBypass.setter = true;
+  try {
+    return callback();
+  } finally {
+    shouldBypass.setter = false;
+  }
+}
+function genericGetSet(component, property, getSet2) {
+  var _a2, _b;
+  const genericGetSet2 = getSet2;
+  const internals = component.manager.internals;
+  const get = typeof genericGetSet2.get === "function" ? genericGetSet2.get : void 0;
+  if (get) {
+    (_a2 = internals.getters)[property] ?? (_a2[property] = []);
+    internals.getters[property].unshift(get);
+  }
+  const set = genericGetSet2.set === "ignore" ? ignoreSet : genericGetSet2.set;
+  if (set) {
+    (_b = internals.setters)[property] ?? (_b[property] = []);
+    internals.setters[property].unshift(
+      set
+    );
+  }
+}
+var ignoreSet = (_, value) => value;
+function bypassReadOnly(callback) {
+  shouldBypass.readOnly = true;
+  try {
+    return callback();
+  } finally {
+    shouldBypass.readOnly = false;
+  }
+}
+
+// src/proxyExports.ts
+var proxyExports = (Class) => (...args) => {
+  const ambientControllers2 = retrieveParentControllers();
+  const instance = new Class(...args);
+  const initialExports = instance.exports;
+  setParentController(ambientControllers2.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, ...ambientControllers2].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;
+    }
+  });
+}
+
+// src/functional.ts
+var makeController = (constructor) => proxy(void 0, constructor);
+var FunctionalController = class extends Controller {
+  constructor(component, constructor) {
+    super(component);
+    const originalExports = this.exports;
+    try {
+      setAmbientComponent(this.component);
+      const value = constructor(this.component, this);
+      const constructorChangedExports = this.exports !== originalExports;
+      if (value instanceof Promise) {
+        if (!constructorChangedExports) {
+          this.setProvisionalExports(value);
+        }
+        const resolved = value.then((result) => {
+          this.exports = result;
+          super.catchUpLifecycle();
+        }).catch((error) => {
+          this._ready.reject(error);
+          console.error(error);
+        });
+        this.onLoad(async () => await resolved);
+      } else {
+        if (!constructorChangedExports || value !== void 0) {
+          this.exports = value;
+        }
+        queueMicrotask(() => super.catchUpLifecycle());
+      }
+    } catch (error) {
+      this._ready.reject(error);
+      console.error(error);
+    }
+  }
+  /** Noop - will be called in the constructor instead */
+  catchUpLifecycle() {
+    return;
+  }
+};
+var proxy = proxyExports(FunctionalController);
+
+export { getSet as g, makeController as m, useControllerManager as u, watch as w };