@wayke-se/components-react 2.13.0 → 2.16.0

package/dist-src/components/Content/wrapper.js

@@ -39,6 +39,11 @@ export const Wrapper = styled.div `
     }
   }
 
+  img {
+    display: block;
+    width: 100%;
+  }
+
   ${({ small }) => small &&
     css `
       font-size: 0.875rem;

package/dist-src/components/InsuranceOptions/Insurance.js

@@ -0,0 +1,26 @@
+import React, { useState, useCallback } from 'react';
+import { Repeat, RepeatTiny } from '../Repeat/index';
+import { VisualHeading } from '../Heading/index';
+import OptionBox from '../OptionBox/index';
+import { OptionBoxHeading, OptionBoxContent } from '../OptionBox/wrapper';
+import { ButtonInline } from '../Button/index';
+import InsuranceModal from './InsuranceModal';
+const Insurance = ({ id, branch, insuranceOptions }) => {
+    const [modal, setModal] = useState(false);
+    const toggleModal = useCallback(() => setModal(!modal), [modal]);
+    if (!insuranceOptions.length) {
+        return null;
+    }
+    return (React.createElement(React.Fragment, null,
+        modal && (React.createElement(InsuranceModal, { id: id, branch: branch, onClose: toggleModal, insuranceOptions: insuranceOptions[0] })),
+        React.createElement(Repeat, null,
+            React.createElement(RepeatTiny, null,
+                React.createElement(VisualHeading, null, "V\u00E4lj till f\u00F6rs\u00E4kring")),
+            React.createElement(RepeatTiny, null,
+                React.createElement(React.Fragment, null, insuranceOptions.map((insuranceOption, index) => (React.createElement(OptionBox, { key: `${insuranceOption.url}-${index}`, logo: insuranceOption.logotype || undefined, logoAlt: insuranceOption.name || 'Logotyp' },
+                    React.createElement(OptionBoxHeading, null, "F\u00E5 prisf\u00F6rslag"),
+                    React.createElement(OptionBoxContent, null,
+                        React.createElement("p", null,
+                            React.createElement(ButtonInline, { onClick: toggleModal }, "Mer information")))))))))));
+};
+export default Insurance;

package/dist-src/components/InsuranceOptions/InsuranceFree.js

@@ -0,0 +1,31 @@
+import React, { useState, useCallback } from 'react';
+import { Repeat, RepeatTiny } from '../Repeat/index';
+import { VisualHeading } from '../Heading/index';
+import OptionBox from '../OptionBox/index';
+import { OptionBoxContent } from '../OptionBox/wrapper';
+import Content from '../Content/index';
+import { marked } from 'marked';
+import { ButtonInline } from '../Button/index';
+import InsuranceFreeModal from './InsuranceFreeModal';
+const Insurance = ({ insuranceOptions }) => {
+    var _a, _b;
+    const [modal, setModal] = useState(false);
+    const toggleModal = useCallback(() => setModal(!modal), [modal]);
+    if (!insuranceOptions.length) {
+        return null;
+    }
+    return (React.createElement(React.Fragment, null,
+        modal && React.createElement(InsuranceFreeModal, { onClose: toggleModal, insuranceOptions: insuranceOptions[0] }),
+        React.createElement(Repeat, null,
+            React.createElement(RepeatTiny, null,
+                React.createElement(VisualHeading, null, (_b = (_a = insuranceOptions[0]) === null || _a === void 0 ? void 0 : _a.insuranceHeader) !== null && _b !== void 0 ? _b : 'Försäkring')),
+            React.createElement(RepeatTiny, null,
+                React.createElement(React.Fragment, null, insuranceOptions.map((insuranceOption, index) => (React.createElement(OptionBox, { key: `${insuranceOption.url}-${index}`, logo: insuranceOption.logotype || undefined, logoAlt: insuranceOption.name || 'Logotyp' },
+                    insuranceOption.description && (React.createElement(Content, { dangerouslySetInnerHTML: {
+                            __html: marked(insuranceOption.description),
+                        } })),
+                    React.createElement(OptionBoxContent, null,
+                        React.createElement("p", null,
+                            React.createElement(ButtonInline, { onClick: toggleModal }, "Mer information")))))))))));
+};
+export default Insurance;

package/dist-src/components/InsuranceOptions/InsuranceFreeModal.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import Modal from '../Modal/index';
+import Content from '../Content/index';
+import { Repeat } from '../Repeat/index';
+import { ButtonInline } from '../Button/index';
+import LogoBox from '../LogoBox/index';
+import { marked } from 'marked';
+const InsuranceFreeModal = ({ onClose, insuranceOptions }) => {
+    var _a;
+    return (React.createElement(Modal, { title: (_a = insuranceOptions === null || insuranceOptions === void 0 ? void 0 : insuranceOptions.insuranceHeader) !== null && _a !== void 0 ? _a : 'Försäkring', onClose: onClose },
+        (insuranceOptions === null || insuranceOptions === void 0 ? void 0 : insuranceOptions.longDescription) && (React.createElement(Repeat, null,
+            React.createElement(Content, { dangerouslySetInnerHTML: {
+                    __html: marked(insuranceOptions.longDescription),
+                } }))),
+        (insuranceOptions === null || insuranceOptions === void 0 ? void 0 : insuranceOptions.url) && (React.createElement(Repeat, null,
+            React.createElement(ButtonInline, { as: "a", href: insuranceOptions.url, target: "_blank", rel: "noopener noreferrer" }, "L\u00E4s mer om f\u00F6rs\u00E4kringen (\u00D6ppnas i ett nytt f\u00F6nster)"))),
+        (insuranceOptions === null || insuranceOptions === void 0 ? void 0 : insuranceOptions.logotype) && (React.createElement(Repeat, null,
+            React.createElement(LogoBox, { logo: insuranceOptions.logotype, alt: insuranceOptions.name || 'Logotyp', wide: true })))));
+};
+export default InsuranceFreeModal;

package/dist-src/components/InsuranceOptions/{InsuranceOptionModal.js → InsuranceModal.js}

@@ -22,13 +22,13 @@ import Loader from '../Loader/index';
 import { numberSeparator } from '../../utils/formats';
 import { DrivingDistance } from '../../@types/codegen/types';
 import PubSub from '../../utils/pubsub/pubsub';
-const InsuranceOptionModal = ({ id, onClose, insuranceOptions }) => {
+const InsuranceModal = ({ id, branch, onClose, insuranceOptions }) => {
     const [form, setForm] = useState({
         ssn: '',
         drivingDistance: DrivingDistance.Between0And1000,
     });
     const [payload, setPayload] = useState();
-    const { loading, data, error } = useInsuranceCalculation(id, ssnIsValid(payload === null || payload === void 0 ? void 0 : payload.ssn) ? payload === null || payload === void 0 ? void 0 : payload.ssn : undefined, payload === null || payload === void 0 ? void 0 : payload.drivingDistance);
+    const { loading, data, error } = useInsuranceCalculation(id, (branch === null || branch === void 0 ? void 0 : branch.id) ? branch === null || branch === void 0 ? void 0 : branch.id : undefined, ssnIsValid(payload === null || payload === void 0 ? void 0 : payload.ssn) ? payload === null || payload === void 0 ? void 0 : payload.ssn : undefined, payload === null || payload === void 0 ? void 0 : payload.drivingDistance);
     const onChangeSsn = useCallback((e) => setForm({ ...form, ssn: e.currentTarget.value }), [form]);
     const onChangeDrivingDistance = useCallback((e) => setForm({ ...form, drivingDistance: e.currentTarget.value }), [form]);
     const onShowInsurances = useCallback(() => {
@@ -102,4 +102,4 @@ const InsuranceOptionModal = ({ id, onClose, insuranceOptions }) => {
                                     " ",
                                     addon.unit)))))))))))))))));
 };
-export default InsuranceOptionModal;
+export default InsuranceModal;

package/dist-src/components/InsuranceOptions/index.js

@@ -1,26 +1,15 @@
-import React, { useState, useCallback } from 'react';
-import { Repeat, RepeatTiny } from '../Repeat/index';
-import { VisualHeading } from '../Heading/index';
-import OptionBox from '../OptionBox/index';
-import { OptionBoxHeading, OptionBoxContent } from '../OptionBox/wrapper';
-import { ButtonInline } from '../Button/index';
-import InsuranceOptionModal from './InsuranceOptionModal';
-const InsuranceOptions = ({ id, insuranceOptions }) => {
-    const [modal, setModal] = useState(false);
-    const toggleModal = useCallback(() => setModal(!modal), [modal]);
+import React from 'react';
+import Insurance from './Insurance';
+import InsuranceFree from './InsuranceFree';
+const InsuranceOptions = ({ id, branch, insuranceOptions }) => {
     if (!insuranceOptions.length) {
         return null;
     }
-    return (React.createElement(React.Fragment, null,
-        modal && (React.createElement(InsuranceOptionModal, { id: id, onClose: toggleModal, insuranceOptions: insuranceOptions[0] })),
-        React.createElement(Repeat, null,
-            React.createElement(RepeatTiny, null,
-                React.createElement(VisualHeading, null, "V\u00E4lj till f\u00F6rs\u00E4kring")),
-            React.createElement(RepeatTiny, null,
-                React.createElement(React.Fragment, null, insuranceOptions.map((insuranceOption, index) => (React.createElement(OptionBox, { key: `${insuranceOption.url}-${index}`, logo: insuranceOption.logotype || undefined, logoAlt: insuranceOption.name || 'Logotyp' },
-                    React.createElement(OptionBoxHeading, null, "F\u00E5 prisf\u00F6rslag"),
-                    React.createElement(OptionBoxContent, null,
-                        React.createElement("p", null,
-                            React.createElement(ButtonInline, { onClick: toggleModal }, "Mer information")))))))))));
+    if (insuranceOptions.length > 0) {
+        if (insuranceOptions[0].requiresDistance && insuranceOptions[0].requiresPersonalNumber)
+            return React.createElement(Insurance, { id: id, branch: branch, insuranceOptions: insuranceOptions });
+        return React.createElement(InsuranceFree, { insuranceOptions: insuranceOptions });
+    }
+    return null;
 };
 export default InsuranceOptions;

package/dist-src/components/Pdf/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { PdfListItem, PdfSubtitle, PdfTitle, PdfContainer, PdfListInner, PdfLink, PdfColumn, } from './wrapper';
+export const PdfDownloadItem = ({ document }) => (React.createElement(PdfListItem, null,
+    React.createElement(PdfListInner, null,
+        React.createElement(PdfColumn, null,
+            React.createElement(PdfTitle, null, document.name),
+            React.createElement(PdfSubtitle, null, document.contentType)),
+        React.createElement(PdfColumn, null,
+            React.createElement(PdfLink, { href: document.url, rel: "noopener noreferrer nofollow", target: "_blank" }, "\u00D6ppna")))));
+export const PdfDownloadContainer = ({ documents }) => (React.createElement(PdfContainer, null, documents.map((document, i) => (React.createElement(PdfDownloadItem, { key: `${document.url}-${i}`, document: document })))));
+export default PdfDownloadContainer;

package/dist-src/components/Pdf/wrapper.js

@@ -0,0 +1,55 @@
+import styled from 'styled-components';
+import { size } from '../../layout/helpers';
+export const PdfListItem = styled.li.attrs(() => ({
+    className: 'wayke__theme wayke__color--primary-text',
+})) `
+  flex: 0 0 50%;
+  padding: ${size(1)};
+
+  ${({ theme }) => theme.breakpoint.LtSm} {
+    flex: 0 0 100%;
+  }
+`;
+export const PdfContainer = styled.ul `
+  list-style: none;
+  padding: 0;
+  display: flex;
+  flex-wrap: wrap;
+  margin: ${size(-1)};
+`;
+export const PdfLink = styled.a.attrs(() => ({
+    className: 'wayke__theme wayke__color--primary-text wayke__font--bold',
+})) `
+  text-decoration: none;
+  font-size: 0.875rem;
+  &:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+  }
+`;
+export const PdfTitle = styled.div `
+  color: ${(props) => props.theme.color.textDark};
+`;
+export const PdfSubtitle = styled.div `
+  color: ${(props) => props.theme.color.textDarkLighten};
+`;
+export const PdfColumn = styled.div `
+  flex 0 0 auto;
+  &:first-child {
+    flex: 1 1 auto;
+  }
+`;
+export const PdfListInner = styled.div `
+  position: relative;
+  border: 1px solid ${(props) => props.theme.color.border};
+  padding: ${size(1.5)};
+  display: flex;
+  align-items: center;
+  :hover {
+    background-color: ${(props) => props.theme.color.hoverOverlay};
+  }
+`;

package/dist-src/hooks/useInsurance.js

@@ -1,11 +1,12 @@
 import { useQuery } from '@apollo/client';
 import INSURANCE_CALCULATION from '../queries/INSURANCE_CALCULATION';
-const useInsuranceCalculation = (id, personalNumber, drivingDistance) => useQuery(INSURANCE_CALCULATION, {
+const useInsuranceCalculation = (id, branchId, personalNumber, drivingDistance) => useQuery(INSURANCE_CALCULATION, {
     variables: {
         id,
+        branch: branchId,
         personalNumber: personalNumber,
         drivingDistance: drivingDistance,
     },
-    skip: personalNumber === undefined || drivingDistance === undefined,
+    skip: personalNumber === undefined || drivingDistance === undefined || branchId === undefined,
 });
 export default useInsuranceCalculation;

package/dist-src/layouts/searchItem/MetadataItem.js

@@ -2,7 +2,7 @@ import React, { useState, useCallback } from 'react';
 import { TableListItem, TableListKey, TableListValue, TableListBooleanPos, TableListBooleanNeg, } from '../../components/TableList/index';
 import { IconCheck, IconCancel } from '../../components/Icon/index';
 import { SrOnly } from '../../components/SrOnly/index';
-import { ButtonInlinePrimary } from '../../components/Button/index';
+import { ButtonInline } from '../../components/Button/index';
 import Modal from '../../components/Modal/index';
 import Content from '../../components/Content/index';
 const formatValue = (value, unit) => {
@@ -26,7 +26,7 @@ const MetadataItem = ({ name, hint, value, unit }) => {
     const onToggleFoldout = useCallback(() => setFoldout(!foldout), [foldout]);
     const presentedValue = formatValue(value, unit);
     return (React.createElement(TableListItem, null,
-        React.createElement(TableListKey, null, hint ? (React.createElement(ButtonInlinePrimary, { onClick: onToggleFoldout, title: `Mer information om ${name}` }, name)) : (name)),
+        React.createElement(TableListKey, null, hint ? (React.createElement(ButtonInline, { onClick: onToggleFoldout, title: `Mer information om ${name}` }, name)) : (name)),
         React.createElement(TableListValue, null, value !== undefined ? presentedValue : 'Uppgift saknas'),
         hint && foldout && (React.createElement(Modal, { title: name, onClose: onToggleFoldout },
             React.createElement(Content, { dangerouslySetInnerHTML: { __html: hint } })))));

package/dist-src/layouts/searchItem/index.js

@@ -31,6 +31,7 @@ import Page404 from './Page404';
 import PageLoading from './PageLoading';
 import PubSub from '../../utils/pubsub/pubsub';
 import Property from './Property';
+import PdfDownloadContainer from '../../components/Pdf/index';
 const WaykeSearchItem = ({ id, hashRoute, pathRoute, disableResetScrollOnInit, placeholderImage, modifyDocumentTitleItem, onClickSearchItem, }) => {
     var _a, _b, _c;
     const [ecomModal, setEcomModal] = useState(false);
@@ -61,7 +62,10 @@ const WaykeSearchItem = ({ id, hashRoute, pathRoute, disableResetScrollOnInit, p
     const { vehicle } = result;
     const contact = centralStorageVehicle === null || centralStorageVehicle === void 0 ? void 0 : centralStorageVehicle.contact;
     const branch = centralStorageVehicle === null || centralStorageVehicle === void 0 ? void 0 : centralStorageVehicle.branch;
-    const { title, shortDescription, media, description, price, financialOptions, insuranceOptions, manufacturer, ecommerce, packageOptions, publishedAt, } = vehicle;
+    const { title, shortDescription, media, description, price, financialOptions, manufacturer, ecommerce, packageOptions, publishedAt, documents, } = vehicle;
+    const insuranceOptions = (centralStorageVehicle === null || centralStorageVehicle === void 0 ? void 0 : centralStorageVehicle.insuranceOptions)
+        ? centralStorageVehicle.insuranceOptions
+        : vehicle.insuranceOptions;
     const { fuelType, mileage, gearbox, modelYear, propertySet } = vehicle.data;
     const uspList = [
         {
@@ -104,7 +108,7 @@ const WaykeSearchItem = ({ id, hashRoute, pathRoute, disableResetScrollOnInit, p
                                 React.createElement(PriceTable, { price: price })),
                             (financialOptions.length > 0 || insuranceOptions.length > 0) && (React.createElement(ProductPageAsideSection, { mobileOrder: 4 },
                                 financialOptions.length > 0 && (React.createElement(FinancialOptions, { id: id, financialOptions: financialOptions })),
-                                insuranceOptions.length > 0 && (React.createElement(InsuranceOptions, { id: id, insuranceOptions: insuranceOptions })))),
+                                insuranceOptions.length > 0 && (React.createElement(InsuranceOptions, { id: id, branch: centralStorageVehicle === null || centralStorageVehicle === void 0 ? void 0 : centralStorageVehicle.branch, insuranceOptions: insuranceOptions })))),
                             React.createElement(ProductPageAsideSection, { mobileOrder: 5 },
                                 React.createElement(CheckList, { manufacturer: manufacturer, packageOptions: packageOptions, ecommerce: ecommerce, branch: branch, contact: centralStorageVehicle === null || centralStorageVehicle === void 0 ? void 0 : centralStorageVehicle.contact, loadingCentralStorageVehicle: loadingCentralStorageVehicle, toggleEcomModal: toggleEcomModal }))),
                         React.createElement(ProductPageMain, null,
@@ -131,6 +135,14 @@ const WaykeSearchItem = ({ id, hashRoute, pathRoute, disableResetScrollOnInit, p
                                 React.createElement(Repeat, null,
                                     React.createElement(ExtendContent, { actionTitle: "Visa mer", onClick: onShowMoreOptionsClick },
                                         React.createElement(UspList, { items: options }))))),
+                            (documents.length || 0) > 0 && (React.createElement(ProductPageMainSection, null,
+                                React.createElement(Repeat, null,
+                                    React.createElement(H2, { noMargin: true }, "Dokument")),
+                                React.createElement(Repeat, null,
+                                    React.createElement(Content, null,
+                                        React.createElement("p", null, "Tillh\u00F6rande dokument f\u00F6r bilen."))),
+                                React.createElement(Repeat, null,
+                                    React.createElement(PdfDownloadContainer, { documents: documents })))),
                             React.createElement(ProductPageMainSection, null,
                                 React.createElement(Branch, { branch: branch, loading: loadingCentralStorageVehicle }),
                                 ecommerce && ecommerce.enabled && (React.createElement(Repeat, null,

package/dist-src/queries/INSURANCE_CALCULATION.js

@@ -2,10 +2,16 @@ import { gql } from '@apollo/client';
 const INSURANCE_CALCULATION = gql `
   query InsuranceCalculation(
     $id: ID!
+    $branch: ID
     $personalNumber: PersonalNumber!
     $drivingDistance: DrivingDistance!
   ) {
-    insurances(id: $id, personalNumber: $personalNumber, drivingDistance: $drivingDistance) {
+    insurances(
+      id: $id
+      branch: $branch
+      personalNumber: $personalNumber
+      drivingDistance: $drivingDistance
+    ) {
       name
       price
       unit

package/dist-src/queries/SEARCH_ITEM_BRANCH_QUERY.js

@@ -96,6 +96,20 @@ const SEARCH_ITEM_BRANCH_QUERY = gql `
           title
         }
       }
+      insuranceOptions {
+        insuranceHeader
+        institute
+        identifier
+        logotype
+        name
+        description
+        longDescription
+        url
+        insuranceText
+        requiresPersonalNumber
+        requiresDistance
+        terms
+      }
     }
   }
   ${HoursOpen}

package/dist-src/queries/SEARCH_ITEM_QUERY.js

@@ -18,6 +18,7 @@ const SEARCH_ITEM_QUERY = gql `
   query SearchItem($id: ID!) {
     vehicle(id: $id) {
       id
+      documents
       contact {
         name
         email
@@ -157,10 +158,17 @@ const SEARCH_ITEM_QUERY = gql `
         withHomeDelivery
       }
       insuranceOptions {
-        description
+        insuranceHeader
+        institute
+        identifier
         logotype
-        url
         name
+        description
+        longDescription
+        url
+        insuranceText
+        requiresPersonalNumber
+        requiresDistance
         terms
       }
       financialOptions {

package/dist-types/@types/codegen/types.d.ts

@@ -1,4 +1,5 @@
 export declare type Maybe<T> = T | null;
+export declare type InputMaybe<T> = Maybe<T>;
 export declare type Exact<T extends {
     [key: string]: unknown;
 }> = {
@@ -19,6 +20,11 @@ export declare type Scalars = {
     Float: number;
     DateTime: Date;
     Email: string;
+    FileDocument: {
+        contentType: string;
+        name: string;
+        url: string;
+    };
     PersonalNumber: string;
     PhoneNumber: string;
     Time: string;
@@ -30,38 +36,38 @@ export declare type Scalars = {
 };
 export declare type Branch = {
     __typename?: 'Branch';
-    id: Scalars['ID'];
+    connections: Array<BranchConnection>;
+    contact?: Maybe<ContactOptions>;
     description?: Maybe<Scalars['String']>;
     flags?: Maybe<BranchFlags>;
-    name?: Maybe<Scalars['String']>;
-    contact?: Maybe<ContactOptions>;
     homepage?: Maybe<Scalars['URL']>;
+    id: Scalars['ID'];
+    location?: Maybe<Location>;
     logotype?: Maybe<Scalars['URL']>;
+    name?: Maybe<Scalars['String']>;
     openingHours?: Maybe<OpeningHours>;
     organization?: Maybe<Organization>;
-    location?: Maybe<Location>;
     promos: Array<Promo>;
     services: Array<Service>;
-    connections: Array<BranchConnection>;
 };
 export declare type BranchConnection = {
     __typename?: 'BranchConnection';
     id: Scalars['ID'];
-    name?: Maybe<Scalars['String']>;
     location?: Maybe<Location>;
+    name?: Maybe<Scalars['String']>;
 };
 export declare type BranchFlags = {
     __typename?: 'BranchFlags';
-    mrf?: Maybe<Scalars['Boolean']>;
     centralStorage?: Maybe<Scalars['Boolean']>;
     ecommerce?: Maybe<Scalars['Boolean']>;
+    mrf?: Maybe<Scalars['Boolean']>;
 };
 export declare type ContactOptions = {
     __typename?: 'ContactOptions';
-    name?: Maybe<Scalars['String']>;
+    avatar?: Maybe<Scalars['URL']>;
     email?: Maybe<Scalars['Email']>;
+    name?: Maybe<Scalars['String']>;
     phonenumber?: Maybe<Scalars['PhoneNumber']>;
-    avatar?: Maybe<Scalars['URL']>;
 };
 export declare enum DrivingDistance {
     Between0And1000 = "BETWEEN0AND1000",
@@ -74,8 +80,8 @@ export declare type Ecommerce = {
     __typename?: 'Ecommerce';
     enabled?: Maybe<Scalars['Boolean']>;
     reserved?: Maybe<Scalars['Boolean']>;
-    withTradeIn?: Maybe<Scalars['Boolean']>;
     withHomeDelivery?: Maybe<Scalars['Boolean']>;
+    withTradeIn?: Maybe<Scalars['Boolean']>;
 };
 export declare type FinancialOption = {
     __typename?: 'FinancialOption';
@@ -122,30 +128,30 @@ export declare type HoursOpen = {
 };
 export declare type Insurance = {
     __typename?: 'Insurance';
-    name: Scalars['String'];
-    price: Scalars['Float'];
-    unit: Scalars['String'];
-    description: Scalars['String'];
-    logotype?: Maybe<Scalars['URL']>;
     addons: Array<InsuranceAddon>;
+    description: Scalars['String'];
     items: Array<InsuranceItem>;
     legality?: Maybe<InsuranceLegality>;
+    logotype?: Maybe<Scalars['URL']>;
+    name: Scalars['String'];
+    price: Scalars['Float'];
     terms?: Maybe<Scalars['URL']>;
+    unit: Scalars['String'];
     url?: Maybe<Scalars['URL']>;
 };
 export declare type InsuranceAddon = {
     __typename?: 'InsuranceAddon';
-    id: Scalars['ID'];
-    title?: Maybe<Scalars['String']>;
     description?: Maybe<Scalars['String']>;
+    exclusions: Array<Scalars['String']>;
+    id: Scalars['ID'];
     price: Scalars['Float'];
+    title?: Maybe<Scalars['String']>;
     unit: Scalars['String'];
-    exclusions: Array<Scalars['String']>;
 };
 export declare type InsuranceItem = {
     __typename?: 'InsuranceItem';
-    name?: Maybe<Scalars['String']>;
     description?: Maybe<Scalars['String']>;
+    name?: Maybe<Scalars['String']>;
 };
 export declare type InsuranceLegality = {
     __typename?: 'InsuranceLegality';
@@ -155,8 +161,16 @@ export declare type InsuranceLegality = {
 export declare type InsuranceOption = {
     __typename?: 'InsuranceOption';
     description?: Maybe<Scalars['String']>;
+    identifier?: Maybe<Scalars['String']>;
+    institute?: Maybe<Scalars['String']>;
+    insuranceHeader?: Maybe<Scalars['String']>;
+    insuranceText?: Maybe<Scalars['String']>;
     logotype?: Maybe<Scalars['URL']>;
+    longDescription?: Maybe<Scalars['String']>;
     name?: Maybe<Scalars['String']>;
+    requiresDistance?: Maybe<Scalars['Boolean']>;
+    requiresPersonalNumber?: Maybe<Scalars['Boolean']>;
+    /** @deprecated No longer supported */
     terms?: Maybe<Scalars['URL']>;
     url?: Maybe<Scalars['URL']>;
 };
@@ -169,9 +183,9 @@ export declare type Location = {
     __typename?: 'Location';
     city?: Maybe<Scalars['String']>;
     county?: Maybe<Scalars['String']>;
-    streetAddress?: Maybe<Scalars['String']>;
-    postalCode?: Maybe<Scalars['String']>;
     position?: Maybe<Position>;
+    postalCode?: Maybe<Scalars['String']>;
+    streetAddress?: Maybe<Scalars['String']>;
 };
 export declare type Manufacturer = {
     __typename?: 'Manufacturer';
@@ -182,8 +196,8 @@ export declare type Manufacturer = {
 };
 export declare type Media = {
     __typename?: 'Media';
-    type: Scalars['String'];
     files: Array<MediaFile>;
+    type: Scalars['String'];
 };
 export declare type MediaFile = {
     __typename?: 'MediaFile';
@@ -197,17 +211,24 @@ export declare type MediaFileFormat = {
 };
 export declare type OpeningHours = {
     __typename?: 'OpeningHours';
-    monday?: Maybe<HoursOpen>;
-    tuesday?: Maybe<HoursOpen>;
-    wednesday?: Maybe<HoursOpen>;
-    thursday?: Maybe<HoursOpen>;
     friday?: Maybe<HoursOpen>;
+    monday?: Maybe<HoursOpen>;
     saturday?: Maybe<HoursOpen>;
     sunday?: Maybe<HoursOpen>;
+    thursday?: Maybe<HoursOpen>;
+    tuesday?: Maybe<HoursOpen>;
+    wednesday?: Maybe<HoursOpen>;
 };
 export declare type Organization = {
     __typename?: 'Organization';
     branches: Array<Maybe<Branch>>;
+    contact?: Maybe<ContactOptions>;
+    description?: Maybe<Scalars['String']>;
+    flags?: Maybe<BranchFlags>;
+    homepage?: Maybe<Scalars['URL']>;
+    id: Scalars['ID'];
+    logotype?: Maybe<Scalars['URL']>;
+    name?: Maybe<Scalars['String']>;
     parent?: Maybe<Branch>;
 };
 export declare type PackageOption = {
@@ -231,35 +252,37 @@ export declare type Promo = {
 };
 export declare type Query = {
     __typename?: 'Query';
-    vehicle?: Maybe<Vehicle>;
     branch?: Maybe<Branch>;
-    loan?: Maybe<FinancialOption>;
     insurances: Array<Insurance>;
+    loan?: Maybe<FinancialOption>;
+    vehicle?: Maybe<Vehicle>;
 };
-export declare type QueryVehicleArgs = {
+export declare type QueryBranchArgs = {
     id: Scalars['ID'];
-    branch?: Maybe<Scalars['ID']>;
 };
-export declare type QueryBranchArgs = {
+export declare type QueryInsurancesArgs = {
+    branch?: InputMaybe<Scalars['ID']>;
+    drivingDistance: DrivingDistance;
     id: Scalars['ID'];
+    personalNumber: Scalars['PersonalNumber'];
 };
 export declare type QueryLoanArgs = {
-    id: Scalars['ID'];
-    duration: Scalars['Int'];
+    branch?: InputMaybe<Scalars['ID']>;
     downPayment: Scalars['Int'];
+    duration: Scalars['Int'];
+    id: Scalars['ID'];
     residual: Scalars['Float'];
 };
-export declare type QueryInsurancesArgs = {
+export declare type QueryVehicleArgs = {
+    branch?: InputMaybe<Scalars['ID']>;
     id: Scalars['ID'];
-    personalNumber: Scalars['PersonalNumber'];
-    drivingDistance: DrivingDistance;
 };
 export declare type SafetyOption = {
     __typename?: 'SafetyOption';
     content?: Maybe<Scalars['String']>;
+    image?: Maybe<Scalars['URL']>;
     name?: Maybe<Scalars['String']>;
     title?: Maybe<Scalars['String']>;
-    image?: Maybe<Scalars['URL']>;
 };
 export declare type Service = {
     __typename?: 'Service';
@@ -268,22 +291,23 @@ export declare type Service = {
 };
 export declare type Vehicle = {
     __typename?: 'Vehicle';
-    id: Scalars['ID'];
     branch?: Maybe<Branch>;
     contact?: Maybe<ContactOptions>;
     data: VehicleData;
     description?: Maybe<Scalars['String']>;
     discount?: Maybe<Scalars['Float']>;
+    documents: Array<Scalars['FileDocument']>;
     ecommerce?: Maybe<Ecommerce>;
     financialOptions: Array<FinancialOption>;
     flags?: Maybe<VehicleFlags>;
+    id: Scalars['ID'];
     insuranceOptions: Array<InsuranceOption>;
-    publishedAt?: Maybe<Scalars['DateTime']>;
+    location?: Maybe<Location>;
     manufacturer?: Maybe<Manufacturer>;
     media: Array<Media>;
-    location?: Maybe<Location>;
     packageOptions: Array<PackageOption>;
     price: Scalars['Float'];
+    publishedAt?: Maybe<Scalars['DateTime']>;
     safety: Array<SafetyOption>;
     shortDescription?: Maybe<Scalars['String']>;
     title: Scalars['String'];
@@ -309,8 +333,8 @@ export declare type VehicleData = {
     vin?: Maybe<Scalars['String']>;
 };
 export declare type VehicleDataPropertySetArgs = {
-    properties?: Maybe<Array<Scalars['String']>>;
-    category?: Maybe<Scalars['String']>;
+    category?: InputMaybe<Scalars['String']>;
+    properties?: InputMaybe<Array<Scalars['String']>>;
 };
 export declare type VehicleFlags = {
     __typename?: 'VehicleFlags';

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { InsuranceOption, Branch } from '../../@types/codegen/types';
+interface InsuranceOptions {
+    id: string;
+    branch?: Branch | null;
+    insuranceOptions: InsuranceOption[];
+}
+declare const Insurance: ({ id, branch, insuranceOptions }: InsuranceOptions) => JSX.Element | null;
+export default Insurance;

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { InsuranceOption } from '../../@types/codegen/types';
+interface InsuranceOptions {
+    insuranceOptions: InsuranceOption[];
+}
+declare const Insurance: ({ insuranceOptions }: InsuranceOptions) => JSX.Element | null;
+export default Insurance;