{"version":3,"file":"index.mjs","sources":["../../src/react/context/InflowPayContext.tsx","../../src/react/components/CardElement.tsx"],"sourcesContent":["/**\n * InflowPay React Context\n * Provides InflowPay instance to child components\n */\n\nimport React, { createContext, useContext, useMemo, ReactNode } from 'react';\nimport { PaymentSDK } from '../../core/payment-sdk';\nimport type { SDKConfig } from '../../types';\n\ninterface InflowPayContextValue {\n  inflow: PaymentSDK;\n}\n\nexport const InflowPayContext = createContext<InflowPayContextValue | null>(null);\n\nexport interface InflowPayProviderProps {\n  /** InflowPay configuration */\n  config: SDKConfig;\n  /** Child components */\n  children: ReactNode;\n}\n\n/**\n * InflowPay Provider Component\n * \n * Wraps your app and provides InflowPay instance to child components\n * \n * @example\n * ```tsx\n * <InflowPayProvider config={{ apiKey: 'inflow_pub_xxx' }}>\n *   <App />\n * </InflowPayProvider>\n * ```\n */\nexport function InflowPayProvider({ config, children }: InflowPayProviderProps) {\n  const inflow = useMemo(() => {\n    return new PaymentSDK(config);\n  }, [config.apiKey, config.timeout, config.debug]);\n\n  const value = useMemo(() => ({ inflow }), [inflow]);\n\n  return (\n    <InflowPayContext.Provider value={value}>\n      {children}\n    </InflowPayContext.Provider>\n  );\n}\n\n/**\n * Hook to access InflowPay instance from context\n * \n * @throws {Error} If used outside InflowPayProvider\n * \n * @example\n * ```tsx\n * const inflow = useInflowPay();\n * ```\n */\nexport function useInflowPay(): PaymentSDK {\n  const context = useContext(InflowPayContext);\n  \n  if (!context) {\n    throw new Error(\n      'useInflowPay must be used within an InflowPayProvider. ' +\n      'Wrap your app with <InflowPayProvider> component.'\n    );\n  }\n\n  return context.inflow;\n}\n\n","/**\n * CardElement React Component\n * \n * React wrapper for the InflowPay CardElement\n */\n\nimport React, { useEffect, useRef, useImperativeHandle, forwardRef, useContext, useMemo } from 'react';\nimport { CardElement as CardElementClass } from '../../ui/card-element';\nimport { PaymentSDK } from '../../core/payment-sdk';\nimport { InflowPayContext } from '../context/InflowPayContext';\nimport type {\n  CardElementOptions,\n  PaymentResult,\n  SDKConfig,\n} from '../../types';\n\nexport interface CardElementProps\n  extends Omit<CardElementOptions, 'container'> {  // Only omit container!\n    \n  /** InflowPay config (required if not using InflowPayProvider) */\n  config?: SDKConfig;\n\n  /** Callback when the card element is mounted and ready */\n  onReady?: () => void;\n}\n\nexport interface CardElementRef {\n  /** Submit the payment */\n  submit: () => Promise<PaymentResult>;\n  /** Destroy the card element */\n  destroy: () => void;\n}\n\n/**\n * CardElement React Component\n * \n * A self-contained card payment form component.\n * \n * @example\n * ```tsx\n * // With InflowPayProvider\n * <InflowPayProvider config={{ apiKey: 'inflow_pub_xxx' }}>\n *   <CardElement \n *     paymentId=\"pay_123\"\n *     onReady={() => console.log('Card element is ready')}\n *     onComplete={(result) => console.log(result)}\n *   />\n * </InflowPayProvider>\n * \n * // Without provider (standalone)\n * <CardElement \n *   config={{ apiKey: 'inflow_pub_xxx' }}\n *   paymentId=\"pay_123\"\n *   onReady={() => console.log('Card element is ready')}\n *   onComplete={(result) => console.log(result)}\n * />\n * ```\n */\nexport const CardElement = forwardRef<CardElementRef, CardElementProps>(\n  function CardElement(\n    {\n      paymentId,\n      config,\n      onChange,\n      onComplete,\n      onError,\n      onReady,\n      buttonText,\n      buttonStyle,\n      style,\n      placeholders,\n    },\n    ref\n  ) {\n    const containerRef = useRef<HTMLDivElement>(null);\n    const cardElementRef = useRef<CardElementClass | null>(null);\n    \n    // Get InflowPay from context (if inside provider) - returns null if not in provider\n    const context = useContext(InflowPayContext);\n    const contextInflow = context?.inflow || null;\n\n    // Memoize InflowPay instance when config is provided (priority: config > context)\n    const inflow = useMemo(() => {\n      if (config) {\n        return new PaymentSDK(config);\n      }\n      return contextInflow;\n    }, [config?.apiKey, config?.timeout, config?.debug, contextInflow]);\n\n    if (!inflow) {\n      throw new Error(\n        'CardElement requires either a `config` prop ' +\n        'or must be used within an InflowPayProvider'\n      );\n    }\n\n    // Mount and unmount CardElement\n    useEffect(() => {\n      if (!containerRef.current || !inflow) {\n        return;\n      }\n\n      // Create CardElement instance\n      cardElementRef.current = inflow.createCardElement({\n        container: containerRef.current,\n        paymentId,\n        buttonText,\n        buttonStyle,\n        style,\n        placeholders,\n        onChange: (state) => {\n          onChange?.(state);\n        },\n        onComplete: (result) => {\n          onComplete?.(result);\n        },\n        onError: (error) => {\n          onError?.(error);\n        },\n      });\n\n      // Mount the element\n      cardElementRef.current.mount();\n\n      // Call onReady callback after mount completes\n      onReady?.();\n\n      // Cleanup on unmount\n      return () => {\n        if (cardElementRef.current) {\n          cardElementRef.current.destroy();\n          cardElementRef.current = null;\n        }\n      };\n    }, [inflow, paymentId]);\n\n    // Expose methods via ref\n    useImperativeHandle(ref, () => ({\n      submit: async () => {\n        if (!cardElementRef.current) {\n          throw new Error('CardElement is not mounted');\n        }\n        return cardElementRef.current.submit();\n      },\n      destroy: () => {\n        if (cardElementRef.current) {\n          cardElementRef.current.destroy();\n          cardElementRef.current = null;\n        }\n      },\n    }), []);\n\n    return <div ref={containerRef} />;\n  }\n);\n\n"],"names":["InflowPayContext","createContext","InflowPayProvider","config","children","inflow","useMemo","PaymentSDK","value","React","useInflowPay","context","useContext","CardElement","forwardRef","paymentId","onChange","onComplete","onError","onReady","buttonText","buttonStyle","style","placeholders","ref","containerRef","useRef","cardElementRef","contextInflow","useEffect","state","result","error","useImperativeHandle"],"mappings":";;AAaO,MAAMA,IAAmBC,EAA4C,IAAI;AAqBzE,SAASC,EAAkB,EAAE,QAAAC,GAAQ,UAAAC,KAAoC;AAC9E,QAAMC,IAASC,EAAQ,MACd,IAAIC,EAAWJ,CAAM,GAC3B,CAACA,EAAO,QAAQA,EAAO,SAASA,EAAO,KAAK,CAAC,GAE1CK,IAAQF,EAAQ,OAAO,EAAE,QAAAD,MAAW,CAACA,CAAM,CAAC;AAElD,SACE,gBAAAI,EAAA,cAACT,EAAiB,UAAjB,EAA0B,OAAAQ,KACxBJ,CACH;AAEJ;AAYO,SAASM,IAA2B;AACzC,QAAMC,IAAUC,EAAWZ,CAAgB;AAE3C,MAAI,CAACW;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAKJ,SAAOA,EAAQ;AACjB;ACXO,MAAME,IAAcC;AAAA,EACzB,SACE;AAAA,IACE,WAAAC;AAAA,IACA,QAAAZ;AAAA,IACA,UAAAa;AAAA,IACA,YAAAC;AAAA,IACA,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,YAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,cAAAC;AAAA,EAAA,GAEFC,GACA;AACA,UAAMC,IAAeC,EAAuB,IAAI,GAC1CC,IAAiBD,EAAgC,IAAI,GAIrDE,IADUhB,EAAWZ,CAAgB,GACZ,UAAU,MAGnCK,IAASC,EAAQ,MACjBH,IACK,IAAII,EAAWJ,CAAM,IAEvByB,GACN,CAACzB,GAAQ,QAAQA,GAAQ,SAASA,GAAQ,OAAOyB,CAAa,CAAC;AAElE,QAAI,CAACvB;AACH,YAAM,IAAI;AAAA,QACR;AAAA,MAAA;AAMJ,WAAAwB,EAAU,MAAM;AACd,UAAI,GAACJ,EAAa,WAAW,CAACpB;AAK9B,eAAAsB,EAAe,UAAUtB,EAAO,kBAAkB;AAAA,UAChD,WAAWoB,EAAa;AAAA,UACxB,WAAAV;AAAA,UACA,YAAAK;AAAA,UACA,aAAAC;AAAA,UACA,OAAAC;AAAA,UACA,cAAAC;AAAA,UACA,UAAU,CAACO,MAAU;AACnB,YAAAd,IAAWc,CAAK;AAAA,UAClB;AAAA,UACA,YAAY,CAACC,MAAW;AACtB,YAAAd,IAAac,CAAM;AAAA,UACrB;AAAA,UACA,SAAS,CAACC,MAAU;AAClB,YAAAd,IAAUc,CAAK;AAAA,UACjB;AAAA,QAAA,CACD,GAGDL,EAAe,QAAQ,MAAA,GAGvBR,IAAA,GAGO,MAAM;AACX,UAAIQ,EAAe,YACjBA,EAAe,QAAQ,QAAA,GACvBA,EAAe,UAAU;AAAA,QAE7B;AAAA,IACF,GAAG,CAACtB,GAAQU,CAAS,CAAC,GAGtBkB,EAAoBT,GAAK,OAAO;AAAA,MAC9B,QAAQ,YAAY;AAClB,YAAI,CAACG,EAAe;AAClB,gBAAM,IAAI,MAAM,4BAA4B;AAE9C,eAAOA,EAAe,QAAQ,OAAA;AAAA,MAChC;AAAA,MACA,SAAS,MAAM;AACb,QAAIA,EAAe,YACjBA,EAAe,QAAQ,QAAA,GACvBA,EAAe,UAAU;AAAA,MAE7B;AAAA,IAAA,IACE,CAAA,CAAE,GAEC,gBAAAlB,EAAA,cAAC,OAAA,EAAI,KAAKgB,EAAA,CAAc;AAAA,EACjC;AACF;"}