diff --git a/.changeset/orange-eels-pay.md b/.changeset/orange-eels-pay.md new file mode 100644 index 000000000..b8196fe3d --- /dev/null +++ b/.changeset/orange-eels-pay.md @@ -0,0 +1,5 @@ +--- +'@lion/ui': patch +--- + +Allow customization of currency label's slot in Input Amount diff --git a/docs/components/input-amount/use-cases.md b/docs/components/input-amount/use-cases.md index 232495304..a2d615c4c 100644 --- a/docs/components/input-amount/use-cases.md +++ b/docs/components/input-amount/use-cases.md @@ -20,9 +20,9 @@ export const negativeNumber = () => html` `; ``` -## Set currency suffix +## Set currency label -You can optionally set a currency suffix with the `currency` attribute. +You can optionally set a currency label with the `currency` attribute, which is visible in the after slot by default. ```js preview-story export const currencySuffix = () => html` @@ -30,6 +30,8 @@ export const currencySuffix = () => html` `; ``` +> The slot of the currency label can be overwritten by changing the `_currencyDisplayNodeSlot` protected property, it can be prefix, suffix, before and after. + ## Force locale Locale can be forced for a specific `lion-input-amount`. It will format the amount according to this locale. diff --git a/package-lock.json b/package-lock.json index aba796092..4720bd539 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,7 +14,7 @@ "devDependencies": { "@babel/core": "^7.10.1", "@bundled-es-modules/fetch-mock": "^6.5.2", - "@changesets/cli": "^2.22.0", + "@changesets/cli": "^2.26.1", "@custom-elements-manifest/analyzer": "^0.5.7", "@open-wc/building-rollup": "^1.2.1", "@open-wc/eslint-config": "^7.0.0", @@ -1990,16 +1990,16 @@ "integrity": "sha512-NGUoPxqsBzDwvRhY3A3L/AhS1hzS9OWappfyDOyCwE7G3W4ua28gau7QwvJz7QzA6ArbAdeb8c1mLjvd1WUFAA==" }, "node_modules/@changesets/apply-release-plan": { - "version": "6.1.2", - "resolved": "https://registry.npmjs.org/@changesets/apply-release-plan/-/apply-release-plan-6.1.2.tgz", - "integrity": "sha512-H8TV9E/WtJsDfoDVbrDGPXmkZFSv7W2KLqp4xX4MKZXshb0hsQZUNowUa8pnus9qb/5OZrFFRVsUsDCVHNW/AQ==", + "version": "6.1.3", + "resolved": "https://registry.npmjs.org/@changesets/apply-release-plan/-/apply-release-plan-6.1.3.tgz", + "integrity": "sha512-ECDNeoc3nfeAe1jqJb5aFQX7CqzQhD2klXRez2JDb/aVpGUbX673HgKrnrgJRuQR/9f2TtLoYIzrGB9qwD77mg==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", - "@changesets/config": "^2.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/config": "^2.3.0", "@changesets/get-version-range-type": "^0.3.2", - "@changesets/git": "^1.5.0", - "@changesets/types": "^5.2.0", + "@changesets/git": "^2.0.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "detect-indent": "^6.0.0", "fs-extra": "^7.0.1", @@ -2020,15 +2020,15 @@ } }, "node_modules/@changesets/assemble-release-plan": { - "version": "5.2.2", - "resolved": "https://registry.npmjs.org/@changesets/assemble-release-plan/-/assemble-release-plan-5.2.2.tgz", - "integrity": "sha512-B1qxErQd85AeZgZFZw2bDKyOfdXHhG+X5S+W3Da2yCem8l/pRy4G/S7iOpEcMwg6lH8q2ZhgbZZwZ817D+aLuQ==", + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/@changesets/assemble-release-plan/-/assemble-release-plan-5.2.3.tgz", + "integrity": "sha512-g7EVZCmnWz3zMBAdrcKhid4hkHT+Ft1n0mLussFMcB1dE2zCuwcvGoy9ec3yOgPGF4hoMtgHaMIk3T3TBdvU9g==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", + "@babel/runtime": "^7.20.1", "@changesets/errors": "^0.1.4", - "@changesets/get-dependents-graph": "^1.3.4", - "@changesets/types": "^5.2.0", + "@changesets/get-dependents-graph": "^1.3.5", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "semver": "^5.4.1" } @@ -2043,34 +2043,34 @@ } }, "node_modules/@changesets/changelog-git": { - "version": "0.1.13", - "resolved": "https://registry.npmjs.org/@changesets/changelog-git/-/changelog-git-0.1.13.tgz", - "integrity": "sha512-zvJ50Q+EUALzeawAxax6nF2WIcSsC5PwbuLeWkckS8ulWnuPYx8Fn/Sjd3rF46OzeKA8t30loYYV6TIzp4DIdg==", + "version": "0.1.14", + "resolved": "https://registry.npmjs.org/@changesets/changelog-git/-/changelog-git-0.1.14.tgz", + "integrity": "sha512-+vRfnKtXVWsDDxGctOfzJsPhaCdXRYoe+KyWYoq5X/GqoISREiat0l3L8B0a453B2B4dfHGcZaGyowHbp9BSaA==", "dev": true, "dependencies": { - "@changesets/types": "^5.2.0" + "@changesets/types": "^5.2.1" } }, "node_modules/@changesets/cli": { - "version": "2.25.2", - "resolved": "https://registry.npmjs.org/@changesets/cli/-/cli-2.25.2.tgz", - "integrity": "sha512-ACScBJXI3kRyMd2R8n8SzfttDHi4tmKSwVwXBazJOylQItSRSF4cGmej2E4FVf/eNfGy6THkL9GzAahU9ErZrA==", + "version": "2.26.1", + "resolved": "https://registry.npmjs.org/@changesets/cli/-/cli-2.26.1.tgz", + "integrity": "sha512-XnTa+b51vt057fyAudvDKGB0Sh72xutQZNAdXkCqPBKO2zvs2yYZx5hFZj1u9cbtpwM6Sxtcr02/FQJfZOzemQ==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", - "@changesets/apply-release-plan": "^6.1.2", - "@changesets/assemble-release-plan": "^5.2.2", - "@changesets/changelog-git": "^0.1.13", - "@changesets/config": "^2.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/apply-release-plan": "^6.1.3", + "@changesets/assemble-release-plan": "^5.2.3", + "@changesets/changelog-git": "^0.1.14", + "@changesets/config": "^2.3.0", "@changesets/errors": "^0.1.4", - "@changesets/get-dependents-graph": "^1.3.4", - "@changesets/get-release-plan": "^3.0.15", - "@changesets/git": "^1.5.0", + "@changesets/get-dependents-graph": "^1.3.5", + "@changesets/get-release-plan": "^3.0.16", + "@changesets/git": "^2.0.0", "@changesets/logger": "^0.0.5", - "@changesets/pre": "^1.0.13", - "@changesets/read": "^0.5.8", - "@changesets/types": "^5.2.0", - "@changesets/write": "^0.2.2", + "@changesets/pre": "^1.0.14", + "@changesets/read": "^0.5.9", + "@changesets/types": "^5.2.1", + "@changesets/write": "^0.2.3", "@manypkg/get-packages": "^1.1.3", "@types/is-ci": "^3.0.0", "@types/semver": "^6.0.0", @@ -2176,15 +2176,15 @@ } }, "node_modules/@changesets/config": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@changesets/config/-/config-2.2.0.tgz", - "integrity": "sha512-GGaokp3nm5FEDk/Fv2PCRcQCOxGKKPRZ7prcMqxEr7VSsG75MnChQE8plaW1k6V8L2bJE+jZWiRm19LbnproOw==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@changesets/config/-/config-2.3.0.tgz", + "integrity": "sha512-EgP/px6mhCx8QeaMAvWtRrgyxW08k/Bx2tpGT+M84jEdX37v3VKfh4Cz1BkwrYKuMV2HZKeHOh8sHvja/HcXfQ==", "dev": true, "dependencies": { "@changesets/errors": "^0.1.4", - "@changesets/get-dependents-graph": "^1.3.4", + "@changesets/get-dependents-graph": "^1.3.5", "@changesets/logger": "^0.0.5", - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "fs-extra": "^7.0.1", "micromatch": "^4.0.2" @@ -2200,12 +2200,12 @@ } }, "node_modules/@changesets/get-dependents-graph": { - "version": "1.3.4", - "resolved": "https://registry.npmjs.org/@changesets/get-dependents-graph/-/get-dependents-graph-1.3.4.tgz", - "integrity": "sha512-+C4AOrrFY146ydrgKOo5vTZfj7vetNu1tWshOID+UjPUU9afYGDXI8yLnAeib1ffeBXV3TuGVcyphKpJ3cKe+A==", + "version": "1.3.5", + "resolved": "https://registry.npmjs.org/@changesets/get-dependents-graph/-/get-dependents-graph-1.3.5.tgz", + "integrity": "sha512-w1eEvnWlbVDIY8mWXqWuYE9oKhvIaBhzqzo4ITSJY9hgoqQ3RoBqwlcAzg11qHxv/b8ReDWnMrpjpKrW6m1ZTA==", "dev": true, "dependencies": { - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "chalk": "^2.1.0", "fs-extra": "^7.0.1", @@ -2293,17 +2293,17 @@ } }, "node_modules/@changesets/get-release-plan": { - "version": "3.0.15", - "resolved": "https://registry.npmjs.org/@changesets/get-release-plan/-/get-release-plan-3.0.15.tgz", - "integrity": "sha512-W1tFwxE178/en+zSj/Nqbc3mvz88mcdqUMJhRzN1jDYqN3QI4ifVaRF9mcWUU+KI0gyYEtYR65tour690PqTcA==", + "version": "3.0.16", + "resolved": "https://registry.npmjs.org/@changesets/get-release-plan/-/get-release-plan-3.0.16.tgz", + "integrity": "sha512-OpP9QILpBp1bY2YNIKFzwigKh7Qe9KizRsZomzLe6pK8IUo8onkAAVUD8+JRKSr8R7d4+JRuQrfSSNlEwKyPYg==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", - "@changesets/assemble-release-plan": "^5.2.2", - "@changesets/config": "^2.2.0", - "@changesets/pre": "^1.0.13", - "@changesets/read": "^0.5.8", - "@changesets/types": "^5.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/assemble-release-plan": "^5.2.3", + "@changesets/config": "^2.3.0", + "@changesets/pre": "^1.0.14", + "@changesets/read": "^0.5.9", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3" } }, @@ -2314,16 +2314,17 @@ "dev": true }, "node_modules/@changesets/git": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/@changesets/git/-/git-1.5.0.tgz", - "integrity": "sha512-Xo8AT2G7rQJSwV87c8PwMm6BAc98BnufRMsML7m7Iw8Or18WFvFmxqG5aOL5PBvhgq9KrKvaeIBNIymracSuHg==", + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@changesets/git/-/git-2.0.0.tgz", + "integrity": "sha512-enUVEWbiqUTxqSnmesyJGWfzd51PY4H7mH9yUw0hPVpZBJ6tQZFMU3F3mT/t9OJ/GjyiM4770i+sehAn6ymx6A==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", + "@babel/runtime": "^7.20.1", "@changesets/errors": "^0.1.4", - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "is-subdir": "^1.1.1", + "micromatch": "^4.0.2", "spawndamnit": "^2.0.0" } }, @@ -2408,39 +2409,39 @@ } }, "node_modules/@changesets/parse": { - "version": "0.3.15", - "resolved": "https://registry.npmjs.org/@changesets/parse/-/parse-0.3.15.tgz", - "integrity": "sha512-3eDVqVuBtp63i+BxEWHPFj2P1s3syk0PTrk2d94W9JD30iG+OER0Y6n65TeLlY8T2yB9Fvj6Ev5Gg0+cKe/ZUA==", + "version": "0.3.16", + "resolved": "https://registry.npmjs.org/@changesets/parse/-/parse-0.3.16.tgz", + "integrity": "sha512-127JKNd167ayAuBjUggZBkmDS5fIKsthnr9jr6bdnuUljroiERW7FBTDNnNVyJ4l69PzR57pk6mXQdtJyBCJKg==", "dev": true, "dependencies": { - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "js-yaml": "^3.13.1" } }, "node_modules/@changesets/pre": { - "version": "1.0.13", - "resolved": "https://registry.npmjs.org/@changesets/pre/-/pre-1.0.13.tgz", - "integrity": "sha512-jrZc766+kGZHDukjKhpBXhBJjVQMied4Fu076y9guY1D3H622NOw8AQaLV3oQsDtKBTrT2AUFjt9Z2Y9Qx+GfA==", + "version": "1.0.14", + "resolved": "https://registry.npmjs.org/@changesets/pre/-/pre-1.0.14.tgz", + "integrity": "sha512-dTsHmxQWEQekHYHbg+M1mDVYFvegDh9j/kySNuDKdylwfMEevTeDouR7IfHNyVodxZXu17sXoJuf2D0vi55FHQ==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", + "@babel/runtime": "^7.20.1", "@changesets/errors": "^0.1.4", - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "fs-extra": "^7.0.1" } }, "node_modules/@changesets/read": { - "version": "0.5.8", - "resolved": "https://registry.npmjs.org/@changesets/read/-/read-0.5.8.tgz", - "integrity": "sha512-eYaNfxemgX7f7ELC58e7yqQICW5FB7V+bd1lKt7g57mxUrTveYME+JPaBPpYx02nP53XI6CQp6YxnR9NfmFPKw==", + "version": "0.5.9", + "resolved": "https://registry.npmjs.org/@changesets/read/-/read-0.5.9.tgz", + "integrity": "sha512-T8BJ6JS6j1gfO1HFq50kU3qawYxa4NTbI/ASNVVCBTsKquy2HYwM9r7ZnzkiMe8IEObAJtUVGSrePCOxAK2haQ==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", - "@changesets/git": "^1.5.0", + "@babel/runtime": "^7.20.1", + "@changesets/git": "^2.0.0", "@changesets/logger": "^0.0.5", - "@changesets/parse": "^0.3.15", - "@changesets/types": "^5.2.0", + "@changesets/parse": "^0.3.16", + "@changesets/types": "^5.2.1", "chalk": "^2.1.0", "fs-extra": "^7.0.1", "p-filter": "^2.1.0" @@ -2518,19 +2519,19 @@ } }, "node_modules/@changesets/types": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/@changesets/types/-/types-5.2.0.tgz", - "integrity": "sha512-km/66KOqJC+eicZXsm2oq8A8bVTSpkZJ60iPV/Nl5Z5c7p9kk8xxh6XGRTlnludHldxOOfudhnDN2qPxtHmXzA==", + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/@changesets/types/-/types-5.2.1.tgz", + "integrity": "sha512-myLfHbVOqaq9UtUKqR/nZA/OY7xFjQMdfgfqeZIBK4d0hA6pgxArvdv8M+6NUzzBsjWLOtvApv8YHr4qM+Kpfg==", "dev": true }, "node_modules/@changesets/write": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/@changesets/write/-/write-0.2.2.tgz", - "integrity": "sha512-kCYNHyF3xaId1Q/QE+DF3UTrHTyg3Cj/f++T8S8/EkC+jh1uK2LFnM9h+EzV+fsmnZDrs7r0J4LLpeI/VWC5Hg==", + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/@changesets/write/-/write-0.2.3.tgz", + "integrity": "sha512-Dbamr7AIMvslKnNYsLFafaVORx4H0pvCA2MHqgtNCySMe1blImEyAEOzDmcgKAkgz4+uwoLz7demIrX+JBr/Xw==", "dev": true, "dependencies": { - "@babel/runtime": "^7.10.4", - "@changesets/types": "^5.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/types": "^5.2.1", "fs-extra": "^7.0.1", "human-id": "^1.0.2", "prettier": "^2.7.1" @@ -3157,9 +3158,8 @@ "node_modules/@manypkg/get-packages/node_modules/globby": { "version": "11.1.0", "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz", - "integrity": "sha1-vUvpi7BC+D15b344EZkfvoKg00s=", + "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==", "dev": true, - "license": "MIT", "dependencies": { "array-union": "^2.1.0", "dir-glob": "^3.0.1", @@ -22361,7 +22361,7 @@ }, "packages/ui": { "name": "@lion/ui", - "version": "0.2.1", + "version": "0.2.2", "license": "MIT", "dependencies": { "@bundled-es-modules/message-format": "^6.0.4", @@ -23719,16 +23719,16 @@ "integrity": "sha512-NGUoPxqsBzDwvRhY3A3L/AhS1hzS9OWappfyDOyCwE7G3W4ua28gau7QwvJz7QzA6ArbAdeb8c1mLjvd1WUFAA==" }, "@changesets/apply-release-plan": { - "version": "6.1.2", - "resolved": "https://registry.npmjs.org/@changesets/apply-release-plan/-/apply-release-plan-6.1.2.tgz", - "integrity": "sha512-H8TV9E/WtJsDfoDVbrDGPXmkZFSv7W2KLqp4xX4MKZXshb0hsQZUNowUa8pnus9qb/5OZrFFRVsUsDCVHNW/AQ==", + "version": "6.1.3", + "resolved": "https://registry.npmjs.org/@changesets/apply-release-plan/-/apply-release-plan-6.1.3.tgz", + "integrity": "sha512-ECDNeoc3nfeAe1jqJb5aFQX7CqzQhD2klXRez2JDb/aVpGUbX673HgKrnrgJRuQR/9f2TtLoYIzrGB9qwD77mg==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", - "@changesets/config": "^2.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/config": "^2.3.0", "@changesets/get-version-range-type": "^0.3.2", - "@changesets/git": "^1.5.0", - "@changesets/types": "^5.2.0", + "@changesets/git": "^2.0.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "detect-indent": "^6.0.0", "fs-extra": "^7.0.1", @@ -23748,15 +23748,15 @@ } }, "@changesets/assemble-release-plan": { - "version": "5.2.2", - "resolved": "https://registry.npmjs.org/@changesets/assemble-release-plan/-/assemble-release-plan-5.2.2.tgz", - "integrity": "sha512-B1qxErQd85AeZgZFZw2bDKyOfdXHhG+X5S+W3Da2yCem8l/pRy4G/S7iOpEcMwg6lH8q2ZhgbZZwZ817D+aLuQ==", + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/@changesets/assemble-release-plan/-/assemble-release-plan-5.2.3.tgz", + "integrity": "sha512-g7EVZCmnWz3zMBAdrcKhid4hkHT+Ft1n0mLussFMcB1dE2zCuwcvGoy9ec3yOgPGF4hoMtgHaMIk3T3TBdvU9g==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", + "@babel/runtime": "^7.20.1", "@changesets/errors": "^0.1.4", - "@changesets/get-dependents-graph": "^1.3.4", - "@changesets/types": "^5.2.0", + "@changesets/get-dependents-graph": "^1.3.5", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "semver": "^5.4.1" }, @@ -23770,34 +23770,34 @@ } }, "@changesets/changelog-git": { - "version": "0.1.13", - "resolved": "https://registry.npmjs.org/@changesets/changelog-git/-/changelog-git-0.1.13.tgz", - "integrity": "sha512-zvJ50Q+EUALzeawAxax6nF2WIcSsC5PwbuLeWkckS8ulWnuPYx8Fn/Sjd3rF46OzeKA8t30loYYV6TIzp4DIdg==", + "version": "0.1.14", + "resolved": "https://registry.npmjs.org/@changesets/changelog-git/-/changelog-git-0.1.14.tgz", + "integrity": "sha512-+vRfnKtXVWsDDxGctOfzJsPhaCdXRYoe+KyWYoq5X/GqoISREiat0l3L8B0a453B2B4dfHGcZaGyowHbp9BSaA==", "dev": true, "requires": { - "@changesets/types": "^5.2.0" + "@changesets/types": "^5.2.1" } }, "@changesets/cli": { - "version": "2.25.2", - "resolved": "https://registry.npmjs.org/@changesets/cli/-/cli-2.25.2.tgz", - "integrity": "sha512-ACScBJXI3kRyMd2R8n8SzfttDHi4tmKSwVwXBazJOylQItSRSF4cGmej2E4FVf/eNfGy6THkL9GzAahU9ErZrA==", + "version": "2.26.1", + "resolved": "https://registry.npmjs.org/@changesets/cli/-/cli-2.26.1.tgz", + "integrity": "sha512-XnTa+b51vt057fyAudvDKGB0Sh72xutQZNAdXkCqPBKO2zvs2yYZx5hFZj1u9cbtpwM6Sxtcr02/FQJfZOzemQ==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", - "@changesets/apply-release-plan": "^6.1.2", - "@changesets/assemble-release-plan": "^5.2.2", - "@changesets/changelog-git": "^0.1.13", - "@changesets/config": "^2.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/apply-release-plan": "^6.1.3", + "@changesets/assemble-release-plan": "^5.2.3", + "@changesets/changelog-git": "^0.1.14", + "@changesets/config": "^2.3.0", "@changesets/errors": "^0.1.4", - "@changesets/get-dependents-graph": "^1.3.4", - "@changesets/get-release-plan": "^3.0.15", - "@changesets/git": "^1.5.0", + "@changesets/get-dependents-graph": "^1.3.5", + "@changesets/get-release-plan": "^3.0.16", + "@changesets/git": "^2.0.0", "@changesets/logger": "^0.0.5", - "@changesets/pre": "^1.0.13", - "@changesets/read": "^0.5.8", - "@changesets/types": "^5.2.0", - "@changesets/write": "^0.2.2", + "@changesets/pre": "^1.0.14", + "@changesets/read": "^0.5.9", + "@changesets/types": "^5.2.1", + "@changesets/write": "^0.2.3", "@manypkg/get-packages": "^1.1.3", "@types/is-ci": "^3.0.0", "@types/semver": "^6.0.0", @@ -23884,15 +23884,15 @@ } }, "@changesets/config": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@changesets/config/-/config-2.2.0.tgz", - "integrity": "sha512-GGaokp3nm5FEDk/Fv2PCRcQCOxGKKPRZ7prcMqxEr7VSsG75MnChQE8plaW1k6V8L2bJE+jZWiRm19LbnproOw==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@changesets/config/-/config-2.3.0.tgz", + "integrity": "sha512-EgP/px6mhCx8QeaMAvWtRrgyxW08k/Bx2tpGT+M84jEdX37v3VKfh4Cz1BkwrYKuMV2HZKeHOh8sHvja/HcXfQ==", "dev": true, "requires": { "@changesets/errors": "^0.1.4", - "@changesets/get-dependents-graph": "^1.3.4", + "@changesets/get-dependents-graph": "^1.3.5", "@changesets/logger": "^0.0.5", - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "fs-extra": "^7.0.1", "micromatch": "^4.0.2" @@ -23908,12 +23908,12 @@ } }, "@changesets/get-dependents-graph": { - "version": "1.3.4", - "resolved": "https://registry.npmjs.org/@changesets/get-dependents-graph/-/get-dependents-graph-1.3.4.tgz", - "integrity": "sha512-+C4AOrrFY146ydrgKOo5vTZfj7vetNu1tWshOID+UjPUU9afYGDXI8yLnAeib1ffeBXV3TuGVcyphKpJ3cKe+A==", + "version": "1.3.5", + "resolved": "https://registry.npmjs.org/@changesets/get-dependents-graph/-/get-dependents-graph-1.3.5.tgz", + "integrity": "sha512-w1eEvnWlbVDIY8mWXqWuYE9oKhvIaBhzqzo4ITSJY9hgoqQ3RoBqwlcAzg11qHxv/b8ReDWnMrpjpKrW6m1ZTA==", "dev": true, "requires": { - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "chalk": "^2.1.0", "fs-extra": "^7.0.1", @@ -23985,17 +23985,17 @@ } }, "@changesets/get-release-plan": { - "version": "3.0.15", - "resolved": "https://registry.npmjs.org/@changesets/get-release-plan/-/get-release-plan-3.0.15.tgz", - "integrity": "sha512-W1tFwxE178/en+zSj/Nqbc3mvz88mcdqUMJhRzN1jDYqN3QI4ifVaRF9mcWUU+KI0gyYEtYR65tour690PqTcA==", + "version": "3.0.16", + "resolved": "https://registry.npmjs.org/@changesets/get-release-plan/-/get-release-plan-3.0.16.tgz", + "integrity": "sha512-OpP9QILpBp1bY2YNIKFzwigKh7Qe9KizRsZomzLe6pK8IUo8onkAAVUD8+JRKSr8R7d4+JRuQrfSSNlEwKyPYg==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", - "@changesets/assemble-release-plan": "^5.2.2", - "@changesets/config": "^2.2.0", - "@changesets/pre": "^1.0.13", - "@changesets/read": "^0.5.8", - "@changesets/types": "^5.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/assemble-release-plan": "^5.2.3", + "@changesets/config": "^2.3.0", + "@changesets/pre": "^1.0.14", + "@changesets/read": "^0.5.9", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3" } }, @@ -24006,16 +24006,17 @@ "dev": true }, "@changesets/git": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/@changesets/git/-/git-1.5.0.tgz", - "integrity": "sha512-Xo8AT2G7rQJSwV87c8PwMm6BAc98BnufRMsML7m7Iw8Or18WFvFmxqG5aOL5PBvhgq9KrKvaeIBNIymracSuHg==", + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@changesets/git/-/git-2.0.0.tgz", + "integrity": "sha512-enUVEWbiqUTxqSnmesyJGWfzd51PY4H7mH9yUw0hPVpZBJ6tQZFMU3F3mT/t9OJ/GjyiM4770i+sehAn6ymx6A==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", + "@babel/runtime": "^7.20.1", "@changesets/errors": "^0.1.4", - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "is-subdir": "^1.1.1", + "micromatch": "^4.0.2", "spawndamnit": "^2.0.0" } }, @@ -24087,39 +24088,39 @@ } }, "@changesets/parse": { - "version": "0.3.15", - "resolved": "https://registry.npmjs.org/@changesets/parse/-/parse-0.3.15.tgz", - "integrity": "sha512-3eDVqVuBtp63i+BxEWHPFj2P1s3syk0PTrk2d94W9JD30iG+OER0Y6n65TeLlY8T2yB9Fvj6Ev5Gg0+cKe/ZUA==", + "version": "0.3.16", + "resolved": "https://registry.npmjs.org/@changesets/parse/-/parse-0.3.16.tgz", + "integrity": "sha512-127JKNd167ayAuBjUggZBkmDS5fIKsthnr9jr6bdnuUljroiERW7FBTDNnNVyJ4l69PzR57pk6mXQdtJyBCJKg==", "dev": true, "requires": { - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "js-yaml": "^3.13.1" } }, "@changesets/pre": { - "version": "1.0.13", - "resolved": "https://registry.npmjs.org/@changesets/pre/-/pre-1.0.13.tgz", - "integrity": "sha512-jrZc766+kGZHDukjKhpBXhBJjVQMied4Fu076y9guY1D3H622NOw8AQaLV3oQsDtKBTrT2AUFjt9Z2Y9Qx+GfA==", + "version": "1.0.14", + "resolved": "https://registry.npmjs.org/@changesets/pre/-/pre-1.0.14.tgz", + "integrity": "sha512-dTsHmxQWEQekHYHbg+M1mDVYFvegDh9j/kySNuDKdylwfMEevTeDouR7IfHNyVodxZXu17sXoJuf2D0vi55FHQ==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", + "@babel/runtime": "^7.20.1", "@changesets/errors": "^0.1.4", - "@changesets/types": "^5.2.0", + "@changesets/types": "^5.2.1", "@manypkg/get-packages": "^1.1.3", "fs-extra": "^7.0.1" } }, "@changesets/read": { - "version": "0.5.8", - "resolved": "https://registry.npmjs.org/@changesets/read/-/read-0.5.8.tgz", - "integrity": "sha512-eYaNfxemgX7f7ELC58e7yqQICW5FB7V+bd1lKt7g57mxUrTveYME+JPaBPpYx02nP53XI6CQp6YxnR9NfmFPKw==", + "version": "0.5.9", + "resolved": "https://registry.npmjs.org/@changesets/read/-/read-0.5.9.tgz", + "integrity": "sha512-T8BJ6JS6j1gfO1HFq50kU3qawYxa4NTbI/ASNVVCBTsKquy2HYwM9r7ZnzkiMe8IEObAJtUVGSrePCOxAK2haQ==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", - "@changesets/git": "^1.5.0", + "@babel/runtime": "^7.20.1", + "@changesets/git": "^2.0.0", "@changesets/logger": "^0.0.5", - "@changesets/parse": "^0.3.15", - "@changesets/types": "^5.2.0", + "@changesets/parse": "^0.3.16", + "@changesets/types": "^5.2.1", "chalk": "^2.1.0", "fs-extra": "^7.0.1", "p-filter": "^2.1.0" @@ -24184,19 +24185,19 @@ } }, "@changesets/types": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/@changesets/types/-/types-5.2.0.tgz", - "integrity": "sha512-km/66KOqJC+eicZXsm2oq8A8bVTSpkZJ60iPV/Nl5Z5c7p9kk8xxh6XGRTlnludHldxOOfudhnDN2qPxtHmXzA==", + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/@changesets/types/-/types-5.2.1.tgz", + "integrity": "sha512-myLfHbVOqaq9UtUKqR/nZA/OY7xFjQMdfgfqeZIBK4d0hA6pgxArvdv8M+6NUzzBsjWLOtvApv8YHr4qM+Kpfg==", "dev": true }, "@changesets/write": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/@changesets/write/-/write-0.2.2.tgz", - "integrity": "sha512-kCYNHyF3xaId1Q/QE+DF3UTrHTyg3Cj/f++T8S8/EkC+jh1uK2LFnM9h+EzV+fsmnZDrs7r0J4LLpeI/VWC5Hg==", + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/@changesets/write/-/write-0.2.3.tgz", + "integrity": "sha512-Dbamr7AIMvslKnNYsLFafaVORx4H0pvCA2MHqgtNCySMe1blImEyAEOzDmcgKAkgz4+uwoLz7demIrX+JBr/Xw==", "dev": true, "requires": { - "@babel/runtime": "^7.10.4", - "@changesets/types": "^5.2.0", + "@babel/runtime": "^7.20.1", + "@changesets/types": "^5.2.1", "fs-extra": "^7.0.1", "human-id": "^1.0.2", "prettier": "^2.7.1" @@ -24759,7 +24760,7 @@ "globby": { "version": "11.1.0", "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz", - "integrity": "sha1-vUvpi7BC+D15b344EZkfvoKg00s=", + "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==", "dev": true, "requires": { "array-union": "^2.1.0", diff --git a/package.json b/package.json index 616d7606e..9830263ef 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "devDependencies": { "@babel/core": "^7.10.1", "@bundled-es-modules/fetch-mock": "^6.5.2", - "@changesets/cli": "^2.22.0", + "@changesets/cli": "^2.26.1", "@custom-elements-manifest/analyzer": "^0.5.7", "@open-wc/building-rollup": "^1.2.1", "@open-wc/eslint-config": "^7.0.0", diff --git a/packages/ui/components/input-amount/src/LionInputAmount.js b/packages/ui/components/input-amount/src/LionInputAmount.js index df4b9a350..1da06d275 100644 --- a/packages/ui/components/input-amount/src/LionInputAmount.js +++ b/packages/ui/components/input-amount/src/LionInputAmount.js @@ -31,6 +31,11 @@ export class LionInputAmount extends LocalizeMixin(LionInput) { * validators. */ modelValue: Number, + /** + * The slot to put the currency display node in. Can be 'prefix', 'suffix', 'before' and 'after'. + * Default will be 'after'. + */ + _currencyDisplayNodeSlot: { attribute: false }, locale: { attribute: false }, }; } @@ -38,7 +43,7 @@ export class LionInputAmount extends LocalizeMixin(LionInput) { get slots() { return { ...super.slots, - after: () => { + [this._currencyDisplayNodeSlot]: () => { const el = document.createElement('span'); // The data-label attribute will make sure that FormControl adds this to // input[aria-labelledby] @@ -70,6 +75,8 @@ export class LionInputAmount extends LocalizeMixin(LionInput) { this.locale = undefined; this.__currencyDisplayNodeIsConnected = true; this.defaultValidators.push(new IsNumber()); + /** @protected */ + this._currencyDisplayNodeSlot = 'after'; } connectedCallback() { @@ -103,14 +110,14 @@ export class LionInputAmount extends LocalizeMixin(LionInput) { /** * Upon connecting slot mixin, we should check if - * the after slot was created by the slot mixin, + * the required slot was created by the slot mixin, * and if so, we should execute the currency changed flow * which evaluates whether the slot node should be * removed for invalid currencies */ _connectSlotMixin() { super._connectSlotMixin(); - if (this._isPrivateSlot('after')) { + if (this._isPrivateSlot(this._currencyDisplayNodeSlot)) { this._onCurrencyChanged({ currency: this.currency || null }); } } @@ -179,7 +186,9 @@ export class LionInputAmount extends LocalizeMixin(LionInput) { * @private */ get __currencyDisplayNode() { - const node = Array.from(this.children).find(child => child.slot === 'after'); + const node = Array.from(this.children).find( + child => child.slot === this._currencyDisplayNodeSlot, + ); if (node) { this.__storedCurrencyDisplayNode = node; } diff --git a/packages/ui/components/input-amount/test/lion-input-amount.test.js b/packages/ui/components/input-amount/test/lion-input-amount.test.js index 5929ba4db..364c836be 100644 --- a/packages/ui/components/input-amount/test/lion-input-amount.test.js +++ b/packages/ui/components/input-amount/test/lion-input-amount.test.js @@ -3,13 +3,12 @@ import { html } from 'lit'; import { localize } from '@lion/ui/localize.js'; import { localizeTearDown } from '@lion/ui/localize-test-helpers.js'; import { getInputMembers } from '@lion/ui/input-test-helpers.js'; -import { formatAmount, parseAmount } from '@lion/ui/input-amount.js'; +import { LionInputAmount, formatAmount, parseAmount } from '@lion/ui/input-amount.js'; import '@lion/ui/define/lion-input-amount.js'; /** * @typedef {import('../../input/src/LionInput.js').LionInput} LionInput - * @typedef {import('../src/LionInputAmount.js').LionInputAmount} LionInputAmount */ describe('', () => { @@ -187,24 +186,6 @@ describe('', () => { ).to.equal('USD'); }); - it('ignores currency if a suffix is already present', async () => { - const el = /** @type {LionInputAmount} */ ( - await fixture( - `my-currency`, - ) - ); - expect( - /** @type {HTMLElement[]} */ (Array.from(el.children)).find(child => child.slot === 'suffix') - ?.innerText, - ).to.equal('my-currency'); - el.currency = 'EUR'; - await el.updateComplete; - expect( - /** @type {HTMLElement[]} */ (Array.from(el.children)).find(child => child.slot === 'suffix') - ?.innerText, - ).to.equal('my-currency'); - }); - it('reformats on locale changes', async () => { const el = /** @type {LionInputAmount} */ ( await fixture( @@ -275,6 +256,24 @@ describe('', () => { expect(currLabel?.innerText).to.equal('EUR'); }); + it('can override the currency label slot', async () => { + customElements.define( + 'my-input-amount', + class extends LionInputAmount { + constructor() { + super(); + // Put the currency label in the suffix slot + this._currencyDisplayNodeSlot = 'suffix'; + } + }, + ); + const el = await fixture(html``); + expect( + /** @type {HTMLElement[]} */ (Array.from(el.children)).find(child => child.slot === 'suffix') + ?.innerText, + ).to.equal('EUR'); + }); + describe('Accessibility', () => { it('is accessible', async () => { const el = await fixture(