From bb99273117e57c64dba53dd6b3e2a2a607909478 Mon Sep 17 00:00:00 2001
From: Cee Chen <constance.chen@elastic.co>
Date: Thu, 22 Feb 2024 13:31:18 -0800
Subject: [PATCH] Basic memoization of button styles

---
 src/components/button/button_display/_button_display.tsx | 6 ++----
 src/components/button/button_empty/button_empty.tsx      | 5 ++---
 src/components/button/button_group/button_group.tsx      | 4 +---
 src/components/button/button_icon/button_icon.tsx        | 4 ++--
 4 files changed, 7 insertions(+), 12 deletions(-)

diff --git a/src/components/button/button_display/_button_display.tsx b/src/components/button/button_display/_button_display.tsx
index c73acb9f5a8..b2facd31767 100644
--- a/src/components/button/button_display/_button_display.tsx
+++ b/src/components/button/button_display/_button_display.tsx
@@ -16,7 +16,7 @@ import React, {
 
 // @ts-ignore module doesn't export `createElement`
 import { createElement } from '@emotion/react';
-import { getSecureRelForTarget, useEuiTheme } from '../../../services';
+import { getSecureRelForTarget, useEuiMemoizedStyles } from '../../../services';
 
 import {
   CommonProps,
@@ -139,9 +139,7 @@ export const EuiButtonDisplay = forwardRef<HTMLElement, EuiButtonDisplayProps>(
       isLoading,
     });
 
-    const theme = useEuiTheme();
-
-    const styles = euiButtonDisplayStyles(theme);
+    const styles = useEuiMemoizedStyles(euiButtonDisplayStyles);
     const cssStyles = [
       styles.euiButtonDisplay,
       styles[size],
diff --git a/src/components/button/button_empty/button_empty.tsx b/src/components/button/button_empty/button_empty.tsx
index acaf74a4ce7..9ce62596f24 100644
--- a/src/components/button/button_empty/button_empty.tsx
+++ b/src/components/button/button_empty/button_empty.tsx
@@ -15,7 +15,7 @@ import {
   PropsForAnchor,
   PropsForButton,
 } from '../../common';
-import { useEuiTheme, getSecureRelForTarget } from '../../../services';
+import { useEuiMemoizedStyles, getSecureRelForTarget } from '../../../services';
 
 import {
   EuiButtonDisplayContent,
@@ -119,8 +119,7 @@ export const EuiButtonEmpty: FunctionComponent<EuiButtonEmptyProps> = ({
     display: 'empty',
   });
 
-  const euiTheme = useEuiTheme();
-  const styles = euiButtonEmptyStyles(euiTheme);
+  const styles = useEuiMemoizedStyles(euiButtonEmptyStyles);
   const cssStyles = [
     styles.euiButtonEmpty,
     styles[size],
diff --git a/src/components/button/button_group/button_group.tsx b/src/components/button/button_group/button_group.tsx
index 066dffefc08..ec820c23409 100644
--- a/src/components/button/button_group/button_group.tsx
+++ b/src/components/button/button_group/button_group.tsx
@@ -142,15 +142,13 @@ export const EuiButtonGroup: FunctionComponent<Props> = ({
   type = 'single',
   ...rest
 }) => {
-  const euiTheme = useEuiTheme();
-
   const wrapperStyles = euiButtonGroupStyles();
   const wrapperCssStyles = [
     wrapperStyles.euiButtonGroup,
     isFullWidth && wrapperStyles.fullWidth,
   ];
 
-  const styles = euiButtonGroupButtonsStyles(euiTheme);
+  const styles = useEuiMemoizedStyles(euiButtonGroupButtonsStyles);
   const cssStyles = [
     styles.euiButtonGroup__buttons,
     isFullWidth && styles.fullWidth,
diff --git a/src/components/button/button_icon/button_icon.tsx b/src/components/button/button_icon/button_icon.tsx
index b522ea80394..99b550f2bb0 100644
--- a/src/components/button/button_icon/button_icon.tsx
+++ b/src/components/button/button_icon/button_icon.tsx
@@ -14,7 +14,7 @@ import React, {
 } from 'react';
 import classNames from 'classnames';
 
-import { getSecureRelForTarget, useEuiTheme } from '../../../services';
+import { getSecureRelForTarget, useEuiTheme, useEuiMemoizedStyles } from '../../../services';
 import {
   CommonProps,
   ExclusiveUnion,
@@ -142,7 +142,7 @@ export const EuiButtonIcon: FunctionComponent<Props> = ({
     !isDisabled &&
     _emptyHoverStyles(euiThemeContext, color);
 
-  const styles = euiButtonIconStyles(euiThemeContext);
+  const styles = useEuiMemoizedStyles(euiButtonIconStyles);
   const cssStyles = [
     styles.euiButtonIcon,
     styles[size],