@telia-ace/widget-core 1.0.2 → 1.0.6

package/dist/index.js

@@ -0,0 +1,1047 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { createConfigurationApi } from "@webprovisions/platform";
+import { uuid, Logger } from "@telia-ace/widget-utilities";
+class ActionResolver {
+  constructor(container) {
+    const { events } = container.get("$widget");
+    this.events = events.createChild(this);
+  }
+  action(target, action, value) {
+    this.events.dispatch("data:action", { action, value, target }, { bubbles: true });
+  }
+  subscribe(origin, fn) {
+    return this.events.subscribe("data:action", (e, { action, value, target }) => origin === target && fn(origin, action, value));
+  }
+}
+const createEventSubscriber = (events) => {
+  const subs = [];
+  const subscribe = (type, listener) => {
+    subs.push(events.subscribe(type, listener));
+  };
+  return [
+    subscribe,
+    () => {
+      subs.forEach((sub) => {
+        sub();
+      });
+    }
+  ];
+};
+class ComponentQuery {
+  constructor(platform, rules = []) {
+    this.platform = platform;
+    this.rules = rules;
+  }
+  match(node) {
+    return this.rules.every((rule) => {
+      if (rule.id && rule.id !== node.id) {
+        return false;
+      }
+      if (rule.type && rule.type !== node.type) {
+        return false;
+      }
+      return true;
+    });
+  }
+  ofType(type) {
+    this.rules.push({ type });
+    return this;
+  }
+  withId(id) {
+    this.rules.push({ id });
+    return this;
+  }
+  select() {
+    return new AbstractComponentController(this.platform, this);
+  }
+}
+class ComponentNodeController {
+  constructor(platform, node, ns) {
+    this.platform = platform;
+    this.node = node;
+    this.actions = new ActionsController(platform, new ComponentQuery(platform).withId(node.id), ns);
+    const [subscribe, unsubscribe] = createEventSubscriber(this.platform.events);
+    this.subscribe = subscribe;
+    this.unsubscribe = unsubscribe;
+  }
+  properties(updated) {
+    if (updated) {
+      this.node.touchProperties((properties) => updated(properties));
+    }
+    return this.node.attributes.properties;
+  }
+  context(updated) {
+    if (updated) {
+      this.subscribe("components:context-changed", (event, { node }) => {
+        if (node === this.node) {
+          updated(this.node.attributes.context);
+        }
+      });
+    }
+    return this.node.attributes.context;
+  }
+  layout(updated) {
+    if (updated) {
+      this.subscribe("components:layout-changed", (event, { node }) => {
+        if (node === this.node) {
+          updated(this.node.attributes.layout);
+        }
+      });
+    }
+    return this.node.attributes.layout;
+  }
+  writeProperties(properties, options) {
+    this.node.writeProperties(properties, options);
+  }
+  writeContext(context, options) {
+    this.node.writeProperties(context, options);
+  }
+  writeLayout(layout, options) {
+    this.node.writeLayout(layout, options);
+  }
+  dispose() {
+    this.unsubscribe();
+    this.actions.dispose();
+  }
+}
+class AbstractComponentController {
+  constructor(platform, target, clearOnDispose = true) {
+    this.platform = platform;
+    this.target = target;
+    this.clearOnDispose = clearOnDispose;
+    this.removes = [];
+    this.actions = new ActionsController(this.platform, this.target);
+  }
+  writeProperties(properties, options) {
+    this.removes.push(this.platform.write({
+      options,
+      attributes: { properties },
+      target: this.target,
+      removable: this.clearOnDispose
+    }));
+  }
+  writeContext(context, options) {
+    this.removes.push(this.platform.write({
+      options,
+      attributes: { context },
+      target: this.target,
+      removable: this.clearOnDispose
+    }));
+  }
+  writeLayout(layout, options) {
+    this.removes.push(this.platform.write({
+      options,
+      attributes: { layout },
+      target: this.target,
+      removable: this.clearOnDispose
+    }));
+  }
+  dispose() {
+    this.removes.forEach((remove) => {
+      remove();
+    });
+    this.actions.dispose();
+  }
+}
+const executeActionListeners = (listeners, data, controller) => {
+  const stack = listeners.concat();
+  const dispatch = (data2, globalOptions, controller2) => {
+    let cancelled = true;
+    if (stack.length) {
+      const handler = stack.shift();
+      const next = (data3, options) => {
+        cancelled = false;
+        return dispatch(data3, Object.assign({}, globalOptions, options), controller2);
+      };
+      return Promise.resolve(handler(data2, next, controller2)).then((result) => __spreadProps(__spreadValues({}, result), {
+        cancelled
+      }));
+    }
+    return Promise.resolve({ data: data2, cancelled: false, options: globalOptions });
+  };
+  return dispatch(data, {}, controller);
+};
+class ActionsController {
+  constructor(platform, target, ns) {
+    this.platform = platform;
+    this.target = target;
+    this.ns = ns;
+    this.subscriptions = [];
+    this.create = this.create.bind(this);
+  }
+  create(key, fn = () => {
+  }) {
+    const handler = {
+      key,
+      fn,
+      target: this.target,
+      ns: this.ns
+    };
+    this.platform.actionsState.handlers.push(handler);
+    const subscription = () => {
+      const index = this.platform.actionsState.handlers.indexOf(handler);
+      if (index > -1) {
+        this.platform.actionsState.handlers.splice(index, 1);
+      }
+    };
+    this.subscriptions.push(subscription);
+    return subscription;
+  }
+  dispatch(key, data) {
+    const instances = this.platform.nodes.all.concat(this.platform.nodes.detached);
+    const output = {};
+    const handlers = this.platform.actionsState.handlers.filter((handler) => handler.key === key && (!handler.ns || !this.ns || handler.ns === this.ns));
+    return Promise.all(handlers.map((handler) => {
+      const matchedInstances = instances.filter((instance) => handler.target.match(instance) && this.target.match(instance));
+      const watchers = this.platform.actionsState.watchers.filter((watcher) => {
+        return watcher.key === key && (!watcher.ns || !this.ns || watcher.ns === this.ns) && matchedInstances.some((instance) => watcher.target.match(instance));
+      }).map((watcher) => watcher.fn);
+      return Promise.all(matchedInstances.map((node) => {
+        const controller = new ComponentNodeController(this.platform, node, this.ns);
+        return executeActionListeners(watchers, data, controller).then((input) => {
+          const { data: data2 = {}, options, cancelled } = input;
+          return Promise.resolve(cancelled ? {} : handler.fn(data2, options, controller)).then((handlerResponse) => {
+            output[node.id] = handlerResponse;
+          });
+        });
+      }));
+    })).then(() => output);
+  }
+  watch(key, fn) {
+    let parsedKey = key;
+    let parsedNs = this.ns;
+    const sections = key.split(".");
+    if (sections.length > 1) {
+      parsedNs = sections[0];
+      parsedKey = sections.splice(1).join(".");
+    }
+    const watcher = {
+      fn,
+      target: this.target,
+      key: parsedKey,
+      ns: parsedNs
+    };
+    this.platform.actionsState.watchers.push(watcher);
+    const subscription = () => {
+      const index = this.platform.actionsState.watchers.indexOf(watcher);
+      if (index > -1) {
+        this.platform.actionsState.watchers.splice(index, 1);
+      }
+    };
+    this.subscriptions.push(subscription);
+    return subscription;
+  }
+  dispose() {
+    this.subscriptions.forEach((unsubscribe) => unsubscribe());
+  }
+}
+var componentConfigurationApi = createConfigurationApi((builder) => {
+  builder.createCommand("components", (context) => (config) => {
+    context.events.subscribeOnce("components:platform-created", (event, { platform }) => {
+      if (config.handlers) {
+        config.handlers.forEach(([key, handler]) => {
+          platform.addComponentHandler(key, handler);
+        });
+      }
+    });
+  });
+});
+class ComponentNode {
+  constructor(events, type) {
+    this.events = events;
+    this.tags = [];
+    this.children = {};
+    this.changesets = [];
+    this.mountCount = 0;
+    this.id = uuid();
+    this.type = type;
+    this.attributes = {
+      context: {},
+      properties: {},
+      layout: {},
+      tags: []
+    };
+    this.writeLayout({ size: "full", indent: 0 });
+  }
+  mount(viewOutletContainer, element) {
+    let mountedNodes = viewOutletContainer.get("mounted-nodes");
+    if (!mountedNodes) {
+      mountedNodes = /* @__PURE__ */ new Map();
+      viewOutletContainer.register("mounted-nodes", mountedNodes);
+    }
+    if (mountedNodes.has(this)) {
+      return () => {
+      };
+    }
+    this.events.dispatch("components:node-mounted", { node: this });
+    if (this.mountCount === 0) {
+      this.mountCount = this.mountCount + 1;
+      this.events.dispatch("components:node-enter", { node: this });
+    }
+    return () => {
+      mountedNodes.delete(this);
+      this.events.dispatch("components:node-unmounted", { node: this });
+      this.mountCount = this.mountCount - 1;
+      if (this.mountCount === 0) {
+        this.events.dispatch("components:node-exit", { node: this });
+      }
+    };
+  }
+  appendChild(node, branch = "default") {
+    if (node.parent) {
+      if (node.parent === this) {
+        return;
+      }
+      node.parent.removeChild(node);
+    }
+    node.parent = this;
+    if (!this.children[branch]) {
+      this.children[branch] = [];
+    }
+    this.children[branch].push(node);
+    this.events.dispatch("components:node-appended", { node });
+  }
+  prependChild(node, branch = "default") {
+    if (node.parent) {
+      if (node.parent === this) {
+        return;
+      }
+      node.parent.removeChild(node);
+    }
+    node.parent = this;
+    if (!this.children[branch]) {
+      this.children[branch] = [];
+    }
+    this.children[branch].unshift(node);
+    this.events.dispatch("components:node-appended", { node });
+  }
+  touchProperties(properties, options = {}, removable) {
+    const attributes = { properties };
+    const changeset = [attributes, options];
+    this.changesets.push(changeset);
+    this.events.dispatch("components:set-properties", { node: this });
+    return () => {
+      if (removable) {
+        const indexToRemove = this.changesets.indexOf(changeset);
+        if (indexToRemove > -1) {
+          this.changesets.splice(indexToRemove, 1);
+          this.events.dispatch("components:set-properties", { node: this });
+        }
+      }
+    };
+  }
+  writeProperties(properties, options = {}, removable) {
+    const attributes = { properties };
+    const changeset = [attributes, options];
+    this.changesets.push(changeset);
+    this.events.dispatch("components:set-properties", { node: this });
+    return () => {
+      if (removable) {
+        const indexToRemove = this.changesets.indexOf(changeset);
+        if (indexToRemove > -1) {
+          this.changesets.splice(indexToRemove, 1);
+          this.events.dispatch("components:set-properties", { node: this });
+        }
+      }
+    };
+  }
+  writeLayout(layout, options = {}, removable) {
+    const attributes = { layout };
+    const changeset = [attributes, options];
+    this.changesets.push(changeset);
+    this.events.dispatch("components:set-layout", { node: this });
+    return () => {
+      if (!removable) {
+        return;
+      }
+      const indexToRemove = this.changesets.indexOf(changeset);
+      if (indexToRemove > -1) {
+        this.changesets.splice(indexToRemove, 1);
+        this.events.dispatch("components:set-layout", { node: this });
+      }
+    };
+  }
+  writeContext(context, options = {}, removable) {
+    const attributes = { context };
+    const changeset = [attributes, options];
+    this.changesets.push(changeset);
+    this.events.dispatch("components:set-context", { node: this });
+    return () => {
+      if (!removable) {
+        return;
+      }
+      const indexToRemove = this.changesets.indexOf(changeset);
+      if (indexToRemove > -1) {
+        this.changesets.splice(indexToRemove, 1);
+        this.events.dispatch("components:set-context", { node: this });
+      }
+    };
+  }
+  getChildren(branch = "default") {
+    const children = this.children[branch] || [];
+    return children.reduce((acc, node, i) => {
+      const { order: index = i } = node.attributes.layout;
+      if (!acc[index]) {
+        acc[index] = node;
+      } else {
+        acc.splice(index, 0, node);
+      }
+      return acc;
+    }, Array(children.length));
+  }
+  remove() {
+    if (this.parent) {
+      this.parent.removeChild(this);
+    }
+  }
+  removeChild(node) {
+    Object.keys(this.children).forEach((branch) => {
+      const children = this.children[branch];
+      const indexToRemove = children.indexOf(node);
+      if (indexToRemove > -1) {
+        children.splice(indexToRemove, 1);
+        this.events.dispatch("components:node-removed", { node, parentNode: this });
+      }
+    });
+    delete node.parent;
+  }
+}
+const traverseComponentsRecursive = (nodes, switches, fn) => {
+  for (let i = 0, y = nodes.length; i < y; i++) {
+    if (fn(nodes[i]) === true) {
+      break;
+    }
+    const branch = switches[nodes[i].id] || "default";
+    const children = nodes[i].getChildren(branch);
+    traverseComponentsRecursive(children, switches, fn);
+  }
+};
+const traverseComponents = (root, switches, fn) => {
+  if (fn(root) !== true) {
+    const branch = switches[root.id] || "default";
+    const children = root.children[branch];
+    traverseComponentsRecursive(children, switches, fn);
+  }
+};
+const findVisibleComponents = (root, switches) => {
+  const nodes = [];
+  traverseComponents(root, switches, (node) => {
+    nodes.push(node);
+  });
+  return nodes;
+};
+const findComponent = (root, switches, fn) => {
+  let matched;
+  traverseComponents(root, switches, (node) => {
+    if (fn(node)) {
+      matched = node;
+      return true;
+    }
+  });
+  return matched;
+};
+class ComponentNodeCollection {
+  constructor(root, switches, events) {
+    this.root = root;
+    this.switches = switches;
+    this.all = [];
+    this.visible = [];
+    this.detached = [];
+    events.subscribe("components:node-appended", (event, data) => {
+      this.all.push(data.node);
+      this.visible = findVisibleComponents(root, switches);
+    });
+    events.subscribe("components:node-removed", (event, data) => {
+      let indexToRemove = this.all.indexOf(data.node);
+      if (indexToRemove > -1) {
+        this.all.splice(indexToRemove, 1);
+      }
+      indexToRemove = this.visible.indexOf(data.node);
+      if (indexToRemove > -1) {
+        this.visible.splice(indexToRemove, 1);
+      }
+      this.visible = findVisibleComponents(root, switches);
+    });
+    events.subscribe("components:node-switched", (event, data) => {
+      this.visible = findVisibleComponents(root, switches);
+    });
+  }
+  query(query = {}) {
+    const nodes = [];
+    traverseComponents(this.root, this.switches, (node) => {
+      const match = Object.keys(query).every((member) => {
+        return query[member] === node[member];
+      });
+      if (match) {
+        nodes.push(node);
+      }
+    });
+    return nodes;
+  }
+  get(id) {
+    return findComponent(this.root, this.switches, (node) => node.id === id) || this.detached.find((node) => node.id === id);
+  }
+}
+class CustomComponentHandler {
+  constructor() {
+    this.handlers = /* @__PURE__ */ new Map();
+  }
+  add(name, fn) {
+    this.handlers.set(name, fn);
+  }
+  get(name) {
+    return this.handlers.get(name);
+  }
+}
+const calculateNodeIndex = (node) => {
+  let currentNode = node;
+  let index = 0;
+  while (currentNode.parent) {
+    index = index + 1;
+    currentNode = currentNode.parent;
+  }
+  return index;
+};
+const sortQueue = (queue) => {
+  const mapped = queue.map(([node, options]) => {
+    return [calculateNodeIndex(node), node, options];
+  });
+  return mapped.sort(([a], [b]) => a - b).map(([, node, options]) => {
+    return [node, options];
+  });
+};
+const isObject = (item) => {
+  return item && typeof item === "object" && !Array.isArray(item);
+};
+const mergeDeep = (target, ...sources) => {
+  if (!sources.length)
+    return target;
+  const source = sources.shift();
+  if (isObject(target) && isObject(source)) {
+    for (const key in source) {
+      if (isObject(source[key])) {
+        if (!target[key])
+          Object.assign(target, { [key]: {} });
+        mergeDeep(target[key], source[key]);
+      } else {
+        Object.assign(target, { [key]: source[key] });
+      }
+    }
+  }
+  return mergeDeep(target, ...sources);
+};
+const matchesBreakpoint = (b1, b2) => {
+  if (!b1 || b1 === "all") {
+    return true;
+  }
+  return b1.some((b12) => b2.indexOf(b12) > -1);
+};
+const createStateProcessor = (platform, callback) => {
+  let nodeQueue = [];
+  let optionsQueue = [];
+  let timeout;
+  const flush = () => {
+    const processHistory = /* @__PURE__ */ new Map();
+    const sortedQueue = sortQueue(nodeQueue.map((node, i) => [node, optionsQueue[i]]));
+    const processNode = (node, options) => {
+      var _a;
+      const history = processHistory.get(node) || {};
+      const processContext = options.context && !history.context;
+      const processProperties = options.properties && !history.properties;
+      const processLayout = options.layout && !history.layout;
+      processHistory.set(node, {
+        context: history.context || processContext,
+        properties: history.properties || processProperties,
+        layout: history.layout || processLayout
+      });
+      if (processProperties) {
+        node.attributes.properties = {};
+      }
+      if (processLayout) {
+        node.attributes.layout = {};
+      }
+      if (processContext) {
+        node.attributes.context = mergeDeep({}, (_a = node.parent) == null ? void 0 : _a.attributes.context);
+      }
+      const propertyResolvers = [];
+      const layoutResolvers = [];
+      const contextResolvers = [];
+      node.changesets.forEach((changeset) => {
+        const [change, options2] = changeset;
+        if (matchesBreakpoint(options2.breakpoints, platform.breakpoints)) {
+          if (processProperties) {
+            if (typeof change.properties === "function") {
+              propertyResolvers.push(change.properties);
+            } else {
+              mergeDeep(node.attributes.properties, change.properties);
+            }
+          }
+          if (processLayout) {
+            if (typeof change.layout === "function") {
+              layoutResolvers.push(change.layout);
+            } else {
+              mergeDeep(node.attributes.layout, change.layout);
+            }
+          }
+          if (processContext) {
+            if (typeof change.context === "function") {
+              contextResolvers.push(change.context);
+            } else {
+              mergeDeep(node.attributes.context, change.context);
+            }
+          }
+        }
+      });
+      propertyResolvers.forEach((resolver) => {
+        mergeDeep(node.attributes.properties, resolver(node.attributes.properties));
+      });
+      layoutResolvers.forEach((resolver) => {
+        mergeDeep(node.attributes.layout, resolver(node.attributes.layout));
+      });
+      contextResolvers.forEach((resolver) => {
+        mergeDeep(node.attributes.context, resolver(node.attributes.context));
+      });
+      if (processContext || options.recursive) {
+        const branch = platform.getBranch(node);
+        const childOptions = options.recursive ? options : {
+          context: !!processContext
+        };
+        node.getChildren(branch).forEach((child) => {
+          processNode(child, childOptions);
+        });
+      }
+    };
+    sortedQueue.forEach(([node, options]) => {
+      processNode(node, options);
+    });
+    nodeQueue = [];
+    optionsQueue = [];
+    callback(processHistory);
+  };
+  const schedule = () => {
+    clearTimeout(timeout);
+    timeout = setTimeout(flush, 0);
+  };
+  return (node, options) => {
+    const index = nodeQueue.indexOf(node);
+    if (index > -1) {
+      const summary = optionsQueue[index];
+      if (options.context) {
+        summary.context = true;
+      }
+      if (options.properties) {
+        summary.properties = true;
+      }
+      if (options.layout) {
+        summary.layout = true;
+      }
+      if (options.recursive) {
+        summary.recursive = true;
+      }
+      return schedule();
+    }
+    nodeQueue.push(node);
+    optionsQueue.push(options);
+    return schedule();
+  };
+};
+class ComponentPlatform {
+  constructor(widget, providers = {}) {
+    this.providers = providers;
+    this.breakpoints = [];
+    this.actionsState = { handlers: [], watchers: [] };
+    this.switches = {};
+    this.changesets = [];
+    this.subscriptions = [];
+    this.customComponentHandler = new CustomComponentHandler();
+    this.events = widget.events.createChild(this);
+    const root = new ComponentNode(this.events, "root");
+    root.name = `root-${widget.name}`;
+    this.nodes = new ComponentNodeCollection(root, this.switches, this.events);
+    const processNode = this.processNode = createStateProcessor(this, (report) => {
+      const nodes = Array.from(report.keys());
+      nodes.forEach((node) => {
+        const options = report.get(node);
+        if (node.parent && node.parent.type === "root") {
+          this.events.dispatch("components:root-children-changed", { node });
+        }
+        if (options == null ? void 0 : options.context) {
+          this.events.dispatch("components:context-changed", { node });
+        }
+        if (options == null ? void 0 : options.properties) {
+          this.events.dispatch("components:properties-changed", { node });
+        }
+        if (options == null ? void 0 : options.layout) {
+          this.events.dispatch("components:layout-changed", { node });
+        }
+      });
+      this.events.dispatch("components:component-model-initialized", {}, { bubbles: true });
+    });
+    Promise.all(Object.keys(providers).map((key) => {
+      const provider = providers[key];
+      return provider.load(this);
+    }));
+    this.subscriptions.push(this.events.subscribe("components:node-appended", (event, data) => {
+      const { node } = data;
+      this.changesets.forEach((record) => {
+        const { changeset, target, removes } = record;
+        const [change, options] = changeset;
+        if (target.match(data.node)) {
+          if (change.properties) {
+            removes.push(node.writeProperties(change.properties, options));
+          }
+          if (change.context) {
+            removes.push(node.writeContext(change.context, options));
+          }
+          if (change.layout) {
+            removes.push(node.writeLayout(change.layout, options));
+          }
+        }
+      });
+    }));
+    this.subscriptions.push(this.events.subscribe("components:node-appended", (event, data) => {
+      processNode(data.node, { properties: true, context: true });
+    }));
+    this.subscriptions.push(this.events.subscribe("components:set-properties", (event, data) => {
+      processNode(data.node, { properties: true });
+    }));
+    this.subscriptions.push(this.events.subscribe("components:set-context", (event, data) => {
+      processNode(data.node, { properties: true, context: true });
+    }));
+    this.subscriptions.push(this.events.subscribe("components:set-indent", (event, data) => {
+      processNode(data.node, { layout: true });
+    }));
+    this.subscriptions.push(this.events.subscribe("components:set-layout", (event, data) => {
+      processNode(data.node, { layout: true });
+    }));
+    this.subscriptions.push(this.events.subscribe("components:node-switched", (event, { node, branch }) => {
+      processNode(node, {
+        layout: true,
+        recursive: true,
+        properties: true,
+        context: true
+      });
+    }));
+    this.subscriptions.push(this.events.subscribe("components:node-removed", (event, { parentNode }) => {
+      processNode(parentNode, { properties: true });
+    }));
+    if (this.events.parent) {
+      this.events.parent.dispatch("components:platform-created", { platform: this });
+    }
+  }
+  static getInstance(container) {
+    return container.getAsync("components");
+  }
+  addBreakpoint(name) {
+    if (this.breakpoints.indexOf(name) === -1) {
+      this.breakpoints.push(name);
+      this.processNode(this.nodes.root, {
+        context: true,
+        properties: true,
+        layout: true,
+        recursive: true
+      });
+    }
+  }
+  removeBreakpoint(name) {
+    const indexToRemove = this.breakpoints.indexOf(name);
+    if (indexToRemove > -1) {
+      this.breakpoints.splice(indexToRemove, 1);
+      this.processNode(this.nodes.root, {
+        context: true,
+        properties: true,
+        layout: true,
+        recursive: true
+      });
+    }
+  }
+  setSwitch(node, branch) {
+    this.switches[node.id] = branch;
+    this.events.dispatch("components:node-switched", { node, branch });
+  }
+  getBranch(node) {
+    return this.switches[node.id];
+  }
+  createNode(type, options = {}) {
+    const node = new ComponentNode(this.events, type);
+    if (options.detached) {
+      this.nodes.detached.push(node);
+    }
+    return node;
+  }
+  components() {
+    return new ComponentQuery(this);
+  }
+  actions(target, ns) {
+    return new ActionsController(this, target, ns);
+  }
+  write(data) {
+    const { provider: providerName, target, attributes, options = {}, removable } = data;
+    const key = data.key || uuid();
+    const changeset = [attributes, options];
+    const record = { changeset, target, removes: [] };
+    if (providerName) {
+      const provider = this.providers[providerName];
+      provider.write(key, target, attributes, options);
+      record.removes.push(() => {
+        provider.remove(key);
+      });
+    }
+    this.changesets.push(record);
+    this.nodes.all.forEach((node) => {
+      if (target.match(node)) {
+        let remove = () => {
+        };
+        if (attributes.properties) {
+          remove = node.writeProperties(attributes.properties, options, removable);
+        }
+        if (attributes.context) {
+          remove = node.writeContext(attributes.context, options, removable);
+        }
+        if (attributes.layout) {
+          remove = node.writeContext(attributes.layout, options, removable);
+        }
+        record.removes.push(remove);
+      }
+    });
+    return () => {
+      if (removable) {
+        record.removes.forEach((remove) => remove());
+        const indexToRemove = this.changesets.indexOf(record);
+        if (indexToRemove > -1) {
+          this.changesets.splice(indexToRemove, 1);
+        }
+      }
+    };
+  }
+  addComponentHandler(definitionType, fn) {
+    this.customComponentHandler.add(definitionType, fn);
+  }
+  getComponentHandler(definitionType) {
+    return this.customComponentHandler.get(definitionType);
+  }
+  dispose() {
+    this.subscriptions.forEach((sub) => sub());
+  }
+}
+const normalizeReference = (reference) => {
+  if (Array.isArray(reference)) {
+    const [definitionId, ...overrides] = reference;
+    return {
+      definitionId,
+      overrides
+    };
+  }
+  return {
+    definitionId: reference,
+    overrides: []
+  };
+};
+const createChildren = (platform, node, references, definitions, views, branch) => {
+  references.forEach((ref) => {
+    const childRef = normalizeReference(ref);
+    const childDef = definitions[childRef.definitionId];
+    if (childRef.definitionId === "view") {
+      const viewNode = platform.createNode("view");
+      viewNode.name = "view";
+      Object.keys(views).forEach((key) => {
+        const viewDef = views[key];
+        createChildren(platform, viewNode, [viewDef.entry], definitions, views, key);
+      });
+      node.appendChild(viewNode);
+      childRef.overrides.forEach((override) => {
+        if (override.properties) {
+          viewNode.writeProperties(override.properties, {
+            breakpoints: override.breakpoints
+          });
+        }
+        if (override.context) {
+          viewNode.writeContext(override.context, { breakpoints: override.breakpoints });
+        }
+        if (override.layout) {
+          viewNode.writeLayout(override.layout, { breakpoints: override.breakpoints });
+        }
+      });
+    } else if (platform.getComponentHandler(childDef.type)) {
+      const handle = platform.getComponentHandler(childDef.type);
+      if (handle) {
+        handle(childRef, {
+          platform,
+          node,
+          references,
+          definitions,
+          views,
+          branch
+        });
+      }
+    } else {
+      const childDef2 = definitions[childRef.definitionId];
+      const childNode = platform.createNode(childDef2.type);
+      childNode.name = childRef.definitionId;
+      childNode.tags = childDef2.tags || [];
+      if (childDef2.properties) {
+        childNode.writeProperties(childDef2.properties);
+      }
+      if (childDef2.context) {
+        childNode.writeContext(childDef2.context);
+      }
+      if (childDef2.layout) {
+        childNode.writeLayout(childDef2.layout);
+      }
+      node.appendChild(childNode, branch);
+      childRef.overrides.forEach((override) => {
+        const options = { breakpoints: override.breakpoints };
+        if (override.properties) {
+          childNode.writeProperties(override.properties, options);
+        }
+        if (override.context) {
+          childNode.writeContext(override.context, options);
+        }
+        if (override.layout) {
+          childNode.writeLayout(override.layout, options);
+        }
+      });
+      if (childDef2.children) {
+        createChildren(platform, childNode, childDef2.children, definitions, views);
+      }
+    }
+  });
+};
+const createComponentModel = (platform, settings) => {
+  const { entry, components, breakpoints, views } = settings;
+  const subscriptions = [];
+  Object.keys(breakpoints).forEach((name) => {
+    const query = breakpoints[name];
+    const list = window.matchMedia(query);
+    if (list.matches) {
+      platform.breakpoints.push(name);
+    }
+    const listener = (event) => {
+      if (event.matches) {
+        platform.addBreakpoint(name);
+      } else {
+        platform.removeBreakpoint(name);
+      }
+    };
+    list.addListener(listener);
+    subscriptions.push(() => list.removeListener(listener));
+  });
+  createChildren(platform, platform.nodes.root, [entry], components, views);
+  return () => subscriptions.forEach((sub) => {
+    sub();
+  });
+};
+const asDescriptor = (node, branch) => {
+  return {
+    id: node.id,
+    type: node.type,
+    name: node.name,
+    branch: branch || "default"
+  };
+};
+const extendComponent = (container, typeOrQuery, handler, ns = uuid(), options = {}) => {
+  return container.getAsync("components").then((components) => {
+    let target;
+    if (typeof typeOrQuery === "string") {
+      const collection = new ComponentQuery(components);
+      collection.ofType(typeOrQuery);
+      target = collection;
+    } else {
+      target = typeOrQuery;
+    }
+    const managedInstances = {};
+    const getOrCreateController = (node) => {
+      const existing = managedInstances[node.id];
+      if (existing) {
+        return Promise.resolve(existing.controller);
+      }
+      return ComponentPlatform.getInstance(container).then((platform) => {
+        return new ComponentNodeController(platform, node, ns);
+      });
+    };
+    components.events.subscribe("components:node-enter", (event, { node }) => {
+      if (target.match(node)) {
+        getOrCreateController(node).then((controller) => {
+          Promise.resolve(handler(controller)).then((dispose) => {
+            managedInstances[node.id] = {
+              dispose,
+              controller
+            };
+          });
+        });
+      }
+    });
+    components.events.subscribe("components:node-exit", (event, { node }) => {
+      const instance = managedInstances[node.id];
+      if (instance) {
+        instance.dispose && instance.dispose();
+        if (!options.reuseController) {
+          instance.controller.dispose();
+          delete managedInstances[node.id];
+        }
+      }
+    });
+  });
+};
+class ComponentResolver {
+  constructor(container) {
+    this.aliases = /* @__PURE__ */ new Map();
+    this.components = /* @__PURE__ */ new Map();
+    this.logger = new Logger();
+    const { events } = container.get("$widget");
+    this.events = events;
+  }
+  getComponent(key) {
+    const alias = this.aliases.get(key);
+    const component = this.components.get(alias || key) || null;
+    return component;
+  }
+  registerComponent(key, component) {
+    this.components.set(key, component);
+    this.events.dispatch("component-resolver:resolve", key);
+    return () => {
+      this.components.delete(key);
+    };
+  }
+  registerResolver(key, fn) {
+    return this.events.subscribe("component-resolver:resolve", (e, data) => {
+      if (data === key) {
+        const component = this.getComponent(key);
+        fn(component);
+      }
+    });
+  }
+  registerAlias(alias, key) {
+    this.aliases.set(alias, key);
+    this.events.dispatch("component-resolver:resolve", alias);
+    return () => {
+      this.aliases.delete(alias);
+    };
+  }
+}
+var WidgetRenderState = /* @__PURE__ */ ((WidgetRenderState2) => {
+  WidgetRenderState2["open"] = "open";
+  WidgetRenderState2["closed"] = "closed";
+  WidgetRenderState2["hidden"] = "hidden";
+  return WidgetRenderState2;
+})(WidgetRenderState || {});
+export { ActionResolver, ActionsController, ComponentNode, ComponentNodeController, ComponentPlatform, ComponentQuery, ComponentResolver, WidgetRenderState, asDescriptor, componentConfigurationApi, createChildren, createComponentModel, createEventSubscriber, extendComponent, findComponent, findVisibleComponents, traverseComponents };
+//# sourceMappingURL=index.js.map