add base for charts

This commit is contained in:
Torsten Dittmann
2022-03-25 12:21:28 +03:00
parent c0aeed02a1
commit ade7e21c8a
5 changed files with 121 additions and 83 deletions
+80 -75
View File
@@ -8,15 +8,16 @@
"name": "@appwrite/console",
"version": "0.0.1",
"dependencies": {
"aw-labs-ui": "^0.0.8"
"aw-labs-ui": "^0.0.8",
"chart.js": "^3.7.1"
},
"devDependencies": {
"@playwright/test": "^1.20.0",
"@playwright/test": "^1.20.1",
"@sveltejs/adapter-auto": "1.0.0-next.33",
"@sveltejs/kit": "1.0.0-next.302",
"@sveltejs/kit": "1.0.0-next.303",
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.40",
"@testing-library/dom": "^8.11.3",
"@testing-library/jest-dom": "^5.16.2",
"@testing-library/dom": "^8.11.4",
"@testing-library/jest-dom": "^5.16.3",
"@testing-library/svelte": "^3.1.0",
"@testing-library/user-event": "^13.5.0",
"@typescript-eslint/eslint-plugin": "^5.16.0",
@@ -26,16 +27,16 @@
"eslint-plugin-svelte3": "^3.4.1",
"jest": "^27.5.1",
"pre-commit": "^1.2.2",
"prettier": "^2.6.0",
"prettier": "^2.6.1",
"prettier-plugin-svelte": "^2.6.0",
"sass": "^1.49.9",
"svelte": "^3.46.4",
"svelte-check": "^2.4.6",
"svelte-jester": "^2.3.2",
"svelte-preprocess": "^4.10.4",
"ts-jest": "^27.1.3",
"ts-jest": "^27.1.4",
"tslib": "^2.3.1",
"typescript": "^4.6.2",
"typescript": "^4.6.3",
"vite": "^2.8.6"
},
"engines": {
@@ -1388,9 +1389,9 @@
}
},
"node_modules/@playwright/test": {
"version": "1.20.0",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.20.0.tgz",
"integrity": "sha512-UpI5HTcgNLckR0kqXqwNvbcIXtRaDxk+hnO0OBwPSjfbBjRfRgAJ2ClA/b30C5E3UW5dJa17zhsy2qrk66l5cg==",
"version": "1.20.1",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.20.1.tgz",
"integrity": "sha512-muk3KZXfA7sXTwUEXfL3m4tusj/MBGYjxIFmooi+F2Pf6hKjjVl4+8niy77Xujk4jpL7hZbbqq9v5bRl2m+C8Q==",
"dev": true,
"dependencies": {
"@babel/code-frame": "7.16.7",
@@ -1416,13 +1417,13 @@
"debug": "4.3.3",
"expect": "27.2.5",
"jest-matcher-utils": "27.2.5",
"json5": "2.2.0",
"json5": "2.2.1",
"mime": "3.0.0",
"minimatch": "3.0.4",
"ms": "2.1.3",
"open": "8.4.0",
"pirates": "4.0.4",
"playwright-core": "1.20.0",
"playwright-core": "1.20.1",
"rimraf": "3.0.2",
"source-map-support": "0.4.18",
"stack-utils": "2.0.5",
@@ -1635,9 +1636,9 @@
}
},
"node_modules/@sveltejs/kit": {
"version": "1.0.0-next.302",
"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-1.0.0-next.302.tgz",
"integrity": "sha512-+YUSU7uN5n8i0NOVRaBQgxbaCgFqn63YNudm8kqu27iaw8iCw9Ua6YuE0uMeAtYif+uSletFiMy73f55mMfJNQ==",
"version": "1.0.0-next.303",
"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-1.0.0-next.303.tgz",
"integrity": "sha512-WdxDc8OiF1WEd/bEza7CBdzA+3qIcCi1GKBj/gieKX9I3N8iDJt/Cg2POrLo9wQoJ47nZcAd1eOhfr7XEX1aIQ==",
"dev": true,
"dependencies": {
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.32",
@@ -1694,10 +1695,11 @@
}
},
"node_modules/@testing-library/dom": {
"version": "8.11.3",
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.11.3.tgz",
"integrity": "sha512-9LId28I+lx70wUiZjLvi1DB/WT2zGOxUh46glrSNMaWVx849kKAluezVzZrXJfTKKoQTmEOutLes/bHg4Bj3aA==",
"version": "8.11.4",
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.11.4.tgz",
"integrity": "sha512-7vZ6ZoBEbr6bfEM89W1nzl0vHbuI0g0kRrI0hwSXH3epnuqGO3KulFLQCKfmmW+60t7e4sevAkJPASSMmnNCRw==",
"dev": true,
"license": "MIT",
"dependencies": {
"@babel/code-frame": "^7.10.4",
"@babel/runtime": "^7.12.5",
@@ -1713,10 +1715,11 @@
}
},
"node_modules/@testing-library/jest-dom": {
"version": "5.16.2",
"resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-5.16.2.tgz",
"integrity": "sha512-6ewxs1MXWwsBFZXIk4nKKskWANelkdUehchEOokHsN8X7c2eKXGw+77aRV63UU8f/DTSVUPLaGxdrj4lN7D/ug==",
"version": "5.16.3",
"resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-5.16.3.tgz",
"integrity": "sha512-u5DfKj4wfSt6akfndfu1eG06jsdyA/IUrlX2n3pyq5UXgXMhXY+NJb8eNK/7pqPWAhCKsCGWDdDO0zKMKAYkEA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@babel/runtime": "^7.9.2",
"@types/testing-library__jest-dom": "^5.9.1",
@@ -2875,6 +2878,11 @@
"node": ">=10"
}
},
"node_modules/chart.js": {
"version": "3.7.1",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.7.1.tgz",
"integrity": "sha512-8knRegQLFnPQAheZV8MjxIXc5gQEfDFD897BJgv/klO/vtIyFFmgMXrNfgrXpbTr/XbTturxRgxIXx/Y+ASJBA=="
},
"node_modules/chokidar": {
"version": "3.5.3",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
@@ -5627,13 +5635,10 @@
"dev": true
},
"node_modules/json5": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
"integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.1.tgz",
"integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==",
"dev": true,
"dependencies": {
"minimist": "^1.2.5"
},
"bin": {
"json5": "lib/cli.js"
},
@@ -6433,9 +6438,9 @@
}
},
"node_modules/playwright-core": {
"version": "1.20.0",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.20.0.tgz",
"integrity": "sha512-d25IRcdooS278Cijlp8J8A5fLQZ+/aY3dKRJvgX5yjXA69N0huIUdnh3xXSgn+LsQ9DCNmB7Ngof3eY630jgdA==",
"version": "1.20.1",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.20.1.tgz",
"integrity": "sha512-A8ZsZ09gaSbxP0UijoLyzp3LJc0kWMxDooLPi+mm4/5iYnTbd6PF5nKjoFw1a7KwjZIEgdhJduah4BcUIh+IPA==",
"dev": true,
"dependencies": {
"colors": "1.4.0",
@@ -6594,10 +6599,9 @@
}
},
"node_modules/prettier": {
"version": "2.6.0",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.6.0.tgz",
"integrity": "sha512-m2FgJibYrBGGgQXNzfd0PuDGShJgRavjUoRCw1mZERIWVSXF0iLzLm+aOqTAbLnC3n6JzUhAA8uZnFVghHJ86A==",
"license": "MIT",
"version": "2.6.1",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.6.1.tgz",
"integrity": "sha512-8UVbTBYGwN37Bs9LERmxCPjdvPxlEowx2urIL6urHzdb3SDq4B/Z6xLFCblrSnE4iKWcS6ziJ3aOYrc1kz/E2A==",
"bin": {
"prettier": "bin-prettier.js"
},
@@ -7604,9 +7608,9 @@
}
},
"node_modules/ts-jest": {
"version": "27.1.3",
"resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.1.3.tgz",
"integrity": "sha512-6Nlura7s6uM9BVUAoqLH7JHyMXjz8gluryjpPXxr3IxZdAXnU6FhjvVLHFtfd1vsE1p8zD1OJfskkc0jhTSnkA==",
"version": "27.1.4",
"resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.1.4.tgz",
"integrity": "sha512-qjkZlVPWVctAezwsOD1OPzbZ+k7zA5z3oxII4dGdZo5ggX/PL7kvwTM0pXTr10fAtbiVpJaL3bWd502zAhpgSQ==",
"dev": true,
"dependencies": {
"bs-logger": "0.x",
@@ -7628,7 +7632,6 @@
"@babel/core": ">=7.0.0-beta.0 <8",
"@types/jest": "^27.0.0",
"babel-jest": ">=27.0.0 <28",
"esbuild": "~0.14.0",
"jest": "^27.0.0",
"typescript": ">=3.8 <5.0"
},
@@ -7723,9 +7726,9 @@
}
},
"node_modules/typescript": {
"version": "4.6.2",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.6.2.tgz",
"integrity": "sha512-HM/hFigTBHZhLXshn9sN37H085+hQGeJHJ/X7LpBWLID/fbc2acUMfU+lGD98X81sKP+pFa9f0DZmCwB9GnbAg==",
"version": "4.6.3",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.6.3.tgz",
"integrity": "sha512-yNIatDa5iaofVozS/uQJEl3JRWLKKGJKh6Yaiv0GLGSuhpFJe7P3SbHZ8/yjAHRQwKRoA6YZqlfjXWmVzoVSMw==",
"dev": true,
"bin": {
"tsc": "bin/tsc",
@@ -9079,9 +9082,9 @@
}
},
"@playwright/test": {
"version": "1.20.0",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.20.0.tgz",
"integrity": "sha512-UpI5HTcgNLckR0kqXqwNvbcIXtRaDxk+hnO0OBwPSjfbBjRfRgAJ2ClA/b30C5E3UW5dJa17zhsy2qrk66l5cg==",
"version": "1.20.1",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.20.1.tgz",
"integrity": "sha512-muk3KZXfA7sXTwUEXfL3m4tusj/MBGYjxIFmooi+F2Pf6hKjjVl4+8niy77Xujk4jpL7hZbbqq9v5bRl2m+C8Q==",
"dev": true,
"requires": {
"@babel/code-frame": "7.16.7",
@@ -9107,13 +9110,13 @@
"debug": "4.3.3",
"expect": "27.2.5",
"jest-matcher-utils": "27.2.5",
"json5": "2.2.0",
"json5": "2.2.1",
"mime": "3.0.0",
"minimatch": "3.0.4",
"ms": "2.1.3",
"open": "8.4.0",
"pirates": "4.0.4",
"playwright-core": "1.20.0",
"playwright-core": "1.20.1",
"rimraf": "3.0.2",
"source-map-support": "0.4.18",
"stack-utils": "2.0.5",
@@ -9288,9 +9291,9 @@
}
},
"@sveltejs/kit": {
"version": "1.0.0-next.302",
"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-1.0.0-next.302.tgz",
"integrity": "sha512-+YUSU7uN5n8i0NOVRaBQgxbaCgFqn63YNudm8kqu27iaw8iCw9Ua6YuE0uMeAtYif+uSletFiMy73f55mMfJNQ==",
"version": "1.0.0-next.303",
"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-1.0.0-next.303.tgz",
"integrity": "sha512-WdxDc8OiF1WEd/bEza7CBdzA+3qIcCi1GKBj/gieKX9I3N8iDJt/Cg2POrLo9wQoJ47nZcAd1eOhfr7XEX1aIQ==",
"dev": true,
"requires": {
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.32",
@@ -9323,9 +9326,9 @@
}
},
"@testing-library/dom": {
"version": "8.11.3",
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.11.3.tgz",
"integrity": "sha512-9LId28I+lx70wUiZjLvi1DB/WT2zGOxUh46glrSNMaWVx849kKAluezVzZrXJfTKKoQTmEOutLes/bHg4Bj3aA==",
"version": "8.11.4",
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.11.4.tgz",
"integrity": "sha512-7vZ6ZoBEbr6bfEM89W1nzl0vHbuI0g0kRrI0hwSXH3epnuqGO3KulFLQCKfmmW+60t7e4sevAkJPASSMmnNCRw==",
"dev": true,
"requires": {
"@babel/code-frame": "^7.10.4",
@@ -9339,9 +9342,9 @@
}
},
"@testing-library/jest-dom": {
"version": "5.16.2",
"resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-5.16.2.tgz",
"integrity": "sha512-6ewxs1MXWwsBFZXIk4nKKskWANelkdUehchEOokHsN8X7c2eKXGw+77aRV63UU8f/DTSVUPLaGxdrj4lN7D/ug==",
"version": "5.16.3",
"resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-5.16.3.tgz",
"integrity": "sha512-u5DfKj4wfSt6akfndfu1eG06jsdyA/IUrlX2n3pyq5UXgXMhXY+NJb8eNK/7pqPWAhCKsCGWDdDO0zKMKAYkEA==",
"dev": true,
"requires": {
"@babel/runtime": "^7.9.2",
@@ -10203,6 +10206,11 @@
"integrity": "sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==",
"dev": true
},
"chart.js": {
"version": "3.7.1",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.7.1.tgz",
"integrity": "sha512-8knRegQLFnPQAheZV8MjxIXc5gQEfDFD897BJgv/klO/vtIyFFmgMXrNfgrXpbTr/XbTturxRgxIXx/Y+ASJBA=="
},
"chokidar": {
"version": "3.5.3",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
@@ -12191,13 +12199,10 @@
"dev": true
},
"json5": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
"integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
"dev": true,
"requires": {
"minimist": "^1.2.5"
}
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.1.tgz",
"integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==",
"dev": true
},
"jsonfile": {
"version": "6.1.0",
@@ -12791,9 +12796,9 @@
}
},
"playwright-core": {
"version": "1.20.0",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.20.0.tgz",
"integrity": "sha512-d25IRcdooS278Cijlp8J8A5fLQZ+/aY3dKRJvgX5yjXA69N0huIUdnh3xXSgn+LsQ9DCNmB7Ngof3eY630jgdA==",
"version": "1.20.1",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.20.1.tgz",
"integrity": "sha512-A8ZsZ09gaSbxP0UijoLyzp3LJc0kWMxDooLPi+mm4/5iYnTbd6PF5nKjoFw1a7KwjZIEgdhJduah4BcUIh+IPA==",
"dev": true,
"requires": {
"colors": "1.4.0",
@@ -12913,9 +12918,9 @@
"dev": true
},
"prettier": {
"version": "2.6.0",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.6.0.tgz",
"integrity": "sha512-m2FgJibYrBGGgQXNzfd0PuDGShJgRavjUoRCw1mZERIWVSXF0iLzLm+aOqTAbLnC3n6JzUhAA8uZnFVghHJ86A=="
"version": "2.6.1",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.6.1.tgz",
"integrity": "sha512-8UVbTBYGwN37Bs9LERmxCPjdvPxlEowx2urIL6urHzdb3SDq4B/Z6xLFCblrSnE4iKWcS6ziJ3aOYrc1kz/E2A=="
},
"prettier-plugin-svelte": {
"version": "2.6.0",
@@ -13624,9 +13629,9 @@
}
},
"ts-jest": {
"version": "27.1.3",
"resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.1.3.tgz",
"integrity": "sha512-6Nlura7s6uM9BVUAoqLH7JHyMXjz8gluryjpPXxr3IxZdAXnU6FhjvVLHFtfd1vsE1p8zD1OJfskkc0jhTSnkA==",
"version": "27.1.4",
"resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.1.4.tgz",
"integrity": "sha512-qjkZlVPWVctAezwsOD1OPzbZ+k7zA5z3oxII4dGdZo5ggX/PL7kvwTM0pXTr10fAtbiVpJaL3bWd502zAhpgSQ==",
"dev": true,
"requires": {
"bs-logger": "0.x",
@@ -13699,9 +13704,9 @@
}
},
"typescript": {
"version": "4.6.2",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.6.2.tgz",
"integrity": "sha512-HM/hFigTBHZhLXshn9sN37H085+hQGeJHJ/X7LpBWLID/fbc2acUMfU+lGD98X81sKP+pFa9f0DZmCwB9GnbAg==",
"version": "4.6.3",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.6.3.tgz",
"integrity": "sha512-yNIatDa5iaofVozS/uQJEl3JRWLKKGJKh6Yaiv0GLGSuhpFJe7P3SbHZ8/yjAHRQwKRoA6YZqlfjXWmVzoVSMw==",
"dev": true
},
"universalify": {
+9 -8
View File
@@ -22,15 +22,16 @@
"vitebook:preview": "vitebook preview"
},
"dependencies": {
"aw-labs-ui": "^0.0.8"
"aw-labs-ui": "^0.0.8",
"chart.js": "^3.7.1"
},
"devDependencies": {
"@playwright/test": "^1.20.0",
"@playwright/test": "^1.20.1",
"@sveltejs/adapter-auto": "1.0.0-next.33",
"@sveltejs/kit": "1.0.0-next.302",
"@sveltejs/kit": "1.0.0-next.303",
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.40",
"@testing-library/dom": "^8.11.3",
"@testing-library/jest-dom": "^5.16.2",
"@testing-library/dom": "^8.11.4",
"@testing-library/jest-dom": "^5.16.3",
"@testing-library/svelte": "^3.1.0",
"@testing-library/user-event": "^13.5.0",
"@typescript-eslint/eslint-plugin": "^5.16.0",
@@ -40,16 +41,16 @@
"eslint-plugin-svelte3": "^3.4.1",
"jest": "^27.5.1",
"pre-commit": "^1.2.2",
"prettier": "^2.6.0",
"prettier": "^2.6.1",
"prettier-plugin-svelte": "^2.6.0",
"sass": "^1.49.9",
"svelte": "^3.46.4",
"svelte-check": "^2.4.6",
"svelte-jester": "^2.3.2",
"svelte-preprocess": "^4.10.4",
"ts-jest": "^27.1.3",
"ts-jest": "^27.1.4",
"tslib": "^2.3.1",
"typescript": "^4.6.2",
"typescript": "^4.6.3",
"vite": "^2.8.6"
},
"optionalDependencies": {
+1
View File
@@ -0,0 +1 @@
export { default as Line } from './line.svelte';
+29
View File
@@ -0,0 +1,29 @@
<script lang="ts">
import 'chart.js/auto';
import { Chart, type ChartConfiguration } from 'chart.js';
import { onMount } from 'svelte';
let element: HTMLCanvasElement;
const labels = ['January', 'February', 'March', 'April', 'May', 'June'];
const data = {
labels: labels,
datasets: [
{
label: 'My First dataset',
backgroundColor: 'rgb(255, 99, 132)',
borderColor: 'rgb(255, 99, 132)',
data: [0, 10, 5, 2, 20, 30, 45]
}
]
};
const config: ChartConfiguration = {
type: 'line',
data: data
};
onMount(() => {
new Chart(element, config);
});
</script>
<canvas bind:this={element} />
@@ -5,6 +5,7 @@
import { Card, List, ListItem } from '$lib/components';
import { Cover, Container } from '$lib/layout';
import CreatePlatform from './_createPlatform.svelte';
import { Line } from '$lib/charts';
let addPlatform = false;
</script>
@@ -39,6 +40,7 @@
</Cover>
<Container>
<Card>
<Line />
<p>imagine here are some cool stats</p>
</Card>
<h1>Platforms</h1>