@entur/tooltip 3.0.2 → 4.0.0-RC.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/Popover.d.ts +3 -1
- package/dist/Tooltip.d.ts +5 -4
- package/dist/index.d.ts +1 -0
- package/dist/styles.css +1104 -167
- package/dist/tooltip.cjs.development.js +187 -194
- package/dist/tooltip.cjs.development.js.map +1 -1
- package/dist/tooltip.cjs.production.min.js +1 -1
- package/dist/tooltip.cjs.production.min.js.map +1 -1
- package/dist/tooltip.esm.js +189 -196
- package/dist/tooltip.esm.js.map +1 -1
- package/dist/utils.d.ts +3 -0
- package/package.json +8 -9
|
@@ -4,10 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var utils = require('@entur/utils');
|
|
6
6
|
var React = require('react');
|
|
7
|
-
var reactPopper = require('react-popper');
|
|
8
7
|
var classNames = require('classnames');
|
|
8
|
+
var reactDom = require('@floating-ui/react-dom');
|
|
9
9
|
var icons = require('@entur/icons');
|
|
10
10
|
var button = require('@entur/button');
|
|
11
|
+
var tokens = require('@entur/tokens');
|
|
11
12
|
var layout = require('@entur/layout');
|
|
12
13
|
|
|
13
14
|
function _extends() {
|
|
@@ -37,10 +38,26 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
37
38
|
return target;
|
|
38
39
|
}
|
|
39
40
|
|
|
40
|
-
|
|
41
|
+
function standardisePlacement(placement) {
|
|
42
|
+
switch (placement) {
|
|
43
|
+
case 'top-left':
|
|
44
|
+
return 'top-start';
|
|
45
|
+
case 'top-right':
|
|
46
|
+
return 'top-end';
|
|
47
|
+
case 'bottom-left':
|
|
48
|
+
return 'bottom-start';
|
|
49
|
+
case 'bottom-right':
|
|
50
|
+
return 'bottom-end';
|
|
51
|
+
default:
|
|
52
|
+
return placement;
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
var _excluded$1 = ["placement", "content", "children", "className", "isOpen", "disableHoverListener", "disableFocusListener", "disableKeyboardListener", "disableClickListner", "showCloseButton", "variant", "style"];
|
|
41
57
|
/** @deprecated use variant="negative" instead */
|
|
42
58
|
var error = 'error';
|
|
43
59
|
var Tooltip = function Tooltip(_ref) {
|
|
60
|
+
var _actualPlacement$spli, _middlewareData$arrow, _middlewareData$arrow2;
|
|
44
61
|
var placement = _ref.placement,
|
|
45
62
|
content = _ref.content,
|
|
46
63
|
children = _ref.children,
|
|
@@ -58,134 +75,114 @@ var Tooltip = function Tooltip(_ref) {
|
|
|
58
75
|
_ref$showCloseButton = _ref.showCloseButton,
|
|
59
76
|
showCloseButton = _ref$showCloseButton === void 0 ? true : _ref$showCloseButton,
|
|
60
77
|
variant = _ref.variant,
|
|
61
|
-
|
|
62
|
-
popperModifiers = _ref$popperModifiers === void 0 ? [{
|
|
63
|
-
name: 'offset',
|
|
64
|
-
options: {
|
|
65
|
-
offset: [0, 10]
|
|
66
|
-
}
|
|
67
|
-
}] : _ref$popperModifiers,
|
|
78
|
+
style = _ref.style,
|
|
68
79
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
69
|
-
var _useState = React.useState(isOpen
|
|
80
|
+
var _useState = React.useState(isOpen),
|
|
70
81
|
showTooltip = _useState[0],
|
|
71
82
|
setShowTooltip = _useState[1];
|
|
72
|
-
var
|
|
73
|
-
var
|
|
74
|
-
|
|
75
|
-
|
|
83
|
+
var tooltipArrowRef = React.useRef(null);
|
|
84
|
+
var tooltipId = utils.useRandomId('eds-tooltip');
|
|
85
|
+
var hoverOpenTimer = React.useRef();
|
|
86
|
+
var hoverCloseTimer = React.useRef();
|
|
87
|
+
// calculations for floating-UI tooltip position
|
|
88
|
+
var _useFloating = reactDom.useFloating({
|
|
89
|
+
whileElementsMounted: function whileElementsMounted(ref, _float, update) {
|
|
90
|
+
return reactDom.autoUpdate(ref, _float, update);
|
|
91
|
+
},
|
|
92
|
+
placement: standardisePlacement(placement),
|
|
93
|
+
middleware: [reactDom.offset(tokens.space.extraSmall), reactDom.flip(), reactDom.shift({
|
|
94
|
+
padding: tokens.space.extraSmall,
|
|
95
|
+
limiter: reactDom.limitShift({
|
|
96
|
+
offset: 8
|
|
97
|
+
})
|
|
98
|
+
}), reactDom.arrow({
|
|
99
|
+
element: tooltipArrowRef,
|
|
100
|
+
padding: tokens.borderRadiuses.medium
|
|
101
|
+
})]
|
|
102
|
+
}),
|
|
103
|
+
refs = _useFloating.refs,
|
|
104
|
+
floatingStyles = _useFloating.floatingStyles,
|
|
105
|
+
middlewareData = _useFloating.middlewareData,
|
|
106
|
+
actualPlacement = _useFloating.placement;
|
|
107
|
+
var onMouseEnter = function onMouseEnter() {
|
|
108
|
+
clearTimeout(hoverCloseTimer.current);
|
|
109
|
+
hoverOpenTimer.current = setTimeout(function () {
|
|
76
110
|
setShowTooltip(true);
|
|
77
111
|
}, 150);
|
|
78
112
|
};
|
|
79
|
-
var
|
|
80
|
-
|
|
81
|
-
|
|
113
|
+
var onMouseLeave = function onMouseLeave() {
|
|
114
|
+
clearTimeout(hoverOpenTimer.current);
|
|
115
|
+
hoverCloseTimer.current = setTimeout(function () {
|
|
116
|
+
setShowTooltip(false);
|
|
117
|
+
}, 300);
|
|
82
118
|
};
|
|
83
119
|
React.useEffect(function () {
|
|
84
120
|
return function () {
|
|
85
|
-
clearTimeout(
|
|
121
|
+
clearTimeout(hoverOpenTimer.current);
|
|
122
|
+
clearTimeout(hoverCloseTimer.current);
|
|
86
123
|
};
|
|
87
|
-
});
|
|
88
|
-
var
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
React.useEffect(function () {
|
|
93
|
-
if (!content) {
|
|
94
|
-
setShowTooltip(false);
|
|
95
|
-
}
|
|
96
|
-
}, [content]);
|
|
97
|
-
var popperPlacement = placement;
|
|
98
|
-
if (placement.includes('-')) {
|
|
99
|
-
if (placement.includes('right')) {
|
|
100
|
-
popperPlacement = placement.replace('right', 'end');
|
|
101
|
-
}
|
|
102
|
-
if (placement.includes('left')) {
|
|
103
|
-
popperPlacement = placement.replace('left', 'start');
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
var childProps = {};
|
|
107
|
-
childProps['aria-describedby'] = showTooltip ? tooltipId : undefined;
|
|
108
|
-
if (!disableFocusListener) {
|
|
109
|
-
childProps.onFocus = function () {
|
|
124
|
+
}, []);
|
|
125
|
+
var referenceListenerProps = _extends({
|
|
126
|
+
'aria-describedby': showTooltip ? tooltipId : undefined
|
|
127
|
+
}, !disableFocusListener && {
|
|
128
|
+
onFocus: function onFocus() {
|
|
110
129
|
return setShowTooltip(true);
|
|
111
|
-
}
|
|
112
|
-
|
|
130
|
+
}
|
|
131
|
+
}, !disableFocusListener && {
|
|
132
|
+
onBlur: function onBlur() {
|
|
113
133
|
return setShowTooltip(false);
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
return onMouseExit();
|
|
122
|
-
};
|
|
123
|
-
}
|
|
124
|
-
if (!disableKeyboardListener) {
|
|
125
|
-
childProps.onKeyDown = function (e) {
|
|
134
|
+
}
|
|
135
|
+
}, !disableHoverListener && {
|
|
136
|
+
onMouseEnter: onMouseEnter
|
|
137
|
+
}, !disableHoverListener && {
|
|
138
|
+
onMouseLeave: onMouseLeave
|
|
139
|
+
}, !disableKeyboardListener && {
|
|
140
|
+
onKeyDown: function onKeyDown(e) {
|
|
126
141
|
if (e.key === 'Escape') setShowTooltip(false);
|
|
127
142
|
if (e.key === ' ' || e.key === 'Enter') {
|
|
128
143
|
e.preventDefault();
|
|
129
144
|
setShowTooltip(!showTooltip);
|
|
130
145
|
}
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
childProps.onClick = function () {
|
|
146
|
+
}
|
|
147
|
+
}, !disableClickListner && {
|
|
148
|
+
onClick: function onClick() {
|
|
135
149
|
return setShowTooltip(!showTooltip);
|
|
136
|
-
}
|
|
137
|
-
}
|
|
138
|
-
return React.createElement(
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
}));
|
|
150
|
+
}
|
|
151
|
+
});
|
|
152
|
+
return React.createElement(React.Fragment, null, React.cloneElement(children, _extends({
|
|
153
|
+
ref: refs.setReference
|
|
154
|
+
}, referenceListenerProps)), React.createElement("div", _extends({
|
|
155
|
+
className: classNames(className, 'eds-tooltip', {
|
|
156
|
+
'eds-tooltip--negative': variant === error || variant === 'negative'
|
|
157
|
+
}),
|
|
158
|
+
ref: refs.setFloating,
|
|
159
|
+
style: _extends({}, floatingStyles, {
|
|
160
|
+
display: showTooltip && content ? undefined : 'none'
|
|
161
|
+
}, style),
|
|
162
|
+
role: "tooltip",
|
|
163
|
+
id: tooltipId,
|
|
164
|
+
onMouseEnter: !disableHoverListener ? onMouseEnter : undefined,
|
|
165
|
+
onMouseLeave: !disableHoverListener ? onMouseLeave : undefined
|
|
166
|
+
}, rest), content, isOpen && showCloseButton && React.createElement(button.IconButton, {
|
|
167
|
+
className: "eds-tooltip__close-button",
|
|
168
|
+
onClick: function onClick() {
|
|
169
|
+
return setShowTooltip(false);
|
|
170
|
+
},
|
|
171
|
+
type: "button",
|
|
172
|
+
"aria-label": "Lukk tooltip"
|
|
173
|
+
}, React.createElement(icons.CloseIcon, {
|
|
174
|
+
"aria-hidden": "true"
|
|
175
|
+
})), React.createElement("div", {
|
|
176
|
+
className: "eds-tooltip__arrow--" + (actualPlacement == null ? void 0 : (_actualPlacement$spli = actualPlacement.split('-')) == null ? void 0 : _actualPlacement$spli[0]),
|
|
177
|
+
ref: tooltipArrowRef,
|
|
178
|
+
style: {
|
|
179
|
+
left: (_middlewareData$arrow = middlewareData.arrow) == null ? void 0 : _middlewareData$arrow.x,
|
|
180
|
+
top: (_middlewareData$arrow2 = middlewareData.arrow) == null ? void 0 : _middlewareData$arrow2.y
|
|
181
|
+
}
|
|
182
|
+
})));
|
|
170
183
|
};
|
|
171
184
|
|
|
172
185
|
var _excluded = ["children"];
|
|
173
|
-
var PopoverContext = /*#__PURE__*/React.createContext(undefined);
|
|
174
|
-
var usePopoverContext = function usePopoverContext() {
|
|
175
|
-
var context = React.useContext(PopoverContext);
|
|
176
|
-
if (context == null) {
|
|
177
|
-
throw Error('usePopoverContext must be used within <Popover/>');
|
|
178
|
-
}
|
|
179
|
-
return context;
|
|
180
|
-
};
|
|
181
|
-
var useCustomState = function useCustomState(state, setState) {
|
|
182
|
-
var _React$useState = React.useState(false),
|
|
183
|
-
internalState = _React$useState[0],
|
|
184
|
-
setInternalState = _React$useState[1];
|
|
185
|
-
var controlled = state !== undefined && setState !== undefined;
|
|
186
|
-
if (controlled) return [state, setState, controlled];
|
|
187
|
-
return [internalState, setInternalState, controlled];
|
|
188
|
-
};
|
|
189
186
|
var Popover = function Popover(_ref) {
|
|
190
187
|
var children = _ref.children,
|
|
191
188
|
_ref$placement = _ref.placement,
|
|
@@ -196,86 +193,69 @@ var Popover = function Popover(_ref) {
|
|
|
196
193
|
showPopover = _useCustomState[0],
|
|
197
194
|
setShowPopover = _useCustomState[1],
|
|
198
195
|
controlled = _useCustomState[2];
|
|
199
|
-
|
|
200
|
-
var
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
offset:
|
|
209
|
-
}
|
|
210
|
-
}]
|
|
211
|
-
placement: placement
|
|
196
|
+
// calculations for floating-UI popover position
|
|
197
|
+
var _useFloating = reactDom.useFloating({
|
|
198
|
+
whileElementsMounted: function whileElementsMounted(ref, _float, update) {
|
|
199
|
+
return reactDom.autoUpdate(ref, _float, update);
|
|
200
|
+
},
|
|
201
|
+
placement: standardisePlacement(placement),
|
|
202
|
+
middleware: [reactDom.offset(tokens.space.extraSmall), reactDom.flip(), reactDom.shift({
|
|
203
|
+
padding: tokens.space.extraSmall,
|
|
204
|
+
limiter: reactDom.limitShift({
|
|
205
|
+
offset: 8
|
|
206
|
+
})
|
|
207
|
+
})]
|
|
212
208
|
}),
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
React.useEffect(function () {
|
|
217
|
-
if (forceUpdate) {
|
|
218
|
-
forceUpdate();
|
|
219
|
-
}
|
|
220
|
-
}, [showPopover, forceUpdate]);
|
|
221
|
-
var triggerProps = React.useCallback(function () {
|
|
222
|
-
var buttonProps = {
|
|
223
|
-
'aria-haspopup': 'dialog',
|
|
224
|
-
'aria-expanded': showPopover,
|
|
225
|
-
ref: triggerElement,
|
|
226
|
-
type: 'button'
|
|
227
|
-
};
|
|
228
|
-
var buttonOnClick = {
|
|
229
|
-
onClick: function onClick(e) {
|
|
230
|
-
e.preventDefault();
|
|
231
|
-
setShowPopover(function (prev) {
|
|
232
|
-
return !prev;
|
|
233
|
-
});
|
|
234
|
-
}
|
|
235
|
-
};
|
|
236
|
-
return controlled ? buttonProps : _extends({}, buttonProps, buttonOnClick);
|
|
237
|
-
}, [triggerElement, showPopover, setShowPopover, controlled]);
|
|
238
|
-
utils.useOnClickOutside([contentElement, triggerElement], function () {
|
|
209
|
+
refs = _useFloating.refs,
|
|
210
|
+
floatingStyles = _useFloating.floatingStyles;
|
|
211
|
+
utils.useOnClickOutside([refs.floating, refs.reference], function () {
|
|
239
212
|
return setShowPopover(false);
|
|
240
213
|
});
|
|
214
|
+
var popoverTriggerProps = _extends({
|
|
215
|
+
'aria-haspopup': 'dialog',
|
|
216
|
+
'aria-expanded': showPopover,
|
|
217
|
+
ref: refs.setReference,
|
|
218
|
+
type: 'button'
|
|
219
|
+
}, !controlled && {
|
|
220
|
+
onClick: function onClick() {
|
|
221
|
+
return setShowPopover(function (prev) {
|
|
222
|
+
return !prev;
|
|
223
|
+
});
|
|
224
|
+
}
|
|
225
|
+
});
|
|
226
|
+
var popoverContentProps = {
|
|
227
|
+
role: 'dialog',
|
|
228
|
+
'aria-modal': false,
|
|
229
|
+
'aria-hidden': !showPopover,
|
|
230
|
+
ref: refs.setFloating,
|
|
231
|
+
style: _extends({}, !showPopover && {
|
|
232
|
+
display: 'none'
|
|
233
|
+
}),
|
|
234
|
+
onKeyDown: function onKeyDown(event) {
|
|
235
|
+
if (event.key === 'Escape') setShowPopover(false);
|
|
236
|
+
},
|
|
237
|
+
onBlur: function onBlur(event) {
|
|
238
|
+
var elementReceivingFocus = event.relatedTarget;
|
|
239
|
+
// The check for 'tabindex=-1' is a special case for focus handling in Docz
|
|
240
|
+
if (!elementReceivingFocus || elementReceivingFocus.getAttribute('tabindex') === '-1') return;
|
|
241
|
+
var focusedElementIsPopover = elementContainsElement(refs.floating.current, elementReceivingFocus);
|
|
242
|
+
var focusedElementIsTrigger = elementContainsElement(refs.reference.current, elementReceivingFocus);
|
|
243
|
+
var popoverShouldClose = !focusedElementIsPopover && !focusedElementIsTrigger;
|
|
244
|
+
if (showPopover && popoverShouldClose) setShowPopover(false);
|
|
245
|
+
}
|
|
246
|
+
};
|
|
241
247
|
var closeButtonProps = {
|
|
242
|
-
onClick: function onClick(
|
|
243
|
-
|
|
244
|
-
setShowPopover(false);
|
|
248
|
+
onClick: function onClick() {
|
|
249
|
+
return setShowPopover(false);
|
|
245
250
|
},
|
|
246
251
|
type: 'button'
|
|
247
252
|
};
|
|
248
|
-
var popoverContentProps = React.useCallback(function () {
|
|
249
|
-
var contentProps = {
|
|
250
|
-
role: 'dialog',
|
|
251
|
-
'aria-modal': 'false',
|
|
252
|
-
ref: contentElement,
|
|
253
|
-
onKeyDown: function onKeyDown(event) {
|
|
254
|
-
if (event.key === 'Escape') {
|
|
255
|
-
showPopover && setShowPopover(false);
|
|
256
|
-
}
|
|
257
|
-
},
|
|
258
|
-
onBlur: function onBlur(event) {
|
|
259
|
-
var elementReceivingFocus = event.relatedTarget;
|
|
260
|
-
// The check for 'tabindex=-1' is a special case for focus handling in Docz
|
|
261
|
-
if (!elementReceivingFocus || elementReceivingFocus.getAttribute('tabindex') === '-1') return;
|
|
262
|
-
var focusElementIsPopover = elementContainsElement(contentElement.current, elementReceivingFocus);
|
|
263
|
-
var focusElementIsTrigger = elementContainsElement(triggerElement.current, elementReceivingFocus);
|
|
264
|
-
var isValidBlur = !focusElementIsPopover && !focusElementIsTrigger;
|
|
265
|
-
if (showPopover && isValidBlur) setShowPopover(false);
|
|
266
|
-
}
|
|
267
|
-
};
|
|
268
|
-
return contentProps;
|
|
269
|
-
}, [contentElement, showPopover, setShowPopover]);
|
|
270
253
|
var contextValue = {
|
|
271
254
|
showPopover: showPopover,
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
styles: styles,
|
|
275
|
-
attributes: attributes,
|
|
255
|
+
floatingStyles: floatingStyles,
|
|
256
|
+
popoverTriggerProps: popoverTriggerProps,
|
|
276
257
|
popoverContentProps: popoverContentProps,
|
|
277
|
-
closeButtonProps: closeButtonProps
|
|
278
|
-
triggerProps: triggerProps
|
|
258
|
+
closeButtonProps: closeButtonProps
|
|
279
259
|
};
|
|
280
260
|
return React.createElement(PopoverContext.Provider, {
|
|
281
261
|
value: contextValue
|
|
@@ -284,9 +264,9 @@ var Popover = function Popover(_ref) {
|
|
|
284
264
|
var PopoverTrigger = function PopoverTrigger(_ref2) {
|
|
285
265
|
var children = _ref2.children;
|
|
286
266
|
var _usePopoverContext = usePopoverContext(),
|
|
287
|
-
|
|
267
|
+
popoverTriggerProps = _usePopoverContext.popoverTriggerProps;
|
|
288
268
|
var child = React.Children.only(children);
|
|
289
|
-
return React.cloneElement(child,
|
|
269
|
+
return React.cloneElement(child, popoverTriggerProps);
|
|
290
270
|
};
|
|
291
271
|
var PopoverCloseButton = function PopoverCloseButton(_ref3) {
|
|
292
272
|
var children = _ref3.children,
|
|
@@ -296,23 +276,36 @@ var PopoverCloseButton = function PopoverCloseButton(_ref3) {
|
|
|
296
276
|
return React.cloneElement(children, _extends({}, closeButtonProps, rest));
|
|
297
277
|
};
|
|
298
278
|
var PopoverContent = /*#__PURE__*/React.forwardRef(function (_ref4, ref) {
|
|
299
|
-
var children = _ref4.children
|
|
279
|
+
var children = _ref4.children,
|
|
280
|
+
className = _ref4.className,
|
|
281
|
+
style = _ref4.style;
|
|
300
282
|
var _usePopoverContext3 = usePopoverContext(),
|
|
301
|
-
|
|
302
|
-
attributes = _usePopoverContext3.attributes,
|
|
303
|
-
styles = _usePopoverContext3.styles,
|
|
283
|
+
floatingStyles = _usePopoverContext3.floatingStyles,
|
|
304
284
|
popoverContentProps = _usePopoverContext3.popoverContentProps;
|
|
305
|
-
var props = popoverContentProps({
|
|
306
|
-
ref: ref
|
|
307
|
-
});
|
|
308
285
|
return React.createElement(layout.Contrast, _extends({
|
|
309
|
-
className: classNames('eds-popover'
|
|
310
|
-
|
|
311
|
-
},
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
}
|
|
286
|
+
className: classNames(className, 'eds-popover')
|
|
287
|
+
}, popoverContentProps, {
|
|
288
|
+
style: _extends({}, floatingStyles, popoverContentProps.style, style),
|
|
289
|
+
// @ts-expect-error correct type for floating cannot be set via useFloating
|
|
290
|
+
ref: utils.mergeRefs(popoverContentProps.ref, ref)
|
|
291
|
+
}), children);
|
|
315
292
|
});
|
|
293
|
+
var PopoverContext = /*#__PURE__*/React.createContext(undefined);
|
|
294
|
+
var usePopoverContext = function usePopoverContext() {
|
|
295
|
+
var context = React.useContext(PopoverContext);
|
|
296
|
+
if (context == null) {
|
|
297
|
+
throw Error('usePopoverContext must be used within <Popover/>');
|
|
298
|
+
}
|
|
299
|
+
return context;
|
|
300
|
+
};
|
|
301
|
+
var useCustomState = function useCustomState(state, setState) {
|
|
302
|
+
var _React$useState = React.useState(false),
|
|
303
|
+
internalState = _React$useState[0],
|
|
304
|
+
setInternalState = _React$useState[1];
|
|
305
|
+
var controlled = state !== undefined && setState !== undefined;
|
|
306
|
+
if (controlled) return [state, setState, controlled];
|
|
307
|
+
return [internalState, setInternalState, controlled];
|
|
308
|
+
};
|
|
316
309
|
function elementContainsElement(parent, child) {
|
|
317
310
|
if (!parent) return false;
|
|
318
311
|
return parent === child || parent.contains(child);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.cjs.development.js","sources":["../src/Tooltip.tsx","../src/Popover.tsx","../src/index.tsx"],"sourcesContent":["import React, { cloneElement, useState } from 'react';\nimport { Manager, Reference, Popper } from 'react-popper';\nimport classNames from 'classnames';\nimport { useRandomId } from '@entur/utils';\nimport { Placement as PopperPlacementProps } from '@popperjs/core';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\n/** @deprecated use variant=\"negative\" instead */\nconst error = 'error';\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement:\n | 'top'\n | 'top-left'\n | 'top-right'\n | 'left'\n | 'right'\n | 'bottom-left' // bottom-start\n | 'bottom'\n | 'bottom-right'; // bottom-end\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltipen skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n disableKeyboardListener?: boolean;\n disableClickListner?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'negative' | typeof error;\n /** En array av modifiers som sendes til Popper, rammeverket som brukes til plassering av Tooltip\n * @default [{ name: 'offset', options: { offset: [0, 10]} }]\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n disableKeyboardListener = true,\n disableClickListner = true,\n showCloseButton = true,\n variant,\n popperModifiers = [\n {\n name: 'offset',\n options: { offset: [0, 10] },\n },\n ],\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen || false);\n let hoverTimer: ReturnType<typeof setTimeout>;\n\n const handleOpen: (event: React.MouseEvent) => void = event => {\n event.persist();\n hoverTimer = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n const onMouseExit: () => void = () => {\n setShowTooltip(false);\n clearTimeout(hoverTimer);\n };\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverTimer);\n };\n });\n\n const tooltipId = useRandomId('eds-tooltip');\n React.useEffect(() => {\n setShowTooltip(isOpen);\n }, [isOpen]);\n\n React.useEffect(() => {\n if (!content) {\n setShowTooltip(false);\n }\n }, [content]);\n\n let popperPlacement = placement as PopperPlacementProps;\n if (placement.includes('-')) {\n if (placement.includes('right')) {\n popperPlacement = placement.replace(\n 'right',\n 'end',\n ) as PopperPlacementProps;\n }\n if (placement.includes('left')) {\n popperPlacement = placement.replace(\n 'left',\n 'start',\n ) as PopperPlacementProps;\n }\n }\n\n const childProps: {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n onKeyDown?: (e: React.KeyboardEvent) => void;\n onKeyUp?: (e: React.KeyboardEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n } = {};\n childProps['aria-describedby'] = showTooltip ? tooltipId : undefined;\n\n if (!disableFocusListener) {\n childProps.onFocus = () => setShowTooltip(true);\n childProps.onBlur = () => setShowTooltip(false);\n }\n if (!disableHoverListener) {\n childProps.onMouseEnter = e => handleOpen(e);\n childProps.onMouseLeave = () => onMouseExit();\n }\n if (!disableKeyboardListener) {\n childProps.onKeyDown = e => {\n if (e.key === 'Escape') setShowTooltip(false);\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault();\n setShowTooltip(!showTooltip);\n }\n };\n }\n if (!disableClickListner) {\n childProps.onClick = () => setShowTooltip(!showTooltip);\n }\n\n return (\n <Manager>\n <Reference>\n {({ ref }) =>\n cloneElement(children, {\n ref: ref,\n ...childProps,\n })\n }\n </Reference>\n {showTooltip && (\n <Popper\n modifiers={[{ name: 'arrow', enabled: false }, ...popperModifiers]}\n placement={popperPlacement}\n >\n {({ ref, style, placement: popperPlacement }) => (\n <div\n className={classNames(\n 'eds-tooltip',\n className,\n `eds-tooltip--${popperPlacement}`,\n {\n 'eds-tooltip--negative':\n variant === error || variant === 'negative',\n },\n )}\n ref={ref}\n style={style}\n role=\"tooltip\"\n id={tooltipId}\n data-placement={popperPlacement}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n type=\"button\"\n >\n <CloseIcon />\n </IconButton>\n )}\n </div>\n )}\n </Popper>\n )}\n </Manager>\n );\n};\n","import React, { cloneElement, createContext, useContext } from 'react';\n\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\n\nimport { Contrast } from '@entur/layout';\nimport { useOnClickOutside } from '@entur/utils';\n\nimport './Popover.scss';\n\ntype PopoverContentCallbackProps = {\n ref: React.Ref<HTMLDivElement>;\n};\n\ntype PopoverContextProps = {\n showPopover: boolean;\n triggerElement?: React.RefObject<HTMLButtonElement>;\n contentElement: React.RefObject<HTMLDivElement>;\n styles: { [key: string]: React.CSSProperties };\n attributes: { [key: string]: { [key: string]: string } | undefined };\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: (\n e: PopoverContentCallbackProps,\n ) => Record<string, unknown>;\n triggerProps: () => Record<string, unknown>;\n [key: string]: any;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nconst useCustomState = (\n state?: boolean,\n setState?: React.Dispatch<React.SetStateAction<boolean>>,\n): [boolean, React.Dispatch<React.SetStateAction<boolean>>, boolean] => {\n const [internalState, setInternalState] = React.useState<boolean>(false);\n const controlled = state !== undefined && setState !== undefined;\n if (controlled) return [state, setState, controlled];\n return [internalState, setInternalState, controlled];\n};\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n /** Hvis du ønsker å styre state selv kan du sende inn state her */\n showPopover?: boolean;\n /** Hvis du ønsker å styre state selv kan du sende inn setState her */\n setShowPopover?: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n showPopover: controlledState,\n setShowPopover: setControlledState,\n}) => {\n const [showPopover, setShowPopover, controlled] = useCustomState(\n controlledState,\n setControlledState,\n );\n const triggerElement = React.useRef(null);\n const contentElement = React.useRef(null);\n\n const { styles, attributes, forceUpdate } = usePopper(\n triggerElement.current,\n contentElement.current,\n {\n modifiers: [\n { name: 'arrow', enabled: false },\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n placement: placement,\n },\n );\n\n React.useEffect(() => {\n if (forceUpdate) {\n forceUpdate();\n }\n }, [showPopover, forceUpdate]);\n\n const triggerProps = React.useCallback(() => {\n const buttonProps = {\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: triggerElement,\n type: 'button',\n };\n const buttonOnClick = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(prev => !prev);\n },\n };\n return controlled ? buttonProps : { ...buttonProps, ...buttonOnClick };\n }, [triggerElement, showPopover, setShowPopover, controlled]);\n\n useOnClickOutside([contentElement, triggerElement], () =>\n setShowPopover(false),\n );\n const closeButtonProps = {\n onClick: (e: React.MouseEvent) => {\n e.preventDefault();\n setShowPopover(false);\n },\n type: 'button',\n };\n const popoverContentProps = React.useCallback(() => {\n const contentProps = {\n role: 'dialog',\n 'aria-modal': 'false',\n ref: contentElement,\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') {\n showPopover && setShowPopover(false);\n }\n },\n onBlur: (event: React.FocusEvent) => {\n const elementReceivingFocus = event.relatedTarget as HTMLElement;\n // The check for 'tabindex=-1' is a special case for focus handling in Docz\n if (\n !elementReceivingFocus ||\n elementReceivingFocus.getAttribute('tabindex') === '-1'\n )\n return;\n const focusElementIsPopover = elementContainsElement(\n contentElement.current,\n elementReceivingFocus,\n );\n const focusElementIsTrigger = elementContainsElement(\n triggerElement.current,\n elementReceivingFocus,\n );\n const isValidBlur = !focusElementIsPopover && !focusElementIsTrigger;\n if (showPopover && isValidBlur) setShowPopover(false);\n },\n };\n return contentProps;\n }, [contentElement, showPopover, setShowPopover]);\n const contextValue: PopoverContextProps = {\n showPopover,\n triggerElement,\n contentElement,\n styles,\n attributes,\n popoverContentProps,\n closeButtonProps,\n triggerProps,\n };\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { triggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, triggerProps());\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children }, ref: React.Ref<HTMLDivElement>) => {\n const { showPopover, attributes, styles, popoverContentProps } =\n usePopoverContext();\n const props = popoverContentProps({ ref });\n return (\n <Contrast\n className={classNames(\n 'eds-popover',\n {\n 'eds-popover--hidden': !showPopover,\n },\n 'eds-contrast',\n )}\n style={styles.popper}\n aria-hidden={!showPopover}\n {...attributes.styles}\n {...props}\n >\n {children}\n </Contrast>\n );\n});\n\nfunction elementContainsElement(\n parent: HTMLElement | null,\n child: HTMLElement,\n) {\n if (!parent) return false;\n return parent === child || parent.contains(child);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\n"],"names":["error","Tooltip","placement","content","children","className","isOpen","disableHoverListener","disableFocusListener","disableKeyboardListener","disableClickListner","showCloseButton","variant","popperModifiers","name","options","offset","rest","_excluded","useState","showTooltip","setShowTooltip","hoverTimer","handleOpen","event","persist","setTimeout","onMouseExit","clearTimeout","React","useEffect","tooltipId","useRandomId","popperPlacement","includes","replace","childProps","undefined","onFocus","onBlur","onMouseEnter","e","onMouseLeave","onKeyDown","key","preventDefault","onClick","Manager","createElement","Reference","ref","cloneElement","Popper","modifiers","enabled","style","classNames","role","id","IconButton","type","CloseIcon","PopoverContext","createContext","usePopoverContext","context","useContext","Error","useCustomState","state","setState","internalState","setInternalState","controlled","Popover","controlledState","showPopover","setControlledState","setShowPopover","triggerElement","useRef","contentElement","usePopper","current","styles","attributes","forceUpdate","triggerProps","useCallback","buttonProps","buttonOnClick","prev","useOnClickOutside","closeButtonProps","popoverContentProps","contentProps","elementReceivingFocus","relatedTarget","getAttribute","focusElementIsPopover","elementContainsElement","focusElementIsTrigger","isValidBlur","contextValue","Provider","value","PopoverTrigger","child","Children","only","PopoverCloseButton","PopoverContent","forwardRef","props","Contrast","popper","parent","contains","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tooltip.cjs.development.js","sources":["../src/utils.ts","../src/Tooltip.tsx","../src/Popover.tsx","../src/index.tsx"],"sourcesContent":["import { Placement as FloatingUIPlacement } from '@floating-ui/react-dom';\n\nexport type Placement =\n | 'top'\n | 'top-left'\n | 'top-start'\n | 'top-right'\n | 'top-end'\n | 'left'\n | 'right'\n | 'bottom-left'\n | 'bottom-start'\n | 'bottom'\n | 'bottom-right'\n | 'bottom-end';\n\nexport function standardisePlacement(placement: string): FloatingUIPlacement {\n switch (placement) {\n case 'top-left':\n return 'top-start';\n case 'top-right':\n return 'top-end';\n case 'bottom-left':\n return 'bottom-start';\n case 'bottom-right':\n return 'bottom-end';\n default:\n return placement as FloatingUIPlacement;\n }\n}\n","import React, { cloneElement, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\nimport {\n useFloating,\n autoUpdate,\n offset,\n flip,\n shift,\n arrow,\n limitShift,\n} from '@floating-ui/react-dom';\n\nimport { useRandomId } from '@entur/utils';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { space, borderRadiuses } from '@entur/tokens';\n\nimport { Placement, standardisePlacement } from './utils';\n\nimport './Tooltip.scss';\n\ntype Modifier = {\n name: string;\n enabled?: boolean;\n requires?: Array<string>;\n requiresIfExists?: Array<string>;\n options?: Record<string, unknown>;\n data?: Record<string, unknown>;\n [key: string]: any;\n};\n\ntype ChildEventListner = {\n 'aria-describedby'?: string;\n onFocus?: () => void;\n onBlur?: () => void;\n onMouseEnter?: (e: React.MouseEvent) => void;\n onMouseLeave?: () => void;\n onKeyDown?: (e: React.KeyboardEvent) => void;\n onKeyUp?: (e: React.KeyboardEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n};\n\n/** @deprecated use variant=\"negative\" instead */\nconst error = 'error';\n\nexport type TooltipProps = {\n /** Plassering av tooltip-en */\n placement: Placement;\n /** Innholdet i tooltip-boksen */\n content: React.ReactNode;\n /** Elementet som skal ha tooltip-funksjonalitet */\n children: React.ReactElement;\n /** Om tooltip-en skal vises */\n isOpen?: boolean;\n /** Ekstra klassenavn for tooltip */\n className?: string;\n /** Åpner ikke tooltip ved hover-events\n * @default false\n */\n disableHoverListener?: boolean;\n /** Åpner ikke tooltip ved focus-events\n * @default false\n */\n disableFocusListener?: boolean;\n disableKeyboardListener?: boolean;\n disableClickListner?: boolean;\n /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n * @default true\n */\n showCloseButton?: boolean;\n /** Valideringsvariant for Tooltip */\n variant?: 'negative' | typeof error;\n /** @deprecated Ikke lenger støttet. Meld fra på #talk-designsystem hvis du trenger støtte for\n * overskrivinger av plasseringen til Tooltip!\n */\n popperModifiers?: Modifier[];\n [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n placement,\n content,\n children,\n className,\n isOpen = false,\n disableHoverListener = false,\n disableFocusListener = false,\n disableKeyboardListener = true,\n disableClickListner = true,\n showCloseButton = true,\n variant,\n style,\n ...rest\n}) => {\n const [showTooltip, setShowTooltip] = useState(isOpen);\n const tooltipArrowRef = useRef(null);\n const tooltipId = useRandomId('eds-tooltip');\n const hoverOpenTimer = useRef<ReturnType<typeof setTimeout>>();\n const hoverCloseTimer = useRef<ReturnType<typeof setTimeout>>();\n\n // calculations for floating-UI tooltip position\n const {\n refs,\n floatingStyles,\n middlewareData,\n placement: actualPlacement,\n } = useFloating({\n whileElementsMounted: (ref, float, update) =>\n autoUpdate(ref, float, update),\n placement: standardisePlacement(placement),\n middleware: [\n offset(space.extraSmall),\n flip(),\n shift({ padding: space.extraSmall, limiter: limitShift({ offset: 8 }) }),\n arrow({\n element: tooltipArrowRef,\n padding: borderRadiuses.medium,\n }),\n ],\n });\n\n const onMouseEnter = () => {\n clearTimeout(hoverCloseTimer.current);\n hoverOpenTimer.current = setTimeout(() => {\n setShowTooltip(true);\n }, 150);\n };\n\n const onMouseLeave = () => {\n clearTimeout(hoverOpenTimer.current);\n hoverCloseTimer.current = setTimeout(() => {\n setShowTooltip(false);\n }, 300);\n };\n\n React.useEffect(() => {\n return () => {\n clearTimeout(hoverOpenTimer.current);\n clearTimeout(hoverCloseTimer.current);\n };\n }, []);\n\n const referenceListenerProps: ChildEventListner = {\n 'aria-describedby': showTooltip ? tooltipId : undefined,\n // focusListner\n ...(!disableFocusListener && { onFocus: () => setShowTooltip(true) }),\n ...(!disableFocusListener && { onBlur: () => setShowTooltip(false) }),\n // hoverListner\n ...(!disableHoverListener && { onMouseEnter }),\n ...(!disableHoverListener && { onMouseLeave }),\n // keyboardListner\n ...(!disableKeyboardListener && {\n onKeyDown: e => {\n if (e.key === 'Escape') setShowTooltip(false);\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault();\n setShowTooltip(!showTooltip);\n }\n },\n }),\n // clickListner\n ...(!disableClickListner && {\n onClick: () => setShowTooltip(!showTooltip),\n }),\n };\n\n return (\n <>\n {cloneElement(children, {\n ref: refs.setReference,\n ...referenceListenerProps,\n })}\n <div\n className={classNames(className, 'eds-tooltip', {\n 'eds-tooltip--negative': variant === error || variant === 'negative',\n })}\n ref={refs.setFloating}\n style={{\n ...floatingStyles,\n display: showTooltip && content ? undefined : 'none',\n ...style,\n }}\n role=\"tooltip\"\n id={tooltipId}\n onMouseEnter={!disableHoverListener ? onMouseEnter : undefined}\n onMouseLeave={!disableHoverListener ? onMouseLeave : undefined}\n {...rest}\n >\n {content}\n {isOpen && showCloseButton && (\n <IconButton\n className=\"eds-tooltip__close-button\"\n onClick={() => setShowTooltip(false)}\n type=\"button\"\n aria-label=\"Lukk tooltip\"\n >\n <CloseIcon aria-hidden=\"true\" />\n </IconButton>\n )}\n <div\n className={`eds-tooltip__arrow--${actualPlacement?.split('-')?.[0]}`}\n ref={tooltipArrowRef}\n style={{\n left: middlewareData.arrow?.x,\n top: middlewareData.arrow?.y,\n }}\n />\n </div>\n </>\n );\n};\n","import React, {\n cloneElement,\n createContext,\n MutableRefObject,\n useContext,\n} from 'react';\n\nimport classNames from 'classnames';\nimport {\n useFloating,\n autoUpdate,\n offset,\n flip,\n shift,\n limitShift,\n} from '@floating-ui/react-dom';\n\nimport { Contrast } from '@entur/layout';\nimport { mergeRefs, useOnClickOutside } from '@entur/utils';\nimport { space } from '@entur/tokens';\n\nimport { Placement, standardisePlacement } from './utils';\n\nimport './Popover.scss';\n\nexport type PopoverProps = {\n /** Innholdet i Popover */\n children: React.ReactNode;\n /** Plasseringen av Popover\n * @default \"bottom-start\"\n */\n placement?: Placement;\n /** Hvis du ønsker å styre state selv kan du sende inn state her */\n showPopover?: boolean;\n /** Hvis du ønsker å styre state selv kan du sende inn setState her */\n setShowPopover?: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n children,\n placement = 'bottom-start',\n showPopover: controlledState,\n setShowPopover: setControlledState,\n}) => {\n const [showPopover, setShowPopover, controlled] = useCustomState(\n controlledState,\n setControlledState,\n );\n\n // calculations for floating-UI popover position\n const { refs, floatingStyles } = useFloating<HTMLButtonElement>({\n whileElementsMounted: (ref, float, update) =>\n autoUpdate(ref, float, update),\n placement: standardisePlacement(placement),\n middleware: [\n offset(space.extraSmall),\n flip(),\n shift({ padding: space.extraSmall, limiter: limitShift({ offset: 8 }) }),\n ],\n });\n\n useOnClickOutside([refs.floating, refs.reference], () =>\n setShowPopover(false),\n );\n\n const popoverTriggerProps = {\n 'aria-haspopup': 'dialog',\n 'aria-expanded': showPopover,\n ref: refs.setReference,\n type: 'button',\n ...(!controlled && {\n onClick: () => setShowPopover(prev => !prev),\n }),\n };\n\n const popoverContentProps = {\n role: 'dialog',\n 'aria-modal': false,\n 'aria-hidden': !showPopover,\n ref: refs.setFloating,\n style: { ...(!showPopover && { display: 'none' }) },\n onKeyDown: (event: React.KeyboardEvent) => {\n if (event.key === 'Escape') setShowPopover(false);\n },\n onBlur: (event: React.FocusEvent) => {\n const elementReceivingFocus = event.relatedTarget as HTMLElement;\n // The check for 'tabindex=-1' is a special case for focus handling in Docz\n if (\n !elementReceivingFocus ||\n elementReceivingFocus.getAttribute('tabindex') === '-1'\n )\n return;\n const focusedElementIsPopover = elementContainsElement(\n refs.floating.current,\n elementReceivingFocus,\n );\n const focusedElementIsTrigger = elementContainsElement(\n refs.reference.current,\n elementReceivingFocus,\n );\n const popoverShouldClose =\n !focusedElementIsPopover && !focusedElementIsTrigger;\n if (showPopover && popoverShouldClose) setShowPopover(false);\n },\n };\n\n const closeButtonProps = {\n onClick: () => setShowPopover(false),\n type: 'button',\n };\n\n const contextValue: PopoverContextProps = {\n showPopover,\n floatingStyles,\n popoverTriggerProps,\n popoverContentProps,\n closeButtonProps,\n };\n\n return (\n <PopoverContext.Provider value={contextValue}>\n {children}\n </PopoverContext.Provider>\n );\n};\n\nexport type PopoverTriggerProps = {\n /** Knapp som skal brukes for å åpne Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n const { popoverTriggerProps } = usePopoverContext();\n const child = React.Children.only(children) as React.ReactElement<any>;\n return cloneElement(child, popoverTriggerProps);\n};\n\nexport type PopoverCloseButtonProps = {\n /** En valgfri knapp som kan legges inn for å lukke Popover */\n children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n children,\n ...rest\n}) => {\n const { closeButtonProps } = usePopoverContext();\n return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n /**Innholdet til Popover */\n children: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n};\n\nexport const PopoverContent = React.forwardRef<\n HTMLDivElement,\n PopoverContentProps\n>(({ children, className, style }, ref: React.Ref<HTMLDivElement>) => {\n const { floatingStyles, popoverContentProps } = usePopoverContext();\n return (\n <Contrast\n className={classNames(className, 'eds-popover')}\n {...popoverContentProps}\n style={{ ...floatingStyles, ...popoverContentProps.style, ...style }}\n // @ts-expect-error correct type for floating cannot be set via useFloating\n ref={mergeRefs(popoverContentProps.ref, ref)}\n >\n {children}\n </Contrast>\n );\n});\n\ntype PopoverContextProps = {\n showPopover: boolean;\n floatingStyles: React.CSSProperties;\n closeButtonProps: Record<string, unknown>;\n popoverContentProps: {\n role: string;\n 'aria-modal': boolean;\n 'aria-hidden': boolean;\n ref: MutableRefObject<HTMLElement> | ((node: HTMLElement | null) => void);\n style: React.CSSProperties;\n onKeyDown: (event: React.KeyboardEvent) => void;\n onBlur: (event: React.FocusEvent) => void;\n };\n popoverTriggerProps: Record<string, unknown>;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n undefined,\n);\nconst usePopoverContext = () => {\n const context = useContext(PopoverContext);\n if (context == null) {\n throw Error('usePopoverContext must be used within <Popover/>');\n }\n return context;\n};\n\nconst useCustomState = (\n state?: boolean,\n setState?: React.Dispatch<React.SetStateAction<boolean>>,\n): [boolean, React.Dispatch<React.SetStateAction<boolean>>, boolean] => {\n const [internalState, setInternalState] = React.useState<boolean>(false);\n const controlled = state !== undefined && setState !== undefined;\n if (controlled) return [state, setState, controlled];\n return [internalState, setInternalState, controlled];\n};\n\nfunction elementContainsElement(\n parent: HTMLElement | null,\n child: HTMLElement,\n) {\n if (!parent) return false;\n return parent === child || parent.contains(child);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\nexport { Placement } from './utils';\n"],"names":["standardisePlacement","placement","error","Tooltip","content","children","className","isOpen","disableHoverListener","disableFocusListener","disableKeyboardListener","disableClickListner","showCloseButton","variant","style","rest","_excluded","useState","showTooltip","setShowTooltip","tooltipArrowRef","useRef","tooltipId","useRandomId","hoverOpenTimer","hoverCloseTimer","useFloating","whileElementsMounted","ref","float","update","autoUpdate","middleware","offset","space","extraSmall","flip","shift","padding","limiter","limitShift","arrow","element","borderRadiuses","medium","refs","floatingStyles","middlewareData","actualPlacement","onMouseEnter","clearTimeout","current","setTimeout","onMouseLeave","React","useEffect","referenceListenerProps","undefined","onFocus","onBlur","onKeyDown","e","key","preventDefault","onClick","createElement","Fragment","cloneElement","setReference","classNames","setFloating","display","role","id","IconButton","type","CloseIcon","split","left","x","top","y","Popover","controlledState","showPopover","setControlledState","setShowPopover","useCustomState","controlled","useOnClickOutside","floating","reference","popoverTriggerProps","prev","popoverContentProps","event","elementReceivingFocus","relatedTarget","getAttribute","focusedElementIsPopover","elementContainsElement","focusedElementIsTrigger","popoverShouldClose","closeButtonProps","contextValue","PopoverContext","Provider","value","PopoverTrigger","usePopoverContext","child","Children","only","PopoverCloseButton","PopoverContent","forwardRef","Contrast","mergeRefs","createContext","context","useContext","Error","state","setState","internalState","setInternalState","parent","contains","warnAboutMissingStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBM,SAAUA,oBAAoB,CAACC,SAAiB,EAAA;AACpD,EAAA,QAAQA,SAAS;AACf,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,WAAW,CAAA;AACpB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,SAAS,CAAA;AAClB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,cAAc,CAAA;AACvB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,YAAY,CAAA;AACrB,IAAA;AACE,MAAA,OAAOA,SAAgC,CAAA;AAAC,GAAA;AAE9C;;;ACcA;AACA,IAAMC,KAAK,GAAG,OAAO,CAAA;AAoCRC,IAAAA,OAAO,GAA2B,SAAlCA,OAAO,CAcf,IAAA,EAAA;AAAA,EAAA,IAAA,qBAAA,EAAA,qBAAA,EAAA,sBAAA,CAAA;EAAA,IAbHF,SAAS,QAATA,SAAS;AACTG,IAAAA,OAAO,QAAPA,OAAO;AACPC,IAAAA,QAAQ,QAARA,QAAQ;AACRC,IAAAA,SAAS,QAATA,SAAS;AAAA,IAAA,WAAA,GAAA,IAAA,CACTC,MAAM;AAANA,IAAAA,MAAM,4BAAG,KAAK,GAAA,WAAA;AAAA,IAAA,qBAAA,GAAA,IAAA,CACdC,oBAAoB;AAApBA,IAAAA,oBAAoB,sCAAG,KAAK,GAAA,qBAAA;AAAA,IAAA,qBAAA,GAAA,IAAA,CAC5BC,oBAAoB;AAApBA,IAAAA,oBAAoB,sCAAG,KAAK,GAAA,qBAAA;AAAA,IAAA,qBAAA,GAAA,IAAA,CAC5BC,uBAAuB;AAAvBA,IAAAA,uBAAuB,sCAAG,IAAI,GAAA,qBAAA;AAAA,IAAA,qBAAA,GAAA,IAAA,CAC9BC,mBAAmB;AAAnBA,IAAAA,mBAAmB,sCAAG,IAAI,GAAA,qBAAA;AAAA,IAAA,oBAAA,GAAA,IAAA,CAC1BC,eAAe;AAAfA,IAAAA,eAAe,qCAAG,IAAI,GAAA,oBAAA;AACtBC,IAAAA,OAAO,QAAPA,OAAO;AACPC,IAAAA,KAAK,QAALA,KAAK;IACFC,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAAC,WAAA,CAAA,CAAA;EAEP,IAAsCC,SAAAA,GAAAA,cAAQ,CAACV,MAAM,CAAC;IAA/CW,WAAW,GAAA,SAAA,CAAA,CAAA,CAAA;IAAEC,cAAc,GAAA,SAAA,CAAA,CAAA,CAAA,CAAA;AAClC,EAAA,IAAMC,eAAe,GAAGC,YAAM,CAAC,IAAI,CAAC,CAAA;AACpC,EAAA,IAAMC,SAAS,GAAGC,iBAAW,CAAC,aAAa,CAAC,CAAA;EAC5C,IAAMC,cAAc,GAAGH,YAAM,EAAiC,CAAA;EAC9D,IAAMI,eAAe,GAAGJ,YAAM,EAAiC,CAAA;AAE/D;AACA,EAAA,IAAA,YAAA,GAKIK,oBAAW,CAAC;AACdC,MAAAA,oBAAoB,EAAE,SAACC,oBAAAA,CAAAA,GAAG,EAAEC,MAAK,EAAEC,MAAM,EAAA;AAAA,QAAA,OACvCC,mBAAU,CAACH,GAAG,EAAEC,MAAK,EAAEC,MAAM,CAAC,CAAA;AAAA,OAAA;AAChC7B,MAAAA,SAAS,EAAED,oBAAoB,CAACC,SAAS,CAAC;AAC1C+B,MAAAA,UAAU,EAAE,CACVC,eAAM,CAACC,YAAK,CAACC,UAAU,CAAC,EACxBC,aAAI,EAAE,EACNC,cAAK,CAAC;QAAEC,OAAO,EAAEJ,YAAK,CAACC,UAAU;QAAEI,OAAO,EAAEC,mBAAU,CAAC;AAAEP,UAAAA,MAAM,EAAE,CAAA;SAAG,CAAA;OAAG,CAAC,EACxEQ,cAAK,CAAC;AACJC,QAAAA,OAAO,EAAEtB,eAAe;QACxBkB,OAAO,EAAEK,qBAAc,CAACC,MAAAA;OACzB,CAAC,CAAA;AAEL,KAAA,CAAC;AAjBAC,IAAAA,IAAI,gBAAJA,IAAI;AACJC,IAAAA,cAAc,gBAAdA,cAAc;AACdC,IAAAA,cAAc,gBAAdA,cAAc;AACHC,IAAAA,eAAe,gBAA1B/C,SAAS,CAAA;AAgBX,EAAA,IAAMgD,YAAY,GAAG,SAAfA,YAAY,GAAQ;AACxBC,IAAAA,YAAY,CAACzB,eAAe,CAAC0B,OAAO,CAAC,CAAA;AACrC3B,IAAAA,cAAc,CAAC2B,OAAO,GAAGC,UAAU,CAAC,YAAK;MACvCjC,cAAc,CAAC,IAAI,CAAC,CAAA;KACrB,EAAE,GAAG,CAAC,CAAA;GACR,CAAA;AAED,EAAA,IAAMkC,YAAY,GAAG,SAAfA,YAAY,GAAQ;AACxBH,IAAAA,YAAY,CAAC1B,cAAc,CAAC2B,OAAO,CAAC,CAAA;AACpC1B,IAAAA,eAAe,CAAC0B,OAAO,GAAGC,UAAU,CAAC,YAAK;MACxCjC,cAAc,CAAC,KAAK,CAAC,CAAA;KACtB,EAAE,GAAG,CAAC,CAAA;GACR,CAAA;EAEDmC,KAAK,CAACC,SAAS,CAAC,YAAK;AACnB,IAAA,OAAO,YAAK;AACVL,MAAAA,YAAY,CAAC1B,cAAc,CAAC2B,OAAO,CAAC,CAAA;AACpCD,MAAAA,YAAY,CAACzB,eAAe,CAAC0B,OAAO,CAAC,CAAA;KACtC,CAAA;GACF,EAAE,EAAE,CAAC,CAAA;AAEN,EAAA,IAAMK,sBAAsB,GAAA,QAAA,CAAA;AAC1B,IAAA,kBAAkB,EAAEtC,WAAW,GAAGI,SAAS,GAAGmC,SAAAA;GAE1C,EAAA,CAAChD,oBAAoB,IAAI;AAAEiD,IAAAA,OAAO,EAAE,SAAA,OAAA,GAAA;MAAA,OAAMvC,cAAc,CAAC,IAAI,CAAC,CAAA;AAAA,KAAA;GAAE,EAChE,CAACV,oBAAoB,IAAI;AAAEkD,IAAAA,MAAM,EAAE,SAAA,MAAA,GAAA;MAAA,OAAMxC,cAAc,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;GAAE,EAEhE,CAACX,oBAAoB,IAAI;AAAEyC,IAAAA,YAAY,EAAZA,YAAAA;GAAc,EACzC,CAACzC,oBAAoB,IAAI;AAAE6C,IAAAA,YAAY,EAAZA,YAAAA;GAAc,EAEzC,CAAC3C,uBAAuB,IAAI;IAC9BkD,SAAS,EAAE,SAAAC,SAAAA,CAAAA,CAAC,EAAG;MACb,IAAIA,CAAC,CAACC,GAAG,KAAK,QAAQ,EAAE3C,cAAc,CAAC,KAAK,CAAC,CAAA;MAC7C,IAAI0C,CAAC,CAACC,GAAG,KAAK,GAAG,IAAID,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;QACtCD,CAAC,CAACE,cAAc,EAAE,CAAA;QAClB5C,cAAc,CAAC,CAACD,WAAW,CAAC,CAAA;AAC7B,OAAA;AACH,KAAA;GACD,EAEG,CAACP,mBAAmB,IAAI;AAC1BqD,IAAAA,OAAO,EAAE,SAAA,OAAA,GAAA;AAAA,MAAA,OAAM7C,cAAc,CAAC,CAACD,WAAW,CAAC,CAAA;AAAA,KAAA;GAC5C,CACF,CAAA;AAED,EAAA,OACEoC,KAAA,CAAAW,aAAA,CAAAX,KAAA,CAAAY,QAAA,EAAA,IAAA,EACGC,kBAAY,CAAC9D,QAAQ,EAAA,QAAA,CAAA;IACpBuB,GAAG,EAAEiB,IAAI,CAACuB,YAAAA;AAAY,GAAA,EACnBZ,sBAAsB,CACzB,CAAA,EACFF,KAAA,CAAAW,aAAA,CAAA,KAAA,EAAA,QAAA,CAAA;AACE3D,IAAAA,SAAS,EAAE+D,UAAU,CAAC/D,SAAS,EAAE,aAAa,EAAE;AAC9C,MAAA,uBAAuB,EAAEO,OAAO,KAAKX,KAAK,IAAIW,OAAO,KAAK,UAAA;KAC3D,CAAC;IACFe,GAAG,EAAEiB,IAAI,CAACyB,WAAW;AACrBxD,IAAAA,KAAK,eACAgC,cAAc,EAAA;AACjByB,MAAAA,OAAO,EAAErD,WAAW,IAAId,OAAO,GAAGqD,SAAS,GAAG,MAAA;AAAM,KAAA,EACjD3C,KAAK,CACT;AACD0D,IAAAA,IAAI,EAAC,SAAS;AACdC,IAAAA,EAAE,EAAEnD,SAAS;AACb2B,IAAAA,YAAY,EAAE,CAACzC,oBAAoB,GAAGyC,YAAY,GAAGQ,SAAS;AAC9DJ,IAAAA,YAAY,EAAE,CAAC7C,oBAAoB,GAAG6C,YAAY,GAAGI,SAAAA;AAAS,GAAA,EAC1D1C,IAAI,CAAA,EAEPX,OAAO,EACPG,MAAM,IAAIK,eAAe,IACxB0C,KAAA,CAAAW,aAAA,CAACS,iBAAU,EACT;AAAApE,IAAAA,SAAS,EAAC,2BAA2B;AACrC0D,IAAAA,OAAO,EAAE,SAAA,OAAA,GAAA;MAAA,OAAM7C,cAAc,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AACpCwD,IAAAA,IAAI,EAAC,QAAQ;AAAA,IAAA,YAAA,EACF,cAAA;AAAc,GAAA,EAEzBrB,KAAA,CAAAW,aAAA,CAACW,eAAS,EAAA;AAAA,IAAA,aAAA,EAAa,MAAA;GAAM,CAAG,CAEnC,EACDtB,KACE,CAAAW,aAAA,CAAA,KAAA,EAAA;AAAA3D,IAAAA,SAAS,EAAyB0C,sBAAAA,IAAAA,eAAe,IAAfA,IAAAA,GAAAA,KAAAA,CAAAA,GAAAA,CAAAA,qBAAAA,GAAAA,eAAe,CAAE6B,KAAK,CAAC,GAAG,CAAC,KAAA,IAAA,GAAA,KAAA,CAAA,GAA3B,qBAA8B,CAAA,CAAC,CAAC,CAAE;AACpEjD,IAAAA,GAAG,EAAER,eAAe;AACpBN,IAAAA,KAAK,EAAE;AACLgE,MAAAA,IAAI,2BAAE/B,cAAc,CAACN,KAAK,KAAA,IAAA,GAAA,KAAA,CAAA,GAApB,sBAAsBsC,CAAC;AAC7BC,MAAAA,GAAG,EAAEjC,CAAAA,sBAAAA,GAAAA,cAAc,CAACN,KAAK,qBAApB,sBAAsBwC,CAAAA,CAAAA;;GAE7B,CAAA,CACE,CACL,CAAA;AAEP;;;AC7KaC,IAAAA,OAAO,GAA2B,SAAlCA,OAAO,CAKf,IAAA,EAAA;EAAA,IAJH7E,QAAQ,QAARA,QAAQ;AAAA,IAAA,cAAA,GAAA,IAAA,CACRJ,SAAS;AAATA,IAAAA,SAAS,+BAAG,cAAc,GAAA,cAAA;AACbkF,IAAAA,eAAe,QAA5BC,WAAW;AACKC,IAAAA,kBAAkB,QAAlCC,cAAc,CAAA;AAEd,EAAA,IAAA,eAAA,GAAkDC,cAAc,CAC9DJ,eAAe,EACfE,kBAAkB,CACnB;IAHMD,WAAW,GAAA,eAAA,CAAA,CAAA,CAAA;IAAEE,cAAc,GAAA,eAAA,CAAA,CAAA,CAAA;IAAEE,UAAU,GAAA,eAAA,CAAA,CAAA,CAAA,CAAA;AAK9C;AACA,EAAA,IAAA,YAAA,GAAiC9D,oBAAW,CAAoB;AAC9DC,MAAAA,oBAAoB,EAAE,SAACC,oBAAAA,CAAAA,GAAG,EAAEC,MAAK,EAAEC,MAAM,EAAA;AAAA,QAAA,OACvCC,mBAAU,CAACH,GAAG,EAAEC,MAAK,EAAEC,MAAM,CAAC,CAAA;AAAA,OAAA;AAChC7B,MAAAA,SAAS,EAAED,oBAAoB,CAACC,SAAS,CAAC;AAC1C+B,MAAAA,UAAU,EAAE,CACVC,eAAM,CAACC,YAAK,CAACC,UAAU,CAAC,EACxBC,aAAI,EAAE,EACNC,cAAK,CAAC;QAAEC,OAAO,EAAEJ,YAAK,CAACC,UAAU;QAAEI,OAAO,EAAEC,mBAAU,CAAC;AAAEP,UAAAA,MAAM,EAAE,CAAA;SAAG,CAAA;OAAG,CAAC,CAAA;AAE3E,KAAA,CAAC;AATMY,IAAAA,IAAI,gBAAJA,IAAI;AAAEC,IAAAA,cAAc,gBAAdA,cAAc,CAAA;EAW5B2C,uBAAiB,CAAC,CAAC5C,IAAI,CAAC6C,QAAQ,EAAE7C,IAAI,CAAC8C,SAAS,CAAC,EAAE,YAAA;IAAA,OACjDL,cAAc,CAAC,KAAK,CAAC,CAAA;GACtB,CAAA,CAAA;AAED,EAAA,IAAMM,mBAAmB,GAAA,QAAA,CAAA;AACvB,IAAA,eAAe,EAAE,QAAQ;AACzB,IAAA,eAAe,EAAER,WAAW;IAC5BxD,GAAG,EAAEiB,IAAI,CAACuB,YAAY;AACtBO,IAAAA,IAAI,EAAE,QAAA;GACF,EAAA,CAACa,UAAU,IAAI;AACjBxB,IAAAA,OAAO,EAAE,SAAA,OAAA,GAAA;MAAA,OAAMsB,cAAc,CAAC,UAAAO,IAAI,EAAA;AAAA,QAAA,OAAI,CAACA,IAAI,CAAA;OAAC,CAAA,CAAA;AAAA,KAAA;GAC7C,CACF,CAAA;AAED,EAAA,IAAMC,mBAAmB,GAAG;AAC1BtB,IAAAA,IAAI,EAAE,QAAQ;AACd,IAAA,YAAY,EAAE,KAAK;IACnB,aAAa,EAAE,CAACY,WAAW;IAC3BxD,GAAG,EAAEiB,IAAI,CAACyB,WAAW;IACrBxD,KAAK,EAAA,QAAA,CAAA,EAAA,EAAQ,CAACsE,WAAW,IAAI;AAAEb,MAAAA,OAAO,EAAE,MAAA;AAAM,KAAE,CAAG;IACnDX,SAAS,EAAE,SAACmC,SAAAA,CAAAA,KAA0B,EAAI;MACxC,IAAIA,KAAK,CAACjC,GAAG,KAAK,QAAQ,EAAEwB,cAAc,CAAC,KAAK,CAAC,CAAA;KAClD;IACD3B,MAAM,EAAE,SAACoC,MAAAA,CAAAA,KAAuB,EAAI;AAClC,MAAA,IAAMC,qBAAqB,GAAGD,KAAK,CAACE,aAA4B,CAAA;AAChE;MACA,IACE,CAACD,qBAAqB,IACtBA,qBAAqB,CAACE,YAAY,CAAC,UAAU,CAAC,KAAK,IAAI,EAEvD,OAAA;MACF,IAAMC,uBAAuB,GAAGC,sBAAsB,CACpDvD,IAAI,CAAC6C,QAAQ,CAACvC,OAAO,EACrB6C,qBAAqB,CACtB,CAAA;MACD,IAAMK,uBAAuB,GAAGD,sBAAsB,CACpDvD,IAAI,CAAC8C,SAAS,CAACxC,OAAO,EACtB6C,qBAAqB,CACtB,CAAA;AACD,MAAA,IAAMM,kBAAkB,GACtB,CAACH,uBAAuB,IAAI,CAACE,uBAAuB,CAAA;AACtD,MAAA,IAAIjB,WAAW,IAAIkB,kBAAkB,EAAEhB,cAAc,CAAC,KAAK,CAAC,CAAA;AAC9D,KAAA;GACD,CAAA;AAED,EAAA,IAAMiB,gBAAgB,GAAG;AACvBvC,IAAAA,OAAO,EAAE,SAAA,OAAA,GAAA;MAAA,OAAMsB,cAAc,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AACpCX,IAAAA,IAAI,EAAE,QAAA;GACP,CAAA;AAED,EAAA,IAAM6B,YAAY,GAAwB;AACxCpB,IAAAA,WAAW,EAAXA,WAAW;AACXtC,IAAAA,cAAc,EAAdA,cAAc;AACd8C,IAAAA,mBAAmB,EAAnBA,mBAAmB;AACnBE,IAAAA,mBAAmB,EAAnBA,mBAAmB;AACnBS,IAAAA,gBAAgB,EAAhBA,gBAAAA;GACD,CAAA;AAED,EAAA,OACEjD,KAAA,CAAAW,aAAA,CAACwC,cAAc,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEH,YAAAA;GAAY,EACzCnG,QAAQ,CACe,CAAA;AAE9B,EAAC;AAOYuG,IAAAA,cAAc,GAAkC,SAAhDA,cAAc,CAAmD,KAAA,EAAA;EAAA,IAAdvG,QAAQ,SAARA,QAAQ,CAAA;AACtE,EAAA,IAAA,kBAAA,GAAgCwG,iBAAiB,EAAE;AAA3CjB,IAAAA,mBAAmB,sBAAnBA,mBAAmB,CAAA;EAC3B,IAAMkB,KAAK,GAAGxD,KAAK,CAACyD,QAAQ,CAACC,IAAI,CAAC3G,QAAQ,CAA4B,CAAA;AACtE,EAAA,OAAO8D,kBAAY,CAAC2C,KAAK,EAAElB,mBAAmB,CAAC,CAAA;AACjD,EAAC;AAOYqB,IAAAA,kBAAkB,GAAsC,SAAxDA,kBAAkB,CAG1B,KAAA,EAAA;EAAA,IAFH5G,QAAQ,SAARA,QAAQ;IACLU,IAAI,GAAA,6BAAA,CAAA,KAAA,EAAA,SAAA,CAAA,CAAA;AAEP,EAAA,IAAA,mBAAA,GAA6B8F,iBAAiB,EAAE;AAAxCN,IAAAA,gBAAgB,uBAAhBA,gBAAgB,CAAA;AACxB,EAAA,OAAOpC,kBAAY,CAAC9D,QAAQ,eAAOkG,gBAAgB,EAAKxF,IAAI,CAAG,CAAA,CAAA;AACjE,EAAC;AASM,IAAMmG,cAAc,gBAAG5D,KAAK,CAAC6D,UAAU,CAG5C,UAAiCvF,KAAAA,EAAAA,GAA8B,EAAI;EAAA,IAAhEvB,QAAQ,SAARA,QAAQ;AAAEC,IAAAA,SAAS,SAATA,SAAS;AAAEQ,IAAAA,KAAK,SAALA,KAAK,CAAA;AAC7B,EAAA,IAAA,mBAAA,GAAgD+F,iBAAiB,EAAE;AAA3D/D,IAAAA,cAAc,uBAAdA,cAAc;AAAEgD,IAAAA,mBAAmB,uBAAnBA,mBAAmB,CAAA;AAC3C,EAAA,OACExC,KAAA,CAAAW,aAAA,CAACmD,eAAQ,EAAA,QAAA,CAAA;AACP9G,IAAAA,SAAS,EAAE+D,UAAU,CAAC/D,SAAS,EAAE,aAAa,CAAA;AAAC,GAAA,EAC3CwF,mBAAmB,EAAA;IACvBhF,KAAK,EAAA,QAAA,CAAA,EAAA,EAAOgC,cAAc,EAAKgD,mBAAmB,CAAChF,KAAK,EAAKA,KAAK,CAAE;AACpE;AACAc,IAAAA,GAAG,EAAEyF,eAAS,CAACvB,mBAAmB,CAAClE,GAAG,EAAEA,GAAG,CAAA;AAAC,GAAA,CAAA,EAE3CvB,QAAQ,CACA,CAAA;AAEf,CAAC,EAAC;AAkBF,IAAMoG,cAAc,gBAAGa,mBAAa,CAClC7D,SAAS,CACV,CAAA;AACD,IAAMoD,iBAAiB,GAAG,SAApBA,iBAAiB,GAAQ;AAC7B,EAAA,IAAMU,OAAO,GAAGC,gBAAU,CAACf,cAAc,CAAC,CAAA;EAC1C,IAAIc,OAAO,IAAI,IAAI,EAAE;IACnB,MAAME,KAAK,CAAC,kDAAkD,CAAC,CAAA;AAChE,GAAA;AACD,EAAA,OAAOF,OAAO,CAAA;AAChB,CAAC,CAAA;AAED,IAAMhC,cAAc,GAAG,SAAjBA,cAAc,CAClBmC,KAAe,EACfC,QAAwD,EACa;AACrE,EAAA,IAAA,eAAA,GAA0CrE,KAAK,CAACrC,QAAQ,CAAU,KAAK,CAAC;IAAjE2G,aAAa,GAAA,eAAA,CAAA,CAAA,CAAA;IAAEC,gBAAgB,GAAA,eAAA,CAAA,CAAA,CAAA,CAAA;EACtC,IAAMrC,UAAU,GAAGkC,KAAK,KAAKjE,SAAS,IAAIkE,QAAQ,KAAKlE,SAAS,CAAA;EAChE,IAAI+B,UAAU,EAAE,OAAO,CAACkC,KAAK,EAAEC,QAAQ,EAAEnC,UAAU,CAAC,CAAA;AACpD,EAAA,OAAO,CAACoC,aAAa,EAAEC,gBAAgB,EAAErC,UAAU,CAAC,CAAA;AACtD,CAAC,CAAA;AAED,SAASY,sBAAsB,CAC7B0B,MAA0B,EAC1BhB,KAAkB,EAAA;AAElB,EAAA,IAAI,CAACgB,MAAM,EAAE,OAAO,KAAK,CAAA;EACzB,OAAOA,MAAM,KAAKhB,KAAK,IAAIgB,MAAM,CAACC,QAAQ,CAACjB,KAAK,CAAC,CAAA;AACnD;;ACvNAkB,4BAAsB,CAAC,SAAS,CAAC;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),r=require("
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),r=require("classnames"),n=require("@floating-ui/react-dom"),o=require("@entur/icons"),i=require("@entur/button"),a=require("@entur/tokens"),l=require("@entur/layout");function s(){return s=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},s.apply(this,arguments)}function u(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)t.indexOf(r=i[n])>=0||(o[r]=e[r]);return o}function c(e){switch(e){case"top-left":return"top-start";case"top-right":return"top-end";case"bottom-left":return"bottom-start";case"bottom-right":return"bottom-end";default:return e}}var d=["placement","content","children","className","isOpen","disableHoverListener","disableFocusListener","disableKeyboardListener","disableClickListner","showCloseButton","variant","style"],f=["children"],p=t.forwardRef((function(n,o){var i=n.children,a=n.className,u=n.style,c=m(),d=c.floatingStyles,f=c.popoverContentProps;return t.createElement(l.Contrast,s({className:r(a,"eds-popover")},f,{style:s({},d,f.style,u),ref:e.mergeRefs(f.ref,o)}),i)})),v=t.createContext(void 0),m=function(){var e=t.useContext(v);if(null==e)throw Error("usePopoverContext must be used within <Popover/>");return e};function g(e,t){return!!e&&(e===t||e.contains(t))}e.warnAboutMissingStyles("tooltip"),exports.Popover=function(r){var o=r.children,i=r.placement,l=void 0===i?"bottom-start":i,u=function(e,r){var n=t.useState(!1),o=void 0!==e&&void 0!==r;return o?[e,r,o]:[n[0],n[1],o]}(r.showPopover,r.setShowPopover),d=u[0],f=u[1],p=u[2],m=n.useFloating({whileElementsMounted:function(e,t,r){return n.autoUpdate(e,t,r)},placement:c(l),middleware:[n.offset(a.space.extraSmall),n.flip(),n.shift({padding:a.space.extraSmall,limiter:n.limitShift({offset:8})})]}),y=m.refs,b=m.floatingStyles;e.useOnClickOutside([y.floating,y.reference],(function(){return f(!1)}));var h=s({"aria-haspopup":"dialog","aria-expanded":d,ref:y.setReference,type:"button"},!p&&{onClick:function(){return f((function(e){return!e}))}}),w={role:"dialog","aria-modal":!1,"aria-hidden":!d,ref:y.setFloating,style:s({},!d&&{display:"none"}),onKeyDown:function(e){"Escape"===e.key&&f(!1)},onBlur:function(e){var t=e.relatedTarget;if(t&&"-1"!==t.getAttribute("tabindex")){var r=g(y.floating.current,t),n=g(y.reference.current,t);d&&!r&&!n&&f(!1)}}};return t.createElement(v.Provider,{value:{showPopover:d,floatingStyles:b,popoverTriggerProps:h,popoverContentProps:w,closeButtonProps:{onClick:function(){return f(!1)},type:"button"}}},o)},exports.PopoverCloseButton=function(e){var r=e.children,n=u(e,f),o=m();return t.cloneElement(r,s({},o.closeButtonProps,n))},exports.PopoverContent=p,exports.PopoverTrigger=function(e){var r=e.children,n=m().popoverTriggerProps,o=t.Children.only(r);return t.cloneElement(o,n)},exports.Tooltip=function(l){var f,p,v,m=l.placement,g=l.content,y=l.children,b=l.className,h=l.isOpen,w=void 0!==h&&h,C=l.disableHoverListener,E=void 0!==C&&C,P=l.disableFocusListener,x=void 0!==P&&P,k=l.disableKeyboardListener,S=void 0===k||k,L=l.disableClickListner,O=void 0===L||L,T=l.showCloseButton,R=void 0===T||T,q=l.variant,B=l.style,F=u(l,d),M=t.useState(w),N=M[0],_=M[1],j=t.useRef(null),D=e.useRandomId("eds-tooltip"),K=t.useRef(),I=t.useRef(),A=n.useFloating({whileElementsMounted:function(e,t,r){return n.autoUpdate(e,t,r)},placement:c(m),middleware:[n.offset(a.space.extraSmall),n.flip(),n.shift({padding:a.space.extraSmall,limiter:n.limitShift({offset:8})}),n.arrow({element:j,padding:a.borderRadiuses.medium})]}),H=A.refs,U=A.floatingStyles,z=A.middlewareData,G=A.placement,J=function(){clearTimeout(I.current),K.current=setTimeout((function(){_(!0)}),150)},Q=function(){clearTimeout(K.current),I.current=setTimeout((function(){_(!1)}),300)};t.useEffect((function(){return function(){clearTimeout(K.current),clearTimeout(I.current)}}),[]);var V=s({"aria-describedby":N?D:void 0},!x&&{onFocus:function(){return _(!0)}},!x&&{onBlur:function(){return _(!1)}},!E&&{onMouseEnter:J},!E&&{onMouseLeave:Q},!S&&{onKeyDown:function(e){"Escape"===e.key&&_(!1)," "!==e.key&&"Enter"!==e.key||(e.preventDefault(),_(!N))}},!O&&{onClick:function(){return _(!N)}});return t.createElement(t.Fragment,null,t.cloneElement(y,s({ref:H.setReference},V)),t.createElement("div",s({className:r(b,"eds-tooltip",{"eds-tooltip--negative":"error"===q||"negative"===q}),ref:H.setFloating,style:s({},U,{display:N&&g?void 0:"none"},B),role:"tooltip",id:D,onMouseEnter:E?void 0:J,onMouseLeave:E?void 0:Q},F),g,w&&R&&t.createElement(i.IconButton,{className:"eds-tooltip__close-button",onClick:function(){return _(!1)},type:"button","aria-label":"Lukk tooltip"},t.createElement(o.CloseIcon,{"aria-hidden":"true"})),t.createElement("div",{className:"eds-tooltip__arrow--"+(null==G||null==(f=G.split("-"))?void 0:f[0]),ref:j,style:{left:null==(p=z.arrow)?void 0:p.x,top:null==(v=z.arrow)?void 0:v.y}})))};
|
|
2
2
|
//# sourceMappingURL=tooltip.cjs.production.min.js.map
|