@adyen/bento-vue2 1.3.0 → 1.4.0

package/dist/timeline.js

@@ -1,64 +1,64 @@
-import { defineComponent as V, ref as A, computed as m, toRefs as j, provide as w, inject as N } from "vue";
-import { n as M } from "./chunks/_plugin-vue2_normalizer.71e2aa87.js";
-import { B as k, a as q } from "./chunks/button.d0c9527d.js";
-import { B as z } from "./chunks/index.73d50fa6.js";
-import { BentoTag as H } from "./tag.js";
-import { B as P, a as J, b as K } from "./chunks/index.56858f4e.js";
-import { B as Z, a as Q, S as W } from "./chunks/index.0cf00b47.js";
-import { C as X } from "./chunks/checkmark-circle-fill.2cfbb81b.js";
-import { C as G } from "./chunks/cross-circle-fill.d5e9ae44.js";
-import { r as ee, e as te, t as C, g as R } from "./chunks/index.f55fdc32.js";
-import { c as ie, a as ae } from "./chunks/index.86453263.js";
+import { defineComponent as j, ref as N, computed as c, toRefs as q, provide as M, inject as R, onUnmounted as z } from "vue";
+import { n as T } from "./chunks/_plugin-vue2_normalizer.71e2aa87.js";
+import { a as H } from "./chunks/button.fb307df3.js";
+import { B as J } from "./chunks/index.9902cae4.js";
+import { BentoTag as K } from "./tag.js";
+import { B as P } from "./chunks/index.45295dd3.js";
+import { B as V, a as Z, S as Q } from "./chunks/index.bd734551.js";
+import { C as W } from "./chunks/checkmark-circle-fill.2cfbb81b.js";
+import { C as X } from "./chunks/cross-circle-fill.d5e9ae44.js";
+import { r as G, e as ee, t as C, g as A } from "./chunks/index.f55fdc32.js";
+import { c as te, a as ie } from "./chunks/index.86453263.js";
 import { g as se } from "./chunks/unique-id.a2a2b458.js";
-import { u as ne } from "./chunks/i18n.155748d6.js";
-import "./assets/index35.css";
-var L = 1e3 * 60, I = 60 * 24, x = I * 30, D = I * 365;
-function B(t, e) {
+import { u as ae } from "./chunks/i18n.155748d6.js";
+import "./assets/index38.css";
+var O = 1e3 * 60, y = 60 * 24, D = y * 30, F = y * 365;
+function U(t, e) {
   var i = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
-  ee(2, arguments);
-  var s = i.locale || te;
+  G(2, arguments);
+  var s = i.locale || ee;
   if (!s.formatDistance)
     throw new RangeError("locale must contain localize.formatDistance property");
-  var d = ie(t, e);
-  if (isNaN(d))
+  var f = te(t, e);
+  if (isNaN(f))
     throw new RangeError("Invalid time value");
-  var r = ae(i);
-  r.addSuffix = !!i.addSuffix, r.comparison = d;
-  var o, c;
-  d > 0 ? (o = C(e), c = C(t)) : (o = C(t), c = C(e));
-  var f = i.roundingMethod == null ? "round" : String(i.roundingMethod), a;
-  if (f === "floor")
-    a = Math.floor;
-  else if (f === "ceil")
-    a = Math.ceil;
-  else if (f === "round")
-    a = Math.round;
+  var n = ie(i);
+  n.addSuffix = !!i.addSuffix, n.comparison = f;
+  var o, d;
+  f > 0 ? (o = C(e), d = C(t)) : (o = C(t), d = C(e));
+  var v = i.roundingMethod == null ? "round" : String(i.roundingMethod), m;
+  if (v === "floor")
+    m = Math.floor;
+  else if (v === "ceil")
+    m = Math.ceil;
+  else if (v === "round")
+    m = Math.round;
   else
     throw new RangeError("roundingMethod must be 'floor', 'ceil' or 'round'");
-  var _ = c.getTime() - o.getTime(), l = _ / L, g = R(c) - R(o), v = (_ - g) / L, n;
-  if (i.unit == null ? l < 1 ? n = "second" : l < 60 ? n = "minute" : l < I ? n = "hour" : v < x ? n = "day" : v < D ? n = "month" : n = "year" : n = String(i.unit), n === "second") {
-    var T = a(_ / 1e3);
-    return s.formatDistance("xSeconds", T, r);
-  } else if (n === "minute") {
-    var E = a(l);
-    return s.formatDistance("xMinutes", E, r);
-  } else if (n === "hour") {
-    var S = a(l / 60);
-    return s.formatDistance("xHours", S, r);
-  } else if (n === "day") {
-    var h = a(v / I);
-    return s.formatDistance("xDays", h, r);
-  } else if (n === "month") {
-    var b = a(v / x);
-    return b === 12 && i.unit !== "month" ? s.formatDistance("xYears", 1, r) : s.formatDistance("xMonths", b, r);
-  } else if (n === "year") {
-    var y = a(v / D);
-    return s.formatDistance("xYears", y, r);
+  var a = d.getTime() - o.getTime(), l = a / O, u = A(d) - A(o), _ = (a - u) / O, r;
+  if (i.unit == null ? l < 1 ? r = "second" : l < 60 ? r = "minute" : l < y ? r = "hour" : _ < D ? r = "day" : _ < F ? r = "month" : r = "year" : r = String(i.unit), r === "second") {
+    var b = m(a / 1e3);
+    return s.formatDistance("xSeconds", b, n);
+  } else if (r === "minute") {
+    var I = m(l);
+    return s.formatDistance("xMinutes", I, n);
+  } else if (r === "hour") {
+    var E = m(l / 60);
+    return s.formatDistance("xHours", E, n);
+  } else if (r === "day") {
+    var S = m(_ / y);
+    return s.formatDistance("xDays", S, n);
+  } else if (r === "month") {
+    var h = m(_ / D);
+    return h === 12 && i.unit !== "month" ? s.formatDistance("xYears", 1, n) : s.formatDistance("xMonths", h, n);
+  } else if (r === "year") {
+    var w = m(_ / F);
+    return s.formatDistance("xYears", w, n);
   }
   throw new RangeError("unit must be 'second', 'minute', 'hour', 'day', 'month' or 'year'");
 }
-var p = /* @__PURE__ */ ((t) => (t.BOTTOM = "bottom", t.AFTER_FIRST = "after-first", t.BEFORE_LAST = "before-last", t))(p || {}), re = /* @__PURE__ */ ((t) => (t.SECOND = "second", t.MINUTE = "minute", t.HOUR = "hour", t.DAY = "day", t.MONTH = "month", t.YEAR = "year", t))(re || {}), u = /* @__PURE__ */ ((t) => (t.DEFAULT = "SquareSmallIcon", t.SUCCESS = "CheckedCircleIcon", t.CRITICAL = "CrossCircleIcon", t))(u || {});
-const U = Symbol("timeline register entry injection key"), Y = Symbol("timeline config obj injection key"), oe = V({
+var p = /* @__PURE__ */ ((t) => (t.BOTTOM = "bottom", t.AFTER_FIRST = "after-first", t.BEFORE_LAST = "before-last", t))(p || {}), ne = /* @__PURE__ */ ((t) => (t.SECOND = "second", t.MINUTE = "minute", t.HOUR = "hour", t.DAY = "day", t.MONTH = "month", t.YEAR = "year", t))(ne || {}), g = /* @__PURE__ */ ((t) => (t.DEFAULT = "SquareSmallIcon", t.SUCCESS = "CheckedCircleIcon", t.CRITICAL = "CrossCircleIcon", t))(g || {});
+const k = Symbol("timeline register entry injection key"), Y = Symbol("timeline config obj injection key"), re = j({
   name: "bento-timeline",
   props: {
     /**
@@ -80,9 +80,9 @@ const U = Symbol("timeline register entry injection key"), Y = Symbol("timeline
     }
   },
   setup(t) {
-    const e = A([]), i = m(
+    const e = N([]), i = c(
       () => t.showMore && e.value.length > t.showMore.limit ? e.value.length - t.showMore.limit : null
-    ), s = A(!1), { timegapLimit: d } = j(t), r = m(() => {
+    ), s = N(!1), { timegapLimit: f } = q(t), n = c(() => {
       if (!t.showMore)
         return null;
       const a = Array.from(e.value.keys());
@@ -90,7 +90,7 @@ const U = Symbol("timeline register entry injection key"), Y = Symbol("timeline
         ...a.slice(0, t.showMore.limit - 1),
         a[a.length - 1]
       ] : t.showMore.placement === p.AFTER_FIRST ? [a[0], ...a.slice(-(t.showMore.limit - 1))] : a.slice(0, t.showMore.limit);
-    }), o = m(() => {
+    }), o = c(() => {
       if (!t.showMore)
         return null;
       switch (t.showMore.placement) {
@@ -102,72 +102,75 @@ const U = Symbol("timeline register entry injection key"), Y = Symbol("timeline
         default:
           return t.showMore.limit - 1;
       }
-    }), c = ({ title: a, date: _ }) => {
-      const l = e.value.length;
-      return e.value.push({ title: a, date: _ }), { timelineEntries: e, index: l };
-    }, f = {
+    }), d = (a) => () => {
+      var l;
+      e.value = (l = e.value) == null ? void 0 : l.filter((u, _) => _ !== a);
+    }, v = ({ title: a, date: l }) => {
+      const u = e.value.length;
+      return e.value.push({ title: a, date: l }), { timelineEntries: e, index: u, unregisterTimelineEntry: d(u) };
+    }, m = {
       showAll: s,
       showMoreIndex: o,
       hiddenItems: i,
-      visibleIndexes: r,
-      timegapLimit: d
+      visibleIndexes: n,
+      timegapLimit: f
     };
-    w(U, c), w(Y, f);
+    M(k, v), M(Y, m);
   }
 });
 var le = function() {
   var e = this, i = e._self._c;
   return e._self._setupProxy, i("ol", { staticClass: "b-timeline" }, [e._t("default")], 2);
-}, me = [], ce = /* @__PURE__ */ M(
-  oe,
+}, oe = [], me = /* @__PURE__ */ T(
+  re,
   le,
-  me,
+  oe,
   !1,
   null,
-  "3ffe9b15",
+  "b9725e78",
   null,
   null
 );
-const De = ce.exports;
-let F = 0;
-const _e = {
+const Oe = me.exports;
+let $ = 0;
+const ce = {
   beforeCreate() {
-    this.uuid = F.toString(), F += 1;
+    this.uuid = $.toString(), $ += 1;
   }
 };
-var ue = function() {
+var _e = function() {
   var e = this, i = e._self._c;
   return i("svg", e._b({ attrs: { role: "img", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "none" } }, "svg", e.$attrs, !1), [e.$attrs["svg-title"] ? i("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), i("path", { attrs: { fill: "#00112C", "fill-rule": "evenodd", d: "M5.5 3.25C4.25736 3.25 3.25 4.25736 3.25 5.5V10.5C3.25 11.7426 4.25736 12.75 5.5 12.75H10.5C11.7426 12.75 12.75 11.7426 12.75 10.5V5.5C12.75 4.25736 11.7426 3.25 10.5 3.25H5.5Z", "clip-rule": "evenodd" } })]);
-}, de = [], fe = /* @__PURE__ */ M(
+}, ue = [], de = /* @__PURE__ */ T(
+  ce,
   _e,
   ue,
-  de,
   !1,
   null,
   "f702de38",
   null,
   null
 );
-const ve = fe.exports, pe = {
+const ve = de.exports, fe = {
   "en-US": {
     timegap: "{timegap} passed between the timeline events",
     showMore: "Show {items} more",
     showLess: "Show less"
   }
-}, he = V({
+}, ge = j({
   name: "bento-timeline-item",
   components: {
-    BentoButton: k,
-    BentoDate: z,
-    BentoTag: H,
+    BentoButton: H,
+    BentoDate: J,
+    BentoTag: K,
     BentoTypography: P,
-    BentoStructuredList: Z,
-    BentoStructuredListItem: Q,
-    CrossCircleIcon: G,
-    CheckedCircleIcon: X,
+    BentoStructuredList: V,
+    BentoStructuredListItem: Z,
+    CrossCircleIcon: X,
+    CheckedCircleIcon: W,
     SquareSmallIcon: ve
   },
-  i18n: { messages: pe },
+  i18n: { messages: fe },
   props: {
     /**
      * Additional timestamp of the event
@@ -217,86 +220,83 @@ const ve = fe.exports, pe = {
      */
     variant: {
       type: String,
-      default: u.DEFAULT,
-      validator: (t) => Object.values(u).includes(t)
+      default: g.DEFAULT,
+      validator: (t) => Object.values(g).includes(t)
     }
   },
   setup(t) {
-    const { t: e } = ne(), i = m(() => ({
-      "b-timeline-item__icon--default": t.variant === u.DEFAULT,
-      "b-timeline-item__icon--success": t.variant === u.SUCCESS,
-      "b-timeline-item__icon--critical": t.variant === u.CRITICAL
-    })), s = m(() => ({
-      "b-timeline-item__title--default": t.variant === u.DEFAULT
+    const { t: e } = ae(), i = c(() => ({
+      "b-timeline-item__icon--default": t.variant === g.DEFAULT,
+      "b-timeline-item__icon--success": t.variant === g.SUCCESS,
+      "b-timeline-item__icon--critical": t.variant === g.CRITICAL
+    })), s = c(() => ({
+      "b-timeline-item__title--default": t.variant === g.DEFAULT
     }));
-    w(W, !0);
-    const d = N(U), { timelineEntries: r, index: o } = d({
+    M(Q, !0);
+    const f = R(k), { timelineEntries: n, index: o, unregisterTimelineEntry: d } = f({
       title: t.title,
       date: t.timestamp.date
-    }), { showAll: c, showMoreIndex: f, hiddenItems: a, visibleIndexes: _, timegapLimit: l } = N(Y), g = m(() => c.value || !_.value), v = m(() => g.value ? !0 : _.value.includes(o)), n = m(() => {
-      var O;
-      if (!l.value)
+    });
+    z(() => d());
+    const { showAll: v, showMoreIndex: m, hiddenItems: a, visibleIndexes: l, timegapLimit: u } = R(Y), _ = c(() => v.value || !l.value), r = c(() => _.value ? !0 : l.value.includes(o)), b = c(() => {
+      var x;
+      if (!u.value)
         return null;
-      const h = (O = r.value[o - 1]) == null ? void 0 : O.date, b = g.value || _.value.includes(o - 1);
-      if (!h || !b)
+      const h = (x = n.value[o - 1]) == null ? void 0 : x.date, w = _.value || l.value.includes(o - 1);
+      if (!h || !w)
         return null;
-      const { date: y } = r.value[o], $ = parseInt(
-        B(h, y, { unit: l.value.unit }),
+      const { date: L } = n.value[o], B = parseInt(
+        U(h, L, { unit: u.value.unit }),
         10
       );
-      return l.value.amount < $ ? B(h, y, { roundingMethod: "floor" }) : null;
-    }), T = m(() => n.value ? e("timegap", { timegap: n.value }) : ""), E = m(() => a.value && f.value === o), S = m(() => o === r.value.length - 1);
+      return u.value.amount < B ? U(h, L, { roundingMethod: "floor" }) : null;
+    }), I = c(() => b.value ? e("timegap", { timegap: b.value }) : ""), E = c(() => a.value && m.value === o), S = c(() => o === n.value.length - 1);
     return {
       // Values
       iconConditionalClasses: i,
       titleConditionalClasses: s,
       displayShowMoreButton: E,
-      showAll: c,
+      showAll: v,
       hiddenItems: a,
-      isVisible: v,
-      timegap: n,
-      timegapAriaLabel: T,
+      isVisible: r,
+      timegap: b,
+      timegapAriaLabel: I,
       isLastItem: S,
       // Methods
       generateUid: se,
-      t: e,
-      // Types
-      BentoTimelineItemVariant: u,
-      BentoTypographyElement: J,
-      BentoTypographyVariant: K,
-      BentoButtonVariant: q
+      t: e
     };
   }
 });
-var ge = function() {
+var he = function() {
   var e = this, i = e._self._c;
-  return e._self._setupProxy, e.isVisible ? i("li", { staticClass: "b-timeline-item" }, [e.timegap ? i("div", { staticClass: "b-timeline-item__row" }, [e._m(0), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-typography", { staticClass: "b-timeline-item__timegap", attrs: { "aria-label": e.timegapAriaLabel } }, [e._v(" " + e._s(e.timegap) + " ")])], 1)]) : e._e(), i("div", { staticClass: "b-timeline-item__row" }, [i("div", { staticClass: "b-timeline-item__marker", attrs: { "aria-hidden": "true" } }, [i(e.variant, { tag: "component", staticClass: "b-timeline-item__icon", class: e.iconConditionalClasses }), e.isLastItem ? e._e() : i("div", { staticClass: "b-timeline-item__separator" })], 1), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-typography", { staticClass: "b-timeline-item__title", class: e.titleConditionalClasses, attrs: { el: e.BentoTypographyElement.DIV, variant: e.BentoTypographyVariant.BODY, strongest: "", role: "heading" } }, [e._v(e._s(e.title))]), e.timestamp ? i("bento-typography", { staticClass: "b-timeline-item__timestamp", attrs: { el: e.BentoTypographyElement.DIV, variant: e.BentoTypographyVariant.CAPTION } }, [i("bento-date", { attrs: { date: e.timestamp.date, format: e.timestamp.format, "disable-typography": "" } }), e._v(" " + e._s(e.timestamp.value) + " ")], 1) : e._e(), e.additionalTimestamp ? i("bento-typography", { staticClass: "b-timeline-item__timestamp", attrs: { el: e.BentoTypographyElement.DIV, variant: e.BentoTypographyVariant.CAPTION } }, [i("bento-date", { attrs: { date: e.additionalTimestamp.date, format: e.additionalTimestamp.format, "disable-typography": "" } }), e._v(" " + e._s(e.additionalTimestamp.value) + " ")], 1) : e._e(), e.description ? i("bento-typography", { staticClass: "b-timeline-item__description", attrs: { el: e.BentoTypographyElement.DIV, variant: e.BentoTypographyVariant.BODY } }, [e._v(e._s(e.description))]) : e._e(), e.dataList ? i("div", { staticClass: "b-timeline-item__data-list" }, [i("bento-structured-list", e._l(e.dataList, function(s) {
-    return i("bento-structured-list-item", { key: e.generateUid(s.label), attrs: { label: s.label } }, [i("bento-typography", { attrs: { variant: e.BentoTypographyVariant.CAPTION } }, [e._v(e._s(s.value))])], 1);
-  }), 1)], 1) : e._e(), e.tag ? i("bento-tag", e._b({ staticClass: "b-timeline-item__tag" }, "bento-tag", e.tag, !1)) : e._e()], 1)]), e.displayShowMoreButton ? i("div", { staticClass: "b-timeline-item__row" }, [e._m(1), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-button", { staticClass: "b-timeline__show-more", attrs: { variant: e.BentoButtonVariant.TERTIARY }, on: { click: function(s) {
+  return e._self._setupProxy, e.isVisible ? i("li", { staticClass: "b-timeline-item" }, [e.timegap ? i("div", { staticClass: "b-timeline-item__row" }, [e._m(0), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-typography", { staticClass: "b-timeline-item__timegap", attrs: { "aria-label": e.timegapAriaLabel } }, [e._v(" " + e._s(e.timegap) + " ")])], 1)]) : e._e(), i("div", { staticClass: "b-timeline-item__row" }, [i("div", { staticClass: "b-timeline-item__marker", attrs: { "aria-hidden": "true" } }, [i(e.variant, { tag: "component", staticClass: "b-timeline-item__icon", class: e.iconConditionalClasses }), e.isLastItem ? e._e() : i("div", { staticClass: "b-timeline-item__separator", attrs: { "data-testid": "last-timeline-item-separator" } })], 1), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-typography", { staticClass: "b-timeline-item__title", class: e.titleConditionalClasses, attrs: { el: "div", variant: "body", strongest: "", role: "heading" } }, [e._v(e._s(e.title))]), e.timestamp ? i("bento-typography", { staticClass: "b-timeline-item__timestamp", attrs: { el: "div", variant: "caption" } }, [i("bento-date", { attrs: { date: e.timestamp.date, format: e.timestamp.format, "disable-typography": "" } }), e._v(" " + e._s(e.timestamp.value) + " ")], 1) : e._e(), e.additionalTimestamp ? i("bento-typography", { staticClass: "b-timeline-item__timestamp", attrs: { el: "div", variant: "caption" } }, [i("bento-date", { attrs: { date: e.additionalTimestamp.date, format: e.additionalTimestamp.format, "disable-typography": "" } }), e._v(" " + e._s(e.additionalTimestamp.value) + " ")], 1) : e._e(), e.description ? i("bento-typography", { staticClass: "b-timeline-item__description", attrs: { el: "div", variant: "body" } }, [e._v(e._s(e.description))]) : e._e(), e.dataList ? i("div", { staticClass: "b-timeline-item__data-list" }, [i("bento-structured-list", e._l(e.dataList, function(s) {
+    return i("bento-structured-list-item", { key: e.generateUid(s.label), attrs: { label: s.label } }, [i("bento-typography", { attrs: { variant: "caption" } }, [e._v(e._s(s.value))])], 1);
+  }), 1)], 1) : e._e(), e.tag ? i("bento-tag", e._b({ staticClass: "b-timeline-item__tag" }, "bento-tag", e.tag, !1)) : e._e()], 1)]), e.displayShowMoreButton ? i("div", { staticClass: "b-timeline-item__row" }, [e._m(1), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-button", { staticClass: "b-timeline__show-more", attrs: { variant: "tertiary" }, on: { click: function(s) {
     e.showAll = !e.showAll;
   } } }, [e.showAll ? [e._v(e._s(e.t("showLess")))] : [e._v(e._s(e.t("showMore", { items: e.hiddenItems })))]], 2)], 1)]) : e._e()]) : e._e();
-}, be = [function() {
+}, pe = [function() {
   var t = this, e = t._self._c;
   return t._self._setupProxy, e("div", { staticClass: "b-timeline-item__marker", attrs: { "aria-hidden": "true" } }, [e("div", { staticClass: "b-timeline-item__icon b-timeline-item__icon--timegap" }), e("div", { staticClass: "b-timeline-item__separator" })]);
 }, function() {
   var t = this, e = t._self._c;
   return t._self._setupProxy, e("div", { staticClass: "b-timeline-item__marker", attrs: { "aria-hidden": "true" } }, [e("div", { staticClass: "b-timeline-item__separator" })]);
-}], ye = /* @__PURE__ */ M(
-  he,
+}], be = /* @__PURE__ */ T(
   ge,
-  be,
+  he,
+  pe,
   !1,
   null,
-  "64d58f44",
+  "3fb349f6",
   null,
   null
 );
-const Be = ye.exports;
+const De = be.exports;
 export {
-  De as BentoTimeline,
-  re as BentoTimelineGapUnit,
-  Be as BentoTimelineItem,
-  u as BentoTimelineItemVariant,
+  Oe as BentoTimeline,
+  ne as BentoTimelineGapUnit,
+  De as BentoTimelineItem,
+  g as BentoTimelineItemVariant,
   p as BentoTimelineShowMorePlacement
 };
 //# sourceMappingURL=timeline.js.map

package/dist/timeline.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeline.js","sources":["../../../node_modules/date-fns/esm/formatDistanceStrict/index.js","../src/components/timeline/timeline.types.ts","../src/components/timeline/timeline.keys.ts","../src/components/timeline/timeline.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/square-small-fill.vue","../src/components/timeline/components/timeline-item/timeline-item.vue"],"sourcesContent":["import getTimezoneOffsetInMilliseconds from \"../_lib/getTimezoneOffsetInMilliseconds/index.js\";\nimport compareAsc from \"../compareAsc/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport cloneObject from \"../_lib/cloneObject/index.js\";\nimport defaultLocale from \"../locale/en-US/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\nvar MILLISECONDS_IN_MINUTE = 1000 * 60;\nvar MINUTES_IN_DAY = 60 * 24;\nvar MINUTES_IN_MONTH = MINUTES_IN_DAY * 30;\nvar MINUTES_IN_YEAR = MINUTES_IN_DAY * 365;\n/**\n * @name formatDistanceStrict\n * @category Common Helpers\n * @summary Return the distance between the given dates in words.\n *\n * @description\n * Return the distance between the given dates in words, using strict units.\n * This is like `formatDistance`, but does not use helpers like 'almost', 'over',\n * 'less than' and the like.\n *\n * | Distance between dates | Result              |\n * |------------------------|---------------------|\n * | 0 ... 59 secs          | [0..59] seconds     |\n * | 1 ... 59 mins          | [1..59] minutes     |\n * | 1 ... 23 hrs           | [1..23] hours       |\n * | 1 ... 29 days          | [1..29] days        |\n * | 1 ... 11 months        | [1..11] months      |\n * | 1 ... N years          | [1..N]  years       |\n *\n * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * - The function was renamed from `distanceInWordsStrict` to `formatDistanceStrict`\n *   to make its name consistent with `format` and `formatRelative`.\n *\n * - The order of arguments is swapped to make the function\n *   consistent with `differenceIn...` functions.\n *\n *   ```javascript\n *   // Before v2.0.0\n *\n *   distanceInWordsStrict(\n *     new Date(2015, 0, 2),\n *     new Date(2014, 6, 2)\n *   ) //=> '6 months'\n *\n *   // v2.0.0 onward\n *\n *   formatDistanceStrict(\n *     new Date(2014, 6, 2),\n *     new Date(2015, 0, 2)\n *   ) //=> '6 months'\n *   ```\n *\n * - `partialMethod` option is renamed to `roundingMethod`.\n *\n *   ```javascript\n *   // Before v2.0.0\n *\n *   distanceInWordsStrict(\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     { partialMethod: 'ceil' }\n *   ) //=> '2 minutes'\n *\n *   // v2.0.0 onward\n *\n *   formatDistanceStrict(\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     { roundingMethod: 'ceil' }\n *   ) //=> '2 minutes'\n *   ```\n *\n * - If `roundingMethod` is not specified, it now defaults to `round` instead of `floor`.\n *\n * - `unit` option now accepts one of the strings:\n *   'second', 'minute', 'hour', 'day', 'month' or 'year' instead of 's', 'm', 'h', 'd', 'M' or 'Y'\n *\n *   ```javascript\n *   // Before v2.0.0\n *\n *   distanceInWordsStrict(\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     { unit: 'm' }\n *   )\n *\n *   // v2.0.0 onward\n *\n *   formatDistanceStrict(\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     { unit: 'minute' }\n *   )\n *   ```\n *\n * @param {Date|Number} date - the date\n * @param {Date|Number} baseDate - the date to compare with\n * @param {Object} [options] - an object with options.\n * @param {Boolean} [options.addSuffix=false] - result indicates if the second date is earlier or later than the first\n * @param {'second'|'minute'|'hour'|'day'|'month'|'year'} [options.unit] - if specified, will force a unit\n * @param {'floor'|'ceil'|'round'} [options.roundingMethod='round'] - which way to round partial units\n * @param {Locale} [options.locale=defaultLocale] - the locale object. See [Locale]{@link https://date-fns.org/docs/Locale}\n * @returns {String} the distance in words\n * @throws {TypeError} 2 arguments required\n * @throws {RangeError} `date` must not be Invalid Date\n * @throws {RangeError} `baseDate` must not be Invalid Date\n * @throws {RangeError} `options.roundingMethod` must be 'floor', 'ceil' or 'round'\n * @throws {RangeError} `options.unit` must be 'second', 'minute', 'hour', 'day', 'month' or 'year'\n * @throws {RangeError} `options.locale` must contain `formatDistance` property\n *\n * @example\n * // What is the distance between 2 July 2014 and 1 January 2015?\n * const result = formatDistanceStrict(new Date(2014, 6, 2), new Date(2015, 0, 2))\n * //=> '6 months'\n *\n * @example\n * // What is the distance between 1 January 2015 00:00:15\n * // and 1 January 2015 00:00:00?\n * const result = formatDistanceStrict(\n *   new Date(2015, 0, 1, 0, 0, 15),\n *   new Date(2015, 0, 1, 0, 0, 0)\n * )\n * //=> '15 seconds'\n *\n * @example\n * // What is the distance from 1 January 2016\n * // to 1 January 2015, with a suffix?\n * const result = formatDistanceStrict(new Date(2015, 0, 1), new Date(2016, 0, 1), {\n *   addSuffix: true\n * })\n * //=> '1 year ago'\n *\n * @example\n * // What is the distance from 1 January 2016\n * // to 1 January 2015, in minutes?\n * const result = formatDistanceStrict(new Date(2016, 0, 1), new Date(2015, 0, 1), {\n *   unit: 'minute'\n * })\n * //=> '525600 minutes'\n *\n * @example\n * // What is the distance from 1 January 2015\n * // to 28 January 2015, in months, rounded up?\n * const result = formatDistanceStrict(new Date(2015, 0, 28), new Date(2015, 0, 1), {\n *   unit: 'month',\n *   roundingMethod: 'ceil'\n * })\n * //=> '1 month'\n *\n * @example\n * // What is the distance between 1 August 2016 and 1 January 2015 in Esperanto?\n * import { eoLocale } from 'date-fns/locale/eo'\n * const result = formatDistanceStrict(new Date(2016, 7, 1), new Date(2015, 0, 1), {\n *   locale: eoLocale\n * })\n * //=> '1 jaro'\n */\n\nexport default function formatDistanceStrict(dirtyDate, dirtyBaseDate) {\n  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n  requiredArgs(2, arguments);\n  var locale = options.locale || defaultLocale;\n\n  if (!locale.formatDistance) {\n    throw new RangeError('locale must contain localize.formatDistance property');\n  }\n\n  var comparison = compareAsc(dirtyDate, dirtyBaseDate);\n\n  if (isNaN(comparison)) {\n    throw new RangeError('Invalid time value');\n  }\n\n  var localizeOptions = cloneObject(options);\n  localizeOptions.addSuffix = Boolean(options.addSuffix);\n  localizeOptions.comparison = comparison;\n  var dateLeft;\n  var dateRight;\n\n  if (comparison > 0) {\n    dateLeft = toDate(dirtyBaseDate);\n    dateRight = toDate(dirtyDate);\n  } else {\n    dateLeft = toDate(dirtyDate);\n    dateRight = toDate(dirtyBaseDate);\n  }\n\n  var roundingMethod = options.roundingMethod == null ? 'round' : String(options.roundingMethod);\n  var roundingMethodFn;\n\n  if (roundingMethod === 'floor') {\n    roundingMethodFn = Math.floor;\n  } else if (roundingMethod === 'ceil') {\n    roundingMethodFn = Math.ceil;\n  } else if (roundingMethod === 'round') {\n    roundingMethodFn = Math.round;\n  } else {\n    throw new RangeError(\"roundingMethod must be 'floor', 'ceil' or 'round'\");\n  }\n\n  var milliseconds = dateRight.getTime() - dateLeft.getTime();\n  var minutes = milliseconds / MILLISECONDS_IN_MINUTE;\n  var timezoneOffset = getTimezoneOffsetInMilliseconds(dateRight) - getTimezoneOffsetInMilliseconds(dateLeft); // Use DST-normalized difference in minutes for years, months and days;\n  // use regular difference in minutes for hours, minutes and seconds.\n\n  var dstNormalizedMinutes = (milliseconds - timezoneOffset) / MILLISECONDS_IN_MINUTE;\n  var unit;\n\n  if (options.unit == null) {\n    if (minutes < 1) {\n      unit = 'second';\n    } else if (minutes < 60) {\n      unit = 'minute';\n    } else if (minutes < MINUTES_IN_DAY) {\n      unit = 'hour';\n    } else if (dstNormalizedMinutes < MINUTES_IN_MONTH) {\n      unit = 'day';\n    } else if (dstNormalizedMinutes < MINUTES_IN_YEAR) {\n      unit = 'month';\n    } else {\n      unit = 'year';\n    }\n  } else {\n    unit = String(options.unit);\n  } // 0 up to 60 seconds\n\n\n  if (unit === 'second') {\n    var seconds = roundingMethodFn(milliseconds / 1000);\n    return locale.formatDistance('xSeconds', seconds, localizeOptions); // 1 up to 60 mins\n  } else if (unit === 'minute') {\n    var roundedMinutes = roundingMethodFn(minutes);\n    return locale.formatDistance('xMinutes', roundedMinutes, localizeOptions); // 1 up to 24 hours\n  } else if (unit === 'hour') {\n    var hours = roundingMethodFn(minutes / 60);\n    return locale.formatDistance('xHours', hours, localizeOptions); // 1 up to 30 days\n  } else if (unit === 'day') {\n    var days = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_DAY);\n    return locale.formatDistance('xDays', days, localizeOptions); // 1 up to 12 months\n  } else if (unit === 'month') {\n    var months = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_MONTH);\n    return months === 12 && options.unit !== 'month' ? locale.formatDistance('xYears', 1, localizeOptions) : locale.formatDistance('xMonths', months, localizeOptions); // 1 year up to max Date\n  } else if (unit === 'year') {\n    var years = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_YEAR);\n    return locale.formatDistance('xYears', years, localizeOptions);\n  }\n\n  throw new RangeError(\"unit must be 'second', 'minute', 'hour', 'day', 'month' or 'year'\");\n}","import { BentoDateFormat } from '@/components/date/date.types';\nimport { BentoTag } from '@/components/tag';\nimport { Ref } from 'vue';\n\nexport enum BentoTimelineShowMorePlacement {\n    BOTTOM = 'bottom',\n    AFTER_FIRST = 'after-first',\n    BEFORE_LAST = 'before-last',\n}\n\nexport interface BentoTimelineShowMoreObject {\n    limit: number;\n    placement?: BentoTimelineShowMorePlacement;\n}\n\nexport enum BentoTimelineGapUnit {\n    SECOND = 'second',\n    MINUTE = 'minute',\n    HOUR = 'hour',\n    DAY = 'day',\n    MONTH = 'month',\n    YEAR = 'year',\n}\n\nexport interface BentoTimelineGapObject {\n    amount: number;\n    unit: BentoTimelineGapUnit;\n}\n\nexport enum BentoTimelineItemVariant {\n    DEFAULT = 'SquareSmallIcon',\n    SUCCESS = 'CheckedCircleIcon',\n    CRITICAL = 'CrossCircleIcon',\n}\n\nexport interface BentoTimelineTimestamp {\n    date: Date | number;\n    format?: BentoDateFormat;\n    value?: string;\n}\n\nexport interface BentoTimelineDataListObject {\n    label: string;\n    value: string;\n}\n\nexport type BentoTimelineDataList = Array<BentoTimelineDataListObject>;\n\nexport type BentoTimelineTagProps = InstanceType<typeof BentoTag>['$props'];\n\nexport interface BentoTimelineEntry {\n    title: string;\n    date: Date | number;\n}\n\nexport type BentoTimelineRegisterEntry = (props: {\n    title: string;\n    date: Date | number;\n}) => { timelineEntries: Ref<BentoTimelineEntry[]>; index: number };\n\nexport interface BentoTimelineConfigData {\n    showAll: Ref<boolean>;\n    showMoreIndex: Ref<number>;\n    hiddenItems: Ref<number>;\n    visibleIndexes: Ref<number[]>;\n    timegapLimit: Ref<BentoTimelineGapObject>;\n}\n","export const TIMELINE_REGISTER_ENTRY_INJECTION_KEY = Symbol('timeline register entry injection key');\nexport const TIMELINE_CONFIG_INJECTION_KEY = Symbol('timeline config obj injection key');\n","<template>\n    <ol class=\"b-timeline\">\n        <slot />\n    </ol>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, provide, ref, toRefs } from 'vue';\n    import {\n        BentoTimelineConfigData,\n        BentoTimelineEntry,\n        BentoTimelineGapObject,\n        BentoTimelineRegisterEntry,\n        BentoTimelineShowMoreObject,\n        BentoTimelineShowMorePlacement,\n    } from './timeline.types';\n    import { TIMELINE_CONFIG_INJECTION_KEY, TIMELINE_REGISTER_ENTRY_INJECTION_KEY } from './timeline.keys';\n\n    /**\n     * Timeline displays a collection of events in a reverse chronological order (newest event is displayed on the top).\n     *\n     * @example\n     * import { BentoTimeline } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoTimeline },\n     *     template: `\n     *          <bento-timeline>\n     *              <bento-timeline-item\n     *                  title=\"Milestone 1\"\n     *                  :timestamp=\"{ date: new Date(), value: 'Created at' }\"\n     *                  :additional-timestamp=\"{ date: new Date(), value: 'Modified at' }\"\n     *                  description=\"Milestone description\"\n     *                  :tag=\"{ label: 'Tag'}\"\n     *              />\n     *              <bento-timeline-item\n     *                  title=\"Milestone 2\"\n     *                  :timestamp=\"{\n     *                      date: new Date(),\n     *                      value: 'Created at',\n     *                      format: BentoDateFormat.FULL_DATE_EXACT_TIME_WITHOUT_PERIOD\n     *                  }\"\n     *                  description=\"Milestone description\"\n     *                  :data-list=\"[\n     *                      { label: 'Label', value: 'Value' },\n     *                      { label: 'Label', value: 'Value' },\n     *                  ]\"\n     *              />\n     *          </bento-timeline>\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'bento-timeline',\n        props: {\n            /**\n             * Object that determines the max number of items to show without clicking the show more button\n             * and where in the timeline is the show more button placed\n             */\n            showMore: {\n                type: Object as PropType<BentoTimelineShowMoreObject>,\n                default: null,\n            },\n            /**\n             * Object that determines minimum amount of time for the automatic timegap indicator;\n             * Define a unit (hour, day, month) and an amount (e.g. { amount: 7, unit: 'days' }).\n             * If null, automatic timegap detection will be turned off\n             */\n            timegapLimit: {\n                type: Object as PropType<BentoTimelineGapObject>,\n                default: null,\n            },\n        },\n\n        setup(props) {\n            const timelineEntries = ref<BentoTimelineEntry[]>([]);\n            const hiddenItems = computed(() =>\n                props.showMore && timelineEntries.value.length > props.showMore.limit\n                    ? timelineEntries.value.length - props.showMore.limit\n                    : null\n            );\n            const showAll = ref(false);\n            const { timegapLimit } = toRefs(props);\n\n            const visibleIndexes = computed(() => {\n                if (!props.showMore) return null;\n\n                const timelineIndexes = Array.from(timelineEntries.value.keys());\n\n                if (props.showMore.placement === BentoTimelineShowMorePlacement.BEFORE_LAST) {\n                    return [\n                        ...timelineIndexes.slice(0, props.showMore.limit - 1),\n                        timelineIndexes[timelineIndexes.length - 1],\n                    ];\n                }\n\n                if (props.showMore.placement === BentoTimelineShowMorePlacement.AFTER_FIRST) {\n                    return [timelineIndexes[0], ...timelineIndexes.slice(-(props.showMore.limit - 1))];\n                }\n\n                return timelineIndexes.slice(0, props.showMore.limit);\n            });\n\n            const showMoreIndex = computed(() => {\n                if (!props.showMore) {\n                    return null;\n                }\n\n                switch (props.showMore.placement) {\n                    case BentoTimelineShowMorePlacement.BEFORE_LAST:\n                        return props.showMore.limit - 2;\n                    case BentoTimelineShowMorePlacement.AFTER_FIRST:\n                        return 0;\n                    case BentoTimelineShowMorePlacement.BOTTOM:\n                    default:\n                        return props.showMore.limit - 1;\n                }\n            });\n\n            const registerTimelineEntry: BentoTimelineRegisterEntry = ({ title, date }) => {\n                // item index is the same as the length of the array BEFORE the item gets added\n                // e.g. if the array is empty, length is 0 and the index of the item will also be 0\n                const index = timelineEntries.value.length;\n\n                // add entry to timeline entries\n                timelineEntries.value.push({ title, date });\n\n                // return values to the Timeline-Item component\n                return { timelineEntries, index };\n            };\n\n            const configData: BentoTimelineConfigData = {\n                showAll,\n                showMoreIndex,\n                hiddenItems,\n                visibleIndexes,\n                timegapLimit,\n            };\n\n            // provide register timeline entry and config data timeline items\n            provide(TIMELINE_REGISTER_ENTRY_INJECTION_KEY, registerTimelineEntry);\n            provide(TIMELINE_CONFIG_INJECTION_KEY, configData);\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./timeline.scss\" />\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M5.5 3.25C4.25736 3.25 3.25 4.25736 3.25 5.5V10.5C3.25 11.7426 4.25736 12.75 5.5 12.75H10.5C11.7426 12.75 12.75 11.7426 12.75 10.5V5.5C12.75 4.25736 11.7426 3.25 10.5 3.25H5.5Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n<style scoped lang=\"scss\">\n    svg {\n        display: inline-flex;\n        flex-shrink: 0;\n    }\n    \n    svg,\n    svg * {\n        fill: currentcolor;\n    }\n</style>\n","<template>\n    <li v-if=\"isVisible\" class=\"b-timeline-item\">\n        <div v-if=\"timegap\" class=\"b-timeline-item__row\">\n            <div class=\"b-timeline-item__marker\" aria-hidden=\"true\">\n                <div class=\"b-timeline-item__icon b-timeline-item__icon--timegap\"></div>\n                <div class=\"b-timeline-item__separator\"></div>\n            </div>\n            <div class=\"b-timeline-item__content\">\n                <bento-typography class=\"b-timeline-item__timegap\" :aria-label=\"timegapAriaLabel\">\n                    {{ timegap }}\n                </bento-typography>\n            </div>\n        </div>\n        <div class=\"b-timeline-item__row\">\n            <div class=\"b-timeline-item__marker\" aria-hidden=\"true\">\n                <component :is=\"variant\" class=\"b-timeline-item__icon\" :class=\"iconConditionalClasses\" />\n                <div v-if=\"!isLastItem\" class=\"b-timeline-item__separator\"></div>\n            </div>\n            <div class=\"b-timeline-item__content\">\n                <bento-typography\n                    :el=\"BentoTypographyElement.DIV\"\n                    :variant=\"BentoTypographyVariant.BODY\"\n                    strongest\n                    class=\"b-timeline-item__title\"\n                    :class=\"titleConditionalClasses\"\n                    role=\"heading\"\n                    >{{ title }}</bento-typography\n                >\n\n                <bento-typography\n                    v-if=\"timestamp\"\n                    class=\"b-timeline-item__timestamp\"\n                    :el=\"BentoTypographyElement.DIV\"\n                    :variant=\"BentoTypographyVariant.CAPTION\"\n                >\n                    <bento-date :date=\"timestamp.date\" :format=\"timestamp.format\" disable-typography />\n                    {{ timestamp.value }}\n                </bento-typography>\n\n                <bento-typography\n                    v-if=\"additionalTimestamp\"\n                    class=\"b-timeline-item__timestamp\"\n                    :el=\"BentoTypographyElement.DIV\"\n                    :variant=\"BentoTypographyVariant.CAPTION\"\n                >\n                    <bento-date\n                        :date=\"additionalTimestamp.date\"\n                        :format=\"additionalTimestamp.format\"\n                        disable-typography\n                    />\n                    {{ additionalTimestamp.value }}\n                </bento-typography>\n\n                <bento-typography\n                    v-if=\"description\"\n                    :el=\"BentoTypographyElement.DIV\"\n                    :variant=\"BentoTypographyVariant.BODY\"\n                    class=\"b-timeline-item__description\"\n                    >{{ description }}</bento-typography\n                >\n\n                <div v-if=\"dataList\" class=\"b-timeline-item__data-list\">\n                    <bento-structured-list>\n                        <bento-structured-list-item\n                            v-for=\"entry in dataList\"\n                            :key=\"generateUid(entry.label)\"\n                            :label=\"entry.label\"\n                        >\n                            <bento-typography :variant=\"BentoTypographyVariant.CAPTION\">{{\n                                entry.value\n                            }}</bento-typography>\n                        </bento-structured-list-item>\n                    </bento-structured-list>\n                </div>\n                <bento-tag v-if=\"tag\" v-bind=\"tag\" class=\"b-timeline-item__tag\" />\n            </div>\n        </div>\n        <div v-if=\"displayShowMoreButton\" class=\"b-timeline-item__row\">\n            <div class=\"b-timeline-item__marker\" aria-hidden=\"true\">\n                <div class=\"b-timeline-item__separator\"></div>\n            </div>\n            <div class=\"b-timeline-item__content\">\n                <bento-button\n                    class=\"b-timeline__show-more\"\n                    :variant=\"BentoButtonVariant.TERTIARY\"\n                    @click=\"showAll = !showAll\"\n                >\n                    <template v-if=\"!showAll\">{{ t('showMore', { items: hiddenItems }) }}</template>\n                    <template v-else>{{ t('showLess') }}</template>\n                </bento-button>\n            </div>\n        </div>\n    </li>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, inject, PropType, provide } from 'vue';\n\n    // Components\n    import { BentoButton, BentoButtonVariant } from '@/components/button';\n    import { BentoDate } from '@/components/date';\n    import { BentoTag } from '@/components/tag';\n    import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n    import { BentoStructuredList, BentoStructuredListItem } from '@/components/structured-list';\n\n    import SquareSmallIcon from '@adyen/ui-assets-icons-16/vue/square-small-fill';\n    import CheckedCircleIcon from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n    import CrossCircleIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill';\n\n    // Utils\n    import formatDistanceStrict from 'date-fns/formatDistanceStrict';\n    import { generateUid } from '@/utils/ts/unique-id';\n    import { useI18n } from '@/utils/ts/i18n';\n\n    // Types\n    import {\n        BentoTimelineConfigData,\n        BentoTimelineDataList,\n        BentoTimelineItemVariant,\n        BentoTimelineRegisterEntry,\n        BentoTimelineTagProps,\n        BentoTimelineTimestamp,\n    } from '../../timeline.types';\n\n    // Keys\n    import { TIMELINE_CONFIG_INJECTION_KEY, TIMELINE_REGISTER_ENTRY_INJECTION_KEY } from '../../timeline.keys';\n    import { STRUCTURED_LIST_CONDENSED_INJECTION_KEY } from '@/components/structured-list/structured-list.keys';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    /**\n     * TimelineItem renders each event in the Timeline component\n     *\n     * @example\n     * import { BentoTimelineItem } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoTimelineItem },\n     *     template: `\n     *          <bento-timeline-item\n     *              title=\"Milestone\"\n     *              :timestamp=\"{ date: new Date(), value: 'Created at', format: BentoDateFormat.FULL_DATE_EXACT_TIME_WITHOUT_PERIOD }\"\n     *              :additional-timestamp=\"{ date: new Date(), value: 'Modified at' }\"\n     *              description=\"Milestone description\"\n     *              :data-list=\"[\n     *                 { label: 'Label', value: 'Value' },\n     *                 { label: 'Label', value: 'Value' },\n     *              ]\"\n     *              :tag=\"{ label: 'Tag'}\"\n     *          />\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'bento-timeline-item',\n        components: {\n            BentoButton,\n            BentoDate,\n            BentoTag,\n            BentoTypography,\n            BentoStructuredList,\n            BentoStructuredListItem,\n            CrossCircleIcon,\n            CheckedCircleIcon,\n            SquareSmallIcon,\n        },\n        i18n: { messages },\n        props: {\n            /**\n             * Additional timestamp of the event\n             */\n            additionalTimestamp: {\n                type: Object as PropType<BentoTimelineTimestamp>,\n                default: null,\n            },\n\n            /**\n             * Relevant key-value pair data to display in the event\n             */\n            dataList: {\n                type: Array as PropType<BentoTimelineDataList>,\n                default: null,\n            },\n\n            /**\n             * Description of the event\n             */\n            description: {\n                type: String,\n                default: null,\n            },\n\n            /**\n             * Tag props that will be passed down to inner tag component\n             */\n            tag: {\n                type: Object as PropType<BentoTimelineTagProps>,\n                default: undefined,\n            },\n\n            /**\n             * Main timestamp of the event. Used for timegap detection.\n             */\n            timestamp: {\n                type: Object as PropType<BentoTimelineTimestamp>,\n                required: true,\n            },\n\n            /**\n             * Title of the event\n             */\n            title: {\n                type: String,\n                required: true,\n            },\n\n            /**\n             * Variant for the timeline item\n             * @values DEFAULT, SUCCESS, CRITICAL\n             */\n            variant: {\n                type: String as PropType<BentoTimelineItemVariant | `${BentoTimelineItemVariant}`>,\n                default: BentoTimelineItemVariant.DEFAULT,\n                validator: (value: BentoTimelineItemVariant) => Object.values(BentoTimelineItemVariant).includes(value),\n            },\n        },\n\n        setup(props) {\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n            const iconConditionalClasses = computed(() => ({\n                'b-timeline-item__icon--default': props.variant === BentoTimelineItemVariant.DEFAULT,\n                'b-timeline-item__icon--success': props.variant === BentoTimelineItemVariant.SUCCESS,\n                'b-timeline-item__icon--critical': props.variant === BentoTimelineItemVariant.CRITICAL,\n            }));\n\n            const titleConditionalClasses = computed(() => ({\n                'b-timeline-item__title--default': props.variant === BentoTimelineItemVariant.DEFAULT,\n            }));\n\n            // Provide STRUCTURED_LIST_CONDENSED_INJECTION_KEY as true, to set the internal condensed style in the BentoStructuredList comp\n            provide(STRUCTURED_LIST_CONDENSED_INJECTION_KEY, true);\n\n            // Register timeline entry to the timeline entries array\n            const registerTimelineEntry: BentoTimelineRegisterEntry = inject(TIMELINE_REGISTER_ENTRY_INJECTION_KEY);\n            const { timelineEntries, index } = registerTimelineEntry({\n                title: props.title,\n                date: props.timestamp.date,\n            });\n\n            // Get timeline config data from the parent Timeline comp\n            const { showAll, showMoreIndex, hiddenItems, visibleIndexes, timegapLimit }: BentoTimelineConfigData =\n                inject(TIMELINE_CONFIG_INJECTION_KEY);\n\n            const allItemsShowing = computed(() => showAll.value || !visibleIndexes.value);\n\n            const isVisible = computed(() => (allItemsShowing.value ? true : visibleIndexes.value.includes(index)));\n\n            const timegap = computed(() => {\n                if (!timegapLimit.value) {\n                    return null;\n                }\n\n                const previousDate = timelineEntries.value[index - 1]?.date;\n                const isPreviousItemVisible = allItemsShowing.value || visibleIndexes.value.includes(index - 1);\n\n                if (!previousDate || !isPreviousItemVisible) {\n                    return null;\n                }\n\n                const { date } = timelineEntries.value[index];\n                const timegapInSelectedUnit = parseInt(\n                    formatDistanceStrict(previousDate, date, { unit: timegapLimit.value.unit }),\n                    10\n                );\n\n                return timegapLimit.value.amount < timegapInSelectedUnit\n                    ? formatDistanceStrict(previousDate, date, { roundingMethod: 'floor' })\n                    : null;\n            });\n\n            const timegapAriaLabel = computed(() => (timegap.value ? t('timegap', { timegap: timegap.value }) : ''));\n\n            const displayShowMoreButton = computed(() => hiddenItems.value && showMoreIndex.value === index);\n\n            const isLastItem = computed(() => index === timelineEntries.value.length - 1);\n\n            return {\n                // Values\n                iconConditionalClasses,\n                titleConditionalClasses,\n                displayShowMoreButton,\n                showAll,\n                hiddenItems,\n                isVisible,\n                timegap,\n                timegapAriaLabel,\n                isLastItem,\n\n                // Methods\n                generateUid,\n                t,\n\n                // Types\n                BentoTimelineItemVariant,\n                BentoTypographyElement,\n                BentoTypographyVariant,\n                BentoButtonVariant,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./timeline-item.scss\" />\n"],"names":["MILLISECONDS_IN_MINUTE","MINUTES_IN_DAY","MINUTES_IN_MONTH","MINUTES_IN_YEAR","formatDistanceStrict","dirtyDate","dirtyBaseDate","options","requiredArgs","locale","enUS","comparison","compareAsc","localizeOptions","cloneObject","dateLeft","dateRight","toDate","roundingMethod","roundingMethodFn","milliseconds","minutes","timezoneOffset","getTimezoneOffsetInMilliseconds","dstNormalizedMinutes","unit","seconds","roundedMinutes","hours","days","months","years","BentoTimelineShowMorePlacement","BentoTimelineShowMorePlacement2","BentoTimelineGapUnit","BentoTimelineGapUnit2","BentoTimelineItemVariant","BentoTimelineItemVariant2","TIMELINE_REGISTER_ENTRY_INJECTION_KEY","TIMELINE_CONFIG_INJECTION_KEY","_sfc_main$2","defineComponent","props","timelineEntries","ref","hiddenItems","computed","showAll","timegapLimit","toRefs","visibleIndexes","timelineIndexes","showMoreIndex","registerTimelineEntry","title","date","index","configData","provide","uuid","_sfc_main$1","_sfc_main","BentoButton","BentoDate","BentoTag","BentoTypography","BentoStructuredList","BentoStructuredListItem","CrossCircleIcon","CheckedCircleIcon","SquareSmallIcon","messages","value","t","useI18n","iconConditionalClasses","titleConditionalClasses","STRUCTURED_LIST_CONDENSED_INJECTION_KEY","inject","allItemsShowing","isVisible","timegap","previousDate","_a","isPreviousItemVisible","timegapInSelectedUnit","timegapAriaLabel","displayShowMoreButton","isLastItem","generateUid","BentoTypographyElement","BentoTypographyVariant","BentoButtonVariant"],"mappings":"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","x_google_ignoreList":[0,4]}
+{"version":3,"file":"timeline.js","sources":["../../../node_modules/date-fns/esm/formatDistanceStrict/index.js","../src/components/timeline/timeline.types.ts","../src/components/timeline/timeline.keys.ts","../src/components/timeline/timeline.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/square-small-fill.vue","../src/components/timeline/components/timeline-item/timeline-item.vue"],"sourcesContent":["import getTimezoneOffsetInMilliseconds from \"../_lib/getTimezoneOffsetInMilliseconds/index.js\";\nimport compareAsc from \"../compareAsc/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport cloneObject from \"../_lib/cloneObject/index.js\";\nimport defaultLocale from \"../locale/en-US/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\nvar MILLISECONDS_IN_MINUTE = 1000 * 60;\nvar MINUTES_IN_DAY = 60 * 24;\nvar MINUTES_IN_MONTH = MINUTES_IN_DAY * 30;\nvar MINUTES_IN_YEAR = MINUTES_IN_DAY * 365;\n/**\n * @name formatDistanceStrict\n * @category Common Helpers\n * @summary Return the distance between the given dates in words.\n *\n * @description\n * Return the distance between the given dates in words, using strict units.\n * This is like `formatDistance`, but does not use helpers like 'almost', 'over',\n * 'less than' and the like.\n *\n * | Distance between dates | Result              |\n * |------------------------|---------------------|\n * | 0 ... 59 secs          | [0..59] seconds     |\n * | 1 ... 59 mins          | [1..59] minutes     |\n * | 1 ... 23 hrs           | [1..23] hours       |\n * | 1 ... 29 days          | [1..29] days        |\n * | 1 ... 11 months        | [1..11] months      |\n * | 1 ... N years          | [1..N]  years       |\n *\n * ### v2.0.0 breaking changes:\n *\n * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).\n *\n * - The function was renamed from `distanceInWordsStrict` to `formatDistanceStrict`\n *   to make its name consistent with `format` and `formatRelative`.\n *\n * - The order of arguments is swapped to make the function\n *   consistent with `differenceIn...` functions.\n *\n *   ```javascript\n *   // Before v2.0.0\n *\n *   distanceInWordsStrict(\n *     new Date(2015, 0, 2),\n *     new Date(2014, 6, 2)\n *   ) //=> '6 months'\n *\n *   // v2.0.0 onward\n *\n *   formatDistanceStrict(\n *     new Date(2014, 6, 2),\n *     new Date(2015, 0, 2)\n *   ) //=> '6 months'\n *   ```\n *\n * - `partialMethod` option is renamed to `roundingMethod`.\n *\n *   ```javascript\n *   // Before v2.0.0\n *\n *   distanceInWordsStrict(\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     { partialMethod: 'ceil' }\n *   ) //=> '2 minutes'\n *\n *   // v2.0.0 onward\n *\n *   formatDistanceStrict(\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     { roundingMethod: 'ceil' }\n *   ) //=> '2 minutes'\n *   ```\n *\n * - If `roundingMethod` is not specified, it now defaults to `round` instead of `floor`.\n *\n * - `unit` option now accepts one of the strings:\n *   'second', 'minute', 'hour', 'day', 'month' or 'year' instead of 's', 'm', 'h', 'd', 'M' or 'Y'\n *\n *   ```javascript\n *   // Before v2.0.0\n *\n *   distanceInWordsStrict(\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     { unit: 'm' }\n *   )\n *\n *   // v2.0.0 onward\n *\n *   formatDistanceStrict(\n *     new Date(1986, 3, 4, 10, 33, 1),\n *     new Date(1986, 3, 4, 10, 32, 0),\n *     { unit: 'minute' }\n *   )\n *   ```\n *\n * @param {Date|Number} date - the date\n * @param {Date|Number} baseDate - the date to compare with\n * @param {Object} [options] - an object with options.\n * @param {Boolean} [options.addSuffix=false] - result indicates if the second date is earlier or later than the first\n * @param {'second'|'minute'|'hour'|'day'|'month'|'year'} [options.unit] - if specified, will force a unit\n * @param {'floor'|'ceil'|'round'} [options.roundingMethod='round'] - which way to round partial units\n * @param {Locale} [options.locale=defaultLocale] - the locale object. See [Locale]{@link https://date-fns.org/docs/Locale}\n * @returns {String} the distance in words\n * @throws {TypeError} 2 arguments required\n * @throws {RangeError} `date` must not be Invalid Date\n * @throws {RangeError} `baseDate` must not be Invalid Date\n * @throws {RangeError} `options.roundingMethod` must be 'floor', 'ceil' or 'round'\n * @throws {RangeError} `options.unit` must be 'second', 'minute', 'hour', 'day', 'month' or 'year'\n * @throws {RangeError} `options.locale` must contain `formatDistance` property\n *\n * @example\n * // What is the distance between 2 July 2014 and 1 January 2015?\n * const result = formatDistanceStrict(new Date(2014, 6, 2), new Date(2015, 0, 2))\n * //=> '6 months'\n *\n * @example\n * // What is the distance between 1 January 2015 00:00:15\n * // and 1 January 2015 00:00:00?\n * const result = formatDistanceStrict(\n *   new Date(2015, 0, 1, 0, 0, 15),\n *   new Date(2015, 0, 1, 0, 0, 0)\n * )\n * //=> '15 seconds'\n *\n * @example\n * // What is the distance from 1 January 2016\n * // to 1 January 2015, with a suffix?\n * const result = formatDistanceStrict(new Date(2015, 0, 1), new Date(2016, 0, 1), {\n *   addSuffix: true\n * })\n * //=> '1 year ago'\n *\n * @example\n * // What is the distance from 1 January 2016\n * // to 1 January 2015, in minutes?\n * const result = formatDistanceStrict(new Date(2016, 0, 1), new Date(2015, 0, 1), {\n *   unit: 'minute'\n * })\n * //=> '525600 minutes'\n *\n * @example\n * // What is the distance from 1 January 2015\n * // to 28 January 2015, in months, rounded up?\n * const result = formatDistanceStrict(new Date(2015, 0, 28), new Date(2015, 0, 1), {\n *   unit: 'month',\n *   roundingMethod: 'ceil'\n * })\n * //=> '1 month'\n *\n * @example\n * // What is the distance between 1 August 2016 and 1 January 2015 in Esperanto?\n * import { eoLocale } from 'date-fns/locale/eo'\n * const result = formatDistanceStrict(new Date(2016, 7, 1), new Date(2015, 0, 1), {\n *   locale: eoLocale\n * })\n * //=> '1 jaro'\n */\n\nexport default function formatDistanceStrict(dirtyDate, dirtyBaseDate) {\n  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n  requiredArgs(2, arguments);\n  var locale = options.locale || defaultLocale;\n\n  if (!locale.formatDistance) {\n    throw new RangeError('locale must contain localize.formatDistance property');\n  }\n\n  var comparison = compareAsc(dirtyDate, dirtyBaseDate);\n\n  if (isNaN(comparison)) {\n    throw new RangeError('Invalid time value');\n  }\n\n  var localizeOptions = cloneObject(options);\n  localizeOptions.addSuffix = Boolean(options.addSuffix);\n  localizeOptions.comparison = comparison;\n  var dateLeft;\n  var dateRight;\n\n  if (comparison > 0) {\n    dateLeft = toDate(dirtyBaseDate);\n    dateRight = toDate(dirtyDate);\n  } else {\n    dateLeft = toDate(dirtyDate);\n    dateRight = toDate(dirtyBaseDate);\n  }\n\n  var roundingMethod = options.roundingMethod == null ? 'round' : String(options.roundingMethod);\n  var roundingMethodFn;\n\n  if (roundingMethod === 'floor') {\n    roundingMethodFn = Math.floor;\n  } else if (roundingMethod === 'ceil') {\n    roundingMethodFn = Math.ceil;\n  } else if (roundingMethod === 'round') {\n    roundingMethodFn = Math.round;\n  } else {\n    throw new RangeError(\"roundingMethod must be 'floor', 'ceil' or 'round'\");\n  }\n\n  var milliseconds = dateRight.getTime() - dateLeft.getTime();\n  var minutes = milliseconds / MILLISECONDS_IN_MINUTE;\n  var timezoneOffset = getTimezoneOffsetInMilliseconds(dateRight) - getTimezoneOffsetInMilliseconds(dateLeft); // Use DST-normalized difference in minutes for years, months and days;\n  // use regular difference in minutes for hours, minutes and seconds.\n\n  var dstNormalizedMinutes = (milliseconds - timezoneOffset) / MILLISECONDS_IN_MINUTE;\n  var unit;\n\n  if (options.unit == null) {\n    if (minutes < 1) {\n      unit = 'second';\n    } else if (minutes < 60) {\n      unit = 'minute';\n    } else if (minutes < MINUTES_IN_DAY) {\n      unit = 'hour';\n    } else if (dstNormalizedMinutes < MINUTES_IN_MONTH) {\n      unit = 'day';\n    } else if (dstNormalizedMinutes < MINUTES_IN_YEAR) {\n      unit = 'month';\n    } else {\n      unit = 'year';\n    }\n  } else {\n    unit = String(options.unit);\n  } // 0 up to 60 seconds\n\n\n  if (unit === 'second') {\n    var seconds = roundingMethodFn(milliseconds / 1000);\n    return locale.formatDistance('xSeconds', seconds, localizeOptions); // 1 up to 60 mins\n  } else if (unit === 'minute') {\n    var roundedMinutes = roundingMethodFn(minutes);\n    return locale.formatDistance('xMinutes', roundedMinutes, localizeOptions); // 1 up to 24 hours\n  } else if (unit === 'hour') {\n    var hours = roundingMethodFn(minutes / 60);\n    return locale.formatDistance('xHours', hours, localizeOptions); // 1 up to 30 days\n  } else if (unit === 'day') {\n    var days = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_DAY);\n    return locale.formatDistance('xDays', days, localizeOptions); // 1 up to 12 months\n  } else if (unit === 'month') {\n    var months = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_MONTH);\n    return months === 12 && options.unit !== 'month' ? locale.formatDistance('xYears', 1, localizeOptions) : locale.formatDistance('xMonths', months, localizeOptions); // 1 year up to max Date\n  } else if (unit === 'year') {\n    var years = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_YEAR);\n    return locale.formatDistance('xYears', years, localizeOptions);\n  }\n\n  throw new RangeError(\"unit must be 'second', 'minute', 'hour', 'day', 'month' or 'year'\");\n}","import { BentoDateFormat } from '@/components/date/date.types';\nimport { BentoTag } from '@/components/tag';\nimport { Ref } from 'vue';\n\nexport enum BentoTimelineShowMorePlacement {\n    BOTTOM = 'bottom',\n    AFTER_FIRST = 'after-first',\n    BEFORE_LAST = 'before-last',\n}\n\nexport interface BentoTimelineShowMoreObject {\n    limit: number;\n    placement?: BentoTimelineShowMorePlacement;\n}\n\nexport enum BentoTimelineGapUnit {\n    SECOND = 'second',\n    MINUTE = 'minute',\n    HOUR = 'hour',\n    DAY = 'day',\n    MONTH = 'month',\n    YEAR = 'year',\n}\n\nexport interface BentoTimelineGapObject {\n    amount: number;\n    unit: BentoTimelineGapUnit;\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoTimelineItemVariant {\n    DEFAULT = 'SquareSmallIcon',\n    SUCCESS = 'CheckedCircleIcon',\n    CRITICAL = 'CrossCircleIcon',\n}\n\nexport interface BentoTimelineTimestamp {\n    date: Date | number;\n    format?: BentoDateFormat;\n    value?: string;\n}\n\nexport interface BentoTimelineDataListObject {\n    label: string;\n    value: string;\n}\n\nexport type BentoTimelineDataList = Array<BentoTimelineDataListObject>;\n\nexport type BentoTimelineTagProps = InstanceType<typeof BentoTag>['$props'];\n\nexport interface BentoTimelineEntry {\n    title: string;\n    date: Date | number;\n}\n\nexport type BentoTimelineRegisterEntry = (props: {\n    title: string;\n    date: Date | number;\n}) => { timelineEntries: Ref<BentoTimelineEntry[]>; index: number; unregisterTimelineEntry: () => void };\n\nexport interface BentoTimelineConfigData {\n    showAll: Ref<boolean>;\n    showMoreIndex: Ref<number>;\n    hiddenItems: Ref<number>;\n    visibleIndexes: Ref<number[]>;\n    timegapLimit: Ref<BentoTimelineGapObject>;\n}\n","export const TIMELINE_REGISTER_ENTRY_INJECTION_KEY = Symbol('timeline register entry injection key');\nexport const TIMELINE_CONFIG_INJECTION_KEY = Symbol('timeline config obj injection key');\n","<template>\n    <ol class=\"b-timeline\">\n        <slot />\n    </ol>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, provide, ref, toRefs } from 'vue';\n    import {\n        BentoTimelineConfigData,\n        BentoTimelineEntry,\n        BentoTimelineGapObject,\n        BentoTimelineRegisterEntry,\n        BentoTimelineShowMoreObject,\n        BentoTimelineShowMorePlacement,\n    } from './timeline.types';\n    import { TIMELINE_CONFIG_INJECTION_KEY, TIMELINE_REGISTER_ENTRY_INJECTION_KEY } from './timeline.keys';\n\n    /**\n     * Timeline displays a collection of events in a reverse chronological order (newest event is displayed on the top).\n     *\n     * @example\n     * import { BentoDateFormat, BentoTimeline } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoTimeline },\n     *     template: `\n     *          <bento-timeline>\n     *              <bento-timeline-item\n     *                  title=\"Milestone 1\"\n     *                  :timestamp=\"{ date: new Date(), value: 'Created at' }\"\n     *                  :additional-timestamp=\"{ date: new Date(), value: 'Modified at' }\"\n     *                  description=\"Milestone description\"\n     *                  :tag=\"{ label: 'Tag'}\"\n     *              />\n     *              <bento-timeline-item\n     *                  title=\"Milestone 2\"\n     *                  :timestamp=\"{\n     *                      date: new Date(),\n     *                      value: 'Created at',\n     *                      format: BentoDateFormat.FULL_DATE_EXACT_TIME_WITHOUT_PERIOD\n     *                  }\"\n     *                  description=\"Milestone description\"\n     *                  :data-list=\"[\n     *                      { label: 'Label', value: 'Value' },\n     *                      { label: 'Label', value: 'Value' },\n     *                  ]\"\n     *              />\n     *          </bento-timeline>\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'bento-timeline',\n        props: {\n            /**\n             * Object that determines the max number of items to show without clicking the show more button\n             * and where in the timeline is the show more button placed\n             */\n            showMore: {\n                type: Object as PropType<BentoTimelineShowMoreObject>,\n                default: null,\n            },\n            /**\n             * Object that determines minimum amount of time for the automatic timegap indicator;\n             * Define a unit (hour, day, month) and an amount (e.g. { amount: 7, unit: 'days' }).\n             * If null, automatic timegap detection will be turned off\n             */\n            timegapLimit: {\n                type: Object as PropType<BentoTimelineGapObject>,\n                default: null,\n            },\n        },\n\n        setup(props) {\n            const timelineEntries = ref<BentoTimelineEntry[]>([]);\n            const hiddenItems = computed(() =>\n                props.showMore && timelineEntries.value.length > props.showMore.limit\n                    ? timelineEntries.value.length - props.showMore.limit\n                    : null\n            );\n            const showAll = ref(false);\n            const { timegapLimit } = toRefs(props);\n\n            const visibleIndexes = computed(() => {\n                if (!props.showMore) return null;\n\n                const timelineIndexes = Array.from(timelineEntries.value.keys());\n\n                if (props.showMore.placement === BentoTimelineShowMorePlacement.BEFORE_LAST) {\n                    return [\n                        ...timelineIndexes.slice(0, props.showMore.limit - 1),\n                        timelineIndexes[timelineIndexes.length - 1],\n                    ];\n                }\n\n                if (props.showMore.placement === BentoTimelineShowMorePlacement.AFTER_FIRST) {\n                    return [timelineIndexes[0], ...timelineIndexes.slice(-(props.showMore.limit - 1))];\n                }\n\n                return timelineIndexes.slice(0, props.showMore.limit);\n            });\n\n            const showMoreIndex = computed(() => {\n                if (!props.showMore) {\n                    return null;\n                }\n\n                switch (props.showMore.placement) {\n                    case BentoTimelineShowMorePlacement.BEFORE_LAST:\n                        return props.showMore.limit - 2;\n                    case BentoTimelineShowMorePlacement.AFTER_FIRST:\n                        return 0;\n                    case BentoTimelineShowMorePlacement.BOTTOM:\n                    default:\n                        return props.showMore.limit - 1;\n                }\n            });\n\n            // unregister timeline item if removed / destroyed\n            const unregisterTimelineEntry = (tabIndexToRemove: number) => () => {\n                timelineEntries.value = timelineEntries.value?.filter((_item, index) => index !== tabIndexToRemove);\n            };\n\n            const registerTimelineEntry: BentoTimelineRegisterEntry = ({ title, date }) => {\n                // item index is the same as the length of the array BEFORE the item gets added\n                // e.g. if the array is empty, length is 0 and the index of the item will also be 0\n                const index = timelineEntries.value.length;\n\n                // add entry to timeline entries\n                timelineEntries.value.push({ title, date });\n\n                // return values to the Timeline-Item component\n                return { timelineEntries, index, unregisterTimelineEntry: unregisterTimelineEntry(index) };\n            };\n\n            const configData: BentoTimelineConfigData = {\n                showAll,\n                showMoreIndex,\n                hiddenItems,\n                visibleIndexes,\n                timegapLimit,\n            };\n\n            // provide register timeline entry and config data timeline items\n            provide(TIMELINE_REGISTER_ENTRY_INJECTION_KEY, registerTimelineEntry);\n            provide(TIMELINE_CONFIG_INJECTION_KEY, configData);\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./timeline.scss\" />\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M5.5 3.25C4.25736 3.25 3.25 4.25736 3.25 5.5V10.5C3.25 11.7426 4.25736 12.75 5.5 12.75H10.5C11.7426 12.75 12.75 11.7426 12.75 10.5V5.5C12.75 4.25736 11.7426 3.25 10.5 3.25H5.5Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n<style scoped lang=\"scss\">\n    svg {\n        display: inline-flex;\n        flex-shrink: 0;\n    }\n    \n    svg,\n    svg * {\n        fill: currentcolor;\n    }\n</style>\n","<template>\n    <li v-if=\"isVisible\" class=\"b-timeline-item\">\n        <div v-if=\"timegap\" class=\"b-timeline-item__row\">\n            <div class=\"b-timeline-item__marker\" aria-hidden=\"true\">\n                <div class=\"b-timeline-item__icon b-timeline-item__icon--timegap\"></div>\n                <div class=\"b-timeline-item__separator\"></div>\n            </div>\n            <div class=\"b-timeline-item__content\">\n                <bento-typography class=\"b-timeline-item__timegap\" :aria-label=\"timegapAriaLabel\">\n                    {{ timegap }}\n                </bento-typography>\n            </div>\n        </div>\n        <div class=\"b-timeline-item__row\">\n            <div class=\"b-timeline-item__marker\" aria-hidden=\"true\">\n                <component :is=\"variant\" class=\"b-timeline-item__icon\" :class=\"iconConditionalClasses\" />\n                <div\n                    v-if=\"!isLastItem\"\n                    class=\"b-timeline-item__separator\"\n                    data-testid=\"last-timeline-item-separator\"\n                ></div>\n            </div>\n            <div class=\"b-timeline-item__content\">\n                <bento-typography\n                    el=\"div\"\n                    variant=\"body\"\n                    strongest\n                    class=\"b-timeline-item__title\"\n                    :class=\"titleConditionalClasses\"\n                    role=\"heading\"\n                    >{{ title }}</bento-typography\n                >\n\n                <bento-typography v-if=\"timestamp\" class=\"b-timeline-item__timestamp\" el=\"div\" variant=\"caption\">\n                    <bento-date :date=\"timestamp.date\" :format=\"timestamp.format\" disable-typography />\n                    {{ timestamp.value }}\n                </bento-typography>\n\n                <bento-typography\n                    v-if=\"additionalTimestamp\"\n                    class=\"b-timeline-item__timestamp\"\n                    el=\"div\"\n                    variant=\"caption\"\n                >\n                    <bento-date\n                        :date=\"additionalTimestamp.date\"\n                        :format=\"additionalTimestamp.format\"\n                        disable-typography\n                    />\n                    {{ additionalTimestamp.value }}\n                </bento-typography>\n\n                <bento-typography v-if=\"description\" el=\"div\" variant=\"body\" class=\"b-timeline-item__description\">{{\n                    description\n                }}</bento-typography>\n\n                <div v-if=\"dataList\" class=\"b-timeline-item__data-list\">\n                    <bento-structured-list>\n                        <bento-structured-list-item\n                            v-for=\"entry in dataList\"\n                            :key=\"generateUid(entry.label)\"\n                            :label=\"entry.label\"\n                        >\n                            <bento-typography variant=\"caption\">{{ entry.value }}</bento-typography>\n                        </bento-structured-list-item>\n                    </bento-structured-list>\n                </div>\n                <bento-tag v-if=\"tag\" v-bind=\"tag\" class=\"b-timeline-item__tag\" />\n            </div>\n        </div>\n        <div v-if=\"displayShowMoreButton\" class=\"b-timeline-item__row\">\n            <div class=\"b-timeline-item__marker\" aria-hidden=\"true\">\n                <div class=\"b-timeline-item__separator\"></div>\n            </div>\n            <div class=\"b-timeline-item__content\">\n                <bento-button class=\"b-timeline__show-more\" variant=\"tertiary\" @click=\"showAll = !showAll\">\n                    <template v-if=\"!showAll\">{{ t('showMore', { items: hiddenItems }) }}</template>\n                    <template v-else>{{ t('showLess') }}</template>\n                </bento-button>\n            </div>\n        </div>\n    </li>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, inject, onUnmounted, PropType, provide } from 'vue';\n\n    // Components\n    import { BentoButton } from '@/components/button';\n    import { BentoDate } from '@/components/date';\n    import { BentoTag } from '@/components/tag';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoStructuredList, BentoStructuredListItem } from '@/components/structured-list';\n\n    import SquareSmallIcon from '@adyen/ui-assets-icons-16/vue/square-small-fill';\n    import CheckedCircleIcon from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n    import CrossCircleIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill';\n\n    // Utils\n    import formatDistanceStrict from 'date-fns/formatDistanceStrict';\n    import { generateUid } from '@/utils/ts/unique-id';\n    import { useI18n } from '@/utils/ts/i18n';\n\n    // Types\n    import {\n        BentoTimelineConfigData,\n        BentoTimelineDataList,\n        BentoTimelineItemVariant,\n        BentoTimelineRegisterEntry,\n        BentoTimelineTagProps,\n        BentoTimelineTimestamp,\n    } from '../../timeline.types';\n\n    // Keys\n    import { TIMELINE_CONFIG_INJECTION_KEY, TIMELINE_REGISTER_ENTRY_INJECTION_KEY } from '../../timeline.keys';\n    import { STRUCTURED_LIST_CONDENSED_INJECTION_KEY } from '@/components/structured-list/structured-list.keys';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    /**\n     * TimelineItem renders each event in the Timeline component\n     *\n     * @example\n     * import { BentoDateFormat, BentoTimelineItem } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoTimelineItem },\n     *     template: `\n     *          <bento-timeline-item\n     *              title=\"Milestone\"\n     *              :timestamp=\"{ date: new Date(), value: 'Created at', format: BentoDateFormat.FULL_DATE_EXACT_TIME_WITHOUT_PERIOD }\"\n     *              :additional-timestamp=\"{ date: new Date(), value: 'Modified at' }\"\n     *              description=\"Milestone description\"\n     *              :data-list=\"[\n     *                 { label: 'Label', value: 'Value' },\n     *                 { label: 'Label', value: 'Value' },\n     *              ]\"\n     *              :tag=\"{ label: 'Tag'}\"\n     *          />\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'bento-timeline-item',\n        components: {\n            BentoButton,\n            BentoDate,\n            BentoTag,\n            BentoTypography,\n            BentoStructuredList,\n            BentoStructuredListItem,\n            CrossCircleIcon,\n            CheckedCircleIcon,\n            SquareSmallIcon,\n        },\n        i18n: { messages },\n        props: {\n            /**\n             * Additional timestamp of the event\n             */\n            additionalTimestamp: {\n                type: Object as PropType<BentoTimelineTimestamp>,\n                default: null,\n            },\n\n            /**\n             * Relevant key-value pair data to display in the event\n             */\n            dataList: {\n                type: Array as PropType<BentoTimelineDataList>,\n                default: null,\n            },\n\n            /**\n             * Description of the event\n             */\n            description: {\n                type: String,\n                default: null,\n            },\n\n            /**\n             * Tag props that will be passed down to inner tag component\n             */\n            tag: {\n                type: Object as PropType<BentoTimelineTagProps>,\n                default: undefined,\n            },\n\n            /**\n             * Main timestamp of the event. Used for timegap detection.\n             */\n            timestamp: {\n                type: Object as PropType<BentoTimelineTimestamp>,\n                required: true,\n            },\n\n            /**\n             * Title of the event\n             */\n            title: {\n                type: String,\n                required: true,\n            },\n\n            /**\n             * Variant for the timeline item\n             * @values DEFAULT, SUCCESS, CRITICAL\n             */\n            variant: {\n                type: String as PropType<BentoTimelineItemVariant | `${BentoTimelineItemVariant}`>,\n                default: BentoTimelineItemVariant.DEFAULT,\n                validator: (value: BentoTimelineItemVariant) => Object.values(BentoTimelineItemVariant).includes(value),\n            },\n        },\n\n        setup(props) {\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n            const iconConditionalClasses = computed(() => ({\n                'b-timeline-item__icon--default': props.variant === BentoTimelineItemVariant.DEFAULT,\n                'b-timeline-item__icon--success': props.variant === BentoTimelineItemVariant.SUCCESS,\n                'b-timeline-item__icon--critical': props.variant === BentoTimelineItemVariant.CRITICAL,\n            }));\n\n            const titleConditionalClasses = computed(() => ({\n                'b-timeline-item__title--default': props.variant === BentoTimelineItemVariant.DEFAULT,\n            }));\n\n            // Provide STRUCTURED_LIST_CONDENSED_INJECTION_KEY as true, to set the internal condensed style in the BentoStructuredList comp\n            provide(STRUCTURED_LIST_CONDENSED_INJECTION_KEY, true);\n\n            // Register timeline entry to the timeline entries array\n            const registerTimelineEntry: BentoTimelineRegisterEntry = inject(TIMELINE_REGISTER_ENTRY_INJECTION_KEY);\n            const { timelineEntries, index, unregisterTimelineEntry } = registerTimelineEntry({\n                title: props.title,\n                date: props.timestamp.date,\n            });\n\n            // On unmounting timeline item, unregister it from the parent timeline component\n            onUnmounted(() => unregisterTimelineEntry());\n\n            // Get timeline config data from the parent Timeline comp\n            const { showAll, showMoreIndex, hiddenItems, visibleIndexes, timegapLimit }: BentoTimelineConfigData =\n                inject(TIMELINE_CONFIG_INJECTION_KEY);\n\n            const allItemsShowing = computed(() => showAll.value || !visibleIndexes.value);\n\n            const isVisible = computed(() => (allItemsShowing.value ? true : visibleIndexes.value.includes(index)));\n\n            const timegap = computed(() => {\n                if (!timegapLimit.value) {\n                    return null;\n                }\n\n                const previousDate = timelineEntries.value[index - 1]?.date;\n                const isPreviousItemVisible = allItemsShowing.value || visibleIndexes.value.includes(index - 1);\n\n                if (!previousDate || !isPreviousItemVisible) {\n                    return null;\n                }\n\n                const { date } = timelineEntries.value[index];\n                const timegapInSelectedUnit = parseInt(\n                    formatDistanceStrict(previousDate, date, { unit: timegapLimit.value.unit }),\n                    10\n                );\n\n                return timegapLimit.value.amount < timegapInSelectedUnit\n                    ? formatDistanceStrict(previousDate, date, { roundingMethod: 'floor' })\n                    : null;\n            });\n\n            const timegapAriaLabel = computed(() => (timegap.value ? t('timegap', { timegap: timegap.value }) : ''));\n\n            const displayShowMoreButton = computed(() => hiddenItems.value && showMoreIndex.value === index);\n\n            const isLastItem = computed(() => index === timelineEntries.value.length - 1);\n\n            return {\n                // Values\n                iconConditionalClasses,\n                titleConditionalClasses,\n                displayShowMoreButton,\n                showAll,\n                hiddenItems,\n                isVisible,\n                timegap,\n                timegapAriaLabel,\n                isLastItem,\n\n                // Methods\n                generateUid,\n                t,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./timeline-item.scss\" />\n"],"names":["MILLISECONDS_IN_MINUTE","MINUTES_IN_DAY","MINUTES_IN_MONTH","MINUTES_IN_YEAR","formatDistanceStrict","dirtyDate","dirtyBaseDate","options","requiredArgs","locale","enUS","comparison","compareAsc","localizeOptions","cloneObject","dateLeft","dateRight","toDate","roundingMethod","roundingMethodFn","milliseconds","minutes","timezoneOffset","getTimezoneOffsetInMilliseconds","dstNormalizedMinutes","unit","seconds","roundedMinutes","hours","days","months","years","BentoTimelineShowMorePlacement","BentoTimelineShowMorePlacement2","BentoTimelineGapUnit","BentoTimelineGapUnit2","BentoTimelineItemVariant","BentoTimelineItemVariant2","TIMELINE_REGISTER_ENTRY_INJECTION_KEY","TIMELINE_CONFIG_INJECTION_KEY","_sfc_main$2","defineComponent","props","timelineEntries","ref","hiddenItems","computed","showAll","timegapLimit","toRefs","visibleIndexes","timelineIndexes","showMoreIndex","unregisterTimelineEntry","tabIndexToRemove","_a","_item","index","registerTimelineEntry","title","date","configData","provide","uuid","_sfc_main$1","_sfc_main","BentoButton","BentoDate","BentoTag","BentoTypography","BentoStructuredList","BentoStructuredListItem","CrossCircleIcon","CheckedCircleIcon","SquareSmallIcon","messages","value","t","useI18n","iconConditionalClasses","titleConditionalClasses","STRUCTURED_LIST_CONDENSED_INJECTION_KEY","inject","onUnmounted","allItemsShowing","isVisible","timegap","previousDate","isPreviousItemVisible","timegapInSelectedUnit","timegapAriaLabel","displayShowMoreButton","isLastItem","generateUid"],"mappings":"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","x_google_ignoreList":[0,4]}