@elliemae/ds-card-navigation 3.55.1 → 3.57.0-next.1

package/dist/types/parts/text-region/IconAndTextsRegion.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { DSCardNavigationT } from '../../react-desc-prop-types.js';
+interface IconAndTextsRegionProps {
+    title: DSCardNavigationT.InternalProps['title'];
+    description: DSCardNavigationT.InternalProps['description'];
+    wrapText: DSCardNavigationT.InternalProps['wrapText'];
+    type: DSCardNavigationT.InternalProps['type'];
+    Icon: DSCardNavigationT.InternalProps['Icon'];
+    showFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;
+    hideFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;
+    getOwnerProps?: () => object;
+    getOwnerPropsArguments?: () => object;
+}
+export declare const IconAndTextsRegion: React.ComponentType<IconAndTextsRegionProps>;
+export {};

package/dist/types/parts/text-region/IconAndTextsRegionContent.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { DSCardNavigationT } from '../../react-desc-prop-types.js';
+interface IconAndTextsRegionContentProps {
+    title: DSCardNavigationT.InternalProps['title'];
+    description: DSCardNavigationT.InternalProps['description'];
+    wrapText: DSCardNavigationT.InternalProps['wrapText'];
+    type: DSCardNavigationT.InternalProps['type'];
+    Icon: DSCardNavigationT.InternalProps['Icon'];
+    titleHandleRef: (node: HTMLElement | null) => void;
+    descriptionHandleRef: (node: HTMLElement | null) => void;
+    showFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;
+    hideFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;
+    getOwnerProps?: () => object;
+    getOwnerPropsArguments?: () => object;
+}
+export declare const IconAndTextsRegionContent: React.MemoExoticComponent<(props: IconAndTextsRegionContentProps) => import("react/jsx-runtime.js").JSX.Element>;
+export {};

package/dist/types/tests/tooltip-tests/DSCardNavigation.tooltip.wrapText.interdependecy.test.playwright.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/tests/tooltip-tests/DSCardNavigationTooltipTestRenderer.d.ts

@@ -0,0 +1 @@
+export const DSCardNavigationTooltipTestRenderer: import("react").FunctionComponent<import("react").JSX.IntrinsicAttributes>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-card-navigation",
-  "version": "3.55.1",
+  "version": "3.57.0-next.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Card Navigation",
   "files": [
@@ -37,22 +37,27 @@
   },
   "dependencies": {
     "@xstyled/styled-components": "~3.7.3",
-    "@elliemae/ds-grid": "3.55.1",
-    "@elliemae/ds-hooks-on-blur-out": "3.55.1",
-    "@elliemae/ds-hooks-on-overflow-change": "3.55.1",
-    "@elliemae/ds-system": "3.55.1",
-    "@elliemae/ds-icons": "3.55.1",
-    "@elliemae/ds-props-helpers": "3.55.1"
+    "uid": "^2.0.2",
+    "@elliemae/ds-button-v2": "3.57.0-next.1",
+    "@elliemae/ds-grid": "3.57.0-next.1",
+    "@elliemae/ds-hooks-on-blur-out": "3.57.0-next.1",
+    "@elliemae/ds-hooks-on-overflow-change": "3.57.0-next.1",
+    "@elliemae/ds-props-helpers": "3.57.0-next.1",
+    "@elliemae/ds-icons": "3.57.0-next.1",
+    "@elliemae/ds-system": "3.57.0-next.1",
+    "@elliemae/ds-tooltip-v3": "3.57.0-next.1",
+    "@elliemae/ds-typography": "3.57.0-next.1"
   },
   "devDependencies": {
     "@elliemae/pui-cli": "9.0.0-next.65",
     "@playwright/experimental-ct-react": "^1.51.1",
+    "@xstyled/system": "~3.7.3",
     "jest": "~29.7.0",
     "styled-components": "~5.3.9",
-    "@elliemae/ds-icons": "3.55.1",
-    "@elliemae/ds-monorepo-devops": "3.55.1",
-    "@elliemae/ds-test-utils": "3.55.1",
-    "@elliemae/ds-typescript-helpers": "3.55.1"
+    "@elliemae/ds-monorepo-devops": "3.57.0-next.1",
+    "@elliemae/ds-icons": "3.57.0-next.1",
+    "@elliemae/ds-test-utils": "3.57.0-next.1",
+    "@elliemae/ds-typescript-helpers": "3.57.0-next.1"
   },
   "peerDependencies": {
     "@testing-library/jest-dom": "^6.6.3",

package/dist/cjs/DescriptionComponent.js

@@ -1,79 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var DescriptionComponent_exports = {};
-__export(DescriptionComponent_exports, {
-  DescriptionComponent: () => DescriptionComponent
-});
-module.exports = __toCommonJS(DescriptionComponent_exports);
-var React = __toESM(require("react"));
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_ds_hooks_on_overflow_change = require("@elliemae/ds-hooks-on-overflow-change");
-var import_ds_tooltip_v3 = require("@elliemae/ds-tooltip-v3");
-var import_ds_typography = require("@elliemae/ds-typography");
-var import_react = require("react");
-var import_constants = require("./constants/index.js");
-var import_style = require("./style.js");
-const DescriptionComponent = (props) => {
-  const { description, wrapText } = props;
-  const [isDescriptionTruncating, setIsDescriptionTruncating] = (0, import_react.useState)(false);
-  const { handleRef: descriptionHandleRef } = (0, import_ds_hooks_on_overflow_change.useOnOverflowChange)({
-    onOverflowStateChange: setIsDescriptionTruncating
-  });
-  if (wrapText)
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationContentDescription, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_style.StyledDescriptionTypography,
-      {
-        innerRef: descriptionHandleRef,
-        truncateWithEllipsis: true,
-        variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1,
-        "data-testid": import_constants.CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
-        children: description
-      }
-    ) });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationContentDescription, { children: isDescriptionTruncating ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_tooltip_v3.DSTooltipV3, { text: description, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_style.StyledDescriptionTypography,
-    {
-      innerRef: descriptionHandleRef,
-      truncateWithEllipsis: true,
-      variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1,
-      "data-testid": import_constants.CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
-      children: description
-    }
-  ) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_style.StyledDescriptionTypography,
-    {
-      innerRef: descriptionHandleRef,
-      truncateWithEllipsis: true,
-      variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1,
-      "data-testid": import_constants.CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
-      children: description
-    }
-  ) });
-};
-//# sourceMappingURL=DescriptionComponent.js.map

package/dist/cjs/DescriptionComponent.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/DescriptionComponent.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useOnOverflowChange } from '@elliemae/ds-hooks-on-overflow-change';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip-v3';\nimport { TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport { useState } from 'react';\nimport { CARD_NAVIGATION_DATA_TESTID } from './constants/index.js';\nimport { StyledCardNavigationContentDescription, StyledDescriptionTypography } from './style.js';\n\nexport const DescriptionComponent = (props: { description: string; wrapText?: boolean }) => {\n  const { description, wrapText } = props;\n\n  const [isDescriptionTruncating, setIsDescriptionTruncating] = useState(false);\n\n  const { handleRef: descriptionHandleRef } = useOnOverflowChange({\n    onOverflowStateChange: setIsDescriptionTruncating,\n  });\n\n  if (wrapText)\n    return (\n      <StyledCardNavigationContentDescription>\n        <StyledDescriptionTypography\n          innerRef={descriptionHandleRef}\n          truncateWithEllipsis\n          variant={TYPOGRAPHY_VARIANTS.B1}\n          data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n        >\n          {description}\n        </StyledDescriptionTypography>\n      </StyledCardNavigationContentDescription>\n    );\n\n  return (\n    <StyledCardNavigationContentDescription>\n      {isDescriptionTruncating ? (\n        <DSTooltipV3 text={description}>\n          <StyledDescriptionTypography\n            innerRef={descriptionHandleRef}\n            truncateWithEllipsis\n            variant={TYPOGRAPHY_VARIANTS.B1}\n            data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n          >\n            {description}\n          </StyledDescriptionTypography>\n        </DSTooltipV3>\n      ) : (\n        <StyledDescriptionTypography\n          innerRef={descriptionHandleRef}\n          truncateWithEllipsis\n          variant={TYPOGRAPHY_VARIANTS.B1}\n          data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n        >\n          {description}\n        </StyledDescriptionTypography>\n      )}\n    </StyledCardNavigationContentDescription>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmBf;AAnBR,yCAAoC;AACpC,2BAA4B;AAC5B,2BAAoC;AACpC,mBAAyB;AACzB,uBAA4C;AAC5C,mBAAoF;AAE7E,MAAM,uBAAuB,CAAC,UAAuD;AAC1F,QAAM,EAAE,aAAa,SAAS,IAAI;AAElC,QAAM,CAAC,yBAAyB,0BAA0B,QAAI,uBAAS,KAAK;AAE5E,QAAM,EAAE,WAAW,qBAAqB,QAAI,wDAAoB;AAAA,IAC9D,uBAAuB;AAAA,EACzB,CAAC;AAED,MAAI;AACF,WACE,4CAAC,uDACC;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,sBAAoB;AAAA,QACpB,SAAS,yCAAoB;AAAA,QAC7B,eAAa,6CAA4B;AAAA,QAExC;AAAA;AAAA,IACH,GACF;AAGJ,SACE,4CAAC,uDACE,oCACC,4CAAC,oCAAY,MAAM,aACjB;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,sBAAoB;AAAA,MACpB,SAAS,yCAAoB;AAAA,MAC7B,eAAa,6CAA4B;AAAA,MAExC;AAAA;AAAA,EACH,GACF,IAEA;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,sBAAoB;AAAA,MACpB,SAAS,yCAAoB;AAAA,MAC7B,eAAa,6CAA4B;AAAA,MAExC;AAAA;AAAA,EACH,GAEJ;AAEJ;",
-  "names": []
-}

package/dist/cjs/TitleComponent.js

@@ -1,51 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var TitleComponent_exports = {};
-__export(TitleComponent_exports, {
-  TitleComponent: () => TitleComponent
-});
-module.exports = __toCommonJS(TitleComponent_exports);
-var React = __toESM(require("react"));
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_ds_hooks_on_overflow_change = require("@elliemae/ds-hooks-on-overflow-change");
-var import_ds_tooltip_v3 = require("@elliemae/ds-tooltip-v3");
-var import_ds_typography = require("@elliemae/ds-typography");
-var import_react = require("react");
-var import_style = require("./style.js");
-const TitleComponent = (props) => {
-  const { title, wrapText } = props;
-  const [isTitleTruncating, setIsTitleTruncating] = (0, import_react.useState)(false);
-  const { handleRef: titleHandleRef } = (0, import_ds_hooks_on_overflow_change.useOnOverflowChange)({
-    onOverflowStateChange: setIsTitleTruncating
-  });
-  if (wrapText)
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationContentTitle, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledTitleTypography, { innerRef: titleHandleRef, truncateWithEllipsis: true, variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1, children: title }) });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationContentTitle, { children: isTitleTruncating ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_tooltip_v3.DSTooltipV3, { text: title, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledTitleTypography, { innerRef: titleHandleRef, truncateWithEllipsis: true, variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1, children: title }) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledTitleTypography, { innerRef: titleHandleRef, truncateWithEllipsis: true, variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1, children: title }) });
-};
-//# sourceMappingURL=TitleComponent.js.map

package/dist/cjs/TitleComponent.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/TitleComponent.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useOnOverflowChange } from '@elliemae/ds-hooks-on-overflow-change';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip-v3';\nimport { TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport { useState } from 'react';\nimport { StyledCardNavigationContentTitle, StyledTitleTypography } from './style.js';\n\nexport const TitleComponent = (props: { title: string; wrapText?: boolean }) => {\n  const { title, wrapText } = props;\n\n  const [isTitleTruncating, setIsTitleTruncating] = useState(false);\n\n  const { handleRef: titleHandleRef } = useOnOverflowChange({\n    onOverflowStateChange: setIsTitleTruncating,\n  });\n\n  if (wrapText)\n    return (\n      <StyledCardNavigationContentTitle>\n        <StyledTitleTypography innerRef={titleHandleRef} truncateWithEllipsis variant={TYPOGRAPHY_VARIANTS.B1}>\n          {title}\n        </StyledTitleTypography>\n      </StyledCardNavigationContentTitle>\n    );\n\n  return (\n    <StyledCardNavigationContentTitle>\n      {isTitleTruncating ? (\n        <DSTooltipV3 text={title}>\n          <StyledTitleTypography innerRef={titleHandleRef} truncateWithEllipsis variant={TYPOGRAPHY_VARIANTS.B1}>\n            {title}\n          </StyledTitleTypography>\n        </DSTooltipV3>\n      ) : (\n        <StyledTitleTypography innerRef={titleHandleRef} truncateWithEllipsis variant={TYPOGRAPHY_VARIANTS.B1}>\n          {title}\n        </StyledTitleTypography>\n      )}\n    </StyledCardNavigationContentTitle>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBf;AAlBR,yCAAoC;AACpC,2BAA4B;AAC5B,2BAAoC;AACpC,mBAAyB;AACzB,mBAAwE;AAEjE,MAAM,iBAAiB,CAAC,UAAiD;AAC9E,QAAM,EAAE,OAAO,SAAS,IAAI;AAE5B,QAAM,CAAC,mBAAmB,oBAAoB,QAAI,uBAAS,KAAK;AAEhE,QAAM,EAAE,WAAW,eAAe,QAAI,wDAAoB;AAAA,IACxD,uBAAuB;AAAA,EACzB,CAAC;AAED,MAAI;AACF,WACE,4CAAC,iDACC,sDAAC,sCAAsB,UAAU,gBAAgB,sBAAoB,MAAC,SAAS,yCAAoB,IAChG,iBACH,GACF;AAGJ,SACE,4CAAC,iDACE,8BACC,4CAAC,oCAAY,MAAM,OACjB,sDAAC,sCAAsB,UAAU,gBAAgB,sBAAoB,MAAC,SAAS,yCAAoB,IAChG,iBACH,GACF,IAEA,4CAAC,sCAAsB,UAAU,gBAAgB,sBAAoB,MAAC,SAAS,yCAAoB,IAChG,iBACH,GAEJ;AAEJ;",
-  "names": []
-}

package/dist/cjs/style.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/style.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { DSTypography } from '@elliemae/ds-typography';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCardNavigationName, CARD_NAVIGATION_SLOTS, CardNavigationTypes } from './constants/index.js';\n\nexport const StyledCardNavigationContentTitle = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.TITLE,\n})`\n  padding-top: ${(props) => props.theme.space.xxs};\n`;\n\nexport const StyledTitleTypography = styled(DSTypography)`\n  color: ${(props) => props.theme.colors.neutral['700']};\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  font-size: 18px;\n`;\n\nexport const StyledCardNavigationContentDescription = styled.div``;\n\nexport const StyledDescriptionTypography = styled(DSTypography)`\n  color: ${(props) => props.theme.colors.neutral['500']};\n  font-size: 12px;\n`;\n\nexport const StyledCardNavigationContentTitleWrapper = styled.div`\n  width: 100%;\n`;\n\nexport const StyledCardNavigationContent = styled.div<{ wrapText?: boolean }>`\n  padding-right: ${(props) => props.theme.space.xs};\n  padding-left: ${(props) => props.theme.space.xs};\n  display: flex;\n  align-items: center;\n  flex: 1;\n  width: 100%;\n`;\n\nexport const StyledCardNavigationCentralContent = styled(Grid, {\n  slot: CARD_NAVIGATION_SLOTS.CENTRAL_CONTENT,\n  name: DSCardNavigationName,\n})`\n  min-width: 273px;\n  @media (max-width: ${(props) => props.theme.breakpoints.small}) {\n    min-width: 336px;\n  }\n`;\ninterface StyledCardNavigationBoxWrapperProps {\n  fluid?: boolean;\n}\n\nexport const StyledCardNavigationBoxWrapper = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.ROOT,\n})<StyledCardNavigationBoxWrapperProps>`\n  width: 337px;\n  display: flex;\n  flex-direction: row;\n  flex-wrap: nowrap;\n  box-shadow: 0 1px 4px 0px rgba(37, 41, 47, 0.5);\n  border-radius: 2px;\n  position: relative;\n  outline: none;\n  ${(props) => (props.fluid ? 'width: 100%' : '')};\n  @media (max-width: ${(props) => props.theme.breakpoints.small}) {\n    width: ${(props) => (props.fluid ? 'width: 100%' : '414px')};\n  }\n  :after {\n    display: block;\n    content: '';\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    top: 0;\n    left: 0;\n    border: solid ${(props) => props.theme.space.xxs} transparent;\n    border-radius: 2px;\n    pointer-events: none;\n  }\n  &:hover,\n  &:focus {\n    box-shadow: 0 3px 8px 0px rgba(37, 41, 47, 0.4);\n  }\n`;\ninterface StyledCardNavigationIconProps {\n  $type: (typeof CardNavigationTypes)[keyof typeof CardNavigationTypes];\n}\n\nexport const StyledCardNavigationIcon = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.TYPE,\n})<StyledCardNavigationIconProps>`\n  width: 64px;\n  height: 64px;\n  background-color: #32aad1;\n  border-top-left-radius: 2px;\n  border-bottom-left-radius: 2px;\n  padding: ${(props) => props.theme.space.xxs};\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  fill: #ffffff;\n  background-color: ${({ $type }) =>\n    ($type === CardNavigationTypes.BORROWER && '#32aad1') ||\n    ($type === CardNavigationTypes.FINANCIAL && '#1ba88d') ||\n    ($type === CardNavigationTypes.LOAN && '#8e49b2') ||\n    ($type === CardNavigationTypes.REGULATORY && '#db5575') ||\n    '#32aad1'}; // Default color\n`;\n\nexport const StyledCardNavigationActions = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.ACTIONS,\n})`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding-right: ${(props) => props.theme.space.xxs};\n`;\n\nexport const StyledCardNavigationAction = styled.div`\n  margin-left: ${(props) => props.theme.space.xxs};\n  span {\n    height: ${(props) => props.theme.space.s};\n    width: ${(props) => props.theme.space.s};\n    svg {\n      fill: ${(props) => props.theme.colors.neutral[500]};\n      height: ${(props) => props.theme.space.s};\n      width: ${(props) => props.theme.space.s};\n    }\n  }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,2BAA6B;AAC7B,uBAAuB;AACvB,qBAAqB;AACrB,uBAAiF;AAE1E,MAAM,uCAAmC,yBAAO,OAAO;AAAA,EAC5D,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA,iBACgB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAG1C,MAAM,4BAAwB,yBAAO,iCAAY;AAAA,WAC7C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBACtC,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA;AAAA;AAIrD,MAAM,yCAAyC,wBAAO;AAEtD,MAAM,kCAA8B,yBAAO,iCAAY;AAAA,WACnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAIhD,MAAM,0CAA0C,wBAAO;AAAA;AAAA;AAIvD,MAAM,8BAA8B,wBAAO;AAAA,mBAC/B,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA,kBAChC,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAO1C,MAAM,yCAAqC,yBAAO,qBAAM;AAAA,EAC7D,MAAM,uCAAsB;AAAA,EAC5B,MAAM;AACR,CAAC;AAAA;AAAA,uBAEsB,CAAC,UAAU,MAAM,MAAM,YAAY,KAAK;AAAA;AAAA;AAAA;AAQxD,MAAM,qCAAiC,yBAAO,OAAO;AAAA,EAC1D,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASG,CAAC,UAAW,MAAM,QAAQ,gBAAgB,EAAG;AAAA,uBAC1B,CAAC,UAAU,MAAM,MAAM,YAAY,KAAK;AAAA,aAClD,CAAC,UAAW,MAAM,QAAQ,gBAAgB,OAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAU3C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAa7C,MAAM,+BAA2B,yBAAO,OAAO;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMY,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,sBAKvB,CAAC,EAAE,MAAM,MAC1B,UAAU,qCAAoB,YAAY,aAC1C,UAAU,qCAAoB,aAAa,aAC3C,UAAU,qCAAoB,QAAQ,aACtC,UAAU,qCAAoB,cAAc,aAC7C,SAAS;AAAA;AAGN,MAAM,kCAA8B,yBAAO,OAAO;AAAA,EACvD,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA,mBAIkB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAG5C,MAAM,6BAA6B,wBAAO;AAAA,iBAChC,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA,cAEnC,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA,aAC/B,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA,cAE7B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,gBACxC,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA,eAC/B,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/esm/DescriptionComponent.js

@@ -1,49 +0,0 @@
-import * as React from "react";
-import { jsx } from "react/jsx-runtime";
-import { useOnOverflowChange } from "@elliemae/ds-hooks-on-overflow-change";
-import { DSTooltipV3 } from "@elliemae/ds-tooltip-v3";
-import { TYPOGRAPHY_VARIANTS } from "@elliemae/ds-typography";
-import { useState } from "react";
-import { CARD_NAVIGATION_DATA_TESTID } from "./constants/index.js";
-import { StyledCardNavigationContentDescription, StyledDescriptionTypography } from "./style.js";
-const DescriptionComponent = (props) => {
-  const { description, wrapText } = props;
-  const [isDescriptionTruncating, setIsDescriptionTruncating] = useState(false);
-  const { handleRef: descriptionHandleRef } = useOnOverflowChange({
-    onOverflowStateChange: setIsDescriptionTruncating
-  });
-  if (wrapText)
-    return /* @__PURE__ */ jsx(StyledCardNavigationContentDescription, { children: /* @__PURE__ */ jsx(
-      StyledDescriptionTypography,
-      {
-        innerRef: descriptionHandleRef,
-        truncateWithEllipsis: true,
-        variant: TYPOGRAPHY_VARIANTS.B1,
-        "data-testid": CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
-        children: description
-      }
-    ) });
-  return /* @__PURE__ */ jsx(StyledCardNavigationContentDescription, { children: isDescriptionTruncating ? /* @__PURE__ */ jsx(DSTooltipV3, { text: description, children: /* @__PURE__ */ jsx(
-    StyledDescriptionTypography,
-    {
-      innerRef: descriptionHandleRef,
-      truncateWithEllipsis: true,
-      variant: TYPOGRAPHY_VARIANTS.B1,
-      "data-testid": CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
-      children: description
-    }
-  ) }) : /* @__PURE__ */ jsx(
-    StyledDescriptionTypography,
-    {
-      innerRef: descriptionHandleRef,
-      truncateWithEllipsis: true,
-      variant: TYPOGRAPHY_VARIANTS.B1,
-      "data-testid": CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
-      children: description
-    }
-  ) });
-};
-export {
-  DescriptionComponent
-};
-//# sourceMappingURL=DescriptionComponent.js.map

package/dist/esm/DescriptionComponent.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DescriptionComponent.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useOnOverflowChange } from '@elliemae/ds-hooks-on-overflow-change';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip-v3';\nimport { TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport { useState } from 'react';\nimport { CARD_NAVIGATION_DATA_TESTID } from './constants/index.js';\nimport { StyledCardNavigationContentDescription, StyledDescriptionTypography } from './style.js';\n\nexport const DescriptionComponent = (props: { description: string; wrapText?: boolean }) => {\n  const { description, wrapText } = props;\n\n  const [isDescriptionTruncating, setIsDescriptionTruncating] = useState(false);\n\n  const { handleRef: descriptionHandleRef } = useOnOverflowChange({\n    onOverflowStateChange: setIsDescriptionTruncating,\n  });\n\n  if (wrapText)\n    return (\n      <StyledCardNavigationContentDescription>\n        <StyledDescriptionTypography\n          innerRef={descriptionHandleRef}\n          truncateWithEllipsis\n          variant={TYPOGRAPHY_VARIANTS.B1}\n          data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n        >\n          {description}\n        </StyledDescriptionTypography>\n      </StyledCardNavigationContentDescription>\n    );\n\n  return (\n    <StyledCardNavigationContentDescription>\n      {isDescriptionTruncating ? (\n        <DSTooltipV3 text={description}>\n          <StyledDescriptionTypography\n            innerRef={descriptionHandleRef}\n            truncateWithEllipsis\n            variant={TYPOGRAPHY_VARIANTS.B1}\n            data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n          >\n            {description}\n          </StyledDescriptionTypography>\n        </DSTooltipV3>\n      ) : (\n        <StyledDescriptionTypography\n          innerRef={descriptionHandleRef}\n          truncateWithEllipsis\n          variant={TYPOGRAPHY_VARIANTS.B1}\n          data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n        >\n          {description}\n        </StyledDescriptionTypography>\n      )}\n    </StyledCardNavigationContentDescription>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACmBf;AAnBR,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAC5B,SAAS,2BAA2B;AACpC,SAAS,gBAAgB;AACzB,SAAS,mCAAmC;AAC5C,SAAS,wCAAwC,mCAAmC;AAE7E,MAAM,uBAAuB,CAAC,UAAuD;AAC1F,QAAM,EAAE,aAAa,SAAS,IAAI;AAElC,QAAM,CAAC,yBAAyB,0BAA0B,IAAI,SAAS,KAAK;AAE5E,QAAM,EAAE,WAAW,qBAAqB,IAAI,oBAAoB;AAAA,IAC9D,uBAAuB;AAAA,EACzB,CAAC;AAED,MAAI;AACF,WACE,oBAAC,0CACC;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,sBAAoB;AAAA,QACpB,SAAS,oBAAoB;AAAA,QAC7B,eAAa,4BAA4B;AAAA,QAExC;AAAA;AAAA,IACH,GACF;AAGJ,SACE,oBAAC,0CACE,oCACC,oBAAC,eAAY,MAAM,aACjB;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,sBAAoB;AAAA,MACpB,SAAS,oBAAoB;AAAA,MAC7B,eAAa,4BAA4B;AAAA,MAExC;AAAA;AAAA,EACH,GACF,IAEA;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,sBAAoB;AAAA,MACpB,SAAS,oBAAoB;AAAA,MAC7B,eAAa,4BAA4B;AAAA,MAExC;AAAA;AAAA,EACH,GAEJ;AAEJ;",
-  "names": []
-}

package/dist/esm/TitleComponent.js

@@ -1,21 +0,0 @@
-import * as React from "react";
-import { jsx } from "react/jsx-runtime";
-import { useOnOverflowChange } from "@elliemae/ds-hooks-on-overflow-change";
-import { DSTooltipV3 } from "@elliemae/ds-tooltip-v3";
-import { TYPOGRAPHY_VARIANTS } from "@elliemae/ds-typography";
-import { useState } from "react";
-import { StyledCardNavigationContentTitle, StyledTitleTypography } from "./style.js";
-const TitleComponent = (props) => {
-  const { title, wrapText } = props;
-  const [isTitleTruncating, setIsTitleTruncating] = useState(false);
-  const { handleRef: titleHandleRef } = useOnOverflowChange({
-    onOverflowStateChange: setIsTitleTruncating
-  });
-  if (wrapText)
-    return /* @__PURE__ */ jsx(StyledCardNavigationContentTitle, { children: /* @__PURE__ */ jsx(StyledTitleTypography, { innerRef: titleHandleRef, truncateWithEllipsis: true, variant: TYPOGRAPHY_VARIANTS.B1, children: title }) });
-  return /* @__PURE__ */ jsx(StyledCardNavigationContentTitle, { children: isTitleTruncating ? /* @__PURE__ */ jsx(DSTooltipV3, { text: title, children: /* @__PURE__ */ jsx(StyledTitleTypography, { innerRef: titleHandleRef, truncateWithEllipsis: true, variant: TYPOGRAPHY_VARIANTS.B1, children: title }) }) : /* @__PURE__ */ jsx(StyledTitleTypography, { innerRef: titleHandleRef, truncateWithEllipsis: true, variant: TYPOGRAPHY_VARIANTS.B1, children: title }) });
-};
-export {
-  TitleComponent
-};
-//# sourceMappingURL=TitleComponent.js.map

package/dist/esm/TitleComponent.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/TitleComponent.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useOnOverflowChange } from '@elliemae/ds-hooks-on-overflow-change';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip-v3';\nimport { TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport { useState } from 'react';\nimport { StyledCardNavigationContentTitle, StyledTitleTypography } from './style.js';\n\nexport const TitleComponent = (props: { title: string; wrapText?: boolean }) => {\n  const { title, wrapText } = props;\n\n  const [isTitleTruncating, setIsTitleTruncating] = useState(false);\n\n  const { handleRef: titleHandleRef } = useOnOverflowChange({\n    onOverflowStateChange: setIsTitleTruncating,\n  });\n\n  if (wrapText)\n    return (\n      <StyledCardNavigationContentTitle>\n        <StyledTitleTypography innerRef={titleHandleRef} truncateWithEllipsis variant={TYPOGRAPHY_VARIANTS.B1}>\n          {title}\n        </StyledTitleTypography>\n      </StyledCardNavigationContentTitle>\n    );\n\n  return (\n    <StyledCardNavigationContentTitle>\n      {isTitleTruncating ? (\n        <DSTooltipV3 text={title}>\n          <StyledTitleTypography innerRef={titleHandleRef} truncateWithEllipsis variant={TYPOGRAPHY_VARIANTS.B1}>\n            {title}\n          </StyledTitleTypography>\n        </DSTooltipV3>\n      ) : (\n        <StyledTitleTypography innerRef={titleHandleRef} truncateWithEllipsis variant={TYPOGRAPHY_VARIANTS.B1}>\n          {title}\n        </StyledTitleTypography>\n      )}\n    </StyledCardNavigationContentTitle>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACkBf;AAlBR,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAC5B,SAAS,2BAA2B;AACpC,SAAS,gBAAgB;AACzB,SAAS,kCAAkC,6BAA6B;AAEjE,MAAM,iBAAiB,CAAC,UAAiD;AAC9E,QAAM,EAAE,OAAO,SAAS,IAAI;AAE5B,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,KAAK;AAEhE,QAAM,EAAE,WAAW,eAAe,IAAI,oBAAoB;AAAA,IACxD,uBAAuB;AAAA,EACzB,CAAC;AAED,MAAI;AACF,WACE,oBAAC,oCACC,8BAAC,yBAAsB,UAAU,gBAAgB,sBAAoB,MAAC,SAAS,oBAAoB,IAChG,iBACH,GACF;AAGJ,SACE,oBAAC,oCACE,8BACC,oBAAC,eAAY,MAAM,OACjB,8BAAC,yBAAsB,UAAU,gBAAgB,sBAAoB,MAAC,SAAS,oBAAoB,IAChG,iBACH,GACF,IAEA,oBAAC,yBAAsB,UAAU,gBAAgB,sBAAoB,MAAC,SAAS,oBAAoB,IAChG,iBACH,GAEJ;AAEJ;",
-  "names": []
-}

package/dist/esm/style.js

@@ -1,125 +0,0 @@
-import * as React from "react";
-import { DSTypography } from "@elliemae/ds-typography";
-import { styled } from "@elliemae/ds-system";
-import { Grid } from "@elliemae/ds-grid";
-import { DSCardNavigationName, CARD_NAVIGATION_SLOTS, CardNavigationTypes } from "./constants/index.js";
-const StyledCardNavigationContentTitle = styled("div", {
-  name: DSCardNavigationName,
-  slot: CARD_NAVIGATION_SLOTS.TITLE
-})`
-  padding-top: ${(props) => props.theme.space.xxs};
-`;
-const StyledTitleTypography = styled(DSTypography)`
-  color: ${(props) => props.theme.colors.neutral["700"]};
-  font-weight: ${(props) => props.theme.fontWeights.semibold};
-  font-size: 18px;
-`;
-const StyledCardNavigationContentDescription = styled.div``;
-const StyledDescriptionTypography = styled(DSTypography)`
-  color: ${(props) => props.theme.colors.neutral["500"]};
-  font-size: 12px;
-`;
-const StyledCardNavigationContentTitleWrapper = styled.div`
-  width: 100%;
-`;
-const StyledCardNavigationContent = styled.div`
-  padding-right: ${(props) => props.theme.space.xs};
-  padding-left: ${(props) => props.theme.space.xs};
-  display: flex;
-  align-items: center;
-  flex: 1;
-  width: 100%;
-`;
-const StyledCardNavigationCentralContent = styled(Grid, {
-  slot: CARD_NAVIGATION_SLOTS.CENTRAL_CONTENT,
-  name: DSCardNavigationName
-})`
-  min-width: 273px;
-  @media (max-width: ${(props) => props.theme.breakpoints.small}) {
-    min-width: 336px;
-  }
-`;
-const StyledCardNavigationBoxWrapper = styled("div", {
-  name: DSCardNavigationName,
-  slot: CARD_NAVIGATION_SLOTS.ROOT
-})`
-  width: 337px;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: nowrap;
-  box-shadow: 0 1px 4px 0px rgba(37, 41, 47, 0.5);
-  border-radius: 2px;
-  position: relative;
-  outline: none;
-  ${(props) => props.fluid ? "width: 100%" : ""};
-  @media (max-width: ${(props) => props.theme.breakpoints.small}) {
-    width: ${(props) => props.fluid ? "width: 100%" : "414px"};
-  }
-  :after {
-    display: block;
-    content: '';
-    position: absolute;
-    height: 100%;
-    width: 100%;
-    top: 0;
-    left: 0;
-    border: solid ${(props) => props.theme.space.xxs} transparent;
-    border-radius: 2px;
-    pointer-events: none;
-  }
-  &:hover,
-  &:focus {
-    box-shadow: 0 3px 8px 0px rgba(37, 41, 47, 0.4);
-  }
-`;
-const StyledCardNavigationIcon = styled("div", {
-  name: DSCardNavigationName,
-  slot: CARD_NAVIGATION_SLOTS.TYPE
-})`
-  width: 64px;
-  height: 64px;
-  background-color: #32aad1;
-  border-top-left-radius: 2px;
-  border-bottom-left-radius: 2px;
-  padding: ${(props) => props.theme.space.xxs};
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  fill: #ffffff;
-  background-color: ${({ $type }) => $type === CardNavigationTypes.BORROWER && "#32aad1" || $type === CardNavigationTypes.FINANCIAL && "#1ba88d" || $type === CardNavigationTypes.LOAN && "#8e49b2" || $type === CardNavigationTypes.REGULATORY && "#db5575" || "#32aad1"}; // Default color
-`;
-const StyledCardNavigationActions = styled("div", {
-  name: DSCardNavigationName,
-  slot: CARD_NAVIGATION_SLOTS.ACTIONS
-})`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  padding-right: ${(props) => props.theme.space.xxs};
-`;
-const StyledCardNavigationAction = styled.div`
-  margin-left: ${(props) => props.theme.space.xxs};
-  span {
-    height: ${(props) => props.theme.space.s};
-    width: ${(props) => props.theme.space.s};
-    svg {
-      fill: ${(props) => props.theme.colors.neutral[500]};
-      height: ${(props) => props.theme.space.s};
-      width: ${(props) => props.theme.space.s};
-    }
-  }
-`;
-export {
-  StyledCardNavigationAction,
-  StyledCardNavigationActions,
-  StyledCardNavigationBoxWrapper,
-  StyledCardNavigationCentralContent,
-  StyledCardNavigationContent,
-  StyledCardNavigationContentDescription,
-  StyledCardNavigationContentTitle,
-  StyledCardNavigationContentTitleWrapper,
-  StyledCardNavigationIcon,
-  StyledDescriptionTypography,
-  StyledTitleTypography
-};
-//# sourceMappingURL=style.js.map

package/dist/esm/style.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/style.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSTypography } from '@elliemae/ds-typography';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCardNavigationName, CARD_NAVIGATION_SLOTS, CardNavigationTypes } from './constants/index.js';\n\nexport const StyledCardNavigationContentTitle = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.TITLE,\n})`\n  padding-top: ${(props) => props.theme.space.xxs};\n`;\n\nexport const StyledTitleTypography = styled(DSTypography)`\n  color: ${(props) => props.theme.colors.neutral['700']};\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  font-size: 18px;\n`;\n\nexport const StyledCardNavigationContentDescription = styled.div``;\n\nexport const StyledDescriptionTypography = styled(DSTypography)`\n  color: ${(props) => props.theme.colors.neutral['500']};\n  font-size: 12px;\n`;\n\nexport const StyledCardNavigationContentTitleWrapper = styled.div`\n  width: 100%;\n`;\n\nexport const StyledCardNavigationContent = styled.div<{ wrapText?: boolean }>`\n  padding-right: ${(props) => props.theme.space.xs};\n  padding-left: ${(props) => props.theme.space.xs};\n  display: flex;\n  align-items: center;\n  flex: 1;\n  width: 100%;\n`;\n\nexport const StyledCardNavigationCentralContent = styled(Grid, {\n  slot: CARD_NAVIGATION_SLOTS.CENTRAL_CONTENT,\n  name: DSCardNavigationName,\n})`\n  min-width: 273px;\n  @media (max-width: ${(props) => props.theme.breakpoints.small}) {\n    min-width: 336px;\n  }\n`;\ninterface StyledCardNavigationBoxWrapperProps {\n  fluid?: boolean;\n}\n\nexport const StyledCardNavigationBoxWrapper = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.ROOT,\n})<StyledCardNavigationBoxWrapperProps>`\n  width: 337px;\n  display: flex;\n  flex-direction: row;\n  flex-wrap: nowrap;\n  box-shadow: 0 1px 4px 0px rgba(37, 41, 47, 0.5);\n  border-radius: 2px;\n  position: relative;\n  outline: none;\n  ${(props) => (props.fluid ? 'width: 100%' : '')};\n  @media (max-width: ${(props) => props.theme.breakpoints.small}) {\n    width: ${(props) => (props.fluid ? 'width: 100%' : '414px')};\n  }\n  :after {\n    display: block;\n    content: '';\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    top: 0;\n    left: 0;\n    border: solid ${(props) => props.theme.space.xxs} transparent;\n    border-radius: 2px;\n    pointer-events: none;\n  }\n  &:hover,\n  &:focus {\n    box-shadow: 0 3px 8px 0px rgba(37, 41, 47, 0.4);\n  }\n`;\ninterface StyledCardNavigationIconProps {\n  $type: (typeof CardNavigationTypes)[keyof typeof CardNavigationTypes];\n}\n\nexport const StyledCardNavigationIcon = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.TYPE,\n})<StyledCardNavigationIconProps>`\n  width: 64px;\n  height: 64px;\n  background-color: #32aad1;\n  border-top-left-radius: 2px;\n  border-bottom-left-radius: 2px;\n  padding: ${(props) => props.theme.space.xxs};\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  fill: #ffffff;\n  background-color: ${({ $type }) =>\n    ($type === CardNavigationTypes.BORROWER && '#32aad1') ||\n    ($type === CardNavigationTypes.FINANCIAL && '#1ba88d') ||\n    ($type === CardNavigationTypes.LOAN && '#8e49b2') ||\n    ($type === CardNavigationTypes.REGULATORY && '#db5575') ||\n    '#32aad1'}; // Default color\n`;\n\nexport const StyledCardNavigationActions = styled('div', {\n  name: DSCardNavigationName,\n  slot: CARD_NAVIGATION_SLOTS.ACTIONS,\n})`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding-right: ${(props) => props.theme.space.xxs};\n`;\n\nexport const StyledCardNavigationAction = styled.div`\n  margin-left: ${(props) => props.theme.space.xxs};\n  span {\n    height: ${(props) => props.theme.space.s};\n    width: ${(props) => props.theme.space.s};\n    svg {\n      fill: ${(props) => props.theme.colors.neutral[500]};\n      height: ${(props) => props.theme.space.s};\n      width: ${(props) => props.theme.space.s};\n    }\n  }\n`;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,oBAAoB;AAC7B,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,sBAAsB,uBAAuB,2BAA2B;AAE1E,MAAM,mCAAmC,OAAO,OAAO;AAAA,EAC5D,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA,iBACgB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAG1C,MAAM,wBAAwB,OAAO,YAAY;AAAA,WAC7C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBACtC,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA;AAAA;AAIrD,MAAM,yCAAyC,OAAO;AAEtD,MAAM,8BAA8B,OAAO,YAAY;AAAA,WACnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAIhD,MAAM,0CAA0C,OAAO;AAAA;AAAA;AAIvD,MAAM,8BAA8B,OAAO;AAAA,mBAC/B,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA,kBAChC,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAO1C,MAAM,qCAAqC,OAAO,MAAM;AAAA,EAC7D,MAAM,sBAAsB;AAAA,EAC5B,MAAM;AACR,CAAC;AAAA;AAAA,uBAEsB,CAAC,UAAU,MAAM,MAAM,YAAY,KAAK;AAAA;AAAA;AAAA;AAQxD,MAAM,iCAAiC,OAAO,OAAO;AAAA,EAC1D,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASG,CAAC,UAAW,MAAM,QAAQ,gBAAgB,EAAG;AAAA,uBAC1B,CAAC,UAAU,MAAM,MAAM,YAAY,KAAK;AAAA,aAClD,CAAC,UAAW,MAAM,QAAQ,gBAAgB,OAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAU3C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAa7C,MAAM,2BAA2B,OAAO,OAAO;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMY,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,sBAKvB,CAAC,EAAE,MAAM,MAC1B,UAAU,oBAAoB,YAAY,aAC1C,UAAU,oBAAoB,aAAa,aAC3C,UAAU,oBAAoB,QAAQ,aACtC,UAAU,oBAAoB,cAAc,aAC7C,SAAS;AAAA;AAGN,MAAM,8BAA8B,OAAO,OAAO;AAAA,EACvD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA,mBAIkB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAG5C,MAAM,6BAA6B,OAAO;AAAA,iBAChC,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA,cAEnC,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA,aAC/B,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA,cAE7B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,gBACxC,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA,eAC/B,CAAC,UAAU,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/types/DescriptionComponent.d.ts

@@ -1,4 +0,0 @@
-export declare const DescriptionComponent: (props: {
-    description: string;
-    wrapText?: boolean;
-}) => import("react/jsx-runtime.js").JSX.Element;

package/dist/types/TitleComponent.d.ts

@@ -1,4 +0,0 @@
-export declare const TitleComponent: (props: {
-    title: string;
-    wrapText?: boolean;
-}) => import("react/jsx-runtime.js").JSX.Element;

package/dist/types/tests/overflow/DSCardNavigationOverflowTestRenderer.d.ts

@@ -1,2 +0,0 @@
-export const DSCardNavigationOverflowTestRenderer: React.FunctionComponent<React.JSX.IntrinsicAttributes>;
-import React from 'react';

package/dist/types/tests/wraptext/DSCardNavigationWrapTextTestRenderer.d.ts

@@ -1,2 +0,0 @@
-export const DSCardNavigationWraptextTestRenderer: React.FunctionComponent<React.JSX.IntrinsicAttributes>;
-import React from 'react';