@opencxh/ui-kit 3.182.1 → 3.183.0

package/dist/src/content/Page.d.ts

@@ -1,6 +1,6 @@
 import { default as React, ReactNode } from 'react';
 import { ContentLoadingShape } from '../feedback/ContentLoading';
-import { PageHeaderAction } from './PageHeader';
+import { BreadcrumbItem, PageHeaderAction } from './PageHeader';
 /**
  * The `md` gutter matches `PageHeader`'s own horizontal padding, so the table
  * or form below lines up with the title above it. The top value is small
@@ -18,6 +18,11 @@ export interface PageProps {
     subtitle?: string;
     /** Line under the title — a count, a record, a timestamp. */
     meta?: ReactNode;
+    /**
+     * Trail above the title. Leave the last entry without an `onClick` — it is
+     * this page. See `BreadcrumbItem`.
+     */
+    breadcrumbs?: BreadcrumbItem[];
     /** Toolbar actions, right-aligned in the header. */
     actions?: PageHeaderAction[];
     /** Renders the back chevron beside the title. */

package/dist/src/content/PageHeader.d.ts

@@ -18,6 +18,13 @@ export interface PageHeaderAction {
      */
     render?: () => React.ReactNode;
 }
+export interface BreadcrumbItem {
+    label: string;
+    /** Mark before the label — an identity plate, a channel glyph. */
+    icon?: React.ReactNode;
+    /** Omit on the last entry: you are already there. */
+    onClick?: () => void;
+}
 export interface PageHeaderProps {
     /**
      * `plain` sits directly on the page. `surface` is the app-bar treatment:
@@ -36,10 +43,15 @@ export interface PageHeaderProps {
      * an inline row of properties survives a narrow window.
      */
     meta?: React.ReactNode;
-    breadcrumbs?: Array<{
-        label: string;
-        href?: string;
-    }>;
+    /**
+     * Trail above the title: where this page sits. The last entry is the current
+     * page and is never a control, so give only the ones before it an `onClick`.
+     *
+     * `onClick`, not `href`: an anchor inside a federated app is a full page
+     * load. Routing belongs to the app, so the crumb reports the click and the
+     * caller navigates.
+     */
+    breadcrumbs?: BreadcrumbItem[];
     actions?: PageHeaderAction[];
     children?: React.ReactNode;
     className?: string;

package/dist/src/index.d.ts

@@ -19,7 +19,7 @@ export { List, ListBulkAction, type ListGroup, type ListProps } from './content/
 export { MessageBubble, type MessageBubbleProps } from './content/MessageBubble';
 export { MetaSeparator, MetaValue, type MetaValueProps } from './content/MetaValue';
 export { Page, type PageProps } from './content/Page';
-export { PageHeader, type PageHeaderAction, type PageHeaderProps, } from './content/PageHeader';
+export { type BreadcrumbItem, PageHeader, type PageHeaderAction, type PageHeaderProps, } from './content/PageHeader';
 export { PageToolbar, PageToolbarActions, type PageToolbarActionsProps, type PageToolbarProps, } from './content/PageToolbar';
 export { RichText, type RichTextProps } from './content/RichText';
 export type { MentionRef } from './content/richTextMentions';
@@ -71,6 +71,6 @@ export * from './typography/Text';
 export { Text, type TextProps } from './typography/Text';
 export { type CatTone, catTone } from './utils/catTone';
 export { cn, createSizes, createVariants } from './utils/cn';
-export { IDENTITY_TONE_COUNT, type IdentityTone, identityDotClass, identityPlateClass, identityTone, } from './utils/identity';
+export { IDENTITY_TONE_COUNT, type IdentityTone, identityDotClass, identityPlateClass, identityStrongClass, identityTone, } from './utils/identity';
 export { normalizeText, text } from './utils/text';
 export { type AnchoredPositionOptions, type AnchorRect, useAnchoredPosition, } from './utils/useAnchoredPosition';

package/dist/src/utils/identity.d.ts

@@ -23,3 +23,13 @@ export declare function identityTone(seed: string | undefined | null): IdentityT
 export declare function identityPlateClass(seed: string | undefined | null): string;
 /** The solid colour, for a dot or a rule. */
 export declare function identityDotClass(seed: string | undefined | null): string;
+/**
+ * Dark ground, light mark — for a plate that carries **text** rather than a
+ * monogram or a glyph: a project key, a short reference.
+ *
+ * Not {@link identityPlateClass}: a wash with a same-hue mark on it is
+ * colour-on-colour, and at 10px the key stops being legible before the colour
+ * stops being decorative. This ramp keeps its dark ground in both themes, so
+ * the same key reads the same way in light and dark.
+ */
+export declare function identityStrongClass(seed: string | undefined | null): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencxh/ui-kit",
-  "version": "3.182.1",
+  "version": "3.183.0",
   "description": "Theme-aware UI component library for OpenCXH platform",
   "type": "module",
   "exports": {