@web3auth/ui/dist/lib.cjs/packages/ui/src/components/Icon.js

Ui modal for web3Auth

'use strict';

var arrowLeftDark = require('../assets/arrow-left-dark.svg.js');
var arrowLeftLight = require('../assets/arrow-left-light.svg.js');
var xDark = require('../assets/x-dark.svg.js');
var xLight = require('../assets/x-light.svg.js');
var jsxRuntime = require('react/jsx-runtime');

const icons = {
  "arrow-left": {
    image: "https://images.web3auth.io/circle-arrow-left.svg"
  },
  close: {
    image: "https://images.web3auth.io/close.svg"
  },
  "expand-light": {
    image: "https://images.web3auth.io/expand-light.svg"
  },
  expand: {
    image: "https://images.web3auth.io/expand.svg"
  },
  connected: {
    image: "https://images.web3auth.io/connected.svg"
  },
  "information-circle-light": {
    image: "https://images.web3auth.io/information-circle-light.svg"
  },
  "information-circle": {
    image: "https://images.web3auth.io/information-circle.svg"
  },
  "arrow-left-light": {
    image: arrowLeftLight
  },
  "x-light": {
    image: xLight
  },
  "arrow-left-dark": {
    image: arrowLeftDark
  },
  "x-dark": {
    image: xDark
  }
};
function Icon(props) {
  const {
    iconName,
    iconTitle = "",
    height = "auto",
    width = "auto",
    darkIconName = ""
  } = props;
  const h = height === "auto" ? "w3a--h-auto" : `w3a--h-[${height}px]`;
  const w = width === "auto" ? "w3a--w-auto" : `w3a--w-[${width}px]`;
  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
    children: [icons[iconName] && /*#__PURE__*/jsxRuntime.jsx("img", {
      className: `${iconTitle ? "w3a--cursor-pointer" : ""} dark:w3a--hidden w3a--block ${h} ${w}`,
      height: height,
      width: width,
      src: icons[iconName].image,
      alt: iconName,
      title: iconTitle
    }), icons[darkIconName] && /*#__PURE__*/jsxRuntime.jsx("img", {
      className: `${iconTitle ? "w3a--cursor-pointer" : ""} w3a--hidden dark:w3a--block ${h} ${w}`,
      height: height,
      width: width,
      src: icons[darkIconName].image,
      alt: darkIconName,
      title: iconTitle
    })]
  });
}

module.exports = Icon;