@qite/tide-booking-component 1.2.3 → 1.2.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (137) hide show
  1. package/.vs/ProjectSettings.json +3 -3
  2. package/.vs/VSWorkspaceState.json +5 -5
  3. package/README.md +8 -8
  4. package/build/build-cjs/booking-product/components/footer.d.ts +1 -0
  5. package/build/build-cjs/booking-product/components/rooms.d.ts +2 -0
  6. package/build/build-cjs/booking-wizard/features/booking/selectors.d.ts +1 -1
  7. package/build/build-cjs/booking-wizard/features/flight-options/flight-option-flight.d.ts +1 -1
  8. package/build/build-cjs/booking-wizard/features/flight-options/flight-option.d.ts +1 -1
  9. package/build/build-cjs/booking-wizard/types.d.ts +5 -0
  10. package/build/build-cjs/index.js +1453 -735
  11. package/build/build-cjs/shared/utils/localization-util.d.ts +4 -0
  12. package/build/build-esm/booking-product/components/footer.d.ts +1 -0
  13. package/build/build-esm/booking-product/components/rooms.d.ts +2 -0
  14. package/build/build-esm/booking-wizard/features/booking/selectors.d.ts +1 -1
  15. package/build/build-esm/booking-wizard/features/flight-options/flight-option-flight.d.ts +1 -1
  16. package/build/build-esm/booking-wizard/features/flight-options/flight-option.d.ts +1 -1
  17. package/build/build-esm/booking-wizard/types.d.ts +5 -0
  18. package/build/build-esm/index.js +1455 -737
  19. package/build/build-esm/shared/utils/localization-util.d.ts +4 -0
  20. package/package.json +75 -77
  21. package/src/booking-product/components/age-select.tsx +35 -41
  22. package/src/booking-product/components/amount-input.tsx +78 -64
  23. package/src/booking-product/components/date-range-picker/calendar-day.tsx +58 -54
  24. package/src/booking-product/components/date-range-picker/calendar.tsx +178 -176
  25. package/src/booking-product/components/date-range-picker/index.tsx +196 -181
  26. package/src/booking-product/components/dates.tsx +136 -132
  27. package/src/booking-product/components/footer.tsx +69 -64
  28. package/src/booking-product/components/header.tsx +79 -68
  29. package/src/booking-product/components/icon.tsx +251 -208
  30. package/src/booking-product/components/product.tsx +314 -277
  31. package/src/booking-product/components/rooms.tsx +195 -177
  32. package/src/booking-product/index.tsx +30 -30
  33. package/src/booking-product/settings-context.ts +14 -14
  34. package/src/booking-product/types.ts +28 -28
  35. package/src/booking-product/utils/api.ts +25 -25
  36. package/src/booking-product/utils/price.ts +29 -27
  37. package/src/booking-wizard/api-settings-slice.ts +24 -24
  38. package/src/booking-wizard/components/icon.tsx +508 -60
  39. package/src/booking-wizard/components/message.tsx +34 -34
  40. package/src/booking-wizard/components/multi-range-filter.tsx +113 -113
  41. package/src/booking-wizard/components/product-card.tsx +37 -37
  42. package/src/booking-wizard/components/step-indicator.tsx +51 -51
  43. package/src/booking-wizard/components/step-route.tsx +27 -27
  44. package/src/booking-wizard/declarations.d.ts +4 -4
  45. package/src/booking-wizard/features/booking/api.ts +49 -45
  46. package/src/booking-wizard/features/booking/booking-self-contained.tsx +384 -357
  47. package/src/booking-wizard/features/booking/booking-slice.ts +662 -603
  48. package/src/booking-wizard/features/booking/booking.tsx +356 -349
  49. package/src/booking-wizard/features/booking/constants.ts +16 -16
  50. package/src/booking-wizard/features/booking/selectors.ts +441 -408
  51. package/src/booking-wizard/features/confirmation/confirmation.tsx +97 -94
  52. package/src/booking-wizard/features/error/error.tsx +78 -75
  53. package/src/booking-wizard/features/flight-options/flight-filter.tsx +432 -344
  54. package/src/booking-wizard/features/flight-options/flight-option-flight.tsx +385 -351
  55. package/src/booking-wizard/features/flight-options/flight-option-modal.tsx +229 -214
  56. package/src/booking-wizard/features/flight-options/flight-option.tsx +81 -66
  57. package/src/booking-wizard/features/flight-options/flight-utils.ts +516 -401
  58. package/src/booking-wizard/features/flight-options/index.tsx +196 -177
  59. package/src/booking-wizard/features/price-details/price-details-api.ts +24 -24
  60. package/src/booking-wizard/features/price-details/price-details-slice.ts +178 -171
  61. package/src/booking-wizard/features/price-details/util.ts +155 -155
  62. package/src/booking-wizard/features/product-options/no-options.tsx +21 -21
  63. package/src/booking-wizard/features/product-options/none-option.tsx +120 -120
  64. package/src/booking-wizard/features/product-options/option-booking-airline-group.tsx +64 -66
  65. package/src/booking-wizard/features/product-options/option-booking-group.tsx +216 -210
  66. package/src/booking-wizard/features/product-options/option-item.tsx +317 -318
  67. package/src/booking-wizard/features/product-options/option-pax-card.tsx +201 -117
  68. package/src/booking-wizard/features/product-options/option-pax-group.tsx +175 -169
  69. package/src/booking-wizard/features/product-options/option-room.tsx +321 -314
  70. package/src/booking-wizard/features/product-options/option-unit-group.tsx +198 -192
  71. package/src/booking-wizard/features/product-options/option-units-card.tsx +185 -102
  72. package/src/booking-wizard/features/product-options/options-form.tsx +459 -437
  73. package/src/booking-wizard/features/room-options/index.tsx +187 -172
  74. package/src/booking-wizard/features/room-options/room-utils.ts +190 -143
  75. package/src/booking-wizard/features/room-options/room.tsx +160 -124
  76. package/src/booking-wizard/features/room-options/traveler-rooms.tsx +75 -63
  77. package/src/booking-wizard/features/sidebar/index.tsx +76 -76
  78. package/src/booking-wizard/features/sidebar/sidebar-flight.tsx +68 -68
  79. package/src/booking-wizard/features/sidebar/sidebar-util.ts +177 -177
  80. package/src/booking-wizard/features/sidebar/sidebar.tsx +364 -346
  81. package/src/booking-wizard/features/summary/summary-booking-option-pax.tsx +25 -25
  82. package/src/booking-wizard/features/summary/summary-booking-option-unit.tsx +25 -25
  83. package/src/booking-wizard/features/summary/summary-flight.tsx +39 -39
  84. package/src/booking-wizard/features/summary/summary-per-booking-option-group.tsx +69 -57
  85. package/src/booking-wizard/features/summary/summary-per-pax-option-group.tsx +63 -51
  86. package/src/booking-wizard/features/summary/summary-per-unit-option-group.tsx +66 -54
  87. package/src/booking-wizard/features/summary/summary-slice.ts +28 -28
  88. package/src/booking-wizard/features/summary/summary.tsx +674 -641
  89. package/src/booking-wizard/features/travelers-form/travelers-form-slice.ts +164 -164
  90. package/src/booking-wizard/features/travelers-form/travelers-form.tsx +754 -755
  91. package/src/booking-wizard/features/travelers-form/type-ahead-input.tsx +101 -101
  92. package/src/booking-wizard/features/travelers-form/validate-form.ts +245 -245
  93. package/src/booking-wizard/index.tsx +36 -36
  94. package/src/booking-wizard/settings-context.ts +60 -60
  95. package/src/booking-wizard/store.ts +31 -31
  96. package/src/booking-wizard/types.ts +276 -271
  97. package/src/index.ts +4 -5
  98. package/src/shared/components/loader.tsx +16 -16
  99. package/src/shared/translations/en-GB.json +232 -0
  100. package/src/shared/translations/fr-BE.json +233 -233
  101. package/src/shared/translations/nl-BE.json +232 -232
  102. package/src/shared/types.ts +4 -4
  103. package/src/shared/utils/localization-util.ts +62 -56
  104. package/src/shared/utils/query-string-util.ts +119 -116
  105. package/src/shared/utils/tide-api-utils.ts +36 -36
  106. package/styles/booking-product-variables.scss +394 -288
  107. package/styles/booking-product.scss +446 -440
  108. package/styles/booking-wizard-variables.scss +871 -0
  109. package/styles/booking-wizard.scss +59 -4
  110. package/styles/components/_animations.scss +39 -39
  111. package/styles/components/_base.scss +107 -106
  112. package/styles/components/_booking.scss +879 -0
  113. package/styles/components/_button.scss +238 -185
  114. package/styles/components/_checkbox.scss +219 -0
  115. package/styles/components/_cta.scss +208 -67
  116. package/styles/components/_date-list.scss +41 -0
  117. package/styles/components/_date-range-picker.scss +225 -224
  118. package/styles/components/_decrement-increment.scss +35 -37
  119. package/styles/components/_dropdown.scss +72 -74
  120. package/styles/components/_flight-option.scss +1429 -0
  121. package/styles/components/_form.scss +1583 -136
  122. package/styles/components/_info-message.scss +71 -0
  123. package/styles/components/_input.scss +25 -0
  124. package/styles/components/_list.scss +187 -0
  125. package/styles/components/_loader.scss +72 -71
  126. package/styles/components/_mixins.scss +550 -518
  127. package/styles/components/_placeholders.scss +166 -166
  128. package/styles/components/_pricing-summary.scss +155 -0
  129. package/styles/components/_qsm.scss +17 -20
  130. package/styles/components/_radiobutton.scss +170 -0
  131. package/styles/components/_select-wrapper.scss +80 -0
  132. package/styles/components/_spinner.scss +29 -0
  133. package/styles/components/_step-indicators.scss +168 -0
  134. package/styles/components/_table.scss +81 -0
  135. package/styles/components/_tree.scss +530 -0
  136. package/styles/components/_typeahead.scss +281 -0
  137. package/styles/components/_variables.scss +89 -89
@@ -1,164 +1,164 @@
1
- import { PayloadAction, createSelector, createSlice } from "@reduxjs/toolkit";
2
- import { differenceInYears } from "date-fns";
3
-
4
- import { RootState } from "../../store";
5
- import { TravelersFormValues } from "../../types";
6
-
7
- export interface TravelersFormState {
8
- formValues?: TravelersFormValues;
9
- }
10
-
11
- export const CHILD_MAX_AGE = 17;
12
- const isDebug = false;
13
-
14
- const debugFormValues = {
15
- rooms: [
16
- {
17
- adults: [
18
- {
19
- id: 1,
20
- firstName: "Jan",
21
- lastName: "Jansens",
22
- birthDate: "1984-05-20",
23
- gender: "m",
24
- },
25
- {
26
- id: 2,
27
- firstName: "Leen",
28
- lastName: "Leenders",
29
- birthDate: "1986-08-09",
30
- gender: "f",
31
- },
32
- ],
33
- // children: [
34
- // {
35
- // id: "3",
36
- // firstName: "Jonas",
37
- // lastName: "Jansens",
38
- // birthDate: "2015-06-14",
39
- // gender: "m",
40
- // },
41
- // {
42
- // id: "4",
43
- // firstName: "Janne",
44
- // lastName: "Jansens",
45
- // birthDate: "2016-03-19",
46
- // gender: "f",
47
- // },
48
- // ],
49
- children: [],
50
- },
51
- {
52
- adults: [
53
- {
54
- id: 3,
55
- firstName: "Jan",
56
- lastName: "Jansens",
57
- birthDate: "1984-05-20",
58
- gender: "m",
59
- },
60
- {
61
- id: 4,
62
- firstName: "Leen",
63
- lastName: "Leenders",
64
- birthDate: "1986-08-09",
65
- gender: "f",
66
- },
67
- ],
68
- // children: [
69
- // {
70
- // id: "3",
71
- // firstName: "Jonas",
72
- // lastName: "Jansens",
73
- // birthDate: "2015-06-14",
74
- // gender: "m",
75
- // },
76
- // {
77
- // id: "4",
78
- // firstName: "Janne",
79
- // lastName: "Jansens",
80
- // birthDate: "2016-03-19",
81
- // gender: "f",
82
- // },
83
- // ],
84
- children: [],
85
- },
86
- ],
87
- mainBookerId: 1,
88
- street: "Nieuwstraat",
89
- houseNumber: "20",
90
- box: "A",
91
- zipCode: "9000",
92
- place: "Gent",
93
- country: "be",
94
- email: "staging@qite.be",
95
- emailConfirmation: "staging@qite.be",
96
- phone: "+32 471 12 34 56",
97
- travelAgentId: 0,
98
- travelAgentName: "",
99
- };
100
-
101
- const initialState: TravelersFormState = {
102
- formValues: isDebug ? debugFormValues : undefined,
103
- };
104
-
105
- const travelersFormSlice = createSlice({
106
- name: "travelersForm",
107
- initialState,
108
- reducers: {
109
- setFormValues(state, action: PayloadAction<TravelersFormValues>) {
110
- state.formValues = action.payload;
111
- },
112
- },
113
- });
114
-
115
- export const { setFormValues } = travelersFormSlice.actions;
116
-
117
- export const selectTravelersFormValues = (state: RootState) =>
118
- state.travelersForm.formValues;
119
-
120
- export const selectRooms = createSelector(
121
- selectTravelersFormValues,
122
- (formValues) => formValues?.rooms ?? []
123
- );
124
-
125
- export const selectAgentId = createSelector(
126
- selectTravelersFormValues,
127
- (formValues) => formValues?.travelAgentId
128
- );
129
-
130
- const selectRequestRooms = (state: RootState) =>
131
- state.booking.package?.options.find((x) => x.isSelected)?.requestRooms;
132
-
133
- export const selectFormRooms = createSelector(selectRequestRooms, (rooms) => {
134
- const formRooms: { adults: number[]; children: number[] }[] = [];
135
- if (rooms) {
136
- rooms.forEach((x) => {
137
- const formRoom: { adults: number[]; children: number[] } = {
138
- adults: [],
139
- children: [],
140
- };
141
-
142
- x.pax.forEach((p) => {
143
- if (p.age && p.age > CHILD_MAX_AGE) {
144
- formRoom.adults.push(p.id);
145
- } else if (p.age && p.age <= CHILD_MAX_AGE) {
146
- formRoom.children.push(p.id);
147
- } else if (p.dateOfBirth) {
148
- const diff = differenceInYears(new Date(), new Date(p.dateOfBirth));
149
-
150
- if (diff > CHILD_MAX_AGE) {
151
- formRoom.adults.push(p.id);
152
- } else {
153
- formRoom.children.push(p.id);
154
- }
155
- }
156
- });
157
-
158
- formRooms.push(formRoom);
159
- });
160
- }
161
- return formRooms;
162
- });
163
-
164
- export default travelersFormSlice.reducer;
1
+ import { PayloadAction, createSelector, createSlice } from "@reduxjs/toolkit";
2
+ import { differenceInYears } from "date-fns";
3
+
4
+ import { RootState } from "../../store";
5
+ import { TravelersFormValues } from "../../types";
6
+
7
+ export interface TravelersFormState {
8
+ formValues?: TravelersFormValues;
9
+ }
10
+
11
+ export const CHILD_MAX_AGE = 17;
12
+ const isDebug = false;
13
+
14
+ const debugFormValues = {
15
+ rooms: [
16
+ {
17
+ adults: [
18
+ {
19
+ id: 1,
20
+ firstName: "Jan",
21
+ lastName: "Jansens",
22
+ birthDate: "1984-05-20",
23
+ gender: "m",
24
+ },
25
+ {
26
+ id: 2,
27
+ firstName: "Leen",
28
+ lastName: "Leenders",
29
+ birthDate: "1986-08-09",
30
+ gender: "f",
31
+ },
32
+ ],
33
+ // children: [
34
+ // {
35
+ // id: "3",
36
+ // firstName: "Jonas",
37
+ // lastName: "Jansens",
38
+ // birthDate: "2015-06-14",
39
+ // gender: "m",
40
+ // },
41
+ // {
42
+ // id: "4",
43
+ // firstName: "Janne",
44
+ // lastName: "Jansens",
45
+ // birthDate: "2016-03-19",
46
+ // gender: "f",
47
+ // },
48
+ // ],
49
+ children: [],
50
+ },
51
+ {
52
+ adults: [
53
+ {
54
+ id: 3,
55
+ firstName: "Jan",
56
+ lastName: "Jansens",
57
+ birthDate: "1984-05-20",
58
+ gender: "m",
59
+ },
60
+ {
61
+ id: 4,
62
+ firstName: "Leen",
63
+ lastName: "Leenders",
64
+ birthDate: "1986-08-09",
65
+ gender: "f",
66
+ },
67
+ ],
68
+ // children: [
69
+ // {
70
+ // id: "3",
71
+ // firstName: "Jonas",
72
+ // lastName: "Jansens",
73
+ // birthDate: "2015-06-14",
74
+ // gender: "m",
75
+ // },
76
+ // {
77
+ // id: "4",
78
+ // firstName: "Janne",
79
+ // lastName: "Jansens",
80
+ // birthDate: "2016-03-19",
81
+ // gender: "f",
82
+ // },
83
+ // ],
84
+ children: [],
85
+ },
86
+ ],
87
+ mainBookerId: 1,
88
+ street: "Nieuwstraat",
89
+ houseNumber: "20",
90
+ box: "A",
91
+ zipCode: "9000",
92
+ place: "Gent",
93
+ country: "be",
94
+ email: "staging@qite.be",
95
+ emailConfirmation: "staging@qite.be",
96
+ phone: "+32 471 12 34 56",
97
+ travelAgentId: 0,
98
+ travelAgentName: "",
99
+ };
100
+
101
+ const initialState: TravelersFormState = {
102
+ formValues: isDebug ? debugFormValues : undefined,
103
+ };
104
+
105
+ const travelersFormSlice = createSlice({
106
+ name: "travelersForm",
107
+ initialState,
108
+ reducers: {
109
+ setFormValues(state, action: PayloadAction<TravelersFormValues>) {
110
+ state.formValues = action.payload;
111
+ },
112
+ },
113
+ });
114
+
115
+ export const { setFormValues } = travelersFormSlice.actions;
116
+
117
+ export const selectTravelersFormValues = (state: RootState) =>
118
+ state.travelersForm.formValues;
119
+
120
+ export const selectRooms = createSelector(
121
+ selectTravelersFormValues,
122
+ (formValues) => formValues?.rooms ?? []
123
+ );
124
+
125
+ export const selectAgentId = createSelector(
126
+ selectTravelersFormValues,
127
+ (formValues) => formValues?.travelAgentId
128
+ );
129
+
130
+ const selectRequestRooms = (state: RootState) =>
131
+ state.booking.package?.options.find((x) => x.isSelected)?.requestRooms;
132
+
133
+ export const selectFormRooms = createSelector(selectRequestRooms, (rooms) => {
134
+ const formRooms: { adults: number[]; children: number[] }[] = [];
135
+ if (rooms) {
136
+ rooms.forEach((x) => {
137
+ const formRoom: { adults: number[]; children: number[] } = {
138
+ adults: [],
139
+ children: [],
140
+ };
141
+
142
+ x.pax.forEach((p) => {
143
+ if (p.age && p.age > CHILD_MAX_AGE) {
144
+ formRoom.adults.push(p.id);
145
+ } else if (p.age && p.age <= CHILD_MAX_AGE) {
146
+ formRoom.children.push(p.id);
147
+ } else if (p.dateOfBirth) {
148
+ const diff = differenceInYears(new Date(), new Date(p.dateOfBirth));
149
+
150
+ if (diff > CHILD_MAX_AGE) {
151
+ formRoom.adults.push(p.id);
152
+ } else {
153
+ formRoom.children.push(p.id);
154
+ }
155
+ }
156
+ });
157
+
158
+ formRooms.push(formRoom);
159
+ });
160
+ }
161
+ return formRooms;
162
+ });
163
+
164
+ export default travelersFormSlice.reducer;