feat(progress-steps)!: migrate pfe-progress-steps to lit

fix(progress-steps): remove erroneous count property (#1822)

chore(progress-steps): update slot definitions for docs (#1823)

Co-authored-by: Michael Potter <[email protected]>

docs(progress-steps): added pfe-progress-steps-item slots to docs (#1825)

fix(progress-steps)!: remove has_ attrs

test(progress-steps): e2e tests with page object model

docs(progress-steps): fix demo

style(progress-steps): lint

docs(progress-steps): inline docs

docs(progress-steps): refactor docs page

docs(progress-steps): add changeset

docs(progress-steps): update inline docs

Author: bennypowers

.changeset/progress-steps.md

@@ -0,0 +1,16 @@
+---
+"@patternfly/pfe-progress-steps": major
+---
+
+## 🔥 Migrate to Lit
+
+This release migrates `<pfe-progress-steps>` to LitElement.
+
+NEW: CSS Shadow Parts!
+
+### 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/progress-steps/) for more info

…e-progress-steps/src/_shared-assets.scss …s/pfe-progress-steps/_shared-assets.scsselements/pfe-progress-steps/src/_shared-assets.scss renamed to elements/pfe-progress-steps/_shared-assets.scss elements/pfe-progress-steps/src/_shared-assets.scss renamed to elements/pfe-progress-steps/_shared-assets.scss

@@ -1,10 +1,11 @@
-// Please see the pfe-sass README for guidance on using these tools
-@import "../../pfe-sass/pfe-sass";
+@use "@patternfly/patternfly/sass-utilities/all" as *;
+@use "@patternfly/pfe-sass" as *;
 
 // Example local variable, using BEM format
 // --pfe-progress-steps__region--Property: value;
 
-$LOCAL-VARIABLES: (
+@include configure(
+  $variables: (
     item: (
         size: 75px,
         // Note: this is the fallback value; these are overwritten by the JS
@@ -15,5 +16,6 @@ $LOCAL-VARIABLES: (
     circle: (
         size: pfe-var(ui--element--size), // 20px
         size--active: pfe-var(ui--element--size--md) // 32px
-    )
-);
+    ),
+  ),
+);

elements/pfe-progress-steps/custom-elements-manifest.config.js

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

elements/pfe-progress-steps/demo/demo.css

@@ -0,0 +1,24 @@
+:host {
+  padding: 5em;
+}
+
+pfe-progress-steps+pfe-progress-steps {
+  margin-top: 2em;
+}
+
+*:is(h1, h2) {
+  margin-top: 2em;
+}
+
+/* Center */
+.pfe-l-grid.pfe-m-gutters > * {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+/* Styles for redhat.com */
+.rhdotcom {
+  --pfe-progress-steps-item__circle--color--active: #EE0000;
+  --pfe-progress-steps-item__title--Color--active: #151515;
+  --pfe-progress-steps__progress-bar--color--active: #6A6E73;
+}