changed all data and aria attributes to short syntax (fixed #27)

This commit is contained in:
Simon Karlen 2022-01-03 09:40:20 +01:00
parent 3e9be2ecec
commit 750c7e1b95
No known key found for this signature in database
GPG Key ID: 0630C27D666EBCC3
12 changed files with 35 additions and 33 deletions

View File

@ -187,8 +187,8 @@ class Accordion extends Widget
Html::addCssClass($options, ['visibility' => 'show']);
}
if (!isset($options['aria-label'], $options['aria-labelledby'])) {
$options['aria-labelledby'] = $options['id'] . '-heading';
if (!isset($options['aria']['label'], $options['aria']['labelledby'])) {
$options['aria']['labelledby'] = $options['id'] . '-heading';
}
$encodeLabel = $item['encode'] ?? $this->encodeLabels;

View File

@ -76,7 +76,7 @@ class Breadcrumbs extends Widget
* @var array the HTML attributes for the widgets nav container tag.
* @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
*/
public $navOptions = ['aria-label' => 'breadcrumb'];
public $navOptions = ['aria' => ['label' => 'breadcrumb']];
/**

View File

@ -77,7 +77,7 @@ class Carousel extends Widget
/**
* {@inheritdoc}
*/
public $options = ['data-bs-ride' => 'carousel'];
public $options = ['data' => ['bs-ride' => 'carousel']];
/**

View File

@ -124,10 +124,10 @@ class Dropdown extends Widget
Html::addCssClass($linkOptions, ['widget' => 'dropdown-item']);
if ($disabled) {
ArrayHelper::setValue($linkOptions, 'tabindex', '-1');
ArrayHelper::setValue($linkOptions, 'aria-disabled', 'true');
ArrayHelper::setValue($linkOptions, 'aria.disabled', 'true');
Html::addCssClass($linkOptions, ['disable' => 'disabled']);
} elseif ($active) {
ArrayHelper::setValue($linkOptions, 'aria-current', 'true');
ArrayHelper::setValue($linkOptions, 'aria.current', 'true');
Html::addCssClass($linkOptions, ['activate' => 'active']);
}
@ -147,10 +147,10 @@ class Dropdown extends Widget
Html::addCssClass($submenuOptions, ['widget' => 'dropdown-submenu dropdown-menu']);
Html::addCssClass($linkOptions, ['toggle' => 'dropdown-toggle']);
$lines[] = Html::beginTag('div', array_merge_recursive(['class' => ['dropdown'], 'aria-expanded' => 'false'], $itemOptions));
$lines[] = Html::a($label, $url, array_merge([
'data-bs-toggle' => 'dropdown',
'aria-expanded' => 'false',
$lines[] = Html::beginTag('div', array_merge_recursive(['class' => ['dropdown'], 'aria' => ['expanded' => 'false']], $itemOptions));
$lines[] = Html::a($label, $url, array_merge_recursive([
'data' => ['bs-toggle' => 'dropdown'],
'aria' => ['expanded' => 'false'],
'role' => 'button',
], $linkOptions));
$lines[] = static::widget([

View File

@ -288,7 +288,7 @@ class LinkPager extends Widget
Html::addCssClass($options, $class ?: $this->pageCssClass);
$linkOptions = $this->linkOptions;
$linkOptions['data-page'] = $page;
$linkOptions['data']['page'] = $page;
if ($active) {
$options['aria'] = ['current' => 'page'];

View File

@ -282,8 +282,8 @@ class Modal extends Widget
$this->titleOptions = array_merge([
'id' => $this->options['id'] . '-label',
], $this->titleOptions);
if (!isset($this->options['aria-label'], $this->options['aria-labelledby']) && isset($this->title)) {
$this->options['aria-labelledby'] = $this->titleOptions['id'];
if (!isset($this->options['aria']['label'], $this->options['aria']['labelledby']) && isset($this->title)) {
$this->options['aria']['labelledby'] = $this->titleOptions['id'];
}
if ($this->closeButton !== false) {
@ -296,11 +296,11 @@ class Modal extends Widget
if ($this->toggleButton !== false) {
$this->toggleButton = array_merge([
'data-bs-toggle' => 'modal',
'data' => ['bs-toggle' => 'modal'],
'type' => 'button',
], $this->toggleButton);
if (!isset($this->toggleButton['data-bs-target']) && !isset($this->toggleButton['href'])) {
$this->toggleButton['data-bs-target'] = '#' . $this->options['id'];
if (!isset($this->toggleButton['data']['bs-target']) && !isset($this->toggleButton['href'])) {
$this->toggleButton['data']['bs-target'] = '#' . $this->options['id'];
}
}

View File

@ -183,9 +183,9 @@ class Nav extends Widget
Html::addCssClass($options, ['widget' => 'nav-item']);
Html::addCssClass($linkOptions, ['widget' => 'nav-link']);
} else {
$linkOptions['data-bs-toggle'] = 'dropdown';
$linkOptions['data']['bs-toggle'] = 'dropdown';
$linkOptions['role'] = 'button';
$linkOptions['aria-expanded'] = 'false';
$linkOptions['aria']['expanded'] = 'false';
Html::addCssClass($options, ['widget' => 'dropdown nav-item']);
Html::addCssClass($linkOptions, ['widget' => 'dropdown-toggle nav-link']);
if (is_array($items)) {
@ -196,7 +196,7 @@ class Nav extends Widget
if ($disabled) {
ArrayHelper::setValue($linkOptions, 'tabindex', '-1');
ArrayHelper::setValue($linkOptions, 'aria-disabled', 'true');
ArrayHelper::setValue($linkOptions, 'aria.disabled', 'true');
Html::addCssClass($linkOptions, ['disable' => 'disabled']);
} elseif ($this->activateItems && $active) {
Html::addCssClass($linkOptions, ['activate' => 'active']);

View File

@ -223,16 +223,18 @@ class Offcanvas extends Widget
{
$this->options = array_merge([
'tabindex' => -1,
'data-bs-backdrop' => $this->backdrop ? 'true' : 'false',
'data-bs-scroll' => $this->scrolling ? 'true' : 'false'
'data' =>[
'bs-backdrop' => $this->backdrop ? 'true' : 'false',
'bs-scroll' => $this->scrolling ? 'true' : 'false'
]
], $this->options);
Html::addCssClass($this->options, ['widget' => 'offcanvas offcanvas-' . $this->placement]);
$this->titleOptions = array_merge([
'id' => $this->options['id'] . '-label',
], $this->titleOptions);
if (!isset($this->options['aria-label'], $this->options['aria-labelledby']) && isset($this->title)) {
$this->options['aria-labelledby'] = $this->titleOptions['id'];
if (!isset($this->options['aria']['label'], $this->options['aria']['labelledby']) && isset($this->title)) {
$this->options['aria']['labelledby'] = $this->titleOptions['id'];
}
if ($this->closeButton !== false) {
@ -245,12 +247,12 @@ class Offcanvas extends Widget
if ($this->toggleButton !== false) {
$this->toggleButton = array_merge([
'data-bs-toggle' => 'offcanvas',
'data' => ['bs-toggle' => 'offcanvas'],
'type' => 'button',
'aria-controls' => $this->options['id']
'aria' => ['controls' => $this->options['id']]
], $this->toggleButton);
if (!isset($this->toggleButton['data-bs-target']) && !isset($this->toggleButton['href'])) {
$this->toggleButton['data-bs-target'] = '#' . $this->options['id'];
if (!isset($this->toggleButton['data']['bs-target']) && !isset($this->toggleButton['href'])) {
$this->toggleButton['data']['bs-target'] = '#' . $this->options['id'];
}
}
}

View File

@ -216,7 +216,7 @@ class Toast extends Widget
if (!isset($this->options['role'])) {
$this->options['role'] = 'alert';
}
if (!isset($this->options['aria']) && !isset($this->options['aria-live'])) {
if (!isset($this->options['aria']['live'])) {
$this->options['aria'] = [
'live' => 'assertive',
'atomic' => 'true',

View File

@ -174,7 +174,7 @@ HTML;
$expected = <<<HTML
<div id="w0" class="dropdown-menu"><div class="dropdown" aria-expanded="false">
<a class="dropdown-item disabled dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button" tabindex="-1" aria-disabled="true">Dropdown1</a>
<a class="dropdown-item disabled dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" aria-disabled="true" role="button" tabindex="-1">Dropdown1</a>
<div id="w1" class="submenu-list dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page1</h6>
<h6 class="dropdown-header">Page2</h6></div>
</div>

View File

@ -87,7 +87,7 @@ HTML;
$out = ob_get_clean();
$this->assertContains(
'<button type="button" class="btn btn-primary" data-bs-toggle="offcanvas" aria-controls="w0" data-bs-target="#w0">Launch demo offcanvas</button>',
'<button type="button" class="btn btn-primary" data-bs-toggle="offcanvas" data-bs-target="#w0" aria-controls="w0">Launch demo offcanvas</button>',
$out
);
}

View File

@ -180,7 +180,7 @@ class TabsTest extends TestCase
]);
$this->assertContains(
'<li class="nav-item"><a class="nav-link disabled" href="#w0-tab0" data-bs-toggle="tab" role="tab" aria-controls="w0-tab0" tabindex="-1" aria-disabled="true">Page1</a></li>',
'<li class="nav-item"><a class="nav-link disabled" href="#w0-tab0" data-bs-toggle="tab" role="tab" aria-controls="w0-tab0" aria-disabled="true" tabindex="-1">Page1</a></li>',
$html
);
$this->assertContains(
@ -188,11 +188,11 @@ class TabsTest extends TestCase
$html
);
$this->assertContains(
'<li class="nav-item"><a class="nav-link disabled" href="#w0-tab2" data-bs-toggle="tab" role="tab" aria-controls="w0-tab2" tabindex="-1" aria-disabled="true">DisabledPage</a></li>',
'<li class="nav-item"><a class="nav-link disabled" href="#w0-tab2" data-bs-toggle="tab" role="tab" aria-controls="w0-tab2" aria-disabled="true" tabindex="-1">DisabledPage</a></li>',
$html
);
$this->assertContains(
'<a class="dropdown-item disabled" href="#w0-dd3-tab1" data-bs-toggle="tab" role="tab" aria-controls="w0-dd3-tab1" tabindex="-1" aria-disabled="true">DisabledItem</a>',
'<a class="dropdown-item disabled" href="#w0-dd3-tab1" data-bs-toggle="tab" role="tab" aria-controls="w0-dd3-tab1" aria-disabled="true" tabindex="-1">DisabledItem</a>',
$html
);
$this->assertContains(