@funnelfox/billing 0.5.0-beta.1 → 0.5.0-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/chunk-index.cjs.js +30 -22
  2. package/dist/chunk-index.cjs2.js +27 -10
  3. package/dist/chunk-index.es.js +24 -16
  4. package/dist/chunk-index.es2.js +27 -10
  5. package/dist/funnelfox-billing.cjs.js +137 -60
  6. package/dist/funnelfox-billing.esm.js +137 -60
  7. package/dist/funnelfox-billing.js +189 -87
  8. package/dist/funnelfox-billing.min.js +1 -1
  9. package/package.json +2 -2
  10. package/src/types.d.ts +65 -6
package/dist/chunk-index.es2.js CHANGED
@@ -5,12 +5,12 @@
5
5
  * @author Funnelfox
6
6
  * @license MIT
7
7
  */
8
- var template = "<div>\n <label class=\"ff-card-form-label\" for=\"cardNumberInput\">Card number</label>\n <div id=\"cardNumberInput\"></div>\n <div class=\"errorContainer\"></div>\n</div>\n<div class=\"card-form-row\">\n <div>\n <label class=\"ff-card-form-label\" for=\"expiryInput\">Expiration date</label>\n <div id=\"expiryInput\"></div>\n <div class=\"errorContainer\"></div>\n </div>\n <div>\n <label class=\"ff-card-form-label\" for=\"cvvInput\">Security code</label>\n <div id=\"cvvInput\">\n <svg width=\"200\" height=\"200\" viewBox=\"0 0 200 200\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"200\" height=\"200\" fill=\"transparent\"/>\n <g clip-path=\"url(#clip0_0_1)\">\n <path d=\"M157.555 23C168.279 23.0002 177 31.7394 177 42.4854V80.5889C171.946 72.0151 164.749 64.8558 156.146 59.8457H166.394V42.4854C166.393 37.6004 162.43 33.6291 157.555 33.6289H27.4453C22.5704 33.6291 18.6066 37.6004 18.6064 42.4854V59.8457H97.8535C88.9153 65.0512 81.4954 72.5771 76.4189 81.5986H18.6064V127.515C18.6066 132.4 22.5704 136.371 27.4453 136.371H75.3281C77.2742 140.177 79.6285 143.739 82.333 147H27.4453C16.7215 147 8.00019 138.261 8 127.515V42.4854C8.0002 31.7394 16.7215 23.0002 27.4453 23H157.555Z\" fill=\"#93939A\"/>\n <mask id=\"path-2-outside-1_0_1\" maskUnits=\"userSpaceOnUse\" x=\"68.5012\" y=\"52.0311\" width=\"135\" height=\"135\" fill=\"black\">\n <rect fill=\"white\" x=\"68.5012\" y=\"52.0311\" width=\"135\" height=\"135\"/>\n <path d=\"M190.242 160.457L170.136 140.351C166.533 145.552 162.023 150.063 156.821 153.666L176.927 173.772C178.693 175.538 181.088 176.53 183.585 176.53C186.082 176.53 188.477 175.538 190.242 173.772C192.008 172.007 193 169.612 193 167.115C193 164.618 192.008 162.223 190.242 160.457ZM126.436 157.901C116.955 157.901 107.688 155.089 99.8048 149.822C91.922 144.555 85.7781 137.069 82.15 128.31C78.5219 119.551 77.5727 109.913 79.4222 100.614C81.2718 91.3158 85.8371 82.7746 92.5409 76.0708C99.2447 69.367 107.786 64.8017 117.084 62.9521C126.383 61.1026 136.021 62.0518 144.78 65.6799C153.539 69.308 161.025 75.4519 166.292 83.3347C171.559 91.2175 174.371 100.485 174.371 109.966C174.371 122.679 169.32 134.871 160.331 143.861C151.341 152.85 139.149 157.901 126.436 157.901ZM163.719 109.966C163.719 102.592 161.532 95.3838 157.435 89.2527C153.339 83.1216 147.516 78.343 140.703 75.5212C133.891 72.6994 126.395 71.9611 119.162 73.3996C111.93 74.8382 105.287 78.389 100.073 83.6031C94.8591 88.8171 91.3083 95.4602 89.8697 102.692C88.4312 109.924 89.1695 117.421 91.9913 124.233C94.8131 131.046 99.5918 136.869 105.723 140.965C111.854 145.062 119.062 147.248 126.436 147.248C136.324 147.248 145.807 143.32 152.799 136.329C159.791 129.337 163.719 119.854 163.719 109.966ZM133.645 102.757C133.398 102.51 133.104 102.313 132.781 102.179C132.458 102.046 132.112 101.977 131.762 101.977C131.412 101.977 131.066 102.046 130.743 102.179C130.42 102.313 130.126 102.51 129.879 102.757L126.436 106.2L122.993 102.757C122.49 102.272 121.818 102.003 121.119 102.01C120.421 102.016 119.753 102.296 119.26 102.789C118.766 103.283 118.486 103.951 118.48 104.649C118.474 105.348 118.742 106.02 119.227 106.523L122.67 109.966L119.227 113.409C118.973 113.655 118.77 113.949 118.63 114.274C118.491 114.598 118.417 114.948 118.414 115.301C118.411 115.655 118.479 116.006 118.612 116.333C118.746 116.66 118.944 116.958 119.194 117.208C119.444 117.458 119.741 117.655 120.069 117.789C120.396 117.923 120.747 117.991 121.1 117.988C121.454 117.985 121.803 117.911 122.128 117.771C122.453 117.632 122.747 117.429 122.993 117.175L126.436 113.732L129.879 117.175C130.382 117.66 131.054 117.928 131.752 117.922C132.451 117.916 133.119 117.636 133.612 117.142C134.106 116.648 134.386 115.981 134.392 115.282C134.398 114.584 134.13 113.911 133.645 113.409L130.202 109.966L133.645 106.523C133.892 106.275 134.088 105.982 134.222 105.659C134.356 105.336 134.425 104.989 134.425 104.64C134.425 104.29 134.356 103.944 134.222 103.621C134.088 103.298 133.892 103.004 133.645 102.757ZM112.34 102.757C112.093 102.51 111.8 102.313 111.477 102.179C111.154 102.046 110.807 101.977 110.458 101.977C110.108 101.977 109.762 102.046 109.439 102.179C109.116 102.313 108.822 102.51 108.575 102.757L105.132 106.2L101.688 102.757C101.186 102.272 100.513 102.003 99.8151 102.01C99.1169 102.016 98.4489 102.296 97.9552 102.789C97.4614 103.283 97.1814 103.951 97.1753 104.649C97.1692 105.348 97.4377 106.02 97.9227 106.523L101.366 109.966L97.9227 113.409C97.6684 113.655 97.4655 113.949 97.326 114.274C97.1864 114.598 97.1129 114.948 97.1098 115.301C97.1068 115.655 97.1742 116.006 97.3081 116.333C97.442 116.66 97.6397 116.958 97.8897 117.208C98.1398 117.458 98.4371 117.655 98.7644 117.789C99.0917 117.923 99.4423 117.991 99.7959 117.988C100.15 117.985 100.499 117.911 100.824 117.771C101.149 117.632 101.443 117.429 101.688 117.175L105.132 113.732L108.575 117.175C109.077 117.66 109.75 117.928 110.448 117.922C111.146 117.916 111.814 117.636 112.308 117.142C112.802 116.648 113.082 115.981 113.088 115.282C113.094 114.584 112.826 113.911 112.34 113.409L108.897 109.966L112.34 106.523C112.588 106.275 112.784 105.982 112.918 105.659C113.052 105.336 113.121 104.989 113.121 104.64C113.121 104.29 113.052 103.944 112.918 103.621C112.784 103.298 112.588 103.004 112.34 102.757ZM151.506 109.966L154.949 106.523C155.434 106.02 155.703 105.348 155.697 104.649C155.691 103.951 155.41 103.283 154.917 102.789C154.423 102.296 153.755 102.016 153.057 102.01C152.359 102.003 151.686 102.272 151.184 102.757L147.74 106.2L144.297 102.757C143.795 102.272 143.122 102.003 142.424 102.01C141.726 102.016 141.058 102.296 140.564 102.789C140.07 103.283 139.79 103.951 139.784 104.649C139.778 105.348 140.046 106.02 140.531 106.523L143.974 109.966L140.531 113.409C140.277 113.655 140.074 113.949 139.935 114.274C139.795 114.598 139.722 114.948 139.719 115.301C139.715 115.655 139.783 116.006 139.917 116.333C140.051 116.66 140.248 116.958 140.498 117.208C140.748 117.458 141.046 117.655 141.373 117.789C141.7 117.923 142.051 117.991 142.405 117.988C142.758 117.985 143.108 117.911 143.433 117.771C143.757 117.632 144.051 117.429 144.297 117.175L147.74 113.732L151.184 117.175C151.686 117.66 152.359 117.928 153.057 117.922C153.755 117.916 154.423 117.636 154.917 117.142C155.41 116.648 155.691 115.981 155.697 115.282C155.703 114.584 155.434 113.911 154.949 113.409L151.506 109.966Z\"/>\n </mask>\n <path d=\"M190.242 160.457L170.136 140.351C166.533 145.552 162.023 150.063 156.821 153.666L176.927 173.772C178.693 175.538 181.088 176.53 183.585 176.53C186.082 176.53 188.477 175.538 190.242 173.772C192.008 172.007 193 169.612 193 167.115C193 164.618 192.008 162.223 190.242 160.457ZM126.436 157.901C116.955 157.901 107.688 155.089 99.8048 149.822C91.922 144.555 85.7781 137.069 82.15 128.31C78.5219 119.551 77.5727 109.913 79.4222 100.614C81.2718 91.3158 85.8371 82.7746 92.5409 76.0708C99.2447 69.367 107.786 64.8017 117.084 62.9521C126.383 61.1026 136.021 62.0518 144.78 65.6799C153.539 69.308 161.025 75.4519 166.292 83.3347C171.559 91.2175 174.371 100.485 174.371 109.966C174.371 122.679 169.32 134.871 160.331 143.861C151.341 152.85 139.149 157.901 126.436 157.901ZM163.719 109.966C163.719 102.592 161.532 95.3838 157.435 89.2527C153.339 83.1216 147.516 78.343 140.703 75.5212C133.891 72.6994 126.395 71.9611 119.162 73.3996C111.93 74.8382 105.287 78.389 100.073 83.6031C94.8591 88.8171 91.3083 95.4602 89.8697 102.692C88.4312 109.924 89.1695 117.421 91.9913 124.233C94.8131 131.046 99.5918 136.869 105.723 140.965C111.854 145.062 119.062 147.248 126.436 147.248C136.324 147.248 145.807 143.32 152.799 136.329C159.791 129.337 163.719 119.854 163.719 109.966ZM133.645 102.757C133.398 102.51 133.104 102.313 132.781 102.179C132.458 102.046 132.112 101.977 131.762 101.977C131.412 101.977 131.066 102.046 130.743 102.179C130.42 102.313 130.126 102.51 129.879 102.757L126.436 106.2L122.993 102.757C122.49 102.272 121.818 102.003 121.119 102.01C120.421 102.016 119.753 102.296 119.26 102.789C118.766 103.283 118.486 103.951 118.48 104.649C118.474 105.348 118.742 106.02 119.227 106.523L122.67 109.966L119.227 113.409C118.973 113.655 118.77 113.949 118.63 114.274C118.491 114.598 118.417 114.948 118.414 115.301C118.411 115.655 118.479 116.006 118.612 116.333C118.746 116.66 118.944 116.958 119.194 117.208C119.444 117.458 119.741 117.655 120.069 117.789C120.396 117.923 120.747 117.991 121.1 117.988C121.454 117.985 121.803 117.911 122.128 117.771C122.453 117.632 122.747 117.429 122.993 117.175L126.436 113.732L129.879 117.175C130.382 117.66 131.054 117.928 131.752 117.922C132.451 117.916 133.119 117.636 133.612 117.142C134.106 116.648 134.386 115.981 134.392 115.282C134.398 114.584 134.13 113.911 133.645 113.409L130.202 109.966L133.645 106.523C133.892 106.275 134.088 105.982 134.222 105.659C134.356 105.336 134.425 104.989 134.425 104.64C134.425 104.29 134.356 103.944 134.222 103.621C134.088 103.298 133.892 103.004 133.645 102.757ZM112.34 102.757C112.093 102.51 111.8 102.313 111.477 102.179C111.154 102.046 110.807 101.977 110.458 101.977C110.108 101.977 109.762 102.046 109.439 102.179C109.116 102.313 108.822 102.51 108.575 102.757L105.132 106.2L101.688 102.757C101.186 102.272 100.513 102.003 99.8151 102.01C99.1169 102.016 98.4489 102.296 97.9552 102.789C97.4614 103.283 97.1814 103.951 97.1753 104.649C97.1692 105.348 97.4377 106.02 97.9227 106.523L101.366 109.966L97.9227 113.409C97.6684 113.655 97.4655 113.949 97.326 114.274C97.1864 114.598 97.1129 114.948 97.1098 115.301C97.1068 115.655 97.1742 116.006 97.3081 116.333C97.442 116.66 97.6397 116.958 97.8897 117.208C98.1398 117.458 98.4371 117.655 98.7644 117.789C99.0917 117.923 99.4423 117.991 99.7959 117.988C100.15 117.985 100.499 117.911 100.824 117.771C101.149 117.632 101.443 117.429 101.688 117.175L105.132 113.732L108.575 117.175C109.077 117.66 109.75 117.928 110.448 117.922C111.146 117.916 111.814 117.636 112.308 117.142C112.802 116.648 113.082 115.981 113.088 115.282C113.094 114.584 112.826 113.911 112.34 113.409L108.897 109.966L112.34 106.523C112.588 106.275 112.784 105.982 112.918 105.659C113.052 105.336 113.121 104.989 113.121 104.64C113.121 104.29 113.052 103.944 112.918 103.621C112.784 103.298 112.588 103.004 112.34 102.757ZM151.506 109.966L154.949 106.523C155.434 106.02 155.703 105.348 155.697 104.649C155.691 103.951 155.41 103.283 154.917 102.789C154.423 102.296 153.755 102.016 153.057 102.01C152.359 102.003 151.686 102.272 151.184 102.757L147.74 106.2L144.297 102.757C143.795 102.272 143.122 102.003 142.424 102.01C141.726 102.016 141.058 102.296 140.564 102.789C140.07 103.283 139.79 103.951 139.784 104.649C139.778 105.348 140.046 106.02 140.531 106.523L143.974 109.966L140.531 113.409C140.277 113.655 140.074 113.949 139.935 114.274C139.795 114.598 139.722 114.948 139.719 115.301C139.715 115.655 139.783 116.006 139.917 116.333C140.051 116.66 140.248 116.958 140.498 117.208C140.748 117.458 141.046 117.655 141.373 117.789C141.7 117.923 142.051 117.991 142.405 117.988C142.758 117.985 143.108 117.911 143.433 117.771C143.757 117.632 144.051 117.429 144.297 117.175L147.74 113.732L151.184 117.175C151.686 117.66 152.359 117.928 153.057 117.922C153.755 117.916 154.423 117.636 154.917 117.142C155.41 116.648 155.691 115.981 155.697 115.282C155.703 114.584 155.434 113.911 154.949 113.409L151.506 109.966Z\" fill=\"#93939A\"/>\n <path d=\"M190.242 160.457L170.136 140.351C166.533 145.552 162.023 150.063 156.821 153.666L176.927 173.772C178.693 175.538 181.088 176.53 183.585 176.53C186.082 176.53 188.477 175.538 190.242 173.772C192.008 172.007 193 169.612 193 167.115C193 164.618 192.008 162.223 190.242 160.457ZM126.436 157.901C116.955 157.901 107.688 155.089 99.8048 149.822C91.922 144.555 85.7781 137.069 82.15 128.31C78.5219 119.551 77.5727 109.913 79.4222 100.614C81.2718 91.3158 85.8371 82.7746 92.5409 76.0708C99.2447 69.367 107.786 64.8017 117.084 62.9521C126.383 61.1026 136.021 62.0518 144.78 65.6799C153.539 69.308 161.025 75.4519 166.292 83.3347C171.559 91.2175 174.371 100.485 174.371 109.966C174.371 122.679 169.32 134.871 160.331 143.861C151.341 152.85 139.149 157.901 126.436 157.901ZM163.719 109.966C163.719 102.592 161.532 95.3838 157.435 89.2527C153.339 83.1216 147.516 78.343 140.703 75.5212C133.891 72.6994 126.395 71.9611 119.162 73.3996C111.93 74.8382 105.287 78.389 100.073 83.6031C94.8591 88.8171 91.3083 95.4602 89.8697 102.692C88.4312 109.924 89.1695 117.421 91.9913 124.233C94.8131 131.046 99.5918 136.869 105.723 140.965C111.854 145.062 119.062 147.248 126.436 147.248C136.324 147.248 145.807 143.32 152.799 136.329C159.791 129.337 163.719 119.854 163.719 109.966ZM133.645 102.757C133.398 102.51 133.104 102.313 132.781 102.179C132.458 102.046 132.112 101.977 131.762 101.977C131.412 101.977 131.066 102.046 130.743 102.179C130.42 102.313 130.126 102.51 129.879 102.757L126.436 106.2L122.993 102.757C122.49 102.272 121.818 102.003 121.119 102.01C120.421 102.016 119.753 102.296 119.26 102.789C118.766 103.283 118.486 103.951 118.48 104.649C118.474 105.348 118.742 106.02 119.227 106.523L122.67 109.966L119.227 113.409C118.973 113.655 118.77 113.949 118.63 114.274C118.491 114.598 118.417 114.948 118.414 115.301C118.411 115.655 118.479 116.006 118.612 116.333C118.746 116.66 118.944 116.958 119.194 117.208C119.444 117.458 119.741 117.655 120.069 117.789C120.396 117.923 120.747 117.991 121.1 117.988C121.454 117.985 121.803 117.911 122.128 117.771C122.453 117.632 122.747 117.429 122.993 117.175L126.436 113.732L129.879 117.175C130.382 117.66 131.054 117.928 131.752 117.922C132.451 117.916 133.119 117.636 133.612 117.142C134.106 116.648 134.386 115.981 134.392 115.282C134.398 114.584 134.13 113.911 133.645 113.409L130.202 109.966L133.645 106.523C133.892 106.275 134.088 105.982 134.222 105.659C134.356 105.336 134.425 104.989 134.425 104.64C134.425 104.29 134.356 103.944 134.222 103.621C134.088 103.298 133.892 103.004 133.645 102.757ZM112.34 102.757C112.093 102.51 111.8 102.313 111.477 102.179C111.154 102.046 110.807 101.977 110.458 101.977C110.108 101.977 109.762 102.046 109.439 102.179C109.116 102.313 108.822 102.51 108.575 102.757L105.132 106.2L101.688 102.757C101.186 102.272 100.513 102.003 99.8151 102.01C99.1169 102.016 98.4489 102.296 97.9552 102.789C97.4614 103.283 97.1814 103.951 97.1753 104.649C97.1692 105.348 97.4377 106.02 97.9227 106.523L101.366 109.966L97.9227 113.409C97.6684 113.655 97.4655 113.949 97.326 114.274C97.1864 114.598 97.1129 114.948 97.1098 115.301C97.1068 115.655 97.1742 116.006 97.3081 116.333C97.442 116.66 97.6397 116.958 97.8897 117.208C98.1398 117.458 98.4371 117.655 98.7644 117.789C99.0917 117.923 99.4423 117.991 99.7959 117.988C100.15 117.985 100.499 117.911 100.824 117.771C101.149 117.632 101.443 117.429 101.688 117.175L105.132 113.732L108.575 117.175C109.077 117.66 109.75 117.928 110.448 117.922C111.146 117.916 111.814 117.636 112.308 117.142C112.802 116.648 113.082 115.981 113.088 115.282C113.094 114.584 112.826 113.911 112.34 113.409L108.897 109.966L112.34 106.523C112.588 106.275 112.784 105.982 112.918 105.659C113.052 105.336 113.121 104.989 113.121 104.64C113.121 104.29 113.052 103.944 112.918 103.621C112.784 103.298 112.588 103.004 112.34 102.757ZM151.506 109.966L154.949 106.523C155.434 106.02 155.703 105.348 155.697 104.649C155.691 103.951 155.41 103.283 154.917 102.789C154.423 102.296 153.755 102.016 153.057 102.01C152.359 102.003 151.686 102.272 151.184 102.757L147.74 106.2L144.297 102.757C143.795 102.272 143.122 102.003 142.424 102.01C141.726 102.016 141.058 102.296 140.564 102.789C140.07 103.283 139.79 103.951 139.784 104.649C139.778 105.348 140.046 106.02 140.531 106.523L143.974 109.966L140.531 113.409C140.277 113.655 140.074 113.949 139.935 114.274C139.795 114.598 139.722 114.948 139.719 115.301C139.715 115.655 139.783 116.006 139.917 116.333C140.051 116.66 140.248 116.958 140.498 117.208C140.748 117.458 141.046 117.655 141.373 117.789C141.7 117.923 142.051 117.991 142.405 117.988C142.758 117.985 143.108 117.911 143.433 117.771C143.757 117.632 144.051 117.429 144.297 117.175L147.74 113.732L151.184 117.175C151.686 117.66 152.359 117.928 153.057 117.922C153.755 117.916 154.423 117.636 154.917 117.142C155.41 116.648 155.691 115.981 155.697 115.282C155.703 114.584 155.434 113.911 154.949 113.409L151.506 109.966Z\" stroke=\"transparent\" stroke-width=\"20\" mask=\"url(#path-2-outside-1_0_1)\"/>\n </g>\n <defs>\n <clipPath id=\"clip0_0_1\">\n <rect width=\"200\" height=\"200\" fill=\"white\"/>\n </clipPath>\n </defs>\n </svg>\n </div>\n <div class=\"errorContainer\"></div>\n </div>\n</div>\n";
8
+ var template = "<div>\n <label class=\"ff-card-form-label\" for=\"cardNumberInput\">Card number</label>\n <div id=\"cardNumberInput\"></div>\n <div class=\"errorContainer\"></div>\n</div>\n<div class=\"card-form-row\">\n <div>\n <label class=\"ff-card-form-label\" for=\"expiryInput\">Expiration date</label>\n <div id=\"expiryInput\"></div>\n <div class=\"errorContainer\"></div>\n </div>\n <div>\n <label class=\"ff-card-form-label\" for=\"cvvInput\">Security code</label>\n <div id=\"cvvInput\">\n <svg width=\"200\" height=\"200\" viewBox=\"0 0 200 200\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"200\" height=\"200\" fill=\"transparent\"/>\n <g clip-path=\"url(#clip0_0_1)\">\n <path d=\"M157.555 23C168.279 23.0002 177 31.7394 177 42.4854V80.5889C171.946 72.0151 164.749 64.8558 156.146 59.8457H166.394V42.4854C166.393 37.6004 162.43 33.6291 157.555 33.6289H27.4453C22.5704 33.6291 18.6066 37.6004 18.6064 42.4854V59.8457H97.8535C88.9153 65.0512 81.4954 72.5771 76.4189 81.5986H18.6064V127.515C18.6066 132.4 22.5704 136.371 27.4453 136.371H75.3281C77.2742 140.177 79.6285 143.739 82.333 147H27.4453C16.7215 147 8.00019 138.261 8 127.515V42.4854C8.0002 31.7394 16.7215 23.0002 27.4453 23H157.555Z\" fill=\"#93939A\"/>\n <mask id=\"path-2-outside-1_0_1\" maskUnits=\"userSpaceOnUse\" x=\"68.5012\" y=\"52.0311\" width=\"135\" height=\"135\" fill=\"black\">\n <rect fill=\"white\" x=\"68.5012\" y=\"52.0311\" width=\"135\" height=\"135\"/>\n <path d=\"M190.242 160.457L170.136 140.351C166.533 145.552 162.023 150.063 156.821 153.666L176.927 173.772C178.693 175.538 181.088 176.53 183.585 176.53C186.082 176.53 188.477 175.538 190.242 173.772C192.008 172.007 193 169.612 193 167.115C193 164.618 192.008 162.223 190.242 160.457ZM126.436 157.901C116.955 157.901 107.688 155.089 99.8048 149.822C91.922 144.555 85.7781 137.069 82.15 128.31C78.5219 119.551 77.5727 109.913 79.4222 100.614C81.2718 91.3158 85.8371 82.7746 92.5409 76.0708C99.2447 69.367 107.786 64.8017 117.084 62.9521C126.383 61.1026 136.021 62.0518 144.78 65.6799C153.539 69.308 161.025 75.4519 166.292 83.3347C171.559 91.2175 174.371 100.485 174.371 109.966C174.371 122.679 169.32 134.871 160.331 143.861C151.341 152.85 139.149 157.901 126.436 157.901ZM163.719 109.966C163.719 102.592 161.532 95.3838 157.435 89.2527C153.339 83.1216 147.516 78.343 140.703 75.5212C133.891 72.6994 126.395 71.9611 119.162 73.3996C111.93 74.8382 105.287 78.389 100.073 83.6031C94.8591 88.8171 91.3083 95.4602 89.8697 102.692C88.4312 109.924 89.1695 117.421 91.9913 124.233C94.8131 131.046 99.5918 136.869 105.723 140.965C111.854 145.062 119.062 147.248 126.436 147.248C136.324 147.248 145.807 143.32 152.799 136.329C159.791 129.337 163.719 119.854 163.719 109.966ZM133.645 102.757C133.398 102.51 133.104 102.313 132.781 102.179C132.458 102.046 132.112 101.977 131.762 101.977C131.412 101.977 131.066 102.046 130.743 102.179C130.42 102.313 130.126 102.51 129.879 102.757L126.436 106.2L122.993 102.757C122.49 102.272 121.818 102.003 121.119 102.01C120.421 102.016 119.753 102.296 119.26 102.789C118.766 103.283 118.486 103.951 118.48 104.649C118.474 105.348 118.742 106.02 119.227 106.523L122.67 109.966L119.227 113.409C118.973 113.655 118.77 113.949 118.63 114.274C118.491 114.598 118.417 114.948 118.414 115.301C118.411 115.655 118.479 116.006 118.612 116.333C118.746 116.66 118.944 116.958 119.194 117.208C119.444 117.458 119.741 117.655 120.069 117.789C120.396 117.923 120.747 117.991 121.1 117.988C121.454 117.985 121.803 117.911 122.128 117.771C122.453 117.632 122.747 117.429 122.993 117.175L126.436 113.732L129.879 117.175C130.382 117.66 131.054 117.928 131.752 117.922C132.451 117.916 133.119 117.636 133.612 117.142C134.106 116.648 134.386 115.981 134.392 115.282C134.398 114.584 134.13 113.911 133.645 113.409L130.202 109.966L133.645 106.523C133.892 106.275 134.088 105.982 134.222 105.659C134.356 105.336 134.425 104.989 134.425 104.64C134.425 104.29 134.356 103.944 134.222 103.621C134.088 103.298 133.892 103.004 133.645 102.757ZM112.34 102.757C112.093 102.51 111.8 102.313 111.477 102.179C111.154 102.046 110.807 101.977 110.458 101.977C110.108 101.977 109.762 102.046 109.439 102.179C109.116 102.313 108.822 102.51 108.575 102.757L105.132 106.2L101.688 102.757C101.186 102.272 100.513 102.003 99.8151 102.01C99.1169 102.016 98.4489 102.296 97.9552 102.789C97.4614 103.283 97.1814 103.951 97.1753 104.649C97.1692 105.348 97.4377 106.02 97.9227 106.523L101.366 109.966L97.9227 113.409C97.6684 113.655 97.4655 113.949 97.326 114.274C97.1864 114.598 97.1129 114.948 97.1098 115.301C97.1068 115.655 97.1742 116.006 97.3081 116.333C97.442 116.66 97.6397 116.958 97.8897 117.208C98.1398 117.458 98.4371 117.655 98.7644 117.789C99.0917 117.923 99.4423 117.991 99.7959 117.988C100.15 117.985 100.499 117.911 100.824 117.771C101.149 117.632 101.443 117.429 101.688 117.175L105.132 113.732L108.575 117.175C109.077 117.66 109.75 117.928 110.448 117.922C111.146 117.916 111.814 117.636 112.308 117.142C112.802 116.648 113.082 115.981 113.088 115.282C113.094 114.584 112.826 113.911 112.34 113.409L108.897 109.966L112.34 106.523C112.588 106.275 112.784 105.982 112.918 105.659C113.052 105.336 113.121 104.989 113.121 104.64C113.121 104.29 113.052 103.944 112.918 103.621C112.784 103.298 112.588 103.004 112.34 102.757ZM151.506 109.966L154.949 106.523C155.434 106.02 155.703 105.348 155.697 104.649C155.691 103.951 155.41 103.283 154.917 102.789C154.423 102.296 153.755 102.016 153.057 102.01C152.359 102.003 151.686 102.272 151.184 102.757L147.74 106.2L144.297 102.757C143.795 102.272 143.122 102.003 142.424 102.01C141.726 102.016 141.058 102.296 140.564 102.789C140.07 103.283 139.79 103.951 139.784 104.649C139.778 105.348 140.046 106.02 140.531 106.523L143.974 109.966L140.531 113.409C140.277 113.655 140.074 113.949 139.935 114.274C139.795 114.598 139.722 114.948 139.719 115.301C139.715 115.655 139.783 116.006 139.917 116.333C140.051 116.66 140.248 116.958 140.498 117.208C140.748 117.458 141.046 117.655 141.373 117.789C141.7 117.923 142.051 117.991 142.405 117.988C142.758 117.985 143.108 117.911 143.433 117.771C143.757 117.632 144.051 117.429 144.297 117.175L147.74 113.732L151.184 117.175C151.686 117.66 152.359 117.928 153.057 117.922C153.755 117.916 154.423 117.636 154.917 117.142C155.41 116.648 155.691 115.981 155.697 115.282C155.703 114.584 155.434 113.911 154.949 113.409L151.506 109.966Z\"/>\n </mask>\n <path d=\"M190.242 160.457L170.136 140.351C166.533 145.552 162.023 150.063 156.821 153.666L176.927 173.772C178.693 175.538 181.088 176.53 183.585 176.53C186.082 176.53 188.477 175.538 190.242 173.772C192.008 172.007 193 169.612 193 167.115C193 164.618 192.008 162.223 190.242 160.457ZM126.436 157.901C116.955 157.901 107.688 155.089 99.8048 149.822C91.922 144.555 85.7781 137.069 82.15 128.31C78.5219 119.551 77.5727 109.913 79.4222 100.614C81.2718 91.3158 85.8371 82.7746 92.5409 76.0708C99.2447 69.367 107.786 64.8017 117.084 62.9521C126.383 61.1026 136.021 62.0518 144.78 65.6799C153.539 69.308 161.025 75.4519 166.292 83.3347C171.559 91.2175 174.371 100.485 174.371 109.966C174.371 122.679 169.32 134.871 160.331 143.861C151.341 152.85 139.149 157.901 126.436 157.901ZM163.719 109.966C163.719 102.592 161.532 95.3838 157.435 89.2527C153.339 83.1216 147.516 78.343 140.703 75.5212C133.891 72.6994 126.395 71.9611 119.162 73.3996C111.93 74.8382 105.287 78.389 100.073 83.6031C94.8591 88.8171 91.3083 95.4602 89.8697 102.692C88.4312 109.924 89.1695 117.421 91.9913 124.233C94.8131 131.046 99.5918 136.869 105.723 140.965C111.854 145.062 119.062 147.248 126.436 147.248C136.324 147.248 145.807 143.32 152.799 136.329C159.791 129.337 163.719 119.854 163.719 109.966ZM133.645 102.757C133.398 102.51 133.104 102.313 132.781 102.179C132.458 102.046 132.112 101.977 131.762 101.977C131.412 101.977 131.066 102.046 130.743 102.179C130.42 102.313 130.126 102.51 129.879 102.757L126.436 106.2L122.993 102.757C122.49 102.272 121.818 102.003 121.119 102.01C120.421 102.016 119.753 102.296 119.26 102.789C118.766 103.283 118.486 103.951 118.48 104.649C118.474 105.348 118.742 106.02 119.227 106.523L122.67 109.966L119.227 113.409C118.973 113.655 118.77 113.949 118.63 114.274C118.491 114.598 118.417 114.948 118.414 115.301C118.411 115.655 118.479 116.006 118.612 116.333C118.746 116.66 118.944 116.958 119.194 117.208C119.444 117.458 119.741 117.655 120.069 117.789C120.396 117.923 120.747 117.991 121.1 117.988C121.454 117.985 121.803 117.911 122.128 117.771C122.453 117.632 122.747 117.429 122.993 117.175L126.436 113.732L129.879 117.175C130.382 117.66 131.054 117.928 131.752 117.922C132.451 117.916 133.119 117.636 133.612 117.142C134.106 116.648 134.386 115.981 134.392 115.282C134.398 114.584 134.13 113.911 133.645 113.409L130.202 109.966L133.645 106.523C133.892 106.275 134.088 105.982 134.222 105.659C134.356 105.336 134.425 104.989 134.425 104.64C134.425 104.29 134.356 103.944 134.222 103.621C134.088 103.298 133.892 103.004 133.645 102.757ZM112.34 102.757C112.093 102.51 111.8 102.313 111.477 102.179C111.154 102.046 110.807 101.977 110.458 101.977C110.108 101.977 109.762 102.046 109.439 102.179C109.116 102.313 108.822 102.51 108.575 102.757L105.132 106.2L101.688 102.757C101.186 102.272 100.513 102.003 99.8151 102.01C99.1169 102.016 98.4489 102.296 97.9552 102.789C97.4614 103.283 97.1814 103.951 97.1753 104.649C97.1692 105.348 97.4377 106.02 97.9227 106.523L101.366 109.966L97.9227 113.409C97.6684 113.655 97.4655 113.949 97.326 114.274C97.1864 114.598 97.1129 114.948 97.1098 115.301C97.1068 115.655 97.1742 116.006 97.3081 116.333C97.442 116.66 97.6397 116.958 97.8897 117.208C98.1398 117.458 98.4371 117.655 98.7644 117.789C99.0917 117.923 99.4423 117.991 99.7959 117.988C100.15 117.985 100.499 117.911 100.824 117.771C101.149 117.632 101.443 117.429 101.688 117.175L105.132 113.732L108.575 117.175C109.077 117.66 109.75 117.928 110.448 117.922C111.146 117.916 111.814 117.636 112.308 117.142C112.802 116.648 113.082 115.981 113.088 115.282C113.094 114.584 112.826 113.911 112.34 113.409L108.897 109.966L112.34 106.523C112.588 106.275 112.784 105.982 112.918 105.659C113.052 105.336 113.121 104.989 113.121 104.64C113.121 104.29 113.052 103.944 112.918 103.621C112.784 103.298 112.588 103.004 112.34 102.757ZM151.506 109.966L154.949 106.523C155.434 106.02 155.703 105.348 155.697 104.649C155.691 103.951 155.41 103.283 154.917 102.789C154.423 102.296 153.755 102.016 153.057 102.01C152.359 102.003 151.686 102.272 151.184 102.757L147.74 106.2L144.297 102.757C143.795 102.272 143.122 102.003 142.424 102.01C141.726 102.016 141.058 102.296 140.564 102.789C140.07 103.283 139.79 103.951 139.784 104.649C139.778 105.348 140.046 106.02 140.531 106.523L143.974 109.966L140.531 113.409C140.277 113.655 140.074 113.949 139.935 114.274C139.795 114.598 139.722 114.948 139.719 115.301C139.715 115.655 139.783 116.006 139.917 116.333C140.051 116.66 140.248 116.958 140.498 117.208C140.748 117.458 141.046 117.655 141.373 117.789C141.7 117.923 142.051 117.991 142.405 117.988C142.758 117.985 143.108 117.911 143.433 117.771C143.757 117.632 144.051 117.429 144.297 117.175L147.74 113.732L151.184 117.175C151.686 117.66 152.359 117.928 153.057 117.922C153.755 117.916 154.423 117.636 154.917 117.142C155.41 116.648 155.691 115.981 155.697 115.282C155.703 114.584 155.434 113.911 154.949 113.409L151.506 109.966Z\" fill=\"#93939A\"/>\n <path d=\"M190.242 160.457L170.136 140.351C166.533 145.552 162.023 150.063 156.821 153.666L176.927 173.772C178.693 175.538 181.088 176.53 183.585 176.53C186.082 176.53 188.477 175.538 190.242 173.772C192.008 172.007 193 169.612 193 167.115C193 164.618 192.008 162.223 190.242 160.457ZM126.436 157.901C116.955 157.901 107.688 155.089 99.8048 149.822C91.922 144.555 85.7781 137.069 82.15 128.31C78.5219 119.551 77.5727 109.913 79.4222 100.614C81.2718 91.3158 85.8371 82.7746 92.5409 76.0708C99.2447 69.367 107.786 64.8017 117.084 62.9521C126.383 61.1026 136.021 62.0518 144.78 65.6799C153.539 69.308 161.025 75.4519 166.292 83.3347C171.559 91.2175 174.371 100.485 174.371 109.966C174.371 122.679 169.32 134.871 160.331 143.861C151.341 152.85 139.149 157.901 126.436 157.901ZM163.719 109.966C163.719 102.592 161.532 95.3838 157.435 89.2527C153.339 83.1216 147.516 78.343 140.703 75.5212C133.891 72.6994 126.395 71.9611 119.162 73.3996C111.93 74.8382 105.287 78.389 100.073 83.6031C94.8591 88.8171 91.3083 95.4602 89.8697 102.692C88.4312 109.924 89.1695 117.421 91.9913 124.233C94.8131 131.046 99.5918 136.869 105.723 140.965C111.854 145.062 119.062 147.248 126.436 147.248C136.324 147.248 145.807 143.32 152.799 136.329C159.791 129.337 163.719 119.854 163.719 109.966ZM133.645 102.757C133.398 102.51 133.104 102.313 132.781 102.179C132.458 102.046 132.112 101.977 131.762 101.977C131.412 101.977 131.066 102.046 130.743 102.179C130.42 102.313 130.126 102.51 129.879 102.757L126.436 106.2L122.993 102.757C122.49 102.272 121.818 102.003 121.119 102.01C120.421 102.016 119.753 102.296 119.26 102.789C118.766 103.283 118.486 103.951 118.48 104.649C118.474 105.348 118.742 106.02 119.227 106.523L122.67 109.966L119.227 113.409C118.973 113.655 118.77 113.949 118.63 114.274C118.491 114.598 118.417 114.948 118.414 115.301C118.411 115.655 118.479 116.006 118.612 116.333C118.746 116.66 118.944 116.958 119.194 117.208C119.444 117.458 119.741 117.655 120.069 117.789C120.396 117.923 120.747 117.991 121.1 117.988C121.454 117.985 121.803 117.911 122.128 117.771C122.453 117.632 122.747 117.429 122.993 117.175L126.436 113.732L129.879 117.175C130.382 117.66 131.054 117.928 131.752 117.922C132.451 117.916 133.119 117.636 133.612 117.142C134.106 116.648 134.386 115.981 134.392 115.282C134.398 114.584 134.13 113.911 133.645 113.409L130.202 109.966L133.645 106.523C133.892 106.275 134.088 105.982 134.222 105.659C134.356 105.336 134.425 104.989 134.425 104.64C134.425 104.29 134.356 103.944 134.222 103.621C134.088 103.298 133.892 103.004 133.645 102.757ZM112.34 102.757C112.093 102.51 111.8 102.313 111.477 102.179C111.154 102.046 110.807 101.977 110.458 101.977C110.108 101.977 109.762 102.046 109.439 102.179C109.116 102.313 108.822 102.51 108.575 102.757L105.132 106.2L101.688 102.757C101.186 102.272 100.513 102.003 99.8151 102.01C99.1169 102.016 98.4489 102.296 97.9552 102.789C97.4614 103.283 97.1814 103.951 97.1753 104.649C97.1692 105.348 97.4377 106.02 97.9227 106.523L101.366 109.966L97.9227 113.409C97.6684 113.655 97.4655 113.949 97.326 114.274C97.1864 114.598 97.1129 114.948 97.1098 115.301C97.1068 115.655 97.1742 116.006 97.3081 116.333C97.442 116.66 97.6397 116.958 97.8897 117.208C98.1398 117.458 98.4371 117.655 98.7644 117.789C99.0917 117.923 99.4423 117.991 99.7959 117.988C100.15 117.985 100.499 117.911 100.824 117.771C101.149 117.632 101.443 117.429 101.688 117.175L105.132 113.732L108.575 117.175C109.077 117.66 109.75 117.928 110.448 117.922C111.146 117.916 111.814 117.636 112.308 117.142C112.802 116.648 113.082 115.981 113.088 115.282C113.094 114.584 112.826 113.911 112.34 113.409L108.897 109.966L112.34 106.523C112.588 106.275 112.784 105.982 112.918 105.659C113.052 105.336 113.121 104.989 113.121 104.64C113.121 104.29 113.052 103.944 112.918 103.621C112.784 103.298 112.588 103.004 112.34 102.757ZM151.506 109.966L154.949 106.523C155.434 106.02 155.703 105.348 155.697 104.649C155.691 103.951 155.41 103.283 154.917 102.789C154.423 102.296 153.755 102.016 153.057 102.01C152.359 102.003 151.686 102.272 151.184 102.757L147.74 106.2L144.297 102.757C143.795 102.272 143.122 102.003 142.424 102.01C141.726 102.016 141.058 102.296 140.564 102.789C140.07 103.283 139.79 103.951 139.784 104.649C139.778 105.348 140.046 106.02 140.531 106.523L143.974 109.966L140.531 113.409C140.277 113.655 140.074 113.949 139.935 114.274C139.795 114.598 139.722 114.948 139.719 115.301C139.715 115.655 139.783 116.006 139.917 116.333C140.051 116.66 140.248 116.958 140.498 117.208C140.748 117.458 141.046 117.655 141.373 117.789C141.7 117.923 142.051 117.991 142.405 117.988C142.758 117.985 143.108 117.911 143.433 117.771C143.757 117.632 144.051 117.429 144.297 117.175L147.74 113.732L151.184 117.175C151.686 117.66 152.359 117.928 153.057 117.922C153.755 117.916 154.423 117.636 154.917 117.142C155.41 116.648 155.691 115.981 155.697 115.282C155.703 114.584 155.434 113.911 154.949 113.409L151.506 109.966Z\" stroke=\"transparent\" stroke-width=\"20\" mask=\"url(#path-2-outside-1_0_1)\"/>\n </g>\n <defs>\n <clipPath id=\"clip0_0_1\">\n <rect width=\"200\" height=\"200\" fill=\"white\"/>\n </clipPath>\n </defs>\n </svg>\n </div>\n <div class=\"errorContainer\"></div>\n </div>\n</div>\n<div>\n <label class=\"ff-card-form-label\" for=\"cardHolderInput\">Card holder</label>\n <input class=\"ff-card-form-cardholder-input\" id=\"cardHolderInput\" placeholder=\"Card holder\">\n <div class=\"errorContainer\"></div>\n</div>\n";
9
9
 
10
- if(typeof document!=="undefined")document.head.appendChild(document.createElement("style")).textContent="\n\n.ff-card-form-label {\n display: block;\n font-size: 16px;\n margin-bottom: 5px;\n }\n \n .card-form-row {\n display: flex;\n flex-direction: row;\n gap: 10px;\n }\n \n .ff-card-form-cardholder-input {\n padding-left: 10px;\n padding-right: 10px;\n box-sizing: border-box;\n height: 36px;\n width: 100%;\n font-size: 1rem;\n background-color: transparent;\n border: 1px solid rgb(0 0 0 / 10%);\n border-radius: 6px;\n transition: all 0.3s ease;\n box-shadow: none;\n }\n .ff-card-form-cardholder-input.error {\n border-color: #e32f41;\n }\n \n .errorContainer {\n color: #d10000;\n font-size: 16px;\n }\n\n #cvvInput {\n position: relative;\n }\n \n #cvvInput > svg {\n z-index: 1;\n position: absolute;\n top: 5px;\n right: 5px;\n width: 26px;\n height: 26px;\n }";
10
+ if(typeof document!=="undefined")document.head.appendChild(document.createElement("style")).textContent="\n\n.ff-card-form-label {\n display: block;\n font-size: 16px;\n margin-bottom: 5px;\n }\n \n .card-form-row {\n display: flex;\n flex-direction: row;\n gap: 10px;\n }\n \n .ff-card-form-cardholder-input {\n margin: 0 0 3px;\n padding-left: 10px;\n padding-right: 10px;\n box-sizing: border-box;\n height: 36px;\n width: 100%;\n font-size: 1rem;\n background-color: transparent;\n border: 1px solid rgb(0 0 0 / 10%);\n border-radius: 6px;\n transition: all 0.3s ease;\n box-shadow: none;\n outline: none;\n }\n .ff-card-form-cardholder-input.error {\n border-color: #e32f41;\n }\n \n .errorContainer:not(:empty) {\n color: #d10000;\n font-size: 16px;\n line-height: 1;\n margin: 0 0 10px;\n }\n\n #cvvInput {\n position: relative;\n }\n \n #cvvInput > svg {\n z-index: 1;\n position: absolute;\n top: 5px;\n right: 5px;\n width: 26px;\n height: 26px;\n }";
11
11
 
12
12
  class CardSkin {
13
- constructor(containerEl) {
13
+ constructor(containerEl, checkoutConfig) {
14
14
  this.onInputError = (event) => {
15
15
  const { name, error } = event;
16
16
  const cardInputElements = this.getCardInputElements();
@@ -18,27 +18,43 @@ class CardSkin {
18
18
  cardNumber: cardInputElements.cardNumber.parentElement,
19
19
  expiryDate: cardInputElements.expiryDate.parentElement,
20
20
  cvv: cardInputElements.cvv.parentElement,
21
+ cardholderName: cardInputElements.cardholderName?.parentElement,
21
22
  };
22
23
  const errorContainer = elementsMap[name]?.querySelector('.errorContainer');
23
24
  if (errorContainer) {
24
25
  errorContainer.textContent = error || '';
25
26
  }
27
+ if (name === 'cardholderName') {
28
+ if (error) {
29
+ cardInputElements.cardholderName?.classList?.add('error');
30
+ }
31
+ else {
32
+ cardInputElements.cardholderName?.classList?.remove('error');
33
+ }
34
+ }
35
+ };
36
+ this.onMethodRender = () => {
37
+ this.containerEl.style.display = 'block';
26
38
  };
27
39
  if (!containerEl) {
28
40
  throw new Error('Container element not found');
29
41
  }
30
42
  this.containerEl = containerEl;
31
- // Initialize with placeholders; real nodes will be wired in `init`.
32
- this.cardInputElements = {
33
- cardNumber: document.createElement('div'),
34
- expiryDate: document.createElement('div'),
35
- cvv: document.createElement('div'),
36
- };
43
+ this.checkoutConfig = checkoutConfig;
44
+ this.containerEl.style.display = 'none';
37
45
  }
38
46
  wireCardInputs() {
39
47
  const cardNumber = this.containerEl.querySelector('#cardNumberInput');
40
48
  const expiryDate = this.containerEl.querySelector('#expiryInput');
41
49
  const cvv = this.containerEl.querySelector('#cvvInput');
50
+ let cardholderName = null;
51
+ if (this.checkoutConfig?.card?.cardholderName) {
52
+ cardholderName =
53
+ this.containerEl.querySelector('#cardHolderInput');
54
+ }
55
+ else {
56
+ this.containerEl.querySelector('#cardHolderInput').parentElement.style.display = 'none';
57
+ }
42
58
  if (!cardNumber || !expiryDate || !cvv) {
43
59
  throw new Error('One or more card input elements are missing in the default skin');
44
60
  }
@@ -46,6 +62,7 @@ class CardSkin {
46
62
  cardNumber,
47
63
  expiryDate,
48
64
  cvv,
65
+ cardholderName,
49
66
  };
50
67
  }
51
68
  async init() {
@@ -72,7 +89,7 @@ class CardSkin {
72
89
  cardElements: this.getCardInputElements(),
73
90
  card: {
74
91
  cardholderName: {
75
- required: false,
92
+ required: !!this.checkoutConfig?.card?.cardholderName,
76
93
  },
77
94
  },
78
95
  };
package/dist/funnelfox-billing.cjs.js CHANGED
@@ -217,7 +217,7 @@ exports.PaymentMethod = void 0;
217
217
  /**
218
218
  * @fileoverview Constants for Funnefox SDK
219
219
  */
220
- const SDK_VERSION = '0.5.0-beta.1';
220
+ const SDK_VERSION = '0.5.0-beta.3';
221
221
  const DEFAULTS = {
222
222
  BASE_URL: 'https://billing.funnelfox.com',
223
223
  REGION: 'default',
@@ -249,6 +249,7 @@ const EVENTS = {
249
249
  PURCHASE_FAILURE: 'purchase-failure',
250
250
  PURCHASE_COMPLETED: 'purchase-completed',
251
251
  PURCHASE_CANCELLED: 'purchase-cancelled',
252
+ METHODS_AVAILABLE: 'methods-available',
252
253
  };
253
254
  const API_ENDPOINTS = {
254
255
  CREATE_CLIENT_SESSION: '/v1/checkout/create_client_session',
@@ -295,6 +296,12 @@ const inputStyle = {
295
296
  ({
296
297
  paddingLeft: inputStyle.input.base.paddingHorizontal + 'px',
297
298
  paddingRight: inputStyle.input.base.paddingHorizontal + 'px'});
299
+ const DEFAULT_PAYMENT_METHOD_ORDER = [
300
+ exports.PaymentMethod.APPLE_PAY,
301
+ exports.PaymentMethod.GOOGLE_PAY,
302
+ exports.PaymentMethod.PAYPAL,
303
+ exports.PaymentMethod.PAYMENT_CARD,
304
+ ];
298
305
 
299
306
  /**
300
307
  * @fileoverview Primer SDK integration wrapper
@@ -334,25 +341,44 @@ class PrimerWrapper {
334
341
  throw new PrimerError('Failed to create Primer headless checkout', error);
335
342
  }
336
343
  }
337
- initializeCardElements(selectors) {
338
- const { cardNumber, expiryDate, cvv, cardholderName, button } = selectors;
339
- return {
340
- cardNumber: document.querySelector(cardNumber),
341
- expiryDate: document.querySelector(expiryDate),
342
- cvv: document.querySelector(cvv),
343
- cardholderName: document.querySelector(cardholderName),
344
- button: document.querySelector(button),
345
- };
346
- }
347
344
  disableButtons(disabled) {
348
345
  if (!this.paymentMethodsInterfaces)
349
346
  return;
350
- for (const method in this.paymentMethodsInterfaces) {
351
- this.paymentMethodsInterfaces[method].setDisabled(disabled);
347
+ for (const paymentMethodInterface of this.paymentMethodsInterfaces) {
348
+ paymentMethodInterface.setDisabled(disabled);
352
349
  }
353
350
  }
354
- async renderButton(allowedPaymentMethod, { container, }) {
355
- const containerEl = this.validateContainer(container);
351
+ waitForPayPalReady() {
352
+ return new Promise((resolve, reject) => {
353
+ let counter = 0;
354
+ const checkPayPalEnabler = async () => {
355
+ /**
356
+ * Wait 1000 seconds for PayPal SDK to initialize
357
+ */
358
+ await new Promise(resolve => {
359
+ setTimeout(() => {
360
+ resolve();
361
+ }, 1000);
362
+ });
363
+ /**
364
+ * @link https://github.com/krakenjs/zoid/issues/334
365
+ */
366
+ // @ts-expect-error paymentMethod is private property
367
+ const isPayPalReady = !!window?.paypalPrimer?.Buttons?.instances?.[0];
368
+ if (++counter < 20 && !isPayPalReady) {
369
+ setTimeout(checkPayPalEnabler, 0);
370
+ }
371
+ else if (!isPayPalReady) {
372
+ reject(new PrimerError('PayPal paypal_js_sdk_v5_unhandled_exception was detected', exports.PaymentMethod.PAYPAL));
373
+ }
374
+ else {
375
+ resolve();
376
+ }
377
+ };
378
+ checkPayPalEnabler();
379
+ });
380
+ }
381
+ async renderButton(allowedPaymentMethod, { htmlNode, onMethodRenderError, onMethodRender, }) {
356
382
  let button;
357
383
  this.ensurePrimerAvailable();
358
384
  if (!this.headless) {
@@ -364,10 +390,21 @@ class PrimerWrapper {
364
390
  throw new Error('Payment method manager is not available');
365
391
  }
366
392
  button = pmManager.createButton();
367
- await button.render(containerEl, {});
393
+ await button.render(htmlNode, {});
394
+ if (allowedPaymentMethod === exports.PaymentMethod.PAYPAL) {
395
+ await this.waitForPayPalReady();
396
+ }
368
397
  this.destroyCallbacks.push(() => button.clean());
398
+ onMethodRender(allowedPaymentMethod);
399
+ return {
400
+ setDisabled: (disabled) => {
401
+ button.setDisabled(disabled);
402
+ },
403
+ destroy: () => button.clean(),
404
+ };
369
405
  }
370
406
  catch (error) {
407
+ onMethodRenderError(allowedPaymentMethod);
371
408
  throw new PrimerError('Failed to initialize Primer checkout', error);
372
409
  }
373
410
  }
@@ -378,7 +415,7 @@ class PrimerWrapper {
378
415
  !options.onInputChange) {
379
416
  throw new PrimerError('Card elements, onSubmit, and onInputChange are required for PAYMENT_CARD method');
380
417
  }
381
- return this.renderCardCheckoutWithElements(options.cardElements, {
418
+ return await this.renderCardCheckoutWithElements(options.cardElements, {
382
419
  onSubmit: options.onSubmit,
383
420
  onInputChange: options.onInputChange,
384
421
  onMethodRenderError: options.onMethodRenderError,
@@ -386,23 +423,14 @@ class PrimerWrapper {
386
423
  });
387
424
  }
388
425
  else {
389
- // For button methods, render directly into htmlNode
390
- this.ensurePrimerAvailable();
391
- if (!this.headless) {
392
- throw new PrimerError('Headless checkout not found');
393
- }
394
426
  try {
395
- const pmManager = await this.headless.createPaymentMethodManager(method);
396
- if (!pmManager) {
397
- throw new Error('Payment method manager is not available');
398
- }
399
- const button = pmManager.createButton();
400
- await button.render(htmlNode, {});
401
- this.destroyCallbacks.push(() => button.clean());
402
- options.onMethodRender(method);
427
+ return await this.renderButton(method, {
428
+ htmlNode,
429
+ onMethodRenderError: options.onMethodRenderError,
430
+ onMethodRender: options.onMethodRender,
431
+ });
403
432
  }
404
433
  catch (error) {
405
- options.onMethodRenderError(method);
406
434
  throw new PrimerError('Failed to initialize Primer checkout', error);
407
435
  }
408
436
  }
@@ -475,8 +503,8 @@ class PrimerWrapper {
475
503
  ]);
476
504
  const onDestroy = () => {
477
505
  pmManager.removeHostedInputs();
478
- elements.cardholderName.removeEventListener('change', cardHolderOnChange);
479
- elements.button.removeEventListener('click', onSubmitHandler);
506
+ elements.cardholderName?.removeEventListener('change', cardHolderOnChange);
507
+ elements.button?.removeEventListener('click', onSubmitHandler);
480
508
  };
481
509
  this.destroyCallbacks.push(onDestroy);
482
510
  onMethodRender(exports.PaymentMethod.PAYMENT_CARD);
@@ -495,6 +523,7 @@ class PrimerWrapper {
495
523
  };
496
524
  }
497
525
  catch (error) {
526
+ onMethodRenderError(exports.PaymentMethod.PAYMENT_CARD);
498
527
  throw new PrimerError('Failed to initialize Primer checkout', error);
499
528
  }
500
529
  }
@@ -523,12 +552,13 @@ class PrimerWrapper {
523
552
  });
524
553
  }
525
554
  async renderCheckout(clientToken, checkoutOptions, checkoutRenderOptions) {
526
- const { cardElements, paymentButtonElements, container, onSubmit, onInputChange, onMethodRender, onMethodRenderError, } = checkoutRenderOptions;
555
+ const { cardElements, paymentButtonElements, container, onSubmit, onInputChange, onMethodRender, onMethodRenderError, onMethodsAvailable, } = checkoutRenderOptions;
527
556
  await this.initializeHeadlessCheckout(clientToken, checkoutOptions);
528
- for (const method of this.availableMethods) {
557
+ onMethodsAvailable?.(this.availableMethods);
558
+ return Promise.all(this.availableMethods.map(method => {
529
559
  if (method === exports.PaymentMethod.PAYMENT_CARD) {
530
560
  // For card, use the main container
531
- await this.initMethod(method, container, {
561
+ return this.initMethod(method, container, {
532
562
  cardElements,
533
563
  onSubmit,
534
564
  onInputChange,
@@ -544,13 +574,15 @@ class PrimerWrapper {
544
574
  };
545
575
  // For buttons, use the specific button container element
546
576
  const buttonElement = buttonElementsMap[method];
547
- await this.initMethod(method, buttonElement, {
577
+ return this.initMethod(method, buttonElement, {
548
578
  onMethodRender,
549
579
  onMethodRenderError,
550
580
  });
551
581
  }
552
- }
553
- this.isInitialized = true;
582
+ })).then((interfaces) => {
583
+ this.paymentMethodsInterfaces = interfaces;
584
+ this.isInitialized = true;
585
+ });
554
586
  }
555
587
  wrapTokenizeHandler(handler) {
556
588
  return async (paymentMethodTokenData, primerHandler) => {
@@ -845,12 +877,6 @@ class CheckoutInstance extends EventEmitter {
845
877
  constructor(config) {
846
878
  super();
847
879
  this.counter = 0;
848
- this.paymentMethodOrder = [
849
- exports.PaymentMethod.APPLE_PAY,
850
- exports.PaymentMethod.GOOGLE_PAY,
851
- exports.PaymentMethod.PAYPAL,
852
- exports.PaymentMethod.PAYMENT_CARD,
853
- ];
854
880
  this.handleInputChange = (inputName, error) => {
855
881
  this.emit(EVENTS.INPUT_ERROR, { name: inputName, error });
856
882
  };
@@ -907,6 +933,9 @@ class CheckoutInstance extends EventEmitter {
907
933
  this._setState('ready');
908
934
  }
909
935
  };
936
+ this.handleMethodsAvailable = (methods) => {
937
+ this.emit(EVENTS.METHODS_AVAILABLE, methods);
938
+ };
910
939
  this.onLoaderChangeWithRace = (state) => {
911
940
  const isLoading = !!(state ? ++this.counter : --this.counter);
912
941
  this.emit(EVENTS.LOADER_CHANGE, isLoading);
@@ -976,14 +1005,31 @@ class CheckoutInstance extends EventEmitter {
976
1005
  timeout: DEFAULTS.REQUEST_TIMEOUT,
977
1006
  retryAttempts: DEFAULTS.RETRY_ATTEMPTS,
978
1007
  });
979
- const sessionResponse = await this.apiClient.createClientSession({
1008
+ const sessionParams = {
980
1009
  priceId: this.checkoutConfig.priceId,
981
1010
  externalId: this.checkoutConfig.customer.externalId,
982
1011
  email: this.checkoutConfig.customer.email,
983
1012
  region: this.region || DEFAULTS.REGION,
984
1013
  clientMetadata: this.checkoutConfig.clientMetadata,
985
1014
  countryCode: this.checkoutConfig.customer.countryCode,
986
- });
1015
+ };
1016
+ const cacheKey = [
1017
+ this.orgId,
1018
+ this.checkoutConfig.priceId,
1019
+ this.checkoutConfig.customer.externalId,
1020
+ this.checkoutConfig.customer.email,
1021
+ ].join('-');
1022
+ let sessionResponse;
1023
+ // Return cached response if payload hasn't changed
1024
+ const cachedResponse = CheckoutInstance.sessionCache.get(cacheKey);
1025
+ if (cachedResponse) {
1026
+ sessionResponse = cachedResponse;
1027
+ }
1028
+ else {
1029
+ sessionResponse = await this.apiClient.createClientSession(sessionParams);
1030
+ // Cache the successful response
1031
+ CheckoutInstance.sessionCache.set(cacheKey, sessionResponse);
1032
+ }
987
1033
  const sessionData = this.apiClient.processSessionResponse(sessionResponse);
988
1034
  this.orderId = sessionData.orderId;
989
1035
  this.clientToken = sessionData.clientToken;
@@ -1030,9 +1076,8 @@ class CheckoutInstance extends EventEmitter {
1030
1076
  let checkoutOptions;
1031
1077
  if (!this.checkoutConfig.cardSelectors ||
1032
1078
  !this.checkoutConfig.paymentButtonSelectors) {
1033
- if (this.checkoutConfig.paymentMethodOrder) {
1034
- this.paymentMethodOrder = this.checkoutConfig.paymentMethodOrder;
1035
- }
1079
+ this.checkoutConfig.paymentMethodOrder =
1080
+ this.checkoutConfig.paymentMethodOrder || DEFAULT_PAYMENT_METHOD_ORDER;
1036
1081
  const defaultSkinCheckoutOptions = await this.getDefaultSkinCheckoutOptions();
1037
1082
  if (!defaultSkinCheckoutOptions.cardElements ||
1038
1083
  !defaultSkinCheckoutOptions.paymentButtonElements) {
@@ -1044,14 +1089,14 @@ class CheckoutInstance extends EventEmitter {
1044
1089
  checkoutOptions = this.getCheckoutOptions(defaultSkinCheckoutOptions);
1045
1090
  }
1046
1091
  else {
1092
+ if (this.checkoutConfig.paymentMethodOrder) {
1093
+ // eslint-disable-next-line no-console
1094
+ console.warn('paymentMethodOrder is using only for default skin and will be ignored if you are using custom checkout');
1095
+ }
1047
1096
  cardElements = this.convertCardSelectorsToElements(this.checkoutConfig.cardSelectors, containerElement);
1048
1097
  paymentButtonElements = this.convertPaymentButtonSelectorsToElements(this.checkoutConfig.paymentButtonSelectors);
1049
1098
  checkoutOptions = this.getCheckoutOptions({});
1050
1099
  }
1051
- if (this.checkoutConfig.paymentMethodOrder) {
1052
- // eslint-disable-next-line no-console
1053
- console.warn('paymentMethodOrder is using only for default skin and will be ignored if you are using custom checkout');
1054
- }
1055
1100
  await this.primerWrapper.renderCheckout(this.clientToken, checkoutOptions, {
1056
1101
  container: containerElement,
1057
1102
  cardElements,
@@ -1059,6 +1104,8 @@ class CheckoutInstance extends EventEmitter {
1059
1104
  onSubmit: this.handleSubmit,
1060
1105
  onInputChange: this.handleInputChange,
1061
1106
  onMethodRender: this.handleMethodRender,
1107
+ onMethodsAvailable: this.handleMethodsAvailable,
1108
+ onMethodRenderError: this.handleMethodRenderError,
1062
1109
  });
1063
1110
  }
1064
1111
  async _processPaymentResult(result, primerHandler) {
@@ -1139,6 +1186,8 @@ class CheckoutInstance extends EventEmitter {
1139
1186
  }
1140
1187
  try {
1141
1188
  this._setState('updating');
1189
+ // Invalidate session cache
1190
+ CheckoutInstance.sessionCache.clear();
1142
1191
  await this.apiClient.updateClientSession({
1143
1192
  orderId: this.orderId,
1144
1193
  clientToken: this.clientToken,
@@ -1208,7 +1257,7 @@ class CheckoutInstance extends EventEmitter {
1208
1257
  async getDefaultSkinCheckoutOptions() {
1209
1258
  const skinFactory = (await Promise.resolve().then(function () { return require('./chunk-index.cjs.js'); }))
1210
1259
  .default;
1211
- const skin = await skinFactory(this.primerWrapper, this.checkoutConfig.container, this.paymentMethodOrder);
1260
+ const skin = await skinFactory(this.primerWrapper, this.checkoutConfig);
1212
1261
  this.on(EVENTS.INPUT_ERROR, skin.onInputError);
1213
1262
  this.on(EVENTS.STATUS_CHANGE, skin.onStatusChange);
1214
1263
  this.on(EVENTS.ERROR, (error) => skin.onError(error));
@@ -1219,13 +1268,15 @@ class CheckoutInstance extends EventEmitter {
1219
1268
  this.on(EVENTS.START_PURCHASE, skin.onStartPurchase);
1220
1269
  this.on(EVENTS.PURCHASE_FAILURE, skin.onPurchaseFailure);
1221
1270
  this.on(EVENTS.PURCHASE_COMPLETED, skin.onPurchaseCompleted);
1271
+ this.on(EVENTS.METHODS_AVAILABLE, skin.onMethodsAvailable);
1222
1272
  return skin.getCheckoutOptions();
1223
1273
  }
1224
1274
  async getCardDefaultSkinCheckoutOptions(node) {
1225
1275
  const CardSkin = (await Promise.resolve().then(function () { return require('./chunk-index.cjs2.js'); })).default;
1226
- const skin = new CardSkin(node);
1276
+ const skin = new CardSkin(node, this.checkoutConfig);
1227
1277
  skin.init();
1228
1278
  this.on(EVENTS.INPUT_ERROR, skin.onInputError);
1279
+ this.on(EVENTS.METHOD_RENDER, skin.onMethodRender);
1229
1280
  return skin.getCheckoutOptions();
1230
1281
  }
1231
1282
  showInitializingLoader() {
@@ -1235,6 +1286,7 @@ class CheckoutInstance extends EventEmitter {
1235
1286
  hideLoader();
1236
1287
  }
1237
1288
  }
1289
+ CheckoutInstance.sessionCache = new Map();
1238
1290
 
1239
1291
  /**
1240
1292
  * @fileoverview Public API with configuration and orchestration logic
@@ -1290,6 +1342,28 @@ async function createClientSession(params) {
1290
1342
  });
1291
1343
  return apiClient.processSessionResponse(sessionResponse);
1292
1344
  }
1345
+ async function silentPurchase(options) {
1346
+ const { priceId, externalId, clientMetadata, orgId, baseUrl } = options;
1347
+ const apiClient = new APIClient({
1348
+ baseUrl: baseUrl,
1349
+ orgId: orgId,
1350
+ timeout: DEFAULTS.REQUEST_TIMEOUT,
1351
+ retryAttempts: DEFAULTS.RETRY_ATTEMPTS,
1352
+ });
1353
+ const response = await apiClient.oneClick({
1354
+ pp_ident: priceId,
1355
+ external_id: externalId,
1356
+ client_metadata: clientMetadata,
1357
+ });
1358
+ if (response.status !== 'success' &&
1359
+ response.error.some(({ code }) => code === 'double_purchase')) {
1360
+ throw new APIError('This product was already purchased');
1361
+ }
1362
+ else if (response.status !== 'success') {
1363
+ return false;
1364
+ }
1365
+ return true;
1366
+ }
1293
1367
  async function initMethod(method, element, options) {
1294
1368
  const checkoutInstance = new CheckoutInstance({
1295
1369
  orgId: options.orgId,
@@ -1302,6 +1376,11 @@ async function initMethod(method, element, options) {
1302
1376
  },
1303
1377
  container: '',
1304
1378
  clientMetadata: options.meta,
1379
+ card: options.card,
1380
+ style: options.style,
1381
+ applePay: options.applePay,
1382
+ paypal: options.paypal,
1383
+ googlePay: options.googlePay,
1305
1384
  },
1306
1385
  });
1307
1386
  checkoutInstance._ensureNotDestroyed();
@@ -1318,7 +1397,6 @@ async function initMethod(method, element, options) {
1318
1397
  if (method === exports.PaymentMethod.PAYMENT_CARD) {
1319
1398
  const cardDefaultOptions = await checkoutInstance['getCardDefaultSkinCheckoutOptions'](element);
1320
1399
  const checkoutOptions = checkoutInstance['getCheckoutOptions']({
1321
- style: options.styles,
1322
1400
  ...cardDefaultOptions,
1323
1401
  });
1324
1402
  await checkoutInstance.primerWrapper.initializeHeadlessCheckout(checkoutInstance.clientToken, checkoutOptions);
@@ -1330,9 +1408,7 @@ async function initMethod(method, element, options) {
1330
1408
  onMethodRenderError: checkoutInstance['handleMethodRenderError'],
1331
1409
  });
1332
1410
  }
1333
- await checkoutInstance.primerWrapper.initializeHeadlessCheckout(checkoutInstance.clientToken, checkoutInstance['getCheckoutOptions']({
1334
- style: options.styles,
1335
- }));
1411
+ await checkoutInstance.primerWrapper.initializeHeadlessCheckout(checkoutInstance.clientToken, checkoutInstance['getCheckoutOptions']({}));
1336
1412
  return checkoutInstance.primerWrapper.initMethod(method, element, {
1337
1413
  onMethodRender: checkoutInstance['handleMethodRender'],
1338
1414
  onMethodRenderError: checkoutInstance['handleMethodRenderError'],
@@ -1347,6 +1423,7 @@ const Billing = {
1347
1423
  createCheckout: createCheckout,
1348
1424
  createClientSession: createClientSession,
1349
1425
  initMethod: initMethod,
1426
+ silentPurchase: silentPurchase,
1350
1427
  };
1351
1428
  if (typeof window !== 'undefined') {
1352
1429
  window.Billing = Billing;