diff --git a/public/app/features/alerting/unified/components/receivers/AlertInstanceModalSelector.tsx b/public/app/features/alerting/unified/components/receivers/AlertInstanceModalSelector.tsx
index 3a59b16ec87..d87ef341359 100644
--- a/public/app/features/alerting/unified/components/receivers/AlertInstanceModalSelector.tsx
+++ b/public/app/features/alerting/unified/components/receivers/AlertInstanceModalSelector.tsx
@@ -1,6 +1,6 @@
 import { css, cx } from '@emotion/css';
 import { CSSProperties, useCallback, useMemo, useState } from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 import { FixedSizeList } from 'react-window';
 
 import { GrafanaTheme2 } from '@grafana/data';
@@ -235,7 +235,7 @@ export function AlertInstanceModalSelector({
 
             {!loading && (
               <AutoSizer>
-                {({ height, width }) => (
+                {({ height, width }: Size) => (
                   <FixedSizeList itemSize={50} height={height} width={width} itemCount={filteredRulesKeys.length}>
                     {RuleRow}
                   </FixedSizeList>
@@ -263,7 +263,7 @@ export function AlertInstanceModalSelector({
 
             {selectedRule && rulesWithInstances[selectedRule].length && !loading && (
               <AutoSizer>
-                {({ width, height }) => (
+                {({ width, height }: Size) => (
                   <FixedSizeList
                     itemSize={32}
                     height={height}
diff --git a/public/app/features/alerting/unified/components/receivers/PayloadEditor.tsx b/public/app/features/alerting/unified/components/receivers/PayloadEditor.tsx
index 34ccbc5715c..d0f58027e7b 100644
--- a/public/app/features/alerting/unified/components/receivers/PayloadEditor.tsx
+++ b/public/app/features/alerting/unified/components/receivers/PayloadEditor.tsx
@@ -1,7 +1,7 @@
 import { css, cx } from '@emotion/css';
 import { useState } from 'react';
 import * as React from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { Trans, t } from '@grafana/i18n';
@@ -124,7 +124,7 @@ export function PayloadEditor({
 
         <div className={styles.editorWrapper}>
           <AutoSizer>
-            {({ width, height }) => (
+            {({ width, height }: Size) => (
               <CodeEditor
                 containerStyles={styles.editorContainer}
                 width={width}
diff --git a/public/app/features/alerting/unified/components/receivers/TemplateForm.tsx b/public/app/features/alerting/unified/components/receivers/TemplateForm.tsx
index bb7708a5226..0716c9fa5cb 100644
--- a/public/app/features/alerting/unified/components/receivers/TemplateForm.tsx
+++ b/public/app/features/alerting/unified/components/receivers/TemplateForm.tsx
@@ -4,7 +4,7 @@ import { Location } from 'history';
 import { useRef, useState } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
 import { useToggle } from 'react-use';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { Trans, t } from '@grafana/i18n';
@@ -306,7 +306,7 @@ export const TemplateForm = ({ originalTemplate, prefill, alertmanager }: Props)
                         </div>
                         <Box flex={1}>
                           <AutoSizer>
-                            {({ width, height }) => (
+                            {({ width, height }: Size) => (
                               <TemplateEditor
                                 value={getValues('content')}
                                 onBlur={(value) => setValue('content', value)}
diff --git a/public/app/features/alerting/unified/components/receivers/form/fields/TemplateContentAndPreview.tsx b/public/app/features/alerting/unified/components/receivers/form/fields/TemplateContentAndPreview.tsx
index 7a5c016a126..aa981ff9555 100644
--- a/public/app/features/alerting/unified/components/receivers/form/fields/TemplateContentAndPreview.tsx
+++ b/public/app/features/alerting/unified/components/receivers/form/fields/TemplateContentAndPreview.tsx
@@ -1,6 +1,6 @@
 import { css, cx } from '@emotion/css';
 import * as React from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { t } from '@grafana/i18n';
@@ -44,7 +44,7 @@ export function TemplateContentAndPreview({
         <Box flex={1}>
           <div className={styles.viewerContainer({ height: 400 })}>
             <AutoSizer>
-              {({ width, height }) => (
+              {({ width, height }: Size) => (
                 <TemplateEditor
                   value={templateContent}
                   containerStyles={styles.editorContainer}
diff --git a/public/app/features/alerting/unified/components/rule-editor/DashboardPicker.tsx b/public/app/features/alerting/unified/components/rule-editor/DashboardPicker.tsx
index 68fa9d2df4d..be2d0214b72 100644
--- a/public/app/features/alerting/unified/components/rule-editor/DashboardPicker.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/DashboardPicker.tsx
@@ -2,7 +2,7 @@ import { css, cx } from '@emotion/css';
 import { noop } from 'lodash';
 import { CSSProperties, useCallback, useMemo, useState } from 'react';
 import { useAsync, useDebounce } from 'react-use';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 import { FixedSizeList } from 'react-window';
 
 import { GrafanaTheme2 } from '@grafana/data';
@@ -257,7 +257,7 @@ export const DashboardPicker = ({ dashboardUid, panelId, isOpen, onChange, onDis
 
           {!isDashSearchFetching && (
             <AutoSizer>
-              {({ height, width }) => (
+              {({ height, width }: Size) => (
                 <FixedSizeList
                   ref={scrollToItem}
                   itemSize={50}
@@ -291,7 +291,7 @@ export const DashboardPicker = ({ dashboardUid, panelId, isOpen, onChange, onDis
 
           {selectedDashboardUid && !isDashboardFetching && (
             <AutoSizer>
-              {({ width, height }) => (
+              {({ width, height }: Size) => (
                 <FixedSizeList itemSize={32} height={height} width={width} itemCount={filteredPanels.length}>
                   {PanelRow}
                 </FixedSizeList>
diff --git a/public/app/features/alerting/unified/components/rule-editor/PreviewRuleResult.tsx b/public/app/features/alerting/unified/components/rule-editor/PreviewRuleResult.tsx
index 0a30d3647ef..765afdc3af8 100644
--- a/public/app/features/alerting/unified/components/rule-editor/PreviewRuleResult.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/PreviewRuleResult.tsx
@@ -1,6 +1,6 @@
 import { css } from '@emotion/css';
 import * as React from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { FieldConfigSource, FieldMatcherID, GrafanaTheme2, LoadingState } from '@grafana/data';
 import { Trans, t } from '@grafana/i18n';
@@ -67,7 +67,7 @@ export function PreviewRuleResult(props: Props): React.ReactElement | null {
       )}
       <div className={styles.table}>
         <AutoSizer>
-          {({ width, height }) => (
+          {({ width, height }: Size) => (
             <div style={{ width: `${width}px`, height: `${height}px` }}>
               <PanelRenderer
                 title=""
diff --git a/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx b/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx
index 921c67ba9cb..f15ebe6a979 100644
--- a/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx
+++ b/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx
@@ -1,7 +1,7 @@
 import { css } from '@emotion/css';
 import { memo, useEffect, useMemo } from 'react';
 import { useLocation, useParams } from 'react-router-dom-v5-compat';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { Trans } from '@grafana/i18n';
@@ -197,7 +197,7 @@ const BrowseDashboardsPage = memo(({ queryParams }: { queryParams: Record<string
 
         <div className={styles.subView}>
           <AutoSizer>
-            {({ width, height }) =>
+            {({ width, height }: Size) =>
               isSearching ? (
                 <SearchView
                   permissions={permissions}
diff --git a/public/app/features/browse-dashboards/RecentlyDeletedPage.tsx b/public/app/features/browse-dashboards/RecentlyDeletedPage.tsx
index b564740c716..5d071069f4a 100644
--- a/public/app/features/browse-dashboards/RecentlyDeletedPage.tsx
+++ b/public/app/features/browse-dashboards/RecentlyDeletedPage.tsx
@@ -1,6 +1,6 @@
 import { css } from '@emotion/css';
 import { memo, useEffect } from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { t } from '@grafana/i18n';
@@ -73,7 +73,7 @@ const RecentlyDeletedPage = memo(() => {
 
         <div className={styles.subView}>
           <AutoSizer>
-            {({ width, height }) => (
+            {({ width, height }: Size) => (
               <SearchView
                 permissions={permissions}
                 width={width}
diff --git a/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx b/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx
index 7363aff85f8..a888b01da06 100644
--- a/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx
+++ b/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx
@@ -1,7 +1,7 @@
 import { css } from '@emotion/css';
 import { PureComponent } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 import { Subscription } from 'rxjs';
 
 import { FieldConfigSource, GrafanaTheme2, NavModel, NavModelItem, PageLayoutType } from '@grafana/data';
@@ -201,7 +201,7 @@ export class PanelEditorUnconnected extends PureComponent<Props> {
         {this.renderPanelToolbar(styles)}
         <div className={styles.panelWrapper}>
           <AutoSizer>
-            {({ width, height }) => {
+            {({ width, height }: Size) => {
               if (width < 3 || height < 3) {
                 return null;
               }
diff --git a/public/app/features/dashboard/containers/SoloPanelPage.tsx b/public/app/features/dashboard/containers/SoloPanelPage.tsx
index 1904e5eb487..feeb3e6a0a3 100644
--- a/public/app/features/dashboard/containers/SoloPanelPage.tsx
+++ b/public/app/features/dashboard/containers/SoloPanelPage.tsx
@@ -2,7 +2,7 @@ import { css } from '@emotion/css';
 import { useCallback, useEffect, useState } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
 import { useParams } from 'react-router-dom-v5-compat';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { Trans, t } from '@grafana/i18n';
@@ -119,7 +119,7 @@ export const SoloPanel = ({ dashboard, notFound, panel, panelId, timezone }: Sol
   return (
     <div className={styles.container}>
       <AutoSizer>
-        {({ width, height }) => {
+        {({ width, height }: Size) => {
           if (width === 0) {
             return null;
           }
diff --git a/public/app/features/expressions/components/SqlExpressions/SqlExpr.tsx b/public/app/features/expressions/components/SqlExpressions/SqlExpr.tsx
index 361d748b716..5b9ff56c909 100644
--- a/public/app/features/expressions/components/SqlExpressions/SqlExpr.tsx
+++ b/public/app/features/expressions/components/SqlExpressions/SqlExpr.tsx
@@ -1,7 +1,7 @@
 import { css, cx } from '@emotion/css';
 import { useMemo, useRef, useEffect, useState, lazy, Suspense, useCallback } from 'react';
 import { useMeasure } from 'react-use';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { SelectableValue, GrafanaTheme2 } from '@grafana/data';
 import { t, Trans } from '@grafana/i18n';
@@ -349,7 +349,7 @@ LIMIT
 
   const renderStandaloneEditor = () => (
     <AutoSizer>
-      {({ width, height }) => (
+      {({ width, height }: Size) => (
         <SQLEditor
           query={query.expression || initialQuery}
           onChange={onEditorChange}
diff --git a/public/app/features/inspector/InspectDataTab.tsx b/public/app/features/inspector/InspectDataTab.tsx
index 8aba53622cc..b2a7874db35 100644
--- a/public/app/features/inspector/InspectDataTab.tsx
+++ b/public/app/features/inspector/InspectDataTab.tsx
@@ -1,6 +1,6 @@
 import { cloneDeep } from 'lodash';
 import { PureComponent } from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import {
   applyFieldOverrides,
@@ -292,7 +292,7 @@ export class InspectDataTab extends PureComponent<Props, State> {
         </div>
         <div className={styles.content}>
           <AutoSizer>
-            {({ width, height }) => {
+            {({ width, height }: Size) => {
               if (width === 0) {
                 return null;
               }
diff --git a/public/app/features/plugins/admin/components/PluginUsage.tsx b/public/app/features/plugins/admin/components/PluginUsage.tsx
index 0ad9ebb1738..1037bc657ed 100644
--- a/public/app/features/plugins/admin/components/PluginUsage.tsx
+++ b/public/app/features/plugins/admin/components/PluginUsage.tsx
@@ -1,7 +1,7 @@
 import { css } from '@emotion/css';
 import { useMemo } from 'react';
 import { useAsync } from 'react-use';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 import { of } from 'rxjs';
 
 import { GrafanaTheme2, PluginMeta, PluginType } from '@grafana/data';
@@ -52,7 +52,7 @@ export function PluginUsage({ plugin }: Props) {
           </Trans>
         </div>
         <AutoSizer>
-          {({ width, height }) => {
+          {({ width, height }: Size) => {
             return (
               <SearchResultsTable
                 response={found}
diff --git a/public/app/features/plugins/extensions/logs/LogViewer.tsx b/public/app/features/plugins/extensions/logs/LogViewer.tsx
index 917c773c7a7..4a815dbcfbb 100644
--- a/public/app/features/plugins/extensions/logs/LogViewer.tsx
+++ b/public/app/features/plugins/extensions/logs/LogViewer.tsx
@@ -1,6 +1,6 @@
 import { nanoid } from 'nanoid';
 import { ReactElement, useState } from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
+import AutoSizer, { type Size } from 'react-virtualized-auto-sizer';
 
 import { sceneUtils, VizConfigBuilders } from '@grafana/scenes';
 import {
@@ -56,7 +56,7 @@ function LogViewScene(): ReactElement | null {
       actions={<LogViewFilters provider={data} filteredProvider={filteredData} filter={filter} onChange={setFilter} />}
     >
       <AutoSizer>
-        {({ height, width }) => (
+        {({ height, width }: Size) => (
           <VizGridLayout minHeight={height} minWidth={width}>
             <VizPanel title="" viz={logsViz} dataProvider={filteredData} />
           </VizGridLayout>