angular-split
Version:
Angular UI library to split views and allow dragging to resize areas using CSS grid layout.
76 lines (75 loc) • 5.35 kB
TypeScript
import { InjectionToken } from '@angular/core';
import type { SplitAreaComponent } from '../split-area/split-area.component';
import { SplitGutterInteractionEvent, SplitAreaSize } from '../models';
import { SplitGutterDirective } from '../gutter/split-gutter.directive';
import * as i0 from "@angular/core";
export declare const SPLIT_AREA_CONTRACT: InjectionToken<SplitAreaComponent>;
export declare class SplitComponent {
private readonly document;
private readonly renderer;
private readonly elementRef;
private readonly ngZone;
private readonly defaultOptions;
private readonly gutterMouseDownSubject;
private readonly dragProgressSubject;
/**
* @internal
*/
readonly _areas: import("@angular/core").Signal<readonly SplitAreaComponent[]>;
protected readonly customGutter: import("@angular/core").Signal<SplitGutterDirective>;
readonly gutterSize: import("@angular/core").InputSignalWithTransform<number, unknown>;
readonly gutterStep: import("@angular/core").InputSignalWithTransform<number, unknown>;
readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
readonly gutterClickDeltaPx: import("@angular/core").InputSignalWithTransform<number, unknown>;
readonly direction: import("@angular/core").InputSignal<import("../models").SplitDirection>;
readonly dir: import("@angular/core").InputSignal<import("../models").SplitDir>;
readonly unit: import("@angular/core").InputSignal<import("../models").SplitUnit>;
readonly gutterAriaLabel: import("@angular/core").InputSignal<string>;
readonly restrictMove: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
readonly useTransition: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
readonly gutterDblClickDuration: import("@angular/core").InputSignalWithTransform<number, unknown>;
readonly gutterClick: import("@angular/core").OutputEmitterRef<SplitGutterInteractionEvent>;
readonly gutterDblClick: import("@angular/core").OutputEmitterRef<SplitGutterInteractionEvent>;
readonly dragStart: import("@angular/core").OutputEmitterRef<SplitGutterInteractionEvent>;
readonly dragEnd: import("@angular/core").OutputEmitterRef<SplitGutterInteractionEvent>;
readonly transitionEnd: import("@angular/core").OutputEmitterRef<SplitAreaSize[]>;
readonly dragProgress$: import("rxjs").Observable<SplitGutterInteractionEvent>;
/**
* @internal
*/
readonly _visibleAreas: import("@angular/core").Signal<SplitAreaComponent[]>;
private readonly gridTemplateColumnsStyle;
private readonly hostClasses;
protected readonly draggedGutterIndex: import("@angular/core").WritableSignal<number>;
/**
* @internal
*/
readonly _isDragging: import("@angular/core").Signal<boolean>;
/**
* @internal
* Should only be used by {@link SplitAreaComponent._internalSize}
*/
readonly _alignedVisibleAreasSizes: import("@angular/core").Signal<SplitAreaSize[]>;
protected get hostClassesBinding(): string;
protected get hostDirBinding(): import("../models").SplitDir;
constructor();
protected gutterClicked(gutterIndex: number): void;
protected gutterDoubleClicked(gutterIndex: number): void;
protected gutterMouseDown(e: MouseEvent | TouchEvent, gutterElement: HTMLElement, gutterIndex: number, areaBeforeGutterIndex: number, areaAfterGutterIndex: number): void;
protected gutterKeyDown(e: KeyboardEvent, gutterIndex: number, areaBeforeGutterIndex: number, areaAfterGutterIndex: number): void;
protected getGutterGridStyle(nextAreaIndex: number): {
"grid-column": string;
"grid-row": string;
};
protected getAriaAreaSizeText(area: SplitAreaComponent): string;
protected getAriaValue(size: SplitAreaSize): number;
private createDragInteractionEvent;
private createAreaSizes;
private createDragStartContext;
private mouseDragMove;
private dragMoveToPoint;
private createGridTemplateColumnsStyle;
private createAlignedVisibleAreasSize;
static ɵfac: i0.ɵɵFactoryDeclaration<SplitComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<SplitComponent, "as-split", ["asSplit"], { "gutterSize": { "alias": "gutterSize"; "required": false; "isSignal": true; }; "gutterStep": { "alias": "gutterStep"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "gutterClickDeltaPx": { "alias": "gutterClickDeltaPx"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "unit": { "alias": "unit"; "required": false; "isSignal": true; }; "gutterAriaLabel": { "alias": "gutterAriaLabel"; "required": false; "isSignal": true; }; "restrictMove": { "alias": "restrictMove"; "required": false; "isSignal": true; }; "useTransition": { "alias": "useTransition"; "required": false; "isSignal": true; }; "gutterDblClickDuration": { "alias": "gutterDblClickDuration"; "required": false; "isSignal": true; }; }, { "gutterClick": "gutterClick"; "gutterDblClick": "gutterDblClick"; "dragStart": "dragStart"; "dragEnd": "dragEnd"; "transitionEnd": "transitionEnd"; }, ["_areas", "customGutter"], ["*"], true, never>;
}