@wixc3/board-core - npm Package Compare versions

Comparing version 2.6.0 to 3.0.0-next.0

dist/setup-stage.d.ts

@@ -1,2 +0,2 @@
-import type { BoardSetupStageFunction, CanvasStyles } from './types';
+import type { BoardSetupStageFunction } from './types';
 export declare const defaultWindowStyles: {
@@ -6,10 +6,7 @@ readonly width: 1024;
 };
-export declare const defaultCanvasStyles: CanvasStyles;
 export declare const defaultEnvironmentProperties: {
     windowWidth: 1024;
     windowHeight: 640;
-    canvasMargin: {};
-    canvasPadding: {};
 };
 export declare const setupBoardStage: BoardSetupStageFunction;
 //# sourceMappingURL=setup-stage.d.ts.map

dist/setup-stage.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.setupBoardStage = exports.defaultEnvironmentProperties = exports.defaultCanvasStyles = exports.defaultWindowStyles = void 0;
+exports.setupBoardStage = exports.defaultEnvironmentProperties = exports.defaultWindowStyles = void 0;
 const hooks_1 = require("./hooks");
@@ -9,19 +9,5 @@ exports.defaultWindowStyles = {
 };
-exports.defaultCanvasStyles = {
-    width: 'fit-content',
-    height: 'fit-content',
-    marginLeft: 'auto',
-    marginRight: 'auto',
-    marginBottom: 'auto',
-    marginTop: 'auto',
-    paddingLeft: '0px',
-    paddingRight: '0px',
-    paddingBottom: '0px',
-    paddingTop: '0px',
-};
 exports.defaultEnvironmentProperties = {
     windowWidth: exports.defaultWindowStyles.width,
     windowHeight: exports.defaultWindowStyles.height,
-    canvasMargin: {},
-    canvasPadding: {},
 };
@@ -35,62 +21,13 @@ const applyStylesToWindow = (windowStyles = {}, previousProps) => {
 };
-const applyStylesToCanvas = (canvas, environmentProps = {}) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
-    const canvasStyle = {
-        width: environmentProps.canvasWidth !== undefined
-            ? `${environmentProps.canvasWidth}px`
-            : exports.defaultCanvasStyles.width,
-        height: environmentProps.canvasHeight !== undefined
-            ? `${environmentProps.canvasHeight}px`
-            : exports.defaultCanvasStyles.height,
-        marginLeft: ((_a = environmentProps.canvasMargin) === null || _a === void 0 ? void 0 : _a.left) !== undefined
-            ? `${(_b = environmentProps.canvasMargin) === null || _b === void 0 ? void 0 : _b.left}px`
-            : exports.defaultCanvasStyles.marginLeft,
-        marginRight: ((_c = environmentProps.canvasMargin) === null || _c === void 0 ? void 0 : _c.right) !== undefined
-            ? `${(_d = environmentProps.canvasMargin) === null || _d === void 0 ? void 0 : _d.right}px`
-            : exports.defaultCanvasStyles.marginRight,
-        marginBottom: ((_e = environmentProps.canvasMargin) === null || _e === void 0 ? void 0 : _e.bottom) !== undefined
-            ? `${(_f = environmentProps.canvasMargin) === null || _f === void 0 ? void 0 : _f.bottom}px`
-            : exports.defaultCanvasStyles.marginBottom,
-        marginTop: ((_g = environmentProps.canvasMargin) === null || _g === void 0 ? void 0 : _g.top) !== undefined
-            ? `${(_h = environmentProps.canvasMargin) === null || _h === void 0 ? void 0 : _h.top}px`
-            : exports.defaultCanvasStyles.marginTop,
-        paddingLeft: ((_j = environmentProps.canvasPadding) === null || _j === void 0 ? void 0 : _j.left) !== undefined
-            ? `${(_k = environmentProps.canvasPadding) === null || _k === void 0 ? void 0 : _k.left}px`
-            : exports.defaultCanvasStyles.paddingLeft,
-        paddingRight: ((_l = environmentProps.canvasPadding) === null || _l === void 0 ? void 0 : _l.right) !== undefined
-            ? `${(_m = environmentProps.canvasPadding) === null || _m === void 0 ? void 0 : _m.right}px`
-            : exports.defaultCanvasStyles.paddingRight,
-        paddingBottom: ((_o = environmentProps.canvasPadding) === null || _o === void 0 ? void 0 : _o.bottom) !== undefined
-            ? `${(_p = environmentProps.canvasPadding) === null || _p === void 0 ? void 0 : _p.bottom}px`
-            : exports.defaultCanvasStyles.paddingBottom,
-        paddingTop: ((_q = environmentProps.canvasPadding) === null || _q === void 0 ? void 0 : _q.top) !== undefined
-            ? `${(_r = environmentProps.canvasPadding) === null || _r === void 0 ? void 0 : _r.top}px`
-            : exports.defaultCanvasStyles.paddingTop,
-        backgroundColor: environmentProps.canvasBackgroundColor || '',
-    };
-    // Canvas gets stretched horizontally/vertically
-    // when horizontal (left and right) or vertical (top and bottom) margins are applied.
-    if (((_s = environmentProps.canvasMargin) === null || _s === void 0 ? void 0 : _s.left) !== undefined && environmentProps.canvasMargin.right !== undefined) {
-        canvasStyle.width = '100%';
-    }
-    if (((_t = environmentProps.canvasMargin) === null || _t === void 0 ? void 0 : _t.top) !== undefined && environmentProps.canvasMargin.bottom !== undefined) {
-        canvasStyle.height = 'auto';
-    }
-    Object.assign(canvas.style, canvasStyle);
-};
 const setupBoardStage = (board, parentElement) => {
     const previousWindowEnvironmentProps = {};
     const canvas = document.createElement('div');
+    (0, hooks_1.callHooks)(board, 'beforeAppendCanvas', canvas);
+    parentElement.appendChild(canvas);
     canvas.setAttribute('id', 'board-canvas');
     const { environmentProps } = board;
-    applyStylesToWindow(environmentProps, previousWindowEnvironmentProps);
-    applyStylesToCanvas(canvas, environmentProps);
-    (0, hooks_1.callHooks)(board, 'beforeAppendCanvas', canvas);
-    parentElement.appendChild(canvas);
-    const updateCanvas = (canvasEnvironmentProps) => {
-        applyStylesToCanvas(canvas, canvasEnvironmentProps);
-    };
     const updateWindow = (windowEnvironmentProps) => {
         applyStylesToWindow(windowEnvironmentProps, previousWindowEnvironmentProps);
     };
+    applyStylesToWindow(environmentProps, previousWindowEnvironmentProps);
     const cleanup = () => {
@@ -103,5 +40,10 @@ (0, hooks_1.callHooks)(board, 'beforeStageCleanUp', canvas);
     };
-    return { canvas, updateCanvas, updateWindow, cleanup };
+    // backward compatibility with older versions
+    //  of Codux that still use updateCanvas
+    function updateCanvas() {
+        return;
+    }
+    return { canvas, updateWindow, updateCanvas, cleanup };
 };
 exports.setupBoardStage = setupBoardStage;
 //# sourceMappingURL=setup-stage.js.map

dist/types.d.ts

@@ -23,11 +23,11 @@ export type LayoutSize = number | undefined | null;
 export interface ICanvasEnvironmentProps {
-    /** @visualizer spacing */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasWidth?: LayoutSizeWithAuto | undefined;
-    /** @visualizer spacing */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasHeight?: LayoutSizeWithAuto | undefined;
-    /** @visualizer color */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasBackgroundColor?: string | undefined;
-    /** @visualizer canvasMargin */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasMargin?: LayoutSpacing | undefined;
-    /** @visualizer canvasPadding */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasPadding?: LayoutSpacing | undefined;
@@ -103,3 +103,2 @@ }
 };
-export type CanvasStyles = Pick<CSSStyleDeclaration, 'height' | 'width' | 'paddingLeft' | 'paddingRight' | 'paddingBottom' | 'paddingTop' | 'marginLeft' | 'marginRight' | 'marginBottom' | 'marginTop'>;
 //# sourceMappingURL=types.d.ts.map

package.json

 {
   "name": "@wixc3/board-core",
   "description": "Types and helpers for component boards",
-  "version": "2.6.0",
+  "version": "3.0.0-next.0",
   "main": "dist/index.js",
@@ -6,0 +6,0 @@ "files": [

src/types.ts

@@ -28,11 +28,11 @@ export type LayoutSize = number | undefined | null;
 export interface ICanvasEnvironmentProps {
-    /** @visualizer spacing */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasWidth?: LayoutSizeWithAuto | undefined;
-    /** @visualizer spacing */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasHeight?: LayoutSizeWithAuto | undefined;
-    /** @visualizer color */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasBackgroundColor?: string | undefined;
-    /** @visualizer canvasMargin */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasMargin?: LayoutSpacing | undefined;
-    /** @visualizer canvasPadding */
+    /** @deprecated canvas cannot be edited anymore, create your own container to control the preview */
     canvasPadding?: LayoutSpacing | undefined;
@@ -162,15 +162,1 @@ }
 };
-
-export type CanvasStyles = Pick<
-    CSSStyleDeclaration,
-    | 'height'
-    | 'width'
-    | 'paddingLeft'
-    | 'paddingRight'
-    | 'paddingBottom'
-    | 'paddingTop'
-    | 'marginLeft'
-    | 'marginRight'
-    | 'marginBottom'
-    | 'marginTop'
->;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of downloads

5288

increased by31.22%

Worsened metrics

Total package byte prevSize

36751

decreased by-20.24%

Lines of code

529

decreased by-21.16%

Number of low quality alerts

1

increased byInfinity%

No dependency changes