Skip to content

Commit b127517

Browse files
committed
fix: improve documentation
1 parent d040190 commit b127517

File tree

1 file changed

+74
-55
lines changed

1 file changed

+74
-55
lines changed

README.md

+74-55
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,63 @@
1-
css-selector-parser
2-
===================
3-
4-
* Fast and low memory CSS selector parser.
5-
* Parses CSS selector into object-model (AST).
6-
* Compliant with all historical and modern CSS specs.
7-
* Covered with tests.
8-
* Documented.
9-
* Supported CSS selector standards:
10-
* `css1`: https://www.w3.org/TR/CSS1/
11-
* `css2`: https://www.w3.org/TR/CSS2/
12-
* `css3`/`selectors-3`: https://www.w3.org/TR/selectors-3/
13-
* `selectors-4`: https://www.w3.org/TR/selectors-4/
14-
* `latest`: refers to `selectors-4`
15-
* `progressive`: `latest` + accepts unknown psudo-classes, psudo-elements and attribute case sensitivity modifiers
16-
17-
**Important:**
18-
* [Migrating from 1.x to 3.x](CHANGELOG.md#migrating-from-1x-to-3x).
19-
* [Migrating from 2.x to 3.x](CHANGELOG.md#migrating-from-2x-to-3x).
20-
* [Migrating from 1.x to 2.x](CHANGELOG.md#220).
21-
22-
Latest releases: [Changelog](CHANGELOG.md).
23-
24-
Installation
25-
------------
1+
# css-selector-parser
262

27-
```
3+
![npm](https://img.shields.io/npm/v/css-selector-parser)
4+
![npm bundle size](https://img.shields.io/bundlephobia/minzip/css-selector-parser)
5+
![NPM License](https://img.shields.io/npm/l/css-selector-parser)
6+
![GitHub stars](https://img.shields.io/github/stars/mdevils/css-selector-parser)
7+
8+
A high-performance CSS selector parser with advanced features for modern web development.
9+
10+
## Features
11+
12+
- 🚀 **Fast and memory-efficient** parsing for all CSS selectors
13+
- 🌳 **AST-based** object model for programmatic manipulation
14+
- 📊 **Full compliance** with all CSS selector specifications
15+
- 🧪 **Comprehensive test coverage**
16+
- 📚 **Well-documented API** with TypeScript support
17+
- 🔄 **Two-way conversion** between CSS selectors and AST
18+
- 🧩 **Modular support** for various CSS specifications
19+
20+
## Supported CSS Selector Standards
21+
22+
- `css1`: [W3C CSS1 Specification](https://www.w3.org/TR/CSS1/)
23+
- `css2`: [W3C CSS2 Specification](https://www.w3.org/TR/CSS2/)
24+
- `css3`/`selectors-3`: [W3C Selectors Level 3](https://www.w3.org/TR/selectors-3/)
25+
- `selectors-4`: [W3C Selectors Level 4](https://www.w3.org/TR/selectors-4/)
26+
- `latest`: refers to `selectors-4`
27+
- `progressive`: `latest` + accepts unknown pseudo-classes, pseudo-elements and attribute case sensitivity modifiers
28+
29+
## Migration Guides
30+
31+
- [Migrating from 1.x to 3.x](CHANGELOG.md#migrating-from-1x-to-3x)
32+
- [Migrating from 2.x to 3.x](CHANGELOG.md#migrating-from-2x-to-3x)
33+
- [Migrating from 1.x to 2.x](CHANGELOG.md#220)
34+
35+
See [Changelog](CHANGELOG.md) for release details.
36+
37+
## Installation
38+
39+
```bash
2840
npm install css-selector-parser
41+
# or
42+
yarn add css-selector-parser
43+
# or
44+
pnpm add css-selector-parser
2945
```
3046

31-
Usage
32-
-----
47+
## Usage
3348

34-
### Parsing
49+
### Parsing Selectors
3550

3651
```javascript
37-
import {createParser} from 'css-selector-parser';
52+
import { createParser } from 'css-selector-parser';
3853

3954
const parse = createParser();
4055
const selector = parse('a[href^="/"], .container:has(nav) > a[href]:nth-child(2)::before');
4156

4257
console.log(selector);
4358
```
4459

45-
Produces:
60+
This produces an AST (Abstract Syntax Tree) output:
4661

4762
```javascript
4863
({
@@ -100,10 +115,10 @@ Produces:
100115
})
101116
```
102117

103-
### Constructing AST and rendering
118+
### Building and Rendering Selectors
104119

105120
```javascript
106-
import {ast, render} from 'css-selector-parser';
121+
import { ast, render } from 'css-selector-parser';
107122

108123
const selector = ast.selector({
109124
rules: [
@@ -142,14 +157,12 @@ const selector = ast.selector({
142157
console.log(render(selector)); // a[href^="/"], .container:has(nav) > a[href]:nth-child(2)::before
143158
```
144159

145-
CSS Modules
146-
-----------
160+
## CSS Modules Support
147161

148-
CSS Modules are specific CSS specifications that add new selectors or modify existing ones.
149-
The parser supports various CSS modules that can be included in your syntax definition:
162+
CSS Modules are specifications that add new selectors or modify existing ones. This parser supports various CSS modules that can be included in your syntax definition:
150163

151164
```javascript
152-
import {createParser} from 'css-selector-parser';
165+
import { createParser } from 'css-selector-parser';
153166

154167
// Create a parser with specific CSS modules enabled
155168
const parse = createParser({
@@ -158,30 +171,36 @@ const parse = createParser({
158171
});
159172
```
160173

161-
Supported CSS modules:
174+
### Supported CSS Modules
162175

163-
* `css-position-1`, `css-position-2`, `css-position-3`, `css-position-4`: Adds position-related pseudo-classes
164-
* `css-scoping-1`: Adds Shadow DOM selectors like `:host`, `:host-context()`, and `::slotted()`
165-
* `css-pseudo-4`: Adds modern pseudo-elements like `::selection`, `::backdrop`, etc.
166-
* `css-shadow-parts-1`: Adds `::part()` for styling shadow DOM components
176+
| Module | Description |
177+
|--------|-------------|
178+
| `css-position-1/2/3/4` | Position-related pseudo-classes |
179+
| `css-scoping-1` | Shadow DOM selectors (`:host`, `:host-context()`, `::slotted()`) |
180+
| `css-pseudo-4` | Modern pseudo-elements (`::selection`, `::backdrop`, etc.) |
181+
| `css-shadow-parts-1` | `::part()` for styling shadow DOM components |
167182

168183
The `latest` syntax automatically includes all modules marked as current specifications.
169184

170-
API
171-
---
185+
## API Documentation
186+
187+
- [Complete API Documentation](docs/modules.md)
188+
- [Parsing CSS Selectors](docs/modules.md#createParser)
189+
- [Constructing CSS AST](docs/modules.md#ast)
190+
- [Rendering CSS AST](docs/modules.md#render)
172191

173-
* [Full API Documentation](docs/modules.md)
174-
* [Parsing CSS selectors](docs/modules.md#createParser)
175-
* [Constructing CSS AST](docs/modules.md#ast)
176-
* [Rendering CSS AST](docs/modules.md#render)
192+
## Contributing
177193

178-
LICENSE
179-
-------
194+
Contributions are welcome! Please feel free to submit a Pull Request.
195+
196+
## License
180197

181198
MIT
182199

183-
## Security contact information
200+
## Security Contact
201+
202+
To report a security vulnerability, please use the [Tidelift security contact](https://tidelift.com/security). Tidelift will coordinate the fix and disclosure.
203+
204+
## Sponsorship
184205

185-
To report a security vulnerability, please use the
186-
[Tidelift security contact](https://tidelift.com/security).
187-
Tidelift will coordinate the fix and disclosure.
206+
If you find this project useful, please consider [sponsoring the developer](https://github.com/sponsors/mdevils) or [supporting on Patreon](https://patreon.com/mdevils).

0 commit comments

Comments
 (0)