diff --git a/CHANGELOG.md b/CHANGELOG.md index 61410a5..3429f78 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,7 @@ Yii Framework 2 bootstrap5 extension Change Log 2.0.2 under development ----------------------- +- Enh #11: Brought back close button api (simialbi) - Bug #6: yii\bootstrap5\BaseHtml::staticControl(): Argument #1 ($value) must be of type string, int given (dicrtarasov) - Bug #9: fixed default ActiveField::hintOptions (dicrtarasov) diff --git a/docs/guide-de/migrating-yii2-bootstrap.md b/docs/guide-de/migrating-yii2-bootstrap.md index 3a7eaee..bf7bace 100644 --- a/docs/guide-de/migrating-yii2-bootstrap.md +++ b/docs/guide-de/migrating-yii2-bootstrap.md @@ -2,12 +2,15 @@ Migration von yii2-bootstrap4 ============================= yii2-bootstrap4 ist eine komplette Überarbeitung des Projekts (siehe den Bootstrap 4 von Bootstrap 3 Migrationsguide). -Die grössten Änderungen finden Sie hier zusammengefasst: +Die größten Änderungen finden Sie hier zusammengefasst: ## Allgemein * Der Namespace ist nun `yii\bootstrap5` anstatt `yii\bootstrap4` * Die PHP Kompatibilität **ist beschränkt auf** `>=7.0` +* Der "Schließen"-Button von Widgets wie [[yii\bootstrap5\Alert|Alert]] oder [[yii\bootstrap5|Modal|Modal]] wird neu + via CSS dargestellt und hat keinen Inhalt mehr. Es ist daher beim Überschreiben sicherzustellen, dass die `btn-close` + Klasse entfernt wird und die benötigten Stile manuell gesetzt werden. ## Widgets / Klassen @@ -37,7 +40,7 @@ Es gibt eine neue Konstante [[yii\bootstrap5\ActiveForm::LAYOUT_FLOATING]]. Sie ### NavBar Es gibt nun die Möglichkeit der Erstellung einer [Offcanvas Navbar](https://getbootstrap.com/docs/5.1/components/navbar/#offcanvas). -Dies ist zu erreichen indem man die Eigentschaft `$collapseOptions` des Widgets [[yii\bootstrap5\NavBar|Navbar]] auf `false` +Dies ist zu erreichen, indem man die Eigenschaft `$collapseOptions` des Widgets [[yii\bootstrap5\NavBar|Navbar]] auf `false` und die Eigenschaft `$offcanvasOptions` auf ein array setzt (auch wenn leer). ### Tabs diff --git a/docs/guide/migrating-yii2-bootstrap.md b/docs/guide/migrating-yii2-bootstrap.md index f593f1f..b3eafd8 100644 --- a/docs/guide/migrating-yii2-bootstrap.md +++ b/docs/guide/migrating-yii2-bootstrap.md @@ -8,6 +8,9 @@ The most notable changes are summarized below: * The namespace is `yii\bootstrap5` instead of `yii\bootstrap4` * The php compatibility **is limited to** `>=7.0` +* The close buttons of widgets like [[yii\bootstrap5\Alert|Alert]] or [[yii\bootstrap5|Modal|Modal]] now gets rendered + via CSS and does not have any content anymore. So be sure to remove `btn-close` class and set appropriate styles yourself + if you override it. ## Widgets / Classes diff --git a/src/Alert.php b/src/Alert.php index 6052907..03068b6 100644 --- a/src/Alert.php +++ b/src/Alert.php @@ -108,8 +108,12 @@ class Alert extends Widget { if (($closeButton = $this->closeButton) !== false) { $tag = ArrayHelper::remove($closeButton, 'tag', 'button'); + $label = ArrayHelper::remove($closeButton, 'label', ''); + if ($tag === 'button' && !isset($closeButton['type'])) { + $closeButton['type'] = 'button'; + } - return Html::tag($tag, '', $closeButton); + return Html::tag($tag, $label, $closeButton); } else { return null; } @@ -125,7 +129,6 @@ class Alert extends Widget if ($this->closeButton !== false) { $this->closeButton = array_merge([ - 'type' => 'button', 'class' => ['widget' => 'btn-close'], 'data' => ['bs-dismiss' => 'alert'], 'aria' => ['label' => 'Close'] diff --git a/src/Modal.php b/src/Modal.php index 9276d27..342f0bc 100644 --- a/src/Modal.php +++ b/src/Modal.php @@ -252,8 +252,12 @@ class Modal extends Widget { if (($closeButton = $this->closeButton) !== false) { $tag = ArrayHelper::remove($closeButton, 'tag', 'button'); + $label = ArrayHelper::remove($closeButton, 'label', ''); + if ($tag === 'button' && !isset($closeButton['type'])) { + $closeButton['type'] = 'button'; + } - return Html::tag($tag, '', $closeButton); + return Html::tag($tag, $label, $closeButton); } else { return null; } @@ -284,10 +288,9 @@ class Modal extends Widget if ($this->closeButton !== false) { $this->closeButton = array_merge([ - 'data-bs-dismiss' => 'modal', - 'class' => 'btn-close', - 'type' => 'button', - 'aria-label' => 'Close' + 'class' => ['widget' => 'btn-close'], + 'data' => ['bs-dismiss' => 'modal'], + 'aria' => ['label' => 'Close'] ], $this->closeButton); } diff --git a/src/Offcanvas.php b/src/Offcanvas.php index 2e24f67..fb5f7f6 100644 --- a/src/Offcanvas.php +++ b/src/Offcanvas.php @@ -204,8 +204,12 @@ class Offcanvas extends Widget { if (($closeButton = $this->closeButton) !== false) { $tag = ArrayHelper::remove($closeButton, 'tag', 'button'); + $label = ArrayHelper::remove($closeButton, 'label', ''); + if ($tag === 'button' && !isset($closeButton['type'])) { + $closeButton['type'] = 'button'; + } - return Html::tag($tag, '', $closeButton); + return Html::tag($tag, $label, $closeButton); } else { return null; } @@ -233,10 +237,9 @@ class Offcanvas extends Widget if ($this->closeButton !== false) { $this->closeButton = array_merge([ - 'data-bs-dismiss' => 'offcanvas', - 'class' => 'btn-close text-reset', - 'type' => 'button', - 'aria-label' => 'Close' + 'class' => ['widget' => 'btn-close text-reset'], + 'data' => ['bs-dismiss' => 'offcanvas'], + 'aria' => ['label' => 'Close'] ], $this->closeButton); } diff --git a/src/Toast.php b/src/Toast.php index 9b74d23..2ba5abd 100644 --- a/src/Toast.php +++ b/src/Toast.php @@ -64,7 +64,7 @@ class Toast extends Widget */ public $dateTime = false; /** - * @var array the options for rendering the close button tag. + * @var array|false the options for rendering the close button tag. * The close button is displayed in the header of the toast. Clicking on the button will hide the toast. * * The following special options are supported: @@ -180,13 +180,21 @@ class Toast extends Widget /** * Renders the close button. - * @return string the rendering result + * @return string|null the rendering result */ - protected function renderCloseButton(): string + protected function renderCloseButton() { - $tag = ArrayHelper::remove($this->closeButton, 'tag', 'button'); + if (($closeButton = $this->closeButton) !== false) { + $tag = ArrayHelper::remove($closeButton, 'tag', 'button'); + $label = ArrayHelper::remove($closeButton, 'label', ''); + if ($tag === 'button' && !isset($closeButton['type'])) { + $closeButton['type'] = 'button'; + } - return Html::tag($tag, '', $this->closeButton); + return Html::tag($tag, $label, $closeButton); + } else { + return null; + } } /** @@ -197,12 +205,13 @@ class Toast extends Widget { Html::addCssClass($this->options, ['widget' => 'toast']); - $this->closeButton = array_merge([ - 'aria' => ['label' => 'Close'], - 'data' => ['bs-dismiss' => 'toast'], - 'class' => ['widget' => 'btn-close'], - 'type' => 'button', - ], $this->closeButton); + if ($this->closeButton !== false) { + $this->closeButton = array_merge([ + 'class' => ['widget' => 'btn-close'], + 'data' => ['bs-dismiss' => 'toast'], + 'aria' => ['label' => 'Close'] + ], $this->closeButton); + } if (!isset($this->options['role'])) { $this->options['role'] = 'alert'; diff --git a/tests/AlertTest.php b/tests/AlertTest.php index 38abe3a..87bd178 100644 --- a/tests/AlertTest.php +++ b/tests/AlertTest.php @@ -48,6 +48,38 @@ HTML; Message1 + +HTML; + $this->assertEqualsWithoutLE($expectedHtml, $html); + } + + /** + * @see https://github.com/yiisoft/yii2-bootstrap5/issues/11 + */ + public function testDismissibleAlertCustomButton() + { + Alert::$counter = 0; + $html = Alert::widget([ + 'body' => "Low Blow: Bob Loblaw's Law Blog Lobs Law Bomb", + 'options' => ['class' => 'alert-warning'], + 'closeButton' => [ + 'label' => 'Dismiss', + 'tag' => 'a', + 'class' => ['widget' => 'btn btn-outline-warning'], + 'style' => [ + 'position' => 'absolute', + 'top' => '.5rem', + 'right' => '.5rem' + ], + ] + ]); + + $expectedHtml = << + +Low Blow: Bob Loblaw's Law Blog Lobs Law Bomb +Dismiss + HTML; $this->assertEqualsWithoutLE($expectedHtml, $html); diff --git a/tests/ToastTest.php b/tests/ToastTest.php index bb160f9..5352f91 100644 --- a/tests/ToastTest.php +++ b/tests/ToastTest.php @@ -20,7 +20,7 @@ class ToastTest extends TestCase