@nadicodeai/ui 0.14.0 → 0.15.0

package/dist/components/brand.d.ts

@@ -4,6 +4,7 @@ type BrandLogoProps = Omit<React.ComponentProps<"svg">, "aria-hidden" | "aria-la
     decoding?: React.ComponentProps<"img">["decoding"];
 };
 declare function BrandMark({ alt, className, width, height, decoding, ...props }: BrandLogoProps): React.JSX.Element;
+declare function BrandLockup({ alt, className, width, height, decoding, ...props }: BrandLogoProps): React.JSX.Element;
 declare function BrandWordmark({ alt, className, width, height, decoding, ...props }: BrandLogoProps): React.JSX.Element;
-export { BrandMark, BrandWordmark };
+export { BrandLockup, BrandMark, BrandWordmark };
 //# sourceMappingURL=brand.d.ts.map

package/dist/components/brand.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"brand.d.ts","sourceRoot":"","sources":["../../src/components/brand.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,cAAc,GAAG,IAAI,CACxB,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,aAAa,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CACnD,GAAG;IACF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;CACpD,CAAC;AA6BF,iBAAS,SAAS,CAAC,EACjB,GAAkB,EAClB,SAAS,EACT,KAAU,EACV,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAyBhB;AAED,iBAAS,aAAa,CAAC,EACrB,GAAkB,EAClB,SAAS,EACT,KAAU,EACV,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAoBhB;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"brand.d.ts","sourceRoot":"","sources":["../../src/components/brand.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,cAAc,GAAG,IAAI,CACxB,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,aAAa,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CACnD,GAAG;IACF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;CACpD,CAAC;AA6BF,iBAAS,SAAS,CAAC,EACjB,GAAkB,EAClB,SAAS,EACT,KAAU,EACV,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAyBhB;AAED,iBAAS,WAAW,CAAC,EACnB,GAAkB,EAClB,SAAS,EACT,KAAW,EACX,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAuBhB;AAED,iBAAS,aAAa,CAAC,EACrB,GAAkB,EAClB,SAAS,EACT,KAAU,EACV,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAoBhB;AAED,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/brand.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { logoMarkGeometry, logoWordmarkGeometry, resolveLogoGeometry, } from "@nadicodeai/design-system/assets/logo-geometry";
+import { logoLockupGeometry, logoMarkGeometry, logoWordmarkGeometry, resolveLogoGeometry, } from "@nadicodeai/design-system/assets/logo-geometry";
 import * as React from "react";
 import { cn } from "../lib/utils.js";
 function accessibilityProps(alt) {
@@ -30,6 +30,15 @@ function BrandMark({ alt = "NadicodeAI", className, width = 32, height = 32, dec
     });
     return (_jsx("svg", { "data-slot": "brand-mark", xmlns: "http://www.w3.org/2000/svg", viewBox: geometry.viewBox, width: width, height: height, className: cn("block size-6", className), ...accessibilityProps(alt), ...props, children: renderGeometryNodes(geometry.nodes) }));
 }
+function BrandLockup({ alt = "NadicodeAI", className, width = 154, height = 32, decoding, ...props }) {
+    void decoding;
+    const idPrefix = `lklip-${React.useId().replace(/[^a-zA-Z0-9]/g, "")}-`;
+    const geometry = resolveLogoGeometry(logoLockupGeometry, {
+        idPrefix,
+        paints: { ink: "currentColor", primary: "var(--primary)" },
+    });
+    return (_jsx("svg", { "data-slot": "brand-lockup", xmlns: "http://www.w3.org/2000/svg", viewBox: geometry.viewBox, width: width, height: height, className: cn("block h-8 w-auto", className), ...accessibilityProps(alt), ...props, children: renderGeometryNodes(geometry.nodes) }));
+}
 function BrandWordmark({ alt = "NadicodeAI", className, width = 96, height = 30, decoding, ...props }) {
     void decoding;
     const geometry = resolveLogoGeometry(logoWordmarkGeometry, {
@@ -37,4 +46,4 @@ function BrandWordmark({ alt = "NadicodeAI", className, width = 96, height = 30,
     });
     return (_jsx("svg", { "data-slot": "brand-wordmark", xmlns: "http://www.w3.org/2000/svg", viewBox: geometry.viewBox, width: width, height: height, className: cn("block h-6 w-auto", className), ...accessibilityProps(alt), ...props, children: renderGeometryNodes(geometry.nodes) }));
 }
-export { BrandMark, BrandWordmark };
+export { BrandLockup, BrandMark, BrandWordmark };

package/docs/consuming-cross-repo.md

@@ -46,6 +46,23 @@ If the app needs bundled Geist files rather than its framework's font loader,
 that asset import is one of the intentional direct-API cases described above.
 Font loading is an asset decision, not a second design stylesheet.
 
+## NadicodeAI logo
+
+React surfaces that need both the mark and readable company name use the
+horizontal lockup from the UI package:
+
+```tsx
+import { BrandLockup } from "@nadicodeai/ui/components/brand";
+
+<BrandLockup alt="NadicodeAI" />;
+```
+
+Use `BrandMark` where space is tight and `BrandWordmark` where the name must read
+by itself. Do not assemble a new lockup from those two components. Static
+consumers that need files instead of React declare the design-system dependency
+directly and use the documented SVG or PNG package routes in
+`design-system/README.md`.
+
 ## Base UI API breaks (migrating from Radix-era components)
 
 `@nadicodeai/ui@0.5.0+` is Base UI only; the Radix-era compatibility layer is

package/docs/contract.md

@@ -25,7 +25,7 @@ Agent work surfaces (chat, composer, tool approval, artifacts, threads, diffs, t
 - **Standard components, not app-owned product features.** This package ships primitives, standard UI components, AI Elements, brand adapters, React adapters, reusable sections, and presentational product components. It must not ship app-specific feature/use-case screens or names such as operator-login, portal activation, customer credential control, or customer management. Generic data tables, command palettes, and chart cards are app-owned shadcn registry adaptations. The source-backed `chart-*` package surface is the plan-approved exception per issue #166 and ADR 0010; chart cards remain app-owned. Every data-shaped chart exposes an equivalent non-visual data alternative. A component whose complete value is already available in visible text or `aria-valuetext` does not add a redundant table.
 - **Auth routes are consumer-owned shadcn block work.** Login, signup, OTP, two-factor, magic-link, and provider-button flows start from the selected shadcn block/example in the consuming app, with app-owned Better Auth behavior. Do not ship generic auth, signup, OTP, federated-login, or provider abstractions from this package unless a later explicit boundary decision replaces the selected shadcn block.
 - **Reusable sections and compositions live here after proof.** Bento grids, media mounts, demo surfaces, page frames, section intros, CTA bands, proof slots, benefits grids, generic shells, and homepage/use-case sections belong in `@nadicodeai/ui` when a second concrete consumer, a plan-approved shared component, or a named validation slice proves the package boundary. Website, portal, and sibling Nadia routes pass data and media children into existing compositions instead of rebuilding layout locally.
-- **Brand renderers live here for React consumers.** Logo geometry, asset generation, and usage semantics are owned by [`design-system/DESIGN.md`, "Brand media authority"](../../../design-system/DESIGN.md#brand-media-authority). `BrandMark` and `BrandWordmark` render that package's public neutral geometry seam with React-scoped SVG ids, dynamic theme paint, and accessible names. Consuming routes use these adapters; they never import raw logo assets, draw brand SVG inline, mask or recolor assets, or create another lockup rule.
+- **Brand renderers live here for React consumers.** Logo geometry, asset generation, and usage semantics are owned by [`design-system/DESIGN.md`, "Brand media authority"](../../../design-system/DESIGN.md#brand-media-authority). `BrandLockup` supplies the approved horizontal lockup. `BrandMark` serves tight spaces and `BrandWordmark` serves placements where the name must read by itself. All three render the package's public neutral geometry seam with React-scoped SVG ids, dynamic theme paint, and accessible names. Consuming routes use these adapters; they never import raw logo assets, draw brand SVG inline, mask or recolor assets, or create another lockup rule.
 - **No fake proof APIs.** Components may support future testimonials, logos, stats, and proof slots, but they must render nothing public when the proof is absent. Do not ship placeholder customer names, metrics, or logos.
 
 ## Accessibility Invariant

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nadicodeai/ui",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -63,7 +63,7 @@
   },
   "dependencies": {
     "@base-ui/react": "^1.6.0",
-    "@nadicodeai/design-system": "0.14.0",
+    "@nadicodeai/design-system": "0.15.0",
     "@rive-app/react-webgl2": "^4.29.1",
     "@streamdown/cjk": "^1.0.3",
     "@streamdown/code": "^1.1.1",