import { default as default_2 } from 'react';
import { JSX } from 'react/jsx-runtime';

declare type AnchorPosition = 'left' | 'right' | 'top' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight';

declare type AnchorPosition_2 = 'left' | 'right' | 'top' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight';

export declare interface ArcConnector {
    from: string;
    to: string;
    fromAnchor: AnchorPosition;
    toAnchor: AnchorPosition;
    style: string;
    curve?: 'natural' | 'step';
}

export declare interface ArcConnectorStyle {
    color: DiagramColor;
    strokeWidth: number;
    label?: string;
    labelAlign?: LabelAlign;
    dashed?: boolean;
}

export declare function ArcDiagram({ data, className, interactive, mode, theme, label, labelPosition, defaultZoom, zoomLevels, showArcToggle, showAutoLayout, showControls, showMinimap, showLegend, showFocusStory, frame, hoverEffects, onNodeHover, titleBlock, maxFitZoom, defaultViewMode, defaultIsoStyle, }: ArcDiagramProps): JSX.Element;

declare interface ArcDiagram_2 {
    layout: DiagramLayout_2;
    grid: GridConfig;
    layoutHints?: LayoutHints_2;
    nodes: Record<string, NodePosition_2>;
    nodeData: Record<string, NodeData>;
    connectors: Connector[];
    connectorStyles: Record<string, ConnectorStyle_2>;
    groups?: GroupShape_2[];
    focusTargets?: Record<string, FocusTarget_2>;
    images?: DiagramImage[];
    exportZone?: ExportZone | null;
}

export declare interface ArcDiagramData {
    id?: string;
    layout: DiagramLayout;
    layoutHints?: LayoutHints;
    nodes: Record<string, ArcNodePosition>;
    nodeData: Record<string, ArcNodeData>;
    connectors: ArcConnector[];
    connectorStyles: Record<string, ArcConnectorStyle>;
    focusTargets?: Record<string, FocusTarget>;
    groups?: GroupShape[];
}

declare interface ArcDiagramData_2 {
    id?: string;
    layout: DiagramLayout_2;
    layoutHints?: LayoutHints_2;
    nodes: Record<string, NodePosition_2>;
    nodeData: Record<string, NodeData>;
    connectors: Connector[];
    connectorStyles: Record<string, ConnectorStyle_2>;
    focusTargets?: Record<string, FocusTarget_2>;
    groups?: GroupShape_2[];
}

export declare function ArcDiagramIsometric({ config, options, className, style, onNodeClick, onLayerClick }: ArcDiagramProps_2): JSX.Element;

declare interface ArcDiagramProps {
    data: ArcDiagramData;
    className?: string;
    interactive?: boolean;
    mode?: DiagramMode;
    theme?: ThemeId;
    /** Override the diagram label. Defaults to data.id */
    label?: string;
    /** Which corner the label sits in. Default: 'top-left'. Zoom controls auto-avoid it. */
    labelPosition?: LabelCorner;
    /** Initial zoom level. Use 'fit' to auto-fit content, or a number (e.g., 0.75). Default: 1 */
    defaultZoom?: number | 'fit';
    /** Max zoom when defaultZoom='fit'. E.g., 0.85 caps fit at 85%. Default: 1 */
    maxFitZoom?: number;
    /** Custom zoom level steps. Default: [0.25, 0.5, 0.75, 1, 1.25, 1.5, 2] */
    zoomLevels?: number[];
    /** Show the .arc source toggle button. Default: true */
    showArcToggle?: boolean;
    /** Show the auto-layout button. Default: false */
    showAutoLayout?: boolean;
    /** Show zoom controls even when not interactive (branded reader chrome). Default: follows `interactive` */
    showControls?: boolean;
    /** Show a minimap overview (bottom-left). Default: false */
    showMinimap?: boolean;
    /** Show a key for the connector styles and labelled groups (bottom-left). Default: false */
    showLegend?: boolean;
    /** Show the active focus target's caption and steps. Default: false */
    showFocusStory?: boolean;
    /** Override the edge/frame treatment (else the theme's brand.frame). */
    frame?: BrandSpec['frame'];
    /** Control hover behavior. true = all effects (default), false = none, object = granular control */
    hoverEffects?: boolean | HoverEffectsConfig;
    /** Called when a node is hovered/clicked (nodeId) or released (null) */
    onNodeHover?: (nodeId: string | null) => void;
    /** Override the engineering title-block fields (shown when the theme opts in). */
    titleBlock?: TitleBlockInfo;
    /** Render the diagram in isometric projection. Default: '2d' */
    defaultViewMode?: ViewMode_2;
    /** Isometric render style — 'solid' | 'blueprint' | 'cyanotype'. Default: 'solid' */
    defaultIsoStyle?: IsoStyleId;
}

declare interface ArcDiagramProps_2 {
    config: DiagramConfig;
    options?: PlayerOptions;
    className?: string;
    style?: default_2.CSSProperties;
    /** Fired when a node box is clicked (drill-in). */
    onNodeClick?: (node: DiagramNode, meta: {
        tier: number;
        index: number;
    }) => void;
    /** Fired when a layer floor is clicked (solo). */
    onLayerClick?: (tier: number) => void;
}

export declare interface ArcNodeData {
    icon: string;
    name: string;
    subtitle?: string;
    description?: string;
    color: DiagramColor;
    /** Per-node silhouette. Omit to follow the theme's own node shape. */
    shape?: NodeShape;
}

export declare interface ArcNodePosition {
    x: number;
    y: number;
    size: NodeSize;
}

export declare interface AsciiOptions {
    /** Pixels per character horizontally (default: 8) */
    scaleX?: number;
    /** Pixels per character vertically (default: 16) */
    scaleY?: number;
    /** 'unicode' for box-drawing chars, 'ascii' for +- style (default: 'unicode') */
    charset?: 'unicode' | 'ascii';
    /** Character padding around diagram (default: 1) */
    padding?: number;
    /** Max output width in chars — auto-adjusts scaleX if exceeded */
    maxWidth?: number;
    /** Show connector labels (default: true) */
    showLabels?: boolean;
}

/**
 * Generate a diagram from minimal input — no positions or anchors needed.
 */
export declare interface AutoDiagramInput {
    layoutHints?: ArcDiagramData_2['layoutHints'];
    groups?: ArcDiagramData_2['groups'];
    nodeData: ArcDiagramData_2['nodeData'];
    connectors: Array<Omit<Connector, 'fromAnchor' | 'toAnchor'> & {
        fromAnchor?: AnchorPosition_2;
        toAnchor?: AnchorPosition_2;
    }>;
    connectorStyles: ArcDiagramData_2['connectorStyles'];
    layout?: LayoutOptions;
}

/**
 * Auto-layout an ArcDiagramData.
 *
 * Uses LR flow within rows. When layers exceed the target width,
 * wraps into multiple rows — combining LR and TB to maximize
 * use of the available 2D space.
 */
export declare function autoLayout(data: ArcDiagramData_2, options?: LayoutOptions): ArcDiagramData_2;

declare interface BrandSpec {
    /** Font stack for the whole diagram (node names inherit this). */
    fontFamily?: string;
    /** Monospace stack for subtitles + connector labels. */
    monoFamily?: string;
    /** Stylesheet URL injected once so the families load (e.g. Google Fonts). */
    fontImport?: string;
    /** Node + icon corner radius (CSS length). '0px' = square tiles. */
    nodeRadius?: string;
    /** Node border width (CSS length), overrides the default 2px. */
    nodeBorderWidth?: string;
    /** Uppercase + letter-space the subtitle and connector labels. */
    upperLabels?: boolean;
    /** Arrowhead shape at connector ends. */
    arrowhead?: 'triangle' | 'chevron';
    /** Background grid system. */
    gridType?: 'dots' | 'lines' | 'crosshair' | 'none';
    /** Edge/frame treatment at the diagram boundary. */
    frame?: 'hairline' | 'inset' | 'brackets' | 'ticks' | 'cropmarks' | 'corners' | 'sheet' | 'reticle' | 'none';
    /** Render an engineering-drawing title block in the bottom-right corner. */
    titleBlock?: boolean;
    /** Node silhouette. 'chamfer' cuts all four corners, 'notch' cuts the top-right;
     *  both are drawn with clip-path, not rounding. See utils/nodeShape.ts. */
    nodeShape?: 'rounded' | 'square' | 'chamfer' | 'notch' | 'pill';
    /** Ornament on the node shell — supersedes accentBar, which still works. */
    nodeDecor?: 'none' | 'bar-left' | 'bar-top' | 'ticks' | 'rule' | 'dot' | 'stripe';
    /** Overall node opacity (0–1). */
    nodeOpacity?: number;
    /** Frosted glass backdrop on nodes. */
    nodeGlass?: boolean;
    /** Colored accent stripe on the node shell. */
    accentBar?: 'left' | 'top' | 'none';
    /** Soft bloom on connector strokes. */
    connectorGlow?: boolean;
}

export declare interface ColorPalette {
    violet: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
    emerald: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
    blue: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
    amber: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
    sky: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
    zinc: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
    rose: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
    orange: {
        border: string;
        bg: string;
        icon: string;
        stroke: string;
    };
}

/**
 * Convert a DiagramConfig back to YAML string
 */
export declare function configToYaml(config: DiagramConfig_2): string;

declare interface Connector {
    from: string;
    to: string;
    fromAnchor: AnchorPosition_2;
    toAnchor: AnchorPosition_2;
    style: string;
    curve?: 'natural' | 'step';
}

export declare interface ConnectorStyle {
    color: string;
    strokeWidth: number;
    label?: string;
    dashed?: boolean;
    bidirectional?: boolean;
    animated?: boolean;
    showArrow?: boolean;
    showEndpoints?: boolean;
}

declare interface ConnectorStyle_2 {
    color: DiagramColor_2;
    strokeWidth: number;
    label?: string;
    dashed?: boolean;
}

export declare function createAutoLayout(input: AutoDiagramInput): ArcDiagramData_2;

/** Delete a diagram session */
export declare function deleteDiagramSession(id: string): void;

/** Derive a URL-safe session ID from a diagram's source path or ID */
export declare function deriveSessionId(source: string): string;

export declare function DiagramCanvas({ onViewportChange, embedConfig, zoomConfig, surface, themeOverride, isDark }: DiagramCanvasProps): JSX.Element;

declare interface DiagramCanvasProps {
    onViewportChange?: (bounds: {
        x: number;
        y: number;
        width: number;
        height: number;
    }) => void;
    embedConfig?: EmbedConfig;
    zoomConfig?: ZoomConfig;
    /** Workspace backdrop: 'theme' paints the diagram theme's container (embeds,
     *  where the frame is part of the artifact), 'chrome' paints the app canvas
     *  so the editor's infinite surface matches the shell skin. */
    surface?: 'theme' | 'chrome';
    /** Override canvas background with an Arc theme. */
    themeOverride?: string;
    isDark?: boolean;
}

export declare type DiagramColor = 'violet' | 'emerald' | 'blue' | 'amber' | 'sky' | 'zinc' | 'rose' | 'orange';

declare type DiagramColor_2 = 'violet' | 'emerald' | 'blue' | 'amber' | 'sky' | 'zinc' | 'rose' | 'orange';

export declare interface DiagramConfig {
    id?: string;
    title: string;
    description?: string;
    theme: 'dark' | 'light';
    /** Render style: shaded solids, or a technical line-art plate. */
    style?: IsoStyleId;
    /** Flat mineral inks and deterministic stipple; defaults to the existing material. */
    material?: 'standard' | 'retro-print';
    canvas: {
        width: number;
        height: number;
    };
    origin: {
        x: number;
        y: number;
    };
    cornerRadius?: number;
    tiers: TierConfig[];
    floorSize: {
        width: number;
        depth: number;
    };
    nodes: DiagramNode[];
    pillars?: {
        x: number;
        y: number;
        fromTier: number;
        toTier: number;
    }[];
}

declare interface DiagramConfig_2 {
    title: string;
    description: string;
    theme: 'dark' | 'light';
    style?: 'solid' | 'blueprint' | 'cyanotype';
    canvas: {
        width: number;
        height: number;
    };
    origin: {
        x: number;
        y: number;
    };
    cornerRadius?: number;
    tiers: TierConfig_2[];
    floorSize: {
        width: number;
        depth: number;
    };
    nodes: DiagramNode_2[];
    pillars?: {
        x: number;
        y: number;
        fromTier: number;
        toTier: number;
    }[];
}

export declare function DiagramEditor({ initialData, themeId, colorMode, sessionId, initialDiagramMeta, }: {
    initialData?: any;
    themeId?: string | null;
    colorMode?: 'light' | 'dark';
    sessionId?: string | null;
    initialDiagramMeta?: Record<string, any>;
}): JSX.Element;

declare interface DiagramImage {
    id: string;
    src: string;
    name: string;
    x: number;
    y: number;
    width: number;
    height: number;
    opacity: number;
}

export declare interface DiagramLayout {
    width: number;
    height: number;
}

declare interface DiagramLayout_2 {
    width: number;
    height: number;
}

export declare interface DiagramMeta {
    themeId?: string | null;
    isoStyle?: IsoStyleId;
    viewMode?: ViewMode;
    colorMode?: 'light' | 'dark';
    viewport?: {
        width: number;
        height: number;
    };
    sourceUrl?: string;
}

export declare type DiagramMode = 'dark' | 'light';

export declare interface DiagramNode {
    tier: number;
    x: number;
    y: number;
    width: number;
    depth: number;
    height: number;
    color: string;
    label: string;
    opacity?: number;
    blur?: number;
    translucent?: boolean;
    /** Optional link target; clicking the node surfaces this (declarative click hook). */
    link?: string;
}

declare interface DiagramNode_2 {
    tier: number;
    x: number;
    y: number;
    width: number;
    depth: number;
    height: number;
    color: string;
    label: string;
    opacity?: number;
    blur?: number;
    translucent?: boolean;
}

export declare interface DiagramSession {
    diagram: any;
    themeId: string | null;
    colorMode: 'light' | 'dark';
    diagramMeta: Record<string, any>;
    updatedAt: number;
    name?: string;
    originalDiagram?: any;
}

declare interface EditorContextType {
    state: typeof initialState;
    dispatch: React.Dispatch<any>;
    actions: Record<string, (...args: any[]) => void>;
}

export declare function EditorProvider({ children, initialDiagram, initialThemeId, initialColorMode, initialDiagramMeta }: {
    children: React.ReactNode;
    initialDiagram?: any;
    initialThemeId?: string | null;
    initialColorMode?: 'light' | 'dark';
    initialDiagramMeta?: Record<string, any>;
}): JSX.Element;

export declare interface EmbedConfig {
    defaultViewMode?: ViewMode;
    defaultIsoStyle?: IsoStyleId;
    enableViewModeToggle?: boolean;
    enableZoom?: boolean;
    enablePan?: boolean;
    enableDrag?: boolean;
    enableSelection?: boolean;
    showZoomControls?: boolean;
    showMiniMap?: boolean;
    showGrid?: boolean;
}

declare interface ExportZone {
    x: number;
    y: number;
    width: number;
    height: number;
}

export declare interface FocusConnectorRef {
    from: string;
    to: string;
}

declare interface FocusConnectorRef_2 {
    from: string;
    to: string;
}

export declare interface FocusStep {
    icon: string;
    label: string;
}

declare interface FocusStep_2 {
    icon: string;
    label: string;
}

export declare interface FocusTarget {
    mode?: 'append' | 'replace';
    nodes?: string[];
    connectors?: FocusConnectorRef[];
    caption?: string;
    steps?: FocusStep[];
}

/** A declarative highlight story activated by hovering or selecting a node. */
declare interface FocusTarget_2 {
    /** `append` includes direct neighbors; `replace` uses only the explicit story. */
    mode?: 'append' | 'replace';
    nodes?: string[];
    connectors?: FocusConnectorRef_2[];
    caption?: string;
    steps?: FocusStep_2[];
}

/** Generate a short session ID (first 8 hex chars of a UUID for brevity in URLs) */
export declare function generateSessionId(): string;

/** Shading for a named preset color (falls back to `slate` when unknown). */
export declare function getColorShading(colorName: string): IsoShadingResult;

export declare function getTheme(id: ThemeId): Theme;

export declare function getThemeList(): {
    id: ThemeId;
    name: string;
    description: string;
}[];

declare interface GridConfig {
    enabled: boolean;
    size: number;
    color: string;
    opacity: number;
    type: 'dots' | 'lines';
}

export declare type GroupLayoutDirection = 'horizontal' | 'vertical';

declare type GroupLayoutDirection_2 = 'horizontal' | 'vertical';

export declare interface GroupLayoutHint {
    direction?: GroupLayoutDirection;
    padding?: number;
    layerGap?: number;
    itemGap?: number;
    align?: LayoutAlignment;
    justify?: LayoutAlignment | 'space-between';
}

/** Layout policy for the nodes inside one group frame. */
declare interface GroupLayoutHint_2 {
    /** `horizontal` lays layers left-to-right; `vertical` lays them top-to-bottom. */
    direction?: GroupLayoutDirection_2;
    padding?: number;
    layerGap?: number;
    itemGap?: number;
    align?: LayoutAlignment_2;
    justify?: LayoutAlignment_2 | 'space-between';
}

export declare interface GroupShape {
    id: string;
    x: number;
    y: number;
    width: number;
    height: number;
    type: 'rect' | 'circle';
    color: DiagramColor;
    label?: string;
    dashed?: boolean;
}

declare interface GroupShape_2 {
    id: string;
    x: number;
    y: number;
    width: number;
    height: number;
    type: 'rect' | 'circle';
    color: DiagramColor_2;
    label?: string;
    dashed?: boolean;
}

declare interface HoverEffectsConfig {
    /** Dim unrelated nodes/connectors. Default: true */
    dim?: boolean;
    /** 0–1 opacity for dimmed nodes. Connectors dim to ~56% of this. Default: 0.45 */
    dimOpacity?: number;
    /** Lift hovered node up 2px. Default: true */
    lift?: boolean;
    /** Colored glow shadow on hover. Default: true */
    glow?: boolean;
    /** Thicken connected edges. Default: true */
    highlightEdges?: boolean;
}

declare const initialState: {
    diagram: {
        layout: {
            width: number;
            height: number;
        };
        grid: {
            enabled: boolean;
            size: number;
            color: string;
            opacity: number;
            type: "dots" | "lines";
        };
        nodes: {};
        nodeData: {};
        connectors: any[];
        connectorStyles: {
            [x: string]: ConnectorStyle;
        };
        groups: any[];
        images: any[];
        exportZone: any;
    };
    editor: {
        selectedNodeIds: any[];
        selectedConnectorIndex: any;
        selectedGroupId: any;
        selectedImageId: any;
        mode: string;
        pendingConnector: any;
        pendingGroup: any;
        isDragging: boolean;
        dragOffset: {
            x: number;
            y: number;
        };
        dragNodeOffsets: {};
        template: string;
        zoom: number;
        viewMode: string;
        isoStyle: string;
        themeId: string;
        colorMode: string;
    };
    meta: {
        filename: any;
        isDirty: boolean;
        lastSaved: any;
        diagramMeta: {};
    };
    history: {
        past: any[];
        future: any[];
    };
};

export declare function isDiagramShape(value: unknown): boolean;

/** Preset HSL palettes matching Arc's diagram colors. */
export declare const ISO_COLORS: {
    violet: IsoColorDef;
    blue: IsoColorDef;
    cyan: IsoColorDef;
    emerald: IsoColorDef;
    amber: IsoColorDef;
    rose: IsoColorDef;
    slate: IsoColorDef;
    zinc: IsoColorDef;
};

/** Screen-space bounding box of an isometric box. */
export declare function isoBoundingBox(width: number, depth: number, height: number, originX?: number, originY?: number): IsoBoundingBoxResult;

/** Screen-space bounding box of an isometric box. */
declare interface IsoBoundingBoxResult {
    minX: number;
    minY: number;
    maxX: number;
    maxY: number;
    width: number;
    height: number;
}

/** SVG path strings for an isometric box (cuboid) with its visible faces. */
export declare function isoBox(width: number, depth: number, height: number, originX?: number, originY?: number, radius?: number): IsoBoxPaths;

/** The SVG paths that draw an isometric box: flat faces (path strings), rounded
 *  corners (arrays of shaded segments, empty when `radius` is 0), and outline. */
declare interface IsoBoxPaths {
    top: string;
    left: string;
    right: string;
    cornerFrontLeft: IsoBoxSegment[];
    cornerFrontRight: IsoBoxSegment[];
    cornerBackLeft: IsoBoxSegment[];
    cornerBackRight: IsoBoxSegment[];
    outline: string;
}

/** One shaded segment of a rounded box corner. */
declare interface IsoBoxSegment {
    path: string;
    intensity: number;
}

/** HSL preset for a named diagram color. */
declare interface IsoColorDef {
    hue: number;
    saturation: number;
    lightness: number;
}

/** 2D screen point produced by the iso projection. */
declare interface IsoScreenPoint {
    screenX: number;
    screenY: number;
}

/** Standard iso face shading derived from a base HSL hue (or color name). */
export declare function isoShading(baseHue: number | string, saturation?: number, baseLightness?: number): IsoShadingResult;

/** Per-face shading colors (CSS color strings). */
declare interface IsoShadingResult {
    top: string;
    right: string;
    left: string;
}

declare type IsoStyleId = 'solid' | 'blueprint' | 'cyanotype';

/** Convert 3D isometric coordinates to 2D screen coordinates. */
export declare function isoToScreen(x: number, y: number, z?: number): IsoScreenPoint;

declare type LabelAlign = 'left' | 'right' | 'center';

declare type LabelCorner = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';

export declare type LayoutAlignment = 'start' | 'center' | 'end';

declare type LayoutAlignment_2 = 'start' | 'center' | 'end';

export declare interface LayoutHints {
    nodes?: Record<string, NodeLayoutHint>;
    groups?: Record<string, GroupLayoutHint>;
}

declare interface LayoutHints_2 {
    nodes?: Record<string, NodeLayoutHint_2>;
    groups?: Record<string, GroupLayoutHint_2>;
}

declare interface LayoutOptions {
    /** Horizontal gap between columns */
    columnGap?: number;
    /** Vertical gap between nodes within a column */
    nodeGap?: number;
    /** Vertical gap between wrapped rows */
    rowGap?: number;
    /** Padding around the entire diagram */
    padding?: number;
}

/** List all saved diagram sessions, sorted by most recent */
export declare function listDiagramSessions(): Array<{
    id: string;
    name?: string;
    updatedAt: number;
}>;

/** Load a diagram session from localStorage */
export declare function loadDiagramSession(id: string): DiagramSession | null;

declare interface NodeData {
    icon: string;
    name: string;
    subtitle?: string;
    description?: string;
    color: DiagramColor_2;
    /** Per-node silhouette. Omit to follow the theme's own node shape. */
    shape?: NodeShape;
}

export declare interface NodeLayoutHint {
    group?: string;
    layer?: number;
    order?: number;
}

/** Optional placement hints used by autoLayout when nodes belong to groups. */
declare interface NodeLayoutHint_2 {
    /** ID of the group frame that owns this node. */
    group?: string;
    /** Explicit layer within the group. Connected nodes are layered automatically otherwise. */
    layer?: number;
    /** Stable ordering within a layer. Lower values render first. */
    order?: number;
}

export declare interface NodePosition {
    x: number;
    y: number;
    size: NodeSize_3;
    width?: number;
    height?: number;
    z?: number;
    isoHeight?: number;
    isoDepth?: number;
    /** Painter's-algorithm bias when two boxes occupy the same volume. Higher draws later (in front). */
    isoOrder?: number;
    /** Top-face label axis. Omit / `auto` = along the longer edge. */
    isoLabelDir?: 'auto' | 'x' | 'y';
    /** Rotate the print 180° on the face. */
    isoLabelFlip?: boolean;
    /** Typeface for the printed label. Omit / `theme` follows the diagram brand. */
    isoLabelFont?: 'theme' | 'ui' | 'mono';
}

declare interface NodePosition_2 {
    x: number;
    y: number;
    size: NodeSize_2;
}

declare type NodeShape = 'rounded' | 'square' | 'chamfer' | 'notch' | 'pill';

export declare type NodeSize = 'xs' | 's' | 'm' | 'l';

declare type NodeSize_2 = 'xs' | 's' | 'm' | 'l';

declare type NodeSize_3 = 'xs' | 's' | 'm' | 'l';

/**
 * Parse YAML config into DiagramConfig
 *
 * Supported format:
 * ```yaml
 * title: Data Platform
 * description: Domain-driven architecture
 * theme: light
 * canvas: 1100x720
 * floor: 460x280
 * corner: 14
 *
 * colors:
 *   db: &db blue
 *   svc: &svc violet
 *
 * tiers:
 *   - Data @ 0
 *   - Services @ 150
 *   - Domains @ 300
 *
 * nodes:
 *   0:  # Tier 0
 *     - SQL       *db  25,25   120x90x34
 *     - NoSQL     *db  165,25  120x90x34
 *   1:  # Tier 1
 *     - Ingest    *svc 20,20   100x80x40 { opacity=0.8 }
 * ```
 */
export declare function parseYamlConfig(yamlStr: string): DiagramConfig_2;

declare interface PlayerOptions {
    /** Enable hover effects */
    interactive?: boolean;
    /** Enable zoom/pan */
    zoomable?: boolean;
    /** Show tier labels */
    showLabels?: boolean;
    /** Animation on load */
    animate?: boolean;
    /** On hover, lift the hovered layer out of the stack (default: true when interactive) */
    expandOnHover?: boolean;
}

export declare function renderAscii(data: ArcDiagramData, options?: AsciiOptions): string;

/**
 * Render diagram to a DOM element
 */
export declare function renderToElement(container: HTMLElement, config: DiagramConfig): void;

/**
 * Render diagram to SVG string (for SSR or static export)
 */
export declare function renderToString(config: DiagramConfig): string;

export declare function resolveFocusState(activeNodeId: string | null, connectors: ArcConnector[], focusTargets?: Record<string, FocusTarget>): {
    nodeIds: Set<string>;
    connectorIndexes: Set<number>;
};

/** Save a diagram session to localStorage */
export declare function saveDiagramSession(id: string, data: Omit<DiagramSession, 'updatedAt'>): void;

/** Convert 2D screen coordinates to the isometric floor position (z = 0). */
export declare function screenToIsoFloor(screenX: number, screenY: number): { x: number; y: number };

export declare interface Theme {
    id: ThemeId;
    name: string;
    description: string;
    light: {
        palette: ColorPalette;
        background: ThemeBackground;
        text: {
            primary: string;
            secondary: string;
            muted: string;
        };
    };
    dark: {
        palette: ColorPalette;
        background: ThemeBackground;
        text: {
            primary: string;
            secondary: string;
            muted: string;
        };
    };
    /** Optional brand design language (typography, node shape, arrows). */
    brand?: BrandSpec;
}

declare interface ThemeBackground {
    container: string;
    grid: {
        color: string;
        opacity: number;
        size: number;
    };
}

export declare type ThemeId = 'default' | 'warm' | 'cool' | 'mono' | 'engineering' | 'workbench' | 'tactical' | 'command';

export declare const THEMES: Record<ThemeId, Theme>;

export declare interface TierConfig {
    name: string;
    elevation: number;
    floorColor?: string;
    floorOpacity?: number;
    borderColor?: string;
    nodeOpacity?: number;
    blur?: number;
    /** Projected (screen-space) offset applied to the whole layer AFTER isometric projection.
     *  Staggers layers in the picture plane — e.g. { x: 0, y: -40 } lifts a layer up the projected
     *  Y axis; { x: -60, y: 0 } pushes one left on −X. Purely declarative; default = no offset. */
    offset?: {
        x: number;
        y: number;
    };
}

declare interface TierConfig_2 {
    name: string;
    elevation: number;
    floorColor?: string;
    floorOpacity?: number;
    borderColor?: string;
    nodeOpacity?: number;
    blur?: number;
}

/** Content for the engineering-drawing title block (Engineering theme). */
declare interface TitleBlockInfo {
    /** Project / drawing title shown in the top strip. */
    title?: string;
    /** Drawing number. Defaults to the diagram label (data.id). */
    drawing?: string;
    /** Scale field. Default 'NTS'. */
    scale?: string;
    /** Revision field. Default 'A'. */
    rev?: string;
    /** Sheet field. Default '1 / 1'. */
    sheet?: string;
}

export declare function toExportFormat(diagram: ArcDiagram_2): ArcDiagramData_2;

export declare function toTypeScriptSource(diagram: ArcDiagram_2, name?: string): string;

export declare function useColorMode(): string;

export declare function useDiagram(): {
    layout: {
        width: number;
        height: number;
    };
    grid: {
        enabled: boolean;
        size: number;
        color: string;
        opacity: number;
        type: "dots" | "lines";
    };
    nodes: {};
    nodeData: {};
    connectors: any[];
    connectorStyles: {
        [x: string]: ConnectorStyle;
    };
    groups: any[];
    images: any[];
    exportZone: any;
};

export declare function useDiagramMeta(): {};

export declare function useEditor(): EditorContextType;

export declare function useEditorState(): {
    selectedNodeIds: any[];
    selectedConnectorIndex: any;
    selectedGroupId: any;
    selectedImageId: any;
    mode: string;
    pendingConnector: any;
    pendingGroup: any;
    isDragging: boolean;
    dragOffset: {
        x: number;
        y: number;
    };
    dragNodeOffsets: {};
    template: string;
    zoom: number;
    viewMode: string;
    isoStyle: string;
    themeId: string;
    colorMode: string;
};

/** Returns the active theme's brand spec (typography, node shape, connector treatment). */
export declare function useResolvedBrand(): BrandSpec;

/** Returns the resolved theme palette (light or dark) for the current theme and color mode. */
export declare function useResolvedTheme(): {
    palette: ColorPalette;
    background: ThemeBackground;
    text: {
        primary: string;
        secondary: string;
        muted: string;
    };
};

export declare function useThemeId(): string;

export declare function useViewMode(): string;

/** Human-readable reason this is not a diagram, or null if it is. */
export declare function validateDiagramShape(value: unknown): string | null;

export declare type ViewMode = '2d' | 'isometric';

declare type ViewMode_2 = '2d' | 'isometric';

declare interface ZoomConfig {
    defaultZoom?: number | 'fit';
    zoomLevels?: number[];
    zoomStep?: number;
    /** Cap for `defaultZoom: 'fit'` / Fit. Embeds stay at 1 so a small diagram
     *  isn't blown up; the editor passes 2 so the drawing can fill the view. */
    maxFitZoom?: number;
}

export { }