nodebb-plugin-composer-default 10.2.31 → 10.2.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/package.json +1 -1
  2. package/static/lib/composer/formatting.js +19 -12
  3. package/static/lib/composer.js +4 -1
  4. package/static/templates/partials/composer-formatting.tpl +23 -16
  5. package/static/templates/partials/composer-tags.tpl +4 -4
  6. package/static/templates/partials/composer-title-container.tpl +10 -9
  7. package/static/templates/partials/composer-write-preview.tpl +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nodebb-plugin-composer-default",
3
- "version": "10.2.31",
3
+ "version": "10.2.33",
4
4
  "description": "Default composer for NodeBB",
5
5
  "main": "library.js",
6
6
  "repository": {
package/static/lib/composer/formatting.js CHANGED
@@ -87,8 +87,11 @@ define('composer/formatting', [
87
87
  markup = generateFormattingDropdown(btn);
88
88
  } else {
89
89
  markup = `
90
- <li data-format="${btn.name}" title="${btn.title || ''}" href="#" class="btn btn-sm btn-link text-reset position-relative" tabindex="-1">
91
- <i class="${btn.iconClass}"></i>
90
+ <li title="${btn.title || ''}">
91
+ <button data-format="${btn.name}" class="btn btn-sm btn-link text-reset position-relative" aria-label="${btn.title || ''}">
92
+ <i class="${btn.iconClass}"></i>
93
+ ${generateBadgetHtml(btn)}
94
+ </button>
92
95
  </li>
93
96
  `;
94
97
  }
@@ -111,27 +114,31 @@ define('composer/formatting', [
111
114
  });
112
115
  };
113
116
 
117
+ function generateBadgetHtml(btn) {
118
+ let badgeHtml = '';
119
+ if (btn.badge) {
120
+ badgeHtml = `<span class="px-1 position-absolute top-0 start-100 translate-middle badge rounded text-bg-info"></span>`;
121
+ }
122
+ return badgeHtml;
123
+ }
124
+
114
125
  function generateFormattingDropdown(btn) {
115
126
  const dropdownItemsHtml = btn.dropdownItems.map(function (btn) {
116
- let badgeHtml = '';
117
- if (btn.badge) {
118
- badgeHtml = `<span class="px-1 position-absolute top-0 start-100 translate-middle-x badge rounded text-bg-info"></span>`;
119
- }
120
127
  return `
121
- <li data-format="${btn.name}">
122
- <a href="#" class="dropdown-item rounded-1 position-relative">
128
+ <li>
129
+ <a href="#" data-format="${btn.name}" class="dropdown-item rounded-1 position-relative" role="menuitem">
123
130
  <i class="${btn.iconClass} text-secondary"></i> ${btn.text}
124
- ${badgeHtml}
131
+ ${generateBadgetHtml(btn)}
125
132
  </a>
126
133
  </li>
127
134
  `;
128
135
  });
129
136
  return `
130
137
  <li class="dropdown bottom-sheet" tab-index="-1" title="${btn.title}">
131
- <button class="btn btn-sm btn-link text-reset" data-bs-toggle="dropdown" >
138
+ <button class="btn btn-sm btn-link text-reset" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="${btn.title}">
132
139
  <i class="${btn.iconClass}"></i>
133
140
  </button>
134
- <ul class="dropdown-menu p-1">
141
+ <ul class="dropdown-menu p-1" role="menu">
135
142
  ${dropdownItemsHtml}
136
143
  </ul>
137
144
  </li>
@@ -170,7 +177,7 @@ define('composer/formatting', [
170
177
  };
171
178
 
172
179
  formatting.addHandler = function (postContainer) {
173
- postContainer.on('click', '.formatting-bar li[data-format]', function (event) {
180
+ postContainer.on('click', '.formatting-bar [data-format]', function (event) {
174
181
  var format = $(this).attr('data-format');
175
182
  var textarea = $(this).parents('[component="composer"]').find('textarea')[0];
176
183
 
package/static/lib/composer.js CHANGED
@@ -420,7 +420,7 @@ define('composer', [
420
420
 
421
421
  // Hide "zen mode" if fullscreen API is not enabled/available (ahem, iOS...)
422
422
  if (!screenfull.isEnabled) {
423
- $('[data-format="zen"]').addClass('hidden');
423
+ $('[data-format="zen"]').parent().addClass('hidden');
424
424
  }
425
425
 
426
426
  hooks.fire('action:composer.enhanced', { postContainer, postData, draft });
@@ -589,6 +589,9 @@ define('composer', [
589
589
  message: html,
590
590
  onEscape: true,
591
591
  backdrop: true,
592
+ onHidden: function () {
593
+ helpBtn.focus();
594
+ },
592
595
  });
593
596
  }
594
597
  });
package/static/templates/partials/composer-formatting.tpl CHANGED
@@ -6,17 +6,17 @@
6
6
  {{{ else }}}
7
7
  {{{ if (./visibility.desktop && ((isTopicOrMain && ./visibility.main) || (!isTopicOrMain && ./visibility.reply))) }}}
8
8
  {{{ if ./dropdownItems.length }}}
9
- <li class="dropdown bottom-sheet" tabindex="-1" title="{./title}">
10
- <button class="btn btn-sm btn-link text-reset" data-bs-toggle="dropdown">
9
+ <li class="dropdown bottom-sheet" title="{./title}">
10
+ <button class="btn btn-sm btn-link text-reset" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="{./title}">
11
11
  <i class="{./className}"></i>
12
12
  </button>
13
- <ul class="dropdown-menu p-1">
13
+ <ul class="dropdown-menu p-1" role="menu">
14
14
  {{{ each ./dropdownItems }}}
15
- <li data-format="{./name}">
16
- <a href="#" class="dropdown-item rounded-1 position-relative">
15
+ <li>
16
+ <a href="#" data-format="{./name}" class="dropdown-item rounded-1 position-relative" role="menuitem">
17
17
  <i class="{./className} text-secondary"></i> {./text}
18
18
  {{{ if ./badge }}}
19
- <span class="px-1 position-absolute top-0 start-100 translate-middle-x badge rounded text-bg-info"></span>
19
+ <span class="px-1 position-absolute top-0 start-100 translate-middle badge rounded text-bg-info"></span>
20
20
  {{{ end }}}
21
21
  </a>
22
22
  </li>
@@ -24,11 +24,13 @@
24
24
  </ul>
25
25
  </li>
26
26
  {{{ else }}}
27
- <li class="btn btn-sm btn-link text-reset position-relative" tabindex="-1" data-format="{./name}" title="{./title}">
28
- <i class="{./className}"></i>
29
- {{{ if ./badge }}}
30
- <span class="px-1 position-absolute top-0 start-100 translate-middle-x badge rounded text-bg-info"></span>
31
- {{{ end }}}
27
+ <li title="{./title}">
28
+ <button data-format="{./name}" class="btn btn-sm btn-link text-reset position-relative" aria-label="{./title}">
29
+ <i class="{./className}"></i>
30
+ {{{ if ./badge }}}
31
+ <span class="px-1 position-absolute top-0 start-100 translate-middle badge rounded text-bg-info"></span>
32
+ {{{ end }}}
33
+ </button>
32
34
  </li>
33
35
  {{{ end }}}
34
36
  {{{ end }}}
@@ -36,18 +38,23 @@
36
38
  {{{ end }}}
37
39
 
38
40
  {{{ if privileges.upload:post:image }}}
39
- <li class="img-upload-btn btn btn-sm btn-link text-reset" data-format="picture" tabindex="-1" title="[[modules:composer.upload-picture]]">
40
- <i class="fa fa-file-image-o"></i>
41
+ <li title="[[modules:composer.upload-picture]]">
42
+ <button data-format="picture" class="img-upload-btn btn btn-sm btn-link text-reset" aria-label="[[modules:composer.upload-picture]]">
43
+ <i class="fa fa-file-image-o"></i>
44
+ </button>
41
45
  </li>
42
46
  {{{ end }}}
47
+
43
48
  {{{ if privileges.upload:post:file }}}
44
- <li href="#" class="file-upload-btn btn btn-sm btn-link text-reset" data-format="upload" tabindex="-1" title="[[modules:composer.upload-file]]">
45
- <i class="fa fa-file-o"></i>
49
+ <li title="[[modules:composer.upload-file]]">
50
+ <button data-format="upload" class="file-upload-btn btn btn-sm btn-link text-reset" aria-label="[[modules:composer.upload-file]]">
51
+ <i class="fa fa-file-o"></i>
52
+ </button>
46
53
  </li>
47
54
  {{{ end }}}
48
55
 
49
56
  <form id="fileForm" method="post" enctype="multipart/form-data">
50
- <input type="file" id="files" name="files[]" multiple class="gte-ie9 hide"/>
57
+ <input type="file" id="files" name="files[]" multiple class="hide"/>
51
58
  </form>
52
59
  </ul>
53
60
  <div class="d-flex align-items-center gap-1">
package/static/templates/partials/composer-tags.tpl CHANGED
@@ -1,17 +1,17 @@
1
1
  <div class="tag-row">
2
2
  <div class="tags-container d-flex align-items-center {{{ if tagWhitelist.length }}}haswhitelist{{{ end }}}">
3
3
  <div class="btn-group dropup me-2 {{{ if !tagWhitelist.length }}}hidden{{{ end }}}" component="composer/tag/dropdown">
4
- <button class="btn btn-sm btn-link text-body dropdown-toggle" data-bs-toggle="dropdown" type="button">
4
+ <button class="btn btn-sm btn-link text-body dropdown-toggle" data-bs-toggle="dropdown" type="button" aria-haspopup="true" aria-expanded="false">
5
5
  <span class="visible-sm-inline visible-md-inline visible-lg-inline"><i class="fa fa-tags"></i></span>
6
6
  [[tags:select-tags]]
7
7
  </button>
8
8
 
9
- <ul class="dropdown-menu">
9
+ <ul class="dropdown-menu" role="menu">
10
10
  <!-- BEGIN tagWhitelist -->
11
- <li data-tag="{@value}"><a class="dropdown-item" href="#">{@value}</a></li>
11
+ <li data-tag="{@value}"><a class="dropdown-item" href="#" role="menuitem">{@value}</a></li>
12
12
  <!-- END tagWhitelist -->
13
13
  </ul>
14
14
  </div>
15
- <input class="tags" type="text" class="" placeholder="[[tags:enter-tags-here, {minimumTagLength}, {maximumTagLength}]]" tabindex="5" />
15
+ <input class="tags" type="text" class="" placeholder="[[tags:enter-tags-here, {minimumTagLength}, {maximumTagLength}]]" />
16
16
  </div>
17
17
  </div>
package/static/templates/partials/composer-title-container.tpl CHANGED
@@ -7,12 +7,13 @@
7
7
 
8
8
  {{{ if showHandleInput }}}
9
9
  <div data-component="composer/handle">
10
- <input class="handle form-control h-100 border-0 shadow-none" type="text" tabindex="1" placeholder="[[topic:composer.handle-placeholder]]" value="{handle}" />
10
+ <input class="handle form-control h-100 border-0 shadow-none" type="text" placeholder="[[topic:composer.handle-placeholder]]" value="{handle}" />
11
11
  </div>
12
12
  {{{ end }}}
13
+
13
14
  <div data-component="composer/title" class="position-relative flex-1" style="min-width: 0;">
14
15
  {{{ if isTopicOrMain }}}
15
- <input class="title form-control h-100 rounded-1 shadow-none" type="text" tabindex="1" placeholder="[[topic:composer.title-placeholder]]" value="{topicTitle}"/>
16
+ <input class="title form-control h-100 rounded-1 shadow-none" type="text" placeholder="[[topic:composer.title-placeholder]]" value="{topicTitle}" />
16
17
  {{{ else }}}
17
18
  <span class="{{{ if !template.compose }}}d-none d-md-block{{{ else }}}d-block{{{ end }}} title h-100 text-truncate">{{{ if isEditing }}}[[topic:composer.editing-in, "{topicTitle}"]]{{{ else }}}[[topic:composer.replying-to, "{topicTitle}"]]{{{ end }}}</span>
18
19
  {{{ end }}}
@@ -23,20 +24,20 @@
23
24
  </div>
24
25
 
25
26
  <div class="{{{ if !template.compose }}}d-none d-md-flex{{{ else }}}d-flex{{{ end }}} action-bar gap-1 align-items-center">
26
- <button class="btn btn-sm btn-link text-body fw-semibold composer-minimize" data-action="hide" tabindex="-1"><i class="fa fa-angle-down"></i> <span class="d-none d-md-inline">[[topic:composer.hide]]</span></button>
27
- <button class="btn btn-sm btn-link composer-discard text-body fw-semibold" data-action="discard" tabindex="-1"><i class="fa fa-trash"></i> <span class="d-none d-md-inline">[[topic:composer.discard]]</button>
27
+ <button class="btn btn-sm btn-link text-body fw-semibold composer-minimize" data-action="hide"><i class="fa fa-angle-down"></i> <span class="d-none d-md-inline">[[topic:composer.hide]]</span></button>
28
+ <button class="btn btn-sm btn-link composer-discard text-body fw-semibold" data-action="discard"><i class="fa fa-trash"></i> <span class="d-none d-md-inline">[[topic:composer.discard]]</button>
28
29
  <div class="btn-group btn-group-sm" component="composer/submit/container">
29
- <button class="btn btn-primary composer-submit fw-bold {{{ if !(submitOptions.length || canSchedule) }}}rounded-1{{{ end }}}" data-action="post" tabindex="6" data-text-variant=" [[topic:composer.schedule]]"><i class="fa fa-check"></i> <span class="d-none d-md-inline">[[topic:composer.submit]]</span></button>
30
+ <button class="btn btn-primary composer-submit fw-bold {{{ if !(submitOptions.length || canSchedule) }}}rounded-1{{{ end }}}" data-action="post" data-text-variant=" [[topic:composer.schedule]]"><i class="fa fa-check"></i> <span class="d-none d-md-inline">[[topic:composer.submit]]</span></button>
30
31
  <div component="composer/submit/options/container" data-submit-options="{submitOptions.length}" class="btn-group btn-group-sm {{{ if !(submitOptions.length || canSchedule) }}}hidden{{{ end }}}">
31
32
  <button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
32
33
  <i class="fa fa-caret-down"></i>
33
34
  <span class="sr-only">[[topic:composer.additional-options]]</span>
34
35
  </button>
35
- <ul class="dropdown-menu dropdown-menu-end p-1">
36
- <li><a class="dropdown-item rounded-1 display-scheduler {{{ if !canSchedule }}}hidden{{{ end }}}">[[topic:composer.post-later]]</a></li>
37
- <li><a class="dropdown-item rounded-1 cancel-scheduling hidden">[[modules:composer.cancel-scheduling]]</a></li>
36
+ <ul class="dropdown-menu dropdown-menu-end p-1" role="menu">
37
+ <li><a class="dropdown-item rounded-1 display-scheduler {{{ if !canSchedule }}}hidden{{{ end }}}" role="menuitem">[[topic:composer.post-later]]</a></li>
38
+ <li><a class="dropdown-item rounded-1 cancel-scheduling hidden" role="menuitem">[[modules:composer.cancel-scheduling]]</a></li>
38
39
  {{{ each submitOptions }}}
39
- <li><a class="dropdown-item rounded-1" href="#" data-action="{./action}">{./text}</a></li>
40
+ <li><a class="dropdown-item rounded-1" href="#" data-action="{./action}" role="menuitem">{./text}</a></li>
40
41
  {{{ end }}}
41
42
  </ul>
42
43
  </div>
package/static/templates/partials/composer-write-preview.tpl CHANGED
@@ -2,7 +2,7 @@
2
2
  <div class="write-container d-flex d-md-flex w-50 position-relative">
3
3
  <div component="composer/post-queue/alert" class="m-2 alert alert-info fade pe-none position-absolute top-0 start-0 alert-dismissible">[[modules:composer.post-queue-alert]]<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button></div>
4
4
  <div class="draft-icon position-absolute end-0 top-0 mx-2 my-1 hidden-md hidden-lg"></div>
5
- <textarea class="write shadow-none rounded-1 w-100 form-control" tabindex="4" placeholder="[[modules:composer.textarea.placeholder]]">{body}</textarea>
5
+ <textarea class="write shadow-none rounded-1 w-100 form-control" placeholder="[[modules:composer.textarea.placeholder]]">{body}</textarea>
6
6
  </div>
7
7
  <div class="preview-container d-none d-md-flex w-50">
8
8
  <div class="preview w-100 overflow-auto"></div>