@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
package/Tooltip/index.js CHANGED
@@ -1,13 +1,302 @@
1
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));
2
21
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const Tooltip = require("../__chunks__/Tooltip-bd55165e.js");
4
- require("react");
5
- require("../__chunks__/Text-1ae70c19.js");
6
- require("../utilities/css.js");
7
- require("../__chunks__/import-3ab42f86.js");
8
- require("../__chunks__/import-63bf0645.js");
9
- require("../__chunks__/import-0d1b4d93.js");
22
+ const React = require("react");
23
+ const Text_index = require("../Text/index.js");
24
+ const utilities_css = require("../utilities/css.js");
25
+ const _import$2 = require("../__chunks__/import-a2023d8f.js");
26
+ const _import = require("../__chunks__/import-a1e0f814.js");
27
+ const _import$1 = require("../__chunks__/import-2b302763.js");
10
28
  require("react-dom");
11
- require("../__chunks__/import-76076ca6.js");
12
- require("../__chunks__/real-module-ae2a4342.js");
13
- exports.Tooltip = Tooltip.Tooltip;
29
+ require("../__chunks__/import-dea5a24d.js");
30
+ require("../__chunks__/real-module-e36b1436.js");
31
+ function $326e436e94273fe1$export$1c4b08e0eca38426(props, state) {
32
+ let domProps = _import.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
33
+ labelable: true
34
+ });
35
+ let { hoverProps } = _import$1.$6179b936705e76d3$export$ae780daf29e6d456({
36
+ onHoverStart: () => {
37
+ return state === null || state === void 0 ? void 0 : state.open(true);
38
+ },
39
+ onHoverEnd: () => {
40
+ return state === null || state === void 0 ? void 0 : state.close();
41
+ }
42
+ });
43
+ return {
44
+ tooltipProps: _import.$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, hoverProps, {
45
+ role: "tooltip"
46
+ })
47
+ };
48
+ }
49
+ function $4e1b34546679e357$export$a6da6c504e4bba8b(props, state, ref) {
50
+ let { isDisabled, trigger } = props;
51
+ let tooltipId = _import.$bdb11010cef70236$export$f680877a34711e37();
52
+ let isHovered = React.useRef(false);
53
+ let isFocused = React.useRef(false);
54
+ let handleShow = () => {
55
+ if (isHovered.current || isFocused.current)
56
+ state.open(isFocused.current);
57
+ };
58
+ let handleHide = (immediate) => {
59
+ if (!isHovered.current && !isFocused.current)
60
+ state.close(immediate);
61
+ };
62
+ React.useEffect(() => {
63
+ let onKeyDown = (e) => {
64
+ if (ref && ref.current) {
65
+ if (e.key === "Escape") {
66
+ e.stopPropagation();
67
+ state.close(true);
68
+ }
69
+ }
70
+ };
71
+ if (state.isOpen) {
72
+ document.addEventListener("keydown", onKeyDown, true);
73
+ return () => {
74
+ document.removeEventListener("keydown", onKeyDown, true);
75
+ };
76
+ }
77
+ }, [
78
+ ref,
79
+ state
80
+ ]);
81
+ let onHoverStart = () => {
82
+ if (trigger === "focus")
83
+ return;
84
+ if (_import$1.$507fabe10e71c6fb$export$630ff653c5ada6a9() === "pointer")
85
+ isHovered.current = true;
86
+ else
87
+ isHovered.current = false;
88
+ handleShow();
89
+ };
90
+ let onHoverEnd = () => {
91
+ if (trigger === "focus")
92
+ return;
93
+ isFocused.current = false;
94
+ isHovered.current = false;
95
+ handleHide();
96
+ };
97
+ let onPressStart = () => {
98
+ isFocused.current = false;
99
+ isHovered.current = false;
100
+ handleHide(true);
101
+ };
102
+ let onFocus = () => {
103
+ let isVisible = _import$1.$507fabe10e71c6fb$export$b9b3dfddab17db27();
104
+ if (isVisible) {
105
+ isFocused.current = true;
106
+ handleShow();
107
+ }
108
+ };
109
+ let onBlur = () => {
110
+ isFocused.current = false;
111
+ isHovered.current = false;
112
+ handleHide(true);
113
+ };
114
+ let { hoverProps } = _import$1.$6179b936705e76d3$export$ae780daf29e6d456({
115
+ isDisabled,
116
+ onHoverStart,
117
+ onHoverEnd
118
+ });
119
+ let { pressProps } = _import$1.$f6c31cce2adf654f$export$45712eceda6fad21({
120
+ onPressStart
121
+ });
122
+ let { focusableProps } = _import$1.$e6afbd83fe6ebbd2$export$4c014de7c8940b4c({
123
+ isDisabled,
124
+ onFocus,
125
+ onBlur
126
+ }, ref);
127
+ return {
128
+ triggerProps: __spreadValues({
129
+ "aria-describedby": state.isOpen ? tooltipId : void 0
130
+ }, _import.$3ef42575df84b30b$export$9d1611c77c2fe928(focusableProps, hoverProps, pressProps)),
131
+ tooltipProps: {
132
+ id: tooltipId
133
+ }
134
+ };
135
+ }
136
+ const $8796f90736e175cb$var$TOOLTIP_DELAY = 1500;
137
+ const $8796f90736e175cb$var$TOOLTIP_COOLDOWN = 500;
138
+ let $8796f90736e175cb$var$tooltips = {};
139
+ let $8796f90736e175cb$var$tooltipId = 0;
140
+ let $8796f90736e175cb$var$globalWarmedUp = false;
141
+ let $8796f90736e175cb$var$globalWarmUpTimeout = null;
142
+ let $8796f90736e175cb$var$globalCooldownTimeout = null;
143
+ function $8796f90736e175cb$export$4d40659c25ecb50b(props = {}) {
144
+ let { delay = $8796f90736e175cb$var$TOOLTIP_DELAY, closeDelay = $8796f90736e175cb$var$TOOLTIP_COOLDOWN } = props;
145
+ let { isOpen, open, close } = _import$2.$fc909762b330b746$export$61c6a8c84e605fb6(props);
146
+ let id = React.useMemo(() => `${++$8796f90736e175cb$var$tooltipId}`, []);
147
+ let closeTimeout = React.useRef();
148
+ let ensureTooltipEntry = () => {
149
+ $8796f90736e175cb$var$tooltips[id] = hideTooltip;
150
+ };
151
+ let closeOpenTooltips = () => {
152
+ for (let hideTooltipId in $8796f90736e175cb$var$tooltips)
153
+ if (hideTooltipId !== id) {
154
+ $8796f90736e175cb$var$tooltips[hideTooltipId](true);
155
+ delete $8796f90736e175cb$var$tooltips[hideTooltipId];
156
+ }
157
+ };
158
+ let showTooltip = () => {
159
+ clearTimeout(closeTimeout.current);
160
+ closeTimeout.current = null;
161
+ closeOpenTooltips();
162
+ ensureTooltipEntry();
163
+ $8796f90736e175cb$var$globalWarmedUp = true;
164
+ open();
165
+ if ($8796f90736e175cb$var$globalWarmUpTimeout) {
166
+ clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
167
+ $8796f90736e175cb$var$globalWarmUpTimeout = null;
168
+ }
169
+ if ($8796f90736e175cb$var$globalCooldownTimeout) {
170
+ clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
171
+ $8796f90736e175cb$var$globalCooldownTimeout = null;
172
+ }
173
+ };
174
+ let hideTooltip = (immediate) => {
175
+ if (immediate || closeDelay <= 0) {
176
+ clearTimeout(closeTimeout.current);
177
+ closeTimeout.current = null;
178
+ close();
179
+ } else if (!closeTimeout.current)
180
+ closeTimeout.current = setTimeout(() => {
181
+ closeTimeout.current = null;
182
+ close();
183
+ }, closeDelay);
184
+ if ($8796f90736e175cb$var$globalWarmUpTimeout) {
185
+ clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
186
+ $8796f90736e175cb$var$globalWarmUpTimeout = null;
187
+ }
188
+ if ($8796f90736e175cb$var$globalWarmedUp) {
189
+ if ($8796f90736e175cb$var$globalCooldownTimeout)
190
+ clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
191
+ $8796f90736e175cb$var$globalCooldownTimeout = setTimeout(() => {
192
+ delete $8796f90736e175cb$var$tooltips[id];
193
+ $8796f90736e175cb$var$globalCooldownTimeout = null;
194
+ $8796f90736e175cb$var$globalWarmedUp = false;
195
+ }, Math.max($8796f90736e175cb$var$TOOLTIP_COOLDOWN, closeDelay));
196
+ }
197
+ };
198
+ let warmupTooltip = () => {
199
+ closeOpenTooltips();
200
+ ensureTooltipEntry();
201
+ if (!isOpen && !$8796f90736e175cb$var$globalWarmUpTimeout && !$8796f90736e175cb$var$globalWarmedUp)
202
+ $8796f90736e175cb$var$globalWarmUpTimeout = setTimeout(() => {
203
+ $8796f90736e175cb$var$globalWarmUpTimeout = null;
204
+ $8796f90736e175cb$var$globalWarmedUp = true;
205
+ showTooltip();
206
+ }, delay);
207
+ else if (!isOpen)
208
+ showTooltip();
209
+ };
210
+ React.useEffect(() => {
211
+ return () => {
212
+ clearTimeout(closeTimeout.current);
213
+ let tooltip = $8796f90736e175cb$var$tooltips[id];
214
+ if (tooltip)
215
+ delete $8796f90736e175cb$var$tooltips[id];
216
+ };
217
+ }, [
218
+ id
219
+ ]);
220
+ return {
221
+ isOpen,
222
+ open: (immediate) => {
223
+ if (!immediate && delay > 0 && !closeTimeout.current)
224
+ warmupTooltip();
225
+ else
226
+ showTooltip();
227
+ },
228
+ close: hideTooltip
229
+ };
230
+ }
231
+ const Tooltip$1 = "_Tooltip_1yly1_5";
232
+ const text = "_text_1yly1_21";
233
+ const arrow = "_arrow_1yly1_27";
234
+ const top = "_top_1yly1_36";
235
+ const bottom = "_bottom_1yly1_37";
236
+ const left = "_left_1yly1_41";
237
+ const right = "_right_1yly1_42";
238
+ const styles = {
239
+ Tooltip: Tooltip$1,
240
+ text,
241
+ arrow,
242
+ top,
243
+ bottom,
244
+ left,
245
+ right
246
+ };
247
+ const CONTAINER_PADDING = 12;
248
+ const ARROW_BOUNDARY_OFFSET = 12;
249
+ const OFFSET = 12;
250
+ const DEFAULT_PLACEMENT = "top";
251
+ const OPEN_DELAY = 1e3;
252
+ const CLOSE_DELAY = 250;
253
+ function Tooltip(props) {
254
+ const { children, isImmediate } = props;
255
+ const triggerRef = React.useRef(null);
256
+ const triggerInputProps = __spreadProps(__spreadValues({}, props), {
257
+ delay: isImmediate ? 0 : OPEN_DELAY,
258
+ closeDelay: CLOSE_DELAY
259
+ });
260
+ const tooltipTriggerState = $8796f90736e175cb$export$4d40659c25ecb50b(triggerInputProps);
261
+ const { triggerProps, tooltipProps: tooltipPropsFromTrigger } = $4e1b34546679e357$export$a6da6c504e4bba8b(triggerInputProps, tooltipTriggerState, triggerRef);
262
+ return React.createElement(React.Fragment, null, React.cloneElement(children, __spreadProps(__spreadValues({}, _import.$3ef42575df84b30b$export$9d1611c77c2fe928(triggerProps, children.props)), {
263
+ ref: triggerRef
264
+ })), tooltipTriggerState.isOpen && React.createElement(_import$2.$f57aed4a881a3485$export$b47c3594eab58386, null, React.createElement(TooltipInner, __spreadProps(__spreadValues({}, props), {
265
+ triggerRef,
266
+ tooltipPropsFromTrigger,
267
+ tooltipTriggerState
268
+ }))));
269
+ }
270
+ function TooltipInner(props) {
271
+ const { content, placement: targetPlacement = DEFAULT_PLACEMENT, triggerRef, tooltipTriggerState, tooltipPropsFromTrigger } = props;
272
+ const tooltipRef = React.useRef(null);
273
+ const { overlayProps, arrowProps, placement, updatePosition } = _import$2.$2a41e45df1593e64$export$d39e1813b3bdd0e1({
274
+ arrowBoundaryOffset: ARROW_BOUNDARY_OFFSET,
275
+ containerPadding: CONTAINER_PADDING,
276
+ isOpen: tooltipTriggerState.isOpen,
277
+ offset: OFFSET,
278
+ overlayRef: tooltipRef,
279
+ placement: targetPlacement,
280
+ targetRef: triggerRef
281
+ });
282
+ const { tooltipProps: tooltipPropsFromTooltip } = $326e436e94273fe1$export$1c4b08e0eca38426(_import.$3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, props), tooltipTriggerState);
283
+ const tooltipProps = _import.$3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, tooltipPropsFromTooltip, tooltipPropsFromTrigger);
284
+ const style = __spreadValues(__spreadValues({}, tooltipProps.style), utilities_css.getComponentToken("tooltip", "container_padding", `${utilities_css.pxToRem(CONTAINER_PADDING)}rem`));
285
+ React.useEffect(() => {
286
+ updatePosition();
287
+ }, [content, updatePosition]);
288
+ return React.createElement("span", __spreadProps(__spreadValues({
289
+ ref: tooltipRef
290
+ }, tooltipProps), {
291
+ className: utilities_css.classNames(styles.Tooltip, styles[placement]),
292
+ "data-placement": placement,
293
+ style
294
+ }), React.createElement("span", {
295
+ className: styles.text
296
+ }, React.createElement(Text_index.Text, {
297
+ variant: "subtitle2"
298
+ }, content)), React.createElement("span", __spreadValues({
299
+ className: styles.arrow
300
+ }, arrowProps)));
301
+ }
302
+ exports.Tooltip = Tooltip;
package/Tooltip/index.mjs CHANGED
@@ -1,13 +1,302 @@
1
- import { T } from "../__chunks__/Tooltip-f7e67b21.mjs";
2
- import "react";
3
- import "../__chunks__/Text-4ae50d5c.mjs";
4
- import "../utilities/css.mjs";
5
- import "../__chunks__/import-856e0385.mjs";
6
- import "../__chunks__/import-b7971a11.mjs";
7
- import "../__chunks__/import-ab878fb6.mjs";
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 { Text } from "../Text/index.mjs";
22
+ import { getComponentToken, pxToRem, classNames } from "../utilities/css.mjs";
23
+ import { a as $fc909762b330b746$export$61c6a8c84e605fb6, c as $f57aed4a881a3485$export$b47c3594eab58386, f as $2a41e45df1593e64$export$d39e1813b3bdd0e1 } from "../__chunks__/import-f1f4792a.mjs";
24
+ import { d as $65484d02dcb7eb3e$export$457c3d6518dd4c6f, a as $3ef42575df84b30b$export$9d1611c77c2fe928, b as $bdb11010cef70236$export$f680877a34711e37 } from "../__chunks__/import-19bc38ac.mjs";
25
+ import { f as $6179b936705e76d3$export$ae780daf29e6d456, $ as $f6c31cce2adf654f$export$45712eceda6fad21, a as $e6afbd83fe6ebbd2$export$4c014de7c8940b4c, j as $507fabe10e71c6fb$export$630ff653c5ada6a9, k as $507fabe10e71c6fb$export$b9b3dfddab17db27 } from "../__chunks__/import-3d962a94.mjs";
8
26
  import "react-dom";
9
- import "../__chunks__/import-86330a7c.mjs";
10
- import "../__chunks__/real-module-e4cd2301.mjs";
27
+ import "../__chunks__/import-6a831ca1.mjs";
28
+ import "../__chunks__/real-module-515df21d.mjs";
29
+ function $326e436e94273fe1$export$1c4b08e0eca38426(props, state) {
30
+ let domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
31
+ labelable: true
32
+ });
33
+ let { hoverProps } = $6179b936705e76d3$export$ae780daf29e6d456({
34
+ onHoverStart: () => {
35
+ return state === null || state === void 0 ? void 0 : state.open(true);
36
+ },
37
+ onHoverEnd: () => {
38
+ return state === null || state === void 0 ? void 0 : state.close();
39
+ }
40
+ });
41
+ return {
42
+ tooltipProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, hoverProps, {
43
+ role: "tooltip"
44
+ })
45
+ };
46
+ }
47
+ function $4e1b34546679e357$export$a6da6c504e4bba8b(props, state, ref) {
48
+ let { isDisabled, trigger } = props;
49
+ let tooltipId = $bdb11010cef70236$export$f680877a34711e37();
50
+ let isHovered = useRef(false);
51
+ let isFocused = useRef(false);
52
+ let handleShow = () => {
53
+ if (isHovered.current || isFocused.current)
54
+ state.open(isFocused.current);
55
+ };
56
+ let handleHide = (immediate) => {
57
+ if (!isHovered.current && !isFocused.current)
58
+ state.close(immediate);
59
+ };
60
+ useEffect(() => {
61
+ let onKeyDown = (e) => {
62
+ if (ref && ref.current) {
63
+ if (e.key === "Escape") {
64
+ e.stopPropagation();
65
+ state.close(true);
66
+ }
67
+ }
68
+ };
69
+ if (state.isOpen) {
70
+ document.addEventListener("keydown", onKeyDown, true);
71
+ return () => {
72
+ document.removeEventListener("keydown", onKeyDown, true);
73
+ };
74
+ }
75
+ }, [
76
+ ref,
77
+ state
78
+ ]);
79
+ let onHoverStart = () => {
80
+ if (trigger === "focus")
81
+ return;
82
+ if ($507fabe10e71c6fb$export$630ff653c5ada6a9() === "pointer")
83
+ isHovered.current = true;
84
+ else
85
+ isHovered.current = false;
86
+ handleShow();
87
+ };
88
+ let onHoverEnd = () => {
89
+ if (trigger === "focus")
90
+ return;
91
+ isFocused.current = false;
92
+ isHovered.current = false;
93
+ handleHide();
94
+ };
95
+ let onPressStart = () => {
96
+ isFocused.current = false;
97
+ isHovered.current = false;
98
+ handleHide(true);
99
+ };
100
+ let onFocus = () => {
101
+ let isVisible = $507fabe10e71c6fb$export$b9b3dfddab17db27();
102
+ if (isVisible) {
103
+ isFocused.current = true;
104
+ handleShow();
105
+ }
106
+ };
107
+ let onBlur = () => {
108
+ isFocused.current = false;
109
+ isHovered.current = false;
110
+ handleHide(true);
111
+ };
112
+ let { hoverProps } = $6179b936705e76d3$export$ae780daf29e6d456({
113
+ isDisabled,
114
+ onHoverStart,
115
+ onHoverEnd
116
+ });
117
+ let { pressProps } = $f6c31cce2adf654f$export$45712eceda6fad21({
118
+ onPressStart
119
+ });
120
+ let { focusableProps } = $e6afbd83fe6ebbd2$export$4c014de7c8940b4c({
121
+ isDisabled,
122
+ onFocus,
123
+ onBlur
124
+ }, ref);
125
+ return {
126
+ triggerProps: __spreadValues({
127
+ "aria-describedby": state.isOpen ? tooltipId : void 0
128
+ }, $3ef42575df84b30b$export$9d1611c77c2fe928(focusableProps, hoverProps, pressProps)),
129
+ tooltipProps: {
130
+ id: tooltipId
131
+ }
132
+ };
133
+ }
134
+ const $8796f90736e175cb$var$TOOLTIP_DELAY = 1500;
135
+ const $8796f90736e175cb$var$TOOLTIP_COOLDOWN = 500;
136
+ let $8796f90736e175cb$var$tooltips = {};
137
+ let $8796f90736e175cb$var$tooltipId = 0;
138
+ let $8796f90736e175cb$var$globalWarmedUp = false;
139
+ let $8796f90736e175cb$var$globalWarmUpTimeout = null;
140
+ let $8796f90736e175cb$var$globalCooldownTimeout = null;
141
+ function $8796f90736e175cb$export$4d40659c25ecb50b(props = {}) {
142
+ let { delay = $8796f90736e175cb$var$TOOLTIP_DELAY, closeDelay = $8796f90736e175cb$var$TOOLTIP_COOLDOWN } = props;
143
+ let { isOpen, open, close } = $fc909762b330b746$export$61c6a8c84e605fb6(props);
144
+ let id = useMemo(() => `${++$8796f90736e175cb$var$tooltipId}`, []);
145
+ let closeTimeout = useRef();
146
+ let ensureTooltipEntry = () => {
147
+ $8796f90736e175cb$var$tooltips[id] = hideTooltip;
148
+ };
149
+ let closeOpenTooltips = () => {
150
+ for (let hideTooltipId in $8796f90736e175cb$var$tooltips)
151
+ if (hideTooltipId !== id) {
152
+ $8796f90736e175cb$var$tooltips[hideTooltipId](true);
153
+ delete $8796f90736e175cb$var$tooltips[hideTooltipId];
154
+ }
155
+ };
156
+ let showTooltip = () => {
157
+ clearTimeout(closeTimeout.current);
158
+ closeTimeout.current = null;
159
+ closeOpenTooltips();
160
+ ensureTooltipEntry();
161
+ $8796f90736e175cb$var$globalWarmedUp = true;
162
+ open();
163
+ if ($8796f90736e175cb$var$globalWarmUpTimeout) {
164
+ clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
165
+ $8796f90736e175cb$var$globalWarmUpTimeout = null;
166
+ }
167
+ if ($8796f90736e175cb$var$globalCooldownTimeout) {
168
+ clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
169
+ $8796f90736e175cb$var$globalCooldownTimeout = null;
170
+ }
171
+ };
172
+ let hideTooltip = (immediate) => {
173
+ if (immediate || closeDelay <= 0) {
174
+ clearTimeout(closeTimeout.current);
175
+ closeTimeout.current = null;
176
+ close();
177
+ } else if (!closeTimeout.current)
178
+ closeTimeout.current = setTimeout(() => {
179
+ closeTimeout.current = null;
180
+ close();
181
+ }, closeDelay);
182
+ if ($8796f90736e175cb$var$globalWarmUpTimeout) {
183
+ clearTimeout($8796f90736e175cb$var$globalWarmUpTimeout);
184
+ $8796f90736e175cb$var$globalWarmUpTimeout = null;
185
+ }
186
+ if ($8796f90736e175cb$var$globalWarmedUp) {
187
+ if ($8796f90736e175cb$var$globalCooldownTimeout)
188
+ clearTimeout($8796f90736e175cb$var$globalCooldownTimeout);
189
+ $8796f90736e175cb$var$globalCooldownTimeout = setTimeout(() => {
190
+ delete $8796f90736e175cb$var$tooltips[id];
191
+ $8796f90736e175cb$var$globalCooldownTimeout = null;
192
+ $8796f90736e175cb$var$globalWarmedUp = false;
193
+ }, Math.max($8796f90736e175cb$var$TOOLTIP_COOLDOWN, closeDelay));
194
+ }
195
+ };
196
+ let warmupTooltip = () => {
197
+ closeOpenTooltips();
198
+ ensureTooltipEntry();
199
+ if (!isOpen && !$8796f90736e175cb$var$globalWarmUpTimeout && !$8796f90736e175cb$var$globalWarmedUp)
200
+ $8796f90736e175cb$var$globalWarmUpTimeout = setTimeout(() => {
201
+ $8796f90736e175cb$var$globalWarmUpTimeout = null;
202
+ $8796f90736e175cb$var$globalWarmedUp = true;
203
+ showTooltip();
204
+ }, delay);
205
+ else if (!isOpen)
206
+ showTooltip();
207
+ };
208
+ useEffect(() => {
209
+ return () => {
210
+ clearTimeout(closeTimeout.current);
211
+ let tooltip = $8796f90736e175cb$var$tooltips[id];
212
+ if (tooltip)
213
+ delete $8796f90736e175cb$var$tooltips[id];
214
+ };
215
+ }, [
216
+ id
217
+ ]);
218
+ return {
219
+ isOpen,
220
+ open: (immediate) => {
221
+ if (!immediate && delay > 0 && !closeTimeout.current)
222
+ warmupTooltip();
223
+ else
224
+ showTooltip();
225
+ },
226
+ close: hideTooltip
227
+ };
228
+ }
229
+ const Tooltip$1 = "_Tooltip_1yly1_5";
230
+ const text = "_text_1yly1_21";
231
+ const arrow = "_arrow_1yly1_27";
232
+ const top = "_top_1yly1_36";
233
+ const bottom = "_bottom_1yly1_37";
234
+ const left = "_left_1yly1_41";
235
+ const right = "_right_1yly1_42";
236
+ const styles = {
237
+ Tooltip: Tooltip$1,
238
+ text,
239
+ arrow,
240
+ top,
241
+ bottom,
242
+ left,
243
+ right
244
+ };
245
+ const CONTAINER_PADDING = 12;
246
+ const ARROW_BOUNDARY_OFFSET = 12;
247
+ const OFFSET = 12;
248
+ const DEFAULT_PLACEMENT = "top";
249
+ const OPEN_DELAY = 1e3;
250
+ const CLOSE_DELAY = 250;
251
+ function Tooltip(props) {
252
+ const { children, isImmediate } = props;
253
+ const triggerRef = React__default.useRef(null);
254
+ const triggerInputProps = __spreadProps(__spreadValues({}, props), {
255
+ delay: isImmediate ? 0 : OPEN_DELAY,
256
+ closeDelay: CLOSE_DELAY
257
+ });
258
+ const tooltipTriggerState = $8796f90736e175cb$export$4d40659c25ecb50b(triggerInputProps);
259
+ const { triggerProps, tooltipProps: tooltipPropsFromTrigger } = $4e1b34546679e357$export$a6da6c504e4bba8b(triggerInputProps, tooltipTriggerState, triggerRef);
260
+ return React__default.createElement(React__default.Fragment, null, React__default.cloneElement(children, __spreadProps(__spreadValues({}, $3ef42575df84b30b$export$9d1611c77c2fe928(triggerProps, children.props)), {
261
+ ref: triggerRef
262
+ })), tooltipTriggerState.isOpen && React__default.createElement($f57aed4a881a3485$export$b47c3594eab58386, null, React__default.createElement(TooltipInner, __spreadProps(__spreadValues({}, props), {
263
+ triggerRef,
264
+ tooltipPropsFromTrigger,
265
+ tooltipTriggerState
266
+ }))));
267
+ }
268
+ function TooltipInner(props) {
269
+ const { content, placement: targetPlacement = DEFAULT_PLACEMENT, triggerRef, tooltipTriggerState, tooltipPropsFromTrigger } = props;
270
+ const tooltipRef = React__default.useRef(null);
271
+ const { overlayProps, arrowProps, placement, updatePosition } = $2a41e45df1593e64$export$d39e1813b3bdd0e1({
272
+ arrowBoundaryOffset: ARROW_BOUNDARY_OFFSET,
273
+ containerPadding: CONTAINER_PADDING,
274
+ isOpen: tooltipTriggerState.isOpen,
275
+ offset: OFFSET,
276
+ overlayRef: tooltipRef,
277
+ placement: targetPlacement,
278
+ targetRef: triggerRef
279
+ });
280
+ const { tooltipProps: tooltipPropsFromTooltip } = $326e436e94273fe1$export$1c4b08e0eca38426($3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, props), tooltipTriggerState);
281
+ const tooltipProps = $3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, tooltipPropsFromTooltip, tooltipPropsFromTrigger);
282
+ const style = __spreadValues(__spreadValues({}, tooltipProps.style), getComponentToken("tooltip", "container_padding", `${pxToRem(CONTAINER_PADDING)}rem`));
283
+ useEffect(() => {
284
+ updatePosition();
285
+ }, [content, updatePosition]);
286
+ return React__default.createElement("span", __spreadProps(__spreadValues({
287
+ ref: tooltipRef
288
+ }, tooltipProps), {
289
+ className: classNames(styles.Tooltip, styles[placement]),
290
+ "data-placement": placement,
291
+ style
292
+ }), React__default.createElement("span", {
293
+ className: styles.text
294
+ }, React__default.createElement(Text, {
295
+ variant: "subtitle2"
296
+ }, content)), React__default.createElement("span", __spreadValues({
297
+ className: styles.arrow
298
+ }, arrowProps)));
299
+ }
11
300
  export {
12
- T as Tooltip
301
+ Tooltip
13
302
  };
@@ -1,9 +1,9 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const UnstyledButton = require("../__chunks__/UnstyledButton-96172ec0.js");
4
- require("../__chunks__/import-63bf0645.js");
3
+ const UnstyledButton_index = require("../__chunks__/index-3985350a.js");
4
+ require("../__chunks__/import-a1e0f814.js");
5
5
  require("react");
6
6
  require("../utilities/css.js");
7
7
  require("../__chunks__/omit-fca26542.js");
8
- require("../__chunks__/import-0d1b4d93.js");
9
- exports.UnstyledButton = UnstyledButton.UnstyledButton;
8
+ require("../__chunks__/import-2b302763.js");
9
+ exports.UnstyledButton = UnstyledButton_index.UnstyledButton;
@@ -1,9 +1,9 @@
1
- import { U } from "../__chunks__/UnstyledButton-883f0c6c.mjs";
2
- import "../__chunks__/import-b7971a11.mjs";
1
+ import { U } from "../__chunks__/index-29d7bca9.mjs";
2
+ import "../__chunks__/import-19bc38ac.mjs";
3
3
  import "react";
4
4
  import "../utilities/css.mjs";
5
5
  import "../__chunks__/omit-f17deb8f.mjs";
6
- import "../__chunks__/import-ab878fb6.mjs";
6
+ import "../__chunks__/import-3d962a94.mjs";
7
7
  export {
8
8
  U as UnstyledButton
9
9
  };