create-canvas-context - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

dist/create-canvas-context.js

@@ -1,2 +0,2 @@
-function n(){return(n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n}).apply(this,arguments)}function e(n){return"number"==typeof n}function t(n){return n instanceof Function}function r(n){return t(null==n?void 0:n.getContext)}var o={offscreen:!1};exports.createCanvasContext=function(f,u){var a;void 0===u&&(u=o);var i,c=n({},o,u),l=c.canvas,s=c.offscreen,v=c.width,h=c.height,d=function(n,e){if(null==n)return{};var t,r,o={},f=Object.keys(n);for(r=0;r<f.length;r++)e.indexOf(t=f[r])>=0||(o[t]=n[t]);return o}(c,["canvas","offscreen","width","height"]),O=Boolean(s&&"OffscreenCanvas"in self),g=null!=(a=r(i=l)?i:null)?a:function(n){return"undefined"!=typeof window?n?new OffscreenCanvas(300,150):document.createElement("canvas"):null}(O),p=O&&function(n){return t(null==n?void 0:n.transferControlToOffscreen)}(g)?null==g?void 0:g.transferControlToOffscreen():g;return r(p)&&(e(v)&&(p.width=v),e(h)&&(p.height=h)),[r(p)?p.getContext(f,d):null,p]};
+function n(){return n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},n.apply(this,arguments)}function e(n){return"number"==typeof n}var t=["canvas","offscreen","width","height"],r={offscreen:!1};exports.createCanvasContext=function(f,o){void 0===o&&(o=r);var a,i,u=n({},r,o),c=u.canvas,s=u.offscreen,l=u.width,v=u.height,h=function(n,e){if(null==n)return{};var t,r,f={},o=Object.keys(n);for(r=0;r<o.length;r++)e.indexOf(t=o[r])>=0||(f[t]=n[t]);return f}(u,t),d=function(n){return function(n){return n instanceof Function}(null==n?void 0:n.getContext)}(a=c)?a:null;if(s&&"undefined"!=typeof OffscreenCanvas)i=d&&function(n){return Boolean(n)&&"transferControlToOffscreen"in n}(d)?d.transferControlToOffscreen():new OffscreenCanvas(300,150);else{if("undefined"==typeof HTMLCanvasElement)return[null,d];i=null!=d?d:document.createElement("canvas")}return e(l)&&(i.width=l),e(v)&&(i.height=v),[i.getContext(f,h),i]};
 //# sourceMappingURL=create-canvas-context.js.map

dist/create-canvas-context.modern.js

@@ -1,2 +0,2 @@
-function n(){return(n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n}).apply(this,arguments)}function e(n){return"number"==typeof n}function t(n){return n instanceof Function}function r(n){return t(null==n?void 0:n.getContext)}const o={offscreen:!1};function f(f,u=o){var c;const i=n({},o,u),{canvas:l,offscreen:a,width:s,height:v}=i,h=function(n,e){if(null==n)return{};var t,r,o={},f=Object.keys(n);for(r=0;r<f.length;r++)e.indexOf(t=f[r])>=0||(o[t]=n[t]);return o}(i,["canvas","offscreen","width","height"]),d=Boolean(a&&"OffscreenCanvas"in self),O=null!=(c=r(g=l)?g:null)?c:function(n){return"undefined"!=typeof window?n?new OffscreenCanvas(300,150):document.createElement("canvas"):null}(d);var g;const p=d&&function(n){return t(null==n?void 0:n.transferControlToOffscreen)}(O)?null==O?void 0:O.transferControlToOffscreen():O;return r(p)&&(e(s)&&(p.width=s),e(v)&&(p.height=v)),[r(p)?p.getContext(f,h):null,p]}export{f as createCanvasContext};
+function n(){return n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},n.apply(this,arguments)}function e(n){return"number"==typeof n}const t=["canvas","offscreen","width","height"],r={offscreen:!1};function f(f,o=r){const c=n({},r,o),{canvas:u,offscreen:i,width:a,height:s}=c,l=function(n,e){if(null==n)return{};var t,r,f={},o=Object.keys(n);for(r=0;r<o.length;r++)e.indexOf(t=o[r])>=0||(f[t]=n[t]);return f}(c,t),h=function(n){return function(n){return n instanceof Function}(null==n?void 0:n.getContext)}(v=u)?v:null;var v;let d;if(i&&"undefined"!=typeof OffscreenCanvas)d=h&&function(n){return Boolean(n)&&"transferControlToOffscreen"in n}(h)?h.transferControlToOffscreen():new OffscreenCanvas(300,150);else{if("undefined"==typeof HTMLCanvasElement)return[null,h];d=null!=h?h:document.createElement("canvas")}return e(a)&&(d.width=a),e(s)&&(d.height=s),[d.getContext(f,l),d]}export{f as createCanvasContext};
 //# sourceMappingURL=create-canvas-context.modern.js.map

dist/create-canvas-context.module.js

@@ -1,2 +0,2 @@
-function n(){return(n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n}).apply(this,arguments)}function e(n){return"number"==typeof n}function t(n){return n instanceof Function}function r(n){return t(null==n?void 0:n.getContext)}var o={offscreen:!1};function f(f,u){var i;void 0===u&&(u=o);var c,a=n({},o,u),l=a.canvas,s=a.offscreen,v=a.width,h=a.height,d=function(n,e){if(null==n)return{};var t,r,o={},f=Object.keys(n);for(r=0;r<f.length;r++)e.indexOf(t=f[r])>=0||(o[t]=n[t]);return o}(a,["canvas","offscreen","width","height"]),O=Boolean(s&&"OffscreenCanvas"in self),g=null!=(i=r(c=l)?c:null)?i:function(n){return"undefined"!=typeof window?n?new OffscreenCanvas(300,150):document.createElement("canvas"):null}(O),p=O&&function(n){return t(null==n?void 0:n.transferControlToOffscreen)}(g)?null==g?void 0:g.transferControlToOffscreen():g;return r(p)&&(e(v)&&(p.width=v),e(h)&&(p.height=h)),[r(p)?p.getContext(f,d):null,p]}export{f as createCanvasContext};
+function n(){return n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},n.apply(this,arguments)}function e(n){return"number"==typeof n}var t=["canvas","offscreen","width","height"],r={offscreen:!1};function f(f,o){void 0===o&&(o=r);var i,u,a=n({},r,o),c=a.canvas,s=a.offscreen,l=a.width,v=a.height,h=function(n,e){if(null==n)return{};var t,r,f={},o=Object.keys(n);for(r=0;r<o.length;r++)e.indexOf(t=o[r])>=0||(f[t]=n[t]);return f}(a,t),d=function(n){return function(n){return n instanceof Function}(null==n?void 0:n.getContext)}(i=c)?i:null;if(s&&"undefined"!=typeof OffscreenCanvas)u=d&&function(n){return Boolean(n)&&"transferControlToOffscreen"in n}(d)?d.transferControlToOffscreen():new OffscreenCanvas(300,150);else{if("undefined"==typeof HTMLCanvasElement)return[null,d];u=null!=d?d:document.createElement("canvas")}return e(l)&&(u.width=l),e(v)&&(u.height=v),[u.getContext(f,h),u]}export{f as createCanvasContext};
 //# sourceMappingURL=create-canvas-context.module.js.map

dist/create-canvas-context.umd.js

@@ -1,2 +0,2 @@
-!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((n||self).createCanvasContext={})}(this,function(n){function e(){return(e=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o])}return n}).apply(this,arguments)}function t(n){return"number"==typeof n}function o(n){return n instanceof Function}function r(n){return o(null==n?void 0:n.getContext)}var f={offscreen:!1};n.createCanvasContext=function(n,i){var u;void 0===i&&(i=f);var a,c=e({},f,i),l=c.canvas,s=c.offscreen,d=c.width,v=c.height,h=function(n,e){if(null==n)return{};var t,o,r={},f=Object.keys(n);for(o=0;o<f.length;o++)e.indexOf(t=f[o])>=0||(r[t]=n[t]);return r}(c,["canvas","offscreen","width","height"]),p=Boolean(s&&"OffscreenCanvas"in self),g=null!=(u=r(a=l)?a:null)?u:function(n){return"undefined"!=typeof window?n?new OffscreenCanvas(300,150):document.createElement("canvas"):null}(p),y=p&&function(n){return o(null==n?void 0:n.transferControlToOffscreen)}(g)?null==g?void 0:g.transferControlToOffscreen():g;return r(y)&&(t(d)&&(y.width=d),t(v)&&(y.height=v)),[r(y)?y.getContext(n,h):null,y]}});
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((e||self).createCanvasContext={})}(this,function(e){function n(){return n=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},n.apply(this,arguments)}function t(e){return"number"==typeof e}var r=["canvas","offscreen","width","height"],o={offscreen:!1};e.createCanvasContext=function(e,f){void 0===f&&(f=o);var i,a,u=n({},o,f),c=u.canvas,s=u.offscreen,l=u.width,d=u.height,h=function(e,n){if(null==e)return{};var t,r,o={},f=Object.keys(e);for(r=0;r<f.length;r++)n.indexOf(t=f[r])>=0||(o[t]=e[t]);return o}(u,r),v=function(e){return function(e){return e instanceof Function}(null==e?void 0:e.getContext)}(i=c)?i:null;if(s&&"undefined"!=typeof OffscreenCanvas)a=v&&function(e){return Boolean(e)&&"transferControlToOffscreen"in e}(v)?v.transferControlToOffscreen():new OffscreenCanvas(300,150);else{if("undefined"==typeof HTMLCanvasElement)return[null,v];a=null!=v?v:document.createElement("canvas")}return t(l)&&(a.width=l),t(d)&&(a.height=d),[a.getContext(e,h),a]}});
 //# sourceMappingURL=create-canvas-context.umd.js.map

dist/guards.d.ts

@@ -6,2 +6,2 @@ /// <reference types="offscreencanvas" />
 export declare function isCanvas<T extends HTMLCanvasElement | OffscreenCanvas>(value: T | unknown): value is T;
-export declare function isHTMLCanvasElement(value: HTMLCanvasElement | OffscreenCanvas | unknown): value is HTMLCanvasElement;
+export declare function isTransferableCanvas(value: HTMLCanvasElement | OffscreenCanvas | unknown): value is HTMLCanvasElement;

package.json

 {
   "name": "create-canvas-context",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Create a canvas and get a rendering context from it.",
@@ -17,2 +17,5 @@ "author": "Marc Bouchenoire",
   ],
+  "engines": {
+    "node": "^14.13.1 || >=16.0.0"
+  },
   "sideEffects": false,
@@ -31,7 +34,15 @@ "source": "./src/index.ts",
   "types": "./dist/index.d.ts",
+  "prettier": "@bouchenoiremarc/prettier-config",
   "lint-staged": {
+    "**/*.mjs": [
+      "eslint --fix",
+      "yarn prettier"
+    ],
     "**/*.{ts,tsx}": [
       "eslint --fix",
-      "tsc-mixed --project tsconfig.json",
-      "prettier --write"
+      "tsatsiki --project tsconfig.json",
+      "yarn prettier"
+    ],
+    "**/*.{json,md,yml}": [
+      "yarn prettier"
     ]
@@ -46,28 +57,29 @@ },
     "build": "microbundle --tsconfig tsconfig.build.json",
-    "clean": "jest --clearCache && rimraf dist node_modules",
+    "prettier": "prettier --write --loglevel silent --ignore-path .eslintignore",
     "lint": "yarn lint:eslint && yarn lint:tsc && yarn lint:prettier",
-    "lint:eslint": "eslint '**/*.{ts,tsx}' --fix",
-    "lint:prettier": "prettier --write '**/*.{ts,tsx}' --loglevel silent",
+    "lint:eslint": "eslint '**/*.{mjs,ts,tsx}' --fix",
+    "lint:prettier": "yarn prettier '**/*.{mjs,ts,tsx,json,md,yml}'",
     "lint:tsc": "tsc --project tsconfig.json",
-    "prepare": "rimraf dist && yarn build",
+    "prepublishOnly": "yarn build",
     "release": "yarn login && np",
-    "test": "jest"
+    "test": "wtr",
+    "test:coverage": "yarn test --coverage"
   },
   "devDependencies": {
-    "@bouchenoiremarc/eslint-config": "^1.6.0",
-    "@swc-node/jest": "^1.3.1",
-    "@types/jest": "^27.0.1",
-    "@types/offscreencanvas": "^2019.6.3",
-    "eslint": "^7.30.0",
+    "@bouchenoiremarc/eslint-config": "^2.2.1",
+    "@bouchenoiremarc/prettier-config": "^1.1.0",
+    "@types/offscreencanvas": "^2019.6.4",
+    "@web/dev-server-esbuild": "^0.2.16",
+    "@web/test-runner": "^0.13.22",
+    "@web/test-runner-puppeteer": "^0.10.4",
+    "eslint": "^8.3.0",
     "husky": "4.3.8",
-    "jest": "^26.6.3",
-    "jest-electron": "^0.1.11",
-    "lint-staged": "^11.0.0",
-    "microbundle": "^0.13.0",
-    "np": "^7.4.0",
-    "prettier": "^2.2.1",
-    "rimraf": "^3.0.2",
-    "tsc-mixed": "^1.0.0",
-    "typescript": "^4.1.3"
+    "lint-staged": "^12.1.2",
+    "microbundle": "^0.14.2",
+    "np": "^7.6.0",
+    "prettier": "^2.4.1",
+    "tsatsiki": "^1.0.1",
+    "typescript": "^4.5.2",
+    "uvu": "^0.5.2"
   }
 }

README.md

@@ -11,6 +11,4 @@ # create-canvas-context
 
-```html
-<script type="module">
-  import { createCanvasContext } from "https://cdn.skypack.dev/create-canvas-context"
-</script>
+```javascript
+import { createCanvasContext } from "https://cdn.skypack.dev/create-canvas-context"
 ```
@@ -20,3 +18,3 @@
 
-```sh
+```bash
 yarn add create-canvas-context
@@ -27,3 +25,3 @@ ```
 
-```sh
+```bash
 npm install create-canvas-context
@@ -36,3 +34,3 @@ ```
 
-```tsx
+```typescript
 import { createCanvasContext } from "create-canvas-context"
@@ -43,3 +41,3 @@ ```
 
-```tsx
+```typescript
 const [context, canvas] = createCanvasContext("2d")
@@ -53,3 +51,3 @@
 
-```tsx
+```typescript
 const [context, canvas] = createCanvasContext("webgl", {
@@ -71,3 +69,3 @@ canvas: document.createElement("canvas"),
 
-```tsx
+```typescript
 canvas?: HTMLCanvasElement | OffscreenCanvas
@@ -80,3 +78,3 @@ ```
 
-```tsx
+```typescript
 offscreen?: boolean = false
@@ -91,3 +89,3 @@ ```
 
-```tsx
+```typescript
 width?: number
@@ -94,0 +92,0 @@ height?: number

src/guards.ts

@@ -19,6 +19,9 @@ import { PlainFunction, Unpack } from "./types"
 
-export function isHTMLCanvasElement(
+export function isTransferableCanvas(
   value: HTMLCanvasElement | OffscreenCanvas | unknown
 ): value is HTMLCanvasElement {
-  return isFunction((value as HTMLCanvasElement)?.transferControlToOffscreen)
+  return (
+    Boolean(value) &&
+    "transferControlToOffscreen" in (value as HTMLCanvasElement)
+  )
 }

src/index.ts

@@ -1,2 +0,2 @@
-import { isCanvas, isHTMLCanvasElement, isNumber } from "./guards"
+import { isCanvas, isNumber, isTransferableCanvas } from "./guards"
 import {
@@ -9,5 +9,7 @@ ContextAttributes,
 } from "./types"
-import { isBrowser } from "./utils/is-browser"
 import { returnIf } from "./utils/return-if"
-import { supportsOffscreenCanvas } from "./utils/supports-offscreen-canvas"
+import {
+  supportsCanvas,
+  supportsOffscreenCanvas
+} from "./utils/supports-canvas"
 
@@ -28,12 +30,2 @@ const DEFAULT_WIDTH = 300
 
-function createCanvas(offscreen: boolean) {
-  if (isBrowser()) {
-    return offscreen
-      ? new OffscreenCanvas(DEFAULT_WIDTH, DEFAULT_HEIGHT)
-      : document.createElement("canvas")
-  } else {
-    return null
-  }
-}
-
 export function createCanvasContext<T extends ContextType>(
@@ -88,26 +80,26 @@ type: T,
   }
-  const asOffscreenCanvas = Boolean(offscreen && supportsOffscreenCanvas())
 
-  const defaultCanvas =
-    returnIf(optionsCanvas, isCanvas) ?? createCanvas(asOffscreenCanvas)
-  const canvas =
-    asOffscreenCanvas && isHTMLCanvasElement(defaultCanvas)
-      ? defaultCanvas?.transferControlToOffscreen()
-      : defaultCanvas
+  const providedCanvas = returnIf(optionsCanvas, isCanvas)
+  let canvas: HTMLCanvasElement | OffscreenCanvas
 
-  if (isCanvas(canvas)) {
-    if (isNumber(width)) {
-      canvas.width = width
-    }
+  if (offscreen && supportsOffscreenCanvas()) {
+    canvas =
+      providedCanvas && isTransferableCanvas(providedCanvas)
+        ? providedCanvas.transferControlToOffscreen()
+        : new OffscreenCanvas(DEFAULT_WIDTH, DEFAULT_HEIGHT)
+  } else if (supportsCanvas()) {
+    canvas = providedCanvas ?? document.createElement("canvas")
+  } else {
+    return [null, providedCanvas]
+  }
 
-    if (isNumber(height)) {
-      canvas.height = height
-    }
+  if (isNumber(width)) {
+    canvas.width = width
   }
 
-  const context = isCanvas(canvas)
-    ? canvas.getContext(type as OffscreenContextType, attributes)
-    : null
+  if (isNumber(height)) {
+    canvas.height = height
+  }
 
-  return [context, canvas]
+  return [canvas.getContext(type as OffscreenContextType, attributes), canvas]
 }

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

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

Worsened metrics

Total package byte prevSize

40998

decreased by-2.09%

Lines of code

251

decreased by-1.95%

Number of lines in readme file

87

decreased by-2.25%

No dependency changes