@ux-aspects/ux-aspects/components/partition-map/partition-map.component.d.ts

Open source user interface framework for building modern, responsive, mobile big data applications

import { EventEmitter, OnDestroy, OnInit, TemplateRef } from '@angular/core';
import { HierarchyRectangularNode } from 'd3';
import { ThemeColor } from '../../services/color/index';
import * as i0 from "@angular/core";
export declare class PartitionMapComponent implements OnInit, OnDestroy {
    private readonly _colorService;
    private readonly _elementRef;
    private readonly _changeDetector;
    private readonly _ngZone;
    private readonly _focusOrigin;
    private readonly _contrastRatio;
    private readonly _liveAnnouncer;
    private readonly _resizeService;
    private _segmentCache;
    /** Define the colors to be used for each row and the order they should appear. */
    set colors(colors: (string | ThemeColor)[][]);
    /** Determine the pixel height of collapsed segments. */
    collapsedHeight: number;
    /** Define a minimum desired pixel width for a segment. */
    minSegmentWidth: number;
    /** Define the dataset to display in the chart. */
    set dataset(dataset: Readonly<PartitionMapSegment>);
    get dataset(): Readonly<PartitionMapSegment>;
    /** Define the currently selected item. */
    set selected(selected: PartitionMapSegment);
    /** Define the function that will return the aria announcement for a given segment. */
    segmentAnnouncement: (info: PartitionMapSegmentAnnouncementInfo) => string;
    /** Emits whenever a segment is selected. */
    selectedChange: EventEmitter<PartitionMapSegment>;
    /** Access a if provided custom template */
    segmentTemplate: TemplateRef<PartitionMapCustomSegmentContext>;
    /** Store the processed segments */
    _segments: HierarchyRectangularNode<PartitionMapSegment>[];
    /** Store the current dataset */
    private _dataset;
    /** Store the specified color sequences */
    private _colors;
    /** Store the currently selected segment */
    private _selected;
    /** Store the assigned colors for each segment */
    private readonly _segmentColors;
    /** Store the visible x scale */
    private readonly _x;
    /** Store the visible y scale */
    private readonly _y;
    /** Store the visible d3 segments */
    private _segmentsSelection;
    /** Store the current focusable segment */
    private _focusableSegment;
    /** Store an item awaiting selection */
    private _awaitingSelection;
    /** Store the width of the chart on resize to avoid any reflow */
    private _width;
    /** Store the height of the chart on resize to avoid any reflow */
    private _height;
    /** Flag to determine when the inputs have all been bound */
    private _initialized;
    /** Unsubscribe from any observables on destroy */
    private readonly _onDestroy;
    ngOnInit(): void;
    ngOnDestroy(): void;
    /** Handle segment clicks */
    _onSegmentSelect(segment: HierarchyRectangularNode<PartitionMapSegment>): void;
    /** Get the background color for a given segment */
    _getBackgroundColor(segment: HierarchyRectangularNode<PartitionMapSegment>): string;
    /** Get the tab index of a segment */
    _getTabIndex(segment: HierarchyRectangularNode<PartitionMapSegment>): number;
    /** Shift focus to the parent segment */
    _focusParent(segment: HierarchyRectangularNode<PartitionMapSegment>): void;
    /** Shift focus to the child segment */
    _focusChild(segment: HierarchyRectangularNode<PartitionMapSegment>): void;
    /** Shift focus to the sibling segment */
    _focusSibling(segment: HierarchyRectangularNode<PartitionMapSegment>, delta: number): void;
    _focusFirstSibling(segment: HierarchyRectangularNode<PartitionMapSegment>): void;
    _focusLastSibling(segment: HierarchyRectangularNode<PartitionMapSegment>): void;
    /** Determine if a given segment is currently collapsed */
    _isCollapsed(segment: HierarchyRectangularNode<PartitionMapSegment>): boolean;
    /** Determine if a given segment is currently selected */
    _isSelected(segment: HierarchyRectangularNode<PartitionMapSegment>): boolean;
    /** Get the contast color class for the segment */
    _getContrastColor(segment: HierarchyRectangularNode<PartitionMapSegment>): string;
    /** Provide an aria announcement when the node is focused */
    _onFocus(segment: HierarchyRectangularNode<PartitionMapSegment>): void;
    /** Determine if the content is smaller than the width of an ellipsis */
    _getSegmentContentHidden(segment: HierarchyRectangularNode<PartitionMapSegment>): boolean;
    /** Get the value of a segment based on the accumulation of all child values */
    _getSegmentValue(segment: PartitionMapSegment): number;
    _getContext(segment: HierarchyRectangularNode<PartitionMapSegment>): PartitionMapCustomSegmentContext;
    trackByIndex(index: number): number;
    /** Convert the public facing data structure into the layout format we require */
    private setDataset;
    /** Update the size and position of the segments */
    private updateSegments;
    private cacheSegment;
    private getSegmentCache;
    /**
     * Get the X position of a given segment. The X position can be determined
     * by calculating the width of every sibling segment to the left of it
     */
    private getSegmentX;
    /** Calculate width based of each segment */
    private getSegmentWidth;
    /** Return the X position of the segment in a normalized form based on the specifiec domain */
    private getNormalizedSegmentX;
    /** Return the Y position of the segment in a normalized form based on the specifiec domain */
    private getNormalizedSegmentY;
    /** Return the width of the segment in a normalized form based on the specifiec domain */
    private getNormalizedSegmentWidth;
    /** Return the height of the segment in a normalized form based on the specifiec domain */
    private getNormalizedSegmentHeight;
    /**
     * As parent segments collapse they increase in size, as the content is centered this can
     * cause the content to appear either mis-aligned or off screen. We can calculate the padding
     * required to always ensure the content appears visibly centered within the node.
     */
    private getSegmentPaddingRight;
    private getSegmentPaddingLeft;
    /**
     * This function returns the value for each segment. Leaf segments will have a value property which we can simply return, however
     * non-leaf segments should get their values based on the leaf segments that are children, in which case we can return 0
     */
    private getSegmentValue;
    /** Get the total height of all the collapse rows */
    private getTotalCollapsedHeight;
    /** Get the collapsed height in percentage format */
    private getCollapsedHeight;
    /** Determine if a given segment is currently visible based on the selected segment */
    private isVisible;
    /** Update the focusable item and perform a focus */
    private focusSegment;
    /** Get all the segments at a given depth */
    private getAllSiblings;
    private getHierarchyNodeFromSegment;
    /** Select a specified segment */
    private select;
    /** Normalize the available colors to a string[][] from portentially a ThemeColor[][] */
    private getColorSequence;
    /** Determine if a segment is a descendant of the currently selected item */
    private isDescendantOfSelected;
    /**
     * We have an option to allow a minimum desired width for items. This will
     * allow us to attempt to determine the size a segment would be accounting for very
     * small segments that have their widths artifically increased to make them more visible
     */
    private getDistributionModifier;
    /** Get the default announcement when a segment is focused */
    private defaultSegmentAnnouncement;
    static ɵfac: i0.ɵɵFactoryDeclaration<PartitionMapComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<PartitionMapComponent, "ux-partition-map", never, { "colors": { "alias": "colors"; "required": false; }; "collapsedHeight": { "alias": "collapsedHeight"; "required": false; }; "minSegmentWidth": { "alias": "minSegmentWidth"; "required": false; }; "dataset": { "alias": "dataset"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "segmentAnnouncement": { "alias": "segmentAnnouncement"; "required": false; }; }, { "selectedChange": "selectedChange"; }, ["segmentTemplate"], never, false, never>;
}
export interface PartitionMapSegmentBase {
    name: string;
    data?: {
        [key: string]: any;
    };
}
export interface PartitionMapSegmentWithChildren extends PartitionMapSegmentBase {
    children: ReadonlyArray<PartitionMapSegment>;
}
export interface PartitionMapSegmentWithValue extends PartitionMapSegmentBase {
    value: number;
}
/** This union type allows us to ensure that a partition map segment has either children or a value */
export type PartitionMapSegment = PartitionMapSegmentWithChildren | PartitionMapSegmentWithValue;
/** Partition map custom segment template context */
export interface PartitionMapCustomSegmentContext {
    segment: PartitionMapSegment;
    color: string;
    value: number;
    expanded: boolean;
    depth: number;
    children: PartitionMapCustomSegmentContext[];
}
/** An object of this interface is passed to the announcer function */
export interface PartitionMapSegmentAnnouncementInfo {
    item: PartitionMapSegment;
    value: number;
    parents: PartitionMapSegment[];
    collapsed: boolean;
    selected: boolean;
}