Skip to content

Commit 365a897

Browse files
bartvenemanBart Veneman
andauthored
feat: add com.projectwallace.usage-count extension (#21)
* consistent TokenID naming * fix types + tests && make extensions.authored-as required * feat: add `com.projectwallace.usage-count` extension --------- Co-authored-by: Bart Veneman <[email protected]>
1 parent ca82f6f commit 365a897

File tree

8 files changed

+160
-102
lines changed

8 files changed

+160
-102
lines changed

src/colors.ts

Lines changed: 13 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { colorKeywords as color_keywords, cssKeywords as css_keywords } from '@projectwallace/css-analyzer'
2-
import { EXTENSION_AUTHORED_AS, type ColorToken, type UnparsedToken } from './types.js'
2+
import { EXTENSION_AUTHORED_AS, type ColorToken, type ColorValue, type UnparsedToken } from './types.js'
33
import {
44
parse,
55
ColorSpace,
@@ -51,22 +51,16 @@ ColorSpace.register(OKLab)
5151
ColorSpace.register(OKLCH)
5252
ColorSpace.register(OKLrab)
5353

54-
export function color_to_token(color: string): ColorToken | UnparsedToken | null {
54+
export function color_to_token(color: string): ColorValue | null {
5555
let lowercased = color.toLowerCase()
5656

5757
// The keyword "transparent" specifies a transparent black.
5858
// > https://drafts.csswg.org/css-color-4/#transparent-color
5959
if (lowercased === 'transparent') {
6060
return {
61-
$type: 'color',
62-
$value: {
63-
colorSpace: 'srgb',
64-
components: [0, 0, 0],
65-
alpha: 0,
66-
},
67-
$extensions: {
68-
[EXTENSION_AUTHORED_AS]: color
69-
}
61+
colorSpace: 'srgb',
62+
components: [0, 0, 0],
63+
alpha: 0,
7064
}
7165
}
7266

@@ -83,27 +77,16 @@ export function color_to_token(color: string): ColorToken | UnparsedToken | null
8377
let [component_a, component_b, component_c] = parsed_color.coords
8478

8579
return {
86-
$type: 'color',
87-
$value: {
88-
colorSpace: parsed_color.spaceId,
89-
components: [
90-
component_a ?? 'none',
91-
component_b ?? 'none',
92-
component_c ?? 'none',
93-
],
94-
alpha: parsed_color.alpha ?? 0,
95-
},
96-
$extensions: {
97-
[EXTENSION_AUTHORED_AS]: color
98-
}
80+
colorSpace: parsed_color.spaceId,
81+
components: [
82+
component_a ?? 'none',
83+
component_b ?? 'none',
84+
component_c ?? 'none',
85+
],
86+
alpha: parsed_color.alpha ?? 0,
9987
}
10088
} catch (error) {
10189
// A catch for edge cases that we don't support yet.
102-
return {
103-
$value: color,
104-
$extensions: {
105-
[EXTENSION_AUTHORED_AS]: color
106-
}
107-
}
90+
return null
10891
}
10992
}

src/destructure-box-shadow.test.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -142,7 +142,7 @@ test('multiple shadows', () => {
142142
inset: false
143143
},
144144
{
145-
color: color_to_token('#fff')?.$value,
145+
color: color_to_token('#fff'),
146146
offsetX: create_px_length(0),
147147
offsetY: create_px_length(0),
148148
blur: create_px_length(0),
@@ -165,7 +165,7 @@ describe('color formats', () => {
165165
test(`1px ${color}`, () => {
166166
expect(destructure_box_shadow(`1px ${color}`)).toEqual([
167167
{
168-
color: color_to_token(color)?.$value,
168+
color: color_to_token(color),
169169
offsetX: create_px_length(1),
170170
offsetY: create_px_length(0),
171171
blur: create_px_length(0),

src/destructure-box-shadow.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -54,10 +54,10 @@ export function destructure_box_shadow(value: string): null | DestructuredShadow
5454
current_shadow.inset = true
5555
} else if (named_colors.has(node.name) || system_colors.has(node.name)) {
5656
let color_token = color_to_token(node.name)
57-
if (color_token === null || color_token.$type !== 'color') {
57+
if (color_token === null) {
5858
return
5959
}
60-
current_shadow.color = color_token.$value
60+
current_shadow.color = color_token
6161
}
6262
}
6363
else if (node.type === 'Dimension' || (node.type === 'Number' && node.value === '0')) {
@@ -82,24 +82,24 @@ export function destructure_box_shadow(value: string): null | DestructuredShadow
8282
else if (node.type === 'Function') {
8383
if (color_functions.has(node.name)) {
8484
let color_token = color_to_token(generate(node))
85-
if (color_token === null || color_token.$type !== 'color') {
85+
if (color_token === null) {
8686
return
8787
}
88-
current_shadow.color = color_token.$value
88+
current_shadow.color = color_token
8989
} else if (node.name.toLowerCase() === 'var' && !current_shadow.color) {
9090
let color_token = color_to_token(generate(node))
91-
if (color_token === null || color_token.$type !== 'color') {
91+
if (color_token === null) {
9292
return
9393
}
94-
current_shadow.color = color_token.$value
94+
current_shadow.color = color_token
9595
}
9696
}
9797
else if (node.type === 'Hash') {
9898
let color_token = color_to_token(generate(node))
99-
if (color_token === null || color_token.$type !== 'color') {
99+
if (color_token === null) {
100100
return
101101
}
102-
current_shadow.color = color_token.$value
102+
current_shadow.color = color_token
103103
}
104104
else if (node.type === 'Operator' && node.value === ',') {
105105
// Start a new shadow, but only after we've made sure that the current shadow is valid
@@ -138,7 +138,7 @@ function complete_shadow_token(token: DestructuredShadow) {
138138
token.spread = DIMENSION_ZERO
139139
}
140140
if (!token.color) {
141-
token.color = (color_to_token('#000') as ColorToken)?.$value
141+
token.color = color_to_token('#000')!
142142
}
143143
return token
144144
}

src/destructure-easing.test.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -36,21 +36,21 @@ describe('cubic-bezier', () => {
3636

3737
describe('unsupported', () => {
3838
test('var(--test)', () => {
39-
expect(destructure_easing('var(--test)')).toBeUndefined()
39+
expect(destructure_easing('var(--test)')).toBeNull()
4040
})
4141
test('var(--test, ease-in)', () => {
42-
expect(destructure_easing('var(--test, ease-in)')).toBeUndefined()
42+
expect(destructure_easing('var(--test, ease-in)')).toBeNull()
4343
})
4444
test('step-start', () => {
45-
expect(destructure_easing('step-start')).toBeUndefined()
45+
expect(destructure_easing('step-start')).toBeNull()
4646
})
4747
test('steps(4, end)', () => {
48-
expect(destructure_easing('steps(4, end)')).toBeUndefined()
48+
expect(destructure_easing('steps(4, end)')).toBeNull()
4949
})
5050
test('cubic-bezier(1, var(--test), 0 0)', () => {
51-
expect(destructure_easing('cubic-bezier(1, var(--test), 0 0)')).toBeUndefined()
51+
expect(destructure_easing('cubic-bezier(1, var(--test), 0 0)')).toBeNull()
5252
})
5353
test('cubic-bezier(1, 2, 3)', () => {
54-
expect(destructure_easing('cubic-bezier(1, 2, 3)')).toBeUndefined()
54+
expect(destructure_easing('cubic-bezier(1, 2, 3)')).toBeNull()
5555
})
5656
})

src/destructure-easing.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,15 +8,15 @@ const EASING_KEYWORDS = new Map<string, Easing>([
88
['ease-in-out', [0.42, 0, 0.58, 1]]
99
])
1010

11-
export function destructure_easing(easing: string): Easing | undefined {
11+
export function destructure_easing(easing: string): Easing | null {
1212
easing = easing.trim().toLowerCase()
1313

1414
if (EASING_KEYWORDS.has(easing)) {
1515
return EASING_KEYWORDS.get(easing) as Easing
1616
}
1717

1818
if (easing.includes('var(')) {
19-
return undefined
19+
return null
2020
}
2121

2222
if (easing.startsWith('cubic-bezier(')) {
@@ -30,5 +30,5 @@ export function destructure_easing(easing: string): Easing | undefined {
3030
}
3131
}
3232

33-
return undefined
33+
return null
3434
}

0 commit comments

Comments
 (0)