UNPKG

dropflow

Version:

A small CSS2 document renderer built from specifications

227 lines (226 loc) 7.85 kB
import { Logger } from './util.js'; import { Style } from './style.js'; import { Run } from './layout-text.js'; import { Break, Inline, IfcInline, BlockContainer, ReplacedBox } from './layout-flow.js'; export interface LogicalArea { blockStart: number | undefined; lineLeft: number | undefined; blockSize: number | undefined; inlineSize: number | undefined; } export interface RenderItemLogOptions { containingBlocks?: boolean; css?: keyof Style; paragraphText?: string; bits?: boolean; } export interface PrelayoutContext { lastBlockContainerArea: BoxArea; lastPositionedArea: BoxArea; } export declare abstract class RenderItem { style: Style; constructor(style: Style); isBlockContainer(): this is BlockContainer; isFormattingBox(): this is FormattingBox; isReplacedBox(): this is ReplacedBox; isRun(): this is Run; isInline(): this is Inline; isBreak(): this is Break; isIfcInline(): this is IfcInline; isBox(): this is Box; abstract logName(log: Logger, options?: RenderItemLogOptions): void; abstract getLogSymbol(): string; log(options?: RenderItemLogOptions, log?: Logger): void; /** * Typically the time to assign the containing block */ prelayoutPreorder(ctx: PrelayoutContext): void; /** * Typically the time to shape text and gather font metrics */ prelayoutPostorder(ctx: PrelayoutContext): void; /** * Typically the time to absolutize relative coordinates */ postlayoutPreorder(): void; /** * Typically the time to snap pixels */ postlayoutPostorder(): void; } export declare abstract class Box extends RenderItem { id: string; containingBlock: BoxArea; /** * General boolean bitfield shared by all box subclasses. The bits labeled * with "has" say something about their content to allow for optimizations. * They propagate through to parents of the same type, though some of them * do so conditionally. */ bitfield: number; private area; /** * Bitfield allocations. Box subclasses with different inheritance are allowed * to overlap attribute bits or propagate target bits. It's easier to keep * these all in one place than try to define them on the subclasses. */ static BITS: { isAnonymous: number; enableLogging: number; reserved1: number; reserved2: number; hasBackgroundInLayer: number; hasForegroundInLayer: number; hasBackgroundInDescendent: number; hasForegroundInDescendent: number; isInline: number; isBfcRoot: number; hasText: number; hasComplexText: number; hasSoftHyphen: number; hasNewlines: number; hasSoftWrap: number; hasCollapsibleWs: number; hasPaintedInlines: number; hasColoredInline: number; hasSizedInline: number; hasBreakInlineOrReplaced: number; hasFloatOrReplaced: number; hasInlineBlocks: number; }; /** * Use this, not BITS, for the ctor! BITS are ~private */ static ATTRS: { isAnonymous: number; enableLogging: number; }; static PROPAGATES_TO_INLINE_BITS: number; constructor(style: Style, attrs: number); getBorderArea(): BoxArea; getPaddingArea(): BoxArea; getContentArea(): BoxArea; prelayoutPreorder(ctx: PrelayoutContext): void; /** * Assign the offsets of the border and padding areas from the content area, * as defined by the style. This is the first layout step, and block * containers must have been laid out for percentages to work. */ fillAreas(): void; setBlockPosition(position: number): void; setBlockSize(size: number): void; setInlinePosition(lineLeft: number): void; setInlineOuterSize(size: number): void; get writingModeAsParticipant(): import("./style.js").WritingMode; get directionAsParticipant(): import("./style.js").Direction; propagate(parent: Box): void; prelayout(ctx: PrelayoutContext): void; isBox(): this is Box; isAnonymous(): boolean; isPositioned(): boolean; abstract isInlineLevel(): boolean; isStackingContextRoot(): boolean; /** * A layer is a stacking context root or an element that CSS 2.1 appendix E * says to treat like one. */ isLayerRoot(): boolean; /** * Does this paint anything in the background layer? Borders, box-shadow, etc. */ abstract hasBackground(): boolean; /** * Does this paint anything in the foreground layer? Text, images, etc. */ abstract hasForeground(): boolean; /** * There is a background in some descendent that is part of the same paint * layer (not necessarily in the subject). (See also isLayerRoot). * * A background is a background-color or anything CSS 2.1 appendix E groups * with it. */ hasBackgroundInLayerRoot(): boolean; /** * There is a foreground in some descendent that is part of the same paint * layer (not necessarily in the subject). (See also isLayerRoot). * * A foreground is a text run or anything CSS 2.1 appendix E groups with it */ hasForegroundInLayerRoot(): boolean; /** * There is a background somewhere beneath this node * * A background is a background-color or anything CSS 2.1 appendix E groups * with it */ hasBackgroundInDescendent(): boolean; /** * There is a foreground somewhere beneath this node * * A foreground is a text run or anything CSS 2.1 appendix E groups with it */ hasForegroundInDescendent(): boolean; postlayoutPreorder(): void; postlayoutPostorder(): void; getRelativeVerticalShift(): number; getRelativeHorizontalShift(): number; logName(log: Logger, options?: RenderItemLogOptions): void; getLogSymbol(): string; stringifyBitfield(): string; } /** * Base class for BlockContainer, ReplacedBox, and theoretically, GridContainer * and FlexContainer. Subclasses are all able to establish their own independent * formatting contexts (replaced boxes arguably, not officially, do so) whereas * Inlines cannot. */ export declare abstract class FormattingBox extends Box { static ATTRS: { isAnonymous: number; enableLogging: number; }; isFormattingBox(): this is FormattingBox; getDefiniteInnerInlineSize(): number | undefined; getDefiniteOuterInlineSize(): number | undefined; getDefiniteInnerBlockSize(): number | undefined; getMarginsAutoIsZero(): { blockStart: number; lineRight: number; blockEnd: number; lineLeft: number; }; canCollapseThrough(): boolean; isFloat(): boolean; isOutOfFlow(): boolean; propagate(parent: Box): void; isInlineLevel(): boolean; abstract getLastBaseline(): number | undefined; abstract contribution(mode: 'min-content' | 'max-content'): number; } export declare class BoxArea { parent: BoxArea | null; box: Box; blockStart: number; blockSize: number; lineLeft: number; inlineSize: number; constructor(box: Box, x?: number, y?: number, w?: number, h?: number); clone(): BoxArea; get writingMode(): import("./style.js").WritingMode; get direction(): import("./style.js").Direction; get x(): number; set x(x: number); get y(): number; set y(y: number); get width(): number; get height(): number; setParent(p: BoxArea): void; inlineSizeForPotentiallyOrthogonal(box: FormattingBox): number; absolutify(): void; snapPixels(): void; repr(indent?: number): string; } export declare function prelayout(root: BlockContainer): void; export declare function postlayout(root: BlockContainer): void;