From d7228829ad8d3abc32396e6db988707525d28781 Mon Sep 17 00:00:00 2001
From: Jack Westbrook <jack.westbrook@gmail.com>
Date: Tue, 4 Oct 2022 17:51:45 +0200
Subject: [PATCH] Grafana UI: Clean up bundle (#56100)

* chore(grafana-ui): don't bundle emotionPerfTest

* chore(grafana-ui): fix circular dependencies that cause esm chunks to not match up

* chore(grafana-ui): prevent bundling all css properties in package types
---
 .../grafana-ui/src/components/FilterInput/FilterInput.tsx     | 4 +++-
 .../grafana-ui/src/components/Select/resetSelectStyles.ts     | 4 ++--
 packages/grafana-ui/src/components/index.ts                   | 1 -
 public/app/features/sandbox/BenchmarksPage.tsx                | 3 ++-
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx b/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx
index 315a85d7dbf..e303aa70dd6 100644
--- a/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx
+++ b/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx
@@ -2,8 +2,10 @@ import React, { HTMLProps } from 'react';
 
 import { escapeStringForRegex, unEscapeStringFromRegex } from '@grafana/data';
 
-import { Button, Icon, Input } from '..';
 import { useCombinedRefs } from '../../utils/useCombinedRefs';
+import { Button } from '../Button';
+import { Icon } from '../Icon/Icon';
+import { Input } from '../Input/Input';
 
 export interface Props extends Omit<HTMLProps<HTMLInputElement>, 'onChange'> {
   value: string | undefined;
diff --git a/packages/grafana-ui/src/components/Select/resetSelectStyles.ts b/packages/grafana-ui/src/components/Select/resetSelectStyles.ts
index 6ffe4fa5aff..014908000a3 100644
--- a/packages/grafana-ui/src/components/Select/resetSelectStyles.ts
+++ b/packages/grafana-ui/src/components/Select/resetSelectStyles.ts
@@ -13,7 +13,7 @@ export default function resetSelectStyles(theme: GrafanaTheme2) {
     groupHeading: () => ({}),
     indicatorsContainer: () => ({}),
     indicatorSeparator: () => ({}),
-    input: function (originalStyles: CSSObjectWithLabel) {
+    input: function (originalStyles: CSSObjectWithLabel): CSSObjectWithLabel {
       return {
         ...originalStyles,
         color: 'inherit',
@@ -34,7 +34,7 @@ export default function resetSelectStyles(theme: GrafanaTheme2) {
     multiValueRemove: () => ({}),
     noOptionsMessage: () => ({}),
     option: () => ({}),
-    placeholder: (originalStyles: CSSObjectWithLabel) => ({
+    placeholder: (originalStyles: CSSObjectWithLabel): CSSObjectWithLabel => ({
       ...originalStyles,
       color: theme.colors.text.disabled,
     }),
diff --git a/packages/grafana-ui/src/components/index.ts b/packages/grafana-ui/src/components/index.ts
index 5db63c342c7..7eb16538dab 100644
--- a/packages/grafana-ui/src/components/index.ts
+++ b/packages/grafana-ui/src/components/index.ts
@@ -273,7 +273,6 @@ export { useGraphNGContext } from './GraphNG/hooks';
 export { preparePlotFrame, buildScaleKey } from './GraphNG/utils';
 export { type GraphNGLegendEvent } from './GraphNG/types';
 export * from './PanelChrome/types';
-export { EmotionPerfTest } from './ThemeDemos/EmotionPerfTest';
 export { Label as BrowserLabel } from './BrowserLabel/Label';
 export { PanelContainer } from './PanelContainer/PanelContainer';
 export * from './QueryEditor';
diff --git a/public/app/features/sandbox/BenchmarksPage.tsx b/public/app/features/sandbox/BenchmarksPage.tsx
index d8813fdbf78..7cc494ef0e9 100644
--- a/public/app/features/sandbox/BenchmarksPage.tsx
+++ b/public/app/features/sandbox/BenchmarksPage.tsx
@@ -1,6 +1,7 @@
 import React, { FC } from 'react';
 
-import { EmotionPerfTest, VerticalGroup } from '@grafana/ui';
+import { VerticalGroup } from '@grafana/ui';
+import { EmotionPerfTest } from '@grafana/ui/src/components/ThemeDemos/EmotionPerfTest';
 
 export const BenchmarksPage: FC = () => {
   return (