@nexub/react 2.9.0 → 3.0.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nexub/react",
3
- "version": "2.9.0",
3
+ "version": "3.0.0",
4
4
  "description": "React component library for Nexub Design System — 90+ accessible, themeable UI components built on Radix UI primitives.",
5
5
  "type": "module",
6
6
  "license": "MIT",
@@ -71,13 +71,13 @@
71
71
  "date-fns": "^4.4.0",
72
72
  "react-day-picker": "^10.0.2",
73
73
  "tailwind-merge": "^3.7.0",
74
- "@nexub/core": "2.9.0",
75
- "@nexub/icons": "2.9.0"
74
+ "@nexub/core": "3.0.0",
75
+ "@nexub/icons": "3.0.0"
76
76
  },
77
77
  "peerDependencies": {
78
78
  "react": ">=18 <20",
79
79
  "react-dom": ">=18 <20",
80
- "@nexub/tokens": "^2.9.0"
80
+ "@nexub/tokens": "^3.0.0"
81
81
  },
82
82
  "devDependencies": {
83
83
  "@playwright/test": "1.64.0",
@@ -103,8 +103,8 @@
103
103
  "vaul": "1.1.2",
104
104
  "vite": "^8.3.5",
105
105
  "vitest": "^5.0.5",
106
- "@nexub/themes": "2.9.0",
107
- "@nexub/tokens": "2.9.0"
106
+ "@nexub/themes": "3.0.0",
107
+ "@nexub/tokens": "3.0.0"
108
108
  },
109
109
  "scripts": {
110
110
  "build": "tsup && node scripts/check-dts.mjs && tailwindcss -i src/styles.css -o dist/styles.css --minify && cp -R ../themes/src/fonts dist/fonts",
@@ -1,91 +0,0 @@
1
- 'use client';
2
- import {
3
- warnDeprecated
4
- } from "./chunk-VLME3JFF.js";
5
- import {
6
- useNexubMessages
7
- } from "./chunk-VMSWIC3O.js";
8
- import {
9
- cn
10
- } from "./chunk-WRVFNYO3.js";
11
-
12
- // src/components/Banner/Banner.tsx
13
- import * as React from "react";
14
- import { cva } from "class-variance-authority";
15
- import { jsx, jsxs } from "react/jsx-runtime";
16
- var bannerVariants = cva(
17
- [
18
- "relative flex gap-3 border-s-4 px-4 py-3",
19
- "w-full"
20
- // No border-radius — full-width banner
21
- ],
22
- {
23
- variants: {
24
- tone: {
25
- neutral: "bg-[var(--color-surface-container-low)] border-s-[var(--color-outline)] text-[var(--color-on-surface)]",
26
- info: "bg-[var(--color-info-container)] border-s-[var(--color-info)] text-[var(--color-on-info-container)]",
27
- success: "bg-[var(--color-success-container)] border-s-[var(--color-success)] text-[var(--color-on-success-container)]",
28
- warning: "bg-[var(--color-warning-container)] border-s-[var(--color-warning)] text-[var(--color-on-warning-container)]",
29
- danger: "bg-[var(--color-error-container)] border-s-[var(--color-error)] text-[var(--color-on-error-container)]",
30
- leap: "bg-[var(--color-leap-container)] border-s-[var(--color-leap)] text-[var(--color-on-leap-container)]",
31
- bookub: "bg-[var(--color-bookub-container)] border-s-[var(--color-bookub)] text-[var(--color-on-bookub-container)]",
32
- payub: "bg-[var(--color-payub-container)] border-s-[var(--color-payub)] text-[var(--color-on-payub-container)]",
33
- founderub: "bg-[var(--color-founderub-container)] border-s-[var(--color-founderub)] text-[var(--color-on-founderub-container)]"
34
- }
35
- },
36
- defaultVariants: {
37
- tone: "neutral"
38
- }
39
- }
40
- );
41
- var Banner = React.forwardRef(
42
- ({
43
- className,
44
- tone = "neutral",
45
- title,
46
- icon,
47
- action,
48
- onClose,
49
- children,
50
- ...props
51
- }, ref) => {
52
- warnDeprecated("Banner", "Alert");
53
- const messages = useNexubMessages();
54
- return /* @__PURE__ */ jsxs(
55
- "div",
56
- {
57
- ref,
58
- role: "status",
59
- className: cn(bannerVariants({ tone }), className),
60
- "data-tone": tone,
61
- ...props,
62
- children: [
63
- icon && /* @__PURE__ */ jsx("span", { className: "shrink-0 mt-0.5 inline-flex items-start", "aria-hidden": "true", children: icon }),
64
- /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
65
- title && /* @__PURE__ */ jsx("p", { className: "font-semibold text-sm mb-0.5", children: title }),
66
- children && /* @__PURE__ */ jsx("div", { className: "text-sm opacity-90", children }),
67
- action && /* @__PURE__ */ jsx("div", { className: "mt-2", children: action })
68
- ] }),
69
- onClose && /* @__PURE__ */ jsx(
70
- "button",
71
- {
72
- type: "button",
73
- "aria-label": messages.dismissBanner,
74
- onClick: onClose,
75
- className: cn(
76
- "nx-state-layer shrink-0 inline-flex items-center justify-center rounded-full w-6 h-6"
77
- ),
78
- children: /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M10 2L2 10M2 2l8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
79
- }
80
- )
81
- ]
82
- }
83
- );
84
- }
85
- );
86
- Banner.displayName = "Banner";
87
-
88
- export {
89
- bannerVariants,
90
- Banner
91
- };
@@ -1,59 +0,0 @@
1
- 'use client';
2
- import {
3
- warnDeprecated
4
- } from "./chunk-VLME3JFF.js";
5
- import {
6
- cn
7
- } from "./chunk-WRVFNYO3.js";
8
-
9
- // src/components/Tag/Tag.tsx
10
- import * as React from "react";
11
- import { cva } from "class-variance-authority";
12
- import { jsx } from "react/jsx-runtime";
13
- var tagVariants = cva(
14
- "inline-flex items-center rounded-shape-min font-medium select-none whitespace-nowrap",
15
- {
16
- variants: {
17
- size: {
18
- sm: "px-1.5 py-0.5 text-xs",
19
- md: "px-2 py-0.5 text-xs",
20
- lg: "px-2.5 py-1 text-sm"
21
- },
22
- tone: {
23
- neutral: "bg-[var(--color-surface-container-high)] text-[var(--color-on-surface-variant)]",
24
- info: "bg-[var(--color-info-container)] text-[var(--color-on-info-container)]",
25
- success: "bg-[var(--color-success-container)] text-[var(--color-on-success-container)]",
26
- warning: "bg-[var(--color-warning-container)] text-[var(--color-on-warning-container)]",
27
- danger: "bg-[var(--color-error-container)] text-[var(--color-on-error-container)]",
28
- leap: "bg-[var(--color-leap-container)] text-[var(--color-on-leap-container)]",
29
- bookub: "bg-[var(--color-bookub-container)] text-[var(--color-on-bookub-container)]",
30
- payub: "bg-[var(--color-payub-container)] text-[var(--color-on-payub-container)]",
31
- founderub: "bg-[var(--color-founderub-container)] text-[var(--color-on-founderub-container)]"
32
- }
33
- },
34
- defaultVariants: {
35
- size: "md",
36
- tone: "neutral"
37
- }
38
- }
39
- );
40
- var Tag = React.forwardRef(
41
- ({ className, size, tone = "neutral", children, ...props }, ref) => {
42
- warnDeprecated("Tag", "Badge");
43
- return /* @__PURE__ */ jsx(
44
- "span",
45
- {
46
- ref,
47
- className: cn(tagVariants({ size, tone }), className),
48
- ...props,
49
- children
50
- }
51
- );
52
- }
53
- );
54
- Tag.displayName = "Tag";
55
-
56
- export {
57
- tagVariants,
58
- Tag
59
- };
@@ -1,20 +0,0 @@
1
- 'use client';
2
-
3
- // src/utils/deprecated.ts
4
- var warned = /* @__PURE__ */ new Set();
5
- function warnDeprecated(name, replacement) {
6
- try {
7
- if (process.env.NODE_ENV === "production") return;
8
- } catch {
9
- return;
10
- }
11
- if (warned.has(name)) return;
12
- warned.add(name);
13
- console.warn(
14
- `[@nexub/react] ${name} is deprecated and will be removed in 3.0. Use ${replacement} instead.`
15
- );
16
- }
17
-
18
- export {
19
- warnDeprecated
20
- };
@@ -1,89 +0,0 @@
1
- 'use client';
2
- import {
3
- warnDeprecated
4
- } from "./chunk-VLME3JFF.js";
5
- import {
6
- cn
7
- } from "./chunk-WRVFNYO3.js";
8
-
9
- // src/components/StatusPill/StatusPill.tsx
10
- import * as React from "react";
11
- import { cva } from "class-variance-authority";
12
- import { jsx, jsxs } from "react/jsx-runtime";
13
- var statusPillVariants = cva(
14
- "inline-flex items-center gap-1.5 rounded-shape-control px-2.5 py-1 text-xs font-medium select-none",
15
- {
16
- variants: {
17
- tone: {
18
- neutral: "bg-[var(--color-surface-container-high)] text-[var(--color-on-surface-variant)] border border-[var(--color-outline-variant)]",
19
- info: "bg-[var(--color-info-container)] text-[var(--color-on-info-container)] border border-[color-mix(in_srgb,var(--color-info)_35%,transparent)]",
20
- success: "bg-[var(--color-success-container)] text-[var(--color-on-success-container)] border border-[color-mix(in_srgb,var(--color-success)_35%,transparent)]",
21
- warning: "bg-[var(--color-warning-container)] text-[var(--color-on-warning-container)] border border-[color-mix(in_srgb,var(--color-warning)_35%,transparent)]",
22
- danger: "bg-[var(--color-error-container)] text-[var(--color-on-error-container)] border border-[color-mix(in_srgb,var(--color-error)_35%,transparent)]",
23
- leap: "bg-[var(--color-leap-container)] text-[var(--color-on-leap-container)] border border-[color-mix(in_srgb,var(--color-leap)_35%,transparent)]",
24
- bookub: "bg-[var(--color-bookub-container)] text-[var(--color-on-bookub-container)] border border-[color-mix(in_srgb,var(--color-bookub)_35%,transparent)]",
25
- payub: "bg-[var(--color-payub-container)] text-[var(--color-on-payub-container)] border border-[color-mix(in_srgb,var(--color-payub)_35%,transparent)]",
26
- founderub: "bg-[var(--color-founderub-container)] text-[var(--color-on-founderub-container)] border border-[color-mix(in_srgb,var(--color-founderub)_35%,transparent)]"
27
- }
28
- },
29
- defaultVariants: {
30
- tone: "neutral"
31
- }
32
- }
33
- );
34
- var dotColorMap = {
35
- neutral: "bg-[var(--color-outline)]",
36
- info: "bg-[var(--color-info)]",
37
- success: "bg-[var(--color-success)]",
38
- warning: "bg-[var(--color-warning)]",
39
- danger: "bg-[var(--color-error)]",
40
- leap: "bg-[var(--color-leap)]",
41
- bookub: "bg-[var(--color-bookub)]",
42
- payub: "bg-[var(--color-payub)]",
43
- founderub: "bg-[var(--color-founderub)]"
44
- };
45
- var pulseTones = ["success", "info"];
46
- var StatusPill = React.forwardRef(
47
- ({ className, tone = "neutral", label, dot = false, ...props }, ref) => {
48
- warnDeprecated("StatusPill", "Badge");
49
- const shouldPulse = dot && pulseTones.includes(tone);
50
- return /* @__PURE__ */ jsxs(
51
- "span",
52
- {
53
- ref,
54
- className: cn(statusPillVariants({ tone }), className),
55
- ...props,
56
- children: [
57
- dot && /* @__PURE__ */ jsxs("span", { className: "relative inline-flex h-2 w-2 shrink-0", children: [
58
- shouldPulse && /* @__PURE__ */ jsx(
59
- "span",
60
- {
61
- className: cn(
62
- "animate-ping absolute inline-flex h-full w-full rounded-full opacity-75",
63
- dotColorMap[tone]
64
- ),
65
- "aria-hidden": "true"
66
- }
67
- ),
68
- /* @__PURE__ */ jsx(
69
- "span",
70
- {
71
- className: cn(
72
- "relative inline-flex rounded-full h-2 w-2",
73
- dotColorMap[tone]
74
- )
75
- }
76
- )
77
- ] }),
78
- label
79
- ]
80
- }
81
- );
82
- }
83
- );
84
- StatusPill.displayName = "StatusPill";
85
-
86
- export {
87
- statusPillVariants,
88
- StatusPill
89
- };
@@ -1,57 +0,0 @@
1
- 'use client';
2
- import {
3
- warnDeprecated
4
- } from "./chunk-VLME3JFF.js";
5
- import {
6
- cn
7
- } from "./chunk-WRVFNYO3.js";
8
-
9
- // src/components/Callout/Callout.tsx
10
- import * as React from "react";
11
- import { cva } from "class-variance-authority";
12
- import { jsx, jsxs } from "react/jsx-runtime";
13
- var calloutVariants = cva(
14
- "flex gap-2.5 rounded-shape-container px-3 py-2.5 text-sm",
15
- {
16
- variants: {
17
- tone: {
18
- neutral: "bg-[var(--color-surface-container-low)] text-[var(--color-on-surface)]",
19
- info: "bg-[var(--color-info-container)] text-[var(--color-on-info-container)]",
20
- success: "bg-[var(--color-success-container)] text-[var(--color-on-success-container)]",
21
- warning: "bg-[var(--color-warning-container)] text-[var(--color-on-warning-container)]",
22
- danger: "bg-[var(--color-error-container)] text-[var(--color-on-error-container)]",
23
- leap: "bg-[var(--color-leap-container)] text-[var(--color-on-leap-container)]",
24
- bookub: "bg-[var(--color-bookub-container)] text-[var(--color-on-bookub-container)]",
25
- payub: "bg-[var(--color-payub-container)] text-[var(--color-on-payub-container)]",
26
- founderub: "bg-[var(--color-founderub-container)] text-[var(--color-on-founderub-container)]"
27
- }
28
- },
29
- defaultVariants: {
30
- tone: "neutral"
31
- }
32
- }
33
- );
34
- var Callout = React.forwardRef(
35
- ({ className, tone = "neutral", icon, children, ...props }, ref) => {
36
- warnDeprecated("Callout", "Alert");
37
- return /* @__PURE__ */ jsxs(
38
- "div",
39
- {
40
- ref,
41
- className: cn(calloutVariants({ tone }), className),
42
- "data-tone": tone,
43
- ...props,
44
- children: [
45
- icon && /* @__PURE__ */ jsx("span", { className: "shrink-0 mt-0.5 inline-flex", "aria-hidden": "true", children: icon }),
46
- /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0", children })
47
- ]
48
- }
49
- );
50
- }
51
- );
52
- Callout.displayName = "Callout";
53
-
54
- export {
55
- calloutVariants,
56
- Callout
57
- };
@@ -1,12 +0,0 @@
1
- 'use client';
2
- import {
3
- Banner,
4
- bannerVariants
5
- } from "../../chunk-CQQ5UAO3.js";
6
- import "../../chunk-VLME3JFF.js";
7
- import "../../chunk-VMSWIC3O.js";
8
- import "../../chunk-WRVFNYO3.js";
9
- export {
10
- Banner,
11
- bannerVariants
12
- };
@@ -1,11 +0,0 @@
1
- 'use client';
2
- import {
3
- Callout,
4
- calloutVariants
5
- } from "../../chunk-Z46ISXJ6.js";
6
- import "../../chunk-VLME3JFF.js";
7
- import "../../chunk-WRVFNYO3.js";
8
- export {
9
- Callout,
10
- calloutVariants
11
- };
@@ -1,11 +0,0 @@
1
- 'use client';
2
- import {
3
- StatusPill,
4
- statusPillVariants
5
- } from "../../chunk-XIKO5XFW.js";
6
- import "../../chunk-VLME3JFF.js";
7
- import "../../chunk-WRVFNYO3.js";
8
- export {
9
- StatusPill,
10
- statusPillVariants
11
- };
@@ -1,11 +0,0 @@
1
- 'use client';
2
- import {
3
- Tag,
4
- tagVariants
5
- } from "../../chunk-PXISQY4H.js";
6
- import "../../chunk-VLME3JFF.js";
7
- import "../../chunk-WRVFNYO3.js";
8
- export {
9
- Tag,
10
- tagVariants
11
- };
@@ -1,13 +1,13 @@
1
1
  'use client';
2
- import {
3
- HelperText
4
- } from "./chunk-QKGQBJ4U.js";
5
2
  import {
6
3
  Label
7
4
  } from "./chunk-BM5PGGK2.js";
8
5
  import {
9
6
  FormError
10
7
  } from "./chunk-H2X6MSNY.js";
8
+ import {
9
+ HelperText
10
+ } from "./chunk-QKGQBJ4U.js";
11
11
  import {
12
12
  cn
13
13
  } from "./chunk-WRVFNYO3.js";