oolib 2.225.4 → 2.225.6
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.
|
@@ -13,7 +13,7 @@ var themes_1 = require("../../../themes");
|
|
|
13
13
|
var getDynamicColors_1 = require("../../../themes/utils/getDynamicColors");
|
|
14
14
|
var mixins_1 = require("../../../../themes/mixins");
|
|
15
15
|
var grey10 = themes_1.colors.grey10;
|
|
16
|
-
exports.StyledListItemWrapper = styled_components_1.default.li(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n /* padding: ", "; */\n padding: 0.8rem;\n border-radius: 0.4rem;\n gap: 1rem;\n\n justify-content: space-between;\n\n background-color: ", ";\n\n .OKE-Dropdown__optionText {\n color: ", ";\n }\n\n .OKE-Dropdown__optionIcon {\n color: ", ";\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:first-of-type {\n /* margin-top: 0.4rem; */\n }\n\n &:last-of-type {\n /* margin-bottom: 0.4rem; */\n }\n\n .OKE-Dropdown__optionDesc {\n
|
|
16
|
+
exports.StyledListItemWrapper = styled_components_1.default.li(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n /* padding: ", "; */\n padding: 0.8rem;\n border-radius: 0.4rem;\n gap: 1rem;\n\n justify-content: space-between;\n\n background-color: ", ";\n\n .OKE-Dropdown__optionText {\n color: ", ";\n }\n\n .OKE-Dropdown__optionIcon {\n color: ", ";\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:first-of-type {\n /* margin-top: 0.4rem; */\n }\n\n &:last-of-type {\n /* margin-bottom: 0.4rem; */\n }\n\n .OKE-Dropdown__optionDesc {\n ", "\n }\n\n .OKE-Dropdown__optionImg {\n flex: 0 0 auto;\n }\n\n .OKE-Dropdown__checkboxClickArea {\n position: absolute;\n width: 2rem;\n height: 2rem;\n }\n .OKE-Dropdown__checkboxClickArea-box {\n margin-top: 0.2rem;\n flex-shrink: 0;\n }\n"], ["\n display: flex;\n align-items: center;\n /* padding: ", "; */\n padding: 0.8rem;\n border-radius: 0.4rem;\n gap: 1rem;\n\n justify-content: space-between;\n\n background-color: ", ";\n\n .OKE-Dropdown__optionText {\n color: ", ";\n }\n\n .OKE-Dropdown__optionIcon {\n color: ", ";\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:first-of-type {\n /* margin-top: 0.4rem; */\n }\n\n &:last-of-type {\n /* margin-bottom: 0.4rem; */\n }\n\n .OKE-Dropdown__optionDesc {\n ", "\n }\n\n .OKE-Dropdown__optionImg {\n flex: 0 0 auto;\n }\n\n .OKE-Dropdown__checkboxClickArea {\n position: absolute;\n width: 2rem;\n height: 2rem;\n }\n .OKE-Dropdown__checkboxClickArea-box {\n margin-top: 0.2rem;\n flex-shrink: 0;\n }\n"])), function (_a) {
|
|
17
17
|
var S = _a.S;
|
|
18
18
|
return (S ? "0.8rem" : "0.6rem 0.8rem");
|
|
19
19
|
}, function (_a) {
|
|
@@ -28,7 +28,7 @@ exports.StyledListItemWrapper = styled_components_1.default.li(templateObject_1
|
|
|
28
28
|
}, themes_1.colors.grey80, themes_1.colors.grey80, function (_a) {
|
|
29
29
|
var theme = _a.theme;
|
|
30
30
|
return "".concat(grey10);
|
|
31
|
-
});
|
|
31
|
+
}, (0, mixins_1.clampText)(3));
|
|
32
32
|
exports.StyledRightSection = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n margin-top: 0.1rem;\n display: flex;\n gap: 0.5rem;\n align-self: flex-start;\n justify-content: space-between;\n"], ["\n margin-top: 0.1rem;\n display: flex;\n gap: 0.5rem;\n align-self: flex-start;\n justify-content: space-between;\n"])));
|
|
33
|
-
exports.StyledWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n
|
|
33
|
+
exports.StyledWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n min-width: 0;\n"], ["\n min-width: 0;\n"])));
|
|
34
34
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { TooltipProps } from './types';
|
|
3
|
-
export default function Tooltip({ text, heading, primaryContent, secondaryContent, progressiveDelay, progressiveGap, children, placement, showPointer, showDelay, hideDelay, animation, followCursor, cursorOffset, invert, wrapperDisplay, trigger, }: TooltipProps): React.JSX.Element;
|
|
3
|
+
export default function Tooltip({ text, heading, primaryContent, secondaryContent, progressiveDelay, progressiveGap, children, placement, showPointer, showDelay, hideDelay, animation, followCursor, cursorOffset, invert, wrapperDisplay, trigger, style, }: TooltipProps): React.JSX.Element;
|
|
@@ -53,7 +53,7 @@ var utils_1 = require("./utils");
|
|
|
53
53
|
var styled_1 = require("./styled");
|
|
54
54
|
var CURSOR_HEIGHT = 20;
|
|
55
55
|
function Tooltip(_a) {
|
|
56
|
-
var text = _a.text, heading = _a.heading, primaryContent = _a.primaryContent, secondaryContent = _a.secondaryContent, _b = _a.progressiveDelay, progressiveDelay = _b === void 0 ? 1000 : _b, _c = _a.progressiveGap, progressiveGap = _c === void 0 ? 8 : _c, children = _a.children, _d = _a.placement, placement = _d === void 0 ? 'top' : _d, _e = _a.showPointer, showPointer = _e === void 0 ? true : _e, _f = _a.showDelay, showDelay = _f === void 0 ? 0 : _f, _g = _a.hideDelay, hideDelay = _g === void 0 ? 0 : _g, _h = _a.animation, animation = _h === void 0 ? 'none' : _h, _j = _a.followCursor, followCursor = _j === void 0 ? false : _j, _k = _a.cursorOffset, cursorOffset = _k === void 0 ? 10 : _k, _l = _a.invert, invert = _l === void 0 ? false : _l, wrapperDisplay = _a.wrapperDisplay, _m = _a.trigger, trigger = _m === void 0 ? 'hover' : _m;
|
|
56
|
+
var text = _a.text, heading = _a.heading, primaryContent = _a.primaryContent, secondaryContent = _a.secondaryContent, _b = _a.progressiveDelay, progressiveDelay = _b === void 0 ? 1000 : _b, _c = _a.progressiveGap, progressiveGap = _c === void 0 ? 8 : _c, children = _a.children, _d = _a.placement, placement = _d === void 0 ? 'top' : _d, _e = _a.showPointer, showPointer = _e === void 0 ? true : _e, _f = _a.showDelay, showDelay = _f === void 0 ? 0 : _f, _g = _a.hideDelay, hideDelay = _g === void 0 ? 0 : _g, _h = _a.animation, animation = _h === void 0 ? 'none' : _h, _j = _a.followCursor, followCursor = _j === void 0 ? false : _j, _k = _a.cursorOffset, cursorOffset = _k === void 0 ? 10 : _k, _l = _a.invert, invert = _l === void 0 ? false : _l, wrapperDisplay = _a.wrapperDisplay, _m = _a.trigger, trigger = _m === void 0 ? 'hover' : _m, style = _a.style;
|
|
57
57
|
var bgColor = invert ? __1.colors2.white : __1.colors2.black;
|
|
58
58
|
var textColor = invert ? __1.colors2.black : __1.colors2.white;
|
|
59
59
|
var resolvedPrimaryContent = (0, utils_1.resolvePrimaryContent)(text, heading, primaryContent);
|
|
@@ -194,7 +194,7 @@ function Tooltip(_a) {
|
|
|
194
194
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
195
195
|
react_1.default.createElement(styled_1.StyledInlineWrapper, { ref: containerRef, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onMouseMove: handleMouseMove, "$display": wrapperDisplay }, children),
|
|
196
196
|
isOpen && (react_1.default.createElement(react_2.FloatingPortal, null,
|
|
197
|
-
react_1.default.createElement(styled_1.StyledCursorTooltipWrapper, { ref: tooltipRef, style: cursorTooltipStyle, "$gap": progressiveGap },
|
|
197
|
+
react_1.default.createElement(styled_1.StyledCursorTooltipWrapper, { ref: tooltipRef, style: __assign(__assign({}, cursorTooltipStyle), style), "$gap": progressiveGap },
|
|
198
198
|
react_1.default.createElement(styled_1.StyledTooltipContent, { "$bgColor": bgColor, "$textColor": textColor, "$borderRadius": cursorBorderRadius }, resolvedPrimaryContent && (0, utils_1.renderContent)(resolvedPrimaryContent)),
|
|
199
199
|
secondaryContent && showSecondary && (react_1.default.createElement(styled_1.StyledTooltipContent, { "$bgColor": bgColor, "$textColor": textColor, "$borderRadius": cursorSecondaryBorderRadius }, (0, utils_1.renderContent)(secondaryContent))))))));
|
|
200
200
|
}
|
|
@@ -203,7 +203,7 @@ function Tooltip(_a) {
|
|
|
203
203
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
204
204
|
react_1.default.createElement(styled_1.StyledInlineWrapper, __assign({ ref: refs.setReference }, getReferenceProps({ onClick: handleClick }), { "$display": wrapperDisplay }), children),
|
|
205
205
|
(hasFadeAnimation ? isMounted : isOpen) && (react_1.default.createElement(react_2.FloatingPortal, null,
|
|
206
|
-
react_1.default.createElement(styled_1.StyledTooltipWrapper, __assign({ ref: refs.setFloating, style: __assign(__assign({}, floatingStyles), (hasFadeAnimation ? transitionStyles : {})), "$isVertical": isVertical, "$gap": progressiveGap }, getFloatingProps()),
|
|
206
|
+
react_1.default.createElement(styled_1.StyledTooltipWrapper, __assign({ ref: refs.setFloating, style: __assign(__assign(__assign({}, floatingStyles), (hasFadeAnimation ? transitionStyles : {})), style), "$isVertical": isVertical, "$gap": progressiveGap }, getFloatingProps()),
|
|
207
207
|
react_1.default.createElement(styled_1.StyledTooltipContent, { "$bgColor": bgColor, "$textColor": textColor, "$borderRadius": (0, utils_1.getBorderRadius)({
|
|
208
208
|
isPrimary: true,
|
|
209
209
|
progressiveGap: progressiveGap,
|
|
@@ -53,14 +53,14 @@ exports.StyledSecondaryContentWrapper = styled_components_1.default.div(template
|
|
|
53
53
|
var $animate = _a.$animate;
|
|
54
54
|
return $animate && exports.slideAnimation;
|
|
55
55
|
});
|
|
56
|
-
exports.StyledTooltipWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n z-index:
|
|
56
|
+
exports.StyledTooltipWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n z-index: 1000000000;\n display: flex;\n flex-direction: ", ";\n gap: ", ";\n"], ["\n z-index: 1000000000;\n display: flex;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_a) {
|
|
57
57
|
var $isVertical = _a.$isVertical;
|
|
58
58
|
return ($isVertical ? 'column' : 'row');
|
|
59
59
|
}, function (_a) {
|
|
60
60
|
var _b = _a.$gap, $gap = _b === void 0 ? 0 : _b;
|
|
61
61
|
return "".concat($gap, "px");
|
|
62
62
|
});
|
|
63
|
-
exports.StyledCursorTooltipWrapper = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n z-index:
|
|
63
|
+
exports.StyledCursorTooltipWrapper = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n z-index: 1000000000;\n pointer-events: none;\n display: flex;\n flex-direction: column;\n gap: ", ";\n"], ["\n z-index: 1000000000;\n pointer-events: none;\n display: flex;\n flex-direction: column;\n gap: ", ";\n"])), function (_a) {
|
|
64
64
|
var _b = _a.$gap, $gap = _b === void 0 ? 0 : _b;
|
|
65
65
|
return "".concat($gap, "px");
|
|
66
66
|
});
|