bnstooltips 1.18.17 → 1.18.18

package/build/index.es.js

@@ -1,4 +1,4 @@
-import React, { useState, cloneElement, forwardRef as forwardRef$1, useLayoutEffect, useEffect, useRef } from 'react';
+import React, { useState, cloneElement, forwardRef as forwardRef$1, useLayoutEffect, useEffect, useRef, useMemo } from 'react';
 import { createPortal } from 'react-dom';
 
 function styleInject(css, ref) {
@@ -129,6 +129,16 @@ function __generator(thisArg, body) {
         } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
+}
+
+function __spreadArray(to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 }
 
 var css_248z$e = ".TooltipBase_bns_upgradeRed_color {\n  color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n  color: #28A9F0;\n}\n\n.ItemTooltip_itemIconLoading {\n  width: 50px;\n  padding: 0.22rem 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.ItemTooltip_jobstyleToggleContainer {\n  display: flex;\n}\n.ItemTooltip_optionPadding {\n  margin: 0.2rem 0 0.5rem 0;\n}\n.ItemTooltip_showButton {\n  flex: 1;\n  border: none;\n  padding: 0.33rem 0.5rem;\n  border-radius: 0;\n  background-color: rgba(233, 233, 233, 0.2);\n  color: #fff;\n  opacity: 0.8;\n  cursor: pointer;\n  transition: background-color 0.1s;\n}\n.ItemTooltip_showButton:hover {\n  background-color: rgba(255, 255, 255, 0.3);\n  opacity: 1;\n}\n.ItemTooltip_showButton-active {\n  background-color: rgba(255, 255, 255, 0.4) !important;\n  color: #fff;\n  opacity: 1;\n}\n.ItemTooltip_jobstyleButton {\n  flex: 1;\n  border: none;\n  padding: 0.33rem 0.5rem;\n  border-radius: 0;\n  background-color: rgba(233, 233, 233, 0.1);\n  color: #fff;\n  opacity: 0.8;\n  cursor: pointer;\n  transition: background-color 0.1s;\n}\n.ItemTooltip_jobstyleButton:hover {\n  background-color: rgba(255, 255, 255, 0.2);\n  opacity: 1;\n}\n.ItemTooltip_jobstyleButton-active {\n  background-color: rgba(255, 255, 255, 0.3) !important;\n  color: #fff;\n  opacity: 1;\n}\n.ItemTooltip_itemiconnamedivspan {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.ItemTooltip_cooldown {\n  font-weight: 400;\n  font-size: 12px;\n}\n.ItemTooltip_subInfo {\n  font-size: 14px;\n}\n.ItemTooltip_stats_mainstat {\n  font-size: 16px;\n  margin-bottom: 0.05rem;\n}\n.ItemTooltip_stats_substat {\n  font-size: 14px;\n}\n.ItemTooltip_itemIconInline {\n  width: 18px !important;\n  height: 18px !important;\n  margin: 0 1px;\n  top: 3px;\n  position: relative;\n}\n.ItemTooltip_itemIconRandom {\n  width: 36px !important;\n  top: 6px;\n  margin: 0 1px 0 2px;\n}\n.ItemTooltip_itemIconSmall {\n  width: 20px !important;\n  height: 20px !important;\n  margin-right: 0.33rem;\n}\n.ItemTooltip_itemIconSlate {\n  width: 24px !important;\n  height: 24px !important;\n  margin-right: 0.11rem;\n}\n.ItemTooltip_setBonus {\n  margin-bottom: 0.8rem !important;\n}\n.ItemTooltip_setContainer {\n  padding-left: 0.33rem;\n  padding-top: 0.22rem;\n}\n.ItemTooltip_setStageContainer {\n  display: flex;\n  margin: 0.25rem 0 0.35rem 0;\n}\n.ItemTooltip_setStageNumber {\n  margin-top: 0.2rem;\n  padding-top: 0.1rem;\n  line-height: 16px;\n  width: 16px;\n  height: 16px;\n  max-height: 16px;\n  font-weight: 500;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: rgba(88, 255, 119, 0.8);\n  border: 1px solid rgba(88, 255, 119, 0.9);\n  border-radius: 3px;\n}\n.ItemTooltip_setStageContent {\n  padding-top: 0.2rem;\n  flex-grow: 2;\n  padding-left: 0.55rem;\n  max-width: 90%;\n  color: #58ff77;\n}\n.ItemTooltip_itemiconnamediv {\n  display: flex;\n  align-items: center;\n  padding: 0.15rem 0 0.15rem 0.33rem;\n  line-height: 20px;\n}\n.ItemTooltip_slateIconNameStatsDiv {\n  display: flex;\n  justify-content: space-between;\n  padding: 0.15rem 0;\n  border-bottom: solid 1px rgba(233, 233, 233, 0.3);\n}\n.ItemTooltip_slateIconNameDiv {\n  display: flex;\n  justify-content: start;\n  align-items: center;\n  flex: 1;\n}\n.ItemTooltip_slateItemNameSmall {\n  font-size: 14px;\n}\n.ItemTooltip_slateStatsDiv {\n  display: flex;\n  flex-direction: column;\n  align-items: end;\n  justify-content: center;\n  flex: 1;\n}\n.ItemTooltip_setItemIconNameDiv {\n  display: flex;\n  align-items: center;\n  padding: 0.11rem 0 0.11rem 0.33rem;\n  line-height: 20px;\n}\n.ItemTooltip_setItemsContainer {\n  display: flex;\n  font-size: 12px;\n}\n.ItemTooltip_setItemsSubContainer {\n  flex: 1;\n}\n.ItemTooltip_itemNameRandomDiv {\n  display: flex;\n  align-items: center;\n}\n\n@media only screen and (max-width: 380px) {\n  .ItemTooltip_jobstyleButton {\n    padding: 0.5rem;\n  }\n}\n/**\n * ==============================================\n * Dot Elastic\n * ==============================================\n */\n.dot-elastic {\n  position: relative;\n  width: 10px;\n  height: 10px;\n  border-radius: 5px;\n  background-color: rgba(127, 127, 127, 0.8);\n  color: rgba(127, 127, 127, 0.8);\n  animation: dotElastic 1s infinite linear;\n}\n\n.dot-elastic::before,\n.dot-elastic::after {\n  content: \"\";\n  display: inline-block;\n  position: absolute;\n  top: 0;\n}\n\n.dot-elastic::before {\n  left: -15px;\n  width: 10px;\n  height: 10px;\n  border-radius: 5px;\n  background-color: rgba(127, 127, 127, 0.8);\n  color: rgba(127, 127, 127, 0.8);\n  animation: dotElasticBefore 1s infinite linear;\n}\n\n.dot-elastic::after {\n  left: 15px;\n  width: 10px;\n  height: 10px;\n  border-radius: 5px;\n  background-color: rgba(127, 127, 127, 0.8);\n  color: rgba(127, 127, 127, 0.8);\n  animation: dotElasticAfter 1s infinite linear;\n}\n\n@keyframes dotElasticBefore {\n  0% {\n    transform: scale(1, 1);\n  }\n  25% {\n    transform: scale(1, 1.5);\n  }\n  50% {\n    transform: scale(1, 0.67);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n  100% {\n    transform: scale(1, 1);\n  }\n}\n@keyframes dotElastic {\n  0% {\n    transform: scale(1, 1);\n  }\n  25% {\n    transform: scale(1, 1);\n  }\n  50% {\n    transform: scale(1, 1.5);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n  100% {\n    transform: scale(1, 1);\n  }\n}\n@keyframes dotElasticAfter {\n  0% {\n    transform: scale(1, 1);\n  }\n  25% {\n    transform: scale(1, 1);\n  }\n  50% {\n    transform: scale(1, 0.67);\n  }\n  75% {\n    transform: scale(1, 1.5);\n  }\n  100% {\n    transform: scale(1, 1);\n  }\n}";
@@ -8165,10 +8175,13 @@ function ItemUpgradeEffects(props) {
 
 function ItemTooltip(_a) {
     var _this = this;
-    var _b, _c, _d;
-    var data = _a.data, region = _a.region, _e = _a.debug, debug = _e === void 0 ? false : _e, _f = _a.offline, offline = _f === void 0 ? false : _f, clientProp = _a.client, jobstyleOverride = _a.jobstyleOverride, _g = _a.showUpgrade, showUpgrade = _g === void 0 ? false : _g, _h = _a.showUpgradeEffects, showUpgradeEffects = _h === void 0 ? false : _h, _j = _a.fullHeight, fullHeight = _j === void 0 ? false : _j;
-    var _k = useState("advanced-1"), jobstyle = _k[0], setJobstyle = _k[1];
-    var _l = useState(), client = _l[0], setClient = _l[1];
+    var data = _a.data, region = _a.region, _b = _a.debug, debug = _b === void 0 ? false : _b, _c = _a.offline, offline = _c === void 0 ? false : _c, clientProp = _a.client, jobstyleOverride = _a.jobstyleOverride, _d = _a.showUpgrade, showUpgrade = _d === void 0 ? false : _d, _e = _a.showUpgradeEffects, showUpgradeEffects = _e === void 0 ? false : _e, _f = _a.fullHeight, fullHeight = _f === void 0 ? false : _f;
+    var _g = useState("advanced-1"), jobstyle = _g[0], setJobstyle = _g[1];
+    var _h = useState(), client = _h[0], setClient = _h[1];
+    var _j = useState(false), setHasSkillModifiers = _j[0], setSetHasSkillModifiers = _j[1];
+    var _k = useState([]), jobstyles = _k[0], setJobstyles = _k[1];
+    var _l = useState(false), itemCombats = _l[0], setItemCombats = _l[1];
+    var item = data;
     useEffect(function () {
         if (offline && !showUpgradeEffects)
             return;
@@ -8189,46 +8202,35 @@ function ItemTooltip(_a) {
             setJobstyle(jobstyleOverride);
         }
     }, [jobstyleOverride]);
-    var item = data;
-    var itemCategory = (_c = (_b = item.categories) === null || _b === void 0 ? void 0 : _b.sort(function (a, b) { return b.index - a.index; })[0].localizedName) !== null && _c !== void 0 ? _c : "";
-    if (itemCategory == "none")
-        itemCategory = "";
+    useEffect(function () {
+        var _a, _b, _c, _d, _e, _f, _g;
+        var setHasSkillModifiers_i = ((_a = item.skills) === null || _a === void 0 ? void 0 : _a.some(function (skill) { return skill.jobstyle != null; })) || ((_c = (_b = item.setBonus) === null || _b === void 0 ? void 0 : _b.setBonusStages) === null || _c === void 0 ? void 0 : _c.some(function (stage) { var _a; return ((_a = stage.skillModifiers) === null || _a === void 0 ? void 0 : _a.length) > 0; })) || false;
+        var jobstyles_i = Array.from(new Set(__spreadArray(__spreadArray([], (((_d = item.skills) === null || _d === void 0 ? void 0 : _d.map(function (skill) { return skill.jobstyle; })) || []), true), (((_f = (_e = item.setBonus) === null || _e === void 0 ? void 0 : _e.setBonusStages) === null || _f === void 0 ? void 0 : _f.flatMap(function (stage) { var _a; return ((_a = stage.skillModifiers) === null || _a === void 0 ? void 0 : _a.map(function (modifier) { return modifier.jobstyle; })) || []; })) || []), true).filter(Boolean)));
+        var itemCombats_i = ((_g = item.skills) === null || _g === void 0 ? void 0 : _g.some(function (skill) { return skill.jobstyle != null; })) || false;
+        setSetHasSkillModifiers(setHasSkillModifiers_i);
+        setJobstyles(jobstyles_i);
+        setItemCombats(itemCombats_i);
+    }, [item]);
+    useEffect(function () {
+        if (jobstyles.length > 0 && !jobstyles.includes(jobstyle)) {
+            setJobstyle(jobstyles[0]);
+        }
+    }, [jobstyle, jobstyles]);
+    var itemCategory = useMemo(function () {
+        var _a, _b, _c;
+        var category = (_c = (_b = (_a = item.categories) === null || _a === void 0 ? void 0 : _a.sort(function (a, b) { return b.index - a.index; })[0]) === null || _b === void 0 ? void 0 : _b.localizedName) !== null && _c !== void 0 ? _c : "";
+        return category === "none" ? "" : category;
+    }, [item]);
     var tooltipBaseProps = {
         title: item.name,
         grade: item.grade,
-        id: item.id + "-" + item.level,
+        id: "".concat(item.id, "-").concat(item.level),
         icon: item.icon ? BuildIconPath(item.icon.iconPath) : "",
         subtitle: itemCategory,
         mainInfos: [],
         subInfoGroups: [],
         fullHeight: fullHeight,
     };
-    var setHasSkillModifiers = false;
-    var jobstyles = [];
-    var itemCombats = false;
-    if (item.skills != null && item.skills.length > 0) {
-        item.skills.forEach(function (itemSkill) {
-            if (itemSkill.jobstyle != null) {
-                setHasSkillModifiers = true;
-                itemCombats = true;
-                if (!jobstyles.includes(itemSkill.jobstyle)) {
-                    jobstyles.push(itemSkill.jobstyle);
-                }
-            }
-        });
-    }
-    if (((_d = item.setBonus) === null || _d === void 0 ? void 0 : _d.setBonusStages) != null) {
-        item.setBonus.setBonusStages.forEach(function (stage) {
-            if (stage.skillModifiers != null && stage.skillModifiers.length > 0) {
-                setHasSkillModifiers = true;
-                stage.skillModifiers.forEach(function (modifier) {
-                    if (!jobstyles.includes(modifier.jobstyle)) {
-                        jobstyles.push(modifier.jobstyle);
-                    }
-                });
-            }
-        });
-    }
     //top part
     AddMainInfo(tooltipBaseProps.mainInfos, item);
     AddSubInfo(tooltipBaseProps.mainInfos, item);
@@ -8238,7 +8240,9 @@ function ItemTooltip(_a) {
     AddItemRandomStats(tooltipBaseProps.mainInfos, item);
     //bottom part
     AddGearScore(tooltipBaseProps.subInfoGroups, item, debug);
-    AddJobstyleToggles(setHasSkillModifiers, tooltipBaseProps.subInfoGroups, jobstyles, jobstyle, setJobstyle);
+    if (jobstyles.length > 1) {
+        AddJobstyleToggles(setHasSkillModifiers, tooltipBaseProps.subInfoGroups, jobstyles, jobstyle, setJobstyle);
+    }
     AddTopText(tooltipBaseProps.subInfoGroups, item);
     AddSkillDescriptions(tooltipBaseProps.subInfoGroups, item, itemCombats, jobstyle);
     AddSkillModifiers(tooltipBaseProps.subInfoGroups, item, false, jobstyle);