@gedit/editor-2d 0.2.46 → 0.2.48

package/lib/browser/playground/path-edit-layer-move-point.js

@@ -1,47 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PointDefault = void 0;
-const React = require("react");
-const canvas_draw_1 = require("@gedit/canvas-draw");
-const PointDefault = ({ getPosFromMouseEvent, paths, scale, }) => {
-    const domRef = React.useRef(null);
-    const lineRef = React.useRef(null);
-    const pathsRef = React.useRef(paths);
-    const onMove = (e) => {
-        const dom = domRef.current;
-        const line = lineRef.current;
-        if (!dom || !line) {
-            return;
-        }
-        const pos = getPosFromMouseEvent(e);
-        dom.style.transform = `translate(${pos.x}px, ${pos.y}px) scale(${1 / scale})`;
-        const endPoint = pathsRef.current[pathsRef.current.length - 1];
-        if (endPoint) {
-            const width = (0, canvas_draw_1.getLineWidth)(endPoint, pos);
-            const { ang } = (0, canvas_draw_1.asVec)(endPoint, pos);
-            line.style.width = `${width}px`;
-            line.style.height = `${1 / scale}px`;
-            line.style.transform = `translate(${endPoint.x}px, ${endPoint.y}px) rotate(${(ang / Math.PI) * 180}deg)`;
-        }
-    };
-    React.useEffect(() => {
-        pathsRef.current = paths;
-    }, [paths]);
-    React.useEffect(() => {
-        const dom = domRef.current;
-        const line = lineRef.current;
-        if (dom && line) {
-            window.addEventListener('mousemove', onMove);
-        }
-        return () => {
-            if (dom && line) {
-                window.removeEventListener('mousemove', onMove);
-            }
-        };
-    }, []);
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "gedit-path-edit-layer-line", ref: lineRef }),
-        React.createElement("div", { className: "gedit-path-edit-layer-point gedit-path-edit-layer-point-move gedit-path-edit-layer-pen", ref: domRef })));
-};
-exports.PointDefault = PointDefault;
-//# sourceMappingURL=path-edit-layer-move-point.js.map

package/lib/browser/playground/path-edit-layer-move-point.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"path-edit-layer-move-point.js","sourceRoot":"","sources":["../../../src/browser/playground/path-edit-layer-move-point.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,oDAAoE;AAM7D,MAAM,YAAY,GAAG,CAAC,EAC3B,oBAAoB,EACpB,KAAK,EACL,KAAK,GAWN,EAAE,EAAE;IACH,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IACnD,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IACrC,MAAM,MAAM,GAAG,CAAC,CAAa,EAAE,EAAE;QAC/B,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC;QAC3B,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC;QAC7B,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE;YACjB,OAAO;SACR;QACD,MAAM,GAAG,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAC;QACpC,GAAG,CAAC,KAAK,CAAC,SAAS,GAAG,aAAa,GAAG,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC,aAClD,CAAC,GAAG,KACN,GAAG,CAAC;QACJ,MAAM,QAAQ,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC/D,IAAI,QAAQ,EAAE;YACZ,MAAM,KAAK,GAAG,IAAA,0BAAY,EAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;YAC1C,MAAM,EAAE,GAAG,EAAE,GAAG,IAAA,mBAAK,EAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;YACrC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,KAAK,IAAI,CAAC;YAChC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC,GAAG,KAAK,IAAI,CAAC;YACrC,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,aAAa,QAAQ,CAAC,CAAC,OAC5C,QAAQ,CAAC,CACX,cAAc,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,CAAC,GAAG,GAAG,MAAM,CAAC;SAC3C;IACH,CAAC,CAAC;IACF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC;IAC3B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IACZ,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC;QAC3B,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC;QAC7B,IAAI,GAAG,IAAI,IAAI,EAAE;YACf,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;SAC9C;QACD,OAAO,GAAG,EAAE;YACV,IAAI,GAAG,IAAI,IAAI,EAAE;gBACf,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;aACjD;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,CACL;QACE,6BAAK,SAAS,EAAC,4BAA4B,EAAC,GAAG,EAAE,OAAO,GAAI;QAC5D,6BACE,SAAS,EAAC,wFAAwF,EAClG,GAAG,EAAE,MAAM,GACX,CACD,CACJ,CAAC;AACJ,CAAC,CAAC;AA/DW,QAAA,YAAY,gBA+DvB"}

package/lib/browser/playground/path-edit-layer-svg-path.d.ts

@@ -1,11 +0,0 @@
-import * as React from 'react';
-import { PathChild } from '@gedit/canvas-draw';
-export interface PathSVGProps {
-    width: number;
-    height: number;
-    scale: number;
-    paths: PathChild[];
-    pathProps?: any;
-}
-export declare const SvgPath: ({ width, height, paths, scale, pathProps, }: PathSVGProps) => React.JSX.Element;
-//# sourceMappingURL=path-edit-layer-svg-path.d.ts.map

package/lib/browser/playground/path-edit-layer-svg-path.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"path-edit-layer-svg-path.d.ts","sourceRoot":"","sources":["../../../src/browser/playground/path-edit-layer-svg-path.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAoB,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEjE,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,SAAS,CAAC,EAAE,GAAG,CAAC;CACjB;AAED,eAAO,MAAM,OAAO,gDAMjB,YAAY,sBAgCd,CAAC"}

package/lib/browser/playground/path-edit-layer-svg-path.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SvgPath = void 0;
-const React = require("react");
-const canvas_draw_1 = require("@gedit/canvas-draw");
-const SvgPath = ({ width, height, paths, scale, pathProps, }) => {
-    // const bezier = getXYToPath(paths);
-    const pathsStringArray = (0, canvas_draw_1.getPointsToPaths)(paths);
-    console.log((0, canvas_draw_1.getPointsToPaths)(paths));
-    return (React.createElement("svg", { width: width || 300, height: height || 300, className: "gedit-path-edit-layer-svg" }, pathsStringArray.map((p, i) => (React.createElement("path", Object.assign({ className: "gedit-path-edit-layer-path", key: i.toString() }, pathProps, { strokeLinecap: "round", strokeWidth: 1.5 / scale, d: p, onMouseDown: e => {
-            e.preventDefault();
-            e.stopPropagation();
-        }, onDoubleClick: e => {
-            e.preventDefault();
-            e.stopPropagation();
-            // this.onPathDoubleClick(i, p);
-            console.log(3123);
-        } }))))));
-};
-exports.SvgPath = SvgPath;
-//# sourceMappingURL=path-edit-layer-svg-path.js.map

package/lib/browser/playground/path-edit-layer-svg-path.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"path-edit-layer-svg-path.js","sourceRoot":"","sources":["../../../src/browser/playground/path-edit-layer-svg-path.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,oDAAiE;AAU1D,MAAM,OAAO,GAAG,CAAC,EACtB,KAAK,EACL,MAAM,EACN,KAAK,EACL,KAAK,EACL,SAAS,GACI,EAAE,EAAE;IACjB,qCAAqC;IACrC,MAAM,gBAAgB,GAAG,IAAA,8BAAgB,EAAC,KAAK,CAAC,CAAC;IACjD,OAAO,CAAC,GAAG,CAAC,IAAA,8BAAgB,EAAC,KAAK,CAAC,CAAC,CAAC;IACrC,OAAO,CACL,6BACE,KAAK,EAAE,KAAK,IAAI,GAAG,EACnB,MAAM,EAAE,MAAM,IAAI,GAAG,EACrB,SAAS,EAAC,2BAA2B,IAEpC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAC9B,4CACE,SAAS,EAAC,4BAA4B,EACtC,GAAG,EAAE,CAAC,CAAC,QAAQ,EAAE,IACb,SAAS,IACb,aAAa,EAAC,OAAO,EACrB,WAAW,EAAE,GAAG,GAAG,KAAK,EACxB,CAAC,EAAE,CAAC,EACJ,WAAW,EAAE,CAAC,CAAC,EAAE;YACf,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;QACtB,CAAC,EACD,aAAa,EAAE,CAAC,CAAC,EAAE;YACjB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,gCAAgC;YAChC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACpB,CAAC,IACD,CACH,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAtCW,QAAA,OAAO,WAsClB"}

package/src/browser/playground/path-edit-layer-move-point.tsx

@@ -1,71 +0,0 @@
-import * as React from 'react';
-import { asVec, getLineWidth, PathChild } from '@gedit/canvas-draw';
-import { PositionSchema } from '@gedit/playground';
-
-export interface PointSchema extends PositionSchema {
-  id?: string;
-}
-export const PointDefault = ({
-  getPosFromMouseEvent,
-  paths,
-  scale,
-}: {
-  getPosFromMouseEvent: (
-    event: {
-      clientX: number;
-      clientY: number;
-    },
-    addScale?: boolean
-  ) => PointSchema;
-  paths: PathChild[];
-  scale: number;
-}) => {
-  const domRef = React.useRef<HTMLDivElement>(null);
-  const lineRef = React.useRef<HTMLDivElement>(null);
-  const pathsRef = React.useRef(paths);
-  const onMove = (e: MouseEvent) => {
-    const dom = domRef.current;
-    const line = lineRef.current;
-    if (!dom || !line) {
-      return;
-    }
-    const pos = getPosFromMouseEvent(e);
-    dom.style.transform = `translate(${pos.x}px, ${pos.y}px) scale(${
-      1 / scale
-    })`;
-    const endPoint = pathsRef.current[pathsRef.current.length - 1];
-    if (endPoint) {
-      const width = getLineWidth(endPoint, pos);
-      const { ang } = asVec(endPoint, pos);
-      line.style.width = `${width}px`;
-      line.style.height = `${1 / scale}px`;
-      line.style.transform = `translate(${endPoint.x}px, ${
-        endPoint.y
-      }px) rotate(${(ang / Math.PI) * 180}deg)`;
-    }
-  };
-  React.useEffect(() => {
-    pathsRef.current = paths;
-  }, [paths]);
-  React.useEffect(() => {
-    const dom = domRef.current;
-    const line = lineRef.current;
-    if (dom && line) {
-      window.addEventListener('mousemove', onMove);
-    }
-    return () => {
-      if (dom && line) {
-        window.removeEventListener('mousemove', onMove);
-      }
-    };
-  }, []);
-  return (
-    <>
-      <div className="gedit-path-edit-layer-line" ref={lineRef} />
-      <div
-        className="gedit-path-edit-layer-point gedit-path-edit-layer-point-move gedit-path-edit-layer-pen"
-        ref={domRef}
-      />
-    </>
-  );
-};

package/src/browser/playground/path-edit-layer-svg-path.tsx

@@ -1,50 +0,0 @@
-import * as React from 'react';
-import { getPointsToPaths, PathChild } from '@gedit/canvas-draw';
-
-export interface PathSVGProps {
-  width: number;
-  height: number;
-  scale: number;
-  paths: PathChild[];
-  pathProps?: any;
-}
-
-export const SvgPath = ({
-  width,
-  height,
-  paths,
-  scale,
-  pathProps,
-}: PathSVGProps) => {
-  // const bezier = getXYToPath(paths);
-  const pathsStringArray = getPointsToPaths(paths);
-  console.log(getPointsToPaths(paths));
-  return (
-    <svg
-      width={width || 300}
-      height={height || 300}
-      className="gedit-path-edit-layer-svg"
-    >
-      {pathsStringArray.map((p, i) => (
-        <path
-          className="gedit-path-edit-layer-path"
-          key={i.toString()}
-          {...pathProps}
-          strokeLinecap="round"
-          strokeWidth={1.5 / scale}
-          d={p}
-          onMouseDown={e => {
-            e.preventDefault();
-            e.stopPropagation();
-          }}
-          onDoubleClick={e => {
-            e.preventDefault();
-            e.stopPropagation();
-            // this.onPathDoubleClick(i, p);
-            console.log(3123);
-          }}
-        />
-      ))}
-    </svg>
-  );
-};