@patternfly/elements 3.0.2 → 4.0.1

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 (371) hide show
  1. package/custom-elements.json +8857 -8783
  2. package/form-control.css +127 -0
  3. package/package.json +12 -25
  4. package/pf-accordion/pf-accordion-header.css +23 -0
  5. package/pf-accordion/pf-accordion-header.d.ts +52 -43
  6. package/pf-accordion/pf-accordion-header.js +130 -87
  7. package/pf-accordion/pf-accordion-header.js.map +1 -1
  8. package/pf-accordion/pf-accordion-panel.css +15 -0
  9. package/pf-accordion/pf-accordion-panel.d.ts +27 -25
  10. package/pf-accordion/pf-accordion-panel.js +29 -43
  11. package/pf-accordion/pf-accordion-panel.js.map +1 -1
  12. package/pf-accordion/pf-accordion.d.ts +122 -65
  13. package/pf-accordion/pf-accordion.js +283 -94
  14. package/pf-accordion/pf-accordion.js.map +1 -1
  15. package/pf-accordion/test/pf-accordion.e2e.js +12 -0
  16. package/pf-accordion/test/pf-accordion.e2e.js.map +1 -1
  17. package/pf-accordion/test/pf-accordion.spec.js +366 -350
  18. package/pf-accordion/test/pf-accordion.spec.js.map +1 -1
  19. package/pf-avatar/pf-avatar.css +50 -24
  20. package/pf-avatar/pf-avatar.d.ts +29 -3
  21. package/pf-avatar/pf-avatar.js +51 -9
  22. package/pf-avatar/pf-avatar.js.map +1 -1
  23. package/pf-avatar/test/pf-avatar.e2e.js +12 -0
  24. package/pf-avatar/test/pf-avatar.e2e.js.map +1 -1
  25. package/pf-avatar/test/pf-avatar.spec.js +2 -3
  26. package/pf-avatar/test/pf-avatar.spec.js.map +1 -1
  27. package/pf-back-to-top/pf-back-to-top.css +10 -0
  28. package/pf-back-to-top/pf-back-to-top.d.ts +14 -18
  29. package/pf-back-to-top/pf-back-to-top.js +9 -30
  30. package/pf-back-to-top/pf-back-to-top.js.map +1 -1
  31. package/pf-back-to-top/test/pf-back-to-top.e2e.js +12 -0
  32. package/pf-back-to-top/test/pf-back-to-top.e2e.js.map +1 -1
  33. package/pf-background-image/pf-background-image.d.ts +4 -4
  34. package/pf-background-image/pf-background-image.js +1 -12
  35. package/pf-background-image/pf-background-image.js.map +1 -1
  36. package/pf-background-image/test/pf-background-image.e2e.js +12 -0
  37. package/pf-background-image/test/pf-background-image.e2e.js.map +1 -1
  38. package/pf-badge/pf-badge.css +4 -0
  39. package/pf-badge/pf-badge.d.ts +26 -22
  40. package/pf-badge/pf-badge.js +14 -27
  41. package/pf-badge/pf-badge.js.map +1 -1
  42. package/pf-badge/test/pf-badge.e2e.js +12 -0
  43. package/pf-badge/test/pf-badge.e2e.js.map +1 -1
  44. package/pf-banner/pf-banner.d.ts +16 -16
  45. package/pf-banner/pf-banner.js +1 -24
  46. package/pf-banner/pf-banner.js.map +1 -1
  47. package/pf-banner/test/pf-banner.e2e.js +12 -0
  48. package/pf-banner/test/pf-banner.e2e.js.map +1 -1
  49. package/pf-button/pf-button.css +22 -12
  50. package/pf-button/pf-button.d.ts +128 -122
  51. package/pf-button/pf-button.js +95 -172
  52. package/pf-button/pf-button.js.map +1 -1
  53. package/pf-button/test/pf-button.e2e.js +12 -0
  54. package/pf-button/test/pf-button.e2e.js.map +1 -1
  55. package/pf-card/pf-card.css +172 -43
  56. package/pf-card/pf-card.d.ts +41 -38
  57. package/pf-card/pf-card.js +37 -54
  58. package/pf-card/pf-card.js.map +1 -1
  59. package/pf-card/test/pf-card.e2e.js +12 -0
  60. package/pf-card/test/pf-card.e2e.js.map +1 -1
  61. package/pf-chip/pf-chip-group.css +9 -6
  62. package/pf-chip/pf-chip-group.d.ts +27 -14
  63. package/pf-chip/pf-chip-group.js +65 -94
  64. package/pf-chip/pf-chip-group.js.map +1 -1
  65. package/pf-chip/pf-chip.d.ts +20 -9
  66. package/pf-chip/pf-chip.js +1 -8
  67. package/pf-chip/pf-chip.js.map +1 -1
  68. package/pf-chip/test/pf-chip-group.spec.js +42 -22
  69. package/pf-chip/test/pf-chip-group.spec.js.map +1 -1
  70. package/pf-chip/test/pf-chip.e2e.js +12 -0
  71. package/pf-chip/test/pf-chip.e2e.js.map +1 -1
  72. package/pf-clipboard-copy/pf-clipboard-copy.css +83 -89
  73. package/pf-clipboard-copy/pf-clipboard-copy.d.ts +53 -18
  74. package/pf-clipboard-copy/pf-clipboard-copy.js +55 -44
  75. package/pf-clipboard-copy/pf-clipboard-copy.js.map +1 -1
  76. package/pf-clipboard-copy/test/pf-clipboard-copy.e2e.js +12 -0
  77. package/pf-clipboard-copy/test/pf-clipboard-copy.e2e.js.map +1 -1
  78. package/pf-code-block/pf-code-block.css +7 -4
  79. package/pf-code-block/pf-code-block.d.ts +4 -25
  80. package/pf-code-block/pf-code-block.js +44 -23
  81. package/pf-code-block/pf-code-block.js.map +1 -1
  82. package/pf-code-block/test/pf-code-block.e2e.js +12 -0
  83. package/pf-code-block/test/pf-code-block.e2e.js.map +1 -1
  84. package/pf-dropdown/context.d.ts +2 -3
  85. package/pf-dropdown/context.js.map +1 -1
  86. package/pf-dropdown/pf-dropdown-group.d.ts +3 -9
  87. package/pf-dropdown/pf-dropdown-group.js +1 -5
  88. package/pf-dropdown/pf-dropdown-group.js.map +1 -1
  89. package/pf-dropdown/pf-dropdown-item.d.ts +21 -27
  90. package/pf-dropdown/pf-dropdown-item.js +1 -37
  91. package/pf-dropdown/pf-dropdown-item.js.map +1 -1
  92. package/pf-dropdown/pf-dropdown-menu.d.ts +4 -10
  93. package/pf-dropdown/pf-dropdown-menu.js +23 -23
  94. package/pf-dropdown/pf-dropdown-menu.js.map +1 -1
  95. package/pf-dropdown/pf-dropdown.d.ts +8 -24
  96. package/pf-dropdown/pf-dropdown.js +1 -26
  97. package/pf-dropdown/pf-dropdown.js.map +1 -1
  98. package/pf-dropdown/test/pf-dropdown.e2e.js +12 -0
  99. package/pf-dropdown/test/pf-dropdown.e2e.js.map +1 -1
  100. package/pf-icon/pf-icon.css +22 -0
  101. package/pf-icon/pf-icon.d.ts +93 -4
  102. package/pf-icon/pf-icon.js +191 -13
  103. package/pf-icon/pf-icon.js.map +1 -1
  104. package/pf-icon/test/pf-icon.e2e.js +12 -0
  105. package/pf-icon/test/pf-icon.e2e.js.map +1 -1
  106. package/pf-icon/test/pf-icon.spec.js +102 -88
  107. package/pf-icon/test/pf-icon.spec.js.map +1 -1
  108. package/pf-jump-links/pf-jump-links-item.d.ts +4 -11
  109. package/pf-jump-links/pf-jump-links-item.js +8 -15
  110. package/pf-jump-links/pf-jump-links-item.js.map +1 -1
  111. package/pf-jump-links/pf-jump-links-list.d.ts +2 -2
  112. package/pf-jump-links/pf-jump-links-list.js +1 -5
  113. package/pf-jump-links/pf-jump-links-list.js.map +1 -1
  114. package/pf-jump-links/pf-jump-links.d.ts +2 -2
  115. package/pf-jump-links/pf-jump-links.js +23 -62
  116. package/pf-jump-links/pf-jump-links.js.map +1 -1
  117. package/pf-jump-links/test/pf-jump-links.e2e.js +12 -0
  118. package/pf-jump-links/test/pf-jump-links.e2e.js.map +1 -1
  119. package/pf-label/pf-label.css +38 -5
  120. package/pf-label/pf-label.d.ts +65 -69
  121. package/pf-label/pf-label.js +49 -90
  122. package/pf-label/pf-label.js.map +1 -1
  123. package/pf-label/test/pf-label.e2e.js +12 -0
  124. package/pf-label/test/pf-label.e2e.js.map +1 -1
  125. package/pf-label/test/pf-label.spec.js +26 -16
  126. package/pf-label/test/pf-label.spec.js.map +1 -1
  127. package/pf-modal/pf-modal.d.ts +17 -22
  128. package/pf-modal/pf-modal.js +13 -39
  129. package/pf-modal/pf-modal.js.map +1 -1
  130. package/pf-modal/test/pf-modal.e2e.js +12 -0
  131. package/pf-modal/test/pf-modal.e2e.js.map +1 -1
  132. package/pf-panel/pf-panel.d.ts +31 -3
  133. package/pf-panel/pf-panel.js +1 -10
  134. package/pf-panel/pf-panel.js.map +1 -1
  135. package/pf-panel/test/pf-panel.e2e.js +12 -0
  136. package/pf-panel/test/pf-panel.e2e.js.map +1 -1
  137. package/pf-popover/pf-popover.d.ts +66 -84
  138. package/pf-popover/pf-popover.js +33 -150
  139. package/pf-popover/pf-popover.js.map +1 -1
  140. package/pf-popover/test/pf-popover.e2e.js +12 -0
  141. package/pf-popover/test/pf-popover.e2e.js.map +1 -1
  142. package/pf-popover/test/pf-popover.spec.js +0 -11
  143. package/pf-popover/test/pf-popover.spec.js.map +1 -1
  144. package/pf-progress/pf-progress.d.ts +40 -40
  145. package/pf-progress/pf-progress.js +1 -61
  146. package/pf-progress/pf-progress.js.map +1 -1
  147. package/pf-progress/test/pf-progress.e2e.js +12 -0
  148. package/pf-progress/test/pf-progress.e2e.js.map +1 -1
  149. package/pf-progress-stepper/pf-progress-step.d.ts +2 -3
  150. package/pf-progress-stepper/pf-progress-step.js +4 -14
  151. package/pf-progress-stepper/pf-progress-step.js.map +1 -1
  152. package/pf-progress-stepper/pf-progress-stepper.d.ts +118 -2
  153. package/pf-progress-stepper/pf-progress-stepper.js +10 -12
  154. package/pf-progress-stepper/pf-progress-stepper.js.map +1 -1
  155. package/pf-progress-stepper/test/pf-progress-stepper.e2e.js +12 -0
  156. package/pf-progress-stepper/test/pf-progress-stepper.e2e.js.map +1 -1
  157. package/pf-select/pf-option-group.d.ts +2 -2
  158. package/pf-select/pf-option-group.js +1 -5
  159. package/pf-select/pf-option-group.js.map +1 -1
  160. package/pf-select/pf-option.css +1 -1
  161. package/pf-select/pf-option.d.ts +4 -4
  162. package/pf-select/pf-option.js +20 -30
  163. package/pf-select/pf-option.js.map +1 -1
  164. package/pf-select/pf-select.css +14 -6
  165. package/pf-select/pf-select.d.ts +183 -40
  166. package/pf-select/pf-select.js +185 -260
  167. package/pf-select/pf-select.js.map +1 -1
  168. package/pf-select/test/pf-select.e2e.js +12 -0
  169. package/pf-select/test/pf-select.e2e.js.map +1 -1
  170. package/pf-select/test/pf-select.spec.js +1292 -613
  171. package/pf-select/test/pf-select.spec.js.map +1 -1
  172. package/pf-spinner/pf-spinner.css +27 -17
  173. package/pf-spinner/pf-spinner.d.ts +21 -17
  174. package/pf-spinner/pf-spinner.js +20 -24
  175. package/pf-spinner/pf-spinner.js.map +1 -1
  176. package/pf-spinner/test/pf-spinner.e2e.js +12 -0
  177. package/pf-spinner/test/pf-spinner.e2e.js.map +1 -1
  178. package/pf-switch/pf-switch.css +39 -13
  179. package/pf-switch/pf-switch.d.ts +48 -34
  180. package/pf-switch/pf-switch.js +114 -43
  181. package/pf-switch/pf-switch.js.map +1 -1
  182. package/pf-switch/test/pf-switch.e2e.js +12 -0
  183. package/pf-switch/test/pf-switch.e2e.js.map +1 -1
  184. package/pf-table/pf-caption.d.ts +2 -2
  185. package/pf-table/pf-caption.js +1 -4
  186. package/pf-table/pf-caption.js.map +1 -1
  187. package/pf-table/pf-table.d.ts +424 -424
  188. package/pf-table/pf-table.js +7 -645
  189. package/pf-table/pf-table.js.map +1 -1
  190. package/pf-table/pf-tbody.d.ts +2 -2
  191. package/pf-table/pf-tbody.js +1 -4
  192. package/pf-table/pf-tbody.js.map +1 -1
  193. package/pf-table/pf-td.d.ts +2 -2
  194. package/pf-table/pf-td.js +1 -4
  195. package/pf-table/pf-td.js.map +1 -1
  196. package/pf-table/pf-th.d.ts +2 -2
  197. package/pf-table/pf-th.js +1 -4
  198. package/pf-table/pf-th.js.map +1 -1
  199. package/pf-table/pf-thead.d.ts +2 -2
  200. package/pf-table/pf-thead.js +1 -4
  201. package/pf-table/pf-thead.js.map +1 -1
  202. package/pf-table/pf-tr.d.ts +1 -1
  203. package/pf-table/pf-tr.js +1 -4
  204. package/pf-table/pf-tr.js.map +1 -1
  205. package/pf-table/test/pf-table.e2e.js +12 -0
  206. package/pf-table/test/pf-table.e2e.js.map +1 -1
  207. package/pf-tabs/context.d.ts +2 -3
  208. package/pf-tabs/context.js.map +1 -1
  209. package/pf-tabs/pf-tab-panel.d.ts +3 -5
  210. package/pf-tabs/pf-tab-panel.js +1 -7
  211. package/pf-tabs/pf-tab-panel.js.map +1 -1
  212. package/pf-tabs/pf-tab.d.ts +37 -37
  213. package/pf-tabs/pf-tab.js +16 -54
  214. package/pf-tabs/pf-tab.js.map +1 -1
  215. package/pf-tabs/pf-tabs.d.ts +36 -37
  216. package/pf-tabs/pf-tabs.js +40 -78
  217. package/pf-tabs/pf-tabs.js.map +1 -1
  218. package/pf-tabs/test/pf-tabs.e2e.js +12 -0
  219. package/pf-tabs/test/pf-tabs.e2e.js.map +1 -1
  220. package/pf-tabs/test/pf-tabs.spec.js +11 -12
  221. package/pf-tabs/test/pf-tabs.spec.js.map +1 -1
  222. package/pf-text-area/pf-text-area.d.ts +128 -134
  223. package/pf-text-area/pf-text-area.js +7 -131
  224. package/pf-text-area/pf-text-area.js.map +1 -1
  225. package/pf-text-area/test/pf-text-area.e2e.js +12 -0
  226. package/pf-text-area/test/pf-text-area.e2e.js.map +1 -1
  227. package/pf-text-input/pf-text-input.d.ts +129 -135
  228. package/pf-text-input/pf-text-input.js +7 -132
  229. package/pf-text-input/pf-text-input.js.map +1 -1
  230. package/pf-text-input/test/pf-text-input.e2e.js +12 -0
  231. package/pf-text-input/test/pf-text-input.e2e.js.map +1 -1
  232. package/pf-tile/pf-tile.d.ts +21 -20
  233. package/pf-tile/pf-tile.js +18 -35
  234. package/pf-tile/pf-tile.js.map +1 -1
  235. package/pf-tile/test/pf-tile.e2e.js +12 -0
  236. package/pf-tile/test/pf-tile.e2e.js.map +1 -1
  237. package/pf-timestamp/pf-timestamp.d.ts +2 -2
  238. package/pf-timestamp/pf-timestamp.js +1 -3
  239. package/pf-timestamp/pf-timestamp.js.map +1 -1
  240. package/pf-timestamp/test/pf-timestamp.e2e.js +12 -0
  241. package/pf-timestamp/test/pf-timestamp.e2e.js.map +1 -1
  242. package/pf-tooltip/pf-tooltip.d.ts +51 -50
  243. package/pf-tooltip/pf-tooltip.js +26 -106
  244. package/pf-tooltip/pf-tooltip.js.map +1 -1
  245. package/pf-tooltip/test/pf-tooltip.e2e.js +12 -0
  246. package/pf-tooltip/test/pf-tooltip.e2e.js.map +1 -1
  247. package/pfe.min.js +1194 -1006
  248. package/pfe.min.js.map +4 -4
  249. package/react/pf-accordion/pf-accordion-header.js +2 -2
  250. package/react/pf-accordion/pf-accordion-panel.js +2 -2
  251. package/react/pf-accordion/pf-accordion.js +2 -2
  252. package/react/pf-avatar/pf-avatar.d.ts +1 -1
  253. package/react/pf-avatar/pf-avatar.js +5 -3
  254. package/react/pf-back-to-top/pf-back-to-top.js +2 -2
  255. package/react/pf-background-image/pf-background-image.js +2 -2
  256. package/react/pf-badge/pf-badge.js +2 -2
  257. package/react/pf-banner/pf-banner.js +2 -2
  258. package/react/pf-button/pf-button.js +2 -2
  259. package/react/pf-card/pf-card.js +2 -2
  260. package/react/pf-chip/pf-chip-group.js +2 -2
  261. package/react/pf-chip/pf-chip.js +2 -2
  262. package/react/pf-clipboard-copy/pf-clipboard-copy.d.ts +1 -1
  263. package/react/pf-clipboard-copy/pf-clipboard-copy.js +5 -3
  264. package/react/pf-code-block/pf-code-block.js +2 -2
  265. package/react/pf-dropdown/pf-dropdown-group.js +2 -2
  266. package/react/pf-dropdown/pf-dropdown-item.js +2 -2
  267. package/react/pf-dropdown/pf-dropdown-menu.js +2 -2
  268. package/react/pf-dropdown/pf-dropdown.js +2 -2
  269. package/react/pf-icon/pf-icon.js +2 -2
  270. package/react/pf-jump-links/pf-jump-links-item.js +2 -2
  271. package/react/pf-jump-links/pf-jump-links-list.js +2 -2
  272. package/react/pf-jump-links/pf-jump-links.js +2 -2
  273. package/react/pf-label/pf-label.js +2 -2
  274. package/react/pf-modal/pf-modal.js +2 -2
  275. package/react/pf-panel/pf-panel.js +2 -2
  276. package/react/pf-popover/pf-popover.js +2 -2
  277. package/react/pf-progress/pf-progress.js +2 -2
  278. package/react/pf-progress-stepper/pf-progress-step.js +2 -2
  279. package/react/pf-progress-stepper/pf-progress-stepper.js +2 -2
  280. package/react/pf-select/pf-option-group.js +2 -2
  281. package/react/pf-select/pf-option.js +2 -2
  282. package/react/pf-select/pf-select.d.ts +1 -1
  283. package/react/pf-select/pf-select.js +2 -3
  284. package/react/pf-spinner/pf-spinner.js +2 -2
  285. package/react/pf-switch/pf-switch.js +2 -2
  286. package/react/pf-table/pf-caption.js +2 -2
  287. package/react/pf-table/pf-table.js +2 -2
  288. package/react/pf-table/pf-tbody.js +2 -2
  289. package/react/pf-table/pf-td.js +2 -2
  290. package/react/pf-table/pf-th.js +2 -2
  291. package/react/pf-table/pf-thead.js +2 -2
  292. package/react/pf-table/pf-tr.js +2 -2
  293. package/react/pf-tabs/pf-tab-panel.js +2 -2
  294. package/react/pf-tabs/pf-tab.js +2 -2
  295. package/react/pf-tabs/pf-tabs.js +2 -2
  296. package/react/pf-text-area/pf-text-area.js +2 -2
  297. package/react/pf-text-input/pf-text-input.js +2 -2
  298. package/react/pf-tile/pf-tile.js +2 -2
  299. package/react/pf-timestamp/pf-timestamp.js +2 -2
  300. package/react/pf-tooltip/pf-tooltip.js +2 -2
  301. package/pf-accordion/BaseAccordion.d.ts +0 -61
  302. package/pf-accordion/BaseAccordion.js +0 -269
  303. package/pf-accordion/BaseAccordion.js.map +0 -1
  304. package/pf-accordion/BaseAccordionHeader.css +0 -39
  305. package/pf-accordion/BaseAccordionHeader.d.ts +0 -29
  306. package/pf-accordion/BaseAccordionHeader.js +0 -128
  307. package/pf-accordion/BaseAccordionHeader.js.map +0 -1
  308. package/pf-accordion/BaseAccordionPanel.css +0 -27
  309. package/pf-accordion/BaseAccordionPanel.d.ts +0 -7
  310. package/pf-accordion/BaseAccordionPanel.js +0 -33
  311. package/pf-accordion/BaseAccordionPanel.js.map +0 -1
  312. package/pf-avatar/BaseAvatar.css +0 -13
  313. package/pf-avatar/BaseAvatar.d.ts +0 -23
  314. package/pf-avatar/BaseAvatar.js +0 -62
  315. package/pf-avatar/BaseAvatar.js.map +0 -1
  316. package/pf-back-to-top/demo/demo.css +0 -25
  317. package/pf-badge/BaseBadge.css +0 -6
  318. package/pf-badge/BaseBadge.d.ts +0 -18
  319. package/pf-badge/BaseBadge.js +0 -16
  320. package/pf-badge/BaseBadge.js.map +0 -1
  321. package/pf-button/BaseButton.css +0 -68
  322. package/pf-button/BaseButton.d.ts +0 -51
  323. package/pf-button/BaseButton.js +0 -84
  324. package/pf-button/BaseButton.js.map +0 -1
  325. package/pf-card/BaseCard.css +0 -36
  326. package/pf-card/BaseCard.d.ts +0 -24
  327. package/pf-card/BaseCard.js +0 -51
  328. package/pf-card/BaseCard.js.map +0 -1
  329. package/pf-clipboard-copy/BaseClipboardCopy.css +0 -6
  330. package/pf-clipboard-copy/BaseClipboardCopy.d.ts +0 -18
  331. package/pf-clipboard-copy/BaseClipboardCopy.js +0 -25
  332. package/pf-clipboard-copy/BaseClipboardCopy.js.map +0 -1
  333. package/pf-code-block/BaseCodeBlock.css +0 -7
  334. package/pf-code-block/BaseCodeBlock.d.ts +0 -8
  335. package/pf-code-block/BaseCodeBlock.js +0 -22
  336. package/pf-code-block/BaseCodeBlock.js.map +0 -1
  337. package/pf-icon/BaseIcon.css +0 -22
  338. package/pf-icon/BaseIcon.d.ts +0 -41
  339. package/pf-icon/BaseIcon.js +0 -144
  340. package/pf-icon/BaseIcon.js.map +0 -1
  341. package/pf-label/BaseLabel.css +0 -44
  342. package/pf-label/BaseLabel.d.ts +0 -30
  343. package/pf-label/BaseLabel.js +0 -29
  344. package/pf-label/BaseLabel.js.map +0 -1
  345. package/pf-spinner/BaseSpinner.css +0 -20
  346. package/pf-spinner/BaseSpinner.d.ts +0 -27
  347. package/pf-spinner/BaseSpinner.js +0 -45
  348. package/pf-spinner/BaseSpinner.js.map +0 -1
  349. package/pf-switch/BaseSwitch.css +0 -36
  350. package/pf-switch/BaseSwitch.d.ts +0 -19
  351. package/pf-switch/BaseSwitch.js +0 -109
  352. package/pf-switch/BaseSwitch.js.map +0 -1
  353. package/pf-tabs/BaseTab.css +0 -60
  354. package/pf-tabs/BaseTab.d.ts +0 -32
  355. package/pf-tabs/BaseTab.js +0 -83
  356. package/pf-tabs/BaseTab.js.map +0 -1
  357. package/pf-tabs/BaseTabPanel.css +0 -7
  358. package/pf-tabs/BaseTabPanel.d.ts +0 -7
  359. package/pf-tabs/BaseTabPanel.js +0 -36
  360. package/pf-tabs/BaseTabPanel.js.map +0 -1
  361. package/pf-tabs/BaseTabs.css +0 -86
  362. package/pf-tabs/BaseTabs.d.ts +0 -38
  363. package/pf-tabs/BaseTabs.js +0 -221
  364. package/pf-tabs/BaseTabs.js.map +0 -1
  365. package/pf-tile/BaseTile.d.ts +0 -13
  366. package/pf-tile/BaseTile.js +0 -28
  367. package/pf-tile/BaseTile.js.map +0 -1
  368. package/pf-tooltip/BaseTooltip.css +0 -70
  369. package/pf-tooltip/BaseTooltip.d.ts +0 -16
  370. package/pf-tooltip/BaseTooltip.js +0 -54
  371. package/pf-tooltip/BaseTooltip.js.map +0 -1
@@ -1,221 +0,0 @@
1
- var _BaseTabs_instances, _a, _BaseTabs_instances_1, _BaseTabs_tabindex, _BaseTabs_overflow, _BaseTabs_logger, _BaseTabs_allTabs, _BaseTabs_allPanels, _BaseTabs_activeIndex, _BaseTabs_activeTab_get, _BaseTabs_onSlotchange, _BaseTabs_updateAccessibility, _BaseTabs_onTabExpand, _BaseTabs_deactivateExcept, _BaseTabs_firstFocusable_get, _BaseTabs_firstTab_get, _BaseTabs_lastTab_get, _BaseTabs_activeItemIndex_get, _BaseTabs_firstLastClasses, _BaseTabs_scrollLeft, _BaseTabs_scrollRight;
2
- import { __classPrivateFieldGet, __classPrivateFieldSet, __decorate } from "tslib";
3
- // we will remove this file for 3.0
4
- /* eslint-disable lit-a11y/no-aria-slot */
5
- import { LitElement, html } from 'lit';
6
- import { property } from 'lit/decorators/property.js';
7
- import { query } from 'lit/decorators/query.js';
8
- import { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';
9
- import { classMap } from 'lit/directives/class-map.js';
10
- import { RovingTabindexController } from '@patternfly/pfe-core/controllers/roving-tabindex-controller.js';
11
- import { OverflowController } from '@patternfly/pfe-core/controllers/overflow-controller.js';
12
- import { Logger } from '@patternfly/pfe-core/controllers/logger.js';
13
- import { getRandomId } from '@patternfly/pfe-core/functions/random.js';
14
- import { BaseTab, TabExpandEvent } from './BaseTab.js';
15
- import { BaseTabPanel } from './BaseTabPanel.js';
16
- import { css } from "lit";
17
- const styles = css `:host {\n display: block;\n}\n\n[part="tabs-container"] {\n position: relative;\n display: flex;\n overflow: hidden;\n}\n\n[part="tabs-container"]::before {\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n border-style: solid;\n}\n\n:host button {\n opacity: 1;\n}\n\n:host button:nth-of-type(1) {\n margin-inline-end: 0;\n translate: 0 0;\n}\n\n:host button:nth-of-type(2) {\n margin-inline-start: 0;\n translate: 0 0;\n}\n\n[part="tabs"],\n[part="panels"] {\n display: block;\n}\n\n[part="tabs"] {\n scrollbar-width: none;\n position: relative;\n max-width: 100%;\n overflow-x: auto;\n}\n\n[part="tabs-container"]::before,\n[part="tabs"]::before,\nbutton::before {\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n content: "";\n border-style: solid;\n}\n\n[part="tabs"]::before,\nbutton::before {\n top: 0;\n}\n\nbutton,\n[part="tabs"]::before {\n border: 0;\n}\n\nbutton {\n flex: none;\n line-height: 1;\n opacity: 0;\n}\n\nbutton::before {\n border-block-start-width: 0;\n}\n\nbutton:nth-of-type(1) {\n translate: -100% 0;\n}\n\nbutton:nth-of-type(2) {\n translate: 100% 0;\n}\n\nbutton:disabled {\n pointer-events: none;\n}\n`;
18
- /**
19
- * BaseTabs
20
- * @attr [label-scroll-left="Scroll left"] - accessible label for the tab panel's scroll left button.
21
- * @attr [label-scroll-right="Scroll right"] - accessible label for the tab panel's scroll right button.
22
- */
23
- export class BaseTabs extends LitElement {
24
- constructor() {
25
- super(...arguments);
26
- _BaseTabs_instances.add(this);
27
- _BaseTabs_tabindex.set(this, new RovingTabindexController(this, {
28
- getItems: () => __classPrivateFieldGet(this, _BaseTabs_allTabs, "f"),
29
- }));
30
- _BaseTabs_overflow.set(this, new OverflowController(this));
31
- _BaseTabs_logger.set(this, new Logger(this));
32
- _BaseTabs_allTabs.set(this, []);
33
- _BaseTabs_allPanels.set(this, []);
34
- _BaseTabs_activeIndex.set(this, 0);
35
- /**
36
- * Tab activation
37
- * Tabs can be either [automatic](https://w3c.github.io/aria-practices/examples/tabs/tabs-automatic.html) activated
38
- * or [manual](https://w3c.github.io/aria-practices/examples/tabs/tabs-manual.html)
39
- */
40
- this.manual = false;
41
- _BaseTabs_onTabExpand.set(this, (event) => {
42
- if (!(event instanceof TabExpandEvent)
43
- || !__classPrivateFieldGet(this, _BaseTabs_allTabs, "f").length
44
- || !__classPrivateFieldGet(this, _BaseTabs_allPanels, "f").length) {
45
- return;
46
- }
47
- if (event.active) {
48
- this.activeIndex = __classPrivateFieldGet(this, _BaseTabs_allTabs, "f").findIndex(tab => tab === event.tab);
49
- }
50
- });
51
- }
52
- static isTab(element) {
53
- return element instanceof BaseTab;
54
- }
55
- static isPanel(element) {
56
- return element instanceof BaseTabPanel;
57
- }
58
- get activeIndex() {
59
- return __classPrivateFieldGet(this, _BaseTabs_activeIndex, "f");
60
- }
61
- set activeIndex(index) {
62
- const oldIndex = this.activeIndex;
63
- const tab = __classPrivateFieldGet(this, _BaseTabs_allTabs, "f")[index];
64
- if (tab) {
65
- if (tab.disabled) {
66
- __classPrivateFieldGet(this, _BaseTabs_logger, "f").warn(`Disabled tabs can not be active, setting first focusable tab to active`);
67
- __classPrivateFieldGet(this, _BaseTabs_tabindex, "f").setActiveItem(__classPrivateFieldGet(this, _BaseTabs_instances, "a", _BaseTabs_firstFocusable_get));
68
- index = __classPrivateFieldGet(this, _BaseTabs_instances, "a", _BaseTabs_activeItemIndex_get);
69
- return;
70
- }
71
- else {
72
- tab.active = true;
73
- }
74
- }
75
- if (index === -1) {
76
- __classPrivateFieldGet(this, _BaseTabs_logger, "f").warn(`No active tab found, setting first focusable tab to active`);
77
- __classPrivateFieldGet(this, _BaseTabs_tabindex, "f").setActiveItem(__classPrivateFieldGet(this, _BaseTabs_tabindex, "f").firstItem);
78
- index = __classPrivateFieldGet(this, _BaseTabs_instances, "a", _BaseTabs_activeItemIndex_get);
79
- }
80
- else {
81
- __classPrivateFieldGet(this, _BaseTabs_tabindex, "f").setActiveItem(tab);
82
- }
83
- __classPrivateFieldSet(this, _BaseTabs_activeIndex, index, "f");
84
- this.requestUpdate('activeIndex', oldIndex);
85
- __classPrivateFieldGet(this, _BaseTabs_allPanels, "f")[__classPrivateFieldGet(this, _BaseTabs_activeIndex, "f")].hidden = false;
86
- // close all tabs that are not the activeIndex
87
- __classPrivateFieldGet(this, _BaseTabs_instances, "m", _BaseTabs_deactivateExcept).call(this, __classPrivateFieldGet(this, _BaseTabs_activeIndex, "f"));
88
- }
89
- connectedCallback() {
90
- super.connectedCallback();
91
- this.id || (this.id = getRandomId(this.localName));
92
- this.addEventListener('expand', __classPrivateFieldGet(this, _BaseTabs_onTabExpand, "f"));
93
- __classPrivateFieldGet(_a, _a, "f", _BaseTabs_instances_1).add(this);
94
- }
95
- disconnectedCallback() {
96
- super.disconnectedCallback();
97
- __classPrivateFieldGet(_a, _a, "f", _BaseTabs_instances_1).delete(this);
98
- }
99
- willUpdate() {
100
- const { activeItem } = __classPrivateFieldGet(this, _BaseTabs_tabindex, "f");
101
- // If RTI has an activeItem, update the roving tabindex controller
102
- if (!this.manual
103
- && activeItem
104
- && activeItem !== __classPrivateFieldGet(this, _BaseTabs_instances, "a", _BaseTabs_activeTab_get)
105
- && activeItem.ariaDisabled !== 'true') {
106
- activeItem.active = true;
107
- }
108
- }
109
- async firstUpdated() {
110
- this.tabList.addEventListener('scroll', __classPrivateFieldGet(this, _BaseTabs_overflow, "f").onScroll.bind(this));
111
- }
112
- render() {
113
- const { scrollIconSet, scrollIconLeft, scrollIconRight } = this.constructor;
114
- return html `
115
- <div part="container" class="${classMap({ overflow: __classPrivateFieldGet(this, _BaseTabs_overflow, "f").showScrollButtons })}">
116
- <div part="tabs-container">${!__classPrivateFieldGet(this, _BaseTabs_overflow, "f").showScrollButtons ? '' : html `
117
- <button id="previousTab" tabindex="-1"
118
- aria-label="${this.getAttribute('label-scroll-left') ?? 'Scroll left'}"
119
- ?disabled="${!__classPrivateFieldGet(this, _BaseTabs_overflow, "f").overflowLeft}"
120
- @click="${__classPrivateFieldGet(this, _BaseTabs_instances, "m", _BaseTabs_scrollLeft)}">
121
- <pf-icon icon="${scrollIconLeft}" set="${scrollIconSet}" loading="eager"></pf-icon>
122
- </button>`}
123
- <slot name="tab"
124
- part="tabs"
125
- role="tablist"
126
- @slotchange="${__classPrivateFieldGet(this, _BaseTabs_instances, "m", _BaseTabs_onSlotchange)}"></slot> ${!__classPrivateFieldGet(this, _BaseTabs_overflow, "f").showScrollButtons ? '' : html `
127
- <button id="nextTab" tabindex="-1"
128
- aria-label="${this.getAttribute('label-scroll-right') ?? 'Scroll right'}"
129
- ?disabled="${!__classPrivateFieldGet(this, _BaseTabs_overflow, "f").overflowRight}"
130
- @click="${__classPrivateFieldGet(this, _BaseTabs_instances, "m", _BaseTabs_scrollRight)}">
131
- <pf-icon icon="${scrollIconRight}" set="${scrollIconSet}" loading="eager"></pf-icon>
132
- </button>`}
133
- </div>
134
- <slot part="panels" @slotchange="${__classPrivateFieldGet(this, _BaseTabs_instances, "m", _BaseTabs_onSlotchange)}"></slot>
135
- </div>
136
- `;
137
- }
138
- }
139
- _a = BaseTabs, _BaseTabs_tabindex = new WeakMap(), _BaseTabs_overflow = new WeakMap(), _BaseTabs_logger = new WeakMap(), _BaseTabs_allTabs = new WeakMap(), _BaseTabs_allPanels = new WeakMap(), _BaseTabs_activeIndex = new WeakMap(), _BaseTabs_onTabExpand = new WeakMap(), _BaseTabs_instances = new WeakSet(), _BaseTabs_activeTab_get = function _BaseTabs_activeTab_get() {
140
- const [tab] = __classPrivateFieldGet(this, _BaseTabs_allTabs, "f").filter(tab => tab.active);
141
- return tab;
142
- }, _BaseTabs_onSlotchange = function _BaseTabs_onSlotchange(event) {
143
- if (event.target.name === 'tab') {
144
- __classPrivateFieldSet(this, _BaseTabs_allTabs, this.tabs.filter(tab => this.constructor.isTab(tab)), "f");
145
- }
146
- else {
147
- __classPrivateFieldSet(this, _BaseTabs_allPanels, this.panels
148
- .filter(panel => this.constructor.isPanel(panel)), "f");
149
- }
150
- __classPrivateFieldGet(this, _BaseTabs_tabindex, "f").updateItems();
151
- if ((__classPrivateFieldGet(this, _BaseTabs_allTabs, "f").length === __classPrivateFieldGet(this, _BaseTabs_allPanels, "f").length)
152
- && (__classPrivateFieldGet(this, _BaseTabs_allTabs, "f").length !== 0 || __classPrivateFieldGet(this, _BaseTabs_allPanels, "f").length !== 0)) {
153
- __classPrivateFieldGet(this, _BaseTabs_instances, "m", _BaseTabs_updateAccessibility).call(this);
154
- __classPrivateFieldGet(this, _BaseTabs_instances, "m", _BaseTabs_firstLastClasses).call(this);
155
- this.activeIndex = __classPrivateFieldGet(this, _BaseTabs_allTabs, "f").findIndex(tab => tab.active);
156
- __classPrivateFieldGet(this, _BaseTabs_tabindex, "f").setActiveItem(__classPrivateFieldGet(this, _BaseTabs_instances, "a", _BaseTabs_activeTab_get));
157
- __classPrivateFieldGet(this, _BaseTabs_overflow, "f").init(this.tabList, __classPrivateFieldGet(this, _BaseTabs_allTabs, "f"));
158
- }
159
- }, _BaseTabs_updateAccessibility = function _BaseTabs_updateAccessibility() {
160
- __classPrivateFieldGet(this, _BaseTabs_allTabs, "f").forEach((tab, index) => {
161
- const panel = __classPrivateFieldGet(this, _BaseTabs_allPanels, "f")[index];
162
- if (!panel.hasAttribute('aria-labelledby')) {
163
- panel.setAttribute('aria-labelledby', tab.id);
164
- }
165
- tab.setAttribute('aria-controls', panel.id);
166
- });
167
- }, _BaseTabs_deactivateExcept = function _BaseTabs_deactivateExcept(index) {
168
- __classPrivateFieldGet(this, _BaseTabs_allTabs, "f").forEach((tab, i) => tab.active = i === index);
169
- __classPrivateFieldGet(this, _BaseTabs_allPanels, "f").forEach((panel, i) => panel.hidden = i !== index);
170
- }, _BaseTabs_firstFocusable_get = function _BaseTabs_firstFocusable_get() {
171
- return __classPrivateFieldGet(this, _BaseTabs_tabindex, "f").firstItem;
172
- }, _BaseTabs_firstTab_get = function _BaseTabs_firstTab_get() {
173
- const [tab] = __classPrivateFieldGet(this, _BaseTabs_allTabs, "f");
174
- return tab;
175
- }, _BaseTabs_lastTab_get = function _BaseTabs_lastTab_get() {
176
- return __classPrivateFieldGet(this, _BaseTabs_allTabs, "f").at(-1);
177
- }, _BaseTabs_activeItemIndex_get = function _BaseTabs_activeItemIndex_get() {
178
- const { activeItem } = __classPrivateFieldGet(this, _BaseTabs_tabindex, "f");
179
- return __classPrivateFieldGet(this, _BaseTabs_allTabs, "f").findIndex(t => t === activeItem);
180
- }, _BaseTabs_firstLastClasses = function _BaseTabs_firstLastClasses() {
181
- __classPrivateFieldGet(this, _BaseTabs_instances, "a", _BaseTabs_firstTab_get)?.classList.add('first');
182
- __classPrivateFieldGet(this, _BaseTabs_instances, "a", _BaseTabs_lastTab_get)?.classList.add('last');
183
- }, _BaseTabs_scrollLeft = function _BaseTabs_scrollLeft() {
184
- __classPrivateFieldGet(this, _BaseTabs_overflow, "f").scrollLeft();
185
- }, _BaseTabs_scrollRight = function _BaseTabs_scrollRight() {
186
- __classPrivateFieldGet(this, _BaseTabs_overflow, "f").scrollRight();
187
- };
188
- BaseTabs.styles = [styles];
189
- /** Time in milliseconds to debounce between scroll events and updating scroll button state */
190
- BaseTabs.scrollTimeoutDelay = 0;
191
- /** Icon name to use for the scroll left button */
192
- BaseTabs.scrollIconLeft = 'angle-left';
193
- /** Icon name to use for the scroll right button */
194
- BaseTabs.scrollIconRight = 'angle-right';
195
- /** Icon set to use for the scroll buttons */
196
- BaseTabs.scrollIconSet = 'fas';
197
- _BaseTabs_instances_1 = { value: new Set() };
198
- (() => {
199
- // on resize check for overflows to add or remove scroll buttons
200
- window.addEventListener('resize', () => {
201
- for (const instance of __classPrivateFieldGet(_a, _a, "f", _BaseTabs_instances_1)) {
202
- __classPrivateFieldGet(instance, _BaseTabs_overflow, "f").onScroll();
203
- }
204
- }, { capture: false });
205
- })();
206
- __decorate([
207
- queryAssignedElements({ slot: 'tab' })
208
- ], BaseTabs.prototype, "tabs", void 0);
209
- __decorate([
210
- queryAssignedElements()
211
- ], BaseTabs.prototype, "panels", void 0);
212
- __decorate([
213
- query('[part="tabs"]')
214
- ], BaseTabs.prototype, "tabList", void 0);
215
- __decorate([
216
- property({ reflect: true, type: Boolean })
217
- ], BaseTabs.prototype, "manual", void 0);
218
- __decorate([
219
- property({ attribute: false })
220
- ], BaseTabs.prototype, "activeIndex", null);
221
- //# sourceMappingURL=BaseTabs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BaseTabs.js","sourceRoot":"","sources":["BaseTabs.ts"],"names":[],"mappings":"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","sourcesContent":["// we will remove this file for 3.0\n/* eslint-disable lit-a11y/no-aria-slot */\nimport { LitElement, html } from 'lit';\n\nimport { property } from 'lit/decorators/property.js';\nimport { query } from 'lit/decorators/query.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\n\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { RovingTabindexController } from '@patternfly/pfe-core/controllers/roving-tabindex-controller.js';\nimport { OverflowController } from '@patternfly/pfe-core/controllers/overflow-controller.js';\nimport { Logger } from '@patternfly/pfe-core/controllers/logger.js';\n\nimport { getRandomId } from '@patternfly/pfe-core/functions/random.js';\n\nimport { BaseTab, TabExpandEvent } from './BaseTab.js';\nimport { BaseTabPanel } from './BaseTabPanel.js';\n\nimport styles from './BaseTabs.css';\n\n/**\n * BaseTabs\n * @attr [label-scroll-left=\"Scroll left\"] - accessible label for the tab panel's scroll left button.\n * @attr [label-scroll-right=\"Scroll right\"] - accessible label for the tab panel's scroll right button.\n */\nexport abstract class BaseTabs extends LitElement {\n static readonly styles = [styles];\n\n static isTab(element: BaseTab): element is BaseTab {\n return element instanceof BaseTab;\n }\n\n static isPanel(element: BaseTabPanel): element is BaseTabPanel {\n return element instanceof BaseTabPanel;\n }\n\n /** Time in milliseconds to debounce between scroll events and updating scroll button state */\n protected static readonly scrollTimeoutDelay: number = 0;\n /** Icon name to use for the scroll left button */\n protected static readonly scrollIconLeft: string = 'angle-left';\n /** Icon name to use for the scroll right button */\n protected static readonly scrollIconRight: string = 'angle-right';\n /** Icon set to use for the scroll buttons */\n protected static readonly scrollIconSet: string = 'fas';\n\n static #instances = new Set<BaseTabs>();\n\n static {\n // on resize check for overflows to add or remove scroll buttons\n window.addEventListener('resize', () => {\n for (const instance of this.#instances) {\n instance.#overflow.onScroll();\n }\n }, { capture: false });\n }\n\n @queryAssignedElements({ slot: 'tab' }) private tabs!: BaseTab[];\n\n @queryAssignedElements() private panels!: BaseTabPanel[];\n\n @query('[part=\"tabs\"]') private tabList!: HTMLElement;\n\n #tabindex = new RovingTabindexController<BaseTab>(this, {\n getItems: () => this.#allTabs,\n });\n\n #overflow = new OverflowController(this);\n\n #logger = new Logger(this);\n\n #allTabs: BaseTab[] = [];\n\n #allPanels: BaseTabPanel[] = [];\n\n #activeIndex = 0;\n\n /**\n * Tab activation\n * Tabs can be either [automatic](https://w3c.github.io/aria-practices/examples/tabs/tabs-automatic.html) activated\n * or [manual](https://w3c.github.io/aria-practices/examples/tabs/tabs-manual.html)\n */\n @property({ reflect: true, type: Boolean }) manual = false;\n\n @property({ attribute: false })\n get activeIndex() {\n return this.#activeIndex;\n }\n\n set activeIndex(index: number) {\n const oldIndex = this.activeIndex;\n const tab = this.#allTabs[index];\n if (tab) {\n if (tab.disabled) {\n this.#logger.warn(`Disabled tabs can not be active, setting first focusable tab to active`);\n this.#tabindex.setActiveItem(this.#firstFocusable);\n index = this.#activeItemIndex;\n return;\n } else {\n tab.active = true;\n }\n }\n\n if (index === -1) {\n this.#logger.warn(`No active tab found, setting first focusable tab to active`);\n this.#tabindex.setActiveItem(this.#tabindex.firstItem);\n index = this.#activeItemIndex;\n } else {\n this.#tabindex.setActiveItem(tab);\n }\n this.#activeIndex = index;\n this.requestUpdate('activeIndex', oldIndex);\n\n this.#allPanels[this.#activeIndex].hidden = false;\n // close all tabs that are not the activeIndex\n this.#deactivateExcept(this.#activeIndex);\n }\n\n get #activeTab() {\n const [tab] = this.#allTabs.filter(tab => tab.active);\n return tab;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.id ||= getRandomId(this.localName);\n this.addEventListener('expand', this.#onTabExpand);\n BaseTabs.#instances.add(this);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n BaseTabs.#instances.delete(this);\n }\n\n override willUpdate(): void {\n const { activeItem } = this.#tabindex;\n // If RTI has an activeItem, update the roving tabindex controller\n if (!this.manual\n && activeItem\n && activeItem !== this.#activeTab\n && activeItem.ariaDisabled !== 'true') {\n activeItem.active = true;\n }\n }\n\n async firstUpdated() {\n this.tabList.addEventListener('scroll', this.#overflow.onScroll.bind(this));\n }\n\n override render() {\n const { scrollIconSet, scrollIconLeft, scrollIconRight } = this.constructor as typeof BaseTabs;\n return html`\n <div part=\"container\" class=\"${classMap({ overflow: this.#overflow.showScrollButtons })}\">\n <div part=\"tabs-container\">${!this.#overflow.showScrollButtons ? '' : html`\n <button id=\"previousTab\" tabindex=\"-1\"\n aria-label=\"${this.getAttribute('label-scroll-left') ?? 'Scroll left'}\"\n ?disabled=\"${!this.#overflow.overflowLeft}\"\n @click=\"${this.#scrollLeft}\">\n <pf-icon icon=\"${scrollIconLeft}\" set=\"${scrollIconSet}\" loading=\"eager\"></pf-icon>\n </button>`}\n <slot name=\"tab\"\n part=\"tabs\"\n role=\"tablist\"\n @slotchange=\"${this.#onSlotchange}\"></slot> ${!this.#overflow.showScrollButtons ? '' : html`\n <button id=\"nextTab\" tabindex=\"-1\"\n aria-label=\"${this.getAttribute('label-scroll-right') ?? 'Scroll right'}\"\n ?disabled=\"${!this.#overflow.overflowRight}\"\n @click=\"${this.#scrollRight}\">\n <pf-icon icon=\"${scrollIconRight}\" set=\"${scrollIconSet}\" loading=\"eager\"></pf-icon>\n </button>`}\n </div>\n <slot part=\"panels\" @slotchange=\"${this.#onSlotchange}\"></slot>\n </div>\n `;\n }\n\n #onSlotchange(event: { target: { name: string } }) {\n if (event.target.name === 'tab') {\n this.#allTabs = this.tabs.filter(tab => (this.constructor as typeof BaseTabs).isTab(tab));\n } else {\n this.#allPanels = this.panels\n .filter(panel => (this.constructor as typeof BaseTabs).isPanel(panel));\n }\n this.#tabindex.updateItems();\n\n if ((this.#allTabs.length === this.#allPanels.length)\n && (this.#allTabs.length !== 0 || this.#allPanels.length !== 0)) {\n this.#updateAccessibility();\n this.#firstLastClasses();\n this.activeIndex = this.#allTabs.findIndex(tab => tab.active);\n this.#tabindex.setActiveItem(this.#activeTab);\n this.#overflow.init(this.tabList, this.#allTabs);\n }\n }\n\n #updateAccessibility(): void {\n this.#allTabs.forEach((tab, index) => {\n const panel = this.#allPanels[index];\n if (!panel.hasAttribute('aria-labelledby')) {\n panel.setAttribute('aria-labelledby', tab.id);\n }\n tab.setAttribute('aria-controls', panel.id);\n });\n }\n\n #onTabExpand = (event: Event): void => {\n if (!(event instanceof TabExpandEvent)\n || !this.#allTabs.length\n || !this.#allPanels.length) {\n return;\n }\n\n if (event.active) {\n this.activeIndex = this.#allTabs.findIndex(tab => tab === event.tab);\n }\n };\n\n #deactivateExcept(index: number) {\n this.#allTabs.forEach((tab, i) => tab.active = i === index);\n this.#allPanels.forEach((panel, i) => panel.hidden = i !== index);\n }\n\n get #firstFocusable(): BaseTab | undefined {\n return this.#tabindex.firstItem;\n }\n\n get #firstTab(): BaseTab | undefined {\n const [tab] = this.#allTabs;\n return tab;\n }\n\n get #lastTab(): BaseTab | undefined {\n return this.#allTabs.at(-1);\n }\n\n get #activeItemIndex() {\n const { activeItem } = this.#tabindex;\n return this.#allTabs.findIndex(t => t === activeItem);\n }\n\n #firstLastClasses() {\n this.#firstTab?.classList.add('first');\n this.#lastTab?.classList.add('last');\n }\n\n #scrollLeft() {\n this.#overflow.scrollLeft();\n }\n\n #scrollRight() {\n this.#overflow.scrollRight();\n }\n}\n"]}
@@ -1,13 +0,0 @@
1
- import { LitElement } from 'lit';
2
- /**
3
- * @slot icon - Icon expects a `<pf-icon>` or `<svg>`
4
- * @slot title - the title of the tile should be a heading
5
- * @slot - The content should be a paragraph
6
- *
7
- * @csspart icon - container for the icon
8
- * @csspart title - container for the title
9
- * @csspart body - container for the body content
10
- */
11
- export declare abstract class BaseTile extends LitElement {
12
- render(): import("lit-html").TemplateResult<1>;
13
- }
@@ -1,28 +0,0 @@
1
- import { LitElement, html } from 'lit';
2
- /**
3
- * @slot icon - Icon expects a `<pf-icon>` or `<svg>`
4
- * @slot title - the title of the tile should be a heading
5
- * @slot - The content should be a paragraph
6
- *
7
- * @csspart icon - container for the icon
8
- * @csspart title - container for the title
9
- * @csspart body - container for the body content
10
- */
11
- export class BaseTile extends LitElement {
12
- render() {
13
- return html `
14
- <div part="header">
15
- <div part="icon">
16
- <slot id="icon" name="icon"></slot>
17
- </div>
18
- <div part="title">
19
- <slot id="title" name="title"></slot>
20
- </div>
21
- </div>
22
- <div part="body">
23
- <slot id="body"></slot>
24
- </div>
25
- `;
26
- }
27
- }
28
- //# sourceMappingURL=BaseTile.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BaseTile.js","sourceRoot":"","sources":["BaseTile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAGvC;;;;;;;;GAQG;AACH,MAAM,OAAgB,QAAS,SAAQ,UAAU;IACtC,MAAM;QACb,OAAO,IAAI,CAAA;;;;;;;;;;;;KAYV,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { LitElement, html } from 'lit';\n\n\n/**\n * @slot icon - Icon expects a `<pf-icon>` or `<svg>`\n * @slot title - the title of the tile should be a heading\n * @slot - The content should be a paragraph\n *\n * @csspart icon - container for the icon\n * @csspart title - container for the title\n * @csspart body - container for the body content\n */\nexport abstract class BaseTile extends LitElement {\n override render() {\n return html`\n <div part=\"header\">\n <div part=\"icon\">\n <slot id=\"icon\" name=\"icon\"></slot>\n </div>\n <div part=\"title\">\n <slot id=\"title\" name=\"title\"></slot>\n </div>\n </div>\n <div part=\"body\">\n <slot id=\"body\"></slot>\n </div>\n `;\n }\n}\n"]}
@@ -1,70 +0,0 @@
1
- :host {
2
- display: inline;
3
- }
4
-
5
-
6
- #container {
7
- display: inline-flex;
8
- position: relative;
9
- max-width: 100%;
10
- --_floating-arrow-size: 0.5rem;
11
- }
12
-
13
- #tooltip,
14
- #tooltip::after {
15
- position: absolute;
16
- }
17
-
18
- #tooltip {
19
- display: block;
20
- opacity: 0;
21
- pointer-events: none;
22
- z-index: 10000;
23
- transition: opacity 300ms cubic-bezier(0.54, 1.5, 0.38, 1.11) 0s;
24
- text-align: center;
25
- word-break: break-word;
26
- translate: var(--_floating-content-translate);
27
- max-width: calc(100vw - 10px);
28
- width: max-content;
29
- top: 0;
30
- left: 0;
31
- will-change: opacity;
32
- }
33
-
34
- #tooltip::after {
35
- display: block;
36
- content: '';
37
- rotate: 45deg;
38
- width: var(--_floating-arrow-size);
39
- height: var(--_floating-arrow-size);
40
- will-change: left top right bottom;
41
- }
42
-
43
- .open #tooltip {
44
- opacity: 1;
45
- }
46
-
47
- /* LEFT */
48
- .left #tooltip::after { right: calc(-0.5 * var(--_floating-arrow-size)); }
49
- .left.center #tooltip::after { top: calc(50% - 0.5 * var(--_floating-arrow-size)); }
50
- .left.start #tooltip::after { top: var(--_floating-arrow-size); }
51
- .left.end #tooltip::after { bottom: var(--_floating-arrow-size); }
52
-
53
- /* TOP */
54
- .top #tooltip::after { top: calc(100% - 0.5 * var(--_floating-arrow-size)); }
55
- .top.center #tooltip::after { right: calc(50% - 0.5 * var(--_floating-arrow-size)); }
56
- .top.start #tooltip::after { left: var(--_floating-arrow-size); }
57
- .top.end #tooltip::after { right: var(--_floating-arrow-size); }
58
-
59
- /* RIGHT */
60
- .right #tooltip::after { right: calc(100% - 0.5 * var(--_floating-arrow-size)); }
61
- .right.center #tooltip::after { top: calc(50% - 0.5 * var(--_floating-arrow-size)); }
62
- .right.start #tooltip::after { top: var(--_floating-arrow-size); }
63
- .right.end #tooltip::after { bottom: var(--_floating-arrow-size); }
64
-
65
- /* BOTTOM */
66
- .bottom #tooltip::after { bottom: calc(100% - 0.5 * var(--_floating-arrow-size)); }
67
- .bottom.center #tooltip::after { right: calc(50% - 0.5 * var(--_floating-arrow-size)); }
68
- .bottom.start #tooltip::after { left: var(--_floating-arrow-size); }
69
- .bottom.end #tooltip::after { right: var(--_floating-arrow-size); }
70
-
@@ -1,16 +0,0 @@
1
- import type { Placement } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';
2
- import { LitElement } from 'lit';
3
- /**
4
- * @deprecated - Will be removed in the next major version. Use FloatingDOMController
5
- */
6
- export declare abstract class BaseTooltip extends LitElement {
7
- #private;
8
- static readonly styles: CSSStyleSheet[];
9
- abstract content?: string;
10
- /** The position of the tooltip, relative to the invoking content */
11
- abstract position?: Placement;
12
- connectedCallback(): void;
13
- show(): Promise<void>;
14
- hide(): Promise<void>;
15
- render(): import("lit-html").TemplateResult<1>;
16
- }
@@ -1,54 +0,0 @@
1
- var _BaseTooltip_float;
2
- import { __classPrivateFieldGet } from "tslib";
3
- import { LitElement, html } from 'lit';
4
- import { classMap } from 'lit/directives/class-map.js';
5
- import { styleMap } from 'lit/directives/style-map.js';
6
- import { FloatingDOMController } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';
7
- import { css } from "lit";
8
- const style = css `:host {\n display: inline;\n}\n\n\n#container {\n display: inline-flex;\n position: relative;\n max-width: 100%;\n --_floating-arrow-size: 0.5rem;\n}\n\n#tooltip,\n#tooltip::after {\n position: absolute;\n}\n\n#tooltip {\n display: block;\n opacity: 0;\n pointer-events: none;\n z-index: 10000;\n transition: opacity 300ms cubic-bezier(0.54, 1.5, 0.38, 1.11) 0s;\n text-align: center;\n word-break: break-word;\n translate: var(--_floating-content-translate);\n max-width: calc(100vw - 10px);\n width: max-content;\n top: 0;\n left: 0;\n will-change: opacity;\n}\n\n#tooltip::after {\n display: block;\n content: '';\n rotate: 45deg;\n width: var(--_floating-arrow-size);\n height: var(--_floating-arrow-size);\n will-change: left top right bottom;\n}\n\n.open #tooltip {\n opacity: 1;\n}\n\n/* LEFT */\n.left #tooltip::after { right: calc(-0.5 * var(--_floating-arrow-size)); }\n.left.center #tooltip::after { top: calc(50% - 0.5 * var(--_floating-arrow-size)); }\n.left.start #tooltip::after { top: var(--_floating-arrow-size); }\n.left.end #tooltip::after { bottom: var(--_floating-arrow-size); }\n\n/* TOP */\n.top #tooltip::after { top: calc(100% - 0.5 * var(--_floating-arrow-size)); }\n.top.center #tooltip::after { right: calc(50% - 0.5 * var(--_floating-arrow-size)); }\n.top.start #tooltip::after { left: var(--_floating-arrow-size); }\n.top.end #tooltip::after { right: var(--_floating-arrow-size); }\n\n/* RIGHT */\n.right #tooltip::after { right: calc(100% - 0.5 * var(--_floating-arrow-size)); }\n.right.center #tooltip::after { top: calc(50% - 0.5 * var(--_floating-arrow-size)); }\n.right.start #tooltip::after { top: var(--_floating-arrow-size); }\n.right.end #tooltip::after { bottom: var(--_floating-arrow-size); }\n\n/* BOTTOM */\n.bottom #tooltip::after { bottom: calc(100% - 0.5 * var(--_floating-arrow-size)); }\n.bottom.center #tooltip::after { right: calc(50% - 0.5 * var(--_floating-arrow-size)); }\n.bottom.start #tooltip::after { left: var(--_floating-arrow-size); }\n.bottom.end #tooltip::after { right: var(--_floating-arrow-size); }\n\n`;
9
- const enterEvents = ['focusin', 'tap', 'click', 'mouseenter'];
10
- const exitEvents = ['focusout', 'blur', 'mouseleave'];
11
- /**
12
- * @deprecated - Will be removed in the next major version. Use FloatingDOMController
13
- */
14
- export class BaseTooltip extends LitElement {
15
- constructor() {
16
- super(...arguments);
17
- _BaseTooltip_float.set(this, new FloatingDOMController(this, {
18
- content: () => this.shadowRoot?.querySelector('#tooltip'),
19
- }));
20
- }
21
- connectedCallback() {
22
- super.connectedCallback();
23
- enterEvents.forEach(evt => this.addEventListener(evt, this.show));
24
- exitEvents.forEach(evt => this.addEventListener(evt, this.hide));
25
- }
26
- async show() {
27
- await this.updateComplete;
28
- const placement = this.position;
29
- const offset = !placement?.match(/top|bottom/) ? 15
30
- : { mainAxis: 15, alignmentAxis: -4 };
31
- await __classPrivateFieldGet(this, _BaseTooltip_float, "f").show({ offset, placement });
32
- }
33
- async hide() {
34
- await __classPrivateFieldGet(this, _BaseTooltip_float, "f").hide();
35
- }
36
- render() {
37
- const { alignment, anchor, open, styles } = __classPrivateFieldGet(this, _BaseTooltip_float, "f");
38
- return html `
39
- <div id="container"
40
- style="${styleMap(styles)}"
41
- class="${classMap({ open,
42
- [anchor]: !!anchor,
43
- [alignment]: !!alignment })}">
44
- <slot id="invoker" role="tooltip" aria-labelledby="tooltip"></slot>
45
- <slot id="tooltip"
46
- name="content"
47
- aria-hidden="${String(!open)}">${this.content}</slot>
48
- </div>
49
- `;
50
- }
51
- }
52
- _BaseTooltip_float = new WeakMap();
53
- BaseTooltip.styles = [style];
54
- //# sourceMappingURL=BaseTooltip.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BaseTooltip.js","sourceRoot":"","sources":["BaseTooltip.ts"],"names":[],"mappings":";;AAIA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,qBAAqB,EAAE,MAAM,6DAA6D,CAAC;;;AAIpG,MAAM,WAAW,GAAG,CAAC,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,CAAC,CAAC;AAC9D,MAAM,UAAU,GAAG,CAAC,UAAU,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC;AAEtD;;GAEG;AACH,MAAM,OAAgB,WAAY,SAAQ,UAAU;IAApD;;QAQE,6BAAS,IAAI,qBAAqB,CAAC,IAAI,EAAE;YACvC,OAAO,EAAE,GAAmC,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,UAAU,CAAC;SAC1F,CAAC,EAAC;IAqCL,CAAC;IAnCU,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAClE,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IACnE,CAAC;IAED,KAAK,CAAC,IAAI;QACR,MAAM,IAAI,CAAC,cAAc,CAAC;QAC1B,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC;QAChC,MAAM,MAAM,GACR,CAAC,SAAS,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,EAAE;YACtC,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,aAAa,EAAE,CAAC,CAAC,EAAE,CAAC;QACxC,MAAM,uBAAA,IAAI,0BAAO,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC;IAChD,CAAC;IAED,KAAK,CAAC,IAAI;QACR,MAAM,uBAAA,IAAI,0BAAO,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;IAEQ,MAAM;QACb,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,uBAAA,IAAI,0BAAO,CAAC;QAExD,OAAO,IAAI,CAAA;;oBAEK,QAAQ,CAAC,MAAM,CAAC;oBAChB,QAAQ,CAAC,EAAE,IAAI;YACJ,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM;YAClB,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,SAAS,EAAE,CAAC;;;;6BAI7B,MAAM,CAAC,CAAC,IAAI,CAAqB,KAAK,IAAI,CAAC,OAAO;;KAE1E,CAAC;IACJ,CAAC;;;AA7Ce,kBAAM,GAAG,CAAC,KAAK,CAAC,AAAV,CAAW","sourcesContent":["// we will remove this file in #2628\n/* eslint-disable lit-a11y/no-aria-slot */\nimport type { Placement } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\n\nimport { LitElement, html } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styleMap } from 'lit/directives/style-map.js';\n\nimport { FloatingDOMController } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\n\nimport style from './BaseTooltip.css';\n\nconst enterEvents = ['focusin', 'tap', 'click', 'mouseenter'];\nconst exitEvents = ['focusout', 'blur', 'mouseleave'];\n\n/**\n * @deprecated - Will be removed in the next major version. Use FloatingDOMController\n */\nexport abstract class BaseTooltip extends LitElement {\n static readonly styles = [style];\n\n abstract content?: string;\n\n /** The position of the tooltip, relative to the invoking content */\n abstract position?: Placement;\n\n #float = new FloatingDOMController(this, {\n content: (): HTMLElement | undefined | null => this.shadowRoot?.querySelector('#tooltip'),\n });\n\n override connectedCallback(): void {\n super.connectedCallback();\n enterEvents.forEach(evt => this.addEventListener(evt, this.show));\n exitEvents.forEach(evt => this.addEventListener(evt, this.hide));\n }\n\n async show() {\n await this.updateComplete;\n const placement = this.position;\n const offset =\n !placement?.match(/top|bottom/) ? 15\n : { mainAxis: 15, alignmentAxis: -4 };\n await this.#float.show({ offset, placement });\n }\n\n async hide() {\n await this.#float.hide();\n }\n\n override render() {\n const { alignment, anchor, open, styles } = this.#float;\n\n return html`\n <div id=\"container\"\n style=\"${styleMap(styles)}\"\n class=\"${classMap({ open,\n [anchor]: !!anchor,\n [alignment]: !!alignment })}\">\n <slot id=\"invoker\" role=\"tooltip\" aria-labelledby=\"tooltip\"></slot>\n <slot id=\"tooltip\"\n name=\"content\"\n aria-hidden=\"${String(!open) as 'true' | 'false'}\">${this.content}</slot>\n </div>\n `;\n }\n}\n"]}