pds-dev-kit-web 1.9.10 → 1.9.12

package/dist/src/desktop/panels/DesktopTutorialModal/DesktopTutorialModal.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { PDSTextType } from '../../../common';
+export declare type DesktopTutorialModalInfoType = {
+    sideTabTitleText: PDSTextType;
+    infoTitleText?: PDSTextType;
+    infoDescText?: PDSTextType;
+    imageSrc?: string;
+    btnMode?: 'none' | 'btn_amount1';
+    btn1Text?: PDSTextType;
+    onClickBtn1?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+};
+declare type DesktopTutorialModalProps = {
+    modalTitleText: PDSTextType;
+    infoArray: DesktopTutorialModalInfoType[];
+    onClose: (e: React.MouseEvent<HTMLButtonElement>) => void;
+};
+declare function DesktopTutorialModal({ modalTitleText, infoArray, onClose }: DesktopTutorialModalProps): React.ReactPortal;
+export default DesktopTutorialModal;

package/dist/src/desktop/panels/DesktopTutorialModal/DesktopTutorialModal.js

@@ -0,0 +1,153 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var react_dom_1 = __importDefault(require("react-dom"));
+var styled_components_1 = __importDefault(require("styled-components"));
+var animationStyle_1 = require("../../../common/styles/movement/animationStyle");
+var scrollbarStyle_1 = require("../../../common/styles/scroll/scrollbarStyle");
+var hybrid_1 = require("../../../hybrid");
+var components_1 = require("../../components");
+var Components_1 = require("./Components");
+function DesktopTutorialModal(_a) {
+    var modalTitleText = _a.modalTitleText, infoArray = _a.infoArray, onClose = _a.onClose;
+    var container = (0, react_1.useState)(function () {
+        var modalRoot = document.createElement('div');
+        modalRoot.setAttribute('id', 'DesktopTutorialModal');
+        return modalRoot;
+    })[0];
+    (0, react_1.useLayoutEffect)(function () {
+        var root = document.getElementById('root');
+        if (!root) {
+            return;
+        }
+        root.appendChild(container);
+        return function () {
+            root.removeChild(container);
+        };
+    }, []);
+    var handleClickCloseBtn = function (e) {
+        if (onClose) {
+            onClose(e);
+        }
+    };
+    var _b = (0, react_1.useState)(infoArray[0].sideTabTitleText + "0"), selectedItem = _b[0], setSelectedItem = _b[1];
+    var sideTabTitleArray = infoArray.map(function (data, index) {
+        return {
+            title: data.sideTabTitleText,
+            isActive: selectedItem === "" + data.sideTabTitleText + index,
+            onClick: function () { return setSelectedItem("" + data.sideTabTitleText + index); }
+        };
+    });
+    return react_dom_1.default.createPortal(react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(S_ModalOverlay, null),
+        react_1.default.createElement(S_ModalWrapper, { "x-pds-name": "DesktopTutorialModal", "x-pds-element-type": "panel", "x-pds-device-type": "desktop" },
+            react_1.default.createElement(S_LeftPanel, null,
+                react_1.default.createElement(S_Header, null,
+                    react_1.default.createElement(components_1.TextLabel, { text: modalTitleText, lineLimit: 2, ellipsisMode: "use", styleTheme: "headingBold" })),
+                react_1.default.createElement(S_SideTabWrapper, null,
+                    react_1.default.createElement(Components_1.SideTab, { itemArray: sideTabTitleArray }),
+                    react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_i" }))),
+            react_1.default.createElement(S_RightPanel, null, infoArray
+                .filter(function (data, index) { return selectedItem === "" + data.sideTabTitleText + index; })
+                .map(function (data) { return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(hybrid_1.ImageView, { src: data.imageSrc, shapeType: "rectangle", width: "responsive", ratio: "16_9", scaleType: "cover", backgroundFillMode: "use" }),
+                react_1.default.createElement(S_InfoBox, null,
+                    react_1.default.createElement(components_1.TextLabel, { text: data.infoTitleText ? data.infoTitleText : data.sideTabTitleText, styleTheme: "subTitleBold" }),
+                    react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
+                    react_1.default.createElement(components_1.TextLabel, { text: data.infoDescText, styleTheme: "body2Regular", colorTheme: "sysTextSecondary" })),
+                data.btnMode === 'btn_amount1' && (react_1.default.createElement(S_Footer, null,
+                    react_1.default.createElement(components_1.MainButton, { text: data.btn1Text, type: "button", size: "medium", onClick: data.onClickBtn1 }))))); })),
+            react_1.default.createElement(S_IconButtonWrapper, null,
+                react_1.default.createElement(components_1.IconButton, { shapeType: "circular", baseSize: "medium", baseColorKey: "ui_cpnt_button_fill_base_tutorialmodal", iconName: "ic_xmark", iconColorKey: "ui_cpnt_button_icon_white", onClick: handleClickCloseBtn })))), container);
+}
+var S_ModalOverlay = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100vh;\n  left: 0;\n  position: fixed;\n  top: 0;\n  width: 100vw;\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100vh;\n  left: 0;\n  position: fixed;\n  top: 0;\n  width: 100vw;\n\n  ", "\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_modal_dimmed;
+}, animationStyle_1.modalOverlayOnAni);
+var S_ModalWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  border: 1px solid ", ";\n  border-radius: 24px;\n  box-shadow: ", ";\n  box-sizing: border-box;\n  display: flex;\n  left: 50%;\n  min-height: 560px;\n  height: 80vh;\n  max-height: 720px;\n  min-width: 960px;\n  pointer-events: auto;\n  position: fixed;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 50vw;\n  overflow: hidden;\n  display: flex;\n\n  ", "\n"], ["\n  background-color: ", ";\n  border: 1px solid ", ";\n  border-radius: 24px;\n  box-shadow: ", ";\n  box-sizing: border-box;\n  display: flex;\n  left: 50%;\n  min-height: 560px;\n  height: 80vh;\n  max-height: 720px;\n  min-width: 960px;\n  pointer-events: auto;\n  position: fixed;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 50vw;\n  overflow: hidden;\n  display: flex;\n\n  ", "\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_modal_base;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_modal_border;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.boxShadow.elevation5;
+}, animationStyle_1.modalOnAni);
+var S_LeftPanel = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 360px;\n  display: flex;\n  flex-direction: column;\n"], ["\n  width: 360px;\n  display: flex;\n  flex-direction: column;\n"])));
+var S_Header = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  box-sizing: border-box;\n  padding-top: ", ";\n  padding-right: ", ";\n  padding-bottom: ", ";\n  padding-left: ", ";\n"], ["\n  box-sizing: border-box;\n  padding-top: ", ";\n  padding-right: ", ";\n  padding-bottom: ", ";\n  padding-left: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingE;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingE;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingF;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingE;
+});
+var S_SideTabWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  overflow-y: auto;\n  flex: 1;\n"], ["\n  overflow-y: auto;\n  flex: 1;\n"])));
+var S_RightPanel = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  width: calc(100% - 360px);\n  background-color: ", ";\n"], ["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  width: calc(100% - 360px);\n  background-color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_tutorialmodal_info_base;
+});
+var S_InfoBox = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  box-sizing: border-box;\n  overflow-y: overlay;\n  flex: 1;\n  padding-top: ", ";\n  padding-right: ", ";\n  padding-bottom: ", ";\n  padding-left: ", ";\n\n  ", "\n"], ["\n  box-sizing: border-box;\n  overflow-y: overlay;\n  flex: 1;\n  padding-top: ", ";\n  padding-right: ", ";\n  padding-bottom: ", ";\n  padding-left: ", ";\n\n  ", "\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingF;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingF;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingE;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingF;
+}, scrollbarStyle_1.scrollbarStyle);
+var S_Footer = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  align-items: flex-end;\n  min-height: 88px;\n  height: 88px;\n  box-sizing: border-box;\n  padding-right: ", ";\n  padding-bottom: ", ";\n  padding-left: ", ";\n"], ["\n  display: flex;\n  align-items: flex-end;\n  min-height: 88px;\n  height: 88px;\n  box-sizing: border-box;\n  padding-right: ", ";\n  padding-bottom: ", ";\n  padding-left: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingF;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingF;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingF;
+});
+var S_IconButtonWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  position: fixed;\n  top: ", ";\n  right: ", ";\n"], ["\n  position: fixed;\n  top: ", ";\n  right: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingB;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingB;
+});
+exports.default = DesktopTutorialModal;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;

package/dist/src/desktop/panels/DesktopTutorialModal/index.d.ts

@@ -0,0 +1,3 @@
+import { DesktopTutorialModalInfoType } from './DesktopTutorialModal';
+export { default as DesktopTutorialModal } from './DesktopTutorialModal';
+export { DesktopTutorialModalInfoType };

package/dist/src/desktop/panels/DesktopTutorialModal/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DesktopTutorialModal = void 0;
+var DesktopTutorialModal_1 = require("./DesktopTutorialModal");
+Object.defineProperty(exports, "DesktopTutorialModal", { enumerable: true, get: function () { return __importDefault(DesktopTutorialModal_1).default; } });

package/dist/src/desktop/panels/index.d.ts

@@ -2,5 +2,7 @@ import { AnnotationSheet } from './AnnotationSheet';
 import { ContentSheet } from './ContentSheet';
 import { DesktopBasicModal } from './DesktopBasicModal';
 import { DesktopHeadlessModal } from './DesktopHeadlessModal';
+import { DesktopTutorialModal, DesktopTutorialModalInfoType } from './DesktopTutorialModal';
 import { SectionSheet } from './SectionSheet';
-export { AnnotationSheet, ContentSheet, DesktopBasicModal, DesktopHeadlessModal, SectionSheet };
+export { AnnotationSheet, ContentSheet, DesktopBasicModal, DesktopHeadlessModal, DesktopTutorialModal, SectionSheet };
+export { DesktopTutorialModalInfoType };

package/dist/src/desktop/panels/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SectionSheet = exports.DesktopHeadlessModal = exports.DesktopBasicModal = exports.ContentSheet = exports.AnnotationSheet = void 0;
+exports.SectionSheet = exports.DesktopTutorialModal = exports.DesktopHeadlessModal = exports.DesktopBasicModal = exports.ContentSheet = exports.AnnotationSheet = void 0;
 var AnnotationSheet_1 = require("./AnnotationSheet");
 Object.defineProperty(exports, "AnnotationSheet", { enumerable: true, get: function () { return AnnotationSheet_1.AnnotationSheet; } });
 var ContentSheet_1 = require("./ContentSheet");
@@ -9,5 +9,7 @@ var DesktopBasicModal_1 = require("./DesktopBasicModal");
 Object.defineProperty(exports, "DesktopBasicModal", { enumerable: true, get: function () { return DesktopBasicModal_1.DesktopBasicModal; } });
 var DesktopHeadlessModal_1 = require("./DesktopHeadlessModal");
 Object.defineProperty(exports, "DesktopHeadlessModal", { enumerable: true, get: function () { return DesktopHeadlessModal_1.DesktopHeadlessModal; } });
+var DesktopTutorialModal_1 = require("./DesktopTutorialModal");
+Object.defineProperty(exports, "DesktopTutorialModal", { enumerable: true, get: function () { return DesktopTutorialModal_1.DesktopTutorialModal; } });
 var SectionSheet_1 = require("./SectionSheet");
 Object.defineProperty(exports, "SectionSheet", { enumerable: true, get: function () { return SectionSheet_1.SectionSheet; } });

package/dist/storybook-static/{0.6b1bd5db.iframe.bundle.js → 0.9bb7767d.iframe.bundle.js}

@@ -1,4 +1,4 @@
-(window.webpackJsonp = window.webpackJsonp || []).push([[0], { 2218: function (module, exports) { var hasElementType = "undefined" != typeof Element, hasMap = "function" == typeof Map, hasSet = "function" == typeof Set, hasArrayBuffer = "function" == typeof ArrayBuffer && !!ArrayBuffer.isView; function equal(a, b) { if (a === b)
+(window.webpackJsonp = window.webpackJsonp || []).push([[0], { 2223: function (module, exports) { var hasElementType = "undefined" != typeof Element, hasMap = "function" == typeof Map, hasSet = "function" == typeof Set, hasArrayBuffer = "function" == typeof ArrayBuffer && !!ArrayBuffer.isView; function equal(a, b) { if (a === b)
             return !0; if (a && b && "object" == typeof a && "object" == typeof b) {
             if (a.constructor !== b.constructor)
                 return !1;
@@ -62,15 +62,15 @@
             if ((error.message || "").match(/stack|recursion/i))
                 return console.warn("react-fast-compare cannot handle circular refs"), !1;
             throw error;
-        } }; }, 2219: function (module, exports, __webpack_require__) {
+        } }; }, 2224: function (module, exports, __webpack_require__) {
             "use strict";
             var warning = function () { };
             module.exports = warning;
-        }, 700: function (module, __webpack_exports__, __webpack_require__) {
+        }, 702: function (module, __webpack_exports__, __webpack_require__) {
             "use strict";
             __webpack_require__.r(__webpack_exports__), __webpack_require__.d(__webpack_exports__, "WithTooltipPure", (function () { return WithTooltip_WithTooltipPure; })), __webpack_require__.d(__webpack_exports__, "WithToolTipState", (function () { return WithTooltip_WithToolTipState; })), __webpack_require__.d(__webpack_exports__, "WithTooltip", (function () { return WithTooltip_WithToolTipState; }));
             __webpack_require__(16), __webpack_require__(45), __webpack_require__(26), __webpack_require__(7), __webpack_require__(19), __webpack_require__(12), __webpack_require__(10), __webpack_require__(21), __webpack_require__(15), __webpack_require__(17), __webpack_require__(9), __webpack_require__(30), __webpack_require__(18), __webpack_require__(54);
-            var react = __webpack_require__(0), react_default = __webpack_require__.n(react), esm = __webpack_require__(3), global_window = __webpack_require__(11), window_default = __webpack_require__.n(global_window), objectWithoutPropertiesLoose = __webpack_require__(118), esm_extends = __webpack_require__(23), inheritsLoose = __webpack_require__(60), react_dom = __webpack_require__(63), ManagerReferenceNodeContext = react.createContext(), ManagerReferenceNodeSetterContext = react.createContext();
+            var react = __webpack_require__(0), react_default = __webpack_require__.n(react), esm = __webpack_require__(3), global_window = __webpack_require__(11), window_default = __webpack_require__.n(global_window), objectWithoutPropertiesLoose = __webpack_require__(118), esm_extends = __webpack_require__(23), inheritsLoose = __webpack_require__(61), react_dom = __webpack_require__(60), ManagerReferenceNodeContext = react.createContext(), ManagerReferenceNodeSetterContext = react.createContext();
             function Manager(_ref) { var children = _ref.children, _React$useState = react.useState(null), referenceNode = _React$useState[0], setReferenceNode = _React$useState[1], hasUnmounted = react.useRef(!1); react.useEffect((function () { return function () { hasUnmounted.current = !0; }; }), []); var handleSetReferenceNode = react.useCallback((function (node) { hasUnmounted.current || setReferenceNode(node); }), []); return react.createElement(ManagerReferenceNodeContext.Provider, { value: referenceNode }, react.createElement(ManagerReferenceNodeSetterContext.Provider, { value: handleSetReferenceNode }, children)); }
             var unwrapArray = function unwrapArray(arg) { return Array.isArray(arg) ? arg[0] : arg; }, safeInvoke = function safeInvoke(fn) { if ("function" == typeof fn) {
                 for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++)
@@ -227,12 +227,12 @@
                         } }, requiresIfExists: ["offset"] }, { name: "arrow", enabled: !0, phase: "main", fn: function arrow(_ref) { var _state$modifiersData$, state = _ref.state, name = _ref.name, options = _ref.options, arrowElement = state.elements.arrow, popperOffsets = state.modifiersData.popperOffsets, basePlacement = getBasePlacement(state.placement), axis = getMainAxisFromPlacement(basePlacement), len = [left, right].indexOf(basePlacement) >= 0 ? "height" : "width"; if (arrowElement && popperOffsets) {
                             var paddingObject = function toPaddingObject(padding, state) { return mergePaddingObject("number" != typeof (padding = "function" == typeof padding ? padding(Object.assign({}, state.rects, { placement: state.placement })) : padding) ? padding : expandToHashMap(padding, basePlacements)); }(options.padding, state), arrowRect = getLayoutRect(arrowElement), minProp = "y" === axis ? enums_top : left, maxProp = "y" === axis ? bottom : right, endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len], startDiff = popperOffsets[axis] - state.rects.reference[axis], arrowOffsetParent = getOffsetParent(arrowElement), clientSize = arrowOffsetParent ? "y" === axis ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0, centerToReference = endDiff / 2 - startDiff / 2, min = paddingObject[minProp], max = clientSize - arrowRect[len] - paddingObject[maxProp], center = clientSize / 2 - arrowRect[len] / 2 + centerToReference, offset = within(min, center, max), axisProp = axis;
                             state.modifiersData[name] = ((_state$modifiersData$ = {})[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);
-                        } }, effect: function arrow_effect(_ref2) { var state = _ref2.state, _options$element = _ref2.options.element, arrowElement = void 0 === _options$element ? "[data-popper-arrow]" : _options$element; null != arrowElement && ("string" != typeof arrowElement || (arrowElement = state.elements.popper.querySelector(arrowElement))) && contains(state.elements.popper, arrowElement) && (state.elements.arrow = arrowElement); }, requires: ["popperOffsets"], requiresIfExists: ["preventOverflow"] }, { name: "hide", enabled: !0, phase: "main", requiresIfExists: ["preventOverflow"], fn: function hide(_ref) { var state = _ref.state, name = _ref.name, referenceRect = state.rects.reference, popperRect = state.rects.popper, preventedOffsets = state.modifiersData.preventOverflow, referenceOverflow = detectOverflow(state, { elementContext: "reference" }), popperAltOverflow = detectOverflow(state, { altBoundary: !0 }), referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect), popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets), isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets), hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets); state.modifiersData[name] = { referenceClippingOffsets: referenceClippingOffsets, popperEscapeOffsets: popperEscapeOffsets, isReferenceHidden: isReferenceHidden, hasPopperEscaped: hasPopperEscaped }, state.attributes.popper = Object.assign({}, state.attributes.popper, { "data-popper-reference-hidden": isReferenceHidden, "data-popper-escaped": hasPopperEscaped }); } }] }), react_fast_compare = __webpack_require__(2218), react_fast_compare_default = __webpack_require__.n(react_fast_compare), EMPTY_MODIFIERS = [], NOOP = function NOOP() { }, NOOP_PROMISE = function NOOP_PROMISE() { return Promise.resolve(null); }, Popper_EMPTY_MODIFIERS = [];
+                        } }, effect: function arrow_effect(_ref2) { var state = _ref2.state, _options$element = _ref2.options.element, arrowElement = void 0 === _options$element ? "[data-popper-arrow]" : _options$element; null != arrowElement && ("string" != typeof arrowElement || (arrowElement = state.elements.popper.querySelector(arrowElement))) && contains(state.elements.popper, arrowElement) && (state.elements.arrow = arrowElement); }, requires: ["popperOffsets"], requiresIfExists: ["preventOverflow"] }, { name: "hide", enabled: !0, phase: "main", requiresIfExists: ["preventOverflow"], fn: function hide(_ref) { var state = _ref.state, name = _ref.name, referenceRect = state.rects.reference, popperRect = state.rects.popper, preventedOffsets = state.modifiersData.preventOverflow, referenceOverflow = detectOverflow(state, { elementContext: "reference" }), popperAltOverflow = detectOverflow(state, { altBoundary: !0 }), referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect), popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets), isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets), hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets); state.modifiersData[name] = { referenceClippingOffsets: referenceClippingOffsets, popperEscapeOffsets: popperEscapeOffsets, isReferenceHidden: isReferenceHidden, hasPopperEscaped: hasPopperEscaped }, state.attributes.popper = Object.assign({}, state.attributes.popper, { "data-popper-reference-hidden": isReferenceHidden, "data-popper-escaped": hasPopperEscaped }); } }] }), react_fast_compare = __webpack_require__(2223), react_fast_compare_default = __webpack_require__.n(react_fast_compare), EMPTY_MODIFIERS = [], NOOP = function NOOP() { }, NOOP_PROMISE = function NOOP_PROMISE() { return Promise.resolve(null); }, Popper_EMPTY_MODIFIERS = [];
             function Popper(_ref) { var _ref$placement = _ref.placement, placement = void 0 === _ref$placement ? "bottom" : _ref$placement, _ref$strategy = _ref.strategy, strategy = void 0 === _ref$strategy ? "absolute" : _ref$strategy, _ref$modifiers = _ref.modifiers, modifiers = void 0 === _ref$modifiers ? Popper_EMPTY_MODIFIERS : _ref$modifiers, referenceElement = _ref.referenceElement, onFirstUpdate = _ref.onFirstUpdate, innerRef = _ref.innerRef, children = _ref.children, referenceNode = react.useContext(ManagerReferenceNodeContext), _React$useState = react.useState(null), popperElement = _React$useState[0], setPopperElement = _React$useState[1], _React$useState2 = react.useState(null), arrowElement = _React$useState2[0], setArrowElement = _React$useState2[1]; react.useEffect((function () { setRef(innerRef, popperElement); }), [innerRef, popperElement]); var options = react.useMemo((function () { return { placement: placement, strategy: strategy, onFirstUpdate: onFirstUpdate, modifiers: [].concat(modifiers, [{ name: "arrow", enabled: null != arrowElement, options: { element: arrowElement } }]) }; }), [placement, strategy, onFirstUpdate, modifiers, arrowElement]), _usePopper = function usePopper(referenceElement, popperElement, options) { void 0 === options && (options = {}); var prevOptions = react.useRef(null), optionsWithDefaults = { onFirstUpdate: options.onFirstUpdate, placement: options.placement || "bottom", strategy: options.strategy || "absolute", modifiers: options.modifiers || EMPTY_MODIFIERS }, _React$useState = react.useState({ styles: { popper: { position: optionsWithDefaults.strategy, left: "0", top: "0" }, arrow: { position: "absolute" } }, attributes: {} }), state = _React$useState[0], setState = _React$useState[1], updateStateModifier = react.useMemo((function () { return { name: "updateState", enabled: !0, phase: "write", fn: function fn(_ref) { var state = _ref.state, elements = Object.keys(state.elements); setState({ styles: fromEntries(elements.map((function (element) { return [element, state.styles[element] || {}]; }))), attributes: fromEntries(elements.map((function (element) { return [element, state.attributes[element]]; }))) }); }, requires: ["computeStyles"] }; }), []), popperOptions = react.useMemo((function () { var newOptions = { onFirstUpdate: optionsWithDefaults.onFirstUpdate, placement: optionsWithDefaults.placement, strategy: optionsWithDefaults.strategy, modifiers: [].concat(optionsWithDefaults.modifiers, [updateStateModifier, { name: "applyStyles", enabled: !1 }]) }; return react_fast_compare_default()(prevOptions.current, newOptions) ? prevOptions.current || newOptions : (prevOptions.current = newOptions, newOptions); }), [optionsWithDefaults.onFirstUpdate, optionsWithDefaults.placement, optionsWithDefaults.strategy, optionsWithDefaults.modifiers, updateStateModifier]), popperInstanceRef = react.useRef(); return useIsomorphicLayoutEffect((function () { popperInstanceRef.current && popperInstanceRef.current.setOptions(popperOptions); }), [popperOptions]), useIsomorphicLayoutEffect((function () { if (null != referenceElement && null != popperElement) {
                 var popperInstance = (options.createPopper || popper_createPopper)(referenceElement, popperElement, popperOptions);
                 return popperInstanceRef.current = popperInstance, function () { popperInstance.destroy(), popperInstanceRef.current = null; };
             } }), [referenceElement, popperElement, options.createPopper]), { state: popperInstanceRef.current ? popperInstanceRef.current.state : null, styles: state.styles, attributes: state.attributes, update: popperInstanceRef.current ? popperInstanceRef.current.update : null, forceUpdate: popperInstanceRef.current ? popperInstanceRef.current.forceUpdate : null }; }(referenceElement || referenceNode, popperElement, options), state = _usePopper.state, styles = _usePopper.styles, forceUpdate = _usePopper.forceUpdate, update = _usePopper.update, childrenProps = react.useMemo((function () { return { ref: setPopperElement, style: styles.popper, placement: state ? state.placement : placement, hasPopperEscaped: state && state.modifiersData.hide ? state.modifiersData.hide.hasPopperEscaped : null, isReferenceHidden: state && state.modifiersData.hide ? state.modifiersData.hide.isReferenceHidden : null, arrowProps: { style: styles.arrow, ref: setArrowElement }, forceUpdate: forceUpdate || NOOP, update: update || NOOP_PROMISE }; }), [setPopperElement, setArrowElement, placement, state, styles, update, forceUpdate]); return unwrapArray(children)(childrenProps); }
-            var warning = __webpack_require__(2219), warning_default = __webpack_require__.n(warning);
+            var warning = __webpack_require__(2224), warning_default = __webpack_require__.n(warning);
             function Reference(_ref) { var children = _ref.children, innerRef = _ref.innerRef, setReferenceNode = react.useContext(ManagerReferenceNodeSetterContext), refHandler = react.useCallback((function (node) { setRef(innerRef, node), safeInvoke(setReferenceNode, node); }), [innerRef, setReferenceNode]); return react.useEffect((function () { return function () { return setRef(innerRef, null); }; })), react.useEffect((function () { warning_default()(Boolean(setReferenceNode), "`Reference` should not be used outside of a `Manager` component."); }), [setReferenceNode]), unwrapArray(children)({ ref: refHandler }); }
             var TooltipContext = react_default.a.createContext({}), callAll = function callAll() { for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++)
                 fns[_key] = arguments[_key]; return function () { for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++)
@@ -258,7 +258,7 @@
                 style.transform = "translate3d(" + x + "px, " + y + "px, 0";
             } return react_default.a.createElement(react_popper_tooltip_Tooltip, Object(esm_extends.a)({ arrowProps: arrowProps, closeOnReferenceHidden: closeOnReferenceHidden, isReferenceHidden: isReferenceHidden, placement: placement, update: update, style: style, tooltip: tooltip, trigger: trigger, mutationObserverOptions: mutationObserverOptions }, { clearScheduled: _this2.clearScheduled, hideTooltip: _this2.hideTooltip, innerRef: ref })); })); return react_default.a.createElement(Manager, null, react_default.a.createElement(Reference, { innerRef: getTriggerRef }, (function (_ref4) { var ref = _ref4.ref; return children({ getTriggerProps: _this2.getTriggerProps, triggerRef: ref }); })), this.getState() && (usePortal ? Object(react_dom.createPortal)(popper, portalContainer) : popper)); }, _proto.isControlled = function isControlled() { return void 0 !== this.props.tooltipShown; }, _proto.getState = function getState() { return this.isControlled() ? this.props.tooltipShown : this.state.tooltipShown; }, _proto.isTriggeredBy = function isTriggeredBy(event) { var trigger = this.props.trigger; return trigger === event || Array.isArray(trigger) && trigger.includes(event); }, TooltipTrigger; }(react.Component);
             react_popper_tooltip_TooltipTrigger.defaultProps = { closeOnReferenceHidden: !0, defaultTooltipShown: !1, delayHide: 0, delayShow: 0, followCursor: !1, onVisibilityChange: function noop() { }, placement: "right", portalContainer: canUseDOM() ? document.body : null, trigger: "hover", usePortal: canUseDOM(), mutationObserverOptions: { childList: !0, subtree: !0 }, modifiers: [] };
-            var react_popper_tooltip = react_popper_tooltip_TooltipTrigger, memoizerific = (__webpack_require__(85), __webpack_require__(32), __webpack_require__(179), __webpack_require__(24), __webpack_require__(167)), memoizerific_default = __webpack_require__.n(memoizerific), utils = __webpack_require__(114);
+            var react_popper_tooltip = react_popper_tooltip_TooltipTrigger, memoizerific = (__webpack_require__(86), __webpack_require__(32), __webpack_require__(180), __webpack_require__(24), __webpack_require__(167)), memoizerific_default = __webpack_require__.n(memoizerific), utils = __webpack_require__(114);
             function _extends() { return _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) {
                 var source = arguments[i];
                 for (var key in source)