New source found from dndbeyond.com

ddb_main/tools/js/smartComponents/CombatAttack/CombatActionAttack/CombatActionAttack.tsx

@@ -1,4 +1,5 @@
 import * as React from "react";
+
 import {
   AbilityLookup,
   Action,
@@ -12,23 +13,23 @@ import {
   RuleData,
   RuleDataUtils,
 } from "@dndbeyond/character-rules-engine/es";
-import {
-  Dice,
-  RollType,
-  DiceEvent,
-  RollKind,
-  IRollContext,
-} from "@dndbeyond/dice";
 import { GameLogContext } from "@dndbeyond/game-log-components";
+import {
+  RollKinds,
+  RollTypes,
+} from "@dndbeyond/pocket-dimension-dice/constants";
+import { RollContext } from "@dndbeyond/pocket-dimension-dice/types";
+
 import { NumberDisplay } from "~/components/NumberDisplay";
+
 import ActionName from "../../ActionName";
+import Damage from "../../Damage";
+import { DigitalDiceWrapper } from "../../Dice";
 import { AttackTypeIcon } from "../../Icons";
 import NoteComponents from "../../NoteComponents";
 import { DiceComponentUtils } from "../../utils";
 import CombatAttack from "../CombatAttack";
 import { CombatActionAttackComponentRangeInfo } from "./CombatActionAttackTypings";
-import { DigitalDiceWrapper } from "../../Dice";
-import Damage from "../../Damage";
 
 interface Props {
   attack: Attack;
@@ -40,7 +41,7 @@ interface Props {
   className: string;
   diceEnabled: boolean;
   theme: CharacterTheme;
-  rollContext: IRollContext;
+  rollContext: RollContext;
   proficiencyBonus: number;
 }
 
@@ -48,6 +49,7 @@ interface State {
   isCriticalHit: boolean;
 }
 class CombatActionAttack extends React.PureComponent<Props, State> {
+  private elementRef = React.createRef<React.ReactNode>();
   diceEventHandler: (eventData: any) => void;
 
   static defaultProps = {
@@ -64,17 +66,6 @@ class CombatActionAttack extends React.PureComponent<Props, State> {
     };
   }
 
-  componentDidMount = () => {
-    this.diceEventHandler = DiceComponentUtils.setupResetCritStateOnRoll(
-      ActionUtils.getName(this.props.attack.data as Action),
-      this
-    );
-  };
-
-  componentWillUnmount = () => {
-    Dice.removeEventListener(DiceEvent.ROLL, this.diceEventHandler);
-  };
-
   handleClick = (): void => {
     const { onClick, attack } = this.props;
 
@@ -107,7 +98,7 @@ class CombatActionAttack extends React.PureComponent<Props, State> {
 
           if (longRange) {
             rangeValueNode = (
-              <React.Fragment>
+              <>
                 <span
                   className={`ddbc-combat-attack__range-value-close ${
                     theme.isDarkMode
@@ -126,7 +117,7 @@ class CombatActionAttack extends React.PureComponent<Props, State> {
                 >
                   ({longRange})
                 </span>
-              </React.Fragment>
+              </>
             );
             rangeLabel = "";
           } else {
@@ -380,9 +371,6 @@ class CombatActionAttack extends React.PureComponent<Props, State> {
       rollContext,
     } = this.props;
 
-    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
-      this.context;
-
     const { isCriticalHit } = this.state;
 
     const proficiency = ActionUtils.isProficient(action);
@@ -411,19 +399,18 @@ class CombatActionAttack extends React.PureComponent<Props, State> {
               ? damage.value.toString()
               : DiceUtils.renderDice(damage.value)
           }
-          rollType={RollType.Damage}
-          rollAction={ActionUtils.getName(attack.data as Action)}
-          rollKind={isCriticalHit ? RollKind.CriticalHit : RollKind.None}
-          diceEnabled={diceEnabled}
-          themeColor={theme.themeColor}
-          rollContext={rollContext}
-          rollTargetOptions={
-            messageTargetOptions
-              ? Object.values(messageTargetOptions?.entities)
-              : undefined
-          }
-          rollTargetDefault={defaultMessageTargetOption}
-          userId={userId}
+          rollType={RollTypes.Damage}
+          action={ActionUtils.getName(attack.data as Action)}
+          rollKind={isCriticalHit ? RollKinds.CriticalHit : undefined}
+          isDiceEnabled={diceEnabled}
+          entityId={String(rollContext.entityId)}
+          entityType={String(rollContext.entityType)}
+          name={String(rollContext.name)}
+          rollCallback={() => {
+            if (isCriticalHit) {
+              this.setState({ isCriticalHit: false });
+            }
+          }}
         >
           <Damage
             type={damage.type ? damage.type.name : null}