@times-components/ts-components 1.145.1-b32ea924749bafdf12e3e8515023538fa20e7808.3 → 1.145.1-cfea81c4084e6f91221ea00fec9fc730d5b933cb.4

package/dist/components/trip-cards/styles.js

@@ -0,0 +1,387 @@
+import styled from 'styled-components';
+const breakpoints = {
+    sm: '390px',
+    md: '768px',
+    lg: '1024px',
+    xl: '1320px'
+};
+const colors = {
+    primary: '#005C8A',
+    titleBlue: '#145683',
+    ink: '#333333',
+    inkBrand: '#01000D',
+    secondary: '#696969',
+    border: '#E4E4E4',
+    offerBg: '#FFEECF',
+    offerBorder: '#FFB329',
+    strikethrough: '#9F0000',
+    dotActive: '#01000D',
+    dotInactive: '#AAAAAA',
+    iconBlue: '#236FA3',
+    white: '#FFFFFF'
+};
+export const Container = styled.div `
+  max-width: 800px;
+  margin: 0 auto;
+  padding: 80px 0 40px;
+
+  @media (max-width: ${breakpoints.md}) {
+    padding: 40px 0;
+  }
+`;
+export const TitleSection = styled.div `
+  padding: 0;
+  margin-bottom: 16px;
+
+  @media (max-width: ${breakpoints.md}) {
+    padding: 0 10px;
+  }
+`;
+export const TitleBar = styled.div `
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 12px;
+  border-top: 1px dashed ${colors.border};
+  border-bottom: 1px dashed ${colors.border};
+  padding: 20px 0px;
+
+  @media (max-width: ${breakpoints.md}) {
+    justify-content: space-between;
+  }
+`;
+export const TitleContent = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+
+  @media (min-width: ${breakpoints.md}) {
+    flex-direction: row;
+    align-items: baseline;
+    gap: 8px;
+  }
+`;
+export const Title = styled.h2 `
+  font-family: 'Times Modern', serif;
+  font-size: 24px;
+  font-weight: 800;
+  line-height: 1.13;
+  color: #145683;
+  margin: 0;
+`;
+export const Subtitle = styled.p `
+  font-family: 'Times Modern', serif;
+  font-size: 20px;
+  font-weight: 400;
+  line-height: 1.13;
+  color: #333333;
+  margin: 0;
+  vertical-align: bottom;
+`;
+export const TitleLink = styled.a `
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  padding: 8px;
+  background: #eeeeee;
+  border-radius: 33.33px;
+  text-decoration: none;
+  transition: background-color 0.2s ease;
+  flex-shrink: 0;
+
+  &:hover {
+    background: #dddddd;
+  }
+
+  svg {
+    width: 16px;
+    height: 16px;
+    color: ${colors.ink};
+  }
+`;
+export const Description = styled.p `
+  font-family: 'Roboto', sans-serif;
+  font-size: 16px;
+  line-height: 1.5;
+  color: ${colors.secondary};
+  margin: 0 0 20px 0;
+`;
+export const StaticCardsGrid = styled.div `
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 20px;
+  padding: 0;
+
+  @media (min-width: ${breakpoints.md}) {
+    grid-template-columns: repeat(2, 1fr);
+  }
+`;
+// Card Styles
+export const CardContainer = styled.div `
+  width: 100%;
+  height: 100%;
+  border: 1.2px solid ${colors.border};
+  background: ${colors.white};
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+`;
+export const ImageContainer = styled.div `
+  position: relative;
+  width: 100%;
+  aspect-ratio: 3 / 2;
+  height: 100%;
+  overflow: hidden;
+  flex-shrink: 0;
+
+  @media (min-width: ${breakpoints.sm}) {
+    height: 213px;
+  }
+
+  @media (min-width: ${breakpoints.md}) {
+    height: 173px;
+  }
+
+  @media (min-width: ${breakpoints.xl}) {
+    height: 200px;
+  }
+`;
+export const CardImage = styled.img `
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: center;
+`;
+export const OfferLabel = styled.div `
+  position: absolute;
+  bottom: 12px;
+  left: 0;
+  background: ${colors.offerBg};
+  border-left: 1.2px solid ${colors.offerBorder};
+  padding: 12px 16px;
+  font-family: 'Roboto', sans-serif;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 1.5;
+  color: ${colors.ink};
+`;
+export const GiftBanner = styled.div `
+  position: absolute;
+  bottom: 12px;
+  left: 0;
+  max-width: 80%;
+  background: ${colors.offerBg};
+  padding: 12px 16px;
+  font-family: 'Roboto', sans-serif;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 1.5;
+  color: ${colors.ink};
+  text-align: left;
+`;
+export const CardContent = styled.div `
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  padding: 20px 16px 16px 16px;
+  gap: 32px;
+`;
+export const TopContainer = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  flex: 1;
+`;
+export const BottomContainer = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+`;
+export const Headline = styled.h3 `
+  font-family: 'Times Modern', serif;
+  font-size: 20px;
+  font-weight: 700;
+  line-height: 1.125;
+  color: ${colors.ink};
+  margin: 0;
+`;
+export const DataPointsList = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+`;
+export const DataPoint = styled.div `
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-family: 'Roboto', sans-serif;
+  font-size: 14px;
+  line-height: 1.5;
+  color: ${colors.secondary};
+  min-height: 21px;
+`;
+export const DataIcon = styled.span `
+  width: 17px;
+  height: 17px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: ${colors.iconBlue};
+  font-size: 17px;
+`;
+export const PriceSection = styled.div `
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 12px;
+`;
+export const PriceContainer = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  flex: 1;
+`;
+export const OfferContainer = styled.div `
+  display: flex;
+  align-items: center;
+  gap: 4px;
+`;
+export const PriceLabel = styled.span `
+  font-family: 'Roboto', sans-serif;
+  font-size: 14px;
+  line-height: 1.5;
+  color: ${colors.secondary};
+`;
+export const OriginalPrice = styled.span `
+  font-family: 'Roboto', sans-serif;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 1.5;
+  color: ${colors.strikethrough};
+  text-decoration: line-through;
+`;
+export const CurrentPrice = styled.span `
+  font-family: 'Times Modern', serif;
+  font-size: 44px;
+  font-weight: 300;
+  line-height: 1.125;
+  color: ${colors.ink};
+`;
+export const LogoContainer = styled.div `
+  width: 88px;
+  height: 44px;
+  display: flex;
+  align-items: center;
+
+  a {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+  }
+
+  img {
+    max-width: 100%;
+    max-height: 100%;
+    object-fit: contain;
+  }
+`;
+export const CTAButton = styled.a `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: 12px 16px;
+  background: ${colors.primary};
+  color: ${colors.white};
+  font-family: 'Roboto', sans-serif;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 1.5;
+  text-decoration: none;
+  transition: background 0.2s ease;
+
+  &:hover {
+    background: #004a6e;
+  }
+`;
+// Navigation Arrow - positioned on sides of carousel
+export const NavigationArrow = styled.button `
+  display: none;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  ${({ direction }) => direction === 'left' ? 'left: -65px;' : 'right: -65px;'} z-index: 10;
+  width: 48px;
+  height: 48px;
+  border: none;
+  border-radius: 50%;
+  background: ${({ disabled }) => (disabled ? '#CCCCCC' : colors.primary)};
+  cursor: ${({ disabled }) => (disabled ? 'default' : 'pointer')};
+  align-items: center;
+  justify-content: center;
+  transition: background 0.2s ease;
+  pointer-events: ${({ disabled }) => (disabled ? 'none' : 'auto')};
+
+  svg {
+    width: 24px;
+    height: 24px;
+  }
+
+  svg path {
+    stroke: ${colors.white};
+  }
+
+  &:hover:not(:disabled) {
+    background: #004a6e;
+  }
+
+  @media (min-width: ${breakpoints.lg}) {
+    display: flex;
+  }
+`;
+export const PageControl = styled.div `
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+  padding: 12px;
+  background: ${colors.white};
+`;
+export const PageDot = styled.button `
+  width: 8px;
+  height: 8px;
+  border-radius: 1000px;
+  border: none;
+  padding: 0;
+  background: ${({ active }) => (active ? '#01000D' : '#AAAAAA')};
+  cursor: pointer;
+  transition: background 0.2s ease;
+
+  &:hover {
+    background: #01000d;
+  }
+`;
+export const LoadingContainer = styled.div `
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: 400px;
+  font-family: 'Roboto', sans-serif;
+  color: ${colors.secondary};
+`;
+export const ErrorContainer = styled.div `
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: 200px;
+  font-family: 'Roboto', sans-serif;
+  color: ${colors.strikethrough};
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdHJpcC1jYXJkcy9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFFdkMsTUFBTSxXQUFXLEdBQUc7SUFDbEIsRUFBRSxFQUFFLE9BQU87SUFDWCxFQUFFLEVBQUUsT0FBTztJQUNYLEVBQUUsRUFBRSxRQUFRO0lBQ1osRUFBRSxFQUFFLFFBQVE7Q0FDYixDQUFDO0FBRUYsTUFBTSxNQUFNLEdBQUc7SUFDYixPQUFPLEVBQUUsU0FBUztJQUNsQixTQUFTLEVBQUUsU0FBUztJQUNwQixHQUFHLEVBQUUsU0FBUztJQUNkLFFBQVEsRUFBRSxTQUFTO0lBQ25CLFNBQVMsRUFBRSxTQUFTO0lBQ3BCLE1BQU0sRUFBRSxTQUFTO0lBQ2pCLE9BQU8sRUFBRSxTQUFTO0lBQ2xCLFdBQVcsRUFBRSxTQUFTO0lBQ3RCLGFBQWEsRUFBRSxTQUFTO0lBQ3hCLFNBQVMsRUFBRSxTQUFTO0lBQ3BCLFdBQVcsRUFBRSxTQUFTO0lBQ3RCLFFBQVEsRUFBRSxTQUFTO0lBQ25CLEtBQUssRUFBRSxTQUFTO0NBQ2pCLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxTQUFTLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTs7Ozs7dUJBS1osV0FBVyxDQUFDLEVBQUU7OztDQUdwQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sWUFBWSxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7dUJBSWYsV0FBVyxDQUFDLEVBQUU7OztDQUdwQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7OzJCQUtQLE1BQU0sQ0FBQyxNQUFNOzhCQUNWLE1BQU0sQ0FBQyxNQUFNOzs7dUJBR3BCLFdBQVcsQ0FBQyxFQUFFOzs7Q0FHcEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxN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

package/dist/components/trip-cards/types.d.ts

@@ -0,0 +1,87 @@
+import { ComponentType } from 'react';
+export interface TripCardsElement {
+    class?: string;
+    tripcards: string;
+    title?: string;
+    titleUrl?: string;
+    description?: string;
+}
+export interface TripCardsProps {
+    element: TripCardsElement;
+    useMockData?: boolean;
+}
+export interface DecodedTripCard {
+    cruise_id: string;
+}
+export interface TripCardApiData {
+    cruise_id: string;
+    image: string;
+    offer_label?: string;
+    gift_banner?: string;
+    headline: string;
+    date: string;
+    duration: string;
+    route: string;
+    ship: string;
+    original_price?: string;
+    price: string;
+    logo: string;
+    logo_url: string;
+    cta_url: string;
+    cta_text: string;
+}
+export interface TripCardProps {
+    card: TripCardApiData;
+}
+export interface ApiCruiseResult {
+    post_id: number;
+    cruise_id: number;
+    cruise_title: string;
+    cruise_line: {
+        name: string;
+        link: string;
+        logo: string;
+    };
+    ship: {
+        name: string;
+        link: string;
+        image: string;
+    };
+    departs: string;
+    ends: string;
+    date_label: string;
+    destination: string[];
+    duration: number;
+    itinerary: string[];
+    prices: {
+        cheapest_price: number | string;
+        inside: string | number;
+        outside: string | number;
+        balcony: string | number;
+        suite: string | number;
+    };
+    was_prices: {
+        cheapest_price: number | string;
+        inside: number;
+        outside: number;
+        balcony: number;
+        suite: number;
+    };
+    link: string;
+    campaigns: string[];
+    extras: {
+        date: string;
+        duration: string;
+        destination: string;
+        info: string;
+    };
+}
+export interface TripCardsLayoutProps {
+    element: TripCardsElement;
+    items: Array<{
+        id: string | number;
+        data?: TripCardApiData;
+    }>;
+    CardComponent: ComponentType<any>;
+    itemsPerPage: number;
+}

package/dist/components/trip-cards/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy90cmlwLWNhcmRzL3R5cGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIifQ==

package/dist/index.d.ts

@@ -35,6 +35,7 @@ export { HiddenDiv } from './components/common-styles';
 export { InlineMessage } from './components/inline-message/InlineMessage';
 export { InlineDialog } from './components/inline-dialog/InlineDialog';
 export { default as ArticleHeader } from './components/article-header/ArticleHeader';
+export { TripCards } from './components/trip-cards';
 export { UpdatedTimestamp } from './components/updated-timestamp/UpdatedTimestamp';
 export { UpdatedTimeProvider } from './helpers/time/UpdatedTimeProvider';
 export { WelcomeBanner } from './components/welcome-banner/WelcomeBanner';

package/dist/index.js

@@ -40,6 +40,7 @@ export { HiddenDiv } from './components/common-styles';
 export { InlineMessage } from './components/inline-message/InlineMessage';
 export { InlineDialog } from './components/inline-dialog/InlineDialog';
 export { default as ArticleHeader } from './components/article-header/ArticleHeader';
+export { TripCards } from './components/trip-cards';
 export { UpdatedTimestamp } from './components/updated-timestamp/UpdatedTimestamp';
 export { UpdatedTimeProvider } from './helpers/time/UpdatedTimeProvider';
 export { WelcomeBanner } from './components/welcome-banner/WelcomeBanner';
@@ -60,4 +61,4 @@ export { trackAlgoliaConversionWithDwellTime, getValidConversionData } from './h
 export { OptaMatchStatsSummary } from './components/opta/football/opta-match-stats/summary/OptaMatchStatsSummary';
 export { OptaMatchStatsGraphs } from './components/opta/football/opta-match-stats/stats-graphs/OptaMatchStatsGraphs';
 export { OptaMatchStatsCommentary } from './components/opta/football/opta-match-stats/commentary/OptaMatchStatsCommentary';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEscUJBQXFCO0FBQ3JCLE9BQU8sRUFDTCxtQkFBbUIsRUFDbkIsZUFBZSxFQUNoQixNQUFNLDJDQUEyQyxDQUFDO0FBQ25ELE9BQU8sRUFFTCx1QkFBdUIsRUFDeEIsTUFBTSw0Q0FBNEMsQ0FBQztBQUNwRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDM0UsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLDRDQUE0QyxDQUFDO0FBQ3RFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQztBQUN4RSxPQUFPLEVBQ0wsb0JBQW9CLEVBQ3JCLE1BQU0scUVBQXFFLENBQUM7QUFDN0UsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQzVFLE9BQU8sRUFDTCxXQUFXLEVBQ1gsWUFBWSxFQUNaLGNBQWMsRUFDZCxrQkFBa0IsRUFDbEIsb0JBQW9CLEVBQ3BCLG9CQUFvQixFQUNwQixtQkFBbUIsRUFDcEIsTUFBTSx1Q0FBdUMsQ0FBQztBQUMvQyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sNkNBQTZDLENBQUM7QUFDeEUsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBQzNELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUNoRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sMENBQTBDLENBQUM7QUFDeEUsT0FBTyxFQUNMLHFCQUFxQixFQUN0QixNQUFNLHFEQUFxRCxDQUFDO0FBQzdELE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUNwRCxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFFNUQsd0JBQXdCO0FBQ3hCLE9BQU8sRUFDTCxrQkFBa0IsRUFDbkIsTUFBTSxp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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEscUJBQXFCO0FBQ3JCLE9BQU8sRUFDTCxtQkFBbUIsRUFDbkIsZUFBZSxFQUNoQixNQUFNLDJDQUEyQyxDQUFDO0FBQ25ELE9BQU8sRUFFTCx1QkFBdUIsRUFDeEIsTUFBTSw0Q0FBNEMsQ0FBQztBQUNwRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDM0UsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLDRDQUE0QyxDQUFDO0FBQ3RFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQztBQUN4RSxPQUFPLEVBQ0wsb0JBQW9CLEVBQ3JCLE1BQU0scUVBQXFFLENBQUM7QUFDN0UsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQzVFLE9BQU8sRUFDTCxXQUFXLEVBQ1gsWUFBWSxFQUNaLGNBQWMsRUFDZCxrQkFBa0IsRUFDbEIsb0JBQW9CLEVBQ3BCLG9CQUFvQixFQUNwQixtQkFBbUIsRUFDcEIsTUFBTSx1Q0FBdUMsQ0FBQztBQUMvQyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sNkNBQTZDLENBQUM7QUFDeEUsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBQzNELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUNoRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sMENBQTBDLENBQUM7QUFDeEUsT0FBTyxFQUNMLHFCQUFxQixFQUN0QixNQUFNLHFEQUFxRCxDQUFDO0FBQzdELE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUNwRCxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFFNUQsd0JBQXdCO0FBQ3hCLE9BQU8sRUFDTCxrQkFBa0IsRUFDbkIsTUFBTSxp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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@times-components/ts-components",
-  "version": "1.145.1-b32ea924749bafdf12e3e8515023538fa20e7808.3+b32ea92474",
+  "version": "1.145.1-cfea81c4084e6f91221ea00fec9fc730d5b933cb.4+cfea81c408",
   "description": "Reuseable Typescript React Components",
   "main": "dist/index.js",
   "dev": "dist/index.js",
@@ -57,7 +57,7 @@
     "@times-components/link": "^3.18.27",
     "@times-components/provider": "^1.48.20",
     "@times-components/provider-queries": "^2.29.0",
-    "@times-components/related-articles": "^6.20.44-b32ea924749bafdf12e3e8515023538fa20e7808.3+b32ea92474",
+    "@times-components/related-articles": "^6.20.44-cfea81c4084e6f91221ea00fec9fc730d5b933cb.4+cfea81c408",
     "@times-components/ts-slices": "^1.10.42",
     "@times-components/ts-styleguide": "^1.56.21",
     "@times-components/utils": "^6.36.0",
@@ -120,5 +120,5 @@
       "@testing-library/jest-dom/extend-expect"
     ]
   },
-  "gitHead": "b32ea924749bafdf12e3e8515023538fa20e7808"
+  "gitHead": "cfea81c4084e6f91221ea00fec9fc730d5b933cb"
 }