@qite/tide-components 1.0.10 → 1.0.12

package/build/build-esm/src/booking-wizard/features/booking/selectors.d.ts

@@ -17,6 +17,7 @@ export declare const selectPackageOptionUnits: (state: RootState) => import("@qi
 export declare const selectPackageOptionPax: (state: RootState) => import("@qite/tide-client").BookingOptionPax[] | undefined;
 export declare const selectPackageGroups: (state: RootState) => import("@qite/tide-client").BookingOptionGroup<import("@qite/tide-client").PerBookingPackageOption>[] | undefined;
 export declare const selectPackageDetails: (state: RootState) => import("@qite/tide-client").BookingPackage | undefined;
+export declare const selectPaxCustomFields: (state: RootState) => import("@qite/tide-client").BookingPackagePaxCustomField[];
 export declare const selectPackageFlights: (state: RootState) => {
     outward: import("@qite/tide-client").BookingPackageFlight[] | undefined;
     return: import("@qite/tide-client").BookingPackageFlight[] | undefined;

package/build/build-esm/src/booking-wizard/features/travelers-form/validate-form.d.ts

@@ -1,4 +1,5 @@
 import { FormikErrors } from 'formik';
+import { BookingPackagePaxCustomField } from '@qite/tide-client/build/types';
 import { FormField, TravelersFormValues } from '../../types';
-declare const validateForm: (values: TravelersFormValues, agentRequired?: boolean, bookingType?: string, translations?: any, formFields?: FormField[], mainBookerFormFields?: FormField[], maxChildAge?: number, maxBabyAge?: number) => FormikErrors<TravelersFormValues>;
+declare const validateForm: (values: TravelersFormValues, agentRequired?: boolean, bookingType?: string, translations?: any, formFields?: FormField[], mainBookerFormFields?: FormField[], maxChildAge?: number, maxBabyAge?: number, paxCustomFields?: BookingPackagePaxCustomField[]) => FormikErrors<TravelersFormValues>;
 export default validateForm;

package/build/build-esm/src/booking-wizard/types.d.ts

@@ -1,4 +1,4 @@
-import { BookingPackageFlight } from '@qite/tide-client/build/types';
+import { BookingPackageCustomField, BookingPackageFlight } from '@qite/tide-client/build/types';
 export interface Settings {
     officeId: number;
     token?: string;
@@ -27,6 +27,8 @@ export interface Settings {
         countries?: Country[];
         travelersFirstStep?: boolean;
         showAllCountries?: boolean;
+        showWeightField?: boolean;
+        showHeightField?: boolean;
     };
     summary: {
         pathSuffix: string;
@@ -148,6 +150,11 @@ export interface Traveler {
      * form and its validation can treat the traveler as a baby instead of a child.
      */
     isBaby?: boolean;
+    weight?: number | null;
+    weightType?: number;
+    height?: number | null;
+    heightType?: number;
+    customFields?: BookingPackageCustomField[];
 }
 export interface Room {
     adults: number;

package/build/build-esm/src/shared/booking/travelers-form.d.ts

@@ -1,7 +1,7 @@
 import React, { ReactNode } from 'react';
 import { FormikProps } from 'formik';
 import { Country, RoomTraveler, Traveler, TravelersFormValues } from '../../booking-wizard/types';
-import { CountryItem, PackagingEntry, PackagingEntryPax } from '@qite/tide-client';
+import { BookingPackageCustomField, BookingPackagePaxCustomField, CountryItem, PackagingEntry, PackagingEntryPax } from '@qite/tide-client';
 export type TravelersFormField = {
     type: string;
 };
@@ -33,6 +33,9 @@ export interface SharedTravelersFormProps {
     isUnavailable?: boolean;
     useCompactForm?: boolean;
     showAllCountries?: boolean;
+    showWeightField?: boolean;
+    showHeightField?: boolean;
+    paxCustomFields?: BookingPackagePaxCustomField[];
     showAgentSelection?: boolean;
     initialShowAgents?: boolean;
     renderPreviousButton?: () => ReactNode;
@@ -40,13 +43,15 @@ export interface SharedTravelersFormProps {
 }
 export declare function isBabyAge(age?: number | null, maxBabyAge?: number): boolean;
 export declare function formatBirthDate(birthDate?: string): string;
+export declare function buildEmptyCustomFields(paxCustomFields?: BookingPackagePaxCustomField[]): BookingPackageCustomField[];
+export declare function getApplicablePaxCustomFields(paxCustomFields: BookingPackagePaxCustomField[] | undefined, isMainBooker: boolean): BookingPackagePaxCustomField[];
 export declare function createTraveler(traveler: RoomTraveler, followNumber: {
     number: number;
-}, personTranslation?: string, isCompact?: boolean, maxBabyAge?: number): Traveler;
+}, personTranslation?: string, isCompact?: boolean, maxBabyAge?: number, paxCustomFields?: BookingPackagePaxCustomField[]): Traveler;
 export declare function createInitialValuesFromRooms(formRooms: {
     adults: RoomTraveler[];
     children: RoomTraveler[];
-}[], startDate?: string, endDate?: string, agentAdressId?: number, personTranslation?: string, isCompact?: boolean, maxBabyAge?: number): TravelersFormValues;
+}[], startDate?: string, endDate?: string, agentAdressId?: number, personTranslation?: string, isCompact?: boolean, maxBabyAge?: number, paxCustomFields?: BookingPackagePaxCustomField[]): TravelersFormValues;
 export declare function createInitialValuesFromEditablePackagingEntry(editablePackagingEntry: PackagingEntry, agentAdressId?: number): TravelersFormValues;
 export declare function applyTravelersFormValuesToEditablePackagingEntry(editablePackagingEntry: PackagingEntry, values: TravelersFormValues): {
     pax: PackagingEntryPax[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qite/tide-components",
-  "version": "1.0.10",
+  "version": "1.0.12",
   "description": "React components for Tide (booking, product availability, form, ...)",
   "main": "build/build-cjs/index.js",
   "types": "build/build-cjs/src/index.d.ts",
@@ -36,7 +36,7 @@
   "devDependencies": {
     "@jsonurl/jsonurl": "^1.1.4",
     "@popperjs/core": "^2.10.2",
-    "@qite/tide-client": "^2.0.18",
+    "@qite/tide-client": "^2.0.19",
     "@reduxjs/toolkit": "^2.8.2",
     "@rollup/plugin-commonjs": "^19.0.1",
     "@rollup/plugin-json": "^4.1.0",

package/styles/abstracts/_mixins.scss

@@ -1,74 +1,74 @@
-@use '../abstracts/variables' as variables;
-// MEDIA QUERIES
-@mixin media-xs {
-  @media only screen and (max-width: variables.$screen-xs) {
-    @content;
-  }
-}
-
-@mixin media-sm {
-  @media only screen and (max-width: variables.$screen-sm) {
-    @content;
-  }
-}
-
-@mixin media-md {
-  @media only screen and (max-width: variables.$screen-md) {
-    @content;
-  }
-}
-
-@mixin media-lg {
-  @media only screen and (max-width: variables.$screen-lg) {
-    @content;
-  }
-}
-
-@mixin media-xgl {
-  @media only screen and (max-width: variables.$screen-xgl) {
-    @content;
-  }
-}
-
-@mixin media-xl {
-  @media only screen and (max-width: variables.$screen-xl) {
-    @content;
-  }
-}
-
-@mixin media-xxl {
-  @media only screen and (max-width: variables.$screen-xxl) {
-    @content;
-  }
-}
-
-@mixin media-xxxl {
-  @media only screen and (max-width: variables.$screen-xxl) {
-    @content;
-  }
-}
-
-@mixin make-container($padding-x: $container-padding-x) {
-  width: 100%;
-  max-width: 1496px;
-  margin-right: auto;
-  margin-left: auto;
-
-  @include media-xl {
-    padding: 0 $padding-x;
-  }
-}
-
-@mixin container() {
-  width: 100%;
-  padding: 0 15px;
-  margin: 0 auto;
-
-  @include media-sm {
-    padding: 0 30px;
-  }
-
-  @include media-lg {
-    padding: 0 45px;
-  }
-}
+@use '../abstracts/variables' as variables;
+// MEDIA QUERIES
+@mixin media-xs {
+  @media only screen and (max-width: variables.$screen-xs) {
+    @content;
+  }
+}
+
+@mixin media-sm {
+  @media only screen and (max-width: variables.$screen-sm) {
+    @content;
+  }
+}
+
+@mixin media-md {
+  @media only screen and (max-width: variables.$screen-md) {
+    @content;
+  }
+}
+
+@mixin media-lg {
+  @media only screen and (max-width: variables.$screen-lg) {
+    @content;
+  }
+}
+
+@mixin media-xgl {
+  @media only screen and (max-width: variables.$screen-xgl) {
+    @content;
+  }
+}
+
+@mixin media-xl {
+  @media only screen and (max-width: variables.$screen-xl) {
+    @content;
+  }
+}
+
+@mixin media-xxl {
+  @media only screen and (max-width: variables.$screen-xxl) {
+    @content;
+  }
+}
+
+@mixin media-xxxl {
+  @media only screen and (max-width: variables.$screen-xxl) {
+    @content;
+  }
+}
+
+@mixin make-container($padding-x: $container-padding-x) {
+  width: 100%;
+  max-width: 1496px;
+  margin-right: auto;
+  margin-left: auto;
+
+  @include media-xl {
+    padding: 0 $padding-x;
+  }
+}
+
+@mixin container() {
+  width: 100%;
+  padding: 0 15px;
+  margin: 0 auto;
+
+  @include media-sm {
+    padding: 0 30px;
+  }
+
+  @include media-lg {
+    padding: 0 45px;
+  }
+}

package/styles/abstracts/_variables.scss

@@ -1,57 +1,57 @@
-// COLORS
-$primary-color: #25575c;
-$primary-color--light: #32686d;
-$secondary-color: #57abb2;
-$secondary-color--light: #abd5d9;
-$secondary-color--extralight: #e3f1f2;
-
-$bg-light: #f4f9fa;
-$text-color: #707070;
-$text-color-black: #202124;
-
-$white: #ffffff;
-$gray: #c6c6c6;
-$black: #000000;
-$transparent: transparent;
-
-// BUTTON COLORS XD
-$purple-color--light: #dfcce8;
-$purple-color--dark: #794e8c;
-
-$yellow-color--light: #fff9de;
-$yellow-color--dark: #b7990c;
-
-$pink-color: #d81259;
-
-$blue-color: #0e3e8d;
-
-$yellow-color: #ffde40;
-
-// MEDIA QUERIES
-$screen-xs: 576px;
-$screen-sm: 768px;
-$screen-md: 992px;
-$screen-lg: 1200px;
-$screen-xl: 1440px;
-$screen-xxl: 1700px;
-$screen-xxxl: 1920px;
-
-// Typography
-$font-family-base: 'Public Sans', Arial, sans-serif;
-$font-family-heading: 'Alfa Slab One', Arial, sans-serif;
-$font-size-base: 16px;
-$font-size-h1: 3.0625rem;
-$font-size-h2: 2.5625rem;
-$font-size-h3: 2.125rem;
-$font-size-h4: 1.75rem;
-$font-size-h5: 1.4375rem;
-$font-size-h6: 1.1875rem;
-$font-size-body: 1rem;
-$font-size-body--small: 0.875rem;
-$font-size-label: 0.75rem;
-
-$line-height-base: 1.5;
-$line-height-heading: 1.2;
-
-$font-weight-normal: 400;
-$font-weight-bold: 700;
+// COLORS
+$primary-color: #25575c;
+$primary-color--light: #32686d;
+$secondary-color: #57abb2;
+$secondary-color--light: #abd5d9;
+$secondary-color--extralight: #e3f1f2;
+
+$bg-light: #f4f9fa;
+$text-color: #707070;
+$text-color-black: #202124;
+
+$white: #ffffff;
+$gray: #c6c6c6;
+$black: #000000;
+$transparent: transparent;
+
+// BUTTON COLORS XD
+$purple-color--light: #dfcce8;
+$purple-color--dark: #794e8c;
+
+$yellow-color--light: #fff9de;
+$yellow-color--dark: #b7990c;
+
+$pink-color: #d81259;
+
+$blue-color: #0e3e8d;
+
+$yellow-color: #ffde40;
+
+// MEDIA QUERIES
+$screen-xs: 576px;
+$screen-sm: 768px;
+$screen-md: 992px;
+$screen-lg: 1200px;
+$screen-xl: 1440px;
+$screen-xxl: 1700px;
+$screen-xxxl: 1920px;
+
+// Typography
+$font-family-base: 'Public Sans', Arial, sans-serif;
+$font-family-heading: 'Alfa Slab One', Arial, sans-serif;
+$font-size-base: 16px;
+$font-size-h1: 3.0625rem;
+$font-size-h2: 2.5625rem;
+$font-size-h3: 2.125rem;
+$font-size-h4: 1.75rem;
+$font-size-h5: 1.4375rem;
+$font-size-h6: 1.1875rem;
+$font-size-body: 1rem;
+$font-size-body--small: 0.875rem;
+$font-size-label: 0.75rem;
+
+$line-height-base: 1.5;
+$line-height-heading: 1.2;
+
+$font-weight-normal: 400;
+$font-weight-bold: 700;

package/styles/base/_fonts.scss

@@ -1,2 +1,2 @@
-// @import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');
-// @import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');
+// @import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');
+// @import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');