@arcblock/ux 2.9.91 → 2.10.0

package/lib/NFTDisplay/index.js

@@ -1,54 +1,37 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-exports.getNFTData = getNFTData;
-var _react = require("react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _buffer = require("buffer");
-var _get = _interopRequireDefault(require("lodash/get"));
-var _pako = _interopRequireDefault(require("pako"));
-var _base64Url = _interopRequireDefault(require("base64-url"));
-var _isSvg = _interopRequireDefault(require("is-svg"));
-var _reactSvg = require("react-svg");
-var _noop = _interopRequireDefault(require("lodash/noop"));
-var _aspectRatioContainer = _interopRequireDefault(require("./aspect-ratio-container"));
-var _img = _interopRequireDefault(require("./svg-embedder/img"));
-var _inlineSvg = _interopRequireDefault(require("./svg-embedder/inline-svg"));
-var _loading = _interopRequireDefault(require("./loading"));
-var _broken = _interopRequireDefault(require("./broken"));
-var _Theme = require("../Theme");
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-const _excluded = ["data", "address", "inset", "aspect", "component", "className", "renderError", "renderLoading", "preferredSvgEmbedder", "checkSvg", "minimumLoadingTime", "onCompleted"],
-  _excluded2 = ["aspect", "inset"];
 /* eslint-disable react-hooks/rules-of-hooks */
+import { useRef, useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { Buffer } from 'buffer';
+import get from 'lodash/get';
+import pako from 'pako';
+import base64 from 'base64-url';
+import isSvg from 'is-svg';
+import { ReactSVG } from 'react-svg';
+import noop from 'lodash/noop';
+import AspectRatioContainer from './aspect-ratio-container';
+import ImgSvgEmbedder from './svg-embedder/img';
+import InlineSvgEmbedder from './svg-embedder/inline-svg';
+import DefaultLoading from './loading';
+import DefaultBrokenImage from './broken';
+import { styled } from '../Theme';
+
 /**
  * 从 assetState 中获取 nft data, 兼容新旧两种类型的数据结构, 建议将该方法的返回值传入 NFTDisplay 组件的 data prop
  * - 旧: assetState.data.value (.credentialSubject.display)
  * - 新: assetState.display
  */
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-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; }
-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; }
-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; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
-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); }
-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; }
-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; }
-function getNFTData(assetState) {
-  var _assetState$data;
-  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);
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function getNFTData(assetState) {
+  return assetState?.display || assetState?.data?.value;
 }
 function fromBase64(v) {
   if (typeof v !== 'string') {
     throw new Error('fromBase64 requires input to be a string');
   }
-  return _buffer.Buffer.from(_base64Url.default.unescape(v), 'base64');
+  return Buffer.from(base64.unescape(v), 'base64');
 }
 
 // const isVC = type => {
@@ -58,8 +41,8 @@ function fromBase64(v) {
 // 仅针对非 url type 的情况
 const getSvgEmbedder = preferredSvgEmbedder => {
   const embedders = {
-    img: _img.default,
-    svg: _inlineSvg.default
+    img: ImgSvgEmbedder,
+    svg: InlineSvgEmbedder
   };
   return embedders[preferredSvgEmbedder];
 };
@@ -69,31 +52,30 @@ const getSvgEmbedder = preferredSvgEmbedder => {
  * 考虑把 asset data 解析部分和 nft display 分离, android 端有相关使用场景 - 只传入 svg 或 url, 也可以传入 asset data,
  * 目前如果想直接传入 svg 或 url, 需要构造一个 asset data 的数据才能使用 NFTDisplay 组件
  */
-function NFTDisplay(_ref) {
-  let {
-      data,
-      address,
-      inset,
-      aspect,
-      component,
-      className,
-      renderError,
-      renderLoading,
-      preferredSvgEmbedder,
-      checkSvg,
-      minimumLoadingTime,
-      onCompleted
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  const wrapRoot = children => /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, _objectSpread(_objectSpread({
-    as: component
-  }, rest), {}, {
-    className: (0, _clsx.default)(className, {
+function NFTDisplay({
+  data,
+  address,
+  inset,
+  aspect,
+  component,
+  className,
+  renderError,
+  renderLoading,
+  preferredSvgEmbedder,
+  checkSvg,
+  minimumLoadingTime,
+  onCompleted,
+  ...rest
+}) {
+  const wrapRoot = children => /*#__PURE__*/_jsx(Root, {
+    as: component,
+    ...rest,
+    className: clsx(className, {
       'nft-display--inset': inset
     }),
     children: children
-  }));
-  const parsed = (0, _react.useRef)(data);
+  });
+  const parsed = useRef(data);
   try {
     // 如果是 raw data 先解析
     if (typeof parsed.current === 'string') {
@@ -104,7 +86,7 @@ function NFTDisplay(_ref) {
       vcId
     } = parsed.current;
     // 需要兼容新旧两种类型的数据结构, nft data 有 credentialSubject 属性, 说明是旧 nft data, 否则是新 nft data
-    const display = parsed.current.credentialSubject ? (0, _get.default)(parsed.current, 'credentialSubject.display') : parsed.current;
+    const display = parsed.current.credentialSubject ? get(parsed.current, 'credentialSubject.display') : parsed.current;
     const {
       content,
       type
@@ -112,14 +94,14 @@ function NFTDisplay(_ref) {
     const isUrlType = type === 'url';
 
     // 首次加载, 对于 url type 的情况, loading 为 true
-    const [state, setState] = (0, _react.useState)({
+    const [state, setState] = useState({
       loading: isUrlType,
       error: false
     });
-    const [minimumLoadingReady, setMinimumLoadingReady] = (0, _react.useState)(minimumLoadingTime <= 0);
+    const [minimumLoadingReady, setMinimumLoadingReady] = useState(minimumLoadingTime <= 0);
     // console.log('[debug] render', {type, minimumLoadingTime}, JSON.stringify(state))
 
-    (0, _react.useEffect)(() => {
+    useEffect(() => {
       let timer;
       if (minimumLoadingTime > 0) {
         timer = setTimeout(() => setMinimumLoadingReady(true), minimumLoadingTime);
@@ -129,7 +111,7 @@ function NFTDisplay(_ref) {
     }, []);
 
     // onCompleted
-    (0, _react.useEffect)(() => {
+    useEffect(() => {
       if (!state.loading && minimumLoadingReady || state.error) {
         onCompleted();
       }
@@ -143,7 +125,6 @@ function NFTDisplay(_ref) {
         switch (type) {
           case 'url':
             {
-              var _state$fallback;
               const urlObj = new URL(content);
               if (!urlObj.searchParams.has('assetId')) {
                 urlObj.searchParams.append('assetId', address);
@@ -154,39 +135,40 @@ function NFTDisplay(_ref) {
               const url = urlObj.href;
               const safeOnLoad = () => {
                 if (state.loading) {
-                  setState(_objectSpread(_objectSpread({}, state), {}, {
+                  setState({
+                    ...state,
                     loading: false
-                  }));
+                  });
                 }
               };
-              return state.fallback ? (_state$fallback = state.fallback) === null || _state$fallback === void 0 ? void 0 : _state$fallback.call(state) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
+              return state.fallback ? state.fallback?.() : /*#__PURE__*/_jsx(ReactSVG, {
                 src: url,
                 beforeInjection: svg => {
                   svg.setAttribute('style', 'pointer-events: none; width: 100%; height: 100%;');
                 },
                 afterInjection: safeOnLoad,
                 onError: error => {
-                  var _error$message, _error$message2;
                   let objectType = null;
-                  if ((error === null || error === void 0 ? void 0 : (_error$message = error.message) === null || _error$message === void 0 ? void 0 : _error$message.indexOf('Invalid content type: ')) > -1) {
-                    var _error$message$split;
-                    objectType = (_error$message$split = error.message.split('Invalid content type: ')) === null || _error$message$split === void 0 ? void 0 : _error$message$split[1];
-                  } 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) {
+                  if (error?.message?.indexOf('Invalid content type: ') > -1) {
+                    objectType = error.message.split('Invalid content type: ')?.[1];
+                  } else if (error?.message?.indexOf('Unable to load SVG file: ') > -1) {
                     objectType = 'image/svg+xml';
                   }
-                  setState(_objectSpread(_objectSpread({}, state), {}, {
+                  setState({
+                    ...state,
                     // fallback to object, and use objectType to render
                     fallback: () =>
                     /*#__PURE__*/
                     // eslint-disable-next-line jsx-a11y/alt-text
-                    (0, _jsxRuntime.jsx)("object", {
+                    _jsx("object", {
                       type: objectType,
                       data: url,
                       onErrorCapture: () => {
-                        setState(_objectSpread(_objectSpread({}, state), {}, {
+                        setState({
+                          ...state,
                           error: true,
                           loading: false
-                        }));
+                        });
                       },
                       onLoad: safeOnLoad,
                       style: {
@@ -195,7 +177,7 @@ function NFTDisplay(_ref) {
                         pointerEvents: 'none'
                       }
                     }, url)
-                  }));
+                  });
                 }
                 // evalScripts="always"
                 ,
@@ -204,36 +186,38 @@ function NFTDisplay(_ref) {
             }
           case 'uri':
             {
-              return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+              return /*#__PURE__*/_jsx("img", {
                 src: content,
-                onError: () => setState(_objectSpread(_objectSpread({}, state), {}, {
+                onError: () => setState({
+                  ...state,
                   error: true
-                })),
-                onLoad: () => setState(_objectSpread(_objectSpread({}, state), {}, {
+                }),
+                onLoad: () => setState({
+                  ...state,
                   loading: false
-                })),
+                }),
                 alt: "NFT Display"
               });
             }
           case 'svg_gzipped':
             {
-              const buffer = _pako.default.ungzip(fromBase64(content), {});
-              const svg = _buffer.Buffer.from(buffer).toString('utf8');
-              if (checkSvg && !(0, _isSvg.default)(svg)) {
+              const buffer = pako.ungzip(fromBase64(content), {});
+              const svg = Buffer.from(buffer).toString('utf8');
+              if (checkSvg && !isSvg(svg)) {
                 throw new Error('Invalid SVG of type svg_gzipped');
               }
               const Embedder = getSvgEmbedder(preferredSvgEmbedder);
-              return /*#__PURE__*/(0, _jsxRuntime.jsx)(Embedder, {
+              return /*#__PURE__*/_jsx(Embedder, {
                 svg: svg
               });
             }
           case 'svg':
             {
-              if (checkSvg && !(0, _isSvg.default)(content)) {
+              if (checkSvg && !isSvg(content)) {
                 throw new Error('Invalid SVG of type svg');
               }
               const Embedder = getSvgEmbedder(preferredSvgEmbedder);
-              return /*#__PURE__*/(0, _jsxRuntime.jsx)(Embedder, {
+              return /*#__PURE__*/_jsx(Embedder, {
                 svg: content
               });
             }
@@ -245,38 +229,37 @@ function NFTDisplay(_ref) {
           default:
         }
       }
-      throw new Error("unsupported display protocol: ".concat(display.type));
+      throw new Error(`unsupported display protocol: ${display.type}`);
     };
-    return wrapRoot( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [(state.loading || !minimumLoadingReady) && (renderLoading ? renderLoading() : /*#__PURE__*/(0, _jsxRuntime.jsx)(_loading.default, {})), renderNFT()]
+    return wrapRoot( /*#__PURE__*/_jsxs(_Fragment, {
+      children: [(state.loading || !minimumLoadingReady) && (renderLoading ? renderLoading() : /*#__PURE__*/_jsx(DefaultLoading, {})), renderNFT()]
     }));
   } catch (e) {
-    var _parsed$current;
-    console.error(e === null || e === void 0 ? void 0 : e.message, {
+    console.error(e?.message, {
       nftId: address,
-      vcId: parsed === null || parsed === void 0 ? void 0 : (_parsed$current = parsed.current) === null || _parsed$current === void 0 ? void 0 : _parsed$current.vcId
+      vcId: parsed?.current?.vcId
     });
-    return wrapRoot(renderError ? renderError() : /*#__PURE__*/(0, _jsxRuntime.jsx)(_broken.default, {}));
+    return wrapRoot(renderError ? renderError() : /*#__PURE__*/_jsx(DefaultBrokenImage, {}));
   }
 }
 NFTDisplay.propTypes = {
   // asset data 可以是 raw data 和 parsed data
-  data: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]).isRequired,
-  address: _propTypes.default.string.isRequired,
-  component: _propTypes.default.string,
-  inset: _propTypes.default.bool,
-  aspect: _propTypes.default.number,
-  className: _propTypes.default.string,
-  renderError: _propTypes.default.func,
-  renderLoading: _propTypes.default.func,
+  data: PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired,
+  address: PropTypes.string.isRequired,
+  component: PropTypes.string,
+  inset: PropTypes.bool,
+  aspect: PropTypes.number,
+  className: PropTypes.string,
+  renderError: PropTypes.func,
+  renderLoading: PropTypes.func,
   // 对于非 url type 的情况, 支持优先选用的 svg 嵌入方式, 默认是 img
-  preferredSvgEmbedder: _propTypes.default.oneOf(['img', 'svg']),
+  preferredSvgEmbedder: PropTypes.oneOf(['img', 'svg']),
   // 针对非 url type 的情况, 检测 svg 有效性, 默认禁用
-  checkSvg: _propTypes.default.bool,
+  checkSvg: PropTypes.bool,
   // loading 最小显示时间 (避免闪烁)
-  minimumLoadingTime: _propTypes.default.number,
+  minimumLoadingTime: PropTypes.number,
   // 完成回调, 无论加载成功|失败
-  onCompleted: _propTypes.default.func
+  onCompleted: PropTypes.func
 };
 NFTDisplay.defaultProps = {
   component: 'span',
@@ -288,30 +271,58 @@ NFTDisplay.defaultProps = {
   preferredSvgEmbedder: 'img',
   checkSvg: false,
   minimumLoadingTime: 0,
-  onCompleted: _noop.default
+  onCompleted: noop
 };
-const Root = (0, _Theme.styled)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  /* \u9ED8\u8BA4\u5C3A\u5BF8 */\n  width: 150px;\n  height: 150px;\n  overflow: hidden;\n\n  &,\n  img,\n  object {\n    max-width: 100%;\n    max-height: 100%;\n  }\n\n  img,\n  object {\n    width: 100%;\n    height: 100%;\n  }\n\n  &.nft-display--inset {\n    width: 100%;\n    height: 100%;\n  }\n"])));
+const Root = styled('div')`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  /* 默认尺寸 */
+  width: 150px;
+  height: 150px;
+  overflow: hidden;
+
+  &,
+  img,
+  object {
+    max-width: 100%;
+    max-height: 100%;
+  }
+
+  img,
+  object {
+    width: 100%;
+    height: 100%;
+  }
+
+  &.nft-display--inset {
+    width: 100%;
+    height: 100%;
+  }
+`;
 function withAspectRatio(Component) {
   // eslint-disable-next-line func-names, react/prop-types
-  return function (_ref2) {
-    let {
-        aspect,
-        inset
-      } = _ref2,
-      rest = _objectWithoutProperties(_ref2, _excluded2);
+  return function ({
+    aspect,
+    inset,
+    ...rest
+  }) {
     // inset 比 aspect ratio 优先级高, 如果同时设置了 inset 和 aspect, 则后者不生效
     const applyAspectRatio = aspect > 0 && !inset;
     if (applyAspectRatio) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_aspectRatioContainer.default, {
+      return /*#__PURE__*/_jsx(AspectRatioContainer, {
         aspect: aspect,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread({
-          inset: true
-        }, rest))
+        children: /*#__PURE__*/_jsx(Component, {
+          inset: true,
+          ...rest
+        })
       });
     }
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread({
-      inset: inset
-    }, rest));
+    return /*#__PURE__*/_jsx(Component, {
+      inset: inset,
+      ...rest
+    });
   };
 }
-var _default = exports.default = withAspectRatio(NFTDisplay);
+export default withAspectRatio(NFTDisplay);

package/lib/NFTDisplay/loading.js

@@ -1,17 +1,18 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = Loading;
-var _Theme = require("../Theme");
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-function Loading() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
+import { styled } from '../Theme';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function Loading() {
+  return /*#__PURE__*/_jsx(Root, {
     className: "nft-display__loading",
     children: "Loading..."
   });
 }
-const Root = (0, _Theme.styled)('span')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  color: #ccc;\n  background-color: #eee;\n"])));
+const Root = styled('span')`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  color: #ccc;
+  background-color: #eee;
+`;

package/lib/NFTDisplay/svg-embedder/img.js

@@ -1,21 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _inlineSvg = _interopRequireDefault(require("./inline-svg"));
-var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["svg", "alt", "fallback"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
-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; }
-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; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
-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); }
-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; }
-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; }
+import PropTypes from 'prop-types';
+import InlineSvgEmbedder from './inline-svg';
+import { jsx as _jsx } from "react/jsx-runtime";
 const svgToImgUrl = svg => {
   // fix: #225, https://stackoverflow.com/a/52135328)
   const blob = new Blob([svg], {
@@ -27,34 +12,34 @@ const svgToImgUrl = svg => {
 /**
  * 基于 <img> 嵌入 svg
  */
-function ImgEmbedder(_ref) {
-  let {
-      svg,
-      alt,
-      fallback
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
+function ImgEmbedder({
+  svg,
+  alt,
+  fallback,
+  ...rest
+}) {
   // 包含 foreignObject 的 svg, fallback 到 shadow dom
   if (fallback && svg.indexOf('</foreignObject>') > -1) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_inlineSvg.default, {
+    return /*#__PURE__*/_jsx(InlineSvgEmbedder, {
       svg: svg
     });
   }
   const url = svgToImgUrl(svg);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", _objectSpread({
+  return /*#__PURE__*/_jsx("img", {
     src: url,
     onLoad: () => URL.revokeObjectURL(url),
-    alt: alt
-  }, rest));
+    alt: alt,
+    ...rest
+  });
 }
 ImgEmbedder.propTypes = {
-  svg: _propTypes.default.string.isRequired,
-  alt: _propTypes.default.string,
+  svg: PropTypes.string.isRequired,
+  alt: PropTypes.string,
   // 对于包含 foreignObject 的 svg, fallback 到 inline svg + shadow DOM
-  fallback: _propTypes.default.bool
+  fallback: PropTypes.bool
 };
 ImgEmbedder.defaultProps = {
   alt: '',
   fallback: true
 };
-var _default = exports.default = ImgEmbedder;
+export default ImgEmbedder;

package/lib/NFTDisplay/svg-embedder/inline-svg.js

@@ -1,43 +1,39 @@
-"use strict";
+import PropTypes from 'prop-types';
+import root from 'react-shadow/emotion';
+import { styled } from '../../Theme';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _emotion = _interopRequireDefault(require("react-shadow/emotion"));
-var _Theme = require("../../Theme");
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject, _templateObject2;
-const _excluded = ["svg"];
 /**
  * inline svg 的方式嵌入 svg, 使用 shadow DOM 避免样式污染
  */
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-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; }
-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; }
-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; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
-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); }
-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; }
-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; }
-function InlineSvg(_ref) {
-  let {
-      svg
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, _objectSpread(_objectSpread({}, rest), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Inner, {
+import { jsx as _jsx } from "react/jsx-runtime";
+function InlineSvg({
+  svg,
+  ...rest
+}) {
+  return /*#__PURE__*/_jsx(Root, {
+    ...rest,
+    children: /*#__PURE__*/_jsx(Inner, {
       dangerouslySetInnerHTML: {
         __html: svg
       }
     })
-  }));
+  });
 }
 InlineSvg.propTypes = {
-  svg: _propTypes.default.string.isRequired
+  svg: PropTypes.string.isRequired
 };
-const Root = (0, _Theme.styled)(_emotion.default.span)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: block;\n  width: 100%;\n  height: 100%;\n"])));
-const Inner = (0, _Theme.styled)('div')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  &,\n  & > svg {\n    height: 100%;\n    width: 100%;\n    min-width: 100%;\n    max-width: 100%;\n  }\n"])));
-var _default = exports.default = InlineSvg;
+const Root = styled(root.span)`
+  display: block;
+  width: 100%;
+  height: 100%;
+`;
+const Inner = styled('div')`
+  &,
+  & > svg {
+    height: 100%;
+    width: 100%;
+    min-width: 100%;
+    max-width: 100%;
+  }
+`;
+export default InlineSvg;

package/lib/NavMenu/index.js

@@ -1,13 +1,2 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _navMenu.default;
-  }
-});
-var _navMenu = _interopRequireDefault(require("./nav-menu"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+// eslint-disable-next-line no-restricted-exports
+export { default } from './nav-menu';