@skhemata/skhemata-crowdfunding-campaign/dist/src/contribution/SkhemataFormStripe.js

Skhemata Crowdfunding Campaign Web Component. This web component provides crowdfunding campaign functionality (reward/donation based) for a website.

import { __decorate } from "tslib";
/* eslint-disable import/no-extraneous-dependencies */
import '@power-elements/stripe-elements';
import { html, css, LitElement } from 'lit';
import { property } from 'lit/decorators.js';
import { Bulma } from '@skhemata/skhemata-css';
import { ifDefined } from 'lit/directives/if-defined.js';
export class SkhemataFormStripe extends LitElement {
    constructor() {
        super(...arguments);
        this.unsupported = false;
        this.publishableKey = '';
        this.submitDisabled = false;
        this.clientSecret = '';
        this.contributionSk = '';
        this.contributionId = '';
        this.confirmInfo = {};
        // onChange(e: any) {
        //   this.submitDisabled = !(e.target.complete && !e.target.hasError);
        // }
        // onClick() {
        //   const stripe: any = this.shadowRoot?.querySelector('stripe-elements');
        //   stripe.submit();
        // }
        // onError(e: any) {
        //   this.error = e.target.error;
        // }
        // onFail(event: { detail: any }) {
        //   this.output = event.detail;
        // }
        // onReady() {
        //   this.unsupported = false;
        // }
        // onSuccess(event: { detail: any }) {
        //   this.output = event.detail;
        // }
        // onUnsupported() {
        //   this.unsupported = true;
        // }
    }
    // onChange(e: any) {
    //   this.submitDisabled = !(e.target.complete && !e.target.hasError);
    // }
    // onClick() {
    //   const stripe: any = this.shadowRoot?.querySelector('stripe-elements');
    //   stripe?.createSource();
    //   const stripeRequest: any = this.shadowRoot?.querySelector(
    //     'stripe-payment-request'
    //   );
    //   stripeRequest?.createPaymentMethod({
    //     type: 'card',
    //     card: {
    //       number: '4242424242424242',
    //       exp_month: 12,
    //       exp_year: 2023,
    //       cvc: '123',
    //     },
    //   });
    // }
    onSource(e) {
        this.source = e.detail.source;
    }
    // onError(e: any) {
    //   this.error = e.target.error;
    // }
    async firstUpdated() {
        var _a, _b;
        // change to Stripe object ????
        this.stripeElements = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('stripe-elements');
        this.stripePaymentRequest = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('stripe-payment-request');
    }
    render() {
        console.log('same key but here: ', this.publishableKey);
        return html `
    <div class="field">
      <label class="label"></label>
      <div class="control">

        <stripe-elements     
          hide-postal-code = "true"  
          publishable-key="${ifDefined(this.publishableKey)}"
        ></stripe-elements>

      </div>
    </div>
  </div>
    `;
    }
}
SkhemataFormStripe.styles = [
    Bulma,
    css `
      stripe-elements {
        --stripe-elements-base-line-height: 1.57rem;
        --stripe-elements-border: 1px solid #dbdbdb;
      }
    `,
];
__decorate([
    property({ type: Object })
], SkhemataFormStripe.prototype, "error", void 0);
__decorate([
    property({ type: Object })
], SkhemataFormStripe.prototype, "output", void 0);
__decorate([
    property({ type: Boolean })
], SkhemataFormStripe.prototype, "unsupported", void 0);
__decorate([
    property({ type: String, attribute: 'publishable-key' })
], SkhemataFormStripe.prototype, "publishableKey", void 0);
__decorate([
    property({ type: Boolean })
], SkhemataFormStripe.prototype, "submitDisabled", void 0);
__decorate([
    property({ type: Object })
], SkhemataFormStripe.prototype, "source", void 0);
__decorate([
    property({ type: String, attribute: 'secret-key' })
], SkhemataFormStripe.prototype, "clientSecret", void 0);
__decorate([
    property({ type: String, attribute: 'contributionSk' })
], SkhemataFormStripe.prototype, "contributionSk", void 0);
__decorate([
    property({ type: String, attribute: 'contributionId' })
], SkhemataFormStripe.prototype, "contributionId", void 0);
__decorate([
    property({ type: Object })
], SkhemataFormStripe.prototype, "confirmInfo", void 0);
__decorate([
    property({ type: Object })
], SkhemataFormStripe.prototype, "stripeElements", void 0);
__decorate([
    property({ type: Object })
], SkhemataFormStripe.prototype, "stripePaymentRequest", void 0);
//# sourceMappingURL=SkhemataFormStripe.js.map