@laerdal/life-react-components 2.3.1-dev.7 → 3.0.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/dist/AuthPage/AuthPage.cjs +1 -1
- package/dist/AuthPage/AuthPage.cjs.map +1 -1
- package/dist/AuthPage/AuthPage.d.ts +1 -0
- package/dist/AuthPage/AuthPage.js +1 -1
- package/dist/AuthPage/AuthPage.js.map +1 -1
- package/dist/Breadcrumb/Breadcrumb.cjs +34 -32
- package/dist/Breadcrumb/Breadcrumb.cjs.map +1 -1
- package/dist/Breadcrumb/Breadcrumb.d.ts +1 -0
- package/dist/Breadcrumb/Breadcrumb.js +34 -32
- package/dist/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/Button/Iconbutton.cjs.map +1 -1
- package/dist/Button/Iconbutton.d.ts +1 -1
- package/dist/Button/Iconbutton.js.map +1 -1
- package/dist/Card/HorizontalCard/types.cjs.map +1 -1
- package/dist/Card/HorizontalCard/types.d.ts +1 -1
- package/dist/Card/HorizontalCard/types.js.map +1 -1
- package/dist/Dropdown/BasicDropdown.cjs +19 -5
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
- package/dist/Dropdown/BasicDropdown.d.ts +2 -0
- package/dist/Dropdown/BasicDropdown.js +19 -5
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +6 -3
- package/dist/Dropdown/CommonStyling.cjs.map +1 -1
- package/dist/Dropdown/CommonStyling.d.ts +3 -1
- package/dist/Dropdown/CommonStyling.js +6 -3
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownButtonTypes.d.ts +1 -0
- package/dist/Dropdown/DropdownFilter.cjs +14 -2
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.d.ts +1 -0
- package/dist/Dropdown/DropdownFilter.js +14 -2
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Footer/Components/FooterBottomLinks.d.ts +1 -0
- package/dist/Footer/Components/FooterDropdownLinks.d.ts +1 -0
- package/dist/Footer/Components/FooterNavSection.d.ts +1 -0
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.d.ts +1 -0
- package/dist/Footer/Components/FooterTop.d.ts +1 -0
- package/dist/Footer/Footer.d.ts +1 -0
- package/dist/Footer/SiteFooter.cjs +30 -19
- package/dist/Footer/SiteFooter.cjs.map +1 -1
- package/dist/Footer/SiteFooter.d.ts +3 -1
- package/dist/Footer/SiteFooter.js +31 -19
- package/dist/Footer/SiteFooter.js.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +3 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js +3 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs +2 -0
- package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/DesktopActions.js +2 -0
- package/dist/GlobalNavigationBar/desktop/DesktopActions.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs +7 -2
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.d.ts +5 -0
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js +6 -5
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs +205 -56
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.d.ts +2 -2
- package/dist/GlobalNavigationBar/desktop/MainMenu.js +205 -56
- package/dist/GlobalNavigationBar/desktop/MainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs +259 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.d.ts +21 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.js +249 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.js.map +1 -0
- package/dist/GlobalNavigationBar/desktop/UserMenu.d.ts +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenu.d.ts +1 -0
- package/dist/GlobalNavigationBar/types.cjs.map +1 -1
- package/dist/GlobalNavigationBar/types.d.ts +12 -2
- package/dist/GlobalNavigationBar/types.js.map +1 -1
- package/dist/GlobalNavigationBar/utils.cjs +17 -0
- package/dist/GlobalNavigationBar/utils.cjs.map +1 -0
- package/dist/GlobalNavigationBar/utils.d.ts +2 -0
- package/dist/GlobalNavigationBar/utils.js +10 -0
- package/dist/GlobalNavigationBar/utils.js.map +1 -0
- package/dist/InputFields/DatepickerField.cjs +23 -8
- package/dist/InputFields/DatepickerField.cjs.map +1 -1
- package/dist/InputFields/DatepickerField.d.ts +20 -1
- package/dist/InputFields/DatepickerField.js +23 -8
- package/dist/InputFields/DatepickerField.js.map +1 -1
- package/dist/InputFields/DatepickerFieldHeader.cjs +2 -4
- package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -1
- package/dist/InputFields/DatepickerFieldHeader.d.ts +1 -0
- package/dist/InputFields/DatepickerFieldHeader.js +2 -4
- package/dist/InputFields/DatepickerFieldHeader.js.map +1 -1
- package/dist/InputFields/Label.cjs.map +1 -1
- package/dist/InputFields/Label.d.ts +1 -1
- package/dist/InputFields/Label.js.map +1 -1
- package/dist/InputFields/NumberField.cjs +18 -6
- package/dist/InputFields/NumberField.cjs.map +1 -1
- package/dist/InputFields/NumberField.d.ts +17 -0
- package/dist/InputFields/NumberField.js +18 -6
- package/dist/InputFields/NumberField.js.map +1 -1
- package/dist/InputFields/PasswordField.cjs.map +1 -1
- package/dist/InputFields/PasswordField.d.ts +15 -1
- package/dist/InputFields/PasswordField.js.map +1 -1
- package/dist/InputFields/QuickSearch.cjs.map +1 -1
- package/dist/InputFields/QuickSearch.d.ts +1 -1
- package/dist/InputFields/QuickSearch.js.map +1 -1
- package/dist/InputFields/RadioButton.cjs.map +1 -1
- package/dist/InputFields/RadioButton.d.ts +16 -3
- package/dist/InputFields/RadioButton.js.map +1 -1
- package/dist/InputFields/SearchBar.cjs.map +1 -1
- package/dist/InputFields/SearchBar.d.ts +2 -2
- package/dist/InputFields/SearchBar.js.map +1 -1
- package/dist/InputFields/TextField.cjs +14 -2
- package/dist/InputFields/TextField.cjs.map +1 -1
- package/dist/InputFields/TextField.d.ts +22 -1
- package/dist/InputFields/TextField.js +14 -2
- package/dist/InputFields/TextField.js.map +1 -1
- package/dist/InputFields/index.cjs.map +1 -1
- package/dist/InputFields/index.d.ts +10 -8
- package/dist/InputFields/index.js.map +1 -1
- package/dist/InputFields/styling.cjs +7 -3
- package/dist/InputFields/styling.cjs.map +1 -1
- package/dist/InputFields/styling.d.ts +1 -0
- package/dist/InputFields/styling.js +7 -3
- package/dist/InputFields/styling.js.map +1 -1
- package/dist/InputFields/types.cjs.map +1 -1
- package/dist/InputFields/types.d.ts +0 -19
- package/dist/InputFields/types.js.map +1 -1
- package/dist/Layouts/index.cjs +4 -6
- package/dist/Layouts/index.cjs.map +1 -1
- package/dist/Layouts/index.d.ts +0 -1
- package/dist/Layouts/index.js +3 -4
- package/dist/Layouts/index.js.map +1 -1
- package/dist/LoadingIndicator/LoadingIndicator.d.ts +1 -0
- package/dist/MiniProductCard/MiniProductCard.d.ts +1 -0
- package/dist/Modals/ModalContent.cjs +1 -1
- package/dist/Modals/ModalContent.cjs.map +1 -1
- package/dist/Modals/ModalContent.js +1 -1
- package/dist/Modals/ModalContent.js.map +1 -1
- package/dist/Modals/ModalDialog.cjs +1 -1
- package/dist/Modals/ModalDialog.cjs.map +1 -1
- package/dist/Modals/ModalDialog.js +1 -1
- package/dist/Modals/ModalDialog.js.map +1 -1
- package/dist/NavItem/NavItem.cjs +2 -1
- package/dist/NavItem/NavItem.cjs.map +1 -1
- package/dist/NavItem/NavItem.d.ts +1 -0
- package/dist/NavItem/NavItem.js +1 -1
- package/dist/NavItem/NavItem.js.map +1 -1
- package/dist/NavItem/NestedNavItem.cjs +38 -0
- package/dist/NavItem/NestedNavItem.cjs.map +1 -0
- package/dist/NavItem/NestedNavItem.d.ts +13 -0
- package/dist/NavItem/NestedNavItem.js +28 -0
- package/dist/NavItem/NestedNavItem.js.map +1 -0
- package/dist/Paginator/Paginator.d.ts +1 -0
- package/dist/Panel/Panel.cjs +4 -4
- package/dist/Panel/Panel.cjs.map +1 -1
- package/dist/Panel/Panel.js +5 -5
- package/dist/Panel/Panel.js.map +1 -1
- package/dist/SideMenu/SideMenuBody.d.ts +1 -0
- package/dist/SideMenu/SideMenuFooter.d.ts +1 -0
- package/dist/SideMenu/SideMenuHeader.d.ts +1 -0
- package/dist/SideMenu/types.d.ts +1 -0
- package/dist/Switcher/MobileCustomMenuContent.cjs +3 -0
- package/dist/Switcher/MobileCustomMenuContent.cjs.map +1 -1
- package/dist/Switcher/MobileCustomMenuContent.d.ts +1 -0
- package/dist/Switcher/MobileCustomMenuContent.js +3 -0
- package/dist/Switcher/MobileCustomMenuContent.js.map +1 -1
- package/dist/Switcher/SwitcherMenuItem.d.ts +1 -0
- package/dist/Table/TableTypes.d.ts +1 -0
- package/dist/Tabs/TabLink.cjs +74 -48
- package/dist/Tabs/TabLink.cjs.map +1 -1
- package/dist/Tabs/TabLink.d.ts +14 -10
- package/dist/Tabs/TabLink.js +74 -48
- package/dist/Tabs/TabLink.js.map +1 -1
- package/dist/Tabs/VerticalTabs.cjs +2 -0
- package/dist/Tabs/VerticalTabs.cjs.map +1 -1
- package/dist/Tabs/VerticalTabs.d.ts +1 -0
- package/dist/Tabs/VerticalTabs.js +2 -0
- package/dist/Tabs/VerticalTabs.js.map +1 -1
- package/dist/Tile/TileCommonItems.cjs +3 -3
- package/dist/Tile/TileCommonItems.cjs.map +1 -1
- package/dist/Tile/TileCommonItems.d.ts +1 -0
- package/dist/Tile/TileCommonItems.js +3 -3
- package/dist/Tile/TileCommonItems.js.map +1 -1
- package/dist/Toggles/TogglerTypes.d.ts +1 -0
- package/dist/Tooltips/TooltipOverflow.cjs +112 -0
- package/dist/Tooltips/TooltipOverflow.cjs.map +1 -0
- package/dist/Tooltips/TooltipOverflow.d.ts +10 -0
- package/dist/Tooltips/TooltipOverflow.js +102 -0
- package/dist/Tooltips/TooltipOverflow.js.map +1 -0
- package/dist/Tooltips/TooltipStyles.cjs +8 -5
- package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
- package/dist/Tooltips/TooltipStyles.d.ts +3 -1
- package/dist/Tooltips/TooltipStyles.js +8 -5
- package/dist/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/Tooltips/TooltipTypes.d.ts +1 -0
- package/dist/Tooltips/TooltipWrapper.cjs +2 -1
- package/dist/Tooltips/TooltipWrapper.cjs.map +1 -1
- package/dist/Tooltips/TooltipWrapper.d.ts +1 -0
- package/dist/Tooltips/TooltipWrapper.js +2 -1
- package/dist/Tooltips/TooltipWrapper.js.map +1 -1
- package/dist/icons/contenticons/Stock.cjs +41 -0
- package/dist/icons/contenticons/Stock.cjs.map +1 -0
- package/dist/icons/contenticons/Stock.d.ts +3 -0
- package/dist/icons/contenticons/Stock.js +30 -0
- package/dist/icons/contenticons/Stock.js.map +1 -0
- package/dist/icons/contenticons/index.cjs +88 -0
- package/dist/icons/contenticons/index.cjs.map +1 -1
- package/dist/icons/contenticons/index.d.ts +8 -0
- package/dist/icons/contenticons/index.js +8 -0
- package/dist/icons/contenticons/index.js.map +1 -1
- package/dist/icons/index.cjs +1 -1
- package/dist/icons/index.cjs.map +1 -1
- package/dist/icons/index.js +1 -1
- package/dist/icons/index.js.map +1 -1
- package/dist/icons/systemicons/LegendStrokeDashed.cjs +41 -0
- package/dist/icons/systemicons/LegendStrokeDashed.cjs.map +1 -0
- package/dist/icons/systemicons/LegendStrokeDashed.d.ts +3 -0
- package/dist/icons/systemicons/LegendStrokeDashed.js +30 -0
- package/dist/icons/systemicons/LegendStrokeDashed.js.map +1 -0
- package/dist/icons/systemicons/LegendStrokeSolid.cjs +41 -0
- package/dist/icons/systemicons/LegendStrokeSolid.cjs.map +1 -0
- package/dist/icons/systemicons/LegendStrokeSolid.d.ts +3 -0
- package/dist/icons/systemicons/LegendStrokeSolid.js +30 -0
- package/dist/icons/systemicons/LegendStrokeSolid.js.map +1 -0
- package/dist/icons/systemicons/Pin.cjs +41 -0
- package/dist/icons/systemicons/Pin.cjs.map +1 -0
- package/dist/icons/systemicons/Pin.d.ts +3 -0
- package/dist/icons/systemicons/Pin.js +30 -0
- package/dist/icons/systemicons/Pin.js.map +1 -0
- package/dist/icons/systemicons/ZoomOut.cjs +41 -0
- package/dist/icons/systemicons/ZoomOut.cjs.map +1 -0
- package/dist/icons/systemicons/ZoomOut.d.ts +3 -0
- package/dist/icons/systemicons/ZoomOut.js +30 -0
- package/dist/icons/systemicons/ZoomOut.js.map +1 -0
- package/dist/icons/systemicons/index.cjs +250 -8
- package/dist/icons/systemicons/index.cjs.map +1 -1
- package/dist/icons/systemicons/index.d.ts +23 -1
- package/dist/icons/systemicons/index.js +23 -1
- package/dist/icons/systemicons/index.js.map +1 -1
- package/package.json +10 -10
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
4
|
+
import _pt from "prop-types";
|
|
5
|
+
var _excluded = ["label", "children", "input", "withArrow", "maxWidth", "width", "value", "size", "height", "align", "position"];
|
|
6
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
7
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
8
|
+
import * as React from 'react';
|
|
9
|
+
import { useResizeDetector } from 'react-resize-detector';
|
|
10
|
+
import { Tooltip } from './TooltipStyles';
|
|
11
|
+
import { Size } from '..';
|
|
12
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
|
+
var TooltipOverflow = function TooltipOverflow(_ref) {
|
|
15
|
+
var label = _ref.label,
|
|
16
|
+
children = _ref.children,
|
|
17
|
+
input = _ref.input,
|
|
18
|
+
withArrow = _ref.withArrow,
|
|
19
|
+
maxWidth = _ref.maxWidth,
|
|
20
|
+
width = _ref.width,
|
|
21
|
+
value = _ref.value,
|
|
22
|
+
_ref$size = _ref.size,
|
|
23
|
+
size = _ref$size === void 0 ? Size.Small : _ref$size,
|
|
24
|
+
_ref$height = _ref.height,
|
|
25
|
+
height = _ref$height === void 0 ? 'auto' : _ref$height,
|
|
26
|
+
_ref$align = _ref.align,
|
|
27
|
+
align = _ref$align === void 0 ? 'center' : _ref$align,
|
|
28
|
+
_ref$position = _ref.position,
|
|
29
|
+
position = _ref$position === void 0 ? 'top' : _ref$position,
|
|
30
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
31
|
+
var _React$useState = React.useState(false),
|
|
32
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
33
|
+
textOverflowed = _React$useState2[0],
|
|
34
|
+
setTextOverflowed = _React$useState2[1];
|
|
35
|
+
var _React$useState3 = React.useState(false),
|
|
36
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
37
|
+
focused = _React$useState4[0],
|
|
38
|
+
setFocused = _React$useState4[1];
|
|
39
|
+
var _useResizeDetector = useResizeDetector({
|
|
40
|
+
targetRef: input
|
|
41
|
+
}),
|
|
42
|
+
customW = _useResizeDetector.width,
|
|
43
|
+
customH = _useResizeDetector.height;
|
|
44
|
+
React.useEffect(function () {
|
|
45
|
+
checkIfOverflowed();
|
|
46
|
+
}, [customW, customH]);
|
|
47
|
+
var checkIfOverflowed = function checkIfOverflowed() {
|
|
48
|
+
var _ref2;
|
|
49
|
+
//adding +3 offset to offsetWidth, because sometimes when there is no overflow, scrollWidth can be equal to offsetWidth + 1
|
|
50
|
+
var over = (_ref2 = input && !focused && input.current && input.current.offsetWidth + 3 < input.current.scrollWidth) !== null && _ref2 !== void 0 ? _ref2 : false;
|
|
51
|
+
setTextOverflowed(over);
|
|
52
|
+
};
|
|
53
|
+
React.useEffect(function () {
|
|
54
|
+
checkIfOverflowed();
|
|
55
|
+
});
|
|
56
|
+
var onFocus = function onFocus() {
|
|
57
|
+
checkIfOverflowed();
|
|
58
|
+
setFocused(true);
|
|
59
|
+
};
|
|
60
|
+
var onBlur = function onBlur() {
|
|
61
|
+
setFocused(false);
|
|
62
|
+
};
|
|
63
|
+
React.useEffect(function () {
|
|
64
|
+
return function () {
|
|
65
|
+
if (input !== null && input !== void 0 && input.current) {
|
|
66
|
+
input === null || input === void 0 ? void 0 : input.current.removeEventListener("focus", onFocus);
|
|
67
|
+
input === null || input === void 0 ? void 0 : input.current.removeEventListener("blur", onBlur);
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
}, []);
|
|
71
|
+
var renderedCallback = React.useCallback(function () {
|
|
72
|
+
if (input && input.current) {
|
|
73
|
+
input.current.addEventListener("focus", onFocus);
|
|
74
|
+
input.current.addEventListener("blur", onBlur);
|
|
75
|
+
checkIfOverflowed();
|
|
76
|
+
}
|
|
77
|
+
}, []);
|
|
78
|
+
return /*#__PURE__*/_jsx("div", {
|
|
79
|
+
ref: renderedCallback,
|
|
80
|
+
children: textOverflowed && /*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({
|
|
81
|
+
align: align,
|
|
82
|
+
height: height,
|
|
83
|
+
role: "tooltip",
|
|
84
|
+
maxWidth: maxWidth,
|
|
85
|
+
width: width,
|
|
86
|
+
size: size,
|
|
87
|
+
withArrow: withArrow,
|
|
88
|
+
position: position
|
|
89
|
+
}, props), {}, {
|
|
90
|
+
children: /*#__PURE__*/_jsxs("span", {
|
|
91
|
+
children: [children, " "]
|
|
92
|
+
})
|
|
93
|
+
}))
|
|
94
|
+
});
|
|
95
|
+
};
|
|
96
|
+
TooltipOverflow.propTypes = {
|
|
97
|
+
maxWidth: _pt.string,
|
|
98
|
+
width: _pt.string,
|
|
99
|
+
value: _pt.string
|
|
100
|
+
};
|
|
101
|
+
export default TooltipOverflow;
|
|
102
|
+
//# sourceMappingURL=TooltipOverflow.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TooltipOverflow.js","names":["React","useResizeDetector","Tooltip","Size","TooltipOverflow","label","children","input","withArrow","maxWidth","width","value","size","Small","height","align","position","props","useState","textOverflowed","setTextOverflowed","focused","setFocused","targetRef","customW","customH","useEffect","checkIfOverflowed","over","current","offsetWidth","scrollWidth","onFocus","onBlur","removeEventListener","renderedCallback","useCallback","addEventListener"],"sources":["../../src/Tooltips/TooltipOverflow.tsx"],"sourcesContent":["\nimport * as React from 'react';\n\nimport { TooltipProps } from './TooltipTypes';\nimport { useResizeDetector } from 'react-resize-detector';\n\nimport { TooltipContainer, Tooltip } from './TooltipStyles';\nimport { Size } from '..';\n \ninterface TooltipOverflowProps extends TooltipProps {\n input?: React.MutableRefObject<HTMLInputElement | null>;\n maxWidth?: string;\n width?: string;\n value?: string;\n}\n\n const TooltipOverflow = ({\n label, children,\n input,\n withArrow,\n maxWidth,\n width,\n value,\n size = Size.Small,\n height = 'auto',\n align = 'center', \n position = 'top',\n ...props } : TooltipOverflowProps) => {\n\n const [textOverflowed, setTextOverflowed] = React.useState<boolean>(false);\n const [focused, setFocused] = React.useState<boolean>(false);\n const {width: customW, height: customH} = useResizeDetector({ targetRef: input });\n\n React.useEffect(() => {\n checkIfOverflowed();\n }, [customW, customH]);\n\n const checkIfOverflowed = () => {\n //adding +3 offset to offsetWidth, because sometimes when there is no overflow, scrollWidth can be equal to offsetWidth + 1\n const over = (input && !focused && input.current && input.current.offsetWidth + 3 < input.current.scrollWidth) ?? false;\n setTextOverflowed(over);\n };\n\n React.useEffect(() => {\n checkIfOverflowed();\n });\n\n const onFocus = () => {\n checkIfOverflowed();\n setFocused(true);\n };\n\n const onBlur = () => {\n setFocused(false);\n };\n\n React.useEffect(() => {\n return () => {\n if(input?.current)\n {\n input?.current.removeEventListener(\"focus\", onFocus);\n input?.current.removeEventListener(\"blur\", onBlur);\n }\n }\n }, []);\n\n const renderedCallback = React.useCallback(() => {\n if(input && input.current)\n {\n input.current.addEventListener(\"focus\", onFocus);\n input.current.addEventListener(\"blur\", onBlur);\n checkIfOverflowed();\n }\n }, []);\n \n return <div ref={renderedCallback}>{textOverflowed && <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n maxWidth={maxWidth}\n width={width}\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n <span>\n {children} </span>\n </Tooltip> }</div>;\n };\n \n export default TooltipOverflow;\n"],"mappings":"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"}
|
|
@@ -18,7 +18,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
18
18
|
var distanceToEdge = function distanceToEdge(size) {
|
|
19
19
|
return size == _types.Size.XSmall ? '8px' : !size || size == _types.Size.Small ? '12px' : '16px';
|
|
20
20
|
};
|
|
21
|
-
var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n
|
|
21
|
+
var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n pointer-events: none;\n ", "\n ", "\n ", "\n ", "\n box-shadow: ", ";\n box-sizing: border-box;\n\n padding: ", ";\n border-radius: 2px;\n ", "\n height: ", ";\n max-width: ", ";\n background: ", ";\n position: absolute;\n opacity: 0;\n z-index: ", ";\n ", "\n\n ", "\n ", "\n \n ", "\n\n\n&::after {\n ", "\n content: \"\";\n position: absolute;\n ", "\n\n ", "\n ", "\n\n ", "\n\n ", "\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ", " ", "\n ", " ", ";\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n"])), function (props) {
|
|
22
22
|
return props.size == _types.Size.Small || props.size != _types.Size.Medium ? (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.white) : '';
|
|
23
23
|
}, function (props) {
|
|
24
24
|
return props.size == _types.Size.XSmall ? (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.white) : '';
|
|
@@ -32,6 +32,9 @@ var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject
|
|
|
32
32
|
return props.width ? "width: ".concat(props.width, ";") : 'width: max-content;';
|
|
33
33
|
}, function (props) {
|
|
34
34
|
return props.height;
|
|
35
|
+
}, function (props) {
|
|
36
|
+
var _props$maxWidth;
|
|
37
|
+
return (_props$maxWidth = props.maxWidth) !== null && _props$maxWidth !== void 0 ? _props$maxWidth : '34em';
|
|
35
38
|
}, _styles.COLORS.primary_800, _zIndexes.Z_INDEXES.tooltip, function (props) {
|
|
36
39
|
return props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '';
|
|
37
40
|
}, function (props) {
|
|
@@ -69,12 +72,12 @@ Tooltip.defaultProps = {
|
|
|
69
72
|
align: 'center',
|
|
70
73
|
position: 'bottom'
|
|
71
74
|
};
|
|
72
|
-
var TooltipTrigger = function TooltipTrigger(delay) {
|
|
73
|
-
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n
|
|
75
|
+
var TooltipTrigger = function TooltipTrigger(triggerType, delay) {
|
|
76
|
+
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n"])), triggerType == 'hover' ? "&:hover ".concat(Tooltip, ", &:focus-within ").concat(Tooltip, ", &:focus ").concat(Tooltip, " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0.7s', ";\n }") : "& ".concat(Tooltip, " {\n transition: 0.5s;\n transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0s', ";\n }\n \n &.show ").concat(Tooltip, " {\n opacity: 1;\n }\n \n &.hide ").concat(Tooltip, " {\n opacity: 0;\n }"));
|
|
74
77
|
};
|
|
75
78
|
exports.TooltipTrigger = TooltipTrigger;
|
|
76
|
-
var TooltipContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n position: relative;\n\n ", "\n
|
|
77
|
-
return TooltipTrigger(props.delay);
|
|
79
|
+
var TooltipContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n position: relative;\n\n ", "\n\n &:focus {\n ", "\n }\n"])), function (props) {
|
|
80
|
+
return TooltipTrigger(props.triggerType, props.delay);
|
|
78
81
|
}, _styles.focusStyles);
|
|
79
82
|
exports.TooltipContainer = TooltipContainer;
|
|
80
83
|
//# sourceMappingURL=TooltipStyles.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipStyles.cjs","names":["distanceToEdge","size","Size","XSmall","Small","Tooltip","styled","div","props","Medium","ComponentSStyling","ComponentTextStyle","Regular","COLORS","white","ComponentXSStyling","ComponentMStyling","align","BOXSHADOWS","BOXSHADOW_L2","width","height","primary_800","Z_INDEXES","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","css","TooltipContainer","focusStyles"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' :
|
|
1
|
+
{"version":3,"file":"TooltipStyles.cjs","names":["distanceToEdge","size","Size","XSmall","Small","Tooltip","styled","div","props","Medium","ComponentSStyling","ComponentTextStyle","Regular","COLORS","white","ComponentXSStyling","ComponentMStyling","align","BOXSHADOWS","BOXSHADOW_L2","width","height","maxWidth","primary_800","Z_INDEXES","tooltip","position","withArrow","defaultProps","TooltipTrigger","triggerType","delay","css","TooltipContainer","focusStyles"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport { BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles } from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : !size || size == Size.Small ? '12px' : '16px';\n};\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n maxWidth?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n pointer-events: none;\n ${(props) => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${(props) => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${(props) => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${(props) => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n box-sizing: border-box;\n\n padding: ${(props) => (props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px')};\n border-radius: 2px;\n ${(props) => (props.width ? `width: ${props.width};` : 'width: max-content;')}\n height: ${(props) => props.height};\n max-width: ${(props) => props.maxWidth ?? '34em'};\n background: ${COLORS.primary_800};\n position: absolute;\n opacity: 0;\n z-index: ${Z_INDEXES.tooltip};\n ${(props) => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${(props) => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${(props) => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${(props) =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${(props) => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${(props) => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n\n ${(props) => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${(props) => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${(props) =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? `left: ${distanceToEdge(props.size)};`\n : props.align == 'end'\n ? `right: ${distanceToEdge(props.size)};`\n : 'left: 50%;'}\n\n ${(props) => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${(props) => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'right' ? COLORS.primary_800 : 'transparent')}\n ${(props) => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom',\n};\n\nexport const TooltipTrigger = (triggerType: 'hover' | 'click', delay?: string) => css`\n ${triggerType == 'hover'\n ? `&:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '0.7s'};\n }`\n : `& ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n \n &.show ${Tooltip} {\n opacity: 1;\n }\n \n &.hide ${Tooltip} {\n opacity: 0;\n }`}\n`;\n\nexport const TooltipContainer = styled.div<{ triggerType: 'hover' | 'click', delay?: string }>`\n display: inline-block;\n position: relative;\n\n ${(props) => TooltipTrigger(props.triggerType, props.delay)}\n\n &:focus {\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
|
|
@@ -3,11 +3,13 @@ export declare const Tooltip: import("styled-components").StyledComponent<"div",
|
|
|
3
3
|
withArrow?: boolean | undefined;
|
|
4
4
|
size?: Size | undefined;
|
|
5
5
|
height?: string | undefined;
|
|
6
|
+
maxWidth?: string | undefined;
|
|
6
7
|
align?: 'start' | 'end' | 'center' | undefined;
|
|
7
8
|
position?: 'top' | 'right' | 'bottom' | 'left' | undefined;
|
|
8
9
|
width?: string | undefined;
|
|
9
10
|
}, never>;
|
|
10
|
-
export declare const TooltipTrigger: (delay?: string) => import("styled-components").FlattenSimpleInterpolation;
|
|
11
|
+
export declare const TooltipTrigger: (triggerType: 'hover' | 'click', delay?: string) => import("styled-components").FlattenSimpleInterpolation;
|
|
11
12
|
export declare const TooltipContainer: import("styled-components").StyledComponent<"div", any, {
|
|
13
|
+
triggerType: 'hover' | 'click';
|
|
12
14
|
delay?: string | undefined;
|
|
13
15
|
}, never>;
|
|
@@ -8,7 +8,7 @@ import { Z_INDEXES } from '../styles/z-indexes';
|
|
|
8
8
|
var distanceToEdge = function distanceToEdge(size) {
|
|
9
9
|
return size == Size.XSmall ? '8px' : !size || size == Size.Small ? '12px' : '16px';
|
|
10
10
|
};
|
|
11
|
-
export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n
|
|
11
|
+
export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n pointer-events: none;\n ", "\n ", "\n ", "\n ", "\n box-shadow: ", ";\n box-sizing: border-box;\n\n padding: ", ";\n border-radius: 2px;\n ", "\n height: ", ";\n max-width: ", ";\n background: ", ";\n position: absolute;\n opacity: 0;\n z-index: ", ";\n ", "\n\n ", "\n ", "\n \n ", "\n\n\n&::after {\n ", "\n content: \"\";\n position: absolute;\n ", "\n\n ", "\n ", "\n\n ", "\n\n ", "\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ", " ", "\n ", " ", ";\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n"])), function (props) {
|
|
12
12
|
return props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '';
|
|
13
13
|
}, function (props) {
|
|
14
14
|
return props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '';
|
|
@@ -22,6 +22,9 @@ export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTem
|
|
|
22
22
|
return props.width ? "width: ".concat(props.width, ";") : 'width: max-content;';
|
|
23
23
|
}, function (props) {
|
|
24
24
|
return props.height;
|
|
25
|
+
}, function (props) {
|
|
26
|
+
var _props$maxWidth;
|
|
27
|
+
return (_props$maxWidth = props.maxWidth) !== null && _props$maxWidth !== void 0 ? _props$maxWidth : '34em';
|
|
25
28
|
}, COLORS.primary_800, Z_INDEXES.tooltip, function (props) {
|
|
26
29
|
return props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '';
|
|
27
30
|
}, function (props) {
|
|
@@ -58,10 +61,10 @@ Tooltip.defaultProps = {
|
|
|
58
61
|
align: 'center',
|
|
59
62
|
position: 'bottom'
|
|
60
63
|
};
|
|
61
|
-
export var TooltipTrigger = function TooltipTrigger(delay) {
|
|
62
|
-
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n
|
|
64
|
+
export var TooltipTrigger = function TooltipTrigger(triggerType, delay) {
|
|
65
|
+
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", "\n"])), triggerType == 'hover' ? "&:hover ".concat(Tooltip, ", &:focus-within ").concat(Tooltip, ", &:focus ").concat(Tooltip, " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0.7s', ";\n }") : "& ".concat(Tooltip, " {\n transition: 0.5s;\n transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0s', ";\n }\n \n &.show ").concat(Tooltip, " {\n opacity: 1;\n }\n \n &.hide ").concat(Tooltip, " {\n opacity: 0;\n }"));
|
|
63
66
|
};
|
|
64
|
-
export var TooltipContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n\n ", "\n
|
|
65
|
-
return TooltipTrigger(props.delay);
|
|
67
|
+
export var TooltipContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n\n ", "\n\n &:focus {\n ", "\n }\n"])), function (props) {
|
|
68
|
+
return TooltipTrigger(props.triggerType, props.delay);
|
|
66
69
|
}, focusStyles);
|
|
67
70
|
//# sourceMappingURL=TooltipStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipStyles.js","names":["styled","css","Size","BOXSHADOWS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","distanceToEdge","size","XSmall","Small","Tooltip","div","props","Medium","Regular","white","align","BOXSHADOW_L2","width","height","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' :
|
|
1
|
+
{"version":3,"file":"TooltipStyles.js","names":["styled","css","Size","BOXSHADOWS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","distanceToEdge","size","XSmall","Small","Tooltip","div","props","Medium","Regular","white","align","BOXSHADOW_L2","width","height","maxWidth","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","triggerType","delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport { BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles } from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : !size || size == Size.Small ? '12px' : '16px';\n};\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n maxWidth?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n pointer-events: none;\n ${(props) => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${(props) => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${(props) => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${(props) => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n box-sizing: border-box;\n\n padding: ${(props) => (props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px')};\n border-radius: 2px;\n ${(props) => (props.width ? `width: ${props.width};` : 'width: max-content;')}\n height: ${(props) => props.height};\n max-width: ${(props) => props.maxWidth ?? '34em'};\n background: ${COLORS.primary_800};\n position: absolute;\n opacity: 0;\n z-index: ${Z_INDEXES.tooltip};\n ${(props) => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${(props) => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${(props) => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${(props) =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${(props) => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${(props) => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n\n ${(props) => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${(props) => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${(props) =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? `left: ${distanceToEdge(props.size)};`\n : props.align == 'end'\n ? `right: ${distanceToEdge(props.size)};`\n : 'left: 50%;'}\n\n ${(props) => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${(props) => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'right' ? COLORS.primary_800 : 'transparent')}\n ${(props) => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom',\n};\n\nexport const TooltipTrigger = (triggerType: 'hover' | 'click', delay?: string) => css`\n ${triggerType == 'hover'\n ? `&:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '0.7s'};\n }`\n : `& ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n \n &.show ${Tooltip} {\n opacity: 1;\n }\n \n &.hide ${Tooltip} {\n opacity: 0;\n }`}\n`;\n\nexport const TooltipContainer = styled.div<{ triggerType: 'hover' | 'click', delay?: string }>`\n display: inline-block;\n position: relative;\n\n ${(props) => TooltipTrigger(props.triggerType, props.delay)}\n\n &:focus {\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
|
|
@@ -78,11 +78,12 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
|
|
|
78
78
|
};
|
|
79
79
|
}
|
|
80
80
|
}, [trigger]);
|
|
81
|
-
var cls = "".concat(trigger
|
|
81
|
+
var cls = "".concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
|
|
82
82
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TooltipStyles.TooltipContainer, {
|
|
83
83
|
ref: ref,
|
|
84
84
|
delay: delay,
|
|
85
85
|
tabIndex: tabIndex,
|
|
86
|
+
triggerType: trigger,
|
|
86
87
|
className: cls,
|
|
87
88
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipStyles.Tooltip, _objectSpread(_objectSpread({
|
|
88
89
|
align: align,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipWrapper.cjs","names":["TooltipWrapper","label","children","withArrow","tabIndex","size","Size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","React","useState","showTooltip","setShowTooltip","timeoutRef","useRef","ref","useClickOutsideRef","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","useEffect","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {useClickOutsideRef} from '../common';\nimport {useEffect, useRef} from \"react\";\nimport {Size} from \"../types\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger
|
|
1
|
+
{"version":3,"file":"TooltipWrapper.cjs","names":["TooltipWrapper","label","children","withArrow","tabIndex","size","Size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","React","useState","showTooltip","setShowTooltip","timeoutRef","useRef","ref","useClickOutsideRef","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","useEffect","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {useClickOutsideRef} from '../common';\nimport {useEffect, useRef} from \"react\";\nimport {Size} from \"../types\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n triggerType={trigger}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":"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"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { TooltipProps } from './TooltipTypes';
|
|
2
3
|
declare const TooltipWrapper: ({ label, children, withArrow, tabIndex, size, height, delay, align, position, trigger, hideAfter, ...props }: TooltipProps) => JSX.Element;
|
|
3
4
|
export default TooltipWrapper;
|
|
@@ -70,11 +70,12 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
|
|
|
70
70
|
};
|
|
71
71
|
}
|
|
72
72
|
}, [trigger]);
|
|
73
|
-
var cls = "".concat(trigger
|
|
73
|
+
var cls = "".concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
|
|
74
74
|
return /*#__PURE__*/_jsxs(TooltipContainer, {
|
|
75
75
|
ref: ref,
|
|
76
76
|
delay: delay,
|
|
77
77
|
tabIndex: tabIndex,
|
|
78
|
+
triggerType: trigger,
|
|
78
79
|
className: cls,
|
|
79
80
|
children: [/*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({
|
|
80
81
|
align: align,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","useClickOutsideRef","useEffect","useRef","Size","TooltipWrapper","label","children","withArrow","tabIndex","size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","useState","showTooltip","setShowTooltip","timeoutRef","ref","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {useClickOutsideRef} from '../common';\nimport {useEffect, useRef} from \"react\";\nimport {Size} from \"../types\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger
|
|
1
|
+
{"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","useClickOutsideRef","useEffect","useRef","Size","TooltipWrapper","label","children","withArrow","tabIndex","size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","useState","showTooltip","setShowTooltip","timeoutRef","ref","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {useClickOutsideRef} from '../common';\nimport {useEffect, useRef} from \"react\";\nimport {Size} from \"../types\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n triggerType={trigger}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.Stock = void 0;
|
|
9
|
+
var React = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _index = require("../index");
|
|
11
|
+
var _reactInlinesvg = _interopRequireDefault(require("react-inlinesvg"));
|
|
12
|
+
var _figmaSvg = require("@laerdal/figma-svg");
|
|
13
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
16
|
+
var Stock = function Stock(_ref) {
|
|
17
|
+
var className = _ref.className,
|
|
18
|
+
_ref$color = _ref.color,
|
|
19
|
+
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
20
|
+
_ref$size = _ref.size,
|
|
21
|
+
size = _ref$size === void 0 ? '48px' : _ref$size,
|
|
22
|
+
_ref$label = _ref.label,
|
|
23
|
+
label = _ref$label === void 0 ? '' : _ref$label,
|
|
24
|
+
_ref$viewBox = _ref.viewBox,
|
|
25
|
+
viewBox = _ref$viewBox === void 0 ? '0 0 48 48' : _ref$viewBox;
|
|
26
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ContentIcon, {
|
|
27
|
+
tooltip: label,
|
|
28
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactInlinesvg.default, {
|
|
29
|
+
src: _figmaSvg.ContentIcons.Stock,
|
|
30
|
+
height: (0, _index.getSize)(size),
|
|
31
|
+
width: (0, _index.getSize)(size),
|
|
32
|
+
className: className,
|
|
33
|
+
viewBox: viewBox,
|
|
34
|
+
preProcessor: function preProcessor(content) {
|
|
35
|
+
return (0, _index.formatSvgString)(content, color);
|
|
36
|
+
}
|
|
37
|
+
})
|
|
38
|
+
});
|
|
39
|
+
};
|
|
40
|
+
exports.Stock = Stock;
|
|
41
|
+
//# sourceMappingURL=Stock.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Stock.cjs","names":["Stock","className","color","size","label","viewBox","CI","getSize","content","formatSvgString"],"sources":["../../../src/icons/contenticons/Stock.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {ContentIcon, formatSvgString, getSize, IconProps} from \"../index\";\nimport SVG from \"react-inlinesvg\";\nimport {ContentIcons as CI} from \"@laerdal/figma-svg\";\n\nexport const Stock: React.FunctionComponent<IconProps> = ({\n className,\n color = 'currentColor',\n size = '48px',\n label = '',\n viewBox = '0 0 48 48'\n }) => (\n <ContentIcon tooltip={label}>\n <SVG src={CI.Stock} height={getSize(size)} width={getSize(size)} className={className} viewBox={viewBox}\n preProcessor={content => formatSvgString(content, color)}/>\n </ContentIcon>\n);\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AAAsD;AAAA;AAAA;AAE/C,IAAMA,KAAyC,GAAG,SAA5CA,KAAyC;EAAA,IACMC,SAAS,QAATA,SAAS;IAAA,kBACTC,KAAK;IAALA,KAAK,2BAAG,cAAc;IAAA,iBACtBC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IAAA,kBACbC,KAAK;IAALA,KAAK,2BAAG,EAAE;IAAA,oBACVC,OAAO;IAAPA,OAAO,6BAAG,WAAW;EAAA,oBAE/E,qBAAC,kBAAW;IAAC,OAAO,EAAED,KAAM;IAAA,uBAC1B,qBAAC,uBAAG;MAAC,GAAG,EAAEE,sBAAE,CAACN,KAAM;MAAC,MAAM,EAAE,IAAAO,cAAO,EAACJ,IAAI,CAAE;MAAC,KAAK,EAAE,IAAAI,cAAO,EAACJ,IAAI,CAAE;MAAC,SAAS,EAAEF,SAAU;MAAC,OAAO,EAAEI,OAAQ;MACnG,YAAY,EAAE,sBAAAG,OAAO;QAAA,OAAI,IAAAC,sBAAe,EAACD,OAAO,EAAEN,KAAK,CAAC;MAAA;IAAC;EAAE,EACpD;AAAA,CACf;AAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { ContentIcon, formatSvgString, getSize } from "../index";
|
|
3
|
+
import SVG from "react-inlinesvg";
|
|
4
|
+
import { ContentIcons as CI } from "@laerdal/figma-svg";
|
|
5
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
+
export var Stock = function Stock(_ref) {
|
|
7
|
+
var className = _ref.className,
|
|
8
|
+
_ref$color = _ref.color,
|
|
9
|
+
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
10
|
+
_ref$size = _ref.size,
|
|
11
|
+
size = _ref$size === void 0 ? '48px' : _ref$size,
|
|
12
|
+
_ref$label = _ref.label,
|
|
13
|
+
label = _ref$label === void 0 ? '' : _ref$label,
|
|
14
|
+
_ref$viewBox = _ref.viewBox,
|
|
15
|
+
viewBox = _ref$viewBox === void 0 ? '0 0 48 48' : _ref$viewBox;
|
|
16
|
+
return /*#__PURE__*/_jsx(ContentIcon, {
|
|
17
|
+
tooltip: label,
|
|
18
|
+
children: /*#__PURE__*/_jsx(SVG, {
|
|
19
|
+
src: CI.Stock,
|
|
20
|
+
height: getSize(size),
|
|
21
|
+
width: getSize(size),
|
|
22
|
+
className: className,
|
|
23
|
+
viewBox: viewBox,
|
|
24
|
+
preProcessor: function preProcessor(content) {
|
|
25
|
+
return formatSvgString(content, color);
|
|
26
|
+
}
|
|
27
|
+
})
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
//# sourceMappingURL=Stock.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Stock.js","names":["React","ContentIcon","formatSvgString","getSize","SVG","ContentIcons","CI","Stock","className","color","size","label","viewBox","content"],"sources":["../../../src/icons/contenticons/Stock.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {ContentIcon, formatSvgString, getSize, IconProps} from \"../index\";\nimport SVG from \"react-inlinesvg\";\nimport {ContentIcons as CI} from \"@laerdal/figma-svg\";\n\nexport const Stock: React.FunctionComponent<IconProps> = ({\n className,\n color = 'currentColor',\n size = '48px',\n label = '',\n viewBox = '0 0 48 48'\n }) => (\n <ContentIcon tooltip={label}>\n <SVG src={CI.Stock} height={getSize(size)} width={getSize(size)} className={className} viewBox={viewBox}\n preProcessor={content => formatSvgString(content, color)}/>\n </ContentIcon>\n);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAAQC,WAAW,EAAEC,eAAe,EAAEC,OAAO,QAAkB,UAAU;AACzE,OAAOC,GAAG,MAAM,iBAAiB;AACjC,SAAQC,YAAY,IAAIC,EAAE,QAAO,oBAAoB;AAAC;AAEtD,OAAO,IAAMC,KAAyC,GAAG,SAA5CA,KAAyC;EAAA,IACMC,SAAS,QAATA,SAAS;IAAA,kBACTC,KAAK;IAALA,KAAK,2BAAG,cAAc;IAAA,iBACtBC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IAAA,kBACbC,KAAK;IAALA,KAAK,2BAAG,EAAE;IAAA,oBACVC,OAAO;IAAPA,OAAO,6BAAG,WAAW;EAAA,oBAE/E,KAAC,WAAW;IAAC,OAAO,EAAED,KAAM;IAAA,uBAC1B,KAAC,GAAG;MAAC,GAAG,EAAEL,EAAE,CAACC,KAAM;MAAC,MAAM,EAAEJ,OAAO,CAACO,IAAI,CAAE;MAAC,KAAK,EAAEP,OAAO,CAACO,IAAI,CAAE;MAAC,SAAS,EAAEF,SAAU;MAAC,OAAO,EAAEI,OAAQ;MACnG,YAAY,EAAE,sBAAAC,OAAO;QAAA,OAAIX,eAAe,CAACW,OAAO,EAAEJ,KAAK,CAAC;MAAA;IAAC;EAAE,EACpD;AAAA,CACf"}
|