@telia-ace/widget-runtime-flamingo 1.0.6 → 1.0.7

package/dist/index.js

@@ -1,4 +1,4 @@
-import { o as a, D as r, W as o, G as s, W as i, h as n, c as d, k as c, q as x, r as C, g as l, l as p, j as W } from "./index-e248f756.js";
+import { o as a, D as r, W as o, G as s, W as i, h as n, c as d, k as c, q as x, r as C, g as l, l as p, j as W } from "./index-53eef382.js";
 export {
   a as ActionsController,
   r as DataProvider,

package/dist/mixins/node.mixin.d.ts

@@ -0,0 +1,21 @@
+import { LitElement } from 'lit';
+import { childrenContext } from '../context/children.context';
+import { propertiesCtx } from '../context/properties.context';
+import { contextCtx } from '../context/context.context';
+import { ContextProvider } from '@lit-labs/context';
+import { Container } from '@webprovisions/platform';
+import { ComponentDescriptor } from '@telia-ace/widget-core';
+type Constructor<T = {}> = new (...args: any[]) => T;
+export declare class NodeMixinInterface {
+    entry: string;
+    descriptor?: ComponentDescriptor;
+    component?: any;
+    layout: Record<string, any>;
+    container?: Container;
+    _contextProvider: ContextProvider<typeof contextCtx>;
+    _propertiesProvider: ContextProvider<typeof propertiesCtx>;
+    _childrenProvider: ContextProvider<typeof childrenContext>;
+}
+export declare const NodeMixin: <T extends Constructor<LitElement>>(superClass: T) => Constructor<NodeMixinInterface> & T;
+export {};
+//# sourceMappingURL=node.mixin.d.ts.map

package/dist/mixins/node.mixin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"node.mixin.d.ts","sourceRoot":"","sources":["../../src/mixins/node.mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAExD,OAAO,EAAE,eAAe,EAAW,MAAM,mBAAmB,CAAC;AAC7D,OAAO,EACL,SAAS,EAEV,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EACL,mBAAmB,EAIpB,MAAM,wBAAwB,CAAC;AAGhC,KAAK,WAAW,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;AAGrD,MAAM,CAAC,OAAO,OAAO,kBAAkB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,gBAAgB,EAAE,eAAe,CAAC,OAAO,UAAU,CAAC,CAAC;IACrD,mBAAmB,EAAE,eAAe,CAAC,OAAO,aAAa,CAAC,CAAC;IAC3D,iBAAiB,EAAE,eAAe,CAAC,OAAO,eAAe,CAAC,CAAC;CAC5D;AAED,eAAO,MAAM,SAAS,2FAuGrB,CAAC"}

package/dist/render-33d3aace.js

@@ -0,0 +1,604 @@
+var q = Object.defineProperty, W = Object.defineProperties;
+var Y = Object.getOwnPropertyDescriptors;
+var z = Object.getOwnPropertySymbols;
+var U = Object.prototype.hasOwnProperty, F = Object.prototype.propertyIsEnumerable;
+var D = (e, t, s) => t in e ? q(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s, f = (e, t) => {
+  for (var s in t || (t = {}))
+    U.call(t, s) && D(e, s, t[s]);
+  if (z)
+    for (var s of z(t))
+      F.call(t, s) && D(e, s, t[s]);
+  return e;
+}, E = (e, t) => W(e, Y(t));
+var y = (e, t, s) => new Promise((r, o) => {
+  var i = (c) => {
+    try {
+      a(s.next(c));
+    } catch (d) {
+      o(d);
+    }
+  }, n = (c) => {
+    try {
+      a(s.throw(c));
+    } catch (d) {
+      o(d);
+    }
+  }, a = (c) => c.done ? r(c.value) : Promise.resolve(c.value).then(i, n);
+  a((s = s.apply(e, t)).next());
+});
+import { s as Q, a as B, i as K, t as J, e as X, A as w, b as k, c as N, p as V, m as _, x, d as O, n as C, f as p, g as Z, h as tt, j as et, k as st, l as ot, E as G } from "./index-53eef382.js";
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const S = (e) => (t) => typeof t == "function" ? ((s, r) => (customElements.define(s, r), r))(e, t) : ((s, r) => {
+  const { kind: o, elements: i } = r;
+  return { kind: o, elements: i, finisher(n) {
+    customElements.define(s, n);
+  } };
+})(e, t);
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const rt = ({ finisher: e, descriptor: t }) => (s, r) => {
+  var o;
+  if (r === void 0) {
+    const i = (o = s.originalKey) !== null && o !== void 0 ? o : s.key, n = t != null ? { kind: "method", placement: "prototype", key: i, descriptor: t(s.key) } : E(f({}, s), { key: i });
+    return e != null && (n.finisher = function(a) {
+      e(a, i);
+    }), n;
+  }
+  {
+    const i = s.constructor;
+    t !== void 0 && Object.defineProperty(s, r, t(r)), e == null || e(i, r);
+  }
+};
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+let it = class {
+  constructor(t) {
+    this.subscriptions = /* @__PURE__ */ new Map(), this.updateObservers = () => {
+      for (const [s, { disposer: r }] of this.subscriptions)
+        s(this.o, r);
+    }, t !== void 0 && (this.value = t);
+  }
+  get value() {
+    return this.o;
+  }
+  set value(t) {
+    this.setValue(t);
+  }
+  setValue(t, s = !1) {
+    const r = s || !Object.is(t, this.o);
+    this.o = t, r && this.updateObservers();
+  }
+  addCallback(t, s, r) {
+    if (!r)
+      return void t(this.value);
+    this.subscriptions.has(t) || this.subscriptions.set(t, { disposer: () => {
+      this.subscriptions.delete(t);
+    }, consumerHost: s });
+    const { disposer: o } = this.subscriptions.get(t);
+    t(this.value, o);
+  }
+  clearCallbacks() {
+    this.subscriptions.clear();
+  }
+};
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+class nt extends Event {
+  constructor(t) {
+    super("context-provider", { bubbles: !0, composed: !0 }), this.context = t;
+  }
+}
+let v = class extends it {
+  constructor(t, s, r) {
+    super(s.context !== void 0 ? s.initialValue : r), this.onContextRequest = (o) => {
+      const i = o.composedPath()[0];
+      o.context === this.context && i !== this.host && (o.stopPropagation(), this.addCallback(o.callback, i, o.subscribe));
+    }, this.onProviderRequest = (o) => {
+      const i = o.composedPath()[0];
+      if (o.context === this.context && i !== this.host) {
+        for (const [n, { consumerHost: a }] of this.subscriptions)
+          a.dispatchEvent(new Q(this.context, n, !0));
+        o.stopPropagation();
+      }
+    }, this.host = t, s.context !== void 0 ? this.context = s.context : this.context = s, this.attachListeners(), this.host.addController(this);
+  }
+  attachListeners() {
+    this.host.addEventListener("context-request", this.onContextRequest), this.host.addEventListener("context-provider", this.onProviderRequest);
+  }
+  hostConnected() {
+    this.host.dispatchEvent(new nt(this.context));
+  }
+};
+/**
+ * @license
+ * Copyright 2022 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function at({ context: e, subscribe: t }) {
+  return rt({ finisher: (s, r) => {
+    s.addInitializer((o) => {
+      new B(o, { context: e, callback: (i) => {
+        o[r] = i;
+      }, subscribe: t });
+    });
+  } });
+}
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const ct = (e) => e.strings === void 0;
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const g = (e, t) => {
+  var s, r;
+  const o = e._$AN;
+  if (o === void 0)
+    return !1;
+  for (const i of o)
+    (r = (s = i)._$AO) === null || r === void 0 || r.call(s, t, !1), g(i, t);
+  return !0;
+}, $ = (e) => {
+  let t, s;
+  do {
+    if ((t = e._$AM) === void 0)
+      break;
+    s = t._$AN, s.delete(e), e = t;
+  } while ((s == null ? void 0 : s.size) === 0);
+}, M = (e) => {
+  for (let t; t = e._$AM; e = t) {
+    let s = t._$AN;
+    if (s === void 0)
+      t._$AN = s = /* @__PURE__ */ new Set();
+    else if (s.has(e))
+      break;
+    s.add(e), ht(t);
+  }
+};
+function lt(e) {
+  this._$AN !== void 0 ? ($(this), this._$AM = e, M(this)) : this._$AM = e;
+}
+function dt(e, t = !1, s = 0) {
+  const r = this._$AH, o = this._$AN;
+  if (o !== void 0 && o.size !== 0)
+    if (t)
+      if (Array.isArray(r))
+        for (let i = s; i < r.length; i++)
+          g(r[i], !1), $(r[i]);
+      else
+        r != null && (g(r, !1), $(r));
+    else
+      g(this, e);
+}
+const ht = (e) => {
+  var t, s, r, o;
+  e.type == J.CHILD && ((t = (r = e)._$AP) !== null && t !== void 0 || (r._$AP = dt), (s = (o = e)._$AQ) !== null && s !== void 0 || (o._$AQ = lt));
+};
+class pt extends K {
+  constructor() {
+    super(...arguments), this._$AN = void 0;
+  }
+  _$AT(t, s, r) {
+    super._$AT(t, s, r), M(this), this.isConnected = t._$AU;
+  }
+  _$AO(t, s = !0) {
+    var r, o;
+    t !== this.isConnected && (this.isConnected = t, t ? (r = this.reconnected) === null || r === void 0 || r.call(this) : (o = this.disconnected) === null || o === void 0 || o.call(this)), s && (g(this, t), $(this));
+  }
+  setValue(t) {
+    if (ct(this._$Ct))
+      this._$Ct._$AI(t, this);
+    else {
+      const s = [...this._$Ct._$AH];
+      s[this._$Ci] = t, this._$Ct._$AI(s, this, 0);
+    }
+  }
+  disconnected() {
+  }
+  reconnected() {
+  }
+}
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const ut = () => new ft();
+class ft {
+}
+const P = /* @__PURE__ */ new WeakMap(), vt = X(class extends pt {
+  render(e) {
+    return w;
+  }
+  update(e, [t]) {
+    var s;
+    const r = t !== this.G;
+    return r && this.G !== void 0 && this.ot(void 0), (r || this.rt !== this.lt) && (this.G = t, this.dt = (s = e.options) === null || s === void 0 ? void 0 : s.host, this.ot(this.lt = e.element)), w;
+  }
+  ot(e) {
+    var t;
+    if (typeof this.G == "function") {
+      const s = (t = this.dt) !== null && t !== void 0 ? t : globalThis;
+      let r = P.get(s);
+      r === void 0 && (r = /* @__PURE__ */ new WeakMap(), P.set(s, r)), r.get(this.G) !== void 0 && this.G.call(this.dt, void 0), r.set(this.G, e), e !== void 0 && this.G.call(this.dt, e);
+    } else
+      this.G.value = e;
+  }
+  get rt() {
+    var e, t, s;
+    return typeof this.G == "function" ? (t = P.get((e = this.dt) !== null && e !== void 0 ? e : globalThis)) === null || t === void 0 ? void 0 : t.get(this.G) : (s = this.G) === null || s === void 0 ? void 0 : s.value;
+  }
+  disconnected() {
+    this.rt === this.lt && this.ot(void 0);
+  }
+  reconnected() {
+    this.ot(this.lt);
+  }
+}), mt = (e) => y(void 0, null, function* () {
+  return yield e.get("$widget").invoke("renderState");
+}), bt = (e, t) => y(void 0, null, function* () {
+  const s = e.get("$widget");
+  return (yield e.getAsync("actionResolver")).subscribe(s.name, t);
+}), gt = (e, t, s = !1) => {
+  const r = e.reduce(
+    (n, { breakpoints: a = [], values: c }) => a.length ? t.some((d) => a.includes(d)) ? f(f({}, n), c) : n : f(f({}, n), c),
+    {}
+  ), o = {};
+  let i = r.type;
+  return o.height = r.height || "", o.width = r.width || "", r.type === "floating" || r.type === "inline" && s && (o.height = "calc(100vh - 120px)"), { type: i, styles: o };
+};
+var yt = Object.defineProperty, _t = Object.getOwnPropertyDescriptor, u = (e, t, s, r) => {
+  for (var o = r > 1 ? void 0 : r ? _t(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+    (n = e[i]) && (o = (r ? n(t, s, o) : n(o)) || o);
+  return r && o && yt(t, s, o), o;
+};
+let h = class extends k {
+  constructor() {
+    super(), this._provider = new v(this, N, void 0), this.wrapperRef = ut(), this.breakpoints = [], this.breakpointsSet = !1;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._provider.setValue(this.container), this.container && (mt(this.container).then((e) => {
+      this.renderState = e;
+    }), bt(this.container, (e, t) => {
+      switch (t) {
+        case "close":
+        case "open":
+          this.renderState = t === "open" ? _.open : _.closed;
+          break;
+        case "hide":
+          this.renderState = _.hidden;
+      }
+    }).then((e) => {
+      this._unsubscribeRenderState = e;
+    }), V.getInstance(this.container).then(
+      (e) => {
+        this.componentPlatform = e, this.breakpoints = this.componentPlatform.breakpoints, this.breakpointsSet = !0, this._unsubscribePropChange = this.componentPlatform.events.subscribe(
+          "components:properties-changed",
+          (t, s) => {
+            var r, o;
+            ((r = s == null ? void 0 : s.node) == null ? void 0 : r.type) === "root" && (this.breakpoints = (o = this.componentPlatform) != null && o.breakpoints ? [...this.componentPlatform.breakpoints] : []);
+          }
+        ), this.entry = this.componentPlatform.nodes.root.children.default[0].id || void 0;
+      }
+    ));
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._unsubscribeRenderState && this._unsubscribeRenderState(), this._unsubscribePropChange && this._unsubscribePropChange();
+  }
+  render() {
+    var t, s, r, o;
+    let e;
+    if (!this.entry || !this.breakpointsSet)
+      return w;
+    if (this.container && this.renderState) {
+      const [i] = this.container.get("widgetDOMElements");
+      i && i.setAttribute("data-state", this.renderState);
+    }
+    if (this.container) {
+      const i = this.container.get("$settings");
+      i != null && i.layout && (e = gt(
+        i.layout,
+        this.breakpoints,
+        !!i.trigger
+      ), e.type === "floating" ? (this.renderRoot.host.classList.add("floating"), this.renderRoot.host.classList.remove("inline")) : (this.renderRoot.host.classList.add("inline"), this.renderRoot.host.classList.remove("floating")), Object.entries(e.styles).forEach(([n, a]) => {
+        this.renderRoot.host.style.setProperty(n, a);
+      }));
+    }
+    return this.renderState && (this.renderState === _.hidden ? ((t = this.wrapperRef.value) == null || t.classList.add("hidden"), (s = this.wrapperRef.value) == null || s.classList.remove("expanded")) : ((r = this.wrapperRef.value) == null || r.classList.remove("hidden"), (o = this.wrapperRef.value) == null || o.classList.add("expanded"))), x`
+      <div class="widget-container" ${vt(this.wrapperRef)}>
+        <ace-area entry=${this.entry}></ace-area>
+        <!-- <widget-component entry=${this.entry}></widget-component> -->
+      </div>
+    `;
+  }
+};
+h.styles = O`
+    :host {
+      --voca-rem-multiplier: 0.625;
+      box-sizing: border-box;
+      display: block;
+    }
+
+    :host(.floating) {
+      position: fixed;
+      z-index: 6;
+      inset: auto 20px 95px auto;
+      max-height: calc(100vh - 120px);
+    }
+    :host(.floating) .widget-container {
+      box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px;
+      border-radius: 0.7rem;
+    }
+    :host(.inline) {
+      position: fixed;
+      inset: 0 0 0 0;
+    }
+
+    * {
+      box-sizing: border-box;
+    }
+    .widget-container.expanded {
+      opacity: 1;
+      animation: slideUp 0.5s;
+    }
+    .widget-container.hidden {
+      opacity: 0;
+      animation: slideDown 0.5s;
+    }
+    @keyframes slideDown {
+      from {
+        transform: translateY(0);
+        opacity: 1;
+      }
+      to {
+        transform: translateY(100%);
+        opacity: 0;
+      }
+    }
+    @keyframes slideUp {
+      from {
+        transform: translateY(100%);
+        opacity: 0;
+      }
+      to {
+        transform: translateY(0);
+        opacity: 1;
+      }
+    }
+  `;
+u([
+  C({ attribute: !1 })
+], h.prototype, "container", 2);
+u([
+  p()
+], h.prototype, "componentPlatform", 2);
+u([
+  p()
+], h.prototype, "renderState", 2);
+u([
+  p()
+], h.prototype, "breakpoints", 2);
+u([
+  p()
+], h.prototype, "breakpointsSet", 2);
+u([
+  p()
+], h.prototype, "entry", 2);
+h = u([
+  S("wrapper-component")
+], h);
+var xt = Object.defineProperty, wt = Object.getOwnPropertyDescriptor, b = (e, t, s, r) => {
+  for (var o = r > 1 ? void 0 : r ? wt(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+    (n = e[i]) && (o = (r ? n(t, s, o) : n(o)) || o);
+  return r && o && xt(t, s, o), o;
+};
+const H = (e) => {
+  class t extends e {
+    constructor() {
+      super(...arguments), this.entry = "", this._descriptorProvider = new v(
+        this,
+        Z,
+        void 0
+      ), this._childrenProvider = new v(this, tt, []), this._propertiesProvider = new v(this, et, {}), this._contextProvider = new v(this, st, {}), this._layoutProvider = new v(this, ot, {}), this.layout = {};
+    }
+    connectedCallback() {
+      super.connectedCallback(), this.container && V.getInstance(this.container).then(
+        (r) => y(this, null, function* () {
+          const o = r.nodes.get(this.entry);
+          if (o) {
+            this._propertyChangeListener = r.events.subscribe(
+              "components:properties-changed",
+              (d, m) => {
+                o.id === m.node.id && this._propertiesProvider.setValue(
+                  m.node.attributes.properties
+                );
+              }
+            );
+            const i = "default";
+            this.descriptor = G(o, i), this._unmountNode = o.mount(this.container), this._descriptorProvider.setValue(this.descriptor), this._propertiesProvider.setValue(
+              o.attributes.properties
+            ), this._contextProvider.setValue(o.attributes.context), this.layout = o.attributes.layout, this._layoutProvider.setValue(this.layout);
+            const n = o.getChildren(i).map((d) => G(d));
+            this._childrenProvider.setValue(n);
+            const c = (yield this.container.getAsync("componentResolver")).getComponent(
+              this.descriptor.type || ""
+            );
+            c.then && c.then((d) => {
+              this.component = d.default;
+            });
+          }
+        })
+      );
+    }
+    disconnectedCallback() {
+      super.disconnectedCallback(), this._propertyChangeListener && this._propertyChangeListener(), this._unmountNode && this._unmountNode();
+    }
+  }
+  return b([
+    at({ context: N }),
+    C({ attribute: !1 })
+  ], t.prototype, "container", 2), b([
+    C()
+  ], t.prototype, "entry", 2), b([
+    p()
+  ], t.prototype, "descriptor", 2), b([
+    p()
+  ], t.prototype, "component", 2), b([
+    p()
+  ], t.prototype, "layout", 2), t;
+}, l = (e, t, s) => {
+  e && s.style.setProperty(t, e);
+}, T = (e, t) => {
+  var s, r, o, i, n, a, c, d, m, L, j;
+  l((s = e.colors) == null ? void 0 : s.primary, "--primary-color", t), l((r = e.colors) == null ? void 0 : r.secondary, "--secondary-color", t), l((o = e.colors) == null ? void 0 : o.text, "--text-color", t), l((i = e.colors) == null ? void 0 : i.link, "--link-color", t), l((n = e.colors) == null ? void 0 : n.gray, "--gray-color", t), l((a = e.colors) == null ? void 0 : a.grayDark, "--gray-dark-color", t), l((c = e.spacing) == null ? void 0 : c.xs, "--spacing-xs", t), l((d = e.spacing) == null ? void 0 : d.sm, "--spacing-sm", t), l((m = e.spacing) == null ? void 0 : m.md, "--spacing-md", t), l((L = e.spacing) == null ? void 0 : L.lg, "--spacing-lg", t), l((j = e.spacing) == null ? void 0 : j.xl, "--spacing-xl", t), l(e.boxShadow, "--box-shadow", t), l(e.borderRadius, "--border-radius", t), l(e.borderRadiusSm, "--border-radius-sm", t), l(e.fontFamily, "--font-family", t);
+}, $t = (e) => {
+  const t = {};
+  return Object.keys(e).forEach((s) => {
+    s.indexOf("css-") > -1 && (t[s] = e[s]);
+  }), t;
+}, I = (e, t) => {
+  const s = $t(t);
+  Object.entries(s).forEach(([r, o]) => {
+    e.style.setProperty(r.replace("css-", ""), o);
+  });
+};
+var Pt = Object.defineProperty, Ct = Object.getOwnPropertyDescriptor, Rt = (e, t, s, r) => {
+  for (var o = r > 1 ? void 0 : r ? Ct(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+    (n = e[i]) && (o = (r ? n(t, s, o) : n(o)) || o);
+  return r && o && Pt(t, s, o), o;
+};
+let R = class extends H(k) {
+  render() {
+    if (!this.component)
+      return w;
+    const e = new this.component(), t = this._contextProvider.value;
+    return T(t, this.renderRoot.host), this.renderRoot.host.style.setProperty(
+      "--width",
+      this.layout.size === "full" ? "var(--columns, 1)" : `min(${this.layout.size || "var(--columns)"}, var(--columns))`
+    ), I(
+      this.renderRoot.host,
+      this._propertiesProvider.value
+    ), e;
+  }
+};
+R.styles = O`
+    :host {
+      grid-column: span var(--width);
+      max-width: 100%;
+      overflow: hidden;
+      box-sizing: border-box;
+      display: block;
+
+      --font-family: TeliaSans, Helvetica, Arial, Lucida Grande, sans-serif;
+      --spacing-xs: 0.2rem;
+      --spacing-sm: 0.5rem;
+      --spacing-md: 1rem;
+      --spacing-lg: 1.2rem;
+      --spacing-xl: 1.8rem;
+
+      --primary-color: #29003e;
+      --secondary-color: #00558f;
+      --text-color: #222222;
+      --link-color: #990ae3;
+      --gray-color: #efefef;
+      --gray-dark-color: #a6a6a6;
+
+      --box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
+      --border-radius: 1rem;
+      --border-radius-sm: 0.3rem;
+    }
+    * {
+      box-sizing: border-box;
+    }
+  `;
+R = Rt([
+  S("widget-component")
+], R);
+var At = Object.defineProperty, kt = Object.getOwnPropertyDescriptor, Ot = (e, t, s, r) => {
+  for (var o = r > 1 ? void 0 : r ? kt(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+    (n = e[i]) && (o = (r ? n(t, s, o) : n(o)) || o);
+  return r && o && At(t, s, o), o;
+};
+let A = class extends H(k) {
+  render() {
+    var e;
+    return T(this._contextProvider.value, this.renderRoot.host), this.renderRoot.host.style.setProperty(
+      "--width",
+      this.layout.size === "full" ? "var(--columns, 1)" : `min(${this.layout.size || "var(--columns)"}, var(--columns))`
+    ), this.renderRoot.host.style.setProperty(
+      "--columns",
+      ((e = this._propertiesProvider.value.columns) == null ? void 0 : e.toString()) || "1"
+    ), I(
+      this.renderRoot.host,
+      this._propertiesProvider.value
+    ), x`
+      ${this._childrenProvider.value.map(
+      (t) => t.type === "area" ? x`<ace-area entry=${t.id}></ace-area>` : x`<widget-component entry=${t.id}></widget-component>`
+    )}
+    `;
+  }
+};
+A.styles = O`
+    :host {
+      grid-column: span var(--width);
+      max-width: 100%;
+      overflow: hidden;
+      box-sizing: border-box;
+
+      height: 100%;
+      display: grid;
+      justify-content: center;
+      grid-auto-rows: max-content;
+      grid-template-rows: auto;
+      grid-template-columns: repeat(var(--columns), 1fr);
+
+      --font-family: TeliaSans, Helvetica, Arial, Lucida Grande, sans-serif;
+      --spacing-xs: 0.2rem;
+      --spacing-sm: 0.5rem;
+      --spacing-md: 1rem;
+      --spacing-lg: 1.2rem;
+      --spacing-xl: 1.8rem;
+
+      --primary-color: #29003e;
+      --secondary-color: #00558f;
+      --text-color: #222222;
+      --link-color: #990ae3;
+      --gray-color: #efefef;
+      --gray-dark-color: #a6a6a6;
+
+      --box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
+      --border-radius: 1rem;
+      --border-radius-sm: 0.3rem;
+    }
+    * {
+      box-sizing: border-box;
+    }
+  `;
+A = Ot([
+  S("ace-area")
+], A);
+const Dt = (e, t) => {
+  const s = new h();
+  s.container = e, t.appendChild(s);
+};
+export {
+  Dt as default
+};
+//# sourceMappingURL=render-33d3aace.js.map