From 74ee5d97052d87b9375a7468cf8fbaffbe10bb1d Mon Sep 17 00:00:00 2001
From: Jason Stoltzfus <jastoltz24@gmail.com>
Date: Fri, 12 Jul 2024 12:18:33 -0400
Subject: [PATCH 1/3] read theme from localStorage

---
 packages/eui/src-docs/src/views/app_context.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/eui/src-docs/src/views/app_context.js b/packages/eui/src-docs/src/views/app_context.js
index 606ce277bb1..33a314348ff 100644
--- a/packages/eui/src-docs/src/views/app_context.js
+++ b/packages/eui/src-docs/src/views/app_context.js
@@ -49,6 +49,8 @@ export const AppContext = ({ children }) => {
   const isLocalDev = window.location.host.includes('803');
   setEuiDevProviderWarning(isLocalDev ? 'error' : 'warn'); // Note: this can't be in a useEffect, otherwise it fires too late for style memoization warnings to error on page reload
 
+  const overrides = JSON.parse(localStorage.getItem('kbn-theme-overrides') || '{}');
+
   return (
     <EuiProvider
       cache={{
@@ -57,6 +59,7 @@ export const AppContext = ({ children }) => {
       }}
       theme={EUI_THEMES.find((t) => t.value === theme)?.provider}
       colorMode={theme.includes('light') ? 'light' : 'dark'}
+      modify={overrides}
     >
       <Helmet>
         <link

From 998d12fc9b7b9b62aee533c1323834a590252441 Mon Sep 17 00:00:00 2001
From: Jason Stoltzfus <jastoltz24@gmail.com>
Date: Fri, 12 Jul 2024 12:25:54 -0400
Subject: [PATCH 2/3] localstorage things

---
 .../src/views/theme/customizing/values.tsx     | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/packages/eui/src-docs/src/views/theme/customizing/values.tsx b/packages/eui/src-docs/src/views/theme/customizing/values.tsx
index e9980cd6d28..1111a1beed9 100644
--- a/packages/eui/src-docs/src/views/theme/customizing/values.tsx
+++ b/packages/eui/src-docs/src/views/theme/customizing/values.tsx
@@ -131,6 +131,24 @@ export default () => {
         <>
           <EuiBottomBar position="sticky">
             <EuiFlexGroup responsive={false} justifyContent="flexEnd">
+              <EuiFlexItem grow={false}>
+                <EuiButton onClick={() => {
+                  const overridesJSON = JSON.stringify(overrides || {}, null, 2)
+                  localStorage.setItem('kbn-theme-overrides', overridesJSON);
+                  location.reload();
+                }} fill iconType="copyClipboard">
+                  Apply to local storage
+                </EuiButton>
+              </EuiFlexItem>
+              <EuiFlexItem grow={false}>
+                <EuiButton onClick={() => {
+                  const overridesJSON = JSON.stringify({}, null, 2)
+                  localStorage.setItem('kbn-theme-overrides', overridesJSON);
+                  location.reload();
+                }} fill iconType="copyClipboard">
+                  Reset local storage
+                </EuiButton>
+              </EuiFlexItem>
               {Object.keys(overrides).length > 0 && (
                 <>
                   <EuiFlexItem grow={false}>

From 3d927ba204e59b20b0d73e43938e8ade06f8ccac Mon Sep 17 00:00:00 2001
From: Jason Stoltzfus <jastoltz24@gmail.com>
Date: Sat, 13 Jul 2024 10:11:15 -0400
Subject: [PATCH 3/3] liiiiiiiint

---
 .../eui/src-docs/src/views/app_context.js     |  4 ++-
 .../src/views/theme/customizing/values.tsx    | 32 +++++++++++++------
 2 files changed, 25 insertions(+), 11 deletions(-)

diff --git a/packages/eui/src-docs/src/views/app_context.js b/packages/eui/src-docs/src/views/app_context.js
index 33a314348ff..4259754211b 100644
--- a/packages/eui/src-docs/src/views/app_context.js
+++ b/packages/eui/src-docs/src/views/app_context.js
@@ -49,7 +49,9 @@ export const AppContext = ({ children }) => {
   const isLocalDev = window.location.host.includes('803');
   setEuiDevProviderWarning(isLocalDev ? 'error' : 'warn'); // Note: this can't be in a useEffect, otherwise it fires too late for style memoization warnings to error on page reload
 
-  const overrides = JSON.parse(localStorage.getItem('kbn-theme-overrides') || '{}');
+  const overrides = JSON.parse(
+    localStorage.getItem('kbn-theme-overrides') || '{}'
+  );
 
   return (
     <EuiProvider
diff --git a/packages/eui/src-docs/src/views/theme/customizing/values.tsx b/packages/eui/src-docs/src/views/theme/customizing/values.tsx
index 1111a1beed9..62e13ac4ef6 100644
--- a/packages/eui/src-docs/src/views/theme/customizing/values.tsx
+++ b/packages/eui/src-docs/src/views/theme/customizing/values.tsx
@@ -132,20 +132,32 @@ export default () => {
           <EuiBottomBar position="sticky">
             <EuiFlexGroup responsive={false} justifyContent="flexEnd">
               <EuiFlexItem grow={false}>
-                <EuiButton onClick={() => {
-                  const overridesJSON = JSON.stringify(overrides || {}, null, 2)
-                  localStorage.setItem('kbn-theme-overrides', overridesJSON);
-                  location.reload();
-                }} fill iconType="copyClipboard">
+                <EuiButton
+                  onClick={() => {
+                    const overridesJSON = JSON.stringify(
+                      overrides || {},
+                      null,
+                      2
+                    );
+                    localStorage.setItem('kbn-theme-overrides', overridesJSON);
+                    location.reload();
+                  }}
+                  fill
+                  iconType="copyClipboard"
+                >
                   Apply to local storage
                 </EuiButton>
               </EuiFlexItem>
               <EuiFlexItem grow={false}>
-                <EuiButton onClick={() => {
-                  const overridesJSON = JSON.stringify({}, null, 2)
-                  localStorage.setItem('kbn-theme-overrides', overridesJSON);
-                  location.reload();
-                }} fill iconType="copyClipboard">
+                <EuiButton
+                  onClick={() => {
+                    const overridesJSON = JSON.stringify({}, null, 2);
+                    localStorage.setItem('kbn-theme-overrides', overridesJSON);
+                    location.reload();
+                  }}
+                  fill
+                  iconType="copyClipboard"
+                >
                   Reset local storage
                 </EuiButton>
               </EuiFlexItem>