amethyst
/
pptk
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

✨ Supporting building as library with vite

Browse Source
main
Shad Amethyst 2 years ago
parent 827127df5a
commit ca2521e57d
9 changed files with 231 additions and 24 deletions
Show Stats Download Patch File Download Diff File

1
.gitignore vendored
Unescape View File

@ -1,2 +1,3 @@
**/*.d.ts
node_modules/
dist/

141
package-lock.json generated
Unescape View File

@ -9,7 +9,9 @@
"version": "0.1.0",
"license": "MIT",
"devDependencies": {
"@rollup/plugin-typescript": "^11.0.0",
"solid-js": "^1.6.2",
"tslib": "^2.4.1",
"typescript": "^4.9.0",
"vite": "^3.0.9",
"vite-plugin-solid": "^2.3.0"
@ -573,6 +575,68 @@
"@jridgewell/sourcemap-codec": "1.4.14"
}
},
"node_modules/@rollup/plugin-typescript": {
"version": "11.0.0",
"resolved": "https://registry.npmjs.org/@rollup/plugin-typescript/-/plugin-typescript-11.0.0.tgz",
"integrity": "sha512-goPyCWBiimk1iJgSTgsehFD5OOFHiAknrRJjqFCudcW8JtWiBlK284Xnn4flqMqg6YAjVG/EE+3aVzrL5qNSzQ==",
"dev": true,
"dependencies": {
"@rollup/pluginutils": "^5.0.1",
"resolve": "^1.22.1"
},
"engines": {
"node": ">=14.0.0"
},
"peerDependencies": {
"rollup": "^2.14.0||^3.0.0",
"tslib": "*",
"typescript": ">=3.7.0"
},
"peerDependenciesMeta": {
"rollup": {
"optional": true
},
"tslib": {
"optional": true
}
}
},
"node_modules/@rollup/pluginutils": {
"version": "5.0.2",
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.0.2.tgz",
"integrity": "sha512-pTd9rIsP92h+B6wWwFbW8RkZv4hiR/xKsqre4SIuAOaOEQRxi0lqLke9k2/7WegC85GgUs9pjmOjCUi3In4vwA==",
"dev": true,
"dependencies": {
"@types/estree": "^1.0.0",
"estree-walker": "^2.0.2",
"picomatch": "^2.3.1"
},
"engines": {
"node": ">=14.0.0"
},
"peerDependencies": {
"rollup": "^1.20.0||^2.0.0||^3.0.0"
},
"peerDependenciesMeta": {
"rollup": {
"optional": true
}
}
},
"node_modules/@types/estree": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.0.tgz",
"integrity": "sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==",
"dev": true
},
"node_modules/@types/node": {
"version": "18.11.18",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.18.tgz",
"integrity": "sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==",
"dev": true,
"optional": true,
"peer": true
},
"node_modules/ansi-styles": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@ -1096,6 +1160,12 @@
"node": ">=0.8.0"
}
},
"node_modules/estree-walker": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
"dev": true
},
"node_modules/fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
@ -1275,6 +1345,18 @@
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
"dev": true
},
"node_modules/picomatch": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
"dev": true,
"engines": {
"node": ">=8.6"
},
"funding": {
"url": "https://github.com/sponsors/jonschlinkert"
}
},
"node_modules/postcss": {
"version": "8.4.21",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
@ -1405,6 +1487,12 @@
"node": ">=4"
}
},
"node_modules/tslib": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.1.tgz",
"integrity": "sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==",
"dev": true
},
"node_modules/typescript": {
"version": "4.9.4",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.4.tgz",
@ -1942,6 +2030,41 @@
"@jridgewell/sourcemap-codec": "1.4.14"
}
},
"@rollup/plugin-typescript": {
"version": "11.0.0",
"resolved": "https://registry.npmjs.org/@rollup/plugin-typescript/-/plugin-typescript-11.0.0.tgz",
"integrity": "sha512-goPyCWBiimk1iJgSTgsehFD5OOFHiAknrRJjqFCudcW8JtWiBlK284Xnn4flqMqg6YAjVG/EE+3aVzrL5qNSzQ==",
"dev": true,
"requires": {
"@rollup/pluginutils": "^5.0.1",
"resolve": "^1.22.1"
}
},
"@rollup/pluginutils": {
"version": "5.0.2",
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.0.2.tgz",
"integrity": "sha512-pTd9rIsP92h+B6wWwFbW8RkZv4hiR/xKsqre4SIuAOaOEQRxi0lqLke9k2/7WegC85GgUs9pjmOjCUi3In4vwA==",
"dev": true,
"requires": {
"@types/estree": "^1.0.0",
"estree-walker": "^2.0.2",
"picomatch": "^2.3.1"
}
},
"@types/estree": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.0.tgz",
"integrity": "sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==",
"dev": true
},
"@types/node": {
"version": "18.11.18",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.18.tgz",
"integrity": "sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==",
"dev": true,
"optional": true,
"peer": true
},
"ansi-styles": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@ -2226,6 +2349,12 @@
"integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
"dev": true
},
"estree-walker": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
"dev": true
},
"fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
@ -2353,6 +2482,12 @@
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
"dev": true
},
"picomatch": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
"dev": true
},
"postcss": {
"version": "8.4.21",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
@ -2437,6 +2572,12 @@
"integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==",
"dev": true
},
"tslib": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.1.tgz",
"integrity": "sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==",
"dev": true
},
"typescript": {
"version": "4.9.4",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.4.tgz",

56
package.json
Unescape View File

@ -2,34 +2,60 @@
"name": "pptk",
"version": "0.1.0",
"description": "Pixel-Perfect ToolKit, a library to help make pixel-perfect applications on high-DPI devices",
"main": "src/index.js",
"keywords": [
"pixel-perfect",
"canvas",
"dpi",
"high-dpi"
],
"author": "Shad Amethyst",
"license": "MIT",
"type": "module",
"types": "types/index.d.ts",
"files": [
"dist"
],
"main": "./dist/index.cjs",
"module": "./dist/index.js",
"types": "dist/types/index.d.ts",
"exports": {
".": {
"import": {
"types": "./dist/types/index.d.ts",
"default": "./dist/index.js"
},
"require": {
"types": "./dist/types/index.d.ts",
"default": "./dist/index.cjs"
}
},
"./solid": {
"import": {
"types": "./dist/types/solid/index.d.ts",
"default": "./dist/solid.js"
},
"require": {
"types": "./dist/types/solid/index.d.ts",
"default": "./dist/solid.cjs"
}
}
},
"scripts": {
"prepare-dev": "tsc src/index.js --declaration --allowJs --emitDeclarationOnly",
"dev:solid": "vite dev test/solid",
"dev:vanilla": "vite dev test/vanilla",
"build": "vite build",
"serve": "vite preview",
"test": "echo \"Error: no test specified\" && exit 1"
"build": "npm run prepare-dev && vite build && tsc && cp src/index.d.ts dist/types/index.d.ts",
"clean": "rm -rf dist/ src/index.d.ts"
},
"repository": {
"type": "git",
"url": "https://git.shadamethyst.xyz/adri326/pptk"
},
"keywords": [
"pixel-perfect",
"canvas",
"dpi",
"high-dpi"
],
"author": "Shad Amethyst",
"license": "MIT",
"devDependencies": {
"solid-js": "^1.6.2",
"tslib": "^2.4.1",
"typescript": "^4.9.0",
"vite": "^3.0.9",
"vite-plugin-solid": "^2.3.0",
"solid-js": "^1.6.2"
"vite-plugin-solid": "^2.3.0"
},
"peerDependencies": {
"solid-js": "^1.6.2"

2
src/index.js
Unescape View File

@ -149,7 +149,7 @@ export function listenPixelRatio(element, callback, fire_first = false) {
}
/**
* @param {HTMLCanvas} canvas
* @param {HTMLCanvasElement} canvas
* @return {PixelPerfectContext2D}
**/
export function getContext2D(canvas) {

9
src/solid/PixelPerfectCanvas.tsx
Unescape View File

@ -1,4 +1,4 @@
import { JSX, Component, createEffect, onMount } from "solid-js";
import { JSX, Component, createEffect } from "solid-js";
import { attachCanvas } from '../index';
import styles from './PixelPerfectCanvas.module.css';
@ -7,9 +7,12 @@ export type PixelPerfectCanvasProps = {
class?: string,
children?: JSX.Element,
onResize?: (canvas: HTMLCanvasElement, width: number, height: number) => void,
onMount?: (canvas: HTMLCanvasElement) => void,
onAttach?: (canvas: HTMLCanvasElement) => void,
}
/**
*
**/
export const PixelPerfectCanvas: Component<PixelPerfectCanvasProps> = (props) => {
let canvasRef: HTMLCanvasElement;
let containerRef: HTMLDivElement;
@ -24,7 +27,7 @@ export const PixelPerfectCanvas: Component<PixelPerfectCanvasProps> = (props) =>
onResize: props.onResize,
});
props.onMount?.(result);
props.onAttach?.(result);
return result;
});

4
test/solid/App.tsx
Unescape View File

@ -1,5 +1,5 @@
import { Component, createEffect, createSignal } from "solid-js";
import { getContext2D, StrokeMode } from "../../src";
import { getContext2D } from "../../src";
import { PixelPerfectCanvas } from "../../src/solid";
const App: Component = () => {
@ -37,7 +37,7 @@ const App: Component = () => {
"margin-left": "1px",
}}
onResize={update}
onMount={setCanvasRef}
onAttach={setCanvasRef}
/>
<input
type="checkbox"

16
test/solid/tsconfig.json
Unescape View File

@ -0,0 +1,16 @@
{
"compilerOptions": {
"target": "ESNext",
"module": "ESNext",
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"esModuleInterop": true,
"jsx": "preserve",
"jsxImportSource": "solid-js",
"types": ["vite/client"],
"strict": true,
"isolatedModules": true,
"noEmit": true,
"rootDir": "../../"
}
}

13
tsconfig.json
Unescape View File

@ -9,7 +9,14 @@
"jsxImportSource": "solid-js",
"types": ["vite/client"],
"strict": true,
"noEmit": true,
"isolatedModules": true
}
"declaration": true,
"declarationDir": "./dist/types",
"isolatedModules": true,
"emitDeclarationOnly": true,
"rootDir": "src/"
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
]
}

13
vite.config.ts
Unescape View File

@ -1,5 +1,6 @@
import { defineConfig } from "vite";
import solidPlugin from "vite-plugin-solid";
import path from "node:path";
export default defineConfig({
clearScreen: false,
@ -11,5 +12,17 @@ export default defineConfig({
},
build: {
target: "esnext",
manifest: true,
lib: {
name: "pptk",
entry: {
index: path.resolve(__dirname, "src/index.js"),
solid: path.resolve(__dirname, "src/solid/index.tsx")
}
},
rollupOptions: {
external: ["solid-js"],
plugins: []
}
},
});

Write Preview
Loading…
Cancel
Save