@clickaroo/checkout-ui 0.1.4-beta → 0.1.6-beta

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 (251) hide show
  1. package/dist/index.js +1 -1
  2. package/dist/index.mjs +1 -1
  3. package/package.json +2 -5
  4. package/dist/storybook/assets/APIs.en-BZprb8nz.js +0 -372
  5. package/dist/storybook/assets/CheckoutPage-_q0L2I48.js +0 -3
  6. package/dist/storybook/assets/CheckoutPage.en-Cqm7U6Ao.js +0 -147
  7. package/dist/storybook/assets/CheckoutPage.stories-Biq4hwU7.js +0 -44
  8. package/dist/storybook/assets/Color-YHDXOIA2-CTze9lKG.js +0 -1
  9. package/dist/storybook/assets/CustomCheckout.en-B1POrtIr.js +0 -211
  10. package/dist/storybook/assets/CustomCheckout.stories-D-tPjvHt.js +0 -6
  11. package/dist/storybook/assets/CustomerInfo-BABvZLYn.js +0 -1
  12. package/dist/storybook/assets/CustomerInfo.stories-QbQKWp1d.js +0 -9
  13. package/dist/storybook/assets/DeliveryAddress-DwuRB6NF.js +0 -2
  14. package/dist/storybook/assets/DeliveryAddress.stories-DZnkYsnJ.js +0 -9
  15. package/dist/storybook/assets/DocsRenderer-CFRXHY34-C1sXuUXn.js +0 -2
  16. package/dist/storybook/assets/Guide.en-m6hCgVJU.js +0 -107
  17. package/dist/storybook/assets/PaymentMethods-B6OrSp4J.js +0 -2
  18. package/dist/storybook/assets/PaymentMethods.stories-DNO6rqG3.js +0 -9
  19. package/dist/storybook/assets/QuickStart.en-Dra_JcyZ.js +0 -136
  20. package/dist/storybook/assets/ValidateInput-Bw6PO7kr.js +0 -2
  21. package/dist/storybook/assets/chunk-XP5HYGXS-BpfKkqn7.js +0 -1
  22. package/dist/storybook/assets/entry-preview-D5W1SR96.js +0 -2
  23. package/dist/storybook/assets/entry-preview-docs-CS87rPOt.js +0 -46
  24. package/dist/storybook/assets/iframe-BBMn-SiC.js +0 -211
  25. package/dist/storybook/assets/index-2r-d8gn2.js +0 -575
  26. package/dist/storybook/assets/index-B7ki2Uzk.js +0 -24
  27. package/dist/storybook/assets/index-CFngt2ij.css +0 -1
  28. package/dist/storybook/assets/index-ChEI-nsM.js +0 -1
  29. package/dist/storybook/assets/index-D-Mha1DF.js +0 -11
  30. package/dist/storybook/assets/index-DRjF_FHU.js +0 -9
  31. package/dist/storybook/assets/index-DqxVLU6x.js +0 -240
  32. package/dist/storybook/assets/index-DrFu-skq.js +0 -6
  33. package/dist/storybook/assets/jsx-runtime-DiklIkkE.js +0 -9
  34. package/dist/storybook/assets/preview-B8lJiyuQ.js +0 -34
  35. package/dist/storybook/assets/preview-BBWR9nbA.js +0 -1
  36. package/dist/storybook/assets/preview-BCWRKXw7.js +0 -2
  37. package/dist/storybook/assets/preview-BWzBA1C2.js +0 -396
  38. package/dist/storybook/assets/preview-CvbIS5ZJ.js +0 -1
  39. package/dist/storybook/assets/preview-DD_OYowb.js +0 -1
  40. package/dist/storybook/assets/preview-DGUiP6tS.js +0 -7
  41. package/dist/storybook/assets/preview-DHQbi4pV.js +0 -1
  42. package/dist/storybook/assets/preview-DHrw3ha3.js +0 -1
  43. package/dist/storybook/assets/preview-NEoZ8N1F.js +0 -1
  44. package/dist/storybook/assets/react-18-2zMCfgG4.js +0 -1
  45. package/dist/storybook/assets/test-utils-Cz8Y21vI.js +0 -9
  46. package/dist/storybook/assets/useCheckoutContext-C6NRdjfK.js +0 -27
  47. package/dist/storybook/favicon.svg +0 -1
  48. package/dist/storybook/iframe.html +0 -666
  49. package/dist/storybook/index.html +0 -177
  50. package/dist/storybook/index.json +0 -1
  51. package/dist/storybook/nunito-sans-bold-italic.woff2 +0 -0
  52. package/dist/storybook/nunito-sans-bold.woff2 +0 -0
  53. package/dist/storybook/nunito-sans-italic.woff2 +0 -0
  54. package/dist/storybook/nunito-sans-regular.woff2 +0 -0
  55. package/dist/storybook/project.json +0 -1
  56. package/dist/storybook/sb-addons/essentials-actions-2/manager-bundle.js +0 -3
  57. package/dist/storybook/sb-addons/essentials-backgrounds-4/manager-bundle.js +0 -12
  58. package/dist/storybook/sb-addons/essentials-controls-1/manager-bundle.js +0 -405
  59. package/dist/storybook/sb-addons/essentials-docs-3/manager-bundle.js +0 -245
  60. package/dist/storybook/sb-addons/essentials-measure-7/manager-bundle.js +0 -3
  61. package/dist/storybook/sb-addons/essentials-outline-8/manager-bundle.js +0 -3
  62. package/dist/storybook/sb-addons/essentials-toolbars-6/manager-bundle.js +0 -3
  63. package/dist/storybook/sb-addons/essentials-viewport-5/manager-bundle.js +0 -3
  64. package/dist/storybook/sb-addons/interactions-9/manager-bundle.js +0 -222
  65. package/dist/storybook/sb-addons/links-10/manager-bundle.js +0 -3
  66. package/dist/storybook/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js +0 -3
  67. package/dist/storybook/sb-common-assets/favicon.svg +0 -1
  68. package/dist/storybook/sb-common-assets/nunito-sans-bold-italic.woff2 +0 -0
  69. package/dist/storybook/sb-common-assets/nunito-sans-bold.woff2 +0 -0
  70. package/dist/storybook/sb-common-assets/nunito-sans-italic.woff2 +0 -0
  71. package/dist/storybook/sb-common-assets/nunito-sans-regular.woff2 +0 -0
  72. package/dist/storybook/sb-manager/globals-module-info.js +0 -1052
  73. package/dist/storybook/sb-manager/globals-runtime.js +0 -42127
  74. package/dist/storybook/sb-manager/globals.js +0 -48
  75. package/dist/storybook/sb-manager/runtime.js +0 -12048
  76. package/dist/storybook/storybook-static/assets/APIs.en-Bf5J1Ifk.js +0 -372
  77. package/dist/storybook/storybook-static/assets/APIs.en-CVdvOQs6.js +0 -372
  78. package/dist/storybook/storybook-static/assets/APIs.en-CW0wl9xW.js +0 -372
  79. package/dist/storybook/storybook-static/assets/APIs.en-Ci2xcqKC.js +0 -372
  80. package/dist/storybook/storybook-static/assets/APIs.en-DSVQkUt3.js +0 -372
  81. package/dist/storybook/storybook-static/assets/APIs.en-m6cq4XTv.js +0 -372
  82. package/dist/storybook/storybook-static/assets/CheckoutPage-B959BwZO.js +0 -3
  83. package/dist/storybook/storybook-static/assets/CheckoutPage-BsnzMxJk.js +0 -3
  84. package/dist/storybook/storybook-static/assets/CheckoutPage-C21Znq4d.js +0 -3
  85. package/dist/storybook/storybook-static/assets/CheckoutPage-CrHN6Fcv.js +0 -3
  86. package/dist/storybook/storybook-static/assets/CheckoutPage-DYMMhAMX.js +0 -3
  87. package/dist/storybook/storybook-static/assets/CheckoutPage-Dbzt3i55.js +0 -3
  88. package/dist/storybook/storybook-static/assets/CheckoutPage.en-BeknEgWZ.js +0 -147
  89. package/dist/storybook/storybook-static/assets/CheckoutPage.en-C5I1UUQc.js +0 -147
  90. package/dist/storybook/storybook-static/assets/CheckoutPage.en-C5WqMErV.js +0 -147
  91. package/dist/storybook/storybook-static/assets/CheckoutPage.en-DiHMI_iH.js +0 -147
  92. package/dist/storybook/storybook-static/assets/CheckoutPage.en-omEUF-3W.js +0 -147
  93. package/dist/storybook/storybook-static/assets/CheckoutPage.en-wyirg_zl.js +0 -147
  94. package/dist/storybook/storybook-static/assets/CheckoutPage.stories-BFpky7Cv.js +0 -44
  95. package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DAo0u2QI.js +0 -44
  96. package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DLD3oWo_.js +0 -44
  97. package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DeC6lyzr.js +0 -44
  98. package/dist/storybook/storybook-static/assets/CheckoutPage.stories-G0sHl94m.js +0 -44
  99. package/dist/storybook/storybook-static/assets/CheckoutPage.stories-qqNMphqC.js +0 -44
  100. package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-1Ar-cfOi.js +0 -1
  101. package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-B_hoSOu5.js +0 -1
  102. package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-Bly_OAJP.js +0 -1
  103. package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-CECFFm6s.js +0 -1
  104. package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-DI94E3AI.js +0 -1
  105. package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-DSQioqvs.js +0 -1
  106. package/dist/storybook/storybook-static/assets/CustomCheckout.en-2QJPlCmg.js +0 -211
  107. package/dist/storybook/storybook-static/assets/CustomCheckout.en-Bg4oz9hS.js +0 -211
  108. package/dist/storybook/storybook-static/assets/CustomCheckout.en-BrabumCC.js +0 -211
  109. package/dist/storybook/storybook-static/assets/CustomCheckout.en-CckpRGsp.js +0 -211
  110. package/dist/storybook/storybook-static/assets/CustomCheckout.en-D80ZpldF.js +0 -211
  111. package/dist/storybook/storybook-static/assets/CustomCheckout.en-adeOUUPd.js +0 -211
  112. package/dist/storybook/storybook-static/assets/CustomCheckout.stories-BdACubjk.js +0 -6
  113. package/dist/storybook/storybook-static/assets/CustomCheckout.stories-CKQKzMq0.js +0 -6
  114. package/dist/storybook/storybook-static/assets/CustomCheckout.stories-Cmt6r_Qb.js +0 -6
  115. package/dist/storybook/storybook-static/assets/CustomCheckout.stories-F2GZKkIG.js +0 -6
  116. package/dist/storybook/storybook-static/assets/CustomCheckout.stories-OyfGgjnr.js +0 -6
  117. package/dist/storybook/storybook-static/assets/CustomCheckout.stories-V2NHLbZo.js +0 -6
  118. package/dist/storybook/storybook-static/assets/CustomerInfo-CTx1dFS3.js +0 -1
  119. package/dist/storybook/storybook-static/assets/CustomerInfo-CYLNdAoo.js +0 -1
  120. package/dist/storybook/storybook-static/assets/CustomerInfo-CdeZHMcz.js +0 -1
  121. package/dist/storybook/storybook-static/assets/CustomerInfo-Cp0u57C5.js +0 -1
  122. package/dist/storybook/storybook-static/assets/CustomerInfo-D3WHpN32.js +0 -1
  123. package/dist/storybook/storybook-static/assets/CustomerInfo.stories-BBWobZ5V.js +0 -9
  124. package/dist/storybook/storybook-static/assets/CustomerInfo.stories-BeF8Yh1A.js +0 -9
  125. package/dist/storybook/storybook-static/assets/CustomerInfo.stories-CYx1hKNg.js +0 -9
  126. package/dist/storybook/storybook-static/assets/CustomerInfo.stories-DB2C3zqQ.js +0 -9
  127. package/dist/storybook/storybook-static/assets/CustomerInfo.stories-DJEbX7ej.js +0 -9
  128. package/dist/storybook/storybook-static/assets/DeliveryAddress-BBT_-q56.js +0 -2
  129. package/dist/storybook/storybook-static/assets/DeliveryAddress-CD42v0od.js +0 -2
  130. package/dist/storybook/storybook-static/assets/DeliveryAddress-Lfanl1PO.js +0 -2
  131. package/dist/storybook/storybook-static/assets/DeliveryAddress-X81XGbKD.js +0 -2
  132. package/dist/storybook/storybook-static/assets/DeliveryAddress-zAvEPauR.js +0 -2
  133. package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-B-CLgnl5.js +0 -9
  134. package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-BvAXTiNm.js +0 -9
  135. package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-CTyS3zFt.js +0 -9
  136. package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-DHyw5QNl.js +0 -9
  137. package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-ex4l-pod.js +0 -9
  138. package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-4VFo0TRH.js +0 -2
  139. package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-BIza5p8d.js +0 -2
  140. package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-BKek9MhZ.js +0 -2
  141. package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-Bb5akATV.js +0 -2
  142. package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-C9sW_L8N.js +0 -2
  143. package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-sE6BxCwu.js +0 -2
  144. package/dist/storybook/storybook-static/assets/Guide.en-BJ4qiYIc.js +0 -107
  145. package/dist/storybook/storybook-static/assets/Guide.en-C21zCMX7.js +0 -107
  146. package/dist/storybook/storybook-static/assets/Guide.en-CNP2Y7P4.js +0 -107
  147. package/dist/storybook/storybook-static/assets/Guide.en-CiR7CrYZ.js +0 -107
  148. package/dist/storybook/storybook-static/assets/Guide.en-DPJzC5RR.js +0 -107
  149. package/dist/storybook/storybook-static/assets/Guide.en-VxmWTbu0.js +0 -107
  150. package/dist/storybook/storybook-static/assets/PaymentMethods-B1IKDQ7d.js +0 -2
  151. package/dist/storybook/storybook-static/assets/PaymentMethods-BNEEARzu.js +0 -2
  152. package/dist/storybook/storybook-static/assets/PaymentMethods-BnPZRrAs.js +0 -2
  153. package/dist/storybook/storybook-static/assets/PaymentMethods-DOuQM2jZ.js +0 -2
  154. package/dist/storybook/storybook-static/assets/PaymentMethods-e9HqQtxN.js +0 -2
  155. package/dist/storybook/storybook-static/assets/PaymentMethods-ro6Dfmcf.js +0 -2
  156. package/dist/storybook/storybook-static/assets/PaymentMethods.stories-BSqcqZV0.js +0 -9
  157. package/dist/storybook/storybook-static/assets/PaymentMethods.stories-Bc4jYrum.js +0 -9
  158. package/dist/storybook/storybook-static/assets/PaymentMethods.stories-CELadurr.js +0 -9
  159. package/dist/storybook/storybook-static/assets/PaymentMethods.stories-ChiL9TJn.js +0 -9
  160. package/dist/storybook/storybook-static/assets/PaymentMethods.stories-oiT2EQiz.js +0 -9
  161. package/dist/storybook/storybook-static/assets/PaymentMethods.stories-pOuLDPwE.js +0 -9
  162. package/dist/storybook/storybook-static/assets/QuickStart.en-B2goyY4Q.js +0 -136
  163. package/dist/storybook/storybook-static/assets/QuickStart.en-Bj-7Slt2.js +0 -136
  164. package/dist/storybook/storybook-static/assets/QuickStart.en-C_8MTb_6.js +0 -136
  165. package/dist/storybook/storybook-static/assets/QuickStart.en-Ct2dMZNT.js +0 -136
  166. package/dist/storybook/storybook-static/assets/QuickStart.en-D6K1vnx2.js +0 -136
  167. package/dist/storybook/storybook-static/assets/QuickStart.en-DEcB3LF7.js +0 -136
  168. package/dist/storybook/storybook-static/assets/ValidateInput-C6pnsZFe.js +0 -2
  169. package/dist/storybook/storybook-static/assets/ValidateInput-C71ymd_w.js +0 -2
  170. package/dist/storybook/storybook-static/assets/ValidateInput-Cl2O4HCX.js +0 -2
  171. package/dist/storybook/storybook-static/assets/ValidateInput-DcnOO9py.js +0 -2
  172. package/dist/storybook/storybook-static/assets/ValidateInput-sZgX3GCF.js +0 -2
  173. package/dist/storybook/storybook-static/assets/chunk-XP5HYGXS-BpfKkqn7.js +0 -1
  174. package/dist/storybook/storybook-static/assets/entry-preview-BM0J-x_7.js +0 -2
  175. package/dist/storybook/storybook-static/assets/entry-preview-Bnn64O7J.js +0 -2
  176. package/dist/storybook/storybook-static/assets/entry-preview-Dbi49YCK.js +0 -2
  177. package/dist/storybook/storybook-static/assets/entry-preview-DuGj42Nq.js +0 -2
  178. package/dist/storybook/storybook-static/assets/entry-preview-DxIUzVUA.js +0 -2
  179. package/dist/storybook/storybook-static/assets/entry-preview-docs-CS87rPOt.js +0 -46
  180. package/dist/storybook/storybook-static/assets/entry-preview-hHv11-z5.js +0 -2
  181. package/dist/storybook/storybook-static/assets/iframe-BZKEX9PA.js +0 -211
  182. package/dist/storybook/storybook-static/assets/iframe-CEK4S1D5.js +0 -211
  183. package/dist/storybook/storybook-static/assets/iframe-Ce3kgeV4.js +0 -211
  184. package/dist/storybook/storybook-static/assets/iframe-Ckasx_Sg.js +0 -211
  185. package/dist/storybook/storybook-static/assets/iframe-DsSsblW_.js +0 -211
  186. package/dist/storybook/storybook-static/assets/iframe-PThBYPHV.js +0 -211
  187. package/dist/storybook/storybook-static/assets/index-B7ki2Uzk.js +0 -24
  188. package/dist/storybook/storybook-static/assets/index-CFngt2ij.css +0 -1
  189. package/dist/storybook/storybook-static/assets/index-CZFGp9Su.js +0 -575
  190. package/dist/storybook/storybook-static/assets/index-ChEI-nsM.js +0 -1
  191. package/dist/storybook/storybook-static/assets/index-CkNSuRJg.js +0 -575
  192. package/dist/storybook/storybook-static/assets/index-Cx4362C8.js +0 -575
  193. package/dist/storybook/storybook-static/assets/index-Cyd9I05m.js +0 -575
  194. package/dist/storybook/storybook-static/assets/index-D-Mha1DF.js +0 -11
  195. package/dist/storybook/storybook-static/assets/index-DRjF_FHU.js +0 -9
  196. package/dist/storybook/storybook-static/assets/index-DqxVLU6x.js +0 -240
  197. package/dist/storybook/storybook-static/assets/index-DrFu-skq.js +0 -6
  198. package/dist/storybook/storybook-static/assets/index-LRKEu_dQ.js +0 -575
  199. package/dist/storybook/storybook-static/assets/index-j2F2pkp4.js +0 -575
  200. package/dist/storybook/storybook-static/assets/jsx-runtime-DiklIkkE.js +0 -9
  201. package/dist/storybook/storybook-static/assets/preview-4XW-YDzX.js +0 -2
  202. package/dist/storybook/storybook-static/assets/preview-884UjfA3.js +0 -2
  203. package/dist/storybook/storybook-static/assets/preview-B8lJiyuQ.js +0 -34
  204. package/dist/storybook/storybook-static/assets/preview-BBWR9nbA.js +0 -1
  205. package/dist/storybook/storybook-static/assets/preview-BWzBA1C2.js +0 -396
  206. package/dist/storybook/storybook-static/assets/preview-CvbIS5ZJ.js +0 -1
  207. package/dist/storybook/storybook-static/assets/preview-D2t1J3cT.js +0 -2
  208. package/dist/storybook/storybook-static/assets/preview-DD_OYowb.js +0 -1
  209. package/dist/storybook/storybook-static/assets/preview-DGUiP6tS.js +0 -7
  210. package/dist/storybook/storybook-static/assets/preview-DHQbi4pV.js +0 -1
  211. package/dist/storybook/storybook-static/assets/preview-DHrw3ha3.js +0 -1
  212. package/dist/storybook/storybook-static/assets/preview-DNROAajq.js +0 -2
  213. package/dist/storybook/storybook-static/assets/preview-EmPtksy2.js +0 -2
  214. package/dist/storybook/storybook-static/assets/preview-NEoZ8N1F.js +0 -1
  215. package/dist/storybook/storybook-static/assets/preview-PsKPgAxG.js +0 -2
  216. package/dist/storybook/storybook-static/assets/react-18-2zMCfgG4.js +0 -1
  217. package/dist/storybook/storybook-static/assets/test-utils-Cz8Y21vI.js +0 -9
  218. package/dist/storybook/storybook-static/assets/useCheckoutContext-B8tsk5b5.js +0 -27
  219. package/dist/storybook/storybook-static/assets/useCheckoutContext-C6u4Rp5U.js +0 -27
  220. package/dist/storybook/storybook-static/assets/useCheckoutContext-Cyg-MLQs.js +0 -27
  221. package/dist/storybook/storybook-static/assets/useCheckoutContext-DuJ1Ep0-.js +0 -27
  222. package/dist/storybook/storybook-static/assets/useCheckoutContext-w0N5TNgR.js +0 -27
  223. package/dist/storybook/storybook-static/favicon.svg +0 -1
  224. package/dist/storybook/storybook-static/iframe.html +0 -666
  225. package/dist/storybook/storybook-static/index.html +0 -177
  226. package/dist/storybook/storybook-static/index.json +0 -1
  227. package/dist/storybook/storybook-static/nunito-sans-bold-italic.woff2 +0 -0
  228. package/dist/storybook/storybook-static/nunito-sans-bold.woff2 +0 -0
  229. package/dist/storybook/storybook-static/nunito-sans-italic.woff2 +0 -0
  230. package/dist/storybook/storybook-static/nunito-sans-regular.woff2 +0 -0
  231. package/dist/storybook/storybook-static/project.json +0 -1
  232. package/dist/storybook/storybook-static/sb-addons/essentials-actions-2/manager-bundle.js +0 -3
  233. package/dist/storybook/storybook-static/sb-addons/essentials-backgrounds-4/manager-bundle.js +0 -12
  234. package/dist/storybook/storybook-static/sb-addons/essentials-controls-1/manager-bundle.js +0 -405
  235. package/dist/storybook/storybook-static/sb-addons/essentials-docs-3/manager-bundle.js +0 -245
  236. package/dist/storybook/storybook-static/sb-addons/essentials-measure-7/manager-bundle.js +0 -3
  237. package/dist/storybook/storybook-static/sb-addons/essentials-outline-8/manager-bundle.js +0 -3
  238. package/dist/storybook/storybook-static/sb-addons/essentials-toolbars-6/manager-bundle.js +0 -3
  239. package/dist/storybook/storybook-static/sb-addons/essentials-viewport-5/manager-bundle.js +0 -3
  240. package/dist/storybook/storybook-static/sb-addons/interactions-9/manager-bundle.js +0 -222
  241. package/dist/storybook/storybook-static/sb-addons/links-10/manager-bundle.js +0 -3
  242. package/dist/storybook/storybook-static/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js +0 -3
  243. package/dist/storybook/storybook-static/sb-common-assets/favicon.svg +0 -1
  244. package/dist/storybook/storybook-static/sb-common-assets/nunito-sans-bold-italic.woff2 +0 -0
  245. package/dist/storybook/storybook-static/sb-common-assets/nunito-sans-bold.woff2 +0 -0
  246. package/dist/storybook/storybook-static/sb-common-assets/nunito-sans-italic.woff2 +0 -0
  247. package/dist/storybook/storybook-static/sb-common-assets/nunito-sans-regular.woff2 +0 -0
  248. package/dist/storybook/storybook-static/sb-manager/globals-module-info.js +0 -1052
  249. package/dist/storybook/storybook-static/sb-manager/globals-runtime.js +0 -42127
  250. package/dist/storybook/storybook-static/sb-manager/globals.js +0 -48
  251. package/dist/storybook/storybook-static/sb-manager/runtime.js +0 -12048
@@ -1 +0,0 @@
1
- import{d as ce,v as M,G as Z,g as he,c as fe,Z as de,e as ge,_ as be,f as q}from"./index-2r-d8gn2.js";import{r as p,R as m}from"./index-DRjF_FHU.js";import"./iframe-BBMn-SiC.js";import"./jsx-runtime-DiklIkkE.js";import"./index-B7ki2Uzk.js";import"./index-D-Mha1DF.js";import"./index-DrFu-skq.js";var me=q({"../../node_modules/color-name/index.js"(n,o){o.exports={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]}}}),J=q({"../../node_modules/color-convert/conversions.js"(n,o){var c=me(),h={};for(let e of Object.keys(c))h[c[e]]=e;var i={rgb:{channels:3,labels:"rgb"},hsl:{channels:3,labels:"hsl"},hsv:{channels:3,labels:"hsv"},hwb:{channels:3,labels:"hwb"},cmyk:{channels:4,labels:"cmyk"},xyz:{channels:3,labels:"xyz"},lab:{channels:3,labels:"lab"},lch:{channels:3,labels:"lch"},hex:{channels:1,labels:["hex"]},keyword:{channels:1,labels:["keyword"]},ansi16:{channels:1,labels:["ansi16"]},ansi256:{channels:1,labels:["ansi256"]},hcg:{channels:3,labels:["h","c","g"]},apple:{channels:3,labels:["r16","g16","b16"]},gray:{channels:1,labels:["gray"]}};o.exports=i;for(let e of Object.keys(i)){if(!("channels"in i[e]))throw new Error("missing channels property: "+e);if(!("labels"in i[e]))throw new Error("missing channel labels property: "+e);if(i[e].labels.length!==i[e].channels)throw new Error("channel and label counts mismatch: "+e);let{channels:t,labels:r}=i[e];delete i[e].channels,delete i[e].labels,Object.defineProperty(i[e],"channels",{value:t}),Object.defineProperty(i[e],"labels",{value:r})}i.rgb.hsl=function(e){let t=e[0]/255,r=e[1]/255,a=e[2]/255,l=Math.min(t,r,a),u=Math.max(t,r,a),s=u-l,f,g;u===l?f=0:t===u?f=(r-a)/s:r===u?f=2+(a-t)/s:a===u&&(f=4+(t-r)/s),f=Math.min(f*60,360),f<0&&(f+=360);let b=(l+u)/2;return u===l?g=0:b<=.5?g=s/(u+l):g=s/(2-u-l),[f,g*100,b*100]},i.rgb.hsv=function(e){let t,r,a,l,u,s=e[0]/255,f=e[1]/255,g=e[2]/255,b=Math.max(s,f,g),y=b-Math.min(s,f,g),v=function(w){return(b-w)/6/y+1/2};return y===0?(l=0,u=0):(u=y/b,t=v(s),r=v(f),a=v(g),s===b?l=a-r:f===b?l=1/3+t-a:g===b&&(l=2/3+r-t),l<0?l+=1:l>1&&(l-=1)),[l*360,u*100,b*100]},i.rgb.hwb=function(e){let t=e[0],r=e[1],a=e[2],l=i.rgb.hsl(e)[0],u=1/255*Math.min(t,Math.min(r,a));return a=1-1/255*Math.max(t,Math.max(r,a)),[l,u*100,a*100]},i.rgb.cmyk=function(e){let t=e[0]/255,r=e[1]/255,a=e[2]/255,l=Math.min(1-t,1-r,1-a),u=(1-t-l)/(1-l)||0,s=(1-r-l)/(1-l)||0,f=(1-a-l)/(1-l)||0;return[u*100,s*100,f*100,l*100]};function d(e,t){return(e[0]-t[0])**2+(e[1]-t[1])**2+(e[2]-t[2])**2}i.rgb.keyword=function(e){let t=h[e];if(t)return t;let r=1/0,a;for(let l of Object.keys(c)){let u=c[l],s=d(e,u);s<r&&(r=s,a=l)}return a},i.keyword.rgb=function(e){return c[e]},i.rgb.xyz=function(e){let t=e[0]/255,r=e[1]/255,a=e[2]/255;t=t>.04045?((t+.055)/1.055)**2.4:t/12.92,r=r>.04045?((r+.055)/1.055)**2.4:r/12.92,a=a>.04045?((a+.055)/1.055)**2.4:a/12.92;let l=t*.4124+r*.3576+a*.1805,u=t*.2126+r*.7152+a*.0722,s=t*.0193+r*.1192+a*.9505;return[l*100,u*100,s*100]},i.rgb.lab=function(e){let t=i.rgb.xyz(e),r=t[0],a=t[1],l=t[2];r/=95.047,a/=100,l/=108.883,r=r>.008856?r**(1/3):7.787*r+16/116,a=a>.008856?a**(1/3):7.787*a+16/116,l=l>.008856?l**(1/3):7.787*l+16/116;let u=116*a-16,s=500*(r-a),f=200*(a-l);return[u,s,f]},i.hsl.rgb=function(e){let t=e[0]/360,r=e[1]/100,a=e[2]/100,l,u,s;if(r===0)return s=a*255,[s,s,s];a<.5?l=a*(1+r):l=a+r-a*r;let f=2*a-l,g=[0,0,0];for(let b=0;b<3;b++)u=t+1/3*-(b-1),u<0&&u++,u>1&&u--,6*u<1?s=f+(l-f)*6*u:2*u<1?s=l:3*u<2?s=f+(l-f)*(2/3-u)*6:s=f,g[b]=s*255;return g},i.hsl.hsv=function(e){let t=e[0],r=e[1]/100,a=e[2]/100,l=r,u=Math.max(a,.01);a*=2,r*=a<=1?a:2-a,l*=u<=1?u:2-u;let s=(a+r)/2,f=a===0?2*l/(u+l):2*r/(a+r);return[t,f*100,s*100]},i.hsv.rgb=function(e){let t=e[0]/60,r=e[1]/100,a=e[2]/100,l=Math.floor(t)%6,u=t-Math.floor(t),s=255*a*(1-r),f=255*a*(1-r*u),g=255*a*(1-r*(1-u));switch(a*=255,l){case 0:return[a,g,s];case 1:return[f,a,s];case 2:return[s,a,g];case 3:return[s,f,a];case 4:return[g,s,a];case 5:return[a,s,f]}},i.hsv.hsl=function(e){let t=e[0],r=e[1]/100,a=e[2]/100,l=Math.max(a,.01),u,s;s=(2-r)*a;let f=(2-r)*l;return u=r*l,u/=f<=1?f:2-f,u=u||0,s/=2,[t,u*100,s*100]},i.hwb.rgb=function(e){let t=e[0]/360,r=e[1]/100,a=e[2]/100,l=r+a,u;l>1&&(r/=l,a/=l);let s=Math.floor(6*t),f=1-a;u=6*t-s,s&1&&(u=1-u);let g=r+u*(f-r),b,y,v;switch(s){default:case 6:case 0:b=f,y=g,v=r;break;case 1:b=g,y=f,v=r;break;case 2:b=r,y=f,v=g;break;case 3:b=r,y=g,v=f;break;case 4:b=g,y=r,v=f;break;case 5:b=f,y=r,v=g;break}return[b*255,y*255,v*255]},i.cmyk.rgb=function(e){let t=e[0]/100,r=e[1]/100,a=e[2]/100,l=e[3]/100,u=1-Math.min(1,t*(1-l)+l),s=1-Math.min(1,r*(1-l)+l),f=1-Math.min(1,a*(1-l)+l);return[u*255,s*255,f*255]},i.xyz.rgb=function(e){let t=e[0]/100,r=e[1]/100,a=e[2]/100,l,u,s;return l=t*3.2406+r*-1.5372+a*-.4986,u=t*-.9689+r*1.8758+a*.0415,s=t*.0557+r*-.204+a*1.057,l=l>.0031308?1.055*l**(1/2.4)-.055:l*12.92,u=u>.0031308?1.055*u**(1/2.4)-.055:u*12.92,s=s>.0031308?1.055*s**(1/2.4)-.055:s*12.92,l=Math.min(Math.max(0,l),1),u=Math.min(Math.max(0,u),1),s=Math.min(Math.max(0,s),1),[l*255,u*255,s*255]},i.xyz.lab=function(e){let t=e[0],r=e[1],a=e[2];t/=95.047,r/=100,a/=108.883,t=t>.008856?t**(1/3):7.787*t+16/116,r=r>.008856?r**(1/3):7.787*r+16/116,a=a>.008856?a**(1/3):7.787*a+16/116;let l=116*r-16,u=500*(t-r),s=200*(r-a);return[l,u,s]},i.lab.xyz=function(e){let t=e[0],r=e[1],a=e[2],l,u,s;u=(t+16)/116,l=r/500+u,s=u-a/200;let f=u**3,g=l**3,b=s**3;return u=f>.008856?f:(u-16/116)/7.787,l=g>.008856?g:(l-16/116)/7.787,s=b>.008856?b:(s-16/116)/7.787,l*=95.047,u*=100,s*=108.883,[l,u,s]},i.lab.lch=function(e){let t=e[0],r=e[1],a=e[2],l;l=Math.atan2(a,r)*360/2/Math.PI,l<0&&(l+=360);let u=Math.sqrt(r*r+a*a);return[t,u,l]},i.lch.lab=function(e){let t=e[0],r=e[1],a=e[2]/360*2*Math.PI,l=r*Math.cos(a),u=r*Math.sin(a);return[t,l,u]},i.rgb.ansi16=function(e,t=null){let[r,a,l]=e,u=t===null?i.rgb.hsv(e)[2]:t;if(u=Math.round(u/50),u===0)return 30;let s=30+(Math.round(l/255)<<2|Math.round(a/255)<<1|Math.round(r/255));return u===2&&(s+=60),s},i.hsv.ansi16=function(e){return i.rgb.ansi16(i.hsv.rgb(e),e[2])},i.rgb.ansi256=function(e){let t=e[0],r=e[1],a=e[2];return t===r&&r===a?t<8?16:t>248?231:Math.round((t-8)/247*24)+232:16+36*Math.round(t/255*5)+6*Math.round(r/255*5)+Math.round(a/255*5)},i.ansi16.rgb=function(e){let t=e%10;if(t===0||t===7)return e>50&&(t+=3.5),t=t/10.5*255,[t,t,t];let r=(~~(e>50)+1)*.5,a=(t&1)*r*255,l=(t>>1&1)*r*255,u=(t>>2&1)*r*255;return[a,l,u]},i.ansi256.rgb=function(e){if(e>=232){let u=(e-232)*10+8;return[u,u,u]}e-=16;let t,r=Math.floor(e/36)/5*255,a=Math.floor((t=e%36)/6)/5*255,l=t%6/5*255;return[r,a,l]},i.rgb.hex=function(e){let t=(((Math.round(e[0])&255)<<16)+((Math.round(e[1])&255)<<8)+(Math.round(e[2])&255)).toString(16).toUpperCase();return"000000".substring(t.length)+t},i.hex.rgb=function(e){let t=e.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);if(!t)return[0,0,0];let r=t[0];t[0].length===3&&(r=r.split("").map(f=>f+f).join(""));let a=parseInt(r,16),l=a>>16&255,u=a>>8&255,s=a&255;return[l,u,s]},i.rgb.hcg=function(e){let t=e[0]/255,r=e[1]/255,a=e[2]/255,l=Math.max(Math.max(t,r),a),u=Math.min(Math.min(t,r),a),s=l-u,f,g;return s<1?f=u/(1-s):f=0,s<=0?g=0:l===t?g=(r-a)/s%6:l===r?g=2+(a-t)/s:g=4+(t-r)/s,g/=6,g%=1,[g*360,s*100,f*100]},i.hsl.hcg=function(e){let t=e[1]/100,r=e[2]/100,a=r<.5?2*t*r:2*t*(1-r),l=0;return a<1&&(l=(r-.5*a)/(1-a)),[e[0],a*100,l*100]},i.hsv.hcg=function(e){let t=e[1]/100,r=e[2]/100,a=t*r,l=0;return a<1&&(l=(r-a)/(1-a)),[e[0],a*100,l*100]},i.hcg.rgb=function(e){let t=e[0]/360,r=e[1]/100,a=e[2]/100;if(r===0)return[a*255,a*255,a*255];let l=[0,0,0],u=t%1*6,s=u%1,f=1-s,g=0;switch(Math.floor(u)){case 0:l[0]=1,l[1]=s,l[2]=0;break;case 1:l[0]=f,l[1]=1,l[2]=0;break;case 2:l[0]=0,l[1]=1,l[2]=s;break;case 3:l[0]=0,l[1]=f,l[2]=1;break;case 4:l[0]=s,l[1]=0,l[2]=1;break;default:l[0]=1,l[1]=0,l[2]=f}return g=(1-r)*a,[(r*l[0]+g)*255,(r*l[1]+g)*255,(r*l[2]+g)*255]},i.hcg.hsv=function(e){let t=e[1]/100,r=e[2]/100,a=t+r*(1-t),l=0;return a>0&&(l=t/a),[e[0],l*100,a*100]},i.hcg.hsl=function(e){let t=e[1]/100,r=e[2]/100*(1-t)+.5*t,a=0;return r>0&&r<.5?a=t/(2*r):r>=.5&&r<1&&(a=t/(2*(1-r))),[e[0],a*100,r*100]},i.hcg.hwb=function(e){let t=e[1]/100,r=e[2]/100,a=t+r*(1-t);return[e[0],(a-t)*100,(1-a)*100]},i.hwb.hcg=function(e){let t=e[1]/100,r=1-e[2]/100,a=r-t,l=0;return a<1&&(l=(r-a)/(1-a)),[e[0],a*100,l*100]},i.apple.rgb=function(e){return[e[0]/65535*255,e[1]/65535*255,e[2]/65535*255]},i.rgb.apple=function(e){return[e[0]/255*65535,e[1]/255*65535,e[2]/255*65535]},i.gray.rgb=function(e){return[e[0]/100*255,e[0]/100*255,e[0]/100*255]},i.gray.hsl=function(e){return[0,0,e[0]]},i.gray.hsv=i.gray.hsl,i.gray.hwb=function(e){return[0,100,e[0]]},i.gray.cmyk=function(e){return[0,0,0,e[0]]},i.gray.lab=function(e){return[e[0],0,0]},i.gray.hex=function(e){let t=Math.round(e[0]/100*255)&255,r=((t<<16)+(t<<8)+t).toString(16).toUpperCase();return"000000".substring(r.length)+r},i.rgb.gray=function(e){return[(e[0]+e[1]+e[2])/3/255*100]}}}),ve=q({"../../node_modules/color-convert/route.js"(n,o){var c=J();function h(){let t={},r=Object.keys(c);for(let a=r.length,l=0;l<a;l++)t[r[l]]={distance:-1,parent:null};return t}function i(t){let r=h(),a=[t];for(r[t].distance=0;a.length;){let l=a.pop(),u=Object.keys(c[l]);for(let s=u.length,f=0;f<s;f++){let g=u[f],b=r[g];b.distance===-1&&(b.distance=r[l].distance+1,b.parent=l,a.unshift(g))}}return r}function d(t,r){return function(a){return r(t(a))}}function e(t,r){let a=[r[t].parent,t],l=c[r[t].parent][t],u=r[t].parent;for(;r[u].parent;)a.unshift(r[u].parent),l=d(c[r[u].parent][u],l),u=r[u].parent;return l.conversion=a,l}o.exports=function(t){let r=i(t),a={},l=Object.keys(r);for(let u=l.length,s=0;s<u;s++){let f=l[s];r[f].parent!==null&&(a[f]=e(f,r))}return a}}}),pe=q({"../../node_modules/color-convert/index.js"(n,o){var c=J(),h=ve(),i={},d=Object.keys(c);function e(r){let a=function(...l){let u=l[0];return u==null?u:(u.length>1&&(l=u),r(l))};return"conversion"in r&&(a.conversion=r.conversion),a}function t(r){let a=function(...l){let u=l[0];if(u==null)return u;u.length>1&&(l=u);let s=r(l);if(typeof s=="object")for(let f=s.length,g=0;g<f;g++)s[g]=Math.round(s[g]);return s};return"conversion"in r&&(a.conversion=r.conversion),a}d.forEach(r=>{i[r]={},Object.defineProperty(i[r],"channels",{value:c[r].channels}),Object.defineProperty(i[r],"labels",{value:c[r].labels});let a=h(r);Object.keys(a).forEach(l=>{let u=a[l];i[r][l]=t(u),i[r][l].raw=e(u)})}),o.exports=i}}),_=be(pe());function C(){return(C=Object.assign||function(n){for(var o=1;o<arguments.length;o++){var c=arguments[o];for(var h in c)Object.prototype.hasOwnProperty.call(c,h)&&(n[h]=c[h])}return n}).apply(this,arguments)}function D(n,o){if(n==null)return{};var c,h,i={},d=Object.keys(n);for(h=0;h<d.length;h++)o.indexOf(c=d[h])>=0||(i[c]=n[c]);return i}function L(n){var o=p.useRef(n),c=p.useRef(function(h){o.current&&o.current(h)});return o.current=n,c.current}var O=function(n,o,c){return o===void 0&&(o=0),c===void 0&&(c=1),n>c?c:n<o?o:n},S=function(n){return"touches"in n},B=function(n){return n&&n.ownerDocument.defaultView||self},T=function(n,o,c){var h=n.getBoundingClientRect(),i=S(o)?function(d,e){for(var t=0;t<d.length;t++)if(d[t].identifier===e)return d[t];return d[0]}(o.touches,c):o;return{left:O((i.pageX-(h.left+B(n).pageXOffset))/h.width),top:O((i.pageY-(h.top+B(n).pageYOffset))/h.height)}},W=function(n){!S(n)&&n.preventDefault()},V=m.memo(function(n){var o=n.onMove,c=n.onKey,h=D(n,["onMove","onKey"]),i=p.useRef(null),d=L(o),e=L(c),t=p.useRef(null),r=p.useRef(!1),a=p.useMemo(function(){var f=function(y){W(y),(S(y)?y.touches.length>0:y.buttons>0)&&i.current?d(T(i.current,y,t.current)):b(!1)},g=function(){return b(!1)};function b(y){var v=r.current,w=B(i.current),E=y?w.addEventListener:w.removeEventListener;E(v?"touchmove":"mousemove",f),E(v?"touchend":"mouseup",g)}return[function(y){var v=y.nativeEvent,w=i.current;if(w&&(W(v),!function(k,P){return P&&!S(k)}(v,r.current)&&w)){if(S(v)){r.current=!0;var E=v.changedTouches||[];E.length&&(t.current=E[0].identifier)}w.focus(),d(T(w,v,t.current)),b(!0)}},function(y){var v=y.which||y.keyCode;v<37||v>40||(y.preventDefault(),e({left:v===39?.05:v===37?-.05:0,top:v===40?.05:v===38?-.05:0}))},b]},[e,d]),l=a[0],u=a[1],s=a[2];return p.useEffect(function(){return s},[s]),m.createElement("div",C({},h,{onTouchStart:l,onMouseDown:l,className:"react-colorful__interactive",ref:i,onKeyDown:u,tabIndex:0,role:"slider"}))}),N=function(n){return n.filter(Boolean).join(" ")},F=function(n){var o=n.color,c=n.left,h=n.top,i=h===void 0?.5:h,d=N(["react-colorful__pointer",n.className]);return m.createElement("div",{className:d,style:{top:100*i+"%",left:100*c+"%"}},m.createElement("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:o}}))},x=function(n,o,c){return o===void 0&&(o=0),c===void 0&&(c=Math.pow(10,o)),Math.round(c*n)/c},ye={grad:.9,turn:360,rad:360/(2*Math.PI)},xe=function(n){return re(X(n))},X=function(n){return n[0]==="#"&&(n=n.substring(1)),n.length<6?{r:parseInt(n[0]+n[0],16),g:parseInt(n[1]+n[1],16),b:parseInt(n[2]+n[2],16),a:n.length===4?x(parseInt(n[3]+n[3],16)/255,2):1}:{r:parseInt(n.substring(0,2),16),g:parseInt(n.substring(2,4),16),b:parseInt(n.substring(4,6),16),a:n.length===8?x(parseInt(n.substring(6,8),16)/255,2):1}},we=function(n,o){return o===void 0&&(o="deg"),Number(n)*(ye[o]||1)},ke=function(n){var o=/hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(n);return o?_e({h:we(o[1],o[2]),s:Number(o[3]),l:Number(o[4]),a:o[5]===void 0?1:Number(o[5])/(o[6]?100:1)}):{h:0,s:0,v:0,a:1}},_e=function(n){var o=n.s,c=n.l;return{h:n.h,s:(o*=(c<50?c:100-c)/100)>0?2*o/(c+o)*100:0,v:c+o,a:n.a}},Ee=function(n){return Ce(ee(n))},Q=function(n){var o=n.s,c=n.v,h=n.a,i=(200-o)*c/100;return{h:x(n.h),s:x(i>0&&i<200?o*c/100/(i<=100?i:200-i)*100:0),l:x(i/2),a:x(h,2)}},G=function(n){var o=Q(n);return"hsl("+o.h+", "+o.s+"%, "+o.l+"%)"},H=function(n){var o=Q(n);return"hsla("+o.h+", "+o.s+"%, "+o.l+"%, "+o.a+")"},ee=function(n){var o=n.h,c=n.s,h=n.v,i=n.a;o=o/360*6,c/=100,h/=100;var d=Math.floor(o),e=h*(1-c),t=h*(1-(o-d)*c),r=h*(1-(1-o+d)*c),a=d%6;return{r:x(255*[h,t,e,e,r,h][a]),g:x(255*[r,h,h,t,e,e][a]),b:x(255*[e,e,r,h,h,t][a]),a:x(i,2)}},Me=function(n){var o=/rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(n);return o?re({r:Number(o[1])/(o[2]?100/255:1),g:Number(o[3])/(o[4]?100/255:1),b:Number(o[5])/(o[6]?100/255:1),a:o[7]===void 0?1:Number(o[7])/(o[8]?100:1)}):{h:0,s:0,v:0,a:1}},j=function(n){var o=n.toString(16);return o.length<2?"0"+o:o},Ce=function(n){var o=n.r,c=n.g,h=n.b,i=n.a,d=i<1?j(x(255*i)):"";return"#"+j(o)+j(c)+j(h)+d},re=function(n){var o=n.r,c=n.g,h=n.b,i=n.a,d=Math.max(o,c,h),e=d-Math.min(o,c,h),t=e?d===o?(c-h)/e:d===c?2+(h-o)/e:4+(o-c)/e:0;return{h:x(60*(t<0?t+6:t)),s:x(d?e/d*100:0),v:x(d/255*100),a:i}},te=m.memo(function(n){var o=n.hue,c=n.onChange,h=N(["react-colorful__hue",n.className]);return m.createElement("div",{className:h},m.createElement(V,{onMove:function(i){c({h:360*i.left})},onKey:function(i){c({h:O(o+360*i.left,0,360)})},"aria-label":"Hue","aria-valuenow":x(o),"aria-valuemax":"360","aria-valuemin":"0"},m.createElement(F,{className:"react-colorful__hue-pointer",left:o/360,color:G({h:o,s:100,v:100,a:1})})))}),ne=m.memo(function(n){var o=n.hsva,c=n.onChange,h={backgroundColor:G({h:o.h,s:100,v:100,a:1})};return m.createElement("div",{className:"react-colorful__saturation",style:h},m.createElement(V,{onMove:function(i){c({s:100*i.left,v:100-100*i.top})},onKey:function(i){c({s:O(o.s+100*i.left,0,100),v:O(o.v-100*i.top,0,100)})},"aria-label":"Color","aria-valuetext":"Saturation "+x(o.s)+"%, Brightness "+x(o.v)+"%"},m.createElement(F,{className:"react-colorful__saturation-pointer",top:1-o.v/100,left:o.s/100,color:G(o)})))}),ae=function(n,o){if(n===o)return!0;for(var c in n)if(n[c]!==o[c])return!1;return!0},le=function(n,o){return n.replace(/\s/g,"")===o.replace(/\s/g,"")},$e=function(n,o){return n.toLowerCase()===o.toLowerCase()||ae(X(n),X(o))};function oe(n,o,c){var h=L(c),i=p.useState(function(){return n.toHsva(o)}),d=i[0],e=i[1],t=p.useRef({color:o,hsva:d});p.useEffect(function(){if(!n.equal(o,t.current.color)){var a=n.toHsva(o);t.current={hsva:a,color:o},e(a)}},[o,n]),p.useEffect(function(){var a;ae(d,t.current.hsva)||n.equal(a=n.fromHsva(d),t.current.color)||(t.current={hsva:d,color:a},h(a))},[d,n,h]);var r=p.useCallback(function(a){e(function(l){return Object.assign({},l,a)})},[]);return[d,r]}var Oe=typeof window<"u"?p.useLayoutEffect:p.useEffect,Se=function(){return typeof __webpack_nonce__<"u"?__webpack_nonce__:void 0},A=new Map,ue=function(n){Oe(function(){var o=n.current?n.current.ownerDocument:document;if(o!==void 0&&!A.has(o)){var c=o.createElement("style");c.innerHTML=`.react-colorful{position:relative;display:flex;flex-direction:column;width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}`,A.set(o,c);var h=Se();h&&c.setAttribute("nonce",h),o.head.appendChild(c)}},[])},Ne=function(n){var o=n.className,c=n.colorModel,h=n.color,i=h===void 0?c.defaultColor:h,d=n.onChange,e=D(n,["className","colorModel","color","onChange"]),t=p.useRef(null);ue(t);var r=oe(c,i,d),a=r[0],l=r[1],u=N(["react-colorful",o]);return m.createElement("div",C({},e,{ref:t,className:u}),m.createElement(ne,{hsva:a,onChange:l}),m.createElement(te,{hue:a.h,onChange:l,className:"react-colorful__last-control"}))},je={defaultColor:"000",toHsva:xe,fromHsva:function(n){return Ee({h:n.h,s:n.s,v:n.v,a:1})},equal:$e},Re=function(n){return m.createElement(Ne,C({},n,{colorModel:je}))},ze=function(n){var o=n.className,c=n.hsva,h=n.onChange,i={backgroundImage:"linear-gradient(90deg, "+H(Object.assign({},c,{a:0}))+", "+H(Object.assign({},c,{a:1}))+")"},d=N(["react-colorful__alpha",o]),e=x(100*c.a);return m.createElement("div",{className:d},m.createElement("div",{className:"react-colorful__alpha-gradient",style:i}),m.createElement(V,{onMove:function(t){h({a:t.left})},onKey:function(t){h({a:O(c.a+t.left)})},"aria-label":"Alpha","aria-valuetext":e+"%","aria-valuenow":e,"aria-valuemin":"0","aria-valuemax":"100"},m.createElement(F,{className:"react-colorful__alpha-pointer",left:c.a,color:H(c)})))},ie=function(n){var o=n.className,c=n.colorModel,h=n.color,i=h===void 0?c.defaultColor:h,d=n.onChange,e=D(n,["className","colorModel","color","onChange"]),t=p.useRef(null);ue(t);var r=oe(c,i,d),a=r[0],l=r[1],u=N(["react-colorful",o]);return m.createElement("div",C({},e,{ref:t,className:u}),m.createElement(ne,{hsva:a,onChange:l}),m.createElement(te,{hue:a.h,onChange:l}),m.createElement(ze,{hsva:a,onChange:l,className:"react-colorful__last-control"}))},He={defaultColor:"hsla(0, 0%, 0%, 1)",toHsva:ke,fromHsva:H,equal:le},Ie=function(n){return m.createElement(ie,C({},n,{colorModel:He}))},qe={defaultColor:"rgba(0, 0, 0, 1)",toHsva:Me,fromHsva:function(n){var o=ee(n);return"rgba("+o.r+", "+o.g+", "+o.b+", "+o.a+")"},equal:le},Pe=function(n){return m.createElement(ie,C({},n,{colorModel:qe}))},Le=M.div({position:"relative",maxWidth:250,'&[aria-readonly="true"]':{opacity:.5}}),Be=M(Z)({position:"absolute",zIndex:1,top:4,left:4,"[aria-readonly=true] &":{cursor:"not-allowed"}}),Xe=M.div({width:200,margin:5,".react-colorful__saturation":{borderRadius:"4px 4px 0 0"},".react-colorful__hue":{boxShadow:"inset 0 0 0 1px rgb(0 0 0 / 5%)"},".react-colorful__last-control":{borderRadius:"0 0 4px 4px"}}),Ge=M(fe)(({theme:n})=>({fontFamily:n.typography.fonts.base})),Ke=M.div({display:"grid",gridTemplateColumns:"repeat(9, 16px)",gap:6,padding:3,marginTop:5,width:200}),De=M.div(({theme:n,active:o})=>({width:16,height:16,boxShadow:o?`${n.appBorderColor} 0 0 0 1px inset, ${n.textMutedColor}50 0 0 0 4px`:`${n.appBorderColor} 0 0 0 1px inset`,borderRadius:n.appBorderRadius})),Ve=`url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`,U=({value:n,style:o,...c})=>{let h=`linear-gradient(${n}, ${n}), ${Ve}, linear-gradient(#fff, #fff)`;return m.createElement(De,{...c,style:{...o,backgroundImage:h}})},Fe=M(de.Input)(({theme:n,readOnly:o})=>({width:"100%",paddingLeft:30,paddingRight:30,boxSizing:"border-box",fontFamily:n.typography.fonts.base})),Te=M(ge)(({theme:n})=>({position:"absolute",zIndex:1,top:6,right:7,width:20,height:20,padding:4,boxSizing:"border-box",cursor:"pointer",color:n.input.color})),se=(n=>(n.RGB="rgb",n.HSL="hsl",n.HEX="hex",n))(se||{}),R=Object.values(se),We=/\(([0-9]+),\s*([0-9]+)%?,\s*([0-9]+)%?,?\s*([0-9.]+)?\)/,Ae=/^\s*rgba?\(([0-9]+),\s*([0-9]+),\s*([0-9]+),?\s*([0-9.]+)?\)\s*$/i,Ue=/^\s*hsla?\(([0-9]+),\s*([0-9]+)%,\s*([0-9]+)%,?\s*([0-9.]+)?\)\s*$/i,K=/^\s*#?([0-9a-f]{3}|[0-9a-f]{6})\s*$/i,Ye=/^\s*#?([0-9a-f]{3})\s*$/i,Ze={hex:Re,rgb:Pe,hsl:Ie},z={hex:"transparent",rgb:"rgba(0, 0, 0, 0)",hsl:"hsla(0, 0%, 0%, 0)"},Y=n=>{let o=n==null?void 0:n.match(We);if(!o)return[0,0,0,1];let[,c,h,i,d=1]=o;return[c,h,i,d].map(Number)},$=n=>{if(!n)return;let o=!0;if(Ae.test(n)){let[e,t,r,a]=Y(n),[l,u,s]=_.default.rgb.hsl([e,t,r])||[0,0,0];return{valid:o,value:n,keyword:_.default.rgb.keyword([e,t,r]),colorSpace:"rgb",rgb:n,hsl:`hsla(${l}, ${u}%, ${s}%, ${a})`,hex:`#${_.default.rgb.hex([e,t,r]).toLowerCase()}`}}if(Ue.test(n)){let[e,t,r,a]=Y(n),[l,u,s]=_.default.hsl.rgb([e,t,r])||[0,0,0];return{valid:o,value:n,keyword:_.default.hsl.keyword([e,t,r]),colorSpace:"hsl",rgb:`rgba(${l}, ${u}, ${s}, ${a})`,hsl:n,hex:`#${_.default.hsl.hex([e,t,r]).toLowerCase()}`}}let c=n.replace("#",""),h=_.default.keyword.rgb(c)||_.default.hex.rgb(c),i=_.default.rgb.hsl(h),d=n;if(/[^#a-f0-9]/i.test(n)?d=c:K.test(n)&&(d=`#${c}`),d.startsWith("#"))o=K.test(d);else try{_.default.keyword.hex(d)}catch{o=!1}return{valid:o,value:d,keyword:_.default.rgb.keyword(h),colorSpace:"hex",rgb:`rgba(${h[0]}, ${h[1]}, ${h[2]}, 1)`,hsl:`hsla(${i[0]}, ${i[1]}%, ${i[2]}%, 1)`,hex:d}},Je=(n,o,c)=>{if(!n||!(o!=null&&o.valid))return z[c];if(c!=="hex")return(o==null?void 0:o[c])||z[c];if(!o.hex.startsWith("#"))try{return`#${_.default.keyword.hex(o.hex)}`}catch{return z.hex}let h=o.hex.match(Ye);if(!h)return K.test(o.hex)?o.hex:z.hex;let[i,d,e]=h[1].split("");return`#${i}${i}${d}${d}${e}${e}`},Qe=(n,o)=>{let[c,h]=p.useState(n||""),[i,d]=p.useState(()=>$(c)),[e,t]=p.useState((i==null?void 0:i.colorSpace)||"hex");p.useEffect(()=>{let u=n||"",s=$(u);h(u),d(s),t((s==null?void 0:s.colorSpace)||"hex")},[n]);let r=p.useMemo(()=>Je(c,i,e).toLowerCase(),[c,i,e]),a=p.useCallback(u=>{let s=$(u),f=(s==null?void 0:s.value)||u||"";h(f),f===""&&(d(void 0),o(void 0)),s&&(d(s),t(s.colorSpace),o(s.value))},[o]),l=p.useCallback(()=>{let u=R.indexOf(e)+1;u>=R.length&&(u=0),t(R[u]);let s=(i==null?void 0:i[R[u]])||"";h(s),o(s)},[i,e,o]);return{value:c,realValue:r,updateValue:a,color:i,colorSpace:e,cycleColorSpace:l}},I=n=>n.replace(/\s*/,"").toLowerCase(),er=(n,o,c)=>{let[h,i]=p.useState(o!=null&&o.valid?[o]:[]);p.useEffect(()=>{o===void 0&&i([])},[o]);let d=p.useMemo(()=>(n||[]).map(t=>typeof t=="string"?$(t):t.title?{...$(t.color),keyword:t.title}:$(t.color)).concat(h).filter(Boolean).slice(-27),[n,h]),e=p.useCallback(t=>{t!=null&&t.valid&&(d.some(r=>I(r[c])===I(t[c]))||i(r=>r.concat(t)))},[c,d]);return{presets:d,addPreset:e}},rr=({name:n,value:o,onChange:c,onFocus:h,onBlur:i,presetColors:d,startOpen:e=!1,argType:t})=>{var E;let r=p.useCallback(ce(c,200),[c]),{value:a,realValue:l,updateValue:u,color:s,colorSpace:f,cycleColorSpace:g}=Qe(o,r),{presets:b,addPreset:y}=er(d,s,f),v=Ze[f],w=!!((E=t==null?void 0:t.table)!=null&&E.readonly);return m.createElement(Le,{"aria-readonly":w},m.createElement(Be,{startOpen:e,trigger:w?[null]:void 0,closeOnOutsideClick:!0,onVisibleChange:()=>y(s),tooltip:m.createElement(Xe,null,m.createElement(v,{color:l==="transparent"?"#000000":l,onChange:u,onFocus:h,onBlur:i}),b.length>0&&m.createElement(Ke,null,b.map((k,P)=>m.createElement(Z,{key:`${k.value}-${P}`,hasChrome:!1,tooltip:m.createElement(Ge,{note:k.keyword||k.value})},m.createElement(U,{value:k[f],active:s&&I(k[f])===I(s[f]),onClick:()=>u(k.value)})))))},m.createElement(U,{value:l,style:{margin:4}})),m.createElement(Fe,{id:he(n),value:a,onChange:k=>u(k.target.value),onFocus:k=>k.target.select(),readOnly:w,placeholder:"Choose color..."}),a?m.createElement(Te,{onClick:g}):null)},sr=rr;export{rr as ColorControl,sr as default};
@@ -1,211 +0,0 @@
1
- import{j as e}from"./jsx-runtime-DiklIkkE.js";import{useMDXComponents as s}from"./index-ChEI-nsM.js";import{M as r,C as i}from"./index-2r-d8gn2.js";import{C as d,D as c}from"./CustomCheckout.stories-D-tPjvHt.js";import"./index-DRjF_FHU.js";import"./iframe-BBMn-SiC.js";import"./index-B7ki2Uzk.js";import"./index-D-Mha1DF.js";import"./index-DrFu-skq.js";import"./useCheckoutContext-C6NRdjfK.js";/* empty css */import"./CheckoutPage-_q0L2I48.js";import"./CustomerInfo-BABvZLYn.js";import"./ValidateInput-Bw6PO7kr.js";import"./DeliveryAddress-DwuRB6NF.js";import"./PaymentMethods-B6OrSp4J.js";function o(t){const n={a:"a",code:"code",h1:"h1",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...s(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{of:d,title:"Components/CustomCheckout",name:"CustomCheckout (English)"}),`
2
- `,e.jsx(n.h1,{id:"customcheckout",children:"CustomCheckout"}),`
3
- `,e.jsxs(n.p,{children:["While the ",e.jsx(n.code,{children:"CheckoutPage"})," component provides a complete, ready-to-use checkout solution, you may need more control over the layout, styling, or user experience. This guide explains how to build a completely custom checkout flow by using the library's hooks and context, while still leveraging the core functionality."]}),`
4
- `,e.jsxs(n.p,{children:["The example above demonstrates a fully customized checkout page with custom styling, where we use the library's ",e.jsx(n.code,{children:"PaymentMethods"})," component (which is required) and build custom components for customer information, delivery address, and the submit button."]}),`
5
- `,e.jsx(i,{of:c}),`
6
- `,e.jsx(n.h3,{id:"overview",children:"Overview"}),`
7
- `,e.jsx(n.p,{children:"When building a custom checkout flow, you'll need to:"}),`
8
- `,e.jsxs(n.ol,{children:[`
9
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Wrap your components"})," in ",e.jsx(n.code,{children:"CheckoutProvider"})," to access the checkout context"]}),`
10
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Use hooks"})," (",e.jsx(n.code,{children:"useCheckoutContext"}),", ",e.jsx(n.code,{children:"useOrderSubmission"}),") to access and update form data"]}),`
11
- `,e.jsxs(n.li,{children:[e.jsxs(n.strong,{children:["Use the ",e.jsx(n.code,{children:"PaymentMethods"})," component"]})," from the library (required - cannot be customized)"]}),`
12
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Update form data"})," through ",e.jsx(n.code,{children:"updateCustomerInfo"})," and ",e.jsx(n.code,{children:"updateDeliveryAddress"})," methods"]}),`
13
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Submit orders"})," using the ",e.jsx(n.code,{children:"useOrderSubmission"})," hook"]}),`
14
- `]}),`
15
- `,e.jsx(n.h3,{id:"understanding-form-data-structure",children:"Understanding Form Data Structure"}),`
16
- `,e.jsxs(n.p,{children:["When customizing components, you need to ensure all required fields are updated correctly. The library uses two main data structures: ",e.jsx(n.code,{children:"CustomerInfo"})," and ",e.jsx(n.code,{children:"DeliveryAddress"}),". Understanding these structures is crucial for building custom components that work seamlessly with the checkout flow."]}),`
17
- `,e.jsx(n.h4,{id:"customerinfo-fields",children:"CustomerInfo Fields"}),`
18
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`interface CustomerInfo {
19
- firstName: string; // First name (required)
20
- lastName: string; // Last name (required)
21
- email: string; // Email (required, must be valid email format)
22
- phone: string; // Phone (required, E.164 format)
23
- }
24
- `})}),`
25
- `,e.jsx(n.h4,{id:"deliveryaddress-fields",children:"DeliveryAddress Fields"}),`
26
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`interface DeliveryAddress {
27
- country: string; // Country (required)
28
- address: string; // Street address (required)
29
- address2?: string; // Address line 2 (optional)
30
- city: string; // City (required)
31
- state: string; // State/Province (required)
32
- zipCode: string; // Postal code (required)
33
- }
34
- `})}),`
35
- `,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Important:"})," When customizing components, you must update all required fields through ",e.jsx(n.code,{children:"updateCustomerInfo"})," and ",e.jsx(n.code,{children:"updateDeliveryAddress"}),"."]}),`
36
- `,e.jsx(n.h3,{id:"using-checkoutprovider",children:"Using CheckoutProvider"}),`
37
- `,e.jsxs(n.p,{children:["The ",e.jsx(n.code,{children:"CheckoutProvider"})," is the foundation of any custom checkout flow. It provides the context and state management needed for all checkout-related functionality. All your custom components must be wrapped within ",e.jsx(n.code,{children:"CheckoutProvider"}),"."]}),`
38
- `,e.jsxs(n.p,{children:["The ",e.jsx(n.code,{children:"CheckoutProvider"})," props are identical to ",e.jsx(n.code,{children:"CheckoutPage"}),", supporting the following:"]}),`
39
- `,e.jsx(n.p,{children:e.jsx(n.strong,{children:"Required Props:"})}),`
40
- `,e.jsxs(n.ul,{children:[`
41
- `,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"cart: CartItem[]"})," - Array of cart items. Each item must include ",e.jsx(n.code,{children:"sku"})," and ",e.jsx(n.code,{children:"offerPricePoint"}),". ",e.jsx(n.strong,{children:"Note:"})," Even for a single product, pass it as an array with one item."]}),`
42
- `,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"children: ReactNode"})," - Child components to be wrapped"]}),`
43
- `]}),`
44
- `,e.jsx(n.p,{children:e.jsx(n.strong,{children:"Optional Props:"})}),`
45
- `,e.jsxs(n.ul,{children:[`
46
- `,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onCheckoutInit?: () => void"})," - Callback function triggered when checkout initializes (immediately after component mount)"]}),`
47
- `,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"googleApiKey?: string"})," - Google Places API Key for enabling address autocomplete functionality"]}),`
48
- `,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onPaymentInfoComplete?: (products: CheckoutCartItem[], totalAmount: number) => void"})," - Callback triggered when payment information is complete"]}),`
49
- `,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onOrderSubmit?: (products: CheckoutCartItem[], totalAmount: number) => void"})," - Callback triggered when order is submitted"]}),`
50
- `,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onOrderSuccess?: (orderCode: string, tradeCode?: string) => void"})," - Callback triggered when order succeeds"]}),`
51
- `]}),`
52
- `,e.jsxs(n.p,{children:["For detailed parameter descriptions, see ",e.jsx(n.a,{href:"./?path=/docs/documentation-usage-guide-checkoutpage--docs",children:"CheckoutPage Documentation"}),"."]}),`
53
- `,e.jsx(n.h3,{id:"building-custom-components",children:"Building Custom Components"}),`
54
- `,e.jsx(n.p,{children:"Now let's see how to build custom components step by step. Each component uses hooks to access and update the checkout state."}),`
55
- `,e.jsx(n.h4,{id:"custom-customer-info-component",children:"Custom Customer Info Component"}),`
56
- `,e.jsxs(n.p,{children:["Use the ",e.jsx(n.code,{children:"useCheckoutContext"})," hook to access ",e.jsx(n.code,{children:"customerInfo"})," and ",e.jsx(n.code,{children:"updateCustomerInfo"}),":"]}),`
57
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { useCheckoutContext } from '@clickaroo/checkout-ui';
58
-
59
- function CustomCustomerInfo() {
60
- const { customerInfo, updateCustomerInfo } = useCheckoutContext();
61
-
62
- return (
63
- <div>
64
- <input
65
- value={customerInfo.firstName}
66
- onChange={(e) => updateCustomerInfo({ firstName: e.target.value })}
67
- placeholder="First Name"
68
- />
69
- <input
70
- value={customerInfo.lastName}
71
- onChange={(e) => updateCustomerInfo({ lastName: e.target.value })}
72
- placeholder="Last Name"
73
- />
74
- <input
75
- type="email"
76
- value={customerInfo.email}
77
- onChange={(e) => updateCustomerInfo({ email: e.target.value })}
78
- placeholder="Email"
79
- />
80
- <input
81
- type="tel"
82
- value={customerInfo.phone}
83
- onChange={(e) => updateCustomerInfo({ phone: e.target.value })}
84
- placeholder="Phone"
85
- />
86
- </div>
87
- );
88
- }
89
- `})}),`
90
- `,e.jsx(n.h4,{id:"custom-delivery-address-component",children:"Custom Delivery Address Component"}),`
91
- `,e.jsxs(n.p,{children:["Similarly, use ",e.jsx(n.code,{children:"updateDeliveryAddress"})," to update address information:"]}),`
92
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { useCheckoutContext } from '@clickaroo/checkout-ui';
93
-
94
- function CustomDeliveryAddress() {
95
- const { deliveryAddress, updateDeliveryAddress } = useCheckoutContext();
96
-
97
- return (
98
- <div>
99
- <input
100
- value={deliveryAddress.country || ''}
101
- onChange={(e) => updateDeliveryAddress({ country: e.target.value })}
102
- placeholder="Country"
103
- />
104
- <input
105
- value={deliveryAddress.address || ''}
106
- onChange={(e) => updateDeliveryAddress({ address: e.target.value })}
107
- placeholder="Street Address"
108
- />
109
- <input
110
- value={deliveryAddress.city || ''}
111
- onChange={(e) => updateDeliveryAddress({ city: e.target.value })}
112
- placeholder="City"
113
- />
114
- <input
115
- value={deliveryAddress.state || ''}
116
- onChange={(e) => updateDeliveryAddress({ state: e.target.value })}
117
- placeholder="State/Province"
118
- />
119
- <input
120
- value={deliveryAddress.zipCode || ''}
121
- onChange={(e) => updateDeliveryAddress({ zipCode: e.target.value })}
122
- placeholder="ZIP Code"
123
- />
124
- </div>
125
- );
126
- }
127
- `})}),`
128
- `,e.jsx(n.h4,{id:"custom-submit-button-component",children:"Custom Submit Button Component"}),`
129
- `,e.jsxs(n.p,{children:["Use ",e.jsx(n.code,{children:"useOrderSubmission"})," hook to handle order submission and ",e.jsx(n.code,{children:"isFormValid()"})," to check form validity:"]}),`
130
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { useCheckoutContext, useOrderSubmission } from '@clickaroo/checkout-ui';
131
-
132
- function CustomSubmitButton() {
133
- const { isFormValid } = useCheckoutContext();
134
- const { isSubmitting, submitOrder } = useOrderSubmission();
135
-
136
- const handleSubmit = async () => {
137
- // Always check form validity before submitting
138
- if (!isFormValid()) {
139
- alert('Please complete all required fields');
140
- return;
141
- }
142
-
143
- const result = await submitOrder();
144
-
145
- if (result.success) {
146
- console.log('Order successful', result.orderCode);
147
- // Handle success (e.g., redirect to success page)
148
- } else {
149
- console.error('Order failed', result.message);
150
- // Handle error (e.g., show error message)
151
- }
152
- };
153
-
154
- return (
155
- <button
156
- onClick={handleSubmit}
157
- disabled={!isFormValid() || isSubmitting}
158
- >
159
- {isSubmitting ? 'Processing...' : 'Complete Order'}
160
- </button>
161
- );
162
- }
163
- `})}),`
164
- `,e.jsx(n.h3,{id:"complete-example",children:"Complete Example"}),`
165
- `,e.jsx(n.p,{children:"Here's a complete example putting it all together:"}),`
166
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import {
167
- CheckoutProvider,
168
- PaymentMethods,
169
- useCheckoutContext,
170
- useOrderSubmission
171
- } from '@clickaroo/checkout-ui';
172
-
173
- // ... (include the custom components above)
174
-
175
- function CustomCheckoutPage() {
176
- const cart = [
177
- {
178
- sku: "TEST001",
179
- offerPricePoint: "OPP-XXX",
180
- title: "Product 1",
181
- price: 99.99,
182
- },
183
- ];
184
-
185
- return (
186
- <CheckoutProvider
187
- cart={cart}
188
- googleApiKey="YOUR_GOOGLE_API_KEY"
189
- onCheckoutInit={() => {
190
- console.log('Checkout initialized');
191
- }}
192
- onPaymentInfoComplete={(products, totalAmount) => {
193
- console.log('Payment info complete', products, totalAmount);
194
- }}
195
- onOrderSubmit={(products, totalAmount) => {
196
- console.log('Order submitted', products, totalAmount);
197
- }}
198
- onOrderSuccess={(orderCode, tradeCode) => {
199
- console.log('Order successful', orderCode, tradeCode);
200
- }}
201
- >
202
- <CustomCustomerInfo />
203
- <CustomDeliveryAddress />
204
- {/* PaymentMethods is required - cannot be customized */}
205
- <PaymentMethods />
206
- <CustomSubmitButton />
207
- </CheckoutProvider>
208
- );
209
- }
210
- `})}),`
211
- `,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Key Point:"})," All components must be wrapped in ",e.jsx(n.code,{children:"CheckoutProvider"})]})]})}function A(t={}){const{wrapper:n}={...s(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(o,{...t})}):o(t)}export{A as default};
@@ -1,6 +0,0 @@
1
- import{j as o}from"./jsx-runtime-DiklIkkE.js";import{C as x,S as h,u as m,a as y,c as C,D as v}from"./useCheckoutContext-C6NRdjfK.js";/* empty css */import{u as S}from"./CheckoutPage-_q0L2I48.js";import"./CustomerInfo-BABvZLYn.js";import"./DeliveryAddress-DwuRB6NF.js";import{P as j}from"./PaymentMethods-B6OrSp4J.js";import{R as w}from"./index-DRjF_FHU.js";C(v);function z(){const{customerInfo:a,updateCustomerInfo:i}=m(),[e,s]=w.useState({}),t=(r,b)=>{const c=y.safeParse({...a,[r]:b});if(c.success)s(d=>{const l={...d};return delete l[r],l});else{const d=c.error.issues.find(l=>l.path.includes(r));s(d?l=>({...l,[r]:d.message}):l=>{const u={...l};return delete u[r],u})}};return o.jsxs("div",{style:{marginBottom:"1.5rem"},children:[o.jsx("div",{style:{fontSize:"1.5rem",fontWeight:"bold",marginBottom:"1.5rem",color:"#9333ea"},children:"✨ Custom Customer Form ✨"}),o.jsx("div",{style:{background:"linear-gradient(to bottom right, #faf5ff, #fdf2f8)",borderRadius:"1rem",padding:"1.5rem",boxShadow:"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",border:"2px solid #e9d5ff",overflow:"hidden"},children:o.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(250px, 1fr))",gap:"1.5rem",width:"100%"},children:[o.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem"},children:[o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#f3e8ff",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#7e22ce"},children:"👤 First Name"}),o.jsx("input",{type:"text",value:a.firstName,onChange:r=>{i({firstName:r.target.value}),t("firstName",r.target.value)},onBlur:r=>{t("firstName",r.target.value),r.target.style.borderColor=e.firstName?"#ef4444":"#d8b4fe",r.target.style.boxShadow="none"},style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:`2px solid ${e.firstName?"#ef4444":"#d8b4fe"}`,borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:r=>{r.target.style.borderColor=e.firstName?"#ef4444":"#a855f7",r.target.style.boxShadow="0 0 0 4px rgba(192, 132, 252, 0.2)"},placeholder:"Enter first name"}),e.firstName&&o.jsx("div",{style:{color:"#ef4444",fontSize:"0.875rem",marginTop:"0.25rem"},children:e.firstName})]}),o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#f3e8ff",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#7e22ce"},children:"👤 Last Name"}),o.jsx("input",{type:"text",value:a.lastName,onChange:r=>{i({lastName:r.target.value}),t("lastName",r.target.value)},onBlur:r=>{t("lastName",r.target.value),r.target.style.borderColor=e.lastName?"#ef4444":"#d8b4fe",r.target.style.boxShadow="none"},style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:`2px solid ${e.lastName?"#ef4444":"#d8b4fe"}`,borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:r=>{r.target.style.borderColor=e.lastName?"#ef4444":"#a855f7",r.target.style.boxShadow="0 0 0 4px rgba(192, 132, 252, 0.2)"},placeholder:"Enter last name"}),e.lastName&&o.jsx("div",{style:{color:"#ef4444",fontSize:"0.875rem",marginTop:"0.25rem"},children:e.lastName})]})]}),o.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem"},children:[o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#fce7f3",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#be185d"},children:"📧 Email"}),o.jsx("input",{type:"email",value:a.email,onChange:r=>{i({email:r.target.value}),t("email",r.target.value)},onBlur:r=>{t("email",r.target.value),r.target.style.borderColor=e.email?"#ef4444":"#f9a8d4",r.target.style.boxShadow="none"},style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:`2px solid ${e.email?"#ef4444":"#f9a8d4"}`,borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:r=>{r.target.style.borderColor=e.email?"#ef4444":"#ec4899",r.target.style.boxShadow="0 0 0 4px rgba(249, 168, 212, 0.2)"},placeholder:"your@email.com"}),e.email&&o.jsx("div",{style:{color:"#ef4444",fontSize:"0.875rem",marginTop:"0.25rem"},children:e.email})]}),o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#fce7f3",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#be185d"},children:"📱 Phone"}),o.jsx("input",{type:"tel",value:a.phone,onChange:r=>{i({phone:r.target.value}),t("phone",r.target.value)},onBlur:r=>{t("phone",r.target.value),r.target.style.borderColor=e.phone?"#ef4444":"#f9a8d4",r.target.style.boxShadow="none"},style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:`2px solid ${e.phone?"#ef4444":"#f9a8d4"}`,borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:r=>{r.target.style.borderColor=e.phone?"#ef4444":"#ec4899",r.target.style.boxShadow="0 0 0 4px rgba(249, 168, 212, 0.2)"},placeholder:"+1 234 567 8900"}),e.phone&&o.jsx("div",{style:{color:"#ef4444",fontSize:"0.875rem",marginTop:"0.25rem"},children:e.phone})]})]})]})})]})}function k(){const{deliveryAddress:a,updateDeliveryAddress:i}=m();return o.jsxs("div",{style:{marginBottom:"1.5rem"},children:[o.jsx("div",{style:{fontSize:"1.5rem",fontWeight:"bold",marginBottom:"1.5rem",color:"#2563eb"},children:"📍 Custom Delivery Address"}),o.jsx("div",{style:{background:"linear-gradient(to bottom right, #eff6ff, #ecfeff)",borderRadius:"1rem",padding:"1.5rem",boxShadow:"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",border:"2px solid #bfdbfe",overflow:"hidden"},children:o.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem"},children:[o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#dbeafe",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#1e40af"},children:"🌍 Country"}),o.jsx("input",{type:"text",value:a.country,onChange:e=>i({country:e.target.value}),style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:"2px solid #93c5fd",borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:e=>{e.target.style.borderColor="#3b82f6",e.target.style.boxShadow="0 0 0 4px rgba(147, 197, 253, 0.2)"},onBlur:e=>{e.target.style.borderColor="#93c5fd",e.target.style.boxShadow="none"},placeholder:"Enter country"})]}),o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#dbeafe",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#1e40af"},children:"🏠 Street Address"}),o.jsx("input",{type:"text",value:a.address,onChange:e=>i({address:e.target.value}),style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:"2px solid #93c5fd",borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:e=>{e.target.style.borderColor="#3b82f6",e.target.style.boxShadow="0 0 0 4px rgba(147, 197, 253, 0.2)"},onBlur:e=>{e.target.style.borderColor="#93c5fd",e.target.style.boxShadow="none"},placeholder:"Enter street address"})]}),o.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(150px, 1fr))",gap:"1.5rem",width:"100%"},children:[o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#cffafe",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#155e75"},children:"🏙️ City"}),o.jsx("input",{type:"text",value:a.city,onChange:e=>i({city:e.target.value}),style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:"2px solid #5eead4",borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:e=>{e.target.style.borderColor="#14b8a6",e.target.style.boxShadow="0 0 0 4px rgba(94, 234, 212, 0.2)"},onBlur:e=>{e.target.style.borderColor="#5eead4",e.target.style.boxShadow="none"},placeholder:"Enter city"})]}),o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#cffafe",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#155e75"},children:"🗺️ State/Province"}),o.jsx("input",{type:"text",value:a.state,onChange:e=>i({state:e.target.value}),style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:"2px solid #5eead4",borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:e=>{e.target.style.borderColor="#14b8a6",e.target.style.boxShadow="0 0 0 4px rgba(94, 234, 212, 0.2)"},onBlur:e=>{e.target.style.borderColor="#5eead4",e.target.style.boxShadow="none"},placeholder:"Enter state"})]})]}),o.jsxs("div",{style:{position:"relative"},children:[o.jsx("label",{style:{position:"absolute",top:"-1rem",left:"0.75rem",backgroundColor:"#dbeafe",padding:"0.25rem 0.5rem",fontSize:"0.875rem",fontWeight:"600",color:"#1e40af"},children:"📮 Zip Code"}),o.jsx("input",{type:"text",value:a.zipCode,onChange:e=>i({zipCode:e.target.value}),style:{width:"100%",padding:"0.75rem 1rem",backgroundColor:"white",border:"2px solid #93c5fd",borderRadius:"0.75rem",fontSize:"1.125rem",outline:"none",boxSizing:"border-box"},onFocus:e=>{e.target.style.borderColor="#3b82f6",e.target.style.boxShadow="0 0 0 4px rgba(147, 197, 253, 0.2)"},onBlur:e=>{e.target.style.borderColor="#93c5fd",e.target.style.boxShadow="none"},placeholder:"Enter zip code"})]})]})})]})}function N(){const{isFormValid:a}=m(),{isSubmitting:i,submitOrder:e}=S(),s=async()=>{if(!a()){alert("Please complete all required fields");return}const r=await e();r.success?alert(`Order successful! Order Code: ${r.orderCode}`):alert(r.message)},t=a()&&!i;return o.jsxs("div",{style:{marginTop:"1.5rem"},children:[o.jsx("button",{onClick:s,disabled:!t,style:{width:"100%",padding:"1rem 1.5rem",borderRadius:"0.75rem",fontWeight:"bold",fontSize:"1.125rem",background:t?"linear-gradient(to right, #9333ea, #db2777)":"#9ca3af",color:t?"white":"#374151",cursor:t?"pointer":"not-allowed",border:"none",boxShadow:t?"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)":"none",transition:"all 0.3s",transform:"scale(1)"},onMouseEnter:r=>{t&&(r.currentTarget.style.background="linear-gradient(to right, #7e22ce, #be185d)",r.currentTarget.style.transform="scale(1.05)")},onMouseLeave:r=>{t&&(r.currentTarget.style.background="linear-gradient(to right, #9333ea, #db2777)",r.currentTarget.style.transform="scale(1)")},onMouseDown:r=>{t&&(r.currentTarget.style.transform="scale(0.95)")},onMouseUp:r=>{t&&(r.currentTarget.style.transform="scale(1.05)")},children:i?o.jsxs("span",{style:{display:"flex",alignItems:"center",justifyContent:"center",gap:"0.5rem"},children:[o.jsxs("svg",{style:{animation:"spin 1s linear infinite",height:"1.25rem",width:"1.25rem"},xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[o.jsx("circle",{style:{opacity:.25},cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),o.jsx("path",{style:{opacity:.75},fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),"Processing..."]}):"🎉 Complete Order"}),o.jsx("style",{children:`
2
- @keyframes spin {
3
- from { transform: rotate(0deg); }
4
- to { transform: rotate(360deg); }
5
- }
6
- `})]})}function E(){const a=[{sku:"TEST001",offerPricePoint:h.SINGLE,title:"Product Title",price:99.99}];return o.jsx(x,{cart:a,children:o.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1.5rem",maxWidth:"42rem",margin:"0 auto",padding:"1rem",width:"100%",boxSizing:"border-box"},children:[o.jsx(z,{}),o.jsx(k,{}),o.jsxs("div",{style:{marginBottom:"1.5rem"},children:[o.jsx("div",{style:{fontSize:"1.5rem",fontWeight:"bold",marginBottom:"1.5rem",color:"#059669"},children:"💳 Payment Methods"}),o.jsx("div",{style:{background:"linear-gradient(to bottom right, #ecfdf5, #d1fae5)",borderRadius:"1rem",padding:"1.5rem",boxShadow:"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",border:"2px solid #86efac",overflow:"hidden"},children:o.jsx(j,{showText:!1})})]}),o.jsx(N,{})]})})}const R={component:E,title:"Components/CustomCheckout",parameters:{layout:"padded",docs:{description:{component:"Example of mixing library components with custom components. Demonstrates how to combine library components like CustomerInfo, DeliveryAddress, and PaymentMethods with custom components for a fully customized checkout experience."}}}},n={};var g,p,f;n.parameters={...n.parameters,docs:{...(g=n.parameters)==null?void 0:g.docs,source:{originalSource:"{}",...(f=(p=n.parameters)==null?void 0:p.docs)==null?void 0:f.source}}};const T=["Default"],M=Object.freeze(Object.defineProperty({__proto__:null,Default:n,__namedExportsOrder:T,default:R},Symbol.toStringTag,{value:"Module"}));export{M as C,n as D};
@@ -1 +0,0 @@
1
- import{j as t}from"./jsx-runtime-DiklIkkE.js";import{F as u}from"./ValidateInput-Bw6PO7kr.js";import{f as p,z as L,v as z,h as k,b as j,a as w}from"./useCheckoutContext-C6NRdjfK.js";import{r as i}from"./index-DRjF_FHU.js";const S="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='1280'%20height='640'%20viewBox='0%200%2010080%205040'%3e%3cdefs%3e%3cclipPath%20id='c1'%3e%3cpath%20d='M0,0H6V3H0z'/%3e%3c/clipPath%3e%3cclipPath%20id='c2'%3e%3cpath%20d='M0,0V1.5H6V3H6zM6,0H3V3H0V3z'/%3e%3c/clipPath%3e%3cpath%20id='Star7'%20d='M0,-360%2069.421398,-144.155019%20281.459334,-224.456329%20155.988466,-35.603349%20350.974048,80.107536%20125.093037,99.758368%20156.198146,324.348792%200,160%20-156.198146,324.348792%20-125.093037,99.758368%20-350.974048,80.107536%20-155.988466,-35.603349%20-281.459334,-224.456329%20-69.421398,-144.155019z'/%3e%3cpath%20id='Star5'%20d='M0,-210%2054.859957,-75.508253%20199.721868,-64.893569%2088.765275,28.841586%20123.434903,169.893569%200,93.333333%20-123.434903,169.893569%20-88.765275,28.841586%20-199.721868,-64.893569%20-54.859957,-75.508253z'/%3e%3c/defs%3e%3cg%20transform='scale(840)'%3e%3crect%20width='12'%20height='6'%20fill='%23012169'/%3e%3cpath%20d='M0,0%206,3M6,0%200,3'%20stroke='%23fff'%20stroke-width='0.6'%20clip-path='url(%23c1)'/%3e%3cpath%20d='M0,0%206,3M6,0%200,3'%20stroke='%23e4002b'%20stroke-width='0.4'%20clip-path='url(%23c2)'/%3e%3cpath%20d='M3,0V3M0,1.5H6'%20stroke='%23fff'/%3e%3cpath%20d='M3,0V3M0,1.5H6'%20stroke='%23e4002b'%20stroke-width='0.6'/%3e%3c/g%3e%3cg%20fill='%23fff'%3e%3cuse%20id='Comwlth'%20xlink:href='%23Star7'%20transform='translate(2520,%203780)%20scale(2.1)'/%3e%3cuse%20id='αCrucis'%20xlink:href='%23Star7'%20x='7560'%20y='4200'/%3e%3cuse%20id='βCrucis'%20xlink:href='%23Star7'%20x='6300'%20y='2205'/%3e%3cuse%20id='γCrucis'%20xlink:href='%23Star7'%20x='7560'%20y='840'/%3e%3cuse%20id='δCrucis'%20xlink:href='%23Star7'%20x='8680'%20y='1869'/%3e%3cuse%20id='εCrucis'%20xlink:href='%23Star5'%20x='8064'%20y='2730'/%3e%3c/g%3e%3c/svg%3e",_="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='600'%20viewBox='0%200%209600%204800'%3e%3ctitle%3eFlag%20of%20Canada%20(Pantone%20colours)%3c/title%3e%3cpath%20fill='%23d52b1e'%20d='m0%200h2400l99%2099h4602l99-99h2400v4800h-2400l-99-99h-4602l-99%2099H0z'/%3e%3cpath%20fill='%23fff'%20d='m2400%200h4800v4800h-4800zm2490%204430-45-863a95%2095%200%200%201%20111-98l859%20151-116-320a65%2065%200%200%201%2020-73l941-762-212-99a65%2065%200%200%201-34-79l186-572-542%20115a65%2065%200%200%201-73-38l-105-247-423%20454a65%2065%200%200%201-111-57l204-1052-327%20189a65%2065%200%200%201-91-27l-332-652-332%20652a65%2065%200%200%201-91%2027l-327-189%20204%201052a65%2065%200%200%201-111%2057l-423-454-105%20247a65%2065%200%200%201-73%2038l-542-115%20186%20572a65%2065%200%200%201-34%2079l-212%2099%20941%20762a65%2065%200%200%201%2020%2073l-116%20320%20859-151a95%2095%200%200%201%20111%2098l-45%20863z'/%3e%3c/svg%3e",H="data:image/svg+xml,%3c?xml%20version='1.0'?%3e%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2060%2030'%20width='1200'%20height='600'%3e%3cclipPath%20id='s'%3e%3cpath%20d='M0,0%20v30%20h60%20v-30%20z'/%3e%3c/clipPath%3e%3cclipPath%20id='t'%3e%3cpath%20d='M30,15%20h30%20v15%20z%20v15%20h-30%20z%20h-30%20v-15%20z%20v-15%20h30%20z'/%3e%3c/clipPath%3e%3cg%20clip-path='url(%23s)'%3e%3cpath%20d='M0,0%20v30%20h60%20v-30%20z'%20fill='%23012169'/%3e%3cpath%20d='M0,0%20L60,30%20M60,0%20L0,30'%20stroke='%23fff'%20stroke-width='6'/%3e%3cpath%20d='M0,0%20L60,30%20M60,0%20L0,30'%20clip-path='url(%23t)'%20stroke='%23C8102E'%20stroke-width='4'/%3e%3cpath%20d='M30,0%20v30%20M0,15%20h60'%20stroke='%23fff'%20stroke-width='10'/%3e%3cpath%20d='M30,0%20v30%20M0,15%20h60'%20stroke='%23C8102E'%20stroke-width='6'/%3e%3c/g%3e%3c/svg%3e",E="data:image/svg+xml,%3c?xml%20version='1.0'?%3e%3csvg%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20height='600'%20width='1200'%3e%3cdefs%3e%3cclipPath%20id='Canton'%3e%3cpath%20d='M%200,0%20L%20600,0%20L%20600,300%20L%200,300%20z'/%3e%3c/clipPath%3e%3cclipPath%20id='Diagonals'%3e%3cpath%20d='M%200,0%20L%20300,150%20L%200,150%20z%20M%20300,0%20L%20600,0%20L%20300,150%20z%20M%20300,150%20L%20600,150%20L%20600,300%20z%20M%20300,150%20L%20300,300%20L%200,300%20z'/%3e%3c/clipPath%3e%3cg%20id='Pentagram'%3e%3cg%20id='Arm'%20transform='translate(0,-0.324925)'%3e%3cpath%20d='M%200,0%20L%200,0.5%20L%201,0%20z'/%3e%3cpath%20d='M%200,0%20L%200,-0.5%20L%201,0%20z'%20transform='rotate(-36,1,0)'/%3e%3c/g%3e%3cuse%20xlink:href='%23Arm'%20transform='scale(-1,1)'/%3e%3cuse%20xlink:href='%23Arm'%20transform='rotate(72,0,0)'/%3e%3cuse%20xlink:href='%23Arm'%20transform='rotate(-72,0,0)'/%3e%3cuse%20xlink:href='%23Arm'%20transform='rotate(-72,0,0)%20scale(-1,1)'/%3e%3c/g%3e%3c/defs%3e%3crect%20fill='%23012169'%20x='0'%20y='0'%20width='1200'%20height='600'/%3e%3cg%20id='Flag_of_the_United_Kingdom'%3e%3cpath%20id='Saint_Andrews_Cross'%20stroke='%23FFF'%20d='M%200,0%20L%20600,300%20M%200,300%20L%20600,0'%20stroke-width='60'%20clip-path='url(%23Canton)'/%3e%3cpath%20id='Saint_Patricks_Cross'%20stroke='%23C8102E'%20d='M%200,0%20L%20600,300%20M%200,300%20L%20600,0'%20stroke-width='40'%20clip-path='url(%23Diagonals)'/%3e%3cg%20id='Saint_Georges_Cross'%3e%3cpath%20stroke='%23FFF'%20d='M%20300,0%20L%20300,300%20M%200,150%20L%20600,150'%20stroke-width='100'%20clip-path='url(%23Canton)'/%3e%3cpath%20stroke='%23C8102E'%20d='M%20300,0%20L%20300,300%20M%200,150%20L%20600,150'%20stroke-width='60'%20clip-path='url(%23Canton)'/%3e%3c/g%3e%3c/g%3e%3cg%20id='Southern_Cross'%3e%3cg%20id='Gamma_Crucis'%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23FFF'%20transform='translate(900,120)%20scale(45.4)'/%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23C8102E'%20transform='translate(900,120)%20scale(30)'/%3e%3c/g%3e%3cg%20transform='rotate(82,900,240)'%3e%3cg%20id='Delta_Crucis'%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23FFF'%20transform='translate(900,120)%20rotate(-82)%20scale(40.4)'/%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23C8102E'%20transform='translate(900,120)%20rotate(-82)%20scale(25)'/%3e%3c/g%3e%3cg%20id='Beta_Crucis'%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23FFF'%20transform='translate(900,380)%20rotate(-82)%20scale(45.4)'/%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23C8102E'%20transform='translate(900,380)%20rotate(-82)%20scale(30)'/%3e%3c/g%3e%3c/g%3e%3cg%20id='Alpha_Crucis'%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23FFF'%20transform='translate(900,480)%20scale(50.4)'/%3e%3cuse%20xlink:href='%23Pentagram'%20fill='%23C8102E'%20transform='translate(900,480)%20scale(35)'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e",U="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='1235'%20height='650'%20viewBox='0%200%207410%203900'%3e%3cpath%20d='M0,0h7410v3900H0'%20fill='%23b31942'/%3e%3cpath%20d='M0,450H7410m0,600H0m0,600H7410m0,600H0m0,600H7410m0,600H0'%20stroke='%23FFF'%20stroke-width='300'/%3e%3cpath%20d='M0,0h2964v2100H0'%20fill='%230a3161'/%3e%3cg%20fill='%23FFF'%3e%3cg%20id='s18'%3e%3cg%20id='s9'%3e%3cg%20id='s5'%3e%3cg%20id='s4'%3e%3cpath%20id='s'%20d='M247,90%20317.534230,307.082039%20132.873218,172.917961H361.126782L176.465770,307.082039z'/%3e%3cuse%20xlink:href='%23s'%20y='420'/%3e%3cuse%20xlink:href='%23s'%20y='840'/%3e%3cuse%20xlink:href='%23s'%20y='1260'/%3e%3c/g%3e%3cuse%20xlink:href='%23s'%20y='1680'/%3e%3c/g%3e%3cuse%20xlink:href='%23s4'%20x='247'%20y='210'/%3e%3c/g%3e%3cuse%20xlink:href='%23s9'%20x='494'/%3e%3c/g%3e%3cuse%20xlink:href='%23s18'%20x='988'/%3e%3cuse%20xlink:href='%23s9'%20x='1976'/%3e%3cuse%20xlink:href='%23s5'%20x='2470'/%3e%3c/g%3e%3c/svg%3e",h=[{code:"US",flag:U,dialCode:"+1",name:"United States"},{code:"CA",flag:_,dialCode:"+1",name:"Canada"},{code:"AU",flag:S,dialCode:"+61",name:"Australia"},{code:"NZ",flag:E,dialCode:"+64",name:"New Zealand"},{code:"GB",flag:H,dialCode:"+44",name:"United Kingdom"}],M=({value:s,onChange:c,label:n="Phone Number",placeholder:g="Phone Number",error:x})=>{const[d,m]=i.useState(!1),[a,C]=i.useState(()=>{if(s)for(const e of h){const r=p(e.code.toUpperCase());if(s.startsWith(r))return e.code}return"US"}),l=i.useMemo(()=>p(a.toUpperCase()),[a]);i.useEffect(()=>{if(s)for(const e of h){const r=p(e.code.toUpperCase());if(s.startsWith(r)){a!==e.code&&C(e.code);return}}},[s,a]);const v=i.useMemo(()=>h.find(e=>e.code===a)||h[0],[a]),o=i.useMemo(()=>s.startsWith(l)?s.replace(l,""):s,[s,l]),P=i.useMemo(()=>L.string().trim().min(1,"Phone number is required").refine(e=>{const r=l+e.replace(/[^\d]+/g,"");return z(r,a.toUpperCase())},{message:`Invalid phone number for ${v.name}`}),[l,a]),F=e=>{C(e);const r=p(e.toUpperCase());if(o){const f=o.replace(/[^\d]+/g,""),y=k(f,e.toUpperCase());c(y||r+f)}else c(r)},N=e=>{const r=e.replace(/[^\d]+/g,""),f=k(r,a.toUpperCase());c(f||l+r)},b=t.jsxs("div",{className:"relative flex items-center justify-center border-r border-[#e6e6e6] h-full",style:{minWidth:"70px"},children:[t.jsx("select",{value:a,onChange:e=>F(e.target.value),className:"absolute inset-0 w-full h-full opacity-0 cursor-pointer z-30",style:{fontSize:0},children:h.map(e=>t.jsx("option",{value:e.code,children:e.code},e.code))}),t.jsx("div",{className:"flex items-center justify-center z-20 pointer-events-none",children:t.jsx("img",{src:v.flag,alt:v.name,className:"w-6 h-4 object-cover rounded-sm mr-3"})}),t.jsx("div",{className:"absolute right-2 top-0 bottom-0 flex items-center pointer-events-none z-20",children:t.jsx("svg",{className:"w-3 h-3 text-gray-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:t.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})})]});return t.jsx("div",{className:"w-full",children:t.jsx(u,{type:"tel",label:n,placeholder:g,value:o,onChange:e=>N(e.target.value),onFocus:()=>{m(!0)},onBlur:()=>{m(!1)},inputClass:`w-full ${d||o?"!pl-[110px]":"!pl-[80px]"}`,autoComplete:"shipping tel",schema:P,error:x,prefix:t.jsxs("div",{className:"flex items-center h-full",children:[b,(d||o)&&t.jsx("span",{className:"ml-2 text-base font-family-inherit",children:l})]})})})};M.__docgenInfo={description:"",methods:[],displayName:"PhoneInput",props:{value:{required:!0,tsType:{name:"string"},description:""},onChange:{required:!0,tsType:{name:"signature",type:"function",raw:"(value: string) => void",signature:{arguments:[{type:{name:"string"},name:"value"}],return:{name:"void"}}},description:""},label:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'"Phone Number"',computed:!1}},placeholder:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'"Phone Number"',computed:!1}},error:{required:!1,tsType:{name:"string"},description:""}}};const I=({showTitle:s=!0})=>{const{customerInfo:c,updateCustomerInfo:n}=j(),{firstName:g,lastName:x,email:d,phone:m}=c;return t.jsxs("div",{className:"clickaroo-checkout-ui w-full",children:[s&&t.jsx("div",{className:"text-lg md:text-2xl mb-5 font-medium",children:"Customer Information"}),t.jsxs("div",{className:"border border-solid border-[#e6e6e6] shadow rounded-md p-4 bg-white",children:[t.jsxs("div",{className:"flex flex-col md:flex-row gap-3 mb-2",children:[t.jsx(u,{label:"First Name",placeholder:"First Name",value:g,onChange:a=>n({firstName:a.target.value}),inputClass:"flex-1",autoComplete:"shipping given-name",schema:w.shape.firstName}),t.jsx(u,{label:"Last Name",placeholder:"Last Name",value:x,onChange:a=>n({lastName:a.target.value}),inputClass:"flex-1",autoComplete:"shipping family-name",schema:w.shape.lastName})]}),t.jsx("div",{className:"mb-2",children:t.jsx(u,{label:"Email",placeholder:"Email",value:d,onChange:a=>n({email:a.target.value}),inputClass:"w-full",autoComplete:"shipping email",schema:w.shape.email})}),t.jsx(M,{value:m,onChange:a=>n({phone:a})})]})]})};I.__docgenInfo={description:"",methods:[],displayName:"CustomInfo",props:{showTitle:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}}}};export{I as C};
@@ -1,9 +0,0 @@
1
- import{j as o}from"./jsx-runtime-DiklIkkE.js";import{C as l}from"./CustomerInfo-BABvZLYn.js";import{C as u,S as p,c as d,D as f}from"./useCheckoutContext-C6NRdjfK.js";import"./index-DRjF_FHU.js";import"./ValidateInput-Bw6PO7kr.js";d(f);const h=[{sku:"TEST001",offerPricePoint:p.SINGLE}],E={component:l,title:"Components/CustomerInfo",parameters:{docs:{description:{component:"Customer information form component for collecting customer details (first name, last name, email, phone). Requires CheckoutProvider wrapper."}}},decorators:[c=>o.jsx(u,{cart:h,children:o.jsx(c,{})})],argTypes:{showTitle:{description:'Whether to display the title "Customer Information"',control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showTitle:!0}},r={args:{showTitle:!1}};var t,s,a;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`{
2
- args: {
3
- showTitle: true
4
- }
5
- }`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,i,m;r.parameters={...r.parameters,docs:{...(n=r.parameters)==null?void 0:n.docs,source:{originalSource:`{
6
- args: {
7
- showTitle: false
8
- }
9
- }`,...(m=(i=r.parameters)==null?void 0:i.docs)==null?void 0:m.source}}};const S=["Default","WithoutTitle"];export{e as Default,r as WithoutTitle,S as __namedExportsOrder,E as default};
@@ -1,2 +0,0 @@
1
- import{j as t}from"./jsx-runtime-DiklIkkE.js";import{F as W}from"./ValidateInput-Bw6PO7kr.js";import{r as a,R as O}from"./index-DRjF_FHU.js";import{Z as F,d as P,e as j,s as x,b as z,A as M}from"./useCheckoutContext-C6NRdjfK.js";const R=({label:h,value:u,onChange:l,onBlur:b,onFocus:n,placeholder:C,selectClass:v="",error:y,options:A,schema:g,validateOnChange:T=!1,validateOnBlur:f=!0,onValidationChange:S,...e})=>{const[,s]=a.useState(!1),[i,r]=a.useState(null),d=y||i,m=a.useCallback(o=>{var w;if(!g)return null;try{return g.parse(o),null}catch(L){return L instanceof F&&((w=L.issues[0])==null?void 0:w.message)||"Validation failed"}},[g]),N=a.useCallback(o=>{r(o),S&&S(o)},[S]);return a.useEffect(()=>{if(g&&T){const o=m(u);N(o)}},[u,g,T,m,N]),t.jsxs("div",{className:"relative w-full",children:[t.jsx("label",{className:`text-sm text-[#2A2B35] bg-white px-1 pointer-events-none
2
- transition-all duration-200 z-10`,children:h}),t.jsx("div",{className:"relative",children:t.jsxs("select",{value:u,onFocus:o=>{s(!0),n&&n(o)},onBlur:o=>{if(s(!1),g&&f){const w=m(u);N(w)}b&&b(o)},onChange:o=>l(o.target.value),className:`w-full border border-[#e6e6e6] shadow-sm rounded-md p-[0.64rem] pl-3 text-base bg-white transition pr-12 appearance-none cursor-pointer outline-none font-[inherit] ${d?"!border-2 !border-[#df1b41] focus:!border-[#df1b41] !text-[#df1b41] focus:!ring-0 focus:!outline-none":"border-secondary focus:border-[#8AA3D4] focus:shadow-focus focus:!outline-none"} ${v}`,...e,children:[C&&!u&&t.jsx("option",{value:"",disabled:!0,children:C||h}),A.map(o=>t.jsx("option",{value:o.value,children:o.label},o.value))]})}),d&&t.jsx("p",{className:"mt-1 text-sm text-[#df1b41] px-2",children:d})]})};R.__docgenInfo={description:"",methods:[],displayName:"FloatingLabelSelect",props:{label:{required:!0,tsType:{name:"string"},description:""},value:{required:!0,tsType:{name:"string"},description:""},onChange:{required:!0,tsType:{name:"signature",type:"function",raw:"(value: string) => void",signature:{arguments:[{type:{name:"string"},name:"value"}],return:{name:"void"}}},description:""},onBlur:{required:!1,tsType:{name:"signature",type:"function",raw:"(e: React.FocusEvent<HTMLSelectElement>) => void",signature:{arguments:[{type:{name:"ReactFocusEvent",raw:"React.FocusEvent<HTMLSelectElement>",elements:[{name:"HTMLSelectElement"}]},name:"e"}],return:{name:"void"}}},description:""},onFocus:{required:!1,tsType:{name:"signature",type:"function",raw:"(e: React.FocusEvent<HTMLSelectElement>) => void",signature:{arguments:[{type:{name:"ReactFocusEvent",raw:"React.FocusEvent<HTMLSelectElement>",elements:[{name:"HTMLSelectElement"}]},name:"e"}],return:{name:"void"}}},description:""},placeholder:{required:!1,tsType:{name:"string"},description:""},icon:{required:!1,tsType:{name:"ReactReactNode",raw:"React.ReactNode"},description:""},selectClass:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'""',computed:!1}},error:{required:!1,tsType:{name:"string"},description:""},options:{required:!0,tsType:{name:"Array",elements:[{name:"SelectOption"}],raw:"SelectOption[]"},description:""},schema:{required:!1,tsType:{name:"z.ZodSchema",elements:[{name:"string"}],raw:"z.ZodSchema<string>"},description:""},validateOnChange:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},validateOnBlur:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},onValidationChange:{required:!1,tsType:{name:"signature",type:"function",raw:"(error: string | null) => void",signature:{arguments:[{type:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},name:"error"}],return:{name:"void"}}},description:""}},composes:["Omit"]};const q="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20116%2015'%20aria-label='Powered%20by%20Google'%20class='wbodi'%20fill='%236c757d'%3e%3cpath%20d='M4.025%203.572c1.612%200%202.655%201.283%202.655%203.27%200%201.974-1.05%203.27-2.655%203.27-.902%200-1.63-.393-1.974-1.06h-.09v3.057H.95V3.68h.96v1.054h.094c.404-.726%201.16-1.166%202.02-1.166zm-.24%205.63c1.16%200%201.852-.884%201.852-2.36%200-1.477-.692-2.362-1.846-2.362-1.14%200-1.86.91-1.86%202.362%200%201.447.72%202.36%201.858%202.36zm7.072.91c-1.798%200-2.912-1.243-2.912-3.27%200-2.033%201.114-3.27%202.912-3.27%201.8%200%202.913%201.237%202.913%203.27%200%202.027-1.114%203.27-2.913%203.27m0-.91c1.196%200%201.87-.866%201.87-2.36%200-1.5-.674-2.362-1.87-2.362-1.195%200-1.87.862-1.87%202.362%200%201.494.675%202.36%201.87%202.36m12.206-5.518H22.05l-1.244%205.05h-.094L19.3%203.684h-.966l-1.412%205.05h-.094l-1.242-5.05h-1.02L16.336%2010h1.02l1.406-4.887h.093L20.268%2010h1.025zm3.632.78c-1.008%200-1.71.737-1.787%201.856h3.48c-.023-1.12-.69-1.857-1.693-1.857zm1.664%203.9h1.004c-.305%201.085-1.277%201.747-2.66%201.747-1.752%200-2.848-1.26-2.848-3.26%200-1.986%201.113-3.275%202.847-3.275%201.705%200%202.742%201.213%202.742%203.176v.387h-4.542v.047c.053%201.248.75%202.04%201.822%202.04.815%200%201.366-.3%201.63-.857zM31.03%2010h1.01V6.086c0-.89.696-1.535%201.657-1.535.2%200%20.563.04.645.06V3.6c-.13-.018-.34-.03-.504-.03-.838%200-1.565.434-1.752%201.05h-.094v-.938h-.96V10zm6.915-5.537c-1.008%200-1.71.738-1.787%201.857h3.48c-.023-1.12-.69-1.857-1.693-1.857m1.664%203.902h1.004c-.304%201.084-1.277%201.746-2.66%201.746-1.752%200-2.848-1.26-2.848-3.26%200-1.986%201.113-3.275%202.847-3.275%201.705%200%202.742%201.213%202.742%203.176v.387h-4.542v.047c.053%201.248.75%202.04%201.822%202.04.815%200%201.366-.3%201.63-.857zm5.01%201.746c-1.62%200-2.658-1.28-2.658-3.265%200-1.98%201.05-3.27%202.654-3.27.878%200%201.622.416%201.98%201.108h.087V1.177h1.008V10h-.96V8.992h-.093c-.4.703-1.15%201.12-2.02%201.12zm.23-5.63c-1.15%200-1.845.89-1.845%202.365s.69%202.36%201.846%202.36c1.15%200%201.858-.9%201.858-2.36%200-1.447-.715-2.362-1.857-2.362zm7.876-3.114h1.024V4.49q.346-.45.827-.69.48-.239%201.043-.237%201.172.001%201.9.806c.49.536.73%201.33.73%202.375q0%201.489-.72%202.473t-1.997.984q-.715%200-1.207-.344-.293-.206-.627-.657v.8h-.97V1.364zm4.02%207.225q.426-.679.426-1.793%200-.99-.425-1.64t-1.25-.65q-.719%200-1.264.532-.541.532-.542%201.757.001.885.224%201.435.416%201.04%201.553%201.04.856%200%201.28-.68zM63.4%203.727h1.167q-.222.603-.99%202.754a145%20145%200%200%201-.96%202.635q-.915%202.402-1.29%202.93-.375.526-1.29.527-.221%200-.342-.017a3%203%200%200%201-.296-.065v-.96q.273.074.4.093.119.018.214.018.292%200%20.43-.093a.9.9%200%200%200%20.232-.237q.03-.05.21-.48.183-.436.264-.646l-2.32-6.457h1.196l1.68%205.11%201.694-5.11zm10.594%201.556V6.87h3.814c-.117.89-.416%201.54-.87%201.998-.557.555-1.427%201.16-2.944%201.16-2.35%200-4.184-1.882-4.184-4.217%200-2.33%201.835-4.214%204.184-4.214a4.07%204.07%200%200%201%202.873%201.135l1.122-1.116C77.04.697%2075.77%200%2073.99%200c-3.218%200-5.923%202.606-5.923%205.805%200%203.2%202.705%205.804%205.923%205.804%201.738%200%203.048-.57%204.073-1.63%201.05-1.044%201.382-2.52%201.382-3.71%200-.365-.028-.707-.087-.99h-5.37zm10.222-1.29c-2.082%200-3.78%201.574-3.78%203.748%200%202.154%201.698%203.747%203.78%203.747S87.998%209.9%2087.998%207.74c0-2.174-1.7-3.748-3.782-3.748zm0%206.018c-1.14%200-2.127-.935-2.127-2.27%200-1.348.982-2.27%202.123-2.27s2.128.922%202.128%202.27c0%201.335-.985%202.27-2.127%202.27zm18.54-5.18h-.06c-.37-.438-1.083-.838-1.985-.838-1.88%200-3.52%201.632-3.52%203.748%200%202.102%201.64%203.747%203.52%203.747.906%200%201.62-.4%201.99-.852h.06v.523c0%201.432-.774%202.2-2.013%202.2-1.012%200-1.64-.723-1.9-1.336l-1.44.593c.414.994%201.51%202.213%203.34%202.213%201.94%200%203.58-1.135%203.58-3.902v-6.74h-1.57v.645zm-1.9%205.18c-1.144%200-2.013-.968-2.013-2.27%200-1.323.87-2.27%202.01-2.27%201.13%200%202.012.967%202.012%202.282.006%201.31-.882%202.258-2.01%202.258zM92.65%203.992c-2.084%200-3.783%201.574-3.783%203.748%200%202.154%201.7%203.747%203.782%203.747%202.08%200%203.78-1.587%203.78-3.747%200-2.174-1.7-3.748-3.78-3.748zm0%206.018c-1.143%200-2.13-.935-2.13-2.27%200-1.348.987-2.27%202.13-2.27%201.14%200%202.126.922%202.126%202.27%200%201.335-.986%202.27-2.127%202.27zM105.622.155h1.628v11.332h-1.628m6.655-1.477c-.843%200-1.44-.38-1.83-1.135l5.04-2.07-.168-.426c-.315-.84-1.275-2.39-3.228-2.39-1.94%200-3.554%201.515-3.554%203.75%200%202.1%201.595%203.744%203.736%203.744%201.725%200%202.724-1.05%203.14-1.658l-1.285-.852c-.428.62-1.01%201.032-1.855%201.032zm-.117-4.612c.668%200%201.24.342%201.427.826l-3.405%201.4c0-1.574%201.122-2.226%201.978-2.226'%3e%3c/path%3e%3c/svg%3e",D=({value:h,onChange:u,onAddressSelect:l,label:b="Address",placeholder:n="Address",apiKey:C,region:v,schema:y,error:A,inputClass:g="w-full",autoComplete:T="shipping address-line1"})=>{const[f,S]=a.useState([]),[e,s]=a.useState(!1),[i,r]=a.useState(),d=a.useRef(null),m=a.useRef(null);a.useEffect(()=>{const c=p=>{m.current&&!m.current.contains(p.target)&&s(!1)};return document.addEventListener("mousedown",c),()=>{document.removeEventListener("mousedown",c)}},[]);const N=a.useCallback(async c=>{if(!c.trim()||!C){S([]),s(!1);return}try{const p=await P(c,C,v,i);S(p.suggestions),r(p.sessionToken),s(!0)}catch(p){console.error("Failed to fetch suggestions:",p),S([])}},[C,v,i]),o=a.useCallback(c=>{const p=c.target.value;u(p),d.current&&clearTimeout(d.current),d.current=setTimeout(()=>{N(p)},300)},[u,N]),w=a.useCallback(async(c,p)=>{p.preventDefault(),p.stopPropagation();try{const B=await j(c.place,v||"US");u(c.address),l&&l(B),s(!1),S([]),r(void 0)}catch(B){console.error("Failed to get address detail:",B),u(c.address),s(!1)}},[u,l,v]),L=a.useCallback(()=>{f.length>0?s(!0):h.trim()&&N(h)},[f.length,h,N]),I=a.useCallback(()=>{s(!1)},[]);return a.useEffect(()=>()=>{d.current&&clearTimeout(d.current)},[]),t.jsxs("div",{className:"relative",ref:m,id:"google-address-suggestion",children:[t.jsx(W,{label:b,placeholder:n,value:h,onChange:o,onFocus:L,inputClass:g,autoComplete:T,schema:y,error:A,...C&&{icon:t.jsxs("svg",{width:"20",height:"20",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:[t.jsx("circle",{cx:"11",cy:"11",r:"7"}),t.jsx("line",{x1:"16.5",y1:"16.5",x2:"21",y2:"21"})]})}}),e&&f.length>0&&t.jsx("div",{className:"absolute z-50 w-full mt-1 bg-white border border-[#e6e6e6] rounded-md shadow-lg max-h-80 overflow-y-auto",children:t.jsxs("ul",{className:"m-0 p-0 list-none",children:[t.jsxs("li",{className:"px-4 py-3 flex items-center justify-between ml-0",children:[t.jsx("span",{className:"text-[#212529A6] text-sm uppercase",children:"Suggestions"}),t.jsx("button",{type:"button",onClick:I,className:"bg-transparent border-none outline-none text-gray-400 hover:text-gray-600 focus:outline-none","aria-label":"Close suggestions",children:t.jsxs("svg",{width:"16",height:"16",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:[t.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),t.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),f.map(c=>t.jsx("li",{className:"px-4 py-2 hover:bg-gray-100 cursor-pointer transition-colors text-[#212529A6]",onClick:p=>w(c,p),children:c.address},c.id)),t.jsx("li",{className:"px-4 py-2 border-t border-[#e6e6e6] bg-[#f8f9fa] ml-0",children:t.jsx("div",{className:"flex items-center",children:t.jsx("img",{src:q,alt:"Powered by Google",className:"h-5 w-[8rem] fill-[#6c757d] text-md"})})})]})})]})};D.__docgenInfo={description:"",methods:[],displayName:"GoogleSuggestionInput",props:{apiKey:{required:!0,tsType:{name:"string"},description:""},value:{required:!0,tsType:{name:"string"},description:""},onChange:{required:!0,tsType:{name:"signature",type:"function",raw:"(value: string) => void",signature:{arguments:[{type:{name:"string"},name:"value"}],return:{name:"void"}}},description:""},onAddressSelect:{required:!1,tsType:{name:"signature",type:"function",raw:"(addressData: DeliveryAddress) => void",signature:{arguments:[{type:{name:"z.infer",elements:[{name:"AddressSchema"}],raw:"z.infer<typeof AddressSchema>"},name:"addressData"}],return:{name:"void"}}},description:""},label:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'"Address"',computed:!1}},placeholder:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'"Address"',computed:!1}},region:{required:!1,tsType:{name:"string"},description:""},schema:{required:!1,tsType:{name:"z.ZodSchema",elements:[{name:"string"}],raw:"z.ZodSchema<string>"},description:""},error:{required:!1,tsType:{name:"string"},description:""},inputClass:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'"w-full"',computed:!1}},autoComplete:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'"shipping address-line1"',computed:!1}}}};const E={US:{name:"United States",state:{AL:"Alabama",AK:"Alaska",AS:"American Samoa",AZ:"Arizona",AR:"Arkansas",CA:"California",CO:"Colorado",CT:"Connecticut",DE:"Delaware",DC:"District of Columbia",FM:"Federated States of Micronesia",FL:"Florida",GA:"Georgia",GU:"Guam",HI:"Hawaii",ID:"Idaho",IL:"Illinois",IN:"Indiana",IA:"Iowa",KS:"Kansas",KY:"Kentucky",LA:"Louisiana",ME:"Maine",MH:"Marshall Islands",MD:"Maryland",MA:"Massachusetts",MI:"Michigan",MN:"Minnesota",MS:"Mississippi",MO:"Missouri",MT:"Montana",NE:"Nebraska",NV:"Nevada",NH:"New Hampshire",NJ:"New Jersey",NM:"New Mexico",NY:"New York",NC:"North Carolina",ND:"North Dakota",MP:"Northern Mariana Islands",OH:"Ohio",OK:"Oklahoma",OR:"Oregon",PW:"Palau",PA:"Pennsylvania",PR:"Puerto Rico",RI:"Rhode Island",SC:"South Carolina",SD:"South Dakota",TN:"Tennessee",TX:"Texas",UT:"Utah",VT:"Vermont",VI:"Virgin Islands",VA:"Virginia",WA:"Washington",WV:"West Virginia",WI:"Wisconsin",WY:"Wyoming",AA:"Armed Forces Americas",AE:"Armed Forces Europe",AP:"Armed Forces Pacific"}},AU:{name:"Australia",state:{ACT:"Australian Capital Territory",NSW:"New South Wales",NT:"Northern Territory",QLD:"Queensland",SA:"South Australia",TAS:"Tasmania",VIC:"Victoria",WA:"Western Australia"}},CA:{name:"Canada",state:{AB:"Alberta",BC:"British Columbia",MB:"Manitoba",NB:"New Brunswick",NL:"Newfoundland and Labrador",NT:"Northwest Territories",NS:"Nova Scotia",NU:"Nunavut",ON:"Ontario",PE:"Prince Edward Island",QC:"Quebec",SK:"Saskatchewan",YT:"Yukon"}},NZ:{name:"New Zealand",state:{AUK:"Auckland",BOP:"Bay of Plenty",CAN:"Canterbury",CIT:"Chatham Islands",GIS:"Gisborne",HKB:"Hawke’s Bay",MWT:"Manawatū-Whanganui",MBH:"Marlborough",NSN:"Nelson",NTL:"Northland",OTA:"Otago",STL:"Southland",TKI:"Taranaki",TAS:"Tasman",WKO:"Waikato",WGN:"Wellington",WTC:"West Coast"}},GB:{name:"United Kingdom",state:{BD:"Barking and Dagenham",BE:"Barnet",BNS:"Barnsley",BNES:"Bath and North East Somerset",BDF:"Bedfordshire",BX:"Bexley",BIR:"Birmingham",BBD:"Blackburn with Darwen",BPL:"Blackpool",BOL:"Bolton",BMH:"Bournemouth",BRC:"Bracknell Forest",BRD:"Bradford",BEN:"Brent",BNH:"Brighton and Hove",BRY:"Bromley",BKM:"Buckinghamshire",BUR:"Bury",CLD:"Calderdale",CAM:"Cambridgeshire",CMD:"Camden",CHS:"Cheshire",BST:"City of Bristol",KHL:"City of Kingston upon Hull",LND:"City of London",CON:"Cornwall",COV:"Coventry",CRY:"Croydon",CMA:"Cumbria",DAL:"Darlington",DER:"Derby",DBY:"Derbyshire",DEV:"Devon",DNC:"Doncaster",DOR:"Dorset",DUD:"Dudley",DUR:"Durham",EAL:"Ealing",ERY:"East Riding of Yorkshire",ESX:"East Sussex",ENF:"Enfield",ESS:"Essex",GAT:"Gateshead",GLS:"Gloucestershire",GRE:"Greenwich",HCK:"Hackney",HAL:"Halton",HMF:"Hammersmith and Fulham",HAM:"Hampshire",HRY:"Haringey",HRW:"Harrow",HPL:"Hartlepool",HAV:"Havering",HEF:"Herefordshire",HRT:"Hertfordshire",HIL:"Hillingdon",HNS:"Hounslow",IOW:"Isle of Wight",ISL:"Islington",KEC:"Kensington and Chelsea",KEN:"Kent",KTT:"Kingston upon Thames",KIR:"Kirklees",KWL:"Knowsley",LBH:"Lambeth",LAN:"Lancashire",LDS:"Leeds",LCE:"Leicester",LEC:"Leicestershire",LEW:"Lewisham",LIN:"Lincolnshire",LIV:"Liverpool",LUT:"Luton",MAN:"Manchester",MDW:"Medway",MRT:"Merton",MDB:"Middlesbrough",MIK:"Milton Keynes",NET:"Newcastle upon Tyne",NWM:"Newham",NFK:"Norfolk",NEL:"North East Lincolnshire",NLN:"North Lincolnshire",NSM:"North Somerset",NTY:"North Tyneside",NYK:"North Yorkshire",NTH:"Northamptonshire",NBL:"Northumberland",NGM:"Nottingham",NTT:"Nottinghamshire",OLD:"Oldham",OXF:"Oxfordshire",PTE:"Peterborough",PLY:"Plymouth",POL:"Poole",POR:"Portsmouth",RDG:"Reading",RDB:"Redbridge",RCC:"Redcar and Cleveland",RIC:"Richmond upon Thames",RCH:"Rochdale",ROT:"Rotherham",RUT:"Rutland",SLF:"Salford",SAW:"Sandwell",SFT:"Sefton",SHF:"Sheffield",SHR:"Shropshire",SLG:"Slough",SOL:"Solihull",SOM:"Somerset",SGC:"South Gloucestershire",STY:"South Tyneside",STH:"Southampton",SOS:"Southend-on-Sea",SWK:"Southwark",SHN:"St. Helens",STS:"Staffordshire",SKP:"Stockport",STT:"Stockton-on-Tees",STE:"Stoke-on-Trent",SFK:"Suffolk",SND:"Sunderland",SRY:"Surrey",SUT:"Sutton",SWD:"Swindon",TAM:"Tameside",TFW:"Telford and Wrekin",THR:"Thurrock",TOB:"Torbay",TWH:"Tower Hamlets",TRF:"Trafford",WKF:"Wakefield",WLL:"Walsall",WFT:"Waltham Forest",WND:"Wandsworth",WRT:"Warrington",WAR:"Warwickshire",WBK:"West Berkshire",WSX:"West Sussex",WSM:"Westminster",WGN:"Wigan",WIL:"Wiltshire",WNM:"Windsor and Maidenhead",WRL:"Wirral",WOK:"Wokingham",WLV:"Wolverhampton",WOR:"Worcestershire",YOR:"York"}}},k={US:x().trim().min(1,"Zip code is required").regex(/^\d{5}(-\d{4})?$/,"Invalid US ZIP code"),CA:x().trim().min(1,"Postal code is required").regex(/^[A-Z]\d[A-Z] \d[A-Z]\d$/,"Invalid CA postcode"),AU:x().trim().min(1,"Postcode is required").regex(/^\d{4}$/,"Invalid AU postcode"),NZ:x().trim().min(1,"Postal code is required").regex(/^\d{4}$/,"Invalid NZ postal code"),GB:x().trim().min(1,"Postcode is required").regex(/^[A-Z]{1,2}\d[A-Z\d]? \d[A-Z]{2}$/,"Invalid UK postcode")},H={US:{fields:[{key:"city",type:"input",label:"City",placeholder:"City",autoComplete:"shipping address-level2"},{key:"state",type:"select",label:"State",placeholder:"-- Select --",useStateOptions:!0,autoComplete:"shipping address-level1"},{key:"zipCode",type:"input",label:"Zip Code",placeholder:"Zip Code",autoComplete:"shipping postal-code",validation:k.US}],layout:[{row:["city"]},{row:["state","zipCode"]}]},CA:{fields:[{key:"city",type:"input",label:"City",placeholder:"City",autoComplete:"shipping address-level2"},{key:"state",type:"select",label:"Province",placeholder:"-- Select --",useStateOptions:!0,autoComplete:"shipping address-level1"},{key:"zipCode",type:"input",label:"Postcode",placeholder:"Postcode",autoComplete:"shipping postal-code",validation:k.CA}],layout:[{row:["city"]},{row:["state","zipCode"]}]},AU:{fields:[{key:"city",type:"input",label:"City",placeholder:"City",autoComplete:"shipping address-level2"},{key:"state",type:"select",label:"State / territory",placeholder:"-- Select --",useStateOptions:!0,autoComplete:"shipping address-level1"},{key:"zipCode",type:"input",label:"Postcode",placeholder:"Postcode",autoComplete:"shipping postal-code",validation:k.AU}],layout:[{row:["city"]},{row:["state","zipCode"]}]},NZ:{fields:[{key:"city",type:"input",label:"City",placeholder:"City",autoComplete:"shipping address-level2"},{key:"state",type:"select",label:"Region",placeholder:"-- Select --",useStateOptions:!0,autoComplete:"shipping address-level1"},{key:"zipCode",type:"input",label:"Postcode",placeholder:"Postcode",autoComplete:"shipping postal-code",validation:k.NZ}],layout:[{row:["city"]},{row:["state","zipCode"]}]},GB:{fields:[{key:"city",type:"input",label:"City",placeholder:"City",autoComplete:"shipping address-level2"},{key:"zipCode",type:"input",label:"Postcode",placeholder:"Postcode",autoComplete:"shipping postal-code",validation:k.GB}],layout:[{row:["city"]},{row:["zipCode"]}]}};function K(h){return H[h]||H.US}const V=({showTitle:h=!0})=>{const{deliveryAddress:u,updateDeliveryAddress:l,googleApiKey:b}=z(),{country:n,address:C,address2:v}=u,y=a.useMemo(()=>K(n||"US"),[n]),A=a.useMemo(()=>{const s=E[n||"US"];return Object.entries(s.state).map(([,i])=>({value:i,label:i}))},[n]),g=a.useMemo(()=>Object.entries(E).map(([e,s])=>({value:e,label:s.name})),[]),T=O.useRef(n);a.useEffect(()=>{n||l({country:"US"})},[n,l]),a.useEffect(()=>{const e=T.current,s=n||"US";e&&s&&e!==s&&l({city:"",state:"",zipCode:""}),T.current=s},[n,l]);const f=e=>{const s=u[e.key],i=e.key,r=e.validation||M.shape[i];return e.type==="select"&&e.useStateOptions?t.jsx(R,{label:e.label,placeholder:e.placeholder,value:s,onChange:d=>l({[i]:d}),options:A,autoComplete:e.autoComplete,schema:r},i):t.jsx(W,{label:e.label,placeholder:e.placeholder,value:s,onChange:d=>l({[i]:d.target.value}),inputClass:"w-full",autoComplete:e.autoComplete,schema:r},i)},S=()=>{const e=new Map(y.fields.map(r=>[r.key,r]));if(!y.layout||y.layout.length===0)return y.fields.map(r=>t.jsx("div",{className:"flex-1",children:f(r)},r.key));const s=new Set,i=[];return y.layout.forEach(r=>{const d=r.row.map(m=>e.get(m)).filter(Boolean);d.length>0&&i.push(t.jsx("div",{className:"flex flex-col md:flex-row gap-3",children:d.map(m=>(s.add(m.key),t.jsx("div",{className:"flex-1",children:f(m)},m.key)))},`row-${r.row.join("-")}`))}),y.fields.forEach(r=>{s.has(r.key)||i.push(t.jsx("div",{className:"flex-1",children:f(r)},r.key))}),i};return t.jsxs("div",{className:"w-full",children:[h&&t.jsx("div",{className:"text-lg md:text-2xl mb-5 font-medium",children:"Delivery Address"}),t.jsxs("div",{className:"flex flex-col gap-2 border border-solid border-[#e6e6e6] shadow-sm rounded-md p-4 bg-white",children:[t.jsx(R,{label:"Country",placeholder:"Country",value:n||"US",onChange:e=>l({country:e}),options:g,autoComplete:"shipping country",schema:M.shape.country}),t.jsx(D,{value:C,onChange:e=>l({address:e}),onAddressSelect:e=>{l({address:e.address,address2:e.address2||"",city:e.city||"",state:e.state||"",zipCode:e.zipCode||"",country:e.country||n||"US"})},apiKey:b||"",region:n,schema:M.shape.address,autoComplete:"shipping address-line1"}),t.jsx(W,{label:"Address Line 2",placeholder:"Address Line 2",value:v||"",onChange:e=>l({address2:e.target.value}),inputClass:"w-full",autoComplete:"shipping address-line2",schema:M.shape.address2}),S()]})]})};V.__docgenInfo={description:"",methods:[],displayName:"DeliveryAddress",props:{showTitle:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}}}};export{V as D};
@@ -1,9 +0,0 @@
1
- import{j as o}from"./jsx-runtime-DiklIkkE.js";import{D as c}from"./DeliveryAddress-DwuRB6NF.js";import{C as m,S as d,c as u,D as f}from"./useCheckoutContext-C6NRdjfK.js";import"./index-DRjF_FHU.js";import"./ValidateInput-Bw6PO7kr.js";u(f);const g=[{sku:"TEST001",offerPricePoint:d.SINGLE}],D={component:c,title:"Components/DeliveryAddress",parameters:{docs:{description:{component:"Delivery address form component for collecting shipping address information. Supports Google Places autocomplete when googleApiKey is provided. Requires CheckoutProvider wrapper."}}},decorators:[p=>o.jsx(m,{cart:g,googleApiKey:"AIzaSyCtZ0TqBCGRf1OtLwTmJANQ4_sOpTs5x1w",children:o.jsx(p,{})})],argTypes:{showTitle:{description:'Whether to display the title "Delivery Address"',control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showTitle:!0}},r={args:{showTitle:!1}};var s,t,a;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`{
2
- args: {
3
- showTitle: true
4
- }
5
- }`,...(a=(t=e.parameters)==null?void 0:t.docs)==null?void 0:a.source}}};var i,n,l;r.parameters={...r.parameters,docs:{...(i=r.parameters)==null?void 0:i.docs,source:{originalSource:`{
6
- args: {
7
- showTitle: false
8
- }
9
- }`,...(l=(n=r.parameters)==null?void 0:n.docs)==null?void 0:l.source}}};const P=["Default","WithoutTitle"];export{e as Default,r as WithoutTitle,P as __namedExportsOrder,D as default};
@@ -1,2 +0,0 @@
1
- const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./index-ChEI-nsM.js","./index-DRjF_FHU.js"])))=>i.map(i=>d[i]);
2
- import{_ as c}from"./iframe-BBMn-SiC.js";import{R as e,r as p}from"./index-DRjF_FHU.js";import{H as l,A as u,b as h,D as E}from"./index-2r-d8gn2.js";import{renderElement as d,unmountElement as x}from"./react-18-2zMCfgG4.js";import"./jsx-runtime-DiklIkkE.js";import"./index-B7ki2Uzk.js";import"./index-D-Mha1DF.js";import"./index-DrFu-skq.js";var D={code:h,a:u,...l},_=class extends p.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(t){let{showException:r}=this.props;r(t)}render(){let{hasError:t}=this.state,{children:r}=this.props;return t?null:e.createElement(e.Fragment,null,r)}},A=class{constructor(){this.render=async(t,r,n)=>{let s={...D,...r==null?void 0:r.components},a=E;return new Promise((m,i)=>{c(async()=>{const{MDXProvider:o}=await import("./index-ChEI-nsM.js");return{MDXProvider:o}},__vite__mapDeps([0,1]),import.meta.url).then(({MDXProvider:o})=>d(e.createElement(_,{showException:i,key:Math.random()},e.createElement(o,{components:s},e.createElement(a,{context:t,docsParameter:r}))),n)).then(()=>m())})},this.unmount=t=>{x(t)}}};export{A as DocsRenderer,D as defaultComponents};
@@ -1,107 +0,0 @@
1
- import{j as e}from"./jsx-runtime-DiklIkkE.js";import{useMDXComponents as r}from"./index-ChEI-nsM.js";import{M as c,C as t,a as d}from"./index-2r-d8gn2.js";import{Default as s}from"./PaymentMethods.stories-DNO6rqG3.js";import{D as a}from"./CustomCheckout.stories-D-tPjvHt.js";import"./index-DRjF_FHU.js";import"./iframe-BBMn-SiC.js";import"./index-B7ki2Uzk.js";import"./index-D-Mha1DF.js";import"./index-DrFu-skq.js";import"./PaymentMethods-B6OrSp4J.js";import"./useCheckoutContext-C6NRdjfK.js";/* empty css */import"./CheckoutPage-_q0L2I48.js";import"./CustomerInfo-BABvZLYn.js";import"./ValidateInput-Bw6PO7kr.js";import"./DeliveryAddress-DwuRB6NF.js";function i(o){const n={a:"a",blockquote:"blockquote",code:"code",h1:"h1",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...r(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(c,{title:"Documentation/Guide"}),`
2
- `,e.jsx(n.h1,{id:"getting-started-guide",children:"Getting Started Guide"}),`
3
- `,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"@clickaroo/checkout-ui"})," is a comprehensive checkout page component library designed for React applications, providing a complete checkout flow solution. The library includes core features such as customer information collection, delivery address management, payment method selection, and integrates seamlessly with payment systems."]}),`
4
- `,e.jsx(n.p,{children:"This guide will walk you through different ways to integrate the checkout components into your React application, from the simplest all-in-one solution to fully customized implementations."}),`
5
- `,e.jsxs(n.blockquote,{children:[`
6
- `,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Note"}),": If you're new to this library, we recommend starting with the ",e.jsx(n.a,{href:"./?path=/docs/documentation-quickstart--docs",children:"Quick Start Guide"})," which covers installation, basic usage with ",e.jsx(n.code,{children:"CheckoutPage"}),", and event callbacks."]}),`
7
- `]}),`
8
- `,e.jsx(n.h3,{id:"quick-integration-with-checkoutpage",children:"Quick Integration with CheckoutPage"}),`
9
- `,e.jsxs(n.p,{children:["The simplest way to integrate is using the ",e.jsx(n.code,{children:"CheckoutPage"})," component, which includes the complete checkout flow. With this single component, you can quickly integrate a full-featured checkout experience."]}),`
10
- `,e.jsxs(n.p,{children:["👉 See the ",e.jsx(n.a,{href:"./?path=/docs/documentation-quickstart--docs#use-checkout-all-in-one",children:"Use Checkout All in One"})," section in the Quick Start Guide for detailed instructions and examples."]}),`
11
- `,e.jsx(n.h3,{id:"payment-only-integration",children:"Payment-Only Integration"}),`
12
- `,e.jsxs(n.p,{children:["If you only need payment functionality and have already collected customer and address information elsewhere in your application, you can use the ",e.jsx(n.code,{children:"PaymentMethods"})," component independently."]}),`
13
- `,e.jsx(t,{of:s}),`
14
- `,e.jsx(n.h4,{id:"props",children:"Props"}),`
15
- `,e.jsx(d,{of:s}),`
16
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { CheckoutProvider, PaymentMethods } from '@clickaroo/checkout-ui';
17
-
18
- function PaymentOnly() {
19
- const cart = [
20
- {
21
- sku: "TEST001",
22
- offerPricePoint: "OPP-TEST001",
23
- },
24
- {
25
- sku: "TEST002",
26
- offerPricePoint: "OPP-TEST002",
27
- },
28
- ];
29
-
30
- return (
31
- <CheckoutProvider cart={cart}>
32
- <PaymentMethods />
33
- </CheckoutProvider>
34
- );
35
- }
36
- `})}),`
37
- `,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Important Notes:"}),`
38
- The `,e.jsx(n.code,{children:"PaymentMethods"})," component must be wrapped in a ",e.jsx(n.code,{children:"CheckoutProvider"}),". See ",e.jsx(n.a,{href:"./?path=/docs/components-customcheckout--customcheckout-english#using-checkoutprovider",children:"CheckoutProvider Props"})," for all available configuration options."]}),`
39
- `,e.jsx(n.p,{children:"To complete the full payment flow (including order submission), you'll need to use the APIs and hooks provided by the library:"}),`
40
- `,e.jsxs(n.ol,{children:[`
41
- `,e.jsxs(n.li,{children:["Update customer and address information using ",e.jsx(n.code,{children:"updateCustomerInfo"})," and ",e.jsx(n.code,{children:"updateDeliveryAddress"})," from ",e.jsx(n.code,{children:"useCheckoutContext"})," hook"]}),`
42
- `,e.jsxs(n.li,{children:["Use the ",e.jsx(n.code,{children:"useOrderSubmission"})," hook to handle order submission"]}),`
43
- `,e.jsxs(n.li,{children:["Create a custom submit button that calls ",e.jsx(n.code,{children:"submitOrder()"})," from the ",e.jsx(n.code,{children:"useOrderSubmission"})," hook when clicked"]}),`
44
- `]}),`
45
- `,e.jsxs(n.p,{children:["For a complete implementation example, see the ",e.jsx(n.a,{href:"./?path=/docs/documentation-apis--docs",children:"APIs documentation"})," section on ",e.jsx(n.code,{children:"useOrderSubmission"}),"."]}),`
46
- `,e.jsx(n.h3,{id:"custom-checkout",children:"Custom Checkout"}),`
47
- `,e.jsx(n.p,{children:"You can build a custom checkout page by mixing and matching the library's built-in components with your own custom components. This gives you full control over the layout, styling, and user experience while leveraging the library's functionality."}),`
48
- `,e.jsx(t,{of:a}),`
49
- `,e.jsxs(n.p,{children:["You can replace some built-in components with your own custom implementations, but ",e.jsxs(n.strong,{children:[e.jsx(n.code,{children:"PaymentMethods"})," must always be used from the library"]})," as it contains critical payment logic that cannot be customized."]}),`
50
- `,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import {
51
- CheckoutProvider,
52
- PaymentMethods,
53
- useCheckoutContext,
54
- useOrderSubmission
55
- } from '@clickaroo/checkout-ui';
56
-
57
- function CustomCheckout() {
58
- const cart = [{ sku: "TEST001", offerPricePoint: "OPP-TEST001" }];
59
-
60
- return (
61
- // All components must be wrapped in CheckoutProvider
62
- <CheckoutProvider cart={cart}>
63
- <MyCustomCustomerInfo />
64
- <MyCustomDeliveryAddress />
65
- <PaymentMethods /> {/* Required - cannot be customized */}
66
- <MyCustomSubmitButton />
67
- </CheckoutProvider>
68
- );
69
- }
70
-
71
- // Use hooks to build custom components
72
- function MyCustomCustomerInfo() {
73
- const { customerInfo, updateCustomerInfo } = useCheckoutContext();
74
- // use hook to update form data
75
- updateCustomerInfo({ firstName: 'xxx', lastName: 'xxx', ...})
76
- }
77
-
78
- function MyCustomDeliveryAddress() {
79
- const { deliveryAddress, updateDeliveryAddress } = useCheckoutContext();
80
- // Your custom form implementation
81
- }
82
-
83
- function MyCustomSubmitButton() {
84
- const { isFormValid } = useCheckoutContext();
85
- // use hook to handle order submission
86
- const { isSubmitting, submitOrder } = useOrderSubmission();
87
- // Your custom button implementation
88
- }
89
- `})}),`
90
- `,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Important Notes:"})," All components must be wrapped in CheckoutProvider. See ",e.jsx(n.a,{href:"./?path=/docs/components-customcheckout--customcheckout-english#using-checkoutprovider",children:"CheckoutProvider Props"})," for all available configuration options."]}),`
91
- `,e.jsxs(n.p,{children:["For a complete implementation example, see the ",e.jsx(n.a,{href:"./?path=/docs/components-customcheckout--customcheckout-english",children:"CustomCheckout documentation"}),"."]}),`
92
- `,e.jsx(n.h3,{id:"apis-and-hooks",children:"APIs and Hooks"}),`
93
- `,e.jsx(n.p,{children:"As mentioned above, the component library provides HTTP APIs and React Hooks for more granular control and advanced use cases."}),`
94
- `,e.jsx(n.h4,{id:"http-apis",children:"HTTP APIs"}),`
95
- `,e.jsxs(n.ul,{children:[`
96
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:e.jsx(n.code,{children:"getPricePointInfo"})})," - Get price point information (supports single or multiple price points)"]}),`
97
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:e.jsx(n.code,{children:"createOrder"})})," - Create an order with the provided order data"]}),`
98
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:e.jsx(n.code,{children:"getOrderDetail"})})," - Get detailed information about an order by order code"]}),`
99
- `]}),`
100
- `,e.jsx(n.h4,{id:"react-hooks",children:"React Hooks"}),`
101
- `,e.jsxs(n.ul,{children:[`
102
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:e.jsx(n.code,{children:"useCheckoutContext"})})," - Access checkout state and update functions (customer info, delivery address, form validation)"]}),`
103
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:e.jsx(n.code,{children:"useOrderSubmission"})})," - Handle order submission with loading states and error handling"]}),`
104
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:e.jsx(n.code,{children:"useOrderDetail"})})," - Fetch order details"]}),`
105
- `,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:e.jsx(n.code,{children:"usePricePointInfo"})})," - Get price point information"]}),`
106
- `]}),`
107
- `,e.jsxs(n.p,{children:["For detailed API documentation and hook usage examples, see the ",e.jsx(n.a,{href:"./?path=/docs/documentation-apis--docs",children:"APIs Documentation"}),"."]})]})}function I(o={}){const{wrapper:n}={...r(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(i,{...o})}):i(o)}export{I as default};