Skip to content

Commit

Permalink
bump the version & other cleanups
Browse files Browse the repository at this point in the history
  • Loading branch information
EmranMR committed Jul 16, 2023
1 parent b3422dd commit 93648b9
Show file tree
Hide file tree
Showing 4 changed files with 185 additions and 78 deletions.
151 changes: 107 additions & 44 deletions CONTRIBUTION.md
Original file line number Diff line number Diff line change
@@ -1,65 +1,119 @@
# HELLO! 👋

Welcome to the contribution guide, and I hope you enjoyed the grammar.
Here you will find out how the grammar is organised and how you can contribute, so that it adheres to the grammar styles.
Here you will find out how the grammar is organised and how you can
contribute, so that it adheres to the grammar styles.

### Prerequisite:
- You need to know how to use the [tree-sitter cli](https://tree-sitter.github.io/tree-sitter/creating-parsers#tool-overview) for generating and testing
- Make sure you are familiar with this chapter from [tree-sitter](https://tree-sitter.github.io/tree-sitter/creating-parsers#writing-the-grammar) especially the functions.
- in depth knowledge is not necessary unless you are contributing to the core.

- You need to know how to use the
[tree-sitter cli](https://tree-sitter.github.io/tree-sitter/creating-parsers#tool-overview)
for generating and testing
- Make sure you are familiar with this chapter from
[tree-sitter](https://tree-sitter.github.io/tree-sitter/creating-parsers#writing-the-grammar)
especially the functions.
- in depth knowledge is not necessary unless you are contributing to
the core.

### General Overview:
The grammar is pretty abstracted, i.e there are lots of aliases and hidden rules. However I personally believe it is easy to read and follow. This was intentional so that it is future proof, extensible and maintainable. Thanks to this, there is a 98% chance that the future new directive rules can be added with **no more than 6 lines of code**!

The grammar is pretty abstracted, i.e there are lots of aliases and
hidden rules. However I personally believe it is easy to read and
follow. This was intentional so that it is future proof, extensible
and maintainable. Thanks to this, there is a 98% chance that the
future new directive rules can be added with **no more than 6 lines of
code**!

### How to set up

1. Clone this repo
2. Install the dependancies
4. To check if your set up is working just run `npm run test`.
> Make sure you have set up your `tree-sitter`'s `parser-directories` path correctly in your config file see [path](https://tree-sitter.github.io/tree-sitter/syntax-highlighting#paths)
3. To check if your set up is working just run `npm run test`.
> Make sure you have set up your `tree-sitter`'s
> `parser-directories` path correctly in your config file see
> [path](https://tree-sitter.github.io/tree-sitter/syntax-highlighting#paths)
### Overview
Go ahead open up the `grammar.js` in the root directory.

Everything is organised in the order they appear in the document inside`_definition`. The `rules` are then made up like lego using the "building block" rules written at the bottom of the `grammar.js`. As a result any changes below the "warning comment" will likely to cause breakage, so make sure you run the test every time you amend anything. However it is very unlikely you would need to touch anything below that line, unless you are writing a very **complicated** rule.
### $._definition:
This is basically what the parser uses as a starting point to read the `blade` document. The following explains the grouping/name convention:
Go ahead open up the `grammar.js` in the root directory.

Everything is organised in the order they appear in the document
inside`_definition`. The `rules` are then made up like lego using the
"building block" rules written at the bottom of the `grammar.js`. As a
result any changes below the "warning comment" will likely to cause
breakage, so make sure you run the test every time you amend anything.
However it is very unlikely you would need to touch anything below
that line, unless you are writing a very **complicated** rule.

### $.\_definition:

This is basically what the parser uses as a starting point to read the
`blade` document. The following explains the grouping/name convention:

#### 1. $.keyword:
These are the stand-alone directives that can appear anywhere in the document, with ***NO*** *parameters* for example:
- `@csrf`

These are the stand-alone directives that can appear anywhere in the
document, with **_NO_** _parameters_ for example:

- `@csrf`

#### 2. $.php_statement
These are the directives or rules that need their content parsed as `php`
- `{{}}`
- `{!! !!}`
- ...

These are the directives or rules that need their content parsed as
`php`

- `{{}}`
- `{!! !!}`
- ...

#### 3. $.attribute

Blade attributes, such as:
- `@class()`
- `@style()`
- ...
#### 4. $._inline_directive
These are the directives that ***take on*** parameters.
- `@yield()`
- `@extends()`
- ...
> Names starting with `_` are hiddent when parsing. see [tree-sitter](https://tree-sitter.github.io/tree-sitter/creating-parsers#writing-the-grammar)
#### 5. $._nested_directives
Directive that have *start* and *end* directive, with a *body*
- `@if() @endif`
- `@error @enderror`
- ...

- `@class()`
- `@style()`
- ...

#### 4. $.\_inline_directive

These are the directives that **_take on_** parameters.

- `@yield()`
- `@extends()`
- ...
> Names starting with `_` are hiddent when parsing. see
> [tree-sitter](https://tree-sitter.github.io/tree-sitter/creating-parsers#writing-the-grammar)
#### 5. $.\_nested_directives

Directive that have _start_ and _end_ directive, with a _body_

- `@if() @endif`
- `@error @enderror`
- ...

#### 6. $.loop_operator
Very unlikely you would need to touch this, but these are loop operators that can appear in any subtree.
- `@break`
- `@continue`
- ...

Very unlikely you would need to touch this, but these are loop
operators that can appear in any subtree.

- `@break`
- `@continue`
- ...

#### 7. $.text
This is another rule which is very unlikely you would need to ever touch. This will capture anything that is not blade, and used for `injection` purposes.

This is another rule which is very unlikely you would need to ever
touch. This will capture anything that is not blade, and used for
`injection` purposes.

### Adding New Directives:
First thing to do is to find out what category it falls into; so look into the `_definition`, pick rule group and dig in to get an idea.

As an example look below on how the `@if` directive is defined:
First thing to do is to find out what category it falls into; so look
into the `_definition`, pick rule group and dig in to get an idea.

As an example look below on how the `@if` directive is defined:

```mermaid
graph TD;
A($._definition)-->B($._nested_directive)-->C($.conditional)-->D[/Directives\];
Expand All @@ -72,25 +126,34 @@ graph TD;
```

### Test it:

Whenever you define a new rule, you need to test it in two ways:

1. Write an example extract in the `example-file.blade.php`
- Then parse it in your terminal, and check the output
```bash
npm run parse
```
2. Once happy with your result, write the appropiate `test` files inside the appropiate group (or make one) in the `corpus/`
2. Once happy with your result, write the appropiate `test` files
inside the appropiate group (or make one) in the `corpus/`

To finish off and ensure your rule is not breaking any other rules,
just do the followig:

To finish off and ensure your rule is not breaking any other rules, just do the followig:
```
npm run test
npm run test
```
If all green you are good to go 👍
### Pull requests:
Once you have:
1. added your rule
2. generated the parser
3. wrote the test
4. and your `npm run test` output was all green
you are ready to do a pull request for a review
> Ensure you include eveyrthing in the `src/*` as well
4. and your `npm run test` output was all green you are ready to do a
pull request for a review
5. `npm run generate` and then do a _pull request_
> Ensure you include everything in the `src/*` as well
100 changes: 70 additions & 30 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,65 +1,96 @@
# Tree-Sitter-Blade 🌳
#### ⚠️ Please keep an eye on the *release-notes* until v1.0.0 is out.⚠️

- There might be minor breaking changes, once the [split-parser](https://github.com/EmranMR/tree-sitter-blade/issues/5) is released and tested.
- This could possibly be due to change of **rule names**, which might in return affect your `injection.scm` or `highlights.scm`
#### ⚠️ Please keep an eye on the _release-notes_ until v1.0.0 is out.⚠️

- There might be minor breaking changes, once the
[split-parser](https://github.com/EmranMR/tree-sitter-blade/issues/5)
is released and tested.
- This could possibly be due to change of **rule names**, which
might in return affect your `injection.scm` or `highlights.scm`

> The grammar is up to date as of **_Laravel 10.x_**
## Introduction (feel free to skip)

This project aims to write the tree-sitter grammar for [Laravel Blade](https://laravel.com/docs/10.x/blade#main-content). It is currently in beta,
until I get some feedback from the community. So far It has passed my own stress tests.
This project aims to write the tree-sitter grammar for
[Laravel Blade](https://laravel.com/docs/10.x/blade#main-content). It
is currently in beta, until I get some feedback from the community. So
far It has passed my own stress tests.

This is very useful for editors and services that are based on
tree-sitter. Such as, but not limited to:

This is very useful for editors and services that are based on tree-sitter. Such as, but not limited to:
- ***Neovim***
- ***zed***
- ***Nova*** by panic
- ***Github***
- **_Neovim_**
- **_zed_**
- **_Nova_** by panic
- **_Github_**

## Sponsorship ❤️
If you found this project helpful, I would really appreciate if you can [sponsor](https://github.com/sponsors/EmranMR) me so that I could keep maintaining and improving the grammar to include the entire **Laravel Ecosystem** inlcluding **Livewire**, **AlpineJS**, **Inertia** and so forth. Furthermore keeping the project up to date with **future releases of Laravel**.

If you found this project helpful, I would really appreciate if you
can [sponsor](https://github.com/sponsors/EmranMR) me so that I could
keep maintaining and improving the grammar to include the entire
**Laravel Ecosystem** inlcluding **Livewire**, **AlpineJS**,
**Inertia** and so forth. Furthermore keeping the project up to date
with **future releases of Laravel**.

## NeoVim Users
If you are NeoVim user and would like to give this parser a shot, I would highly recommend checking out the [step by step guide and tips](https://github.com/EmranMR/tree-sitter-blade/discussions/19#discussion-5400675) by @yaegassy.
Once stable the repo will be hopefully added to nvim-treesitter allowing to install via `:TSInstall` instead.

If you are NeoVim user and would like to give this parser a shot, I
would highly recommend checking out the
[step by step guide and tips](https://github.com/EmranMR/tree-sitter-blade/discussions/19#discussion-5400675)
by @yaegassy. Once stable the repo will be hopefully added to
`nvim-treesitter` allowing to install via `:TSInstall` instead.

## How to inject languages:

When you parse your code there are three main important injection
points. There is an example in the `queries/injection.scm`. For ease
of use I have narrowed everything down to the following rules/queries:

#### 1. (php)
- This will inject `html/php` into your document
- You need to inject `php` in the `(php)` nodes
#### 1. (php)

- This will inject `html/php` into your document
- You need to inject `php` in the `(php)` nodes
- make sure it is `(#set! injection.combined)`

```
((php) @injection.content
(#set! injection.combined)
(#set! injection.language php))
```

#### 2. (php_only) 🚧
> This will be availble once the [split parser](https://github.com/tree-sitter/tree-sitter-php/pull/180) is merged into `tre-sitter-php`.The name might also change.
- You inject `php_only` into `(php_only)` nodes. This is for all the php
directives including `{{ x }}`, `{!! x !!}} ` and so forth

> This will be availble once the
> [split parser](https://github.com/tree-sitter/tree-sitter-php/pull/180)
> is merged into `tre-sitter-php`.The name might also change.
- You inject `php_only` into `(php_only)` nodes. This is for all the
php directives including `{{ x }}`, `{!! x !!}} ` and so forth
- Optional: `(#set! injection.combined)` but considering laravel
will render the different `php_only` points like having multiple
`<?php code ?>` The codes should have the same scope. In Nova you
also get extra autocompletion which are built-in.

#### 3. (parameter) 🚧
> This will be availble once the [split parser](https://github.com/tree-sitter/tree-sitter-php/pull/180) is merged into `tre-sitter-php`.The name might also change.
- optional: It will add a nice syntax highlighting for your parameters

> This will be availble once the
> [split parser](https://github.com/tree-sitter/tree-sitter-php/pull/180)
> is merged into `tre-sitter-php`.The name might also change.
- optional: It will add a nice syntax highlighting for your
parameters
- This is also a php injection point. I initially had this aliased
as `(php-only)` however decided to keep it separate.
- This is for all the inline directives such as `@extends(x)`,
`@yield(x)` and so forth
- you inject `php_only` in `(parameter)` to get a nice syntax
highlighting
- Do ***NOT*** add `(#set! injection.combined)`
- Do **_NOT_** add `(#set! injection.combined)`
- Because they are _parameter_.
- This is just for syntax highlighting and getting nice `php` IDE autocompletion if needed.
- This is just for syntax highlighting and getting nice `php`
IDE autocompletion if needed.

#### 4. (javascript)

Expand Down Expand Up @@ -107,29 +138,38 @@ The grammar is written in a way so that you can easily add folding
functionality. All you have to do is to mark the regions between
`(directive_start)` and `(directive_end)`

You will need to first find out what capture groups your editor uses. I will add an example in `folds.scm` for your information once I write one for Nova.
You will need to first find out what capture groups your editor uses.
I will add an example in `folds.scm` for your information once I write
one for Nova.

## Quick Note about `queries/` folder

This is for `tree-sitter cli`. Your editor or service might use different ***capture group*** name or ***predicates***.
This is for `tree-sitter cli`. Your editor or service might use
different **_capture group_** name or **_predicates_**.

Consequently you will need to find out in their documentation how you could approach queries or where they are stored and used by your editor. For example ***Nova*** does not use anything in this folder and uses it's own `Queries` folder instead.
Consequently you will need to find out in their documentation how you
could approach queries or where they are stored and used by your
editor. For example **_Nova_** does not use anything in this folder
and uses it's own `Queries` folder instead.

At the moment consider all the `.scm` files in that folder as stubs based on the upcoming Nova extension I am developing. 🔴
At the moment consider all the `.scm` files in that folder as stubs
based on the upcoming Nova extension I am developing. 🔴

## Issues

If something does not look right please raise an
[issue](https://github.com/EmranMR/tree-sitter-blade/issues) with
detailed examples of what you are trying to achieve.

- code excerpts or screenshots would be appreciated
- code excerpts or screenshots would be appreciated

If you need help with anything else, feel free to use the [discussion tab](https://github.com/EmranMR/tree-sitter-blade/discussions)
If you need help with anything else, feel free to use the
[discussion tab](https://github.com/EmranMR/tree-sitter-blade/discussions)

## Contribution

See the [contribution](/CONTRIBUTION.md) guidelines for more details,
as well as in depth info about the `grammar` itself.
as well as in depth info about the `grammar` itself.

## Todos

Expand Down
2 changes: 1 addition & 1 deletion corpus/comment.txt
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
==================
Comment
{{-- comment --}}
==================

{{-- comment --}}
Expand Down
10 changes: 7 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,9 +1,14 @@
{
"name": "tree-sitter-blade",
"version": "0.1.0",
"version": "0.1.1",
"description": "tree-sitter-blade for Laravel Blade files",
"main": "bindings/node",
"keywords": ["tree-sitter-blade", "blade", "tree-sitter", "laravel"],
"keywords": [
"tree-sitter-blade",
"blade",
"tree-sitter",
"laravel"
],
"homepage": "https://github.com/EmranMR/tree-sitter-blade",
"repository": {
"type": "git",
Expand Down Expand Up @@ -33,6 +38,5 @@
],
"injection-regex": "blade"
}

]
}

0 comments on commit 93648b9

Please sign in to comment.