@arcblock/ux 2.9.91 → 2.10.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.
- package/lib/ActionButton/index.js +36 -48
- package/lib/ActivityIndicator/index.js +122 -75
- package/lib/Address/compact-text.js +48 -66
- package/lib/Address/did-address.js +114 -87
- package/lib/Address/index.js +15 -27
- package/lib/Address/responsive-did-address.js +48 -50
- package/lib/Alert/index.js +58 -52
- package/lib/AnimationWaiter/index.js +123 -69
- package/lib/Async/index.js +8 -22
- package/lib/Avatar/did-motif.js +38 -52
- package/lib/Avatar/etherscan-blockies.js +4 -10
- package/lib/Avatar/index.js +71 -77
- package/lib/Badge/index.js +49 -56
- package/lib/Blocklet/blocklet.js +181 -97
- package/lib/Blocklet/index.js +4 -24
- package/lib/Blocklet/utils.js +50 -13
- package/lib/BlockletContext/index.js +21 -31
- package/lib/BlockletNFT/index.js +255 -115
- package/lib/Button/index.js +5 -11
- package/lib/Button/wrap.js +45 -56
- package/lib/ButtonGroup/index.js +3 -9
- package/lib/CardSelector/index.js +67 -43
- package/lib/Center/index.js +19 -20
- package/lib/ClickToCopy/copy-button.js +37 -50
- package/lib/ClickToCopy/hook.js +10 -18
- package/lib/ClickToCopy/index.js +54 -66
- package/lib/CodeBlock/LightBox.js +84 -11
- package/lib/CodeBlock/index.js +175 -101
- package/lib/Colors/index.js +3 -20
- package/lib/Colors/themes/default.js +1 -7
- package/lib/Colors/themes/temp.js +1 -7
- package/lib/ContactForm/index.js +95 -60
- package/lib/CookieConsent/index.js +58 -52
- package/lib/CountDown/index.js +90 -59
- package/lib/DID/index.js +80 -96
- package/lib/Datatable/CustomToolbar.js +188 -137
- package/lib/Datatable/DatatableContext.js +14 -21
- package/lib/Datatable/TableSearch.js +99 -58
- package/lib/Datatable/index.js +312 -139
- package/lib/Datatable/utils.js +9 -17
- package/lib/Dialog/confirm.js +46 -58
- package/lib/Dialog/dialog.js +110 -66
- package/lib/Dialog/index.js +4 -27
- package/lib/Dialog/use-confirm.js +40 -65
- package/lib/DidLogo/index.js +14 -22
- package/lib/DriftBot/index.js +34 -19
- package/lib/Earth/index.js +214 -110
- package/lib/Earth/util.js +6 -19
- package/lib/Empty/index.js +33 -38
- package/lib/ErrorBoundary/fallback.js +45 -43
- package/lib/ErrorBoundary/index.js +1 -16
- package/lib/Footer/index.js +96 -48
- package/lib/Header/auto-hidden.js +28 -31
- package/lib/Header/header.js +151 -69
- package/lib/Header/index.js +2 -20
- package/lib/Header/responsive-header.js +67 -60
- package/lib/Icon/image.js +41 -45
- package/lib/Icon/index.js +51 -53
- package/lib/Img/index.js +77 -88
- package/lib/InfoRow/index.js +66 -48
- package/lib/Layout/dashboard/external-link.js +38 -53
- package/lib/Layout/dashboard/full-page.js +27 -41
- package/lib/Layout/dashboard/index.js +177 -132
- package/lib/Layout/dashboard/sidebar.js +164 -61
- package/lib/Layout/dashboard-legacy/header.js +119 -66
- package/lib/Layout/dashboard-legacy/index.js +90 -79
- package/lib/Layout/dashboard-legacy/sidebar.js +95 -62
- package/lib/Layout/index.js +200 -106
- package/lib/LoadingMask/index.js +31 -38
- package/lib/Locale/browser-lang.js +2 -8
- package/lib/Locale/context.js +46 -69
- package/lib/Locale/languages.js +6 -15
- package/lib/Locale/selector.js +116 -92
- package/lib/Locale/util.js +7 -16
- package/lib/Logo/index.js +54 -57
- package/lib/Metric/index.js +103 -40
- package/lib/NFTDisplay/aspect-ratio-container.js +33 -40
- package/lib/NFTDisplay/broken.js +68 -52
- package/lib/NFTDisplay/index.js +140 -129
- package/lib/NFTDisplay/loading.js +14 -13
- package/lib/NFTDisplay/svg-embedder/img.js +18 -33
- package/lib/NFTDisplay/svg-embedder/inline-svg.js +28 -32
- package/lib/NavMenu/index.js +2 -13
- package/lib/NavMenu/nav-menu.js +133 -148
- package/lib/NavMenu/style.js +179 -12
- package/lib/PageScroller/index.js +82 -93
- package/lib/PageScroller/story/FifthComponent.js +4 -10
- package/lib/PageScroller/story/FirstComponent.js +4 -10
- package/lib/PageScroller/story/FourthComponent.js +4 -10
- package/lib/PageScroller/story/FullPage.js +21 -28
- package/lib/PageScroller/story/PageContain.js +23 -30
- package/lib/PageScroller/story/SecondComponent.js +4 -10
- package/lib/PageScroller/story/ThirdComponent.js +4 -10
- package/lib/PageScroller/usePrevValue.js +4 -11
- package/lib/Passport/index.js +2 -9
- package/lib/Passport/passport.js +38 -51
- package/lib/PoweredByArcBlock/index.js +19 -33
- package/lib/PricingTable/PricingPlan.js +90 -34
- package/lib/PricingTable/index.js +28 -26
- package/lib/QRCode/index.js +38 -50
- package/lib/RelativeTime/index.js +44 -59
- package/lib/Result/common.js +85 -107
- package/lib/Result/index.js +22 -34
- package/lib/Result/result.js +35 -41
- package/lib/Result/translations.js +1 -7
- package/lib/Screenshot/BaseScreenshot/index.js +65 -43
- package/lib/Screenshot/BaseScreenshot/shells/Macbook.js +17 -27
- package/lib/Screenshot/BaseScreenshot/shells/Phone.js +14 -25
- package/lib/Screenshot/index.js +103 -92
- package/lib/SessionBlocklet/index.js +125 -143
- package/lib/SessionManager/index.js +2 -9
- package/lib/SessionPermission/index.js +13 -23
- package/lib/SessionUser/components/logged-in.js +139 -158
- package/lib/SessionUser/components/session-user-item.js +44 -58
- package/lib/SessionUser/components/session-user-switch.js +133 -152
- package/lib/SessionUser/components/un-login.js +27 -35
- package/lib/SessionUser/components/user-info.js +62 -74
- package/lib/SessionUser/index.js +26 -34
- package/lib/SessionUser/libs/translation.js +1 -7
- package/lib/SessionUser/libs/utils.js +13 -34
- package/lib/Sparkline/index.js +4 -10
- package/lib/Spinner/index.js +11 -17
- package/lib/SplitButton/index.js +72 -68
- package/lib/Success/index.js +28 -34
- package/lib/Switch/index.js +64 -75
- package/lib/Tabs/index.js +84 -103
- package/lib/Tag/index.js +52 -56
- package/lib/TextCollapse/index.js +57 -50
- package/lib/Theme/index.js +8 -47
- package/lib/Theme/theme-provider.js +19 -26
- package/lib/Theme/theme.js +49 -62
- package/lib/Toast/index.js +41 -73
- package/lib/Typography/index.js +44 -55
- package/lib/Util/constant.js +16 -22
- package/lib/Util/deprecate.js +14 -26
- package/lib/Util/federated.js +16 -38
- package/lib/Util/index.js +63 -113
- package/lib/Util/passport.js +23 -33
- package/lib/Util/wallet.js +5 -14
- package/lib/Video/index.js +34 -34
- package/lib/Wallet/Action.js +72 -49
- package/lib/Wallet/Download.js +132 -115
- package/lib/Wallet/Open.js +26 -25
- package/lib/WalletOSIcon/index.js +33 -42
- package/lib/WebWalletSWKeeper/index.js +42 -55
- package/lib/WechatPrompt/index.js +53 -33
- package/lib/index.js +38 -265
- package/lib/withTheme/index.js +53 -33
- package/lib/withTracker/error_boundary.js +7 -18
- package/lib/withTracker/index.js +25 -34
- package/package.json +9 -316
- package/src/WalletOSIcon/index.jsx +1 -1
- package/es/ActionButton/index.js +0 -99
- package/es/ActivityIndicator/index.js +0 -180
- package/es/Address/compact-text.js +0 -105
- package/es/Address/did-address.js +0 -222
- package/es/Address/index.js +0 -23
- package/es/Address/responsive-did-address.js +0 -87
- package/es/Alert/index.js +0 -134
- package/es/AnimationWaiter/default-animation.json +0 -1
- package/es/AnimationWaiter/index.js +0 -240
- package/es/Async/index.js +0 -38
- package/es/Avatar/did-motif.js +0 -68
- package/es/Avatar/etherscan-blockies.js +0 -83
- package/es/Avatar/index.js +0 -179
- package/es/Badge/index.js +0 -98
- package/es/Blocklet/blocklet.js +0 -298
- package/es/Blocklet/index.js +0 -4
- package/es/Blocklet/utils.js +0 -52
- package/es/BlockletContext/index.js +0 -65
- package/es/BlockletNFT/index.js +0 -412
- package/es/Button/index.js +0 -8
- package/es/Button/wrap.js +0 -140
- package/es/ButtonGroup/index.js +0 -6
- package/es/CardSelector/index.js +0 -149
- package/es/Center/index.js +0 -41
- package/es/ClickToCopy/copy-button.js +0 -72
- package/es/ClickToCopy/hook.js +0 -39
- package/es/ClickToCopy/index.js +0 -92
- package/es/CodeBlock/LightBox.js +0 -85
- package/es/CodeBlock/index.js +0 -222
- package/es/Colors/index.js +0 -3
- package/es/Colors/themes/default.js +0 -77
- package/es/Colors/themes/temp.js +0 -41
- package/es/ContactForm/index.js +0 -230
- package/es/CookieConsent/index.js +0 -113
- package/es/CountDown/index.js +0 -178
- package/es/DID/index.js +0 -249
- package/es/Datatable/CustomToolbar.js +0 -396
- package/es/Datatable/DatatableContext.js +0 -34
- package/es/Datatable/TableSearch.js +0 -166
- package/es/Datatable/index.js +0 -629
- package/es/Datatable/utils.js +0 -132
- package/es/Dialog/confirm.js +0 -123
- package/es/Dialog/dialog.js +0 -201
- package/es/Dialog/index.js +0 -4
- package/es/Dialog/types.d.ts +0 -17
- package/es/Dialog/use-confirm.js +0 -133
- package/es/DidLogo/index.js +0 -31
- package/es/DriftBot/index.js +0 -70
- package/es/Earth/countries.json +0 -8057
- package/es/Earth/index.js +0 -521
- package/es/Earth/util.js +0 -51
- package/es/Empty/index.js +0 -65
- package/es/ErrorBoundary/fallback.js +0 -73
- package/es/ErrorBoundary/index.js +0 -1
- package/es/Footer/index.js +0 -172
- package/es/Header/auto-hidden.js +0 -35
- package/es/Header/header.js +0 -223
- package/es/Header/index.js +0 -2
- package/es/Header/responsive-header.js +0 -146
- package/es/Icon/image.js +0 -65
- package/es/Icon/index.js +0 -84
- package/es/Img/index.js +0 -218
- package/es/InfoRow/index.js +0 -87
- package/es/Layout/dashboard/external-link.js +0 -58
- package/es/Layout/dashboard/full-page.js +0 -53
- package/es/Layout/dashboard/index.js +0 -282
- package/es/Layout/dashboard/sidebar.js +0 -209
- package/es/Layout/dashboard-legacy/header.js +0 -174
- package/es/Layout/dashboard-legacy/index.js +0 -148
- package/es/Layout/dashboard-legacy/sidebar.js +0 -129
- package/es/Layout/index.js +0 -335
- package/es/LoadingMask/index.js +0 -102
- package/es/Locale/browser-lang.js +0 -52
- package/es/Locale/context.js +0 -139
- package/es/Locale/languages.js +0 -60
- package/es/Locale/selector.js +0 -186
- package/es/Locale/util.js +0 -21
- package/es/Logo/images/logo-dark-text.svg +0 -3
- package/es/Logo/images/logo-dark-top.svg +0 -6
- package/es/Logo/images/logo-light-text.svg +0 -3
- package/es/Logo/images/logo-light-top.svg +0 -6
- package/es/Logo/index.js +0 -136
- package/es/Metric/index.js +0 -132
- package/es/NFTDisplay/NFTBroken.svg +0 -34
- package/es/NFTDisplay/README.md +0 -59
- package/es/NFTDisplay/aspect-ratio-container.js +0 -39
- package/es/NFTDisplay/broken.js +0 -132
- package/es/NFTDisplay/demo/data/asset-state-display-url.json +0 -7
- package/es/NFTDisplay/demo/data/asset-state-gzipped-svg-1-1.json +0 -10
- package/es/NFTDisplay/demo/data/asset-state-gzipped-svg-374-130.json +0 -10
- package/es/NFTDisplay/demo/data/asset-state-gzipped-svg-with-foreign-object.json +0 -20
- package/es/NFTDisplay/demo/data/asset-state-svg.json +0 -29
- package/es/NFTDisplay/demo/data/asset-state-url.json +0 -10
- package/es/NFTDisplay/index.js +0 -328
- package/es/NFTDisplay/loading.js +0 -18
- package/es/NFTDisplay/svg-embedder/img.js +0 -45
- package/es/NFTDisplay/svg-embedder/inline-svg.js +0 -39
- package/es/NavMenu/index.js +0 -2
- package/es/NavMenu/nav-menu.js +0 -358
- package/es/NavMenu/style.js +0 -181
- package/es/PageScroller/index.js +0 -286
- package/es/PageScroller/story/FifthComponent.js +0 -9
- package/es/PageScroller/story/FirstComponent.js +0 -9
- package/es/PageScroller/story/FourthComponent.js +0 -12
- package/es/PageScroller/story/FullPage.js +0 -47
- package/es/PageScroller/story/PageContain.js +0 -59
- package/es/PageScroller/story/SecondComponent.js +0 -9
- package/es/PageScroller/story/ThirdComponent.js +0 -9
- package/es/PageScroller/story/index.css +0 -115
- package/es/PageScroller/usePrevValue.js +0 -9
- package/es/Passport/index.js +0 -2
- package/es/Passport/passport.js +0 -103
- package/es/PoweredByArcBlock/index.js +0 -31
- package/es/PricingTable/PricingPlan.js +0 -124
- package/es/PricingTable/index.js +0 -53
- package/es/QRCode/index.js +0 -73
- package/es/RelativeTime/index.js +0 -107
- package/es/Result/common.js +0 -140
- package/es/Result/demo/fixtures/result-image-404.svg +0 -1
- package/es/Result/index.js +0 -33
- package/es/Result/result.js +0 -59
- package/es/Result/translations.js +0 -54
- package/es/Screenshot/BaseScreenshot/index.js +0 -91
- package/es/Screenshot/BaseScreenshot/shells/Macbook.js +0 -51
- package/es/Screenshot/BaseScreenshot/shells/Phone.js +0 -36
- package/es/Screenshot/demo/images/bg-00.jpg +0 -0
- package/es/Screenshot/demo/images/bg-01.jpg +0 -0
- package/es/Screenshot/demo/images/bg-02.jpg +0 -0
- package/es/Screenshot/demo/images/bg-03.jpg +0 -0
- package/es/Screenshot/demo/images/bg-04.jpg +0 -0
- package/es/Screenshot/demo/images/bg-05.jpg +0 -0
- package/es/Screenshot/demo/images/bg-06.jpg +0 -0
- package/es/Screenshot/demo/images/bg-07.jpg +0 -0
- package/es/Screenshot/demo/images/bg-08.jpg +0 -0
- package/es/Screenshot/demo/images/bg-09.jpg +0 -0
- package/es/Screenshot/devices.css +0 -1366
- package/es/Screenshot/index.js +0 -299
- package/es/SessionBlocklet/index.js +0 -173
- package/es/SessionManager/index.js +0 -2
- package/es/SessionPermission/index.js +0 -28
- package/es/SessionUser/components/logged-in.js +0 -229
- package/es/SessionUser/components/session-user-item.js +0 -102
- package/es/SessionUser/components/session-user-switch.js +0 -223
- package/es/SessionUser/components/un-login.js +0 -64
- package/es/SessionUser/components/user-info.js +0 -167
- package/es/SessionUser/index.js +0 -49
- package/es/SessionUser/libs/translation.js +0 -19
- package/es/SessionUser/libs/utils.js +0 -29
- package/es/Sparkline/index.js +0 -193
- package/es/Spinner/index.js +0 -28
- package/es/SplitButton/index.js +0 -145
- package/es/Success/index.js +0 -175
- package/es/Switch/index.js +0 -96
- package/es/Tabs/index.js +0 -214
- package/es/Tag/index.js +0 -108
- package/es/TextCollapse/index.js +0 -92
- package/es/Theme/index.js +0 -16
- package/es/Theme/theme-provider.js +0 -39
- package/es/Theme/theme.js +0 -145
- package/es/Toast/index.js +0 -97
- package/es/Typography/index.js +0 -95
- package/es/Util/constant.js +0 -42
- package/es/Util/deprecate.js +0 -28
- package/es/Util/federated.js +0 -91
- package/es/Util/index.js +0 -363
- package/es/Util/passport.js +0 -62
- package/es/Util/wallet.js +0 -32
- package/es/Video/index.js +0 -89
- package/es/Wallet/Action.js +0 -119
- package/es/Wallet/Download.js +0 -331
- package/es/Wallet/Open.js +0 -45
- package/es/Wallet/images/abtwallet.png +0 -0
- package/es/Wallet/images/android_download.svg +0 -23
- package/es/Wallet/images/app-store.svg +0 -20
- package/es/Wallet/images/google-play.svg +0 -70
- package/es/WalletOSIcon/index.js +0 -82
- package/es/WebWalletSWKeeper/index.js +0 -117
- package/es/WechatPrompt/images/android.png +0 -0
- package/es/WechatPrompt/images/ios.png +0 -0
- package/es/WechatPrompt/index.js +0 -88
- package/es/index.js +0 -38
- package/es/withTheme/index.js +0 -69
- package/es/withTracker/README.md +0 -34
- package/es/withTracker/error_boundary.js +0 -34
- package/es/withTracker/index.js +0 -55
package/lib/NFTDisplay/index.js
CHANGED
@@ -1,54 +1,37 @@
|
|
1
|
-
"use strict";
|
2
|
-
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.default = void 0;
|
7
|
-
exports.getNFTData = getNFTData;
|
8
|
-
var _react = require("react");
|
9
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
10
|
-
var _clsx = _interopRequireDefault(require("clsx"));
|
11
|
-
var _buffer = require("buffer");
|
12
|
-
var _get = _interopRequireDefault(require("lodash/get"));
|
13
|
-
var _pako = _interopRequireDefault(require("pako"));
|
14
|
-
var _base64Url = _interopRequireDefault(require("base64-url"));
|
15
|
-
var _isSvg = _interopRequireDefault(require("is-svg"));
|
16
|
-
var _reactSvg = require("react-svg");
|
17
|
-
var _noop = _interopRequireDefault(require("lodash/noop"));
|
18
|
-
var _aspectRatioContainer = _interopRequireDefault(require("./aspect-ratio-container"));
|
19
|
-
var _img = _interopRequireDefault(require("./svg-embedder/img"));
|
20
|
-
var _inlineSvg = _interopRequireDefault(require("./svg-embedder/inline-svg"));
|
21
|
-
var _loading = _interopRequireDefault(require("./loading"));
|
22
|
-
var _broken = _interopRequireDefault(require("./broken"));
|
23
|
-
var _Theme = require("../Theme");
|
24
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
25
|
-
var _templateObject;
|
26
|
-
const _excluded = ["data", "address", "inset", "aspect", "component", "className", "renderError", "renderLoading", "preferredSvgEmbedder", "checkSvg", "minimumLoadingTime", "onCompleted"],
|
27
|
-
_excluded2 = ["aspect", "inset"];
|
28
1
|
/* eslint-disable react-hooks/rules-of-hooks */
|
2
|
+
import { useRef, useEffect, useState } from 'react';
|
3
|
+
import PropTypes from 'prop-types';
|
4
|
+
import clsx from 'clsx';
|
5
|
+
import { Buffer } from 'buffer';
|
6
|
+
import get from 'lodash/get';
|
7
|
+
import pako from 'pako';
|
8
|
+
import base64 from 'base64-url';
|
9
|
+
import isSvg from 'is-svg';
|
10
|
+
import { ReactSVG } from 'react-svg';
|
11
|
+
import noop from 'lodash/noop';
|
12
|
+
import AspectRatioContainer from './aspect-ratio-container';
|
13
|
+
import ImgSvgEmbedder from './svg-embedder/img';
|
14
|
+
import InlineSvgEmbedder from './svg-embedder/inline-svg';
|
15
|
+
import DefaultLoading from './loading';
|
16
|
+
import DefaultBrokenImage from './broken';
|
17
|
+
import { styled } from '../Theme';
|
18
|
+
|
29
19
|
/**
|
30
20
|
* 从 assetState 中获取 nft data, 兼容新旧两种类型的数据结构, 建议将该方法的返回值传入 NFTDisplay 组件的 data prop
|
31
21
|
* - 旧: assetState.data.value (.credentialSubject.display)
|
32
22
|
* - 新: assetState.display
|
33
23
|
*/
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
|
40
|
-
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
41
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
42
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
43
|
-
function getNFTData(assetState) {
|
44
|
-
var _assetState$data;
|
45
|
-
return (assetState === null || assetState === void 0 ? void 0 : assetState.display) || (assetState === null || assetState === void 0 ? void 0 : (_assetState$data = assetState.data) === null || _assetState$data === void 0 ? void 0 : _assetState$data.value);
|
24
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
25
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
26
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
27
|
+
export function getNFTData(assetState) {
|
28
|
+
return assetState?.display || assetState?.data?.value;
|
46
29
|
}
|
47
30
|
function fromBase64(v) {
|
48
31
|
if (typeof v !== 'string') {
|
49
32
|
throw new Error('fromBase64 requires input to be a string');
|
50
33
|
}
|
51
|
-
return
|
34
|
+
return Buffer.from(base64.unescape(v), 'base64');
|
52
35
|
}
|
53
36
|
|
54
37
|
// const isVC = type => {
|
@@ -58,8 +41,8 @@ function fromBase64(v) {
|
|
58
41
|
// 仅针对非 url type 的情况
|
59
42
|
const getSvgEmbedder = preferredSvgEmbedder => {
|
60
43
|
const embedders = {
|
61
|
-
img:
|
62
|
-
svg:
|
44
|
+
img: ImgSvgEmbedder,
|
45
|
+
svg: InlineSvgEmbedder
|
63
46
|
};
|
64
47
|
return embedders[preferredSvgEmbedder];
|
65
48
|
};
|
@@ -69,31 +52,30 @@ const getSvgEmbedder = preferredSvgEmbedder => {
|
|
69
52
|
* 考虑把 asset data 解析部分和 nft display 分离, android 端有相关使用场景 - 只传入 svg 或 url, 也可以传入 asset data,
|
70
53
|
* 目前如果想直接传入 svg 或 url, 需要构造一个 asset data 的数据才能使用 NFTDisplay 组件
|
71
54
|
*/
|
72
|
-
function NFTDisplay(
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
className: (0, _clsx.default)(className, {
|
55
|
+
function NFTDisplay({
|
56
|
+
data,
|
57
|
+
address,
|
58
|
+
inset,
|
59
|
+
aspect,
|
60
|
+
component,
|
61
|
+
className,
|
62
|
+
renderError,
|
63
|
+
renderLoading,
|
64
|
+
preferredSvgEmbedder,
|
65
|
+
checkSvg,
|
66
|
+
minimumLoadingTime,
|
67
|
+
onCompleted,
|
68
|
+
...rest
|
69
|
+
}) {
|
70
|
+
const wrapRoot = children => /*#__PURE__*/_jsx(Root, {
|
71
|
+
as: component,
|
72
|
+
...rest,
|
73
|
+
className: clsx(className, {
|
92
74
|
'nft-display--inset': inset
|
93
75
|
}),
|
94
76
|
children: children
|
95
|
-
})
|
96
|
-
const parsed =
|
77
|
+
});
|
78
|
+
const parsed = useRef(data);
|
97
79
|
try {
|
98
80
|
// 如果是 raw data 先解析
|
99
81
|
if (typeof parsed.current === 'string') {
|
@@ -104,7 +86,7 @@ function NFTDisplay(_ref) {
|
|
104
86
|
vcId
|
105
87
|
} = parsed.current;
|
106
88
|
// 需要兼容新旧两种类型的数据结构, nft data 有 credentialSubject 属性, 说明是旧 nft data, 否则是新 nft data
|
107
|
-
const display = parsed.current.credentialSubject ? (
|
89
|
+
const display = parsed.current.credentialSubject ? get(parsed.current, 'credentialSubject.display') : parsed.current;
|
108
90
|
const {
|
109
91
|
content,
|
110
92
|
type
|
@@ -112,14 +94,14 @@ function NFTDisplay(_ref) {
|
|
112
94
|
const isUrlType = type === 'url';
|
113
95
|
|
114
96
|
// 首次加载, 对于 url type 的情况, loading 为 true
|
115
|
-
const [state, setState] =
|
97
|
+
const [state, setState] = useState({
|
116
98
|
loading: isUrlType,
|
117
99
|
error: false
|
118
100
|
});
|
119
|
-
const [minimumLoadingReady, setMinimumLoadingReady] =
|
101
|
+
const [minimumLoadingReady, setMinimumLoadingReady] = useState(minimumLoadingTime <= 0);
|
120
102
|
// console.log('[debug] render', {type, minimumLoadingTime}, JSON.stringify(state))
|
121
103
|
|
122
|
-
|
104
|
+
useEffect(() => {
|
123
105
|
let timer;
|
124
106
|
if (minimumLoadingTime > 0) {
|
125
107
|
timer = setTimeout(() => setMinimumLoadingReady(true), minimumLoadingTime);
|
@@ -129,7 +111,7 @@ function NFTDisplay(_ref) {
|
|
129
111
|
}, []);
|
130
112
|
|
131
113
|
// onCompleted
|
132
|
-
|
114
|
+
useEffect(() => {
|
133
115
|
if (!state.loading && minimumLoadingReady || state.error) {
|
134
116
|
onCompleted();
|
135
117
|
}
|
@@ -143,7 +125,6 @@ function NFTDisplay(_ref) {
|
|
143
125
|
switch (type) {
|
144
126
|
case 'url':
|
145
127
|
{
|
146
|
-
var _state$fallback;
|
147
128
|
const urlObj = new URL(content);
|
148
129
|
if (!urlObj.searchParams.has('assetId')) {
|
149
130
|
urlObj.searchParams.append('assetId', address);
|
@@ -154,39 +135,40 @@ function NFTDisplay(_ref) {
|
|
154
135
|
const url = urlObj.href;
|
155
136
|
const safeOnLoad = () => {
|
156
137
|
if (state.loading) {
|
157
|
-
setState(
|
138
|
+
setState({
|
139
|
+
...state,
|
158
140
|
loading: false
|
159
|
-
})
|
141
|
+
});
|
160
142
|
}
|
161
143
|
};
|
162
|
-
return state.fallback ?
|
144
|
+
return state.fallback ? state.fallback?.() : /*#__PURE__*/_jsx(ReactSVG, {
|
163
145
|
src: url,
|
164
146
|
beforeInjection: svg => {
|
165
147
|
svg.setAttribute('style', 'pointer-events: none; width: 100%; height: 100%;');
|
166
148
|
},
|
167
149
|
afterInjection: safeOnLoad,
|
168
150
|
onError: error => {
|
169
|
-
var _error$message, _error$message2;
|
170
151
|
let objectType = null;
|
171
|
-
if (
|
172
|
-
|
173
|
-
|
174
|
-
} else if ((error === null || error === void 0 ? void 0 : (_error$message2 = error.message) === null || _error$message2 === void 0 ? void 0 : _error$message2.indexOf('Unable to load SVG file: ')) > -1) {
|
152
|
+
if (error?.message?.indexOf('Invalid content type: ') > -1) {
|
153
|
+
objectType = error.message.split('Invalid content type: ')?.[1];
|
154
|
+
} else if (error?.message?.indexOf('Unable to load SVG file: ') > -1) {
|
175
155
|
objectType = 'image/svg+xml';
|
176
156
|
}
|
177
|
-
setState(
|
157
|
+
setState({
|
158
|
+
...state,
|
178
159
|
// fallback to object, and use objectType to render
|
179
160
|
fallback: () =>
|
180
161
|
/*#__PURE__*/
|
181
162
|
// eslint-disable-next-line jsx-a11y/alt-text
|
182
|
-
(
|
163
|
+
_jsx("object", {
|
183
164
|
type: objectType,
|
184
165
|
data: url,
|
185
166
|
onErrorCapture: () => {
|
186
|
-
setState(
|
167
|
+
setState({
|
168
|
+
...state,
|
187
169
|
error: true,
|
188
170
|
loading: false
|
189
|
-
})
|
171
|
+
});
|
190
172
|
},
|
191
173
|
onLoad: safeOnLoad,
|
192
174
|
style: {
|
@@ -195,7 +177,7 @@ function NFTDisplay(_ref) {
|
|
195
177
|
pointerEvents: 'none'
|
196
178
|
}
|
197
179
|
}, url)
|
198
|
-
})
|
180
|
+
});
|
199
181
|
}
|
200
182
|
// evalScripts="always"
|
201
183
|
,
|
@@ -204,36 +186,38 @@ function NFTDisplay(_ref) {
|
|
204
186
|
}
|
205
187
|
case 'uri':
|
206
188
|
{
|
207
|
-
return /*#__PURE__*/(
|
189
|
+
return /*#__PURE__*/_jsx("img", {
|
208
190
|
src: content,
|
209
|
-
onError: () => setState(
|
191
|
+
onError: () => setState({
|
192
|
+
...state,
|
210
193
|
error: true
|
211
|
-
})
|
212
|
-
onLoad: () => setState(
|
194
|
+
}),
|
195
|
+
onLoad: () => setState({
|
196
|
+
...state,
|
213
197
|
loading: false
|
214
|
-
})
|
198
|
+
}),
|
215
199
|
alt: "NFT Display"
|
216
200
|
});
|
217
201
|
}
|
218
202
|
case 'svg_gzipped':
|
219
203
|
{
|
220
|
-
const buffer =
|
221
|
-
const svg =
|
222
|
-
if (checkSvg && !(
|
204
|
+
const buffer = pako.ungzip(fromBase64(content), {});
|
205
|
+
const svg = Buffer.from(buffer).toString('utf8');
|
206
|
+
if (checkSvg && !isSvg(svg)) {
|
223
207
|
throw new Error('Invalid SVG of type svg_gzipped');
|
224
208
|
}
|
225
209
|
const Embedder = getSvgEmbedder(preferredSvgEmbedder);
|
226
|
-
return /*#__PURE__*/(
|
210
|
+
return /*#__PURE__*/_jsx(Embedder, {
|
227
211
|
svg: svg
|
228
212
|
});
|
229
213
|
}
|
230
214
|
case 'svg':
|
231
215
|
{
|
232
|
-
if (checkSvg && !(
|
216
|
+
if (checkSvg && !isSvg(content)) {
|
233
217
|
throw new Error('Invalid SVG of type svg');
|
234
218
|
}
|
235
219
|
const Embedder = getSvgEmbedder(preferredSvgEmbedder);
|
236
|
-
return /*#__PURE__*/(
|
220
|
+
return /*#__PURE__*/_jsx(Embedder, {
|
237
221
|
svg: content
|
238
222
|
});
|
239
223
|
}
|
@@ -245,38 +229,37 @@ function NFTDisplay(_ref) {
|
|
245
229
|
default:
|
246
230
|
}
|
247
231
|
}
|
248
|
-
throw new Error(
|
232
|
+
throw new Error(`unsupported display protocol: ${display.type}`);
|
249
233
|
};
|
250
|
-
return wrapRoot( /*#__PURE__*/(
|
251
|
-
children: [(state.loading || !minimumLoadingReady) && (renderLoading ? renderLoading() : /*#__PURE__*/(
|
234
|
+
return wrapRoot( /*#__PURE__*/_jsxs(_Fragment, {
|
235
|
+
children: [(state.loading || !minimumLoadingReady) && (renderLoading ? renderLoading() : /*#__PURE__*/_jsx(DefaultLoading, {})), renderNFT()]
|
252
236
|
}));
|
253
237
|
} catch (e) {
|
254
|
-
|
255
|
-
console.error(e === null || e === void 0 ? void 0 : e.message, {
|
238
|
+
console.error(e?.message, {
|
256
239
|
nftId: address,
|
257
|
-
vcId: parsed
|
240
|
+
vcId: parsed?.current?.vcId
|
258
241
|
});
|
259
|
-
return wrapRoot(renderError ? renderError() : /*#__PURE__*/(
|
242
|
+
return wrapRoot(renderError ? renderError() : /*#__PURE__*/_jsx(DefaultBrokenImage, {}));
|
260
243
|
}
|
261
244
|
}
|
262
245
|
NFTDisplay.propTypes = {
|
263
246
|
// asset data 可以是 raw data 和 parsed data
|
264
|
-
data:
|
265
|
-
address:
|
266
|
-
component:
|
267
|
-
inset:
|
268
|
-
aspect:
|
269
|
-
className:
|
270
|
-
renderError:
|
271
|
-
renderLoading:
|
247
|
+
data: PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired,
|
248
|
+
address: PropTypes.string.isRequired,
|
249
|
+
component: PropTypes.string,
|
250
|
+
inset: PropTypes.bool,
|
251
|
+
aspect: PropTypes.number,
|
252
|
+
className: PropTypes.string,
|
253
|
+
renderError: PropTypes.func,
|
254
|
+
renderLoading: PropTypes.func,
|
272
255
|
// 对于非 url type 的情况, 支持优先选用的 svg 嵌入方式, 默认是 img
|
273
|
-
preferredSvgEmbedder:
|
256
|
+
preferredSvgEmbedder: PropTypes.oneOf(['img', 'svg']),
|
274
257
|
// 针对非 url type 的情况, 检测 svg 有效性, 默认禁用
|
275
|
-
checkSvg:
|
258
|
+
checkSvg: PropTypes.bool,
|
276
259
|
// loading 最小显示时间 (避免闪烁)
|
277
|
-
minimumLoadingTime:
|
260
|
+
minimumLoadingTime: PropTypes.number,
|
278
261
|
// 完成回调, 无论加载成功|失败
|
279
|
-
onCompleted:
|
262
|
+
onCompleted: PropTypes.func
|
280
263
|
};
|
281
264
|
NFTDisplay.defaultProps = {
|
282
265
|
component: 'span',
|
@@ -288,30 +271,58 @@ NFTDisplay.defaultProps = {
|
|
288
271
|
preferredSvgEmbedder: 'img',
|
289
272
|
checkSvg: false,
|
290
273
|
minimumLoadingTime: 0,
|
291
|
-
onCompleted:
|
274
|
+
onCompleted: noop
|
292
275
|
};
|
293
|
-
const Root =
|
276
|
+
const Root = styled('div')`
|
277
|
+
display: flex;
|
278
|
+
justify-content: center;
|
279
|
+
align-items: center;
|
280
|
+
position: relative;
|
281
|
+
/* 默认尺寸 */
|
282
|
+
width: 150px;
|
283
|
+
height: 150px;
|
284
|
+
overflow: hidden;
|
285
|
+
|
286
|
+
&,
|
287
|
+
img,
|
288
|
+
object {
|
289
|
+
max-width: 100%;
|
290
|
+
max-height: 100%;
|
291
|
+
}
|
292
|
+
|
293
|
+
img,
|
294
|
+
object {
|
295
|
+
width: 100%;
|
296
|
+
height: 100%;
|
297
|
+
}
|
298
|
+
|
299
|
+
&.nft-display--inset {
|
300
|
+
width: 100%;
|
301
|
+
height: 100%;
|
302
|
+
}
|
303
|
+
`;
|
294
304
|
function withAspectRatio(Component) {
|
295
305
|
// eslint-disable-next-line func-names, react/prop-types
|
296
|
-
return function (
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
rest = _objectWithoutProperties(_ref2, _excluded2);
|
306
|
+
return function ({
|
307
|
+
aspect,
|
308
|
+
inset,
|
309
|
+
...rest
|
310
|
+
}) {
|
302
311
|
// inset 比 aspect ratio 优先级高, 如果同时设置了 inset 和 aspect, 则后者不生效
|
303
312
|
const applyAspectRatio = aspect > 0 && !inset;
|
304
313
|
if (applyAspectRatio) {
|
305
|
-
return /*#__PURE__*/(
|
314
|
+
return /*#__PURE__*/_jsx(AspectRatioContainer, {
|
306
315
|
aspect: aspect,
|
307
|
-
children: /*#__PURE__*/(
|
308
|
-
inset: true
|
309
|
-
|
316
|
+
children: /*#__PURE__*/_jsx(Component, {
|
317
|
+
inset: true,
|
318
|
+
...rest
|
319
|
+
})
|
310
320
|
});
|
311
321
|
}
|
312
|
-
return /*#__PURE__*/(
|
313
|
-
inset: inset
|
314
|
-
|
322
|
+
return /*#__PURE__*/_jsx(Component, {
|
323
|
+
inset: inset,
|
324
|
+
...rest
|
325
|
+
});
|
315
326
|
};
|
316
327
|
}
|
317
|
-
|
328
|
+
export default withAspectRatio(NFTDisplay);
|
@@ -1,17 +1,18 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
});
|
6
|
-
exports.default = Loading;
|
7
|
-
var _Theme = require("../Theme");
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
9
|
-
var _templateObject;
|
10
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
11
|
-
function Loading() {
|
12
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
|
1
|
+
import { styled } from '../Theme';
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
3
|
+
export default function Loading() {
|
4
|
+
return /*#__PURE__*/_jsx(Root, {
|
13
5
|
className: "nft-display__loading",
|
14
6
|
children: "Loading..."
|
15
7
|
});
|
16
8
|
}
|
17
|
-
const Root =
|
9
|
+
const Root = styled('span')`
|
10
|
+
display: flex;
|
11
|
+
justify-content: center;
|
12
|
+
align-items: center;
|
13
|
+
position: absolute;
|
14
|
+
width: 100%;
|
15
|
+
height: 100%;
|
16
|
+
color: #ccc;
|
17
|
+
background-color: #eee;
|
18
|
+
`;
|
@@ -1,21 +1,6 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.default = void 0;
|
7
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
8
|
-
var _inlineSvg = _interopRequireDefault(require("./inline-svg"));
|
9
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
10
|
-
const _excluded = ["svg", "alt", "fallback"];
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
12
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
13
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
14
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
15
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
|
16
|
-
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
17
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
18
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
1
|
+
import PropTypes from 'prop-types';
|
2
|
+
import InlineSvgEmbedder from './inline-svg';
|
3
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
19
4
|
const svgToImgUrl = svg => {
|
20
5
|
// fix: #225, https://stackoverflow.com/a/52135328)
|
21
6
|
const blob = new Blob([svg], {
|
@@ -27,34 +12,34 @@ const svgToImgUrl = svg => {
|
|
27
12
|
/**
|
28
13
|
* 基于 <img> 嵌入 svg
|
29
14
|
*/
|
30
|
-
function ImgEmbedder(
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
15
|
+
function ImgEmbedder({
|
16
|
+
svg,
|
17
|
+
alt,
|
18
|
+
fallback,
|
19
|
+
...rest
|
20
|
+
}) {
|
37
21
|
// 包含 foreignObject 的 svg, fallback 到 shadow dom
|
38
22
|
if (fallback && svg.indexOf('</foreignObject>') > -1) {
|
39
|
-
return /*#__PURE__*/(
|
23
|
+
return /*#__PURE__*/_jsx(InlineSvgEmbedder, {
|
40
24
|
svg: svg
|
41
25
|
});
|
42
26
|
}
|
43
27
|
const url = svgToImgUrl(svg);
|
44
|
-
return /*#__PURE__*/(
|
28
|
+
return /*#__PURE__*/_jsx("img", {
|
45
29
|
src: url,
|
46
30
|
onLoad: () => URL.revokeObjectURL(url),
|
47
|
-
alt: alt
|
48
|
-
|
31
|
+
alt: alt,
|
32
|
+
...rest
|
33
|
+
});
|
49
34
|
}
|
50
35
|
ImgEmbedder.propTypes = {
|
51
|
-
svg:
|
52
|
-
alt:
|
36
|
+
svg: PropTypes.string.isRequired,
|
37
|
+
alt: PropTypes.string,
|
53
38
|
// 对于包含 foreignObject 的 svg, fallback 到 inline svg + shadow DOM
|
54
|
-
fallback:
|
39
|
+
fallback: PropTypes.bool
|
55
40
|
};
|
56
41
|
ImgEmbedder.defaultProps = {
|
57
42
|
alt: '',
|
58
43
|
fallback: true
|
59
44
|
};
|
60
|
-
|
45
|
+
export default ImgEmbedder;
|
@@ -1,43 +1,39 @@
|
|
1
|
-
|
1
|
+
import PropTypes from 'prop-types';
|
2
|
+
import root from 'react-shadow/emotion';
|
3
|
+
import { styled } from '../../Theme';
|
2
4
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.default = void 0;
|
7
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
8
|
-
var _emotion = _interopRequireDefault(require("react-shadow/emotion"));
|
9
|
-
var _Theme = require("../../Theme");
|
10
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
11
|
-
var _templateObject, _templateObject2;
|
12
|
-
const _excluded = ["svg"];
|
13
5
|
/**
|
14
6
|
* inline svg 的方式嵌入 svg, 使用 shadow DOM 避免样式污染
|
15
7
|
*/
|
16
|
-
|
17
|
-
function
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
25
|
-
function InlineSvg(_ref) {
|
26
|
-
let {
|
27
|
-
svg
|
28
|
-
} = _ref,
|
29
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
30
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, _objectSpread(_objectSpread({}, rest), {}, {
|
31
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Inner, {
|
8
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
9
|
+
function InlineSvg({
|
10
|
+
svg,
|
11
|
+
...rest
|
12
|
+
}) {
|
13
|
+
return /*#__PURE__*/_jsx(Root, {
|
14
|
+
...rest,
|
15
|
+
children: /*#__PURE__*/_jsx(Inner, {
|
32
16
|
dangerouslySetInnerHTML: {
|
33
17
|
__html: svg
|
34
18
|
}
|
35
19
|
})
|
36
|
-
})
|
20
|
+
});
|
37
21
|
}
|
38
22
|
InlineSvg.propTypes = {
|
39
|
-
svg:
|
23
|
+
svg: PropTypes.string.isRequired
|
40
24
|
};
|
41
|
-
const Root =
|
42
|
-
|
43
|
-
|
25
|
+
const Root = styled(root.span)`
|
26
|
+
display: block;
|
27
|
+
width: 100%;
|
28
|
+
height: 100%;
|
29
|
+
`;
|
30
|
+
const Inner = styled('div')`
|
31
|
+
&,
|
32
|
+
& > svg {
|
33
|
+
height: 100%;
|
34
|
+
width: 100%;
|
35
|
+
min-width: 100%;
|
36
|
+
max-width: 100%;
|
37
|
+
}
|
38
|
+
`;
|
39
|
+
export default InlineSvg;
|
package/lib/NavMenu/index.js
CHANGED
@@ -1,13 +1,2 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
Object.defineProperty(exports, "default", {
|
7
|
-
enumerable: true,
|
8
|
-
get: function get() {
|
9
|
-
return _navMenu.default;
|
10
|
-
}
|
11
|
-
});
|
12
|
-
var _navMenu = _interopRequireDefault(require("./nav-menu"));
|
13
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
1
|
+
// eslint-disable-next-line no-restricted-exports
|
2
|
+
export { default } from './nav-menu';
|