@drivy/cobalt 0.48.0 → 0.49.1

package/styles/core/{theme.scss → theme.css}

@@ -41,7 +41,7 @@
   --c-background-errorInteractive: var(--c-red-500);
   --c-background-errorInteractive--hover: var(--c-red-700);
   --c-text-base: var(--c-navy-700);
-  --c-text-subdued: var(--c-navy-400);
+  --c-text-subdued: var(--c-navy-300);
   --c-text-accent: var(--c-purple-500);
   --c-text-accentAlt: var(--c-purple-700);
   --c-text-info: var(--c-yellow-900);
@@ -76,14 +76,14 @@
   --c-text-inversed: var(--c-white);
   --c-text-baseInteractive: var(--c-navy-700);
   --c-text-baseInteractive--hover: var(--c-navy-900);
-  --c-text-subduedInteractive: var(--c-navy-400);
+  --c-text-subduedInteractive: var(--c-navy-300);
   --c-text-subduedInteractive--hover: var(--c-navy-500);
   --c-text-accentInteractive: var(--c-purple-500);
   --c-text-accentInteractive--hover: var(--c-purple-700);
   --c-text-accentAltInteractive: var(--c-purple-700);
   --c-text-accentAltInteractive--hover: var(--c-purple-700);
   --c-icon-base: var(--c-navy-700);
-  --c-icon-subdued: var(--c-navy-400);
+  --c-icon-subdued: var(--c-navy-300);
   --c-icon-accent: var(--c-purple-500);
   --c-icon-accentAlt: var(--c-purple-700);
   --c-icon-info: var(--c-yellow-900);
@@ -114,7 +114,7 @@
   --c-icon-inversed: var(--c-white);
   --c-icon-baseInteractive: var(--c-navy-700);
   --c-icon-baseInteractive--hover: var(--c-navy-900);
-  --c-icon-subduedInteractive: var(--c-navy-400);
+  --c-icon-subduedInteractive: var(--c-navy-300);
   --c-icon-subduedInteractive--hover: var(--c-navy-500);
   --c-icon-accentInteractive: var(--c-purple-500);
   --c-icon-accentInteractive--hover: var(--c-purple-700);

package/tokens/icons.js

@@ -62,6 +62,7 @@ const icons = {
 	chevronLeft: "chevron-left.svg",
 	chevronRight: "chevron-right.svg",
 	chevronUp: "chevron-up.svg",
+	circledArrowLeft: "circled-arrow-left.svg",
 	circledArrowRight: "circled-arrow-right.svg",
 	city: "city.svg",
 	cleaning: "cleaning.svg",
@@ -111,6 +112,8 @@ const icons = {
 	facebook: "facebook.svg",
 	family: "family.svg",
 	fileFilled: "file-filled.svg",
+	filepdf: "filepdf.svg",
+	filexls: "filexls.svg",
 	filter: "filter.svg",
 	filters: "filters.svg",
 	flag: "flag.svg",

package/tokens/icons.js.map

@@ -1 +1 @@
-{"version":3,"file":"icons.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"icons.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/tokens/theme.js

@@ -49,7 +49,7 @@ const background = {
 };
 const text = {
 	base: "navy.700/grey.100",
-	subdued: "navy.400/grey.300",
+	subdued: "navy.300/grey.300",
 	accent: "purple.500/purple.400",
 	accentAlt: "purple.700/purple.200",
 	info: "yellow.900/yellow.400",
@@ -87,7 +87,7 @@ const text = {
 		hover: "navy.900/grey.300"
 	},
 	subduedInteractive: {
-		DEFAULT: "navy.400/grey.300",
+		DEFAULT: "navy.300/grey.300",
 		hover: "navy.500/grey.400"
 	},
 	accentInteractive: {
@@ -101,7 +101,7 @@ const text = {
 };
 const icon = {
 	base: "navy.700/grey.100",
-	subdued: "navy.400/grey.300",
+	subdued: "navy.300/grey.300",
 	accent: "purple.500/purple.400",
 	accentAlt: "purple.700/purple.200",
 	info: "yellow.900/yellow.400",
@@ -135,7 +135,7 @@ const icon = {
 		hover: "navy.900/grey.200"
 	},
 	subduedInteractive: {
-		DEFAULT: "navy.400/grey.300",
+		DEFAULT: "navy.300/grey.300",
 		hover: "navy.500/grey.400"
 	},
 	accentInteractive: {

package/types/src/components/Accordion/ToggleIcon.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
 type ToggleIconPropsType = {
     isOpen: boolean;
+    useChevron: boolean;
 };
-declare const ToggleIcon: ({ isOpen }: ToggleIconPropsType) => React.JSX.Element;
+declare const ToggleIcon: ({ isOpen, useChevron }: ToggleIconPropsType) => React.JSX.Element;
 export default ToggleIcon;

package/types/src/components/Accordion/index.d.ts

@@ -19,6 +19,7 @@ export type AccordionItemHeaderPropsType = {
     headingLevel?: HeadingLevelMapType[HeadingTag];
     className?: string;
     leftToggleIcon?: boolean;
+    useChevron?: boolean;
 } & ReachAccordionButtonProps;
 export type AccordionItemPanelPropsType = {
     className?: string;
@@ -44,6 +45,7 @@ export declare const AccordionItemHeader: React.ForwardRefExoticComponent<{
     headingLevel?: 2 | 3 | 4 | 5 | 6 | undefined;
     className?: string | undefined;
     leftToggleIcon?: boolean | undefined;
+    useChevron?: boolean | undefined;
 } & ReachAccordionButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export declare const AccordionItemPanel: {
     ({ children, className, ...props }: AccordionItemPanelPropsType): React.JSX.Element;
@@ -62,6 +64,7 @@ export declare const AccordionItem: {
         headingLevel?: 2 | 3 | 4 | 5 | 6 | undefined;
         className?: string | undefined;
         leftToggleIcon?: boolean | undefined;
+        useChevron?: boolean | undefined;
     } & ReachAccordionButtonProps & React.RefAttributes<HTMLButtonElement>>;
     Panel: {
         ({ children, className, ...props }: AccordionItemPanelPropsType): React.JSX.Element;
@@ -83,6 +86,7 @@ declare const Accordion: {
             headingLevel?: 2 | 3 | 4 | 5 | 6 | undefined;
             className?: string | undefined;
             leftToggleIcon?: boolean | undefined;
+            useChevron?: boolean | undefined;
         } & ReachAccordionButtonProps & React.RefAttributes<HTMLButtonElement>>;
         Panel: {
             ({ children, className, ...props }: AccordionItemPanelPropsType): React.JSX.Element;

package/types/src/components/Form/Autocomplete/index.d.ts

@@ -23,7 +23,7 @@ type Props = {
     renderItem?: (item: AutocompleteItem, term: string) => React.ReactNode;
 } & FormElement & React.InputHTMLAttributes<HTMLInputElement>;
 declare const wrappedComponent: React.ComponentClass<{
-    icon?: "map" | "search" | "video" | "filter" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "sedan" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
+    icon?: "map" | "search" | "video" | "filter" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "sedan" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
     items: (AutocompleteItem | string)[];
     minQueryLength?: number | undefined;
     autoFilter?: boolean | undefined;

package/types/src/components/Form/TextInput.d.ts

@@ -14,7 +14,7 @@ export declare const TextInputWrapper: ({ icon, status, render, }: {
 }) => React.JSX.Element;
 declare const wrappedComponent: React.ComponentClass<{
     type?: TextInputType | undefined;
-    icon?: "search" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "sedan" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
+    icon?: "search" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "sedan" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
     forwardedRef?: React.Ref<HTMLInputElement> | undefined;
 } & FormElement & React.InputHTMLAttributes<HTMLInputElement> & {
     id?: string | undefined;

package/types/src/components/Icon/__generated__/CircledArrowLeftIcon.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { IconColorsType } from "../";
+export type IconProps = {
+    color?: IconColorsType;
+    size?: 16 | 20 | 24 | 32;
+    contained?: boolean;
+    className?: string;
+};
+declare const CircledArrowLeftIcon: ({ color, size, contained, className, }: IconProps) => React.JSX.Element;
+export default CircledArrowLeftIcon;

package/types/src/components/Icon/__generated__/FilepdfIcon.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { IconColorsType } from "../";
+export type IconProps = {
+    color?: IconColorsType;
+    size?: 16 | 20 | 24 | 32;
+    contained?: boolean;
+    className?: string;
+};
+declare const FilepdfIcon: ({ color, size, contained, className, }: IconProps) => React.JSX.Element;
+export default FilepdfIcon;

package/types/src/components/Icon/__generated__/FilexlsIcon.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { IconColorsType } from "../";
+export type IconProps = {
+    color?: IconColorsType;
+    size?: 16 | 20 | 24 | 32;
+    contained?: boolean;
+    className?: string;
+};
+declare const FilexlsIcon: ({ color, size, contained, className, }: IconProps) => React.JSX.Element;
+export default FilexlsIcon;

package/types/src/components/Icon/__generated__/index.d.ts

@@ -61,6 +61,7 @@ export { default as ChevronDownIcon } from "./ChevronDownIcon";
 export { default as ChevronLeftIcon } from "./ChevronLeftIcon";
 export { default as ChevronRightIcon } from "./ChevronRightIcon";
 export { default as ChevronUpIcon } from "./ChevronUpIcon";
+export { default as CircledArrowLeftIcon } from "./CircledArrowLeftIcon";
 export { default as CircledArrowRightIcon } from "./CircledArrowRightIcon";
 export { default as CityIcon } from "./CityIcon";
 export { default as CleaningIcon } from "./CleaningIcon";
@@ -110,6 +111,8 @@ export { default as FaceRecognitionIcon } from "./FaceRecognitionIcon";
 export { default as FacebookIcon } from "./FacebookIcon";
 export { default as FamilyIcon } from "./FamilyIcon";
 export { default as FileFilledIcon } from "./FileFilledIcon";
+export { default as FilepdfIcon } from "./FilepdfIcon";
+export { default as FilexlsIcon } from "./FilexlsIcon";
 export { default as FilterIcon } from "./FilterIcon";
 export { default as FiltersIcon } from "./FiltersIcon";
 export { default as FlagIcon } from "./FlagIcon";

package/types/src/components/Icon/index.d.ts

@@ -22,7 +22,7 @@ export interface IconProps {
     contained?: boolean;
     className?: string;
 }
-export declare const isIconSource: (source: string) => source is "info" | "warning" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "sedan" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang";
+export declare const isIconSource: (source: string) => source is "info" | "warning" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "sedan" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang";
 export declare const Icon: ({ source, color, size, contained, className, }: IconProps) => React.JSX.Element;
 export * from "./__generated__/index";
 export default Icon;

package/types/src/components/Layout/Components/LayoutCard.d.ts

@@ -1,8 +1,9 @@
 import React from "react";
 declare const LayoutCard: {
-    ({ children, isPageHeader, }: {
+    ({ children, isPageHeader, className, }: {
         children: React.ReactNode;
         isPageHeader?: boolean;
+        className?: string;
     }): React.JSX.Element;
     Item: ({ children }: {
         children: React.ReactNode;

package/types/src/components/Layout/Components/LayoutSection.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
-declare const LayoutSection: ({ children, isPageHeader, }: {
+declare const LayoutSection: ({ children, isPageHeader, className, }: {
     children: React.ReactNode;
     isPageHeader?: boolean;
+    className?: string;
 }) => React.JSX.Element;
 export default LayoutSection;

package/types/src/components/Layout/Surfaces/index.d.ts

@@ -5,21 +5,24 @@ export type ResponsiveProp<T> = {
 };
 type DirectionProp = "row" | "column" | "row-reverse" | "column-reverse";
 type ResponsiveDirection = ResponsiveProp<DirectionProp>;
-export declare const Flexible: ({ children, direction, bottomPadding, }: {
+export declare const Flexible: ({ children, direction, bottomPadding, isFullHeight, }: {
     children?: ReactNode;
     direction?: ResponsiveDirection | DirectionProp;
     bottomPadding?: boolean;
+    isFullHeight?: boolean;
 }) => React.JSX.Element;
-export declare const FlexibleWithConstraint: ({ children, size, direction, bottomPadding, }: {
+export declare const FlexibleWithConstraint: ({ children, size, direction, bottomPadding, isFullHeight, }: {
     children?: ReactNode;
     size: "small" | "medium" | "large";
     direction?: ResponsiveDirection | DirectionProp;
     bottomPadding?: boolean;
+    isFullHeight?: boolean;
 }) => React.JSX.Element;
-export declare const Fixed: ({ children, width, direction, bottomPadding, }: {
+export declare const Fixed: ({ children, width, direction, bottomPadding, isFullHeight, }: {
     children?: ReactNode;
     width: 280 | 420 | 600;
     direction?: ResponsiveDirection | DirectionProp;
     bottomPadding?: boolean;
+    isFullHeight?: boolean;
 }) => React.JSX.Element;
 export {};

package/types/src/components/Pagination/index.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+declare const Pagination: ({ onPageChange, currentPage, totalPages, }: {
+    currentPage: number;
+    totalPages: number;
+    onPageChange: (page: number) => void;
+}) => React.JSX.Element | null;
+export default Pagination;

package/types/src/components/Sidepanel/index.d.ts

@@ -1,4 +1,5 @@
-import React from "react";
+import React, { ComponentProps } from "react";
+import { Fixed } from "../Layout/Surfaces";
 type SidepanelFooterPropsType = React.PropsWithChildren<{
     className?: string;
 }>;
@@ -6,10 +7,11 @@ type SidepanelPropsType = React.PropsWithChildren<{
     isOpen: boolean;
     title?: string;
     close?: () => void;
+    width?: ComponentProps<typeof Fixed>["width"];
     withDesktopOverlay?: boolean;
 }>;
 export declare const Sidepanel: {
-    ({ isOpen, title, close, withDesktopOverlay, children, }: SidepanelPropsType): React.JSX.Element;
+    ({ isOpen, title, close, withDesktopOverlay, width, children, }: SidepanelPropsType): React.JSX.Element;
     displayName: string;
 } & {
     Footer: (_props: SidepanelFooterPropsType) => null;

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

@@ -61,6 +61,7 @@ export { default as chevronDown } from "./chevron-down.svg";
 export { default as chevronLeft } from "./chevron-left.svg";
 export { default as chevronRight } from "./chevron-right.svg";
 export { default as chevronUp } from "./chevron-up.svg";
+export { default as circledArrowLeft } from "./circled-arrow-left.svg";
 export { default as circledArrowRight } from "./circled-arrow-right.svg";
 export { default as city } from "./city.svg";
 export { default as cleaning } from "./cleaning.svg";
@@ -110,6 +111,8 @@ export { default as faceRecognition } from "./face-recognition.svg";
 export { default as facebook } from "./facebook.svg";
 export { default as family } from "./family.svg";
 export { default as fileFilled } from "./file-filled.svg";
+export { default as filepdf } from "./filepdf.svg";
+export { default as filexls } from "./filexls.svg";
 export { default as filter } from "./filter.svg";
 export { default as filters } from "./filters.svg";
 export { default as flag } from "./flag.svg";

package/types/src/index.d.ts

@@ -20,6 +20,7 @@ export { ContainedIcon } from "./components/ContainedIcon";
 export { default as Modal } from "./components/Modal";
 export { Note } from "./components/Note";
 export { default as PhotoDropzone } from "./components/PhotoDropzone";
+export { default as Pagination } from "./components/Pagination";
 export { Pill, PillGroup } from "./components/Pill";
 export { PlateNumber } from "./components/PlateNumber";
 export { PriceTable, PriceTableRow } from "./components/PriceTable";

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

@@ -120,6 +120,7 @@ export declare const icons: {
         chevronLeft: string;
         chevronRight: string;
         chevronUp: string;
+        circledArrowLeft: string;
         circledArrowRight: string;
         city: string;
         cleaning: string;
@@ -169,6 +170,8 @@ export declare const icons: {
         facebook: string;
         family: string;
         fileFilled: string;
+        filepdf: string;
+        filexls: string;
         filter: string;
         filters: string;
         flag: string;