diff --git a/src/Dropdown.php b/src/Dropdown.php index 1c3c7026..a0b7a924 100644 --- a/src/Dropdown.php +++ b/src/Dropdown.php @@ -386,6 +386,16 @@ public function direction(DropdownDirection $direction): self return $new; } + /** + * Returns the CSS classes for the container. + * + * @return array The CSS classes for the container. + */ + public function getCssClasses(): array + { + return $this->cssClasses; + } + /** * Returns the list of links to appear in the dropdown. * @@ -936,7 +946,6 @@ private function renderToggler(string|null $togglerId): string $togglerAttributes = $this->togglerAttributes; $togglerClasses = $this->togglerClasses; - $classes = $togglerAttributes['class'] ?? null; unset($togglerAttributes['class']); @@ -953,7 +962,7 @@ private function renderToggler(string|null $togglerId): string $classes, ], ), - default => Html::addCssClass($togglerAttributes, $togglerClasses), + default => Html::addCssClass($togglerAttributes, [...$togglerClasses, $classes]), }; if ($this->togglerLink) { diff --git a/src/Nav.php b/src/Nav.php index b899155d..fe143c40 100644 --- a/src/Nav.php +++ b/src/Nav.php @@ -58,6 +58,7 @@ final class Nav extends Widget private array $attributes = []; private array $cssClasses = []; private string $currentPath = ''; + private array $dropdownCssClasses = [self::NAV_ITEM_DROPDOWN_CLASS]; private bool $fade = true; private bool|string $id = false; /** @var array */ @@ -158,6 +159,31 @@ public function addCssStyle(array|string $style, bool $overwrite = true): self return $new; } + /** + * Adds one or more CSS classes to the existing classes for dropdown. + * + * Multiple classes can be added by passing them as separate arguments. `null` values are filtered out + * automatically. + * + * @param BackedEnum|string|null ...$class One or more CSS class names to add. Pass `null` to skip adding a class. + * + * @return self A new instance with the specified CSS classes added to existing ones for dropdown. + * + * @link https://html.spec.whatwg.org/#classes + * + * Example usage: + * ```php + * $nav->addDropdownClass('custom-class', null, 'another-class', BackGroundColor::PRIMARY); + * ``` + */ + public function addDropdownClass(BackedEnum|string|null ...$class): self + { + $new = clone $this; + $new->dropdownCssClasses = [...$this->dropdownCssClasses, ...$class]; + + return $new; + } + /** * Sets attribute value. * @@ -581,7 +607,7 @@ private function renderItemsDropdown(Dropdown $items): Li $dropDownItems = $this->isDropdownActive($items); return Li::tag() - ->addClass(self::NAV_ITEM_DROPDOWN_CLASS) + ->addClass(...$this->dropdownCssClasses, ...$dropDownItems->getCssClasses()) ->addContent( "\n", $dropDownItems diff --git a/tests/NavTest.php b/tests/NavTest.php index 6c301057..6a6c3c10 100644 --- a/tests/NavTest.php +++ b/tests/NavTest.php @@ -1475,4 +1475,175 @@ public function testWorkingWithFlexUtilities(): void ->render(), ); } + + public function testDropdownAddTogglerClass(): void + { + Assert::equalsWithoutLE( + << +
  • + Active +
    • +
  • + + +
    • +
  • + Link +
    • +
  • + Disabled +
    • + + HTML, + Nav::widget() + ->items( + NavLink::to('Active', '#', active: true), + Dropdown::widget() + ->addTogglerClass('test-class') + ->items( + DropdownItem::link('Action', '#'), + DropdownItem::link('Another action', '#'), + DropdownItem::link('Something else here', '#'), + DropdownItem::divider(), + DropdownItem::link('Separated link', '#'), + ) + ->togglerContent('Dropdown'), + NavLink::to('Link', url: '#'), + NavLink::to('Disabled', '#', disabled: true), + ) + ->styles(NavStyle::TABS) + ->render(), + ); + } + + public function testDropdownAddClassForAllItemsDropdown(): void + { + Assert::equalsWithoutLE( + << +
  • + Active +
    • +
  • + + +
    • +
  • + Link +
    • +
  • + Disabled +
    • + + HTML, + Nav::widget() + ->addDropdownClass('test-class') + ->items( + NavLink::to('Active', '#', active: true), + Dropdown::widget() + ->items( + DropdownItem::link('Action', '#'), + DropdownItem::link('Another action', '#'), + DropdownItem::link('Something else here', '#'), + DropdownItem::divider(), + DropdownItem::link('Separated link', '#'), + ) + ->togglerContent('Dropdown'), + NavLink::to('Link', url: '#'), + NavLink::to('Disabled', '#', disabled: true), + ) + ->styles(NavStyle::TABS) + ->render(), + ); + } + + public function testDropdownAddClassForIndividualItemDropdown(): void + { + Assert::equalsWithoutLE( + << +
  • + Active +
    • +
  • + + +
    • +
  • + Link +
    • +
  • + Disabled +
    • + + HTML, + Nav::widget() + ->items( + NavLink::to('Active', '#', active: true), + Dropdown::widget() + ->addClass('test-class') + ->items( + DropdownItem::link('Action', '#'), + DropdownItem::link('Another action', '#'), + DropdownItem::link('Something else here', '#'), + DropdownItem::divider(), + DropdownItem::link('Separated link', '#'), + ) + ->togglerContent('Dropdown'), + NavLink::to('Link', url: '#'), + NavLink::to('Disabled', '#', disabled: true), + ) + ->styles(NavStyle::TABS) + ->render(), + ); + } }