soadtech-ui 0.1.0

package/dist/components/NavbarUser/NavbarUser.js

@@ -0,0 +1,204 @@
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { cn as v } from "../../utils/cn.js";
+import n from "./NavbarUser.module.css.js";
+import { Avatar as f } from "../Avatar/Avatar.js";
+function L() {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 20 20",
+      fill: "none",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M12.5 15L7.5 10L12.5 5",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  );
+}
+function k() {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 20 20",
+      fill: "none",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M3 5H17M3 10H17M3 15H17",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round"
+        }
+      )
+    }
+  );
+}
+function C() {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 20 20",
+      fill: "none",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M4.55806 4.55806C4.80214 4.31398 5.19786 4.31398 5.44194 4.55806L10.5028 9.61889L15.5636 4.55806C15.8077 4.31398 16.2034 4.31398 16.4475 4.55806C16.6916 4.80214 16.6916 5.19786 16.4475 5.44194L11.3867 10.5028L16.4475 15.5636C16.6916 15.8077 16.6916 16.2034 16.4475 16.4475C16.2034 16.6916 15.8077 16.6916 15.5636 16.4475L10.5028 11.3867L5.44194 16.4475C5.19786 16.6916 4.80214 16.6916 4.55806 16.4475C4.31398 16.2034 4.31398 15.8077 4.55806 15.5636L9.61889 10.5028L4.55806 5.44194C4.31398 5.19786 4.31398 4.80214 4.55806 4.55806Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+}
+function N() {
+  return /* @__PURE__ */ r(
+    "svg",
+    {
+      width: "16",
+      height: "16",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      "aria-hidden": "true",
+      className: n.verifiedBadge,
+      children: [
+        /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "8", fill: "var(--st-color-info)" }),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M5 8L7 10L11 6",
+            stroke: "white",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ]
+    }
+  );
+}
+function b() {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: "16",
+      height: "16",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      "aria-hidden": "true",
+      className: n.userChevron,
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M4 6L8 10L12 6",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  );
+}
+function g({
+  title: c,
+  subtitle: o,
+  onBack: t,
+  onClose: a,
+  actions: l,
+  user: i,
+  onUserClick: d,
+  logo: h,
+  onMenuClick: s,
+  className: u
+}) {
+  const m = !!t;
+  return /* @__PURE__ */ r("nav", { className: v(n.root, m && n.level2, u), children: [
+    /* @__PURE__ */ r("span", { className: n.mobileLead, children: [
+      h,
+      s && /* @__PURE__ */ e(
+        "button",
+        {
+          type: "button",
+          className: n.menuBtn,
+          onClick: s,
+          "aria-label": "Open menu",
+          children: /* @__PURE__ */ e(k, {})
+        }
+      )
+    ] }),
+    t && /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        className: n.backBtn,
+        onClick: t,
+        "aria-label": "Go back",
+        children: /* @__PURE__ */ e(L, {})
+      }
+    ),
+    /* @__PURE__ */ r("div", { className: n.titleGroup, children: [
+      /* @__PURE__ */ e("span", { className: n.title, children: c }),
+      o && /* @__PURE__ */ e("span", { className: n.subtitle, children: o })
+    ] }),
+    l && /* @__PURE__ */ e("div", { className: n.actions, children: l }),
+    i && /* @__PURE__ */ r(
+      "button",
+      {
+        type: "button",
+        className: n.userSection,
+        onClick: d,
+        children: [
+          /* @__PURE__ */ e(
+            f,
+            {
+              src: i.avatar,
+              initials: i.name.split(" ").map((p) => p[0]).join("").slice(0, 2).toUpperCase(),
+              size: "sm"
+            }
+          ),
+          /* @__PURE__ */ r("div", { className: n.userInfo, children: [
+            /* @__PURE__ */ r("span", { className: n.userName, children: [
+              i.name,
+              i.verified && /* @__PURE__ */ e(N, {})
+            ] }),
+            /* @__PURE__ */ r("span", { className: n.userHandle, children: [
+              "@",
+              i.username
+            ] })
+          ] }),
+          /* @__PURE__ */ e(b, {})
+        ]
+      }
+    ),
+    a && /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        className: n.closeBtn,
+        onClick: a,
+        "aria-label": "Close",
+        children: /* @__PURE__ */ e(C, {})
+      }
+    )
+  ] });
+}
+g.displayName = "NavbarUser";
+export {
+  g as NavbarUser
+};

package/dist/components/NavbarUser/NavbarUser.module.css

@@ -0,0 +1 @@
+._root_1ueag_5{display:flex;align-items:center;gap:var(--st-space-3);padding:var(--st-space-3) var(--st-space-4);font-family:var(--st-font-family);background-color:var(--st-color-background);min-height:56px}._mobileLead_1ueag_17{display:none;align-items:center;gap:var(--st-space-2);flex-shrink:0}._backBtn_1ueag_26{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:var(--st-radius-md);background:transparent;color:var(--st-color-foreground);cursor:pointer;flex-shrink:0;transition:background-color var(--st-transition-fast)}._backBtn_1ueag_26:hover{background-color:var(--st-color-neutral-100)}._backBtn_1ueag_26:focus-visible{outline:2px solid var(--st-color-info);outline-offset:2px}._titleGroup_1ueag_53{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}._title_1ueag_53{font-size:var(--st-font-size-lg);font-weight:var(--st-font-weight-semibold);line-height:var(--st-line-height-tight);color:var(--st-color-foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._subtitle_1ueag_71{font-size:var(--st-font-size-sm);line-height:var(--st-line-height-normal);color:var(--st-color-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._actions_1ueag_82{display:flex;align-items:center;gap:var(--st-space-1);flex-shrink:0}._userSection_1ueag_91{display:flex;align-items:center;gap:var(--st-space-2);padding:var(--st-space-1) var(--st-space-2);border:none;border-radius:var(--st-radius-md);background:transparent;cursor:pointer;flex-shrink:0;color:var(--st-color-foreground);font-family:var(--st-font-family);transition:background-color var(--st-transition-fast)}._userSection_1ueag_91:hover{background-color:var(--st-color-neutral-100)}._userSection_1ueag_91:focus-visible{outline:2px solid var(--st-color-info);outline-offset:2px}._userInfo_1ueag_115{display:flex;flex-direction:column;align-items:flex-start;gap:0;min-width:0}._userName_1ueag_123{display:flex;align-items:center;gap:var(--st-space-1);font-size:var(--st-font-size-sm);font-weight:var(--st-font-weight-medium);line-height:var(--st-line-height-tight);white-space:nowrap}._userHandle_1ueag_133{font-size:var(--st-font-size-xs);line-height:var(--st-line-height-tight);color:var(--st-color-muted);white-space:nowrap}._verifiedBadge_1ueag_140{flex-shrink:0}._userChevron_1ueag_144{flex-shrink:0;color:var(--st-color-muted)}._closeBtn_1ueag_151{display:none;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:var(--st-radius-md);background:transparent;color:var(--st-color-foreground);cursor:pointer;flex-shrink:0;transition:background-color var(--st-transition-fast)}._closeBtn_1ueag_151:hover{background-color:var(--st-color-neutral-100)}._closeBtn_1ueag_151:focus-visible{outline:2px solid var(--st-color-info);outline-offset:2px}._menuBtn_1ueag_178{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:var(--st-radius-md);background:transparent;color:var(--st-color-foreground);cursor:pointer;transition:background-color var(--st-transition-fast)}._menuBtn_1ueag_178:hover{background-color:var(--st-color-neutral-100)}._menuBtn_1ueag_178:focus-visible{outline:2px solid var(--st-color-info);outline-offset:2px}@media(max-width:767px){._root_1ueag_5{flex-wrap:wrap;padding:var(--st-space-2) var(--st-space-3)}._mobileLead_1ueag_17{display:flex}._titleGroup_1ueag_53{flex-basis:100%;order:10}._title_1ueag_53{font-size:var(--st-font-size-md)}._userInfo_1ueag_115,._userChevron_1ueag_144{display:none}._userSection_1ueag_91{padding:var(--st-space-1)}._level2_1ueag_240 ._mobileLead_1ueag_17,._level2_1ueag_240 ._actions_1ueag_82,._level2_1ueag_240 ._userSection_1ueag_91{display:none}._level2_1ueag_240 ._closeBtn_1ueag_151{display:flex}._level2_1ueag_240 ._titleGroup_1ueag_53{flex-basis:auto;flex:1;order:0}._level2_1ueag_240 ._subtitle_1ueag_71{display:none}}

package/dist/components/NavbarUser/NavbarUser.module.css.js

@@ -0,0 +1,37 @@
+import './NavbarUser.module.css';const e = "_root_1ueag_5", t = "_mobileLead_1ueag_17", _ = "_backBtn_1ueag_26", o = "_titleGroup_1ueag_53", n = "_title_1ueag_53", s = "_subtitle_1ueag_71", u = "_actions_1ueag_82", a = "_userSection_1ueag_91", c = "_userInfo_1ueag_115", r = "_userName_1ueag_123", l = "_userHandle_1ueag_133", i = "_verifiedBadge_1ueag_140", g = "_userChevron_1ueag_144", d = "_closeBtn_1ueag_151", B = "_menuBtn_1ueag_178", b = "_level2_1ueag_240", m = {
+  root: e,
+  mobileLead: t,
+  backBtn: _,
+  titleGroup: o,
+  title: n,
+  subtitle: s,
+  actions: u,
+  userSection: a,
+  userInfo: c,
+  userName: r,
+  userHandle: l,
+  verifiedBadge: i,
+  userChevron: g,
+  closeBtn: d,
+  menuBtn: B,
+  level2: b
+};
+export {
+  u as actions,
+  _ as backBtn,
+  d as closeBtn,
+  m as default,
+  b as level2,
+  B as menuBtn,
+  t as mobileLead,
+  e as root,
+  s as subtitle,
+  n as title,
+  o as titleGroup,
+  g as userChevron,
+  l as userHandle,
+  c as userInfo,
+  r as userName,
+  a as userSection,
+  i as verifiedBadge
+};

package/dist/components/NavbarUser/NavbarUser.types.d.ts

@@ -0,0 +1,30 @@
+import { ReactNode } from 'react';
+export interface NavbarUserInfo {
+    name: string;
+    username: string;
+    avatar?: string;
+    verified?: boolean;
+}
+export interface NavbarUserProps {
+    /** Page title */
+    title: string;
+    /** Description below title */
+    subtitle?: string;
+    /** Shows back arrow; presence indicates Level 2 */
+    onBack?: () => void;
+    /** Close button (mobile Level 2 only) */
+    onClose?: () => void;
+    /** Slot for action icon buttons */
+    actions?: ReactNode;
+    /** User info (avatar, name, handle) */
+    user?: NavbarUserInfo;
+    /** Dropdown trigger on user section */
+    onUserClick?: () => void;
+    /** Brand mark (mobile only) */
+    logo?: ReactNode;
+    /** Hamburger button (mobile only) */
+    onMenuClick?: () => void;
+    /** Root element class */
+    className?: string;
+}
+//# sourceMappingURL=NavbarUser.types.d.ts.map

package/dist/components/NavbarUser/NavbarUser.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavbarUser.types.d.ts","sourceRoot":"","sources":["../../../src/components/NavbarUser/NavbarUser.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,eAAe;IAC9B,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mCAAmC;IACnC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,uCAAuC;IACvC,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,qCAAqC;IACrC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}

package/dist/components/NavbarUser/index.d.ts

@@ -0,0 +1,3 @@
+export { NavbarUser } from './NavbarUser';
+export type { NavbarUserProps, NavbarUserInfo } from './NavbarUser.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/NavbarUser/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/NavbarUser/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC"}

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

@@ -0,0 +1,55 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export type NotificationCategory = 'warning' | 'success' | 'intelligence' | 'team';
+export interface NotificationItemProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    /** Determines icon & color scheme */
+    category: NotificationCategory;
+    /** Bold title text */
+    title: string;
+    /** Timestamp text e.g. "1h ago" */
+    time?: string;
+    /** Description below title */
+    description?: string;
+    /** Shows blue unread dot */
+    unread?: boolean;
+    /** Custom icon override */
+    icon?: ReactNode;
+    /** Avatar URL for `team` category */
+    avatarSrc?: string;
+    /** Avatar alt text */
+    avatarAlt?: string;
+    /** Action button slot */
+    action?: ReactNode;
+    /** Trash icon click handler (hover-visible) */
+    onDelete?: () => void;
+    /** Reply input slot */
+    replyArea?: ReactNode;
+}
+export interface NotificationReplyProps extends HTMLAttributes<HTMLDivElement> {
+    /** Replying user avatar URL */
+    avatarSrc?: string;
+    /** Avatar alt text */
+    avatarAlt?: string;
+    /** Controlled input value */
+    value?: string;
+    /** Input change handler */
+    onValueChange?: (value: string) => void;
+    /** Chip(s) rendered before input */
+    mentions?: ReactNode;
+    /** Input placeholder text */
+    placeholder?: string;
+    /** Send Reply click handler */
+    onSend?: () => void;
+    /** Cancel click handler */
+    onCancel?: () => void;
+}
+export interface NotificationPanelProps extends HTMLAttributes<HTMLDivElement> {
+    /** Header title */
+    title?: string;
+    /** Close button handler */
+    onClose?: () => void;
+    /** Footer button text */
+    footerLabel?: string;
+    /** Footer button click handler */
+    onFooterClick?: () => void;
+}
+//# sourceMappingURL=Notification.types.d.ts.map

package/dist/components/Notification/Notification.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Notification.types.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,MAAM,oBAAoB,GAC5B,SAAS,GACT,SAAS,GACT,cAAc,GACd,MAAM,CAAC;AAEX,MAAM,WAAW,qBACf,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACrD,qCAAqC;IACrC,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4BAA4B;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2BAA2B;IAC3B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yBAAyB;IACzB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,uBAAuB;IACvB,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAED,MAAM,WAAW,sBACf,SAAQ,cAAc,CAAC,cAAc,CAAC;IACtC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2BAA2B;IAC3B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,oCAAoC;IACpC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,sBACf,SAAQ,cAAc,CAAC,cAAc,CAAC;IACtC,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2BAA2B;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,yBAAyB;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kCAAkC;IAClC,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B"}

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

@@ -0,0 +1,3 @@
+import { NotificationItemProps } from './Notification.types';
+export declare const NotificationItem: import('react').ForwardRefExoticComponent<NotificationItemProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=NotificationItem.d.ts.map

package/dist/components/Notification/NotificationItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationItem.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationItem.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAwB,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAwFxF,eAAO,MAAM,gBAAgB,kHA+D5B,CAAC"}

package/dist/components/Notification/NotificationItem.js

@@ -0,0 +1,139 @@
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { forwardRef as N } from "react";
+import { cn as d } from "../../utils/cn.js";
+import r from "./NotificationItem.module.css.js";
+import { Avatar as g } from "../Avatar/Avatar.js";
+function C() {
+  return /* @__PURE__ */ n("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", children: [
+    /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M9 2L17 16H1L9 2Z",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M9 7V11M9 13.5V14",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round"
+      }
+    )
+  ] });
+}
+function M() {
+  return /* @__PURE__ */ n("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", children: [
+    /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M1 1H3L3.6 4M3.6 4H17L14 11H5L3.6 4Z",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ e("circle", { cx: "6", cy: "15", r: "1.5", fill: "currentColor" }),
+    /* @__PURE__ */ e("circle", { cx: "13", cy: "15", r: "1.5", fill: "currentColor" })
+  ] });
+}
+function w() {
+  return /* @__PURE__ */ n("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", children: [
+    /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M2 14L6 9L10 11L16 4",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M13 4H16V7",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    )
+  ] });
+}
+function x() {
+  return /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ e(
+    "path",
+    {
+      d: "M2 4H14M5.5 4V2.5H10.5V4M6.5 7V11.5M9.5 7V11.5M3.5 4L4.5 13.5H11.5L12.5 4",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) });
+}
+const H = {
+  warning: /* @__PURE__ */ e(C, {}),
+  success: /* @__PURE__ */ e(M, {}),
+  intelligence: /* @__PURE__ */ e(w, {})
+}, j = N(
+  ({
+    category: i,
+    title: h,
+    time: o,
+    description: t,
+    unread: s = !1,
+    icon: u,
+    avatarSrc: m,
+    avatarAlt: p = "",
+    action: c,
+    onDelete: l,
+    replyArea: a,
+    className: k,
+    ...f
+  }, L) => {
+    const v = i === "team" ? /* @__PURE__ */ e(g, { src: m, alt: p, size: "md" }) : /* @__PURE__ */ e("span", { className: d(r.iconCircle, r[i]), children: u ?? H[i] });
+    return /* @__PURE__ */ n(
+      "div",
+      {
+        ref: L,
+        className: d(r.root, s && r.unread, k),
+        ...f,
+        children: [
+          /* @__PURE__ */ e("div", { className: r.leading, children: v }),
+          /* @__PURE__ */ n("div", { className: r.body, children: [
+            /* @__PURE__ */ n("div", { className: r.header, children: [
+              /* @__PURE__ */ e("span", { className: r.title, children: h }),
+              o && /* @__PURE__ */ e("span", { className: r.time, children: o })
+            ] }),
+            t && /* @__PURE__ */ e("p", { className: r.description, children: t }),
+            c && /* @__PURE__ */ e("div", { className: r.action, children: c }),
+            a && /* @__PURE__ */ e("div", { className: r.replySlot, children: a })
+          ] }),
+          /* @__PURE__ */ n("div", { className: r.trailing, children: [
+            s && /* @__PURE__ */ e("span", { className: r.unreadDot }),
+            l && /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                className: r.deleteBtn,
+                onClick: l,
+                "aria-label": "Delete notification",
+                children: /* @__PURE__ */ e(x, {})
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+);
+j.displayName = "NotificationItem";
+export {
+  j as NotificationItem
+};

package/dist/components/Notification/NotificationItem.module.css

@@ -0,0 +1 @@
+._root_ydp05_3{display:flex;align-items:flex-start;gap:var(--st-space-3);padding:var(--st-space-3) var(--st-space-4);border-left:3px solid transparent;transition:background-color var(--st-transition-fast),border-color var(--st-transition-fast);cursor:default}._root_ydp05_3:hover{background-color:var(--st-color-primary-subtle);border-left-color:var(--st-color-primary)}._leading_ydp05_21{flex-shrink:0;padding-top:var(--st-space-1)}._iconCircle_ydp05_26{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--st-radius-full);flex-shrink:0}._warning_ydp05_36{background-color:var(--st-color-warning-subtle);color:var(--st-color-warning)}._success_ydp05_41{background-color:var(--st-color-success-subtle);color:var(--st-color-success)}._intelligence_ydp05_46{background-color:var(--st-color-info-subtle);color:var(--st-color-info)}._body_ydp05_53{flex:1;min-width:0}._header_ydp05_58{display:flex;align-items:baseline;gap:var(--st-space-2)}._title_ydp05_64{font-size:var(--st-font-size-sm);font-weight:var(--st-font-weight-semibold);color:var(--st-color-foreground);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._time_ydp05_73{flex-shrink:0;font-size:var(--st-font-size-xs);color:var(--st-color-muted)}._description_ydp05_79{margin:var(--st-space-1) 0 0;font-size:var(--st-font-size-xs);color:var(--st-color-muted);line-height:var(--st-line-height-normal)}._action_ydp05_86,._replySlot_ydp05_90{margin-top:var(--st-space-2)}._trailing_ydp05_96{display:flex;align-items:center;gap:var(--st-space-2);flex-shrink:0;padding-top:var(--st-space-1)}._unreadDot_ydp05_104{width:8px;height:8px;border-radius:var(--st-radius-full);background-color:var(--st-color-primary);flex-shrink:0}._deleteBtn_ydp05_112{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:var(--st-radius-md);background:transparent;color:var(--st-color-muted);cursor:pointer;opacity:0;transition:opacity var(--st-transition-fast),color var(--st-transition-fast),background-color var(--st-transition-fast)}._root_ydp05_3:hover ._deleteBtn_ydp05_112{opacity:1}._deleteBtn_ydp05_112:focus-visible{opacity:1;outline:2px solid var(--st-color-primary);outline-offset:2px}._deleteBtn_ydp05_112:hover{color:var(--st-color-error);background-color:var(--st-color-error-subtle)}

package/dist/components/Notification/NotificationItem.module.css.js

@@ -0,0 +1,37 @@
+import './NotificationItem.module.css';const t = "_root_ydp05_3", e = "_leading_ydp05_21", n = "_iconCircle_ydp05_26", _ = "_warning_ydp05_36", o = "_success_ydp05_41", i = "_intelligence_ydp05_46", c = "_body_ydp05_53", d = "_header_ydp05_58", s = "_title_ydp05_64", l = "_time_ydp05_73", r = "_description_ydp05_79", p = "_action_ydp05_86", y = "_replySlot_ydp05_90", a = "_trailing_ydp05_96", g = "_unreadDot_ydp05_104", u = "_deleteBtn_ydp05_112", b = {
+  root: t,
+  leading: e,
+  iconCircle: n,
+  warning: _,
+  success: o,
+  intelligence: i,
+  body: c,
+  header: d,
+  title: s,
+  time: l,
+  description: r,
+  action: p,
+  replySlot: y,
+  trailing: a,
+  unreadDot: g,
+  deleteBtn: u
+};
+export {
+  p as action,
+  c as body,
+  b as default,
+  u as deleteBtn,
+  r as description,
+  d as header,
+  n as iconCircle,
+  i as intelligence,
+  e as leading,
+  y as replySlot,
+  t as root,
+  o as success,
+  l as time,
+  s as title,
+  a as trailing,
+  g as unreadDot,
+  _ as warning
+};

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

@@ -0,0 +1,3 @@
+import { NotificationPanelProps } from './Notification.types';
+export declare const NotificationPanel: import('react').ForwardRefExoticComponent<NotificationPanelProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=NotificationPanel.d.ts.map

package/dist/components/Notification/NotificationPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationPanel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAgBnE,eAAO,MAAM,iBAAiB,mHA8C7B,CAAC"}

package/dist/components/Notification/NotificationPanel.js

@@ -0,0 +1,56 @@
+import { jsxs as r, jsx as i } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import { cn as f } from "../../utils/cn.js";
+import o from "./NotificationPanel.module.css.js";
+import { Button as h } from "../Button/Button.js";
+function p() {
+  return /* @__PURE__ */ i("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ i(
+    "path",
+    {
+      d: "M4 4L12 12M12 4L4 12",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round"
+    }
+  ) });
+}
+const N = m(
+  ({
+    title: n = "Notifications",
+    onClose: t,
+    footerLabel: a = "See all notifications",
+    onFooterClick: e,
+    children: s,
+    className: l,
+    ...c
+  }, d) => /* @__PURE__ */ r("div", { ref: d, className: f(o.root, l), ...c, children: [
+    /* @__PURE__ */ r("div", { className: o.header, children: [
+      /* @__PURE__ */ i("span", { className: o.title, children: n }),
+      t && /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          className: o.closeBtn,
+          onClick: t,
+          "aria-label": "Close notifications",
+          children: /* @__PURE__ */ i(p, {})
+        }
+      )
+    ] }),
+    /* @__PURE__ */ i("div", { className: o.body, children: s }),
+    e && /* @__PURE__ */ i("div", { className: o.footer, children: /* @__PURE__ */ i(
+      h,
+      {
+        variant: "fill",
+        size: "sm",
+        className: o.footerBtn,
+        onClick: e,
+        children: a
+      }
+    ) })
+  ] })
+);
+N.displayName = "NotificationPanel";
+export {
+  N as NotificationPanel
+};

package/dist/components/Notification/NotificationPanel.module.css

@@ -0,0 +1 @@
+._root_oyuvi_3{display:flex;flex-direction:column;width:380px;max-height:520px;background-color:var(--st-color-surface);border:1px solid var(--st-color-border);border-radius:var(--st-radius-xl);box-shadow:var(--st-shadow-lg);overflow:hidden}._header_oyuvi_17{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding:var(--st-space-4);border-bottom:1px solid var(--st-color-border)}._title_oyuvi_26{font-size:var(--st-font-size-md);font-weight:var(--st-font-weight-semibold);color:var(--st-color-foreground)}._closeBtn_oyuvi_32{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:var(--st-radius-md);background:transparent;color:var(--st-color-muted);cursor:pointer;transition:color var(--st-transition-fast),background-color var(--st-transition-fast)}._closeBtn_oyuvi_32:hover{color:var(--st-color-foreground);background-color:var(--st-color-neutral-100)}._closeBtn_oyuvi_32:focus-visible{outline:2px solid var(--st-color-primary);outline-offset:2px}._body_oyuvi_60{flex:1;overflow-y:auto}._footer_oyuvi_67{flex-shrink:0;padding:var(--st-space-3) var(--st-space-4);border-top:1px solid var(--st-color-border)}._footerBtn_oyuvi_73{width:100%}

package/dist/components/Notification/NotificationPanel.module.css.js

@@ -0,0 +1,19 @@
+import './NotificationPanel.module.css';const o = "_root_oyuvi_3", t = "_header_oyuvi_17", e = "_title_oyuvi_26", _ = "_closeBtn_oyuvi_32", n = "_body_oyuvi_60", s = "_footer_oyuvi_67", r = "_footerBtn_oyuvi_73", c = {
+  root: o,
+  header: t,
+  title: e,
+  closeBtn: _,
+  body: n,
+  footer: s,
+  footerBtn: r
+};
+export {
+  n as body,
+  _ as closeBtn,
+  c as default,
+  s as footer,
+  r as footerBtn,
+  t as header,
+  o as root,
+  e as title
+};

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

@@ -0,0 +1,3 @@
+import { NotificationReplyProps } from './Notification.types';
+export declare const NotificationReply: import('react').ForwardRefExoticComponent<NotificationReplyProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=NotificationReply.d.ts.map

package/dist/components/Notification/NotificationReply.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationReply.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationReply.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAGnE,eAAO,MAAM,iBAAiB,mHA0C7B,CAAC"}