@elliemae/ds-card-v2 3.37.0-rc.4 → 3.37.0
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/DSCardV2.js +2 -2
- package/dist/cjs/DSCardV2.js.map +2 -2
- package/dist/cjs/config/useCardV2.js +4 -4
- package/dist/cjs/config/useCardV2.js.map +2 -2
- package/dist/cjs/config/useValidateProps.js +2 -2
- package/dist/cjs/config/useValidateProps.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js +8 -8
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/esm/DSCardV2.js +1 -1
- package/dist/esm/DSCardV2.js.map +1 -1
- package/dist/esm/config/useCardV2.js +1 -1
- package/dist/esm/config/useCardV2.js.map +1 -1
- package/dist/esm/config/useValidateProps.js +1 -1
- package/dist/esm/config/useValidateProps.js.map +1 -1
- package/dist/esm/react-desc-prop-types.js +1 -1
- package/dist/esm/react-desc-prop-types.js.map +1 -1
- package/dist/types/DSCardV2.d.ts +5 -0
- package/dist/types/config/useCardV2.d.ts +2 -2
- package/dist/types/react-desc-prop-types.d.ts +4 -4
- package/package.json +11 -11
package/dist/cjs/DSCardV2.js
CHANGED
|
@@ -34,7 +34,7 @@ __export(DSCardV2_exports, {
|
|
|
34
34
|
module.exports = __toCommonJS(DSCardV2_exports);
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
|
-
var
|
|
37
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
38
38
|
var import_react_desc_prop_types = require("./react-desc-prop-types.js");
|
|
39
39
|
var import_useCardV2 = require("./config/useCardV2.js");
|
|
40
40
|
var import_constants = require("./constants/index.js");
|
|
@@ -93,6 +93,6 @@ const DSCardV2 = (props) => {
|
|
|
93
93
|
) });
|
|
94
94
|
};
|
|
95
95
|
DSCardV2.displayName = import_constants.DSCardV2Name;
|
|
96
|
-
const DSCardV2WithSchema = (0,
|
|
96
|
+
const DSCardV2WithSchema = (0, import_ds_props_helpers.describe)(DSCardV2);
|
|
97
97
|
DSCardV2WithSchema.propTypes = import_react_desc_prop_types.DSCardV2PropTypesSchema;
|
|
98
98
|
//# sourceMappingURL=DSCardV2.js.map
|
package/dist/cjs/DSCardV2.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSCardV2.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { describe } from '@elliemae/ds-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoCC;AAnCxB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { type DSCardV2T, DSCardV2PropTypesSchema } from './react-desc-prop-types.js';\nimport { useCardV2 } from './config/useCardV2.js';\nimport { DSCardV2Name, CARD_V2_DATA_TESTID } from './constants/index.js';\nimport { DSTruncatedTooltipText, TooltipTextProvider } from '@elliemae/ds-truncated-tooltip-text';\nimport { DSHeader } from '@elliemae/ds-header';\nimport {\n CardContainer,\n LeftSection,\n LeftAddon,\n MainSection,\n Description,\n RightAddonSection,\n RightAddon,\n Separator,\n} from './styles.js';\n\nconst getCol = (rightAddon: DSCardV2T.OptionalProps['rightAddon']) => {\n if (!rightAddon) return ['1fr'];\n return ['1fr', 'auto'];\n};\n\nconst DSCardV2: React.ComponentType<DSCardV2T.Props> = (props) => {\n const { propsWithDefault, globalProps, xstyledProps } = useCardV2(props);\n const { hasBorder, title, leftAddon, rightAddon, description } = propsWithDefault;\n return (\n <TooltipTextProvider>\n <CardContainer\n data-testid={CARD_V2_DATA_TESTID.CARD_CONTAINER} //we must keep this explicit to avoid the breaking changes\n {...globalProps}\n {...xstyledProps}\n hasBorder={hasBorder}\n cols={getCol(rightAddon)}\n >\n <LeftSection>\n {leftAddon && <LeftAddon>{leftAddon}</LeftAddon>}\n <MainSection\n style={{\n maxWidth: leftAddon ? 'calc(100% - 40px)' : '100%',\n }}\n >\n <DSHeader\n data-testid={CARD_V2_DATA_TESTID.CARD_HEADER} //we must keep this explicit to avoid the breaking changes\n fontSize=\"16px\"\n fontWeight=\"regular\"\n color=\"neutral.800\"\n text={<DSTruncatedTooltipText value={title} />}\n />\n {description && (\n <Description>\n <DSTruncatedTooltipText value={description} />\n </Description>\n )}\n </MainSection>\n </LeftSection>\n {Array.isArray(rightAddon) && (\n <RightAddonSection>\n {rightAddon[0] ? <RightAddon>{rightAddon[0]}</RightAddon> : null}\n {rightAddon[1] ? (\n <>\n {rightAddon.length > 1 && <Separator />}\n <RightAddon>{rightAddon[1]}</RightAddon>\n </>\n ) : null}\n </RightAddonSection>\n )}\n </CardContainer>\n </TooltipTextProvider>\n );\n};\n\nDSCardV2.displayName = DSCardV2Name;\nconst DSCardV2WithSchema = describe(DSCardV2);\nDSCardV2WithSchema.propTypes = DSCardV2PropTypesSchema;\n\nexport { DSCardV2, DSCardV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoCC;AAnCxB,8BAAyB;AACzB,mCAAwD;AACxD,uBAA0B;AAC1B,uBAAkD;AAClD,uCAA4D;AAC5D,uBAAyB;AACzB,oBASO;AAEP,MAAM,SAAS,CAAC,eAAsD;AACpE,MAAI,CAAC,WAAY,QAAO,CAAC,KAAK;AAC9B,SAAO,CAAC,OAAO,MAAM;AACvB;AAEA,MAAM,WAAiD,CAAC,UAAU;AAChE,QAAM,EAAE,kBAAkB,aAAa,aAAa,QAAI,4BAAU,KAAK;AACvE,QAAM,EAAE,WAAW,OAAO,WAAW,YAAY,YAAY,IAAI;AACjE,SACE,4CAAC,wDACC;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,qCAAoB;AAAA,MAChC,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA,MAAM,OAAO,UAAU;AAAA,MAEvB;AAAA,qDAAC,6BACE;AAAA,uBAAa,4CAAC,2BAAW,qBAAU;AAAA,UACpC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,gBACL,UAAU,YAAY,sBAAsB;AAAA,cAC9C;AAAA,cAEA;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,eAAa,qCAAoB;AAAA,oBACjC,UAAS;AAAA,oBACT,YAAW;AAAA,oBACX,OAAM;AAAA,oBACN,MAAM,4CAAC,2DAAuB,OAAO,OAAO;AAAA;AAAA,gBAC9C;AAAA,gBACC,eACC,4CAAC,6BACC,sDAAC,2DAAuB,OAAO,aAAa,GAC9C;AAAA;AAAA;AAAA,UAEJ;AAAA,WACF;AAAA,QACC,MAAM,QAAQ,UAAU,KACvB,6CAAC,mCACE;AAAA,qBAAW,CAAC,IAAI,4CAAC,4BAAY,qBAAW,CAAC,GAAE,IAAgB;AAAA,UAC3D,WAAW,CAAC,IACX,4EACG;AAAA,uBAAW,SAAS,KAAK,4CAAC,2BAAU;AAAA,YACrC,4CAAC,4BAAY,qBAAW,CAAC,GAAE;AAAA,aAC7B,IACE;AAAA,WACN;AAAA;AAAA;AAAA,EAEJ,GACF;AAEJ;AAEA,SAAS,cAAc;AACvB,MAAM,yBAAqB,kCAAS,QAAQ;AAC5C,mBAAmB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -33,15 +33,15 @@ __export(useCardV2_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(useCardV2_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_react = __toESM(require("react"));
|
|
36
|
-
var
|
|
36
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
37
37
|
var import_uid = require("uid");
|
|
38
38
|
var import_react_desc_prop_types = require("../react-desc-prop-types.js");
|
|
39
39
|
var import_useValidateProps = require("./useValidateProps.js");
|
|
40
40
|
const useCardV2 = (propsFromUser) => {
|
|
41
|
-
const propsWithDefault = (0,
|
|
41
|
+
const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(propsFromUser, import_react_desc_prop_types.defaultProps);
|
|
42
42
|
(0, import_useValidateProps.useValidateProps)(propsWithDefault, import_react_desc_prop_types.DSCardV2PropTypes);
|
|
43
|
-
const globalProps = (0,
|
|
44
|
-
const xstyledProps = (0,
|
|
43
|
+
const globalProps = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefault);
|
|
44
|
+
const xstyledProps = (0, import_ds_props_helpers.useGetXstyledProps)(propsWithDefault);
|
|
45
45
|
const { id } = propsWithDefault;
|
|
46
46
|
const instanceUid = import_react.default.useMemo(() => id || (0, import_uid.uid)(5), [id]);
|
|
47
47
|
return import_react.default.useMemo(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/useCardV2.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { uid } from 'uid';\nimport { type DSCardV2T, DSCardV2PropTypes, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\nimport type { DSGridT } from '@elliemae/ds-grid';\n\nexport interface CardV2CTX {\n propsWithDefault: DSCardV2T.InternalProps;\n globalProps: ReturnType<typeof useGetGlobalAttributes>;\n xstyledProps: ReturnType<typeof useGetXstyledProps>;\n instanceUid: string;\n}\n\nexport const useCardV2 = (propsFromUser: DSCardV2T.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSCardV2T.InternalProps>(propsFromUser, defaultProps);\n useValidateProps(propsWithDefault, DSCardV2PropTypes);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const globalProps = useGetGlobalAttributes<DSCardV2T.InternalProps, HTMLDivElement, DSGridT.Props>(propsWithDefault);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const { id } = propsWithDefault;\n const instanceUid = React.useMemo(() => id || uid(5), [id]);\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n // const eventHandlers = useEventHandlers({ propsWithDefault, instanceUid }); // <-- complex logic should be made atomics this way\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n globalProps,\n xstyledProps,\n instanceUid,\n // ...eventHandlers,\n }),\n [\n propsWithDefault,\n globalProps,\n xstyledProps,\n instanceUid,\n // eventHandlers,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,8BAAyF;AACzF,iBAAoB;AACpB,mCAAgE;AAChE,8BAAiC;AAU1B,MAAM,YAAY,CAAC,kBAAmC;AAI3D,QAAM,uBAAmB,sDAAsD,eAAe,yCAAY;AAC1G,gDAAiB,kBAAkB,8CAAiB;AAIpD,QAAM,kBAAc,gDAA+E,gBAAgB;AACnH,QAAM,mBAAe,4CAAmB,gBAAgB;AAKxD,QAAM,EAAE,GAAG,IAAI;AACf,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM,UAAM,gBAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AAM1D,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -32,9 +32,9 @@ __export(useValidateProps_exports, {
|
|
|
32
32
|
});
|
|
33
33
|
module.exports = __toCommonJS(useValidateProps_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
|
-
var
|
|
35
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
36
36
|
var import_constants = require("../constants/index.js");
|
|
37
37
|
const useValidateProps = (props, propTypes) => {
|
|
38
|
-
(0,
|
|
38
|
+
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(props, propTypes, import_constants.DSCardV2Name);
|
|
39
39
|
};
|
|
40
40
|
//# sourceMappingURL=useValidateProps.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/useValidateProps.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,
|
|
4
|
+
"sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { WeakValidationMap } from 'react';\nimport { type DSCardV2T } from '../react-desc-prop-types.js';\nimport { DSCardV2Name } from '../constants/index.js';\n\nexport const useValidateProps = (props: DSCardV2T.InternalProps, propTypes: WeakValidationMap<unknown>): void => {\n // we validate the \"required if\" via 'isRequiredIf from our custom PropTypes\n useValidateTypescriptPropTypes(props, propTypes, DSCardV2Name);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA+C;AAG/C,uBAA6B;AAEtB,MAAM,mBAAmB,CAAC,OAAgC,cAAgD;AAE/G,8DAA+B,OAAO,WAAW,6BAAY;AAC/D;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,33 +34,33 @@ __export(react_desc_prop_types_exports, {
|
|
|
34
34
|
});
|
|
35
35
|
module.exports = __toCommonJS(react_desc_prop_types_exports);
|
|
36
36
|
var React = __toESM(require("react"));
|
|
37
|
-
var
|
|
37
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
38
38
|
const defaultProps = {
|
|
39
39
|
hasBorder: false
|
|
40
40
|
};
|
|
41
41
|
const DSCardV2PropTypes = {
|
|
42
|
-
...
|
|
43
|
-
...
|
|
42
|
+
...import_ds_props_helpers.globalAttributesPropTypes,
|
|
43
|
+
...import_ds_props_helpers.xstyledPropTypes,
|
|
44
44
|
/**
|
|
45
45
|
* Title of the card. requiered
|
|
46
46
|
*/
|
|
47
|
-
title:
|
|
47
|
+
title: import_ds_props_helpers.PropTypes.string.isRequired.description("Title of the card. requiered"),
|
|
48
48
|
/**
|
|
49
49
|
* Description of the card. not requiered
|
|
50
50
|
*/
|
|
51
|
-
description:
|
|
51
|
+
description: import_ds_props_helpers.PropTypes.string.description("Description of the card. not requiered"),
|
|
52
52
|
/**
|
|
53
53
|
* Left Addon
|
|
54
54
|
*/
|
|
55
|
-
leftAddon:
|
|
55
|
+
leftAddon: import_ds_props_helpers.PropTypes.element.description("Left Addon"),
|
|
56
56
|
/**
|
|
57
57
|
* Right addon array, max elements: 2
|
|
58
58
|
*/
|
|
59
|
-
rightAddon:
|
|
59
|
+
rightAddon: import_ds_props_helpers.PropTypes.array.description("Right addon array, max elements: 2"),
|
|
60
60
|
/**
|
|
61
61
|
* Wheter if the card has border or not
|
|
62
62
|
*/
|
|
63
|
-
hasBorder:
|
|
63
|
+
hasBorder: import_ds_props_helpers.PropTypes.bool.description("Wheter if the card has border or not").defaultValue(false)
|
|
64
64
|
};
|
|
65
65
|
const DSCardV2PropTypesSchema = DSCardV2PropTypes;
|
|
66
66
|
//# sourceMappingURL=react-desc-prop-types.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/react-desc-prop-types.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,
|
|
4
|
+
"sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSCardV2T {\n export interface RequiredProps {\n title: string;\n }\n\n export interface DefaultProps {\n hasBorder?: boolean;\n }\n\n export interface OptionalProps {\n description?: string;\n leftAddon?: JSX.Element;\n rightAddon?: JSX.Element | JSX.Element[];\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLButtonElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLButtonElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSCardV2T.DefaultProps = {\n hasBorder: false,\n};\n\nexport const DSCardV2PropTypes: DSPropTypesSchema<DSCardV2T.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n /**\n * Title of the card. requiered\n */\n title: PropTypes.string.isRequired.description('Title of the card. requiered'),\n /**\n * Description of the card. not requiered\n */\n description: PropTypes.string.description('Description of the card. not requiered'),\n /**\n * Left Addon\n */\n leftAddon: PropTypes.element.description('Left Addon'),\n /**\n * Right addon array, max elements: 2\n */\n rightAddon: PropTypes.array.description('Right addon array, max elements: 2'),\n /**\n * Wheter if the card has border or not\n */\n hasBorder: PropTypes.bool.description('Wheter if the card has border or not').defaultValue(false),\n};\n\nexport const DSCardV2PropTypesSchema = DSCardV2PropTypes as unknown as WeakValidationMap<DSCardV2T.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAuE;AAsChE,MAAM,eAAuC;AAAA,EAClD,WAAW;AACb;AAEO,MAAM,oBAAwD;AAAA,EACnE,GAAG;AAAA,EACH,GAAG;AAAA;AAAA;AAAA;AAAA,EAIH,OAAO,kCAAU,OAAO,WAAW,YAAY,8BAA8B;AAAA;AAAA;AAAA;AAAA,EAI7E,aAAa,kCAAU,OAAO,YAAY,wCAAwC;AAAA;AAAA;AAAA;AAAA,EAIlF,WAAW,kCAAU,QAAQ,YAAY,YAAY;AAAA;AAAA;AAAA;AAAA,EAIrD,YAAY,kCAAU,MAAM,YAAY,oCAAoC;AAAA;AAAA;AAAA;AAAA,EAI5E,WAAW,kCAAU,KAAK,YAAY,sCAAsC,EAAE,aAAa,KAAK;AAClG;AAEO,MAAM,0BAA0B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/DSCardV2.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { describe } from "@elliemae/ds-
|
|
3
|
+
import { describe } from "@elliemae/ds-props-helpers";
|
|
4
4
|
import { DSCardV2PropTypesSchema } from "./react-desc-prop-types.js";
|
|
5
5
|
import { useCardV2 } from "./config/useCardV2.js";
|
|
6
6
|
import { DSCardV2Name, CARD_V2_DATA_TESTID } from "./constants/index.js";
|
package/dist/esm/DSCardV2.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSCardV2.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe } from '@elliemae/ds-
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { type DSCardV2T, DSCardV2PropTypesSchema } from './react-desc-prop-types.js';\nimport { useCardV2 } from './config/useCardV2.js';\nimport { DSCardV2Name, CARD_V2_DATA_TESTID } from './constants/index.js';\nimport { DSTruncatedTooltipText, TooltipTextProvider } from '@elliemae/ds-truncated-tooltip-text';\nimport { DSHeader } from '@elliemae/ds-header';\nimport {\n CardContainer,\n LeftSection,\n LeftAddon,\n MainSection,\n Description,\n RightAddonSection,\n RightAddon,\n Separator,\n} from './styles.js';\n\nconst getCol = (rightAddon: DSCardV2T.OptionalProps['rightAddon']) => {\n if (!rightAddon) return ['1fr'];\n return ['1fr', 'auto'];\n};\n\nconst DSCardV2: React.ComponentType<DSCardV2T.Props> = (props) => {\n const { propsWithDefault, globalProps, xstyledProps } = useCardV2(props);\n const { hasBorder, title, leftAddon, rightAddon, description } = propsWithDefault;\n return (\n <TooltipTextProvider>\n <CardContainer\n data-testid={CARD_V2_DATA_TESTID.CARD_CONTAINER} //we must keep this explicit to avoid the breaking changes\n {...globalProps}\n {...xstyledProps}\n hasBorder={hasBorder}\n cols={getCol(rightAddon)}\n >\n <LeftSection>\n {leftAddon && <LeftAddon>{leftAddon}</LeftAddon>}\n <MainSection\n style={{\n maxWidth: leftAddon ? 'calc(100% - 40px)' : '100%',\n }}\n >\n <DSHeader\n data-testid={CARD_V2_DATA_TESTID.CARD_HEADER} //we must keep this explicit to avoid the breaking changes\n fontSize=\"16px\"\n fontWeight=\"regular\"\n color=\"neutral.800\"\n text={<DSTruncatedTooltipText value={title} />}\n />\n {description && (\n <Description>\n <DSTruncatedTooltipText value={description} />\n </Description>\n )}\n </MainSection>\n </LeftSection>\n {Array.isArray(rightAddon) && (\n <RightAddonSection>\n {rightAddon[0] ? <RightAddon>{rightAddon[0]}</RightAddon> : null}\n {rightAddon[1] ? (\n <>\n {rightAddon.length > 1 && <Separator />}\n <RightAddon>{rightAddon[1]}</RightAddon>\n </>\n ) : null}\n </RightAddonSection>\n )}\n </CardContainer>\n </TooltipTextProvider>\n );\n};\n\nDSCardV2.displayName = DSCardV2Name;\nconst DSCardV2WithSchema = describe(DSCardV2);\nDSCardV2WithSchema.propTypes = DSCardV2PropTypesSchema;\n\nexport { DSCardV2, DSCardV2WithSchema };\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACoCC,SAwBV,UAxBU,KACd,YADc;AAnCxB,SAAS,gBAAgB;AACzB,SAAyB,+BAA+B;AACxD,SAAS,iBAAiB;AAC1B,SAAS,cAAc,2BAA2B;AAClD,SAAS,wBAAwB,2BAA2B;AAC5D,SAAS,gBAAgB;AACzB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,SAAS,CAAC,eAAsD;AACpE,MAAI,CAAC,WAAY,QAAO,CAAC,KAAK;AAC9B,SAAO,CAAC,OAAO,MAAM;AACvB;AAEA,MAAM,WAAiD,CAAC,UAAU;AAChE,QAAM,EAAE,kBAAkB,aAAa,aAAa,IAAI,UAAU,KAAK;AACvE,QAAM,EAAE,WAAW,OAAO,WAAW,YAAY,YAAY,IAAI;AACjE,SACE,oBAAC,uBACC;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,oBAAoB;AAAA,MAChC,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA,MAAM,OAAO,UAAU;AAAA,MAEvB;AAAA,6BAAC,eACE;AAAA,uBAAa,oBAAC,aAAW,qBAAU;AAAA,UACpC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,gBACL,UAAU,YAAY,sBAAsB;AAAA,cAC9C;AAAA,cAEA;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,eAAa,oBAAoB;AAAA,oBACjC,UAAS;AAAA,oBACT,YAAW;AAAA,oBACX,OAAM;AAAA,oBACN,MAAM,oBAAC,0BAAuB,OAAO,OAAO;AAAA;AAAA,gBAC9C;AAAA,gBACC,eACC,oBAAC,eACC,8BAAC,0BAAuB,OAAO,aAAa,GAC9C;AAAA;AAAA;AAAA,UAEJ;AAAA,WACF;AAAA,QACC,MAAM,QAAQ,UAAU,KACvB,qBAAC,qBACE;AAAA,qBAAW,CAAC,IAAI,oBAAC,cAAY,qBAAW,CAAC,GAAE,IAAgB;AAAA,UAC3D,WAAW,CAAC,IACX,iCACG;AAAA,uBAAW,SAAS,KAAK,oBAAC,aAAU;AAAA,YACrC,oBAAC,cAAY,qBAAW,CAAC,GAAE;AAAA,aAC7B,IACE;AAAA,WACN;AAAA;AAAA;AAAA,EAEJ,GACF;AAEJ;AAEA,SAAS,cAAc;AACvB,MAAM,qBAAqB,SAAS,QAAQ;AAC5C,mBAAmB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import React2 from "react";
|
|
3
|
-
import { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from "@elliemae/ds-
|
|
3
|
+
import { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from "@elliemae/ds-props-helpers";
|
|
4
4
|
import { uid } from "uid";
|
|
5
5
|
import { DSCardV2PropTypes, defaultProps } from "../react-desc-prop-types.js";
|
|
6
6
|
import { useValidateProps } from "./useValidateProps.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useCardV2.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { uid } from 'uid';\nimport { type DSCardV2T, DSCardV2PropTypes, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\nimport type { DSGridT } from '@elliemae/ds-grid';\n\nexport interface CardV2CTX {\n propsWithDefault: DSCardV2T.InternalProps;\n globalProps: ReturnType<typeof useGetGlobalAttributes>;\n xstyledProps: ReturnType<typeof useGetXstyledProps>;\n instanceUid: string;\n}\n\nexport const useCardV2 = (propsFromUser: DSCardV2T.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSCardV2T.InternalProps>(propsFromUser, defaultProps);\n useValidateProps(propsWithDefault, DSCardV2PropTypes);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const globalProps = useGetGlobalAttributes<DSCardV2T.InternalProps, HTMLDivElement, DSGridT.Props>(propsWithDefault);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const { id } = propsWithDefault;\n const instanceUid = React.useMemo(() => id || uid(5), [id]);\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n // const eventHandlers = useEventHandlers({ propsWithDefault, instanceUid }); // <-- complex logic should be made atomics this way\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n globalProps,\n xstyledProps,\n instanceUid,\n // ...eventHandlers,\n }),\n [\n propsWithDefault,\n globalProps,\n xstyledProps,\n instanceUid,\n // eventHandlers,\n ],\n );\n};\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,wBAAwB,oBAAoB,oCAAoC;AACzF,SAAS,WAAW;AACpB,SAAyB,mBAAmB,oBAAoB;AAChE,SAAS,wBAAwB;AAU1B,MAAM,YAAY,CAAC,kBAAmC;AAI3D,QAAM,mBAAmB,6BAAsD,eAAe,YAAY;AAC1G,mBAAiB,kBAAkB,iBAAiB;AAIpD,QAAM,cAAc,uBAA+E,gBAAgB;AACnH,QAAM,eAAe,mBAAmB,gBAAgB;AAKxD,QAAM,EAAE,GAAG,IAAI;AACf,QAAM,cAAcA,OAAM,QAAQ,MAAM,MAAM,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AAM1D,SAAOA,OAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { useValidateTypescriptPropTypes } from "@elliemae/ds-
|
|
2
|
+
import { useValidateTypescriptPropTypes } from "@elliemae/ds-props-helpers";
|
|
3
3
|
import { DSCardV2Name } from "../constants/index.js";
|
|
4
4
|
const useValidateProps = (props, propTypes) => {
|
|
5
5
|
useValidateTypescriptPropTypes(props, propTypes, DSCardV2Name);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useValidateProps.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useValidateTypescriptPropTypes } from '@elliemae/ds-
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { WeakValidationMap } from 'react';\nimport { type DSCardV2T } from '../react-desc-prop-types.js';\nimport { DSCardV2Name } from '../constants/index.js';\n\nexport const useValidateProps = (props: DSCardV2T.InternalProps, propTypes: WeakValidationMap<unknown>): void => {\n // we validate the \"required if\" via 'isRequiredIf from our custom PropTypes\n useValidateTypescriptPropTypes(props, propTypes, DSCardV2Name);\n};\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,sCAAsC;AAG/C,SAAS,oBAAoB;AAEtB,MAAM,mBAAmB,CAAC,OAAgC,cAAgD;AAE/G,iCAA+B,OAAO,WAAW,YAAY;AAC/D;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from "@elliemae/ds-
|
|
2
|
+
import { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from "@elliemae/ds-props-helpers";
|
|
3
3
|
const defaultProps = {
|
|
4
4
|
hasBorder: false
|
|
5
5
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSCardV2T {\n export interface RequiredProps {\n title: string;\n }\n\n export interface DefaultProps {\n hasBorder?: boolean;\n }\n\n export interface OptionalProps {\n description?: string;\n leftAddon?: JSX.Element;\n rightAddon?: JSX.Element | JSX.Element[];\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLButtonElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLButtonElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSCardV2T.DefaultProps = {\n hasBorder: false,\n};\n\nexport const DSCardV2PropTypes: DSPropTypesSchema<DSCardV2T.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n /**\n * Title of the card. requiered\n */\n title: PropTypes.string.isRequired.description('Title of the card. requiered'),\n /**\n * Description of the card. not requiered\n */\n description: PropTypes.string.description('Description of the card. not requiered'),\n /**\n * Left Addon\n */\n leftAddon: PropTypes.element.description('Left Addon'),\n /**\n * Right addon array, max elements: 2\n */\n rightAddon: PropTypes.array.description('Right addon array, max elements: 2'),\n /**\n * Wheter if the card has border or not\n */\n hasBorder: PropTypes.bool.description('Wheter if the card has border or not').defaultValue(false),\n};\n\nexport const DSCardV2PropTypesSchema = DSCardV2PropTypes as unknown as WeakValidationMap<DSCardV2T.Props>;\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,WAAW,2BAA2B,wBAAwB;AAsChE,MAAM,eAAuC;AAAA,EAClD,WAAW;AACb;AAEO,MAAM,oBAAwD;AAAA,EACnE,GAAG;AAAA,EACH,GAAG;AAAA;AAAA;AAAA;AAAA,EAIH,OAAO,UAAU,OAAO,WAAW,YAAY,8BAA8B;AAAA;AAAA;AAAA;AAAA,EAI7E,aAAa,UAAU,OAAO,YAAY,wCAAwC;AAAA;AAAA;AAAA;AAAA,EAIlF,WAAW,UAAU,QAAQ,YAAY,YAAY;AAAA;AAAA;AAAA;AAAA,EAIrD,YAAY,UAAU,MAAM,YAAY,oCAAoC;AAAA;AAAA;AAAA;AAAA,EAI5E,WAAW,UAAU,KAAK,YAAY,sCAAsC,EAAE,aAAa,KAAK;AAClG;AAEO,MAAM,0BAA0B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { type DSCardV2T } from './react-desc-prop-types.js';
|
|
3
|
+
declare const DSCardV2: React.ComponentType<DSCardV2T.Props>;
|
|
4
|
+
declare const DSCardV2WithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").DocumentedReactComponent<DSCardV2T.Props>;
|
|
5
|
+
export { DSCardV2, DSCardV2WithSchema };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-
|
|
2
|
+
import { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';
|
|
3
3
|
import { type DSCardV2T } from '../react-desc-prop-types.js';
|
|
4
4
|
import type { DSGridT } from '@elliemae/ds-grid';
|
|
5
5
|
export interface CardV2CTX {
|
|
@@ -375,6 +375,6 @@ export declare const useCardV2: (propsFromUser: DSCardV2T.Props) => {
|
|
|
375
375
|
wmode?: string | undefined;
|
|
376
376
|
wrap?: string | undefined;
|
|
377
377
|
}, keyof DSGridT.Props>>;
|
|
378
|
-
xstyledProps: import("@elliemae/ds-
|
|
378
|
+
xstyledProps: import("@elliemae/ds-props-helpers").XstyledProps;
|
|
379
379
|
instanceUid: string;
|
|
380
380
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { WeakValidationMap } from 'react';
|
|
2
|
-
import type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-
|
|
2
|
+
import type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';
|
|
3
3
|
export declare namespace DSCardV2T {
|
|
4
4
|
interface RequiredProps {
|
|
5
5
|
title: string;
|
|
@@ -8,9 +8,9 @@ export declare namespace DSCardV2T {
|
|
|
8
8
|
hasBorder?: boolean;
|
|
9
9
|
}
|
|
10
10
|
interface OptionalProps {
|
|
11
|
-
description
|
|
12
|
-
leftAddon
|
|
13
|
-
rightAddon
|
|
11
|
+
description?: string;
|
|
12
|
+
leftAddon?: JSX.Element;
|
|
13
|
+
rightAddon?: JSX.Element | JSX.Element[];
|
|
14
14
|
}
|
|
15
15
|
interface Props extends Partial<DefaultProps>, OptionalProps, Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps>, XstyledProps, RequiredProps {
|
|
16
16
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-card-v2",
|
|
3
|
-
"version": "3.37.0
|
|
3
|
+
"version": "3.37.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Card V2",
|
|
6
6
|
"files": [
|
|
@@ -50,21 +50,21 @@
|
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"lodash": "~4.17.21",
|
|
52
52
|
"uid": "~2.0.1",
|
|
53
|
-
"@elliemae/ds-button": "3.37.0
|
|
54
|
-
"@elliemae/ds-
|
|
55
|
-
"@elliemae/ds-
|
|
56
|
-
"@elliemae/ds-icons": "3.37.0
|
|
57
|
-
"@elliemae/ds-
|
|
58
|
-
"@elliemae/ds-
|
|
59
|
-
"@elliemae/ds-
|
|
60
|
-
"@elliemae/ds-
|
|
61
|
-
"@elliemae/ds-
|
|
53
|
+
"@elliemae/ds-button": "3.37.0",
|
|
54
|
+
"@elliemae/ds-controlled-form": "3.37.0",
|
|
55
|
+
"@elliemae/ds-header": "3.37.0",
|
|
56
|
+
"@elliemae/ds-icons": "3.37.0",
|
|
57
|
+
"@elliemae/ds-props-helpers": "3.37.0",
|
|
58
|
+
"@elliemae/ds-grid": "3.37.0",
|
|
59
|
+
"@elliemae/ds-separator": "3.37.0",
|
|
60
|
+
"@elliemae/ds-system": "3.37.0",
|
|
61
|
+
"@elliemae/ds-truncated-tooltip-text": "3.37.0"
|
|
62
62
|
},
|
|
63
63
|
"devDependencies": {
|
|
64
64
|
"@elliemae/pui-cli": "9.0.0-next.50",
|
|
65
65
|
"@xstyled/system": "3.7.0",
|
|
66
66
|
"styled-components": "~5.3.9",
|
|
67
|
-
"@elliemae/ds-monorepo-devops": "3.37.0
|
|
67
|
+
"@elliemae/ds-monorepo-devops": "3.37.0"
|
|
68
68
|
},
|
|
69
69
|
"peerDependencies": {
|
|
70
70
|
"lodash": "^4.17.21",
|