@twick/2d 0.11.0

package/lib/components/Path.d.ts

@@ -0,0 +1,20 @@
+import type { SignalValue, SimpleSignal, TimingFunction, Vector2 } from '@twick/core';
+import { BBox } from '@twick/core';
+import type { CurveProfile } from '../curves';
+import type { CurveProps } from './Curve';
+import { Curve } from './Curve';
+export interface PathProps extends CurveProps {
+    data: SignalValue<string>;
+}
+export declare class Path extends Curve {
+    private currentProfile;
+    readonly data: SimpleSignal<string, this>;
+    constructor(props: PathProps);
+    profile(): CurveProfile;
+    protected childrenBBox(): BBox;
+    protected lineWidthCoefficient(): number;
+    protected processSubpath(path: Path2D, startPoint: Vector2 | null, endPoint: Vector2 | null): void;
+    protected tweenData(newPath: SignalValue<string>, time: number, timingFunction: TimingFunction): Generator<void | import("@twick/core").ThreadGenerator | Promise<any> | import("@twick/core").Promisable<any>, void, any>;
+    drawOverlay(context: CanvasRenderingContext2D, matrix: DOMMatrix): void;
+}
+//# sourceMappingURL=Path.d.ts.map

package/lib/components/Path.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Path.d.ts","sourceRoot":"","sources":["../../src/lib/components/Path.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EACX,YAAY,EACZ,cAAc,EACd,OAAO,EACR,MAAM,aAAa,CAAC;AACrB,OAAO,EACL,IAAI,EAML,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,WAAW,CAAC;AAK5C,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AACxC,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAE9B,MAAM,WAAW,SAAU,SAAQ,UAAU;IAC3C,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC3B;AAED,qBAAa,IAAK,SAAQ,KAAK;IAC7B,OAAO,CAAC,cAAc,CAA2C;IACjE,SACwB,IAAI,EAAE,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;gBAEtC,KAAK,EAAE,SAAS;IAMnB,OAAO,IAAI,YAAY;cAIpB,YAAY;cAKZ,oBAAoB,IAAI,MAAM;cAe9B,cAAc,CAC/B,IAAI,EAAE,MAAM,EACZ,UAAU,EAAE,OAAO,GAAG,IAAI,EAC1B,QAAQ,EAAE,OAAO,GAAG,IAAI,GACvB,IAAI;IAOP,SAAS,CAAE,SAAS,CAClB,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,EAC5B,IAAI,EAAE,MAAM,EACZ,cAAc,EAAE,cAAc;IAqBhB,WAAW,CACzB,OAAO,EAAE,wBAAwB,EACjC,MAAM,EAAE,SAAS,GAChB,IAAI;CAqCR"}

package/lib/components/Path.js

@@ -0,0 +1,97 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { BBox, createSignal, isReactive, threadable, transformVectorAsPoint, tween, } from '@twick/core';
+import { createCurveProfileLerp } from '../curves/createCurveProfileLerp';
+import { getPathProfile } from '../curves/getPathProfile';
+import { computed, signal } from '../decorators';
+import { drawLine, drawPivot } from '../utils';
+import { Curve } from './Curve';
+export class Path extends Curve {
+    constructor(props) {
+        super(props);
+        this.currentProfile = createSignal(null);
+        this.canHaveSubpath = true;
+    }
+    profile() {
+        return this.currentProfile() ?? getPathProfile(this.data());
+    }
+    childrenBBox() {
+        const points = this.profile().segments.flatMap(segment => segment.points);
+        return BBox.fromPoints(...points);
+    }
+    lineWidthCoefficient() {
+        const join = this.lineJoin();
+        let coefficient = super.lineWidthCoefficient();
+        if (join === 'miter') {
+            const { minSin } = this.profile();
+            if (minSin > 0) {
+                coefficient = Math.max(coefficient, 0.5 / minSin);
+            }
+        }
+        return coefficient;
+    }
+    processSubpath(path, startPoint, endPoint) {
+        if (startPoint && endPoint && startPoint.equals(endPoint)) {
+            path.closePath();
+        }
+    }
+    *tweenData(newPath, time, timingFunction) {
+        const fromProfile = this.profile();
+        const toProfile = getPathProfile(isReactive(newPath) ? newPath() : newPath);
+        const interpolator = createCurveProfileLerp(fromProfile, toProfile);
+        this.currentProfile(fromProfile);
+        yield* tween(time, value => {
+            const progress = timingFunction(value);
+            this.currentProfile(interpolator(progress));
+        }, () => {
+            this.currentProfile(null);
+            this.data(newPath);
+        });
+    }
+    drawOverlay(context, matrix) {
+        const box = this.childrenBBox().transformCorners(matrix);
+        const size = this.computedSize();
+        const offsetVector = size.mul(this.offset()).scale(0.5);
+        const offset = transformVectorAsPoint(offsetVector, matrix);
+        const segments = this.profile().segments;
+        context.lineWidth = 1;
+        context.strokeStyle = 'white';
+        context.fillStyle = 'white';
+        context.save();
+        context.setTransform(matrix);
+        let endPoint = null;
+        let path = new Path2D();
+        for (const segment of segments) {
+            if (endPoint && !segment.getPoint(0).position.equals(endPoint)) {
+                context.stroke(path);
+                path = new Path2D();
+                endPoint = null;
+            }
+            const [, end] = segment.draw(path, 0, 1, endPoint == null);
+            endPoint = end.position;
+        }
+        context.stroke(path);
+        context.restore();
+        context.beginPath();
+        drawPivot(context, offset);
+        context.stroke();
+        context.beginPath();
+        drawLine(context, box);
+        context.closePath();
+        context.stroke();
+    }
+}
+__decorate([
+    signal()
+], Path.prototype, "data", void 0);
+__decorate([
+    computed()
+], Path.prototype, "profile", null);
+__decorate([
+    threadable()
+], Path.prototype, "tweenData", null);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUGF0aC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9QYXRoLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7OztBQU1BLE9BQU8sRUFDTCxJQUFJLEVBQ0osWUFBWSxFQUNaLFVBQVUsRUFDVixVQUFVLEVBQ1Ysc0JBQXNCLEVBQ3RCLEtBQUssR0FDTixNQUFNLGFBQWEsQ0FBQztBQUVyQixPQUFPLEVBQUMsc0JBQXNCLEVBQUMsTUFBTSxrQ0FBa0MsQ0FBQztBQUN4RSxPQUFPLEVBQUMsY0FBYyxFQUFDLE1BQU0sMEJBQTBCLENBQUM7QUFDeEQsT0FBTyxFQUFDLFFBQVEsRUFBRSxNQUFNLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDL0MsT0FBTyxFQUFDLFFBQVEsRUFBRSxTQUFTLEVBQUMsTUFBTSxVQUFVLENBQUM7QUFFN0MsT0FBTyxFQUFDLEtBQUssRUFBQyxNQUFNLFNBQVMsQ0FBQztBQU05QixNQUFNLE9BQU8sSUFBSyxTQUFRLEtBQUs7SUFLN0IsWUFBbUIsS0FBZ0I7UUFDakMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBTFAsbUJBQWMsR0FBRyxZQUFZLENBQXNCLElBQUksQ0FBQyxDQUFDO1FBTS9ELElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDO0lBQzdCLENBQUM7SUFHZSxPQUFPO1FBQ3JCLE9BQU8sSUFBSSxDQUFDLGNBQWMsRUFBRSxJQUFJLGNBQWMsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQztJQUM5RCxDQUFDO0lBRWtCLFlBQVk7UUFDN0IsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLEVBQUUsQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDMUUsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDLEdBQUcsTUFBTSxDQUFDLENBQUM7SUFDcEMsQ0FBQztJQUVr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

package/lib/components/Polygon.d.ts

@@ -0,0 +1,113 @@
+import type { SerializedVector2, SignalValue, SimpleSignal } from '@twick/core';
+import { BBox } from '@twick/core';
+import type { CurveProfile } from '../curves';
+import type { DesiredLength } from '../partials';
+import type { CurveProps } from './Curve';
+import { Curve } from './Curve';
+export interface PolygonProps extends CurveProps {
+    /**
+     * {@inheritDoc Polygon.sides}
+     */
+    sides?: SignalValue<number>;
+    /**
+     * {@inheritDoc Polygon.radius}
+     */
+    radius?: SignalValue<number>;
+}
+/**
+ * A node for drawing regular polygons.
+ *
+ * @remarks
+ * This node can be used to render shapes such as: triangle, pentagon,
+ * hexagon and more.
+ *
+ * Note that the polygon is inscribed in a circle defined by the height
+ * and width. If height and width are unequal, the polygon is inscribed
+ * in the resulting ellipse.
+ *
+ * Since the polygon is inscribed in the circle, the actual displayed
+ * height and width may differ somewhat from the bounding rectangle. This
+ * will be particularly noticeable if the number of sides is low, e.g. for a
+ * triangle.
+ *
+ * @preview
+ * ```tsx editor
+ * // snippet Polygon
+ * import {makeScene2D, Polygon} from '@twick/2d';
+ * import {createRef} from '@twick/core';
+ *
+ * export default makeScene2D(function* (view) {
+ *   const ref = createRef<Polygon>();
+ *   view.add(
+ *     <Polygon
+ *       ref={ref}
+ *       sides={6}
+ *       size={160}
+ *       fill={'lightseagreen'}
+ *     />
+ *   );
+ *
+ *   yield* ref().sides(3, 2).to(6, 2);
+ * });
+ *
+ * // snippet Pentagon outline
+ * import {makeScene2D, Polygon} from '@twick/2d';
+ *
+ * export default makeScene2D(function* (view) {
+ *   view.add(
+ *     <Polygon
+ *       sides={5}
+ *       size={160}
+ *       radius={30}
+ *       stroke={'lightblue'}
+ *       lineWidth={8}
+ *     />
+ *   );
+ * });
+ * ```
+ */
+export declare class Polygon extends Curve {
+    /**
+     * The number of sides of the polygon.
+     *
+     * @remarks
+     * For example, a value of 6 creates a hexagon.
+     *
+     * @example
+     * ```tsx
+     * <Polygon
+     *   size={320}
+     *   sides={7}
+     *   stroke={'#fff'}
+     *   lineWidth={8}
+     *   fill={'lightseagreen'}
+     * />
+     * ```
+     */
+    readonly sides: SimpleSignal<number, this>;
+    /**
+     * The radius of the polygon's corners.
+     *
+     * @example
+     * ```tsx
+     * <Polygon
+     *   radius={30}
+     *   size={320}
+     *   sides={3}
+     *   stroke={'#fff'}
+     *   lineWidth={8}
+     * />
+     * ```
+     */
+    readonly radius: SimpleSignal<number, this>;
+    constructor(props: PolygonProps);
+    profile(): CurveProfile;
+    protected desiredSize(): SerializedVector2<DesiredLength>;
+    protected offsetComputedLayout(box: BBox): BBox;
+    protected childrenBBox(): BBox;
+    protected requiresProfile(): boolean;
+    protected getPath(): Path2D;
+    protected getRipplePath(): Path2D;
+    protected createPath(expand?: number): Path2D;
+}
+//# sourceMappingURL=Polygon.d.ts.map

package/lib/components/Polygon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Polygon.d.ts","sourceRoot":"","sources":["../../src/lib/components/Polygon.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,iBAAiB,EAAE,WAAW,EAAE,YAAY,EAAC,MAAM,aAAa,CAAC;AAC9E,OAAO,EAAC,IAAI,EAAU,MAAM,aAAa,CAAC;AAC1C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,WAAW,CAAC;AAG5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,aAAa,CAAC;AAE/C,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AACxC,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAE9B,MAAM,WAAW,YAAa,SAAQ,UAAU;IAC9C;;OAEG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,qBAAa,OAAQ,SAAQ,KAAK;IAChC;;;;;;;;;;;;;;;;OAgBG;IACH,SAEwB,KAAK,EAAE,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IAE1D;;;;;;;;;;;;;OAaG;IACH,SAEwB,MAAM,EAAE,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;gBAExC,KAAK,EAAE,YAAY;IAKtB,OAAO,IAAI,YAAY;cAepB,WAAW,IAAI,iBAAiB,CAAC,aAAa,CAAC;cAO/C,oBAAoB,CAAC,GAAG,EAAE,IAAI,GAAG,IAAI;cAIrC,YAAY,IAAI,IAAI;cAIpB,eAAe,IAAI,OAAO;cAI1B,OAAO,IAAI,MAAM;cAOjB,aAAa,IAAI,MAAM;IAI1C,SAAS,CAAC,UAAU,CAAC,MAAM,SAAI;CAOhC"}

package/lib/components/Polygon.js

@@ -0,0 +1,123 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { BBox, Vector2 } from '@twick/core';
+import { getPolylineProfile } from '../curves';
+import { computed, initial, signal } from '../decorators';
+import { drawPolygon } from '../utils';
+import { Curve } from './Curve';
+/**
+ * A node for drawing regular polygons.
+ *
+ * @remarks
+ * This node can be used to render shapes such as: triangle, pentagon,
+ * hexagon and more.
+ *
+ * Note that the polygon is inscribed in a circle defined by the height
+ * and width. If height and width are unequal, the polygon is inscribed
+ * in the resulting ellipse.
+ *
+ * Since the polygon is inscribed in the circle, the actual displayed
+ * height and width may differ somewhat from the bounding rectangle. This
+ * will be particularly noticeable if the number of sides is low, e.g. for a
+ * triangle.
+ *
+ * @preview
+ * ```tsx editor
+ * // snippet Polygon
+ * import {makeScene2D, Polygon} from '@twick/2d';
+ * import {createRef} from '@twick/core';
+ *
+ * export default makeScene2D(function* (view) {
+ *   const ref = createRef<Polygon>();
+ *   view.add(
+ *     <Polygon
+ *       ref={ref}
+ *       sides={6}
+ *       size={160}
+ *       fill={'lightseagreen'}
+ *     />
+ *   );
+ *
+ *   yield* ref().sides(3, 2).to(6, 2);
+ * });
+ *
+ * // snippet Pentagon outline
+ * import {makeScene2D, Polygon} from '@twick/2d';
+ *
+ * export default makeScene2D(function* (view) {
+ *   view.add(
+ *     <Polygon
+ *       sides={5}
+ *       size={160}
+ *       radius={30}
+ *       stroke={'lightblue'}
+ *       lineWidth={8}
+ *     />
+ *   );
+ * });
+ * ```
+ */
+export class Polygon extends Curve {
+    constructor(props) {
+        super(props);
+    }
+    profile() {
+        const sides = this.sides();
+        const radius = this.radius();
+        const points = [];
+        const size = this.computedSize().scale(0.5);
+        for (let i = 0; i < sides; i++) {
+            const theta = (i * 2 * Math.PI) / sides;
+            const direction = Vector2.fromRadians(theta).perpendicular;
+            points.push(direction.mul(size));
+        }
+        return getPolylineProfile(points, radius, true);
+    }
+    desiredSize() {
+        return {
+            x: this.width.context.getter(),
+            y: this.height.context.getter(),
+        };
+    }
+    offsetComputedLayout(box) {
+        return box;
+    }
+    childrenBBox() {
+        return BBox.fromSizeCentered(this.computedSize());
+    }
+    requiresProfile() {
+        return super.requiresProfile() || this.radius() > 0;
+    }
+    getPath() {
+        if (this.requiresProfile()) {
+            return this.curveDrawingInfo().path;
+        }
+        return this.createPath();
+    }
+    getRipplePath() {
+        return this.createPath(this.rippleSize());
+    }
+    createPath(expand = 0) {
+        const path = new Path2D();
+        const sides = this.sides();
+        const box = BBox.fromSizeCentered(this.size()).expand(expand);
+        drawPolygon(path, box, sides);
+        return path;
+    }
+}
+__decorate([
+    initial(6),
+    signal()
+], Polygon.prototype, "sides", void 0);
+__decorate([
+    initial(0),
+    signal()
+], Polygon.prototype, "radius", void 0);
+__decorate([
+    computed()
+], Polygon.prototype, "profile", null);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUG9seWdvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9Qb2x5Z29uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7OztBQUNBLE9BQU8sRUFBQyxJQUFJLEVBQUUsT0FBTyxFQUFDLE1BQU0sYUFBYSxDQUFDO0FBRTFDLE9BQU8sRUFBQyxrQkFBa0IsRUFBQyxNQUFNLFdBQVcsQ0FBQztBQUM3QyxPQUFPLEVBQUMsUUFBUSxFQUFFLE9BQU8sRUFBRSxNQUFNLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFFeEQsT0FBTyxFQUFDLFdBQVcsRUFBQyxNQUFNLFVBQVUsQ0FBQztBQUVyQyxPQUFPLEVBQUMsS0FBSyxFQUFDLE1BQU0sU0FBUyxDQUFDO0FBYTlCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FtREc7QUFDSCxNQUFNLE9BQU8sT0FBUSxTQUFRLEtBQUs7SUF3Q2hDLFlBQW1CLEtBQW1CO1FBQ3BDLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNmLENBQUM7SUFHZSxPQUFPO1FBQ3JCLE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUMzQixNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUM7UUFFN0IsTUFBTSxNQUFNLEdBQUcsRUFBRSxDQUFDO1FBQ2xCLE1BQU0sSUFBSSxHQUFHLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUM7UUFDNUMsS0FBSyxJQUFJLENBQUMsR0FBRyxDQUFDLEVBQUUsQ0FBQyxHQUFHLEtBQUssRUFBRSxDQUFDLEVBQUUsRUFBRSxDQUFDO1lBQy9CLE1BQU0sS0FBSyxHQUFHLENBQUMsQ0FBQyxHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsRUFBRSxDQUFDLEdBQUcsS0FBSyxDQUFDO1lBQ3hDLE1BQU0sU0FBUyxHQUFHLE9BQU8sQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLENBQUMsYUFBYSxDQUFDO1lBQzNELE1BQU0sQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQ25DLENBQUM7UUFFRCxPQUFPLGtCQUFrQixDQUFDLE1BQU0sRUFBRSxNQUFNLEVBQUUsSUFBSSxDQUFDLENBQUM7SUFDbEQsQ0FBQztJQUVrQixXQUFXO1FBQzVCLE9BQU87WUFDTCxDQUFDLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUMsTUFBTSxFQUFFO1lBQzlCLENBQUMsRUFBRSxJQUFJLENBQUMsTUFBTSxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUU7U0FDaEMsQ0FBQztJQUNKLENBQUM7SUFFa0Isb0JBQW9CLENBQUMsR0FBUztRQUMvQyxPQUFPLEdBQUcsQ0FBQztJQUNiLENBQUM7SUFFa0IsWUFBWTtRQUM3QixPQUFPLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUMsQ0FBQztJQUNwRCxDQUFDO0lBRWtCLGVBQWU7UUFDaEMsT0FBTyxLQUFLLENBQUMsZUFBZSxFQUFFLElBQUksSUFBSSxDQUFDLE1BQU0sRUFBRSxHQUFHLENBQUMsQ0FBQztJQUN0RCxDQUFDO0lBRWtCLE9BQU87UUFDeEIsSUFBSSxJQUFJLENBQUMsZUFBZSxFQUFFLEVBQUUsQ0FBQztZQUMzQixPQUFPLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDLElBQUksQ0FBQztRQUN0QyxDQUFDO1FBRUQsT0FBTyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUM7SUFDM0IsQ0FBQztJQUNrQixhQUFhO1FBQzlCLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUMsQ0FBQztJQUM1QyxDQUFDO0lBRVMsVUFBVSxDQUFDLE1BQU0sR0FBRyxDQUFDO1FBQzdCLE1BQU0sSUFBSSxHQUFHLElBQUksTUFBTSxFQUFFLENBQUM7UUFDMUIsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQzNCLE1BQU0sR0FBRyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDOUQsV0FBVyxDQUFDLElBQUksRUFBRSxHQUFHLEVBQUUsS0FBSyxDQUFDLENBQUM7UUFDOUIsT0FBTyxJQUFJLENBQUM7SUFDZCxDQUFDO0NBQ0Y7QUE3RXlCO0lBRnZCLE9BQU8sQ0FBQyxDQUFDLENBQUM7SUFDVixNQUFNLEVBQUU7c0NBQ2lEO0FBa0JsQztJQUZ2QixPQUFPLENBQUMsQ0FBQyxDQUFDO0lBQ1YsTUFBTSxFQUFFO3VDQUNrRDtBQU8zQztJQURmLFFBQVEsRUFBRTtzQ0FjViJ9

package/lib/components/QuadBezier.d.ts

@@ -0,0 +1,62 @@
+import type { PossibleVector2, SignalValue, Vector2Signal } from '@twick/core';
+import type { PolynomialSegment } from '../curves/PolynomialSegment';
+import type { BezierOverlayInfo } from './Bezier';
+import { Bezier } from './Bezier';
+import type { CurveProps } from './Curve';
+export interface QuadBezierProps extends CurveProps {
+    p0?: SignalValue<PossibleVector2>;
+    p0X?: SignalValue<number>;
+    p0Y?: SignalValue<number>;
+    p1?: SignalValue<PossibleVector2>;
+    p1X?: SignalValue<number>;
+    p1Y?: SignalValue<number>;
+    p2?: SignalValue<PossibleVector2>;
+    p2X?: SignalValue<number>;
+    p2Y?: SignalValue<number>;
+}
+/**
+ * A node for drawing a quadratic Bézier curve.
+ *
+ * @preview
+ * ```tsx editor
+ * import {makeScene2D, QuadBezier} from '@twick/2d';
+ * import {createRef} from '@twick/core';
+ *
+ * export default makeScene2D(function* (view) {
+ *   const bezier = createRef<QuadBezier>();
+ *
+ *   view.add(
+ *     <QuadBezier
+ *       ref={bezier}
+ *       lineWidth={4}
+ *       stroke={'lightseagreen'}
+ *       p0={[-200, 0]}
+ *       p1={[0, -200]}
+ *       p2={[200, 0]}
+ *       end={0}
+ *     />
+ *   );
+ *
+ *   yield* bezier().end(1, 1);
+ *   yield* bezier().start(1, 1).to(0, 1);
+ * });
+ * ```
+ */
+export declare class QuadBezier extends Bezier {
+    /**
+     * The start point of the Bézier curve.
+     */
+    readonly p0: Vector2Signal<this>;
+    /**
+     * The control point of the Bézier curve.
+     */
+    readonly p1: Vector2Signal<this>;
+    /**
+     * The end point of the Bézier curve.
+     */
+    readonly p2: Vector2Signal<this>;
+    constructor(props: QuadBezierProps);
+    protected segment(): PolynomialSegment;
+    protected overlayInfo(matrix: DOMMatrix): BezierOverlayInfo;
+}
+//# sourceMappingURL=QuadBezier.d.ts.map

package/lib/components/QuadBezier.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QuadBezier.d.ts","sourceRoot":"","sources":["../../src/lib/components/QuadBezier.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,eAAe,EAAE,WAAW,EAAE,aAAa,EAAC,MAAM,aAAa,CAAC;AAE7E,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,6BAA6B,CAAC;AAGnE,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,UAAU,CAAC;AAChD,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAChC,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AAExC,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,EAAE,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAClC,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAE1B,EAAE,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAClC,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAE1B,EAAE,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAClC,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,qBAAa,UAAW,SAAQ,MAAM;IACpC;;OAEG;IACH,SACwB,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAEhD;;OAEG;IACH,SACwB,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAEhD;;OAEG;IACH,SACwB,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;gBAE7B,KAAK,EAAE,eAAe;IAKzC,SAAS,CAAC,OAAO,IAAI,iBAAiB;IAItC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,SAAS,GAAG,iBAAiB;CAoB5D"}

package/lib/components/QuadBezier.js

@@ -0,0 +1,76 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { QuadBezierSegment } from '../curves';
+import { computed, vector2Signal } from '../decorators';
+import { lineTo, moveTo, quadraticCurveTo } from '../utils';
+import { Bezier } from './Bezier';
+/**
+ * A node for drawing a quadratic Bézier curve.
+ *
+ * @preview
+ * ```tsx editor
+ * import {makeScene2D, QuadBezier} from '@twick/2d';
+ * import {createRef} from '@twick/core';
+ *
+ * export default makeScene2D(function* (view) {
+ *   const bezier = createRef<QuadBezier>();
+ *
+ *   view.add(
+ *     <QuadBezier
+ *       ref={bezier}
+ *       lineWidth={4}
+ *       stroke={'lightseagreen'}
+ *       p0={[-200, 0]}
+ *       p1={[0, -200]}
+ *       p2={[200, 0]}
+ *       end={0}
+ *     />
+ *   );
+ *
+ *   yield* bezier().end(1, 1);
+ *   yield* bezier().start(1, 1).to(0, 1);
+ * });
+ * ```
+ */
+export class QuadBezier extends Bezier {
+    constructor(props) {
+        super(props);
+    }
+    segment() {
+        return new QuadBezierSegment(this.p0(), this.p1(), this.p2());
+    }
+    overlayInfo(matrix) {
+        const [p0, p1, p2] = this.segment().transformPoints(matrix);
+        const curvePath = new Path2D();
+        moveTo(curvePath, p0);
+        quadraticCurveTo(curvePath, p1, p2);
+        const handleLinesPath = new Path2D();
+        moveTo(handleLinesPath, p0);
+        lineTo(handleLinesPath, p1);
+        lineTo(handleLinesPath, p2);
+        return {
+            curve: curvePath,
+            startPoint: p0,
+            endPoint: p2,
+            controlPoints: [p1],
+            handleLines: handleLinesPath,
+        };
+    }
+}
+__decorate([
+    vector2Signal('p0')
+], QuadBezier.prototype, "p0", void 0);
+__decorate([
+    vector2Signal('p1')
+], QuadBezier.prototype, "p1", void 0);
+__decorate([
+    vector2Signal('p2')
+], QuadBezier.prototype, "p2", void 0);
+__decorate([
+    computed()
+], QuadBezier.prototype, "segment", null);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUXVhZEJlemllci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9RdWFkQmV6aWVyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7OztBQUNBLE9BQU8sRUFBQyxpQkFBaUIsRUFBQyxNQUFNLFdBQVcsQ0FBQztBQUU1QyxPQUFPLEVBQUMsUUFBUSxFQUFFLGFBQWEsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUN0RCxPQUFPLEVBQUMsTUFBTSxFQUFFLE1BQU0sRUFBRSxnQkFBZ0IsRUFBQyxNQUFNLFVBQVUsQ0FBQztBQUUxRCxPQUFPLEVBQUMsTUFBTSxFQUFDLE1BQU0sVUFBVSxDQUFDO0FBaUJoQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBMkJHO0FBQ0gsTUFBTSxPQUFPLFVBQVcsU0FBUSxNQUFNO0lBbUJwQyxZQUFtQixLQUFzQjtRQUN2QyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDZixDQUFDO0lBR1MsT0FBTztRQUNmLE9BQU8sSUFBSSxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsRUFBRSxFQUFFLEVBQUUsSUFBSSxDQUFDLEVBQUUsRUFBRSxFQUFFLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDO0lBQ2hFLENBQUM7SUFFUyxXQUFXLENBQUMsTUFBaUI7UUFDckMsTUFBTSxDQUFDLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxDQUFDLEdBQUcsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDLGVBQWUsQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUU1RCxNQUFNLFNBQVMsR0FBRyxJQUFJLE1BQU0sRUFBRSxDQUFDO1FBQy9CLE1BQU0sQ0FBQyxTQUFTLEVBQUUsRUFBRSxDQUFDLENBQUM7UUFDdEIsZ0JBQWdCLENBQUMsU0FBUyxFQUFFLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQztRQUVwQyxNQUFNLGVBQWUsR0FBRyxJQUFJLE1BQU0sRUFBRSxDQUFDO1FBQ3JDLE1BQU0sQ0FBQyxlQUFlLEVBQUUsRUFBRSxDQUFDLENBQUM7UUFDNUIsTUFBTSxDQUFDLGVBQWUsRUFBRSxFQUFFLENBQUMsQ0FBQztRQUM1QixNQUFNLENBQUMsZUFBZSxFQUFFLEVBQUUsQ0FBQyxDQUFDO1FBRTVCLE9BQU87WUFDTCxLQUFLLEVBQUUsU0FBUztZQUNoQixVQUFVLEVBQUUsRUFBRTtZQUNkLFFBQVEsRUFBRSxFQUFFO1lBQ1osYUFBYSxFQUFFLENBQUMsRUFBRSxDQUFDO1lBQ25CLFdBQVcsRUFBRSxlQUFlO1NBQzdCLENBQUM7SUFDSixDQUFDO0NBQ0Y7QUEzQ3lCO0lBRHZCLGFBQWEsQ0FBQyxJQUFJLENBQUM7c0NBQzRCO0FBTXhCO0lBRHZCLGFBQWEsQ0FBQyxJQUFJLENBQUM7c0NBQzRCO0FBTXhCO0lBRHZCLGFBQWEsQ0FBQyxJQUFJLENBQUM7c0NBQzRCO0FBT3RDO0lBRFQsUUFBUSxFQUFFO3lDQUdWIn0=

package/lib/components/Ray.d.ts

@@ -0,0 +1,62 @@
+import type { PossibleVector2, SignalValue, Vector2Signal } from '@twick/core';
+import { BBox } from '@twick/core';
+import type { CurveProfile } from '../curves';
+import type { CurveProps } from './Curve';
+import { Curve } from './Curve';
+export interface RayProps extends CurveProps {
+    /**
+     * {@inheritDoc Ray.from}
+     */
+    from?: SignalValue<PossibleVector2>;
+    fromX?: SignalValue<number>;
+    fromY?: SignalValue<number>;
+    /**
+     * {@inheritDoc Ray.to}
+     */
+    to?: SignalValue<PossibleVector2>;
+    toX?: SignalValue<number>;
+    toY?: SignalValue<number>;
+}
+/**
+ * A node for drawing an individual line segment.
+ *
+ * @preview
+ * ```tsx editor
+ * import {makeScene2D} from '@twick/2d';
+ * import {Ray} from '@twick/2d';
+ * import {createRef} from '@twick/core';
+ *
+ * export default makeScene2D(function* (view) {
+ *   const ray = createRef<Ray>();
+ *
+ *   view.add(
+ *     <Ray
+ *       ref={ray}
+ *       lineWidth={8}
+ *       endArrow
+ *       stroke={'lightseagreen'}
+ *       fromX={-200}
+ *       toX={200}
+ *     />,
+ *   );
+ *
+ *   yield* ray().start(1, 1);
+ *   yield* ray().start(0).end(0).start(1, 1);
+ * });
+ * ```
+ */
+export declare class Ray extends Curve {
+    /**
+     * The starting point of the ray.
+     */
+    readonly from: Vector2Signal<this>;
+    /**
+     * The ending point of the ray.
+     */
+    readonly to: Vector2Signal<this>;
+    constructor(props: RayProps);
+    protected childrenBBox(): BBox;
+    profile(): CurveProfile;
+    drawOverlay(context: CanvasRenderingContext2D, matrix: DOMMatrix): void;
+}
+//# sourceMappingURL=Ray.d.ts.map

package/lib/components/Ray.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Ray.d.ts","sourceRoot":"","sources":["../../src/lib/components/Ray.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,eAAe,EAAE,WAAW,EAAE,aAAa,EAAC,MAAM,aAAa,CAAC;AAC7E,OAAO,EAAC,IAAI,EAAyB,MAAM,aAAa,CAAC;AACzD,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,WAAW,CAAC;AAI5C,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AACxC,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAE9B,MAAM,WAAW,QAAS,SAAQ,UAAU;IAC1C;;OAEG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IACpC,KAAK,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,KAAK,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAE5B;;OAEG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAClC,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,qBACa,GAAI,SAAQ,KAAK;IAC5B;;OAEG;IACH,SACwB,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAElD;;OAEG;IACH,SACwB,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;gBAE7B,KAAK,EAAE,QAAQ;cAIf,YAAY;IAIf,OAAO,IAAI,YAAY;IAUvB,WAAW,CACzB,OAAO,EAAE,wBAAwB,EACjC,MAAM,EAAE,SAAS;CAqCpB"}