UNPKG

react-klasha

Version:

This is an reactJS library for implementing klasha payment gateway

1 lines 8.54 kB
{"ast":null,"code":"var _jsxFileName = \"/Users/adekanbidansteve/github/klasha/react-klasha/ionic-test/src/components/ExploreContainer.tsx\",\n _s = $RefreshSig$();\n\nimport \"./ExploreContainer.css\";\nimport { useKlashaPayment, KlashaButton } from \"../../../dist\";\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst config = {\n email: \"dansteve@email.com\",\n phone_number: \"+2348143108254\",\n merchantKey: \"GByi/gkhn5+BX4j6uI0lR7HCVo2NvTsVAQhyPko/uK4=\",\n amount: 1000,\n sourceCurrency: \"\",\n destinationCurrency: \"\",\n tx_ref: \"\" + Math.floor(Math.random() * 1000000000 + 1),\n businessId: \"1\",\n fullname: \"Dansteve Adekanbi\",\n paymentDescription: \"\",\n kit: {\n currency: \"\",\n phone_number: \"+2348143108254\",\n email: \"dansteve@email.com\",\n fullname: \"Dansteve Adekanbi\",\n tx_ref: \"\",\n paymentType: \"\"\n }\n};\n\nconst KlashaHookExample = () => {\n _s();\n\n const componentProps = { ...config\n };\n const className = \"btn\";\n\n componentProps.kit.callBack = response => console.log(response);\n\n const initializePayment = useKlashaPayment(componentProps);\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: `${className}`,\n children: /*#__PURE__*/_jsxDEV(\"button\", {\n onClick: () => {\n initializePayment();\n },\n children: \"Klasha Hooks Implementation\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 37,\n columnNumber: 7\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 36,\n columnNumber: 5\n }, this);\n};\n\n_s(KlashaHookExample, \"S3BkxfEBRB/DO8ehuTROQ1q72r8=\", false, function () {\n return [useKlashaPayment];\n});\n\n_c = KlashaHookExample;\n\nconst ExploreContainer = () => {\n const componentProps = { ...config,\n text: \"Klasha Button Implementation\"\n };\n\n componentProps.kit.callBack = response => console.log(response);\n\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"container\",\n children: [/*#__PURE__*/_jsxDEV(\"p\", {\n children: /*#__PURE__*/_jsxDEV(\"strong\", {\n className: \"ion-padding\",\n children: \"Welcome to Dansteve Adekanbi\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 59,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 58,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n children: /*#__PURE__*/_jsxDEV(\"strong\", {\n className: \"ion-padding\",\n children: \"react-Klasha package testing\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 62,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 61,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(KlashaHookExample, {}, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 65,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 64,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(KlashaButton, { ...componentProps,\n className: \"btn\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 68,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 67,\n columnNumber: 7\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 57,\n columnNumber: 5\n }, this);\n};\n\n_c2 = ExploreContainer;\nexport default ExploreContainer;\n\nvar _c, _c2;\n\n$RefreshReg$(_c, \"KlashaHookExample\");\n$RefreshReg$(_c2, \"ExploreContainer\");","map":{"version":3,"sources":["/Users/adekanbidansteve/github/klasha/react-klasha/ionic-test/src/components/ExploreContainer.tsx"],"names":["useKlashaPayment","KlashaButton","config","email","phone_number","merchantKey","amount","sourceCurrency","destinationCurrency","tx_ref","Math","floor","random","businessId","fullname","paymentDescription","kit","currency","paymentType","KlashaHookExample","componentProps","className","callBack","response","console","log","initializePayment","ExploreContainer","text"],"mappings":";;;AAAA,OAAO,wBAAP;AACA,SAASA,gBAAT,EAA2BC,YAA3B,QAA+D,eAA/D;;AAKA,MAAMC,MAA0B,GAAG;AACjCC,EAAAA,KAAK,EAAE,oBAD0B;AAEjCC,EAAAA,YAAY,EAAE,gBAFmB;AAGjCC,EAAAA,WAAW,EAAE,8CAHoB;AAIjCC,EAAAA,MAAM,EAAE,IAJyB;AAKjCC,EAAAA,cAAc,EAAE,EALiB;AAMjCC,EAAAA,mBAAmB,EAAE,EANY;AAOjCC,EAAAA,MAAM,EAAE,KAAKC,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,UAAhB,GAA6B,CAAxC,CAPoB;AAQjCC,EAAAA,UAAU,EAAE,GARqB;AASjCC,EAAAA,QAAQ,EAAE,mBATuB;AAUjCC,EAAAA,kBAAkB,EAAE,EAVa;AAWjCC,EAAAA,GAAG,EAAE;AACHC,IAAAA,QAAQ,EAAE,EADP;AAEHb,IAAAA,YAAY,EAAE,gBAFX;AAGHD,IAAAA,KAAK,EAAE,oBAHJ;AAIHW,IAAAA,QAAQ,EAAE,mBAJP;AAKHL,IAAAA,MAAM,EAAE,EALL;AAMHS,IAAAA,WAAW,EAAE;AANV;AAX4B,CAAnC;;AAqBA,MAAMC,iBAAiB,GAAG,MAAM;AAAA;;AAC9B,QAAMC,cAAc,GAAG,EACrB,GAAGlB;AADkB,GAAvB;AAGA,QAAMmB,SAAS,GAAG,KAAlB;;AACAD,EAAAA,cAAc,CAACJ,GAAf,CAAmBM,QAAnB,GAA+BC,QAAD,IAAmBC,OAAO,CAACC,GAAR,CAAYF,QAAZ,CAAjD;;AACA,QAAMG,iBAAiB,GAAG1B,gBAAgB,CAACoB,cAAD,CAA1C;AACA,sBACE;AAAK,IAAA,SAAS,EAAG,GAAEC,SAAU,EAA7B;AAAA,2BACE;AACE,MAAA,OAAO,EAAE,MAAM;AACbK,QAAAA,iBAAiB;AAClB,OAHH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,UADF;AAWD,CAlBD;;GAAMP,iB;UAMsBnB,gB;;;KANtBmB,iB;;AAoBN,MAAMQ,gBAA0C,GAAG,MAAM;AACvD,QAAMP,cAAc,GAAG,EACrB,GAAGlB,MADkB;AAErB0B,IAAAA,IAAI,EAAE;AAFe,GAAvB;;AAKAR,EAAAA,cAAc,CAACJ,GAAf,CAAmBM,QAAnB,GAA+BC,QAAD,IAAmBC,OAAO,CAACC,GAAR,CAAYF,QAAZ,CAAjD;;AAEA,sBACE;AAAK,IAAA,SAAS,EAAC,WAAf;AAAA,4BACE;AAAA,6BACE;AAAQ,QAAA,SAAS,EAAC,aAAlB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,YADF,eAIE;AAAA,6BACE;AAAQ,QAAA,SAAS,EAAC,aAAlB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,YAJF,eAOE;AAAA,6BACE,QAAC,iBAAD;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,YAPF,eAUE;AAAA,6BACE,QAAC,YAAD,OAAkBH,cAAlB;AAAkC,QAAA,SAAS,EAAC;AAA5C;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,YAVF;AAAA;AAAA;AAAA;AAAA;AAAA,UADF;AAyBD,CAjCD;;MAAMO,gB;AAmCN,eAAeA,gBAAf","sourcesContent":["import \"./ExploreContainer.css\";\nimport { useKlashaPayment, KlashaButton, KlashaConsumer } from \"../../../dist\";\nimport { KlashaOptionsProps } from \"../../../dist/types\";\n\ninterface ContainerProps {}\n\nconst config: KlashaOptionsProps = {\n email: \"dansteve@email.com\",\n phone_number: \"+2348143108254\",\n merchantKey: \"GByi/gkhn5+BX4j6uI0lR7HCVo2NvTsVAQhyPko/uK4=\",\n amount: 1000,\n sourceCurrency: \"\",\n destinationCurrency: \"\",\n tx_ref: \"\" + Math.floor(Math.random() * 1000000000 + 1),\n businessId: \"1\",\n fullname: \"Dansteve Adekanbi\",\n paymentDescription: \"\",\n kit: {\n currency: \"\",\n phone_number: \"+2348143108254\",\n email: \"dansteve@email.com\",\n fullname: \"Dansteve Adekanbi\",\n tx_ref: \"\",\n paymentType: \"\",\n },\n};\n\nconst KlashaHookExample = () => {\n const componentProps = {\n ...config,\n };\n const className = \"btn\";\n componentProps.kit.callBack = (response: any) => console.log(response);\n const initializePayment = useKlashaPayment(componentProps);\n return (\n <div className={`${className}`}>\n <button\n onClick={() => {\n initializePayment();\n }}\n >\n Klasha Hooks Implementation\n </button>\n </div>\n );\n};\n\nconst ExploreContainer: React.FC<ContainerProps> = () => {\n const componentProps = {\n ...config,\n text: \"Klasha Button Implementation\",\n };\n\n componentProps.kit.callBack = (response: any) => console.log(response);\n\n return (\n <div className=\"container\">\n <p>\n <strong className=\"ion-padding\">Welcome to Dansteve Adekanbi</strong>\n </p>\n <p>\n <strong className=\"ion-padding\">react-Klasha package testing</strong>\n </p>\n <div>\n <KlashaHookExample />\n </div>\n <div>\n <KlashaButton {...componentProps} className=\"btn\" />\n </div>\n {/* <div>\n <KlashaConsumer {...componentProps}>\n {({ initializePayment }) => (\n <button onClick={() => initializePayment()}>\n Klasha Consumer Implementation\n </button>\n )}\n </KlashaConsumer>\n </div> */}\n </div>\n );\n};\n\nexport default ExploreContainer;\n"]},"metadata":{},"sourceType":"module"}