mirror of
https://github.com/Combodo/iTop.git
synced 2026-02-27 06:04:12 +01:00
N°8641 - Dashboard editor front-end first commit for Form SDK integration.
* No dashlet edition * Dashboard are not persisted * Unable to load a dashboard from an endpoint (refresh) * Grid library need proper npm integration
This commit is contained in:
Stephen Abello
55
node_modules/gridstack/dist/angular/lib/base-widget.d.ts
generated
vendored
Normal file
55
node_modules/gridstack/dist/angular/lib/base-widget.d.ts
generated
vendored
Normal file
@@ -0,0 +1,55 @@
|
||||
import { NgCompInputs, NgGridStackWidget } from './types';
|
||||
import * as i0 from "@angular/core";
|
||||
/**
|
||||
* Base widget class for GridStack Angular integration.
|
||||
*/
|
||||
export declare abstract class BaseWidget {
|
||||
/**
|
||||
* Complete widget definition including position, size, and Angular-specific data.
|
||||
* Populated automatically when the widget is loaded or saved.
|
||||
*/
|
||||
widgetItem?: NgGridStackWidget;
|
||||
/**
|
||||
* Override this method to return serializable data for this widget.
|
||||
*
|
||||
* Return an object with properties that map to your component's @Input() fields.
|
||||
* The selector is handled automatically, so only include component-specific data.
|
||||
*
|
||||
* @returns Object containing serializable component data
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* serialize() {
|
||||
* return {
|
||||
* title: this.title,
|
||||
* value: this.value,
|
||||
* settings: this.settings
|
||||
* };
|
||||
* }
|
||||
* ```
|
||||
*/
|
||||
serialize(): NgCompInputs | undefined;
|
||||
/**
|
||||
* Override this method to handle widget restoration from saved data.
|
||||
*
|
||||
* Use this for complex initialization that goes beyond simple @Input() mapping.
|
||||
* The default implementation automatically assigns input data to component properties.
|
||||
*
|
||||
* @param w The saved widget data including input properties
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* deserialize(w: NgGridStackWidget) {
|
||||
* super.deserialize(w); // Call parent for basic setup
|
||||
*
|
||||
* // Custom initialization logic
|
||||
* if (w.input?.complexData) {
|
||||
* this.processComplexData(w.input.complexData);
|
||||
* }
|
||||
* }
|
||||
* ```
|
||||
*/
|
||||
deserialize(w: NgGridStackWidget): void;
|
||||
static ɵfac: i0.ɵɵFactoryDeclaration<BaseWidget, never>;
|
||||
static ɵprov: i0.ɵɵInjectableDeclaration<BaseWidget>;
|
||||
}
|
||||
79
node_modules/gridstack/dist/angular/lib/gridstack-item.component.d.ts
generated
vendored
Normal file
79
node_modules/gridstack/dist/angular/lib/gridstack-item.component.d.ts
generated
vendored
Normal file
@@ -0,0 +1,79 @@
|
||||
/**
|
||||
* gridstack-item.component.ts 12.3.3
|
||||
* Copyright (c) 2022-2024 Alain Dumesny - see GridStack root license
|
||||
*/
|
||||
import { ElementRef, ViewContainerRef, OnDestroy, ComponentRef } from '@angular/core';
|
||||
import { GridItemHTMLElement, GridStackNode } from 'gridstack';
|
||||
import { BaseWidget } from './base-widget';
|
||||
import * as i0 from "@angular/core";
|
||||
/**
|
||||
* Extended HTMLElement interface for grid items.
|
||||
* Stores a back-reference to the Angular component for integration.
|
||||
*/
|
||||
export interface GridItemCompHTMLElement extends GridItemHTMLElement {
|
||||
/** Back-reference to the Angular GridStackItem component */
|
||||
_gridItemComp?: GridstackItemComponent;
|
||||
}
|
||||
/**
|
||||
* Angular component wrapper for individual GridStack items.
|
||||
*
|
||||
* This component represents a single grid item and handles:
|
||||
* - Dynamic content creation and management
|
||||
* - Integration with parent GridStack component
|
||||
* - Component lifecycle and cleanup
|
||||
* - Widget options and configuration
|
||||
*
|
||||
* Use in combination with GridstackComponent for the parent grid.
|
||||
*
|
||||
* @example
|
||||
* ```html
|
||||
* <gridstack>
|
||||
* <gridstack-item [options]="{x: 0, y: 0, w: 2, h: 1}">
|
||||
* <my-widget-component></my-widget-component>
|
||||
* </gridstack-item>
|
||||
* </gridstack>
|
||||
* ```
|
||||
*/
|
||||
export declare class GridstackItemComponent implements OnDestroy {
|
||||
protected readonly elementRef: ElementRef<GridItemCompHTMLElement>;
|
||||
/**
|
||||
* Container for dynamic component creation within this grid item.
|
||||
* Used to append child components programmatically.
|
||||
*/
|
||||
container?: ViewContainerRef;
|
||||
/**
|
||||
* Component reference for dynamic component removal.
|
||||
* Used internally when this component is created dynamically.
|
||||
*/
|
||||
ref: ComponentRef<GridstackItemComponent> | undefined;
|
||||
/**
|
||||
* Reference to child widget component for serialization.
|
||||
* Used to save/restore additional data along with grid position.
|
||||
*/
|
||||
childWidget: BaseWidget | undefined;
|
||||
/**
|
||||
* Grid item configuration options.
|
||||
* Defines position, size, and behavior of this grid item.
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* itemOptions: GridStackNode = {
|
||||
* x: 0, y: 0, w: 2, h: 1,
|
||||
* noResize: true,
|
||||
* content: 'Item content'
|
||||
* };
|
||||
* ```
|
||||
*/
|
||||
set options(val: GridStackNode);
|
||||
/** return the latest grid options (from GS once built, otherwise initial values) */
|
||||
get options(): GridStackNode;
|
||||
protected _options?: GridStackNode;
|
||||
/** return the native element that contains grid specific fields as well */
|
||||
get el(): GridItemCompHTMLElement;
|
||||
/** clears the initial options now that we've built */
|
||||
clearOptions(): void;
|
||||
constructor(elementRef: ElementRef<GridItemCompHTMLElement>);
|
||||
ngOnDestroy(): void;
|
||||
static ɵfac: i0.ɵɵFactoryDeclaration<GridstackItemComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDeclaration<GridstackItemComponent, "gridstack-item", never, { "options": "options"; }, {}, never, ["*"], true>;
|
||||
}
|
||||
236
node_modules/gridstack/dist/angular/lib/gridstack.component.d.ts
generated
vendored
Normal file
236
node_modules/gridstack/dist/angular/lib/gridstack.component.d.ts
generated
vendored
Normal file
@@ -0,0 +1,236 @@
|
||||
/**
|
||||
* gridstack.component.ts 12.3.3
|
||||
* Copyright (c) 2022-2024 Alain Dumesny - see GridStack root license
|
||||
*/
|
||||
import { AfterContentInit, ElementRef, EventEmitter, OnDestroy, OnInit, QueryList, Type, ViewContainerRef, ComponentRef } from '@angular/core';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { GridHTMLElement, GridItemHTMLElement, GridStack, GridStackNode, GridStackOptions } from 'gridstack';
|
||||
import { NgGridStackNode, NgGridStackWidget } from './types';
|
||||
import { GridstackItemComponent } from './gridstack-item.component';
|
||||
import * as i0 from "@angular/core";
|
||||
/**
|
||||
* Event handler callback signatures for different GridStack events.
|
||||
* These types define the structure of data passed to Angular event emitters.
|
||||
*/
|
||||
/** Callback for general events (enable, disable, etc.) */
|
||||
export declare type eventCB = {
|
||||
event: Event;
|
||||
};
|
||||
/** Callback for element-specific events (resize, drag, etc.) */
|
||||
export declare type elementCB = {
|
||||
event: Event;
|
||||
el: GridItemHTMLElement;
|
||||
};
|
||||
/** Callback for events affecting multiple nodes (change, etc.) */
|
||||
export declare type nodesCB = {
|
||||
event: Event;
|
||||
nodes: GridStackNode[];
|
||||
};
|
||||
/** Callback for drop events with before/after node state */
|
||||
export declare type droppedCB = {
|
||||
event: Event;
|
||||
previousNode: GridStackNode;
|
||||
newNode: GridStackNode;
|
||||
};
|
||||
/**
|
||||
* Extended HTMLElement interface for the grid container.
|
||||
* Stores a back-reference to the Angular component for integration purposes.
|
||||
*/
|
||||
export interface GridCompHTMLElement extends GridHTMLElement {
|
||||
/** Back-reference to the Angular GridStack component */
|
||||
_gridComp?: GridstackComponent;
|
||||
}
|
||||
/**
|
||||
* Mapping of selector strings to Angular component types.
|
||||
* Used for dynamic component creation based on widget selectors.
|
||||
*/
|
||||
export declare type SelectorToType = {
|
||||
[key: string]: Type<Object>;
|
||||
};
|
||||
/**
|
||||
* Angular component wrapper for GridStack.
|
||||
*
|
||||
* This component provides Angular integration for GridStack grids, handling:
|
||||
* - Grid initialization and lifecycle
|
||||
* - Dynamic component creation and management
|
||||
* - Event binding and emission
|
||||
* - Integration with Angular change detection
|
||||
*
|
||||
* Use in combination with GridstackItemComponent for individual grid items.
|
||||
*
|
||||
* @example
|
||||
* ```html
|
||||
* <gridstack [options]="gridOptions" (change)="onGridChange($event)">
|
||||
* <div empty-content>Drag widgets here</div>
|
||||
* </gridstack>
|
||||
* ```
|
||||
*/
|
||||
export declare class GridstackComponent implements OnInit, AfterContentInit, OnDestroy {
|
||||
protected readonly elementRef: ElementRef<GridCompHTMLElement>;
|
||||
/**
|
||||
* List of template-based grid items (not recommended approach).
|
||||
* Used to sync between DOM and GridStack internals when items are defined in templates.
|
||||
* Prefer dynamic component creation instead.
|
||||
*/
|
||||
gridstackItems?: QueryList<GridstackItemComponent>;
|
||||
/**
|
||||
* Container for dynamic component creation (recommended approach).
|
||||
* Used to append grid items programmatically at runtime.
|
||||
*/
|
||||
container?: ViewContainerRef;
|
||||
/**
|
||||
* Grid configuration options.
|
||||
* Can be set before grid initialization or updated after grid is created.
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* gridOptions: GridStackOptions = {
|
||||
* column: 12,
|
||||
* cellHeight: 'auto',
|
||||
* animate: true
|
||||
* };
|
||||
* ```
|
||||
*/
|
||||
set options(o: GridStackOptions);
|
||||
/** Get the current running grid options */
|
||||
get options(): GridStackOptions;
|
||||
/**
|
||||
* Controls whether empty content should be displayed.
|
||||
* Set to true to show ng-content with 'empty-content' selector when grid has no items.
|
||||
*
|
||||
* @example
|
||||
* ```html
|
||||
* <gridstack [isEmpty]="gridItems.length === 0">
|
||||
* <div empty-content>Drag widgets here to get started</div>
|
||||
* </gridstack>
|
||||
* ```
|
||||
*/
|
||||
isEmpty?: boolean;
|
||||
/**
|
||||
* GridStack event emitters for Angular integration.
|
||||
*
|
||||
* These provide Angular-style event handling for GridStack events.
|
||||
* Alternatively, use `this.grid.on('event1 event2', callback)` for multiple events.
|
||||
*
|
||||
* Note: 'CB' suffix prevents conflicts with native DOM events.
|
||||
*
|
||||
* @example
|
||||
* ```html
|
||||
* <gridstack (changeCB)="onGridChange($event)" (droppedCB)="onItemDropped($event)">
|
||||
* </gridstack>
|
||||
* ```
|
||||
*/
|
||||
/** Emitted when widgets are added to the grid */
|
||||
addedCB: EventEmitter<nodesCB>;
|
||||
/** Emitted when grid layout changes */
|
||||
changeCB: EventEmitter<nodesCB>;
|
||||
/** Emitted when grid is disabled */
|
||||
disableCB: EventEmitter<eventCB>;
|
||||
/** Emitted during widget drag operations */
|
||||
dragCB: EventEmitter<elementCB>;
|
||||
/** Emitted when widget drag starts */
|
||||
dragStartCB: EventEmitter<elementCB>;
|
||||
/** Emitted when widget drag stops */
|
||||
dragStopCB: EventEmitter<elementCB>;
|
||||
/** Emitted when widget is dropped */
|
||||
droppedCB: EventEmitter<droppedCB>;
|
||||
/** Emitted when grid is enabled */
|
||||
enableCB: EventEmitter<eventCB>;
|
||||
/** Emitted when widgets are removed from the grid */
|
||||
removedCB: EventEmitter<nodesCB>;
|
||||
/** Emitted during widget resize operations */
|
||||
resizeCB: EventEmitter<elementCB>;
|
||||
/** Emitted when widget resize starts */
|
||||
resizeStartCB: EventEmitter<elementCB>;
|
||||
/** Emitted when widget resize stops */
|
||||
resizeStopCB: EventEmitter<elementCB>;
|
||||
/**
|
||||
* Get the native DOM element that contains grid-specific fields.
|
||||
* This element has GridStack properties attached to it.
|
||||
*/
|
||||
get el(): GridCompHTMLElement;
|
||||
/**
|
||||
* Get the underlying GridStack instance.
|
||||
* Use this to access GridStack API methods directly.
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* this.gridComponent.grid.addWidget({x: 0, y: 0, w: 2, h: 1});
|
||||
* ```
|
||||
*/
|
||||
get grid(): GridStack | undefined;
|
||||
/**
|
||||
* Component reference for dynamic component removal.
|
||||
* Used internally when this component is created dynamically.
|
||||
*/
|
||||
ref: ComponentRef<GridstackComponent> | undefined;
|
||||
/**
|
||||
* Mapping of component selectors to their types for dynamic creation.
|
||||
*
|
||||
* This enables dynamic component instantiation from string selectors.
|
||||
* Angular doesn't provide public access to this mapping, so we maintain our own.
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* GridstackComponent.addComponentToSelectorType([MyWidgetComponent]);
|
||||
* ```
|
||||
*/
|
||||
static selectorToType: SelectorToType;
|
||||
/**
|
||||
* Register a list of Angular components for dynamic creation.
|
||||
*
|
||||
* @param typeList Array of component types to register
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* GridstackComponent.addComponentToSelectorType([
|
||||
* MyWidgetComponent,
|
||||
* AnotherWidgetComponent
|
||||
* ]);
|
||||
* ```
|
||||
*/
|
||||
static addComponentToSelectorType(typeList: Array<Type<Object>>): void;
|
||||
/**
|
||||
* Extract the selector string from an Angular component type.
|
||||
*
|
||||
* @param type The component type to get selector from
|
||||
* @returns The component's selector string
|
||||
*/
|
||||
static getSelector(type: Type<Object>): string;
|
||||
protected _options?: GridStackOptions;
|
||||
protected _grid?: GridStack;
|
||||
protected _sub: Subscription | undefined;
|
||||
protected loaded?: boolean;
|
||||
constructor(elementRef: ElementRef<GridCompHTMLElement>);
|
||||
ngOnInit(): void;
|
||||
/** wait until after all DOM is ready to init gridstack children (after angular ngFor and sub-components run first) */
|
||||
ngAfterContentInit(): void;
|
||||
ngOnDestroy(): void;
|
||||
/**
|
||||
* called when the TEMPLATE (not recommended) list of items changes - get a list of nodes and
|
||||
* update the layout accordingly (which will take care of adding/removing items changed by Angular)
|
||||
*/
|
||||
updateAll(): void;
|
||||
/** check if the grid is empty, if so show alternative content */
|
||||
checkEmpty(): void;
|
||||
/** get all known events as easy to use Outputs for convenience */
|
||||
protected hookEvents(grid?: GridStack): void;
|
||||
protected unhookEvents(grid?: GridStack): void;
|
||||
static ɵfac: i0.ɵɵFactoryDeclaration<GridstackComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDeclaration<GridstackComponent, "gridstack", never, { "options": "options"; "isEmpty": "isEmpty"; }, { "addedCB": "addedCB"; "changeCB": "changeCB"; "disableCB": "disableCB"; "dragCB": "dragCB"; "dragStartCB": "dragStartCB"; "dragStopCB": "dragStopCB"; "droppedCB": "droppedCB"; "enableCB": "enableCB"; "removedCB": "removedCB"; "resizeCB": "resizeCB"; "resizeStartCB": "resizeStartCB"; "resizeStopCB": "resizeStopCB"; }, ["gridstackItems"], ["[empty-content]", "*"], true>;
|
||||
}
|
||||
/**
|
||||
* can be used when a new item needs to be created, which we do as a Angular component, or deleted (skip)
|
||||
**/
|
||||
export declare function gsCreateNgComponents(host: GridCompHTMLElement | HTMLElement, n: NgGridStackNode, add: boolean, isGrid: boolean): HTMLElement | undefined;
|
||||
/**
|
||||
* called for each item in the grid - check if additional information needs to be saved.
|
||||
* Note: since this is options minus gridstack protected members using Utils.removeInternalForSave(),
|
||||
* this typically doesn't need to do anything. However your custom Component @Input() are now supported
|
||||
* using BaseWidget.serialize()
|
||||
*/
|
||||
export declare function gsSaveAdditionalNgInfo(n: NgGridStackNode, w: NgGridStackWidget): void;
|
||||
/**
|
||||
* track when widgeta re updated (rather than created) to make sure we de-serialize them as well
|
||||
*/
|
||||
export declare function gsUpdateNgComponents(n: NgGridStackNode): void;
|
||||
31
node_modules/gridstack/dist/angular/lib/gridstack.module.d.ts
generated
vendored
Normal file
31
node_modules/gridstack/dist/angular/lib/gridstack.module.d.ts
generated
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
import * as i0 from "@angular/core";
|
||||
import * as i1 from "./gridstack-item.component";
|
||||
import * as i2 from "./gridstack.component";
|
||||
/**
|
||||
* @deprecated Use GridstackComponent and GridstackItemComponent as standalone components instead.
|
||||
*
|
||||
* This NgModule is provided for backward compatibility but is no longer the recommended approach.
|
||||
* Import components directly in your standalone components or use the new Angular module structure.
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* // Preferred approach - standalone components
|
||||
* @Component({
|
||||
* selector: 'my-app',
|
||||
* imports: [GridstackComponent, GridstackItemComponent],
|
||||
* template: '<gridstack></gridstack>'
|
||||
* })
|
||||
* export class AppComponent {}
|
||||
*
|
||||
* // Legacy approach (deprecated)
|
||||
* @NgModule({
|
||||
* imports: [GridstackModule]
|
||||
* })
|
||||
* export class AppModule {}
|
||||
* ```
|
||||
*/
|
||||
export declare class GridstackModule {
|
||||
static ɵfac: i0.ɵɵFactoryDeclaration<GridstackModule, never>;
|
||||
static ɵmod: i0.ɵɵNgModuleDeclaration<GridstackModule, never, [typeof i1.GridstackItemComponent, typeof i2.GridstackComponent], [typeof i1.GridstackItemComponent, typeof i2.GridstackComponent]>;
|
||||
static ɵinj: i0.ɵɵInjectorDeclaration<GridstackModule>;
|
||||
}
|
||||
51
node_modules/gridstack/dist/angular/lib/types.d.ts
generated
vendored
Normal file
51
node_modules/gridstack/dist/angular/lib/types.d.ts
generated
vendored
Normal file
@@ -0,0 +1,51 @@
|
||||
/**
|
||||
* gridstack-item.component.ts 12.3.3
|
||||
* Copyright (c) 2025 Alain Dumesny - see GridStack root license
|
||||
*/
|
||||
import { GridStackNode, GridStackOptions, GridStackWidget } from "gridstack";
|
||||
/**
|
||||
* Extended GridStackWidget interface for Angular integration.
|
||||
* Adds Angular-specific properties for dynamic component creation.
|
||||
*/
|
||||
export interface NgGridStackWidget extends GridStackWidget {
|
||||
/** Angular component selector for dynamic creation (e.g., 'my-widget') */
|
||||
selector?: string;
|
||||
/** Serialized data for component @Input() properties */
|
||||
input?: NgCompInputs;
|
||||
/** Configuration for nested sub-grids */
|
||||
subGridOpts?: NgGridStackOptions;
|
||||
}
|
||||
/**
|
||||
* Extended GridStackNode interface for Angular integration.
|
||||
* Adds component selector for dynamic content creation.
|
||||
*/
|
||||
export interface NgGridStackNode extends GridStackNode {
|
||||
/** Angular component selector for this node's content */
|
||||
selector?: string;
|
||||
}
|
||||
/**
|
||||
* Extended GridStackOptions interface for Angular integration.
|
||||
* Supports Angular-specific widget definitions and nested grids.
|
||||
*/
|
||||
export interface NgGridStackOptions extends GridStackOptions {
|
||||
/** Array of Angular widget definitions for initial grid setup */
|
||||
children?: NgGridStackWidget[];
|
||||
/** Configuration for nested sub-grids (Angular-aware) */
|
||||
subGridOpts?: NgGridStackOptions;
|
||||
}
|
||||
/**
|
||||
* Type for component input data serialization.
|
||||
* Maps @Input() property names to their values for widget persistence.
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* const inputs: NgCompInputs = {
|
||||
* title: 'My Widget',
|
||||
* value: 42,
|
||||
* config: { enabled: true }
|
||||
* };
|
||||
* ```
|
||||
*/
|
||||
export declare type NgCompInputs = {
|
||||
[key: string]: any;
|
||||
};
|
||||
Reference in New Issue
Block a user