rete-angular-plugin 2.1.1 → 2.2.0

package/18/presets/minimap/components/mini-viewport/mini-viewport.component.d.ts

@@ -0,0 +1,27 @@
+import { MinimapData } from '../../types';
+import * as i0 from "@angular/core";
+export declare class MiniViewportComponent {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    containerWidth: number;
+    translate: MinimapData['translate'];
+    drag: {
+        start(e: {
+            pageX: number;
+            pageY: number;
+        }): void;
+    };
+    get styleLeft(): string;
+    get styleTop(): string;
+    get styleWidth(): string;
+    get styleHeight(): string;
+    pointerdown(event: PointerEvent): void;
+    px(value: number): string;
+    scale(v: number): number;
+    invert(v: number): number;
+    onDrag(dx: number, dy: number): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MiniViewportComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MiniViewportComponent, "minimap-mini-viewport", never, { "left": { "alias": "left"; "required": false; }; "top": { "alias": "top"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "containerWidth": { "alias": "containerWidth"; "required": false; }; "translate": { "alias": "translate"; "required": false; }; }, {}, never, never, false, never>;
+}

package/18/presets/minimap/components/minimap/minimap.component.d.ts

@@ -0,0 +1,25 @@
+import { ChangeDetectorRef, OnChanges, ElementRef } from '@angular/core';
+import { MinimapData } from '../../types';
+import * as i0 from "@angular/core";
+export declare class MinimapComponent implements OnChanges {
+    el: ElementRef;
+    private cdr;
+    rendered: () => void;
+    size: number;
+    ratio: MinimapData['ratio'];
+    nodes: MinimapData['nodes'];
+    viewport: MinimapData['viewport'];
+    translate: MinimapData['translate'];
+    point: MinimapData['point'];
+    get width(): string;
+    get height(): string;
+    pointerdown(event: PointerEvent): void;
+    dblclick(event: MouseEvent): void;
+    constructor(el: ElementRef, cdr: ChangeDetectorRef);
+    ngOnChanges(): void;
+    px(value: number): string;
+    scale(value: number): number;
+    identifyMiniNode(_: number, item: MinimapData['nodes'][number]): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MinimapComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MinimapComponent, "ng-component", never, { "rendered": { "alias": "rendered"; "required": false; }; "size": { "alias": "size"; "required": false; }; "ratio": { "alias": "ratio"; "required": false; }; "nodes": { "alias": "nodes"; "required": false; }; "viewport": { "alias": "viewport"; "required": false; }; "translate": { "alias": "translate"; "required": false; }; "point": { "alias": "point"; "required": false; }; }, {}, never, never, false, never>;
+}

package/18/presets/minimap/index.d.ts

@@ -0,0 +1,9 @@
+import { BaseSchemes } from 'rete';
+import { RenderPreset } from '../types';
+import { MinimapRender } from './types';
+/**
+ * Preset for rendering minimap.
+ */
+export declare function setup<Schemes extends BaseSchemes, K extends MinimapRender>(props?: {
+    size?: number;
+}): RenderPreset<Schemes, K>;

package/18/presets/minimap/module.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./components/minimap/minimap.component";
+import * as i2 from "./components/mini-viewport/mini-viewport.component";
+import * as i3 from "./components/mini-node/mini-node.component";
+import * as i4 from "@angular/common";
+export declare class ReteMinimapModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ReteMinimapModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ReteMinimapModule, [typeof i1.MinimapComponent, typeof i2.MiniViewportComponent, typeof i3.MiniNodeComponent], [typeof i4.CommonModule], [typeof i1.MinimapComponent, typeof i2.MiniViewportComponent, typeof i3.MiniNodeComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ReteMinimapModule>;
+}

package/18/presets/minimap/types.d.ts

@@ -0,0 +1,22 @@
+import { RenderSignal } from '../../types';
+export type Rect = {
+    width: number;
+    height: number;
+    left: number;
+    top: number;
+};
+export type Transform = {
+    x: number;
+    y: number;
+    k: number;
+};
+export type Translate = (dx: number, dy: number) => void;
+export type MinimapData = {
+    ratio: number;
+    nodes: Rect[];
+    viewport: Rect;
+    start(): Transform;
+    translate: Translate;
+    point(x: number, y: number): void;
+};
+export type MinimapRender = RenderSignal<'minimap', MinimapData>;

package/18/presets/reroute/components/index.d.ts

@@ -0,0 +1,2 @@
+export { PinsComponent } from './pins/pins.component';
+export { PinComponent } from './pin/pin.component';

package/18/presets/reroute/components/pin/pin.component.d.ts

@@ -0,0 +1,30 @@
+import { ChangeDetectorRef, OnChanges, EventEmitter } from '@angular/core';
+import { Position } from '../../types';
+import * as i0 from "@angular/core";
+export declare class PinComponent implements OnChanges {
+    private cdr;
+    position: Position;
+    selected?: boolean;
+    getPointer: () => Position;
+    menu: EventEmitter<void>;
+    translate: EventEmitter<{
+        dx: number;
+        dy: number;
+    }>;
+    down: EventEmitter<void>;
+    drag: {
+        start(e: {
+            pageX: number;
+            pageY: number;
+        }): void;
+    };
+    get _selected(): boolean;
+    get top(): string;
+    get left(): string;
+    pointerdown(event: PointerEvent): void;
+    contextmenu(event: MouseEvent): void;
+    constructor(cdr: ChangeDetectorRef);
+    ngOnChanges(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PinComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PinComponent, "reroute-pin", never, { "position": { "alias": "position"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "getPointer": { "alias": "getPointer"; "required": false; }; }, { "menu": "menu"; "translate": "translate"; "down": "down"; }, never, never, false, never>;
+}

package/18/presets/reroute/components/pins/pins.component.d.ts

@@ -0,0 +1,17 @@
+import { ChangeDetectorRef, OnChanges } from '@angular/core';
+import { Pin, PinData, Position } from '../../types';
+import * as i0 from "@angular/core";
+export declare class PinsComponent implements OnChanges {
+    private cdr;
+    rendered: () => void;
+    pins: PinData['pins'];
+    down?: (id: string) => void;
+    translate?: (id: string, dx: number, dy: number) => void;
+    menu?: (id: string) => void;
+    getPointer?: () => Position;
+    constructor(cdr: ChangeDetectorRef);
+    ngOnChanges(): void;
+    track(_: number, item: Pin): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PinsComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PinsComponent, "ng-component", never, { "rendered": { "alias": "rendered"; "required": false; }; "pins": { "alias": "pins"; "required": false; }; "down": { "alias": "down"; "required": false; }; "translate": { "alias": "translate"; "required": false; }; "menu": { "alias": "menu"; "required": false; }; "getPointer": { "alias": "getPointer"; "required": false; }; }, {}, never, never, false, never>;
+}

package/18/presets/reroute/index.d.ts

@@ -0,0 +1,13 @@
+import { BaseSchemes } from 'rete';
+import { RenderPreset } from '../types';
+import { PinsRender } from './types';
+type Props = {
+    translate?: (id: string, dx: number, dy: number) => void;
+    contextMenu?: (id: string) => void;
+    pointerdown?: (id: string) => void;
+};
+/**
+ * Preset for rendering pins.
+ */
+export declare function setup<Schemes extends BaseSchemes, K extends PinsRender>(props?: Props): RenderPreset<Schemes, K>;
+export {};

package/18/presets/reroute/module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./components/pins/pins.component";
+import * as i2 from "./components/pin/pin.component";
+import * as i3 from "@angular/common";
+export declare class ReteRerouteModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ReteRerouteModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ReteRerouteModule, [typeof i1.PinsComponent, typeof i2.PinComponent], [typeof i3.CommonModule], [typeof i1.PinsComponent, typeof i2.PinComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ReteRerouteModule>;
+}

package/18/presets/reroute/types.d.ts

@@ -0,0 +1,18 @@
+import { ConnectionId } from 'rete';
+import { RenderSignal } from '../../types';
+export type Position = {
+    x: number;
+    y: number;
+};
+export type Pin = {
+    id: string;
+    position: Position;
+    selected?: boolean;
+};
+export type PinData = {
+    id: ConnectionId;
+    pins: Pin[];
+};
+export type PinsRender = RenderSignal<'reroute-pins', {
+    data: PinData;
+}>;

package/18/presets/types.d.ts

@@ -0,0 +1,15 @@
+import { BaseSchemes } from 'rete';
+import { AngularPlugin } from '../core';
+export type RenderPreset<Schemes extends BaseSchemes, T> = {
+    attach?: (plugin: AngularPlugin<Schemes, T>) => void;
+    update: (context: Extract<T, {
+        type: 'render';
+    }>, plugin: AngularPlugin<Schemes, T>) => Record<string, unknown> | undefined | null | void;
+    mount: (context: Extract<T, {
+        type: 'render';
+    }>, plugin: AngularPlugin<Schemes, T>) => {
+        key: string;
+        component: any;
+        props: Record<string, unknown>;
+    } | undefined | null | void;
+};

package/18/ref.d.ts

@@ -0,0 +1,12 @@
+import { ElementRef, OnChanges, OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class RefDirective implements OnChanges, OnDestroy {
+    private el;
+    data: any;
+    emit: any;
+    constructor(el: ElementRef);
+    ngOnChanges(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RefDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RefDirective, "[refComponent]", never, { "data": { "alias": "data"; "required": false; }; "emit": { "alias": "emit"; "required": false; }; }, {}, never, never, false, never>;
+}

package/18/shared/drag.d.ts

@@ -0,0 +1,10 @@
+import { Position } from '../types';
+type Translate = (dx: number, dy: number) => void;
+type StartEvent = {
+    pageX: number;
+    pageY: number;
+};
+export declare function useDrag(translate: Translate, getPointer: (e: StartEvent) => Position): {
+    start(e: StartEvent): void;
+};
+export {};

package/18/types.d.ts

@@ -0,0 +1,29 @@
+import { NgElement as NgEl, NgElementStrategy } from '@angular/elements';
+export type NgElement = NgEl & {
+    ngElementStrategy: NgElementStrategy & {
+        setInputValue(key: string, value: any): void;
+    };
+};
+export type NodeProps = {
+    data: any;
+    rendered: any;
+    emit: any;
+} & NgElement;
+export type Position = {
+    x: number;
+    y: number;
+};
+export type RenderSignal<Type extends string, Data> = {
+    type: 'render';
+    data: {
+        element: HTMLElement;
+        filled?: boolean;
+        type: Type;
+    } & Data;
+} | {
+    type: 'rendered';
+    data: {
+        element: HTMLElement;
+        type: Type;
+    } & Data;
+};

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [2.2.0](https://github.com/retejs/angular-plugin/compare/v2.1.2...v2.2.0) (2024-09-14)
+
+
+### Features
+
+* add support for angular 18 ([3189913](https://github.com/retejs/angular-plugin/commit/31899136770001f8ebde4fe51d7ac2437dfb630d))
+
+## [2.1.2](https://github.com/retejs/angular-plugin/compare/v2.1.1...v2.1.2) (2024-08-23)
+
+
+### Bug Fixes
+
+* node sizing ([ce0d8f2](https://github.com/retejs/angular-plugin/commit/ce0d8f27a9c88662d501b3f9e1916dd2ae54da5e))
+
 ## [2.1.1](https://github.com/retejs/angular-plugin/compare/v2.1.0...v2.1.1) (2024-01-27)
 
 

package/bundles/rete-angular-plugin.umd.js

@@ -395,6 +395,20 @@
             this.seed = 0;
             this.cdr.detach();
         }
+        Object.defineProperty(NodeComponent.prototype, "width", {
+            get: function () {
+                return this.data.width;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(NodeComponent.prototype, "height", {
+            get: function () {
+                return this.data.height;
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(NodeComponent.prototype, "selected", {
             get: function () {
                 return this.data.selected;
@@ -422,7 +436,7 @@
                     host: {
                         'data-testid': 'node'
                     },
-                    styles: [":host{display:block;background:rgba(110,136,255,.8);border:2px solid #4e58bf;border-radius:10px;cursor:pointer;box-sizing:border-box;min-width:180px;height:auto;padding-bottom:6px;position:relative;-webkit-user-select:none;user-select:none;line-height:initial;font-family:Arial}:host:hover{background:rgba(130,153,255,.8)}:host.selected{background:#ffd92c;border-color:#e3c000}:host .title{color:#fff;font-family:sans-serif;font-size:18px;padding:8px}:host .output{text-align:right}:host .input{text-align:left}:host .input-title,:host .output-title{vertical-align:middle;color:#fff;display:inline-block;font-family:sans-serif;font-size:14px;margin:6px;line-height:24px}:host .input-title[hidden],:host .output-title[hidden]{display:none}:host .output-socket{text-align:right;margin-right:-18px;display:inline-block}:host .input-socket{text-align:left;margin-left:-18px;display:inline-block}:host .input-control{z-index:1;width:calc(100% - 36px);vertical-align:middle;display:inline-block}:host .control{padding:6px 18px}\n"]
+                    styles: [":host{display:block;background:rgba(110,136,255,.8);border:2px solid #4e58bf;border-radius:10px;cursor:pointer;box-sizing:border-box;width:180px;height:auto;padding-bottom:6px;position:relative;-webkit-user-select:none;user-select:none;line-height:initial;font-family:Arial}:host:hover{background:rgba(130,153,255,.8)}:host.selected{background:#ffd92c;border-color:#e3c000}:host .title{color:#fff;font-family:sans-serif;font-size:18px;padding:8px}:host .output{text-align:right}:host .input{text-align:left}:host .input-title,:host .output-title{vertical-align:middle;color:#fff;display:inline-block;font-family:sans-serif;font-size:14px;margin:6px;line-height:24px}:host .input-title[hidden],:host .output-title[hidden]{display:none}:host .output-socket{text-align:right;margin-right:-18px;display:inline-block}:host .input-socket{text-align:left;margin-left:-18px;display:inline-block}:host .input-control{z-index:1;width:calc(100% - 36px);vertical-align:middle;display:inline-block}:host .control{padding:6px 18px}\n"]
                 },] }
     ];
     NodeComponent.ctorParameters = function () { return [
@@ -432,6 +446,8 @@
         data: [{ type: core.Input }],
         emit: [{ type: core.Input }],
         rendered: [{ type: core.Input }],
+        width: [{ type: core.HostBinding, args: ['style.width.px',] }],
+        height: [{ type: core.HostBinding, args: ['style.height.px',] }],
         selected: [{ type: core.HostBinding, args: ['class.selected',] }]
     };
 
@@ -500,7 +516,7 @@
     ControlComponent.decorators = [
         { type: core.Component, args: [{
                     template: "<input\n  [value]=\"data.value\"\n  [readonly]=\"data.readonly\"\n  [type]=\"data.type\"\n  (input)=\"onChange($event)\"\n/>\n",
-                    styles: ["input{width:130px;border-radius:30px;background-color:#fff;padding:2px 6px;border:1px solid #999;font-size:110%}\n"]
+                    styles: ["input{width:100%;border-radius:30px;background-color:#fff;padding:2px 6px;border:1px solid #999;font-size:110%;box-sizing:border-box}\n"]
                 },] }
     ];
     ControlComponent.ctorParameters = function () { return [