angular-three-soba 1.4.0 → 1.5.0

package/fesm2015/angular-three-soba-abstractions.mjs

@@ -1,13 +1,13 @@
 import * as i0 from '@angular/core';
-import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, InjectionToken, inject, Directive, EventEmitter, TemplateRef, Output, ContentChild } from '@angular/core';
-import { extend, NgtRxStore, injectNgtRef, NgtStore, NgtPortal, NgtPortalContent, NgtArgs, NgtRepeat, startWithUndefined, NgtPush } from 'angular-three';
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Directive, inject, InjectionToken, EventEmitter, TemplateRef, Output, ContentChild } from '@angular/core';
+import { extend, NgtRxStore, injectNgtRef, NgtStore, startWithUndefined, NgtArgs, NgtPortal, NgtPortalContent, NgtRepeat, NgtPush } from 'angular-three';
 import * as THREE from 'three';
-import { Group, Vector3, Quaternion, Object3D, Matrix4, Mesh, BoxGeometry, MeshBasicMaterial, MeshLambertMaterial, CanvasTexture, AmbientLight, PointLight, Sprite, SpriteMaterial } from 'three';
-import { NgTemplateOutlet, DOCUMENT, NgFor, NgIf } from '@angular/common';
+import { Group, CatmullRomCurve3, Vector3, Quaternion, Object3D, Matrix4, Mesh, BoxGeometry, MeshBasicMaterial, MeshLambertMaterial, CanvasTexture, AmbientLight, PointLight, Sprite, SpriteMaterial } from 'three';
+import { combineLatest, map, switchMap, of } from 'rxjs';
+import { LineMaterial, LineSegmentsGeometry, LineGeometry, LineSegments2, Line2, TextGeometry, FontLoader } from 'three-stdlib';
+import { NgIf, NgTemplateOutlet, DOCUMENT, NgFor } from '@angular/common';
 import { selectSlice } from '@rx-angular/state';
 import { NgtsOrthographicCamera } from 'angular-three-soba/cameras';
-import { combineLatest, map, switchMap, of } from 'rxjs';
-import { TextGeometry, FontLoader } from 'three-stdlib';
 import { RxActionFactory } from '@rx-angular/state/actions';
 import { Text, preloadFont } from 'troika-three-text';
 
@@ -80,6 +80,420 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
                 type: Input
             }] } });
 
+class NgtsLineInput extends NgtRxStore {
+    set vertexColors(vertexColors) {
+        this.set({ vertexColors });
+    }
+    set lineWidth(lineWidth) {
+        this.set({ lineWidth });
+    }
+    set alphaToCoverage(alphaToCoverage) {
+        this.set({ alphaToCoverage });
+    }
+    set color(color) {
+        this.set({ color });
+    }
+    set dashed(dashed) {
+        this.set({ dashed });
+    }
+    set dashScale(dashScale) {
+        this.set({ dashScale });
+    }
+    set dashSize(dashSize) {
+        this.set({ dashSize });
+    }
+    set dashOffset(dashOffset) {
+        this.set({ dashOffset });
+    }
+    set gapSize(gapSize) {
+        this.set({ gapSize });
+    }
+    set resolution(resolution) {
+        this.set({ resolution });
+    }
+    set wireframe(wireframe) {
+        this.set({ wireframe });
+    }
+    set worldUnits(worldUnits) {
+        this.set({ worldUnits });
+    }
+    initialize() {
+        super.initialize();
+        this.set({ color: 'black' });
+    }
+}
+NgtsLineInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsLineInput, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+NgtsLineInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: NgtsLineInput, inputs: { vertexColors: "vertexColors", lineWidth: "lineWidth", alphaToCoverage: "alphaToCoverage", color: "color", dashed: "dashed", dashScale: "dashScale", dashSize: "dashSize", dashOffset: "dashOffset", gapSize: "gapSize", resolution: "resolution", wireframe: "wireframe", worldUnits: "worldUnits" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsLineInput, decorators: [{
+            type: Directive
+        }], propDecorators: { vertexColors: [{
+                type: Input
+            }], lineWidth: [{
+                type: Input
+            }], alphaToCoverage: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], dashed: [{
+                type: Input
+            }], dashScale: [{
+                type: Input
+            }], dashSize: [{
+                type: Input
+            }], dashOffset: [{
+                type: Input
+            }], gapSize: [{
+                type: Input
+            }], resolution: [{
+                type: Input
+            }], wireframe: [{
+                type: Input
+            }], worldUnits: [{
+                type: Input
+            }] } });
+
+class NgtsLine extends NgtsLineInput {
+    constructor() {
+        super(...arguments);
+        this.Boolean = Boolean;
+        this.lineMaterial = new LineMaterial();
+        this.store = inject(NgtStore);
+        this.lineRef = injectNgtRef();
+    }
+    set points(points) {
+        this.set({ points });
+    }
+    set segments(segments) {
+        this.set({ segments });
+    }
+    // TODO: Figure out if this is the case for everything else.
+    // We'd want to run computeLineDistances on the Line2 on "points" changed
+    // Consequently,when "points" changes, LineGeometry also changes and that causes
+    // the Renderer to replace the LineGeometry on the Line2, which is what's happening.
+    // But the effect that runs line.computeLineDistances() runs a little BEFORE the new lineGeometry
+    // has been attached. So it doesn't work with the props changed from the Material
+    //
+    // Alternatively, we can also run the effect on line#children changes.
+    onAfterGeometryAttached({ parent }) {
+        // parent.computeLineDistances();
+    }
+    initialize() {
+        super.initialize();
+        this.set({ segments: false });
+        this.connect('lineGeometry', combineLatest([
+            this.select('points'),
+            this.select('segments'),
+            this.select('vertexColors').pipe(startWithUndefined()),
+        ]).pipe(map(([points, segments, vertexColors]) => {
+            const geometry = segments ? new LineSegmentsGeometry() : new LineGeometry();
+            const pValues = points.map((p) => {
+                const isArray = Array.isArray(p);
+                return p instanceof THREE.Vector3
+                    ? [p.x, p.y, p.z]
+                    : p instanceof THREE.Vector2
+                        ? [p.x, p.y, 0]
+                        : isArray && p.length === 3
+                            ? [p[0], p[1], p[2]]
+                            : isArray && p.length === 2
+                                ? [p[0], p[1], 0]
+                                : p;
+            });
+            geometry.setPositions(pValues.flat());
+            if (vertexColors) {
+                const cValues = vertexColors.map((c) => c instanceof THREE.Color ? c.toArray() : c);
+                geometry.setColors(cValues.flat());
+            }
+            return geometry;
+        })));
+    }
+    ngOnInit() {
+        this.connect('materialResolution', combineLatest([this.store.select('size'), this.select('resolution').pipe(startWithUndefined())]).pipe(map(([size, resolution]) => resolution !== null && resolution !== void 0 ? resolution : [size.width, size.height])));
+        if (!this.lineRef.nativeElement) {
+            this.lineRef.nativeElement = this.get('segments') ? new LineSegments2() : new Line2();
+        }
+        this.computeLineDistances();
+        this.disposeGeometry();
+    }
+    computeLineDistances() {
+        this.hold(combineLatest([this.lineRef.$, this.lineRef.children$('nonObjects'), this.select('points')]), ([line]) => {
+            line.computeLineDistances();
+        });
+    }
+    disposeGeometry() {
+        this.effect(this.select('lineGeometry'), (lineGeometry) => {
+            return () => lineGeometry.dispose();
+        });
+    }
+}
+NgtsLine.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsLine, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsLine.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsLine, isStandalone: true, selector: "ngts-line[points]", inputs: { lineRef: "lineRef", points: "points", segments: "segments" }, usesInheritance: true, ngImport: i0, template: `
+        <ngt-primitive *args="[lineRef.nativeElement]" [ref]="lineRef" ngtCompound>
+            <ngt-primitive
+                *args="[get('lineGeometry')]"
+                attach="geometry"
+                (afterAttach)="onAfterGeometryAttached($any($event))"
+            />
+            <ngt-primitive
+                *args="[lineMaterial]"
+                attach="material"
+                [color]="get('color')"
+                [vertexColors]="Boolean(get('vertexColors'))"
+                [resolution]="get('materialResolution')"
+                [linewidth]="get('lineWidth')"
+                [alphaToCoverage]="get('alphaToCoverage')"
+                [dashed]="get('dashed')"
+                [dashScale]="get('dashScale') ?? lineMaterial.dashScale"
+                [dashSize]="get('dashSize') ?? lineMaterial.dashSize"
+                [dashOffset]="get('dashOffset') ?? lineMaterial.dashOffset"
+                [gapSize]="get('gapSize') ?? lineMaterial.gapSize"
+                [wireframe]="get('wireframe') ?? lineMaterial.wireframe"
+                [worldUnits]="get('worldUnits')"
+            />
+        </ngt-primitive>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgtArgs, selector: "[args]", inputs: ["args"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsLine, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-line[points]',
+                    standalone: true,
+                    template: `
+        <ngt-primitive *args="[lineRef.nativeElement]" [ref]="lineRef" ngtCompound>
+            <ngt-primitive
+                *args="[get('lineGeometry')]"
+                attach="geometry"
+                (afterAttach)="onAfterGeometryAttached($any($event))"
+            />
+            <ngt-primitive
+                *args="[lineMaterial]"
+                attach="material"
+                [color]="get('color')"
+                [vertexColors]="Boolean(get('vertexColors'))"
+                [resolution]="get('materialResolution')"
+                [linewidth]="get('lineWidth')"
+                [alphaToCoverage]="get('alphaToCoverage')"
+                [dashed]="get('dashed')"
+                [dashScale]="get('dashScale') ?? lineMaterial.dashScale"
+                [dashSize]="get('dashSize') ?? lineMaterial.dashSize"
+                [dashOffset]="get('dashOffset') ?? lineMaterial.dashOffset"
+                [gapSize]="get('gapSize') ?? lineMaterial.gapSize"
+                [wireframe]="get('wireframe') ?? lineMaterial.wireframe"
+                [worldUnits]="get('worldUnits')"
+            />
+        </ngt-primitive>
+    `,
+                    imports: [NgtArgs],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { lineRef: [{
+                type: Input
+            }], points: [{
+                type: Input
+            }], segments: [{
+                type: Input
+            }] } });
+
+class NgtsCatmullRomLine extends NgtsLineInput {
+    constructor() {
+        super(...arguments);
+        this.lineRef = injectNgtRef();
+    }
+    set points(points) {
+        this.set({ points });
+    }
+    set closed(closed) {
+        this.set({ closed });
+    }
+    set curveType(curveType) {
+        this.set({ curveType });
+    }
+    set tension(tension) {
+        this.set({ tension });
+    }
+    set segments(segments) {
+        this.set({ segments });
+    }
+    initialize() {
+        super.initialize();
+        this.set({ closed: false, curveType: 'centripetal', tension: 0.5, segments: 64 });
+        this.connect('curve', combineLatest([
+            this.select('points'),
+            this.select('closed'),
+            this.select('curveType'),
+            this.select('tension'),
+        ]).pipe(map(([points, closed, curveType, tension]) => {
+            const mappedPoints = points.map((p) => p instanceof THREE.Vector3 ? p : new THREE.Vector3(...p));
+            return new CatmullRomCurve3(mappedPoints, closed, curveType, tension);
+        })));
+        this.connect('segmentedPoints', combineLatest([this.select('curve'), this.select('segments')]).pipe(map(([curve, segments]) => curve.getPoints(segments))));
+        this.connect('interpolatedVertexColors', combineLatest([this.select('vertexColors').pipe(startWithUndefined()), this.select('segments')]).pipe(map(([vertexColors, segments]) => {
+            if (!vertexColors || vertexColors.length < 2)
+                return undefined;
+            if (vertexColors.length === segments + 1)
+                return vertexColors;
+            const mappedColors = vertexColors.map((color) => color instanceof THREE.Color ? color : new THREE.Color(...color));
+            if (this.get('closed'))
+                mappedColors.push(mappedColors[0].clone());
+            const iColors = [mappedColors[0]];
+            const divisions = segments / (mappedColors.length - 1);
+            for (let i = 0; i < segments; i++) {
+                const alpha = (i % divisions) / divisions;
+                const colorIndex = Math.floor(i / divisions);
+                iColors.push(mappedColors[colorIndex].clone().lerp(mappedColors[colorIndex + 1], alpha));
+            }
+            iColors.push(mappedColors[mappedColors.length - 1]);
+        })));
+    }
+}
+NgtsCatmullRomLine.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsCatmullRomLine, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsCatmullRomLine.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsCatmullRomLine, isStandalone: true, selector: "ngts-catmull-rom-line[points]", inputs: { lineRef: "lineRef", points: "points", closed: "closed", curveType: "curveType", tension: "tension", segments: "segments" }, usesInheritance: true, ngImport: i0, template: `
+        <ngts-line
+            [lineRef]="lineRef"
+            [points]="get('segmentedPoints')"
+            [color]="get('color')"
+            [vertexColors]="get('interpolatedVertexColors')"
+            [resolution]="get('resolution')"
+            [lineWidth]="get('lineWidth')"
+            [alphaToCoverage]="get('alphaToCoverage')"
+            [dashed]="get('dashed')"
+            [dashScale]="get('dashScale')"
+            [dashOffset]="get('dashOffset')"
+            [dashSize]="get('dashSize')"
+            [gapSize]="get('gapSize')"
+            [wireframe]="get('wireframe')"
+            [worldUnits]="get('worldUnits')"
+        />
+    `, isInline: true, dependencies: [{ kind: "component", type: NgtsLine, selector: "ngts-line[points]", inputs: ["lineRef", "points", "segments"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsCatmullRomLine, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-catmull-rom-line[points]',
+                    standalone: true,
+                    template: `
+        <ngts-line
+            [lineRef]="lineRef"
+            [points]="get('segmentedPoints')"
+            [color]="get('color')"
+            [vertexColors]="get('interpolatedVertexColors')"
+            [resolution]="get('resolution')"
+            [lineWidth]="get('lineWidth')"
+            [alphaToCoverage]="get('alphaToCoverage')"
+            [dashed]="get('dashed')"
+            [dashScale]="get('dashScale')"
+            [dashOffset]="get('dashOffset')"
+            [dashSize]="get('dashSize')"
+            [gapSize]="get('gapSize')"
+            [wireframe]="get('wireframe')"
+            [worldUnits]="get('worldUnits')"
+        />
+    `,
+                    imports: [NgtsLine],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { lineRef: [{
+                type: Input
+            }], points: [{
+                type: Input
+            }], closed: [{
+                type: Input
+            }], curveType: [{
+                type: Input
+            }], tension: [{
+                type: Input
+            }], segments: [{
+                type: Input
+            }] } });
+
+class NgtsCubicBezierLine extends NgtsLineInput {
+    constructor() {
+        super(...arguments);
+        this.lineRef = injectNgtRef();
+    }
+    set start(start) {
+        this.set({ start });
+    }
+    set end(end) {
+        this.set({ end });
+    }
+    set midA(midA) {
+        this.set({ midA });
+    }
+    set midB(midB) {
+        this.set({ midB });
+    }
+    set segments(segments) {
+        this.set({ segments });
+    }
+    initialize() {
+        super.initialize();
+        this.set({ segments: 10 });
+        this.connect('points', this.select(['start', 'end', 'midA', 'midB', 'segments'], ({ start, end, midA, midB, segments }) => {
+            const startV = start instanceof THREE.Vector3 ? start : new THREE.Vector3(...start);
+            const endV = end instanceof THREE.Vector3 ? end : new THREE.Vector3(...end);
+            const midAV = midA instanceof THREE.Vector3 ? midA : new THREE.Vector3(...midA);
+            const midBV = midB instanceof THREE.Vector3 ? midB : new THREE.Vector3(...midB);
+            return new THREE.CubicBezierCurve3(startV, midAV, midBV, endV).getPoints(segments);
+        }));
+    }
+}
+NgtsCubicBezierLine.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsCubicBezierLine, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsCubicBezierLine.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsCubicBezierLine, isStandalone: true, selector: "ngts-cubic-bezier-line[start][end][midA][midB]", inputs: { lineRef: "lineRef", start: "start", end: "end", midA: "midA", midB: "midB", segments: "segments" }, usesInheritance: true, ngImport: i0, template: `
+        <ngts-line
+            [lineRef]="lineRef"
+            [points]="get('points')"
+            [color]="get('color')"
+            [vertexColors]="get('vertexColors')"
+            [resolution]="get('resolution')"
+            [lineWidth]="get('lineWidth')"
+            [alphaToCoverage]="get('alphaToCoverage')"
+            [dashed]="get('dashed')"
+            [dashScale]="get('dashScale')"
+            [dashSize]="get('dashSize')"
+            [dashOffset]="get('dashOffset')"
+            [gapSize]="get('gapSize')"
+            [wireframe]="get('wireframe')"
+            [worldUnits]="get('worldUnits')"
+        />
+    `, isInline: true, dependencies: [{ kind: "component", type: NgtsLine, selector: "ngts-line[points]", inputs: ["lineRef", "points", "segments"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsCubicBezierLine, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-cubic-bezier-line[start][end][midA][midB]',
+                    standalone: true,
+                    template: `
+        <ngts-line
+            [lineRef]="lineRef"
+            [points]="get('points')"
+            [color]="get('color')"
+            [vertexColors]="get('vertexColors')"
+            [resolution]="get('resolution')"
+            [lineWidth]="get('lineWidth')"
+            [alphaToCoverage]="get('alphaToCoverage')"
+            [dashed]="get('dashed')"
+            [dashScale]="get('dashScale')"
+            [dashSize]="get('dashSize')"
+            [dashOffset]="get('dashOffset')"
+            [gapSize]="get('gapSize')"
+            [wireframe]="get('wireframe')"
+            [worldUnits]="get('worldUnits')"
+        />
+    `,
+                    imports: [NgtsLine, NgIf],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { lineRef: [{
+                type: Input
+            }], start: [{
+                type: Input
+            }], end: [{
+                type: Input
+            }], midA: [{
+                type: Input
+            }], midB: [{
+                type: Input
+            }], segments: [{
+                type: Input
+            }] } });
+
 const isOrbitControls = (controls) => {
     return 'minPolarAngle' in controls;
 };
@@ -1181,6 +1595,126 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
                 type: Output
             }] } });
 
+const v = new THREE.Vector3();
+class NgtsQuadraticBezierLine extends NgtsLineInput {
+    constructor() {
+        super(...arguments);
+        this.curve = new THREE.QuadraticBezierCurve3(undefined, undefined, undefined);
+        this.lineRef = injectNgtRef();
+    }
+    set start(start) {
+        this.set({ start });
+    }
+    set end(end) {
+        this.set({ end });
+    }
+    set mid(mid) {
+        this.set({ mid });
+    }
+    set segments(segments) {
+        this.set({ segments });
+    }
+    initialize() {
+        super.initialize();
+        this.set({ start: [0, 0, 0], end: [0, 0, 0], segments: 20 });
+    }
+    ngOnInit() {
+        this.connect('points', combineLatest([
+            this.select('start'),
+            this.select('end'),
+            this.select('mid').pipe(startWithUndefined()),
+            this.select('segments'),
+        ]).pipe(map(([start, end, mid, segments]) => this.getPoints(start, end, mid, segments))));
+        this.replaceSetPoints();
+    }
+    replaceSetPoints() {
+        this.hold(this.lineRef.$, (line) => {
+            line.setPoints = (start, end, mid) => {
+                const points = this.getPoints(start, end, mid);
+                if (this.lineRef.nativeElement.geometry) {
+                    this.lineRef.nativeElement.geometry.setPositions(points.map((p) => p.toArray()).flat());
+                }
+            };
+        });
+    }
+    getPoints(start, end, mid, segments = 20) {
+        if (start instanceof THREE.Vector3)
+            this.curve.v0.copy(start);
+        else
+            this.curve.v0.set(...start);
+        if (end instanceof THREE.Vector3)
+            this.curve.v2.copy(end);
+        else
+            this.curve.v2.set(...end);
+        if (mid instanceof THREE.Vector3) {
+            this.curve.v1.copy(mid);
+        }
+        else {
+            this.curve.v1.copy(this.curve.v0
+                .clone()
+                .add(this.curve.v2.clone().sub(this.curve.v0))
+                .add(v.set(0, this.curve.v0.y - this.curve.v2.y, 0)));
+        }
+        return this.curve.getPoints(segments);
+    }
+}
+NgtsQuadraticBezierLine.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsQuadraticBezierLine, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NgtsQuadraticBezierLine.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: NgtsQuadraticBezierLine, isStandalone: true, selector: "ngts-quadratic-bezier-line", inputs: { lineRef: "lineRef", start: "start", end: "end", mid: "mid", segments: "segments" }, usesInheritance: true, ngImport: i0, template: `
+        <ngts-line
+            [lineRef]="lineRef"
+            [points]="get('points')"
+            [color]="get('color')"
+            [vertexColors]="get('vertexColors')"
+            [resolution]="get('resolution')"
+            [lineWidth]="get('lineWidth')"
+            [alphaToCoverage]="get('alphaToCoverage')"
+            [dashed]="get('dashed')"
+            [dashScale]="get('dashScale')"
+            [dashSize]="get('dashSize')"
+            [dashOffset]="get('dashOffset')"
+            [gapSize]="get('gapSize')"
+            [wireframe]="get('wireframe')"
+            [worldUnits]="get('worldUnits')"
+        />
+    `, isInline: true, dependencies: [{ kind: "component", type: NgtsLine, selector: "ngts-line[points]", inputs: ["lineRef", "points", "segments"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: NgtsQuadraticBezierLine, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngts-quadratic-bezier-line',
+                    standalone: true,
+                    template: `
+        <ngts-line
+            [lineRef]="lineRef"
+            [points]="get('points')"
+            [color]="get('color')"
+            [vertexColors]="get('vertexColors')"
+            [resolution]="get('resolution')"
+            [lineWidth]="get('lineWidth')"
+            [alphaToCoverage]="get('alphaToCoverage')"
+            [dashed]="get('dashed')"
+            [dashScale]="get('dashScale')"
+            [dashSize]="get('dashSize')"
+            [dashOffset]="get('dashOffset')"
+            [gapSize]="get('gapSize')"
+            [wireframe]="get('wireframe')"
+            [worldUnits]="get('worldUnits')"
+        />
+    `,
+                    imports: [NgtsLine],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], propDecorators: { lineRef: [{
+                type: Input
+            }], start: [{
+                type: Input
+            }], end: [{
+                type: Input
+            }], mid: [{
+                type: Input
+            }], segments: [{
+                type: Input
+            }] } });
+
 extend({ Mesh, TextGeometry });
 class NgtsText3D extends NgtRxStore {
     constructor() {
@@ -1427,5 +1961,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { NGTS_GIZMO_HELPER_API, NgtsBillboard, NgtsGizmoHelper, NgtsGizmoHelperContent, NgtsGizmoViewcube, NgtsGizmoViewport, NgtsText, NgtsText3D };
+export { NGTS_GIZMO_HELPER_API, NgtsBillboard, NgtsCatmullRomLine, NgtsCubicBezierLine, NgtsGizmoHelper, NgtsGizmoHelperContent, NgtsGizmoViewcube, NgtsGizmoViewport, NgtsLine, NgtsQuadraticBezierLine, NgtsText, NgtsText3D };
 //# sourceMappingURL=angular-three-soba-abstractions.mjs.map