@nevios/storefront-kit 1.0.0 → 1.2.0

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 ADDED
@@ -0,0 +1,78 @@
1
+ # @nevios/storefront-kit
2
+
3
+ Themeable React commerce UI for [Nevios](https://nevios.io) storefronts —
4
+ providers, hooks and whole screens built on
5
+ [`@nevios/storefront-js`](https://www.npmjs.com/package/@nevios/storefront-js).
6
+
7
+ You theme it with CSS variables and override individual slots; you don't rebuild
8
+ it. Every component is styled through `--nv-*` tokens and renders unstyled-ish
9
+ markup, so a shop's own design system can take over piece by piece.
10
+
11
+ ```sh
12
+ pnpm add @nevios/storefront-kit @nevios/storefront-js
13
+ ```
14
+
15
+ Peer dependencies: React 19 and React DOM 19.
16
+
17
+ ## Getting started
18
+
19
+ ```tsx
20
+ import { createStorefrontClient } from "@nevios/storefront-js";
21
+ import { NeviosProvider, I18nProvider } from "@nevios/storefront-kit";
22
+
23
+ const client = createStorefrontClient({
24
+ publishableKey: process.env.NEXT_PUBLIC_NEVIOS_STOREFRONT_KEY!,
25
+ market: "cz",
26
+ });
27
+
28
+ export function App({ children }) {
29
+ return (
30
+ <NeviosProvider client={client}>
31
+ <I18nProvider locale="cs-CZ">{children}</I18nProvider>
32
+ </NeviosProvider>
33
+ );
34
+ }
35
+ ```
36
+
37
+ `I18nProvider` also decides how money is formatted. Pass the shopper's locale
38
+ once and prices come out as `1 299,00 Kč` rather than the runtime default.
39
+
40
+ ## What's in it
41
+
42
+ | Area | |
43
+ |---|---|
44
+ | Catalog | product + collection views, filters, responsive images |
45
+ | Cart | line items, summary, the `useCart` hook |
46
+ | Checkout | address, shipping picker, payment step, `CheckoutFlow` |
47
+ | Order | `OrderConfirmation`, `OrderStatusPage`, `useOrderStatus` |
48
+ | **Payment** | `PaymentPage`, `PaymentMethodPicker`, `TransferInstructions` |
49
+ | Account | sign-in, addresses, order history |
50
+ | SEO | JSON-LD for products, breadcrumbs, the organization |
51
+
52
+ Everything is exported from the package root, and everything that fetches goes
53
+ through the one client on context.
54
+
55
+ ## The payment page
56
+
57
+ `PaymentPage` is the screen a customer reaches from a "finish your payment" link
58
+ in an order e-mail — possibly days later, on another device. Give it the
59
+ payment's token (the order status hands it over as `order.payment.token`) and it
60
+ renders one of four situations: there is something to pay, pay by bank transfer
61
+ (account, variable symbol, QR), already paid, or locked with the reason spelled
62
+ out.
63
+
64
+ ```tsx
65
+ <PaymentPage token={order.payment.token} statusHref={`/orders/${statusToken}`} />
66
+ ```
67
+
68
+ A `null` token renders nothing — the server mints one only while money is owed,
69
+ so its absence is the answer, not an error state to design around.
70
+
71
+ ## Localization
72
+
73
+ Czech and English ship in the bundle; `I18nProvider` picks by language subtag.
74
+ Bring your own pack with `messages={…}` for anything else.
75
+
76
+ ## License
77
+
78
+ MIT