From ac315e14b41361527240ee808fb095c18ba7f3cc Mon Sep 17 00:00:00 2001
From: sumanganguly <suman.ganguly1981@gmail.com>
Date: Tue, 13 Feb 2024 16:07:05 +1100
Subject: [PATCH] PDM-1528: New Latitude Logo

---
 package-lock.json               |  2 +-
 package.json                    |  2 +-
 src/components/logo-list.js     |  2 +
 src/logos/latitude-rebranded.js | 84 +++++++++++++++++++++++++++++++++
 4 files changed, 88 insertions(+), 2 deletions(-)
 create mode 100644 src/logos/latitude-rebranded.js

diff --git a/package-lock.json b/package-lock.json
index 44f27296..0698b77e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "basis",
-  "version": "1.70.0",
+  "version": "1.72.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index 5944806b..4787a69e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "basis",
-  "version": "1.71.0",
+  "version": "1.72.0",
   "description": "Basis Design System",
   "main": "dist/index.js",
   "module": "dist/esm/index.js",
diff --git a/src/components/logo-list.js b/src/components/logo-list.js
index 39fce649..14404143 100644
--- a/src/components/logo-list.js
+++ b/src/components/logo-list.js
@@ -1,7 +1,9 @@
 import Gem from "../logos/gem";
 import Latitude from "../logos/latitude";
+import LatitudeRebranded from "../logos/latitude-rebranded";
 
 export const logoListMapping = {
   gem: Gem,
   latitude: Latitude,
+  "latitude-rebranded": LatitudeRebranded,
 };
diff --git a/src/logos/latitude-rebranded.js b/src/logos/latitude-rebranded.js
new file mode 100644
index 00000000..dec0e7f8
--- /dev/null
+++ b/src/logos/latitude-rebranded.js
@@ -0,0 +1,84 @@
+import React from "react";
+import PropTypes from "prop-types";
+import useTheme from "../hooks/useTheme";
+import useBackground, { mapResponsiveValues } from "../hooks/useBackground";
+import useResponsivePropsCSS from "../hooks/useResponsivePropsCSS";
+import {
+  responsiveHeightType,
+  responsiveMaxWidthType,
+} from "../hooks/useResponsiveProp";
+import { responsiveSize } from "../utils/css";
+import { mergeProps } from "../utils/component";
+
+const COLORS = ["primary.blue.t100", "black", "white"];
+
+const DEFAULT_PROPS = {
+  color: "primary.blue.t100",
+  height: "40px",
+};
+
+function LatitudeLogo(props) {
+  const theme = useTheme();
+  const { bgMap } = useBackground();
+  const colorMap = mapResponsiveValues(
+    bgMap,
+    (backgroundColor) => {
+      return (
+        props.color ??
+        (backgroundColor === "primary.blue.t100"
+          ? "white"
+          : "primary.blue.t100")
+      );
+    },
+    theme
+  );
+  const mergedProps = mergeProps(
+    props,
+    DEFAULT_PROPS,
+    {},
+    {
+      color: (color) => COLORS.includes(color),
+    }
+  );
+  const { testId } = mergedProps;
+  const svgResponsiveCSS = useResponsivePropsCSS(mergedProps, DEFAULT_PROPS, {
+    height: responsiveSize("height"),
+    maxWidth: responsiveSize("maxWidth"),
+  });
+  const pathResponsiveCSS = useResponsivePropsCSS(mergedProps, DEFAULT_PROPS, {
+    color: (propsAtBreakpoint, theme, bp) => {
+      return {
+        fill: theme.getColor(colorMap[bp]),
+      };
+    },
+  });
+
+  return (
+    <svg
+      css={{
+        display: "flex",
+        ...svgResponsiveCSS,
+      }}
+      viewBox="0 0 203 48"
+      focusable="false"
+      role="img"
+      aria-label="Latitude logo"
+      data-testid={testId}
+    >
+      <path
+        css={pathResponsiveCSS}
+        d="M142.6 91.2C142.6 98 137 103.6 130.2 103.6C123.4 103.6 117.8 98 117.8 91.2C117.8 84.4 123.4 78.8 130.2 78.8C137 78.8 142.6 84.4 142.6 91.2ZM130.2 0.899994C123.4 0.899994 117.8 6.5 117.8 13.3C117.8 20.1 123.4 25.7 130.2 25.7C137 25.7 142.6 20.1 142.6 13.3C142.6 6.4 137 0.899994 130.2 0.899994ZM130.2 39.8C123.4 39.8 117.8 45.4 117.8 52.2C117.8 59 123.4 64.6 130.2 64.6C137 64.6 142.6 59 142.6 52.2C142.6 45.4 137 39.8 130.2 39.8ZM25.7 0.899994H0.900024V142.6H142.6V117.8H25.7V0.899994ZM91.2 25.7C98 25.7 103.6 20.1 103.6 13.3C103.6 6.5 98 0.899994 91.2 0.899994C84.4 0.899994 78.8 6.5 78.8 13.3C78.8 20.1 84.4 25.7 91.2 25.7ZM52.2 25.7C59 25.7 64.6 20.1 64.6 13.3C64.6 6.5 59 0.899994 52.2 0.899994C45.4 0.899994 39.8 6.5 39.8 13.3C39.8 20.1 45.4 25.7 52.2 25.7ZM212 39.8H199.2V103.6H245.5V90.8H212V39.8ZM636 71.7C636 83.9 630.5 91.3 625.9 95.3C619.7 100.8 611.7 103.6 602.2 103.6H577.5V39.8H602.2C611.7 39.8 619.7 42.6 625.9 48.1C630.5 52.2 636 59.6 636 71.7ZM623.3 71.7C623.3 65.7 621.4 61 617.5 57.6C613.6 54.2 608.6 52.5 602.2 52.5H590.3V90.8H602.2C608.6 90.8 613.7 89.1 617.5 85.7C621.3 82.4 623.3 77.7 623.3 71.7ZM699.9 52.6V39.8H651.7V103.6H699.9V90.8H664.5V77.8H692.1V65.6H664.5V52.6H699.9ZM297 39.8L325.9 103.6H311.9L306.1 90.8H276.1L270.3 103.6H256.3L285.2 39.8H297ZM300.3 78.1L291.1 57.7L281.9 78.1H300.3ZM545.9 75.8C545.9 81.9 544.6 86.4 542.1 89.1C540.7 90.7 538 92.7 531.5 92.7C525 92.7 522.3 90.6 520.9 89.1C518.4 86.4 517.1 81.9 517.1 75.8V39.9H504.3V75.8C504.3 85.3 506.7 92.6 511.4 97.8C516.2 103 522.8 105.5 531.4 105.5C540 105.5 546.6 102.9 551.4 97.8C556.2 92.6 558.5 85.3 558.5 75.8V39.9H545.7V75.8H545.9ZM328.5 52.6H348.6V103.6H361.4V52.6H381.8V39.8H328.5V52.6ZM432.2 52.6H452.3V103.6H465.1V52.6H485.5V39.8H432.2V52.6ZM400.6 103.6H413.4V39.8H400.6V103.6Z"
+        fillRule="evenodd"
+      />
+    </svg>
+  );
+}
+
+LatitudeLogo.propTypes = {
+  color: PropTypes.oneOf(COLORS),
+  ...responsiveHeightType,
+  ...responsiveMaxWidthType,
+  testId: PropTypes.string,
+};
+
+export default LatitudeLogo;