@rindo/core 2.18.0 → 2.22.3

package/mock-doc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rindo/core/mock-doc",
-  "version": "2.18.0",
+  "version": "2.22.3",
   "description": "Mock window, document and DOM outside of a browser environment.",
   "main": "./index.cjs",
   "module": "./index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rindo/core",
-  "version": "2.18.0",
+  "version": "2.22.3",
   "license": "MIT",
   "main": "./internal/rindo-core/index.cjs",
   "module": "./internal/rindo-core/index.js",
@@ -24,17 +24,17 @@
     "testing/"
   ],
   "scripts": {
-    "build": "node scripts --prepare && npm run tsc.prod && npm run rollup.prod.ci",
+    "build": "npm run tsc.scripts && npm run tsc.prod && npm run rollup.prod.ci",
     "changelog": "conventional-changelog -p angular -o -i CHANGELOG.md -s",
-    "clean": "rimraf build cli compiler dev-server internal mock-doc sys testing && npm run clean-scripts",
-    "clean-scripts": "rimraf scripts/build",
-    "license": "node scripts --license",
-    "lint": "eslint \"src/*.ts\" \"src/**/*.ts\"",
+    "clean": "rm -rf build/ cli/ compiler/ dev-server/ internal/ mock-doc/ sys/ testing/ && npm run clean-scripts",
+    "clean-scripts": "rm -rf scripts/build",
+    "license": "node scripts/build --license",
+    "lint": "eslint \"bin/*\" \"scripts/*.ts\" \"scripts/**/*.ts\" \"src/*.ts\" \"src/**/*.ts\"",
     "prettier": "npm run prettier.base -- --write",
-    "prettier.base": "prettier \"./({bin,scripts,src}/**/*.{ts,tsx,js,jsx})|bin/rindo\"",
+    "prettier.base": "prettier --cache \"./({bin,scripts,src}/**/*.{ts,tsx,js,jsx})|bin/rindo|.github/(**/)?*.(yml|yaml)|*.js\"",
     "prettier.dry-run": "npm run prettier.base -- --list-different",
-    "release": "node scripts --release --publish",
-    "release.prepare": "node scripts --release --prepare",
+    "release": "npm run tsc.scripts && node scripts/build --any-branch --release --publish",
+    "release.prepare": "npm run tsc.scripts && node scripts/build --any-branch --release --prepare",
     "rollup": "rollup --config",
     "rollup.prod": "rollup --config --config-prod",
     "rollup.prod.ci": "rollup --config --config-prod --config-ci",
@@ -42,57 +42,49 @@
     "start": "npm run watch",
     "tsc": "tsc --incremental",
     "tsc.prod": "tsc",
-    "tsc.scripts": "tsc -p scripts/tsconfig.json",
-    "tsc.watch": "tsc --incremental --watch",
-    "watch": "node scripts && npm run tsc && concurrently \"npm run rollup.watch\" \"npm run tsc.watch\""
+    "tsc.scripts": "tsc --build --force scripts/tsconfig.json",
+    "tsc.watch": "tsc --incremental --watch"
   },
   "devDependencies": {
-    "@navify/prettier-config": "^2.0.0",
+    "@familyjs/prettier-config": "^2.0.0",
     "@rollup/plugin-commonjs": "15.1.0",
-    "@rollup/plugin-json": "4.1.0",
+    "@rollup/plugin-json": "6.0.0",
     "@rollup/plugin-node-resolve": "9.0.0",
     "@rollup/plugin-replace": "2.3.4",
-    "@rollup/pluginutils": "4.1.0",
-    "@types/autoprefixer": "^10.2.0",
-    "@types/eslint": "^8.4.2",
+    "@rollup/pluginutils": "5.0.2",
+    "@types/eslint": "^8.4.6",
     "@types/exit": "^0.1.31",
     "@types/fs-extra": "^9.0.8",
-    "@types/glob": "^7.1.2",
+    "@types/glob": "^8.0.0",
     "@types/graceful-fs": "^4.1.5",
     "@types/inquirer": "^7.3.1",
     "@types/jest": "^27.0.3",
-    "@types/listr": "^0.14.2",
-    "@types/mime-types": "^2.1.0",
-    "@types/node": "^14.14.35",
-    "@types/node-fetch": "^2.5.8",
-    "@types/parse5": "^6.0.0",
-    "@types/pixelmatch": "^4.0.0",
-    "@types/pngjs": "^3.4.2",
+    "@types/listr": "^0.14.4",
+    "@types/node": "^16.11.62",
+    "@types/pixelmatch": "^5.2.4",
+    "@types/pngjs": "^6.0.1",
     "@types/prompts": "^2.0.9",
-    "@types/semver": "^7.3.4",
+    "@types/semver": "^7.3.12",
     "@types/sizzle": "^2.3.2",
     "@types/webpack": "^4.41.26",
-    "@types/ws": "^7.4.0",
+    "@types/ws": "^8.5.4",
     "@types/yarnpkg__lockfile": "^1.1.5",
-    "@typescript-eslint/eslint-plugin": "^5.20.0",
-    "@typescript-eslint/parser": "^5.20.0",
+    "@typescript-eslint/eslint-plugin": "^5.38.0",
+    "@typescript-eslint/parser": "^5.38.0",
     "@yarnpkg/lockfile": "^1.1.0",
-    "ansi-colors": "4.1.1",
-    "autoprefixer": "10.2.5",
-    "concurrently": "^6.0.0",
-    "conventional-changelog-cli": "^2.1.1",
-    "core-js-builder": "~3.6.5",
-    "css": "^3.0.0",
-    "dts-bundle-generator": "~5.3.0",
-    "eslint": "^8.13.0",
+    "ansi-colors": "4.1.3",
+    "autoprefixer": "10.4.13",
+    "conventional-changelog-cli": "^2.2.2",
+    "dts-bundle-generator": "~7.1.0",
+    "eslint": "^8.23.1",
     "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-jest": "^26.5.3",
+    "eslint-plugin-jest": "^27.0.4",
     "eslint-plugin-jsdoc": "^39.3.1",
+    "eslint-plugin-simple-import-sort": "^9.0.0",
     "execa": "4.1.0",
     "exit": "^0.1.2",
-    "fast-deep-equal": "3.1.3",
-    "fs-extra": "^9.1.0",
-    "glob": "7.1.6",
+    "fs-extra": "^11.0.0",
+    "glob": "8.1.0",
     "graceful-fs": "~4.2.6",
     "hash.js": "^1.1.7",
     "inquirer": "^7.3.3",
@@ -100,29 +92,28 @@
     "jest-cli": "^27.4.5",
     "jest-environment-node": "^27.4.4",
     "listr": "^0.14.3",
-    "magic-string": "^0.25.7",
+    "magic-string": "^0.27.0",
     "merge-source-map": "^1.1.0",
     "mime-db": "^1.46.0",
-    "minimatch": "3.0.4",
+    "minimatch": "5.1.2",
     "node-fetch": "2.6.7",
-    "open": "8.2.1",
+    "open": "^8.4.0",
     "open-in-editor": "2.2.0",
-    "parse5": "6.0.1",
+    "parse5": "7.1.2",
     "path-browserify": "^1.0.1",
-    "pixelmatch": "4.0.2",
+    "pixelmatch": "5.3.0",
     "postcss": "^8.2.8",
-    "prettier": "2.5.1",
-    "prompts": "2.4.0",
+    "prettier": "2.8.3",
+    "prompts": "2.4.2",
     "puppeteer": "~10.0.0",
     "rollup": "2.42.3",
     "rollup-plugin-sourcemaps": "^0.6.3",
-    "rimraf": "^3.0.2",
-    "semver": "7.3.4",
+    "semver": "^7.3.7",
     "sizzle": "^2.3.6",
-    "terser": "5.6.1",
-    "typescript": "4.7.4",
+    "terser": "5.16.1",
+    "typescript": "4.9.4",
     "webpack": "^4.46.0",
-    "ws": "7.4.6"
+    "ws": "8.12.0"
   },
   "engines": {
     "node": ">=12.10.0",
@@ -130,22 +121,22 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/navify/rindo.git"
+    "url": "git+https://github.com/familyjs/rindo.git"
   },
-  "author": "Navify Team",
+  "author": "Family Team",
   "homepage": "https://rindojs.web.app/",
   "description": "A Compiler for Web Components and Progressive Web Apps",
   "keywords": [
     "web components",
     "components",
     "rindo",
-    "navify",
+    "familyjs",
     "webapp",
     "custom elements",
     "pwa",
     "progressive web app"
   ],
-  "prettier": "@navify/prettier-config",
+  "prettier": "@familyjs/prettier-config",
   "volta": {
     "node": "16.13.0",
     "npm": "8.1.1"

package/readme.md

@@ -9,49 +9,53 @@
 </h1>
 
 <p align="center">
-  A compiler for generating <a href="https://www.webcomponents.org/introduction">Web Components</a> 
+  A compiler for generating <a href="https://www.webcomponents.org/introduction" target="_blank" rel="noopener noref">Web Components</a>, built by the <a href="https://family-js.web.app/">Family team</a>.
+</p>
+<p align="center">
+  Rindo allows developers to use technologies like TypeScript and JSX to define components, then generate 100% standards-based Web Components that run on both <a href="https://rindojs.web.app/docs/browser-support" target="_blank" rel="noopener noref">modern browsers and legacy browsers</a>
 </p>
 
-[Rindo](https://rindojs.web.app/) is a simple compiler for generating Web Components and static site generated progressive web apps (PWA). Rindo was built by the [Navify](https://navify.web.app/) team for its next generation of performant mobile and desktop Web Components.
-
-Rindo combines the best concepts of the most popular frontend frameworks into a compile-time rather than run-time tool. It combines TypeScript, JSX, an asynchronous rendering pipeline to ensure smooth running animations and lazy-loading, to generate 100% standards-based Web Components that run on both [modern browsers and legacy browsers](https://rindojs.web.app/docs/browser-support).
-
-Rindo components are just Web Components, so they work in any major framework or with no framework at all. In many cases, Rindo can be used as a drop in replacement for traditional frontend frameworks given the capabilities now available in the browser, though using it as such is certainly not required.
-
-Rindo also enables a number of key capabilities on top of Web Components, in particular Server Side Rendering (SSR) without the need to run a headless browser, pre-rendering, and objects-as-properties (instead of just strings).
-
-## Getting Started
-
-To create a new project using an interactive cli, run:
-
-```bash
-npm init rindo
-```
-
-To start developing your new Rindo project, run:
-
-```bash
-npm start
-```
+<p align="center">
+  <a href="https://www.npmjs.com/package/@rindo/core">
+    <img src="https://img.shields.io/npm/v/@rindo/core.svg" alt="RindoJS is released under the MIT license." /></a>
+  <a href="https://github.com/familyjs/rindo/blob/main/LICENSE.md">
+    <img src="https://img.shields.io/badge/license-MIT-yellow.svg" alt="RindoJS is released under the MIT license." />
+  </a>
+  <a href="https://github.com/familyjs/rindo/blob/main/.github/CONTRIBUTING.md">
+    <img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs welcome!" />
+  </a>
+</p>
 
-## Creating components
+<h2 align="center">
+  <a href="https://rindojs.web.app/docs/getting-started#starting-a-new-project">Quick Start</a>
+  <span> · </span>
+  <a href="https://rindojs.web.app/docs/introduction">Documentation</a>
+  <span> · </span>
+  <a href="https://github.com/familyjs/rindo/blob/main/.github/CONTRIBUTING.md">Contribute</a>
+</h2>
 
-Rindo components are TypeScript classes with decorator metadata. The decorators themselves are purely build-time annotations so the compiler can read metadata about each component, and removed entirely for smaller efficient components.
+### Getting Started
 
-Create new components by creating files with a `.tsx` extension, such as `my-component.tsx`, and place them in `src/components`.
+Start a new project by following our quick [Getting Started guide](https://rindojs.web.app/docs/getting-started).
+We would love to hear from you!
+If you have any feedback or run into issues using Rindo, please file an [issue](https://github.com/familyjs/rindo/issues/new) on this repository.
 
+### Examples
+A Rindo component looks a lot like a class-based React component, with the addition of TypeScript decorators:
 ```tsx
 import { Component, Prop, h } from '@rindo/core';
 
 @Component({
-  tag: 'my-component',
-  styleUrl: 'my-component.css'
+  tag: 'my-component',            // the name of the component's custom HTML tag
+  styleUrl: 'my-component.css',   // css styles to apply to the component
+  shadow: true,                   // this component uses the ShadowDOM
 })
 export class MyComponent {
-
+  // The component accepts two arguments:
   @Prop() first: string;
   @Prop() last: string;
 
+   //The following HTML is rendered when our component is used
   render() {
     return (
       <div>
@@ -62,13 +66,22 @@ export class MyComponent {
 }
 ```
 
-To use this component, just use it like any other HTML element:
+The component above can be used like any other HTML element:
 
 ```html
 <my-component first="Rindo" last="JS"></my-component>
 ```
 
-## Thanks
+Since Rindo generates web components, they work in any major framework or with no framework at all.
+In many cases, Rindo can be used as a drop in replacement for traditional frontend framework, though using it as such is certainly not required.
+
+### Contributing
+
+Thanks for your interest in contributing!
+Please take a moment to read up on our guidelines for [contributing](https://github.com/familyjs/rindo/blob/main/.github/CONTRIBUTING.md).
+Please note that this project is released with a [Contributor Code of Conduct](https://github.com/familyjs/rindo/blob/main/CODE_OF_CONDUCT.md). By participating in this project you agree to abide by its terms.
+
+### Thanks
 Rindo's internal testing suite is supported by the [BrowserStack Open-Source Program](https://www.browserstack.com/open-source)
 <br>
-<a target="_blank" href="https://www.browserstack.com/"><img width="200" src="https://www.browserstack.com/images/layout/browserstack-logo-600x315.png"></a>
+<a href="https://www.browserstack.com/" target="_blank" rel="noopener noref"><img width="200" src="https://www.browserstack.com/images/layout/browserstack-logo-600x315.png"></a>

package/screenshot/compare/build/p-f4745c2f.entry.js

@@ -1 +1 @@
-import{r as t,d as s,h as i,g as e}from"./p-fbbae598.js";import{s as n}from"./p-081b0641.js";const h={threshold:.1,includeAA:!1,alpha:.1,aaColor:[255,255,0],diffColor:[255,0,0],diffColorAlt:null,diffMask:!1};function o(t){return ArrayBuffer.isView(t)&&1===t.constructor.BYTES_PER_ELEMENT}function r(t,s,i,e,n,h){const o=Math.max(s-1,0),r=Math.max(i-1,0),c=Math.min(s+1,e-1),d=Math.min(i+1,n-1),f=4*(i*e+s);let u,p,m,g,w=s===o||s===c||i===r||i===d?1:0,y=0,v=0;for(let n=o;n<=c;n++)for(let h=r;h<=d;h++){if(n===s&&h===i)continue;const o=l(t,t,f,4*(h*e+n),!0);if(0===o){if(w++,w>2)return!1}else o<y?(y=o,u=n,p=h):o>v&&(v=o,m=n,g=h)}return 0!==y&&0!==v&&(a(t,u,p,e,n)&&a(h,u,p,e,n)||a(t,m,g,e,n)&&a(h,m,g,e,n))}function a(t,s,i,e,n){const h=Math.max(s-1,0),o=Math.max(i-1,0),r=Math.min(s+1,e-1),a=Math.min(i+1,n-1),l=4*(i*e+s);let c=s===h||s===r||i===o||i===a?1:0;for(let n=h;n<=r;n++)for(let h=o;h<=a;h++){if(n===s&&h===i)continue;const o=4*(h*e+n);if(t[l]===t[o]&&t[l+1]===t[o+1]&&t[l+2]===t[o+2]&&t[l+3]===t[o+3]&&c++,c>2)return!0}return!1}function l(t,s,i,e,n){let h=t[i+0],o=t[i+1],r=t[i+2],a=t[i+3],l=s[e+0],p=s[e+1],m=s[e+2],g=s[e+3];if(a===g&&h===l&&o===p&&r===m)return 0;a<255&&(a/=255,h=u(h,a),o=u(o,a),r=u(r,a)),g<255&&(g/=255,l=u(l,g),p=u(p,g),m=u(m,g));const w=c(h,o,r),y=c(l,p,m),v=w-y;if(n)return v;const b=d(h,o,r)-d(l,p,m),x=f(h,o,r)-f(l,p,m),M=.5053*v*v+.299*b*b+.1957*x*x;return w>y?-M:M}function c(t,s,i){return.29889531*t+.58662247*s+.11448223*i}function d(t,s,i){return.59597799*t-.2741761*s-.32180189*i}function f(t,s,i){return.21147017*t-.52261711*s+.31114694*i}function u(t,s){return 255+(t-255)*s}function p(t,s,i,e,n){t[s+0]=i,t[s+1]=e,t[s+2]=n,t[s+3]=255}function m(t,s,i,e){const n=u(c(t[s+0],t[s+1],t[s+2]),i*t[s+3]/255);p(e,s,n,n,n)}function g(t,s,i){if(y.has(s))return void i(y.get(s));if(w.has(s))return void w.get(s).push(i);w.set(s,[i]);const e=document.createElement("script");e.src=`${t}screenshot_${s}.js`,document.head.appendChild(e)}window.loadScreenshot=(t,s)=>{const i=w.get(t);i&&(i.forEach(t=>t(s)),w.delete(t)),y.set(t,s)};const w=new Map,y=new Map;class v{constructor(i){t(this,i),this.imageASrc=null,this.imageBSrc=null,this.imageAClass="is-loading",this.imageBClass="is-loading",this.canvasClass="is-loading",this.imagesLoaded=new Set,this.isImageALoaded=!1,this.isImageBLoaded=!1,this.isMismatchInitialized=!1,this.hasCalculatedMismatch=!1,this.compareLoaded=s(this,"compareLoaded",7)}componentWillLoad(){this.loadScreenshots()}componentWillUpdate(){this.loadScreenshots()}loadScreenshots(){if(this.show&&this.diff.hasIntersected)return this.diff.identical?(this.imageASrc=this.imagesUrl+this.diff.imageA,this.isImageALoaded=!0,this.imageAClass="has-loaded",this.imageBSrc=this.imagesUrl+this.diff.imageB,this.isImageBLoaded=!0,void(this.imageBClass="has-loaded")):void(this.isMismatchInitialized||(this.isMismatchInitialized=!0,null!=this.jsonpUrl?(null!=this.diff.imageA&&g(this.jsonpUrl,this.diff.imageA,t=>{this.imageASrc=t}),null!=this.diff.imageB&&g(this.jsonpUrl,this.diff.imageB,t=>{this.imageBSrc=t})):(this.imageASrc=this.imagesUrl+this.diff.imageA,this.imageBSrc=this.imagesUrl+this.diff.imageB)))}async compareImages(){const t=this.diff;this.isImageALoaded&&this.isImageBLoaded&&!this.hasCalculatedMismatch&&t.comparable&&(this.hasCalculatedMismatch=!0,t.mismatchedPixels=await function(t,s,i,e,n,a){let c=-1;try{const d=document.createElement("canvas");d.width=e,d.height=n;const f=document.createElement("canvas");f.width=e,f.height=n;const u=d.getContext("2d");u.drawImage(t,0,0);const g=f.getContext("2d");g.drawImage(s,0,0);const w=document.createElement("canvas").getContext("2d");w.drawImage(t,0,0),w.getImageData(0,0,e,n);const y=u.getImageData(0,0,e,n).data,v=g.getImageData(0,0,e,n).data,b=i.getContext("2d"),x=b.createImageData(e,d.height);c=function(t,s,i,e,n,a){if(!o(t)||!o(s)||i&&!o(i))throw new Error("Image data: Uint8Array, Uint8ClampedArray or Buffer expected.");if(t.length!==s.length||i&&i.length!==t.length)throw new Error("Image sizes do not match.");if(t.length!==e*n*4)throw new Error("Image data size does not match width/height.");a=Object.assign({},h,a);const c=e*n,d=new Uint32Array(t.buffer,t.byteOffset,c),f=new Uint32Array(s.buffer,s.byteOffset,c);let u=!0;for(let t=0;t<c;t++)if(d[t]!==f[t]){u=!1;break}if(u){if(i&&!a.diffMask)for(let s=0;s<c;s++)m(t,4*s,a.alpha,i);return 0}const g=35215*a.threshold*a.threshold;let w=0;for(let h=0;h<n;h++)for(let o=0;o<e;o++){const c=4*(h*e+o),d=l(t,s,c,c);Math.abs(d)>g?a.includeAA||!r(t,o,h,e,n,s)&&!r(s,o,h,e,n,t)?(i&&p(i,c,...d<0&&a.diffColorAlt||a.diffColor),w++):i&&!a.diffMask&&p(i,c,...a.aaColor):i&&(a.diffMask||m(t,c,a.alpha,i))}return w}(y,v,x.data,e,n,{threshold:a}),b.putImageData(x,0,0)}catch(t){console.error(t)}return c}(this.imageA,this.imageB,this.canvas,Math.round(t.width*t.deviceScaleFactor),Math.round(t.height*t.deviceScaleFactor),t.threshold),this.canvasClass="has-loaded",n(t.imageA,t.imageB,t.mismatchedPixels,t.threshold),this.compareLoaded.emit(t))}render(){const t=this.diff,s={width:t.width+"px",height:t.height+"px"};return[i("compare-cell",null,null!=t.imageA?i("a",{href:this.imagesUrl+t.imageA,target:"_blank"},i("img",{src:this.imageASrc,class:this.imageAClass,style:s,onLoad:this.diff.identical?null:()=>{this.isImageALoaded=!0,this.imageAClass="has-loaded",this.compareImages()},ref:t=>this.imageA=t})):i("img",{style:s,class:"is-loading"})),i("compare-cell",null,null!=t.imageB?i("a",{href:this.imagesUrl+t.imageB,target:"_blank"},i("img",{src:this.imageBSrc,class:this.imageBClass,style:s,onLoad:this.diff.identical?null:()=>{this.isImageBLoaded=!0,this.imageBClass="has-loaded",this.compareImages()},ref:t=>this.imageB=t})):i("img",{style:s,class:"is-loading"})),i("compare-cell",null,this.diff.identical?i("img",{style:s,src:this.imageASrc}):i("canvas",{width:Math.round(t.width*t.deviceScaleFactor),height:Math.round(t.height*t.deviceScaleFactor),class:this.canvasClass,style:s,hidden:!t.comparable,ref:t=>this.canvas=t})),i("compare-cell",null,i("compare-analysis",{aId:this.aId,bId:this.bId,mismatchedPixels:this.diff.mismatchedPixels,diff:this.diff}))]}get elm(){return e(this)}}v.style="compare-row img,compare-row canvas{display:block;box-shadow:var(--screenshot-box-shadow);border-radius:var(--screenshot-border-radius)}compare-row a{display:block}.is-loading{visibility:hidden}";class b{constructor(s){t(this,s)}render(){if(!this.a||!this.b||!this.diffs)return;let t=0;this.diffs.forEach(s=>{s.width>t&&(t=s.width)}),t-=6;const s={width:t+"px"};return[i("th-cell",null,i("div",{style:s},i("a",{href:this.a.url,target:"_blank"},this.a.message))),i("th-cell",null,i("div",{style:s},i("a",{href:this.b.url,target:"_blank"},this.b.message))),i("th-cell",null,i("div",{style:s},i("a",{href:`https://github.com/navify/navify/compare/${this.a.id}...${this.b.id}`,target:"_blank"},"Compare: ",this.a.id," - ",this.b.id))),i("th-cell",{class:"analysis"},i("div",null,"Analysis"))]}}b.style=":host{display:flex}th-cell{display:block;flex:1;font-weight:500;font-size:12px}th-cell div{padding-left:12px;padding-right:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}th-cell a{color:var(--font-color);text-decoration:none}th-cell a:hover{color:var(--analysis-data-color);text-decoration:underline}.analysis div{width:262px}";export{v as compare_row,b as compare_thead}
+import{r as t,d as s,h as i,g as e}from"./p-fbbae598.js";import{s as n}from"./p-081b0641.js";const h={threshold:.1,includeAA:!1,alpha:.1,aaColor:[255,255,0],diffColor:[255,0,0],diffColorAlt:null,diffMask:!1};function o(t){return ArrayBuffer.isView(t)&&1===t.constructor.BYTES_PER_ELEMENT}function r(t,s,i,e,n,h){const o=Math.max(s-1,0),r=Math.max(i-1,0),c=Math.min(s+1,e-1),d=Math.min(i+1,n-1),f=4*(i*e+s);let u,p,m,g,w=s===o||s===c||i===r||i===d?1:0,y=0,v=0;for(let n=o;n<=c;n++)for(let h=r;h<=d;h++){if(n===s&&h===i)continue;const o=l(t,t,f,4*(h*e+n),!0);if(0===o){if(w++,w>2)return!1}else o<y?(y=o,u=n,p=h):o>v&&(v=o,m=n,g=h)}return 0!==y&&0!==v&&(a(t,u,p,e,n)&&a(h,u,p,e,n)||a(t,m,g,e,n)&&a(h,m,g,e,n))}function a(t,s,i,e,n){const h=Math.max(s-1,0),o=Math.max(i-1,0),r=Math.min(s+1,e-1),a=Math.min(i+1,n-1),l=4*(i*e+s);let c=s===h||s===r||i===o||i===a?1:0;for(let n=h;n<=r;n++)for(let h=o;h<=a;h++){if(n===s&&h===i)continue;const o=4*(h*e+n);if(t[l]===t[o]&&t[l+1]===t[o+1]&&t[l+2]===t[o+2]&&t[l+3]===t[o+3]&&c++,c>2)return!0}return!1}function l(t,s,i,e,n){let h=t[i+0],o=t[i+1],r=t[i+2],a=t[i+3],l=s[e+0],p=s[e+1],m=s[e+2],g=s[e+3];if(a===g&&h===l&&o===p&&r===m)return 0;a<255&&(a/=255,h=u(h,a),o=u(o,a),r=u(r,a)),g<255&&(g/=255,l=u(l,g),p=u(p,g),m=u(m,g));const w=c(h,o,r),y=c(l,p,m),v=w-y;if(n)return v;const b=d(h,o,r)-d(l,p,m),x=f(h,o,r)-f(l,p,m),M=.5053*v*v+.299*b*b+.1957*x*x;return w>y?-M:M}function c(t,s,i){return.29889531*t+.58662247*s+.11448223*i}function d(t,s,i){return.59597799*t-.2741761*s-.32180189*i}function f(t,s,i){return.21147017*t-.52261711*s+.31114694*i}function u(t,s){return 255+(t-255)*s}function p(t,s,i,e,n){t[s+0]=i,t[s+1]=e,t[s+2]=n,t[s+3]=255}function m(t,s,i,e){const n=u(c(t[s+0],t[s+1],t[s+2]),i*t[s+3]/255);p(e,s,n,n,n)}function g(t,s,i){if(y.has(s))return void i(y.get(s));if(w.has(s))return void w.get(s).push(i);w.set(s,[i]);const e=document.createElement("script");e.src=`${t}screenshot_${s}.js`,document.head.appendChild(e)}window.loadScreenshot=(t,s)=>{const i=w.get(t);i&&(i.forEach(t=>t(s)),w.delete(t)),y.set(t,s)};const w=new Map,y=new Map;class v{constructor(i){t(this,i),this.imageASrc=null,this.imageBSrc=null,this.imageAClass="is-loading",this.imageBClass="is-loading",this.canvasClass="is-loading",this.imagesLoaded=new Set,this.isImageALoaded=!1,this.isImageBLoaded=!1,this.isMismatchInitialized=!1,this.hasCalculatedMismatch=!1,this.compareLoaded=s(this,"compareLoaded",7)}componentWillLoad(){this.loadScreenshots()}componentWillUpdate(){this.loadScreenshots()}loadScreenshots(){if(this.show&&this.diff.hasIntersected)return this.diff.identical?(this.imageASrc=this.imagesUrl+this.diff.imageA,this.isImageALoaded=!0,this.imageAClass="has-loaded",this.imageBSrc=this.imagesUrl+this.diff.imageB,this.isImageBLoaded=!0,void(this.imageBClass="has-loaded")):void(this.isMismatchInitialized||(this.isMismatchInitialized=!0,null!=this.jsonpUrl?(null!=this.diff.imageA&&g(this.jsonpUrl,this.diff.imageA,t=>{this.imageASrc=t}),null!=this.diff.imageB&&g(this.jsonpUrl,this.diff.imageB,t=>{this.imageBSrc=t})):(this.imageASrc=this.imagesUrl+this.diff.imageA,this.imageBSrc=this.imagesUrl+this.diff.imageB)))}async compareImages(){const t=this.diff;this.isImageALoaded&&this.isImageBLoaded&&!this.hasCalculatedMismatch&&t.comparable&&(this.hasCalculatedMismatch=!0,t.mismatchedPixels=await function(t,s,i,e,n,a){let c=-1;try{const d=document.createElement("canvas");d.width=e,d.height=n;const f=document.createElement("canvas");f.width=e,f.height=n;const u=d.getContext("2d");u.drawImage(t,0,0);const g=f.getContext("2d");g.drawImage(s,0,0);const w=document.createElement("canvas").getContext("2d");w.drawImage(t,0,0),w.getImageData(0,0,e,n);const y=u.getImageData(0,0,e,n).data,v=g.getImageData(0,0,e,n).data,b=i.getContext("2d"),x=b.createImageData(e,d.height);c=function(t,s,i,e,n,a){if(!o(t)||!o(s)||i&&!o(i))throw new Error("Image data: Uint8Array, Uint8ClampedArray or Buffer expected.");if(t.length!==s.length||i&&i.length!==t.length)throw new Error("Image sizes do not match.");if(t.length!==e*n*4)throw new Error("Image data size does not match width/height.");a=Object.assign({},h,a);const c=e*n,d=new Uint32Array(t.buffer,t.byteOffset,c),f=new Uint32Array(s.buffer,s.byteOffset,c);let u=!0;for(let t=0;t<c;t++)if(d[t]!==f[t]){u=!1;break}if(u){if(i&&!a.diffMask)for(let s=0;s<c;s++)m(t,4*s,a.alpha,i);return 0}const g=35215*a.threshold*a.threshold;let w=0;for(let h=0;h<n;h++)for(let o=0;o<e;o++){const c=4*(h*e+o),d=l(t,s,c,c);Math.abs(d)>g?a.includeAA||!r(t,o,h,e,n,s)&&!r(s,o,h,e,n,t)?(i&&p(i,c,...d<0&&a.diffColorAlt||a.diffColor),w++):i&&!a.diffMask&&p(i,c,...a.aaColor):i&&(a.diffMask||m(t,c,a.alpha,i))}return w}(y,v,x.data,e,n,{threshold:a}),b.putImageData(x,0,0)}catch(t){console.error(t)}return c}(this.imageA,this.imageB,this.canvas,Math.round(t.width*t.deviceScaleFactor),Math.round(t.height*t.deviceScaleFactor),t.threshold),this.canvasClass="has-loaded",n(t.imageA,t.imageB,t.mismatchedPixels,t.threshold),this.compareLoaded.emit(t))}render(){const t=this.diff,s={width:t.width+"px",height:t.height+"px"};return[i("compare-cell",null,null!=t.imageA?i("a",{href:this.imagesUrl+t.imageA,target:"_blank"},i("img",{src:this.imageASrc,class:this.imageAClass,style:s,onLoad:this.diff.identical?null:()=>{this.isImageALoaded=!0,this.imageAClass="has-loaded",this.compareImages()},ref:t=>this.imageA=t})):i("img",{style:s,class:"is-loading"})),i("compare-cell",null,null!=t.imageB?i("a",{href:this.imagesUrl+t.imageB,target:"_blank"},i("img",{src:this.imageBSrc,class:this.imageBClass,style:s,onLoad:this.diff.identical?null:()=>{this.isImageBLoaded=!0,this.imageBClass="has-loaded",this.compareImages()},ref:t=>this.imageB=t})):i("img",{style:s,class:"is-loading"})),i("compare-cell",null,this.diff.identical?i("img",{style:s,src:this.imageASrc}):i("canvas",{width:Math.round(t.width*t.deviceScaleFactor),height:Math.round(t.height*t.deviceScaleFactor),class:this.canvasClass,style:s,hidden:!t.comparable,ref:t=>this.canvas=t})),i("compare-cell",null,i("compare-analysis",{aId:this.aId,bId:this.bId,mismatchedPixels:this.diff.mismatchedPixels,diff:this.diff}))]}get elm(){return e(this)}}v.style="compare-row img,compare-row canvas{display:block;box-shadow:var(--screenshot-box-shadow);border-radius:var(--screenshot-border-radius)}compare-row a{display:block}.is-loading{visibility:hidden}";class b{constructor(s){t(this,s)}render(){if(!this.a||!this.b||!this.diffs)return;let t=0;this.diffs.forEach(s=>{s.width>t&&(t=s.width)}),t-=6;const s={width:t+"px"};return[i("th-cell",null,i("div",{style:s},i("a",{href:this.a.url,target:"_blank"},this.a.message))),i("th-cell",null,i("div",{style:s},i("a",{href:this.b.url,target:"_blank"},this.b.message))),i("th-cell",null,i("div",{style:s},i("a",{href:`https://github.com/familyjs/family/compare/${this.a.id}...${this.b.id}`,target:"_blank"},"Compare: ",this.a.id," - ",this.b.id))),i("th-cell",{class:"analysis"},i("div",null,"Analysis"))]}}b.style=":host{display:flex}th-cell{display:block;flex:1;font-weight:500;font-size:12px}th-cell div{padding-left:12px;padding-right:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}th-cell a{color:var(--font-color);text-decoration:none}th-cell a:hover{color:var(--analysis-data-color);text-decoration:underline}.analysis div{width:262px}";export{v as compare_row,b as compare_thead}

package/screenshot/index.d.ts

@@ -1,3 +1,3 @@
 export { ScreenshotConnector } from './connector-base';
 export { ScreenshotLocalConnector } from './connector-local';
-export { ScreenshotBuild, Screenshot, ScreenshotCompareResults, ScreenshotDiff } from '@rindo/core/internal';
+export { Screenshot, ScreenshotBuild, ScreenshotCompareResults, ScreenshotDiff } from '@rindo/core/internal';

package/screenshot/index.js

@@ -1,13 +1,13 @@
 'use strict';
 
-const fs = require('fs');
-const path = require('path');
 const os = require('os');
+const path = require('path');
+const fs = require('fs');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-const fs__default = /*#__PURE__*/_interopDefaultLegacy(fs);
 const path__default = /*#__PURE__*/_interopDefaultLegacy(path);
+const fs__default = /*#__PURE__*/_interopDefaultLegacy(fs);
 
 function fileExists(filePath) {
     return new Promise((resolve) => {

package/screenshot/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rindo/core/screenshot",
-  "version": "2.18.0",
+  "version": "2.22.3",
   "description": "Rindo Screenshot.",
   "main": "./index.js",
   "types": "./index.d.ts",