@metadev/daga-angular 4.2.4 → 4.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Changelog.md
CHANGED
|
@@ -6,6 +6,12 @@ List of releases and changes.
|
|
|
6
6
|
|
|
7
7
|
## Next release Joyeuse
|
|
8
8
|
|
|
9
|
+
## v. 4.2.5
|
|
10
|
+
|
|
11
|
+
- Add methods `getZoomLevel()` and `getViewCoordinates()` in `canvas` to obtain the current zoom and pan level of the view [#317](https://github.com/metadevpro/daga/pull/317)
|
|
12
|
+
- Enable configuring the height of the palette and property editor [#319](https://github.com/metadevpro/daga/pull/319)
|
|
13
|
+
- Correctly update the connection point of ports when pasting [#321](https://github.com/metadevpro/daga/pull/321)
|
|
14
|
+
|
|
9
15
|
## v. 4.2.4
|
|
10
16
|
|
|
11
17
|
- Enable configuring line style in shaped looks [#313](https://github.com/metadevpro/daga/pull/313)
|
|
@@ -525,6 +525,11 @@ class PaletteComponent {
|
|
|
525
525
|
.style('width', this.width)
|
|
526
526
|
.select('.daga-palette-view')
|
|
527
527
|
.style('flex-direction', 'row');
|
|
528
|
+
if (this.height) {
|
|
529
|
+
this.selectPanel()
|
|
530
|
+
.select('.daga-panel-content')
|
|
531
|
+
.style('height', this.height);
|
|
532
|
+
}
|
|
528
533
|
break;
|
|
529
534
|
case Side.Left:
|
|
530
535
|
case Side.Right:
|
|
@@ -532,6 +537,11 @@ class PaletteComponent {
|
|
|
532
537
|
.style('height', this.width)
|
|
533
538
|
.select('.daga-palette-view')
|
|
534
539
|
.style('flex-direction', 'column');
|
|
540
|
+
if (this.height) {
|
|
541
|
+
this.selectPanel()
|
|
542
|
+
.select('.daga-panel-content')
|
|
543
|
+
.style('width', this.height);
|
|
544
|
+
}
|
|
535
545
|
break;
|
|
536
546
|
}
|
|
537
547
|
this.selectPanel()
|
|
@@ -547,6 +557,7 @@ class PaletteComponent {
|
|
|
547
557
|
this.location = config.components?.palette?.location || Corner.TopLeft;
|
|
548
558
|
this.direction = config.components?.palette?.direction || Side.Bottom;
|
|
549
559
|
this.width = config.components?.palette?.width || '12rem';
|
|
560
|
+
this.height = config.components?.palette?.height;
|
|
550
561
|
this.gap = config.components?.palette?.gap || '1rem';
|
|
551
562
|
this.palettes = config.components?.palette?.sections || [];
|
|
552
563
|
this.currentPalette = this.palettes[0];
|
|
@@ -962,7 +973,7 @@ class PaletteComponent {
|
|
|
962
973
|
}
|
|
963
974
|
}
|
|
964
975
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PaletteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
965
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PaletteComponent, isStandalone: true, selector: "daga-palette", inputs: { palettes: "palettes", currentPalette: "currentPalette", currentCategory: "currentCategory", location: "location", direction: "direction", width: "width", gap: "gap" }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], ngImport: i0, template: "<div #panel class=\"daga-panel daga-{{ location }} daga-{{ direction }}\">\r\n <daga-collapse-button\r\n #collapseButton\r\n [direction]=\"direction\"\r\n [collapsableSelector]=\"panel\"\r\n collapsableAdditionalSelector=\".daga-panel-content\"\r\n rule=\"display\"\r\n collapsedValue=\"none\"\r\n visibleValue=\"block\"\r\n />\r\n <div class=\"daga-panel-content\">\r\n @if (palettes.length > 1) {\r\n <div class=\"daga-panel-tabs\">\r\n @for (palette of palettes; track palette) {\r\n <div\r\n class=\"daga-panel-tab\"\r\n [class]=\"palette === currentPalette ? 'daga-current-tab' : ''\"\r\n (click)=\"switchPalette(palette)\"\r\n >\r\n {{ palette.name }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n <div class=\"daga-palette-view\"></div>\r\n </div>\r\n </div>\r\n", dependencies: [{ kind: "component", type: CollapseButtonComponent, selector: "daga-collapse-button", inputs: ["collapsableSelector", "collapsableAdditionalSelector", "collapsed", "disabled", "direction", "rule", "collapsedValue", "visibleValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
976
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PaletteComponent, isStandalone: true, selector: "daga-palette", inputs: { palettes: "palettes", currentPalette: "currentPalette", currentCategory: "currentCategory", location: "location", direction: "direction", width: "width", height: "height", gap: "gap" }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], ngImport: i0, template: "<div #panel class=\"daga-panel daga-{{ location }} daga-{{ direction }}\">\r\n <daga-collapse-button\r\n #collapseButton\r\n [direction]=\"direction\"\r\n [collapsableSelector]=\"panel\"\r\n collapsableAdditionalSelector=\".daga-panel-content\"\r\n rule=\"display\"\r\n collapsedValue=\"none\"\r\n visibleValue=\"block\"\r\n />\r\n <div class=\"daga-panel-content\">\r\n @if (palettes.length > 1) {\r\n <div class=\"daga-panel-tabs\">\r\n @for (palette of palettes; track palette) {\r\n <div\r\n class=\"daga-panel-tab\"\r\n [class]=\"palette === currentPalette ? 'daga-current-tab' : ''\"\r\n (click)=\"switchPalette(palette)\"\r\n >\r\n {{ palette.name }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n <div class=\"daga-palette-view\"></div>\r\n </div>\r\n </div>\r\n", dependencies: [{ kind: "component", type: CollapseButtonComponent, selector: "daga-collapse-button", inputs: ["collapsableSelector", "collapsableAdditionalSelector", "collapsed", "disabled", "direction", "rule", "collapsedValue", "visibleValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
966
977
|
}
|
|
967
978
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PaletteComponent, decorators: [{
|
|
968
979
|
type: Component,
|
|
@@ -982,6 +993,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
|
|
|
982
993
|
type: Input
|
|
983
994
|
}], width: [{
|
|
984
995
|
type: Input
|
|
996
|
+
}], height: [{
|
|
997
|
+
type: Input
|
|
985
998
|
}], gap: [{
|
|
986
999
|
type: Input
|
|
987
1000
|
}] } });
|
|
@@ -1804,6 +1817,7 @@ class PropertyEditorComponent {
|
|
|
1804
1817
|
this.direction =
|
|
1805
1818
|
config.components?.propertyEditor?.direction || Side.Bottom;
|
|
1806
1819
|
this.width = config.components?.propertyEditor?.width || '24rem';
|
|
1820
|
+
this.height = config.components?.propertyEditor?.height;
|
|
1807
1821
|
this.title = undefined;
|
|
1808
1822
|
this.valueSet = undefined;
|
|
1809
1823
|
this.setPanelWidth();
|
|
@@ -1814,10 +1828,20 @@ class PropertyEditorComponent {
|
|
|
1814
1828
|
case Side.Bottom:
|
|
1815
1829
|
case Side.Top:
|
|
1816
1830
|
this.selectPanel().style('width', this.width);
|
|
1831
|
+
if (this.height) {
|
|
1832
|
+
this.selectPanel()
|
|
1833
|
+
.select('.daga-panel-content')
|
|
1834
|
+
.style('height', this.height);
|
|
1835
|
+
}
|
|
1817
1836
|
break;
|
|
1818
1837
|
case Side.Left:
|
|
1819
1838
|
case Side.Right:
|
|
1820
1839
|
this.selectPanel().style('height', this.width);
|
|
1840
|
+
if (this.height) {
|
|
1841
|
+
this.selectPanel()
|
|
1842
|
+
.select('.daga-panel-content')
|
|
1843
|
+
.style('width', this.height);
|
|
1844
|
+
}
|
|
1821
1845
|
break;
|
|
1822
1846
|
}
|
|
1823
1847
|
}
|
|
@@ -1845,7 +1869,7 @@ class PropertyEditorComponent {
|
|
|
1845
1869
|
}
|
|
1846
1870
|
}
|
|
1847
1871
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PropertyEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1848
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PropertyEditorComponent, isStandalone: true, selector: "daga-property-editor", inputs: { valueSet: "valueSet" }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], ngImport: i0, template: "<div\r\n #panel\r\n class=\"daga-panel daga-bottom daga-{{ location }} daga-{{ direction }}\"\r\n
|
|
1872
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: PropertyEditorComponent, isStandalone: true, selector: "daga-property-editor", inputs: { valueSet: "valueSet" }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], ngImport: i0, template: "<div\r\n #panel\r\n class=\"daga-panel daga-bottom daga-{{ location }} daga-{{ direction }}\"\r\n>\r\n <daga-collapse-button\r\n #collapse\r\n [disabled]=\"\r\n !valueSet ||\r\n !valueSet.propertySet ||\r\n !valueSet.propertySet.hasProperties()\r\n \"\r\n [direction]=\"direction\"\r\n [collapsableSelector]=\"panel\"\r\n collapsableAdditionalSelector=\".daga-panel-content\"\r\n rule=\"display\"\r\n collapsedValue=\"none\"\r\n visibleValue=\"block\"\r\n />\r\n <div class=\"daga-panel-content\">\r\n @if (\r\n valueSet &&\r\n valueSet.propertySet &&\r\n valueSet.propertySet.hasProperties() &&\r\n !collapse.collapsed\r\n ) {\r\n @if (title) {\r\n <p class=\"daga-title\">\r\n {{ title }}\r\n <button class=\"daga-property-button\" (click)=\"settings = !settings\">\r\n <div\r\n class=\"daga-icon daga-settings-icon\"\r\n [class]=\"\r\n settings === undefined\r\n ? ''\r\n : settings\r\n ? 'daga-unrotate'\r\n : 'daga-rotate'\r\n \"\r\n ></div>\r\n </button>\r\n </p>\r\n }\r\n @if (!settings) {\r\n <daga-object-editor [valueSet]=\"valueSet\" />\r\n }\r\n @if (settings) {\r\n <daga-property-settings [valueSet]=\"valueSet\" />\r\n }\r\n }\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "component", type: CollapseButtonComponent, selector: "daga-collapse-button", inputs: ["collapsableSelector", "collapsableAdditionalSelector", "collapsed", "disabled", "direction", "rule", "collapsedValue", "visibleValue"] }, { kind: "component", type: ObjectEditorComponent, selector: "daga-object-editor", inputs: ["valueSet", "depth"] }, { kind: "component", type: PropertySettingsComponent, selector: "daga-property-settings", inputs: ["valueSet", "depth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1849
1873
|
}
|
|
1850
1874
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PropertyEditorComponent, decorators: [{
|
|
1851
1875
|
type: Component,
|
|
@@ -1853,7 +1877,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
|
|
|
1853
1877
|
CollapseButtonComponent,
|
|
1854
1878
|
ObjectEditorComponent,
|
|
1855
1879
|
PropertySettingsComponent
|
|
1856
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n #panel\r\n class=\"daga-panel daga-bottom daga-{{ location }} daga-{{ direction }}\"\r\n
|
|
1880
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n #panel\r\n class=\"daga-panel daga-bottom daga-{{ location }} daga-{{ direction }}\"\r\n>\r\n <daga-collapse-button\r\n #collapse\r\n [disabled]=\"\r\n !valueSet ||\r\n !valueSet.propertySet ||\r\n !valueSet.propertySet.hasProperties()\r\n \"\r\n [direction]=\"direction\"\r\n [collapsableSelector]=\"panel\"\r\n collapsableAdditionalSelector=\".daga-panel-content\"\r\n rule=\"display\"\r\n collapsedValue=\"none\"\r\n visibleValue=\"block\"\r\n />\r\n <div class=\"daga-panel-content\">\r\n @if (\r\n valueSet &&\r\n valueSet.propertySet &&\r\n valueSet.propertySet.hasProperties() &&\r\n !collapse.collapsed\r\n ) {\r\n @if (title) {\r\n <p class=\"daga-title\">\r\n {{ title }}\r\n <button class=\"daga-property-button\" (click)=\"settings = !settings\">\r\n <div\r\n class=\"daga-icon daga-settings-icon\"\r\n [class]=\"\r\n settings === undefined\r\n ? ''\r\n : settings\r\n ? 'daga-unrotate'\r\n : 'daga-rotate'\r\n \"\r\n ></div>\r\n </button>\r\n </p>\r\n }\r\n @if (!settings) {\r\n <daga-object-editor [valueSet]=\"valueSet\" />\r\n }\r\n @if (settings) {\r\n <daga-property-settings [valueSet]=\"valueSet\" />\r\n }\r\n }\r\n </div>\r\n</div>\r\n" }]
|
|
1857
1881
|
}], propDecorators: { panel: [{
|
|
1858
1882
|
type: ViewChild,
|
|
1859
1883
|
args: ['panel']
|
|
@@ -2006,7 +2030,7 @@ class DiagramComponent {
|
|
|
2006
2030
|
}
|
|
2007
2031
|
}
|
|
2008
2032
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DiagramComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2009
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: DiagramComponent, isStandalone: true, selector: "daga-diagram", inputs: { config: "config", model: "model" }, outputs: { modelChange: "modelChange", diagramEvent: "diagramEvent" }, providers: [CanvasProviderService, DagaConfigurationService], viewQueries: [{ propertyName: "appendTo", first: true, predicate: ["appendTo"], descendants: true }, { propertyName: "diagramButtons", first: true, predicate: ["diagramButtons"], descendants: true }, { propertyName: "palette", first: true, predicate: ["palette"], descendants: true }, { propertyName: "propertyEditor", first: true, predicate: ["propertyEditor"], descendants: true }], ngImport: i0, template: "<div class=\"daga-append-to\" #appendTo></div>\r\n@if (\r\n config.components?.buttons !== undefined &&\r\n config.components?.buttons?.enabled !== false\r\n ) {\r\n <daga-diagram-buttons\r\n #diagramButtons\r\n />\r\n}\r\n@if (\r\n config.components?.palette !== undefined &&\r\n config.components?.palette?.enabled !== false &&\r\n config.components?.palette?.sections &&\r\n (config.components?.palette?.sections?.length || 0) > 0\r\n ) {\r\n <daga-palette\r\n #palette\r\n />\r\n}\r\n@if (\r\n config.components?.propertyEditor !== undefined &&\r\n config.components?.propertyEditor?.enabled !== false\r\n ) {\r\n <daga-property-editor\r\n #propertyEditor\r\n />\r\n}\r\n@if (\r\n config.components?.errors !== undefined &&\r\n config.components?.errors?.enabled !== false\r\n ) {\r\n <daga-errors\r\n />\r\n}\r\n<ng-content />\r\n", dependencies: [{ kind: "component", type: DiagramButtonsComponent, selector: "daga-diagram-buttons", inputs: ["location", "direction", "enableAction", "enableFilter", "enableLayout", "enableSelection", "enableZoom"] }, { kind: "component", type: PaletteComponent, selector: "daga-palette", inputs: ["palettes", "currentPalette", "currentCategory", "location", "direction", "width", "gap"] }, { kind: "component", type: PropertyEditorComponent, selector: "daga-property-editor", inputs: ["valueSet"] }, { kind: "component", type: ErrorsComponent, selector: "daga-errors" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2033
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: DiagramComponent, isStandalone: true, selector: "daga-diagram", inputs: { config: "config", model: "model" }, outputs: { modelChange: "modelChange", diagramEvent: "diagramEvent" }, providers: [CanvasProviderService, DagaConfigurationService], viewQueries: [{ propertyName: "appendTo", first: true, predicate: ["appendTo"], descendants: true }, { propertyName: "diagramButtons", first: true, predicate: ["diagramButtons"], descendants: true }, { propertyName: "palette", first: true, predicate: ["palette"], descendants: true }, { propertyName: "propertyEditor", first: true, predicate: ["propertyEditor"], descendants: true }], ngImport: i0, template: "<div class=\"daga-append-to\" #appendTo></div>\r\n@if (\r\n config.components?.buttons !== undefined &&\r\n config.components?.buttons?.enabled !== false\r\n ) {\r\n <daga-diagram-buttons\r\n #diagramButtons\r\n />\r\n}\r\n@if (\r\n config.components?.palette !== undefined &&\r\n config.components?.palette?.enabled !== false &&\r\n config.components?.palette?.sections &&\r\n (config.components?.palette?.sections?.length || 0) > 0\r\n ) {\r\n <daga-palette\r\n #palette\r\n />\r\n}\r\n@if (\r\n config.components?.propertyEditor !== undefined &&\r\n config.components?.propertyEditor?.enabled !== false\r\n ) {\r\n <daga-property-editor\r\n #propertyEditor\r\n />\r\n}\r\n@if (\r\n config.components?.errors !== undefined &&\r\n config.components?.errors?.enabled !== false\r\n ) {\r\n <daga-errors\r\n />\r\n}\r\n<ng-content />\r\n", dependencies: [{ kind: "component", type: DiagramButtonsComponent, selector: "daga-diagram-buttons", inputs: ["location", "direction", "enableAction", "enableFilter", "enableLayout", "enableSelection", "enableZoom"] }, { kind: "component", type: PaletteComponent, selector: "daga-palette", inputs: ["palettes", "currentPalette", "currentCategory", "location", "direction", "width", "height", "gap"] }, { kind: "component", type: PropertyEditorComponent, selector: "daga-property-editor", inputs: ["valueSet"] }, { kind: "component", type: ErrorsComponent, selector: "daga-errors" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2010
2034
|
}
|
|
2011
2035
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DiagramComponent, decorators: [{
|
|
2012
2036
|
type: Component,
|