carbon-components-angular 3.13.1 → 3.13.2

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 (37) hide show
  1. package/bundle/carbon-angular.umd.js +5 -5
  2. package/bundle/carbon-angular.umd.js.map +1 -1
  3. package/dialog/dialog.module.ngfactory.js.map +1 -1
  4. package/dialog/tooltip/tooltip.component.js +14 -1
  5. package/dialog/tooltip/tooltip.component.js.map +1 -1
  6. package/dialog/tooltip/tooltip.component.metadata.json +1 -1
  7. package/dialog/tooltip/tooltip.component.ngfactory.js +1 -1
  8. package/dialog/tooltip/tooltip.component.ngfactory.js.map +1 -1
  9. package/docs/documentation/components/TabHeaders.html +131 -23
  10. package/docs/documentation/components/Tabs.html +76 -12
  11. package/docs/documentation/components/Tooltip.html +22 -6
  12. package/docs/documentation/coverage.html +4 -4
  13. package/docs/documentation/js/search/search_index.js +2 -2
  14. package/docs/storybook/iframe.html +3 -3
  15. package/docs/storybook/{main.af986e1c1a23f0d31b49.bundle.js → main.a309b5fd3379fd894c7e.bundle.js} +45 -4
  16. package/docs/storybook/main.a309b5fd3379fd894c7e.bundle.js.map +1 -0
  17. package/docs/storybook/{runtime~main.af986e1c1a23f0d31b49.bundle.js → runtime~main.a309b5fd3379fd894c7e.bundle.js} +1 -1
  18. package/docs/storybook/{runtime~main.af986e1c1a23f0d31b49.bundle.js.map → runtime~main.a309b5fd3379fd894c7e.bundle.js.map} +1 -1
  19. package/docs/storybook/{vendors~main.af986e1c1a23f0d31b49.bundle.js → vendors~main.a309b5fd3379fd894c7e.bundle.js} +1 -1
  20. package/docs/storybook/{vendors~main.af986e1c1a23f0d31b49.bundle.js.map → vendors~main.a309b5fd3379fd894c7e.bundle.js.map} +1 -1
  21. package/package.json +1 -1
  22. package/tabs/tab-headers.component.d.ts +9 -0
  23. package/tabs/tab-headers.component.js +10 -2
  24. package/tabs/tab-headers.component.js.map +1 -1
  25. package/tabs/tab-headers.component.metadata.json +1 -1
  26. package/tabs/tab-headers.component.ngfactory.js +7 -4
  27. package/tabs/tab-headers.component.ngfactory.js.map +1 -1
  28. package/tabs/tab-headers.component.ngsummary.json +1 -1
  29. package/tabs/tabs.component.d.ts +8 -0
  30. package/tabs/tabs.component.js +3 -1
  31. package/tabs/tabs.component.js.map +1 -1
  32. package/tabs/tabs.component.metadata.json +1 -1
  33. package/tabs/tabs.component.ngfactory.js +10 -4
  34. package/tabs/tabs.component.ngfactory.js.map +1 -1
  35. package/tabs/tabs.component.ngsummary.json +1 -1
  36. package/tabs/tabs.module.ngfactory.js.map +1 -1
  37. package/docs/storybook/main.af986e1c1a23f0d31b49.bundle.js.map +0 -1
package/docs/documentation/components/Tabs.html CHANGED
@@ -130,7 +130,9 @@ This is the parent of the <code>Tab</code> and <code>TabHeader</code> components
130
130
  [followFocus]&#x3D;&quot;followFocus&quot;
131
131
  [cacheActive]&#x3D;&quot;cacheActive&quot;
132
132
  [contentBefore]&#x3D;&quot;before&quot;
133
- [contentAfter]&#x3D;&quot;after&quot;&gt;
133
+ [contentAfter]&#x3D;&quot;after&quot;
134
+ [ariaLabel]&#x3D;&quot;ariaLabel&quot;
135
+ [ariaLabelledby]&#x3D;&quot;ariaLabelledby&quot;&gt;
134
136
  &lt;/ibm-tab-headers&gt;
135
137
  &lt;ng-content&gt;&lt;/ng-content&gt;
136
138
  &lt;ng-template #before&gt;
@@ -208,6 +210,12 @@ This is the parent of the <code>Tab</code> and <code>TabHeader</code> components
208
210
  <tr>
209
211
  <td class="col-md-4">
210
212
  <ul class="index-list">
213
+ <li>
214
+ <a href="#ariaLabel">ariaLabel</a>
215
+ </li>
216
+ <li>
217
+ <a href="#ariaLabelledby">ariaLabelledby</a>
218
+ </li>
211
219
  <li>
212
220
  <a href="#cacheActive">cacheActive</a>
213
221
  </li>
@@ -237,6 +245,52 @@ This is the parent of the <code>Tab</code> and <code>TabHeader</code> components
237
245
 
238
246
  <section>
239
247
  <h3 id="inputs">Inputs</h3>
248
+ <table class="table table-sm table-bordered">
249
+ <tbody>
250
+ <tr>
251
+ <td class="col-md-2">
252
+ <a name="ariaLabel"></a>
253
+ <code>ariaLabel</code>
254
+ </td>
255
+ <td class="col-md-10">
256
+ <div><p>Sets the aria label on the <code>TabHeader</code>s nav element.</p>
257
+ </div>
258
+ <p>
259
+ <em>Type :</em> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
260
+
261
+ </p>
262
+ </td>
263
+ </tr>
264
+ <tr>
265
+ <td class="col-md-2" colspan="2">
266
+ <div class="io-line">Defined in <a href="" data-line="97" class="link-to-prism">src/tabs/tabs.component.ts:97</a></div>
267
+ </td>
268
+ </tr>
269
+ </tbody>
270
+ </table>
271
+ <table class="table table-sm table-bordered">
272
+ <tbody>
273
+ <tr>
274
+ <td class="col-md-2">
275
+ <a name="ariaLabelledby"></a>
276
+ <code>ariaLabelledby</code>
277
+ </td>
278
+ <td class="col-md-10">
279
+ <div><p>Sets the aria labelledby on the <code>TabHeader</code>s nav element.</p>
280
+ </div>
281
+ <p>
282
+ <em>Type :</em> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
283
+
284
+ </p>
285
+ </td>
286
+ </tr>
287
+ <tr>
288
+ <td class="col-md-2" colspan="2">
289
+ <div class="io-line">Defined in <a href="" data-line="101" class="link-to-prism">src/tabs/tabs.component.ts:101</a></div>
290
+ </td>
291
+ </tr>
292
+ </tbody>
293
+ </table>
240
294
  <table class="table table-sm table-bordered">
241
295
  <tbody>
242
296
  <tr>
@@ -254,7 +308,7 @@ This is the parent of the <code>Tab</code> and <code>TabHeader</code> components
254
308
  </tr>
255
309
  <tr>
256
310
  <td class="col-md-2" colspan="2">
257
- <div class="io-line">Defined in <a href="" data-line="79" class="link-to-prism">src/tabs/tabs.component.ts:79</a></div>
311
+ <div class="io-line">Defined in <a href="" data-line="81" class="link-to-prism">src/tabs/tabs.component.ts:81</a></div>
258
312
  </td>
259
313
  </tr>
260
314
  </tbody>
@@ -276,7 +330,7 @@ This is the parent of the <code>Tab</code> and <code>TabHeader</code> components
276
330
  </tr>
277
331
  <tr>
278
332
  <td class="col-md-2" colspan="2">
279
- <div class="io-line">Defined in <a href="" data-line="83" class="link-to-prism">src/tabs/tabs.component.ts:83</a></div>
333
+ <div class="io-line">Defined in <a href="" data-line="85" class="link-to-prism">src/tabs/tabs.component.ts:85</a></div>
280
334
  </td>
281
335
  </tr>
282
336
  </tbody>
@@ -298,7 +352,7 @@ This is the parent of the <code>Tab</code> and <code>TabHeader</code> components
298
352
  </tr>
299
353
  <tr>
300
354
  <td class="col-md-2" colspan="2">
301
- <div class="io-line">Defined in <a href="" data-line="91" class="link-to-prism">src/tabs/tabs.component.ts:91</a></div>
355
+ <div class="io-line">Defined in <a href="" data-line="93" class="link-to-prism">src/tabs/tabs.component.ts:93</a></div>
302
356
  </td>
303
357
  </tr>
304
358
  </tbody>
@@ -325,7 +379,7 @@ relative to the <code>TabPanel</code>s.</p>
325
379
  </tr>
326
380
  <tr>
327
381
  <td class="col-md-2" colspan="2">
328
- <div class="io-line">Defined in <a href="" data-line="75" class="link-to-prism">src/tabs/tabs.component.ts:75</a></div>
382
+ <div class="io-line">Defined in <a href="" data-line="77" class="link-to-prism">src/tabs/tabs.component.ts:77</a></div>
329
383
  </td>
330
384
  </tr>
331
385
  </tbody>
@@ -347,7 +401,7 @@ relative to the <code>TabPanel</code>s.</p>
347
401
  </tr>
348
402
  <tr>
349
403
  <td class="col-md-2" colspan="2">
350
- <div class="io-line">Defined in <a href="" data-line="87" class="link-to-prism">src/tabs/tabs.component.ts:87</a></div>
404
+ <div class="io-line">Defined in <a href="" data-line="89" class="link-to-prism">src/tabs/tabs.component.ts:89</a></div>
351
405
  </td>
352
406
  </tr>
353
407
  </tbody>
@@ -383,7 +437,7 @@ relative to the <code>TabPanel</code>s.</p>
383
437
 
384
438
  <tr>
385
439
  <td class="col-md-4">
386
- <div class="io-line">Defined in <a href="" data-line="119" class="link-to-prism">src/tabs/tabs.component.ts:119</a></div>
440
+ <div class="io-line">Defined in <a href="" data-line="129" class="link-to-prism">src/tabs/tabs.component.ts:129</a></div>
387
441
  </td>
388
442
  </tr>
389
443
 
@@ -423,7 +477,7 @@ relative to the <code>TabPanel</code>s.</p>
423
477
 
424
478
  <tr>
425
479
  <td class="col-md-4">
426
- <div class="io-line">Defined in <a href="" data-line="106" class="link-to-prism">src/tabs/tabs.component.ts:106</a></div>
480
+ <div class="io-line">Defined in <a href="" data-line="116" class="link-to-prism">src/tabs/tabs.component.ts:116</a></div>
427
481
  </td>
428
482
  </tr>
429
483
 
@@ -479,7 +533,7 @@ selected Tab item.</p>
479
533
  </tr>
480
534
  <tr>
481
535
  <td class="col-md-4">
482
- <div class="io-line">Defined in <a href="" data-line="100" class="link-to-prism">src/tabs/tabs.component.ts:100</a></div>
536
+ <div class="io-line">Defined in <a href="" data-line="110" class="link-to-prism">src/tabs/tabs.component.ts:110</a></div>
483
537
  </td>
484
538
  </tr>
485
539
 
@@ -528,7 +582,7 @@ selected Tab item.</p>
528
582
  </tr>
529
583
  <tr>
530
584
  <td class="col-md-4">
531
- <div class="io-line">Defined in <a href="" data-line="96" class="link-to-prism">src/tabs/tabs.component.ts:96</a></div>
585
+ <div class="io-line">Defined in <a href="" data-line="106" class="link-to-prism">src/tabs/tabs.component.ts:106</a></div>
532
586
  </td>
533
587
  </tr>
534
588
 
@@ -599,7 +653,9 @@ import { TabHeaders } from &quot;./tab-headers.component&quot;;
599
653
  [followFocus]&#x3D;&quot;followFocus&quot;
600
654
  [cacheActive]&#x3D;&quot;cacheActive&quot;
601
655
  [contentBefore]&#x3D;&quot;before&quot;
602
- [contentAfter]&#x3D;&quot;after&quot;&gt;
656
+ [contentAfter]&#x3D;&quot;after&quot;
657
+ [ariaLabel]&#x3D;&quot;ariaLabel&quot;
658
+ [ariaLabelledby]&#x3D;&quot;ariaLabelledby&quot;&gt;
603
659
  &lt;/ibm-tab-headers&gt;
604
660
  &lt;ng-content&gt;&lt;/ng-content&gt;
605
661
  &lt;ng-template #before&gt;
@@ -638,6 +694,14 @@ export class Tabs implements AfterContentInit {
638
694
  * Set to &#x60;true&#x60; to have the tabIndex of the all tabpanels be -1.
639
695
  */
640
696
  @Input() isNavigation &#x3D; false;
697
+ /**
698
+ * Sets the aria label on the &#x60;TabHeader&#x60;s nav element.
699
+ */
700
+ @Input() ariaLabel: string;
701
+ /**
702
+ * Sets the aria labelledby on the &#x60;TabHeader&#x60;s nav element.
703
+ */
704
+ @Input() ariaLabelledby: string;
641
705
 
642
706
  /**
643
707
  * Maintains a &#x60;QueryList&#x60; of the &#x60;Tab&#x60; elements and updates if &#x60;Tab&#x60;s are added or removed.
@@ -704,7 +768,7 @@ export class Tabs implements AfterContentInit {
704
768
  <script src="../js/libs/htmlparser.js"></script>
705
769
  <script src="../js/libs/deep-iterator.js"></script>
706
770
  <script>
707
- var COMPONENT_TEMPLATE = '<div><ibm-tab-headers *ngIf="hasTabHeaders() && position === \'top\'" [skeleton]="skeleton" [tabs]="tabs" [followFocus]="followFocus" [cacheActive]="cacheActive" [contentBefore]="before" [contentAfter]="after"></ibm-tab-headers><ng-content></ng-content><ng-template #before> <ng-content select="[before]"></ng-content></ng-template><ng-template #after> <ng-content select="[after]"></ng-content></ng-template><ibm-tab-headers *ngIf="hasTabHeaders() && position === \'bottom\'" [skeleton]="skeleton" [tabs]="tabs" [cacheActive]="cacheActive"></ibm-tab-headers> </div>'
771
+ var COMPONENT_TEMPLATE = '<div><ibm-tab-headers *ngIf="hasTabHeaders() && position === \'top\'" [skeleton]="skeleton" [tabs]="tabs" [followFocus]="followFocus" [cacheActive]="cacheActive" [contentBefore]="before" [contentAfter]="after" [ariaLabel]="ariaLabel" [ariaLabelledby]="ariaLabelledby"></ibm-tab-headers><ng-content></ng-content><ng-template #before> <ng-content select="[before]"></ng-content></ng-template><ng-template #after> <ng-content select="[after]"></ng-content></ng-template><ibm-tab-headers *ngIf="hasTabHeaders() && position === \'bottom\'" [skeleton]="skeleton" [tabs]="tabs" [cacheActive]="cacheActive"></ibm-tab-headers> </div>'
708
772
  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': 'Number', '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': 'ProductSwitcherItem', 'selector': 'ibm-product-switcher-item'},{'name': 'ProductSwitcherList', 'selector': 'ibm-product-switcher-list'},{'name': 'ProductSwitcherListItem', 'selector': 'ibm-product-switcher-list-item'},{'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': 'Tab', 'selector': 'ibm-tab'},{'name': 'TabHeaders', 'selector': 'ibm-tab-headers'},{'name': 'Table', 'selector': 'ibm-table'},{'name': 'TableContainer', 'selector': 'ibm-table-container'},{'name': 'TableHeader', 'selector': 'ibm-table-header'},{'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'}];
709
773
  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': 'TableHeaderDescription', 'selector': '[ibmTableHeaderDescription]'},{'name': 'TableHeaderTitle', 'selector': '[ibmTableHeaderTitle]'},{'name': 'TextArea', 'selector': '[ibmTextArea]'},{'name': 'TextInput', 'selector': '[ibmText]'},{'name': 'TooltipDirective', 'selector': '[ibmTooltip]'}];
710
774
  var ACTUAL_COMPONENT = {'name': 'Tabs'};
package/docs/documentation/components/Tooltip.html CHANGED
@@ -103,6 +103,7 @@
103
103
  #dialog
104
104
  [id]&#x3D;&quot;dialogConfig.compID&quot;
105
105
  [attr.role]&#x3D;&quot;role&quot;
106
+ [attr.data-floating-menu-direction]&#x3D;&quot;placement&quot;
106
107
  class&#x3D;&quot;bx--tooltip bx--tooltip--shown&quot;&gt;
107
108
  &lt;span class&#x3D;&quot;bx--tooltip__caret&quot; aria-hidden&#x3D;&quot;true&quot;&gt;&lt;/span&gt;
108
109
  &lt;ng-template
@@ -384,7 +385,7 @@ explicitly defined.</p>
384
385
  </tr>
385
386
  <tr>
386
387
  <td class="col-md-4">
387
- <div class="io-line">Defined in <a href="" data-line="36" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:36</a></div>
388
+ <div class="io-line">Defined in <a href="" data-line="38" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:38</a></div>
388
389
  </td>
389
390
  </tr>
390
391
 
@@ -518,7 +519,7 @@ explicitly defined.</p>
518
519
 
519
520
  <tr>
520
521
  <td class="col-md-4">
521
- <div class="io-line">Defined in <a href="" data-line="53" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:53</a></div>
522
+ <div class="io-line">Defined in <a href="" data-line="68" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:68</a></div>
522
523
  </td>
523
524
  </tr>
524
525
 
@@ -556,7 +557,7 @@ explicitly defined.</p>
556
557
 
557
558
  <tr>
558
559
  <td class="col-md-4">
559
- <div class="io-line">Defined in <a href="" data-line="49" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:49</a></div>
560
+ <div class="io-line">Defined in <a href="" data-line="51" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:51</a></div>
560
561
  </td>
561
562
  </tr>
562
563
 
@@ -934,7 +935,7 @@ in respect to the parent element.</p>
934
935
  </tr>
935
936
  <tr>
936
937
  <td class="col-md-4">
937
- <div class="io-line">Defined in <a href="" data-line="40" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:40</a></div>
938
+ <div class="io-line">Defined in <a href="" data-line="42" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:42</a></div>
938
939
  </td>
939
940
  </tr>
940
941
 
@@ -980,7 +981,7 @@ in respect to the parent element.</p>
980
981
  </tr>
981
982
  <tr>
982
983
  <td class="col-md-4">
983
- <div class="io-line">Defined in <a href="" data-line="45" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:45</a></div>
984
+ <div class="io-line">Defined in <a href="" data-line="47" class="link-to-prism">src/dialog/tooltip/tooltip.component.ts:47</a></div>
984
985
  </td>
985
986
  </tr>
986
987
 
@@ -1427,6 +1428,7 @@ to not obscure the content beneath.</p>
1427
1428
  import { getFocusElementList } from &quot;./../../common/tab.service&quot;;
1428
1429
 
1429
1430
  import { Dialog } from &quot;./../dialog.component&quot;;
1431
+ import { position } from &quot;@carbon/utils-position&quot;;
1430
1432
 
1431
1433
  /**
1432
1434
  * Extend the &#x60;Dialog&#x60; component to create a tooltip for exposing content.
@@ -1438,6 +1440,7 @@ import { Dialog } from &quot;./../dialog.component&quot;;
1438
1440
  #dialog
1439
1441
  [id]&#x3D;&quot;dialogConfig.compID&quot;
1440
1442
  [attr.role]&#x3D;&quot;role&quot;
1443
+ [attr.data-floating-menu-direction]&#x3D;&quot;placement&quot;
1441
1444
  class&#x3D;&quot;bx--tooltip bx--tooltip--shown&quot;&gt;
1442
1445
  &lt;span class&#x3D;&quot;bx--tooltip__caret&quot; aria-hidden&#x3D;&quot;true&quot;&gt;&lt;/span&gt;
1443
1446
  &lt;ng-template
@@ -1467,6 +1470,19 @@ export class Tooltip extends Dialog {
1467
1470
  * Check whether there is a template for the &#x60;Tooltip&#x60; content.
1468
1471
  */
1469
1472
  onDialogInit() {
1473
+ this.addGap[&quot;bottom&quot;] &#x3D; pos &#x3D;&gt; {
1474
+ return position.addOffset(pos, 3, 0);
1475
+ };
1476
+ this.addGap[&quot;top&quot;] &#x3D; pos &#x3D;&gt; {
1477
+ return position.addOffset(pos, -10, 0);
1478
+ };
1479
+ this.addGap[&quot;left&quot;] &#x3D; pos &#x3D;&gt; {
1480
+ return position.addOffset(pos, -3, -6);
1481
+ };
1482
+ this.addGap[&quot;right&quot;] &#x3D; pos &#x3D;&gt; {
1483
+ return position.addOffset(pos, -3, 6);
1484
+ };
1485
+
1470
1486
  this.hasContentTemplate &#x3D; this.dialogConfig.content instanceof TemplateRef;
1471
1487
  }
1472
1488
 
@@ -1508,7 +1524,7 @@ export class Tooltip extends Dialog {
1508
1524
  <script src="../js/libs/htmlparser.js"></script>
1509
1525
  <script src="../js/libs/deep-iterator.js"></script>
1510
1526
  <script>
1511
- var COMPONENT_TEMPLATE = '<div><div #dialog [id]="dialogConfig.compID" [attr.role]="role" class="bx--tooltip bx--tooltip--shown"> <span class="bx--tooltip__caret" aria-hidden="true"></span> <ng-template *ngIf="hasContentTemplate" [ngTemplateOutlet]="dialogConfig.content" [ngTemplateOutletContext]="{tooltip: this}"> </ng-template> <p *ngIf="!hasContentTemplate"> {{dialogConfig.content}} </p></div></div>'
1527
+ var COMPONENT_TEMPLATE = '<div><div #dialog [id]="dialogConfig.compID" [attr.role]="role" [attr.data-floating-menu-direction]="placement" class="bx--tooltip bx--tooltip--shown"> <span class="bx--tooltip__caret" aria-hidden="true"></span> <ng-template *ngIf="hasContentTemplate" [ngTemplateOutlet]="dialogConfig.content" [ngTemplateOutletContext]="{tooltip: this}"> </ng-template> <p *ngIf="!hasContentTemplate"> {{dialogConfig.content}} </p></div></div>'
1512
1528
  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': 'Number', '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': 'ProductSwitcherItem', 'selector': 'ibm-product-switcher-item'},{'name': 'ProductSwitcherList', 'selector': 'ibm-product-switcher-list'},{'name': 'ProductSwitcherListItem', 'selector': 'ibm-product-switcher-list-item'},{'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': 'Tab', 'selector': 'ibm-tab'},{'name': 'TabHeaders', 'selector': 'ibm-tab-headers'},{'name': 'Table', 'selector': 'ibm-table'},{'name': 'TableContainer', 'selector': 'ibm-table-container'},{'name': 'TableHeader', 'selector': 'ibm-table-header'},{'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'}];
1513
1529
  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': 'TableHeaderDescription', 'selector': '[ibmTableHeaderDescription]'},{'name': 'TableHeaderTitle', 'selector': '[ibmTableHeaderTitle]'},{'name': 'TextArea', 'selector': '[ibmTextArea]'},{'name': 'TextInput', 'selector': '[ibmText]'},{'name': 'TooltipDirective', 'selector': '[ibmTooltip]'}];
1514
1530
  var ACTUAL_COMPONENT = {'name': 'Tooltip'};
package/docs/documentation/coverage.html CHANGED
@@ -2266,9 +2266,9 @@
2266
2266
  <td>
2267
2267
  TabHeaders
2268
2268
  </td>
2269
- <td align="right" data-sort="71">
2270
- <span class="coverage-percent">71 %</span>
2271
- <span class="coverage-count">(15/21)</span>
2269
+ <td align="right" data-sort="70">
2270
+ <span class="coverage-percent">70 %</span>
2271
+ <span class="coverage-count">(17/24)</span>
2272
2272
  </td>
2273
2273
  </tr>
2274
2274
  <tr class="very-good">
@@ -2316,7 +2316,7 @@
2316
2316
  </td>
2317
2317
  <td align="right" data-sort="100">
2318
2318
  <span class="coverage-percent">100 %</span>
2319
- <span class="coverage-count">(10/10)</span>
2319
+ <span class="coverage-count">(12/12)</span>
2320
2320
  </td>
2321
2321
  </tr>
2322
2322
  <tr class="medium">