All notable changes to laravel-splade
will be documented in this file.
- Support for dynamic URL in Defer component
- Support for left-positioned Slideover
- Fix for wrong order of Lazy and Rehydrate components.
- Confirm modal now supports requiring the users' password
- Support for image preview in the File component (without using Filepond)
- Support for
poll
in the Rehydrate component
- Russian (ru) translation (thanks @twent)
- Bugfixes
- Added Filipino (
fil
) translation (thanks @whoami15) - Event Bus added (
$splade.on()
,$splade.emit()
) - Rehydrate feature
- Custom Script component
- Fix default
restoreOnSuccess
property value inForm
component - Added Indonesia translation (thanks @zulfikar-ditya)
- Added missing
primaryKey
method (fixes #240)
- Support for Laravel 10 (thanks @askdkc)
- Added
ja
,ar
,fa
,fr
,it
,ne
,ur
,bn
,de
, andms
translation files (thanks @askdkc, @aeq-dev, @mszabeh, @KinArnaud, @ousid, @AndreaBellini23, @surajkhanal, @AamirSohailKmAs, @istiak-tridip, @Udaberrico, and @rusdyahmad) - Fix for (external) JSON responses without properly encoded JSON content
- Improved Dusk tests
- Fix for searching through nested relationships using Spatie's Query Builder (#178)
- Added
es
,pt_BR
,pt_PT
, anduk_AU
translation files (thanks @WendellAdriel, @Hladenkyi, and @JorgeNortes)
- Workaround for default numeric values using remote options with Choices.js (#163)
- Fix for replacing the URL of the current page (#140)
- Added a
preserve-scroll
attribute to Link and Form component - FormData passed to a
GET
request is now added as a query string (#188) - Fix for toasts firing multiple times on Octane (#151)
- Added support for a custom exception handler
- Added English and Dutch translations
- Translations can now be published
- Added Larastan static analysis
- Fixed a navigation bug (Chromium browsers only) that occurred when switching between SPA and non-SPA pages using the back/forward buttons
- The vertical position of the Modal component is now configurable
- Support for setting a root path for remote Select options (#154)
- Improved install command (#144)
- Fixes for using the Table component in a Modal (#141)
- Support for handling existing files with the FilePond integration, including support for Spatie's Media Library.
- Support for PHP 8.2.
- Refactored the Vue
Teleport
component.
- Added setting to escape validation messages or not (#134)
- Bugfix for resolving FilePond uploads (#126)
- Better JS console error message when the response is not a Splade response
- Improved persistent layout handling
- Form Components now respect the
autofocus
attribute - Fix for Table
rowLink
feature when combined with custom cells containing other links
- Fix for validating uploads with a
Rules\File::class
instance
Splade gives you a massive head start when building applications. Navigate the documentation or watch the videos to discover its power, but to give you a glance, here's a short overview of some of the best features:
- Splade allows you to use the Laravel Blade template engine and build a single-page application using regular server-side routing without building an API. You still have the full power of Vue.js when you need it.
- Splade aims to stick as close as possible to the default Laravel features and development flow.
- Automatic installer and support for the Laravel Breeze starter kit.
- Besides the SPA navigation features, it has more than 20 interactive components that are huge timesavers.
- Most components are functional and unstyled, giving you complete control over the implementation.
- Other components are styled with Tailwind CSS 3.0, but can be fully customized by publishing the Blade templates. You don't need to rebuild or recompile any JavaScript for this.
- Built-in support for Modals and Slideover that can show any route or pre-loaded content.
- Beautiful Form Components with support for Validation and (Eloquent) Model binding. Built-in integration with Autosize, Choices.js, FilePond, and Flatpickr, including async file uploads.
- DataTables-like Table component that supports auto-fill, bulk actions, exports, searching, sorting, and more!
- Support Lazy Loading (templates and data), Persistent Layout, Animations, and Teleports.
- Laravel Echo integration to control browser behavior from the backend (redirecting, refreshing, and showing a toast).
- Built-in SEO (title, description, keywords) with support for Open Graph and Twitter tags.
- Support for custom Blade and Vue components.
- Support for existing Blade and Vue libraries.
- Support for SSR (server-side rendering).
- Fix for publishing Form stylesheets
- Slideover styling fix
- Allow modal/slider classes on outer div
- Fix for custom cells of nested columns
- Vue main element cleanup after mount
- Allow Link component to make non-GET requests (#122)
- Prevent wrong pagination call (#110)
- Move the ESM bundler from
vite.config.js
toapp.js
- Added
splade:show-versions
Artisan command
- FilePond integration with support for: Drag-and-drop uploads, Image previews, Async uploads, File type validation, File size validation, and Image validation
- Table Component: resolve row links after the resource has been loaded
- Preserves the default
perPage
pagination value in theperPage
selector. - Added
build()
helper method to dedicated tables. - Added MySQL, PostgreSQL and SQLite to the test matrix.
- DB performance improvements in SpladeTable wildcard searches.
- Added helper methods to sort the Table Resource in descending order
- Table component fix for Select Filter with numeric keys
- Choices.js fix for selecting a default value
- Support for pre-loaded modals/slideovers
- Support remote options in Form Select component
- Choices.js placeholder and styling improvements
- Improved Dusk macros for selecting Choices.js options
- The Dusk suite now checks whether the websockets server is running
- Fix for closing the Choices.js dropdown when rendered in a Headless UI Modal
- Support for nested relationships in Form Components
- Escape meta tag values
- Axios fix
- Improved SEO handling with support for Open Graph and Twitter meta tags, Canonical URL, and separate configuration file.
- Support for external domains in the Link component
- Splade Middleware refactor
- Support for external redirects (automatic and explicit via
Splade::redirectAway()
) - With a Date-range Form Input component, only update the internal Vue model when both dates are selected
- Checkbox value fix
- Revert fix for micro-optimization on view events (laravel/framework#44653)
- Choices.js fix for default array values
- Improved Dusk macro for Choices.js
- Modal/slideover size tests + styling bugfix
- Form
submit-on-change
attribute @preserveScroll
directive- Form
stay
now also ignores responses that don't redirect back - Additional test for using form components with
v-model
instead of aname
attribute
- Added test + fix for form method spoofing
- Built-in Query Builder for Table component
- Optional custom cell component in addition to the existing directive (
@cell
) - Support for Table objects so you can reuse table configurations
- Support for Bulk Actions (requires a table object)
- Support for Exports (requires a table object)
make:table
Command- Support for Modal/Slideover as Table RowLink
- Bugfix for #74
- Added 'scrollToError' form prop
- When the
keep-alive
component is used, the Dialog component will now be hidden when the user navigates to another page
- You may disable the paginator when the resource only contains one page (
SpladeTable::hidesPaginationWhenResourceContainsOnePage()
) - On validation errors, the Form component scrolls to the first element with an error. You may disable this with the
scrollOnError
prop.
- The debounce value of the Table component is now configurable.
- You may now pass a value to the Defer component that it will watch and perform a request whenever the value changes (with an optional debounce).
- The Defer component now has a
manual
attribute to prevent it from loading after mounting. - The Dropdown component now has a
teleport
attribute to indicate whether it should be attached to the body.
- The default confirm texts are now translated by default
- Dropdowns are now rendered using portals, for example, so that they are rendered outside of tables to prevent overflow issues
- Support for inline dropdowns
- Custom Table cell regex bugfix
- Support for rendering the Table component with auto-fill, but without the
thead
element - Improved Choices.js compatibility in the Select component
- Improved support for registering multiple custom Vue components at once
- File Input component UI fixes
- Table component UI fixes
- Fix for wrong
poll
type in Defer component - Support for setting the 'per-page' options globally or disable it (Table component)
- Support for defining the Toast message in the style/position method -
Toast::danger('Whoops!')
- SpladeMiddleware and ServiceProvider refactor
- Added tons of docblocks and comments in the codebase
Added docblocks + refactor
- Fix for lazy components without placeholder
- Better Toast TX
- Improved styling of fixed elements
- Middleware refactor to make sure HTTP Tests still work.
- Lazy Loading
- Teleport
- Transitions
- Persistent Layout
- Table responsive UI fixes
- The wrapper around the Table component can now be styled with classes
- Ability to disable 'toggleable' Table columns by default
- Ability to disable Choices.js/Flatpickr on specific elements while it's enabled globally
- Fix for binding the form
submit
method to av-on:change
attribute
- The
$__env
variable is now available to custom cells when using the Table component
- New
checkboxes
andradios
components - Some small refactors
- Render
action
attribute on Form component
- Workaround for selected options in SSR render
- Fixed Input component styling issue
- The Form component now always has a
method
attribute - Improved Choices.js and Flatpickr bindings for SSR
- Styling fixes for a disabled Form Input component
- Fix for nested data with FormData
- Always use FormData when sending forms
Revert a7c2919 because it breaks unfilled checkboxes
Bugfix
- Support for Eloquent relationships with the Form Checkbox component
- Support for submitting a form without an event object
- Fix for binding nested data
- Fix for NProgress import in dev build
- Fix for #33
- Progress bar
- More versatile dropdown component
- Default transition animation in the button dropdown
- Dropdown component now closes on escape keypress
- Transition component (internal only, might open up at some point)
- Refactored the Splade installer to prepare for the Breeze starter-kit
- Prepare Splade installer for Breeze starter-kit
- Fix for not showing the bound values when using Choices.js and Flatpickr
- Styling issues fixed
- Support for
name
andvalue
attributes in the Submit component - Styling fixes
- Ignore
StreamedResponse
in Splade middleware - Additional tests for nested data
- Simplified redirects
- Prepare form help texts
- Fix for undefined checkboxes
- Fix for form elements without a
name
attribute - Cleaner submit component
- Better handling of undefined data in the Form Component
- Exclude binary file responses from the Splade middleware
- Middleware fix for resolving validation errors
- Disable the form fields when processing
Cleanup
- Form Components to rapidly build forms. It supports model binding and validation, includes default styling, and is still fully customizable! It integrates with Autosize to automatically adjust textarea height, Choices.js to make selects searchable and taggable, and Flatpickr to provide a powerful datetime picker.
- Default data passed to
<x-form>
now requires theunguarded
attribute when binding an Eloquent Model or Fluent instance. This is not necessairy when using the new Form Components.
Bump npm package
- Table component with support auto-fill, searching, filtering, sorting, toggling columns, and pagination.
- Fixed automatic installer on Windows (#18) and added Windows to GitHub Actions.
- Removed Tailwind classes in Vue components (#26)
- Default close button for Modal and Slideover components (#14)
- Fix for rendering classes on the Form component (#17)
- Support for Server-side rendering (SSR).
- Support for title and meta tags.
- Migrated
SpladeCore.vue
toSplade.js
to prevent mulitple Vue instances.
- Fix
processing
prop in Form component (#11) - Fix
request
prop in Defer component (#9) - Fix for remembered data when using default data (#10)
- Fix for validation errors in Modal component (#7)
Dep fix
Initial relase