@wix/headless-stores 0.0.110 → 0.0.111
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/cjs/dist/astro/actions/custom-checkout.d.ts +1 -3
- package/cjs/dist/astro/actions/custom-checkout.js +8 -4
- package/cjs/dist/astro/actions/index.js +17 -1
- package/cjs/dist/data-component-tags.js +5 -2
- package/cjs/dist/enums/index.js +18 -2
- package/cjs/dist/enums/social-platform-enums.js +7 -4
- package/cjs/dist/enums/sort-enums.js +6 -3
- package/cjs/dist/react/Category.js +64 -25
- package/cjs/dist/react/CategoryList.js +55 -14
- package/cjs/dist/react/Choice.js +32 -25
- package/cjs/dist/react/Option.js +68 -29
- package/cjs/dist/react/Product.js +194 -155
- package/cjs/dist/react/ProductList.js +84 -45
- package/cjs/dist/react/core/CategoryList.js +26 -16
- package/cjs/dist/react/core/Product.js +30 -20
- package/cjs/dist/react/core/ProductList.js +29 -21
- package/cjs/dist/react/core/ProductListFilters.js +30 -22
- package/cjs/dist/react/core/ProductListPagination.js +7 -4
- package/cjs/dist/react/core/ProductListSort.js +11 -6
- package/cjs/dist/react/core/ProductModifiers.js +25 -17
- package/cjs/dist/react/core/ProductVariantSelector.js +27 -19
- package/cjs/dist/react/core/SelectedVariant.js +28 -21
- package/cjs/dist/react/index.js +42 -6
- package/cjs/dist/react/types.js +5 -2
- package/cjs/dist/server-actions/custom-checkout-action.js +11 -8
- package/cjs/dist/server-actions/index.js +17 -1
- package/cjs/dist/services/buy-now-service.js +20 -15
- package/cjs/dist/services/categories-list-service.js +12 -8
- package/cjs/dist/services/index.js +25 -5
- package/cjs/dist/services/pay-now-service.js +16 -11
- package/cjs/dist/services/product-modifiers-service.js +16 -12
- package/cjs/dist/services/product-service.js +16 -12
- package/cjs/dist/services/products-list-search-service.d.ts +0 -1
- package/cjs/dist/services/products-list-search-service.js +1 -1
- package/cjs/dist/services/products-list-service.js +66 -59
- package/cjs/dist/services/selected-variant-service.js +21 -18
- package/cjs/dist/utils/index.js +9 -6
- package/cjs/dist/utils/url-params.js +5 -1
- package/dist/astro/actions/custom-checkout.d.ts +1 -3
- package/package.json +5 -5
|
@@ -45,6 +45,4 @@ import { type CustomLineItemCheckoutOptions } from '../../server-actions/index.j
|
|
|
45
45
|
* @see {@link https://docs.astro.build/en/guides/actions/} Astro Actions Documentation
|
|
46
46
|
* @see {@link https://dev.wix.com/docs/sdk/headless/api-reference/stores/checkout} Wix Stores Checkout API
|
|
47
47
|
*/
|
|
48
|
-
export declare const customCheckoutActionFactory: (factoryOpts: CustomLineItemCheckoutOptions) =>
|
|
49
|
-
orThrow: (input?: any) => Promise<string>;
|
|
50
|
-
} & string;
|
|
48
|
+
export declare const customCheckoutActionFactory: (factoryOpts: CustomLineItemCheckoutOptions) => any;
|
|
@@ -1,7 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.customCheckoutActionFactory = void 0;
|
|
1
4
|
/// <reference types="astro/env" />
|
|
2
5
|
// @ts-ignore
|
|
3
|
-
|
|
4
|
-
|
|
6
|
+
const astro_actions_1 = require("astro:actions");
|
|
7
|
+
const index_js_1 = require("../../server-actions/index.js");
|
|
5
8
|
/**
|
|
6
9
|
* Creates an Astro action factory for custom checkout functionality with line items.
|
|
7
10
|
*
|
|
@@ -48,6 +51,7 @@ import { getCustomLineItemCheckoutURLFactory, } from '../../server-actions/index
|
|
|
48
51
|
* @see {@link https://docs.astro.build/en/guides/actions/} Astro Actions Documentation
|
|
49
52
|
* @see {@link https://dev.wix.com/docs/sdk/headless/api-reference/stores/checkout} Wix Stores Checkout API
|
|
50
53
|
*/
|
|
51
|
-
|
|
52
|
-
handler: () => getCustomLineItemCheckoutURLFactory(factoryOpts)(),
|
|
54
|
+
const customCheckoutActionFactory = (factoryOpts) => (0, astro_actions_1.defineAction)({
|
|
55
|
+
handler: () => (0, index_js_1.getCustomLineItemCheckoutURLFactory)(factoryOpts)(),
|
|
53
56
|
});
|
|
57
|
+
exports.customCheckoutActionFactory = customCheckoutActionFactory;
|
|
@@ -1 +1,17 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
__exportStar(require("./custom-checkout.js"), exports);
|
|
@@ -1,4 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DataComponentTags = void 0;
|
|
4
|
+
var DataComponentTags;
|
|
2
5
|
(function (DataComponentTags) {
|
|
3
6
|
DataComponentTags["categoryListRoot"] = "stores.category-list-root";
|
|
4
7
|
DataComponentTags["categoryRoot"] = "stores.category-root";
|
|
@@ -6,4 +9,4 @@ export var DataComponentTags;
|
|
|
6
9
|
DataComponentTags["optionRoot"] = "stores.option-root";
|
|
7
10
|
DataComponentTags["productListRoot"] = "stores.product-list-root";
|
|
8
11
|
DataComponentTags["productRoot"] = "stores.product-root";
|
|
9
|
-
})(DataComponentTags || (DataComponentTags = {}));
|
|
12
|
+
})(DataComponentTags || (exports.DataComponentTags = DataComponentTags = {}));
|
package/cjs/dist/enums/index.js
CHANGED
|
@@ -1,2 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
__exportStar(require("./sort-enums.js"), exports);
|
|
18
|
+
__exportStar(require("./social-platform-enums.js"), exports);
|
|
@@ -1,10 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* Business logic enums for social sharing platforms (headless layer)
|
|
3
4
|
*/
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.SocialPlatformShareUrl = exports.SocialPlatform = void 0;
|
|
4
7
|
/**
|
|
5
8
|
* Enum for social sharing platforms (business identifiers)
|
|
6
9
|
*/
|
|
7
|
-
|
|
10
|
+
var SocialPlatform;
|
|
8
11
|
(function (SocialPlatform) {
|
|
9
12
|
SocialPlatform["FACEBOOK"] = "facebook";
|
|
10
13
|
SocialPlatform["TWITTER"] = "twitter";
|
|
@@ -13,15 +16,15 @@ export var SocialPlatform;
|
|
|
13
16
|
SocialPlatform["EMAIL"] = "email";
|
|
14
17
|
SocialPlatform["CLIPBOARD"] = "clipboard";
|
|
15
18
|
SocialPlatform["NATIVE"] = "native";
|
|
16
|
-
})(SocialPlatform || (SocialPlatform = {}));
|
|
19
|
+
})(SocialPlatform || (exports.SocialPlatform = SocialPlatform = {}));
|
|
17
20
|
/**
|
|
18
21
|
* Enum for social platform share URLs (business logic)
|
|
19
22
|
*/
|
|
20
|
-
|
|
23
|
+
var SocialPlatformShareUrl;
|
|
21
24
|
(function (SocialPlatformShareUrl) {
|
|
22
25
|
SocialPlatformShareUrl["FACEBOOK"] = "https://www.facebook.com/sharer/sharer.php";
|
|
23
26
|
SocialPlatformShareUrl["TWITTER"] = "https://twitter.com/intent/tweet";
|
|
24
27
|
SocialPlatformShareUrl["LINKEDIN"] = "https://www.linkedin.com/sharing/share-offsite/";
|
|
25
28
|
SocialPlatformShareUrl["WHATSAPP"] = "https://wa.me/";
|
|
26
29
|
SocialPlatformShareUrl["EMAIL"] = "mailto:";
|
|
27
|
-
})(SocialPlatformShareUrl || (SocialPlatformShareUrl = {}));
|
|
30
|
+
})(SocialPlatformShareUrl || (exports.SocialPlatformShareUrl = SocialPlatformShareUrl = {}));
|
|
@@ -1,9 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DEFAULT_SORT_TYPE = exports.SortType = void 0;
|
|
1
4
|
/**
|
|
2
5
|
* Enum for sort types used in the store
|
|
3
6
|
* Note: Cannot use SDK SortType as it's for aggregations (COUNT/VALUE)
|
|
4
7
|
* while this enum represents user-facing sort options
|
|
5
8
|
*/
|
|
6
|
-
|
|
9
|
+
var SortType;
|
|
7
10
|
(function (SortType) {
|
|
8
11
|
SortType["NEWEST"] = "newest";
|
|
9
12
|
SortType["NAME_ASC"] = "name_asc";
|
|
@@ -11,8 +14,8 @@ export var SortType;
|
|
|
11
14
|
SortType["PRICE_ASC"] = "price_asc";
|
|
12
15
|
SortType["PRICE_DESC"] = "price_desc";
|
|
13
16
|
SortType["RECOMMENDED"] = "recommended";
|
|
14
|
-
})(SortType || (SortType = {}));
|
|
17
|
+
})(SortType || (exports.SortType = SortType = {}));
|
|
15
18
|
/**
|
|
16
19
|
* Default sort type
|
|
17
20
|
*/
|
|
18
|
-
|
|
21
|
+
exports.DEFAULT_SORT_TYPE = SortType.NEWEST;
|
|
@@ -1,11 +1,50 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
19
|
+
var ownKeys = function(o) {
|
|
20
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
+
var ar = [];
|
|
22
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
+
return ar;
|
|
24
|
+
};
|
|
25
|
+
return ownKeys(o);
|
|
26
|
+
};
|
|
27
|
+
return function (mod) {
|
|
28
|
+
if (mod && mod.__esModule) return mod;
|
|
29
|
+
var result = {};
|
|
30
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
+
__setModuleDefault(result, mod);
|
|
32
|
+
return result;
|
|
33
|
+
};
|
|
34
|
+
})();
|
|
35
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
36
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
37
|
+
};
|
|
38
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
39
|
+
exports.CategoryFilter = exports.Raw = exports.ID = exports.Label = exports.Trigger = exports.Root = void 0;
|
|
40
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
41
|
+
const react_1 = __importDefault(require("react"));
|
|
42
|
+
const react_2 = require("@wix/headless-utils/react");
|
|
43
|
+
const CoreProductListFilters = __importStar(require("./core/ProductListFilters.js"));
|
|
44
|
+
const data_component_tags_js_1 = require("../data-component-tags.js");
|
|
45
|
+
const CategoryContext = react_1.default.createContext(null);
|
|
7
46
|
function useCategoryContext() {
|
|
8
|
-
const context =
|
|
47
|
+
const context = react_1.default.useContext(CategoryContext);
|
|
9
48
|
if (!context) {
|
|
10
49
|
throw new Error('useCategoryContext must be used within a Category.Root component');
|
|
11
50
|
}
|
|
@@ -39,9 +78,9 @@ var TestIds;
|
|
|
39
78
|
* </Category.Root>
|
|
40
79
|
* ```
|
|
41
80
|
*/
|
|
42
|
-
|
|
81
|
+
exports.Root = react_1.default.forwardRef((props, ref) => {
|
|
43
82
|
const { category, children } = props;
|
|
44
|
-
return (
|
|
83
|
+
return ((0, jsx_runtime_1.jsx)(CoreProductListFilters.CategoryFilter, { children: ({ selectedCategory, setSelectedCategory }) => {
|
|
45
84
|
// Determine if this category is selected by comparing with selectedCategory
|
|
46
85
|
const isSelected = selectedCategory?._id === category._id;
|
|
47
86
|
const contextValue = {
|
|
@@ -50,10 +89,10 @@ export const Root = React.forwardRef((props, ref) => {
|
|
|
50
89
|
selectedCategory,
|
|
51
90
|
setSelectedCategory,
|
|
52
91
|
};
|
|
53
|
-
return (
|
|
92
|
+
return ((0, jsx_runtime_1.jsx)(CategoryContext.Provider, { value: contextValue, children: (0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, "data-component-tag": data_component_tags_js_1.DataComponentTags.categoryRoot, "data-testid": TestIds.categoryRoot, children: children }) }));
|
|
54
93
|
} }));
|
|
55
94
|
});
|
|
56
|
-
Root.displayName = 'Category.Root';
|
|
95
|
+
exports.Root.displayName = 'Category.Root';
|
|
57
96
|
/**
|
|
58
97
|
* Interactive element for selecting or triggering category actions.
|
|
59
98
|
* Provides category data and selection state to custom render functions.
|
|
@@ -83,7 +122,7 @@ Root.displayName = 'Category.Root';
|
|
|
83
122
|
* </Category.Trigger>
|
|
84
123
|
* ```
|
|
85
124
|
*/
|
|
86
|
-
|
|
125
|
+
exports.Trigger = react_1.default.forwardRef((props, ref) => {
|
|
87
126
|
const { asChild, children, onSelect, className, ...otherProps } = props;
|
|
88
127
|
const { category, isSelected, setSelectedCategory } = useCategoryContext();
|
|
89
128
|
const handleSelect = () => {
|
|
@@ -100,11 +139,11 @@ export const Trigger = React.forwardRef((props, ref) => {
|
|
|
100
139
|
onSelect(category);
|
|
101
140
|
}
|
|
102
141
|
};
|
|
103
|
-
return (
|
|
142
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className, onClick: handleSelect, "data-testid": TestIds.categoryTrigger, "data-selected": isSelected ? 'true' : 'false', customElement: children, customElementProps: {
|
|
104
143
|
category,
|
|
105
144
|
isSelected,
|
|
106
145
|
onSelect: handleSelect,
|
|
107
|
-
}, content: category.name, ...otherProps, children:
|
|
146
|
+
}, content: category.name, ...otherProps, children: (0, jsx_runtime_1.jsx)("button", { children: category.name }) }));
|
|
108
147
|
});
|
|
109
148
|
/**
|
|
110
149
|
* Displays the category name or label.
|
|
@@ -131,10 +170,10 @@ export const Trigger = React.forwardRef((props, ref) => {
|
|
|
131
170
|
* </Category.Label>
|
|
132
171
|
* ```
|
|
133
172
|
*/
|
|
134
|
-
|
|
173
|
+
exports.Label = react_1.default.forwardRef((props, ref) => {
|
|
135
174
|
const { asChild, children, className } = props;
|
|
136
175
|
const { category, isSelected } = useCategoryContext();
|
|
137
|
-
return (
|
|
176
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.categoryLabel, "data-selected": isSelected ? 'true' : 'false', customElement: children, customElementProps: { name: category.name, category }, content: category.name, children: (0, jsx_runtime_1.jsx)("span", { children: category.name }) }));
|
|
138
177
|
});
|
|
139
178
|
/**
|
|
140
179
|
* Provides access to the category ID for advanced use cases.
|
|
@@ -161,11 +200,11 @@ export const Label = React.forwardRef((props, ref) => {
|
|
|
161
200
|
* </Category.ID>
|
|
162
201
|
* ```
|
|
163
202
|
*/
|
|
164
|
-
|
|
203
|
+
exports.ID = react_1.default.forwardRef((props, ref) => {
|
|
165
204
|
const { asChild, children, className } = props;
|
|
166
205
|
const { category, isSelected } = useCategoryContext();
|
|
167
206
|
const id = category._id || '';
|
|
168
|
-
return (
|
|
207
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className || 'sr-only', "data-testid": TestIds.categoryId, "data-selected": isSelected ? 'true' : 'false', customElement: children, customElementProps: { id, category }, content: id, children: (0, jsx_runtime_1.jsx)("span", { children: id }) }));
|
|
169
208
|
});
|
|
170
209
|
/**
|
|
171
210
|
* Provides access to the full category data for advanced use cases.
|
|
@@ -189,10 +228,10 @@ export const ID = React.forwardRef((props, ref) => {
|
|
|
189
228
|
* </Category.Raw>
|
|
190
229
|
* ```
|
|
191
230
|
*/
|
|
192
|
-
|
|
231
|
+
exports.Raw = react_1.default.forwardRef((props, ref) => {
|
|
193
232
|
const { asChild, children, className } = props;
|
|
194
233
|
const { category, isSelected } = useCategoryContext();
|
|
195
|
-
return (
|
|
234
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className || 'sr-only', "data-testid": TestIds.categoryRaw, "data-selected": isSelected ? 'true' : 'false', customElement: children, customElementProps: { category, isSelected }, children: (0, jsx_runtime_1.jsx)("span", { children: JSON.stringify(category) }) }));
|
|
196
235
|
});
|
|
197
236
|
/**
|
|
198
237
|
* Category filter component that provides category selection functionality.
|
|
@@ -222,14 +261,14 @@ export const Raw = React.forwardRef((props, ref) => {
|
|
|
222
261
|
* </CategoryFilter>
|
|
223
262
|
* ```
|
|
224
263
|
*/
|
|
225
|
-
|
|
264
|
+
exports.CategoryFilter = react_1.default.forwardRef((props, ref) => {
|
|
226
265
|
const { asChild, children, className } = props;
|
|
227
266
|
const label = props.label || 'Selected:';
|
|
228
|
-
return (
|
|
229
|
-
return (
|
|
267
|
+
return ((0, jsx_runtime_1.jsx)(CoreProductListFilters.CategoryFilter, { children: ({ selectedCategory, setSelectedCategory }) => {
|
|
268
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.categoryFilter, "data-selected": selectedCategory ? 'true' : 'false', customElement: children, customElementProps: {
|
|
230
269
|
selectedCategory,
|
|
231
270
|
setSelectedCategory,
|
|
232
|
-
}, children:
|
|
271
|
+
}, children: (0, jsx_runtime_1.jsx)("div", { children: selectedCategory && ((0, jsx_runtime_1.jsxs)("span", { children: [label, " ", selectedCategory.name] })) }) }));
|
|
233
272
|
} }));
|
|
234
273
|
});
|
|
235
|
-
CategoryFilter.displayName = 'CategoryFilter';
|
|
274
|
+
exports.CategoryFilter.displayName = 'CategoryFilter';
|
|
@@ -1,9 +1,49 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
19
|
+
var ownKeys = function(o) {
|
|
20
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
+
var ar = [];
|
|
22
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
+
return ar;
|
|
24
|
+
};
|
|
25
|
+
return ownKeys(o);
|
|
26
|
+
};
|
|
27
|
+
return function (mod) {
|
|
28
|
+
if (mod && mod.__esModule) return mod;
|
|
29
|
+
var result = {};
|
|
30
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
+
__setModuleDefault(result, mod);
|
|
32
|
+
return result;
|
|
33
|
+
};
|
|
34
|
+
})();
|
|
35
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
36
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
37
|
+
};
|
|
38
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
39
|
+
exports.Loading = exports.Root = void 0;
|
|
40
|
+
exports.CategoryRepeater = CategoryRepeater;
|
|
41
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
42
|
+
const react_1 = __importDefault(require("react"));
|
|
43
|
+
const CoreCategoryList = __importStar(require("./core/CategoryList.js"));
|
|
44
|
+
const Category = __importStar(require("./Category.js"));
|
|
45
|
+
const react_2 = require("@wix/headless-utils/react");
|
|
46
|
+
const data_component_tags_js_1 = require("../data-component-tags.js");
|
|
7
47
|
var TestIds;
|
|
8
48
|
(function (TestIds) {
|
|
9
49
|
TestIds["categoryListRoot"] = "category-list";
|
|
@@ -32,13 +72,14 @@ var TestIds;
|
|
|
32
72
|
* }
|
|
33
73
|
* ```
|
|
34
74
|
*/
|
|
35
|
-
|
|
75
|
+
const Root = (props) => {
|
|
36
76
|
const { categories, categoriesListConfig, children, emptyState } = props;
|
|
37
77
|
// Create service config, prioritizing categoriesListConfig, then categories prop
|
|
38
78
|
const serviceConfig = categoriesListConfig || (categories ? { categories } : { categories: [] });
|
|
39
|
-
return (
|
|
79
|
+
return ((0, jsx_runtime_1.jsx)(CoreCategoryList.Root, { categoriesListConfig: serviceConfig, children: (0, jsx_runtime_1.jsxs)(react_2.AsChildSlot, { "data-testid": TestIds.categoryListRoot, "data-component-tag": data_component_tags_js_1.DataComponentTags.categoryListRoot, children: [children, emptyState && ((0, jsx_runtime_1.jsx)(CoreCategoryList.EmptyState, { children: emptyState }))] }) }));
|
|
40
80
|
};
|
|
41
|
-
Root
|
|
81
|
+
exports.Root = Root;
|
|
82
|
+
exports.Root.displayName = 'CategoryList.Root';
|
|
42
83
|
/**
|
|
43
84
|
* Displays loading state while category data is being fetched.
|
|
44
85
|
* Only displays its children when the categories list is currently loading.
|
|
@@ -57,9 +98,9 @@ Root.displayName = 'CategoryList.Root';
|
|
|
57
98
|
* }
|
|
58
99
|
* ```
|
|
59
100
|
*/
|
|
60
|
-
|
|
101
|
+
exports.Loading = react_1.default.forwardRef((props, ref) => {
|
|
61
102
|
const { asChild, children, className } = props;
|
|
62
|
-
return (
|
|
103
|
+
return ((0, jsx_runtime_1.jsx)(CoreCategoryList.Loading, { children: (0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className, customElement: children, children: (0, jsx_runtime_1.jsx)("h1", { children: "Loading..." }) }) }));
|
|
63
104
|
});
|
|
64
105
|
/**
|
|
65
106
|
* Repeats for each category in the list, providing individual category context.
|
|
@@ -81,11 +122,11 @@ export const Loading = React.forwardRef((props, ref) => {
|
|
|
81
122
|
* }
|
|
82
123
|
* ```
|
|
83
124
|
*/
|
|
84
|
-
|
|
125
|
+
function CategoryRepeater(props) {
|
|
85
126
|
// const { children, asChild = false, className } = props;
|
|
86
127
|
const { children } = props;
|
|
87
128
|
// Note: maxDepth is not implemented yet as it depends on category hierarchy structure
|
|
88
|
-
return (
|
|
89
|
-
return (
|
|
129
|
+
return ((0, jsx_runtime_1.jsx)(CoreCategoryList.ItemContent, { children: ({ category }) => {
|
|
130
|
+
return ((0, jsx_runtime_1.jsx)(Category.Root, { category: category, children: children }, category._id));
|
|
90
131
|
} }));
|
|
91
132
|
}
|
package/cjs/dist/react/Choice.js
CHANGED
|
@@ -1,8 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.FreeText = exports.Color = exports.Text = exports.Root = exports.ChoiceContext = void 0;
|
|
7
|
+
exports.useChoiceContext = useChoiceContext;
|
|
8
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
9
|
+
const react_1 = __importDefault(require("react"));
|
|
10
|
+
const ProductModifiers_js_1 = require("./core/ProductModifiers.js");
|
|
11
|
+
const react_2 = require("@wix/headless-utils/react");
|
|
12
|
+
const data_component_tags_js_1 = require("../data-component-tags.js");
|
|
6
13
|
var TestIds;
|
|
7
14
|
(function (TestIds) {
|
|
8
15
|
TestIds["choiceRoot"] = "choice-root";
|
|
@@ -11,14 +18,14 @@ var TestIds;
|
|
|
11
18
|
TestIds["choiceFreetext"] = "choice-freetext";
|
|
12
19
|
})(TestIds || (TestIds = {}));
|
|
13
20
|
// Create a context for individual choices
|
|
14
|
-
|
|
21
|
+
exports.ChoiceContext = react_1.default.createContext(null);
|
|
15
22
|
/**
|
|
16
23
|
* Hook to access ChoiceContext with proper error handling
|
|
17
24
|
* @throws {Error} When used outside of a Choice context provider
|
|
18
25
|
* @returns {ChoiceContextValue} The choice context value
|
|
19
26
|
*/
|
|
20
|
-
|
|
21
|
-
const context =
|
|
27
|
+
function useChoiceContext() {
|
|
28
|
+
const context = react_1.default.useContext(exports.ChoiceContext);
|
|
22
29
|
if (!context) {
|
|
23
30
|
throw new Error('useChoiceContext must be used within a Choice context provider (Option.ChoiceRepeater)');
|
|
24
31
|
}
|
|
@@ -36,21 +43,21 @@ export function useChoiceContext() {
|
|
|
36
43
|
* </Choice.Root>
|
|
37
44
|
* ```
|
|
38
45
|
*/
|
|
39
|
-
|
|
46
|
+
exports.Root = react_1.default.forwardRef((props, ref) => {
|
|
40
47
|
const { children } = props;
|
|
41
|
-
const choiceContext =
|
|
48
|
+
const choiceContext = react_1.default.useContext(exports.ChoiceContext);
|
|
42
49
|
if (!choiceContext) {
|
|
43
50
|
return null; // Should be used within Option.ChoiceRepeater
|
|
44
51
|
}
|
|
45
52
|
const { choice } = choiceContext;
|
|
46
53
|
const attributes = {
|
|
47
|
-
'data-component-tag': DataComponentTags.choiceRoot,
|
|
54
|
+
'data-component-tag': data_component_tags_js_1.DataComponentTags.choiceRoot,
|
|
48
55
|
'data-testid': TestIds.choiceRoot,
|
|
49
56
|
'data-type': choice?.type,
|
|
50
57
|
};
|
|
51
|
-
return (
|
|
58
|
+
return ((0, jsx_runtime_1.jsx)("div", { ...attributes, ref: ref, children: children }));
|
|
52
59
|
});
|
|
53
|
-
Root.displayName = 'Choice.Root';
|
|
60
|
+
exports.Root.displayName = 'Choice.Root';
|
|
54
61
|
/**
|
|
55
62
|
* Text-based choice button.
|
|
56
63
|
*
|
|
@@ -80,9 +87,9 @@ Root.displayName = 'Choice.Root';
|
|
|
80
87
|
* - `data-selected` - Is Choice selected
|
|
81
88
|
* - `disabled` - Is Choice disabled (not in stock)
|
|
82
89
|
*/
|
|
83
|
-
|
|
90
|
+
exports.Text = react_1.default.forwardRef((props, ref) => {
|
|
84
91
|
const { asChild, children, className, ...otherProps } = props;
|
|
85
|
-
const choiceContext =
|
|
92
|
+
const choiceContext = react_1.default.useContext(exports.ChoiceContext);
|
|
86
93
|
if (!choiceContext) {
|
|
87
94
|
return null; // Should be used within Option.ChoiceRepeater
|
|
88
95
|
}
|
|
@@ -94,7 +101,7 @@ export const Text = React.forwardRef((props, ref) => {
|
|
|
94
101
|
if (!isVisible)
|
|
95
102
|
return null;
|
|
96
103
|
const choiceId = choice?.choiceId || '';
|
|
97
|
-
return (
|
|
104
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.choiceText, "data-selected": isSelected ? 'true' : 'false', disabled: !isInStock && !isPreOrderEnabled, onClick: select, customElement: children, customElementProps: { id: choiceId, value }, content: value, ...otherProps, children: (0, jsx_runtime_1.jsx)("button", { children: value }) }));
|
|
98
105
|
});
|
|
99
106
|
/**
|
|
100
107
|
* Color swatch choice.
|
|
@@ -129,9 +136,9 @@ export const Text = React.forwardRef((props, ref) => {
|
|
|
129
136
|
* - `data-selected` - Is Choice selected
|
|
130
137
|
* - `disabled` - Is Choice disabled (not in stock)
|
|
131
138
|
*/
|
|
132
|
-
|
|
139
|
+
exports.Color = react_1.default.forwardRef((props, ref) => {
|
|
133
140
|
const { asChild, children, className, ...otherProps } = props;
|
|
134
|
-
const choiceContext =
|
|
141
|
+
const choiceContext = react_1.default.useContext(exports.ChoiceContext);
|
|
135
142
|
if (!choiceContext) {
|
|
136
143
|
return null; // Should be used within Option.ChoiceRepeater
|
|
137
144
|
}
|
|
@@ -143,11 +150,11 @@ export const Color = React.forwardRef((props, ref) => {
|
|
|
143
150
|
if (!isVisible)
|
|
144
151
|
return null;
|
|
145
152
|
const { colorCode, choiceId } = choice;
|
|
146
|
-
return (
|
|
153
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.choiceColor, "data-selected": isSelected ? 'true' : 'false', disabled: !isInStock && !isPreOrderEnabled, onClick: select, customElement: children, customElementProps: {
|
|
147
154
|
colorCode: colorCode || '',
|
|
148
155
|
name: value,
|
|
149
156
|
id: choiceId || '',
|
|
150
|
-
}, ...otherProps, children:
|
|
157
|
+
}, ...otherProps, children: (0, jsx_runtime_1.jsx)("button", { style: { backgroundColor: colorCode }, title: value }) }));
|
|
151
158
|
});
|
|
152
159
|
/**
|
|
153
160
|
* Provides a free text input for variant selection.
|
|
@@ -182,9 +189,9 @@ export const Color = React.forwardRef((props, ref) => {
|
|
|
182
189
|
* - `data-testid="choice-free-text"` - Applied to free text input
|
|
183
190
|
* - `data-selected` - Is Choice selected
|
|
184
191
|
*/
|
|
185
|
-
|
|
192
|
+
exports.FreeText = react_1.default.forwardRef((props, ref) => {
|
|
186
193
|
const { asChild, children, className, ...otherProps } = props;
|
|
187
|
-
const choiceContext =
|
|
194
|
+
const choiceContext = react_1.default.useContext(exports.ChoiceContext);
|
|
188
195
|
if (!choiceContext) {
|
|
189
196
|
return null; // Should be used within Option.ChoiceRepeater
|
|
190
197
|
}
|
|
@@ -195,19 +202,19 @@ export const FreeText = React.forwardRef((props, ref) => {
|
|
|
195
202
|
// Don't render if not visible (handled by ProductVariantSelector in Root)
|
|
196
203
|
if (!isVisible)
|
|
197
204
|
return null;
|
|
198
|
-
return (
|
|
205
|
+
return ((0, jsx_runtime_1.jsx)(ProductModifiers_js_1.FreeText, { modifier: choice, children: ({ value, setText, placeholder, maxChars }) => {
|
|
199
206
|
const handleChange = (e) => {
|
|
200
207
|
setText(e.target.value);
|
|
201
208
|
if (onValueChange) {
|
|
202
209
|
onValueChange(e.target.value);
|
|
203
210
|
}
|
|
204
211
|
};
|
|
205
|
-
return (
|
|
212
|
+
return ((0, jsx_runtime_1.jsx)(react_2.AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.choiceFreetext, "data-selected": isSelected ? 'true' : 'false', customElement: children, customElementProps: {
|
|
206
213
|
minCharCount: choice?.minCharCount,
|
|
207
214
|
maxCharCount: choice?.maxCharCount,
|
|
208
215
|
defaultAddedPrice: choice?.addedPrice || undefined,
|
|
209
216
|
title: choice?.name || undefined,
|
|
210
217
|
onChange: handleChange,
|
|
211
|
-
}, ...otherProps, children:
|
|
218
|
+
}, ...otherProps, children: (0, jsx_runtime_1.jsx)("textarea", { placeholder: placeholder, rows: 3, value: value, maxLength: maxChars, onChange: handleChange }) }));
|
|
212
219
|
} }));
|
|
213
220
|
});
|