@qite/tide-components 1.0.13 → 1.0.14

package/build/build-cjs/index.js

@@ -22737,7 +22737,7 @@ const SharedSidebar = ({ productName, thumbnailUrl, isLoading, translations, hea
                                                 detail.description),
                                             React__default["default"].createElement("div", { className: "pricing-summary__value" }, formatPrice$3(detail.price / detail.numberOfPax, currencyCode))))))))))))))),
                     !isLoading && canShowTotalPriceSection && !isUnavailable && (React__default["default"].createElement("div", { className: `pricing-summary__region pricing-summary__region--pricing ${!isLoading ? 'pricing-summary__region--fade-in' : ''}` }, deposit && remainingAmount > 0 ? (React__default["default"].createElement("div", { className: "pricing-summary__group" },
-                        agent && (React__default["default"].createElement("div", { className: "pricing-summary__row pricing-summary__row--total-price" },
+                        agent && showCommission && (React__default["default"].createElement("div", { className: "pricing-summary__row pricing-summary__row--total-price" },
                             React__default["default"].createElement("div", { className: "pricing-summary__property" },
                                 React__default["default"].createElement("h6", { className: "pricing-summary__title" }, translations.SIDEBAR.COMMISSION)),
                             React__default["default"].createElement("div", { className: "pricing-summary__value" },
@@ -34326,7 +34326,7 @@ const WLSidebar = ({ activeSearchSeed, packagingAccoResult }) => {
     const separateExtraPriceDetails = priceDetails?.details.filter((pd) => !pd.isInPackage && pd.isSeparate) ?? [];
     const totalPrice = lodash.sum([basePrice, ...separateExtraPriceDetails.map((priceDetail) => priceDetail.price * priceDetail.amount)]);
     const includedCosts = selectSeparatePackagePriceDetails(priceDetails?.details.filter((pd) => pd.isInPackage) ?? []);
-    return (React__default["default"].createElement(SharedSidebar, { productName: location ?? '', thumbnailUrl: accoImage ?? context.destinationImage?.url, translations: translations, travelerRooms: travelerRooms, startDateText: lodash.first(sortedLines)?.from && formatDate(new Date(lodash.first(sortedLines).from)), endDateText: lodash.last(sortedLines)?.to && formatDate(new Date(lodash.last(sortedLines).to)), isLoading: !editablePackagingEntry || !priceDetails, loaderComponent: React__default["default"].createElement(Spinner, null), departureFlightMetaData: outboundFlightMetaData, returnFlightMetaData: returnFlightMetaData, includedServiceTypes: editablePackagingEntry.lines.map((line) => line.serviceType), packagingAccommodations: accommodationLines, basePrice: basePrice, commission: priceDetails?.commission, totalPrice: totalPrice, includedCosts: includedCosts, extraCosts: separateExtraPriceDetails, deposit: priceDetails?.deposit, isUnavailable: false, agent: context.agentId, currencyCode: packagingAccoResult?.currencyCode }));
+    return (React__default["default"].createElement(SharedSidebar, { productName: location ?? '', thumbnailUrl: accoImage ?? context.destinationImage?.url, translations: translations, travelerRooms: travelerRooms, startDateText: lodash.first(sortedLines)?.from && formatDate(new Date(lodash.first(sortedLines).from)), endDateText: lodash.last(sortedLines)?.to && formatDate(new Date(lodash.last(sortedLines).to)), isLoading: !editablePackagingEntry || !priceDetails, loaderComponent: React__default["default"].createElement(Spinner, null), departureFlightMetaData: outboundFlightMetaData, returnFlightMetaData: returnFlightMetaData, includedServiceTypes: editablePackagingEntry.lines.map((line) => line.serviceType), packagingAccommodations: accommodationLines, basePrice: basePrice, commission: priceDetails?.commission, showCommission: (priceDetails?.commission ?? 0) > 0, totalPrice: totalPrice, includedCosts: includedCosts, extraCosts: separateExtraPriceDetails, deposit: priceDetails?.deposit, isUnavailable: false, agent: context.agentId, currencyCode: packagingAccoResult?.currencyCode }));
 };
 
 const formatBirthDate = (birthDate) => {
@@ -39302,20 +39302,20 @@ function ItineraryMapView({ destinations: propDestinations, adults = 2, dateFrom
             const isStartEnd = dest.isStart || dest.isEnd;
             let iconHtml;
             if (isStartEnd) {
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--plane">
-            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
-            </svg>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--plane">
+            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
+              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
+            </svg>
           </div>`;
             }
             else {
                 stopIndex++;
                 const imgStyle = dest.imageUrl ? `style="background-image:url('${dest.imageUrl}')"` : '';
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
-            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
-            <span class="map-view__marker-badge">${stopIndex}</span>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
+            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
+            <span class="map-view__marker-badge">${stopIndex}</span>
           </div>`;
             }
             const icon = L.divIcon({

package/build/build-esm/index.js

@@ -22708,7 +22708,7 @@ const SharedSidebar = ({ productName, thumbnailUrl, isLoading, translations, hea
                                                 detail.description),
                                             React__default.createElement("div", { className: "pricing-summary__value" }, formatPrice$3(detail.price / detail.numberOfPax, currencyCode))))))))))))))),
                     !isLoading && canShowTotalPriceSection && !isUnavailable && (React__default.createElement("div", { className: `pricing-summary__region pricing-summary__region--pricing ${!isLoading ? 'pricing-summary__region--fade-in' : ''}` }, deposit && remainingAmount > 0 ? (React__default.createElement("div", { className: "pricing-summary__group" },
-                        agent && (React__default.createElement("div", { className: "pricing-summary__row pricing-summary__row--total-price" },
+                        agent && showCommission && (React__default.createElement("div", { className: "pricing-summary__row pricing-summary__row--total-price" },
                             React__default.createElement("div", { className: "pricing-summary__property" },
                                 React__default.createElement("h6", { className: "pricing-summary__title" }, translations.SIDEBAR.COMMISSION)),
                             React__default.createElement("div", { className: "pricing-summary__value" },
@@ -34297,7 +34297,7 @@ const WLSidebar = ({ activeSearchSeed, packagingAccoResult }) => {
     const separateExtraPriceDetails = priceDetails?.details.filter((pd) => !pd.isInPackage && pd.isSeparate) ?? [];
     const totalPrice = sum([basePrice, ...separateExtraPriceDetails.map((priceDetail) => priceDetail.price * priceDetail.amount)]);
     const includedCosts = selectSeparatePackagePriceDetails(priceDetails?.details.filter((pd) => pd.isInPackage) ?? []);
-    return (React__default.createElement(SharedSidebar, { productName: location ?? '', thumbnailUrl: accoImage ?? context.destinationImage?.url, translations: translations, travelerRooms: travelerRooms, startDateText: first(sortedLines)?.from && formatDate(new Date(first(sortedLines).from)), endDateText: last(sortedLines)?.to && formatDate(new Date(last(sortedLines).to)), isLoading: !editablePackagingEntry || !priceDetails, loaderComponent: React__default.createElement(Spinner, null), departureFlightMetaData: outboundFlightMetaData, returnFlightMetaData: returnFlightMetaData, includedServiceTypes: editablePackagingEntry.lines.map((line) => line.serviceType), packagingAccommodations: accommodationLines, basePrice: basePrice, commission: priceDetails?.commission, totalPrice: totalPrice, includedCosts: includedCosts, extraCosts: separateExtraPriceDetails, deposit: priceDetails?.deposit, isUnavailable: false, agent: context.agentId, currencyCode: packagingAccoResult?.currencyCode }));
+    return (React__default.createElement(SharedSidebar, { productName: location ?? '', thumbnailUrl: accoImage ?? context.destinationImage?.url, translations: translations, travelerRooms: travelerRooms, startDateText: first(sortedLines)?.from && formatDate(new Date(first(sortedLines).from)), endDateText: last(sortedLines)?.to && formatDate(new Date(last(sortedLines).to)), isLoading: !editablePackagingEntry || !priceDetails, loaderComponent: React__default.createElement(Spinner, null), departureFlightMetaData: outboundFlightMetaData, returnFlightMetaData: returnFlightMetaData, includedServiceTypes: editablePackagingEntry.lines.map((line) => line.serviceType), packagingAccommodations: accommodationLines, basePrice: basePrice, commission: priceDetails?.commission, showCommission: (priceDetails?.commission ?? 0) > 0, totalPrice: totalPrice, includedCosts: includedCosts, extraCosts: separateExtraPriceDetails, deposit: priceDetails?.deposit, isUnavailable: false, agent: context.agentId, currencyCode: packagingAccoResult?.currencyCode }));
 };
 
 const formatBirthDate = (birthDate) => {
@@ -39273,20 +39273,20 @@ function ItineraryMapView({ destinations: propDestinations, adults = 2, dateFrom
             const isStartEnd = dest.isStart || dest.isEnd;
             let iconHtml;
             if (isStartEnd) {
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--plane">
-            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
-            </svg>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--plane">
+            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
+              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
+            </svg>
           </div>`;
             }
             else {
                 stopIndex++;
                 const imgStyle = dest.imageUrl ? `style="background-image:url('${dest.imageUrl}')"` : '';
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
-            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
-            <span class="map-view__marker-badge">${stopIndex}</span>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
+            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
+            <span class="map-view__marker-badge">${stopIndex}</span>
           </div>`;
             }
             const icon = L.divIcon({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qite/tide-components",
-  "version": "1.0.13",
+  "version": "1.0.14",
   "description": "React components for Tide (booking, product availability, form, ...)",
   "main": "build/build-cjs/index.js",
   "types": "build/build-cjs/src/index.d.ts",

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');