@revideo/2d 0.3.7-alpha.975 → 0.3.7-beta.987

package/lib/components/Bezier.js

@@ -1,80 +1,91 @@
-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;
+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 } from '@revideo/core';
-import { computed } from '../decorators';
-import { arc, drawLine, drawPivot, moveTo } from '../utils';
-import { Curve } from './Curve';
+  };
+import {BBox} from '@revideo/core';
+import {computed} from '../decorators';
+import {arc, drawLine, drawPivot, moveTo} from '../utils';
+import {Curve} from './Curve';
 export class Bezier extends Curve {
-    profile() {
-        const segment = this.segment();
-        return {
-            segments: [segment],
-            arcLength: segment.arcLength,
-            minSin: 0,
-        };
+  profile() {
+    const segment = this.segment();
+    return {
+      segments: [segment],
+      arcLength: segment.arcLength,
+      minSin: 0,
+    };
+  }
+  childrenBBox() {
+    return BBox.fromPoints(...this.segment().points);
+  }
+  desiredSize() {
+    return this.segment().getBBox().size;
+  }
+  offsetComputedLayout(box) {
+    box.position = box.position.sub(this.segment().getBBox().center);
+    return box;
+  }
+  drawOverlay(context, matrix) {
+    const size = this.computedSize();
+    const box = this.childrenBBox().transformCorners(matrix);
+    const offset = size.mul(this.offset()).scale(0.5).transformAsPoint(matrix);
+    const overlayInfo = this.overlayInfo(matrix);
+    context.lineWidth = 1;
+    context.strokeStyle = 'white';
+    context.fillStyle = 'white';
+    // Draw the curve itself first so everything else gets drawn on top of it
+    context.stroke(overlayInfo.curve);
+    context.fillStyle = 'white';
+    context.globalAlpha = 0.5;
+    context.beginPath();
+    context.stroke(overlayInfo.handleLines);
+    context.globalAlpha = 1;
+    context.lineWidth = 2;
+    // Draw start and end points
+    for (const point of [overlayInfo.startPoint, overlayInfo.endPoint]) {
+      moveTo(context, point);
+      context.beginPath();
+      arc(context, point, 4);
+      context.closePath();
+      context.stroke();
+      context.fill();
     }
-    childrenBBox() {
-        return BBox.fromPoints(...this.segment().points);
-    }
-    desiredSize() {
-        return this.segment().getBBox().size;
-    }
-    offsetComputedLayout(box) {
-        box.position = box.position.sub(this.segment().getBBox().center);
-        return box;
-    }
-    drawOverlay(context, matrix) {
-        const size = this.computedSize();
-        const box = this.childrenBBox().transformCorners(matrix);
-        const offset = size.mul(this.offset()).scale(0.5).transformAsPoint(matrix);
-        const overlayInfo = this.overlayInfo(matrix);
-        context.lineWidth = 1;
-        context.strokeStyle = 'white';
-        context.fillStyle = 'white';
-        // Draw the curve itself first so everything else gets drawn on top of it
-        context.stroke(overlayInfo.curve);
-        context.fillStyle = 'white';
-        context.globalAlpha = 0.5;
-        context.beginPath();
-        context.stroke(overlayInfo.handleLines);
-        context.globalAlpha = 1;
-        context.lineWidth = 2;
-        // Draw start and end points
-        for (const point of [overlayInfo.startPoint, overlayInfo.endPoint]) {
-            moveTo(context, point);
-            context.beginPath();
-            arc(context, point, 4);
-            context.closePath();
-            context.stroke();
-            context.fill();
-        }
-        // Draw the control points
-        context.fillStyle = 'black';
-        for (const point of overlayInfo.controlPoints) {
-            moveTo(context, point);
-            context.beginPath();
-            arc(context, point, 4);
-            context.closePath();
-            context.fill();
-            context.stroke();
-        }
-        // Draw the offset marker
-        context.lineWidth = 1;
-        context.beginPath();
-        drawPivot(context, offset);
-        context.stroke();
-        // Draw the bounding box
-        context.beginPath();
-        drawLine(context, box);
-        context.closePath();
-        context.stroke();
+    // Draw the control points
+    context.fillStyle = 'black';
+    for (const point of overlayInfo.controlPoints) {
+      moveTo(context, point);
+      context.beginPath();
+      arc(context, point, 4);
+      context.closePath();
+      context.fill();
+      context.stroke();
     }
+    // Draw the offset marker
+    context.lineWidth = 1;
+    context.beginPath();
+    drawPivot(context, offset);
+    context.stroke();
+    // Draw the bounding box
+    context.beginPath();
+    drawLine(context, box);
+    context.closePath();
+    context.stroke();
+  }
 }
-__decorate([
-    computed()
-], Bezier.prototype, "childrenBBox", null);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmV6aWVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2xpYi9jb21wb25lbnRzL0Jlemllci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxPQUFPLEVBQUMsSUFBSSxFQUE2QixNQUFNLGVBQWUsQ0FBQztBQUcvRCxPQUFPLEVBQUMsUUFBUSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBRXZDLE9BQU8sRUFBQyxHQUFHLEVBQUUsUUFBUSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUMsTUFBTSxVQUFVLENBQUM7QUFDMUQsT0FBTyxFQUFDLEtBQUssRUFBQyxNQUFNLFNBQVMsQ0FBQztBQVU5QixNQUFNLE9BQWdCLE1BQU8sU0FBUSxLQUFLO0lBQ3hCLE9BQU87UUFDckIsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1FBQy9CLE9BQU87WUFDTCxRQUFRLEVBQUUsQ0FBQyxPQUFPLENBQUM7WUFDbkIsU0FBUyxFQUFFLE9BQU8sQ0FBQyxTQUFTO1lBQzVCLE1BQU0sRUFBRSxDQUFDO1NBQ1YsQ0FBQztJQUNKLENBQUM7SUFPUyxZQUFZO1FBQ3BCLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxHQUFHLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUNuRCxDQUFDO0lBRWtCLFdBQVc7UUFDNUIsT0FBTyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUMsT0FBTyxFQUFFLENBQUMsSUFBSSxDQUFDO0lBQ3ZDLENBQUM7SUFFa0Isb0JBQW9CLENBQUMsR0FBUztRQUMvQyxHQUFHLENBQUMsUUFBUSxHQUFHLEdBQUcsQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQyxPQUFPLEVBQUUsQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUNqRSxPQUFPLEdBQUcsQ0FBQztJQUNiLENBQUM7SUFFZSxXQUFXLENBQ3pCLE9BQWlDLEVBQ2pDLE1BQWlC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
+__decorate([computed()], Bezier.prototype, 'childrenBBox', null);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmV6aWVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2xpYi9jb21wb25lbnRzL0Jlemllci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxPQUFPLEVBQUMsSUFBSSxFQUE2QixNQUFNLGVBQWUsQ0FBQztBQUcvRCxPQUFPLEVBQUMsUUFBUSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBRXZDLE9BQU8sRUFBQyxHQUFHLEVBQUUsUUFBUSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUMsTUFBTSxVQUFVLENBQUM7QUFDMUQsT0FBTyxFQUFDLEtBQUssRUFBQyxNQUFNLFNBQVMsQ0FBQztBQVU5QixNQUFNLE9BQWdCLE1BQU8sU0FBUSxLQUFLO0lBQ3hCLE9BQU87UUFDckIsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1FBQy9CLE9BQU87WUFDTCxRQUFRLEVBQUUsQ0FBQyxPQUFPLENBQUM7WUFDbkIsU0FBUyxFQUFFLE9BQU8sQ0FBQyxTQUFTO1lBQzVCLE1BQU0sRUFBRSxDQUFDO1NBQ1YsQ0FBQztJQUNKLENBQUM7SUFPUyxZQUFZO1FBQ3BCLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxHQUFHLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUNuRCxDQUFDO0lBRWtCLFdBQVc7UUFDNUIsT0FBTyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUMsT0FBTyxFQUFFLENBQUMsSUFBSSxDQUFDO0lBQ3ZDLENBQUM7SUFFa0Isb0JBQW9CLENBQUMsR0FBUztRQUMvQyxHQUFHLENBQUMsUUFBUSxHQUFHLEdBQUcsQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQyxPQUFPLEVBQUUsQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUNqRSxPQUFPLEdBQUcsQ0FBQztJQUNiLENBQUM7SUFFZSxXQUFXLENBQ3pCLE9BQWlDLEVBQ2pDLE1BQWlC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

package/lib/components/Circle.d.ts

@@ -1,24 +1,29 @@
-import { BBox, SerializedVector2, SignalValue, SimpleSignal } from '@revideo/core';
-import { CurveProfile } from '../curves';
-import { DesiredLength } from '../partials';
-import { Curve, CurveProps } from './Curve';
+import {
+  BBox,
+  SerializedVector2,
+  SignalValue,
+  SimpleSignal,
+} from '@revideo/core';
+import {CurveProfile} from '../curves';
+import {DesiredLength} from '../partials';
+import {Curve, CurveProps} from './Curve';
 export interface CircleProps extends CurveProps {
-    /**
-     * {@inheritDoc Circle.startAngle}
-     */
-    startAngle?: SignalValue<number>;
-    /**
-     * {@inheritDoc Circle.endAngle}
-     */
-    endAngle?: SignalValue<number>;
-    /**
-     * {@inheritDoc Circle.counterclockwise}
-     */
-    counterclockwise?: SignalValue<boolean>;
-    /**
-     * {@inheritDoc Circle.closed}
-     */
-    closed?: SignalValue<boolean>;
+  /**
+   * {@inheritDoc Circle.startAngle}
+   */
+  startAngle?: SignalValue<number>;
+  /**
+   * {@inheritDoc Circle.endAngle}
+   */
+  endAngle?: SignalValue<number>;
+  /**
+   * {@inheritDoc Circle.counterclockwise}
+   */
+  counterclockwise?: SignalValue<boolean>;
+  /**
+   * {@inheritDoc Circle.closed}
+   */
+  closed?: SignalValue<boolean>;
 }
 /**
  * A node for drawing circular shapes.
@@ -118,74 +123,74 @@ export interface CircleProps extends CurveProps {
  * ```
  */
 export declare class Circle extends Curve {
-    /**
-     * The starting angle in degrees for the circle sector.
-     *
-     * @remarks
-     * This property can be used together with {@link startAngle} to turn this
-     * circle into a sector (when using fill) or an arc (when using stroke).
-     *
-     * @defaultValue 0
-     */
-    readonly startAngle: SimpleSignal<number, this>;
-    /**
-     * The ending angle in degrees for the circle sector.
-     *
-     * @remarks
-     * This property can be used together with {@link endAngle} to turn this
-     * circle into a sector (when using fill) or an arc (when using stroke).
-     *
-     * @defaultValue 360
-     */
-    readonly endAngle: SimpleSignal<number, this>;
-    /**
-     * Whether the circle sector should be drawn counterclockwise.
-     *
-     * @remarks
-     * By default, the circle begins at {@link startAngle} and is drawn clockwise
-     * until reaching {@link endAngle}. Setting this property to true will reverse
-     * this direction.
-     */
-    readonly counterclockwise: SimpleSignal<boolean, this>;
-    /**
-     * Whether the path of this circle should be closed.
-     *
-     * @remarks
-     * When set to true, the path of this circle will start and end at the center.
-     * This can be used to fine-tune how sectors are rendered.
-     *
-     * @example
-     * A closed circle will look like a pie chart:
-     * ```tsx
-     * <Circle
-     *   size={300}
-     *   fill={'lightseagreen'}
-     *   endAngle={230}
-     *   closed={true}
-     * />
-     * ```
-     * An open one will look like an arc:
-     * ```tsx
-     * <Circle
-     *   size={300}
-     *   stroke={'lightseagreen'}
-     *   lineWidth={8}
-     *   endAngle={230}
-     *   closed={false}
-     * />
-     * ```
-     *
-     * @defaultValue false
-     */
-    readonly closed: SimpleSignal<boolean, this>;
-    constructor(props: CircleProps);
-    profile(): CurveProfile;
-    protected desiredSize(): SerializedVector2<DesiredLength>;
-    protected offsetComputedLayout(box: BBox): BBox;
-    protected childrenBBox(): BBox;
-    protected getPath(): Path2D;
-    protected getRipplePath(): Path2D;
-    protected getCacheBBox(): BBox;
-    protected createPath(expand?: number): Path2D;
+  /**
+   * The starting angle in degrees for the circle sector.
+   *
+   * @remarks
+   * This property can be used together with {@link startAngle} to turn this
+   * circle into a sector (when using fill) or an arc (when using stroke).
+   *
+   * @defaultValue 0
+   */
+  readonly startAngle: SimpleSignal<number, this>;
+  /**
+   * The ending angle in degrees for the circle sector.
+   *
+   * @remarks
+   * This property can be used together with {@link endAngle} to turn this
+   * circle into a sector (when using fill) or an arc (when using stroke).
+   *
+   * @defaultValue 360
+   */
+  readonly endAngle: SimpleSignal<number, this>;
+  /**
+   * Whether the circle sector should be drawn counterclockwise.
+   *
+   * @remarks
+   * By default, the circle begins at {@link startAngle} and is drawn clockwise
+   * until reaching {@link endAngle}. Setting this property to true will reverse
+   * this direction.
+   */
+  readonly counterclockwise: SimpleSignal<boolean, this>;
+  /**
+   * Whether the path of this circle should be closed.
+   *
+   * @remarks
+   * When set to true, the path of this circle will start and end at the center.
+   * This can be used to fine-tune how sectors are rendered.
+   *
+   * @example
+   * A closed circle will look like a pie chart:
+   * ```tsx
+   * <Circle
+   *   size={300}
+   *   fill={'lightseagreen'}
+   *   endAngle={230}
+   *   closed={true}
+   * />
+   * ```
+   * An open one will look like an arc:
+   * ```tsx
+   * <Circle
+   *   size={300}
+   *   stroke={'lightseagreen'}
+   *   lineWidth={8}
+   *   endAngle={230}
+   *   closed={false}
+   * />
+   * ```
+   *
+   * @defaultValue false
+   */
+  readonly closed: SimpleSignal<boolean, this>;
+  constructor(props: CircleProps);
+  profile(): CurveProfile;
+  protected desiredSize(): SerializedVector2<DesiredLength>;
+  protected offsetComputedLayout(box: BBox): BBox;
+  protected childrenBBox(): BBox;
+  protected getPath(): Path2D;
+  protected getRipplePath(): Path2D;
+  protected getCacheBBox(): BBox;
+  protected createPath(expand?: number): Path2D;
 }
-//# sourceMappingURL=Circle.d.ts.map
+//# sourceMappingURL=Circle.d.ts.map