@blockend/widget 1.0.31 → 1.0.32

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 (162) hide show
  1. package/dist/AllRoutes-CPwuTwqd.js +2209 -0
  2. package/dist/Box-CIChapvH.js +55 -0
  3. package/dist/EstGas-CEFILtyf.js +12867 -0
  4. package/dist/Grow-DJZj9zjv.js +1656 -0
  5. package/dist/InputComp-DqF1JGIu.js +106 -0
  6. package/dist/LoadRoute-r3sHTYXM.js +126 -0
  7. package/dist/QuotesProgress-BXVLxZ8U.js +28 -0
  8. package/dist/SwapAsset-07WvVwl-.js +64 -0
  9. package/dist/Tooltip-CNAsCF8n.js +572 -0
  10. package/dist/TxnButton-D2TTkFYA.js +207 -0
  11. package/dist/WidgetForm.module-QHJ0-m5f.js +9 -0
  12. package/dist/{add-B8AfyNIx.js → add-t2GqC9VA.js} +3 -3
  13. package/dist/{all-wallets-BaLLU39i.js → all-wallets-DFyf0q31.js} +3 -3
  14. package/dist/{app-store-DNpoABj1.js → app-store-aAahwmBP.js} +3 -3
  15. package/dist/{apple-DzzHtaL4.js → apple-DeRgpwlc.js} +3 -3
  16. package/dist/{arrow-bottom-D2c13c51.js → arrow-bottom-DdEOkaAj.js} +3 -3
  17. package/dist/{arrow-bottom-circle-ls9OCLx1.js → arrow-bottom-circle-BWwREWcv.js} +3 -3
  18. package/dist/{arrow-left-BI3rQkNI.js → arrow-left-CulyLmoH.js} +3 -3
  19. package/dist/{arrow-right-rnMzhVod.js → arrow-right-Dwr7TISn.js} +3 -3
  20. package/dist/{arrow-top-CfA6PVMz.js → arrow-top-pL4rM_y8.js} +3 -3
  21. package/dist/{bank-CmpAmHgg.js → bank-CPuyK_08.js} +3 -3
  22. package/dist/basic-CVc9xEvb.js +5783 -0
  23. package/dist/{browser-mEcjgS1H.js → browser-Cbq2Zbp4.js} +3 -3
  24. package/dist/{card-DkgIWcMc.js → card-B_hUtPWK.js} +3 -3
  25. package/dist/ccip-BLVGcR4A.js +228 -0
  26. package/dist/{checkmark-B_A013n2.js → checkmark-WEqTsFAc.js} +3 -3
  27. package/dist/{checkmark-bold-DestuG2T.js → checkmark-bold-Du_ZvhqM.js} +3 -3
  28. package/dist/{chevron-bottom-Di3S86dj.js → chevron-bottom-C-s-lv4L.js} +3 -3
  29. package/dist/{chevron-left-A9Wj-3tj.js → chevron-left-C7NcRElx.js} +3 -3
  30. package/dist/{chevron-right-UFxJogOZ.js → chevron-right-CSzmAmdn.js} +3 -3
  31. package/dist/{chevron-top-BbZs3eaC.js → chevron-top-Dd99Wfel.js} +3 -3
  32. package/dist/{chrome-store-B4F6hJmy.js → chrome-store-C4p77Of0.js} +3 -3
  33. package/dist/{clock-BbAQ09uV.js → clock-Cib24qjH.js} +3 -3
  34. package/dist/clockIcon-C2W5xvyt.js +76 -0
  35. package/dist/{close-CY3oZP_D.js → close-BXjEkTvS.js} +3 -3
  36. package/dist/{coinPlaceholder-DpfsobZT.js → coinPlaceholder-BFNC7cQN.js} +3 -3
  37. package/dist/{compass-CHS7RZFk.js → compass-CXPX5Ycp.js} +3 -3
  38. package/dist/{copy-CEd4nGhs.js → copy-BEawMbmF.js} +3 -3
  39. package/dist/core-Bez9Ow7F.js +14967 -0
  40. package/dist/cursor-Cxq4Q9jk.js +7 -0
  41. package/dist/{cursor-transparent-Tm6k6Ws4.js → cursor-transparent-ZjJ0P2vr.js} +3 -3
  42. package/dist/{desktop-CrSyXZkL.js → desktop-BhZVovAp.js} +3 -3
  43. package/dist/{disconnect-BooT10E1.js → disconnect-AC-bffZO.js} +3 -3
  44. package/dist/{discord-B982Qaml.js → discord-dT97h-CC.js} +3 -3
  45. package/dist/down-DP56YSKp.js +606 -0
  46. package/dist/{etherscan-CFL0IcNl.js → etherscan-rYFRhRTM.js} +3 -3
  47. package/dist/ethertousd-CC_ezooz.js +6 -0
  48. package/dist/{exclamation-triangle-BBeGXYgt.js → exclamation-triangle-C-pCuC08.js} +3 -3
  49. package/dist/{extension-C5WqJw73.js → extension-BnqauLSn.js} +3 -3
  50. package/dist/{external-link-CcSxVDcd.js → external-link-M9D6e_F3.js} +3 -3
  51. package/dist/{facebook-DF0v9ED8.js → facebook-DHezcoD-.js} +3 -3
  52. package/dist/{farcaster-Boq7M4VK.js → farcaster-D0Ky-Imv.js} +3 -3
  53. package/dist/{filters-DfeymbPx.js → filters-B02NYLWq.js} +3 -3
  54. package/dist/getChainIds-CJd2TZYT.js +1888 -0
  55. package/dist/getCosmosAddress-DTZfw04G.js +9565 -0
  56. package/dist/{github-DQ8FV4bD.js → github-BzQkIMuE.js} +3 -3
  57. package/dist/{google-Dm8FDDZR.js → google-BpwCJ4Fs.js} +3 -3
  58. package/dist/hamburger-BzqwkUjE.js +3915 -0
  59. package/dist/{help-circle-CbgiAebR.js → help-circle-C0nOySHC.js} +3 -3
  60. package/dist/{id-CzqxUksI.js → id-DFP_kFd4.js} +3 -3
  61. package/dist/{image-CsCGTIN-.js → image-QiYOAGjM.js} +3 -3
  62. package/dist/index-CDq3vNnP.js +22 -0
  63. package/dist/index-CLzkn733.js +28223 -0
  64. package/dist/index-CjtwASJt.js +252 -0
  65. package/dist/index-CrC4B7xn.js +331 -0
  66. package/dist/index-D5hLIe-N.js +9 -0
  67. package/dist/index-DDk00SOL.js +159 -0
  68. package/dist/index-DTish3yr.js +1014 -0
  69. package/dist/index-DW3W7zaF.js +473 -0
  70. package/dist/index-DXdD3L9f.js +1460 -0
  71. package/dist/index-DaJ1272l.js +18613 -0
  72. package/dist/index-DxPp2gBS.js +992 -0
  73. package/dist/index-Dy_n2MPD.js +3010 -0
  74. package/dist/index-oc8HPfOF.js +13583 -0
  75. package/dist/index.es-Bsr7zP98.js +366 -0
  76. package/dist/index.es-C-j-Ghef.js +11678 -0
  77. package/dist/index.es.js +4 -4
  78. package/dist/{info-fKCfLW0k.js → info-BTLQJ-wd.js} +3 -3
  79. package/dist/{info-circle-Bt350Yzj.js → info-circle-Dla9169_.js} +3 -3
  80. package/dist/{lightbulb-BL9YBxiA.js → lightbulb-PN8DA_Wh.js} +3 -3
  81. package/dist/{mail-_g6CHQeQ.js → mail-BGYZut_4.js} +3 -3
  82. package/dist/{mobile-B-EQ4IcH.js → mobile-BM760ZzX.js} +3 -3
  83. package/dist/{more-C3rpOdUy.js → more-rHGnl2ck.js} +3 -3
  84. package/dist/{network-placeholder-D9Ak7Xj_.js → network-placeholder-CyQl-3_2.js} +3 -3
  85. package/dist/{nftPlaceholder-CIIm2V_o.js → nftPlaceholder-nuUJ8nKY.js} +3 -3
  86. package/dist/{off-DZjgI0eE.js → off-GYlwYDrT.js} +3 -3
  87. package/dist/{play-store-DvRnagoF.js → play-store-Ck01Ez1F.js} +3 -3
  88. package/dist/{plus-C2jN2huZ.js → plus-CQfXWgLw.js} +3 -3
  89. package/dist/{qr-code-B64HnZgi.js → qr-code-CyLVwLY7.js} +3 -3
  90. package/dist/{recycle-horizontal-CovcJGa_.js → recycle-horizontal-DvnWPcEQ.js} +3 -3
  91. package/dist/{refresh-J1Vw6QMA.js → refresh-BOxj8b2n.js} +3 -3
  92. package/dist/{reown-logo-BsXoZ3KT.js → reown-logo-D1iprOTg.js} +3 -3
  93. package/dist/{search-BC86wYXR.js → search-DrPaZPnc.js} +3 -3
  94. package/dist/secp256k1-DgmH1qVg.js +1251 -0
  95. package/dist/{send-BPA1bK5G.js → send-ybBREe4b.js} +3 -3
  96. package/dist/shareicon-D3Qj5j1T.js +262 -0
  97. package/dist/{sortDown-cDA6MpOw.js → sortDown-CjBaDQTU.js} +13 -13
  98. package/dist/{swapHorizontal-47_8ePle.js → swapHorizontal-BddjZdXK.js} +3 -3
  99. package/dist/{swapHorizontalBold-CJ7TzeQP.js → swapHorizontalBold-B6AWjPZ9.js} +3 -3
  100. package/dist/{swapHorizontalMedium-CTACgUR9.js → swapHorizontalMedium-CNacWoBn.js} +3 -3
  101. package/dist/{swapHorizontalRoundedBold-Ht3_LABp.js → swapHorizontalRoundedBold-B8VcPnqt.js} +3 -3
  102. package/dist/{swapVertical-DlS0V6DD.js → swapVertical-zY2BbSyQ.js} +3 -3
  103. package/dist/{telegram-UZ00kvIE.js → telegram-DS4l-8Oc.js} +3 -3
  104. package/dist/{three-dots-D9zVXr1j.js → three-dots-RctNqamK.js} +3 -3
  105. package/dist/truncate-D9t92mVX.js +7 -0
  106. package/dist/{twitch-CP6rpz4m.js → twitch-CJ0llIIH.js} +3 -3
  107. package/dist/{twitterIcon-Cm3I3FRU.js → twitterIcon-pgvN9-bP.js} +3 -3
  108. package/dist/unsupportedProp-BJVuEW_b.js +10 -0
  109. package/dist/useRegisterError-C_YLA1dw.js +9857 -0
  110. package/dist/validError-CDlJpg_f.js +6 -0
  111. package/dist/{verify-DuUE85WT.js → verify-BeZLo1Fq.js} +3 -3
  112. package/dist/{verify-filled-CfgydKPa.js → verify-filled-meyb7E16.js} +3 -3
  113. package/dist/w3m-modal-C-Jp9NVv.js +1471 -0
  114. package/dist/{wallet-BC2LSDlF.js → wallet-CFcOgSsz.js} +3 -3
  115. package/dist/{wallet-placeholder-DugEJ7xM.js → wallet-placeholder-CeUMILZq.js} +3 -3
  116. package/dist/{walletconnect-wayCaYfk.js → walletconnect-D6LB1PyC.js} +7 -9
  117. package/dist/{warning-circle-Cy9YuvwU.js → warning-circle-BRtzofvT.js} +3 -3
  118. package/dist/{x-jggPFiy-.js → x-DKQAOOh3.js} +3 -3
  119. package/package.json +1 -1
  120. package/dist/AllRoutes-Bdi5ZW8W.js +0 -2604
  121. package/dist/Box-e4gA-y_H.js +0 -60
  122. package/dist/EstGas-C5ihS0Mw.js +0 -17108
  123. package/dist/Grow-B4K-I-E-.js +0 -2212
  124. package/dist/InputComp-C_UUZxNU.js +0 -114
  125. package/dist/LoadRoute-CnDhVKdh.js +0 -142
  126. package/dist/QuotesProgress-DxgPgPJE.js +0 -29
  127. package/dist/SwapAsset-CmmuxeQF.js +0 -65
  128. package/dist/Tooltip-D8YjOOKU.js +0 -718
  129. package/dist/TxnButton-CF-TLZrD.js +0 -302
  130. package/dist/WidgetForm.module-DhUUlwZP.js +0 -13
  131. package/dist/basic-Cx2xxgd9.js +0 -7109
  132. package/dist/ccip-BKpquA5i.js +0 -250
  133. package/dist/clockIcon-jSNFFrLy.js +0 -76
  134. package/dist/core-C-gr9X18.js +0 -17217
  135. package/dist/cursor-BTtIlTHP.js +0 -7
  136. package/dist/down-DDk8OoJG.js +0 -809
  137. package/dist/ethertousd-BOknTgU4.js +0 -7
  138. package/dist/getChainIds-6iugk2h0.js +0 -2431
  139. package/dist/getCosmosAddress-BgD5iV6f.js +0 -13998
  140. package/dist/hamburger-BYe_G11E.js +0 -4562
  141. package/dist/index-BAmjBHYR.js +0 -1087
  142. package/dist/index-BxHeZ9IF.js +0 -543
  143. package/dist/index-C7cb2O7r.js +0 -16078
  144. package/dist/index-CF9p4S_X.js +0 -11
  145. package/dist/index-C_vo1L7p.js +0 -24384
  146. package/dist/index-Ch7w83dW.js +0 -4217
  147. package/dist/index-Crhenmgw.js +0 -188
  148. package/dist/index-Cz5Dosd2.js +0 -412
  149. package/dist/index-D5OnT-__.js +0 -35858
  150. package/dist/index-DArR1lwi.js +0 -1759
  151. package/dist/index-hEJSpZe-.js +0 -308
  152. package/dist/index-m2O0cbD8.js +0 -1883
  153. package/dist/index-sLx4Edw4.js +0 -22
  154. package/dist/index.es-DIbGJsfa.js +0 -475
  155. package/dist/index.es-t6sHlseh.js +0 -12916
  156. package/dist/secp256k1-BkBK0mD5.js +0 -1681
  157. package/dist/shareicon-C88Wx-AM.js +0 -314
  158. package/dist/truncate-DSxFWEga.js +0 -7
  159. package/dist/unsupportedProp-DkeDzLfM.js +0 -14
  160. package/dist/useRegisterError-W_UfecIN.js +0 -19288
  161. package/dist/validError-rariWQ7G.js +0 -14
  162. package/dist/w3m-modal-Bl-DPlah.js +0 -1721
@@ -1,2431 +0,0 @@
1
- import { P as PropTypes, b as _extends, _ as _objectWithoutPropertiesLoose, p as process$1, g as generateUtilityClass, u as useStore, l as lodashExports } from "./index-D5OnT-__.js";
2
- import * as React from "react";
3
- import React__default, { isValidElement, cloneElement, Children } from "react";
4
- import { n as chainPropTypes, t as ownerDocument, _ as _inheritsLoose, y as TransitionGroupContext, c as clsx, g as generateUtilityClasses, d as useDefaultProps, z as useTimeout, s as styled, A as keyframes, h as useForkRef, D as useIsFocusVisible, q as useEventCallback, a as composeClasses, b as refType, o as useTheme, T as Transition, x as getReactElementRef, E as getTransitionProps, I as reflow, J as elementAcceptingRef, K as exactProp, L as extractEventHandlers, v as useSlotProps, P as Portal, H as HTMLElementType } from "./useRegisterError-W_UfecIN.js";
5
- import { jsx, jsxs } from "react/jsx-runtime";
6
- import { getWallet, WalletType } from "graz";
7
- function isClassComponent(elementType) {
8
- const {
9
- prototype = {}
10
- } = elementType;
11
- return Boolean(prototype.isReactComponent);
12
- }
13
- function elementTypeAcceptingRef(props, propName, componentName, location, propFullName) {
14
- const propValue = props[propName];
15
- const safePropName = propFullName || propName;
16
- if (propValue == null || // When server-side rendering React doesn't warn either.
17
- // This is not an accurate check for SSR.
18
- // This is only in place for emotion compat.
19
- // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
20
- typeof window === "undefined") {
21
- return null;
22
- }
23
- let warningHint;
24
- if (typeof propValue === "function" && !isClassComponent(propValue)) {
25
- warningHint = "Did you accidentally provide a plain function component instead?";
26
- }
27
- if (warningHint !== void 0) {
28
- return new Error(`Invalid ${location} \`${safePropName}\` supplied to \`${componentName}\`. Expected an element type that can hold a ref. ${warningHint} For more information see https://mui.com/r/caveat-with-refs-guide`);
29
- }
30
- return null;
31
- }
32
- const elementTypeAcceptingRef$1 = chainPropTypes(PropTypes.elementType, elementTypeAcceptingRef);
33
- function createChainedFunction(...funcs) {
34
- return funcs.reduce((acc, func) => {
35
- if (func == null) {
36
- return acc;
37
- }
38
- return function chainedFunction(...args) {
39
- acc.apply(this, args);
40
- func.apply(this, args);
41
- };
42
- }, () => {
43
- });
44
- }
45
- function ownerWindow(node) {
46
- const doc = ownerDocument(node);
47
- return doc.defaultView || window;
48
- }
49
- function getScrollbarSize(doc) {
50
- const documentWidth = doc.documentElement.clientWidth;
51
- return Math.abs(window.innerWidth - documentWidth);
52
- }
53
- function _assertThisInitialized(e) {
54
- if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
55
- return e;
56
- }
57
- function getChildMapping(children, mapFn) {
58
- var mapper = function mapper2(child) {
59
- return mapFn && isValidElement(child) ? mapFn(child) : child;
60
- };
61
- var result = /* @__PURE__ */ Object.create(null);
62
- if (children) Children.map(children, function(c) {
63
- return c;
64
- }).forEach(function(child) {
65
- result[child.key] = mapper(child);
66
- });
67
- return result;
68
- }
69
- function mergeChildMappings(prev, next) {
70
- prev = prev || {};
71
- next = next || {};
72
- function getValueForKey(key) {
73
- return key in next ? next[key] : prev[key];
74
- }
75
- var nextKeysPending = /* @__PURE__ */ Object.create(null);
76
- var pendingKeys = [];
77
- for (var prevKey in prev) {
78
- if (prevKey in next) {
79
- if (pendingKeys.length) {
80
- nextKeysPending[prevKey] = pendingKeys;
81
- pendingKeys = [];
82
- }
83
- } else {
84
- pendingKeys.push(prevKey);
85
- }
86
- }
87
- var i;
88
- var childMapping = {};
89
- for (var nextKey in next) {
90
- if (nextKeysPending[nextKey]) {
91
- for (i = 0; i < nextKeysPending[nextKey].length; i++) {
92
- var pendingNextKey = nextKeysPending[nextKey][i];
93
- childMapping[nextKeysPending[nextKey][i]] = getValueForKey(pendingNextKey);
94
- }
95
- }
96
- childMapping[nextKey] = getValueForKey(nextKey);
97
- }
98
- for (i = 0; i < pendingKeys.length; i++) {
99
- childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]);
100
- }
101
- return childMapping;
102
- }
103
- function getProp(child, prop, props) {
104
- return props[prop] != null ? props[prop] : child.props[prop];
105
- }
106
- function getInitialChildMapping(props, onExited) {
107
- return getChildMapping(props.children, function(child) {
108
- return cloneElement(child, {
109
- onExited: onExited.bind(null, child),
110
- in: true,
111
- appear: getProp(child, "appear", props),
112
- enter: getProp(child, "enter", props),
113
- exit: getProp(child, "exit", props)
114
- });
115
- });
116
- }
117
- function getNextChildMapping(nextProps, prevChildMapping, onExited) {
118
- var nextChildMapping = getChildMapping(nextProps.children);
119
- var children = mergeChildMappings(prevChildMapping, nextChildMapping);
120
- Object.keys(children).forEach(function(key) {
121
- var child = children[key];
122
- if (!isValidElement(child)) return;
123
- var hasPrev = key in prevChildMapping;
124
- var hasNext = key in nextChildMapping;
125
- var prevChild = prevChildMapping[key];
126
- var isLeaving = isValidElement(prevChild) && !prevChild.props.in;
127
- if (hasNext && (!hasPrev || isLeaving)) {
128
- children[key] = cloneElement(child, {
129
- onExited: onExited.bind(null, child),
130
- in: true,
131
- exit: getProp(child, "exit", nextProps),
132
- enter: getProp(child, "enter", nextProps)
133
- });
134
- } else if (!hasNext && hasPrev && !isLeaving) {
135
- children[key] = cloneElement(child, {
136
- in: false
137
- });
138
- } else if (hasNext && hasPrev && isValidElement(prevChild)) {
139
- children[key] = cloneElement(child, {
140
- onExited: onExited.bind(null, child),
141
- in: prevChild.props.in,
142
- exit: getProp(child, "exit", nextProps),
143
- enter: getProp(child, "enter", nextProps)
144
- });
145
- }
146
- });
147
- return children;
148
- }
149
- var values = Object.values || function(obj) {
150
- return Object.keys(obj).map(function(k) {
151
- return obj[k];
152
- });
153
- };
154
- var defaultProps = {
155
- component: "div",
156
- childFactory: function childFactory(child) {
157
- return child;
158
- }
159
- };
160
- var TransitionGroup = /* @__PURE__ */ function(_React$Component) {
161
- _inheritsLoose(TransitionGroup2, _React$Component);
162
- function TransitionGroup2(props, context) {
163
- var _this;
164
- _this = _React$Component.call(this, props, context) || this;
165
- var handleExited = _this.handleExited.bind(_assertThisInitialized(_this));
166
- _this.state = {
167
- contextValue: {
168
- isMounting: true
169
- },
170
- handleExited,
171
- firstRender: true
172
- };
173
- return _this;
174
- }
175
- var _proto = TransitionGroup2.prototype;
176
- _proto.componentDidMount = function componentDidMount() {
177
- this.mounted = true;
178
- this.setState({
179
- contextValue: {
180
- isMounting: false
181
- }
182
- });
183
- };
184
- _proto.componentWillUnmount = function componentWillUnmount() {
185
- this.mounted = false;
186
- };
187
- TransitionGroup2.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, _ref) {
188
- var prevChildMapping = _ref.children, handleExited = _ref.handleExited, firstRender = _ref.firstRender;
189
- return {
190
- children: firstRender ? getInitialChildMapping(nextProps, handleExited) : getNextChildMapping(nextProps, prevChildMapping, handleExited),
191
- firstRender: false
192
- };
193
- };
194
- _proto.handleExited = function handleExited(child, node) {
195
- var currentChildMapping = getChildMapping(this.props.children);
196
- if (child.key in currentChildMapping) return;
197
- if (child.props.onExited) {
198
- child.props.onExited(node);
199
- }
200
- if (this.mounted) {
201
- this.setState(function(state) {
202
- var children = _extends({}, state.children);
203
- delete children[child.key];
204
- return {
205
- children
206
- };
207
- });
208
- }
209
- };
210
- _proto.render = function render() {
211
- var _this$props = this.props, Component = _this$props.component, childFactory2 = _this$props.childFactory, props = _objectWithoutPropertiesLoose(_this$props, ["component", "childFactory"]);
212
- var contextValue = this.state.contextValue;
213
- var children = values(this.state.children).map(childFactory2);
214
- delete props.appear;
215
- delete props.enter;
216
- delete props.exit;
217
- if (Component === null) {
218
- return /* @__PURE__ */ React__default.createElement(TransitionGroupContext.Provider, {
219
- value: contextValue
220
- }, children);
221
- }
222
- return /* @__PURE__ */ React__default.createElement(TransitionGroupContext.Provider, {
223
- value: contextValue
224
- }, /* @__PURE__ */ React__default.createElement(Component, props, children));
225
- };
226
- return TransitionGroup2;
227
- }(React__default.Component);
228
- TransitionGroup.propTypes = process$1.env.NODE_ENV !== "production" ? {
229
- /**
230
- * `<TransitionGroup>` renders a `<div>` by default. You can change this
231
- * behavior by providing a `component` prop.
232
- * If you use React v16+ and would like to avoid a wrapping `<div>` element
233
- * you can pass in `component={null}`. This is useful if the wrapping div
234
- * borks your css styles.
235
- */
236
- component: PropTypes.any,
237
- /**
238
- * A set of `<Transition>` components, that are toggled `in` and out as they
239
- * leave. the `<TransitionGroup>` will inject specific transition props, so
240
- * remember to spread them through if you are wrapping the `<Transition>` as
241
- * with our `<Fade>` example.
242
- *
243
- * While this component is meant for multiple `Transition` or `CSSTransition`
244
- * children, sometimes you may want to have a single transition child with
245
- * content that you want to be transitioned out and in when you change it
246
- * (e.g. routes, images etc.) In that case you can change the `key` prop of
247
- * the transition child as you change its content, this will cause
248
- * `TransitionGroup` to transition the child out and back in.
249
- */
250
- children: PropTypes.node,
251
- /**
252
- * A convenience prop that enables or disables appear animations
253
- * for all children. Note that specifying this will override any defaults set
254
- * on individual children Transitions.
255
- */
256
- appear: PropTypes.bool,
257
- /**
258
- * A convenience prop that enables or disables enter animations
259
- * for all children. Note that specifying this will override any defaults set
260
- * on individual children Transitions.
261
- */
262
- enter: PropTypes.bool,
263
- /**
264
- * A convenience prop that enables or disables exit animations
265
- * for all children. Note that specifying this will override any defaults set
266
- * on individual children Transitions.
267
- */
268
- exit: PropTypes.bool,
269
- /**
270
- * You may need to apply reactive updates to a child as it is exiting.
271
- * This is generally done by using `cloneElement` however in the case of an exiting
272
- * child the element has already been removed and not accessible to the consumer.
273
- *
274
- * If you do need to update a child as it leaves you can provide a `childFactory`
275
- * to wrap every child, even the ones that are leaving.
276
- *
277
- * @type Function(child: ReactElement) -> ReactElement
278
- */
279
- childFactory: PropTypes.func
280
- } : {};
281
- TransitionGroup.defaultProps = defaultProps;
282
- function Ripple(props) {
283
- const {
284
- className,
285
- classes,
286
- pulsate = false,
287
- rippleX,
288
- rippleY,
289
- rippleSize,
290
- in: inProp,
291
- onExited,
292
- timeout
293
- } = props;
294
- const [leaving, setLeaving] = React.useState(false);
295
- const rippleClassName = clsx(className, classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);
296
- const rippleStyles = {
297
- width: rippleSize,
298
- height: rippleSize,
299
- top: -(rippleSize / 2) + rippleY,
300
- left: -(rippleSize / 2) + rippleX
301
- };
302
- const childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);
303
- if (!inProp && !leaving) {
304
- setLeaving(true);
305
- }
306
- React.useEffect(() => {
307
- if (!inProp && onExited != null) {
308
- const timeoutId = setTimeout(onExited, timeout);
309
- return () => {
310
- clearTimeout(timeoutId);
311
- };
312
- }
313
- return void 0;
314
- }, [onExited, inProp, timeout]);
315
- return /* @__PURE__ */ jsx("span", {
316
- className: rippleClassName,
317
- style: rippleStyles,
318
- children: /* @__PURE__ */ jsx("span", {
319
- className: childClassName
320
- })
321
- });
322
- }
323
- process$1.env.NODE_ENV !== "production" ? Ripple.propTypes = {
324
- /**
325
- * Override or extend the styles applied to the component.
326
- */
327
- classes: PropTypes.object.isRequired,
328
- className: PropTypes.string,
329
- /**
330
- * @ignore - injected from TransitionGroup
331
- */
332
- in: PropTypes.bool,
333
- /**
334
- * @ignore - injected from TransitionGroup
335
- */
336
- onExited: PropTypes.func,
337
- /**
338
- * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.
339
- */
340
- pulsate: PropTypes.bool,
341
- /**
342
- * Diameter of the ripple.
343
- */
344
- rippleSize: PropTypes.number,
345
- /**
346
- * Horizontal position of the ripple center.
347
- */
348
- rippleX: PropTypes.number,
349
- /**
350
- * Vertical position of the ripple center.
351
- */
352
- rippleY: PropTypes.number,
353
- /**
354
- * exit delay
355
- */
356
- timeout: PropTypes.number.isRequired
357
- } : void 0;
358
- const touchRippleClasses = generateUtilityClasses("MuiTouchRipple", ["root", "ripple", "rippleVisible", "ripplePulsate", "child", "childLeaving", "childPulsate"]);
359
- const _excluded$4 = ["center", "classes", "className"];
360
- let _ = (t) => t, _t, _t2, _t3, _t4;
361
- const DURATION = 550;
362
- const DELAY_RIPPLE = 80;
363
- const enterKeyframe = keyframes(_t || (_t = _`
364
- 0% {
365
- transform: scale(0);
366
- opacity: 0.1;
367
- }
368
-
369
- 100% {
370
- transform: scale(1);
371
- opacity: 0.3;
372
- }
373
- `));
374
- const exitKeyframe = keyframes(_t2 || (_t2 = _`
375
- 0% {
376
- opacity: 1;
377
- }
378
-
379
- 100% {
380
- opacity: 0;
381
- }
382
- `));
383
- const pulsateKeyframe = keyframes(_t3 || (_t3 = _`
384
- 0% {
385
- transform: scale(1);
386
- }
387
-
388
- 50% {
389
- transform: scale(0.92);
390
- }
391
-
392
- 100% {
393
- transform: scale(1);
394
- }
395
- `));
396
- const TouchRippleRoot = styled("span", {
397
- name: "MuiTouchRipple",
398
- slot: "Root"
399
- })({
400
- overflow: "hidden",
401
- pointerEvents: "none",
402
- position: "absolute",
403
- zIndex: 0,
404
- top: 0,
405
- right: 0,
406
- bottom: 0,
407
- left: 0,
408
- borderRadius: "inherit"
409
- });
410
- const TouchRippleRipple = styled(Ripple, {
411
- name: "MuiTouchRipple",
412
- slot: "Ripple"
413
- })(_t4 || (_t4 = _`
414
- opacity: 0;
415
- position: absolute;
416
-
417
- &.${0} {
418
- opacity: 0.3;
419
- transform: scale(1);
420
- animation-name: ${0};
421
- animation-duration: ${0}ms;
422
- animation-timing-function: ${0};
423
- }
424
-
425
- &.${0} {
426
- animation-duration: ${0}ms;
427
- }
428
-
429
- & .${0} {
430
- opacity: 1;
431
- display: block;
432
- width: 100%;
433
- height: 100%;
434
- border-radius: 50%;
435
- background-color: currentColor;
436
- }
437
-
438
- & .${0} {
439
- opacity: 0;
440
- animation-name: ${0};
441
- animation-duration: ${0}ms;
442
- animation-timing-function: ${0};
443
- }
444
-
445
- & .${0} {
446
- position: absolute;
447
- /* @noflip */
448
- left: 0px;
449
- top: 0;
450
- animation-name: ${0};
451
- animation-duration: 2500ms;
452
- animation-timing-function: ${0};
453
- animation-iteration-count: infinite;
454
- animation-delay: 200ms;
455
- }
456
- `), touchRippleClasses.rippleVisible, enterKeyframe, DURATION, ({
457
- theme
458
- }) => theme.transitions.easing.easeInOut, touchRippleClasses.ripplePulsate, ({
459
- theme
460
- }) => theme.transitions.duration.shorter, touchRippleClasses.child, touchRippleClasses.childLeaving, exitKeyframe, DURATION, ({
461
- theme
462
- }) => theme.transitions.easing.easeInOut, touchRippleClasses.childPulsate, pulsateKeyframe, ({
463
- theme
464
- }) => theme.transitions.easing.easeInOut);
465
- const TouchRipple = /* @__PURE__ */ React.forwardRef(function TouchRipple2(inProps, ref) {
466
- const props = useDefaultProps({
467
- props: inProps,
468
- name: "MuiTouchRipple"
469
- });
470
- const {
471
- center: centerProp = false,
472
- classes = {},
473
- className
474
- } = props, other = _objectWithoutPropertiesLoose(props, _excluded$4);
475
- const [ripples, setRipples] = React.useState([]);
476
- const nextKey = React.useRef(0);
477
- const rippleCallback = React.useRef(null);
478
- React.useEffect(() => {
479
- if (rippleCallback.current) {
480
- rippleCallback.current();
481
- rippleCallback.current = null;
482
- }
483
- }, [ripples]);
484
- const ignoringMouseDown = React.useRef(false);
485
- const startTimer = useTimeout();
486
- const startTimerCommit = React.useRef(null);
487
- const container = React.useRef(null);
488
- const startCommit = React.useCallback((params) => {
489
- const {
490
- pulsate: pulsate2,
491
- rippleX,
492
- rippleY,
493
- rippleSize,
494
- cb
495
- } = params;
496
- setRipples((oldRipples) => [...oldRipples, /* @__PURE__ */ jsx(TouchRippleRipple, {
497
- classes: {
498
- ripple: clsx(classes.ripple, touchRippleClasses.ripple),
499
- rippleVisible: clsx(classes.rippleVisible, touchRippleClasses.rippleVisible),
500
- ripplePulsate: clsx(classes.ripplePulsate, touchRippleClasses.ripplePulsate),
501
- child: clsx(classes.child, touchRippleClasses.child),
502
- childLeaving: clsx(classes.childLeaving, touchRippleClasses.childLeaving),
503
- childPulsate: clsx(classes.childPulsate, touchRippleClasses.childPulsate)
504
- },
505
- timeout: DURATION,
506
- pulsate: pulsate2,
507
- rippleX,
508
- rippleY,
509
- rippleSize
510
- }, nextKey.current)]);
511
- nextKey.current += 1;
512
- rippleCallback.current = cb;
513
- }, [classes]);
514
- const start = React.useCallback((event = {}, options = {}, cb = () => {
515
- }) => {
516
- const {
517
- pulsate: pulsate2 = false,
518
- center = centerProp || options.pulsate,
519
- fakeElement = false
520
- // For test purposes
521
- } = options;
522
- if ((event == null ? void 0 : event.type) === "mousedown" && ignoringMouseDown.current) {
523
- ignoringMouseDown.current = false;
524
- return;
525
- }
526
- if ((event == null ? void 0 : event.type) === "touchstart") {
527
- ignoringMouseDown.current = true;
528
- }
529
- const element = fakeElement ? null : container.current;
530
- const rect = element ? element.getBoundingClientRect() : {
531
- width: 0,
532
- height: 0,
533
- left: 0,
534
- top: 0
535
- };
536
- let rippleX;
537
- let rippleY;
538
- let rippleSize;
539
- if (center || event === void 0 || event.clientX === 0 && event.clientY === 0 || !event.clientX && !event.touches) {
540
- rippleX = Math.round(rect.width / 2);
541
- rippleY = Math.round(rect.height / 2);
542
- } else {
543
- const {
544
- clientX,
545
- clientY
546
- } = event.touches && event.touches.length > 0 ? event.touches[0] : event;
547
- rippleX = Math.round(clientX - rect.left);
548
- rippleY = Math.round(clientY - rect.top);
549
- }
550
- if (center) {
551
- rippleSize = Math.sqrt((2 * rect.width ** 2 + rect.height ** 2) / 3);
552
- if (rippleSize % 2 === 0) {
553
- rippleSize += 1;
554
- }
555
- } else {
556
- const sizeX = Math.max(Math.abs((element ? element.clientWidth : 0) - rippleX), rippleX) * 2 + 2;
557
- const sizeY = Math.max(Math.abs((element ? element.clientHeight : 0) - rippleY), rippleY) * 2 + 2;
558
- rippleSize = Math.sqrt(sizeX ** 2 + sizeY ** 2);
559
- }
560
- if (event != null && event.touches) {
561
- if (startTimerCommit.current === null) {
562
- startTimerCommit.current = () => {
563
- startCommit({
564
- pulsate: pulsate2,
565
- rippleX,
566
- rippleY,
567
- rippleSize,
568
- cb
569
- });
570
- };
571
- startTimer.start(DELAY_RIPPLE, () => {
572
- if (startTimerCommit.current) {
573
- startTimerCommit.current();
574
- startTimerCommit.current = null;
575
- }
576
- });
577
- }
578
- } else {
579
- startCommit({
580
- pulsate: pulsate2,
581
- rippleX,
582
- rippleY,
583
- rippleSize,
584
- cb
585
- });
586
- }
587
- }, [centerProp, startCommit, startTimer]);
588
- const pulsate = React.useCallback(() => {
589
- start({}, {
590
- pulsate: true
591
- });
592
- }, [start]);
593
- const stop = React.useCallback((event, cb) => {
594
- startTimer.clear();
595
- if ((event == null ? void 0 : event.type) === "touchend" && startTimerCommit.current) {
596
- startTimerCommit.current();
597
- startTimerCommit.current = null;
598
- startTimer.start(0, () => {
599
- stop(event, cb);
600
- });
601
- return;
602
- }
603
- startTimerCommit.current = null;
604
- setRipples((oldRipples) => {
605
- if (oldRipples.length > 0) {
606
- return oldRipples.slice(1);
607
- }
608
- return oldRipples;
609
- });
610
- rippleCallback.current = cb;
611
- }, [startTimer]);
612
- React.useImperativeHandle(ref, () => ({
613
- pulsate,
614
- start,
615
- stop
616
- }), [pulsate, start, stop]);
617
- return /* @__PURE__ */ jsx(TouchRippleRoot, _extends({
618
- className: clsx(touchRippleClasses.root, classes.root, className),
619
- ref: container
620
- }, other, {
621
- children: /* @__PURE__ */ jsx(TransitionGroup, {
622
- component: null,
623
- exit: true,
624
- children: ripples
625
- })
626
- }));
627
- });
628
- process$1.env.NODE_ENV !== "production" ? TouchRipple.propTypes = {
629
- /**
630
- * If `true`, the ripple starts at the center of the component
631
- * rather than at the point of interaction.
632
- */
633
- center: PropTypes.bool,
634
- /**
635
- * Override or extend the styles applied to the component.
636
- */
637
- classes: PropTypes.object,
638
- /**
639
- * @ignore
640
- */
641
- className: PropTypes.string
642
- } : void 0;
643
- function getButtonBaseUtilityClass(slot) {
644
- return generateUtilityClass("MuiButtonBase", slot);
645
- }
646
- const buttonBaseClasses = generateUtilityClasses("MuiButtonBase", ["root", "disabled", "focusVisible"]);
647
- const _excluded$3 = ["action", "centerRipple", "children", "className", "component", "disabled", "disableRipple", "disableTouchRipple", "focusRipple", "focusVisibleClassName", "LinkComponent", "onBlur", "onClick", "onContextMenu", "onDragLeave", "onFocus", "onFocusVisible", "onKeyDown", "onKeyUp", "onMouseDown", "onMouseLeave", "onMouseUp", "onTouchEnd", "onTouchMove", "onTouchStart", "tabIndex", "TouchRippleProps", "touchRippleRef", "type"];
648
- const useUtilityClasses$2 = (ownerState) => {
649
- const {
650
- disabled,
651
- focusVisible,
652
- focusVisibleClassName,
653
- classes
654
- } = ownerState;
655
- const slots = {
656
- root: ["root", disabled && "disabled", focusVisible && "focusVisible"]
657
- };
658
- const composedClasses = composeClasses(slots, getButtonBaseUtilityClass, classes);
659
- if (focusVisible && focusVisibleClassName) {
660
- composedClasses.root += ` ${focusVisibleClassName}`;
661
- }
662
- return composedClasses;
663
- };
664
- const ButtonBaseRoot = styled("button", {
665
- name: "MuiButtonBase",
666
- slot: "Root",
667
- overridesResolver: (props, styles2) => styles2.root
668
- })({
669
- display: "inline-flex",
670
- alignItems: "center",
671
- justifyContent: "center",
672
- position: "relative",
673
- boxSizing: "border-box",
674
- WebkitTapHighlightColor: "transparent",
675
- backgroundColor: "transparent",
676
- // Reset default value
677
- // We disable the focus ring for mouse, touch and keyboard users.
678
- outline: 0,
679
- border: 0,
680
- margin: 0,
681
- // Remove the margin in Safari
682
- borderRadius: 0,
683
- padding: 0,
684
- // Remove the padding in Firefox
685
- cursor: "pointer",
686
- userSelect: "none",
687
- verticalAlign: "middle",
688
- MozAppearance: "none",
689
- // Reset
690
- WebkitAppearance: "none",
691
- // Reset
692
- textDecoration: "none",
693
- // So we take precedent over the style of a native <a /> element.
694
- color: "inherit",
695
- "&::-moz-focus-inner": {
696
- borderStyle: "none"
697
- // Remove Firefox dotted outline.
698
- },
699
- [`&.${buttonBaseClasses.disabled}`]: {
700
- pointerEvents: "none",
701
- // Disable link interactions
702
- cursor: "default"
703
- },
704
- "@media print": {
705
- colorAdjust: "exact"
706
- }
707
- });
708
- const ButtonBase = /* @__PURE__ */ React.forwardRef(function ButtonBase2(inProps, ref) {
709
- const props = useDefaultProps({
710
- props: inProps,
711
- name: "MuiButtonBase"
712
- });
713
- const {
714
- action,
715
- centerRipple = false,
716
- children,
717
- className,
718
- component = "button",
719
- disabled = false,
720
- disableRipple = false,
721
- disableTouchRipple = false,
722
- focusRipple = false,
723
- LinkComponent = "a",
724
- onBlur,
725
- onClick,
726
- onContextMenu,
727
- onDragLeave,
728
- onFocus,
729
- onFocusVisible,
730
- onKeyDown,
731
- onKeyUp,
732
- onMouseDown,
733
- onMouseLeave,
734
- onMouseUp,
735
- onTouchEnd,
736
- onTouchMove,
737
- onTouchStart,
738
- tabIndex = 0,
739
- TouchRippleProps,
740
- touchRippleRef,
741
- type
742
- } = props, other = _objectWithoutPropertiesLoose(props, _excluded$3);
743
- const buttonRef = React.useRef(null);
744
- const rippleRef = React.useRef(null);
745
- const handleRippleRef = useForkRef(rippleRef, touchRippleRef);
746
- const {
747
- isFocusVisibleRef,
748
- onFocus: handleFocusVisible,
749
- onBlur: handleBlurVisible,
750
- ref: focusVisibleRef
751
- } = useIsFocusVisible();
752
- const [focusVisible, setFocusVisible] = React.useState(false);
753
- if (disabled && focusVisible) {
754
- setFocusVisible(false);
755
- }
756
- React.useImperativeHandle(action, () => ({
757
- focusVisible: () => {
758
- setFocusVisible(true);
759
- buttonRef.current.focus();
760
- }
761
- }), []);
762
- const [mountedState, setMountedState] = React.useState(false);
763
- React.useEffect(() => {
764
- setMountedState(true);
765
- }, []);
766
- const enableTouchRipple = mountedState && !disableRipple && !disabled;
767
- React.useEffect(() => {
768
- if (focusVisible && focusRipple && !disableRipple && mountedState) {
769
- rippleRef.current.pulsate();
770
- }
771
- }, [disableRipple, focusRipple, focusVisible, mountedState]);
772
- function useRippleHandler(rippleAction, eventCallback, skipRippleAction = disableTouchRipple) {
773
- return useEventCallback((event) => {
774
- if (eventCallback) {
775
- eventCallback(event);
776
- }
777
- const ignore = skipRippleAction;
778
- if (!ignore && rippleRef.current) {
779
- rippleRef.current[rippleAction](event);
780
- }
781
- return true;
782
- });
783
- }
784
- const handleMouseDown = useRippleHandler("start", onMouseDown);
785
- const handleContextMenu = useRippleHandler("stop", onContextMenu);
786
- const handleDragLeave = useRippleHandler("stop", onDragLeave);
787
- const handleMouseUp = useRippleHandler("stop", onMouseUp);
788
- const handleMouseLeave = useRippleHandler("stop", (event) => {
789
- if (focusVisible) {
790
- event.preventDefault();
791
- }
792
- if (onMouseLeave) {
793
- onMouseLeave(event);
794
- }
795
- });
796
- const handleTouchStart = useRippleHandler("start", onTouchStart);
797
- const handleTouchEnd = useRippleHandler("stop", onTouchEnd);
798
- const handleTouchMove = useRippleHandler("stop", onTouchMove);
799
- const handleBlur = useRippleHandler("stop", (event) => {
800
- handleBlurVisible(event);
801
- if (isFocusVisibleRef.current === false) {
802
- setFocusVisible(false);
803
- }
804
- if (onBlur) {
805
- onBlur(event);
806
- }
807
- }, false);
808
- const handleFocus = useEventCallback((event) => {
809
- if (!buttonRef.current) {
810
- buttonRef.current = event.currentTarget;
811
- }
812
- handleFocusVisible(event);
813
- if (isFocusVisibleRef.current === true) {
814
- setFocusVisible(true);
815
- if (onFocusVisible) {
816
- onFocusVisible(event);
817
- }
818
- }
819
- if (onFocus) {
820
- onFocus(event);
821
- }
822
- });
823
- const isNonNativeButton = () => {
824
- const button = buttonRef.current;
825
- return component && component !== "button" && !(button.tagName === "A" && button.href);
826
- };
827
- const keydownRef = React.useRef(false);
828
- const handleKeyDown = useEventCallback((event) => {
829
- if (focusRipple && !keydownRef.current && focusVisible && rippleRef.current && event.key === " ") {
830
- keydownRef.current = true;
831
- rippleRef.current.stop(event, () => {
832
- rippleRef.current.start(event);
833
- });
834
- }
835
- if (event.target === event.currentTarget && isNonNativeButton() && event.key === " ") {
836
- event.preventDefault();
837
- }
838
- if (onKeyDown) {
839
- onKeyDown(event);
840
- }
841
- if (event.target === event.currentTarget && isNonNativeButton() && event.key === "Enter" && !disabled) {
842
- event.preventDefault();
843
- if (onClick) {
844
- onClick(event);
845
- }
846
- }
847
- });
848
- const handleKeyUp = useEventCallback((event) => {
849
- if (focusRipple && event.key === " " && rippleRef.current && focusVisible && !event.defaultPrevented) {
850
- keydownRef.current = false;
851
- rippleRef.current.stop(event, () => {
852
- rippleRef.current.pulsate(event);
853
- });
854
- }
855
- if (onKeyUp) {
856
- onKeyUp(event);
857
- }
858
- if (onClick && event.target === event.currentTarget && isNonNativeButton() && event.key === " " && !event.defaultPrevented) {
859
- onClick(event);
860
- }
861
- });
862
- let ComponentProp = component;
863
- if (ComponentProp === "button" && (other.href || other.to)) {
864
- ComponentProp = LinkComponent;
865
- }
866
- const buttonProps = {};
867
- if (ComponentProp === "button") {
868
- buttonProps.type = type === void 0 ? "button" : type;
869
- buttonProps.disabled = disabled;
870
- } else {
871
- if (!other.href && !other.to) {
872
- buttonProps.role = "button";
873
- }
874
- if (disabled) {
875
- buttonProps["aria-disabled"] = disabled;
876
- }
877
- }
878
- const handleRef = useForkRef(ref, focusVisibleRef, buttonRef);
879
- if (process$1.env.NODE_ENV !== "production") {
880
- React.useEffect(() => {
881
- if (enableTouchRipple && !rippleRef.current) {
882
- }
883
- }, [enableTouchRipple]);
884
- }
885
- const ownerState = _extends({}, props, {
886
- centerRipple,
887
- component,
888
- disabled,
889
- disableRipple,
890
- disableTouchRipple,
891
- focusRipple,
892
- tabIndex,
893
- focusVisible
894
- });
895
- const classes = useUtilityClasses$2(ownerState);
896
- return /* @__PURE__ */ jsxs(ButtonBaseRoot, _extends({
897
- as: ComponentProp,
898
- className: clsx(classes.root, className),
899
- ownerState,
900
- onBlur: handleBlur,
901
- onClick,
902
- onContextMenu: handleContextMenu,
903
- onFocus: handleFocus,
904
- onKeyDown: handleKeyDown,
905
- onKeyUp: handleKeyUp,
906
- onMouseDown: handleMouseDown,
907
- onMouseLeave: handleMouseLeave,
908
- onMouseUp: handleMouseUp,
909
- onDragLeave: handleDragLeave,
910
- onTouchEnd: handleTouchEnd,
911
- onTouchMove: handleTouchMove,
912
- onTouchStart: handleTouchStart,
913
- ref: handleRef,
914
- tabIndex: disabled ? -1 : tabIndex,
915
- type
916
- }, buttonProps, other, {
917
- children: [children, enableTouchRipple ? (
918
- /* TouchRipple is only needed client-side, x2 boost on the server. */
919
- /* @__PURE__ */ jsx(TouchRipple, _extends({
920
- ref: handleRippleRef,
921
- center: centerRipple
922
- }, TouchRippleProps))
923
- ) : null]
924
- }));
925
- });
926
- process$1.env.NODE_ENV !== "production" ? ButtonBase.propTypes = {
927
- // ┌────────────────────────────── Warning ──────────────────────────────┐
928
- // │ These PropTypes are generated from the TypeScript type definitions. │
929
- // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
930
- // └─────────────────────────────────────────────────────────────────────┘
931
- /**
932
- * A ref for imperative actions.
933
- * It currently only supports `focusVisible()` action.
934
- */
935
- action: refType,
936
- /**
937
- * If `true`, the ripples are centered.
938
- * They won't start at the cursor interaction position.
939
- * @default false
940
- */
941
- centerRipple: PropTypes.bool,
942
- /**
943
- * The content of the component.
944
- */
945
- children: PropTypes.node,
946
- /**
947
- * Override or extend the styles applied to the component.
948
- */
949
- classes: PropTypes.object,
950
- /**
951
- * @ignore
952
- */
953
- className: PropTypes.string,
954
- /**
955
- * The component used for the root node.
956
- * Either a string to use a HTML element or a component.
957
- */
958
- component: elementTypeAcceptingRef$1,
959
- /**
960
- * If `true`, the component is disabled.
961
- * @default false
962
- */
963
- disabled: PropTypes.bool,
964
- /**
965
- * If `true`, the ripple effect is disabled.
966
- *
967
- * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
968
- * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
969
- * @default false
970
- */
971
- disableRipple: PropTypes.bool,
972
- /**
973
- * If `true`, the touch ripple effect is disabled.
974
- * @default false
975
- */
976
- disableTouchRipple: PropTypes.bool,
977
- /**
978
- * If `true`, the base button will have a keyboard focus ripple.
979
- * @default false
980
- */
981
- focusRipple: PropTypes.bool,
982
- /**
983
- * This prop can help identify which element has keyboard focus.
984
- * The class name will be applied when the element gains the focus through keyboard interaction.
985
- * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
986
- * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
987
- * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
988
- * if needed.
989
- */
990
- focusVisibleClassName: PropTypes.string,
991
- /**
992
- * @ignore
993
- */
994
- href: PropTypes.any,
995
- /**
996
- * The component used to render a link when the `href` prop is provided.
997
- * @default 'a'
998
- */
999
- LinkComponent: PropTypes.elementType,
1000
- /**
1001
- * @ignore
1002
- */
1003
- onBlur: PropTypes.func,
1004
- /**
1005
- * @ignore
1006
- */
1007
- onClick: PropTypes.func,
1008
- /**
1009
- * @ignore
1010
- */
1011
- onContextMenu: PropTypes.func,
1012
- /**
1013
- * @ignore
1014
- */
1015
- onDragLeave: PropTypes.func,
1016
- /**
1017
- * @ignore
1018
- */
1019
- onFocus: PropTypes.func,
1020
- /**
1021
- * Callback fired when the component is focused with a keyboard.
1022
- * We trigger a `onFocus` callback too.
1023
- */
1024
- onFocusVisible: PropTypes.func,
1025
- /**
1026
- * @ignore
1027
- */
1028
- onKeyDown: PropTypes.func,
1029
- /**
1030
- * @ignore
1031
- */
1032
- onKeyUp: PropTypes.func,
1033
- /**
1034
- * @ignore
1035
- */
1036
- onMouseDown: PropTypes.func,
1037
- /**
1038
- * @ignore
1039
- */
1040
- onMouseLeave: PropTypes.func,
1041
- /**
1042
- * @ignore
1043
- */
1044
- onMouseUp: PropTypes.func,
1045
- /**
1046
- * @ignore
1047
- */
1048
- onTouchEnd: PropTypes.func,
1049
- /**
1050
- * @ignore
1051
- */
1052
- onTouchMove: PropTypes.func,
1053
- /**
1054
- * @ignore
1055
- */
1056
- onTouchStart: PropTypes.func,
1057
- /**
1058
- * The system prop that allows defining system overrides as well as additional CSS styles.
1059
- */
1060
- sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
1061
- /**
1062
- * @default 0
1063
- */
1064
- tabIndex: PropTypes.number,
1065
- /**
1066
- * Props applied to the `TouchRipple` element.
1067
- */
1068
- TouchRippleProps: PropTypes.object,
1069
- /**
1070
- * A ref that points to the `TouchRipple` element.
1071
- */
1072
- touchRippleRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
1073
- current: PropTypes.shape({
1074
- pulsate: PropTypes.func.isRequired,
1075
- start: PropTypes.func.isRequired,
1076
- stop: PropTypes.func.isRequired
1077
- })
1078
- })]),
1079
- /**
1080
- * @ignore
1081
- */
1082
- type: PropTypes.oneOfType([PropTypes.oneOf(["button", "reset", "submit"]), PropTypes.string])
1083
- } : void 0;
1084
- const _excluded$2 = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
1085
- const styles = {
1086
- entering: {
1087
- opacity: 1
1088
- },
1089
- entered: {
1090
- opacity: 1
1091
- }
1092
- };
1093
- const Fade = /* @__PURE__ */ React.forwardRef(function Fade2(props, ref) {
1094
- const theme = useTheme();
1095
- const defaultTimeout = {
1096
- enter: theme.transitions.duration.enteringScreen,
1097
- exit: theme.transitions.duration.leavingScreen
1098
- };
1099
- const {
1100
- addEndListener,
1101
- appear = true,
1102
- children,
1103
- easing,
1104
- in: inProp,
1105
- onEnter,
1106
- onEntered,
1107
- onEntering,
1108
- onExit,
1109
- onExited,
1110
- onExiting,
1111
- style,
1112
- timeout = defaultTimeout,
1113
- // eslint-disable-next-line react/prop-types
1114
- TransitionComponent = Transition
1115
- } = props, other = _objectWithoutPropertiesLoose(props, _excluded$2);
1116
- const nodeRef = React.useRef(null);
1117
- const handleRef = useForkRef(nodeRef, getReactElementRef(children), ref);
1118
- const normalizedTransitionCallback = (callback) => (maybeIsAppearing) => {
1119
- if (callback) {
1120
- const node = nodeRef.current;
1121
- if (maybeIsAppearing === void 0) {
1122
- callback(node);
1123
- } else {
1124
- callback(node, maybeIsAppearing);
1125
- }
1126
- }
1127
- };
1128
- const handleEntering = normalizedTransitionCallback(onEntering);
1129
- const handleEnter = normalizedTransitionCallback((node, isAppearing) => {
1130
- reflow(node);
1131
- const transitionProps = getTransitionProps({
1132
- style,
1133
- timeout,
1134
- easing
1135
- }, {
1136
- mode: "enter"
1137
- });
1138
- node.style.webkitTransition = theme.transitions.create("opacity", transitionProps);
1139
- node.style.transition = theme.transitions.create("opacity", transitionProps);
1140
- if (onEnter) {
1141
- onEnter(node, isAppearing);
1142
- }
1143
- });
1144
- const handleEntered = normalizedTransitionCallback(onEntered);
1145
- const handleExiting = normalizedTransitionCallback(onExiting);
1146
- const handleExit = normalizedTransitionCallback((node) => {
1147
- const transitionProps = getTransitionProps({
1148
- style,
1149
- timeout,
1150
- easing
1151
- }, {
1152
- mode: "exit"
1153
- });
1154
- node.style.webkitTransition = theme.transitions.create("opacity", transitionProps);
1155
- node.style.transition = theme.transitions.create("opacity", transitionProps);
1156
- if (onExit) {
1157
- onExit(node);
1158
- }
1159
- });
1160
- const handleExited = normalizedTransitionCallback(onExited);
1161
- const handleAddEndListener = (next) => {
1162
- if (addEndListener) {
1163
- addEndListener(nodeRef.current, next);
1164
- }
1165
- };
1166
- return /* @__PURE__ */ jsx(TransitionComponent, _extends({
1167
- appear,
1168
- in: inProp,
1169
- nodeRef,
1170
- onEnter: handleEnter,
1171
- onEntered: handleEntered,
1172
- onEntering: handleEntering,
1173
- onExit: handleExit,
1174
- onExited: handleExited,
1175
- onExiting: handleExiting,
1176
- addEndListener: handleAddEndListener,
1177
- timeout
1178
- }, other, {
1179
- children: (state, childProps) => {
1180
- return /* @__PURE__ */ React.cloneElement(children, _extends({
1181
- style: _extends({
1182
- opacity: 0,
1183
- visibility: state === "exited" && !inProp ? "hidden" : void 0
1184
- }, styles[state], style, children.props.style),
1185
- ref: handleRef
1186
- }, childProps));
1187
- }
1188
- }));
1189
- });
1190
- process$1.env.NODE_ENV !== "production" ? Fade.propTypes = {
1191
- // ┌────────────────────────────── Warning ──────────────────────────────┐
1192
- // │ These PropTypes are generated from the TypeScript type definitions. │
1193
- // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
1194
- // └─────────────────────────────────────────────────────────────────────┘
1195
- /**
1196
- * Add a custom transition end trigger. Called with the transitioning DOM
1197
- * node and a done callback. Allows for more fine grained transition end
1198
- * logic. Note: Timeouts are still used as a fallback if provided.
1199
- */
1200
- addEndListener: PropTypes.func,
1201
- /**
1202
- * Perform the enter transition when it first mounts if `in` is also `true`.
1203
- * Set this to `false` to disable this behavior.
1204
- * @default true
1205
- */
1206
- appear: PropTypes.bool,
1207
- /**
1208
- * A single child content element.
1209
- */
1210
- children: elementAcceptingRef.isRequired,
1211
- /**
1212
- * The transition timing function.
1213
- * You may specify a single easing or a object containing enter and exit values.
1214
- */
1215
- easing: PropTypes.oneOfType([PropTypes.shape({
1216
- enter: PropTypes.string,
1217
- exit: PropTypes.string
1218
- }), PropTypes.string]),
1219
- /**
1220
- * If `true`, the component will transition in.
1221
- */
1222
- in: PropTypes.bool,
1223
- /**
1224
- * @ignore
1225
- */
1226
- onEnter: PropTypes.func,
1227
- /**
1228
- * @ignore
1229
- */
1230
- onEntered: PropTypes.func,
1231
- /**
1232
- * @ignore
1233
- */
1234
- onEntering: PropTypes.func,
1235
- /**
1236
- * @ignore
1237
- */
1238
- onExit: PropTypes.func,
1239
- /**
1240
- * @ignore
1241
- */
1242
- onExited: PropTypes.func,
1243
- /**
1244
- * @ignore
1245
- */
1246
- onExiting: PropTypes.func,
1247
- /**
1248
- * @ignore
1249
- */
1250
- style: PropTypes.object,
1251
- /**
1252
- * The duration for the transition, in milliseconds.
1253
- * You may specify a single timeout for all transitions, or individually with an object.
1254
- * @default {
1255
- * enter: theme.transitions.duration.enteringScreen,
1256
- * exit: theme.transitions.duration.leavingScreen,
1257
- * }
1258
- */
1259
- timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
1260
- appear: PropTypes.number,
1261
- enter: PropTypes.number,
1262
- exit: PropTypes.number
1263
- })])
1264
- } : void 0;
1265
- function getBackdropUtilityClass(slot) {
1266
- return generateUtilityClass("MuiBackdrop", slot);
1267
- }
1268
- generateUtilityClasses("MuiBackdrop", ["root", "invisible"]);
1269
- const _excluded$1 = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"];
1270
- const useUtilityClasses$1 = (ownerState) => {
1271
- const {
1272
- classes,
1273
- invisible
1274
- } = ownerState;
1275
- const slots = {
1276
- root: ["root", invisible && "invisible"]
1277
- };
1278
- return composeClasses(slots, getBackdropUtilityClass, classes);
1279
- };
1280
- const BackdropRoot = styled("div", {
1281
- name: "MuiBackdrop",
1282
- slot: "Root",
1283
- overridesResolver: (props, styles2) => {
1284
- const {
1285
- ownerState
1286
- } = props;
1287
- return [styles2.root, ownerState.invisible && styles2.invisible];
1288
- }
1289
- })(({
1290
- ownerState
1291
- }) => _extends({
1292
- position: "fixed",
1293
- display: "flex",
1294
- alignItems: "center",
1295
- justifyContent: "center",
1296
- right: 0,
1297
- bottom: 0,
1298
- top: 0,
1299
- left: 0,
1300
- backgroundColor: "rgba(0, 0, 0, 0.5)",
1301
- WebkitTapHighlightColor: "transparent"
1302
- }, ownerState.invisible && {
1303
- backgroundColor: "transparent"
1304
- }));
1305
- const Backdrop = /* @__PURE__ */ React.forwardRef(function Backdrop2(inProps, ref) {
1306
- var _slotProps$root, _ref, _slots$root;
1307
- const props = useDefaultProps({
1308
- props: inProps,
1309
- name: "MuiBackdrop"
1310
- });
1311
- const {
1312
- children,
1313
- className,
1314
- component = "div",
1315
- components = {},
1316
- componentsProps = {},
1317
- invisible = false,
1318
- open,
1319
- slotProps = {},
1320
- slots = {},
1321
- TransitionComponent = Fade,
1322
- transitionDuration
1323
- } = props, other = _objectWithoutPropertiesLoose(props, _excluded$1);
1324
- const ownerState = _extends({}, props, {
1325
- component,
1326
- invisible
1327
- });
1328
- const classes = useUtilityClasses$1(ownerState);
1329
- const rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;
1330
- return /* @__PURE__ */ jsx(TransitionComponent, _extends({
1331
- in: open,
1332
- timeout: transitionDuration
1333
- }, other, {
1334
- children: /* @__PURE__ */ jsx(BackdropRoot, _extends({
1335
- "aria-hidden": true
1336
- }, rootSlotProps, {
1337
- as: (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : component,
1338
- className: clsx(classes.root, className, rootSlotProps == null ? void 0 : rootSlotProps.className),
1339
- ownerState: _extends({}, ownerState, rootSlotProps == null ? void 0 : rootSlotProps.ownerState),
1340
- classes,
1341
- ref,
1342
- children
1343
- }))
1344
- }));
1345
- });
1346
- process$1.env.NODE_ENV !== "production" ? Backdrop.propTypes = {
1347
- // ┌────────────────────────────── Warning ──────────────────────────────┐
1348
- // │ These PropTypes are generated from the TypeScript type definitions. │
1349
- // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
1350
- // └─────────────────────────────────────────────────────────────────────┘
1351
- /**
1352
- * The content of the component.
1353
- */
1354
- children: PropTypes.node,
1355
- /**
1356
- * Override or extend the styles applied to the component.
1357
- */
1358
- classes: PropTypes.object,
1359
- /**
1360
- * @ignore
1361
- */
1362
- className: PropTypes.string,
1363
- /**
1364
- * The component used for the root node.
1365
- * Either a string to use a HTML element or a component.
1366
- */
1367
- component: PropTypes.elementType,
1368
- /**
1369
- * The components used for each slot inside.
1370
- *
1371
- * This prop is an alias for the `slots` prop.
1372
- * It's recommended to use the `slots` prop instead.
1373
- *
1374
- * @default {}
1375
- */
1376
- components: PropTypes.shape({
1377
- Root: PropTypes.elementType
1378
- }),
1379
- /**
1380
- * The extra props for the slot components.
1381
- * You can override the existing props or add new ones.
1382
- *
1383
- * This prop is an alias for the `slotProps` prop.
1384
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
1385
- *
1386
- * @default {}
1387
- */
1388
- componentsProps: PropTypes.shape({
1389
- root: PropTypes.object
1390
- }),
1391
- /**
1392
- * If `true`, the backdrop is invisible.
1393
- * It can be used when rendering a popover or a custom select component.
1394
- * @default false
1395
- */
1396
- invisible: PropTypes.bool,
1397
- /**
1398
- * If `true`, the component is shown.
1399
- */
1400
- open: PropTypes.bool.isRequired,
1401
- /**
1402
- * The extra props for the slot components.
1403
- * You can override the existing props or add new ones.
1404
- *
1405
- * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
1406
- *
1407
- * @default {}
1408
- */
1409
- slotProps: PropTypes.shape({
1410
- root: PropTypes.object
1411
- }),
1412
- /**
1413
- * The components used for each slot inside.
1414
- *
1415
- * This prop is an alias for the `components` prop, which will be deprecated in the future.
1416
- *
1417
- * @default {}
1418
- */
1419
- slots: PropTypes.shape({
1420
- root: PropTypes.elementType
1421
- }),
1422
- /**
1423
- * The system prop that allows defining system overrides as well as additional CSS styles.
1424
- */
1425
- sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
1426
- /**
1427
- * The component used for the transition.
1428
- * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
1429
- * @default Fade
1430
- */
1431
- TransitionComponent: PropTypes.elementType,
1432
- /**
1433
- * The duration for the transition, in milliseconds.
1434
- * You may specify a single timeout for all transitions, or individually with an object.
1435
- */
1436
- transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
1437
- appear: PropTypes.number,
1438
- enter: PropTypes.number,
1439
- exit: PropTypes.number
1440
- })])
1441
- } : void 0;
1442
- function isOverflowing(container) {
1443
- const doc = ownerDocument(container);
1444
- if (doc.body === container) {
1445
- return ownerWindow(container).innerWidth > doc.documentElement.clientWidth;
1446
- }
1447
- return container.scrollHeight > container.clientHeight;
1448
- }
1449
- function ariaHidden(element, show) {
1450
- if (show) {
1451
- element.setAttribute("aria-hidden", "true");
1452
- } else {
1453
- element.removeAttribute("aria-hidden");
1454
- }
1455
- }
1456
- function getPaddingRight(element) {
1457
- return parseInt(ownerWindow(element).getComputedStyle(element).paddingRight, 10) || 0;
1458
- }
1459
- function isAriaHiddenForbiddenOnElement(element) {
1460
- const forbiddenTagNames = ["TEMPLATE", "SCRIPT", "STYLE", "LINK", "MAP", "META", "NOSCRIPT", "PICTURE", "COL", "COLGROUP", "PARAM", "SLOT", "SOURCE", "TRACK"];
1461
- const isForbiddenTagName = forbiddenTagNames.indexOf(element.tagName) !== -1;
1462
- const isInputHidden = element.tagName === "INPUT" && element.getAttribute("type") === "hidden";
1463
- return isForbiddenTagName || isInputHidden;
1464
- }
1465
- function ariaHiddenSiblings(container, mountElement, currentElement, elementsToExclude, show) {
1466
- const blacklist = [mountElement, currentElement, ...elementsToExclude];
1467
- [].forEach.call(container.children, (element) => {
1468
- const isNotExcludedElement = blacklist.indexOf(element) === -1;
1469
- const isNotForbiddenElement = !isAriaHiddenForbiddenOnElement(element);
1470
- if (isNotExcludedElement && isNotForbiddenElement) {
1471
- ariaHidden(element, show);
1472
- }
1473
- });
1474
- }
1475
- function findIndexOf(items, callback) {
1476
- let idx = -1;
1477
- items.some((item, index) => {
1478
- if (callback(item)) {
1479
- idx = index;
1480
- return true;
1481
- }
1482
- return false;
1483
- });
1484
- return idx;
1485
- }
1486
- function handleContainer(containerInfo, props) {
1487
- const restoreStyle = [];
1488
- const container = containerInfo.container;
1489
- if (!props.disableScrollLock) {
1490
- if (isOverflowing(container)) {
1491
- const scrollbarSize = getScrollbarSize(ownerDocument(container));
1492
- restoreStyle.push({
1493
- value: container.style.paddingRight,
1494
- property: "padding-right",
1495
- el: container
1496
- });
1497
- container.style.paddingRight = `${getPaddingRight(container) + scrollbarSize}px`;
1498
- const fixedElements = ownerDocument(container).querySelectorAll(".mui-fixed");
1499
- [].forEach.call(fixedElements, (element) => {
1500
- restoreStyle.push({
1501
- value: element.style.paddingRight,
1502
- property: "padding-right",
1503
- el: element
1504
- });
1505
- element.style.paddingRight = `${getPaddingRight(element) + scrollbarSize}px`;
1506
- });
1507
- }
1508
- let scrollContainer;
1509
- if (container.parentNode instanceof DocumentFragment) {
1510
- scrollContainer = ownerDocument(container).body;
1511
- } else {
1512
- const parent = container.parentElement;
1513
- const containerWindow = ownerWindow(container);
1514
- scrollContainer = (parent == null ? void 0 : parent.nodeName) === "HTML" && containerWindow.getComputedStyle(parent).overflowY === "scroll" ? parent : container;
1515
- }
1516
- restoreStyle.push({
1517
- value: scrollContainer.style.overflow,
1518
- property: "overflow",
1519
- el: scrollContainer
1520
- }, {
1521
- value: scrollContainer.style.overflowX,
1522
- property: "overflow-x",
1523
- el: scrollContainer
1524
- }, {
1525
- value: scrollContainer.style.overflowY,
1526
- property: "overflow-y",
1527
- el: scrollContainer
1528
- });
1529
- scrollContainer.style.overflow = "hidden";
1530
- }
1531
- const restore = () => {
1532
- restoreStyle.forEach(({
1533
- value,
1534
- el,
1535
- property
1536
- }) => {
1537
- if (value) {
1538
- el.style.setProperty(property, value);
1539
- } else {
1540
- el.style.removeProperty(property);
1541
- }
1542
- });
1543
- };
1544
- return restore;
1545
- }
1546
- function getHiddenSiblings(container) {
1547
- const hiddenSiblings = [];
1548
- [].forEach.call(container.children, (element) => {
1549
- if (element.getAttribute("aria-hidden") === "true") {
1550
- hiddenSiblings.push(element);
1551
- }
1552
- });
1553
- return hiddenSiblings;
1554
- }
1555
- class ModalManager {
1556
- constructor() {
1557
- this.containers = void 0;
1558
- this.modals = void 0;
1559
- this.modals = [];
1560
- this.containers = [];
1561
- }
1562
- add(modal, container) {
1563
- let modalIndex = this.modals.indexOf(modal);
1564
- if (modalIndex !== -1) {
1565
- return modalIndex;
1566
- }
1567
- modalIndex = this.modals.length;
1568
- this.modals.push(modal);
1569
- if (modal.modalRef) {
1570
- ariaHidden(modal.modalRef, false);
1571
- }
1572
- const hiddenSiblings = getHiddenSiblings(container);
1573
- ariaHiddenSiblings(container, modal.mount, modal.modalRef, hiddenSiblings, true);
1574
- const containerIndex = findIndexOf(this.containers, (item) => item.container === container);
1575
- if (containerIndex !== -1) {
1576
- this.containers[containerIndex].modals.push(modal);
1577
- return modalIndex;
1578
- }
1579
- this.containers.push({
1580
- modals: [modal],
1581
- container,
1582
- restore: null,
1583
- hiddenSiblings
1584
- });
1585
- return modalIndex;
1586
- }
1587
- mount(modal, props) {
1588
- const containerIndex = findIndexOf(this.containers, (item) => item.modals.indexOf(modal) !== -1);
1589
- const containerInfo = this.containers[containerIndex];
1590
- if (!containerInfo.restore) {
1591
- containerInfo.restore = handleContainer(containerInfo, props);
1592
- }
1593
- }
1594
- remove(modal, ariaHiddenState = true) {
1595
- const modalIndex = this.modals.indexOf(modal);
1596
- if (modalIndex === -1) {
1597
- return modalIndex;
1598
- }
1599
- const containerIndex = findIndexOf(this.containers, (item) => item.modals.indexOf(modal) !== -1);
1600
- const containerInfo = this.containers[containerIndex];
1601
- containerInfo.modals.splice(containerInfo.modals.indexOf(modal), 1);
1602
- this.modals.splice(modalIndex, 1);
1603
- if (containerInfo.modals.length === 0) {
1604
- if (containerInfo.restore) {
1605
- containerInfo.restore();
1606
- }
1607
- if (modal.modalRef) {
1608
- ariaHidden(modal.modalRef, ariaHiddenState);
1609
- }
1610
- ariaHiddenSiblings(containerInfo.container, modal.mount, modal.modalRef, containerInfo.hiddenSiblings, false);
1611
- this.containers.splice(containerIndex, 1);
1612
- } else {
1613
- const nextTop = containerInfo.modals[containerInfo.modals.length - 1];
1614
- if (nextTop.modalRef) {
1615
- ariaHidden(nextTop.modalRef, false);
1616
- }
1617
- }
1618
- return modalIndex;
1619
- }
1620
- isTopModal(modal) {
1621
- return this.modals.length > 0 && this.modals[this.modals.length - 1] === modal;
1622
- }
1623
- }
1624
- const candidatesSelector = ["input", "select", "textarea", "a[href]", "button", "[tabindex]", "audio[controls]", "video[controls]", '[contenteditable]:not([contenteditable="false"])'].join(",");
1625
- function getTabIndex(node) {
1626
- const tabindexAttr = parseInt(node.getAttribute("tabindex") || "", 10);
1627
- if (!Number.isNaN(tabindexAttr)) {
1628
- return tabindexAttr;
1629
- }
1630
- if (node.contentEditable === "true" || (node.nodeName === "AUDIO" || node.nodeName === "VIDEO" || node.nodeName === "DETAILS") && node.getAttribute("tabindex") === null) {
1631
- return 0;
1632
- }
1633
- return node.tabIndex;
1634
- }
1635
- function isNonTabbableRadio(node) {
1636
- if (node.tagName !== "INPUT" || node.type !== "radio") {
1637
- return false;
1638
- }
1639
- if (!node.name) {
1640
- return false;
1641
- }
1642
- const getRadio = (selector) => node.ownerDocument.querySelector(`input[type="radio"]${selector}`);
1643
- let roving = getRadio(`[name="${node.name}"]:checked`);
1644
- if (!roving) {
1645
- roving = getRadio(`[name="${node.name}"]`);
1646
- }
1647
- return roving !== node;
1648
- }
1649
- function isNodeMatchingSelectorFocusable(node) {
1650
- if (node.disabled || node.tagName === "INPUT" && node.type === "hidden" || isNonTabbableRadio(node)) {
1651
- return false;
1652
- }
1653
- return true;
1654
- }
1655
- function defaultGetTabbable(root) {
1656
- const regularTabNodes = [];
1657
- const orderedTabNodes = [];
1658
- Array.from(root.querySelectorAll(candidatesSelector)).forEach((node, i) => {
1659
- const nodeTabIndex = getTabIndex(node);
1660
- if (nodeTabIndex === -1 || !isNodeMatchingSelectorFocusable(node)) {
1661
- return;
1662
- }
1663
- if (nodeTabIndex === 0) {
1664
- regularTabNodes.push(node);
1665
- } else {
1666
- orderedTabNodes.push({
1667
- documentOrder: i,
1668
- tabIndex: nodeTabIndex,
1669
- node
1670
- });
1671
- }
1672
- });
1673
- return orderedTabNodes.sort((a, b) => a.tabIndex === b.tabIndex ? a.documentOrder - b.documentOrder : a.tabIndex - b.tabIndex).map((a) => a.node).concat(regularTabNodes);
1674
- }
1675
- function defaultIsEnabled() {
1676
- return true;
1677
- }
1678
- function FocusTrap(props) {
1679
- const {
1680
- children,
1681
- disableAutoFocus = false,
1682
- disableEnforceFocus = false,
1683
- disableRestoreFocus = false,
1684
- getTabbable = defaultGetTabbable,
1685
- isEnabled = defaultIsEnabled,
1686
- open
1687
- } = props;
1688
- const ignoreNextEnforceFocus = React.useRef(false);
1689
- const sentinelStart = React.useRef(null);
1690
- const sentinelEnd = React.useRef(null);
1691
- const nodeToRestore = React.useRef(null);
1692
- const reactFocusEventTarget = React.useRef(null);
1693
- const activated = React.useRef(false);
1694
- const rootRef = React.useRef(null);
1695
- const handleRef = useForkRef(getReactElementRef(children), rootRef);
1696
- const lastKeydown = React.useRef(null);
1697
- React.useEffect(() => {
1698
- if (!open || !rootRef.current) {
1699
- return;
1700
- }
1701
- activated.current = !disableAutoFocus;
1702
- }, [disableAutoFocus, open]);
1703
- React.useEffect(() => {
1704
- if (!open || !rootRef.current) {
1705
- return;
1706
- }
1707
- const doc = ownerDocument(rootRef.current);
1708
- if (!rootRef.current.contains(doc.activeElement)) {
1709
- if (!rootRef.current.hasAttribute("tabIndex")) {
1710
- if (process$1.env.NODE_ENV !== "production") {
1711
- }
1712
- rootRef.current.setAttribute("tabIndex", "-1");
1713
- }
1714
- if (activated.current) {
1715
- rootRef.current.focus();
1716
- }
1717
- }
1718
- return () => {
1719
- if (!disableRestoreFocus) {
1720
- if (nodeToRestore.current && nodeToRestore.current.focus) {
1721
- ignoreNextEnforceFocus.current = true;
1722
- nodeToRestore.current.focus();
1723
- }
1724
- nodeToRestore.current = null;
1725
- }
1726
- };
1727
- }, [open]);
1728
- React.useEffect(() => {
1729
- if (!open || !rootRef.current) {
1730
- return;
1731
- }
1732
- const doc = ownerDocument(rootRef.current);
1733
- const loopFocus = (nativeEvent) => {
1734
- lastKeydown.current = nativeEvent;
1735
- if (disableEnforceFocus || !isEnabled() || nativeEvent.key !== "Tab") {
1736
- return;
1737
- }
1738
- if (doc.activeElement === rootRef.current && nativeEvent.shiftKey) {
1739
- ignoreNextEnforceFocus.current = true;
1740
- if (sentinelEnd.current) {
1741
- sentinelEnd.current.focus();
1742
- }
1743
- }
1744
- };
1745
- const contain = () => {
1746
- const rootElement = rootRef.current;
1747
- if (rootElement === null) {
1748
- return;
1749
- }
1750
- if (!doc.hasFocus() || !isEnabled() || ignoreNextEnforceFocus.current) {
1751
- ignoreNextEnforceFocus.current = false;
1752
- return;
1753
- }
1754
- if (rootElement.contains(doc.activeElement)) {
1755
- return;
1756
- }
1757
- if (disableEnforceFocus && doc.activeElement !== sentinelStart.current && doc.activeElement !== sentinelEnd.current) {
1758
- return;
1759
- }
1760
- if (doc.activeElement !== reactFocusEventTarget.current) {
1761
- reactFocusEventTarget.current = null;
1762
- } else if (reactFocusEventTarget.current !== null) {
1763
- return;
1764
- }
1765
- if (!activated.current) {
1766
- return;
1767
- }
1768
- let tabbable = [];
1769
- if (doc.activeElement === sentinelStart.current || doc.activeElement === sentinelEnd.current) {
1770
- tabbable = getTabbable(rootRef.current);
1771
- }
1772
- if (tabbable.length > 0) {
1773
- var _lastKeydown$current, _lastKeydown$current2;
1774
- const isShiftTab = Boolean(((_lastKeydown$current = lastKeydown.current) == null ? void 0 : _lastKeydown$current.shiftKey) && ((_lastKeydown$current2 = lastKeydown.current) == null ? void 0 : _lastKeydown$current2.key) === "Tab");
1775
- const focusNext = tabbable[0];
1776
- const focusPrevious = tabbable[tabbable.length - 1];
1777
- if (typeof focusNext !== "string" && typeof focusPrevious !== "string") {
1778
- if (isShiftTab) {
1779
- focusPrevious.focus();
1780
- } else {
1781
- focusNext.focus();
1782
- }
1783
- }
1784
- } else {
1785
- rootElement.focus();
1786
- }
1787
- };
1788
- doc.addEventListener("focusin", contain);
1789
- doc.addEventListener("keydown", loopFocus, true);
1790
- const interval = setInterval(() => {
1791
- if (doc.activeElement && doc.activeElement.tagName === "BODY") {
1792
- contain();
1793
- }
1794
- }, 50);
1795
- return () => {
1796
- clearInterval(interval);
1797
- doc.removeEventListener("focusin", contain);
1798
- doc.removeEventListener("keydown", loopFocus, true);
1799
- };
1800
- }, [disableAutoFocus, disableEnforceFocus, disableRestoreFocus, isEnabled, open, getTabbable]);
1801
- const onFocus = (event) => {
1802
- if (nodeToRestore.current === null) {
1803
- nodeToRestore.current = event.relatedTarget;
1804
- }
1805
- activated.current = true;
1806
- reactFocusEventTarget.current = event.target;
1807
- const childrenPropsHandler = children.props.onFocus;
1808
- if (childrenPropsHandler) {
1809
- childrenPropsHandler(event);
1810
- }
1811
- };
1812
- const handleFocusSentinel = (event) => {
1813
- if (nodeToRestore.current === null) {
1814
- nodeToRestore.current = event.relatedTarget;
1815
- }
1816
- activated.current = true;
1817
- };
1818
- return /* @__PURE__ */ jsxs(React.Fragment, {
1819
- children: [/* @__PURE__ */ jsx("div", {
1820
- tabIndex: open ? 0 : -1,
1821
- onFocus: handleFocusSentinel,
1822
- ref: sentinelStart,
1823
- "data-testid": "sentinelStart"
1824
- }), /* @__PURE__ */ React.cloneElement(children, {
1825
- ref: handleRef,
1826
- onFocus
1827
- }), /* @__PURE__ */ jsx("div", {
1828
- tabIndex: open ? 0 : -1,
1829
- onFocus: handleFocusSentinel,
1830
- ref: sentinelEnd,
1831
- "data-testid": "sentinelEnd"
1832
- })]
1833
- });
1834
- }
1835
- process$1.env.NODE_ENV !== "production" ? FocusTrap.propTypes = {
1836
- // ┌────────────────────────────── Warning ──────────────────────────────┐
1837
- // │ These PropTypes are generated from the TypeScript type definitions. │
1838
- // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
1839
- // └─────────────────────────────────────────────────────────────────────┘
1840
- /**
1841
- * A single child content element.
1842
- */
1843
- children: elementAcceptingRef,
1844
- /**
1845
- * If `true`, the focus trap will not automatically shift focus to itself when it opens, and
1846
- * replace it to the last focused element when it closes.
1847
- * This also works correctly with any focus trap children that have the `disableAutoFocus` prop.
1848
- *
1849
- * Generally this should never be set to `true` as it makes the focus trap less
1850
- * accessible to assistive technologies, like screen readers.
1851
- * @default false
1852
- */
1853
- disableAutoFocus: PropTypes.bool,
1854
- /**
1855
- * If `true`, the focus trap will not prevent focus from leaving the focus trap while open.
1856
- *
1857
- * Generally this should never be set to `true` as it makes the focus trap less
1858
- * accessible to assistive technologies, like screen readers.
1859
- * @default false
1860
- */
1861
- disableEnforceFocus: PropTypes.bool,
1862
- /**
1863
- * If `true`, the focus trap will not restore focus to previously focused element once
1864
- * focus trap is hidden or unmounted.
1865
- * @default false
1866
- */
1867
- disableRestoreFocus: PropTypes.bool,
1868
- /**
1869
- * Returns an array of ordered tabbable nodes (i.e. in tab order) within the root.
1870
- * For instance, you can provide the "tabbable" npm dependency.
1871
- * @param {HTMLElement} root
1872
- */
1873
- getTabbable: PropTypes.func,
1874
- /**
1875
- * This prop extends the `open` prop.
1876
- * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop.
1877
- * This prop should be memoized.
1878
- * It can be used to support multiple focus trap mounted at the same time.
1879
- * @default function defaultIsEnabled(): boolean {
1880
- * return true;
1881
- * }
1882
- */
1883
- isEnabled: PropTypes.func,
1884
- /**
1885
- * If `true`, focus is locked.
1886
- */
1887
- open: PropTypes.bool.isRequired
1888
- } : void 0;
1889
- if (process$1.env.NODE_ENV !== "production") {
1890
- FocusTrap["propTypes"] = exactProp(FocusTrap.propTypes);
1891
- }
1892
- function getContainer(container) {
1893
- return typeof container === "function" ? container() : container;
1894
- }
1895
- function getHasTransition(children) {
1896
- return children ? children.props.hasOwnProperty("in") : false;
1897
- }
1898
- const defaultManager = new ModalManager();
1899
- function useModal(parameters) {
1900
- const {
1901
- container,
1902
- disableEscapeKeyDown = false,
1903
- disableScrollLock = false,
1904
- // @ts-ignore internal logic - Base UI supports the manager as a prop too
1905
- manager = defaultManager,
1906
- closeAfterTransition = false,
1907
- onTransitionEnter,
1908
- onTransitionExited,
1909
- children,
1910
- onClose,
1911
- open,
1912
- rootRef
1913
- } = parameters;
1914
- const modal = React.useRef({});
1915
- const mountNodeRef = React.useRef(null);
1916
- const modalRef = React.useRef(null);
1917
- const handleRef = useForkRef(modalRef, rootRef);
1918
- const [exited, setExited] = React.useState(!open);
1919
- const hasTransition = getHasTransition(children);
1920
- let ariaHiddenProp = true;
1921
- if (parameters["aria-hidden"] === "false" || parameters["aria-hidden"] === false) {
1922
- ariaHiddenProp = false;
1923
- }
1924
- const getDoc = () => ownerDocument(mountNodeRef.current);
1925
- const getModal = () => {
1926
- modal.current.modalRef = modalRef.current;
1927
- modal.current.mount = mountNodeRef.current;
1928
- return modal.current;
1929
- };
1930
- const handleMounted = () => {
1931
- manager.mount(getModal(), {
1932
- disableScrollLock
1933
- });
1934
- if (modalRef.current) {
1935
- modalRef.current.scrollTop = 0;
1936
- }
1937
- };
1938
- const handleOpen = useEventCallback(() => {
1939
- const resolvedContainer = getContainer(container) || getDoc().body;
1940
- manager.add(getModal(), resolvedContainer);
1941
- if (modalRef.current) {
1942
- handleMounted();
1943
- }
1944
- });
1945
- const isTopModal = React.useCallback(() => manager.isTopModal(getModal()), [manager]);
1946
- const handlePortalRef = useEventCallback((node) => {
1947
- mountNodeRef.current = node;
1948
- if (!node) {
1949
- return;
1950
- }
1951
- if (open && isTopModal()) {
1952
- handleMounted();
1953
- } else if (modalRef.current) {
1954
- ariaHidden(modalRef.current, ariaHiddenProp);
1955
- }
1956
- });
1957
- const handleClose = React.useCallback(() => {
1958
- manager.remove(getModal(), ariaHiddenProp);
1959
- }, [ariaHiddenProp, manager]);
1960
- React.useEffect(() => {
1961
- return () => {
1962
- handleClose();
1963
- };
1964
- }, [handleClose]);
1965
- React.useEffect(() => {
1966
- if (open) {
1967
- handleOpen();
1968
- } else if (!hasTransition || !closeAfterTransition) {
1969
- handleClose();
1970
- }
1971
- }, [open, handleClose, hasTransition, closeAfterTransition, handleOpen]);
1972
- const createHandleKeyDown = (otherHandlers) => (event) => {
1973
- var _otherHandlers$onKeyD;
1974
- (_otherHandlers$onKeyD = otherHandlers.onKeyDown) == null || _otherHandlers$onKeyD.call(otherHandlers, event);
1975
- if (event.key !== "Escape" || event.which === 229 || // Wait until IME is settled.
1976
- !isTopModal()) {
1977
- return;
1978
- }
1979
- if (!disableEscapeKeyDown) {
1980
- event.stopPropagation();
1981
- if (onClose) {
1982
- onClose(event, "escapeKeyDown");
1983
- }
1984
- }
1985
- };
1986
- const createHandleBackdropClick = (otherHandlers) => (event) => {
1987
- var _otherHandlers$onClic;
1988
- (_otherHandlers$onClic = otherHandlers.onClick) == null || _otherHandlers$onClic.call(otherHandlers, event);
1989
- if (event.target !== event.currentTarget) {
1990
- return;
1991
- }
1992
- if (onClose) {
1993
- onClose(event, "backdropClick");
1994
- }
1995
- };
1996
- const getRootProps = (otherHandlers = {}) => {
1997
- const propsEventHandlers = extractEventHandlers(parameters);
1998
- delete propsEventHandlers.onTransitionEnter;
1999
- delete propsEventHandlers.onTransitionExited;
2000
- const externalEventHandlers = _extends({}, propsEventHandlers, otherHandlers);
2001
- return _extends({
2002
- role: "presentation"
2003
- }, externalEventHandlers, {
2004
- onKeyDown: createHandleKeyDown(externalEventHandlers),
2005
- ref: handleRef
2006
- });
2007
- };
2008
- const getBackdropProps = (otherHandlers = {}) => {
2009
- const externalEventHandlers = otherHandlers;
2010
- return _extends({
2011
- "aria-hidden": true
2012
- }, externalEventHandlers, {
2013
- onClick: createHandleBackdropClick(externalEventHandlers),
2014
- open
2015
- });
2016
- };
2017
- const getTransitionProps2 = () => {
2018
- const handleEnter = () => {
2019
- setExited(false);
2020
- if (onTransitionEnter) {
2021
- onTransitionEnter();
2022
- }
2023
- };
2024
- const handleExited = () => {
2025
- setExited(true);
2026
- if (onTransitionExited) {
2027
- onTransitionExited();
2028
- }
2029
- if (closeAfterTransition) {
2030
- handleClose();
2031
- }
2032
- };
2033
- return {
2034
- onEnter: createChainedFunction(handleEnter, children == null ? void 0 : children.props.onEnter),
2035
- onExited: createChainedFunction(handleExited, children == null ? void 0 : children.props.onExited)
2036
- };
2037
- };
2038
- return {
2039
- getRootProps,
2040
- getBackdropProps,
2041
- getTransitionProps: getTransitionProps2,
2042
- rootRef: handleRef,
2043
- portalRef: handlePortalRef,
2044
- isTopModal,
2045
- exited,
2046
- hasTransition
2047
- };
2048
- }
2049
- function getModalUtilityClass(slot) {
2050
- return generateUtilityClass("MuiModal", slot);
2051
- }
2052
- generateUtilityClasses("MuiModal", ["root", "hidden", "backdrop"]);
2053
- const _excluded = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "onTransitionEnter", "onTransitionExited", "open", "slotProps", "slots", "theme"];
2054
- const useUtilityClasses = (ownerState) => {
2055
- const {
2056
- open,
2057
- exited,
2058
- classes
2059
- } = ownerState;
2060
- const slots = {
2061
- root: ["root", !open && exited && "hidden"],
2062
- backdrop: ["backdrop"]
2063
- };
2064
- return composeClasses(slots, getModalUtilityClass, classes);
2065
- };
2066
- const ModalRoot = styled("div", {
2067
- name: "MuiModal",
2068
- slot: "Root",
2069
- overridesResolver: (props, styles2) => {
2070
- const {
2071
- ownerState
2072
- } = props;
2073
- return [styles2.root, !ownerState.open && ownerState.exited && styles2.hidden];
2074
- }
2075
- })(({
2076
- theme,
2077
- ownerState
2078
- }) => _extends({
2079
- position: "fixed",
2080
- zIndex: (theme.vars || theme).zIndex.modal,
2081
- right: 0,
2082
- bottom: 0,
2083
- top: 0,
2084
- left: 0
2085
- }, !ownerState.open && ownerState.exited && {
2086
- visibility: "hidden"
2087
- }));
2088
- const ModalBackdrop = styled(Backdrop, {
2089
- name: "MuiModal",
2090
- slot: "Backdrop",
2091
- overridesResolver: (props, styles2) => {
2092
- return styles2.backdrop;
2093
- }
2094
- })({
2095
- zIndex: -1
2096
- });
2097
- const Modal = /* @__PURE__ */ React.forwardRef(function Modal2(inProps, ref) {
2098
- var _ref, _slots$root, _ref2, _slots$backdrop, _slotProps$root, _slotProps$backdrop;
2099
- const props = useDefaultProps({
2100
- name: "MuiModal",
2101
- props: inProps
2102
- });
2103
- const {
2104
- BackdropComponent = ModalBackdrop,
2105
- BackdropProps,
2106
- className,
2107
- closeAfterTransition = false,
2108
- children,
2109
- container,
2110
- component,
2111
- components = {},
2112
- componentsProps = {},
2113
- disableAutoFocus = false,
2114
- disableEnforceFocus = false,
2115
- disableEscapeKeyDown = false,
2116
- disablePortal = false,
2117
- disableRestoreFocus = false,
2118
- disableScrollLock = false,
2119
- hideBackdrop = false,
2120
- keepMounted = false,
2121
- onBackdropClick,
2122
- open,
2123
- slotProps,
2124
- slots
2125
- // eslint-disable-next-line react/prop-types
2126
- } = props, other = _objectWithoutPropertiesLoose(props, _excluded);
2127
- const propsWithDefaults = _extends({}, props, {
2128
- closeAfterTransition,
2129
- disableAutoFocus,
2130
- disableEnforceFocus,
2131
- disableEscapeKeyDown,
2132
- disablePortal,
2133
- disableRestoreFocus,
2134
- disableScrollLock,
2135
- hideBackdrop,
2136
- keepMounted
2137
- });
2138
- const {
2139
- getRootProps,
2140
- getBackdropProps,
2141
- getTransitionProps: getTransitionProps2,
2142
- portalRef,
2143
- isTopModal,
2144
- exited,
2145
- hasTransition
2146
- } = useModal(_extends({}, propsWithDefaults, {
2147
- rootRef: ref
2148
- }));
2149
- const ownerState = _extends({}, propsWithDefaults, {
2150
- exited
2151
- });
2152
- const classes = useUtilityClasses(ownerState);
2153
- const childProps = {};
2154
- if (children.props.tabIndex === void 0) {
2155
- childProps.tabIndex = "-1";
2156
- }
2157
- if (hasTransition) {
2158
- const {
2159
- onEnter,
2160
- onExited
2161
- } = getTransitionProps2();
2162
- childProps.onEnter = onEnter;
2163
- childProps.onExited = onExited;
2164
- }
2165
- const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : ModalRoot;
2166
- const BackdropSlot = (_ref2 = (_slots$backdrop = slots == null ? void 0 : slots.backdrop) != null ? _slots$backdrop : components.Backdrop) != null ? _ref2 : BackdropComponent;
2167
- const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;
2168
- const backdropSlotProps = (_slotProps$backdrop = slotProps == null ? void 0 : slotProps.backdrop) != null ? _slotProps$backdrop : componentsProps.backdrop;
2169
- const rootProps = useSlotProps({
2170
- elementType: RootSlot,
2171
- externalSlotProps: rootSlotProps,
2172
- externalForwardedProps: other,
2173
- getSlotProps: getRootProps,
2174
- additionalProps: {
2175
- ref,
2176
- as: component
2177
- },
2178
- ownerState,
2179
- className: clsx(className, rootSlotProps == null ? void 0 : rootSlotProps.className, classes == null ? void 0 : classes.root, !ownerState.open && ownerState.exited && (classes == null ? void 0 : classes.hidden))
2180
- });
2181
- const backdropProps = useSlotProps({
2182
- elementType: BackdropSlot,
2183
- externalSlotProps: backdropSlotProps,
2184
- additionalProps: BackdropProps,
2185
- getSlotProps: (otherHandlers) => {
2186
- return getBackdropProps(_extends({}, otherHandlers, {
2187
- onClick: (e) => {
2188
- if (onBackdropClick) {
2189
- onBackdropClick(e);
2190
- }
2191
- if (otherHandlers != null && otherHandlers.onClick) {
2192
- otherHandlers.onClick(e);
2193
- }
2194
- }
2195
- }));
2196
- },
2197
- className: clsx(backdropSlotProps == null ? void 0 : backdropSlotProps.className, BackdropProps == null ? void 0 : BackdropProps.className, classes == null ? void 0 : classes.backdrop),
2198
- ownerState
2199
- });
2200
- if (!keepMounted && !open && (!hasTransition || exited)) {
2201
- return null;
2202
- }
2203
- return /* @__PURE__ */ jsx(Portal, {
2204
- ref: portalRef,
2205
- container,
2206
- disablePortal,
2207
- children: /* @__PURE__ */ jsxs(RootSlot, _extends({}, rootProps, {
2208
- children: [!hideBackdrop && BackdropComponent ? /* @__PURE__ */ jsx(BackdropSlot, _extends({}, backdropProps)) : null, /* @__PURE__ */ jsx(FocusTrap, {
2209
- disableEnforceFocus,
2210
- disableAutoFocus,
2211
- disableRestoreFocus,
2212
- isEnabled: isTopModal,
2213
- open,
2214
- children: /* @__PURE__ */ React.cloneElement(children, childProps)
2215
- })]
2216
- }))
2217
- });
2218
- });
2219
- process$1.env.NODE_ENV !== "production" ? Modal.propTypes = {
2220
- // ┌────────────────────────────── Warning ──────────────────────────────┐
2221
- // │ These PropTypes are generated from the TypeScript type definitions. │
2222
- // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
2223
- // └─────────────────────────────────────────────────────────────────────┘
2224
- /**
2225
- * A backdrop component. This prop enables custom backdrop rendering.
2226
- * @deprecated Use `slots.backdrop` instead. While this prop currently works, it will be removed in the next major version.
2227
- * Use the `slots.backdrop` prop to make your application ready for the next version of Material UI.
2228
- * @default styled(Backdrop, {
2229
- * name: 'MuiModal',
2230
- * slot: 'Backdrop',
2231
- * overridesResolver: (props, styles) => {
2232
- * return styles.backdrop;
2233
- * },
2234
- * })({
2235
- * zIndex: -1,
2236
- * })
2237
- */
2238
- BackdropComponent: PropTypes.elementType,
2239
- /**
2240
- * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element.
2241
- * @deprecated Use `slotProps.backdrop` instead.
2242
- */
2243
- BackdropProps: PropTypes.object,
2244
- /**
2245
- * A single child content element.
2246
- */
2247
- children: elementAcceptingRef.isRequired,
2248
- /**
2249
- * Override or extend the styles applied to the component.
2250
- */
2251
- classes: PropTypes.object,
2252
- /**
2253
- * @ignore
2254
- */
2255
- className: PropTypes.string,
2256
- /**
2257
- * When set to true the Modal waits until a nested Transition is completed before closing.
2258
- * @default false
2259
- */
2260
- closeAfterTransition: PropTypes.bool,
2261
- /**
2262
- * The component used for the root node.
2263
- * Either a string to use a HTML element or a component.
2264
- */
2265
- component: PropTypes.elementType,
2266
- /**
2267
- * The components used for each slot inside.
2268
- *
2269
- * This prop is an alias for the `slots` prop.
2270
- * It's recommended to use the `slots` prop instead.
2271
- *
2272
- * @default {}
2273
- */
2274
- components: PropTypes.shape({
2275
- Backdrop: PropTypes.elementType,
2276
- Root: PropTypes.elementType
2277
- }),
2278
- /**
2279
- * The extra props for the slot components.
2280
- * You can override the existing props or add new ones.
2281
- *
2282
- * This prop is an alias for the `slotProps` prop.
2283
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
2284
- *
2285
- * @default {}
2286
- */
2287
- componentsProps: PropTypes.shape({
2288
- backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
2289
- root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
2290
- }),
2291
- /**
2292
- * An HTML element or function that returns one.
2293
- * The `container` will have the portal children appended to it.
2294
- *
2295
- * You can also provide a callback, which is called in a React layout effect.
2296
- * This lets you set the container from a ref, and also makes server-side rendering possible.
2297
- *
2298
- * By default, it uses the body of the top-level document object,
2299
- * so it's simply `document.body` most of the time.
2300
- */
2301
- container: PropTypes.oneOfType([HTMLElementType, PropTypes.func]),
2302
- /**
2303
- * If `true`, the modal will not automatically shift focus to itself when it opens, and
2304
- * replace it to the last focused element when it closes.
2305
- * This also works correctly with any modal children that have the `disableAutoFocus` prop.
2306
- *
2307
- * Generally this should never be set to `true` as it makes the modal less
2308
- * accessible to assistive technologies, like screen readers.
2309
- * @default false
2310
- */
2311
- disableAutoFocus: PropTypes.bool,
2312
- /**
2313
- * If `true`, the modal will not prevent focus from leaving the modal while open.
2314
- *
2315
- * Generally this should never be set to `true` as it makes the modal less
2316
- * accessible to assistive technologies, like screen readers.
2317
- * @default false
2318
- */
2319
- disableEnforceFocus: PropTypes.bool,
2320
- /**
2321
- * If `true`, hitting escape will not fire the `onClose` callback.
2322
- * @default false
2323
- */
2324
- disableEscapeKeyDown: PropTypes.bool,
2325
- /**
2326
- * The `children` will be under the DOM hierarchy of the parent component.
2327
- * @default false
2328
- */
2329
- disablePortal: PropTypes.bool,
2330
- /**
2331
- * If `true`, the modal will not restore focus to previously focused element once
2332
- * modal is hidden or unmounted.
2333
- * @default false
2334
- */
2335
- disableRestoreFocus: PropTypes.bool,
2336
- /**
2337
- * Disable the scroll lock behavior.
2338
- * @default false
2339
- */
2340
- disableScrollLock: PropTypes.bool,
2341
- /**
2342
- * If `true`, the backdrop is not rendered.
2343
- * @default false
2344
- */
2345
- hideBackdrop: PropTypes.bool,
2346
- /**
2347
- * Always keep the children in the DOM.
2348
- * This prop can be useful in SEO situation or
2349
- * when you want to maximize the responsiveness of the Modal.
2350
- * @default false
2351
- */
2352
- keepMounted: PropTypes.bool,
2353
- /**
2354
- * Callback fired when the backdrop is clicked.
2355
- * @deprecated Use the `onClose` prop with the `reason` argument to handle the `backdropClick` events.
2356
- */
2357
- onBackdropClick: PropTypes.func,
2358
- /**
2359
- * Callback fired when the component requests to be closed.
2360
- * The `reason` parameter can optionally be used to control the response to `onClose`.
2361
- *
2362
- * @param {object} event The event source of the callback.
2363
- * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`.
2364
- */
2365
- onClose: PropTypes.func,
2366
- /**
2367
- * A function called when a transition enters.
2368
- */
2369
- onTransitionEnter: PropTypes.func,
2370
- /**
2371
- * A function called when a transition has exited.
2372
- */
2373
- onTransitionExited: PropTypes.func,
2374
- /**
2375
- * If `true`, the component is shown.
2376
- */
2377
- open: PropTypes.bool.isRequired,
2378
- /**
2379
- * The props used for each slot inside the Modal.
2380
- * @default {}
2381
- */
2382
- slotProps: PropTypes.shape({
2383
- backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
2384
- root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
2385
- }),
2386
- /**
2387
- * The components used for each slot inside the Modal.
2388
- * Either a string to use a HTML element or a component.
2389
- * @default {}
2390
- */
2391
- slots: PropTypes.shape({
2392
- backdrop: PropTypes.elementType,
2393
- root: PropTypes.elementType
2394
- }),
2395
- /**
2396
- * The system prop that allows defining system overrides as well as additional CSS styles.
2397
- */
2398
- sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
2399
- } : void 0;
2400
- function CloseButton({ fill }) {
2401
- return /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M1 1L11 11M9.57143 1L1 11", stroke: fill, "stroke-width": "2" }) });
2402
- }
2403
- async function getChainIds() {
2404
- var _a;
2405
- const keplr = getWallet(WalletType.KEPLR);
2406
- let getChains = await keplr.getChainInfosWithoutEndpoints();
2407
- let getCosmosChains = ((_a = useStore.getState()) == null ? void 0 : _a.cosmosChains) || [];
2408
- const chainObj = lodashExports.keyBy(getChains, "chainId");
2409
- let chainIds = [];
2410
- getCosmosChains.forEach((item) => {
2411
- if (chainObj[item.chainId]) chainIds.push(item.chainId);
2412
- else {
2413
- return;
2414
- }
2415
- });
2416
- return chainIds;
2417
- }
2418
- export {
2419
- ButtonBase as B,
2420
- CloseButton as C,
2421
- Fade as F,
2422
- Modal as M,
2423
- TransitionGroup as T,
2424
- _assertThisInitialized as _,
2425
- Backdrop as a,
2426
- FocusTrap as b,
2427
- getScrollbarSize as c,
2428
- elementTypeAcceptingRef$1 as e,
2429
- getChainIds as g,
2430
- ownerWindow as o
2431
- };