bagistoplus / basic-blocks
Basic blocks for bagisto visual editor
Fund package maintenance!
Requires
- php: ^8.2
- illuminate/contracts: ^11.0||^12.0
Requires (Dev)
- bagistoplus/visual: ^2.0@dev
- captainhook/captainhook: ^5.25
- larastan/larastan: ^3.0
- laravel/pint: ^1.14
- nunomaduro/collision: ^8.8
- orchestra/testbench: ^10.0.0||^9.0.0
- pestphp/pest: ^3.0
- pestphp/pest-plugin-arch: ^3.0
- pestphp/pest-plugin-laravel: ^3.0
- phpstan/extension-installer: ^1.4
- phpstan/phpstan-deprecation-rules: ^2.0
- phpstan/phpstan-phpunit: ^2.0
- ramsey/conventional-commits: ^1.6
README
A collection of essential, ready-to-use blocks for the Bagisto Visual Editor. This package provides foundational building blocks for professional Bagisto storefronts. It comes pre-installed with fresh Bagisto visual themes, enabling drag-and-drop page building without writing code.
Blocks are built with Laravel Blade templates, styled with Tailwind CSS, and enhanced with Alpine.js for interactivity. Some blocks also leverage Livewire for dynamic functionality.
Installation
This package comes pre-installed with fresh Bagisto visual themes. If you need to install it manually, you can do so via composer:
composer require bagistoplus/basic-blocks
That's it! The package will automatically register itself via Laravel's package auto-discovery.
Usage
This package provides basic blocks for the Bagisto Visual Editor. Once installed, the blocks are automatically available in the visual editor interface at visual.bagistoplus.com.
Simply use the drag-and-drop interface to add blocks to your pages and customize them through the visual editor.
Host Theme Integration
Most blocks work with zero configuration. This package also ships an optional shared stylesheet entry for packaged block styles.
Shared stylesheet (optional)
Themes can import the package stylesheet entry:
@import '../../../vendor/bagistoplus/basic-blocks/resources/assets/css/index.css';
Adjust the relative path to match your theme's CSS file location.
This file contains the packaged block CSS (including button styles) and Tailwind source hints used by those styles.
For button customization, override the button CSS custom properties (--btn-radius, --btn-border-width, --btn-font-size, --btn-letter-spacing, --btn-text-transform, and the shadow/inset variables). The full list is in resources/assets/css/index.css.
If the stylesheet is not imported, blocks still function; packaged visual styles are simply not applied.
Icon block
No setup is required. The bagistoplus/visual package every Bagisto visual theme depends on already registers blade-ui-kit/blade-icons along with the Lucide and Heroicons sets, so the default lucide-* icons work out of the box.
Optional: theme developers who want additional icon sets (e.g. Tabler, Feather) can composer require them in the theme. Any set registered with blade-icons becomes selectable in the Icon block from the visual editor.
Technology Stack
The blocks in this package are built using:
- Laravel Blade - For templating and server-side rendering
- Tailwind CSS - For modern, utility-first styling
- Alpine.js - For lightweight JavaScript interactivity
- Livewire - For dynamic, reactive components (used in select blocks)
Testing
composer test
Changelog
Please see CHANGELOG for more information on what has changed recently.
Contributing
Please see CONTRIBUTING for details.
Security Vulnerabilities
Please review our security policy on how to report security vulnerabilities.
Credits
License
The MIT License (MIT). Please see License File for more information.