Skip to content

Commit 316320e

Browse files
authored
fix(bezier-tokens): fix invalid letter spacing token values (#1821)
<!-- How to write a good PR title: - Follow [the Conventional Commits specification](https://www.conventionalcommits.org/en/v1.0.0/). - Give as much context as necessary and as little as possible - Prefix it with [WIP] while it’s a work in progress --> ## Self Checklist - [x] I wrote a PR title in **English** and added an appropriate **label** to the PR. - [x] I wrote the commit message in **English** and to follow [**the Conventional Commits specification**](https://www.conventionalcommits.org/en/v1.0.0/). - [x] I [added the **changeset**](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md) about the changes that needed to be released. (or didn't have to) - [x] I wrote or updated **documentation** related to the changes. (or didn't have to) - [x] I wrote or updated **tests** related to the changes. (or didn't have to) - [x] I tested the changes in various browsers. (or didn't have to) - Windows: Chrome, Edge, (Optional) Firefox - macOS: Chrome, Edge, Safari, (Optional) Firefox ## Summary <!-- Please brief explanation of the changes made --> letter spacing 관련 토큰 값이 잘못 변환되던 문제를 수정합니다. ## Details <!-- Please elaborate description of the changes --> 기존 `extractNumber` 정규식이 숫자만 매칭했기 때문에, 소숫점이 포함된 letter spacing 토큰이 소숫점을 무시한채로 필터링되었습니다. 예컨대 `0.1` 이 `01` 로 필터링이 되면서, parseFloat에 의해 `1` 로 변환이 되었고 결과적으로 10배 높은 값으로 변환되었습니다. 올바르게 동작할 수 있도록 정규식을 개선합니다. 이제 부호와 소숫점 모두 포함하여 필터링할 수 있게 됩니다. ### Breaking change? (Yes/No) <!-- If Yes, please describe the impact and migration path for users --> No ## References <!-- Please list any other resources or points the reviewer should be aware of --> <img width="795" alt="image" src="https://github.com/channel-io/bezier-react/assets/58209009/fe99b93c-77aa-4073-b4eb-46d7068b9a9d">
1 parent 7d98d23 commit 316320e

File tree

3 files changed

+7
-9
lines changed

3 files changed

+7
-9
lines changed

.changeset/purple-dodos-move.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@channel.io/bezier-tokens": minor
3+
---
4+
5+
Fix invalid letter spacing token values

packages/bezier-tokens/scripts/lib/transform.ts

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,14 +18,7 @@ export const CSSTransforms = {
1818
transitive: true,
1919
matcher: (token) =>
2020
token.attributes?.category === 'font' && token.type === 'dimension',
21-
transformer: ({ value }: { value: string }, options) => {
22-
const extractedNumber = extractNumber(value)
23-
const isNegative = value.trim().startsWith('-')
24-
const numberValue =
25-
parseFloat(extractedNumber ?? '') /
26-
((options && options.basePxFontSize) || 16)
27-
return `${isNegative ? -numberValue : numberValue}rem`
28-
},
21+
transformer: ({ value }: { value: string }, options) => `${parseFloat(extractNumber(value) ?? '') / ((options && options.basePxFontSize) || 16)}rem`,
2922
},
3023
fontFamily: {
3124
name: 'custom/css/font/family',
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
export const toCamelCase = (str: string) =>
22
str.toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, (_, char) => char.toUpperCase())
33

4-
export const extractNumber = (str: string) => str.match(/\d+/g)?.join('')
4+
export const extractNumber = (str: string) => str.match(/-?\d+(\.\d+)?/g)?.join('')
55

66
export const toCSSDimension = (value: string) => (/^0[a-zA-Z]+$/.test(value) ? 0 : value)

0 commit comments

Comments
 (0)