From b131361294b3a32d5ac38a27605e1af570f7ce61 Mon Sep 17 00:00:00 2001
From: Armano <armano2@users.noreply.github.com>
Date: Sun, 2 Apr 2023 13:08:28 +0200
Subject: [PATCH 1/2] fix: expose copy, success and word-wrap icons as
 standalone components

---
 .../src/theme-classic.d.ts                    | 24 +++++++++++++++++++
 .../src/theme/CodeBlock/CopyButton/index.tsx  | 10 ++++----
 .../theme/CodeBlock/WordWrapButton/index.tsx  | 11 ++-------
 .../src/theme/Icon/Copy/index.tsx             | 20 ++++++++++++++++
 .../src/theme/Icon/Success/index.tsx          | 20 ++++++++++++++++
 .../src/theme/Icon/WordWrap/index.tsx         | 20 ++++++++++++++++
 6 files changed, 90 insertions(+), 15 deletions(-)
 create mode 100644 packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx
 create mode 100644 packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx
 create mode 100644 packages/docusaurus-theme-classic/src/theme/Icon/WordWrap/index.tsx

diff --git a/packages/docusaurus-theme-classic/src/theme-classic.d.ts b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
index d3006865e8e7..7984bb35c0bc 100644
--- a/packages/docusaurus-theme-classic/src/theme-classic.d.ts
+++ b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
@@ -1431,6 +1431,14 @@ declare module '@theme/Icon/Close' {
   export default function IconClose(props: Props): JSX.Element;
 }
 
+declare module '@theme/Icon/Copy' {
+  import type {ComponentProps} from 'react';
+
+  export interface Props extends ComponentProps<'svg'> {}
+
+  export default function IconCopy(props: Props): JSX.Element;
+}
+
 declare module '@theme/Icon/Language' {
   import type {ComponentProps} from 'react';
 
@@ -1439,6 +1447,14 @@ declare module '@theme/Icon/Language' {
   export default function IconLanguage(props: Props): JSX.Element;
 }
 
+declare module '@theme/Icon/Success' {
+  import type {ComponentProps} from 'react';
+
+  export interface Props extends ComponentProps<'svg'> {}
+
+  export default function IconSuccess(props: Props): JSX.Element;
+}
+
 declare module '@theme/Icon/ExternalLink' {
   import type {ComponentProps} from 'react';
 
@@ -1447,6 +1463,14 @@ declare module '@theme/Icon/ExternalLink' {
   export default function IconExternalLink(props: Props): JSX.Element;
 }
 
+declare module '@theme/Icon/WordWrap' {
+  import type {ComponentProps} from 'react';
+
+  export interface Props extends ComponentProps<'svg'> {}
+
+  export default function IconWordWrap(props: Props): JSX.Element;
+}
+
 declare module '@theme/TagsListByLetter' {
   import type {TagsListItem} from '@docusaurus/utils';
 
diff --git a/packages/docusaurus-theme-classic/src/theme/CodeBlock/CopyButton/index.tsx b/packages/docusaurus-theme-classic/src/theme/CodeBlock/CopyButton/index.tsx
index 1c05e07a7430..9f5872e6c52f 100644
--- a/packages/docusaurus-theme-classic/src/theme/CodeBlock/CopyButton/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/CodeBlock/CopyButton/index.tsx
@@ -11,6 +11,8 @@ import clsx from 'clsx';
 import copy from 'copy-text-to-clipboard';
 import {translate} from '@docusaurus/Translate';
 import type {Props} from '@theme/CodeBlock/CopyButton';
+import IconCopy from '@theme/Icon/Copy';
+import IconSuccess from '@theme/Icon/Success';
 
 import styles from './styles.module.css';
 
@@ -56,12 +58,8 @@ export default function CopyButton({code, className}: Props): JSX.Element {
       )}
       onClick={handleCopyCode}>
       <span className={styles.copyButtonIcons} aria-hidden="true">
-        <svg className={styles.copyButtonIcon} viewBox="0 0 24 24">
-          <path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" />
-        </svg>
-        <svg className={styles.copyButtonSuccessIcon} viewBox="0 0 24 24">
-          <path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" />
-        </svg>
+        <IconCopy className={styles.copyButtonIcon} />
+        <IconSuccess className={styles.copyButtonSuccessIcon} />
       </span>
     </button>
   );
diff --git a/packages/docusaurus-theme-classic/src/theme/CodeBlock/WordWrapButton/index.tsx b/packages/docusaurus-theme-classic/src/theme/CodeBlock/WordWrapButton/index.tsx
index 9b08e4432538..0adb3d8d4b01 100644
--- a/packages/docusaurus-theme-classic/src/theme/CodeBlock/WordWrapButton/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/CodeBlock/WordWrapButton/index.tsx
@@ -9,6 +9,7 @@ import React from 'react';
 import clsx from 'clsx';
 import {translate} from '@docusaurus/Translate';
 import type {Props} from '@theme/CodeBlock/WordWrapButton';
+import IconWordWrap from '@theme/Icon/WordWrap';
 
 import styles from './styles.module.css';
 
@@ -35,15 +36,7 @@ export default function WordWrapButton({
       )}
       aria-label={title}
       title={title}>
-      <svg
-        className={styles.wordWrapButtonIcon}
-        viewBox="0 0 24 24"
-        aria-hidden="true">
-        <path
-          fill="currentColor"
-          d="M4 19h6v-2H4v2zM20 5H4v2h16V5zm-3 6H4v2h13.25c1.1 0 2 .9 2 2s-.9 2-2 2H15v-2l-3 3l3 3v-2h2c2.21 0 4-1.79 4-4s-1.79-4-4-4z"
-        />
-      </svg>
+      <IconWordWrap className={styles.wordWrapButtonIcon} aria-hidden="true" />
     </button>
   );
 }
diff --git a/packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx b/packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx
new file mode 100644
index 000000000000..f10a1cd7fd60
--- /dev/null
+++ b/packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx
@@ -0,0 +1,20 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import type {Props} from '@theme/Icon/Copy';
+
+export default function IconCopy(props: Props): JSX.Element {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"
+      />
+    </svg>
+  );
+}
diff --git a/packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx b/packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx
new file mode 100644
index 000000000000..7835294e84c2
--- /dev/null
+++ b/packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx
@@ -0,0 +1,20 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import type {Props} from '@theme/Icon/Success';
+
+export default function IconSuccess(props: Props): JSX.Element {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"
+      />
+    </svg>
+  );
+}
diff --git a/packages/docusaurus-theme-classic/src/theme/Icon/WordWrap/index.tsx b/packages/docusaurus-theme-classic/src/theme/Icon/WordWrap/index.tsx
new file mode 100644
index 000000000000..17986900c2be
--- /dev/null
+++ b/packages/docusaurus-theme-classic/src/theme/Icon/WordWrap/index.tsx
@@ -0,0 +1,20 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import type {Props} from '@theme/Icon/WordWrap';
+
+export default function IconWordWrap(props: Props): JSX.Element {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M4 19h6v-2H4v2zM20 5H4v2h16V5zm-3 6H4v2h13.25c1.1 0 2 .9 2 2s-.9 2-2 2H15v-2l-3 3l3 3v-2h2c2.21 0 4-1.79 4-4s-1.79-4-4-4z"
+      />
+    </svg>
+  );
+}

From 5d9dc390fc867b78cdb099cf8f079e2dcffc9275 Mon Sep 17 00:00:00 2001
From: Armano <armano2@users.noreply.github.com>
Date: Sun, 2 Apr 2023 13:23:06 +0200
Subject: [PATCH 2/2] fix: correct icons

---
 packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx | 2 +-
 .../docusaurus-theme-classic/src/theme/Icon/Success/index.tsx   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx b/packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx
index f10a1cd7fd60..9636ea9a149d 100644
--- a/packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/Icon/Copy/index.tsx
@@ -13,7 +13,7 @@ export default function IconCopy(props: Props): JSX.Element {
     <svg viewBox="0 0 24 24" {...props}>
       <path
         fill="currentColor"
-        d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"
+        d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"
       />
     </svg>
   );
diff --git a/packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx b/packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx
index 7835294e84c2..a7887233befd 100644
--- a/packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/Icon/Success/index.tsx
@@ -13,7 +13,7 @@ export default function IconSuccess(props: Props): JSX.Element {
     <svg viewBox="0 0 24 24" {...props}>
       <path
         fill="currentColor"
-        d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"
+        d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"
       />
     </svg>
   );