@mercury-fx/ui 2.4.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Jonnify <mercury@jonnify.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,44 @@
+# @mercury-fx/ui
+
+The **Mercury** design system's React component library — token-driven,
+presentational components styled through enum props (`variant` / `size` / `tone`).
+
+## Install
+
+```bash
+npm i @mercury-fx/ui
+npm i react react-dom             # peer dependencies
+```
+
+[`@mercury-fx/core`](https://www.npmjs.com/package/@mercury-fx/core) comes along
+transitively.
+
+## Use
+
+```tsx
+import "@mercury-fx/ui/styles.css";       // required — components are class-driven
+import { Button, Card } from "@mercury-fx/ui";
+
+export function App() {
+  return (
+    <Card>
+      <Button variant="primary">Ship it</Button>
+    </Card>
+  );
+}
+```
+
+### Styles
+
+Components carry no inline CSS — import the bundle once at your app root:
+
+```ts
+import "@mercury-fx/ui/styles.css";   // the full component CSS
+import "@mercury-fx/ui/tokens.css";   // …or just the design tokens
+```
+
+A `dark-theme` class on any ancestor flips every token.
+
+## License
+
+MIT

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

@@ -0,0 +1,17 @@
+import type { ButtonHTMLAttributes, ReactNode } from "react";
+export type ButtonVariant = "primary" | "secondary" | "outline" | "ghost" | "destructive" | "inverse";
+export type ButtonSize = "sm" | "md" | "lg";
+export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "type"> {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    /** Swap the label for a spinner and disable interaction. */
+    loading?: boolean;
+    /** Stretch to the container width. */
+    fullWidth?: boolean;
+    /** Element rendered before the label (usually an `<Icon />`). */
+    leading?: ReactNode;
+    /** Element rendered after the label. */
+    trailing?: ReactNode;
+    type?: "button" | "submit" | "reset";
+}
+export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -0,0 +1 @@
+export * from "./Button";

package/dist/components/actions/IconButton/IconButton.d.ts

@@ -0,0 +1,24 @@
+import type { ButtonHTMLAttributes } from "react";
+import type { IconName } from "../../foundations/Icon";
+export type IconButtonVariant = "primary" | "secondary" | "outline" | "ghost" | "destructive";
+export type IconButtonSize = "sm" | "md" | "lg";
+export type IconButtonShape = "circle" | "square";
+export interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "type"> {
+    /** The icon glyph name (from the `Icon` set). */
+    icon: IconName;
+    /** Required accessible name — there is no visible text. Becomes `aria-label` + `title`. */
+    label: string;
+    variant?: IconButtonVariant;
+    size?: IconButtonSize;
+    /** Mercury icon buttons are fully round by default. */
+    shape?: IconButtonShape;
+    type?: "button" | "submit" | "reset";
+}
+/**
+ * IconButton — a square/round button carrying only an icon. It reuses the Button token
+ * surface (`.mx-btn--<variant>`) for fill/ink and adds the `.mx-icon-btn` square-box
+ * geometry; `shape="circle"` is `--radius-full`. The required `label` becomes the
+ * `aria-label` (icon-only controls need an accessible name).
+ */
+export declare const IconButton: import("react").ForwardRefExoticComponent<IconButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export default IconButton;

package/dist/components/actions/IconButton/index.d.ts

@@ -0,0 +1 @@
+export * from "./IconButton";

package/dist/components/actions/Link/Link.d.ts

@@ -0,0 +1,26 @@
+import type { MouseEvent, ReactNode } from "react";
+export type LinkSize = "sm" | "md";
+/**
+ * Link — the inline text affordance used across forms and flows:
+ * "Forgot password?", "Create an account", "Back to sign in", "Resend code".
+ * Renders an <a> when `href` is set, otherwise a <button> — so the same brand
+ * affordance covers both navigation and in-app actions. Presentational; the
+ * caller owns the navigation or click.
+ */
+export interface LinkProps {
+    href?: string;
+    onClick?: (e: MouseEvent) => void;
+    disabled?: boolean;
+    size?: LinkSize;
+    /** Muted (tertiary) colour instead of the brand colour. */
+    muted?: boolean;
+    leading?: ReactNode;
+    trailing?: ReactNode;
+    type?: "button" | "submit" | "reset";
+    target?: string;
+    rel?: string;
+    className?: string;
+    children?: ReactNode;
+    "aria-label"?: string;
+}
+export declare function Link({ href, onClick, disabled, size, muted, leading, trailing, type, target, rel, className, children, "aria-label": ariaLabel, }: LinkProps): import("react").JSX.Element;

package/dist/components/actions/Link/index.d.ts

@@ -0,0 +1 @@
+export * from "./Link";

package/dist/components/data-display/Avatar/Avatar.d.ts

@@ -0,0 +1,8 @@
+export type AvatarStatus = "positive" | "caution" | "negative" | "info";
+export interface AvatarProps {
+    name?: string;
+    src?: string;
+    size?: number;
+    status?: AvatarStatus;
+}
+export declare function Avatar({ name, src, size, status }: AvatarProps): import("react").JSX.Element;

package/dist/components/data-display/Avatar/index.d.ts

@@ -0,0 +1 @@
+export * from "./Avatar";

package/dist/components/data-display/Badge/Badge.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+export type BadgeVariant = "brand" | "negative" | "positive" | "caution" | "info";
+export interface BadgeProps {
+    children: ReactNode;
+    variant?: BadgeVariant;
+    size?: "sm" | "md" | "lg";
+}
+export declare function Badge({ children, variant, size }: BadgeProps): import("react").JSX.Element;

package/dist/components/data-display/Badge/index.d.ts

@@ -0,0 +1 @@
+export * from "./Badge";

package/dist/components/data-display/Blockquote/Blockquote.d.ts

@@ -0,0 +1,18 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type BlockquoteSize = "sm" | "md" | "lg";
+export interface BlockquoteProps extends Omit<HTMLAttributes<HTMLQuoteElement>, "cite"> {
+    children?: ReactNode;
+    size?: BlockquoteSize;
+    /** Colour of the leading rule + attribution ink, from an accent ramp (rule `--<ramp>-9`, ink `--<ramp>-11`). */
+    accent?: "iris" | "indigo" | "green" | "orange" | "plum" | "red";
+    /** Attribution line, rendered below in DM Mono. */
+    cite?: ReactNode;
+}
+/**
+ * Blockquote — a quotation set off by a leading rule, in secondary ink with an
+ * optional attribution line (DM Mono). The rule is `--border-strong` by default;
+ * an `accent` recolours the rule (`--<ramp>-9`) and the attribution (`--<ramp>-11`).
+ * Styled through `.mx-blockquote` token classes — no inline ink.
+ */
+export declare function Blockquote({ children, size, accent, cite, className, ...rest }: BlockquoteProps): import("react").JSX.Element;
+export default Blockquote;

package/dist/components/data-display/Blockquote/index.d.ts

@@ -0,0 +1 @@
+export * from "./Blockquote";

package/dist/components/data-display/Card/Card.d.ts

@@ -0,0 +1,9 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    variant?: "flat" | "raised" | "floating";
+    padding?: number | string;
+    title?: ReactNode;
+    actions?: ReactNode;
+    children?: ReactNode;
+}
+export declare function Card({ variant, padding, title, actions, className, style, children, ...rest }: CardProps): import("react").JSX.Element;

package/dist/components/data-display/Card/index.d.ts

@@ -0,0 +1 @@
+export * from "./Card";

package/dist/components/data-display/Chart/Chart.d.ts

@@ -0,0 +1,41 @@
+export interface ChartSeries {
+    /** Precomputed line path ("M.. L.."). */
+    d: string;
+    /** Optional precomputed, closed area path (filled with the gradient). */
+    area?: string;
+    /** A token color expression, e.g. "rgb(var(--iris-9))". */
+    stroke: string;
+    /** Gradient id to fill the area with. */
+    fillId?: string;
+    width?: number;
+    dashed?: boolean;
+}
+export interface ChartMarker {
+    /** y in viewBox units — a full-width threshold line (e.g. a zero/loss boundary). */
+    y: number;
+    dashed?: boolean;
+}
+export interface ChartProps {
+    /** e.g. "0 0 1000 300". */
+    viewBox: string;
+    series: ChartSeries[];
+    /** Horizontal grid-line y positions (viewBox units). */
+    gridY?: number[];
+    /** Vertical grid-line x positions (viewBox units). */
+    gridX?: number[];
+    /** Labels down the left rail (top → bottom). */
+    yTicks?: string[];
+    /** Labels along the bottom rail (left → right). */
+    xTicks?: string[];
+    /** Linear gradients (top → transparent) referenced by series.fillId. */
+    gradients?: {
+        id: string;
+        stroke: string;
+    }[];
+    /** Full-width threshold markers (e.g. the zero line). */
+    markers?: ChartMarker[];
+    /** CSS height of the chart box. */
+    height?: number | string;
+    ariaLabel?: string;
+}
+export declare function Chart({ viewBox, series, gridY, gridX, yTicks, xTicks, gradients, markers, height, ariaLabel, }: ChartProps): import("react").JSX.Element;

package/dist/components/data-display/Chart/index.d.ts

@@ -0,0 +1 @@
+export * from "./Chart";

package/dist/components/data-display/Checklist/Checklist.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from "react";
+/**
+ * Checklist — a list of requirements with met / unmet markers. Used for
+ * password rules, onboarding steps, or any "criteria satisfied" UI.
+ */
+export interface ChecklistItem {
+    label: ReactNode;
+    met: boolean;
+}
+export interface ChecklistProps {
+    items: ChecklistItem[];
+    className?: string;
+}
+export declare function Checklist({ items, className }: ChecklistProps): import("react").JSX.Element;

package/dist/components/data-display/Checklist/index.d.ts

@@ -0,0 +1 @@
+export * from "./Checklist";

package/dist/components/data-display/Chip/Chip.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from "react";
+export type ChipVariant = "neutral" | "brand" | "positive" | "negative" | "caution" | "info" | "discovery";
+export interface ChipProps {
+    children: ReactNode;
+    variant?: ChipVariant;
+    size?: "sm" | "md" | "lg";
+    selected?: boolean;
+    leading?: ReactNode;
+    onRemove?: () => void;
+    onClick?: () => void;
+    className?: string;
+}
+export declare function Chip({ children, variant, size, selected, leading, onRemove, onClick, className }: ChipProps): import("react").JSX.Element;

package/dist/components/data-display/Chip/index.d.ts

@@ -0,0 +1 @@
+export * from "./Chip";

package/dist/components/data-display/Code/Code.d.ts

@@ -0,0 +1,22 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type CodeVariant = "soft" | "solid" | "outline" | "ghost";
+export type CodeSize = "sm" | "md" | "lg";
+export interface CodeProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    /** Surface treatment. Default `soft`. */
+    variant?: CodeVariant;
+    /** Type size + inline padding. Default `md`. */
+    size?: CodeSize;
+    /** Accent ramp — tints soft/outline/ghost and recolours solid (`--<ramp>-9` / `--<ramp>-11`). */
+    accent?: "iris" | "indigo" | "green" | "orange" | "plum" | "red";
+    /** Render as a multi-line block (`<pre>`) instead of inline (`<code>`). Default `false`. */
+    block?: boolean;
+}
+/**
+ * Code — inline (or block) monospace code in DM Mono on a tinted surface. Inline
+ * renders `<code>`; `block` renders a scrollable `<pre>`. `variant` picks the
+ * surface (soft/solid/outline/ghost); `accent` re-skins it from a ramp. Styled
+ * through `.mx-code` token classes — no inline ink.
+ */
+export declare function Code({ children, variant, size, accent, block, className, ...rest }: CodeProps): import("react").JSX.Element;
+export default Code;

package/dist/components/data-display/Code/index.d.ts

@@ -0,0 +1 @@
+export * from "./Code";

package/dist/components/data-display/DataList/DataList.d.ts

@@ -0,0 +1,27 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type DataListOrientation = "horizontal" | "vertical";
+export type DataListSize = "sm" | "md" | "lg";
+export interface DataListEntry {
+    /** The term — rendered in the `<dt>`. */
+    label: ReactNode;
+    /** The description — rendered in the `<dd>`. */
+    value: ReactNode;
+}
+export interface DataListProps extends Omit<HTMLAttributes<HTMLDListElement>, "children"> {
+    /** The term/description pairs. */
+    items: DataListEntry[];
+    /** Lay each pair side-by-side (`horizontal`) or stacked (`vertical`). Default `horizontal`. */
+    orientation?: DataListOrientation;
+    /** Type size + row gap. Default `md`. */
+    size?: DataListSize;
+    /** Label-column width in the horizontal layout (number → px). Default `140`. */
+    labelWidth?: number;
+}
+/**
+ * DataList — key/value pairs as a semantic `<dl>`: account fields, transaction
+ * metadata, settings summaries. `horizontal` lays each term beside its value in a
+ * fixed `labelWidth` column; `vertical` stacks them. Styled through `.mx-datalist`
+ * token classes — no inline ink.
+ */
+export declare function DataList({ items, orientation, size, labelWidth, className, ...rest }: DataListProps): import("react").JSX.Element;
+export default DataList;

package/dist/components/data-display/DataList/index.d.ts

@@ -0,0 +1 @@
+export * from "./DataList";

package/dist/components/data-display/Kbd/Kbd.d.ts

@@ -0,0 +1,14 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type KbdSize = "sm" | "md" | "lg";
+export interface KbdProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    /** Cap size. Default `md`. */
+    size?: KbdSize;
+}
+/**
+ * Kbd — a keyboard keycap in DM Mono on a raised surface with a subtle bottom
+ * edge. Reach for it to mark a key a user presses (`⌘`, `Esc`, `K`); compose
+ * several for a shortcut. Styled through `.mx-kbd` token classes — no inline ink.
+ */
+export declare function Kbd({ children, size, className, ...rest }: KbdProps): import("react").JSX.Element;
+export default Kbd;

package/dist/components/data-display/Kbd/index.d.ts

@@ -0,0 +1 @@
+export * from "./Kbd";

package/dist/components/data-display/ListRow/ListRow.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes, MouseEventHandler, ReactNode } from "react";
+export interface ListRowProps extends Omit<HTMLAttributes<HTMLElement>, "onClick"> {
+    /** The primary text (required). */
+    label: ReactNode;
+    /** A leading glyph/avatar slot — drive with a real <Icon /> / <Avatar />. */
+    leading?: ReactNode;
+    /** Secondary text below `label` (the "meta"/subtitle). */
+    description?: ReactNode;
+    /** Trailing value text, right-aligned — e.g. a settings value or an amount. */
+    value?: ReactNode;
+    /** A trailing affordance after `value` (a chevron / action). */
+    trailing?: ReactNode;
+    /** When present, the row is interactive (rendered as a <button>); else a non-interactive <div>. */
+    onClick?: MouseEventHandler<HTMLElement>;
+}
+export declare function ListRow({ label, leading, description, value, trailing, onClick, className, ...rest }: ListRowProps): import("react").JSX.Element;

package/dist/components/data-display/ListRow/index.d.ts

@@ -0,0 +1 @@
+export * from "./ListRow";

package/dist/components/data-display/Stat/Stat.d.ts

@@ -0,0 +1,16 @@
+import type { ReactNode } from "react";
+export type StatTone = "neutral" | "positive" | "negative" | "caution" | "brand" | "info";
+export interface StatProps {
+    label: string;
+    /** Formatted by the caller (renders in DM Mono via .mx-stat__value). */
+    value: ReactNode;
+    /** Optional delta chip, e.g. "+30.3%". */
+    delta?: ReactNode;
+    deltaTone?: StatTone;
+    /** Sub-caption under the value. */
+    hint?: ReactNode;
+    /** Optional leading icon. */
+    leading?: ReactNode;
+    align?: "left" | "center";
+}
+export declare function Stat({ label, value, delta, deltaTone, hint, leading, align }: StatProps): import("react").JSX.Element;

package/dist/components/data-display/Stat/index.d.ts

@@ -0,0 +1 @@
+export * from "./Stat";

package/dist/components/data-display/Table/Table.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from "react";
+export interface Column<Row> {
+    key: string;
+    label: ReactNode;
+    align?: "left" | "right";
+    render?: (row: Row) => ReactNode;
+}
+export interface TableProps<Row> {
+    columns: Column<Row>[];
+    data: Row[];
+    striped?: boolean;
+    getRowKey?: (row: Row, index: number) => string | number;
+}
+export declare function Table<Row extends Record<string, unknown>>({ columns, data, striped, getRowKey }: TableProps<Row>): import("react").JSX.Element;

package/dist/components/data-display/Table/index.d.ts

@@ -0,0 +1 @@
+export * from "./Table";

package/dist/components/data-display/Tag/Tag.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from "react";
+import type { ChipVariant } from "../Chip/index.js";
+export interface TagProps {
+    children: ReactNode;
+    tone?: ChipVariant;
+    dot?: boolean;
+    size?: "sm" | "md" | "lg";
+}
+export declare function Tag({ children, tone, dot, size }: TagProps): import("react").JSX.Element;

package/dist/components/data-display/Tag/index.d.ts

@@ -0,0 +1 @@
+export * from "./Tag";

package/dist/components/feedback/Alert/Alert.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from "react";
+export type AlertTone = "info" | "success" | "warning" | "danger";
+export interface AlertProps {
+    tone?: AlertTone;
+    title?: ReactNode;
+    children?: ReactNode;
+    dismissible?: boolean;
+    onDismiss?: () => void;
+    actions?: ReactNode;
+}
+export declare function Alert({ tone, title, children, dismissible, onDismiss, actions }: AlertProps): import("react").JSX.Element;

package/dist/components/feedback/Alert/index.d.ts

@@ -0,0 +1 @@
+export * from "./Alert";

package/dist/components/feedback/Callout/Callout.d.ts

@@ -0,0 +1,26 @@
+import type { HTMLAttributes, ReactNode } from "react";
+import type { IconName } from "../../foundations/Icon";
+export type CalloutIntent = "info" | "brand" | "positive" | "caution" | "negative" | "discovery";
+export type CalloutVariant = "soft" | "surface" | "outline";
+export type CalloutSize = "sm" | "md" | "lg";
+export interface CalloutProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Optional bold lead line above the body. */
+    title?: ReactNode;
+    /** Tone family — resolves to the semantic token families (canon §6). Default `info`. */
+    intent?: CalloutIntent;
+    /** Fill/border treatment. Default `soft`. */
+    variant?: CalloutVariant;
+    size?: CalloutSize;
+    /** Override the default intent glyph; pass `null` to hide the icon. */
+    icon?: IconName | null;
+    children?: ReactNode;
+}
+/**
+ * Callout — an inline emphasis block: a note set into the reading flow on a tinted,
+ * surface, or outlined card. Distinct from Alert (a status message, the result of an
+ * action) — Callout is editorial emphasis. `intent` selects the semantic token family;
+ * `variant` selects the fill/border treatment. Styled through `.mx-callout` token
+ * classes — no inline ink.
+ */
+export declare function Callout({ title, intent, variant, size, icon, className, children, ...rest }: CalloutProps): import("react").JSX.Element;
+export default Callout;

package/dist/components/feedback/Callout/index.d.ts

@@ -0,0 +1 @@
+export * from "./Callout";

package/dist/components/feedback/PasswordStrength/PasswordStrength.d.ts

@@ -0,0 +1,13 @@
+/**
+ * PasswordStrength — a labelled strength meter for a password field.
+ * Presentational: pass a `score` (0–100), `label` and `variant` — the
+ * `passwordStrength()` helper in @mercury-fx/effector computes all three.
+ */
+export type StrengthVariant = "negative" | "caution" | "positive";
+export interface PasswordStrengthProps {
+    score: number;
+    label?: string;
+    variant?: StrengthVariant;
+    className?: string;
+}
+export declare function PasswordStrength({ score, label, variant, className }: PasswordStrengthProps): import("react").JSX.Element;

package/dist/components/feedback/PasswordStrength/index.d.ts

@@ -0,0 +1 @@
+export * from "./PasswordStrength";

package/dist/components/feedback/Progress/Progress.d.ts

@@ -0,0 +1,9 @@
+export type ProgressVariant = "brand" | "positive" | "negative" | "caution" | "info";
+export interface ProgressProps {
+    value?: number;
+    max?: number;
+    variant?: ProgressVariant;
+    size?: "sm" | "md" | "lg";
+    indeterminate?: boolean;
+}
+export declare function Progress({ value, max, variant, size, indeterminate }: ProgressProps): import("react").JSX.Element;

package/dist/components/feedback/Progress/index.d.ts

@@ -0,0 +1 @@
+export * from "./Progress";

package/dist/components/feedback/Skeleton/Skeleton.d.ts

@@ -0,0 +1,19 @@
+import type { HTMLAttributes } from "react";
+export interface SkeletonProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"> {
+    /** CSS width — number (px) or any length string. Default `100%`. */
+    width?: number | string;
+    /** CSS height — number (px) or string. Ignored when `circle`. Default `16`. */
+    height?: number | string;
+    /** Corner radius in px (ignored when `circle`). Default `6`. */
+    radius?: number;
+    /** Render a circle of diameter `width` (for avatars). */
+    circle?: boolean;
+}
+/**
+ * Skeleton — a pulsing placeholder that holds layout while content loads. The
+ * dimensions (`width`/`height`/`radius`/`circle`) are non-color inline styles; the
+ * surface (`--bg-tertiary`) and the 1.5s pulse live in `.mx-skeleton`. Decorative
+ * (`aria-hidden`) — announce the load with a sibling `Spinner`/live region.
+ */
+export declare function Skeleton({ width, height, radius, circle, className, style, ...rest }: SkeletonProps): import("react").JSX.Element;
+export default Skeleton;

package/dist/components/feedback/Skeleton/index.d.ts

@@ -0,0 +1 @@
+export * from "./Skeleton";

package/dist/components/feedback/Spinner/Spinner.d.ts

@@ -0,0 +1,18 @@
+import type { HTMLAttributes } from "react";
+export type SpinnerSize = "sm" | "md" | "lg";
+export interface SpinnerProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"> {
+    /** Named size or an explicit pixel diameter. Default `md`. */
+    size?: SpinnerSize | number;
+    /** Accent ramp for the moving arc (reads `--<ramp>-9`). Omit to inherit `currentColor` (e.g. inside a button). */
+    accent?: "iris" | "indigo" | "green" | "orange" | "plum" | "red";
+    /** Accessible label announced to screen readers. Default `Loading`. */
+    label?: string;
+}
+/**
+ * Spinner — an indeterminate loading indicator: a token-coloured ring on a 360°/1s
+ * spin. With no `accent` the arc inherits `currentColor` (so it reads correctly inside
+ * a button); an `accent` paints the arc from a ramp. Carries `role="status"` + the
+ * `label` as its accessible name. Honours `prefers-reduced-motion`.
+ */
+export declare function Spinner({ size, accent, label, className, style, ...rest }: SpinnerProps): import("react").JSX.Element;
+export default Spinner;

package/dist/components/feedback/Spinner/index.d.ts

@@ -0,0 +1 @@
+export * from "./Spinner";

package/dist/components/foundations/Divider/Divider.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from "react";
+/**
+ * Divider — a separator rule. With a `label` it becomes the "— or —" splitter
+ * used between a primary and an alternate action (e.g. email vs. SSO sign-in).
+ */
+export interface DividerProps {
+    label?: ReactNode;
+    orientation?: "horizontal" | "vertical";
+    className?: string;
+}
+export declare function Divider({ label, orientation, className }: DividerProps): import("react").JSX.Element;

package/dist/components/foundations/Divider/index.d.ts

@@ -0,0 +1 @@
+export * from "./Divider";

package/dist/components/foundations/Heading/Heading.d.ts

@@ -0,0 +1,26 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type HeadingSize = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
+export type HeadingWeight = "regular" | "medium" | "semibold" | "bold";
+export type HeadingAlign = "left" | "center" | "right";
+export type HeadingTag = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div";
+export interface HeadingProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    /** 1 (smallest) → 9 (display). Default 6. Maps onto the canon 18..72 type scale. */
+    size?: HeadingSize;
+    /** Type weight. Default `bold` (the canon heading weight). */
+    weight?: HeadingWeight;
+    align?: HeadingAlign;
+    /** Render tag. Defaults to a sensible h-level derived from `size`. */
+    as?: HeadingTag;
+    /** Ink from an accent ramp (reads `--<ramp>-11`). Overrides the default ink. */
+    accent?: "iris" | "indigo" | "green" | "orange" | "plum" | "red";
+    truncate?: boolean;
+}
+/**
+ * Heading — section titles across the Mercury type scale. The display sizes (5–9)
+ * ride DM Mono (`--font-secondary`), Mercury's technical display face; the small
+ * sizes (1–4) use DM Sans (`--font-primary`). Styled entirely through `.mx-heading`
+ * token classes — no inline ink.
+ */
+export declare function Heading({ size, weight, align, as, accent, truncate, className, children, ...rest }: HeadingProps): import("react").JSX.Element;
+export default Heading;

package/dist/components/foundations/Heading/index.d.ts

@@ -0,0 +1 @@
+export * from "./Heading";

package/dist/components/foundations/Icon/Icon.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode, SVGProps } from "react";
+declare const ICONS: Record<string, ReactNode>;
+export type IconName = keyof typeof ICONS;
+export interface IconProps extends Omit<SVGProps<SVGSVGElement>, "name"> {
+    name: IconName;
+    size?: number;
+}
+export declare function Icon({ name, size, strokeWidth, ...rest }: IconProps): import("react").JSX.Element;
+export {};