@elliemae/ds-card-navigation 3.55.0-next.9 → 3.55.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/dist/cjs/DSCardNavigation.js +40 -41
  2. package/dist/cjs/DSCardNavigation.js.map +2 -2
  3. package/dist/cjs/DescriptionComponent.js +79 -0
  4. package/dist/cjs/DescriptionComponent.js.map +7 -0
  5. package/dist/cjs/TitleComponent.js +51 -0
  6. package/dist/cjs/TitleComponent.js.map +7 -0
  7. package/dist/cjs/config/useCardNavigation.js +4 -19
  8. package/dist/cjs/config/useCardNavigation.js.map +2 -2
  9. package/dist/cjs/react-desc-prop-types.js +3 -3
  10. package/dist/cjs/react-desc-prop-types.js.map +2 -2
  11. package/dist/cjs/{parts/style.js → style.js} +34 -51
  12. package/dist/cjs/style.js.map +7 -0
  13. package/dist/esm/DSCardNavigation.js +49 -42
  14. package/dist/esm/DSCardNavigation.js.map +2 -2
  15. package/dist/esm/DescriptionComponent.js +49 -0
  16. package/dist/esm/DescriptionComponent.js.map +7 -0
  17. package/dist/esm/TitleComponent.js +21 -0
  18. package/dist/esm/TitleComponent.js.map +7 -0
  19. package/dist/esm/config/useCardNavigation.js +5 -20
  20. package/dist/esm/config/useCardNavigation.js.map +2 -2
  21. package/dist/esm/react-desc-prop-types.js +3 -3
  22. package/dist/esm/react-desc-prop-types.js.map +2 -2
  23. package/dist/esm/{parts/style.js → style.js} +34 -51
  24. package/dist/esm/style.js.map +7 -0
  25. package/dist/types/DSCardNavigation.d.ts +1 -1
  26. package/dist/types/DescriptionComponent.d.ts +4 -0
  27. package/dist/types/TitleComponent.d.ts +4 -0
  28. package/dist/types/config/useCardNavigation.d.ts +6 -7
  29. package/dist/types/{parts/style.d.ts → style.d.ts} +4 -9
  30. package/dist/types/tests/overflow/DSCardNavigationOverflowTestRenderer.d.ts +2 -0
  31. package/dist/types/tests/wraptext/DSCardNavigationWrapTextTestRenderer.d.ts +2 -0
  32. package/package.json +11 -11
  33. package/dist/cjs/parts/ActionsRegion.js +0 -63
  34. package/dist/cjs/parts/ActionsRegion.js.map +0 -7
  35. package/dist/cjs/parts/style.js.map +0 -7
  36. package/dist/cjs/parts/text-region/IconAndTextsRegion.js +0 -101
  37. package/dist/cjs/parts/text-region/IconAndTextsRegion.js.map +0 -7
  38. package/dist/cjs/parts/text-region/IconAndTextsRegionContent.js +0 -88
  39. package/dist/cjs/parts/text-region/IconAndTextsRegionContent.js.map +0 -7
  40. package/dist/esm/parts/ActionsRegion.js +0 -33
  41. package/dist/esm/parts/ActionsRegion.js.map +0 -7
  42. package/dist/esm/parts/style.js.map +0 -7
  43. package/dist/esm/parts/text-region/IconAndTextsRegion.js +0 -71
  44. package/dist/esm/parts/text-region/IconAndTextsRegion.js.map +0 -7
  45. package/dist/esm/parts/text-region/IconAndTextsRegionContent.js +0 -67
  46. package/dist/esm/parts/text-region/IconAndTextsRegionContent.js.map +0 -7
  47. package/dist/types/parts/ActionsRegion.d.ts +0 -8
  48. package/dist/types/parts/text-region/IconAndTextsRegion.d.ts +0 -13
  49. package/dist/types/parts/text-region/IconAndTextsRegionContent.d.ts +0 -15
  50. package/dist/types/tests/tooltip-tests/DSCardNavigation.tooltip.wrapText.interdependecy.test.playwright.d.ts +0 -1
  51. package/dist/types/tests/tooltip-tests/DSCardNavigationTooltipTestRenderer.d.ts +0 -1
  52. /package/dist/types/tests/{tooltip-tests/DSCardNavigation.tooltip.hover.test.playwright.d.ts → overflow/DSCardNavigation.overflow.test.playwright.d.ts} +0 -0
  53. /package/dist/types/tests/{tooltip-tests/DSCardNavigation.tooltip.keyboard.test.playwright.d.ts → wraptext/DSCardNavigation.wrapText.test.playwright.d.ts} +0 -0
@@ -0,0 +1,2 @@
1
+ export const DSCardNavigationOverflowTestRenderer: React.FunctionComponent<React.JSX.IntrinsicAttributes>;
2
+ import React from 'react';
@@ -0,0 +1,2 @@
1
+ export const DSCardNavigationWraptextTestRenderer: React.FunctionComponent<React.JSX.IntrinsicAttributes>;
2
+ import React from 'react';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-card-navigation",
3
- "version": "3.55.0-next.9",
3
+ "version": "3.55.2",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Card Navigation",
6
6
  "files": [
@@ -37,22 +37,22 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@xstyled/styled-components": "~3.7.3",
40
- "@elliemae/ds-grid": "3.55.0-next.9",
41
- "@elliemae/ds-hooks-on-blur-out": "3.55.0-next.9",
42
- "@elliemae/ds-hooks-on-overflow-change": "3.55.0-next.9",
43
- "@elliemae/ds-props-helpers": "3.55.0-next.9",
44
- "@elliemae/ds-system": "3.55.0-next.9",
45
- "@elliemae/ds-icons": "3.55.0-next.9"
40
+ "@elliemae/ds-grid": "3.55.2",
41
+ "@elliemae/ds-hooks-on-blur-out": "3.55.2",
42
+ "@elliemae/ds-hooks-on-overflow-change": "3.55.2",
43
+ "@elliemae/ds-props-helpers": "3.55.2",
44
+ "@elliemae/ds-system": "3.55.2",
45
+ "@elliemae/ds-icons": "3.55.2"
46
46
  },
47
47
  "devDependencies": {
48
48
  "@elliemae/pui-cli": "9.0.0-next.65",
49
49
  "@playwright/experimental-ct-react": "^1.51.1",
50
50
  "jest": "~29.7.0",
51
51
  "styled-components": "~5.3.9",
52
- "@elliemae/ds-typescript-helpers": "3.55.0-next.9",
53
- "@elliemae/ds-icons": "3.55.0-next.9",
54
- "@elliemae/ds-test-utils": "3.55.0-next.9",
55
- "@elliemae/ds-monorepo-devops": "3.55.0-next.9"
52
+ "@elliemae/ds-monorepo-devops": "3.55.2",
53
+ "@elliemae/ds-test-utils": "3.55.2",
54
+ "@elliemae/ds-icons": "3.55.2",
55
+ "@elliemae/ds-typescript-helpers": "3.55.2"
56
56
  },
57
57
  "peerDependencies": {
58
58
  "@testing-library/jest-dom": "^6.6.3",
@@ -1,63 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var ActionsRegion_exports = {};
30
- __export(ActionsRegion_exports, {
31
- ActionsRegion: () => ActionsRegion
32
- });
33
- module.exports = __toCommonJS(ActionsRegion_exports);
34
- var React = __toESM(require("react"));
35
- var import_jsx_runtime = require("react/jsx-runtime");
36
- var import_ds_button_v2 = require("@elliemae/ds-button-v2");
37
- var import_ds_icons = require("@elliemae/ds-icons");
38
- var import_style = require("./style.js");
39
- const ActionsRegion = ({ actions, instanceUid }) => {
40
- if (actions.length === 0) return null;
41
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationActions, { children: actions.map(({ icon, Icon, onClick, ...unexpectedButPreviouslySupportedOtherProps }, index) => {
42
- const defaultIconJSX = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.MoreOptionsVert, { "aria-label": "More options" });
43
- const iconJSX = icon ?? defaultIconJSX;
44
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
45
- import_style.StyledCardNavigationAction,
46
- {
47
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
48
- import_ds_button_v2.DSButtonV3,
49
- {
50
- onClick,
51
- "aria-label": "More options",
52
- ...unexpectedButPreviouslySupportedOtherProps,
53
- buttonType: import_ds_button_v2.BUTTON_TYPES.ICON,
54
- size: import_ds_button_v2.BUTTON_SIZES.L,
55
- children: Icon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {}) : iconJSX
56
- }
57
- )
58
- },
59
- `${instanceUid}-${index}`
60
- );
61
- }) });
62
- };
63
- //# sourceMappingURL=ActionsRegion.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/parts/ActionsRegion.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { BUTTON_SIZES, BUTTON_TYPES, DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport React from 'react';\nimport type { DSCardNavigationT } from '../react-desc-prop-types.js';\nimport { StyledCardNavigationAction, StyledCardNavigationActions } from './style.js';\n\ninterface ActionRegionProps {\n actions: DSCardNavigationT.InternalProps['actions'];\n instanceUid: string;\n}\n\nexport const ActionsRegion: React.ComponentType<ActionRegionProps> = ({ actions, instanceUid }) => {\n if (actions.length === 0) return null;\n return (\n <StyledCardNavigationActions>\n {actions.map(({ icon, Icon, onClick, ...unexpectedButPreviouslySupportedOtherProps }, index) => {\n const defaultIconJSX = <MoreOptionsVert aria-label=\"More options\" />;\n const iconJSX = icon ?? defaultIconJSX;\n return (\n <StyledCardNavigationAction\n // eslint-disable-next-line react/no-array-index-key\n key={`${instanceUid}-${index}`}\n >\n <DSButtonV3\n onClick={onClick}\n aria-label=\"More options\"\n {...unexpectedButPreviouslySupportedOtherProps}\n buttonType={BUTTON_TYPES.ICON}\n size={BUTTON_SIZES.L}\n >\n {Icon ? <Icon /> : iconJSX}\n </DSButtonV3>\n </StyledCardNavigationAction>\n );\n })}\n </StyledCardNavigationActions>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgBQ;AAhB/B,0BAAuD;AACvD,sBAAgC;AAGhC,mBAAwE;AAOjE,MAAM,gBAAwD,CAAC,EAAE,SAAS,YAAY,MAAM;AACjG,MAAI,QAAQ,WAAW,EAAG,QAAO;AACjC,SACE,4CAAC,4CACE,kBAAQ,IAAI,CAAC,EAAE,MAAM,MAAM,SAAS,GAAG,2CAA2C,GAAG,UAAU;AAC9F,UAAM,iBAAiB,4CAAC,mCAAgB,cAAW,gBAAe;AAClE,UAAM,UAAU,QAAQ;AACxB,WACE;AAAA,MAAC;AAAA;AAAA,QAIC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,cAAW;AAAA,YACV,GAAG;AAAA,YACJ,YAAY,iCAAa;AAAA,YACzB,MAAM,iCAAa;AAAA,YAElB,iBAAO,4CAAC,QAAK,IAAK;AAAA;AAAA,QACrB;AAAA;AAAA,MAVK,GAAG,WAAW,IAAI,KAAK;AAAA,IAW9B;AAAA,EAEJ,CAAC,GACH;AAEJ;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/parts/style.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { css, styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { CARD_NAVIGATION_SLOTS, CardNavigationTypes, DSCardNavigationName } from '../constants/index.js';\n\nexport const StyledCardNavigationContentTitle = styled('div', {\n name: DSCardNavigationName,\n slot: CARD_NAVIGATION_SLOTS.TITLE,\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: 1.3846rem; // 18px -> 18/13 = 1.3846rem\n\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: 1.125rem; // 18px -> 18/16 = 1.125rem\n }\n`;\n\nexport const StyledDescriptionTypography = styled(DSTypography)`\n color: ${(props) => props.theme.colors.neutral['500']};\n font-size: 0.923rem; // 12px -> 12/13 = 0.923rem\n\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: 0.8775rem; // 12px -> 10.5/12 = 0.8775rem\n }\n`;\n\nexport const StyledCardNavigationContentTitleWrapper = styled.div`\n width: 100%;\n`;\n\nexport const StyledCardNavigationContent = styled.div<{ wrapText?: boolean }>`\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})<{ wrapText?: boolean; AnyOverFlow?: boolean }>`\n padding: ${(props) => props.theme.space.xs};\n`;\ninterface StyledCardNavigationBoxWrapperProps {\n fluid?: boolean;\n}\n\nexport const StyledCardNavigationBoxWrapper = styled('div', {\n name: DSCardNavigationName,\n slot: CARD_NAVIGATION_SLOTS.ROOT,\n})<StyledCardNavigationBoxWrapperProps & { $isIconAndTextsRegionFocused?: boolean }>`\n min-width: 240px;\n min-height: 64px;\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\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\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 box-shadow: 0 3px 8px 0px rgba(37, 41, 47, 0.4);\n outline-offset: 2px;\n }\n\n ${(props) =>\n props.$isIconAndTextsRegionFocused\n ? css`\n outline: 2px solid ${props.theme.colors.brand['700']};\n outline-offset: 2px;\n `\n : css``}\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 min-width: 64px;\n min-height: 64px;\n height: 100%;\n border-top-left-radius: 2px;\n border-bottom-left-radius: 2px;\n padding: ${(props) => props.theme.space.xs};\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'};\n`;\n\nexport const StyledCardNavigationActions = styled('div', {\n name: DSCardNavigationName,\n slot: CARD_NAVIGATION_SLOTS.ACTIONS,\n})`\n padding: 0 ${(props) => props.theme.space.xs};\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space.xs};\n`;\n\nexport const StyledCardNavigationAction = styled('div')`\n span,\n svg {\n height: ${({ theme }) => theme.space.s};\n width: ${({ theme }) => theme.space.s};\n fill: ${({ theme }) => theme.colors.neutral[500]};\n }\n`;\n\nexport const StyledGridTextContainer = styled('div')`\n display: grid;\n grid-template-columns: max-content auto;\n align-items: center;\n min-width: 0;\n max-width: 100%;\n overflow: hidden;\n &:focus {\n outline: none;\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,qBAAqB;AACrB,uBAA4B;AAC5B,2BAA6B;AAC7B,uBAAiF;AAE1E,MAAM,uCAAmC,yBAAO,OAAO;AAAA,EAC5D,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAEM,MAAM,4BAAwB,yBAAO,iCAAY;AAAA,WAC7C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBACtC,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA;AAAA;AAAA,uBAGrC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA;AAAA;AAAA;AAKtD,MAAM,kCAA8B,yBAAO,iCAAY;AAAA,WACnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA,uBAGhC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA;AAAA;AAAA;AAKtD,MAAM,0CAA0C,wBAAO;AAAA;AAAA;AAIvD,MAAM,8BAA8B,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAO3C,MAAM,yCAAqC,yBAAO,qBAAM;AAAA,EAC7D,MAAM,uCAAsB;AAAA,EAC5B,MAAM;AACR,CAAC;AAAA,aACY,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAMrC,MAAM,qCAAiC,yBAAO,OAAO;AAAA,EAC1D,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAYG,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;AAAA,oBAW3C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAShD,CAAC,UACD,MAAM,+BACF;AAAA,+BACuB,MAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA;AAAA,YAGtD,sBAAK;AAAA;AAON,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,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,sBAKtB,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,eACc,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA;AAAA,SAIrC,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAGjC,MAAM,iCAA6B,yBAAO,KAAK;AAAA;AAAA;AAAA,cAGxC,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,CAAC;AAAA,aAC7B,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,CAAC;AAAA,YAC7B,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAI7C,MAAM,8BAA0B,yBAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,101 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var IconAndTextsRegion_exports = {};
30
- __export(IconAndTextsRegion_exports, {
31
- IconAndTextsRegion: () => IconAndTextsRegion
32
- });
33
- module.exports = __toCommonJS(IconAndTextsRegion_exports);
34
- var React = __toESM(require("react"));
35
- var import_jsx_runtime = require("react/jsx-runtime");
36
- var import_ds_grid = require("@elliemae/ds-grid");
37
- var import_ds_hooks_on_overflow_change = require("@elliemae/ds-hooks-on-overflow-change");
38
- var import_ds_tooltip_v3 = require("@elliemae/ds-tooltip-v3");
39
- var import_ds_typography = require("@elliemae/ds-typography");
40
- var import_react = __toESM(require("react"));
41
- var import_IconAndTextsRegionContent = require("./IconAndTextsRegionContent.js");
42
- const TooltipText = ({ title, description }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { children: [
43
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_typography.DSTypography, { variant: import_ds_typography.TYPOGRAPHY_VARIANTS.H5_ARTICLE, children: title }),
44
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_typography.DSTypography, { variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1, children: description })
45
- ] });
46
- const IconAndTextsRegion = ({
47
- title,
48
- description,
49
- wrapText,
50
- type,
51
- Icon,
52
- showFocusRingAroundAll,
53
- hideFocusRingAroundAll
54
- }) => {
55
- const [isTitleTruncating, setIsTitleTruncating] = import_react.default.useState(false);
56
- const [isDescriptionTruncating, setIsDescriptionTruncating] = import_react.default.useState(false);
57
- const AnyOverFlow = isTitleTruncating || isDescriptionTruncating;
58
- const { handleRef: titleHandleRef } = (0, import_ds_hooks_on_overflow_change.useOnOverflowChange)({
59
- onOverflowStateChange: setIsTitleTruncating
60
- });
61
- const { handleRef: descriptionHandleRef } = (0, import_ds_hooks_on_overflow_change.useOnOverflowChange)({
62
- onOverflowStateChange: setIsDescriptionTruncating
63
- });
64
- const TooltipTextProps = import_react.default.useMemo(
65
- () => ({
66
- title,
67
- description
68
- }),
69
- [title, description]
70
- );
71
- if (AnyOverFlow)
72
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_tooltip_v3.DSTooltipV3, { Text: TooltipText, textProps: TooltipTextProps, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
73
- import_IconAndTextsRegionContent.IconAndTextsRegionContent,
74
- {
75
- title,
76
- description,
77
- wrapText,
78
- type,
79
- Icon,
80
- titleHandleRef,
81
- descriptionHandleRef,
82
- showFocusRingAroundAll,
83
- hideFocusRingAroundAll
84
- }
85
- ) });
86
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
87
- import_IconAndTextsRegionContent.IconAndTextsRegionContent,
88
- {
89
- title,
90
- description,
91
- wrapText,
92
- type,
93
- Icon,
94
- titleHandleRef,
95
- descriptionHandleRef,
96
- showFocusRingAroundAll,
97
- hideFocusRingAroundAll
98
- }
99
- );
100
- };
101
- //# sourceMappingURL=IconAndTextsRegion.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../src/parts/text-region/IconAndTextsRegion.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { useOnOverflowChange } from '@elliemae/ds-hooks-on-overflow-change';\nimport type { DSTooltipV3T } from '@elliemae/ds-tooltip-v3';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip-v3';\nimport { DSTypography, TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport React from 'react';\nimport type { DSCardNavigationT } from '../../react-desc-prop-types.js';\nimport { IconAndTextsRegionContent } from './IconAndTextsRegionContent.js';\n\ntype TooltipTextProps = DSTooltipV3T.CustomInterface<{\n title: string;\n description: string;\n}>;\n\nconst TooltipText: React.ComponentType<TooltipTextProps> = ({ title, description }) => (\n <Grid>\n <DSTypography variant={TYPOGRAPHY_VARIANTS.H5_ARTICLE}>{title}</DSTypography>\n <DSTypography variant={TYPOGRAPHY_VARIANTS.B1}>{description}</DSTypography>\n </Grid>\n);\n\ninterface IconAndTextsRegionProps {\n title: DSCardNavigationT.InternalProps['title'];\n description: DSCardNavigationT.InternalProps['description'];\n wrapText: DSCardNavigationT.InternalProps['wrapText'];\n type: DSCardNavigationT.InternalProps['type'];\n Icon: DSCardNavigationT.InternalProps['Icon'];\n showFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n hideFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n}\n\nexport const IconAndTextsRegion: React.ComponentType<IconAndTextsRegionProps> = ({\n title,\n description,\n wrapText,\n type,\n Icon,\n showFocusRingAroundAll,\n hideFocusRingAroundAll,\n}) => {\n const [isTitleTruncating, setIsTitleTruncating] = React.useState(false);\n const [isDescriptionTruncating, setIsDescriptionTruncating] = React.useState(false);\n\n const AnyOverFlow = isTitleTruncating || isDescriptionTruncating;\n\n const { handleRef: titleHandleRef } = useOnOverflowChange({\n onOverflowStateChange: setIsTitleTruncating,\n });\n\n const { handleRef: descriptionHandleRef } = useOnOverflowChange({\n onOverflowStateChange: setIsDescriptionTruncating,\n });\n const TooltipTextProps = React.useMemo(\n () => ({\n title,\n description,\n }),\n [title, description],\n );\n\n if (AnyOverFlow)\n return (\n <DSTooltipV3<TooltipTextProps> Text={TooltipText} textProps={TooltipTextProps}>\n <IconAndTextsRegionContent\n title={title}\n description={description}\n wrapText={wrapText}\n type={type}\n Icon={Icon}\n titleHandleRef={titleHandleRef}\n descriptionHandleRef={descriptionHandleRef}\n showFocusRingAroundAll={showFocusRingAroundAll}\n hideFocusRingAroundAll={hideFocusRingAroundAll}\n />\n </DSTooltipV3>\n );\n return (\n <IconAndTextsRegionContent\n title={title}\n description={description}\n wrapText={wrapText}\n type={type}\n Icon={Icon}\n titleHandleRef={titleHandleRef}\n descriptionHandleRef={descriptionHandleRef}\n showFocusRingAroundAll={showFocusRingAroundAll}\n hideFocusRingAroundAll={hideFocusRingAroundAll}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADerB;AAfF,qBAAqB;AACrB,yCAAoC;AAEpC,2BAA4B;AAC5B,2BAAkD;AAClD,mBAAkB;AAElB,uCAA0C;AAO1C,MAAM,cAAqD,CAAC,EAAE,OAAO,YAAY,MAC/E,6CAAC,uBACC;AAAA,8CAAC,qCAAa,SAAS,yCAAoB,YAAa,iBAAM;AAAA,EAC9D,4CAAC,qCAAa,SAAS,yCAAoB,IAAK,uBAAY;AAAA,GAC9D;AAaK,MAAM,qBAAmE,CAAC;AAAA,EAC/E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,aAAAA,QAAM,SAAS,KAAK;AACtE,QAAM,CAAC,yBAAyB,0BAA0B,IAAI,aAAAA,QAAM,SAAS,KAAK;AAElF,QAAM,cAAc,qBAAqB;AAEzC,QAAM,EAAE,WAAW,eAAe,QAAI,wDAAoB;AAAA,IACxD,uBAAuB;AAAA,EACzB,CAAC;AAED,QAAM,EAAE,WAAW,qBAAqB,QAAI,wDAAoB;AAAA,IAC9D,uBAAuB;AAAA,EACzB,CAAC;AACD,QAAM,mBAAmB,aAAAA,QAAM;AAAA,IAC7B,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,OAAO,WAAW;AAAA,EACrB;AAEA,MAAI;AACF,WACE,4CAAC,oCAA8B,MAAM,aAAa,WAAW,kBAC3D;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,GACF;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;",
6
- "names": ["React"]
7
- }
@@ -1,88 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var IconAndTextsRegionContent_exports = {};
30
- __export(IconAndTextsRegionContent_exports, {
31
- IconAndTextsRegionContent: () => IconAndTextsRegionContent
32
- });
33
- module.exports = __toCommonJS(IconAndTextsRegionContent_exports);
34
- var React = __toESM(require("react"));
35
- var import_jsx_runtime = require("react/jsx-runtime");
36
- var import_ds_typography = require("@elliemae/ds-typography");
37
- var import_react = __toESM(require("react"));
38
- var import_constants = require("../../constants/index.js");
39
- var import_style = require("../style.js");
40
- const mainIconColor = ["neutral", "0"];
41
- const cols = ["1fr"];
42
- const IconAndTextsRegionContent = import_react.default.memo((props) => {
43
- const {
44
- title,
45
- description,
46
- wrapText,
47
- titleHandleRef,
48
- descriptionHandleRef,
49
- type,
50
- Icon,
51
- showFocusRingAroundAll,
52
- hideFocusRingAroundAll
53
- } = props;
54
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
55
- import_style.StyledGridTextContainer,
56
- {
57
- role: "button",
58
- tabIndex: 0,
59
- onFocus: showFocusRingAroundAll,
60
- onBlur: hideFocusRingAroundAll,
61
- children: [
62
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationIcon, { $type: type, "data-type": type, role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { size: "l", color: mainIconColor }) }),
63
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationCentralContent, { cols, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationContent, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_style.StyledCardNavigationContentTitleWrapper, { children: [
64
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_style.StyledCardNavigationContentTitle, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
65
- import_style.StyledTitleTypography,
66
- {
67
- innerRef: titleHandleRef,
68
- truncateWithEllipsis: !wrapText,
69
- variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1,
70
- children: title
71
- }
72
- ) }),
73
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
74
- import_style.StyledDescriptionTypography,
75
- {
76
- innerRef: descriptionHandleRef,
77
- truncateWithEllipsis: !wrapText,
78
- variant: import_ds_typography.TYPOGRAPHY_VARIANTS.B1,
79
- "data-testid": import_constants.CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
80
- children: description
81
- }
82
- ) })
83
- ] }) }) })
84
- ]
85
- }
86
- );
87
- });
88
- //# sourceMappingURL=IconAndTextsRegionContent.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../src/parts/text-region/IconAndTextsRegionContent.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import type { SvgIconT } from '@elliemae/ds-icons';\nimport { TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport React from 'react';\nimport { CARD_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport type { DSCardNavigationT } from '../../react-desc-prop-types.js';\nimport {\n StyledCardNavigationCentralContent,\n StyledCardNavigationContent,\n StyledCardNavigationContentTitle,\n StyledCardNavigationContentTitleWrapper,\n StyledCardNavigationIcon,\n StyledDescriptionTypography,\n StyledGridTextContainer,\n StyledTitleTypography,\n} from '../style.js';\n\nconst mainIconColor = ['neutral', '0'] as SvgIconT.ColorType;\nconst cols = ['1fr'];\n\ninterface IconAndTextsRegionContentProps {\n title: DSCardNavigationT.InternalProps['title'];\n description: DSCardNavigationT.InternalProps['description'];\n wrapText: DSCardNavigationT.InternalProps['wrapText'];\n type: DSCardNavigationT.InternalProps['type'];\n Icon: DSCardNavigationT.InternalProps['Icon'];\n\n titleHandleRef: (node: HTMLElement | null) => void;\n descriptionHandleRef: (node: HTMLElement | null) => void;\n showFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n hideFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n}\n\nexport const IconAndTextsRegionContent = React.memo((props: IconAndTextsRegionContentProps) => {\n const {\n title,\n description,\n wrapText,\n titleHandleRef,\n descriptionHandleRef,\n type,\n Icon,\n showFocusRingAroundAll,\n hideFocusRingAroundAll,\n } = props;\n\n return (\n <StyledGridTextContainer\n role=\"button\"\n tabIndex={0}\n onFocus={showFocusRingAroundAll}\n onBlur={hideFocusRingAroundAll}\n >\n <StyledCardNavigationIcon $type={type} data-type={type} role=\"presentation\">\n <Icon size=\"l\" color={mainIconColor} />\n </StyledCardNavigationIcon>\n\n <StyledCardNavigationCentralContent cols={cols}>\n <StyledCardNavigationContent>\n <StyledCardNavigationContentTitleWrapper>\n <StyledCardNavigationContentTitle>\n <StyledTitleTypography\n innerRef={titleHandleRef}\n truncateWithEllipsis={!wrapText}\n variant={TYPOGRAPHY_VARIANTS.B1}\n >\n {title}\n </StyledTitleTypography>\n </StyledCardNavigationContentTitle>\n <div>\n <StyledDescriptionTypography\n innerRef={descriptionHandleRef}\n truncateWithEllipsis={!wrapText}\n variant={TYPOGRAPHY_VARIANTS.B1}\n data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n >\n {description}\n </StyledDescriptionTypography>\n </div>\n </StyledCardNavigationContentTitleWrapper>\n </StyledCardNavigationContent>\n </StyledCardNavigationCentralContent>\n </StyledGridTextContainer>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqDf;AApDR,2BAAoC;AACpC,mBAAkB;AAClB,uBAA4C;AAE5C,mBASO;AAEP,MAAM,gBAAgB,CAAC,WAAW,GAAG;AACrC,MAAM,OAAO,CAAC,KAAK;AAeZ,MAAM,4BAA4B,aAAAA,QAAM,KAAK,CAAC,UAA0C;AAC7F,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAU;AAAA,MACV,SAAS;AAAA,MACT,QAAQ;AAAA,MAER;AAAA,oDAAC,yCAAyB,OAAO,MAAM,aAAW,MAAM,MAAK,gBAC3D,sDAAC,QAAK,MAAK,KAAI,OAAO,eAAe,GACvC;AAAA,QAEA,4CAAC,mDAAmC,MAClC,sDAAC,4CACC,uDAAC,wDACC;AAAA,sDAAC,iDACC;AAAA,YAAC;AAAA;AAAA,cACC,UAAU;AAAA,cACV,sBAAsB,CAAC;AAAA,cACvB,SAAS,yCAAoB;AAAA,cAE5B;AAAA;AAAA,UACH,GACF;AAAA,UACA,4CAAC,SACC;AAAA,YAAC;AAAA;AAAA,cACC,UAAU;AAAA,cACV,sBAAsB,CAAC;AAAA,cACvB,SAAS,yCAAoB;AAAA,cAC7B,eAAa,6CAA4B;AAAA,cAExC;AAAA;AAAA,UACH,GACF;AAAA,WACF,GACF,GACF;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;",
6
- "names": ["React"]
7
- }
@@ -1,33 +0,0 @@
1
- import * as React from "react";
2
- import { jsx } from "react/jsx-runtime";
3
- import { BUTTON_SIZES, BUTTON_TYPES, DSButtonV3 } from "@elliemae/ds-button-v2";
4
- import { MoreOptionsVert } from "@elliemae/ds-icons";
5
- import { StyledCardNavigationAction, StyledCardNavigationActions } from "./style.js";
6
- const ActionsRegion = ({ actions, instanceUid }) => {
7
- if (actions.length === 0) return null;
8
- return /* @__PURE__ */ jsx(StyledCardNavigationActions, { children: actions.map(({ icon, Icon, onClick, ...unexpectedButPreviouslySupportedOtherProps }, index) => {
9
- const defaultIconJSX = /* @__PURE__ */ jsx(MoreOptionsVert, { "aria-label": "More options" });
10
- const iconJSX = icon ?? defaultIconJSX;
11
- return /* @__PURE__ */ jsx(
12
- StyledCardNavigationAction,
13
- {
14
- children: /* @__PURE__ */ jsx(
15
- DSButtonV3,
16
- {
17
- onClick,
18
- "aria-label": "More options",
19
- ...unexpectedButPreviouslySupportedOtherProps,
20
- buttonType: BUTTON_TYPES.ICON,
21
- size: BUTTON_SIZES.L,
22
- children: Icon ? /* @__PURE__ */ jsx(Icon, {}) : iconJSX
23
- }
24
- )
25
- },
26
- `${instanceUid}-${index}`
27
- );
28
- }) });
29
- };
30
- export {
31
- ActionsRegion
32
- };
33
- //# sourceMappingURL=ActionsRegion.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/ActionsRegion.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { BUTTON_SIZES, BUTTON_TYPES, DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport React from 'react';\nimport type { DSCardNavigationT } from '../react-desc-prop-types.js';\nimport { StyledCardNavigationAction, StyledCardNavigationActions } from './style.js';\n\ninterface ActionRegionProps {\n actions: DSCardNavigationT.InternalProps['actions'];\n instanceUid: string;\n}\n\nexport const ActionsRegion: React.ComponentType<ActionRegionProps> = ({ actions, instanceUid }) => {\n if (actions.length === 0) return null;\n return (\n <StyledCardNavigationActions>\n {actions.map(({ icon, Icon, onClick, ...unexpectedButPreviouslySupportedOtherProps }, index) => {\n const defaultIconJSX = <MoreOptionsVert aria-label=\"More options\" />;\n const iconJSX = icon ?? defaultIconJSX;\n return (\n <StyledCardNavigationAction\n // eslint-disable-next-line react/no-array-index-key\n key={`${instanceUid}-${index}`}\n >\n <DSButtonV3\n onClick={onClick}\n aria-label=\"More options\"\n {...unexpectedButPreviouslySupportedOtherProps}\n buttonType={BUTTON_TYPES.ICON}\n size={BUTTON_SIZES.L}\n >\n {Icon ? <Icon /> : iconJSX}\n </DSButtonV3>\n </StyledCardNavigationAction>\n );\n })}\n </StyledCardNavigationActions>\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACgBQ;AAhB/B,SAAS,cAAc,cAAc,kBAAkB;AACvD,SAAS,uBAAuB;AAGhC,SAAS,4BAA4B,mCAAmC;AAOjE,MAAM,gBAAwD,CAAC,EAAE,SAAS,YAAY,MAAM;AACjG,MAAI,QAAQ,WAAW,EAAG,QAAO;AACjC,SACE,oBAAC,+BACE,kBAAQ,IAAI,CAAC,EAAE,MAAM,MAAM,SAAS,GAAG,2CAA2C,GAAG,UAAU;AAC9F,UAAM,iBAAiB,oBAAC,mBAAgB,cAAW,gBAAe;AAClE,UAAM,UAAU,QAAQ;AACxB,WACE;AAAA,MAAC;AAAA;AAAA,QAIC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,cAAW;AAAA,YACV,GAAG;AAAA,YACJ,YAAY,aAAa;AAAA,YACzB,MAAM,aAAa;AAAA,YAElB,iBAAO,oBAAC,QAAK,IAAK;AAAA;AAAA,QACrB;AAAA;AAAA,MAVK,GAAG,WAAW,IAAI,KAAK;AAAA,IAW9B;AAAA,EAEJ,CAAC,GACH;AAEJ;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/style.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport { css, styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { CARD_NAVIGATION_SLOTS, CardNavigationTypes, DSCardNavigationName } from '../constants/index.js';\n\nexport const StyledCardNavigationContentTitle = styled('div', {\n name: DSCardNavigationName,\n slot: CARD_NAVIGATION_SLOTS.TITLE,\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: 1.3846rem; // 18px -> 18/13 = 1.3846rem\n\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: 1.125rem; // 18px -> 18/16 = 1.125rem\n }\n`;\n\nexport const StyledDescriptionTypography = styled(DSTypography)`\n color: ${(props) => props.theme.colors.neutral['500']};\n font-size: 0.923rem; // 12px -> 12/13 = 0.923rem\n\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: 0.8775rem; // 12px -> 10.5/12 = 0.8775rem\n }\n`;\n\nexport const StyledCardNavigationContentTitleWrapper = styled.div`\n width: 100%;\n`;\n\nexport const StyledCardNavigationContent = styled.div<{ wrapText?: boolean }>`\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})<{ wrapText?: boolean; AnyOverFlow?: boolean }>`\n padding: ${(props) => props.theme.space.xs};\n`;\ninterface StyledCardNavigationBoxWrapperProps {\n fluid?: boolean;\n}\n\nexport const StyledCardNavigationBoxWrapper = styled('div', {\n name: DSCardNavigationName,\n slot: CARD_NAVIGATION_SLOTS.ROOT,\n})<StyledCardNavigationBoxWrapperProps & { $isIconAndTextsRegionFocused?: boolean }>`\n min-width: 240px;\n min-height: 64px;\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\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\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 box-shadow: 0 3px 8px 0px rgba(37, 41, 47, 0.4);\n outline-offset: 2px;\n }\n\n ${(props) =>\n props.$isIconAndTextsRegionFocused\n ? css`\n outline: 2px solid ${props.theme.colors.brand['700']};\n outline-offset: 2px;\n `\n : css``}\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 min-width: 64px;\n min-height: 64px;\n height: 100%;\n border-top-left-radius: 2px;\n border-bottom-left-radius: 2px;\n padding: ${(props) => props.theme.space.xs};\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'};\n`;\n\nexport const StyledCardNavigationActions = styled('div', {\n name: DSCardNavigationName,\n slot: CARD_NAVIGATION_SLOTS.ACTIONS,\n})`\n padding: 0 ${(props) => props.theme.space.xs};\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: ${(props) => props.theme.space.xs};\n`;\n\nexport const StyledCardNavigationAction = styled('div')`\n span,\n svg {\n height: ${({ theme }) => theme.space.s};\n width: ${({ theme }) => theme.space.s};\n fill: ${({ theme }) => theme.colors.neutral[500]};\n }\n`;\n\nexport const StyledGridTextContainer = styled('div')`\n display: grid;\n grid-template-columns: max-content auto;\n align-items: center;\n min-width: 0;\n max-width: 100%;\n overflow: hidden;\n &:focus {\n outline: none;\n }\n`;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY;AACrB,SAAS,KAAK,cAAc;AAC5B,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB,qBAAqB,4BAA4B;AAE1E,MAAM,mCAAmC,OAAO,OAAO;AAAA,EAC5D,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAEM,MAAM,wBAAwB,OAAO,YAAY;AAAA,WAC7C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBACtC,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA;AAAA;AAAA,uBAGrC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA;AAAA;AAAA;AAKtD,MAAM,8BAA8B,OAAO,YAAY;AAAA,WACnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA,uBAGhC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,KAAK;AAAA;AAAA;AAAA;AAKtD,MAAM,0CAA0C,OAAO;AAAA;AAAA;AAIvD,MAAM,8BAA8B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAO3C,MAAM,qCAAqC,OAAO,MAAM;AAAA,EAC7D,MAAM,sBAAsB;AAAA,EAC5B,MAAM;AACR,CAAC;AAAA,aACY,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAMrC,MAAM,iCAAiC,OAAO,OAAO;AAAA,EAC1D,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAYG,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;AAAA,oBAW3C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAShD,CAAC,UACD,MAAM,+BACF;AAAA,+BACuB,MAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA;AAAA,YAGtD,KAAK;AAAA;AAON,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,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,sBAKtB,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,eACc,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA;AAAA,SAIrC,CAAC,UAAU,MAAM,MAAM,MAAM,EAAE;AAAA;AAGjC,MAAM,6BAA6B,OAAO,KAAK;AAAA;AAAA;AAAA,cAGxC,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,CAAC;AAAA,aAC7B,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,CAAC;AAAA,YAC7B,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAI7C,MAAM,0BAA0B,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,71 +0,0 @@
1
- import * as React from "react";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- import { Grid } from "@elliemae/ds-grid";
4
- import { useOnOverflowChange } from "@elliemae/ds-hooks-on-overflow-change";
5
- import { DSTooltipV3 } from "@elliemae/ds-tooltip-v3";
6
- import { DSTypography, TYPOGRAPHY_VARIANTS } from "@elliemae/ds-typography";
7
- import React2 from "react";
8
- import { IconAndTextsRegionContent } from "./IconAndTextsRegionContent.js";
9
- const TooltipText = ({ title, description }) => /* @__PURE__ */ jsxs(Grid, { children: [
10
- /* @__PURE__ */ jsx(DSTypography, { variant: TYPOGRAPHY_VARIANTS.H5_ARTICLE, children: title }),
11
- /* @__PURE__ */ jsx(DSTypography, { variant: TYPOGRAPHY_VARIANTS.B1, children: description })
12
- ] });
13
- const IconAndTextsRegion = ({
14
- title,
15
- description,
16
- wrapText,
17
- type,
18
- Icon,
19
- showFocusRingAroundAll,
20
- hideFocusRingAroundAll
21
- }) => {
22
- const [isTitleTruncating, setIsTitleTruncating] = React2.useState(false);
23
- const [isDescriptionTruncating, setIsDescriptionTruncating] = React2.useState(false);
24
- const AnyOverFlow = isTitleTruncating || isDescriptionTruncating;
25
- const { handleRef: titleHandleRef } = useOnOverflowChange({
26
- onOverflowStateChange: setIsTitleTruncating
27
- });
28
- const { handleRef: descriptionHandleRef } = useOnOverflowChange({
29
- onOverflowStateChange: setIsDescriptionTruncating
30
- });
31
- const TooltipTextProps = React2.useMemo(
32
- () => ({
33
- title,
34
- description
35
- }),
36
- [title, description]
37
- );
38
- if (AnyOverFlow)
39
- return /* @__PURE__ */ jsx(DSTooltipV3, { Text: TooltipText, textProps: TooltipTextProps, children: /* @__PURE__ */ jsx(
40
- IconAndTextsRegionContent,
41
- {
42
- title,
43
- description,
44
- wrapText,
45
- type,
46
- Icon,
47
- titleHandleRef,
48
- descriptionHandleRef,
49
- showFocusRingAroundAll,
50
- hideFocusRingAroundAll
51
- }
52
- ) });
53
- return /* @__PURE__ */ jsx(
54
- IconAndTextsRegionContent,
55
- {
56
- title,
57
- description,
58
- wrapText,
59
- type,
60
- Icon,
61
- titleHandleRef,
62
- descriptionHandleRef,
63
- showFocusRingAroundAll,
64
- hideFocusRingAroundAll
65
- }
66
- );
67
- };
68
- export {
69
- IconAndTextsRegion
70
- };
71
- //# sourceMappingURL=IconAndTextsRegion.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/text-region/IconAndTextsRegion.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport { useOnOverflowChange } from '@elliemae/ds-hooks-on-overflow-change';\nimport type { DSTooltipV3T } from '@elliemae/ds-tooltip-v3';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip-v3';\nimport { DSTypography, TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport React from 'react';\nimport type { DSCardNavigationT } from '../../react-desc-prop-types.js';\nimport { IconAndTextsRegionContent } from './IconAndTextsRegionContent.js';\n\ntype TooltipTextProps = DSTooltipV3T.CustomInterface<{\n title: string;\n description: string;\n}>;\n\nconst TooltipText: React.ComponentType<TooltipTextProps> = ({ title, description }) => (\n <Grid>\n <DSTypography variant={TYPOGRAPHY_VARIANTS.H5_ARTICLE}>{title}</DSTypography>\n <DSTypography variant={TYPOGRAPHY_VARIANTS.B1}>{description}</DSTypography>\n </Grid>\n);\n\ninterface IconAndTextsRegionProps {\n title: DSCardNavigationT.InternalProps['title'];\n description: DSCardNavigationT.InternalProps['description'];\n wrapText: DSCardNavigationT.InternalProps['wrapText'];\n type: DSCardNavigationT.InternalProps['type'];\n Icon: DSCardNavigationT.InternalProps['Icon'];\n showFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n hideFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n}\n\nexport const IconAndTextsRegion: React.ComponentType<IconAndTextsRegionProps> = ({\n title,\n description,\n wrapText,\n type,\n Icon,\n showFocusRingAroundAll,\n hideFocusRingAroundAll,\n}) => {\n const [isTitleTruncating, setIsTitleTruncating] = React.useState(false);\n const [isDescriptionTruncating, setIsDescriptionTruncating] = React.useState(false);\n\n const AnyOverFlow = isTitleTruncating || isDescriptionTruncating;\n\n const { handleRef: titleHandleRef } = useOnOverflowChange({\n onOverflowStateChange: setIsTitleTruncating,\n });\n\n const { handleRef: descriptionHandleRef } = useOnOverflowChange({\n onOverflowStateChange: setIsDescriptionTruncating,\n });\n const TooltipTextProps = React.useMemo(\n () => ({\n title,\n description,\n }),\n [title, description],\n );\n\n if (AnyOverFlow)\n return (\n <DSTooltipV3<TooltipTextProps> Text={TooltipText} textProps={TooltipTextProps}>\n <IconAndTextsRegionContent\n title={title}\n description={description}\n wrapText={wrapText}\n type={type}\n Icon={Icon}\n titleHandleRef={titleHandleRef}\n descriptionHandleRef={descriptionHandleRef}\n showFocusRingAroundAll={showFocusRingAroundAll}\n hideFocusRingAroundAll={hideFocusRingAroundAll}\n />\n </DSTooltipV3>\n );\n return (\n <IconAndTextsRegionContent\n title={title}\n description={description}\n wrapText={wrapText}\n type={type}\n Icon={Icon}\n titleHandleRef={titleHandleRef}\n descriptionHandleRef={descriptionHandleRef}\n showFocusRingAroundAll={showFocusRingAroundAll}\n hideFocusRingAroundAll={hideFocusRingAroundAll}\n />\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACerB,SACE,KADF;AAfF,SAAS,YAAY;AACrB,SAAS,2BAA2B;AAEpC,SAAS,mBAAmB;AAC5B,SAAS,cAAc,2BAA2B;AAClD,OAAOA,YAAW;AAElB,SAAS,iCAAiC;AAO1C,MAAM,cAAqD,CAAC,EAAE,OAAO,YAAY,MAC/E,qBAAC,QACC;AAAA,sBAAC,gBAAa,SAAS,oBAAoB,YAAa,iBAAM;AAAA,EAC9D,oBAAC,gBAAa,SAAS,oBAAoB,IAAK,uBAAY;AAAA,GAC9D;AAaK,MAAM,qBAAmE,CAAC;AAAA,EAC/E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,mBAAmB,oBAAoB,IAAIA,OAAM,SAAS,KAAK;AACtE,QAAM,CAAC,yBAAyB,0BAA0B,IAAIA,OAAM,SAAS,KAAK;AAElF,QAAM,cAAc,qBAAqB;AAEzC,QAAM,EAAE,WAAW,eAAe,IAAI,oBAAoB;AAAA,IACxD,uBAAuB;AAAA,EACzB,CAAC;AAED,QAAM,EAAE,WAAW,qBAAqB,IAAI,oBAAoB;AAAA,IAC9D,uBAAuB;AAAA,EACzB,CAAC;AACD,QAAM,mBAAmBA,OAAM;AAAA,IAC7B,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,OAAO,WAAW;AAAA,EACrB;AAEA,MAAI;AACF,WACE,oBAAC,eAA8B,MAAM,aAAa,WAAW,kBAC3D;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,GACF;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;",
6
- "names": ["React"]
7
- }
@@ -1,67 +0,0 @@
1
- import * as React from "react";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- import { TYPOGRAPHY_VARIANTS } from "@elliemae/ds-typography";
4
- import React2 from "react";
5
- import { CARD_NAVIGATION_DATA_TESTID } from "../../constants/index.js";
6
- import {
7
- StyledCardNavigationCentralContent,
8
- StyledCardNavigationContent,
9
- StyledCardNavigationContentTitle,
10
- StyledCardNavigationContentTitleWrapper,
11
- StyledCardNavigationIcon,
12
- StyledDescriptionTypography,
13
- StyledGridTextContainer,
14
- StyledTitleTypography
15
- } from "../style.js";
16
- const mainIconColor = ["neutral", "0"];
17
- const cols = ["1fr"];
18
- const IconAndTextsRegionContent = React2.memo((props) => {
19
- const {
20
- title,
21
- description,
22
- wrapText,
23
- titleHandleRef,
24
- descriptionHandleRef,
25
- type,
26
- Icon,
27
- showFocusRingAroundAll,
28
- hideFocusRingAroundAll
29
- } = props;
30
- return /* @__PURE__ */ jsxs(
31
- StyledGridTextContainer,
32
- {
33
- role: "button",
34
- tabIndex: 0,
35
- onFocus: showFocusRingAroundAll,
36
- onBlur: hideFocusRingAroundAll,
37
- children: [
38
- /* @__PURE__ */ jsx(StyledCardNavigationIcon, { $type: type, "data-type": type, role: "presentation", children: /* @__PURE__ */ jsx(Icon, { size: "l", color: mainIconColor }) }),
39
- /* @__PURE__ */ jsx(StyledCardNavigationCentralContent, { cols, children: /* @__PURE__ */ jsx(StyledCardNavigationContent, { children: /* @__PURE__ */ jsxs(StyledCardNavigationContentTitleWrapper, { children: [
40
- /* @__PURE__ */ jsx(StyledCardNavigationContentTitle, { children: /* @__PURE__ */ jsx(
41
- StyledTitleTypography,
42
- {
43
- innerRef: titleHandleRef,
44
- truncateWithEllipsis: !wrapText,
45
- variant: TYPOGRAPHY_VARIANTS.B1,
46
- children: title
47
- }
48
- ) }),
49
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
50
- StyledDescriptionTypography,
51
- {
52
- innerRef: descriptionHandleRef,
53
- truncateWithEllipsis: !wrapText,
54
- variant: TYPOGRAPHY_VARIANTS.B1,
55
- "data-testid": CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT,
56
- children: description
57
- }
58
- ) })
59
- ] }) }) })
60
- ]
61
- }
62
- );
63
- });
64
- export {
65
- IconAndTextsRegionContent
66
- };
67
- //# sourceMappingURL=IconAndTextsRegionContent.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/text-region/IconAndTextsRegionContent.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { SvgIconT } from '@elliemae/ds-icons';\nimport { TYPOGRAPHY_VARIANTS } from '@elliemae/ds-typography';\nimport React from 'react';\nimport { CARD_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport type { DSCardNavigationT } from '../../react-desc-prop-types.js';\nimport {\n StyledCardNavigationCentralContent,\n StyledCardNavigationContent,\n StyledCardNavigationContentTitle,\n StyledCardNavigationContentTitleWrapper,\n StyledCardNavigationIcon,\n StyledDescriptionTypography,\n StyledGridTextContainer,\n StyledTitleTypography,\n} from '../style.js';\n\nconst mainIconColor = ['neutral', '0'] as SvgIconT.ColorType;\nconst cols = ['1fr'];\n\ninterface IconAndTextsRegionContentProps {\n title: DSCardNavigationT.InternalProps['title'];\n description: DSCardNavigationT.InternalProps['description'];\n wrapText: DSCardNavigationT.InternalProps['wrapText'];\n type: DSCardNavigationT.InternalProps['type'];\n Icon: DSCardNavigationT.InternalProps['Icon'];\n\n titleHandleRef: (node: HTMLElement | null) => void;\n descriptionHandleRef: (node: HTMLElement | null) => void;\n showFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n hideFocusRingAroundAll: React.FocusEventHandler<HTMLDivElement>;\n}\n\nexport const IconAndTextsRegionContent = React.memo((props: IconAndTextsRegionContentProps) => {\n const {\n title,\n description,\n wrapText,\n titleHandleRef,\n descriptionHandleRef,\n type,\n Icon,\n showFocusRingAroundAll,\n hideFocusRingAroundAll,\n } = props;\n\n return (\n <StyledGridTextContainer\n role=\"button\"\n tabIndex={0}\n onFocus={showFocusRingAroundAll}\n onBlur={hideFocusRingAroundAll}\n >\n <StyledCardNavigationIcon $type={type} data-type={type} role=\"presentation\">\n <Icon size=\"l\" color={mainIconColor} />\n </StyledCardNavigationIcon>\n\n <StyledCardNavigationCentralContent cols={cols}>\n <StyledCardNavigationContent>\n <StyledCardNavigationContentTitleWrapper>\n <StyledCardNavigationContentTitle>\n <StyledTitleTypography\n innerRef={titleHandleRef}\n truncateWithEllipsis={!wrapText}\n variant={TYPOGRAPHY_VARIANTS.B1}\n >\n {title}\n </StyledTitleTypography>\n </StyledCardNavigationContentTitle>\n <div>\n <StyledDescriptionTypography\n innerRef={descriptionHandleRef}\n truncateWithEllipsis={!wrapText}\n variant={TYPOGRAPHY_VARIANTS.B1}\n data-testid={CARD_NAVIGATION_DATA_TESTID.DESCRIPTION_TEXT}\n >\n {description}\n </StyledDescriptionTypography>\n </div>\n </StyledCardNavigationContentTitleWrapper>\n </StyledCardNavigationContent>\n </StyledCardNavigationCentralContent>\n </StyledGridTextContainer>\n );\n});\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACqDf,cAKE,YALF;AApDR,SAAS,2BAA2B;AACpC,OAAOA,YAAW;AAClB,SAAS,mCAAmC;AAE5C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,gBAAgB,CAAC,WAAW,GAAG;AACrC,MAAM,OAAO,CAAC,KAAK;AAeZ,MAAM,4BAA4BA,OAAM,KAAK,CAAC,UAA0C;AAC7F,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAU;AAAA,MACV,SAAS;AAAA,MACT,QAAQ;AAAA,MAER;AAAA,4BAAC,4BAAyB,OAAO,MAAM,aAAW,MAAM,MAAK,gBAC3D,8BAAC,QAAK,MAAK,KAAI,OAAO,eAAe,GACvC;AAAA,QAEA,oBAAC,sCAAmC,MAClC,8BAAC,+BACC,+BAAC,2CACC;AAAA,8BAAC,oCACC;AAAA,YAAC;AAAA;AAAA,cACC,UAAU;AAAA,cACV,sBAAsB,CAAC;AAAA,cACvB,SAAS,oBAAoB;AAAA,cAE5B;AAAA;AAAA,UACH,GACF;AAAA,UACA,oBAAC,SACC;AAAA,YAAC;AAAA;AAAA,cACC,UAAU;AAAA,cACV,sBAAsB,CAAC;AAAA,cACvB,SAAS,oBAAoB;AAAA,cAC7B,eAAa,4BAA4B;AAAA,cAExC;AAAA;AAAA,UACH,GACF;AAAA,WACF,GACF,GACF;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;",
6
- "names": ["React"]
7
- }
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import type { DSCardNavigationT } from '../react-desc-prop-types.js';
3
- interface ActionRegionProps {
4
- actions: DSCardNavigationT.InternalProps['actions'];
5
- instanceUid: string;
6
- }
7
- export declare const ActionsRegion: React.ComponentType<ActionRegionProps>;
8
- export {};