@elliemae/ds-card-v3 3.26.0-next.12
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.
- package/dist/cjs/CardV3.js +90 -0
- package/dist/cjs/CardV3.js.map +7 -0
- package/dist/cjs/CardV3Definitions.js +43 -0
- package/dist/cjs/CardV3Definitions.js.map +7 -0
- package/dist/cjs/index.js +33 -0
- package/dist/cjs/index.js.map +7 -0
- package/dist/cjs/package.json +7 -0
- package/dist/cjs/parts/CardContent.js +54 -0
- package/dist/cjs/parts/CardContent.js.map +7 -0
- package/dist/cjs/parts/CardContext.js +42 -0
- package/dist/cjs/parts/CardContext.js.map +7 -0
- package/dist/cjs/parts/CardFocusRing.js +68 -0
- package/dist/cjs/parts/CardFocusRing.js.map +7 -0
- package/dist/cjs/parts/CardFooter.js +54 -0
- package/dist/cjs/parts/CardFooter.js.map +7 -0
- package/dist/cjs/parts/CardHeader.js +81 -0
- package/dist/cjs/parts/CardHeader.js.map +7 -0
- package/dist/cjs/parts/CardSelectIndicator.js +46 -0
- package/dist/cjs/parts/CardSelectIndicator.js.map +7 -0
- package/dist/cjs/parts/index.js +34 -0
- package/dist/cjs/parts/index.js.map +7 -0
- package/dist/cjs/react-desc-prop-types.js +28 -0
- package/dist/cjs/react-desc-prop-types.js.map +7 -0
- package/dist/cjs/styled.js +115 -0
- package/dist/cjs/styled.js.map +7 -0
- package/dist/esm/CardV3.js +60 -0
- package/dist/esm/CardV3.js.map +7 -0
- package/dist/esm/CardV3Definitions.js +13 -0
- package/dist/esm/CardV3Definitions.js.map +7 -0
- package/dist/esm/index.js +6 -0
- package/dist/esm/index.js.map +7 -0
- package/dist/esm/package.json +7 -0
- package/dist/esm/parts/CardContent.js +24 -0
- package/dist/esm/parts/CardContent.js.map +7 -0
- package/dist/esm/parts/CardContext.js +12 -0
- package/dist/esm/parts/CardContext.js.map +7 -0
- package/dist/esm/parts/CardFocusRing.js +38 -0
- package/dist/esm/parts/CardFocusRing.js.map +7 -0
- package/dist/esm/parts/CardFooter.js +24 -0
- package/dist/esm/parts/CardFooter.js.map +7 -0
- package/dist/esm/parts/CardHeader.js +51 -0
- package/dist/esm/parts/CardHeader.js.map +7 -0
- package/dist/esm/parts/CardSelectIndicator.js +16 -0
- package/dist/esm/parts/CardSelectIndicator.js.map +7 -0
- package/dist/esm/parts/index.js +7 -0
- package/dist/esm/parts/index.js.map +7 -0
- package/dist/esm/react-desc-prop-types.js +2 -0
- package/dist/esm/react-desc-prop-types.js.map +7 -0
- package/dist/esm/styled.js +85 -0
- package/dist/esm/styled.js.map +7 -0
- package/dist/types/CardV3.d.ts +4 -0
- package/dist/types/CardV3Definitions.d.ts +5 -0
- package/dist/types/index.d.ts +4 -0
- package/dist/types/parts/CardContent.d.ts +2 -0
- package/dist/types/parts/CardContext.d.ts +3 -0
- package/dist/types/parts/CardFocusRing.d.ts +2 -0
- package/dist/types/parts/CardFooter.d.ts +2 -0
- package/dist/types/parts/CardHeader.d.ts +2 -0
- package/dist/types/parts/CardSelectIndicator.d.ts +2 -0
- package/dist/types/parts/index.d.ts +5 -0
- package/dist/types/react-desc-prop-types.d.ts +39 -0
- package/dist/types/styled.d.ts +45 -0
- package/package.json +73 -0
|
@@ -0,0 +1,34 @@
|
|
|
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 __copyProps = (to, from, except, desc) => {
|
|
9
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
10
|
+
for (let key of __getOwnPropNames(from))
|
|
11
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
12
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
13
|
+
}
|
|
14
|
+
return to;
|
|
15
|
+
};
|
|
16
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
17
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
18
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
19
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
20
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
21
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
22
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
23
|
+
mod
|
|
24
|
+
));
|
|
25
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
26
|
+
var parts_exports = {};
|
|
27
|
+
module.exports = __toCommonJS(parts_exports);
|
|
28
|
+
var React = __toESM(require("react"));
|
|
29
|
+
__reExport(parts_exports, require("./CardContent.js"), module.exports);
|
|
30
|
+
__reExport(parts_exports, require("./CardFooter.js"), module.exports);
|
|
31
|
+
__reExport(parts_exports, require("./CardHeader.js"), module.exports);
|
|
32
|
+
__reExport(parts_exports, require("./CardSelectIndicator.js"), module.exports);
|
|
33
|
+
__reExport(parts_exports, require("./CardFocusRing.js"), module.exports);
|
|
34
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/parts/index.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export * from './CardContent.js';\nexport * from './CardFooter.js';\nexport * from './CardHeader.js';\nexport * from './CardSelectIndicator.js';\nexport * from './CardFocusRing.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAc,6BAAd;AACA,0BAAc,4BADd;AAEA,0BAAc,4BAFd;AAGA,0BAAc,qCAHd;AAIA,0BAAc,+BAJd;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
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 __copyProps = (to, from, except, desc) => {
|
|
9
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
10
|
+
for (let key of __getOwnPropNames(from))
|
|
11
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
12
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
13
|
+
}
|
|
14
|
+
return to;
|
|
15
|
+
};
|
|
16
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
17
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
18
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
19
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
20
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var react_desc_prop_types_exports = {};
|
|
26
|
+
module.exports = __toCommonJS(react_desc_prop_types_exports);
|
|
27
|
+
var React = __toESM(require("react"));
|
|
28
|
+
//# sourceMappingURL=react-desc-prop-types.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/react-desc-prop-types.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { type GlobalAttributesT } from '@elliemae/ds-utilities';\nimport { type DSGridT } from '@elliemae/ds-grid';\n\nexport declare namespace CardT {\n export interface RequiredProps {\n children: React.ReactNode;\n }\n\n export interface OptinalProps {\n isSelected?: boolean;\n isMultiSelect?: boolean;\n isOverlay?: boolean;\n onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n }\n\n export interface DefaultProps {\n hasError: boolean;\n }\n\n export interface Props\n extends RequiredProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof RequiredProps>,\n OptinalProps,\n DefaultProps {}\n export interface InternalProps\n extends RequiredProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof RequiredProps>,\n OptinalProps,\n Partial<DefaultProps> {}\n\n export interface CardSelectIndicatorProps {\n isSelected?: boolean;\n isMultiSelect?: boolean;\n }\n\n export interface FocusRingProps {\n target: string;\n children: React.ReactNode;\n hasError?: boolean;\n }\n\n export interface CardElementsProps extends Partial<DSGridT.InternalProps> {\n children: React.ReactNode;\n }\n}\n\nexport interface CardContextProps {\n onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n isSelected?: boolean;\n isMultiSelect?: boolean;\n disabled?: boolean;\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,115 @@
|
|
|
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 styled_exports = {};
|
|
30
|
+
__export(styled_exports, {
|
|
31
|
+
CardActionArea: () => CardActionArea,
|
|
32
|
+
StyledButtonCard: () => StyledButtonCard,
|
|
33
|
+
StyledCard: () => StyledCard,
|
|
34
|
+
StyledCardDisabled: () => StyledCardDisabled,
|
|
35
|
+
StyledCardError: () => StyledCardError,
|
|
36
|
+
StyledCardSingleIndicator: () => StyledCardSingleIndicator,
|
|
37
|
+
StyledFocusRing: () => StyledFocusRing
|
|
38
|
+
});
|
|
39
|
+
module.exports = __toCommonJS(styled_exports);
|
|
40
|
+
var React = __toESM(require("react"));
|
|
41
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
42
|
+
var import_ds_grid = require("@elliemae/ds-grid");
|
|
43
|
+
var import_CardV3Definitions = require("./CardV3Definitions.js");
|
|
44
|
+
const CardActionArea = (0, import_ds_system.styled)("button", {
|
|
45
|
+
name: import_CardV3Definitions.DSCardV3Name,
|
|
46
|
+
slot: import_CardV3Definitions.DSCardV3Slots.ACTION_AREA
|
|
47
|
+
})`
|
|
48
|
+
border: none;
|
|
49
|
+
background-color: transparent;
|
|
50
|
+
width: 0px;
|
|
51
|
+
height: 0px;
|
|
52
|
+
padding: 0;
|
|
53
|
+
&:focus {
|
|
54
|
+
outline: none;
|
|
55
|
+
}
|
|
56
|
+
text-align: unset;
|
|
57
|
+
`;
|
|
58
|
+
const StyledCard = (0, import_ds_system.styled)(import_ds_grid.Grid)`
|
|
59
|
+
min-width: 240px;
|
|
60
|
+
min-height: 56px;
|
|
61
|
+
background-color: ${({ theme, isOverlay }) => isOverlay ? theme.colors.neutral["080"] : "white"};
|
|
62
|
+
outline-offset: -2px;
|
|
63
|
+
* {
|
|
64
|
+
color: ${({ theme, isOverlay }) => isOverlay ? theme.colors.neutral["500"] : "inherit"};
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
${import_ds_system.xStyledCommonProps}
|
|
68
|
+
`;
|
|
69
|
+
const StyledButtonCard = (0, import_ds_system.styled)(StyledCard)`
|
|
70
|
+
cursor: pointer;
|
|
71
|
+
`;
|
|
72
|
+
const StyledCardError = (0, import_ds_system.styled)(StyledCard)`
|
|
73
|
+
outline: ${({ theme }) => `2px solid ${theme.colors.danger[900]}`};
|
|
74
|
+
`;
|
|
75
|
+
const StyledCardSingleIndicator = (0, import_ds_system.styled)(import_ds_grid.Grid)`
|
|
76
|
+
width: ${({ isSelected }) => isSelected ? "6px" : "4px"};
|
|
77
|
+
align-self: normal;
|
|
78
|
+
background-color: ${({ theme, isSelected }) => {
|
|
79
|
+
if (isSelected)
|
|
80
|
+
return theme.colors.brand["700"];
|
|
81
|
+
return theme.colors.brand["300"];
|
|
82
|
+
}};
|
|
83
|
+
transition: all 0.1s ease-in-out;
|
|
84
|
+
|
|
85
|
+
${StyledCard}:not([data-disabled='true']):not([data-selected='true']):hover & {
|
|
86
|
+
background-color: ${({ theme }) => theme.colors.brand["500"]};
|
|
87
|
+
}
|
|
88
|
+
`;
|
|
89
|
+
const StyledCardDisabled = (0, import_ds_system.styled)(StyledCard)`
|
|
90
|
+
cursor: not-allowed;
|
|
91
|
+
user-select: none;
|
|
92
|
+
opacity: 0.5;
|
|
93
|
+
${StyledCardSingleIndicator} {
|
|
94
|
+
background-color: ${({ theme, isSelected }) => isSelected ? theme.colors.neutral["800"] : theme.colors.neutral["080"]};
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
${CardActionArea} {
|
|
98
|
+
pointer-events: none;
|
|
99
|
+
}
|
|
100
|
+
`;
|
|
101
|
+
const StyledFocusRing = (0, import_ds_system.styled)(import_ds_grid.Grid)`
|
|
102
|
+
width: 100%;
|
|
103
|
+
height: 100%;
|
|
104
|
+
outline-offset: -1px;
|
|
105
|
+
outline: ${({ showFocusRing, hasError, theme }) => {
|
|
106
|
+
if (showFocusRing) {
|
|
107
|
+
return `2px solid ${theme.colors.brand[700]}`;
|
|
108
|
+
}
|
|
109
|
+
if (hasError) {
|
|
110
|
+
return `2px solid ${theme.colors.danger[900]}`;
|
|
111
|
+
}
|
|
112
|
+
return "none";
|
|
113
|
+
}};
|
|
114
|
+
`;
|
|
115
|
+
//# sourceMappingURL=styled.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCardV3Name, DSCardV3Slots } from './CardV3Definitions.js';\nexport const CardActionArea = styled('button', {\n name: DSCardV3Name,\n slot: DSCardV3Slots.ACTION_AREA,\n})`\n border: none;\n background-color: transparent;\n width: 0px;\n height: 0px;\n padding: 0;\n &:focus {\n outline: none;\n }\n text-align: unset;\n`;\n\n// START style cards variants\nexport const StyledCard = styled(Grid)<{\n isOverlay?: boolean;\n onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n}>`\n min-width: 240px;\n min-height: 56px;\n background-color: ${({ theme, isOverlay }) => (isOverlay ? theme.colors.neutral['080'] : 'white')};\n outline-offset: -2px;\n * {\n color: ${({ theme, isOverlay }) => (isOverlay ? theme.colors.neutral['500'] : 'inherit')};\n }\n\n ${xStyledCommonProps}\n`;\n\nexport const StyledButtonCard = styled(StyledCard)<{ isOverlay?: boolean }>`\n cursor: pointer;\n`;\n\nexport const StyledCardError = styled(StyledCard)`\n outline: ${({ theme }) => `2px solid ${theme.colors.danger[900]}`};\n`;\n\nexport const StyledCardSingleIndicator = styled(Grid)<{ isSelected?: boolean }>`\n width: ${({ isSelected }) => (isSelected ? '6px' : '4px')};\n align-self: normal;\n background-color: ${({ theme, isSelected }) => {\n if (isSelected) return theme.colors.brand['700'];\n return theme.colors.brand['300'];\n }};\n transition: all 0.1s ease-in-out;\n\n ${StyledCard}:not([data-disabled='true']):not([data-selected='true']):hover & {\n background-color: ${({ theme }) => theme.colors.brand['500']};\n }\n`;\n\nexport const StyledCardDisabled = styled(StyledCard)`\n cursor: not-allowed;\n user-select: none;\n opacity: 0.5;\n ${StyledCardSingleIndicator} {\n background-color: ${({ theme, isSelected }) =>\n isSelected ? theme.colors.neutral['800'] : theme.colors.neutral['080']};\n }\n\n ${CardActionArea} {\n pointer-events: none;\n }\n`;\n\nexport const StyledFocusRing = styled(Grid)<{ showFocusRing: boolean; hasError?: boolean }>`\n width: 100%;\n height: 100%;\n outline-offset: -1px;\n outline: ${({ showFocusRing, hasError, theme }) => {\n if (showFocusRing) {\n return `2px solid ${theme.colors.brand[700]}`;\n }\n if (hasError) {\n return `2px solid ${theme.colors.danger[900]}`;\n }\n return '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;ACAA,YAAuB;ADAvB,uBAA2C;AAC3C,qBAAqB;AACrB,+BAA4C;AACrC,MAAM,qBAAiB,yBAAO,UAAU;AAAA,EAC7C,MAAM;AAAA,EACN,MAAM,uCAAc;AACtB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaM,MAAM,iBAAa,yBAAO,mBAAI;AAAA;AAAA;AAAA,sBAMf,CAAC,EAAE,OAAO,UAAU,MAAO,YAAY,MAAM,OAAO,QAAQ,KAAK,IAAI;AAAA;AAAA;AAAA,aAG9E,CAAC,EAAE,OAAO,UAAU,MAAO,YAAY,MAAM,OAAO,QAAQ,KAAK,IAAI;AAAA;AAAA;AAAA,IAG9E;AAAA;AAGG,MAAM,uBAAmB,yBAAO,UAAU;AAAA;AAAA;AAI1C,MAAM,sBAAkB,yBAAO,UAAU;AAAA,aACnC,CAAC,EAAE,MAAM,MAAM,aAAa,MAAM,OAAO,OAAO,GAAG;AAAA;AAGzD,MAAM,gCAA4B,yBAAO,mBAAI;AAAA,WACzC,CAAC,EAAE,WAAW,MAAO,aAAa,QAAQ;AAAA;AAAA,sBAE/B,CAAC,EAAE,OAAO,WAAW,MAAM;AAC7C,MAAI;AAAY,WAAO,MAAM,OAAO,MAAM,KAAK;AAC/C,SAAO,MAAM,OAAO,MAAM,KAAK;AACjC;AAAA;AAAA;AAAA,IAGE;AAAA,wBACoB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,KAAK;AAAA;AAAA;AAIxD,MAAM,yBAAqB,yBAAO,UAAU;AAAA;AAAA;AAAA;AAAA,IAI/C;AAAA,wBACoB,CAAC,EAAE,OAAO,WAAW,MACvC,aAAa,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA,IAGvE;AAAA;AAAA;AAAA;AAKG,MAAM,sBAAkB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA,aAI7B,CAAC,EAAE,eAAe,UAAU,MAAM,MAAM;AACjD,MAAI,eAAe;AACjB,WAAO,aAAa,MAAM,OAAO,MAAM,GAAG;AAAA,EAC5C;AACA,MAAI,UAAU;AACZ,WAAO,aAAa,MAAM,OAAO,OAAO,GAAG;AAAA,EAC7C;AACA,SAAO;AACT;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useMemo, useCallback } from "react";
|
|
4
|
+
import { omit } from "lodash";
|
|
5
|
+
import { useMemoMergePropsWithDefault, useGetXstyledProps, useGetGlobalAttributes } from "@elliemae/ds-utilities";
|
|
6
|
+
import { FocusRing } from "./parts/index.js";
|
|
7
|
+
import { CardActionArea, StyledButtonCard, StyledCard, StyledCardDisabled } from "./styled.js";
|
|
8
|
+
import { CardContext } from "./parts/CardContext.js";
|
|
9
|
+
import { DSCardV3DataTestIds } from "./CardV3Definitions.js";
|
|
10
|
+
const defaultProps = {
|
|
11
|
+
hasError: false
|
|
12
|
+
};
|
|
13
|
+
const Card = (props) => {
|
|
14
|
+
const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
|
|
15
|
+
const { children, hasError, disabled, isOverlay, onClick, isSelected, isMultiSelect } = propsWithDefault;
|
|
16
|
+
const StyledCardContainer = useMemo(() => {
|
|
17
|
+
if (onClick && !disabled) {
|
|
18
|
+
return StyledButtonCard;
|
|
19
|
+
}
|
|
20
|
+
if (disabled) {
|
|
21
|
+
return StyledCardDisabled;
|
|
22
|
+
}
|
|
23
|
+
return StyledCard;
|
|
24
|
+
}, [disabled, onClick]);
|
|
25
|
+
const globalsAttrs = omit(useGetGlobalAttributes(propsWithDefault), ["cols", "rows", "wrap"]);
|
|
26
|
+
const xstyledProps = useGetXstyledProps(propsWithDefault);
|
|
27
|
+
const getOwnerProps = useCallback(() => propsWithDefault, [propsWithDefault]);
|
|
28
|
+
return /* @__PURE__ */ jsx(CardContext.Provider, { value: { isMultiSelect, disabled, isSelected, onClick }, children: /* @__PURE__ */ jsx(
|
|
29
|
+
StyledCardContainer,
|
|
30
|
+
{
|
|
31
|
+
border: "solid 1px neutral-100",
|
|
32
|
+
boxShadow: "xs",
|
|
33
|
+
isOverlay,
|
|
34
|
+
...globalsAttrs,
|
|
35
|
+
...xstyledProps,
|
|
36
|
+
"data-disabled": disabled,
|
|
37
|
+
"data-selected": isSelected,
|
|
38
|
+
children: /* @__PURE__ */ jsxs(FocusRing, { target: `[data-testid=${DSCardV3DataTestIds.ACTION_AREA}]`, hasError, children: [
|
|
39
|
+
onClick ? /* @__PURE__ */ jsx(
|
|
40
|
+
CardActionArea,
|
|
41
|
+
{
|
|
42
|
+
disabled,
|
|
43
|
+
"data-testid": DSCardV3DataTestIds.ACTION_AREA,
|
|
44
|
+
"aria-selected": isSelected,
|
|
45
|
+
"aria-multiselectable": isMultiSelect,
|
|
46
|
+
"aria-disabled": disabled,
|
|
47
|
+
"aria-invalid": hasError,
|
|
48
|
+
getOwnerProps
|
|
49
|
+
}
|
|
50
|
+
) : null,
|
|
51
|
+
children
|
|
52
|
+
] })
|
|
53
|
+
}
|
|
54
|
+
) });
|
|
55
|
+
};
|
|
56
|
+
export {
|
|
57
|
+
Card,
|
|
58
|
+
defaultProps
|
|
59
|
+
};
|
|
60
|
+
//# sourceMappingURL=CardV3.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/CardV3.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable @typescript-eslint/no-empty-interface */\n/* eslint-disable react/display-name */\nimport React, { useMemo, useCallback } from 'react';\nimport { omit } from 'lodash';\nimport { useMemoMergePropsWithDefault, useGetXstyledProps, useGetGlobalAttributes } from '@elliemae/ds-utilities';\nimport type { CardT } from './react-desc-prop-types.js';\nimport { FocusRing } from './parts/index.js';\nimport { CardActionArea, StyledButtonCard, StyledCard, StyledCardDisabled } from './styled.js';\nimport { CardContext } from './parts/CardContext.js';\nimport { DSCardV3DataTestIds } from './CardV3Definitions.js';\n\nexport const defaultProps: CardT.DefaultProps = {\n hasError: false,\n};\n\n// create acontext\n\nexport const Card: React.ComponentType<CardT.InternalProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<CardT.Props>(props, defaultProps);\n const { children, hasError, disabled, isOverlay, onClick, isSelected, isMultiSelect } = propsWithDefault;\n\n const StyledCardContainer = useMemo(() => {\n if (onClick && !disabled) {\n return StyledButtonCard;\n }\n if (disabled) {\n return StyledCardDisabled;\n }\n return StyledCard;\n }, [disabled, onClick]);\n\n const globalsAttrs = omit(useGetGlobalAttributes(propsWithDefault), ['cols', 'rows', 'wrap']);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n const getOwnerProps = useCallback(() => propsWithDefault, [propsWithDefault]);\n\n return (\n <CardContext.Provider value={{ isMultiSelect, disabled, isSelected, onClick }}>\n <StyledCardContainer\n border=\"solid 1px neutral-100\"\n boxShadow=\"xs\"\n isOverlay={isOverlay}\n {...globalsAttrs}\n {...xstyledProps}\n data-disabled={disabled}\n data-selected={isSelected}\n >\n <FocusRing target={`[data-testid=${DSCardV3DataTestIds.ACTION_AREA}]`} hasError={hasError}>\n {onClick ? (\n <CardActionArea\n disabled={disabled}\n data-testid={DSCardV3DataTestIds.ACTION_AREA}\n aria-selected={isSelected}\n aria-multiselectable={isMultiSelect}\n aria-disabled={disabled}\n aria-invalid={hasError}\n getOwnerProps={getOwnerProps}\n />\n ) : null}\n {children}\n </FocusRing>\n </StyledCardContainer>\n </CardContext.Provider>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC+Cf,SAEI,KAFJ;AA5CR,SAAgB,SAAS,mBAAmB;AAC5C,SAAS,YAAY;AACrB,SAAS,8BAA8B,oBAAoB,8BAA8B;AAEzF,SAAS,iBAAiB;AAC1B,SAAS,gBAAgB,kBAAkB,YAAY,0BAA0B;AACjF,SAAS,mBAAmB;AAC5B,SAAS,2BAA2B;AAE7B,MAAM,eAAmC;AAAA,EAC9C,UAAU;AACZ;AAIO,MAAM,OAAiD,CAAC,UAAU;AACvE,QAAM,mBAAmB,6BAA0C,OAAO,YAAY;AACtF,QAAM,EAAE,UAAU,UAAU,UAAU,WAAW,SAAS,YAAY,cAAc,IAAI;AAExF,QAAM,sBAAsB,QAAQ,MAAM;AACxC,QAAI,WAAW,CAAC,UAAU;AACxB,aAAO;AAAA,IACT;AACA,QAAI,UAAU;AACZ,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,OAAO,CAAC;AAEtB,QAAM,eAAe,KAAK,uBAAuB,gBAAgB,GAAG,CAAC,QAAQ,QAAQ,MAAM,CAAC;AAC5F,QAAM,eAAe,mBAAmB,gBAAgB;AACxD,QAAM,gBAAgB,YAAY,MAAM,kBAAkB,CAAC,gBAAgB,CAAC;AAE5E,SACE,oBAAC,YAAY,UAAZ,EAAqB,OAAO,EAAE,eAAe,UAAU,YAAY,QAAQ,GAC1E;AAAA,IAAC;AAAA;AAAA,MACC,QAAO;AAAA,MACP,WAAU;AAAA,MACV;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,iBAAe;AAAA,MACf,iBAAe;AAAA,MAEf,+BAAC,aAAU,QAAQ,gBAAgB,oBAAoB,gBAAgB,UACpE;AAAA,kBACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa,oBAAoB;AAAA,YACjC,iBAAe;AAAA,YACf,wBAAsB;AAAA,YACtB,iBAAe;AAAA,YACf,gBAAc;AAAA,YACd;AAAA;AAAA,QACF,IACE;AAAA,QACH;AAAA,SACH;AAAA;AAAA,EACF,GACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { slotObjectToDataTestIds } from "@elliemae/ds-system";
|
|
3
|
+
const DSCardV3Name = "DSCardV3";
|
|
4
|
+
const DSCardV3Slots = {
|
|
5
|
+
ACTION_AREA: "action-area"
|
|
6
|
+
};
|
|
7
|
+
const DSCardV3DataTestIds = slotObjectToDataTestIds(DSCardV3Name, DSCardV3Slots);
|
|
8
|
+
export {
|
|
9
|
+
DSCardV3DataTestIds,
|
|
10
|
+
DSCardV3Name,
|
|
11
|
+
DSCardV3Slots
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=CardV3Definitions.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/CardV3Definitions.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSCardV3Name = 'DSCardV3';\nexport const DSCardV3Slots = {\n ACTION_AREA: 'action-area',\n};\n\nexport const DSCardV3DataTestIds = slotObjectToDataTestIds(DSCardV3Name, DSCardV3Slots);\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;AAEjC,MAAM,eAAe;AACrB,MAAM,gBAAgB;AAAA,EAC3B,aAAa;AACf;AAEO,MAAM,sBAAsB,wBAAwB,cAAc,aAAa;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.ts"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './CardV3.js';\nexport * from './CardV3Definitions.js';\nexport * from './react-desc-prop-types.js';\nexport * from './parts/index.js';\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Grid } from "@elliemae/ds-grid";
|
|
4
|
+
const CardContent = (props) => {
|
|
5
|
+
const { children, ...rest } = props;
|
|
6
|
+
return /* @__PURE__ */ jsx(
|
|
7
|
+
Grid,
|
|
8
|
+
{
|
|
9
|
+
"data-type": "card-content",
|
|
10
|
+
gutter: "xxs",
|
|
11
|
+
px: "xs",
|
|
12
|
+
py: "xxs",
|
|
13
|
+
paddingTop: "0px",
|
|
14
|
+
minHeight: "64px",
|
|
15
|
+
alignItems: "center",
|
|
16
|
+
...rest,
|
|
17
|
+
children
|
|
18
|
+
}
|
|
19
|
+
);
|
|
20
|
+
};
|
|
21
|
+
export {
|
|
22
|
+
CardContent
|
|
23
|
+
};
|
|
24
|
+
//# sourceMappingURL=CardContent.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/CardContent.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport type { CardT } from '../react-desc-prop-types.js';\n\nexport const CardContent = (props: CardT.CardElementsProps) => {\n const { children, ...rest } = props;\n return (\n <Grid\n data-type=\"card-content\"\n gutter=\"xxs\"\n px=\"xs\"\n py=\"xxs\"\n paddingTop=\"0px\"\n minHeight=\"64px\"\n alignItems=\"center\"\n {...rest}\n >\n {children}\n </Grid>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACOnB;AANJ,SAAS,YAAY;AAGd,MAAM,cAAc,CAAC,UAAmC;AAC7D,QAAM,EAAE,UAAU,GAAG,KAAK,IAAI;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,QAAO;AAAA,MACP,IAAG;AAAA,MACH,IAAG;AAAA,MACH,YAAW;AAAA,MACX,WAAU;AAAA,MACV,YAAW;AAAA,MACV,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2 from "react";
|
|
3
|
+
const defaultContext = {
|
|
4
|
+
isSelected: false,
|
|
5
|
+
isMultiSelect: false,
|
|
6
|
+
disabled: false
|
|
7
|
+
};
|
|
8
|
+
const CardContext = React2.createContext(defaultContext);
|
|
9
|
+
export {
|
|
10
|
+
CardContext
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=CardContext.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/CardContext.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { CardContextProps } from '../react-desc-prop-types.js';\n\nconst defaultContext: CardContextProps = {\n isSelected: false,\n isMultiSelect: false,\n disabled: false,\n};\n\nexport const CardContext = React.createContext<CardContextProps>(defaultContext);\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAGlB,MAAM,iBAAmC;AAAA,EACvC,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,UAAU;AACZ;AAEO,MAAM,cAAcA,OAAM,cAAgC,cAAc;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import React2 from "react";
|
|
4
|
+
import { StyledFocusRing } from "../styled.js";
|
|
5
|
+
const FocusRing = (props) => {
|
|
6
|
+
const { target, children, hasError } = props;
|
|
7
|
+
const [showFocusRing, setShowFocusingRing] = React2.useState(false);
|
|
8
|
+
const handleOnFocus = React2.useCallback(
|
|
9
|
+
(e) => {
|
|
10
|
+
if (e.target.matches(target)) {
|
|
11
|
+
setShowFocusingRing(true);
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
[target]
|
|
15
|
+
);
|
|
16
|
+
const handleOnBlur = React2.useCallback(
|
|
17
|
+
(e) => {
|
|
18
|
+
if (e.target.matches(target)) {
|
|
19
|
+
setShowFocusingRing(false);
|
|
20
|
+
}
|
|
21
|
+
},
|
|
22
|
+
[target]
|
|
23
|
+
);
|
|
24
|
+
return /* @__PURE__ */ jsx(
|
|
25
|
+
StyledFocusRing,
|
|
26
|
+
{
|
|
27
|
+
hasError,
|
|
28
|
+
onFocusCapture: handleOnFocus,
|
|
29
|
+
onBlurCapture: handleOnBlur,
|
|
30
|
+
showFocusRing,
|
|
31
|
+
children
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
};
|
|
35
|
+
export {
|
|
36
|
+
FocusRing
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=CardFocusRing.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/CardFocusRing.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledFocusRing } from '../styled.js';\nimport { type CardT } from '../react-desc-prop-types.js';\n\nexport const FocusRing = (props: CardT.FocusRingProps) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const { target, children, hasError } = props;\n const [showFocusRing, setShowFocusingRing] = React.useState(false);\n const handleOnFocus: React.FocusEventHandler<HTMLDivElement> = React.useCallback(\n (e) => {\n if (e.target.matches(target)) {\n setShowFocusingRing(true);\n }\n },\n [target],\n );\n\n const handleOnBlur: React.FocusEventHandler<HTMLDivElement> = React.useCallback(\n (e) => {\n if (e.target.matches(target)) {\n setShowFocusingRing(false);\n }\n },\n [target],\n );\n return (\n <StyledFocusRing\n hasError={hasError}\n onFocusCapture={handleOnFocus}\n onBlurCapture={handleOnBlur}\n showFocusRing={showFocusRing}\n >\n {children}\n </StyledFocusRing>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC0BnB;AA1BJ,OAAOA,YAAW;AAClB,SAAS,uBAAuB;AAGzB,MAAM,YAAY,CAAC,UAAgC;AAExD,QAAM,EAAE,QAAQ,UAAU,SAAS,IAAI;AACvC,QAAM,CAAC,eAAe,mBAAmB,IAAIA,OAAM,SAAS,KAAK;AACjE,QAAM,gBAAyDA,OAAM;AAAA,IACnE,CAAC,MAAM;AACL,UAAI,EAAE,OAAO,QAAQ,MAAM,GAAG;AAC5B,4BAAoB,IAAI;AAAA,MAC1B;AAAA,IACF;AAAA,IACA,CAAC,MAAM;AAAA,EACT;AAEA,QAAM,eAAwDA,OAAM;AAAA,IAClE,CAAC,MAAM;AACL,UAAI,EAAE,OAAO,QAAQ,MAAM,GAAG;AAC5B,4BAAoB,KAAK;AAAA,MAC3B;AAAA,IACF;AAAA,IACA,CAAC,MAAM;AAAA,EACT;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Grid } from "@elliemae/ds-grid";
|
|
4
|
+
const CardFooter = (props) => {
|
|
5
|
+
const { children, ...rest } = props;
|
|
6
|
+
return /* @__PURE__ */ jsx(
|
|
7
|
+
Grid,
|
|
8
|
+
{
|
|
9
|
+
"data-type": "card-footer",
|
|
10
|
+
px: "xs",
|
|
11
|
+
py: "xxs",
|
|
12
|
+
gutter: "xxs",
|
|
13
|
+
borderTop: "1px solid #CBCFD7",
|
|
14
|
+
minHeight: "40px",
|
|
15
|
+
alignItems: "center",
|
|
16
|
+
...rest,
|
|
17
|
+
children
|
|
18
|
+
}
|
|
19
|
+
);
|
|
20
|
+
};
|
|
21
|
+
export {
|
|
22
|
+
CardFooter
|
|
23
|
+
};
|
|
24
|
+
//# sourceMappingURL=CardFooter.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/CardFooter.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport type { CardT } from '../react-desc-prop-types.js';\n\nexport const CardFooter = (props: CardT.CardElementsProps) => {\n const { children, ...rest } = props;\n return (\n <Grid\n data-type=\"card-footer\"\n px=\"xs\"\n py=\"xxs\"\n gutter=\"xxs\"\n borderTop=\"1px solid #CBCFD7\"\n minHeight=\"40px\"\n alignItems=\"center\"\n {...rest}\n >\n {children}\n </Grid>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACOnB;AANJ,SAAS,YAAY;AAGd,MAAM,aAAa,CAAC,UAAmC;AAC5D,QAAM,EAAE,UAAU,GAAG,KAAK,IAAI;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,IAAG;AAAA,MACH,IAAG;AAAA,MACH,QAAO;AAAA,MACP,WAAU;AAAA,MACV,WAAU;AAAA,MACV,YAAW;AAAA,MACV,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import React2 from "react";
|
|
4
|
+
import { Grid } from "@elliemae/ds-grid";
|
|
5
|
+
import { CardSelectIndicator } from "./CardSelectIndicator.js";
|
|
6
|
+
import { CardContext } from "./CardContext.js";
|
|
7
|
+
const CardHeader = (props) => {
|
|
8
|
+
const { isSelected, isMultiSelect, onClick } = React2.useContext(CardContext);
|
|
9
|
+
const { children, ...rest } = props;
|
|
10
|
+
if (isSelected !== void 0 && isMultiSelect && onClick) {
|
|
11
|
+
return /* @__PURE__ */ jsxs(
|
|
12
|
+
Grid,
|
|
13
|
+
{
|
|
14
|
+
cols: ["12px", "auto"],
|
|
15
|
+
"data-type": "card-header",
|
|
16
|
+
padding: "xxxs",
|
|
17
|
+
alignItems: "center",
|
|
18
|
+
minHeight: "56px",
|
|
19
|
+
...rest,
|
|
20
|
+
children: [
|
|
21
|
+
/* @__PURE__ */ jsx(CardSelectIndicator, { isSelected, isMultiSelect }),
|
|
22
|
+
/* @__PURE__ */ jsx(Grid, { py: "xxxs", paddingRight: "xxs2", children })
|
|
23
|
+
]
|
|
24
|
+
}
|
|
25
|
+
);
|
|
26
|
+
}
|
|
27
|
+
if (isSelected !== void 0 && !isMultiSelect && onClick) {
|
|
28
|
+
return /* @__PURE__ */ jsxs(
|
|
29
|
+
Grid,
|
|
30
|
+
{
|
|
31
|
+
cols: ["16px", "auto"],
|
|
32
|
+
"data-type": "card-header",
|
|
33
|
+
gutter: "xxs",
|
|
34
|
+
px: "xs",
|
|
35
|
+
py: "xxs",
|
|
36
|
+
alignItems: "center",
|
|
37
|
+
minHeight: "56px",
|
|
38
|
+
...rest,
|
|
39
|
+
children: [
|
|
40
|
+
/* @__PURE__ */ jsx(CardSelectIndicator, { isSelected, isMultiSelect }),
|
|
41
|
+
/* @__PURE__ */ jsx(Grid, { py: "xxxs", paddingRight: "xxs2", children })
|
|
42
|
+
]
|
|
43
|
+
}
|
|
44
|
+
);
|
|
45
|
+
}
|
|
46
|
+
return /* @__PURE__ */ jsx(Grid, { "data-type": "card-header", px: "xs", py: "xxs", gutter: "xxs", alignItems: "center", minHeight: "56px", ...rest, children });
|
|
47
|
+
};
|
|
48
|
+
export {
|
|
49
|
+
CardHeader
|
|
50
|
+
};
|
|
51
|
+
//# sourceMappingURL=CardHeader.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/CardHeader.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { CardSelectIndicator } from './CardSelectIndicator.js';\nimport { CardContext } from './CardContext.js';\nimport type { CardT } from '../react-desc-prop-types.js';\n\nexport const CardHeader = (props: CardT.CardElementsProps) => {\n const { isSelected, isMultiSelect, onClick } = React.useContext(CardContext);\n const { children, ...rest } = props;\n if (isSelected !== undefined && isMultiSelect && onClick) {\n return (\n <Grid\n cols={['12px', 'auto']}\n data-type=\"card-header\"\n padding=\"xxxs\"\n alignItems=\"center\"\n minHeight=\"56px\"\n {...rest}\n >\n <CardSelectIndicator isSelected={isSelected} isMultiSelect={isMultiSelect} />\n <Grid py=\"xxxs\" paddingRight=\"xxs2\">\n {children}\n </Grid>\n </Grid>\n );\n }\n if (isSelected !== undefined && !isMultiSelect && onClick) {\n return (\n <Grid\n cols={['16px', 'auto']}\n data-type=\"card-header\"\n gutter=\"xxs\"\n px=\"xs\"\n py=\"xxs\"\n alignItems=\"center\"\n minHeight=\"56px\"\n {...rest}\n >\n <CardSelectIndicator isSelected={isSelected} isMultiSelect={isMultiSelect} />\n <Grid py=\"xxxs\" paddingRight=\"xxs2\">\n {children}\n </Grid>\n </Grid>\n );\n }\n return (\n <Grid data-type=\"card-header\" px=\"xs\" py=\"xxs\" gutter=\"xxs\" alignItems=\"center\" minHeight=\"56px\" {...rest}>\n {children}\n </Grid>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACWjB,SAQE,KARF;AAXN,OAAOA,YAAW;AAClB,SAAS,YAAY;AACrB,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAGrB,MAAM,aAAa,CAAC,UAAmC;AAC5D,QAAM,EAAE,YAAY,eAAe,QAAQ,IAAIA,OAAM,WAAW,WAAW;AAC3E,QAAM,EAAE,UAAU,GAAG,KAAK,IAAI;AAC9B,MAAI,eAAe,UAAa,iBAAiB,SAAS;AACxD,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,CAAC,QAAQ,MAAM;AAAA,QACrB,aAAU;AAAA,QACV,SAAQ;AAAA,QACR,YAAW;AAAA,QACX,WAAU;AAAA,QACT,GAAG;AAAA,QAEJ;AAAA,8BAAC,uBAAoB,YAAwB,eAA8B;AAAA,UAC3E,oBAAC,QAAK,IAAG,QAAO,cAAa,QAC1B,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACA,MAAI,eAAe,UAAa,CAAC,iBAAiB,SAAS;AACzD,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,CAAC,QAAQ,MAAM;AAAA,QACrB,aAAU;AAAA,QACV,QAAO;AAAA,QACP,IAAG;AAAA,QACH,IAAG;AAAA,QACH,YAAW;AAAA,QACX,WAAU;AAAA,QACT,GAAG;AAAA,QAEJ;AAAA,8BAAC,uBAAoB,YAAwB,eAA8B;AAAA,UAC3E,oBAAC,QAAK,IAAG,QAAO,cAAa,QAC1B,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACA,SACE,oBAAC,QAAK,aAAU,eAAc,IAAG,MAAK,IAAG,OAAM,QAAO,OAAM,YAAW,UAAS,WAAU,QAAQ,GAAG,MAClG,UACH;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Grid } from "@elliemae/ds-grid";
|
|
4
|
+
import { PresentationalRadio } from "@elliemae/ds-form-radio";
|
|
5
|
+
import { StyledCardSingleIndicator } from "../styled.js";
|
|
6
|
+
const CardSelectIndicator = (props) => {
|
|
7
|
+
const { isSelected, isMultiSelect } = props;
|
|
8
|
+
if (!isMultiSelect) {
|
|
9
|
+
return /* @__PURE__ */ jsx(Grid, { alignItems: "center", children: /* @__PURE__ */ jsx(PresentationalRadio, { checked: isSelected, "aria-label": "@todo", device: "desktop" }) });
|
|
10
|
+
}
|
|
11
|
+
return /* @__PURE__ */ jsx(StyledCardSingleIndicator, { isSelected });
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
CardSelectIndicator
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=CardSelectIndicator.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/CardSelectIndicator.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { PresentationalRadio } from '@elliemae/ds-form-radio';\nimport { StyledCardSingleIndicator } from '../styled.js';\nimport { type CardT } from '../react-desc-prop-types.js';\n\nexport const CardSelectIndicator = (props: CardT.CardSelectIndicatorProps) => {\n const { isSelected, isMultiSelect } = props;\n if (!isMultiSelect) {\n return (\n <Grid alignItems=\"center\">\n <PresentationalRadio checked={isSelected} aria-label=\"@todo\" device=\"desktop\" />\n </Grid>\n );\n }\n return <StyledCardSingleIndicator isSelected={isSelected} />;\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACWf;AAVR,SAAS,YAAY;AACrB,SAAS,2BAA2B;AACpC,SAAS,iCAAiC;AAGnC,MAAM,sBAAsB,CAAC,UAA0C;AAC5E,QAAM,EAAE,YAAY,cAAc,IAAI;AACtC,MAAI,CAAC,eAAe;AAClB,WACE,oBAAC,QAAK,YAAW,UACf,8BAAC,uBAAoB,SAAS,YAAY,cAAW,SAAQ,QAAO,WAAU,GAChF;AAAA,EAEJ;AACA,SAAO,oBAAC,6BAA0B,YAAwB;AAC5D;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/index.ts"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './CardContent.js';\nexport * from './CardFooter.js';\nexport * from './CardHeader.js';\nexport * from './CardSelectIndicator.js';\nexport * from './CardFocusRing.js';\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|