@elliemae/ds-card 2.2.0-alpha.3 → 3.0.0-next.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.
@@ -1,156 +1,200 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
19
- };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var DetailCard_exports = {};
29
- __export(DetailCard_exports, {
30
- DSCardDetailWithSchema: () => DSCardDetailWithSchema,
31
- DetailCard: () => DetailCard,
32
- default: () => DetailCard_default
33
- });
34
- var React = __toESM(require("react"));
35
- var import_react = __toESM(require("react"));
36
- var import_lodash = __toESM(require("lodash"));
37
- var import_react_desc = __toESM(require("react-desc"));
38
- var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
39
- var import_ds_system = __toESM(require("@elliemae/ds-system"));
40
- var import_ds_button = __toESM(require("@elliemae/ds-button"));
41
- var import_ds_separator = __toESM(require("@elliemae/ds-separator"));
42
- var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
43
- var import_ds_form = __toESM(require("@elliemae/ds-form"));
44
- var import_styled = __toESM(require("./styled"));
45
- const DetailCard = ({
46
- title,
47
- description,
48
- descriptionColor = "neutral",
49
- rightValue,
50
- rightDescription,
51
- rightAddon,
52
- selectable = false,
53
- isSelected = false,
54
- onSelect = import_lodash.noop,
55
- expandable = false,
56
- isExpanded = false,
57
- onExpand = import_lodash.noop,
58
- expandContent,
59
- readOnly = false,
60
- disabled = false
61
- }) => {
62
- const theme = (0, import_ds_system.useTheme)();
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('react');
7
+ var lodash = require('lodash');
8
+ var reactDesc = require('react-desc');
9
+ var dsIcons = require('@elliemae/ds-icons');
10
+ var dsSystem = require('@elliemae/ds-system');
11
+ var DSButton = require('@elliemae/ds-button');
12
+ var DSSeparator = require('@elliemae/ds-separator');
13
+ var dsGrid = require('@elliemae/ds-grid');
14
+ var dsForm = require('@elliemae/ds-form');
15
+ var styled = require('./styled.js');
16
+ var jsxRuntime = require('react/jsx-runtime');
17
+
18
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
19
+
20
+ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
21
+ var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
22
+ var DSSeparator__default = /*#__PURE__*/_interopDefaultLegacy(DSSeparator);
23
+
24
+ var _Grid, _DSSeparator;
25
+
26
+ const DetailCard = _ref => {
27
+ let {
28
+ title,
29
+ description,
30
+ descriptionColor = 'neutral',
31
+ rightValue,
32
+ rightDescription,
33
+ rightAddon,
34
+ // select props
35
+ selectable = false,
36
+ isSelected = false,
37
+ onSelect = lodash.noop,
38
+ // expand props
39
+ expandable = false,
40
+ isExpanded = false,
41
+ onExpand = lodash.noop,
42
+ expandContent,
43
+ // state props
44
+ readOnly = false,
45
+ disabled = false
46
+ } = _ref;
47
+ const theme = dsSystem.useTheme();
63
48
  const hasRightLegend = rightValue && rightDescription;
64
49
  const hasRightPosition = hasRightLegend || rightAddon;
65
- const topWrapperCols = ["1fr"];
66
- if (hasRightPosition)
67
- topWrapperCols.push("auto");
68
- if (expandable)
69
- topWrapperCols.unshift("20px");
70
- if (selectable)
71
- topWrapperCols.unshift(theme.space.s);
72
- return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styled.Container, {
73
- disabled: disabled || readOnly,
74
- active: selectable && isSelected,
75
- "data-testid": "card-detail-container"
76
- }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
77
- cols: topWrapperCols,
78
- alignItems: !description && "center"
79
- }, selectable && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
80
- pt: description && "9px"
81
- }, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSCheckbox, {
82
- checked: isSelected,
83
- onChange: onSelect,
84
- readOnly,
85
- disabled,
86
- "data-testid": "card-checkbox"
87
- })), expandable && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
88
- height: "16px",
89
- pt: description && "xxs",
90
- mt: !description && "-5px"
91
- }, /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
92
- size: "s",
93
- buttonType: "text",
94
- containerProps: {
95
- "data-testid": "expand-button"
96
- },
97
- onClick: onExpand,
98
- icon: isExpanded ? /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ArrowheadDown, {
99
- color: ["neutral", 500],
100
- size: "s"
101
- }) : /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ArrowheadRight, {
102
- color: ["neutral", 500],
103
- size: "s"
104
- }),
105
- disabled
106
- })), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
107
- pr: "24px"
108
- }, /* @__PURE__ */ import_react.default.createElement(import_styled.Title, null, title), description && /* @__PURE__ */ import_react.default.createElement(import_styled.Description, {
109
- descriptionColor
110
- }, description)), hasRightPosition && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
111
- cols: (0, import_lodash.compact)([hasRightPosition && "auto", rightAddon && "auto"])
112
- }, hasRightLegend && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
113
- pr: "24px",
114
- rows: ["auto", "auto", 1]
115
- }, /* @__PURE__ */ import_react.default.createElement(import_styled.RightDescription, {
116
- justifyContent: "flex-end"
117
- }, rightDescription), /* @__PURE__ */ import_react.default.createElement(import_styled.RightValue, {
118
- justifyContent: "flex-end"
119
- }, rightValue), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null)), rightAddon && /* @__PURE__ */ import_react.default.createElement(import_styled.RightAddon, {
120
- cols: ["auto", "auto"],
121
- gutter: "2px"
122
- }, rightAddon))), expandContent && isExpanded && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
123
- ml: selectable && "s",
124
- mr: rightAddon && "xs"
125
- }, /* @__PURE__ */ import_react.default.createElement(import_ds_separator.default, {
126
- dashed: true,
127
- position: "initial",
128
- margin: "none"
129
- }), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
130
- pt: "xxs",
131
- "data-testid": "detail-card-expanded-content"
132
- }, expandContent))));
50
+ const topWrapperCols = ['1fr'];
51
+ if (hasRightPosition) topWrapperCols.push('auto');
52
+ if (expandable) topWrapperCols.unshift('20px');
53
+ if (selectable) topWrapperCols.unshift(theme.space.s);
54
+ return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
55
+ children: /*#__PURE__*/_jsx__default["default"](styled.Container, {
56
+ disabled: disabled || readOnly,
57
+ active: selectable && isSelected,
58
+ "data-testid": "card-detail-container"
59
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
60
+ cols: topWrapperCols,
61
+ alignItems: !description && 'center'
62
+ }, void 0, selectable && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
63
+ pt: description && '9px'
64
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSCheckbox, {
65
+ checked: isSelected,
66
+ onChange: onSelect,
67
+ readOnly: readOnly,
68
+ disabled: disabled,
69
+ "data-testid": "card-checkbox"
70
+ })), expandable && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
71
+ height: "16px",
72
+ pt: description && 'xxs',
73
+ mt: !description && '-5px'
74
+ }, void 0, /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
75
+ size: "s",
76
+ buttonType: "text",
77
+ containerProps: {
78
+ 'data-testid': 'expand-button'
79
+ },
80
+ onClick: onExpand,
81
+ icon: isExpanded ? /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadDown, {
82
+ color: ['neutral', 500],
83
+ size: "s"
84
+ }) : /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadRight, {
85
+ color: ['neutral', 500],
86
+ size: "s"
87
+ }),
88
+ disabled: disabled
89
+ })), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
90
+ pr: "24px"
91
+ }, void 0, /*#__PURE__*/_jsx__default["default"](styled.Title, {}, void 0, title), description && /*#__PURE__*/_jsx__default["default"](styled.Description, {
92
+ descriptionColor: descriptionColor
93
+ }, void 0, description)), hasRightPosition && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
94
+ cols: lodash.compact([hasRightPosition && 'auto', rightAddon && 'auto'])
95
+ }, void 0, hasRightLegend && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
96
+ pr: "24px",
97
+ rows: ['auto', 'auto', 1]
98
+ }, void 0, /*#__PURE__*/_jsx__default["default"](styled.RightDescription, {
99
+ justifyContent: "flex-end"
100
+ }, void 0, rightDescription), /*#__PURE__*/_jsx__default["default"](styled.RightValue, {
101
+ justifyContent: "flex-end"
102
+ }, void 0, rightValue), _Grid || (_Grid = /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}))), rightAddon && /*#__PURE__*/_jsx__default["default"](styled.RightAddon, {
103
+ cols: ['auto', 'auto'],
104
+ gutter: "2px"
105
+ }, void 0, rightAddon))), expandContent && isExpanded && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
106
+ ml: selectable && 's',
107
+ mr: rightAddon && 'xs'
108
+ }, void 0, _DSSeparator || (_DSSeparator = /*#__PURE__*/_jsx__default["default"](DSSeparator__default["default"], {
109
+ dashed: true,
110
+ position: "initial",
111
+ margin: "none"
112
+ })), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
113
+ pt: "xxs",
114
+ "data-testid": "detail-card-expanded-content"
115
+ }, void 0, expandContent)))
116
+ });
133
117
  };
118
+
134
119
  const detailProps = {
135
- title: import_react_desc.PropTypes.string.isRequired.description("Title of the card."),
136
- description: import_react_desc.PropTypes.string.description("Description of the card."),
137
- descriptionColor: import_react_desc.PropTypes.oneOf(["primary", "neutral"]).description("Description color."),
138
- rightValue: import_react_desc.PropTypes.string.description("Right value (should be used with `rightDescription`)"),
139
- rightDescription: import_react_desc.PropTypes.string.description("Right description (should be used with `rightValue`)"),
140
- rightAddon: import_react_desc.PropTypes.element.description("Right addon array, max elements: 2"),
141
- selectable: import_react_desc.PropTypes.bool.description("Whether if the card is selectable or not"),
142
- isSelected: import_react_desc.PropTypes.bool.description("Whether if the card is selected or not"),
143
- onSelect: import_react_desc.PropTypes.func.description("Callback on selection"),
144
- expandable: import_react_desc.PropTypes.bool.description("Whether if the card is expandable or not"),
145
- isExpanded: import_react_desc.PropTypes.bool.description("Whether if the card is expanded or not"),
146
- onExpand: import_react_desc.PropTypes.func.description("Callback on expand"),
147
- expandContent: import_react_desc.PropTypes.element.description("Content"),
148
- readOnly: import_react_desc.PropTypes.bool.description("Read only"),
149
- disabled: import_react_desc.PropTypes.bool.description("Disabled")
120
+ /**
121
+ * Title of the card.
122
+ */
123
+ title: reactDesc.PropTypes.string.isRequired.description('Title of the card.'),
124
+
125
+ /**
126
+ * Description of the card.
127
+ */
128
+ description: reactDesc.PropTypes.string.description('Description of the card.'),
129
+
130
+ /**
131
+ * Description color.
132
+ */
133
+ descriptionColor: reactDesc.PropTypes.oneOf(['primary', 'neutral']).description('Description color.'),
134
+
135
+ /**
136
+ * Right value (should be used with `rightDescription`)
137
+ */
138
+ rightValue: reactDesc.PropTypes.string.description('Right value (should be used with `rightDescription`)'),
139
+
140
+ /**
141
+ * Right description (should be used with `rightValue`)
142
+ */
143
+ rightDescription: reactDesc.PropTypes.string.description('Right description (should be used with `rightValue`)'),
144
+
145
+ /**
146
+ * Right addon array, max elements: 2
147
+ */
148
+ rightAddon: reactDesc.PropTypes.element.description('Right addon array, max elements: 2'),
149
+
150
+ /**
151
+ * Whether if the card is selectable or not
152
+ */
153
+ selectable: reactDesc.PropTypes.bool.description('Whether if the card is selectable or not'),
154
+
155
+ /**
156
+ * Whether if the card is selected or not
157
+ */
158
+ isSelected: reactDesc.PropTypes.bool.description('Whether if the card is selected or not'),
159
+
160
+ /**
161
+ * Callback on selection
162
+ */
163
+ onSelect: reactDesc.PropTypes.func.description('Callback on selection'),
164
+
165
+ /**
166
+ * Whether if the card is expandable or not
167
+ */
168
+ expandable: reactDesc.PropTypes.bool.description('Whether if the card is expandable or not'),
169
+
170
+ /**
171
+ * Whether if the card is expanded or not
172
+ */
173
+ isExpanded: reactDesc.PropTypes.bool.description('Whether if the card is expanded or not'),
174
+
175
+ /**
176
+ * Callback on expand
177
+ */
178
+ onExpand: reactDesc.PropTypes.func.description('Callback on expand'),
179
+
180
+ /**
181
+ * Content
182
+ */
183
+ expandContent: reactDesc.PropTypes.element.description('Content'),
184
+
185
+ /**
186
+ * Read only
187
+ */
188
+ readOnly: reactDesc.PropTypes.bool.description('Read only'),
189
+
190
+ /**
191
+ * Disabled
192
+ */
193
+ disabled: reactDesc.PropTypes.bool.description('Disabled')
150
194
  };
151
- DetailCard.propTypes = detailProps;
152
- const DSCardDetailWithSchema = (0, import_react_desc.describe)(DetailCard);
195
+ const DSCardDetailWithSchema = reactDesc.describe(DetailCard);
153
196
  DSCardDetailWithSchema.propTypes = detailProps;
154
- var DetailCard_default = DetailCard;
155
- module.exports = __toCommonJS(DetailCard_exports);
156
- //# sourceMappingURL=DetailCard.js.map
197
+
198
+ exports.DSCardDetailWithSchema = DSCardDetailWithSchema;
199
+ exports.DetailCard = DetailCard;
200
+ exports["default"] = DetailCard;
@@ -1,107 +1,61 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var styled = require('styled-components');
6
+ var dsGrid = require('@elliemae/ds-grid');
7
+
8
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
+
10
+ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
+
12
+ const Separator = /*#__PURE__*/styled__default["default"].div.withConfig({
13
+ componentId: "sc-nx8lwv-0"
14
+ })(["width:100%;height:24px;border-right:1px solid ", ";margin:0 8px;"], props => props.theme.colors.neutral['300']);
15
+ const Title = /*#__PURE__*/styled__default["default"].h3.withConfig({
16
+ componentId: "sc-nx8lwv-1"
17
+ })(["margin:0;font-size:16px;min-height:20px;font-weight:", ";color:", ";"], props => props.theme.fontWeights.semibold, props => props.theme.colors.neutral['700']);
18
+ const Description = /*#__PURE__*/styled__default["default"].p.withConfig({
19
+ componentId: "sc-nx8lwv-2"
20
+ })(["margin:0;font-size:12px;min-height:18px;display:flex;align-items:center;color:", ";"], props => props.descriptionColor === 'neutral' ? props.theme.colors.neutral['600'] : props.theme.colors.brand['600']);
21
+ const RightAddon = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
22
+ componentId: "sc-nx8lwv-3"
23
+ })(["margin:0;white-space:nowrap;"]);
24
+ const RightDescription = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
25
+ componentId: "sc-nx8lwv-4"
26
+ })(["margin:0;white-space:nowrap;font-size:12px;color:", ";"], props => props.theme.colors.neutral['600']);
27
+ const RightValue = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
28
+ componentId: "sc-nx8lwv-5"
29
+ })(["margin:0;white-space:nowrap;font-size:14px;color:", ";"], props => props.theme.colors.neutral['800']);
30
+ const ExpandContent = /*#__PURE__*/styled__default["default"].div.withConfig({
31
+ componentId: "sc-nx8lwv-6"
32
+ })(["font-size:12px;"]);
33
+
34
+ const border = _ref => {
35
+ let {
36
+ active,
37
+ theme
38
+ } = _ref;
39
+ return active ? theme.colors.brand['600'] : theme.colors.neutral['200'];
11
40
  };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
41
+
42
+ const background = _ref2 => {
43
+ let {
44
+ active,
45
+ theme
46
+ } = _ref2;
47
+ return active ? theme.colors.brand['100'] : theme.colors.neutral['000'];
19
48
  };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var styled_exports = {};
29
- __export(styled_exports, {
30
- Container: () => Container,
31
- Description: () => Description,
32
- ExpandContent: () => ExpandContent,
33
- RightAddon: () => RightAddon,
34
- RightDescription: () => RightDescription,
35
- RightValue: () => RightValue,
36
- Separator: () => Separator,
37
- Title: () => Title
38
- });
39
- var React = __toESM(require("react"));
40
- var import_styled_components = __toESM(require("styled-components"));
41
- var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
42
- const Separator = import_styled_components.default.div`
43
- width: 100%;
44
- height: 24px;
45
- border-right: 1px solid ${(props) => props.theme.colors.neutral["300"]};
46
- margin: 0 8px;
47
- `;
48
- const Title = import_styled_components.default.h3`
49
- margin: 0;
50
- font-size: 16px;
51
- min-height: 20px;
52
- font-weight: ${(props) => props.theme.fontWeights.semibold};
53
- color: ${(props) => props.theme.colors.neutral["700"]};
54
- `;
55
- const Description = import_styled_components.default.p`
56
- margin: 0;
57
- font-size: 12px;
58
- min-height: 18px;
59
- display: flex;
60
- align-items: center;
61
- color: ${(props) => props.descriptionColor === "neutral" ? props.theme.colors.neutral["600"] : props.theme.colors.brand["600"]};
62
- `;
63
- const RightAddon = (0, import_styled_components.default)(import_ds_grid.Grid)`
64
- margin: 0;
65
- white-space: nowrap;
66
- `;
67
- const RightDescription = (0, import_styled_components.default)(import_ds_grid.Grid)`
68
- margin: 0;
69
- white-space: nowrap;
70
- font-size: 12px;
71
- color: ${(props) => props.theme.colors.neutral["600"]};
72
- `;
73
- const RightValue = (0, import_styled_components.default)(import_ds_grid.Grid)`
74
- margin: 0;
75
- white-space: nowrap;
76
- font-size: 14px;
77
- color: ${(props) => props.theme.colors.neutral["800"]};
78
- `;
79
- const ExpandContent = import_styled_components.default.div`
80
- font-size: 12px;
81
- `;
82
- const border = ({ active, theme }) => active ? theme.colors.brand["600"] : theme.colors.neutral["200"];
83
- const background = ({ active, theme }) => active ? theme.colors.brand["100"] : theme.colors.neutral["000"];
84
- const Container = (0, import_styled_components.default)(import_ds_grid.Grid)`
85
- width: 100%;
86
- min-height: 52px;
87
- min-width: 244px;
88
- padding: 6px 8px 6px 12px;
89
- position: relative;
90
- border-top: 1px solid ${border};
91
- border-bottom: 1px solid ${border};
92
- background: ${background};
93
- ${(props) => props.disabled ? `
94
- ${Title}, ${Description}, ${RightDescription}, ${RightValue} {
95
- color: ${props.theme.colors.neutral["500"]};
96
- }
97
- ` : ""}
98
- &:hover {
99
- box-shadow: 0 2px 4px 0 rgba(53, 60, 70, 0.5);
100
- z-index: 1;
101
- }
102
- /* & + ${Container} {
103
- border-top-color: blue;
104
- } */
105
- `;
106
- module.exports = __toCommonJS(styled_exports);
107
- //# sourceMappingURL=styled.js.map
49
+
50
+ const Container = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
51
+ componentId: "sc-nx8lwv-7"
52
+ })(["width:100%;min-height:52px;min-width:244px;padding:6px 8px 6px 12px;position:relative;border-top:1px solid ", ";border-bottom:1px solid ", ";background:", ";", " &:hover{box-shadow:0 2px 4px 0 rgba(53,60,70,0.5);z-index:1;}"], border, border, background, props => props.disabled ? "\n ".concat(Title, ", ").concat(Description, ", ").concat(RightDescription, ", ").concat(RightValue, " {\n color: ").concat(props.theme.colors.neutral['500'], ";\n }\n ") : '');
53
+
54
+ exports.Container = Container;
55
+ exports.Description = Description;
56
+ exports.ExpandContent = ExpandContent;
57
+ exports.RightAddon = RightAddon;
58
+ exports.RightDescription = RightDescription;
59
+ exports.RightValue = RightValue;
60
+ exports.Separator = Separator;
61
+ exports.Title = Title;
package/cjs/index.js CHANGED
@@ -1,42 +1,29 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
19
- };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var src_exports = {};
29
- __export(src_exports, {
30
- default: () => import_DSCard.default
31
- });
32
- var React = __toESM(require("react"));
33
- __reExport(src_exports, __toESM(require("./DSCard")));
34
- __reExport(src_exports, __toESM(require("./DSCardHeader")));
35
- __reExport(src_exports, __toESM(require("./DSCardBody")));
36
- __reExport(src_exports, __toESM(require("./v2/Card")));
37
- __reExport(src_exports, __toESM(require("./v2/Group")));
38
- __reExport(src_exports, __toESM(require("./v2/ActionAddon")));
39
- __reExport(src_exports, __toESM(require("./detail/DetailCard")));
40
- var import_DSCard = __toESM(require("./DSCard"));
41
- module.exports = __toCommonJS(src_exports);
42
- //# sourceMappingURL=index.js.map
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var DSCard = require('./DSCard.js');
6
+ var DSCardHeader = require('./DSCardHeader.js');
7
+ var DSCardBody = require('./DSCardBody.js');
8
+ var Card = require('./v2/Card.js');
9
+ var Group = require('./v2/Group.js');
10
+ var ActionAddon = require('./v2/ActionAddon.js');
11
+ var DetailCard = require('./detail/DetailCard.js');
12
+
13
+
14
+
15
+ exports.DSCard = DSCard.DSCard;
16
+ exports.DSCardWithSchema = DSCard.DSCardWithSchema;
17
+ exports["default"] = DSCard.DSCard;
18
+ exports.DSCardHeader = DSCardHeader.DSCardHeader;
19
+ exports.DSCardHeaderWithSchema = DSCardHeader.DSCardHeaderWithSchema;
20
+ exports.DSCardBody = DSCardBody.DSCardBody;
21
+ exports.DSCardBodyWithSchema = DSCardBody.DSCardBodyWithSchema;
22
+ exports.CustomCard = Card.CustomCard;
23
+ exports.DSCardCustomWithSchema = Card.DSCardCustomWithSchema;
24
+ exports.CardGroup = Group.CardGroup;
25
+ exports.DSCardGroupWithSchema = Group.DSCardGroupWithSchema;
26
+ exports.ActionAddon = ActionAddon.ActionAddon;
27
+ exports.DSCardActionAddonWithSchema = ActionAddon.DSCardActionAddonWithSchema;
28
+ exports.DSCardDetailWithSchema = DetailCard.DSCardDetailWithSchema;
29
+ exports.DetailCard = DetailCard.DetailCard;