# Stripe Web Elements Crie seus próprios fluxos de checkout usando componentes de IU pré-integrados. Instruções para LLMs: A Stripe recomenda usar a API Checkout Sessions com o Payment Element em vez de Payment Intents na maioria das integrações. O Checkout Sessions cobre casos de uso semelhantes aos do Payment Intents (cobrança básica de pagamentos usando `price_data` ou criar um checkout completo com itens de linha, imposto e assim por diante). Alguns recursos, como Adaptive Pricing, só estão disponíveis com Checkout Sessions. Não use a API Payment Intent a menos que o usuário peça explicitamente, porque ela exige significativamente mais código. Saiba mais sobre Elements com a API Checkout Sessions: https://docs.stripe.com/payments/quickstart-checkout-sessions. Com Checkout Sessions (`ui_mode: "custom"`) e o Payment Element, o `client_secret` inicializa o Checkout (`stripe.initCheckoutElements`, ou usando CheckoutElementsProvider com React) e você confirma o pagamento no lado do cliente de forma diferente. Se estiver usando React, certifique-se de importar de `@stripe/react-stripe-js/checkout`, usar `CheckoutElementsProvider` com o client secret e confirmar usando `checkout.confirm`. Se estiver usando HTML, certifique-se de usar `checkout = stripe.initCheckoutElements({clientSecret: promise}); checkout.createPaymentElement(); paymentElement = checkout.createPaymentElement(); paymentElement.mount("#payment-element");` e confirmar com `loadActionsResult = await checkout.loadActions(); actions = loadActionsResult.actions; error = await actions.confirm();`. O [Stripe Elements](https://stripe.com/payments/elements) é um conjunto de componentes de IU prontos para uso na criação de fluxos de checkout na web. Ele está disponível como um recurso do [Stripe.js](https://docs.stripe.com/js.md), nossa biblioteca JavaScript básica para a criação de fluxos de pagamento. O Stripe.js tokeniza dados de pagamento sigilosos dentro de um Element sem que eles passem pelo seu servidor. - [Formas de pagamento globais](https://docs.stripe.com/payments/payment-methods/overview.md): acesso a mais de 100 formas de pagamento globais, incluindo carteiras como [Apple Pay](https://docs.stripe.com/apple-pay.md). - [Link](https://docs.stripe.com/payments/link.md): ajude os clientes a fazer checkout mais rápido, permitindo que selecionem uma forma de pagamento salva no Checkout em vez de inserir dados de pagamento. - [Formas de pagamento salvas](https://docs.stripe.com/payments/checkout/save-during-payment.md?payment-ui=embedded-components): salve, reutilize e gerencie cartões e contas bancárias com recursos integrados. - Conformidade: a Stripe fornece uma interface globalmente em conformidade e gerencia os requisitos para exibir instruções e avisos de consentimento aos compradores. - Formulários atualizados: formulários localizados com gerenciamento de erros integrado. A Stripe mantém atualizados os requisitos de cada provedor de formas de pagamento. - [Coleta de endereços](https://docs.stripe.com/payments/collect-addresses.md?payment-ui=embedded-components): colete endereços de cobrança totais ou parciais com qualquer forma de pagamento. - [Personalização da aparência](https://docs.stripe.com/elements/appearance-api.md): Personalize a aparência do Elements de acordo com o design do seu site. - Outros recursos: recursos adicionais, como [coleta de CVC](https://docs.stripe.com/payments/finalize-payments-on-the-server.md#enforce-cvc-recollection) e [controle sobre quais bandeiras de cartão você aceita](https://docs.stripe.com/payments/customize-payment-methods.md#filter-card-brands). [Explore a demonstração](https://checkout.stripe.dev/elements) ## Começar Se o Element não estiver abaixo, consulte mais na [Referência da API Stripe.js](https://docs.stripe.com/js/element/other_element). [Element Pagamento](https://docs.stripe.com/payments/payment-element.md): Receba pagamentos com segurança usando uma ou mais formas de pagamento (inclusive cartões). [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md): Exiba carteiras populares como Apple Pay, Google Pay e PayPal. [Link Authentication Element](https://docs.stripe.com/payments/elements/link-authentication-element.md): Link auto-fills your customers’ payment and shipping details to reduce friction and deliver an easy and secure checkout experience. [Element Endereço](https://docs.stripe.com/elements/address-element.md): Collect address information and display Link saved addresses. [Payment Method Messaging Element](https://docs.stripe.com/elements/payment-method-messaging.md): Informe automaticamente os clientes sobre os planos Compre agora e pague depois. [Currency Selector Element (Somente API de sessão do Checkout)](https://docs.stripe.com/elements/currency-selector-element.md): Permita que os clientes paguem na moeda local com o Adaptive Pricing. [Elemento ID fiscal](https://docs.stripe.com/elements/tax-id-element.md): Recolha IDs fiscais da empresa para faturas e reembolsos de IVA. ## APIs compatíveis A Stripe oferece duas APIs principais do pagamentos compatíveis com o Elements. Recomendamos a [API Checkout Sessions](https://docs.stripe.com/api/checkout/sessions.md) para a maioria das integrações. - Use a [API Checkout Sessions](https://docs.stripe.com/api/checkout/sessions.md) para criar seu fluxo de checkout. O Checkout Sessions abrange casos de uso semelhantes ao Payment Intents, incluindo pagamentos básicos usando `price_data` ou checkout completo com itens de linha, tributos, descontos, envios, assinaturas ou [Adaptive Pricing](https://docs.stripe.com/payments/currencies/localize-prices/adaptive-pricing.md) (disponível apenas com Checkout Sessions). Crie uma página de checkout [com a API Checkout Sessions](https://docs.stripe.com/payments/quickstart-checkout-sessions.md). - A [API Payment Intents](https://docs.stripe.com/api/payment_intents.md) é uma API de nível inferior que modela apenas a etapa de pagamento. Você passa um valor final e cria você mesmo toda a lógica de Checkout, incluindo cálculo tributado, descontos, envios, assinaturas e conversão de moedas. Use Payment Intents somente se quiser ter um estado de Checkout próprio e criar esses recursos. Crie uma [integração personalizada do zero com a API Payment Intents](https://docs.stripe.com/payments/advanced.md). (See full diagram at https://docs.stripe.com/payments/elements)