@sonic-equipment/ui 0.0.28 → 0.0.30

package/dist/algolia/algolia-index-config.d.ts

@@ -0,0 +1,72 @@
+export interface Indexes {
+    default: string;
+    sort: {
+        index: string;
+        name: string;
+    }[];
+}
+export declare const algoliaIndexesPerEnvironment: {
+    readonly production: {
+        readonly default: "prod_sonic_products_en";
+        readonly sort: [{
+            readonly index: "prod_sonic_products_en";
+            readonly name: "relevance";
+        }, {
+            readonly index: "prod_sonic_products_en_is-new_desc";
+            readonly name: "newest";
+        }, {
+            readonly index: "prod_sonic_products_en_price_asc";
+            readonly name: "price_asc";
+        }, {
+            readonly index: "prod_sonic_products_en_price_desc";
+            readonly name: "price_desc";
+        }];
+    };
+    readonly sandbox: {
+        readonly default: "dev_sonic_products_en";
+        readonly sort: [{
+            readonly index: "dev_sonic_products_en";
+            readonly name: "relevance";
+        }, {
+            readonly index: "dev_sonic_products_en_is-new_desc";
+            readonly name: "newest";
+        }, {
+            readonly index: "dev_sonic_products_en_price_asc";
+            readonly name: "price_asc";
+        }, {
+            readonly index: "dev_sonic_products_en_price_desc";
+            readonly name: "price_desc";
+        }];
+    };
+};
+export declare const currentIndexes: {
+    readonly default: "prod_sonic_products_en";
+    readonly sort: [{
+        readonly index: "prod_sonic_products_en";
+        readonly name: "relevance";
+    }, {
+        readonly index: "prod_sonic_products_en_is-new_desc";
+        readonly name: "newest";
+    }, {
+        readonly index: "prod_sonic_products_en_price_asc";
+        readonly name: "price_asc";
+    }, {
+        readonly index: "prod_sonic_products_en_price_desc";
+        readonly name: "price_desc";
+    }];
+} | {
+    readonly default: "dev_sonic_products_en";
+    readonly sort: [{
+        readonly index: "dev_sonic_products_en";
+        readonly name: "relevance";
+    }, {
+        readonly index: "dev_sonic_products_en_is-new_desc";
+        readonly name: "newest";
+    }, {
+        readonly index: "dev_sonic_products_en_price_asc";
+        readonly name: "price_asc";
+    }, {
+        readonly index: "dev_sonic_products_en_price_desc";
+        readonly name: "price_desc";
+    }];
+} | undefined;

package/dist/cards/product-card/product-card.d.ts

@@ -12,7 +12,7 @@ export interface ProductCardProps {
     onPress?: (e: PressEvent) => void;
     price: ProductPriceType;
     sku: string;
-    tag?: 'new' | 'sale';
+    tags?: string[];
     title: string;
 }
-export declare function ProductCard({ addToCartButton: AddToCartButton, favoriteButton: FavoriteButton, href, image: { alt, fit, src, title: imageTitle }, onClick, onPress, price, sku, tag, title, }: ProductCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function ProductCard({ addToCartButton: AddToCartButton, favoriteButton: FavoriteButton, href, image: { alt, fit, src, title: imageTitle }, onClick, onPress, price, sku, tags, title, }: ProductCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/cards/product-card/product-card.stories.d.ts

@@ -14,7 +14,7 @@ declare const meta: {
         };
         onClick: import("@vitest/spy").Mock<[e: React.MouseEvent<Element, MouseEvent>], void>;
         sku: string;
-        tag: "new";
+        tags: string[];
     };
     component: typeof ProductCard;
     parameters: {

package/dist/display/product-price/product-price.d.ts

@@ -1,7 +1,7 @@
 export interface ProductPriceProps {
     className?: string;
-    current: number;
-    includeVat?: boolean;
-    original?: number;
+    isVatIncluded: boolean;
+    originalPrice: number;
+    price: number;
 }
-export declare function ProductPrice({ className, current, includeVat, original, }: ProductPriceProps): import("react/jsx-runtime").JSX.Element | undefined;
+export declare function ProductPrice({ className, isVatIncluded, originalPrice, price, }: ProductPriceProps): import("react/jsx-runtime").JSX.Element | undefined;

package/dist/display/product-price/product-price.stories.d.ts

@@ -10,4 +10,5 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const WithOriginalPrice: Story;
+export declare const WithOnlyOriginalPrice: Story;
 export declare const WithoutOriginalPrice: Story;

package/dist/global-search/global-search-provider/global-search-provider.d.ts

@@ -0,0 +1,8 @@
+import React, { ReactNode } from 'react';
+import { SearchClient } from 'algoliasearch/lite';
+import { Autocomplete, GlobalSearchContextValue } from 'global-search/types';
+export declare const GlobalSearchContext: React.Context<GlobalSearchContextValue | null>;
+export declare function GlobalSearchProvider({ children, searchClient, }: {
+    children?: ReactNode | ((autocomplete: Autocomplete) => ReactNode);
+    searchClient: SearchClient;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/global-search/global-search-provider/use-global-search.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import { AutocompleteCollection } from '@algolia/autocomplete-core';
+import { CategoryHit } from 'global-search/plugins/categories-plugin';
+import { PopularCategoryHit } from 'global-search/plugins/popular-categories-plugin';
+import { PopularSearchHit } from 'global-search/plugins/popular-searches-plugin';
+import { ProductHit } from 'global-search/plugins/products-plugin';
+import { QuerySuggestionHit } from 'global-search/plugins/query-suggestions-plugin';
+import { QuickAccessHit } from 'global-search/plugins/quick-access-plugin';
+import { RecentSearchHit } from 'global-search/plugins/recent-searches-plugin';
+export declare function useGlobalSearch(): {
+    categories: AutocompleteCollection<CategoryHit> | undefined;
+    hasResults: boolean;
+    popularCategories: AutocompleteCollection<PopularCategoryHit> | undefined;
+    popularSearches: AutocompleteCollection<PopularSearchHit> | undefined;
+    products: AutocompleteCollection<ProductHit> | undefined;
+    querySuggestions: AutocompleteCollection<QuerySuggestionHit> | undefined;
+    quickAccess: AutocompleteCollection<QuickAccessHit> | undefined;
+    recentSearches: AutocompleteCollection<RecentSearchHit> | undefined;
+    autocomplete: import("../types").Autocomplete;
+    formRef: React.RefObject<HTMLFormElement>;
+    inputRef: React.RefObject<HTMLInputElement>;
+    panelRef: React.RefObject<HTMLDivElement>;
+    productsIndexName: string;
+    productsQuerySuggestionsIndexName: string;
+    searchClient: import("algoliasearch/lite").SearchClient;
+    setState: React.Dispatch<React.SetStateAction<import("../types").AutocompleteState>>;
+    state: import("../types").AutocompleteState;
+};

package/dist/{search/global-search → global-search}/global-search.d.ts

@@ -1,6 +1,4 @@
-import { ReactNode } from 'react';
 import { SearchClient } from 'algoliasearch/lite';
-import { Autocomplete } from './types';
 /**
  * Global search using algolia autocomplete with a custom renderer
  * https://www.algolia.com/doc/ui-libraries/autocomplete/guides/creating-a-renderer/
@@ -12,8 +10,3 @@ import { Autocomplete } from './types';
 export declare function GlobalSearch(props: {
     searchClient: SearchClient;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function SearchForm(): import("react/jsx-runtime").JSX.Element;
-export declare function GlobalSearchProvider({ children, searchClient, }: {
-    children?: ReactNode | ((autocomplete: Autocomplete) => ReactNode);
-    searchClient: SearchClient;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/{search/global-search → global-search}/global-search.stories.d.ts

@@ -6,6 +6,9 @@ declare const meta: {
         searchClient: import("algoliasearch/lite").SearchClient;
     };
     component: typeof GlobalSearch;
+    parameters: {
+        layout: string;
+    };
     title: string;
 };
 export default meta;

package/dist/{search/global-search → global-search}/plugins/products-plugin.d.ts

@@ -1,22 +1,8 @@
 import { AutocompletePlugin } from '@algolia/autocomplete-core';
 import { Hit } from '@algolia/client-search';
 import { SearchClient } from 'algoliasearch/lite';
-export type ProductHit = Hit<{
-    brand: string;
-    categories: string[];
-    discountedPrice: number;
-    ean: string;
-    id: string;
-    image: string;
-    images: {
-        quality: string;
-        url: string;
-    }[];
-    name: string;
-    objectID: string;
-    price: number;
-    slug: string;
-}>;
+import type { ProductHit as ProductHitType } from 'shared/types/product';
+export type ProductHit = Hit<ProductHitType>;
 export declare const productsPlugin: ({ productsIndexName, searchClient, }: {
     productsIndexName: string;
     searchClient: SearchClient;

package/dist/global-search/search-input/connected-search-input.d.ts

@@ -0,0 +1 @@
+export declare function ConnectedSearchInput(): import("react/jsx-runtime").JSX.Element;

package/dist/{search → global-search}/search-input/search-input.d.ts

@@ -1,4 +1,4 @@
-import { Autocomplete } from 'search/global-search/types';
+import { Autocomplete } from 'global-search/types';
 export interface SearchInputProps {
     autocomplete?: Autocomplete;
 }

package/dist/global-search/search-result-panel/panel-content.d.ts

@@ -0,0 +1,10 @@
+export declare function PanelContent(): import("react/jsx-runtime").JSX.Element;
+export declare function NoSearch(): import("react/jsx-runtime").JSX.Element;
+export declare function PopularSearchesSection(): import("react/jsx-runtime").JSX.Element | null;
+export declare function RecentSearchesSection(): import("react/jsx-runtime").JSX.Element | null;
+export declare function QuickAccessSection(): import("react/jsx-runtime").JSX.Element | undefined;
+export declare function NoResults(): import("react/jsx-runtime").JSX.Element;
+export declare function PopularCategoriesSection(): import("react/jsx-runtime").JSX.Element | null;
+export declare function WithResults(): import("react/jsx-runtime").JSX.Element;
+export declare function SuggestionsSection(): import("react/jsx-runtime").JSX.Element;
+export declare function ProductResultsSection(): import("react/jsx-runtime").JSX.Element | null;

package/dist/global-search/search-result-panel/search-result-panel.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { Autocomplete } from 'global-search/types';
+export interface SearchResultPanelProps {
+    autocomplete: Autocomplete;
+    children: ReactNode;
+    closePanel: VoidFunction;
+    isOpen: boolean;
+}
+export declare function SearchResultPanel(): import("react/jsx-runtime").JSX.Element;

package/dist/global-search/search-root/search-root.d.ts

@@ -0,0 +1 @@
+export declare function SearchRoot(): import("react/jsx-runtime").JSX.Element;

package/dist/{search/global-search → global-search}/types.d.ts

@@ -19,5 +19,6 @@ export type GlobalSearchContextValue = {
     productsIndexName: string;
     productsQuerySuggestionsIndexName: string;
     searchClient: SearchClient;
+    setState: React.Dispatch<React.SetStateAction<AutocompleteState>>;
     state: AutocompleteState;
 };

package/dist/index.d.ts

@@ -148,9 +148,41 @@ interface Cart<T extends CartLine = CartLine> {
     cartLines?: T[] | null;
 }
 
-interface Product {
+interface ProductHit {
+    [key: string]: any;
+    alternativeNumber: string;
+    categories: string[];
+    categoryPageId: string[];
+    consumerPrice: number;
+    discountedPrice: number;
+    drawerQuantity: string;
+    ean: string;
+    height: number;
+    hierarchicalCategories: {
+        lvl0: string;
+        lvl1: string;
+    };
     id: string;
-    title: string;
+    images: {
+        quality: string;
+        url: string;
+    }[] | undefined;
+    isVatIncluded: boolean;
+    labels: string[];
+    length: number;
+    listPrice: number;
+    moreInformation: string;
+    name: string;
+    originalPrice: number;
+    price: number;
+    relatedProducts: string;
+    restrictionGroups: string[];
+    salePrice: number;
+    slug: string;
+    storefrontId: string;
+    storefrontSlug: string;
+    weight: number;
+    width: number;
 }
 
 interface Link {
@@ -245,9 +277,9 @@ interface ImageSource {
 }
 
 interface ProductPrice$1 {
-  current: number
-  includeVat?: boolean
-  original?: number
+  isVatIncluded: boolean
+  originalPrice: number
+  price: number
 }
 
 interface ProductCardProps {
@@ -260,10 +292,10 @@ interface ProductCardProps {
     onPress?: (e: PressEvent) => void;
     price: ProductPrice$1;
     sku: string;
-    tag?: 'new' | 'sale';
+    tags?: string[];
     title: string;
 }
-declare function ProductCard({ addToCartButton: AddToCartButton, favoriteButton: FavoriteButton, href, image: { alt, fit, src, title: imageTitle }, onClick, onPress, price, sku, tag, title, }: ProductCardProps): react_jsx_runtime.JSX.Element;
+declare function ProductCard({ addToCartButton: AddToCartButton, favoriteButton: FavoriteButton, href, image: { alt, fit, src, title: imageTitle }, onClick, onPress, price, sku, tags, title, }: ProductCardProps): react_jsx_runtime.JSX.Element;
 
 interface Category {
   href: string
@@ -311,11 +343,11 @@ declare const ShowAll: ({ children, hasTransparency, initialHeight, isOpen, onTo
 
 interface ProductPriceProps {
     className?: string;
-    current: number;
-    includeVat?: boolean;
-    original?: number;
+    isVatIncluded: boolean;
+    originalPrice: number;
+    price: number;
 }
-declare function ProductPrice({ className, current, includeVat, original, }: ProductPriceProps): react_jsx_runtime.JSX.Element | undefined;
+declare function ProductPrice({ className, isVatIncluded, originalPrice, price, }: ProductPriceProps): react_jsx_runtime.JSX.Element | undefined;
 
 interface ProductSkuProps {
     sku: string;
@@ -450,7 +482,7 @@ declare function FavoriteOutlinedIcon(props: React.SVGProps<SVGSVGElement>): rea
 
 declare function HashedOutlinedIcon(props: React.SVGProps<SVGSVGElement>): react_jsx_runtime.JSX.Element;
 
-type TranslationId = 'Chosen filters' | 'Clear' | 'Clear filters' | 'Excl. VAT' | 'Hide filters' | 'Incl. VAT' | 'Show' | 'Show all' | 'Show filters' | 'Show less' | 'Sort' | 'Submit' | 'articles' | 'article' | 'of';
+type TranslationId = 'Chosen filters' | 'Clear' | 'Clear filters' | 'Excl. VAT' | 'Hide filters' | 'Incl. VAT' | 'Show' | 'Show all' | 'Show filters' | 'Show less' | 'Sort' | 'Submit' | 'articles' | 'article' | 'of' | 'sort.relevance' | 'sort.newest' | 'sort.price_asc' | 'sort.price_desc';
 
 interface FormattedMessageProps {
     fallbackValue?: string;
@@ -577,4 +609,16 @@ declare function AlgoliaResultsCount(): string | null;
 
 declare function AlgoliaSortBy(): react_jsx_runtime.JSX.Element | null;
 
-export { Accordion, AddToCartButton, AlgoliaCategories, AlgoliaFilterPanel, type AlgoliaFilterPanelProps, AlgoliaFilterSection, AlgoliaMultiSelectFilterSection, AlgoliaPagination, AlgoliaProvider, AlgoliaResultsCount, AlgoliaSortBy, Breadcrumb, type BreadcrumbProps, Button, type ButtonProps, type Cart, CartFilledIcon, type CartLine, CartOutlinedIcon, CartProvider, CategoryCarousel, type CategoryCarouselProps, Checkbox, type CheckboxProps$1 as CheckboxProps, ColorCheckbox, type ColorCheckboxProps, ConnectedAddToCartButton, ConnectedBreadcrumb, DehashedOutlinedIcon, FavoriteButton, type FavoriteButtonProps, FavoriteFilledIcon, FavoriteOutlinedIcon, FavoriteProvider, type FilterOption, type Filters, FormattedMessage, type FormattedMessageFunction, type FormattedMessageProps, GlobalStateProvider, GlobalStateProviderContext, HashedOutlinedIcon, IconButton, type IconButtonProps, Image, IntlProvider, LeftArrowFilledIcon, LinkButton, type LinkButtonProps, MultiSelect, type MultiSelectProps, NumberField, type NumberFieldSize, Page, PageLayout, type PageProps, type Product, ProductCard, type ProductCardProps, ProductListingPage, type ProductListingPageProps, ProductOverviewGrid, type ProductOverviewGridProps, ProductPrice, type ProductPriceProps, ProductSku, type ProductSkuProps, type RefinementListItem, RightArrowFilledIcon, Select, type SelectProps, ShowAll, type ShowAllProps, Sidebar, type SidebarProps, SidebarProvider, TextAlignedArrowIcon, TextField, createSonicSearchClient, useAlgolia, useBreakpoint, useCart, useDebouncedCallback, useDisclosure, useFavorite, useFormattedMessage, useGlobalState, useProductCartLine, useScrollLock };
+/**
+ * Global search using algolia autocomplete with a custom renderer
+ * https://www.algolia.com/doc/ui-libraries/autocomplete/guides/creating-a-renderer/
+ *
+ * Highly influenced by the two column layout sandbox which
+ * uses the autocomplete widgets
+ * https://codesandbox.io/p/sandbox/github/algolia/autocomplete/tree/next/examples/two-column-layout
+ */
+declare function GlobalSearch(props: {
+    searchClient: SearchClient;
+}): react_jsx_runtime.JSX.Element;
+
+export { Accordion, AddToCartButton, AlgoliaCategories, AlgoliaFilterPanel, type AlgoliaFilterPanelProps, AlgoliaFilterSection, AlgoliaMultiSelectFilterSection, AlgoliaPagination, AlgoliaProvider, AlgoliaResultsCount, AlgoliaSortBy, Breadcrumb, type BreadcrumbProps, Button, type ButtonProps, type Cart, CartFilledIcon, type CartLine, CartOutlinedIcon, CartProvider, CategoryCarousel, type CategoryCarouselProps, Checkbox, type CheckboxProps$1 as CheckboxProps, ColorCheckbox, type ColorCheckboxProps, ConnectedAddToCartButton, ConnectedBreadcrumb, DehashedOutlinedIcon, FavoriteButton, type FavoriteButtonProps, FavoriteFilledIcon, FavoriteOutlinedIcon, FavoriteProvider, type FilterOption, type Filters, FormattedMessage, type FormattedMessageFunction, type FormattedMessageProps, GlobalSearch, GlobalStateProvider, GlobalStateProviderContext, HashedOutlinedIcon, IconButton, type IconButtonProps, Image, IntlProvider, LeftArrowFilledIcon, LinkButton, type LinkButtonProps, MultiSelect, type MultiSelectProps, NumberField, type NumberFieldSize, Page, PageLayout, type PageProps, ProductCard, type ProductCardProps, type ProductHit, ProductListingPage, type ProductListingPageProps, ProductOverviewGrid, type ProductOverviewGridProps, ProductPrice, type ProductPriceProps, ProductSku, type ProductSkuProps, type RefinementListItem, RightArrowFilledIcon, Select, type SelectProps, ShowAll, type ShowAllProps, Sidebar, type SidebarProps, SidebarProvider, TextAlignedArrowIcon, TextField, createSonicSearchClient, useAlgolia, useBreakpoint, useCart, useDebouncedCallback, useDisclosure, useFavorite, useFormattedMessage, useGlobalState, useProductCartLine, useScrollLock };