@arc-ui/components 11.14.0 → 11.16.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.
Files changed (89) hide show
  1. package/dist/Breadcrumbs/Breadcrumbs.cjs.js +1 -1
  2. package/dist/Breadcrumbs/Breadcrumbs.esm.js +1 -1
  3. package/dist/Checkbox/Checkbox.cjs.js +2 -2
  4. package/dist/Checkbox/Checkbox.esm.js +2 -2
  5. package/dist/FormControl/FormControl.cjs.js +1 -1
  6. package/dist/FormControl/FormControl.esm.js +1 -1
  7. package/dist/InformationCard/InformationCard.cjs.js +25 -43
  8. package/dist/InformationCard/InformationCard.esm.js +24 -42
  9. package/dist/Modal/Modal.cjs.js +16 -40
  10. package/dist/Modal/Modal.esm.js +6 -30
  11. package/dist/PaginationSimple/PaginationSimple.cjs.js +19 -16
  12. package/dist/PaginationSimple/PaginationSimple.esm.js +19 -16
  13. package/dist/RadioGroup/RadioGroup.cjs.js +2 -2
  14. package/dist/RadioGroup/RadioGroup.esm.js +2 -2
  15. package/dist/Select/Select.cjs.js +2736 -619
  16. package/dist/Select/Select.esm.js +2535 -418
  17. package/dist/Switch/Switch.cjs.js +335 -11
  18. package/dist/Switch/Switch.esm.js +328 -4
  19. package/dist/Tabs/Tabs.cjs.js +7 -4
  20. package/dist/Tabs/Tabs.esm.js +7 -4
  21. package/dist/TextArea/TextArea.cjs.js +17 -12
  22. package/dist/TextArea/TextArea.esm.js +17 -12
  23. package/dist/TextInput/TextInput.cjs.js +2 -2
  24. package/dist/TextInput/TextInput.esm.js +2 -2
  25. package/dist/Toast/Toast.cjs.js +7 -4
  26. package/dist/Toast/Toast.esm.js +7 -4
  27. package/dist/TypographyCard/TypographyCard.cjs.js +93 -0
  28. package/dist/TypographyCard/TypographyCard.esm.js +85 -0
  29. package/dist/TypographyCard/package.json +7 -0
  30. package/dist/UniversalHeader/UniversalHeader.cjs.js +1 -1
  31. package/dist/UniversalHeader/UniversalHeader.esm.js +1 -1
  32. package/dist/_shared/cjs/{Breadcrumbs-ed70e75a.js → Breadcrumbs-ef659d2b.js} +5 -5
  33. package/dist/_shared/cjs/BtIconArrowRight.esm-8e8ac316.js +30 -0
  34. package/dist/_shared/cjs/BtIconArrowRightFill.esm-435cf4bd.js +26 -0
  35. package/dist/_shared/cjs/{Checkbox-b126194e.js → Checkbox-904ad028.js} +1 -1
  36. package/dist/_shared/cjs/{FormControl-7daf8110.js → FormControl-166e0957.js} +5 -1
  37. package/dist/_shared/cjs/{RadioGroup-56e3b0e5.js → RadioGroup-1eddf86f.js} +1 -1
  38. package/dist/_shared/cjs/{Tabs-2d2a517d.js → Tabs-cc77dabb.js} +17 -37
  39. package/dist/_shared/cjs/{TextInput-bf1fe052.js → TextInput-fd9c756f.js} +10 -4
  40. package/dist/_shared/cjs/{Toast-69108261.js → Toast-91e96744.js} +36 -54
  41. package/dist/_shared/cjs/{UniversalHeader-5e43d320.js → UniversalHeader-b8389447.js} +4 -2
  42. package/dist/_shared/cjs/index-1641d0b4.js +27 -0
  43. package/dist/_shared/cjs/{index-43458549.js → index-3d69ea00.js} +28 -1
  44. package/dist/_shared/cjs/index-49c72a87.js +131 -0
  45. package/dist/_shared/cjs/{index-6b2a9ac3.js → index-4ecad2dd.js} +6 -22
  46. package/dist/_shared/cjs/{index.module-dd1d7d0b.js → index-56a040f4.js} +87 -104
  47. package/dist/_shared/cjs/index-6542b467.js +23 -0
  48. package/dist/_shared/cjs/{index-adbb63da.js → index-84e6a68f.js} +1 -1
  49. package/dist/_shared/cjs/{index-b2fd6338.js → index-d31f2b65.js} +1 -1
  50. package/dist/_shared/cjs/index-dcfdd5da.js +11 -0
  51. package/dist/_shared/esm/{Breadcrumbs-87e2bd46.js → Breadcrumbs-36edfb3d.js} +5 -5
  52. package/dist/_shared/esm/BtIconArrowRight.esm-267916a4.js +24 -0
  53. package/dist/_shared/esm/BtIconArrowRightFill.esm-99019d1a.js +20 -0
  54. package/dist/_shared/esm/{Checkbox-d6ec5024.js → Checkbox-8a5bb9a1.js} +1 -1
  55. package/dist/_shared/esm/{FormControl-351e5f1b.js → FormControl-9d4ddfec.js} +5 -1
  56. package/dist/_shared/esm/{RadioGroup-c838764c.js → RadioGroup-238db88d.js} +1 -1
  57. package/dist/_shared/esm/{Tabs-f903187a.js → Tabs-8719d952.js} +7 -27
  58. package/dist/_shared/esm/{TextInput-991804b6.js → TextInput-c1e2a1dd.js} +10 -4
  59. package/dist/_shared/esm/{Toast-37549e68.js → Toast-7cb1e544.js} +6 -24
  60. package/dist/_shared/esm/{UniversalHeader-b4c1577c.js → UniversalHeader-80c7313f.js} +4 -2
  61. package/dist/_shared/esm/{index.module-44714d3f.js → index-12f3a407.js} +89 -105
  62. package/dist/_shared/esm/index-246b4f18.js +21 -0
  63. package/dist/_shared/esm/{index-a1d2d9b3.js → index-39019a9b.js} +1 -1
  64. package/dist/_shared/esm/{index-41d7af2b.js → index-3e2bc99d.js} +29 -3
  65. package/dist/_shared/esm/index-6b7b075c.js +25 -0
  66. package/dist/_shared/esm/{index-efd9ef1c.js → index-936b5179.js} +1 -1
  67. package/dist/_shared/esm/index-a624de47.js +9 -0
  68. package/dist/_shared/esm/{index-3797d77e.js → index-d0307140.js} +5 -21
  69. package/dist/_shared/esm/index-db47e95a.js +129 -0
  70. package/dist/index.es.js +3062 -865
  71. package/dist/index.es.js.map +1 -1
  72. package/dist/index.js +3062 -864
  73. package/dist/index.js.map +1 -1
  74. package/dist/styles.css +5 -5
  75. package/dist/types/components/MediaCard/MediaCard.d.ts +24 -30
  76. package/dist/types/components/Select/Select.d.ts +49 -0
  77. package/dist/types/components/TextInput/TextInput.d.ts +12 -1
  78. package/dist/types/components/TypographyCard/TypographyCard.d.ts +48 -0
  79. package/dist/types/components/TypographyCard/index.d.ts +1 -0
  80. package/dist/types/components/UniversalHeader/UniversalHeader.d.ts +4 -0
  81. package/dist/types/components/index.d.ts +1 -0
  82. package/dist/types/internal-components/ConditionalWrapper/ConditionalWrapper.d.ts +6 -0
  83. package/dist/types/internal-components/ConditionalWrapper/index.d.ts +1 -0
  84. package/dist/types/internal-components/index.d.ts +1 -0
  85. package/dist/types/styles.d.ts +2 -1
  86. package/package.json +2 -2
  87. package/dist/_shared/cjs/index-c575a255.js +0 -490
  88. package/dist/_shared/esm/index-13d575cc.js +0 -479
  89. package/dist/types/components/MediaCard/MediaCard.stories-wip.d.ts +0 -15
@@ -1,490 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var _extends = require('./extends-8c5e4b48.js');
5
- var $7SXl2$reactdom = require('react-dom');
6
-
7
- function $e42e1063c40fb3ef$export$b9ecd428b558ff10(originalEventHandler, ourEventHandler, { checkForDefaultPrevented: checkForDefaultPrevented = true } = {}) {
8
- return function handleEvent(event) {
9
- originalEventHandler === null || originalEventHandler === void 0 || originalEventHandler(event);
10
- if (checkForDefaultPrevented === false || !event.defaultPrevented) return ourEventHandler === null || ourEventHandler === void 0 ? void 0 : ourEventHandler(event);
11
- };
12
- }
13
-
14
- /**
15
- * Set a given ref to a given value
16
- * This utility takes care of different types of refs: callback refs and RefObject(s)
17
- */ function $6ed0406888f73fc4$var$setRef(ref, value) {
18
- if (typeof ref === 'function') ref(value);
19
- else if (ref !== null && ref !== undefined) ref.current = value;
20
- }
21
- /**
22
- * A utility to compose multiple refs together
23
- * Accepts callback refs and RefObject(s)
24
- */ function $6ed0406888f73fc4$export$43e446d32b3d21af(...refs) {
25
- return (node)=>refs.forEach((ref)=>$6ed0406888f73fc4$var$setRef(ref, node)
26
- )
27
- ;
28
- }
29
- /**
30
- * A custom hook that composes multiple refs
31
- * Accepts callback refs and RefObject(s)
32
- */ function $6ed0406888f73fc4$export$c7b2cbe3552a0d05(...refs) {
33
- // eslint-disable-next-line react-hooks/exhaustive-deps
34
- return React.useCallback($6ed0406888f73fc4$export$43e446d32b3d21af(...refs), refs);
35
- }
36
-
37
- /* -------------------------------------------------------------------------------------------------
38
- * createContextScope
39
- * -----------------------------------------------------------------------------------------------*/ function $c512c27ab02ef895$export$50c7b4e9d9f19c1(scopeName, createContextScopeDeps = []) {
40
- let defaultContexts = [];
41
- /* -----------------------------------------------------------------------------------------------
42
- * createContext
43
- * ---------------------------------------------------------------------------------------------*/ function $c512c27ab02ef895$export$fd42f52fd3ae1109(rootComponentName, defaultContext) {
44
- const BaseContext = /*#__PURE__*/ React.createContext(defaultContext);
45
- const index = defaultContexts.length;
46
- defaultContexts = [
47
- ...defaultContexts,
48
- defaultContext
49
- ];
50
- function Provider(props) {
51
- const { scope: scope , children: children , ...context } = props;
52
- const Context = (scope === null || scope === void 0 ? void 0 : scope[scopeName][index]) || BaseContext; // Only re-memoize when prop values change
53
- // eslint-disable-next-line react-hooks/exhaustive-deps
54
- const value = React.useMemo(()=>context
55
- , Object.values(context));
56
- return /*#__PURE__*/ React.createElement(Context.Provider, {
57
- value: value
58
- }, children);
59
- }
60
- function useContext(consumerName, scope) {
61
- const Context = (scope === null || scope === void 0 ? void 0 : scope[scopeName][index]) || BaseContext;
62
- const context = React.useContext(Context);
63
- if (context) return context;
64
- if (defaultContext !== undefined) return defaultContext; // if a defaultContext wasn't specified, it's a required context.
65
- throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
66
- }
67
- Provider.displayName = rootComponentName + 'Provider';
68
- return [
69
- Provider,
70
- useContext
71
- ];
72
- }
73
- /* -----------------------------------------------------------------------------------------------
74
- * createScope
75
- * ---------------------------------------------------------------------------------------------*/ const createScope = ()=>{
76
- const scopeContexts = defaultContexts.map((defaultContext)=>{
77
- return /*#__PURE__*/ React.createContext(defaultContext);
78
- });
79
- return function useScope(scope) {
80
- const contexts = (scope === null || scope === void 0 ? void 0 : scope[scopeName]) || scopeContexts;
81
- return React.useMemo(()=>({
82
- [`__scope${scopeName}`]: {
83
- ...scope,
84
- [scopeName]: contexts
85
- }
86
- })
87
- , [
88
- scope,
89
- contexts
90
- ]);
91
- };
92
- };
93
- createScope.scopeName = scopeName;
94
- return [
95
- $c512c27ab02ef895$export$fd42f52fd3ae1109,
96
- $c512c27ab02ef895$var$composeContextScopes(createScope, ...createContextScopeDeps)
97
- ];
98
- }
99
- /* -------------------------------------------------------------------------------------------------
100
- * composeContextScopes
101
- * -----------------------------------------------------------------------------------------------*/ function $c512c27ab02ef895$var$composeContextScopes(...scopes) {
102
- const baseScope = scopes[0];
103
- if (scopes.length === 1) return baseScope;
104
- const createScope1 = ()=>{
105
- const scopeHooks = scopes.map((createScope)=>({
106
- useScope: createScope(),
107
- scopeName: createScope.scopeName
108
- })
109
- );
110
- return function useComposedScopes(overrideScopes) {
111
- const nextScopes1 = scopeHooks.reduce((nextScopes, { useScope: useScope , scopeName: scopeName })=>{
112
- // We are calling a hook inside a callback which React warns against to avoid inconsistent
113
- // renders, however, scoping doesn't have render side effects so we ignore the rule.
114
- // eslint-disable-next-line react-hooks/rules-of-hooks
115
- const scopeProps = useScope(overrideScopes);
116
- const currentScope = scopeProps[`__scope${scopeName}`];
117
- return {
118
- ...nextScopes,
119
- ...currentScope
120
- };
121
- }, {});
122
- return React.useMemo(()=>({
123
- [`__scope${baseScope.scopeName}`]: nextScopes1
124
- })
125
- , [
126
- nextScopes1
127
- ]);
128
- };
129
- };
130
- createScope1.scopeName = baseScope.scopeName;
131
- return createScope1;
132
- }
133
-
134
- /**
135
- * On the server, React emits a warning when calling `useLayoutEffect`.
136
- * This is because neither `useLayoutEffect` nor `useEffect` run on the server.
137
- * We use this safe version which suppresses the warning by replacing it with a noop on the server.
138
- *
139
- * See: https://reactjs.org/docs/hooks-reference.html#uselayouteffect
140
- */ const $9f79659886946c16$export$e5c5a5f917a5871c = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) ? React.useLayoutEffect : ()=>{};
141
-
142
- /**
143
- * A custom hook that converts a callback to a ref to avoid triggering re-renders when passed as a
144
- * prop or avoid re-executing effects when passed as a dependency
145
- */ function $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(callback) {
146
- const callbackRef = React.useRef(callback);
147
- React.useEffect(()=>{
148
- callbackRef.current = callback;
149
- }); // https://github.com/facebook/react/issues/19240
150
- return React.useMemo(()=>(...args)=>{
151
- var _callbackRef$current;
152
- return (_callbackRef$current = callbackRef.current) === null || _callbackRef$current === void 0 ? void 0 : _callbackRef$current.call(callbackRef, ...args);
153
- }
154
- , []);
155
- }
156
-
157
- function $71cd76cc60e0454e$export$6f32135080cb4c3({ prop: prop , defaultProp: defaultProp , onChange: onChange = ()=>{} }) {
158
- const [uncontrolledProp, setUncontrolledProp] = $71cd76cc60e0454e$var$useUncontrolledState({
159
- defaultProp: defaultProp,
160
- onChange: onChange
161
- });
162
- const isControlled = prop !== undefined;
163
- const value1 = isControlled ? prop : uncontrolledProp;
164
- const handleChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onChange);
165
- const setValue = React.useCallback((nextValue)=>{
166
- if (isControlled) {
167
- const setter = nextValue;
168
- const value = typeof nextValue === 'function' ? setter(prop) : nextValue;
169
- if (value !== prop) handleChange(value);
170
- } else setUncontrolledProp(nextValue);
171
- }, [
172
- isControlled,
173
- prop,
174
- setUncontrolledProp,
175
- handleChange
176
- ]);
177
- return [
178
- value1,
179
- setValue
180
- ];
181
- }
182
- function $71cd76cc60e0454e$var$useUncontrolledState({ defaultProp: defaultProp , onChange: onChange }) {
183
- const uncontrolledState = React.useState(defaultProp);
184
- const [value] = uncontrolledState;
185
- const prevValueRef = React.useRef(value);
186
- const handleChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onChange);
187
- React.useEffect(()=>{
188
- if (prevValueRef.current !== value) {
189
- handleChange(value);
190
- prevValueRef.current = value;
191
- }
192
- }, [
193
- value,
194
- prevValueRef,
195
- handleChange
196
- ]);
197
- return uncontrolledState;
198
- }
199
-
200
- /* -------------------------------------------------------------------------------------------------
201
- * Slot
202
- * -----------------------------------------------------------------------------------------------*/ const $5e63c961fc1ce211$export$8c6ed5c666ac1360 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
203
- const { children: children , ...slotProps } = props;
204
- const childrenArray = React.Children.toArray(children);
205
- const slottable = childrenArray.find($5e63c961fc1ce211$var$isSlottable);
206
- if (slottable) {
207
- // the new element to render is the one passed as a child of `Slottable`
208
- const newElement = slottable.props.children;
209
- const newChildren = childrenArray.map((child)=>{
210
- if (child === slottable) {
211
- // because the new element will be the one rendered, we are only interested
212
- // in grabbing its children (`newElement.props.children`)
213
- if (React.Children.count(newElement) > 1) return React.Children.only(null);
214
- return /*#__PURE__*/ React.isValidElement(newElement) ? newElement.props.children : null;
215
- } else return child;
216
- });
217
- return /*#__PURE__*/ React.createElement($5e63c961fc1ce211$var$SlotClone, _extends._extends({}, slotProps, {
218
- ref: forwardedRef
219
- }), /*#__PURE__*/ React.isValidElement(newElement) ? /*#__PURE__*/ React.cloneElement(newElement, undefined, newChildren) : null);
220
- }
221
- return /*#__PURE__*/ React.createElement($5e63c961fc1ce211$var$SlotClone, _extends._extends({}, slotProps, {
222
- ref: forwardedRef
223
- }), children);
224
- });
225
- $5e63c961fc1ce211$export$8c6ed5c666ac1360.displayName = 'Slot';
226
- /* -------------------------------------------------------------------------------------------------
227
- * SlotClone
228
- * -----------------------------------------------------------------------------------------------*/ const $5e63c961fc1ce211$var$SlotClone = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
229
- const { children: children , ...slotProps } = props;
230
- if (/*#__PURE__*/ React.isValidElement(children)) return /*#__PURE__*/ React.cloneElement(children, {
231
- ...$5e63c961fc1ce211$var$mergeProps(slotProps, children.props),
232
- ref: forwardedRef ? $6ed0406888f73fc4$export$43e446d32b3d21af(forwardedRef, children.ref) : children.ref
233
- });
234
- return React.Children.count(children) > 1 ? React.Children.only(null) : null;
235
- });
236
- $5e63c961fc1ce211$var$SlotClone.displayName = 'SlotClone';
237
- /* -------------------------------------------------------------------------------------------------
238
- * Slottable
239
- * -----------------------------------------------------------------------------------------------*/ const $5e63c961fc1ce211$export$d9f1ccf0bdb05d45 = ({ children: children })=>{
240
- return /*#__PURE__*/ React.createElement(React.Fragment, null, children);
241
- };
242
- /* ---------------------------------------------------------------------------------------------- */ function $5e63c961fc1ce211$var$isSlottable(child) {
243
- return /*#__PURE__*/ React.isValidElement(child) && child.type === $5e63c961fc1ce211$export$d9f1ccf0bdb05d45;
244
- }
245
- function $5e63c961fc1ce211$var$mergeProps(slotProps, childProps) {
246
- // all child props should override
247
- const overrideProps = {
248
- ...childProps
249
- };
250
- for(const propName in childProps){
251
- const slotPropValue = slotProps[propName];
252
- const childPropValue = childProps[propName];
253
- const isHandler = /^on[A-Z]/.test(propName);
254
- if (isHandler) {
255
- // if the handler exists on both, we compose them
256
- if (slotPropValue && childPropValue) overrideProps[propName] = (...args)=>{
257
- childPropValue(...args);
258
- slotPropValue(...args);
259
- };
260
- else if (slotPropValue) overrideProps[propName] = slotPropValue;
261
- } else if (propName === 'style') overrideProps[propName] = {
262
- ...slotPropValue,
263
- ...childPropValue
264
- };
265
- else if (propName === 'className') overrideProps[propName] = [
266
- slotPropValue,
267
- childPropValue
268
- ].filter(Boolean).join(' ');
269
- }
270
- return {
271
- ...slotProps,
272
- ...overrideProps
273
- };
274
- }
275
-
276
- const $8927f6f2acc4f386$var$NODES = [
277
- 'a',
278
- 'button',
279
- 'div',
280
- 'form',
281
- 'h2',
282
- 'h3',
283
- 'img',
284
- 'input',
285
- 'label',
286
- 'li',
287
- 'nav',
288
- 'ol',
289
- 'p',
290
- 'span',
291
- 'svg',
292
- 'ul'
293
- ]; // Temporary while we await merge of this fix:
294
- // https://github.com/DefinitelyTyped/DefinitelyTyped/pull/55396
295
- // prettier-ignore
296
- /* -------------------------------------------------------------------------------------------------
297
- * Primitive
298
- * -----------------------------------------------------------------------------------------------*/ const $8927f6f2acc4f386$export$250ffa63cdc0d034 = $8927f6f2acc4f386$var$NODES.reduce((primitive, node)=>{
299
- const Node = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
300
- const { asChild: asChild , ...primitiveProps } = props;
301
- const Comp = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : node;
302
- React.useEffect(()=>{
303
- window[Symbol.for('radix-ui')] = true;
304
- }, []);
305
- return /*#__PURE__*/ React.createElement(Comp, _extends._extends({}, primitiveProps, {
306
- ref: forwardedRef
307
- }));
308
- });
309
- Node.displayName = `Primitive.${node}`;
310
- return {
311
- ...primitive,
312
- [node]: Node
313
- };
314
- }, {});
315
- /* -------------------------------------------------------------------------------------------------
316
- * Utils
317
- * -----------------------------------------------------------------------------------------------*/ /**
318
- * Flush custom event dispatch
319
- * https://github.com/radix-ui/primitives/pull/1378
320
- *
321
- * React batches *all* event handlers since version 18, this introduces certain considerations when using custom event types.
322
- *
323
- * Internally, React prioritises events in the following order:
324
- * - discrete
325
- * - continuous
326
- * - default
327
- *
328
- * https://github.com/facebook/react/blob/a8a4742f1c54493df00da648a3f9d26e3db9c8b5/packages/react-dom/src/events/ReactDOMEventListener.js#L294-L350
329
- *
330
- * `discrete` is an important distinction as updates within these events are applied immediately.
331
- * React however, is not able to infer the priority of custom event types due to how they are detected internally.
332
- * Because of this, it's possible for updates from custom events to be unexpectedly batched when
333
- * dispatched by another `discrete` event.
334
- *
335
- * In order to ensure that updates from custom events are applied predictably, we need to manually flush the batch.
336
- * This utility should be used when dispatching a custom event from within another `discrete` event, this utility
337
- * is not nessesary when dispatching known event types, or if dispatching a custom type inside a non-discrete event.
338
- * For example:
339
- *
340
- * dispatching a known click 👎
341
- * target.dispatchEvent(new Event(‘click’))
342
- *
343
- * dispatching a custom type within a non-discrete event 👎
344
- * onScroll={(event) => event.target.dispatchEvent(new CustomEvent(‘customType’))}
345
- *
346
- * dispatching a custom type within a `discrete` event 👍
347
- * onPointerDown={(event) => dispatchDiscreteCustomEvent(event.target, new CustomEvent(‘customType’))}
348
- *
349
- * Note: though React classifies `focus`, `focusin` and `focusout` events as `discrete`, it's not recommended to use
350
- * this utility with them. This is because it's possible for those handlers to be called implicitly during render
351
- * e.g. when focus is within a component as it is unmounted, or when managing focus on mount.
352
- */ function $8927f6f2acc4f386$export$6d1a0317bde7de7f(target, event) {
353
- if (target) $7SXl2$reactdom.flushSync(()=>target.dispatchEvent(event)
354
- );
355
- }
356
-
357
- function $fe963b355347cc68$export$3e6543de14f8614f(initialState, machine) {
358
- return React.useReducer((state, event)=>{
359
- const nextState = machine[state][event];
360
- return nextState !== null && nextState !== void 0 ? nextState : state;
361
- }, initialState);
362
- }
363
-
364
-
365
- const $921a889cee6df7e8$export$99c2b779aa4e8b8b = (props)=>{
366
- const { present: present , children: children } = props;
367
- const presence = $921a889cee6df7e8$var$usePresence(present);
368
- const child = typeof children === 'function' ? children({
369
- present: presence.isPresent
370
- }) : React.Children.only(children);
371
- const ref = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(presence.ref, child.ref);
372
- const forceMount = typeof children === 'function';
373
- return forceMount || presence.isPresent ? /*#__PURE__*/ React.cloneElement(child, {
374
- ref: ref
375
- }) : null;
376
- };
377
- $921a889cee6df7e8$export$99c2b779aa4e8b8b.displayName = 'Presence';
378
- /* -------------------------------------------------------------------------------------------------
379
- * usePresence
380
- * -----------------------------------------------------------------------------------------------*/ function $921a889cee6df7e8$var$usePresence(present) {
381
- const [node1, setNode] = React.useState();
382
- const stylesRef = React.useRef({});
383
- const prevPresentRef = React.useRef(present);
384
- const prevAnimationNameRef = React.useRef('none');
385
- const initialState = present ? 'mounted' : 'unmounted';
386
- const [state, send] = $fe963b355347cc68$export$3e6543de14f8614f(initialState, {
387
- mounted: {
388
- UNMOUNT: 'unmounted',
389
- ANIMATION_OUT: 'unmountSuspended'
390
- },
391
- unmountSuspended: {
392
- MOUNT: 'mounted',
393
- ANIMATION_END: 'unmounted'
394
- },
395
- unmounted: {
396
- MOUNT: 'mounted'
397
- }
398
- });
399
- React.useEffect(()=>{
400
- const currentAnimationName = $921a889cee6df7e8$var$getAnimationName(stylesRef.current);
401
- prevAnimationNameRef.current = state === 'mounted' ? currentAnimationName : 'none';
402
- }, [
403
- state
404
- ]);
405
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
406
- const styles = stylesRef.current;
407
- const wasPresent = prevPresentRef.current;
408
- const hasPresentChanged = wasPresent !== present;
409
- if (hasPresentChanged) {
410
- const prevAnimationName = prevAnimationNameRef.current;
411
- const currentAnimationName = $921a889cee6df7e8$var$getAnimationName(styles);
412
- if (present) send('MOUNT');
413
- else if (currentAnimationName === 'none' || (styles === null || styles === void 0 ? void 0 : styles.display) === 'none') // If there is no exit animation or the element is hidden, animations won't run
414
- // so we unmount instantly
415
- send('UNMOUNT');
416
- else {
417
- /**
418
- * When `present` changes to `false`, we check changes to animation-name to
419
- * determine whether an animation has started. We chose this approach (reading
420
- * computed styles) because there is no `animationrun` event and `animationstart`
421
- * fires after `animation-delay` has expired which would be too late.
422
- */ const isAnimating = prevAnimationName !== currentAnimationName;
423
- if (wasPresent && isAnimating) send('ANIMATION_OUT');
424
- else send('UNMOUNT');
425
- }
426
- prevPresentRef.current = present;
427
- }
428
- }, [
429
- present,
430
- send
431
- ]);
432
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
433
- if (node1) {
434
- /**
435
- * Triggering an ANIMATION_OUT during an ANIMATION_IN will fire an `animationcancel`
436
- * event for ANIMATION_IN after we have entered `unmountSuspended` state. So, we
437
- * make sure we only trigger ANIMATION_END for the currently active animation.
438
- */ const handleAnimationEnd = (event)=>{
439
- const currentAnimationName = $921a889cee6df7e8$var$getAnimationName(stylesRef.current);
440
- const isCurrentAnimation = currentAnimationName.includes(event.animationName);
441
- if (event.target === node1 && isCurrentAnimation) // With React 18 concurrency this update is applied
442
- // a frame after the animation ends, creating a flash of visible content.
443
- // By manually flushing we ensure they sync within a frame, removing the flash.
444
- $7SXl2$reactdom.flushSync(()=>send('ANIMATION_END')
445
- );
446
- };
447
- const handleAnimationStart = (event)=>{
448
- if (event.target === node1) // if animation occurred, store its name as the previous animation.
449
- prevAnimationNameRef.current = $921a889cee6df7e8$var$getAnimationName(stylesRef.current);
450
- };
451
- node1.addEventListener('animationstart', handleAnimationStart);
452
- node1.addEventListener('animationcancel', handleAnimationEnd);
453
- node1.addEventListener('animationend', handleAnimationEnd);
454
- return ()=>{
455
- node1.removeEventListener('animationstart', handleAnimationStart);
456
- node1.removeEventListener('animationcancel', handleAnimationEnd);
457
- node1.removeEventListener('animationend', handleAnimationEnd);
458
- };
459
- } else // Transition to the unmounted state if the node is removed prematurely.
460
- // We avoid doing so during cleanup as the node may change but still exist.
461
- send('ANIMATION_END');
462
- }, [
463
- node1,
464
- send
465
- ]);
466
- return {
467
- isPresent: [
468
- 'mounted',
469
- 'unmountSuspended'
470
- ].includes(state),
471
- ref: React.useCallback((node)=>{
472
- if (node) stylesRef.current = getComputedStyle(node);
473
- setNode(node);
474
- }, [])
475
- };
476
- }
477
- /* -----------------------------------------------------------------------------------------------*/ function $921a889cee6df7e8$var$getAnimationName(styles) {
478
- return (styles === null || styles === void 0 ? void 0 : styles.animationName) || 'none';
479
- }
480
-
481
- exports.$5e63c961fc1ce211$export$8c6ed5c666ac1360 = $5e63c961fc1ce211$export$8c6ed5c666ac1360;
482
- exports.$6ed0406888f73fc4$export$c7b2cbe3552a0d05 = $6ed0406888f73fc4$export$c7b2cbe3552a0d05;
483
- exports.$71cd76cc60e0454e$export$6f32135080cb4c3 = $71cd76cc60e0454e$export$6f32135080cb4c3;
484
- exports.$8927f6f2acc4f386$export$250ffa63cdc0d034 = $8927f6f2acc4f386$export$250ffa63cdc0d034;
485
- exports.$8927f6f2acc4f386$export$6d1a0317bde7de7f = $8927f6f2acc4f386$export$6d1a0317bde7de7f;
486
- exports.$921a889cee6df7e8$export$99c2b779aa4e8b8b = $921a889cee6df7e8$export$99c2b779aa4e8b8b;
487
- exports.$9f79659886946c16$export$e5c5a5f917a5871c = $9f79659886946c16$export$e5c5a5f917a5871c;
488
- exports.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a;
489
- exports.$c512c27ab02ef895$export$50c7b4e9d9f19c1 = $c512c27ab02ef895$export$50c7b4e9d9f19c1;
490
- exports.$e42e1063c40fb3ef$export$b9ecd428b558ff10 = $e42e1063c40fb3ef$export$b9ecd428b558ff10;