@patternfly/patternfly 5.0.0-alpha.2 → 5.0.0-alpha.20

package/docs/components/TextInputGroup/examples/TextInputGroup.md

@@ -34,9 +34,9 @@ cssPrefix: pf-c-text-input-group
       <input
         class="pf-c-text-input-group__text-input"
         type="text"
-        value="Disabled"
         disabled
-        aria-label="Type to filter"
+        value="Disabled"
+        aria-label="Disabled text input group example input"
       />
     </span>
   </div>
@@ -530,9 +530,9 @@ cssPrefix: pf-c-text-input-group
       </span>
       <input
         class="pf-c-text-input-group__text-input"
-        type="text"
-        value
+        type="search"
         placeholder="Find by name"
+        value
         aria-label="Type to filter"
       />
     </span>
@@ -552,9 +552,9 @@ cssPrefix: pf-c-text-input-group
       </span>
       <input
         class="pf-c-text-input-group__text-input"
-        type="text"
-        value="Joh"
+        type="search"
         placeholder="Find by name"
+        value="Joh"
         aria-label="Type to filter"
       />
     </span>
@@ -583,9 +583,9 @@ cssPrefix: pf-c-text-input-group
       </span>
       <input
         class="pf-c-text-input-group__text-input"
-        type="text"
-        value="John Doe"
+        type="search"
         placeholder="Find by name"
+        value="John Doe"
         aria-label="Type to filter"
       />
     </span>
@@ -615,9 +615,9 @@ cssPrefix: pf-c-text-input-group
       </span>
       <input
         class="pf-c-text-input-group__text-input"
-        type="text"
-        value="John Doe"
+        type="search"
         placeholder="Find by name"
+        value="John Doe"
         aria-label="Type to filter"
       />
     </span>
@@ -659,9 +659,9 @@ cssPrefix: pf-c-text-input-group
         </span>
         <input
           class="pf-c-text-input-group__text-input"
-          type="text"
-          value
+          type="search"
           placeholder="Search"
+          value
           aria-label="Type to filter"
         />
       </span>
@@ -686,9 +686,9 @@ cssPrefix: pf-c-text-input-group
         </span>
         <input
           class="pf-c-text-input-group__text-input"
-          type="text"
-          value
+          type="search"
           placeholder="Find by name"
+          value
           aria-label="Type to filter"
         />
       </span>
@@ -713,7 +713,7 @@ cssPrefix: pf-c-text-input-group
         </span>
         <input
           class="pf-c-text-input-group__text-input"
-          type="text"
+          type="search"
           value="username:root firstname:ned"
           aria-label="Type to filter"
         />
@@ -756,7 +756,7 @@ cssPrefix: pf-c-text-input-group
         </span>
         <input
           class="pf-c-text-input-group__text-input"
-          type="text"
+          type="search"
           value="username:root firstname:ned"
           aria-label="Type to filter"
         />
@@ -879,7 +879,7 @@ cssPrefix: pf-c-text-input-group
       </span>
       <input
         class="pf-c-text-input-group__text-input"
-        type="text"
+        type="search"
         value="app"
         aria-label="Type to filter"
       />
@@ -944,7 +944,7 @@ cssPrefix: pf-c-text-input-group
       </span>
       <input
         class="pf-c-text-input-group__text-input pf-m-hint"
-        type="text"
+        type="search"
         value="appleseed"
         disabled
         aria-hidden="true"
@@ -991,7 +991,7 @@ cssPrefix: pf-c-text-input-group
           </span>
           <input
             class="pf-c-text-input-group__text-input"
-            type="text"
+            type="search"
             value="username:root firstname:n"
             aria-label="Type to filter"
           />

package/docs/components/Tile/examples/Tile.md

@@ -872,21 +872,21 @@ cssPrefix: pf-c-tile
 
 ### Accessibility
 
-| Attribute       | Applied to   | Outcome                                                                               |
-| --------------- | ------------ | ------------------------------------------------------------------------------------- |
-| `tabindex="0"`  | `.pf-c-tile` | Inserts the tile into the tab order of the page so that it is focusable. **Required** |
-| `tabindex="-1"` | `.pf-c-tile` | Removes the tile from keyboard focus when it is disabled.                             |
+| Attribute | Applied to | Outcome |
+| -- | -- | -- |
+| `tabindex="0"` | `.pf-c-tile` | Inserts the tile into the tab order of the page so that it is focusable. **Required** |
+| `tabindex="-1"` | `.pf-c-tile` | Removes the tile from keyboard focus when it is disabled. |
 
 ### Usage
 
-| Class                | Applied to           | Outcome                                            |
-| -------------------- | -------------------- | -------------------------------------------------- |
-| `.pf-c-tile`         | `<div>`              | Initiates a tile. **Required**                     |
-| `.pf-c-tile__header` | `<div>`              | Initiates the tile header.                         |
-| `.pf-c-tile__title`  | `<div>`              | Initiates the tile title.                          |
-| `.pf-c-tile__icon`   | `<div>`              | Initiates the tile icon or image.                  |
-| `.pf-c-tile__body`   | `<div>`              | Initiates the tile body.                           |
-| `.pf-m-selected`     | `.pf-c-tile`         | Modifies the tile for the selected state.          |
-| `.pf-m-disabled`     | `.pf-c-tile`         | Modifies the tile for the disabled state.          |
-| `.pf-m-stacked`      | `.pf-c-tile__header` | Modifies the tile header to be stacked vertically. |
-| `.pf-m-display-lg`   | `.pf-c-tile`         | Modifies the tile to have large display styling.   |
+| Class | Applied to | Outcome |
+| -- | -- | -- |
+| `.pf-c-tile` | `<div>` | Initiates a tile. **Required**  |
+| `.pf-c-tile__header` | `<div>` | Initiates the tile header. |
+| `.pf-c-tile__title` | `<div>` | Initiates the tile title. |
+| `.pf-c-tile__icon` | `<div>` | Initiates the tile icon or image. |
+| `.pf-c-tile__body` | `<div>` | Initiates the tile body. |
+| `.pf-m-selected` | `.pf-c-tile` | Modifies the tile for the selected state. |
+| `.pf-m-disabled` | `.pf-c-tile` | Modifies the tile for the disabled state. |
+| `.pf-m-stacked` | `.pf-c-tile__header` | Modifies the tile header to be stacked vertically. |
+| `.pf-m-display-lg` | `.pf-c-tile` | Modifies the tile to have large display styling. |

package/docs/components/Timestamp/examples/Timestamp.md

@@ -55,8 +55,8 @@ cssPrefix: pf-c-timestamp
 
 ### Usage
 
-| Class                   | Applied to        | Outcome                                                |
-| ----------------------- | ----------------- | ------------------------------------------------------ |
-| `.pf-c-timestamp`       | `<span>`          | Creates a timestamp. **Required**                      |
-| `.pf-c-timestamp__text` | `<time>`          | Creates the visual text of the timestamp. **Required** |
-| `.pf-m-help-text`       | `.pf-c-timestamp` | Modifies styling for a timestamp that has help text.   |
+| Class | Applied to | Outcome |
+| -- | -- | -- |
+| `.pf-c-timestamp` | `<span>` | Creates a timestamp. **Required** |
+| `.pf-c-timestamp__text` | `<time>` | Creates the visual text of the timestamp. **Required** |
+| `.pf-m-help-text`| `.pf-c-timestamp` | Modifies styling for a timestamp that has help text. |

package/docs/components/Title/examples/Title.md

@@ -24,23 +24,23 @@ The title component styles font-size, font-weight, and line-height to titles.
 
 The content component defines margin on headers. To regain the same spacing use, spacer utility classes:
 
-| Title | Margin top    | Margin bottom |
-| ----- | ------------- | ------------- |
-| 4xl   | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
-| 3xl   | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
-| 2xl   | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
-| xl    | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
-| lg    | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
-| md    | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
+| Title | Margin top | Margin bottom |
+| -- | -- | -- |
+| 4xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
+| 3xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
+| 2xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
+| xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
+| lg | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
+| md | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
 
 ### Usage
 
-| Class         | Applied       | Outcome                                                 |
-| ------------- | ------------- | ------------------------------------------------------- |
-| `.pf-c-title` | `*`           | Initiates a title. Always use it with a modifier class. |
-| `.pf-m-4xl`   | `.pf-c-title` | Modifies for 4xl size                                   |
-| `.pf-m-3xl`   | `.pf-c-title` | Modifies for 3xl size                                   |
-| `.pf-m-2xl`   | `.pf-c-title` | Modifies for 2xl size                                   |
-| `.pf-m-xl`    | `.pf-c-title` | Modifies for xl size                                    |
-| `.pf-m-lg`    | `.pf-c-title` | Modifies for lg size                                    |
-| `.pf-m-md`    | `.pf-c-title` | Modifies for md size                                    |
+| Class | Applied | Outcome |
+| -- | -- | -- |
+| `.pf-c-title` | `*` |  Initiates a title. Always use it with a modifier class. |
+| `.pf-m-4xl` | `.pf-c-title` | Modifies for 4xl size |
+| `.pf-m-3xl` | `.pf-c-title` | Modifies for 3xl size |
+| `.pf-m-2xl` | `.pf-c-title` | Modifies for 2xl size |
+| `.pf-m-xl` | `.pf-c-title` | Modifies for xl size |
+| `.pf-m-lg` | `.pf-c-title` | Modifies for lg size |
+| `.pf-m-md` | `.pf-c-title` | Modifies for md size |

package/docs/components/ToggleGroup/examples/toggle-group.md

@@ -319,19 +319,19 @@ cssPrefix: pf-c-toggle-group
 
 ### Accessibility
 
-| Attribute                          | Applied to                   | Outcome                                                                                                                                  |
-| ---------------------------------- | ---------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
-| `aria-label="[button label text]"` | `.pf-c-toggle-group__button` | Provides an accessible name for the button when an icon is used instead of text. **Required when icon is used with no supporting text**  |
-| `disabled`                         | `.pf-c-toggle-group__button` | When a button element is used, indicates that it is unavailable and removes it from keyboard focus. **Required when button is disabled** |
+| Attribute | Applied to | Outcome |
+| -- | -- | -- |
+| `aria-label="[button label text]"` | `.pf-c-toggle-group__button` | Provides an accessible name for the button when an icon is used instead of text. **Required when icon is used with no supporting text** |
+| `disabled` | `.pf-c-toggle-group__button` | When a button element is used, indicates that it is unavailable and removes it from keyboard focus. **Required when button is disabled** |
 
 ### Usage
 
-| Class                        | Applied to                   | Outcome                                                         |
-| ---------------------------- | ---------------------------- | --------------------------------------------------------------- |
-| `.pf-c-toggle-group`         | `<div>`                      | Initiates the toggle group. **Required**                        |
-| `.pf-c-toggle-group__button` | `<button>`                   | Initiates the toggle group button. **Required**                 |
-| `.pf-c-toggle-group__item`   | `<div>`                      | Initiates the toggle group item wrapper. **Required**           |
-| `.pf-c-toggle-group__text`   | `<span>`                     | Initiates the toggle button text element.                       |
-| `.pf-c-toggle-group__icon`   | `<span>`                     | Initiates the toggle button icon element.                       |
-| `.pf-m-compact`              | `.pf-c-toggle-group`         | Modifies the toggle group for compact styles.                   |
-| `.pf-m-selected`             | `.pf-c-toggle-group__button` | Modifies the toggle button group button for the selected state. |
+| Class | Applied to | Outcome |
+| -- | -- | -- |
+| `.pf-c-toggle-group` | `<div>` | Initiates the toggle group. **Required** |
+| `.pf-c-toggle-group__button` | `<button>` | Initiates the toggle group button. **Required** |
+| `.pf-c-toggle-group__item` | `<div>` | Initiates the toggle group item wrapper. **Required** |
+| `.pf-c-toggle-group__text` | `<span>` | Initiates the toggle button text element. |
+| `.pf-c-toggle-group__icon` | `<span>` | Initiates the toggle button icon element. |
+| `.pf-m-compact` | `.pf-c-toggle-group` | Modifies the toggle group for compact styles. |
+| `.pf-m-selected` | `.pf-c-toggle-group__button` | Modifies the toggle button group button for the selected state. |