primeng
Version:
PrimeNG is a premium UI library for Angular featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock,
211 lines (207 loc) • 8.91 kB
TypeScript
import { OrganizationChartPassThrough, OrgChartNode, OrganizationChartSelectionMode, OrganizationChartNodeKeys, OrganizationChartNodeSelectEvent, OrganizationChartNodeUnSelectEvent, OrganizationChartNodeExpandEvent, OrganizationChartNodeCollapseEvent } from 'primeng/types/organizationchart';
export * from 'primeng/types/organizationchart';
import * as _angular_core from '@angular/core';
import { TemplateRef } from '@angular/core';
import { BaseComponent } from 'primeng/basecomponent';
import * as i1 from 'primeng/bind';
import { Bind } from 'primeng/bind';
import { BaseStyle } from 'primeng/base';
/**
*
* OrganizationChart visualizes hierarchical organization data.
*
* [Live Demo](https://www.primeng.org/organizationchart)
*
* @module organizationchartstyle
*
*/
declare enum OrganizationChartClasses {
/**
* Class name of the root element
*/
root = "p-organizationchart",
/**
* Class name of the subtree element
*/
subtree = "p-organizationchart-subtree",
/**
* Class name of the tree element
*/
tree = "p-organizationchart-tree",
/**
* Class name of the node element
*/
node = "p-organizationchart-node",
/**
* Class name of the node content element
*/
nodeContent = "p-organizationchart-node-content",
/**
* Class name of the node label element
*/
label = "p-organizationchart-node-label",
/**
* Class name of the collapse button element
*/
collapseButton = "p-organizationchart-node-toggle-button",
/**
* Class name of the collapse button icon element
*/
collapseButtonIcon = "p-organizationchart-node-toggle-button-icon"
}
declare class OrganizationChartStyle extends BaseStyle {
name: string;
style: string;
classes: {
root: string;
subtree: ({ root }: {
root: any;
}) => (string | {
'p-organizationchart-subtree-root': any;
})[];
tree: string;
node: string;
nodeContent: string;
label: string;
collapseButton: string;
collapseButtonIcon: string;
};
static ɵfac: _angular_core.ɵɵFactoryDeclaration<OrganizationChartStyle, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<OrganizationChartStyle>;
}
interface OrganizationChartStyle extends BaseStyle {
}
/**
* OrganizationChart visualizes hierarchical organization data.
* @group Components
*/
declare class OrganizationChart extends BaseComponent<OrganizationChartPassThrough> {
componentName: string;
/**
* An array of nested OrgChartNodes.
* @group Props
*/
value: _angular_core.InputSignal<OrgChartNode<any>[] | undefined>;
/**
* Defines the selection mode.
* @group Props
*/
selectionMode: _angular_core.InputSignal<OrganizationChartSelectionMode | null | undefined>;
/**
* Whether the nodes can be expanded or toggled.
* @defaultValue false
* @group Props
*/
collapsible: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Whether the nodes can be selected when a `selectionMode` is defined. Can be overridden per node with `OrgChartNode.selectable`.
* @defaultValue true
* @group Props
*/
selectable: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Defines the gap between nodes. Can be a single number or a tuple [gapX, gapY].
* @group Props
*/
gap: _angular_core.InputSignal<number | [number, number]>;
/**
* A map of node keys whose values are `true` for the selected nodes. Two-way bindable.
* When omitted, it is seeded from each node's `selectedByDefault` flag.
* @group Props
*/
selectionKeys: _angular_core.ModelSignal<OrganizationChartNodeKeys | null>;
/**
* A map of node keys whose values are `true` for the collapsed nodes. Two-way bindable.
* When omitted, it is seeded from each node's `collapsedByDefault` flag.
* @group Props
*/
collapsedKeys: _angular_core.ModelSignal<OrganizationChartNodeKeys | null>;
/**
* Callback to invoke when a node is selected.
* @param {OrganizationChartNodeSelectEvent} event - custom node select event.
* @group Emits
*/
onNodeSelect: _angular_core.OutputEmitterRef<OrganizationChartNodeSelectEvent>;
/**
* Callback to invoke when a node is unselected.
* @param {OrganizationChartNodeUnSelectEvent} event - custom node unselect event.
* @group Emits
*/
onNodeUnselect: _angular_core.OutputEmitterRef<OrganizationChartNodeUnSelectEvent>;
/**
* Callback to invoke when a node is expanded.
* @param {OrganizationChartNodeExpandEvent} event - custom node expand event.
* @group Emits
*/
onNodeExpand: _angular_core.OutputEmitterRef<OrganizationChartNodeExpandEvent>;
/**
* Callback to invoke when a node is collapsed.
* @param {OrganizationChartNodeCollapseEvent} event - custom node collapse event.
* @group Emits
*/
onNodeCollapse: _angular_core.OutputEmitterRef<OrganizationChartNodeCollapseEvent>;
/**
* Custom toggler icon template.
* @param {Object} context - item data.
* @group Templates
*/
togglerIconTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
/**
* Custom collapse button template.
* @param {Object} context - collapse button data.
* @group Templates
*/
collapseButtonTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
/**
* Custom checkbox icon template for `checkbox` selection mode.
* @param {Object} context - checkbox icon data.
* @group Templates
*/
checkboxIconTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
/**
* Custom node template.
* @group Templates
*/
nodeTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
_componentStyle: OrganizationChartStyle;
bindDirectiveInstance: Bind;
$pcOrganizationChart: any;
/**
* The active selection map, normalized so consumers never deal with `null`.
*/
_selectionKeys: _angular_core.Signal<OrganizationChartNodeKeys>;
/**
* The active collapsed map, normalized so consumers never deal with `null`.
*/
_collapsedKeys: _angular_core.Signal<OrganizationChartNodeKeys>;
constructor();
ngAfterViewChecked(): void;
root: _angular_core.Signal<OrgChartNode<any> | null>;
gapX: _angular_core.Signal<number>;
gapY: _angular_core.Signal<number>;
getTemplateForNode(_node: OrgChartNode): TemplateRef<any> | null;
isSelected(node: OrgChartNode): boolean;
isPartialSelected(node: OrgChartNode): boolean;
isCollapsed(node: OrgChartNode): boolean;
getAriaExpanded(node: OrgChartNode): boolean | undefined;
getAriaSelected(node: OrgChartNode): boolean | undefined;
onNodeClick(event: Event, node: OrgChartNode): void;
private onCheckboxNodeClick;
private findNodeByKey;
private getDescendantKeys;
private getAncestorKeys;
onNodeToggle(event: Event, node: OrgChartNode): void;
private syncDefaultKeyState;
private flattenNodes;
private resolveCollapsedKeys;
private resolveSelectionKeys;
private isSameKeyState;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<OrganizationChart, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<OrganizationChart, "p-organization-chart, p-organizationchart", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "selectionKeys": { "alias": "selectionKeys"; "required": false; "isSignal": true; }; "collapsedKeys": { "alias": "collapsedKeys"; "required": false; "isSignal": true; }; }, { "selectionKeys": "selectionKeysChange"; "collapsedKeys": "collapsedKeysChange"; "onNodeSelect": "onNodeSelect"; "onNodeUnselect": "onNodeUnselect"; "onNodeExpand": "onNodeExpand"; "onNodeCollapse": "onNodeCollapse"; }, ["togglerIconTemplate", "collapseButtonTemplate", "checkboxIconTemplate", "nodeTemplate"], never, true, [{ directive: typeof i1.Bind; inputs: {}; outputs: {}; }]>;
}
declare class OrganizationChartModule {
static ɵfac: _angular_core.ɵɵFactoryDeclaration<OrganizationChartModule, never>;
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<OrganizationChartModule, never, [typeof OrganizationChart], [typeof OrganizationChart]>;
static ɵinj: _angular_core.ɵɵInjectorDeclaration<OrganizationChartModule>;
}
export { OrganizationChart, OrganizationChartClasses, OrganizationChartModule, OrganizationChartStyle };