import { Container, DisplayObject, InteractionEvent, InteractionManager, Point, Rectangle, Renderer, Texture, Transform } from "pixi.js"; import { DBackgroundStateAware } from "./d-background"; import { DBaseInteractive } from "./d-base-interactive"; import { DBasePadding } from "./d-base-padding"; import { DBasePoint } from "./d-base-point"; import { DBaseStateSet } from "./d-base-state-set"; import { DBorderStateAware } from "./d-border"; import { DBorderMask } from "./d-border-mask"; import { DCoordinatePosition, DCoordinateSize } from "./d-coordinate"; import { DCorner } from "./d-corner"; import { DCornerMask } from "./d-corner-mask"; import { DThemeFont } from "./d-font"; import { DLayoutClearType } from "./d-layout-clear-type"; import { DOutline } from "./d-outline"; import { DPadding } from "./d-padding"; import { DShadow } from "./d-shadow"; import { DStateAwareOrValueMightBe } from "./d-state-aware"; import { UtilKeyboardEventShortcut } from "./util/util-keyboard-event"; import { UtilWheelEventDeltas } from "./util/util-wheel-event"; import { DBaseAutoSet } from "./d-base-auto-set"; import { DOnOptions } from "./d-on-options"; import { DBaseSnippetContainer } from "./d-base-snippet-container"; import { DBaseReflowableContainer } from "./d-base-reflowable-container"; /** * {@link DBase} padding options. */ export interface DBasePaddingOptions { /** A top padding */ top?: number; /** A right padding */ right?: number; /** A bottom padding */ bottom?: number; /** A left padding */ left?: number; } /** * {@link DBase} corner options. */ export interface DBaseCornerOptions { /** A radius */ radius?: number; /** Masked corners get unrounded. */ mask?: keyof typeof DCornerMask | DCornerMask; } /** * {@link DBase} events. */ export interface DBaseEvents { /** * Triggered when an initialization is finished. * * @param emitter an emitter */ init(emitter: EMITTER): void; /** * Triggered when added to a container. * * @param container a container added to */ added(container: Container): void; /** * Triggered when removed from a container. * * @param container a container removed from */ removed(container: Container): void; /** * Triggered when moved. * * @param newX a new x * @param newY a new y * @param oldX an old x * @param oldY an old y * @param emitter an emitter */ move(newX: number, newY: number, oldX: number, oldY: number, emitter: EMITTER): void; /** * Triggered when resized. * * @param newWidth a new width * @param newHeight a new height * @param oldWidth an old width * @param oldHeight an old height * @param emitter an emitter */ resize(newWidth: number, newHeight: number, oldWidth: number, oldHeight: number, emitter: EMITTER): void; /** * Triggered when scaled. * * @param newX a new x * @param newY a new y * @param oldX an old x * @param oldY an old y * @param emitter an emitter */ scale(newX: number, newY: number, oldX: number, oldY: number, emitter: EMITTER): void; /** * Triggered when skewed. * * @param newX a new x * @param newY a new y * @param oldX an old x * @param oldY an old y * @param emitter an emitter */ skew(newX: number, newY: number, oldX: number, oldY: number, emitter: EMITTER): void; /** * Triggered when a state is changed. * * @param newState a new state * @param oldState an old state * @param emitter an emitter */ statechange(newState: DBaseStateSet, oldState: DBaseStateSet, emitter: EMITTER): void; /** * Triggered when a wheel moves. * * @param e a wheel event * @param deltas wheel move amounts * @param global a point wheel moved * @param emitter an emitter */ wheel(e: WheelEvent, deltas: UtilWheelEventDeltas, global: Point, emitter: EMITTER): void; /** * Triggered when a key gets down. * * @param e a keyboard event * @param emitter an emitter */ keydown(e: KeyboardEvent, emitter: EMITTER): void; /** * Triggered when a key gets up. * * @param e a keyboard event * @param emitter an emitter */ keyup(e: KeyboardEvent, emitter: EMITTER): void; /** * Triggered when a pointer gets on an emitter. * * @param e an interaction event. * @param emitter an emitter */ over(e: InteractionEvent, emitter: EMITTER): void; /** * Triggered when a pointer gets out of an emitter. * * @param e an interaction event * @param emitter an emitter */ out(e: InteractionEvent, emitter: EMITTER): void; /** * Triggered when a pointer gets down on an emitter. * * @param e an interaction event. * @param emitter an emitter */ down(e: InteractionEvent, emitter: EMITTER): void; /** * Triggered when a pointer gets up on an emitter. * * @param e an interaction event * @param emitter an emitter */ up(e: InteractionEvent, emitter: EMITTER): void; /** * Triggered when an emitter is clicked. * * @param e an interaction event * @param emitter an emitter */ click(e: InteractionEvent, emitter: EMITTER): void; /** * Triggered when an emitter is double clicked. * * @param e an event * @param interactionManager an interaction manager * @param emitter an emitter */ dblclick(e: MouseEvent | TouchEvent, interactionManager: InteractionManager, emitter: EMITTER): void; /** * Triggered when a shortcut is pressed. * * @param e an event * @param emitter an emitter */ shortcut(e: KeyboardEvent, emitter: EMITTER): void; } /** * {@link DBase} "on" options. */ export interface DBaseOnOptions extends Partial>, DOnOptions { } /** * {@link DBase} background options. */ export interface DBaseBackgroundOptions { /** * A color code or a function returning a color code. * If a computed value is undefined, falls back to the theme color. * If a computed value is null, a background is not rendered. */ color?: DStateAwareOrValueMightBe; /** * An alpha or a function returning an alpha. * If a computed value is undefined, falls back to an background alpha of a theme. */ alpha?: DStateAwareOrValueMightBe; } /** * {@link DBase} border options. */ export interface DBaseBorderOptions { /** * A color code or a function returning a color code. * If a computed value is undefined, falls back to the theme color. * If a computed value is null, a background is not rendered. */ color?: DStateAwareOrValueMightBe; /** * An alpha or a function returning an alpha. * If a computed value is undefined, falls back to a border alpha of a theme. */ alpha?: DStateAwareOrValueMightBe; /** * A width or a function returning a width. * If a computed value is undefined, falls back to a border width of a theme. */ width?: DStateAwareOrValueMightBe; /** * An align or a function returning an align. * If a computed value is undefined, falls back to a border align of a theme. * If an align is 0, a border is rendered completely inside of a {@link DBase}. * If an align is 1, a border is rendered completely outside of a {@link DBase}. */ align?: DStateAwareOrValueMightBe; /** Masked borders get removed. */ mask?: DStateAwareOrValueMightBe | keyof typeof DBorderMask; } /** * {@link DBase} outline optons. */ export interface DBaseOutlineOptions { /** * A color code or a function returning a color code. * If a computed value is undefined, falls back to the theme color. * If a computed value is null, a background is not rendered. */ color?: DStateAwareOrValueMightBe; /** * An alpha or a function returning an alpha. * If a computed value is undefined, falls back to an outline alpha of a theme. */ alpha?: DStateAwareOrValueMightBe; /** * A width or a function returning a width. * If a computed value is undefined, falls back to an outline width of a theme. */ width?: DStateAwareOrValueMightBe; /** * An offset or a function returning an offset. * If a computed value is undefined, falls back to an outline align of a theme. * A outline moves to outside when an offset gets larger. */ offset?: DStateAwareOrValueMightBe; /** * An align or a function returning an align. * If a computed value is undefined, falls back to an outline align of a theme. * If an align is 0, an outline is rendered completely inside. * If an align is 1, an outline is rendered completely outside. */ align?: DStateAwareOrValueMightBe; /** Masked outlines get removed. */ mask?: DStateAwareOrValueMightBe | keyof typeof DBorderMask; } export type DBaseShadow = "NONE" | "WEAK" | "DEFAULT" | DShadow; /** * {@link DBase} state blinker options. */ export interface DBaseStateBlinkerOptions { state: string; interval: number; } /** * {@link DBase} state ticker options. */ export interface DBaseStateTickerOptions { state: string; interval: number; } /** * {@link DBase} state options. */ export interface DBaseStateOptions { values?: string | string[]; blinkers?: DBaseStateBlinkerOptions[]; tickers?: DBaseStateTickerOptions[]; } /** * {@link DBase} options. */ export interface DBaseOptions { /** * A parent. * * In the case of UI classes which pop up (e.g., {@link DDialog} and {@link DMenu}), * if multiple application instances are there, better to set * this to an `application.stage` so that they pick a right application. * By default, they assume the last created application is * the one they belong to at the time when they are created. */ parent?: Container; /** Children. */ children?: Array; /** A name. */ name?: string; /** * One of the followings: * * A X position * * A position keyword * * A position expression (Parsed by {@link DScalarExpression}) * * A function returning a X position ({@link DScalarFunction}) * * An object returning a X position ({@link DScalar}) */ x?: DCoordinatePosition; /** * One of the followings: * * A Y position * * A position keyword * * A position expresion (Parsed by {@link DScalarExpression}) * * A function returning a Y position ({@link DScalarFunction}) * * An object returning a Y position ({@link DScalar}) */ y?: DCoordinatePosition; /** * One of the followings: * * A width * * A size keyword * * A size expression (Parsed by {@link DScalarExpression}) * * A function returning a width ({@link DScalarFunction}) * * An object returning a width ({@link DScalar}) */ width?: DCoordinateSize; /** * One of the followings: * * A height * * A size keyword * * A size expression (Parsed by {@link DScalarExpression}) * * A function returning a hight ({@link DScalarFunction}) * * An object returning a hight ({@link DScalar}) */ height?: DCoordinateSize; /** * A visibility. * Set to true to make {@link DBase} visible. * Set to false to make {@link DBase} invisible. * The default value is true. */ visible?: boolean; /** * A renderability. * Unlike {@link visible}, non-renderable element occupies a space. * Set to true to make {@link DBase} renderable. * Set to false to make {@link DBase} not renderable. * The default value is true. */ renderable?: boolean; /** A default state. */ state?: string | string[] | DBaseStateOptions; /** An interactivity option. */ interactive?: keyof typeof DBaseInteractive | DBaseInteractive; /** A padding options. */ padding?: number | DBasePaddingOptions; /** A corner options. */ corner?: number | DBaseCornerOptions; /** A theme or a theme name. */ theme?: THEME | string; /** * Mappings of event names and event handlers. */ on?: DBaseOnOptions; /** * A weight used by {@link DLayoutVertical} and {@link DLayoutHorizontal}. */ weight?: number; /** A tooltip text. */ title?: string; /** A shortcut option. */ shortcut?: string | UtilKeyboardEventShortcut; /** A shortcut options. */ shortcuts?: Array; /** A background options. */ background?: DBaseBackgroundOptions; /** A border options. */ border?: DBaseBorderOptions; /** An outline options. */ outline?: DBaseOutlineOptions; /** A shadow. */ shadow?: DBaseShadow | null; /** A clear type used by {@link DLayoutVertical} and {@link DLayoutHorizontal}. */ clear?: keyof typeof DLayoutClearType | DLayoutClearType; /** A cursor shape. */ cursor?: DStateAwareOrValueMightBe; } /** * {@link DBase} theme. */ export interface DThemeBase extends DThemeFont { /** * Returns a X coordinate. */ getX(): DCoordinatePosition; /** * Returns a Y coordinate. */ getY(): DCoordinatePosition; /** * Returns a height. */ getHeight(): DCoordinateSize; /** * Returns a width. */ getWidth(): DCoordinateSize; /** * Returns a background color. * If the color is null, backgrounds are not be rendered. * * @param state a state */ getBackgroundColor(state: DBaseStateSet): number | null; /** * Returns a background alpha. * * @param state a state */ getBackgroundAlpha(state: DBaseStateSet): number; /** * Returns a background texture. */ getBackgroundTexture(): Texture; /** * Returns a border color. * If the color is null, borders are not be rendered. * * @param state a state */ getBorderColor(state: DBaseStateSet): number | null; /** * Returns a border alpha. * * @param state a state */ getBorderAlpha(state: DBaseStateSet): number; /** * Returns a border width. * * @param state a state */ getBorderWidth(state: DBaseStateSet): number; /** * Returns a border align. * * @param state a state */ getBorderAlign(state: DBaseStateSet): number; /** * Returns a border mask. * * @param state a mask */ getBorderMask(state: DBaseStateSet): DBorderMask; /** * Returns a border texture. */ getBorderTexture(): Texture; /** * Returns a left padding. */ getPaddingLeft(): number; /** * Returns a right padding. */ getPaddingRight(): number; /** * Returns a top padding. */ getPaddingTop(): number; /** * Returns a bottom padding. */ getPaddingBottom(): number; /** * Returns a corner radius. */ getCornerRadius(): number; /** * Returns a corner mask. */ getCornerMask(): DCornerMask; /** * Returns an outline color. * If the color is null, outlines are not be rendered. * * @param state a state */ getOutlineColor(state: DBaseStateSet): number | null; /** * Returns an outline alpha. * * @param state a state */ getOutlineAlpha(state: DBaseStateSet): number; /** * Returns an outline width. * * @param state a state */ getOutlineWidth(state: DBaseStateSet): number; /** * Returns an outline offset. * * @param state a state */ getOutlineOffset(state: DBaseStateSet): number; /** * Returns an outline align. * * @param state a state */ getOutlineAlign(state: DBaseStateSet): number; /** * Returns an outline mask. * * @param state a state */ getOutlineMask(state: DBaseStateSet): DBorderMask; /** * Returns a shadow. * If a shadow is null, no shadow is rendered. */ getShadow(): DShadow | null; /** * Returns an interactivity. */ getInteractive(): DBaseInteractive; /** * Returns true if focusable. */ newState(state: DBaseStateSet): void; /** * Returns a tooltip text. */ getTitle(): string; /** * Returns a clear type. * A clear type is for layout classes including {@link DLayoutVertical}. */ getClearType(): DLayoutClearType; /** * Returns a weight. * Weights are for layout classes including {@link DLayoutVertical}. * If a weight is less than or equals to zero, layout classes are supposed not to change a width / height. */ getWeight(): number; /** * Creates a new shadow. */ newShadow(): DShadow | null; /** * Creates a new weak shadow. */ newShadowWeak(): DShadow | null; /** * Returns a cursor. */ getCursor(state: DBaseStateSet): string; } export interface DRefitable { readonly width: number; readonly height: number; } /** * A base class for UI classes. * See {@link DBaseEvents} for event details. */ export declare class DBase = DBaseOptions> extends Container { protected static WORK_CONTAINS_POINT: Point; private _state; private _theme; protected _options: OPTIONS | undefined; private _width; private _height; protected _padding: DPadding; protected _corner: DCorner; private _scalarSet; protected _auto: DBaseAutoSet; private _isDirty; private _hasDirty; private _isHierarchyDirty; private _shadow; private _onShadowUpdateBound; private _weight; private _position; private _scale; private _skew; protected _title: string; protected _background: DBackgroundStateAware; protected _border: DBorderStateAware; protected _outline: DOutline; protected _clearType: DLayoutClearType; protected _shortcuts?: UtilKeyboardEventShortcut[]; protected _snippet: DBaseSnippetContainer; protected _reflowable: DBaseReflowableContainer; protected _lastDownPoint?: Point; protected _cursor?: DStateAwareOrValueMightBe; constructor(options?: OPTIONS); protected newPadding(theme: THEME, options?: OPTIONS, callback?: () => void): DBasePadding; protected toCursor(cursor: DStateAwareOrValueMightBe | undefined, state: DBaseStateSet): string; get snippet(): DBaseSnippetContainer; get reflowable(): DBaseReflowableContainer; protected initReflowable(): void; protected onChildrenChange(): void; protected onShortcut(e: KeyboardEvent): void; protected init(options?: OPTIONS): void; get weight(): number; set weight(weight: number); protected onMove(newX: number, newY: number, oldX: number, oldY: number): void; resize(width?: number, height?: number): boolean; getClearType(): DLayoutClearType; onResize(newWidth: number, newHeight: number, oldWidth: number, oldHeight: number): void; protected onScale(newX: number, newY: number, oldX: number, oldY: number): void; protected onSkew(newX: number, newY: number, oldX: number, oldY: number): void; get type(): string; get x(): number; set x(x: DCoordinatePosition); getX(): DCoordinatePosition; setX(x: DCoordinatePosition): void; get y(): number; set y(y: DCoordinatePosition); getY(): DCoordinatePosition; setY(y: DCoordinatePosition): void; get width(): number; set width(width: DCoordinateSize); getWidth(): DCoordinateSize; setWidth(width: DCoordinateSize): void; get height(): number; set height(height: DCoordinateSize); getHeight(): DCoordinateSize; setHeight(height: DCoordinateSize): void; get position(): DBasePoint; get scale(): DBasePoint; get skew(): DBasePoint; get padding(): DPadding; get corner(): DCorner; get background(): DBackgroundStateAware; get border(): DBorderStateAware; get outline(): DOutline; get unsafe(): Transform; get title(): string; set title(title: string); protected applyTitle(): void; show(): this; isShown(): boolean; hide(): this; isHidden(): boolean; toDirty(): boolean; toHasDirty(): boolean; toParentHasDirty(): void; toHierarchyDirty(): boolean; toParentHierarchyDirty(): void; isHierarchyDirty(): boolean; protected onHierarchyDirty(): void; isDirty(): boolean; hasDirty(): boolean; protected setFocused(isFocused: boolean): this; focus(): this; blur(recursively?: boolean): this; protected onStateChange(newState: DBaseStateSet, oldState: DBaseStateSet): void; protected onChildFocus(focused: DBase): void; protected onFocus(): void; protected onChildBlur(blured: DBase): void; protected onBlur(): void; get state(): DBaseStateSet; get options(): OPTIONS | undefined; get theme(): THEME; set theme(theme: THEME); reflow(): void; protected onRefit(): void; protected isRefitable(target: any): target is DRefitable; /** * Returns true if the given target has a height that doesn't depend on its parent height. * * @param target a target * @returns true if the given target has a height that doesn't depend on its parent height. */ protected hasRefitableHeight(target: any): target is DRefitable; /** * Returns true if the given target has a width that doesn't depend on its parent width. * * @param target a target * @returns true if the given target has a width that doesn't depend on its parent width. */ protected hasRefitableWidth(target: any): target is DRefitable; protected onReflow(): void; get shadow(): DShadow | null; set shadow(shadow: DShadow | null); protected toParentResized(): void; protected getParentOfSize(): { width: number; height: number; padding: DPadding; } | null; /** * Called when a parent resized. * * @param parentWidth a parent's local width * @param parentHeight a parent's local height */ onParentResize(parentWidth: number, parentHeight: number, parentPadding: DPadding): void; /** * Called when a parent moved. * * @param newX a new parent's local x position * @param newY a new parent's local y position * @param oldX an old parent's local x position * @param oldY an old parent's local y position */ protected onParentMove(newX: number, newY: number, oldX: number, oldY: number): void; protected onWheel(e: WheelEvent, deltas: UtilWheelEventDeltas, global: Point): boolean; protected onKeyDown(e: KeyboardEvent): boolean; protected onKeyUp(e: KeyboardEvent): boolean; protected isEventTarget(e: InteractionEvent): boolean; protected onDown(e: InteractionEvent): void; protected onDownThis(e: InteractionEvent): void; protected onUp(e: InteractionEvent): void; protected onUpThis(e: InteractionEvent): void; protected focusOnClosest(): void; protected onOver(e: InteractionEvent): void; protected onOut(e: InteractionEvent): void; protected onDblClick(e: MouseEvent | TouchEvent, interactionManager: InteractionManager): boolean; render(renderer: Renderer): void; updateTransform(): void; protected getThemeDefault(): THEME; protected getType(): string; protected _calculateBounds(): void; containsPoint(point: Point): boolean; protected containsGlobalPoint(point: Point): boolean; protected containsLocalPoint(point: Point): boolean; /** * Returns a clipping rect. * * @param result a clipping rect */ getClippingRect(target: unknown, result: Rectangle): void; destroy(): void; }