@vue-storefront/next 3.0.0 → 4.0.0-rc.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/dist/{chunk-EX6ADWAR.mjs → chunk-FUJQIYOF.mjs} +14 -1
- package/dist/client.d.mts +13 -11
- package/dist/client.d.ts +13 -11
- package/dist/client.js +145 -11
- package/dist/client.mjs +124 -12
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -0
- package/dist/index.mjs +2 -1
- package/dist/{types-CL1oQuKL.d.mts → types-TuCCvExK.d.mts} +55 -7
- package/dist/{types-CL1oQuKL.d.ts → types-TuCCvExK.d.ts} +55 -7
- package/package.json +4 -3
|
@@ -17,8 +17,21 @@ var __spreadValues = (a, b) => {
|
|
|
17
17
|
return a;
|
|
18
18
|
};
|
|
19
19
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
var __objRest = (source, exclude) => {
|
|
21
|
+
var target = {};
|
|
22
|
+
for (var prop in source)
|
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
+
target[prop] = source[prop];
|
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
+
target[prop] = source[prop];
|
|
29
|
+
}
|
|
30
|
+
return target;
|
|
31
|
+
};
|
|
20
32
|
|
|
21
33
|
export {
|
|
22
34
|
__spreadValues,
|
|
23
|
-
__spreadProps
|
|
35
|
+
__spreadProps,
|
|
36
|
+
__objRest
|
|
24
37
|
};
|
package/dist/client.d.mts
CHANGED
|
@@ -1,25 +1,27 @@
|
|
|
1
1
|
import { SDKApi } from '@vue-storefront/sdk';
|
|
2
|
-
import { b as CreateSdkContextReturn } from './types-
|
|
2
|
+
import { S as SfContract, b as CreateSdkContextReturn } from './types-TuCCvExK.mjs';
|
|
3
|
+
export { M as Maybe, d as SfState, c as SfStateProps, e as createSfStateProvider } from './types-TuCCvExK.mjs';
|
|
3
4
|
import 'react';
|
|
4
5
|
|
|
5
6
|
/**
|
|
6
|
-
* Creates a new
|
|
7
|
+
* Creates a new Alokai context which is a combination of SDK and state contexts.
|
|
8
|
+
* This function is dedicated for the client-side usage.
|
|
7
9
|
*
|
|
8
10
|
* @example
|
|
9
|
-
* Create a new
|
|
11
|
+
* Create a new Alokai context somewhere in your application. It may be the `hooks/sdk.ts` file.
|
|
10
12
|
*
|
|
11
13
|
* ```tsx
|
|
12
|
-
* import {
|
|
13
|
-
* import {
|
|
14
|
+
* import { createAlokaiContext } from "@vue-storefront/next/client";
|
|
15
|
+
* import type { Sdk } from './sdk.server';
|
|
14
16
|
*
|
|
15
|
-
* export const [
|
|
17
|
+
* export const [AlokaiProvider, useSdk] = createAlokaiContext<Sdk>();
|
|
16
18
|
* ```
|
|
17
|
-
* Then use the `
|
|
19
|
+
* Then use the `AlokaiProvider` in the root component of your application.
|
|
18
20
|
* For Pages Router it would be the `pages/_app.tsx` file,
|
|
19
21
|
* and for the App Router it would be the `app/layout.tsx` file.
|
|
20
|
-
* Finally you can use the `useSdk` in any client component of your application.
|
|
21
|
-
* @returns [
|
|
22
|
+
* Finally, you can use the `useSdk` in any client component of your application.
|
|
23
|
+
* @returns [AlokaiProvider, useSdk] - The SDK provider and the `useSdk` hook.
|
|
22
24
|
*/
|
|
23
|
-
declare function
|
|
25
|
+
declare function createAlokaiContext<TSdk extends SDKApi<any>, TSfContract extends SfContract>(): CreateSdkContextReturn<TSdk, TSfContract>;
|
|
24
26
|
|
|
25
|
-
export { CreateSdkContextReturn,
|
|
27
|
+
export { CreateSdkContextReturn, SfContract, createAlokaiContext };
|
package/dist/client.d.ts
CHANGED
|
@@ -1,25 +1,27 @@
|
|
|
1
1
|
import { SDKApi } from '@vue-storefront/sdk';
|
|
2
|
-
import { b as CreateSdkContextReturn } from './types-
|
|
2
|
+
import { S as SfContract, b as CreateSdkContextReturn } from './types-TuCCvExK.js';
|
|
3
|
+
export { M as Maybe, d as SfState, c as SfStateProps, e as createSfStateProvider } from './types-TuCCvExK.js';
|
|
3
4
|
import 'react';
|
|
4
5
|
|
|
5
6
|
/**
|
|
6
|
-
* Creates a new
|
|
7
|
+
* Creates a new Alokai context which is a combination of SDK and state contexts.
|
|
8
|
+
* This function is dedicated for the client-side usage.
|
|
7
9
|
*
|
|
8
10
|
* @example
|
|
9
|
-
* Create a new
|
|
11
|
+
* Create a new Alokai context somewhere in your application. It may be the `hooks/sdk.ts` file.
|
|
10
12
|
*
|
|
11
13
|
* ```tsx
|
|
12
|
-
* import {
|
|
13
|
-
* import {
|
|
14
|
+
* import { createAlokaiContext } from "@vue-storefront/next/client";
|
|
15
|
+
* import type { Sdk } from './sdk.server';
|
|
14
16
|
*
|
|
15
|
-
* export const [
|
|
17
|
+
* export const [AlokaiProvider, useSdk] = createAlokaiContext<Sdk>();
|
|
16
18
|
* ```
|
|
17
|
-
* Then use the `
|
|
19
|
+
* Then use the `AlokaiProvider` in the root component of your application.
|
|
18
20
|
* For Pages Router it would be the `pages/_app.tsx` file,
|
|
19
21
|
* and for the App Router it would be the `app/layout.tsx` file.
|
|
20
|
-
* Finally you can use the `useSdk` in any client component of your application.
|
|
21
|
-
* @returns [
|
|
22
|
+
* Finally, you can use the `useSdk` in any client component of your application.
|
|
23
|
+
* @returns [AlokaiProvider, useSdk] - The SDK provider and the `useSdk` hook.
|
|
22
24
|
*/
|
|
23
|
-
declare function
|
|
25
|
+
declare function createAlokaiContext<TSdk extends SDKApi<any>, TSfContract extends SfContract>(): CreateSdkContextReturn<TSdk, TSfContract>;
|
|
24
26
|
|
|
25
|
-
export { CreateSdkContextReturn,
|
|
27
|
+
export { CreateSdkContextReturn, SfContract, createAlokaiContext };
|
package/dist/client.js
CHANGED
|
@@ -1,10 +1,39 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
+
var __defProps = Object.defineProperties;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
7
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
9
|
var __getProtoOf = Object.getPrototypeOf;
|
|
7
10
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
+
var __spreadValues = (a, b) => {
|
|
14
|
+
for (var prop in b || (b = {}))
|
|
15
|
+
if (__hasOwnProp.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
if (__getOwnPropSymbols)
|
|
18
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
+
if (__propIsEnum.call(b, prop))
|
|
20
|
+
__defNormalProp(a, prop, b[prop]);
|
|
21
|
+
}
|
|
22
|
+
return a;
|
|
23
|
+
};
|
|
24
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
+
var __objRest = (source, exclude) => {
|
|
26
|
+
var target = {};
|
|
27
|
+
for (var prop in source)
|
|
28
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
if (source != null && __getOwnPropSymbols)
|
|
31
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
+
target[prop] = source[prop];
|
|
34
|
+
}
|
|
35
|
+
return target;
|
|
36
|
+
};
|
|
8
37
|
var __export = (target, all) => {
|
|
9
38
|
for (var name in all)
|
|
10
39
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -30,33 +59,138 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
30
59
|
// src/client.ts
|
|
31
60
|
var client_exports = {};
|
|
32
61
|
__export(client_exports, {
|
|
33
|
-
|
|
62
|
+
createAlokaiContext: () => createAlokaiContext,
|
|
63
|
+
createSfStateProvider: () => createSfStateProvider
|
|
34
64
|
});
|
|
35
65
|
module.exports = __toCommonJS(client_exports);
|
|
36
66
|
|
|
37
|
-
// src/
|
|
67
|
+
// src/alokai-provider.tsx
|
|
38
68
|
var import_script = __toESM(require("next/script"));
|
|
69
|
+
var import_react2 = __toESM(require("react"));
|
|
70
|
+
|
|
71
|
+
// src/state.tsx
|
|
39
72
|
var import_react = __toESM(require("react"));
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
73
|
+
var import_zustand = require("zustand");
|
|
74
|
+
var createSfState = (initialData) => {
|
|
75
|
+
return (0, import_zustand.createStore)()((set) => __spreadProps(__spreadValues({
|
|
76
|
+
cart: null,
|
|
77
|
+
customer: null
|
|
78
|
+
}, initialData), {
|
|
79
|
+
setCart: (cart) => set({ cart }),
|
|
80
|
+
setCurrencies: (currencies) => set({ currencies }),
|
|
81
|
+
setCurrency: (currency) => set({ currency }),
|
|
82
|
+
setCustomer: (customer) => set({ customer }),
|
|
83
|
+
setLocale: (locale) => set({ locale }),
|
|
84
|
+
setLocales: (locales) => set({ locales })
|
|
85
|
+
}));
|
|
86
|
+
};
|
|
87
|
+
function createSfStateProvider() {
|
|
88
|
+
const SfStateContext = (0, import_react.createContext)(null);
|
|
89
|
+
function SfStateProvider({
|
|
90
|
+
children,
|
|
91
|
+
initialData
|
|
92
|
+
}) {
|
|
93
|
+
const stateReference = (0, import_react.useRef)();
|
|
94
|
+
if (!stateReference.current) {
|
|
95
|
+
stateReference.current = createSfState(initialData);
|
|
96
|
+
}
|
|
97
|
+
return /* @__PURE__ */ import_react.default.createElement(SfStateContext.Provider, { value: stateReference.current }, children);
|
|
98
|
+
}
|
|
99
|
+
function getSfStateContext() {
|
|
100
|
+
const context = (0, import_react.useContext)(SfStateContext);
|
|
101
|
+
if (!context)
|
|
102
|
+
throw new Error("Missing SfStateContext.Provider in the tree");
|
|
103
|
+
return context;
|
|
104
|
+
}
|
|
105
|
+
function useSfCurrencyState() {
|
|
106
|
+
const { currency, setCurrency } = (0, import_zustand.useStore)(
|
|
107
|
+
getSfStateContext(),
|
|
108
|
+
(state) => ({
|
|
109
|
+
currency: state.currency,
|
|
110
|
+
setCurrency: state.setCurrency
|
|
111
|
+
})
|
|
112
|
+
);
|
|
113
|
+
return [currency, setCurrency];
|
|
114
|
+
}
|
|
115
|
+
function useSfCurrenciesState() {
|
|
116
|
+
const { currencies, setCurrencies } = (0, import_zustand.useStore)(
|
|
117
|
+
getSfStateContext(),
|
|
118
|
+
(state) => ({
|
|
119
|
+
currencies: state.currencies,
|
|
120
|
+
setCurrencies: state.setCurrencies
|
|
121
|
+
})
|
|
122
|
+
);
|
|
123
|
+
return [currencies, setCurrencies];
|
|
124
|
+
}
|
|
125
|
+
function useSfLocaleState() {
|
|
126
|
+
const { locale, setLocale } = (0, import_zustand.useStore)(getSfStateContext(), (state) => ({
|
|
127
|
+
locale: state.locale,
|
|
128
|
+
setLocale: state.setLocale
|
|
129
|
+
}));
|
|
130
|
+
return [locale, setLocale];
|
|
131
|
+
}
|
|
132
|
+
function useSfLocalesState() {
|
|
133
|
+
const { locales, setLocales } = (0, import_zustand.useStore)(getSfStateContext(), (state) => ({
|
|
134
|
+
locales: state.locales,
|
|
135
|
+
setLocales: state.setLocales
|
|
136
|
+
}));
|
|
137
|
+
return [locales, setLocales];
|
|
138
|
+
}
|
|
139
|
+
function useSfCartState() {
|
|
140
|
+
const { cart, setCart } = (0, import_zustand.useStore)(getSfStateContext(), (state) => ({
|
|
141
|
+
cart: state.cart,
|
|
142
|
+
setCart: state.setCart
|
|
143
|
+
}));
|
|
144
|
+
return [cart, setCart];
|
|
145
|
+
}
|
|
146
|
+
function useSfCustomerState() {
|
|
147
|
+
const { customer, setCustomer } = (0, import_zustand.useStore)(
|
|
148
|
+
getSfStateContext(),
|
|
149
|
+
(state) => ({
|
|
150
|
+
customer: state.customer,
|
|
151
|
+
setCustomer: state.setCustomer
|
|
152
|
+
})
|
|
153
|
+
);
|
|
154
|
+
return [customer, setCustomer];
|
|
155
|
+
}
|
|
156
|
+
return {
|
|
157
|
+
SfStateProvider,
|
|
158
|
+
useSfCurrencyState,
|
|
159
|
+
useSfCurrenciesState,
|
|
160
|
+
useSfLocaleState,
|
|
161
|
+
useSfLocalesState,
|
|
162
|
+
useSfCartState,
|
|
163
|
+
useSfCustomerState
|
|
164
|
+
};
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
// src/alokai-provider.tsx
|
|
168
|
+
function createAlokaiContext() {
|
|
169
|
+
const SdkContext = (0, import_react2.createContext)(null);
|
|
170
|
+
const _a = createSfStateProvider(), { SfStateProvider } = _a, rest = __objRest(_a, ["SfStateProvider"]);
|
|
171
|
+
function AlokaiProvider({
|
|
172
|
+
children,
|
|
173
|
+
sdk,
|
|
174
|
+
initialData
|
|
175
|
+
}) {
|
|
176
|
+
return /* @__PURE__ */ import_react2.default.createElement(SdkContext.Provider, { value: sdk }, /* @__PURE__ */ import_react2.default.createElement(import_script.default, { strategy: "beforeInteractive", id: "vsfMetaTag" }, `
|
|
44
177
|
const vsfMetaTag = document.createElement("meta");
|
|
45
178
|
vsfMetaTag.setAttribute("name", "generator");
|
|
46
179
|
vsfMetaTag.setAttribute("content", "Vue Storefront 2");
|
|
47
180
|
document.head.appendChild(vsfMetaTag);
|
|
48
|
-
`), children);
|
|
181
|
+
`), /* @__PURE__ */ import_react2.default.createElement(SfStateProvider, { initialData }, children));
|
|
49
182
|
}
|
|
50
183
|
const useSdk = () => {
|
|
51
|
-
const contextSdk = (0,
|
|
184
|
+
const contextSdk = (0, import_react2.useContext)(SdkContext);
|
|
52
185
|
if (!contextSdk) {
|
|
53
|
-
throw new Error("useSdk must be used within a
|
|
186
|
+
throw new Error("useSdk must be used within a AlokaiProvider");
|
|
54
187
|
}
|
|
55
188
|
return contextSdk;
|
|
56
189
|
};
|
|
57
|
-
return
|
|
190
|
+
return __spreadValues({ AlokaiProvider, useSdk }, rest);
|
|
58
191
|
}
|
|
59
192
|
// Annotate the CommonJS export names for ESM import in node:
|
|
60
193
|
0 && (module.exports = {
|
|
61
|
-
|
|
194
|
+
createAlokaiContext,
|
|
195
|
+
createSfStateProvider
|
|
62
196
|
});
|
package/dist/client.mjs
CHANGED
|
@@ -1,28 +1,140 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import {
|
|
3
|
+
__objRest,
|
|
4
|
+
__spreadProps,
|
|
5
|
+
__spreadValues
|
|
6
|
+
} from "./chunk-FUJQIYOF.mjs";
|
|
3
7
|
|
|
4
|
-
// src/
|
|
8
|
+
// src/alokai-provider.tsx
|
|
5
9
|
import Script from "next/script";
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
10
|
+
import React2, { createContext as createContext2, useContext as useContext2 } from "react";
|
|
11
|
+
|
|
12
|
+
// src/state.tsx
|
|
13
|
+
import React, {
|
|
14
|
+
createContext,
|
|
15
|
+
useContext,
|
|
16
|
+
useRef
|
|
17
|
+
} from "react";
|
|
18
|
+
import { createStore, useStore } from "zustand";
|
|
19
|
+
var createSfState = (initialData) => {
|
|
20
|
+
return createStore()((set) => __spreadProps(__spreadValues({
|
|
21
|
+
cart: null,
|
|
22
|
+
customer: null
|
|
23
|
+
}, initialData), {
|
|
24
|
+
setCart: (cart) => set({ cart }),
|
|
25
|
+
setCurrencies: (currencies) => set({ currencies }),
|
|
26
|
+
setCurrency: (currency) => set({ currency }),
|
|
27
|
+
setCustomer: (customer) => set({ customer }),
|
|
28
|
+
setLocale: (locale) => set({ locale }),
|
|
29
|
+
setLocales: (locales) => set({ locales })
|
|
30
|
+
}));
|
|
31
|
+
};
|
|
32
|
+
function createSfStateProvider() {
|
|
33
|
+
const SfStateContext = createContext(null);
|
|
34
|
+
function SfStateProvider({
|
|
35
|
+
children,
|
|
36
|
+
initialData
|
|
37
|
+
}) {
|
|
38
|
+
const stateReference = useRef();
|
|
39
|
+
if (!stateReference.current) {
|
|
40
|
+
stateReference.current = createSfState(initialData);
|
|
41
|
+
}
|
|
42
|
+
return /* @__PURE__ */ React.createElement(SfStateContext.Provider, { value: stateReference.current }, children);
|
|
43
|
+
}
|
|
44
|
+
function getSfStateContext() {
|
|
45
|
+
const context = useContext(SfStateContext);
|
|
46
|
+
if (!context)
|
|
47
|
+
throw new Error("Missing SfStateContext.Provider in the tree");
|
|
48
|
+
return context;
|
|
49
|
+
}
|
|
50
|
+
function useSfCurrencyState() {
|
|
51
|
+
const { currency, setCurrency } = useStore(
|
|
52
|
+
getSfStateContext(),
|
|
53
|
+
(state) => ({
|
|
54
|
+
currency: state.currency,
|
|
55
|
+
setCurrency: state.setCurrency
|
|
56
|
+
})
|
|
57
|
+
);
|
|
58
|
+
return [currency, setCurrency];
|
|
59
|
+
}
|
|
60
|
+
function useSfCurrenciesState() {
|
|
61
|
+
const { currencies, setCurrencies } = useStore(
|
|
62
|
+
getSfStateContext(),
|
|
63
|
+
(state) => ({
|
|
64
|
+
currencies: state.currencies,
|
|
65
|
+
setCurrencies: state.setCurrencies
|
|
66
|
+
})
|
|
67
|
+
);
|
|
68
|
+
return [currencies, setCurrencies];
|
|
69
|
+
}
|
|
70
|
+
function useSfLocaleState() {
|
|
71
|
+
const { locale, setLocale } = useStore(getSfStateContext(), (state) => ({
|
|
72
|
+
locale: state.locale,
|
|
73
|
+
setLocale: state.setLocale
|
|
74
|
+
}));
|
|
75
|
+
return [locale, setLocale];
|
|
76
|
+
}
|
|
77
|
+
function useSfLocalesState() {
|
|
78
|
+
const { locales, setLocales } = useStore(getSfStateContext(), (state) => ({
|
|
79
|
+
locales: state.locales,
|
|
80
|
+
setLocales: state.setLocales
|
|
81
|
+
}));
|
|
82
|
+
return [locales, setLocales];
|
|
83
|
+
}
|
|
84
|
+
function useSfCartState() {
|
|
85
|
+
const { cart, setCart } = useStore(getSfStateContext(), (state) => ({
|
|
86
|
+
cart: state.cart,
|
|
87
|
+
setCart: state.setCart
|
|
88
|
+
}));
|
|
89
|
+
return [cart, setCart];
|
|
90
|
+
}
|
|
91
|
+
function useSfCustomerState() {
|
|
92
|
+
const { customer, setCustomer } = useStore(
|
|
93
|
+
getSfStateContext(),
|
|
94
|
+
(state) => ({
|
|
95
|
+
customer: state.customer,
|
|
96
|
+
setCustomer: state.setCustomer
|
|
97
|
+
})
|
|
98
|
+
);
|
|
99
|
+
return [customer, setCustomer];
|
|
100
|
+
}
|
|
101
|
+
return {
|
|
102
|
+
SfStateProvider,
|
|
103
|
+
useSfCurrencyState,
|
|
104
|
+
useSfCurrenciesState,
|
|
105
|
+
useSfLocaleState,
|
|
106
|
+
useSfLocalesState,
|
|
107
|
+
useSfCartState,
|
|
108
|
+
useSfCustomerState
|
|
109
|
+
};
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
// src/alokai-provider.tsx
|
|
113
|
+
function createAlokaiContext() {
|
|
114
|
+
const SdkContext = createContext2(null);
|
|
115
|
+
const _a = createSfStateProvider(), { SfStateProvider } = _a, rest = __objRest(_a, ["SfStateProvider"]);
|
|
116
|
+
function AlokaiProvider({
|
|
117
|
+
children,
|
|
118
|
+
sdk,
|
|
119
|
+
initialData
|
|
120
|
+
}) {
|
|
121
|
+
return /* @__PURE__ */ React2.createElement(SdkContext.Provider, { value: sdk }, /* @__PURE__ */ React2.createElement(Script, { strategy: "beforeInteractive", id: "vsfMetaTag" }, `
|
|
11
122
|
const vsfMetaTag = document.createElement("meta");
|
|
12
123
|
vsfMetaTag.setAttribute("name", "generator");
|
|
13
124
|
vsfMetaTag.setAttribute("content", "Vue Storefront 2");
|
|
14
125
|
document.head.appendChild(vsfMetaTag);
|
|
15
|
-
`), children);
|
|
126
|
+
`), /* @__PURE__ */ React2.createElement(SfStateProvider, { initialData }, children));
|
|
16
127
|
}
|
|
17
128
|
const useSdk = () => {
|
|
18
|
-
const contextSdk =
|
|
129
|
+
const contextSdk = useContext2(SdkContext);
|
|
19
130
|
if (!contextSdk) {
|
|
20
|
-
throw new Error("useSdk must be used within a
|
|
131
|
+
throw new Error("useSdk must be used within a AlokaiProvider");
|
|
21
132
|
}
|
|
22
133
|
return contextSdk;
|
|
23
134
|
};
|
|
24
|
-
return
|
|
135
|
+
return __spreadValues({ AlokaiProvider, useSdk }, rest);
|
|
25
136
|
}
|
|
26
137
|
export {
|
|
27
|
-
|
|
138
|
+
createAlokaiContext,
|
|
139
|
+
createSfStateProvider
|
|
28
140
|
};
|
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
2
|
__spreadProps,
|
|
3
3
|
__spreadValues
|
|
4
|
-
} from "./chunk-
|
|
4
|
+
} from "./chunk-FUJQIYOF.mjs";
|
|
5
5
|
|
|
6
6
|
// ../shared/src/helpers/composeMiddlewareUrl.ts
|
|
7
7
|
function calculateMiddlewareUrl({
|
|
@@ -49,6 +49,7 @@ var defaultMethodsRequestConfig = {
|
|
|
49
49
|
getProductDetails: { method: "GET" },
|
|
50
50
|
getProductReviews: { method: "GET" },
|
|
51
51
|
getProducts: { method: "GET" },
|
|
52
|
+
getCurrencies: { method: "GET" },
|
|
52
53
|
searchProducts: { method: "GET" }
|
|
53
54
|
}
|
|
54
55
|
},
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { SDKApi, buildModule, middlewareModule } from '@vue-storefront/sdk';
|
|
2
|
-
import { ReactNode } from 'react';
|
|
2
|
+
import React, { ReactNode } from 'react';
|
|
3
3
|
|
|
4
4
|
declare const defaultMethodsRequestConfig: {
|
|
5
5
|
readonly unifiedCommerce: {
|
|
@@ -16,6 +16,9 @@ declare const defaultMethodsRequestConfig: {
|
|
|
16
16
|
readonly getProducts: {
|
|
17
17
|
readonly method: "GET";
|
|
18
18
|
};
|
|
19
|
+
readonly getCurrencies: {
|
|
20
|
+
readonly method: "GET";
|
|
21
|
+
};
|
|
19
22
|
readonly searchProducts: {
|
|
20
23
|
readonly method: "GET";
|
|
21
24
|
};
|
|
@@ -30,6 +33,44 @@ declare const defaultMethodsRequestConfig: {
|
|
|
30
33
|
};
|
|
31
34
|
};
|
|
32
35
|
|
|
36
|
+
type Maybe<TType> = TType | null;
|
|
37
|
+
|
|
38
|
+
type SfContract = {
|
|
39
|
+
SfCart: unknown;
|
|
40
|
+
SfCustomer: unknown;
|
|
41
|
+
SfCurrency: unknown;
|
|
42
|
+
SfLocale: unknown;
|
|
43
|
+
};
|
|
44
|
+
interface SfStateProps<TSfContract extends SfContract> {
|
|
45
|
+
currencies: TSfContract["SfCurrency"][];
|
|
46
|
+
currency: TSfContract["SfCurrency"];
|
|
47
|
+
locale: TSfContract["SfLocale"];
|
|
48
|
+
locales: TSfContract["SfLocale"][];
|
|
49
|
+
}
|
|
50
|
+
interface SfState<TSfContract extends SfContract> extends SfStateProps<TSfContract> {
|
|
51
|
+
cart: TSfContract["SfCart"] | null | undefined;
|
|
52
|
+
customer: TSfContract["SfCustomer"] | null | undefined;
|
|
53
|
+
setCart: (cart?: TSfContract["SfCart"] | null) => void;
|
|
54
|
+
setCurrencies: (currencies: TSfContract["SfCurrency"][]) => void;
|
|
55
|
+
setCurrency: (currency: TSfContract["SfCurrency"]) => void;
|
|
56
|
+
setCustomer: (customer?: TSfContract["SfCustomer"] | null) => void;
|
|
57
|
+
setLocale: (locale: TSfContract["SfLocale"]) => void;
|
|
58
|
+
setLocales: (locales: TSfContract["SfLocale"][]) => void;
|
|
59
|
+
}
|
|
60
|
+
declare function createSfStateProvider<TSfContract extends SfContract>(): {
|
|
61
|
+
SfStateProvider: ({ children, initialData, }: {
|
|
62
|
+
initialData: SfStateProps<TSfContract>;
|
|
63
|
+
} & {
|
|
64
|
+
children?: React.ReactNode;
|
|
65
|
+
}) => React.JSX.Element;
|
|
66
|
+
useSfCurrencyState: () => [TSfContract["SfCurrency"], (currency: TSfContract["SfCurrency"]) => void];
|
|
67
|
+
useSfCurrenciesState: () => [TSfContract["SfCurrency"][], (currencies: TSfContract["SfCurrency"][]) => void];
|
|
68
|
+
useSfLocaleState: () => [TSfContract["SfLocale"], (locale: TSfContract["SfLocale"]) => void];
|
|
69
|
+
useSfLocalesState: () => [TSfContract["SfLocale"][], (locales: TSfContract["SfLocale"][]) => void];
|
|
70
|
+
useSfCartState: () => [TSfContract["SfCart"], (cart?: TSfContract["SfCart"] | null) => void];
|
|
71
|
+
useSfCustomerState: () => [TSfContract["SfCustomer"], (customer?: TSfContract["SfCustomer"] | null) => void];
|
|
72
|
+
};
|
|
73
|
+
|
|
33
74
|
type GetSdkContext = {
|
|
34
75
|
/**
|
|
35
76
|
* A function that returns the request headers.
|
|
@@ -58,9 +99,10 @@ type StaticContext = {
|
|
|
58
99
|
};
|
|
59
100
|
type InjectedContext = DynamicContext & StaticContext;
|
|
60
101
|
type Config<TConfig> = (context: InjectedContext) => TConfig;
|
|
61
|
-
type
|
|
102
|
+
type AlokaiProviderProps<TSdk, TSfContract extends SfContract> = {
|
|
62
103
|
children: ReactNode;
|
|
63
104
|
sdk: TSdk;
|
|
105
|
+
initialData: SfStateProps<TSfContract>;
|
|
64
106
|
};
|
|
65
107
|
interface CreateSdkReturn<TConfig extends Record<string, any>> {
|
|
66
108
|
/**
|
|
@@ -108,9 +150,15 @@ interface CreateSdkReturn<TConfig extends Record<string, any>> {
|
|
|
108
150
|
*/
|
|
109
151
|
getSdk: (dynamicContext?: GetSdkContext) => SDKApi<TConfig>;
|
|
110
152
|
}
|
|
111
|
-
type CreateSdkContextReturn<TSdk extends SDKApi<any
|
|
112
|
-
({ children }:
|
|
113
|
-
() => TSdk
|
|
114
|
-
];
|
|
153
|
+
type CreateSdkContextReturn<TSdk extends SDKApi<any>, TSfContract extends SfContract> = Readonly<{
|
|
154
|
+
AlokaiProvider: ({ children, }: AlokaiProviderProps<TSdk, TSfContract>) => JSX.Element;
|
|
155
|
+
useSdk: () => TSdk;
|
|
156
|
+
useSfCurrencyState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrencyState"];
|
|
157
|
+
useSfCurrenciesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrenciesState"];
|
|
158
|
+
useSfLocaleState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocaleState"];
|
|
159
|
+
useSfLocalesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocalesState"];
|
|
160
|
+
useSfCartState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCartState"];
|
|
161
|
+
useSfCustomerState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCustomerState"];
|
|
162
|
+
}>;
|
|
115
163
|
|
|
116
|
-
export type
|
|
164
|
+
export { type Config as C, type Maybe as M, type SfContract as S, type CreateSdkReturn as a, type CreateSdkContextReturn as b, type SfStateProps as c, type SfState as d, createSfStateProvider as e };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { SDKApi, buildModule, middlewareModule } from '@vue-storefront/sdk';
|
|
2
|
-
import { ReactNode } from 'react';
|
|
2
|
+
import React, { ReactNode } from 'react';
|
|
3
3
|
|
|
4
4
|
declare const defaultMethodsRequestConfig: {
|
|
5
5
|
readonly unifiedCommerce: {
|
|
@@ -16,6 +16,9 @@ declare const defaultMethodsRequestConfig: {
|
|
|
16
16
|
readonly getProducts: {
|
|
17
17
|
readonly method: "GET";
|
|
18
18
|
};
|
|
19
|
+
readonly getCurrencies: {
|
|
20
|
+
readonly method: "GET";
|
|
21
|
+
};
|
|
19
22
|
readonly searchProducts: {
|
|
20
23
|
readonly method: "GET";
|
|
21
24
|
};
|
|
@@ -30,6 +33,44 @@ declare const defaultMethodsRequestConfig: {
|
|
|
30
33
|
};
|
|
31
34
|
};
|
|
32
35
|
|
|
36
|
+
type Maybe<TType> = TType | null;
|
|
37
|
+
|
|
38
|
+
type SfContract = {
|
|
39
|
+
SfCart: unknown;
|
|
40
|
+
SfCustomer: unknown;
|
|
41
|
+
SfCurrency: unknown;
|
|
42
|
+
SfLocale: unknown;
|
|
43
|
+
};
|
|
44
|
+
interface SfStateProps<TSfContract extends SfContract> {
|
|
45
|
+
currencies: TSfContract["SfCurrency"][];
|
|
46
|
+
currency: TSfContract["SfCurrency"];
|
|
47
|
+
locale: TSfContract["SfLocale"];
|
|
48
|
+
locales: TSfContract["SfLocale"][];
|
|
49
|
+
}
|
|
50
|
+
interface SfState<TSfContract extends SfContract> extends SfStateProps<TSfContract> {
|
|
51
|
+
cart: TSfContract["SfCart"] | null | undefined;
|
|
52
|
+
customer: TSfContract["SfCustomer"] | null | undefined;
|
|
53
|
+
setCart: (cart?: TSfContract["SfCart"] | null) => void;
|
|
54
|
+
setCurrencies: (currencies: TSfContract["SfCurrency"][]) => void;
|
|
55
|
+
setCurrency: (currency: TSfContract["SfCurrency"]) => void;
|
|
56
|
+
setCustomer: (customer?: TSfContract["SfCustomer"] | null) => void;
|
|
57
|
+
setLocale: (locale: TSfContract["SfLocale"]) => void;
|
|
58
|
+
setLocales: (locales: TSfContract["SfLocale"][]) => void;
|
|
59
|
+
}
|
|
60
|
+
declare function createSfStateProvider<TSfContract extends SfContract>(): {
|
|
61
|
+
SfStateProvider: ({ children, initialData, }: {
|
|
62
|
+
initialData: SfStateProps<TSfContract>;
|
|
63
|
+
} & {
|
|
64
|
+
children?: React.ReactNode;
|
|
65
|
+
}) => React.JSX.Element;
|
|
66
|
+
useSfCurrencyState: () => [TSfContract["SfCurrency"], (currency: TSfContract["SfCurrency"]) => void];
|
|
67
|
+
useSfCurrenciesState: () => [TSfContract["SfCurrency"][], (currencies: TSfContract["SfCurrency"][]) => void];
|
|
68
|
+
useSfLocaleState: () => [TSfContract["SfLocale"], (locale: TSfContract["SfLocale"]) => void];
|
|
69
|
+
useSfLocalesState: () => [TSfContract["SfLocale"][], (locales: TSfContract["SfLocale"][]) => void];
|
|
70
|
+
useSfCartState: () => [TSfContract["SfCart"], (cart?: TSfContract["SfCart"] | null) => void];
|
|
71
|
+
useSfCustomerState: () => [TSfContract["SfCustomer"], (customer?: TSfContract["SfCustomer"] | null) => void];
|
|
72
|
+
};
|
|
73
|
+
|
|
33
74
|
type GetSdkContext = {
|
|
34
75
|
/**
|
|
35
76
|
* A function that returns the request headers.
|
|
@@ -58,9 +99,10 @@ type StaticContext = {
|
|
|
58
99
|
};
|
|
59
100
|
type InjectedContext = DynamicContext & StaticContext;
|
|
60
101
|
type Config<TConfig> = (context: InjectedContext) => TConfig;
|
|
61
|
-
type
|
|
102
|
+
type AlokaiProviderProps<TSdk, TSfContract extends SfContract> = {
|
|
62
103
|
children: ReactNode;
|
|
63
104
|
sdk: TSdk;
|
|
105
|
+
initialData: SfStateProps<TSfContract>;
|
|
64
106
|
};
|
|
65
107
|
interface CreateSdkReturn<TConfig extends Record<string, any>> {
|
|
66
108
|
/**
|
|
@@ -108,9 +150,15 @@ interface CreateSdkReturn<TConfig extends Record<string, any>> {
|
|
|
108
150
|
*/
|
|
109
151
|
getSdk: (dynamicContext?: GetSdkContext) => SDKApi<TConfig>;
|
|
110
152
|
}
|
|
111
|
-
type CreateSdkContextReturn<TSdk extends SDKApi<any
|
|
112
|
-
({ children }:
|
|
113
|
-
() => TSdk
|
|
114
|
-
];
|
|
153
|
+
type CreateSdkContextReturn<TSdk extends SDKApi<any>, TSfContract extends SfContract> = Readonly<{
|
|
154
|
+
AlokaiProvider: ({ children, }: AlokaiProviderProps<TSdk, TSfContract>) => JSX.Element;
|
|
155
|
+
useSdk: () => TSdk;
|
|
156
|
+
useSfCurrencyState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrencyState"];
|
|
157
|
+
useSfCurrenciesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrenciesState"];
|
|
158
|
+
useSfLocaleState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocaleState"];
|
|
159
|
+
useSfLocalesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocalesState"];
|
|
160
|
+
useSfCartState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCartState"];
|
|
161
|
+
useSfCustomerState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCustomerState"];
|
|
162
|
+
}>;
|
|
115
163
|
|
|
116
|
-
export type
|
|
164
|
+
export { type Config as C, type Maybe as M, type SfContract as S, type CreateSdkReturn as a, type CreateSdkContextReturn as b, type SfStateProps as c, type SfState as d, createSfStateProvider as e };
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@vue-storefront/next",
|
|
3
3
|
"description": "Vue Storefront dedicated features for Next.js",
|
|
4
4
|
"license": "MIT",
|
|
5
|
-
"version": "
|
|
5
|
+
"version": "4.0.0-rc.0",
|
|
6
6
|
"exports": {
|
|
7
7
|
".": {
|
|
8
8
|
"import": "./dist/index.mjs",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"dist"
|
|
30
30
|
],
|
|
31
31
|
"scripts": {
|
|
32
|
-
"build": "tsup
|
|
32
|
+
"build": "tsup",
|
|
33
33
|
"build:app-router": "cd __tests__/apps/app-router && yarn install && yarn build",
|
|
34
34
|
"build:pages-router": "cd __tests__/apps/pages-router && yarn install && yarn build",
|
|
35
35
|
"dev:app-router": "cd __tests__/apps/app-router && yarn dev",
|
|
@@ -43,7 +43,8 @@
|
|
|
43
43
|
"test:unit": "vitest run"
|
|
44
44
|
},
|
|
45
45
|
"dependencies": {
|
|
46
|
-
"@vue-storefront/sdk": "^3.1.
|
|
46
|
+
"@vue-storefront/sdk": "^3.1.1",
|
|
47
|
+
"zustand": "^4.5.4"
|
|
47
48
|
},
|
|
48
49
|
"devDependencies": {
|
|
49
50
|
"@types/react": "^18.2.31",
|