@nexub/react 4.6.0 → 4.7.0

package/accessibility.json

@@ -1,5 +1,5 @@
 {
-  "version": "4.6.0",
+  "version": "4.7.0",
   "standard": "WCAG 2.2 Level AA",
   "method": {
     "automated": "axe-core rules tagged wcag2a, wcag2aa, wcag21a, wcag21aa and wcag22aa, run on every Storybook story in light and dark on every pull request; a new violation fails the build.",

package/dist/components/Button/Button.d.ts

@@ -4,7 +4,7 @@ import type { ToneValue } from '@nexub/core';
 export type { ToneValue };
 export { toneTextClasses } from '../../utils/control.js';
 export declare const buttonVariants: (props?: ({
-    variant?: "accent" | "text" | "link" | "outline" | "glass" | "ghost" | "subtle" | "filled" | "tonal" | "outlined" | "hero" | "primary" | "secondary" | "destructive" | null | undefined;
+    variant?: "accent" | "text" | "link" | "outline" | "primary" | "glass" | "ghost" | "subtle" | "filled" | "tonal" | "outlined" | "hero" | "secondary" | "destructive" | null | undefined;
     size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     fullWidth?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/hooks/useIsomorphicLayoutEffect.d.ts

@@ -1,2 +1,2 @@
-import { useLayoutEffect } from 'react';
-export declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
+import { useEffect } from 'react';
+export declare const useIsomorphicLayoutEffect: typeof useEffect;

package/dist/hooks/useScopedSeed.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+/**
+ * 4.7: recolours one element (and everything inside it) from a brand seed, like
+ * <ThemeProvider seed> but scoped, e.g. to preview a customer's brand on one
+ * card or section. Writes the seeded role variables through the CSSOM (strict-
+ * CSP safe) and removes them when the seed is cleared or the component unmounts.
+ * Lazy-loads @nexub/tokens/seed, so the colour library stays out of the main bundle.
+ */
+export declare function useScopedSeed<T extends HTMLElement>(ref: React.RefObject<T | null>, seed: string | null | undefined, options?: {
+    target?: 'primary' | 'tertiary';
+}): void;

package/dist/hooks/useScopedSeed.js

@@ -0,0 +1,24 @@
+"use client";
+import * as React from "react";
+function useScopedSeed(ref, seed, options = {}) {
+  const { target = "primary" } = options;
+  React.useEffect(() => {
+    const el = ref.current;
+    if (!el || !seed) return;
+    let applied = [];
+    let cancelled = false;
+    import("@nexub/tokens/seed").then(({ createSeedTheme }) => {
+      if (cancelled) return;
+      const vars = createSeedTheme(seed, { target });
+      for (const [k, v] of Object.entries(vars)) el.style.setProperty(k, v);
+      applied = Object.keys(vars);
+    });
+    return () => {
+      cancelled = true;
+      for (const k of applied) el.style.removeProperty(k);
+    };
+  }, [ref, seed, target]);
+}
+export {
+  useScopedSeed
+};

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 export { cn } from './utils/cn.js';
 export type { Size } from './utils/control.js';
 export { startViewTransition } from './utils/viewTransition.js';
+export { useScopedSeed } from './hooks/useScopedSeed.js';
 export { useControllableState } from './hooks/useControllableState.js';
 export { useDisclosure } from './hooks/useDisclosure.js';
 export { useIsomorphicLayoutEffect } from './hooks/useIsomorphicLayoutEffect.js';

package/dist/index.js

@@ -1,5 +1,6 @@
 import { cn } from "./utils/cn.js";
 import { startViewTransition } from "./utils/viewTransition.js";
+import { useScopedSeed } from "./hooks/useScopedSeed.js";
 import { useControllableState } from "./hooks/useControllableState.js";
 import { useDisclosure } from "./hooks/useDisclosure.js";
 import { useIsomorphicLayoutEffect } from "./hooks/useIsomorphicLayoutEffect.js";
@@ -297,6 +298,7 @@ export {
   useNexubMessages,
   usePointerSheen,
   usePrefersReducedMotion,
+  useScopedSeed,
   useTheme,
   useToastStore
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nexub/react",
-  "version": "4.6.0",
+  "version": "4.7.0",
   "description": "React component library for Nexub Design System — 90+ accessible, themeable UI components built on Radix UI primitives.",
   "type": "module",
   "license": "MIT",
@@ -81,13 +81,13 @@
     "date-fns": "^4.4.0",
     "react-day-picker": "^10.0.2",
     "tailwind-merge": "^3.7.0",
-    "@nexub/core": "4.6.0",
-    "@nexub/icons": "4.6.0"
+    "@nexub/icons": "4.7.0",
+    "@nexub/core": "4.7.0"
   },
   "peerDependencies": {
     "react": ">=18 <20",
     "react-dom": ">=18 <20",
-    "@nexub/tokens": "^4.6.0"
+    "@nexub/tokens": "^4.7.0"
   },
   "devDependencies": {
     "@playwright/test": "1.64.0",
@@ -113,8 +113,8 @@
     "vaul": "1.1.2",
     "vite": "^8.3.5",
     "vitest": "^5.0.5",
-    "@nexub/themes": "4.6.0",
-    "@nexub/tokens": "4.6.0"
+    "@nexub/themes": "4.7.0",
+    "@nexub/tokens": "4.7.0"
   },
   "scripts": {
     "build": "rm -rf dist && tsup && tsc -p tsconfig.build.json && rm -f dist/vendor/*.d.ts && node scripts/check-dts.mjs && tailwindcss -i src/styles.css -o dist/styles.css --minify && cp -R ../themes/src/fonts dist/fonts",