frame.image 1.6.5 → 1.6.7

package/dist/App.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"AACA,OAAO,WAAW,CAAC;AAUnB,iBAAS,GAAG,4CAqHX;AAED,eAAe,GAAG,CAAC"}
+{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"AACA,OAAO,WAAW,CAAC;AAUnB,iBAAS,GAAG,4CAwIX;AAED,eAAe,GAAG,CAAC"}

package/dist/App.js

@@ -14,6 +14,7 @@ function App() {
     const universeCenter = new Point(width / 2, height / 2);
     const offset = 0;
     const [modalDesigner, setModalDesigner] = useState(false);
+    const [rt1, setRt1] = useState('');
     const [imageCoords, setImageCoords] = useState({
         horizontal: 0,
         vertical: 0,
@@ -85,7 +86,13 @@ function App() {
     function onClose(rt1) {
         console.log(`RT1 from App: ${rt1}`);
         setModalDesigner(false);
+        setRt1(rt1);
     }
-    return (_jsxs(_Fragment, { children: [_jsx("h3", { children: "frame.image" }), _jsx(Scaling, { SL: scaledSL, setSL: setScaledSL, SH: scaledSH, setSH: setScaledSH, onScale: onScale }), _jsx(ImageHandler, { imageCoords: { imageCoords, setImageCoords } }), _jsx(Center, { coords: coords }), _jsx("button", { onClick: onOpenModalDesigner, children: "Designer" }), _jsx(ModalDesigner, { isOpen: modalDesigner, onClose: onClose })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("h3", { children: "frame.image" }), _jsx(Scaling, { SL: scaledSL, setSL: setScaledSL, SH: scaledSH, setSH: setScaledSH, onScale: onScale }), _jsx(ImageHandler, { imageCoords: { imageCoords, setImageCoords } }), _jsx(Center, { coords: coords }), _jsx("button", { "data-testid": "button.designer", onClick: onOpenModalDesigner, children: "Designer" }), _jsx(ModalDesigner, { isOpen: modalDesigner, onClose: onClose }), _jsx("div", { style: { maxWidth: '400px', marginTop: '10px' }, children: _jsx("input", { "data-testid": "input.rt1-output", type: "text", style: {
+                        width: '100%',
+                        padding: '8px',
+                        border: '1px solid #ccc',
+                        borderRadius: '4px',
+                    }, placeholder: "RT1 Output", value: rt1, readOnly: true }) })] }));
 }
 export default App;

package/dist/Designer.d.ts

@@ -1,6 +1,11 @@
+import { Polygon } from './Polygon';
+import { Point } from './Point';
 export declare function Designer(props: {
     onClose: (rt1: string) => void;
     nrPoints?: number;
     trademarkImageUrl?: string;
+    callBackAfterTransform?: (coordinates: Polygon) => void;
+    callbackAfterScale?: (length: number, height: number) => void;
+    callbackAfterTrademark?: (tradeMark: Point) => void;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Designer.d.ts.map

package/dist/Designer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Designer.d.ts","sourceRoot":"","sources":["../src/Designer.tsx"],"names":[],"mappings":"AAeA,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAC9B,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,2CAgRA"}
+{"version":3,"file":"Designer.d.ts","sourceRoot":"","sources":["../src/Designer.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAMhC,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAC9B,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sBAAsB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACxD,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,sBAAsB,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,KAAK,IAAI,CAAC;CACrD,2CAmRA"}

package/dist/Designer.js

@@ -27,9 +27,7 @@ export function Designer(props) {
     const [scaledSH, setScaledSH] = useState(undefined);
     const [trademarkCenter, setTrademarkCenter] = useState(undefined);
     const [show, setShow] = useState({
-        catmullRomPoints: true,
         catmullRom: true,
-        catmullRomCenter: true,
         points: true,
         polygon: false,
         center: false,
@@ -42,7 +40,6 @@ export function Designer(props) {
         horizontal: 0,
         vertical: 0,
     });
-    const [catmullRomPoints, setCatmullRomPoints] = useState(undefined);
     const onClickReset = () => {
         setCoords(new Polygon([], universeCenter));
         // setCatmullRomPoints(undefined);
@@ -74,6 +71,9 @@ export function Designer(props) {
     function handleCloseScaleFormContinue(length, height) {
         currentMachine.context.length = length;
         currentMachine.context.height = height;
+        if (props.callbackAfterScale) {
+            props.callbackAfterScale(length, height);
+        }
         onCloseScaleForm();
     }
     const onLoad = (nrPts) => {
@@ -82,9 +82,12 @@ export function Designer(props) {
             sendCommand(ACTION.DEFINE_POINTS);
         }
     };
-    const onTransform = () => {
+    const onAfterTransform = (coordinates) => {
         setScalingEnabled(true);
         sendCommand(ACTION.TRANSFORM);
+        if (props.callBackAfterTransform) {
+            props.callBackAfterTransform(coordinates);
+        }
     };
     const onReset = () => {
         setScalingEnabled(false);
@@ -96,6 +99,9 @@ export function Designer(props) {
         const rt1 = createRT1(points);
         if (trademark) {
             console.log(`trademark is now defined at [${trademark.X}, ${trademark.Y}]`);
+            if (props.callbackAfterTrademark) {
+                props.callbackAfterTrademark(trademark);
+            }
         }
         props.onClose(rt1);
     };
@@ -146,7 +152,7 @@ export function Designer(props) {
                                     height: '100%',
                                     boxSizing: 'border-box',
                                     backgroundColor: 'rgb(173, 216, 230)', // lightblue in rgb
-                                }, children: _jsx(DrawCanvas, { machine: currentMachine, command: sendCommand, width: width, height: height, status: { status, setStatus }, show: show, axis: { axis, setAxis }, imageUrl: imageUrl, coords: { coords, setCoords }, trademarkCenter: { trademarkCenter, setTrademarkCenter }, imageCoords: { imageCoords, setImageCoords }, rotation: { rotationAngle, setRotationAngle }, scaledSL: scaledSL, scaledSH: scaledSH, catmullRomPoints: { catmullRomPoints, setCatmullRomPoints }, trademarkImageUrl: props.trademarkImageUrl }) }), _jsx(Box, { id: "id.box.ScaleForm", sx: {
+                                }, children: _jsx(DrawCanvas, { machine: currentMachine, command: sendCommand, width: width, height: height, status: { status, setStatus }, show: show, axis: { axis, setAxis }, imageUrl: imageUrl, coords: { coords, setCoords }, trademarkCenter: { trademarkCenter, setTrademarkCenter }, imageCoords: { imageCoords, setImageCoords }, rotation: { rotationAngle, setRotationAngle }, scaledSL: scaledSL, scaledSH: scaledSH, trademarkImageUrl: props.trademarkImageUrl }) }), _jsx(Box, { id: "id.box.ScaleForm", sx: {
                                     display: 'flex',
                                     flexDirection: 'column',
                                     flex: wCol3,
@@ -160,5 +166,5 @@ export function Designer(props) {
                             height: '20%',
                             width: '100%',
                             overflow: 'auto',
-                        }, children: _jsx(Finish, { universeCenter: universeCenter, nrPoints: nrPoints, coords: { coords, setCoords }, trademarkCenter: { trademarkCenter, setTrademarkCenter }, onLoad: onLoad, onAfterTransform: onTransform, onAfterReset: onReset, onClose: onClose }) })] })] }));
+                        }, children: _jsx(Finish, { universeCenter: universeCenter, nrPoints: nrPoints, coords: { coords, setCoords }, trademarkCenter: { trademarkCenter, setTrademarkCenter }, onLoad: onLoad, onAfterTransform: onAfterTransform, onAfterReset: onReset, onClose: onClose }) })] })] }));
 }

package/dist/DrawCanvas.d.ts

@@ -1,5 +1,5 @@
 import { JSX } from 'react';
-import { TAxisHook, TCatmullRomPointsHook, TCoordsHook, TImageHook, TRotationHook, TShow, TStatusHook, TTrademarkHook } from './types';
+import { TAxisHook, TCoordsHook, TImageHook, TRotationHook, TShow, TStatusHook, TTrademarkHook } from './types';
 export declare function DrawCanvas(props: {
     machine: any;
     command: any;
@@ -11,7 +11,6 @@ export declare function DrawCanvas(props: {
     imageUrl?: string;
     coords: TCoordsHook;
     trademarkCenter: TTrademarkHook;
-    catmullRomPoints: TCatmullRomPointsHook;
     imageCoords: TImageHook;
     rotation: TRotationHook;
     scaledSL?: number;

package/dist/DrawCanvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DrawCanvas.d.ts","sourceRoot":"","sources":["../src/DrawCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqD,MAAM,OAAO,CAAC;AAG/E,OAAO,EACL,SAAS,EACT,qBAAqB,EACrB,WAAW,EACX,UAAU,EACV,aAAa,EACb,KAAK,EACL,WAAW,EACX,cAAc,EACf,MAAM,SAAS,CAAC;AAKjB,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAChC,OAAO,EAAE,GAAG,CAAC;IACb,OAAO,EAAE,GAAG,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,WAAW,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC;IACZ,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,CAAC;IACpB,eAAe,EAAE,cAAc,CAAC;IAChC,gBAAgB,EAAE,qBAAqB,CAAC;IACxC,WAAW,EAAE,UAAU,CAAC;IACxB,QAAQ,EAAE,aAAa,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,GAAG,GAAG,CAAC,OAAO,CAysBd"}
+{"version":3,"file":"DrawCanvas.d.ts","sourceRoot":"","sources":["../src/DrawCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqD,MAAM,OAAO,CAAC;AAG/E,OAAO,EACL,SAAS,EACT,WAAW,EACX,UAAU,EACV,aAAa,EACb,KAAK,EACL,WAAW,EACX,cAAc,EACf,MAAM,SAAS,CAAC;AAKjB,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAChC,OAAO,EAAE,GAAG,CAAC;IACb,OAAO,EAAE,GAAG,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,WAAW,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC;IACZ,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,CAAC;IACpB,eAAe,EAAE,cAAc,CAAC;IAChC,WAAW,EAAE,UAAU,CAAC;IACxB,QAAQ,EAAE,aAAa,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,GAAG,GAAG,CAAC,OAAO,CAsrBd"}

package/dist/DrawCanvas.js

@@ -76,18 +76,6 @@ export function DrawCanvas(props) {
             const polygon = new Polygon(props.coords.coords.Points, universeCenter);
             polygon.drawPolygon(context, 'black', 0.2);
         }
-        if (props.show.catmullRomCenter) {
-            if (props.catmullRomPoints.catmullRomPoints) {
-                new Point(0, 0, universeCenter).drawCross(context, 'blue', 100, 15);
-                // props.catmullRomPoints.catmullRomPoints.drawCenter(context, 'blue');
-            }
-        }
-        if (props.show.catmullRomPoints) {
-            if (props.catmullRomPoints.catmullRomPoints &&
-                props.catmullRomPoints.catmullRomPoints.Length > 0) {
-                props.catmullRomPoints.catmullRomPoints.drawPoints(context, true, 'blue');
-            }
-        }
         if (props.show.points) {
             sortedPoints.drawPoints(context, 'green');
             if (props.machine.name === STATUS.X_AXIS_STARTED) {
@@ -113,7 +101,6 @@ export function DrawCanvas(props) {
             sortedPoints.drawCatmullRom(context);
         }
         if (props.machine.name === STATUS.FORM_SCALED) {
-            const origin = props.coords.coords.UniverseCenter;
             // const trademarkPolygon = props.coords.coords.scale(0.9, 0.9);
             // const trademarkPolygon = props.coords.coords.scaleByRadius(0.9);
             // setTradeMarkLine(trademarkPolygon);
@@ -176,14 +163,11 @@ export function DrawCanvas(props) {
         props.show.box,
         props.show.scaledBox,
         props.show.polygon,
-        props.show.catmullRomCenter,
-        props.show.catmullRomPoints,
         props.show.points,
         props.show.catmullRom,
         props.machine.name,
         props.scaledSL,
         props.scaledSH,
-        props.catmullRomPoints.catmullRomPoints,
         props.axis.axis.x1,
         props.axis.axis.x2,
         universeCenter,
@@ -199,14 +183,16 @@ export function DrawCanvas(props) {
     const loadTrademarkImage = useCallback((onLoad) => {
         const newImg = new window.Image();
         newImg.onload = () => onLoad(newImg);
-        newImg.onerror = () => console.warn('Failed to load trademark image');
+        newImg.onerror = () => {
+            console.warn(`Failed to load trademark image from '${newImg.src}'`);
+        };
         if (props.trademarkImageUrl) {
             // Use the URL provided by the external program
             newImg.src = props.trademarkImageUrl;
         }
         else {
             // Fallback to default asset path for backward compatibility
-            newImg.src = new URL('../assets/rlogo.gif', import.meta.url).href;
+            newImg.src = new URL('./assets/rlogo.gif', import.meta.url).href;
         }
     }, [props.trademarkImageUrl]);
     // Split drawImageBackground into two functions: loadImage and drawImageBackground
@@ -570,5 +556,5 @@ export function DrawCanvas(props) {
     useEffect(() => {
         loadTrademarkImage(setTrademarkImage);
     }, [loadTrademarkImage]);
-    return (_jsx("canvas", { ref: canvasRef, width: props.width, height: props.height, id: "idCanvas", style: { backgroundColor: 'lightgrey' }, children: "Your browser does not support the HTML canvas tag." }));
+    return (_jsx("canvas", { "data-testid": "canvas.draw", ref: canvasRef, width: props.width, height: props.height, id: "idCanvas", style: { backgroundColor: 'lightgrey' }, children: "Your browser does not support the HTML canvas tag." }));
 }

package/dist/Finish.d.ts

@@ -7,7 +7,7 @@ export declare function Finish(props: {
     coords: TCoordsHook;
     trademarkCenter: TTrademarkHook;
     onLoad: (nrPoints: number) => void;
-    onAfterTransform: () => void;
+    onAfterTransform: (coordinates: Polygon) => void;
     onAfterReset: () => void;
     onClose: (pol: Polygon, trademark?: Point) => () => void;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/Finish.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Finish.d.ts","sourceRoot":"","sources":["../src/Finish.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGtD,wBAAgB,MAAM,CAAC,KAAK,EAAE;IAC5B,cAAc,EAAE,KAAK,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,WAAW,CAAC;IACpB,eAAe,EAAE,cAAc,CAAC;IAChC,MAAM,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,OAAO,EAAE,CAAC,GAAG,EAAE,OAAO,EAAE,SAAS,CAAC,EAAE,KAAK,KAAK,MAAM,IAAI,CAAC;CAC1D,2CAyIA"}
+{"version":3,"file":"Finish.d.ts","sourceRoot":"","sources":["../src/Finish.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGtD,wBAAgB,MAAM,CAAC,KAAK,EAAE;IAC5B,cAAc,EAAE,KAAK,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,WAAW,CAAC;IACpB,eAAe,EAAE,cAAc,CAAC;IAChC,MAAM,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,gBAAgB,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,OAAO,EAAE,CAAC,GAAG,EAAE,OAAO,EAAE,SAAS,CAAC,EAAE,KAAK,KAAK,MAAM,IAAI,CAAC;CAC1D,2CAoGA"}

package/dist/Finish.js

@@ -15,25 +15,6 @@ export function Finish(props) {
         left: '50%',
         transform: 'translate(-50%, -50%)',
     };
-    const refine = (coordinates) => {
-        // 1) Transform to Center
-        const prevCenter = coordinates.Center;
-        let transformed = coordinates.transform(prevCenter.x, prevCenter.y, props.universeCenter);
-        // 2) Convert to Spline
-        const xCenter = (coordinates.XMax + coordinates.XMin) / 2;
-        const yCenter = (coordinates.YMax + coordinates.YMin) / 2;
-        const catmullRomPolygon = transformed.createCatmullRomPoints(props.nrPoints, new Point(xCenter, yCenter));
-        // setCatmullRomPoints(catmullRomPolygon);
-        // 3) Reset Spline and adjust Points to new origin
-        // if (catmullRomPolygon) {
-        //   setCoords(catmullRomPolygon);
-        // }
-        // setCatmullRomPoints(undefined);
-        const dist = Math.hypot(catmullRomPolygon.Center.X, catmullRomPolygon.Center.Y);
-        // 4) Retransform back to Center
-        transformed = catmullRomPolygon.transform(-prevCenter.X, -prevCenter.Y, props.universeCenter);
-        return { coords: transformed, dist };
-    };
     const onTransform = () => {
         const coordinates = props.coords.coords.clone();
         setOriginalCoords(props.coords.coords);
@@ -49,7 +30,7 @@ export function Finish(props) {
             return new Point(p.X + center.X, p.Y + center.Y, props.universeCenter);
         }), props.universeCenter);
         props.coords.setCoords(newCoordinates);
-        props.onAfterTransform();
+        props.onAfterTransform(coordinates);
     };
     const onReset = () => {
         if (originalCoords) {
@@ -58,7 +39,7 @@ export function Finish(props) {
             props.onAfterReset();
         }
     };
-    return (_jsxs(Box, { id: "id.Finish", sx: styleButton, children: [_jsx(Button, { variant: "contained", disabled: props.coords.coords.Length < 3, onClick: originalCoords === undefined ? onTransform : onReset, sx: { width: '200px' }, children: originalCoords === undefined ? 'Start Transformation' : 'Undo' }), _jsx(Button, { "data-testid": "id.button.CreateRT1", variant: "contained", disabled: originalCoords === undefined, onClick: props.onClose(props.coords.coords, props.trademarkCenter.trademarkCenter), children: "Create RT1" }), _jsx(Button, { variant: "contained", onClick: () => {
+    return (_jsxs(Box, { id: "id.Finish", sx: styleButton, children: [_jsx(Button, { "data-testid": "button.start-transformation", variant: "contained", disabled: props.coords.coords.Length < 3, onClick: originalCoords === undefined ? onTransform : onReset, sx: { width: '200px' }, children: originalCoords === undefined ? 'Start Transformation' : 'Undo' }), _jsx(Button, { "data-testid": "button.create-rt1", variant: "contained", disabled: originalCoords === undefined, onClick: props.onClose(props.coords.coords, props.trademarkCenter.trademarkCenter), children: "Create RT1" }), _jsx(Button, { variant: "contained", onClick: () => {
                     props.coords.coords.save('frame.image.json');
                 }, children: "Save Points" }), _jsxs(Button, { variant: "contained", component: "label", children: ["Load Points", _jsx("input", { type: "file", accept: "application/json", hidden: true, onChange: async (e) => {
                             const file = e.target.files?.[0];

package/dist/ModalDesigner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalDesigner.d.ts","sourceRoot":"","sources":["../src/ModalDesigner.tsx"],"names":[],"mappings":"AAGA,wBAAgB,aAAa,CAAC,KAAK,EAAE;IACnC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC,2CA+BA"}
+{"version":3,"file":"ModalDesigner.d.ts","sourceRoot":"","sources":["../src/ModalDesigner.tsx"],"names":[],"mappings":"AAKA,wBAAgB,aAAa,CAAC,KAAK,EAAE;IACnC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC,2CAoDA"}

package/dist/ModalDesigner.js

@@ -2,6 +2,15 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Box, Modal } from '@mui/material';
 import { Designer } from './Designer';
 export function ModalDesigner(props) {
+    function logPolygon(coordinates) {
+        console.log('Transformed Polygon:', JSON.stringify(coordinates.toJSON(), null));
+    }
+    function logScaling(length, height) {
+        console.log('Scaled Dimensions:', length, height);
+    }
+    function logTrademark(tradeMark) {
+        console.log('Trademark Position:', tradeMark.X, tradeMark.Y);
+    }
     return (_jsx(Modal, { open: props.isOpen, onClose: props.onClose, "aria-labelledby": "modal-title", "aria-describedby": "modal-description", children: _jsx(Box, { id: "id.box.ModalDesigner", sx: {
                 width: 1400,
                 height: 900,
@@ -17,5 +26,5 @@ export function ModalDesigner(props) {
                 borderRadius: 2,
                 display: 'flex',
                 flexDirection: 'column',
-            }, children: _jsx(Designer, { onClose: props.onClose, nrPoints: 128 }) }) }));
+            }, children: _jsx(Designer, { onClose: props.onClose, nrPoints: 128, callBackAfterTransform: logPolygon, callbackAfterScale: logScaling, callbackAfterTrademark: logTrademark }) }) }));
 }

package/dist/Polygon.d.ts

@@ -42,7 +42,7 @@ export declare class Polygon {
     findMinDistancePoint(point: Point): number;
     transform(x: number, y: number, universeCenter: Point): Polygon;
     scale(width: number, height: number): Polygon;
-    createCatmullRomPoints(nrPoints: number, origin?: Point): Polygon;
+    createCatmullRomPoints(nrPoints: number): Polygon;
     findNearestPoint(point: Point): number;
     createRT1(): string;
     createTR1(): string;

package/dist/Polygon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Polygon.d.ts","sourceRoot":"","sources":["../src/Polygon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAIhC,qBAAa,OAAO;IAClB,OAAO,CAAC,MAAM,CAAU;IACxB,OAAO,CAAC,cAAc,CAAQ;IAC9B,OAAO,CAAC,IAAI,CAAS;IACrB,OAAO,CAAC,IAAI,CAAS;IACrB,OAAO,CAAC,IAAI,CAAS;IACrB,OAAO,CAAC,IAAI,CAAS;IAErB,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,KAAK,EAAE,CAAC;QAAC,cAAc,EAAE,KAAK,CAAA;KAAE,GAAG,OAAO;gBAQ9D,MAAM,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,KAAK;IASlD,IAAI,cAAc,IAAI,KAAK,CAE1B;IAED,KAAK,IAAI,OAAO;IAKhB,MAAM,IAAI;QACR,MAAM,EAAE;YAAE,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAE,EAAE,CAAC;QACnC,cAAc,EAAE;YAAE,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC;KAC1C;IAOD,IAAI,CAAC,IAAI,EAAE,MAAM;IAajB,IAAI,MAAM,IAAI,MAAM,CAEnB;IAED,IAAI,MAAM,IAAI,KAAK,EAAE,CAEpB;IAED,IAAI,QAAQ;;;QAIX;IAED,IAAI,IAAI,IAAI,MAAM,CAEjB;IACD,IAAI,IAAI,IAAI,MAAM,CAEjB;IACD,IAAI,IAAI,IAAI,MAAM,CAEjB;IACD,IAAI,IAAI,IAAI,MAAM,CAEjB;IAED,IAAI,MAAM,IAAI,KAAK,CAOlB;IAED,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK;IAOxB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,IAAI;IAOtC,IAAI,CAAC,KAAK,EAAE,KAAK,GAAG,OAAO;IAK3B,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAK7B,oBAAoB,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM;IAY1C,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,GAAG,OAAO;IAQ/D,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO;IAU7C,sBAAsB,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,GAAG,OAAO;IAsBjE,gBAAgB,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM;IAYtC,SAAS,IAAI,MAAM;IAiCnB,SAAS,IAAI,MAAM;IAOnB,WAAW,IAAI,MAAM;IASrB,uBAAuB,IAAI,IAAI;IAwB/B,UAAU,CACR,OAAO,EAAE,wBAAwB,EACjC,eAAe,EAAE,OAAO,EACxB,KAAK,SAAW,GACf,IAAI;IAsBP,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAWzC,WAAW,CACT,OAAO,EAAE,wBAAwB,EACjC,KAAK,SAAQ,EACb,SAAS,SAAI,EACb,OAAO,SAAc,GACpB,IAAI;IAoBP,WAAW,CACT,OAAO,EAAE,wBAAwB,EACjC,KAAK,SAAQ,EACb,YAAY,SAAM,GACjB,IAAI;IAuBP,UAAU,CAAC,OAAO,EAAE,wBAAwB,EAAE,KAAK,SAAU,GAAG,IAAI;CAMrE"}
+{"version":3,"file":"Polygon.d.ts","sourceRoot":"","sources":["../src/Polygon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAIhC,qBAAa,OAAO;IAClB,OAAO,CAAC,MAAM,CAAU;IACxB,OAAO,CAAC,cAAc,CAAQ;IAC9B,OAAO,CAAC,IAAI,CAAS;IACrB,OAAO,CAAC,IAAI,CAAS;IACrB,OAAO,CAAC,IAAI,CAAS;IACrB,OAAO,CAAC,IAAI,CAAS;IAErB,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,KAAK,EAAE,CAAC;QAAC,cAAc,EAAE,KAAK,CAAA;KAAE,GAAG,OAAO;gBAQ9D,MAAM,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,KAAK;IASlD,IAAI,cAAc,IAAI,KAAK,CAE1B;IAED,KAAK,IAAI,OAAO;IAKhB,MAAM,IAAI;QACR,MAAM,EAAE;YAAE,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAE,EAAE,CAAC;QACnC,cAAc,EAAE;YAAE,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC;KAC1C;IAOD,IAAI,CAAC,IAAI,EAAE,MAAM;IAajB,IAAI,MAAM,IAAI,MAAM,CAEnB;IAED,IAAI,MAAM,IAAI,KAAK,EAAE,CAEpB;IAED,IAAI,QAAQ;;;QAIX;IAED,IAAI,IAAI,IAAI,MAAM,CAEjB;IACD,IAAI,IAAI,IAAI,MAAM,CAEjB;IACD,IAAI,IAAI,IAAI,MAAM,CAEjB;IACD,IAAI,IAAI,IAAI,MAAM,CAEjB;IAED,IAAI,MAAM,IAAI,KAAK,CAOlB;IAED,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK;IAOxB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,IAAI;IAOtC,IAAI,CAAC,KAAK,EAAE,KAAK,GAAG,OAAO;IAK3B,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAK7B,oBAAoB,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM;IAY1C,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,GAAG,OAAO;IAQ/D,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO;IAU7C,sBAAsB,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO;IAsBjD,gBAAgB,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM;IAYtC,SAAS,IAAI,MAAM;IAiCnB,SAAS,IAAI,MAAM;IAOnB,WAAW,IAAI,MAAM;IASrB,uBAAuB,IAAI,IAAI;IAwB/B,UAAU,CACR,OAAO,EAAE,wBAAwB,EACjC,eAAe,EAAE,OAAO,EACxB,KAAK,SAAW,GACf,IAAI;IAsBP,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAWzC,WAAW,CACT,OAAO,EAAE,wBAAwB,EACjC,KAAK,SAAQ,EACb,SAAS,SAAI,EACb,OAAO,SAAc,GACpB,IAAI;IAoBP,WAAW,CACT,OAAO,EAAE,wBAAwB,EACjC,KAAK,SAAQ,EACb,YAAY,SAAM,GACjB,IAAI;IAuBP,UAAU,CAAC,OAAO,EAAE,wBAAwB,EAAE,KAAK,SAAU,GAAG,IAAI;CAMrE"}

package/dist/Polygon.js

@@ -119,7 +119,7 @@ export class Polygon {
         });
         return new Polygon(scaledPoints, this.universeCenter);
     }
-    createCatmullRomPoints(nrPoints, origin) {
+    createCatmullRomPoints(nrPoints) {
         const points = this.points.map((xPoint) => {
             return new Point(xPoint.X, xPoint.Y);
         });

package/dist/ScaleForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScaleForm.d.ts","sourceRoot":"","sources":["../src/ScaleForm.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAInD,wBAAgB,SAAS,CAAC,KAAK,EAAE;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,WAAW,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,WAAW,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3D,2CAuNA"}
+{"version":3,"file":"ScaleForm.d.ts","sourceRoot":"","sources":["../src/ScaleForm.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAInD,wBAAgB,SAAS,CAAC,KAAK,EAAE;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,WAAW,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,WAAW,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3D,2CAsNA"}

package/dist/ScaleForm.js

@@ -14,7 +14,6 @@ export function ScaleForm(props) {
     const [inputLength, setInputLength] = useState(props.scaledSL.value ?? 0);
     const [length, setLength] = useState(props.scaledSL.value);
     const [height, setHeight] = useState(props.scaledSH.value);
-    const [ratio, setRatio] = useState(1);
     function onChangeLength(e) {
         const newLength = Math.round(parseFloat(e.target.value) * scalingParam) / scalingParam;
         // ratio = length / height
@@ -49,7 +48,7 @@ export function ScaleForm(props) {
         const { points } = createEquidistantPoints(scaledPolygon.Points, scaledPolygon.Points.length);
         const equidistantPolygon = new Polygon(points.map((pt) => new Point(pt.X, pt.Y, props.coords.coords.UniverseCenter)), props.coords.coords.UniverseCenter);
         props.coords.setCoords(equidistantPolygon);
-        props.onCloseContinue(drawnLength, height ?? 0);
+        props.onCloseContinue(length ?? 0, height ?? 0);
     };
     let xMin = 0;
     let xMax = 0;
@@ -81,7 +80,7 @@ export function ScaleForm(props) {
     useEffect(() => {
         if (inputLength !== 0 && drawnLength !== 0) {
             setLength(inputLength);
-            setRatio(inputLength / drawnLength);
+            // setRatio(inputLength / drawnLength);
         }
     }, [drawnLength, inputLength]);
     function renderExtension(extensionString, min, max) {

package/dist/Scaling.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Scaling.d.ts","sourceRoot":"","sources":["../src/Scaling.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,GAAG,EAAE,MAAM,OAAO,CAAC;AAGzC,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAC7B,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;IAChE,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;IAChE,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,GAAG,GAAG,CAAC,OAAO,CA8Cd"}
+{"version":3,"file":"Scaling.d.ts","sourceRoot":"","sources":["../src/Scaling.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,GAAG,EAAE,MAAM,OAAO,CAAC;AAEzC,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAC7B,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;IAChE,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;IAChE,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,GAAG,GAAG,CAAC,OAAO,CA8Cd"}

package/dist/ShowOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ShowOptions.d.ts","sourceRoot":"","sources":["../src/ShowOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,GAAG,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,wBAAgB,WAAW,CAAC,KAAK,EAAE;IACjC,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;CACtD,GAAG,GAAG,CAAC,OAAO,CAoHd"}
+{"version":3,"file":"ShowOptions.d.ts","sourceRoot":"","sources":["../src/ShowOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,GAAG,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAGhC,wBAAgB,WAAW,CAAC,KAAK,EAAE;IACjC,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;CACtD,GAAG,GAAG,CAAC,OAAO,CAoGd"}

package/dist/ShowOptions.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FormControlLabel, Switch } from '@mui/material';
 export function ShowOptions(props) {
     function handleCheckboxChange(key) {
         return (e) => {
@@ -14,18 +15,6 @@ export function ShowOptions(props) {
     const handleCheckboxScaledBoxChange = handleCheckboxChange('scaledBox');
     const handleCheckboxPolygonChange = handleCheckboxChange('polygon');
     const handleCheckboxPointsChange = handleCheckboxChange('points');
-    const handleCheckboxCatmullRomCenterChange = handleCheckboxChange('catmullRomCenter');
-    const handleCheckboxCatmullRomPointsChange = handleCheckboxChange('catmullRomPoints');
     const handleCheckboxCatmullRomChange = handleCheckboxChange('catmullRom');
-    return (_jsxs("div", { id: "id.ShowOptions", children: [_jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.background, onChange: (e) => handleCheckboxBackgroundChange(e) }), "Background"] }), _jsxs("div", { style: {
-                    background: 'lightgreen',
-                    padding: '4px',
-                    borderRadius: '4px',
-                    display: 'inline-block',
-                }, children: [_jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.center, onChange: (e) => handleCheckboxCenterChange(e) }), "Center"] }), _jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.points, onChange: (e) => handleCheckboxPointsChange(e) }), "Points"] }), _jsxs("label", { style: { marginLeft: '8px' }, children: [_jsx("input", { type: "checkbox", checked: props.show.polygon, onChange: (e) => handleCheckboxPolygonChange(e) }), "Polygon"] })] }), _jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.box, onChange: (e) => handleCheckboxBoxChange(e) }), "Box"] }), _jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.scaledBox, onChange: (e) => handleCheckboxScaledBoxChange(e) }), "Scaled Box"] }), _jsxs("div", { style: {
-                    background: 'lightblue',
-                    padding: '4px',
-                    borderRadius: '4px',
-                    display: 'inline-block',
-                }, children: [_jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.catmullRomCenter, onChange: (e) => handleCheckboxCatmullRomCenterChange(e) }), "Center"] }), _jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.catmullRomPoints, onChange: (e) => handleCheckboxCatmullRomPointsChange(e) }), "Catmull-Rom Points"] }), _jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: props.show.catmullRom, onChange: handleCheckboxCatmullRomChange }), "Catmull-Rom"] })] })] }));
+    return (_jsxs("div", { id: "id.ShowOptions", children: [_jsx(FormControlLabel, { control: _jsx(Switch, { checked: props.show.background, onChange: handleCheckboxBackgroundChange }), label: "Background" }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: props.show.center, onChange: handleCheckboxCenterChange }), label: "Center" }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: props.show.points, onChange: handleCheckboxPointsChange }), label: "Points" }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: props.show.polygon, onChange: handleCheckboxPolygonChange }), label: "Polygon", style: { marginLeft: '8px' } }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: props.show.box, onChange: handleCheckboxBoxChange }), label: "Box" }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: props.show.scaledBox, onChange: handleCheckboxScaledBoxChange }), label: "Scaled Box" }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: props.show.catmullRom, onChange: handleCheckboxCatmullRomChange }), label: "Catmull-Rom" })] }));
 }

package/dist/Start.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Start.d.ts","sourceRoot":"","sources":["../src/Start.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,wBAAgB,KAAK,CAAC,KAAK,EAAE;IAC3B,MAAM,EAAE,KAAK,CAAC;IACd,OAAO,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,iBAAiB,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,KAAK,KAAK,IAAI,CAAC;IACpE,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC,2CAyHA"}
+{"version":3,"file":"Start.d.ts","sourceRoot":"","sources":["../src/Start.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,wBAAgB,KAAK,CAAC,KAAK,EAAE;IAC3B,MAAM,EAAE,KAAK,CAAC;IACd,OAAO,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,iBAAiB,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,KAAK,KAAK,IAAI,CAAC;IACpE,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC,2CA+GA"}

package/dist/Start.js

@@ -6,15 +6,6 @@ import PointsForm from './PointsForm';
 export function Start(props) {
     const fileInputRef = useRef(null);
     const [showModalPointsForm, setShowModalPointsForm] = useState(false);
-    const styleButton = {
-    // display: 'flex',
-    // flexDirection: 'column',
-    // gap: 2,
-    // padding: 1,
-    // position: 'absolute' as const,
-    // top: '38%',
-    // left: '7%',
-    };
     const actions = getValidActions(props.machine);
     function isDisabled(action) {
         return actions.findIndex((a) => a === action) === -1;

package/dist/Workflow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Workflow.d.ts","sourceRoot":"","sources":["../src/Workflow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAU,MAAM,OAAO,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAGhC,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,GAAG,GAAG,CAAC,OAAO,CAqFd"}
+{"version":3,"file":"Workflow.d.ts","sourceRoot":"","sources":["../src/Workflow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAU,MAAM,OAAO,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAGhC,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,GAAG,GAAG,CAAC,OAAO,CAkFd"}

package/dist/Workflow.js

@@ -3,9 +3,6 @@ import { useRef } from 'react';
 import { STATUS } from './enum';
 import { Button, Input } from '@mui/material';
 export function Workflow(props) {
-    function onLoadImage() {
-        props.setStatus(STATUS.LOAD_IMAGE);
-    }
     function onDefineXAxis() {
         props.setStatus(STATUS.DEFINE_X_AXIS_1);
     }

package/dist/index.d.ts

@@ -6,7 +6,7 @@ export { Finish } from './Finish';
 export { ScaleForm } from './ScaleForm';
 export { ShowOptions } from './ShowOptions';
 export { States } from './States';
-export { TCoordsHook, TStatusHook, TShowHook, TAxisHook, TMouseCoordsHook, TImageHook, TRotationHook, TCatmullRomPointsHook, } from './types';
+export { TCoordsHook, TStatusHook, TShowHook, TAxisHook, TMouseCoordsHook, TImageHook, TRotationHook, TCatmullRomPointsHook, TShow, } from './types';
 export { Polygon } from './Polygon';
 export { Point } from './Point';
 export { rlogo };

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,yBAAyB,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EACL,WAAW,EACX,WAAW,EACX,SAAS,EACT,SAAS,EACT,gBAAgB,EAChB,UAAU,EACV,aAAa,EACb,qBAAqB,GACtB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,KAAK,EAAE,CAAC;AAGjB,wBAAgB,oBAAoB,IAAI,MAAM,CAE7C;AAGD,wBAAgB,kBAAkB,IAAI,OAAO,CAAC,gBAAgB,CAAC,CAO9D"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,yBAAyB,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EACL,WAAW,EACX,WAAW,EACX,SAAS,EACT,SAAS,EACT,gBAAgB,EAChB,UAAU,EACV,aAAa,EACb,qBAAqB,EACrB,KAAK,GACN,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,KAAK,EAAE,CAAC;AAGjB,wBAAgB,oBAAoB,IAAI,MAAM,CAE7C;AAGD,wBAAgB,kBAAkB,IAAI,OAAO,CAAC,gBAAgB,CAAC,CAO9D"}

package/dist/types.d.ts

@@ -2,9 +2,7 @@ import { STATUS } from 'frame.statemachine';
 import { Point } from './Point';
 import { Polygon } from './Polygon';
 export type TShow = {
-    catmullRomPoints: boolean;
     catmullRom: boolean;
-    catmullRomCenter: boolean;
     points: boolean;
     polygon: boolean;
     center: boolean;

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "frame.image",
-  "version": "1.6.5",
+  "version": "1.6.7",
   "description": "A React component for drawing a frame on a canvas element.",
   "license": "MIT",
   "author": "Christian.Todd@rodenstock.com",
@@ -26,15 +26,18 @@
     "dev": "vite",
     "build": "tsc -b",
     "test": "vitest",
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui",
+    "test:e2e:debug": "playwright test --debug",
     "doc": "typedoc --options typedoc.json --tsconfig ./tsconfig.json --logLevel Verbose",
     "build-with-vite": "tsc -b && vite build",
     "lint": "eslint .",
     "preview": "vite preview"
   },
   "peerDependencies": {
+    "@mui/material": ">=7.0.0",
     "react": ">=18.0.0",
-    "react-dom": ">=18.0.0",
-    "@mui/material": ">=7.0.0"
+    "react-dom": ">=18.0.0"
   },
   "dependencies": {
     "@emotion/react": "^11.14.0",
@@ -42,25 +45,27 @@
     "frame.akima": "^2.0.1",
     "frame.nidek": "^1.1.4",
     "frame.statemachine": "^1.1.4",
-    "react-error-boundary": "^6.0.0",
+    "playwright": "^1.57.0",
+    "react-error-boundary": "^6.0.3",
     "react-robot": "^1.2.1"
   },
   "devDependencies": {
-    "@eslint/js": "^9.39.1",
-    "@mui/material": "^7.3.6",
-    "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
+    "@eslint/js": "^9.39.2",
+    "@mui/material": "^7.3.7",
+    "@playwright/test": "^1.57.0",
+    "@types/react": "^19.2.8",
+    "@types/react-dom": "^19.2.3",
     "@vitejs/plugin-react": "^5.1.2",
-    "eslint": "^9.39.1",
+    "eslint": "^9.39.2",
     "eslint-plugin-react-hooks": "^7.0.1",
-    "eslint-plugin-react-refresh": "^0.4.24",
-    "globals": "^16.5.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "typedoc": "^0.28.15",
+    "eslint-plugin-react-refresh": "^0.4.26",
+    "globals": "^17.0.0",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "typedoc": "^0.28.16",
     "typescript": "~5.9.3",
-    "typescript-eslint": "^8.49.0",
-    "vite": "^7.2.7",
-    "vitest": "^4.0.15"
+    "typescript-eslint": "^8.53.0",
+    "vite": "^7.3.1",
+    "vitest": "^4.0.17"
   }
 }