@visuallyjs/browser-ui-angular 1.2.6 → 1.2.8

package/index.d.ts

@@ -47,3 +47,5 @@ export * from './lib/background.component';
 export * from './lib/image-background.component';
 export * from './lib/tiled-image-background.component';
 export * from './lib/grid-background.component';
+export * from './lib/edge.property.mappings.inspector.component';
+export * from './lib/shape-properties-inspector.component';

package/lib/browser-ui-angular.module.d.ts

@@ -29,7 +29,9 @@ import * as i27 from "./background.component";
 import * as i28 from "./image-background.component";
 import * as i29 from "./grid-background.component";
 import * as i30 from "./tiled-image-background.component";
-import * as i31 from "@angular/common";
+import * as i31 from "./edge.property.mappings.inspector.component";
+import * as i32 from "./shape-properties-inspector.component";
+import * as i33 from "@angular/common";
 /**
  * VisuallyJs Angular module.
  *
@@ -65,6 +67,6 @@ import * as i31 from "@angular/common";
  */
 export declare class VisuallyJsModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<VisuallyJsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<VisuallyJsModule, [typeof i1.DefaultNodeComponent, typeof i2.DefaultGroupComponent, typeof i3.BasePortComponent, typeof i4.MiniviewComponent, typeof i5.SurfaceComponent, typeof i6.PaperComponent, typeof i7.PaletteComponent, typeof i8.ShapePaletteComponent, typeof i9.DiagramPaletteComponent, typeof i10.ShapeComponent, typeof i11.ControlsComponent, typeof i12.EdgeTypePickerComponent, typeof i7.PaletteComponent, typeof i13.ExportControlsComponent, typeof i14.ColorPickerComponent, typeof i15.DiagramComponent, typeof i16.ColumnChartComponent, typeof i17.BarChartComponent, typeof i18.XYChartComponent, typeof i19.LineChartComponent, typeof i20.AreaChartComponent, typeof i21.PieChartComponent, typeof i22.ScatterChartComponent, typeof i23.BubbleChartComponent, typeof i24.SankeyChartComponent, typeof i25.DecoratorComponent, typeof i26.SurfacePopupComponent, typeof i27.BackgroundComponent, typeof i28.ImageBackgroundComponent, typeof i29.GridBackgroundComponent, typeof i30.TiledImageBackgroundComponent], [typeof i31.CommonModule], [typeof i4.MiniviewComponent, typeof i5.SurfaceComponent, typeof i6.PaperComponent, typeof i7.PaletteComponent, typeof i9.DiagramPaletteComponent, typeof i10.ShapeComponent, typeof i8.ShapePaletteComponent, typeof i11.ControlsComponent, typeof i13.ExportControlsComponent, typeof i12.EdgeTypePickerComponent, typeof i14.ColorPickerComponent, typeof i15.DiagramComponent, typeof i16.ColumnChartComponent, typeof i17.BarChartComponent, typeof i18.XYChartComponent, typeof i19.LineChartComponent, typeof i20.AreaChartComponent, typeof i21.PieChartComponent, typeof i22.ScatterChartComponent, typeof i23.BubbleChartComponent, typeof i24.SankeyChartComponent, typeof i25.DecoratorComponent, typeof i26.SurfacePopupComponent, typeof i27.BackgroundComponent, typeof i28.ImageBackgroundComponent, typeof i29.GridBackgroundComponent, typeof i30.TiledImageBackgroundComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<VisuallyJsModule, [typeof i1.DefaultNodeComponent, typeof i2.DefaultGroupComponent, typeof i3.BasePortComponent, typeof i4.MiniviewComponent, typeof i5.SurfaceComponent, typeof i6.PaperComponent, typeof i7.PaletteComponent, typeof i8.ShapePaletteComponent, typeof i9.DiagramPaletteComponent, typeof i10.ShapeComponent, typeof i11.ControlsComponent, typeof i12.EdgeTypePickerComponent, typeof i7.PaletteComponent, typeof i13.ExportControlsComponent, typeof i14.ColorPickerComponent, typeof i15.DiagramComponent, typeof i16.ColumnChartComponent, typeof i17.BarChartComponent, typeof i18.XYChartComponent, typeof i19.LineChartComponent, typeof i20.AreaChartComponent, typeof i21.PieChartComponent, typeof i22.ScatterChartComponent, typeof i23.BubbleChartComponent, typeof i24.SankeyChartComponent, typeof i25.DecoratorComponent, typeof i26.SurfacePopupComponent, typeof i27.BackgroundComponent, typeof i28.ImageBackgroundComponent, typeof i29.GridBackgroundComponent, typeof i30.TiledImageBackgroundComponent, typeof i31.EdgePropertyMappingsInspectorComponent, typeof i32.ShapePropertiesInspectorComponent], [typeof i33.CommonModule], [typeof i4.MiniviewComponent, typeof i5.SurfaceComponent, typeof i6.PaperComponent, typeof i7.PaletteComponent, typeof i9.DiagramPaletteComponent, typeof i10.ShapeComponent, typeof i8.ShapePaletteComponent, typeof i11.ControlsComponent, typeof i13.ExportControlsComponent, typeof i12.EdgeTypePickerComponent, typeof i14.ColorPickerComponent, typeof i15.DiagramComponent, typeof i16.ColumnChartComponent, typeof i17.BarChartComponent, typeof i18.XYChartComponent, typeof i19.LineChartComponent, typeof i20.AreaChartComponent, typeof i21.PieChartComponent, typeof i22.ScatterChartComponent, typeof i23.BubbleChartComponent, typeof i24.SankeyChartComponent, typeof i25.DecoratorComponent, typeof i26.SurfacePopupComponent, typeof i27.BackgroundComponent, typeof i28.ImageBackgroundComponent, typeof i29.GridBackgroundComponent, typeof i30.TiledImageBackgroundComponent, typeof i31.EdgePropertyMappingsInspectorComponent, typeof i32.ShapePropertiesInspectorComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<VisuallyJsModule>;
 }

package/lib/charts/area.chart.component.d.ts

@@ -13,20 +13,20 @@ export interface AreaChartComponentOptions extends Omit<AreaChartOptions, "data"
  */
 export declare class AreaChartComponent extends SeriesBasedChartComponent<AreaChart, AreaChartOptions, AreaChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: AreaChartOptions;
+    options: import("@angular/core").InputSignal<AreaChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -34,5 +34,5 @@ export declare class AreaChartComponent extends SeriesBasedChartComponent<AreaCh
     useModel?: boolean;
     createChart(el: BrowserElement, options: AreaChartOptions): AreaChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<AreaChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AreaChartComponent, "vjs-area-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AreaChartComponent, "vjs-area-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/bar.chart.component.d.ts

@@ -9,20 +9,20 @@ export interface BarChartComponentOptions extends Omit<BarChartOptions, "data" |
  */
 export declare class BarChartComponent extends SeriesBasedChartComponent<BarChart, BarChartOptions, BarChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: BarChartOptions;
+    options: import("@angular/core").InputSignal<BarChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -30,5 +30,5 @@ export declare class BarChartComponent extends SeriesBasedChartComponent<BarChar
     useModel?: boolean;
     createChart(el: BrowserElement, options: BarChartOptions): BarChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<BarChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BarChartComponent, "vjs-bar-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BarChartComponent, "vjs-bar-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/bubble.chart.component.d.ts

@@ -12,20 +12,20 @@ export interface BubbleChartComponentOptions extends Omit<BubbleChartOptions, "d
  */
 export declare class BubbleChartComponent extends SeriesBasedChartComponent<BubbleChart, BubbleChartOptions, BubbleChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: BubbleChartOptions;
+    options: import("@angular/core").InputSignal<BubbleChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -33,5 +33,5 @@ export declare class BubbleChartComponent extends SeriesBasedChartComponent<Bubb
     useModel?: boolean;
     createChart(el: BrowserElement, options: BubbleChartOptions): BubbleChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<BubbleChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BubbleChartComponent, "vjs-bubble-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BubbleChartComponent, "vjs-bubble-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/column.chart.component.d.ts

@@ -3,6 +3,7 @@ import { SeriesBasedChartComponent } from "./series.based.chart.component";
 import * as i0 from "@angular/core";
 /**
  * Options for a column chart.
+ * @group Charts
  */
 export interface ColumnChartComponentOptions extends Omit<ColumnChartOptions, "data" | "url" | "model"> {
 }
@@ -12,20 +13,20 @@ export interface ColumnChartComponentOptions extends Omit<ColumnChartOptions, "d
  */
 export declare class ColumnChartComponent extends SeriesBasedChartComponent<ColumnChart, ColumnChartOptions, ColumnChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: ColumnChartOptions;
+    options: import("@angular/core").InputSignal<ColumnChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -33,5 +34,5 @@ export declare class ColumnChartComponent extends SeriesBasedChartComponent<Colu
     useModel?: boolean;
     createChart(el: BrowserElement, options: ColumnChartOptions): ColumnChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<ColumnChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ColumnChartComponent, "vjs-column-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ColumnChartComponent, "vjs-column-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/line.chart.component.d.ts

@@ -13,20 +13,20 @@ export interface LineChartComponentOptions extends Omit<LineChartOptions, "data"
  */
 export declare class LineChartComponent extends SeriesBasedChartComponent<LineChart, LineChartOptions, LineChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: LineChartOptions;
+    options: import("@angular/core").InputSignal<LineChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -34,5 +34,5 @@ export declare class LineChartComponent extends SeriesBasedChartComponent<LineCh
     useModel?: boolean;
     createChart(el: BrowserElement, options: LineChartOptions): LineChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<LineChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LineChartComponent, "vjs-line-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LineChartComponent, "vjs-line-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/pie.chart.component.d.ts

@@ -9,20 +9,20 @@ export interface PieChartComponentOptions extends Omit<PieChartOptions, "data" |
  */
 export declare class PieChartComponent extends SeriesBasedChartComponent<PieChart, PieChartOptions, PieChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: PieChartOptions;
+    options: import("@angular/core").InputSignal<PieChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -30,5 +30,5 @@ export declare class PieChartComponent extends SeriesBasedChartComponent<PieChar
     useModel?: boolean;
     createChart(el: BrowserElement, options: PieChartOptions): PieChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<PieChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PieChartComponent, "vjs-pie-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PieChartComponent, "vjs-pie-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/sankey.chart.component.d.ts

@@ -5,25 +5,25 @@ import * as i0 from "@angular/core";
 export interface SankeyChartComponentOptions extends Omit<SankeyOptions, "data" | "url" | "model"> {
 }
 /**
- * A sankey chart. Data can be sourced from a url or a JS object, or, if you want to use the chart as part of a dashboard, from the current model provisioned by the VisuallyJsService.
+ * A sankey chart. Data can be sourced from a url, a JS object or CSV data, or - if you want to use the chart as part of a dashboard - from the current model provisioned by the VisuallyJsService.
  * @group Charts
  */
 export declare class SankeyChartComponent implements AfterViewInit, OnDestroy, OnChanges {
     /**
-     * Optional data to load into the chart (in CSV format)
+     * Optional data to load into the chart. This is reactive and can be updated dynamically. (in CSV format)
      * @input
      */
-    csvData?: string;
+    csvData: import("@angular/core").InputSignal<string>;
     /**
-     * Optional data to load into the chart (in VisuallyJs default json format)
+     * Optional data to load into the chart. This is reactive and can be updated dynamically. (in VisuallyJs default json format)
      * @input
      */
-    jsonData?: VisuallyJsDefaultJSON;
+    jsonData: import("@angular/core").InputSignal<VisuallyJsDefaultJSON>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
      * Whether the chart is interactive.
      * @input
@@ -35,7 +35,7 @@ export declare class SankeyChartComponent implements AfterViewInit, OnDestroy, O
      */
     pivot?: string;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
     options: SankeyChartComponentOptions;
@@ -45,6 +45,9 @@ export declare class SankeyChartComponent implements AfterViewInit, OnDestroy, O
      */
     useModel?: boolean;
     private chart;
+    private _dataEffect;
+    private _urlEffect;
+    private _csvDataEffect;
     $el: ElementRef<any>;
     $ngZone: NgZone;
     $vjs: VisuallyJsService;
@@ -60,5 +63,5 @@ export declare class SankeyChartComponent implements AfterViewInit, OnDestroy, O
     ngOnChanges(changes: SimpleChanges): void;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SankeyChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SankeyChartComponent, "vjs-sankey-chart", never, { "csvData": { "alias": "csvData"; "required": false; }; "jsonData": { "alias": "jsonData"; "required": false; }; "url": { "alias": "url"; "required": false; }; "interactive": { "alias": "interactive"; "required": false; }; "pivot": { "alias": "pivot"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SankeyChartComponent, "vjs-sankey-chart", never, { "csvData": { "alias": "csvData"; "required": false; "isSignal": true; }; "jsonData": { "alias": "jsonData"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; }; "pivot": { "alias": "pivot"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/scatter.chart.component.d.ts

@@ -9,20 +9,20 @@ export interface ScatterChartComponentOptions extends Omit<ScatterChartOptions,
  */
 export declare class ScatterChartComponent extends SeriesBasedChartComponent<ScatterChart, ScatterChartOptions, ScatterChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: ScatterChartOptions;
+    options: import("@angular/core").InputSignal<ScatterChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -30,5 +30,5 @@ export declare class ScatterChartComponent extends SeriesBasedChartComponent<Sca
     useModel?: boolean;
     createChart(el: BrowserElement, options: ScatterChartOptions): ScatterChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<ScatterChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ScatterChartComponent, "vjs-scatter-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScatterChartComponent, "vjs-scatter-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/charts/series.based.chart.component.d.ts

@@ -8,26 +8,29 @@ import * as i0 from "@angular/core";
  */
 export declare abstract class SeriesBasedChartComponent<T extends SeriesBasedChart<O>, O, CO> implements AfterViewInit, OnDestroy {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: CO;
+    options: import("@angular/core").InputSignal<CO>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
      */
     useModel?: boolean;
     private chart;
+    private _dataEffect;
+    private _urlEffect;
+    private _optionsEffect;
     $el: ElementRef<any>;
     $ngZone: NgZone;
     $vjs: VisuallyJsService;

package/lib/charts/xy.chart.component.d.ts

@@ -9,20 +9,20 @@ export interface XYChartComponentOptions extends Omit<CategoryValueChartOptions,
  */
 export declare class XYChartComponent extends SeriesBasedChartComponent<CategoryValueChart, CategoryValueChartOptions, XYChartComponentOptions> {
     /**
-     * Optional data to load into the chart
+     * Optional data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    data?: Array<ObjectData>;
+    data: import("@angular/core").InputSignal<ObjectData[]>;
     /**
-     * Optional URL for data to load into the chart
+     * Optional URL for data to load into the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    url?: string;
+    url: import("@angular/core").InputSignal<string>;
     /**
-     * Options for the chart
+     * Options for the chart. This is reactive and can be updated dynamically.
      * @input
      */
-    options: CategoryValueChartOptions;
+    options: import("@angular/core").InputSignal<CategoryValueChartOptions>;
     /**
      * If true, the component attaches to a model provided by the VisuallyJsService. Defaults to false.
      * @input
@@ -30,5 +30,5 @@ export declare class XYChartComponent extends SeriesBasedChartComponent<Category
     useModel?: boolean;
     createChart(el: BrowserElement, options: CategoryValueChartOptions): CategoryValueChart;
     static ɵfac: i0.ɵɵFactoryDeclaration<XYChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<XYChartComponent, "vjs-xy-chart", never, { "data": { "alias": "data"; "required": false; }; "url": { "alias": "url"; "required": false; }; "options": { "alias": "options"; "required": false; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<XYChartComponent, "vjs-xy-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "url": { "alias": "url"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "useModel": { "alias": "useModel"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/controls-component.d.ts

@@ -3,11 +3,7 @@ import { ControlsComponentButtons, BrowserElement, BrowserUI } from "@visuallyjs
 import { VisuallyJsService } from "./vjs-service";
 import * as i0 from "@angular/core";
 /**
- * This component was written for the Visually JS demonstration applications. We've included it in the Toolkit's
- * angular integration as it may provide a useful base on which to build your own. Out of the box this is "production ready",
- * but it does assume that either you're including the `visuallyjs.css` stylesheet in your cascade,
- * or you've pulled out the relevant styles from that stylesheet. Also note that the default prompt for users when they
- * press the 'clear' button is in English, as are the button tooltips.
+ * This component was written for the Visually JS demonstration applications. Out of the box this is "production ready", but it does assume that either you're including the `visuallyjs.css` stylesheet in your cascade, or you've pulled out the relevant styles from that stylesheet. Also note that the default prompt for users when they press the 'clear' button is in English, as are the button tooltips.
  * @group Components
  */
 export declare class ControlsComponent {

package/lib/diagram-palette-component.d.ts

@@ -96,7 +96,7 @@ export declare class DiagramPaletteComponent implements AfterViewInit {
      * Whether or not to allow drop on edge. Defaults to false.
      * @input
      */
-    allowDropOnEdge?: boolean | CanDropOnEdgeFilter<any>;
+    allowDropOnEdge?: boolean | CanDropOnEdgeFilter;
     /**
      * Whether or not to allow rotation of elements being dragged. Defaults to true.
      * @input

package/lib/edge.property.mappings.inspector.component.d.ts

@@ -0,0 +1,38 @@
+import { EdgeMapping, EdgePropertyMappings, PropertyMapping } from "@visuallyjs/browser-ui";
+import { VisuallyJsService } from "./vjs-service";
+import * as i0 from "@angular/core";
+/**
+ * A component that provides a form for managing edge properties from the installed edge property mappings.
+ * @group Components
+ */
+export declare class EdgePropertyMappingsInspectorComponent {
+    /**
+     * Optional, you can implement this method to return your own names to use for properties in the inspector.
+     * @input
+     */
+    getPropertyName?: (pm: PropertyMapping<EdgeMapping>) => string;
+    /**
+     * Optional, whether or not to show property names. Defaults to true.
+     * @input
+     */
+    showName?: boolean;
+    /**
+     * Optional class name to use on the wrapper div. Defaults to `vjs-inspector-section`.
+     * @input
+     */
+    cssClass?: string;
+    /**
+     * Optional property mappings to render a form for. The default behaviour is to retrieve the property mappings from the inspector context
+     * @input
+     */
+    mappings?: EdgePropertyMappings;
+    $vjs: VisuallyJsService;
+    _inspector: import("@angular/core").WritableSignal<import("@visuallyjs/browser-ui").Inspector>;
+    get cls(): string;
+    resolveMappings(): EdgePropertyMappings;
+    private toList;
+    getPropertyKey(pm: PropertyMapping<EdgeMapping>): string;
+    getName(pm: PropertyMapping<EdgeMapping>): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<EdgePropertyMappingsInspectorComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EdgePropertyMappingsInspectorComponent, "vjs-edge-properties-inspector", never, { "getPropertyName": { "alias": "getPropertyName"; "required": false; }; "showName": { "alias": "showName"; "required": false; }; "cssClass": { "alias": "cssClass"; "required": false; }; "mappings": { "alias": "mappings"; "required": false; }; }, {}, never, never, false, never>;
+}

package/lib/palette.component.d.ts

@@ -5,7 +5,7 @@ import * as i0 from "@angular/core";
 /**
  * @group Components
  */
-export declare class PaletteComponent<T> {
+export declare class PaletteComponent {
     $vjs: VisuallyJsService;
     $el: ElementRef<any>;
     $surface: import("@angular/core").WritableSignal<import("@visuallyjs/browser-ui").Surface>;
@@ -19,26 +19,26 @@ export declare class PaletteComponent<T> {
      * Function to use to generate an initial payload when the user starts to drag something from this component, or taps on an item in tap/draw mode. Optional, and if omitted Visually JS will use a default data generator that extracts data values from any `data-vjs-***` attributes on the element being dragged.
      * @input
      */
-    dataGenerator?: DataGeneratorFunction<T>;
+    dataGenerator?: DataGeneratorFunction;
     /**
      * Optional function to use to determine the type of object that a user has just started dragging or tapped on
      * @input
      */
-    typeGenerator?: TypeGeneratorFunction<T>;
+    typeGenerator?: TypeGeneratorFunction;
     /**
      * Optional function to use to determine if the object that is being dragged represents a group. If this function is present, and returns true, then the drag object is considered to be a group. In all other cases the drag object is considered to be a node.
      * @input
      */
-    groupIdentifier?: GroupIdentifierFunction<T>;
+    groupIdentifier?: GroupIdentifierFunction;
     /**
      * @internal
      */
-    palette: Palette<T>;
+    palette: Palette;
     /**
      * Defaults to true. Allows items to be dropped onto edges in the canvas.
      * @input
      */
-    allowDropOnEdge?: boolean | CanDropOnEdgeFilter<any>;
+    allowDropOnEdge?: boolean | CanDropOnEdgeFilter;
     /**
      * Defaults to true. Allows items to be dropped onto groups in the canvas.
      * @input
@@ -68,7 +68,7 @@ export declare class PaletteComponent<T> {
      * Optional filter to test if objects may be dropped on the canvas. This method is invoked at the start of a drag and is passed the candidate drag object's data.
      * @input
      */
-    canvasDropFilter?: CanvasDropFilter<T>;
+    canvasDropFilter?: CanvasDropFilter;
     /**
      * Mode to use - drag or tap. Defaults to drag.
      * @input
@@ -101,6 +101,6 @@ export declare class PaletteComponent<T> {
      */
     autoEdgeConnect?: boolean | AutoEdgeConnectOptions;
     constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<PaletteComponent<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PaletteComponent<any>, "[vjs-palette]", never, { "selector": { "alias": "selector"; "required": false; }; "dataGenerator": { "alias": "dataGenerator"; "required": false; }; "typeGenerator": { "alias": "typeGenerator"; "required": false; }; "groupIdentifier": { "alias": "groupIdentifier"; "required": false; }; "allowDropOnEdge": { "alias": "allowDropOnEdge"; "required": false; }; "allowDropOnGroup": { "alias": "allowDropOnGroup"; "required": false; }; "allowDropOnCanvas": { "alias": "allowDropOnCanvas"; "required": false; }; "allowDropOnNode": { "alias": "allowDropOnNode"; "required": false; }; "onVertexAdded": { "alias": "onVertexAdded"; "required": false; }; "dragSize": { "alias": "dragSize"; "required": false; }; "canvasDropFilter": { "alias": "canvasDropFilter"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "selectAfterAdd": { "alias": "selectAfterAdd"; "required": false; }; "allowClickToAdd": { "alias": "allowClickToAdd"; "required": false; }; "clickToAddOnly": { "alias": "clickToAddOnly"; "required": false; }; "allowRotation": { "alias": "allowRotation"; "required": false; }; "rotationSpeed": { "alias": "rotationSpeed"; "required": false; }; "autoEdgeConnect": { "alias": "autoEdgeConnect"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PaletteComponent, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PaletteComponent, "[vjs-palette]", never, { "selector": { "alias": "selector"; "required": false; }; "dataGenerator": { "alias": "dataGenerator"; "required": false; }; "typeGenerator": { "alias": "typeGenerator"; "required": false; }; "groupIdentifier": { "alias": "groupIdentifier"; "required": false; }; "allowDropOnEdge": { "alias": "allowDropOnEdge"; "required": false; }; "allowDropOnGroup": { "alias": "allowDropOnGroup"; "required": false; }; "allowDropOnCanvas": { "alias": "allowDropOnCanvas"; "required": false; }; "allowDropOnNode": { "alias": "allowDropOnNode"; "required": false; }; "onVertexAdded": { "alias": "onVertexAdded"; "required": false; }; "dragSize": { "alias": "dragSize"; "required": false; }; "canvasDropFilter": { "alias": "canvasDropFilter"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "selectAfterAdd": { "alias": "selectAfterAdd"; "required": false; }; "allowClickToAdd": { "alias": "allowClickToAdd"; "required": false; }; "clickToAddOnly": { "alias": "clickToAddOnly"; "required": false; }; "allowRotation": { "alias": "allowRotation"; "required": false; }; "rotationSpeed": { "alias": "rotationSpeed"; "required": false; }; "autoEdgeConnect": { "alias": "autoEdgeConnect"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/shape-properties-inspector.component.d.ts

@@ -0,0 +1,35 @@
+import { ShapePropertyValueDefinition, Vertex, Inspector, RealisedShapeType } from "@visuallyjs/browser-ui";
+import { VisuallyJsService } from "./vjs-service";
+import * as i0 from "@angular/core";
+/**
+ * Inspector for the properties of a shape.
+ * @group Components
+ */
+export declare class ShapePropertiesInspectorComponent {
+    /**
+     * vertex to inspector
+     * @input
+     */
+    vertex: Vertex | null;
+    /**
+     * The maximum number of radio buttons to show for a value list before switching to a select dropdown. Defaults to 7.
+     * @input
+     */
+    maxRadios?: number;
+    $vjs: VisuallyJsService;
+    _inspector: import("@angular/core").WritableSignal<Inspector>;
+    private readonly _inspectorRevision;
+    private readonly _inspectorChangeListener;
+    private readonly _inspectorChangeEffect;
+    get currentMaxRadios(): number;
+    get shapeDef(): RealisedShapeType | null;
+    getBooleanLabel(prop: any, value: boolean): string;
+    getShapePropertyValueLabel(v: string | ShapePropertyValueDefinition): string;
+    getShapePropertyValueValue(v: string | ShapePropertyValueDefinition): string;
+    getPropertyDisplayValue(prop: any): string;
+    isBoolean(prop: any): boolean;
+    hasValues(prop: any): boolean;
+    useRadio(prop: any): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ShapePropertiesInspectorComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ShapePropertiesInspectorComponent, "vjs-shape-properties-inspector", never, { "vertex": { "alias": "vertex"; "required": false; }; "maxRadios": { "alias": "maxRadios"; "required": false; }; }, {}, never, never, false, never>;
+}

package/lib/shape.palette.component.d.ts

@@ -1,5 +1,5 @@
 import { ElementRef } from "@angular/core";
-import { ObjectData, Size, DataGeneratorFunction, OnVertexAddedCallback, PreparedShape, AutoEdgeConnectOptions, CanDropOnEdgeFilter } from "@visuallyjs/browser-ui";
+import { Size, DataGeneratorFunction, OnVertexAddedCallback, PreparedShape, AutoEdgeConnectOptions, CanDropOnEdgeFilter } from "@visuallyjs/browser-ui";
 import { VisuallyJsService } from "./vjs-service";
 import * as i0 from "@angular/core";
 /**
@@ -56,7 +56,7 @@ export declare class ShapePaletteComponent {
      * Optional function you can use to set some initial data for an element being dragged. Note that you cannot override the object's `type` with this function.
      * @input
      */
-    dataGenerator?: DataGeneratorFunction<ObjectData>;
+    dataGenerator?: DataGeneratorFunction;
     /**
      * Optional set of prepared shapes to show in the palette. When this is provided, the palette will only render these shapes, and not the contents of the shape library.
      * @input
@@ -66,7 +66,7 @@ export declare class ShapePaletteComponent {
      * Whether or not to allow drop on edge. Defaults to false.
      * @input
      */
-    allowDropOnEdge?: boolean | CanDropOnEdgeFilter<any>;
+    allowDropOnEdge?: boolean | CanDropOnEdgeFilter;
     /**
      * Whether or not to allow rotation of elements being dragged. Defaults to true.
      * @input