@elliemae/ds-group-box 2.2.0-alpha.4 → 3.0.0-next.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/ActionItem.js +23 -54
- package/cjs/Actions.js +36 -63
- package/cjs/DSGroupBox.js +133 -99
- package/cjs/GroupBoxLabel.js +36 -79
- package/cjs/LabelElement.js +23 -51
- package/cjs/components/GroupHeader.js +44 -60
- package/cjs/components/blocks.js +54 -56
- package/cjs/constants.js +9 -37
- package/cjs/index.js +14 -37
- package/esm/ActionItem.js +16 -25
- package/esm/Actions.js +26 -34
- package/esm/DSGroupBox.js +115 -64
- package/esm/GroupBoxLabel.js +29 -50
- package/esm/LabelElement.js +16 -22
- package/esm/components/GroupHeader.js +35 -31
- package/esm/components/blocks.js +50 -29
- package/esm/constants.js +4 -8
- package/esm/index.js +2 -8
- package/package.json +5 -8
- package/cjs/ActionItem.js.map +0 -7
- package/cjs/Actions.js.map +0 -7
- package/cjs/DSGroupBox.js.map +0 -7
- package/cjs/GroupBoxLabel.js.map +0 -7
- package/cjs/LabelElement.js.map +0 -7
- package/cjs/components/GroupHeader.js.map +0 -7
- package/cjs/components/blocks.js.map +0 -7
- package/cjs/constants.js.map +0 -7
- package/cjs/index.js.map +0 -7
- package/esm/ActionItem.js.map +0 -7
- package/esm/Actions.js.map +0 -7
- package/esm/DSGroupBox.js.map +0 -7
- package/esm/GroupBoxLabel.js.map +0 -7
- package/esm/LabelElement.js.map +0 -7
- package/esm/components/GroupHeader.js.map +0 -7
- package/esm/components/blocks.js.map +0 -7
- package/esm/constants.js.map +0 -7
- package/esm/index.js.map +0 -7
package/cjs/ActionItem.js
CHANGED
|
@@ -1,55 +1,24 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
return
|
|
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 ActionItem_exports = {};
|
|
29
|
-
__export(ActionItem_exports, {
|
|
30
|
-
default: () => ActionItem_default
|
|
31
|
-
});
|
|
32
|
-
var React = __toESM(require("react"));
|
|
33
|
-
var import_react = __toESM(require("react"));
|
|
34
|
-
var import_styled_components = __toESM(require("styled-components"));
|
|
35
|
-
var import_ds_system = require("@elliemae/ds-system");
|
|
36
|
-
var import_prop_types = __toESM(require("prop-types"));
|
|
37
|
-
const ActionItemNode = import_styled_components.default.div`
|
|
38
|
-
padding-right: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.xs)};
|
|
39
|
-
font-weight: 300;
|
|
40
|
-
overflow: hidden;
|
|
41
|
-
align-items: center;
|
|
42
|
-
display: flex;
|
|
43
|
-
&:last-child {
|
|
44
|
-
padding-right: 0;
|
|
45
|
-
}
|
|
46
|
-
`;
|
|
47
|
-
function ActionItem({ children }) {
|
|
48
|
-
return /* @__PURE__ */ import_react.default.createElement(ActionItemNode, null, children);
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
|
+
require('react');
|
|
5
|
+
var styled = require('styled-components');
|
|
6
|
+
var dsSystem = require('@elliemae/ds-system');
|
|
7
|
+
|
|
8
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
9
|
+
|
|
10
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
11
|
+
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
12
|
+
|
|
13
|
+
const ActionItemNode = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
14
|
+
componentId: "sc-1ysc0gb-0"
|
|
15
|
+
})(["padding-right:", ";font-weight:300;overflow:hidden;align-items:center;display:flex;&:last-child{padding-right:0;}"], props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs));
|
|
16
|
+
|
|
17
|
+
function ActionItem(_ref) {
|
|
18
|
+
let {
|
|
19
|
+
children
|
|
20
|
+
} = _ref;
|
|
21
|
+
return /*#__PURE__*/_jsx__default["default"](ActionItemNode, {}, void 0, children);
|
|
49
22
|
}
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
};
|
|
53
|
-
var ActionItem_default = ActionItem;
|
|
54
|
-
module.exports = __toCommonJS(ActionItem_exports);
|
|
55
|
-
//# sourceMappingURL=ActionItem.js.map
|
|
23
|
+
|
|
24
|
+
module.exports = ActionItem;
|
package/cjs/Actions.js
CHANGED
|
@@ -1,64 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
var import_react = __toESM(require("react"));
|
|
35
|
-
var import_prop_types = __toESM(require("prop-types"));
|
|
36
|
-
var import_styled_components = __toESM(require("styled-components"));
|
|
37
|
-
var import_styled_components2 = require("@xstyled/styled-components");
|
|
38
|
-
var import_ds_system = require("@elliemae/ds-system");
|
|
39
|
-
var import_ActionItem = __toESM(require("./ActionItem"));
|
|
40
|
-
const ActionsNode = import_styled_components.default.div`
|
|
41
|
-
display: flex;
|
|
42
|
-
flex-direction: row;
|
|
43
|
-
padding-left: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.m)};
|
|
44
|
-
overflow: hidden;
|
|
45
|
-
${import_styled_components2.space}
|
|
46
|
-
`;
|
|
47
|
-
function Actions({ actions = [], centerActions, rightActions }) {
|
|
48
|
-
if (actions.length < 1)
|
|
49
|
-
return null;
|
|
50
|
-
return /* @__PURE__ */ import_react.default.createElement(ActionsNode, {
|
|
51
|
-
marginLeft: !!rightActions && "auto",
|
|
52
|
-
marginRight: !!centerActions && "auto"
|
|
53
|
-
}, actions.map((action, key) => /* @__PURE__ */ import_react.default.createElement(import_ActionItem.default, {
|
|
54
|
-
key
|
|
55
|
-
}, action)));
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.map.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.map.js');
|
|
8
|
+
require('react');
|
|
9
|
+
var styled = require('styled-components');
|
|
10
|
+
var styledComponents = require('@xstyled/styled-components');
|
|
11
|
+
var dsSystem = require('@elliemae/ds-system');
|
|
12
|
+
var ActionItem = require('./ActionItem.js');
|
|
13
|
+
|
|
14
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
15
|
+
|
|
16
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
17
|
+
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
18
|
+
|
|
19
|
+
const ActionsNode = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
20
|
+
componentId: "sc-1umfb8g-0"
|
|
21
|
+
})(["display:flex;flex-direction:row;padding-left:", ";overflow:hidden;", ""], props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m), styledComponents.space);
|
|
22
|
+
|
|
23
|
+
function Actions(_ref) {
|
|
24
|
+
let {
|
|
25
|
+
actions = [],
|
|
26
|
+
centerActions,
|
|
27
|
+
rightActions
|
|
28
|
+
} = _ref;
|
|
29
|
+
if (actions.length < 1) return null;
|
|
30
|
+
return /*#__PURE__*/_jsx__default["default"](ActionsNode, {
|
|
31
|
+
marginLeft: !!rightActions && 'auto',
|
|
32
|
+
marginRight: !!centerActions && 'auto'
|
|
33
|
+
}, void 0, actions.map((action, key) => /*#__PURE__*/_jsx__default["default"](ActionItem, {}, key, action)));
|
|
56
34
|
}
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
rightActions: import_prop_types.default.bool
|
|
61
|
-
};
|
|
62
|
-
var Actions_default = Actions;
|
|
63
|
-
module.exports = __toCommonJS(Actions_exports);
|
|
64
|
-
//# sourceMappingURL=Actions.js.map
|
|
35
|
+
|
|
36
|
+
exports.Actions = Actions;
|
|
37
|
+
exports["default"] = Actions;
|
package/cjs/DSGroupBox.js
CHANGED
|
@@ -1,106 +1,140 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
var
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
children: components = [],
|
|
55
|
-
isMain = true
|
|
56
|
-
}) => {
|
|
57
|
-
const { labelText } = labelProps;
|
|
58
|
-
return /* @__PURE__ */ import_react.default.createElement(import_blocks.GroupBoxWrapper, {
|
|
59
|
-
...containerProps,
|
|
60
|
-
classProps: { onlyHeader, noBorder, type, isMain }
|
|
61
|
-
}, labelText && /* @__PURE__ */ import_react.default.createElement(import_GroupHeader.DSGroupBoxHeader, {
|
|
62
|
-
centerActions,
|
|
63
|
-
isMain,
|
|
64
|
-
labelProps,
|
|
65
|
-
noBorder,
|
|
66
|
-
rightActions,
|
|
67
|
-
type
|
|
68
|
-
}), /* @__PURE__ */ import_react.default.createElement(import_blocks.GroupBoxContent, {
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
7
|
+
require('core-js/modules/esnext.async-iterator.map.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.map.js');
|
|
9
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
10
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
11
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
12
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
13
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
14
|
+
var React = require('react');
|
|
15
|
+
var reactDesc = require('react-desc');
|
|
16
|
+
var blocks = require('./components/blocks.js');
|
|
17
|
+
var GroupHeader = require('./components/GroupHeader.js');
|
|
18
|
+
var constants = require('./constants.js');
|
|
19
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
20
|
+
|
|
21
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
22
|
+
|
|
23
|
+
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
24
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
25
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
26
|
+
|
|
27
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
28
|
+
|
|
29
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
30
|
+
|
|
31
|
+
const DSGroupBox = _ref => {
|
|
32
|
+
let {
|
|
33
|
+
containerProps = {},
|
|
34
|
+
labelProps = {
|
|
35
|
+
labelText: '',
|
|
36
|
+
borderBottom: false,
|
|
37
|
+
id: 'ds-group-box__header'
|
|
38
|
+
},
|
|
39
|
+
rightActions = [],
|
|
40
|
+
centerActions = [],
|
|
41
|
+
type = constants.BOX_TYPES.CATEGORY,
|
|
42
|
+
asRow = false,
|
|
43
|
+
onlyHeader = false,
|
|
44
|
+
noBorder = true,
|
|
45
|
+
noPadding = false,
|
|
46
|
+
children: components = [],
|
|
47
|
+
// eslint-disable-next-line react/prop-types
|
|
48
|
+
isMain = true
|
|
49
|
+
} = _ref;
|
|
50
|
+
const {
|
|
51
|
+
labelText
|
|
52
|
+
} = labelProps;
|
|
53
|
+
return /*#__PURE__*/jsxRuntime.jsxs(blocks.GroupBoxWrapper, _objectSpread(_objectSpread({}, containerProps), {}, {
|
|
69
54
|
classProps: {
|
|
70
|
-
type,
|
|
71
|
-
asRow,
|
|
72
55
|
onlyHeader,
|
|
73
|
-
noPadding,
|
|
74
56
|
noBorder,
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
57
|
+
type,
|
|
58
|
+
isMain
|
|
59
|
+
},
|
|
60
|
+
children: [labelText && /*#__PURE__*/_jsx__default["default"](GroupHeader.DSGroupBoxHeader, {
|
|
61
|
+
centerActions: centerActions,
|
|
62
|
+
isMain: isMain,
|
|
63
|
+
labelProps: labelProps,
|
|
64
|
+
noBorder: noBorder,
|
|
65
|
+
rightActions: rightActions,
|
|
66
|
+
type: type
|
|
67
|
+
}), /*#__PURE__*/_jsx__default["default"](blocks.GroupBoxContent, {
|
|
68
|
+
classProps: {
|
|
69
|
+
type,
|
|
70
|
+
asRow,
|
|
71
|
+
onlyHeader,
|
|
72
|
+
noPadding,
|
|
73
|
+
noBorder,
|
|
74
|
+
noBorderTop: !!labelText
|
|
75
|
+
}
|
|
76
|
+
}, void 0, components && components.props ? React__default["default"].Children.map(components, component => /*#__PURE__*/React__default["default"].cloneElement(component, _objectSpread(_objectSpread({}, component.props), {}, {
|
|
77
|
+
isMain: false
|
|
78
|
+
})), null) : components)]
|
|
79
|
+
}));
|
|
81
80
|
};
|
|
81
|
+
|
|
82
82
|
const props = {
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
83
|
+
/** props to inject to wrapper */
|
|
84
|
+
containerProps: reactDesc.PropTypes.object.description('props to inject to wrapper'),
|
|
85
|
+
|
|
86
|
+
/**
|
|
87
|
+
* Label attributes to be rendered
|
|
88
|
+
*/
|
|
89
|
+
labelProps: reactDesc.PropTypes.shape({
|
|
90
|
+
labelText: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.element]),
|
|
91
|
+
borderBottom: reactDesc.PropTypes.bool,
|
|
92
|
+
id: reactDesc.PropTypes.string
|
|
93
|
+
}).description('Label attributes to be rendered'),
|
|
94
|
+
|
|
95
|
+
/**
|
|
96
|
+
* ['category-box', 'group-box']
|
|
97
|
+
*/
|
|
98
|
+
type: reactDesc.PropTypes.oneOf(constants.BOX_TYPES_ARRAY).description(constants.BOX_TYPES_ARRAY.toString()),
|
|
99
|
+
|
|
100
|
+
/**
|
|
101
|
+
* Components to be rendered inside the box
|
|
102
|
+
*/
|
|
103
|
+
children: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.element, reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.element)]).isRequired.description('Components to be rendered inside the box'),
|
|
104
|
+
|
|
105
|
+
/**
|
|
106
|
+
* Actions on the right side of the label
|
|
107
|
+
*/
|
|
108
|
+
rightActions: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.element).description('Actions on the right side of the label'),
|
|
109
|
+
|
|
110
|
+
/**
|
|
111
|
+
* Actions on the next to the label
|
|
112
|
+
*/
|
|
113
|
+
centerActions: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.element).description('Actions on the next to the label'),
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* Display the content of the group box with flex direction row
|
|
117
|
+
*/
|
|
118
|
+
asRow: reactDesc.PropTypes.bool.description('Display the content of the group box with flex direction row'),
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* Show border only on the header
|
|
122
|
+
*/
|
|
123
|
+
onlyHeader: reactDesc.PropTypes.bool.description('Show border only on the header'),
|
|
124
|
+
|
|
125
|
+
/**
|
|
126
|
+
* Remove the wrapper border
|
|
127
|
+
*/
|
|
128
|
+
noBorder: reactDesc.PropTypes.bool.description('Remove the wrapper border'),
|
|
129
|
+
|
|
130
|
+
/**
|
|
131
|
+
* Remove the top and bottom padding from the content
|
|
132
|
+
*/
|
|
133
|
+
noPadding: reactDesc.PropTypes.bool.description('Remove the top and bottom padding from the content')
|
|
100
134
|
};
|
|
101
|
-
|
|
102
|
-
const DSGroupBoxWithSchema = (0, import_react_desc.describe)(DSGroupBox);
|
|
135
|
+
const DSGroupBoxWithSchema = reactDesc.describe(DSGroupBox);
|
|
103
136
|
DSGroupBoxWithSchema.propTypes = props;
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
137
|
+
|
|
138
|
+
exports.DSGroupBox = DSGroupBox;
|
|
139
|
+
exports.DSGroupBoxWithSchema = DSGroupBoxWithSchema;
|
|
140
|
+
exports["default"] = DSGroupBox;
|
package/cjs/GroupBoxLabel.js
CHANGED
|
@@ -1,83 +1,40 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
|
|
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 GroupBoxLabel_exports = {};
|
|
29
|
-
__export(GroupBoxLabel_exports, {
|
|
30
|
-
default: () => GroupBoxLabel_default
|
|
31
|
-
});
|
|
32
|
-
var React = __toESM(require("react"));
|
|
33
|
-
var import_react = __toESM(require("react"));
|
|
34
|
-
var import_prop_types = __toESM(require("prop-types"));
|
|
35
|
-
var import_styled_components = __toESM(require("styled-components"));
|
|
36
|
-
var import_ds_system = require("@elliemae/ds-system");
|
|
37
|
-
var import_constants = require("./constants");
|
|
38
|
-
const borderBase200 = (props) => `1px solid ${props.theme.colors.neutral[200]};`;
|
|
39
|
-
const categoryBoxStyles = `
|
|
40
|
-
width: 100%;
|
|
41
|
-
height: 36px;
|
|
42
|
-
padding:0 0;
|
|
43
|
-
color: ${(props) => props.theme.colors.neutral[800]};
|
|
44
|
-
display: flex;
|
|
45
|
-
flex-direction: row;
|
|
46
|
-
align-items: center;
|
|
47
|
-
border-bottom: ${borderBase200}
|
|
48
|
-
`;
|
|
49
|
-
const groupBoxStyles = `
|
|
50
|
-
border: unset;
|
|
51
|
-
font-size: ${(props) => (0, import_ds_system.toMobile)(props.theme.fontSizes.title[500])};
|
|
52
|
-
padding: 12px 0;
|
|
53
|
-
`;
|
|
54
|
-
const GroupBoxLabelNode = import_styled_components.default.div`
|
|
55
|
-
${(props) => props.nodeType === "category-box" ? categoryBoxStyles : groupBoxStyles}
|
|
56
|
-
${(props) => props.noBorder ? "border: none;" : ""}
|
|
57
|
-
${(props) => props.borderBottom ? `border-bottom: ${borderBase200(props)}` : ""}
|
|
58
|
-
${(props) => props.isMain ? `padding-right: ${(0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.xs)};` : ""}
|
|
59
|
-
`;
|
|
60
|
-
function GroupBoxLabel({ borderBottom, children, noBorder, isMain, type, id }) {
|
|
61
|
-
return /* @__PURE__ */ import_react.default.createElement(GroupBoxLabelNode, {
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
|
+
require('react');
|
|
5
|
+
var styled = require('styled-components');
|
|
6
|
+
var dsSystem = require('@elliemae/ds-system');
|
|
7
|
+
|
|
8
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
9
|
+
|
|
10
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
11
|
+
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
12
|
+
|
|
13
|
+
const borderBase200 = props => "1px solid ".concat(props.theme.colors.neutral[200], ";");
|
|
14
|
+
|
|
15
|
+
const categoryBoxStyles = "\n width: 100%;\n height: 36px;\n padding:0 0;\n color: ".concat(props => props.theme.colors.neutral[800], ";\n display: flex;\n flex-direction: row;\n align-items: center;\n border-bottom: ").concat(borderBase200, "\n");
|
|
16
|
+
const groupBoxStyles = "\n border: unset;\n font-size: ".concat(props => dsSystem.toMobile(props.theme.fontSizes.title[500]), ";\n padding: 12px 0;\n");
|
|
17
|
+
const GroupBoxLabelNode = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
18
|
+
componentId: "sc-141ikkh-0"
|
|
19
|
+
})(["", " ", " ", " ", ""], props => props.nodeType === 'category-box' ? categoryBoxStyles : groupBoxStyles, props => props.noBorder ? 'border: none;' : '', props => props.borderBottom ? "border-bottom: ".concat(borderBase200(props)) : '', props => props.isMain ? "padding-right: ".concat(dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs), ";") : '');
|
|
20
|
+
|
|
21
|
+
function GroupBoxLabel(_ref) {
|
|
22
|
+
let {
|
|
62
23
|
borderBottom,
|
|
63
|
-
|
|
64
|
-
isMain,
|
|
24
|
+
children,
|
|
65
25
|
noBorder,
|
|
66
|
-
|
|
26
|
+
isMain,
|
|
27
|
+
type,
|
|
67
28
|
id
|
|
68
|
-
}
|
|
29
|
+
} = _ref;
|
|
30
|
+
return /*#__PURE__*/_jsx__default["default"](GroupBoxLabelNode, {
|
|
31
|
+
borderBottom: borderBottom,
|
|
32
|
+
"data-testid": "ds-group-box__header",
|
|
33
|
+
isMain: isMain,
|
|
34
|
+
noBorder: noBorder,
|
|
35
|
+
nodeType: type,
|
|
36
|
+
id: id
|
|
37
|
+
}, void 0, children);
|
|
69
38
|
}
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
import_prop_types.default.arrayOf(import_prop_types.default.node),
|
|
73
|
-
import_prop_types.default.node
|
|
74
|
-
]).isRequired,
|
|
75
|
-
type: import_prop_types.default.oneOf(import_constants.BOX_TYPES_ARRAY),
|
|
76
|
-
borderBottom: import_prop_types.default.bool,
|
|
77
|
-
isMain: import_prop_types.default.bool.isRequired,
|
|
78
|
-
noBorder: import_prop_types.default.bool,
|
|
79
|
-
id: import_prop_types.default.string
|
|
80
|
-
};
|
|
81
|
-
var GroupBoxLabel_default = GroupBoxLabel;
|
|
82
|
-
module.exports = __toCommonJS(GroupBoxLabel_exports);
|
|
83
|
-
//# sourceMappingURL=GroupBoxLabel.js.map
|
|
39
|
+
|
|
40
|
+
module.exports = GroupBoxLabel;
|
package/cjs/LabelElement.js
CHANGED
|
@@ -1,52 +1,24 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
return
|
|
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 LabelElement_exports = {};
|
|
29
|
-
__export(LabelElement_exports, {
|
|
30
|
-
default: () => LabelElement_default
|
|
31
|
-
});
|
|
32
|
-
var React = __toESM(require("react"));
|
|
33
|
-
var import_react = __toESM(require("react"));
|
|
34
|
-
var import_prop_types = __toESM(require("prop-types"));
|
|
35
|
-
var import_styled_components = __toESM(require("styled-components"));
|
|
36
|
-
var import_ds_system = require("@elliemae/ds-system");
|
|
37
|
-
const LabelElementNode = import_styled_components.default.div`
|
|
38
|
-
overflow: hidden;
|
|
39
|
-
display: flex;
|
|
40
|
-
align-items: center;
|
|
41
|
-
font-size: ${(props) => (0, import_ds_system.toMobile)(props.theme.fontSizes.title[700])};
|
|
42
|
-
font-weight: 400;
|
|
43
|
-
`;
|
|
44
|
-
function LabelElement({ children }) {
|
|
45
|
-
return /* @__PURE__ */ import_react.default.createElement(LabelElementNode, null, children);
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
|
+
require('react');
|
|
5
|
+
var styled = require('styled-components');
|
|
6
|
+
var dsSystem = require('@elliemae/ds-system');
|
|
7
|
+
|
|
8
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
9
|
+
|
|
10
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
11
|
+
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
12
|
+
|
|
13
|
+
const LabelElementNode = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
14
|
+
componentId: "sc-nu03bl-0"
|
|
15
|
+
})(["overflow:hidden;display:flex;align-items:center;font-size:", ";font-weight:400;"], props => dsSystem.toMobile(props.theme.fontSizes.title[700]));
|
|
16
|
+
|
|
17
|
+
function LabelElement(_ref) {
|
|
18
|
+
let {
|
|
19
|
+
children
|
|
20
|
+
} = _ref;
|
|
21
|
+
return /*#__PURE__*/_jsx__default["default"](LabelElementNode, {}, void 0, children);
|
|
46
22
|
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
};
|
|
50
|
-
var LabelElement_default = LabelElement;
|
|
51
|
-
module.exports = __toCommonJS(LabelElement_exports);
|
|
52
|
-
//# sourceMappingURL=LabelElement.js.map
|
|
23
|
+
|
|
24
|
+
module.exports = LabelElement;
|