diff --git a/.stylelintrc.json b/.stylelintrc.json index a264c169d..17b43bd8c 100644 --- a/.stylelintrc.json +++ b/.stylelintrc.json @@ -8,7 +8,7 @@ }, { "files": ["**/*.scss"], - "extends": ["stylelint-config-sass-guidelines"], + "extends": ["stylelint-config-standard-scss"], "rules": {} } ], diff --git a/package-lock.json b/package-lock.json index 77cc3215f..47658b47e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -121,9 +121,9 @@ "rimraf": "5.0.5", "stencil-tailwind-plugin": "1.8.0", "storybook": "7.6.6", - "stylelint": "15.11.0", - "stylelint-config-sass-guidelines": "10.0.0", - "stylelint-config-standard": "34.0.0", + "stylelint": "16.0.2", + "stylelint-config-standard": "35.0.0", + "stylelint-config-standard-scss": "12.0.0", "tailwindcss": "3.4.0", "tailwindcss-theme-swapper": "0.10.0", "ts-jest": "29.1.1", @@ -17034,9 +17034,9 @@ "dev": true }, "node_modules/@types/eslint": { - "version": "8.44.9", - "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.44.9.tgz", - "integrity": "sha512-6yBxcvwnnYoYT1Uk2d+jvIfsuP4mb2EdIxFnrPABj5a/838qe5bGkNLFOiipX4ULQ7XVQvTxOh7jO+BTAiqsEw==", + "version": "8.56.0", + "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.0.tgz", + "integrity": "sha512-FlsN0p4FhuYRjIxpbdXovvHQhtlG05O1GG/RNWvdAxTboR438IOTwmrY/vLA+Xfgg06BTkP045M3vpFwTMv1dg==", "dev": true, "dependencies": { "@types/estree": "*", @@ -27988,15 +27988,6 @@ "node": ">=8" } }, - "node_modules/import-lazy": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-4.0.0.tgz", - "integrity": "sha512-rKtvo6a868b5Hu3heneU+L4yEQ4jYKLtjpnPeUdK7h0yzXGmyBTypknlkCvHFBqfX9YlorEiMM6Dnq/5atfHkw==", - "dev": true, - "engines": { - "node": ">=8" - } - }, "node_modules/import-local": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/import-local/-/import-local-3.1.0.tgz", @@ -36842,19 +36833,29 @@ "dev": true }, "node_modules/postcss-safe-parser": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-6.0.0.tgz", - "integrity": "sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==", + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-7.0.0.tgz", + "integrity": "sha512-ovehqRNVCpuFzbXoTb4qLtyzK3xn3t/CUBxOs8LsnQjQrShaB4lKiHoVqY8ANaC0hBMHq5QVWk77rwGklFUDrg==", "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss-safe-parser" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], "engines": { - "node": ">=12.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" + "node": ">=18.0" }, "peerDependencies": { - "postcss": "^8.3.3" + "postcss": "^8.4.31" } }, "node_modules/postcss-scss": { @@ -41825,12 +41826,6 @@ "webpack": "^5.0.0" } }, - "node_modules/style-search": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/style-search/-/style-search-0.1.0.tgz", - "integrity": "sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==", - "dev": true - }, "node_modules/stylehacks": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/stylehacks/-/stylehacks-6.0.1.tgz", @@ -41848,47 +41843,45 @@ } }, "node_modules/stylelint": { - "version": "15.11.0", - "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-15.11.0.tgz", - "integrity": "sha512-78O4c6IswZ9TzpcIiQJIN49K3qNoXTM8zEJzhaTE/xRTCZswaovSEVIa/uwbOltZrk16X4jAxjaOhzz/hTm1Kw==", + "version": "16.0.2", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.0.2.tgz", + "integrity": "sha512-SxA/rg3VWxdoHZlW0nmVueWO1E7TAKW4W6mmA3iTxxEF9bIeQdFZu2oiBlQYyNe1pGnOamOqo2XYnI7cs5Bgow==", "dev": true, "dependencies": { - "@csstools/css-parser-algorithms": "^2.3.1", - "@csstools/css-tokenizer": "^2.2.0", - "@csstools/media-query-list-parser": "^2.1.4", + "@csstools/css-parser-algorithms": "^2.3.2", + "@csstools/css-tokenizer": "^2.2.1", + "@csstools/media-query-list-parser": "^2.1.5", "@csstools/selector-specificity": "^3.0.0", "balanced-match": "^2.0.0", "colord": "^2.9.3", - "cosmiconfig": "^8.2.0", + "cosmiconfig": "^9.0.0", "css-functions-list": "^3.2.1", "css-tree": "^2.3.1", "debug": "^4.3.4", - "fast-glob": "^3.3.1", + "fast-glob": "^3.3.2", "fastest-levenshtein": "^1.0.16", - "file-entry-cache": "^7.0.0", + "file-entry-cache": "^7.0.2", "global-modules": "^2.0.0", "globby": "^11.1.0", "globjoin": "^0.1.4", "html-tags": "^3.3.1", - "ignore": "^5.2.4", - "import-lazy": "^4.0.0", + "ignore": "^5.3.0", "imurmurhash": "^0.1.4", "is-plain-object": "^5.0.0", "known-css-properties": "^0.29.0", "mathml-tag-names": "^2.1.3", - "meow": "^10.1.5", + "meow": "^12.1.1", "micromatch": "^4.0.5", "normalize-path": "^3.0.0", "picocolors": "^1.0.0", - "postcss": "^8.4.28", + "postcss": "^8.4.32", "postcss-resolve-nested-selector": "^0.1.1", - "postcss-safe-parser": "^6.0.0", + "postcss-safe-parser": "^7.0.0", "postcss-selector-parser": "^6.0.13", "postcss-value-parser": "^4.2.0", "resolve-from": "^5.0.0", "string-width": "^4.2.3", - "strip-ansi": "^6.0.1", - "style-search": "^0.1.0", + "strip-ansi": "^7.1.0", "supports-hyperlinks": "^3.0.0", "svg-tags": "^1.0.0", "table": "^6.8.1", @@ -41898,7 +41891,7 @@ "stylelint": "bin/stylelint.mjs" }, "engines": { - "node": "^14.13.1 || >=16.0.0" + "node": ">=18.12.0" }, "funding": { "type": "opencollective", @@ -41906,62 +41899,106 @@ } }, "node_modules/stylelint-config-recommended": { - "version": "13.0.0", - "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-13.0.0.tgz", - "integrity": "sha512-EH+yRj6h3GAe/fRiyaoO2F9l9Tgg50AOFhaszyfov9v6ayXJ1IkSHwTxd7lB48FmOeSGDPLjatjO11fJpmarkQ==", + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-14.0.0.tgz", + "integrity": "sha512-jSkx290CglS8StmrLp2TxAppIajzIBZKYm3IxT89Kg6fGlxbPiTiyH9PS5YUuVAFwaJLl1ikiXX0QWjI0jmgZQ==", "dev": true, "engines": { - "node": "^14.13.1 || >=16.0.0" + "node": ">=18.12.0" }, "peerDependencies": { - "stylelint": "^15.10.0" + "stylelint": "^16.0.0" } }, - "node_modules/stylelint-config-sass-guidelines": { - "version": "10.0.0", - "resolved": "https://registry.npmjs.org/stylelint-config-sass-guidelines/-/stylelint-config-sass-guidelines-10.0.0.tgz", - "integrity": "sha512-+Rr2Dd4b72CWA4qoj1Kk+y449nP/WJsrD0nzQAWkmPPIuyVcy2GMIcfNr0Z8JJOLjRvtlkKxa49FCNXMePBikQ==", + "node_modules/stylelint-config-recommended-scss": { + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-14.0.0.tgz", + "integrity": "sha512-HDvpoOAQ1RpF+sPbDOT2Q2/YrBDEJDnUymmVmZ7mMCeNiFSdhRdyGEimBkz06wsN+HaFwUh249gDR+I9JR7Onw==", "dev": true, "dependencies": { - "postcss-scss": "^4.0.6", - "stylelint-scss": "^4.4.0" + "postcss-scss": "^4.0.9", + "stylelint-config-recommended": "^14.0.0", + "stylelint-scss": "^6.0.0" }, "engines": { - "node": "^14.13.1 || >=16.13.0 || >=18.0.0" + "node": ">=18.12.0" }, "peerDependencies": { - "postcss": "^8.4.21", - "stylelint": "^15.2.0" + "postcss": "^8.3.3", + "stylelint": "^16.0.2" + }, + "peerDependenciesMeta": { + "postcss": { + "optional": true + } } }, "node_modules/stylelint-config-standard": { - "version": "34.0.0", - "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-34.0.0.tgz", - "integrity": "sha512-u0VSZnVyW9VSryBG2LSO+OQTjN7zF9XJaAJRX/4EwkmU0R2jYwmBSN10acqZisDitS0CLiEiGjX7+Hrq8TAhfQ==", + "version": "35.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-35.0.0.tgz", + "integrity": "sha512-JyQrNZk2BZwVKFauGGxW2U6RuhIfQ4XoHHo+rBzMHcAkLnwI/knpszwXjzxiMgSfcxbZBckM7Vq4LHoANTR85g==", "dev": true, "dependencies": { - "stylelint-config-recommended": "^13.0.0" + "stylelint-config-recommended": "^14.0.0" }, "engines": { - "node": "^14.13.1 || >=16.0.0" + "node": ">=18.12.0" }, "peerDependencies": { - "stylelint": "^15.10.0" + "stylelint": "^16.0.0" + } + }, + "node_modules/stylelint-config-standard-scss": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-12.0.0.tgz", + "integrity": "sha512-ATh3EcEOLZq0iwlFaBdIsSavrla0lNtJ7mO7hdE7DgVT6imozRggFSqd4cFcjzVnOLKv/uJT63MmqA1acIflbw==", + "dev": true, + "dependencies": { + "stylelint-config-recommended-scss": "^14.0.0", + "stylelint-config-standard": "^35.0.0" + }, + "engines": { + "node": ">=18.12.0" + }, + "peerDependencies": { + "postcss": "^8.3.3", + "stylelint": "^16.0.2" + }, + "peerDependenciesMeta": { + "postcss": { + "optional": true + } } }, "node_modules/stylelint-scss": { - "version": "4.7.0", - "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-4.7.0.tgz", - "integrity": "sha512-TSUgIeS0H3jqDZnby1UO1Qv3poi1N8wUYIJY6D1tuUq2MN3lwp/rITVo0wD+1SWTmRm0tNmGO0b7nKInnqF6Hg==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-6.0.0.tgz", + "integrity": "sha512-N1xV/Ef5PNRQQt9E45unzGvBUN1KZxCI8B4FgN/pMfmyRYbZGVN4y9qWlvOMdScU17c8VVCnjIHTVn38Bb6qSA==", "dev": true, "dependencies": { + "known-css-properties": "^0.29.0", "postcss-media-query-parser": "^0.2.3", "postcss-resolve-nested-selector": "^0.1.1", - "postcss-selector-parser": "^6.0.11", + "postcss-selector-parser": "^6.0.13", "postcss-value-parser": "^4.2.0" }, + "engines": { + "node": ">=18.12.0" + }, "peerDependencies": { - "stylelint": "^14.5.1 || ^15.0.0" + "stylelint": "^16.0.2" + } + }, + "node_modules/stylelint/node_modules/ansi-regex": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz", + "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/ansi-regex?sponsor=1" } }, "node_modules/stylelint/node_modules/balanced-match": { @@ -41970,34 +42007,46 @@ "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==", "dev": true }, - "node_modules/stylelint/node_modules/camelcase-keys": { - "version": "7.0.2", - "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-7.0.2.tgz", - "integrity": "sha512-Rjs1H+A9R+Ig+4E/9oyB66UC5Mj9Xq3N//vcLf2WzgdTi/3gUu3Z9KoqmlrEG4VuuLK8wJHofxzdQXz/knhiYg==", + "node_modules/stylelint/node_modules/cosmiconfig": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz", + "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==", "dev": true, "dependencies": { - "camelcase": "^6.3.0", - "map-obj": "^4.1.0", - "quick-lru": "^5.1.1", - "type-fest": "^1.2.1" + "env-paths": "^2.2.1", + "import-fresh": "^3.3.0", + "js-yaml": "^4.1.0", + "parse-json": "^5.2.0" }, "engines": { - "node": ">=12" + "node": ">=14" }, "funding": { - "url": "https://github.com/sponsors/sindresorhus" + "url": "https://github.com/sponsors/d-fischer" + }, + "peerDependencies": { + "typescript": ">=4.9.5" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } } }, - "node_modules/stylelint/node_modules/decamelize": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-5.0.1.tgz", - "integrity": "sha512-VfxadyCECXgQlkoEAjeghAr5gY3Hf+IKjKb+X8tGVDtveCjN+USwprd2q3QXBR9T1+x2DG0XZF5/w+7HAtSaXA==", + "node_modules/stylelint/node_modules/fast-glob": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz", + "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==", "dev": true, - "engines": { - "node": ">=10" + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.4" }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" + "engines": { + "node": ">=8.6.0" } }, "node_modules/stylelint/node_modules/file-entry-cache": { @@ -42038,140 +42087,12 @@ "node": ">=6" } }, - "node_modules/stylelint/node_modules/hosted-git-info": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-4.1.0.tgz", - "integrity": "sha512-kyCuEOWjJqZuDbRHzL8V93NzQhwIB71oFWSyzVo+KPZI+pnQPPxucdkrOZvkLRnrf5URsQM+IJ09Dw29cRALIA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/stylelint/node_modules/indent-string": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-5.0.0.tgz", - "integrity": "sha512-m6FAo/spmsW2Ab2fU35JTYwtOKa2yAwXSwgjSv1TJzh4Mh7mC3lzAOVLBprb72XsTrgkEIsl7YrFNAiDiRhIGg==", - "dev": true, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/stylelint/node_modules/ini": { "version": "1.3.8", "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz", "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==", "dev": true }, - "node_modules/stylelint/node_modules/lru-cache": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", - "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", - "dev": true, - "dependencies": { - "yallist": "^4.0.0" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/stylelint/node_modules/meow": { - "version": "10.1.5", - "resolved": "https://registry.npmjs.org/meow/-/meow-10.1.5.tgz", - "integrity": "sha512-/d+PQ4GKmGvM9Bee/DPa8z3mXs/pkvJE2KEThngVNOqtmljC6K7NMPxtc2JeZYTmpWb9k/TmxjeL18ez3h7vCw==", - "dev": true, - "dependencies": { - "@types/minimist": "^1.2.2", - "camelcase-keys": "^7.0.0", - "decamelize": "^5.0.0", - "decamelize-keys": "^1.1.0", - "hard-rejection": "^2.1.0", - "minimist-options": "4.1.0", - "normalize-package-data": "^3.0.2", - "read-pkg-up": "^8.0.0", - "redent": "^4.0.0", - "trim-newlines": "^4.0.2", - "type-fest": "^1.2.2", - "yargs-parser": "^20.2.9" - }, - "engines": { - "node": "^12.20.0 || ^14.13.1 || >=16.0.0" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/stylelint/node_modules/normalize-package-data": { - "version": "3.0.3", - "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-3.0.3.tgz", - "integrity": "sha512-p2W1sgqij3zMMyRC067Dg16bfzVH+w7hyegmpIvZ4JNjqtGOVAIvLmjBx3yP7YTe9vKJgkoNOPjwQGogDoMXFA==", - "dev": true, - "dependencies": { - "hosted-git-info": "^4.0.1", - "is-core-module": "^2.5.0", - "semver": "^7.3.4", - "validate-npm-package-license": "^3.0.1" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/stylelint/node_modules/read-pkg": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-6.0.0.tgz", - "integrity": "sha512-X1Fu3dPuk/8ZLsMhEj5f4wFAF0DWoK7qhGJvgaijocXxBmSToKfbFtqbxMO7bVjNA1dmE5huAzjXj/ey86iw9Q==", - "dev": true, - "dependencies": { - "@types/normalize-package-data": "^2.4.0", - "normalize-package-data": "^3.0.2", - "parse-json": "^5.2.0", - "type-fest": "^1.0.1" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/stylelint/node_modules/read-pkg-up": { - "version": "8.0.0", - "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-8.0.0.tgz", - "integrity": "sha512-snVCqPczksT0HS2EC+SxUndvSzn6LRCwpfSvLrIfR5BKDQQZMaI6jPRC9dYvYFDRAuFEAnkwww8kBBNE/3VvzQ==", - "dev": true, - "dependencies": { - "find-up": "^5.0.0", - "read-pkg": "^6.0.0", - "type-fest": "^1.0.1" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/stylelint/node_modules/redent": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/redent/-/redent-4.0.0.tgz", - "integrity": "sha512-tYkDkVVtYkSVhuQ4zBgfvciymHaeuel+zFKXShfDnFP5SyVEP7qo70Rf1jTOTCx3vGNAbnEi/xFkcfQVMIBWag==", - "dev": true, - "dependencies": { - "indent-string": "^5.0.0", - "strip-indent": "^4.0.0" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/stylelint/node_modules/signal-exit": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz", @@ -42184,43 +42105,19 @@ "url": "https://github.com/sponsors/isaacs" } }, - "node_modules/stylelint/node_modules/strip-indent": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-4.0.0.tgz", - "integrity": "sha512-mnVSV2l+Zv6BLpSD/8V87CW/y9EmmbYzGCIavsnsI6/nwn26DwffM/yztm30Z/I2DY9wdS3vXVCMnHDgZaVNoA==", + "node_modules/stylelint/node_modules/strip-ansi": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz", + "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==", "dev": true, "dependencies": { - "min-indent": "^1.0.1" - }, - "engines": { - "node": ">=12" + "ansi-regex": "^6.0.1" }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/stylelint/node_modules/trim-newlines": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-4.1.1.tgz", - "integrity": "sha512-jRKj0n0jXWo6kh62nA5TEh3+4igKDXLvzBJcPpiizP7oOolUrYIxmVBG9TOtHYFHoddUk6YvAkGeGoSVTXfQXQ==", - "dev": true, "engines": { "node": ">=12" }, "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/stylelint/node_modules/type-fest": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-1.4.0.tgz", - "integrity": "sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==", - "dev": true, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" + "url": "https://github.com/chalk/strip-ansi?sponsor=1" } }, "node_modules/stylelint/node_modules/which": { @@ -42248,21 +42145,6 @@ "node": "^14.17.0 || ^16.13.0 || >=18.0.0" } }, - "node_modules/stylelint/node_modules/yallist": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", - "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", - "dev": true - }, - "node_modules/stylelint/node_modules/yargs-parser": { - "version": "20.2.9", - "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz", - "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==", - "dev": true, - "engines": { - "node": ">=10" - } - }, "node_modules/stylus": { "version": "0.59.0", "resolved": "https://registry.npmjs.org/stylus/-/stylus-0.59.0.tgz", diff --git a/package.json b/package.json index 15fa9defb..5dd2da77f 100644 --- a/package.json +++ b/package.json @@ -141,9 +141,9 @@ "rimraf": "5.0.5", "stencil-tailwind-plugin": "1.8.0", "storybook": "7.6.6", - "stylelint": "15.11.0", - "stylelint-config-sass-guidelines": "10.0.0", - "stylelint-config-standard": "34.0.0", + "stylelint": "16.0.2", + "stylelint-config-standard": "35.0.0", + "stylelint-config-standard-scss": "12.0.0", "tailwindcss": "3.4.0", "tailwindcss-theme-swapper": "0.10.0", "ts-jest": "29.1.1", diff --git a/packages/beeq/.stylelintrc.json b/packages/beeq/.stylelintrc.json index ca4dbc25e..f6944ae15 100644 --- a/packages/beeq/.stylelintrc.json +++ b/packages/beeq/.stylelintrc.json @@ -1,3 +1,18 @@ { - "extends": ["../../.stylelintrc.json"] + "extends": ["../../.stylelintrc.json"], + "rules": { + "at-rule-no-unknown": [ + true, + { + "ignoreAtRules": ["apply", "include", "mixin", "responsive", "screen", "tailwind", "variants"] + } + ], + "comment-empty-line-before": null, + "custom-property-empty-line-before": null, + "custom-property-pattern": null, + "no-descending-specificity": null, + "no-invalid-position-at-import-rule": null, + "scss/double-slash-comment-empty-line-before": null, + "scss/operator-no-unspaced": null + } } diff --git a/packages/beeq/src/components/alert/scss/bq-alert.scss b/packages/beeq/src/components/alert/scss/bq-alert.scss index f5a017e49..e1b40fb61 100644 --- a/packages/beeq/src/components/alert/scss/bq-alert.scss +++ b/packages/beeq/src/components/alert/scss/bq-alert.scss @@ -22,9 +22,9 @@ .bq-alert { @include animation-fade-in; - @apply relative flex min-w-[var(--bq-alert--min-width)] p-[var(--bq-alert--padding)]; @apply rounded-[var(--bq-alert--border-radius)] border-[length:--bq-alert--border-width]; + border-style: var(--bq-alert--border-style); } diff --git a/packages/beeq/src/components/input/scss/bq-input.scss b/packages/beeq/src/components/input/scss/bq-input.scss index 44c40c197..7f4d9f897 100644 --- a/packages/beeq/src/components/input/scss/bq-input.scss +++ b/packages/beeq/src/components/input/scss/bq-input.scss @@ -79,6 +79,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.danger-active'); + @apply border-stroke-danger-active; } } @@ -88,6 +89,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.success-active'); + @apply border-stroke-success-active; } } @@ -97,6 +99,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.warning-active'); + @apply border-stroke-warning-active; } } diff --git a/packages/beeq/src/components/notification/scss/bq-notification.scss b/packages/beeq/src/components/notification/scss/bq-notification.scss index f216b638c..f713c870d 100644 --- a/packages/beeq/src/components/notification/scss/bq-notification.scss +++ b/packages/beeq/src/components/notification/scss/bq-notification.scss @@ -14,7 +14,6 @@ .bq-notification { @include animation-slide-in; - @apply relative flex min-w-[var(--bq-notification--min-width)] p-[var(--bq-notification--padding)]; @apply rounded-[var(--bq-notification--border-radius)] bg-[var(--bq-notification--background)] shadow-[shadow:var(--bq-notification--box-shadow)]; } diff --git a/packages/beeq/src/components/panel/scss/bq-panel.scss b/packages/beeq/src/components/panel/scss/bq-panel.scss index 54da8364c..bbdb8dc5d 100644 --- a/packages/beeq/src/components/panel/scss/bq-panel.scss +++ b/packages/beeq/src/components/panel/scss/bq-panel.scss @@ -10,7 +10,6 @@ .bq-panel { @include animation-fade-in; - @apply fixed z-[--bq-panel-z-index] max-h-[--bq-panel--height] w-[--bq-panel--width] overflow-y-auto overflow-x-hidden; @apply rounded-[--bq-panel--border-radius] bg-[--bq-panel--background] shadow-[shadow:--bq-panel--box-shadow]; @apply py-[--bq-panel--paddingY] pe-[--bq-panel--padding-end] ps-[--bq-panel--padding-start]; diff --git a/packages/beeq/src/components/select/scss/bq-select.scss b/packages/beeq/src/components/select/scss/bq-select.scss index 0b5f40b71..81d33a413 100644 --- a/packages/beeq/src/components/select/scss/bq-select.scss +++ b/packages/beeq/src/components/select/scss/bq-select.scss @@ -79,6 +79,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.danger-active'); + @apply border-stroke-danger-active; } } @@ -88,6 +89,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.success-active'); + @apply border-stroke-success-active; } } @@ -97,6 +99,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.warning-active'); + @apply border-stroke-warning-active; } } diff --git a/packages/beeq/src/components/side-menu-item/scss/bq-side-menu-item.scss b/packages/beeq/src/components/side-menu-item/scss/bq-side-menu-item.scss index b30ec12f5..c42262238 100644 --- a/packages/beeq/src/components/side-menu-item/scss/bq-side-menu-item.scss +++ b/packages/beeq/src/components/side-menu-item/scss/bq-side-menu-item.scss @@ -20,7 +20,7 @@ // Hover state @apply [&:not(.disabled)]:hover:cursor-pointer; - &:not(.disabled):not(.active):hover { + &:not(.disabled, .active):hover { @apply hover:bg-[var(--bq-side-menu-item--bg-hover)] hover:text-m hover:text-[color:var(--bq-side-menu-item--text-hover)]; } } diff --git a/packages/beeq/src/components/step-item/scss/bq-step-item.scss b/packages/beeq/src/components/step-item/scss/bq-step-item.scss index c29f63b44..d13d2a4f8 100644 --- a/packages/beeq/src/components/step-item/scss/bq-step-item.scss +++ b/packages/beeq/src/components/step-item/scss/bq-step-item.scss @@ -6,6 +6,7 @@ :host { --bq-icon--color: theme('colors.icon.primary'); + @apply bg-bg-primary; } diff --git a/packages/beeq/src/components/switch/scss/bq-switch.scss b/packages/beeq/src/components/switch/scss/bq-switch.scss index f544a6c33..25e2b3e73 100644 --- a/packages/beeq/src/components/switch/scss/bq-switch.scss +++ b/packages/beeq/src/components/switch/scss/bq-switch.scss @@ -14,6 +14,7 @@ .bq-switch { @apply flex cursor-pointer select-none items-center rounded-s p-2 transition-colors duration-300; + justify-content: var(--bq-switch--justify-content); // Display background on hover (if enabled) diff --git a/packages/beeq/src/components/tab-group/scss/bq-tab-group.scss b/packages/beeq/src/components/tab-group/scss/bq-tab-group.scss index ef73a386e..63a9de4c7 100644 --- a/packages/beeq/src/components/tab-group/scss/bq-tab-group.scss +++ b/packages/beeq/src/components/tab-group/scss/bq-tab-group.scss @@ -22,6 +22,5 @@ .bq-tab-group--container { @include hide-scrollbar; - @apply gap-xs2 p-xs2; // This will avoid cutting the outline focus style } diff --git a/packages/beeq/src/components/tab/scss/bq-tab.scss b/packages/beeq/src/components/tab/scss/bq-tab.scss index 72b0d11f0..36da81baf 100644 --- a/packages/beeq/src/components/tab/scss/bq-tab.scss +++ b/packages/beeq/src/components/tab/scss/bq-tab.scss @@ -37,6 +37,7 @@ ::slotted(bq-icon) { --bq-icon--size: var(--bq-tab--icon-size-small) #{!important}; + @apply mr-xs2; } } @@ -46,6 +47,7 @@ ::slotted(bq-icon) { --bq-icon--size: var(--bq-tab--icon-size-medium) #{!important}; + @apply mr-xs; } } @@ -55,6 +57,7 @@ ::slotted(bq-icon) { --bq-icon--size: var(--bq-tab--icon-size-large) #{!important}; + @apply mr-xs; } } diff --git a/packages/beeq/src/components/textarea/scss/bq-textarea.scss b/packages/beeq/src/components/textarea/scss/bq-textarea.scss index 5886d360f..d3af6d9dd 100644 --- a/packages/beeq/src/components/textarea/scss/bq-textarea.scss +++ b/packages/beeq/src/components/textarea/scss/bq-textarea.scss @@ -51,6 +51,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.danger-active'); + @apply border-stroke-danger-active; } } @@ -60,6 +61,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.success-active'); + @apply border-stroke-success-active; } } @@ -69,6 +71,7 @@ &:not(.disabled):focus-within { --bq-ring-color-focus: theme('colors.stroke.warning-active'); + @apply border-stroke-warning-active; } } diff --git a/packages/beeq/src/components/toast/scss/bq-toast.scss b/packages/beeq/src/components/toast/scss/bq-toast.scss index a22aaae3b..773ff9028 100644 --- a/packages/beeq/src/components/toast/scss/bq-toast.scss +++ b/packages/beeq/src/components/toast/scss/bq-toast.scss @@ -14,7 +14,6 @@ .bq-toast { @include animation-slide-in; - @apply flex items-center gap-[var(--bq-toast--gap)] px-[var(--bq-toast--padding-x)] py-[var(--bq-toast--padding-y)]; @apply rounded-[var(--bq-toast--border-radius)] bg-[var(--bq-toast--background)] shadow-[shadow:var(--bq-toast--box-shadow)]; @apply border-[length:var(--bq-toast--border-width)] border-[color:var(--bq-toast--border-color)]; diff --git a/packages/beeq/src/components/tooltip/scss/bq-tooltip.scss b/packages/beeq/src/components/tooltip/scss/bq-tooltip.scss index d13c57180..2c589aade 100644 --- a/packages/beeq/src/components/tooltip/scss/bq-tooltip.scss +++ b/packages/beeq/src/components/tooltip/scss/bq-tooltip.scss @@ -6,7 +6,6 @@ .bq-tooltip--panel { @include animation-fade-in; - @apply pointer-events-none fixed z-[--bq-tooltip--z-index] box-border bg-[var(--bq-tooltip--background-color)]; @apply w-[var(--bq-tooltip--width)] max-w-[var(--bq-tooltip--max-width)] px-[var(--bq-tooltip--paddingX)] py-[var(--bq-tooltip--paddingY)]; @apply text-[length:var(--bq-tooltip--font-size)] leading-[var(--bq-tooltip--line-height)] text-[color:var(--bq-tooltip--text-color)]; diff --git a/packages/beeq/src/global/styles/fonts/_outfit.scss b/packages/beeq/src/global/styles/fonts/_outfit.scss index 2fa1643d1..a057c0c58 100644 --- a/packages/beeq/src/global/styles/fonts/_outfit.scss +++ b/packages/beeq/src/global/styles/fonts/_outfit.scss @@ -1,6 +1,6 @@ /* latin-ext */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 100; font-display: swap; @@ -10,7 +10,7 @@ } /* latin */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 100; font-display: swap; @@ -20,7 +20,7 @@ } /* latin-ext */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 300; font-display: swap; @@ -30,7 +30,7 @@ } /* latin */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 300; font-display: swap; @@ -40,7 +40,7 @@ } /* latin-ext */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 400; font-display: swap; @@ -50,7 +50,7 @@ } /* latin */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 400; font-display: swap; @@ -60,7 +60,7 @@ } /* latin-ext */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 500; font-display: swap; @@ -70,7 +70,7 @@ } /* latin */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 500; font-display: swap; @@ -80,7 +80,7 @@ } /* latin-ext */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 600; font-display: swap; @@ -90,7 +90,7 @@ } /* latin */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 600; font-display: swap; @@ -100,7 +100,7 @@ } /* latin-ext */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 700; font-display: swap; @@ -110,7 +110,7 @@ } /* latin */ @font-face { - font-family: 'Outfit'; + font-family: Outfit; font-style: normal; font-weight: 700; font-display: swap; diff --git a/packages/beeq/src/global/styles/fonts/_roboto.scss b/packages/beeq/src/global/styles/fonts/_roboto.scss index 9ef4da5a9..8b3548c60 100644 --- a/packages/beeq/src/global/styles/fonts/_roboto.scss +++ b/packages/beeq/src/global/styles/fonts/_roboto.scss @@ -1,6 +1,6 @@ /* cyrillic-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 100; font-display: swap; @@ -9,7 +9,7 @@ } /* cyrillic */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 100; font-display: swap; @@ -18,7 +18,7 @@ } /* greek-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 100; font-display: swap; @@ -27,7 +27,7 @@ } /* greek */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 100; font-display: swap; @@ -36,7 +36,7 @@ } /* vietnamese */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 100; font-display: swap; @@ -46,7 +46,7 @@ } /* latin-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 100; font-display: swap; @@ -56,7 +56,7 @@ } /* latin */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 100; font-display: swap; @@ -66,7 +66,7 @@ } /* cyrillic-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 300; font-display: swap; @@ -75,7 +75,7 @@ } /* cyrillic */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 300; font-display: swap; @@ -84,7 +84,7 @@ } /* greek-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 300; font-display: swap; @@ -93,7 +93,7 @@ } /* greek */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 300; font-display: swap; @@ -102,7 +102,7 @@ } /* vietnamese */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 300; font-display: swap; @@ -112,7 +112,7 @@ } /* latin-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 300; font-display: swap; @@ -122,7 +122,7 @@ } /* latin */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 300; font-display: swap; @@ -132,7 +132,7 @@ } /* cyrillic-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 400; font-display: swap; @@ -141,7 +141,7 @@ } /* cyrillic */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 400; font-display: swap; @@ -150,7 +150,7 @@ } /* greek-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 400; font-display: swap; @@ -159,7 +159,7 @@ } /* greek */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 400; font-display: swap; @@ -168,7 +168,7 @@ } /* vietnamese */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 400; font-display: swap; @@ -178,7 +178,7 @@ } /* latin-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 400; font-display: swap; @@ -188,7 +188,7 @@ } /* latin */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 400; font-display: swap; @@ -198,7 +198,7 @@ } /* cyrillic-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 500; font-display: swap; @@ -207,7 +207,7 @@ } /* cyrillic */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 500; font-display: swap; @@ -216,7 +216,7 @@ } /* greek-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 500; font-display: swap; @@ -225,7 +225,7 @@ } /* greek */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 500; font-display: swap; @@ -234,7 +234,7 @@ } /* vietnamese */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 500; font-display: swap; @@ -244,7 +244,7 @@ } /* latin-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 500; font-display: swap; @@ -254,7 +254,7 @@ } /* latin */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 500; font-display: swap; @@ -264,7 +264,7 @@ } /* cyrillic-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 700; font-display: swap; @@ -273,7 +273,7 @@ } /* cyrillic */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 700; font-display: swap; @@ -282,7 +282,7 @@ } /* greek-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 700; font-display: swap; @@ -291,7 +291,7 @@ } /* greek */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 700; font-display: swap; @@ -300,7 +300,7 @@ } /* vietnamese */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 700; font-display: swap; @@ -310,7 +310,7 @@ } /* latin-ext */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 700; font-display: swap; @@ -320,7 +320,7 @@ } /* latin */ @font-face { - font-family: 'Roboto'; + font-family: Roboto; font-style: normal; font-weight: 700; font-display: swap; diff --git a/packages/beeq/src/global/styles/utils/_typography.scss b/packages/beeq/src/global/styles/utils/_typography.scss index 540966aba..c1bdbbea5 100644 --- a/packages/beeq/src/global/styles/utils/_typography.scss +++ b/packages/beeq/src/global/styles/utils/_typography.scss @@ -61,11 +61,10 @@ h6, caption, .caption, .overline { - /* stylelint-disable-next-line selector-no-qualifying-type */ &.semibold { @apply font-semibold; } - /* stylelint-disable-next-line selector-no-qualifying-type */ + &.bold { @apply font-bold; }