Skip to content

Commit

Permalink
feat: add submit method and generate attribute
Browse files Browse the repository at this point in the history
  • Loading branch information
@bennypowers
bennypowers committed Jan 20, 2020
1 parent 9639e10 commit b866405
Show file tree
Hide file tree
Showing 13 changed files with 985 additions and 436 deletions.
2 changes: 1 addition & 1 deletion .eslintrc.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"rules": {
"brace-style": ["error", "1tbs", { "allowSingleLine": true }],
"operator-linebreak": ["error", "after", { "overrides": { "?": "after", ":": "before" } }],
"indent": ["error", 2, { "flatTernaryExpressions": true }],
"indent": ["error", 2, { "flatTernaryExpressions": true, "SwitchCase": 1 }],
"no-only-tests/no-only-tests": "error"
},
"globals": {
Expand Down
55 changes: 29 additions & 26 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,32 +108,34 @@ There are 11 properties for each state that you can set which will be read into

#### Properties

| Property | Attribute | Modifiers | Type | Default | Description |
|---------------------|--------------------|-----------|-------------------------------|-----------|--------------------------------------------------|
| `action` | `action` | | `String` | | The URL to the form action. Example '/charges'.<br />If blank or undefined will not submit charges immediately. |
| `billingDetails` | | | `stripe.BillingDetails` | | billing_details object sent to create the payment representation. |
| `brand` | `brand` | readonly | `String` | null | The card brand detected by Stripe |
| `card` | `card` | readonly | `stripe.Element` | null | The Stripe card object. |
| `element` | `element` | readonly | `stripe.elements.Element` | null | Stripe element instance |
| `elements` | `elements` | readonly | `stripe.elements.Elements` | null | Stripe Elements instance |
| `error` | `error` | readonly | `Error\|stripe.Error` | null | Stripe or validation error |
| `hasError` | `has-error` | readonly | `Boolean` | false | Whether the element has an error |
| `hideIcon` | `hide-icon` | | `Boolean` | false | Whether to hide icons in the Stripe form. |
| `hidePostalCode` | `hide-postal-code` | | `Boolean` | false | Whether or not to hide the postal code field.<br />Useful when you gather shipping info elsewhere. |
| `iconStyle` | `icon-style` | | `'solid'\|'default'` | "default" | Stripe icon style. 'solid' or 'default'. |
| `isComplete` | `is-complete` | | `Boolean` | false | If the form is complete. |
| `isEmpty` | `is-empty` | | `Boolean` | true | If the form is empty. |
| `paymentMethodData` | | | `stripe.PaymentMethodData` | {} | Data passed to stripe.createPaymentMethod. (optional) |
| `publishableKey` | `publishable-key` | | `String` | | Stripe Publishable Key. EG. `pk_test_XXXXXXXXXXXXXXXXXXXXXXXX` |
| `showError` | `show-error` | | `boolean` | false | Whether to display the error message |
| `source` | `source` | readonly | `stripe.Source` | null | Stripe Source |
| `sourceData` | | | `{ owner: stripe.OwnerData }` | {} | Data passed to stripe.createSource. (optional) |
| `stripe` | `stripe` | readonly | `stripe.Stripe` | null | Stripe instance |
| `stripeMount` | | readonly | `Element` | | Stripe Element mount point |
| `stripeReady` | `stripe-ready` | | `Boolean` | false | If the stripe element is ready to receive focus. |
| `token` | `token` | readonly | `stripe.Token` | null | Stripe Token |
| `tokenData` | | | `stripe.TokenOptions` | {} | Data passed to stripe.createToken. (optional) |
| `value` | `value` | | `Object` | {} | Prefilled values for form. Example {postalCode: '90210'} |
| Property | Attribute | Modifiers | Type | Default | Description |
|---------------------|--------------------|-----------|---------------------------------------|-----------|--------------------------------------------------|
| `action` | `action` | | `String` | | The URL to the form action. Example '/charges'.<br />If blank or undefined will not submit charges immediately. |
| `billingDetails` | | | `stripe.BillingDetails` | {} | billing_details object sent to create the payment representation. (optional) |
| `brand` | `brand` | readonly | `String` | null | The card brand detected by Stripe |
| `card` | `card` | readonly | `stripe.Element` | null | The Stripe card object. |
| `element` | `element` | readonly | `stripe.elements.Element` | null | Stripe element instance |
| `elements` | `elements` | readonly | `stripe.elements.Elements` | null | Stripe Elements instance |
| `error` | `error` | readonly | `Error\|stripe.Error` | null | Stripe or validation error |
| `generate` | `generate` | | `'payment-method'\|'source'\|'token'` | "source" | Type of payment representation to generate. |
| `hasError` | `has-error` | readonly | `Boolean` | false | Whether the element has an error |
| `hideIcon` | `hide-icon` | | `Boolean` | false | Whether to hide icons in the Stripe form. |
| `hidePostalCode` | `hide-postal-code` | | `Boolean` | false | Whether or not to hide the postal code field.<br />Useful when you gather shipping info elsewhere. |
| `iconStyle` | `icon-style` | | `'solid'\|'default'` | "default" | Stripe icon style. 'solid' or 'default'. |
| `isComplete` | `is-complete` | | `Boolean` | false | If the form is complete. |
| `isEmpty` | `is-empty` | | `Boolean` | true | If the form is empty. |
| `paymentMethod` | `payment-method` | readonly | `stripe.PaymentMethod` | null | Stripe PaymentMethod |
| `paymentMethodData` | | | `stripe.PaymentMethodData` | {} | Data passed to stripe.createPaymentMethod. (optional) |
| `publishableKey` | `publishable-key` | | `String` | | Stripe Publishable Key. EG. `pk_test_XXXXXXXXXXXXXXXXXXXXXXXX` |
| `showError` | `show-error` | | `boolean` | false | Whether to display the error message |
| `source` | `source` | readonly | `stripe.Source` | null | Stripe Source |
| `sourceData` | | | `SourceData` | {} | Data passed to stripe.createSource. (optional) |
| `stripe` | `stripe` | readonly | `stripe.Stripe` | null | Stripe instance |
| `stripeMount` | | readonly | `Element` | | Stripe Element mount point |
| `stripeReady` | `stripe-ready` | | `Boolean` | false | If the stripe element is ready to receive focus. |
| `token` | `token` | readonly | `stripe.Token` | null | Stripe Token |
| `tokenData` | | | `stripe.TokenOptions` | {} | Data passed to stripe.createToken. (optional) |
| `value` | `value` | | `Object` | {} | Prefilled values for form. Example {postalCode: '90210'} |

#### Methods

Expand All @@ -144,6 +146,7 @@ There are 11 properties for each state that you can set which will be read into
| `createToken` | `(tokenData?: TokenData): Promise<TokenResponse>` | Submit payment information to generate a token |
| `isPotentiallyValid` | `(): Boolean` | Checks for potential validity. A potentially valid form is one that is not empty, not complete and has no error. A validated form also counts as potentially valid. |
| `reset` | `(): void` | Resets the Stripe card. |
| `submit` | `(): Promise<PaymentMethodResponse \| SourceResponse \| TokenResponse>` | Generates a payment representation of the type specified by `generate`. |
| `validate` | `(): Boolean` | Checks if the Stripe form is valid. |

#### Events
Expand Down
107 changes: 68 additions & 39 deletions custom-elements.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,11 +57,32 @@
"type": "Boolean",
"default": "false"
},
{
"name": "payment-method",
"description": "Stripe PaymentMethod",
"type": "stripe.PaymentMethod"
},
{
"name": "source",
"description": "Stripe Source",
"type": "stripe.Source"
},
{
"name": "token",
"description": "Stripe Token",
"type": "stripe.Token"
},
{
"name": "action",
"description": "The URL to the form action. Example '/charges'.\nIf blank or undefined will not submit charges immediately.",
"type": "String"
},
{
"name": "generate",
"description": "Type of payment representation to generate.",
"type": "'payment-method'|'source'|'token'",
"default": "\"source\""
},
{
"name": "publishable-key",
"description": "Stripe Publishable Key. EG. `pk_test_XXXXXXXXXXXXXXXXXXXXXXXX`",
Expand Down Expand Up @@ -94,20 +115,10 @@
"type": "Boolean",
"default": "false"
},
{
"name": "source",
"description": "Stripe Source",
"type": "stripe.Source"
},
{
"name": "stripe",
"description": "Stripe instance",
"type": "stripe.Stripe"
},
{
"name": "token",
"description": "Stripe Token",
"type": "stripe.Token"
}
],
"properties": [
Expand Down Expand Up @@ -177,15 +188,60 @@
"description": "Stripe Element mount point",
"type": "Element"
},
{
"name": "billingDetails",
"description": "billing_details object sent to create the payment representation. (optional)",
"type": "stripe.BillingDetails",
"default": "{}"
},
{
"name": "paymentMethodData",
"description": "Data passed to stripe.createPaymentMethod. (optional)",
"type": "stripe.PaymentMethodData",
"default": "{}"
},
{
"name": "sourceData",
"description": "Data passed to stripe.createSource. (optional)",
"type": "SourceData",
"default": "{}"
},
{
"name": "tokenData",
"description": "Data passed to stripe.createToken. (optional)",
"type": "stripe.TokenOptions",
"default": "{}"
},
{
"name": "paymentMethod",
"attribute": "payment-method",
"description": "Stripe PaymentMethod",
"type": "stripe.PaymentMethod"
},
{
"name": "source",
"attribute": "source",
"description": "Stripe Source",
"type": "stripe.Source"
},
{
"name": "token",
"attribute": "token",
"description": "Stripe Token",
"type": "stripe.Token"
},
{
"name": "action",
"attribute": "action",
"description": "The URL to the form action. Example '/charges'.\nIf blank or undefined will not submit charges immediately.",
"type": "String"
},
{
"name": "billingDetails",
"type": "stripe.BillingDetails"
"name": "generate",
"attribute": "generate",
"description": "Type of payment representation to generate.",
"type": "'payment-method'|'source'|'token'",
"default": "\"source\""
},
{
"name": "publishableKey",
Expand All @@ -200,21 +256,6 @@
"type": "boolean",
"default": "false"
},
{
"name": "paymentMethodData",
"description": "Data passed to stripe.createPaymentMethod. (optional)",
"type": "stripe.PaymentMethodData"
},
{
"name": "sourceData",
"description": "Data passed to stripe.createSource. (optional)",
"type": "{ owner: stripe.OwnerData }"
},
{
"name": "tokenData",
"description": "Data passed to stripe.createToken. (optional)",
"type": "stripe.TokenOptions"
},
{
"name": "element",
"attribute": "element",
Expand All @@ -240,23 +281,11 @@
"type": "Boolean",
"default": "false"
},
{
"name": "source",
"attribute": "source",
"description": "Stripe Source",
"type": "stripe.Source"
},
{
"name": "stripe",
"attribute": "stripe",
"description": "Stripe instance",
"type": "stripe.Stripe"
},
{
"name": "token",
"attribute": "token",
"description": "Stripe Token",
"type": "stripe.Token"
}
],
"events": [
Expand Down
Loading

0 comments on commit b866405

Please sign in to comment.