From 82b5a334e636914ebe3d1c6508b5f846c4f3d7c2 Mon Sep 17 00:00:00 2001 From: matttdawson <89495499+matttdawson@users.noreply.github.com> Date: Fri, 1 Sep 2023 10:50:02 +1200 Subject: [PATCH] fix: Fix overridden lui styles (#410) * Fix overriding lui styles. Update libs --- package-lock.json | 155 ++++++++++++++++++++------------ package.json | 12 +-- src/lui/FormError.scss | 2 +- src/lui/FormError.tsx | 2 +- src/lui/TextInputFormatted.scss | 2 +- src/lui/TextInputFormatted.tsx | 8 +- src/stories/grid/FormTest.scss | 4 + 7 files changed, 120 insertions(+), 65 deletions(-) diff --git a/package-lock.json b/package-lock.json index b4b98824..259beb1a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,7 +24,7 @@ "@babel/plugin-proposal-private-property-in-object": "^7.21.11", "@rollup/plugin-commonjs": "^25.0.4", "@rollup/plugin-json": "^6.0.0", - "@rollup/plugin-node-resolve": "^15.1.0", + "@rollup/plugin-node-resolve": "^15.2.1", "@semantic-release/changelog": "^6.0.3", "@semantic-release/git": "^10.0.1", "@storybook/addon-essentials": "^7.2.3", @@ -51,7 +51,7 @@ "@typescript-eslint/parser": "^5.62.0", "babel-jest": "^29.6.2", "babel-preset-react-app": "^10.0.1", - "chromatic": "^6.21.0", + "chromatic": "^6.24.1", "conventional-changelog-conventionalcommits": "^6.1.0", "css-loader": "^6.8.1", "eslint": "^8.47.0", @@ -72,7 +72,7 @@ "jest-expect-message": "^1.1.3", "mkdirp": "^3.0.1", "npm-run-all": "^4.1.5", - "postcss": "^8.4.27", + "postcss": "^8.4.29", "postcss-loader": "^7.3.3", "postcss-scss": "^4.0.6", "prettier": "^2.8.8", @@ -83,13 +83,13 @@ "rollup-plugin-peer-deps-external": "^2.2.4", "rollup-plugin-postcss": "^4.0.2", "rollup-plugin-typescript2": "^0.35.0", - "sass": "1.64.2", + "sass": "1.66.1", "sass-loader": "^13.3.2", - "semantic-release": "^21.0.7", + "semantic-release": "^21.1.1", "storybook": "^7.2.3", "storybook-css-modules-preset": "^1.1.1", "style-loader": "^3.3.3", - "stylelint": "^15.10.2", + "stylelint": "^15.10.3", "stylelint-config-recommended-scss": "^12.0.0", "stylelint-config-standard": "^34.0.0", "stylelint-prettier": "^3.0.0", @@ -6855,9 +6855,9 @@ } }, "node_modules/@rollup/plugin-node-resolve": { - "version": "15.1.0", - "resolved": "https://registry.npmjs.org/@rollup/plugin-node-resolve/-/plugin-node-resolve-15.1.0.tgz", - "integrity": "sha512-xeZHCgsiZ9pzYVgAo9580eCGqwh/XCEUM9q6iQfGNocjgkufHAqC3exA+45URvhiYV8sBF9RlBai650eNs7AsA==", + "version": "15.2.1", + "resolved": "https://registry.npmjs.org/@rollup/plugin-node-resolve/-/plugin-node-resolve-15.2.1.tgz", + "integrity": "sha512-nsbUg588+GDSu8/NS8T4UAshO6xeaOfINNuXeVHcKV02LJtoRaM1SiOacClw4kws1SFiNhdLGxlbMY9ga/zs/w==", "dev": true, "dependencies": { "@rollup/pluginutils": "^5.0.1", @@ -15949,9 +15949,9 @@ } }, "node_modules/chromatic": { - "version": "6.21.0", - "resolved": "https://registry.npmjs.org/chromatic/-/chromatic-6.21.0.tgz", - "integrity": "sha512-Nnp28jrhk6T4z1izFXQZVRG9Uivq5ZWibRJ3f/SbHUzJuWb1otHFqbUMomrYm770ar8ByIF09Mx+5VEW+RDrug==", + "version": "6.24.1", + "resolved": "https://registry.npmjs.org/chromatic/-/chromatic-6.24.1.tgz", + "integrity": "sha512-XbpdWWHvFpEHtcq1Km71UcuQ07effB+8q8L47E1Y7HJmJ4ZCoKCuPd8liNrbnvwEAxqfBZvTcONYU/3BPz2i5w==", "dev": true, "bin": { "chroma": "dist/bin.js", @@ -27660,9 +27660,9 @@ } }, "node_modules/known-css-properties": { - "version": "0.27.0", - "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.27.0.tgz", - "integrity": "sha512-uMCj6+hZYDoffuvAJjFAPz56E9uoowFHmTkqRtRq5WyC5Q6Cu/fTZKNQpX/RbzChBYLLl3lo8CjFZBAZXq9qFg==", + "version": "0.28.0", + "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.28.0.tgz", + "integrity": "sha512-9pSL5XB4J+ifHP0e0jmmC98OGC1nL8/JjS+fi6mnTlIf//yt/MfVLtKg7S6nCtj/8KTcWX7nRlY0XywoYY1ISQ==", "dev": true }, "node_modules/language-subtag-registry": { @@ -33555,9 +33555,9 @@ } }, "node_modules/postcss": { - "version": "8.4.27", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.27.tgz", - "integrity": "sha512-gY/ACJtJPSmUFPDCHtX78+01fHa64FaU4zaaWfuh1MhGJISufJAH4cun6k/8fwsHYeK4UQmENQK+tRLCFJE8JQ==", + "version": "8.4.29", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.29.tgz", + "integrity": "sha512-cbI+jaqIeu/VGqXEarWkRCCffhjgXc0qjBtXpqJhTBohMUjUQnbBr0xqX3vEKudc4iviTewcJo5ajcec5+wdJw==", "funding": [ { "type": "opencollective", @@ -38919,9 +38919,9 @@ "dev": true }, "node_modules/sass": { - "version": "1.64.2", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.64.2.tgz", - "integrity": "sha512-TnDlfc+CRnUAgLO9D8cQLFu/GIjJIzJCGkE7o4ekIGQOH7T3GetiRR/PsTWJUHhkzcSPrARkPI+gNWn5alCzDg==", + "version": "1.66.1", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.66.1.tgz", + "integrity": "sha512-50c+zTsZOJVgFfTgwwEzkjA3/QACgdNsKueWPyAR0mRINIvLAStVQBbPg14iuqEQ74NPDbXzJARJ/O4SI1zftA==", "dev": true, "dependencies": { "chokidar": ">=3.0.0 <4.0.0", @@ -39035,9 +39035,9 @@ } }, "node_modules/semantic-release": { - "version": "21.0.7", - "resolved": "https://registry.npmjs.org/semantic-release/-/semantic-release-21.0.7.tgz", - "integrity": "sha512-peRDSXN+hF8EFSKzze90ff/EnAmgITHQ/a3SZpRV3479ny0BIZWEJ33uX6/GlOSKdaSxo9hVRDyv2/u2MuF+Bw==", + "version": "21.1.1", + "resolved": "https://registry.npmjs.org/semantic-release/-/semantic-release-21.1.1.tgz", + "integrity": "sha512-OCIazQnaCHdq1F6zfmKS0P7jZakYq0weiqW2mxUWo4H2CDnxelUoa/0Bs/dQatoHc6JFh6lG2HWpusdl93bFcw==", "dev": true, "dependencies": { "@semantic-release/commit-analyzer": "^10.0.0", @@ -39049,13 +39049,13 @@ "cosmiconfig": "^8.0.0", "debug": "^4.0.0", "env-ci": "^9.0.0", - "execa": "^7.0.0", + "execa": "^8.0.0", "figures": "^5.0.0", "find-versions": "^5.1.0", "get-stream": "^6.0.0", "git-log-parser": "^1.2.0", "hook-std": "^3.0.0", - "hosted-git-info": "^6.0.0", + "hosted-git-info": "^7.0.0", "lodash-es": "^4.17.21", "marked": "^5.0.0", "marked-terminal": "^5.1.1", @@ -39153,28 +39153,40 @@ } }, "node_modules/semantic-release/node_modules/execa": { - "version": "7.2.0", - "resolved": "https://registry.npmjs.org/execa/-/execa-7.2.0.tgz", - "integrity": "sha512-UduyVP7TLB5IcAQl+OzLyLcS/l32W/GLg+AhHJ+ow40FOk2U3SAllPwR44v4vmdFwIWqpdwxxpQbF1n5ta9seA==", + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/execa/-/execa-8.0.1.tgz", + "integrity": "sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==", "dev": true, "dependencies": { "cross-spawn": "^7.0.3", - "get-stream": "^6.0.1", - "human-signals": "^4.3.0", + "get-stream": "^8.0.1", + "human-signals": "^5.0.0", "is-stream": "^3.0.0", "merge-stream": "^2.0.0", "npm-run-path": "^5.1.0", "onetime": "^6.0.0", - "signal-exit": "^3.0.7", + "signal-exit": "^4.1.0", "strip-final-newline": "^3.0.0" }, "engines": { - "node": "^14.18.0 || ^16.14.0 || >=18.0.0" + "node": ">=16.17" }, "funding": { "url": "https://github.com/sindresorhus/execa?sponsor=1" } }, + "node_modules/semantic-release/node_modules/execa/node_modules/get-stream": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-8.0.1.tgz", + "integrity": "sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==", + "dev": true, + "engines": { + "node": ">=16" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/semantic-release/node_modules/find-up": { "version": "6.3.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-6.3.0.tgz", @@ -39192,33 +39204,33 @@ } }, "node_modules/semantic-release/node_modules/hosted-git-info": { - "version": "6.1.1", - "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-6.1.1.tgz", - "integrity": "sha512-r0EI+HBMcXadMrugk0GCQ+6BQV39PiWAZVfq7oIckeGiN7sjRGyQxPdft3nQekFTCQbYxLBH+/axZMeH8UX6+w==", + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-7.0.0.tgz", + "integrity": "sha512-ICclEpTLhHj+zCuSb2/usoNXSVkxUSIopre+b1w8NDY9Dntp9LO4vLdHYI336TH8sAqwrRgnSfdkBG2/YpisHA==", "dev": true, "dependencies": { - "lru-cache": "^7.5.1" + "lru-cache": "^10.0.1" }, "engines": { - "node": "^14.17.0 || ^16.13.0 || >=18.0.0" + "node": "^16.14.0 || >=18.0.0" } }, "node_modules/semantic-release/node_modules/hosted-git-info/node_modules/lru-cache": { - "version": "7.18.3", - "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-7.18.3.tgz", - "integrity": "sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA==", + "version": "10.0.1", + "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.0.1.tgz", + "integrity": "sha512-IJ4uwUTi2qCccrioU6g9g/5rvvVl13bsdczUUcqbciD9iLr095yj8DQKdObriEvuNSx325N1rV1O0sJFszx75g==", "dev": true, "engines": { - "node": ">=12" + "node": "14 || >=16.14" } }, "node_modules/semantic-release/node_modules/human-signals": { - "version": "4.3.1", - "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-4.3.1.tgz", - "integrity": "sha512-nZXjEF2nbo7lIw3mgYjItAfgQXog3OjJogSbKa2CQIIvSGWcKgeJnQlNXip6NglNzYH45nSRiEVimMvYL8DDqQ==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-5.0.0.tgz", + "integrity": "sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==", "dev": true, "engines": { - "node": ">=14.18.0" + "node": ">=16.17.0" } }, "node_modules/semantic-release/node_modules/indent-string": { @@ -39329,6 +39341,27 @@ "node": "^14.17.0 || ^16.13.0 || >=18.0.0" } }, + "node_modules/semantic-release/node_modules/normalize-package-data/node_modules/hosted-git-info": { + "version": "6.1.1", + "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-6.1.1.tgz", + "integrity": "sha512-r0EI+HBMcXadMrugk0GCQ+6BQV39PiWAZVfq7oIckeGiN7sjRGyQxPdft3nQekFTCQbYxLBH+/axZMeH8UX6+w==", + "dev": true, + "dependencies": { + "lru-cache": "^7.5.1" + }, + "engines": { + "node": "^14.17.0 || ^16.13.0 || >=18.0.0" + } + }, + "node_modules/semantic-release/node_modules/normalize-package-data/node_modules/lru-cache": { + "version": "7.18.3", + "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-7.18.3.tgz", + "integrity": "sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA==", + "dev": true, + "engines": { + "node": ">=12" + } + }, "node_modules/semantic-release/node_modules/npm-run-path": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.1.0.tgz", @@ -39491,6 +39524,18 @@ "node": ">=10" } }, + "node_modules/semantic-release/node_modules/signal-exit": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz", + "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==", + "dev": true, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "node_modules/semantic-release/node_modules/strip-final-newline": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-3.0.0.tgz", @@ -40689,14 +40734,14 @@ } }, "node_modules/stylelint": { - "version": "15.10.2", - "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-15.10.2.tgz", - "integrity": "sha512-UxqSb3hB74g4DTO45QhUHkJMjKKU//lNUAOWyvPBVPZbCknJ5HjOWWZo+UDuhHa9FLeVdHBZXxu43eXkjyIPWg==", + "version": "15.10.3", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-15.10.3.tgz", + "integrity": "sha512-aBQMMxYvFzJJwkmg+BUUg3YfPyeuCuKo2f+LOw7yYbU8AZMblibwzp9OV4srHVeQldxvSFdz0/Xu8blq2AesiA==", "dev": true, "dependencies": { - "@csstools/css-parser-algorithms": "^2.3.0", - "@csstools/css-tokenizer": "^2.1.1", - "@csstools/media-query-list-parser": "^2.1.2", + "@csstools/css-parser-algorithms": "^2.3.1", + "@csstools/css-tokenizer": "^2.2.0", + "@csstools/media-query-list-parser": "^2.1.4", "@csstools/selector-specificity": "^3.0.0", "balanced-match": "^2.0.0", "colord": "^2.9.3", @@ -40704,7 +40749,7 @@ "css-functions-list": "^3.2.0", "css-tree": "^2.3.1", "debug": "^4.3.4", - "fast-glob": "^3.3.0", + "fast-glob": "^3.3.1", "fastest-levenshtein": "^1.0.16", "file-entry-cache": "^6.0.1", "global-modules": "^2.0.0", @@ -40715,13 +40760,13 @@ "import-lazy": "^4.0.0", "imurmurhash": "^0.1.4", "is-plain-object": "^5.0.0", - "known-css-properties": "^0.27.0", + "known-css-properties": "^0.28.0", "mathml-tag-names": "^2.1.3", "meow": "^10.1.5", "micromatch": "^4.0.5", "normalize-path": "^3.0.0", "picocolors": "^1.0.0", - "postcss": "^8.4.25", + "postcss": "^8.4.27", "postcss-resolve-nested-selector": "^0.1.1", "postcss-safe-parser": "^6.0.0", "postcss-selector-parser": "^6.0.13", diff --git a/package.json b/package.json index 76737b47..d4979e0d 100644 --- a/package.json +++ b/package.json @@ -84,7 +84,7 @@ "@babel/plugin-proposal-private-property-in-object": "^7.21.11", "@rollup/plugin-commonjs": "^25.0.4", "@rollup/plugin-json": "^6.0.0", - "@rollup/plugin-node-resolve": "^15.1.0", + "@rollup/plugin-node-resolve": "^15.2.1", "@semantic-release/changelog": "^6.0.3", "@semantic-release/git": "^10.0.1", "@storybook/addon-essentials": "^7.2.3", @@ -111,7 +111,7 @@ "@typescript-eslint/parser": "^5.62.0", "babel-jest": "^29.6.2", "babel-preset-react-app": "^10.0.1", - "chromatic": "^6.21.0", + "chromatic": "^6.24.1", "conventional-changelog-conventionalcommits": "^6.1.0", "css-loader": "^6.8.1", "eslint": "^8.47.0", @@ -132,7 +132,7 @@ "jest-expect-message": "^1.1.3", "mkdirp": "^3.0.1", "npm-run-all": "^4.1.5", - "postcss": "^8.4.27", + "postcss": "^8.4.29", "postcss-loader": "^7.3.3", "postcss-scss": "^4.0.6", "prettier": "^2.8.8", @@ -143,13 +143,13 @@ "rollup-plugin-peer-deps-external": "^2.2.4", "rollup-plugin-postcss": "^4.0.2", "rollup-plugin-typescript2": "^0.35.0", - "sass": "1.64.2", + "sass": "1.66.1", "sass-loader": "^13.3.2", - "semantic-release": "^21.0.7", + "semantic-release": "^21.1.1", "storybook": "^7.2.3", "storybook-css-modules-preset": "^1.1.1", "style-loader": "^3.3.3", - "stylelint": "^15.10.2", + "stylelint": "^15.10.3", "stylelint-config-recommended-scss": "^12.0.0", "stylelint-config-standard": "^34.0.0", "stylelint-prettier": "^3.0.0", diff --git a/src/lui/FormError.scss b/src/lui/FormError.scss index 0862798c..63a99dec 100644 --- a/src/lui/FormError.scss +++ b/src/lui/FormError.scss @@ -1,6 +1,6 @@ @use "../../node_modules/@linzjs/lui/dist/scss/Foundation/Variables/ColorVars" as colors; -.helpText { +.FormError-helpText { font-size: 0.75rem; color: colors.$fuscous; font-weight: 400; diff --git a/src/lui/FormError.tsx b/src/lui/FormError.tsx index 547bd6e7..474d9bb5 100644 --- a/src/lui/FormError.tsx +++ b/src/lui/FormError.tsx @@ -16,7 +16,7 @@ export const FormError = (props: FormErrorProps) => { )} - {props.helpText && !props.error && {props.helpText}} + {props.helpText && !props.error && {props.helpText}} ); }; diff --git a/src/lui/TextInputFormatted.scss b/src/lui/TextInputFormatted.scss index 56af15a3..9c5ef68e 100644 --- a/src/lui/TextInputFormatted.scss +++ b/src/lui/TextInputFormatted.scss @@ -1,4 +1,4 @@ -.LuiTextInput { +.LuiTextInput.GridLuiTextInput { margin-bottom: 0; } diff --git a/src/lui/TextInputFormatted.tsx b/src/lui/TextInputFormatted.tsx index f7b6bfd7..cab8b0d1 100644 --- a/src/lui/TextInputFormatted.tsx +++ b/src/lui/TextInputFormatted.tsx @@ -19,7 +19,13 @@ export interface LuiTextInputProps extends DetailedHTMLProps { return ( -
+
{/* wrapper div used for error styling */}