@hirobius/design-system 0.13.1 → 0.15.0

package/dist/types/src/app/components/activity-feed.d.ts

@@ -21,6 +21,10 @@ import type { ReactNode } from 'react';
  * fixed HDS tone vocabulary (`neutral | danger | success | warning | info`,
  * see docs/architecture/variant-contract.md). `'error'` remains supported
  * here as a back-compat alias for `'danger'`; new code should use `tone`.
+ *
+ * @removeIn 1.0.0 — CHANGELOG 0.13.0 already states `status`/`ActivityStatus`
+ * go in a future major. Dropping a prop is breaking, so 1.0.0 is the first
+ * version that can carry it.
  */
 export type ActivityStatus = 'success' | 'error' | 'warning' | 'info' | 'neutral';
 /** @public */
@@ -40,6 +44,8 @@ export interface ActivityEvent {
     /**
      * @deprecated Use `tone` instead. Retained for back-compat; `'error'`
      * resolves to the `danger` tone.
+     *
+     * @removeIn 1.0.0 — paired with ActivityStatus above; both go together.
      */
     status?: ActivityStatus;
     action?: {

package/dist/types/src/app/components/alert.d.ts

@@ -6,7 +6,7 @@
  */
 import React from 'react';
 type AlertTone = 'success' | 'danger' | 'warning' | 'info';
-interface AlertProps {
+export interface AlertProps {
     /** Feedback tone that controls icon, border, and surface treatment. */
     tone?: AlertTone;
     /** Optional heading shown above the body copy. */

package/dist/types/src/app/components/asset-img.d.ts

@@ -7,7 +7,7 @@
 import { CSSProperties } from 'react';
 import type React from 'react';
 type AssetImgContext = 'default' | 'lightbox' | 'detail';
-interface AssetImgProps {
+export interface AssetImgProps {
     /** Image source path. */
     src: string;
     /** Accessible alt text. */

package/dist/types/src/app/components/avatar.d.ts

@@ -2,6 +2,7 @@
  * Avatar - user or entity image with an initials fallback.
  * @category Display
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=34-18
  */
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';

package/dist/types/src/app/components/badge.d.ts

@@ -2,6 +2,7 @@
  * Badge - compact feedback badge for neutral and semantic states.
  * @category Feedback
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=31-15
  */
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';

package/dist/types/src/app/components/bleed.d.ts

@@ -20,7 +20,7 @@
 import React from 'react';
 type LayoutGap = 'tight' | 'normal' | 'inset' | 'spacious';
 type BleedAxis = 'x' | 'y' | 'both';
-interface BleedProps {
+export interface BleedProps {
     /** Bleed content. */
     children: React.ReactNode;
     /** Semantic space step to negate. Defaults to 'normal'. */

package/dist/types/src/app/components/box.d.ts

@@ -27,8 +27,8 @@
  * See `box-sx.ts` for the pure resolver + hashing/injection engine.
  */
 import React from 'react';
-import { type SxObject } from './box-sx';
-export type { SxObject, SxValue, ResponsiveValue, Breakpoint } from './box-sx';
+import { type SxObject } from './box-sx.js';
+export type { SxObject, SxValue, ResponsiveValue, Breakpoint } from './box-sx.js';
 /** @public */
 export interface BoxProps extends React.HTMLAttributes<HTMLElement> {
     /** Element (or component) rendered as the outer wrapper. Defaults to 'div'. */

package/dist/types/src/app/components/breadcrumb.d.ts

@@ -2,6 +2,7 @@
  * Breadcrumb - hierarchical navigation trail.
  * @category Navigation
  * @tier pattern
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=86-159
  */
 import * as React from 'react';
 declare const crumbLabelVariants: (props?: {

package/dist/types/src/app/components/button.d.ts

@@ -1,6 +1,7 @@
 /**
  * @category Actions
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=28-138
  * @figma Variant=Button/Variant
  * @figma Size=Button/Size
  */

package/dist/types/src/app/components/callout.d.ts

@@ -1,6 +1,7 @@
 /**
  * @category Feedback
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=88-85
  */
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';

package/dist/types/src/app/components/card.d.ts

@@ -44,8 +44,8 @@
  * for a hover/floating treatment on interactive cards.
  */
 import * as React from 'react';
-import hds from '../design-system/tokens';
-import { type PaddingOption } from './surface-padding';
+import hds from '../design-system/tokens.js';
+import { type PaddingOption } from './surface-padding.js';
 type GapOption = 'tight' | 'normal' | 'inset' | 'spacious' | keyof typeof hds.space;
 /** @public */
 export type CardVariant = 'default' | 'accent';
@@ -89,7 +89,7 @@ interface CardComponent extends React.ForwardRefExoticComponent<CardProps & Reac
     Progress: typeof CardProgress;
     Metric: typeof CardMetric;
 }
-interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+export interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Top-of-card metadata zone — status badges, tags, eyebrow labels.
      *  Accepts <Badge>, <Tag>, or compound nodes. NEVER pass raw spans
      *  with status colors here; use the proper primitive so tone, padding,
@@ -104,7 +104,7 @@ declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HT
 declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const CardBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-interface CardProgressProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'aria-valuemin' | 'aria-valuemax' | 'aria-valuenow'> {
+export interface CardProgressProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'aria-valuemin' | 'aria-valuemax' | 'aria-valuenow'> {
     /** Current value (0..max). */
     value: number;
     /** Maximum value. Defaults to 100. */
@@ -118,7 +118,7 @@ interface CardProgressProps extends Omit<React.HTMLAttributes<HTMLDivElement>, '
     tone?: CardTone;
 }
 declare const CardProgress: React.ForwardRefExoticComponent<CardProgressProps & React.RefAttributes<HTMLDivElement>>;
-interface CardMetricProps extends React.HTMLAttributes<HTMLDivElement> {
+export interface CardMetricProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Uppercase eyebrow label (e.g. "Retainer", "Open tasks"). */
     label: React.ReactNode;
     /** Big value (e.g. "$3,500", "12", "67%"). Rendered at h2 weight. */
@@ -129,6 +129,11 @@ interface CardMetricProps extends React.HTMLAttributes<HTMLDivElement> {
     tone?: CardTone;
 }
 declare const CardMetric: React.ForwardRefExoticComponent<CardMetricProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Tagged per-export, not on the file block: this module exports eight
+ * components and a file-level @figma would hand all eight this one node.
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=39-11
+ */
 export declare const Card: CardComponent;
 export { CardHeader, CardTitle, CardDescription, CardBody, CardFooter, CardProgress, CardMetric };
 /** @internal — CVA variant helper; compose via Card props instead. */

package/dist/types/src/app/components/center.d.ts

@@ -17,7 +17,7 @@
 import React from 'react';
 type CenterMaxWidth = 'content' | 'max';
 type LayoutGap = 'tight' | 'normal' | 'inset' | 'spacious';
-interface CenterProps {
+export interface CenterProps {
     /** Center content. */
     children: React.ReactNode;
     /** Max width: 'content' (760px prose) | 'max' (1200px full layouts). Defaults to 'content'. */

package/dist/types/src/app/components/checkbox.d.ts

@@ -2,11 +2,12 @@
  * HdsCheckbox — custom-drawn checkbox with check / indeterminate glyph.
  * @category Inputs
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=35-29
  */
 import type { InputHTMLAttributes } from 'react';
 /** HdsCheckbox — custom-drawn checkbox with check / indeterminate glyph. */
 export type HdsCheckboxDemoState = 'rest' | 'hover' | 'focused' | 'pressed' | 'disabled';
-interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'onChange'> {
+export interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'onChange'> {
     /** Checkbox label displayed next to the control. */
     label: string;
     /** Current checked state. */
@@ -17,4 +18,3 @@ interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'typ
     indeterminate?: boolean;
 }
 export declare const HdsCheckbox: import("react").ForwardRefExoticComponent<CheckboxProps & import("react").RefAttributes<HTMLInputElement>>;
-export {};

package/dist/types/src/app/components/cinematic-link.d.ts

@@ -4,10 +4,9 @@
  * @tier primitive
  */
 import React from 'react';
-interface CinematicLinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> {
+export interface CinematicLinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> {
     href: string;
     children: string;
 }
 /** @public */
 export declare function CinematicLink({ href, children, style, className, ...rest }: CinematicLinkProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/src/app/components/cluster.d.ts

@@ -18,7 +18,7 @@ import React from 'react';
 type LayoutGap = 'tight' | 'normal' | 'inset' | 'spacious';
 type ClusterAlign = 'start' | 'center' | 'end' | 'stretch';
 type ClusterJustify = 'start' | 'center' | 'end' | 'space-between';
-interface ClusterProps {
+export interface ClusterProps {
     /** Cluster content — items that wrap as a unit. */
     children: React.ReactNode;
     /** Gap token applied to both axes (row and column). Defaults to 'tight'. */

package/dist/types/src/app/components/code-block.d.ts

@@ -2,6 +2,7 @@
  * CodeBlock - code display with copy button and optional collapsible toggle.
  * @category Display
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=89-154
  */
 declare const blockContainerVariants: (props?: import("class-variance-authority/dist/types").ClassProp) => string;
 declare const inlineWrapperVariants: (props?: import("class-variance-authority/dist/types").ClassProp) => string;
@@ -20,7 +21,7 @@ declare const blockCodeTextVariants: (props?: import("class-variance-authority/d
 declare const prePanelVariants: (props?: {
     panelBackground?: boolean;
 } & import("class-variance-authority/dist/types").ClassProp) => string;
-interface CodeBlockProps {
+export interface CodeBlockProps {
     /** Code string displayed in the block. */
     code: string;
     /** Visual presentation mode for block snippets vs inline single-line code. */

package/dist/types/src/app/components/combobox.d.ts

@@ -2,6 +2,7 @@
  * Combobox — searchable single-select (Popover + filtered listbox).
  * @category Inputs
  * @tier pattern
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=82-237
  * @doc-exempt: no Inputs-overlay doc page yet — add demo when created
  *
  * A select-with-search built on the HDS Popover. The trigger shows the current

package/dist/types/src/app/components/container.d.ts

@@ -24,7 +24,7 @@
  */
 import type { ReactNode, CSSProperties } from 'react';
 type MaxWidthOption = 'content' | 'max';
-interface ContainerProps {
+export interface ContainerProps {
     /** Container content. */
     children: ReactNode;
     /** Max width: 'content' (760px for prose) | 'max' (1200px for full layouts). Defaults to 'max'. */

package/dist/types/src/app/components/cover.d.ts

@@ -18,7 +18,7 @@
  */
 import React from 'react';
 type LayoutGap = 'tight' | 'normal' | 'inset' | 'spacious';
-interface CoverProps {
+export interface CoverProps {
     /** The centered main region — takes the remaining space via auto margins. Also available as `centerSlot`. */
     children?: React.ReactNode;
     /** Alias for `children` — the centered main region. If both are set, `centerSlot` wins. */

package/dist/types/src/app/components/dialog.d.ts

@@ -69,5 +69,10 @@ interface DialogComponent extends React.FC<DialogProps> {
     Description: typeof DialogDescription;
     Close: typeof DialogClose;
 }
+/**
+ * Tagged per-export, not on the file block: this module exports ten components
+ * and a file-level @figma would hand all ten this one node.
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=93-27
+ */
 export declare const Dialog: DialogComponent;
 export { DialogTrigger, DialogPortal, DialogOverlay, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, DialogClose, };

package/dist/types/src/app/components/disclosure.d.ts

@@ -2,13 +2,14 @@
  * Disclosure - compact disclosure surface for optional explanatory content.
  * @category Layout
  * @tier pattern
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=88-453
  */
 import React, { type CSSProperties, type ReactNode } from 'react';
 type DisclosureVariant = 'panel' | 'nav' | 'card';
 declare const disclosureTriggerVariants: (props?: {
     variant?: "nav" | "panel" | "card";
 } & import("class-variance-authority/dist/types").ClassProp) => string;
-type DisclosureProps = {
+export type DisclosureProps = {
     /** Summary label rendered in the disclosure trigger. Accepts a string or ReactNode for icon+label combos. */
     label: ReactNode;
     /** Whether the disclosure starts in the open state. */

package/dist/types/src/app/components/divider.d.ts

@@ -2,6 +2,7 @@
  * Divider — semantic separator between content regions.
  * @category Layout
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=89-26
  */
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
@@ -17,6 +18,9 @@ export interface DividerProps extends Omit<React.HTMLAttributes<HTMLHRElement>,
     /**
      * @deprecated Use `variant="strong"` instead. Kept for backward
      * compatibility; when set, it takes precedence over `variant`.
+     *
+     * @removeIn 1.0.0 — a boolean superseded by a variant axis. Removing it
+     * is breaking, so it waits for the major.
      */
     strong?: boolean;
 }

package/dist/types/src/app/components/doc-link-card.d.ts

@@ -1,5 +1,5 @@
 import { type LucideIcon } from 'lucide-react';
-interface DocLinkCardProps {
+export interface DocLinkCardProps {
     /** Primary title displayed in the card. */
     title: string;
     /** Supporting body copy shown below the title. */

package/dist/types/src/app/components/empty-state.d.ts

@@ -2,6 +2,7 @@
  * EmptyState — consistent no-data placeholder for lists, grids, and sections.
  * @category Display
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=88-352
  * @ai-intent Inline empty-state placeholder so any list, grid, or section can
  *   communicate "no data yet" with consistent muted typography instead of agents
  *   inventing one-off `<p>No items.</p>` lines.

package/dist/types/src/app/components/error-boundary.d.ts

@@ -6,7 +6,7 @@
  * @doc-exempt: runtime safety infra, not an LLM-facing layout primitive
  */
 import { Component, type ErrorInfo, type ReactNode } from 'react';
-interface ErrorBoundaryProps {
+export interface ErrorBoundaryProps {
     children: ReactNode;
     slotLabel?: string;
     minHeight?: string;

package/dist/types/src/app/components/error-pattern.d.ts

@@ -1,4 +1,4 @@
-type ErrorPatternProps = {
+export type ErrorPatternProps = {
     /** Large recovery headline rendered through the animated cascade treatment. */
     displayText?: string;
     /** Supporting message explaining the recovery state to the user. */
@@ -6,4 +6,3 @@ type ErrorPatternProps = {
 };
 /** @public */
 export declare function ErrorPattern({ displayText, message, }: ErrorPatternProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/src/app/components/field.d.ts

@@ -1,6 +1,7 @@
 /**
  * @category Display
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=85-81
  */
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';

package/dist/types/src/app/components/form.d.ts

@@ -32,7 +32,13 @@
 import * as React from 'react';
 /** @public */
 export type FormProps = React.FormHTMLAttributes<HTMLFormElement>;
-/** Styled `<form>` with consistent vertical field rhythm. */
+/**
+ * Styled `<form>` with consistent vertical field rhythm.
+ *
+ * Tagged per-export: FormField and FormFieldShell share this module and have no
+ * Figma node, so a file-level @figma would claim this one for all three.
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=85-94
+ */
 export declare const Form: React.ForwardRefExoticComponent<FormProps & React.RefAttributes<HTMLFormElement>>;
 /** @public */
 export interface FieldWiringInput {

package/dist/types/src/app/components/frame.d.ts

@@ -19,7 +19,7 @@
  */
 import React from 'react';
 type FrameRadius = 'none' | 'sm' | 'md' | 'full';
-interface FrameProps {
+export interface FrameProps {
     /** Media rendered inside the locked-ratio, clipped frame. */
     children: React.ReactNode;
     /** Desired width-to-height ratio, e.g. `16 / 9`. Defaults to `16 / 9`. */

package/dist/types/src/app/components/grid.d.ts

@@ -27,7 +27,7 @@
 import React, { type ReactNode, type CSSProperties } from 'react';
 type SemanticGap = 'tight' | 'normal' | 'inset' | 'spacious';
 type GridLayout = 'fixed' | 'auto-fit';
-interface GridProps {
+export interface GridProps {
     /** Grid content. */
     children: ReactNode;
     /** Grid layout mode: 'fixed' (responsive) or 'auto-fit' (card wrapping). Defaults to 'fixed'. */
@@ -45,7 +45,7 @@ interface GridProps {
     /** Element rendered as the outer wrapper. Defaults to 'div'. */
     as?: React.ElementType;
 }
-interface GridItemProps {
+export interface GridItemProps {
     children: ReactNode;
     /** Number of columns this item spans (out of the grid's column count). */
     colSpan?: number;

package/dist/types/src/app/components/heading-stack.d.ts

@@ -30,7 +30,7 @@ type HdsHeadingLevel = NonNullable<HeadingStackLevelVariantProps['level']>;
 type HdsHeadingGap = NonNullable<HeadingStackGapVariantProps['gap']>;
 type HdsHeadingTag = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 type HdsSupportingTag = 'p' | 'div' | 'span';
-interface HeadingStackProps {
+export interface HeadingStackProps {
     /** The heading content (string). */
     heading: string;
     /** The supporting copy rendered beneath the heading. */

package/dist/types/src/app/components/icon-button.d.ts

@@ -1,7 +1,7 @@
 import type { LucideIcon } from 'lucide-react';
-import { ButtonProps } from './button';
-import { IconSize } from './icon';
-interface IconButtonProps extends Omit<ButtonProps, 'iconOnly' | 'children' | 'size'> {
+import { ButtonProps } from './button.js';
+import { IconSize } from './icon.js';
+export interface IconButtonProps extends Omit<ButtonProps, 'iconOnly' | 'children' | 'size'> {
     /** Lucide icon rendered inside the button. */
     icon: LucideIcon;
     /** Size token for the button itself. */
@@ -20,4 +20,3 @@ interface IconButtonProps extends Omit<ButtonProps, 'iconOnly' | 'children' | 's
  */
 /** @public */
 export declare const IconButton: import("react").ForwardRefExoticComponent<IconButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
-export {};

package/dist/types/src/app/components/icon.d.ts

@@ -5,7 +5,7 @@
  */
 import React from 'react';
 import type { LucideIcon } from 'lucide-react';
-import hds from '../design-system/tokens';
+import hds from '../design-system/tokens.js';
 /** @public */
 export type IconSize = keyof typeof hds.iconSize | number | string;
 export interface IconProps {

package/dist/types/src/app/components/image-lightbox.d.ts

@@ -1,4 +1,4 @@
-interface LightboxProps {
+export interface LightboxProps {
     open: boolean;
     onClose: () => void;
     src: string;
@@ -10,4 +10,3 @@ interface LightboxProps {
     captionLabel?: string;
 }
 export declare function Lightbox({ open, onClose, src, alt, naturalWidth, naturalHeight, caption, captionHref, captionLabel, }: LightboxProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/src/app/components/inline-code.d.ts

@@ -4,7 +4,7 @@ declare const inlineCodeVariants: (props?: {
     density?: "compact" | "comfortable";
 } & import("class-variance-authority/dist/types").ClassProp) => string;
 type InlineCodeVariantProps = VariantProps<typeof inlineCodeVariants>;
-type InlineCodeProps = {
+export type InlineCodeProps = {
     children: ReactNode;
     style?: CSSProperties;
     /** Layout density. `compact` tightens vertical rhythm for dense body copy and table prose. Defaults to `comfortable`. */
@@ -12,6 +12,9 @@ type InlineCodeProps = {
     /**
      * @deprecated Use `density="compact"` instead. Kept for backward
      * compatibility; when set, it takes precedence over `density`.
+     *
+     * @removeIn 1.0.0 — a boolean superseded by a variant axis, breaking to
+     * remove, so it waits for the major.
      */
     compact?: boolean;
     /** Show a copy-to-clipboard button. children must be a string when true. */

package/dist/types/src/app/components/inline-link.d.ts

@@ -2,9 +2,10 @@
  * InlineLink ” inline navigation and external-link primitive for body copy.
  * @category Navigation
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=89-161
  */
 import React from 'react';
-interface InlineLinkProps {
+export interface InlineLinkProps {
     /** Destination route or URL. */
     href: string;
     /** Inline label or content to render inside the link. */
@@ -14,4 +15,3 @@ interface InlineLinkProps {
 }
 /** @public */
 export declare function InlineLink({ href, children, externalIcon }: InlineLinkProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/src/app/components/input.d.ts

@@ -2,6 +2,7 @@
  * Input — text field primitive with label, helper, and error slots.
  * @category Inputs
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=38-20
  */
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';

package/dist/types/src/app/components/menu.d.ts

@@ -2,6 +2,7 @@
  * Menu — dropdown menu (shadcn baseline, compound parts).
  * @category Overlays
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=93-59
  * @doc-exempt: no Overlays doc page yet — add demo when the overlays page is created
  *
  * Radix DropdownMenu (@radix-ui/react-dropdown-menu) themed with the overlay

package/dist/types/src/app/components/nav-group.d.ts

@@ -1,6 +1,6 @@
 import type { CSSProperties, ReactNode } from 'react';
-import { type NavLevel } from '../lib/navLevels';
-import { NavItem } from './nav-item';
+import { type NavLevel } from '../lib/navLevels.js';
+import { NavItem } from './nav-item.js';
 type NavItem = {
     path: string;
     label: string;
@@ -10,7 +10,7 @@ type NavGroupVariant = 'side' | 'toc';
 declare const navGroupLabelVariants: (props?: {
     variant?: "side" | "toc";
 } & import("class-variance-authority/dist/types").ClassProp) => string;
-type NavGroupProps = {
+export type NavGroupProps = {
     label?: string;
     variant?: NavGroupVariant;
     level?: NavLevel;

package/dist/types/src/app/components/nav-item.d.ts

@@ -1,6 +1,6 @@
 import type { AnchorHTMLAttributes, MouseEvent } from 'react';
 import { type VariantProps } from 'class-variance-authority';
-import { type NavLevel } from '../lib/navLevels';
+import { type NavLevel } from '../lib/navLevels.js';
 declare const navItemVariants: (props?: {
     variant?: "side" | "toc";
     state?: "default" | "active" | "disabled" | "focus" | "hover";
@@ -11,7 +11,7 @@ declare const navIndicatorVariants: (props?: {
 type NavItemVariantProps = VariantProps<typeof navItemVariants>;
 type NavVariant = NonNullable<NavItemVariantProps['variant']>;
 type NavNativeProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'children' | 'onClick'>;
-interface NavProps extends NavNativeProps {
+export interface NavProps extends NavNativeProps {
     /** Visual layout variant for side nav or table of contents usage. */
     variant?: NavVariant;
     /** Text label displayed inside the navigation row. */

package/dist/types/src/app/components/page.d.ts

@@ -28,7 +28,7 @@
 import type { ReactNode, CSSProperties } from 'react';
 type MaxWidth = 'content' | 'max';
 type PaddingY = 'default' | 'compact' | 'none';
-interface PageProps {
+export interface PageProps {
     children: ReactNode;
     /** Max width: 'content' (760px for prose) | 'max' (1200px). Defaults to 'max'. */
     maxWidth?: MaxWidth;

package/dist/types/src/app/components/pagination.d.ts

@@ -2,6 +2,7 @@
  * Pagination - paged navigation control with truncation.
  * @category Navigation
  * @tier pattern
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=86-194
  */
 import * as React from 'react';
 type PageToken = number | 'ellipsis';

package/dist/types/src/app/components/pin.d.ts

@@ -13,7 +13,7 @@
  * `@hirobius/design-system/scroll`. See ADR-021.
  */
 import React from 'react';
-interface PinProps {
+export interface PinProps {
     /** Content pinned within the scroll region. */
     children: React.ReactNode;
     /** Sticky offset from the top of the scroll region (CSS length). Defaults to '0'. */
@@ -27,4 +27,3 @@ interface PinProps {
 }
 /** @public */
 export declare const Pin: React.ForwardRefExoticComponent<PinProps & React.RefAttributes<HTMLDivElement>>;
-export {};

package/dist/types/src/app/components/popover.d.ts

@@ -2,6 +2,7 @@
  * Popover — floating surface anchored to a trigger (shadcn baseline, compound parts).
  * @category Overlays
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=93-32
  * @doc-exempt: no Overlays doc page yet — add demo when the overlays page is created
  *
  * Radix Popover (@radix-ui/react-popover) themed with role tokens. Provides

package/dist/types/src/app/components/progress.d.ts

@@ -2,6 +2,7 @@
  * Progress - linear progress bar (determinate or indeterminate).
  * @category Feedback
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=88-91
  */
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';

package/dist/types/src/app/components/radio.d.ts

@@ -2,11 +2,12 @@
  * HdsRadio — radio button with animated selection indicator.
  * @category Inputs
  * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=36-17
  */
 import type { InputHTMLAttributes } from 'react';
 /** HdsRadio — radio button with animated selection indicator. */
 export type HdsRadioDemoState = 'rest' | 'hover' | 'focused' | 'pressed' | 'disabled';
-interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'onChange'> {
+export interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'onChange'> {
     /** Radio label displayed next to the control. */
     label: string;
     /** Current checked state. */
@@ -15,4 +16,3 @@ interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'
     onChange: (v: boolean) => void;
 }
 export declare const HdsRadio: import("react").ForwardRefExoticComponent<RadioProps & import("react").RefAttributes<HTMLInputElement>>;
-export {};

package/dist/types/src/app/components/reveal.d.ts

@@ -14,7 +14,7 @@
  */
 import React from 'react';
 export type RevealAnimation = 'fade' | 'fade-up' | 'fade-down' | 'scale';
-interface RevealProps {
+export interface RevealProps {
     /** Content revealed as it scrolls into view. */
     children: React.ReactNode;
     /** Entrance animation. Defaults to 'fade-up'. */
@@ -28,4 +28,3 @@ interface RevealProps {
 }
 /** @public */
 export declare const Reveal: React.ForwardRefExoticComponent<RevealProps & React.RefAttributes<HTMLDivElement>>;
-export {};