export type DisplayMode = "browse" | "selection";
export type SelectModeSelectionType = "none" | "element" | "area" | "drag";
export type SelectModeInlineTextStatus = "editable" | "dynamic" | "translated" | null;
export type SelectModeTextMetrics = {
    tightWidth: number;
    lineCount: number;
    lineHeight: number;
};
export type SelectModeClickPosition = {
    x: number;
    y: number;
};
export type SelectModeSourceLocation = {
    filePath: string;
    lineNumber: number;
    columnNumber?: number;
    componentName?: string;
};
export type SelectModeFiberChainEntry = {
    sourceLocation: SelectModeSourceLocation;
    tagName?: string;
    componentName?: string;
    props?: {
        [x: string]: unknown;
    };
};
export type SelectModeBoundingRect = {
    x: number;
    y: number;
    left: number;
    top: number;
    right: number;
    bottom: number;
    width: number;
    height: number;
};
export type SelectModeHoverRect = {
    x: number;
    y: number;
    left: number;
    top: number;
    right: number;
    bottom: number;
    width: number;
    height: number;
    isSection?: boolean;
};
export type SelectModeSelectionRect = {
    id: string;
    rect: SelectModeBoundingRect;
};
export type SelectModeStyleAtRule = {
    type: string;
    text: string;
};
export type SelectModeStyleVariant = {
    atRules: SelectModeStyleAtRule[];
    pseudo: string | null;
};
export type SelectModeDefinedStyle = {
    property: string;
    variant: SelectModeStyleVariant | null;
    className: string | null;
    raw: string;
    resolved: string;
};
export type SelectModeImageScope = {
    kind: "all";
} | {
    kind: "media";
    media: string;
};
export type SelectModeImageSource = {
    srcSet: string;
    sizes: string;
    media: string;
    type: string;
    previewUrl: string | null;
};
export type SelectModeImage = {
    src: string;
    currentSrc: string;
    srcSet: string;
    sizes: string;
    previewUrl: string | null;
    sources: SelectModeImageSource[];
};
export type SelectModeVideo = {
    src: string;
    currentSrc: string;
};
export type SelectedElement = {
    kind: "react-element";
    selector: string;
    section?: {
        selector: string;
    };
    tagName: string;
    elementType: string;
    textContent: string | null;
    sectionLabel?: string;
    rect: SelectModeBoundingRect;
    textMetrics: SelectModeTextMetrics | null;
    outerHTML: string;
    image?: SelectModeImage;
    video?: SelectModeVideo;
    definedStyles: SelectModeDefinedStyle[];
    authoredStyles: {
        [x: string]: string;
    };
    inheritedStyles: {
        [x: string]: string;
    };
    clickPosition: SelectModeClickPosition;
    sourceLocation?: SelectModeSourceLocation;
    fiberChain: SelectModeFiberChainEntry[];
    siblingSelectors: string[];
};
export type SelectablePlanData = {
    kind: "plan";
    planId: string;
    label: string;
    rect: SelectModeBoundingRect;
};
export type SelectablePlanPayload = {
    kind: "plan";
    planId: string;
    label: string;
};
export type SelectableDataPayload = SelectablePlanPayload;
export type SelectableData = SelectedElement | SelectablePlanData;
export type SelectModeOptimisticUpdatePayload = {
    kind: "image";
    image: SelectModeImage;
} | {
    kind: "css";
    fontSource?: "google" | "site";
    property: string;
    value: string | null;
} | {
    kind: "content";
    innerHTML: string;
} | {
    kind: "attribute";
    name: string;
    value: string;
};
export type SelectModeTiptapActiveMarks = {
    bold: boolean;
    italic: boolean;
    underline: boolean;
    strike: boolean;
};
export type SelectModeFormatCommand = "toggleBold" | "toggleItalic" | "toggleUnderline" | "toggleStrike";
export type SelectModeSelection = {
    type: "none";
} | {
    type: "element";
    data: SelectableData;
} | {
    type: "area";
    rect: SelectModeBoundingRect;
    items: SelectableData[];
} | {
    type: "drag";
    dragRect: SelectModeBoundingRect;
    selectionRects: SelectModeSelectionRect[];
};