New source found from dndbeyond.com

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

@@ -8,20 +8,19 @@ import {
   DiceUtils,
   FormatUtils,
   Item,
+  ItemPlan,
   ItemUtils,
   RuleData,
   RuleDataUtils,
   WeaponSpellDamageGroup,
 } from "@dndbeyond/character-rules-engine/es";
-import {
-  Dice,
-  RollType,
-  DiceEvent,
-  RollKind,
-  IRollContext,
-} from "@dndbeyond/dice";
 import StarIcon from "@dndbeyond/fontawesome-cache/svgs/solid/star.svg";
 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 { ItemName } from "~/components/ItemName";
 import { NumberDisplay } from "~/components/NumberDisplay";
@@ -45,14 +44,16 @@ interface Props {
   className: string;
   diceEnabled: boolean;
   theme: CharacterTheme;
-  rollContext: IRollContext;
+  rollContext: RollContext;
   proficiencyBonus: number;
+  itemPlans: Array<ItemPlan>;
 }
 
 interface State {
   isCriticalHit: boolean;
 }
 class CombatItemAttack extends React.PureComponent<Props, State> {
+  private elementRef = React.createRef<React.ReactNode>();
   diceEventHandler: (eventData: any) => void;
 
   constructor(props: Props) {
@@ -69,17 +70,6 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
     diceEnabled: false,
   };
 
-  componentDidMount = () => {
-    this.diceEventHandler = DiceComponentUtils.setupResetCritStateOnRoll(
-      ItemUtils.getName(this.props.attack.data as Item),
-      this
-    );
-  };
-
-  componentWillUnmount = () => {
-    Dice.removeEventListener(DiceEvent.ROLL, this.diceEventHandler);
-  };
-
   handleClick = (): void => {
     const { onClick, attack } = this.props;
 
@@ -97,6 +87,7 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
       showNotes,
       proficiencyBonus,
       theme,
+      itemPlans,
     } = this.props;
 
     if (!showNotes) {
@@ -111,7 +102,8 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
             weaponSpellDamageGroups,
             ruleData,
             abilityLookup,
-            proficiencyBonus
+            proficiencyBonus,
+            ItemUtils.getItemPlan(item, itemPlans)
           )}
           theme={theme}
         />
@@ -136,9 +128,6 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
       ruleData,
     } = this.props;
 
-    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
-      this.context;
-
     const { isCriticalHit } = this.state;
 
     const toHit = ItemUtils.getToHit(item);
@@ -219,19 +208,13 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
       versatileDamageNode = (
         <DigitalDiceWrapper
           diceNotation={DiceUtils.renderDice(versatileDamage)}
-          rollType={RollType.Damage}
-          rollAction={ItemUtils.getName(attack.data as Item)}
-          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={ItemUtils.getName(attack.data as Item)}
+          rollKind={isCriticalHit ? RollKinds.CriticalHit : undefined}
+          isDiceEnabled={diceEnabled}
+          entityId={String(rollContext.entityId)}
+          entityType={String(rollContext.entityType)}
+          name={String(rollContext.name)}
         >
           <Damage
             damage={DiceComponentUtils.getDamageDiceNotation(
@@ -261,19 +244,18 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
               ? damage.toString()
               : DiceUtils.renderDice(damage)
           }
-          rollType={RollType.Damage}
-          rollAction={ItemUtils.getName(attack.data as Item)}
-          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={ItemUtils.getName(attack.data as Item)}
+          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
             damage={DiceComponentUtils.getDamageDiceNotation(
@@ -303,7 +285,7 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
     let rangeLabel: React.ReactNode;
     if (showRange) {
       rangeValue = (
-        <React.Fragment>
+        <>
           <span
             className={`ddbc-combat-attack__range-value-close ${
               theme.isDarkMode
@@ -324,7 +306,7 @@ class CombatItemAttack extends React.PureComponent<Props, State> {
               ({longRange})
             </span>
           )}
-        </React.Fragment>
+        </>
       );
       rangeLabel = "";
     } else {