@gearbox-protocol/ui-kit 3.14.0-next.6 → 3.14.0-next.60

package/dist/esm/components/composites/credit-account-history/cells/token-list.js

@@ -0,0 +1,43 @@
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { shortAddress as s } from "@gearbox-protocol/sdk";
+import { ShortString as p } from "../../../short-string/short-string.js";
+import { TokenSymbol as h } from "../../../token-symbol/token-symbol.js";
+import "../../../tooltip/simple-tooltip.js";
+import { TooltipProvider as f, Tooltip as g, TooltipTrigger as u, TooltipContent as N } from "../../../tooltip/tooltip.js";
+import { useIsMobile as v } from "../../../../hooks/use-media-query.js";
+import { ZERO_ADDRESS as n } from "../types.js";
+function b({
+  data: a,
+  tokensList: x
+}) {
+  const r = v();
+  return /* @__PURE__ */ e("div", { className: "flex flex-col gap-1 sm:gap-2", children: a.map(({ token: t, description: o, account: i }) => {
+    const c = (t || n).toLowerCase(), m = x[c], d = `${t || n}-${i || ""}`;
+    return /* @__PURE__ */ l("div", { className: "flex items-center min-w-0", children: [
+      /* @__PURE__ */ e("div", { className: "mr-1 sm:mr-1.5 flex-shrink-0", children: i ? /* @__PURE__ */ e("span", { className: "text-[10px] text-muted-foreground", children: s(i) }) : /* @__PURE__ */ e(
+        h,
+        {
+          maxLength: r ? 6 : 12,
+          token: m,
+          size: r ? 20 : 29
+        }
+      ) }),
+      /* @__PURE__ */ l("div", { className: "flex-1 min-w-0", children: [
+        o && /* @__PURE__ */ e(
+          "div",
+          {
+            className: i ? "text-[9px] sm:text-[10px]" : "text-[10px] sm:text-xs",
+            children: o
+          }
+        ),
+        m ? /* @__PURE__ */ e("div", { className: "text-[11px] sm:text-sm leading-tight sm:leading-[18px] truncate", children: /* @__PURE__ */ e(p, { maxLength: r ? 6 : 12, children: m.title }) }) : t && /* @__PURE__ */ e(f, { delayDuration: 0, children: /* @__PURE__ */ l(g, { children: [
+          /* @__PURE__ */ e(u, { asChild: !0, children: /* @__PURE__ */ e("div", { className: "text-[11px] sm:text-sm leading-tight sm:leading-[18px] truncate text-muted-foreground cursor-help", children: s(t) }) }),
+          /* @__PURE__ */ e(N, { className: "text-xs", children: t })
+        ] }) })
+      ] })
+    ] }, d);
+  }) });
+}
+export {
+  b as TokenList
+};

package/dist/esm/components/composites/credit-account-history/credit-account-history.js

@@ -0,0 +1,46 @@
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import { memo as p } from "react";
+import { GridTable as h, GridTableHeader as x, GridTableRow as b, GridTableHead as r, GridTableBody as u } from "../../table/grid-table.js";
+import { TableLoaderGuard as y } from "../../table/table-loader-guard.js";
+import { FormattedMessageTyped as s } from "../../typed-intl/index.js";
+import { useIsMobile as f } from "../../../hooks/use-media-query.js";
+import { HistoryBody as H } from "./body.js";
+const B = p(function({
+  dataList: m,
+  creditManager: o,
+  tokens: i,
+  protocols: d,
+  isLoading: l = !1,
+  explorerUrl: n
+}) {
+  const a = l || !o || Object.keys(i).length === 0, t = f();
+  return /* @__PURE__ */ c(h, { cols: t ? 1 : 3, children: [
+    !t && /* @__PURE__ */ e(x, { children: /* @__PURE__ */ c(b, { noHover: !0, children: [
+      /* @__PURE__ */ e(r, { className: "text-xs sm:text-sm", children: /* @__PURE__ */ e(s, { messageId: "components.creditAccountHistory.table.protocol" }) }),
+      /* @__PURE__ */ e(r, { className: "text-xs sm:text-sm", children: /* @__PURE__ */ e(s, { messageId: "components.creditAccountHistory.table.operation" }) }),
+      /* @__PURE__ */ e(r, { className: "text-xs sm:text-sm", children: /* @__PURE__ */ e(s, { messageId: "components.creditAccountHistory.table.details" }) })
+    ] }) }),
+    /* @__PURE__ */ e(
+      y,
+      {
+        showGuard: a,
+        rows: 5,
+        columns: t ? 1 : 3,
+        height: "40px",
+        children: o && /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(
+          H,
+          {
+            dataList: m,
+            creditManager: o,
+            tokens: i,
+            protocols: d,
+            explorerUrl: n
+          }
+        ) })
+      }
+    )
+  ] });
+});
+export {
+  B as CreditAccountHistory
+};

package/dist/esm/components/composites/credit-account-history/index.js

@@ -0,0 +1,8 @@
+import { CreditAccountHistory as t } from "./credit-account-history.js";
+import { GEARBOX_PROTOCOL_INFO as i, ZERO_ADDRESS as e, isMulticallOperation as R } from "./types.js";
+export {
+  t as CreditAccountHistory,
+  i as GEARBOX_PROTOCOL_INFO,
+  e as ZERO_ADDRESS,
+  R as isMulticallOperation
+};

package/dist/esm/components/composites/credit-account-history/line.js

@@ -0,0 +1,125 @@
+import { jsxs as o, Fragment as a, jsx as e } from "react/jsx-runtime";
+import { formatLeverage as C } from "@gearbox-protocol/sdk";
+import { GridTableRow as l, GridTableCell as s } from "../../table/grid-table.js";
+import { TableLineSm as I, TableCellSm as p } from "../../table/table-sm.js";
+import { FormattedMessageTyped as d } from "../../typed-intl/index.js";
+import { useIsMobile as M } from "../../../hooks/use-media-query.js";
+import "react";
+import { cn as n } from "../../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import { tokenTemplate as R } from "../../../utils/templates.js";
+import "luxon";
+import "../../../utils/z-index.js";
+import { Details as j } from "./cells/details.js";
+import { Hash as O } from "./cells/hash.js";
+import { Protocol as D } from "./cells/protocol.js";
+import "../../tooltip/simple-tooltip.js";
+import "../../tooltip/tooltip.js";
+import "../../token-symbol/token-symbol.js";
+import { GEARBOX_PROTOCOL_INFO as F, isMulticallOperation as G } from "./types.js";
+function oe({
+  data: t,
+  details: T,
+  tokens: h,
+  protocols: y,
+  hideBorder: m,
+  index: f,
+  underlyingToken: A,
+  explorerUrl: i
+}) {
+  const L = M(), u = y?.[t.protocol.toLowerCase()] || F, c = G(t), r = f.index === 0, x = r && f.outOf === 0 || !r, b = () => {
+    if (t.operationType === "OpenCreditAccount") {
+      const v = t, w = h[A];
+      return /* @__PURE__ */ o(a, { children: [
+        " ",
+        "(",
+        R(v.from, w),
+        " ",
+        ">",
+        " x",
+        C(v.leverage),
+        ")"
+      ] });
+    }
+    return null;
+  }, N = () => u && /* @__PURE__ */ e(D, { isUnderlying: !r, protocol: u }), g = () => c ? null : t.operation, H = () => /* @__PURE__ */ e(j, { tokensList: h, data: T });
+  return L ? /* @__PURE__ */ o(a, { children: [
+    r && /* @__PURE__ */ e(l, { noHover: !0, children: /* @__PURE__ */ e(s, { span: "full", className: "pb-2 pt-4", children: /* @__PURE__ */ o("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ o("div", { className: "text-xs", children: [
+        t.date,
+        " ",
+        t.time,
+        c && ` - ${t.operation}`,
+        b()
+      ] }),
+      i && /* @__PURE__ */ e(O, { txHash: t.txHash, etherscanAddress: i })
+    ] }) }) }),
+    x && /* @__PURE__ */ e(
+      l,
+      {
+        noHover: !0,
+        className: n(m && "[&>*]:!border-b-0"),
+        children: /* @__PURE__ */ e(s, { span: "full", className: n(!r && "pl-4"), children: /* @__PURE__ */ o(I, { columns: 3, columnsXs: 2, columnsSm: 3, children: [
+          /* @__PURE__ */ e(
+            p,
+            {
+              title: /* @__PURE__ */ e(d, { messageId: "components.creditAccountHistory.table.protocol" }),
+              children: N()
+            }
+          ),
+          /* @__PURE__ */ e(
+            p,
+            {
+              title: /* @__PURE__ */ e(d, { messageId: "components.creditAccountHistory.table.operation" }),
+              children: g()
+            }
+          ),
+          /* @__PURE__ */ e(
+            p,
+            {
+              title: /* @__PURE__ */ e(d, { messageId: "components.creditAccountHistory.table.details" }),
+              className: "items-start",
+              children: H()
+            }
+          )
+        ] }) })
+      }
+    )
+  ] }) : /* @__PURE__ */ o(a, { children: [
+    r && /* @__PURE__ */ e(l, { noHover: !0, children: /* @__PURE__ */ e(s, { span: "full", className: "pb-2 pt-4", children: /* @__PURE__ */ o("div", { className: "flex flex-col sm:flex-row justify-between sm:items-center gap-1 sm:gap-2", children: [
+      /* @__PURE__ */ o("div", { className: "text-xs sm:text-sm", children: [
+        t.date,
+        " ",
+        t.time,
+        c && ` - ${t.operation}`,
+        b()
+      ] }),
+      i && /* @__PURE__ */ e(O, { txHash: t.txHash, etherscanAddress: i })
+    ] }) }) }),
+    x && /* @__PURE__ */ o(
+      l,
+      {
+        className: n(
+          !r && !m && "[&>*]:!border-t-0",
+          m && "[&>*]:!border-b-0",
+          "hover:[&>*]:bg-transparent"
+        ),
+        children: [
+          /* @__PURE__ */ e(
+            s,
+            {
+              className: n(r ? "" : "pl-8 sm:pl-4", "text-xs sm:text-sm"),
+              children: N()
+            }
+          ),
+          /* @__PURE__ */ e(s, { className: "text-xs sm:text-sm", children: g() }),
+          /* @__PURE__ */ e(s, { className: "text-xs sm:text-sm", children: H() })
+        ]
+      }
+    )
+  ] });
+}
+export {
+  oe as HistoryLine
+};

package/dist/esm/components/composites/credit-account-history/types.js

@@ -0,0 +1,9 @@
+const l = "0x0000000000000000000000000000000000000000", t = {
+  name: "Gearbox",
+  icon: "/logo/logo_symbol.png"
+}, c = (o) => typeof o == "object" && !!o && !!o.multicall;
+export {
+  t as GEARBOX_PROTOCOL_INFO,
+  l as ZERO_ADDRESS,
+  c as isMulticallOperation
+};

package/dist/esm/components/composites/index.js

@@ -1,81 +1,89 @@
-import { OracleComponent as r } from "./oracles-and-lt-table/oracle-component.js";
-import { OraclesAndLTLineView as a } from "./oracles-and-lt-table/oracles-and-lt-line-view.js";
-import { OraclesAndLTTableView as m } from "./oracles-and-lt-table/oracles-and-lt-table.js";
-import { OraclesAndLTTableHead as s } from "./oracles-and-lt-table/oracles-and-lt-table-head.js";
-import { OraclesList as f, getPriceFeedInfo as i } from "./oracles-and-lt-table/oracles-list.js";
-import { PoolAssetsTable as x } from "./pool-assets-table/pool-assets-table.js";
-import { PoolAssetsTableHead as C } from "./pool-assets-table/pool-assets-table-head.js";
-import { PoolAssetsTableRow as P } from "./pool-assets-table/pool-assets-table-row.js";
-import { overflowContainerClassName as w, overflowWrapClassName as g } from "./pool-credit-manager-info/overflow-layout.js";
-import { PoolCreditManagerInfo as A } from "./pool-credit-manager-info/pool-credit-manager-info.js";
-import { PoolCreditManagersTable as F } from "./pool-credit-managers-table/pool-credit-managers-table.js";
-import { PoolCreditManagersTableHead as L } from "./pool-credit-managers-table/pool-credit-managers-table-head.js";
-import { PoolCreditManagersTableRow as O } from "./pool-credit-managers-table/pool-credit-managers-table-row.js";
-import { balanceColumn as H, borrowApyColumn as M, borrowedColumn as N, collateralColumn as V, customColumn as W, defaultPoolName as I, poolColumn as Y, supplyApyColumn as z, supplyColumn as D, utilizationColumn as G } from "./pool-table/columns.js";
-import { PoolTable as h } from "./pool-table/pool-table.js";
-import { customStrategyColumn as k, strategyColumn as q, strategyLeverageColumn as B, strategyRewardsColumn as E } from "./strategies-table/columns.js";
-import { APYFeature as K, APYFeatureTooltip as Q } from "./strategies-table/components/apy-feature/apy-feature.js";
-import { RWAFeature as X, StrategiesRewardsCell as _, StrategyPoints as $, ZeroSlippageFeature as oo } from "./strategies-table/components/cells/cells.js";
-import { DisabledWrap as ro, Plus as to, TitleGrid as ao } from "./strategies-table/components/cells/cells.styles.js";
-import { Feature as mo } from "./strategies-table/components/feature/feature.js";
-import { FeatureRoot as so } from "./strategies-table/components/feature/feature.styles.js";
-import { StrategiesTableNotFoundLine as fo } from "./strategies-table/components/not-found-line.js";
-import { PointsFeature as uo, PointsFeatureTooltip as xo, PointsLabel as Co } from "./strategies-table/components/points-feature/points-feature.js";
-import { RewardsTooltip as Po, RewardsTooltipHover as bo } from "./strategies-table/components/rewards-tooltip/rewards-tooltip.js";
-import { RewardsTooltipRoot as go } from "./strategies-table/components/rewards-tooltip/rewards-tooltip-root.js";
-import { RewardsTooltipView as Ao } from "./strategies-table/components/rewards-tooltip/rewards-tooltip-view.js";
-import { RewardsTooltipContent as Fo } from "./strategies-table/components/rewards-tooltip/tooltip-content.js";
-import { StrategiesTable as Lo } from "./strategies-table/components/strategies-table.js";
+import { CreditAccountHistory as r } from "./credit-account-history/credit-account-history.js";
+import { GEARBOX_PROTOCOL_INFO as a, ZERO_ADDRESS as l, isMulticallOperation as p } from "./credit-account-history/types.js";
+import { NotificationCenter as s } from "./notification-center/notification-center.js";
+import { OracleComponent as n } from "./oracles-and-lt-table/oracle-component.js";
+import { OraclesAndLTLineView as u } from "./oracles-and-lt-table/oracles-and-lt-line-view.js";
+import { OraclesAndLTTableView as C } from "./oracles-and-lt-table/oracles-and-lt-table.js";
+import { OraclesAndLTTableHead as T } from "./oracles-and-lt-table/oracles-and-lt-table-head.js";
+import { OraclesList as b, getPriceFeedInfo as w } from "./oracles-and-lt-table/oracles-list.js";
+import { PoolAssetsTable as g } from "./pool-assets-table/pool-assets-table.js";
+import { PoolAssetsTableHead as A } from "./pool-assets-table/pool-assets-table-head.js";
+import { PoolAssetsTableRow as F } from "./pool-assets-table/pool-assets-table-row.js";
+import { overflowContainerClassName as L, overflowWrapClassName as S } from "./pool-credit-manager-info/overflow-layout.js";
+import { PoolCreditManagerInfo as H } from "./pool-credit-manager-info/pool-credit-manager-info.js";
+import { PoolCreditManagersTable as v } from "./pool-credit-managers-table/pool-credit-managers-table.js";
+import { PoolCreditManagersTableHead as E } from "./pool-credit-managers-table/pool-credit-managers-table-head.js";
+import { PoolCreditManagersTableRow as V } from "./pool-credit-managers-table/pool-credit-managers-table-row.js";
+import { balanceColumn as _, borrowApyColumn as G, borrowedColumn as Y, collateralColumn as Z, customColumn as z, defaultPoolName as B, poolColumn as X, supplyApyColumn as h, supplyColumn as j, utilizationColumn as k } from "./pool-table/columns.js";
+import { PoolTable as J } from "./pool-table/pool-table.js";
+import { customStrategyColumn as Q, strategyColumn as U, strategyLeverageColumn as $, strategyRewardsColumn as oo } from "./strategies-table/columns.js";
+import { APYFeature as ro, APYFeatureTooltip as to } from "./strategies-table/components/apy-feature/apy-feature.js";
+import { RWAFeature as lo, StrategiesRewardsCell as po, StrategyPoints as mo, ZeroSlippageFeature as so } from "./strategies-table/components/cells/cells.js";
+import { DisabledWrap as no, Plus as fo, TitleGrid as uo } from "./strategies-table/components/cells/cells.styles.js";
+import { Feature as Co } from "./strategies-table/components/feature/feature.js";
+import { FeatureRoot as Po } from "./strategies-table/components/feature/feature.styles.js";
+import { StrategiesTableNotFoundLine as wo } from "./strategies-table/components/not-found-line.js";
+import { PointsFeature as go, PointsFeatureTooltip as co, PointsLabel as Ao } from "./strategies-table/components/points-feature/points-feature.js";
+import { RewardsTooltip as Fo, RewardsTooltipHover as yo } from "./strategies-table/components/rewards-tooltip/rewards-tooltip.js";
+import { RewardsTooltipRoot as So } from "./strategies-table/components/rewards-tooltip/rewards-tooltip-root.js";
+import { RewardsTooltipView as Ho } from "./strategies-table/components/rewards-tooltip/rewards-tooltip-view.js";
+import { RewardsTooltipContent as vo } from "./strategies-table/components/rewards-tooltip/tooltip-content.js";
+import { StrategiesTable as Eo } from "./strategies-table/components/strategies-table.js";
 export {
-  K as APYFeature,
-  Q as APYFeatureTooltip,
-  ro as DisabledWrap,
-  mo as Feature,
-  so as FeatureRoot,
-  r as OracleComponent,
-  a as OraclesAndLTLineView,
-  s as OraclesAndLTTableHead,
-  m as OraclesAndLTTableView,
-  f as OraclesList,
-  to as Plus,
-  uo as PointsFeature,
-  xo as PointsFeatureTooltip,
-  Co as PointsLabel,
-  x as PoolAssetsTable,
-  C as PoolAssetsTableHead,
-  P as PoolAssetsTableRow,
-  A as PoolCreditManagerInfo,
-  F as PoolCreditManagersTable,
-  L as PoolCreditManagersTableHead,
-  O as PoolCreditManagersTableRow,
-  h as PoolTable,
-  X as RWAFeature,
-  Po as RewardsTooltip,
-  Fo as RewardsTooltipContent,
-  bo as RewardsTooltipHover,
-  go as RewardsTooltipRoot,
-  Ao as RewardsTooltipView,
-  _ as StrategiesRewardsCell,
-  Lo as StrategiesTable,
-  fo as StrategiesTableNotFoundLine,
-  $ as StrategyPoints,
-  ao as TitleGrid,
-  oo as ZeroSlippageFeature,
-  H as balanceColumn,
-  M as borrowApyColumn,
-  N as borrowedColumn,
-  V as collateralColumn,
-  W as customColumn,
-  k as customStrategyColumn,
-  I as defaultPoolName,
-  i as getPriceFeedInfo,
-  w as overflowContainerClassName,
-  g as overflowWrapClassName,
-  Y as poolColumn,
-  q as strategyColumn,
-  B as strategyLeverageColumn,
-  E as strategyRewardsColumn,
-  z as supplyApyColumn,
-  D as supplyColumn,
-  G as utilizationColumn
+  ro as APYFeature,
+  to as APYFeatureTooltip,
+  r as CreditAccountHistory,
+  no as DisabledWrap,
+  Co as Feature,
+  Po as FeatureRoot,
+  a as GEARBOX_PROTOCOL_INFO,
+  s as NotificationCenter,
+  n as OracleComponent,
+  u as OraclesAndLTLineView,
+  T as OraclesAndLTTableHead,
+  C as OraclesAndLTTableView,
+  b as OraclesList,
+  fo as Plus,
+  go as PointsFeature,
+  co as PointsFeatureTooltip,
+  Ao as PointsLabel,
+  g as PoolAssetsTable,
+  A as PoolAssetsTableHead,
+  F as PoolAssetsTableRow,
+  H as PoolCreditManagerInfo,
+  v as PoolCreditManagersTable,
+  E as PoolCreditManagersTableHead,
+  V as PoolCreditManagersTableRow,
+  J as PoolTable,
+  lo as RWAFeature,
+  Fo as RewardsTooltip,
+  vo as RewardsTooltipContent,
+  yo as RewardsTooltipHover,
+  So as RewardsTooltipRoot,
+  Ho as RewardsTooltipView,
+  po as StrategiesRewardsCell,
+  Eo as StrategiesTable,
+  wo as StrategiesTableNotFoundLine,
+  mo as StrategyPoints,
+  uo as TitleGrid,
+  l as ZERO_ADDRESS,
+  so as ZeroSlippageFeature,
+  _ as balanceColumn,
+  G as borrowApyColumn,
+  Y as borrowedColumn,
+  Z as collateralColumn,
+  z as customColumn,
+  Q as customStrategyColumn,
+  B as defaultPoolName,
+  w as getPriceFeedInfo,
+  p as isMulticallOperation,
+  L as overflowContainerClassName,
+  S as overflowWrapClassName,
+  X as poolColumn,
+  U as strategyColumn,
+  $ as strategyLeverageColumn,
+  oo as strategyRewardsColumn,
+  h as supplyApyColumn,
+  j as supplyColumn,
+  k as utilizationColumn
 };

package/dist/esm/components/composites/notification-center/index.js

@@ -0,0 +1,4 @@
+import { NotificationCenter as e } from "./notification-center.js";
+export {
+  e as NotificationCenter
+};

package/dist/esm/components/composites/notification-center/notification-center.js

@@ -0,0 +1,208 @@
+import { jsx as e, jsxs as i, Fragment as x } from "react/jsx-runtime";
+import { faBell as h } from "@fortawesome/free-solid-svg-icons";
+import { FaIcon as g } from "../../icons/fa-icon.js";
+import { SimpleDropdown as y } from "../../simple-dropdown/simple-dropdown.js";
+import "../../simple-dropdown/simple-dropdown-menu-item.js";
+import { FormattedMessageTyped as r } from "../../typed-intl/index.js";
+import { Typography as n } from "../../typography/typography.js";
+import { notificationCenterTestIds as a } from "../../../test-ids/notification-center.js";
+import "react";
+import "@gearbox-protocol/sdk";
+import { cn as c } from "../../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../../utils/z-index.js";
+function b({ row: t }) {
+  const s = /* @__PURE__ */ i(x, { children: [
+    /* @__PURE__ */ e(
+      "span",
+      {
+        className: c(
+          "mt-[5px] size-[7px] shrink-0 rounded-full",
+          t.isReady ? "bg-success" : "bg-gray-50"
+        )
+      }
+    ),
+    /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
+      /* @__PURE__ */ i("div", { className: "flex items-start justify-between gap-3", children: [
+        /* @__PURE__ */ e(
+          n,
+          {
+            as: "span",
+            variant: "bodySmall",
+            className: "truncate text-foreground",
+            children: t.title
+          }
+        ),
+        /* @__PURE__ */ e(
+          n,
+          {
+            as: "span",
+            variant: "bodySmall",
+            color: t.isReady ? "success" : "muted",
+            className: "shrink-0 text-right",
+            children: t.statusLabel
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e(n, { as: "span", variant: "bodySmall", color: "muted", children: t.positionName })
+    ] })
+  ] });
+  return t.isClickable && t.onExecute ? /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      "data-testid": a.requestRow,
+      onClick: t.onExecute,
+      className: "flex w-full cursor-pointer items-start gap-2 py-4 text-left hover:opacity-80",
+      children: s
+    }
+  ) : /* @__PURE__ */ e(
+    "div",
+    {
+      "data-testid": a.requestRow,
+      className: "flex w-full items-start gap-2 py-4",
+      children: s
+    }
+  );
+}
+function L({
+  open: t,
+  onOpenChange: s,
+  deferredRows: o,
+  successRows: d,
+  deferredCount: m,
+  hasReady: u,
+  hasAny: f,
+  onClear: p
+}) {
+  return /* @__PURE__ */ e(
+    y,
+    {
+      open: t,
+      onOpenChange: s,
+      align: "end",
+      asChild: !0,
+      className: "w-[460px] max-w-[calc(100vw-32px)] bg-modal p-0",
+      title: /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          "data-testid": a.trigger,
+          className: "relative flex size-8 items-center justify-center rounded-md text-secondary-foreground hover:text-foreground",
+          children: [
+            /* @__PURE__ */ e(g, { icon: h, className: "size-4" }),
+            m > 0 ? /* @__PURE__ */ e(
+              "span",
+              {
+                "data-testid": a.badge,
+                className: c(
+                  "absolute -right-0.5 -top-0.5 flex size-[15px] items-center justify-center rounded-full text-[10px] font-medium leading-none text-white",
+                  u ? "bg-primary" : "bg-gray-50"
+                ),
+                children: m
+              }
+            ) : null
+          ]
+        }
+      ),
+      children: /* @__PURE__ */ i(
+        "div",
+        {
+          "data-testid": a.panel,
+          className: "flex flex-col p-8",
+          children: [
+            f ? null : /* @__PURE__ */ e(
+              n,
+              {
+                as: "span",
+                variant: "bodySmall",
+                color: "muted",
+                "data-testid": a.empty,
+                children: /* @__PURE__ */ e(r, { messageId: "components.notificationCenter.empty" })
+              }
+            ),
+            o.length > 0 ? /* @__PURE__ */ i(
+              "div",
+              {
+                className: "flex flex-col",
+                "data-testid": a.requestsSection,
+                children: [
+                  /* @__PURE__ */ e(
+                    n,
+                    {
+                      as: "span",
+                      variant: "bodySmall",
+                      className: "pb-2 font-medium text-foreground",
+                      children: /* @__PURE__ */ e(r, { messageId: "components.notificationCenter.requests" })
+                    }
+                  ),
+                  /* @__PURE__ */ e("div", { className: "-mr-2 flex max-h-[40dvh] flex-col divide-y divide-gray-60 overflow-y-auto overflow-x-hidden pr-2 [scrollbar-gutter:stable]", children: o.map((l) => /* @__PURE__ */ e(b, { row: l }, l.id)) })
+                ]
+              }
+            ) : null,
+            d.length > 0 ? /* @__PURE__ */ i(
+              "div",
+              {
+                className: c(
+                  "flex flex-col",
+                  o.length > 0 && "mt-4 pt-4"
+                ),
+                "data-testid": a.successSection,
+                children: [
+                  /* @__PURE__ */ i("div", { className: "flex items-center justify-between pb-2", children: [
+                    /* @__PURE__ */ e(
+                      n,
+                      {
+                        as: "span",
+                        variant: "bodySmall",
+                        className: "font-medium text-foreground",
+                        children: /* @__PURE__ */ e(r, { messageId: "components.notificationCenter.recent" })
+                      }
+                    ),
+                    p ? /* @__PURE__ */ e(
+                      "button",
+                      {
+                        type: "button",
+                        "data-testid": a.clear,
+                        onClick: p,
+                        className: "cursor-pointer text-xs text-secondary-foreground hover:text-foreground",
+                        children: /* @__PURE__ */ e(r, { messageId: "components.notificationCenter.clear" })
+                      }
+                    ) : null
+                  ] }),
+                  /* @__PURE__ */ e("div", { className: "-mr-2 flex max-h-[30dvh] flex-col overflow-y-auto overflow-x-hidden pr-2 [scrollbar-gutter:stable]", children: d.map((l) => /* @__PURE__ */ i(
+                    "button",
+                    {
+                      type: "button",
+                      "data-testid": a.successRow,
+                      onClick: l.onView,
+                      className: "flex cursor-pointer items-center justify-between gap-3 py-2 text-left hover:opacity-80",
+                      children: [
+                        /* @__PURE__ */ e(
+                          n,
+                          {
+                            as: "span",
+                            variant: "bodySmall",
+                            className: "truncate text-foreground",
+                            children: l.label
+                          }
+                        ),
+                        /* @__PURE__ */ e(n, { as: "span", variant: "caption", color: "muted", children: l.timestampLabel })
+                      ]
+                    },
+                    l.id
+                  )) })
+                ]
+              }
+            ) : null
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  L as NotificationCenter
+};

package/dist/esm/components/composites/notification-center/types.js

@@ -0,0 +1 @@
+