@xfers/design-system 2.4.0 → 2.4.1
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/cjs/index.js +2 -2
- package/cjs/index.js.map +1 -1
- package/dist/components/Card/index.js +1 -1
- package/dist/components/Card/index.js.map +1 -1
- package/dist/components/SummaryCard/index.js +10 -4
- package/dist/components/SummaryCard/index.js.map +1 -1
- package/dist/types/components/SummaryCard/index.d.ts +4 -2
- package/es/index.js +2 -2
- package/es/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -35,7 +35,7 @@ var themeContext_1 = require("src/shared/themeContext");
|
|
|
35
35
|
var CustomCard = function (_a) {
|
|
36
36
|
var className = _a.className, _b = _a.alignTitle, alignTitle = _b === void 0 ? 'center' : _b, _c = _a.alignBody, alignBody = _c === void 0 ? 'left' : _c, _d = _a.type, type = _d === void 0 ? 'default' : _d, restProps = __rest(_a, ["className", "alignTitle", "alignBody", "type"]);
|
|
37
37
|
var _e = themeContext_1.useTheme(), card = _e.card, text = _e.text, neutral = _e.neutral;
|
|
38
|
-
var textColor = "\n color: " + (type === 'default' ? text.default : text.white) + ";\n\n & > div {\n color: " + (type === 'default' ? text.default : text.white) + ";\n }\n\n h1 {\n color: " + (type === 'default' ? text.default : text.white) + ";\n }\n ";
|
|
38
|
+
var textColor = "\n color: " + (type === 'default' ? text.default : text.white) + ";\n\n & > div > div {\n color: " + (type === 'default' ? text.default : text.white) + ";\n }\n\n h1 {\n color: " + (type === 'default' ? text.default : text.white) + ";\n }\n ";
|
|
39
39
|
var baseStyle = emotion_1.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n background: ", " !important;\n\n & > .ant-card-head {\n padding: 0 15px;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n ", ";\n\n .ant-card-head-title {\n padding: 15px 0;\n white-space: normal;\n ", ";\n }\n\n .ant-card-extra {\n padding: 15px 0;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n ", ";\n }\n }\n\n & > .ant-card-body {\n padding: 15px;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n ", ";\n }\n "], ["\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n background: ",
|
|
40
40
|
" !important;\n\n & > .ant-card-head {\n padding: 0 15px;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n ", ";\n\n .ant-card-head-title {\n padding: 15px 0;\n white-space: normal;\n ", ";\n }\n\n .ant-card-extra {\n padding: 15px 0;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n ", ";\n }\n }\n\n & > .ant-card-body {\n padding: 15px;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n ", ";\n }\n "])), neutral.border, type === 'default'
|
|
41
41
|
? card.background.default
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Card/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAyB;AACzB,qCAA8C;AAC9C,kCAA+B;AAC/B,mCAAiC;AACjC,gEAIoC;AACpC,wDAAkD;AAWlD,IAAM,UAAU,GAAG,UAAC,EAMF;IALhB,IAAA,SAAS,eAAA,EACT,kBAAqB,EAArB,UAAU,mBAAG,QAAQ,KAAA,EACrB,iBAAkB,EAAlB,SAAS,mBAAG,MAAM,KAAA,EAClB,YAAgB,EAAhB,IAAI,mBAAG,SAAS,KAAA,EACb,SAAS,cALM,gDAMnB,CADa;IAEN,IAAA,KAA0B,uBAAQ,EAAE,EAAlC,IAAI,UAAA,EAAE,IAAI,UAAA,EAAE,OAAO,aAAe,CAAA;IAE1C,IAAM,SAAS,GAAG,mBACP,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Card/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAyB;AACzB,qCAA8C;AAC9C,kCAA+B;AAC/B,mCAAiC;AACjC,gEAIoC;AACpC,wDAAkD;AAWlD,IAAM,UAAU,GAAG,UAAC,EAMF;IALhB,IAAA,SAAS,eAAA,EACT,kBAAqB,EAArB,UAAU,mBAAG,QAAQ,KAAA,EACrB,iBAAkB,EAAlB,SAAS,mBAAG,MAAM,KAAA,EAClB,YAAgB,EAAhB,IAAI,mBAAG,SAAS,KAAA,EACb,SAAS,cALM,gDAMnB,CADa;IAEN,IAAA,KAA0B,uBAAQ,EAAE,EAAlC,IAAI,UAAA,EAAE,IAAI,UAAA,EAAE,OAAO,aAAe,CAAA;IAE1C,IAAM,SAAS,GAAG,mBACP,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,iDAG5C,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,6CAI9C,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,kBAE1D,CAAA;IAED,IAAM,SAAS,GAAG,aAAG,owBAAA,iGAIH,EAAc,qBAChB;QAEU,uFAIP,EAAgB,sBAClB,EAAmB,wBACjB,EAAqB,WAClC,EAAS,qGAKP,EAAS,wFAKI,EAAgB,wBAClB,EAAmB,0BACjB,EAAqB,aAClC,EAAS,0FAME,EAAmB,sBACrB,EAAmB,wBACjB,EAAqB,WAClC,EAAS,cAEd,KAlCiB,OAAO,CAAC,MAAM,EAChB,IAAI,KAAK,SAAS;QAC9B,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO;QACzB,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,EAIP,8BAAW,CAAC,IAAI,EAClB,4BAAS,CAAC,SAAS,EACjB,8BAAW,CAAC,SAAS,EAClC,SAAS,EAKP,SAAS,EAKI,8BAAW,CAAC,IAAI,EAClB,4BAAS,CAAC,SAAS,EACjB,8BAAW,CAAC,SAAS,EAClC,SAAS,EAME,8BAAW,CAAC,OAAO,EACrB,4BAAS,CAAC,SAAS,EACjB,8BAAW,CAAC,SAAS,EAClC,SAAS,CAEd,CAAA;IAED,IAAM,eAAe,GAAG,UAAC,KAAa,IAAK,OAAA,aAAG,wIAAA,qDAE3B,EAAK,cAEvB,KAFkB,KAAK,GAFmB,CAI1C,CAAA;IAED,IAAM,cAAc,GAAG,UAAC,KAAa,IAAK,OAAA,aAAG,+HAAA,4CAE3B,EAAK,cAEtB,KAFiB,KAAK,GAFmB,CAIzC,CAAA;IAED,OAAO,CACL,8BAAC,cAAI,aACH,SAAS,EAAE,YAAE,CACX,SAAS,EACT,SAAS,EACT,eAAe,CAAC,UAAU,CAAC,EAC3B,cAAc,CAAC,SAAS,CAAC,CAC1B,IACG,SAAS,EACb,CACH,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,UAAU,CAAA"}
|
|
@@ -9,11 +9,17 @@ var styled_1 = require("@emotion/styled");
|
|
|
9
9
|
var Typography_1 = require("src/components/Typography");
|
|
10
10
|
var Card_1 = require("src/components/Card");
|
|
11
11
|
var SummaryCard = function (_a) {
|
|
12
|
-
var label = _a.label, amount = _a.amount, _b = _a.type, type = _b === void 0 ? 'default' : _b, _c = _a.height, height = _c === void 0 ? 91 : _c, _d = _a.width, width = _d === void 0 ? 230 : _d;
|
|
13
|
-
var StyledSummaryCard = styled_1.default(Card_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: ", "
|
|
12
|
+
var label = _a.label, amount = _a.amount, _b = _a.type, type = _b === void 0 ? 'default' : _b, _c = _a.height, height = _c === void 0 ? 91 : _c, _d = _a.width, width = _d === void 0 ? 230 : _d, _e = _a.isInverted, isInverted = _e === void 0 ? false : _e, icon = _a.icon;
|
|
13
|
+
var StyledSummaryCard = styled_1.default(Card_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: ", ";\n min-height: ", "px;\n padding: 3px !important;\n border-radius: 5px !important;\n\n ", "\n\n ", "\n "], ["\n width: ", ";\n min-height: ", "px;\n padding: 3px !important;\n border-radius: 5px !important;\n\n ",
|
|
14
|
+
"\n\n ",
|
|
15
|
+
"\n "])), typeof width === 'number' ? width + "px" : width, height, icon &&
|
|
16
|
+
"\n & > .ant-card-body {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n }\n ", isInverted &&
|
|
17
|
+
"\n & > .ant-card-body > div {\n display: flex !important;\n flex-direction: column-reverse !important;\n }\n ");
|
|
14
18
|
return (react_1.default.createElement(StyledSummaryCard, { type: type },
|
|
15
|
-
|
|
16
|
-
react_1.default.createElement(
|
|
19
|
+
icon && icon,
|
|
20
|
+
react_1.default.createElement("div", null,
|
|
21
|
+
react_1.default.createElement(Typography_1.P1, { style: { marginBottom: isInverted ? '0' : '5px' } }, label),
|
|
22
|
+
react_1.default.createElement(Typography_1.H1, { style: { marginBottom: isInverted ? '5px' : '0' } }, amount))));
|
|
17
23
|
};
|
|
18
24
|
exports.default = SummaryCard;
|
|
19
25
|
var templateObject_1;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SummaryCard/index.tsx"],"names":[],"mappings":";;;;;;AAAA,+BAAyB;AACzB,0CAAoC;AACpC,wDAAkD;AAElD,4CAAsC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SummaryCard/index.tsx"],"names":[],"mappings":";;;;;;AAAA,+BAAyB;AACzB,0CAAoC;AACpC,wDAAkD;AAElD,4CAAsC;AAYtC,IAAM,WAAW,GAAG,UAAC,EAQF;QAPjB,KAAK,WAAA,EACL,MAAM,YAAA,EACN,YAAgB,EAAhB,IAAI,mBAAG,SAAS,KAAA,EAChB,cAAW,EAAX,MAAM,mBAAG,EAAE,KAAA,EACX,aAAW,EAAX,KAAK,mBAAG,GAAG,KAAA,EACX,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,IAAI,UAAA;IAEJ,IAAM,iBAAiB,GAAG,gBAAM,CAAC,cAAI,CAAC,8MAAA,eAC3B,EAAgD,qBAC3C,EAAM,+EAIlB;QAOD,UAEC;QAMD,MACF,KArBU,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAI,KAAK,OAAI,CAAC,CAAC,CAAC,KAAK,EAC3C,MAAM,EAIlB,IAAI;QACJ,kKAMD,EAEC,UAAU;QACV,0IAKD,CACF,CAAA;IAED,OAAO,CACL,8BAAC,iBAAiB,IAAC,IAAI,EAAE,IAAI;QAC1B,IAAI,IAAI,IAAI;QACb;YACE,8BAAC,eAAE,IAAC,KAAK,EAAE,EAAE,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,IAAG,KAAK,CAAM;YACnE,8BAAC,eAAE,IAAC,KAAK,EAAE,EAAE,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,EAAE,IAAG,MAAM,CAAM,CAChE,CACY,CACrB,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,WAAW,CAAA"}
|
|
@@ -4,7 +4,9 @@ declare type SummaryCardProps = {
|
|
|
4
4
|
amount: React.ReactNode;
|
|
5
5
|
type?: 'default' | 'dark';
|
|
6
6
|
height?: number;
|
|
7
|
-
width?: number;
|
|
7
|
+
width?: number | string;
|
|
8
|
+
isInverted?: boolean;
|
|
9
|
+
icon?: React.ReactElement;
|
|
8
10
|
};
|
|
9
|
-
declare const SummaryCard: ({ label, amount, type, height, width }: SummaryCardProps) => JSX.Element;
|
|
11
|
+
declare const SummaryCard: ({ label, amount, type, height, width, isInverted, icon }: SummaryCardProps) => JSX.Element;
|
|
10
12
|
export default SummaryCard;
|