@sky-mavis/tanto-widget/dist/cjs/views/Connect/components/ConnectLogo.cjs

Tanto Widget

'use strict';

var _styled = require('@emotion/styled/base');
var jsxRuntime = require('@emotion/react/jsx-runtime');
var m = require('motion/react-m');
var SuccessIcon = require('../../../assets/SuccessIcon.cjs');
var WarningIcon = require('../../../assets/WarningIcon.cjs');
var Fade = require('../../../components/animated-containers/Fade.cjs');
var SquircleSpinner = require('../../../components/squircle-spinner/SquircleSpinner.cjs');
var animations = require('../../../styles/animations.cjs');
var connect = require('../../../types/connect.cjs');

function _interopNamespaceDefault(e) {
  var n = Object.create(null);
  if (e) {
    Object.keys(e).forEach(function (k) {
      if (k !== 'default') {
        var d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: function () { return e[k]; }
        });
      }
    });
  }
  n.default = e;
  return Object.freeze(n);
}

var m__namespace = /*#__PURE__*/_interopNamespaceDefault(m);

const LogoSection = /*#__PURE__*/_styled(m__namespace.div, process.env.NODE_ENV === "production" ? {
  target: "ech93bv1"
} : {
  target: "ech93bv1",
  label: "LogoSection"
})("width:fit-content;user-select:none;position:relative;&:before{content:\"\";position:absolute;inset:1px;opacity:0;}", ({
  theme,
  status
}) => {
  if (status === connect.ConnectState.ERROR) {
    return {
      animation: `${animations.shake} 240ms ease-out both`,
      '&:before': {
        background: theme.warningColor,
        animation: `${animations.fadeOut} 240ms ease-out 1200ms both`
      }
    };
  }
  if (status === connect.ConnectState.SUCCESS) {
    return {
      '&:before': {
        background: theme.successColor,
        animation: `${animations.fadeIn} 150ms linear forwards`
      }
    };
  }
  return {};
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbm5lY3RMb2dvLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTb0IiLCJmaWxlIjoiQ29ubmVjdExvZ28udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsganN4IGFzIF9qc3gsIGpzeHMgYXMgX2pzeHMgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3QvanN4LXJ1bnRpbWVcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCAqIGFzIG0gZnJvbSAnbW90aW9uL3JlYWN0LW0nO1xuaW1wb3J0IHsgU3VjY2Vzc0ljb24gfSBmcm9tICcuLi8uLi8uLi9hc3NldHMvU3VjY2Vzc0ljb24nO1xuaW1wb3J0IHsgV2FybmluZ0ljb24gfSBmcm9tICcuLi8uLi8uLi9hc3NldHMvV2FybmluZ0ljb24nO1xuaW1wb3J0IHsgRmFkZSB9IGZyb20gJy4uLy4uLy4uL2NvbXBvbmVudHMvYW5pbWF0ZWQtY29udGFpbmVycy9GYWRlJztcbmltcG9ydCBTcXVpcmNsZVNwaW5uZXIgZnJvbSAnLi4vLi4vLi4vY29tcG9uZW50cy9zcXVpcmNsZS1zcGlubmVyL1NxdWlyY2xlU3Bpbm5lcic7XG5pbXBvcnQgeyBmYWRlSW4sIGZhZGVPdXQsIHNoYWtlIH0gZnJvbSAnLi4vLi4vLi4vc3R5bGVzL2FuaW1hdGlvbnMnO1xuaW1wb3J0IHsgQ29ubmVjdFN0YXRlIH0gZnJvbSAnLi4vLi4vLi4vdHlwZXMvY29ubmVjdCc7XG5jb25zdCBMb2dvU2VjdGlvbiA9IHN0eWxlZChtLmRpdikoe1xuICAgIHdpZHRoOiAnZml0LWNvbnRlbnQnLFxuICAgIHVzZXJTZWxlY3Q6ICdub25lJyxcbiAgICBwb3NpdGlvbjogJ3JlbGF0aXZlJyxcbiAgICAnJjpiZWZvcmUnOiB7XG4gICAgICAgIGNvbnRlbnQ6ICdcIlwiJyxcbiAgICAgICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgICAgIGluc2V0OiAxLFxuICAgICAgICBvcGFjaXR5OiAwLFxuICAgIH0sXG59LCAoeyB0aGVtZSwgc3RhdHVzIH0pID0+IHtcbiAgICBpZiAoc3RhdHVzID09PSBDb25uZWN0U3RhdGUuRVJST1IpIHtcbiAgICAgICAgcmV0dXJuIHtcbiAgICAgICAgICAgIGFuaW1hdGlvbjogYCR7c2hha2V9IDI0MG1zIGVhc2Utb3V0IGJvdGhgLFxuICAgICAgICAgICAgJyY6YmVmb3JlJzoge1xuICAgICAgICAgICAgICAgIGJhY2tncm91bmQ6IHRoZW1lLndhcm5pbmdDb2xvcixcbiAgICAgICAgICAgICAgICBhbmltYXRpb246IGAke2ZhZGVPdXR9IDI0MG1zIGVhc2Utb3V0IDEyMDBtcyBib3RoYCxcbiAgICAgICAgICAgIH0sXG4gICAgICAgIH07XG4gICAgfVxuICAgIGlmIChzdGF0dXMgPT09IENvbm5lY3RTdGF0ZS5TVUNDRVNTKSB7XG4gICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICAnJjpiZWZvcmUnOiB7XG4gICAgICAgICAgICAgICAgYmFja2dyb3VuZDogdGhlbWUuc3VjY2Vzc0NvbG9yLFxuICAgICAgICAgICAgICAgIGFuaW1hdGlvbjogYCR7ZmFkZUlufSAxNTBtcyBsaW5lYXIgZm9yd2FyZHNgLFxuICAgICAgICAgICAgfSxcbiAgICAgICAgfTtcbiAgICB9XG4gICAgcmV0dXJuIHt9O1xufSk7XG5jb25zdCBTdGF0dXNJY29uU2VjdGlvbiA9IHN0eWxlZC5kaXYoe1xuICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgIGJvdHRvbTogNSxcbiAgICByaWdodDogLTksXG4gICAgekluZGV4OiA1LFxufSk7XG5leHBvcnQgY29uc3QgQ29ubmVjdExvZ28gPSAoeyB3YWxsZXRJY29uLCBzdGF0dXMgfSkgPT4ge1xuICAgIGNvbnN0IGlzQ29ubmVjdGluZyA9IFtDb25uZWN0U3RhdGUuUEVORElORywgQ29ubmVjdFN0YXRlLk9QRU5JTkdfV0FMTEVUXS5pbmNsdWRlcyhzdGF0dXMpO1xuICAgIHJldHVybiAoX2pzeHMoTG9nb1NlY3Rpb24sIHsgc3RhdHVzOiBzdGF0dXMsIGNoaWxkcmVuOiBbX2pzeChTcXVpcmNsZVNwaW5uZXIsIHsgbG9nbzogd2FsbGV0SWNvbiwgY29ubmVjdGluZzogaXNDb25uZWN0aW5nIH0pLCBfanN4cyhTdGF0dXNJY29uU2VjdGlvbiwgeyBjaGlsZHJlbjogW19qc3goRmFkZSwgeyBzaG93OiBzdGF0dXMgPT09IENvbm5lY3RTdGF0ZS5FUlJPUiwgY2hpbGRyZW46IF9qc3goV2FybmluZ0ljb24sIHt9KSB9KSwgX2pzeChGYWRlLCB7IHNob3c6IHN0YXR1cyA9PT0gQ29ubmVjdFN0YXRlLlNVQ0NFU1MsIGNoaWxkcmVuOiBfanN4KFN1Y2Nlc3NJY29uLCB7fSkgfSldIH0pXSB9KSk7XG59O1xuIl19 */");
const StatusIconSection = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
  target: "ech93bv0"
} : {
  target: "ech93bv0",
  label: "StatusIconSection"
})({
  position: 'absolute',
  bottom: 5,
  right: -9,
  zIndex: 5
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbm5lY3RMb2dvLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1QzBCIiwiZmlsZSI6IkNvbm5lY3RMb2dvLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4LCBqc3hzIGFzIF9qc3hzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0L2pzeC1ydW50aW1lXCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgKiBhcyBtIGZyb20gJ21vdGlvbi9yZWFjdC1tJztcbmltcG9ydCB7IFN1Y2Nlc3NJY29uIH0gZnJvbSAnLi4vLi4vLi4vYXNzZXRzL1N1Y2Nlc3NJY29uJztcbmltcG9ydCB7IFdhcm5pbmdJY29uIH0gZnJvbSAnLi4vLi4vLi4vYXNzZXRzL1dhcm5pbmdJY29uJztcbmltcG9ydCB7IEZhZGUgfSBmcm9tICcuLi8uLi8uLi9jb21wb25lbnRzL2FuaW1hdGVkLWNvbnRhaW5lcnMvRmFkZSc7XG5pbXBvcnQgU3F1aXJjbGVTcGlubmVyIGZyb20gJy4uLy4uLy4uL2NvbXBvbmVudHMvc3F1aXJjbGUtc3Bpbm5lci9TcXVpcmNsZVNwaW5uZXInO1xuaW1wb3J0IHsgZmFkZUluLCBmYWRlT3V0LCBzaGFrZSB9IGZyb20gJy4uLy4uLy4uL3N0eWxlcy9hbmltYXRpb25zJztcbmltcG9ydCB7IENvbm5lY3RTdGF0ZSB9IGZyb20gJy4uLy4uLy4uL3R5cGVzL2Nvbm5lY3QnO1xuY29uc3QgTG9nb1NlY3Rpb24gPSBzdHlsZWQobS5kaXYpKHtcbiAgICB3aWR0aDogJ2ZpdC1jb250ZW50JyxcbiAgICB1c2VyU2VsZWN0OiAnbm9uZScsXG4gICAgcG9zaXRpb246ICdyZWxhdGl2ZScsXG4gICAgJyY6YmVmb3JlJzoge1xuICAgICAgICBjb250ZW50OiAnXCJcIicsXG4gICAgICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgICAgICBpbnNldDogMSxcbiAgICAgICAgb3BhY2l0eTogMCxcbiAgICB9LFxufSwgKHsgdGhlbWUsIHN0YXR1cyB9KSA9PiB7XG4gICAgaWYgKHN0YXR1cyA9PT0gQ29ubmVjdFN0YXRlLkVSUk9SKSB7XG4gICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICBhbmltYXRpb246IGAke3NoYWtlfSAyNDBtcyBlYXNlLW91dCBib3RoYCxcbiAgICAgICAgICAgICcmOmJlZm9yZSc6IHtcbiAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB0aGVtZS53YXJuaW5nQ29sb3IsXG4gICAgICAgICAgICAgICAgYW5pbWF0aW9uOiBgJHtmYWRlT3V0fSAyNDBtcyBlYXNlLW91dCAxMjAwbXMgYm90aGAsXG4gICAgICAgICAgICB9LFxuICAgICAgICB9O1xuICAgIH1cbiAgICBpZiAoc3RhdHVzID09PSBDb25uZWN0U3RhdGUuU1VDQ0VTUykge1xuICAgICAgICByZXR1cm4ge1xuICAgICAgICAgICAgJyY6YmVmb3JlJzoge1xuICAgICAgICAgICAgICAgIGJhY2tncm91bmQ6IHRoZW1lLnN1Y2Nlc3NDb2xvcixcbiAgICAgICAgICAgICAgICBhbmltYXRpb246IGAke2ZhZGVJbn0gMTUwbXMgbGluZWFyIGZvcndhcmRzYCxcbiAgICAgICAgICAgIH0sXG4gICAgICAgIH07XG4gICAgfVxuICAgIHJldHVybiB7fTtcbn0pO1xuY29uc3QgU3RhdHVzSWNvblNlY3Rpb24gPSBzdHlsZWQuZGl2KHtcbiAgICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgICBib3R0b206IDUsXG4gICAgcmlnaHQ6IC05LFxuICAgIHpJbmRleDogNSxcbn0pO1xuZXhwb3J0IGNvbnN0IENvbm5lY3RMb2dvID0gKHsgd2FsbGV0SWNvbiwgc3RhdHVzIH0pID0+IHtcbiAgICBjb25zdCBpc0Nvbm5lY3RpbmcgPSBbQ29ubmVjdFN0YXRlLlBFTkRJTkcsIENvbm5lY3RTdGF0ZS5PUEVOSU5HX1dBTExFVF0uaW5jbHVkZXMoc3RhdHVzKTtcbiAgICByZXR1cm4gKF9qc3hzKExvZ29TZWN0aW9uLCB7IHN0YXR1czogc3RhdHVzLCBjaGlsZHJlbjogW19qc3goU3F1aXJjbGVTcGlubmVyLCB7IGxvZ286IHdhbGxldEljb24sIGNvbm5lY3Rpbmc6IGlzQ29ubmVjdGluZyB9KSwgX2pzeHMoU3RhdHVzSWNvblNlY3Rpb24sIHsgY2hpbGRyZW46IFtfanN4KEZhZGUsIHsgc2hvdzogc3RhdHVzID09PSBDb25uZWN0U3RhdGUuRVJST1IsIGNoaWxkcmVuOiBfanN4KFdhcm5pbmdJY29uLCB7fSkgfSksIF9qc3goRmFkZSwgeyBzaG93OiBzdGF0dXMgPT09IENvbm5lY3RTdGF0ZS5TVUNDRVNTLCBjaGlsZHJlbjogX2pzeChTdWNjZXNzSWNvbiwge30pIH0pXSB9KV0gfSkpO1xufTtcbiJdfQ== */");
const ConnectLogo = ({
  walletIcon,
  status
}) => {
  const isConnecting = [connect.ConnectState.PENDING, connect.ConnectState.OPENING_WALLET].includes(status);
  return jsxRuntime.jsxs(LogoSection, {
    status: status,
    children: [jsxRuntime.jsx(SquircleSpinner.default, {
      logo: walletIcon,
      connecting: isConnecting
    }), jsxRuntime.jsxs(StatusIconSection, {
      children: [jsxRuntime.jsx(Fade.Fade, {
        show: status === connect.ConnectState.ERROR,
        children: jsxRuntime.jsx(WarningIcon.WarningIcon, {})
      }), jsxRuntime.jsx(Fade.Fade, {
        show: status === connect.ConnectState.SUCCESS,
        children: jsxRuntime.jsx(SuccessIcon.SuccessIcon, {})
      })]
    })]
  });
};

exports.ConnectLogo = ConnectLogo;