Представляємо Filament v4 Beta — нову версію з потужними оновленнями. Вона стала швидшою, зручнішою у використанні та надає більше контролю при створенні додатків. У цій статті ми підкреслюємо основні нововведення і те, як вони можуть покращити вашу роботу!
Щоб оновити свій додаток до Filament v4 beta, ознайомтеся з посібником з оновлення. Для встановлення Filament v4 у новий додаток, будь ласка, відвідайте посібник з установки.
Ви переглядаєте функції для Filament
4.x, яка наразі перебуває вбетаверсії і не єстабільною. Під час бета-періоду можуть уводитися зміни. Будь ласка, повідомляйте про проблеми на GitHub.
Шукаєте стабільну версію? Відвідайте документацію для 3.x.
Продуктивність рендерингу та взаємодії у Filament значно покращилася, особливо для великих таблиць. Багато шаблонів Blade були оптимізовані для зменшення кількості рендерингу. Використання існуючих PHP-об’єктів для рендерингу HTML замість підключення нових файлів знижує навантаження на систему. Розмір Blade-шаблонів також зменшено завдяки витяганню груп класів Tailwind CSS у спеціалізовані класи, що зменшує обсяг HTML та пришвидшує завантаження сторінок.
Tailwind CSS v4 — це значне оновлення, спрямоване на продуктивність, гнучкість та відповідність сучасним веб-стандартам. В ньому є перероблена система налаштувань, покращена кастомізація та швидші збірки, що полегшує створення власних дизайнерських систем великого масштабу. Для отримання останніх нововведень відвідайте блог Tailwind CSS.
Tailwind CSS v4 модернізував свою кольорову систему, перейшовши від rgb до oklch, використовуючи ширшу палітру кольорів P3 для створення більш яскравих і точних кольорів, які виходять за межі sRGB.
З оновленням v4 ви помітите нові функції доступності в ваших додатках:
HTML та поліпшення доступності.У Filament v4, поряд із стандартною аутентифікацією за допомогою електронної пошти та паролю, багатоетапна аутентифікація (MFA) додає додатковий крок безпеки.
Filament підтримує два вбудовані методи MFA:
Потрібні додаткові опції MFA? Можна зареєструвати спеціальні постачальники MFA для розширення функціональних можливостей аутентифікації Filament.
Filament включає набір іконок Heroicons, що дозволяє вам використовувати іконки без додаткових установок. Нова Heroicon enum class забезпечує автозаповнення в IDE, щоб ви могли швидко знаходити потрібну іконку — більше ніяких магічних рядків!
Кожна іконка доступна у варіантах solid і outlined (Heroicon::Star та Heroicon::OutlinedStar). Filament автоматично обирає відповідний розмір (16px, 20px, або 24px) залежно від контексту.
Новий фасад FilamentTimezone дозволяє налаштувати стандартний час для Filament глобально через метод FilamentTimezone::set(), спрощуючи управління часовими поясами для різних компонентів. Це дозволяє контролювати кілька компонентів одночасно, включаючи DateTimePicker, TextColumn і TextEntry.
Дати та час тепер підтримують форматування за допомогою стандартних "ISO" форматів у компонентах TextColumn та TextEntry.
Менеджери зв'язків та сторінки зв'язків спрощують відображення та управління пов'язаними записами в ресурсі. Наприклад, у CourseResource ви можете використовувати менеджер зв'язків або сторінку для управління навчальними заняттями, що належать до курсу. Це дозволяє створювати та редагувати заняття безпосередньо з таблиці за допомогою модалів.
Якщо заняття є більш складними, модалів може бути недостатньо. У цьому випадку ви можете надати заняттям окремий ресурс з повноекранними формами для створення та редагування — це називається вкладеним ресурсом.
Класи ресурсів тепер генеруються в спеціалізованих просторах імен, що сприяє кращій організації вашого коду.
Ми також додали більш детальні рекомендації щодо підтримання коду Filament чистим та підтримуваним у v4. Ось деякі з наших улюблених:
form() та table() на окремі файли. Це допомагає уникнути "надутих" методів та покращує читабельність.Schemas/Components, а дії таблиць під Actions.За замовчуванням дія Створити та створити ще один очищує форму після відправки. Якщо ви хочете зберегти певні значення, тепер ви можете використовувати preserveFormDataWhenCreatingAnother() у класі сторінки створення та повертати лише дані, які бажаєте зберегти.
До Filament v4 у нас не було зручного способу налаштування розмітки сторінок в панелі Filament. Тепер кожна сторінка має свою власну схему, що визначає її структуру і вміст.
Ви можете перевизначити стандартну схему сторінки, використовуючи метод content(), щоб повністю контролювати розмітку.
Це дозволяє вам додавати, видаляти або змінювати порядок компонентів схеми, таких як таблиці, вкладки та інші елементи.
Тепер ви можете налаштувати стандартну поведінку перенаправлення після створення ресурсу.
Використовуючи налаштування панелі, ви можете вибрати, чи будуть перенаправлені користувачі на індексну сторінку, сторінку перегляду або редагування після створення запису.
Новий властивість $shouldSplitGlobalSearchTerms дозволяє вимкнути розділення глобальних пошукових термінів на окремі слова, покращуючи продуктивність пошуку на великих наборах даних.
Сторінки редагування та перегляду тепер повністю підтримують персоналізацію основної вкладки вмісту.
Перевизначивши метод getContentTabComponent(), ви можете використовувати будь-які опції налаштування вкладок, включаючи зміну мітки, іконки або навіть додавання спеціальних функцій.
Sidebar і Topbar тепер є компонентами Livewire, що дозволяє їм динамічно оновлюватись. Якщо вам потрібно оновити їх — наприклад, після зміни налаштувань або дозволів — ви можете надіслати refresh-sidebar або refresh-topbar подію браузера для тригера перезавантаження.
Схеми формують основу підходу Filament до UI, орієнтованого на сервер. Вони дозволяють вам будувати інтерфейси в PHP за допомогою структурованих об'єктів конфігурації, без необхідності вручну писати HTML або JavaScript. Ці схеми визначають, як виглядає та поводиться ваш UI, представляючи компоненти, такі як поля форм, записи інфосписку, компоненти макету та первинні компоненти.
Кожен компонент UI Filament — будь то поле форми, описовий список або статичний елемент, такий як текст або кнопки — налаштовується через схему. Компоненти є модульними, вкладеними та повторно використовуваними, що робить ваші інтерфейси послідовними та легкими для обслуговування.
Схема представлена Filament\Schemas\Schema, і ви можете передати масив компонентів через метод components().
Вкладки допомагають організувати довгі або складні схеми, групуючи компоненти в окремі секції, зменшуючи візуальний безлад і спрощуючи навігацію по формах. Тепер ви можете переключитися на вертикальне табу, викликавши метод vertical().
Розширений редактор тепер використовує Tiptap, сучасний, безголовий і високоадаптивний відкритий редактор.
За замовчуванням розширений редактор зберігає вміст як HTML. Якщо ви хочете зберегти вміст у форматі JSON, ви можете використовувати json().
Кастомні блоки — це елементи, які користувачі можуть перетягувати в Розширений редактор. Ви можете визначити кастомні блоки, які користувач може вставити за допомогою customBlocks().
Теги об'єднання дозволяють користувачам вставляти "заповнювачі" — наприклад, {{ name }} або {{ today }} — в розширений контент. Ці теги замінюються динамічними значеннями при рендерингу, що робить їх корисними для персоналізації повідомлень або відображення дат.
Щоб увімкнути теги об'єднання, використовуйте mergeTags() під час налаштування редактора.
Компонент Слайдер дозволяє користувачам вибирати одне або декілька числових значень, переміщаючи повзунок по шкалі — ідеально підходить для введення діапазонів, оцінок або відсотків.
Filament v4 Beta пропонує низку покращень, які зосереджені на підвищенні швидкості, послідовності та зручності в обслуговуванні під час розробки. Оскільки вона все ще в бета стані, це ідеальний час для того, щоб вивчити нові можливості та поділитися відгуками. Якщо вам потрібна стабільна версія, зверніться до документації 3.x.
Для оновлення вашого додатка до Filament v4 beta, будь ласка, ознайомтеся з посібником з оновлення. Щоб встановити Filament v4 у новий додаток, відвідайте посібник з установки.
Особлива подяка Dan Harrin за його чудову роботу над Filament v4!
Цю статтю написав Leandro Ferreira, з вкладом André Domingues і рецензією Dan Harrin та Alex Six.