feat(tabs)!: migrate pfe-tabs to lit

test(tabs): visual regression tests

docs(tabs): add CSS to demo page for tabs (#1835)

test(tabs): update snapshot

test(tabs): update test snapshot

test(tabs): e2e tests with page object model

test(tabs): build demo with optional shadowroot

docs(tabs): rearrange docs urls

docs(tabs): inline docs

docs(tabs): refactor docs page

docs(tabs): add changeset

fix(tabs): add {{version}} to element classes

docs(tabs): use pfe-styles

Co-Authored-By: Steven Spriggs <[email protected]>

feat(tabs): add CSS parts

Author: bennypowers

.changeset/tabs.md

@@ -0,0 +1,17 @@
+---
+"@patternfly/pfe-tabs": major
+---
+
+## 🔥 Migrate to Lit
+
+This release migrates `<pfe-tabs>` to LitElement.
+
+### NEW: CSS Shadow Parts!
+- Adds `tabs` and `panels` CSS parts to `<pfe-tabs>`
+- Adds `container` CSS part to `<pfe-tab-panel>`
+
+### Breaking Changes
+- Initial render is now [asynchronous](https://lit.dev/docs/components/lifecycle/#reactive-update-cycle).
+  If your code assumes that shadow DOM is ready once the element is constructed, update it to `await element.updateComplete`
+
+See [docs](https://patternflyelements.org/components/tabs/) for more info

elements/pfe-tabs/.npmignore

@@ -103,8 +103,6 @@ below, selecting "Tab 2" will update the URL as follows: `?my-tabs=tab2`.
 </pfe-tabs>
 ```
 
-*Note:* This feature is not supported in IE11.
-
 ## Using the URL to open a specific tab
 
 By default, `pfe-tabs` will read the URL and look for a query string parameter
@@ -134,8 +132,6 @@ In the event that a tab with the supplied id in the URL does not exist,
 `pfe-tabs` will fall back to the `selected-index` attribute if one is supplied
 in the markup, or the first tab if `selected-index` is not provided.
 
-*Note:* This feature is not supported in IE11.
-
 ## Events
 
 ### pfe-tabs:shown-tab
@@ -183,7 +179,7 @@ Fires when a selected tab is no longer the selected tab. The `event.detail.tab`
 | `--pfe-tabs__panel--BorderRight` |  | 0 |
 | `--pfe-tabs__panel--BorderBottom` |  | 0 |
 | `--pfe-tabs__panel--BorderLeft` |  | 0 |
- 
+
 ## Test
 
     npm run test

elements/pfe-tabs/README.md

@@ -0,0 +1,5 @@
+import { pfeCustomElementsManifestConfig } from '@patternfly/pfe-tools/custom-elements-manifest.js';
+
+export default pfeCustomElementsManifestConfig({
+  globs: ['pfe-*.ts'],
+});