{"version":3,"sources":["webpack:///./src/components/Common/Chooser.vue?03b0","webpack:///./src/components/Withdraw/Step.vue","webpack:///src/components/Withdraw/Step.vue","webpack:///./src/components/Withdraw/Step.vue?e8f4","webpack:///./src/components/Withdraw/Step.vue?0188","webpack:///./src/components/Common/Chooser.vue","webpack:///src/components/Common/Chooser.vue","webpack:///./src/components/Common/Chooser.vue?1a2d","webpack:///./src/components/Common/Chooser.vue?2da5","webpack:///./src/components/Common/ConnectButton.vue?722e","webpack:///./src/components/Common/DappTxBtn.vue","webpack:///./src/components/Common/SharedButton.vue","webpack:///src/components/Common/SharedButton.vue","webpack:///./src/components/Common/SharedButton.vue?c8de","webpack:///./src/components/Common/SharedButton.vue?940a","webpack:///src/components/Common/DappTxBtn.vue","webpack:///./src/components/Common/DappTxBtn.vue?3705","webpack:///./src/components/Common/DappTxBtn.vue?eb72","webpack:///./src/components/Common/ConnectButton.vue","webpack:///src/components/Common/ConnectButton.vue","webpack:///./src/components/Common/ConnectButton.vue?cf96","webpack:///./src/components/Common/ConnectButton.vue?0ae5","webpack:///./src/components/Stake/Wrap.vue","webpack:///src/components/Stake/Wrap.vue","webpack:///./src/components/Stake/Wrap.vue?d9be","webpack:///./src/components/Stake/Wrap.vue?6c0e","webpack:///./src/components/Common/ApproveButton.vue","webpack:///src/components/Common/ApproveButton.vue","webpack:///./src/components/Common/ApproveButton.vue?3252","webpack:///./src/components/Common/ApproveButton.vue?4acc"],"names":["render","_vm","this","_c","_self","staticClass","class","completed","_v","_s","step","title","staticRenderFns","props","type","Number","String","required","Boolean","default","component","_l","routes","route","index","key","id","switch_active","activeRoute","on","$event","onClick","cb","text","name","components","data","parseInt","currentActive","computed","mapGetters","userConnectedWalletAddress","isActive","ethAmt","toWei","amount","methods","loading","attrs","_e","disabled","execTx","_t","big","$emit","BN","config","ROUNDING_MODE","ROUND_DOWN","EXPONENTIAL_AT","SharedButton","ImageVue","ConnectButton","gasPrices","gasPrice","chosenGas","defaultGas","mounted","getCurrentGasPrices","watch","immediate","args","click","wrapTx","abiCall","argsArr","senderObj","send","from","maxFeePerGas","multipliedBy","toString","maxPriorityFeePerGas","hash","notifyHandler","once","error","notifyNotification","catch","finally","userAddress","handleConnect","slice","mapActions","setAddress","descr","userWalletIsConnected","inputTokenName","depositStage","approvalStage","outputTokenName","userTokenBalance","div","decimalPlaces","domProps","isNaN","parseFloat","target","value","handleFillMaxAmount","parseBN","userOutputTokenBalance","userHasTokenBalance","stage","sgETH","wsgETH","getUserApproved","handleDeposit","Step","ApprovalButton","Chooser","DappTxBtn","userApproved","dev","routeClickCb","ABI","address","refreshBalances","gt","userHasApprovedToken","gte","userCanRequestWithdrawal","hasApprovedToken","hasTokenBalance","amountFieldLowerThanMax","completedStepsCount","state","console","log","$router","push","toLowerCase","deposit","n","getUserTokenBalance","getUserOutputTokenBalance","allowance","options","call","balanceOf","autoHide","enoughApproved","genProps","wrappedCb","getApproved","ABI_token","approve","ABI_spender"],"mappings":"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","file":"js/chunk-357772a6.06e380ab.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Chooser.vue?vue&type=style&index=0&id=58d5de69&prod&scoped=true&lang=css\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"flex items-center gap-1 text-sm font-semibold whitespace-nowrap\"},[_c('span',{staticClass:\"flex items-center justify-center w-4 h-4 bg-gray-200 rounded-sm\",class:{\n      'bg-green-700 text-gray-100': _vm.completed,\n      'text-gray-900': !_vm.completed,\n    }},[_vm._v(\" \"+_vm._s(_vm.step)+\" \")]),_c('p',{class:{ 'line-through text-gray-400': _vm.completed }},[_vm._v(_vm._s(_vm.title))])])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"flex items-center gap-1 text-sm font-semibold whitespace-nowrap\">\n    <span\n      class=\"flex items-center justify-center w-4 h-4 bg-gray-200 rounded-sm\"\n      :class=\"{\n        'bg-green-700 text-gray-100': completed,\n        'text-gray-900': !completed,\n      }\"\n    >\n      {{ step }}\n    </span>\n    <p :class=\"{ 'line-through text-gray-400': completed }\">{{ title }}</p>\n  </div>\n</template>\n\n<script>\nexport default {\n  props: {\n    step: {\n      type: [Number, String],\n      required: true,\n    },\n    title: {\n      type: String,\n      required: true,\n    },\n    completed: {\n      type: Boolean,\n      default: false,\n    },\n  },\n};\n</script>\n","import mod from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Step.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Step.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./Step.vue?vue&type=template&id=23a8dcb4\"\nimport script from \"./Step.vue?vue&type=script&lang=js\"\nexport * from \"./Step.vue?vue&type=script&lang=js\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"chooser\"},[_c('div',{staticClass:\"navbar\"},_vm._l((this.routes),function(route,index){return _c('button',{key:route.id,staticClass:\"switch\",class:{ switch_active: _vm.activeRoute == index },on:{\"click\":function($event){return _vm.onClick(index, route.cb)}}},[_c('span',[_vm._v(_vm._s(route.text))])])}),0)])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"chooser\">\n    <div class=\"navbar\">\n      <button\n        v-for=\"(route, index) in this.routes\"\n        :key=\"route.id\"\n        class=\"switch\"\n        :class=\"{ switch_active: activeRoute == index }\"\n        @click=\"onClick(index, route.cb)\"\n      >\n        <span>{{ route.text }}</span>\n      </button>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { mapGetters } from \"vuex\";\nimport { toWei } from \"../../utils/common\";\nexport default {\n  name: \"Chooser\",\n  props: [\"routes\", \"currentActive\"],\n  components: {},\n  data() {\n    return {\n      activeRoute: parseInt(this.currentActive),\n    };\n  },\n\n  computed: {\n    ...mapGetters({ userConnectedWalletAddress: \"userAddress\" }),\n\n    isActive(index) {\n      return this.activeRoute == index;\n    },\n\n    ethAmt() {\n      return toWei(this.amount);\n    },\n  },\n  methods: {\n    onClick(index, cb) {\n      this.activeRoute = index;\n      return cb(index, this.routes);\n    },\n    async asyncOnClick(index, cb) {\n      this.activeRoute = index;\n      return await cb(index, this.routes);\n    },\n  },\n};\n</script>\n\n<style scoped>\n.chooser {\n  /* background-color: rgb(15, 16, 19); */\n  height: 72px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 16px;\n}\n\n.navbar {\n  display: flex;\n  border: 1px solid #3c3c3c;\n  box-sizing: border-box;\n  border-radius: 100px;\n  width: 100%;\n}\n\n.switch {\n  height: 40px;\n  padding: 0 20px;\n  font-size: 16px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  border-color: transparent;\n  color: #fff;\n  border-radius: 100px;\n  line-height: 24px;\n  box-sizing: border-box;\n  white-space: nowrap;\n  text-align: center;\n  border: 1px solid transparent;\n  cursor: pointer;\n  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n  user-select: none;\n  touch-action: manipulation;\n}\n\n.switch_active {\n  border: 2px solid rgb(37, 167, 219);\n  border-radius: 100px;\n  color: #fff;\n  cursor: pointer;\n  font-weight: bold;\n}\n\n.switch_active:hover,\n.switch:hover {\n  transform: scale(0.98);\n}\n</style>\n","import mod from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Chooser.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Chooser.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./Chooser.vue?vue&type=template&id=58d5de69&scoped=true\"\nimport script from \"./Chooser.vue?vue&type=script&lang=js\"\nexport * from \"./Chooser.vue?vue&type=script&lang=js\"\nimport style0 from \"./Chooser.vue?vue&type=style&index=0&id=58d5de69&prod&scoped=true&lang=css\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"58d5de69\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ConnectButton.vue?vue&type=style&index=0&id=220c9c21&prod&scoped=true&lang=css\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('span',[(!_vm.userConnectedWalletAddress)?_c('ConnectButton'):(!_vm.loading)?_c('SharedButton',{attrs:{\"disabled\":_vm.disabled},on:{\"click\":_vm.execTx}},[_vm._t(\"default\")],2):(_vm.loading)?_c('p',[_c('ImageVue',{attrs:{\"src\":'loading.svg',\"size\":'45px'}})],1):_vm._e()],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('button',{staticClass:\"px-6 py-3 text-xl font-semibold transition-all border-2 border-white rounded-full md:font-medium md:px-8 whitespace-nowrap\",class:{\n    'md:text-3xl': _vm.big,\n    'cursor-not-allowed text-gray-400 border-gray-400': _vm.disabled,\n    'bg-brand-primary hover:bg-transparent hover:text-brand-primary hover:border-brand-primary': !_vm.disabled\n  },attrs:{\"disabled\":_vm.disabled,\"type\":\"button\"},on:{\"click\":function($event){return _vm.$emit('click')}}},[_vm._t(\"default\")],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <button\n    @click=\"$emit('click')\"\n    :disabled=\"disabled\"\n    class=\"px-6 py-3 text-xl font-semibold transition-all border-2 border-white rounded-full md:font-medium md:px-8 whitespace-nowrap\"\n    :class=\"{\n      'md:text-3xl': big,\n      'cursor-not-allowed text-gray-400 border-gray-400': disabled,\n      'bg-brand-primary hover:bg-transparent hover:text-brand-primary hover:border-brand-primary': !disabled\n    }\"\n    type=\"button\"\n  >\n    <slot />\n  </button>\n</template>\n<script>\nexport default {\n  name: \"Button\",\n  props: {\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    big: {\n      type: Boolean,\n      default: false,\n    },\n  },\n};\n</script>\n","import mod from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SharedButton.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SharedButton.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./SharedButton.vue?vue&type=template&id=3b413b7a\"\nimport script from \"./SharedButton.vue?vue&type=script&lang=js\"\nexport * from \"./SharedButton.vue?vue&type=script&lang=js\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","<template>\n  <span>\n    <ConnectButton v-if=\"!userConnectedWalletAddress\" />\n    <SharedButton v-else-if=\"!loading\" @click=\"execTx\" :disabled=\"disabled\">\n      <slot />\n    </SharedButton>\n    <p v-else-if=\"loading\">\n      <ImageVue :src=\"'loading.svg'\" :size=\"'45px'\" />\n    </p>\n  </span>\n</template>\n\n<script>\nimport { mapGetters } from \"vuex\";\nimport SharedButton from \"./SharedButton.vue\";\nimport {\n  notifyHandler,\n  notifyNotification,\n  getCurrentGasPrices,\n} from \"@/utils/common\";\nimport ImageVue from \"../Handlers/ImageVue.vue\";\nimport ConnectButton from \"./ConnectButton.vue\";\n\nimport BN from \"bignumber.js\";\nBN.config({ ROUNDING_MODE: BN.ROUND_DOWN });\nBN.config({ EXPONENTIAL_AT: 100 });\n\nexport default {\n  name: \"DappTxBtn\",\n  props: [\"click\", \"cb\", \"chosenGas\", \"defaultGas\", \"disabled\"],\n  components: { SharedButton, ImageVue, ConnectButton },\n  data() {\n    return {\n      gasPrices: {},\n      loading: false,\n    };\n  },\n\n  computed: {\n    ...mapGetters({ userConnectedWalletAddress: \"userAddress\" }),\n    gasPrice() {\n      return this.chosenGas\n        ? this.chosenGas\n        : this.gasPrices[this.defaultGas ? this.defaultGas : \"medium\"];\n    },\n  },\n\n  mounted: async function () {\n    this.gasPrices = await getCurrentGasPrices();\n  },\n\n  watch: {\n    userConnectedWalletAddress: {\n      immediate: true,\n      async handler() {\n        this.gasPrices = await getCurrentGasPrices();\n      },\n    },\n  },\n\n  methods: {\n    async execTx() {\n      this.loading = true;\n      let args = this.click();\n      await this.wrapTx(args.abiCall, args.argsArr, args.senderObj, args.cb);\n    },\n\n    async wrapTx(\n      abiCall = () => { },\n      argsArr = [],\n      senderObj = {},\n      cb = () => { }\n    ) {\n      // console.log(senderObj);\n      this.loading = true;\n      const chosenGas = this.gasPrice;\n\n      await abiCall(...argsArr)\n        .send({\n          // Transactions now handled in accordance EIP-1559\n          from: this.userConnectedWalletAddress,\n          maxFeePerGas: BN(chosenGas.maxFeePerGas)\n            .multipliedBy(1000000000)\n            .toString(),\n          maxPriorityFeePerGas: BN(chosenGas.maxPriorityFeePerGas)\n            .multipliedBy(1000000000)\n            .toString(),\n          ...senderObj,\n        })\n\n        .on(\"transactionHash\", function (hash) {\n          notifyHandler(hash);\n        })\n        .once(\"confirmation\", async () => {\n          this.error = false;\n          notifyNotification(\"Tx successful\", \"success\");\n          await cb();\n        })\n        .on(\"error\", () => {\n          this.error = true;\n        })\n        .catch(() => {\n          this.error = true;\n        })\n        .finally(() => {\n          this.loading = false;\n        });\n    },\n  },\n};\n</script>\n","import mod from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./DappTxBtn.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./DappTxBtn.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./DappTxBtn.vue?vue&type=template&id=bc20b58e\"\nimport script from \"./DappTxBtn.vue?vue&type=script&lang=js\"\nexport * from \"./DappTxBtn.vue?vue&type=script&lang=js\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('button',{staticClass:\"text-lg text-white btn-connect\",class:{ 'btn-animated': !_vm.userAddress },attrs:{\"type\":\"button\"},on:{\"click\":_vm.handleConnect}},[(_vm.userAddress)?[_vm._v(\" \"+_vm._s(_vm.userAddress.slice(0, 4) + \"...\" + _vm.userAddress.slice(-4))+\" \")]:[_vm._v(\" Connect Wallet \")]],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <button\n    type=\"button\"\n    class=\"text-lg text-white btn-connect\"\n    :class=\"{ 'btn-animated': !userAddress }\"\n    @click=\"handleConnect\"\n  >\n    <template v-if=\"userAddress\">\n      {{ userAddress.slice(0, 4) + \"...\" + userAddress.slice(-4) }}\n    </template>\n    <template v-else>\n      Connect Wallet\n    </template>\n  </button>\n</template>\n\n<script>\nimport { mapActions, mapGetters } from \"vuex\";\n\nexport default {\n  computed: {\n    ...mapGetters({ userAddress: \"userAddress\" }),\n  },\n\n  methods: {\n    ...mapActions([\"setAddress\"]),\n\n    async handleConnect() {\n      if (!this.userAddress) {\n        await this.setAddress();\n      }\n    },\n  },\n};\n</script>\n\n<style scoped>\n.btn-connect {\n  padding: 0.5rem 1.5rem;\n  border: 3px double transparent;\n  border-radius: 80px;\n  background: linear-gradient(rgb(13, 14, 33), rgb(13, 14, 33)),\n    radial-gradient(\n      circle at left top,\n      rgb(250, 82, 160) 0%,\n      rgb(37, 167, 219) 100%\n    );\n  background-origin: border-box;\n  background-clip: padding-box, border-box;\n  background-size: 100% 100%;\n  transition: filter 0.5s ease-out;\n  white-space: nowrap;\n}\n\n.btn-animated {\n  animation: animatedButton 3s ease-out backwards infinite;\n}\n\n.btn-connect:hover {\n  -webkit-filter: drop-shadow(0px 0px 4px rgba(255, 255, 255, 0.7))\n    brightness(200%);\n  filter: drop-shadow(0px 0px 4px rgba(255, 255, 255, 0.7)) brightness(120%);\n}\n@keyframes animatedButton {\n  from {\n    background-position: 0px;\n  }\n\n  to {\n    background-position: 168.6px;\n  }\n}\n</style>\n","import mod from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ConnectButton.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ConnectButton.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./ConnectButton.vue?vue&type=template&id=220c9c21&scoped=true\"\nimport script from \"./ConnectButton.vue?vue&type=script&lang=js\"\nexport * from \"./ConnectButton.vue?vue&type=script&lang=js\"\nimport style0 from \"./ConnectButton.vue?vue&type=style&index=0&id=220c9c21&prod&scoped=true&lang=css\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"220c9c21\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"w-5/6 max-w-2xl pt-40 mx-auto\"},[_c('section',{staticClass:\"relative gap-4 p-6 my-10 text-white bg-gray-800 shadow-md rounded-xl\"},[_c('span',{staticClass:\"absolute p-1 px-3 text-sm font-bold text-gray-200 transform -translate-x-1/2 rounded-full opacity-95 left-1/2 -top-3 bg-brand-primary\"},[_vm._v(\"Beta\")]),_c('Chooser',{attrs:{\"routes\":this.routes,\"currentActive\":this.title == 'Wrap' ? 0 : 1}}),_c('div',{staticClass:\"flex flex-col items-center justify-center\"},[_c('header',{staticClass:\"pb-3 my-4 text-center\"},[_c('h1',{staticClass:\"text-3xl font-semibold\"},[_vm._v(\" \"+_vm._s(this.title)+\" \")]),_c('p',{staticClass:\"text-sm text-gray-300\"},[_vm._v(\" \"+_vm._s(this.descr)+\" \")])]),(_vm.userWalletIsConnected)?_c('div',{staticClass:\"pb-3 mb-6 border-b border-gray-700\"},[_c('aside',{staticClass:\"flex flex-wrap justify-center gap-3 md:gap-6\"},[_c('Step',{attrs:{\"title\":`Approve ${_vm.inputTokenName}`,\"completed\":this.depositStage,\"step\":\"1\"}}),_c('Step',{attrs:{\"title\":`Wrap ${_vm.inputTokenName}`,\"completed\":this.completed,\"step\":\"2\"}})],1)]):_vm._e(),(this.depositStage || this.approvalStage)?_c('label',[_c('p',{staticClass:\"text-sm font-semibold text-gray-300 mb-0.5\"},[_vm._v(\" How much \"+_vm._s(_vm.inputTokenName)+\" would you like to stake for \"+_vm._s(_vm.outputTokenName)+\"? \")]),_c('div',{staticClass:\"relative flex items-center gap-1 p-2 text-xl border border-gray-200 rounded-xl\"},[_c('input',{staticClass:\"max-w-xs ml-2 text-white bg-transparent border-none outline-none\",attrs:{\"placeholder\":this.userTokenBalance\n                .div(10 ** 18)\n                .decimalPlaces(6)\n                .toString()},domProps:{\"value\":_vm.amount},on:{\"input\":function($event){_vm.amount = isNaN(parseFloat($event.target.value))\n                ? 0\n                : $event.target.value}}}),_c('span',{staticClass:\"text-sm\"},[_vm._v(\" \"+_vm._s(_vm.inputTokenName)+\" \")]),(true)?_c('button',{staticClass:\"px-1 py-0.5 text-xs font-semibold bg-white rounded text-brand-primary\",on:{\"click\":_vm.handleFillMaxAmount}},[_vm._v(\" max \")]):_vm._e()]),_c('p',{staticClass:\"text-sm font-semibold text-gray-300 mb-0.5\"},[_vm._v(\" Current \"+_vm._s(_vm.outputTokenName)+\" Balance: \"+_vm._s(_vm.parseBN(_vm.userOutputTokenBalance))+\" \")])]):_vm._e(),(!_vm.completed)?_c('div',{staticClass:\"my-6\"},[(_vm.loading)?_c('p',[_c('ImageVue',{attrs:{\"src\":'loading.svg',\"size\":'45px'}})],1):(!_vm.userConnectedWalletAddress)?_c('ConnectButton'):[(!_vm.userHasTokenBalance)?_c('p',{staticClass:\"mt-2 text-sm font-semibold text-gray-200\"},[_vm._v(\" You need to have \"+_vm._s(_vm.inputTokenName)+\" tokens in your wallet in order to continue \"+_vm._s(_vm.outputTokenName)+\". \")]):(_vm.stage == 'approvalStage')?_c('ApprovalButton',{attrs:{\"ABI_token\":_vm.sgETH,\"ABI_spender\":_vm.wsgETH,\"amount\":this.amount,\"cb\":_vm.getUserApproved}}):(_vm.stage == 'depositStage')?_c('dapp-tx-btn',{attrs:{\"click\":_vm.handleDeposit}},[_c('span',[_vm._v(\" \"+_vm._s(this.title))])]):_vm._e()]],2):_vm._e()])],1)])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"w-5/6 max-w-2xl pt-40 mx-auto\">\n    <section\n      class=\"relative gap-4 p-6 my-10 text-white bg-gray-800 shadow-md rounded-xl\"\n    >\n      <span\n        class=\"absolute p-1 px-3 text-sm font-bold text-gray-200 transform -translate-x-1/2 rounded-full opacity-95 left-1/2 -top-3 bg-brand-primary\"\n        >Beta</span\n      >\n\n      <Chooser\n        :routes=\"this.routes\"\n        :currentActive=\"this.title == 'Wrap' ? 0 : 1\"\n      />\n\n      <div class=\"flex flex-col items-center justify-center\">\n        <header class=\"pb-3 my-4 text-center\">\n          <h1 class=\"text-3xl font-semibold\">\n            {{ this.title }}\n          </h1>\n          <p class=\"text-sm text-gray-300\">\n            {{ this.descr }}\n          </p>\n        </header>\n\n        <!-- Progress - show completed steps status -->\n        <div\n          class=\"pb-3 mb-6 border-b border-gray-700\"\n          v-if=\"userWalletIsConnected\"\n        >\n          <aside class=\"flex flex-wrap justify-center gap-3 md:gap-6\">\n            <Step\n              :title=\"`Approve ${inputTokenName}`\"\n              :completed=\"this.depositStage\"\n              step=\"1\"\n            />\n            <Step\n              :title=\"`Wrap ${inputTokenName}`\"\n              :completed=\"this.completed\"\n              step=\"2\"\n            />\n          </aside>\n        </div>\n\n        <label v-if=\"this.depositStage || this.approvalStage\">\n          <p class=\"text-sm font-semibold text-gray-300 mb-0.5\">\n            How much {{ inputTokenName }} would you like to stake for\n            {{ outputTokenName }}?\n          </p>\n          <div\n            class=\"relative flex items-center gap-1 p-2 text-xl border border-gray-200 rounded-xl\"\n          >\n            <input\n              :value=\"amount\"\n              class=\"max-w-xs ml-2 text-white bg-transparent border-none outline-none\"\n              :placeholder=\"\n                this.userTokenBalance\n                  .div(10 ** 18)\n                  .decimalPlaces(6)\n                  .toString()\n              \"\n              @input=\"\n                amount = isNaN(parseFloat($event.target.value))\n                  ? 0\n                  : $event.target.value\n              \"\n            />\n            <span class=\"text-sm\">\n              {{ inputTokenName }}\n            </span>\n            <button\n              @click=\"handleFillMaxAmount\"\n              v-if=\"true\"\n              class=\" px-1 py-0.5 text-xs font-semibold bg-white rounded text-brand-primary\"\n            >\n              max\n            </button>\n          </div>\n          <p class=\"text-sm font-semibold text-gray-300 mb-0.5\">\n            Current {{ outputTokenName }} Balance:\n            {{ parseBN(userOutputTokenBalance) }}\n          </p>\n        </label>\n\n        <!-- Action buttons -->\n        <div class=\"my-6\" v-if=\"!completed\">\n          <p v-if=\"loading\">\n            <ImageVue :src=\"'loading.svg'\" :size=\"'45px'\" />\n          </p>\n\n          <ConnectButton v-else-if=\"!userConnectedWalletAddress\" />\n\n          <template v-else>\n            <p\n              v-if=\"!userHasTokenBalance\"\n              class=\"mt-2 text-sm font-semibold text-gray-200\"\n            >\n              You need to have {{ inputTokenName }} tokens in your wallet in\n              order to continue {{ outputTokenName }}.\n            </p>\n\n            <ApprovalButton\n              v-else-if=\"stage == 'approvalStage'\"\n              :ABI_token=\"sgETH\"\n              :ABI_spender=\"wsgETH\"\n              :amount=\"this.amount\"\n              :cb=\"getUserApproved\"\n            />\n\n            <dapp-tx-btn\n              v-else-if=\"stage == 'depositStage'\"\n              :click=\"handleDeposit\"\n            >\n              <span> {{ this.title }}</span>\n            </dapp-tx-btn>\n          </template>\n        </div>\n      </div>\n    </section>\n  </div>\n</template>\n\n<script>\nimport BN from \"bignumber.js\";\nimport { wsgETH, sgETH } from \"@/contracts\";\nimport { mapGetters } from \"vuex\";\nimport Step from \"@/components/Withdraw/Step.vue\";\nimport ConnectButton from \"../Common/ConnectButton.vue\";\nimport ApprovalButton from \"../Common/ApproveButton.vue\";\nimport Chooser from \"../Common/Chooser.vue\";\nimport DappTxBtn from \"../Common/DappTxBtn.vue\";\n\nimport ImageVue from \"../Handlers/ImageVue.vue\";\nimport { toWei } from \"../../utils/common\";\n\n// Max unit is the maximum value that can be represented in Solidity\n// const MAX_UNIT = 2 ** 256 - 1;\n\nBN.config({ ROUNDING_MODE: BN.ROUND_DOWN });\nBN.config({ EXPONENTIAL_AT: 100 });\n\nexport default {\n  name: \"Wrap\",\n  components: {\n    ImageVue,\n    ConnectButton,\n    Step,\n    ApprovalButton,\n    Chooser,\n    DappTxBtn,\n  },\n\n  data() {\n    return {\n      amount: null,\n      userTokenBalance: BN(0),\n      userOutputTokenBalance: BN(0),\n      userApproved: BN(0),\n      loading: false,\n      error: false,\n      dev: true, // change to true for log\n      completed: false, // Full process completed (in one session)\n      routes: [\n        { text: \"Wrap\", cb: this.routeClickCb },\n        { text: \"Unwrap\", cb: this.routeClickCb },\n      ],\n      wsgETH: wsgETH,\n      sgETH: sgETH,\n      ABI: sgETH,\n      title: \"Wrap\",\n      descr: \"Wrap sgETH to interest bearing wsgETH\",\n      outputTokenName: \"wsgETH\",\n      inputTokenName: \"sgETH\",\n    };\n  },\n\n  watch: {\n    userConnectedWalletAddress: {\n      immediate: true,\n      async handler(address) {\n        // log the amount of veth2 the user has deposited for withdrawal\n        if (address) {\n          this.loading = true;\n          await this.refreshBalances();\n          this.loading = false;\n        }\n      },\n    },\n  },\n\n  computed: {\n    ...mapGetters({ userConnectedWalletAddress: \"userAddress\" }),\n\n    userHasTokenBalance() {\n      return this.userTokenBalance.gt(0);\n    },\n\n    userHasApprovedToken() {\n      return (\n        this.userApproved.gt(0) &&\n        this.userApproved.gte(toWei(this.amount || 0))\n      );\n    },\n\n    userCanRequestWithdrawal() {\n      const hasApprovedToken = this.userHasApprovedToken;\n      const hasTokenBalance = this.userHasTokenBalance;\n      return hasApprovedToken && hasTokenBalance;\n    },\n\n    userWalletIsConnected() {\n      return this.userConnectedWalletAddress;\n    },\n\n    amountFieldLowerThanMax() {\n      return (\n        this.amount &&\n        this.amount <\n          this.userTokenBalance\n            .div(10 ** 18)\n            .decimalPlaces(6)\n            .toString()\n      );\n    },\n    approvalStage() {\n      return this.userWalletIsConnected && !this.userHasApprovedToken;\n    },\n    depositStage() {\n      return this.userWalletIsConnected && this.userCanRequestWithdrawal;\n    },\n\n    completedStepsCount() {\n      return this.approvalStage + this.depositStage + 1;\n    },\n\n    stage() {\n      // need to improve this.\n      if (!this.userWalletIsConnected) return false;\n      let state = {\n        approvalStage: this.approvalStage,\n        depositStage: this.depositStage,\n      };\n      if (this.dev) console.log(\"State :\", state);\n      if (state.depositStage && !state.approvalStage) return \"depositStage\";\n      return \"approvalStage\";\n    },\n  },\n\n  methods: {\n    routeClickCb(index, routes) {\n      this.$router.push(`/${routes[index].text.toLowerCase()}`);\n    },\n\n    handleDeposit() {\n      return {\n        abiCall: this.wsgETH.methods.deposit,\n        argsArr: [toWei(this.amount), this.userConnectedWalletAddress],\n        cb: async () => {\n          await this.refreshBalances();\n        },\n      };\n    },\n\n    parseBN(n) {\n      return n\n        .div(10 ** 18)\n        .decimalPlaces(6)\n        .toString();\n    },\n\n    async refreshBalances() {\n      // called on mount / as cb\n      this.loading = true;\n      await this.getUserTokenBalance();\n      await this.getUserApproved();\n      await this.getUserOutputTokenBalance();\n      this.loading = false;\n    },\n\n    async getUserApproved() {\n      let userApproved = await sgETH.methods\n        .allowance(this.userConnectedWalletAddress, wsgETH.options.address)\n        .call();\n      this.userApproved = BN(userApproved);\n      if (this.dev) console.log(\"userApproved\", userApproved);\n    },\n\n    async getUserTokenBalance() {\n      let userTokenBalance = await sgETH.methods\n        .balanceOf(this.userConnectedWalletAddress)\n        .call();\n      this.userTokenBalance = BN(userTokenBalance);\n      if (this.dev) console.log(\"userTokenBalance\", userTokenBalance);\n      return userTokenBalance;\n    },\n\n    async getUserOutputTokenBalance() {\n      let userOutputTokenBalance = await wsgETH.methods\n        .balanceOf(this.userConnectedWalletAddress)\n        .call();\n      this.userOutputTokenBalance = BN(userOutputTokenBalance);\n      if (this.dev) {\n        console.log(\"userOutputTokenBalance\", userOutputTokenBalance);\n      }\n      return userOutputTokenBalance;\n    },\n\n    handleFillMaxAmount() {\n      this.amount = this.userTokenBalance\n        .div(10 ** 18)\n        .decimalPlaces(6)\n        .toString();\n    },\n  },\n};\n</script>\n","import mod from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Wrap.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Wrap.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./Wrap.vue?vue&type=template&id=5a780794\"\nimport script from \"./Wrap.vue?vue&type=script&lang=js\"\nexport * from \"./Wrap.vue?vue&type=script&lang=js\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('span',[(_vm.autoHide ? !_vm.enoughApproved : true)?_c('dapp-tx-btn',{attrs:{\"click\":_vm.genProps,\"cb\":_vm.wrappedCb}},[_c('span',[_vm._v(\"Approve\")])]):_vm._e()],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <span>\n    <dapp-tx-btn\n      v-if=\"autoHide ? !enoughApproved : true\"\n      :click=\"genProps\"\n      :cb=\"wrappedCb\"\n    >\n      <span>Approve</span>\n    </dapp-tx-btn>\n  </span>\n</template>\n\n<script>\nimport { mapGetters } from \"vuex\";\nimport DappTxBtn from \"../Common/DappTxBtn.vue\";\n\nimport BN from \"bignumber.js\";\nimport { toWei } from \"../../utils/common\";\nBN.config({ ROUNDING_MODE: BN.ROUND_DOWN });\nBN.config({ EXPONENTIAL_AT: 100 });\n\nexport default {\n  name: \"ApprovalButton\",\n  props: [\"ABI_spender\", \"ABI_token\", \"amount\", \"cb\", \"autoHide\"],\n  components: { DappTxBtn },\n  data() {\n    return {\n      userApproved: BN(0),\n    };\n  },\n\n  mounted: async function() {\n    await this.getApproved();\n  },\n\n  watch: {\n    userConnectedWalletAddress: {\n      immediate: true,\n      async handler() {\n        await this.getApproved();\n      },\n    },\n  },\n\n  computed: {\n    ...mapGetters({ userConnectedWalletAddress: \"userAddress\" }),\n\n    enoughApproved() {\n      return this.userApproved.gte(this.amount);\n    },\n\n    ethAmt() {\n      if (!this.amount) return 0;\n      return toWei(this.amount);\n    },\n  },\n\n  methods: {\n    genProps() {\n      return {\n        abiCall: this.ABI_token.methods.approve,\n        argsArr: [this.ABI_spender.options.address, this.ethAmt],\n        cb: this.wrappedCb,\n      };\n    },\n\n    async wrappedCb() {\n      await this.getApproved();\n      await this.cb();\n    },\n\n    async getApproved() {\n      let userApproved = await this.ABI_token.methods\n        .allowance(\n          this.userConnectedWalletAddress,\n          this.ABI_spender.options.address\n        )\n        .call();\n      this.userApproved = BN(userApproved);\n    },\n  },\n};\n</script>\n","import mod from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ApproveButton.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js??ref--13-1!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ApproveButton.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./ApproveButton.vue?vue&type=template&id=230127cc\"\nimport script from \"./ApproveButton.vue?vue&type=script&lang=js\"\nexport * from \"./ApproveButton.vue?vue&type=script&lang=js\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}