@easypost/easy-ui 1.0.0-alpha.4 → 1.0.0-alpha.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.
Files changed (133) hide show
  1. package/Badge/index.js +32 -26
  2. package/Badge/index.mjs +32 -26
  3. package/Banner/index.js +15 -16
  4. package/Banner/index.mjs +15 -16
  5. package/Button/Button.d.ts +61 -0
  6. package/Button/Button.d.ts.map +1 -1
  7. package/Button/index.js +34 -69
  8. package/Button/index.mjs +33 -68
  9. package/CHANGELOG.md +21 -0
  10. package/Card/index.js +84 -5
  11. package/Card/index.mjs +84 -5
  12. package/Checkbox/index.js +84 -72
  13. package/Checkbox/index.mjs +84 -72
  14. package/CodeBlock/index.js +43 -49
  15. package/CodeBlock/index.mjs +43 -49
  16. package/DropdownButton/DropdownButton.d.ts +48 -0
  17. package/DropdownButton/DropdownButton.d.ts.map +1 -1
  18. package/DropdownButton/index.js +29 -101
  19. package/DropdownButton/index.mjs +29 -85
  20. package/HorizontalGrid/index.js +11 -31
  21. package/HorizontalGrid/index.mjs +11 -31
  22. package/HorizontalStack/index.js +48 -4
  23. package/HorizontalStack/index.mjs +48 -4
  24. package/Icon/Icon.d.ts +51 -0
  25. package/Icon/Icon.d.ts.map +1 -1
  26. package/Icon/index.js +38 -4
  27. package/Icon/index.mjs +38 -4
  28. package/IconButton/IconButton.d.ts +62 -0
  29. package/IconButton/IconButton.d.ts.map +1 -1
  30. package/IconButton/index.js +26 -43
  31. package/IconButton/index.mjs +25 -42
  32. package/InputField/Label.d.ts +2 -2
  33. package/InputField/index.js +282 -10
  34. package/InputField/index.mjs +266 -10
  35. package/InputField/utilities.d.ts +1 -1
  36. package/InputField/utilities.d.ts.map +1 -1
  37. package/Menu/MenuOverlay.d.ts.map +1 -1
  38. package/Menu/index.js +178 -1958
  39. package/Menu/index.mjs +168 -1948
  40. package/Menu/utilities.d.ts +11 -0
  41. package/Menu/utilities.d.ts.map +1 -0
  42. package/Notification/index.js +1534 -14
  43. package/Notification/index.mjs +1518 -14
  44. package/Provider/index.js +15 -15
  45. package/Provider/index.mjs +15 -15
  46. package/RadioGroup/index.js +63 -63
  47. package/RadioGroup/index.mjs +63 -63
  48. package/Select/Select.d.ts +88 -0
  49. package/Select/Select.d.ts.map +1 -0
  50. package/Select/Select.stories.d.ts +17 -0
  51. package/Select/Select.stories.d.ts.map +1 -0
  52. package/Select/Select.test.d.ts +2 -0
  53. package/Select/Select.test.d.ts.map +1 -0
  54. package/Select/SelectContext.d.ts +14 -0
  55. package/Select/SelectContext.d.ts.map +1 -0
  56. package/Select/SelectField.d.ts +62 -0
  57. package/Select/SelectField.d.ts.map +1 -0
  58. package/Select/SelectOption.d.ts +23 -0
  59. package/Select/SelectOption.d.ts.map +1 -0
  60. package/Select/SelectOverlay.d.ts +3 -0
  61. package/Select/SelectOverlay.d.ts.map +1 -0
  62. package/Select/SelectSection.d.ts +22 -0
  63. package/Select/SelectSection.d.ts.map +1 -0
  64. package/Select/SelectTrigger.d.ts +30 -0
  65. package/Select/SelectTrigger.d.ts.map +1 -0
  66. package/Select/index.d.ts +2 -0
  67. package/Select/index.d.ts.map +1 -0
  68. package/Select/index.js +816 -0
  69. package/Select/index.mjs +816 -0
  70. package/SelectorErrorTooltip/index.js +102 -11
  71. package/SelectorErrorTooltip/index.mjs +86 -11
  72. package/Text/index.js +85 -4
  73. package/Text/index.mjs +85 -4
  74. package/TextField/index.js +19 -38
  75. package/TextField/index.mjs +19 -38
  76. package/Textarea/index.js +20 -37
  77. package/Textarea/index.mjs +20 -37
  78. package/Theme/index.js +145 -9
  79. package/Theme/index.mjs +145 -9
  80. package/Toggle/index.js +51 -50
  81. package/Toggle/index.mjs +51 -50
  82. package/Tooltip/index.js +299 -10
  83. package/Tooltip/index.mjs +299 -10
  84. package/UnstyledButton/index.js +4 -4
  85. package/UnstyledButton/index.mjs +3 -3
  86. package/VerticalStack/index.js +13 -47
  87. package/VerticalStack/index.mjs +13 -47
  88. package/__chunks__/ExpandMore400-7c5263a4.mjs +49 -0
  89. package/__chunks__/ExpandMore400-92646971.js +65 -0
  90. package/__chunks__/InputIcon-2317befd.mjs +148 -0
  91. package/__chunks__/InputIcon-d3963cf8.js +147 -0
  92. package/__chunks__/{import-e7f45c7e.mjs → import-0561e1ba.mjs} +3 -3
  93. package/__chunks__/{import-b7971a11.mjs → import-19bc38ac.mjs} +72 -34
  94. package/__chunks__/{import-01299af6.js → import-24a482e1.js} +3 -2
  95. package/__chunks__/{import-baa3cd0c.mjs → import-29af6941.mjs} +4 -3
  96. package/__chunks__/{import-0d1b4d93.js → import-2b302763.js} +193 -141
  97. package/__chunks__/{import-ab878fb6.mjs → import-3d962a94.mjs} +205 -153
  98. package/__chunks__/{import-86330a7c.mjs → import-6a831ca1.mjs} +16 -15
  99. package/__chunks__/{import-7545401a.js → import-8b6c0bc7.js} +3 -3
  100. package/__chunks__/{import-63bf0645.js → import-a1e0f814.js} +47 -9
  101. package/__chunks__/{import-3ab42f86.js → import-a2023d8f.js} +35 -22
  102. package/__chunks__/{import-76076ca6.js → import-dea5a24d.js} +15 -14
  103. package/__chunks__/{import-856e0385.mjs → import-f1f4792a.mjs} +36 -23
  104. package/__chunks__/{UnstyledButton-883f0c6c.mjs → index-29d7bca9.mjs} +17 -42
  105. package/__chunks__/{UnstyledButton-96172ec0.js → index-3985350a.js} +17 -42
  106. package/__chunks__/{overlayscrollbars-react.es-c8369a03.mjs → overlayscrollbars-react.es-7f332a3b.mjs} +4 -4
  107. package/__chunks__/{overlayscrollbars-react.es-20563393.js → overlayscrollbars-react.es-f2a0bcff.js} +4 -4
  108. package/__chunks__/{real-module-e4cd2301.mjs → real-module-515df21d.mjs} +1 -1
  109. package/__chunks__/{real-module-ae2a4342.js → real-module-e36b1436.js} +1 -1
  110. package/__chunks__/useTriggerWidth-156b038a.js +2030 -0
  111. package/__chunks__/useTriggerWidth-addcd1d6.mjs +2031 -0
  112. package/package.json +11 -11
  113. package/style.css +1423 -1196
  114. package/utilities/css.js +14 -58
  115. package/utilities/css.mjs +14 -58
  116. package/__chunks__/Card-7bbd41e0.mjs +0 -110
  117. package/__chunks__/Card-dac53c75.js +0 -109
  118. package/__chunks__/HorizontalStack-a441c63f.mjs +0 -80
  119. package/__chunks__/HorizontalStack-a862839b.js +0 -79
  120. package/__chunks__/Icon-3d00481a.js +0 -44
  121. package/__chunks__/Icon-a75b5201.mjs +0 -45
  122. package/__chunks__/InputField-4fbaae06.js +0 -487
  123. package/__chunks__/InputField-a272f602.mjs +0 -472
  124. package/__chunks__/Notification-b8eafec6.mjs +0 -1456
  125. package/__chunks__/Notification-c5b34eb3.js +0 -1471
  126. package/__chunks__/SelectorErrorTooltip-43c5e29e.js +0 -84
  127. package/__chunks__/SelectorErrorTooltip-b6204987.mjs +0 -69
  128. package/__chunks__/Text-1ae70c19.js +0 -102
  129. package/__chunks__/Text-4ae50d5c.mjs +0 -103
  130. package/__chunks__/Theme-4e498252.mjs +0 -132
  131. package/__chunks__/Theme-751e5575.js +0 -131
  132. package/__chunks__/Tooltip-bd55165e.js +0 -317
  133. package/__chunks__/Tooltip-f7e67b21.mjs +0 -318
@@ -1,317 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __defProps = Object.defineProperties;
4
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
5
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
8
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
9
- var __spreadValues = (a, b) => {
10
- for (var prop in b || (b = {}))
11
- if (__hasOwnProp.call(b, prop))
12
- __defNormalProp(a, prop, b[prop]);
13
- if (__getOwnPropSymbols)
14
- for (var prop of __getOwnPropSymbols(b)) {
15
- if (__propIsEnum.call(b, prop))
16
- __defNormalProp(a, prop, b[prop]);
17
- }
18
- return a;
19
- };
20
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
21
- const React = require("react");
22
- const Text = require("./Text-1ae70c19.js");
23
- const utilities_css = require("../utilities/css.js");
24
- const _import$2 = require("./import-3ab42f86.js");
25
- const _import = require("./import-63bf0645.js");
26
- const _import$1 = require("./import-0d1b4d93.js");
27
- function $326e436e94273fe1$export$1c4b08e0eca38426(props, state) {
28
- let domProps = _import.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
29
- labelable: true
30
- });
31
- let { hoverProps } = _import$1.$6179b936705e76d3$export$ae780daf29e6d456({
32
- onHoverStart: () => {
33
- return state === null || state === void 0 ? void 0 : state.open(true);
34
- },
35
- onHoverEnd: () => {
36
- return state === null || state === void 0 ? void 0 : state.close();
37
- }
38
- });
39
- return {
40
- tooltipProps: _import.$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, hoverProps, {
41
- role: "tooltip"
42
- })
43
- };
44
- }
45
- function $4e1b34546679e357$export$a6da6c504e4bba8b(props, state, ref) {
46
- let { isDisabled, trigger } = props;
47
- let tooltipId = _import.$bdb11010cef70236$export$f680877a34711e37();
48
- let isHovered = React.useRef(false);
49
- let isFocused = React.useRef(false);
50
- let handleShow = () => {
51
- if (isHovered.current || isFocused.current)
52
- state.open(isFocused.current);
53
- };
54
- let handleHide = (immediate) => {
55
- if (!isHovered.current && !isFocused.current)
56
- state.close(immediate);
57
- };
58
- React.useEffect(() => {
59
- let onKeyDown = (e) => {
60
- if (ref && ref.current) {
61
- if (e.key === "Escape") {
62
- e.stopPropagation();
63
- state.close(true);
64
- }
65
- }
66
- };
67
- if (state.isOpen) {
68
- document.addEventListener("keydown", onKeyDown, true);
69
- return () => {
70
- document.removeEventListener("keydown", onKeyDown, true);
71
- };
72
- }
73
- }, [
74
- ref,
75
- state
76
- ]);
77
- let onHoverStart = () => {
78
- if (trigger === "focus")
79
- return;
80
- if (_import$1.$507fabe10e71c6fb$export$630ff653c5ada6a9() === "pointer")
81
- isHovered.current = true;
82
- else
83
- isHovered.current = false;
84
- handleShow();
85
- };
86
- let onHoverEnd = () => {
87
- if (trigger === "focus")
88
- return;
89
- isFocused.current = false;
90
- isHovered.current = false;
91
- handleHide();
92
- };
93
- let onPressStart = () => {
94
- isFocused.current = false;
95
- isHovered.current = false;
96
- handleHide(true);
97
- };
98
- let onFocus = () => {
99
- let isVisible = _import$1.$507fabe10e71c6fb$export$b9b3dfddab17db27();
100
- if (isVisible) {
101
- isFocused.current = true;
102
- handleShow();
103
- }
104
- };
105
- let onBlur = () => {
106
- isFocused.current = false;
107
- isHovered.current = false;
108
- handleHide(true);
109
- };
110
- let { hoverProps } = _import$1.$6179b936705e76d3$export$ae780daf29e6d456({
111
- isDisabled,
112
- onHoverStart,
113
- onHoverEnd
114
- });
115
- let { pressProps } = _import$1.$f6c31cce2adf654f$export$45712eceda6fad21({
116
- onPressStart
117
- });
118
- let { focusableProps } = _import$1.$e6afbd83fe6ebbd2$export$4c014de7c8940b4c({
119
- isDisabled,
120
- onFocus,
121
- onBlur
122
- }, ref);
123
- return {
124
- triggerProps: __spreadValues({
125
- "aria-describedby": state.isOpen ? tooltipId : void 0
126
- }, _import.$3ef42575df84b30b$export$9d1611c77c2fe928(focusableProps, hoverProps, pressProps)),
127
- tooltipProps: {
128
- id: tooltipId
129
- }
130
- };
131
- }
132
- const $8796f90736e175cb$var$TOOLTIP_DELAY = 1500;
133
- const $8796f90736e175cb$var$TOOLTIP_COOLDOWN = 500;
134
- let $8796f90736e175cb$var$tooltips = {};
135
- let $8796f90736e175cb$var$tooltipId = 0;
136
- let $8796f90736e175cb$var$globalWarmedUp = false;
137
- let $8796f90736e175cb$var$globalWarmUpTimeout = null;
138
- let $8796f90736e175cb$var$globalCooldownTimeout = null;
139
- function $8796f90736e175cb$export$4d40659c25ecb50b(props = {}) {
140
- let { delay = $8796f90736e175cb$var$TOOLTIP_DELAY, closeDelay = $8796f90736e175cb$var$TOOLTIP_COOLDOWN } = props;
141
- let { isOpen, open, close } = _import$2.$fc909762b330b746$export$61c6a8c84e605fb6(props);
142
- let id = React.useMemo(() => `${++$8796f90736e175cb$var$tooltipId}`, []);
143
- let closeTimeout = React.useRef();
144
- let ensureTooltipEntry = () => {
145
- $8796f90736e175cb$var$tooltips[id] = hideTooltip;
146
- };
147
- let closeOpenTooltips = () => {
148
- for (let hideTooltipId in $8796f90736e175cb$var$tooltips)
149
- if (hideTooltipId !== id) {
150
- $8796f90736e175cb$var$tooltips[hideTooltipId](true);
151
- delete $8796f90736e175cb$var$tooltips[hideTooltipId];
152
- }
153
- };
154
- let showTooltip = () => {
155
- clearTimeout(closeTimeout.current);
156
- closeTimeout.current = null;
157
- closeOpenTooltips();
158
- ensureTooltipEntry();
159
- $8796f90736e175cb$var$globalWarmedUp = true;
160
- open();
161
- if ($8796f90736e175cb$var$globalWarmUpTimeout) {
162
- clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
163
- $8796f90736e175cb$var$globalWarmUpTimeout = null;
164
- }
165
- if ($8796f90736e175cb$var$globalCooldownTimeout) {
166
- clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
167
- $8796f90736e175cb$var$globalCooldownTimeout = null;
168
- }
169
- };
170
- let hideTooltip = (immediate) => {
171
- if (immediate || closeDelay <= 0) {
172
- clearTimeout(closeTimeout.current);
173
- closeTimeout.current = null;
174
- close();
175
- } else if (!closeTimeout.current)
176
- closeTimeout.current = setTimeout(() => {
177
- closeTimeout.current = null;
178
- close();
179
- }, closeDelay);
180
- if ($8796f90736e175cb$var$globalWarmUpTimeout) {
181
- clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
182
- $8796f90736e175cb$var$globalWarmUpTimeout = null;
183
- }
184
- if ($8796f90736e175cb$var$globalWarmedUp) {
185
- if ($8796f90736e175cb$var$globalCooldownTimeout)
186
- clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
187
- $8796f90736e175cb$var$globalCooldownTimeout = setTimeout(() => {
188
- delete $8796f90736e175cb$var$tooltips[id];
189
- $8796f90736e175cb$var$globalCooldownTimeout = null;
190
- $8796f90736e175cb$var$globalWarmedUp = false;
191
- }, Math.max($8796f90736e175cb$var$TOOLTIP_COOLDOWN, closeDelay));
192
- }
193
- };
194
- let warmupTooltip = () => {
195
- closeOpenTooltips();
196
- ensureTooltipEntry();
197
- if (!isOpen && !$8796f90736e175cb$var$globalWarmUpTimeout && !$8796f90736e175cb$var$globalWarmedUp)
198
- $8796f90736e175cb$var$globalWarmUpTimeout = setTimeout(() => {
199
- $8796f90736e175cb$var$globalWarmUpTimeout = null;
200
- $8796f90736e175cb$var$globalWarmedUp = true;
201
- showTooltip();
202
- }, delay);
203
- else if (!isOpen)
204
- showTooltip();
205
- };
206
- React.useEffect(() => {
207
- return () => {
208
- clearTimeout(closeTimeout.current);
209
- let tooltip = $8796f90736e175cb$var$tooltips[id];
210
- if (tooltip)
211
- delete $8796f90736e175cb$var$tooltips[id];
212
- };
213
- }, [
214
- id
215
- ]);
216
- return {
217
- isOpen,
218
- open: (immediate) => {
219
- if (!immediate && delay > 0 && !closeTimeout.current)
220
- warmupTooltip();
221
- else
222
- showTooltip();
223
- },
224
- close: hideTooltip
225
- };
226
- }
227
- const Tooltip$1 = "_Tooltip_139vo_5";
228
- const text = "_text_139vo_21";
229
- const arrow = "_arrow_139vo_27";
230
- const top = "_top_139vo_36";
231
- const bottom = "_bottom_139vo_37";
232
- const left = "_left_139vo_41";
233
- const right = "_right_139vo_42";
234
- const styles = {
235
- Tooltip: Tooltip$1,
236
- text,
237
- arrow,
238
- top,
239
- bottom,
240
- left,
241
- right
242
- };
243
- const CONTAINER_PADDING = 12;
244
- const ARROW_BOUNDARY_OFFSET = 12;
245
- const OFFSET = 12;
246
- const DEFAULT_PLACEMENT = "top";
247
- const OPEN_DELAY = 1e3;
248
- const CLOSE_DELAY = 250;
249
- function Tooltip(props) {
250
- const { children, isImmediate } = props;
251
- const triggerRef = React.useRef(null);
252
- const triggerInputProps = __spreadProps(__spreadValues({}, props), {
253
- delay: isImmediate ? 0 : OPEN_DELAY,
254
- closeDelay: CLOSE_DELAY
255
- });
256
- const tooltipTriggerState = $8796f90736e175cb$export$4d40659c25ecb50b(triggerInputProps);
257
- const { triggerProps, tooltipProps: tooltipPropsFromTrigger } = $4e1b34546679e357$export$a6da6c504e4bba8b(triggerInputProps, tooltipTriggerState, triggerRef);
258
- return /* @__PURE__ */ React.createElement(React.Fragment, null, React.cloneElement(children, __spreadProps(__spreadValues({}, _import.$3ef42575df84b30b$export$9d1611c77c2fe928(triggerProps, children.props)), {
259
- ref: triggerRef
260
- })), tooltipTriggerState.isOpen && /* @__PURE__ */ React.createElement(_import$2.$f57aed4a881a3485$export$b47c3594eab58386, null, /* @__PURE__ */ React.createElement(
261
- TooltipInner,
262
- __spreadProps(__spreadValues({}, props), {
263
- triggerRef,
264
- tooltipPropsFromTrigger,
265
- tooltipTriggerState
266
- })
267
- )));
268
- }
269
- function TooltipInner(props) {
270
- const {
271
- content,
272
- placement: targetPlacement = DEFAULT_PLACEMENT,
273
- triggerRef,
274
- tooltipTriggerState,
275
- tooltipPropsFromTrigger
276
- } = props;
277
- const tooltipRef = React.useRef(null);
278
- const { overlayProps, arrowProps, placement, updatePosition } = _import$2.$2a41e45df1593e64$export$d39e1813b3bdd0e1({
279
- arrowBoundaryOffset: ARROW_BOUNDARY_OFFSET,
280
- containerPadding: CONTAINER_PADDING,
281
- isOpen: tooltipTriggerState.isOpen,
282
- offset: OFFSET,
283
- overlayRef: tooltipRef,
284
- placement: targetPlacement,
285
- targetRef: triggerRef
286
- });
287
- const { tooltipProps: tooltipPropsFromTooltip } = $326e436e94273fe1$export$1c4b08e0eca38426(
288
- _import.$3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, props),
289
- tooltipTriggerState
290
- );
291
- const tooltipProps = _import.$3ef42575df84b30b$export$9d1611c77c2fe928(
292
- overlayProps,
293
- tooltipPropsFromTooltip,
294
- tooltipPropsFromTrigger
295
- );
296
- const style = __spreadValues(__spreadValues({}, tooltipProps.style), utilities_css.getComponentToken(
297
- "tooltip",
298
- "container_padding",
299
- `${utilities_css.pxToRem(CONTAINER_PADDING)}rem`
300
- ));
301
- React.useEffect(() => {
302
- updatePosition();
303
- }, [content, updatePosition]);
304
- return /* @__PURE__ */ React.createElement(
305
- "span",
306
- __spreadProps(__spreadValues({
307
- ref: tooltipRef
308
- }, tooltipProps), {
309
- className: utilities_css.classNames(styles.Tooltip, styles[placement]),
310
- "data-placement": placement,
311
- style
312
- }),
313
- /* @__PURE__ */ React.createElement("span", { className: styles.text }, /* @__PURE__ */ React.createElement(Text.Text, { variant: "subtitle2" }, content)),
314
- /* @__PURE__ */ React.createElement("span", __spreadValues({ className: styles.arrow }, arrowProps))
315
- );
316
- }
317
- exports.Tooltip = Tooltip;
@@ -1,318 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __defProps = Object.defineProperties;
3
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
7
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
- var __spreadValues = (a, b) => {
9
- for (var prop in b || (b = {}))
10
- if (__hasOwnProp.call(b, prop))
11
- __defNormalProp(a, prop, b[prop]);
12
- if (__getOwnPropSymbols)
13
- for (var prop of __getOwnPropSymbols(b)) {
14
- if (__propIsEnum.call(b, prop))
15
- __defNormalProp(a, prop, b[prop]);
16
- }
17
- return a;
18
- };
19
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
- import React__default, { useRef, useEffect, useMemo } from "react";
21
- import { T as Text } from "./Text-4ae50d5c.mjs";
22
- import { getComponentToken, pxToRem, classNames } from "../utilities/css.mjs";
23
- import { a as $fc909762b330b746$export$61c6a8c84e605fb6, c as $f57aed4a881a3485$export$b47c3594eab58386, e as $2a41e45df1593e64$export$d39e1813b3bdd0e1 } from "./import-856e0385.mjs";
24
- import { a as $65484d02dcb7eb3e$export$457c3d6518dd4c6f, $ as $3ef42575df84b30b$export$9d1611c77c2fe928, b as $bdb11010cef70236$export$f680877a34711e37 } from "./import-b7971a11.mjs";
25
- import { a as $6179b936705e76d3$export$ae780daf29e6d456, b as $f6c31cce2adf654f$export$45712eceda6fad21, c as $e6afbd83fe6ebbd2$export$4c014de7c8940b4c, f as $507fabe10e71c6fb$export$630ff653c5ada6a9, i as $507fabe10e71c6fb$export$b9b3dfddab17db27 } from "./import-ab878fb6.mjs";
26
- function $326e436e94273fe1$export$1c4b08e0eca38426(props, state) {
27
- let domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
28
- labelable: true
29
- });
30
- let { hoverProps } = $6179b936705e76d3$export$ae780daf29e6d456({
31
- onHoverStart: () => {
32
- return state === null || state === void 0 ? void 0 : state.open(true);
33
- },
34
- onHoverEnd: () => {
35
- return state === null || state === void 0 ? void 0 : state.close();
36
- }
37
- });
38
- return {
39
- tooltipProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, hoverProps, {
40
- role: "tooltip"
41
- })
42
- };
43
- }
44
- function $4e1b34546679e357$export$a6da6c504e4bba8b(props, state, ref) {
45
- let { isDisabled, trigger } = props;
46
- let tooltipId = $bdb11010cef70236$export$f680877a34711e37();
47
- let isHovered = useRef(false);
48
- let isFocused = useRef(false);
49
- let handleShow = () => {
50
- if (isHovered.current || isFocused.current)
51
- state.open(isFocused.current);
52
- };
53
- let handleHide = (immediate) => {
54
- if (!isHovered.current && !isFocused.current)
55
- state.close(immediate);
56
- };
57
- useEffect(() => {
58
- let onKeyDown = (e) => {
59
- if (ref && ref.current) {
60
- if (e.key === "Escape") {
61
- e.stopPropagation();
62
- state.close(true);
63
- }
64
- }
65
- };
66
- if (state.isOpen) {
67
- document.addEventListener("keydown", onKeyDown, true);
68
- return () => {
69
- document.removeEventListener("keydown", onKeyDown, true);
70
- };
71
- }
72
- }, [
73
- ref,
74
- state
75
- ]);
76
- let onHoverStart = () => {
77
- if (trigger === "focus")
78
- return;
79
- if ($507fabe10e71c6fb$export$630ff653c5ada6a9() === "pointer")
80
- isHovered.current = true;
81
- else
82
- isHovered.current = false;
83
- handleShow();
84
- };
85
- let onHoverEnd = () => {
86
- if (trigger === "focus")
87
- return;
88
- isFocused.current = false;
89
- isHovered.current = false;
90
- handleHide();
91
- };
92
- let onPressStart = () => {
93
- isFocused.current = false;
94
- isHovered.current = false;
95
- handleHide(true);
96
- };
97
- let onFocus = () => {
98
- let isVisible = $507fabe10e71c6fb$export$b9b3dfddab17db27();
99
- if (isVisible) {
100
- isFocused.current = true;
101
- handleShow();
102
- }
103
- };
104
- let onBlur = () => {
105
- isFocused.current = false;
106
- isHovered.current = false;
107
- handleHide(true);
108
- };
109
- let { hoverProps } = $6179b936705e76d3$export$ae780daf29e6d456({
110
- isDisabled,
111
- onHoverStart,
112
- onHoverEnd
113
- });
114
- let { pressProps } = $f6c31cce2adf654f$export$45712eceda6fad21({
115
- onPressStart
116
- });
117
- let { focusableProps } = $e6afbd83fe6ebbd2$export$4c014de7c8940b4c({
118
- isDisabled,
119
- onFocus,
120
- onBlur
121
- }, ref);
122
- return {
123
- triggerProps: __spreadValues({
124
- "aria-describedby": state.isOpen ? tooltipId : void 0
125
- }, $3ef42575df84b30b$export$9d1611c77c2fe928(focusableProps, hoverProps, pressProps)),
126
- tooltipProps: {
127
- id: tooltipId
128
- }
129
- };
130
- }
131
- const $8796f90736e175cb$var$TOOLTIP_DELAY = 1500;
132
- const $8796f90736e175cb$var$TOOLTIP_COOLDOWN = 500;
133
- let $8796f90736e175cb$var$tooltips = {};
134
- let $8796f90736e175cb$var$tooltipId = 0;
135
- let $8796f90736e175cb$var$globalWarmedUp = false;
136
- let $8796f90736e175cb$var$globalWarmUpTimeout = null;
137
- let $8796f90736e175cb$var$globalCooldownTimeout = null;
138
- function $8796f90736e175cb$export$4d40659c25ecb50b(props = {}) {
139
- let { delay = $8796f90736e175cb$var$TOOLTIP_DELAY, closeDelay = $8796f90736e175cb$var$TOOLTIP_COOLDOWN } = props;
140
- let { isOpen, open, close } = $fc909762b330b746$export$61c6a8c84e605fb6(props);
141
- let id = useMemo(() => `${++$8796f90736e175cb$var$tooltipId}`, []);
142
- let closeTimeout = useRef();
143
- let ensureTooltipEntry = () => {
144
- $8796f90736e175cb$var$tooltips[id] = hideTooltip;
145
- };
146
- let closeOpenTooltips = () => {
147
- for (let hideTooltipId in $8796f90736e175cb$var$tooltips)
148
- if (hideTooltipId !== id) {
149
- $8796f90736e175cb$var$tooltips[hideTooltipId](true);
150
- delete $8796f90736e175cb$var$tooltips[hideTooltipId];
151
- }
152
- };
153
- let showTooltip = () => {
154
- clearTimeout(closeTimeout.current);
155
- closeTimeout.current = null;
156
- closeOpenTooltips();
157
- ensureTooltipEntry();
158
- $8796f90736e175cb$var$globalWarmedUp = true;
159
- open();
160
- if ($8796f90736e175cb$var$globalWarmUpTimeout) {
161
- clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
162
- $8796f90736e175cb$var$globalWarmUpTimeout = null;
163
- }
164
- if ($8796f90736e175cb$var$globalCooldownTimeout) {
165
- clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
166
- $8796f90736e175cb$var$globalCooldownTimeout = null;
167
- }
168
- };
169
- let hideTooltip = (immediate) => {
170
- if (immediate || closeDelay <= 0) {
171
- clearTimeout(closeTimeout.current);
172
- closeTimeout.current = null;
173
- close();
174
- } else if (!closeTimeout.current)
175
- closeTimeout.current = setTimeout(() => {
176
- closeTimeout.current = null;
177
- close();
178
- }, closeDelay);
179
- if ($8796f90736e175cb$var$globalWarmUpTimeout) {
180
- clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
181
- $8796f90736e175cb$var$globalWarmUpTimeout = null;
182
- }
183
- if ($8796f90736e175cb$var$globalWarmedUp) {
184
- if ($8796f90736e175cb$var$globalCooldownTimeout)
185
- clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
186
- $8796f90736e175cb$var$globalCooldownTimeout = setTimeout(() => {
187
- delete $8796f90736e175cb$var$tooltips[id];
188
- $8796f90736e175cb$var$globalCooldownTimeout = null;
189
- $8796f90736e175cb$var$globalWarmedUp = false;
190
- }, Math.max($8796f90736e175cb$var$TOOLTIP_COOLDOWN, closeDelay));
191
- }
192
- };
193
- let warmupTooltip = () => {
194
- closeOpenTooltips();
195
- ensureTooltipEntry();
196
- if (!isOpen && !$8796f90736e175cb$var$globalWarmUpTimeout && !$8796f90736e175cb$var$globalWarmedUp)
197
- $8796f90736e175cb$var$globalWarmUpTimeout = setTimeout(() => {
198
- $8796f90736e175cb$var$globalWarmUpTimeout = null;
199
- $8796f90736e175cb$var$globalWarmedUp = true;
200
- showTooltip();
201
- }, delay);
202
- else if (!isOpen)
203
- showTooltip();
204
- };
205
- useEffect(() => {
206
- return () => {
207
- clearTimeout(closeTimeout.current);
208
- let tooltip = $8796f90736e175cb$var$tooltips[id];
209
- if (tooltip)
210
- delete $8796f90736e175cb$var$tooltips[id];
211
- };
212
- }, [
213
- id
214
- ]);
215
- return {
216
- isOpen,
217
- open: (immediate) => {
218
- if (!immediate && delay > 0 && !closeTimeout.current)
219
- warmupTooltip();
220
- else
221
- showTooltip();
222
- },
223
- close: hideTooltip
224
- };
225
- }
226
- const Tooltip$1 = "_Tooltip_139vo_5";
227
- const text = "_text_139vo_21";
228
- const arrow = "_arrow_139vo_27";
229
- const top = "_top_139vo_36";
230
- const bottom = "_bottom_139vo_37";
231
- const left = "_left_139vo_41";
232
- const right = "_right_139vo_42";
233
- const styles = {
234
- Tooltip: Tooltip$1,
235
- text,
236
- arrow,
237
- top,
238
- bottom,
239
- left,
240
- right
241
- };
242
- const CONTAINER_PADDING = 12;
243
- const ARROW_BOUNDARY_OFFSET = 12;
244
- const OFFSET = 12;
245
- const DEFAULT_PLACEMENT = "top";
246
- const OPEN_DELAY = 1e3;
247
- const CLOSE_DELAY = 250;
248
- function Tooltip(props) {
249
- const { children, isImmediate } = props;
250
- const triggerRef = React__default.useRef(null);
251
- const triggerInputProps = __spreadProps(__spreadValues({}, props), {
252
- delay: isImmediate ? 0 : OPEN_DELAY,
253
- closeDelay: CLOSE_DELAY
254
- });
255
- const tooltipTriggerState = $8796f90736e175cb$export$4d40659c25ecb50b(triggerInputProps);
256
- const { triggerProps, tooltipProps: tooltipPropsFromTrigger } = $4e1b34546679e357$export$a6da6c504e4bba8b(triggerInputProps, tooltipTriggerState, triggerRef);
257
- return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, React__default.cloneElement(children, __spreadProps(__spreadValues({}, $3ef42575df84b30b$export$9d1611c77c2fe928(triggerProps, children.props)), {
258
- ref: triggerRef
259
- })), tooltipTriggerState.isOpen && /* @__PURE__ */ React__default.createElement($f57aed4a881a3485$export$b47c3594eab58386, null, /* @__PURE__ */ React__default.createElement(
260
- TooltipInner,
261
- __spreadProps(__spreadValues({}, props), {
262
- triggerRef,
263
- tooltipPropsFromTrigger,
264
- tooltipTriggerState
265
- })
266
- )));
267
- }
268
- function TooltipInner(props) {
269
- const {
270
- content,
271
- placement: targetPlacement = DEFAULT_PLACEMENT,
272
- triggerRef,
273
- tooltipTriggerState,
274
- tooltipPropsFromTrigger
275
- } = props;
276
- const tooltipRef = React__default.useRef(null);
277
- const { overlayProps, arrowProps, placement, updatePosition } = $2a41e45df1593e64$export$d39e1813b3bdd0e1({
278
- arrowBoundaryOffset: ARROW_BOUNDARY_OFFSET,
279
- containerPadding: CONTAINER_PADDING,
280
- isOpen: tooltipTriggerState.isOpen,
281
- offset: OFFSET,
282
- overlayRef: tooltipRef,
283
- placement: targetPlacement,
284
- targetRef: triggerRef
285
- });
286
- const { tooltipProps: tooltipPropsFromTooltip } = $326e436e94273fe1$export$1c4b08e0eca38426(
287
- $3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, props),
288
- tooltipTriggerState
289
- );
290
- const tooltipProps = $3ef42575df84b30b$export$9d1611c77c2fe928(
291
- overlayProps,
292
- tooltipPropsFromTooltip,
293
- tooltipPropsFromTrigger
294
- );
295
- const style = __spreadValues(__spreadValues({}, tooltipProps.style), getComponentToken(
296
- "tooltip",
297
- "container_padding",
298
- `${pxToRem(CONTAINER_PADDING)}rem`
299
- ));
300
- useEffect(() => {
301
- updatePosition();
302
- }, [content, updatePosition]);
303
- return /* @__PURE__ */ React__default.createElement(
304
- "span",
305
- __spreadProps(__spreadValues({
306
- ref: tooltipRef
307
- }, tooltipProps), {
308
- className: classNames(styles.Tooltip, styles[placement]),
309
- "data-placement": placement,
310
- style
311
- }),
312
- /* @__PURE__ */ React__default.createElement("span", { className: styles.text }, /* @__PURE__ */ React__default.createElement(Text, { variant: "subtitle2" }, content)),
313
- /* @__PURE__ */ React__default.createElement("span", __spreadValues({ className: styles.arrow }, arrowProps))
314
- );
315
- }
316
- export {
317
- Tooltip as T
318
- };