diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 360e406..3688a93 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -19,6 +19,7 @@ import AuthLayout from "./layouts/AuthLayout"; import LogoutPage from "./pages/account/Logout"; import LoginPage from "./pages/account/Login"; import RegisterPage from "./pages/account/Register"; +import { RetroSoundTest } from "./pages/test/sounds"; export default function App() { @@ -39,6 +40,8 @@ export default function App() { } /> } /> + } /> + }> diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/.editorconfig b/frontend/src/pages/test/ews-component-master/ews-component-master/.editorconfig new file mode 100644 index 0000000..f1cc3ad --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/.editorconfig @@ -0,0 +1,15 @@ +# http://editorconfig.org + +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +insert_final_newline = false +trim_trailing_whitespace = false diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/.gitignore b/frontend/src/pages/test/ews-component-master/ews-component-master/.gitignore new file mode 100644 index 0000000..c3ea58a --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/.gitignore @@ -0,0 +1,26 @@ +dist/ +www/ +loader/ + +*~ +*.sw[mnpcod] +*.log +*.lock +*.tmp +*.tmp.* +log.txt +*.sublime-project +*.sublime-workspace + +.stencil/ +.idea/ +.vscode/ +.sass-cache/ +.versions/ +node_modules/ +$RECYCLE.BIN/ + +.DS_Store +Thumbs.db +UserInterfaceState.xcuserstate +.env diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/.prettierrc.json b/frontend/src/pages/test/ews-component-master/ews-component-master/.prettierrc.json new file mode 100644 index 0000000..7ca3a28 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/.prettierrc.json @@ -0,0 +1,13 @@ +{ + "arrowParens": "avoid", + "bracketSpacing": true, + "jsxBracketSameLine": false, + "jsxSingleQuote": false, + "quoteProps": "consistent", + "printWidth": 180, + "semi": true, + "singleQuote": true, + "tabWidth": 2, + "trailingComma": "all", + "useTabs": false +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/LICENSE b/frontend/src/pages/test/ews-component-master/ews-component-master/LICENSE new file mode 100644 index 0000000..c13f991 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2024 + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/LOCAL_USAGE.md b/frontend/src/pages/test/ews-component-master/ews-component-master/LOCAL_USAGE.md new file mode 100644 index 0000000..486de7a --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/LOCAL_USAGE.md @@ -0,0 +1,124 @@ +# Cara Menggunakan Komponen Secara Lokal + +Ikuti langkah-langkah berikut untuk menggunakan `ews-card` dan `ews-hex-shape` di proyek lokal lain. + +## 1. Build Library +Pastikan library sudah di-build di direktori ini (`ews-component`): +```bash +npm run build +``` + +## 2. Link Library (Development) +Gunakan `npm link` agar perubahan di library ini langsung terlihat di proyek tujuan. + +**Di direktori ini (`ews-component`):** +```bash +npm link +``` + +**Di direktori proyek tujuan (misal: `ews-concept-new`):** +```bash +npm link ews-component +``` + +--- + +### Framework: Svelte / Vite / Vanilla JS +Tambahkan loader di file entri utama (seperti `src/routes/+layout.svelte` atau `main.ts`): + +```javascript +import { defineCustomElements } from 'ews-component/loader'; + +if (typeof window !== 'undefined') { + defineCustomElements(); +} +``` + +### Framework: React +Untuk React, panggil `defineCustomElements()` di file entri utama (`index.js` atau `App.js`): + +```tsx +import { useEffect } from 'react'; +import { defineCustomElements } from 'ews-component/loader'; + +function App() { + useEffect(() => { + defineCustomElements(); + }, []); + + return ( +
+ +
React Card
+

Konten di React

+ +
+ ); +} +``` + +### Framework: Vue (Vite) +Untuk Vue 3 dengan Vite, cara paling stabil adalah mengimport komponen secara langsung (menghindari error "Constructor not found"): + +1. Konfigurasi `vite.config.ts`: +```typescript +// vite.config.ts +export default defineConfig({ + plugins: [ + vue({ + template: { + compilerOptions: { + isCustomElement: (tag) => tag.startsWith('ews-') + } + } + }) + ] +}) +``` + +2. Register komponen di `main.ts` atau di component yang membutuhkan: +```typescript +// Mengimport dan register secara eksplisit (lebih stabil untuk development/npm link) +import 'ews-component/components/ews-card'; +import 'ews-component/components/ews-hex-shape'; +import 'ews-component/components/ews-stripe-bar'; +``` + +Atau jika ingin loader otomatis (namun kadang terkendala `npm link`): +```typescript +import { defineCustomElements } from 'ews-component/loader'; +defineCustomElements(); +``` + +### Plain HTML (Tanpa Bundler) +Jika ingin menggunakan langsung di file HTML tanpa build tool: + +```html + + + + + EWS Component Demo + + + + + + +
Vanilla HTML
+

Berjalan langsung di browser.

+ + + + + + + + +``` + +## Alternatif: Install Langsung +Jika tidak ingin menggunakan `link`, Anda bisa menginstall langsung dari path folder: +```bash +npm install ../path/to/ews-component +``` diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/package-lock.json b/frontend/src/pages/test/ews-component-master/ews-component-master/package-lock.json new file mode 100644 index 0000000..9cb9a72 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/package-lock.json @@ -0,0 +1,1768 @@ +{ + "name": "ews-component", + "version": "0.0.1", + "lockfileVersion": 3, + "requires": true, + "packages": { + "": { + "name": "ews-component", + "version": "0.0.1", + "license": "MIT", + "devDependencies": { + "@stencil/core": "^4.27.1", + "@stencil/vitest": "^1.8.3", + "@types/node": "^22.13.5", + "@vitest/browser-playwright": "^4.0.0", + "vitest": "^4.0.0" + } + }, + "node_modules/@blazediff/core": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/@blazediff/core/-/core-1.9.1.tgz", + "integrity": "sha512-ehg3jIkYKulZh+8om/O25vkvSsXXwC+skXmyA87FFx6A/45eqOkZsBltMw/TVteb0mloiGT8oGRTcjRAz66zaA==", + "dev": true, + "license": "MIT" + }, + "node_modules/@emnapi/core": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.9.1.tgz", + "integrity": "sha512-mukuNALVsoix/w1BJwFzwXBN/dHeejQtuVzcDsfOEsdpCumXb/E9j8w11h5S54tT1xhifGfbbSm/ICrObRb3KA==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "@emnapi/wasi-threads": "1.2.0", + "tslib": "^2.4.0" + } + }, + "node_modules/@emnapi/runtime": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.9.1.tgz", + "integrity": "sha512-VYi5+ZVLhpgK4hQ0TAjiQiZ6ol0oe4mBx7mVv7IflsiEp0OWoVsp/+f9Vc1hOhE0TtkORVrI1GvzyreqpgWtkA==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "tslib": "^2.4.0" + } + }, + "node_modules/@emnapi/wasi-threads": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.0.tgz", + "integrity": "sha512-N10dEJNSsUx41Z6pZsXU8FjPjpBEplgH24sfkmITrBED1/U2Esum9F3lfLrMjKHHjmi557zQn7kR9R+XWXu5Rg==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "tslib": "^2.4.0" + } + }, + "node_modules/@jridgewell/sourcemap-codec": { + "version": "1.5.5", + "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz", + "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==", + "dev": true, + "license": "MIT" + }, + "node_modules/@napi-rs/wasm-runtime": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.1.tgz", + "integrity": "sha512-p64ah1M1ld8xjWv3qbvFwHiFVWrq1yFvV4f7w+mzaqiR4IlSgkqhcRdHwsGgomwzBH51sRY4NEowLxnaBjcW/A==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "@emnapi/core": "^1.7.1", + "@emnapi/runtime": "^1.7.1", + "@tybys/wasm-util": "^0.10.1" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/Brooooooklyn" + } + }, + "node_modules/@oxc-project/types": { + "version": "0.120.0", + "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.120.0.tgz", + "integrity": "sha512-k1YNu55DuvAip/MGE1FTsIuU3FUCn6v/ujG9V7Nq5Df/kX2CWb13hhwD0lmJGMGqE+bE1MXvv9SZVnMzEXlWcg==", + "dev": true, + "license": "MIT", + "funding": { + "url": "https://github.com/sponsors/Boshen" + } + }, + "node_modules/@polka/url": { + "version": "1.0.0-next.29", + "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.29.tgz", + "integrity": "sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww==", + "dev": true, + "license": "MIT" + }, + "node_modules/@rolldown/binding-android-arm64": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.0.0-rc.10.tgz", + "integrity": "sha512-jOHxwXhxmFKuXztiu1ORieJeTbx5vrTkcOkkkn2d35726+iwhrY1w/+nYY/AGgF12thg33qC3R1LMBF5tHTZHg==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-darwin-arm64": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.0.0-rc.10.tgz", + "integrity": "sha512-gED05Teg/vtTZbIJBc4VNMAxAFDUPkuO/rAIyyxZjTj1a1/s6z5TII/5yMGZ0uLRCifEtwUQn8OlYzuYc0m70w==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-darwin-x64": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.0.0-rc.10.tgz", + "integrity": "sha512-rI15NcM1mA48lqrIxVkHfAqcyFLcQwyXWThy+BQ5+mkKKPvSO26ir+ZDp36AgYoYVkqvMcdS8zOE6SeBsR9e8A==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-freebsd-x64": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.0.0-rc.10.tgz", + "integrity": "sha512-XZRXHdTa+4ME1MuDVp021+doQ+z6Ei4CCFmNc5/sKbqb8YmkiJdj8QKlV3rCI0AJtAeSB5n0WGPuJWNL9p/L2w==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-linux-arm-gnueabihf": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.0.0-rc.10.tgz", + "integrity": "sha512-R0SQMRluISSLzFE20sPWYHVmJdDQnRyc/FzSCN72BqQmh2SOZUFG+N3/vBZpR4C6WpEUVYJLrYUXaj43sJsNLA==", + "cpu": [ + "arm" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-linux-arm64-gnu": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.0-rc.10.tgz", + "integrity": "sha512-Y1reMrV/o+cwpduYhJuOE3OMKx32RMYCidf14y+HssARRmhDuWXJ4yVguDg2R/8SyyGNo+auzz64LnPK9Hq6jg==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-linux-arm64-musl": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.0-rc.10.tgz", + "integrity": "sha512-vELN+HNb2IzuzSBUOD4NHmP9yrGwl1DVM29wlQvx1OLSclL0NgVWnVDKl/8tEks79EFek/kebQKnNJkIAA4W2g==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-linux-ppc64-gnu": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.0.0-rc.10.tgz", + "integrity": "sha512-ZqrufYTgzxbHwpqOjzSsb0UV/aV2TFIY5rP8HdsiPTv/CuAgCRjM6s9cYFwQ4CNH+hf9Y4erHW1GjZuZ7WoI7w==", + "cpu": [ + "ppc64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-linux-s390x-gnu": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.0.0-rc.10.tgz", + "integrity": "sha512-gSlmVS1FZJSRicA6IyjoRoKAFK7IIHBs7xJuHRSmjImqk3mPPWbR7RhbnfH2G6bcmMEllCt2vQ/7u9e6bBnByg==", + "cpu": [ + "s390x" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-linux-x64-gnu": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.0-rc.10.tgz", + "integrity": "sha512-eOCKUpluKgfObT2pHjztnaWEIbUabWzk3qPZ5PuacuPmr4+JtQG4k2vGTY0H15edaTnicgU428XW/IH6AimcQw==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-linux-x64-musl": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.0-rc.10.tgz", + "integrity": "sha512-Xdf2jQbfQowJnLcgYfD/m0Uu0Qj5OdxKallD78/IPPfzaiaI4KRAwZzHcKQ4ig1gtg1SuzC7jovNiM2TzQsBXA==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-openharmony-arm64": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.0.0-rc.10.tgz", + "integrity": "sha512-o1hYe8hLi1EY6jgPFyxQgQ1wcycX+qz8eEbVmot2hFkgUzPxy9+kF0u0NIQBeDq+Mko47AkaFFaChcvZa9UX9Q==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "openharmony" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-wasm32-wasi": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.0.0-rc.10.tgz", + "integrity": "sha512-Ugv9o7qYJudqQO5Y5y2N2SOo6S4WiqiNOpuQyoPInnhVzCY+wi/GHltcLHypG9DEUYMB0iTB/huJrpadiAcNcA==", + "cpu": [ + "wasm32" + ], + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "@napi-rs/wasm-runtime": "^1.1.1" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/@rolldown/binding-win32-arm64-msvc": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.0-rc.10.tgz", + "integrity": "sha512-7UODQb4fQUNT/vmgDZBl3XOBAIOutP5R3O/rkxg0aLfEGQ4opbCgU5vOw/scPe4xOqBwL9fw7/RP1vAMZ6QlAQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/binding-win32-x64-msvc": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.0-rc.10.tgz", + "integrity": "sha512-PYxKHMVHOb5NJuDL53vBUl1VwUjymDcYI6rzpIni0C9+9mTiJedvUxSk7/RPp7OOAm3v+EjgMu9bIy3N6b408w==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": "^20.19.0 || >=22.12.0" + } + }, + "node_modules/@rolldown/pluginutils": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.10.tgz", + "integrity": "sha512-UkVDEFk1w3mveXeKgaTuYfKWtPbvgck1dT8TUG3bnccrH0XtLTuAyfCoks4Q/M5ZGToSVJTIQYCzy2g/atAOeg==", + "dev": true, + "license": "MIT" + }, + "node_modules/@rollup/rollup-darwin-arm64": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.44.0.tgz", + "integrity": "sha512-VGF3wy0Eq1gcEIkSCr8Ke03CWT+Pm2yveKLaDvq51pPpZza3JX/ClxXOCmTYYq3us5MvEuNRTaeyFThCKRQhOA==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ] + }, + "node_modules/@rollup/rollup-darwin-x64": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.44.0.tgz", + "integrity": "sha512-fBkyrDhwquRvrTxSGH/qqt3/T0w5Rg0L7ZIDypvBPc1/gzjJle6acCpZ36blwuwcKD/u6oCE/sRWlUAcxLWQbQ==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ] + }, + "node_modules/@rollup/rollup-linux-arm64-gnu": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.44.0.tgz", + "integrity": "sha512-ZTR2mxBHb4tK4wGf9b8SYg0Y6KQPjGpR4UWwTFdnmjB4qRtoATZ5dWn3KsDwGa5Z2ZBOE7K52L36J9LueKBdOQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-arm64-musl": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.44.0.tgz", + "integrity": "sha512-GFWfAhVhWGd4r6UxmnKRTBwP1qmModHtd5gkraeW2G490BpFOZkFtem8yuX2NyafIP/mGpRJgTJ2PwohQkUY/Q==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-x64-gnu": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.44.0.tgz", + "integrity": "sha512-iUVJc3c0o8l9Sa/qlDL2Z9UP92UZZW1+EmQ4xfjTc1akr0iUFZNfxrXJ/R1T90h/ILm9iXEY6+iPrmYB3pXKjw==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-x64-musl": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.44.0.tgz", + "integrity": "sha512-PQUobbhLTQT5yz/SPg116VJBgz+XOtXt8D1ck+sfJJhuEsMj2jSej5yTdp8CvWBSceu+WW+ibVL6dm0ptG5fcA==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-win32-arm64-msvc": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.44.0.tgz", + "integrity": "sha512-M0CpcHf8TWn+4oTxJfh7LQuTuaYeXGbk0eageVjQCKzYLsajWS/lFC94qlRqOlyC2KvRT90ZrfXULYmukeIy7w==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "win32" + ] + }, + "node_modules/@rollup/rollup-win32-x64-msvc": { + "version": "4.44.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.44.0.tgz", + "integrity": "sha512-Q2Mgwt+D8hd5FIPUuPDsvPR7Bguza6yTkJxspDGkZj7tBRn2y4KSWYuIXpftFSjBra76TbKerCV7rgFPQrn+wQ==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "win32" + ] + }, + "node_modules/@standard-schema/spec": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz", + "integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==", + "dev": true, + "license": "MIT" + }, + "node_modules/@stencil/core": { + "version": "4.43.3", + "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.43.3.tgz", + "integrity": "sha512-w41W6txhGULvvEfa5AEgwfNGAbK3YGowQYMTWuRvXSIbnkiyRDGLogsYSYtHDlz1JJe645JJIK9Lvh5uquFiSw==", + "dev": true, + "license": "MIT", + "bin": { + "stencil": "bin/stencil" + }, + "engines": { + "node": ">=16.0.0", + "npm": ">=7.10.0" + }, + "optionalDependencies": { + "@rollup/rollup-darwin-arm64": "4.44.0", + "@rollup/rollup-darwin-x64": "4.44.0", + "@rollup/rollup-linux-arm64-gnu": "4.44.0", + "@rollup/rollup-linux-arm64-musl": "4.44.0", + "@rollup/rollup-linux-x64-gnu": "4.44.0", + "@rollup/rollup-linux-x64-musl": "4.44.0", + "@rollup/rollup-win32-arm64-msvc": "4.44.0", + "@rollup/rollup-win32-x64-msvc": "4.44.0" + } + }, + "node_modules/@stencil/vitest": { + "version": "1.8.3", + "resolved": "https://registry.npmjs.org/@stencil/vitest/-/vitest-1.8.3.tgz", + "integrity": "sha512-ia6RvLnx/ADuRD5sWpJcdTnNodtc+bzJsq+vEEHaRWY08e2zU3O8RmRiNqjSoiJcytyK9soUt6eHLfkB1WHFuA==", + "dev": true, + "license": "MIT", + "dependencies": { + "jiti": "^2.6.1", + "local-pkg": "^1.1.2", + "vitest-environment-stencil": "1.8.3" + }, + "bin": { + "stencil-test": "dist/bin/stencil-test.js" + }, + "engines": { + "node": "^20.0.0 || ^22.0.0 || >=24.0.0" + }, + "peerDependencies": { + "@stencil/core": "^4.0.0 || ^5.0.0-next || ^5.0.0", + "vitest": "^4.0.0 || ^3.0.0 || ^2.0.0" + }, + "peerDependenciesMeta": { + "@playwright/test": { + "optional": true + }, + "@stencil/mock-doc": { + "optional": true + }, + "@vitest/browser-playwright": { + "optional": true + }, + "@vitest/browser-preview": { + "optional": true + }, + "@vitest/browser-webdriverio": { + "optional": true + }, + "@wdio/globals": { + "optional": true + }, + "happy-dom": { + "optional": true + }, + "jsdom": { + "optional": true + }, + "playwright": { + "optional": true + } + } + }, + "node_modules/@tybys/wasm-util": { + "version": "0.10.1", + "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.1.tgz", + "integrity": "sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==", + "dev": true, + "license": "MIT", + "optional": true, + "dependencies": { + "tslib": "^2.4.0" + } + }, + "node_modules/@types/chai": { + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/@types/chai/-/chai-5.2.3.tgz", + "integrity": "sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/deep-eql": "*", + "assertion-error": "^2.0.1" + } + }, + "node_modules/@types/deep-eql": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/@types/deep-eql/-/deep-eql-4.0.2.tgz", + "integrity": "sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==", + "dev": true, + "license": "MIT" + }, + "node_modules/@types/estree": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz", + "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==", + "dev": true, + "license": "MIT" + }, + "node_modules/@types/node": { + "version": "22.19.15", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.19.15.tgz", + "integrity": "sha512-F0R/h2+dsy5wJAUe3tAU6oqa2qbWY5TpNfL/RGmo1y38hiyO1w3x2jPtt76wmuaJI4DQnOBu21cNXQ2STIUUWg==", + "dev": true, + "license": "MIT", + "dependencies": { + "undici-types": "~6.21.0" + } + }, + "node_modules/@vitest/browser": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/browser/-/browser-4.1.0.tgz", + "integrity": "sha512-tG/iOrgbiHQks0ew7CdelUyNEHkv8NLrt+CqdTivIuoSnXvO7scWMn4Kqo78/UGY1NJ6Hv+vp8BvRnED/bjFdQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@blazediff/core": "1.9.1", + "@vitest/mocker": "4.1.0", + "@vitest/utils": "4.1.0", + "magic-string": "^0.30.21", + "pngjs": "^7.0.0", + "sirv": "^3.0.2", + "tinyrainbow": "^3.0.3", + "ws": "^8.19.0" + }, + "funding": { + "url": "https://opencollective.com/vitest" + }, + "peerDependencies": { + "vitest": "4.1.0" + } + }, + "node_modules/@vitest/browser-playwright": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/browser-playwright/-/browser-playwright-4.1.0.tgz", + "integrity": "sha512-2RU7pZELY9/aVMLmABNy1HeZ4FX23FXGY1jRuHLHgWa2zaAE49aNW2GLzebW+BmbTZIKKyFF1QXvk7DEWViUCQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@vitest/browser": "4.1.0", + "@vitest/mocker": "4.1.0", + "tinyrainbow": "^3.0.3" + }, + "funding": { + "url": "https://opencollective.com/vitest" + }, + "peerDependencies": { + "playwright": "*", + "vitest": "4.1.0" + }, + "peerDependenciesMeta": { + "playwright": { + "optional": false + } + } + }, + "node_modules/@vitest/expect": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-4.1.0.tgz", + "integrity": "sha512-EIxG7k4wlWweuCLG9Y5InKFwpMEOyrMb6ZJ1ihYu02LVj/bzUwn2VMU+13PinsjRW75XnITeFrQBMH5+dLvCDA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@standard-schema/spec": "^1.1.0", + "@types/chai": "^5.2.2", + "@vitest/spy": "4.1.0", + "@vitest/utils": "4.1.0", + "chai": "^6.2.2", + "tinyrainbow": "^3.0.3" + }, + "funding": { + "url": "https://opencollective.com/vitest" + } + }, + "node_modules/@vitest/mocker": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-4.1.0.tgz", + "integrity": "sha512-evxREh+Hork43+Y4IOhTo+h5lGmVRyjqI739Rz4RlUPqwrkFFDF6EMvOOYjTx4E8Tl6gyCLRL8Mu7Ry12a13Tw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@vitest/spy": "4.1.0", + "estree-walker": "^3.0.3", + "magic-string": "^0.30.21" + }, + "funding": { + "url": "https://opencollective.com/vitest" + }, + "peerDependencies": { + "msw": "^2.4.9", + "vite": "^6.0.0 || ^7.0.0 || ^8.0.0-0" + }, + "peerDependenciesMeta": { + "msw": { + "optional": true + }, + "vite": { + "optional": true + } + } + }, + "node_modules/@vitest/pretty-format": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-4.1.0.tgz", + "integrity": "sha512-3RZLZlh88Ib0J7NQTRATfc/3ZPOnSUn2uDBUoGNn5T36+bALixmzphN26OUD3LRXWkJu4H0s5vvUeqBiw+kS0A==", + "dev": true, + "license": "MIT", + "dependencies": { + "tinyrainbow": "^3.0.3" + }, + "funding": { + "url": "https://opencollective.com/vitest" + } + }, + "node_modules/@vitest/runner": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-4.1.0.tgz", + "integrity": "sha512-Duvx2OzQ7d6OjchL+trw+aSrb9idh7pnNfxrklo14p3zmNL4qPCDeIJAK+eBKYjkIwG96Bc6vYuxhqDXQOWpoQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@vitest/utils": "4.1.0", + "pathe": "^2.0.3" + }, + "funding": { + "url": "https://opencollective.com/vitest" + } + }, + "node_modules/@vitest/snapshot": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-4.1.0.tgz", + "integrity": "sha512-0Vy9euT1kgsnj1CHttwi9i9o+4rRLEaPRSOJ5gyv579GJkNpgJK+B4HSv/rAWixx2wdAFci1X4CEPjiu2bXIMg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@vitest/pretty-format": "4.1.0", + "@vitest/utils": "4.1.0", + "magic-string": "^0.30.21", + "pathe": "^2.0.3" + }, + "funding": { + "url": "https://opencollective.com/vitest" + } + }, + "node_modules/@vitest/spy": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-4.1.0.tgz", + "integrity": "sha512-pz77k+PgNpyMDv2FV6qmk5ZVau6c3R8HC8v342T2xlFxQKTrSeYw9waIJG8KgV9fFwAtTu4ceRzMivPTH6wSxw==", + "dev": true, + "license": "MIT", + "funding": { + "url": "https://opencollective.com/vitest" + } + }, + "node_modules/@vitest/utils": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-4.1.0.tgz", + "integrity": "sha512-XfPXT6a8TZY3dcGY8EdwsBulFCIw+BeeX0RZn2x/BtiY/75YGh8FeWGG8QISN/WhaqSrE2OrlDgtF8q5uhOTmw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@vitest/pretty-format": "4.1.0", + "convert-source-map": "^2.0.0", + "tinyrainbow": "^3.0.3" + }, + "funding": { + "url": "https://opencollective.com/vitest" + } + }, + "node_modules/acorn": { + "version": "8.16.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.16.0.tgz", + "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==", + "dev": true, + "license": "MIT", + "bin": { + "acorn": "bin/acorn" + }, + "engines": { + "node": ">=0.4.0" + } + }, + "node_modules/assertion-error": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz", + "integrity": "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + } + }, + "node_modules/chai": { + "version": "6.2.2", + "resolved": "https://registry.npmjs.org/chai/-/chai-6.2.2.tgz", + "integrity": "sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + } + }, + "node_modules/confbox": { + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.2.4.tgz", + "integrity": "sha512-ysOGlgTFbN2/Y6Cg3Iye8YKulHw+R2fNXHrgSmXISQdMnomY6eNDprVdW9R5xBguEqI954+S6709UyiO7B+6OQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/convert-source-map": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz", + "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==", + "dev": true, + "license": "MIT" + }, + "node_modules/detect-libc": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz", + "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=8" + } + }, + "node_modules/es-module-lexer": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-2.0.0.tgz", + "integrity": "sha512-5POEcUuZybH7IdmGsD8wlf0AI55wMecM9rVBTI/qEAy2c1kTOm3DjFYjrBdI2K3BaJjJYfYFeRtM0t9ssnRuxw==", + "dev": true, + "license": "MIT" + }, + "node_modules/estree-walker": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz", + "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/estree": "^1.0.0" + } + }, + "node_modules/expect-type": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/expect-type/-/expect-type-1.3.0.tgz", + "integrity": "sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=12.0.0" + } + }, + "node_modules/exsolve": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/exsolve/-/exsolve-1.0.8.tgz", + "integrity": "sha512-LmDxfWXwcTArk8fUEnOfSZpHOJ6zOMUJKOtFLFqJLoKJetuQG874Uc7/Kki7zFLzYybmZhp1M7+98pfMqeX8yA==", + "dev": true, + "license": "MIT" + }, + "node_modules/fdir": { + "version": "6.5.0", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz", + "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12.0.0" + }, + "peerDependencies": { + "picomatch": "^3 || ^4" + }, + "peerDependenciesMeta": { + "picomatch": { + "optional": true + } + } + }, + "node_modules/fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "peer": true, + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/jiti": { + "version": "2.6.1", + "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.6.1.tgz", + "integrity": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==", + "dev": true, + "license": "MIT", + "bin": { + "jiti": "lib/jiti-cli.mjs" + } + }, + "node_modules/lightningcss": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz", + "integrity": "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==", + "dev": true, + "license": "MPL-2.0", + "dependencies": { + "detect-libc": "^2.0.3" + }, + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + }, + "optionalDependencies": { + "lightningcss-android-arm64": "1.32.0", + "lightningcss-darwin-arm64": "1.32.0", + "lightningcss-darwin-x64": "1.32.0", + "lightningcss-freebsd-x64": "1.32.0", + "lightningcss-linux-arm-gnueabihf": "1.32.0", + "lightningcss-linux-arm64-gnu": "1.32.0", + "lightningcss-linux-arm64-musl": "1.32.0", + "lightningcss-linux-x64-gnu": "1.32.0", + "lightningcss-linux-x64-musl": "1.32.0", + "lightningcss-win32-arm64-msvc": "1.32.0", + "lightningcss-win32-x64-msvc": "1.32.0" + } + }, + "node_modules/lightningcss-android-arm64": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.32.0.tgz", + "integrity": "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-darwin-arm64": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.32.0.tgz", + "integrity": "sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-darwin-x64": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.32.0.tgz", + "integrity": "sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-freebsd-x64": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.32.0.tgz", + "integrity": "sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm-gnueabihf": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.32.0.tgz", + "integrity": "sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==", + "cpu": [ + "arm" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm64-gnu": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.32.0.tgz", + "integrity": "sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm64-musl": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.32.0.tgz", + "integrity": "sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-x64-gnu": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.32.0.tgz", + "integrity": "sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-x64-musl": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.32.0.tgz", + "integrity": "sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-win32-arm64-msvc": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.32.0.tgz", + "integrity": "sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-win32-x64-msvc": { + "version": "1.32.0", + "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.32.0.tgz", + "integrity": "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MPL-2.0", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/local-pkg": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-1.1.2.tgz", + "integrity": "sha512-arhlxbFRmoQHl33a0Zkle/YWlmNwoyt6QNZEIJcqNbdrsix5Lvc4HyyI3EnwxTYlZYc32EbYrQ8SzEZ7dqgg9A==", + "dev": true, + "license": "MIT", + "dependencies": { + "mlly": "^1.7.4", + "pkg-types": "^2.3.0", + "quansync": "^0.2.11" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + } + }, + "node_modules/magic-string": { + "version": "0.30.21", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz", + "integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@jridgewell/sourcemap-codec": "^1.5.5" + } + }, + "node_modules/mlly": { + "version": "1.8.2", + "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.8.2.tgz", + "integrity": "sha512-d+ObxMQFmbt10sretNDytwt85VrbkhhUA/JBGm1MPaWJ65Cl4wOgLaB1NYvJSZ0Ef03MMEU/0xpPMXUIQ29UfA==", + "dev": true, + "license": "MIT", + "dependencies": { + "acorn": "^8.16.0", + "pathe": "^2.0.3", + "pkg-types": "^1.3.1", + "ufo": "^1.6.3" + } + }, + "node_modules/mlly/node_modules/confbox": { + "version": "0.1.8", + "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.8.tgz", + "integrity": "sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==", + "dev": true, + "license": "MIT" + }, + "node_modules/mlly/node_modules/pkg-types": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.3.1.tgz", + "integrity": "sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "confbox": "^0.1.8", + "mlly": "^1.7.4", + "pathe": "^2.0.1" + } + }, + "node_modules/mrmime": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.1.tgz", + "integrity": "sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=10" + } + }, + "node_modules/nanoid": { + "version": "3.3.11", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz", + "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "bin": { + "nanoid": "bin/nanoid.cjs" + }, + "engines": { + "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" + } + }, + "node_modules/obug": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/obug/-/obug-2.1.1.tgz", + "integrity": "sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ==", + "dev": true, + "funding": [ + "https://github.com/sponsors/sxzz", + "https://opencollective.com/debug" + ], + "license": "MIT" + }, + "node_modules/pathe": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz", + "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==", + "dev": true, + "license": "MIT" + }, + "node_modules/picocolors": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", + "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==", + "dev": true, + "license": "ISC" + }, + "node_modules/picomatch": { + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz", + "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/pkg-types": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-2.3.0.tgz", + "integrity": "sha512-SIqCzDRg0s9npO5XQ3tNZioRY1uK06lA41ynBC1YmFTmnY6FjUjVt6s4LoADmwoig1qqD0oK8h1p/8mlMx8Oig==", + "dev": true, + "license": "MIT", + "dependencies": { + "confbox": "^0.2.2", + "exsolve": "^1.0.7", + "pathe": "^2.0.3" + } + }, + "node_modules/playwright": { + "version": "1.58.2", + "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.58.2.tgz", + "integrity": "sha512-vA30H8Nvkq/cPBnNw4Q8TWz1EJyqgpuinBcHET0YVJVFldr8JDNiU9LaWAE1KqSkRYazuaBhTpB5ZzShOezQ6A==", + "dev": true, + "license": "Apache-2.0", + "peer": true, + "dependencies": { + "playwright-core": "1.58.2" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=18" + }, + "optionalDependencies": { + "fsevents": "2.3.2" + } + }, + "node_modules/playwright-core": { + "version": "1.58.2", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.58.2.tgz", + "integrity": "sha512-yZkEtftgwS8CsfYo7nm0KE8jsvm6i/PTgVtB8DL726wNf6H2IMsDuxCpJj59KDaxCtSnrWan2AeDqM7JBaultg==", + "dev": true, + "license": "Apache-2.0", + "peer": true, + "bin": { + "playwright-core": "cli.js" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/pngjs": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-7.0.0.tgz", + "integrity": "sha512-LKWqWJRhstyYo9pGvgor/ivk2w94eSjE3RGVuzLGlr3NmD8bf7RcYGze1mNdEHRP6TRP6rMuDHk5t44hnTRyow==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14.19.0" + } + }, + "node_modules/postcss": { + "version": "8.5.8", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.8.tgz", + "integrity": "sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "nanoid": "^3.3.11", + "picocolors": "^1.1.1", + "source-map-js": "^1.2.1" + }, + "engines": { + "node": "^10 || ^12 || >=14" + } + }, + "node_modules/quansync": { + "version": "0.2.11", + "resolved": "https://registry.npmjs.org/quansync/-/quansync-0.2.11.tgz", + "integrity": "sha512-AifT7QEbW9Nri4tAwR5M/uzpBuqfZf+zwaEM/QkzEjj7NBuFD2rBuy0K3dE+8wltbezDV7JMA0WfnCPYRSYbXA==", + "dev": true, + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/antfu" + }, + { + "type": "individual", + "url": "https://github.com/sponsors/sxzz" + } + ], + "license": "MIT" + }, + "node_modules/rolldown": { + "version": "1.0.0-rc.10", + "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.0.0-rc.10.tgz", + "integrity": "sha512-q7j6vvarRFmKpgJUT8HCAUljkgzEp4LAhPlJUvQhA5LA1SUL36s5QCysMutErzL3EbNOZOkoziSx9iZC4FddKA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@oxc-project/types": "=0.120.0", + "@rolldown/pluginutils": "1.0.0-rc.10" + }, + "bin": { + "rolldown": "bin/cli.mjs" + }, + "engines": { + "node": "^20.19.0 || >=22.12.0" + }, + "optionalDependencies": { + "@rolldown/binding-android-arm64": "1.0.0-rc.10", + "@rolldown/binding-darwin-arm64": "1.0.0-rc.10", + "@rolldown/binding-darwin-x64": "1.0.0-rc.10", + "@rolldown/binding-freebsd-x64": "1.0.0-rc.10", + "@rolldown/binding-linux-arm-gnueabihf": "1.0.0-rc.10", + "@rolldown/binding-linux-arm64-gnu": "1.0.0-rc.10", + "@rolldown/binding-linux-arm64-musl": "1.0.0-rc.10", + "@rolldown/binding-linux-ppc64-gnu": "1.0.0-rc.10", + "@rolldown/binding-linux-s390x-gnu": "1.0.0-rc.10", + "@rolldown/binding-linux-x64-gnu": "1.0.0-rc.10", + "@rolldown/binding-linux-x64-musl": "1.0.0-rc.10", + "@rolldown/binding-openharmony-arm64": "1.0.0-rc.10", + "@rolldown/binding-wasm32-wasi": "1.0.0-rc.10", + "@rolldown/binding-win32-arm64-msvc": "1.0.0-rc.10", + "@rolldown/binding-win32-x64-msvc": "1.0.0-rc.10" + } + }, + "node_modules/siginfo": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/siginfo/-/siginfo-2.0.0.tgz", + "integrity": "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==", + "dev": true, + "license": "ISC" + }, + "node_modules/sirv": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/sirv/-/sirv-3.0.2.tgz", + "integrity": "sha512-2wcC/oGxHis/BoHkkPwldgiPSYcpZK3JU28WoMVv55yHJgcZ8rlXvuG9iZggz+sU1d4bRgIGASwyWqjxu3FM0g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@polka/url": "^1.0.0-next.24", + "mrmime": "^2.0.0", + "totalist": "^3.0.0" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/source-map-js": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", + "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==", + "dev": true, + "license": "BSD-3-Clause", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/stackback": { + "version": "0.0.2", + "resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz", + "integrity": "sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==", + "dev": true, + "license": "MIT" + }, + "node_modules/std-env": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/std-env/-/std-env-4.0.0.tgz", + "integrity": "sha512-zUMPtQ/HBY3/50VbpkupYHbRroTRZJPRLvreamgErJVys0ceuzMkD44J/QjqhHjOzK42GQ3QZIeFG1OYfOtKqQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/tinybench": { + "version": "2.9.0", + "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz", + "integrity": "sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==", + "dev": true, + "license": "MIT" + }, + "node_modules/tinyexec": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.0.4.tgz", + "integrity": "sha512-u9r3uZC0bdpGOXtlxUIdwf9pkmvhqJdrVCH9fapQtgy/OeTTMZ1nqH7agtvEfmGui6e1XxjcdrlxvxJvc3sMqw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + } + }, + "node_modules/tinyglobby": { + "version": "0.2.15", + "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz", + "integrity": "sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "fdir": "^6.5.0", + "picomatch": "^4.0.3" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/SuperchupuDev" + } + }, + "node_modules/tinyrainbow": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-3.1.0.tgz", + "integrity": "sha512-Bf+ILmBgretUrdJxzXM0SgXLZ3XfiaUuOj/IKQHuTXip+05Xn+uyEYdVg0kYDipTBcLrCVyUzAPz7QmArb0mmw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/totalist": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/totalist/-/totalist-3.0.1.tgz", + "integrity": "sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6" + } + }, + "node_modules/tslib": { + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", + "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, + "license": "0BSD", + "optional": true + }, + "node_modules/ufo": { + "version": "1.6.3", + "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.6.3.tgz", + "integrity": "sha512-yDJTmhydvl5lJzBmy/hyOAA0d+aqCBuwl818haVdYCRrWV84o7YyeVm4QlVHStqNrrJSTb6jKuFAVqAFsr+K3Q==", + "dev": true, + "license": "MIT" + }, + "node_modules/undici-types": { + "version": "6.21.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz", + "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/vite": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/vite/-/vite-8.0.1.tgz", + "integrity": "sha512-wt+Z2qIhfFt85uiyRt5LPU4oVEJBXj8hZNWKeqFG4gRG/0RaRGJ7njQCwzFVjO+v4+Ipmf5CY7VdmZRAYYBPHw==", + "dev": true, + "license": "MIT", + "dependencies": { + "lightningcss": "^1.32.0", + "picomatch": "^4.0.3", + "postcss": "^8.5.8", + "rolldown": "1.0.0-rc.10", + "tinyglobby": "^0.2.15" + }, + "bin": { + "vite": "bin/vite.js" + }, + "engines": { + "node": "^20.19.0 || >=22.12.0" + }, + "funding": { + "url": "https://github.com/vitejs/vite?sponsor=1" + }, + "optionalDependencies": { + "fsevents": "~2.3.3" + }, + "peerDependencies": { + "@types/node": "^20.19.0 || >=22.12.0", + "@vitejs/devtools": "^0.1.0", + "esbuild": "^0.27.0", + "jiti": ">=1.21.0", + "less": "^4.0.0", + "sass": "^1.70.0", + "sass-embedded": "^1.70.0", + "stylus": ">=0.54.8", + "sugarss": "^5.0.0", + "terser": "^5.16.0", + "tsx": "^4.8.1", + "yaml": "^2.4.2" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + }, + "@vitejs/devtools": { + "optional": true + }, + "esbuild": { + "optional": true + }, + "jiti": { + "optional": true + }, + "less": { + "optional": true + }, + "sass": { + "optional": true + }, + "sass-embedded": { + "optional": true + }, + "stylus": { + "optional": true + }, + "sugarss": { + "optional": true + }, + "terser": { + "optional": true + }, + "tsx": { + "optional": true + }, + "yaml": { + "optional": true + } + } + }, + "node_modules/vite/node_modules/fsevents": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", + "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", + "dev": true, + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/vitest": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/vitest/-/vitest-4.1.0.tgz", + "integrity": "sha512-YbDrMF9jM2Lqc++2530UourxZHmkKLxrs4+mYhEwqWS97WJ7wOYEkcr+QfRgJ3PW9wz3odRijLZjHEaRLTNbqw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@vitest/expect": "4.1.0", + "@vitest/mocker": "4.1.0", + "@vitest/pretty-format": "4.1.0", + "@vitest/runner": "4.1.0", + "@vitest/snapshot": "4.1.0", + "@vitest/spy": "4.1.0", + "@vitest/utils": "4.1.0", + "es-module-lexer": "^2.0.0", + "expect-type": "^1.3.0", + "magic-string": "^0.30.21", + "obug": "^2.1.1", + "pathe": "^2.0.3", + "picomatch": "^4.0.3", + "std-env": "^4.0.0-rc.1", + "tinybench": "^2.9.0", + "tinyexec": "^1.0.2", + "tinyglobby": "^0.2.15", + "tinyrainbow": "^3.0.3", + "vite": "^6.0.0 || ^7.0.0 || ^8.0.0-0", + "why-is-node-running": "^2.3.0" + }, + "bin": { + "vitest": "vitest.mjs" + }, + "engines": { + "node": "^20.0.0 || ^22.0.0 || >=24.0.0" + }, + "funding": { + "url": "https://opencollective.com/vitest" + }, + "peerDependencies": { + "@edge-runtime/vm": "*", + "@opentelemetry/api": "^1.9.0", + "@types/node": "^20.0.0 || ^22.0.0 || >=24.0.0", + "@vitest/browser-playwright": "4.1.0", + "@vitest/browser-preview": "4.1.0", + "@vitest/browser-webdriverio": "4.1.0", + "@vitest/ui": "4.1.0", + "happy-dom": "*", + "jsdom": "*", + "vite": "^6.0.0 || ^7.0.0 || ^8.0.0-0" + }, + "peerDependenciesMeta": { + "@edge-runtime/vm": { + "optional": true + }, + "@opentelemetry/api": { + "optional": true + }, + "@types/node": { + "optional": true + }, + "@vitest/browser-playwright": { + "optional": true + }, + "@vitest/browser-preview": { + "optional": true + }, + "@vitest/browser-webdriverio": { + "optional": true + }, + "@vitest/ui": { + "optional": true + }, + "happy-dom": { + "optional": true + }, + "jsdom": { + "optional": true + }, + "vite": { + "optional": false + } + } + }, + "node_modules/vitest-environment-stencil": { + "version": "1.8.3", + "resolved": "https://registry.npmjs.org/vitest-environment-stencil/-/vitest-environment-stencil-1.8.3.tgz", + "integrity": "sha512-YcigEK43Asfg6vKthpQY6GEiXuYakhIcJHuwkf+iyPa9cW4Rnq4gpT/TrH2lZDmwUz0RmeUM43atJFpI7mELHA==", + "dev": true, + "dependencies": { + "@stencil/vitest": "1.8.3" + } + }, + "node_modules/why-is-node-running": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.3.0.tgz", + "integrity": "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==", + "dev": true, + "license": "MIT", + "dependencies": { + "siginfo": "^2.0.0", + "stackback": "0.0.2" + }, + "bin": { + "why-is-node-running": "cli.js" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/ws": { + "version": "8.19.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.19.0.tgz", + "integrity": "sha512-blAT2mjOEIi0ZzruJfIhb3nps74PRWTCz1IjglWEEpQl5XS/UNama6u2/rjFkDDouqr4L67ry+1aGIALViWjDg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=10.0.0" + }, + "peerDependencies": { + "bufferutil": "^4.0.1", + "utf-8-validate": ">=5.0.2" + }, + "peerDependenciesMeta": { + "bufferutil": { + "optional": true + }, + "utf-8-validate": { + "optional": true + } + } + } + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/package.json b/frontend/src/pages/test/ews-component-master/ews-component-master/package.json new file mode 100644 index 0000000..ccd9fd0 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/package.json @@ -0,0 +1,53 @@ +{ + "name": "ews-component", + "version": "0.0.1", + "description": "Stencil Component Starter", + "main": "dist/index.cjs.js", + "module": "dist/index.js", + "types": "dist/types/index.d.ts", + "collection": "dist/collection/collection-manifest.json", + "collection:main": "dist/collection/index.js", + "unpkg": "dist/ews-component/ews-component.esm.js", + "exports": { + ".": { + "import": "./dist/ews-component/ews-component.esm.js", + "require": "./dist/ews-component/ews-component.cjs.js" + }, + "./components": { + "import": "./dist/components/index.js", + "types": "./dist/components/index.d.ts" + }, + "./components/*": { + "import": "./dist/components/*.js", + "types": "./dist/components/*.d.ts" + }, + "./loader": { + "import": "./loader/index.js", + "require": "./loader/index.cjs", + "types": "./loader/index.d.ts" + } + }, + "repository": { + "type": "git", + "url": "https://github.com/bagusindrayana/ews-component" + }, + "files": [ + "dist/", + "loader/" + ], + "scripts": { + "build": "stencil build", + "start": "stencil build --dev --watch --serve", + "test": "stencil-test", + "test:watch": "stencil-test --watch", + "generate": "stencil generate" + }, + "devDependencies": { + "@stencil/core": "^4.27.1", + "@stencil/vitest": "^1.8.3", + "@types/node": "^22.13.5", + "@vitest/browser-playwright": "^4.0.0", + "vitest": "^4.0.0" + }, + "license": "MIT" +} \ No newline at end of file diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/readme.md b/frontend/src/pages/test/ews-component-master/ews-component-master/readme.md new file mode 100644 index 0000000..8e3aa1f --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/readme.md @@ -0,0 +1,105 @@ +# EWS Component Library + +> A collection of StencilJS web components for the EWS project. + +This library contains reusable web components such as layout managers, charts, and UI elements designed for high-performance and framework-agnostic usage. + +## Installation + +To use `ews-component` in your project, install it via npm: + +```bash +npm install ews-component +``` + +## Available Components + +- `ews-card`: A versatile card component for displaying content. +- `ews-hex-grid`: A grid layout with hexagonal cells. +- `ews-hex-shape`: Individual hexagonal shape component. +- `ews-rib-layout`: A responsive "ribcage" layout for hierarchical data. +- `ews-stripe-bar`: A striped status or progress bar. + +## Local Development (StencilJS) + +To start developing components locally, clone this repository and follow these steps: + +1. **Install dependencies**: + ```bash + npm install + ``` + +2. **Start development server**: + ```bash + npm start + ``` + This will start a local dev server with hot-reloading. + +3. **Build for production**: + ```bash + npm run build + ``` + +4. **Run tests**: + ```bash + npm test + ``` + +## Usage + +### Framework Integration + +Since these are standard Web Components, they work in any framework (React, Vue, Angular, Svelte) or with no framework at all. + +### Lazy Loading (Universal) + +Include the loader script in your HTML: + +```html + + + + +``` + +### Direct Import (React/Vite/NextJS) + +```tsx +import { defineCustomElements } from 'ews-component/loader'; + +defineCustomElements(); + +// Use in your component + +``` + +## Documentation + +For more detailed information on specific components, please refer to the documentation in each component's directory or the official [StencilJS documentation](https://stenciljs.com/docs/introduction). + + +## Contributing & Adding New Components + +To maintain consistency, please follow these steps when adding a new component: + +1. **Generate Component**: + Use the Stencil CLI to scaffold your component: + ```bash + npm run generate + ``` + *Input the name with `ews-` prefix (e.g., `ews-new-button`).* + +2. **Naming & Directory**: + - **Folder**: `src/components/ews-[name]/` + - **Tag Name**: `ews-[name]` + - **Class Name**: `Ews[Name]` (PascalCase) + +3. **Code Style Guidelines**: + - **TypeScript & TSX**: Always use TypeScript/TSX for component logic. + - **Styling**: Use a dedicated CSS file (`[name].css`). Prefix all classes with `ews-` (e.g., `.ews-card`) to avoid global style collisions. + - **Reactivity**: Use `@Prop()`, `@State()`, and `@Event()` decorators for state management and communication. + - **Documentation**: Write clear JSDoc comments for props and events; Stencil will automatically update the component's `readme.md`. + + +## Support Me! +[![Support me on Sociabuzz](https://img.shields.io/badge/Support%20Me-Sociabuzz-orange?style=for-the-badge&logo=buymeacoffee&logoColor=white)](https://sociabuzz.com/bagusindrayana/tribe) \ No newline at end of file diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components.d.ts b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components.d.ts new file mode 100644 index 0000000..7f82b02 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components.d.ts @@ -0,0 +1,394 @@ +/* eslint-disable */ +/* tslint:disable */ +/** + * This is an autogenerated file created by the Stencil compiler. + * It contains typing information for all components that exist in this project. + */ +import { HTMLStencilElement, JSXBase } from "@stencil/core/internal"; +export namespace Components { + interface EwsCard { + /** + * Custom color for border and content (red or orange) + */ + "color"?: string; + /** + * Additional CSS classes to apply to the card wrapper + * @default '' + */ + "customClass": string; + /** + * Inline style + */ + "customStyle"?: string; + } + interface EwsHexGrid { + /** + * Additional CSS class for the container. + * @default '' + */ + "customClass": string; + /** + * Gap between hex cells in pixels. + * @default 4 + */ + "gap": number; + /** + * Height of each hex cell in pixels. + */ + "hexHeight": number; + /** + * Width of each hex cell in pixels. + */ + "hexWidth": number; + /** + * Hex orientation variant: 'pointy' or 'flat'. + * @default 'pointy' + */ + "variant": 'pointy' | 'flat'; + } + interface EwsHexShape { + /** + * Whether to clip content within the hex shape. + * @default false + */ + "clipContent": boolean; + /** + * The color variant of the hex shape. + * @default 'orange' + */ + "color": string; + /** + * Additional CSS classes for the component. + * @default '' + */ + "customClass": string; + /** + * Whether the hex shape has a flat top. + * @default true + */ + "flatTop": boolean; + /** + * The padding inside the hex shape for content. + * @default 10 + */ + "paddingContent": number; + } + interface EwsRibLayout { + /** + * Optional renderer function for the connector content. + */ + "connectorRenderer"?: (item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) => any; + /** + * Function to get the href for a node. If provided, nodes will be rendered as tags. + */ + "getHref"?: (item: any) => string; + /** + * Array of items to be displayed in the rib cage layout. + * @default [] + */ + "items": any[]; + /** + * Maximum number of branches to display. If not provided, it defaults to 5 (responsive). + */ + "maxBranches"?: number; + /** + * Optional renderer function for the node content. + */ + "nodeRenderer"?: (item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) => any; + } + interface EwsStripeBar { + /** + * @default '' + */ + "color": string; + /** + * @default 10 + */ + "duration": number; + /** + * @default false + */ + "loop": boolean; + /** + * @default '' + */ + "orientation": string; + /** + * @default false + */ + "reverse": boolean; + /** + * @default '30px' + */ + "size": string; + } + interface MyComponent { + /** + * The first name + */ + "first": string; + /** + * The last name + */ + "last": string; + /** + * The middle name + */ + "middle": string; + } +} +export interface EwsCardCustomEvent extends CustomEvent { + detail: T; + target: HTMLEwsCardElement; +} +declare global { + interface HTMLEwsCardElementEventMap { + "toggle": void; + } + interface HTMLEwsCardElement extends Components.EwsCard, HTMLStencilElement { + addEventListener(type: K, listener: (this: HTMLEwsCardElement, ev: EwsCardCustomEvent) => any, options?: boolean | AddEventListenerOptions): void; + addEventListener(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void; + addEventListener(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void; + addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void; + removeEventListener(type: K, listener: (this: HTMLEwsCardElement, ev: EwsCardCustomEvent) => any, options?: boolean | EventListenerOptions): void; + removeEventListener(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void; + removeEventListener(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void; + removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void; + } + var HTMLEwsCardElement: { + prototype: HTMLEwsCardElement; + new (): HTMLEwsCardElement; + }; + interface HTMLEwsHexGridElement extends Components.EwsHexGrid, HTMLStencilElement { + } + var HTMLEwsHexGridElement: { + prototype: HTMLEwsHexGridElement; + new (): HTMLEwsHexGridElement; + }; + interface HTMLEwsHexShapeElement extends Components.EwsHexShape, HTMLStencilElement { + } + var HTMLEwsHexShapeElement: { + prototype: HTMLEwsHexShapeElement; + new (): HTMLEwsHexShapeElement; + }; + interface HTMLEwsRibLayoutElement extends Components.EwsRibLayout, HTMLStencilElement { + } + var HTMLEwsRibLayoutElement: { + prototype: HTMLEwsRibLayoutElement; + new (): HTMLEwsRibLayoutElement; + }; + interface HTMLEwsStripeBarElement extends Components.EwsStripeBar, HTMLStencilElement { + } + var HTMLEwsStripeBarElement: { + prototype: HTMLEwsStripeBarElement; + new (): HTMLEwsStripeBarElement; + }; + interface HTMLMyComponentElement extends Components.MyComponent, HTMLStencilElement { + } + var HTMLMyComponentElement: { + prototype: HTMLMyComponentElement; + new (): HTMLMyComponentElement; + }; + interface HTMLElementTagNameMap { + "ews-card": HTMLEwsCardElement; + "ews-hex-grid": HTMLEwsHexGridElement; + "ews-hex-shape": HTMLEwsHexShapeElement; + "ews-rib-layout": HTMLEwsRibLayoutElement; + "ews-stripe-bar": HTMLEwsStripeBarElement; + "my-component": HTMLMyComponentElement; + } +} +declare namespace LocalJSX { + interface EwsCard { + /** + * Custom color for border and content (red or orange) + */ + "color"?: string; + /** + * Additional CSS classes to apply to the card wrapper + * @default '' + */ + "customClass"?: string; + /** + * Inline style + */ + "customStyle"?: string; + /** + * Emitted when the card toggles open/close state + */ + "onToggle"?: (event: EwsCardCustomEvent) => void; + } + interface EwsHexGrid { + /** + * Additional CSS class for the container. + * @default '' + */ + "customClass"?: string; + /** + * Gap between hex cells in pixels. + * @default 4 + */ + "gap"?: number; + /** + * Height of each hex cell in pixels. + */ + "hexHeight"?: number; + /** + * Width of each hex cell in pixels. + */ + "hexWidth"?: number; + /** + * Hex orientation variant: 'pointy' or 'flat'. + * @default 'pointy' + */ + "variant"?: 'pointy' | 'flat'; + } + interface EwsHexShape { + /** + * Whether to clip content within the hex shape. + * @default false + */ + "clipContent"?: boolean; + /** + * The color variant of the hex shape. + * @default 'orange' + */ + "color"?: string; + /** + * Additional CSS classes for the component. + * @default '' + */ + "customClass"?: string; + /** + * Whether the hex shape has a flat top. + * @default true + */ + "flatTop"?: boolean; + /** + * The padding inside the hex shape for content. + * @default 10 + */ + "paddingContent"?: number; + } + interface EwsRibLayout { + /** + * Optional renderer function for the connector content. + */ + "connectorRenderer"?: (item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) => any; + /** + * Function to get the href for a node. If provided, nodes will be rendered as tags. + */ + "getHref"?: (item: any) => string; + /** + * Array of items to be displayed in the rib cage layout. + * @default [] + */ + "items"?: any[]; + /** + * Maximum number of branches to display. If not provided, it defaults to 5 (responsive). + */ + "maxBranches"?: number; + /** + * Optional renderer function for the node content. + */ + "nodeRenderer"?: (item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) => any; + } + interface EwsStripeBar { + /** + * @default '' + */ + "color"?: string; + /** + * @default 10 + */ + "duration"?: number; + /** + * @default false + */ + "loop"?: boolean; + /** + * @default '' + */ + "orientation"?: string; + /** + * @default false + */ + "reverse"?: boolean; + /** + * @default '30px' + */ + "size"?: string; + } + interface MyComponent { + /** + * The first name + */ + "first"?: string; + /** + * The last name + */ + "last"?: string; + /** + * The middle name + */ + "middle"?: string; + } + + interface EwsCardAttributes { + "customClass": string; + "color": string; + "customStyle": string; + } + interface EwsHexGridAttributes { + "customClass": string; + "variant": 'pointy' | 'flat'; + "hexWidth": number; + "hexHeight": number; + "gap": number; + } + interface EwsHexShapeAttributes { + "customClass": string; + "color": string; + "flatTop": boolean; + "clipContent": boolean; + "paddingContent": number; + } + interface EwsRibLayoutAttributes { + "maxBranches": number; + } + interface EwsStripeBarAttributes { + "color": string; + "orientation": string; + "loop": boolean; + "reverse": boolean; + "duration": number; + "size": string; + } + interface MyComponentAttributes { + "first": string; + "middle": string; + "last": string; + } + + interface IntrinsicElements { + "ews-card": Omit & { [K in keyof EwsCard & keyof EwsCardAttributes]?: EwsCard[K] } & { [K in keyof EwsCard & keyof EwsCardAttributes as `attr:${K}`]?: EwsCardAttributes[K] } & { [K in keyof EwsCard & keyof EwsCardAttributes as `prop:${K}`]?: EwsCard[K] }; + "ews-hex-grid": Omit & { [K in keyof EwsHexGrid & keyof EwsHexGridAttributes]?: EwsHexGrid[K] } & { [K in keyof EwsHexGrid & keyof EwsHexGridAttributes as `attr:${K}`]?: EwsHexGridAttributes[K] } & { [K in keyof EwsHexGrid & keyof EwsHexGridAttributes as `prop:${K}`]?: EwsHexGrid[K] }; + "ews-hex-shape": Omit & { [K in keyof EwsHexShape & keyof EwsHexShapeAttributes]?: EwsHexShape[K] } & { [K in keyof EwsHexShape & keyof EwsHexShapeAttributes as `attr:${K}`]?: EwsHexShapeAttributes[K] } & { [K in keyof EwsHexShape & keyof EwsHexShapeAttributes as `prop:${K}`]?: EwsHexShape[K] }; + "ews-rib-layout": Omit & { [K in keyof EwsRibLayout & keyof EwsRibLayoutAttributes]?: EwsRibLayout[K] } & { [K in keyof EwsRibLayout & keyof EwsRibLayoutAttributes as `attr:${K}`]?: EwsRibLayoutAttributes[K] } & { [K in keyof EwsRibLayout & keyof EwsRibLayoutAttributes as `prop:${K}`]?: EwsRibLayout[K] }; + "ews-stripe-bar": Omit & { [K in keyof EwsStripeBar & keyof EwsStripeBarAttributes]?: EwsStripeBar[K] } & { [K in keyof EwsStripeBar & keyof EwsStripeBarAttributes as `attr:${K}`]?: EwsStripeBarAttributes[K] } & { [K in keyof EwsStripeBar & keyof EwsStripeBarAttributes as `prop:${K}`]?: EwsStripeBar[K] }; + "my-component": Omit & { [K in keyof MyComponent & keyof MyComponentAttributes]?: MyComponent[K] } & { [K in keyof MyComponent & keyof MyComponentAttributes as `attr:${K}`]?: MyComponentAttributes[K] } & { [K in keyof MyComponent & keyof MyComponentAttributes as `prop:${K}`]?: MyComponent[K] }; + } +} +export { LocalJSX as JSX }; +declare module "@stencil/core" { + export namespace JSX { + interface IntrinsicElements { + "ews-card": LocalJSX.IntrinsicElements["ews-card"] & JSXBase.HTMLAttributes; + "ews-hex-grid": LocalJSX.IntrinsicElements["ews-hex-grid"] & JSXBase.HTMLAttributes; + "ews-hex-shape": LocalJSX.IntrinsicElements["ews-hex-shape"] & JSXBase.HTMLAttributes; + "ews-rib-layout": LocalJSX.IntrinsicElements["ews-rib-layout"] & JSXBase.HTMLAttributes; + "ews-stripe-bar": LocalJSX.IntrinsicElements["ews-stripe-bar"] & JSXBase.HTMLAttributes; + "my-component": LocalJSX.IntrinsicElements["my-component"] & JSXBase.HTMLAttributes; + } + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.cmp.test.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.cmp.test.tsx new file mode 100644 index 0000000..20e65bd --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.cmp.test.tsx @@ -0,0 +1,9 @@ +import { render, h, describe, it, expect } from '@stencil/vitest'; + +describe('ews-card', () => { + it('renders', async () => { + const { root } = await render(); + await expect(root).toBeDefined(); + await expect(root.querySelector('.ews-card')).not.toBeNull(); + }); +}); diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.css b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.css new file mode 100644 index 0000000..9cefdff --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.css @@ -0,0 +1,136 @@ +.ews-card { + --ews-card-color: var(--orange, #fa0); + --ews-card-radius: var(--gutter-size, 8px); + --ews-card-border-width: 3px; + background-color: black; + transition: 0.3s; + + border-radius: var(--ews-card-radius); + border-style: solid; + border-width: var(--ews-card-border-width); + border-color: var(--ews-card-color); +} + +.ews-card.ews-card-red { + --ews-card-color: var(--red, #f23); +} + +.ews-card-header { + /* padding: 6px; */ + color: var(--ews-card-color); + position: relative; + border-radius: 10px 10px 0px 0px; + border-bottom: var(--ews-card-border-width) solid var(--ews-card-color); +} + +.ews-card-header .ews-card-text { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + display: flex; + justify-content: center; + align-items: center; +} + +.ews-card-header button { + cursor: pointer; +} + +.ews-card-footer { + /* padding: 6px; */ + color: var(--ews-card-color); + position: relative; + border-radius: 0px 0px 10px 10px; + border-top: var(--ews-card-border-width) solid var(--ews-card-color); +} + +.ews-card-footer .ews-card-text { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + display: flex; + justify-content: center; + align-items: center; +} + +.ews-card-content { + color: var(--ews-card-color); +} + + +.ews-card-content::-webkit-scrollbar-track { + -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); + border-radius: 10px; + background-color: rgb(61, 61, 61); +} + +.ews-card-content::-webkit-scrollbar { + width: 12px; + height: 12px; + background-color: rgb(61, 61, 61); +} + +.ews-card-content::-webkit-scrollbar-thumb { + border-radius: 10px; + -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); + background-color: var(--red); +} + +.ews-card-content tbody { + font-size: 10px !important; +} + +.ews-card-float { + transition: all 0.3s ease-in-out; +} + +.ews-card-float .ews-card-content { + display: block; + max-height: 45vh; + overflow-y: auto; + overflow-x: hidden; +} + +.ews-card-close-button { + font-size: 24px; + color: #e60003; + padding: 2px 4px; + background-color: black !important; + right: 10px !important; + top: 10px !important; +} + +@media (max-width: 768px) { + + .ews-card { + --ews-card-border-width: 1px; + } + + .ews-card-float .ews-card-content { + display: none; + padding: 0px; + } + + .ews-card-float.open .ews-card-content { + display: block; + padding: 6px; + } + + .ews-card-float { + margin: auto; + right: 0.25rem; + left: 0.25rem; + } + + .ews-card-float .ews-card-header { + border-bottom: unset; + } + + .ews-card-header { + cursor: pointer; + } +} \ No newline at end of file diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.tsx new file mode 100644 index 0000000..c7565b0 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/ews-card.tsx @@ -0,0 +1,98 @@ +import { Component, Prop, State, Event, EventEmitter, Element, h } from '@stencil/core'; + +@Component({ + tag: 'ews-card', + styleUrl: 'ews-card.css', + shadow: false, +}) +export class EwsCard { + @Element() el: HTMLElement; + + /** + * Additional CSS classes to apply to the card wrapper + */ + @Prop() customClass: string = ''; + + + /** + * Custom color for border and content (red or orange) + */ + @Prop() color?: string; + + /** + * Inline style + */ + @Prop() customStyle?: string; + + /** + * Tracks whether the card content is toggled open + */ + @State() open: boolean = false; + + @State() hasHeader: boolean = false; + @State() hasFooter: boolean = false; + + /** + * Emitted when the card toggles open/close state + */ + @Event() toggle: EventEmitter; + + componentWillLoad() { + this.checkSlots(); + } + + componentDidLoad() { + this.checkSlots(); + } + + componentDidUpdate() { + this.checkSlots(); + } + + private checkSlots() { + if (!this.el) return; + const headerSlot = !!this.el.querySelector('[slot="header"]'); + const footerSlot = !!this.el.querySelector('[slot="footer"]'); + + if (this.hasHeader !== headerSlot) { + this.hasHeader = headerSlot; + } + if (this.hasFooter !== footerSlot) { + this.hasFooter = footerSlot; + } + } + + private handleToggle = () => { + this.open = !this.open; + this.toggle.emit(); + }; + + render() { + return ( +
+ {this.hasHeader && ( +
+ +
+ )} + +
+ + +
+ + {this.hasFooter && ( +
+ +
+ )} +
+ ); + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/readme.md b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/readme.md new file mode 100644 index 0000000..b5f7a83 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-card/readme.md @@ -0,0 +1,26 @@ +# ews-card + + + + + + +## Properties + +| Property | Attribute | Description | Type | Default | +| ------------- | -------------- | --------------------------------------------------- | -------- | ----------- | +| `color` | `color` | Custom color for border and content (red or orange) | `string` | `undefined` | +| `customClass` | `custom-class` | Additional CSS classes to apply to the card wrapper | `string` | `''` | +| `customStyle` | `custom-style` | Inline style | `string` | `undefined` | + + +## Events + +| Event | Description | Type | +| -------- | ---------------------------------------------- | ------------------- | +| `toggle` | Emitted when the card toggles open/close state | `CustomEvent` | + + +---------------------------------------------- + +*Built with [StencilJS](https://stenciljs.com/)* diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/ews-hex-grid.css b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/ews-hex-grid.css new file mode 100644 index 0000000..a4470f7 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/ews-hex-grid.css @@ -0,0 +1,240 @@ +/* ============================================= + HEXAGONAL GRID STYLES + ============================================= */ + +/* --- Shared hex clip-path (flat-top orientation) --- */ +.ews-hex-clip { + clip-path: polygon(24.96% 100%, + 0% 50%, + 24.96% 0%, + 74.87% 0%, + 99.84% 50%, + 74.87% 100%); +} + +/* --- Shared hex clip-path (pointy-top / rotated 90°) --- */ +.ews-hex-clip-pointy { + clip-path: polygon(0% 25.13%, + 50% 0%, + 100% 25.13%, + 100% 74.87%, + 50% 100%, + 0% 74.87%); +} + +/* ---- 1. Basic Flat Hex Grid ---- */ +:host .ews-hex-grid-flat { + display: flex; + flex-wrap: wrap; + gap: 6px; + align-items: center; +} + +::slotted(.ews-hex-cell-flat) { + position: relative; + width: 80px; + height: 70px; + aspect-ratio: 584 / 507; + clip-path: polygon(24.96% 100%, 0% 50%, 24.96% 0%, 74.87% 0%, 99.84% 50%, 74.87% 100%); + background-color: rgba(255, 170, 0, 0.08); + border: none; + display: flex; + align-items: center; + justify-content: center; + transition: background-color 0.25s ease, transform 0.2s ease; + cursor: default; +} + +::slotted(.ews-hex-cell-flat:hover) { + background-color: rgba(255, 170, 0, 0.18); + transform: scale(1.06); +} + +::slotted(.ews-hex-cell-flat.ews-hex-danger) { + background-color: rgba(255, 34, 51, 0.15); + box-shadow: 0 0 12px 2px rgba(255, 34, 51, 0.3); +} + +::slotted(.ews-hex-cell-flat.ews-hex-warn) { + background-color: rgba(255, 170, 0, 0.15); + box-shadow: 0 0 10px 2px rgba(255, 170, 0, 0.25); +} + +::slotted(.ews-hex-cell-flat.ews-hex-safe) { + background-color: rgba(0, 200, 80, 0.12); + box-shadow: 0 0 8px 1px rgba(0, 200, 80, 0.2); +} + +.ews-hex-content { + position: relative; + z-index: 1; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 2px; + color: var(--orange); + text-align: center; +} + +/* ---- 2. Honeycomb Offset Grid ---- */ +.ews-hex-honeycomb { + display: flex; + flex-direction: column; + gap: 0; +} + +:host .ews-hex-row { + display: flex; + flex-direction: row; + gap: 4px; +} + +:host .ews-hex-row-offset { + margin-left: calc(72px / 2 + 2px); + margin-top: -14px; +} + +::slotted(.ews-hex-hive) { + position: relative; + width: 72px; + height: 83px; + display: flex; + align-items: center; + justify-content: center; + transition: transform 0.2s ease, background-color 0.2s ease; +} + +::slotted(.ews-hex-hive.ews-hex-danger) { + background-color: rgba(255, 34, 51, 0.18); + filter: drop-shadow(0 0 8px rgba(255, 34, 51, 0.5)); +} + +::slotted(.ews-hex-hive.ews-hex-warn) { + background-color: rgba(255, 170, 0, 0.18); + filter: drop-shadow(0 0 6px rgba(255, 170, 0, 0.4)); +} + +.ews-hex-hive-inner { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 1px; + text-align: center; + color: var(--orange); +} + +/* ---- 3. Animated Status Hex Cells ---- */ +::slotted(.ews-hex-status-cell) { + position: relative; + width: 90px; + height: 104px; + clip-path: polygon(0% 25.13%, 50% 0%, 100% 25.13%, 100% 74.87%, 50% 100%, 0% 74.87%); + background-color: rgba(255, 170, 0, 0.06); + display: flex; + align-items: center; + justify-content: center; + transition: transform 0.25s ease; +} + +::slotted(.ews-hex-status-cell:hover) { + transform: scale(1.08); +} + +::slotted(.ews-hex-status-cell.ews-hex-danger) { + background-color: rgba(255, 34, 51, 0.12); + filter: drop-shadow(0 0 10px rgba(255, 34, 51, 0.45)); +} + +::slotted(.ews-hex-status-cell.ews-hex-warn) { + background-color: rgba(255, 170, 0, 0.12); + filter: drop-shadow(0 0 8px rgba(255, 170, 0, 0.4)); +} + +::slotted(.ews-hex-status-cell.ews-hex-caution) { + background-color: rgba(255, 255, 0, 0.08); + filter: drop-shadow(0 0 6px rgba(255, 255, 0, 0.25)); +} + +::slotted(.ews-hex-status-cell.ews-hex-safe) { + background-color: rgba(0, 200, 80, 0.08); + filter: drop-shadow(0 0 6px rgba(0, 200, 80, 0.2)); +} + +::slotted(.ews-hex-status-cell.ews-hex-pulse) { + animation: hexPulse 1.4s ease-in-out infinite; +} + +@keyframes hexPulse { + + 0%, + 100% { + filter: drop-shadow(0 0 8px rgba(255, 34, 51, 0.3)); + } + + 50% { + filter: drop-shadow(0 0 22px rgba(255, 34, 51, 0.85)); + } +} + +.ews-hex-status-inner { + position: relative; + z-index: 1; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + gap: 2px; + color: var(--orange); +} + +/* ---- 4. Hex with Strip Decoration ---- */ +::slotted(.ews-hex-stripe-cell) { + position: relative; + width: 110px; + height: 127px; + clip-path: polygon(0% 25.13%, 50% 0%, 100% 25.13%, 100% 74.87%, 50% 100%, 0% 74.87%); + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + background-color: rgba(255, 170, 0, 0.05); + transition: transform 0.2s ease; +} + +::slotted(.ews-hex-stripe-cell:hover) { + transform: scale(1.06); +} + +::slotted(.ews-hex-stripe-cell.ews-hex-danger) { + background-color: rgba(255, 34, 51, 0.08); +} + +.ews-hex-stripe-bg { + position: relative; + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; +} + +.ews-hex-stripe-content { + position: relative; + z-index: 2; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + gap: 1px; + color: var(--orange); + background-color: rgba(0, 0, 0, 0.55); + padding: 6px 10px; + clip-path: polygon(0% 25.13%, 50% 0%, 100% 25.13%, 100% 74.87%, 50% 100%, 0% 74.87%); + width: 88%; + height: 88%; +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/ews-hex-grid.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/ews-hex-grid.tsx new file mode 100644 index 0000000..a0f0ce4 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/ews-hex-grid.tsx @@ -0,0 +1,193 @@ +import { Component, Host, h, Prop, Element, Watch, State } from '@stencil/core'; + +@Component({ + tag: 'ews-hex-grid', + styleUrl: 'ews-hex-grid.css', + shadow: true, +}) +export class EwsHexGrid { + /** + * Additional CSS class for the container. + */ + @Prop() customClass: string = ''; + + /** + * Hex orientation variant: 'pointy' or 'flat'. + */ + @Prop() variant: 'pointy' | 'flat' = 'pointy'; + + /** + * Width of each hex cell in pixels. + */ + @Prop() hexWidth: number; + + /** + * Height of each hex cell in pixels. + */ + @Prop() hexHeight: number; + + /** + * Gap between hex cells in pixels. + */ + @Prop() gap: number = 4; + + @Element() el: HTMLElement; + + @State() containerHeight: string = 'auto'; + + private ro: ResizeObserver; + private mo: MutationObserver; + + componentDidLoad() { + this.setupLayout(); + } + + disconnectedCallback() { + if (this.ro) this.ro.disconnect(); + if (this.mo) this.mo.disconnect(); + } + + @Watch('variant') + @Watch('hexWidth') + @Watch('hexHeight') + @Watch('gap') + onPropChange() { + this.layout(); + } + + private setupLayout() { + // Delay initial layout to next tick to ensure styles are computed + setTimeout(() => this.layout(), 0); + + this.ro = new ResizeObserver(() => this.layout()); + this.ro.observe(this.el); + + const slot = this.el.shadowRoot.querySelector('slot'); + if (slot) { + slot.addEventListener('slotchange', () => this.layout()); + } + + this.mo = new MutationObserver(() => this.layout()); + this.mo.observe(this.el, { childList: true }); + } + + private layout() { + const container = this.el.shadowRoot.querySelector('.ews-hex-honeycomb') as HTMLElement; + if (!container) return; + + const containerWidth = container.clientWidth; + if (!containerWidth) return; + + const slot = container.querySelector('slot') as HTMLSlotElement; + if (!slot) return; + + const childElements = slot.assignedElements() as HTMLElement[]; + if (childElements.length === 0) return; + + const isFlat = this.variant === 'flat'; + const w = this.hexWidth ?? (isFlat ? 83 : 72); + const h = this.hexHeight ?? (isFlat ? 72 : 83); + const gap = this.gap; + + if (!isFlat) { + // Pointy (Variant 1) + const rowOffsetTop = gap + -20; + const itemFullWidth = w + gap; + + let maxCols = Math.floor((containerWidth + gap) / itemFullWidth); + if (maxCols < 1) maxCols = 1; + + let isOffset = false; + let currentCol = 0; + let currentRow = 0; + + for (let i = 0; i < childElements.length; i++) { + const child = childElements[i]; + const colsInThisRow = isOffset ? Math.max(1, maxCols - 1) : maxCols; + + let x = currentCol * itemFullWidth; + if (isOffset) { + x += w / 2 + gap / 2; + } + + const y = currentRow * (h + rowOffsetTop); + + child.style.position = 'absolute'; + child.style.left = `${x}px`; + child.style.top = `${y}px`; + child.style.margin = '0'; + child.style.width = `${w}px`; + child.style.height = `${h}px`; + + currentCol++; + if (currentCol >= colsInThisRow) { + currentCol = 0; + isOffset = !isOffset; + currentRow++; + } + } + + let totalHeight = 0; + if (currentCol > 0) { + totalHeight = currentRow * (h + rowOffsetTop) + h; + } else { + totalHeight = (currentRow - 1) * (h + rowOffsetTop) + h; + } + this.containerHeight = `${totalHeight}px`; + } else { + // Flat (Variant 2) + const colAdvanceX = w * 0.75 + gap; + const rowAdvanceY = h + gap; + + let maxCols = Math.floor((containerWidth - w) / colAdvanceX) + 1; + if (containerWidth < w) maxCols = 1; + + let currentCol = 0; + let currentRow = 0; + let maxBottom = 0; + + for (let i = 0; i < childElements.length; i++) { + const child = childElements[i]; + + let x = currentCol * colAdvanceX; + let y = currentRow * rowAdvanceY; + + // Offset odd columns down + if (currentCol % 2 === 1) { + y += rowAdvanceY / 2; + } + + child.style.position = 'absolute'; + child.style.left = `${x}px`; + child.style.top = `${y}px`; + child.style.margin = '0'; + child.style.width = `${w}px`; + child.style.height = `${h}px`; + + const bottom = y + h; + if (bottom > maxBottom) maxBottom = bottom; + + currentCol++; + if (currentCol >= maxCols) { + currentCol = 0; + currentRow++; + } + } + + this.containerHeight = `${maxBottom}px`; + } + } + + render() { + return ( + +
+ +
+ + ); + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/readme.md b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/readme.md new file mode 100644 index 0000000..c24838d --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-grid/readme.md @@ -0,0 +1,21 @@ +# ews-hex-grid + + + + + + +## Properties + +| Property | Attribute | Description | Type | Default | +| ------------- | -------------- | -------------------------------------------- | -------------------- | ----------- | +| `customClass` | `custom-class` | Additional CSS class for the container. | `string` | `''` | +| `gap` | `gap` | Gap between hex cells in pixels. | `number` | `4` | +| `hexHeight` | `hex-height` | Height of each hex cell in pixels. | `number` | `undefined` | +| `hexWidth` | `hex-width` | Width of each hex cell in pixels. | `number` | `undefined` | +| `variant` | `variant` | Hex orientation variant: 'pointy' or 'flat'. | `"flat" \| "pointy"` | `'pointy'` | + + +---------------------------------------------- + +*Built with [StencilJS](https://stenciljs.com/)* diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/ews-hex-shape.css b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/ews-hex-shape.css new file mode 100644 index 0000000..7def295 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/ews-hex-shape.css @@ -0,0 +1,84 @@ +:host { + display: block; + width: 100%; +} + +.ews-hex-shape { + position: relative; + width: 100%; + aspect-ratio: 0.866 / 1; + background-image: url("data:image/svg+xml,%3Csvg width='115' height='133' viewBox='0 0 115 133' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M115 99.1859L57.5 132.25L7.62939e-06 99.1859L7.62939e-06 33.0641L57.5 3.05176e-05L115 33.0641L115 99.1859Z' fill='%23fa0'/%3E%3Cpath d='M113.69 98.4426L57.6307 130.678L1.57149 98.4426L1.57149 33.9776L57.6307 1.74199L113.69 33.9776L113.69 98.4426Z' fill='black'/%3E%3Cpath d='M111.071 97.0671L57.6309 127.796L4.1913 97.0671L4.1913 35.6145L57.6309 4.88519L111.071 35.6145L111.071 97.0671Z' fill='%23fa0'/%3E%3C/svg%3E%0A"); + background-size: contain; + background-position: center; + background-repeat: no-repeat; + --polygon-shape: polygon(0% 25.13%, + /* top-left point */ + 50% 0%, + /* top center point */ + 100% 25.13%, + /* top-right point */ + 100% 74.87%, + /* bottom-right point */ + 50% 100%, + /* bottom center point */ + 0% 74.87% + /* bottom-left point */ + ); + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + +} + +.ews-hex-shape.clip-content { + overflow: hidden; + clip-path: var(--polygon-shape); +} + +.ews-hex-shape.clip-content .inner-content { + --ews-hex-padding: 10px; + width: calc(100% - var(--ews-hex-padding)); + height: calc(100% - var(--ews-hex-padding)); + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; + clip-path: var(--polygon-shape); +} + +.ews-hex-shape.flat-top { + aspect-ratio: 1.1547 / 1; + background-image: url("data:image/svg+xml,%3Csvg width='584' height='507' viewBox='0 0 584 507' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M145.77 507L0 253.5L145.77 -3.05176e-05H437.28L583.05 253.5L437.28 507H145.77Z' fill='%23E60003'/%3E%3Cpath d='M149.046 500.648L6.92932 253.5L149.046 6.35181H433.253L575.37 253.5L433.253 500.648H149.046Z' fill='black'/%3E%3Cpath d='M155.007 492L18 253.5L155.007 15H428.993L566 253.5L428.993 492H155.007Z' fill='%23E60003'/%3E%3C/svg%3E%0A"); + --polygon-shape: polygon(24.96% 100%, + /* 145.77/584, 507/507 */ + 0% 50%, + /* 0/584, 253.5/507 */ + 24.96% 0%, + /* 145.77/584, 0/507 */ + 74.87% 0%, + /* 437.28/584, 0/507 */ + 99.84% 50%, + /* 583.05/584, 253.5/507 */ + 74.87% 100% + /* 437.28/584, 507/507 */ + ); + +} + +.ews-hex-shape.orange { + background-image: url("data:image/svg+xml,%3Csvg width='115' height='133' viewBox='0 0 115 133' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M115 99.1859L57.5 132.25L7.62939e-06 99.1859L7.62939e-06 33.0641L57.5 3.05176e-05L115 33.0641L115 99.1859Z' fill='%23fa0'/%3E%3Cpath d='M113.69 98.4426L57.6307 130.678L1.57149 98.4426L1.57149 33.9776L57.6307 1.74199L113.69 33.9776L113.69 98.4426Z' fill='black'/%3E%3Cpath d='M111.071 97.0671L57.6309 127.796L4.1913 97.0671L4.1913 35.6145L57.6309 4.88519L111.071 35.6145L111.071 97.0671Z' fill='%23fa0'/%3E%3C/svg%3E%0A"); +} + +.ews-hex-shape.orange.flat-top { + background-image: url("data:image/svg+xml,%3Csvg width='584' height='507' viewBox='0 0 584 507' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M145.77 507L0 253.5L145.77 -3.05176e-05H437.28L583.05 253.5L437.28 507H145.77Z' fill='%23fa0'/%3E%3Cpath d='M149.046 500.648L6.92932 253.5L149.046 6.35181H433.253L575.37 253.5L433.253 500.648H149.046Z' fill='black'/%3E%3Cpath d='M155.007 492L18 253.5L155.007 15H428.993L566 253.5L428.993 492H155.007Z' fill='%23fa0'/%3E%3C/svg%3E%0A"); +} + +.ews-hex-shape.red { + background-image: url("data:image/svg+xml,%3Csvg width='115' height='133' viewBox='0 0 115 133' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M115 99.1859L57.5 132.25L7.62939e-06 99.1859L7.62939e-06 33.0641L57.5 3.05176e-05L115 33.0641L115 99.1859Z' fill='%23E60003'/%3E%3Cpath d='M113.69 98.4426L57.6307 130.678L1.57149 98.4426L1.57149 33.9776L57.6307 1.74199L113.69 33.9776L113.69 98.4426Z' fill='black'/%3E%3Cpath d='M111.071 97.0671L57.6309 127.796L4.1913 97.0671L4.1913 35.6145L57.6309 4.88519L111.071 35.6145L111.071 97.0671Z' fill='%23E60003'/%3E%3C/svg%3E%0A"); +} + +.ews-hex-shape.red.flat-top { + background-image: url("data:image/svg+xml,%3Csvg width='584' height='507' viewBox='0 0 584 507' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M145.77 507L0 253.5L145.77 -3.05176e-05H437.28L583.05 253.5L437.28 507H145.77Z' fill='%23E60003'/%3E%3Cpath d='M149.046 500.648L6.92932 253.5L149.046 6.35181H433.253L575.37 253.5L433.253 500.648H149.046Z' fill='black'/%3E%3Cpath d='M155.007 492L18 253.5L155.007 15H428.993L566 253.5L428.993 492H155.007Z' fill='%23E60003'/%3E%3C/svg%3E%0A"); +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/ews-hex-shape.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/ews-hex-shape.tsx new file mode 100644 index 0000000..e937578 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/ews-hex-shape.tsx @@ -0,0 +1,56 @@ +import { Component, Host, h, Prop } from '@stencil/core'; + +@Component({ + tag: 'ews-hex-shape', + styleUrl: 'ews-hex-shape.css', + shadow: true, +}) +export class EwsHexShape { + /** + * Additional CSS classes for the component. + */ + @Prop() customClass: string = ''; + + /** + * The color variant of the hex shape. + */ + @Prop() color: string = 'orange'; + + /** + * Whether the hex shape has a flat top. + */ + @Prop() flatTop: boolean = true; + + /** + * Whether to clip content within the hex shape. + */ + @Prop() clipContent: boolean = false; + + /** + * The padding inside the hex shape for content. + */ + @Prop() paddingContent: number = 10; + + render() { + const classes = { + 'ews-hex-shape': true, + 'flat-top': this.flatTop, + 'clip-content': this.clipContent, + [this.color]: !!this.color, + [this.customClass]: !!this.customClass, + }; + + return ( + +
+
+ +
+
+ + ); + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/readme.md b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/readme.md new file mode 100644 index 0000000..524b245 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-hex-shape/readme.md @@ -0,0 +1,21 @@ +# ews-hex-shape + + + + + + +## Properties + +| Property | Attribute | Description | Type | Default | +| ---------------- | ----------------- | --------------------------------------------- | --------- | ---------- | +| `clipContent` | `clip-content` | Whether to clip content within the hex shape. | `boolean` | `false` | +| `color` | `color` | The color variant of the hex shape. | `string` | `'orange'` | +| `customClass` | `custom-class` | Additional CSS classes for the component. | `string` | `''` | +| `flatTop` | `flat-top` | Whether the hex shape has a flat top. | `boolean` | `true` | +| `paddingContent` | `padding-content` | The padding inside the hex shape for content. | `number` | `10` | + + +---------------------------------------------- + +*Built with [StencilJS](https://stenciljs.com/)* diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/ews-rib-layout.css b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/ews-rib-layout.css new file mode 100644 index 0000000..4932f18 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/ews-rib-layout.css @@ -0,0 +1,276 @@ +:host { + display: block; +} + +.ews-rib-layout { + display: inline-flex; + height: auto; + justify-content: center; + gap: 1rem; + width: 100%; + padding-left: 1rem; + padding-right: 1rem; + position: relative; + box-sizing: border-box; +} + +.ews-rib-layout__branch { + position: relative; + padding-top: 1rem; + padding-bottom: 1rem; + display: flex; + flex-direction: column; + gap: 1rem; +} + +@media (min-width: 1024px) { + .ews-rib-layout__branch { + padding-top: 2.5rem; + padding-bottom: 2.5rem; + } +} + +.ews-rib-layout__spine { + position: absolute; + height: auto; + left: 50%; + top: 0; + bottom: 0; + width: 0.25rem; + transform: translateX(-50%); + z-index: 0; + background-color: var(--orange, #FC8416); +} + +.ews-rib-layout__grid { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + position: relative; + z-index: 10; +} + +.ews-rib-layout__node { + display: flex; + align-items: center; + position: relative; + text-decoration: none; + color: inherit; +} + +.ews-rib-layout__node--left { + flex-grow: 1; + justify-content: flex-end; + padding-right: 0; + grid-column-start: 1; +} + +.ews-rib-layout__node--right { + justify-content: flex-start; + padding-left: 0; + grid-column-start: 2; + width: auto; +} + +.ews-rib-layout__node-content { + position: relative; + display: flex; +} + +.ews-rib-layout__connector-wrapper { + width: 6rem; + display: flex; + position: relative; +} + +.ews-rib-layout__connector-wrapper--left { + justify-content: flex-end; +} + +.ews-rib-layout__connector-wrapper--right { + justify-content: flex-start; +} + +.ews-rib-layout__connector-line { + height: 2px; + width: 6rem; + z-index: 0; + background-color: var(--orange, #FC8416); +} + +.ews-rib-layout__connector-text { + font-weight: 700; + font-size: 0.75rem; + line-height: 1rem; + text-transform: uppercase; + position: absolute; + top: 0.25rem; + z-index: 10; + color: var(--orange, #FC8416); +} + +.ews-rib-layout__connector-text--left { + left: 0.5rem; + text-align: left; +} + +.ews-rib-layout__connector-text--right { + right: 0.5rem; + text-align: right; +} + +.ews-rib-node { + --bg-url: url('data:image/svg+xml,'); + background-image: var(--bg-url); + background-size: contain; + background-position: center; + background-repeat: no-repeat; + position: relative; + z-index: 1; + width: 6rem; + height: 1.5rem; + display: flex; + flex-grow: 1; + flex-direction: column; + align-items: center; + justify-content: center; + margin-top: 1.5rem; + margin-right: -0.5rem; +} + +.parent-node { + transform: translateX(0px); + rotate: -21deg !important; + transition: all 0.2s ease-in-out; + margin-left: 0px; + z-index: 1; +} + +.parent-node.flip { + margin-left: -0.5rem; + rotate: 21deg !important; +} + +.ews-rib-layout__node--left:hover .parent-node { + cursor: pointer; + transform: translateX(-20px); +} + +.ews-rib-node.danger { + --bg-url: url('data:image/svg+xml,'); +} + +.ews-rib-node.flip { + --bg-url: url('data:image/svg+xml,'); +} + +.ews-rib-layout__node--right:hover .parent-node { + cursor: pointer; + transform: translateX(20px); +} + +.ews-rib-node.flip.danger { + --bg-url: url('data:image/svg+xml,'); +} + +.ews-rib-node.slide-fade-in { + opacity: 0; + transform: translateX(-20px); + animation: slideFadeIn 0.5s ease-in-out forwards; +} + +.ews-rib-node-flip.slide-fade-in { + opacity: 0; + transform: translateX(20px); + animation: slideFadeInFlip 0.5s ease-in-out forwards; +} + +.slide-fade-in { + animation: slideFadeIn 0.5s ease-in-out forwards; +} + +@keyframes slideFadeIn { + 0% { + opacity: 0; + transform: translateX(-20px); + } + + 50% { + opacity: 1; + transform: translateX(-15px); + } + + 100% { + opacity: 1; + transform: translateX(0); + } +} + +.slide-fade-in-flip { + animation: slideFadeInFlip 0.5s ease-in-out forwards; +} + +@keyframes slideFadeInFlip { + 0% { + opacity: 0; + transform: translateX(20px); + } + + 50% { + opacity: 1; + transform: translateX(15px); + } + + 100% { + opacity: 1; + transform: translateX(0); + } +} + +.fade-in { + opacity: 0; + animation: fadeIn 0.5s ease-in-out forwards; +} + +@keyframes fadeIn { + from { + opacity: 0; + } + + to { + opacity: 1; + } +} + +.animation-delay-5 { + animation-delay: 500ms; +} + +.line-node { + width: 0%; + animation: slideWidth 0.5s ease-in-out forwards; +} + +@keyframes slideWidth { + 0% { + width: 0%; + } + + 100% { + width: 6rem; + } +} + +.line-central { + height: 0%; + animation: slideHeight 0.5s ease-in-out forwards; +} + +@keyframes slideHeight { + 0% { + height: 0%; + } + + 100% { + height: 100%; + } +} \ No newline at end of file diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/ews-rib-layout.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/ews-rib-layout.tsx new file mode 100644 index 0000000..8019469 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/ews-rib-layout.tsx @@ -0,0 +1,188 @@ +import { Component, Host, h, Prop, State, Listen } from '@stencil/core'; + +@Component({ + tag: 'ews-rib-layout', + styleUrl: 'ews-rib-layout.css', + shadow: true, +}) +export class EwsRibLayout { + /** + * Array of items to be displayed in the rib cage layout. + */ + @Prop() items: any[] = []; + + /** + * Function to get the href for a node. If provided, nodes will be rendered as tags. + */ + @Prop() getHref?: (item: any) => string; + + /** + * Optional renderer function for the node content. + */ + @Prop() nodeRenderer?: (item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) => any; + + /** + * Optional renderer function for the connector content. + */ + @Prop() connectorRenderer?: (item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) => any; + + /** + * Maximum number of branches to display. If not provided, it defaults to 5 (responsive). + */ + @Prop() maxBranches?: number; + + @State() branchCount: number = 5; + @State() windowWidth: number = 0; + + componentWillLoad() { + this.handleResize(); + } + + @Listen('resize', { target: 'window' }) + handleResize() { + this.windowWidth = typeof window !== 'undefined' ? window.innerWidth : 0; + this.branchCount = this.getBranchCount(this.windowWidth); + } + + private getBranchCount(width: number): number { + let count = 5; + if (width < 768) count = 1; + else if (width < 1024) count = 2; + else if (width < 1300) count = 4; + + if (this.maxBranches && this.maxBranches > 0) { + return Math.min(count, this.maxBranches); + } + return count; + } + + private get chunkedItems() { + if (!this.items || this.items.length === 0) return []; + const count = Math.max(1, this.branchCount); + const result = []; + const itemsPerBranch = Math.ceil(this.items.length / count); + + for (let i = 0; i < this.items.length; i += itemsPerBranch) { + result.push(this.items.slice(i, i + itemsPerBranch)); + } + return result; + } + + private renderNodeContent(item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) { + if (this.nodeRenderer) { + const content = this.nodeRenderer(item, props); + + // Handle HTMLElement return (common in plain JS) + if (content instanceof HTMLElement) { + return
{ + if (el) { + el.innerHTML = ''; + el.appendChild(content); + } + }}>
; + } + + // Handle string return (simple HTML) + if (typeof content === 'string') { + return
; + } + + return content; + } + + // Default rendering if no renderer is provided + const isDanger = item.type === 'danger'; + return ( +
+ {item.label || item.name || item.value || 'Node'} +
+ ); + } + + private renderConnectorContent(item: any, props: { side: 'left' | 'right'; branchIndex: number; index: number; delay: number }) { + if (this.connectorRenderer) { + const content = this.connectorRenderer(item, props); + + const renderWrapper = (inner) => ( +
+ {inner} +
+ ); + + if (content instanceof HTMLElement) { + return renderWrapper(
{ + if (el) { + el.innerHTML = ''; + el.appendChild(content); + } + }}>
); + } + + if (typeof content === 'string') { + return renderWrapper(
); + } + + return renderWrapper(content); + } + return null; + } + + render() { + const chunked = this.chunkedItems; + + return ( + +
+ {chunked.map((branchItems, branchIndex) => ( +
+ {/* Central Spine */} +
+ +
+ {branchItems.map((item, index) => { + const side = index % 2 === 0 ? 'left' : 'right'; + const delay = (branchIndex + 1) * (index + 1) * 10; + const href = this.getHref?.(item); + const Tag = href ? 'a' : 'div'; + + return ( + + {side === 'left' ? ( + [ +
+ {this.renderNodeContent(item, { side, branchIndex, index, delay })} +
, +
+
+ {this.renderConnectorContent(item, { side, branchIndex, index, delay })} +
, + ] + ) : ( + [ +
+
+ {this.renderConnectorContent(item, { side, branchIndex, index, delay })} +
, +
+ {this.renderNodeContent(item, { side, branchIndex, index, delay })} +
, + ] + )} + + ); + })} +
+
+ ))} +
+ + ); + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/readme.md b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/readme.md new file mode 100644 index 0000000..d1ce473 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-rib-layout/readme.md @@ -0,0 +1,21 @@ +# ews-rib-layout + + + + + + +## Properties + +| Property | Attribute | Description | Type | Default | +| ------------------- | -------------- | -------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ | ----------- | +| `connectorRenderer` | -- | Optional renderer function for the connector content. | `(item: any, props: { side: "left" \| "right"; branchIndex: number; index: number; delay: number; }) => any` | `undefined` | +| `getHref` | -- | Function to get the href for a node. If provided, nodes will be rendered as tags. | `(item: any) => string` | `undefined` | +| `items` | -- | Array of items to be displayed in the rib cage layout. | `any[]` | `[]` | +| `maxBranches` | `max-branches` | Maximum number of branches to display. If not provided, it defaults to 5 (responsive). | `number` | `undefined` | +| `nodeRenderer` | -- | Optional renderer function for the node content. | `(item: any, props: { side: "left" \| "right"; branchIndex: number; index: number; delay: number; }) => any` | `undefined` | + + +---------------------------------------------- + +*Built with [StencilJS](https://stenciljs.com/)* diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/ews-stripe-bar.css b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/ews-stripe-bar.css new file mode 100644 index 0000000..caf21d6 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/ews-stripe-bar.css @@ -0,0 +1,219 @@ +:host { + display: block; +} + +.host-wrapper { + overflow: hidden; + width: 100%; + height: 100%; +} + +/* Strip Bar Styles */ +.ews-stripe-wrapper { + width: max(200vw, 2000px); + height: 30px; + overflow: hidden; + white-space: nowrap; + margin: 0px !important; + padding: 0px !important; + display: flex; +} + +.ews-stripe-wrapper.vertical { + height: 100%; + width: 30px; + display: flex; + flex-direction: column; +} + +.ews-stripe-bar { + width: max(200vw, 2000px); + height: 100%; + display: inline-block; + flex-shrink: 0; + margin-right: 0px !important; + margin-left: 0px !important; + --ews-stripe-color: var(--orange, #fa0); + --ews-stripe-size: 15px; + --ews-glow-color: rgba(255, 94, 0, 0.8); + --ews-glow-size: 3px; + background-image: repeating-linear-gradient(-45deg, + var(--ews-glow-color) calc(-1 * var(--ews-glow-size)), + var(--ews-stripe-color) 0, + var(--ews-stripe-color) calc(var(--ews-stripe-size) - var(--ews-glow-size) / 2), + var(--ews-glow-color) calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(2 * var(--ews-stripe-size)), + var(--ews-glow-color) calc(2 * var(--ews-stripe-size) - var(--ews-glow-size))); + background-size: 47px 47px; +} + +.ews-stripe-bar.red { + --ews-stripe-color: var(--red, #f23); + --ews-stripe-size: 15px; + --ews-glow-color: rgba(255, 17, 0, 0.8); + --ews-glow-size: 3px; +} + +.ews-stripe-bar.vertical { + width: 100%; + height: 100%; +} + +/* Include the legacy combined classes just in case */ +.ews-stripe-bar-red { + width: max(200vw, 2000px); + height: 30px; + display: inline-block; + flex-shrink: 0; + --ews-stripe-color: var(--red, #f23); + --ews-stripe-size: 15px; + --ews-glow-color: rgba(255, 17, 0, 0.8); + --ews-glow-size: 3px; + background-image: repeating-linear-gradient(-45deg, + var(--ews-glow-color) calc(-1 * var(--ews-glow-size)), + var(--ews-stripe-color) 0, + var(--ews-stripe-color) calc(var(--ews-stripe-size) - var(--ews-glow-size) / 2), + var(--ews-glow-color) calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(2 * var(--ews-stripe-size)), + var(--ews-glow-color) calc(2 * var(--ews-stripe-size) - var(--ews-glow-size))); +} + +.ews-stripe-bar-vertical { + height: max(2000px, 200vh); + transform: translate3d(0, 0, 0); + --ews-stripe-color: var(--orange, #fa0); + --ews-stripe-size: 15px; + --ews-glow-color: rgba(255, 94, 0, 0.8); + --ews-glow-size: 3px; + background-image: repeating-linear-gradient(45deg, + var(--ews-glow-color) calc(-1 * var(--ews-glow-size)), + var(--ews-stripe-color) 0, + var(--ews-stripe-color) calc(var(--ews-stripe-size) - var(--ews-glow-size) / 2), + var(--ews-glow-color) calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(2 * var(--ews-stripe-size)), + var(--ews-glow-color) calc(2 * var(--ews-stripe-size) - var(--ews-glow-size))); +} + +.ews-stripe-bar-red-vertical { + height: max(2000px, 200vh); + transform: translate3d(0, 0, 0); + --ews-stripe-color: var(--red, #f23); + --ews-stripe-size: 15px; + --ews-glow-color: rgba(255, 17, 0, 0.8); + --ews-glow-size: 3px; + background-image: repeating-linear-gradient(45deg, + var(--ews-glow-color) calc(-1 * var(--ews-glow-size)), + var(--ews-stripe-color) 0, + var(--ews-stripe-color) calc(var(--ews-stripe-size) - var(--ews-glow-size) / 2), + var(--ews-glow-color) calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(var(--ews-stripe-size) + var(--ews-glow-size) / 2), + transparent calc(2 * var(--ews-stripe-size)), + var(--ews-glow-color) calc(2 * var(--ews-stripe-size) - var(--ews-glow-size))); +} + +.ews-stripe-wrapper-vertical { + height: max(200vh, 2000px); + overflow: hidden; + white-space: nowrap; + margin: 0px !important; + padding: 0px !important; + display: flex; +} + +.ews-stripe { + background-color: black; + width: 100vw; + border-top: 1px solid var(--red, #f23); + border-bottom: 1px solid var(--red, #f23); + position: fixed; +} + +/* Animations */ +@keyframes loopStripVertical { + from { + background-position: 0px 0px; + } + + to { + background-position: 0px calc(-42.4264px * 47); + } +} + +@keyframes stripeAnimationVertical { + from { + background-position: 0px 0px; + } + + to { + background-position: 0px calc(-42.4264px * 47); + } +} + +@keyframes stripeAnimation { + from { + background-position: 0px 0px; + } + + to { + background-position: calc(-42.4264px * 47) 0px; + } +} + +@keyframes loopStrip { + from { + background-position: 0px 0px; + } + + to { + background-position: calc(-42.4264px * 47) 0px; + } +} + +.loop-stripe-vertical { + animation: stripeAnimationVertical 15s infinite linear; +} + +.loop-stripe-vertical.reverse { + animation: stripeAnimationVertical 15s infinite linear reverse; +} + +.loop-stripe-vertical-reverse { + animation: loopStripVertical 15s infinite linear reverse; +} + +.stripe-animation { + animation: stripeAnimation 10s infinite linear; +} + +.stripe-animation-reverse { + animation: stripeAnimation 10s infinite linear reverse; +} + +.loop-stripe { + animation: stripeAnimation infinite linear; + animation-duration: 10s; +} + +.loop-stripe.reverse { + animation: loopStrip infinite linear reverse; +} + +.loop-stripe-reverse { + animation: loopStrip infinite linear reverse; + animation-duration: 10s; +} + +.anim-duration-5 { + animation-duration: 5s !important; +} + +.anim-duration-10 { + animation-duration: 10s !important; +} + +.anim-duration-20 { + animation-duration: 20s !important; +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/ews-stripe-bar.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/ews-stripe-bar.tsx new file mode 100644 index 0000000..ee1ec1c --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/ews-stripe-bar.tsx @@ -0,0 +1,47 @@ +import { Component, Host, h, Prop } from '@stencil/core'; + +@Component({ + tag: 'ews-stripe-bar', + styleUrl: 'ews-stripe-bar.css', + shadow: true, +}) +export class EwsStripeBar { + @Prop() color: string = ''; + @Prop() orientation: string = ''; + @Prop() loop: boolean = false; + @Prop() reverse: boolean = false; + @Prop() duration: number = 10; + @Prop() size: string = '30px'; + + private getStripeClasses() { + const loopStr = this.loop ? 'loop-stripe' : ''; + const orientationStr = this.orientation ? `-${this.orientation}` : ''; + const combinedStr = loopStr + orientationStr; + + return [ + 'ews-stripe-bar', + this.color, + this.orientation, + combinedStr, + this.reverse ? 'reverse' : '', + `anim-duration-${this.duration}` + ].filter(c => c.trim() !== '').join(' '); + } + + render() { + return ( + +
+
+
+
+
+ +
+ + ); + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/readme.md b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/readme.md new file mode 100644 index 0000000..e71d4c9 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/ews-stripe-bar/readme.md @@ -0,0 +1,22 @@ +# ews-stripe-bar + + + + + + +## Properties + +| Property | Attribute | Description | Type | Default | +| ------------- | ------------- | ----------- | --------- | -------- | +| `color` | `color` | | `string` | `''` | +| `duration` | `duration` | | `number` | `10` | +| `loop` | `loop` | | `boolean` | `false` | +| `orientation` | `orientation` | | `string` | `''` | +| `reverse` | `reverse` | | `boolean` | `false` | +| `size` | `size` | | `string` | `'30px'` | + + +---------------------------------------------- + +*Built with [StencilJS](https://stenciljs.com/)* diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.cmp.test.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.cmp.test.tsx new file mode 100644 index 0000000..a3a2076 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.cmp.test.tsx @@ -0,0 +1,31 @@ +import { render, h, describe, it, expect } from '@stencil/vitest'; + +describe('my-component', () => { + it('renders', async () => { + const { root } = await render(); + await expect(root).toEqualHtml(` + + +
+ Hello, World! I'm +
+ + + `); + }); + + it('renders with values', async () => { + const { root } = await render( + , + ); + await expect(root).toEqualHtml(` + + +
+ Hello, World! I'm Stencil 'Don't call me a framework' JS +
+ + + `); + }); +}); diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.css b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.css new file mode 100644 index 0000000..5d4e87f --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.css @@ -0,0 +1,3 @@ +:host { + display: block; +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.tsx b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.tsx new file mode 100644 index 0000000..56d51d9 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/my-component.tsx @@ -0,0 +1,32 @@ +import { Component, Prop, h } from '@stencil/core'; +import { format } from '../../utils/utils'; + +@Component({ + tag: 'my-component', + styleUrl: 'my-component.css', + shadow: true, +}) +export class MyComponent { + /** + * The first name + */ + @Prop() first: string; + + /** + * The middle name + */ + @Prop() middle: string; + + /** + * The last name + */ + @Prop() last: string; + + private getText(): string { + return format(this.first, this.middle, this.last); + } + + render() { + return
Hello, World! I'm {this.getText()}
; + } +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/readme.md b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/readme.md new file mode 100644 index 0000000..06b5864 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/components/my-component/readme.md @@ -0,0 +1,19 @@ +# my-component + + + + + + +## Properties + +| Property | Attribute | Description | Type | Default | +| -------- | --------- | --------------- | -------- | ----------- | +| `first` | `first` | The first name | `string` | `undefined` | +| `last` | `last` | The last name | `string` | `undefined` | +| `middle` | `middle` | The middle name | `string` | `undefined` | + + +---------------------------------------------- + +*Built with [StencilJS](https://stenciljs.com/)* diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/index.html b/frontend/src/pages/test/ews-component-master/ews-component-master/src/index.html new file mode 100644 index 0000000..5010d57 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/index.html @@ -0,0 +1,327 @@ + + + + + + + Stencil Component Starter + + + + + + + + +

EWS Component Examples

+ + + + +
+

ews-card

+

A collapsible card component with customizable colors and styling.

+
+
+ +
Red Card Header
+
This is the content of a red card. Click the header to toggle.
+ + Red color +
+
+ +
Orange Card Header
+
This is the content of an orange card.
+ + Orange color +
+
+ +
+ +
+

WARNING

+
+
+
+
+ WARNING CONTENT NEED YOUR ATENTION +
+
+
+ +
+

WARNING

+
+
+ + Custom +
+
+ +
+ +
+

DANGER

+
+
+
+
+ DANGER CONTENT NEED YOUR ATENTION +
+
+
+ +
+

DANGER

+
+
+ + Custom +
+
+
+ + +
+

ews-hex-shape

+

A hexagonal shape component with various configuration options.

+
+
+ +
Blue Hex
+ + Default +
+
+ +
Pointy Top
+ + Pointy top +
+ +
+ + Red +
+ +
+ +
+ Clipped Content - This text is clipped within the hex boundary +
+ + Clipped content +
+ +
+
+ + +
+

ews-stripe-bar

+

An animated stripe bar component with various customization options.

+
+
+ + Default +
+
+ + Red +
+ +
+ + Animated +
+ +
+ + Reverse +
+ +
+ +
+
+ + Default +
+
+ + Red +
+ +
+ + Animated +
+ +
+ + Reverse +
+ +
+
+
+

ews-hex-grid

+ +
+
+ +
+ Cell 1 +
+
+ Cell 2 +
+
+ Cell 3 +
+
+ Cell 4 +
+
+ Cell 5 +
+
+ Cell 6 +
+
+ Cell 7 +
+
+ Cell 8 +
+
+ Cell 9 +
+
+ Cell 10 +
+ +
+ +
+
+ + + +
+

ews-rib-layout

+

A complex rib cage layout with responsive branching and animated nodes.

+
+ +
+
+ + + + + \ No newline at end of file diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/index.ts b/frontend/src/pages/test/ews-component-master/ews-component-master/src/index.ts new file mode 100644 index 0000000..fc07dff --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/index.ts @@ -0,0 +1,12 @@ +/** + * @fileoverview entry point for your component library + * + * This is the entry point for your component library. Use this file to export utilities, + * constants or data structure that accompany your components. + * + * DO NOT use this file to export your components. Instead, use the recommended approaches + * to consume components of this package as outlined in the `README.md`. + */ + +export { format } from './utils/utils'; +export type * from './components.d.ts'; diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/utils/utils.ts b/frontend/src/pages/test/ews-component-master/ews-component-master/src/utils/utils.ts new file mode 100644 index 0000000..b1a0b3d --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/utils/utils.ts @@ -0,0 +1,3 @@ +export function format(first?: string, middle?: string, last?: string): string { + return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : ''); +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/src/utils/utils.unit.test.ts b/frontend/src/pages/test/ews-component-master/ews-component-master/src/utils/utils.unit.test.ts new file mode 100644 index 0000000..4cc0dde --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/src/utils/utils.unit.test.ts @@ -0,0 +1,20 @@ +import { describe, it, expect } from 'vitest'; +import { format } from './utils'; + +describe('format', () => { + it('returns empty string for no names defined', () => { + expect(format(undefined, undefined, undefined)).toEqual(''); + }); + + it('formats just first names', () => { + expect(format('Joseph', undefined, undefined)).toEqual('Joseph'); + }); + + it('formats first and last names', () => { + expect(format('Joseph', undefined, 'Publique')).toEqual('Joseph Publique'); + }); + + it('formats first, middle and last names', () => { + expect(format('Joseph', 'Quincy', 'Publique')).toEqual('Joseph Quincy Publique'); + }); +}); diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/stencil.config.ts b/frontend/src/pages/test/ews-component-master/ews-component-master/stencil.config.ts new file mode 100644 index 0000000..f90bca4 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/stencil.config.ts @@ -0,0 +1,23 @@ +import { Config } from '@stencil/core'; + +export const config: Config = { + namespace: 'ews-component', + outputTargets: [ + { + type: 'dist', + esmLoaderPath: '../loader', + }, + { + type: 'dist-custom-elements', + customElementsExportBehavior: 'auto-define-custom-elements', + externalRuntime: false, + }, + { + type: 'docs-readme', + }, + { + type: 'www', + serviceWorker: null, // disable service workers + }, + ], +}; diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/tsconfig.json b/frontend/src/pages/test/ews-component-master/ews-component-master/tsconfig.json new file mode 100644 index 0000000..a3943d2 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/tsconfig.json @@ -0,0 +1,29 @@ +{ + "compilerOptions": { + "allowSyntheticDefaultImports": true, + "allowUnreachableCode": false, + "declaration": false, + "experimentalDecorators": true, + "lib": [ + "dom", + "es2022" + ], + "moduleResolution": "bundler", + "module": "esnext", + "target": "es2022", + "noUnusedLocals": true, + "noUnusedParameters": true, + "jsx": "react", + "jsxFactory": "h", + "jsxFragmentFactory": "h.Fragment", + "types": [ + "@stencil/vitest/globals" + ] + }, + "include": [ + "src" + ], + "exclude": [ + "node_modules" + ] +} diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/vitest-setup.ts b/frontend/src/pages/test/ews-component-master/ews-component-master/vitest-setup.ts new file mode 100644 index 0000000..5a42ab3 --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/vitest-setup.ts @@ -0,0 +1,4 @@ +// Load Stencil components for browser tests +await import('./dist/ews-component/ews-component.esm.js'); + +export { }; diff --git a/frontend/src/pages/test/ews-component-master/ews-component-master/vitest.config.ts b/frontend/src/pages/test/ews-component-master/ews-component-master/vitest.config.ts new file mode 100644 index 0000000..1a41f9d --- /dev/null +++ b/frontend/src/pages/test/ews-component-master/ews-component-master/vitest.config.ts @@ -0,0 +1,32 @@ +import { defineVitestConfig } from '@stencil/vitest/config'; +import { playwright } from '@vitest/browser-playwright'; + +export default defineVitestConfig({ + stencilConfig: './stencil.config.ts', + test: { + projects: [ + // Unit tests - stencil environment for component logic + { + test: { + name: 'unit', + include: ['src/**/*.unit.test.{ts,tsx}'], + environment: 'stencil', + }, + }, + // Component browser tests - real browser via Playwright + { + test: { + name: 'browser', + include: ['src/**/*.cmp.test.{ts,tsx}'], + setupFiles: ['./vitest-setup.ts'], + browser: { + enabled: true, + provider: playwright(), + headless: true, + instances: [{ browser: 'chromium' }], + }, + }, + }, + ], + }, +}); diff --git a/frontend/src/pages/test/sounds.tsx b/frontend/src/pages/test/sounds.tsx new file mode 100644 index 0000000..a0273f4 --- /dev/null +++ b/frontend/src/pages/test/sounds.tsx @@ -0,0 +1,299 @@ +import { useRef, useState, useEffect } from 'react'; + +export function RetroSoundTest() { + const audioCtxRef = useRef(null); + const [isRepeating, setIsRepeating] = useState(false); + const repeatTimeoutRef = useRef(null); + + const getAudioCtx = () => { + if (!audioCtxRef.current) { + audioCtxRef.current = new (window.AudioContext || (window as any).webkitAudioContext)(); + } + if (audioCtxRef.current.state === 'suspended') { + audioCtxRef.current.resume(); + } + return audioCtxRef.current; + }; + + const playSound = (freq: number, type: OscillatorType, duration: number, vol: number, fade: boolean = false) => { + const ctx = getAudioCtx(); + const osc = ctx.createOscillator(); + const gain = ctx.createGain(); + + osc.type = type; + osc.frequency.setValueAtTime(freq, ctx.currentTime); + + gain.gain.setValueAtTime(vol, ctx.currentTime); + if (fade) { + gain.gain.exponentialRampToValueAtTime(0.0001, ctx.currentTime + duration); + } + + osc.connect(gain); + gain.connect(ctx.destination); + + osc.start(); + osc.stop(ctx.currentTime + duration); + }; + + // White noise (for 8-bit style noise) + const playNoise = (duration: number, vol: number, fade: boolean = false) => { + const ctx = getAudioCtx(); + const bufferSize = ctx.sampleRate * duration; + const buffer = ctx.createBuffer(1, bufferSize, ctx.sampleRate); + const output = buffer.getChannelData(0); + + for (let i = 0; i < bufferSize; i++) { + output[i] = Math.random() * 2 - 1; + } + + const noise = ctx.createBufferSource(); + noise.buffer = buffer; + + const gain = ctx.createGain(); + gain.gain.setValueAtTime(vol, ctx.currentTime); + if (fade) { + gain.gain.exponentialRampToValueAtTime(0.0001, ctx.currentTime + duration); + } + + noise.connect(gain); + gain.connect(ctx.destination); + noise.start(); + }; + + // Play sound repeatedly with random delays + const playRepeating = () => { + // Play the sound + playSound(1000, 'sawtooth', 0.08, 0.1); + playNoise(0.09, 0.02); + + // Schedule next play with random delay (0-1000ms) + const randomDelay = Math.random() * 900; + repeatTimeoutRef.current = window.setTimeout(playRepeating, randomDelay); + }; + + // Toggle repeating sound + const toggleRepeat = () => { + if (isRepeating) { + // Stop repeating + if (repeatTimeoutRef.current !== null) { + clearTimeout(repeatTimeoutRef.current); + repeatTimeoutRef.current = null; + } + setIsRepeating(false); + } else { + // Start repeating + setIsRepeating(true); + playRepeating(); + } + }; + + // Cleanup on unmount + useEffect(() => { + return () => { + if (repeatTimeoutRef.current !== null) { + clearTimeout(repeatTimeoutRef.current); + } + }; + }, []); + + // Crew Bailout Alarm - 90s style aggressive buzzer + const crewBailout = (durationSeconds: number) => { + const ctx = getAudioCtx(); + const startTime = ctx.currentTime; + const endTime = startTime + durationSeconds; + + // Timing constants + const beepDuration = 0.06; // 60ms ON + const pauseDuration = 0.06; // 60ms OFF + const cycleDuration = beepDuration + pauseDuration; // 120ms total ~ 8 beeps/sec + + const oscillators: OscillatorNode[] = []; + const gainNodes: GainNode[] = []; + + let currentTime = startTime; + + // Generate beeps for the entire duration + while (currentTime < endTime) { + // Create two oscillators for beating effect + const osc1 = ctx.createOscillator(); + const osc2 = ctx.createOscillator(); + const gain = ctx.createGain(); + + osc1.type = 'square'; + osc2.type = 'square'; + osc1.frequency.setValueAtTime(2850, currentTime); + osc2.frequency.setValueAtTime(2855, currentTime); // 5Hz difference for beating + + // Envelope + const attackTime = 0.002; // 2ms attack + const releaseTime = 0.01; // 10ms release + + // Attack + gain.gain.setValueAtTime(0, currentTime); + gain.gain.linearRampToValueAtTime(0.15, currentTime + attackTime); + + // Sustain + gain.gain.setValueAtTime(0.15, currentTime + beepDuration - releaseTime); + + // Release + gain.gain.linearRampToValueAtTime(0, currentTime + beepDuration); + + // Connect nodes + osc1.connect(gain); + osc2.connect(gain); + gain.connect(ctx.destination); + + // Start and stop + osc1.start(currentTime); + osc2.start(currentTime); + osc1.stop(currentTime + beepDuration); + osc2.stop(currentTime + beepDuration); + + // Store for cleanup + oscillators.push(osc1, osc2); + gainNodes.push(gain); + + // Move to next beep + currentTime += cycleDuration; + } + + // Cleanup after completion + setTimeout(() => { + oscillators.forEach(osc => osc.disconnect()); + gainNodes.forEach(gain => gain.disconnect()); + }, durationSeconds * 1000 + 100); + }; + + return ( +
+

🔊 8-Bit & Industrial Buzzer Generator

+

+ Harsh, digital, lo-fi sounds with noise and dissonance - NOT musical tones +

+ + {/* Single Preset */} +
+

Preset Sound

+ +
+ + {/* Crew Bailout Alarm - 90s Style */} +
+

🚨 Crew Bailout Alarm (90s)

+

+ Agresivní mechanický bzučák: 2850 Hz + 2855 Hz square, 8 beeps/sec +

+
+ + + +
+
+ + {/* Repeating Sound Toggle */} +
+

🔁 Test

+ +

Patlabor notify effect

+ +
+ + {/* Raw Noise Test */} +
+

🎛️ Raw Sound Elements

+
+ {[320,1000].map(freq => ( + + ))} +
+
+
+ ); +} \ No newline at end of file