upgrade-theme-v6-to-v7

What I do

• Read a legacy v6 theme class (Bootstrap, DaisyUI, a custom third-party theme) from GitHub or local disk.
• Create a v7 theme class with a tiny struct() (base view only) plus the per-section token methods (layout(), header(), table(), footer(), cols(), tabs(), filter(), editable(), toggleable()).
• Map every legacy v6 array method (table(), header(), checkbox(), searchBox(), filter*(), ...) onto the correct v7 section and token key.
• Set parentTheme = Tailwind::class so the migrated theme only declares what actually differs.

This skill is the canonical owner of the complete v6 -> v7 mapping table, which lives in REFERENCE.md.

When to use me

• Porting a legacy PowerGrid v6 theme to the v7 architecture.
• Upgrading a custom theme that still returns arrays from table(), checkbox(), footer(), etc. with the old (flat/renamed) keys.

How to use me

Use the 'upgrade-theme-v6-to-v7' skill to migrate the v6 Bootstrap theme at
https://raw.githubusercontent.com/Power-Components/livewire-powergrid/6.x/src/Themes/Bootstrap5.php

The good news: v7 is closer to v6 than you think

v7 did not collapse everything into one builder. Like v6, a theme is still a set of per-section methods that return arrays. The migration is mostly renaming and re-nesting keys and turning on inheritance. Four things change:

1. struct() is tiny. It only sets the base view — it does not carry the token tree:

   public function struct(): Components\ThemeBuilder
   {
       return Components\ThemeBuilder::make($this->name())->baseView($this->baseView());
   }
   protected function baseView(): string { return 'livewire-powergrid::components.themes.bootstrap5'; }
   

2. Token groups are per-section methods returning ['<group>' => [...]]. The group list is in Theme::themeTokenMethods(): layout, header, table, footer, cols, tabs, filter, editable, toggleable. Write each as a plain nested array (closest to v6) or with the fluent $this->section('<group>', fn (...) => ...) helper.
3. The hierarchy is re-nested and renamed:
   • checkbox and radio move under table (table.checkbox.*, table.radio.*).
   • searchBox moves under header (header.search_box.*).
   • footer gains a nested layout; the old footer_with_pagination becomes pagination.
   • table.header.* / table.body.* flatten to table.layout.*; thAction → th_actions, tdActionsContainer → td_actions.
4. Inheritance replaces boilerplate. Set protected ?string $parentTheme = Tailwind::class; and declare only the sections that differ from Tailwind. editable(), toggleable(), and filter() were also reworked:
   • editable() keeps clickable / input / error classes only. Discard view — the plugin blade is powergrid-plugins::Editable.index.
   • toggleable() is now five CSS color tokens (colorOn, colorOff, colorOnDark, colorOffDark, knobOn) set via ->fill([...]). The old view/base/label/input/role keys are gone.
   • filter() adds a label, a global input, and dropdown/flyout groups. Discard filter.multi_select.view — markup is <x-livewire-powergrid::inputs.select>.