@gobolt/genesis 0.0.10 → 0.0.11

package/dist/components/Notification/Notification.js

@@ -1,19 +1,35 @@
 import { jsxs as X, jsx as b } from "react/jsx-runtime";
-import { SIZE as _, TYPOGRAPHY_VARIANT as S, STATE as x } from "../../constants/index.js";
-import J from "../Badge/Badge.js";
+import { SIZE as _, TYPOGRAPHY_VARIANT as S, STATE as P } from "../../constants/index.js";
+import "../Avatar/styles.js";
+import "../Badge/styles.js";
+import "../../providers/BreakpointThemeProvider.js";
+import { a as C } from "../../Typography-DqI7RslA.js";
+import { n as J } from "../../styled-components.browser.esm-CZ1XM4o4.js";
 import "../Breadcrumb/styles.js";
-import "../../providers/ThemeProvider.js";
-import { a as C } from "../../Typography-aGoDUl4R.js";
-import { n as U } from "../../styled-components.browser.esm-CZ1XM4o4.js";
-import "../Button/styles.js";
+import U from "../Button/Button.js";
+import "../Card/styles.js";
 import "../Checkbox/styles.js";
+import "react";
 import "../ErrorBoundaryFallback/styles.js";
 import "../Input/styles.js";
+import "../Layout/Content/styles.js";
 import "../Message/styles.js";
-import "react";
+import "../../styles-BSD221S5.js";
+import "../Progress/styles.js";
+import "../../styles/global-styles.js";
+import "../Row/styles.js";
+import "../Row/RowLabelValue/styles.js";
+import "../Row/RowActions/styles.js";
+import "../SegmentedControls/styles.js";
 import "../Select/styles.js";
+import "../Switch/styles.js";
+import "../../styles-D9iYILpv.js";
+import "../Tabs/styles.js";
+import "../Tile/styles.js";
 import "../Toast/styles.js";
-import { NotificationRow as K, NotificationUnread as Z, NotificationContent as z, NotificationActionButton as tt, ChevronButton as et } from "./styles.js";
+import "../Tooltip/styles.js";
+import K from "./NotificationBadge/NotificationBadge.js";
+import { NotificationRow as Z, NotificationUnread as z, NotificationContent as tt, ChevronButton as et } from "./styles.js";
 import nt from "./NotificationRightChevron.js";
 function d(t) {
   const e = Object.prototype.toString.call(t);
@@ -27,13 +43,13 @@ let at = {};
 function T() {
   return at;
 }
-function p(t, e) {
-  var i, u, f, h;
-  const n = T(), r = (e == null ? void 0 : e.weekStartsOn) ?? ((u = (i = e == null ? void 0 : e.locale) == null ? void 0 : i.options) == null ? void 0 : u.weekStartsOn) ?? n.weekStartsOn ?? ((h = (f = n.locale) == null ? void 0 : f.options) == null ? void 0 : h.weekStartsOn) ?? 0, a = d(t), o = a.getDay(), s = (o < r ? 7 : 0) + o - r;
+function k(t, e) {
+  var i, u, f, l;
+  const n = T(), r = (e == null ? void 0 : e.weekStartsOn) ?? ((u = (i = e == null ? void 0 : e.locale) == null ? void 0 : i.options) == null ? void 0 : u.weekStartsOn) ?? n.weekStartsOn ?? ((l = (f = n.locale) == null ? void 0 : f.options) == null ? void 0 : l.weekStartsOn) ?? 0, a = d(t), o = a.getDay(), s = (o < r ? 7 : 0) + o - r;
   return a.setDate(a.getDate() - s), a.setHours(0, 0, 0, 0), a;
 }
 function F(t) {
-  return p(t, { weekStartsOn: 1 });
+  return k(t, { weekStartsOn: 1 });
 }
 function B(t) {
   const e = d(t), n = e.getFullYear(), r = D(t, 0);
@@ -95,20 +111,20 @@ function ft(t) {
     return r === 0 ? 0 : r;
   };
 }
-function ht(t, e) {
+function lt(t, e) {
   return +d(t) - +d(e);
 }
-function lt(t) {
+function mt(t) {
   const e = d(t);
   return e.setHours(23, 59, 59, 999), e;
 }
-function mt(t) {
+function ht(t) {
   const e = d(t), n = e.getMonth();
   return e.setFullYear(e.getFullYear(), n + 1, 0), e.setHours(23, 59, 59, 999), e;
 }
 function gt(t) {
   const e = d(t);
-  return +lt(e) == +mt(e);
+  return +mt(e) == +ht(e);
 }
 function wt(t, e) {
   const n = d(t), r = d(e), a = Y(n, r), o = Math.abs(
@@ -125,7 +141,7 @@ function wt(t, e) {
   return s === 0 ? 0 : s;
 }
 function yt(t, e, n) {
-  const r = ht(t, e) / 1e3;
+  const r = lt(t, e) / 1e3;
   return ft(n == null ? void 0 : n.roundingMethod)(r);
 }
 function bt(t) {
@@ -205,43 +221,43 @@ function q(t) {
     return t.formats[n] || t.formats[t.defaultWidth];
   };
 }
-const Ot = {
+const pt = {
   full: "EEEE, MMMM do, y",
   long: "MMMM do, y",
   medium: "MMM d, y",
   short: "MM/dd/yyyy"
-}, Pt = {
+}, Ot = {
   full: "h:mm:ss a zzzz",
   long: "h:mm:ss a z",
   medium: "h:mm:ss a",
   short: "h:mm a"
-}, xt = {
+}, Pt = {
   full: "{{date}} 'at' {{time}}",
   long: "{{date}} 'at' {{time}}",
   medium: "{{date}}, {{time}}",
   short: "{{date}}, {{time}}"
-}, vt = {
+}, xt = {
   date: q({
-    formats: Ot,
+    formats: pt,
     defaultWidth: "full"
   }),
   time: q({
-    formats: Pt,
+    formats: Ot,
     defaultWidth: "full"
   }),
   dateTime: q({
-    formats: xt,
+    formats: Pt,
     defaultWidth: "full"
   })
-}, kt = {
+}, vt = {
   lastWeek: "'last' eeee 'at' p",
   yesterday: "'yesterday at' p",
   today: "'today at' p",
   tomorrow: "'tomorrow at' p",
   nextWeek: "eeee 'at' p",
   other: "P"
-}, pt = (t, e, n, r) => kt[t];
-function v(t) {
+}, kt = (t, e, n, r) => vt[t];
+function x(t) {
   return (e, n) => {
     const r = n != null && n.context ? String(n.context) : "standalone";
     let a;
@@ -383,31 +399,31 @@ const Tt = {
   return n + "th";
 }, Ct = {
   ordinalNumber: Et,
-  era: v({
+  era: x({
     values: Tt,
     defaultWidth: "wide"
   }),
-  quarter: v({
+  quarter: x({
     values: St,
     defaultWidth: "wide",
     argumentCallback: (t) => t - 1
   }),
-  month: v({
+  month: x({
     values: Wt,
     defaultWidth: "wide"
   }),
-  day: v({
+  day: x({
     values: Yt,
     defaultWidth: "wide"
   }),
-  dayPeriod: v({
+  dayPeriod: x({
     values: Ft,
     defaultWidth: "wide",
     formattingValues: Nt,
     defaultFormattingWidth: "wide"
   })
 };
-function k(t) {
+function v(t) {
   return (e, n = {}) => {
     const r = n.width, a = r && t.matchPatterns[r] || t.matchPatterns[t.defaultMatchWidth], o = e.match(a);
     if (!o)
@@ -421,8 +437,8 @@ function k(t) {
       // eslint-disable-next-line @typescript-eslint/no-explicit-any -- I challange you to fix the type
       n.valueCallback(f)
     ) : f;
-    const h = e.slice(s.length);
-    return { value: f, rest: h };
+    const l = e.slice(s.length);
+    return { value: f, rest: l };
   };
 }
 function qt(t, e) {
@@ -520,32 +536,32 @@ const Ht = /^(\d+)(th|st|nd|rd)?/i, Rt = /\d+/i, Lt = {
     parsePattern: Rt,
     valueCallback: (t) => parseInt(t, 10)
   }),
-  era: k({
+  era: v({
     matchPatterns: Lt,
     defaultMatchWidth: "wide",
     parsePatterns: jt,
     defaultParseWidth: "any"
   }),
-  quarter: k({
+  quarter: v({
     matchPatterns: It,
     defaultMatchWidth: "wide",
     parsePatterns: Qt,
     defaultParseWidth: "any",
     valueCallback: (t) => t + 1
   }),
-  month: k({
+  month: v({
     matchPatterns: At,
     defaultMatchWidth: "wide",
     parsePatterns: Bt,
     defaultParseWidth: "any"
   }),
-  day: k({
+  day: v({
     matchPatterns: Gt,
     defaultMatchWidth: "wide",
     parsePatterns: Vt,
     defaultParseWidth: "any"
   }),
-  dayPeriod: k({
+  dayPeriod: v({
     matchPatterns: $t,
     defaultMatchWidth: "any",
     parsePatterns: Jt,
@@ -554,8 +570,8 @@ const Ht = /^(\d+)(th|st|nd|rd)?/i, Rt = /\d+/i, Lt = {
 }, G = {
   code: "en-US",
   formatDistance: Dt,
-  formatLong: vt,
-  formatRelative: pt,
+  formatLong: xt,
+  formatRelative: kt,
   localize: Ct,
   match: Ut,
   options: {
@@ -572,21 +588,21 @@ function Zt(t) {
   return Math.round(n / A) + 1;
 }
 function V(t, e) {
-  var h, w, l, y;
-  const n = d(t), r = n.getFullYear(), a = T(), o = (e == null ? void 0 : e.firstWeekContainsDate) ?? ((w = (h = e == null ? void 0 : e.locale) == null ? void 0 : h.options) == null ? void 0 : w.firstWeekContainsDate) ?? a.firstWeekContainsDate ?? ((y = (l = a.locale) == null ? void 0 : l.options) == null ? void 0 : y.firstWeekContainsDate) ?? 1, s = D(t, 0);
+  var l, w, m, y;
+  const n = d(t), r = n.getFullYear(), a = T(), o = (e == null ? void 0 : e.firstWeekContainsDate) ?? ((w = (l = e == null ? void 0 : e.locale) == null ? void 0 : l.options) == null ? void 0 : w.firstWeekContainsDate) ?? a.firstWeekContainsDate ?? ((y = (m = a.locale) == null ? void 0 : m.options) == null ? void 0 : y.firstWeekContainsDate) ?? 1, s = D(t, 0);
   s.setFullYear(r + 1, 0, o), s.setHours(0, 0, 0, 0);
-  const i = p(s, e), u = D(t, 0);
+  const i = k(s, e), u = D(t, 0);
   u.setFullYear(r, 0, o), u.setHours(0, 0, 0, 0);
-  const f = p(u, e);
+  const f = k(u, e);
   return n.getTime() >= i.getTime() ? r + 1 : n.getTime() >= f.getTime() ? r : r - 1;
 }
 function zt(t, e) {
-  var i, u, f, h;
-  const n = T(), r = (e == null ? void 0 : e.firstWeekContainsDate) ?? ((u = (i = e == null ? void 0 : e.locale) == null ? void 0 : i.options) == null ? void 0 : u.firstWeekContainsDate) ?? n.firstWeekContainsDate ?? ((h = (f = n.locale) == null ? void 0 : f.options) == null ? void 0 : h.firstWeekContainsDate) ?? 1, a = V(t, e), o = D(t, 0);
-  return o.setFullYear(a, 0, r), o.setHours(0, 0, 0, 0), p(o, e);
+  var i, u, f, l;
+  const n = T(), r = (e == null ? void 0 : e.firstWeekContainsDate) ?? ((u = (i = e == null ? void 0 : e.locale) == null ? void 0 : i.options) == null ? void 0 : u.firstWeekContainsDate) ?? n.firstWeekContainsDate ?? ((l = (f = n.locale) == null ? void 0 : f.options) == null ? void 0 : l.firstWeekContainsDate) ?? 1, a = V(t, e), o = D(t, 0);
+  return o.setFullYear(a, 0, r), o.setHours(0, 0, 0, 0), k(o, e);
 }
 function te(t, e) {
-  const n = d(t), r = +p(n, e) - +zt(n, e);
+  const n = d(t), r = +k(n, e) - +zt(n, e);
   return Math.round(r / A) + 1;
 }
 function c(t, e) {
@@ -647,7 +663,7 @@ const M = {
     );
     return c(a, e.length);
   }
-}, P = {
+}, O = {
   am: "am",
   pm: "pm",
   midnight: "midnight",
@@ -991,7 +1007,7 @@ const M = {
   b: function(t, e, n) {
     const r = t.getHours();
     let a;
-    switch (r === 12 ? a = P.noon : r === 0 ? a = P.midnight : a = r / 12 >= 1 ? "pm" : "am", e) {
+    switch (r === 12 ? a = O.noon : r === 0 ? a = O.midnight : a = r / 12 >= 1 ? "pm" : "am", e) {
       case "b":
       case "bb":
         return n.dayPeriod(a, {
@@ -1020,7 +1036,7 @@ const M = {
   B: function(t, e, n) {
     const r = t.getHours();
     let a;
-    switch (r >= 17 ? a = P.evening : r >= 12 ? a = P.afternoon : r >= 4 ? a = P.morning : a = P.night, e) {
+    switch (r >= 17 ? a = O.evening : r >= 12 ? a = O.afternoon : r >= 4 ? a = O.morning : a = O.night, e) {
       case "B":
       case "BB":
       case "BBB":
@@ -1085,11 +1101,11 @@ const M = {
         return I(r);
       case "XXXX":
       case "XX":
-        return O(r);
+        return p(r);
       case "XXXXX":
       case "XXX":
       default:
-        return O(r, ":");
+        return p(r, ":");
     }
   },
   // Timezone (ISO-8601. If offset is 0, output is `'+00:00'` or equivalent)
@@ -1100,11 +1116,11 @@ const M = {
         return I(r);
       case "xxxx":
       case "xx":
-        return O(r);
+        return p(r);
       case "xxxxx":
       case "xxx":
       default:
-        return O(r, ":");
+        return p(r, ":");
     }
   },
   // Timezone (GMT)
@@ -1117,7 +1133,7 @@ const M = {
         return "GMT" + j(r, ":");
       case "OOOO":
       default:
-        return "GMT" + O(r, ":");
+        return "GMT" + p(r, ":");
     }
   },
   // Timezone (specific non-location)
@@ -1130,7 +1146,7 @@ const M = {
         return "GMT" + j(r, ":");
       case "zzzz":
       default:
-        return "GMT" + O(r, ":");
+        return "GMT" + p(r, ":");
     }
   },
   // Seconds timestamp
@@ -1149,9 +1165,9 @@ function j(t, e = "") {
   return o === 0 ? n + String(a) : n + String(a) + e + c(o, 2);
 }
 function I(t, e) {
-  return t % 60 === 0 ? (t > 0 ? "-" : "+") + c(Math.abs(t) / 60, 2) : O(t, e);
+  return t % 60 === 0 ? (t > 0 ? "-" : "+") + c(Math.abs(t) / 60, 2) : p(t, e);
 }
-function O(t, e = "") {
+function p(t, e = "") {
   const n = t > 0 ? "-" : "+", r = Math.abs(t), a = c(Math.trunc(r / 60), 2), o = c(r % 60, 2);
   return n + a + e + o;
 }
@@ -1218,32 +1234,32 @@ function ue(t, e, n) {
   const r = t[0] === "Y" ? "years" : "days of the month";
   return `Use \`${t.toLowerCase()}\` instead of \`${t}\` (in \`${e}\`) for formatting ${r} to the input \`${n}\`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md`;
 }
-const de = /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g, fe = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g, he = /^'([^]*?)'?$/, le = /''/g, me = /[a-zA-Z]/;
+const de = /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g, fe = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g, le = /^'([^]*?)'?$/, me = /''/g, he = /[a-zA-Z]/;
 function ge(t, e, n) {
-  var h, w, l, y;
-  const r = T(), a = r.locale ?? G, o = r.firstWeekContainsDate ?? ((w = (h = r.locale) == null ? void 0 : h.options) == null ? void 0 : w.firstWeekContainsDate) ?? 1, s = r.weekStartsOn ?? ((y = (l = r.locale) == null ? void 0 : l.options) == null ? void 0 : y.weekStartsOn) ?? 0, i = d(t);
+  var l, w, m, y;
+  const r = T(), a = r.locale ?? G, o = r.firstWeekContainsDate ?? ((w = (l = r.locale) == null ? void 0 : l.options) == null ? void 0 : w.firstWeekContainsDate) ?? 1, s = r.weekStartsOn ?? ((y = (m = r.locale) == null ? void 0 : m.options) == null ? void 0 : y.weekStartsOn) ?? 0, i = d(t);
   if (!ut(i))
     throw new RangeError("Invalid time value");
-  let u = e.match(fe).map((m) => {
-    const g = m[0];
+  let u = e.match(fe).map((h) => {
+    const g = h[0];
     if (g === "p" || g === "P") {
       const E = ne[g];
-      return E(m, a.formatLong);
+      return E(h, a.formatLong);
     }
-    return m;
-  }).join("").match(de).map((m) => {
-    if (m === "''")
+    return h;
+  }).join("").match(de).map((h) => {
+    if (h === "''")
       return { isToken: !1, value: "'" };
-    const g = m[0];
+    const g = h[0];
     if (g === "'")
-      return { isToken: !1, value: we(m) };
+      return { isToken: !1, value: we(h) };
     if (L[g])
-      return { isToken: !0, value: m };
-    if (g.match(me))
+      return { isToken: !0, value: h };
+    if (g.match(he))
       throw new RangeError(
         "Format string contains an unescaped latin alphabet character `" + g + "`"
       );
-    return { isToken: !1, value: m };
+    return { isToken: !1, value: h };
   });
   a.localize.preprocessor && (u = a.localize.preprocessor(i, u));
   const f = {
@@ -1251,17 +1267,17 @@ function ge(t, e, n) {
     weekStartsOn: s,
     locale: a
   };
-  return u.map((m) => {
-    if (!m.isToken) return m.value;
-    const g = m.value;
+  return u.map((h) => {
+    if (!h.isToken) return h.value;
+    const g = h.value;
     (se(g) || ie(g)) && ce(g, e, String(t));
     const E = L[g[0]];
     return E(i, g, a.localize, f);
   }).join("");
 }
 function we(t) {
-  const e = t.match(he);
-  return e ? e[1].replace(le, "'") : t;
+  const e = t.match(le);
+  return e ? e[1].replace(me, "'") : t;
 }
 function ye(t, e, n) {
   const r = T(), a = (n == null ? void 0 : n.locale) ?? r.locale ?? G, o = 2520, s = Y(t, e);
@@ -1273,32 +1289,32 @@ function ye(t, e, n) {
   });
   let u, f;
   s > 0 ? (u = d(e), f = d(t)) : (u = d(t), f = d(e));
-  const h = yt(f, u), w = (N(f) - N(u)) / 1e3, l = Math.round((h - w) / 60);
+  const l = yt(f, u), w = (N(f) - N(u)) / 1e3, m = Math.round((l - w) / 60);
   let y;
-  if (l < 2)
-    return n != null && n.includeSeconds ? h < 5 ? a.formatDistance("lessThanXSeconds", 5, i) : h < 10 ? a.formatDistance("lessThanXSeconds", 10, i) : h < 20 ? a.formatDistance("lessThanXSeconds", 20, i) : h < 40 ? a.formatDistance("halfAMinute", 0, i) : h < 60 ? a.formatDistance("lessThanXMinutes", 1, i) : a.formatDistance("xMinutes", 1, i) : l === 0 ? a.formatDistance("lessThanXMinutes", 1, i) : a.formatDistance("xMinutes", l, i);
-  if (l < 45)
-    return a.formatDistance("xMinutes", l, i);
-  if (l < 90)
+  if (m < 2)
+    return n != null && n.includeSeconds ? l < 5 ? a.formatDistance("lessThanXSeconds", 5, i) : l < 10 ? a.formatDistance("lessThanXSeconds", 10, i) : l < 20 ? a.formatDistance("lessThanXSeconds", 20, i) : l < 40 ? a.formatDistance("halfAMinute", 0, i) : l < 60 ? a.formatDistance("lessThanXMinutes", 1, i) : a.formatDistance("xMinutes", 1, i) : m === 0 ? a.formatDistance("lessThanXMinutes", 1, i) : a.formatDistance("xMinutes", m, i);
+  if (m < 45)
+    return a.formatDistance("xMinutes", m, i);
+  if (m < 90)
     return a.formatDistance("aboutXHours", 1, i);
-  if (l < H) {
-    const m = Math.round(l / 60);
-    return a.formatDistance("aboutXHours", m, i);
+  if (m < H) {
+    const h = Math.round(m / 60);
+    return a.formatDistance("aboutXHours", h, i);
   } else {
-    if (l < o)
+    if (m < o)
       return a.formatDistance("xDays", 1, i);
-    if (l < W) {
-      const m = Math.round(l / H);
-      return a.formatDistance("xDays", m, i);
-    } else if (l < W * 2)
-      return y = Math.round(l / W), a.formatDistance("aboutXMonths", y, i);
+    if (m < W) {
+      const h = Math.round(m / H);
+      return a.formatDistance("xDays", h, i);
+    } else if (m < W * 2)
+      return y = Math.round(m / W), a.formatDistance("aboutXMonths", y, i);
   }
   if (y = wt(f, u), y < 12) {
-    const m = Math.round(l / W);
-    return a.formatDistance("xMonths", m, i);
+    const h = Math.round(m / W);
+    return a.formatDistance("xMonths", h, i);
   } else {
-    const m = y % 12, g = Math.trunc(y / 12);
-    return m < 3 ? a.formatDistance("aboutXYears", g, i) : m < 9 ? a.formatDistance("overXYears", g, i) : a.formatDistance("almostXYears", g + 1, i);
+    const h = y % 12, g = Math.trunc(y / 12);
+    return h < 3 ? a.formatDistance("aboutXYears", g, i) : h < 9 ? a.formatDistance("overXYears", g, i) : a.formatDistance("almostXYears", g + 1, i);
   }
 }
 function be(t, e) {
@@ -1306,21 +1322,21 @@ function be(t, e) {
 }
 const Me = (t, e) => {
   switch (t) {
-    case x.warning:
+    case P.warning:
       return e.colors.status.warning.onsurface;
-    case x.error:
+    case P.error:
       return e.colors.status.error.onsurface;
-    case x.success:
+    case P.success:
       return e.colors.status.success.onsurface;
-    case x.generic:
+    case P.generic:
       return e.colors.status.generic.onsurface;
-    case x.info:
+    case P.info:
     default:
       return e.colors.status.info.onsurface;
   }
-}, _e = ({
+}, ze = ({
   message: t,
-  state: e = x.info,
+  state: e = P.info,
   date: n,
   action: r,
   onArrowClick: a,
@@ -1328,13 +1344,13 @@ const Me = (t, e) => {
   isUnread: s = !0,
   hasFormattedDate: i = !1
 }) => {
-  const u = U();
+  const u = J();
   Me(e, u), u.colors.interactive.utility.border, u.colors.interactive.utility.onsurface;
-  const f = " • ", h = n ? ge(new Date(n), "MMM d, h:mma") : "", w = n ? be(new Date(n), { addSuffix: !0 }) : "", l = i ? `${w}${f}${h}` : w, y = o === _.small ? S.body1 : S.body2;
-  return /* @__PURE__ */ X(K, { state: e, size: o, isUnread: s, children: [
-    s ? /* @__PURE__ */ b(Z, { state: e, size: o }) : /* @__PURE__ */ b("div", { style: { width: 8 } }),
-    /* @__PURE__ */ b(J, { state: e }),
-    /* @__PURE__ */ b(z, { size: o, children: /* @__PURE__ */ X("div", { children: [
+  const f = " • ", l = n ? ge(new Date(n), "MMM d, h:mma") : "", w = n ? be(new Date(n), { addSuffix: !0 }) : "", m = i ? `${w}${f}${l}` : w, y = o === _.small ? S.body1 : S.body2;
+  return /* @__PURE__ */ X(Z, { state: e, size: o, $isUnread: s, children: [
+    s ? /* @__PURE__ */ b(z, { state: e, size: o }) : /* @__PURE__ */ b("div", { style: { width: 8 } }),
+    /* @__PURE__ */ b(K, { state: e }),
+    /* @__PURE__ */ b(tt, { size: o, children: /* @__PURE__ */ X("div", { children: [
       /* @__PURE__ */ b(
         C,
         {
@@ -1350,21 +1366,30 @@ const Me = (t, e) => {
           variant: y,
           color: u.colors.onsurface["copy-light"],
           isText: !0,
-          children: l
+          children: m
         }
       ) })
     ] }) }),
-    r ? /* @__PURE__ */ b(tt, { onClick: r.onClick, children: /* @__PURE__ */ b(
-      C,
+    r ? /* @__PURE__ */ b(
+      U,
       {
-        variant: S.body1,
-        isText: !0,
-        children: r.label
+        themeType: "utility",
+        onClick: r.onClick,
+        size: "small",
+        style: { pointerEvents: "all" },
+        children: /* @__PURE__ */ b(
+          C,
+          {
+            variant: S.body1,
+            isText: !0,
+            children: r.label
+          }
+        )
       }
-    ) }) : null,
+    ) : null,
     a ? /* @__PURE__ */ b(et, { onClick: a, children: /* @__PURE__ */ b(nt, {}) }) : null
   ] });
 };
 export {
-  _e as default
+  ze as default
 };

package/dist/components/Notification/NotificationBadge/NotificationBadge.d.ts

@@ -0,0 +1,6 @@
+export interface BadgeProps {
+    badge?: string;
+    state?: string;
+}
+declare const NotificationBadge: ({ badge, state, }: BadgeProps) => import("react/jsx-runtime").JSX.Element;
+export default NotificationBadge;

package/dist/components/Notification/NotificationBadge/NotificationBadge.js

@@ -0,0 +1,49 @@
+import { jsx as t, jsxs as a } from "react/jsx-runtime";
+import p from "./icons/Appointment.js";
+import i from "./icons/ASN.js";
+import s from "./icons/Inventory.js";
+import c from "./icons/Parcel.js";
+import d from "./icons/Product.js";
+import f from "./icons/Route.js";
+import u from "./icons/Shipment.js";
+import g from "./icons/ShoppingCart.js";
+import h from "./icons/System.js";
+import { BADGE as r, STATE as l } from "../../../constants/index.js";
+import { n as B } from "../../../styled-components.browser.esm-CZ1XM4o4.js";
+import { BadgeWrapper as S, Badge as C, BadgeState as v } from "./styles.js";
+import { getIconColor as y, getBadgeStateIcon as x } from "../../../utils/icon-util.js";
+const A = (e) => {
+  switch (e) {
+    case r.appointment:
+      return /* @__PURE__ */ t(p, {});
+    case r.asn:
+      return /* @__PURE__ */ t(i, {});
+    case r.inventory:
+      return /* @__PURE__ */ t(s, {});
+    case r.parcel:
+      return /* @__PURE__ */ t(c, {});
+    case r.product:
+      return /* @__PURE__ */ t(d, {});
+    case r.route:
+      return /* @__PURE__ */ t(f, {});
+    case r.shipment:
+      return /* @__PURE__ */ t(u, {});
+    case r.shoppingCart:
+      return /* @__PURE__ */ t(g, {});
+    case r.system:
+    default:
+      return /* @__PURE__ */ t(h, {});
+  }
+}, q = ({
+  badge: e = r.product,
+  state: o = l.info
+}) => {
+  const m = B(), n = y(o, m);
+  return /* @__PURE__ */ t(S, { children: /* @__PURE__ */ a(C, { "data-testid": "Badge", children: [
+    /* @__PURE__ */ t(v, { "data-testid": "BadgeState", color: n, children: x(o, n) }),
+    A(e)
+  ] }) });
+};
+export {
+  q as default
+};

package/dist/components/Notification/NotificationBadge/__stories__/NotificationBadge.stories.d.ts

@@ -0,0 +1,13 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { default as NotificationBadge } from '../NotificationBadge';
+
+declare const meta: Meta<typeof NotificationBadge>;
+export default meta;
+type Story = StoryObj<typeof NotificationBadge>;
+export declare const Default: Story;
+export declare const Success: Story;
+export declare const Warning: Story;
+export declare const Removed: Story;
+export declare const Progress: Story;
+export declare const Error: Story;
+export declare const Info: Story;

package/dist/components/Notification/NotificationBadge/__tests__/NotificationBadge.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Notification/NotificationBadge/__tests__/NotificationBadge.test.js

@@ -0,0 +1,18 @@
+import { jsx as r } from "react/jsx-runtime";
+import n from "../NotificationBadge.js";
+import { BADGE as a, STATE as d } from "../../../../constants/index.js";
+import { a as i } from "../../../../setup-CKu7-AfI.js";
+describe("<NotificationBadge />", () => {
+  let e;
+  beforeEach(() => {
+    e = {
+      badge: a.product,
+      state: d.info
+    };
+  });
+  const o = () => i(/* @__PURE__ */ r(n, { ...e }));
+  it("should render badge and state elements", () => {
+    const { getByTestId: t } = o();
+    expect(t("Badge")).toBeInTheDocument(), expect(t("BadgeState")).toBeInTheDocument();
+  });
+});

package/dist/components/Notification/NotificationBadge/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './NotificationBadge';
+export type { BadgeProps } from './NotificationBadge';

package/dist/components/Notification/NotificationBadge/index.js

@@ -0,0 +1,4 @@
+import { default as o } from "./NotificationBadge.js";
+export {
+  o as default
+};