@nexub/patterns 2.4.0 → 2.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,54 @@
1
+ 'use client';
2
+
3
+ // src/components/NotificationItem/NotificationItem.tsx
4
+ import * as React from "react";
5
+ import { cn, useNexubMessages } from "@nexub/react";
6
+ import { jsx, jsxs } from "react/jsx-runtime";
7
+ var NotificationItem = React.forwardRef(
8
+ ({ title, description, timestamp, read = false, icon, onDismiss, className, ...props }, ref) => {
9
+ const t = useNexubMessages();
10
+ return /* @__PURE__ */ jsxs(
11
+ "div",
12
+ {
13
+ ref,
14
+ className: cn(
15
+ "nx-state-layer flex items-start gap-3 p-3 rounded-shape-container",
16
+ !read && "bg-[var(--color-surface-container-low)]",
17
+ className
18
+ ),
19
+ ...props,
20
+ children: [
21
+ !read && /* @__PURE__ */ jsx(
22
+ "span",
23
+ {
24
+ className: "mt-1.5 h-2 w-2 shrink-0 rounded-full bg-[var(--color-primary)]",
25
+ role: "img",
26
+ "aria-label": t.unread
27
+ }
28
+ ),
29
+ icon && /* @__PURE__ */ jsx("div", { className: "shrink-0 mt-0.5", children: icon }),
30
+ /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
31
+ /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--color-on-surface)] truncate", children: title }),
32
+ description && /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--color-on-surface-muted)] mt-0.5 line-clamp-2", children: description }),
33
+ timestamp && /* @__PURE__ */ jsx("time", { className: "text-xs text-[var(--color-on-surface-muted)] mt-1 block", children: timestamp })
34
+ ] }),
35
+ onDismiss && /* @__PURE__ */ jsx(
36
+ "button",
37
+ {
38
+ type: "button",
39
+ onClick: onDismiss,
40
+ "aria-label": t.dismissNotification,
41
+ className: "shrink-0 text-[var(--color-on-surface-muted)] hover:text-[var(--color-on-surface)] p-1 rounded-shape-control",
42
+ children: "\xD7"
43
+ }
44
+ )
45
+ ]
46
+ }
47
+ );
48
+ }
49
+ );
50
+ NotificationItem.displayName = "NotificationItem";
51
+
52
+ export {
53
+ NotificationItem
54
+ };
@@ -2,19 +2,22 @@
2
2
 
3
3
  // src/components/ActivityFeed/ActivityFeed.tsx
4
4
  import * as React from "react";
5
- import { cn } from "@nexub/react";
5
+ import { cn, useNexubMessages } from "@nexub/react";
6
6
  import { jsx, jsxs } from "react/jsx-runtime";
7
7
  var Root = React.forwardRef(
8
- ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
9
- "ul",
10
- {
11
- ref,
12
- "aria-label": "Activity feed",
13
- className: cn("flex flex-col divide-y divide-[var(--color-outline-variant)]", className),
14
- ...props,
15
- children
16
- }
17
- )
8
+ ({ className, children, ...props }, ref) => {
9
+ const t = useNexubMessages();
10
+ return /* @__PURE__ */ jsx(
11
+ "ul",
12
+ {
13
+ ref,
14
+ "aria-label": t.activityFeed,
15
+ className: cn("flex flex-col divide-y divide-[var(--color-outline-variant)]", className),
16
+ ...props,
17
+ children
18
+ }
19
+ );
20
+ }
18
21
  );
19
22
  Root.displayName = "ActivityFeed.Root";
20
23
  var Item = ({ avatar, title, description, timestamp, className }) => /* @__PURE__ */ jsxs("li", { className: cn("flex items-start gap-3 py-3", className), children: [
@@ -1,7 +1,7 @@
1
1
  'use client';
2
2
  import {
3
3
  ActivityFeed
4
- } from "../../chunk-HYC5N5MO.js";
4
+ } from "../../chunk-GHOBXWUA.js";
5
5
  export {
6
6
  ActivityFeed
7
7
  };
@@ -1,7 +1,7 @@
1
1
  'use client';
2
2
  import {
3
3
  NotificationItem
4
- } from "../../chunk-5IORYY2L.js";
4
+ } from "../../chunk-23Q75ADU.js";
5
5
  export {
6
6
  NotificationItem
7
7
  };
@@ -1,9 +1,9 @@
1
1
  'use client';
2
2
  import {
3
3
  SignInPage
4
- } from "../../chunk-UNQD426H.js";
5
- import "../../chunk-HMJRSNJD.js";
4
+ } from "../../chunk-YDOVEHZK.js";
6
5
  import "../../chunk-7QCJC2DV.js";
6
+ import "../../chunk-HMJRSNJD.js";
7
7
  export {
8
8
  SignInPage
9
9
  };
package/dist/index.js CHANGED
@@ -27,7 +27,7 @@ import {
27
27
  } from "./chunk-U3FT7XAU.js";
28
28
  import {
29
29
  SignInPage
30
- } from "./chunk-UNQD426H.js";
30
+ } from "./chunk-YDOVEHZK.js";
31
31
  import {
32
32
  CheckoutPage
33
33
  } from "./chunk-CZR6NZDH.js";
@@ -52,10 +52,10 @@ import {
52
52
  } from "./chunk-5JU6HUVJ.js";
53
53
  import {
54
54
  NotificationItem
55
- } from "./chunk-5IORYY2L.js";
55
+ } from "./chunk-23Q75ADU.js";
56
56
  import {
57
57
  ActivityFeed
58
- } from "./chunk-HYC5N5MO.js";
58
+ } from "./chunk-GHOBXWUA.js";
59
59
  import "./chunk-CWFZA7ZQ.js";
60
60
  import {
61
61
  ActivityPage,
@@ -68,9 +68,6 @@ import "./chunk-VYMTTYPR.js";
68
68
  import {
69
69
  AppLauncher
70
70
  } from "./chunk-BDCVWAH7.js";
71
- import {
72
- AuthCard
73
- } from "./chunk-HMJRSNJD.js";
74
71
  import {
75
72
  BentoGrid,
76
73
  BentoTile
@@ -87,6 +84,9 @@ import {
87
84
  groupByDay,
88
85
  usePageMessages
89
86
  } from "./chunk-7QCJC2DV.js";
87
+ import {
88
+ AuthCard
89
+ } from "./chunk-HMJRSNJD.js";
90
90
  export {
91
91
  ActivityFeed,
92
92
  ActivityPage,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nexub/patterns",
3
- "version": "2.4.0",
3
+ "version": "2.5.0",
4
4
  "description": "Composite UI patterns for Nexub Design System — pre-built, production-ready layouts and widgets built on @nexub/react.",
5
5
  "type": "module",
6
6
  "license": "MIT",
@@ -36,9 +36,9 @@
36
36
  "peerDependencies": {
37
37
  "react": ">=18 <20",
38
38
  "react-dom": ">=18 <20",
39
- "@nexub/icons": "^2.4.0",
40
- "@nexub/react": "^2.4.0",
41
- "@nexub/tokens": "^2.4.0"
39
+ "@nexub/icons": "^2.5.0",
40
+ "@nexub/react": "^2.5.0",
41
+ "@nexub/tokens": "^2.5.0"
42
42
  },
43
43
  "peerDependenciesMeta": {
44
44
  "@nexub/icons": {
@@ -59,9 +59,9 @@
59
59
  "typescript": "^5.9.3",
60
60
  "vite": "^7.3.7",
61
61
  "vitest": "^5.0.5",
62
- "@nexub/icons": "2.4.0",
63
- "@nexub/react": "2.4.0",
64
- "@nexub/tokens": "2.4.0"
62
+ "@nexub/icons": "2.5.0",
63
+ "@nexub/react": "2.5.0",
64
+ "@nexub/tokens": "2.5.0"
65
65
  },
66
66
  "scripts": {
67
67
  "build": "tsup",
@@ -1,51 +0,0 @@
1
- 'use client';
2
-
3
- // src/components/NotificationItem/NotificationItem.tsx
4
- import * as React from "react";
5
- import { cn } from "@nexub/react";
6
- import { jsx, jsxs } from "react/jsx-runtime";
7
- var NotificationItem = React.forwardRef(
8
- ({ title, description, timestamp, read = false, icon, onDismiss, className, ...props }, ref) => /* @__PURE__ */ jsxs(
9
- "div",
10
- {
11
- ref,
12
- className: cn(
13
- "nx-state-layer flex items-start gap-3 p-3 rounded-shape-container",
14
- !read && "bg-[var(--color-surface-container-low)]",
15
- className
16
- ),
17
- ...props,
18
- children: [
19
- !read && /* @__PURE__ */ jsx(
20
- "span",
21
- {
22
- className: "mt-1.5 h-2 w-2 shrink-0 rounded-full bg-[var(--color-primary)]",
23
- role: "img",
24
- "aria-label": "Unread"
25
- }
26
- ),
27
- icon && /* @__PURE__ */ jsx("div", { className: "shrink-0 mt-0.5", children: icon }),
28
- /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
29
- /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--color-on-surface)] truncate", children: title }),
30
- description && /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--color-on-surface-muted)] mt-0.5 line-clamp-2", children: description }),
31
- timestamp && /* @__PURE__ */ jsx("time", { className: "text-xs text-[var(--color-on-surface-muted)] mt-1 block", children: timestamp })
32
- ] }),
33
- onDismiss && /* @__PURE__ */ jsx(
34
- "button",
35
- {
36
- type: "button",
37
- onClick: onDismiss,
38
- "aria-label": "Dismiss notification",
39
- className: "shrink-0 text-[var(--color-on-surface-muted)] hover:text-[var(--color-on-surface)] p-1 rounded-shape-control",
40
- children: "\xD7"
41
- }
42
- )
43
- ]
44
- }
45
- )
46
- );
47
- NotificationItem.displayName = "NotificationItem";
48
-
49
- export {
50
- NotificationItem
51
- };
@@ -1,10 +1,10 @@
1
1
  'use client';
2
- import {
3
- AuthCard
4
- } from "./chunk-HMJRSNJD.js";
5
2
  import {
6
3
  usePageMessages
7
4
  } from "./chunk-7QCJC2DV.js";
5
+ import {
6
+ AuthCard
7
+ } from "./chunk-HMJRSNJD.js";
8
8
 
9
9
  // src/components/SignInPage/SignInPage.tsx
10
10
  import * as React from "react";