npm - @patternfly/react-core - Versions diffs - 5.0.0-alpha.103 → 5.0.0-alpha.105 - Mend

@patternfly/react-core 5.0.0-alpha.103 → 5.0.0-alpha.105

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 (338) hide show

package/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap CHANGED Viewed

@@ -84,60 +84,68 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
             class="pf-v5-c-input-group"
           >
             <div
-              class="pf-v5-c-text-input-group"
+              class="pf-v5-c-input-group__item pf-m-fill"
             >
               <div
-                class="pf-v5-c-text-input-group__main pf-m-icon"
+                class="pf-v5-c-text-input-group"
               >
-                <span
-                  class="pf-v5-c-text-input-group__text"
+                <div
+                  class="pf-v5-c-text-input-group__main pf-m-icon"
                 >
                   <span
-                    class="pf-v5-c-text-input-group__icon"
+                    class="pf-v5-c-text-input-group__text"
                   >
-                    <svg
-                      aria-hidden="true"
-                      class="pf-v5-svg"
-                      fill="currentColor"
-                      role="img"
-                      viewBox="0 0 512 512"
+                    <span
+                      class="pf-v5-c-text-input-group__icon"
                     >
-                      <path
-                        d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
-                      />
-                    </svg>
+                      <svg
+                        aria-hidden="true"
+                        class="pf-v5-svg"
+                        fill="currentColor"
+                        role="img"
+                        viewBox="0 0 512 512"
+                      >
+                        <path
+                          d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
+                        />
+                      </svg>
+                    </span>
+                    <input
+                      aria-label="Search input"
+                      class="pf-v5-c-text-input-group__text-input"
+                      placeholder="Search"
+                      type="text"
+                      value=""
+                    />
                   </span>
-                  <input
-                    aria-label="Search input"
-                    class="pf-v5-c-text-input-group__text-input"
-                    placeholder="Search"
-                    type="text"
-                    value=""
-                  />
-                </span>
+                </div>
               </div>
             </div>
-            <button
-              aria-disabled="false"
-              aria-label="Search menu items"
-              class="pf-v5-c-button pf-m-control"
-              data-ouia-component-id="OUIA-Generated-Button-control-1"
-              data-ouia-component-type="PF4/Button"
-              data-ouia-safe="true"
-              type="submit"
+            <div
+              class="pf-v5-c-input-group__item pf-m-plain"
             >
-              <svg
-                aria-hidden="true"
-                class="pf-v5-svg"
-                fill="currentColor"
-                role="img"
-                viewBox="0 0 448 512"
+              <button
+                aria-disabled="false"
+                aria-label="Search menu items"
+                class="pf-v5-c-button pf-m-control"
+                data-ouia-component-id="OUIA-Generated-Button-control-1"
+                data-ouia-component-type="PF4/Button"
+                data-ouia-safe="true"
+                type="submit"
               >
-                <path
-                  d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"
-                />
-              </svg>
-            </button>
+                <svg
+                  aria-hidden="true"
+                  class="pf-v5-svg"
+                  fill="currentColor"
+                  role="img"
+                  viewBox="0 0 448 512"
+                >
+                  <path
+                    d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
         <ul
@@ -247,60 +255,68 @@ exports[`ContextSelector Renders in strict mode 1`] = `
             class="pf-v5-c-input-group"
           >
             <div
-              class="pf-v5-c-text-input-group"
+              class="pf-v5-c-input-group__item pf-m-fill"
             >
               <div
-                class="pf-v5-c-text-input-group__main pf-m-icon"
+                class="pf-v5-c-text-input-group"
               >
-                <span
-                  class="pf-v5-c-text-input-group__text"
+                <div
+                  class="pf-v5-c-text-input-group__main pf-m-icon"
                 >
                   <span
-                    class="pf-v5-c-text-input-group__icon"
+                    class="pf-v5-c-text-input-group__text"
                   >
-                    <svg
-                      aria-hidden="true"
-                      class="pf-v5-svg"
-                      fill="currentColor"
-                      role="img"
-                      viewBox="0 0 512 512"
+                    <span
+                      class="pf-v5-c-text-input-group__icon"
                     >
-                      <path
-                        d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
-                      />
-                    </svg>
+                      <svg
+                        aria-hidden="true"
+                        class="pf-v5-svg"
+                        fill="currentColor"
+                        role="img"
+                        viewBox="0 0 512 512"
+                      >
+                        <path
+                          d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
+                        />
+                      </svg>
+                    </span>
+                    <input
+                      aria-label="Search input"
+                      class="pf-v5-c-text-input-group__text-input"
+                      placeholder="Search"
+                      type="text"
+                      value=""
+                    />
                   </span>
-                  <input
-                    aria-label="Search input"
-                    class="pf-v5-c-text-input-group__text-input"
-                    placeholder="Search"
-                    type="text"
-                    value=""
-                  />
-                </span>
+                </div>
               </div>
             </div>
-            <button
-              aria-disabled="false"
-              aria-label="Search menu items"
-              class="pf-v5-c-button pf-m-control"
-              data-ouia-component-id="OUIA-Generated-Button-control-3"
-              data-ouia-component-type="PF4/Button"
-              data-ouia-safe="true"
-              type="submit"
+            <div
+              class="pf-v5-c-input-group__item pf-m-plain"
             >
-              <svg
-                aria-hidden="true"
-                class="pf-v5-svg"
-                fill="currentColor"
-                role="img"
-                viewBox="0 0 448 512"
+              <button
+                aria-disabled="false"
+                aria-label="Search menu items"
+                class="pf-v5-c-button pf-m-control"
+                data-ouia-component-id="OUIA-Generated-Button-control-3"
+                data-ouia-component-type="PF4/Button"
+                data-ouia-safe="true"
+                type="submit"
               >
-                <path
-                  d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"
-                />
-              </svg>
-            </button>
+                <svg
+                  aria-hidden="true"
+                  class="pf-v5-svg"
+                  fill="currentColor"
+                  role="img"
+                  viewBox="0 0 448 512"
+                >
+                  <path
+                    d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
         <ul

package/src/deprecated/components/Wizard/WizardHeader.tsx CHANGED Viewed

@@ -2,7 +2,6 @@ import * as React from 'react';
 import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
 import { css } from '@patternfly/react-styles';
 import { Button } from '../../../components/Button';
-import { Title } from '../../../components/Title';
 import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
 export interface WizardHeaderProps {
@@ -31,18 +30,20 @@ export const WizardHeader: React.FunctionComponent<WizardHeaderProps> = ({
   hideClose,
   closeButtonAriaLabel,
   titleId,
-  descriptionComponent: Component = 'p',
+  descriptionComponent: Component = 'div',
   descriptionId
 }: WizardHeaderProps) => (
   <div className={css(styles.wizardHeader)}>
     {!hideClose && (
-      <Button variant="plain" className={css(styles.wizardClose)} aria-label={closeButtonAriaLabel} onClick={onClose}>
-        <TimesIcon aria-hidden="true" />
-      </Button>
+      <div className={css(styles.wizardClose)}>
+        <Button variant="plain" aria-label={closeButtonAriaLabel} onClick={onClose}>
+          <TimesIcon aria-hidden="true" />
+        </Button>
+      </div>
     )}
-    <Title headingLevel="h2" size="3xl" className={css(styles.wizardTitle)} aria-label={title} id={titleId}>
-      {title || <>&nbsp;</>}
-    </Title>
+    <div className={css(styles.wizardTitle)}>
+      <h2 className={css(styles.wizardTitleText)} id={titleId}>{title || <>&nbsp;</>}</h2>
+    </div>
     {description && (
       <Component className={css(styles.wizardDescription)} id={descriptionId}>
         {description}

package/src/deprecated/components/Wizard/__tests__/Generated/__snapshots__/WizardHeader.test.tsx.snap CHANGED Viewed

@@ -5,24 +5,24 @@ exports[`WizardHeader should match snapshot (auto-generated) 1`] = `
   <div
     class="pf-v5-c-wizard__header"
   >
-    <h2
-      aria-label="string"
-      class="pf-v5-c-title pf-m-3xl pf-v5-c-wizard__title"
-      data-ouia-component-id="OUIA-Generated-Title-1"
-      data-ouia-component-type="PF4/Title"
-      data-ouia-safe="true"
-      id="string"
+    <div
+      class="pf-v5-c-wizard__title"
     >
-      string
-    </h2>
-    <p
+      <h2
+        class="pf-v5-c-wizard__title-text"
+        id="string"
+      >
+        string
+      </h2>
+    </div>
+    <div
       class="pf-v5-c-wizard__description"
       id="string"
-    />
-    <div>
-      ReactNode
+    >
+      <div>
+        ReactNode
+      </div>
     </div>
-    <p />
   </div>
 </DocumentFragment>
 `;

package/src/deprecated/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap CHANGED Viewed

@@ -8,37 +8,41 @@ exports[`Wizard Expandable Nav Wizard should match snapshot 1`] = `
     <div
       class="pf-v5-c-wizard__header"
     >
-      <button
-        aria-disabled="false"
-        aria-label="Close"
-        class="pf-v5-c-button pf-m-plain pf-v5-c-wizard__close"
-        data-ouia-component-id="OUIA-Generated-Button-plain-2"
-        data-ouia-component-type="PF4/Button"
-        data-ouia-safe="true"
-        type="button"
+      <div
+        class="pf-v5-c-wizard__close"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v5-svg"
-          fill="currentColor"
-          role="img"
-          viewBox="0 0 352 512"
+        <button
+          aria-disabled="false"
+          aria-label="Close"
+          class="pf-v5-c-button pf-m-plain"
+          data-ouia-component-id="OUIA-Generated-Button-plain-2"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
         >
-          <path
-            d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
-          />
-        </svg>
-      </button>
-      <h2
-        aria-label="Wizard title"
-        class="pf-v5-c-title pf-m-3xl pf-v5-c-wizard__title"
-        data-ouia-component-id="OUIA-Generated-Title-2"
-        data-ouia-component-type="PF4/Title"
-        data-ouia-safe="true"
-        id="pf-wizard-title-1"
+          <svg
+            aria-hidden="true"
+            class="pf-v5-svg"
+            fill="currentColor"
+            role="img"
+            viewBox="0 0 352 512"
+          >
+            <path
+              d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
+            />
+          </svg>
+        </button>
+      </div>
+      <div
+        class="pf-v5-c-wizard__title"
       >
-        Wizard title
-      </h2>
+        <h2
+          class="pf-v5-c-wizard__title-text"
+          id="pf-wizard-title-1"
+        >
+          Wizard title
+        </h2>
+      </div>
       <p
         class="pf-v5-c-wizard__description"
         id="pf-wizard-description-1"
@@ -277,37 +281,41 @@ exports[`Wizard Wizard should match snapshot 1`] = `
     <div
       class="pf-v5-c-wizard__header"
     >
-      <button
-        aria-disabled="false"
-        aria-label="Close"
-        class="pf-v5-c-button pf-m-plain pf-v5-c-wizard__close"
-        data-ouia-component-id="OUIA-Generated-Button-plain-1"
-        data-ouia-component-type="PF4/Button"
-        data-ouia-safe="true"
-        type="button"
+      <div
+        class="pf-v5-c-wizard__close"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v5-svg"
-          fill="currentColor"
-          role="img"
-          viewBox="0 0 352 512"
+        <button
+          aria-disabled="false"
+          aria-label="Close"
+          class="pf-v5-c-button pf-m-plain"
+          data-ouia-component-id="OUIA-Generated-Button-plain-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
         >
-          <path
-            d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
-          />
-        </svg>
-      </button>
-      <h2
-        aria-label="Wizard title"
-        class="pf-v5-c-title pf-m-3xl pf-v5-c-wizard__title"
-        data-ouia-component-id="OUIA-Generated-Title-1"
-        data-ouia-component-type="PF4/Title"
-        data-ouia-safe="true"
-        id="pf-wizard-title-0"
+          <svg
+            aria-hidden="true"
+            class="pf-v5-svg"
+            fill="currentColor"
+            role="img"
+            viewBox="0 0 352 512"
+          >
+            <path
+              d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
+            />
+          </svg>
+        </button>
+      </div>
+      <div
+        class="pf-v5-c-wizard__title"
       >
-        Wizard title
-      </h2>
+        <h2
+          class="pf-v5-c-wizard__title-text"
+          id="pf-wizard-title-0"
+        >
+          Wizard title
+        </h2>
+      </div>
       <p
         class="pf-v5-c-wizard__description"
         id="pf-wizard-description-0"