Skip to content

Commit 7cdaf1c

Browse files
authored
breaking: rename several APIs to match csstree more closely (#38)
My muscle memory keeps thinking about nodes and their names like csstree nodes so I'm renaming them to match csstree. Also matching csstree by using the same node types for supports queries, identifiers, urls and layer names in (mostly import) atrules. `du -sh dist/` reports a 4kB win on top of this
1 parent ed9db8a commit 7cdaf1c

21 files changed

+1231
-1362
lines changed

API.md

Lines changed: 118 additions & 122 deletions
Large diffs are not rendered by default.

src/arena.test.ts

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { describe, test, expect } from 'vitest'
2-
import { CSSDataArena, NODE_STYLESHEET, NODE_DECLARATION, FLAG_IMPORTANT, FLAG_HAS_ERROR } from './arena'
2+
import { CSSDataArena, STYLESHEET, DECLARATION, FLAG_IMPORTANT, FLAG_HAS_ERROR } from './arena'
33

44
describe('CSSDataArena', () => {
55
describe('initialization', () => {
@@ -51,23 +51,23 @@ describe('CSSDataArena', () => {
5151
const node2 = arena.create_node()
5252

5353
// Set data on existing nodes
54-
arena.set_type(node1, NODE_STYLESHEET)
54+
arena.set_type(node1, STYLESHEET)
5555
arena.set_start_offset(node1, 100)
56-
arena.set_type(node2, NODE_DECLARATION)
56+
arena.set_type(node2, DECLARATION)
5757
arena.set_start_offset(node2, 200)
5858

5959
// Trigger growth
6060
const node3 = arena.create_node()
6161

6262
// Verify old data is preserved
63-
expect(arena.get_type(node1)).toBe(NODE_STYLESHEET)
63+
expect(arena.get_type(node1)).toBe(STYLESHEET)
6464
expect(arena.get_start_offset(node1)).toBe(100)
65-
expect(arena.get_type(node2)).toBe(NODE_DECLARATION)
65+
expect(arena.get_type(node2)).toBe(DECLARATION)
6666
expect(arena.get_start_offset(node2)).toBe(200)
6767

6868
// Verify new node can be used
69-
arena.set_type(node3, NODE_STYLESHEET)
70-
expect(arena.get_type(node3)).toBe(NODE_STYLESHEET)
69+
arena.set_type(node3, STYLESHEET)
70+
expect(arena.get_type(node3)).toBe(STYLESHEET)
7171
})
7272
})
7373

@@ -86,8 +86,8 @@ describe('CSSDataArena', () => {
8686
const arena = new CSSDataArena(10)
8787
const node = arena.create_node()
8888

89-
arena.set_type(node, NODE_STYLESHEET)
90-
expect(arena.get_type(node)).toBe(NODE_STYLESHEET)
89+
arena.set_type(node, STYLESHEET)
90+
expect(arena.get_type(node)).toBe(STYLESHEET)
9191
})
9292

9393
test('should write and read node flags', () => {
@@ -102,15 +102,15 @@ describe('CSSDataArena', () => {
102102
const arena = new CSSDataArena(10)
103103
const node = arena.create_node()
104104

105-
arena.set_type(node, NODE_DECLARATION)
105+
arena.set_type(node, DECLARATION)
106106
arena.set_flags(node, FLAG_IMPORTANT)
107107
arena.set_start_offset(node, 100)
108108
arena.set_length(node, 50)
109109
arena.set_content_start(node, 110)
110110
arena.set_content_length(node, 30)
111111
arena.set_start_line(node, 5)
112112

113-
expect(arena.get_type(node)).toBe(NODE_DECLARATION)
113+
expect(arena.get_type(node)).toBe(DECLARATION)
114114
expect(arena.get_flags(node)).toBe(FLAG_IMPORTANT)
115115
expect(arena.get_start_offset(node)).toBe(100)
116116
expect(arena.get_length(node)).toBe(50)
@@ -124,15 +124,15 @@ describe('CSSDataArena', () => {
124124
const node1 = arena.create_node()
125125
const node2 = arena.create_node()
126126

127-
arena.set_type(node1, NODE_STYLESHEET)
127+
arena.set_type(node1, STYLESHEET)
128128
arena.set_start_offset(node1, 0)
129129

130-
arena.set_type(node2, NODE_DECLARATION)
130+
arena.set_type(node2, DECLARATION)
131131
arena.set_start_offset(node2, 100)
132132

133-
expect(arena.get_type(node1)).toBe(NODE_STYLESHEET)
133+
expect(arena.get_type(node1)).toBe(STYLESHEET)
134134
expect(arena.get_start_offset(node1)).toBe(0)
135-
expect(arena.get_type(node2)).toBe(NODE_DECLARATION)
135+
expect(arena.get_type(node2)).toBe(DECLARATION)
136136
expect(arena.get_start_offset(node2)).toBe(100)
137137
})
138138
})

src/arena.ts

Lines changed: 36 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -23,51 +23,48 @@
2323
let BYTES_PER_NODE = 40
2424

2525
// Node type constants
26-
export const NODE_STYLESHEET = 1
27-
export const NODE_STYLE_RULE = 2
28-
export const NODE_AT_RULE = 3
29-
export const NODE_DECLARATION = 4
30-
export const NODE_SELECTOR = 5
31-
export const NODE_COMMENT = 6
32-
export const NODE_BLOCK = 7 // Block container for declarations and nested rules
26+
export const STYLESHEET = 1
27+
export const STYLE_RULE = 2
28+
export const AT_RULE = 3
29+
export const DECLARATION = 4
30+
export const SELECTOR = 5
31+
export const COMMENT = 6
32+
export const BLOCK = 7 // Block container for declarations and nested rules
3333

3434
// Value node type constants (for declaration values)
35-
export const NODE_VALUE_KEYWORD = 10 // identifier: red, auto, inherit
36-
export const NODE_VALUE_NUMBER = 11 // number: 42, 3.14, -5
37-
export const NODE_VALUE_DIMENSION = 12 // number with unit: 10px, 2em, 50%
38-
export const NODE_VALUE_STRING = 13 // quoted string: "hello", 'world'
39-
export const NODE_VALUE_COLOR = 14 // hex color: #fff, #ff0000
40-
export const NODE_VALUE_FUNCTION = 15 // function: calc(), var(), url()
41-
export const NODE_VALUE_OPERATOR = 16 // operator: +, -, *, /, comma
42-
export const NODE_VALUE_PARENTHESIS = 17 // parenthesized expression: (100% - 50px)
35+
export const IDENTIFIER = 10 // identifier: red, auto, inherit
36+
export const NUMBER = 11 // number: 42, 3.14, -5
37+
export const DIMENSION = 12 // number with unit: 10px, 2em, 50%
38+
export const STRING = 13 // quoted string: "hello", 'world'
39+
export const HASH = 14 // hex color: #fff, #ff0000
40+
export const FUNCTION = 15 // function: calc(), var()
41+
export const OPERATOR = 16 // operator: +, -, *, /, comma
42+
export const PARENTHESIS = 17 // parenthesized expression: (100% - 50px)
43+
export const URL = 18 // URL: url("file.css"), url(image.png), used in values and @import
4344

4445
// Selector node type constants (for detailed selector parsing)
45-
export const NODE_SELECTOR_LIST = 20 // comma-separated selectors
46-
export const NODE_SELECTOR_TYPE = 21 // type selector: div, span, p
47-
export const NODE_SELECTOR_CLASS = 22 // class selector: .classname
48-
export const NODE_SELECTOR_ID = 23 // ID selector: #identifier
49-
export const NODE_SELECTOR_ATTRIBUTE = 24 // attribute selector: [attr], [attr=value]
50-
export const NODE_SELECTOR_PSEUDO_CLASS = 25 // pseudo-class: :hover, :nth-child()
51-
export const NODE_SELECTOR_PSEUDO_ELEMENT = 26 // pseudo-element: ::before, ::after
52-
export const NODE_SELECTOR_COMBINATOR = 27 // combinator: >, +, ~, space
53-
export const NODE_SELECTOR_UNIVERSAL = 28 // universal selector: *
54-
export const NODE_SELECTOR_NESTING = 29 // nesting selector: &
55-
export const NODE_SELECTOR_NTH = 30 // An+B expression: 2n+1, odd, even
56-
export const NODE_SELECTOR_NTH_OF = 31 // An+B with "of <selector>" syntax
57-
export const NODE_SELECTOR_LANG = 56 // language identifier for :lang() pseudo-class
46+
export const SELECTOR_LIST = 20 // comma-separated selectors
47+
export const TYPE_SELECTOR = 21 // type selector: div, span, p
48+
export const CLASS_SELECTOR = 22 // class selector: .classname
49+
export const ID_SELECTOR = 23 // ID selector: #identifier
50+
export const ATTRIBUTE_SELECTOR = 24 // attribute selector: [attr], [attr=value]
51+
export const PSEUDO_CLASS_SELECTOR = 25 // pseudo-class: :hover, :nth-child()
52+
export const PSEUDO_ELEMENT_SELECTOR = 26 // pseudo-element: ::before, ::after
53+
export const COMBINATOR = 27 // combinator: >, +, ~, space
54+
export const UNIVERSAL_SELECTOR = 28 // universal selector: *
55+
export const NESTING_SELECTOR = 29 // nesting selector: &
56+
export const NTH_SELECTOR = 30 // An+B expression: 2n+1, odd, even
57+
export const NTH_OF_SELECTOR = 31 // An+B with "of <selector>" syntax
58+
export const LANG_SELECTOR = 56 // language identifier for :lang() pseudo-class
5859

5960
// At-rule prelude node type constants (for at-rule prelude parsing)
60-
export const NODE_PRELUDE_MEDIA_QUERY = 32 // media query: screen, (min-width: 768px)
61-
export const NODE_PRELUDE_MEDIA_FEATURE = 33 // media feature: (min-width: 768px)
62-
export const NODE_PRELUDE_MEDIA_TYPE = 34 // media type: screen, print, all
63-
export const NODE_PRELUDE_CONTAINER_QUERY = 35 // container query: sidebar (min-width: 400px)
64-
export const NODE_PRELUDE_SUPPORTS_QUERY = 36 // supports query: (display: flex)
65-
export const NODE_PRELUDE_LAYER_NAME = 37 // layer name: base, components
66-
export const NODE_PRELUDE_IDENTIFIER = 38 // generic identifier: keyframe name, property name
67-
export const NODE_PRELUDE_OPERATOR = 39 // logical operator: and, or, not
68-
export const NODE_PRELUDE_IMPORT_URL = 40 // import URL: url("file.css") or "file.css"
69-
export const NODE_PRELUDE_IMPORT_LAYER = 41 // import layer: layer or layer(name)
70-
export const NODE_PRELUDE_IMPORT_SUPPORTS = 42 // import supports: supports(condition)
61+
export const MEDIA_QUERY = 32 // media query: screen, (min-width: 768px)
62+
export const MEDIA_FEATURE = 33 // media feature: (min-width: 768px)
63+
export const MEDIA_TYPE = 34 // media type: screen, print, all
64+
export const CONTAINER_QUERY = 35 // container query: sidebar (min-width: 400px)
65+
export const SUPPORTS_QUERY = 36 // supports query: (display: flex)
66+
export const LAYER_NAME = 37 // layer name: base, components
67+
export const PRELUDE_OPERATOR = 38 // logical operator: and, or, not
7168

7269
// Flag constants (bit-packed in 1 byte)
7370
export const FLAG_IMPORTANT = 1 << 0 // Has !important

src/column-tracking.test.ts

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { describe, test, expect } from 'vitest'
22
import { parse } from './parse'
3-
import { NODE_STYLE_RULE, NODE_DECLARATION, NODE_AT_RULE, NODE_SELECTOR_LIST } from './constants'
3+
import { STYLE_RULE, DECLARATION, AT_RULE, SELECTOR_LIST } from './constants'
44

55
describe('Column Tracking', () => {
66
test('should track column for single-line CSS', () => {
@@ -14,22 +14,22 @@ describe('Column Tracking', () => {
1414
// First rule (body)
1515
const rule = ast.first_child
1616
expect(rule).not.toBeNull()
17-
expect(rule!.type).toBe(NODE_STYLE_RULE)
17+
expect(rule!.type).toBe(STYLE_RULE)
1818
expect(rule!.line).toBe(1)
1919
expect(rule!.column).toBe(1)
2020

2121
// Selector (body)
2222
const selector = rule!.first_child
2323
expect(selector).not.toBeNull()
24-
expect(selector!.type).toBe(NODE_SELECTOR_LIST)
24+
expect(selector!.type).toBe(SELECTOR_LIST)
2525
expect(selector!.line).toBe(1)
2626
expect(selector!.column).toBe(1)
2727

2828
// Declaration (color: red)
2929
const block = selector!.next_sibling
3030
const decl = block!.first_child
3131
expect(decl).not.toBeNull()
32-
expect(decl!.type).toBe(NODE_DECLARATION)
32+
expect(decl!.type).toBe(DECLARATION)
3333
expect(decl!.line).toBe(1)
3434
expect(decl!.column).toBe(8)
3535
})
@@ -47,13 +47,13 @@ describe('Column Tracking', () => {
4747

4848
// First declaration (color: red) at line 2, column 3
4949
const decl1 = block.first_child!
50-
expect(decl1.type).toBe(NODE_DECLARATION)
50+
expect(decl1.type).toBe(DECLARATION)
5151
expect(decl1.line).toBe(2)
5252
expect(decl1.column).toBe(3)
5353

5454
// Second declaration (font-size: 16px) at line 3, column 3
5555
const decl2 = decl1.next_sibling!
56-
expect(decl2.type).toBe(NODE_DECLARATION)
56+
expect(decl2.type).toBe(DECLARATION)
5757
expect(decl2.line).toBe(3)
5858
expect(decl2.column).toBe(3)
5959
})
@@ -64,19 +64,19 @@ describe('Column Tracking', () => {
6464

6565
// At-rule should start at column 1
6666
const atRule = ast.first_child!
67-
expect(atRule.type).toBe(NODE_AT_RULE)
67+
expect(atRule.type).toBe(AT_RULE)
6868
expect(atRule.line).toBe(1)
6969
expect(atRule.column).toBe(1)
7070

7171
// Get the block, then find the nested style rule
7272
const block = atRule.block!
7373
let nestedRule = block.first_child
74-
while (nestedRule && nestedRule.type !== NODE_STYLE_RULE) {
74+
while (nestedRule && nestedRule.type !== STYLE_RULE) {
7575
nestedRule = nestedRule.next_sibling
7676
}
7777

7878
expect(nestedRule).not.toBeNull()
79-
expect(nestedRule!.type).toBe(NODE_STYLE_RULE)
79+
expect(nestedRule!.type).toBe(STYLE_RULE)
8080
expect(nestedRule!.line).toBe(1)
8181
// Column 17 is where 'body' starts (beginning of selector)
8282
expect(nestedRule!.column).toBe(17)
@@ -88,13 +88,13 @@ describe('Column Tracking', () => {
8888

8989
// First rule at column 1
9090
const rule1 = ast.first_child!
91-
expect(rule1.type).toBe(NODE_STYLE_RULE)
91+
expect(rule1.type).toBe(STYLE_RULE)
9292
expect(rule1.line).toBe(1)
9393
expect(rule1.column).toBe(1)
9494

9595
// Second rule at column 19
9696
const rule2 = rule1.next_sibling!
97-
expect(rule2.type).toBe(NODE_STYLE_RULE)
97+
expect(rule2.type).toBe(STYLE_RULE)
9898
expect(rule2.line).toBe(1)
9999
expect(rule2.column).toBe(19)
100100
})
@@ -105,7 +105,7 @@ describe('Column Tracking', () => {
105105

106106
// Rule should start at column 5 (after 4 spaces)
107107
const rule = ast.first_child!
108-
expect(rule.type).toBe(NODE_STYLE_RULE)
108+
expect(rule.type).toBe(STYLE_RULE)
109109
expect(rule.line).toBe(1)
110110
expect(rule.column).toBe(5)
111111
})
@@ -117,7 +117,7 @@ describe('Column Tracking', () => {
117117

118118
// Rule should start at column 15 (after comment and space)
119119
const rule = ast1.first_child!
120-
expect(rule.type).toBe(NODE_STYLE_RULE)
120+
expect(rule.type).toBe(STYLE_RULE)
121121
expect(rule.line).toBe(1)
122122
expect(rule.column).toBe(15)
123123
})

src/constants.ts

Lines changed: 36 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -2,45 +2,42 @@
22
// This breaks the barrel file chain and improves tree-shaking
33

44
export {
5-
NODE_STYLESHEET,
6-
NODE_STYLE_RULE,
7-
NODE_AT_RULE,
8-
NODE_DECLARATION,
9-
NODE_SELECTOR,
10-
NODE_COMMENT,
11-
NODE_BLOCK,
12-
NODE_VALUE_KEYWORD,
13-
NODE_VALUE_NUMBER,
14-
NODE_VALUE_DIMENSION,
15-
NODE_VALUE_STRING,
16-
NODE_VALUE_COLOR,
17-
NODE_VALUE_FUNCTION,
18-
NODE_VALUE_OPERATOR,
19-
NODE_VALUE_PARENTHESIS,
20-
NODE_SELECTOR_LIST,
21-
NODE_SELECTOR_TYPE,
22-
NODE_SELECTOR_CLASS,
23-
NODE_SELECTOR_ID,
24-
NODE_SELECTOR_ATTRIBUTE,
25-
NODE_SELECTOR_PSEUDO_CLASS,
26-
NODE_SELECTOR_PSEUDO_ELEMENT,
27-
NODE_SELECTOR_COMBINATOR,
28-
NODE_SELECTOR_UNIVERSAL,
29-
NODE_SELECTOR_NESTING,
30-
NODE_SELECTOR_NTH,
31-
NODE_SELECTOR_NTH_OF,
32-
NODE_SELECTOR_LANG,
33-
NODE_PRELUDE_MEDIA_QUERY,
34-
NODE_PRELUDE_MEDIA_FEATURE,
35-
NODE_PRELUDE_MEDIA_TYPE,
36-
NODE_PRELUDE_CONTAINER_QUERY,
37-
NODE_PRELUDE_SUPPORTS_QUERY,
38-
NODE_PRELUDE_LAYER_NAME,
39-
NODE_PRELUDE_IDENTIFIER,
40-
NODE_PRELUDE_OPERATOR,
41-
NODE_PRELUDE_IMPORT_URL,
42-
NODE_PRELUDE_IMPORT_LAYER,
43-
NODE_PRELUDE_IMPORT_SUPPORTS,
5+
STYLESHEET,
6+
STYLE_RULE,
7+
AT_RULE,
8+
DECLARATION,
9+
SELECTOR,
10+
COMMENT,
11+
BLOCK,
12+
IDENTIFIER,
13+
NUMBER,
14+
DIMENSION,
15+
STRING,
16+
HASH,
17+
FUNCTION,
18+
OPERATOR,
19+
PARENTHESIS,
20+
URL,
21+
SELECTOR_LIST,
22+
TYPE_SELECTOR,
23+
CLASS_SELECTOR,
24+
ID_SELECTOR,
25+
ATTRIBUTE_SELECTOR,
26+
PSEUDO_CLASS_SELECTOR,
27+
PSEUDO_ELEMENT_SELECTOR,
28+
COMBINATOR,
29+
UNIVERSAL_SELECTOR,
30+
NESTING_SELECTOR,
31+
NTH_SELECTOR,
32+
NTH_OF_SELECTOR,
33+
LANG_SELECTOR,
34+
MEDIA_QUERY,
35+
MEDIA_FEATURE,
36+
MEDIA_TYPE,
37+
CONTAINER_QUERY,
38+
SUPPORTS_QUERY,
39+
LAYER_NAME,
40+
PRELUDE_OPERATOR,
4441
FLAG_IMPORTANT,
4542
ATTR_OPERATOR_NONE,
4643
ATTR_OPERATOR_EQUAL,

0 commit comments

Comments
 (0)