From c0d55a8f00680cff13b406740cc41389aec1f499 Mon Sep 17 00:00:00 2001
From: mcoker <mcoker@redhat.com>
Date: Mon, 11 Sep 2023 19:14:56 -0500
Subject: [PATCH 1/3] fix(search-input): mirror search icon in rtl, fix double
 border

---
 .../components/SearchInput/SearchInput.tsx    |  4 ++--
 .../__snapshots__/SearchInput.test.tsx.snap   | 20 +++++++++----------
 .../ContextSelector.test.tsx.snap             |  8 ++++----
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/packages/react-core/src/components/SearchInput/SearchInput.tsx b/packages/react-core/src/components/SearchInput/SearchInput.tsx
index 1381199ee68..c1531cfb799 100644
--- a/packages/react-core/src/components/SearchInput/SearchInput.tsx
+++ b/packages/react-core/src/components/SearchInput/SearchInput.tsx
@@ -375,7 +375,7 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
         </InputGroupItem>
       )}
       {!!onSearch && (
-        <InputGroupItem isPlain>
+        <InputGroupItem>
           <Button
             type="submit"
             variant={ButtonVariant.control}
@@ -383,7 +383,7 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
             onClick={onSearchHandler}
             isDisabled={isDisabled}
           >
-            <ArrowRightIcon />
+            <ArrowRightIcon className="pf-v5-m-mirror-inline-rtl" />
           </Button>
         </InputGroupItem>
       )}
diff --git a/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap b/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap
index 6fdbf2d2730..caf2df3968a 100644
--- a/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap
+++ b/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap
@@ -103,7 +103,7 @@ exports[`SearchInput advanced search 1`] = `
         </button>
       </div>
       <div
-        class="pf-v5-c-input-group__item pf-m-plain"
+        class="pf-v5-c-input-group__item"
       >
         <button
           aria-disabled="false"
@@ -116,7 +116,7 @@ exports[`SearchInput advanced search 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="pf-v5-svg"
+            class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
             fill="currentColor"
             height="1em"
             role="img"
@@ -245,7 +245,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
         </button>
       </div>
       <div
-        class="pf-v5-c-input-group__item pf-m-plain"
+        class="pf-v5-c-input-group__item"
       >
         <button
           aria-disabled="false"
@@ -258,7 +258,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="pf-v5-svg"
+            class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
             fill="currentColor"
             height="1em"
             role="img"
@@ -579,7 +579,7 @@ exports[`SearchInput renders search input in strict mode 1`] = `
         </button>
       </div>
       <div
-        class="pf-v5-c-input-group__item pf-m-plain"
+        class="pf-v5-c-input-group__item"
       >
         <button
           aria-disabled="false"
@@ -592,7 +592,7 @@ exports[`SearchInput renders search input in strict mode 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="pf-v5-svg"
+            class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
             fill="currentColor"
             height="1em"
             role="img"
@@ -746,7 +746,7 @@ exports[`SearchInput search input with hint 1`] = `
       </div>
     </div>
     <div
-      class="pf-v5-c-input-group__item pf-m-plain"
+      class="pf-v5-c-input-group__item"
     >
       <button
         aria-disabled="false"
@@ -759,7 +759,7 @@ exports[`SearchInput search input with hint 1`] = `
       >
         <svg
           aria-hidden="true"
-          class="pf-v5-svg"
+          class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
           fill="currentColor"
           height="1em"
           role="img"
@@ -898,7 +898,7 @@ exports[`SearchInput simple search input 1`] = `
       </div>
     </div>
     <div
-      class="pf-v5-c-input-group__item pf-m-plain"
+      class="pf-v5-c-input-group__item"
     >
       <button
         aria-disabled="false"
@@ -911,7 +911,7 @@ exports[`SearchInput simple search input 1`] = `
       >
         <svg
           aria-hidden="true"
-          class="pf-v5-svg"
+          class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
           fill="currentColor"
           height="1em"
           role="img"
diff --git a/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap b/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
index 5d3d4ff5b40..989bd10a339 100644
--- a/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
@@ -128,7 +128,7 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
               </div>
             </div>
             <div
-              class="pf-v5-c-input-group__item pf-m-plain"
+              class="pf-v5-c-input-group__item"
             >
               <button
                 aria-disabled="false"
@@ -141,7 +141,7 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
               >
                 <svg
                   aria-hidden="true"
-                  class="pf-v5-svg"
+                  class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
                   fill="currentColor"
                   height="1em"
                   role="img"
@@ -305,7 +305,7 @@ exports[`ContextSelector Renders in strict mode 1`] = `
               </div>
             </div>
             <div
-              class="pf-v5-c-input-group__item pf-m-plain"
+              class="pf-v5-c-input-group__item"
             >
               <button
                 aria-disabled="false"
@@ -318,7 +318,7 @@ exports[`ContextSelector Renders in strict mode 1`] = `
               >
                 <svg
                   aria-hidden="true"
-                  class="pf-v5-svg"
+                  class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
                   fill="currentColor"
                   height="1em"
                   role="img"

From 7d97320f4d2e2226ecafeeb60297a08f17421a8c Mon Sep 17 00:00:00 2001
From: mcoker <mcoker@redhat.com>
Date: Wed, 13 Sep 2023 15:26:49 -0500
Subject: [PATCH 2/3] chore: use icon component with shouldMirrorRTL

---
 .../react-core/src/components/SearchInput/SearchInput.tsx    | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/react-core/src/components/SearchInput/SearchInput.tsx b/packages/react-core/src/components/SearchInput/SearchInput.tsx
index c1531cfb799..e112e8218da 100644
--- a/packages/react-core/src/components/SearchInput/SearchInput.tsx
+++ b/packages/react-core/src/components/SearchInput/SearchInput.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { css } from '@patternfly/react-styles';
 import { Button, ButtonVariant } from '../Button';
 import { Badge } from '../Badge';
+import { Icon } from '../Icon';
 import AngleDownIcon from '@patternfly/react-icons/dist/esm/icons/angle-down-icon';
 import AngleUpIcon from '@patternfly/react-icons/dist/esm/icons/angle-up-icon';
 import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
@@ -383,7 +384,9 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
             onClick={onSearchHandler}
             isDisabled={isDisabled}
           >
-            <ArrowRightIcon className="pf-v5-m-mirror-inline-rtl" />
+            <Icon shouldMirrorRTL>
+              <ArrowRightIcon />
+            </Icon>
           </Button>
         </InputGroupItem>
       )}

From 3ed78e43129a553c72f0615b90f59a92fe500880 Mon Sep 17 00:00:00 2001
From: mcoker <mcoker@redhat.com>
Date: Thu, 14 Sep 2023 09:03:27 -0500
Subject: [PATCH 3/3] chore: snaps

---
 .../__snapshots__/SearchInput.test.tsx.snap   | 160 +++++++++++-------
 .../ContextSelector.test.tsx.snap             |  64 ++++---
 2 files changed, 140 insertions(+), 84 deletions(-)

diff --git a/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap b/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap
index caf2df3968a..24719463b95 100644
--- a/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap
+++ b/packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap
@@ -114,19 +114,27 @@ exports[`SearchInput advanced search 1`] = `
           data-ouia-safe="true"
           type="submit"
         >
-          <svg
-            aria-hidden="true"
-            class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
-            fill="currentColor"
-            height="1em"
-            role="img"
-            viewBox="0 0 448 512"
-            width="1em"
+          <span
+            class="pf-v5-c-icon"
           >
-            <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>
+            <span
+              class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
+            >
+              <svg
+                aria-hidden="true"
+                class="pf-v5-svg"
+                fill="currentColor"
+                height="1em"
+                role="img"
+                viewBox="0 0 448 512"
+                width="1em"
+              >
+                <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>
+            </span>
+          </span>
         </button>
       </div>
     </div>
@@ -256,19 +264,27 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
           data-ouia-safe="true"
           type="submit"
         >
-          <svg
-            aria-hidden="true"
-            class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
-            fill="currentColor"
-            height="1em"
-            role="img"
-            viewBox="0 0 448 512"
-            width="1em"
+          <span
+            class="pf-v5-c-icon"
           >
-            <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>
+            <span
+              class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
+            >
+              <svg
+                aria-hidden="true"
+                class="pf-v5-svg"
+                fill="currentColor"
+                height="1em"
+                role="img"
+                viewBox="0 0 448 512"
+                width="1em"
+              >
+                <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>
+            </span>
+          </span>
         </button>
       </div>
     </div>
@@ -590,19 +606,27 @@ exports[`SearchInput renders search input in strict mode 1`] = `
           data-ouia-safe="true"
           type="submit"
         >
-          <svg
-            aria-hidden="true"
-            class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
-            fill="currentColor"
-            height="1em"
-            role="img"
-            viewBox="0 0 448 512"
-            width="1em"
+          <span
+            class="pf-v5-c-icon"
           >
-            <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>
+            <span
+              class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
+            >
+              <svg
+                aria-hidden="true"
+                class="pf-v5-svg"
+                fill="currentColor"
+                height="1em"
+                role="img"
+                viewBox="0 0 448 512"
+                width="1em"
+              >
+                <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>
+            </span>
+          </span>
         </button>
       </div>
     </div>
@@ -757,19 +781,27 @@ exports[`SearchInput search input with hint 1`] = `
         data-ouia-safe="true"
         type="submit"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
-          fill="currentColor"
-          height="1em"
-          role="img"
-          viewBox="0 0 448 512"
-          width="1em"
+        <span
+          class="pf-v5-c-icon"
         >
-          <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>
+          <span
+            class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
+          >
+            <svg
+              aria-hidden="true"
+              class="pf-v5-svg"
+              fill="currentColor"
+              height="1em"
+              role="img"
+              viewBox="0 0 448 512"
+              width="1em"
+            >
+              <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>
+          </span>
+        </span>
       </button>
     </div>
   </div>
@@ -909,19 +941,27 @@ exports[`SearchInput simple search input 1`] = `
         data-ouia-safe="true"
         type="submit"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
-          fill="currentColor"
-          height="1em"
-          role="img"
-          viewBox="0 0 448 512"
-          width="1em"
+        <span
+          class="pf-v5-c-icon"
         >
-          <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>
+          <span
+            class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
+          >
+            <svg
+              aria-hidden="true"
+              class="pf-v5-svg"
+              fill="currentColor"
+              height="1em"
+              role="img"
+              viewBox="0 0 448 512"
+              width="1em"
+            >
+              <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>
+          </span>
+        </span>
       </button>
     </div>
   </div>
diff --git a/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap b/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
index 989bd10a339..9b9097fcf33 100644
--- a/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
+++ b/packages/react-core/src/deprecated/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
@@ -139,19 +139,27 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
                 data-ouia-safe="true"
                 type="submit"
               >
-                <svg
-                  aria-hidden="true"
-                  class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
-                  fill="currentColor"
-                  height="1em"
-                  role="img"
-                  viewBox="0 0 448 512"
-                  width="1em"
+                <span
+                  class="pf-v5-c-icon"
                 >
-                  <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>
+                  <span
+                    class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="pf-v5-svg"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      viewBox="0 0 448 512"
+                      width="1em"
+                    >
+                      <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>
+                  </span>
+                </span>
               </button>
             </div>
           </div>
@@ -316,19 +324,27 @@ exports[`ContextSelector Renders in strict mode 1`] = `
                 data-ouia-safe="true"
                 type="submit"
               >
-                <svg
-                  aria-hidden="true"
-                  class="pf-v5-svg pf-v5-m-mirror-inline-rtl"
-                  fill="currentColor"
-                  height="1em"
-                  role="img"
-                  viewBox="0 0 448 512"
-                  width="1em"
+                <span
+                  class="pf-v5-c-icon"
                 >
-                  <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>
+                  <span
+                    class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="pf-v5-svg"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      viewBox="0 0 448 512"
+                      width="1em"
+                    >
+                      <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>
+                  </span>
+                </span>
               </button>
             </div>
           </div>