Coupon Form
<sc-coupon-form></sc-coupon-form>
This component let users create coupon form.
- Preview
- Code
<sc-coupon-form label='Add coupon code'>Apply Coupon</sc-coupon-form>
Component Codex
Properties
| Property | Description | Type | Default |
|---|---|---|---|
| busy | Is the form calculating | boolean | |
| buttonText | The text for apply button | string | |
| collapsed | boolean | ||
| currency | Currency | string | |
| discount | The discount | DiscountResponse | |
| discountAmount | The discount amount | number | |
| editable | Is the form editable | boolean | true |
| error | The error message | string | |
| forceOpen | Force the form to show | boolean | |
| label | The label for the coupon form | string | |
| loading | Is the form loading | boolean | |
| open | Is it open | boolean | |
| placeholder | The placeholder for the input | string | |
| showInterval | Has recurring | boolean |
Events
| Event | Description | Type |
|---|---|---|
scApplyCoupon | When the coupon is applied | CustomEvent<string> |
Methods
triggerFocus() => Promise<void>
Focus the input.
Shadow Parts
| Part | Description |
|---|---|
amount | The discount amount. |
base | The elements base wrapper. |
block-ui | The block ui base component. |
block-ui__content | The block ui content (spinner). |
button__base | The button base element. |
button__label | The button label. |
coupon-tag | The coupon tag. |
discount | The discount displayed (% off) |
discount-label | The discount label. |
error__base | The error base. |
error__icon | The error icon |
error__message | The error message. |
error__text | The error text. |
error_title | The error title. |
form | The form. |
info | The discount info. |
input | The input. |
input__base | The input base. |
input__form-control | The input form control. |
label |