bnstooltips 1.24.1 → 1.25.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/MultiItemTooltip/MultiItemTooltip.d.ts +5 -0
- package/build/MultiItemTooltip/MultiItemTooltip.types.d.ts +16 -0
- package/build/MultiItemTooltipWrapper/MultiItemTooltipWrapper.d.ts +6 -0
- package/build/MultiItemTooltipWrapper/MultiItemTooltipWrapper.types.d.ts +7 -0
- package/build/index.d.ts +4 -0
- package/build/index.es.js +68 -37
- package/build/index.es.js.map +1 -1
- package/build/index.js +69 -36
- package/build/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { MultiItemTooltipProps } from "./MultiItemTooltip.types";
|
|
3
|
+
import "./MultiItemTooltip.scss";
|
|
4
|
+
declare function MultiItemTooltip({ items, debug, fullheight, }: MultiItemTooltipProps): JSX.Element;
|
|
5
|
+
export default MultiItemTooltip;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { BnsItemDto } from "../itemapiclient/ItemApiClient";
|
|
2
|
+
import { ItemDownloadClient } from "../Utilities/ItemDownloadClient";
|
|
3
|
+
import { ServerRegion } from "../Utilities/Models";
|
|
4
|
+
export interface MultiItemTooltipProps {
|
|
5
|
+
items: MultiItemEntry[];
|
|
6
|
+
debug?: boolean;
|
|
7
|
+
fullheight?: boolean;
|
|
8
|
+
}
|
|
9
|
+
export interface MultiItemEntry {
|
|
10
|
+
data: BnsItemDto;
|
|
11
|
+
region: ServerRegion;
|
|
12
|
+
showUpgrade?: boolean;
|
|
13
|
+
showUpgradeEffects?: boolean;
|
|
14
|
+
offline?: boolean;
|
|
15
|
+
client?: ItemDownloadClient;
|
|
16
|
+
}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { FunctionComponent } from "react";
|
|
2
|
+
import { MultiItemTooltipWrapperProps } from "./MultiItemTooltipWrapper.types";
|
|
3
|
+
import "tippy.js/dist/tippy.css";
|
|
4
|
+
import "./MultiItemTooltipWrapper.scss";
|
|
5
|
+
declare const MultiItemTooltipWrapper: FunctionComponent<MultiItemTooltipWrapperProps>;
|
|
6
|
+
export default MultiItemTooltipWrapper;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MultiItemEntry } from "../MultiItemTooltip/MultiItemTooltip.types";
|
|
2
|
+
import { ITooltipWrapper } from "../Utilities/Models";
|
|
3
|
+
export interface MultiItemTooltipWrapperProps extends ITooltipWrapper {
|
|
4
|
+
items: MultiItemEntry[];
|
|
5
|
+
debug?: boolean;
|
|
6
|
+
fullheight?: boolean;
|
|
7
|
+
}
|
package/build/index.d.ts
CHANGED
|
@@ -38,3 +38,7 @@ import MultiSkillTooltip from "./MultiSkillTooltip/MultiSkillTooltip";
|
|
|
38
38
|
export { MultiSkillTooltip };
|
|
39
39
|
import MultiSkillTooltipWrapper from "./MultiSkillTooltipWrapper/MultiSkillTooltipWrapper";
|
|
40
40
|
export { MultiSkillTooltipWrapper };
|
|
41
|
+
import MultiItemTooltip from "./MultiItemTooltip/MultiItemTooltip";
|
|
42
|
+
export { MultiItemTooltip };
|
|
43
|
+
import MultiItemTooltipWrapper from "./MultiItemTooltipWrapper/MultiItemTooltipWrapper";
|
|
44
|
+
export { MultiItemTooltipWrapper };
|
package/build/index.es.js
CHANGED
|
@@ -28,8 +28,8 @@ function styleInject(css, ref) {
|
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
var css_248z$
|
|
32
|
-
styleInject(css_248z$
|
|
31
|
+
var css_248z$j = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n*[class*=\"00008130.UI.Label_LightYellow_12\"] {\n color: #FFEA57 !important;\n}\n\n*[class*=\"00008130.UI.Vital_LightBlue\"] {\n color: #00D9FF !important;\n font-weight: 500 !important;\n}\n\n*[class*=\"00008130.UI.Label_Green03_12\"] {\n color: #57FF78 !important;\n}\n\n*[class*=\"00008130.Program.Fontset_Chatting_Color_19\"] {\n color: #57FF78;\n}\n\n.TooltipBase_grade-none {\n color: #c2cadc;\n}\n\n.TooltipBase_grade-1 {\n color: #9B9B9B !important;\n}\n\n.TooltipBase_background-grade-1 {\n background-color: #9B9B9B !important;\n}\n\n.TooltipBase_border-grade-1 {\n border-color: #9B9B9B !important;\n}\n\n.TooltipBase_border-hover-grade-1:hover {\n border-color: #9B9B9B !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_1\"] {\n color: #9B9B9B !important;\n border-color: #9B9B9B !important;\n}\n\n.TooltipBase_grade-2 {\n color: #ffffff !important;\n}\n\n.TooltipBase_background-grade-2 {\n background-color: #ffffff !important;\n}\n\n.TooltipBase_border-grade-2 {\n border-color: #ffffff !important;\n}\n\n.TooltipBase_border-hover-grade-2:hover {\n border-color: #ffffff !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_2\"] {\n color: #ffffff !important;\n border-color: #ffffff !important;\n}\n\n.TooltipBase_grade-3 {\n color: #57FF78 !important;\n}\n\n.TooltipBase_background-grade-3 {\n background-color: #57FF78 !important;\n}\n\n.TooltipBase_border-grade-3 {\n border-color: #57FF78 !important;\n}\n\n.TooltipBase_border-hover-grade-3:hover {\n border-color: #57FF78 !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_3\"] {\n color: #57FF78 !important;\n border-color: #57FF78 !important;\n}\n\n.TooltipBase_grade-4 {\n color: #00D9FF !important;\n}\n\n.TooltipBase_background-grade-4 {\n background-color: #00D9FF !important;\n}\n\n.TooltipBase_border-grade-4 {\n border-color: #00D9FF !important;\n}\n\n.TooltipBase_border-hover-grade-4:hover {\n border-color: #00D9FF !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_4\"] {\n color: #00D9FF !important;\n border-color: #00D9FF !important;\n}\n\n.TooltipBase_grade-5 {\n color: #D836FF !important;\n}\n\n.TooltipBase_background-grade-5 {\n background-color: #D836FF !important;\n}\n\n.TooltipBase_border-grade-5 {\n border-color: #D836FF !important;\n}\n\n.TooltipBase_border-hover-grade-5:hover {\n border-color: #D836FF !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_5\"] {\n color: #D836FF !important;\n border-color: #D836FF !important;\n}\n\n.TooltipBase_grade-6 {\n color: #FF9700 !important;\n}\n\n.TooltipBase_background-grade-6 {\n background-color: #FF9700 !important;\n}\n\n.TooltipBase_border-grade-6 {\n border-color: #FF9700 !important;\n}\n\n.TooltipBase_border-hover-grade-6:hover {\n border-color: #FF9700 !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_6\"] {\n color: #FF9700 !important;\n border-color: #FF9700 !important;\n}\n\n.TooltipBase_grade-7 {\n color: #FF7802 !important;\n}\n\n.TooltipBase_background-grade-7 {\n background-color: #FF7802 !important;\n}\n\n.TooltipBase_border-grade-7 {\n border-color: #FF7802 !important;\n}\n\n.TooltipBase_border-hover-grade-7:hover {\n border-color: #FF7802 !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_7\"] {\n color: #FF7802 !important;\n border-color: #FF7802 !important;\n}\n\n.TooltipBase_grade-8 {\n color: #FF0085 !important;\n}\n\n.TooltipBase_background-grade-8 {\n background-color: #FF0085 !important;\n}\n\n.TooltipBase_border-grade-8 {\n border-color: #FF0085 !important;\n}\n\n.TooltipBase_border-hover-grade-8:hover {\n border-color: #FF0085 !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_8\"] {\n color: #FF0085 !important;\n border-color: #FF0085 !important;\n}\n\n.TooltipBase_grade-9 {\n color: #FFED23 !important;\n}\n\n.TooltipBase_background-grade-9 {\n background-color: #FFED23 !important;\n}\n\n.TooltipBase_border-grade-9 {\n border-color: #FFED23 !important;\n}\n\n.TooltipBase_border-hover-grade-9:hover {\n border-color: #FFED23 !important;\n}\n\n*[class*=\"00008130.Program.Fontset_ItemGrade_9\"] {\n color: #FFED23 !important;\n border-color: #FFED23 !important;\n}\n\n.TooltipBase_iconbg-grade-1 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_1.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-2 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_2.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-3 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_3.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-4 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_4.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-5 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_5.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-6 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_6.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-7 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_7.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-8 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_8.png\") no-repeat;\n}\n\n.TooltipBase_iconbg-grade-9 {\n background: url(\"https://lean.bns.tools/bns/icons/UE4/ItemIcon_Bg_Grade_9.png\") no-repeat;\n}\n\n.TooltipBase_container {\n box-sizing: border-box;\n font-family: \"Montserrat\", sans-serif !important;\n scroll-behavior: smooth;\n touch-action: manipulation;\n -webkit-overflow-scrolling: touch;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n position: relative;\n display: inline-flex;\n flex-direction: column;\n background-color: rgba(8, 8, 8, 0.93);\n backdrop-filter: brightness(1.5) blur(5px);\n -webkit-backdrop-filter: brightness(1.5) blur(5px);\n padding: 1rem;\n border: 1px solid;\n border-color: #9B9B9B;\n font-weight: 500;\n font-size: 16px;\n text-decoration: none;\n color: #fff;\n width: 380px;\n max-height: calc(100vh - 50px);\n overflow-y: auto;\n -ms-overflow-style: none;\n /* IE and Edge */\n scrollbar-width: none;\n /* Firefox */\n border-radius: 3px;\n text-shadow: rgb(0, 0, 0) 1px 1px 0;\n}\n\n.TooltipBase_containerFullHeight {\n height: 100%;\n}\n\n.TooltipBase_container::-webkit-scrollbar {\n display: none;\n}\n\n.TooltipBase_downgradeBlue {\n color: #28A9F0;\n}\n\n.TooltipBase_upgradeRed {\n color: #FF2818;\n}\n\n@media only screen and (max-width: 380px) {\n .TooltipBase_container {\n width: 100%;\n }\n}\n@supports not (backdrop-filter: brightness(1.5) blur(5px)) {\n .TooltipBase_container {\n background-color: rgba(0, 0, 0, 0.95);\n }\n .TooltipBase_container-loading {\n background-color: rgba(0, 0, 0, 0.95);\n }\n}\n.TooltipBase_container-loading {\n background-color: rgba(8, 8, 8, 0.93);\n backdrop-filter: brightness(1.5) blur(5px);\n -webkit-backdrop-filter: brightness(1.5) blur(5px);\n padding: 1rem;\n}\n\n.TooltipBase_titlesubtitle {\n display: flex;\n justify-content: space-between;\n margin-bottom: 1rem;\n}\n\n.TooltipBase_title {\n flex: 1;\n overflow: hidden;\n padding-right: 1rem;\n}\n\n.TooltipBase_title_text {\n font-size: 18px;\n text-shadow: rgb(0, 0, 0) 1px 1px 0;\n font-weight: 500;\n}\n\n.TooltipBase_subtitle {\n text-align: end;\n font-size: 12px;\n}\n\n.TooltipBase_iconmaininfo {\n display: flex;\n margin-bottom: 0.8rem;\n}\n\n.TooltipBase_iconcontainer {\n margin-right: 0.5rem;\n margin-bottom: 0.25rem;\n float: left;\n position: relative;\n}\n\n.TooltipBase_iconBg {\n width: 64px;\n height: 64px;\n background-origin: content-box !important;\n}\n\n.TooltipBase_icon {\n width: calc(64px - 0px * 2);\n height: calc(64px - 0px * 2);\n padding: 0px;\n}\n\n.TooltipBase_maininfocontainer {\n font-size: 16px;\n font-weight: 500;\n}\n\n.TooltipBase_maininfocontainer > div:not(:last-child) {\n margin-bottom: 0.2rem;\n}\n\n.TooltipBase_fullwidthContainer {\n line-height: 17px;\n}\n\n.TooltipBase_fullwidthContainer > div:not(:last-child) {\n margin-bottom: 0.5rem;\n}\n\n.TooltipBase_fullwidthContainer-subContainer {\n font-size: 12px;\n}\n\n.TooltipBase_fullwidthContainer-subContainer > div:not(:last-child) {\n margin-bottom: 0.1rem;\n}\n\n.TooltipBase_flex {\n display: flex;\n align-items: center;\n}\n\n.TooltipBase_flex-col {\n display: flex;\n justify-content: center;\n flex-direction: column;\n}\n\n.TooltipBase_descriptions-description-title {\n font-weight: 500;\n}\n\n.strikethrough {\n text-decoration: line-through;\n color: rgba(255, 255, 255, 0.7) !important;\n}\n\n.strikethrough > .tooltipArg {\n color: rgba(255, 255, 255, 0.7) !important;\n}\n\n.diffNew {\n color: #ecd967 !important;\n}";
|
|
32
|
+
styleInject(css_248z$j);
|
|
33
33
|
|
|
34
34
|
function TooltipBase(_a) {
|
|
35
35
|
var title = _a.title, category = _a.subtitle, grade = _a.grade, _b = _a.icon, icon = _b === void 0 ? "" : _b, _c = _a.mainInfos, mainTexts = _c === void 0 ? [] : _c, _d = _a.subInfoGroups, subTexts = _d === void 0 ? [] : _d, id = _a.id, _e = _a.fullHeight, fullHeight = _e === void 0 ? false : _e, widthOverride = _a.widthOverride;
|
|
@@ -141,8 +141,8 @@ function __spreadArray(to, from, pack) {
|
|
|
141
141
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
142
142
|
}
|
|
143
143
|
|
|
144
|
-
var css_248z$
|
|
145
|
-
styleInject(css_248z$
|
|
144
|
+
var css_248z$i = ".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}";
|
|
145
|
+
styleInject(css_248z$i);
|
|
146
146
|
|
|
147
147
|
function BuildIconPath(iconPath, iconIndex) {
|
|
148
148
|
if (iconPath == null)
|
|
@@ -3338,11 +3338,11 @@ var ItemDownloadClient = /** @class */ (function () {
|
|
|
3338
3338
|
return ItemDownloadClient;
|
|
3339
3339
|
}());
|
|
3340
3340
|
|
|
3341
|
-
var css_248z$
|
|
3342
|
-
styleInject(css_248z$
|
|
3341
|
+
var css_248z$h = ".tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:\"\";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}";
|
|
3342
|
+
styleInject(css_248z$h);
|
|
3343
3343
|
|
|
3344
|
-
var css_248z$
|
|
3345
|
-
styleInject(css_248z$
|
|
3344
|
+
var css_248z$g = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}";
|
|
3345
|
+
styleInject(css_248z$g);
|
|
3346
3346
|
|
|
3347
3347
|
var top = 'top';
|
|
3348
3348
|
var bottom = 'bottom';
|
|
@@ -7515,11 +7515,11 @@ var index = /*#__PURE__*/forwardRef( /*#__PURE__*/TippyGenerator(tippy));
|
|
|
7515
7515
|
|
|
7516
7516
|
var Tippy = index;
|
|
7517
7517
|
|
|
7518
|
-
var css_248z$
|
|
7519
|
-
styleInject(css_248z$
|
|
7518
|
+
var css_248z$f = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.ItemImproveTooltip_PrevCurNext {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ItemImproveTooltip_PrevCurNext_container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 90%;\n}\n.ItemImproveTooltip_PrevCurNext_container > div {\n margin: 0 0.5rem;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n.ItemImproveTooltip_PrevCurNext_container_itemChild {\n flex: 3;\n}\n.ItemImproveTooltip_PrevCurNext_container_itemChildExtra {\n flex: 3.5;\n}\n.ItemImproveTooltip_PrevCurNext_container_itemChildExtra_container {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ItemImproveTooltip_PrevCurNext_container_itemChildExtra_container_arrow {\n display: flex;\n justify-content: center;\n align-items: center;\n text-align: center;\n border: solid 1px rgba(108, 108, 108, 0.6);\n border-radius: 3px;\n padding: 1rem 0;\n cursor: pointer;\n opacity: 0.8;\n}\n.ItemImproveTooltip_PrevCurNext_container_itemChildExtra_container_arrow:hover {\n opacity: 1;\n filter: brightness(1.5);\n}\n.ItemImproveTooltip_PrevCurNext_container_arrowChild {\n flex: 1;\n}\n.ItemImproveTooltip_PrevCurNext_container_arrowChild_arrowButton {\n cursor: pointer;\n opacity: 0.8;\n}\n.ItemImproveTooltip_PrevCurNext_container_arrowChild_arrowButton:hover {\n opacity: 1;\n filter: brightness(1.5);\n}\n.ItemImproveTooltip_ItemWithText {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n.ItemImproveTooltip_ItemWithText_icon {\n width: 56px;\n height: 56px;\n}\n.ItemImproveTooltip_ItemWithText_iconSmall {\n width: 40px;\n height: 40px;\n}\n.ItemImproveTooltip_ItemWithText_iconPad {\n border-width: 2px;\n border-color: rgba(108, 108, 108, 0.6);\n border-style: solid;\n border-radius: 3px;\n padding: 1px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ItemImproveTooltip_ItemWithText_name {\n display: flex;\n justify-content: center;\n align-items: center;\n text-align: center;\n}\n\n.ItemImproveUpgradeCost {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n margin-top: 2rem;\n margin-bottom: 1rem;\n}\n.ItemImproveUpgradeCost_title {\n text-align: center;\n font-size: 18px;\n padding-top: 1rem;\n}\n.ItemImproveUpgradeCost > div {\n width: 100%;\n}\n.ItemImproveUpgradeCost_money {\n margin-top: 0.5rem;\n}\n\n.SubCostSelector {\n display: flex;\n justify-content: center;\n align-items: stretch;\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n overflow-x: auto;\n}\n.SubCostSelector > div {\n display: flex;\n justify-content: center;\n align-items: center;\n flex: 2;\n}\n\n.MainCostSelector {\n margin: 0.33rem 0 0.5rem 0;\n display: flex;\n justify-content: center;\n align-items: stretch;\n}\n.MainCostSelector_or {\n flex: 0 1 0px !important;\n padding: 0 2rem;\n font-size: 18px;\n}\n.MainCostSelector > div {\n display: flex;\n justify-content: center;\n align-items: center;\n flex: 1;\n}\n.MainCostSelector_warning {\n min-height: 1rem;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.MainCostSelector_warning_active {\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 0.5rem;\n}\n.MainCostSelector_container {\n display: flex;\n flex-direction: column;\n padding: 0 0.1rem 0.33rem 0.1rem;\n}\n.MainCostSelector_container_space {\n flex: 1;\n margin: 0 0 0.1rem 0;\n}";
|
|
7519
|
+
styleInject(css_248z$f);
|
|
7520
7520
|
|
|
7521
|
-
var css_248z$
|
|
7522
|
-
styleInject(css_248z$
|
|
7521
|
+
var css_248z$e = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.tippy-box {\n max-width: none !important;\n background-color: transparent !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;\n}\n.tippy-box:hover {\n box-shadow: rgba(0, 0, 0, 0.8) 0px 20px 60px 0px !important;\n}\n\n.tippy-content {\n padding: 0 !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=top] .tippy-arrow::before {\n border-top-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=left] .tippy-arrow::before {\n border-left-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=right] .tippy-arrow::before {\n border-right-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=top] .tippy-arrow::before {\n border-top-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=left] .tippy-arrow::before {\n border-left-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=right] .tippy-arrow::before {\n border-right-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=top] .tippy-arrow::before {\n border-top-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=left] .tippy-arrow::before {\n border-left-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=right] .tippy-arrow::before {\n border-right-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=top] .tippy-arrow::before {\n border-top-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=left] .tippy-arrow::before {\n border-left-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=right] .tippy-arrow::before {\n border-right-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=top] .tippy-arrow::before {\n border-top-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=left] .tippy-arrow::before {\n border-left-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=right] .tippy-arrow::before {\n border-right-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FFED23 !important;\n}";
|
|
7522
|
+
styleInject(css_248z$e);
|
|
7523
7523
|
|
|
7524
7524
|
var ItemTooltipWrapper = function (_a) {
|
|
7525
7525
|
var data = _a.data, region = _a.region, children = _a.children, client = _a.client, _b = _a.showUpgrade, showUpgrade = _b === void 0 ? false : _b, _c = _a.showUpgradeEffects, showUpgradeEffects = _c === void 0 ? false : _c, _d = _a.offline, offline = _d === void 0 ? false : _d, _e = _a.interactive, interactive = _e === void 0 ? true : _e, _f = _a.placement, placement = _f === void 0 ? "right" : _f, _g = _a.debug, debug = _g === void 0 ? false : _g, jobstyleOverride = _a.jobstyleOverride, _h = _a.followCursor, followCursor$1 = _h === void 0 ? false : _h, _j = _a.trigger, trigger = _j === void 0 ? "mouseenter focus" : _j, _k = _a.showArrow, showArrow = _k === void 0 ? true : _k;
|
|
@@ -7581,11 +7581,11 @@ function ItemWithText(_a) {
|
|
|
7581
7581
|
React.createElement("div", { dangerouslySetInnerHTML: { __html: item.name }, className: "TooltipBase_grade-" + item.grade + " ItemImproveTooltip_ItemWithText_name" })));
|
|
7582
7582
|
}
|
|
7583
7583
|
|
|
7584
|
-
var css_248z$
|
|
7585
|
-
styleInject(css_248z$
|
|
7584
|
+
var css_248z$d = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}";
|
|
7585
|
+
styleInject(css_248z$d);
|
|
7586
7586
|
|
|
7587
|
-
var css_248z$
|
|
7588
|
-
styleInject(css_248z$
|
|
7587
|
+
var css_248z$c = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.ItemImproveEffectsTooltip_entry {\n padding: 0.1rem 0 0 0.5rem;\n}";
|
|
7588
|
+
styleInject(css_248z$c);
|
|
7589
7589
|
|
|
7590
7590
|
function ItemImproveEffectsTooltip(_a) {
|
|
7591
7591
|
var effectsForName = _a.effectsForName;
|
|
@@ -8919,8 +8919,8 @@ function AddItemUpgradeEffects(subInfoGroups, item, client) {
|
|
|
8919
8919
|
});
|
|
8920
8920
|
}
|
|
8921
8921
|
|
|
8922
|
-
var css_248z$
|
|
8923
|
-
styleInject(css_248z$
|
|
8922
|
+
var css_248z$b = "";
|
|
8923
|
+
styleInject(css_248z$b);
|
|
8924
8924
|
|
|
8925
8925
|
function JsonTooltip(props) {
|
|
8926
8926
|
var tooltipProps = {
|
|
@@ -8956,8 +8956,8 @@ function JsonArrayToJsxArray(stringArray) {
|
|
|
8956
8956
|
return jsxArray;
|
|
8957
8957
|
}
|
|
8958
8958
|
|
|
8959
|
-
var css_248z$
|
|
8960
|
-
styleInject(css_248z$
|
|
8959
|
+
var css_248z$a = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.SkillTooltip_skillIconContainer {\n width: 60px;\n height: 60px;\n padding: 0;\n float: left;\n position: relative;\n}\n.SkillTooltip_skillIcon {\n width: 60px;\n height: 60px;\n position: relative;\n}\n.SkillTooltip_skillIconCanvas {\n width: 60px;\n height: 60px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n filter: blur(30px);\n opacity: 0.5;\n}\n.SkillTooltip_buttonIcon {\n position: absolute;\n right: 1px;\n bottom: 1px;\n height: 18px;\n opacity: 0.9;\n}\n.SkillTooltip_buttonIconMouse {\n background-color: rgba(0, 0, 0, 0.8);\n}\n.SkillTooltip_mainText {\n font-weight: 500;\n}\n.SkillTooltip_smallText {\n font-size: 12px;\n}\n.SkillTooltip_subTextMargin {\n margin-bottom: 0.3rem;\n}\n.SkillTooltip_boundaryContainer {\n display: flex;\n width: 100%;\n margin-bottom: 0.5rem;\n line-height: 17px;\n}\n.SkillTooltip_boundary {\n flex: 1;\n flex-basis: 0px;\n min-width: 0;\n display: flex;\n flex-direction: column;\n color: black;\n margin: 0.15rem;\n}\n.SkillTooltip_boundary:first-of-type > .SkillTooltip_boundaryHead {\n border-radius: 3px 0 0 0;\n}\n.SkillTooltip_boundary:last-of-type > .SkillTooltip_boundaryHead {\n border-radius: 0 3px 0 0;\n}\n.SkillTooltip_boundary:first-of-type > .SkillTooltip_boundaryBody {\n border-radius: 0 0 0 3px;\n}\n.SkillTooltip_boundary:last-of-type > .SkillTooltip_boundaryBody {\n border-radius: 0 0 3px 0;\n}\n.SkillTooltip_boundaryHead {\n color: white;\n font-weight: 500;\n font-size: 12px;\n text-overflow: ellipsis;\n overflow: hidden;\n padding: 0.3rem;\n text-align: center;\n flex: 1;\n min-height: 26px;\n background-color: rgba(127, 127, 127, 0.4);\n}\n.SkillTooltip_boundaryBody {\n color: white;\n padding: 0.5rem 0.3rem;\n margin-top: 0.15rem;\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 40px;\n flex: 2;\n background-color: rgba(127, 127, 127, 0.4);\n}\n.SkillTooltip_boundaryBodyModifier {\n min-height: 33px !important;\n}\n.SkillTooltip_boundaryHasIcon {\n min-height: 50px !important;\n}\n.SkillTooltip_conditionRow {\n display: flex;\n align-items: center;\n font-size: 12px;\n}\n.SkillTooltip_conditionRow:not(:last-of-type) {\n margin-bottom: 0.1rem;\n}\n.SkillTooltip_conditionIcon {\n width: 20px;\n height: 20px;\n margin-right: 0.33rem;\n}\n.SkillTooltip_conditionIconSmall {\n width: 12px;\n height: 12px;\n margin-right: 0.22rem;\n}\n\n.tooltipArg {\n color: #00D9FF;\n font-weight: 600;\n}\n\n.tooltipArgDisabled {\n color: rgba(255, 255, 255, 0.7) !important;\n}\n\n.wordbreakall {\n word-break: break-all;\n}\n\n.wordbreakword {\n word-break: break-word;\n}\n\n.target-360 {\n background-image: url(\"./360.png\");\n background-repeat: no-repeat;\n background-position: 50% 60%;\n background-size: auto 64px;\n}\n\n.target-front-180 {\n background-image: url(\"./180.png\");\n background-repeat: no-repeat;\n background-position: 50% 70%;\n background-size: auto 64px;\n}\n\n.laser {\n background-image: url(\"./laser.png\");\n background-repeat: no-repeat;\n background-position: 50% 50%;\n background-size: auto 64px;\n}\n\n.arcanemark {\n background-image: url(\"./arcanemark.png\");\n width: 24px;\n height: 24px;\n background-position: 50% 50%;\n background-size: auto 24px;\n margin-left: 0.25rem;\n}\n\n.arcaneContainer {\n margin-top: 0.33rem;\n display: flex;\n flex-direction: column;\n row-gap: 0.33rem;\n}\n\n.arcaneSection {\n display: flex;\n flex-direction: column;\n row-gap: 0.25rem;\n}\n\n.arcaneRow {\n display: flex;\n align-items: center;\n}\n\n.arcanebackgroundFormat {\n position: relative;\n width: 24px;\n height: 24px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-right: 0.25rem;\n flex-shrink: 0;\n}\n\n.arcanebackground {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n background-image: url(\"./arcanebackground.png\");\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center;\n filter: brightness(0) saturate(100%) invert(81%) sepia(98%) saturate(749%) hue-rotate(74deg) brightness(104%) contrast(101%);\n z-index: 1;\n}\n\n.arcanebackgroundText {\n position: relative;\n z-index: 2;\n font-size: 11px;\n text-align: center;\n width: 100%;\n line-height: 24px;\n pointer-events: none;\n}\n\n.arcanebackgroundDisabled {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n background-image: url(\"./arcanebackground_disabled.png\");\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center;\n z-index: 1;\n}";
|
|
8960
|
+
styleInject(css_248z$a);
|
|
8961
8961
|
|
|
8962
8962
|
function getButtonIconPath(button) {
|
|
8963
8963
|
var _a;
|
|
@@ -9610,8 +9610,8 @@ function GreenColoredText(_a) {
|
|
|
9610
9610
|
return React.createElement("span", { className: "00008130.UI.Label_Green03_12" }, text);
|
|
9611
9611
|
}
|
|
9612
9612
|
|
|
9613
|
-
var css_248z$
|
|
9614
|
-
styleInject(css_248z$
|
|
9613
|
+
var css_248z$9 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.tippy-box {\n max-width: none !important;\n background-color: transparent !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;\n}\n.tippy-box:hover {\n box-shadow: rgba(0, 0, 0, 0.8) 0px 20px 60px 0px !important;\n}\n\n.tippy-content {\n padding: 0 !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=top] .tippy-arrow::before {\n border-top-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=left] .tippy-arrow::before {\n border-left-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=right] .tippy-arrow::before {\n border-right-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=top] .tippy-arrow::before {\n border-top-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=left] .tippy-arrow::before {\n border-left-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=right] .tippy-arrow::before {\n border-right-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=top] .tippy-arrow::before {\n border-top-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=left] .tippy-arrow::before {\n border-left-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=right] .tippy-arrow::before {\n border-right-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=top] .tippy-arrow::before {\n border-top-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=left] .tippy-arrow::before {\n border-left-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=right] .tippy-arrow::before {\n border-right-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=top] .tippy-arrow::before {\n border-top-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=left] .tippy-arrow::before {\n border-left-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=right] .tippy-arrow::before {\n border-right-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FFED23 !important;\n}";
|
|
9614
|
+
styleInject(css_248z$9);
|
|
9615
9615
|
|
|
9616
9616
|
var SkillTooltipWrapper = function (_a) {
|
|
9617
9617
|
var data = _a.data, children = _a.children, _b = _a.interactive, interactive = _b === void 0 ? false : _b, _c = _a.placement, placement = _c === void 0 ? "right" : _c, _d = _a.followCursor, followCursor$1 = _d === void 0 ? false : _d, _e = _a.trigger, trigger = _e === void 0 ? "mouseenter focus" : _e, _f = _a.showArrow, showArrow = _f === void 0 ? true : _f, _g = _a.debug, debug = _g === void 0 ? false : _g, _h = _a.masteryPoints, masteryPoints = _h === void 0 ? 0 : _h, _j = _a.showZeroMastery, showZeroMastery = _j === void 0 ? false : _j;
|
|
@@ -9640,8 +9640,8 @@ var ServerRegion;
|
|
|
9640
9640
|
ServerRegion["NEOEU"] = "NEOEU";
|
|
9641
9641
|
})(ServerRegion || (ServerRegion = {}));
|
|
9642
9642
|
|
|
9643
|
-
var css_248z$
|
|
9644
|
-
styleInject(css_248z$
|
|
9643
|
+
var css_248z$8 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.NpcTooltip_toggleBarContainer {\n display: flex;\n}\n.NpcTooltip_toggleButton {\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.NpcTooltip_toggleButton:hover {\n background-color: rgba(255, 255, 255, 0.2);\n opacity: 1;\n}\n.NpcTooltip_toggleButton-active {\n background-color: rgba(255, 255, 255, 0.3) !important;\n color: #fff;\n opacity: 1;\n}\n.NpcTooltip_storeEntry {\n display: flex;\n align-items: stretch;\n background-color: rgba(233, 233, 233, 0.1);\n padding: 0.33rem;\n font-size: 14px;\n}\n.NpcTooltip_storeEntry:not(:last-child) {\n margin-bottom: 0.2rem;\n}\n.NpcTooltip_storeEntryItemNameLimit {\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n.NpcTooltip_storeEntryItemLimit {\n font-size: 12px;\n}\n.NpcTooltip_storeEntryItemName {\n flex: 1;\n display: flex;\n align-items: center;\n}\n.NpcTooltip_storeEntryItemIconName {\n display: flex;\n align-items: center;\n}\n.NpcTooltip_storeEntryItemIconName img {\n width: 48px;\n height: 48px;\n margin-right: 0.33rem;\n}\n.NpcTooltip_itemBuyPriceEntriesContainer {\n display: flex;\n flex-direction: column;\n flex: 1;\n align-items: flex-end;\n justify-content: center;\n padding-left: 2rem;\n}\n.NpcTooltip_itemBuyPriceEntries {\n display: flex;\n}\n.NpcTooltip_itemBuyPriceEntries-moneyMargin {\n margin-bottom: 0.2rem;\n}\n.NpcTooltip_itemBuyPriceEntry:not(:first-child) {\n margin-left: 0.33rem;\n}\n.NpcTooltip_itemBuyPriceEntryContainer {\n position: relative;\n height: 32px;\n}\n.NpcTooltip_itemBuyPriceEntryContainer img {\n width: 32px;\n height: 32px;\n}\n.NpcTooltip_itemBuyPriceEntryContainer-shadow {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-shadow: inset 0 0 2px 0px #000000;\n}\n.NpcTooltip_itemBuyPriceEntryCount {\n position: absolute;\n bottom: 0;\n left: 0;\n color: #ffffff;\n background-color: rgba(0, 0, 0, 0.4);\n width: 32px;\n line-height: 12px;\n text-align: center;\n}\n.NpcTooltip_moneyContainer {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n}\n.NpcTooltip_moneyContainer_center {\n justify-content: center;\n}\n.NpcTooltip_moneyContainer > span {\n display: flex;\n align-items: center;\n}\n.NpcTooltip_moneyContainer > span:not(:first-child) {\n margin-left: 0.1rem;\n}\n.NpcTooltip_moneyContainer > span > img {\n width: 16px;\n height: 16px;\n}";
|
|
9644
|
+
styleInject(css_248z$8);
|
|
9645
9645
|
|
|
9646
9646
|
function StoreToggle(_a) {
|
|
9647
9647
|
var store = _a.store, isActive = _a.isActive, setActive = _a.setActive;
|
|
@@ -9830,8 +9830,8 @@ function AddStores(subInfoGroups, activeTab, client, Stores) {
|
|
|
9830
9830
|
});
|
|
9831
9831
|
}
|
|
9832
9832
|
|
|
9833
|
-
var css_248z$
|
|
9834
|
-
styleInject(css_248z$
|
|
9833
|
+
var css_248z$7 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.ItemImproveSelectStageTooltip_item {\n cursor: pointer;\n border: solid 1px transparent;\n}\n.ItemImproveSelectStageTooltip_item:hover {\n border: solid 1px #ffffff;\n}";
|
|
9834
|
+
styleInject(css_248z$7);
|
|
9835
9835
|
|
|
9836
9836
|
function ItemImproveSelectStageTooltip(_a) {
|
|
9837
9837
|
var items = _a.items, onClick = _a.onClick;
|
|
@@ -9860,8 +9860,8 @@ function ItemImproveSelectStageTooltip(_a) {
|
|
|
9860
9860
|
return (React.createElement(TooltipBase, __assign({}, tooltipBaseProps)));
|
|
9861
9861
|
}
|
|
9862
9862
|
|
|
9863
|
-
var css_248z$
|
|
9864
|
-
styleInject(css_248z$
|
|
9863
|
+
var css_248z$6 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}";
|
|
9864
|
+
styleInject(css_248z$6);
|
|
9865
9865
|
|
|
9866
9866
|
var ItemImproveSelectStageTooltipWrapper = function (_a) {
|
|
9867
9867
|
var items = _a.items, onClick = _a.onClick, children = _a.children, _b = _a.interactive, interactive = _b === void 0 ? true : _b, _c = _a.placement, placement = _c === void 0 ? "right" : _c, _d = _a.followCursor, followCursor$1 = _d === void 0 ? false : _d, _e = _a.trigger, trigger = _e === void 0 ? "mouseenter focus" : _e, _f = _a.showArrow, showArrow = _f === void 0 ? true : _f;
|
|
@@ -9882,8 +9882,8 @@ var ItemImproveSelectStageTooltipWrapper = function (_a) {
|
|
|
9882
9882
|
childRef ? (React.createElement(Tippy, { arrow: showArrow, trigger: trigger, plugins: [followCursor], followCursor: followCursor$1 && !interactive, appendTo: document.body, placement: placement, animation: "fade", interactive: interactive, content: React.createElement(ItemImproveSelectStageTooltip, { items: items, onClick: onClick }), theme: "grade" + 2, reference: childRef })) : (React.createElement("span", { "data-testid": "TooltipWrapper", ref: spanRef, style: { display: "none" } }))));
|
|
9883
9883
|
};
|
|
9884
9884
|
|
|
9885
|
-
var css_248z$
|
|
9886
|
-
styleInject(css_248z$
|
|
9885
|
+
var css_248z$5 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.EffectTooltip_mainText {\n font-weight: 500;\n}\n.EffectTooltip_subTextMargin {\n margin-bottom: 0.3rem;\n}\n\n.tooltipArg {\n color: #00D9FF;\n font-weight: 600;\n}\n\n.wordbreakall {\n word-break: break-all;\n}\n\n.wordbreakword {\n word-break: break-word;\n}";
|
|
9886
|
+
styleInject(css_248z$5);
|
|
9887
9887
|
|
|
9888
9888
|
function EffectTooltip(_a) {
|
|
9889
9889
|
var data = _a.data, _b = _a.debug, debug = _b === void 0 ? false : _b;
|
|
@@ -9959,8 +9959,8 @@ function BlueColoredText(_a) {
|
|
|
9959
9959
|
return (React.createElement("span", { className: "tooltipArg " + customClasses }, text));
|
|
9960
9960
|
}
|
|
9961
9961
|
|
|
9962
|
-
var css_248z$
|
|
9963
|
-
styleInject(css_248z$
|
|
9962
|
+
var css_248z$4 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.tippy-box {\n max-width: none !important;\n background-color: transparent !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;\n}\n.tippy-box:hover {\n box-shadow: rgba(0, 0, 0, 0.8) 0px 20px 60px 0px !important;\n}\n\n.tippy-content {\n padding: 0 !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=top] .tippy-arrow::before {\n border-top-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=left] .tippy-arrow::before {\n border-left-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=right] .tippy-arrow::before {\n border-right-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=top] .tippy-arrow::before {\n border-top-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=left] .tippy-arrow::before {\n border-left-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=right] .tippy-arrow::before {\n border-right-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=top] .tippy-arrow::before {\n border-top-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=left] .tippy-arrow::before {\n border-left-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=right] .tippy-arrow::before {\n border-right-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=top] .tippy-arrow::before {\n border-top-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=left] .tippy-arrow::before {\n border-left-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=right] .tippy-arrow::before {\n border-right-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=top] .tippy-arrow::before {\n border-top-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=left] .tippy-arrow::before {\n border-left-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=right] .tippy-arrow::before {\n border-right-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FFED23 !important;\n}";
|
|
9963
|
+
styleInject(css_248z$4);
|
|
9964
9964
|
|
|
9965
9965
|
var EffectTooltipWrapper = function (_a) {
|
|
9966
9966
|
var data = _a.data, children = _a.children, _b = _a.interactive, interactive = _b === void 0 ? false : _b, _c = _a.placement, placement = _c === void 0 ? "right" : _c, _d = _a.followCursor, followCursor$1 = _d === void 0 ? false : _d, _e = _a.trigger, trigger = _e === void 0 ? "mouseenter focus" : _e, _f = _a.showArrow, showArrow = _f === void 0 ? true : _f, _g = _a.debug, debug = _g === void 0 ? false : _g;
|
|
@@ -9981,16 +9981,16 @@ var EffectTooltipWrapper = function (_a) {
|
|
|
9981
9981
|
childRef ? (React.createElement(Tippy, { arrow: showArrow, trigger: trigger, plugins: [followCursor], followCursor: followCursor$1 && (!interactive && !debug), appendTo: document.body, placement: placement, animation: "fade", interactive: interactive || debug, content: React.createElement(EffectTooltip, { data: data, debug: debug }), theme: "grade" + 4, reference: childRef })) : (React.createElement("span", { "data-testid": "TooltipWrapper", ref: spanRef, style: { display: "none" } }))));
|
|
9982
9982
|
};
|
|
9983
9983
|
|
|
9984
|
-
var css_248z$
|
|
9985
|
-
styleInject(css_248z$
|
|
9984
|
+
var css_248z$3 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.MultiSkillTooltip_container {\n display: flex;\n}";
|
|
9985
|
+
styleInject(css_248z$3);
|
|
9986
9986
|
|
|
9987
9987
|
function MultiSkillTooltip(_a) {
|
|
9988
9988
|
var skills = _a.skills, _b = _a.debug, debug = _b === void 0 ? false : _b, _c = _a.fullheight, fullheight = _c === void 0 ? false : _c;
|
|
9989
9989
|
return (React.createElement("div", { className: "MultiSkillTooltip_container", "data-testid": "MultiSkillTooltip" }, skills.map(function (skill, index) { return (React.createElement(SkillTooltip, { data: skill.data, masteryPoints: skill.masteryPoints, key: index, debug: debug, multi: fullheight, showZeroMastery: skill.showZeroMastery })); })));
|
|
9990
9990
|
}
|
|
9991
9991
|
|
|
9992
|
-
var css_248z = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.tippy-box {\n max-width: none !important;\n background-color: transparent !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;\n}\n.tippy-box:hover {\n box-shadow: rgba(0, 0, 0, 0.8) 0px 20px 60px 0px !important;\n}\n\n.tippy-content {\n padding: 0 !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=top] .tippy-arrow::before {\n border-top-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=left] .tippy-arrow::before {\n border-left-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=right] .tippy-arrow::before {\n border-right-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=top] .tippy-arrow::before {\n border-top-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=left] .tippy-arrow::before {\n border-left-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=right] .tippy-arrow::before {\n border-right-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=top] .tippy-arrow::before {\n border-top-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=left] .tippy-arrow::before {\n border-left-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=right] .tippy-arrow::before {\n border-right-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=top] .tippy-arrow::before {\n border-top-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=left] .tippy-arrow::before {\n border-left-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=right] .tippy-arrow::before {\n border-right-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=top] .tippy-arrow::before {\n border-top-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=left] .tippy-arrow::before {\n border-left-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=right] .tippy-arrow::before {\n border-right-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FFED23 !important;\n}";
|
|
9993
|
-
styleInject(css_248z);
|
|
9992
|
+
var css_248z$2 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.tippy-box {\n max-width: none !important;\n background-color: transparent !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;\n}\n.tippy-box:hover {\n box-shadow: rgba(0, 0, 0, 0.8) 0px 20px 60px 0px !important;\n}\n\n.tippy-content {\n padding: 0 !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=top] .tippy-arrow::before {\n border-top-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=left] .tippy-arrow::before {\n border-left-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=right] .tippy-arrow::before {\n border-right-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=top] .tippy-arrow::before {\n border-top-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=left] .tippy-arrow::before {\n border-left-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=right] .tippy-arrow::before {\n border-right-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=top] .tippy-arrow::before {\n border-top-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=left] .tippy-arrow::before {\n border-left-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=right] .tippy-arrow::before {\n border-right-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=top] .tippy-arrow::before {\n border-top-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=left] .tippy-arrow::before {\n border-left-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=right] .tippy-arrow::before {\n border-right-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=top] .tippy-arrow::before {\n border-top-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=left] .tippy-arrow::before {\n border-left-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=right] .tippy-arrow::before {\n border-right-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FFED23 !important;\n}";
|
|
9993
|
+
styleInject(css_248z$2);
|
|
9994
9994
|
|
|
9995
9995
|
var MultiSkillTooltipWrapper = function (_a) {
|
|
9996
9996
|
var skills = _a.skills, children = _a.children, _b = _a.interactive, interactive = _b === void 0 ? false : _b, _c = _a.placement, placement = _c === void 0 ? "right" : _c, _d = _a.followCursor, followCursor$1 = _d === void 0 ? false : _d, _e = _a.trigger, trigger = _e === void 0 ? "mouseenter focus" : _e, _f = _a.showArrow, showArrow = _f === void 0 ? true : _f, _g = _a.debug, debug = _g === void 0 ? false : _g, _h = _a.fullheight, fullheight = _h === void 0 ? false : _h;
|
|
@@ -10011,5 +10011,36 @@ var MultiSkillTooltipWrapper = function (_a) {
|
|
|
10011
10011
|
childRef ? (React.createElement(Tippy, { arrow: showArrow, trigger: trigger, plugins: [followCursor], followCursor: followCursor$1 && !interactive && !debug, appendTo: document.body, placement: placement, animation: "fade", interactive: interactive || debug, content: React.createElement(MultiSkillTooltip, { skills: skills, debug: debug, fullheight: fullheight }), theme: "grade" + 4, reference: childRef })) : (React.createElement("span", { "data-testid": "TooltipWrapper", ref: spanRef, style: { display: "none" } }))));
|
|
10012
10012
|
};
|
|
10013
10013
|
|
|
10014
|
-
|
|
10014
|
+
var css_248z$1 = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.MultiItemTooltip_container {\n display: flex;\n}";
|
|
10015
|
+
styleInject(css_248z$1);
|
|
10016
|
+
|
|
10017
|
+
function MultiItemTooltip(_a) {
|
|
10018
|
+
var items = _a.items, _b = _a.debug, debug = _b === void 0 ? false : _b, _c = _a.fullheight, fullheight = _c === void 0 ? false : _c;
|
|
10019
|
+
return (React.createElement("div", { className: "MultiItemTooltip_container", "data-testid": "MultiItemTooltip" }, items.map(function (item, index) { return (React.createElement(ItemTooltip, { data: item.data, region: item.region, showUpgrade: item.showUpgrade, showUpgradeEffects: item.showUpgradeEffects, offline: item.offline, client: item.client, key: index, debug: debug, fullHeight: fullheight })); })));
|
|
10020
|
+
}
|
|
10021
|
+
|
|
10022
|
+
var css_248z = ".TooltipBase_bns_upgradeRed_color {\n color: #FF2818;\n}\n\n.TooltipBase_bns_downgradeBlue_color {\n color: #28A9F0;\n}\n\n.tippy-box {\n max-width: none !important;\n background-color: transparent !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;\n}\n.tippy-box:hover {\n box-shadow: rgba(0, 0, 0, 0.8) 0px 20px 60px 0px !important;\n}\n\n.tippy-content {\n padding: 0 !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=top] .tippy-arrow::before {\n border-top-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=left] .tippy-arrow::before {\n border-left-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade1][data-placement^=right] .tippy-arrow::before {\n border-right-color: #9B9B9B !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=top] .tippy-arrow::before {\n border-top-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=left] .tippy-arrow::before {\n border-left-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade2][data-placement^=right] .tippy-arrow::before {\n border-right-color: #ffffff !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=top] .tippy-arrow::before {\n border-top-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=left] .tippy-arrow::before {\n border-left-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade3][data-placement^=right] .tippy-arrow::before {\n border-right-color: #57FF78 !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=top] .tippy-arrow::before {\n border-top-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=left] .tippy-arrow::before {\n border-left-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade4][data-placement^=right] .tippy-arrow::before {\n border-right-color: #00D9FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=top] .tippy-arrow::before {\n border-top-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=left] .tippy-arrow::before {\n border-left-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade5][data-placement^=right] .tippy-arrow::before {\n border-right-color: #D836FF !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade6][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF9700 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade7][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF7802 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade8][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FF0085 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=bottom] .tippy-arrow::before {\n border-bottom-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=top] .tippy-arrow::before {\n border-top-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=left] .tippy-arrow::before {\n border-left-color: #FFED23 !important;\n}\n\n.tippy-box[data-theme~=grade9][data-placement^=right] .tippy-arrow::before {\n border-right-color: #FFED23 !important;\n}";
|
|
10023
|
+
styleInject(css_248z);
|
|
10024
|
+
|
|
10025
|
+
var MultiItemTooltipWrapper = function (_a) {
|
|
10026
|
+
var _b;
|
|
10027
|
+
var items = _a.items, children = _a.children, _c = _a.interactive, interactive = _c === void 0 ? false : _c, _d = _a.placement, placement = _d === void 0 ? "right" : _d, _e = _a.followCursor, followCursor$1 = _e === void 0 ? false : _e, _f = _a.trigger, trigger = _f === void 0 ? "mouseenter focus" : _f, _g = _a.showArrow, showArrow = _g === void 0 ? true : _g, _h = _a.debug, debug = _h === void 0 ? false : _h, _j = _a.fullheight, fullheight = _j === void 0 ? false : _j;
|
|
10028
|
+
var spanRef = useRef(null);
|
|
10029
|
+
var _k = useState(null), childRef = _k[0], setChildRef = _k[1];
|
|
10030
|
+
/**
|
|
10031
|
+
* Mount the temporary span element.
|
|
10032
|
+
* retrieve and store the target element's reference.
|
|
10033
|
+
*/
|
|
10034
|
+
useEffect(function () {
|
|
10035
|
+
if (spanRef.current) {
|
|
10036
|
+
setChildRef(spanRef.current.previousElementSibling);
|
|
10037
|
+
}
|
|
10038
|
+
return function () { return setChildRef(null); };
|
|
10039
|
+
}, []);
|
|
10040
|
+
return (React.createElement(React.Fragment, null,
|
|
10041
|
+
children,
|
|
10042
|
+
childRef ? (React.createElement(Tippy, { arrow: showArrow, trigger: trigger, plugins: [followCursor], followCursor: followCursor$1 && !interactive && !debug, appendTo: document.body, placement: placement, animation: "fade", interactive: interactive || debug, content: React.createElement(MultiItemTooltip, { items: items, debug: debug, fullheight: fullheight }), theme: "grade" + (((_b = items[0]) === null || _b === void 0 ? void 0 : _b.data.grade) || 4), reference: childRef })) : (React.createElement("span", { "data-testid": "TooltipWrapper", ref: spanRef, style: { display: "none" } }))));
|
|
10043
|
+
};
|
|
10044
|
+
|
|
10045
|
+
export { EffectTooltip, EffectTooltipWrapper, GetCooldownString, ItemDownloadClient, ItemImproveEffectsTooltip, ItemImproveEffectsTooltipWrapper, ItemImproveSelectStageTooltip, ItemImproveSelectStageTooltipWrapper, ItemImproveTooltip, ItemImproveTooltipWrapper, ItemTooltip, ItemTooltipWrapper, JsonTooltip, MultiItemTooltip, MultiItemTooltipWrapper, MultiSkillTooltip, MultiSkillTooltipWrapper, NpcTooltip, ServerRegion, SkillTooltip, SkillTooltipWrapper, TooltipBase };
|
|
10015
10046
|
//# sourceMappingURL=index.es.js.map
|