diff --git a/.gitignore b/.gitignore index d2fd343..dc7009b 100644 --- a/.gitignore +++ b/.gitignore @@ -13,6 +13,7 @@ profile # Dependency directory # https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git node_modules +src/presets/lara # Remove some common IDE working directories .idea diff --git a/eslint.config.mjs b/eslint.config.mjs index f74662c..d966090 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -28,6 +28,13 @@ export default [ }, }, { - ignores: ['babel.config.js', 'webpack.config.js'], - } + ignores: [ + 'src/presets/lara/**/*', + 'node_modules/**/*', + 'dist/**/*', + '.github/**/*', + 'babel.config.js', + 'webpack.config.js', + ], + }, ]; diff --git a/package-lock.json b/package-lock.json index eff74ae..c0e7345 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "fohn-ui", - "version": "1.7.1", + "version": "1.8.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "fohn-ui", - "version": "1.7.1", + "version": "1.8.0", "license": "MIT", "dependencies": { "@babel/runtime": "^7.16.3", @@ -21,6 +21,7 @@ "lodash.throttle": "^4.1.1", "mitt": "^3.0.0", "pinia": "^2.0.12", + "primevue": "^4.0.0-rc.2", "vue": "^3.2.24", "vue-flatpickr-component": "^11.0.3", "vue-toastification": "^2.0.0-rc.5" @@ -1857,23 +1858,23 @@ } }, "node_modules/@eslint-community/regexpp": { - "version": "4.10.1", - "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.1.tgz", - "integrity": "sha512-Zm2NGpWELsQAD1xsJzGQpYfvICSsFkEpU0jxBjfdC6uNEWXcHnfs9hScFWtXVDVl+rBQJGrl4g1vcKIejpH9dA==", + "version": "4.11.0", + "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.11.0.tgz", + "integrity": "sha512-G/M/tIiMrTAxEWRfLfQJMmGNX28IxBg4PBz8XqQhqUHLFI6TL2htpIB1iQCj144V5ee/JaKyT9/WZ0MGZWfA7A==", "dev": true, "engines": { "node": "^12.0.0 || ^14.0.0 || >=16.0.0" } }, "node_modules/@eslint/config-array": { - "version": "0.16.0", - "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.16.0.tgz", - "integrity": "sha512-/jmuSd74i4Czf1XXn7wGRWZCuyaUZ330NH1Bek0Pplatt4Sy1S5haN21SCLLdbeKslQ+S0wEJ+++v5YibSi+Lg==", + "version": "0.17.0", + "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.17.0.tgz", + "integrity": "sha512-A68TBu6/1mHHuc5YJL0U0VVeGNiklLAL6rRmhTCP2B5XjWLMnrX+HkO+IAXyHvks5cyyY1jjK5ITPQ1HGS2EVA==", "dev": true, "dependencies": { "@eslint/object-schema": "^2.1.4", "debug": "^4.3.1", - "minimatch": "^3.0.5" + "minimatch": "^3.1.2" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -1915,9 +1916,9 @@ } }, "node_modules/@eslint/js": { - "version": "9.5.0", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.5.0.tgz", - "integrity": "sha512-A7+AOT2ICkodvtsWnxZP4Xxk3NbZ3VMHd8oihydLRGrJgqqdEz1qSeEgXYyT/Cu8h1TWWsQRejIx48mtjZ5y1w==", + "version": "9.6.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.6.0.tgz", + "integrity": "sha512-D9B0/3vNg44ZeWbYMpBoXqNP4j6eQD5vNwIlGAuFRRzK/WtT/jvDQW3Bi9kkf3PMDMlM7Yi+73VLUsn5bJcl8A==", "dev": true, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -2071,16 +2072,61 @@ "node": ">= 8" } }, + "node_modules/@primeuix/styled": { + "version": "0.0.5", + "resolved": "https://registry.npmjs.org/@primeuix/styled/-/styled-0.0.5.tgz", + "integrity": "sha512-pVoGn/uPkVm/DyF3TR3EmH/pL/dP4nR42FcYbVduFq9VfO3KVeOEqvcCULHXos66RZO9MCbCFUoLy6ctf9GUGQ==", + "dependencies": { + "@primeuix/utils": "^0.0.5" + }, + "engines": { + "node": ">=12.11.0" + } + }, + "node_modules/@primeuix/utils": { + "version": "0.0.5", + "resolved": "https://registry.npmjs.org/@primeuix/utils/-/utils-0.0.5.tgz", + "integrity": "sha512-ntUiUgtRtkF8KuaxHffzhYxQxoXk6LAPHm7CVlFjdqS8Rx8xRkLkZVyo84E+pO2hcNFkOGVP/GxHhQ2s94O8zA==", + "engines": { + "node": ">=12.11.0" + } + }, + "node_modules/@primevue/core": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@primevue/core/-/core-4.0.0.tgz", + "integrity": "sha512-M+GF1HYnl/x5J6uevXh1k42J0XnFhp0XHce+cHddWg7v3bVwgsn7LD3AKKcf0A/iQQPXVKX9nY/4/9eFVct67w==", + "dependencies": { + "@primeuix/styled": "^0.0.5" + }, + "engines": { + "node": ">=12.11.0" + }, + "peerDependencies": { + "@primeuix/utils": "^0.0.5", + "vue": "^3.0.0" + } + }, + "node_modules/@primevue/icons": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@primevue/icons/-/icons-4.0.0.tgz", + "integrity": "sha512-gv9pbj7JjCuW59tW2csIJgg6btTJpkr/mjlfqscEIrYzDGqzCrbfxLur48gA2dyhYsiQPPTbIHFwL944piFgIg==", + "dependencies": { + "@primevue/core": "4.0.0" + }, + "engines": { + "node": ">=12.11.0" + } + }, "node_modules/@stylistic/eslint-plugin": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin/-/eslint-plugin-2.2.1.tgz", - "integrity": "sha512-YErqfwWFbRCpkyPtrcVYaJhvEn9aXE4WzxxkZ7Q3OKS4QD9CE6qZjzEw5DhcA2wL3Jo6JbzSB3/stJMNocGMgQ==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin/-/eslint-plugin-2.3.0.tgz", + "integrity": "sha512-rtiz6u5gRyyEZp36FcF1/gHJbsbT3qAgXZ1qkad6Nr/xJ9wrSJkiSFFQhpYVTIZ7FJNRJurEcumZDCwN9dEI4g==", "dev": true, "dependencies": { - "@stylistic/eslint-plugin-js": "2.2.1", - "@stylistic/eslint-plugin-jsx": "2.2.1", - "@stylistic/eslint-plugin-plus": "2.2.1", - "@stylistic/eslint-plugin-ts": "2.2.1", + "@stylistic/eslint-plugin-js": "2.3.0", + "@stylistic/eslint-plugin-jsx": "2.3.0", + "@stylistic/eslint-plugin-plus": "2.3.0", + "@stylistic/eslint-plugin-ts": "2.3.0", "@types/eslint": "^8.56.10" }, "engines": { @@ -2091,9 +2137,9 @@ } }, "node_modules/@stylistic/eslint-plugin-js": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-js/-/eslint-plugin-js-2.2.1.tgz", - "integrity": "sha512-M2dQkKw2R4R+b1SJ/xElJ9bDVq/vCI31VpIIxkZD9KXCqbUHvtsGpZH3eO6MzmFWOZj4PfNdEQdP332MtqjCPg==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-js/-/eslint-plugin-js-2.3.0.tgz", + "integrity": "sha512-lQwoiYb0Fs6Yc5QS3uT8+T9CPKK2Eoxc3H8EnYJgM26v/DgtW+1lvy2WNgyBflU+ThShZaHm3a6CdD9QeKx23w==", "dev": true, "dependencies": { "@types/eslint": "^8.56.10", @@ -2109,12 +2155,12 @@ } }, "node_modules/@stylistic/eslint-plugin-jsx": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-jsx/-/eslint-plugin-jsx-2.2.1.tgz", - "integrity": "sha512-J/R4tU38v8gVqKPy6Mh22dq8btLSPWK06SuRc/ryOxT8LpW2ZdcSDP4HNvQiOte0Wy9xzgKJHP4JlYauDZ/oVw==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-jsx/-/eslint-plugin-jsx-2.3.0.tgz", + "integrity": "sha512-tsQ0IEKB195H6X9A4iUSgLLLKBc8gUBWkBIU8tp1/3g2l8stu+PtMQVV/VmK1+3bem5FJCyvfcZIQ/WF1fsizA==", "dev": true, "dependencies": { - "@stylistic/eslint-plugin-js": "^2.2.1", + "@stylistic/eslint-plugin-js": "^2.3.0", "@types/eslint": "^8.56.10", "estraverse": "^5.3.0", "picomatch": "^4.0.2" @@ -2127,9 +2173,9 @@ } }, "node_modules/@stylistic/eslint-plugin-plus": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-plus/-/eslint-plugin-plus-2.2.1.tgz", - "integrity": "sha512-VGdTcQzZ/cZNcJnvjDos1VLzUerPapvYCVSCQZEhupMtmxt+mbITiJWzLLHYNfqGBnW7ABqViLfob+s3Q2GcKw==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-plus/-/eslint-plugin-plus-2.3.0.tgz", + "integrity": "sha512-xboPWGUU5yaPlR+WR57GwXEuY4PSlPqA0C3IdNA/+1o2MuBi95XgDJcZiJ9N+aXsqBXAPIpFFb+WQ7QEHo4f7g==", "dev": true, "dependencies": { "@types/eslint": "^8.56.10", @@ -2140,15 +2186,15 @@ } }, "node_modules/@stylistic/eslint-plugin-plus/node_modules/@typescript-eslint/utils": { - "version": "7.13.1", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.13.1.tgz", - "integrity": "sha512-h5MzFBD5a/Gh/fvNdp9pTfqJAbuQC4sCN2WzuXme71lqFJsZtLbjxfSk4r3p02WIArOF9N94pdsLiGutpDbrXQ==", + "version": "7.15.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.15.0.tgz", + "integrity": "sha512-hfDMDqaqOqsUVGiEPSMLR/AjTSCsmJwjpKkYQRo1FNbmW4tBwBspYDwO9eh7sKSTwMQgBw9/T4DHudPaqshRWA==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", - "@typescript-eslint/scope-manager": "7.13.1", - "@typescript-eslint/types": "7.13.1", - "@typescript-eslint/typescript-estree": "7.13.1" + "@typescript-eslint/scope-manager": "7.15.0", + "@typescript-eslint/types": "7.15.0", + "@typescript-eslint/typescript-estree": "7.15.0" }, "engines": { "node": "^18.18.0 || >=20.0.0" @@ -2162,12 +2208,12 @@ } }, "node_modules/@stylistic/eslint-plugin-ts": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-ts/-/eslint-plugin-ts-2.2.1.tgz", - "integrity": "sha512-2AbpXGGorCEzDryth7RhOMJWlko+sxSs1lxL2tSXB5H/EffmXgLn1tMoMKgwYJW3s6v0BxJRr5BWj9B9JaZTUQ==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@stylistic/eslint-plugin-ts/-/eslint-plugin-ts-2.3.0.tgz", + "integrity": "sha512-wqOR38/uz/0XPnHX68ftp8sNMSAqnYGjovOTN7w00xnjS6Lxr3Sk7q6AaxWWqbMvOj7V2fQiMC5HWAbTruJsCg==", "dev": true, "dependencies": { - "@stylistic/eslint-plugin-js": "2.2.1", + "@stylistic/eslint-plugin-js": "2.3.0", "@types/eslint": "^8.56.10", "@typescript-eslint/utils": "^7.12.0" }, @@ -2179,15 +2225,15 @@ } }, "node_modules/@stylistic/eslint-plugin-ts/node_modules/@typescript-eslint/utils": { - "version": "7.13.1", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.13.1.tgz", - "integrity": "sha512-h5MzFBD5a/Gh/fvNdp9pTfqJAbuQC4sCN2WzuXme71lqFJsZtLbjxfSk4r3p02WIArOF9N94pdsLiGutpDbrXQ==", + "version": "7.15.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.15.0.tgz", + "integrity": "sha512-hfDMDqaqOqsUVGiEPSMLR/AjTSCsmJwjpKkYQRo1FNbmW4tBwBspYDwO9eh7sKSTwMQgBw9/T4DHudPaqshRWA==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", - "@typescript-eslint/scope-manager": "7.13.1", - "@typescript-eslint/types": "7.13.1", - "@typescript-eslint/typescript-estree": "7.13.1" + "@typescript-eslint/scope-manager": "7.15.0", + "@typescript-eslint/types": "7.15.0", + "@typescript-eslint/typescript-estree": "7.15.0" }, "engines": { "node": "^18.18.0 || >=20.0.0" @@ -2201,20 +2247,20 @@ } }, "node_modules/@tanstack/virtual-core": { - "version": "3.5.1", - "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.5.1.tgz", - "integrity": "sha512-046+AUSiDru/V9pajE1du8WayvBKeCvJ2NmKPy/mR8/SbKKrqmSbj7LJBfXE+nSq4f5TBXvnCzu0kcYebI9WdQ==", + "version": "3.8.1", + "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.8.1.tgz", + "integrity": "sha512-uNtAwenT276M9QYCjTBoHZ8X3MUeCRoGK59zPi92hMIxdfS9AyHjkDWJ94WroDxnv48UE+hIeo21BU84jKc8aQ==", "funding": { "type": "github", "url": "https://github.com/sponsors/tannerlinsley" } }, "node_modules/@tanstack/vue-virtual": { - "version": "3.5.1", - "resolved": "https://registry.npmjs.org/@tanstack/vue-virtual/-/vue-virtual-3.5.1.tgz", - "integrity": "sha512-6mc4HtDPieDVKD6GqzHiJkdzuqRNdQZuoIbkwE6af939WV+w62YmSF69jN+BOqClqh/ObiW+X1VOQx1Pftrx1A==", + "version": "3.8.1", + "resolved": "https://registry.npmjs.org/@tanstack/vue-virtual/-/vue-virtual-3.8.1.tgz", + "integrity": "sha512-uhty1LzUbbcVc5zdMMSUjUt/ECTlMCtK49Ww7dH2m4lNNLGYwkj5SbfrAD8uCZxV1VeV7DRMXqhwUTELyR5rrA==", "dependencies": { - "@tanstack/virtual-core": "3.5.1" + "@tanstack/virtual-core": "3.8.1" }, "funding": { "type": "github", @@ -2257,9 +2303,9 @@ "dev": true }, "node_modules/@types/node": { - "version": "20.14.4", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.14.4.tgz", - "integrity": "sha512-1ChboN+57suCT2t/f8lwtPY/k3qTpuD/qnqQuYoBg6OQOcPyaw7PiZVdGpaZYAvhDDtqrt0oAaM8+oSu1xsUGw==", + "version": "20.14.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.14.9.tgz", + "integrity": "sha512-06OCtnTXtWOZBJlRApleWndH4JsRVs1pDCc8dLSQp+7PpUpX3ePdHyeNSFTeSe7FtKyQkrlPvHwJOW3SLd8Oyg==", "dev": true, "dependencies": { "undici-types": "~5.26.4" @@ -2271,13 +2317,13 @@ "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==" }, "node_modules/@typescript-eslint/scope-manager": { - "version": "7.13.1", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-7.13.1.tgz", - "integrity": "sha512-adbXNVEs6GmbzaCpymHQ0MB6E4TqoiVbC0iqG3uijR8ZYfpAXMGttouQzF4Oat3P2GxDVIrg7bMI/P65LiQZdg==", + "version": "7.15.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-7.15.0.tgz", + "integrity": "sha512-Q/1yrF/XbxOTvttNVPihxh1b9fxamjEoz2Os/Pe38OHwxC24CyCqXxGTOdpb4lt6HYtqw9HetA/Rf6gDGaMPlw==", "dev": true, "dependencies": { - "@typescript-eslint/types": "7.13.1", - "@typescript-eslint/visitor-keys": "7.13.1" + "@typescript-eslint/types": "7.15.0", + "@typescript-eslint/visitor-keys": "7.15.0" }, "engines": { "node": "^18.18.0 || >=20.0.0" @@ -2288,9 +2334,9 @@ } }, "node_modules/@typescript-eslint/types": { - "version": "7.13.1", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-7.13.1.tgz", - "integrity": "sha512-7K7HMcSQIAND6RBL4kDl24sG/xKM13cA85dc7JnmQXw2cBDngg7c19B++JzvJHRG3zG36n9j1i451GBzRuHchw==", + "version": "7.15.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-7.15.0.tgz", + "integrity": "sha512-aV1+B1+ySXbQH0pLK0rx66I3IkiZNidYobyfn0WFsdGhSXw+P3YOqeTq5GED458SfB24tg+ux3S+9g118hjlTw==", "dev": true, "engines": { "node": "^18.18.0 || >=20.0.0" @@ -2301,13 +2347,13 @@ } }, "node_modules/@typescript-eslint/typescript-estree": { - "version": "7.13.1", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-7.13.1.tgz", - "integrity": "sha512-uxNr51CMV7npU1BxZzYjoVz9iyjckBduFBP0S5sLlh1tXYzHzgZ3BR9SVsNed+LmwKrmnqN3Kdl5t7eZ5TS1Yw==", + "version": "7.15.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-7.15.0.tgz", + "integrity": "sha512-gjyB/rHAopL/XxfmYThQbXbzRMGhZzGw6KpcMbfe8Q3nNQKStpxnUKeXb0KiN/fFDR42Z43szs6rY7eHk0zdGQ==", "dev": true, "dependencies": { - "@typescript-eslint/types": "7.13.1", - "@typescript-eslint/visitor-keys": "7.13.1", + "@typescript-eslint/types": "7.15.0", + "@typescript-eslint/visitor-keys": "7.15.0", "debug": "^4.3.4", "globby": "^11.1.0", "is-glob": "^4.0.3", @@ -2338,9 +2384,9 @@ } }, "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": { - "version": "9.0.4", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz", - "integrity": "sha512-KqWh+VchfxcMNRAJjj2tnsSJdNbHsVgnkBhTNrW7AjVo6OvLtxw8zfT9oLw1JSohlFzJ8jCoTgaoXvJ+kHt6fw==", + "version": "9.0.5", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", + "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", "dev": true, "dependencies": { "brace-expansion": "^2.0.1" @@ -2365,12 +2411,12 @@ } }, "node_modules/@typescript-eslint/visitor-keys": { - "version": "7.13.1", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-7.13.1.tgz", - "integrity": "sha512-k/Bfne7lrP7hcb7m9zSsgcBmo+8eicqqfNAJ7uUY+jkTFpKeH2FSkWpFRtimBxgkyvqfu9jTPRbYOvud6isdXA==", + "version": "7.15.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-7.15.0.tgz", + "integrity": "sha512-Hqgy/ETgpt2L5xueA/zHHIl4fJI2O4XUE9l4+OIfbJIRSnTJb/QscncdqqZzofQegIJugRIF57OJea1khw2SDw==", "dev": true, "dependencies": { - "@typescript-eslint/types": "7.13.1", + "@typescript-eslint/types": "7.15.0", "eslint-visitor-keys": "^3.4.3" }, "engines": { @@ -2467,36 +2513,36 @@ } }, "node_modules/@vue/compiler-core": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.29.tgz", - "integrity": "sha512-TFKiRkKKsRCKvg/jTSSKK7mYLJEQdUiUfykbG49rubC9SfDyvT2JrzTReopWlz2MxqeLyxh9UZhvxEIBgAhtrg==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.31.tgz", + "integrity": "sha512-skOiodXWTV3DxfDhB4rOf3OGalpITLlgCeOwb+Y9GJpfQ8ErigdBUHomBzvG78JoVE8MJoQsb+qhZiHfKeNeEg==", "dependencies": { "@babel/parser": "^7.24.7", - "@vue/shared": "3.4.29", + "@vue/shared": "3.4.31", "entities": "^4.5.0", "estree-walker": "^2.0.2", "source-map-js": "^1.2.0" } }, "node_modules/@vue/compiler-dom": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.29.tgz", - "integrity": "sha512-A6+iZ2fKIEGnfPJejdB7b1FlJzgiD+Y/sxxKwJWg1EbJu6ZPgzaPQQ51ESGNv0CP6jm6Z7/pO6Ia8Ze6IKrX7w==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.31.tgz", + "integrity": "sha512-wK424WMXsG1IGMyDGyLqB+TbmEBFM78hIsOJ9QwUVLGrcSk0ak6zYty7Pj8ftm7nEtdU/DGQxAXp0/lM/2cEpQ==", "dependencies": { - "@vue/compiler-core": "3.4.29", - "@vue/shared": "3.4.29" + "@vue/compiler-core": "3.4.31", + "@vue/shared": "3.4.31" } }, "node_modules/@vue/compiler-sfc": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.29.tgz", - "integrity": "sha512-zygDcEtn8ZimDlrEQyLUovoWgKQic6aEQqRXce2WXBvSeHbEbcAsXyCk9oG33ZkyWH4sl9D3tkYc1idoOkdqZQ==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.31.tgz", + "integrity": "sha512-einJxqEw8IIJxzmnxmJBuK2usI+lJonl53foq+9etB2HAzlPjAS/wa7r0uUpXw5ByX3/0uswVSrjNb17vJm1kQ==", "dependencies": { "@babel/parser": "^7.24.7", - "@vue/compiler-core": "3.4.29", - "@vue/compiler-dom": "3.4.29", - "@vue/compiler-ssr": "3.4.29", - "@vue/shared": "3.4.29", + "@vue/compiler-core": "3.4.31", + "@vue/compiler-dom": "3.4.31", + "@vue/compiler-ssr": "3.4.31", + "@vue/shared": "3.4.31", "estree-walker": "^2.0.2", "magic-string": "^0.30.10", "postcss": "^8.4.38", @@ -2504,12 +2550,12 @@ } }, "node_modules/@vue/compiler-ssr": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.29.tgz", - "integrity": "sha512-rFbwCmxJ16tDp3N8XCx5xSQzjhidYjXllvEcqX/lopkoznlNPz3jyy0WGJCyhAaVQK677WWFt3YO/WUEkMMUFQ==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.31.tgz", + "integrity": "sha512-RtefmITAje3fJ8FSg1gwgDhdKhZVntIVbwupdyZDSifZTRMiWxWehAOTCc8/KZDnBOcYQ4/9VWxsTbd3wT0hAA==", "dependencies": { - "@vue/compiler-dom": "3.4.29", - "@vue/shared": "3.4.29" + "@vue/compiler-dom": "3.4.31", + "@vue/shared": "3.4.31" } }, "node_modules/@vue/devtools-api": { @@ -2518,49 +2564,49 @@ "integrity": "sha512-0MiMsFma/HqA6g3KLKn+AGpL1kgKhFWszC9U29NfpWK5LE7bjeXxySWJrOJ77hBz+TBrBQ7o4QJqbPbqbs8rJw==" }, "node_modules/@vue/reactivity": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.29.tgz", - "integrity": "sha512-w8+KV+mb1a8ornnGQitnMdLfE0kXmteaxLdccm2XwdFxXst4q/Z7SEboCV5SqJNpZbKFeaRBBJBhW24aJyGINg==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.31.tgz", + "integrity": "sha512-VGkTani8SOoVkZNds1PfJ/T1SlAIOf8E58PGAhIOUDYPC4GAmFA2u/E14TDAFcf3vVDKunc4QqCe/SHr8xC65Q==", "dependencies": { - "@vue/shared": "3.4.29" + "@vue/shared": "3.4.31" } }, "node_modules/@vue/runtime-core": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.29.tgz", - "integrity": "sha512-s8fmX3YVR/Rk5ig0ic0NuzTNjK2M7iLuVSZyMmCzN/+Mjuqqif1JasCtEtmtoJWF32pAtUjyuT2ljNKNLeOmnQ==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.31.tgz", + "integrity": "sha512-LDkztxeUPazxG/p8c5JDDKPfkCDBkkiNLVNf7XZIUnJ+66GVGkP+TIh34+8LtPisZ+HMWl2zqhIw0xN5MwU1cw==", "dependencies": { - "@vue/reactivity": "3.4.29", - "@vue/shared": "3.4.29" + "@vue/reactivity": "3.4.31", + "@vue/shared": "3.4.31" } }, "node_modules/@vue/runtime-dom": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.29.tgz", - "integrity": "sha512-gI10atCrtOLf/2MPPMM+dpz3NGulo9ZZR9d1dWo4fYvm+xkfvRrw1ZmJ7mkWtiJVXSsdmPbcK1p5dZzOCKDN0g==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.31.tgz", + "integrity": "sha512-2Auws3mB7+lHhTFCg8E9ZWopA6Q6L455EcU7bzcQ4x6Dn4cCPuqj6S2oBZgN2a8vJRS/LSYYxwFFq2Hlx3Fsaw==", "dependencies": { - "@vue/reactivity": "3.4.29", - "@vue/runtime-core": "3.4.29", - "@vue/shared": "3.4.29", + "@vue/reactivity": "3.4.31", + "@vue/runtime-core": "3.4.31", + "@vue/shared": "3.4.31", "csstype": "^3.1.3" } }, "node_modules/@vue/server-renderer": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.29.tgz", - "integrity": "sha512-HMLCmPI2j/k8PVkSBysrA2RxcxC5DgBiCdj7n7H2QtR8bQQPqKAe8qoaxLcInzouBmzwJ+J0x20ygN/B5mYBng==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.31.tgz", + "integrity": "sha512-D5BLbdvrlR9PE3by9GaUp1gQXlCNadIZytMIb8H2h3FMWJd4oUfkUTEH2wAr3qxoRz25uxbTcbqd3WKlm9EHQA==", "dependencies": { - "@vue/compiler-ssr": "3.4.29", - "@vue/shared": "3.4.29" + "@vue/compiler-ssr": "3.4.31", + "@vue/shared": "3.4.31" }, "peerDependencies": { - "vue": "3.4.29" + "vue": "3.4.31" } }, "node_modules/@vue/shared": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.29.tgz", - "integrity": "sha512-hQ2gAQcBO/CDpC82DCrinJNgOHI2v+FA7BDW4lMSPeBpQ7sRe2OLHWe5cph1s7D8DUQAwRt18dBDfJJ220APEA==" + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz", + "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==" }, "node_modules/@vueuse/core": { "version": "10.11.0", @@ -2848,9 +2894,9 @@ "dev": true }, "node_modules/acorn": { - "version": "8.12.0", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.0.tgz", - "integrity": "sha512-RTvkC4w+KNXrM39/lWCUaG0IbRkWdCv7W/IOW9oU6SawyxulvkQy5HQPVTKxEjczcUvapcrw3cFx/60VN/NRNw==", + "version": "8.12.1", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz", + "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==", "dev": true, "bin": { "acorn": "bin/acorn" @@ -3167,9 +3213,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001636", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001636.tgz", - "integrity": "sha512-bMg2vmr8XBsbL6Lr0UHXy/21m84FTxDLWn2FSqMd5PrlbMxwJlQnC2YWYxVgp66PZE+BBNF2jYQUBKCo1FDeZg==", + "version": "1.0.30001640", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001640.tgz", + "integrity": "sha512-lA4VMpW0PSUrFnkmVuEKBUovSWKhj7puyCg8StBChgu298N1AtuF1sKWEvfDuimSEDbhlb/KqPKC3fs1HbuQUA==", "dev": true, "funding": [ { @@ -3439,9 +3485,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.4.803", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.803.tgz", - "integrity": "sha512-61H9mLzGOCLLVsnLiRzCbc63uldP0AniRYPV3hbGVtONA1pI7qSGILdbofR7A8TMbOypDocEAjH/e+9k1QIe3g==", + "version": "1.4.816", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.816.tgz", + "integrity": "sha512-EKH5X5oqC6hLmiS7/vYtZHZFTNdhsYG5NVPRN6Yn0kQHNBlT59+xSM8HBy66P5fxWpKgZbPqb+diC64ng295Jw==", "dev": true }, "node_modules/enhanced-resolve": { @@ -3481,9 +3527,9 @@ } }, "node_modules/es-module-lexer": { - "version": "1.5.3", - "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.3.tgz", - "integrity": "sha512-i1gCgmR9dCl6Vil6UKPI/trA69s08g/syhiDK9TG0Nf1RJjjFI+AzoWW7sPufzkgYAn861skuCwJa0pIIHYxvg==", + "version": "1.5.4", + "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.4.tgz", + "integrity": "sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==", "dev": true }, "node_modules/escalade": { @@ -3505,16 +3551,16 @@ } }, "node_modules/eslint": { - "version": "9.5.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.5.0.tgz", - "integrity": "sha512-+NAOZFrW/jFTS3dASCGBxX1pkFD0/fsO+hfAkJ4TyYKwgsXZbqzrw+seCYFCcPCYXvnD67tAnglU7GQTz6kcVw==", + "version": "9.6.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.6.0.tgz", + "integrity": "sha512-ElQkdLMEEqQNM9Njff+2Y4q2afHk7JpkPvrd7Xh7xefwgQynqPxwf55J7di9+MEibWUGdNjFF9ITG9Pck5M84w==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", - "@eslint/config-array": "^0.16.0", + "@eslint/config-array": "^0.17.0", "@eslint/eslintrc": "^3.1.0", - "@eslint/js": "9.5.0", + "@eslint/js": "9.6.0", "@humanwhocodes/module-importer": "^1.0.1", "@humanwhocodes/retry": "^0.3.0", "@nodelib/fs.walk": "^1.2.8", @@ -3525,7 +3571,7 @@ "escape-string-regexp": "^4.0.0", "eslint-scope": "^8.0.1", "eslint-visitor-keys": "^4.0.0", - "espree": "^10.0.1", + "espree": "^10.1.0", "esquery": "^1.5.0", "esutils": "^2.0.2", "fast-deep-equal": "^3.1.3", @@ -3565,9 +3611,9 @@ } }, "node_modules/eslint-plugin-vue": { - "version": "9.26.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.26.0.tgz", - "integrity": "sha512-eTvlxXgd4ijE1cdur850G6KalZqk65k1JKoOI2d1kT3hr8sPD07j1q98FRFdNnpxBELGPWxZmInxeHGF/GxtqQ==", + "version": "9.27.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.27.0.tgz", + "integrity": "sha512-5Dw3yxEyuBSXTzT5/Ge1X5kIkRTQ3nvBn/VwPwInNiZBSJOO/timWMUaflONnFBzU6NhB68lxnCda7ULV5N7LA==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", @@ -3576,7 +3622,7 @@ "nth-check": "^2.1.1", "postcss-selector-parser": "^6.0.15", "semver": "^7.6.0", - "vue-eslint-parser": "^9.4.2", + "vue-eslint-parser": "^9.4.3", "xml-name-validator": "^4.0.0" }, "engines": { @@ -4033,9 +4079,9 @@ "dev": true }, "node_modules/globals": { - "version": "15.6.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-15.6.0.tgz", - "integrity": "sha512-UzcJi88Hw//CurUIRa9Jxb0vgOCcuD/MNjwmXp633cyaRKkCWACkoqHCtfZv43b1kqXGg/fpOa8bwgacCeXsVg==", + "version": "15.8.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-15.8.0.tgz", + "integrity": "sha512-VZAJ4cewHTExBWDHR6yptdIBlx9YSSZuwojj9Nt5mBRXQzrKakDsVKQ1J63sklLvzAJm0X5+RpO4i3Y2hcOnFw==", "dev": true, "engines": { "node": ">=18" @@ -4296,12 +4342,15 @@ } }, "node_modules/is-core-module": { - "version": "2.13.1", - "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz", - "integrity": "sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==", + "version": "2.14.0", + "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.14.0.tgz", + "integrity": "sha512-a5dFJih5ZLYlRtDc0dZWP7RiKr6xIKzmn/oAYCDvdLThadVgyJwlaoQPmRtMSpz+rk0OGAgIu+TcM9HUF0fk1A==", "dev": true, "dependencies": { - "hasown": "^2.0.0" + "hasown": "^2.0.2" + }, + "engines": { + "node": ">= 0.4" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -5034,9 +5083,9 @@ } }, "node_modules/pkg-dir/node_modules/yocto-queue": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.0.0.tgz", - "integrity": "sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==", + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.1.1.tgz", + "integrity": "sha512-b4JR1PFR10y1mKjhHY9LaGo6tmrgjit7hxVIeAmyMw3jegXR4dhYqLaQF5zMXZxY7tLpMyJeLjr1C4rLmkVe8g==", "dev": true, "engines": { "node": ">=12.20" @@ -5046,9 +5095,9 @@ } }, "node_modules/postcss": { - "version": "8.4.38", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz", - "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==", + "version": "8.4.39", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.39.tgz", + "integrity": "sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==", "funding": [ { "type": "opencollective", @@ -5065,7 +5114,7 @@ ], "dependencies": { "nanoid": "^3.3.7", - "picocolors": "^1.0.0", + "picocolors": "^1.0.1", "source-map-js": "^1.2.0" }, "engines": { @@ -5159,6 +5208,18 @@ "node": ">= 0.8.0" } }, + "node_modules/primevue": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/primevue/-/primevue-4.0.0.tgz", + "integrity": "sha512-2PFmmJqyXpOcKOdF+gbps5fpSXfoXZp2LwX+hya/b5SDseMt3UNboyEgVI6B+DNbJRrib35EbDiMw+7RIANQ1w==", + "dependencies": { + "@primevue/core": "4.0.0", + "@primevue/icons": "4.0.0" + }, + "engines": { + "node": ">=12.11.0" + } + }, "node_modules/punycode": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz", @@ -5773,9 +5834,9 @@ } }, "node_modules/typescript": { - "version": "5.4.5", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz", - "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==", + "version": "5.5.3", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.3.tgz", + "integrity": "sha512-/hreyEujaB0w76zKo6717l3L0o/qEUtRgdvUBvlkhoWeOVMjMuHNHk0BRBzikzuGDqNmPQbg5ifMEqsHLiIUcQ==", "devOptional": true, "peer": true, "bin": { @@ -5833,9 +5894,9 @@ } }, "node_modules/update-browserslist-db": { - "version": "1.0.16", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.16.tgz", - "integrity": "sha512-KVbTxlBYlckhF5wgfyZXTWnMn7MMZjMu9XG8bPlliUOP9ThaF4QnhP8qrjrH7DRzHfSk0oQv1wToW+iA5GajEQ==", + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.0.tgz", + "integrity": "sha512-EdRAaAyk2cUE1wOf2DkEhzxqOQvFOoRJFNS6NeyJ01Gp2beMRpBAINjM2iDXE3KCuKhwnvHIQCJm6ThL2Z+HzQ==", "dev": true, "funding": [ { @@ -5878,15 +5939,15 @@ "dev": true }, "node_modules/vue": { - "version": "3.4.29", - "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.29.tgz", - "integrity": "sha512-8QUYfRcYzNlYuzKPfge1UWC6nF9ym0lx7mpGVPJYNhddxEf3DD0+kU07NTL0sXuiT2HuJuKr/iEO8WvXvT0RSQ==", + "version": "3.4.31", + "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.31.tgz", + "integrity": "sha512-njqRrOy7W3YLAlVqSKpBebtZpDVg21FPoaq1I7f/+qqBThK9ChAIjkRWgeP6Eat+8C+iia4P3OYqpATP21BCoQ==", "dependencies": { - "@vue/compiler-dom": "3.4.29", - "@vue/compiler-sfc": "3.4.29", - "@vue/runtime-dom": "3.4.29", - "@vue/server-renderer": "3.4.29", - "@vue/shared": "3.4.29" + "@vue/compiler-dom": "3.4.31", + "@vue/compiler-sfc": "3.4.31", + "@vue/runtime-dom": "3.4.31", + "@vue/server-renderer": "3.4.31", + "@vue/shared": "3.4.31" }, "peerDependencies": { "typescript": "*" @@ -6116,9 +6177,9 @@ } }, "node_modules/webpack": { - "version": "5.92.0", - "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.92.0.tgz", - "integrity": "sha512-Bsw2X39MYIgxouNATyVpCNVWBCuUwDgWtN78g6lSdPJRLaQ/PUVm/oXcaRAyY/sMFoKFQrsPeqvTizWtq7QPCA==", + "version": "5.92.1", + "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.92.1.tgz", + "integrity": "sha512-JECQ7IwJb+7fgUFBlrJzbyu3GEuNBcdqr1LD7IbSzwkSmIevTm8PF+wej3Oxuz/JFBUZ6O1o43zsPkwm1C4TmA==", "dev": true, "dependencies": { "@types/eslint-scope": "^3.7.3", diff --git a/package.json b/package.json index d0d4ac6..b9a1927 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "fohn-ui", - "version": "1.7.4", + "version": "1.8.0", "description": "Javascript library for Fohn-Ui php framework.", "main": "dist/fohn-ui.min.js", "files": [ @@ -13,7 +13,7 @@ "dev": "webpack --progress --watch --env development", "profile": "webpack --env production --profile --json > ./profile/fohn-ui-bundle-profile.json", "analyze-profile": "webpack-bundle-analyzer ./profile/fohn-ui-bundle-profile.json", - "lint": "eslint ./src", + "lint": "eslint", "lint-fix": "eslint ./src --fix" }, "author": "Alain Belair", @@ -54,6 +54,7 @@ "lodash.throttle": "^4.1.1", "mitt": "^3.0.0", "pinia": "^2.0.12", + "primevue": "^4.0.0-rc.2", "vue": "^3.2.24", "vue-flatpickr-component": "^11.0.3", "vue-toastification": "^2.0.0-rc.5" diff --git a/src/components/Tree/composable/tree.js b/src/components/Tree/composable/tree.js new file mode 100644 index 0000000..b5ed358 --- /dev/null +++ b/src/components/Tree/composable/tree.js @@ -0,0 +1,61 @@ +import apiService from '../../../services/api.service'; + +/** + * + * Convert all key value to string. + */ +const useStringKey = (nodes) => { + return nodes.map((node) => { + node.key = node.key.toString(); + if (node?.children?.length > 0) { + node.children = useStringKey(node.children); + } + + return node; + }); +}; + +/** + * + * When extendedNode is use, it adds some options to the node properties. + * Supported option are: + * - collapseIcons, + * - expandedIcons, + */ +const useExtendedNode = (nodes, options) => { + return nodes.map((node) => { + const extendedNode = { ...node, ...options }; + if (extendedNode.children && extendedNode.children.length > 0) { + extendedNode.children = useExtendedNode(extendedNode.children, options); + } + + return extendedNode; + }); +}; + +/** + * + * Post Data request. + * Request will send: + * - the current node key select by user, + * - the mode: either select or unselect, + * - an array of all key nodes selected, + * - the raw value of the entire tree node, + * + */ +const usePostData = (url, action, key, selectedKeys, treeValue) => { + const options = { + method: 'POST', + body: JSON.stringify({ __nodeAction: action, __nodeKey: key, __nodeKeys: selectedKeys, __treeValue: treeValue }), + }; + + const { data, onFetchFinally } = apiService.fetchAsResponse(url, options); + onFetchFinally(() => { + const js = data.value?.jsRendered; + if (js) { + apiService.evalResponse(js); + } + }); +}; + +export { useStringKey, useExtendedNode, usePostData }; diff --git a/src/components/Tree/tree.component.vue b/src/components/Tree/tree.component.vue new file mode 100644 index 0000000..4bd6f52 --- /dev/null +++ b/src/components/Tree/tree.component.vue @@ -0,0 +1,102 @@ + + + + + diff --git a/src/components/components-install.js b/src/components/components-install.js index 7f977d1..78ef730 100644 --- a/src/components/components-install.js +++ b/src/components/components-install.js @@ -22,6 +22,7 @@ import Dummy from './dummy.component.vue'; import Modal from './modal/modal.component.vue'; import Tabs from './tabs/tabs.component.vue'; import Tab from './tabs/tab.component.vue'; +import F_Tree from './Tree/tree.component.vue'; const fohnComponents = [ { name: 'flat-pickr', def: flatPickr }, @@ -48,6 +49,7 @@ const fohnComponents = [ { name: 'fohn-tab', def: Tab }, { name: 'fohn-tabs', def: Tabs }, { name: 'fohn-dummy', def: Dummy }, + { name: 'fohn-tree', def: F_Tree }, ]; export default { diff --git a/src/components/prime-install.js b/src/components/prime-install.js new file mode 100644 index 0000000..6b5f207 --- /dev/null +++ b/src/components/prime-install.js @@ -0,0 +1,25 @@ +/** + * Fohn-ui use some of PrimeVue component. + * + * Copyright (c) 2018-2024 PrimeTek + * https://github.com/primefaces/primevue + * + */ + +import BaseTree from 'primevue/tree'; +import Tree from 'primevue/tree'; +import TreeNode from 'primevue/tree'; + +const primeComponents = [ + { name: 'BaseTree', def: BaseTree }, + { name: 'Tree', def: Tree }, + { name: 'TreeNode', def: TreeNode }, +]; + +export default { + install: (app, options) => { + primeComponents.forEach((primeComponent) => { + app.component(primeComponent.name, primeComponent.def); + }); + }, +}; diff --git a/src/components/tree/composable/style.js b/src/components/tree/composable/style.js new file mode 100644 index 0000000..d783a6d --- /dev/null +++ b/src/components/tree/composable/style.js @@ -0,0 +1,9 @@ +const useHighlightColors = (color) => { + return color ? color : 'border-gray-200 bg-white'; +}; + +const useHoverColors = (color) => { + return color ? color : 'hover:bg-gray-200'; +}; + +export { useHighlightColors, useHoverColors }; diff --git a/src/presets/README.md b/src/presets/README.md new file mode 100644 index 0000000..4410d99 --- /dev/null +++ b/src/presets/README.md @@ -0,0 +1,5 @@ +This preset is a modification of PrimeVue Lara preset +adapt for Fohn-Ui. + +Copyright (c) 2018-2024 PrimeTek +https://github.com/primefaces/primevue diff --git a/src/presets/lara-fohn/badgedirective/index.js b/src/presets/lara-fohn/badgedirective/index.js new file mode 100644 index 0000000..8c085c3 --- /dev/null +++ b/src/presets/lara-fohn/badgedirective/index.js @@ -0,0 +1,43 @@ +export default { + root: ({ context }) => ({ + class: [ + // Font + 'font-bold', + 'text-xs leading-[normal]', + + // Alignment + 'flex items-center justify-center', + 'text-center', + + // Position + 'absolute top-0 right-0 transform translate-x-1/2 -translate-y-1/2 origin-top-right', + + // Size + 'm-0', + { + 'p-0': context.nogutter || context.dot, + 'px-2': !context.nogutter && !context.dot, + 'min-w-[0.5rem] w-2 h-2': context.dot, + 'min-w-[1.5rem] h-6': !context.dot, + }, + + // Shape + { + 'rounded-full': context.nogutter || context.dot, + 'rounded-[10px]': !context.nogutter && !context.dot, + }, + + // Color + 'text-primary-inverse', + { + 'bg-primary': !context.info && !context.success && !context.warning && !context.danger && !context.help && !context.secondary, + 'bg-surface-500 dark:bg-surface-400': context.secondary, + 'bg-green-500 dark:bg-green-400': context.success, + 'bg-blue-500 dark:bg-blue-400': context.info, + 'bg-orange-500 dark:bg-orange-400': context.warning, + 'bg-purple-500 dark:bg-purple-400': context.help, + 'bg-red-500 dark:bg-red-400': context.danger, + }, + ], + }), +}; diff --git a/src/presets/lara-fohn/global.js b/src/presets/lara-fohn/global.js new file mode 100644 index 0000000..c2f2129 --- /dev/null +++ b/src/presets/lara-fohn/global.js @@ -0,0 +1,90 @@ +export default { + css: ` + *[data-pd-ripple="true"]{ + overflow: hidden; + position: relative; + } + span[data-p-ink-active="true"]{ + animation: ripple 0.4s linear; + } + @keyframes ripple { + 100% { + opacity: 0; + transform: scale(2.5); + } + } + + .progress-spinner-circle { + stroke-dasharray: 89, 200; + stroke-dashoffset: 0; + animation: p-progress-spinner-dash 1.5s ease-in-out infinite, p-progress-spinner-color 6s ease-in-out infinite; + stroke-linecap: round; + } + + @keyframes p-progress-spinner-dash{ + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + + 50% { + stroke-dasharray: 89, 200; + stroke-dashoffset: -35px; + } + 100% { + stroke-dasharray: 89, 200; + stroke-dashoffset: -124px; + } + } + @keyframes p-progress-spinner-color { + 100%, 0% { + stroke: #ff5757; + } + 40% { + stroke: #696cff; + } + 66% { + stroke: #1ea97c; + } + 80%, 90% { + stroke: #cc8925; + } + } + + .progressbar-value-animate::after { + will-change: left, right; + animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; + } + .progressbar-value-animate::before { + will-change: left, right; + animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; + } + @keyframes p-progressbar-indeterminate-anim { + 0% { + left: -35%; + right: 100%; + } + 60% { + left: 100%; + right: -90%; + } + 100% { + left: 100%; + right: -90%; + } + } + + .p-fadein { + animation: p-fadein 250ms linear; + } + + @keyframes p-fadein { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } + } +`, +}; diff --git a/src/presets/lara-fohn/index.js b/src/presets/lara-fohn/index.js new file mode 100644 index 0000000..7d254df --- /dev/null +++ b/src/presets/lara-fohn/index.js @@ -0,0 +1,18 @@ +import global from './global'; +import ripple from './ripple'; +import tooltip from './tooltip'; +import tree from './tree'; +import badgedirective from './badgedirective'; + +export default { + global, + directives: { + badge: badgedirective, + ripple, + tooltip, + }, + + tree, + toolbar, + menubar, +}; diff --git a/src/presets/lara-fohn/ripple/index.js b/src/presets/lara-fohn/ripple/index.js new file mode 100644 index 0000000..a373304 --- /dev/null +++ b/src/presets/lara-fohn/ripple/index.js @@ -0,0 +1,6 @@ +export default { + root: { + class: ['block absolute bg-surface-0/50 rounded-full pointer-events-none'], + style: 'transform: scale(0)', + }, +}; diff --git a/src/presets/lara-fohn/tooltip/index.js b/src/presets/lara-fohn/tooltip/index.js new file mode 100644 index 0000000..5b4f25d --- /dev/null +++ b/src/presets/lara-fohn/tooltip/index.js @@ -0,0 +1,46 @@ +export default { + root: ({ context, props }) => ({ + class: [ + // Position and Shadows + 'absolute', + 'shadow-md', + 'p-fadein', + // Spacing + { + 'py-0 px-1': context?.right || context?.left || (!context?.right && !context?.left && !context?.top && !context?.bottom), + 'py-1 px-0': context?.top || context?.bottom, + }, + ], + }), + arrow: ({ context, props }) => ({ + class: [ + // Position + + 'absolute', + + // Size + 'w-0', + 'h-0', + + // Shape + 'border-transparent', + 'border-solid', + { + 'border-y-[0.25rem] border-r-[0.25rem] border-l-0 border-r-surface-600': context?.right || (!context?.right && !context?.left && !context?.top && !context?.bottom), + 'border-y-[0.25rem] border-l-[0.25rem] border-r-0 border-l-surface-600': context?.left, + 'border-x-[0.25rem] border-t-[0.25rem] border-b-0 border-t-surface-600': context?.top, + 'border-x-[0.25rem] border-b-[0.25rem] border-t-0 border-b-surface-600': context?.bottom, + }, + + // Spacing + { + '-mt-1 ': context?.right || (!context?.right && !context?.left && !context?.top && !context?.bottom), + '-mt-1': context?.left, + '-ml-1': context?.top || context?.bottom, + }, + ], + }), + text: { + class: ['p-3', 'bg-surface-600 dark:bg-surface-700', 'text-white', 'leading-none', 'rounded-md', 'whitespace-pre-line', 'break-words'], + }, +}; diff --git a/src/presets/lara-fohn/tree/index.js b/src/presets/lara-fohn/tree/index.js new file mode 100644 index 0000000..726bc15 --- /dev/null +++ b/src/presets/lara-fohn/tree/index.js @@ -0,0 +1,164 @@ +import { useHighlightColors, useHoverColors } from '../../../components/tree/composable/style'; + +export default { + root: { + class: [], + }, + wrapper: { + class: ['overflow-auto'], + }, + node: { + class: ['p-1', 'rounded-md'], + }, + nodeChildren: ({ props }) => { + return { + class: props?.pt?.nodeChildrenClass || ['ml-2'], + }; + }, + nodeToggleButton: ({ context }) => ({ + class: [ + { invisible: context.leaf }, + ], + }), + nodeToggleIcon: ({ props, context, instance }) => { + let iconClass = []; + if (props.node?.collapsedIcon && props.node?.expandedIcon) { + iconClass = [ + { [props.node.collapsedIcon]: !context.expanded }, + { [props.node.expandedIcon]: context.expanded }, + ]; + } + return { + class: iconClass, + }; + }, + nodeContent: ({ context, props, instance }) => { + const selectedColors = useHighlightColors(props?.pt?.selectedColors); + const hoverColor = useHoverColors(props?.pt?.hoverColors); + + return { + class: [ + // Flex and Alignment + 'flex items-center', + + // Shape + 'rounded-md', + + // Spacing + 'px-2', + + // Colors + // 'text-surface-600 dark:text-white/70', + { [selectedColors]: context.selected }, + + // States + { + [hoverColor]: (props.selectionMode === 'single' || props.selectionMode === 'multiple') && !context.selected, + 'opacity-30': (props.node.selectable === false) && context.leaf && props.selectionMode !== 'checkbox', + }, + + // Transition + 'transition-shadow duration-200', + + { 'cursor-pointer select-none': props.selectionMode === 'single' || props.selectionMode === 'multiple' }, + ], + }; + }, + nodeCheckbox: ({ props, context, instance }) => { + const boxColors = useHighlightColors(useHighlightColors(props?.pt?.selectedColors)); + return { + root: { + class: [ + 'relative', + + // Alignment + 'inline-flex', + 'align-bottom', + + // Size + 'w-5', + 'h-5', + + // Spacing + 'mx-1', + + // Misc + 'cursor-pointer', + 'select-none', + ], + }, + box: { + class: [ + // Alignment + 'flex', + 'items-center', + 'justify-center', + + // Size + 'w-5', + 'h-5', + + // Shape + 'rounded-md', + 'border', + + // Colors + { + [boxColors]: context.checked, + }, + + // States + { + 'peer-hover:border-gray-300': !props.disabled && !context.checked, + 'cursor-default opacity-60': props.disabled, + }, + + // Transitions + 'transition-colors', + 'duration-200', + ], + }, + input: { + class: [ + 'peer', + + // Size + 'w-full ', + 'h-full', + + // Position + 'absolute', + 'top-0 left-0', + 'z-10', + + // Spacing + 'p-0', + 'm-0', + + // Shape + 'opacity-0', + 'rounded-md', + 'outline-none', + + // Misc + 'appearance-none', + 'cursor-pointer', + ], + }, + }; + }, + nodeicon: { + class: ['mx-2'], + }, + pcFilterContainer: { + class: ['relative block', 'mb-2', 'w-full'], + }, + pcFilterInput: ({ props }) => { + return { + class: props.pt.filterInputClass, + }; + }, + loadingicon: { + class: ['absolute top-[50%] right-[50%] -mt-2 -mr-2 animate-spin'], + }, +}; diff --git a/src/services/vue.service.js b/src/services/vue.service.js index b70cf1c..dcfa399 100644 --- a/src/services/vue.service.js +++ b/src/services/vue.service.js @@ -1,8 +1,11 @@ import { createApp, defineAsyncComponent, ref } from 'vue'; import { createPinia } from 'pinia'; +import PrimeVue from 'primevue/config'; +import Lara from '../presets/lara-fohn'; import ClickOutside from '../directives/click-outside.directive'; import { focus, resize, esc } from '../directives/commons.directive'; import Components from '../components/components-install'; +import PrimeComponents from '../components/prime-install'; import jQuery from 'jQuery'; import fohn from '../fohn-ui'; @@ -107,8 +110,12 @@ class VueService { }, }); + app.use(PrimeVue, { unstyled: true, pt: Lara }); + // app.use(PrimeVue, { unstyled: true, theme: { preset: Lara } }); + app.use(this.piniaStore); app.use(Components); + app.use(PrimeComponents); // setup fohn custom directives. directives.forEach((directive) => { app.directive(directive.name, directive.def); diff --git a/webpack.config.js b/webpack.config.js index 4ecb108..64c2440 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -109,6 +109,7 @@ module.exports = (env) => { extensions: [ '.json', '.js', + '.vue', ], }, plugins: [