diff --git a/.vscode/settings.json b/.vscode/settings.json index c55d22e11e..661106f3d9 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -11,6 +11,7 @@ "lucide", "Niels", "pickable", + "popovertarget", "Registrator", "svgs", "templating", diff --git a/package-lock.json b/package-lock.json index f79734b24d..bf99307417 100644 --- a/package-lock.json +++ b/package-lock.json @@ -43,15 +43,15 @@ "@types/chai": "^4.3.5", "@types/lodash-es": "^4.17.8", "@types/mocha": "^10.0.1", - "@typescript-eslint/eslint-plugin": "^6.3.0", - "@typescript-eslint/parser": "^6.5.0", + "@typescript-eslint/eslint-plugin": "^6.13.2", + "@typescript-eslint/parser": "^6.13.2", "@web/dev-server-esbuild": "^0.4.1", "@web/dev-server-import-maps": "^0.1.1", "@web/dev-server-rollup": "^0.6.0", "@web/test-runner": "^0.18.0", "@web/test-runner-playwright": "^0.10.1", "babel-loader": "^9.1.3", - "eslint": "^8.46.0", + "eslint": "^8.55.0", "eslint-config-prettier": "^9.0.0", "eslint-import-resolver-typescript": "^3.6.0", "eslint-plugin-import": "^2.28.0", @@ -77,7 +77,7 @@ "storybook": "7.6.3", "tiny-glob": "^0.2.9", "tsc-alias": "^1.8.8", - "typescript": "^5.1.6", + "typescript": "^5.3.2", "typescript-json-schema": "^0.62.0", "vite": "^4.4.9", "vite-plugin-static-copy": "^0.17.0", @@ -2505,9 +2505,9 @@ } }, "node_modules/@eslint/eslintrc": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.1.tgz", - "integrity": "sha512-9t7ZA7NGGK8ckelF0PQCfcxIUzs1Md5rrO6U/c+FIQNanea5UZC0wqKXH4vHBccmu4ZJgZ2idtPeW7+Q2npOEA==", + "version": "2.1.4", + "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.4.tgz", + "integrity": "sha512-269Z39MS6wVJtsoUl10L60WdkhJVdPG24Q4eZTH3nnF6lpvSShEK3wQjDX9JRWAUPvPh7COouPpU9IrqaZFvtQ==", "dev": true, "dependencies": { "ajv": "^6.12.4", @@ -2534,9 +2534,9 @@ "dev": true }, "node_modules/@eslint/eslintrc/node_modules/globals": { - "version": "13.20.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-13.20.0.tgz", - "integrity": "sha512-Qg5QtVkCy/kv3FUSlu4ukeZDVf9ee0iXLAUYX13gbR17bnejFTzr4iS9bY7kwCf1NztRNm1t91fjOiyx4CSwPQ==", + "version": "13.23.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz", + "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==", "dev": true, "dependencies": { "type-fest": "^0.20.2" @@ -2573,9 +2573,9 @@ } }, "node_modules/@eslint/js": { - "version": "8.46.0", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.46.0.tgz", - "integrity": "sha512-a8TLtmPi8xzPkCbp/OGFUo5yhRkHM2Ko9kOWP4znJr0WAhWyThaw3PnwX4vOTWOAMsV2uRt32PPDcEz63esSaA==", + "version": "8.55.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.55.0.tgz", + "integrity": "sha512-qQfo2mxH5yVom1kacMtZZJFVdW+E70mqHMJvVg6WTLo+VBuQJ4TojZlfWBjK0ve5BdEeNAVxOsl/nvNMpJOaJA==", "dev": true, "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" @@ -2635,12 +2635,12 @@ "dev": true }, "node_modules/@humanwhocodes/config-array": { - "version": "0.11.10", - "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.10.tgz", - "integrity": "sha512-KVVjQmNUepDVGXNuoRRdmmEjruj0KfiGSbS8LVc12LMsWDQzRXJ0qdhN8L8uUigKpfEHRhlaQFY0ib1tnUbNeQ==", + "version": "0.11.13", + "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.13.tgz", + "integrity": "sha512-JSBDMiDKSzQVngfRjOdFXgFfklaXI4K9nLF49Auh21lmBWRLIK3+xTErTWD4KU54pb6coM6ESE7Awz/FNU3zgQ==", "dev": true, "dependencies": { - "@humanwhocodes/object-schema": "^1.2.1", + "@humanwhocodes/object-schema": "^2.0.1", "debug": "^4.1.1", "minimatch": "^3.0.5" }, @@ -2662,9 +2662,9 @@ } }, "node_modules/@humanwhocodes/object-schema": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz", - "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.1.tgz", + "integrity": "sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==", "dev": true }, "node_modules/@import-maps/resolve": { @@ -7218,21 +7218,20 @@ } }, "node_modules/@typescript-eslint/eslint-plugin": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.3.0.tgz", - "integrity": "sha512-IZYjYZ0ifGSLZbwMqIip/nOamFiWJ9AH+T/GYNZBWkVcyNQOFGtSMoWV7RvY4poYCMZ/4lHzNl796WOSNxmk8A==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.13.2.tgz", + "integrity": "sha512-3+9OGAWHhk4O1LlcwLBONbdXsAhLjyCFogJY/cWy2lxdVJ2JrcTF2pTGMaLl2AE7U1l31n8Py4a8bx5DLf/0dQ==", "dev": true, "dependencies": { "@eslint-community/regexpp": "^4.5.1", - "@typescript-eslint/scope-manager": "6.3.0", - "@typescript-eslint/type-utils": "6.3.0", - "@typescript-eslint/utils": "6.3.0", - "@typescript-eslint/visitor-keys": "6.3.0", + "@typescript-eslint/scope-manager": "6.13.2", + "@typescript-eslint/type-utils": "6.13.2", + "@typescript-eslint/utils": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2", "debug": "^4.3.4", "graphemer": "^1.4.0", "ignore": "^5.2.4", "natural-compare": "^1.4.0", - "natural-compare-lite": "^1.4.0", "semver": "^7.5.4", "ts-api-utils": "^1.0.1" }, @@ -7254,13 +7253,13 @@ } }, "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/scope-manager": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.3.0.tgz", - "integrity": "sha512-WlNFgBEuGu74ahrXzgefiz/QlVb+qg8KDTpknKwR7hMH+lQygWyx0CQFoUmMn1zDkQjTBBIn75IxtWss77iBIQ==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.13.2.tgz", + "integrity": "sha512-CXQA0xo7z6x13FeDYCgBkjWzNqzBn8RXaE3QVQVIUm74fWJLkJkaHmHdKStrxQllGh6Q4eUGyNpMe0b1hMkXFA==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.3.0", - "@typescript-eslint/visitor-keys": "6.3.0" + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2" }, "engines": { "node": "^16.0.0 || >=18.0.0" @@ -7271,9 +7270,9 @@ } }, "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/types": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.3.0.tgz", - "integrity": "sha512-K6TZOvfVyc7MO9j60MkRNWyFSf86IbOatTKGrpTQnzarDZPYPVy0oe3myTMq7VjhfsUAbNUW8I5s+2lZvtx1gg==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.13.2.tgz", + "integrity": "sha512-7sxbQ+EMRubQc3wTfTsycgYpSujyVbI1xw+3UMRUcrhSy+pN09y/lWzeKDbvhoqcRbHdc+APLs/PWYi/cisLPg==", "dev": true, "engines": { "node": "^16.0.0 || >=18.0.0" @@ -7284,13 +7283,13 @@ } }, "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/typescript-estree": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.3.0.tgz", - "integrity": "sha512-Xh4NVDaC4eYKY4O3QGPuQNp5NxBAlEvNQYOqJquR2MePNxO11E5K3t5x4M4Mx53IZvtpW+mBxIT0s274fLUocg==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.13.2.tgz", + "integrity": "sha512-SuD8YLQv6WHnOEtKv8D6HZUzOub855cfPnPMKvdM/Bh1plv1f7Q/0iFUDLKKlxHcEstQnaUU4QZskgQq74t+3w==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.3.0", - "@typescript-eslint/visitor-keys": "6.3.0", + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2", "debug": "^4.3.4", "globby": "^11.1.0", "is-glob": "^4.0.3", @@ -7311,17 +7310,17 @@ } }, "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/utils": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-6.3.0.tgz", - "integrity": "sha512-hLLg3BZE07XHnpzglNBG8P/IXq/ZVXraEbgY7FM0Cnc1ehM8RMdn9mat3LubJ3KBeYXXPxV1nugWbQPjGeJk6Q==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-6.13.2.tgz", + "integrity": "sha512-b9Ptq4eAZUym4idijCRzl61oPCwwREcfDI8xGk751Vhzig5fFZR9CyzDz4Sp/nxSLBYxUPyh4QdIDqWykFhNmQ==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", "@types/json-schema": "^7.0.12", "@types/semver": "^7.5.0", - "@typescript-eslint/scope-manager": "6.3.0", - "@typescript-eslint/types": "6.3.0", - "@typescript-eslint/typescript-estree": "6.3.0", + "@typescript-eslint/scope-manager": "6.13.2", + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/typescript-estree": "6.13.2", "semver": "^7.5.4" }, "engines": { @@ -7336,12 +7335,12 @@ } }, "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/visitor-keys": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.3.0.tgz", - "integrity": "sha512-kEhRRj7HnvaSjux1J9+7dBen15CdWmDnwrpyiHsFX6Qx2iW5LOBUgNefOFeh2PjWPlNwN8TOn6+4eBU3J/gupw==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.13.2.tgz", + "integrity": "sha512-OGznFs0eAQXJsp+xSd6k/O1UbFi/K/L7WjqeRoFE7vadjAF9y0uppXhYNQNEqygjou782maGClOoZwPqF0Drlw==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.3.0", + "@typescript-eslint/types": "6.13.2", "eslint-visitor-keys": "^3.4.1" }, "engines": { @@ -7386,15 +7385,15 @@ "dev": true }, "node_modules/@typescript-eslint/parser": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.5.0.tgz", - "integrity": "sha512-LMAVtR5GN8nY0G0BadkG0XIe4AcNMeyEy3DyhKGAh9k4pLSMBO7rF29JvDBpZGCmp5Pgz5RLHP6eCpSYZJQDuQ==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.13.2.tgz", + "integrity": "sha512-MUkcC+7Wt/QOGeVlM8aGGJZy1XV5YKjTpq9jK6r6/iLsGXhBVaGP5N0UYvFsu9BFlSpwY9kMretzdBH01rkRXg==", "dev": true, "dependencies": { - "@typescript-eslint/scope-manager": "6.5.0", - "@typescript-eslint/types": "6.5.0", - "@typescript-eslint/typescript-estree": "6.5.0", - "@typescript-eslint/visitor-keys": "6.5.0", + "@typescript-eslint/scope-manager": "6.13.2", + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/typescript-estree": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2", "debug": "^4.3.4" }, "engines": { @@ -7414,13 +7413,13 @@ } }, "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/scope-manager": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.5.0.tgz", - "integrity": "sha512-A8hZ7OlxURricpycp5kdPTH3XnjG85UpJS6Fn4VzeoH4T388gQJ/PGP4ole5NfKt4WDVhmLaQ/dBLNDC4Xl/Kw==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.13.2.tgz", + "integrity": "sha512-CXQA0xo7z6x13FeDYCgBkjWzNqzBn8RXaE3QVQVIUm74fWJLkJkaHmHdKStrxQllGh6Q4eUGyNpMe0b1hMkXFA==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.5.0", - "@typescript-eslint/visitor-keys": "6.5.0" + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2" }, "engines": { "node": "^16.0.0 || >=18.0.0" @@ -7431,9 +7430,9 @@ } }, "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/types": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.5.0.tgz", - "integrity": "sha512-eqLLOEF5/lU8jW3Bw+8auf4lZSbbljHR2saKnYqON12G/WsJrGeeDHWuQePoEf9ro22+JkbPfWQwKEC5WwLQ3w==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.13.2.tgz", + "integrity": "sha512-7sxbQ+EMRubQc3wTfTsycgYpSujyVbI1xw+3UMRUcrhSy+pN09y/lWzeKDbvhoqcRbHdc+APLs/PWYi/cisLPg==", "dev": true, "engines": { "node": "^16.0.0 || >=18.0.0" @@ -7444,13 +7443,13 @@ } }, "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/typescript-estree": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.5.0.tgz", - "integrity": "sha512-q0rGwSe9e5Kk/XzliB9h2LBc9tmXX25G0833r7kffbl5437FPWb2tbpIV9wAATebC/018pGa9fwPDuvGN+LxWQ==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.13.2.tgz", + "integrity": "sha512-SuD8YLQv6WHnOEtKv8D6HZUzOub855cfPnPMKvdM/Bh1plv1f7Q/0iFUDLKKlxHcEstQnaUU4QZskgQq74t+3w==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.5.0", - "@typescript-eslint/visitor-keys": "6.5.0", + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2", "debug": "^4.3.4", "globby": "^11.1.0", "is-glob": "^4.0.3", @@ -7471,12 +7470,12 @@ } }, "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/visitor-keys": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.5.0.tgz", - "integrity": "sha512-yCB/2wkbv3hPsh02ZS8dFQnij9VVQXJMN/gbQsaaY+zxALkZnxa/wagvLEFsAWMPv7d7lxQmNsIzGU1w/T/WyA==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.13.2.tgz", + "integrity": "sha512-OGznFs0eAQXJsp+xSd6k/O1UbFi/K/L7WjqeRoFE7vadjAF9y0uppXhYNQNEqygjou782maGClOoZwPqF0Drlw==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.5.0", + "@typescript-eslint/types": "6.13.2", "eslint-visitor-keys": "^3.4.1" }, "engines": { @@ -7538,13 +7537,13 @@ } }, "node_modules/@typescript-eslint/type-utils": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-6.3.0.tgz", - "integrity": "sha512-7Oj+1ox1T2Yc8PKpBvOKWhoI/4rWFd1j7FA/rPE0lbBPXTKjdbtC+7Ev0SeBjEKkIhKWVeZSP+mR7y1Db1CdfQ==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-6.13.2.tgz", + "integrity": "sha512-Qr6ssS1GFongzH2qfnWKkAQmMUyZSyOr0W54nZNU1MDfo+U4Mv3XveeLZzadc/yq8iYhQZHYT+eoXJqnACM1tw==", "dev": true, "dependencies": { - "@typescript-eslint/typescript-estree": "6.3.0", - "@typescript-eslint/utils": "6.3.0", + "@typescript-eslint/typescript-estree": "6.13.2", + "@typescript-eslint/utils": "6.13.2", "debug": "^4.3.4", "ts-api-utils": "^1.0.1" }, @@ -7565,13 +7564,13 @@ } }, "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/scope-manager": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.3.0.tgz", - "integrity": "sha512-WlNFgBEuGu74ahrXzgefiz/QlVb+qg8KDTpknKwR7hMH+lQygWyx0CQFoUmMn1zDkQjTBBIn75IxtWss77iBIQ==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.13.2.tgz", + "integrity": "sha512-CXQA0xo7z6x13FeDYCgBkjWzNqzBn8RXaE3QVQVIUm74fWJLkJkaHmHdKStrxQllGh6Q4eUGyNpMe0b1hMkXFA==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.3.0", - "@typescript-eslint/visitor-keys": "6.3.0" + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2" }, "engines": { "node": "^16.0.0 || >=18.0.0" @@ -7582,9 +7581,9 @@ } }, "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/types": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.3.0.tgz", - "integrity": "sha512-K6TZOvfVyc7MO9j60MkRNWyFSf86IbOatTKGrpTQnzarDZPYPVy0oe3myTMq7VjhfsUAbNUW8I5s+2lZvtx1gg==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.13.2.tgz", + "integrity": "sha512-7sxbQ+EMRubQc3wTfTsycgYpSujyVbI1xw+3UMRUcrhSy+pN09y/lWzeKDbvhoqcRbHdc+APLs/PWYi/cisLPg==", "dev": true, "engines": { "node": "^16.0.0 || >=18.0.0" @@ -7595,13 +7594,13 @@ } }, "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/typescript-estree": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.3.0.tgz", - "integrity": "sha512-Xh4NVDaC4eYKY4O3QGPuQNp5NxBAlEvNQYOqJquR2MePNxO11E5K3t5x4M4Mx53IZvtpW+mBxIT0s274fLUocg==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.13.2.tgz", + "integrity": "sha512-SuD8YLQv6WHnOEtKv8D6HZUzOub855cfPnPMKvdM/Bh1plv1f7Q/0iFUDLKKlxHcEstQnaUU4QZskgQq74t+3w==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.3.0", - "@typescript-eslint/visitor-keys": "6.3.0", + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/visitor-keys": "6.13.2", "debug": "^4.3.4", "globby": "^11.1.0", "is-glob": "^4.0.3", @@ -7622,17 +7621,17 @@ } }, "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/utils": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-6.3.0.tgz", - "integrity": "sha512-hLLg3BZE07XHnpzglNBG8P/IXq/ZVXraEbgY7FM0Cnc1ehM8RMdn9mat3LubJ3KBeYXXPxV1nugWbQPjGeJk6Q==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-6.13.2.tgz", + "integrity": "sha512-b9Ptq4eAZUym4idijCRzl61oPCwwREcfDI8xGk751Vhzig5fFZR9CyzDz4Sp/nxSLBYxUPyh4QdIDqWykFhNmQ==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", "@types/json-schema": "^7.0.12", "@types/semver": "^7.5.0", - "@typescript-eslint/scope-manager": "6.3.0", - "@typescript-eslint/types": "6.3.0", - "@typescript-eslint/typescript-estree": "6.3.0", + "@typescript-eslint/scope-manager": "6.13.2", + "@typescript-eslint/types": "6.13.2", + "@typescript-eslint/typescript-estree": "6.13.2", "semver": "^7.5.4" }, "engines": { @@ -7647,12 +7646,12 @@ } }, "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/visitor-keys": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.3.0.tgz", - "integrity": "sha512-kEhRRj7HnvaSjux1J9+7dBen15CdWmDnwrpyiHsFX6Qx2iW5LOBUgNefOFeh2PjWPlNwN8TOn6+4eBU3J/gupw==", + "version": "6.13.2", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.13.2.tgz", + "integrity": "sha512-OGznFs0eAQXJsp+xSd6k/O1UbFi/K/L7WjqeRoFE7vadjAF9y0uppXhYNQNEqygjou782maGClOoZwPqF0Drlw==", "dev": true, "dependencies": { - "@typescript-eslint/types": "6.3.0", + "@typescript-eslint/types": "6.13.2", "eslint-visitor-keys": "^3.4.1" }, "engines": { @@ -8675,6 +8674,12 @@ "@umbraco-ui/uui-base": "1.6.0-rc.1" } }, + "node_modules/@ungap/structured-clone": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz", + "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==", + "dev": true + }, "node_modules/@web/browser-logs": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/@web/browser-logs/-/browser-logs-0.3.3.tgz", @@ -12207,18 +12212,19 @@ } }, "node_modules/eslint": { - "version": "8.46.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.46.0.tgz", - "integrity": "sha512-cIO74PvbW0qU8e0mIvk5IV3ToWdCq5FYG6gWPHHkx6gNdjlbAYvtfHmlCMXxjcoVaIdwy/IAt3+mDkZkfvb2Dg==", + "version": "8.55.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.55.0.tgz", + "integrity": "sha512-iyUUAM0PCKj5QpwGfmCAG9XXbZCWsqP/eWAWrG/W0umvjuLRBECwSFdt+rCntju0xEH7teIABPwXpahftIaTdA==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", - "@eslint/eslintrc": "^2.1.1", - "@eslint/js": "^8.46.0", - "@humanwhocodes/config-array": "^0.11.10", + "@eslint/eslintrc": "^2.1.4", + "@eslint/js": "8.55.0", + "@humanwhocodes/config-array": "^0.11.13", "@humanwhocodes/module-importer": "^1.0.1", "@nodelib/fs.walk": "^1.2.8", + "@ungap/structured-clone": "^1.2.0", "ajv": "^6.12.4", "chalk": "^4.0.0", "cross-spawn": "^7.0.2", @@ -12226,7 +12232,7 @@ "doctrine": "^3.0.0", "escape-string-regexp": "^4.0.0", "eslint-scope": "^7.2.2", - "eslint-visitor-keys": "^3.4.2", + "eslint-visitor-keys": "^3.4.3", "espree": "^9.6.1", "esquery": "^1.4.2", "esutils": "^2.0.2", @@ -12520,9 +12526,9 @@ } }, "node_modules/eslint-visitor-keys": { - "version": "3.4.2", - "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.2.tgz", - "integrity": "sha512-8drBzUEyZ2llkpCA67iYrgEssKDUu68V8ChqqOfFupIaG/LCVPUT+CoGJpT77zJprs4T/W7p07LP7zAIMuweVw==", + "version": "3.4.3", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz", + "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==", "dev": true, "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" @@ -17403,12 +17409,6 @@ "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==", "dev": true }, - "node_modules/natural-compare-lite": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz", - "integrity": "sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==", - "dev": true - }, "node_modules/negotiator": { "version": "0.6.3", "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz", @@ -21315,9 +21315,9 @@ "dev": true }, "node_modules/typescript": { - "version": "5.1.6", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.6.tgz", - "integrity": "sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==", + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.2.tgz", + "integrity": "sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ==", "dev": true, "bin": { "tsc": "bin/tsc", @@ -21366,6 +21366,19 @@ "url": "https://github.com/sponsors/isaacs" } }, + "node_modules/typescript-json-schema/node_modules/typescript": { + "version": "5.1.6", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.6.tgz", + "integrity": "sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==", + "dev": true, + "bin": { + "tsc": "bin/tsc", + "tsserver": "bin/tsserver" + }, + "engines": { + "node": ">=14.17" + } + }, "node_modules/typical": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/typical/-/typical-4.0.0.tgz", diff --git a/package.json b/package.json index 3b32b1276d..971683b4be 100644 --- a/package.json +++ b/package.json @@ -164,8 +164,8 @@ "@types/chai": "^4.3.5", "@types/lodash-es": "^4.17.8", "@types/mocha": "^10.0.1", - "@typescript-eslint/eslint-plugin": "^6.3.0", - "@typescript-eslint/parser": "^6.5.0", + "@typescript-eslint/eslint-plugin": "^6.13.2", + "@typescript-eslint/parser": "^6.13.2", "@web/dev-server-esbuild": "^0.4.1", "@web/dev-server-import-maps": "^0.1.1", "@web/dev-server-rollup": "^0.6.0", @@ -180,7 +180,7 @@ "eslint-plugin-local-rules": "^1.3.2", "eslint-plugin-storybook": "^0.6.15", "eslint-plugin-wc": "^2.0.4", - "eslint": "^8.46.0", + "eslint": "^8.55.0", "lucide-static": "^0.290.0", "msw": "^1.2.3", "openapi-typescript-codegen": "^0.25.0", @@ -199,7 +199,7 @@ "tiny-glob": "^0.2.9", "tsc-alias": "^1.8.8", "typescript-json-schema": "^0.62.0", - "typescript": "^5.1.6", + "typescript": "^5.3.2", "vite-plugin-static-copy": "^0.17.0", "vite-tsconfig-paths": "^4.2.0", "vite": "^4.4.9", diff --git a/src/apps/backoffice/components/backoffice-header-sections.element.ts b/src/apps/backoffice/components/backoffice-header-sections.element.ts index 3f8762fb65..c2c7c77ce8 100644 --- a/src/apps/backoffice/components/backoffice-header-sections.element.ts +++ b/src/apps/backoffice/components/backoffice-header-sections.element.ts @@ -1,6 +1,6 @@ import { UMB_BACKOFFICE_CONTEXT_TOKEN } from '../backoffice.context.js'; import type { UmbBackofficeContext } from '../backoffice.context.js'; -import { css, CSSResultGroup, html, when, customElement, state, repeat } from '@umbraco-cms/backoffice/external/lit'; +import { css, CSSResultGroup, html, customElement, state, repeat } from '@umbraco-cms/backoffice/external/lit'; import type { ManifestSection } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbExtensionManifestInitializer } from '@umbraco-cms/backoffice/extension-api'; @@ -28,22 +28,30 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement { private _observeSections() { if (!this._backofficeContext) return; - this.observe(this._backofficeContext.allowedSections, (allowedSections) => { - const oldValue = this._sections; - this._sections = allowedSections; - this.requestUpdate('_sections', oldValue); - }); + this.observe( + this._backofficeContext.allowedSections, + (allowedSections) => { + const oldValue = this._sections; + this._sections = allowedSections; + this.requestUpdate('_sections', oldValue); + }, + 'observeSections', + ); } private _observeCurrentSection() { if (!this._backofficeContext) return; - this.observe(this._backofficeContext.activeSectionAlias, (currentSectionAlias) => { - this._currentSectionAlias = currentSectionAlias || ''; - }); + this.observe( + this._backofficeContext.activeSectionAlias, + (currentSectionAlias) => { + this._currentSectionAlias = currentSectionAlias || ''; + }, + 'observeCurrentSection', + ); } - private _renderSections() { + render() { return html` ${repeat( @@ -60,10 +68,6 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement { `; } - render() { - return html` ${this._renderSections()} `; - } - static styles: CSSResultGroup = [ css` :host { diff --git a/src/apps/backoffice/components/backoffice-main.element.ts b/src/apps/backoffice/components/backoffice-main.element.ts index 46bb96b2c6..f319f9d9e3 100644 --- a/src/apps/backoffice/components/backoffice-main.element.ts +++ b/src/apps/backoffice/components/backoffice-main.element.ts @@ -3,9 +3,7 @@ import { css, html, customElement, state } from '@umbraco-cms/backoffice/externa import { UmbSectionContext, UMB_SECTION_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/section'; import type { UmbRoute, UmbRouterSlotChangeEvent } from '@umbraco-cms/backoffice/router'; import type { ManifestSection, UmbSectionElement } from '@umbraco-cms/backoffice/extension-registry'; -import { - UmbExtensionManifestInitializer, createExtensionElement -} from '@umbraco-cms/backoffice/extension-api'; +import { UmbExtensionManifestInitializer, createExtensionElement } from '@umbraco-cms/backoffice/extension-api'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @customElement('umb-backoffice-main') @@ -37,7 +35,7 @@ export class UmbBackofficeMainElement extends UmbLitElement { this._sections = sections; this._createRoutes(); }, - 'observeAllowedSections' + 'observeAllowedSections', ); } } @@ -47,21 +45,23 @@ export class UmbBackofficeMainElement extends UmbLitElement { const oldValue = this._routes; // TODO: Refactor this for re-use across the app where the routes are re-generated at any time. - this._routes = this._sections.filter(x => x.manifest).map((section) => { - const existingRoute = this._routes.find((r) => r.alias === section.alias); - if (existingRoute) { - return existingRoute; - } else { - return { - alias: section.alias, - path: this._routePrefix + (section.manifest as ManifestSection).meta.pathname, - component: () => createExtensionElement(section.manifest!, 'umb-section-default'), - setup: (component) => { - (component as UmbSectionElement).manifest = section.manifest as ManifestSection; - }, - }; - } - }); + this._routes = this._sections + .filter((x) => x.manifest) + .map((section) => { + const existingRoute = this._routes.find((r) => r.alias === section.alias); + if (existingRoute) { + return existingRoute; + } else { + return { + alias: section.alias, + path: this._routePrefix + (section.manifest as ManifestSection).meta.pathname, + component: () => createExtensionElement(section.manifest!, 'umb-section-default'), + setup: (component) => { + (component as UmbSectionElement).manifest = section.manifest as ManifestSection; + }, + }; + } + }); if (this._sections.length > 0) { this._routes.push({ @@ -79,7 +79,7 @@ export class UmbBackofficeMainElement extends UmbLitElement { const section = this._sections.find((s) => this._routePrefix + (s.manifest as any).meta.pathname === currentPath); if (!section) return; await section.asPromise(); - if(section.manifest) { + if (section.manifest) { this._backofficeContext?.setActiveSectionAlias(section.alias); this._provideSectionContext(section.manifest); } @@ -105,7 +105,9 @@ export class UmbBackofficeMainElement extends UmbLitElement { :host { background-color: var(--uui-color-background); display: block; - height: calc(100% - 60px); // 60 => top header height, TODO: Make sure this comes from somewhere so it is maintainable and eventually responsive. + height: calc( + 100% - 60px + ); // 60 => top header height, TODO: Make sure this comes from somewhere so it is maintainable and eventually responsive. } `, ]; diff --git a/src/apps/installer/database/installer-database.element.ts b/src/apps/installer/database/installer-database.element.ts index e3448233c0..45525cd576 100644 --- a/src/apps/installer/database/installer-database.element.ts +++ b/src/apps/installer/database/installer-database.element.ts @@ -169,7 +169,7 @@ export class UmbInstallerDatabaseElement extends UmbLitElement { }; const { error } = await tryExecute( - InstallResource.postInstallValidateDatabase({ requestBody: databaseDetails }) + InstallResource.postInstallValidateDatabase({ requestBody: databaseDetails }), ); if (error) { @@ -199,7 +199,7 @@ export class UmbInstallerDatabaseElement extends UmbLitElement { this._installerContext.nextStep(); const { error } = await tryExecute( - InstallResource.postInstallSetup({ requestBody: this._installerContext.getData() }) + InstallResource.postInstallSetup({ requestBody: this._installerContext.getData() }), ); if (error) { @@ -243,7 +243,7 @@ export class UmbInstallerDatabaseElement extends UmbLitElement { } result.push( - this._renderDatabaseName(this.databaseFormData.name ?? this._selectedDatabase.defaultDatabaseName ?? 'umbraco') + this._renderDatabaseName(this.databaseFormData.name ?? this._selectedDatabase.defaultDatabaseName ?? 'umbraco'), ); if (this._selectedDatabase.requiresCredentials) { @@ -271,19 +271,20 @@ export class UmbInstallerDatabaseElement extends UmbLitElement { `; - private _renderDatabaseName = (value: string) => html` - Database Name - - `; + private _renderDatabaseName = (value: string) => + html` + Database Name + + `; private _renderCredentials = () => html`

Credentials

diff --git a/src/apps/installer/shared/layout/installer-layout.element.ts b/src/apps/installer/shared/layout/installer-layout.element.ts index ab8cba7730..10e4394320 100644 --- a/src/apps/installer/shared/layout/installer-layout.element.ts +++ b/src/apps/installer/shared/layout/installer-layout.element.ts @@ -60,8 +60,11 @@ export class UmbInstallerLayoutElement extends LitElement { max-width: 1200px; height: 100%; max-height: 900px; - box-shadow: 0px 1.1px 3.7px rgba(0, 0, 0, 0.091), 0px 3.1px 10.1px rgba(0, 0, 0, 0.13), - 0px 7.5px 24.4px rgba(0, 0, 0, 0.169), 0px 25px 81px rgba(0, 0, 0, 0.26); + box-shadow: + 0px 1.1px 3.7px rgba(0, 0, 0, 0.091), + 0px 3.1px 10.1px rgba(0, 0, 0, 0.13), + 0px 7.5px 24.4px rgba(0, 0, 0, 0.169), + 0px 25px 81px rgba(0, 0, 0, 0.26); } #grid { diff --git a/src/apps/installer/shared/utils.story-helpers.ts b/src/apps/installer/shared/utils.story-helpers.ts index 3e881266d8..e22e315b24 100644 --- a/src/apps/installer/shared/utils.story-helpers.ts +++ b/src/apps/installer/shared/utils.story-helpers.ts @@ -1,7 +1,10 @@ import { UmbInstallerContext } from '../installer.context.js'; import { html, type TemplateResult } from '@umbraco-cms/backoffice/external/lit'; -export const installerContextProvider = (story: () => Node | string | TemplateResult, installerContext = new UmbInstallerContext()) => html` +export const installerContextProvider = ( + story: () => Node | string | TemplateResult, + installerContext = new UmbInstallerContext(), +) => html` extends HTMLElement { readonly params: Params | null; readonly match: IRouteMatch | null; routes: IRoute[]; - add: ((routes: IRoute[], navigate?: boolean) => void); - clear: (() => void); - render: (() => Promise); - constructAbsolutePath: ((path: PathFragment) => string); + add: (routes: IRoute[], navigate?: boolean) => void; + clear: () => void; + render: () => Promise; + constructAbsolutePath: (path: PathFragment) => string; parent: IRouterSlot

| null | undefined; - queryParentRouterSlot: (() => IRouterSlot

| null); + queryParentRouterSlot: () => IRouterSlot

| null; } export type IRoutingInfo = { - slot: IRouterSlot, - match: IRouteMatch + slot: IRouterSlot; + match: IRouteMatch; }; -export type CustomResolver = ((info: IRoutingInfo) => boolean | void | Promise | Promise); -export type Guard = ((info: IRoutingInfo) => boolean | Promise); -export type Cancel = (() => boolean); +export type CustomResolver = ( + info: IRoutingInfo, +) => boolean | void | Promise | Promise; +export type Guard = (info: IRoutingInfo) => boolean | Promise; +export type Cancel = () => boolean; export type PageComponent = HTMLElement | undefined; -export type ModuleResolver = Promise<{default: any; /*PageComponent*/}>; -export type Class = {new (...args: any[]): T;}; -export type Component = Class | ModuleResolver | PageComponent | (() => Class) | (() => PromiseLike) | (() => PageComponent) | (() => PromiseLike) | (() => ModuleResolver) | (() => PromiseLike); -export type Setup = ((component: PageComponent, info: IRoutingInfo) => void); - -export type RouterTree = {slot: IRouterSlot} & {child?: RouterTree} | null | undefined; -export type PathMatch = "prefix" | "suffix" | "full" | "fuzzy"; +export type ModuleResolver = Promise<{ default: any /*PageComponent*/ }>; +export type Class = { new (...args: any[]): T }; +export type Component = + | Class + | ModuleResolver + | PageComponent + | (() => Class) + | (() => PromiseLike) + | (() => PageComponent) + | (() => PromiseLike) + | (() => ModuleResolver) + | (() => PromiseLike); +export type Setup = (component: PageComponent, info: IRoutingInfo) => void; + +export type RouterTree = ({ slot: IRouterSlot } & { child?: RouterTree }) | null | undefined; +export type PathMatch = 'prefix' | 'suffix' | 'full' | 'fuzzy'; /** * The base route interface. * D = the data type of the data */ export interface IRouteBase { - // The path for the route fragment path: PathFragment; @@ -58,7 +68,6 @@ export interface IRouteBase { * Route type used for redirection. */ export interface IRedirectRoute extends IRouteBase { - // The paths the route should redirect to. Can either be relative or absolute. redirectTo: string; @@ -70,7 +79,6 @@ export interface IRedirectRoute extends IRouteBase { * Route type used to resolve and stamp components. */ export interface IComponentRoute extends IRouteBase { - // The component loader (should return a module with a default export) component: Component | PromiseLike; @@ -82,7 +90,6 @@ export interface IComponentRoute extends IRouteBase { * Route type used to take control of how the route should resolve. */ export interface IResolverRoute extends IRouteBase { - // A custom resolver that handles the route change resolve: CustomResolver; } @@ -90,13 +97,13 @@ export interface IResolverRoute extends IRouteBase { export type IRoute = IRedirectRoute | IComponentRoute | IResolverRoute; export type PathFragment = string; export type IPathFragments = { - consumed: PathFragment, - rest: PathFragment -} + consumed: PathFragment; + rest: PathFragment; +}; export interface IRouteMatch { route: IRoute; - params: Params, + params: Params; fragments: IPathFragments; match: RegExpMatchArray; } @@ -104,57 +111,56 @@ export interface IRouteMatch { export type PushStateEvent = CustomEvent; export type ReplaceStateEvent = CustomEvent; export type ChangeStateEvent = CustomEvent; -export type WillChangeStateEvent = CustomEvent<{ url?: string | null, eventName: GlobalRouterEvent}>; +export type WillChangeStateEvent = CustomEvent<{ url?: string | null; eventName: GlobalRouterEvent }>; export type NavigationStartEvent = CustomEvent>; export type NavigationSuccessEvent = CustomEvent>; export type NavigationCancelEvent = CustomEvent>; export type NavigationErrorEvent = CustomEvent>; export type NavigationEndEvent = CustomEvent>; -export type Params = {[key: string]: string}; -export type Query = {[key: string]: string}; +export type Params = { [key: string]: string }; +export type Query = { [key: string]: string }; -export type EventListenerSubscription = (() => void); +export type EventListenerSubscription = () => void; /** * RouterSlot related events. */ -export type RouterSlotEvent = "changestate"; +export type RouterSlotEvent = 'changestate'; /** * History related events. */ export type GlobalRouterEvent = - -// An event triggered when a new state is added to the history. - "pushstate" + // An event triggered when a new state is added to the history. + | 'pushstate' // An event triggered when the current state is replaced in the history. - | "replacestate" + | 'replacestate' // An event triggered when a state in the history is popped from the history. - | "popstate" + | 'popstate' // An event triggered when the state changes (eg. pop, push and replace) - | "changestate" + | 'changestate' // A cancellable event triggered before the history state changes. - | "willchangestate" + | 'willchangestate' // An event triggered when navigation starts. - | "navigationstart" + | 'navigationstart' // An event triggered when navigation is canceled. This is due to a route guard returning false during navigation. - | "navigationcancel" + | 'navigationcancel' // An event triggered when navigation fails due to an unexpected error. - | "navigationerror" + | 'navigationerror' // An event triggered when navigation successfully completes. - | "navigationsuccess" + | 'navigationsuccess' // An event triggered when navigation ends. - | "navigationend"; + | 'navigationend'; export interface ISlashOptions { start: boolean; @@ -164,15 +170,15 @@ export interface ISlashOptions { /* Extend the global event handlers map with the router related events */ declare global { interface GlobalEventHandlersEventMap { - "pushstate": PushStateEvent, - "replacestate": ReplaceStateEvent, - "popstate": PopStateEvent, - "changestate": ChangeStateEvent, - "navigationstart": NavigationStartEvent, - "navigationend": NavigationEndEvent, - "navigationsuccess": NavigationSuccessEvent, - "navigationcancel": NavigationCancelEvent, - "navigationerror": NavigationErrorEvent, - "willchangestate": WillChangeStateEvent + pushstate: PushStateEvent; + replacestate: ReplaceStateEvent; + popstate: PopStateEvent; + changestate: ChangeStateEvent; + navigationstart: NavigationStartEvent; + navigationend: NavigationEndEvent; + navigationsuccess: NavigationSuccessEvent; + navigationcancel: NavigationCancelEvent; + navigationerror: NavigationErrorEvent; + willchangestate: WillChangeStateEvent; } -} \ No newline at end of file +} diff --git a/src/external/router-slot/router-slot.ts b/src/external/router-slot/router-slot.ts index 1ceb0a8ca6..6e2425cd9a 100644 --- a/src/external/router-slot/router-slot.ts +++ b/src/external/router-slot/router-slot.ts @@ -1,4 +1,4 @@ -import { GLOBAL_ROUTER_EVENTS_TARGET, ROUTER_SLOT_TAG_NAME } from "./config.js"; +import { GLOBAL_ROUTER_EVENTS_TARGET, ROUTER_SLOT_TAG_NAME } from './config.js'; import { Cancel, EventListenerSubscription, @@ -11,7 +11,7 @@ import { Params, PathFragment, RouterSlotEvent, -} from "./model.js"; +} from './model.js'; import { addListener, constructAbsolutePath, @@ -28,9 +28,9 @@ import { removeListeners, resolvePageComponent, shouldNavigate, -} from "./util.js"; +} from './util.js'; -const template = document.createElement("template"); +const template = document.createElement('template'); template.innerHTML = ``; // Patches the history object and ensures the correct events. @@ -44,10 +44,7 @@ ensureAnchorHistory(); * @slot - Default content. * @event changestate - Dispatched when the router slot state changes. */ -export class RouterSlot - extends HTMLElement - implements IRouterSlot -{ +export class RouterSlot extends HTMLElement implements IRouterSlot { /** * Listeners on the router. */ @@ -131,7 +128,7 @@ export class RouterSlot constructor() { super(); - this.addEventListener("router-slot:capture-parent", (e: any) => { + this.addEventListener('router-slot:capture-parent', (e: any) => { e.stopPropagation(); e.detail.parent = this; }); @@ -139,7 +136,7 @@ export class RouterSlot this.render = this.render.bind(this); // Attach the template - const shadow = this.attachShadow({ mode: "open" }); + const shadow = this.attachShadow({ mode: 'open' }); shadow.appendChild(template.content.cloneNode(true)); } @@ -149,7 +146,7 @@ export class RouterSlot connectedCallback() { // Do not query a parent if the parent has been set from the outside. if (!this._lockParent) { - const captureParentEvent = new CustomEvent("router-slot:capture-parent", { + const captureParentEvent = new CustomEvent('router-slot:capture-parent', { composed: true, bubbles: true, detail: { parent: null }, @@ -237,9 +234,7 @@ export class RouterSlot // Either choose the parent fragment or the current path if no parent exists. // The root router slot will always use the entire path. const pathFragment = - this.parent != null && this.parent.fragments != null - ? this.parent.fragments.rest - : pathWithoutBasePath(); + this.parent != null && this.parent.fragments != null ? this.parent.fragments.rest : pathWithoutBasePath(); // Route to the path await this.renderPath(pathFragment); @@ -253,17 +248,9 @@ export class RouterSlot this.listeners.push( this.parent != null ? // Attach child router listeners - addListener( - this.parent, - "changestate", - this.render - ) + addListener(this.parent, 'changestate', this.render) : // Add global listeners. - addListener( - GLOBAL_ROUTER_EVENTS_TARGET, - "changestate", - this.render - ) + addListener(GLOBAL_ROUTER_EVENTS_TARGET, 'changestate', this.render), ); } @@ -328,12 +315,14 @@ export class RouterSlot // while we are about to navigate we have to cancel. let navigationInvalidated = false; const cancelNavigation = () => (navigationInvalidated = true); - const removeChangeListener: EventListenerSubscription = addListener< - Event, - GlobalRouterEvent - >(GLOBAL_ROUTER_EVENTS_TARGET, "changestate", cancelNavigation, { - once: true, - }); + const removeChangeListener: EventListenerSubscription = addListener( + GLOBAL_ROUTER_EVENTS_TARGET, + 'changestate', + cancelNavigation, + { + once: true, + }, + ); // Cleans up the routing by removing listeners and restoring the match from before const cleanup = () => { @@ -343,13 +332,13 @@ export class RouterSlot // Cleans up and dispatches a global event that a navigation was cancelled. const cancel: Cancel = () => { cleanup(); - dispatchGlobalRouterEvent("navigationcancel", info); - dispatchGlobalRouterEvent("navigationend", info); + dispatchGlobalRouterEvent('navigationcancel', info); + dispatchGlobalRouterEvent('navigationend', info); return false; }; // Dispatch globally that a navigation has started - dispatchGlobalRouterEvent("navigationstart", info); + dispatchGlobalRouterEvent('navigationstart', info); // Check whether the guards allow us to go to the new route. if (route.guards != null) { @@ -395,7 +384,7 @@ export class RouterSlot // We do this to ensure that we can find the match in the connectedCallback of the page. this._routeMatch = match; - if(page) { + if (page) { // Append the new page this.appendChild(page); } @@ -413,14 +402,14 @@ export class RouterSlot // Dispatch globally that a navigation has ended. if (navigate) { - dispatchGlobalRouterEvent("navigationsuccess", info); - dispatchGlobalRouterEvent("navigationend", info); + dispatchGlobalRouterEvent('navigationsuccess', info); + dispatchGlobalRouterEvent('navigationend', info); } return navigate; } catch (e) { - dispatchGlobalRouterEvent("navigationerror", info); - dispatchGlobalRouterEvent("navigationend", info); + dispatchGlobalRouterEvent('navigationerror', info); + dispatchGlobalRouterEvent('navigationend', info); throw e; } } @@ -430,6 +419,6 @@ window.customElements.define(ROUTER_SLOT_TAG_NAME, RouterSlot); declare global { interface HTMLElementTagNameMap { - "router-slot": RouterSlot; + 'router-slot': RouterSlot; } } diff --git a/src/external/router-slot/util/anchor.ts b/src/external/router-slot/util/anchor.ts index 1337caf22e..437fd78afc 100644 --- a/src/external/router-slot/util/anchor.ts +++ b/src/external/router-slot/util/anchor.ts @@ -2,11 +2,12 @@ * Hook up a click listener to the window that, for all anchor tags * that has a relative HREF, uses the history API instead. */ -export function ensureAnchorHistory () { - window.addEventListener("click", (e: MouseEvent) => { - +export function ensureAnchorHistory() { + window.addEventListener('click', (e: MouseEvent) => { // Find the target by using the composed path to get the element through the shadow boundaries. - const $anchor = ("composedPath" in e as any) ? e.composedPath().find($elem => $elem instanceof HTMLAnchorElement) : e.target; + const $anchor = (('composedPath' in e) as any) + ? e.composedPath().find(($elem) => $elem instanceof HTMLAnchorElement) + : e.target; // Abort if the event is not about the anchor tag if ($anchor == null || !($anchor instanceof HTMLAnchorElement)) { @@ -20,9 +21,11 @@ export function ensureAnchorHistory () { // - The HREF is relative to the origin of the current location. // - The target is targeting the current frame. // - The anchor doesn't have the attribute [data-router-slot]="disabled" - if (!href.startsWith(location.origin) || - ($anchor.target !== "" && $anchor.target !== "_self") || - $anchor.dataset["routerSlot"] === "disabled") { + if ( + !href.startsWith(location.origin) || + ($anchor.target !== '' && $anchor.target !== '_self') || + $anchor.dataset['routerSlot'] === 'disabled' + ) { return; } @@ -33,6 +36,6 @@ export function ensureAnchorHistory () { e.preventDefault(); // Change the history! - history.pushState(null, "", path); + history.pushState(null, '', path); }); -} \ No newline at end of file +} diff --git a/src/external/router-slot/util/events.ts b/src/external/router-slot/util/events.ts index 85bf127954..b171d59489 100644 --- a/src/external/router-slot/util/events.ts +++ b/src/external/router-slot/util/events.ts @@ -1,13 +1,13 @@ -import { GLOBAL_ROUTER_EVENTS_TARGET } from "../config"; -import { EventListenerSubscription, GlobalRouterEvent, IRoute, IRoutingInfo } from "../model"; +import { GLOBAL_ROUTER_EVENTS_TARGET } from '../config'; +import { EventListenerSubscription, GlobalRouterEvent, IRoute, IRoutingInfo } from '../model'; /** * Dispatches a did change route event. * @param $elem * @param {IRoute} detail */ -export function dispatchRouteChangeEvent ($elem: HTMLElement, detail: IRoutingInfo) { - $elem.dispatchEvent(new CustomEvent("changestate", {detail})); +export function dispatchRouteChangeEvent($elem: HTMLElement, detail: IRoutingInfo) { + $elem.dispatchEvent(new CustomEvent('changestate', { detail })); } /** @@ -15,8 +15,8 @@ export function dispatchRouteChangeEvent ($elem: HTMLElement, detail: I * @param name * @param detail */ -export function dispatchGlobalRouterEvent (name: GlobalRouterEvent, detail?: IRoutingInfo) { - GLOBAL_ROUTER_EVENTS_TARGET.dispatchEvent(new CustomEvent(name, {detail})); +export function dispatchGlobalRouterEvent(name: GlobalRouterEvent, detail?: IRoutingInfo) { + GLOBAL_ROUTER_EVENTS_TARGET.dispatchEvent(new CustomEvent(name, { detail })); // if ("debugRouterSlot" in window) { // console.log(`%c [router-slot]: ${name}`, `color: #286ee0`, detail); // } @@ -29,21 +29,22 @@ export function dispatchGlobalRouterEvent (name: GlobalRouterEvent, det * @param listener * @param options */ -export function addListener ($elem: EventTarget, - type: eventType[] | eventType, - listener: ((e: T) => void), - options?: boolean | AddEventListenerOptions): EventListenerSubscription { +export function addListener( + $elem: EventTarget, + type: eventType[] | eventType, + listener: (e: T) => void, + options?: boolean | AddEventListenerOptions, +): EventListenerSubscription { const types = Array.isArray(type) ? type : [type]; - types.forEach(t => $elem.addEventListener(t, listener as EventListenerOrEventListenerObject, options)); - return () => types.forEach( - t => $elem.removeEventListener(t, listener as EventListenerOrEventListenerObject, options)); + types.forEach((t) => $elem.addEventListener(t, listener as EventListenerOrEventListenerObject, options)); + return () => + types.forEach((t) => $elem.removeEventListener(t, listener as EventListenerOrEventListenerObject, options)); } - /** * Removes the event listeners in the array. * @param listeners */ -export function removeListeners (listeners: EventListenerSubscription[]) { - listeners.forEach(unsub => unsub()); +export function removeListeners(listeners: EventListenerSubscription[]) { + listeners.forEach((unsub) => unsub()); } diff --git a/src/external/router-slot/util/history.ts b/src/external/router-slot/util/history.ts index 74c7bdb59e..20ad3c8d2f 100644 --- a/src/external/router-slot/util/history.ts +++ b/src/external/router-slot/util/history.ts @@ -1,47 +1,44 @@ -import { GLOBAL_ROUTER_EVENTS_TARGET, HISTORY_PATCH_NATIVE_KEY } from "../config"; -import { GlobalRouterEvent } from "../model"; -import { dispatchGlobalRouterEvent } from "./events"; +import { GLOBAL_ROUTER_EVENTS_TARGET, HISTORY_PATCH_NATIVE_KEY } from '../config'; +import { GlobalRouterEvent } from '../model'; +import { dispatchGlobalRouterEvent } from './events'; // Mapping a history functions to the events they are going to dispatch. export const historyPatches: [string, GlobalRouterEvent[]][] = [ - ["pushState", ["pushstate", "changestate"]], - ["replaceState", ["replacestate", "changestate"]], - ["forward", ["pushstate", "changestate"]], - ["go", ["pushstate", "changestate"]], + ['pushState', ['pushstate', 'changestate']], + ['replaceState', ['replacestate', 'changestate']], + ['forward', ['pushstate', 'changestate']], + ['go', ['pushstate', 'changestate']], - // We need to handle the popstate a little differently when it comes to the change state event. - ["back", ["popstate"]], + // We need to handle the popstate a little differently when it comes to the change state event. + ['back', ['popstate']], ]; - /** * Patches the history object by ensuring correct events are dispatches when the history changes. */ export function ensureHistoryEvents() { - for (const [name, events] of historyPatches) { - for (const event of events) { - attachCallback(history, name, event); - } - } - - // The popstate is the only event natively dispatched when using the hardware buttons. - // Therefore we need to handle this case a little different. To ensure the changestate event - // is fired also when the hardware back button is used, we make sure to listen for the popstate - // event and dispatch a change state event right after. The reason for the setTimeout is because we - // want the popstate event to bubble up before the changestate event is dispatched. - window.addEventListener("popstate", (e: PopStateEvent) => { - - // Check if the state should be allowed to change - if (shouldCancelChangeState({eventName: "popstate"})) { - e.preventDefault(); - e.stopPropagation(); - return; - } - - // Dispatch the global router event to change the routes after the popstate has bubbled up - setTimeout(() => dispatchGlobalRouterEvent("changestate"), 0); - } - ); + for (const [name, events] of historyPatches) { + for (const event of events) { + attachCallback(history, name, event); + } + } + + // The popstate is the only event natively dispatched when using the hardware buttons. + // Therefore we need to handle this case a little different. To ensure the changestate event + // is fired also when the hardware back button is used, we make sure to listen for the popstate + // event and dispatch a change state event right after. The reason for the setTimeout is because we + // want the popstate event to bubble up before the changestate event is dispatched. + window.addEventListener('popstate', (e: PopStateEvent) => { + // Check if the state should be allowed to change + if (shouldCancelChangeState({ eventName: 'popstate' })) { + e.preventDefault(); + e.stopPropagation(); + return; + } + + // Dispatch the global router event to change the routes after the popstate has bubbled up + setTimeout(() => dispatchGlobalRouterEvent('changestate'), 0); + }); } /** @@ -52,20 +49,19 @@ export function ensureHistoryEvents() { * @param eventName */ export function attachCallback(obj: any, functionName: string, eventName: GlobalRouterEvent) { - const func = obj[functionName]; - saveNativeFunction(obj, functionName, func); - obj[functionName] = (...args: any[]) => { - - // If its push/replace state we want to send the url to the should cancel change state event - const url = args.length > 2 ? args[2] : null; - - // Check if the state should be allowed to change - if (shouldCancelChangeState({url, eventName})) return; - - // Navigate - func.apply(obj, args); - dispatchGlobalRouterEvent(eventName) - }; + const func = obj[functionName]; + saveNativeFunction(obj, functionName, func); + obj[functionName] = (...args: any[]) => { + // If its push/replace state we want to send the url to the should cancel change state event + const url = args.length > 2 ? args[2] : null; + + // Check if the state should be allowed to change + if (shouldCancelChangeState({ url, eventName })) return; + + // Navigate + func.apply(obj, args); + dispatchGlobalRouterEvent(eventName); + }; } /** @@ -74,37 +70,38 @@ export function attachCallback(obj: any, functionName: string, eventName: Global * @param name * @param func */ -export function saveNativeFunction(obj: any, name: string, func: (() => void)) { - - // Ensure that the native object exists. - if (obj[HISTORY_PATCH_NATIVE_KEY] == null) { - obj[HISTORY_PATCH_NATIVE_KEY] = {}; - } - - // Save the native function. - obj[HISTORY_PATCH_NATIVE_KEY][`${name}`] = func.bind(obj); +export function saveNativeFunction(obj: any, name: string, func: () => void) { + // Ensure that the native object exists. + if (obj[HISTORY_PATCH_NATIVE_KEY] == null) { + obj[HISTORY_PATCH_NATIVE_KEY] = {}; + } + + // Save the native function. + obj[HISTORY_PATCH_NATIVE_KEY][`${name}`] = func.bind(obj); } /** * Dispatches and event and returns whether the state change should be cancelled. * The state will be considered as cancelled if the "willChangeState" event was cancelled. */ -function shouldCancelChangeState(data: { url?: string | null, eventName: GlobalRouterEvent }): boolean { - return !GLOBAL_ROUTER_EVENTS_TARGET.dispatchEvent(new CustomEvent("willchangestate", { - cancelable: true, - detail: data - })); +function shouldCancelChangeState(data: { url?: string | null; eventName: GlobalRouterEvent }): boolean { + return !GLOBAL_ROUTER_EVENTS_TARGET.dispatchEvent( + new CustomEvent('willchangestate', { + cancelable: true, + detail: data, + }), + ); } // Expose the native history functions. declare global { - interface History { - "native": { - "back": ((distance?: any) => void); - "forward": ((distance?: any) => void); - "go": ((delta?: any) => void); - "pushState": ((data: any, title?: string, url?: string | null) => void); - "replaceState": ((data: any, title?: string, url?: string | null) => void); - } - } -} \ No newline at end of file + interface History { + native: { + back: (distance?: any) => void; + forward: (distance?: any) => void; + go: (delta?: any) => void; + pushState: (data: any, title?: string, url?: string | null) => void; + replaceState: (data: any, title?: string, url?: string | null) => void; + }; + } +} diff --git a/src/external/router-slot/util/router.ts b/src/external/router-slot/util/router.ts index 033767f3d9..0b3303ab05 100644 --- a/src/external/router-slot/util/router.ts +++ b/src/external/router-slot/util/router.ts @@ -1,6 +1,19 @@ -import { CATCH_ALL_WILDCARD, DEFAULT_PATH_MATCH, PARAM_IDENTIFIER, TRAVERSE_FLAG } from "../config"; -import { IComponentRoute, IRedirectRoute, IResolverRoute, IRoute, IRouteMatch, IRouterSlot, ModuleResolver, PageComponent, Params, PathFragment, RouterTree, IRoutingInfo } from "../model"; -import { constructPathWithBasePath, path as getPath, queryString, stripSlash } from "./url"; +import { CATCH_ALL_WILDCARD, DEFAULT_PATH_MATCH, PARAM_IDENTIFIER, TRAVERSE_FLAG } from '../config'; +import { + IComponentRoute, + IRedirectRoute, + IResolverRoute, + IRoute, + IRouteMatch, + IRouterSlot, + ModuleResolver, + PageComponent, + Params, + PathFragment, + RouterTree, + IRoutingInfo, +} from '../model'; +import { constructPathWithBasePath, path as getPath, queryString, stripSlash } from './url'; /** * Determines whether the path is active. @@ -8,8 +21,8 @@ import { constructPathWithBasePath, path as getPath, queryString, stripSlash } f * @param path * @param fullPath */ -export function isPathActive (path: string | PathFragment, fullPath: string = getPath()): boolean { - return new RegExp(`^${stripSlash(path)}(\/|$)`, "gm").test(stripSlash(fullPath)); +export function isPathActive(path: string | PathFragment, fullPath: string = getPath()): boolean { + return new RegExp(`^${stripSlash(path)}(\/|$)`, 'gm').test(stripSlash(fullPath)); } /** @@ -17,16 +30,17 @@ export function isPathActive (path: string | PathFragment, fullPath: string = ge * @param route * @param path */ -export function matchRoute (route: IRoute, path: string | PathFragment): IRouteMatch | null { - +export function matchRoute(route: IRoute, path: string | PathFragment): IRouteMatch | null { // We start by preparing the route path by replacing the param names with a regex that matches everything // until either the end of the path or the next "/". While replacing the param placeholders we make sure // to store the names of the param placeholders. const paramNames: string[] = []; - const routePath = stripSlash(route.path.replace(PARAM_IDENTIFIER, (substring: string, ...args: string[]) => { - paramNames.push(args[0]); - return `([^\/]+)`; - })); + const routePath = stripSlash( + route.path.replace(PARAM_IDENTIFIER, (substring: string, ...args: string[]) => { + paramNames.push(args[0]); + return `([^\/]+)`; + }), + ); // Construct the regex to match with the path or fragment // If path is wildcard: @@ -45,19 +59,26 @@ export function matchRoute (route: IRoute, path: string | PathFragme // - We start the match with .*? to allow anything to be in front of what we are trying to match. // - We end the match with .*? to allow anything to be after what we are trying to match. // All matches starts with ^ to make sure the match is done from the beginning of the path. - const regex = route.path === CATCH_ALL_WILDCARD || (route.path.length === 0 && route.pathMatch != "full" ) ? /^/ : (() => { - switch (route.pathMatch || DEFAULT_PATH_MATCH) { - case "full": return new RegExp(`^${routePath}\/?$`); - case "suffix": return new RegExp(`^.*?${routePath}\/?$`); - case "fuzzy": return new RegExp(`^.*?${routePath}.*?$`); - case "prefix": default: return new RegExp(`^[\/]?${routePath}(?:\/|$)`); - } - })(); + const regex = + route.path === CATCH_ALL_WILDCARD || (route.path.length === 0 && route.pathMatch != 'full') + ? /^/ + : (() => { + switch (route.pathMatch || DEFAULT_PATH_MATCH) { + case 'full': + return new RegExp(`^${routePath}\/?$`); + case 'suffix': + return new RegExp(`^.*?${routePath}\/?$`); + case 'fuzzy': + return new RegExp(`^.*?${routePath}.*?$`); + case 'prefix': + default: + return new RegExp(`^[\/]?${routePath}(?:\/|$)`); + } + })(); // Check if there's a match const match = path.match(regex); if (match != null) { - // Match the param names with the matches. The matches starts from index 1 which is the // reason why we add 1. match[0] is the entire string. const params = paramNames.reduce((acc: Params, name: string, i: number) => { @@ -75,12 +96,11 @@ export function matchRoute (route: IRoute, path: string | PathFragme params, fragments: { consumed, - rest - } + rest, + }, }; } - return null; } @@ -89,7 +109,7 @@ export function matchRoute (route: IRoute, path: string | PathFragme * @param routes * @param path */ -export function matchRoutes (routes: IRoute[], path: string | PathFragment): IRouteMatch | null { +export function matchRoutes(routes: IRoute[], path: string | PathFragment): IRouteMatch | null { for (const route of routes) { const match = matchRoute(route, path); if (match != null) { @@ -106,15 +126,13 @@ export function matchRoutes (routes: IRoute[], path: string | PathFr * @param route * @param info */ -export async function resolvePageComponent (route: IComponentRoute, info: IRoutingInfo): Promise { - +export async function resolvePageComponent(route: IComponentRoute, info: IRoutingInfo): Promise { // Figure out if the component were given as an import or class. let cmp = route.component; if (cmp instanceof Function) { try { cmp = (cmp as Function)(); } catch (err) { - // The invocation most likely failed because the function is a class. // If it failed due to the "new" keyword not being used, the error will be of type "TypeError". // This is the most reliable way to check whether the provided function is a class or a function. @@ -147,24 +165,23 @@ export async function resolvePageComponent (route: IComponentRoute, info: IRouti * Determines if a route is a redirect route. * @param route */ -export function isRedirectRoute (route: IRoute): route is IRedirectRoute { - return "redirectTo" in route; +export function isRedirectRoute(route: IRoute): route is IRedirectRoute { + return 'redirectTo' in route; } /** * Determines if a route is a resolver route. * @param route */ -export function isResolverRoute (route: IRoute): route is IResolverRoute { - return "resolve" in route; +export function isResolverRoute(route: IRoute): route is IResolverRoute { + return 'resolve' in route; } /** * Traverses the router tree up to the root route. * @param slot */ -export function traverseRouterTree (slot: IRouterSlot): {tree: RouterTree, depth: number} { - +export function traverseRouterTree(slot: IRouterSlot): { tree: RouterTree; depth: number } { // Find the nodes from the route up to the root route let routes: IRouterSlot[] = [slot]; while (slot.parent != null) { @@ -174,12 +191,12 @@ export function traverseRouterTree (slot: IRouterSlot): {tree: RouterTree, depth // Create the tree const tree: RouterTree = routes.reduce((acc: RouterTree, slot: IRouterSlot) => { - return {slot, child: acc}; + return { slot, child: acc }; }, undefined); const depth = routes.length; - return {tree, depth}; + return { tree, depth }; } /** @@ -187,7 +204,7 @@ export function traverseRouterTree (slot: IRouterSlot): {tree: RouterTree, depth * @param tree * @param depth */ -export function getFragments (tree: RouterTree, depth: number): PathFragment[] { +export function getFragments(tree: RouterTree, depth: number): PathFragment[] { let child = tree; const fragments: PathFragment[] = []; @@ -209,27 +226,27 @@ export function getFragments (tree: RouterTree, depth: number): PathFragment[] { * @param slot * @param path */ -export function constructAbsolutePath (slot: IRouterSlot, - path: string | PathFragment = ""): string { - +export function constructAbsolutePath( + slot: IRouterSlot, + path: string | PathFragment = '', +): string { // Grab the router tree - const {tree, depth} = traverseRouterTree(slot); + const { tree, depth } = traverseRouterTree(slot); // If the path starts with "/" we treat it as an absolute path // and therefore don't continue because it is already absolute. - if (!path.startsWith("/")) { + if (!path.startsWith('/')) { let traverseDepth = 0; // If the path starts with "./" we can remove that part // because we know the path is relative to its route. - if (path.startsWith("./")) { + if (path.startsWith('./')) { path = path.slice(2); } // Match with the traverse flag. - const match = path.match(new RegExp(TRAVERSE_FLAG, "g")); + const match = path.match(new RegExp(TRAVERSE_FLAG, 'g')); if (match != null) { - // If the path matched with the traverse flag we know that we have to construct // a route until a certain depth. The traverse depth is the amount of "../" in the path // and the depth is the part of the path we a slicing away. @@ -243,12 +260,12 @@ export function constructAbsolutePath (slot: IRouterSlot // Grab the fragments and construct the new path, taking the traverse depth into account. // Always subtract at least 1 because we the path is relative to its parent. // Filter away the empty fragments from the path. - const fragments = getFragments(tree, depth - 1 - traverseDepth).filter(fragment => fragment.length > 0); - path = `${fragments.join("/")}${fragments.length > 0 ? "/" : ""}${path}`; + const fragments = getFragments(tree, depth - 1 - traverseDepth).filter((fragment) => fragment.length > 0); + path = `${fragments.join('/')}${fragments.length > 0 ? '/' : ''}${path}`; } // Add the base path in front of the path. If the path is already absolute, the path wont get the base path added. - return constructPathWithBasePath(path, {end: false}); + return constructPathWithBasePath(path, { end: false }); } /** @@ -256,8 +273,12 @@ export function constructAbsolutePath (slot: IRouterSlot * @param slot * @param route */ -export function handleRedirect (slot: IRouterSlot, route: IRedirectRoute) { - history.replaceState(history.state, "", `${constructAbsolutePath(slot, route.redirectTo)}${route.preserveQuery ? queryString() : ""}`); +export function handleRedirect(slot: IRouterSlot, route: IRedirectRoute) { + history.replaceState( + history.state, + '', + `${constructAbsolutePath(slot, route.redirectTo)}${route.preserveQuery ? queryString() : ''}`, + ); } /** @@ -265,20 +286,19 @@ export function handleRedirect (slot: IRouterSlot, route: IRedirectRoute) { * @param currentMatch * @param newMatch */ -export function shouldNavigate (currentMatch: IRouteMatch | null, newMatch: IRouteMatch) { - +export function shouldNavigate(currentMatch: IRouteMatch | null, newMatch: IRouteMatch) { // If the current match is not defined we should always route. if (currentMatch == null) { return true; } // Extract information about the matches - const {route: currentRoute, fragments: currentFragments} = currentMatch; - const {route: newRoute, fragments: newFragments} = newMatch; + const { route: currentRoute, fragments: currentFragments } = currentMatch; + const { route: newRoute, fragments: newFragments } = newMatch; const isSameRoute = currentRoute == newRoute; const isSameFragments = currentFragments.consumed == newFragments.consumed; // Only navigate if the URL consumption is new or if the two routes are no longer the same. return !isSameFragments || !isSameRoute; -} \ No newline at end of file +} diff --git a/src/external/router-slot/util/shadow.ts b/src/external/router-slot/util/shadow.ts index 0ee04a3b8f..a0ead2f6a2 100644 --- a/src/external/router-slot/util/shadow.ts +++ b/src/external/router-slot/util/shadow.ts @@ -1,11 +1,11 @@ -import { ROUTER_SLOT_TAG_NAME } from "../config"; -import { IRouterSlot } from "../model"; +import { ROUTER_SLOT_TAG_NAME } from '../config'; +import { IRouterSlot } from '../model'; /** * Queries the parent router. * @param $elem */ -export function queryParentRouterSlot ($elem: Element): IRouterSlot | null { +export function queryParentRouterSlot($elem: Element): IRouterSlot | null { return queryParentRoots>($elem, ROUTER_SLOT_TAG_NAME); } @@ -17,14 +17,12 @@ export function queryParentRouterSlot ($elem: Element): IRouterSlot * @param minRoots * @param roots */ -export function queryParentRoots ($elem: Element, query: string, minRoots: number = 0, roots: number = 0): T | null { - +export function queryParentRoots($elem: Element, query: string, minRoots: number = 0, roots: number = 0): T | null { // Grab the rood node and query it const $root = ($elem).getRootNode(); // If we are at the right level or above we can query! if (roots >= minRoots) { - // See if there's a match const match = $root.querySelector(query); if (match != null && match != $elem) { diff --git a/src/external/router-slot/util/url.ts b/src/external/router-slot/util/url.ts index 13f5d830b1..f9a95d0897 100644 --- a/src/external/router-slot/util/url.ts +++ b/src/external/router-slot/util/url.ts @@ -1,13 +1,13 @@ -import { ISlashOptions, Params, Query } from "../model"; +import { ISlashOptions, Params, Query } from '../model'; -const $anchor = document.createElement("a"); +const $anchor = document.createElement('a'); /** * The current path of the location. * As default slashes are included at the start and end. * @param options */ -export function path (options: Partial = {}): string { +export function path(options: Partial = {}): string { return slashify(window.location.pathname, options); } @@ -15,7 +15,7 @@ export function path (options: Partial = {}): string { * Returns the path without the base path. * @param options */ -export function pathWithoutBasePath (options: Partial = {}): string { +export function pathWithoutBasePath(options: Partial = {}): string { return slashify(stripStart(path(), basePath()), options); } @@ -30,8 +30,8 @@ export function pathWithoutBasePath (options: Partial = {}): stri * To make this method more performant we could cache the anchor element. * As default it will return the base path with slashes in front and at the end. */ -export function basePath (options: Partial = {}): string { - return constructPathWithBasePath(".", options); +export function basePath(options: Partial = {}): string { + return constructPathWithBasePath('.', options); } /** @@ -44,7 +44,7 @@ export function basePath (options: Partial = {}): string { * @param path * @param options */ -export function constructPathWithBasePath (path: string, options: Partial = {}) { +export function constructPathWithBasePath(path: string, options: Partial = {}) { $anchor.href = path; return slashify($anchor.pathname, options); } @@ -54,14 +54,14 @@ export function constructPathWithBasePath (path: string, options: Partial = {}): string { - path = start && !path.startsWith("/") ? `/${path}` : (!start && path.startsWith("/") ? path.slice(1) : path); - return end && !path.endsWith("/") ? `${path}/` : (!end && path.endsWith("/") ? path.slice(0, path.length - 1) : path); +export function slashify(path: string, { start = true, end = true }: Partial = {}): string { + path = start && !path.startsWith('/') ? `/${path}` : !start && path.startsWith('/') ? path.slice(1) : path; + return end && !path.endsWith('/') ? `${path}/` : !end && path.endsWith('/') ? path.slice(0, path.length - 1) : path; } /** @@ -105,31 +105,33 @@ export function slashify (path: string, {start = true, end = true}: Partial atom.split("=")); + const arrayMap = atoms.map((atom) => atom.split('=')); // Assign the values to an object ({ test: "123", hejsa: "LOL", wuhuu: "" }) - return Object.assign({}, ...arrayMap.map(arr => ({ - [decodeURIComponent(arr[0])]: (arr.length > 1 ? decodeURIComponent(arr[1]) : "") - }))); + return Object.assign( + {}, + ...arrayMap.map((arr) => ({ + [decodeURIComponent(arr[0])]: arr.length > 1 ? decodeURIComponent(arr[1]) : '', + })), + ); } /** * Turns a query object into a string query. * @param query */ -export function toQueryString (query: Query): string { +export function toQueryString(query: Query): string { return Object.entries(query) - .map(([key, value]) => `${key}${value != "" ? `=${encodeURIComponent(value)}` : ""}`) - .join("&"); + .map(([key, value]) => `${key}${value != '' ? `=${encodeURIComponent(value)}` : ''}`) + .join('&'); } diff --git a/src/libs/context-api/consume/context-consumer.controller.ts b/src/libs/context-api/consume/context-consumer.controller.ts index ff81bb7be2..3f39343f01 100644 --- a/src/libs/context-api/consume/context-consumer.controller.ts +++ b/src/libs/context-api/consume/context-consumer.controller.ts @@ -3,19 +3,22 @@ import { UmbContextConsumer } from './context-consumer.js'; import { UmbContextCallback } from './context-request.event.js'; import type { UmbControllerHost, UmbController } from '@umbraco-cms/backoffice/controller-api'; - -export class UmbContextConsumerController< - BaseType = unknown, - ResultType extends BaseType = BaseType -> extends UmbContextConsumer implements UmbController { +export class UmbContextConsumerController + extends UmbContextConsumer + implements UmbController +{ #controllerAlias = Symbol(); #host: UmbControllerHost; public get controllerAlias() { return this.#controllerAlias; } - - constructor(host: UmbControllerHost, contextAlias: string | UmbContextToken, callback: UmbContextCallback) { + + constructor( + host: UmbControllerHost, + contextAlias: string | UmbContextToken, + callback: UmbContextCallback, + ) { super(host.getHostElement(), contextAlias, callback); this.#host = host; host.addController(this); diff --git a/src/libs/context-api/provide/context-provider.controller.test.ts b/src/libs/context-api/provide/context-provider.controller.test.ts index 9d09cc989e..48039ad776 100644 --- a/src/libs/context-api/provide/context-provider.controller.test.ts +++ b/src/libs/context-api/provide/context-provider.controller.test.ts @@ -46,7 +46,7 @@ describe('UmbContextProviderController', () => { expect(_instance?.prop).to.eq('value from provider'); done(); localConsumer.hostDisconnected(); - } + }, ); localConsumer.hostConnected(); }); diff --git a/src/libs/context-api/provide/context-provider.controller.ts b/src/libs/context-api/provide/context-provider.controller.ts index 4d8a283a0c..1b2ecac03c 100644 --- a/src/libs/context-api/provide/context-provider.controller.ts +++ b/src/libs/context-api/provide/context-provider.controller.ts @@ -3,18 +3,25 @@ import { UmbContextProvider } from './context-provider.js'; import type { UmbControllerHost, UmbController } from '@umbraco-cms/backoffice/controller-api'; export class UmbContextProviderController< - BaseType = unknown, - ResultType extends BaseType = BaseType, - InstanceType extends ResultType = ResultType -> extends UmbContextProvider implements UmbController { + BaseType = unknown, + ResultType extends BaseType = BaseType, + InstanceType extends ResultType = ResultType, + > + extends UmbContextProvider + implements UmbController +{ #host: UmbControllerHost; - #controllerAlias:string; + #controllerAlias: string; public get controllerAlias() { return this.#controllerAlias; } - constructor(host: UmbControllerHost, contextAlias: string | UmbContextToken, instance: InstanceType) { + constructor( + host: UmbControllerHost, + contextAlias: string | UmbContextToken, + instance: InstanceType, + ) { super(host.getHostElement(), contextAlias, instance); this.#host = host; // Makes the controllerAlias unique for this instance, this enables multiple Contexts to be provided under the same name. (This only makes sense cause of Context Token Discriminators) @@ -30,7 +37,9 @@ export class UmbContextProviderController< // This just an additional awareness feature to make devs Aware, the alternative would be adding it anyway, but that would destroy existing controller of this alias. // Back out, this instance is already provided, by another controller. throw new Error( - `Context API: The context of '${this.controllerAlias}' and instance '${(instance as any).constructor?.name ?? 'unnamed'}' is already provided by another Context Provider Controller.` + `Context API: The context of '${this.controllerAlias}' and instance '${ + (instance as any).constructor?.name ?? 'unnamed' + }' is already provided by another Context Provider Controller.`, ); } else { host.addController(this); diff --git a/src/libs/context-api/provide/context-provider.element.test.ts b/src/libs/context-api/provide/context-provider.element.test.ts index e61536e8f8..963011715f 100644 --- a/src/libs/context-api/provide/context-provider.element.test.ts +++ b/src/libs/context-api/provide/context-provider.element.test.ts @@ -25,7 +25,7 @@ describe('UmbContextProvider', () => { element = await fixture( html` - ` + `, ); consumer = element.getElementsByTagName('umb-test-context')[0] as unknown as UmbTestContextElement; }); diff --git a/src/libs/element-api/element.mixin.ts b/src/libs/element-api/element.mixin.ts index a8e49f0f3e..1c4cd6285c 100644 --- a/src/libs/element-api/element.mixin.ts +++ b/src/libs/element-api/element.mixin.ts @@ -22,16 +22,19 @@ export declare class UmbElement extends UmbControllerHostElement { observe( source: Observable | { asObservable: () => Observable }, callback: ObserverCallback, - unique?: string + unique?: string, ): UmbObserverController; provideContext< BaseType = unknown, ResultType extends BaseType = BaseType, - InstanceType extends ResultType = ResultType - >(alias: string | UmbContextToken, instance: InstanceType): UmbContextProviderController; + InstanceType extends ResultType = ResultType, + >( + alias: string | UmbContextToken, + instance: InstanceType, + ): UmbContextProviderController; consumeContext( alias: string | UmbContextToken, - callback: UmbContextCallback + callback: UmbContextCallback, ): UmbContextConsumerController; /** * Use the UmbLocalizeController to localize your element. @@ -65,9 +68,11 @@ export const UmbElementMixin = (superClass: T) provideContext< BaseType = unknown, ResultType extends BaseType = BaseType, - InstanceType extends ResultType = ResultType - > - (alias: string | UmbContextToken, instance: InstanceType): UmbContextProviderController { + InstanceType extends ResultType = ResultType, + >( + alias: string | UmbContextToken, + instance: InstanceType, + ): UmbContextProviderController { return new UmbContextProviderController(this, alias, instance); } @@ -80,7 +85,7 @@ export const UmbElementMixin = (superClass: T) */ consumeContext( alias: string | UmbContextToken, - callback: UmbContextCallback + callback: UmbContextCallback, ): UmbContextConsumerController { return new UmbContextConsumerController(this, alias, callback); } diff --git a/src/libs/extension-api/condition/condition-controller-arguments.type.ts b/src/libs/extension-api/condition/condition-controller-arguments.type.ts index ea0a211160..47e3718dae 100644 --- a/src/libs/extension-api/condition/condition-controller-arguments.type.ts +++ b/src/libs/extension-api/condition/condition-controller-arguments.type.ts @@ -2,5 +2,5 @@ import { UmbConditionConfigBase } from '../types/index.js'; import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; export type UmbConditionControllerArguments< - ConditionConfigType extends UmbConditionConfigBase = UmbConditionConfigBase + ConditionConfigType extends UmbConditionConfigBase = UmbConditionConfigBase, > = { host: UmbControllerHost; config: ConditionConfigType; onChange: () => void }; diff --git a/src/libs/extension-api/controller/extension-element-initializer.test.ts b/src/libs/extension-api/controller/extension-element-initializer.test.ts index f2f102d347..ba82268e31 100644 --- a/src/libs/extension-api/controller/extension-element-initializer.test.ts +++ b/src/libs/extension-api/controller/extension-element-initializer.test.ts @@ -48,7 +48,7 @@ describe('UmbExtensionElementController', () => { extensionController.destroy(); } } - } + }, ); }); @@ -75,7 +75,7 @@ describe('UmbExtensionElementController', () => { } } }, - 'umb-test-fallback-element' + 'umb-test-fallback-element', ); }); }); @@ -143,7 +143,7 @@ describe('UmbExtensionElementController', () => { done(); extensionController.destroy(); // need to destroy the controller. } - } + }, ); }); }); diff --git a/src/libs/extension-api/controller/extension-manifest-initializer.controller.ts b/src/libs/extension-api/controller/extension-manifest-initializer.controller.ts index b772dd0f95..79339f8b73 100644 --- a/src/libs/extension-api/controller/extension-manifest-initializer.controller.ts +++ b/src/libs/extension-api/controller/extension-manifest-initializer.controller.ts @@ -8,21 +8,21 @@ import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; * When the extension is permitted to be used, the manifest is available for the consumer. * * @example -* ```ts -* const controller = new UmbExtensionManifestController(host, extensionRegistry, alias, (permitted, ctrl) => { console.log("Extension is permitted and this is the manifest: ", ctrl.manifest) })); -* ``` + * ```ts + * const controller = new UmbExtensionManifestController(host, extensionRegistry, alias, (permitted, ctrl) => { console.log("Extension is permitted and this is the manifest: ", ctrl.manifest) })); + * ``` * @export * @class UmbExtensionManifestController */ export class UmbExtensionManifestInitializer< ManifestType extends ManifestWithDynamicConditions = ManifestWithDynamicConditions, - ControllerType extends UmbBaseExtensionInitializer = any + ControllerType extends UmbBaseExtensionInitializer = any, > extends UmbBaseExtensionInitializer { constructor( host: UmbControllerHost, extensionRegistry: UmbExtensionRegistry, alias: string, - onPermissionChanged: (isPermitted: boolean, controller: ControllerType) => void + onPermissionChanged: (isPermitted: boolean, controller: ControllerType) => void, ) { super(host, extensionRegistry, 'extManifest_', alias, onPermissionChanged); this._init(); diff --git a/src/libs/extension-api/controller/extensions-api-initializer.controller.ts b/src/libs/extension-api/controller/extensions-api-initializer.controller.ts index bf56b2a980..1f1c40a75a 100644 --- a/src/libs/extension-api/controller/extensions-api-initializer.controller.ts +++ b/src/libs/extension-api/controller/extensions-api-initializer.controller.ts @@ -1,11 +1,10 @@ import { ManifestTypeMap, SpecificManifestTypeOrManifestBase } from '../types/map.types.js'; -import { type PermittedControllerType, UmbBaseExtensionsInitializer } from './base-extensions-initializer.controller.js'; -import { UmbExtensionApiInitializer } from './extension-api-initializer.controller.js'; import { - type UmbExtensionRegistry, - ManifestApi, - ManifestBase, -} from '@umbraco-cms/backoffice/extension-api'; + type PermittedControllerType, + UmbBaseExtensionsInitializer, +} from './base-extensions-initializer.controller.js'; +import { UmbExtensionApiInitializer } from './extension-api-initializer.controller.js'; +import { type UmbExtensionRegistry, ManifestApi, ManifestBase } from '@umbraco-cms/backoffice/extension-api'; import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; /** @@ -26,7 +25,7 @@ export class UmbExtensionsApiInitializer< ManifestType extends ManifestBase = SpecificManifestTypeOrManifestBase, ManifestTypeAsApi extends ManifestApi = ManifestType extends ManifestApi ? ManifestType : never, ControllerType extends UmbExtensionApiInitializer = UmbExtensionApiInitializer, - MyPermittedControllerType extends ControllerType = PermittedControllerType + MyPermittedControllerType extends ControllerType = PermittedControllerType, > extends UmbBaseExtensionsInitializer< ManifestTypes, ManifestTypeName, @@ -59,7 +58,7 @@ export class UmbExtensionsApiInitializer< type: ManifestTypeName | Array, constructorArguments: Array | undefined, filter?: undefined | null | ((manifest: ManifestTypeAsApi) => boolean), - onChange?: (permittedManifests: Array) => void + onChange?: (permittedManifests: Array) => void, ) { super(host, extensionRegistry, type, filter, onChange); this.#extensionRegistry = extensionRegistry; @@ -73,7 +72,7 @@ export class UmbExtensionsApiInitializer< this.#extensionRegistry, manifest.alias, this.#constructorArgs, - this._extensionChanged + this._extensionChanged, ) as ControllerType; return extController; diff --git a/src/libs/extension-api/controller/extensions-manifest-initializer.controller.ts b/src/libs/extension-api/controller/extensions-manifest-initializer.controller.ts index 59fd8888c7..7b6592bad4 100644 --- a/src/libs/extension-api/controller/extensions-manifest-initializer.controller.ts +++ b/src/libs/extension-api/controller/extensions-manifest-initializer.controller.ts @@ -1,10 +1,10 @@ import type { ManifestTypeMap, SpecificManifestTypeOrManifestBase } from '../types/map.types.js'; import { UmbExtensionManifestInitializer } from './extension-manifest-initializer.controller.js'; -import { type PermittedControllerType, UmbBaseExtensionsInitializer } from './base-extensions-initializer.controller.js'; import { - type ManifestBase, - type UmbExtensionRegistry, -} from '@umbraco-cms/backoffice/extension-api'; + type PermittedControllerType, + UmbBaseExtensionsInitializer, +} from './base-extensions-initializer.controller.js'; +import { type ManifestBase, type UmbExtensionRegistry } from '@umbraco-cms/backoffice/extension-api'; import { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; /** @@ -14,7 +14,7 @@ export class UmbExtensionsManifestInitializer< ManifestTypeName extends keyof ManifestTypeMap | string, ManifestType extends ManifestBase = SpecificManifestTypeOrManifestBase, ControllerType extends UmbExtensionManifestInitializer = UmbExtensionManifestInitializer, - MyPermittedControllerType extends ControllerType = PermittedControllerType + MyPermittedControllerType extends ControllerType = PermittedControllerType, > extends UmbBaseExtensionsInitializer< ManifestTypes, ManifestTypeName, @@ -30,7 +30,7 @@ export class UmbExtensionsManifestInitializer< extensionRegistry: UmbExtensionRegistry, type: ManifestTypeName | Array, filter: null | ((manifest: ManifestType) => boolean), - onChange: (permittedManifests: Array) => void + onChange: (permittedManifests: Array) => void, ) { super(host, extensionRegistry, type, filter, onChange); this.#extensionRegistry = extensionRegistry; @@ -42,7 +42,7 @@ export class UmbExtensionsManifestInitializer< this, this.#extensionRegistry, manifest.alias, - this._extensionChanged + this._extensionChanged, ) as ControllerType; } } diff --git a/src/libs/extension-api/functions/create-extension-api.function.ts b/src/libs/extension-api/functions/create-extension-api.function.ts index 909a3990b1..9a31cb7496 100644 --- a/src/libs/extension-api/functions/create-extension-api.function.ts +++ b/src/libs/extension-api/functions/create-extension-api.function.ts @@ -1,36 +1,38 @@ -import { UmbApi } from "../models/api.interface.js"; -import { ManifestApi, ManifestElementAndApi } from "../types/base.types.js"; -import { loadManifestApi } from "./load-manifest-api.function.js"; +import { UmbApi } from '../models/api.interface.js'; +import { ManifestApi, ManifestElementAndApi } from '../types/base.types.js'; +import { loadManifestApi } from './load-manifest-api.function.js'; -export async function createExtensionApi(manifest: ManifestApi | ManifestElementAndApi, constructorArguments: Array = []): Promise { - - if(manifest.api) { +export async function createExtensionApi( + manifest: ManifestApi | ManifestElementAndApi, + constructorArguments: Array = [], +): Promise { + if (manifest.api) { const apiConstructor = await loadManifestApi(manifest.api); - if(apiConstructor) { + if (apiConstructor) { return new apiConstructor(...constructorArguments); } else { console.error( `-- Extension of alias "${manifest.alias}" did not succeed instantiate a API class via the extension manifest property 'api', using either a 'api' or 'default' export`, - manifest + manifest, ); } } - if(manifest.js) { + if (manifest.js) { const apiConstructor2 = await loadManifestApi(manifest.js); - if(apiConstructor2) { + if (apiConstructor2) { return new apiConstructor2(...constructorArguments); } else { console.error( `-- Extension of alias "${manifest.alias}" did not succeed instantiate a API class via the extension manifest property 'js', using either a 'api' or 'default' export`, - manifest + manifest, ); } } console.error( `-- Extension of alias "${manifest.alias}" did not succeed creating an api class instance, missing a JavaScript file via the 'api' or 'js' property.`, - manifest + manifest, ); return undefined; diff --git a/src/libs/extension-api/functions/create-extension-api.test.ts b/src/libs/extension-api/functions/create-extension-api.test.ts index 28417d3eda..d8d961aec4 100644 --- a/src/libs/extension-api/functions/create-extension-api.test.ts +++ b/src/libs/extension-api/functions/create-extension-api.test.ts @@ -3,9 +3,6 @@ import { ManifestApi } from '../types/index.js'; import { UmbApi } from '../models/api.interface.js'; import { createExtensionApi } from './create-extension-api.function.js'; - - - class UmbExtensionApiTrueTestClass implements UmbApi { isValidClassInstance() { return true; @@ -20,33 +17,25 @@ class UmbExtensionApiFalseTestClass implements UmbApi { destroy() {} } - - const jsModuleWithDefaultExport = { - default: UmbExtensionApiTrueTestClass + default: UmbExtensionApiTrueTestClass, }; const jsModuleWithApiExport = { - api: UmbExtensionApiTrueTestClass + api: UmbExtensionApiTrueTestClass, }; const jsModuleWithDefaultAndApiExport = { default: UmbExtensionApiFalseTestClass, - api: UmbExtensionApiTrueTestClass + api: UmbExtensionApiTrueTestClass, }; - - describe('Extension-Api: Create Extension Api', () => { - - - it('Returns `undefined` when manifest does not have any correct properties', async () => { - const manifest: ManifestApi = { type: 'my-test-type', alias: 'Umb.Test.createManifestApi', - name: 'pretty name' + name: 'pretty name', }; const api = await createExtensionApi(manifest, []); @@ -54,70 +43,65 @@ describe('Extension-Api: Create Extension Api', () => { }); it('Handles when `api` property contains a class constructor', async () => { - const manifest: ManifestApi = { type: 'my-test-type', alias: 'Umb.Test.createManifestApi', name: 'pretty name', - api: UmbExtensionApiTrueTestClass + api: UmbExtensionApiTrueTestClass, }; const api = await createExtensionApi(manifest, []); expect(api).to.not.be.undefined; - if(api) { + if (api) { expect(api.isValidClassInstance()).to.be.true; } }); it('Handles when `loader` has a default export', async () => { - const manifest: ManifestApi = { type: 'my-test-type', alias: 'Umb.Test.createManifestApi', name: 'pretty name', - js: () => Promise.resolve(jsModuleWithDefaultExport) + js: () => Promise.resolve(jsModuleWithDefaultExport), }; const api = await createExtensionApi(manifest, []); expect(api).to.not.be.undefined; - if(api) { + if (api) { expect(api.isValidClassInstance()).to.be.true; } }); it('Handles when `loader` has a api export', async () => { - const manifest: ManifestApi = { type: 'my-test-type', alias: 'Umb.Test.createManifestApi', name: 'pretty name', - js: () => Promise.resolve(jsModuleWithApiExport) + js: () => Promise.resolve(jsModuleWithApiExport), }; const api = await createExtensionApi(manifest, []); expect(api).to.not.be.undefined; - if(api) { + if (api) { expect(api.isValidClassInstance()).to.be.true; } }); it('Prioritizes api export from loader property', async () => { - const manifest: ManifestApi = { type: 'my-test-type', alias: 'Umb.Test.createManifestApi', name: 'pretty name', - js: () => Promise.resolve(jsModuleWithDefaultAndApiExport) + js: () => Promise.resolve(jsModuleWithDefaultAndApiExport), }; const api = await createExtensionApi(manifest, []); expect(api).to.not.be.undefined; - if(api) { + if (api) { expect(api.isValidClassInstance()).to.be.true; } }); //TODO: Test apiJs //TODO: Test js - }); diff --git a/src/libs/extension-api/functions/create-extension-element.function.ts b/src/libs/extension-api/functions/create-extension-element.function.ts index 2cd8677813..05544a62e0 100644 --- a/src/libs/extension-api/functions/create-extension-element.function.ts +++ b/src/libs/extension-api/functions/create-extension-element.function.ts @@ -1,43 +1,45 @@ -import { ManifestElement, ManifestElementAndApi } from "../types/base.types.js"; -import { loadManifestElement } from "./load-manifest-element.function.js"; +import { ManifestElement, ManifestElementAndApi } from '../types/base.types.js'; +import { loadManifestElement } from './load-manifest-element.function.js'; -export async function createExtensionElement(manifest: ManifestElement | ManifestElementAndApi, fallbackElement?: string): Promise { - - if(manifest.element) { +export async function createExtensionElement( + manifest: ManifestElement | ManifestElementAndApi, + fallbackElement?: string, +): Promise { + if (manifest.element) { const elementConstructor = await loadManifestElement(manifest.element); - if(elementConstructor) { + if (elementConstructor) { return new elementConstructor(); } else { console.error( `-- Extension of alias "${manifest.alias}" did not succeed creating an element class instance via the extension manifest property 'element', using either a 'element' or 'default' export`, - manifest + manifest, ); } } - if(manifest.js) { + if (manifest.js) { const elementConstructor2 = await loadManifestElement(manifest.js); - if(elementConstructor2) { + if (elementConstructor2) { return new elementConstructor2(); } else { console.error( `-- Extension of alias "${manifest.alias}" did not succeed creating an element class instance via the extension manifest property 'js', using either a 'element' or 'default' export`, - manifest + manifest, ); } } - if(manifest.elementName) { + if (manifest.elementName) { return document.createElement(manifest.elementName) as ElementType; } - if(fallbackElement) { + if (fallbackElement) { return document.createElement(fallbackElement) as ElementType; } console.error( `-- Extension of alias "${manifest.alias}" did not succeed creating an element, missing a JavaScript file via the 'element' or 'js' property or a Element Name in 'elementName' in the manifest.`, - manifest + manifest, ); return undefined; } diff --git a/src/libs/extension-api/functions/create-extension-element.test.ts b/src/libs/extension-api/functions/create-extension-element.test.ts index 21c4611c14..3b97e358c5 100644 --- a/src/libs/extension-api/functions/create-extension-element.test.ts +++ b/src/libs/extension-api/functions/create-extension-element.test.ts @@ -3,8 +3,6 @@ import { ManifestElement, ManifestElementAndApi } from '../types/index.js'; import { createExtensionElement } from './create-extension-element.function.js'; import { customElement } from '@umbraco-cms/backoffice/external/lit'; - - @customElement('umb-extension-api-true-test-element') class UmbExtensionApiTrueTestElement extends HTMLElement { isValidClassInstance() { @@ -19,32 +17,25 @@ class UmbExtensionApiFalseTestElement extends HTMLElement { } } - - const jsModuleWithDefaultExport = { - default: UmbExtensionApiTrueTestElement + default: UmbExtensionApiTrueTestElement, }; const jsModuleWithElementExport = { - element: UmbExtensionApiTrueTestElement + element: UmbExtensionApiTrueTestElement, }; const jsModuleWithDefaultAndElementExport = { default: UmbExtensionApiFalseTestElement, - element: UmbExtensionApiTrueTestElement + element: UmbExtensionApiTrueTestElement, }; - - describe('Extension-Api: Create Extension Element', () => { - - it('Returns `undefined` when manifest does not have any correct properties', async () => { - const manifest: ManifestElement = { type: 'my-test-type', alias: 'Umb.Test.CreateManifestElement', - name: 'pretty name' + name: 'pretty name', }; const api = await createExtensionElement(manifest); @@ -52,102 +43,94 @@ describe('Extension-Api: Create Extension Element', () => { }); it('Returns fallback element instance when manifest does not provide element', async () => { - const manifest: ManifestElement = { type: 'my-test-type', alias: 'Umb.Test.CreateManifestElement', - name: 'pretty name' + name: 'pretty name', }; const element = await createExtensionElement(manifest, 'umb-extension-api-true-test-element'); expect(element).to.not.be.undefined; - if(element) { + if (element) { expect(element.isValidClassInstance()).to.be.true; } }); - it('Still returns fallback element instance when manifest does not provide element and manifest has api', async () => { - const manifest: ManifestElementAndApi = { type: 'my-test-type', alias: 'Umb.Test.CreateManifestElement', name: 'pretty name', - api: class TestApi {} + api: class TestApi {}, }; const element = await createExtensionElement(manifest, 'umb-extension-api-true-test-element'); expect(element).to.not.be.undefined; - if(element) { + if (element) { expect(element.isValidClassInstance()).to.be.true; } }); it('Handles when `api` property contains a class constructor', async () => { - const manifest: ManifestElement = { type: 'my-test-type', alias: 'Umb.Test.CreateManifestElement', name: 'pretty name', - elementName: 'umb-extension-api-true-test-element' + elementName: 'umb-extension-api-true-test-element', }; const element = await createExtensionElement(manifest); expect(element).to.not.be.undefined; - if(element) { + if (element) { expect(element.isValidClassInstance()).to.be.true; } }); it('Handles when `loader` has a default export', async () => { - const manifest: ManifestElement = { type: 'my-test-type', alias: 'Umb.Test.CreateManifestElement', name: 'pretty name', - js: () => Promise.resolve(jsModuleWithDefaultExport) + js: () => Promise.resolve(jsModuleWithDefaultExport), }; const element = await createExtensionElement(manifest); expect(element).to.not.be.undefined; - if(element) { + if (element) { expect(element.isValidClassInstance()).to.be.true; } }); it('Handles when `loader` has a element export', async () => { - const manifest: ManifestElement = { type: 'my-test-type', alias: 'Umb.Test.CreateManifestElement', name: 'pretty name', - js: () => Promise.resolve(jsModuleWithElementExport) + js: () => Promise.resolve(jsModuleWithElementExport), }; const element = await createExtensionElement(manifest); expect(element).to.not.be.undefined; - if(element) { + if (element) { expect(element.isValidClassInstance()).to.be.true; } }); it('Prioritizes api export from loader property', async () => { - const manifest: ManifestElement = { type: 'my-test-type', alias: 'Umb.Test.CreateManifestElement', name: 'pretty name', - js: () => Promise.resolve(jsModuleWithDefaultAndElementExport) + js: () => Promise.resolve(jsModuleWithDefaultAndElementExport), }; const element = await createExtensionElement(manifest); expect(element).to.not.be.undefined; - if(element) { + if (element) { expect(element.isValidClassInstance()).to.be.true; } }); //TODO: Test elementJs //TODO: Test js - }); diff --git a/src/libs/extension-api/functions/index.ts b/src/libs/extension-api/functions/index.ts index b90a955eac..8081204bec 100644 --- a/src/libs/extension-api/functions/index.ts +++ b/src/libs/extension-api/functions/index.ts @@ -1,4 +1,3 @@ - export * from './create-extension-api.function.js'; export * from './create-extension-element.function.js'; export * from './has-init-export.function.js'; diff --git a/src/libs/extension-api/models/api.interface.ts b/src/libs/extension-api/models/api.interface.ts index 895fd43f69..d6a5f9ec78 100644 --- a/src/libs/extension-api/models/api.interface.ts +++ b/src/libs/extension-api/models/api.interface.ts @@ -1,3 +1,3 @@ export interface UmbApi { destroy?(): void; -} \ No newline at end of file +} diff --git a/src/libs/extension-api/models/index.ts b/src/libs/extension-api/models/index.ts index 643057374c..bb52c4681d 100644 --- a/src/libs/extension-api/models/index.ts +++ b/src/libs/extension-api/models/index.ts @@ -1,2 +1,2 @@ -export * from './entry-point.interface.js' -export * from './api.interface.js' +export * from './entry-point.interface.js'; +export * from './api.interface.js'; diff --git a/src/libs/extension-api/type-guards/index.ts b/src/libs/extension-api/type-guards/index.ts index 22106b469d..3ab3450a30 100644 --- a/src/libs/extension-api/type-guards/index.ts +++ b/src/libs/extension-api/type-guards/index.ts @@ -2,4 +2,4 @@ export * from './has-api-export.function.js'; export * from './has-default-export.function.js'; export * from './has-element-export.function.js'; export * from './is-manifest-base-type.function.js'; -export * from './is-manifest-element-name-type.function.js'; \ No newline at end of file +export * from './is-manifest-element-name-type.function.js'; diff --git a/src/libs/extension-api/type-guards/is-manifest-base-type.function.ts b/src/libs/extension-api/type-guards/is-manifest-base-type.function.ts index 001d355ef2..3e92e93ccb 100644 --- a/src/libs/extension-api/type-guards/is-manifest-base-type.function.ts +++ b/src/libs/extension-api/type-guards/is-manifest-base-type.function.ts @@ -1,5 +1,5 @@ -import type { ManifestBase } from "../types/manifest-base.interface.js"; +import type { ManifestBase } from '../types/manifest-base.interface.js'; export function isManifestBaseType(x: unknown): x is ManifestBase { return typeof x === 'object' && x !== null && 'alias' in x; -} \ No newline at end of file +} diff --git a/src/libs/extension-api/types/condition.types.ts b/src/libs/extension-api/types/condition.types.ts index a09b527510..740d393311 100644 --- a/src/libs/extension-api/types/condition.types.ts +++ b/src/libs/extension-api/types/condition.types.ts @@ -1,4 +1,4 @@ -import type { ManifestBase } from "./manifest-base.interface.js"; +import type { ManifestBase } from './manifest-base.interface.js'; export interface UmbConditionConfigBase { alias: AliasType; @@ -12,7 +12,7 @@ export type ConditionTypeMap = { export type SpecificConditionTypeOrUmbConditionConfigBase< ConditionTypes extends UmbConditionConfigBase, - T extends keyof ConditionTypeMap | string + T extends keyof ConditionTypeMap | string, > = T extends keyof ConditionTypeMap ? ConditionTypeMap[T] : UmbConditionConfigBase; export interface ManifestWithDynamicConditions @@ -25,4 +25,4 @@ export interface ManifestWithDynamicConditions; -} \ No newline at end of file +} diff --git a/src/libs/extension-api/types/index.ts b/src/libs/extension-api/types/index.ts index 14b601b5ce..4bb9e60d1c 100644 --- a/src/libs/extension-api/types/index.ts +++ b/src/libs/extension-api/types/index.ts @@ -5,4 +5,4 @@ export * from './manifest-bundle.interface.js'; export * from './manifest-condition.interface.js'; export * from './manifest-entrypoint.interface.js'; export * from './manifest-kind.interface.js'; -export * from './utils.js'; \ No newline at end of file +export * from './utils.js'; diff --git a/src/libs/extension-api/types/manifest-base.interface.ts b/src/libs/extension-api/types/manifest-base.interface.ts index 8a89595272..9b82ca4491 100644 --- a/src/libs/extension-api/types/manifest-base.interface.ts +++ b/src/libs/extension-api/types/manifest-base.interface.ts @@ -1,4 +1,3 @@ - export interface ManifestBase { /** * The type of extension such as dashboard etc... @@ -26,4 +25,4 @@ export interface ManifestBase { * Extensions such as dashboards are ordered by weight with lower numbers being first in the list */ weight?: number; -} \ No newline at end of file +} diff --git a/src/libs/extension-api/types/manifest-bundle.interface.ts b/src/libs/extension-api/types/manifest-bundle.interface.ts index 25a99091bc..f0e62ede1b 100644 --- a/src/libs/extension-api/types/manifest-bundle.interface.ts +++ b/src/libs/extension-api/types/manifest-bundle.interface.ts @@ -1,5 +1,5 @@ -import type { ManifestPlainJs } from "./base.types.js"; -import type { ManifestBase } from "./manifest-base.interface.js"; +import type { ManifestPlainJs } from './base.types.js'; +import type { ManifestBase } from './manifest-base.interface.js'; /** * This type of extension takes a JS module and registers all exported manifests from the pointed JS file. @@ -8,4 +8,3 @@ export interface ManifestBundle }> { type: 'bundle'; } - diff --git a/src/libs/extension-api/types/manifest-condition.interface.ts b/src/libs/extension-api/types/manifest-condition.interface.ts index 324af0a7b4..c8785ac140 100644 --- a/src/libs/extension-api/types/manifest-condition.interface.ts +++ b/src/libs/extension-api/types/manifest-condition.interface.ts @@ -1,5 +1,5 @@ -import type { UmbExtensionCondition } from "../condition/index.js"; -import type { ManifestApi } from "./base.types.js"; +import type { UmbExtensionCondition } from '../condition/index.js'; +import type { ManifestApi } from './base.types.js'; /** * This type of extension takes a JS module and registers all exported manifests from the pointed JS file. diff --git a/src/libs/extension-api/types/manifest-entrypoint.interface.ts b/src/libs/extension-api/types/manifest-entrypoint.interface.ts index 76764b321c..0c400daf64 100644 --- a/src/libs/extension-api/types/manifest-entrypoint.interface.ts +++ b/src/libs/extension-api/types/manifest-entrypoint.interface.ts @@ -1,5 +1,5 @@ -import type { UmbEntryPointModule } from "../models/index.js"; -import type { ManifestPlainJs } from "./base.types.js"; +import type { UmbEntryPointModule } from '../models/index.js'; +import type { ManifestPlainJs } from './base.types.js'; /** * This type of extension gives full control and will simply load the specified JS file diff --git a/src/libs/extension-api/types/map.types.ts b/src/libs/extension-api/types/map.types.ts index 4c5fbb3b43..f02c6efe93 100644 --- a/src/libs/extension-api/types/map.types.ts +++ b/src/libs/extension-api/types/map.types.ts @@ -1,4 +1,4 @@ -import type { ManifestBase } from "./manifest-base.interface.js"; +import type { ManifestBase } from './manifest-base.interface.js'; export type ManifestTypeMap = { [Manifest in ManifestTypes as Manifest['type']]: Manifest; @@ -8,5 +8,5 @@ export type ManifestTypeMap = { export type SpecificManifestTypeOrManifestBase< ManifestTypes extends ManifestBase, - T extends keyof ManifestTypeMap | string + T extends keyof ManifestTypeMap | string, > = T extends keyof ManifestTypeMap ? ManifestTypeMap[T] : ManifestBase; diff --git a/src/libs/observable-api/states/basic-state.ts b/src/libs/observable-api/states/basic-state.ts index 2172afa7fd..fe3e9ae7a2 100644 --- a/src/libs/observable-api/states/basic-state.ts +++ b/src/libs/observable-api/states/basic-state.ts @@ -6,14 +6,12 @@ import { BehaviorSubject } from '@umbraco-cms/backoffice/external/rxjs'; * @description - State ensures the data is unique, not updating any Observes unless there is an actual change of the value using `===`. */ export class UmbBasicState { - - protected _subject:BehaviorSubject; + protected _subject: BehaviorSubject; constructor(initialData: T) { this._subject = new BehaviorSubject(initialData); } - /** * @method asObservable * @return {Observable} Observable that the State casts to. @@ -22,7 +20,7 @@ export class UmbBasicState { * const myState = new UmbArrayState('Hello world'); * * this.observe(myState, (latestStateValue) => console.log("Value is: ", latestStateValue)); - */ + */ public asObservable(): ReturnType['asObservable']> { return this._subject.asObservable(); } @@ -33,10 +31,10 @@ export class UmbBasicState { * @example Example retrieve the current data of a state * const myState = new UmbArrayState('Hello world'); * console.log("Value is: ", myState.getValue()); - */ + */ public get value(): BehaviorSubject['value'] { return this._subject.value; - }; + } /** * @method getValue @@ -45,7 +43,7 @@ export class UmbBasicState { * @example Example retrieve the current data of a state * const myState = new UmbArrayState('Hello world'); * console.log("Value is: ", myState.value); - */ + */ public getValue(): ReturnType['getValue']> { return this._subject.getValue(); } @@ -53,7 +51,7 @@ export class UmbBasicState { /** * @method destroy * @description - Destroys this state and completes all observations made to it. - */ + */ public destroy(): void { this._subject.complete(); } @@ -67,7 +65,7 @@ export class UmbBasicState { * // myState.value is equal 'Good morning'. * myState.next('Goodnight') * // myState.value is equal 'Goodnight'. - */ + */ next(newData: T): void { if (newData !== this._subject.getValue()) { this._subject.next(newData); diff --git a/src/libs/observable-api/states/class-state.ts b/src/libs/observable-api/states/class-state.ts index b67a38e89c..69695deecd 100644 --- a/src/libs/observable-api/states/class-state.ts +++ b/src/libs/observable-api/states/class-state.ts @@ -1,4 +1,4 @@ -import { UmbBasicState } from "./basic-state.js"; +import { UmbBasicState } from './basic-state.js'; export interface UmbClassStateData { equal(otherClass: this | undefined): boolean; diff --git a/src/libs/observable-api/utils/partial-update-frozen-array.function.ts b/src/libs/observable-api/utils/partial-update-frozen-array.function.ts index b19c322594..e7ebbbc57a 100644 --- a/src/libs/observable-api/utils/partial-update-frozen-array.function.ts +++ b/src/libs/observable-api/utils/partial-update-frozen-array.function.ts @@ -13,7 +13,7 @@ export function partialUpdateFrozenArray( data: T[], partialEntry: Partial, - findMethod: (entry: T) => boolean + findMethod: (entry: T) => boolean, ): T[] { const unFrozenDataSet = [...data]; const indexToReplace = unFrozenDataSet.findIndex((x) => findMethod(x)); diff --git a/src/mocks/data/document.data.ts b/src/mocks/data/document.data.ts index a2eaab07bf..947e7762ba 100644 --- a/src/mocks/data/document.data.ts +++ b/src/mocks/data/document.data.ts @@ -695,7 +695,6 @@ class UmbDocumentData extends UmbEntityData { } publish(id: string, data: PublishDocumentRequestModel) { - // Update detail data: const foundIndex = this.data.findIndex((item) => item.id === id); if (foundIndex !== -1) { @@ -719,7 +718,6 @@ class UmbDocumentData extends UmbEntityData { } unpublish(id: string, data: PublishDocumentRequestModel) { - // Update detail data: const foundIndex = this.data.findIndex((item) => item.id === id); if (foundIndex !== -1) { diff --git a/src/mocks/data/partial-views.data.ts b/src/mocks/data/partial-views.data.ts index 823de45bc6..313c68e553 100644 --- a/src/mocks/data/partial-views.data.ts +++ b/src/mocks/data/partial-views.data.ts @@ -375,4 +375,4 @@ class UmbPartialViewsData extends UmbEntityData { } export const umbPartialViewSnippetsData = new UmbPartialViewSnippetsData(); -export const umbPartialViewsData = new UmbPartialViewsData(); \ No newline at end of file +export const umbPartialViewsData = new UmbPartialViewsData(); diff --git a/src/mocks/data/utils.ts b/src/mocks/data/utils.ts index 8fcf7acaa5..0e3d447613 100644 --- a/src/mocks/data/utils.ts +++ b/src/mocks/data/utils.ts @@ -104,7 +104,7 @@ export const arrayFilter = (filterBy: Array, value?: Array): boo } return filterBy.some((filterValue: string) => value?.includes(filterValue)); -} +}; export const stringFilter = (filterBy: Array, value?: string): boolean => { // if a filter is not set, return all items diff --git a/src/mocks/handlers/config.handlers.ts b/src/mocks/handlers/config.handlers.ts index 800d803b10..32ebfd7b59 100644 --- a/src/mocks/handlers/config.handlers.ts +++ b/src/mocks/handlers/config.handlers.ts @@ -7,7 +7,7 @@ export const handlers = [ return res( // Respond with a 200 status code ctx.status(200), - ctx.json({ offset: -120 }) + ctx.json({ offset: -120 }), ); }), ]; diff --git a/src/mocks/handlers/examine-management.handlers.ts b/src/mocks/handlers/examine-management.handlers.ts index ae685ea406..43532d2d13 100644 --- a/src/mocks/handlers/examine-management.handlers.ts +++ b/src/mocks/handlers/examine-management.handlers.ts @@ -14,7 +14,7 @@ export const handlers = [ return res( // Respond with a 200 status code ctx.status(200), - ctx.json(PagedIndexers) + ctx.json(PagedIndexers), ); }), @@ -51,7 +51,7 @@ export const handlers = [ ctx.json({ total: 0, items: [{ name: 'ExternalSearcher' }, { name: 'InternalSearcher' }, { name: 'InternalMemberSearcher' }], - }) + }), ); }), @@ -69,7 +69,7 @@ export const handlers = [ ctx.json({ total: 0, items: searchResultMockData, - }) + }), ); } else { return res(ctx.status(404)); diff --git a/src/mocks/handlers/health-check.handlers.ts b/src/mocks/handlers/health-check.handlers.ts index eb98ebb25b..525a593ed6 100644 --- a/src/mocks/handlers/health-check.handlers.ts +++ b/src/mocks/handlers/health-check.handlers.ts @@ -22,7 +22,7 @@ export const handlers = [ return res( // Respond with a 200 status code ctx.status(200), - ctx.json({ total: 9999, items: healthGroupsWithoutResult }) + ctx.json({ total: 9999, items: healthGroupsWithoutResult }), ); }), @@ -74,7 +74,7 @@ export const handlers = [ // Respond with a 200 status code ctx.delay(1000), ctx.status(200), - ctx.json(result) + ctx.json(result), ); }), ]; diff --git a/src/mocks/handlers/install.handlers.ts b/src/mocks/handlers/install.handlers.ts index 7d36eaf4fc..c6b1defba7 100644 --- a/src/mocks/handlers/install.handlers.ts +++ b/src/mocks/handlers/install.handlers.ts @@ -74,7 +74,7 @@ export const handlers = [ requiresConnectionTest: true, }, ], - }) + }), ); }), @@ -88,13 +88,13 @@ export const handlers = [ type: 'connection', status: 400, detail: 'Database connection failed', - }) + }), ); } return res( // Respond with a 200 status code - ctx.status(201) + ctx.status(201), ); }), @@ -113,12 +113,12 @@ export const handlers = [ errors: { name: ['Database name is invalid'], }, - }) + }), ); } return res( // Respond with a 200 status code - ctx.status(201) + ctx.status(201), ); }), ]; diff --git a/src/mocks/handlers/language.handlers.ts b/src/mocks/handlers/language.handlers.ts index 0ac0d51b67..1200f10772 100644 --- a/src/mocks/handlers/language.handlers.ts +++ b/src/mocks/handlers/language.handlers.ts @@ -55,7 +55,7 @@ export const handlers = [ errors: { isoCode: ['Language with same iso code already exists'], }, - }) + }), ); } }), diff --git a/src/mocks/handlers/manifests.handlers.ts b/src/mocks/handlers/manifests.handlers.ts index d942db27ab..6c138fb793 100644 --- a/src/mocks/handlers/manifests.handlers.ts +++ b/src/mocks/handlers/manifests.handlers.ts @@ -75,7 +75,7 @@ export const manifestDevelopmentHandler = rest.get(umbracoPath('/package/manifes }, ], }, - ]) + ]), ); }); @@ -83,6 +83,6 @@ export const manifestEmptyHandler = rest.get(umbracoPath('/package/manifest'), ( return res( // Respond with a 200 status code ctx.status(200), - ctx.json([]) + ctx.json([]), ); }); diff --git a/src/mocks/handlers/modelsbuilder.handlers.ts b/src/mocks/handlers/modelsbuilder.handlers.ts index e8a462b63a..3564a5f0a6 100644 --- a/src/mocks/handlers/modelsbuilder.handlers.ts +++ b/src/mocks/handlers/modelsbuilder.handlers.ts @@ -14,7 +14,7 @@ export const handlers = [ return res( // Respond with a 200 status code ctx.status(200), - ctx.json({}) + ctx.json({}), ); }), @@ -26,7 +26,7 @@ export const handlers = [ return res( // Respond with a 200 status code ctx.status(200), - ctx.json({}) + ctx.json({}), ); }), ]; diff --git a/src/mocks/handlers/package.handlers.ts b/src/mocks/handlers/package.handlers.ts index 06d5ae5cb9..651c6139da 100644 --- a/src/mocks/handlers/package.handlers.ts +++ b/src/mocks/handlers/package.handlers.ts @@ -30,7 +30,7 @@ export const handlers = [ packageName: 'Package with a view', }, ], - }) + }), ); }), @@ -47,7 +47,7 @@ export const handlers = [ ctx.json({ total: packageArray.length, items: packageArray, - }) + }), ); }), diff --git a/src/mocks/handlers/performance-profiling.handlers.ts b/src/mocks/handlers/performance-profiling.handlers.ts index 331dbc8bfe..bca95cd837 100644 --- a/src/mocks/handlers/performance-profiling.handlers.ts +++ b/src/mocks/handlers/performance-profiling.handlers.ts @@ -8,14 +8,14 @@ export const handlers = [ return res( // Respond with a 200 status code ctx.status(200), - ctx.json({ enabled: true }) + ctx.json({ enabled: true }), ); }), rest.put(umbracoPath('/profiling/status'), (_req, res, ctx) => { return res( // Respond with a 200 status code - ctx.status(200) + ctx.status(200), ); }), ]; diff --git a/src/mocks/handlers/published-status.handlers.ts b/src/mocks/handlers/published-status.handlers.ts index d59dd3e7ed..c4e655b2d2 100644 --- a/src/mocks/handlers/published-status.handlers.ts +++ b/src/mocks/handlers/published-status.handlers.ts @@ -8,8 +8,8 @@ export const handlers = [ // Respond with a 200 status code ctx.status(200), ctx.json( - 'Database cache is ok. ContentStore contains 1 item and has 1 generation and 0 snapshot. MediaStore contains 5 items and has 1 generation and 0 snapshot.' - ) + 'Database cache is ok. ContentStore contains 1 item and has 1 generation and 0 snapshot. MediaStore contains 5 items and has 1 generation and 0 snapshot.', + ), ); }), @@ -18,7 +18,7 @@ export const handlers = [ return res( // Respond with a 200 status code - ctx.status(200) + ctx.status(200), ); }), @@ -27,14 +27,14 @@ export const handlers = [ return res( // Respond with a 200 status code - ctx.status(200) + ctx.status(200), ); }), rest.post(umbracoPath('/published-cache/collect'), (_req, res, ctx) => { return res( // Respond with a 200 status code - ctx.status(200) + ctx.status(200), ); }), ]; diff --git a/src/mocks/handlers/server.handlers.ts b/src/mocks/handlers/server.handlers.ts index 66b739d365..b62fb9112a 100644 --- a/src/mocks/handlers/server.handlers.ts +++ b/src/mocks/handlers/server.handlers.ts @@ -12,7 +12,7 @@ export const serverRunningHandler = rest.get(umbracoPath('/server/status'), (_re ctx.status(200), ctx.json({ serverStatus: RuntimeLevelModel.RUN, - }) + }), ); }); @@ -22,7 +22,7 @@ export const serverMustInstallHandler = rest.get(umbracoPath('/server/status'), ctx.status(200), ctx.json({ serverStatus: RuntimeLevelModel.INSTALL, - }) + }), ); }); @@ -32,7 +32,7 @@ export const serverMustUpgradeHandler = rest.get(umbracoPath('/server/status'), ctx.status(200), ctx.json({ serverStatus: RuntimeLevelModel.UPGRADE, - }) + }), ); }); @@ -42,6 +42,6 @@ export const serverVersionHandler = rest.get(umbracoPath('/server/version'), (_r ctx.status(200), ctx.json({ version: '13.0.0', - }) + }), ); }); diff --git a/src/mocks/handlers/telemetry.handlers.ts b/src/mocks/handlers/telemetry.handlers.ts index 488d87887a..1f0d10a57f 100644 --- a/src/mocks/handlers/telemetry.handlers.ts +++ b/src/mocks/handlers/telemetry.handlers.ts @@ -16,7 +16,7 @@ export const handlers = [ ctx.status(200), ctx.json({ telemetryLevel, - }) + }), ); }), @@ -31,7 +31,7 @@ export const handlers = [ { telemetryLevel: TelemetryLevelModel.BASIC }, { telemetryLevel: TelemetryLevelModel.DETAILED }, ], - }) + }), ); }), @@ -41,7 +41,7 @@ export const handlers = [ telemetryLevel = newLevel; return res( // Respond with a 200 status code - ctx.status(200) + ctx.status(200), ); } else { return res(ctx.status(400)); diff --git a/src/mocks/handlers/upgrade.handlers.ts b/src/mocks/handlers/upgrade.handlers.ts index d611ea1240..500880e3df 100644 --- a/src/mocks/handlers/upgrade.handlers.ts +++ b/src/mocks/handlers/upgrade.handlers.ts @@ -14,7 +14,7 @@ export const handlers = [ oldVersion: '13.0.0', newVersion: '13.1.0', reportUrl: 'https://our.umbraco.com/download/releases/1000', - }) + }), ); }), @@ -23,7 +23,7 @@ export const handlers = [ return res( // Respond with a 200 status code - ctx.status(201) + ctx.status(201), ); }), ]; diff --git a/src/packages/core/collection/components/collection-view-bundle.element.ts b/src/packages/core/collection/components/collection-view-bundle.element.ts index 94d44b99b0..f1baff477b 100644 --- a/src/packages/core/collection/components/collection-view-bundle.element.ts +++ b/src/packages/core/collection/components/collection-view-bundle.element.ts @@ -67,7 +67,7 @@ export class UmbCollectionViewBundleElement extends UmbLitElement { ${this.#renderItemDisplay(this._currentView)} - +

${this._views.map((view) => this.#renderItem(view))}
diff --git a/src/packages/core/components/backoffice-notification-container/backoffice-notification-container.element.ts b/src/packages/core/components/backoffice-notification-container/backoffice-notification-container.element.ts index 676e080f22..f386b64cdb 100644 --- a/src/packages/core/components/backoffice-notification-container/backoffice-notification-container.element.ts +++ b/src/packages/core/components/backoffice-notification-container/backoffice-notification-container.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, CSSResultGroup, html, customElement, state, repeat } from '@umbraco-cms/backoffice/external/lit'; import { UmbNotificationHandler, @@ -38,7 +38,7 @@ export class UmbBackofficeNotificationContainerElement extends UmbLitElement { ? repeat( this._notifications, (notification: UmbNotificationHandler) => notification.key, - (notification) => html`${notification.element}` + (notification) => html`${notification.element}`, ) : ''} diff --git a/src/packages/core/components/body-layout/body-layout.stories.ts b/src/packages/core/components/body-layout/body-layout.stories.ts index 305f5d9b4e..c32feb03af 100644 --- a/src/packages/core/components/body-layout/body-layout.stories.ts +++ b/src/packages/core/components/body-layout/body-layout.stories.ts @@ -13,9 +13,10 @@ export default meta; type Story = StoryObj; export const Overview: Story = { - render: () => html` -
Header slot
- Main slot -
Footer slot
- `, + render: () => + html` +
Header slot
+ Main slot +
Footer slot
+ `, }; diff --git a/src/packages/core/components/button-with-dropdown/button-with-dropdown.element.ts b/src/packages/core/components/button-with-dropdown/button-with-dropdown.element.ts deleted file mode 100644 index c4db6b771a..0000000000 --- a/src/packages/core/components/button-with-dropdown/button-with-dropdown.element.ts +++ /dev/null @@ -1,88 +0,0 @@ -import { - InterfaceColor, - InterfaceLook, - PopoverPlacement, - UUIPopoverElement, - UUISymbolExpandElement, -} from '@umbraco-cms/backoffice/external/uui'; -import { css, html, LitElement, customElement, property, query } from '@umbraco-cms/backoffice/external/lit'; - -// TODO: maybe this should go to UI library? It's a common pattern -// TODO: consider not using this, but instead use dropdown, which is more generic shared component of backoffice. (this is at the movement only used in Log Viewer) -@customElement('umb-button-with-dropdown') -export class UmbButtonWithDropdownElement extends LitElement { - @property() - label = ''; - - @property() - open = false; - - @property() - look: InterfaceLook = 'default'; - - @property() - color: InterfaceColor = 'default'; - - @property() - placement: PopoverPlacement = 'bottom-start'; - - @property({ type: Boolean }) - compact = false; - - @query('#symbol-expand') - symbolExpand!: UUISymbolExpandElement; - - @query('#popover') - popover!: UUIPopoverElement; - - openPopover() { - this.open = true; - this.popover.open = true; - this.symbolExpand.open = true; - } - - closePopover() { - this.open = false; - this.popover.open = false; - this.symbolExpand.open = false; - } - - #togglePopover() { - this.open ? this.closePopover() : this.openPopover(); - } - - render() { - return html` - - - - - -
- -
- - `; - } - - static styles = [ - css` - uui-symbol-expand { - margin-left: var(--uui-size-space-3); - } - `, - ]; -} - -declare global { - interface HTMLElementTagNameMap { - 'umb-button-with-dropdown': UmbButtonWithDropdownElement; - } -} diff --git a/src/packages/core/components/button-with-dropdown/button-with-dropdown.stories.ts b/src/packages/core/components/button-with-dropdown/button-with-dropdown.stories.ts deleted file mode 100644 index 7a52a8a1c9..0000000000 --- a/src/packages/core/components/button-with-dropdown/button-with-dropdown.stories.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Meta, Story } from '@storybook/web-components'; -import { UmbButtonWithDropdownElement } from './button-with-dropdown.element.js'; -import { html } from '@umbraco-cms/backoffice/external/lit'; - -export default { - title: 'Components/Button with dropdown', - component: 'umb-button-with-dropdown', - id: 'umb-button-with-dropdown', -} as Meta; - -export const AAAOverview: Story = () => html` - Open me -
I am a dropdown
-`; -AAAOverview.storyName = 'Overview'; diff --git a/src/packages/core/components/dropdown/dropdown.element.ts b/src/packages/core/components/dropdown/dropdown.element.ts index ba3edb705e..ea66e6407f 100644 --- a/src/packages/core/components/dropdown/dropdown.element.ts +++ b/src/packages/core/components/dropdown/dropdown.element.ts @@ -1,48 +1,99 @@ +import { + InterfaceColor, + InterfaceLook, + PopoverContainerPlacement, + UUIPopoverContainerElement, +} from '@umbraco-cms/backoffice/external/uui'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; -import { css, html, nothing, customElement, property } from '@umbraco-cms/backoffice/external/lit'; +import { + css, + html, + customElement, + property, + PropertyValueMap, + query, + when, +} from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; // TODO: maybe move this to UI Library. @customElement('umb-dropdown') export class UmbDropdownElement extends UmbLitElement { + @query('#dropdown-popover') + popoverContainerElement?: UUIPopoverContainerElement; @property({ type: Boolean, reflect: true }) open = false; - render() { - return html` - (this.open = false)}> - - ${this.open ? this.#renderDropdown() : nothing} - - `; + @property() + label = ''; + + @property() + look: InterfaceLook = 'default'; + + @property() + color: InterfaceColor = 'default'; + + @property() + placement: PopoverContainerPlacement = 'bottom-start'; + + @property({ type: Boolean }) + compact = false; + + @property({ type: Boolean, attribute: 'hide-expand' }) + hideExpand = false; + + protected updated(_changedProperties: PropertyValueMap | Map): void { + super.updated(_changedProperties); + if (_changedProperties.has('open') && this.popoverContainerElement) { + // TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet. + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + this.open ? this.popoverContainerElement.showPopover() : this.popoverContainerElement.hidePopover(); + } + } + + // TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet. + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + #onToggle(event: ToggleEvent) { + this.open = event.newState === 'open'; } - #renderDropdown() { + render() { return html` - + + + ${when( + !this.hideExpand, + () => html``, + )} + + + + + + `; } static styles = [ UmbTextStyles, css` - #container { - display: inline-block; - width: unset; + #dropdown-button { + min-width: max-content; + } + :host(:not([hide-expand]):not([compact])) #dropdown-button { + --uui-button-padding-right-factor: 2; } - #dropdown { - overflow: hidden; - z-index: -1; - background-color: var(--uui-combobox-popover-background-color, var(--uui-color-surface)); - border: 1px solid var(--uui-color-border); - border-radius: var(--uui-border-radius); - width: 100%; - height: 100%; - box-sizing: border-box; - box-shadow: var(--uui-shadow-depth-3); + :host(:not([compact])) #symbol-expand { + margin-left: var(--uui-size-space-2); } `, ]; diff --git a/src/packages/core/components/empty-state/empty-state.element.ts b/src/packages/core/components/empty-state/empty-state.element.ts index b9a6f254e9..2f302e0456 100644 --- a/src/packages/core/components/empty-state/empty-state.element.ts +++ b/src/packages/core/components/empty-state/empty-state.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, LitElement, customElement, property } from '@umbraco-cms/backoffice/external/lit'; @customElement('umb-empty-state') diff --git a/src/packages/core/components/empty-state/empty-state.stories.ts b/src/packages/core/components/empty-state/empty-state.stories.ts index ca470e4e5c..0f5ec49ad2 100644 --- a/src/packages/core/components/empty-state/empty-state.stories.ts +++ b/src/packages/core/components/empty-state/empty-state.stories.ts @@ -6,9 +6,10 @@ import type { UmbEmptyStateElement } from './empty-state.element.js'; const meta: Meta = { title: 'Components/Empty State', component: 'umb-empty-state', - render: (args) => html` There are no items to be found`, + render: (args) => + html` There are no items to be found`, }; export default meta; diff --git a/src/packages/core/components/entity-actions-bundle/entity-actions-bundle.element.ts b/src/packages/core/components/entity-actions-bundle/entity-actions-bundle.element.ts index 10f05d44a5..46bab98a29 100644 --- a/src/packages/core/components/entity-actions-bundle/entity-actions-bundle.element.ts +++ b/src/packages/core/components/entity-actions-bundle/entity-actions-bundle.element.ts @@ -1,5 +1,5 @@ import { css, html, nothing, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { map } from '@umbraco-cms/backoffice/external/rxjs'; import { UmbSectionSidebarContext, UMB_SECTION_SIDEBAR_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/section'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @@ -48,7 +48,7 @@ export class UmbEntityActionsBundleElement extends UmbLitElement { (actions) => { this._hasActions = actions.length > 0; }, - 'umbEntityActionsObserver' + 'umbEntityActionsObserver', ); } diff --git a/src/packages/core/components/extension-slot/extension-slot.element.ts b/src/packages/core/components/extension-slot/extension-slot.element.ts index 0e3ddae1c8..97c050d41e 100644 --- a/src/packages/core/components/extension-slot/extension-slot.element.ts +++ b/src/packages/core/components/extension-slot/extension-slot.element.ts @@ -92,7 +92,7 @@ export class UmbExtensionSlotElement extends UmbLitElement { #props?: Record = {}; @property({ type: String, attribute: 'default-element' }) - public defaultElement?:string; + public defaultElement?: string; @property() public renderMethod?: (extension: UmbExtensionElementInitializer) => TemplateResult | HTMLElement | null | undefined; @@ -114,7 +114,7 @@ export class UmbExtensionSlotElement extends UmbLitElement { (extensionControllers) => { this._permittedExts = extensionControllers; }, - this.defaultElement + this.defaultElement, ); this.#extensionsController.properties = this.#props; } @@ -124,7 +124,7 @@ export class UmbExtensionSlotElement extends UmbLitElement { return repeat( this._permittedExts, (ext) => ext.alias, - (ext) => (this.renderMethod ? this.renderMethod(ext) : ext.component) + (ext) => (this.renderMethod ? this.renderMethod(ext) : ext.component), ); } diff --git a/src/packages/core/components/extension-slot/extension-slot.test.ts b/src/packages/core/components/extension-slot/extension-slot.test.ts index 70cac2d8df..c933e21a94 100644 --- a/src/packages/core/components/extension-slot/extension-slot.test.ts +++ b/src/packages/core/components/extension-slot/extension-slot.test.ts @@ -76,7 +76,7 @@ describe('UmbExtensionSlotElement', () => { element = await fixture( html` x.alias === 'unit-test-ext-slot-element-manifest'}>` + .filter=${(x: ManifestDashboard) => x.alias === 'unit-test-ext-slot-element-manifest'}>`, ); await sleep(0); @@ -90,14 +90,14 @@ describe('UmbExtensionSlotElement', () => { type="dashboard" .filter=${(x: ManifestDashboard) => x.alias === 'unit-test-ext-slot-element-manifest'} .renderMethod=${(controller: UmbExtensionElementInitializer) => html`${controller.component}`}> - ` + `, ); await sleep(0); expect(element.shadowRoot!.firstElementChild?.nodeName).to.be.equal('BLA'); expect(element.shadowRoot!.firstElementChild?.firstElementChild).to.be.instanceOf( - UmbTestExtensionSlotManifestElement + UmbTestExtensionSlotManifestElement, ); }); @@ -107,7 +107,7 @@ describe('UmbExtensionSlotElement', () => { type="dashboard" .filter=${(x: ManifestDashboard) => x.alias === 'unit-test-ext-slot-element-manifest'} .props=${{ testProp: 'fooBar' }}> - ` + `, ); await sleep(0); diff --git a/src/packages/core/components/footer-layout/footer-layout.element.ts b/src/packages/core/components/footer-layout/footer-layout.element.ts index c0ca4fb8c2..a85432e586 100644 --- a/src/packages/core/components/footer-layout/footer-layout.element.ts +++ b/src/packages/core/components/footer-layout/footer-layout.element.ts @@ -1,5 +1,5 @@ import { css, html, LitElement, customElement } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; /** * @element umb-footer-layout diff --git a/src/packages/core/components/footer-layout/footer-layout.stories.ts b/src/packages/core/components/footer-layout/footer-layout.stories.ts index 6656d782f9..ccc0743767 100644 --- a/src/packages/core/components/footer-layout/footer-layout.stories.ts +++ b/src/packages/core/components/footer-layout/footer-layout.stories.ts @@ -10,10 +10,11 @@ export default { id: 'umb-footer-layout', } as Meta; -export const AAAOverview: Story = () => html` -
- Footer slotActions slot -
-`; +export const AAAOverview: Story = () => + html` +
+ Footer slotActions slot +
+ `; AAAOverview.storyName = 'Overview'; diff --git a/src/packages/core/components/header-app/header-app-button.element.ts b/src/packages/core/components/header-app/header-app-button.element.ts index de178fec21..4a1a9970ca 100644 --- a/src/packages/core/components/header-app/header-app-button.element.ts +++ b/src/packages/core/components/header-app/header-app-button.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, CSSResultGroup, html, LitElement, customElement, ifDefined } from '@umbraco-cms/backoffice/external/lit'; import { ManifestHeaderAppButtonKind, diff --git a/src/packages/core/components/history/history-item.element.ts b/src/packages/core/components/history/history-item.element.ts index 5ba795f064..851f6a5f50 100644 --- a/src/packages/core/components/history/history-item.element.ts +++ b/src/packages/core/components/history/history-item.element.ts @@ -1,5 +1,5 @@ import { css, html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @customElement('umb-history-item') diff --git a/src/packages/core/components/history/history-list.element.ts b/src/packages/core/components/history/history-list.element.ts index c08d39749c..a4e7d5392b 100644 --- a/src/packages/core/components/history/history-list.element.ts +++ b/src/packages/core/components/history/history-list.element.ts @@ -1,5 +1,5 @@ import { css, html, customElement } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @customElement('umb-history-list') diff --git a/src/packages/core/components/history/history-list.stories.ts b/src/packages/core/components/history/history-list.stories.ts index 60552615e5..0bced47aee 100644 --- a/src/packages/core/components/history/history-list.stories.ts +++ b/src/packages/core/components/history/history-list.stories.ts @@ -13,25 +13,25 @@ export default { id: 'umb-history-list', } as Meta; -export const AAAOverview: Story = () => html` - - Default slot - Action slot - - - Default slot - Action slot - - - Default slot - Action slot - -`; +export const AAAOverview: Story = () => + html` + + Default slot + Action slot + + + Default slot + Action slot + + + Default slot + Action slot + + `; AAAOverview.storyName = 'Overview'; -export const Node: Story = () => html` - Default slot - Action slot -`; +export const Node: Story = () => + html` + Default slot + Action slot + `; diff --git a/src/packages/core/components/index.ts b/src/packages/core/components/index.ts index afd973ce91..1fd80d6f7e 100644 --- a/src/packages/core/components/index.ts +++ b/src/packages/core/components/index.ts @@ -3,7 +3,6 @@ export * from './backoffice-modal-container/backoffice-modal-container.element.js'; export * from './backoffice-notification-container/backoffice-notification-container.element.js'; export * from './body-layout/body-layout.element.js'; -export * from './button-with-dropdown/button-with-dropdown.element.js'; // TODO: delete this and change usage to umb-dropdown export * from './code-block/index.js'; export * from './input-date/index.js'; export * from './input-dropdown/index.js'; diff --git a/src/packages/core/components/input-multi-url/input-multi-url.element.ts b/src/packages/core/components/input-multi-url/input-multi-url.element.ts index cccf149e2e..dd50ece4b2 100644 --- a/src/packages/core/components/input-multi-url/input-multi-url.element.ts +++ b/src/packages/core/components/input-multi-url/input-multi-url.element.ts @@ -112,12 +112,12 @@ export class UmbInputMultiUrlElement extends FormControlMixin(UmbLitElement) { this.addValidator( 'rangeUnderflow', () => this.minMessage, - () => !!this.min && this.urls.length < this.min + () => !!this.min && this.urls.length < this.min, ); this.addValidator( 'rangeOverflow', () => this.maxMessage, - () => !!this.max && this.urls.length > this.max + () => !!this.max && this.urls.length > this.max, ); this.myModalRegistration = new UmbModalRouteRegistrationController(this, UMB_LINK_PICKER_MODAL) diff --git a/src/packages/core/components/input-tiny-mce/input-tiny-mce.element.ts b/src/packages/core/components/input-tiny-mce/input-tiny-mce.element.ts index baa6f00a5e..d43c6320db 100644 --- a/src/packages/core/components/input-tiny-mce/input-tiny-mce.element.ts +++ b/src/packages/core/components/input-tiny-mce/input-tiny-mce.element.ts @@ -102,7 +102,11 @@ export class UmbInputTinyMceElement extends FormControlMixin(UmbLitElement) { const manifests = (await firstValueFrom(observable)) as ManifestTinyMcePlugin[]; for (const manifest of manifests) { - const plugin = manifest.js ? await loadManifestApi(manifest.js) : manifest.api ? await loadManifestApi(manifest.api) : undefined; + const plugin = manifest.js + ? await loadManifestApi(manifest.js) + : manifest.api + ? await loadManifestApi(manifest.api) + : undefined; if (plugin) { this.#plugins.push(plugin); } diff --git a/src/packages/core/components/popover-layout/popover-layout.element.ts b/src/packages/core/components/popover-layout/popover-layout.element.ts index 7b0994bbf4..e4aeea45b7 100644 --- a/src/packages/core/components/popover-layout/popover-layout.element.ts +++ b/src/packages/core/components/popover-layout/popover-layout.element.ts @@ -4,6 +4,13 @@ import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; // TODO: maybe move this to UI Library. // TODO: add overwrites for customization. + +/** + * Popover layout element. + * + * @element umb-popover-layout + * + */ @customElement('umb-popover-layout') export class UmbPopoverLayoutElement extends UmbLitElement { render() { @@ -19,7 +26,6 @@ export class UmbPopoverLayoutElement extends UmbLitElement { border: 1px solid var(--uui-color-border); border-radius: var(--uui-border-radius); box-shadow: var(--uui-shadow-depth-3); - padding: var(--uui-size-space-3); overflow: clip; } `, diff --git a/src/packages/core/components/table/table.element.ts b/src/packages/core/components/table/table.element.ts index bd05f533c8..70a3f182c4 100644 --- a/src/packages/core/components/table/table.element.ts +++ b/src/packages/core/components/table/table.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, @@ -189,12 +189,13 @@ export class UmbTableElement extends LitElement { return html` ${when( this.config.allowSelection, - () => html` - ` + () => + html` + `, )} `; } @@ -217,12 +218,13 @@ export class UmbTableElement extends LitElement { ${when(!this.config.hideIcon, () => html``)} ${when( this.config.allowSelection, - () => html` e.stopPropagation()} - @change=${(event: Event) => this._handleRowCheckboxChange(event, item)} - ?checked="${this._isSelected(item.id)}"> - ` + () => + html` e.stopPropagation()} + @change=${(event: Event) => this._handleRowCheckboxChange(event, item)} + ?checked="${this._isSelected(item.id)}"> + `, )} `; } diff --git a/src/packages/core/components/tooltip-menu/tooltip-menu.element.ts b/src/packages/core/components/tooltip-menu/tooltip-menu.element.ts index 93212d57fc..0568fe51d7 100644 --- a/src/packages/core/components/tooltip-menu/tooltip-menu.element.ts +++ b/src/packages/core/components/tooltip-menu/tooltip-menu.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, LitElement, nothing, repeat, customElement, property } from '@umbraco-cms/backoffice/external/lit'; export interface TooltipMenuItem { @@ -48,7 +48,7 @@ export class UmbTooltipMenuElement extends LitElement { return repeat( this.items, (item) => item.label, - (item) => this._renderItem(item) + (item) => this._renderItem(item), ); } diff --git a/src/packages/core/components/variant-selector/variant-selector.element.ts b/src/packages/core/components/variant-selector/variant-selector.element.ts index b626e9e899..55d9cf21b3 100644 --- a/src/packages/core/components/variant-selector/variant-selector.element.ts +++ b/src/packages/core/components/variant-selector/variant-selector.element.ts @@ -13,7 +13,6 @@ import { DocumentVariantResponseModel, ContentStateModel } from '@umbraco-cms/ba @customElement('umb-variant-selector') export class UmbVariantSelectorElement extends UmbLitElement { - @state() _variants: Array = []; @@ -21,7 +20,7 @@ export class UmbVariantSelectorElement extends UmbLitElement { @state() _activeVariants: Array = []; - @property({attribute: false}) + @property({ attribute: false }) public get _activeVariantsCultures(): string[] { return this._activeVariants.map((el) => el.culture ?? '') ?? []; } @@ -41,6 +40,9 @@ export class UmbVariantSelectorElement extends UmbLitElement { @state() private _variantTitleName?: string; + @state() + private _variantSelectorOpen = false; + // TODO: make adapt to backoffice locale. private _cultureNames = new Intl.DisplayNames('en', { type: 'language' }); @@ -70,7 +72,7 @@ export class UmbVariantSelectorElement extends UmbLitElement { this._variants = variants; } }, - '_observeVariants' + '_observeVariants', ); } } @@ -87,7 +89,7 @@ export class UmbVariantSelectorElement extends UmbLitElement { this._activeVariants = activeVariants; } }, - '_observeActiveVariants' + '_observeActiveVariants', ); } } @@ -105,7 +107,7 @@ export class UmbVariantSelectorElement extends UmbLitElement { (name) => { this._name = name; }, - '_name' + '_name', ); } @@ -123,31 +125,22 @@ export class UmbVariantSelectorElement extends UmbLitElement { if (event instanceof UUIInputEvent) { const target = event.composedPath()[0] as UUIInputElement; - if (typeof target?.value === 'string' && this.#variantContext && isNameablePropertySetContext(this.#variantContext)) { + if ( + typeof target?.value === 'string' && + this.#variantContext && + isNameablePropertySetContext(this.#variantContext) + ) { this.#variantContext.setName(target.value); } } } - private _toggleVariantSelector() { - this._variantSelectorIsOpen = !this._variantSelectorIsOpen; - } - - @state() - private _variantSelectorIsOpen = false; - - private _close() { - this._variantSelectorIsOpen = false; - } - private _switchVariant(variant: DocumentVariantResponseModel) { this.#splitViewContext?.switchVariant(UmbVariantId.Create(variant)); - this._close(); } private _openSplitView(variant: DocumentVariantResponseModel) { this.#splitViewContext?.openSplitView(UmbVariantId.Create(variant)); - this._close(); } private _closeSplitView() { @@ -162,6 +155,10 @@ export class UmbVariantSelectorElement extends UmbLitElement { return state !== ContentStateModel.PUBLISHED && !this._isVariantActive(culture!); } + #onPopoverToggle(event: any) { + this._variantSelectorOpen = event.newState === 'open'; + } + render() { return html` @@ -169,12 +166,12 @@ export class UmbVariantSelectorElement extends UmbLitElement { this._variants && this._variants.length > 0 ? html` ${this._variantDisplayName} - + ${this._activeVariants.length > 1 ? html` @@ -191,43 +188,41 @@ export class UmbVariantSelectorElement extends UmbLitElement { ${ this._variants && this._variants.length > 0 ? html` - -
+ +
    ${this._variants.map( - (variant) => - html` -
  • - - - ${this._isVariantActive(variant.culture!) - ? nothing - : html` - this._openSplitView(variant)}> - Split view - - `} -
    • - ` + (variant) => html` +
  • + + ${this._isVariantActive(variant.culture!) + ? nothing + : html` + this._openSplitView(variant)}> + Split view + + `} +
    • + `, )}
- + ` : nothing } @@ -246,10 +241,6 @@ export class UmbVariantSelectorElement extends UmbLitElement { white-space: nowrap; } - #variant-selector-popover { - display: block; - } - #variant-selector-dropdown { overflow: hidden; z-index: -1; @@ -307,7 +298,12 @@ export class UmbVariantSelectorElement extends UmbLitElement { font-size: 14px; cursor: pointer; border-bottom: 1px solid var(--uui-color-divider-standalone); - font-family: Lato, Helvetica Neue, Helvetica, Arial, sans-serif; + font-family: + Lato, + Helvetica Neue, + Helvetica, + Arial, + sans-serif; } .variant-selector-switch-button:hover { diff --git a/src/packages/core/components/variant-selector/variant-selector.stories.ts b/src/packages/core/components/variant-selector/variant-selector.stories.ts index 4827af62be..f8e18fe1e4 100644 --- a/src/packages/core/components/variant-selector/variant-selector.stories.ts +++ b/src/packages/core/components/variant-selector/variant-selector.stories.ts @@ -11,6 +11,5 @@ export default meta; type Story = StoryObj; export const Overview: Story = { - args: { - }, + args: {}, }; diff --git a/src/packages/core/data-type/entity-actions/create/modal/index.ts b/src/packages/core/data-type/entity-actions/create/modal/index.ts index c6565fb240..b87999813d 100644 --- a/src/packages/core/data-type/entity-actions/create/modal/index.ts +++ b/src/packages/core/data-type/entity-actions/create/modal/index.ts @@ -9,5 +9,5 @@ export const UMB_DATA_TYPE_CREATE_OPTIONS_MODAL = new UmbModalToken ${this._renderInstance(contextData.data)} - ` + `, ); }); @@ -132,16 +132,14 @@ export class UmbDebugElement extends UmbLitElement { return instanceTemplates.push(html`
  • Callable Function
    • `); } else if (instance.type === 'object') { if (instance.methods?.length) { - instanceTemplates.push( - html` -
  • - Methods -
      - ${instance.methods?.map((methodName) => html`
    • ${methodName}
      • `)} -
    -
    • - ` - ); + instanceTemplates.push(html` +
  • + Methods +
      + ${instance.methods?.map((methodName) => html`
    • ${methodName}
      • `)} +
    +
    • + `); } const props: TemplateResult[] = []; diff --git a/src/packages/core/entity-action/common/folder-update/folder-update.action.ts b/src/packages/core/entity-action/common/folder-update/folder-update.action.ts index 8382bed184..bc46d9230b 100644 --- a/src/packages/core/entity-action/common/folder-update/folder-update.action.ts +++ b/src/packages/core/entity-action/common/folder-update/folder-update.action.ts @@ -9,7 +9,7 @@ import { import { UmbFolderRepository } from '@umbraco-cms/backoffice/repository'; export class UmbFolderUpdateEntityAction< - T extends UmbFolderRepository = UmbFolderRepository + T extends UmbFolderRepository = UmbFolderRepository, > extends UmbEntityActionBase { #modalContext?: UmbModalManagerContext; diff --git a/src/packages/core/entity-action/common/sort-children-of/sort-children-of.action.ts b/src/packages/core/entity-action/common/sort-children-of/sort-children-of.action.ts index 8e7c170aca..5170df11cf 100644 --- a/src/packages/core/entity-action/common/sort-children-of/sort-children-of.action.ts +++ b/src/packages/core/entity-action/common/sort-children-of/sort-children-of.action.ts @@ -2,7 +2,7 @@ import { UmbEntityActionBase } from '../../entity-action.js'; import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api'; export class UmbSortChildrenOfEntityAction< - T extends { sortChildrenOf(): Promise } + T extends { sortChildrenOf(): Promise }, > extends UmbEntityActionBase { constructor(host: UmbControllerHostElement, repositoryAlias: string, unique: string) { super(host, repositoryAlias, unique); diff --git a/src/packages/core/entity-action/entity-action-list.element.ts b/src/packages/core/entity-action/entity-action-list.element.ts index 1e5f7753b4..ba1ba45f2d 100644 --- a/src/packages/core/entity-action/entity-action-list.element.ts +++ b/src/packages/core/entity-action/entity-action-list.element.ts @@ -1,4 +1,4 @@ -import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; +import { html, customElement, property, state, css } from '@umbraco-cms/backoffice/external/lit'; import { ManifestEntityAction } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @@ -34,6 +34,14 @@ export class UmbEntityActionListElement extends UmbLitElement { ` : ''; } + + static styles = [ + css` + :host { + --uui-menu-item-flat-structure: 1; + } + `, + ]; } declare global { diff --git a/src/packages/core/extension-registry/models/entity-bulk-action.model.ts b/src/packages/core/extension-registry/models/entity-bulk-action.model.ts index bc85f2ba34..0c3628b836 100644 --- a/src/packages/core/extension-registry/models/entity-bulk-action.model.ts +++ b/src/packages/core/extension-registry/models/entity-bulk-action.model.ts @@ -6,7 +6,9 @@ import type { ManifestElementAndApi, ManifestWithDynamicConditions } from '@umbr * An action to perform on multiple entities * For example for content you may wish to move one or more documents in bulk */ -export interface ManifestEntityBulkAction extends ManifestElementAndApi, ManifestWithDynamicConditions { +export interface ManifestEntityBulkAction + extends ManifestElementAndApi, + ManifestWithDynamicConditions { type: 'entityBulkAction'; meta: MetaEntityBulkAction; } diff --git a/src/packages/core/extension-registry/models/localization.model.ts b/src/packages/core/extension-registry/models/localization.model.ts index c51b4f7c7d..9f06f37020 100644 --- a/src/packages/core/extension-registry/models/localization.model.ts +++ b/src/packages/core/extension-registry/models/localization.model.ts @@ -1,7 +1,7 @@ import type { ManifestPlainJs } from '@umbraco-cms/backoffice/extension-api'; import type { UmbLocalizationDictionary } from '@umbraco-cms/backoffice/localization-api'; -export interface ManifestLocalization extends ManifestPlainJs<{default: UmbLocalizationDictionary}> { +export interface ManifestLocalization extends ManifestPlainJs<{ default: UmbLocalizationDictionary }> { type: 'localization'; meta: MetaLocalization; } diff --git a/src/packages/core/extension-registry/models/modal.model.ts b/src/packages/core/extension-registry/models/modal.model.ts index b3826268f0..4fd1190e96 100644 --- a/src/packages/core/extension-registry/models/modal.model.ts +++ b/src/packages/core/extension-registry/models/modal.model.ts @@ -1,6 +1,7 @@ import type { UmbModalExtensionElement } from '../interfaces/modal-extension-element.interface.js'; import type { ManifestElement } from '@umbraco-cms/backoffice/extension-api'; -export interface ManifestModal extends ManifestElement | UmbModalExtensionElement> { +export interface ManifestModal + extends ManifestElement | UmbModalExtensionElement> { type: 'modal'; } diff --git a/src/packages/core/extension-registry/models/property-action.model.ts b/src/packages/core/extension-registry/models/property-action.model.ts index 1f5b6c9327..aa0091ef19 100644 --- a/src/packages/core/extension-registry/models/property-action.model.ts +++ b/src/packages/core/extension-registry/models/property-action.model.ts @@ -1,7 +1,9 @@ import type { ConditionTypes } from '../conditions/types.js'; import type { ManifestElement, ManifestWithDynamicConditions } from '@umbraco-cms/backoffice/extension-api'; -export interface ManifestPropertyAction extends ManifestElement, ManifestWithDynamicConditions { +export interface ManifestPropertyAction + extends ManifestElement, + ManifestWithDynamicConditions { type: 'propertyAction'; meta: MetaPropertyAction; } diff --git a/src/packages/core/extension-registry/models/repository.model.ts b/src/packages/core/extension-registry/models/repository.model.ts index 33a5c5b32e..3a169b1d9a 100644 --- a/src/packages/core/extension-registry/models/repository.model.ts +++ b/src/packages/core/extension-registry/models/repository.model.ts @@ -1,6 +1,8 @@ import type { ConditionTypes } from '../conditions/types.js'; import type { UmbApi, ManifestApi, ManifestWithDynamicConditions } from '@umbraco-cms/backoffice/extension-api'; // TODO: Consider adding a ClassType for this manifest. (Currently we cannot know the scope of a repository, therefor we are going with ExtensionApi for now.) -export interface ManifestRepository extends ManifestApi, ManifestWithDynamicConditions { +export interface ManifestRepository + extends ManifestApi, + ManifestWithDynamicConditions { type: 'repository'; } diff --git a/src/packages/core/extension-registry/models/workspace-action.model.ts b/src/packages/core/extension-registry/models/workspace-action.model.ts index ec092c13ee..331e258137 100644 --- a/src/packages/core/extension-registry/models/workspace-action.model.ts +++ b/src/packages/core/extension-registry/models/workspace-action.model.ts @@ -1,12 +1,11 @@ import type { ConditionTypes } from '../conditions/types.js'; import type { InterfaceColor, InterfaceLook } from '@umbraco-cms/backoffice/external/uui'; -import type { - ManifestElementAndApi, - ManifestWithDynamicConditions, -} from '@umbraco-cms/backoffice/extension-api'; +import type { ManifestElementAndApi, ManifestWithDynamicConditions } from '@umbraco-cms/backoffice/extension-api'; import type { UmbWorkspaceAction } from '@umbraco-cms/backoffice/workspace'; -export interface ManifestWorkspaceAction extends ManifestElementAndApi, ManifestWithDynamicConditions { +export interface ManifestWorkspaceAction + extends ManifestElementAndApi, + ManifestWithDynamicConditions { type: 'workspaceAction'; meta: MetaWorkspaceAction; } diff --git a/src/packages/core/localization/localize-date.element.ts b/src/packages/core/localization/localize-date.element.ts index fba0090dc0..ad2229e63e 100644 --- a/src/packages/core/localization/localize-date.element.ts +++ b/src/packages/core/localization/localize-date.element.ts @@ -16,23 +16,21 @@ export class UmbLocalizeDateElement extends UmbLitElement { @property() date!: string | Date; - /** + /** * Formatting options * @attr * @example options={ dateStyle: 'full', timeStyle: 'long', timeZone: 'Australia/Sydney' } */ - @property() + @property() options?: Intl.DateTimeFormatOptions; - + @state() protected get text(): string { - return this.localize.date(this.date, this.options); + return this.localize.date(this.date, this.options); } protected render() { - return this.date - ? html`${unsafeHTML(this.text)}` - : html`` + return this.date ? html`${unsafeHTML(this.text)}` : html``; } static styles = [ diff --git a/src/packages/core/localization/localize-number.element.ts b/src/packages/core/localization/localize-number.element.ts index 91a5169508..872ae674a3 100644 --- a/src/packages/core/localization/localize-number.element.ts +++ b/src/packages/core/localization/localize-number.element.ts @@ -16,23 +16,21 @@ export class UmbLocalizeNumberElement extends UmbLitElement { @property() number!: number | string; - /** + /** * Formatting options * @attr * @example options={ style: 'currency', currency: 'EUR' } */ - @property() + @property() options?: Intl.NumberFormatOptions; - + @state() protected get text(): string { - return this.localize.number(this.number, this.options); + return this.localize.number(this.number, this.options); } protected render() { - return this.number - ? html`${unsafeHTML(this.text)}` - : html`` + return this.number ? html`${unsafeHTML(this.text)}` : html``; } static styles = [ diff --git a/src/packages/core/localization/localize-relative-time.element.ts b/src/packages/core/localization/localize-relative-time.element.ts index 84e042e9fb..4b47c0b731 100644 --- a/src/packages/core/localization/localize-relative-time.element.ts +++ b/src/packages/core/localization/localize-relative-time.element.ts @@ -16,15 +16,15 @@ export class UmbLocalizeRelativeTimeElement extends UmbLitElement { @property() time!: number; - /** + /** * Formatting options * @attr * @example options={ dateStyle: 'full', timeStyle: 'long', timeZone: 'Australia/Sydney' } */ - @property() + @property() options?: Intl.RelativeTimeFormatOptions; - - /** + + /** * Unit * @attr * @example unit='seconds' @@ -34,13 +34,11 @@ export class UmbLocalizeRelativeTimeElement extends UmbLitElement { @state() protected get text(): string { - return this.localize.relativeTime(this.time, this.unit, this.options); + return this.localize.relativeTime(this.time, this.unit, this.options); } protected render() { - return this.time - ? html`${unsafeHTML(this.text)}` - : html`` + return this.time ? html`${unsafeHTML(this.text)}` : html``; } static styles = [ diff --git a/src/packages/core/localization/localize.element.ts b/src/packages/core/localization/localize.element.ts index 8b30164757..0c93994195 100644 --- a/src/packages/core/localization/localize.element.ts +++ b/src/packages/core/localization/localize.element.ts @@ -9,7 +9,7 @@ import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @customElement('umb-localize') export class UmbLocalizeElement extends UmbLitElement { /** - * The key to localize. The key is case sensitive. + * The key to localize. The key is case sensitive. * @attr * @example key="general_ok" */ @@ -33,7 +33,7 @@ export class UmbLocalizeElement extends UmbLitElement { */ @property() debug = false; - + @state() protected get text(): string { const localizedValue = this.localize.term(this.key, ...(this.args ?? [])); @@ -53,8 +53,8 @@ export class UmbLocalizeElement extends UmbLitElement { return this.text.trim() ? html`${unsafeHTML(this.text)}` : this.debug - ? html`${this.key}` - : html``; + ? html`${this.key}` + : html``; } static styles = [ diff --git a/src/packages/core/localization/registry/localization.registry.ts b/src/packages/core/localization/registry/localization.registry.ts index 7b2ece24f5..b9ffb20347 100644 --- a/src/packages/core/localization/registry/localization.registry.ts +++ b/src/packages/core/localization/registry/localization.registry.ts @@ -64,7 +64,7 @@ export class UmbLocalizationRegistry { } // If extension contains a js file, load it and add the default dictionary to the inner dictionary. - if(extension.js) { + if (extension.js) { const loadedExtension = await loadManifestPlainJs(extension.js); if (loadedExtension && hasDefaultExport(loadedExtension)) { diff --git a/src/packages/core/modal/common/confirm/confirm-modal.element.ts b/src/packages/core/modal/common/confirm/confirm-modal.element.ts index 2a04dbe3e9..3b18675b03 100644 --- a/src/packages/core/modal/common/confirm/confirm-modal.element.ts +++ b/src/packages/core/modal/common/confirm/confirm-modal.element.ts @@ -5,7 +5,6 @@ import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @customElement('umb-confirm-modal') export class UmbConfirmModalElement extends UmbLitElement { - @property({ attribute: false }) modalContext?: UmbModalContext; diff --git a/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts b/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts index 8050305abc..575fe4fa4d 100644 --- a/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts +++ b/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts @@ -10,8 +10,6 @@ import { UmbIconPickerModalData, UmbIconPickerModalValue, UmbModalBaseElement } // TODO: to prevent element extension we need to move the Picker logic into a separate class we can reuse across all pickers @customElement('umb-icon-picker-modal') export class UmbIconPickerModalElement extends UmbModalBaseElement { - - private _iconList = icons.filter((icon) => !icon.legacy); @state() @@ -19,26 +17,26 @@ export class UmbIconPickerModalElement extends UmbModalBaseElement { - this._modalValue = newValue; - this._currentColorVarName = this._colorList.find(x => x.alias === newValue?.color)?.alias ?? this._colorList[0].varName; - }, '_observeModalContextValue'); + if (this.modalContext) { + this.observe( + this.modalContext?.value, + (newValue) => { + this._modalValue = newValue; + this._currentColorVarName = + this._colorList.find((x) => x.alias === newValue?.color)?.alias ?? this._colorList[0].varName; + }, + '_observeModalContextValue', + ); } } @@ -88,10 +91,15 @@ export class UmbIconPickerModalElement extends UmbModalBaseElement html` - - `, - )} + (color) => html` + + `, + ) + }
    ${this.renderIconSelection()} @@ -116,7 +124,8 @@ export class UmbIconPickerModalElement extends UmbModalBaseElement icon.name, (icon) => html` - ` + `, ); } diff --git a/src/packages/core/modal/common/icon-picker/icon-picker-modal.stories.ts b/src/packages/core/modal/common/icon-picker/icon-picker-modal.stories.ts index d6f6fb08a8..d071a19fa8 100644 --- a/src/packages/core/modal/common/icon-picker/icon-picker-modal.stories.ts +++ b/src/packages/core/modal/common/icon-picker/icon-picker-modal.stories.ts @@ -13,8 +13,7 @@ export default { id: 'umb-icon-picker-modal', } as Meta; -const data: UmbIconPickerModalData = { -}; +const data: UmbIconPickerModalData = {}; const value: UmbIconPickerModalValue = { color: undefined, diff --git a/src/packages/core/modal/common/section-picker/section-picker-modal.element.ts b/src/packages/core/modal/common/section-picker/section-picker-modal.element.ts index ef6d783f06..e38d25eb99 100644 --- a/src/packages/core/modal/common/section-picker/section-picker-modal.element.ts +++ b/src/packages/core/modal/common/section-picker/section-picker-modal.element.ts @@ -38,7 +38,8 @@ export class UmbSectionPickerModalElement extends UmbModalBaseElement< this.observe( umbExtensionsRegistry.extensionsOfType('section'), (sections: Array) => (this._sections = sections), - ), 'umbSectionsObserver'; + ), + 'umbSectionsObserver'; } render() { diff --git a/src/packages/core/modal/modal.element.ts b/src/packages/core/modal/modal.element.ts index 5af2670e08..a66bb6a7e5 100644 --- a/src/packages/core/modal/modal.element.ts +++ b/src/packages/core/modal/modal.element.ts @@ -104,7 +104,7 @@ export class UmbModalElement extends UmbLitElement { async #createInnerElement(manifest: ManifestModal) { // TODO: add inner fallback element if no extension element is found - const innerElement = (await createExtensionElement(manifest)); + const innerElement = await createExtensionElement(manifest); if (innerElement) { innerElement.data = this.#modalContext!.data; diff --git a/src/packages/core/modal/token/icon-picker-modal.token.ts b/src/packages/core/modal/token/icon-picker-modal.token.ts index 3b616b783e..40144b4c00 100644 --- a/src/packages/core/modal/token/icon-picker-modal.token.ts +++ b/src/packages/core/modal/token/icon-picker-modal.token.ts @@ -1,7 +1,6 @@ import { UmbModalToken } from '@umbraco-cms/backoffice/modal'; -export interface UmbIconPickerModalData { -} +export interface UmbIconPickerModalData {} export interface UmbIconPickerModalValue { color: string | undefined; diff --git a/src/packages/core/notification/layouts/default/notification-layout-default.element.ts b/src/packages/core/notification/layouts/default/notification-layout-default.element.ts index 2b31d747ad..f922ff5194 100644 --- a/src/packages/core/notification/layouts/default/notification-layout-default.element.ts +++ b/src/packages/core/notification/layouts/default/notification-layout-default.element.ts @@ -1,5 +1,5 @@ import { html, LitElement, customElement, property, ifDefined } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import type { UmbNotificationDefaultData, UmbNotificationHandler } from '@umbraco-cms/backoffice/notification'; export type { UmbNotificationDefaultData }; diff --git a/src/packages/core/notification/layouts/default/notification-layout-default.test.ts b/src/packages/core/notification/layouts/default/notification-layout-default.test.ts index 406d46cad4..980010eb9b 100644 --- a/src/packages/core/notification/layouts/default/notification-layout-default.test.ts +++ b/src/packages/core/notification/layouts/default/notification-layout-default.test.ts @@ -23,7 +23,7 @@ describe('UmbNotificationLayoutDefault', () => { element = await fixture( html`` + .data=${options.data}>`, ); }); diff --git a/src/packages/core/property-action/common/copy/property-action-copy.element.ts b/src/packages/core/property-action/common/copy/property-action-copy.element.ts index a253d588ca..17bb0b1057 100644 --- a/src/packages/core/property-action/common/copy/property-action-copy.element.ts +++ b/src/packages/core/property-action/common/copy/property-action-copy.element.ts @@ -19,8 +19,8 @@ export class UmbPropertyActionCopyElement extends UmbLitElement implements UmbPr super(); //this.consumeContext(UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN, (property) => { - //console.log('Got a reference to the editor element', property.getEditor()); - // Be aware that the element might switch, so using the direct reference is not recommended, instead observe the .element Observable() + //console.log('Got a reference to the editor element', property.getEditor()); + // Be aware that the element might switch, so using the direct reference is not recommended, instead observe the .element Observable() //}); this.consumeContext(UMB_NOTIFICATION_CONTEXT_TOKEN, (instance) => { diff --git a/src/packages/core/property-action/shared/property-action-menu/index.ts b/src/packages/core/property-action/shared/property-action-menu/index.ts index ef20a285be..145279825e 100644 --- a/src/packages/core/property-action/shared/property-action-menu/index.ts +++ b/src/packages/core/property-action/shared/property-action-menu/index.ts @@ -1,2 +1 @@ -export * from './property-action-menu.context.js' -export * from './property-action-menu.element.js' \ No newline at end of file +export * from './property-action-menu.element.js'; diff --git a/src/packages/core/property-action/shared/property-action-menu/property-action-menu.context.ts b/src/packages/core/property-action/shared/property-action-menu/property-action-menu.context.ts deleted file mode 100644 index d6b4ee573e..0000000000 --- a/src/packages/core/property-action/shared/property-action-menu/property-action-menu.context.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { type UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api'; -import { UmbBaseController } from '@umbraco-cms/backoffice/class-api'; -import { UmbBooleanState } from '@umbraco-cms/backoffice/observable-api'; - -export class UmbPropertyActionMenuContext extends UmbBaseController { - #isOpen = new UmbBooleanState(false); - public readonly isOpen = this.#isOpen.asObservable(); - - constructor(host: UmbControllerHostElement) { - super(host); - this.provideContext('umbPropertyActionMenu', this); - } - - toggle() { - this.#isOpen.next(!this.#isOpen.getValue()); - } - open() { - this.#isOpen.next(true); - } - close() { - this.#isOpen.next(false); - } -} diff --git a/src/packages/core/property-action/shared/property-action-menu/property-action-menu.element.ts b/src/packages/core/property-action/shared/property-action-menu/property-action-menu.element.ts index 940d0b8b32..7b7c108bf6 100644 --- a/src/packages/core/property-action/shared/property-action-menu/property-action-menu.element.ts +++ b/src/packages/core/property-action/shared/property-action-menu/property-action-menu.element.ts @@ -1,23 +1,33 @@ -import { UmbPropertyActionMenuContext } from './property-action-menu.context.js'; -import { css, CSSResultGroup, html, customElement, property, state, repeat } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; -import { ManifestPropertyAction, ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry'; +import { + css, + CSSResultGroup, + html, + customElement, + property, + state, + repeat, + nothing, +} from '@umbraco-cms/backoffice/external/lit'; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; +import { + ManifestPropertyAction, + ManifestTypes, + umbExtensionsRegistry, +} from '@umbraco-cms/backoffice/extension-registry'; import { UmbExtensionElementInitializer, UmbExtensionsElementInitializer } from '@umbraco-cms/backoffice/extension-api'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @customElement('umb-property-action-menu') export class UmbPropertyActionMenuElement extends UmbLitElement { - #actionsInitializer?: UmbExtensionsElementInitializer; - @property({ attribute: false }) public get value(): unknown { return this._value; } public set value(value: unknown) { this._value = value; - if(this.#actionsInitializer) { + if (this.#actionsInitializer) { this.#actionsInitializer.properties = { value }; } } @@ -25,73 +35,47 @@ export class UmbPropertyActionMenuElement extends UmbLitElement { @property() set propertyEditorUiAlias(alias: string) { - + // TODO: Stop using string for 'propertyAction', we need to start using Const. // TODO: Align property actions with entity actions. - this.#actionsInitializer = new UmbExtensionsElementInitializer(this, umbExtensionsRegistry, 'propertyAction', (propertyAction) => propertyAction.meta.propertyEditors.includes(alias), (ctrls) => { - this._actions = ctrls; - }); + this.#actionsInitializer = new UmbExtensionsElementInitializer( + this, + umbExtensionsRegistry, + 'propertyAction', + (propertyAction) => propertyAction.meta.propertyEditors.includes(alias), + (ctrls) => { + this._actions = ctrls; + }, + ); } @state() private _actions: Array> = []; - @state() - private _open = false; - - private _propertyActionMenuContext = new UmbPropertyActionMenuContext(this); - - constructor() { - super(); - - this.observe(this._propertyActionMenuContext.isOpen, (isOpen) => { - this._open = isOpen; - }); - - this.addEventListener('close', (e) => { - this._propertyActionMenuContext.close(); - e.stopPropagation(); - }); - } - - private _toggleMenu() { - this._propertyActionMenuContext.toggle(); - } - - private _handleClose(event: CustomEvent) { - this._propertyActionMenuContext.close(); - event.stopPropagation(); - } - render() { return this._actions.length > 0 ? html` - - - - - - - + + + + + + + + ` - : ''; + : nothing; } static styles: CSSResultGroup = [ UmbTextStyles, css` - #popover { - width: auto; + :host { + --uui-menu-item-flat-structure: 1; } - #more-symbol { font-size: 0.6em; } @@ -102,17 +86,6 @@ export class UmbPropertyActionMenuElement extends UmbLitElement { --uui-button-height: 18px; --uui-button-border-radius: 6px; } - - #dropdown { - background-color: var(--uui-color-surface); - border-radius: var(--uui-border-radius); - width: 100%; - height: 100%; - box-sizing: border-box; - box-shadow: var(--uui-shadow-depth-3); - min-width: 200px; - color: var(--uui-color-text); - } `, ]; } diff --git a/src/packages/core/property-action/shared/property-action/index.ts b/src/packages/core/property-action/shared/property-action/index.ts index ec46a53aaa..122785127c 100644 --- a/src/packages/core/property-action/shared/property-action/index.ts +++ b/src/packages/core/property-action/shared/property-action/index.ts @@ -1 +1 @@ -export * from './property-action.interface.js'; \ No newline at end of file +export * from './property-action.interface.js'; diff --git a/src/packages/core/property-editor/config/index.ts b/src/packages/core/property-editor/config/index.ts index a6654797d0..9c63d1cf9c 100644 --- a/src/packages/core/property-editor/config/index.ts +++ b/src/packages/core/property-editor/config/index.ts @@ -1,2 +1,2 @@ -export * from './property-editor-config.type.js' -export * from './property-editor-config-collection.class.js' +export * from './property-editor-config.type.js'; +export * from './property-editor-config-collection.class.js'; diff --git a/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.element.ts b/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.element.ts index 3d23986281..6f652c38b3 100644 --- a/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.element.ts +++ b/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.element.ts @@ -1,14 +1,17 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-block-grid-block-configuration */ @customElement('umb-property-editor-ui-block-grid-block-configuration') -export class UmbPropertyEditorUIBlockGridBlockConfigurationElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUIBlockGridBlockConfigurationElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; diff --git a/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.test.ts b/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.test.ts index 9416838460..99a8589c9f 100644 --- a/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.test.ts +++ b/src/packages/core/property-editor/uis/block-grid/config/block-configuration/property-editor-ui-block-grid-block-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUIBlockGridBlockConfigurationElement', () => { let element: UmbPropertyEditorUIBlockGridBlockConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.element.ts b/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.element.ts index 3be87591bb..da03743d67 100644 --- a/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.element.ts +++ b/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.element.ts @@ -1,19 +1,22 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-block-grid-group-configuration */ @customElement('umb-property-editor-ui-block-grid-group-configuration') -export class UmbPropertyEditorUIBlockGridGroupConfigurationElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUIBlockGridGroupConfigurationElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; @property({ type: Object, attribute: false }) - public config?: UmbPropertyEditorConfigCollection + public config?: UmbPropertyEditorConfigCollection; render() { return html`
    umb-property-editor-ui-block-grid-group-configuration
    `; diff --git a/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.test.ts b/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.test.ts index de0ffc6d61..9f32c3112f 100644 --- a/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.test.ts +++ b/src/packages/core/property-editor/uis/block-grid/config/group-configuration/property-editor-ui-block-grid-group-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUIBlockGridGroupConfigurationElement', () => { let element: UmbPropertyEditorUIBlockGridGroupConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.element.ts b/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.element.ts index c4984ccafc..f0bb6966a8 100644 --- a/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.element.ts +++ b/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.element.ts @@ -1,14 +1,17 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-block-grid-stylesheet-picker */ @customElement('umb-property-editor-ui-block-grid-stylesheet-picker') -export class UmbPropertyEditorUIBlockGridStylesheetPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUIBlockGridStylesheetPickerElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; diff --git a/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.test.ts b/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.test.ts index 38d83b7886..df5d7fcb40 100644 --- a/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.test.ts +++ b/src/packages/core/property-editor/uis/block-grid/config/stylesheet-picker/property-editor-ui-block-grid-stylesheet-picker.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUIBlockGridStylesheetPickerElement', () => { let element: UmbPropertyEditorUIBlockGridStylesheetPickerElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid-inner-test.element.ts b/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid-inner-test.element.ts index 63da2df720..91b3cb1c3a 100644 --- a/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid-inner-test.element.ts +++ b/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid-inner-test.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbRouterSlotChangeEvent, UmbRouterSlotInitEvent, UmbRoute } from '@umbraco-cms/backoffice/router'; diff --git a/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid.element.ts b/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid.element.ts index fbb615d31a..5301be738f 100644 --- a/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid.element.ts +++ b/src/packages/core/property-editor/uis/block-grid/property-editor-ui-block-grid.element.ts @@ -1,6 +1,6 @@ import { UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN } from '../../../workspace/workspace-property/workspace-property.context.js'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbVariantId } from '@umbraco-cms/backoffice/variant'; import type { UmbRoute, UmbRouterSlotChangeEvent, UmbRouterSlotInitEvent } from '@umbraco-cms/backoffice/router'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; @@ -12,7 +12,6 @@ import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/ */ @customElement('umb-property-editor-ui-block-grid') export class UmbPropertyEditorUIBlockGridElement extends UmbLitElement implements UmbPropertyEditorUiElement { - @property() value = ''; diff --git a/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.element.ts b/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.element.ts index 36b7c0b63f..5e8712144e 100644 --- a/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.element.ts +++ b/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.element.ts @@ -1,14 +1,17 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-block-list-block-configuration */ @customElement('umb-property-editor-ui-block-list-block-configuration') -export class UmbPropertyEditorUIBlockListBlockConfigurationElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUIBlockListBlockConfigurationElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; diff --git a/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.test.ts b/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.test.ts index efd652ff62..4d53ce093e 100644 --- a/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.test.ts +++ b/src/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUIBlockListBlockConfigurationElement', () => { let element: UmbPropertyEditorUIBlockListBlockConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/block-list/property-editor-ui-block-list.element.ts b/src/packages/core/property-editor/uis/block-list/property-editor-ui-block-list.element.ts index ace21ab222..e8714e0734 100644 --- a/src/packages/core/property-editor/uis/block-list/property-editor-ui-block-list.element.ts +++ b/src/packages/core/property-editor/uis/block-list/property-editor-ui-block-list.element.ts @@ -1,6 +1,6 @@ import type { UmbPropertyEditorConfigCollection } from '../../config/index.js'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/core/property-editor/uis/checkbox-list/property-editor-ui-checkbox-list.element.ts b/src/packages/core/property-editor/uis/checkbox-list/property-editor-ui-checkbox-list.element.ts index 1baffac26d..ee4a3b8e99 100644 --- a/src/packages/core/property-editor/uis/checkbox-list/property-editor-ui-checkbox-list.element.ts +++ b/src/packages/core/property-editor/uis/checkbox-list/property-editor-ui-checkbox-list.element.ts @@ -1,6 +1,6 @@ import { UmbInputCheckboxListElement } from '../../../components/input-checkbox-list/input-checkbox-list.element.js'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.element.ts b/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.element.ts index 4377385649..648d6bb8b5 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.element.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.element.ts @@ -1,14 +1,17 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-collection-view-bulk-action-permissions */ @customElement('umb-property-editor-ui-collection-view-bulk-action-permissions') -export class UmbPropertyEditorUICollectionViewBulkActionPermissionsElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUICollectionViewBulkActionPermissionsElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; diff --git a/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.test.ts b/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.test.ts index 0b0dccec0d..d46384afee 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.test.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/bulk-action-permissions/property-editor-ui-collection-view-bulk-action-permissions.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUICollectionViewBulkActionPermissionsElement', () => let element: UmbPropertyEditorUICollectionViewBulkActionPermissionsElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.element.ts b/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.element.ts index 951d1956ca..fa75c639de 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.element.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.element.ts @@ -1,14 +1,17 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-collection-view-column-configuration */ @customElement('umb-property-editor-ui-collection-view-column-configuration') -export class UmbPropertyEditorUICollectionViewColumnConfigurationElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUICollectionViewColumnConfigurationElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; diff --git a/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.test.ts b/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.test.ts index e1c71e27cd..71288c6933 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.test.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/column-configuration/property-editor-ui-collection-view-column-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUICollectionViewColumnConfigurationElement', () => { let element: UmbPropertyEditorUICollectionViewColumnConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.element.ts b/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.element.ts index b0cb58095f..ab4720895c 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.element.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.element.ts @@ -1,14 +1,17 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-collection-view-layout-configuration */ @customElement('umb-property-editor-ui-collection-view-layout-configuration') -export class UmbPropertyEditorUICollectionViewLayoutConfigurationElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUICollectionViewLayoutConfigurationElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; diff --git a/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.test.ts b/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.test.ts index 3e305054c8..5f8af52f82 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.test.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/layout-configuration/property-editor-ui-collection-view-layout-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUICollectionViewLayoutConfigurationElement', () => { let element: UmbPropertyEditorUICollectionViewLayoutConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.element.ts b/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.element.ts index 507c8ab67b..3bbe2b6fd4 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.element.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.element.ts @@ -1,14 +1,17 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** * @element umb-property-editor-ui-collection-view-order-by */ @customElement('umb-property-editor-ui-collection-view-order-by') -export class UmbPropertyEditorUICollectionViewOrderByElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUICollectionViewOrderByElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property() value = ''; diff --git a/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.test.ts b/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.test.ts index e76f78fa58..07094aafa8 100644 --- a/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.test.ts +++ b/src/packages/core/property-editor/uis/collection-view/config/order-by/property-editor-ui-collection-view-order-by.test.ts @@ -6,9 +6,9 @@ describe('UmbPropertyEditorUICollectionViewOrderByElement', () => { let element: UmbPropertyEditorUICollectionViewOrderByElement; beforeEach(async () => { - element = await fixture( - html` ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/collection-view/property-editor-ui-collection-view.element.ts b/src/packages/core/property-editor/uis/collection-view/property-editor-ui-collection-view.element.ts index fc478d0d94..87918f1247 100644 --- a/src/packages/core/property-editor/uis/collection-view/property-editor-ui-collection-view.element.ts +++ b/src/packages/core/property-editor/uis/collection-view/property-editor-ui-collection-view.element.ts @@ -1,7 +1,7 @@ import { UmbPropertyEditorConfigCollection } from '../../config/index.js'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** diff --git a/src/packages/core/property-editor/uis/date-picker/property-editor-ui-date-picker.element.ts b/src/packages/core/property-editor/uis/date-picker/property-editor-ui-date-picker.element.ts index d3ce3705d8..68966179ff 100644 --- a/src/packages/core/property-editor/uis/date-picker/property-editor-ui-date-picker.element.ts +++ b/src/packages/core/property-editor/uis/date-picker/property-editor-ui-date-picker.element.ts @@ -1,6 +1,6 @@ import { UmbPropertyEditorConfigCollection, UmbPropertyValueChangeEvent } from '../../index.js'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbInputDateElement } from '@umbraco-cms/backoffice/components'; diff --git a/src/packages/core/property-editor/uis/icon-picker/property-editor-ui-icon-picker.element.ts b/src/packages/core/property-editor/uis/icon-picker/property-editor-ui-icon-picker.element.ts index 9baa29efee..647b967f86 100644 --- a/src/packages/core/property-editor/uis/icon-picker/property-editor-ui-icon-picker.element.ts +++ b/src/packages/core/property-editor/uis/icon-picker/property-editor-ui-icon-picker.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbModalManagerContext, diff --git a/src/packages/core/property-editor/uis/label/property-editor-ui-label.element.ts b/src/packages/core/property-editor/uis/label/property-editor-ui-label.element.ts index 228c45568e..931a3a3559 100644 --- a/src/packages/core/property-editor/uis/label/property-editor-ui-label.element.ts +++ b/src/packages/core/property-editor/uis/label/property-editor-ui-label.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.element.ts b/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.element.ts index 0cc187d137..39d8e40a10 100644 --- a/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.element.ts +++ b/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; @@ -8,10 +8,7 @@ import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/prope * @element umb-property-editor-ui-member-group-picker */ @customElement('umb-property-editor-ui-member-group-picker') -export class UmbPropertyEditorUIMemberGroupPickerElement - extends UmbLitElement - implements UmbPropertyEditorUiElement -{ +export class UmbPropertyEditorUIMemberGroupPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { @property() value = ''; diff --git a/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.test.ts b/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.test.ts index 3d3231e586..3f697d6202 100644 --- a/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.test.ts +++ b/src/packages/core/property-editor/uis/member-group-picker/property-editor-ui-member-group-picker.test.ts @@ -6,9 +6,9 @@ describe('UmbPropertyEditorUIMemberGroupPickerElement', () => { let element: UmbPropertyEditorUIMemberGroupPickerElement; beforeEach(async () => { - element = await fixture( - html` ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/member-picker/property-editor-ui-member-picker.element.ts b/src/packages/core/property-editor/uis/member-picker/property-editor-ui-member-picker.element.ts index 849d5e5b30..062e052117 100644 --- a/src/packages/core/property-editor/uis/member-picker/property-editor-ui-member-picker.element.ts +++ b/src/packages/core/property-editor/uis/member-picker/property-editor-ui-member-picker.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.element.ts b/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.element.ts index b7e53f73de..0419084673 100644 --- a/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.element.ts +++ b/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import type { UUIModalSidebarSize } from '@umbraco-cms/backoffice/external/uui'; import { UmbInputMultiUrlElement } from '@umbraco-cms/backoffice/components'; import { UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/workspace'; @@ -12,10 +12,7 @@ import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/ * @element umb-property-editor-ui-multi-url-picker */ @customElement('umb-property-editor-ui-multi-url-picker') -export class UmbPropertyEditorUIMultiUrlPickerElement - extends UmbLitElement - implements UmbPropertyEditorUiElement -{ +export class UmbPropertyEditorUIMultiUrlPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { @property({ type: Array }) value: UmbLinkPickerLink[] = []; diff --git a/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.test.ts b/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.test.ts index 0e504fb9fa..6476463b0a 100644 --- a/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.test.ts +++ b/src/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.test.ts @@ -6,9 +6,9 @@ describe('UmbPropertyEditorUIMultiUrlPickerElement', () => { let element: UmbPropertyEditorUIMultiUrlPickerElement; beforeEach(async () => { - element = await fixture( - html` ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/multiple-text-string/property-editor-ui-multiple-text-string.test.ts b/src/packages/core/property-editor/uis/multiple-text-string/property-editor-ui-multiple-text-string.test.ts index d0cd5b339f..3fd0d943d8 100644 --- a/src/packages/core/property-editor/uis/multiple-text-string/property-editor-ui-multiple-text-string.test.ts +++ b/src/packages/core/property-editor/uis/multiple-text-string/property-editor-ui-multiple-text-string.test.ts @@ -6,9 +6,9 @@ describe('UmbPropertyEditorUIMultipleTextStringElement', () => { let element: UmbPropertyEditorUIMultipleTextStringElement; beforeEach(async () => { - element = await fixture( - html` ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/number-range/property-editor-ui-number-range.element.ts b/src/packages/core/property-editor/uis/number-range/property-editor-ui-number-range.element.ts index b21681cd07..b28a3d13f6 100644 --- a/src/packages/core/property-editor/uis/number-range/property-editor-ui-number-range.element.ts +++ b/src/packages/core/property-editor/uis/number-range/property-editor-ui-number-range.element.ts @@ -1,6 +1,6 @@ import type { UmbInputNumberRangeElement } from '../../../components/input-number-range/input-number-range.element.js'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/number/property-editor-ui-number.element.ts b/src/packages/core/property-editor/uis/number/property-editor-ui-number.element.ts index 011d9bab85..b7c369276c 100644 --- a/src/packages/core/property-editor/uis/number/property-editor-ui-number.element.ts +++ b/src/packages/core/property-editor/uis/number/property-editor-ui-number.element.ts @@ -1,5 +1,5 @@ import { css, html, customElement, property, state, ifDefined } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/order-direction/property-editor-ui-order-direction.element.ts b/src/packages/core/property-editor/uis/order-direction/property-editor-ui-order-direction.element.ts index 65e6cf3c5e..911868952d 100644 --- a/src/packages/core/property-editor/uis/order-direction/property-editor-ui-order-direction.element.ts +++ b/src/packages/core/property-editor/uis/order-direction/property-editor-ui-order-direction.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; @@ -8,10 +8,7 @@ import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/prope * @element umb-property-editor-ui-order-direction */ @customElement('umb-property-editor-ui-order-direction') -export class UmbPropertyEditorUIOrderDirectionElement - extends UmbLitElement - implements UmbPropertyEditorUiElement -{ +export class UmbPropertyEditorUIOrderDirectionElement extends UmbLitElement implements UmbPropertyEditorUiElement { @property() value = ''; diff --git a/src/packages/core/property-editor/uis/overlay-size/property-editor-ui-overlay-size.element.ts b/src/packages/core/property-editor/uis/overlay-size/property-editor-ui-overlay-size.element.ts index 90d17c6d08..f726414e7c 100644 --- a/src/packages/core/property-editor/uis/overlay-size/property-editor-ui-overlay-size.element.ts +++ b/src/packages/core/property-editor/uis/overlay-size/property-editor-ui-overlay-size.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.element.ts b/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.element.ts index d279a3b29c..aafbbe3b6d 100644 --- a/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.element.ts +++ b/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import '../../../components/input-radio-button-list/input-radio-button-list.element.js'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; import type { UmbInputRadioButtonListElement } from '../../../components/input-radio-button-list/input-radio-button-list.element.js'; @@ -10,10 +10,7 @@ import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; * @element umb-property-editor-ui-radio-button-list */ @customElement('umb-property-editor-ui-radio-button-list') -export class UmbPropertyEditorUIRadioButtonListElement - extends UmbLitElement - implements UmbPropertyEditorUiElement -{ +export class UmbPropertyEditorUIRadioButtonListElement extends UmbLitElement implements UmbPropertyEditorUiElement { #value = ''; @property({ type: String }) public get value(): string { diff --git a/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.test.ts b/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.test.ts index 311bdb57cf..415f84aa7b 100644 --- a/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.test.ts +++ b/src/packages/core/property-editor/uis/radio-button-list/property-editor-ui-radio-button-list.test.ts @@ -6,9 +6,9 @@ describe('UmbPropertyEditorUIRadioButtonListElement', () => { let element: UmbPropertyEditorUIRadioButtonListElement; beforeEach(async () => { - element = await fixture( - html` ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/slider/property-editor-ui-slider.element.ts b/src/packages/core/property-editor/uis/slider/property-editor-ui-slider.element.ts index 0de1bde785..66d5eb79c1 100644 --- a/src/packages/core/property-editor/uis/slider/property-editor-ui-slider.element.ts +++ b/src/packages/core/property-editor/uis/slider/property-editor-ui-slider.element.ts @@ -1,6 +1,6 @@ import { UmbInputSliderElement } from '../../../components/input-slider/input-slider.element.js'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/tiny-mce/config/dimensions/property-editor-ui-tiny-mce-dimensions-configuration.test.ts b/src/packages/core/property-editor/uis/tiny-mce/config/dimensions/property-editor-ui-tiny-mce-dimensions-configuration.test.ts index 4e3aef83cb..a1cd98015d 100644 --- a/src/packages/core/property-editor/uis/tiny-mce/config/dimensions/property-editor-ui-tiny-mce-dimensions-configuration.test.ts +++ b/src/packages/core/property-editor/uis/tiny-mce/config/dimensions/property-editor-ui-tiny-mce-dimensions-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUITinyMceDimensionsConfigurationElement', () => { let element: UmbPropertyEditorUITinyMceDimensionsConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.element.ts b/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.element.ts index 2d06aed494..86fa1a9750 100644 --- a/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.element.ts +++ b/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.element.ts @@ -1,14 +1,17 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { customElement, html, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; -import { UmbPropertyEditorUiElement } from "@umbraco-cms/backoffice/extension-registry"; +import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; /** * @element umb-property-editor-ui-tiny-mce-maximagesize-configuration */ @customElement('umb-property-editor-ui-tiny-mce-maximagesize-configuration') -export class UmbPropertyEditorUITinyMceMaxImageSizeConfigurationElement extends UmbLitElement implements UmbPropertyEditorUiElement { - @property({type: Number}) +export class UmbPropertyEditorUITinyMceMaxImageSizeConfigurationElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ + @property({ type: Number }) value: number = 0; render() { diff --git a/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.test.ts b/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.test.ts index 34ddcd01cc..924f3e8657 100644 --- a/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.test.ts +++ b/src/packages/core/property-editor/uis/tiny-mce/config/max-image-size/property-editor-ui-tiny-mce-maximagesize-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUITinyMceMaxImSizeConfigurationElement', () => { let element: UmbPropertyEditorUITinyMceMaxImageSizeConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.element.ts b/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.element.ts index b11d7f95b7..b40d99490e 100644 --- a/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.element.ts +++ b/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.element.ts @@ -10,7 +10,10 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-re * @element umb-property-editor-ui-tiny-mce-stylesheets-configuration */ @customElement('umb-property-editor-ui-tiny-mce-stylesheets-configuration') -export class UmbPropertyEditorUITinyMceStylesheetsConfigurationElement extends UmbLitElement implements UmbPropertyEditorUiElement { +export class UmbPropertyEditorUITinyMceStylesheetsConfigurationElement + extends UmbLitElement + implements UmbPropertyEditorUiElement +{ @property({ type: Array }) value: string[] = []; diff --git a/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.test.ts b/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.test.ts index fe3ef35eda..73bc259cc4 100644 --- a/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.test.ts +++ b/src/packages/core/property-editor/uis/tiny-mce/config/stylesheets/property-editor-ui-tiny-mce-stylesheets-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUITinyMceStylesheetsConfigurationElement', () => { let element: UmbPropertyEditorUITinyMceStylesheetsConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.test.ts b/src/packages/core/property-editor/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.test.ts index e54b1a385a..d4110d2ff1 100644 --- a/src/packages/core/property-editor/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.test.ts +++ b/src/packages/core/property-editor/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.test.ts @@ -6,11 +6,9 @@ describe('UmbPropertyEditorUITinyMceToolbarConfigurationElement', () => { let element: UmbPropertyEditorUITinyMceToolbarConfigurationElement; beforeEach(async () => { - element = await fixture( - html` - - ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/toggle/property-editor-ui-toggle.element.ts b/src/packages/core/property-editor/uis/toggle/property-editor-ui-toggle.element.ts index a6b1d97f2a..28a668a60d 100644 --- a/src/packages/core/property-editor/uis/toggle/property-editor-ui-toggle.element.ts +++ b/src/packages/core/property-editor/uis/toggle/property-editor-ui-toggle.element.ts @@ -1,6 +1,6 @@ import { UmbInputToggleElement } from '../../../components/input-toggle/input-toggle.element.js'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/core/property-editor/uis/tree-picker/config/start-node/property-editor-ui-tree-picker-start-node.test.ts b/src/packages/core/property-editor/uis/tree-picker/config/start-node/property-editor-ui-tree-picker-start-node.test.ts index 55531a978c..120c203891 100644 --- a/src/packages/core/property-editor/uis/tree-picker/config/start-node/property-editor-ui-tree-picker-start-node.test.ts +++ b/src/packages/core/property-editor/uis/tree-picker/config/start-node/property-editor-ui-tree-picker-start-node.test.ts @@ -6,9 +6,9 @@ describe('UmbPropertyEditorUITreePickerStartNodeElement', () => { let element: UmbPropertyEditorUITreePickerStartNodeElement; beforeEach(async () => { - element = await fixture( - html` ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/core/property-editor/uis/user-picker/property-editor-ui-user-picker.element.ts b/src/packages/core/property-editor/uis/user-picker/property-editor-ui-user-picker.element.ts index 59ad2f7418..cc85887a5a 100644 --- a/src/packages/core/property-editor/uis/user-picker/property-editor-ui-user-picker.element.ts +++ b/src/packages/core/property-editor/uis/user-picker/property-editor-ui-user-picker.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/packages/core/property-editor/uis/value-type/property-editor-ui-value-type.element.ts b/src/packages/core/property-editor/uis/value-type/property-editor-ui-value-type.element.ts index 2b8261a811..2fbcca9a08 100644 --- a/src/packages/core/property-editor/uis/value-type/property-editor-ui-value-type.element.ts +++ b/src/packages/core/property-editor/uis/value-type/property-editor-ui-value-type.element.ts @@ -1,5 +1,5 @@ import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import type { UUISelectEvent } from '@umbraco-cms/backoffice/external/uui'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/core/repository/data-source/extend-data-source-paged-response-data.function.ts b/src/packages/core/repository/data-source/extend-data-source-paged-response-data.function.ts index b1686406d2..be500ee1b1 100644 --- a/src/packages/core/repository/data-source/extend-data-source-paged-response-data.function.ts +++ b/src/packages/core/repository/data-source/extend-data-source-paged-response-data.function.ts @@ -23,10 +23,10 @@ export function extendDataSourcePagedResponseData< IncomingDataType extends object = object, MissingPropsType extends object = Diff, // Maybe this Omit<..., "$ype"> can be removed, but for now it kept showing up as a difference, though its not a difference on the two types. - ToType = IncomingDataType & ExtendedDataType + ToType = IncomingDataType & ExtendedDataType, >( response: DataSourceResponse>, - appendData: MissingPropsType + appendData: MissingPropsType, ): DataSourceResponse> { if (response.data === undefined) return response as unknown as DataSourceResponse>; return { diff --git a/src/packages/core/repository/data-source/extend-data-source-paged-response-data.test.ts b/src/packages/core/repository/data-source/extend-data-source-paged-response-data.test.ts index 36ff8879db..a41f089ab9 100644 --- a/src/packages/core/repository/data-source/extend-data-source-paged-response-data.test.ts +++ b/src/packages/core/repository/data-source/extend-data-source-paged-response-data.test.ts @@ -27,8 +27,12 @@ describe('extendDataSourcePagedResponseData', () => { const extendedResponse = extendDataSourcePagedResponseData(response, { foo: 'bar' }); expect(extendedResponse.data).that.is.a('object'); - expect(extendedResponse.data?.items[1]).to.have.property('original').to.be.equal('prop'); - expect(extendedResponse.data?.items[1]).to.have.property('foo').to.be.equal('bar'); + expect(extendedResponse.data?.items[1]) + .to.have.property('original') + .to.be.equal('prop'); + expect(extendedResponse.data?.items[1]) + .to.have.property('foo') + .to.be.equal('bar'); }); }); }); diff --git a/src/packages/core/repository/data-source/extend-data-source-response-data.function.ts b/src/packages/core/repository/data-source/extend-data-source-response-data.function.ts index b4481d0b2d..745bb391a9 100644 --- a/src/packages/core/repository/data-source/extend-data-source-response-data.function.ts +++ b/src/packages/core/repository/data-source/extend-data-source-response-data.function.ts @@ -22,7 +22,7 @@ export function extendDataSourceResponseData< ExtendedDataType extends IncomingDataType, IncomingDataType extends object = object, MissingPropsType extends object = Diff, - ToType = IncomingDataType & ExtendedDataType + ToType = IncomingDataType & ExtendedDataType, >(response: DataSourceResponse, appendData: MissingPropsType): DataSourceResponse { if (response.data === undefined) return response as unknown as DataSourceResponse; return { ...response, data: { ...response.data, ...appendData } as unknown as ToType }; diff --git a/src/packages/core/repository/detail-repository.interface.ts b/src/packages/core/repository/detail-repository.interface.ts index c13f3bea24..901424c69f 100644 --- a/src/packages/core/repository/detail-repository.interface.ts +++ b/src/packages/core/repository/detail-repository.interface.ts @@ -6,11 +6,11 @@ export interface UmbDetailRepository< CreateResponseType = any, UpdateRequestType = any, ResponseType = any, - CreateScaffoldPresetType = Partial + CreateScaffoldPresetType = Partial, > { createScaffold( parentId: string | null, - preset?: Partial | CreateScaffoldPresetType + preset?: Partial | CreateScaffoldPresetType, ): Promise>; requestById(id: string): Promise>; byId(id: string): Promise>; diff --git a/src/packages/core/section/section-main/section-main.stories.ts b/src/packages/core/section/section-main/section-main.stories.ts index 51222d7c50..ae41676182 100644 --- a/src/packages/core/section/section-main/section-main.stories.ts +++ b/src/packages/core/section/section-main/section-main.stories.ts @@ -10,6 +10,7 @@ export default { id: 'umb-section-main', } as Meta; -export const AAAOverview: Story = () => - html` Section Main Area `; +export const AAAOverview: Story = () => html` + Section Main Area +`; AAAOverview.storyName = 'Overview'; diff --git a/src/packages/core/section/section-sidebar-context-menu/section-sidebar-context-menu.element.ts b/src/packages/core/section/section-sidebar-context-menu/section-sidebar-context-menu.element.ts index 48218ba73e..ac589de6f8 100644 --- a/src/packages/core/section/section-sidebar-context-menu/section-sidebar-context-menu.element.ts +++ b/src/packages/core/section/section-sidebar-context-menu/section-sidebar-context-menu.element.ts @@ -1,5 +1,5 @@ import { UmbSectionSidebarContext, UMB_SECTION_SIDEBAR_CONTEXT_TOKEN } from '../section-sidebar/index.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, nothing, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/core/section/section-sidebar-menu/section-sidebar-menu.element.ts b/src/packages/core/section/section-sidebar-menu/section-sidebar-menu.element.ts index c5cb537f0d..9674176523 100644 --- a/src/packages/core/section/section-sidebar-menu/section-sidebar-menu.element.ts +++ b/src/packages/core/section/section-sidebar-menu/section-sidebar-menu.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { ManifestMenu, @@ -24,7 +24,7 @@ umbExtensionsRegistry.register(manifest); @customElement('umb-section-sidebar-menu') export class UmbSectionSidebarMenuElement< - ManifestType extends ManifestSectionSidebarAppBaseMenu = ManifestSectionSidebarAppMenuKind + ManifestType extends ManifestSectionSidebarAppBaseMenu = ManifestSectionSidebarAppMenuKind, > extends UmbLitElement { @property({ type: Object, attribute: false }) manifest?: ManifestType; diff --git a/src/packages/core/section/section-sidebar/section-sidebar.context.ts b/src/packages/core/section/section-sidebar/section-sidebar.context.ts index 64e0f4d88e..1221c3e175 100644 --- a/src/packages/core/section/section-sidebar/section-sidebar.context.ts +++ b/src/packages/core/section/section-sidebar/section-sidebar.context.ts @@ -42,5 +42,5 @@ export class UmbSectionSidebarContext { } export const UMB_SECTION_SIDEBAR_CONTEXT_TOKEN = new UmbContextToken( - 'UmbSectionSidebarContext' + 'UmbSectionSidebarContext', ); diff --git a/src/packages/core/section/section-sidebar/section-sidebar.element.ts b/src/packages/core/section/section-sidebar/section-sidebar.element.ts index 02111cd4ef..4d9915a143 100644 --- a/src/packages/core/section/section-sidebar/section-sidebar.element.ts +++ b/src/packages/core/section/section-sidebar/section-sidebar.element.ts @@ -1,5 +1,5 @@ import { UmbSectionSidebarContext, UMB_SECTION_SIDEBAR_CONTEXT_TOKEN } from './section-sidebar.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/core/section/section-sidebar/section-sidebar.stories.ts b/src/packages/core/section/section-sidebar/section-sidebar.stories.ts index 9db14ee52d..90dd1f902c 100644 --- a/src/packages/core/section/section-sidebar/section-sidebar.stories.ts +++ b/src/packages/core/section/section-sidebar/section-sidebar.stories.ts @@ -10,6 +10,7 @@ export default { id: 'umb-section-sidebar', } as Meta; -export const AAAOverview: Story = () => - html` Section Sidebar Area `; +export const AAAOverview: Story = () => html` + Section Sidebar Area +`; AAAOverview.storyName = 'Overview'; diff --git a/src/packages/core/sorter/sorter.controller.ts b/src/packages/core/sorter/sorter.controller.ts index 4b28bdbca5..b9bc23e05d 100644 --- a/src/packages/core/sorter/sorter.controller.ts +++ b/src/packages/core/sorter/sorter.controller.ts @@ -265,7 +265,7 @@ export class UmbSorterController implements UmbController { throw new Error( 'Could not find drag element, query was made with the `draggableSelector` of "' + this.#config.draggableSelector + - '"' + '"', ); return; } @@ -446,7 +446,7 @@ export class UmbSorterController implements UmbController { const orderedContainerElements = Array.from( this.#currentContainerElement.shadowRoot ? this.#currentContainerElement.shadowRoot.querySelectorAll(this.#config.itemSelector) - : this.#currentContainerElement.querySelectorAll(this.#config.itemSelector) + : this.#currentContainerElement.querySelectorAll(this.#config.itemSelector), ); const currentContainerRect = this.#currentContainerElement.getBoundingClientRect(); @@ -510,7 +510,7 @@ export class UmbSorterController implements UmbController { const subBoundaryRect = subBoundaryElement.getBoundingClientRect(); const subContainerHasItems = subLayoutEl.querySelector( - this.#config.itemSelector + ':not(.' + this.#config.placeholderClass + ')' + this.#config.itemSelector + ':not(.' + this.#config.placeholderClass + ')', ); // gather elements on the same row. const subOffsetEdge = subContainerHasItems ? -10 : 20; diff --git a/src/packages/core/workspace/variant-context/nameable-variant-context.interface.ts b/src/packages/core/workspace/variant-context/nameable-variant-context.interface.ts index e92e823a41..a293194900 100644 --- a/src/packages/core/workspace/variant-context/nameable-variant-context.interface.ts +++ b/src/packages/core/workspace/variant-context/nameable-variant-context.interface.ts @@ -1,8 +1,8 @@ -import { UmbVariantContext } from "./variant-context.interface.js"; +import { UmbVariantContext } from './variant-context.interface.js'; /** * A variant context with ability to set the name of it. -*/ + */ export interface UmbNameableVariantContext extends UmbVariantContext { - setName(name:string): void + setName(name: string): void; } diff --git a/src/packages/core/workspace/variant-context/variant-context.interface.ts b/src/packages/core/workspace/variant-context/variant-context.interface.ts index 48fe5bc9a3..a1021dd7a1 100644 --- a/src/packages/core/workspace/variant-context/variant-context.interface.ts +++ b/src/packages/core/workspace/variant-context/variant-context.interface.ts @@ -1,5 +1,5 @@ -import type { UmbVariantId } from "../../variant/variant-id.class.js"; -import type { Observable } from "@umbraco-cms/backoffice/external/rxjs"; +import type { UmbVariantId } from '../../variant/variant-id.class.js'; +import type { Observable } from '@umbraco-cms/backoffice/external/rxjs'; /** * A variant context, represents a set of properties. @@ -15,11 +15,10 @@ import type { Observable } from "@umbraco-cms/backoffice/external/rxjs"; * Also setting the name is an additional feature. */ export interface UmbVariantContext { - getType(): string; getUnique(): string | undefined; //getUniqueName(): string; - getVariantId: (() => UmbVariantId); + getVariantId: () => UmbVariantId; getName(): string | undefined; readonly name: Observable; @@ -27,8 +26,7 @@ export interface UmbVariantContext { destroy(): void; // Property methods: - propertyVariantId?: ((propertyAlias: string) => Promise>); + propertyVariantId?: (propertyAlias: string) => Promise>; propertyValueByAlias(propertyAlias: string): Promise>; setPropertyValue(propertyAlias: string, value: unknown): Promise; - } diff --git a/src/packages/core/workspace/workspace-action-menu/workspace-action-menu.element.ts b/src/packages/core/workspace/workspace-action-menu/workspace-action-menu.element.ts index ef4b755538..48e0cae55e 100644 --- a/src/packages/core/workspace/workspace-action-menu/workspace-action-menu.element.ts +++ b/src/packages/core/workspace/workspace-action-menu/workspace-action-menu.element.ts @@ -1,13 +1,10 @@ import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; -import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; +import { css, html, customElement, state, nothing } from '@umbraco-cms/backoffice/external/lit'; import { UmbActionExecutedEvent } from '@umbraco-cms/backoffice/event'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UMB_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace'; @customElement('umb-workspace-action-menu') export class UmbWorkspaceActionMenuElement extends UmbLitElement { - @state() - private _actionMenuIsOpen = false; - private _workspaceContext?: typeof UMB_WORKSPACE_CONTEXT.TYPE; @state() @@ -16,6 +13,9 @@ export class UmbWorkspaceActionMenuElement extends UmbLitElement { @state() _entityType?: string; + @state() + _popoverOpen = false; + constructor() { super(); @@ -31,17 +31,15 @@ export class UmbWorkspaceActionMenuElement extends UmbLitElement { this._entityType = this._workspaceContext.getEntityType(); } - #close() { - this._actionMenuIsOpen = false; - } - - #open() { - this._actionMenuIsOpen = true; - } - #onActionExecuted(event: UmbActionExecutedEvent) { event.stopPropagation(); - this.#close(); + } + + // TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet. + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + #onPopoverToggle(event: ToggleEvent) { + this._popoverOpen = event.newState === 'open'; } render() { @@ -51,42 +49,37 @@ export class UmbWorkspaceActionMenuElement extends UmbLitElement { #renderActionsMenu() { return this._entityId && this._entityType ? html` - - -
    - - - - -
    -     -
    ` - : ''; + + Actions + + + + + + + + + + + ` + : nothing; } static styles = [ UmbTextStyles, css` - #action-menu-popover { - display: block; + :host { + height: 100%; } - #action-menu-dropdown { - overflow: hidden; - z-index: -1; - background-color: var(--uui-combobox-popover-background-color, var(--uui-color-surface)); - border: 1px solid var(--uui-color-border); - border-radius: var(--uui-border-radius); - width: 100%; + + :host > uui-button { height: 100%; - box-sizing: border-box; - box-shadow: var(--uui-shadow-depth-3); - width: 250px; - position: absolute; - right: 5px; - height: auto; } `, ]; diff --git a/src/packages/core/workspace/workspace-context/entity-manager-controller.ts b/src/packages/core/workspace/workspace-context/entity-manager-controller.ts index 0c0c05833e..fe338c3a3a 100644 --- a/src/packages/core/workspace/workspace-context/entity-manager-controller.ts +++ b/src/packages/core/workspace/workspace-context/entity-manager-controller.ts @@ -14,7 +14,7 @@ import { UmbEntityDetailStore } from '@umbraco-cms/backoffice/store'; // TODO: switch to use EntityDetailItem ? if we can have such type? export class UmbEntityWorkspaceManager< StoreType extends UmbEntityDetailStore, - EntityDetailsType extends EntityTreeItemResponseModel = ReturnType + EntityDetailsType extends EntityTreeItemResponseModel = ReturnType, > { private _host; @@ -62,7 +62,7 @@ export class UmbEntityWorkspaceManager< (content) => { if (!content) return; // TODO: Handle nicely if there is no content data. this.state.next(content as any); - } + }, ); } } diff --git a/src/packages/core/workspace/workspace-context/workspace-invariantable-context.interface.ts b/src/packages/core/workspace/workspace-context/workspace-invariantable-context.interface.ts index 07a16286ea..dc539d296a 100644 --- a/src/packages/core/workspace/workspace-context/workspace-invariantable-context.interface.ts +++ b/src/packages/core/workspace/workspace-context/workspace-invariantable-context.interface.ts @@ -6,7 +6,6 @@ import type { Observable } from '@umbraco-cms/backoffice/external/rxjs'; export interface UmbInvariantableWorkspaceContextInterface extends UmbSaveableWorkspaceContextInterface { - // Name: getName(): string | undefined; setName(name: string): void; @@ -15,6 +14,6 @@ export interface UmbInvariantableWorkspaceContextInterface propertyValueByAlias(alias: string): Promise>; getPropertyValue(alias: string): ReturnType; setPropertyValue(alias: string, value: unknown): Promise; - + createVariantContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbVariantContext; } diff --git a/src/packages/core/workspace/workspace-context/workspace-variantable-context.interface.ts b/src/packages/core/workspace/workspace-context/workspace-variantable-context.interface.ts index 3ce0dd3238..2301d1393f 100644 --- a/src/packages/core/workspace/workspace-context/workspace-variantable-context.interface.ts +++ b/src/packages/core/workspace/workspace-context/workspace-variantable-context.interface.ts @@ -6,8 +6,8 @@ import type { UmbVariantId } from '@umbraco-cms/backoffice/variant'; import type { VariantResponseModelBaseModel } from '@umbraco-cms/backoffice/backend-api'; import { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; -export interface UmbVariantableWorkspaceContextInterface extends UmbSaveableWorkspaceContextInterface { - +export interface UmbVariantableWorkspaceContextInterface + extends UmbSaveableWorkspaceContextInterface { // Name: getName(variantId?: UmbVariantId): string | undefined; setName(name: string, variantId?: UmbVariantId): void; @@ -19,7 +19,10 @@ export interface UmbVariantableWorkspaceContextInterface e // Property: // This one is async cause it needs to structure to provide this data: - propertyValueByAlias(alias: string, variantId?: UmbVariantId): Promise>; + propertyValueByAlias( + alias: string, + variantId?: UmbVariantId, + ): Promise>; getPropertyValue(alias: string, variantId?: UmbVariantId): ReturnValue | undefined; setPropertyValue(alias: string, value: unknown, variantId?: UmbVariantId): Promise; //propertyDataByAlias(alias: string, variantId?: UmbVariantId): Observable; diff --git a/src/packages/core/workspace/workspace-editor/workspace-editor.stories.ts b/src/packages/core/workspace/workspace-editor/workspace-editor.stories.ts index e1413712c5..4a32b33fb0 100644 --- a/src/packages/core/workspace/workspace-editor/workspace-editor.stories.ts +++ b/src/packages/core/workspace/workspace-editor/workspace-editor.stories.ts @@ -10,11 +10,12 @@ export default { id: 'umb-workspace-editor', } as Meta; -export const AAAOverview: Story = () => html` -
    Icon slot
    -
    Name slot
    -
    Footer slot
    -
    Actions slot
    - Default slot -    `; +export const AAAOverview: Story = () => + html` +
    Icon slot
    +
    Name slot
    +
    Footer slot
    +
    Actions slot
    + Default slot +     `; AAAOverview.storyName = 'Overview'; diff --git a/src/packages/core/workspace/workspace-footer/workspace-footer.stories.ts b/src/packages/core/workspace/workspace-footer/workspace-footer.stories.ts index 7ee012940b..aaa3a2551b 100644 --- a/src/packages/core/workspace/workspace-footer/workspace-footer.stories.ts +++ b/src/packages/core/workspace/workspace-footer/workspace-footer.stories.ts @@ -11,8 +11,9 @@ export default { id: 'umb-workspace-footer', } as Meta; -export const AAAOverview: Story = () => html` -
    Footer slot
    -
    Actions slot
    -    `; +export const AAAOverview: Story = () => + html` +
    Footer slot
    +
    Actions slot
    +     `; AAAOverview.storyName = 'Overview'; diff --git a/src/packages/core/workspace/workspace-modal/workspace-modal.element.ts b/src/packages/core/workspace/workspace-modal/workspace-modal.element.ts index 2c3545243c..f599ce2a9f 100644 --- a/src/packages/core/workspace/workspace-modal/workspace-modal.element.ts +++ b/src/packages/core/workspace/workspace-modal/workspace-modal.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, CSSResultGroup, html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbWorkspaceData } from '@umbraco-cms/backoffice/modal'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.element.ts b/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.element.ts index 1833da3221..1d244f479d 100644 --- a/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.element.ts +++ b/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.element.ts @@ -1,5 +1,5 @@ import { css, html, LitElement, customElement, property } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; /** * @element umb-workspace-property-layout @@ -83,9 +83,9 @@ export class UmbWorkspacePropertyLayoutElement extends LitElement { grid-column: span 2; } /*@container (width > 600px) {*/ - :host(:not([orientation='vertical'])) > div { - grid-column: span 1; - } + :host(:not([orientation='vertical'])) > div { + grid-column: span 1; + } /*}*/ #headerColumn { @@ -93,10 +93,10 @@ export class UmbWorkspacePropertyLayoutElement extends LitElement { height: min-content; } /*@container (width > 600px) {*/ - #headerColumn { - position: sticky; - top: calc(var(--uui-size-space-2) * -1); - } + #headerColumn { + position: sticky; + top: calc(var(--uui-size-space-2) * -1); + } /*}*/ #description { @@ -107,9 +107,9 @@ export class UmbWorkspacePropertyLayoutElement extends LitElement { margin-top: var(--uui-size-space-3); } /*@container (width > 600px) {*/ - #editorColumn { - margin-top: 0; - } + #editorColumn { + margin-top: 0; + } /*}*/ `, ]; diff --git a/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.stories.ts b/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.stories.ts index eeb0ff8842..9dce8c495a 100644 --- a/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.stories.ts +++ b/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.stories.ts @@ -10,11 +10,10 @@ export default { id: 'umb-workspace-property-layout', } as Meta; -export const AAAOverview: Story = () => html` -
    Menu
    +export const AAAOverview: Story = () => + html` +
    Menu
    -
    Editor
    -    `; +
    Editor
    +     `; AAAOverview.storyName = 'Overview'; diff --git a/src/packages/core/workspace/workspace-property/workspace-property.element.ts b/src/packages/core/workspace/workspace-property/workspace-property.element.ts index cb71042839..aff9be9507 100644 --- a/src/packages/core/workspace/workspace-property/workspace-property.element.ts +++ b/src/packages/core/workspace/workspace-property/workspace-property.element.ts @@ -1,6 +1,6 @@ import { type UmbPropertyEditorConfig } from '../../property-editor/index.js'; import { UmbWorkspacePropertyContext } from './workspace-property.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, property, state, ifDefined } from '@umbraco-cms/backoffice/external/lit'; import { createExtensionElement } from '@umbraco-cms/backoffice/extension-api'; import { ManifestPropertyEditorUi, umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry'; @@ -131,7 +131,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement { (manifest) => { this._gotEditorUI(manifest); }, - '_observePropertyEditorUI' + '_observePropertyEditorUI', ); } @@ -144,7 +144,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement { } const el = await createExtensionElement(manifest); - if(el) { + if (el) { const oldValue = this._element; oldValue?.removeEventListener('change', this._onPropertyEditorChange as any as EventListener); @@ -167,7 +167,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement { this._element.value = value; } }, - '_observePropertyValue' + '_observePropertyValue', ); this._configObserver = this.observe( this._propertyContext.config, @@ -176,7 +176,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement { this._element.config = config; } }, - '_observePropertyConfig' + '_observePropertyConfig', ); } diff --git a/src/packages/core/workspace/workspace-split-view/workspace-split-view.element.ts b/src/packages/core/workspace/workspace-split-view/workspace-split-view.element.ts index dfd8b7398e..5f222c1e31 100644 --- a/src/packages/core/workspace/workspace-split-view/workspace-split-view.element.ts +++ b/src/packages/core/workspace/workspace-split-view/workspace-split-view.element.ts @@ -1,5 +1,5 @@ import { UmbWorkspaceSplitViewContext } from './workspace-split-view.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @@ -27,10 +27,7 @@ export class UmbWorkspaceSplitViewElement extends UmbLitElement { render() { return html` - + diff --git a/src/packages/core/workspace/workspace.element.ts b/src/packages/core/workspace/workspace.element.ts index 76606f6b30..8a1c82d92e 100644 --- a/src/packages/core/workspace/workspace.element.ts +++ b/src/packages/core/workspace/workspace.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, nothing, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { ManifestWorkspace } from '@umbraco-cms/backoffice/extension-registry'; diff --git a/src/packages/dictionary/dictionary/entity-actions/reload.action.ts b/src/packages/dictionary/dictionary/entity-actions/reload.action.ts index c9b3240133..95ef56cffa 100644 --- a/src/packages/dictionary/dictionary/entity-actions/reload.action.ts +++ b/src/packages/dictionary/dictionary/entity-actions/reload.action.ts @@ -1,5 +1,5 @@ import { UmbDictionaryRepository } from '../repository/dictionary.repository.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbEntityActionBase } from '@umbraco-cms/backoffice/entity-action'; import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api'; diff --git a/src/packages/dictionary/dictionary/repository/dictionary.store.ts b/src/packages/dictionary/dictionary/repository/dictionary.store.ts index 9bb616d6e0..44347b97fb 100644 --- a/src/packages/dictionary/dictionary/repository/dictionary.store.ts +++ b/src/packages/dictionary/dictionary/repository/dictionary.store.ts @@ -15,7 +15,7 @@ export class UmbDictionaryStore extends UmbStoreBase { super( host, UMB_DICTIONARY_STORE_CONTEXT_TOKEN.toString(), - new UmbArrayState([], (x) => x.id) + new UmbArrayState([], (x) => x.id), ); } diff --git a/src/packages/documents/document-blueprints/document-blueprint.detail.store.ts b/src/packages/documents/document-blueprints/document-blueprint.detail.store.ts index 97f8eb0a96..fad4dafbc3 100644 --- a/src/packages/documents/document-blueprints/document-blueprint.detail.store.ts +++ b/src/packages/documents/document-blueprints/document-blueprint.detail.store.ts @@ -17,7 +17,7 @@ export class UmbDocumentBlueprintStore extends UmbStoreBase { UMB_DOCUMENT_BLUEPRINT_STORE_CONTEXT_TOKEN.toString(), // TODO: use the right type: - new UmbArrayState([], (x) => x.id) + new UmbArrayState([], (x) => x.id), ); } @@ -97,5 +97,5 @@ export class UmbDocumentBlueprintStore extends UmbStoreBase { } export const UMB_DOCUMENT_BLUEPRINT_STORE_CONTEXT_TOKEN = new UmbContextToken( - 'UmbDocumentBlueprintStore' + 'UmbDocumentBlueprintStore', ); diff --git a/src/packages/documents/document-types/entity-actions/create/modal/index.ts b/src/packages/documents/document-types/entity-actions/create/modal/index.ts index 25864e9b3b..d5e5161ad0 100644 --- a/src/packages/documents/document-types/entity-actions/create/modal/index.ts +++ b/src/packages/documents/document-types/entity-actions/create/modal/index.ts @@ -9,5 +9,5 @@ export const UMB_DOCUMENT_TYPE_CREATE_OPTIONS_MODAL = new UmbModalToken - - ${this._actionMenuIsOpen ? this.#renderDropdown() : nothing} -     - `; + if (this.dropdownElement) { + this.dropdownElement.open = false; + } } - #renderDropdown() { + render() { return html` -
    - - - -
    + + +
    + + + +
    +     `; } - static styles = [ - css` - #action-menu-popover { - display: block; - text-align: right; - } - #action-menu-dropdown { - overflow: hidden; - z-index: -1; - background-color: var(--uui-combobox-popover-background-color, var(--uui-color-surface)); - border: 1px solid var(--uui-color-border); - border-radius: var(--uui-border-radius); - width: 100%; - height: 100%; - box-sizing: border-box; - box-shadow: var(--uui-shadow-depth-3); - width: 500px; - } - `, - ]; + static styles = [css``]; } export default UmbDocumentTableActionColumnLayoutElement; diff --git a/src/packages/documents/documents/property-editors/document-picker/property-editor-ui-document-picker.element.ts b/src/packages/documents/documents/property-editors/document-picker/property-editor-ui-document-picker.element.ts index cad00b5b53..0fbadb185a 100644 --- a/src/packages/documents/documents/property-editors/document-picker/property-editor-ui-document-picker.element.ts +++ b/src/packages/documents/documents/property-editors/document-picker/property-editor-ui-document-picker.element.ts @@ -5,10 +5,7 @@ import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; @customElement('umb-property-editor-ui-document-picker') -export class UmbPropertyEditorUIContentPickerElement - extends UmbLitElement - implements UmbPropertyEditorUiElement -{ +export class UmbPropertyEditorUIContentPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { private _value: Array = []; @property({ type: Array }) diff --git a/src/packages/documents/documents/repository/sources/document.server.data.ts b/src/packages/documents/documents/repository/sources/document.server.data.ts index 98acdb0944..1f26836858 100644 --- a/src/packages/documents/documents/repository/sources/document.server.data.ts +++ b/src/packages/documents/documents/repository/sources/document.server.data.ts @@ -117,7 +117,6 @@ export class UmbDocumentServerDataSource return tryExecuteAndNotify(this.#host, DocumentResource.putDocumentById({ id, requestBody })); } - /** * Publish one or more variants of a Document * @param {string} id diff --git a/src/packages/documents/documents/user-permissions/manifests.ts b/src/packages/documents/documents/user-permissions/manifests.ts index b1460257c6..6269ef72e6 100644 --- a/src/packages/documents/documents/user-permissions/manifests.ts +++ b/src/packages/documents/documents/user-permissions/manifests.ts @@ -195,8 +195,7 @@ export const granularPermissions: Array = [ type: 'userGranularPermission', alias: 'Umb.UserGranularPermission.Document', name: 'Document Granular User Permission', - js: () => - import('../components/input-document-granular-permission/input-document-granular-permission.element.js'), + js: () => import('../components/input-document-granular-permission/input-document-granular-permission.element.js'), meta: { entityType: 'document', }, diff --git a/src/packages/documents/documents/workspace/document-workspace-editor.element.ts b/src/packages/documents/documents/workspace/document-workspace-editor.element.ts index 5145be6ade..9942b7faca 100644 --- a/src/packages/documents/documents/workspace/document-workspace-editor.element.ts +++ b/src/packages/documents/documents/workspace/document-workspace-editor.element.ts @@ -1,6 +1,6 @@ import { UmbDocumentWorkspaceSplitViewElement } from './document-workspace-split-view.element.js'; import { UMB_DOCUMENT_WORKSPACE_CONTEXT } from './document-workspace.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { customElement, state, css, html } from '@umbraco-cms/backoffice/external/lit'; import { UmbVariantId } from '@umbraco-cms/backoffice/variant'; import type { UmbRoute, UmbRouterSlotInitEvent } from '@umbraco-cms/backoffice/router'; @@ -43,7 +43,7 @@ export class UmbDocumentWorkspaceEditorElement extends UmbLitElement { this._availableVariants = variants; this._generateRoutes(); }, - '_observeVariants' + '_observeVariants', ); } @@ -54,7 +54,7 @@ export class UmbDocumentWorkspaceEditorElement extends UmbLitElement { (variants) => { this._workspaceSplitViews = variants; }, - '_observeSplitViews' + '_observeSplitViews', ); } diff --git a/src/packages/documents/documents/workspace/document-workspace-split-view.element.ts b/src/packages/documents/documents/workspace/document-workspace-split-view.element.ts index 966f21ca45..5a72966566 100644 --- a/src/packages/documents/documents/workspace/document-workspace-split-view.element.ts +++ b/src/packages/documents/documents/workspace/document-workspace-split-view.element.ts @@ -1,5 +1,5 @@ import { UMB_DOCUMENT_WORKSPACE_CONTEXT } from './document-workspace.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, nothing, customElement, state, repeat } from '@umbraco-cms/backoffice/external/lit'; import { ActiveVariant } from '@umbraco-cms/backoffice/workspace'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @@ -28,7 +28,7 @@ export class UmbDocumentWorkspaceSplitViewElement extends UmbLitElement { (variants) => { this._variants = variants; }, - '_observeActiveVariantsInfo' + '_observeActiveVariantsInfo', ); } @@ -44,7 +44,7 @@ export class UmbDocumentWorkspaceSplitViewElement extends UmbLitElement { alias="Umb.Workspace.Document" .splitViewIndex=${view.index} .displayNavigation=${view.index === this._variants!.length - 1}> - ` + `, )} diff --git a/src/packages/documents/documents/workspace/document-workspace.context.ts b/src/packages/documents/documents/workspace/document-workspace.context.ts index fe551aeef5..2d0977fdb4 100644 --- a/src/packages/documents/documents/workspace/document-workspace.context.ts +++ b/src/packages/documents/documents/workspace/document-workspace.context.ts @@ -24,7 +24,9 @@ import { UmbContextToken } from '@umbraco-cms/backoffice/context-api'; type EntityType = DocumentResponseModel; export class UmbDocumentWorkspaceContext extends UmbEditableWorkspaceContextBase - implements UmbVariantableWorkspaceContextInterface, UmbPublishableWorkspaceContextInterface + implements + UmbVariantableWorkspaceContextInterface, + UmbPublishableWorkspaceContextInterface { /** * The document is the current stored version of the document. @@ -204,19 +206,18 @@ export class UmbDocumentWorkspaceContext async delete() { const id = this.getEntityId(); - if(id) { + if (id) { await this.repository.delete(id); } } - public async publish() { // TODO: This might be right to publish all, but we need a method that just publishes a declared range of variants. const currentData = this.#currentData.value; - if(currentData) { + if (currentData) { const variantIds = currentData.variants?.map((x) => UmbVariantId.Create(x)); const id = this.getEntityId(); - if(variantIds && id) { + if (variantIds && id) { await this.repository.publish(id, variantIds); } } @@ -225,10 +226,10 @@ export class UmbDocumentWorkspaceContext public async saveAndPublish() { // TODO: This might be right to publish all, but we need a method that just saves and publishes a declared range of variants. const currentData = this.#currentData.value; - if(currentData) { + if (currentData) { const variantIds = currentData.variants?.map((x) => UmbVariantId.Create(x)); const id = currentData.id; - if(variantIds && id) { + if (variantIds && id) { await this.repository.saveAndPublish(id, currentData, variantIds); } } @@ -237,10 +238,10 @@ export class UmbDocumentWorkspaceContext public async unpublish() { // TODO: This might be right to unpublish all, but we need a method that just publishes a declared range of variants. const currentData = this.#currentData.value; - if(currentData) { + if (currentData) { const variantIds = currentData.variants?.map((x) => UmbVariantId.Create(x)); const id = this.getEntityId(); - if(variantIds && id) { + if (variantIds && id) { await this.repository.unpublish(id, variantIds); } } diff --git a/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-properties.element.ts b/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-properties.element.ts index 43eccabe75..34dcc050ec 100644 --- a/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-properties.element.ts +++ b/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-properties.element.ts @@ -1,6 +1,6 @@ import { UMB_DOCUMENT_WORKSPACE_CONTEXT } from '../../document-workspace.context.js'; import { css, html, customElement, property, state, repeat } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbContentTypePropertyStructureHelper, PropertyContainerTypes } from '@umbraco-cms/backoffice/content-type'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { PropertyTypeModelBaseModel } from '@umbraco-cms/backoffice/backend-api'; @@ -42,7 +42,10 @@ export class UmbDocumentWorkspaceViewEditPropertiesElement extends UmbLitElement return repeat( this._propertyStructure, (property) => property.alias, - (property) => html` ` + (property) => + html` `, ); } diff --git a/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-tab.element.ts b/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-tab.element.ts index 42a9d2b1dd..ad163ad681 100644 --- a/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-tab.element.ts +++ b/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-tab.element.ts @@ -1,6 +1,6 @@ import { UMB_DOCUMENT_WORKSPACE_CONTEXT } from '../../document-workspace.context.js'; import { css, html, customElement, property, state, repeat } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbContentTypeContainerStructureHelper } from '@umbraco-cms/backoffice/content-type'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { PropertyTypeContainerModelBaseModel } from '@umbraco-cms/backoffice/backend-api'; @@ -78,12 +78,13 @@ export class UmbDocumentWorkspaceViewEditTabElement extends UmbLitElement { ${repeat( this._groups, (group) => group.name, - (group) => html` - - ` + (group) => + html` + + `, )} `; } diff --git a/src/packages/documents/documents/workspace/views/info/document-info-workspace-view.element.ts b/src/packages/documents/documents/workspace/views/info/document-info-workspace-view.element.ts index e8895445e8..f99c551048 100644 --- a/src/packages/documents/documents/workspace/views/info/document-info-workspace-view.element.ts +++ b/src/packages/documents/documents/workspace/views/info/document-info-workspace-view.element.ts @@ -138,13 +138,15 @@ export class UmbDocumentInfoWorkspaceViewElement extends UmbLitElement { render() { return html`
    - ${this.#renderLinksSection()} + + ${this.#renderLinksSection()} + ${repeat( this._historyList, (item) => item.timestamp, - (item) => this.#renderHistory(item) + (item) => this.#renderHistory(item), )} ${this.#renderHistoryPagination()} @@ -173,11 +175,14 @@ export class UmbDocumentInfoWorkspaceViewElement extends UmbLitElement { return html`
    ${this.localize.term('content_publishStatus')} - +
    - +
    @@ -198,9 +203,11 @@ export class UmbDocumentInfoWorkspaceViewElement extends UmbLitElement { #renderHistory(history: HistoryNode) { return html` - ${this.#renderTag(history.logType)} ${this.#renderTagDescription(history.logType, history)} + ${this.#renderTag(history.logType)} ${this.#renderTagDescription(history.logType, history)} - + `; @@ -221,15 +228,29 @@ export class UmbDocumentInfoWorkspaceViewElement extends UmbLitElement { #renderTag(type?: HistoryLogType) { switch (type) { case 'Publish': - return html``; + return html``; case 'Unpublish': - return html``; + return html``; case 'Save': - return html``; + return html``; case 'ContentVersionEnableCleanup': - return html``; + return html``; case 'ContentVersionPreventCleanup': - return html``; + return html``; default: return 'Could not detect log type'; } diff --git a/src/packages/health-check/health-check-dashboard.context.ts b/src/packages/health-check/health-check-dashboard.context.ts index 5f1e9c938a..066987a82b 100644 --- a/src/packages/health-check/health-check-dashboard.context.ts +++ b/src/packages/health-check/health-check-dashboard.context.ts @@ -35,5 +35,5 @@ export class UmbHealthCheckDashboardContext { } export const UMB_HEALTHCHECK_DASHBOARD_CONTEXT_TOKEN = new UmbContextToken( - 'UmbHealthCheckDashboardContext' + 'UmbHealthCheckDashboardContext', ); diff --git a/src/packages/health-check/health-check.context.ts b/src/packages/health-check/health-check.context.ts index ad1c9cff8b..513b6cff46 100644 --- a/src/packages/health-check/health-check.context.ts +++ b/src/packages/health-check/health-check.context.ts @@ -34,7 +34,7 @@ export class UmbHealthCheckContext { async checkGroup(name: string) { const { data } = await tryExecuteAndNotify( this.host, - HealthCheckResource.postHealthCheckGroupByNameCheck({ name }) + HealthCheckResource.postHealthCheckGroupByNameCheck({ name }), ); if (data) { diff --git a/src/packages/health-check/views/health-check-action.element.ts b/src/packages/health-check/views/health-check-action.element.ts index 404d4f1bc4..64a88ecd85 100644 --- a/src/packages/health-check/views/health-check-action.element.ts +++ b/src/packages/health-check/views/health-check-action.element.ts @@ -19,7 +19,7 @@ export class UmbDashboardHealthCheckActionElement extends UmbLitElement { this._buttonState = 'waiting'; const { error } = await tryExecuteAndNotify( this, - HealthCheckResource.postHealthCheckExecuteAction({ requestBody: this.action }) + HealthCheckResource.postHealthCheckExecuteAction({ requestBody: this.action }), ); if (error) { diff --git a/src/packages/health-check/views/health-check-group-box-overview.element.ts b/src/packages/health-check/views/health-check-group-box-overview.element.ts index 33f8a59cc2..45c6c6fac2 100644 --- a/src/packages/health-check/views/health-check-group-box-overview.element.ts +++ b/src/packages/health-check/views/health-check-group-box-overview.element.ts @@ -3,7 +3,7 @@ import { UMB_HEALTHCHECK_DASHBOARD_CONTEXT_TOKEN, UmbHealthCheckDashboardContext, } from '../health-check-dashboard.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, nothing, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; import { ensureSlash, path } from '@umbraco-cms/backoffice/router'; import type { ManifestHealthCheck } from '@umbraco-cms/backoffice/extension-registry'; @@ -33,10 +33,14 @@ export class UmbHealthCheckGroupBoxOverviewElement extends UmbLitElement { if (!this._healthCheckContext || !this.manifest?.meta.label) return; this._api = this._healthCheckContext?.apis.get(this.manifest?.meta.label); - if(this._api) { - this.observe(this._api.results, (results) => { - this._keyResults = results; - }, '_observeApiResults'); + if (this._api) { + this.observe( + this._api.results, + (results) => { + this._keyResults = results; + }, + '_observeApiResults', + ); } }); } diff --git a/src/packages/health-check/views/health-check-group.element.ts b/src/packages/health-check/views/health-check-group.element.ts index e7493d4d48..c73a87c193 100644 --- a/src/packages/health-check/views/health-check-group.element.ts +++ b/src/packages/health-check/views/health-check-group.element.ts @@ -47,7 +47,7 @@ export class UmbDashboardHealthCheckGroupElement extends UmbLitElement { this._api = this._healthCheckContext?.apis.get(this.groupName); - if(this._api) { + if (this._api) { this._api.getGroupChecks(this.groupName); this.observe(this._api.checks, (group) => { @@ -58,7 +58,6 @@ export class UmbDashboardHealthCheckGroupElement extends UmbLitElement { this.observe(this._api.results, (results) => { this._idResults = results?.checks; }); - } }); } @@ -161,7 +160,7 @@ export class UmbDashboardHealthCheckGroupElement extends UmbLitElement { (action) => html` this._buttonHandler()}>` + @action-executed=${() => this._buttonHandler()}>`, )}
    `; else return nothing; diff --git a/src/packages/log-viewer/components/donut-chart/donut-chart.element.ts b/src/packages/log-viewer/components/donut-chart/donut-chart.element.ts index 60ae7949b6..57e66e65c1 100644 --- a/src/packages/log-viewer/components/donut-chart/donut-chart.element.ts +++ b/src/packages/log-viewer/components/donut-chart/donut-chart.element.ts @@ -1,5 +1,5 @@ import { UmbDonutSliceElement } from './donut-slice.element.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, @@ -149,7 +149,7 @@ export class UmbDonutChartElement extends LitElement { name: slice.name, kind: slice.kind, }; - }) + }), ); } @@ -258,7 +258,7 @@ export class UmbDonutChartElement extends LitElement { role="listitem" d="${circle.commands}" transform="rotate(${circle.offset} ${this.viewBox / 2} ${this.viewBox / 2})"> - ` + `, )} `; diff --git a/src/packages/log-viewer/components/donut-chart/donut-chart.stories.ts b/src/packages/log-viewer/components/donut-chart/donut-chart.stories.ts index 61351f9134..328aa86b92 100644 --- a/src/packages/log-viewer/components/donut-chart/donut-chart.stories.ts +++ b/src/packages/log-viewer/components/donut-chart/donut-chart.stories.ts @@ -11,10 +11,11 @@ export default { tags: ['autodocs'], } as Meta; -export const AAAOverview = () => html` - - - - -`; +export const AAAOverview = () => + html` + + + + + `; AAAOverview.storyName = 'Overview'; diff --git a/src/packages/log-viewer/components/log-viewer-date-range-selector.element.ts b/src/packages/log-viewer/components/log-viewer-date-range-selector.element.ts index b296e0f4c6..23e3587136 100644 --- a/src/packages/log-viewer/components/log-viewer-date-range-selector.element.ts +++ b/src/packages/log-viewer/components/log-viewer-date-range-selector.element.ts @@ -3,7 +3,7 @@ import { UmbLogViewerWorkspaceContext, UMB_APP_LOG_VIEWER_CONTEXT_TOKEN, } from '../workspace/logviewer.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, property, queryAll, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { query as getQuery, path, toQueryString } from '@umbraco-cms/backoffice/router'; diff --git a/src/packages/log-viewer/repository/sources/index.ts b/src/packages/log-viewer/repository/sources/index.ts index 9dd4491af0..6c015eb773 100644 --- a/src/packages/log-viewer/repository/sources/index.ts +++ b/src/packages/log-viewer/repository/sources/index.ts @@ -40,7 +40,7 @@ export interface LogMessagesDataSource { }): Promise>; getLogViewerLogs({ skip, - take = 100, + take, orderDirection, filterExpression, logLevel, @@ -57,7 +57,7 @@ export interface LogMessagesDataSource { }): Promise>; getLogViewerMessageTemplate({ skip, - take = 100, + take, startDate, endDate, }: { diff --git a/src/packages/log-viewer/repository/sources/log-viewer.server.data.ts b/src/packages/log-viewer/repository/sources/log-viewer.server.data.ts index 1125cbf0e7..ee635d5f85 100644 --- a/src/packages/log-viewer/repository/sources/log-viewer.server.data.ts +++ b/src/packages/log-viewer/repository/sources/log-viewer.server.data.ts @@ -57,7 +57,7 @@ export class UmbLogSearchesServerDataSource implements LogSearchDataSource { async postLogViewerSavedSearch({ name, query }: SavedLogSearchResponseModel) { return await tryExecuteAndNotify( this.#host, - LogViewerResource.postLogViewerSavedSearch({ requestBody: { name, query } }) + LogViewerResource.postLogViewerSavedSearch({ requestBody: { name, query } }), ); } /** @@ -114,7 +114,7 @@ export class UmbLogMessagesServerDataSource implements LogMessagesDataSource { LogViewerResource.getLogViewerLevelCount({ startDate, endDate, - }) + }), ); } /** @@ -167,7 +167,7 @@ export class UmbLogMessagesServerDataSource implements LogMessagesDataSource { logLevel, startDate, endDate, - }) + }), ); } /** @@ -205,7 +205,7 @@ export class UmbLogMessagesServerDataSource implements LogMessagesDataSource { take, startDate, endDate, - }) + }), ); } @@ -215,7 +215,7 @@ export class UmbLogMessagesServerDataSource implements LogMessagesDataSource { LogViewerResource.getLogViewerValidateLogsSize({ startDate, endDate, - }) + }), ); } } diff --git a/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts b/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts index 1fb940c3c5..0cec2b21d7 100644 --- a/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts +++ b/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts @@ -2,7 +2,7 @@ import '../../components/index.js'; import { UmbLogViewerWorkspaceContext } from '../logviewer.context.js'; import { PropertyValueMap, css, html, customElement } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; //TODO make uui-input accept min and max values diff --git a/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-types-chart.element.ts b/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-types-chart.element.ts index 9f20a35e6c..e42b852e00 100644 --- a/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-types-chart.element.ts +++ b/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-types-chart.element.ts @@ -74,7 +74,7 @@ export class UmbLogViewerLogTypesChartElement extends UmbLitElement { style="color: var(--umb-log-viewer-${level.toLowerCase()}-color);">${level} - ` + `, ) : ''} @@ -87,7 +87,7 @@ export class UmbLogViewerLogTypesChartElement extends UmbLitElement { .name=${level} .amount=${number} .kind=${'messages'} - .color="${`var(--umb-log-viewer-${level.toLowerCase()}-color)`}"> ` + .color="${`var(--umb-log-viewer-${level.toLowerCase()}-color)`}"> `, ) : ''} diff --git a/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts b/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts index b617326c79..8064a1f091 100644 --- a/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts +++ b/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts @@ -1,5 +1,5 @@ import { UmbLogViewerWorkspaceContext, UMB_APP_LOG_VIEWER_CONTEXT_TOKEN } from '../../../logviewer.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { PagedLogTemplateResponseModel, SavedLogSearchResponseModel } from '@umbraco-cms/backoffice/backend-api'; @@ -60,12 +60,12 @@ export class UmbLogViewerMessageTemplatesOverviewElement extends UmbLitElement { ${template.messageTemplate} ${template.count} - ` + `, ) : ''} diff --git a/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts b/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts index 2ed28e1603..d907382832 100644 --- a/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts +++ b/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts @@ -1,5 +1,5 @@ import { UmbLogViewerWorkspaceContext, UMB_APP_LOG_VIEWER_CONTEXT_TOKEN } from '../../../logviewer.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { SavedLogSearchResponseModel } from '@umbraco-cms/backoffice/backend-api'; @@ -33,7 +33,9 @@ export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement { + href=${`section/settings/workspace/logviewer/view/search/?lq=${encodeURIComponent( + searchListItem.query ?? '', + )}`}> ${searchListItem.name} `; diff --git a/src/packages/log-viewer/workspace/views/overview/log-overview-view.element.ts b/src/packages/log-viewer/workspace/views/overview/log-overview-view.element.ts index 312ba162f1..f0f66462d7 100644 --- a/src/packages/log-viewer/workspace/views/overview/log-overview-view.element.ts +++ b/src/packages/log-viewer/workspace/views/overview/log-overview-view.element.ts @@ -53,7 +53,7 @@ export class UmbLogViewerOverviewViewElement extends UmbLitElement {

    ${this._errorCount}

     diff --git a/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts b/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts index 39591c5804..589e0aa1b7 100644 --- a/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts +++ b/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts @@ -64,7 +64,7 @@ export class UmbLogViewerLogLevelFilterMenuElement extends UmbLitElement { #renderLogLevelSelector() { return html` -
    +
    ${Object.values(LogLevelModel).map( (logLevel) => html` - ` + `, )} Select all - Log Level: - ${this._logLevelFilter.length > 0 - ? this._logLevelFilter.map((level) => html`${level}`) - : 'All'} + + + Log Level: + ${this._logLevelFilter.length > 0 + ? this._logLevelFilter.map((level) => html`${level}`) + : 'All'} + ${this.#renderLogLevelSelector()} - + `; } diff --git a/src/packages/log-viewer/workspace/views/search/components/log-viewer-message.element.ts b/src/packages/log-viewer/workspace/views/search/components/log-viewer-message.element.ts index f766e48e0b..6eb6fb9b9b 100644 --- a/src/packages/log-viewer/workspace/views/search/components/log-viewer-message.element.ts +++ b/src/packages/log-viewer/workspace/views/search/components/log-viewer-message.element.ts @@ -1,5 +1,5 @@ import { UmbLogViewerWorkspaceContext, UMB_APP_LOG_VIEWER_CONTEXT_TOKEN } from '../../../logviewer.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, @@ -95,18 +95,18 @@ export class UmbLogViewerMessageElement extends UmbLitElement { label: 'Search Umbraco Source', title: 'Search within Umbraco source code on Github', href: () => - `https://github.com/umbraco/Umbraco-CMS/search?q=${ - this.properties.find((property) => property.name === 'SourceContext')?.value - }`, + `https://github.com/umbraco/Umbraco-CMS/search?q=${this.properties.find( + (property) => property.name === 'SourceContext', + )?.value}`, icon: 'https://github.githubassets.com/favicon.ico', }, { label: 'Search Umbraco Issues', title: 'Search Umbraco Issues on Github', href: () => - `https://github.com/umbraco/Umbraco-CMS/issues?q=${ - this.properties.find((property) => property.name === 'SourceContext')?.value - }`, + `https://github.com/umbraco/Umbraco-CMS/issues?q=${this.properties.find( + (property) => property.name === 'SourceContext', + )?.value}`, icon: 'https://github.githubassets.com/favicon.ico', }, ]; @@ -175,28 +175,24 @@ export class UmbLogViewerMessageElement extends UmbLitElement { ` : ''}
    - ` + `, )} - - Search -
      - ${this._searchMenuData.map( - (menuItem) => html` -
    • - - - -
      • - ` - )} -
    -     + + Search + ${this._searchMenuData.map( + (menuItem) => html` + + + + `, + )} + `; } @@ -253,7 +249,12 @@ export class UmbLogViewerMessageElement extends UmbLitElement { border-left: 4px solid #d42054; color: #303033; display: block; - font-family: Lato, Helvetica Neue, Helvetica, Arial, sans-serif; + font-family: + Lato, + Helvetica Neue, + Helvetica, + Arial, + sans-serif; line-height: 20px; overflow-x: auto; padding: 9.5px; @@ -276,6 +277,10 @@ export class UmbLogViewerMessageElement extends UmbLitElement { flex: 1 0 14ch; } + uui-menu-item { + --uui-menu-item-flat-structure: 1; + } + #message { flex: 6 0 14ch; word-break: break-all; @@ -299,19 +304,6 @@ export class UmbLogViewerMessageElement extends UmbLitElement { flex: 3 0 20ch; } - #search-menu { - margin: 0; - padding: 0; - margin-top: var(--uui-size-space-3); - background-color: var(--uui-color-surface); - box-shadow: var(--uui-shadow-depth-3); - max-width: 25%; - } - - #search-menu > li { - padding: 0; - } - .search-item { width: 100%; } diff --git a/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts b/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts index c676e20190..24514ffe97 100644 --- a/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts +++ b/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts @@ -79,13 +79,14 @@ export class UmbLogViewerMessagesListElement extends UmbLitElement { #renderLogs() { return html`${this._logs.length > 0 ? html` ${this._logs.map( - (log) => html`` + (log) => + html``, )}` : html` diff --git a/src/packages/log-viewer/workspace/views/search/components/log-viewer-polling-button.element.ts b/src/packages/log-viewer/workspace/views/search/components/log-viewer-polling-button.element.ts index 38b6071a98..c94a3a224b 100644 --- a/src/packages/log-viewer/workspace/views/search/components/log-viewer-polling-button.element.ts +++ b/src/packages/log-viewer/workspace/views/search/components/log-viewer-polling-button.element.ts @@ -4,18 +4,14 @@ import { UmbLogViewerWorkspaceContext, UMB_APP_LOG_VIEWER_CONTEXT_TOKEN, } from '../../../logviewer.context.js'; -import { UUIPopoverElement, UUISymbolExpandElement } from '@umbraco-cms/backoffice/external/uui'; import { css, html, customElement, query, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; +import { UmbDropdownElement } from '@umbraco-cms/backoffice/components'; @customElement('umb-log-viewer-polling-button') export class UmbLogViewerPollingButtonElement extends UmbLitElement { - @query('#polling-popover') - private _pollingPopover!: UUIPopoverElement; - - @query('#polling-expand-symbol') - private _polingExpandSymbol!: UUISymbolExpandElement; - + @query('#polling-rate-dropdown') + private dropdownElement?: UmbDropdownElement; @state() private _poolingConfig: PoolingCOnfig = { enabled: false, interval: 0 }; @@ -49,55 +45,38 @@ export class UmbLogViewerPollingButtonElement extends UmbLitElement { this.#closePoolingPopover(); }; - #openPoolingPopover() { - this._pollingPopover.open = true; - this._polingExpandSymbol.open = true; - } - #closePoolingPopover() { - this._pollingPopover.open = false; - this._polingExpandSymbol.open = false; + if (this.dropdownElement) { + this.dropdownElement.open = false; + } + this.#togglePolling(); } render() { - return html` - ${this._poolingConfig.enabled - ? html`Polling - ${this._poolingConfig.interval / 1000} seconds` - : 'Polling'} - (this._polingExpandSymbol.open = false)}> - - - - -
      + return html` + + ${this._poolingConfig.enabled + ? html`Polling + ${this._poolingConfig.interval / 1000} seconds` + : 'Polling'} + + ${this.#pollingIntervals.map( (interval: PoolingInterval) => html` this.#setPolingInterval(interval)}>` + @click-label=${() => this.#setPolingInterval(interval)}>`, )} -
    -     -     `; + + + `; } static styles = [ css` - #polling-interval-menu { - margin: 0; - padding: 0; - width: 20ch; - background-color: var(--uui-color-surface); - box-shadow: var(--uui-shadow-depth-3); - display: flex; - flex-direction: column; - transform: translateX(calc((100% - 33px) * -1)); - } - #polling-enabled-icon { margin-right: var(--uui-size-space-3); margin-bottom: 1px; diff --git a/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts b/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts index 84638fdab1..b275156459 100644 --- a/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts +++ b/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts @@ -1,9 +1,5 @@ import { UmbLogViewerWorkspaceContext, UMB_APP_LOG_VIEWER_CONTEXT_TOKEN } from '../../../logviewer.context.js'; -import { - UUIInputElement, - UUIPopoverElement, - UUISymbolExpandElement, -} from '@umbraco-cms/backoffice/external/uui'; +import { UUIInputElement } from '@umbraco-cms/backoffice/external/uui'; import { css, html, customElement, query, state } from '@umbraco-cms/backoffice/external/lit'; import { Subject, debounceTime, tap } from '@umbraco-cms/backoffice/external/rxjs'; import { SavedLogSearchResponseModel } from '@umbraco-cms/backoffice/backend-api'; @@ -17,6 +13,7 @@ import { } from '@umbraco-cms/backoffice/modal'; import './log-viewer-search-input-modal.element.js'; +import { UmbDropdownElement } from '@umbraco-cms/backoffice/components'; export interface UmbContextSaveSearchModalData { query: string; } @@ -26,16 +23,13 @@ export const UMB_LOG_VIEWER_SAVE_SEARCH_MODAL = new UmbModalToken (this._showLoader = true)), - debounceTime(250) + debounceTime(250), ) .subscribe((query) => { this.#logViewerContext?.setFilterExpression(query); @@ -94,16 +88,11 @@ export class UmbLogViewerSearchInputElement extends UmbLitElement { } #toggleSavedSearchesPopover() { - this._savedSearchesPopover.open = !this._savedSearchesPopover.open; - } - - #toggleSavedSearchesExpandSymbol() { - this._savedSearchesExpandSymbol.open = !this._savedSearchesExpandSymbol.open; + this._searchDropdownElement.open = !this._searchDropdownElement.open; } #openSavedSearchesPopover() { this.#toggleSavedSearchesPopover(); - this.#toggleSavedSearchesExpandSymbol(); } #setQuery(event: Event) { @@ -113,7 +102,7 @@ export class UmbLogViewerSearchInputElement extends UmbLitElement { #setQueryFromSavedSearch(query: string) { this.inputQuery$.next(query); - this._savedSearchesPopover.open = false; + this._searchDropdownElement.open = false; } #persist(filter: string) { @@ -154,58 +143,50 @@ export class UmbLogViewerSearchInputElement extends UmbLitElement { render() { return html` - - - ${this._showLoader - ? html`
    - -
    ` - : ''} - ${this._inputQuery - ? html`${!this._isQuerySaved - ? html`` - : ''}` - : html``} - Saved searches -     - - - ${this._savedSearches.map( - (search) => - html`
  • - this.#removeSearch(search.name ?? '')} - > -
    • ` - )} -     -     + + ${this._showLoader + ? html`
    + +
    ` + : ''} + ${this._inputQuery + ? html`${!this._isQuerySaved + ? html`` + : ''}` + : html``} + + Saved searches + + ${this._savedSearches.map( + (search) => + html`
  • + this.#removeSearch(search.name ?? '')} + > +
    • `, + )} +     +     +     `; } @@ -230,13 +211,6 @@ export class UmbLogViewerSearchInputElement extends UmbLitElement { flex: 1; } - #saved-searches-container { - width: 100%; - max-height: 300px; - background-color: var(--uui-color-surface); - box-shadow: var(--uui-shadow-depth-1); - } - #loader-container { display: flex; justify-content: center; diff --git a/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts b/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts index 50f44e253c..0bf2df6d26 100644 --- a/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts +++ b/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts @@ -1,5 +1,5 @@ import { UmbLogViewerWorkspaceContext, UMB_APP_LOG_VIEWER_CONTEXT_TOKEN } from '../../logviewer.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbObserverController } from '@umbraco-cms/backoffice/observable-api'; diff --git a/src/packages/media/media/collection-view/collection-view-media-test.element.ts b/src/packages/media/media/collection-view/collection-view-media-test.element.ts index 8c955554b5..5f7e819253 100644 --- a/src/packages/media/media/collection-view/collection-view-media-test.element.ts +++ b/src/packages/media/media/collection-view/collection-view-media-test.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, LitElement, customElement } from '@umbraco-cms/backoffice/external/lit'; @customElement('umb-collection-view-media-test') diff --git a/src/packages/media/media/collection-view/manifests.ts b/src/packages/media/media/collection-view/manifests.ts index 875a88e8e4..8c740473ba 100644 --- a/src/packages/media/media/collection-view/manifests.ts +++ b/src/packages/media/media/collection-view/manifests.ts @@ -12,10 +12,12 @@ export const manifests: Array = [ icon: 'icon-grid', pathName: 'grid', }, - conditions: [{ - alias: 'Umb.Condition.WorkspaceEntityType', - match: 'media', - }], + conditions: [ + { + alias: 'Umb.Condition.WorkspaceEntityType', + match: 'media', + }, + ], }, { type: 'collectionView', @@ -28,10 +30,12 @@ export const manifests: Array = [ icon: 'icon-box', pathName: 'table', }, - conditions: [{ - alias: 'Umb.Condition.WorkspaceEntityType', - match: 'media', - }], + conditions: [ + { + alias: 'Umb.Condition.WorkspaceEntityType', + match: 'media', + }, + ], }, { type: 'collectionView', @@ -45,9 +49,11 @@ export const manifests: Array = [ icon: 'icon-newspaper', pathName: 'test', }, - conditions: [{ - alias: 'Umb.Condition.WorkspaceEntityType', - match: 'media', - }], + conditions: [ + { + alias: 'Umb.Condition.WorkspaceEntityType', + match: 'media', + }, + ], }, ]; diff --git a/src/packages/members/dashboards/welcome/dashboard-members-welcome.element.ts b/src/packages/members/dashboards/welcome/dashboard-members-welcome.element.ts index b118420c58..968ed6264b 100644 --- a/src/packages/members/dashboards/welcome/dashboard-members-welcome.element.ts +++ b/src/packages/members/dashboards/welcome/dashboard-members-welcome.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, LitElement, customElement } from '@umbraco-cms/backoffice/external/lit'; @customElement('umb-dashboard-members-welcome') diff --git a/src/packages/members/member-types/workspace/member-type-workspace-editor.element.ts b/src/packages/members/member-types/workspace/member-type-workspace-editor.element.ts index e2cee65faf..5006df28c2 100644 --- a/src/packages/members/member-types/workspace/member-type-workspace-editor.element.ts +++ b/src/packages/members/member-types/workspace/member-type-workspace-editor.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/members/member-types/workspace/member-type-workspace.element.ts b/src/packages/members/member-types/workspace/member-type-workspace.element.ts index 076a6fb87b..095dc14a9a 100644 --- a/src/packages/members/member-types/workspace/member-type-workspace.element.ts +++ b/src/packages/members/member-types/workspace/member-type-workspace.element.ts @@ -1,6 +1,6 @@ import { UmbMemberTypeWorkspaceEditorElement } from './member-type-workspace-editor.element.js'; import { UmbMemberTypeWorkspaceContext } from './member-type-workspace.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbRoute } from '@umbraco-cms/backoffice/router'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/members/members/workspace/member-workspace-editor.element.ts b/src/packages/members/members/workspace/member-workspace-editor.element.ts index 459761660a..1ff638ebc6 100644 --- a/src/packages/members/members/workspace/member-workspace-editor.element.ts +++ b/src/packages/members/members/workspace/member-workspace-editor.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, LitElement, customElement } from '@umbraco-cms/backoffice/external/lit'; @customElement('umb-member-workspace-editor') diff --git a/src/packages/packages/package-builder/workspace/workspace-package-builder.element.ts b/src/packages/packages/package-builder/workspace/workspace-package-builder.element.ts index c2669f2ab3..39a109eb1e 100644 --- a/src/packages/packages/package-builder/workspace/workspace-package-builder.element.ts +++ b/src/packages/packages/package-builder/workspace/workspace-package-builder.element.ts @@ -1,11 +1,7 @@ import type { UmbInputDocumentElement } from '../../../documents/documents/components/input-document/input-document.element.js'; import type { UmbInputMediaElement } from '../../../media/media/components/input-media/input-media.element.js'; import type { UmbInputLanguagePickerElement } from '../../../settings/languages/components/input-language-picker/input-language-picker.element.js'; -import { - UUIBooleanInputEvent, - UUIInputElement, - UUIInputEvent, -} from '@umbraco-cms/backoffice/external/uui'; +import { UUIBooleanInputEvent, UUIInputElement, UUIInputEvent } from '@umbraco-cms/backoffice/external/uui'; import { css, html, @@ -70,7 +66,7 @@ export class UmbWorkspacePackageBuilderElement extends UmbLitElement { if (!this.#nameDefined()) return; const response = await tryExecuteAndNotify( this, - PackageResource.postPackageCreated({ requestBody: this._package }) + PackageResource.postPackageCreated({ requestBody: this._package }), ); if (!response.data || response.error) return; this._package = response.data as PackageDefinitionResponseModel; @@ -82,7 +78,7 @@ export class UmbWorkspacePackageBuilderElement extends UmbLitElement { if (!this._package?.id) return; const response = await tryExecuteAndNotify( this, - PackageResource.putPackageCreatedById({ id: this._package.id, requestBody: this._package }) + PackageResource.putPackageCreatedById({ id: this._package.id, requestBody: this._package }), ); if (response.error) return; diff --git a/src/packages/packages/package-repo/workspace/workspace-package.element.ts b/src/packages/packages/package-repo/workspace/workspace-package.element.ts index 9f5e3b2ce0..6ba1506a7b 100644 --- a/src/packages/packages/package-repo/workspace/workspace-package.element.ts +++ b/src/packages/packages/package-repo/workspace/workspace-package.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, LitElement, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; @customElement('umb-workspace-package') diff --git a/src/packages/packages/package-section/views/created/packages-created-overview.element.ts b/src/packages/packages/package-section/views/created/packages-created-overview.element.ts index cfd9965b0e..ab51364ed1 100644 --- a/src/packages/packages/package-section/views/created/packages-created-overview.element.ts +++ b/src/packages/packages/package-section/views/created/packages-created-overview.element.ts @@ -70,7 +70,7 @@ export class UmbPackagesCreatedOverviewElement extends UmbLitElement { ${repeat( this._createdPackages, (item) => item.id, - (item) => this.#renderPackageItem(item) + (item) => this.#renderPackageItem(item), )} `; diff --git a/src/packages/packages/package-section/views/installed/installed-packages-section-view-item.element.ts b/src/packages/packages/package-section/views/installed/installed-packages-section-view-item.element.ts index 1f1368c421..3cf99e8cb6 100644 --- a/src/packages/packages/package-section/views/installed/installed-packages-section-view-item.element.ts +++ b/src/packages/packages/package-section/views/installed/installed-packages-section-view-item.element.ts @@ -62,7 +62,7 @@ export class UmbInstalledPackagesSectionViewItemElement extends UmbLitElement { umbExtensionsRegistry.extensionsOfType('packageView').pipe( map((extensions) => { return extensions.filter((extension) => extension.meta.packageName === this.#name); - }) + }), ), (manifests) => { if (manifests.length === 0) { @@ -71,7 +71,7 @@ export class UmbInstalledPackagesSectionViewItemElement extends UmbLitElement { } this._packageView = manifests[0]; }, - '_observePackageViewExtension' + '_observePackageViewExtension', ); } @@ -89,7 +89,7 @@ export class UmbInstalledPackagesSectionViewItemElement extends UmbLitElement { this._migrationButtonState = 'waiting'; const { error } = await tryExecuteAndNotify( this, - PackageResource.postPackageByNameRunMigration({ name: this.name }) + PackageResource.postPackageByNameRunMigration({ name: this.name }), ); if (error) return; this.#notificationContext?.peek('positive', { data: { message: 'Migrations completed' } }); diff --git a/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings.element.ts b/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings.element.ts index 8b26180371..8846a82fd1 100644 --- a/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings.element.ts +++ b/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings.element.ts @@ -8,10 +8,10 @@ import { import { ManifestModal, UmbModalExtensionElement } from '@umbraco-cms/backoffice/extension-registry'; @customElement('umb-examine-fields-settings-modal') -export default class UmbExamineFieldsSettingsModalElement extends UmbModalBaseElement< - UmbExamineFieldsSettingsModalData, - UmbExamineFieldsSettingsModalValue -> implements UmbModalExtensionElement{ +export default class UmbExamineFieldsSettingsModalElement + extends UmbModalBaseElement + implements UmbModalExtensionElement +{ @state() private _fields?: UmbExamineFieldsSettingsModalData; diff --git a/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts b/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts index e0b85698f3..b8ee3e86bb 100644 --- a/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts +++ b/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts @@ -44,7 +44,7 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement { private async _getIndexData() { const { data } = await tryExecuteAndNotify( this, - IndexerResource.getIndexerByIndexName({ indexName: this.indexName }) + IndexerResource.getIndexerByIndexName({ indexName: this.indexName }), ); this._indexData = data; @@ -76,7 +76,7 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement { this._buttonState = 'waiting'; const { error } = await tryExecuteAndNotify( this, - IndexerResource.postIndexerByIndexNameRebuild({ indexName: this.indexName }) + IndexerResource.postIndexerByIndexNameRebuild({ indexName: this.indexName }), ); if (error) { this._buttonState = 'failed'; diff --git a/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts b/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts index 6bfc918485..38ea3ca2e8 100644 --- a/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts +++ b/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, nothing, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { diff --git a/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts b/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts index f80ee143c8..edd5cf127a 100644 --- a/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts +++ b/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, nothing, customElement, state, query, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbModalManagerContext, @@ -67,7 +67,7 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement { term: this._searchInput.value, take: 100, skip: 0, - }) + }), ); this._searchResults = data?.items ?? []; diff --git a/src/packages/search/manifests.ts b/src/packages/search/manifests.ts index 6e772b8731..a1bc0bfa11 100644 --- a/src/packages/search/manifests.ts +++ b/src/packages/search/manifests.ts @@ -43,4 +43,4 @@ export const manifests: Array = [ name: 'Examine Field Settings Modal', js: () => import('./examine-management-dashboard/views/modal-views/fields-settings.element.js'), }, -]; \ No newline at end of file +]; diff --git a/src/packages/search/search-modal/search-modal.element.ts b/src/packages/search/search-modal/search-modal.element.ts index 8c7ee1c69a..f7f0f2fc4e 100644 --- a/src/packages/search/search-modal/search-modal.element.ts +++ b/src/packages/search/search-modal/search-modal.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, @@ -97,7 +97,7 @@ export class UmbSearchModalElement extends LitElement { ? repeat( this._groups, (group) => group.name, - (group) => this.#renderGroup(group.name, group.items) + (group) => this.#renderGroup(group.name, group.items), ) : html`
    Only mock data for now Search for blog
    `}
    ` diff --git a/src/packages/search/umb-search-header-app.element.ts b/src/packages/search/umb-search-header-app.element.ts index a4f4d1a4ae..4c0ab780bb 100644 --- a/src/packages/search/umb-search-header-app.element.ts +++ b/src/packages/search/umb-search-header-app.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, CSSResultGroup, html, customElement } from '@umbraco-cms/backoffice/external/lit'; import { UmbModalManagerContext, UMB_MODAL_MANAGER_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/modal'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/settings/dashboards/models-builder/dashboard-models-builder.element.ts b/src/packages/settings/dashboards/models-builder/dashboard-models-builder.element.ts index c775b14110..b448af70af 100644 --- a/src/packages/settings/dashboards/models-builder/dashboard-models-builder.element.ts +++ b/src/packages/settings/dashboards/models-builder/dashboard-models-builder.element.ts @@ -170,7 +170,6 @@ export class UmbDashboardModelsBuilderElement extends UmbLitElement { ]; } - export default UmbDashboardModelsBuilderElement; declare global { diff --git a/src/packages/settings/dashboards/telemetry/dashboard-telemetry.element.ts b/src/packages/settings/dashboards/telemetry/dashboard-telemetry.element.ts index 1824c4fa1a..667a5553cc 100644 --- a/src/packages/settings/dashboards/telemetry/dashboard-telemetry.element.ts +++ b/src/packages/settings/dashboards/telemetry/dashboard-telemetry.element.ts @@ -105,7 +105,9 @@ export class UmbDashboardTelemetryElement extends UmbLitElement { render() { return html` -

    Consent for telemetry data

    +

    + Consent for telemetry data +

    ${this._renderSettingSlider()} diff --git a/src/packages/settings/extensions/workspace/extension-root-workspace.element.ts b/src/packages/settings/extensions/workspace/extension-root-workspace.element.ts index 329d69eafa..387950c4bc 100644 --- a/src/packages/settings/extensions/workspace/extension-root-workspace.element.ts +++ b/src/packages/settings/extensions/workspace/extension-root-workspace.element.ts @@ -36,13 +36,13 @@ export class UmbExtensionRootWorkspaceElement extends UmbLitElement { } // Otherwise sort by type return a.type.localeCompare(b.type); - }) - ) + }), + ), ), (extensions) => { this._extensions = extensions || undefined; }, - '_observeExtensionRegistry' + '_observeExtensionRegistry', ); } @@ -75,9 +75,7 @@ export class UmbExtensionRootWorkspaceElement extends UmbLitElement { (extension) => html` ${extension.type} - - ${extension.name} - + ${extension.name} ${extension.alias} ${extension.weight ? extension.weight : ''} @@ -90,7 +88,7 @@ export class UmbExtensionRootWorkspaceElement extends UmbLitElement { - ` + `, )} diff --git a/src/packages/settings/languages/app-language-select/app-language-select.element.ts b/src/packages/settings/languages/app-language-select/app-language-select.element.ts index 2219fef411..c91720fe29 100644 --- a/src/packages/settings/languages/app-language-select/app-language-select.element.ts +++ b/src/packages/settings/languages/app-language-select/app-language-select.element.ts @@ -1,12 +1,15 @@ import { UmbLanguageRepository } from '../repository/language.repository.js'; import { UMB_APP_LANGUAGE_CONTEXT_TOKEN, UmbAppLanguageContext } from './app-language.context.js'; -import { UUIMenuItemEvent } from '@umbraco-cms/backoffice/external/uui'; -import { css, html, customElement, state, repeat, ifDefined } from '@umbraco-cms/backoffice/external/lit'; +import { UUIMenuItemEvent, UUIPopoverContainerElement } from '@umbraco-cms/backoffice/external/uui'; +import { css, html, customElement, state, repeat, ifDefined, query } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { LanguageResponseModel } from '@umbraco-cms/backoffice/backend-api'; @customElement('umb-app-language-select') export class UmbAppLanguageSelectElement extends UmbLitElement { + @query('#dropdown-popover') + private _popoverElement?: UUIPopoverContainerElement; + @state() private _languages: Array = []; @@ -45,27 +48,21 @@ export class UmbAppLanguageSelectElement extends UmbLitElement { }); } - #onClick() { - this.#toggleDropdown(); - } - - #onClose() { - this.#closeDropdown(); - } - - #toggleDropdown() { - this._isOpen = !this._isOpen; - - // first start observing the languages when the dropdown is opened + // TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet. + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + #onPopoverToggle(event: ToggleEvent) { + this._isOpen = event.newState === 'open'; if (this._isOpen && !this.#languagesObserver) { + if (this._popoverElement) { + const host = this.getBoundingClientRect(); + this._popoverElement.style.width = `${host.width}px`; + } + this.#observeLanguages(); } } - #closeDropdown() { - this._isOpen = false; - } - #onLabelClick(event: UUIMenuItemEvent) { const menuItem = event.target; const isoCode = menuItem.dataset.isoCode; @@ -75,34 +72,39 @@ export class UmbAppLanguageSelectElement extends UmbLitElement { this.#appLanguageContext?.setLanguage(isoCode); this._isOpen = false; + + // TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet. + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + this._popoverElement?.hidePopover(); } render() { - return html` - ${this.#renderTrigger()} ${this.#renderContent()} - `; + return html`${this.#renderTrigger()} ${this.#renderContent()}`; } #renderTrigger() { - return html``; } #renderContent() { - return html`
    - ${repeat( - this._languages, - (language) => language.isoCode, - (language) => html` - - `, - )} -
    `; + return html` + + ${repeat( + this._languages, + (language) => language.isoCode, + (language) => html` + + `, + )} + + `; } static styles = [ diff --git a/src/packages/settings/languages/components/input-language-picker/input-language-picker.element.ts b/src/packages/settings/languages/components/input-language-picker/input-language-picker.element.ts index dc9581841e..dca6d7ac6e 100644 --- a/src/packages/settings/languages/components/input-language-picker/input-language-picker.element.ts +++ b/src/packages/settings/languages/components/input-language-picker/input-language-picker.element.ts @@ -79,13 +79,13 @@ export class UmbInputLanguagePickerElement extends FormControlMixin(UmbLitElemen this.addValidator( 'rangeUnderflow', () => this.minMessage, - () => !!this.min && this.#pickerContext.getSelection().length < this.min + () => !!this.min && this.#pickerContext.getSelection().length < this.min, ); this.addValidator( 'rangeOverflow', () => this.maxMessage, - () => !!this.max && this.#pickerContext.getSelection().length > this.max + () => !!this.max && this.#pickerContext.getSelection().length > this.max, ); this.observe(this.#pickerContext.selection, (selection) => (super.value = selection.join(','))); diff --git a/src/packages/settings/languages/repository/language-item.store.ts b/src/packages/settings/languages/repository/language-item.store.ts index 2a32378754..b92105c7ff 100644 --- a/src/packages/settings/languages/repository/language-item.store.ts +++ b/src/packages/settings/languages/repository/language-item.store.ts @@ -21,7 +21,7 @@ export class UmbLanguageItemStore super( host, UMB_LANGUAGE_ITEM_STORE_CONTEXT_TOKEN.toString(), - new UmbArrayState([], (x) => x.isoCode) + new UmbArrayState([], (x) => x.isoCode), ); } diff --git a/src/packages/settings/languages/repository/language.store.ts b/src/packages/settings/languages/repository/language.store.ts index 95264b06e6..007b231328 100644 --- a/src/packages/settings/languages/repository/language.store.ts +++ b/src/packages/settings/languages/repository/language.store.ts @@ -19,7 +19,7 @@ export class UmbLanguageStore extends UmbStoreBase { super( host, UMB_LANGUAGE_STORE_CONTEXT_TOKEN.toString(), - new UmbArrayState([], (x) => x.isoCode) + new UmbArrayState([], (x) => x.isoCode), ); } diff --git a/src/packages/settings/languages/repository/sources/language-item.server.data.ts b/src/packages/settings/languages/repository/sources/language-item.server.data.ts index e40479d898..9a9392e330 100644 --- a/src/packages/settings/languages/repository/sources/language-item.server.data.ts +++ b/src/packages/settings/languages/repository/sources/language-item.server.data.ts @@ -29,7 +29,7 @@ export class UmbLanguageItemServerDataSource implements UmbItemDataSource - - - + + diff --git a/src/packages/settings/languages/workspace/language-root/components/language-root-table-name-column-layout.element.ts b/src/packages/settings/languages/workspace/language-root/components/language-root-table-name-column-layout.element.ts index 83f3fd7e16..cb9bf553e2 100644 --- a/src/packages/settings/languages/workspace/language-root/components/language-root-table-name-column-layout.element.ts +++ b/src/packages/settings/languages/workspace/language-root/components/language-root-table-name-column-layout.element.ts @@ -1,4 +1,4 @@ -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, LitElement, nothing, customElement, property } from '@umbraco-cms/backoffice/external/lit'; @customElement('umb-language-root-table-name-column-layout') diff --git a/src/packages/settings/languages/workspace/language-root/language-root-workspace.element.ts b/src/packages/settings/languages/workspace/language-root/language-root-workspace.element.ts index b5bee63f7d..2b7c121a10 100644 --- a/src/packages/settings/languages/workspace/language-root/language-root-workspace.element.ts +++ b/src/packages/settings/languages/workspace/language-root/language-root-workspace.element.ts @@ -1,5 +1,5 @@ import { UmbLanguageRepository } from '../../repository/language.repository.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbTableColumn, UmbTableConfig, UmbTableItem } from '@umbraco-cms/backoffice/components'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; diff --git a/src/packages/settings/languages/workspace/language/language-workspace.element.ts b/src/packages/settings/languages/workspace/language/language-workspace.element.ts index 802f448776..184e3236bc 100644 --- a/src/packages/settings/languages/workspace/language/language-workspace.element.ts +++ b/src/packages/settings/languages/workspace/language/language-workspace.element.ts @@ -1,5 +1,5 @@ import { UmbLanguageWorkspaceContext } from './language-workspace.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import type { UmbRoute } from '@umbraco-cms/backoffice/router'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @@ -41,7 +41,7 @@ export class UmbLanguageWorkspaceElement extends UmbLitElement { new UmbWorkspaceIsNewRedirectController( this, this.#languageWorkspaceContext, - this.shadowRoot!.querySelector('umb-router-slot')! + this.shadowRoot!.querySelector('umb-router-slot')!, ); }, }, diff --git a/src/packages/settings/relation-types/repository/relation-type.store.ts b/src/packages/settings/relation-types/repository/relation-type.store.ts index c0a4f452c4..2a8b1a33e8 100644 --- a/src/packages/settings/relation-types/repository/relation-type.store.ts +++ b/src/packages/settings/relation-types/repository/relation-type.store.ts @@ -22,7 +22,7 @@ export class UmbRelationTypeStore extends UmbStoreBase { super( host, UMB_RELATION_TYPE_STORE_CONTEXT_TOKEN.toString(), - new UmbArrayState([], (x) => x.id) + new UmbArrayState([], (x) => x.id), ); } diff --git a/src/packages/settings/relation-types/workspace/relation-type-workspace.element.ts b/src/packages/settings/relation-types/workspace/relation-type-workspace.element.ts index e1a7fd468c..388ccd6dc4 100644 --- a/src/packages/settings/relation-types/workspace/relation-type-workspace.element.ts +++ b/src/packages/settings/relation-types/workspace/relation-type-workspace.element.ts @@ -1,5 +1,5 @@ import { UmbRelationTypeWorkspaceContext } from './relation-type-workspace.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbRouterSlotInitEvent, UmbRoute } from '@umbraco-cms/backoffice/router'; @@ -32,7 +32,7 @@ export class UmbRelationTypeWorkspaceElement extends UmbLitElement { new UmbWorkspaceIsNewRedirectController( this, this.#workspaceContext, - this.shadowRoot!.querySelector('umb-router-slot')! + this.shadowRoot!.querySelector('umb-router-slot')!, ); }, }, diff --git a/src/packages/tags/components/tags-input/tags-input.element.ts b/src/packages/tags/components/tags-input/tags-input.element.ts index ecef390ec2..f5600257ff 100644 --- a/src/packages/tags/components/tags-input/tags-input.element.ts +++ b/src/packages/tags/components/tags-input/tags-input.element.ts @@ -10,12 +10,7 @@ import { state, repeat, } from '@umbraco-cms/backoffice/external/lit'; -import { - FormControlMixin, - UUIInputElement, - UUIInputEvent, - UUITagElement, -} from '@umbraco-cms/backoffice/external/uui'; +import { FormControlMixin, UUIInputElement, UUIInputEvent, UUITagElement } from '@umbraco-cms/backoffice/external/uui'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { TagResponseModel } from '@umbraco-cms/backoffice/backend-api'; @@ -239,7 +234,7 @@ export class UmbTagsInputElement extends FormControlMixin(UmbLitElement) { @keydown="${(e: KeyboardEvent) => this.#optionKeydown(e, index)}" value="${tag.text}" /> `; - } + }, )}
    `; diff --git a/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.element.ts b/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.element.ts index 7007becdeb..defb1408d0 100644 --- a/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.element.ts +++ b/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.element.ts @@ -1,7 +1,7 @@ import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; /** diff --git a/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.test.ts b/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.test.ts index aefa7c2698..63b675c1c6 100644 --- a/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.test.ts +++ b/src/packages/tags/property-editors/tags/config/storage-type/property-editor-ui-tags-storage-type.test.ts @@ -6,9 +6,9 @@ describe('UmbPropertyEditorUITagsStorageTypeElement', () => { let element: UmbPropertyEditorUITagsStorageTypeElement; beforeEach(async () => { - element = await fixture( - html` ` - ); + element = await fixture(html` + + `); }); it('is defined with its own instance', () => { diff --git a/src/packages/tags/property-editors/tags/property-editor-ui-tags.element.ts b/src/packages/tags/property-editors/tags/property-editor-ui-tags.element.ts index 1e72dc3bc4..5d47f69c9c 100644 --- a/src/packages/tags/property-editors/tags/property-editor-ui-tags.element.ts +++ b/src/packages/tags/property-editors/tags/property-editor-ui-tags.element.ts @@ -1,6 +1,6 @@ import { UmbTagsInputElement } from '../../components/tags-input/tags-input.element.js'; import { html, customElement, property, state, ifDefined } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/workspace'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; diff --git a/src/packages/tags/repository/tag.store.ts b/src/packages/tags/repository/tag.store.ts index ffb00a3848..a2fd690952 100644 --- a/src/packages/tags/repository/tag.store.ts +++ b/src/packages/tags/repository/tag.store.ts @@ -43,7 +43,7 @@ export class UmbTagStore extends UmbStoreBase { items(group: TagResponseModel['group'], culture: string) { return this._data.asObservablePart((items) => - items.filter((item) => item.group === group && item.culture === culture) + items.filter((item) => item.group === group && item.culture === culture), ); } @@ -59,8 +59,8 @@ export class UmbTagStore extends UmbStoreBase { (item) => item.group === group && item.culture === culture && - item.query?.toLocaleLowerCase().includes(query.toLocaleLowerCase()) - ) + item.query?.toLocaleLowerCase().includes(query.toLocaleLowerCase()), + ), ); } diff --git a/src/packages/templating/code-editor/code-editor.element.ts b/src/packages/templating/code-editor/code-editor.element.ts index fd1750db69..17234ff0b9 100644 --- a/src/packages/templating/code-editor/code-editor.element.ts +++ b/src/packages/templating/code-editor/code-editor.element.ts @@ -99,9 +99,13 @@ export class UmbCodeEditorElement extends UmbLitElement implements UmbCodeEditor constructor() { super(); this.consumeContext(UMB_THEME_CONTEXT_TOKEN, (instance) => { - this.observe(instance.theme, (themeAlias) => { - this.theme = themeAlias ? this.#translateTheme(themeAlias) : CodeEditorTheme.Light; - }, '_observeTheme'); + this.observe( + instance.theme, + (themeAlias) => { + this.theme = themeAlias ? this.#translateTheme(themeAlias) : CodeEditorTheme.Light; + }, + '_observeTheme', + ); }); } diff --git a/src/packages/templating/code-editor/code-editor.stories.ts b/src/packages/templating/code-editor/code-editor.stories.ts index c56a254a31..eac2ec2da2 100644 --- a/src/packages/templating/code-editor/code-editor.stories.ts +++ b/src/packages/templating/code-editor/code-editor.stories.ts @@ -221,7 +221,7 @@ const [Javascript, Css, Html, Razor, Markdown, Typescript, Json]: Story[] = Obje code: codeSnippets[language as CodeEditorLanguage], }, }; - } + }, ); const Themes: Story = { diff --git a/src/packages/templating/components/insert-menu/templating-insert-menu.element.ts b/src/packages/templating/components/insert-menu/templating-insert-menu.element.ts index f5ee2eaa3f..03c9551732 100644 --- a/src/packages/templating/components/insert-menu/templating-insert-menu.element.ts +++ b/src/packages/templating/components/insert-menu/templating-insert-menu.element.ts @@ -113,28 +113,20 @@ export class UmbTemplatingInsertMenuElement extends UmbLitElement { return html` - Insert - -
      -
    • - - -
      • - -
    -     +     `; } @@ -158,34 +150,10 @@ export class UmbTemplatingInsertMenuElement extends UmbLitElement { --umb-header-layout-height: 70px; } - #insert-menu { - margin: 0; - padding: 0; - margin-top: var(--uui-size-space-3); - background-color: var(--uui-color-surface); - box-shadow: var(--uui-shadow-depth-3); - min-width: 150px; - } - - #insert-menu > li, - ul { - padding: 0; - width: 100%; - list-style: none; - } - - ul { - transform: translateX(-100px); - } - .insert-menu-item { width: 100%; } - umb-button-with-dropdown { - --umb-button-with-dropdown-symbol-expand-margin-left: 0; - } - uui-icon[name='icon-add'] { margin-right: var(--uui-size-4); } diff --git a/src/packages/templating/modals/insert-section-modal/insert-section-input.element.ts b/src/packages/templating/modals/insert-section-modal/insert-section-input.element.ts index 6288dadb9f..427ac228f4 100644 --- a/src/packages/templating/modals/insert-section-modal/insert-section-input.element.ts +++ b/src/packages/templating/modals/insert-section-modal/insert-section-input.element.ts @@ -55,7 +55,9 @@ export class UmbInsertSectionCheckboxElement extends UUIBooleanInputElement { render() { return html` ${super.render()} -

    ${this.checked ? html`` : ''}${this.label}

    +

    + ${this.checked ? html`` : ''}${this.label} +

    here goes some description
    diff --git a/src/packages/templating/partial-views/workspace/partial-view-workspace.element.ts b/src/packages/templating/partial-views/workspace/partial-view-workspace.element.ts index b446ab3943..338cbfa693 100644 --- a/src/packages/templating/partial-views/workspace/partial-view-workspace.element.ts +++ b/src/packages/templating/partial-views/workspace/partial-view-workspace.element.ts @@ -1,5 +1,5 @@ import { UmbPartialViewWorkspaceContext } from './partial-view-workspace.context.js'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbRoute, IRoutingInfo, PageComponent } from '@umbraco-cms/backoffice/router'; @@ -29,7 +29,7 @@ export class UmbPartialViewWorkspaceElement extends UmbLitElement { new UmbWorkspaceIsNewRedirectController( this, this.#partialViewWorkspaceContext, - this.shadowRoot!.querySelector('umb-router-slot')! + this.shadowRoot!.querySelector('umb-router-slot')!, ); }, }, diff --git a/src/packages/templating/templates/components/template-card/template-card.stories.ts b/src/packages/templating/templates/components/template-card/template-card.stories.ts index 6e7bb30ba4..2ef5daf227 100644 --- a/src/packages/templating/templates/components/template-card/template-card.stories.ts +++ b/src/packages/templating/templates/components/template-card/template-card.stories.ts @@ -30,11 +30,12 @@ export const LongName: Story = { }; export const TemplateCardList: Story = { - render: () => html`
    - - - - -
    `, + render: () => + html`
    + + + + +
    `, }; diff --git a/src/packages/templating/templates/modals/query-builder/query-builder-filter.element.ts b/src/packages/templating/templates/modals/query-builder/query-builder-filter.element.ts index fa5d3d9f42..9c93d992ae 100644 --- a/src/packages/templating/templates/modals/query-builder/query-builder-filter.element.ts +++ b/src/packages/templating/templates/modals/query-builder/query-builder-filter.element.ts @@ -1,13 +1,5 @@ import { type UUIComboboxListElement } from '@umbraco-cms/backoffice/external/uui'; -import { - PropertyValueMap, - css, - html, - customElement, - property, - query, - state, -} from '@umbraco-cms/backoffice/external/lit'; +import { PropertyValueMap, css, html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { OperatorModel, @@ -15,16 +7,9 @@ import { TemplateQueryPropertyTypeModel, TemplateQuerySettingsResponseModel, } from '@umbraco-cms/backoffice/backend-api'; -import { UmbButtonWithDropdownElement } from '@umbraco-cms/backoffice/components'; @customElement('umb-query-builder-filter') export class UmbQueryBuilderFilterElement extends UmbLitElement { - @query('#property-alias-dropdown') - private _propertyAliasDropdown?: UmbButtonWithDropdownElement; - - @query('#operator-dropdown') - private _operatorDropdown?: UmbButtonWithDropdownElement; - @property({ type: Object, attribute: false }) filter: TemplateQueryExecuteFilterPresentationModel = {}; @@ -44,7 +29,6 @@ export class UmbQueryBuilderFilterElement extends UmbLitElement { this.currentPropertyType = this.settings?.properties?.find((p) => p.alias === this.filter.propertyAlias)?.type ?? null; if (oldCurrentPropertyType !== this.currentPropertyType) this.#resetOperator(); - this._propertyAliasDropdown?.closePopover(); }; #setConstrainValue = (e: Event) => { @@ -55,7 +39,6 @@ export class UmbQueryBuilderFilterElement extends UmbLitElement { #setOperator = (e: Event) => { const target = e.target as UUIComboboxListElement; this.filter = { ...this.filter, operator: target.value as OperatorModel }; - this._operatorDropdown?.closePopover(); }; #resetOperator() { @@ -88,9 +71,9 @@ export class UmbQueryBuilderFilterElement extends UmbLitElement { } private _renderOperatorsDropdown() { - return html` - ${this.filter?.operator ?? ''} - + return html` + ${this.filter?.operator ?? ''} + ${this.settings?.operators ?.filter((operator) => this.currentPropertyType ? operator.applicableTypes?.includes(this.currentPropertyType) : true, @@ -102,7 +85,7 @@ export class UmbQueryBuilderFilterElement extends UmbLitElement { >`, )} - `; + `; } private _renderConstraintValueInput() { @@ -121,16 +104,16 @@ export class UmbQueryBuilderFilterElement extends UmbLitElement { render() { return html` ${this.unremovable ? this.localize.term('template_where') : this.localize.term('template_and')} - ${this.filter?.propertyAlias ?? ''} - + + ${this.filter?.propertyAlias ?? ''} + ${this.settings?.properties?.map( (property) => - html` - ${property.alias} - `, + html`${property.alias}`, )} - ${this.filter?.propertyAlias ? this._renderOperatorsDropdown() : ''} ${this.filter?.operator ? this._renderConstraintValueInput() : ''} @@ -155,14 +138,9 @@ export class UmbQueryBuilderFilterElement extends UmbLitElement { padding: 20px 0; } - .options-list { - min-width: 25ch; - background-color: var(--uui-color-surface); - box-shadow: var(--uui-shadow-depth-3); - } - uui-combobox-list-option { padding: 8px 20px; + margin: 0; } `, ]; diff --git a/src/packages/templating/templates/modals/query-builder/query-builder.element.ts b/src/packages/templating/templates/modals/query-builder/query-builder.element.ts index f1f6580774..3782f1dc5e 100644 --- a/src/packages/templating/templates/modals/query-builder/query-builder.element.ts +++ b/src/packages/templating/templates/modals/query-builder/query-builder.element.ts @@ -14,7 +14,6 @@ import { TemplateQuerySettingsResponseModel, } from '@umbraco-cms/backoffice/backend-api'; import { UmbDocumentRepository } from '@umbraco-cms/backoffice/document'; -import { UmbButtonWithDropdownElement } from '@umbraco-cms/backoffice/components'; import './query-builder-filter.element.js'; export interface TemplateQueryBuilderModalData { @@ -35,12 +34,6 @@ export default class UmbChooseInsertTypeModalElement extends UmbModalBaseElement TemplateQueryBuilderModalData, UmbTemplateQueryBuilderModalValue > { - @query('#content-type-dropdown') - private _contentTypeDropdown?: UmbButtonWithDropdownElement; - - @query('#sort-dropdown') - private _sortDropdown?: UmbButtonWithDropdownElement; - @query('#filter-container') private _filterContainer?: HTMLElement; @@ -148,7 +141,6 @@ export default class UmbChooseInsertTypeModalElement extends UmbModalBaseElement #setContentType(event: Event) { const target = event.target as UUIComboboxListElement; this.#updateQueryRequest({ contentTypeAlias: (target.value as string) ?? '' }); - this._contentTypeDropdown!.closePopover(); } #setSortProperty(event: Event) { @@ -159,7 +151,6 @@ export default class UmbChooseInsertTypeModalElement extends UmbModalBaseElement this.#updateQueryRequest({ sort: { ...this._queryRequest.sort, propertyAlias: (target.value as string) ?? '' }, }); - this._sortDropdown!.closePopover(); } #setSortDirection() { @@ -200,9 +191,9 @@ export default class UmbChooseInsertTypeModalElement extends UmbModalBaseElement
    I want - ${this._queryRequest?.contentTypeAlias ?? 'all content'} - + + ${this._queryRequest?.contentTypeAlias ?? 'all content'} + all content ${this._queryBuilderSettings?.contentTypeAliases?.map( (alias) => @@ -210,7 +201,7 @@ export default class UmbChooseInsertTypeModalElement extends UmbModalBaseElement >content of type "${alias}"`, )} - from
    ordered by - ${this._queryRequest.sort?.propertyAlias ?? ''} - + + ${this._queryRequest.sort?.propertyAlias ?? ''} + ${this._queryBuilderSettings?.properties?.map( (property) => html`${property.alias}`, )} - ${this._queryRequest.sort?.propertyAlias @@ -279,14 +270,9 @@ export default class UmbChooseInsertTypeModalElement extends UmbModalBaseElement ); } - .options-list { - min-width: 30ch; - background-color: var(--uui-color-surface); - box-shadow: var(--uui-shadow-depth-3); - } - uui-combobox-list-option { padding: 8px 20px; + margin: 0; } .row { diff --git a/src/packages/templating/templates/repository/sources/template.item.server.data.ts b/src/packages/templating/templates/repository/sources/template.item.server.data.ts index bef722d4f9..319979677a 100644 --- a/src/packages/templating/templates/repository/sources/template.item.server.data.ts +++ b/src/packages/templating/templates/repository/sources/template.item.server.data.ts @@ -33,7 +33,7 @@ export class UmbTemplateItemServerDataSource implements UmbItemDataSource { - this._history = history; - }, 'umbCurrentUserHistoryObserver'); + this.observe( + this.#currentUserHistoryStore.latestHistory, + (history) => { + this._history = history; + }, + 'umbCurrentUserHistoryObserver', + ); } } diff --git a/src/packages/user/current-user/user-profile-apps/user-profile-app-themes.element.ts b/src/packages/user/current-user/user-profile-apps/user-profile-app-themes.element.ts index 1606a0b8bb..0700f90bb9 100644 --- a/src/packages/user/current-user/user-profile-apps/user-profile-app-themes.element.ts +++ b/src/packages/user/current-user/user-profile-apps/user-profile-app-themes.element.ts @@ -18,13 +18,21 @@ export class UmbUserProfileAppThemesElement extends UmbLitElement { super(); this.consumeContext(UMB_THEME_CONTEXT_TOKEN, (context) => { this.#themeContext = context; - this.observe(context.theme, (themeAlias) => { - this._themeAlias = themeAlias; - }, '_observeCurrentTheme'); + this.observe( + context.theme, + (themeAlias) => { + this._themeAlias = themeAlias; + }, + '_observeCurrentTheme', + ); - this.observe(umbExtensionsRegistry.extensionsOfType('theme'), (themes) => { - this._themes = themes; - }, '_observeThemeExtensions'); + this.observe( + umbExtensionsRegistry.extensionsOfType('theme'), + (themes) => { + this._themes = themes; + }, + '_observeThemeExtensions', + ); }); } diff --git a/src/packages/user/user-group/collection/components/user-group-table-sections-column-layout.element.ts b/src/packages/user/user-group/collection/components/user-group-table-sections-column-layout.element.ts index 234492f9b8..b49b2f22a8 100644 --- a/src/packages/user/user-group/collection/components/user-group-table-sections-column-layout.element.ts +++ b/src/packages/user/user-group/collection/components/user-group-table-sections-column-layout.element.ts @@ -21,9 +21,13 @@ export class UmbUserGroupTableSectionsColumnLayoutElement extends UmbLitElement } private observeSectionNames() { - this.observe(umbExtensionsRegistry.extensionsOfType('section'), (sections) => { - this._sectionsNames = sections.filter((x) => this.value.includes(x.alias)).map((x) => x.meta.label || x.name); - }, 'umbUserGroupTableSectionsColumnLayoutObserver'); + this.observe( + umbExtensionsRegistry.extensionsOfType('section'), + (sections) => { + this._sectionsNames = sections.filter((x) => this.value.includes(x.alias)).map((x) => x.meta.label || x.name); + }, + 'umbUserGroupTableSectionsColumnLayoutObserver', + ); } render() { diff --git a/src/packages/user/user-group/repository/user-group-item.store.ts b/src/packages/user/user-group/repository/user-group-item.store.ts index 248faf4873..4b8731794d 100644 --- a/src/packages/user/user-group/repository/user-group-item.store.ts +++ b/src/packages/user/user-group/repository/user-group-item.store.ts @@ -24,7 +24,7 @@ export class UmbUserGroupItemStore super( host, UMB_USER_GROUP_ITEM_STORE_CONTEXT_TOKEN.toString(), - new UmbArrayState([], (x) => x.id) + new UmbArrayState([], (x) => x.id), ); } @@ -34,5 +34,5 @@ export class UmbUserGroupItemStore } export const UMB_USER_GROUP_ITEM_STORE_CONTEXT_TOKEN = new UmbContextToken( - 'UmbUserGroupItemStore' + 'UmbUserGroupItemStore', ); diff --git a/src/packages/user/user-group/workspace/actions/workspace-action-user-group-save.element.ts b/src/packages/user/user-group/workspace/actions/workspace-action-user-group-save.element.ts index ba39d589e1..a973312255 100644 --- a/src/packages/user/user-group/workspace/actions/workspace-action-user-group-save.element.ts +++ b/src/packages/user/user-group/workspace/actions/workspace-action-user-group-save.element.ts @@ -1,6 +1,6 @@ import { UMB_USER_WORKSPACE_CONTEXT } from '../../../user/workspace/user-workspace.context.js'; import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from "@umbraco-cms/backoffice/style"; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import type { UUIButtonState } from '@umbraco-cms/backoffice/external/uui'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; @customElement('umb-workspace-action-user-group-save') diff --git a/src/packages/user/user-group/workspace/components/user-group-default-permission-list.element.ts b/src/packages/user/user-group/workspace/components/user-group-default-permission-list.element.ts index 9f85fcfaca..271b089fde 100644 --- a/src/packages/user/user-group/workspace/components/user-group-default-permission-list.element.ts +++ b/src/packages/user/user-group/workspace/components/user-group-default-permission-list.element.ts @@ -25,15 +25,19 @@ export class UmbUserGroupDefaultPermissionListElement extends UmbLitElement { this.observe( this.#userGroupWorkspaceContext.data, (userGroup) => (this._userGroupDefaultPermissions = userGroup?.permissions), - 'umbUserGroupPermissionsObserver' + 'umbUserGroupPermissionsObserver', ); }); } #observeUserPermissions() { - this.observe(umbExtensionsRegistry.extensionsOfType('userPermission'), (userPermissionManifests) => { - this._entityTypes = [...new Set(userPermissionManifests.map((manifest) => manifest.meta.entityType))]; - }, 'umbUserPermissionsObserver'); + this.observe( + umbExtensionsRegistry.extensionsOfType('userPermission'), + (userPermissionManifests) => { + this._entityTypes = [...new Set(userPermissionManifests.map((manifest) => manifest.meta.entityType))]; + }, + 'umbUserPermissionsObserver', + ); } #onSelectedUserPermission(event: UmbSelectionChangeEvent) { diff --git a/src/packages/user/user/collection/user-collection-header.element.ts b/src/packages/user/user/collection/user-collection-header.element.ts index a5bfce4cb4..9dd8721a88 100644 --- a/src/packages/user/user/collection/user-collection-header.element.ts +++ b/src/packages/user/user/collection/user-collection-header.element.ts @@ -156,7 +156,7 @@ export class UmbUserCollectionHeaderElement extends UmbLitElement { : ${this.#getStatusFilterLabel()} - +
    ${this._stateFilterOptions.map( @@ -178,7 +178,7 @@ export class UmbUserCollectionHeaderElement extends UmbLitElement { : ${this.#getUserGroupFilterLabel()} - +
    ${repeat( diff --git a/src/packages/user/user/components/user-input/user-input.element.ts b/src/packages/user/user/components/user-input/user-input.element.ts index e73ca89b3a..74d25d8799 100644 --- a/src/packages/user/user/components/user-input/user-input.element.ts +++ b/src/packages/user/user/components/user-input/user-input.element.ts @@ -85,8 +85,16 @@ export class UmbUserInputElement extends FormControlMixin(UmbLitElement) { () => !!this.max && this.#pickerContext.getSelection().length > this.max, ); - this.observe(this.#pickerContext.selection, (selection) => (super.value = selection.join(',')), 'umbUserInputSelectionObserver'); - this.observe(this.#pickerContext.selectedItems, (selectedItems) => (this._items = selectedItems), 'umbUserInputItemsObserver'); + this.observe( + this.#pickerContext.selection, + (selection) => (super.value = selection.join(',')), + 'umbUserInputSelectionObserver', + ); + this.observe( + this.#pickerContext.selectedItems, + (selectedItems) => (this._items = selectedItems), + 'umbUserInputItemsObserver', + ); } protected getFormElement() { diff --git a/src/packages/user/user/modals/create/user-create-success-modal.element.ts b/src/packages/user/user/modals/create/user-create-success-modal.element.ts index 9012a70162..6b9f3ef9d3 100644 --- a/src/packages/user/user/modals/create/user-create-success-modal.element.ts +++ b/src/packages/user/user/modals/create/user-create-success-modal.element.ts @@ -83,18 +83,9 @@ export class UmbUserCreateSuccessModalElement extends UmbModalBaseElement< - + - + `; } diff --git a/src/packages/user/user/repository/item/user-item.server.data-source.ts b/src/packages/user/user/repository/item/user-item.server.data-source.ts index 962de974f6..fb53ae89d4 100644 --- a/src/packages/user/user/repository/item/user-item.server.data-source.ts +++ b/src/packages/user/user/repository/item/user-item.server.data-source.ts @@ -1,5 +1,5 @@ import type { UmbItemDataSource } from '@umbraco-cms/backoffice/repository'; -import type { UmbControllerHost} from '@umbraco-cms/backoffice/controller-api'; +import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; import { tryExecuteAndNotify } from '@umbraco-cms/backoffice/resources'; import { UserItemResponseModel, UserResource } from '@umbraco-cms/backoffice/backend-api'; @@ -34,7 +34,7 @@ export class UmbUserItemServerDataSource implements UmbItemDataSource +export const getDisplayStateFromUserStatus = (status?: UserStateModel): DisplayStatus => userStates - .filter(state => state.key === status)! - .map(state => ({ + .filter((state) => state.key === status)! + .map((state) => ({ ...state, - key:'state'+state.key - }))[0] + key: 'state' + state.key, + }))[0]; diff --git a/src/shared/icon-registry/icon.stories.ts b/src/shared/icon-registry/icon.stories.ts index ccc11684db..5f9aa40124 100644 --- a/src/shared/icon-registry/icon.stories.ts +++ b/src/shared/icon-registry/icon.stories.ts @@ -31,7 +31,7 @@ const Template: Story = () => { height: 100%;"> ${icon.name} -
    ` +
    `, )}
    `; diff --git a/src/shared/resources/tryExecuteAndNotify.function.ts b/src/shared/resources/tryExecuteAndNotify.function.ts index 230be1ba43..47cfeea27a 100644 --- a/src/shared/resources/tryExecuteAndNotify.function.ts +++ b/src/shared/resources/tryExecuteAndNotify.function.ts @@ -6,7 +6,7 @@ import type { UmbNotificationOptions } from '@umbraco-cms/backoffice/notificatio export function tryExecuteAndNotify( host: UmbControllerHost, resource: Promise, - options?: UmbNotificationOptions + options?: UmbNotificationOptions, ) { return new UmbResourceController(host, resource).tryExecuteAndNotify(options); } diff --git a/src/shared/router/generate-route-path-builder.function.ts b/src/shared/router/generate-route-path-builder.function.ts index 0f276f4d48..b2fbf53067 100644 --- a/src/shared/router/generate-route-path-builder.function.ts +++ b/src/shared/router/generate-route-path-builder.function.ts @@ -12,7 +12,7 @@ export function createRoutePathBuilder(path: string) { ? path.replace(PARAM_IDENTIFIER, (substring: string, ...args: string[]) => { return params[args[0]].toString(); }) - : path + : path, ) + '/' ); diff --git a/src/shared/style/text-style.style.ts b/src/shared/style/text-style.style.ts index 136cff61ac..ae658b0472 100644 --- a/src/shared/style/text-style.style.ts +++ b/src/shared/style/text-style.style.ts @@ -1,15 +1,14 @@ -import { UUITextStyles } from "@umbraco-cms/backoffice/external/uui"; -import { css } from "@umbraco-cms/backoffice/external/lit"; - +import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui'; +import { css } from '@umbraco-cms/backoffice/external/lit'; export const UmbTextStyles = css` ${UUITextStyles} - a { + a { color: var(--uui-color-interactive); } a:hover, a:focus { color: var(--uui-color-interactive-emphasis); } -` +`; diff --git a/src/shared/utils/component-has-manifest-property.function.ts b/src/shared/utils/component-has-manifest-property.function.ts index 414e3d81ae..95bb4c05eb 100644 --- a/src/shared/utils/component-has-manifest-property.function.ts +++ b/src/shared/utils/component-has-manifest-property.function.ts @@ -1,7 +1,7 @@ import { ManifestBase } from '@umbraco-cms/backoffice/extension-api'; export function componentHasManifestProperty( - component: HTMLElement + component: HTMLElement, ): component is HTMLElement & { manifest: ManifestBase } { return component ? 'manifest' in component : false; } diff --git a/src/shared/utils/pagination-manager/pagination.manager.test.ts b/src/shared/utils/pagination-manager/pagination.manager.test.ts index 6b35c1bc8d..b18c0c2d30 100644 --- a/src/shared/utils/pagination-manager/pagination.manager.test.ts +++ b/src/shared/utils/pagination-manager/pagination.manager.test.ts @@ -1,15 +1,15 @@ import { expect, oneEvent } from '@open-wc/testing'; import { UmbPaginationManager } from './pagination.manager.js'; import { Observable } from '@umbraco-cms/backoffice/external/rxjs'; -import { UmbChangeEvent } from '@umbraco-cms/backoffice/event' +import { UmbChangeEvent } from '@umbraco-cms/backoffice/event'; describe('UmbPaginationManager', () => { let manager: UmbPaginationManager; beforeEach(() => { manager = new UmbPaginationManager(); - manager.setPageSize(10); - manager.setTotalItems(100); + manager.setPageSize(10); + manager.setTotalItems(100); }); describe('Public API', () => { @@ -18,150 +18,154 @@ describe('UmbPaginationManager', () => { expect(manager).to.have.property('pageSize').to.be.an.instanceOf(Observable); }); - it('has a totalItems property', () => { + it('has a totalItems property', () => { expect(manager).to.have.property('totalItems').to.be.an.instanceOf(Observable); }); - it('has a currentPage property', () => { + it('has a currentPage property', () => { expect(manager).to.have.property('currentPage').to.be.an.instanceOf(Observable); }); - it('has a skip property', () => { + it('has a skip property', () => { expect(manager).to.have.property('skip').to.be.an.instanceOf(Observable); }); }); - + describe('methods', () => { it('has a setPageSize method', () => { expect(manager).to.have.property('setPageSize').that.is.a('function'); }); - it('has a getPageSize method', () => { + it('has a getPageSize method', () => { expect(manager).to.have.property('getPageSize').that.is.a('function'); }); - it('has a getTotalItems method', () => { + it('has a getTotalItems method', () => { expect(manager).to.have.property('getTotalItems').that.is.a('function'); }); - it('has a getTotalPages method', () => { + it('has a getTotalPages method', () => { expect(manager).to.have.property('getTotalPages').that.is.a('function'); }); - it('has a getCurrentPageNumber method', () => { + it('has a getCurrentPageNumber method', () => { expect(manager).to.have.property('getCurrentPageNumber').that.is.a('function'); }); - it('has a setCurrentPageNumber method', () => { + it('has a setCurrentPageNumber method', () => { expect(manager).to.have.property('setCurrentPageNumber').that.is.a('function'); }); - it('has a getSkip method', () => { + it('has a getSkip method', () => { expect(manager).to.have.property('getSkip').that.is.a('function'); }); }); }); - describe('Page Size', () => { - it('sets and gets the pageSize value', () => { - manager.setPageSize(5); - expect(manager.getPageSize()).to.equal(5); - }); - - it('updates the observable', (done) => { - manager.setPageSize(2); - - manager.pageSize.subscribe((value) => { - expect(value).to.equal(2); - done(); - }) - .unsubscribe(); - }); - }); - - describe('Total Items', () => { - it('sets and gets the totalItems value', () => { - manager.setTotalItems(200); - expect(manager.getTotalItems()).to.equal(200); - }); - - it('updates the observable', (done) => { - manager.totalItems.subscribe((value) => { - expect(value).to.equal(100); - done(); - }) - .unsubscribe(); - }); - - it('recalculates the total pages', () => { - expect(manager.getTotalPages()).to.equal(10); - }); - - it('it fall backs to the last page number if the totalPages is less than the currentPage', () => { - manager.setCurrentPageNumber(10); - manager.setTotalItems(20); - expect(manager.getCurrentPageNumber()).to.equal(2); - }); - }); - - describe('Current Page', () => { - it('sets and gets the currentPage value', () => { - manager.setCurrentPageNumber(2); - expect(manager.getCurrentPageNumber()).to.equal(2); - }); - - it ('cant be set to a value less than 1', () => { - manager.setCurrentPageNumber(0); - expect(manager.getCurrentPageNumber()).to.equal(1); - }); - - it ('cant be set to a value greater than the total pages', () => { - manager.setPageSize(1); - manager.setTotalItems(2); - manager.setCurrentPageNumber(10); - expect(manager.getCurrentPageNumber()).to.equal(2); - }); - - it('updates the observable', (done) => { - manager.setCurrentPageNumber(2); - - manager.currentPage.subscribe((value) => { - expect(value).to.equal(2); - done(); - }) - .unsubscribe(); - }); - - it('updates the skip value', () => { - manager.setCurrentPageNumber(5); - expect(manager.getSkip()).to.equal(40); - }); - - it('dispatches a change event', async () => { - const listener = oneEvent(manager, UmbChangeEvent.TYPE); - manager.setCurrentPageNumber(2); - const event = (await listener) as unknown as UmbChangeEvent; - const target = event.target as UmbPaginationManager; - expect(event).to.exist; - expect(event.type).to.equal(UmbChangeEvent.TYPE); - expect(target.getCurrentPageNumber()).to.equal(2); - }); - }); - - describe('Skip', () => { - it('gets the skip value', () => { - manager.setCurrentPageNumber(5); - expect(manager.getSkip()).to.equal(40); - }); - - it('updates the observable', (done) => { - manager.setCurrentPageNumber(5); - - manager.skip.subscribe((value) => { - expect(value).to.equal(40); - done(); - }) - .unsubscribe(); - }); - }); + describe('Page Size', () => { + it('sets and gets the pageSize value', () => { + manager.setPageSize(5); + expect(manager.getPageSize()).to.equal(5); + }); + + it('updates the observable', (done) => { + manager.setPageSize(2); + + manager.pageSize + .subscribe((value) => { + expect(value).to.equal(2); + done(); + }) + .unsubscribe(); + }); + }); + + describe('Total Items', () => { + it('sets and gets the totalItems value', () => { + manager.setTotalItems(200); + expect(manager.getTotalItems()).to.equal(200); + }); + + it('updates the observable', (done) => { + manager.totalItems + .subscribe((value) => { + expect(value).to.equal(100); + done(); + }) + .unsubscribe(); + }); + + it('recalculates the total pages', () => { + expect(manager.getTotalPages()).to.equal(10); + }); + + it('it fall backs to the last page number if the totalPages is less than the currentPage', () => { + manager.setCurrentPageNumber(10); + manager.setTotalItems(20); + expect(manager.getCurrentPageNumber()).to.equal(2); + }); + }); + + describe('Current Page', () => { + it('sets and gets the currentPage value', () => { + manager.setCurrentPageNumber(2); + expect(manager.getCurrentPageNumber()).to.equal(2); + }); + + it('cant be set to a value less than 1', () => { + manager.setCurrentPageNumber(0); + expect(manager.getCurrentPageNumber()).to.equal(1); + }); + + it('cant be set to a value greater than the total pages', () => { + manager.setPageSize(1); + manager.setTotalItems(2); + manager.setCurrentPageNumber(10); + expect(manager.getCurrentPageNumber()).to.equal(2); + }); + + it('updates the observable', (done) => { + manager.setCurrentPageNumber(2); + + manager.currentPage + .subscribe((value) => { + expect(value).to.equal(2); + done(); + }) + .unsubscribe(); + }); + + it('updates the skip value', () => { + manager.setCurrentPageNumber(5); + expect(manager.getSkip()).to.equal(40); + }); + + it('dispatches a change event', async () => { + const listener = oneEvent(manager, UmbChangeEvent.TYPE); + manager.setCurrentPageNumber(2); + const event = (await listener) as unknown as UmbChangeEvent; + const target = event.target as UmbPaginationManager; + expect(event).to.exist; + expect(event.type).to.equal(UmbChangeEvent.TYPE); + expect(target.getCurrentPageNumber()).to.equal(2); + }); + }); + + describe('Skip', () => { + it('gets the skip value', () => { + manager.setCurrentPageNumber(5); + expect(manager.getSkip()).to.equal(40); + }); + + it('updates the observable', (done) => { + manager.setCurrentPageNumber(5); + + manager.skip + .subscribe((value) => { + expect(value).to.equal(40); + done(); + }) + .unsubscribe(); + }); + }); }); diff --git a/src/shared/utils/pagination-manager/pagination.manager.ts b/src/shared/utils/pagination-manager/pagination.manager.ts index 5e23a1c8a3..c72384ff88 100644 --- a/src/shared/utils/pagination-manager/pagination.manager.ts +++ b/src/shared/utils/pagination-manager/pagination.manager.ts @@ -1,124 +1,123 @@ -import { UmbChangeEvent } from "@umbraco-cms/backoffice/event"; -import { UmbNumberState } from "@umbraco-cms/backoffice/observable-api"; +import { UmbChangeEvent } from '@umbraco-cms/backoffice/event'; +import { UmbNumberState } from '@umbraco-cms/backoffice/observable-api'; export class UmbPaginationManager extends EventTarget { + #pageSize = new UmbNumberState(10); + public readonly pageSize = this.#pageSize.asObservable(); - #pageSize = new UmbNumberState(10); - public readonly pageSize = this.#pageSize.asObservable(); + #totalItems = new UmbNumberState(0); + public readonly totalItems = this.#totalItems.asObservable(); - #totalItems = new UmbNumberState(0); - public readonly totalItems = this.#totalItems.asObservable(); - - #totalPages = new UmbNumberState(0); + #totalPages = new UmbNumberState(0); public readonly totalPages = this.#totalPages.asObservable(); #currentPage = new UmbNumberState(1); public readonly currentPage = this.#currentPage.asObservable(); - #skip = new UmbNumberState(0); - public readonly skip = this.#skip.asObservable(); - - /** - * Sets the number of items per page and recalculates the total number of pages - * @param {number} pageSize - * @memberof UmbPaginationManager - */ - public setPageSize(pageSize: number) { - this.#pageSize.next(pageSize); - this.#calculateTotalPages(); - } - - /** - * Gets the number of items per page - * @return {number} - * @memberof UmbPaginationManager - */ - public getPageSize() { - return this.#pageSize.getValue(); - } - - /** - * Gets the total number of items - * @return {number} - * @memberof UmbPaginationManager - */ - public getTotalItems() { - return this.#totalItems.getValue(); - } - - /** - * Sets the total number of items and recalculates the total number of pages - * @param {number} totalItems - * @memberof UmbPaginationManager - */ - public setTotalItems(totalItems: number) { - this.#totalItems.next(totalItems); - this.#calculateTotalPages(); - } - - /** - * Gets the total number of pages - * @return {number} - * @memberof UmbPaginationManager - */ - public getTotalPages() { - return this.#totalPages.getValue(); - } - - /** - * Gets the current page number - * @return {number} - * @memberof UmbPaginationManager - */ - public getCurrentPageNumber() { - return this.#currentPage.getValue(); - } - - /** - * Sets the current page number - * @param {number} pageNumber - * @memberof UmbPaginationManager - */ - public setCurrentPageNumber(pageNumber: number) { - if (pageNumber < 1) { - pageNumber = 1; - } - - if (pageNumber > this.#totalPages.getValue()) { - pageNumber = this.#totalPages.getValue(); - } - - this.#currentPage.next(pageNumber); - this.#calculateSkip(); - this.dispatchEvent(new UmbChangeEvent()); + #skip = new UmbNumberState(0); + public readonly skip = this.#skip.asObservable(); + + /** + * Sets the number of items per page and recalculates the total number of pages + * @param {number} pageSize + * @memberof UmbPaginationManager + */ + public setPageSize(pageSize: number) { + this.#pageSize.next(pageSize); + this.#calculateTotalPages(); + } + + /** + * Gets the number of items per page + * @return {number} + * @memberof UmbPaginationManager + */ + public getPageSize() { + return this.#pageSize.getValue(); + } + + /** + * Gets the total number of items + * @return {number} + * @memberof UmbPaginationManager + */ + public getTotalItems() { + return this.#totalItems.getValue(); } - /** - * Gets the number of items to skip - * @return {number} - * @memberof UmbPaginationManager - */ - public getSkip() { - return this.#skip.getValue(); - } - - /** - * Calculates the total number of pages - * @memberof UmbPaginationManager - */ - #calculateTotalPages() { - const totalPages = Math.ceil(this.#totalItems.getValue() / this.#pageSize.getValue()); - this.#totalPages.next(totalPages); - - /* If we currently are on a page higher than the total pages. We need to reset the current page to the last page. + /** + * Sets the total number of items and recalculates the total number of pages + * @param {number} totalItems + * @memberof UmbPaginationManager + */ + public setTotalItems(totalItems: number) { + this.#totalItems.next(totalItems); + this.#calculateTotalPages(); + } + + /** + * Gets the total number of pages + * @return {number} + * @memberof UmbPaginationManager + */ + public getTotalPages() { + return this.#totalPages.getValue(); + } + + /** + * Gets the current page number + * @return {number} + * @memberof UmbPaginationManager + */ + public getCurrentPageNumber() { + return this.#currentPage.getValue(); + } + + /** + * Sets the current page number + * @param {number} pageNumber + * @memberof UmbPaginationManager + */ + public setCurrentPageNumber(pageNumber: number) { + if (pageNumber < 1) { + pageNumber = 1; + } + + if (pageNumber > this.#totalPages.getValue()) { + pageNumber = this.#totalPages.getValue(); + } + + this.#currentPage.next(pageNumber); + this.#calculateSkip(); + this.dispatchEvent(new UmbChangeEvent()); + } + + /** + * Gets the number of items to skip + * @return {number} + * @memberof UmbPaginationManager + */ + public getSkip() { + return this.#skip.getValue(); + } + + /** + * Calculates the total number of pages + * @memberof UmbPaginationManager + */ + #calculateTotalPages() { + const totalPages = Math.ceil(this.#totalItems.getValue() / this.#pageSize.getValue()); + this.#totalPages.next(totalPages); + + /* If we currently are on a page higher than the total pages. We need to reset the current page to the last page. This can happen if we have a filter that returns less items than the current page size. */ - if (this.getCurrentPageNumber() > totalPages) { - this.setCurrentPageNumber(totalPages); - } - } - - #calculateSkip() { - const skip = (this.#currentPage.getValue() - 1) * this.#pageSize.getValue(); - this.#skip.next(skip); - } -} \ No newline at end of file + if (this.getCurrentPageNumber() > totalPages) { + this.setCurrentPageNumber(totalPages); + } + } + + #calculateSkip() { + const skip = (this.#currentPage.getValue() - 1) * this.#pageSize.getValue(); + this.#skip.next(skip); + } +} diff --git a/src/shared/utils/udi-service.ts b/src/shared/utils/udi-service.ts index ae4f84fdc8..a943c6b452 100644 --- a/src/shared/utils/udi-service.ts +++ b/src/shared/utils/udi-service.ts @@ -18,6 +18,6 @@ export function getKeyFromUdi(udi: string) { return `${withoutHost.substring(0, 8)}-${withoutHost.substring(8, 12)}-${withoutHost.substring( 12, - 16 + 16, )}-${withoutHost.substring(16, 20)}-${withoutHost.substring(20)}`; }