@qite/tide-booking-component 1.4.107 → 1.4.109

package/build/build-esm/index.js

@@ -16756,6 +16756,28 @@ var Icon = function (_a) {
           d: 'M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z'
         })
       );
+    case 'ui-triangle-error':
+      return React__default.createElement(
+        'svg',
+        {
+          className: ['icon', 'icon--'.concat(name), className]
+            .filter(function (className) {
+              return !isEmpty(className);
+            })
+            .join(' '),
+          width: width,
+          height: height,
+          viewBox: '0 0 512 512',
+          fill: fill !== null && fill !== void 0 ? fill : 'currentColor'
+        },
+        React__default.createElement(HTMLComment, {
+          text: '!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.'
+        }),
+        title && React__default.createElement('title', null, title),
+        React__default.createElement('path', {
+          d: 'M256 0c14.7 0 28.2 8.1 35.2 21l216 400c6.7 12.4 6.4 27.4-.8 39.5S486.1 480 472 480L40 480c-14.1 0-27.2-7.4-34.4-19.5s-7.5-27.1-.8-39.5l216-400c7-12.9 20.5-21 35.2-21zm0 352a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-192c-18.2 0-32.7 15.5-31.4 33.7l7.4 104c.9 12.5 11.4 22.3 23.9 22.3 12.6 0 23-9.7 23.9-22.3l7.4-104c1.3-18.2-13.1-33.7-31.4-33.7z'
+        })
+      );
     default:
       return null;
   }
@@ -31756,6 +31778,7 @@ var MobileFilterModal = function () {
     destinationAirport = _b.destinationAirport,
     returnAirport = _b.returnAirport,
     destination = _b.destination;
+  var searchInputRef = useRef(null);
   var _c = useState(''),
     inputValue = _c[0],
     setInputValue = _c[1];
@@ -31772,6 +31795,18 @@ var MobileFilterModal = function () {
     },
     [activeSearchFieldProps]
   );
+  useEffect(
+    function () {
+      if (mobileFilterType !== 'search') return;
+      requestAnimationFrame(function () {
+        var input = searchInputRef.current;
+        if (!input) return;
+        input.focus();
+        input.setSelectionRange(input.value.length, input.value.length);
+      });
+    },
+    [mobileFilterType, activeSearchFieldProps === null || activeSearchFieldProps === void 0 ? void 0 : activeSearchFieldProps.fieldKey]
+  );
   /* ---------------------------------------------------------------- */
   /* Helpers                                                          */
   /* ---------------------------------------------------------------- */
@@ -31964,6 +31999,7 @@ var MobileFilterModal = function () {
           'label',
           { className: 'qsm__input-wrapper' },
           React__default.createElement('input', {
+            ref: searchInputRef,
             type: 'text',
             id: 'search',
             value: inputValue,
@@ -31973,7 +32009,6 @@ var MobileFilterModal = function () {
             onChange: function (e) {
               return handleInputChange(e.target.value);
             },
-            // onChange={(e) => handleLocationChange(e.target.value)}
             className: 'qsm__input qsm__input--modal qsm__from-to u-ps-2',
             placeholder: activeSearchFieldProps.placeholder
           }),
@@ -32467,7 +32502,6 @@ var ItemPicker$1 = function (_a) {
     isDropdownOpen = _b[0],
     setIsDropdownOpen = _b[1];
   var dropdownRef = useRef(null);
-  var toggleButtonRef = useRef(null);
   var handlePick = function (picked, id) {
     setIsDropdownOpen(false);
     onPick(picked, id);
@@ -32489,7 +32523,7 @@ var ItemPicker$1 = function (_a) {
     React__default.createElement('span', { className: 'dropdown__label' }, label),
     React__default.createElement(
       'div',
-      { className: 'dropdown' },
+      { className: 'dropdown', ref: dropdownRef },
       React__default.createElement(
         'button',
         {
@@ -32498,8 +32532,7 @@ var ItemPicker$1 = function (_a) {
             return setIsDropdownOpen(function (prev) {
               return !prev;
             });
-          },
-          ref: toggleButtonRef
+          }
         },
         React__default.createElement('span', null, selection || placeholder),
         React__default.createElement('span', { className: 'arrow' }, '\u25BE')
@@ -32932,58 +32965,16 @@ var QSMContainer = function () {
           );
         })
       ),
-      React__default.createElement(
-        'div',
-        { className: 'qsm__filter' },
-        (qsmType === build.PortalQsmType.Accommodation ||
-          qsmType === build.PortalQsmType.AccommodationAndFlight ||
-          qsmType === build.PortalQsmType.GroupTour) &&
-          React__default.createElement(
-            'div',
-            { className: 'radiobutton-group qsm__filter__inputgroup' },
-            React__default.createElement(
-              'div',
-              { className: 'radiobutton' },
-              React__default.createElement(
-                'label',
-                { className: 'radiobutton__label' },
-                React__default.createElement('input', {
-                  type: 'radio',
-                  name: 'numberOfAccommodations',
-                  // onChange={handleMainBookerChange}
-                  // onBlur={formik.handleBlur}
-                  value: '',
-                  checked: true,
-                  readOnly: true,
-                  className: 'radiobutton__input'
-                }),
-                React__default.createElement('span', null, translations.QSM.ONE_ACCOMMODATION)
-              )
-            ),
+      !isMobile &&
+        React__default.createElement(
+          'div',
+          { className: 'qsm__filter' },
+          (qsmType === build.PortalQsmType.Accommodation ||
+            qsmType === build.PortalQsmType.AccommodationAndFlight ||
+            qsmType === build.PortalQsmType.GroupTour) &&
             React__default.createElement(
               'div',
-              { className: 'radiobutton' },
-              React__default.createElement(
-                'label',
-                { className: 'radiobutton__label' },
-                React__default.createElement('input', {
-                  type: 'radio',
-                  name: 'numberOfAccommodations',
-                  // onChange={handleMainBookerChange}
-                  // onBlur={formik.handleBlur}
-                  value: '',
-                  className: 'radiobutton__input',
-                  disabled: true
-                }),
-                React__default.createElement('span', null, translations.QSM.MULTIPLE_ACCOMMODATIONS)
-              )
-            )
-          ),
-        qsmType === build.PortalQsmType.Flight &&
-          React__default.createElement(
-            'div',
-            { className: 'radiobutton-group qsm__filter__inputgroup' },
-            allowOneWay &&
+              { className: 'radiobutton-group qsm__filter__inputgroup' },
               React__default.createElement(
                 'div',
                 { className: 'radiobutton' },
@@ -32992,18 +32983,17 @@ var QSMContainer = function () {
                   { className: 'radiobutton__label' },
                   React__default.createElement('input', {
                     type: 'radio',
-                    name: 'tripType',
-                    value: 'oneway',
-                    checked: tripType === 'oneway',
-                    onChange: function () {
-                      return handleTripTypeChange('oneway');
-                    },
+                    name: 'numberOfAccommodations',
+                    // onChange={handleMainBookerChange}
+                    // onBlur={formik.handleBlur}
+                    value: '',
+                    checked: true,
+                    readOnly: true,
                     className: 'radiobutton__input'
                   }),
-                  React__default.createElement('span', null, translations.QSM.ONEWAY)
+                  React__default.createElement('span', null, translations.QSM.ONE_ACCOMMODATION)
                 )
               ),
-            allowRoundtrip &&
               React__default.createElement(
                 'div',
                 { className: 'radiobutton' },
@@ -33012,58 +33002,102 @@ var QSMContainer = function () {
                   { className: 'radiobutton__label' },
                   React__default.createElement('input', {
                     type: 'radio',
-                    name: 'tripType',
-                    value: 'roundtrip',
-                    checked: tripType === 'roundtrip',
-                    onChange: function () {
-                      return handleTripTypeChange('roundtrip');
-                    },
-                    className: 'radiobutton__input'
+                    name: 'numberOfAccommodations',
+                    // onChange={handleMainBookerChange}
+                    // onBlur={formik.handleBlur}
+                    value: '',
+                    className: 'radiobutton__input',
+                    disabled: true
                   }),
-                  React__default.createElement('span', null, translations.QSM.ROUNDTRIP)
+                  React__default.createElement('span', null, translations.QSM.MULTIPLE_ACCOMMODATIONS)
                 )
-              ),
-            allowOpenJaw &&
-              React__default.createElement(
-                'div',
-                { className: 'radiobutton' },
+              )
+            ),
+          qsmType === build.PortalQsmType.Flight &&
+            React__default.createElement(
+              'div',
+              { className: 'radiobutton-group qsm__filter__inputgroup' },
+              allowOneWay &&
                 React__default.createElement(
-                  'label',
-                  { className: 'radiobutton__label' },
-                  React__default.createElement('input', {
-                    type: 'radio',
-                    name: 'tripType',
-                    value: 'openjaw',
-                    checked: tripType === 'openjaw',
-                    onChange: function () {
-                      return handleTripTypeChange('openjaw');
-                    },
-                    className: 'radiobutton__input'
-                  }),
-                  React__default.createElement('span', null, translations.QSM.OPENJAW)
+                  'div',
+                  { className: 'radiobutton' },
+                  React__default.createElement(
+                    'label',
+                    { className: 'radiobutton__label' },
+                    React__default.createElement('input', {
+                      type: 'radio',
+                      name: 'tripType',
+                      value: 'oneway',
+                      checked: tripType === 'oneway',
+                      onChange: function () {
+                        return handleTripTypeChange('oneway');
+                      },
+                      className: 'radiobutton__input'
+                    }),
+                    React__default.createElement('span', null, translations.QSM.ONEWAY)
+                  )
+                ),
+              allowRoundtrip &&
+                React__default.createElement(
+                  'div',
+                  { className: 'radiobutton' },
+                  React__default.createElement(
+                    'label',
+                    { className: 'radiobutton__label' },
+                    React__default.createElement('input', {
+                      type: 'radio',
+                      name: 'tripType',
+                      value: 'roundtrip',
+                      checked: tripType === 'roundtrip',
+                      onChange: function () {
+                        return handleTripTypeChange('roundtrip');
+                      },
+                      className: 'radiobutton__input'
+                    }),
+                    React__default.createElement('span', null, translations.QSM.ROUNDTRIP)
+                  )
+                ),
+              allowOpenJaw &&
+                React__default.createElement(
+                  'div',
+                  { className: 'radiobutton' },
+                  React__default.createElement(
+                    'label',
+                    { className: 'radiobutton__label' },
+                    React__default.createElement('input', {
+                      type: 'radio',
+                      name: 'tripType',
+                      value: 'openjaw',
+                      checked: tripType === 'openjaw',
+                      onChange: function () {
+                        return handleTripTypeChange('openjaw');
+                      },
+                      className: 'radiobutton__input'
+                    }),
+                    React__default.createElement('span', null, translations.QSM.OPENJAW)
+                  )
                 )
-              )
-          ),
-        React__default.createElement(
-          'div',
-          { className: 'qsm__filter__classgroup' },
-          qsmType !== build.PortalQsmType.Accommodation &&
-            qsmType !== build.PortalQsmType.Car &&
-            qsmType !== build.PortalQsmType.Ticket &&
-            qsmType !== build.PortalQsmType.Cruise &&
-            qsmType !== build.PortalQsmType.Transfer &&
-            qsmType !== build.PortalQsmType.GroupTour &&
-            askTravelClass &&
-            React__default.createElement(TravelClassPicker, null),
-          qsmType !== build.PortalQsmType.Multidestination &&
-            qsmType !== build.PortalQsmType.Car &&
-            qsmType !== build.PortalQsmType.Flight &&
-            qsmType !== build.PortalQsmType.Transfer &&
-            askTravelType &&
-            React__default.createElement(TravelTypePicker, null),
-          askNationality && React__default.createElement(TravelNationalityPicker, null)
-        )
-      ),
+            ),
+          React__default.createElement(
+            'div',
+            { className: 'qsm__filter__classgroup' },
+            qsmType !== build.PortalQsmType.Accommodation &&
+              qsmType !== build.PortalQsmType.Car &&
+              qsmType !== build.PortalQsmType.Ticket &&
+              qsmType !== build.PortalQsmType.Cruise &&
+              qsmType !== build.PortalQsmType.Transfer &&
+              qsmType !== build.PortalQsmType.GroupTour &&
+              askTravelClass &&
+              React__default.createElement(TravelClassPicker, null),
+            qsmType !== build.PortalQsmType.Multidestination &&
+              qsmType !== build.PortalQsmType.Car &&
+              qsmType !== build.PortalQsmType.Flight &&
+              qsmType !== build.PortalQsmType.Transfer &&
+              askTravelType &&
+              React__default.createElement(TravelTypePicker, null),
+            askNationality && React__default.createElement(TravelNationalityPicker, null)
+          )
+        ),
       React__default.createElement(
         'div',
         { className: 'qsm__input-group' },
@@ -33082,6 +33116,139 @@ var QSMContainer = function () {
           React__default.createElement(SearchInputGroup, { fieldConfig: destination }),
         React__default.createElement(Dates, { value: dateRange, onChange: handleDateChange }),
         askTravelers && React__default.createElement(TravelInputGroup, null),
+        isMobile &&
+          React__default.createElement(
+            'div',
+            { className: 'qsm__filter' },
+            (qsmType === build.PortalQsmType.Accommodation ||
+              qsmType === build.PortalQsmType.AccommodationAndFlight ||
+              qsmType === build.PortalQsmType.GroupTour) &&
+              React__default.createElement(
+                'div',
+                { className: 'radiobutton-group qsm__filter__inputgroup' },
+                React__default.createElement(
+                  'div',
+                  { className: 'radiobutton' },
+                  React__default.createElement(
+                    'label',
+                    { className: 'radiobutton__label' },
+                    React__default.createElement('input', {
+                      type: 'radio',
+                      name: 'numberOfAccommodations',
+                      // onChange={handleMainBookerChange}
+                      // onBlur={formik.handleBlur}
+                      value: '',
+                      checked: true,
+                      readOnly: true,
+                      className: 'radiobutton__input'
+                    }),
+                    React__default.createElement('span', null, translations.QSM.ONE_ACCOMMODATION)
+                  )
+                ),
+                React__default.createElement(
+                  'div',
+                  { className: 'radiobutton' },
+                  React__default.createElement(
+                    'label',
+                    { className: 'radiobutton__label' },
+                    React__default.createElement('input', {
+                      type: 'radio',
+                      name: 'numberOfAccommodations',
+                      // onChange={handleMainBookerChange}
+                      // onBlur={formik.handleBlur}
+                      value: '',
+                      className: 'radiobutton__input',
+                      disabled: true
+                    }),
+                    React__default.createElement('span', null, translations.QSM.MULTIPLE_ACCOMMODATIONS)
+                  )
+                )
+              ),
+            qsmType === build.PortalQsmType.Flight &&
+              React__default.createElement(
+                'div',
+                { className: 'radiobutton-group qsm__filter__inputgroup' },
+                allowOneWay &&
+                  React__default.createElement(
+                    'div',
+                    { className: 'radiobutton' },
+                    React__default.createElement(
+                      'label',
+                      { className: 'radiobutton__label' },
+                      React__default.createElement('input', {
+                        type: 'radio',
+                        name: 'tripType',
+                        value: 'oneway',
+                        checked: tripType === 'oneway',
+                        onChange: function () {
+                          return handleTripTypeChange('oneway');
+                        },
+                        className: 'radiobutton__input'
+                      }),
+                      React__default.createElement('span', null, translations.QSM.ONEWAY)
+                    )
+                  ),
+                allowRoundtrip &&
+                  React__default.createElement(
+                    'div',
+                    { className: 'radiobutton' },
+                    React__default.createElement(
+                      'label',
+                      { className: 'radiobutton__label' },
+                      React__default.createElement('input', {
+                        type: 'radio',
+                        name: 'tripType',
+                        value: 'roundtrip',
+                        checked: tripType === 'roundtrip',
+                        onChange: function () {
+                          return handleTripTypeChange('roundtrip');
+                        },
+                        className: 'radiobutton__input'
+                      }),
+                      React__default.createElement('span', null, translations.QSM.ROUNDTRIP)
+                    )
+                  ),
+                allowOpenJaw &&
+                  React__default.createElement(
+                    'div',
+                    { className: 'radiobutton' },
+                    React__default.createElement(
+                      'label',
+                      { className: 'radiobutton__label' },
+                      React__default.createElement('input', {
+                        type: 'radio',
+                        name: 'tripType',
+                        value: 'openjaw',
+                        checked: tripType === 'openjaw',
+                        onChange: function () {
+                          return handleTripTypeChange('openjaw');
+                        },
+                        className: 'radiobutton__input'
+                      }),
+                      React__default.createElement('span', null, translations.QSM.OPENJAW)
+                    )
+                  )
+              ),
+            React__default.createElement(
+              'div',
+              { className: 'qsm__filter__classgroup' },
+              qsmType !== build.PortalQsmType.Accommodation &&
+                qsmType !== build.PortalQsmType.Car &&
+                qsmType !== build.PortalQsmType.Ticket &&
+                qsmType !== build.PortalQsmType.Cruise &&
+                qsmType !== build.PortalQsmType.Transfer &&
+                qsmType !== build.PortalQsmType.GroupTour &&
+                askTravelClass &&
+                React__default.createElement(TravelClassPicker, null),
+              qsmType !== build.PortalQsmType.Multidestination &&
+                qsmType !== build.PortalQsmType.Car &&
+                qsmType !== build.PortalQsmType.Flight &&
+                qsmType !== build.PortalQsmType.Transfer &&
+                askTravelType &&
+                React__default.createElement(TravelTypePicker, null),
+              askNationality && React__default.createElement(TravelNationalityPicker, null)
+            )
+          ),
         React__default.createElement(
           'button',
           { type: 'button', className: 'cta', onClick: handleSubmit },

package/build/build-esm/src/content/error/error.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type ErrorProps = {
+  message?: string;
+};
+declare const Error: React.FC<ErrorProps>;
+export default Error;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qite/tide-booking-component",
-  "version": "1.4.107",
+  "version": "1.4.109",
   "description": "React Booking wizard & Booking product component for Tide",
   "main": "build/build-cjs/index.js",
   "types": "build/build-cjs/src/index.d.ts",

package/src/content/components/image-with-text.tsx

@@ -65,7 +65,6 @@ interface ImageWithTextSectionProps {
 
 export const ImageWithTextSection: React.FC<ImageWithTextSectionProps> = ({ variant, sectionTitle, hasBackground = true, cards }) => {
   const className = ['image-with-text', hasBackground && 'image-with-text--background'].filter(Boolean).join(' ');
-  console.log('variant', variant);
   return (
     <div className={className}>
       <div className="image-with-text__container">

package/src/content/error/error.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import Icon from '../../shared/components/icon';
+
+type ErrorProps = {
+  message?: string;
+};
+const Error: React.FC<ErrorProps> = ({ message }) => {
+  return (
+    <section className="error">
+      <div className="error__container">
+        <div className="error__card">
+          <div className="error__icon">
+            <Icon name="ui-triangle-error" width={20} height={20} />
+          </div>
+          <h1 className="error__title">Something went wrong</h1>
+          <p className="error__message">{message || 'Sorry, something went wrong. Please try again later.'}</p>
+
+          <a href="/" className="cta cta--primary error__link">
+            Back to home
+          </a>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default Error;