@wix/headless-stores 0.0.41 → 0.0.43

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.
Files changed (41) hide show
  1. package/cjs/dist/react/ProductList.d.ts +31 -3
  2. package/cjs/dist/react/ProductList.js +33 -5
  3. package/cjs/dist/react/ProductListFilters.d.ts +100 -111
  4. package/cjs/dist/react/ProductListFilters.js +105 -115
  5. package/cjs/dist/react/ProductListPagination.d.ts +89 -96
  6. package/cjs/dist/react/ProductListPagination.js +96 -104
  7. package/cjs/dist/react/ProductListSort.d.ts +26 -57
  8. package/cjs/dist/react/ProductListSort.js +26 -58
  9. package/cjs/dist/services/index.d.ts +1 -3
  10. package/cjs/dist/services/index.js +1 -3
  11. package/cjs/dist/services/products-list-search-service.d.ts +220 -0
  12. package/cjs/dist/services/products-list-search-service.js +813 -0
  13. package/cjs/dist/services/products-list-service.d.ts +28 -11
  14. package/cjs/dist/services/products-list-service.js +26 -6
  15. package/dist/react/ProductList.d.ts +31 -3
  16. package/dist/react/ProductList.js +33 -5
  17. package/dist/react/ProductListFilters.d.ts +100 -111
  18. package/dist/react/ProductListFilters.js +105 -115
  19. package/dist/react/ProductListPagination.d.ts +89 -96
  20. package/dist/react/ProductListPagination.js +96 -104
  21. package/dist/react/ProductListSort.d.ts +26 -57
  22. package/dist/react/ProductListSort.js +26 -58
  23. package/dist/services/index.d.ts +1 -3
  24. package/dist/services/index.js +1 -3
  25. package/dist/services/products-list-search-service.d.ts +220 -0
  26. package/dist/services/products-list-search-service.js +813 -0
  27. package/dist/services/products-list-service.d.ts +28 -11
  28. package/dist/services/products-list-service.js +26 -6
  29. package/package.json +2 -2
  30. package/cjs/dist/services/products-list-filters-service.d.ts +0 -309
  31. package/cjs/dist/services/products-list-filters-service.js +0 -504
  32. package/cjs/dist/services/products-list-pagination-service.d.ts +0 -186
  33. package/cjs/dist/services/products-list-pagination-service.js +0 -179
  34. package/cjs/dist/services/products-list-sort-service.d.ts +0 -117
  35. package/cjs/dist/services/products-list-sort-service.js +0 -144
  36. package/dist/services/products-list-filters-service.d.ts +0 -309
  37. package/dist/services/products-list-filters-service.js +0 -504
  38. package/dist/services/products-list-pagination-service.d.ts +0 -186
  39. package/dist/services/products-list-pagination-service.js +0 -179
  40. package/dist/services/products-list-sort-service.d.ts +0 -117
  41. package/dist/services/products-list-sort-service.js +0 -144
@@ -1,70 +1,42 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { createServicesMap } from "@wix/services-manager";
3
- import { useService, WixServices } from "@wix/services-manager-react";
4
- import { ProductsListPaginationService, ProductsListPaginationServiceDefinition, } from "../services/products-list-pagination-service.js";
1
+ import { useService } from "@wix/services-manager-react";
2
+ import { ProductsListSearchServiceDefinition } from "../services/products-list-search-service.js";
5
3
  import { ProductsListServiceDefinition } from "../services/products-list-service.js";
6
- /**
7
- * Root component that provides the ProductListPagination service context to its children.
8
- * This component sets up the necessary services for managing products list pagination.
9
- *
10
- * @order 1
11
- * @component
12
- * @example
13
- * ```tsx
14
- * import { ProductListPagination } from '@wix/stores/components';
15
- *
16
- * function PaginationSection() {
17
- * return (
18
- * <ProductListPagination.Root>
19
- * <ProductListPagination.NextPageTrigger>
20
- * {({ nextPage, hasNextPage }) => (
21
- * <button
22
- * onClick={nextPage}
23
- * disabled={!hasNextPage}
24
- * >
25
- * Next Page
26
- * </button>
27
- * )}
28
- * </ProductListPagination.NextPageTrigger>
29
- * </ProductListPagination.Root>
30
- * );
31
- * }
32
- * ```
33
- */
34
- export function Root(props) {
35
- return (_jsx(WixServices, { servicesMap: createServicesMap().addService(ProductsListPaginationServiceDefinition, ProductsListPaginationService), children: props.children }));
36
- }
37
4
  /**
38
5
  * Headless component for managing page size (items per page)
39
6
  *
40
7
  * @component
41
8
  * @example
42
9
  * ```tsx
43
- * import { ProductListPagination } from '@wix/stores/components';
10
+ * import { ProductList, ProductListPagination } from '@wix/stores/components';
44
11
  *
45
12
  * function PageSizeSelector() {
46
13
  * return (
47
- * <ProductListPagination.PageSize>
48
- * {({ currentLimit, setLimit }) => (
49
- * <div>
50
- * <label>Items per page:</label>
51
- * <select
52
- * value={currentLimit}
53
- * onChange={(e) => setLimit(Number(e.target.value))}
54
- * >
55
- * <option value={10}>10</option>
56
- * <option value={20}>20</option>
57
- * <option value={50}>50</option>
58
- * </select>
59
- * </div>
60
- * )}
61
- * </ProductListPagination.PageSize>
14
+ * <ProductList.Root
15
+ * productsListConfig={{ products: [], searchOptions: {}, pagingMetadata: {}, aggregations: {} }}
16
+ * productsListSearchConfig={{ customizations: [] }}
17
+ * >
18
+ * <ProductListPagination.PageSize>
19
+ * {({ currentLimit, setLimit }) => (
20
+ * <div>
21
+ * <label>Items per page:</label>
22
+ * <select
23
+ * value={currentLimit}
24
+ * onChange={(e) => setLimit(Number(e.target.value))}
25
+ * >
26
+ * <option value={10}>10</option>
27
+ * <option value={20}>20</option>
28
+ * <option value={50}>50</option>
29
+ * </select>
30
+ * </div>
31
+ * )}
32
+ * </ProductListPagination.PageSize>
33
+ * </ProductList.Root>
62
34
  * );
63
35
  * }
64
36
  * ```
65
37
  */
66
38
  export function PageSize(props) {
67
- const service = useService(ProductsListPaginationServiceDefinition);
39
+ const service = useService(ProductsListSearchServiceDefinition);
68
40
  const currentLimit = service.currentLimit.get();
69
41
  const setLimit = service.setLimit;
70
42
  return typeof props.children === "function"
@@ -77,27 +49,32 @@ export function PageSize(props) {
77
49
  * @component
78
50
  * @example
79
51
  * ```tsx
80
- * import { ProductListPagination } from '@wix/stores/components';
52
+ * import { ProductList, ProductListPagination } from '@wix/stores/components';
81
53
  *
82
54
  * function NextPageButton() {
83
55
  * return (
84
- * <ProductListPagination.NextPageTrigger>
85
- * {({ nextPage, hasNextPage }) => (
86
- * <button
87
- * onClick={nextPage}
88
- * disabled={!hasNextPage}
89
- * className={hasNextPage ? 'enabled' : 'disabled'}
90
- * >
91
- * Next →
92
- * </button>
93
- * )}
94
- * </ProductListPagination.NextPageTrigger>
56
+ * <ProductList.Root
57
+ * productsListConfig={{ products: [], searchOptions: {}, pagingMetadata: {}, aggregations: {} }}
58
+ * productsListSearchConfig={{ customizations: [] }}
59
+ * >
60
+ * <ProductListPagination.NextPageTrigger>
61
+ * {({ nextPage, hasNextPage }) => (
62
+ * <button
63
+ * onClick={nextPage}
64
+ * disabled={!hasNextPage}
65
+ * className={hasNextPage ? 'enabled' : 'disabled'}
66
+ * >
67
+ * Next →
68
+ * </button>
69
+ * )}
70
+ * </ProductListPagination.NextPageTrigger>
71
+ * </ProductList.Root>
95
72
  * );
96
73
  * }
97
74
  * ```
98
75
  */
99
76
  export function NextPageTrigger(props) {
100
- const service = useService(ProductsListPaginationServiceDefinition);
77
+ const service = useService(ProductsListSearchServiceDefinition);
101
78
  const nextPage = service.nextPage;
102
79
  const hasNextPage = service.hasNextPage.get();
103
80
  return typeof props.children === "function"
@@ -110,27 +87,32 @@ export function NextPageTrigger(props) {
110
87
  * @component
111
88
  * @example
112
89
  * ```tsx
113
- * import { ProductListPagination } from '@wix/stores/components';
90
+ * import { ProductList, ProductListPagination } from '@wix/stores/components';
114
91
  *
115
92
  * function PrevPageButton() {
116
93
  * return (
117
- * <ProductListPagination.PreviousPageTrigger>
118
- * {({ prevPage, hasPrevPage }) => (
119
- * <button
120
- * onClick={prevPage}
121
- * disabled={!hasPrevPage}
122
- * className={hasPrevPage ? 'enabled' : 'disabled'}
123
- * >
124
- * ← Previous
125
- * </button>
126
- * )}
127
- * </ProductListPagination.PreviousPageTrigger>
94
+ * <ProductList.Root
95
+ * productsListConfig={{ products: [], searchOptions: {}, pagingMetadata: {}, aggregations: {} }}
96
+ * productsListSearchConfig={{ customizations: [] }}
97
+ * >
98
+ * <ProductListPagination.PreviousPageTrigger>
99
+ * {({ prevPage, hasPrevPage }) => (
100
+ * <button
101
+ * onClick={prevPage}
102
+ * disabled={!hasPrevPage}
103
+ * className={hasPrevPage ? 'enabled' : 'disabled'}
104
+ * >
105
+ * ← Previous
106
+ * </button>
107
+ * )}
108
+ * </ProductListPagination.PreviousPageTrigger>
109
+ * </ProductList.Root>
128
110
  * );
129
111
  * }
130
112
  * ```
131
113
  */
132
114
  export function PreviousPageTrigger(props) {
133
- const service = useService(ProductsListPaginationServiceDefinition);
115
+ const service = useService(ProductsListSearchServiceDefinition);
134
116
  const prevPage = service.prevPage;
135
117
  const hasPrevPage = service.hasPrevPage.get();
136
118
  return typeof props.children === "function"
@@ -143,27 +125,32 @@ export function PreviousPageTrigger(props) {
143
125
  * @component
144
126
  * @example
145
127
  * ```tsx
146
- * import { ProductListPagination } from '@wix/stores/components';
128
+ * import { ProductList, ProductListPagination } from '@wix/stores/components';
147
129
  *
148
130
  * function FirstPageButton() {
149
131
  * return (
150
- * <ProductListPagination.FirstPageTrigger>
151
- * {({ navigateToFirstPage, hasPrevPage }) => (
152
- * <button
153
- * onClick={navigateToFirstPage}
154
- * disabled={!hasPrevPage}
155
- * title="Go to first page"
156
- * >
157
- * ⏮ First
158
- * </button>
159
- * )}
160
- * </ProductListPagination.FirstPageTrigger>
132
+ * <ProductList.Root
133
+ * productsListConfig={{ products: [], searchOptions: {}, pagingMetadata: {}, aggregations: {} }}
134
+ * productsListSearchConfig={{ customizations: [] }}
135
+ * >
136
+ * <ProductListPagination.FirstPageTrigger>
137
+ * {({ navigateToFirstPage, hasPrevPage }) => (
138
+ * <button
139
+ * onClick={navigateToFirstPage}
140
+ * disabled={!hasPrevPage}
141
+ * title="Go to first page"
142
+ * >
143
+ * ⏮ First
144
+ * </button>
145
+ * )}
146
+ * </ProductListPagination.FirstPageTrigger>
147
+ * </ProductList.Root>
161
148
  * );
162
149
  * }
163
150
  * ```
164
151
  */
165
152
  export function FirstPageTrigger(props) {
166
- const service = useService(ProductsListPaginationServiceDefinition);
153
+ const service = useService(ProductsListSearchServiceDefinition);
167
154
  const navigateToFirstPage = service.navigateToFirstPage;
168
155
  const hasPrevPage = service.hasPrevPage.get();
169
156
  return typeof props.children === "function"
@@ -176,27 +163,32 @@ export function FirstPageTrigger(props) {
176
163
  * @component
177
164
  * @example
178
165
  * ```tsx
179
- * import { ProductListPagination } from '@wix/stores/components';
166
+ * import { ProductList, ProductListPagination } from '@wix/stores/components';
180
167
  *
181
168
  * function LoadMoreButton() {
182
169
  * return (
183
- * <ProductListPagination.LoadMoreTrigger>
184
- * {({ loadMore, hasMoreProducts, isLoading }) => (
185
- * <button
186
- * onClick={() => loadMore(10)}
187
- * disabled={!hasMoreProducts || isLoading}
188
- * className="load-more-btn"
189
- * >
190
- * {isLoading ? 'Loading...' : hasMoreProducts ? 'Load More' : 'No More Products'}
191
- * </button>
192
- * )}
193
- * </ProductListPagination.LoadMoreTrigger>
170
+ * <ProductList.Root
171
+ * productsListConfig={{ products: [], searchOptions: {}, pagingMetadata: {}, aggregations: {} }}
172
+ * productsListSearchConfig={{ customizations: [] }}
173
+ * >
174
+ * <ProductListPagination.LoadMoreTrigger>
175
+ * {({ loadMore, hasMoreProducts, isLoading }) => (
176
+ * <button
177
+ * onClick={() => loadMore(10)}
178
+ * disabled={!hasMoreProducts || isLoading}
179
+ * className="load-more-btn"
180
+ * >
181
+ * {isLoading ? 'Loading...' : hasMoreProducts ? 'Load More' : 'No More Products'}
182
+ * </button>
183
+ * )}
184
+ * </ProductListPagination.LoadMoreTrigger>
185
+ * </ProductList.Root>
194
186
  * );
195
187
  * }
196
188
  * ```
197
189
  */
198
190
  export function LoadMoreTrigger(props) {
199
- const service = useService(ProductsListPaginationServiceDefinition);
191
+ const service = useService(ProductsListSearchServiceDefinition);
200
192
  const productsListService = useService(ProductsListServiceDefinition);
201
193
  const loadMore = service.loadMore;
202
194
  const hasMoreProducts = service.hasNextPage.get();
@@ -1,40 +1,4 @@
1
- import { SortType } from "../services/products-list-sort-service.js";
2
- export interface RootProps {
3
- children: React.ReactNode;
4
- }
5
- /**
6
- * Root component that provides the ProductListSort service context to its children.
7
- * This component sets up the necessary services for managing products list sorting.
8
- *
9
- * @order 1
10
- * @component
11
- * @example
12
- * ```tsx
13
- * import { ProductListSort } from '@wix/stores/components';
14
- *
15
- * function SortSection() {
16
- * return (
17
- * <ProductListSort.Root>
18
- * <ProductListSort.Options>
19
- * {({ selectedSortOption, updateSortOption, sortOptions }) => (
20
- * <select
21
- * value={selectedSortOption}
22
- * onChange={(e) => updateSortOption(e.target.value)}
23
- * >
24
- * {sortOptions.map(option => (
25
- * <option key={option.value} value={option.value}>
26
- * {option.label}
27
- * </option>
28
- * ))}
29
- * </select>
30
- * )}
31
- * </ProductListSort.Options>
32
- * </ProductListSort.Root>
33
- * );
34
- * }
35
- * ```
36
- */
37
- export declare function Root(props: RootProps): React.ReactNode;
1
+ import { SortType } from "../enums/sort-enums.js";
38
2
  /**
39
3
  * Props for Options headless component
40
4
  */
@@ -59,29 +23,34 @@ export interface OptionsRenderProps {
59
23
  * @component
60
24
  * @example
61
25
  * ```tsx
62
- * import { ProductListSort } from '@wix/stores/components';
26
+ * import { ProductList, ProductListSort } from '@wix/stores/components';
63
27
  *
64
28
  * function ProductSortDropdown() {
65
29
  * return (
66
- * <ProductListSort.Options>
67
- * {({ selectedSortOption, updateSortOption, sortOptions }) => (
68
- * <div className="sort-container">
69
- * <label htmlFor="sort-select">Sort by:</label>
70
- * <select
71
- * id="sort-select"
72
- * value={selectedSortOption}
73
- * onChange={(e) => updateSortOption(e.target.value)}
74
- * className="sort-dropdown"
75
- * >
76
- * {sortOptions.map(option => (
77
- * <option key={option.value} value={option.value}>
78
- * {option.label}
79
- * </option>
80
- * ))}
81
- * </select>
82
- * </div>
83
- * )}
84
- * </ProductListSort.Options>
30
+ * <ProductList.Root
31
+ * productsListConfig={{ products: [], searchOptions: {}, pagingMetadata: {}, aggregations: {} }}
32
+ * productsListSearchConfig={{ customizations: [] }}
33
+ * >
34
+ * <ProductListSort.Options>
35
+ * {({ selectedSortOption, updateSortOption, sortOptions }) => (
36
+ * <div className="sort-container">
37
+ * <label htmlFor="sort-select">Sort by:</label>
38
+ * <select
39
+ * id="sort-select"
40
+ * value={selectedSortOption}
41
+ * onChange={(e) => updateSortOption(e.target.value)}
42
+ * className="sort-dropdown"
43
+ * >
44
+ * {sortOptions.map(option => (
45
+ * <option key={option} value={option}>
46
+ * {option}
47
+ * </option>
48
+ * ))}
49
+ * </select>
50
+ * </div>
51
+ * )}
52
+ * </ProductListSort.Options>
53
+ * </ProductList.Root>
85
54
  * );
86
55
  * }
87
56
  * ```
@@ -1,77 +1,45 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { createServicesMap } from "@wix/services-manager";
3
- import { useService, WixServices } from "@wix/services-manager-react";
4
- import { ProductsListSortService, ProductsListSortServiceDefinition, } from "../services/products-list-sort-service.js";
1
+ import { useService } from "@wix/services-manager-react";
2
+ import { ProductsListSearchServiceDefinition } from "../services/products-list-search-service.js";
5
3
  /**
6
- * Root component that provides the ProductListSort service context to its children.
7
- * This component sets up the necessary services for managing products list sorting.
4
+ * Headless component for managing product list sorting options
8
5
  *
9
- * @order 1
10
6
  * @component
11
7
  * @example
12
8
  * ```tsx
13
- * import { ProductListSort } from '@wix/stores/components';
9
+ * import { ProductList, ProductListSort } from '@wix/stores/components';
14
10
  *
15
- * function SortSection() {
11
+ * function ProductSortDropdown() {
16
12
  * return (
17
- * <ProductListSort.Root>
13
+ * <ProductList.Root
14
+ * productsListConfig={{ products: [], searchOptions: {}, pagingMetadata: {}, aggregations: {} }}
15
+ * productsListSearchConfig={{ customizations: [] }}
16
+ * >
18
17
  * <ProductListSort.Options>
19
18
  * {({ selectedSortOption, updateSortOption, sortOptions }) => (
20
- * <select
21
- * value={selectedSortOption}
22
- * onChange={(e) => updateSortOption(e.target.value)}
23
- * >
24
- * {sortOptions.map(option => (
25
- * <option key={option.value} value={option.value}>
26
- * {option.label}
27
- * </option>
28
- * ))}
29
- * </select>
19
+ * <div className="sort-container">
20
+ * <label htmlFor="sort-select">Sort by:</label>
21
+ * <select
22
+ * id="sort-select"
23
+ * value={selectedSortOption}
24
+ * onChange={(e) => updateSortOption(e.target.value)}
25
+ * className="sort-dropdown"
26
+ * >
27
+ * {sortOptions.map(option => (
28
+ * <option key={option} value={option}>
29
+ * {option}
30
+ * </option>
31
+ * ))}
32
+ * </select>
33
+ * </div>
30
34
  * )}
31
35
  * </ProductListSort.Options>
32
- * </ProductListSort.Root>
33
- * );
34
- * }
35
- * ```
36
- */
37
- export function Root(props) {
38
- return (_jsx(WixServices, { servicesMap: createServicesMap().addService(ProductsListSortServiceDefinition, ProductsListSortService, {}), children: props.children }));
39
- }
40
- /**
41
- * Headless component for managing product list sorting options
42
- *
43
- * @component
44
- * @example
45
- * ```tsx
46
- * import { ProductListSort } from '@wix/stores/components';
47
- *
48
- * function ProductSortDropdown() {
49
- * return (
50
- * <ProductListSort.Options>
51
- * {({ selectedSortOption, updateSortOption, sortOptions }) => (
52
- * <div className="sort-container">
53
- * <label htmlFor="sort-select">Sort by:</label>
54
- * <select
55
- * id="sort-select"
56
- * value={selectedSortOption}
57
- * onChange={(e) => updateSortOption(e.target.value)}
58
- * className="sort-dropdown"
59
- * >
60
- * {sortOptions.map(option => (
61
- * <option key={option.value} value={option.value}>
62
- * {option.label}
63
- * </option>
64
- * ))}
65
- * </select>
66
- * </div>
67
- * )}
68
- * </ProductListSort.Options>
36
+ * </ProductList.Root>
69
37
  * );
70
38
  * }
71
39
  * ```
72
40
  */
73
41
  export function Options(props) {
74
- const service = useService(ProductsListSortServiceDefinition);
42
+ const service = useService(ProductsListSearchServiceDefinition);
75
43
  const selectedSortOption = service.selectedSortOption.get();
76
44
  const sortOptions = service.sortOptions;
77
45
  const updateSortOption = service.setSelectedSortOption;
@@ -4,6 +4,4 @@ export { ProductModifiersService, ProductModifiersServiceDefinition, } from "./p
4
4
  export { ProductService, ProductServiceDefinition, loadProductServiceConfig, } from "./product-service.js";
5
5
  export { SelectedVariantService, SelectedVariantServiceDefinition, } from "./selected-variant-service.js";
6
6
  export { ProductListService, ProductsListServiceDefinition, loadProductsListServiceConfig, ProductsListServiceConfig, } from "./products-list-service.js";
7
- export { SortType, ProductsListSortService, ProductsListSortServiceDefinition, } from "./products-list-sort-service.js";
8
- export { InventoryStatusType, ProductsListFiltersService, ProductsListFiltersServiceDefinition, loadProductsListFiltersServiceConfig, ProductsListFiltersServiceConfig, } from "./products-list-filters-service.js";
9
- export { ProductsListPaginationService, ProductsListPaginationServiceDefinition, } from "./products-list-pagination-service.js";
7
+ export { ProductOption, InventoryStatusType, SortType, ProductChoice, ProductsListSearchService, ProductsListSearchServiceDefinition, ProductsListSearchServiceConfig, loadProductsListSearchServiceConfig, parseUrlForProductsListSearch, convertUrlSortToSortType, } from "./products-list-search-service.js";
@@ -4,6 +4,4 @@ export { ProductModifiersService, ProductModifiersServiceDefinition, } from "./p
4
4
  export { ProductService, ProductServiceDefinition, loadProductServiceConfig, } from "./product-service.js";
5
5
  export { SelectedVariantService, SelectedVariantServiceDefinition, } from "./selected-variant-service.js";
6
6
  export { ProductListService, ProductsListServiceDefinition, loadProductsListServiceConfig, } from "./products-list-service.js";
7
- export { SortType, ProductsListSortService, ProductsListSortServiceDefinition, } from "./products-list-sort-service.js";
8
- export { InventoryStatusType, ProductsListFiltersService, ProductsListFiltersServiceDefinition, loadProductsListFiltersServiceConfig, } from "./products-list-filters-service.js";
9
- export { ProductsListPaginationService, ProductsListPaginationServiceDefinition, } from "./products-list-pagination-service.js";
7
+ export { InventoryStatusType, SortType, ProductsListSearchService, ProductsListSearchServiceDefinition, loadProductsListSearchServiceConfig, parseUrlForProductsListSearch, convertUrlSortToSortType, } from "./products-list-search-service.js";