@adyen/bento-vue2 1.28.1 → 1.29.0

package/dist/chunks/timeline-item.ScTrUBKC.js

@@ -1,364 +0,0 @@
-import { defineComponent as Y, computed as r, ref as w, toRefs as Z, provide as A, inject as D, onUnmounted as G } from "vue";
-import { B as z } from "./button.DhAUh5JA.js";
-import { B as Q } from "./textarea.CcKbtQBs.js";
-import { u as H } from "./i18n.BQkEbtPM.js";
-import { B as X } from "./button-actions.Bg9ey0p6.js";
-import { n as R } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import { B as tt } from "./date.DKjxxR6P.js";
-import { B as et } from "./link.DJ1A53gF.js";
-import { B as it } from "./tag.bhKrZHTU.js";
-import { B as at, d as st } from "./typography.Bjtu3Gca.js";
-import { B as nt, a as ot, S as rt } from "./structured-list-item.C9NTVDvT.js";
-import { g as lt } from "./unique-id.XFfoKuc2.js";
-import { u as mt } from "./use-has-slot.C9lQZ6nz.js";
-import { r as ct, l as dt, t as T, g as k } from "./index.B_UZQ6qF.js";
-import { c as ut, a as _t } from "./index.xqFSZOAb.js";
-import "../assets/timeline-item.css";
-var B = 1e3 * 60, M = 60 * 24, F = M * 30, $ = M * 365;
-function j(e, t) {
-  var i = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
-  ct(2, arguments);
-  var a = i.locale || dt;
-  if (!a.formatDistance)
-    throw new RangeError("locale must contain localize.formatDistance property");
-  var f = ut(e, t);
-  if (isNaN(f))
-    throw new RangeError("Invalid time value");
-  var l = _t(i);
-  l.addSuffix = !!i.addSuffix, l.comparison = f;
-  var b, c;
-  f > 0 ? (b = T(t), c = T(e)) : (b = T(e), c = T(t));
-  var d = i.roundingMethod == null ? "round" : String(i.roundingMethod), n;
-  if (d === "floor")
-    n = Math.floor;
-  else if (d === "ceil")
-    n = Math.ceil;
-  else if (d === "round")
-    n = Math.round;
-  else
-    throw new RangeError("roundingMethod must be 'floor', 'ceil' or 'round'");
-  var m = c.getTime() - b.getTime(), u = m / B, C = k(c) - k(b), _ = (m - C) / B, s;
-  if (i.unit == null ? u < 1 ? s = "second" : u < 60 ? s = "minute" : u < M ? s = "hour" : _ < F ? s = "day" : _ < $ ? s = "month" : s = "year" : s = String(i.unit), s === "second") {
-    var p = n(m / 1e3);
-    return a.formatDistance("xSeconds", p, l);
-  } else if (s === "minute") {
-    var g = n(u);
-    return a.formatDistance("xMinutes", g, l);
-  } else if (s === "hour") {
-    var E = n(u / 60);
-    return a.formatDistance("xHours", E, l);
-  } else if (s === "day") {
-    var I = n(_ / M);
-    return a.formatDistance("xDays", I, l);
-  } else if (s === "month") {
-    var o = n(_ / F);
-    return o === 12 && i.unit !== "month" ? a.formatDistance("xYears", 1, l) : a.formatDistance("xMonths", o, l);
-  } else if (s === "year") {
-    var v = n(_ / $);
-    return a.formatDistance("xYears", v, l);
-  }
-  throw new RangeError("unit must be 'second', 'minute', 'hour', 'day', 'month' or 'year'");
-}
-var y = /* @__PURE__ */ ((e) => (e.BOTTOM = "bottom", e.AFTER_FIRST = "after-first", e.BEFORE_LAST = "before-last", e))(y || {}), vt = /* @__PURE__ */ ((e) => (e.SECOND = "second", e.MINUTE = "minute", e.HOUR = "hour", e.DAY = "day", e.MONTH = "month", e.YEAR = "year", e))(vt || {}), S = /* @__PURE__ */ ((e) => (e.DEFAULT = "SquareSmallIcon", e.SUCCESS = "CheckedCircleIcon", e.CRITICAL = "CrossCircleIcon", e))(S || {}), P = /* @__PURE__ */ ((e) => (e.BLACK = "black", e.BLUE = "blue", e.GREEN = "green", e.GREY = "grey", e.ORANGE = "orange", e.RED = "red", e.YELLOW = "yellow", e))(P || {});
-const q = Symbol("timeline register entry injection key"), K = Symbol("timeline config obj injection key"), ft = {
-  "en-US": {
-    addNote: "Add note",
-    cancel: "Cancel"
-  }
-}, bt = Y({
-  i18n: { messages: ft },
-  name: "bento-timeline",
-  components: { BentoButton: z, BentoButtonActions: X, BentoTextarea: Q },
-  props: {
-    /**
-     * If set to true, gives the possibility to manually add notes to the timeline via a textarea
-     */
-    addNote: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Object that determines the max number of items to show without clicking the show more button
-     * and where in the timeline is the show more button placed
-     */
-    showMore: {
-      type: Object,
-      default: null
-    },
-    /**
-     * Object that determines minimum amount of time for the automatic timegap indicator;
-     * Define a unit (hour, day, month) and an amount (e.g. { amount: 7, unit: 'days' }).
-     * If null, automatic timegap detection will be turned off
-     */
-    timegapLimit: {
-      type: Object,
-      default: null
-    }
-  },
-  emits: ["add-timeline-note"],
-  setup(e, { emit: t }) {
-    const { t: i } = H(), a = r(() => i("addNote")), f = r(() => i("cancel")), l = w(), b = (o) => {
-      l.value = o;
-    }, c = w(!1), d = () => {
-      c.value = !c.value;
-    }, n = () => {
-      t("add-timeline-note", {
-        description: l.value,
-        timestamp: { date: /* @__PURE__ */ new Date() },
-        type: "note"
-      }), d();
-    }, m = w([]), u = r(
-      () => e.showMore && m.value.length > e.showMore.limit ? m.value.length - e.showMore.limit : null
-    ), C = w(!1), { timegapLimit: _ } = Z(e), s = r(() => {
-      if (!e.showMore)
-        return null;
-      const o = Array.from(m.value.keys());
-      return e.showMore.placement === y.BEFORE_LAST ? [
-        ...o.slice(0, e.showMore.limit - 1),
-        o[o.length - 1]
-      ] : e.showMore.placement === y.AFTER_FIRST ? [o[0], ...o.slice(-(e.showMore.limit - 1))] : o.slice(0, e.showMore.limit);
-    }), p = r(() => {
-      if (!e.showMore)
-        return null;
-      switch (e.showMore.placement) {
-        case y.BEFORE_LAST:
-          return e.showMore.limit - 2;
-        case y.AFTER_FIRST:
-          return 0;
-        case y.BOTTOM:
-        default:
-          return e.showMore.limit - 1;
-      }
-    }), g = (o) => () => {
-      var v;
-      m.value = (v = m.value) == null ? void 0 : v.filter((N, h) => h !== o);
-    }, E = ({ title: o, description: v, date: N }) => {
-      const h = m.value.length;
-      return m.value.push({ title: o, description: v, date: N }), { timelineEntries: m, index: h, unregisterTimelineEntry: g(h) };
-    }, I = {
-      showAll: C,
-      showMoreIndex: p,
-      hiddenItems: u,
-      visibleIndexes: s,
-      timegapLimit: _
-    };
-    return A(q, E), A(K, I), {
-      addNoteLabel: a,
-      cancelLabel: f,
-      toggleAddNote: d,
-      updateNoteContent: b,
-      addNoteToTimeline: n,
-      showAddNoteTextArea: c
-    };
-  }
-});
-var pt = function() {
-  var t = this, i = t._self._c;
-  return t._self._setupProxy, i("div", { staticClass: "b-timeline" }, [t.addNote ? i("div", { staticClass: "b-timeline__add-note-section" }, [t.showAddNoteTextArea ? t._e() : i("bento-button", { attrs: { variant: "tertiary" }, on: { click: t.toggleAddNote } }, [t._v(t._s(t.addNoteLabel))]), t.showAddNoteTextArea ? i("div", [i("bento-textarea", { attrs: { label: t.addNoteLabel, "character-limit": 150, resizable: "vertical" }, on: { input: t.updateNoteContent } }), i("bento-button-actions", { attrs: { actions: [
-    { title: t.addNoteLabel, event: t.addNoteToTimeline },
-    { title: t.cancelLabel, event: t.toggleAddNote }
-  ] } })], 1) : t._e()], 1) : t._e(), i("ol", { staticClass: "b-timeline__items" }, [t._t("default")], 2)]);
-}, gt = [], ht = /* @__PURE__ */ R(
-  bt,
-  pt,
-  gt,
-  !1,
-  null,
-  "5d7abc30"
-);
-const qt = ht.exports;
-let U = 0;
-const yt = {
-  beforeCreate() {
-    this.uuid = U.toString(), U += 1;
-  }
-};
-var Ct = function() {
-  var t = this, i = t._self._c;
-  return i("svg", t._b({ staticClass: "ui-assets-icons-16", attrs: { role: "img", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "none" } }, "svg", t.$attrs, !1), [t.$attrs["svg-title"] ? i("title", [t._v(t._s(t.$attrs["svg-title"]))]) : t._e(), i("path", { attrs: { fill: "#00112C", 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" } })]);
-}, Et = [], It = /* @__PURE__ */ R(
-  yt,
-  Ct,
-  Et,
-  !1,
-  null,
-  null
-);
-const Nt = It.exports, wt = {
-  "en-US": {
-    timegap: "{timegap} passed between the timeline events",
-    showMore: "Show {items} more",
-    showLess: "Show less"
-  }
-}, Tt = Y({
-  name: "bento-timeline-item",
-  components: {
-    BentoButton: z,
-    BentoDate: tt,
-    BentoLink: et,
-    BentoTag: it,
-    BentoTypography: at,
-    BentoStructuredList: nt,
-    BentoStructuredListItem: ot,
-    SquareSmallIcon: Nt
-  },
-  i18n: { messages: wt },
-  props: {
-    /**
-     * Additional timestamp of the event
-     */
-    additionalTimestamp: {
-      type: Object,
-      default: null
-    },
-    /**
-     * Relevant key-value pair data to display in the event
-     */
-    dataList: {
-      type: Array,
-      default: null
-    },
-    /**
-     * Description of the event
-     */
-    description: {
-      type: String,
-      default: null
-    },
-    /**
-     * Modifier that changes the color of the timeline icon
-     * @values blue, black, green, grey, orange, red, yellow
-     */
-    status: {
-      type: String,
-      default: "black",
-      validator: (e) => Object.values(P).includes(e)
-    },
-    /**
-     * Tag props that will be passed down to inner tag component
-     */
-    tag: {
-      type: Object,
-      default: void 0
-    },
-    /**
-     * Main timestamp of the event. Used for timegap detection.
-     */
-    timestamp: {
-      type: Object,
-      required: !0
-    },
-    /**
-     * Title of the event
-     */
-    title: {
-      type: [Object, String],
-      default: null
-    },
-    /**
-     * Type of the timeline item. If set to 'note', it renders a note item in the timeline. Defaults to 'milestone'.
-     * @values milestone, note
-     */
-    type: {
-      type: String,
-      default: "milestone",
-      validator: (e) => ["milestone", "note"].includes(e)
-    },
-    /**
-     * Variant for the timeline item
-     * @values DEFAULT, SUCCESS, CRITICAL
-     *
-     * @deprecated Use "status" prop instead
-     */
-    variant: {
-      type: String,
-      default: null,
-      validator: (e) => Object.values(S).includes(e)
-    }
-  },
-  setup(e, { slots: t }) {
-    const { t: i } = H(), a = r(() => e.type === "note"), f = r(() => e.variant === S.CRITICAL ? "red" : e.variant === S.SUCCESS ? "green" : e.status);
-    e.variant && st(
-      'BentoTimelineItem "variant" property',
-      `Use the BentoTimelineItem "status" modifier instead to modify the color of the timeline icon.
-                    <bento-timeline-item status="red" />`,
-      "2.0.0"
-    );
-    const l = r(() => ({
-      [`b-timeline-item__icon--${f.value}`]: f.value && !a.value
-    })), b = r(() => ({
-      "b-timeline-item--note": a.value
-    }));
-    A(rt, !0);
-    const c = D(q), { timelineEntries: d, index: n, unregisterTimelineEntry: m } = c({
-      title: e.title,
-      date: e.timestamp.date
-    });
-    G(() => m());
-    const { showAll: u, showMoreIndex: C, hiddenItems: _, visibleIndexes: s, timegapLimit: p } = D(K), g = r(() => u.value || !s.value), E = r(() => g.value ? !0 : s.value.includes(n)), I = r(() => typeof e.title == "object"), o = r(() => e.title), v = r(() => {
-      var x;
-      if (!p.value)
-        return null;
-      const L = (x = d.value[n - 1]) == null ? void 0 : x.date, V = g.value || s.value.includes(n - 1);
-      if (!L || !V)
-        return null;
-      const { date: O } = d.value[n], W = parseInt(
-        j(L, O, { unit: p.value.unit }),
-        10
-      );
-      return p.value.amount < W ? j(L, O, { roundingMethod: "floor" }) : null;
-    }), N = r(() => v.value ? i("timegap", { timegap: v.value }) : ""), h = r(() => _.value && C.value === n), J = r(() => n === d.value.length - 1);
-    return {
-      // Values
-      isNoteType: a,
-      iconConditionalClasses: l,
-      conditionalClasses: b,
-      displayShowMoreButton: h,
-      showAll: u,
-      hiddenItems: _,
-      isVisible: E,
-      isLinkTitle: I,
-      linkTitleProps: o,
-      timegap: v,
-      timegapAriaLabel: N,
-      isLastItem: J,
-      // Methods
-      generateUid: lt,
-      hasSlot: mt(t),
-      t: i
-    };
-  }
-});
-var St = function() {
-  var t = this, i = t._self._c;
-  return t._self._setupProxy, t.isVisible ? i("li", { staticClass: "b-timeline-item", class: t.conditionalClasses }, [t.timegap ? i("div", { staticClass: "b-timeline-item__row" }, [t._m(0), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-typography", { staticClass: "b-timeline-item__timegap", attrs: { "aria-label": t.timegapAriaLabel } }, [t._v(" " + t._s(t.timegap) + " ")])], 1)]) : t._e(), i("div", { staticClass: "b-timeline-item__row" }, [i("div", { staticClass: "b-timeline-item__marker", attrs: { "aria-hidden": "true" } }, [i("square-small-icon", { staticClass: "b-timeline-item__icon", class: t.iconConditionalClasses }), t.isLastItem ? t._e() : i("div", { staticClass: "b-timeline-item__separator", attrs: { "data-testid": "last-timeline-item-separator" } })], 1), i("div", { staticClass: "b-timeline-item__content" }, [t.isNoteType ? t._e() : i("bento-typography", { staticClass: "b-timeline-item__title", attrs: { el: "div", variant: "body", strongest: "", role: "heading" } }, [t.isLinkTitle ? i("bento-link", t._b({ attrs: { "disable-typography": "" } }, "bento-link", t.linkTitleProps, !1), [t._v(t._s(t.linkTitleProps.title))]) : i("span", [t._v(t._s(t.title))])], 1), t.timestamp ? i("bento-typography", { staticClass: "b-timeline-item__timestamp", attrs: { el: "div", variant: "caption" } }, [i("bento-date", { attrs: { date: t.timestamp.date, format: t.timestamp.format, "disable-typography": "" } }), t._v(" " + t._s(t.timestamp.value) + " ")], 1) : t._e(), !t.isNoteType && t.additionalTimestamp ? i("bento-typography", { staticClass: "b-timeline-item__timestamp", attrs: { el: "div", variant: "caption" } }, [i("bento-date", { attrs: { date: t.additionalTimestamp.date, format: t.additionalTimestamp.format, "disable-typography": "" } }), t._v(" " + t._s(t.additionalTimestamp.value) + " ")], 1) : t._e(), t.description || t.hasSlot("default") ? i("bento-typography", { staticClass: "b-timeline-item__description", attrs: { el: "div", variant: "body" } }, [t._t("default", function() {
-    return [t._v(t._s(t.description))];
-  })], 2) : t._e(), !t.isNoteType && t.dataList ? i("div", { staticClass: "b-timeline-item__data-list" }, [i("bento-structured-list", t._l(t.dataList, function(a) {
-    return i("bento-structured-list-item", { key: t.generateUid(a.label), attrs: { label: a.label } }, [i("bento-typography", { attrs: { variant: "caption" } }, [t._v(t._s(a.value))])], 1);
-  }), 1)], 1) : t._e(), !t.isNoteType && t.tag ? i("bento-tag", t._b({ staticClass: "b-timeline-item__tag" }, "bento-tag", t.tag, !1)) : t._e()], 1)]), t.displayShowMoreButton ? i("div", { staticClass: "b-timeline-item__row" }, [t._m(1), i("div", { staticClass: "b-timeline-item__content" }, [i("bento-button", { staticClass: "b-timeline__show-more", attrs: { variant: "tertiary" }, on: { click: function(a) {
-    t.showAll = !t.showAll;
-  } } }, [t.showAll ? [t._v(t._s(t.t("showLess")))] : [t._v(t._s(t.t("showMore", { items: t.hiddenItems })))]], 2)], 1)]) : t._e()]) : t._e();
-}, Mt = [function() {
-  var e = this, t = e._self._c;
-  return e._self._setupProxy, t("div", { staticClass: "b-timeline-item__marker", attrs: { "aria-hidden": "true" } }, [t("div", { staticClass: "b-timeline-item__icon b-timeline-item__icon--timegap" }), t("div", { staticClass: "b-timeline-item__separator" })]);
-}, function() {
-  var e = this, t = e._self._c;
-  return e._self._setupProxy, t("div", { staticClass: "b-timeline-item__marker", attrs: { "aria-hidden": "true" } }, [t("div", { staticClass: "b-timeline-item__separator" })]);
-}], Lt = /* @__PURE__ */ R(
-  Tt,
-  St,
-  Mt,
-  !1,
-  null,
-  "4353df93"
-);
-const Kt = Lt.exports;
-export {
-  y as B,
-  Kt as a,
-  vt as b,
-  S as c,
-  P as d,
-  qt as t
-};
-//# sourceMappingURL=timeline-item.ScTrUBKC.js.map

package/dist/chunks/timeline-item.ScTrUBKC.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"timeline-item.ScTrUBKC.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';\nimport { RouterLinkProps } from 'vue-router/types/router';\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 \"variant\" prop was deprecated. Use \"status\" modifier instead.\n */\nexport enum BentoTimelineItemVariant {\n    DEFAULT = 'SquareSmallIcon',\n    SUCCESS = 'CheckedCircleIcon',\n    CRITICAL = 'CrossCircleIcon',\n}\n\nexport enum BentoTimelineStatus {\n    BLACK = 'black',\n    BLUE = 'blue',\n    GREEN = 'green',\n    GREY = 'grey',\n    ORANGE = 'orange',\n    RED = 'red',\n    YELLOW = 'yellow',\n}\n\nexport interface BentoTimelineItemTitle extends RouterLinkProps {\n    /**\n     * Link label.\n     */\n    title: string;\n    /**\n     * Set the rendered link to a regular external anchor link.\n     */\n    external?: boolean;\n\n    /**\n     * Sets the target of the rendered link.\n     */\n    target?: string;\n\n    // This has been added to allow users to add HTML and Aria attribute\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    [name: string]: any;\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 | BentoTimelineItemTitle;\n    description?: string;\n    date: Date | number;\n}\n\nexport type BentoTimelineRegisterEntry = (props: {\n    title?: string | BentoTimelineItemTitle;\n    description?: 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    <div class=\"b-timeline\">\n        <div v-if=\"addNote\" class=\"b-timeline__add-note-section\">\n            <bento-button v-if=\"!showAddNoteTextArea\" variant=\"tertiary\" @click=\"toggleAddNote\">{{\n                addNoteLabel\n            }}</bento-button>\n            <div v-if=\"showAddNoteTextArea\">\n                <bento-textarea\n                    :label=\"addNoteLabel\"\n                    :character-limit=\"150\"\n                    resizable=\"vertical\"\n                    @input=\"updateNoteContent\"\n                />\n                <bento-button-actions\n                    :actions=\"[\n                        { title: addNoteLabel, event: addNoteToTimeline },\n                        { title: cancelLabel, event: toggleAddNote },\n                    ]\"\n                />\n            </div>\n        </div>\n        <ol class=\"b-timeline__items\">\n            <slot />\n        </ol>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, provide, Ref, ref, toRefs } from 'vue';\n    import { BentoButton, BentoButtonActions } from '@/components/button';\n    import { BentoTextarea } from '@/components/textarea';\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    import messages from './messages.json';\n    import { useI18n } from '@/utils/ts/i18n';\n\n    type MessageSchema = (typeof messages)['en-US'];\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        i18n: { messages },\n        name: 'bento-timeline',\n        components: { BentoButton, BentoButtonActions, BentoTextarea },\n        props: {\n            /**\n             * If set to true, gives the possibility to manually add notes to the timeline via a textarea\n             */\n            addNote: {\n                type: Boolean,\n                default: false,\n            },\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        emits: ['add-timeline-note'],\n\n        setup(props, { emit }) {\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n            const addNoteLabel = computed(() => t('addNote') as string);\n            const cancelLabel = computed(() => t('cancel') as string);\n\n            const newNoteContent: Ref<string> = ref();\n            const updateNoteContent = (newTimelineNoteContent: string): void => {\n                newNoteContent.value = newTimelineNoteContent;\n            };\n            const showAddNoteTextArea = ref(false);\n            const toggleAddNote = () => {\n                showAddNoteTextArea.value = !showAddNoteTextArea.value;\n            };\n            const addNoteToTimeline = () => {\n                emit('add-timeline-note', {\n                    description: newNoteContent.value,\n                    timestamp: { date: new Date() },\n                    type: 'note',\n                });\n                toggleAddNote();\n            };\n\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) {\n                    return null;\n                }\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, description, 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, description, 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            return {\n                addNoteLabel,\n                cancelLabel,\n                toggleAddNote,\n                updateNoteContent,\n                addNoteToTimeline,\n                showAddNoteTextArea,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./timeline.scss\" />\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" 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\" 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\"/></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>\n    @import '../css/main.css';\n</style>\n","<template>\n    <li v-if=\"isVisible\" class=\"b-timeline-item\" :class=\"conditionalClasses\">\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                <square-small-icon 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                    v-if=\"!isNoteType\"\n                    el=\"div\"\n                    variant=\"body\"\n                    strongest\n                    class=\"b-timeline-item__title\"\n                    role=\"heading\"\n                >\n                    <bento-link v-if=\"isLinkTitle\" v-bind=\"linkTitleProps\" disable-typography>{{\n                        linkTitleProps.title\n                    }}</bento-link>\n                    <span v-else>{{ title }}</span>\n                </bento-typography>\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=\"!isNoteType && 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\n                    v-if=\"description || hasSlot('default')\"\n                    el=\"div\"\n                    variant=\"body\"\n                    class=\"b-timeline-item__description\"\n                >\n                    <slot>{{ description }}</slot>\n                </bento-typography>\n\n                <div v-if=\"!isNoteType && 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=\"!isNoteType && 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    // Components\n    import { BentoButton } from '@/components/button';\n    import { BentoDate } from '@/components/date';\n    import { BentoLink } from '@/components/link';\n    import { BentoTag } from '@/components/tag';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoStructuredList, BentoStructuredListItem } from '@/components/structured-list';\n    import SquareSmallIcon from '@adyen/ui-assets-icons-16/vue/square-small-fill';\n    // Utils\n    import { deprecate } from '@/utils/ts/deprecate';\n    import { generateUid } from '@/utils/ts/unique-id';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { useHasSlot } from '@/composables';\n    import formatDistanceStrict from 'date-fns/formatDistanceStrict';\n    // Types\n    import {\n        BentoTimelineConfigData,\n        BentoTimelineDataList,\n        BentoTimelineItemTitle,\n        BentoTimelineItemVariant,\n        BentoTimelineRegisterEntry,\n        BentoTimelineStatus,\n        BentoTimelineTagProps,\n        BentoTimelineTimestamp,\n    } from '../../timeline.types';\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    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\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            BentoLink,\n            BentoTag,\n            BentoTypography,\n            BentoStructuredList,\n            BentoStructuredListItem,\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             * 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             * Description of the event\n             */\n            description: {\n                type: String,\n                default: null,\n            },\n            /**\n             * Modifier that changes the color of the timeline icon\n             * @values blue, black, green, grey, orange, red, yellow\n             */\n            status: {\n                type: String as PropType<`${BentoTimelineStatus}`>,\n                default: 'black',\n                validator: (value: BentoTimelineStatus) => Object.values(BentoTimelineStatus).includes(value),\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             * Main timestamp of the event. Used for timegap detection.\n             */\n            timestamp: {\n                type: Object as PropType<BentoTimelineTimestamp>,\n                required: true,\n            },\n            /**\n             * Title of the event\n             */\n            title: {\n                type: [Object, String] as PropType<BentoTimelineItemTitle | string>,\n                default: null,\n            },\n            /**\n             * Type of the timeline item. If set to 'note', it renders a note item in the timeline. Defaults to 'milestone'.\n             * @values milestone, note\n             */\n            type: {\n                type: String,\n                default: 'milestone',\n                validator: (value: string) => ['milestone', 'note'].includes(value),\n            },\n            /**\n             * Variant for the timeline item\n             * @values DEFAULT, SUCCESS, CRITICAL\n             *\n             * @deprecated Use \"status\" prop instead\n             */\n            variant: {\n                type: String as PropType<BentoTimelineItemVariant | `${BentoTimelineItemVariant}`>,\n                default: null,\n                validator: (value: BentoTimelineItemVariant) => Object.values(BentoTimelineItemVariant).includes(value),\n            },\n        },\n        setup(props, { slots }) {\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n            const isNoteType = computed(() => props.type === 'note');\n\n            // Handle variant deprecation, by setting `critical` and `success` variants to their respective colors\n            const computedStatus = computed(() => {\n                if (props.variant === BentoTimelineItemVariant.CRITICAL) {\n                    return 'red';\n                }\n\n                if (props.variant === BentoTimelineItemVariant.SUCCESS) {\n                    return 'green';\n                }\n\n                return props.status;\n            });\n\n            if (props.variant) {\n                deprecate(\n                    'BentoTimelineItem \"variant\" property',\n                    `Use the BentoTimelineItem \"status\" modifier instead to modify the color of the timeline icon.\n                    <bento-timeline-item status=\"red\" />`,\n                    '2.0.0'\n                );\n            }\n\n            const iconConditionalClasses = computed(() => ({\n                [`b-timeline-item__icon--${computedStatus.value}`]: computedStatus.value && !isNoteType.value,\n            }));\n            const conditionalClasses = computed(() => ({\n                'b-timeline-item--note': isNoteType.value,\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            const allItemsShowing = computed(() => showAll.value || !visibleIndexes.value);\n            const isVisible = computed(() => (allItemsShowing.value ? true : visibleIndexes.value.includes(index)));\n            const isLinkTitle = computed(() => typeof props.title === 'object');\n            const linkTitleProps = computed(() => props.title as BentoTimelineItemTitle);\n            const timegap = computed(() => {\n                if (!timegapLimit.value) {\n                    return null;\n                }\n                const previousDate = timelineEntries.value[index - 1]?.date;\n                const isPreviousItemVisible = allItemsShowing.value || visibleIndexes.value.includes(index - 1);\n                if (!previousDate || !isPreviousItemVisible) {\n                    return null;\n                }\n                const { date } = timelineEntries.value[index];\n                const timegapInSelectedUnit = parseInt(\n                    formatDistanceStrict(previousDate, date, { unit: timegapLimit.value.unit }),\n                    10\n                );\n                return timegapLimit.value.amount < timegapInSelectedUnit\n                    ? formatDistanceStrict(previousDate, date, { roundingMethod: 'floor' })\n                    : null;\n            });\n            const timegapAriaLabel = computed(() => (timegap.value ? t('timegap', { timegap: timegap.value }) : ''));\n            const displayShowMoreButton = computed(() => hiddenItems.value && showMoreIndex.value === index);\n            const isLastItem = computed(() => index === timelineEntries.value.length - 1);\n\n            return {\n                // Values\n                isNoteType,\n                iconConditionalClasses,\n                conditionalClasses,\n                displayShowMoreButton,\n                showAll,\n                hiddenItems,\n                isVisible,\n                isLinkTitle,\n                linkTitleProps,\n                timegap,\n                timegapAriaLabel,\n                isLastItem,\n                // Methods\n                generateUid,\n                hasSlot: useHasSlot(slots),\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$1","locale","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","BentoTimelineStatus","BentoTimelineStatus2","TIMELINE_REGISTER_ENTRY_INJECTION_KEY","TIMELINE_CONFIG_INJECTION_KEY","_sfc_main$2","defineComponent","messages$1","BentoButton","BentoButtonActions","BentoTextarea","props","emit","t","useI18n","addNoteLabel","computed","cancelLabel","newNoteContent","ref","updateNoteContent","newTimelineNoteContent","showAddNoteTextArea","toggleAddNote","addNoteToTimeline","timelineEntries","hiddenItems","showAll","timegapLimit","toRefs","visibleIndexes","timelineIndexes","showMoreIndex","unregisterTimelineEntry","tabIndexToRemove","_a","_item","index","registerTimelineEntry","title","description","date","configData","provide","uuid","_sfc_main$1","_sfc_main","BentoDate","BentoLink","BentoTag","BentoTypography","BentoStructuredList","BentoStructuredListItem","SquareSmallIcon","messages","value","slots","isNoteType","computedStatus","deprecate","iconConditionalClasses","conditionalClasses","STRUCTURED_LIST_CONDENSED_INJECTION_KEY","inject","onUnmounted","allItemsShowing","isVisible","isLinkTitle","linkTitleProps","timegap","previousDate","isPreviousItemVisible","timegapInSelectedUnit","timegapAriaLabel","displayShowMoreButton","isLastItem","generateUid","useHasSlot"],"mappings":"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","x_google_ignoreList":[0,4]}

package/dist/chunks/toast.0EYDj8o-.js

@@ -1,165 +0,0 @@
-import { defineComponent as $, ref as c, computed as d, watch as k, onMounted as Y, nextTick as q } from "vue";
-import "./index.Cl4_42j5.js";
-import { C as L } from "./cross-small.BLUwtRB-.js";
-import { u as P } from "./i18n.BQkEbtPM.js";
-import { B as N } from "./button.DhAUh5JA.js";
-import { B as U } from "./typography.Bjtu3Gca.js";
-import { n as B } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import { u as O } from "./use-bento-toast-controller.BifdE4ak.js";
-import "../assets/toast.css";
-const M = {
-  "en-US": {
-    dismiss: "Dismiss"
-  }
-}, W = {
-  i18n: { messages: M }
-}, z = /* @__PURE__ */ $({
-  ...W,
-  __name: "toast-item",
-  props: {
-    toast: { type: Object, required: !0 }
-  },
-  setup(m) {
-    const t = m, { t: s } = P();
-    return { __sfc: !0, props: t, t: s, onAction: () => {
-      typeof t.toast.action.handler == "function" && t.toast.action.handler(), t.toast.dismiss();
-    }, CrossIcon: L, BentoButton: N, BentoTypography: U };
-  }
-});
-var V = function() {
-  var t = this, s = t._self._c, e = t._self._setupProxy;
-  return s("div", { staticClass: "b-toast-item" }, [s("output", { staticClass: "b-toast-item__text", attrs: { role: "status" } }, [s(e.BentoTypography, { attrs: { title: t.toast.text, el: "span", variant: "body", strongest: "" } }, [t._v(" " + t._s(t.toast.text) + " ")])], 1), t.toast.action ? s(e.BentoButton, { staticClass: "b-toast-item__btn", attrs: { variant: "tertiary", "data-testid": "toast-item-action-btn" }, on: { click: e.onAction } }, [t._v(" " + t._s(t.toast.action.text) + " ")]) : t._e(), s(e.BentoButton, { staticClass: "b-toast-item__btn", attrs: { variant: "tertiary", "data-testid": "toast-item-close-btn" }, on: { click: function(o) {
-    return t.toast.dismiss();
-  } }, scopedSlots: t._u([{ key: "iconLeft", fn: function() {
-    return [s(e.CrossIcon, { attrs: { "svg-title": e.t("dismiss") } })];
-  }, proxy: !0 }]) })], 1);
-}, j = [], E = /* @__PURE__ */ B(
-  z,
-  V,
-  j,
-  !1,
-  null,
-  "e4019e01"
-);
-const H = E.exports, F = /* @__PURE__ */ $({
-  __name: "toast-shadow-stack",
-  emits: ["update"],
-  setup(m, { emit: t }) {
-    const { stack: s } = O(), e = c(), o = c(), u = c(), _ = c(), f = [o, u, _], v = d(() => s.value.slice(0, 3)), r = async () => {
-      await q();
-      const { top: h } = e.value.getBoundingClientRect(), T = s.value.map((b, y) => {
-        if (y > 2)
-          return { ...b, bottom: 0, height: 0 };
-        const { height: p, top: g } = f[y].value.$el.getBoundingClientRect();
-        return { ...b, height: p, bottom: g - h };
-      });
-      t("update", T);
-    };
-    return k(s, r), Y(() => {
-      s.value.length > 0 && r();
-    }), { __sfc: !0, stack: s, emit: t, shadowStack: e, toast0: o, toast1: u, toast2: _, toastRefs: f, toasts: v, shareToastsWithDimensions: r, ToastItem: H };
-  }
-});
-var X = function() {
-  var t = this, s = t._self._c, e = t._self._setupProxy;
-  return s("div", { ref: "shadowStack", staticClass: "b-toast-shadow-stack" }, [e.toasts[0] ? s(e.ToastItem, { ref: "toast0", attrs: { toast: e.toasts[0] } }) : t._e(), e.toasts[1] ? s(e.ToastItem, { ref: "toast1", attrs: { toast: e.toasts[1] } }) : t._e(), e.toasts[2] ? s(e.ToastItem, { ref: "toast2", attrs: { toast: e.toasts[2] } }) : t._e()], 1);
-}, G = [], J = /* @__PURE__ */ B(
-  F,
-  X,
-  G,
-  !1,
-  null,
-  "9e646b8f"
-);
-const K = J.exports, Q = /* @__PURE__ */ $({
-  __name: "toast",
-  setup(m) {
-    const s = c(!1), { stack: e } = O();
-    k(
-      e,
-      (a) => {
-        a.length > 0 && !s.value && (s.value = !0);
-      },
-      { immediate: !0 }
-    );
-    const o = c(!1), u = c([]), _ = 40, f = 10, v = d(() => u.value.length), r = d(() => Math.min(o.value ? 2 : 0, v.value - 1)), h = d(() => {
-      const a = u.value[r.value];
-      return a ? a.bottom + a.height : 0;
-    }), T = d(() => {
-      const a = h.value - _;
-      return u.value.map((n, l) => {
-        const S = l > r.value, R = !o.value && l > 1, D = S ? a + f * (R ? 2 : 1) : n.bottom;
-        return {
-          ...n,
-          styles: {
-            height: `${S ? _ : n.height}px`,
-            transform: S ? `translateY(${D * -1}px) scaleX(${R ? "0.8" : "0.9"})` : `translateY(${D * -1}px)`,
-            "z-index": v.value - l
-          },
-          // first toast has different animation, and toasts above index 2/3 are not visible so no need for a custom animation
-          dismissTransform: l > 0 && l < (o.value ? 4 : 3) ? `translateY(${(D - n.height) * -1}px) scale(0.5, 0.1)` : null,
-          isFirst: l === 0,
-          isInert: l > (o.value ? 2 : 0)
-        };
-      });
-    }), b = (a) => {
-      a.dataset.dismissTransform && (a.style.transform = a.dataset.dismissTransform);
-    }, y = d(() => {
-      let a = 0;
-      if (r.value >= 0) {
-        const n = f * Math.min(v.value - 1 - r.value, o.value ? 1 : 2);
-        a = Math.min(h.value + n, document.body.parentElement.clientHeight);
-      }
-      return `${a}px`;
-    });
-    let p = null, g = null, i = 5e3;
-    const I = (a, n) => {
-      g = Date.now(), p = setTimeout(() => a.dismiss(), n);
-    }, A = (a) => {
-      clearTimeout(p), a ? (i = 5e3, o.value || I(a, i)) : i = 0;
-    };
-    k(
-      () => T.value[0],
-      (a, n) => {
-        (a == null ? void 0 : a.id) !== (n == null ? void 0 : n.id) && A(a);
-      },
-      { immediate: !0 }
-    );
-    const C = () => {
-      i = i - Date.now() + g, clearTimeout(p);
-    }, x = () => {
-      i > 0 && I(T.value[0], i);
-    };
-    k(o, (a) => {
-      a ? C() : x();
-    });
-    const w = c();
-    return { __sfc: !0, TOAST_DISPLAY_DURATION: 5e3, renderToast: s, stack: e, hovered: o, toastsWithDimensions: u, collapsedToastHeight: _, stackIndicatorHeight: f, queueSize: v, lastVisibleToastIndex: r, lastVisibleToastBottom: h, queue: T, onBeforeToastLeave: b, stackHeight: y, dismissTimout: p, timeoutStart: g, remainingTimeToDismiss: i, startTimer: I, startNewDismissTimer: A, pauseDismissTimer: C, resumeDismissTimer: x, root: w, checkHover: () => setTimeout(() => {
-      o.value = o.value ? w.value.matches(":hover") : !1;
-    }), ToastShadowStack: K, ToastItem: H };
-  }
-});
-var Z = function() {
-  var t = this, s = t._self._c, e = t._self._setupProxy;
-  return e.renderToast ? s("div", { ref: "root", staticClass: "b-toast", style: { height: e.stackHeight }, attrs: { "data-testid": "toast" }, on: { mouseenter: function(o) {
-    e.hovered = !0;
-  }, mouseleave: function(o) {
-    e.hovered = !1;
-  } } }, [s(e.ToastShadowStack, { on: { update: function(o) {
-    e.toastsWithDimensions = o;
-  } } }), s("transition-group", { attrs: { name: "b-toast__queue", tag: "div", "aria-live": "polite", "enter-class": "b-toast__queue--enter", "leave-to-class": "b-toast__queue--leave-to" }, on: { "before-leave": e.onBeforeToastLeave, "after-leave": e.checkHover } }, t._l(e.queue, function(o) {
-    return s(e.ToastItem, t._b({ key: o.id, staticClass: "b-toast__item", class: { "b-toast__item--first": o.isFirst }, style: o.styles, attrs: { toast: o, inert: o.isInert, "data-testid": "toast-item" } }, "toast-item", { "data-dismiss-transform": o.dismissTransform }, !1));
-  }), 1)], 1) : t._e();
-}, tt = [], et = /* @__PURE__ */ B(
-  Q,
-  Z,
-  tt,
-  !1,
-  null,
-  "9a3ea236"
-);
-const mt = et.exports;
-export {
-  mt as t
-};
-//# sourceMappingURL=toast.0EYDj8o-.js.map