New source found from dndbeyond.com

ddb_main/tools/js/smartComponents/Icons/ManageIcon/ManageIcon.tsx

@@ -1,9 +1,9 @@
-import * as React from "react";
+import { PureComponent, MouseEvent, ReactNode, PropsWithChildren } from "react";
 
 import { Tooltip } from "@dndbeyond/character-common-components/es";
 import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
 
-interface Props {
+interface Props extends PropsWithChildren {
   className: string;
   tooltip: string;
   onClick?: () => void;
@@ -12,7 +12,7 @@ interface Props {
   showIcon: boolean;
   theme: CharacterTheme;
 }
-export default class ManageIcon extends React.PureComponent<Props> {
+export default class ManageIcon extends PureComponent<Props> {
   static defaultProps = {
     tooltip: "Manage",
     enableTooltip: true,
@@ -21,7 +21,7 @@ export default class ManageIcon extends React.PureComponent<Props> {
     className: "",
   };
 
-  handleClick = (evt: React.MouseEvent): void => {
+  handleClick = (evt: MouseEvent): void => {
     const { onClick } = this.props;
 
     if (onClick) {
@@ -54,8 +54,8 @@ export default class ManageIcon extends React.PureComponent<Props> {
       classNames.push("ddbc-manage-icon--dark-mode");
     }
 
-    let contentNode: React.ReactNode = (
-      <React.Fragment>
+    let contentNode: ReactNode = (
+      <>
         {children && (
           <span className="ddbc-manage-icon__content">{children}</span>
         )}
@@ -66,7 +66,7 @@ export default class ManageIcon extends React.PureComponent<Props> {
             }`}
           />
         )}
-      </React.Fragment>
+      </>
     );
 
     if (enableTooltip) {