@hirobius/design-system 0.14.0 → 0.16.0

package/dist/tokens.js

@@ -125,7 +125,6 @@ const a = {
         mono: ["Geist Mono", "Courier New", "monospace"]
       },
       size: {
-        "2xs": "10px",
         xs: "13px",
         sm: "15px",
         base: "17px",
@@ -138,10 +137,8 @@ const a = {
         "6xl": "80px"
       },
       weight: {
-        light: "300",
         regular: "400",
         medium: "500",
-        semibold: "600",
         bold: "700"
       },
       lineHeight: {
@@ -153,11 +150,8 @@ const a = {
         relaxed: "1.625"
       },
       letterSpacing: {
-        tighter: "-0.02em",
         tight: "-0.01em",
         normal: "0em",
-        wide: "0.01em",
-        wider: "0.02em",
         caps: "0.06em"
       }
     },
@@ -197,10 +191,12 @@ const a = {
       80: "80px",
       96: "96px",
       interactive: {
-        min: "44px"
+        min: "44px",
+        minCompact: "24px"
       },
       width: {
         96: "96px",
+        280: "280px",
         760: "760px",
         1200: "1200px",
         "50ch": "50ch"
@@ -399,8 +395,14 @@ const o = "var(--primitive-typography-family-primary)", n = "var(--primitive-typ
     brandRGB: "30,46,253",
     white: "var(--primitive-color-neutral-white)",
     surface: {
-      page: { dark: "var(--semantic-color-surface-page)", light: "var(--semantic-color-surface-page)" },
-      raised: { dark: "var(--semantic-color-surface-raised)", light: "var(--semantic-color-surface-raised)" }
+      page: {
+        dark: "var(--semantic-color-surface-page)",
+        light: "var(--semantic-color-surface-page)"
+      },
+      raised: {
+        dark: "var(--semantic-color-surface-raised)",
+        light: "var(--semantic-color-surface-raised)"
+      }
     },
     blue: {
       50: "var(--primitive-color-blue-50)",
@@ -416,17 +418,28 @@ const o = "var(--primitive-typography-family-primary)", n = "var(--primitive-typ
       900: "var(--primitive-color-blue-900)"
     },
     feedback: {
-      success: { dark: a.primitive.color.green[400], light: a.primitive.color.green[700] },
-      warning: { dark: a.primitive.color.amber[400], light: a.primitive.color.amber[800] },
-      error: { dark: a.primitive.color.red[400], light: a.primitive.color.red[700] },
-      info: { dark: a.primitive.color.blue[300], light: a.primitive.color.blue[500] }
+      success: {
+        dark: a.primitive.color.green[400],
+        light: a.primitive.color.green[700]
+      },
+      warning: {
+        dark: a.primitive.color.amber[400],
+        light: a.primitive.color.amber[800]
+      },
+      error: {
+        dark: a.primitive.color.red[400],
+        light: a.primitive.color.red[700]
+      },
+      info: {
+        dark: a.primitive.color.blue[300],
+        light: a.primitive.color.blue[500]
+      }
     }
   },
   // ── Typography ───────────────────────────────────────────────────────────────
   fontFamily: o,
   monoFamily: n,
   fontSize: {
-    "2xs": "var(--primitive-typography-size-2xs)",
     xs: "var(--primitive-typography-size-xs)",
     sm: "var(--primitive-typography-size-sm)",
     base: "var(--primitive-typography-size-base)",
@@ -440,7 +453,6 @@ const o = "var(--primitive-typography-family-primary)", n = "var(--primitive-typ
   fontWeight: {
     regular: "var(--primitive-typography-weight-regular)",
     medium: "var(--primitive-typography-weight-medium)",
-    semibold: "var(--primitive-typography-weight-semibold)",
     bold: "var(--primitive-typography-weight-bold)"
   },
   lineHeight: {
@@ -452,11 +464,8 @@ const o = "var(--primitive-typography-family-primary)", n = "var(--primitive-typ
     relaxed: "var(--primitive-typography-lineHeight-relaxed)"
   },
   letterSpacing: {
-    tighter: "var(--primitive-typography-letterSpacing-tighter)",
     tight: "var(--primitive-typography-letterSpacing-tight)",
-    normal: "var(--primitive-typography-letterSpacing-normal)",
-    wide: "var(--primitive-typography-letterSpacing-wide)",
-    wider: "var(--primitive-typography-letterSpacing-wider)"
+    normal: "var(--primitive-typography-letterSpacing-normal)"
   },
   semantic: {
     color: {
@@ -547,12 +556,21 @@ const o = "var(--primitive-typography-family-primary)", n = "var(--primitive-typ
     labelTechnical: i.semantic.typography.mono
   },
   // ── Icons ────────────────────────────────────────────────────────────────────
+  // Sized off primitive.size, NOT the type ramp. An icon is geometry: it sits
+  // beside text, it does not scale with it. These were pointed at
+  // typography.size.base/lg/xl, which happened to read 16/20/24 — so the
+  // coupling was invisible until the ramp moved. Rescaling the ramp (hds#283)
+  // would have silently shrunk every medium icon 20→18 and every large 24→20,
+  // for no typographic reason, and no gate would have said a word.
+  //
+  // component.button.size.*.iconSize already referenced primitive.size; this
+  // brings the global bridge in line with what the component tokens do.
   iconSize: {
-    small: "var(--primitive-typography-size-base)",
+    small: "var(--primitive-size-16)",
     // 16px — default icon size
-    medium: "var(--primitive-typography-size-lg)",
+    medium: "var(--primitive-size-20)",
     // 20px — prominent icons
-    large: "var(--primitive-typography-size-xl)"
+    large: "var(--primitive-size-24)"
     // 24px — hero / large empty states
   },
   // ── Density-aware spacing ────────────────────────────────────────────────────

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/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/card.d.ts

@@ -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. */

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

@@ -7,7 +7,7 @@
 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. */
@@ -18,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,15 @@
  * @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 */
+/**
+ * CinematicLink - cinematic editorial link treatment for portfolio surfaces.
+ *
+ * @public
+ * @deprecated CinematicLink is an HDS docs/lab internal (editorial link treatment for portfolio/case-study specimen surfaces), not a consumer-facing HDS surface. It will be retiered to `utility` (dropped from the published barrel) at the named major.
+ * @removeIn 1.0.0
+ */
 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

@@ -21,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/component-instance-matrix.d.ts

@@ -6,7 +6,13 @@
  * @doc-exempt: specimen matrix helper used by docs pages, not a consumer-facing HDS surface.
  */
 import React from 'react';
-/** @public */
+/**
+ * ComponentInstanceMatrix — responsive specimen matrix for variant and state parity.
+ *
+ * @public
+ * @deprecated ComponentInstanceMatrix is an HDS docs/lab internal (specimen matrix helper for the component doc pages), not a consumer-facing HDS surface. It will be retiered to `utility` (dropped from the published barrel) at the named major.
+ * @removeIn 1.0.0
+ */
 export declare function ComponentInstanceMatrix({ componentName, dimensionX, dimensionY, title, isMobile: _isMobile, rowLabelWidth: _rowLabelWidth, rowLabelTone, freezeRowState, renderInstance, }: {
     componentName: string;
     dimensionX: string;

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/disclosure.d.ts

@@ -9,7 +9,7 @@ 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/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/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/foundation-swatch.d.ts

@@ -35,5 +35,11 @@ export type FoundationSwatchProps = {
     /** Explicit color value (hex or CSS var name) to pin the token chip's swatch square, overriding auto-resolution from tokenPath. */
     swatchVar?: string;
 };
+/**
+ * FoundationSwatch - governed foundation specimen for color and semantic role previews.
+ *
+ * @deprecated FoundationSwatch is an HDS docs/lab internal (foundation specimen preview for the token/foundation doc pages), not a consumer-facing HDS surface. It will be retiered to `utility` (dropped from the published barrel) at the named major.
+ * @removeIn 1.0.0
+ */
 export declare function FoundationSwatch({ label, hidePreviewLabel, tokenPath, tokenDisplayPreset, previewPosition, background, value, details, foreground, specimen, note, bordered, swatchVar, }: FoundationSwatchProps): import("react/jsx-runtime").JSX.Element;
 export {};

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.js';
 import { IconSize } from './icon.js';
-interface IconButtonProps extends Omit<ButtonProps, 'iconOnly' | 'children' | 'size'> {
+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/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`. */

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

@@ -5,7 +5,7 @@
  * @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. */
@@ -15,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/nav-group.d.ts

@@ -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

@@ -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/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/radio.d.ts

@@ -7,7 +7,7 @@
 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. */
@@ -16,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 {};

package/dist/types/src/app/components/segmented-control.d.ts

@@ -39,7 +39,7 @@ interface HdsSegmentedOption {
     /** Optional supporting description shown below the label. */
     description?: string;
 }
-interface SegmentedControlProps {
+export interface SegmentedControlProps {
     /** Accessible label for the control. */
     label?: string;
     /** Accessible label when no visible label should be rendered. */

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

@@ -0,0 +1,29 @@
+/**
+ * HdsSelect — dropdown selector built on Radix Select.
+ * @category Inputs
+ * @tier primitive
+ * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=82-49
+ */
+/**
+ * HdsSelect — dropdown selector built on Radix Select (ADR-001 Radix convention).
+ * Radix owns the listbox a11y contract: managed focus + active-descendant, typeahead,
+ * full keyboard (Home/End/PageUp-Down/wrap), Popper collision/flip positioning, and
+ * dismissal. The HDS surface is styled with the token-backed Tailwind idiom used by
+ * tabs.tsx / command-palette.tsx; `ref` targets the trigger button.
+ */
+export interface SelectProps {
+    /** Select label rendered above the control. */
+    label: string;
+    /** Controls whether the label is rendered. */
+    showLabel?: boolean;
+    /** Select options displayed in the dropdown. */
+    options: {
+        value: string;
+        label: string;
+    }[];
+    /** Currently selected value. */
+    value: string;
+    /** Called when the user picks a different option. */
+    onChange: (v: string) => void;
+}
+export declare const HdsSelect: import("react").ForwardRefExoticComponent<SelectProps & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -22,7 +22,7 @@
 import React from 'react';
 type SidebarSide = 'start' | 'end';
 type LayoutGap = 'tight' | 'normal' | 'inset' | 'spacious';
-interface SidebarProps {
+export interface SidebarProps {
     /** Exactly two children: the rail first, the fluid content second (DOM order — `side` only changes visual order). */
     children: [React.ReactNode, React.ReactNode];
     /** Which visual edge the rail renders on. Defaults to 'start'. */

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

@@ -10,4 +10,10 @@ export interface SketchProps {
     children: ReactNode;
     controls?: ReactNode;
 }
+/**
+ * Sketch — shared shell for generative canvases and WebGL sketches.
+ *
+ * @deprecated Sketch is an HDS docs/lab internal (shell for generative canvas/WebGL specimen pages), not a consumer-facing HDS surface. It will be retiered to `utility` (dropped from the published barrel) at the named major.
+ * @removeIn 1.0.0
+ */
 export declare function Sketch({ title, children, controls }: SketchProps): import("react/jsx-runtime").JSX.Element;

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

@@ -5,7 +5,7 @@
  * @figma https://www.figma.com/design/c8MaVgwxOlxm4wr8wnH0Z4/HDS-Tokens-Components?node-id=82-265
  */
 /** HdsSlider — range slider with label and value display. */
-interface SliderProps {
+export interface SliderProps {
     /** Slider label. */
     label: string;
     /** Minimum value in the range. */
@@ -20,4 +20,3 @@ interface SliderProps {
     onChange: (v: number) => void;
 }
 export declare const HdsSlider: import("react").ForwardRefExoticComponent<SliderProps & import("react").RefAttributes<HTMLInputElement>>;
-export {};

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

@@ -14,7 +14,7 @@ type SectionGap = 'stack';
 type GapOption = SemanticGap | ComponentGap | SubgridGap | SectionGap | keyof typeof hds.space;
 type FlexAlign = 'start' | 'center' | 'end' | 'stretch';
 type FlexJustify = 'start' | 'center' | 'end' | 'space-between';
-interface StackProps {
+export interface StackProps {
     /** Stack content rendered inside the flex wrapper. */
     children: React.ReactNode;
     /** Flex direction for the stack. */

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

@@ -1,4 +1,4 @@
-interface StepperFieldProps {
+export interface StepperFieldProps {
     label: string;
     value: number;
     min: number;
@@ -10,4 +10,3 @@ interface StepperFieldProps {
 }
 /** @public */
 export declare function StepperField({ label, value, min, max, step, onChange, inputStep, precision, }: StepperFieldProps): import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -6,7 +6,7 @@ declare const surfaceVariants: (props?: {
     shadow?: boolean;
 } & import("class-variance-authority/dist/types").ClassProp) => string;
 type SurfaceVariantProps = VariantProps<typeof surfaceVariants>;
-interface SurfaceProps extends Omit<HTMLAttributes<HTMLDivElement>, 'style' | 'className'>, Omit<SurfaceVariantProps, 'shadow'> {
+export interface SurfaceProps extends Omit<HTMLAttributes<HTMLDivElement>, 'style' | 'className'>, Omit<SurfaceVariantProps, 'shadow'> {
     /** Surface content. */
     children?: ReactNode;
     /** Padding: 'component' (24px, default) | 'item' (16px) | primitive px values | 'none' (0px). */