/**
 * The `DesignSystem` contract.
 *
 * This is the **swap seam**: a DApp can implement this interface with its own
 * values and pass it to `createCrossxConfig({ designSystem })` instead of using
 * `defaultDesignSystem`. The interface is structural, so a conforming object
 * works even without importing these types.
 *
 * Names mirror the CROSSx Figma design system (Embeded v1.0.0):
 *   - color  : `2032-6584` (embeded-color)
 *   - type   : `2019-2351`
 *   - layout : `2060-1755` (responsive-padding)
 *
 * No env types leak through — every value is a plain CSS string or number.
 */
/**
 * A semantic color ramp shared by `accent.*` and every `system.*` color.
 * `on` / `onInverted` are the readable foreground placed on top of the color.
 */
interface ColorRamp {
    /** Foreground on top of `default` (e.g. text on a filled button). */
    on: string;
    /** The base color. */
    default: string;
    /** Stronger / hover variant. */
    high: string;
    /**
     * Tinted surface one step stronger than `low` — for a filled chip/badge that
     * must read against a `low`-tinted parent. Optional: the design system only
     * defines it on the ramps that need it (`system.orange`, `system.green`),
     * so `buildColorVars` simply omits `--ds-<ramp>-medium` where it's absent.
     */
    medium?: string;
    /** Tinted surface (subtle filled background). */
    low: string;
    /** Faintest tinted surface. */
    lowest: string;
    /** Foreground for the inverted (dark-on-light / light-on-dark) context. */
    onInverted: string;
}
/**
 * A full set of color roles for one theme mode. The `light` and `dark`
 * `ColorScale`s are parallel structures — same keys, mode-specific values.
 */
interface ColorScale {
    /** Page / app root background. */
    bg: {
        default: string;
        dim: string;
    };
    /** Raised surfaces (cards, sheets, hover fills). */
    surface: {
        default: string;
        medium: string;
        high: string;
        dim: string;
        inverted: string;
    };
    /** Text & icon colors. Note: no `default` step — `highest` is the strongest. */
    content: {
        highest: string;
        high: string;
        medium: string;
        low: string;
        lowest: string;
        inverted: string;
    };
    /** Borders / dividers. Note: steps are `default`/`medium`/`high` (no `low`). */
    border: {
        default: string;
        medium: string;
        high: string;
    };
    /** Brand accent. */
    accent: {
        primary: ColorRamp;
    };
    /** Semantic status colors. */
    system: {
        red: ColorRamp;
        blue: ColorRamp;
        orange: ColorRamp;
        purple: ColorRamp;
        green: ColorRamp;
    };
    /** Scrim behind modals / drawers. */
    overlay: {
        dim: string;
        subtle: string;
    };
    /** Mode-independent absolutes. */
    static: {
        white: string;
        black: string;
    };
}
/**
 * One text style. `fontSize` is px, `lineHeight` is a unitless multiplier,
 * `letterSpacing` is a percentage (Figma convention; `-1` → `-0.01em`).
 */
interface TypeStyle {
    fontFamily: string;
    fontSize: number;
    fontWeight: number;
    lineHeight: number;
    letterSpacing: number;
}
type TextSize = '2xs' | 'xs' | 'sm' | 'base' | 'lg' | 'xl';
/** `text-semibold` has no `2xs`. */
type TextSemiboldSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl';
type LabelSize = 'xs' | 'sm' | 'md' | 'lg';
type LabelSemiboldSize = 'sm' | 'md' | 'lg';
type HeadingSize = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'h7';
type DisplaySize = 'sm' | 'md' | 'lg';
interface DesignSystemTypography {
    text: Record<TextSize, TypeStyle>;
    textMedium: Record<TextSize, TypeStyle>;
    textSemibold: Record<TextSemiboldSize, TypeStyle>;
    label: Record<LabelSize, TypeStyle>;
    labelSemibold: Record<LabelSemiboldSize, TypeStyle>;
    heading: Record<HeadingSize, TypeStyle>;
    display: Record<DisplaySize, TypeStyle>;
}
/**
 * Layout scales. Values are px.
 *
 * `responsivePadding` is the container side-padding per breakpoint bucket
 * (`sm`/`md`/`lg`). Breakpoint wiring (which bucket applies when) is a
 * consumer concern — the tokens only define the values.
 */
interface DesignSystemLayout {
    responsivePadding: {
        sm: number;
        md: number;
        lg: number;
    };
}
/**
 * Shadow / blur effects. Values are ready-to-use CSS:
 * `shadowModal.*` are `box-shadow` values, `bgBlur7` is a `filter`/
 * `backdrop-filter` value.
 */
interface DesignSystemEffects {
    /** Modal / popover drop shadow, per theme mode. */
    shadowModal: {
        light: string;
        dark: string;
    };
    /** Background blur (Figma `BG_blur7`, 7px radius). */
    bgBlur7: string;
    /**
     * Brand CTA gradient (pink → orange). Used as the `background` of primary
     * confirm buttons across features. Mode-independent — the gradient reads on
     * both light and dark surfaces.
     */
    accentGradient: string;
}
interface DesignSystem {
    /** Identifier (e.g. `'crossx'`). Surfaced for debugging / theme switching. */
    name: string;
    colors: {
        light: ColorScale;
        dark: ColorScale;
    };
    typography: DesignSystemTypography;
    layout: DesignSystemLayout;
    effects: DesignSystemEffects;
}
type ThemeMode = 'light' | 'dark';

/**
 * Default color palette — transcribed verbatim from the Figma
 * `Embeded 디자인시스템 v1.0.0` color table (file `Bta3fMnTynXtOtyZqI05fu`,
 * node `2151-1073`), light + dark modes.
 *
 * Black/white alpha steps (content, border, overlay) are emitted as hex with an
 * alpha byte.
 *
 * ⚠️ `accent.primary` is the **orange** brand ramp. It used to be the same teal
 * as `system.green`, which forced every brand surface to bind to
 * `--ds-system-orange-*` as a workaround. v1.0.0 fixes that at the token level:
 *   - `accent.primary` — brand orange (`#FF8438` / `#F0640D`)
 *   - `system.orange`  — a distinct warning amber (`#FC8B01` / `#E56F00`)
 *   - `system.green`   — keeps the teal ramp, now used only for success/positive
 * The two orange ramps are close but NOT interchangeable: accent is redder,
 * system/orange is yellower. Pick by meaning (brand vs warning), not by eye.
 */

declare const lightColors: ColorScale;
declare const darkColors: ColorScale;

/**
 * Default typography scale — transcribed from CROSSx Figma type styles
 * (node `2019-2351`). All Inter. `letterSpacing` is a percentage:
 * the `text*` families use -1 (-0.01em); label / heading / display use 0.
 */

declare const typography: DesignSystemTypography;

/**
 * Default layout tokens — transcribed from CROSSx Figma `layout`
 * (node `2060-1755`, `responsive-padding`). Values are px.
 */

declare const layout: DesignSystemLayout;

/**
 * Default effect tokens — transcribed from CROSSx Figma `Effects` collection.
 *
 * - `shadow-modal-light`: drop shadow, color #0000 @ 15%, offset (0,4), blur 30, spread -1
 * - `shadow-modal-dark` : drop shadow, color #0000 @ 70%, offset (0,4), blur 30, spread -1
 * - `BG_blur7`          : background blur, Figma radius 7 → CSS blur(3.5px)
 *                         (Figma's background-blur radius ≈ 2× the CSS blur,
 *                         per Dev Mode codegen)
 */

declare const effects: DesignSystemEffects;

/**
 * The default CROSSx design system — assembled from the Figma-transcribed
 * color, typography and layout tokens. Passed to `createCrossxConfig` when a
 * DApp does not supply its own `designSystem`.
 */

declare const defaultDesignSystem: DesignSystem;

/**
 * Turn a {@link DesignSystem} into CSS.
 *
 * - **Colors** flatten deterministically to `--ds-*` custom properties under
 *   per-mode selectors (dark is the `:root` default; light is overlaid via
 *   `[data-ds-theme="light"]`).
 * - **Layout** tokens emit as mode-independent `--ds-*` properties.
 * - **Typography** emits as utility classes (`.ds-text-medium-sm` …) carrying
 *   the full font shorthand — applied via `className`, not CSS variables.
 *
 * The walk is generic, so any conforming `DesignSystem` (incl. a DApp's own)
 * produces predictable names.
 */

/** `--ds-*` declarations for one mode's color scale (no selector wrapper). */
declare function buildColorVars(scale: ColorScale): string;
/** `--ds-*` declarations for layout tokens (px). */
declare function buildLayoutVars(layout: DesignSystemLayout): string;
/** `.ds-<group>-<size>` utility classes for every type style. */
declare function buildTypographyClasses(typography: DesignSystemTypography): string;
interface BuildCssOptions {
    /** Selector that receives the default (dark) palette. Defaults to `:root`. */
    scope?: string;
}
/**
 * Full stylesheet: color vars (both modes) + layout vars + typography classes.
 * Attach the returned string to a `<style>` once; flip palettes by setting
 * `data-ds-theme="light" | "dark"` on any ancestor.
 */
declare function buildDesignSystemCss(ds: DesignSystem, opts?: BuildCssOptions): string;

/**
 * Project a {@link DesignSystem} down to the 12-key color contract that
 * crossy-sdk's embedded modal requires (`SDKColorOverrides`).
 *
 * This is **not** the rejected `--cck-*` alias table — it is the unavoidable
 * adapter for handing colors to a third-party SDK whose theming API is fixed.
 * `@nexus-cross/connect-kit-wagmi` calls this at connector-creation time.
 *
 * The local shape is kept structural so this package does not harden on
 * crossy-sdk internals.
 */

interface SdkColorOverrides {
    primary?: string;
    secondary?: string;
    onPrimary?: string;
    borderDefault?: string;
    borderSubtle?: string;
    textIconPrimary?: string;
    textIconSecondary?: string;
    textIconTertiary?: string;
    surfaceDefault?: string;
    surfaceSubtle?: string;
    bg?: string;
    error?: string;
}
declare function toSdkColorOverrides(ds: DesignSystem, mode: ThemeMode): SdkColorOverrides;

/**
 * Brand tokens — single source of truth for the user-facing wallet & chain
 * display names surfaced through the connect-kit SDK.
 *
 * Phase 1 (display strings only): change the values here to rebrand every
 * presentable-layer label across dapp-ui / wagmi / react in one place.
 *
 * NOTE: this covers DISPLAY occurrences only. The on-chain ticker / external
 * API code `"CROSS"` (AlchemyPay onramp mappings, token-list / pool symbol
 * comparisons) is a functional identifier — NOT a display token — and is
 * intentionally left untouched here. Renaming those requires external
 * coordination and belongs to a separate effort.
 */
/** Primary wallet brand name shown to end users. */
declare const WALLET_BRAND_NAME = "ONEpocket";
/**
 * Composed wallet labels used across connect modals, buttons and connectors.
 *
 * The former '+' suffix is retired: both 'ONEwallet' and 'ONEwallet+' now
 * present as the single 'ONEpocket' brand.
 */
declare const WALLET_LABELS: {
    /** Bare brand name / title (was 'ONEwallet' / 'CROSSx'). */
    readonly default: "ONEpocket";
    /** Embedded / social-login wallet (was 'ONEwallet with Social'). */
    readonly social: "ONEpocket with Social";
    /** Native app wallet (was 'ONEwallet+' / 'CROSSx App'). */
    readonly app: "ONEpocket";
    /** Browser extension (was 'ONEwallet+ Extension' / 'CROSSx Extension'). */
    readonly extension: "ONEpocket Extension";
};
/**
 * Chain display names — hardcoded FALLBACK. The rebranded 'One Mainnet' /
 * 'One Testnet' now comes from the S3 remote-config (chains.json), so the
 * built-in default stays on the previous 'CROSS' notation. If S3 is absent
 * the UI shows these CROSS names.
 */
declare const CHAIN_DISPLAY: {
    readonly mainnet: "CROSS Mainnet";
    readonly testnet: "ONEchain Testnet";
};
/**
 * Native currency display symbol — hardcoded FALLBACK. Rebranded 'ONE' / 'tONE'
 * is served via S3 remote-config; the default keeps the previous 'CROSS' /
 * 'tCROSS' notation (also matches the on-chain ticker). DISPLAY metadata only —
 * do not reuse for on-chain / external-API matching.
 */
declare const NATIVE_SYMBOL: {
    readonly mainnet: "CROSS";
    readonly testnet: "tONE";
};

/**
 * `@nexus-cross/crossx-design-system`
 *
 * The CROSSx design system: a swappable `DesignSystem` contract, the default
 * Figma-derived token set, and helpers to emit CSS / project to crossy-sdk.
 */

/** Convenience: the default design system's full stylesheet. */
declare function getDefaultDesignSystemCss(): string;

export { type BuildCssOptions, CHAIN_DISPLAY, type ColorRamp, type ColorScale, type DesignSystem, type DesignSystemEffects, type DesignSystemLayout, type DesignSystemTypography, type DisplaySize, type HeadingSize, type LabelSemiboldSize, type LabelSize, NATIVE_SYMBOL, type SdkColorOverrides, type TextSemiboldSize, type TextSize, type ThemeMode, type TypeStyle, WALLET_BRAND_NAME, WALLET_LABELS, buildColorVars, buildDesignSystemCss, buildLayoutVars, buildTypographyClasses, darkColors, defaultDesignSystem, effects, getDefaultDesignSystemCss, layout, lightColors, toSdkColorOverrides, typography };