Skip to content

Commit e321437

Browse files
committed
chore: REAMDE update
1 parent c139eca commit e321437

File tree

1 file changed

+18
-18
lines changed

1 file changed

+18
-18
lines changed

README.md

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,24 @@ This package makes it much more convenient by allowing you to keep inline script
8383
- **Unit testing** : your JavaScript code using tools like Vitest or Jest _(see [bonus section](#bonus))_
8484
- **IDE support** : with syntax highlighting and error detection in dedicated JS files _(see [example bellow](#using-js-code-directly))_
8585

86+
## Advanced Usage: Custom Script Processing
87+
88+
Want to do more advanced processing of your JavaScript code before inlining it?
89+
90+
Create a PHP class:
91+
- that implements the `RenderableScript` interface - using it you can fetch / prepare / create JS code in any way you want;
92+
- and place it in `BladeInlineScripts::take(...)` method.
93+
94+
Use interface `ScriptWithPlaceholders` for scripts with placeholders to be replaced with variables.
95+
96+
Want to load JS code from a file? Extend the abstract class `FromFile` or `FromFileWithPlaceholders`.
97+
98+
```php
99+
abstract class FromFile implements RenderableScript;
100+
101+
abstract class FromFileWithPlaceholders implements ScriptWithPlaceholders;
102+
```
103+
86104
# Explanation Through Example: Color scheme switch script
87105

88106
Modern websites often provide users with the ability to switch between light and dark themes. In such cases, you might want to remember the user's choice using `localStorage` and apply the selected theme on page load. To avoid **FOUC** (Flash of Unstyled Content), you can use _inline script_ to set the theme before the page fully loads.
@@ -195,24 +213,6 @@ Select the one that suits your frontend and insert it in your template:
195213
- Blade + TailwindCss + Hero icons: `../views/color-scheme-switch-two-states/hero-icons-tailwind.blade.php`
196214
- Livewire/Alpine + TailwindCss + Hero icons: `../views/color-scheme-switch-two-states/hero-icons-tailwind-alpine.blade.php`
197215

198-
## Advanced Usage: Custom Script Processing
199-
200-
Want to do more advanced processing of your JavaScript code before inlining it?
201-
202-
Create a PHP class:
203-
- that implements the `RenderableScript` interface - using it you can fetch / prepare / create JS code in any way you want;
204-
- and place it in `BladeInlineScripts::take(...)` method.
205-
206-
Use interface `ScriptWithPlaceholders` for scripts with placeholders to be replaced with variables.
207-
208-
Want to load JS code from a file? Extend the abstract class `FromFile` or `FromFileWithPlaceholders`.
209-
210-
```php
211-
abstract class FromFile implements RenderableScript;
212-
213-
abstract class FromFileWithPlaceholders implements ScriptWithPlaceholders;
214-
```
215-
216216
## Bonus
217217

218218
Unit tests for JS scripts

0 commit comments

Comments
 (0)