@wix/headless-stores 0.0.10 → 0.0.12

package/cjs/dist/enums/index.d.ts

@@ -0,0 +1,2 @@
+export * from './sort-enums';
+export * from './social-platform-enums';

package/cjs/dist/enums/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./sort-enums"), exports);
+__exportStar(require("./social-platform-enums"), exports);

package/cjs/dist/enums/social-platform-enums.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Business logic enums for social sharing platforms (headless layer)
+ */
+/**
+ * Enum for social sharing platforms (business identifiers)
+ */
+export declare enum SocialPlatform {
+    FACEBOOK = "facebook",
+    TWITTER = "twitter",
+    LINKEDIN = "linkedin",
+    WHATSAPP = "whatsapp",
+    EMAIL = "email",
+    CLIPBOARD = "clipboard",
+    NATIVE = "native"
+}
+/**
+ * Enum for social platform share URLs (business logic)
+ */
+export declare enum SocialPlatformShareUrl {
+    FACEBOOK = "https://www.facebook.com/sharer/sharer.php",
+    TWITTER = "https://twitter.com/intent/tweet",
+    LINKEDIN = "https://www.linkedin.com/sharing/share-offsite/",
+    WHATSAPP = "https://wa.me/",
+    EMAIL = "mailto:"
+}

package/cjs/dist/enums/social-platform-enums.js

@@ -0,0 +1,30 @@
+"use strict";
+/**
+ * Business logic enums for social sharing platforms (headless layer)
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SocialPlatformShareUrl = exports.SocialPlatform = void 0;
+/**
+ * Enum for social sharing platforms (business identifiers)
+ */
+var SocialPlatform;
+(function (SocialPlatform) {
+    SocialPlatform["FACEBOOK"] = "facebook";
+    SocialPlatform["TWITTER"] = "twitter";
+    SocialPlatform["LINKEDIN"] = "linkedin";
+    SocialPlatform["WHATSAPP"] = "whatsapp";
+    SocialPlatform["EMAIL"] = "email";
+    SocialPlatform["CLIPBOARD"] = "clipboard";
+    SocialPlatform["NATIVE"] = "native";
+})(SocialPlatform || (exports.SocialPlatform = SocialPlatform = {}));
+/**
+ * Enum for social platform share URLs (business logic)
+ */
+var SocialPlatformShareUrl;
+(function (SocialPlatformShareUrl) {
+    SocialPlatformShareUrl["FACEBOOK"] = "https://www.facebook.com/sharer/sharer.php";
+    SocialPlatformShareUrl["TWITTER"] = "https://twitter.com/intent/tweet";
+    SocialPlatformShareUrl["LINKEDIN"] = "https://www.linkedin.com/sharing/share-offsite/";
+    SocialPlatformShareUrl["WHATSAPP"] = "https://wa.me/";
+    SocialPlatformShareUrl["EMAIL"] = "mailto:";
+})(SocialPlatformShareUrl || (exports.SocialPlatformShareUrl = SocialPlatformShareUrl = {}));

package/cjs/dist/enums/sort-enums.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Enum for sort types used in the store
+ * Note: Cannot use SDK SortType as it's for aggregations (COUNT/VALUE)
+ * while this enum represents user-facing sort options
+ */
+export declare enum SortType {
+    NEWEST = "newest",
+    NAME_ASC = "name_asc",
+    NAME_DESC = "name_desc",
+    PRICE_ASC = "price_asc",
+    PRICE_DESC = "price_desc",
+    RECOMMENDED = "recommended"
+}
+/**
+ * Default sort type
+ */
+export declare const DEFAULT_SORT_TYPE = SortType.NEWEST;

package/cjs/dist/enums/sort-enums.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_SORT_TYPE = exports.SortType = void 0;
+/**
+ * Enum for sort types used in the store
+ * Note: Cannot use SDK SortType as it's for aggregations (COUNT/VALUE)
+ * while this enum represents user-facing sort options
+ */
+var SortType;
+(function (SortType) {
+    SortType["NEWEST"] = "newest";
+    SortType["NAME_ASC"] = "name_asc";
+    SortType["NAME_DESC"] = "name_desc";
+    SortType["PRICE_ASC"] = "price_asc";
+    SortType["PRICE_DESC"] = "price_desc";
+    SortType["RECOMMENDED"] = "recommended";
+})(SortType || (exports.SortType = SortType = {}));
+/**
+ * Default sort type
+ */
+exports.DEFAULT_SORT_TYPE = SortType.NEWEST;

package/cjs/dist/react/BuyNow.d.ts

@@ -1,4 +1,3 @@
-export type RedirectToCheckout = () => void;
 /**
  * Props passed to the render function of the BuyNow component
  */
@@ -8,7 +7,7 @@ export interface BuyNowRenderProps {
     /** The name of the product being purchased */
     productName: string;
     /** Function to redirect the user to the checkout page */
-    redirectToCheckout: RedirectToCheckout;
+    redirectToCheckout: () => void;
     /** The error message if the buy now operation fails */
     error: string | null;
     /** The price of the product being purchased */
@@ -20,13 +19,12 @@ export interface BuyNowRenderProps {
     /** Whether the product is available for pre-order */
     preOrderAvailable: boolean;
 }
-export type BuyNowChildren = (props: BuyNowRenderProps) => React.ReactNode;
 /**
  * Props for the BuyNow component
  */
 export interface BuyNowProps {
     /** Render function that receives buy now state and actions */
-    children: BuyNowChildren;
+    children: (props: BuyNowRenderProps) => React.ReactNode;
 }
 /**
  * A headless component that provides buy now functionality using the render props pattern.

package/cjs/dist/react/Category.d.ts

@@ -1,17 +1,15 @@
-import React, { type ReactNode } from "react";
-import { type CategoryServiceAPI } from "../services/category-service";
-import { categories } from "@wix/categories";
-interface CategoryProviderProps {
-    children: ReactNode;
-}
-export declare const Provider: React.FC<CategoryProviderProps>;
-export declare const useCategory: () => CategoryServiceAPI;
-interface CategoryListProps {
+import { type Category } from '@wix/auto_sdk_categories_categories';
+import React, { type ReactNode } from 'react';
+export interface CategoryListProps {
     children: (data: {
-        categories: categories.Category[];
+        categories: Category[];
         selectedCategory: string | null;
         setSelectedCategory: (categoryId: string | null) => void;
     }) => ReactNode;
 }
+/**
+ * Headless component for displaying a list of categories
+ *
+ * @component
+ */
 export declare const List: React.FC<CategoryListProps>;
-export {};

package/cjs/dist/react/Category.js

@@ -1,33 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.List = exports.useCategory = exports.Provider = void 0;
+exports.List = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
 const services_manager_react_1 = require("@wix/services-manager-react");
 const category_service_1 = require("../services/category-service");
-const CategoryContext = (0, react_1.createContext)(null);
-const Provider = ({ children, }) => {
-    const service = (0, services_manager_react_1.useService)(category_service_1.CategoryServiceDefinition);
-    return ((0, jsx_runtime_1.jsx)(CategoryContext.Provider, { value: service, children: children }));
-};
-exports.Provider = Provider;
-const useCategory = () => {
-    const context = (0, react_1.useContext)(CategoryContext);
-    if (!context) {
-        throw new Error("useCategory must be used within a CategoryProvider");
-    }
-    return context;
-};
-exports.useCategory = useCategory;
+/**
+ * Headless component for displaying a list of categories
+ *
+ * @component
+ */
 const List = ({ children }) => {
-    const service = (0, exports.useCategory)();
-    const [selectedCategory, setSelectedCategory] = (0, react_1.useState)(service.selectedCategory.get());
+    const service = (0, services_manager_react_1.useService)(category_service_1.CategoryServiceDefinition);
     const categories = service.categories.get();
-    service.selectedCategory.subscribe((categoryId) => {
-        if (categoryId !== selectedCategory) {
-            setSelectedCategory(categoryId);
-        }
-    });
+    const selectedCategory = service.selectedCategory.get();
     return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children({
             selectedCategory,
             categories,

package/cjs/dist/react/Collection.d.ts

@@ -1,4 +1,4 @@
-import { productsV3 } from "@wix/stores";
+import { type V3Product } from '@wix/auto_sdk_stores_products-v-3';
 /**
  * Props for Grid headless component
  */
@@ -11,7 +11,7 @@ export interface GridProps {
  */
 export interface GridRenderProps {
     /** Array of products */
-    products: productsV3.V3Product[];
+    products: V3Product[];
     /** Whether products are loading */
     isLoading: boolean;
     /** Error message if any */
@@ -25,6 +25,8 @@ export interface GridRenderProps {
 }
 /**
  * Headless component for product grid
+ *
+ * @component
  */
 export declare const Grid: (props: GridProps) => import("react").ReactNode;
 /**
@@ -32,7 +34,7 @@ export declare const Grid: (props: GridProps) => import("react").ReactNode;
  */
 export interface ItemProps {
     /** Product data */
-    product: productsV3.V3Product;
+    product: V3Product;
     /** Render prop function that receives product item data */
     children: (props: ItemRenderProps) => React.ReactNode;
 }
@@ -61,6 +63,8 @@ export interface ItemRenderProps {
 }
 /**
  * Headless component for individual product item
+ *
+ * @component
  */
 export declare const Item: (props: ItemProps) => import("react").ReactNode;
 /**
@@ -90,6 +94,8 @@ export interface LoadMoreRenderProps {
 /**
  * Headless component for load more products functionality
  * Note: V3 API uses simplified loading without traditional pagination
+ *
+ * @component
  */
 export declare const LoadMore: (props: LoadMoreProps) => import("react").ReactNode;
 /**
@@ -112,6 +118,8 @@ export interface HeaderRenderProps {
 }
 /**
  * Headless component for collection header with product count
+ *
+ * @component
  */
 export declare const Header: (props: HeaderProps) => import("react").ReactNode;
 /**
@@ -137,5 +145,7 @@ export interface ActionsRenderProps {
 /**
  * Headless component for collection actions (refresh, load more)
  * Replaces traditional pagination for V3 API
+ *
+ * @component
  */
 export declare const Actions: (props: ActionsProps) => import("react").ReactNode;

package/cjs/dist/react/Collection.js

@@ -3,18 +3,21 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Actions = exports.Header = exports.LoadMore = exports.Item = exports.Grid = void 0;
 const services_manager_react_1 = require("@wix/services-manager-react");
 const collection_service_1 = require("../services/collection-service");
+const auto_sdk_stores_products_v_3_1 = require("@wix/auto_sdk_stores_products-v-3");
 /**
  * Headless component for product grid
+ *
+ * @component
  */
 const Grid = (props) => {
     const service = (0, services_manager_react_1.useService)(collection_service_1.CollectionServiceDefinition);
     // Debug logging to help identify service issues
     if (!service) {
-        console.error("CollectionService is undefined");
+        console.error('CollectionService is undefined');
         return props.children({
             products: [],
             isLoading: false,
-            error: "Service not available",
+            error: 'Service not available',
             isEmpty: true,
             totalProducts: 0,
             hasProducts: false,
@@ -37,11 +40,11 @@ const Grid = (props) => {
         });
     }
     catch (err) {
-        console.error("Error accessing service properties:", err);
+        console.error('Error accessing service properties:', err);
         return props.children({
             products: [],
             isLoading: false,
-            error: "Failed to load products",
+            error: 'Failed to load products',
             isEmpty: true,
             totalProducts: 0,
             hasProducts: false,
@@ -51,6 +54,8 @@ const Grid = (props) => {
 exports.Grid = Grid;
 /**
  * Headless component for individual product item
+ *
+ * @component
  */
 const Item = (props) => {
     const { product } = props;
@@ -59,18 +64,18 @@ const Item = (props) => {
     const image = product?.media?.main?.image || null;
     // Create formatted price since formattedAmount is not available
     const rawAmount = product.actualPriceRange?.minValue?.amount;
-    const price = rawAmount ? `$${rawAmount}` : "$0.00";
+    const price = rawAmount ? `$${rawAmount}` : '$0.00';
     // Create formatted compare-at price
     const rawCompareAmount = product.compareAtPriceRange?.minValue?.amount;
     const compareAtPrice = rawCompareAmount ? `$${rawCompareAmount}` : null;
     const availabilityStatus = product.inventory?.availabilityStatus;
-    const available = availabilityStatus === "IN_STOCK" ||
-        availabilityStatus === "PARTIALLY_OUT_OF_STOCK";
-    const description = typeof product.description === "string" ? product.description : "";
+    const available = availabilityStatus === auto_sdk_stores_products_v_3_1.InventoryAvailabilityStatus.IN_STOCK ||
+        availabilityStatus === auto_sdk_stores_products_v_3_1.InventoryAvailabilityStatus.PARTIALLY_OUT_OF_STOCK;
+    const description = typeof product.description === 'string' ? product.description : '';
     return props.children({
-        id: product._id || "",
-        title: product.name || "",
-        slug: product.slug || "",
+        id: product._id || '',
+        title: product.name || '',
+        slug: product.slug || '',
         image,
         price,
         compareAtPrice,
@@ -83,12 +88,14 @@ exports.Item = Item;
 /**
  * Headless component for load more products functionality
  * Note: V3 API uses simplified loading without traditional pagination
+ *
+ * @component
  */
 const LoadMore = (props) => {
     const service = (0, services_manager_react_1.useService)(collection_service_1.CollectionServiceDefinition);
     // Error handling for undefined service
     if (!service) {
-        console.error("CollectionService is undefined in LoadMore");
+        console.error('CollectionService is undefined in LoadMore');
         return props.children({
             loadMore: async () => { },
             refresh: async () => { },
@@ -113,7 +120,7 @@ const LoadMore = (props) => {
         });
     }
     catch (err) {
-        console.error("Error in LoadMore:", err);
+        console.error('Error in LoadMore:', err);
         return props.children({
             loadMore: async () => { },
             refresh: async () => { },
@@ -127,12 +134,14 @@ const LoadMore = (props) => {
 exports.LoadMore = LoadMore;
 /**
  * Headless component for collection header with product count
+ *
+ * @component
  */
 const Header = (props) => {
     const service = (0, services_manager_react_1.useService)(collection_service_1.CollectionServiceDefinition);
     // Error handling for undefined service
     if (!service) {
-        console.error("CollectionService is undefined in Header");
+        console.error('CollectionService is undefined in Header');
         return props.children({
             totalProducts: 0,
             isLoading: false,
@@ -150,7 +159,7 @@ const Header = (props) => {
         });
     }
     catch (err) {
-        console.error("Error in Header:", err);
+        console.error('Error in Header:', err);
         return props.children({
             totalProducts: 0,
             isLoading: false,
@@ -162,17 +171,19 @@ exports.Header = Header;
 /**
  * Headless component for collection actions (refresh, load more)
  * Replaces traditional pagination for V3 API
+ *
+ * @component
  */
 const Actions = (props) => {
     const service = (0, services_manager_react_1.useService)(collection_service_1.CollectionServiceDefinition);
     // Error handling for undefined service
     if (!service) {
-        console.error("CollectionService is undefined in Actions");
+        console.error('CollectionService is undefined in Actions');
         return props.children({
             refresh: async () => { },
             loadMore: async () => { },
             isLoading: false,
-            error: "Service not available",
+            error: 'Service not available',
         });
     }
     try {
@@ -186,12 +197,12 @@ const Actions = (props) => {
         });
     }
     catch (err) {
-        console.error("Error in Actions:", err);
+        console.error('Error in Actions:', err);
         return props.children({
             refresh: async () => { },
             loadMore: async () => { },
             isLoading: false,
-            error: "Failed to load actions",
+            error: 'Failed to load actions',
         });
     }
 };

package/cjs/dist/react/FilteredCollection.d.ts

@@ -1,24 +1,35 @@
-import React, { type ReactNode } from "react";
-import { type AvailableOptions, type FilterServiceAPI, type Filter } from "../services/filter-service";
-import { productsV3 } from "@wix/stores";
-import { type CollectionServiceAPI } from "../services/collection-service";
-interface FilteredCollectionProviderProps {
+import React, { type ReactNode } from 'react';
+import { type AvailableOptions, type FilterServiceAPI, type Filter } from '../services/filter-service';
+import { type V3Product } from '@wix/auto_sdk_stores_products-v-3';
+import { type CollectionServiceAPI } from '../services/collection-service';
+export type { AvailableOptions, Filter, FilterServiceAPI };
+export interface FilteredCollectionProviderProps {
     children: ReactNode;
 }
+/**
+ * Headless component for providing a filtered collection
+ *
+ * @component
+ */
 export declare const Provider: React.FC<FilteredCollectionProviderProps>;
 export declare const useFilteredCollection: () => {
     filter: FilterServiceAPI | null;
     collection: CollectionServiceAPI | null;
 };
-interface FiltersLoadingProps {
+export interface FiltersLoadingProps {
     children: (data: {
         isFullyLoaded: boolean;
     }) => ReactNode;
 }
+/**
+ * Headless component for displaying a loading state for filters
+ *
+ * @component
+ */
 export declare const FiltersLoading: React.FC<FiltersLoadingProps>;
-interface FilteredGridProps {
+export interface FilteredGridProps {
     children: (data: {
-        products: productsV3.V3Product[];
+        products: V3Product[];
         totalProducts: number;
         isLoading: boolean;
         error: string | null;
@@ -26,21 +37,32 @@ interface FilteredGridProps {
         hasMoreProducts: boolean;
     }) => ReactNode;
 }
+/**
+ * Headless component for displaying a grid of filtered products
+ *
+ * @component
+ */
 export declare const Grid: React.FC<FilteredGridProps>;
-interface FilteredItemProps {
-    product: productsV3.V3Product;
+export interface FilteredItemProps {
+    product: V3Product;
     children: (data: {
         title: string;
         image: string | null;
+        imageAltText: string | null;
         price: string;
         compareAtPrice: string | null;
         available: boolean;
-        href: string;
+        slug: string;
         description?: string;
     }) => ReactNode;
 }
+/**
+ * Headless component for displaying an individual product item
+ *
+ * @component
+ */
 export declare const Item: React.FC<FilteredItemProps>;
-interface FilteredLoadMoreProps {
+export interface FilteredLoadMoreProps {
     children: (data: {
         loadMore: () => Promise<void>;
         refresh: () => Promise<void>;
@@ -50,16 +72,25 @@ interface FilteredLoadMoreProps {
         hasMoreProducts: boolean;
     }) => ReactNode;
 }
+/**
+ * Headless component for displaying a load more button
+ *
+ * @component
+ */
 export declare const LoadMore: React.FC<FilteredLoadMoreProps>;
-interface FilteredFiltersProps {
+export interface FilteredFiltersProps {
     children: (data: {
         applyFilters: (filters: Filter) => void;
         clearFilters: () => void;
         currentFilters: Filter;
-        allProducts: productsV3.V3Product[];
+        allProducts: V3Product[];
         availableOptions: AvailableOptions;
         isFiltered: boolean;
     }) => ReactNode;
 }
+/**
+ * Headless component for displaying a filters component
+ *
+ * @component
+ */
 export declare const Filters: React.FC<FilteredFiltersProps>;
-export {};

package/cjs/dist/react/FilteredCollection.js

@@ -5,9 +5,15 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const filter_service_1 = require("../services/filter-service");
 const services_manager_react_1 = require("@wix/services-manager-react");
+const auto_sdk_stores_products_v_3_1 = require("@wix/auto_sdk_stores_products-v-3");
 const collection_service_1 = require("../services/collection-service");
 const FilteredCollectionContext = (0, react_1.createContext)({ filter: null, collection: null });
-const Provider = ({ children }) => {
+/**
+ * Headless component for providing a filtered collection
+ *
+ * @component
+ */
+const Provider = ({ children, }) => {
     const filter = (0, services_manager_react_1.useService)(filter_service_1.FilterServiceDefinition);
     const collection = (0, services_manager_react_1.useService)(collection_service_1.CollectionServiceDefinition);
     return ((0, jsx_runtime_1.jsx)(FilteredCollectionContext.Provider, { value: { filter, collection }, children: children }));
@@ -16,17 +22,27 @@ exports.Provider = Provider;
 const useFilteredCollection = () => {
     const context = (0, react_1.useContext)(FilteredCollectionContext);
     if (!context) {
-        throw new Error("useFilteredCollection must be used within a FilteredCollectionProvider");
+        throw new Error('useFilteredCollection must be used within a FilteredCollectionProvider');
     }
     return context;
 };
 exports.useFilteredCollection = useFilteredCollection;
+/**
+ * Headless component for displaying a loading state for filters
+ *
+ * @component
+ */
 const FiltersLoading = ({ children }) => {
     const { filter } = (0, exports.useFilteredCollection)();
     const isFullyLoaded = filter.isFullyLoaded.get();
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children({ isFullyLoaded }) }));
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children({ isFullyLoaded }) });
 };
 exports.FiltersLoading = FiltersLoading;
+/**
+ * Headless component for displaying a grid of filtered products
+ *
+ * @component
+ */
 const Grid = ({ children }) => {
     const { collection } = (0, exports.useFilteredCollection)();
     const products = collection.products.get() || [];
@@ -45,39 +61,51 @@ const Grid = ({ children }) => {
         }) }));
 };
 exports.Grid = Grid;
-const Item = ({ product, children, }) => {
+/**
+ * Headless component for displaying an individual product item
+ *
+ * @component
+ */
+const Item = ({ product, children }) => {
     // Safe conversion of product data with type safety guards
-    const title = String(product.name || "");
+    const title = String(product.name || '');
     const image = product.media?.main?.image || null;
+    const imageAltText = product.media?.main?.altText || '';
     const price = product.actualPriceRange?.minValue?.formattedAmount ||
         product.actualPriceRange?.maxValue?.formattedAmount ||
         (product.actualPriceRange?.minValue?.amount
             ? `$${product.actualPriceRange.minValue.amount}`
-            : "$0.00");
+            : '$0.00');
     // Add compare at price
     const compareAtPrice = product.compareAtPriceRange?.minValue?.formattedAmount ||
         (product.compareAtPriceRange?.minValue?.amount
             ? `$${product.compareAtPriceRange.minValue.amount}`
             : null);
     const availabilityStatus = product.inventory?.availabilityStatus;
-    const available = availabilityStatus === "IN_STOCK" ||
-        availabilityStatus === "PARTIALLY_OUT_OF_STOCK";
-    const href = `/store/products/${String(product.slug || product._id || "")}`;
+    const available = availabilityStatus === auto_sdk_stores_products_v_3_1.InventoryAvailabilityStatus.IN_STOCK ||
+        availabilityStatus === auto_sdk_stores_products_v_3_1.InventoryAvailabilityStatus.PARTIALLY_OUT_OF_STOCK;
+    const slug = String(product.slug || product._id || '');
     const description = product.plainDescription
         ? String(product.plainDescription)
         : undefined;
     return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children({
             title,
             image,
+            imageAltText,
             price: String(price),
             compareAtPrice,
             available,
-            href,
+            slug,
             description,
         }) }));
 };
 exports.Item = Item;
-const LoadMore = ({ children, }) => {
+/**
+ * Headless component for displaying a load more button
+ *
+ * @component
+ */
+const LoadMore = ({ children }) => {
     const { collection } = (0, exports.useFilteredCollection)();
     const loadMore = collection.loadMore;
     const refresh = collection.refresh;
@@ -95,7 +123,12 @@ const LoadMore = ({ children, }) => {
         }) }));
 };
 exports.LoadMore = LoadMore;
-const Filters = ({ children, }) => {
+/**
+ * Headless component for displaying a filters component
+ *
+ * @component
+ */
+const Filters = ({ children }) => {
     const { collection, filter } = (0, exports.useFilteredCollection)();
     const applyFilters = filter.applyFilters;
     const clearFilters = filter.clearFilters;