carbon-components-angular 3.17.2 → 3.17.3
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.
- package/docs/documentation/components/Dropdown.html +10 -5
- package/docs/documentation/components/File.html +49 -6
- package/docs/documentation/components/FileUploader.html +39 -27
- package/docs/documentation/components/Header.html +428 -11
- package/docs/documentation/components/HeaderAction.html +6 -8
- package/docs/documentation/components/Notification.html +37 -5
- package/docs/documentation/components/Toast.html +77 -7
- package/docs/documentation/coverage.html +12 -12
- package/docs/documentation/interfaces/FileItem.html +66 -0
- package/docs/documentation/interfaces/NotificationContent.html +39 -0
- package/docs/documentation/interfaces/ToastContent.html +1 -0
- package/docs/documentation/js/menu-wc.js +1 -1
- package/docs/documentation/js/search/search_index.js +2 -2
- package/docs/documentation/modules/FileUploaderModule.html +3 -1
- package/docs/storybook/iframe.html +3 -3
- package/docs/storybook/{main.8bb53895aa13a93f113f.bundle.js → main.edce6b8dbd74b486e13b.bundle.js} +151 -58
- package/docs/storybook/main.edce6b8dbd74b486e13b.bundle.js.map +1 -0
- package/docs/storybook/{runtime~main.8bb53895aa13a93f113f.bundle.js → runtime~main.edce6b8dbd74b486e13b.bundle.js} +1 -1
- package/docs/storybook/{runtime~main.8bb53895aa13a93f113f.bundle.js.map → runtime~main.edce6b8dbd74b486e13b.bundle.js.map} +1 -1
- package/docs/storybook/{vendors~main.8bb53895aa13a93f113f.bundle.js → vendors~main.edce6b8dbd74b486e13b.bundle.js} +1 -1
- package/docs/storybook/{vendors~main.8bb53895aa13a93f113f.bundle.js.map → vendors~main.edce6b8dbd74b486e13b.bundle.js.map} +1 -1
- package/dropdown/dropdown.component.js +4 -0
- package/dropdown/dropdown.component.js.map +1 -1
- package/file-uploader/file-item.interface.d.ts +2 -0
- package/file-uploader/file-item.interface.js.map +1 -1
- package/file-uploader/file-uploader.component.js +3 -1
- package/file-uploader/file-uploader.component.js.map +1 -1
- package/file-uploader/file-uploader.component.metadata.json +1 -1
- package/file-uploader/file-uploader.component.ngfactory.js +9 -8
- package/file-uploader/file-uploader.component.ngfactory.js.map +1 -1
- package/file-uploader/file-uploader.module.js +3 -1
- package/file-uploader/file-uploader.module.js.map +1 -1
- package/file-uploader/file-uploader.module.metadata.json +1 -1
- package/file-uploader/file-uploader.module.ngfactory.js +2 -1
- package/file-uploader/file-uploader.module.ngfactory.js.map +1 -1
- package/file-uploader/file-uploader.module.ngsummary.json +1 -1
- package/file-uploader/file.component.d.ts +1 -0
- package/file-uploader/file.component.js +10 -2
- package/file-uploader/file.component.js.map +1 -1
- package/file-uploader/file.component.metadata.json +1 -1
- package/file-uploader/file.component.ngfactory.js +19 -16
- package/file-uploader/file.component.ngfactory.js.map +1 -1
- package/file-uploader/file.component.ngsummary.json +1 -1
- package/notification/notification-content.interface.d.ts +1 -0
- package/notification/notification-content.interface.js.map +1 -1
- package/notification/notification.component.d.ts +1 -0
- package/notification/notification.component.js +7 -1
- package/notification/notification.component.js.map +1 -1
- package/notification/notification.component.metadata.json +1 -1
- package/notification/notification.component.ngfactory.js +1 -1
- package/notification/notification.component.ngsummary.json +1 -1
- package/notification/toast.component.d.ts +1 -0
- package/notification/toast.component.js +7 -1
- package/notification/toast.component.js.map +1 -1
- package/notification/toast.component.metadata.json +1 -1
- package/notification/toast.component.ngfactory.js +1 -1
- package/notification/toast.component.ngsummary.json +1 -1
- package/package.json +1 -1
- package/ui-shell/header/header-action.component.js +1 -1
- package/ui-shell/header/header-action.component.js.map +1 -1
- package/ui-shell/header/header-action.component.metadata.json +1 -1
- package/ui-shell/header/header-action.component.ngfactory.js +5 -6
- package/ui-shell/header/header-action.component.ngfactory.js.map +1 -1
- package/ui-shell/header/header.component.d.ts +26 -1
- package/ui-shell/header/header.component.js +40 -5
- package/ui-shell/header/header.component.js.map +1 -1
- package/ui-shell/header/header.component.metadata.json +1 -1
- package/ui-shell/header/header.component.ngfactory.js +9 -3
- package/ui-shell/header/header.component.ngfactory.js.map +1 -1
- package/ui-shell/header/header.component.ngsummary.json +1 -1
- package/ui-shell/header/header.module.ngfactory.js.map +1 -1
- package/docs/storybook/main.8bb53895aa13a93f113f.bundle.js.map +0 -1
|
@@ -105,13 +105,17 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
105
105
|
role="banner"
|
|
106
106
|
[attr.aria-label]="brand + ' ' + name">
|
|
107
107
|
<a
|
|
108
|
+
*ngIf="!skipTo"
|
|
108
109
|
class="bx--skip-to-content"
|
|
109
110
|
[href]="skipTo"
|
|
110
111
|
tabindex="0">
|
|
111
112
|
{{ i18n.get("UI_SHELL.SKIP_TO") | async }}
|
|
112
113
|
</a>
|
|
113
114
|
<ng-content select="ibm-hamburger"></ng-content>
|
|
114
|
-
<a
|
|
115
|
+
<a
|
|
116
|
+
class="bx--header__name"
|
|
117
|
+
href="#"
|
|
118
|
+
(click)="navigate($event)">
|
|
115
119
|
<span class="bx--header__name--prefix">{{brand}}&nbsp;</span>
|
|
116
120
|
{{name}}
|
|
117
121
|
</a>
|
|
@@ -144,6 +148,10 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
144
148
|
<tr>
|
|
145
149
|
<td class="col-md-4">
|
|
146
150
|
<ul class="index-list">
|
|
151
|
+
<li>
|
|
152
|
+
<span class="modifier">Protected</span>
|
|
153
|
+
<a href="#_href">_href</a>
|
|
154
|
+
</li>
|
|
147
155
|
<li>
|
|
148
156
|
<span class="modifier">Public</span>
|
|
149
157
|
<a href="#i18n">i18n</a>
|
|
@@ -152,6 +160,20 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
152
160
|
</td>
|
|
153
161
|
</tr>
|
|
154
162
|
|
|
163
|
+
<tr>
|
|
164
|
+
<td class="col-md-4">
|
|
165
|
+
<h6><b>Methods</b></h6>
|
|
166
|
+
</td>
|
|
167
|
+
</tr>
|
|
168
|
+
<tr>
|
|
169
|
+
<td class="col-md-4">
|
|
170
|
+
<ul class="index-list">
|
|
171
|
+
<li>
|
|
172
|
+
<a href="#navigate">navigate</a>
|
|
173
|
+
</li>
|
|
174
|
+
</ul>
|
|
175
|
+
</td>
|
|
176
|
+
</tr>
|
|
155
177
|
|
|
156
178
|
<tr>
|
|
157
179
|
<td class="col-md-4">
|
|
@@ -164,9 +186,18 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
164
186
|
<li>
|
|
165
187
|
<a href="#brand">brand</a>
|
|
166
188
|
</li>
|
|
189
|
+
<li>
|
|
190
|
+
<a href="#href">href</a>
|
|
191
|
+
</li>
|
|
167
192
|
<li>
|
|
168
193
|
<a href="#name">name</a>
|
|
169
194
|
</li>
|
|
195
|
+
<li>
|
|
196
|
+
<a href="#route">route</a>
|
|
197
|
+
</li>
|
|
198
|
+
<li>
|
|
199
|
+
<a href="#routeExtras">routeExtras</a>
|
|
200
|
+
</li>
|
|
170
201
|
<li>
|
|
171
202
|
<a href="#skipTo">skipTo</a>
|
|
172
203
|
</li>
|
|
@@ -174,9 +205,37 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
174
205
|
</td>
|
|
175
206
|
</tr>
|
|
176
207
|
|
|
208
|
+
<tr>
|
|
209
|
+
<td class="col-md-4">
|
|
210
|
+
<h6><b>Outputs</b></h6>
|
|
211
|
+
</td>
|
|
212
|
+
</tr>
|
|
213
|
+
<tr>
|
|
214
|
+
<td class="col-md-4">
|
|
215
|
+
<ul class="index-list">
|
|
216
|
+
<li>
|
|
217
|
+
<a href="#navigation">navigation</a>
|
|
218
|
+
</li>
|
|
219
|
+
</ul>
|
|
220
|
+
</td>
|
|
221
|
+
</tr>
|
|
177
222
|
|
|
178
223
|
|
|
179
224
|
|
|
225
|
+
<tr>
|
|
226
|
+
<td class="col-md-4">
|
|
227
|
+
<h6><b>Accessors</b></h6>
|
|
228
|
+
</td>
|
|
229
|
+
</tr>
|
|
230
|
+
<tr>
|
|
231
|
+
<td class="col-md-4">
|
|
232
|
+
<ul class="index-list">
|
|
233
|
+
<li>
|
|
234
|
+
<a href="#href">href</a>
|
|
235
|
+
</li>
|
|
236
|
+
</ul>
|
|
237
|
+
</td>
|
|
238
|
+
</tr>
|
|
180
239
|
</tbody>
|
|
181
240
|
</table>
|
|
182
241
|
</section>
|
|
@@ -187,12 +246,12 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
187
246
|
<tbody>
|
|
188
247
|
<tr>
|
|
189
248
|
<td class="col-md-4">
|
|
190
|
-
<code>constructor(i18n: <a href="../injectables/I18n.html">I18n</a>)</code>
|
|
249
|
+
<code>constructor(i18n: <a href="../injectables/I18n.html">I18n</a>, domSanitizer: <a href="https://angular.io/api/platform-browser/DomSanitizer" target="_blank">DomSanitizer</a>, router: <a href="https://angular.io/api/router/Router" target="_blank">Router</a>)</code>
|
|
191
250
|
</td>
|
|
192
251
|
</tr>
|
|
193
252
|
<tr>
|
|
194
253
|
<td class="col-md-4">
|
|
195
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
254
|
+
<div class="io-line">Defined in <a href="" data-line="89" class="link-to-prism">src/ui-shell/header/header.component.ts:89</a></div>
|
|
196
255
|
</td>
|
|
197
256
|
</tr>
|
|
198
257
|
|
|
@@ -221,6 +280,30 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
221
280
|
</td>
|
|
222
281
|
|
|
223
282
|
</tr>
|
|
283
|
+
<tr>
|
|
284
|
+
<td>domSanitizer</td>
|
|
285
|
+
|
|
286
|
+
<td>
|
|
287
|
+
<code><a href="https://angular.io/api/platform-browser/DomSanitizer" target="_blank" >DomSanitizer</a></code>
|
|
288
|
+
</td>
|
|
289
|
+
|
|
290
|
+
<td>
|
|
291
|
+
No
|
|
292
|
+
</td>
|
|
293
|
+
|
|
294
|
+
</tr>
|
|
295
|
+
<tr>
|
|
296
|
+
<td>router</td>
|
|
297
|
+
|
|
298
|
+
<td>
|
|
299
|
+
<code><a href="https://angular.io/api/router/Router" target="_blank" >Router</a></code>
|
|
300
|
+
</td>
|
|
301
|
+
|
|
302
|
+
<td>
|
|
303
|
+
No
|
|
304
|
+
</td>
|
|
305
|
+
|
|
306
|
+
</tr>
|
|
224
307
|
</tbody>
|
|
225
308
|
</table>
|
|
226
309
|
</div>
|
|
@@ -249,7 +332,30 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
249
332
|
</tr>
|
|
250
333
|
<tr>
|
|
251
334
|
<td class="col-md-2" colspan="2">
|
|
252
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
335
|
+
<div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/ui-shell/header/header.component.ts:59</a></div>
|
|
336
|
+
</td>
|
|
337
|
+
</tr>
|
|
338
|
+
</tbody>
|
|
339
|
+
</table>
|
|
340
|
+
<table class="table table-sm table-bordered">
|
|
341
|
+
<tbody>
|
|
342
|
+
<tr>
|
|
343
|
+
<td class="col-md-2">
|
|
344
|
+
<a name="href"></a>
|
|
345
|
+
<code>href</code>
|
|
346
|
+
</td>
|
|
347
|
+
<td class="col-md-10">
|
|
348
|
+
<div><p>Optional link for the header</p>
|
|
349
|
+
</div>
|
|
350
|
+
<p>
|
|
351
|
+
<em>Type :</em> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
|
|
352
|
+
|
|
353
|
+
</p>
|
|
354
|
+
</td>
|
|
355
|
+
</tr>
|
|
356
|
+
<tr>
|
|
357
|
+
<td class="col-md-2" colspan="2">
|
|
358
|
+
<div class="io-line">Defined in <a href="" data-line="64" class="link-to-prism">src/ui-shell/header/header.component.ts:64</a></div>
|
|
253
359
|
</td>
|
|
254
360
|
</tr>
|
|
255
361
|
</tbody>
|
|
@@ -272,7 +378,55 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
272
378
|
</tr>
|
|
273
379
|
<tr>
|
|
274
380
|
<td class="col-md-2" colspan="2">
|
|
275
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
381
|
+
<div class="io-line">Defined in <a href="" data-line="55" class="link-to-prism">src/ui-shell/header/header.component.ts:55</a></div>
|
|
382
|
+
</td>
|
|
383
|
+
</tr>
|
|
384
|
+
</tbody>
|
|
385
|
+
</table>
|
|
386
|
+
<table class="table table-sm table-bordered">
|
|
387
|
+
<tbody>
|
|
388
|
+
<tr>
|
|
389
|
+
<td class="col-md-2">
|
|
390
|
+
<a name="route"></a>
|
|
391
|
+
<code>route</code>
|
|
392
|
+
</td>
|
|
393
|
+
<td class="col-md-10">
|
|
394
|
+
<div><p>Array of commands to send to the router when the link is activated
|
|
395
|
+
See: <a href="https://angular.io/api/router/Router#navigate">https://angular.io/api/router/Router#navigate</a></p>
|
|
396
|
+
</div>
|
|
397
|
+
<p>
|
|
398
|
+
<em>Type :</em> <code>any[]</code>
|
|
399
|
+
|
|
400
|
+
</p>
|
|
401
|
+
</td>
|
|
402
|
+
</tr>
|
|
403
|
+
<tr>
|
|
404
|
+
<td class="col-md-2" colspan="2">
|
|
405
|
+
<div class="io-line">Defined in <a href="" data-line="76" class="link-to-prism">src/ui-shell/header/header.component.ts:76</a></div>
|
|
406
|
+
</td>
|
|
407
|
+
</tr>
|
|
408
|
+
</tbody>
|
|
409
|
+
</table>
|
|
410
|
+
<table class="table table-sm table-bordered">
|
|
411
|
+
<tbody>
|
|
412
|
+
<tr>
|
|
413
|
+
<td class="col-md-2">
|
|
414
|
+
<a name="routeExtras"></a>
|
|
415
|
+
<code>routeExtras</code>
|
|
416
|
+
</td>
|
|
417
|
+
<td class="col-md-10">
|
|
418
|
+
<div><p>Router options. Used in conjunction with <code>route</code>
|
|
419
|
+
See: <a href="https://angular.io/api/router/Router#navigate">https://angular.io/api/router/Router#navigate</a></p>
|
|
420
|
+
</div>
|
|
421
|
+
<p>
|
|
422
|
+
<em>Type :</em> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >any</a></code>
|
|
423
|
+
|
|
424
|
+
</p>
|
|
425
|
+
</td>
|
|
426
|
+
</tr>
|
|
427
|
+
<tr>
|
|
428
|
+
<td class="col-md-2" colspan="2">
|
|
429
|
+
<div class="io-line">Defined in <a href="" data-line="82" class="link-to-prism">src/ui-shell/header/header.component.ts:82</a></div>
|
|
276
430
|
</td>
|
|
277
431
|
</tr>
|
|
278
432
|
</tbody>
|
|
@@ -295,21 +449,155 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
295
449
|
</tr>
|
|
296
450
|
<tr>
|
|
297
451
|
<td class="col-md-2" colspan="2">
|
|
298
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
452
|
+
<div class="io-line">Defined in <a href="" data-line="51" class="link-to-prism">src/ui-shell/header/header.component.ts:51</a></div>
|
|
299
453
|
</td>
|
|
300
454
|
</tr>
|
|
301
455
|
</tbody>
|
|
302
456
|
</table>
|
|
303
457
|
</section>
|
|
458
|
+
<section>
|
|
459
|
+
<h3 id="outputs">Outputs</h3>
|
|
460
|
+
<table class="table table-sm table-bordered">
|
|
461
|
+
<tbody>
|
|
462
|
+
<tr>
|
|
463
|
+
<td class="col-md-2">
|
|
464
|
+
<a name="navigation"></a>
|
|
465
|
+
<code>navigation</code>
|
|
466
|
+
</td>
|
|
467
|
+
<td class="col-md-10">
|
|
468
|
+
<div><p>Emits the navigation status promise when the link is activated</p>
|
|
469
|
+
</div>
|
|
470
|
+
<em><code>$event</code> Type:</em> <code><a href="https://angular.io/api/core/EventEmitter" target="_blank" >EventEmitter</a></code>
|
|
304
471
|
|
|
472
|
+
</td>
|
|
473
|
+
</tr>
|
|
474
|
+
<tr>
|
|
475
|
+
<td class="col-md-2" colspan="2">
|
|
476
|
+
<div class="io-line">Defined in <a href="" data-line="87" class="link-to-prism">src/ui-shell/header/header.component.ts:87</a></div>
|
|
477
|
+
</td>
|
|
478
|
+
</tr>
|
|
479
|
+
</tbody>
|
|
480
|
+
</table>
|
|
481
|
+
</section>
|
|
305
482
|
|
|
306
483
|
|
|
484
|
+
<section>
|
|
485
|
+
|
|
486
|
+
<h3 id="methods">
|
|
487
|
+
Methods
|
|
488
|
+
</h3>
|
|
489
|
+
<table class="table table-sm table-bordered">
|
|
490
|
+
<tbody>
|
|
491
|
+
<tr>
|
|
492
|
+
<td class="col-md-4">
|
|
493
|
+
<a name="navigate"></a>
|
|
494
|
+
<span class="name">
|
|
495
|
+
<b>
|
|
496
|
+
navigate
|
|
497
|
+
</b>
|
|
498
|
+
<a href="#navigate"><span class="icon ion-ios-link"></span></a>
|
|
499
|
+
</span>
|
|
500
|
+
</td>
|
|
501
|
+
</tr>
|
|
502
|
+
<tr>
|
|
503
|
+
<td class="col-md-4">
|
|
504
|
+
<code>navigate(event)</code>
|
|
505
|
+
</td>
|
|
506
|
+
</tr>
|
|
507
|
+
|
|
508
|
+
|
|
509
|
+
<tr>
|
|
510
|
+
<td class="col-md-4">
|
|
511
|
+
<div class="io-line">Defined in <a href="" data-line="96" class="link-to-prism">src/ui-shell/header/header.component.ts:96</a></div>
|
|
512
|
+
</td>
|
|
513
|
+
</tr>
|
|
514
|
+
|
|
515
|
+
|
|
516
|
+
<tr>
|
|
517
|
+
<td class="col-md-4">
|
|
518
|
+
|
|
519
|
+
<div class="io-description">
|
|
520
|
+
<b>Parameters :</b>
|
|
521
|
+
<table class="params">
|
|
522
|
+
<thead>
|
|
523
|
+
<tr>
|
|
524
|
+
<td>Name</td>
|
|
525
|
+
<td>Optional</td>
|
|
526
|
+
</tr>
|
|
527
|
+
</thead>
|
|
528
|
+
<tbody>
|
|
529
|
+
<tr>
|
|
530
|
+
<td>event</td>
|
|
531
|
+
|
|
532
|
+
<td>
|
|
533
|
+
No
|
|
534
|
+
</td>
|
|
535
|
+
|
|
536
|
+
|
|
537
|
+
</tr>
|
|
538
|
+
</tbody>
|
|
539
|
+
</table>
|
|
540
|
+
</div>
|
|
541
|
+
<div>
|
|
542
|
+
</div>
|
|
543
|
+
<div class="io-description">
|
|
544
|
+
<b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
|
|
545
|
+
|
|
546
|
+
</div>
|
|
547
|
+
<div class="io-description">
|
|
548
|
+
|
|
549
|
+
</div>
|
|
550
|
+
</td>
|
|
551
|
+
</tr>
|
|
552
|
+
</tbody>
|
|
553
|
+
</table>
|
|
554
|
+
</section>
|
|
307
555
|
|
|
308
556
|
<section>
|
|
309
557
|
|
|
310
558
|
<h3 id="inputs">
|
|
311
559
|
Properties
|
|
312
560
|
</h3>
|
|
561
|
+
<table class="table table-sm table-bordered">
|
|
562
|
+
<tbody>
|
|
563
|
+
<tr>
|
|
564
|
+
<td class="col-md-4">
|
|
565
|
+
<a name="_href"></a>
|
|
566
|
+
<span class="name">
|
|
567
|
+
<b>
|
|
568
|
+
<span class="modifier">Protected</span>
|
|
569
|
+
_href
|
|
570
|
+
</b>
|
|
571
|
+
<a href="#_href"><span class="icon ion-ios-link"></span></a>
|
|
572
|
+
</span>
|
|
573
|
+
</td>
|
|
574
|
+
</tr>
|
|
575
|
+
<tr>
|
|
576
|
+
<td class="col-md-4">
|
|
577
|
+
<span class="modifier-icon icon ion-ios-reset"></span><code>_href: <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
|
|
578
|
+
</code>
|
|
579
|
+
</td>
|
|
580
|
+
</tr>
|
|
581
|
+
<tr>
|
|
582
|
+
<td class="col-md-4">
|
|
583
|
+
<i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
|
|
584
|
+
|
|
585
|
+
</td>
|
|
586
|
+
</tr>
|
|
587
|
+
<tr>
|
|
588
|
+
<td class="col-md-4">
|
|
589
|
+
<i>Default value : </i><code>"javascript:void(0)"</code>
|
|
590
|
+
</td>
|
|
591
|
+
</tr>
|
|
592
|
+
<tr>
|
|
593
|
+
<td class="col-md-4">
|
|
594
|
+
<div class="io-line">Defined in <a href="" data-line="89" class="link-to-prism">src/ui-shell/header/header.component.ts:89</a></div>
|
|
595
|
+
</td>
|
|
596
|
+
</tr>
|
|
597
|
+
|
|
598
|
+
|
|
599
|
+
</tbody>
|
|
600
|
+
</table>
|
|
313
601
|
<table class="table table-sm table-bordered">
|
|
314
602
|
<tbody>
|
|
315
603
|
<tr>
|
|
@@ -338,7 +626,7 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
338
626
|
</tr>
|
|
339
627
|
<tr>
|
|
340
628
|
<td class="col-md-4">
|
|
341
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
629
|
+
<div class="io-line">Defined in <a href="" data-line="92" class="link-to-prism">src/ui-shell/header/header.component.ts:92</a></div>
|
|
342
630
|
</td>
|
|
343
631
|
</tr>
|
|
344
632
|
|
|
@@ -347,11 +635,95 @@ and global actions (generally in the form of <code>Panel</code>s).</p>
|
|
|
347
635
|
</table>
|
|
348
636
|
</section>
|
|
349
637
|
|
|
638
|
+
<section>
|
|
639
|
+
<h3 id="accessors">
|
|
640
|
+
Accessors
|
|
641
|
+
</h3>
|
|
642
|
+
<table class="table table-sm table-bordered">
|
|
643
|
+
<tbody>
|
|
644
|
+
<tr>
|
|
645
|
+
<td class="col-md-4">
|
|
646
|
+
<a name="href"></a>
|
|
647
|
+
<span class="name"><b>href</b><a href="#href"><span class="icon ion-ios-link"></span></a></span>
|
|
648
|
+
</td>
|
|
649
|
+
</tr>
|
|
650
|
+
|
|
651
|
+
<tr>
|
|
652
|
+
<td class="col-md-4">
|
|
653
|
+
<span class="accessor"><b>get</b><code>href()</code></span>
|
|
654
|
+
</td>
|
|
655
|
+
</tr>
|
|
656
|
+
<tr>
|
|
657
|
+
<td class="col-md-4">
|
|
658
|
+
<div class="io-line">Defined in <a href="" data-line="68" class="link-to-prism">src/ui-shell/header/header.component.ts:68</a></div>
|
|
659
|
+
</td>
|
|
660
|
+
</tr>
|
|
661
|
+
|
|
662
|
+
<tr>
|
|
663
|
+
<td class="col-md-4">
|
|
664
|
+
<span class="accessor"><b>set</b><code>href(v: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code></span>
|
|
665
|
+
</td>
|
|
666
|
+
</tr>
|
|
667
|
+
<tr>
|
|
668
|
+
<td class="col-md-4">
|
|
669
|
+
<div class="io-line">Defined in <a href="" data-line="64" class="link-to-prism">src/ui-shell/header/header.component.ts:64</a></div>
|
|
670
|
+
</td>
|
|
671
|
+
</tr>
|
|
672
|
+
<tr>
|
|
673
|
+
<td class="col-md-4">
|
|
674
|
+
<div class="io-description"><p>Optional link for the header</p>
|
|
675
|
+
</div>
|
|
676
|
+
|
|
677
|
+
<div class="io-description">
|
|
678
|
+
<b>Parameters :</b>
|
|
679
|
+
<table class="params">
|
|
680
|
+
<thead>
|
|
681
|
+
<tr>
|
|
682
|
+
<td>Name</td>
|
|
683
|
+
<td>Type</td>
|
|
684
|
+
<td>Optional</td>
|
|
685
|
+
</tr>
|
|
686
|
+
</thead>
|
|
687
|
+
<tbody>
|
|
688
|
+
<tr>
|
|
689
|
+
<td>v</td>
|
|
690
|
+
|
|
691
|
+
<td>
|
|
692
|
+
<code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
|
|
693
|
+
</td>
|
|
694
|
+
|
|
695
|
+
<td>
|
|
696
|
+
No
|
|
697
|
+
</td>
|
|
698
|
+
|
|
699
|
+
</tr>
|
|
700
|
+
</tbody>
|
|
701
|
+
</table>
|
|
702
|
+
</div>
|
|
703
|
+
<div>
|
|
704
|
+
</div>
|
|
705
|
+
<div class="io-description">
|
|
706
|
+
<b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
|
|
707
|
+
|
|
708
|
+
</div>
|
|
709
|
+
</td>
|
|
710
|
+
</tr>
|
|
711
|
+
</tbody>
|
|
712
|
+
</table>
|
|
713
|
+
</section>
|
|
350
714
|
</div>
|
|
351
715
|
|
|
352
716
|
|
|
353
717
|
<div class="tab-pane fade tab-source-code" id="c-source">
|
|
354
|
-
<pre class="line-numbers compodoc-sourcecode"><code class="language-typescript">import {
|
|
718
|
+
<pre class="line-numbers compodoc-sourcecode"><code class="language-typescript">import {
|
|
719
|
+
Component,
|
|
720
|
+
Input,
|
|
721
|
+
Optional,
|
|
722
|
+
Output,
|
|
723
|
+
EventEmitter
|
|
724
|
+
} from "@angular/core";
|
|
725
|
+
import { DomSanitizer } from "@angular/platform-browser";
|
|
726
|
+
import { Router } from "@angular/router";
|
|
355
727
|
import { I18n } from "../../i18n/i18n.module";
|
|
356
728
|
|
|
357
729
|
/**
|
|
@@ -371,13 +743,17 @@ import { I18n } from "../../i18n/i18n.module";
|
|
|
371
743
|
role="banner"
|
|
372
744
|
[attr.aria-label]="brand + ' ' + name">
|
|
373
745
|
<a
|
|
746
|
+
*ngIf="!skipTo"
|
|
374
747
|
class="bx--skip-to-content"
|
|
375
748
|
[href]="skipTo"
|
|
376
749
|
tabindex="0">
|
|
377
750
|
{{ i18n.get("UI_SHELL.SKIP_TO") | async }}
|
|
378
751
|
</a>
|
|
379
752
|
<ng-content select="ibm-hamburger"></ng-content>
|
|
380
|
-
<a
|
|
753
|
+
<a
|
|
754
|
+
class="bx--header__name"
|
|
755
|
+
href="#"
|
|
756
|
+
(click)="navigate($event)">
|
|
381
757
|
<span class="bx--header__name--prefix">{{brand}}&nbsp;</span>
|
|
382
758
|
{{name}}
|
|
383
759
|
</a>
|
|
@@ -399,7 +775,48 @@ export class Header {
|
|
|
399
775
|
*/
|
|
400
776
|
@Input() brand = "IBM";
|
|
401
777
|
|
|
402
|
-
|
|
778
|
+
/**
|
|
779
|
+
* Optional link for the header
|
|
780
|
+
*/
|
|
781
|
+
@Input() set href(v: string) {
|
|
782
|
+
this._href = v;
|
|
783
|
+
}
|
|
784
|
+
|
|
785
|
+
get href() {
|
|
786
|
+
return this.domSanitizer.bypassSecurityTrustUrl(this._href) as string;
|
|
787
|
+
}
|
|
788
|
+
|
|
789
|
+
/**
|
|
790
|
+
* Array of commands to send to the router when the link is activated
|
|
791
|
+
* See: https://angular.io/api/router/Router#navigate
|
|
792
|
+
*/
|
|
793
|
+
@Input() route: any[];
|
|
794
|
+
|
|
795
|
+
/**
|
|
796
|
+
* Router options. Used in conjunction with `route`
|
|
797
|
+
* See: https://angular.io/api/router/Router#navigate
|
|
798
|
+
*/
|
|
799
|
+
@Input() routeExtras: any;
|
|
800
|
+
|
|
801
|
+
/**
|
|
802
|
+
* Emits the navigation status promise when the link is activated
|
|
803
|
+
*/
|
|
804
|
+
@Output() navigation = new EventEmitter<Promise<boolean>>();
|
|
805
|
+
|
|
806
|
+
protected _href = "javascript:void(0)";
|
|
807
|
+
|
|
808
|
+
constructor(
|
|
809
|
+
public i18n: I18n,
|
|
810
|
+
protected domSanitizer: DomSanitizer,
|
|
811
|
+
@Optional() protected router: Router) { }
|
|
812
|
+
|
|
813
|
+
navigate(event) {
|
|
814
|
+
if (this.router && this.route) {
|
|
815
|
+
event.preventDefault();
|
|
816
|
+
const status = this.router.navigate(this.route, this.routeExtras);
|
|
817
|
+
this.navigation.emit(status);
|
|
818
|
+
}
|
|
819
|
+
}
|
|
403
820
|
}
|
|
404
821
|
</code></pre>
|
|
405
822
|
</div>
|
|
@@ -436,7 +853,7 @@ export class Header {
|
|
|
436
853
|
<script src="../js/libs/htmlparser.js"></script>
|
|
437
854
|
<script src="../js/libs/deep-iterator.js"></script>
|
|
438
855
|
<script>
|
|
439
|
-
var COMPONENT_TEMPLATE = '<div><header class="bx--header" role="banner" [attr.aria-label]="brand + \' \' + name"> <a class="bx--skip-to-content" [href]="skipTo" tabindex="0"> {{ i18n.get("UI_SHELL.SKIP_TO") | async }} </a> <ng-content select="ibm-hamburger"></ng-content> <a
|
|
856
|
+
var COMPONENT_TEMPLATE = '<div><header class="bx--header" role="banner" [attr.aria-label]="brand + \' \' + name"> <a *ngIf="!skipTo" class="bx--skip-to-content" [href]="skipTo" tabindex="0"> {{ i18n.get("UI_SHELL.SKIP_TO") | async }} </a> <ng-content select="ibm-hamburger"></ng-content> <a class="bx--header__name" href="#" (click)="navigate($event)"> <span class="bx--header__name--prefix">{{brand}} </span> {{name}} </a> <ng-content></ng-content></header> </div>'
|
|
440
857
|
var COMPONENTS = [{'name': 'Accordion', 'selector': 'ibm-accordion'},{'name': 'AccordionItem', 'selector': 'ibm-accordion-item'},{'name': 'AlertModal', 'selector': 'ibm-alert-modal'},{'name': 'Breadcrumb', 'selector': 'ibm-breadcrumb'},{'name': 'BreadcrumbItemComponent', 'selector': 'ibm-breadcrumb-item'},{'name': 'Checkbox', 'selector': 'ibm-checkbox'},{'name': 'ClickableTile', 'selector': 'ibm-clickable-tile'},{'name': 'CodeSnippet', 'selector': 'ibm-code-snippet'},{'name': 'ComboBox', 'selector': 'ibm-combo-box'},{'name': 'ContentSwitcher', 'selector': 'ibm-content-switcher'},{'name': 'DatePicker', 'selector': 'ibm-date-picker'},{'name': 'DatePickerInput', 'selector': 'ibm-date-picker-input'},{'name': 'Dialog', 'selector': 'ibm-dialog'},{'name': 'DialogPlaceholder', 'selector': 'ibm-dialog-placeholder'},{'name': 'Documentation', 'selector': 'ibm-documentation'},{'name': 'Dropdown', 'selector': 'ibm-dropdown'},{'name': 'DropdownList', 'selector': 'ibm-dropdown-list'},{'name': 'ExpandableTile', 'selector': 'ibm-expandable-tile'},{'name': 'File', 'selector': 'ibm-file'},{'name': 'FileUploader', 'selector': 'ibm-file-uploader'},{'name': 'Hamburger', 'selector': 'ibm-hamburger'},{'name': 'Header', 'selector': 'ibm-header'},{'name': 'HeaderAction', 'selector': 'ibm-header-action'},{'name': 'HeaderGlobal', 'selector': 'ibm-header-global'},{'name': 'HeaderItem', 'selector': 'ibm-header-item'},{'name': 'HeaderMenu', 'selector': 'ibm-header-menu'},{'name': 'HeaderNavigation', 'selector': 'ibm-header-navigation'},{'name': 'InlineLoading', 'selector': 'ibm-inline-loading'},{'name': 'Label', 'selector': 'ibm-label'},{'name': 'ListColumn', 'selector': 'ibm-list-column'},{'name': 'ListHeader', 'selector': 'ibm-list-header'},{'name': 'ListRow', 'selector': 'ibm-list-row'},{'name': 'Loading', 'selector': 'ibm-loading'},{'name': 'Modal', 'selector': 'ibm-modal'},{'name': 'ModalFooter', 'selector': 'ibm-modal-footer'},{'name': 'ModalHeader', 'selector': 'ibm-modal-header'},{'name': 'ModalPlaceholder', 'selector': 'ibm-modal-placeholder'},{'name': 'Notification', 'selector': 'ibm-notification'},{'name': 'NumberComponent', 'selector': 'ibm-number'},{'name': 'OverflowMenu', 'selector': 'ibm-overflow-menu'},{'name': 'OverflowMenuOption', 'selector': 'ibm-overflow-menu-option'},{'name': 'OverflowMenuPane', 'selector': 'ibm-overflow-menu-pane'},{'name': 'Overlay', 'selector': 'ibm-overlay'},{'name': 'Pagination', 'selector': 'ibm-pagination'},{'name': 'Panel', 'selector': 'ibm-panel'},{'name': 'Placeholder', 'selector': 'ibm-placeholder'},{'name': 'ProductSwitcher', 'selector': 'ibm-product-switcher'},{'name': 'ProgressIndicator', 'selector': 'ibm-progress-indicator'},{'name': 'Radio', 'selector': 'ibm-radio'},{'name': 'RadioGroup', 'selector': 'ibm-radio-group'},{'name': 'Sample', 'selector': 'ibm-sample'},{'name': 'SampleSub', 'selector': 'ibm-sample-sub'},{'name': 'Search', 'selector': 'ibm-search'},{'name': 'Select', 'selector': 'ibm-select'},{'name': 'SelectionTile', 'selector': 'ibm-selection-tile'},{'name': 'SideNav', 'selector': 'ibm-sidenav'},{'name': 'SideNavHeader', 'selector': 'ibm-sidenav-header'},{'name': 'SideNavItem', 'selector': 'ibm-sidenav-item'},{'name': 'SideNavMenu', 'selector': 'ibm-sidenav-menu'},{'name': 'Slider', 'selector': 'ibm-slider'},{'name': 'StructuredList', 'selector': 'ibm-structured-list'},{'name': 'SwitcherList', 'selector': 'ibm-switcher-list, ibm-product-switcher-list'},{'name': 'SwitcherListItem', 'selector': 'ibm-switcher-list-item, ibm-product-switcher-list-item, ibm-product-switcher-item'},{'name': 'Tab', 'selector': 'ibm-tab'},{'name': 'TabHeaders', 'selector': 'ibm-tab-headers'},{'name': 'Table', 'selector': 'ibm-table'},{'name': 'TableBody', 'selector': '[ibmTableBody]'},{'name': 'TableCheckbox', 'selector': '[ibmTableCheckbox]'},{'name': 'TableContainer', 'selector': 'ibm-table-container'},{'name': 'TableData', 'selector': '[ibmTableData]'},{'name': 'TableExpandButton', 'selector': '[ibmTableExpandButton]'},{'name': 'TableExpandedRow', 'selector': '[ibmTableExpandedRow]'},{'name': 'TableHead', 'selector': '[ibmTableHead]'},{'name': 'TableHeadCell', 'selector': '[ibmTableHeadCell]'},{'name': 'TableHeadCheckbox', 'selector': '[ibmTableHeadCheckbox]'},{'name': 'TableHeader', 'selector': 'ibm-table-header'},{'name': 'TableHeadExpand', 'selector': '[ibmTableHeadExpand]'},{'name': 'TableRowComponent', 'selector': '[ibmTableRow]'},{'name': 'TableToolbar', 'selector': 'ibm-table-toolbar'},{'name': 'TableToolbarActions', 'selector': 'ibm-table-toolbar-actions'},{'name': 'TableToolbarContent', 'selector': 'ibm-table-toolbar-content'},{'name': 'TableToolbarSearch', 'selector': 'ibm-table-toolbar-search'},{'name': 'Tabs', 'selector': 'ibm-tabs'},{'name': 'Tag', 'selector': 'ibm-tag'},{'name': 'TagFilter', 'selector': 'ibm-tag-filter'},{'name': 'Tile', 'selector': 'ibm-tile'},{'name': 'TileGroup', 'selector': 'ibm-tile-group'},{'name': 'TimePicker', 'selector': 'ibm-timepicker'},{'name': 'TimePickerSelect', 'selector': 'ibm-timepicker-select'},{'name': 'Toast', 'selector': 'ibm-toast'},{'name': 'Toggle', 'selector': 'ibm-toggle'},{'name': 'Tooltip', 'selector': 'ibm-tooltip'},{'name': 'TooltipDefinition', 'selector': 'ibm-tooltip-definition'},{'name': 'TooltipIcon', 'selector': 'ibm-tooltip-icon'}];
|
|
441
858
|
var DIRECTIVES = [{'name': 'Button', 'selector': '[ibmButton]'},{'name': 'ColumnDirective', 'selector': '[ibmCol]'},{'name': 'ContentSwitcherOption', 'selector': '[ibmContentOption]'},{'name': 'DataGridFocus', 'selector': '[ibmDataGridFocus]'},{'name': 'DialogDirective', 'selector': '[ibmDialog]'},{'name': 'EllipsisTooltip', 'selector': '[ibmEllipsisTooltip]'},{'name': 'ExpandedRowHover', 'selector': '[ibmExpandedRowHover]'},{'name': 'GridDirective', 'selector': '[ibmGrid]'},{'name': 'Link', 'selector': '[ibmLink]'},{'name': 'List', 'selector': '[ibmList]'},{'name': 'ListItemDirective', 'selector': '[ibmListItem]'},{'name': 'OptGroup', 'selector': 'optgroup'},{'name': 'Option', 'selector': 'option'},{'name': 'OverflowMenuDirective', 'selector': '[ibmOverflowMenu]'},{'name': 'RowDirective', 'selector': '[ibmRow]'},{'name': 'ScrollableList', 'selector': '[ibmScrollableList]'},{'name': 'TableDirective', 'selector': '[ibmTable]'},{'name': 'TableHeaderDescription', 'selector': '[ibmTableHeaderDescription]'},{'name': 'TableHeaderTitle', 'selector': '[ibmTableHeaderTitle]'},{'name': 'TextArea', 'selector': '[ibmTextArea]'},{'name': 'TextInput', 'selector': '[ibmText]'},{'name': 'TooltipDirective', 'selector': '[ibmTooltip]'}];
|
|
442
859
|
var ACTUAL_COMPONENT = {'name': 'Header'};
|