@evercam/ui 0.0.50-beta.1 → 0.0.51

package/dist/index.mjs

@@ -1,8 +1,8 @@
-import X from "vue";
+import q from "vue";
 import * as u from "d3";
 import V from "moment-timezone";
-var T = /* @__PURE__ */ ((e) => (e.dot = "dot", e.xs = "xs", e.sm = "sm", e.md = "base", e.base = "base", e.lg = "lg", e.xl = "xl", e["2xl"] = "2xl", e["3xl"] = "3xl", e["4xl"] = "4xl", e["5xl"] = "5xl", e["6xl"] = "6xl", e["7xl"] = "7xl", e["8xl"] = "8xl", e["9xl"] = "9xl", e))(T || {}), j = /* @__PURE__ */ ((e) => (e.warning = "warning", e.error = "error", e.info = "info", e.success = "success", e.primary = "primary", e.brand = "brand", e.default = "default", e))(j || {}), ee = /* @__PURE__ */ ((e) => (e.overview = "overview", e.detailed = "detailed", e.detailedBackground = "detailedBackground", e))(ee || {}), te = /* @__PURE__ */ ((e) => (e.bars = "bars", e.lineGraph = "lineGraph", e))(te || {}), fe = /* @__PURE__ */ ((e) => (e.zoom = "zoom", e.initial = "initial", e))(fe || {});
-const rt = X.extend({
+var T = /* @__PURE__ */ ((e) => (e.dot = "dot", e.xs = "xs", e.sm = "sm", e.md = "base", e.base = "base", e.lg = "lg", e.xl = "xl", e["2xl"] = "2xl", e["3xl"] = "3xl", e["4xl"] = "4xl", e["5xl"] = "5xl", e["6xl"] = "6xl", e["7xl"] = "7xl", e["8xl"] = "8xl", e["9xl"] = "9xl", e))(T || {}), B = /* @__PURE__ */ ((e) => (e.warning = "warning", e.error = "error", e.info = "info", e.success = "success", e.primary = "primary", e.brand = "brand", e.default = "default", e))(B || {}), te = /* @__PURE__ */ ((e) => (e.overview = "overview", e.detailed = "detailed", e.detailedBackground = "detailedBackground", e))(te || {}), Z = /* @__PURE__ */ ((e) => (e.bars = "bars", e.lineGraph = "lineGraph", e.barChart = "barGraph", e))(Z || {}), fe = /* @__PURE__ */ ((e) => (e.zoom = "zoom", e.initial = "initial", e))(fe || {});
+const rt = q.extend({
   name: "EBadge",
   props: {
     text: {
@@ -11,7 +11,7 @@ const rt = X.extend({
     },
     color: {
       type: String,
-      default: j.default
+      default: B.default
     },
     size: {
       type: String,
@@ -21,12 +21,12 @@ const rt = X.extend({
   data() {
     return {
       colors: {
-        [j.error]: "e-bg-rose-500 e-text-white",
-        [j.info]: "e-bg-cyan-500 e-text-white",
-        [j.warning]: "e-bg-amber-500 e-text-white",
-        [j.primary]: "e-bg-sky-500 e-text-white",
-        [j.default]: "e-bg-slate-300 e-text-white",
-        [j.success]: "e-bg-lime-500 e-text-white"
+        [B.error]: "e-bg-rose-500 e-text-white",
+        [B.info]: "e-bg-cyan-500 e-text-white",
+        [B.warning]: "e-bg-amber-500 e-text-white",
+        [B.primary]: "e-bg-sky-500 e-text-white",
+        [B.default]: "e-bg-slate-300 e-text-white",
+        [B.success]: "e-bg-lime-500 e-text-white"
       },
       sizes: {
         [T.dot]: "e-w-2 e-h-2",
@@ -40,7 +40,7 @@ const rt = X.extend({
   },
   computed: {
     badgeClasses() {
-      const e = this.colors[this.color] || this.colors[j.default], t = this.sizes[this.size] || this.sizes[T.md];
+      const e = this.colors[this.color] || this.colors[B.default], t = this.sizes[this.size] || this.sizes[T.md];
       return [
         "e-flex e-items-center e-justify-center e-rounded-full",
         e,
@@ -52,15 +52,15 @@ const rt = X.extend({
     }
   }
 });
-function I(e, t, r, i, a, o, n, h) {
+function I(e, t, r, n, a, o, i, d) {
   var l = typeof e == "function" ? e.options : e;
-  t && (l.render = t, l.staticRenderFns = r, l._compiled = !0), i && (l.functional = !0), o && (l._scopeId = "data-v-" + o);
+  t && (l.render = t, l.staticRenderFns = r, l._compiled = !0), n && (l.functional = !0), o && (l._scopeId = "data-v-" + o);
   var s;
-  if (n ? (s = function(m) {
+  if (i ? (s = function(m) {
     m = m || // cached call
     this.$vnode && this.$vnode.ssrContext || // stateful
-    this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext, !m && typeof __VUE_SSR_CONTEXT__ != "undefined" && (m = __VUE_SSR_CONTEXT__), a && a.call(this, m), m && m._registeredComponents && m._registeredComponents.add(n);
-  }, l._ssrRegister = s) : a && (s = h ? function() {
+    this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext, !m && typeof __VUE_SSR_CONTEXT__ != "undefined" && (m = __VUE_SSR_CONTEXT__), a && a.call(this, m), m && m._registeredComponents && m._registeredComponents.add(i);
+  }, l._ssrRegister = s) : a && (s = d ? function() {
     a.call(
       this,
       (l.functional ? this.parent : this).$root.$options.shadowRoot
@@ -73,28 +73,28 @@ function I(e, t, r, i, a, o, n, h) {
         return s.call(y), c(E, y);
       };
     } else {
-      var v = l.beforeCreate;
-      l.beforeCreate = v ? [].concat(v, s) : [s];
+      var g = l.beforeCreate;
+      l.beforeCreate = g ? [].concat(g, s) : [s];
     }
   return {
     exports: e,
     options: l
   };
 }
-var it = function() {
+var nt = function() {
   var t = this, r = t._self._c;
   return r("span", { staticClass: "e-badge", class: t.badgeClasses }, [t.showText ? r("span", [t._v(t._s(t.text))]) : t._e()]);
-}, nt = [], st = /* @__PURE__ */ I(
+}, it = [], st = /* @__PURE__ */ I(
   rt,
-  it,
   nt,
+  it,
   !1,
   null,
   null,
   null,
   null
 );
-const Me = st.exports, at = X.extend({
+const Me = st.exports, at = q.extend({
   name: "EAvatar",
   components: {
     Badge: Me
@@ -110,7 +110,7 @@ const Me = st.exports, at = X.extend({
     },
     badgeColor: {
       type: String,
-      default: j.error
+      default: B.error
     },
     badgeText: {
       type: String,
@@ -167,7 +167,7 @@ const ct = ut.exports;
 function dt(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var ze = {}, Pe = {}, me = {};
+var Pe = {}, ze = {}, me = {};
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -182,14 +182,14 @@ var ze = {}, Pe = {}, me = {};
       return "0";
     if (/^[+-]?(\d+|\d*\.\d+)(e[+-]?\d+)?(%|\w+)?$/.test(r))
       return r.replace(/^[+-]?/, (a) => a === "-" ? "" : "-");
-    let i = [
+    let n = [
       "var",
       "calc",
       "min",
       "max",
       "clamp"
     ];
-    for (const a of i)
+    for (const a of n)
       if (r.includes(`${a}(`))
         return `calc(${r} * -1)`;
   }
@@ -382,7 +382,7 @@ var Le = {};
     "content"
   ];
 })(Le);
-var Ge = {};
+var He = {};
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -392,18 +392,18 @@ var Ge = {};
       return t;
     }
   });
-  function t(r, i) {
-    return r === void 0 ? i : Array.isArray(r) ? r : [
-      ...new Set(i.filter((o) => r !== !1 && r[o] !== !1).concat(Object.keys(r).filter((o) => r[o] !== !1)))
+  function t(r, n) {
+    return r === void 0 ? n : Array.isArray(r) ? r : [
+      ...new Set(n.filter((o) => r !== !1 && r[o] !== !1).concat(Object.keys(r).filter((o) => r[o] !== !1)))
     ];
   }
-})(Ge);
-var pe = {}, ie = {}, ge = { exports: {} }, z = String, He = function() {
-  return { isColorSupported: !1, reset: z, bold: z, dim: z, italic: z, underline: z, inverse: z, hidden: z, strikethrough: z, black: z, red: z, green: z, yellow: z, blue: z, magenta: z, cyan: z, white: z, gray: z, bgBlack: z, bgRed: z, bgGreen: z, bgYellow: z, bgBlue: z, bgMagenta: z, bgCyan: z, bgWhite: z };
+})(He);
+var pe = {}, ne = {}, ge = { exports: {} }, P = String, Ge = function() {
+  return { isColorSupported: !1, reset: P, bold: P, dim: P, italic: P, underline: P, inverse: P, hidden: P, strikethrough: P, black: P, red: P, green: P, yellow: P, blue: P, magenta: P, cyan: P, white: P, gray: P, bgBlack: P, bgRed: P, bgGreen: P, bgYellow: P, bgBlue: P, bgMagenta: P, bgCyan: P, bgWhite: P };
 };
-ge.exports = He();
-ge.exports.createColors = He;
-var je = ge.exports;
+ge.exports = Ge();
+ge.exports.createColors = Ge;
+var Be = ge.exports;
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -417,26 +417,26 @@ var je = ge.exports;
   }
   t(e, {
     dim: function() {
-      return n;
+      return i;
     },
     default: function() {
-      return h;
+      return d;
     }
   });
-  const r = /* @__PURE__ */ i(je);
-  function i(l) {
+  const r = /* @__PURE__ */ n(Be);
+  function n(l) {
     return l && l.__esModule ? l : {
       default: l
     };
   }
   let a = /* @__PURE__ */ new Set();
   function o(l, s, c) {
-    typeof process != "undefined" && process.env.JEST_WORKER_ID || c && a.has(c) || (c && a.add(c), console.warn(""), s.forEach((v) => console.warn(l, "-", v)));
+    typeof process != "undefined" && process.env.JEST_WORKER_ID || c && a.has(c) || (c && a.add(c), console.warn(""), s.forEach((g) => console.warn(l, "-", g)));
   }
-  function n(l) {
+  function i(l) {
     return r.default.dim(l);
   }
-  const h = {
+  const d = {
     info(l, s) {
       o(r.default.bold(r.default.cyan("info")), ...Array.isArray(l) ? [
         l
@@ -462,7 +462,7 @@ var je = ge.exports;
       ]);
     }
   };
-})(ie);
+})(ne);
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -472,15 +472,15 @@ var je = ge.exports;
       return a;
     }
   });
-  const t = /* @__PURE__ */ r(ie);
+  const t = /* @__PURE__ */ r(ne);
   function r(o) {
     return o && o.__esModule ? o : {
       default: o
     };
   }
-  function i({ version: o, from: n, to: h }) {
-    t.default.warn(`${n}-color-renamed`, [
-      `As of Tailwind CSS ${o}, \`${n}\` has been renamed to \`${h}\`.`,
+  function n({ version: o, from: i, to: d }) {
+    t.default.warn(`${i}-color-renamed`, [
+      `As of Tailwind CSS ${o}, \`${i}\` has been renamed to \`${d}\`.`,
       "Update your configuration file to silence this warning."
     ]);
   }
@@ -777,35 +777,35 @@ var je = ge.exports;
       950: "#4c0519"
     },
     get lightBlue() {
-      return i({
+      return n({
         version: "v2.2",
         from: "lightBlue",
         to: "sky"
       }), this.sky;
     },
     get warmGray() {
-      return i({
+      return n({
         version: "v3.0",
         from: "warmGray",
         to: "stone"
       }), this.stone;
     },
     get trueGray() {
-      return i({
+      return n({
         version: "v3.0",
         from: "trueGray",
         to: "neutral"
       }), this.neutral;
     },
     get coolGray() {
-      return i({
+      return n({
         version: "v3.0",
         from: "coolGray",
         to: "gray"
       }), this.gray;
     },
     get blueGray() {
-      return i({
+      return n({
         version: "v3.0",
         from: "blueGray",
         to: "slate"
@@ -813,7 +813,7 @@ var je = ge.exports;
     }
   };
 })(pe);
-var Re = {};
+var je = {};
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -823,21 +823,21 @@ var Re = {};
       return t;
     }
   });
-  function t(r, ...i) {
-    for (let n of i) {
-      for (let h in n) {
+  function t(r, ...n) {
+    for (let i of n) {
+      for (let d in i) {
         var a;
-        !(r == null || (a = r.hasOwnProperty) === null || a === void 0) && a.call(r, h) || (r[h] = n[h]);
+        !(r == null || (a = r.hasOwnProperty) === null || a === void 0) && a.call(r, d) || (r[d] = i[d]);
       }
-      for (let h of Object.getOwnPropertySymbols(n)) {
+      for (let d of Object.getOwnPropertySymbols(i)) {
         var o;
-        !(r == null || (o = r.hasOwnProperty) === null || o === void 0) && o.call(r, h) || (r[h] = n[h]);
+        !(r == null || (o = r.hasOwnProperty) === null || o === void 0) && o.call(r, d) || (r[d] = i[d]);
       }
     }
     return r;
   }
-})(Re);
-var Be = {};
+})(je);
+var Re = {};
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -850,27 +850,27 @@ var Be = {};
   function t(r) {
     if (Array.isArray(r))
       return r;
-    let i = r.split("[").length - 1, a = r.split("]").length - 1;
-    if (i !== a)
+    let n = r.split("[").length - 1, a = r.split("]").length - 1;
+    if (n !== a)
       throw new Error(`Path is invalid. Has unbalanced brackets: ${r}`);
     return r.split(/\.(?![^\[]*\])|[\[\]]/g).filter(Boolean);
   }
-})(Be);
-var We = {}, ne = {};
+})(Re);
+var We = {}, ie = {};
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
   });
-  function t(v, m) {
+  function t(g, m) {
     for (var E in m)
-      Object.defineProperty(v, E, {
+      Object.defineProperty(g, E, {
         enumerable: !0,
         get: m[E]
       });
   }
   t(e, {
     flagEnabled: function() {
-      return h;
+      return d;
     },
     issueFlagNotices: function() {
       return s;
@@ -879,10 +879,10 @@ var We = {}, ne = {};
       return c;
     }
   });
-  const r = /* @__PURE__ */ a(je), i = /* @__PURE__ */ a(ie);
-  function a(v) {
-    return v && v.__esModule ? v : {
-      default: v
+  const r = /* @__PURE__ */ a(Be), n = /* @__PURE__ */ a(ne);
+  function a(g) {
+    return g && g.__esModule ? g : {
+      default: g
     };
   }
   let o = {
@@ -894,7 +894,7 @@ var We = {}, ne = {};
     get relativeContentPathsByDefault() {
       return !1;
     }
-  }, n = {
+  }, i = {
     future: [
       "hoverOnlyWhenSupported",
       "respectDefaultRingColorOpacity",
@@ -906,34 +906,34 @@ var We = {}, ne = {};
       "generalizedModifiers"
     ]
   };
-  function h(v, m) {
-    if (n.future.includes(m)) {
+  function d(g, m) {
+    if (i.future.includes(m)) {
       var E, y, k;
-      return v.future === "all" || ((k = (y = v == null || (E = v.future) === null || E === void 0 ? void 0 : E[m]) !== null && y !== void 0 ? y : o[m]) !== null && k !== void 0 ? k : !1);
+      return g.future === "all" || ((k = (y = g == null || (E = g.future) === null || E === void 0 ? void 0 : E[m]) !== null && y !== void 0 ? y : o[m]) !== null && k !== void 0 ? k : !1);
     }
-    if (n.experimental.includes(m)) {
-      var F, P, L;
-      return v.experimental === "all" || ((L = (P = v == null || (F = v.experimental) === null || F === void 0 ? void 0 : F[m]) !== null && P !== void 0 ? P : o[m]) !== null && L !== void 0 ? L : !1);
+    if (i.experimental.includes(m)) {
+      var A, z, L;
+      return g.experimental === "all" || ((L = (z = g == null || (A = g.experimental) === null || A === void 0 ? void 0 : A[m]) !== null && z !== void 0 ? z : o[m]) !== null && L !== void 0 ? L : !1);
     }
     return !1;
   }
-  function l(v) {
-    if (v.experimental === "all")
-      return n.experimental;
+  function l(g) {
+    if (g.experimental === "all")
+      return i.experimental;
     var m;
-    return Object.keys((m = v == null ? void 0 : v.experimental) !== null && m !== void 0 ? m : {}).filter((E) => n.experimental.includes(E) && v.experimental[E]);
+    return Object.keys((m = g == null ? void 0 : g.experimental) !== null && m !== void 0 ? m : {}).filter((E) => i.experimental.includes(E) && g.experimental[E]);
   }
-  function s(v) {
-    if (process.env.JEST_WORKER_ID === void 0 && l(v).length > 0) {
-      let m = l(v).map((E) => r.default.yellow(E)).join(", ");
-      i.default.warn("experimental-flags-enabled", [
+  function s(g) {
+    if (process.env.JEST_WORKER_ID === void 0 && l(g).length > 0) {
+      let m = l(g).map((E) => r.default.yellow(E)).join(", ");
+      n.default.warn("experimental-flags-enabled", [
         `You have enabled experimental features: ${m}`,
         "Experimental features in Tailwind CSS are not covered by semver, may introduce breaking changes, and can change at any time."
       ]);
     }
   }
-  const c = n;
-})(ne);
+  const c = i;
+})(ie);
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -943,63 +943,63 @@ var We = {}, ne = {};
       return o;
     }
   });
-  const t = ne, r = /* @__PURE__ */ a(ie);
-  function i(n) {
+  const t = ie, r = /* @__PURE__ */ a(ne);
+  function n(i) {
     if (typeof WeakMap != "function")
       return null;
-    var h = /* @__PURE__ */ new WeakMap(), l = /* @__PURE__ */ new WeakMap();
-    return (i = function(s) {
-      return s ? l : h;
-    })(n);
+    var d = /* @__PURE__ */ new WeakMap(), l = /* @__PURE__ */ new WeakMap();
+    return (n = function(s) {
+      return s ? l : d;
+    })(i);
   }
-  function a(n, h) {
-    if (!h && n && n.__esModule)
-      return n;
-    if (n === null || typeof n != "object" && typeof n != "function")
+  function a(i, d) {
+    if (!d && i && i.__esModule)
+      return i;
+    if (i === null || typeof i != "object" && typeof i != "function")
       return {
-        default: n
+        default: i
       };
-    var l = i(h);
-    if (l && l.has(n))
-      return l.get(n);
+    var l = n(d);
+    if (l && l.has(i))
+      return l.get(i);
     var s = {}, c = Object.defineProperty && Object.getOwnPropertyDescriptor;
-    for (var v in n)
-      if (v !== "default" && Object.prototype.hasOwnProperty.call(n, v)) {
-        var m = c ? Object.getOwnPropertyDescriptor(n, v) : null;
-        m && (m.get || m.set) ? Object.defineProperty(s, v, m) : s[v] = n[v];
+    for (var g in i)
+      if (g !== "default" && Object.prototype.hasOwnProperty.call(i, g)) {
+        var m = c ? Object.getOwnPropertyDescriptor(i, g) : null;
+        m && (m.get || m.set) ? Object.defineProperty(s, g, m) : s[g] = i[g];
       }
-    return s.default = n, l && l.set(n, s), s;
+    return s.default = i, l && l.set(i, s), s;
   }
-  function o(n) {
+  function o(i) {
     if ((() => {
-      if (n.purge || !n.content || !Array.isArray(n.content) && !(typeof n.content == "object" && n.content !== null))
+      if (i.purge || !i.content || !Array.isArray(i.content) && !(typeof i.content == "object" && i.content !== null))
         return !1;
-      if (Array.isArray(n.content))
-        return n.content.every((s) => typeof s == "string" ? !0 : !(typeof (s == null ? void 0 : s.raw) != "string" || s != null && s.extension && typeof (s == null ? void 0 : s.extension) != "string"));
-      if (typeof n.content == "object" && n.content !== null) {
-        if (Object.keys(n.content).some((s) => ![
+      if (Array.isArray(i.content))
+        return i.content.every((s) => typeof s == "string" ? !0 : !(typeof (s == null ? void 0 : s.raw) != "string" || s != null && s.extension && typeof (s == null ? void 0 : s.extension) != "string"));
+      if (typeof i.content == "object" && i.content !== null) {
+        if (Object.keys(i.content).some((s) => ![
           "files",
           "relative",
           "extract",
           "transform"
         ].includes(s)))
           return !1;
-        if (Array.isArray(n.content.files)) {
-          if (!n.content.files.every((s) => typeof s == "string" ? !0 : !(typeof (s == null ? void 0 : s.raw) != "string" || s != null && s.extension && typeof (s == null ? void 0 : s.extension) != "string")))
+        if (Array.isArray(i.content.files)) {
+          if (!i.content.files.every((s) => typeof s == "string" ? !0 : !(typeof (s == null ? void 0 : s.raw) != "string" || s != null && s.extension && typeof (s == null ? void 0 : s.extension) != "string")))
             return !1;
-          if (typeof n.content.extract == "object") {
-            for (let s of Object.values(n.content.extract))
+          if (typeof i.content.extract == "object") {
+            for (let s of Object.values(i.content.extract))
               if (typeof s != "function")
                 return !1;
-          } else if (!(n.content.extract === void 0 || typeof n.content.extract == "function"))
+          } else if (!(i.content.extract === void 0 || typeof i.content.extract == "function"))
             return !1;
-          if (typeof n.content.transform == "object") {
-            for (let s of Object.values(n.content.transform))
+          if (typeof i.content.transform == "object") {
+            for (let s of Object.values(i.content.transform))
               if (typeof s != "function")
                 return !1;
-          } else if (!(n.content.transform === void 0 || typeof n.content.transform == "function"))
+          } else if (!(i.content.transform === void 0 || typeof i.content.transform == "function"))
             return !1;
-          if (typeof n.content.relative != "boolean" && typeof n.content.relative != "undefined")
+          if (typeof i.content.relative != "boolean" && typeof i.content.relative != "undefined")
             return !1;
         }
         return !0;
@@ -1009,12 +1009,12 @@ var We = {}, ne = {};
       "The `purge`/`content` options have changed in Tailwind CSS v3.0.",
       "Update your configuration file to eliminate this warning.",
       "https://tailwindcss.com/docs/upgrade-guide#configure-content-sources"
-    ]), n.safelist = (() => {
+    ]), i.safelist = (() => {
       var s;
-      let { content: c, purge: v, safelist: m } = n;
-      return Array.isArray(m) ? m : Array.isArray(c == null ? void 0 : c.safelist) ? c.safelist : Array.isArray(v == null ? void 0 : v.safelist) ? v.safelist : Array.isArray(v == null || (s = v.options) === null || s === void 0 ? void 0 : s.safelist) ? v.options.safelist : [];
-    })(), n.blocklist = (() => {
-      let { blocklist: s } = n;
+      let { content: c, purge: g, safelist: m } = i;
+      return Array.isArray(m) ? m : Array.isArray(c == null ? void 0 : c.safelist) ? c.safelist : Array.isArray(g == null ? void 0 : g.safelist) ? g.safelist : Array.isArray(g == null || (s = g.options) === null || s === void 0 ? void 0 : s.safelist) ? g.options.safelist : [];
+    })(), i.blocklist = (() => {
+      let { blocklist: s } = i;
       if (Array.isArray(s)) {
         if (s.every((c) => typeof c == "string"))
           return s;
@@ -1024,37 +1024,37 @@ var We = {}, ne = {};
         ]);
       }
       return [];
-    })(), typeof n.prefix == "function")
+    })(), typeof i.prefix == "function")
       r.default.warn("prefix-function", [
         "As of Tailwind CSS v3.0, `prefix` cannot be a function.",
         "Update `prefix` in your configuration to be a string to eliminate this warning.",
         "https://tailwindcss.com/docs/upgrade-guide#prefix-cannot-be-a-function"
-      ]), n.prefix = "";
+      ]), i.prefix = "";
     else {
       var l;
-      n.prefix = (l = n.prefix) !== null && l !== void 0 ? l : "";
+      i.prefix = (l = i.prefix) !== null && l !== void 0 ? l : "";
     }
-    n.content = {
+    i.content = {
       relative: (() => {
-        let { content: s } = n;
-        return s != null && s.relative ? s.relative : (0, t.flagEnabled)(n, "relativeContentPathsByDefault");
+        let { content: s } = i;
+        return s != null && s.relative ? s.relative : (0, t.flagEnabled)(i, "relativeContentPathsByDefault");
       })(),
       files: (() => {
-        let { content: s, purge: c } = n;
+        let { content: s, purge: c } = i;
         return Array.isArray(c) ? c : Array.isArray(c == null ? void 0 : c.content) ? c.content : Array.isArray(s) ? s : Array.isArray(s == null ? void 0 : s.content) ? s.content : Array.isArray(s == null ? void 0 : s.files) ? s.files : [];
       })(),
       extract: (() => {
         let s = (() => {
-          var m, E, y, k, F, P, L, M, G, H;
-          return !((m = n.purge) === null || m === void 0) && m.extract ? n.purge.extract : !((E = n.content) === null || E === void 0) && E.extract ? n.content.extract : !((y = n.purge) === null || y === void 0 || (k = y.extract) === null || k === void 0) && k.DEFAULT ? n.purge.extract.DEFAULT : !((F = n.content) === null || F === void 0 || (P = F.extract) === null || P === void 0) && P.DEFAULT ? n.content.extract.DEFAULT : !((L = n.purge) === null || L === void 0 || (M = L.options) === null || M === void 0) && M.extractors ? n.purge.options.extractors : !((G = n.content) === null || G === void 0 || (H = G.options) === null || H === void 0) && H.extractors ? n.content.options.extractors : {};
-        })(), c = {}, v = (() => {
+          var m, E, y, k, A, z, L, M, H, G;
+          return !((m = i.purge) === null || m === void 0) && m.extract ? i.purge.extract : !((E = i.content) === null || E === void 0) && E.extract ? i.content.extract : !((y = i.purge) === null || y === void 0 || (k = y.extract) === null || k === void 0) && k.DEFAULT ? i.purge.extract.DEFAULT : !((A = i.content) === null || A === void 0 || (z = A.extract) === null || z === void 0) && z.DEFAULT ? i.content.extract.DEFAULT : !((L = i.purge) === null || L === void 0 || (M = L.options) === null || M === void 0) && M.extractors ? i.purge.options.extractors : !((H = i.content) === null || H === void 0 || (G = H.options) === null || G === void 0) && G.extractors ? i.content.options.extractors : {};
+        })(), c = {}, g = (() => {
           var m, E, y, k;
-          if (!((m = n.purge) === null || m === void 0 || (E = m.options) === null || E === void 0) && E.defaultExtractor)
-            return n.purge.options.defaultExtractor;
-          if (!((y = n.content) === null || y === void 0 || (k = y.options) === null || k === void 0) && k.defaultExtractor)
-            return n.content.options.defaultExtractor;
+          if (!((m = i.purge) === null || m === void 0 || (E = m.options) === null || E === void 0) && E.defaultExtractor)
+            return i.purge.options.defaultExtractor;
+          if (!((y = i.content) === null || y === void 0 || (k = y.options) === null || k === void 0) && k.defaultExtractor)
+            return i.content.options.defaultExtractor;
         })();
-        if (v !== void 0 && (c.DEFAULT = v), typeof s == "function")
+        if (g !== void 0 && (c.DEFAULT = g), typeof s == "function")
           c.DEFAULT = s;
         else if (Array.isArray(s))
           for (let { extensions: m, extractor: E } of s != null ? s : [])
@@ -1066,13 +1066,13 @@ var We = {}, ne = {};
       })(),
       transform: (() => {
         let s = (() => {
-          var v, m, E, y, k, F;
-          return !((v = n.purge) === null || v === void 0) && v.transform ? n.purge.transform : !((m = n.content) === null || m === void 0) && m.transform ? n.content.transform : !((E = n.purge) === null || E === void 0 || (y = E.transform) === null || y === void 0) && y.DEFAULT ? n.purge.transform.DEFAULT : !((k = n.content) === null || k === void 0 || (F = k.transform) === null || F === void 0) && F.DEFAULT ? n.content.transform.DEFAULT : {};
+          var g, m, E, y, k, A;
+          return !((g = i.purge) === null || g === void 0) && g.transform ? i.purge.transform : !((m = i.content) === null || m === void 0) && m.transform ? i.content.transform : !((E = i.purge) === null || E === void 0 || (y = E.transform) === null || y === void 0) && y.DEFAULT ? i.purge.transform.DEFAULT : !((k = i.content) === null || k === void 0 || (A = k.transform) === null || A === void 0) && A.DEFAULT ? i.content.transform.DEFAULT : {};
         })(), c = {};
         return typeof s == "function" && (c.DEFAULT = s), typeof s == "object" && s !== null && Object.assign(c, s), c;
       })()
     };
-    for (let s of n.content.files)
+    for (let s of i.content.files)
       if (typeof s == "string" && /{([^,]*?)}/g.test(s)) {
         r.default.warn("invalid-glob-braces", [
           `The glob pattern ${(0, r.dim)(s)} in your Tailwind CSS configuration is invalid.`,
@@ -1080,7 +1080,7 @@ var We = {}, ne = {};
         ]);
         break;
       }
-    return n;
+    return i;
   }
 })(We);
 var Ue = {};
@@ -1096,8 +1096,8 @@ var Ue = {};
   function t(r) {
     if (Object.prototype.toString.call(r) !== "[object Object]")
       return !1;
-    const i = Object.getPrototypeOf(r);
-    return i === null || i === Object.prototype;
+    const n = Object.getPrototypeOf(r);
+    return n === null || n === Object.prototype;
   }
 })(Ue);
 var Ne = {};
@@ -1111,8 +1111,8 @@ var Ne = {};
     }
   });
   function t(r) {
-    return Array.isArray(r) ? r.map((i) => t(i)) : typeof r == "object" && r !== null ? Object.fromEntries(Object.entries(r).map(([i, a]) => [
-      i,
+    return Array.isArray(r) ? r.map((n) => t(n)) : typeof r == "object" && r !== null ? Object.fromEntries(Object.entries(r).map(([n, a]) => [
+      n,
       t(a)
     ])) : r;
   }
@@ -1131,7 +1131,7 @@ var Ie = {}, Ve = {};
     return r.replace(/\\,/g, "\\2c ");
   }
 })(Ve);
-var ve = {}, ye = {}, qe = {};
+var ve = {}, ye = {}, Xe = {};
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -1883,16 +1883,16 @@ var ve = {}, ye = {}, qe = {};
       50
     ]
   };
-})(qe);
+})(Xe);
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
   });
   function t(y, k) {
-    for (var F in k)
-      Object.defineProperty(y, F, {
+    for (var A in k)
+      Object.defineProperty(y, A, {
         enumerable: !0,
-        get: k[F]
+        get: k[A]
       });
   }
   t(e, {
@@ -1903,15 +1903,15 @@ var ve = {}, ye = {}, qe = {};
       return E;
     }
   });
-  const r = /* @__PURE__ */ i(qe);
-  function i(y) {
+  const r = /* @__PURE__ */ n(Xe);
+  function n(y) {
     return y && y.__esModule ? y : {
       default: y
     };
   }
-  let a = /^#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i, o = /^#([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i, n = /(?:\d+|\d*\.\d+)%?/, h = /(?:\s*,\s*|\s+)/, l = /\s*[,/]\s*/, s = /var\(--(?:[^ )]*?)\)/, c = new RegExp(`^(rgba?)\\(\\s*(${n.source}|${s.source})(?:${h.source}(${n.source}|${s.source}))?(?:${h.source}(${n.source}|${s.source}))?(?:${l.source}(${n.source}|${s.source}))?\\s*\\)$`), v = new RegExp(`^(hsla?)\\(\\s*((?:${n.source})(?:deg|rad|grad|turn)?|${s.source})(?:${h.source}(${n.source}|${s.source}))?(?:${h.source}(${n.source}|${s.source}))?(?:${l.source}(${n.source}|${s.source}))?\\s*\\)$`);
+  let a = /^#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i, o = /^#([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i, i = /(?:\d+|\d*\.\d+)%?/, d = /(?:\s*,\s*|\s+)/, l = /\s*[,/]\s*/, s = /var\(--(?:[^ )]*?)\)/, c = new RegExp(`^(rgba?)\\(\\s*(${i.source}|${s.source})(?:${d.source}(${i.source}|${s.source}))?(?:${d.source}(${i.source}|${s.source}))?(?:${l.source}(${i.source}|${s.source}))?\\s*\\)$`), g = new RegExp(`^(hsla?)\\(\\s*((?:${i.source})(?:deg|rad|grad|turn)?|${s.source})(?:${d.source}(${i.source}|${s.source}))?(?:${d.source}(${i.source}|${s.source}))?(?:${l.source}(${i.source}|${s.source}))?\\s*\\)$`);
   function m(y, { loose: k = !1 } = {}) {
-    var F, P;
+    var A, z;
     if (typeof y != "string")
       return null;
     if (y = y.trim(), y === "transparent")
@@ -1927,16 +1927,16 @@ var ve = {}, ye = {}, qe = {};
     if (y in r.default)
       return {
         mode: "rgb",
-        color: r.default[y].map((B) => B.toString())
+        color: r.default[y].map((R) => R.toString())
       };
-    let L = y.replace(o, (B, N, W, g, D) => [
+    let L = y.replace(o, (R, N, W, v, D) => [
       "#",
       N,
       N,
       W,
       W,
-      g,
-      g,
+      v,
+      v,
       D ? D + D : ""
     ].join("")).match(a);
     if (L !== null)
@@ -1946,78 +1946,78 @@ var ve = {}, ye = {}, qe = {};
           parseInt(L[1], 16),
           parseInt(L[2], 16),
           parseInt(L[3], 16)
-        ].map((B) => B.toString()),
+        ].map((R) => R.toString()),
         alpha: L[4] ? (parseInt(L[4], 16) / 255).toString() : void 0
       };
     var M;
-    let G = (M = y.match(c)) !== null && M !== void 0 ? M : y.match(v);
-    if (G === null)
+    let H = (M = y.match(c)) !== null && M !== void 0 ? M : y.match(g);
+    if (H === null)
       return null;
-    let H = [
-      G[2],
-      G[3],
-      G[4]
-    ].filter(Boolean).map((B) => B.toString());
-    return H.length === 2 && H[0].startsWith("var(") ? {
-      mode: G[1],
+    let G = [
+      H[2],
+      H[3],
+      H[4]
+    ].filter(Boolean).map((R) => R.toString());
+    return G.length === 2 && G[0].startsWith("var(") ? {
+      mode: H[1],
       color: [
-        H[0]
+        G[0]
       ],
-      alpha: H[1]
-    } : !k && H.length !== 3 || H.length < 3 && !H.some((B) => /^var\(.*?\)$/.test(B)) ? null : {
-      mode: G[1],
-      color: H,
-      alpha: (F = G[5]) === null || F === void 0 || (P = F.toString) === null || P === void 0 ? void 0 : P.call(F)
+      alpha: G[1]
+    } : !k && G.length !== 3 || G.length < 3 && !G.some((R) => /^var\(.*?\)$/.test(R)) ? null : {
+      mode: H[1],
+      color: G,
+      alpha: (A = H[5]) === null || A === void 0 || (z = A.toString) === null || z === void 0 ? void 0 : z.call(A)
     };
   }
-  function E({ mode: y, color: k, alpha: F }) {
-    let P = F !== void 0;
-    return y === "rgba" || y === "hsla" ? `${y}(${k.join(", ")}${P ? `, ${F}` : ""})` : `${y}(${k.join(" ")}${P ? ` / ${F}` : ""})`;
+  function E({ mode: y, color: k, alpha: A }) {
+    let z = A !== void 0;
+    return y === "rgba" || y === "hsla" ? `${y}(${k.join(", ")}${z ? `, ${A}` : ""})` : `${y}(${k.join(" ")}${z ? ` / ${A}` : ""})`;
   }
 })(ye);
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
   });
-  function t(o, n) {
-    for (var h in n)
-      Object.defineProperty(o, h, {
+  function t(o, i) {
+    for (var d in i)
+      Object.defineProperty(o, d, {
         enumerable: !0,
-        get: n[h]
+        get: i[d]
       });
   }
   t(e, {
     withAlphaValue: function() {
-      return i;
+      return n;
     },
     default: function() {
       return a;
     }
   });
   const r = ye;
-  function i(o, n, h) {
+  function n(o, i, d) {
     if (typeof o == "function")
       return o({
-        opacityValue: n
+        opacityValue: i
       });
     let l = (0, r.parseColor)(o, {
       loose: !0
     });
-    return l === null ? h : (0, r.formatColor)({
+    return l === null ? d : (0, r.formatColor)({
       ...l,
-      alpha: n
+      alpha: i
     });
   }
-  function a({ color: o, property: n, variable: h }) {
-    let l = [].concat(n);
+  function a({ color: o, property: i, variable: d }) {
+    let l = [].concat(i);
     if (typeof o == "function")
       return {
-        [h]: "1",
+        [d]: "1",
         ...Object.fromEntries(l.map((c) => [
           c,
           o({
-            opacityVariable: h,
-            opacityValue: `var(${h})`
+            opacityVariable: d,
+            opacityValue: `var(${d})`
           })
         ]))
       };
@@ -2029,18 +2029,18 @@ var ve = {}, ye = {}, qe = {};
       c,
       o
     ])) : {
-      [h]: "1",
+      [d]: "1",
       ...Object.fromEntries(l.map((c) => [
         c,
         (0, r.formatColor)({
           ...s,
-          alpha: `var(${h})`
+          alpha: `var(${d})`
         })
       ]))
     };
   }
 })(ve);
-var be = {}, Xe = {}, se = {};
+var be = {}, qe = {}, se = {};
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
@@ -2050,13 +2050,13 @@ var be = {}, Xe = {}, se = {};
       return t;
     }
   });
-  function t(r, i) {
-    let a = [], o = [], n = 0, h = !1;
+  function t(r, n) {
+    let a = [], o = [], i = 0, d = !1;
     for (let l = 0; l < r.length; l++) {
       let s = r[l];
-      a.length === 0 && s === i[0] && !h && (i.length === 1 || r.slice(l, l + i.length) === i) && (o.push(r.slice(n, l)), n = l + i.length), h ? h = !1 : s === "\\" && (h = !0), s === "(" || s === "[" || s === "{" ? a.push(s) : (s === ")" && a[a.length - 1] === "(" || s === "]" && a[a.length - 1] === "[" || s === "}" && a[a.length - 1] === "{") && a.pop();
+      a.length === 0 && s === n[0] && !d && (n.length === 1 || r.slice(l, l + n.length) === n) && (o.push(r.slice(i, l)), i = l + n.length), d ? d = !1 : s === "\\" && (d = !0), s === "(" || s === "[" || s === "{" ? a.push(s) : (s === ")" && a[a.length - 1] === "(" || s === "]" && a[a.length - 1] === "[" || s === "}" && a[a.length - 1] === "{") && a.pop();
     }
-    return o.push(r.slice(n)), o;
+    return o.push(r.slice(i)), o;
   }
 })(se);
 (function(e) {
@@ -2072,31 +2072,31 @@ var be = {}, Xe = {}, se = {};
   }
   t(e, {
     parseBoxShadowValue: function() {
-      return n;
+      return i;
     },
     formatBoxShadowValue: function() {
-      return h;
+      return d;
     }
   });
   const r = se;
-  let i = /* @__PURE__ */ new Set([
+  let n = /* @__PURE__ */ new Set([
     "inset",
     "inherit",
     "initial",
     "revert",
     "unset"
   ]), a = /\ +(?![^(]*\))/g, o = /^-?(\d+|\.\d+)(.*?)$/g;
-  function n(l) {
+  function i(l) {
     return (0, r.splitAtTopLevelOnly)(l, ",").map((c) => {
-      let v = c.trim(), m = {
-        raw: v
-      }, E = v.split(a), y = /* @__PURE__ */ new Set();
+      let g = c.trim(), m = {
+        raw: g
+      }, E = g.split(a), y = /* @__PURE__ */ new Set();
       for (let k of E)
-        o.lastIndex = 0, !y.has("KEYWORD") && i.has(k) ? (m.keyword = k, y.add("KEYWORD")) : o.test(k) ? y.has("X") ? y.has("Y") ? y.has("BLUR") ? y.has("SPREAD") || (m.spread = k, y.add("SPREAD")) : (m.blur = k, y.add("BLUR")) : (m.y = k, y.add("Y")) : (m.x = k, y.add("X")) : m.color ? (m.unknown || (m.unknown = []), m.unknown.push(k)) : m.color = k;
+        o.lastIndex = 0, !y.has("KEYWORD") && n.has(k) ? (m.keyword = k, y.add("KEYWORD")) : o.test(k) ? y.has("X") ? y.has("Y") ? y.has("BLUR") ? y.has("SPREAD") || (m.spread = k, y.add("SPREAD")) : (m.blur = k, y.add("BLUR")) : (m.y = k, y.add("Y")) : (m.x = k, y.add("X")) : m.color ? (m.unknown || (m.unknown = []), m.unknown.push(k)) : m.color = k;
       return m.valid = m.x !== void 0 && m.y !== void 0, m;
     });
   }
-  function h(l) {
+  function d(l) {
     return l.map((s) => s.valid ? [
       s.keyword,
       s.x,
@@ -2106,16 +2106,16 @@ var be = {}, Xe = {}, se = {};
       s.color
     ].filter(Boolean).join(" ") : s.raw).join(", ");
   }
-})(Xe);
+})(qe);
 (function(e) {
   Object.defineProperty(e, "__esModule", {
     value: !0
   });
-  function t(d, w) {
-    for (var A in w)
-      Object.defineProperty(d, A, {
+  function t(f, w) {
+    for (var F in w)
+      Object.defineProperty(f, F, {
         enumerable: !0,
-        get: w[A]
+        get: w[F]
       });
   }
   t(e, {
@@ -2123,7 +2123,7 @@ var be = {}, Xe = {}, se = {};
       return s;
     },
     url: function() {
-      return v;
+      return g;
     },
     number: function() {
       return m;
@@ -2132,7 +2132,7 @@ var be = {}, Xe = {}, se = {};
       return E;
     },
     length: function() {
-      return F;
+      return A;
     },
     lineWidth: function() {
       return L;
@@ -2141,58 +2141,58 @@ var be = {}, Xe = {}, se = {};
       return M;
     },
     color: function() {
-      return G;
+      return H;
     },
     image: function() {
-      return H;
+      return G;
     },
     gradient: function() {
       return N;
     },
     position: function() {
-      return g;
+      return v;
     },
     familyName: function() {
       return D;
     },
     genericName: function() {
-      return f;
+      return h;
     },
     absoluteSize: function() {
-      return x;
+      return _;
     },
     relativeSize: function() {
       return $;
     }
   });
-  const r = ye, i = Xe, a = se;
+  const r = ye, n = qe, a = se;
   let o = [
     "min",
     "max",
     "clamp",
     "calc"
   ];
-  function n(d) {
-    return o.some((w) => new RegExp(`^${w}\\(.*\\)`).test(d));
+  function i(f) {
+    return o.some((w) => new RegExp(`^${w}\\(.*\\)`).test(f));
   }
-  const h = "--tw-placeholder", l = new RegExp(h, "g");
-  function s(d, w = !0) {
-    return d.startsWith("--") ? `var(${d})` : d.includes("url(") ? d.split(/(url\(.*?\))/g).filter(Boolean).map((A) => /^url\(.*?\)$/.test(A) ? A : s(A, !1)).join("") : (d = d.replace(/([^\\])_+/g, (A, O) => O + " ".repeat(A.length - 1)).replace(/^_/g, " ").replace(/\\_/g, "_"), w && (d = d.trim()), d = c(d), d);
+  const d = "--tw-placeholder", l = new RegExp(d, "g");
+  function s(f, w = !0) {
+    return f.startsWith("--") ? `var(${f})` : f.includes("url(") ? f.split(/(url\(.*?\))/g).filter(Boolean).map((F) => /^url\(.*?\)$/.test(F) ? F : s(F, !1)).join("") : (f = f.replace(/([^\\])_+/g, (F, O) => O + " ".repeat(F.length - 1)).replace(/^_/g, " ").replace(/\\_/g, "_"), w && (f = f.trim()), f = c(f), f);
   }
-  function c(d) {
-    return d.replace(/(calc|min|max|clamp)\(.+\)/g, (w) => {
-      let A = [];
-      return w.replace(/var\((--.+?)[,)]/g, (O, K) => (A.push(K), O.replace(K, h))).replace(/(-?\d*\.?\d(?!\b-\d.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g, "$1 $2 ").replace(l, () => A.shift());
+  function c(f) {
+    return f.replace(/(calc|min|max|clamp)\(.+\)/g, (w) => {
+      let F = [];
+      return w.replace(/var\((--.+?)[,)]/g, (O, Q) => (F.push(Q), O.replace(Q, d))).replace(/(-?\d*\.?\d(?!\b-\d.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g, "$1 $2 ").replace(l, () => F.shift());
     });
   }
-  function v(d) {
-    return d.startsWith("url(");
+  function g(f) {
+    return f.startsWith("url(");
   }
-  function m(d) {
-    return !isNaN(Number(d)) || n(d);
+  function m(f) {
+    return !isNaN(Number(f)) || i(f);
   }
-  function E(d) {
-    return d.endsWith("%") && m(d.slice(0, -1)) || n(d);
+  function E(f) {
+    return f.endsWith("%") && m(f.slice(0, -1)) || i(f);
   }
   let k = `(?:${[
     "cm",
@@ -2227,40 +2227,40 @@ var be = {}, Xe = {}, se = {};
     "cqmin",
     "cqmax"
   ].join("|")})`;
-  function F(d) {
-    return d === "0" || new RegExp(`^[+-]?[0-9]*.?[0-9]+(?:[eE][+-]?[0-9]+)?${k}$`).test(d) || n(d);
+  function A(f) {
+    return f === "0" || new RegExp(`^[+-]?[0-9]*.?[0-9]+(?:[eE][+-]?[0-9]+)?${k}$`).test(f) || i(f);
   }
-  let P = /* @__PURE__ */ new Set([
+  let z = /* @__PURE__ */ new Set([
     "thin",
     "medium",
     "thick"
   ]);
-  function L(d) {
-    return P.has(d);
+  function L(f) {
+    return z.has(f);
   }
-  function M(d) {
-    let w = (0, i.parseBoxShadowValue)(s(d));
-    for (let A of w)
-      if (!A.valid)
+  function M(f) {
+    let w = (0, n.parseBoxShadowValue)(s(f));
+    for (let F of w)
+      if (!F.valid)
         return !1;
     return !0;
   }
-  function G(d) {
+  function H(f) {
     let w = 0;
-    return (0, a.splitAtTopLevelOnly)(d, "_").every((O) => (O = s(O), O.startsWith("var(") ? !0 : (0, r.parseColor)(O, {
+    return (0, a.splitAtTopLevelOnly)(f, "_").every((O) => (O = s(O), O.startsWith("var(") ? !0 : (0, r.parseColor)(O, {
       loose: !0
     }) !== null ? (w++, !0) : !1)) ? w > 0 : !1;
   }
-  function H(d) {
+  function G(f) {
     let w = 0;
-    return (0, a.splitAtTopLevelOnly)(d, ",").every((O) => (O = s(O), O.startsWith("var(") ? !0 : v(O) || N(O) || [
+    return (0, a.splitAtTopLevelOnly)(f, ",").every((O) => (O = s(O), O.startsWith("var(") ? !0 : g(O) || N(O) || [
       "element(",
       "image(",
       "cross-fade(",
       "image-set("
-    ].some((K) => O.startsWith(K)) ? (w++, !0) : !1)) ? w > 0 : !1;
+    ].some((Q) => O.startsWith(Q)) ? (w++, !0) : !1)) ? w > 0 : !1;
   }
-  let B = /* @__PURE__ */ new Set([
+  let R = /* @__PURE__ */ new Set([
     "conic-gradient",
     "linear-gradient",
     "radial-gradient",
@@ -2268,10 +2268,10 @@ var be = {}, Xe = {}, se = {};
     "repeating-linear-gradient",
     "repeating-radial-gradient"
   ]);
-  function N(d) {
-    d = s(d);
-    for (let w of B)
-      if (d.startsWith(`${w}(`))
+  function N(f) {
+    f = s(f);
+    for (let w of R)
+      if (f.startsWith(`${w}(`))
         return !0;
     return !1;
   }
@@ -2282,13 +2282,13 @@ var be = {}, Xe = {}, se = {};
     "bottom",
     "left"
   ]);
-  function g(d) {
+  function v(f) {
     let w = 0;
-    return (0, a.splitAtTopLevelOnly)(d, "_").every((O) => (O = s(O), O.startsWith("var(") ? !0 : W.has(O) || F(O) || E(O) ? (w++, !0) : !1)) ? w > 0 : !1;
+    return (0, a.splitAtTopLevelOnly)(f, "_").every((O) => (O = s(O), O.startsWith("var(") ? !0 : W.has(O) || A(O) || E(O) ? (w++, !0) : !1)) ? w > 0 : !1;
   }
-  function D(d) {
+  function D(f) {
     let w = 0;
-    return (0, a.splitAtTopLevelOnly)(d, ",").every((O) => (O = s(O), O.startsWith("var(") ? !0 : O.includes(" ") && !/(['"])([^"']+)\1/g.test(O) || /^\d/g.test(O) ? !1 : (w++, !0))) ? w > 0 : !1;
+    return (0, a.splitAtTopLevelOnly)(f, ",").every((O) => (O = s(O), O.startsWith("var(") ? !0 : O.includes(" ") && !/(['"])([^"']+)\1/g.test(O) || /^\d/g.test(O) ? !1 : (w++, !0))) ? w > 0 : !1;
   }
   let C = /* @__PURE__ */ new Set([
     "serif",
@@ -2305,10 +2305,10 @@ var be = {}, Xe = {}, se = {};
     "emoji",
     "fangsong"
   ]);
-  function f(d) {
-    return C.has(d);
+  function h(f) {
+    return C.has(f);
   }
-  let b = /* @__PURE__ */ new Set([
+  let x = /* @__PURE__ */ new Set([
     "xx-small",
     "x-small",
     "small",
@@ -2318,15 +2318,15 @@ var be = {}, Xe = {}, se = {};
     "x-large",
     "xxx-large"
   ]);
-  function x(d) {
-    return b.has(d);
+  function _(f) {
+    return x.has(f);
   }
   let p = /* @__PURE__ */ new Set([
     "larger",
     "smaller"
   ]);
-  function $(d) {
-    return p.has(d);
+  function $(f) {
+    return p.has(f);
   }
 })(be);
 var Ye = {};
@@ -2336,18 +2336,18 @@ var Ye = {};
   }), Object.defineProperty(e, "backgroundSize", {
     enumerable: !0,
     get: function() {
-      return i;
+      return n;
     }
   });
   const t = be, r = se;
-  function i(a) {
+  function n(a) {
     let o = [
       "cover",
       "contain"
     ];
-    return (0, r.splitAtTopLevelOnly)(a, ",").every((n) => {
-      let h = (0, r.splitAtTopLevelOnly)(n, "_").filter(Boolean);
-      return h.length === 1 && o.includes(h[0]) ? !0 : h.length !== 1 && h.length !== 2 ? !1 : h.every((l) => (0, t.length)(l) || (0, t.percentage)(l) || l === "auto");
+    return (0, r.splitAtTopLevelOnly)(a, ",").every((i) => {
+      let d = (0, r.splitAtTopLevelOnly)(i, "_").filter(Boolean);
+      return d.length === 1 && o.includes(d[0]) ? !0 : d.length !== 1 && d.length !== 2 ? !1 : d.every((l) => (0, t.length)(l) || (0, t.percentage)(l) || l === "auto");
     });
   }
 })(Ye);
@@ -2355,9 +2355,9 @@ var Ye = {};
   Object.defineProperty(e, "__esModule", {
     value: !0
   });
-  function t(g, D) {
+  function t(v, D) {
     for (var C in D)
-      Object.defineProperty(g, C, {
+      Object.defineProperty(v, C, {
         enumerable: !0,
         get: D[C]
       });
@@ -2373,13 +2373,13 @@ var Ye = {};
       return k;
     },
     asColor: function() {
-      return P;
+      return z;
     },
     asLookupValue: function() {
       return L;
     },
     typeMap: function() {
-      return G;
+      return H;
     },
     coerceValue: function() {
       return N;
@@ -2388,92 +2388,92 @@ var Ye = {};
       return W;
     }
   });
-  const r = /* @__PURE__ */ l(Ve), i = ve, a = be, o = /* @__PURE__ */ l(me), n = Ye, h = ne;
-  function l(g) {
-    return g && g.__esModule ? g : {
-      default: g
+  const r = /* @__PURE__ */ l(Ve), n = ve, a = be, o = /* @__PURE__ */ l(me), i = Ye, d = ie;
+  function l(v) {
+    return v && v.__esModule ? v : {
+      default: v
     };
   }
-  function s(g, D) {
-    g.walkClasses((C) => {
+  function s(v, D) {
+    v.walkClasses((C) => {
       C.value = D(C.value), C.raws && C.raws.value && (C.raws.value = (0, r.default)(C.raws.value));
     });
   }
-  function c(g, D) {
-    if (!E(g))
+  function c(v, D) {
+    if (!E(v))
       return;
-    let C = g.slice(1, -1);
+    let C = v.slice(1, -1);
     if (D(C))
       return (0, a.normalize)(C);
   }
-  function v(g, D = {}, C) {
-    let f = D[g];
-    if (f !== void 0)
-      return (0, o.default)(f);
-    if (E(g)) {
-      let b = c(g, C);
-      return b === void 0 ? void 0 : (0, o.default)(b);
+  function g(v, D = {}, C) {
+    let h = D[v];
+    if (h !== void 0)
+      return (0, o.default)(h);
+    if (E(v)) {
+      let x = c(v, C);
+      return x === void 0 ? void 0 : (0, o.default)(x);
     }
   }
-  function m(g, D = {}, { validate: C = () => !0 } = {}) {
-    var f;
-    let b = (f = D.values) === null || f === void 0 ? void 0 : f[g];
-    return b !== void 0 ? b : D.supportsNegativeValues && g.startsWith("-") ? v(g.slice(1), D.values, C) : c(g, C);
+  function m(v, D = {}, { validate: C = () => !0 } = {}) {
+    var h;
+    let x = (h = D.values) === null || h === void 0 ? void 0 : h[v];
+    return x !== void 0 ? x : D.supportsNegativeValues && v.startsWith("-") ? g(v.slice(1), D.values, C) : c(v, C);
   }
-  function E(g) {
-    return g.startsWith("[") && g.endsWith("]");
+  function E(v) {
+    return v.startsWith("[") && v.endsWith("]");
   }
-  function y(g) {
-    let D = g.lastIndexOf("/");
-    return D === -1 || D === g.length - 1 ? [
-      g,
+  function y(v) {
+    let D = v.lastIndexOf("/");
+    return D === -1 || D === v.length - 1 ? [
+      v,
       void 0
-    ] : E(g) && !g.includes("]/[") ? [
-      g,
+    ] : E(v) && !v.includes("]/[") ? [
+      v,
       void 0
     ] : [
-      g.slice(0, D),
-      g.slice(D + 1)
+      v.slice(0, D),
+      v.slice(D + 1)
     ];
   }
-  function k(g) {
-    if (typeof g == "string" && g.includes("<alpha-value>")) {
-      let D = g;
+  function k(v) {
+    if (typeof v == "string" && v.includes("<alpha-value>")) {
+      let D = v;
       return ({ opacityValue: C = 1 }) => D.replace("<alpha-value>", C);
     }
-    return g;
+    return v;
   }
-  function F(g) {
-    return (0, a.normalize)(g.slice(1, -1));
+  function A(v) {
+    return (0, a.normalize)(v.slice(1, -1));
   }
-  function P(g, D = {}, { tailwindConfig: C = {} } = {}) {
-    var f;
-    if (((f = D.values) === null || f === void 0 ? void 0 : f[g]) !== void 0) {
-      var b;
-      return k((b = D.values) === null || b === void 0 ? void 0 : b[g]);
+  function z(v, D = {}, { tailwindConfig: C = {} } = {}) {
+    var h;
+    if (((h = D.values) === null || h === void 0 ? void 0 : h[v]) !== void 0) {
+      var x;
+      return k((x = D.values) === null || x === void 0 ? void 0 : x[v]);
     }
-    let [x, p] = y(g);
+    let [_, p] = y(v);
     if (p !== void 0) {
-      var $, d, w, A;
-      let O = (A = ($ = D.values) === null || $ === void 0 ? void 0 : $[x]) !== null && A !== void 0 ? A : E(x) ? x.slice(1, -1) : void 0;
-      return O === void 0 ? void 0 : (O = k(O), E(p) ? (0, i.withAlphaValue)(O, F(p)) : ((d = C.theme) === null || d === void 0 || (w = d.opacity) === null || w === void 0 ? void 0 : w[p]) === void 0 ? void 0 : (0, i.withAlphaValue)(O, C.theme.opacity[p]));
+      var $, f, w, F;
+      let O = (F = ($ = D.values) === null || $ === void 0 ? void 0 : $[_]) !== null && F !== void 0 ? F : E(_) ? _.slice(1, -1) : void 0;
+      return O === void 0 ? void 0 : (O = k(O), E(p) ? (0, n.withAlphaValue)(O, A(p)) : ((f = C.theme) === null || f === void 0 || (w = f.opacity) === null || w === void 0 ? void 0 : w[p]) === void 0 ? void 0 : (0, n.withAlphaValue)(O, C.theme.opacity[p]));
     }
-    return m(g, D, {
+    return m(v, D, {
       validate: a.color
     });
   }
-  function L(g, D = {}) {
+  function L(v, D = {}) {
     var C;
-    return (C = D.values) === null || C === void 0 ? void 0 : C[g];
+    return (C = D.values) === null || C === void 0 ? void 0 : C[v];
   }
-  function M(g) {
+  function M(v) {
     return (D, C) => m(D, C, {
-      validate: g
+      validate: v
     });
   }
-  let G = {
+  let H = {
     any: m,
-    color: P,
+    color: z,
     url: M(a.url),
     image: M(a.image),
     length: M(a.length),
@@ -2487,63 +2487,63 @@ var Ye = {};
     "absolute-size": M(a.absoluteSize),
     "relative-size": M(a.relativeSize),
     shadow: M(a.shadow),
-    size: M(n.backgroundSize)
-  }, H = Object.keys(G);
-  function B(g, D) {
-    let C = g.indexOf(D);
+    size: M(i.backgroundSize)
+  }, G = Object.keys(H);
+  function R(v, D) {
+    let C = v.indexOf(D);
     return C === -1 ? [
       void 0,
-      g
+      v
     ] : [
-      g.slice(0, C),
-      g.slice(C + 1)
+      v.slice(0, C),
+      v.slice(C + 1)
     ];
   }
-  function N(g, D, C, f) {
+  function N(v, D, C, h) {
     if (C.values && D in C.values)
-      for (let { type: x } of g != null ? g : []) {
-        let p = G[x](D, C, {
-          tailwindConfig: f
+      for (let { type: _ } of v != null ? v : []) {
+        let p = H[_](D, C, {
+          tailwindConfig: h
         });
         if (p !== void 0)
           return [
             p,
-            x,
+            _,
             null
           ];
       }
     if (E(D)) {
-      let x = D.slice(1, -1), [p, $] = B(x, ":");
+      let _ = D.slice(1, -1), [p, $] = R(_, ":");
       if (!/^[\w-_]+$/g.test(p))
-        $ = x;
-      else if (p !== void 0 && !H.includes(p))
+        $ = _;
+      else if (p !== void 0 && !G.includes(p))
         return [];
-      if ($.length > 0 && H.includes(p))
+      if ($.length > 0 && G.includes(p))
         return [
           m(`[${$}]`, C),
           p,
           null
         ];
     }
-    let b = W(g, D, C, f);
-    for (let x of b)
-      return x;
+    let x = W(v, D, C, h);
+    for (let _ of x)
+      return _;
     return [];
   }
-  function* W(g, D, C, f) {
-    let b = (0, h.flagEnabled)(f, "generalizedModifiers"), [x, p] = y(D);
-    if (b && C.modifiers != null && (C.modifiers === "any" || typeof C.modifiers == "object" && (p && E(p) || p in C.modifiers)) || (x = D, p = void 0), p !== void 0 && x === "" && (x = "DEFAULT"), p !== void 0 && typeof C.modifiers == "object") {
-      var d, w;
-      let A = (w = (d = C.modifiers) === null || d === void 0 ? void 0 : d[p]) !== null && w !== void 0 ? w : null;
-      A !== null ? p = A : E(p) && (p = F(p));
+  function* W(v, D, C, h) {
+    let x = (0, d.flagEnabled)(h, "generalizedModifiers"), [_, p] = y(D);
+    if (x && C.modifiers != null && (C.modifiers === "any" || typeof C.modifiers == "object" && (p && E(p) || p in C.modifiers)) || (_ = D, p = void 0), p !== void 0 && _ === "" && (_ = "DEFAULT"), p !== void 0 && typeof C.modifiers == "object") {
+      var f, w;
+      let F = (w = (f = C.modifiers) === null || f === void 0 ? void 0 : f[p]) !== null && w !== void 0 ? w : null;
+      F !== null ? p = F : E(p) && (p = A(p));
     }
-    for (let { type: A } of g != null ? g : []) {
-      let O = G[A](x, C, {
-        tailwindConfig: f
+    for (let { type: F } of v != null ? v : []) {
+      let O = H[F](_, C, {
+        tailwindConfig: h
       });
       O !== void 0 && (yield [
         O,
-        A,
+        F,
         p != null ? p : null
       ]);
     }
@@ -2572,44 +2572,44 @@ var Ze = {};
       return C;
     }
   });
-  const t = /* @__PURE__ */ E(me), r = /* @__PURE__ */ E(Le), i = /* @__PURE__ */ E(Ge), a = /* @__PURE__ */ E(pe), o = Re, n = Be, h = We, l = /* @__PURE__ */ E(Ue), s = Ne, c = Ie, v = ve, m = /* @__PURE__ */ E(Ze);
-  function E(f) {
-    return f && f.__esModule ? f : {
-      default: f
+  const t = /* @__PURE__ */ E(me), r = /* @__PURE__ */ E(Le), n = /* @__PURE__ */ E(He), a = /* @__PURE__ */ E(pe), o = je, i = Re, d = We, l = /* @__PURE__ */ E(Ue), s = Ne, c = Ie, g = ve, m = /* @__PURE__ */ E(Ze);
+  function E(h) {
+    return h && h.__esModule ? h : {
+      default: h
     };
   }
-  function y(f) {
-    return typeof f == "function";
+  function y(h) {
+    return typeof h == "function";
   }
-  function k(f, ...b) {
-    let x = b.pop();
-    for (let p of b)
+  function k(h, ...x) {
+    let _ = x.pop();
+    for (let p of x)
       for (let $ in p) {
-        let d = x(f[$], p[$]);
-        d === void 0 ? (0, l.default)(f[$]) && (0, l.default)(p[$]) ? f[$] = k({}, f[$], p[$], x) : f[$] = p[$] : f[$] = d;
+        let f = _(h[$], p[$]);
+        f === void 0 ? (0, l.default)(h[$]) && (0, l.default)(p[$]) ? h[$] = k({}, h[$], p[$], _) : h[$] = p[$] : h[$] = f;
       }
-    return f;
+    return h;
   }
-  const F = {
+  const A = {
     colors: a.default,
-    negative(f) {
-      return Object.keys(f).filter((b) => f[b] !== "0").reduce((b, x) => {
-        let p = (0, t.default)(f[x]);
-        return p !== void 0 && (b[`-${x}`] = p), b;
+    negative(h) {
+      return Object.keys(h).filter((x) => h[x] !== "0").reduce((x, _) => {
+        let p = (0, t.default)(h[_]);
+        return p !== void 0 && (x[`-${_}`] = p), x;
       }, {});
     },
-    breakpoints(f) {
-      return Object.keys(f).filter((b) => typeof f[b] == "string").reduce((b, x) => ({
-        ...b,
-        [`screen-${x}`]: f[x]
+    breakpoints(h) {
+      return Object.keys(h).filter((x) => typeof h[x] == "string").reduce((x, _) => ({
+        ...x,
+        [`screen-${_}`]: h[_]
       }), {});
     }
   };
-  function P(f, ...b) {
-    return y(f) ? f(...b) : f;
+  function z(h, ...x) {
+    return y(h) ? h(...x) : h;
   }
-  function L(f) {
-    return f.reduce((b, { extend: x }) => k(b, x, (p, $) => p === void 0 ? [
+  function L(h) {
+    return h.reduce((x, { extend: _ }) => k(x, _, (p, $) => p === void 0 ? [
       $
     ] : Array.isArray(p) ? [
       $,
@@ -2619,115 +2619,115 @@ var Ze = {};
       p
     ]), {});
   }
-  function M(f) {
+  function M(h) {
     return {
-      ...f.reduce((b, x) => (0, o.defaults)(b, x), {}),
+      ...h.reduce((x, _) => (0, o.defaults)(x, _), {}),
       // In order to resolve n config objects, we combine all of their `extend` properties
       // into arrays instead of objects so they aren't overridden.
-      extend: L(f)
+      extend: L(h)
     };
   }
-  function G(f, b) {
-    if (Array.isArray(f) && (0, l.default)(f[0]))
-      return f.concat(b);
-    if (Array.isArray(b) && (0, l.default)(b[0]) && (0, l.default)(f))
+  function H(h, x) {
+    if (Array.isArray(h) && (0, l.default)(h[0]))
+      return h.concat(x);
+    if (Array.isArray(x) && (0, l.default)(x[0]) && (0, l.default)(h))
       return [
-        f,
-        ...b
+        h,
+        ...x
       ];
-    if (Array.isArray(b))
-      return b;
+    if (Array.isArray(x))
+      return x;
   }
-  function H({ extend: f, ...b }) {
-    return k(b, f, (x, p) => !y(x) && !p.some(y) ? k({}, x, ...p, G) : ($, d) => k({}, ...[
-      x,
+  function G({ extend: h, ...x }) {
+    return k(x, h, (_, p) => !y(_) && !p.some(y) ? k({}, _, ...p, H) : ($, f) => k({}, ...[
+      _,
       ...p
-    ].map((w) => P(w, $, d)), G));
+    ].map((w) => z(w, $, f)), H));
   }
-  function* B(f) {
-    let b = (0, n.toPath)(f);
-    if (b.length === 0 || (yield b, Array.isArray(f)))
+  function* R(h) {
+    let x = (0, i.toPath)(h);
+    if (x.length === 0 || (yield x, Array.isArray(h)))
       return;
-    let x = /^(.*?)\s*\/\s*([^/]+)$/, p = f.match(x);
+    let _ = /^(.*?)\s*\/\s*([^/]+)$/, p = h.match(_);
     if (p !== null) {
-      let [, $, d] = p, w = (0, n.toPath)($);
-      w.alpha = d, yield w;
+      let [, $, f] = p, w = (0, i.toPath)($);
+      w.alpha = f, yield w;
     }
   }
-  function N(f) {
-    const b = (x, p) => {
-      for (const $ of B(x)) {
-        let d = 0, w = f;
-        for (; w != null && d < $.length; )
-          w = w[$[d++]], w = y(w) && ($.alpha === void 0 || d <= $.length - 1) ? w(b, F) : w;
+  function N(h) {
+    const x = (_, p) => {
+      for (const $ of R(_)) {
+        let f = 0, w = h;
+        for (; w != null && f < $.length; )
+          w = w[$[f++]], w = y(w) && ($.alpha === void 0 || f <= $.length - 1) ? w(x, A) : w;
         if (w !== void 0) {
           if ($.alpha !== void 0) {
-            let A = (0, c.parseColorFormat)(w);
-            return (0, v.withAlphaValue)(A, $.alpha, (0, m.default)(A));
+            let F = (0, c.parseColorFormat)(w);
+            return (0, g.withAlphaValue)(F, $.alpha, (0, m.default)(F));
           }
           return (0, l.default)(w) ? (0, s.cloneDeep)(w) : w;
         }
       }
       return p;
     };
-    return Object.assign(b, {
-      theme: b,
-      ...F
-    }), Object.keys(f).reduce((x, p) => (x[p] = y(f[p]) ? f[p](b, F) : f[p], x), {});
+    return Object.assign(x, {
+      theme: x,
+      ...A
+    }), Object.keys(h).reduce((_, p) => (_[p] = y(h[p]) ? h[p](x, A) : h[p], _), {});
   }
-  function W(f) {
-    let b = [];
-    return f.forEach((x) => {
-      b = [
-        ...b,
-        x
+  function W(h) {
+    let x = [];
+    return h.forEach((_) => {
+      x = [
+        ...x,
+        _
       ];
       var p;
-      const $ = (p = x == null ? void 0 : x.plugins) !== null && p !== void 0 ? p : [];
-      $.length !== 0 && $.forEach((d) => {
-        d.__isOptionsFunction && (d = d());
+      const $ = (p = _ == null ? void 0 : _.plugins) !== null && p !== void 0 ? p : [];
+      $.length !== 0 && $.forEach((f) => {
+        f.__isOptionsFunction && (f = f());
         var w;
-        b = [
-          ...b,
+        x = [
+          ...x,
           ...W([
-            (w = d == null ? void 0 : d.config) !== null && w !== void 0 ? w : {}
+            (w = f == null ? void 0 : f.config) !== null && w !== void 0 ? w : {}
           ])
         ];
       });
-    }), b;
+    }), x;
   }
-  function g(f) {
+  function v(h) {
     return [
-      ...f
-    ].reduceRight((x, p) => y(p) ? p({
-      corePlugins: x
-    }) : (0, i.default)(p, x), r.default);
+      ...h
+    ].reduceRight((_, p) => y(p) ? p({
+      corePlugins: _
+    }) : (0, n.default)(p, _), r.default);
   }
-  function D(f) {
+  function D(h) {
     return [
-      ...f
-    ].reduceRight((x, p) => [
-      ...x,
+      ...h
+    ].reduceRight((_, p) => [
+      ..._,
       ...p
     ], []);
   }
-  function C(f) {
-    let b = [
-      ...W(f),
+  function C(h) {
+    let x = [
+      ...W(h),
       {
         prefix: "",
         important: !1,
         separator: ":"
       }
     ];
-    var x, p;
-    return (0, h.normalizeConfig)((0, o.defaults)({
-      theme: N(H(M(b.map(($) => (x = $ == null ? void 0 : $.theme) !== null && x !== void 0 ? x : {})))),
-      corePlugins: g(b.map(($) => $.corePlugins)),
-      plugins: D(f.map(($) => (p = $ == null ? void 0 : $.plugins) !== null && p !== void 0 ? p : []))
-    }, ...b));
+    var _, p;
+    return (0, d.normalizeConfig)((0, o.defaults)({
+      theme: N(G(M(x.map(($) => (_ = $ == null ? void 0 : $.theme) !== null && _ !== void 0 ? _ : {})))),
+      corePlugins: v(x.map(($) => $.corePlugins)),
+      plugins: D(h.map(($) => (p = $ == null ? void 0 : $.plugins) !== null && p !== void 0 ? p : []))
+    }, ...x));
   }
-})(Pe);
+})(ze);
 var Ke = {}, ft = {
   content: [],
   presets: [],
@@ -3728,15 +3728,15 @@ var Ke = {}, ft = {
       return a;
     }
   });
-  const t = /* @__PURE__ */ i(ft), r = ne;
-  function i(o) {
+  const t = /* @__PURE__ */ n(ft), r = ie;
+  function n(o) {
     return o && o.__esModule ? o : {
       default: o
     };
   }
   function a(o) {
-    var n;
-    const h = ((n = o == null ? void 0 : o.presets) !== null && n !== void 0 ? n : [
+    var i;
+    const d = ((i = o == null ? void 0 : o.presets) !== null && i !== void 0 ? i : [
       t.default
     ]).slice().reverse().flatMap((c) => a(c instanceof Function ? c() : c)), l = {
       // Add experimental configs here...
@@ -3762,7 +3762,7 @@ var Ke = {}, ft = {
     return [
       o,
       ...s,
-      ...h
+      ...d
     ];
   }
 })(Ke);
@@ -3775,21 +3775,21 @@ var Ke = {}, ft = {
       return a;
     }
   });
-  const t = /* @__PURE__ */ i(Pe), r = /* @__PURE__ */ i(Ke);
-  function i(o) {
+  const t = /* @__PURE__ */ n(ze), r = /* @__PURE__ */ n(Ke);
+  function n(o) {
     return o && o.__esModule ? o : {
       default: o
     };
   }
   function a(...o) {
-    let [, ...n] = (0, r.default)(o[0]);
+    let [, ...i] = (0, r.default)(o[0]);
     return (0, t.default)([
       ...o,
-      ...n
+      ...i
     ]);
   }
-})(ze);
-let ae = ze;
+})(Pe);
+let ae = Pe;
 var ht = (ae.__esModule ? ae : { default: ae }).default;
 const mt = /* @__PURE__ */ dt(ht);
 let oe = pe;
@@ -3805,7 +3805,7 @@ const pt = {
   700: "#770D11",
   800: "#4E090B",
   900: "#290506"
-}, R = {
+}, j = {
   onprimary: U.white,
   warning: U.amber,
   error: U.rose,
@@ -3814,27 +3814,27 @@ const pt = {
   primary: U.sky,
   brand: pt
 }, gt = {
-  ...R,
+  ...j,
   // Warning
-  warning: R.warning[500],
-  "warning-darken": R.warning[600],
-  "warning-lighten": R.warning[400],
+  warning: j.warning[500],
+  "warning-darken": j.warning[600],
+  "warning-lighten": j.warning[400],
   // Success
-  success: R.success[500],
-  "success-darken": R.success[600],
-  "success-lighten": R.success[400],
+  success: j.success[500],
+  "success-darken": j.success[600],
+  "success-lighten": j.success[400],
   // Error
-  error: R.error[500],
-  "error-darken": R.error[600],
-  "error-lighten": R.error[400],
+  error: j.error[500],
+  "error-darken": j.error[600],
+  "error-lighten": j.error[400],
   // Info
-  info: R.info[500],
-  "info-darken": R.info[600],
-  "info-lighten": R.info[400],
+  info: j.info[500],
+  "info-darken": j.info[600],
+  "info-lighten": j.info[400],
   // Primary
-  primary: R.primary[500],
-  "primary-darken": R.primary[600],
-  "primary-lighten": R.primary[400],
+  primary: j.primary[500],
+  "primary-darken": j.primary[600],
+  "primary-lighten": j.primary[400],
   // Surfaces
   onsurface: U.slate[500],
   onbackground: U.slate[700],
@@ -3946,12 +3946,12 @@ const pt = {
   T["8xl"],
   T["9xl"]
 ], cr = [
-  j.warning,
-  j.error,
-  j.info,
-  j.success,
-  j.primary,
-  j.default
+  B.warning,
+  B.error,
+  B.info,
+  B.success,
+  B.primary,
+  B.default
 ], dr = [
   "play",
   "pause",
@@ -3963,7 +3963,7 @@ const pt = {
   "canplay",
   "canplaythrough",
   "statechanged"
-], _t = X.extend({
+], _t = q.extend({
   name: "EIcon",
   props: {
     icon: {
@@ -3972,7 +3972,7 @@ const pt = {
     },
     color: {
       type: String,
-      default: j.default
+      default: B.default
     },
     size: {
       type: String,
@@ -3987,8 +3987,8 @@ const pt = {
       }), {});
     },
     iconClasses() {
-      var i, a;
-      const e = this.sizes[this.size] || this.sizes[T.sm], t = `${((a = (i = this.icon) == null ? void 0 : i.split(" ")) == null ? void 0 : a.length) > 1 ? this.icon : `fa fa-${this.icon}`}`;
+      var n, a;
+      const e = this.sizes[this.size] || this.sizes[T.sm], t = `${((a = (n = this.icon) == null ? void 0 : n.split(" ")) == null ? void 0 : a.length) > 1 ? this.icon : `fa fa-${this.icon}`}`;
       return [
         "e-inline-flex e-items-center e-justify-center e-rounded-full",
         this.color,
@@ -4011,7 +4011,7 @@ var wt = function() {
   null,
   null
 );
-const Tt = St.exports, Et = X.extend({
+const Tt = St.exports, Et = q.extend({
   name: "ESpinner",
   props: {
     dark: {
@@ -4089,7 +4089,7 @@ var $t = function() {
   null,
   null
 );
-const Qe = kt.exports, Ot = X.extend({
+const Qe = kt.exports, Ot = q.extend({
   props: {
     align: {
       type: String,
@@ -4149,20 +4149,20 @@ const Qe = kt.exports, Ot = X.extend({
     }
   }
 });
-var Ft = function() {
+var At = function() {
   var t = this, r = t._self._c;
   return t._self._setupProxy, r("div", { staticClass: "e-row e-flex e-flex-wrap", class: t.rowClasses }, [t._t("default")], 2);
-}, At = [], Mt = /* @__PURE__ */ I(
+}, Ft = [], Mt = /* @__PURE__ */ I(
   Ot,
-  Ft,
   At,
+  Ft,
   !1,
   null,
   null,
   null,
   null
 );
-const zt = Mt.exports, Pt = X.extend({
+const Pt = Mt.exports, zt = q.extend({
   props: {
     alignSelf: {
       type: String,
@@ -4269,22 +4269,22 @@ const zt = Mt.exports, Pt = X.extend({
 var Lt = function() {
   var t = this, r = t._self._c;
   return r("div", { staticClass: "e-col", class: t.colClasses }, [t._t("default")], 2);
-}, Gt = [], Ht = /* @__PURE__ */ I(
-  Pt,
+}, Ht = [], Gt = /* @__PURE__ */ I(
+  zt,
   Lt,
-  Gt,
+  Ht,
   !1,
   null,
   null,
   null,
   null
 );
-const jt = Ht.exports;
+const Bt = Gt.exports;
 function et() {
   const e = document;
   return !!(e.fullscreenElement || e.mozFullScreenElement || e.webkitFullscreenElement || e.msFullscreenElement);
 }
-function Rt(e) {
+function jt(e) {
   if (et())
     return new Promise((r) => r(null));
   const t = e;
@@ -4297,7 +4297,7 @@ function Rt(e) {
   if (t.msRequestFullscreen)
     return t == null ? void 0 : t.msRequestFullscreen();
 }
-function Bt() {
+function Rt() {
   if (!et())
     return new Promise((t) => t(null));
   const e = document;
@@ -4312,10 +4312,10 @@ function Bt() {
 }
 function Wt(e, t) {
   let r = null;
-  return function(...i) {
+  return function(...n) {
     const a = this;
     r !== null && clearTimeout(r), r = setTimeout(() => {
-      r = null, e.apply(a, i);
+      r = null, e.apply(a, n);
     }, t || 1e3);
   };
 }
@@ -4333,12 +4333,12 @@ const le = new Intl.NumberFormat(void 0, {
   "canplaythrough",
   "statechanged",
   "error"
-], J = (e) => {
-  const t = Math.floor(e % 60), r = Math.floor(e / 60) % 60, i = Math.floor(e / 3600);
-  return i === 0 ? `${r}:${le.format(t)}` : `${i}:${le.format(
+], ee = (e) => {
+  const t = Math.floor(e % 60), r = Math.floor(e / 60) % 60, n = Math.floor(e / 3600);
+  return n === 0 ? `${r}:${le.format(t)}` : `${n}:${le.format(
     r
   )}:${le.format(t)}`;
-}, Ut = X.extend({
+}, Ut = q.extend({
   name: "VideoPlayer",
   components: {
     ESpinner: Qe
@@ -4410,11 +4410,11 @@ const le = new Intl.NumberFormat(void 0, {
       const t = this.$refs.player, r = this.$refs.timelineContainer;
       t.addEventListener(
         e,
-        (i) => {
-          e === "loadeddata" && (this.videoLength = J(t.duration)), e === "timeupdate" && (this.percentagePlayed = t.currentTime / t.duration * 100, r.style.setProperty(
+        (n) => {
+          e === "loadeddata" && (this.videoLength = ee(t.duration)), e === "timeupdate" && (this.percentagePlayed = t.currentTime / t.duration * 100, r.style.setProperty(
             "--progress-position",
             this.percentagePlayed.toString()
-          )), this.$emit(e, { event: i, player: this });
+          )), this.$emit(e, { event: n, player: this });
         },
         !0
       );
@@ -4423,11 +4423,11 @@ const le = new Intl.NumberFormat(void 0, {
       const t = this.$refs.player, r = this.$refs.timelineContainer;
       t.addEventListener(
         e,
-        (i) => {
-          e === "loadeddata" && (this.videoLength = J(t.duration)), e === "timeupdate" && (this.percentagePlayed = t.currentTime / t.duration * 100, r.style.setProperty(
+        (n) => {
+          e === "loadeddata" && (this.videoLength = ee(t.duration)), e === "timeupdate" && (this.percentagePlayed = t.currentTime / t.duration * 100, r.style.setProperty(
             "--progress-position",
             this.percentagePlayed.toString()
-          )), this.$emit(e, { event: i, player: this });
+          )), this.$emit(e, { event: n, player: this });
         },
         !0
       );
@@ -4511,13 +4511,13 @@ const le = new Intl.NumberFormat(void 0, {
       return [parseInt(e / 60 % 60, 10), parseInt(e % 60, 10)].join(":").replace(/\b(\d)\b/g, "0$1");
     },
     closeFullscreenMode() {
-      document.fullscreenElement && (Bt().then(() => {
+      document.fullscreenElement && (Rt().then(() => {
         this.isFullscreen = !1, console.log("Exited fullscreen");
       }), this.isFullscreen = !1);
     },
     openFullscreenMode() {
       const e = this.$refs.videoContainer;
-      e && (Rt(e).then(() => {
+      e && (jt(e).then(() => {
         this.isFullscreen = !0;
       }), this.isFullscreen = !0);
     },
@@ -4526,13 +4526,13 @@ const le = new Intl.NumberFormat(void 0, {
     },
     getDuration() {
       const e = this.$refs.player;
-      this.videoLength = J(e.duration), this.videoDuration = e.duration;
+      this.videoLength = ee(e.duration), this.videoDuration = e.duration;
     },
     handleTimeUpdate() {
       const e = this.$refs.player, t = this.$refs.timelineContainer;
       if (!e || !t)
         return;
-      this.currentTime = J(e.currentTime), this.realtime = e.currentTime;
+      this.currentTime = ee(e.currentTime), this.realtime = e.currentTime;
       const r = Number(this.realtime) / Number(this.videoDuration);
       t.style.setProperty(
         "--progress-position",
@@ -4543,7 +4543,7 @@ const le = new Intl.NumberFormat(void 0, {
       const t = this.$refs.player;
       if (!document.body.contains(t))
         return;
-      const r = this.$refs.timelineContainer, i = r.getBoundingClientRect(), a = Math.min(Math.max(0, e.x - i.x), i.width) / i.width;
+      const r = this.$refs.timelineContainer, n = r.getBoundingClientRect(), a = Math.min(Math.max(0, e.x - n.x), n.width) / n.width;
       r.style.setProperty(
         "--preview-position",
         a.toString()
@@ -4557,18 +4557,18 @@ const le = new Intl.NumberFormat(void 0, {
       t.currentTime += e;
     },
     async toggleScrubbing(e) {
-      const t = this.$refs.timelineContainer, r = this.$refs.videoContainer, i = this.$refs.player;
-      if (!i)
+      const t = this.$refs.timelineContainer, r = this.$refs.videoContainer, n = this.$refs.player;
+      if (!n)
         return;
       const a = t.getBoundingClientRect(), o = Math.min(Math.max(0, e.x - a.x), a.width) / a.width;
       if (this.isScrubbing = (e.buttons & 1) === 1, r.classList.toggle("scrubbing", this.isScrubbing), this.isScrubbing) {
-        this.wasPaused = i.paused, await i.pause(), this.handleTimelineUpdate(e);
+        this.wasPaused = n.paused, await n.pause(), this.handleTimelineUpdate(e);
         return;
       }
-      if (this.realtime = o * this.videoDuration, i.currentTime = o * this.videoDuration, this.wasPaused)
+      if (this.realtime = o * this.videoDuration, n.currentTime = o * this.videoDuration, this.wasPaused)
         return;
-      const n = i.play();
-      n !== void 0 && n.then(() => this.handleTimelineUpdate(e)).catch(console.error);
+      const i = n.play();
+      i !== void 0 && i.then(() => this.handleTimelineUpdate(e)).catch(console.error);
     },
     handleKeyDown(e) {
       var r;
@@ -4595,8 +4595,8 @@ const le = new Intl.NumberFormat(void 0, {
 });
 var Nt = function() {
   var t = this, r = t._self._c;
-  return r("div", { ref: "videoContainer", staticClass: "video-container paused", attrs: { "data-volume-level": "high" } }, [r("video", t._g(t._b({ ref: "player", attrs: { controls: !1, preload: "auto" }, on: { ended: t.handleEnded, click: t.togglePlay, loadedmetadata: t.getDuration, timeupdate: t.handleTimeUpdate, loadeddata: t.handleLoading } }, "video", t.videoOptions, !1), t.videoListeners), t._l(t.sourceItems, function(i) {
-    return r("source", t._g({ key: i.src, attrs: { src: i.src, type: i.type }, on: { error: t.handle404Error } }, t.videoListeners));
+  return r("div", { ref: "videoContainer", staticClass: "video-container paused", attrs: { "data-volume-level": "high" } }, [r("video", t._g(t._b({ ref: "player", attrs: { controls: !1, preload: "auto" }, on: { ended: t.handleEnded, click: t.togglePlay, loadedmetadata: t.getDuration, timeupdate: t.handleTimeUpdate, loadeddata: t.handleLoading } }, "video", t.videoOptions, !1), t.videoListeners), t._l(t.sourceItems, function(n) {
+    return r("source", t._g({ key: n.src, attrs: { src: n.src, type: n.type }, on: { error: t.handle404Error } }, t.videoListeners));
   }), 0), t.isLoading ? r("div", { staticClass: "spinner-container" }, [r("ESpinner", { attrs: { size: "9xl", opacity: "0.6", dark: !0 } })], 1) : t._e(), t.isError ? r("div", { staticClass: "spinner-container e-gap-3" }, [r("i", { staticClass: "fa-solid fa-video-slash fa-2xl e-align-middle" }), r("span", [t._v("This video file cannot be played.")])]) : t._e(), r("div", { class: ["video-controls-container", t.withControls] }, [r("div", { staticClass: "controls" }, [r("button", { ref: "playPauseBtn", staticClass: "play-pause-btn fa-lg fa-solid", class: {
     "fa-play": !t.playing,
     "fa-pause": t.playing
@@ -4617,33 +4617,33 @@ var Nt = function() {
   null,
   null
 );
-const qt = Vt.exports, re = (e) => {
-  const t = u.utcFormat("%_d")(e), i = {
+const Xt = Vt.exports, re = (e) => {
+  const t = u.utcFormat("%_d")(e), n = {
     1: "st",
     2: "nd",
     3: "rd"
   }[t.charAt(1)] || "th";
-  return `${t}${i}`;
+  return `${t}${n}`;
 }, _e = (e) => new Date(
   Date.UTC(e.getUTCFullYear(), e.getUTCMonth(), e.getUTCDate() + 1)
-).getUTCDate() === 1 ? "" : u.utcFormat("%-d")(e), Y = (e) => ["0", " 0", "00"].includes(u.utcFormat("%H")(e)) ? "" : `${u.utcFormat("%H")(e)}h`, q = (e) => {
+).getUTCDate() === 1 ? "" : u.utcFormat("%-d")(e), K = (e) => ["0", " 0", "00"].includes(u.utcFormat("%H")(e)) ? "" : `${u.utcFormat("%H")(e)}h`, X = (e) => {
   const t = u.utcFormat("%H:%M")(e);
   return t === "00:00" ? "" : t;
 }, ue = (e) => u.utcFormat("%M:%S")(e), we = (e) => `${u.utcFormat("%Hh%Mm")(e)}`, he = (e) => {
-  const t = q(e), r = re(e), i = u.utcFormat("%B")(e);
-  return t || `${i} ${r}`;
+  const t = X(e), r = re(e), n = u.utcFormat("%B")(e);
+  return t || `${n} ${r}`;
 }, ce = (e) => {
-  const t = q(e), r = Number.parseInt(u.utcFormat("%H")(e)), i = re(e), a = u.utcFormat("%B")(e);
-  return t && r % 6 === 0 ? `${a} ${i} ${t}` : he(e);
-}, Z = (e) => (t) => {
+  const t = X(e), r = Number.parseInt(u.utcFormat("%H")(e)), n = re(e), a = u.utcFormat("%B")(e);
+  return t && r % 6 === 0 ? `${a} ${n} ${t}` : he(e);
+}, J = (e) => (t) => {
   const r = u.utcFormat("%H")(t);
   return !(u.utcFormat("%M")(t) === "00" && Number.parseInt(r) % e === 0);
 }, de = (e) => (t) => {
   const r = u.utcFormat("%M")(t);
   return Number.parseInt(r) % e !== 0;
 }, Ce = (e) => (t) => {
-  const r = u.utcFormat("%M")(t), i = u.utcFormat("%S")(t);
-  return Number.parseInt(r) % e !== 0 && Number.parseInt(i) === 0;
+  const r = u.utcFormat("%M")(t), n = u.utcFormat("%S")(t);
+  return Number.parseInt(r) % e !== 0 && Number.parseInt(n) === 0;
 }, S = {
   _10_seconds: 25e-6,
   _20_seconds: 1e-4,
@@ -4666,9 +4666,9 @@ const qt = Vt.exports, re = (e) => {
   _3_months: 33,
   infinity: 1 / 0
 };
-var Te, Ee, $e, De, ke, Oe, Fe, Ae;
-const Xt = {
-  [ee.overview]: [
+var Te, Ee, $e, De, ke, Oe, Ae, Fe;
+const qt = {
+  [te.overview]: [
     {
       precision: S._30_seconds,
       interval: u.utcMinute.every(2),
@@ -4703,8 +4703,8 @@ const Xt = {
       precision: S._2_hours,
       interval: u.utcHour.every(6),
       format: (e) => {
-        const t = q(e), r = re(e), i = u.utcFormat("%B")(e);
-        return t || `${i} ${r}`;
+        const t = X(e), r = re(e), n = u.utcFormat("%B")(e);
+        return t || `${n} ${r}`;
       }
     },
     {
@@ -4734,7 +4734,7 @@ const Xt = {
       format: "%Y"
     }
   ],
-  [ee.detailed]: [
+  [te.detailed]: [
     {
       precision: S._10_seconds,
       interval: u.utcSecond.every(10),
@@ -4753,52 +4753,52 @@ const Xt = {
     {
       precision: S._1_minute,
       interval: u.utcMinute.filter(de(5)),
-      format: q
+      format: X
     },
     {
       precision: S._2_minutes,
       interval: ($e = u.utcMinute.every(2)) == null ? void 0 : $e.filter(de(10)),
-      format: q
+      format: X
     },
     {
       precision: S._5_minutes,
       interval: (De = u.utcMinute.every(5)) == null ? void 0 : De.filter(de(20)),
-      format: q
+      format: X
     },
     {
       precision: S._15_minutes,
-      interval: (ke = u.utcMinute.every(15)) == null ? void 0 : ke.filter(Z(1)),
-      format: q
+      interval: (ke = u.utcMinute.every(15)) == null ? void 0 : ke.filter(J(1)),
+      format: X
     },
     {
       precision: S._30_minutes,
-      interval: (Oe = u.utcMinute.every(30)) == null ? void 0 : Oe.filter(Z(2)),
-      format: q
+      interval: (Oe = u.utcMinute.every(30)) == null ? void 0 : Oe.filter(J(2)),
+      format: X
     },
     {
       precision: S._1_hour,
-      interval: u.utcHour.filter(Z(6)),
-      format: Y
+      interval: u.utcHour.filter(J(6)),
+      format: K
     },
     {
       precision: S._2_hours,
-      interval: (Fe = u.utcHour.every(2)) == null ? void 0 : Fe.filter(Z(6)),
-      format: Y
+      interval: (Ae = u.utcHour.every(2)) == null ? void 0 : Ae.filter(J(6)),
+      format: K
     },
     {
       precision: S._3_hours,
-      interval: (Ae = u.utcHour.every(3)) == null ? void 0 : Ae.filter(Z(12)),
-      format: Y
+      interval: (Fe = u.utcHour.every(3)) == null ? void 0 : Fe.filter(J(12)),
+      format: K
     },
     {
       precision: S._4_hours,
       interval: u.utcHour.every(4),
-      format: Y
+      format: K
     },
     {
       precision: S._6_hours,
       interval: u.utcHour.every(6),
-      format: Y
+      format: K
     },
     {
       precision: S._1_day,
@@ -4836,7 +4836,7 @@ const Xt = {
       format: ""
     }
   ],
-  [ee.detailedBackground]: [
+  [te.detailedBackground]: [
     {
       precision: S._10_seconds,
       interval: u.utcSecond,
@@ -4919,8 +4919,8 @@ const Xt = {
           e.getUTCFullYear(),
           e.getUTCMonth() + 1,
           0
-        ).getUTCDate(), i = Math.ceil(r / 5);
-        return t === i || t === 2 * i || t === 3 * i || t === 4 * i;
+        ).getUTCDate(), n = Math.ceil(r / 5);
+        return t === n || t === 2 * n || t === 3 * n || t === 4 * n;
       }),
       format: ""
     },
@@ -4931,8 +4931,8 @@ const Xt = {
           e.getUTCFullYear(),
           e.getUTCMonth() + 1,
           0
-        ).getUTCDate(), i = Math.ceil(r / 4);
-        return t === i || t === 2 * i || t === 3 * i;
+        ).getUTCDate(), n = Math.ceil(r / 4);
+        return t === n || t === 2 * n || t === 3 * n;
       }),
       format: ""
     },
@@ -4943,8 +4943,8 @@ const Xt = {
           e.getUTCFullYear(),
           e.getUTCMonth() + 1,
           0
-        ).getUTCDate(), i = Math.ceil(r / 2);
-        return t === i;
+        ).getUTCDate(), n = Math.ceil(r / 2);
+        return t === n;
       }),
       format: ""
     },
@@ -4966,12 +4966,12 @@ const Xt = {
       console.error("Invalid callback function provided to v-resize-observer");
       return;
     }
-    const i = new ResizeObserver(
+    const n = new ResizeObserver(
       (a) => {
         a[0] && r(a[0]);
       }
     );
-    i.observe(e), e.__resizeObserver__ = i;
+    n.observe(e), e.__resizeObserver__ = n;
   },
   unbind(e) {
     e.__resizeObserver__ && (e.__resizeObserver__.disconnect(), delete e.__resizeObserver__);
@@ -4981,10 +4981,12 @@ const Xt = {
     name: "resize-observer",
     definition: tt
   }
-], _ = {
+], b = {
   eventGroup: "event-group",
   eventGroupBg: "event-group-bg",
   eventRect: "event-rect",
+  eventBar: "event-bar",
+  eventBarCap: "event-bar-cap",
   eventRectText: "event-rect-text",
   labelBg: "label-bg",
   labelBgFill: "label-bg-fill",
@@ -4992,15 +4994,17 @@ const Xt = {
   loadingIndicator: "loading-indicator",
   xAxis: "x-axis",
   selectedTimestampCursor: "selected-timestamp-cursor",
+  barChartGroup: "bar-chart-group",
   lineGraphGroup: "line-graph-group",
   lineGraphPath: "line-graph-path",
   lineGraphHoverZone: "line-graph-hover-zone",
   lineGraphDot: "line-graph-dot",
   curtain: "curtain"
-}, Q = {
-  areaGradient: "area-gradient",
+}, Y = {
+  transparencyGradient: "transparency-gradient",
+  transparencyGradientLight: "transparency-gradient-light",
   loadingGradient: "loading-gradient"
-}, Zt = X.extend({
+}, Zt = q.extend({
   name: "ETimeline",
   directives: {
     resizeObserver: tt
@@ -5012,7 +5016,7 @@ const Xt = {
     },
     xAxesConfig: {
       type: Object,
-      default: () => Xt
+      default: () => qt
     },
     dark: {
       type: Boolean,
@@ -5066,7 +5070,11 @@ const Xt = {
       type: Number,
       default: 0
     },
-    lineGraphMinHeight: {
+    barXPadding: {
+      type: Number,
+      default: 0
+    },
+    chartMinHeight: {
       type: Number,
       default: 60
     },
@@ -5143,31 +5151,37 @@ const Xt = {
     },
     lineGraphGroups() {
       return Object.entries(this.filteredEventsGroups).reduce(
-        (e, [t, r]) => r.chartType === te.lineGraph ? { ...e, [t]: r } : e,
+        (e, [t, r]) => r.chartType === Z.lineGraph ? { ...e, [t]: r } : e,
         {}
       );
     },
-    lineGraphChartHeight() {
+    chartHeight() {
       if (!this.showLabels)
-        return this.lineGraphMinHeight;
-      const e = Object.keys(this.lineGraphGroups).length * this.barChartHeight;
-      return Math.max(this.lineGraphMinHeight, e);
+        return this.chartMinHeight;
+      const t = (Object.keys(this.lineGraphGroups).length + Object.keys(this.barChartGroups).length) * this.barChartHeight;
+      return Math.max(this.chartMinHeight, t);
     },
     barGroups() {
       return Object.entries(this.filteredEventsGroups).reduce(
-        (e, [t, r]) => r.chartType !== te.lineGraph ? { ...e, [t]: r } : e,
+        (e, [t, r]) => !r.chartType || r.chartType === Z.bars ? { ...e, [t]: r } : e,
         {}
       );
     },
-    hasLineGraphChart() {
-      return Object.keys(this.lineGraphGroups).length > 0;
+    barChartGroups() {
+      return Object.entries(this.filteredEventsGroups).reduce(
+        (e, [t, r]) => r.chartType === Z.barChart ? { ...e, [t]: r } : e,
+        {}
+      );
+    },
+    hasChart() {
+      return Object.keys(this.lineGraphGroups).length + Object.keys(this.barChartGroups).length > 0;
     },
     labelRectWidth() {
       return Object.values(
         this.eventsGroups
-      ).reduce((r, i) => {
+      ).reduce((r, n) => {
         var a;
-        return Math.max(r, (a = i.label) == null ? void 0 : a.length);
+        return Math.max(r, (a = n.label) == null ? void 0 : a.length);
       }, 0) * this.characterWidth + 2 * this.textPadding;
     },
     combinedXAxesHeight() {
@@ -5175,7 +5189,7 @@ const Xt = {
       return this.axisHeight * e;
     },
     timelineHeight() {
-      const e = Object.keys(this.barGroups).length, t = this.hasLineGraphChart ? this.lineGraphChartHeight : 0, r = this.barChartHeight * e;
+      const e = Object.keys(this.barGroups).length, t = this.hasChart ? this.chartHeight : 0, r = this.barChartHeight * e;
       return this.combinedXAxesHeight + t + r;
     },
     filteredEventsGroups() {
@@ -5285,11 +5299,24 @@ const Xt = {
       const e = this.svg.append("defs");
       Object.entries(this.filteredEventsGroups).forEach(
         ([t, r]) => {
-          const { color: i, chartType: a } = r, o = e.append("linearGradient").attr("id", `${Q.loadingGradient}-${t}`).attr("x1", "0%").attr("y1", "0%").attr("x2", "100%").attr("y2", "0%");
-          if (o.append("stop").attr("offset", "0%").attr("stop-color", i).attr("stop-opacity", "0"), o.append("stop").attr("offset", "50%").attr("stop-color", i).attr("stop-opacity", "0.6"), o.append("stop").attr("offset", "100%").attr("stop-color", i).attr("stop-opacity", "0"), a === te.lineGraph) {
-            const n = e.append("linearGradient").attr("id", `${Q.areaGradient}-${t}`).attr("x1", "0%").attr("x2", "0%").attr("y1", "0%").attr("y2", "100%");
-            n.append("stop").attr("offset", "0%").style("stop-color", i).style("stop-opacity", 0.3), n.append("stop").attr("offset", "38%").style("stop-color", i).style("stop-opacity", 0);
-          }
+          const { color: n, chartType: a } = r, o = e.append("linearGradient").attr("id", `${Y.loadingGradient}-${t}`).attr("x1", "0%").attr("y1", "0%").attr("x2", "100%").attr("y2", "0%");
+          o.append("stop").attr("offset", "0%").attr("stop-color", n).attr("stop-opacity", "0"), o.append("stop").attr("offset", "50%").attr("stop-color", n).attr("stop-opacity", "0.6"), o.append("stop").attr("offset", "100%").attr("stop-color", n).attr("stop-opacity", "0"), [Z.lineGraph, Z.barChart].includes(
+            a
+          ) && [
+            {
+              id: Y.transparencyGradientLight,
+              stop: 38,
+              opacity: 0.3
+            },
+            {
+              id: Y.transparencyGradient,
+              stop: 130,
+              opacity: 0.4
+            }
+          ].forEach(({ id: d, stop: l, opacity: s }) => {
+            const c = e.append("linearGradient").attr("id", `${d}-${t}`).attr("x1", "0%").attr("x2", "0%").attr("y1", "0%").attr("y2", "100%");
+            c.append("stop").attr("offset", "0%").style("stop-color", n).style("stop-opacity", s), c.append("stop").attr("offset", `${l}%`).style("stop-color", n).style("stop-opacity", 0);
+          });
         }
       );
     },
@@ -5298,27 +5325,30 @@ const Xt = {
       this.utcOffset = V.parseZone(e).utcOffset();
     },
     initTimeScale(e, t) {
-      const r = e || this.startDate || this.oldestEvent.timestamp || this.oldestEvent.startDate, i = t || this.endDate || this.latestEvent.timestamp || this.latestEvent.endDate;
-      this.timeScale = u.scaleTime().domain([this.tzStringToDate(r), this.tzStringToDate(i)]).range([0, this.timeline.offsetWidth]), this.initialTimeScale = this.timeScale.copy(), this.updateCurrentTimeScaleDensity();
+      const r = e || this.startDate || this.oldestEvent.timestamp || this.oldestEvent.startDate, n = t || this.endDate || this.latestEvent.timestamp || this.latestEvent.endDate;
+      this.timeScale = u.scaleTime().domain([this.tzStringToDate(r), this.tzStringToDate(n)]).range([0, this.timeline.offsetWidth]), this.initialTimeScale = this.timeScale.copy(), this.updateCurrentTimeScaleDensity();
     },
     initXAxes() {
       let e = 0;
       const t = 5;
       for (const r in this.xAxesConfig) {
-        const i = this.createAxis(r);
-        this.xAxes[r] = i, this.svg.append("g").classed(_.xAxis, !0).classed(`${_.xAxis}-${r}`, !0).attr("transform", `translate(0, ${e || t})`).call(i), this.translateTicksText(r), e += this.axisHeight;
+        const n = this.createAxis(r);
+        this.xAxes[r] = n, this.svg.append("g").classed(b.xAxis, !0).classed(`${b.xAxis}-${r}`, !0).attr("transform", `translate(0, ${e || t})`).call(n), this.translateTicksText(r), e += this.axisHeight;
       }
     },
     initYScale() {
-      this.yScale = u.scaleLinear().range([this.lineGraphChartHeight, 0]);
-      const e = Object.values(this.lineGraphGroups).map((r) => r.events).flat(), t = u.max(e, (r) => r.count);
+      this.yScale = u.scaleLinear().range([this.chartHeight, 0]);
+      const e = [
+        ...Object.values(this.lineGraphGroups),
+        ...Object.values(this.barChartGroups)
+      ].map((r) => r.events).flat(), t = u.max(e, (r) => r.count);
       this.yScale.domain([0, t]);
     },
     initZoomBehavior() {
       this.disableZoom || (this.zoomBehavior = u.zoom().on("zoom", this.handleZoom).scaleExtent([this.minZoom, this.maxZoom]), this.svg.call(this.zoomBehavior));
     },
     initSelectedTimestampCursor() {
-      this.svg.append("line").attr("class", _.selectedTimestampCursor).style("stroke", "red").style("stroke-width", "1px").style("opacity", 0).attr("x1", 0).attr("x2", 0).attr("y1", 0).attr("y2", this.timelineHeight), this.repositionSelectedTimestampCursor();
+      this.svg.append("line").attr("class", b.selectedTimestampCursor).style("stroke", "red").style("stroke-width", "1px").style("opacity", 0).attr("x1", 0).attr("x2", 0).attr("y1", 0).attr("y2", this.timelineHeight), this.repositionSelectedTimestampCursor();
     },
     updateAndRedrawTimeline() {
       const { startDate: e, endDate: t } = this.getCurrentTimeBounds();
@@ -5328,7 +5358,7 @@ const Xt = {
       this.svg && this.svg.remove(), this.countsByTimestamp = {};
     },
     repositionSelectedTimestampCursor() {
-      const e = this.svg.select(`.${_.selectedTimestampCursor}`);
+      const e = this.svg.select(`.${b.selectedTimestampCursor}`);
       if (!this.selectedTimestamp) {
         e.style("opacity", 0);
         return;
@@ -5348,9 +5378,9 @@ const Xt = {
       if (this.visibleFrom && this.visibleFrom.getTime() === t.getTime() && this.visibleTo && this.visibleTo.getTime() === r.getTime())
         return;
       this.visibleFrom = t, this.visibleTo = r;
-      const i = this.dateToTzString(this.visibleFrom), a = this.dateToTzString(this.visibleTo);
+      const n = this.dateToTzString(this.visibleFrom), a = this.dateToTzString(this.visibleTo);
       this.$emit("visible-interval-change", {
-        fromDate: i,
+        fromDate: n,
         toDate: a,
         trigger: e,
         transform: this.transformDiff
@@ -5379,12 +5409,12 @@ const Xt = {
       if (!this.showLabels)
         return;
       const e = this;
-      this.svg.selectAll(`.${_.labelBg}`).each(function() {
+      this.svg.selectAll(`.${b.labelBg}`).each(function() {
         u.select(this).style("fill", e.dark ? "black" : "white");
-      }), this.svg.selectAll(`.${_.labelBgFill}`).each(function() {
+      }), this.svg.selectAll(`.${b.labelBgFill}`).each(function() {
         const t = u.select(this), r = t.node().dataset.color;
         t.style("fill", e.getLabelBackgroundColor(r)).style("stroke", e.getTextFillColor(r)).style("stroke-width", 0.25);
-      }), this.svg.selectAll(`.${_.labelText}`).each(function() {
+      }), this.svg.selectAll(`.${b.labelText}`).each(function() {
         const t = u.select(this), r = t.node().dataset.color;
         t.style("fill", e.getTextFillColor(r));
       });
@@ -5409,8 +5439,8 @@ const Xt = {
       }, this.repositionSelectedTimestampCursor());
     },
     handleClick(e) {
-      const t = e.offsetX, r = this.timeScale.invert(t), i = this.dateToTzString(r);
-      this.$emit("date-clicked", i), this.isHoveringEvent && this.$emit("event-clicked", {
+      const t = e.offsetX, r = this.timeScale.invert(t), n = this.dateToTzString(r);
+      this.$emit("date-clicked", n), this.isHoveringEvent && this.$emit("event-clicked", {
         event: this.hoveredEvent,
         type: this.hoveredEventType
       });
@@ -5418,9 +5448,9 @@ const Xt = {
     handleLineMouseOver(e, t, r) {
       this.hoveredCounts = Object.entries(
         this.countsByTimestamp[`${t.timestamp}`]
-      ).reduce((i, a) => {
-        const [o, n] = a;
-        return [...i, { type: o, count: n }];
+      ).reduce((n, a) => {
+        const [o, i] = a;
+        return [...n, { type: o, count: i }];
       }, []), this.hoveredEvent = t, this.isHoveringEvent = !0, this.$emit("event-mouseover", {
         eventData: t,
         eventType: r,
@@ -5437,20 +5467,20 @@ const Xt = {
       this.isHoveringEvent = !1, this.hoveredEvent = null, this.$emit("event-mouseout");
     },
     handleLabelMouseOver(e) {
-      u.selectAll(`.${_.lineGraphGroup}-${e}`).classed(
-        `${_.lineGraphGroup}--highlighted`,
+      u.selectAll(`.${b.lineGraphGroup}-${e}`).classed(
+        `${b.lineGraphGroup}--highlighted`,
         !0
-      ), u.selectAll(`.${_.lineGraphGroup}-label`).classed(
-        `${_.lineGraphGroup}-label--highlighted`,
+      ), u.selectAll(`.${b.lineGraphGroup}-label`).classed(
+        `${b.lineGraphGroup}-label--highlighted`,
         !0
       );
     },
     handleLabelMouseLeave(e) {
-      u.selectAll(`.${_.lineGraphGroup}-${e}`).classed(
-        `${_.lineGraphGroup}--highlighted`,
+      u.selectAll(`.${b.lineGraphGroup}-${e}`).classed(
+        `${b.lineGraphGroup}--highlighted`,
         !1
-      ), u.selectAll(`.${_.lineGraphGroup}-label`).classed(
-        `${_.lineGraphGroup}-label--highlighted`,
+      ), u.selectAll(`.${b.lineGraphGroup}-label`).classed(
+        `${b.lineGraphGroup}-label--highlighted`,
         !1
       );
     },
@@ -5462,9 +5492,9 @@ const Xt = {
         scale: r,
         translation: e.transform.x - this.lastTransform.x
       }, this.lastTransform = { ...e.transform };
-      for (const i in this.xAxes)
-        this.rescaleAxis(i, t), this.translateTicksText(i);
-      this.updateBarCharts(), this.updateLineGraphs(), this.updateLineGraphHoverZones(), this.repositionSelectedTimestampCursor(), this.emitVisibleInterval(fe.zoom), this.emitCurtainChange();
+      for (const n in this.xAxes)
+        this.rescaleAxis(n, t), this.translateTicksText(n);
+      this.updateEventsBars(), this.updateLineGraphs(), this.updateBarChart(), this.updateLineGraphHoverZones(), this.repositionSelectedTimestampCursor(), this.emitVisibleInterval(fe.zoom), this.emitCurtainChange();
     },
     emitCurtainChange() {
       const { startDate: e, endDate: t } = this.calculateDateRangeFromCurtains();
@@ -5474,12 +5504,12 @@ const Xt = {
       });
     },
     calculateDateRangeFromCurtains() {
-      const e = this.timeline.offsetWidth, t = this.timeScale.domain(), r = t[1].getTime() - t[0].getTime(), i = (this.leftCurtainWidth - this.curtainHandleWidth * 2) / e * r, a = (this.rightCurtainWidth + this.curtainHandleWidth * 2) / e * r, o = new Date(t[0].getTime() + i), n = new Date(t[1].getTime() - a);
-      return { startDate: o, endDate: n };
+      const e = this.timeline.offsetWidth, t = this.timeScale.domain(), r = t[1].getTime() - t[0].getTime(), n = (this.leftCurtainWidth - this.curtainHandleWidth * 2) / e * r, a = (this.rightCurtainWidth + this.curtainHandleWidth * 2) / e * r, o = new Date(t[0].getTime() + n), i = new Date(t[1].getTime() - a);
+      return { startDate: o, endDate: i };
     },
     updateCurtainsOnResize(e) {
-      const { startDate: t, endDate: r } = this.calculateDateRangeFromCurtains(), i = this.timeScale.domain(), a = i[1].getTime() - i[0].getTime(), o = t.getTime() - i[0].getTime(), n = i[1].getTime() - r.getTime();
-      this.leftCurtainWidth = o / a * e, this.rightCurtainWidth = n / a * e, this.svg.select(`.${_.curtain}--left`).attr("width", this.leftCurtainWidth), this.svg.select(`.${_.curtain}--right`).attr(
+      const { startDate: t, endDate: r } = this.calculateDateRangeFromCurtains(), n = this.timeScale.domain(), a = n[1].getTime() - n[0].getTime(), o = t.getTime() - n[0].getTime(), i = n[1].getTime() - r.getTime();
+      this.leftCurtainWidth = o / a * e, this.rightCurtainWidth = i / a * e, this.svg.select(`.${b.curtain}--left`).attr("width", this.leftCurtainWidth), this.svg.select(`.${b.curtain}--right`).attr(
         "x",
         e - this.rightCurtainWidth + this.curtainHandleWidth * 2
       ).attr("width", this.rightCurtainWidth);
@@ -5496,46 +5526,50 @@ const Xt = {
         e.x,
         this.timeline.offsetWidth - this.rightCurtainWidth
       );
-      this.leftCurtainWidth = Math.max(0, t), this.svg.select(`.${_.curtain}--left`).attr("width", this.leftCurtainWidth), this.emitCurtainChange();
+      this.leftCurtainWidth = Math.max(0, t), this.svg.select(`.${b.curtain}--left`).attr("width", this.leftCurtainWidth), this.emitCurtainChange();
     },
     handleRightDrag(e) {
       e.sourceEvent.stopPropagation();
       const t = this.timeline.offsetWidth, r = Math.min(
         this.timeline.offsetWidth - e.x,
         this.timeline.offsetWidth - this.leftCurtainWidth
-      ), i = t - r;
-      this.rightCurtainWidth = Math.max(0, r), this.svg.select(`.${_.curtain}--right`).attr("width", this.rightCurtainWidth).attr("x", i), this.emitCurtainChange();
+      ), n = t - r;
+      this.rightCurtainWidth = Math.max(0, r), this.svg.select(`.${b.curtain}--right`).attr("width", this.rightCurtainWidth).attr("x", n), this.emitCurtainChange();
     },
     zoomToStartAndEndDates() {
-      const e = this.startDate || this.oldestEvent.timestamp || this.oldestEvent.startDate, t = this.endDate || this.latestEvent.timestamp || this.latestEvent.endDate, r = this.tzStringToDate(e), i = this.tzStringToDate(t), a = this.timeline.offsetWidth, o = [r, i], n = [0, a];
-      this.timeScale = u.scaleTime().domain(o).range(n), this.initialTimeScale = this.timeScale.copy(), this.updateCurrentTimeScaleDensity();
-      for (const h in this.xAxes)
-        this.rescaleAxis(h, this.timeScale), this.translateTicksText(h);
-      this.updateBarCharts(), this.updateLineGraphs(), this.updateLineGraphHoverZones(), this.repositionSelectedTimestampCursor();
+      const e = this.startDate || this.oldestEvent.timestamp || this.oldestEvent.startDate, t = this.endDate || this.latestEvent.timestamp || this.latestEvent.endDate, r = this.tzStringToDate(e), n = this.tzStringToDate(t), a = this.timeline.offsetWidth, o = [r, n], i = [0, a];
+      this.timeScale = u.scaleTime().domain(o).range(i), this.initialTimeScale = this.timeScale.copy(), this.updateCurrentTimeScaleDensity();
+      for (const d in this.xAxes)
+        this.rescaleAxis(d, this.timeScale), this.translateTicksText(d);
+      this.updateEventsBars(), this.updateLineGraphs(), this.updateLineGraphHoverZones(), this.repositionSelectedTimestampCursor();
     },
     rescaleAxis(e, t) {
-      const r = this.xAxes[e], i = this.getAxisTicksConfig(
+      const r = this.xAxes[e], n = this.getAxisTicksConfig(
         this.xAxesConfig[e]
       );
-      r.scale(t).ticks(i.interval).tickFormat(i.formatFn).tickSizeOuter(0), this.svg.select(`.${_.xAxis}-${e}`).call(r);
+      r.scale(t).ticks(n.interval).tickFormat(n.formatFn).tickSizeOuter(0), this.svg.select(`.${b.xAxis}-${e}`).call(r);
     },
     translateTicksText(e) {
-      this.svg.select(`.${_.xAxis}-${e}`).selectAll(".tick text").each(function() {
+      this.svg.select(`.${b.xAxis}-${e}`).selectAll(".tick text").each(function() {
         let t = u.select(this), r = t.node().getBBox();
         t.attr("x", r.height / 2).attr("y", 0).style("text-anchor", "start");
       });
     },
-    updateBarCharts() {
-      const e = `.${_.eventGroup} > rect.${_.eventRect}`;
+    updateEventsBars() {
+      const e = `.${b.eventGroup} > rect.${b.eventRect}`;
       this.svg.selectAll(e).attr("x", this.getEventRectX).attr("width", this.getEventRectWidth);
-      const t = `.${_.eventGroup} > text.${_.eventRectText}`;
+      const t = `.${b.eventGroup} > text.${b.eventRectText}`;
       this.svg.selectAll(t).attr("x", (r) => this.getEventRectX(r) + this.textPadding).text(this.getEventText);
     },
+    updateBarChart() {
+      const e = (n) => this.getEventRectX(n) + this.barXPadding, t = (n) => this.getEventRectWidth(n) - this.barXPadding * 2, r = `.${b.barChartGroup} > rect`;
+      this.svg.selectAll(r).attr("x", e).attr("width", t);
+    },
     updateLineGraphs() {
       Object.entries(this.lineGraphGroups).forEach(([e]) => {
         const t = u.area().x((r) => this.timeScale(this.tzStringToDate(r.timestamp))).y0(this.timelineHeight).y1((r) => this.yScale(r.count)).curve(u.curveMonotoneX);
         this.svg.selectAll(
-          `.${_.lineGraphPath}-${e}`
+          `.${b.lineGraphPath}-${e}`
         ).attr("d", (r) => t(r));
       });
     },
@@ -5543,14 +5577,14 @@ const Xt = {
       Object.keys(this.lineGraphGroups).forEach((e) => {
         const t = this;
         this.svg.selectAll(
-          `.${_.lineGraphDot}-${e}`
+          `.${b.lineGraphDot}-${e}`
         ).each(function(r) {
           u.select(this).attr("cx", t.timeScale(t.tzStringToDate(r.timestamp))).attr("cy", t.yScale(r.count));
         }), this.svg.selectAll(
-          `.${_.lineGraphHoverZone}-${e}`
+          `.${b.lineGraphHoverZone}-${e}`
         ).each(function(r) {
-          const i = t.timeScale(t.tzStringToDate(r.timestamp).getTime()) - 15;
-          u.select(this).attr("x", i).attr("y", 0).attr("width", 30).attr("height", t.lineGraphChartHeight);
+          const n = t.timeScale(t.tzStringToDate(r.timestamp).getTime()) - 15;
+          u.select(this).attr("x", n).attr("y", 0).attr("width", 30).attr("height", t.chartHeight);
         });
       });
     },
@@ -5561,25 +5595,25 @@ const Xt = {
       if (!e)
         return 0;
       if (e.startDate && e.endDate) {
-        const t = new Date(e.startDate), r = new Date(e.endDate), i = this.timeScale(r) - this.timeScale(t);
-        return Math.max(i, this.rectMinWidth);
+        const t = new Date(e.startDate), r = new Date(e.endDate), n = this.timeScale(r) - this.timeScale(t);
+        return Math.max(n, this.rectMinWidth);
       } else {
         const t = 1 / (this.currentTimeScaleDensity * 3600);
         return Math.max(t, this.rectMinWidth);
       }
     },
     getEventText(e) {
-      var i;
+      var n;
       const r = (this.getEventRectWidth(e) - this.textPadding) / this.characterWidth;
-      return r < 4 ? "" : ((i = e.text) == null ? void 0 : i.length) <= r ? e.text : `${e.text.slice(0, r - 3)}...`;
+      return r < 4 ? "" : ((n = e.text) == null ? void 0 : n.length) <= r ? e.text : `${e.text.slice(0, r - 3)}...`;
     },
     initCurtains() {
       if (!this.curtains)
         return;
       const e = this.timeline.offsetWidth, t = this.timelineHeight;
-      this.svg.append("rect").classed(`${_.curtain} ${_.curtain}--left`, !0).attr("width", this.leftCurtainWidth).attr("height", t + this.curtainHandleWidth * 2).attr("y", -this.curtainHandleWidth).attr("x", -this.curtainHandleWidth).attr("fill", "rgba(0, 0, 0, 0.5)").on("mouseenter", () => this.isHoveringCurtain = !0).on("mouseleave", () => this.isHoveringCurtain = !1).call(
+      this.svg.append("rect").classed(`${b.curtain} ${b.curtain}--left`, !0).attr("width", this.leftCurtainWidth).attr("height", t + this.curtainHandleWidth * 2).attr("y", -this.curtainHandleWidth).attr("x", -this.curtainHandleWidth).attr("fill", "rgba(0, 0, 0, 0.5)").on("mouseenter", () => this.isHoveringCurtain = !0).on("mouseleave", () => this.isHoveringCurtain = !1).call(
         u.drag().on("start", this.handleDragStart).on("drag", this.handleLeftDrag).on("end", this.handleDragEnd)
-      ), this.svg.append("rect").classed(`${_.curtain} ${_.curtain}--right`, !0).attr(
+      ), this.svg.append("rect").classed(`${b.curtain} ${b.curtain}--right`, !0).attr(
         "x",
         e - this.rightCurtainWidth + this.curtainHandleWidth * 2
       ).attr("y", -this.curtainHandleWidth).attr("width", this.rightCurtainWidth + this.curtainHandleWidth * 2).attr("height", t + this.curtainHandleWidth * 2).attr("fill", "rgba(0, 0, 0, 0.5)").on("mouseenter", () => this.isHoveringCurtain = !0).on("mouseleave", () => this.isHoveringCurtain = !1).call(
@@ -5587,37 +5621,37 @@ const Xt = {
       );
     },
     drawEventsGroups() {
-      this.svg.selectAll(`g.${_.eventGroup}`).remove(), this.drawLineGraphEventsGroups(), this.drawBarEventsGroups();
+      this.svg.selectAll(`g.${b.eventGroup}`).remove(), this.drawLineGraphEventsGroups(), this.drawBarEventsGroups(), this.drawBarChartEventsGroups();
     },
     drawLineGraphEventsGroups() {
       const e = this.combinedXAxesHeight, t = this.insertZerosAtInterval ? this.filledGapsLineGraphGroups : this.lineGraphGroups;
-      Object.entries(t).forEach(([r, i]) => {
+      Object.entries(t).forEach(([r, n]) => {
         const a = this.svg.append("g").classed(
-          `${_.lineGraphGroup} ${_.lineGraphGroup}-${r}`,
+          `${b.lineGraphGroup} ${b.lineGraphGroup}-${r}`,
           !0
-        ).attr("transform", `translate(0,${e})`), { color: o, events: n } = i;
+        ).attr("transform", `translate(0,${e})`), { color: o, events: i } = n;
         this.drawLineGraph({
-          events: n,
+          events: i,
           gElement: a,
           color: o,
           type: r
         }), this.drawLineGraphHoverZones({
-          events: n,
+          events: i,
           gElement: a,
           color: o,
           type: r
         });
       }), Object.entries(this.lineGraphGroups).forEach(
-        ([r, i], a) => {
-          const { color: o, isLoading: n, label: h } = i, l = this.lineGraphChartHeight - this.barChartHeight * (a + 1), s = e + this.lineGraphChartHeight - this.barChartHeight, c = this.svg.append("g").classed(`${_.lineGraphGroup}-label`, !0).attr("transform", `translate(0,${e})`).on("mouseover", () => this.handleLabelMouseOver(r)).on("mouseleave", () => this.handleLabelMouseLeave(r));
+        ([r, n], a) => {
+          const { color: o, isLoading: i, label: d } = n, l = this.chartHeight - this.barChartHeight * (a + 1), s = e + this.chartHeight - this.barChartHeight, c = this.svg.append("g").classed(`${b.lineGraphGroup}-label`, !0).attr("transform", `translate(0,${e})`).on("mouseover", () => this.handleLabelMouseOver(r)).on("mouseleave", () => this.handleLabelMouseLeave(r));
           this.drawProgressIndicator({
             type: r,
             color: o,
-            isLoading: n,
+            isLoading: i,
             yPosition: s
           }), this.drawTextLabel({
             color: o,
-            label: h,
+            label: d,
             yPosition: l,
             gElement: c
           });
@@ -5628,108 +5662,138 @@ const Xt = {
       events: e,
       gElement: t,
       color: r,
-      type: i
+      type: n
     }) {
-      const a = u.area().x((n) => this.timeScale(this.tzStringToDate(n.timestamp))).y0(this.timelineHeight).y1((n) => this.yScale(n.count)).curve(u.curveMonotoneX), o = `clip-${i}`;
-      t.append("defs").append("clipPath").attr("id", o).append("rect").attr("width", this.timeline.offsetWidth).attr("height", this.lineGraphChartHeight), t.append("path").datum(e).classed(`${_.lineGraphPath}-${i}`, !0).attr("fill", `url(#${Q.areaGradient}-${i})`).attr("stroke", r).attr("stroke-linejoin", "round").attr("stroke-linecap", "round").attr("stroke-width", 1).attr("d", (n) => a(n)).attr("clip-path", `url(#${o})`);
+      const a = u.area().x((i) => this.timeScale(this.tzStringToDate(i.timestamp))).y0(this.timelineHeight).y1((i) => this.yScale(i.count)).curve(u.curveMonotoneX), o = `clip-${n}`;
+      t.append("defs").append("clipPath").attr("id", o).append("rect").attr("width", this.timeline.offsetWidth).attr("height", this.chartHeight), t.append("path").datum(e).classed(`${b.lineGraphPath}-${n}`, !0).attr("fill", `url(#${Y.transparencyGradientLight}-${n})`).attr("stroke", r).attr("stroke-linejoin", "round").attr("stroke-linecap", "round").attr("stroke-width", 1).attr("d", (i) => a(i)).attr("clip-path", `url(#${o})`);
     },
     drawLineGraphHoverZones({
       events: e,
       gElement: t,
       color: r,
-      type: i
+      type: n
     }) {
       e.forEach((a) => {
         const o = `${a.timestamp}`;
         this.countsByTimestamp[o] = {
           ...this.countsByTimestamp[o] || {},
-          [i]: a.count
+          [n]: a.count
         };
-        const n = t.append("circle").classed(
-          `${_.lineGraphDot} ${_.lineGraphDot}-${i}`,
+        const i = t.append("circle").classed(
+          `${b.lineGraphDot} ${b.lineGraphDot}-${n}`,
           !0
         ).attr("cx", this.timeScale(this.tzStringToDate(a.timestamp))).attr("cy", this.yScale(a.count)).attr("r", 1.5).attr("fill", r).attr("stroke-width", 0).datum(a);
         this.dotsByTimestamp[o] = [
           ...this.dotsByTimestamp[o] || [],
-          n
-        ], t.append("rect").classed(`${_.lineGraphHoverZone}-${i}`, !0).attr("x", this.timeScale(this.tzStringToDate(a.timestamp)) - 15).attr("y", 0).attr("width", 30).attr("height", this.lineGraphChartHeight).attr("fill", "transparent").datum(a).on("mouseover", (h) => {
-          this.handleLineMouseOver(h, a, i), this.dotsByTimestamp[o].forEach(
-            (l) => l.classed(`${_.lineGraphDot}--active`, !0)
+          i
+        ], t.append("rect").classed(`${b.lineGraphHoverZone}-${n}`, !0).attr("x", this.timeScale(this.tzStringToDate(a.timestamp)) - 15).attr("y", 0).attr("width", 30).attr("height", this.chartHeight).attr("fill", "transparent").datum(a).on("mouseover", (d) => {
+          this.handleLineMouseOver(d, a, n), this.dotsByTimestamp[o].forEach(
+            (l) => l.classed(`${b.lineGraphDot}--active`, !0)
           );
         }).on("mouseout", () => {
           this.handleLineMouseOut(), this.dotsByTimestamp[o].forEach(
-            (h) => h.classed(`${_.lineGraphDot}--active`, !1)
+            (d) => d.classed(`${b.lineGraphDot}--active`, !1)
           );
         });
       });
     },
     drawBarEventsGroups() {
       Object.entries(this.barGroups).forEach(([e, t], r) => {
-        const { color: i, bgColor: a, label: o, events: n, isLoading: h } = t, l = this.hasLineGraphChart ? this.lineGraphChartHeight : 0, s = r * this.barChartHeight + this.combinedXAxesHeight + l;
+        const { color: n, bgColor: a, label: o, events: i, isLoading: d } = t, l = this.hasChart ? this.chartHeight : 0, s = r * this.barChartHeight + this.combinedXAxesHeight + l;
         this.drawProgressIndicator({
           yPosition: s,
           type: e,
-          color: i,
-          isLoading: h
+          color: n,
+          isLoading: d
         });
-        const c = this.svg.append("g").attr("data-color", i).classed(_.eventGroup, !0).classed(`${_.eventGroup}-${e}`, !0);
+        const c = this.svg.append("g").attr("data-color", n).classed(b.eventGroup, !0).classed(`${b.eventGroup}-${e}`, !0);
         this.drawBackground({
-          color: a || i,
+          color: a || n,
           gElement: c,
           yPosition: s
         }), this.drawBars({
-          events: n,
-          color: i,
+          events: i,
+          color: n,
           gElement: c,
           yPosition: s,
           type: e
         }), this.drawTextLabel({
-          color: i,
+          color: n,
           label: o,
           gElement: c,
           yPosition: s
         });
       });
     },
+    drawBarChartEventsGroups() {
+      const e = this.combinedXAxesHeight, t = this.barChartGroups;
+      Object.entries(t).forEach(([r, n]) => {
+        const a = this.svg.append("g").classed(
+          `${b.barChartGroup} ${b.barChartGroup}-${r}`,
+          !0
+        ).attr("transform", `translate(0,${e})`), { color: o, events: i } = n;
+        this.drawBarsChart({
+          events: i,
+          color: o,
+          gElement: a,
+          type: r
+        });
+      });
+    },
     drawProgressIndicator({
       yPosition: e,
       type: t,
       isLoading: r
     }) {
       this.svg.append("rect").classed(
-        `${_.loadingIndicator} ${_.loadingIndicator}-${t}`,
+        `${b.loadingIndicator} ${b.loadingIndicator}-${t}`,
         !0
-      ).attr("x", 0).attr("y", e).attr("width", this.timeline.offsetWidth / 3).attr("height", this.barChartHeight).attr("fill", `url(#${Q.loadingGradient}-${t})`).style("visibility", r ? "visible" : "hidden");
+      ).attr("x", 0).attr("y", e).attr("width", this.timeline.offsetWidth / 3).attr("height", this.barChartHeight).attr("fill", `url(#${Y.loadingGradient}-${t})`).style("visibility", r ? "visible" : "hidden");
     },
     drawBackground({
       color: e,
       yPosition: t,
       gElement: r
     }) {
-      r.append("rect").attr("class", _.eventGroupBg).attr("x", 0).attr("y", t).attr("width", this.timeline.offsetWidth).attr("height", this.barChartHeight).attr("fill", u.color(e).toString()).style("opacity", 0.1);
+      r.append("rect").attr("class", b.eventGroupBg).attr("x", 0).attr("y", t).attr("width", this.timeline.offsetWidth).attr("height", this.barChartHeight).attr("fill", u.color(e).toString()).style("opacity", 0.1);
     },
     drawBars({
       events: e,
       gElement: t,
       yPosition: r,
-      color: i,
+      color: n,
       type: a
     }) {
       const o = this;
-      t.selectAll(_.eventRect).data(e).enter().append("rect").classed(_.eventRect, !0).attr("x", this.getEventRectX).attr("y", r + this.barYPadding / 2).attr("ry", 1.5).attr("rx", 1.5).attr("width", this.getEventRectWidth).attr("height", this.barChartHeight - this.barYPadding).attr("stroke-width", 5).attr("cursor", "pointer").attr("stroke", "#0000").style("fill", (n) => n.color || i).on("mouseover", function(n, h) {
-        u.select(this).classed(`${_.eventRect}--hovered`, !0), o.handleBarMouseOver(n, h, a);
+      t.selectAll(b.eventRect).data(e).enter().append("rect").classed(b.eventRect, !0).attr("x", this.getEventRectX).attr("y", r + this.barYPadding / 2).attr("ry", 1.5).attr("rx", 1.5).attr("width", this.getEventRectWidth).attr("height", this.barChartHeight - this.barYPadding).attr("stroke-width", 5).attr("cursor", "pointer").attr("stroke", "#0000").style("fill", (i) => i.color || n).on("mouseover", function(i, d) {
+        u.select(this).classed(`${b.eventRect}--hovered`, !0), o.handleBarMouseOver(i, d, a);
       }).on("mouseout", function() {
-        u.select(this).classed(`${_.eventRect}--hovered`, !1), o.handleBarMouseOut();
-      }), t.selectAll(_.eventRectText).data(e.filter((n) => !!n.text)).enter().append("text").attr("class", _.eventRectText).attr("x", (n) => this.getEventRectX(n) + this.textPadding).attr("y", r + this.barChartHeight / 2).attr("dy", "0.35em").style("text-anchor", "start").style("font-size", "12px").style("font-weight", 600).style("stroke-linejoin", "round").style("paint-order", "stroke").style("pointer-events", "none").style(
+        u.select(this).classed(`${b.eventRect}--hovered`, !1), o.handleBarMouseOut();
+      }), t.selectAll(b.eventRectText).data(e.filter((i) => !!i.text)).enter().append("text").attr("class", b.eventRectText).attr("x", (i) => this.getEventRectX(i) + this.textPadding).attr("y", r + this.barChartHeight / 2).attr("dy", "0.35em").style("text-anchor", "start").style("font-size", "12px").style("font-weight", 600).style("stroke-linejoin", "round").style("paint-order", "stroke").style("pointer-events", "none").style(
         "fill",
-        (n) => this.getTextFillColor(n.color || i, 0.75)
+        (i) => this.getTextFillColor(i.color || n, 0.75)
       ).text(this.getEventText);
     },
+    drawBarsChart({
+      events: e,
+      gElement: t,
+      color: r,
+      type: n
+    }) {
+      const a = this, o = (s) => this.getEventRectX(s) + this.barXPadding, i = (s) => this.yScale(s.count), d = (s) => this.getEventRectWidth(s) - this.barXPadding * 2, l = (s) => this.yScale.range()[0] - this.yScale(s.count);
+      t.selectAll(b.eventBar).data(e).enter().append("rect").classed(b.eventBar, !0).attr("x", o).attr("y", i).attr("width", d).attr("height", l).attr("stroke-width", 5).attr("cursor", "pointer").attr("stroke", "#0000").attr("fill", `url(#${Y.transparencyGradient}-${n})`).on("mouseover", function(s, c) {
+        const g = u.select(this);
+        g.classed(`${b.eventBar}--hovered`, !0), g.attr("fill", s.color || r), g.attr("fill-opacity", 0.5), a.handleBarMouseOver(s, c, n);
+      }).on("mouseout", function() {
+        const s = u.select(this);
+        s.attr("fill", `url(#${Y.transparencyGradient}-${n})`), s.attr("fill-opacity", 1), s.classed(`${b.eventBar}--hovered`, !1), a.handleBarMouseOut();
+      }), t.selectAll(b.eventBarCap).data(e).enter().append("rect").attr("x", o).attr("y", i).attr("width", d).attr("height", 2).attr("stroke-width", 0).style("fill", (s) => s.color || r);
+    },
     drawTextLabel({
       gElement: e,
       yPosition: t,
       color: r,
-      label: i
+      label: n
     }) {
       if (!this.showLabels)
         return;
@@ -5740,11 +5804,11 @@ const Xt = {
         h: this.barChartHeight,
         radius: 3
       };
-      e.append("rect").attr("class", _.labelBg).attr("data-color", r).attr("x", a.x).attr("y", a.y).attr("width", a.w).attr("height", a.h).attr("rx", a.radius).attr("ry", a.radius).style("fill", this.dark ? "#131a29" : "white"), e.append("rect").attr("class", _.labelBgFill).attr("data-color", r).attr("x", a.x).attr("y", a.y).attr("width", a.w).attr("height", a.h).attr("rx", a.radius).attr("ry", a.radius).style("fill", this.getLabelBackgroundColor(r)).style("stroke", this.getTextFillColor(r)).style("stroke-width", 0.25), e.append("text").attr("class", _.labelText).attr("data-color", r).attr("x", 5).attr("y", t + this.barChartHeight / 2).attr("dy", "0.35em").style("text-anchor", "start").style("font-size", "12px").style("font-weight", 500).style("stroke-linejoin", "round").style("paint-order", "stroke").style("fill", this.getTextFillColor(r)).text(i);
+      e.append("rect").attr("class", b.labelBg).attr("data-color", r).attr("x", a.x).attr("y", a.y).attr("width", a.w).attr("height", a.h).attr("rx", a.radius).attr("ry", a.radius).style("fill", this.dark ? "#131a29" : "white"), e.append("rect").attr("class", b.labelBgFill).attr("data-color", r).attr("x", a.x).attr("y", a.y).attr("width", a.w).attr("height", a.h).attr("rx", a.radius).attr("ry", a.radius).style("fill", this.getLabelBackgroundColor(r)).style("stroke", this.getTextFillColor(r)).style("stroke-width", 0.25), e.append("text").attr("class", b.labelText).attr("data-color", r).attr("x", 5).attr("y", t + this.barChartHeight / 2).attr("dy", "0.35em").style("text-anchor", "start").style("font-size", "12px").style("font-weight", 500).style("stroke-linejoin", "round").style("paint-order", "stroke").style("fill", this.getTextFillColor(r)).text(n);
     },
     getTextFillColor(e, t = 0) {
-      var r, i;
-      return (this.dark ? (r = u.color(e)) == null ? void 0 : r.brighter(1.5 + t) : (i = u.color(e)) == null ? void 0 : i.darker(2 + t)).toString();
+      var r, n;
+      return (this.dark ? (r = u.color(e)) == null ? void 0 : r.brighter(1.5 + t) : (n = u.color(e)) == null ? void 0 : n.darker(2 + t)).toString();
     },
     getLabelBackgroundColor(e) {
       let t = u.color(e);
@@ -5767,22 +5831,22 @@ const Xt = {
     fillTimeGaps(e) {
       if (e.length <= 1)
         return e;
-      const t = this.insertZerosAtInterval, r = (o) => o.clone().add(1, t), i = (o) => o.clone().subtract(1, t);
+      const t = this.insertZerosAtInterval, r = (o) => o.clone().add(1, t), n = (o) => o.clone().subtract(1, t);
       let a = [];
       for (let o = 0; o < e.length; o++) {
-        const n = e[o];
-        if (a.push(n), o === e.length - 1)
+        const i = e[o];
+        if (a.push(i), o === e.length - 1)
           break;
-        const h = e[o + 1], l = V(n.timestamp), s = V(h.timestamp);
+        const d = e[o + 1], l = V(i.timestamp), s = V(d.timestamp);
         if (s.diff(l, t) > 1) {
-          const c = r(l).toISOString(), v = i(s).toISOString();
-          a.push({ timestamp: c, count: 0 }), c !== v && a.push({ timestamp: v, count: 0 });
+          const c = r(l).toISOString(), g = n(s).toISOString();
+          a.push({ timestamp: c, count: 0 }), c !== g && a.push({ timestamp: g, count: 0 });
         }
       }
       if (this.flattenLineGraphEnds) {
-        const o = V(e[0].timestamp), n = V(e[e.length - 1].timestamp), h = i(o).toISOString(), l = r(n).toISOString();
+        const o = V(e[0].timestamp), i = V(e[e.length - 1].timestamp), d = n(o).toISOString(), l = r(i).toISOString();
         a = [
-          { timestamp: h, count: 0 },
+          { timestamp: d, count: 0 },
           ...a,
           { timestamp: l, count: 0 }
         ];
@@ -5791,7 +5855,7 @@ const Xt = {
     },
     fillEvents(e) {
       return this.placeholderLineChartGroup.map((t) => e.find(
-        (i) => i.timestamp === t.timestamp
+        (n) => n.timestamp === t.timestamp
       ) || t);
     }
   }
@@ -5806,8 +5870,8 @@ var Kt = function() {
           !cursorTimestamp
         ` }], staticClass: "e-timeline__tooltip e-border e-rounded e-px-2 -e-left-2/4 e-relative", class: t.classes.tooltipSlot }, [t._v(" " + t._s(t.hoveredTimestamp) + " ")])];
   }, { timestamp: t.hoveredTimestamp, active: t.isHoveringTimeline && !t.isInteractingWithCurtain && !t.cursorTimestamp })], 2), r("div", { ref: "eventPreviewTooltip", staticClass: "e-absolute e-z-50", style: t.eventTooltipStyle }, [t._t("eventTooltip", function() {
-    return [t.showEventTooltip && (t.hoveredEvent || t.hoveredCounts.length) ? r("div", { directives: [{ name: "show", rawName: "v-show", value: t.isHoveringEvent && !t.isInteractingWithCurtain, expression: "isHoveringEvent && !isInteractingWithCurtain" }], staticClass: "e-timeline__event-tooltip e-border e-rounded e-px-2 -e-left-2/4 e-relative", class: t.classes.eventTooltipSlot }, [t.hoveredCounts.length ? r("div", [r("strong", [t._v("Timestamp")]), t._v(": " + t._s(t.hoveredEvent.timestamp) + " "), t._l(t.hoveredCounts, function(i, a) {
-      return r("div", { key: a }, [r("strong", [t._v(t._s(i.type) + " Count")]), t._v(": " + t._s(i.count) + " ")]);
+    return [t.showEventTooltip && (t.hoveredEvent || t.hoveredCounts.length) ? r("div", { directives: [{ name: "show", rawName: "v-show", value: t.isHoveringEvent && !t.isInteractingWithCurtain, expression: "isHoveringEvent && !isInteractingWithCurtain" }], staticClass: "e-timeline__event-tooltip e-border e-rounded e-px-2 -e-left-2/4 e-relative", class: t.classes.eventTooltipSlot }, [t.hoveredCounts.length ? r("div", [r("strong", [t._v("Timestamp")]), t._v(": " + t._s(t.hoveredEvent.timestamp) + " "), t._l(t.hoveredCounts, function(n, a) {
+      return r("div", { key: a }, [r("strong", [t._v(t._s(n.type) + " Count")]), t._v(": " + t._s(n.count) + " ")]);
     })], 2) : t.hoveredEvent ? r("div", [t.hoveredEvent.timestamp ? r("div", [r("strong", [t._v("Event time")]), t._v(": " + t._s(t.hoveredEvent.timestamp) + " ")]) : t._e(), t.hoveredEvent.startDate ? r("div", [r("strong", [t._v("From")]), t._v(":" + t._s(t.hoveredEvent.startDate) + " ")]) : t._e(), t.hoveredEvent.endDate ? r("div", [r("strong", [t._v("To")]), t._v(":" + t._s(t.hoveredEvent.endDate) + " ")]) : t._e()]) : t._e()]) : t._e()];
   }, { event: t.hoveredEvent, counts: t.hoveredCounts, active: t.isHoveringEvent && !t.isInteractingWithCurtain, type: t.hoveredEventType })], 2)]);
 }, Jt = [], Qt = /* @__PURE__ */ I(
@@ -5877,24 +5941,24 @@ const er = Qt.exports, tr = {
 var rr = function() {
   var t = this, r = t._self._c;
   return r("div", { staticClass: "video-embed" }, [r("iframe", t._g(t._b({ attrs: { src: t.embedUrl, frameborder: "0", allowfullscreen: "", width: "100%", height: "100%", allow: "autoplay; fullscreen; picture-in-picture" } }, "iframe", t.iframeOptions, !1), t.iframeListeners))]);
-}, ir = [], nr = /* @__PURE__ */ I(
+}, nr = [], ir = /* @__PURE__ */ I(
   tr,
   rr,
-  ir,
+  nr,
   !1,
   null,
   "0ecf4a71",
   null,
   null
 );
-const sr = nr.exports, Se = {
+const sr = ir.exports, Se = {
   EAvatar: ct,
   EBadge: Me,
   EIcon: Tt,
   ESpinner: Qe,
-  ERow: zt,
-  ECol: jt,
-  EVideoPlayer: qt,
+  ERow: Pt,
+  ECol: Bt,
+  EVideoPlayer: Xt,
   ETimeline: er,
   EVideoEmbed: sr
 }, fr = {
@@ -5910,32 +5974,32 @@ export {
   ur as AvatarSizes,
   cr as BadgeColors,
   lr as BadgeSizes,
-  j as BaseColor,
+  B as BaseColor,
   bt as Colors,
   Yt as DirectivesMap,
   ct as EAvatar,
   Me as EBadge,
-  jt as ECol,
+  Bt as ECol,
   Tt as EIcon,
-  zt as ERow,
+  Pt as ERow,
   Qe as ESpinner,
   er as ETimeline,
   dr as EVENTS,
   sr as EVideoEmbed,
-  qt as EVideoPlayer,
+  Xt as EVideoPlayer,
   xt as IconSizes,
   tt as ResizeObserverDirective,
   T as Size,
   yt as TextSizes,
-  ee as TimelineAxis,
-  te as TimelineChartType,
+  te as TimelineAxis,
+  Z as TimelineChartType,
   fe as TimelineIntervalChangeTrigger,
   Se as components,
   Wt as debounce,
   fr as default,
-  Bt as exitFullScreen,
+  Rt as exitFullScreen,
   Je as fullConfig,
   et as isFullScreen,
-  Rt as makeFullScreen
+  jt as makeFullScreen
 };
 //# sourceMappingURL=index.mjs.map