some more type fixes

packages/grafana-ui/src/components/Button/Button.tsx

@@ -22,7 +22,7 @@ type BaseProps = {
   size?: ComponentSize;
   variant?: ButtonVariant;
   fill?: ButtonFill;
-  icon?: IconName | React.ReactElement;
+  icon?: IconName | React.ReactElement<IconElementProps>;
   className?: string;
   fullWidth?: boolean;
   type?: string;
@@ -207,8 +207,13 @@ export const LinkButton = React.forwardRef<HTMLAnchorElement, ButtonLinkProps>(
 
 LinkButton.displayName = 'LinkButton';
 
+type IconElementProps = {
+  className?: string;
+  size?: IconSize;
+};
+
 interface IconRendererProps {
-  icon?: IconName | React.ReactElement<{ className?: string; size?: IconSize }>;
+  icon?: IconName | React.ReactElement<IconElementProps>;
   size?: IconSize;
   className?: string;
   iconType?: IconType;

packages/grafana-ui/src/components/DataLinks/DataLinkSuggestions.tsx

@@ -103,7 +103,7 @@ DataLinkSuggestions.displayName = 'DataLinkSuggestions';
 interface DataLinkSuggestionsListProps extends DataLinkSuggestionsProps {
   label: string;
   activeIndexOffset: number;
-  activeRef?: React.RefObject<HTMLDivElement>;
+  activeRef?: React.RefObject<HTMLDivElement | null>;
 }
 
 const DataLinkSuggestionsList = React.memo(

packages/grafana-ui/src/components/RenderUserContentAsHTML/RenderUserContentAsHTML.tsx

@@ -1,11 +1,10 @@
-import { HTMLAttributes, PropsWithChildren, type JSX } from 'react';
-import * as React from 'react';
+import { createElement, type HTMLAttributes, type PropsWithChildren, type HTMLElementType, type JSX } from 'react';
 
 import { textUtil } from '@grafana/data';
 
 export interface RenderUserContentAsHTMLProps<T = HTMLSpanElement>
   extends Omit<HTMLAttributes<T>, 'dangerouslySetInnerHTML'> {
-  component?: keyof React.ReactHTML;
+  component?: HTMLElementType;
   content: string;
 }
 
@@ -19,7 +18,7 @@ export function RenderUserContentAsHTML<T>({
   content,
   ...rest
 }: PropsWithChildren<RenderUserContentAsHTMLProps<T>>): JSX.Element {
-  return React.createElement(component || 'span', {
+  return createElement(component || 'span', {
     dangerouslySetInnerHTML: { __html: textUtil.sanitize(content) },
     ...rest,
   });

packages/grafana-ui/src/components/Table/hooks.ts

@@ -14,8 +14,8 @@ import { GrafanaTableState } from './types';
   Select the scrollbar element from the VariableSizeList scope
  */
 export function useFixScrollbarContainer(
-  variableSizeListScrollbarRef: React.RefObject<HTMLDivElement>,
-  tableDivRef: React.RefObject<HTMLDivElement>
+  variableSizeListScrollbarRef: React.RefObject<HTMLDivElement | null>,
+  tableDivRef: React.RefObject<HTMLDivElement | null>
 ) {
   useEffect(() => {
     if (variableSizeListScrollbarRef.current && tableDivRef.current) {

public/app/features/alerting/unified/components/CollapseToggle.tsx

@@ -2,7 +2,7 @@ import { HTMLAttributes } from 'react';
 
 import { Button, IconSize } from '@grafana/ui';
 
-interface Props extends HTMLAttributes<HTMLButtonElement> {
+interface Props extends Omit<HTMLAttributes<HTMLButtonElement>, 'onToggle'> {
   isCollapsed: boolean;
   onToggle: (isCollapsed: boolean) => void;
   // Todo: this should be made compulsory for a11y purposes

public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.tsx

@@ -102,7 +102,7 @@ type TVirtualizedTraceViewOwnProps = {
   focusedSpanIdForSearch: string;
   showSpanFilterMatchesOnly: boolean;
   createFocusSpanLink: (traceId: string, spanId: string) => LinkModel;
-  topOfViewRef?: RefObject<HTMLDivElement>;
+  topOfViewRef?: RefObject<HTMLDivElement | null>;
   datasourceType: string;
   datasourceUid: string;
   headerHeight: number;

public/app/features/explore/TraceView/components/TraceTimelineViewer/index.tsx

@@ -104,7 +104,7 @@ export type TProps = {
   focusedSpanIdForSearch: string;
   showSpanFilterMatchesOnly: boolean;
   createFocusSpanLink: (traceId: string, spanId: string) => LinkModel;
-  topOfViewRef?: RefObject<HTMLDivElement>;
+  topOfViewRef?: RefObject<HTMLDivElement | null>;
   headerHeight: number;
   criticalPath: CriticalPathSection[];
   traceFlameGraphs: TraceFlameGraphs;

public/app/features/plugins/extensions/ExtensionErrorBoundary.tsx

@@ -25,7 +25,6 @@ export const ExtensionErrorBoundary = ({
         log.error(`Extension "${pluginId}/${extensionTitle}" failed to load.`, {
           message: error.message,
           componentStack: errorInfo.componentStack ?? '',
-          digest: errorInfo.digest ?? '',
         });
       }}
       fallback={() => {

public/app/features/variables/pickers/shared/VariableOptions.tsx

@@ -11,7 +11,7 @@ import checkboxWhitePng from 'img/checkbox_white.png';
 
 import { ALL_VARIABLE_VALUE } from '../../constants';
 
-export interface Props extends React.HTMLProps<HTMLUListElement>, Themeable2 {
+export interface Props extends Omit<React.HTMLProps<HTMLUListElement>, 'onToggle'>, Themeable2 {
   multi: boolean;
   values: VariableOption[];
   selectedValues: VariableOption[];