@travelswitchhq/flight-search-react 1.0.9 → 1.1.0

package/dist/index.d.cts

@@ -39,6 +39,7 @@ type FlightSearchWidgetProps = {
             primary?: string;
             secondary?: string;
             primaryLight?: string;
+            secondaryBgText?: string;
         };
         redirectionDomain?: string;
         fontName?: string;

package/dist/index.d.ts

@@ -39,6 +39,7 @@ type FlightSearchWidgetProps = {
             primary?: string;
             secondary?: string;
             primaryLight?: string;
+            secondaryBgText?: string;
         };
         redirectionDomain?: string;
         fontName?: string;

package/dist/index.mjs

@@ -11,7 +11,6 @@ var flightSearchWidgetStyles = `
 .sw-container {
   --sw-font-family: Montserrat, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   --sw-en-font-family: Arial, sans-serif;
-  --sw-secondary-bg-text: #ffffff;
   --sw-label-color: #66797F;
   --sw-body-text: #0B1215;
   --sw-btn-radius: 8px;
@@ -736,7 +735,7 @@ padding-inline-start: 25px;
   gap: 10px;
   cursor: pointer;
   user-select: none;
-  color: var(--sw-body-text);
+  color: var(--secondary-bg-text);
   font-size: 14px;
 }
 .sw-material-checkbox input {
@@ -789,10 +788,13 @@ padding-inline-start: 25px;
   background-color: var(--primary-light);
   color: var(--primary);
 }
+.sw-card-box .sw-srh-class .sw-tab-content {
+  border: 1px solid var(--sw-form-border);
+}
 .sw-card-box .sw-tab-content {
   height: 40px;
   padding: 6px 15px;
-  border: 1px solid var(--sw-secondary-bg-text);
+  border: 1px solid var(--secondary-bg-text);
   border-radius: var(--sw-radius);
   align-content: center;
 }
@@ -862,11 +864,11 @@ padding-inline-start: 25px;
   height: 40px;
 }
 .sw-srh-round-text .sw-tab-content{
-  color: var(--sw-secondary-bg-text);
+  color: var(--secondary-bg-text);
 }
 .sw-advanced-search-options .p-accordion-header-text,
 .sw-card-box .p-accordion-toggle-icon{
-  color: var(--sw-secondary-bg-text);
+  color: var(--secondary-bg-text);
 }
 .sw-remove-segment{
   fill: var(--primary);
@@ -945,10 +947,11 @@ padding-inline-start: 25px;
 }
 .p-autocomplete-multiple-container {
   width: 100%;
+  background-color: var(--sw-white);
   min-width: 270px;
   padding: 10px;
   padding-inline-end: 2rem;
-  border: 1px solid var(--sw-form-border);
+  border: 1px solid var(--secondary-bg-text);
   border-radius: var(--sw-radius);
   gap: 0.5rem;
   font-size: 14px;
@@ -1445,8 +1448,9 @@ function FlightSearchWidget({
 }) {
   const theme = config?.theme;
   const primaryColor = theme?.primary ?? "#2c0a82";
-  const secondaryColor = theme?.secondary ?? "#2c0a82";
   const primaryLightColor = theme?.primaryLight ?? "#f3e2ff";
+  const secondaryColor = theme?.secondary ?? "#2c0a82";
+  const secondaryBgText = theme?.secondaryBgText ?? "#ffffff";
   const fontName = config?.fontName;
   const redirectionDomain = config?.redirectionDomain;
   const env = config?.env ?? "dev";
@@ -1697,15 +1701,16 @@ function FlightSearchWidget({
     () => {
       const style = {
         ["--primary"]: primaryColor,
+        ["--primary-light"]: primaryLightColor,
         ["--secondary"]: secondaryColor,
-        ["--primary-light"]: primaryLightColor
+        ["--secondary-bg-text"]: secondaryBgText
       };
       if (fontName) {
         style["--font-family"] = fontName;
       }
       return style;
     },
-    [primaryColor, secondaryColor, primaryLightColor]
+    [primaryColor, secondaryColor, primaryLightColor, secondaryBgText]
   );
   useEffect(() => {
     ensureStylesInjected();