honda/pushed-resources

Add styles or scripts on the fly

1.1.0 2021-05-14 11:02 UTC

This package is auto-updated.

Last update: 2024-04-07 14:51:36 UTC


README

Tests Formats Version Total Downloads License

Installation

You can install the package via composer:

composer require honda/pushed-resources

Usage

Pushing resources

Using Blade

<x-assets-script async src="script.js"/>

<x-assets-raw-script>
    console.log('Hello there!')
</x-assets-raw-script>

<x-assets-style href=" style.css"/>

<x-assets-raw-style>
    * { background: rebeccapurple }
</x-assets-raw-style>

<x-assets-blade>
    @livewireStyles
    @livewireScripts
</x-assets-blade>

Using PHP

use Honda\PushedResources\Resources\Script;
use Illuminate\View\ComponentAttributeBag;

Script::create()
    ->value('something.js')
    ->attributes(['a' => 'b']) // or
    ->attributes(new ComponentAttributeBag(['a' => 'b']));

Retrieving resources

Using Blade

<x-assets-render type="*"/>
<x-assets-render type="script"/>
<x-assets-render type="script,raw-script"/>
<x-assets-render type="style,raw-style"/>
<x-assets-render type="style,raw-style"/>

Using PHP

use Honda\PushedResources\Resources\Script;
use Illuminate\View\ComponentAttributeBag;

Script::create()
    ->value('something.js')
    ->attributes(['a' => 'b']) // or
    ->attributes(new ComponentAttributeBag(['a' => 'b']));

You can also use Style, Script, RawScript, RawStyle, Blade in the same namespace

Custom Types

A good use case for that is livewire assets, you may not want to those on a page where you are not using Livewire. You could do something like this:

// app/View/Resources/BladeScript or wherever you think it makes sense.
class BladeScript extends \Honda\PushedResources\Resources\Blade {
    public function getTag() : string{
        return 'blade-script';
    }
}
// app/View/Components/BladeScript.php
class BladeScript extends \Honda\PushedResources\Components\Blade {}
// in a page with livewire
<x-blade-script>
    <livewire-scripts/>
</x-blade-script>

// at the bottom of
<body> in your layout file
<x-assets-render type="blade-script"/>

Testing

composer test

Octane

This package is compatible with Laravel Octane.

Credits

License

The MIT License (MIT). Please see License File for more information. .