@wayke-se/components-react 5.2.0 → 6.0.0-beta.1

package/dist/types/src/components/FilterPanel/index.d.ts

@@ -1,20 +1,13 @@
 import React from 'react';
-import { SearchFilterTypes } from '../../@types/filter';
-import { QueryFilter } from '../../@types/queryFilter';
-import { Facet } from '../../@types/search';
-export interface FilterProps {
-    label: string;
-    activeFilters?: number;
+export interface PanelFilter {
+    id: string;
+    displayName: string;
 }
-export interface Props {
-    queryFilter: QueryFilter;
-    facet?: Facet;
-    loading: boolean;
-    filteredFacets: Facet[];
-    filterList?: SearchFilterTypes[];
-    numberOfHits: number;
+interface Props {
+    filters: PanelFilter[];
+    /** The filter whose section is open */
+    open: string;
     onClose: () => void;
-    onFilterUpdate: (nextQuery: string) => void;
 }
-declare const FilterPanel: ({ queryFilter, facet, filteredFacets, numberOfHits, loading, onFilterUpdate, onClose, }: Props) => React.JSX.Element;
+declare const FilterPanel: ({ filters, open, onClose }: Props) => React.JSX.Element;
 export default FilterPanel;

package/dist/types/src/components/FilterPanel/rangeFacet.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import { Facet } from '../../@types/search';
+import { RangeFilter } from '../../Gql/searchParams';
 interface RangeFacetProps {
-    facet: Facet;
+    id: RangeFilter;
     unit?: string;
     formatValues?: boolean;
 }
-declare const RangeFacet: ({ facet, unit, formatValues }: RangeFacetProps) => React.JSX.Element;
+declare const RangeFacet: ({ id, unit, formatValues }: RangeFacetProps) => React.JSX.Element | null;
 export default RangeFacet;

package/dist/types/src/components/FinancialOptions/LoanModal.d.ts

@@ -1,12 +1,8 @@
 import React from 'react';
-import { Branch, FinancialOption, Maybe } from '../../@types/codegen/types';
-import { MarketCode } from '../../@types/market';
+import { PaymentResponse } from '../../Gql/ad/types';
 interface LoanModalProps {
-    id: string;
-    branch?: Maybe<Branch>;
-    financialOption: FinancialOption;
-    marketCode?: MarketCode;
+    loan: PaymentResponse;
     onClose: () => void;
 }
-declare const LoanModal: ({ id, branch, financialOption, marketCode, onClose }: LoanModalProps) => React.JSX.Element;
+declare const LoanModal: ({ loan: option, onClose }: LoanModalProps) => React.JSX.Element;
 export default LoanModal;

package/dist/types/src/components/FinancialOptions/index.d.ts

@@ -1,11 +1,9 @@
 import React from 'react';
-import { Branch, FinancialOption, Maybe } from '../../@types/codegen/types';
-import { MarketCode } from '../../@types/market';
+import { PaymentResponse } from '../../Gql/ad/types';
+import { LeasingOffer } from '../../Gql/ad/view';
 interface FinancialOptionsProps {
-    id: string;
-    branch?: Maybe<Branch>;
-    financialOptions: FinancialOption[];
-    marketCode?: MarketCode;
+    loans: PaymentResponse[];
+    leasing: LeasingOffer[];
 }
-declare const FinancialOptions: ({ id, branch, financialOptions, marketCode }: FinancialOptionsProps) => React.JSX.Element;
+declare const FinancialOptions: ({ loans, leasing }: FinancialOptionsProps) => React.JSX.Element;
 export default FinancialOptions;

package/dist/types/src/components/FinancialOptions/leasing.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { FinancialOption } from '../../@types/codegen/types';
+import { LeasingOffer } from '../../Gql/ad/view';
 interface LeasingProps {
-    financialOption: FinancialOption;
+    offer: LeasingOffer;
 }
-declare const Leasing: ({ financialOption }: LeasingProps) => React.JSX.Element;
+declare const Leasing: ({ offer }: LeasingProps) => React.JSX.Element;
 export default Leasing;

package/dist/types/src/components/FinancialOptions/loan.d.ts

@@ -1,11 +1,7 @@
 import React from 'react';
-import { Branch, FinancialOption, Maybe } from '../../@types/codegen/types';
-import { MarketCode } from '../../@types/market';
+import { PaymentResponse } from '../../Gql/ad/types';
 interface LoanProps {
-    id: string;
-    branch?: Maybe<Branch>;
-    financialOption: FinancialOption;
-    marketCode?: MarketCode;
+    loan: PaymentResponse;
 }
-declare const Loan: ({ id, branch, financialOption, marketCode }: LoanProps) => React.JSX.Element;
+declare const Loan: ({ loan }: LoanProps) => React.JSX.Element;
 export default Loan;

package/dist/types/src/components/Gallery/index.d.ts

@@ -1,10 +1,8 @@
 import React from 'react';
-import { Branch, Maybe, Media } from '../../@types/codegen/types';
+import { GalleryMedia } from '../../Gql/ad/view';
 interface GalleryProps {
-    id: string;
-    branch?: Maybe<Branch>;
-    media?: Media[];
+    media: GalleryMedia[];
     placeholderImage?: string;
 }
-declare const Gallery: ({ id, branch, media, placeholderImage }: GalleryProps) => React.JSX.Element;
+declare const Gallery: ({ media, placeholderImage }: GalleryProps) => React.JSX.Element;
 export default Gallery;

package/dist/types/src/components/Grid/index.d.ts

@@ -1,13 +1,9 @@
 import React from 'react';
-import { Document } from '../../@types/search';
-import { OnItemClick } from '../ProductCard';
+import { SearchHit } from '../../Gql/types';
 interface GridProps {
-    documents?: Document[];
-    hashRoute?: boolean;
-    pathRoute?: string;
+    hits: SearchHit[];
     placeholderImage?: string;
     displayBranchName?: boolean;
-    onClickItem?: (data: OnItemClick) => void;
 }
-declare const Grid: ({ documents, placeholderImage, hashRoute, pathRoute, displayBranchName, onClickItem, }: GridProps) => React.JSX.Element | null;
+declare const Grid: ({ hits, placeholderImage, displayBranchName }: GridProps) => React.JSX.Element;
 export default Grid;

package/dist/types/src/components/InsuranceOptions/Insurance.d.ts

@@ -1,9 +1,7 @@
 import React from 'react';
-import { Branch, InsuranceOption } from '../../@types/codegen/types';
-interface InsuranceOptions {
-    id: string;
-    branch?: Branch | null;
-    insuranceOptions: InsuranceOption[];
+import { InsuranceProvider } from '../../Gql/ad/types';
+interface InsuranceProps {
+    provider: InsuranceProvider;
 }
-declare const Insurance: ({ id, branch, insuranceOptions }: InsuranceOptions) => React.JSX.Element | null;
+declare const Insurance: ({ provider }: InsuranceProps) => React.JSX.Element;
 export default Insurance;

package/dist/types/src/components/InsuranceOptions/InsuranceFree.d.ts

@@ -1,9 +1,7 @@
 import React from 'react';
-import { Branch, InsuranceOption, Maybe } from '../../@types/codegen/types';
-interface InsuranceOptions {
-    id: string;
-    branch?: Maybe<Branch>;
-    insuranceOptions: InsuranceOption[];
+import { InsuranceProvider } from '../../Gql/ad/types';
+interface InsuranceFreeProps {
+    provider: InsuranceProvider;
 }
-declare const Insurance: ({ id, branch, insuranceOptions }: InsuranceOptions) => React.JSX.Element | null;
-export default Insurance;
+declare const InsuranceFree: ({ provider }: InsuranceFreeProps) => React.JSX.Element;
+export default InsuranceFree;

package/dist/types/src/components/InsuranceOptions/InsuranceFreeModal.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { InsuranceOption } from '../../@types/codegen/types';
-interface InsuranceFreeModal {
+import { InsuranceProvider } from '../../Gql/ad/types';
+interface InsuranceFreeModalProps {
     onClose: () => void;
-    insuranceOptions: InsuranceOption;
+    provider: InsuranceProvider;
 }
-declare const InsuranceFreeModal: ({ onClose, insuranceOptions }: InsuranceFreeModal) => React.JSX.Element;
+declare const InsuranceFreeModal: ({ onClose, provider }: InsuranceFreeModalProps) => React.JSX.Element;
 export default InsuranceFreeModal;

package/dist/types/src/components/InsuranceOptions/InsuranceModal.d.ts

@@ -1,10 +1,8 @@
 import React from 'react';
-import { Branch, InsuranceOption } from '../../@types/codegen/types';
-interface InsuranceModal {
-    id: string;
-    branch?: Branch | null;
+import { InsuranceProvider } from '../../Gql/ad/types';
+interface InsuranceModalProps {
     onClose: () => void;
-    insuranceOptions: InsuranceOption;
+    provider: InsuranceProvider;
 }
-declare const InsuranceModal: ({ id, branch, onClose, insuranceOptions }: InsuranceModal) => React.JSX.Element;
+declare const InsuranceModal: ({ onClose, provider }: InsuranceModalProps) => React.JSX.Element;
 export default InsuranceModal;

package/dist/types/src/components/InsuranceOptions/index.d.ts

@@ -1,9 +1,8 @@
 import React from 'react';
-import { Branch, InsuranceOption } from '../../@types/codegen/types';
-interface InsuranceOptions {
-    id: string;
-    branch?: Branch | null;
-    insuranceOptions: InsuranceOption[];
+import { InsuranceProvider } from '../../Gql/ad/types';
+interface InsuranceOptionsProps {
+    provider: InsuranceProvider;
 }
-declare const InsuranceOptions: ({ id, branch, insuranceOptions }: InsuranceOptions) => React.JSX.Element | null;
+/** A quote needs a personal number and a distance; without them the offer is just described. */
+declare const InsuranceOptions: ({ provider }: InsuranceOptionsProps) => React.JSX.Element;
 export default InsuranceOptions;

package/dist/types/src/components/LeadForm/index.d.ts

@@ -1,15 +1,10 @@
 import React from 'react';
-import { Branch, Maybe } from '../../@types/codegen/types';
-import { MarketCode } from '../../@types/market';
 import { LeadCommunication } from '../../hooks/useSubmitLead';
 export type { LeadCommunication };
 interface LeadFormProps {
-    id: string;
-    branch?: Maybe<Branch>;
-    marketCode?: MarketCode;
     communication: LeadCommunication;
     onClose: () => void;
 }
 export declare const normalizeRegistrationNumber: (value: string) => string;
-declare const LeadForm: ({ id, branch, marketCode, communication, onClose }: LeadFormProps) => React.JSX.Element;
+declare const LeadForm: ({ communication, onClose }: LeadFormProps) => React.JSX.Element;
 export default LeadForm;

package/dist/types/src/components/Lightbox/index.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { Media } from '../../@types/codegen/types';
+import { GalleryMedia } from '../../Gql/ad/view';
 interface LightboxProps {
     index: number;
-    media: Media[];
+    media: GalleryMedia[];
     onClose: () => void;
 }
 declare const Lightbox: ({ index, media, onClose }: LightboxProps) => React.JSX.Element;

package/dist/types/src/components/Map/index.d.ts

@@ -1,7 +1,9 @@
 import React from 'react';
-import { Maybe, Position } from '../../@types/codegen/types';
 interface StaticMapProps {
-    position?: Maybe<Position>;
+    position?: {
+        latitude: number;
+        longitude: number;
+    };
 }
 declare const StaticMap: ({ position }: StaticMapProps) => React.JSX.Element | null;
 export default StaticMap;

package/dist/types/src/components/OpeningHours/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { Maybe, OpeningHours } from '../../@types/codegen/types';
+import { WeekOpeningHours } from '../../Gql/ad/view';
 interface OpeningHoursProps {
-    openingHours?: Maybe<OpeningHours>;
+    openingHours?: WeekOpeningHours;
 }
 declare const OpeningHours: ({ openingHours }: OpeningHoursProps) => React.JSX.Element | null;
 export default OpeningHours;

package/dist/types/src/components/ProductCard/HitCard.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { SearchHit } from '../../Gql/types';
+interface HitCardProps {
+    hit: SearchHit;
+    placeholderImage?: string;
+    displayBranchName?: boolean;
+}
+/** A search hit as a product card: the search result and the related cars share it. */
+declare const HitCard: ({ hit, placeholderImage, displayBranchName }: HitCardProps) => React.JSX.Element;
+export default HitCard;

package/dist/types/src/components/ProductCard/index.d.ts

@@ -1,27 +1,23 @@
 import React from 'react';
-import { Branch, File } from '../../@types/search';
 import { ItemProps } from '../UspList';
-export interface OnItemClick {
-    id: string;
-    branchId?: string;
-    branchName?: string;
-}
 interface Props {
     id: string;
     title: string;
-    href?: string;
-    imageFile?: File;
-    pathRoute?: string;
-    branch?: Branch;
+    /** The ad's first image (a cfit url) */
+    image?: string;
+    branch?: {
+        id: string;
+        name?: string;
+    };
     placeholderImage?: string;
     description?: string;
     uspList?: ItemProps[];
-    price: string;
+    /** Left out when the ad has no cash price (0), as on wayke.se */
+    price?: string;
     leasingPrice?: string;
     oldPrice?: string;
     branchName?: string;
     businessLeasingPrice?: string;
-    onClick?: (data: OnItemClick) => void;
 }
-declare const ProductCard: ({ id, title, href, imageFile, pathRoute, placeholderImage, branch, branchName, description, uspList, price, oldPrice, leasingPrice, businessLeasingPrice, onClick, }: Props) => React.JSX.Element;
+declare const ProductCard: ({ id, title, image, placeholderImage, branch, branchName, description, uspList, price, oldPrice, leasingPrice, businessLeasingPrice, }: Props) => React.JSX.Element;
 export default ProductCard;

package/dist/types/src/components/SearchBar/index.d.ts

@@ -3,6 +3,9 @@ interface SearchBarProps {
     value: string;
     setValue: (value: string) => void;
     onSearch: (value: string) => void;
+    /** Typeahead labels shown under the field */
+    suggestions?: string[];
+    onSelectSuggestion?: (index: number) => void;
 }
-declare const SearchBar: ({ value, setValue, onSearch }: SearchBarProps) => React.JSX.Element;
+declare const SearchBar: ({ value, setValue, onSearch, suggestions, onSelectSuggestion, }: SearchBarProps) => React.JSX.Element;
 export default SearchBar;

package/dist/types/src/components/SearchBar/wrapper.d.ts

@@ -0,0 +1,10 @@
+export declare const Suggestions: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "style"> & {
+    style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}, "className"> & Partial<Pick<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "style"> & {
+    style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}, "className">>> & string;
+export declare const Suggestion: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "style"> & {
+    style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}, {
+    $active: boolean;
+}>> & string;

package/dist/types/src/components/SortSelect/index.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
-import { DrivingDistance } from '../../@types/codegen/types';
 export interface OptionProps {
-    value: number | string | DrivingDistance;
+    value: number | string;
     displayName?: number | string;
 }
 interface SortSelectProps {

package/dist/types/src/hooks/useSubmitLead.d.ts

@@ -21,7 +21,7 @@ export interface SubmitLeadProps {
  * website-components-react so leads from any Wayke-powered site look the same in Dealer.
  * `source` (hostname) + `sourceMechanism` is what gives the dealer traceability.
  */
-declare const useSubmitLead: (apiUrl: string | undefined, marketCode?: MarketCode) => {
+declare const useSubmitLead: (leadUrl: string, marketCode?: MarketCode) => {
     isLoading: boolean;
     error: string | null;
     submitLead: ({ itemId, branchId, communication, firstName, lastName, phoneNumber, email, message, tradeInCarRegNo, tradeInCarMileage, }: SubmitLeadProps) => Promise<LeadResponse>;

package/dist/types/src/index.d.ts

@@ -1,13 +1,14 @@
 import type { ConversionOption, ConversionOptionType, ConversionOptionVehicle } from './@types/conversion';
 import type { SearchFilterNameTypes, SearchFilterTypes } from './@types/filter';
+import type { MarketCode } from './@types/market';
 import SearchBar from './components/SearchBar';
 import WaykeSearch, { WaykeSearchProps } from './layouts/search';
 import WaykeSearchItem, { WaykeSearchItemProps } from './layouts/searchItem';
 import WaykeComposite, { WaykeCompositeWithProviderProps } from './layouts/WaykeCompositeWithProvider';
 import WaykeThemeProvider from './providers/themeProvider';
-import WaykeItemProvider, { WaykeItemProviderSettings } from './providers/WaykeItemProvidet';
-import WaykeProvider, { WaykeProviderSettings } from './providers/WaykeProvider';
-import type { CallbackEcom, CallbackEmpty, CallbackHashRouteChange, EventAll, EventEcom, EventFilterApply, EventFinanceClose, EventFinanceInterest, EventFinanceOpen, EventHashRouteChange, EventImagesClick, EventInsuranceClose, EventInsuranceInterest, EventInsuranceOpen, EventItemClicked, EventMailVisible, EventNames, EventOptionsClick, EventPhonenumberCall, EventPhonenumberVisible, EventSearch, EventType, EventView } from './utils/pubsub/Events';
+import WaykeProvider, { EcomSettings, WaykeProviderSettings } from './providers/WaykeProvider';
+import type { Environment, RoutingMode, RoutingSettings } from './State/Settings/settings';
 import WaykePubSub, { EventSubscriptions } from './utils/pubsub/pubsub';
-export { CallbackEcom, CallbackEmpty, CallbackHashRouteChange, ConversionOption, ConversionOptionType, ConversionOptionVehicle, EventAll, EventEcom, EventFilterApply, EventFinanceClose, EventFinanceInterest, EventFinanceOpen, EventHashRouteChange, EventImagesClick, EventInsuranceClose, EventInsuranceInterest, EventInsuranceOpen, EventItemClicked, EventMailVisible, EventNames, EventOptionsClick, EventPhonenumberCall, EventPhonenumberVisible, EventSearch, EventSubscriptions, EventType, EventView, SearchBar, SearchFilterNameTypes, SearchFilterTypes, WaykeCompositeWithProviderProps, WaykeItemProvider, WaykeItemProviderSettings, WaykeProvider, WaykeProviderSettings, WaykePubSub, WaykeSearch, WaykeSearchItem, WaykeSearchItemProps, WaykeSearchProps, WaykeThemeProvider, };
+export { ConversionOption, ConversionOptionType, ConversionOptionVehicle, EcomSettings, Environment, EventSubscriptions, MarketCode, RoutingMode, RoutingSettings, SearchBar, SearchFilterNameTypes, SearchFilterTypes, WaykeCompositeWithProviderProps, WaykeProvider, WaykeProviderSettings, WaykePubSub, WaykeSearch, WaykeSearchItem, WaykeSearchItemProps, WaykeSearchProps, WaykeThemeProvider, };
 export default WaykeComposite;
+export type * from './utils/pubsub/Events';

package/dist/types/src/layouts/WaykeComposite.d.ts

@@ -1,12 +1,7 @@
 import React from 'react';
 import { WaykeSearchProps } from './search';
 import { WaykeSearchItemProps } from './searchItem';
-type WaykeCompositeBaseProps = Omit<WaykeSearchProps & WaykeSearchItemProps, 'id'>;
-export type WaykeCompositeProps = Omit<WaykeCompositeBaseProps, 'hashRoute' | 'onClickSearchItem'> & {
-    /** @deprecated Has no effect. Hash routing is used unless `pathRoute` is set. */
-    hashRoute?: WaykeCompositeBaseProps['hashRoute'];
-    /** @deprecated Has no effect. Subscribe to the `ItemClicked` event with `WaykePubSub` instead. */
-    onClickSearchItem?: WaykeCompositeBaseProps['onClickSearchItem'];
-};
-declare const WaykeComposite: ({ marketCode, filterList, initialQueryParams, removeSearchBar, removeFilterOptions, disableResetScrollOnInit, placeholderImage, pathRoute, modifyDocumentTitleItem, modifyDocumentTitleSearch, displayBranchName, conversionOptions, }: WaykeCompositeProps) => React.JSX.Element | null;
+export type WaykeCompositeProps = WaykeSearchProps & Omit<WaykeSearchItemProps, 'id'>;
+/** The search, switching to the vehicle page when a vehicle is opened. */
+declare const WaykeComposite: ({ filterList, initialQueryParams, removeSearchBar, removeFilterOptions, disableResetScrollOnInit, placeholderImage, modifyDocumentTitleItem, modifyDocumentTitleSearch, displayBranchName, conversionOptions, }: WaykeCompositeProps) => React.JSX.Element;
 export default WaykeComposite;

package/dist/types/src/layouts/WaykeCompositeWithProvider.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { WaykeProviderProps } from '../providers/WaykeProvider';
 import { WaykeCompositeProps } from './WaykeComposite';
 export interface WaykeCompositeWithProviderProps {
-    provider: WaykeProviderProps;
+    provider?: WaykeProviderProps;
     composite?: WaykeCompositeProps;
 }
 declare const WaykeCompositeWithProvider: ({ provider, composite }: WaykeCompositeWithProviderProps) => React.JSX.Element;

package/dist/types/src/layouts/search/index.d.ts

@@ -1,19 +1,18 @@
 import React from 'react';
 import { SearchFilterTypes } from '../../@types/filter';
-import { MarketCode } from '../../@types/market';
-import { OnItemClick } from '../../components/ProductCard';
 export interface WaykeSearchProps {
-    marketCode?: MarketCode;
+    /** The filters to show, in this order. By default all filters. */
     filterList?: SearchFilterTypes[];
+    /** Filters applied when the search loads. */
     initialQueryParams?: URLSearchParams | string;
     removeSearchBar?: boolean;
     removeFilterOptions?: boolean;
+    /** Url to an image for vehicles without images. */
     placeholderImage?: string;
-    hashRoute?: boolean;
-    pathRoute?: string;
+    /** Sets the page title. */
     modifyDocumentTitleSearch?: string;
+    /** Shows the branch name on the vehicles. */
     displayBranchName?: boolean;
-    onClickSearchItem?: (data: OnItemClick) => void;
 }
-declare const WaykeSearch: ({ marketCode, filterList: _filterList, initialQueryParams, hashRoute, pathRoute, removeSearchBar, placeholderImage, removeFilterOptions, modifyDocumentTitleSearch, displayBranchName, onClickSearchItem, }: WaykeSearchProps) => React.JSX.Element | null;
+declare const WaykeSearch: ({ filterList, initialQueryParams, removeSearchBar, placeholderImage, removeFilterOptions, modifyDocumentTitleSearch, displayBranchName, }: WaykeSearchProps) => React.JSX.Element;
 export default WaykeSearch;

package/dist/types/src/layouts/searchItem/Accessories/AccessoryModal.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { Accessory } from '../../../@types/codegen/types';
+import { AdAccessory } from '../../../Gql/ad/types';
 interface AccesoryModalProps {
-    accessory: Accessory;
+    accessory: AdAccessory;
     onClose: () => void;
 }
 declare const AccesoryModal: ({ accessory, onClose }: AccesoryModalProps) => React.JSX.Element;

package/dist/types/src/layouts/searchItem/Accessories/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { Accessory } from '../../../@types/codegen/types';
+import { AdAccessory } from '../../../Gql/ad/types';
 interface AccessoriesSectionProps {
-    accessories?: Accessory[];
+    accessories: AdAccessory[];
 }
 declare const AccessoriesSection: ({ accessories }: AccessoriesSectionProps) => React.JSX.Element | null;
 export default AccessoriesSection;

package/dist/types/src/layouts/searchItem/Branch.d.ts

@@ -1,9 +1,8 @@
 import React from 'react';
-import { Branch, Maybe } from '../../@types/codegen/types';
+import { Ad } from '../../Gql/ad/types';
 interface BranchProps {
-    branch?: Maybe<Branch>;
-    loading: boolean;
+    branch: Ad['branch'];
     displayBranchName?: boolean;
 }
-declare const Branch: ({ branch, loading, displayBranchName }: BranchProps) => React.JSX.Element | null;
+declare const Branch: ({ branch, displayBranchName }: BranchProps) => React.JSX.Element;
 export default Branch;

package/dist/types/src/layouts/searchItem/CheckList.d.ts

@@ -1,21 +1,9 @@
 import React from 'react';
-import { Branch, ContactOptions, Ecommerce, Manufacturer, PackageOption, VehicleData } from '../../@types/codegen/types';
 import { ConversionOption } from '../../@types/conversion';
-import { MarketCode } from '../../@types/market';
-interface CheckList {
-    id: string;
-    title?: string | null;
-    vehicleData?: VehicleData | null;
+interface CheckListProps {
+    title: string;
     conversionOptions?: ConversionOption[];
-    marketCode?: MarketCode;
-    manufacturer?: Manufacturer | null;
-    packageOptions: PackageOption[];
-    ecommerce?: Ecommerce | null;
-    branch?: Branch | null;
-    contact?: ContactOptions | null;
-    loadingCentralStorageVehicle: boolean;
-    availableFrom?: Date | null;
     toggleEcomModal?: () => void;
 }
-declare const CheckList: ({ id, title, vehicleData, conversionOptions, marketCode, manufacturer, packageOptions, ecommerce, branch, contact, availableFrom, toggleEcomModal, loadingCentralStorageVehicle, }: CheckList) => React.JSX.Element;
+declare const CheckList: ({ title, conversionOptions, toggleEcomModal }: CheckListProps) => React.JSX.Element;
 export default CheckList;

package/dist/types/src/layouts/searchItem/Documents.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { Scalars } from '../../@types/codegen/types';
+import { AdDocument } from '../../Gql/ad/types';
 interface DocumentsProps {
-    documents: Scalars['FileDocument']['input'][];
+    documents: AdDocument[];
 }
 declare const Documents: ({ documents }: DocumentsProps) => React.JSX.Element | null;
 export default Documents;

package/dist/types/src/layouts/searchItem/ManufacturerPackagesOption.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { Maybe, PackageOption } from '../../@types/codegen/types';
+import { PackageOffer } from '../../Gql/ad/view';
 interface ManufacturerPackageOption {
-    packageOption?: Maybe<PackageOption>;
+    packageOption?: PackageOffer;
 }
 declare const ManufacturerPackageOption: ({ packageOption }: ManufacturerPackageOption) => React.JSX.Element | null;
 export default ManufacturerPackageOption;

package/dist/types/src/layouts/searchItem/PackageOptions.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { PackageOption } from '../../@types/codegen/types';
+import { PackageOffer } from '../../Gql/ad/view';
 interface PackageOptionsProps {
-    packageOptions?: PackageOption[] | null;
+    packageOptions: PackageOffer[];
 }
-declare const PackageOptions: ({ packageOptions }: PackageOptionsProps) => React.JSX.Element | null;
+declare const PackageOptions: ({ packageOptions }: PackageOptionsProps) => React.JSX.Element;
 export default PackageOptions;

package/dist/types/src/layouts/searchItem/Property.d.ts

@@ -1,8 +1,3 @@
 import React from 'react';
-import { VehicleData } from '../../@types/codegen/types';
-interface PropertySetProps {
-    propertySet: any;
-    vehicleData: VehicleData;
-}
-declare const PropertySet: ({ propertySet, vehicleData }: PropertySetProps) => React.JSX.Element;
+declare const PropertySet: () => React.JSX.Element;
 export default PropertySet;

package/dist/types/src/layouts/searchItem/Related.d.ts

@@ -1,11 +1,10 @@
 import React from 'react';
 interface RelatedProps {
-    id: string;
-    hashRoute?: boolean;
-    pathRoute?: string;
-    authorizedReseller?: boolean;
+    adId: string;
+    manufacturer?: string;
+    placeholderImage?: string;
     displayBranchName?: boolean;
-    onClickSearchItem?: (id: string) => void;
 }
-declare const Related: ({ id, hashRoute, pathRoute, authorizedReseller, displayBranchName, onClickSearchItem, }: RelatedProps) => React.JSX.Element | null;
+/** The latest cars of the same make. */
+declare const Related: ({ adId, manufacturer, placeholderImage, displayBranchName }: RelatedProps) => React.JSX.Element | null;
 export default Related;

package/dist/types/src/layouts/searchItem/index.d.ts

@@ -1,17 +1,19 @@
 import React from 'react';
 import { ConversionOption } from '../../@types/conversion';
-import { MarketCode } from '../../@types/market';
 export interface WaykeSearchItemProps {
-    marketCode?: MarketCode;
+    /** The id of the vehicle. Older ids are resolved, and the url is updated to the new one. */
     id: string;
-    hashRoute?: boolean;
-    pathRoute?: string;
+    /** Keeps the scroll position when the vehicle page opens. By default it scrolls to the top. */
     disableResetScrollOnInit?: boolean;
+    /** Url to an image for vehicles without images. */
     placeholderImage?: string;
+    /** Sets the page title to the vehicle. */
     modifyDocumentTitleItem?: boolean;
+    /** Shows the branch name on related vehicles and where the vehicle is located. */
     displayBranchName?: boolean;
+    /** The buttons on the vehicle page. */
     conversionOptions?: ConversionOption[];
-    onClickSearchItem?: (id: string) => void;
 }
-declare const WaykeSearchItem: ({ marketCode, id, hashRoute, pathRoute, disableResetScrollOnInit, placeholderImage, modifyDocumentTitleItem, displayBranchName, conversionOptions, onClickSearchItem, }: WaykeSearchItemProps) => React.JSX.Element | null;
+/** The vehicle page. */
+declare const WaykeSearchItem: ({ id, disableResetScrollOnInit, ...props }: WaykeSearchItemProps) => React.JSX.Element;
 export default WaykeSearchItem;

package/dist/types/src/layouts/searchItem/useEcom.d.ts

@@ -1,8 +1,12 @@
-import { Branch, Maybe } from '../../@types/codegen/types';
-import { SettingsContextProps } from '../../State/Settings/SettingsContext';
+import { Ad } from '../../Gql/ad/types';
+import { Settings } from '../../State/Settings/settings';
 interface EcomWeb {
     start: () => void;
     destroy: () => void;
 }
-declare function useEcom(id: string, ecomSettings: SettingsContextProps['ecomSettings'], branch?: Maybe<Branch>): import("react").RefObject<EcomWeb | undefined>;
+/**
+ * Buy online. ecom-web is keyed on the legacy waykeId: the commerce order flow
+ * answers 404 on ad.id for ads from before ads-service.
+ */
+declare function useEcom(ad: Ad, ecom: Settings['ecom'], marketCode: Settings['marketCode']): import("react").RefObject<EcomWeb | undefined>;
 export default useEcom;