@arcblock/ux 3.4.15 → 3.5.1

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 (333) hide show
  1. package/lib/package.json.js +1 -1
  2. package/package.json +10 -7
  3. package/src/ActionButton/ActionButton.stories.jsx +0 -61
  4. package/src/ActionButton/index.jsx +0 -106
  5. package/src/ActivityIndicator/ActivityIndicator.stories.jsx +0 -9
  6. package/src/ActivityIndicator/index.jsx +0 -140
  7. package/src/Address/Address.stories.jsx +0 -38
  8. package/src/Address/compact-text.jsx +0 -76
  9. package/src/Address/did-address.tsx +0 -223
  10. package/src/Address/index.tsx +0 -21
  11. package/src/Address/responsive-did-address.tsx +0 -154
  12. package/src/Alert/Alert.stories.jsx +0 -100
  13. package/src/Alert/index.jsx +0 -130
  14. package/src/AnimationWaiter/AnimationWaiter.stories.jsx +0 -35
  15. package/src/AnimationWaiter/dark-animation.json +0 -1
  16. package/src/AnimationWaiter/default-animation.json +0 -1
  17. package/src/AnimationWaiter/index.jsx +0 -296
  18. package/src/Async/index.tsx +0 -44
  19. package/src/Avatar/Avatar.stories.jsx +0 -11
  20. package/src/Avatar/did-motif.jsx +0 -38
  21. package/src/Avatar/etherscan-blockies.js +0 -81
  22. package/src/Avatar/index.jsx +0 -195
  23. package/src/Badge/Badge.stories.jsx +0 -41
  24. package/src/Badge/index.jsx +0 -101
  25. package/src/Blocklet/Blocklet.stories.jsx +0 -21
  26. package/src/Blocklet/blocklet.jsx +0 -276
  27. package/src/Blocklet/index.js +0 -5
  28. package/src/Blocklet/utils.jsx +0 -58
  29. package/src/BlockletContext/index.tsx +0 -72
  30. package/src/BlockletNFT/BlockletNFT.stories.jsx +0 -21
  31. package/src/BlockletNFT/index.jsx +0 -378
  32. package/src/BlockletV2/Blocklet.stories.jsx +0 -34
  33. package/src/BlockletV2/blocklet.tsx +0 -247
  34. package/src/BlockletV2/components/icon-text.tsx +0 -47
  35. package/src/BlockletV2/components/tooltip-icon.tsx +0 -52
  36. package/src/BlockletV2/index.ts +0 -6
  37. package/src/BlockletV2/utils.js +0 -75
  38. package/src/Button/Button.stories.jsx +0 -24
  39. package/src/Button/index.js +0 -9
  40. package/src/Button/wrap.jsx +0 -126
  41. package/src/ButtonGroup/index.js +0 -16
  42. package/src/CardSelector/index.tsx +0 -136
  43. package/src/Center/Center.stories.jsx +0 -20
  44. package/src/Center/index.tsx +0 -33
  45. package/src/ClickToCopy/ClickToCopy.stories.jsx +0 -24
  46. package/src/ClickToCopy/copy-button.tsx +0 -43
  47. package/src/ClickToCopy/hook.ts +0 -42
  48. package/src/ClickToCopy/index.tsx +0 -96
  49. package/src/CloseButton/index.tsx +0 -37
  50. package/src/CodeBlock/CodeBlock.stories.jsx +0 -22
  51. package/src/CodeBlock/LightBox.tsx +0 -87
  52. package/src/CodeBlock/index.tsx +0 -217
  53. package/src/Colors/Colors.stories.jsx +0 -211
  54. package/src/Colors/index.ts +0 -4
  55. package/src/Colors/themes/default.ts +0 -8
  56. package/src/Colors/themes/did-connect.ts +0 -64
  57. package/src/Colors/themes/temp.ts +0 -52
  58. package/src/Config/Config.stories.jsx +0 -16
  59. package/src/Config/config-provider.tsx +0 -62
  60. package/src/Config/index.ts +0 -2
  61. package/src/Config/theme-mode-toggle.tsx +0 -38
  62. package/src/ContactForm/ContactForm.stories.jsx +0 -32
  63. package/src/ContactForm/index.tsx +0 -264
  64. package/src/CookieConsent/CookieConsent.stories.jsx +0 -33
  65. package/src/CookieConsent/index.tsx +0 -104
  66. package/src/CountDown/CountDown.stories.jsx +0 -15
  67. package/src/CountDown/index.tsx +0 -170
  68. package/src/DID/DID.stories.jsx +0 -37
  69. package/src/DID/index.tsx +0 -393
  70. package/src/DIDConnect/app-icon.tsx +0 -37
  71. package/src/DIDConnect/app-info-item.tsx +0 -93
  72. package/src/DIDConnect/auth-apps/auth-apps-info.tsx +0 -77
  73. package/src/DIDConnect/auth-apps/index.tsx +0 -278
  74. package/src/DIDConnect/auth-apps/switch-role.tsx +0 -47
  75. package/src/DIDConnect/did-connect-container.tsx +0 -326
  76. package/src/DIDConnect/did-connect-footer.tsx +0 -76
  77. package/src/DIDConnect/did-connect-logo.tsx +0 -8
  78. package/src/DIDConnect/icons/did-wallet-logo.tsx +0 -18
  79. package/src/DIDConnect/icons/github-logo.tsx +0 -17
  80. package/src/DIDConnect/index.ts +0 -11
  81. package/src/DIDConnect/landing-page.tsx +0 -218
  82. package/src/DIDConnect/powered-by.tsx +0 -48
  83. package/src/DIDConnect/provider-icon.tsx +0 -62
  84. package/src/DIDConnect/request-storage-access-api-dialog.tsx +0 -304
  85. package/src/DIDConnect/with-container.tsx +0 -323
  86. package/src/DIDConnect/with-ux-theme.tsx +0 -22
  87. package/src/DIDLogo/Logo.stories.jsx +0 -11
  88. package/src/DIDLogo/index.tsx +0 -168
  89. package/src/Datatable/CustomToolbar.jsx +0 -415
  90. package/src/Datatable/Datatable.stories.jsx +0 -92
  91. package/src/Datatable/DatatableContext.jsx +0 -35
  92. package/src/Datatable/TableSearch.jsx +0 -166
  93. package/src/Datatable/index.jsx +0 -652
  94. package/src/Datatable/utils.js +0 -161
  95. package/src/Dialog/Dialog.stories.jsx +0 -21
  96. package/src/Dialog/confirm.jsx +0 -143
  97. package/src/Dialog/dialog.jsx +0 -199
  98. package/src/Dialog/index.js +0 -4
  99. package/src/Dialog/types.d.ts +0 -20
  100. package/src/Dialog/use-confirm.jsx +0 -188
  101. package/src/DriftBot/index.tsx +0 -81
  102. package/src/Earth/Earth.stories.jsx +0 -39
  103. package/src/Earth/countries.json +0 -8057
  104. package/src/Earth/index.tsx +0 -515
  105. package/src/Earth/util.ts +0 -72
  106. package/src/Empty/Empty.stories.jsx +0 -23
  107. package/src/Empty/index.jsx +0 -48
  108. package/src/ErrorBoundary/ErrorBoundary.stories.jsx +0 -13
  109. package/src/ErrorBoundary/fallback.tsx +0 -85
  110. package/src/ErrorBoundary/index.ts +0 -1
  111. package/src/Footer/Footer.stories.jsx +0 -13
  112. package/src/Footer/index.tsx +0 -130
  113. package/src/Header/Header.stories.jsx +0 -30
  114. package/src/Header/addon-button.tsx +0 -41
  115. package/src/Header/auto-hidden.tsx +0 -31
  116. package/src/Header/header-addons.tsx +0 -37
  117. package/src/Header/header.tsx +0 -214
  118. package/src/Header/index.ts +0 -3
  119. package/src/Header/responsive-header.tsx +0 -145
  120. package/src/Icon/Icon.stories.jsx +0 -45
  121. package/src/Icon/image.tsx +0 -53
  122. package/src/Icon/index.tsx +0 -63
  123. package/src/Img/Img.stories.jsx +0 -17
  124. package/src/Img/index.jsx +0 -258
  125. package/src/InfoRow/InfoRow.stories.jsx +0 -14
  126. package/src/InfoRow/index.tsx +0 -91
  127. package/src/Layout/Layout.stories.jsx +0 -24
  128. package/src/Layout/dashboard/external-link.tsx +0 -59
  129. package/src/Layout/dashboard/full-page.tsx +0 -58
  130. package/src/Layout/dashboard/index.tsx +0 -260
  131. package/src/Layout/dashboard/sidebar.tsx +0 -198
  132. package/src/Layout/dashboard-legacy/header.tsx +0 -156
  133. package/src/Layout/dashboard-legacy/index.tsx +0 -127
  134. package/src/Layout/dashboard-legacy/sidebar.tsx +0 -129
  135. package/src/Layout/index.tsx +0 -310
  136. package/src/LoadingMask/index.tsx +0 -108
  137. package/src/Locale/LocaleSelector.stories.jsx +0 -44
  138. package/src/Locale/browser-lang.ts +0 -65
  139. package/src/Locale/context.tsx +0 -162
  140. package/src/Locale/languages.ts +0 -58
  141. package/src/Locale/selector.tsx +0 -174
  142. package/src/Locale/util.ts +0 -38
  143. package/src/Logo/Logo.stories.jsx +0 -23
  144. package/src/Logo/images/logo-dark-text.svg +0 -3
  145. package/src/Logo/images/logo-dark-top.svg +0 -6
  146. package/src/Logo/images/logo-light-text.svg +0 -3
  147. package/src/Logo/images/logo-light-top.svg +0 -6
  148. package/src/Logo/index.tsx +0 -58
  149. package/src/Metric/Metric.stories.jsx +0 -29
  150. package/src/Metric/index.tsx +0 -130
  151. package/src/MuiWrap/index.tsx +0 -10
  152. package/src/NFTDisplay/NFTBroken.svg +0 -34
  153. package/src/NFTDisplay/NFTDisplay.stories.jsx +0 -30
  154. package/src/NFTDisplay/README.md +0 -59
  155. package/src/NFTDisplay/aspect-ratio-container.tsx +0 -36
  156. package/src/NFTDisplay/broken.tsx +0 -51
  157. package/src/NFTDisplay/displayApi.ts +0 -43
  158. package/src/NFTDisplay/index.tsx +0 -393
  159. package/src/NFTDisplay/loading.tsx +0 -16
  160. package/src/NFTDisplay/preview.tsx +0 -84
  161. package/src/NFTDisplay/render-svg.tsx +0 -21
  162. package/src/NFTDisplay/svg-embedder/img.tsx +0 -27
  163. package/src/NFTDisplay/svg-embedder/inline-svg.tsx +0 -36
  164. package/src/NavMenu/NavMenu.stories.jsx +0 -17
  165. package/src/NavMenu/images/OCAP.svg +0 -1
  166. package/src/NavMenu/images/abt-network.svg +0 -1
  167. package/src/NavMenu/images/ai-kit.svg +0 -1
  168. package/src/NavMenu/images/aigne-image-smith.svg +0 -1
  169. package/src/NavMenu/images/aigne.svg +0 -1
  170. package/src/NavMenu/images/aistro.png +0 -0
  171. package/src/NavMenu/images/arcsphere.svg +0 -1
  172. package/src/NavMenu/images/blocklet-framework.svg +0 -1
  173. package/src/NavMenu/images/blocklet-launcher.svg +0 -1
  174. package/src/NavMenu/images/blocklet-server.svg +0 -1
  175. package/src/NavMenu/images/blocklet-store.svg +0 -1
  176. package/src/NavMenu/images/creator-studio.svg +0 -1
  177. package/src/NavMenu/images/did-wallet.svg +0 -1
  178. package/src/NavMenu/images/did.svg +0 -1
  179. package/src/NavMenu/images/nft-studio.svg +0 -1
  180. package/src/NavMenu/images/payment-kit.png +0 -0
  181. package/src/NavMenu/images/vc.svg +0 -1
  182. package/src/NavMenu/images/web3-kit.svg +0 -1
  183. package/src/NavMenu/index.ts +0 -3
  184. package/src/NavMenu/nav-menu-context.tsx +0 -30
  185. package/src/NavMenu/nav-menu.tsx +0 -441
  186. package/src/NavMenu/products.tsx +0 -830
  187. package/src/NavMenu/style.ts +0 -258
  188. package/src/NavMenu/sub-container.tsx +0 -125
  189. package/src/NavMenu/sub-item-group.tsx +0 -42
  190. package/src/OrgTransfer/index.tsx +0 -53
  191. package/src/OrgTransfer/locales.ts +0 -25
  192. package/src/OrgTransfer/selector.tsx +0 -252
  193. package/src/OrgTransfer/type.ts +0 -31
  194. package/src/PageScroller/index.tsx +0 -316
  195. package/src/PageScroller/story/FifthComponent.jsx +0 -7
  196. package/src/PageScroller/story/FirstComponent.jsx +0 -7
  197. package/src/PageScroller/story/FourthComponent.jsx +0 -7
  198. package/src/PageScroller/story/FullPage.jsx +0 -55
  199. package/src/PageScroller/story/PageContain.jsx +0 -59
  200. package/src/PageScroller/story/PageScroller.stories.jsx +0 -18
  201. package/src/PageScroller/story/SecondComponent.jsx +0 -7
  202. package/src/PageScroller/story/ThirdComponent.jsx +0 -7
  203. package/src/PageScroller/story/index.css +0 -115
  204. package/src/PageScroller/usePrevValue.ts +0 -11
  205. package/src/Passport/index.ts +0 -3
  206. package/src/Passport/passport.tsx +0 -118
  207. package/src/PhoneInput/PhoneInput.stories.jsx +0 -12
  208. package/src/PhoneInput/country-select.tsx +0 -148
  209. package/src/PhoneInput/index.tsx +0 -269
  210. package/src/PoweredByArcBlock/index.tsx +0 -27
  211. package/src/PricingTable/PricingPlan.tsx +0 -120
  212. package/src/PricingTable/PricingTable.stories.jsx +0 -38
  213. package/src/PricingTable/index.tsx +0 -59
  214. package/src/QRCode/QRCode.stories.jsx +0 -13
  215. package/src/QRCode/index.tsx +0 -66
  216. package/src/RelativeTime/RelativeTime.stories.jsx +0 -20
  217. package/src/RelativeTime/index.tsx +0 -334
  218. package/src/Result/Result.stories.jsx +0 -61
  219. package/src/Result/common.tsx +0 -119
  220. package/src/Result/index.tsx +0 -30
  221. package/src/Result/result.tsx +0 -65
  222. package/src/Result/translations.ts +0 -57
  223. package/src/Screenshot/BaseScreenshot/index.tsx +0 -73
  224. package/src/Screenshot/BaseScreenshot/shells/Macbook.tsx +0 -38
  225. package/src/Screenshot/BaseScreenshot/shells/Phone.tsx +0 -35
  226. package/src/Screenshot/Screenshot.stories.jsx +0 -44
  227. package/src/Screenshot/devices.css +0 -1366
  228. package/src/Screenshot/index.tsx +0 -300
  229. package/src/SessionBlocklet/index.tsx +0 -178
  230. package/src/SessionManager/SessionManager.stories.jsx +0 -9
  231. package/src/SessionManager/index.tsx +0 -3
  232. package/src/SessionPermission/index.tsx +0 -26
  233. package/src/SessionUser/components/did-space.tsx +0 -68
  234. package/src/SessionUser/components/logged-in.tsx +0 -338
  235. package/src/SessionUser/components/quick-login-item.tsx +0 -132
  236. package/src/SessionUser/components/session-user-item.tsx +0 -93
  237. package/src/SessionUser/components/session-user-switch.tsx +0 -240
  238. package/src/SessionUser/components/un-login.tsx +0 -257
  239. package/src/SessionUser/components/user-info.tsx +0 -201
  240. package/src/SessionUser/index.tsx +0 -68
  241. package/src/SessionUser/libs/translation.ts +0 -30
  242. package/src/SessionUser/libs/utils.ts +0 -39
  243. package/src/SharedBridge/index.tsx +0 -126
  244. package/src/SocialShare/index.tsx +0 -194
  245. package/src/Sparkline/Sparkline.stories.jsx +0 -13
  246. package/src/Sparkline/index.tsx +0 -231
  247. package/src/Spinner/Spinner.stories.jsx +0 -98
  248. package/src/Spinner/index.tsx +0 -20
  249. package/src/SplitButton/SplitButton.stories.jsx +0 -32
  250. package/src/SplitButton/index.tsx +0 -116
  251. package/src/SplitButton/useClickAway.tsx +0 -24
  252. package/src/Success/index.tsx +0 -175
  253. package/src/Switch/Switch.stories.jsx +0 -16
  254. package/src/Switch/index.jsx +0 -79
  255. package/src/Tabs/Tabs.stories.jsx +0 -18
  256. package/src/Tabs/index.tsx +0 -255
  257. package/src/Tag/Tag.stories.jsx +0 -15
  258. package/src/Tag/index.jsx +0 -106
  259. package/src/TextCollapse/TextCollapse.stories.jsx +0 -73
  260. package/src/TextCollapse/index.tsx +0 -85
  261. package/src/Theme/Theme.stories.jsx +0 -11
  262. package/src/Theme/index.ts +0 -21
  263. package/src/Theme/theme-provider.tsx +0 -374
  264. package/src/Theme/theme.ts +0 -229
  265. package/src/Toast/Toast.stories.jsx +0 -28
  266. package/src/Toast/index.tsx +0 -80
  267. package/src/Typography/index.tsx +0 -124
  268. package/src/UserCard/Cards/avatar-only.tsx +0 -27
  269. package/src/UserCard/Cards/basic-info.tsx +0 -43
  270. package/src/UserCard/Cards/index.tsx +0 -16
  271. package/src/UserCard/Cards/social-actions.tsx +0 -196
  272. package/src/UserCard/Container/card.tsx +0 -63
  273. package/src/UserCard/Container/dialog.tsx +0 -37
  274. package/src/UserCard/Content/basic.tsx +0 -330
  275. package/src/UserCard/Content/clock.tsx +0 -82
  276. package/src/UserCard/Content/minimal.tsx +0 -113
  277. package/src/UserCard/Content/shorten-label.tsx +0 -32
  278. package/src/UserCard/Content/tooltip-avatar.tsx +0 -80
  279. package/src/UserCard/UserCard.stories.jsx +0 -19
  280. package/src/UserCard/components.tsx +0 -81
  281. package/src/UserCard/index.tsx +0 -132
  282. package/src/UserCard/types.ts +0 -165
  283. package/src/UserCard/use-follow.tsx +0 -111
  284. package/src/UserCard/utils.ts +0 -155
  285. package/src/Util/WebWalletOpener.stories.jsx +0 -5
  286. package/src/Util/client.ts +0 -4
  287. package/src/Util/constant.ts +0 -70
  288. package/src/Util/deprecate.tsx +0 -29
  289. package/src/Util/federated.ts +0 -125
  290. package/src/Util/iframe.ts +0 -19
  291. package/src/Util/index.ts +0 -760
  292. package/src/Util/logger.ts +0 -44
  293. package/src/Util/passport.ts +0 -127
  294. package/src/Util/security.ts +0 -72
  295. package/src/Util/style.ts +0 -17
  296. package/src/Util/wallet.ts +0 -35
  297. package/src/VerificationCode/index.tsx +0 -83
  298. package/src/Video/Video.stories.jsx +0 -6
  299. package/src/Video/index.tsx +0 -70
  300. package/src/Wallet/Action.stories.jsx +0 -8
  301. package/src/Wallet/Action.tsx +0 -118
  302. package/src/Wallet/Download.stories.jsx +0 -9
  303. package/src/Wallet/Download.tsx +0 -157
  304. package/src/Wallet/Open.tsx +0 -47
  305. package/src/Wallet/OpenInWallet.stories.jsx +0 -5
  306. package/src/Wallet/images/abtwallet.png +0 -0
  307. package/src/Wallet/images/android_download.svg +0 -22
  308. package/src/Wallet/images/app-store.svg +0 -30
  309. package/src/Wallet/images/google-play.svg +0 -69
  310. package/src/WalletOSIcon/index.tsx +0 -47
  311. package/src/WebWalletSWKeeper/index.tsx +0 -117
  312. package/src/WechatPrompt/images/android.png +0 -0
  313. package/src/WechatPrompt/images/ios.png +0 -0
  314. package/src/WechatPrompt/index.tsx +0 -75
  315. package/src/global.d.ts +0 -28
  316. package/src/hooks/use-blocklet-logo.tsx +0 -32
  317. package/src/hooks/use-clock.tsx +0 -62
  318. package/src/hooks/use-location-state.tsx +0 -117
  319. package/src/hooks/use-mobile.tsx +0 -6
  320. package/src/index.ts +0 -79
  321. package/src/type.d.ts +0 -44
  322. package/src/withTheme/index.tsx +0 -72
  323. package/src/withTracker/README.md +0 -37
  324. package/src/withTracker/action/bind-wallet.tsx +0 -17
  325. package/src/withTracker/action/login.tsx +0 -18
  326. package/src/withTracker/action/pay.tsx +0 -14
  327. package/src/withTracker/action/switch-passport.tsx +0 -20
  328. package/src/withTracker/constant/index.tsx +0 -3
  329. package/src/withTracker/env.tsx +0 -1
  330. package/src/withTracker/error_boundary.jsx +0 -34
  331. package/src/withTracker/index.tsx +0 -50
  332. package/src/withTracker/libs/utm.ts +0 -46
  333. package/vite.config.mjs +0 -37
@@ -1,108 +0,0 @@
1
- import { Box } from '@mui/material';
2
-
3
- export interface LoadingMaskProps {
4
- size?: number;
5
- padding?: number;
6
- borderWidth?: number;
7
- borderRadius?: number;
8
- duration?: number;
9
- children: React.ReactNode;
10
- }
11
-
12
- export default function LoadingMask({
13
- size = 64,
14
- padding = undefined,
15
- borderWidth = undefined,
16
- borderRadius = undefined,
17
- duration = undefined,
18
- children,
19
- }: LoadingMaskProps) {
20
- const finialSize = size;
21
- const finialRadius = borderRadius ?? finialSize / 8;
22
- const finialBorderWidth = borderWidth ?? finialSize / 32;
23
- const finialPadding = padding ?? finialSize * 0.35 - finialBorderWidth;
24
- const finialDuration = duration ?? 2.5;
25
- return (
26
- <Box
27
- sx={{
28
- display: 'inline-flex',
29
- justifyContent: 'center',
30
- alignItems: 'center',
31
- width: finialSize,
32
- height: finialSize,
33
- position: 'relative',
34
- }}>
35
- <Box
36
- sx={{
37
- pointerEvents: 'none',
38
- position: 'absolute',
39
- top: 0,
40
- left: 0,
41
- right: 0,
42
- bottom: 0,
43
- display: 'flex',
44
- justifyContent: 'center',
45
- alignItems: 'center',
46
- width: finialSize,
47
- height: finialSize,
48
- overflow: 'hidden',
49
- borderRadius: `${finialRadius}px`,
50
- backgroundColor: 'grey.200',
51
- '&::before,&::after': {
52
- content: '""',
53
- position: 'absolute',
54
- pointerEvents: 'none',
55
- },
56
- '&::after': {
57
- left: finialBorderWidth,
58
- right: finialBorderWidth,
59
- top: finialBorderWidth,
60
- bottom: finialBorderWidth,
61
- backgroundColor: 'background.default',
62
- borderRadius: `${finialRadius - finialBorderWidth}px`,
63
- },
64
- '&::before': {
65
- width: finialSize * 5,
66
- height: finialSize * 5,
67
- top: '50%',
68
- left: '50%',
69
- transform: 'translate(-50%, -50%)',
70
- background: ({ palette }) =>
71
- `conic-gradient(from 45deg, transparent 0%, transparent 50%, ${palette.secondary.main} 90%, ${palette.secondary.main} 100%)`,
72
- animation: `rotate ${finialDuration}s linear infinite`,
73
- '@keyframes rotate': {
74
- '0%': {
75
- transform: 'translate(-50%, -50%) rotate(0deg)',
76
- },
77
- '100%': {
78
- transform: 'translate(-50%, -50%) rotate(360deg)',
79
- },
80
- },
81
- },
82
- }}
83
- />
84
- <Box
85
- sx={{
86
- position: 'relative',
87
- display: 'flex',
88
- justifyContent: 'center',
89
- alignItems: 'center',
90
- width: finialSize - finialPadding - finialBorderWidth,
91
- height: finialSize - finialPadding - finialBorderWidth,
92
-
93
- animation: 'wait-bounce 1.6s infinite',
94
- transformOrigin: 'center bottom',
95
- '@keyframes wait-bounce': {
96
- '0%': { transform: 'scale(1) translateY(0)' },
97
- '20%': { transform: 'scale(1.03) translateY(-4px)' },
98
- '40%': { transform: 'scale(0.98) translateY(2px)' },
99
- '60%': { transform: 'scale(1.01) translateY(-2px)' },
100
- '80%': { transform: 'scale(0.99) translateY(1px)' },
101
- '100%': { transform: 'scale(1) translateY(0)' },
102
- },
103
- }}>
104
- {children}
105
- </Box>
106
- </Box>
107
- );
108
- }
@@ -1,44 +0,0 @@
1
- import { LocaleProvider } from './context';
2
-
3
- import Basic from './demo/basic';
4
- import WithText from './demo/with-text';
5
- import DarkMode from './demo/dark-mode';
6
- import PopperProps from './demo/popper-props';
7
- import PopperTypeProps from './demo/popper-type-props';
8
- import IconProps from './demo/icon-props';
9
- import Languages from './demo/languages';
10
-
11
- export default {
12
- title: 'Basic/LocaleSelector',
13
-
14
- parameters: {
15
- docs: {
16
- description: {
17
- component:
18
- 'If you have multiple locales and want to give your users the option of selecting a language, you can use the LocaleSelector component.',
19
- },
20
- inlineStories: false,
21
- iframeHeight: 160,
22
- },
23
- },
24
- decorators: [
25
- (StoryFn) => (
26
- <LocaleProvider translations={{}}>
27
- <StoryFn />
28
- </LocaleProvider>
29
- ),
30
- ],
31
- };
32
-
33
- // demo 中使用了 react element, 设置 `inlineStories: false` 时导致 storybook 崩溃
34
- IconProps.parameters = {
35
- docs: {
36
- inlineStories: true,
37
- },
38
- };
39
-
40
- Languages.argTypes = {
41
- fallbackLocale: { control: 'select', options: [null, 'en'] },
42
- };
43
-
44
- export { Basic, WithText, DarkMode, PopperProps, PopperTypeProps, IconProps, Languages };
@@ -1,65 +0,0 @@
1
- /* eslint-disable no-param-reassign */
2
- function startsWith(string: string, target: string, position: number = 0) {
3
- const { length } = string;
4
- if (position < 0) {
5
- position = 0;
6
- } else if (position > length) {
7
- position = length;
8
- }
9
- target = `${target}`;
10
- // eslint-disable-next-line eqeqeq
11
- return string.slice(position, position + target.length) == target;
12
- }
13
-
14
- function getBrowserLang() {
15
- if (typeof window === 'undefined') {
16
- return null;
17
- }
18
-
19
- const lang: string =
20
- (window.navigator.languages && window.navigator.languages[0]) ||
21
- window.navigator.language ||
22
- // @ts-expect-error
23
- window.navigator.browserLanguage ||
24
- // @ts-expect-error
25
- window.navigator.userLanguage ||
26
- // @ts-expect-error
27
- window.navigator.systemLanguage ||
28
- null;
29
-
30
- return lang;
31
- }
32
-
33
- function normalizeCode(code?: string | null) {
34
- return (code || '').toLowerCase().replace(/-/, '_');
35
- }
36
-
37
- function getPreferredLanguage(options?: { languages?: string[]; fallback: string }) {
38
- if (!options) {
39
- return getBrowserLang();
40
- }
41
-
42
- const { languages, fallback } = options;
43
- if (!options.languages) {
44
- return fallback;
45
- }
46
-
47
- // some browsers report language as en-US instead of en_US
48
- const browserLanguage = normalizeCode(getBrowserLang());
49
-
50
- if (!browserLanguage) {
51
- return fallback;
52
- }
53
-
54
- const match = languages!.filter((lang) => normalizeCode(lang) === browserLanguage);
55
-
56
- if (match.length > 0) {
57
- return match[0] || fallback;
58
- }
59
-
60
- // en == en_US
61
- const matchCodeOnly = languages!.filter((lang) => startsWith(browserLanguage, lang));
62
- return matchCodeOnly[0] || fallback;
63
- }
64
-
65
- export default getPreferredLanguage;
@@ -1,162 +0,0 @@
1
- /* eslint-disable no-prototype-builtins */
2
- import { createContext, useState, useEffect, use, useRef, useCallback, ReactNode } from 'react';
3
- import get from 'lodash/get';
4
- import Cookie from 'js-cookie';
5
-
6
- import browserLang from './browser-lang';
7
- import { translate } from './util';
8
-
9
- import { getCookieOptions, resolveRootDomain } from '../Util';
10
- import type { Locale } from '../type';
11
-
12
- const cookieName = 'nf_lang';
13
-
14
- // 跨应用传递多语言选择的方式是在 query string 中添加 locale 参数,LocaleSelector 要高优先级遵守这个参数
15
- const getLocaleFromSearchParams = (
16
- languages: { code: string }[],
17
- url: string = window.location.href
18
- ): string | null => {
19
- const locale = new URL(url).searchParams.get('locale');
20
- if (languages.find((x) => x.code === locale)) {
21
- return locale;
22
- }
23
- return null;
24
- };
25
-
26
- const setLocaleParam = (locale: Locale, url: string = window.location.href) => {
27
- const urlObj = new URL(url);
28
- const hasLocaleParam = urlObj.searchParams.has('locale');
29
- if (hasLocaleParam) {
30
- urlObj.searchParams.set('locale', locale);
31
- window.history.replaceState({}, '', urlObj.href);
32
- }
33
- };
34
-
35
- const getLocale = (languages: { code: string }[] = []): string => {
36
- const langParams = {
37
- languages: languages.map((item) => item.code),
38
- // 取 languages 首个元素的 code 值, 如果不存在则取 'en'
39
- fallback: languages?.[0]?.code || 'en',
40
- };
41
- return getLocaleFromSearchParams(languages) || Cookie.get(cookieName) || browserLang(langParams)!;
42
- };
43
-
44
- const setLocale = (locale: Locale) => {
45
- const opts = getCookieOptions();
46
-
47
- // @compatibility 移除历史上使用根域名的旧 cookie
48
- if (!opts.domain) {
49
- const rootDomain = resolveRootDomain();
50
- if (rootDomain) {
51
- Cookie.remove(cookieName, { path: opts.path || '/', domain: rootDomain });
52
- }
53
- }
54
-
55
- Cookie.set(cookieName, locale, opts);
56
- setLocaleParam(locale);
57
- };
58
-
59
- const getLanguages = (arg?: { code: string; name: string }[]): { code: string; name: string }[] => {
60
- const env = get(window, 'blocklet.languages');
61
- if (Array.isArray(env) && env.length) {
62
- return env;
63
- }
64
-
65
- if (Array.isArray(arg) && arg.length) {
66
- return arg;
67
- }
68
-
69
- return [
70
- { code: 'en', name: 'English' },
71
- { code: 'zh', name: '简体中文' },
72
- ];
73
- };
74
-
75
- export interface LocaleProviderProps {
76
- children: ReactNode;
77
- locale?: Locale;
78
- fallbackLocale?: Locale;
79
- translations: Record<string, any>;
80
- onLoadingTranslation?: (locale: Locale, languages: { code: string }[]) => void;
81
- languages?: { code: string; name: string }[];
82
- }
83
-
84
- export interface LocaleContextType {
85
- locale: Locale;
86
- defaultLocale: Locale;
87
- changeLocale: (locale: Locale) => void;
88
- t: (key: string, data?: Record<string, any>) => string;
89
- languages: { code: string; name: string }[];
90
- }
91
-
92
- // FIXME: @wangshijun revert this before release
93
- const LocaleContext = createContext<LocaleContextType>(null!);
94
- const { Provider, Consumer } = LocaleContext;
95
-
96
- function LocaleProvider({
97
- children,
98
- locale = undefined,
99
- fallbackLocale = 'en',
100
- translations,
101
- onLoadingTranslation = undefined,
102
- languages = [],
103
- ...rest
104
- }: LocaleProviderProps) {
105
- const langs = getLanguages(languages);
106
- // eslint-disable-next-line prefer-const
107
- let [currentLocale, setCurrentLocale] = useState<Locale>(locale || getLocale(langs));
108
- const defaultLocale = langs?.[0]?.code ?? fallbackLocale;
109
- const lastCurrentLocale = useRef<string>(defaultLocale);
110
- const [, setForceUpdate] = useState(0);
111
-
112
- const changeLocale = (newLocale: Locale) => {
113
- setCurrentLocale(newLocale);
114
- setLocale(newLocale);
115
- };
116
-
117
- useEffect(() => {
118
- const tmpLocale = locale || getLocale(langs);
119
- if (tmpLocale !== currentLocale) {
120
- changeLocale(tmpLocale);
121
- }
122
- // eslint-disable-next-line react-hooks/exhaustive-deps
123
- }, [locale]);
124
-
125
- // handle async loading of translations
126
- if (currentLocale && translations[currentLocale] && typeof translations[currentLocale] === 'function') {
127
- const tmpLocale = currentLocale;
128
- try {
129
- Promise.resolve(translations[tmpLocale]()).then((res) => {
130
- if (res && typeof res === 'object') {
131
- translations[tmpLocale] = res;
132
- setForceUpdate((x) => (x > 999 ? 0 : x + 1));
133
- }
134
- });
135
- } catch (err) {
136
- console.error(err);
137
- }
138
-
139
- onLoadingTranslation?.(tmpLocale, langs);
140
- currentLocale = lastCurrentLocale.current;
141
- } else {
142
- lastCurrentLocale.current = currentLocale;
143
- }
144
-
145
- const t = useCallback(
146
- (key: string, data?: Record<string, any>) => translate(translations, key, currentLocale, fallbackLocale, data),
147
- [translations, currentLocale, fallbackLocale]
148
- );
149
-
150
- return (
151
- <Provider value={{ locale: currentLocale, changeLocale, t, languages: langs, defaultLocale, ...rest }}>
152
- {children}
153
- </Provider>
154
- );
155
- }
156
-
157
- function useLocaleContext() {
158
- const context = use(LocaleContext);
159
- return context;
160
- }
161
-
162
- export { LocaleProvider, Consumer as LocaleConsumer, LocaleContext, useLocaleContext, setLocale, getLocale };
@@ -1,58 +0,0 @@
1
- // from: https://github.com/meikidd/iso-639-1/blob/master/src/data.js
2
- const languages: Record<string, { name: string; nativeName: string }> = {
3
- ar: {
4
- name: 'Arabic',
5
- nativeName: 'اَلْعَرَبِيَّةُ',
6
- },
7
- de: {
8
- name: 'German',
9
- nativeName: 'Deutsch',
10
- },
11
- en: {
12
- name: 'English',
13
- nativeName: 'English',
14
- },
15
- es: {
16
- name: 'Spanish',
17
- nativeName: 'Español',
18
- },
19
- fr: {
20
- name: 'French',
21
- nativeName: 'Français',
22
- },
23
- it: {
24
- name: 'Italian',
25
- nativeName: 'Italiano',
26
- },
27
- ja: {
28
- name: 'Japanese',
29
- nativeName: '日本語',
30
- },
31
- ko: {
32
- name: 'Korean',
33
- nativeName: '한국어',
34
- },
35
- mn: {
36
- name: 'Mongolian',
37
- nativeName: 'Монгол хэл',
38
- },
39
- pt: {
40
- name: 'Portuguese',
41
- nativeName: 'Português',
42
- },
43
- ru: {
44
- name: 'Russian',
45
- nativeName: 'Русский',
46
- },
47
- zh: {
48
- name: 'Simplified Chinese',
49
- nativeName: '简体中文',
50
- },
51
- 'zh-TW': {
52
- name: 'Traditional Chinese',
53
- nativeName: '繁體中文',
54
- },
55
- };
56
-
57
- export default Object.keys(languages).map((code) => ({ code, ...languages[code] }));
58
- export { languages as map };
@@ -1,174 +0,0 @@
1
- /* eslint-disable react/jsx-no-bind */
2
- import React, { useState, use, useRef, useMemo } from 'react';
3
- import {
4
- Button,
5
- Typography,
6
- IconButton,
7
- Popper,
8
- MenuItem,
9
- MenuList,
10
- Box,
11
- ClickAwayListener,
12
- Paper,
13
- } from '@mui/material';
14
- import { Icon as IconifyIcon } from '@iconify/react';
15
- import CheckIcon from '@iconify-icons/material-symbols/check';
16
- import LanguageIcon from 'iconify-icons-material-symbols-400/language';
17
-
18
- import { LocaleContext } from './context';
19
- import { styled } from '../Theme';
20
- import type { Locale } from '../type';
21
- import { mergeSx } from '../Util/style';
22
-
23
- export interface LocaleSelectorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
24
- showText?: true | false;
25
- popperProps?: React.HTMLAttributes<HTMLDivElement>;
26
- popperType?: 'hover' | 'click';
27
- icon?: React.ComponentType<any>;
28
- size?: number;
29
- onChange?: (locale: Locale) => void;
30
- }
31
-
32
- export default function LocaleSelector({ ...props }: LocaleSelectorProps) {
33
- const { showText = true, popperProps = {}, popperType = 'click', icon: Icon, size = 24, ...rest } = props;
34
- const { locale, changeLocale, languages } = use(LocaleContext);
35
- const anchorEl = useRef<HTMLButtonElement>(null);
36
- const [open, setOpen] = useState(false);
37
-
38
- const onSelect = (newLocale: Locale) => {
39
- changeLocale(newLocale);
40
- setOpen(false);
41
- if (typeof props.onChange === 'function') {
42
- props.onChange(newLocale);
43
- }
44
- };
45
-
46
- const onClose = (e: MouseEvent | TouchEvent) => {
47
- if (anchorEl.current?.contains(e.target as Node)) {
48
- return;
49
- }
50
- setOpen(false);
51
- };
52
-
53
- const ButtonComponent: typeof Button = showText ? Button : IconButton;
54
-
55
- const handleEventProps =
56
- popperType === 'hover'
57
- ? {
58
- onMouseEnter: () => {
59
- setOpen(true);
60
- },
61
- onMouseLeave: () => {
62
- setOpen(false);
63
- },
64
- }
65
- : {
66
- onClick: () => {
67
- setOpen(!open);
68
- },
69
- };
70
-
71
- const renderIcon = useMemo(() => {
72
- if (Icon) {
73
- return <Icon />;
74
- }
75
-
76
- return <IconifyIcon icon={LanguageIcon} fontSize={size} style={{ transform: 'scale(1.10)' }} />;
77
- }, [Icon, size]);
78
-
79
- return (
80
- // @ts-ignore
81
- <Wrapper {...rest} {...handleEventProps}>
82
- <ButtonComponent ref={anchorEl} className="trigger" role="button" aria-label="Locale selector button">
83
- <Box
84
- sx={{
85
- display: 'flex',
86
- alignItems: 'center',
87
- }}>
88
- {renderIcon}
89
-
90
- {showText ? (
91
- <Typography component="strong" className="trigger-text">
92
- {languages.find((x) => x.code === locale)?.name}
93
- </Typography>
94
- ) : (
95
- ''
96
- )}
97
- </Box>
98
- </ButtonComponent>
99
- <Popper
100
- open={open}
101
- anchorEl={anchorEl.current}
102
- {...popperProps}
103
- // @ts-ignore
104
- sx={mergeSx(
105
- // @ts-ignore
106
- { zIndex: (_theme) => _theme.zIndex.tooltip + 10 },
107
- // @ts-ignore
108
- popperProps?.sx
109
- )}>
110
- <Paper
111
- variant="outlined"
112
- className="locales"
113
- sx={{
114
- borderRadius: 1,
115
- }}>
116
- <ClickAwayListener onClickAway={onClose}>
117
- <MenuList>
118
- {languages.map(({ code, name }) => {
119
- return (
120
- <MenuItem
121
- key={code}
122
- className="locale-item"
123
- onClick={() => onSelect(code)}
124
- sx={{
125
- fontSize: 16,
126
- fontStyle: 'normal',
127
- fontStretch: 'normal',
128
- lineHeight: 'normal',
129
- letterSpacing: '2px',
130
- textAlign: 'center',
131
- color: 'text.primary',
132
- cursor: 'pointer',
133
- display: 'flex',
134
- padding: '16px',
135
- alignItems: 'center',
136
- }}>
137
- <Box
138
- component={IconifyIcon}
139
- icon={CheckIcon}
140
- className={code === locale ? 'check-icon check-icon-visible' : 'check-icon'}
141
- sx={{
142
- marginRight: 1,
143
- visibility: code === locale ? 'visible' : 'hidden',
144
- }}
145
- />
146
- {name}
147
- </MenuItem>
148
- );
149
- })}
150
- </MenuList>
151
- </ClickAwayListener>
152
- </Paper>
153
- </Popper>
154
- </Wrapper>
155
- );
156
- }
157
-
158
- const Wrapper = styled(Box)`
159
- display: inline-block;
160
-
161
- .trigger {
162
- display: flex;
163
- flex-direction: column;
164
- justify-content: center;
165
- font-size: 14px;
166
- white-space: nowrap;
167
-
168
- .trigger-text {
169
- margin-left: 5px;
170
- font-size: 14px;
171
- color: ${({ theme }) => theme.palette.text.primary};
172
- }
173
- }
174
- `;
@@ -1,38 +0,0 @@
1
- import get from 'lodash/get';
2
- import type { Locale, Translations } from '../type';
3
-
4
- /* eslint-disable no-prototype-builtins */
5
- export const replace = (template: string | Function, data: Record<string, any>) => {
6
- if (typeof template === 'function') {
7
- return template(data);
8
- }
9
-
10
- return template.replace(/{(\w*)}/g, (m, key) => (data.hasOwnProperty(key) ? data[key] : ''));
11
- };
12
-
13
- export const translate = (
14
- translations: Translations,
15
- key: string,
16
- locale: Locale,
17
- fallbackLocale = 'en',
18
- data = {}
19
- ) => {
20
- const translation = translations[locale];
21
- const translationValue = get(translation, key);
22
- const fallbackValue = get(translations[fallbackLocale], key);
23
-
24
- if (!translation || !translationValue) {
25
- console.warn(`Warning: no ${key} translation of ${locale}`);
26
- if (fallbackLocale && fallbackValue) {
27
- return replace(fallbackValue, data);
28
- }
29
- return key;
30
- }
31
-
32
- if (typeof translations[locale] === 'function' || translations[locale].then) {
33
- return replace(fallbackValue, data);
34
- }
35
- return replace(translationValue, data);
36
- };
37
-
38
- export const t = translate;
@@ -1,23 +0,0 @@
1
- export { default as DarkMode } from './demo/dark-mode';
2
- export { default as DarkModeLogoOnly } from './demo/dark-mode-logo-only';
3
- export { default as DarkModeHorizontal } from './demo/dark-mode-horizontal';
4
- export { default as WithStyling } from './demo/with-styling';
5
- export { default as LightMode } from './demo/light-mode';
6
- export { default as LightModeLogoOnly } from './demo/light-mode-logo-only';
7
- export { default as LightModeHorizontal } from './demo/light-mode-horizontal';
8
-
9
- export default {
10
- title: 'ArcBlock/Logo',
11
-
12
- parameters: {
13
- docs: {
14
- description: {
15
- component: 'Arcblock Logo',
16
- },
17
- },
18
- design: {
19
- type: 'figma',
20
- url: 'https://www.figma.com/file/E8TSBWCOyXzETmVOjzbqvw/ArcBlock-UI-Kit?node-id=2412%3A11100',
21
- },
22
- },
23
- };
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="99" height="18" viewBox="0 0 99 18">
2
- <path fill="#000" fill-rule="evenodd" d="M6.5.053h2.864L16.028 18h-2.114l-1.391-3.795H3.504L2.14 18H0L6.5.053zm1.474 1.481L4.04 12.563h7.895L7.975 1.534zm14.44 3.542c1.27 0 2.198.296 2.78.892.58.597.871 1.52.871 2.765v.36c0 .117-.008.245-.026.385h-1.826c.018-.14.027-.292.027-.452v-.48c0-.766-.186-1.283-.551-1.55-.367-.266-.916-.4-1.65-.4-.968 0-1.698.24-2.189.723-.493.48-.738 1.208-.738 2.187v8.308h-1.88V5.341h1.824l-.079 1.443c.376-.614.863-1.053 1.463-1.316a4.868 4.868 0 0 1 1.974-.392zM35.95 15.903c.501-.328.752-1.205.752-2.63h1.852c0 1.924-.403 3.178-1.208 3.765-.806.589-2.158.882-4.055.882-2.65 0-4.24-.538-4.766-1.616-.529-1.076-.793-2.781-.793-5.114 0-2.118.367-3.645 1.102-4.581.732-.934 2.209-1.401 4.43-1.401 1.378 0 2.569.221 3.572.665 1.002.446 1.503 1.497 1.503 3.153v.188a.234.234 0 0 0-.027.106v.106h-1.826c0-1.12-.228-1.851-.685-2.188-.455-.34-1.23-.507-2.322-.507-1.665 0-2.713.259-3.142.782-.43.524-.646 1.67-.646 3.44V12.2c0 1.4.161 2.448.485 3.15.322.7 1.297 1.048 2.926 1.048 1.397 0 2.346-.165 2.848-.495zm15.87-.318c.606-.328.912-1.263.912-2.805 0-.924-.147-1.69-.444-2.302-.294-.611-1.007-.917-2.133-.917H43.065v6.516h5.528c1.543 0 2.617-.165 3.226-.492zm-8.754-13.85v6.036h5.665c1.325 0 2.239-.214 2.737-.643.503-.428.755-1.288.755-2.575 0-1.09-.192-1.834-.577-2.226-.385-.394-1.116-.591-2.19-.591h-6.39zM52 8.466c1.185.322 1.956.816 2.314 1.482.359.67.54 1.581.54 2.739 0 1.6-.325 2.858-.97 3.764-.647.909-1.874 1.363-3.686 1.363H41.05V0h8.62c1.592 0 2.759.312 3.503.934.744.624 1.115 1.78 1.115 3.473 0 1.014-.129 1.855-.386 2.522-.258.669-.89 1.181-1.903 1.536zm5.43 9.348V.001h1.907v17.812H57.43zm13.374-6.168v-.708c0-1.539-.141-2.636-.426-3.297-.284-.658-1.191-.99-2.718-.99h-.401c-1.617 0-2.625.25-3.025.75-.399.5-.599 1.632-.599 3.4V12.822c0 .206.008.407.024.602a9.48 9.48 0 0 0 .216 1.474c.106.465.275.822.505 1.072.196.179.435.302.72.373.283.072.586.116.905.135h1.254c1.083 0 1.914-.151 2.492-.456.577-.302.9-1.043.972-2.22a18.338 18.338 0 0 0 .054-1.447c.015-.233.027-.47.027-.71zm-3.786-6.518c2.399 0 3.956.414 4.672 1.243.717.828 1.074 2.418 1.074 4.766 0 2.048-.219 3.704-.657 4.966C71.668 17.367 70.16 18 67.581 18c-2.237 0-3.782-.347-4.632-1.042-.85-.694-1.275-2.205-1.275-4.54v-1.174c0-2.12.318-3.669.954-4.646.635-.98 2.099-1.471 4.39-1.471zm16.434 10.776c.501-.328.752-1.205.752-2.63h1.853c0 1.924-.403 3.178-1.209 3.765-.804.589-2.157.882-4.054.882-2.648 0-4.24-.538-4.767-1.616-.528-1.076-.79-2.781-.79-5.114 0-2.118.365-3.645 1.1-4.581.732-.934 2.21-1.401 4.43-1.401 1.377 0 2.568.221 3.571.665 1.003.446 1.504 1.497 1.504 3.153v.188a.232.232 0 0 0-.026.106v.106H83.99c0-1.12-.229-1.851-.686-2.188-.455-.34-1.23-.507-2.323-.507-1.665 0-2.712.259-3.142.782-.43.524-.643 1.67-.643 3.44V12.2c0 1.4.16 2.448.482 3.15.324.7 1.298 1.048 2.927 1.048 1.397 0 2.346-.165 2.847-.495zm9.236-4.82L99 17.813h-2.47l-5.317-6.01h-.752v6.01h-1.907V0h1.907v10.362h.752l4.512-5.02h2.309l-5.346 5.741z"/>
3
- </svg>
@@ -1,6 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="45" height="52" viewBox="0 0 45 52">
2
- <g fill="none" fill-rule="evenodd" stroke="#000">
3
- <path d="M.5 13.077L22.15.577l21.651 12.5v25l-21.65 12.5L.5 38.077zM22.15.577v50M.5 13.077l43.301 25M.5 38.077l43.301-25"/>
4
- <path d="M22.15 38.077l10.826-6.25-10.825-18.75-10.825 18.75z"/>
5
- </g>
6
- </svg>