@moonbase.sh/storefront 1.0.1 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +97 -0
- package/dist/moonbase.d.ts +3 -0
- package/dist/moonbase.js +1656 -1649
- package/dist/moonbase.umd.cjs +11 -11
- package/package.json +2 -2
package/README.md
ADDED
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
# @moonbase.sh/storefront
|
|
2
|
+
|
|
3
|
+
Embeddable Moonbase storefront widget for browser apps.
|
|
4
|
+
|
|
5
|
+
This package wraps auth, cart, checkout, voucher redemption, product downloads, activation, and subscription management behind one client-side API.
|
|
6
|
+
|
|
7
|
+
Learn more about our embedded storefront in our official docs: https://moonbase.sh/docs/storefronts/embedded/
|
|
8
|
+
|
|
9
|
+
## Install
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
pnpm add @moonbase.sh/storefront
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## Quick start
|
|
16
|
+
|
|
17
|
+
```ts
|
|
18
|
+
import Moonbase, { MoonbaseEvent } from '@moonbase.sh/storefront'
|
|
19
|
+
|
|
20
|
+
Moonbase.setup('https://demo.moonbase.sh', {
|
|
21
|
+
toolbar: {
|
|
22
|
+
enabled: true,
|
|
23
|
+
location: 'top-right',
|
|
24
|
+
},
|
|
25
|
+
})
|
|
26
|
+
|
|
27
|
+
Moonbase.on(MoonbaseEvent.CheckoutCompleted, ({ order }) => {
|
|
28
|
+
console.log('Order completed', order.id)
|
|
29
|
+
})
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
`setup` should be run once, client-side, after the DOM is available.
|
|
33
|
+
|
|
34
|
+
## Trigger intents
|
|
35
|
+
|
|
36
|
+
Use intent methods to open specific views or execute actions:
|
|
37
|
+
|
|
38
|
+
```ts
|
|
39
|
+
Moonbase.sign_in({ email: 'jane@example.com' })
|
|
40
|
+
|
|
41
|
+
Moonbase.add_to_cart({
|
|
42
|
+
product_id: 'my-product',
|
|
43
|
+
quantity: 1,
|
|
44
|
+
})
|
|
45
|
+
|
|
46
|
+
Moonbase.view_cart()
|
|
47
|
+
Moonbase.checkout()
|
|
48
|
+
Moonbase.view_products()
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
All intents are snake_case methods on the `Moonbase` instance (for example `view_product`, `manage_subscription`, `redeem_voucher`).
|
|
52
|
+
|
|
53
|
+
## Configure behavior and theme
|
|
54
|
+
|
|
55
|
+
You can pass options in `setup(...)` and update them later with `configure(...)`:
|
|
56
|
+
|
|
57
|
+
```ts
|
|
58
|
+
Moonbase.configure({
|
|
59
|
+
auth: {
|
|
60
|
+
signUp: {
|
|
61
|
+
enabled: false,
|
|
62
|
+
},
|
|
63
|
+
},
|
|
64
|
+
cart: {
|
|
65
|
+
quantity: 'single',
|
|
66
|
+
},
|
|
67
|
+
theme: {
|
|
68
|
+
colors: {
|
|
69
|
+
primary: '#E5A000',
|
|
70
|
+
background: 'white',
|
|
71
|
+
},
|
|
72
|
+
fonts: {
|
|
73
|
+
heading: 'Aleo',
|
|
74
|
+
body: 'Inter',
|
|
75
|
+
},
|
|
76
|
+
},
|
|
77
|
+
})
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
You can also control where the widget mounts by providing `target`.
|
|
81
|
+
|
|
82
|
+
## Events
|
|
83
|
+
|
|
84
|
+
Subscribe to widget lifecycle events with `Moonbase.on(...)`.
|
|
85
|
+
|
|
86
|
+
Available events include:
|
|
87
|
+
|
|
88
|
+
- `signed-in`
|
|
89
|
+
- `signed-up`
|
|
90
|
+
- `signed-out`
|
|
91
|
+
- `redeemed-voucher`
|
|
92
|
+
- `downloaded-product`
|
|
93
|
+
- `activated-product`
|
|
94
|
+
- `added-to-cart`
|
|
95
|
+
- `checkout-initiated`
|
|
96
|
+
- `checkout-closed`
|
|
97
|
+
- `checkout-completed`
|