> ## Documentation Index
> Fetch the complete documentation index at: https://docs.jelou.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Uso y configuración

> Agrega el nodo de Payphone a tu flujo en Canvas y configura sus inputs y outputs.

Una vez conectada la integración en Marketplace con el **Token de acceso**, el **Store ID**, el **IVA** y la **Moneda**, el nodo de **Payphone** queda disponible en tu workspace para usarlo dentro de tus flujos en Canvas.

***

## Agregar el nodo al Canvas

<Steps>
  <Step title="Ubicar la integración en Marketplace">
    En el panel lateral izquierdo de Brain Studio, abre la carpeta **Marketplace**.

    Si la integración está correctamente conectada, verás **Payphone** listado como proveedor disponible.

    <Frame caption="Payphone disponible en el panel lateral de Marketplace">
      <img src="https://mintcdn.com/jelouai/N-faBULcr0WC2nPA/assets/images/integraciones/pagos/payphone-ambiente.png?fit=max&auto=format&n=N-faBULcr0WC2nPA&q=85&s=c3f184139f5b5ea2ed12341f9ad6d497" alt="Payphone visible en la carpeta Marketplace dentro del panel lateral de Brain Studio" width="944" height="480" data-path="assets/images/integraciones/pagos/payphone-ambiente.png" />
    </Frame>
  </Step>

  <Step title="Arrastrar el nodo al Canvas">
    Arrastra **Payphone** desde el panel lateral hacia tu flujo en el Canvas.

    Al soltarlo, se creará el bloque del nodo con sus salidas disponibles.
  </Step>

  <Step title="Abrir el panel de configuración">
    Selecciona el nodo en el Canvas para abrir su panel de configuración en el lado derecho.

    Desde ahí podrás completar los **inputs** y revisar las **salidas** disponibles.

    <Frame caption="Panel completo de configuración del nodo de Payphone en Brain Studio">
      <img src="https://mintcdn.com/jelouai/N-faBULcr0WC2nPA/assets/images/integraciones/pagos/payphone-configuracion-completa.png?fit=max&auto=format&n=N-faBULcr0WC2nPA&q=85&s=6e5fe489bc12b8f84ca3daa0beeb7cd4" alt="Panel lateral de configuración del nodo de Payphone mostrando todos los campos disponibles" width="970" height="1024" data-path="assets/images/integraciones/pagos/payphone-configuracion-completa.png" />
    </Frame>
  </Step>
</Steps>

***

## Configurar el nodo

<Tabs>
  <Tab title="Inputs">
    <AccordionGroup>
      <Accordion title="Guardar resultado como" icon="database">
        <ParamField body="Guardar resultado como" type="string">
          Define el nombre de la variable donde Brain Studio guardará el **JSON completo** de respuesta del nodo.

          <Tip>
            Útil si quieres usar la respuesta más adelante (logs, validaciones, trazabilidad o decisiones del flujo).
          </Tip>
        </ParamField>
      </Accordion>

      <Accordion title="Modalidad de cobro [cobro único por default]" icon="credit-card">
        <ParamField body="Modalidad de cobro [cobro único por default]" type="string" default="payment">
          Define la modalidad del cobro.

          Para esta integración, el valor por defecto es `payment`.
        </ParamField>
      </Accordion>

      <Accordion title="Ambiente" icon="server">
        <ParamField body="Ambiente" type="string" required>
          Define el entorno en el que se ejecutará el cobro.

          **Valores disponibles:** `DEV`, `PROD`
        </ParamField>

        <Warning>
          El valor configurado aquí debe coincidir con el entorno seleccionado en la aplicación dentro de **Payphone Developer**.

          Si configuras `DEV` en el nodo pero la aplicación está en producción, o viceversa, el flujo puede fallar o generar resultados inconsistentes.
        </Warning>
      </Accordion>

      <Accordion title="Expiración del botón de pagos [minutos]" icon="clock">
        <ParamField body="Expiración del botón de pagos [minutos]" type="number">
          Define la vigencia del botón de pago desde que se envía al usuario.

          **Valores disponibles:** `10`, `20`, `30`, `60`
        </ParamField>
      </Accordion>

      <Accordion title="Motivo de pago" icon="file-lines">
        <ParamField body="Motivo de pago" type="string" required>
          Texto descriptivo del cobro.

          Ejemplos:

          * número de orden
          * nombre del producto o servicio
          * referencia interna del pago
        </ParamField>
      </Accordion>

      <Accordion title="Monto sujeto a impuestos" icon="receipt">
        <ParamField body="Monto sujeto a impuestos" type="number" required>
          Ingresa el monto a cobrar que está sujeto a impuestos.

          Acepta valores numéricos en dólares, incluyendo decimales cuando corresponda.
        </ParamField>
      </Accordion>

      <Accordion title="Monto libre de impuestos" icon="dollar-sign">
        <ParamField body="Monto libre de impuestos" type="number" required>
          Ingresa el monto a cobrar que está libre de impuestos.

          Acepta valores numéricos en dólares, incluyendo decimales cuando corresponda.
        </ParamField>
      </Accordion>

      <Accordion title="Metadata del pago" icon="tag">
        <ParamField body="Metadata del pago" type="string">
          Información adicional para trazabilidad o referencia interna.

          <Info>
            Puedes usar este campo para correlacionar el pago con una orden, una cotización o una operación de conciliación.
          </Info>
        </ParamField>
      </Accordion>

      <Accordion title="Personalizar textos botón de pago" icon="message">
        <ParamField body="Personalizar textos botón de pago" type="boolean" default="false">
          Si seleccionas **Sí**, se habilitan campos adicionales para personalizar el mensaje que acompaña al botón de pago.

          **Campos que se habilitan al activar:**

          * `Header` (obligatorio)
          * `Body` (obligatorio)
          * `Footer` (obligatorio)
        </ParamField>

        <Info>
          Cuando esta opción está activa, puedes modificar completamente el mensaje que verá el usuario antes de abrir el checkout.
        </Info>
      </Accordion>

      <Accordion title="Header" icon="heading">
        <ParamField body="Header" type="string">
          Título del mensaje que acompaña al botón de pago.
        </ParamField>
      </Accordion>

      <Accordion title="Body" icon="align-left">
        <ParamField body="Body" type="string">
          Texto principal del mensaje que acompaña al botón de pago.
        </ParamField>
      </Accordion>

      <Accordion title="Footer" icon="minus">
        <ParamField body="Footer" type="string">
          Texto de cierre o aclaración del mensaje que acompaña al botón de pago.
        </ParamField>
      </Accordion>
    </AccordionGroup>
  </Tab>

  <Tab title="Outputs">
    <AccordionGroup>
      <Accordion title="Pago Exitoso" icon="circle-check">
        Se activa cuando Payphone confirma que la transacción fue procesada correctamente.

        Este es el punto oficial de confirmación del pago dentro del flujo.

        Ejemplos de uso:

        * emitir factura
        * activar una suscripción
        * liberar un producto o servicio
        * actualizar el estado de una orden en un sistema externo
      </Accordion>

      <Accordion title="Pago Fallido" icon="circle-xmark">
        Se activa cuando la transacción fue rechazada o declinada.

        Recomendaciones:

        * informar al usuario
        * permitir un reintento
        * redirigir a otro medio de pago
      </Accordion>

      <Accordion title="Error Code" icon="bug">
        Se activa cuando Payphone devuelve un código de error interno durante la creación o el procesamiento del pago.
      </Accordion>

      <Accordion title="Error HTTP" icon="triangle-exclamation">
        Se activa cuando ocurre un error de comunicación con el proveedor, por ejemplo un timeout, un problema de red o una respuesta inválida.
      </Accordion>

      <Accordion title="Envío correcto de CTA" icon="paper-plane">
        Se activa cuando el botón de pago fue enviado correctamente en la conversación.

        Indica que el mensaje con el botón se desplegó exitosamente en WhatsApp. Desde esta salida puedes conectar un nodo de espera o un mensaje que indique al usuario que ya puede completar el pago.
      </Accordion>
    </AccordionGroup>
  </Tab>
</Tabs>

***

## Consideraciones importantes

<AccordionGroup>
  <Accordion title="El entorno del nodo debe coincidir con Payphone">
    Si configuras el nodo en `DEV`, la aplicación en **Payphone Developer** también debe estar en **Prueba**.

    Si configuras el nodo en `PROD`, la aplicación en **Payphone Developer** debe estar en **Producción**.
  </Accordion>

  <Accordion title="Manejo de pagos pendientes">
    Cuando un pago queda inicialmente pendiente, el agente informa ese estado al usuario mediante el mensaje correspondiente.

    Si luego Payphone actualiza el resultado, el flujo continúa por la salida final que corresponda:

    * **Pago Exitoso**
    * **Pago Fallido**

    <Info>
      El estado pendiente no se expone como una salida independiente del nodo.
    </Info>
  </Accordion>
</AccordionGroup>
