@folkehelseinstituttet/designsystem 0.12.0 → 0.13.0

package/fhi-flex.js

@@ -0,0 +1,80 @@
+import { i as g, n as l, a as m, x as d, t as h } from "./property-DYwjZ69W.js";
+var u = Object.defineProperty, c = Object.getOwnPropertyDescriptor, p = (r, i, a, s) => {
+  for (var e = s > 1 ? void 0 : s ? c(i, a) : i, o = r.length - 1, n; o >= 0; o--)
+    (n = r[o]) && (e = (s ? n(i, a, e) : n(e)) || e);
+  return s && e && u(i, a, e), e;
+};
+const f = "fhi-flex";
+let t = class extends m {
+  constructor() {
+    super(...arguments), this.direction = "row", this.gap = "medium", this.wrap = !1;
+  }
+  updated(r) {
+    if (super.updated(r), r.has("gap")) {
+      if (["small", "medium", "large"].includes(
+        String(this.gap)
+      )) {
+        this.style.gap = "";
+        return;
+      }
+      const a = Number(this.gap) ? `${this.gap}px` : this.gap;
+      this.style.gap = a;
+    }
+  }
+  render() {
+    return d`<slot></slot>`;
+  }
+};
+t.styles = g`
+    :host {
+      --dimension-gap-small: var(--fhi-spacing-100);
+      --dimension-gap-medium: var(--fhi-spacing-200);
+      --dimension-gap-large: var(--fhi-spacing-300);
+    }
+
+    :host {
+      display: flex;
+      gap: var(--dimension-gap-medium);
+    }
+
+    :host([wrap]) {
+      flex-wrap: wrap;
+    }
+
+    :host([direction='row']) {
+      flex-direction: row;
+    }
+
+    :host([direction='column']) {
+      flex-direction: column;
+    }
+
+    :host([gap='small']) {
+      gap: var(--dimension-gap-small);
+    }
+
+    :host([gap='medium']) {
+      gap: var(--dimension-gap-medium);
+    }
+
+    :host([gap='large']) {
+      gap: var(--dimension-gap-large);
+    }
+  `;
+p([
+  l({ type: String, reflect: !0 })
+], t.prototype, "direction", 2);
+p([
+  l({ type: String, reflect: !0 })
+], t.prototype, "gap", 2);
+p([
+  l({ type: Boolean, reflect: !0 })
+], t.prototype, "wrap", 2);
+t = p([
+  h(f)
+], t);
+export {
+  t as FhiFlex,
+  f as FhiFlexSelector
+};
+//# sourceMappingURL=fhi-flex.js.map

package/fhi-flex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fhi-flex.js","sources":["../../src/components/fhi-flex/fhi-flex.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nexport const FhiFlexSelector = 'fhi-flex';\ntype FhiUnitType = 'px' | 'rem';\ntype FhiGapWidthUnit = `${number}${FhiUnitType}` | number;\n\n@customElement(FhiFlexSelector)\nexport class FhiFlex extends LitElement {\n  @property({ type: String, reflect: true }) direction: 'row' | 'column' =\n    'row';\n  @property({ type: String, reflect: true }) gap:\n    | 'small'\n    | 'medium'\n    | 'large'\n    | FhiGapWidthUnit = 'medium';\n  @property({ type: Boolean, reflect: true }) wrap = false;\n\n  updated(changedProperties: PropertyValues<this>) {\n    super.updated(changedProperties);\n\n    if (changedProperties.has('gap')) {\n      const isPresetGap = ['small', 'medium', 'large'].includes(\n        String(this.gap),\n      );\n\n      if (isPresetGap) {\n        this.style.gap = '';\n        return;\n      }\n      const gapValue = Number(this.gap) ? `${this.gap}px` : this.gap;\n      this.style.gap = gapValue as string;\n    }\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n\n  static styles = css`\n    :host {\n      --dimension-gap-small: var(--fhi-spacing-100);\n      --dimension-gap-medium: var(--fhi-spacing-200);\n      --dimension-gap-large: var(--fhi-spacing-300);\n    }\n\n    :host {\n      display: flex;\n      gap: var(--dimension-gap-medium);\n    }\n\n    :host([wrap]) {\n      flex-wrap: wrap;\n    }\n\n    :host([direction='row']) {\n      flex-direction: row;\n    }\n\n    :host([direction='column']) {\n      flex-direction: column;\n    }\n\n    :host([gap='small']) {\n      gap: var(--dimension-gap-small);\n    }\n\n    :host([gap='medium']) {\n      gap: var(--dimension-gap-medium);\n    }\n\n    :host([gap='large']) {\n      gap: var(--dimension-gap-large);\n    }\n  `;\n}\n"],"names":["FhiFlexSelector","FhiFlex","LitElement","changedProperties","gapValue","html","css","__decorateClass","property","customElement"],"mappings":";;;;;;AAGO,MAAMA,IAAkB;AAKxB,IAAMC,IAAN,cAAsBC,EAAW;AAAA,EAAjC,cAAA;AAAA,UAAA,GAAA,SAAA,GACsC,KAAA,YACzC,OACyC,KAAA,MAIrB,UACsB,KAAA,OAAO;AAAA,EAAA;AAAA,EAEnD,QAAQC,GAAyC;AAG/C,QAFA,MAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,KAAK,GAAG;AAKhC,UAJoB,CAAC,SAAS,UAAU,OAAO,EAAE;AAAA,QAC/C,OAAO,KAAK,GAAG;AAAA,MAAA,GAGA;AACf,aAAK,MAAM,MAAM;AACjB;AAAA,MACF;AACA,YAAMC,IAAW,OAAO,KAAK,GAAG,IAAI,GAAG,KAAK,GAAG,OAAO,KAAK;AAC3D,WAAK,MAAM,MAAMA;AAAA,IACnB;AAAA,EACF;AAAA,EAEA,SAAS;AACP,WAAOC;AAAAA,EACT;AAsCF;AAnEaJ,EA+BJ,SAASK;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AA9B2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAD9BP,EACgC,WAAA,aAAA,CAAA;AAEAM,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAH9BP,EAGgC,WAAA,OAAA,CAAA;AAKCM,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAR/BP,EAQiC,WAAA,QAAA,CAAA;AARjCA,IAANM,EAAA;AAAA,EADNE,EAAcT,CAAe;AAAA,GACjBC,CAAA;"}

package/fhi-tooltip.js

@@ -294,36 +294,36 @@ const ie = function(t) {
         return {};
       const m = $(o), w = k(l), x = $(l) === l, b = await (c.isRTL == null ? void 0 : c.isRTL(a.floating)), v = d || (x || !g ? [Z(l)] : Ut(l)), X = p !== "none";
       !d && X && v.push(...Zt(l, g, p, b));
-      const B = [l, ...v], lt = await Pt(e, y), U = [];
-      let N = ((i = r.flip) == null ? void 0 : i.overflows) || [];
+      const N = [l, ...v], lt = await Pt(e, y), U = [];
+      let B = ((i = r.flip) == null ? void 0 : i.overflows) || [];
       if (h && U.push(lt[m]), f) {
         const D = qt(o, s, b);
         U.push(lt[D[0]], lt[D[1]]);
       }
-      if (N = [...N, {
+      if (B = [...B, {
         placement: o,
         overflows: U
       }], !U.every((D) => D <= 0)) {
         var gt, yt;
-        const D = (((gt = r.flip) == null ? void 0 : gt.index) || 0) + 1, ct = B[D];
+        const D = (((gt = r.flip) == null ? void 0 : gt.index) || 0) + 1, ct = N[D];
         if (ct && (!(f === "alignment" ? w !== k(ct) : !1) || // We leave the current main axis only if every placement on that axis
         // overflows the main axis.
-        N.every((A) => k(A.placement) === w ? A.overflows[0] > 0 : !0)))
+        B.every((A) => k(A.placement) === w ? A.overflows[0] > 0 : !0)))
           return {
             data: {
               index: D,
-              overflows: N
+              overflows: B
             },
             reset: {
               placement: ct
             }
           };
-        let K = (yt = N.filter((M) => M.overflows[0] <= 0).sort((M, A) => M.overflows[1] - A.overflows[1])[0]) == null ? void 0 : yt.placement;
+        let K = (yt = B.filter((M) => M.overflows[0] <= 0).sort((M, A) => M.overflows[1] - A.overflows[1])[0]) == null ? void 0 : yt.placement;
         if (!K)
           switch (u) {
             case "bestFit": {
               var wt;
-              const M = (wt = N.filter((A) => {
+              const M = (wt = B.filter((A) => {
                 if (X) {
                   const P = k(A.placement);
                   return P === w || // Create a bias to the `y` side axis due to horizontal
@@ -331,7 +331,7 @@ const ie = function(t) {
                   P === "y";
                 }
                 return !0;
-              }).map((A) => [A.placement, A.overflows.filter((P) => P > 0).reduce((P, Nt) => P + Nt, 0)]).sort((A, P) => A[1] - P[1])[0]) == null ? void 0 : wt[0];
+              }).map((A) => [A.placement, A.overflows.filter((P) => P > 0).reduce((P, Bt) => P + Bt, 0)]).sort((A, P) => A[1] - P[1])[0]) == null ? void 0 : wt[0];
               M && (K = M);
               break;
             }
@@ -858,7 +858,7 @@ const Pe = {
   isElement: C,
   isRTL: Ee
 };
-function Bt(t, e) {
+function Nt(t, e) {
   return t.x === e.x && t.y === e.y && t.width === e.width && t.height === e.height;
 }
 function ke(t, e) {
@@ -884,15 +884,15 @@ function ke(t, e) {
     };
     let b = !0;
     function v(X) {
-      const B = X[0].intersectionRatio;
-      if (B !== c) {
+      const N = X[0].intersectionRatio;
+      if (N !== c) {
         if (!b)
           return s();
-        B ? s(!1, B) : i = setTimeout(() => {
+        N ? s(!1, N) : i = setTimeout(() => {
           s(!1, 1e-7);
         }, 1e3);
       }
-      B === 1 && !Bt(a, t.getBoundingClientRect()) && s(), b = !1;
+      N === 1 && !Nt(a, t.getBoundingClientRect()) && s(), b = !1;
     }
     try {
       n = new IntersectionObserver(v, {
@@ -934,7 +934,7 @@ function Fe(t, e, n, i) {
   c && y();
   function y() {
     const m = W(t);
-    g && !Bt(g, m) && n(), g = m, p = requestAnimationFrame(y);
+    g && !Nt(g, m) && n(), g = m, p = requestAnimationFrame(y);
   }
   return n(), () => {
     var m;
@@ -956,12 +956,12 @@ const De = re, Me = le, Ve = ie, $e = (t, e, n) => {
     platform: r
   });
 };
-var We = Object.defineProperty, Be = Object.getOwnPropertyDescriptor, S = (t, e, n, i) => {
-  for (var o = i > 1 ? void 0 : i ? Be(e, n) : e, r = t.length - 1, s; r >= 0; r--)
+var We = Object.defineProperty, Ne = Object.getOwnPropertyDescriptor, S = (t, e, n, i) => {
+  for (var o = i > 1 ? void 0 : i ? Ne(e, n) : e, r = t.length - 1, s; r >= 0; r--)
     (s = t[r]) && (o = (i ? s(e, n, o) : s(o)) || o);
   return i && o && We(e, n, o), o;
 };
-const Ne = "fhi-tooltip";
+const Be = "fhi-tooltip";
 let O = class extends Ht {
   constructor() {
     super(...arguments), this.message = "", this.placement = "top", this.delay = 500, this.trigger = "hover", this.maxWidth = "18.75rem", this._timeoutId = void 0, this._autoPositioningCleanup = () => {
@@ -1122,7 +1122,7 @@ S([
   I({ type: String })
 ], O.prototype, "placement", 2);
 S([
-  I({ type: String })
+  I({ type: Number })
 ], O.prototype, "delay", 2);
 S([
   I({ type: String })
@@ -1146,10 +1146,10 @@ S([
   ht()
 ], O.prototype, "_position", 2);
 O = S([
-  jt(Ne)
+  jt(Be)
 ], O);
 export {
   O as FhiTooltip,
-  Ne as FhiTooltipSelector
+  Be as FhiTooltipSelector
 };
 //# sourceMappingURL=fhi-tooltip.js.map