@elliemae/ds-page-header 2.0.0-next.9 → 2.0.0-rc.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/v1/DSPageHeader.js +5 -0
- package/cjs/v1/DropdownTitle.js +11 -11
- package/cjs/v1/EditableTitle.js +17 -13
- package/cjs/v1/PageHeaderImpl.js +54 -43
- package/cjs/v1/Title.js +8 -5
- package/cjs/v2/PageHeader.js +18 -12
- package/cjs/v2/components/PageHeaderBack/PageHeaderBack.js +5 -0
- package/cjs/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js +8 -5
- package/cjs/v2/components/PageHeaderMenu/PageHeaderMenu.js +5 -0
- package/cjs/v2/components/PageHeaderSummary/PageHeaderSummary.js +5 -0
- package/cjs/v2/components/PageHeaderTitle/PageHeaderTitle.js +5 -0
- package/cjs/v2/components/PageHeaderToolbar/PageHeaderToolbar.js +5 -0
- package/cjs/v2/components/blocks.js +4 -9
- package/esm/v1/DSPageHeader.js +5 -0
- package/esm/v1/DropdownTitle.js +10 -9
- package/esm/v1/EditableTitle.js +12 -7
- package/esm/v1/PageHeaderImpl.js +52 -40
- package/esm/v1/Title.js +8 -5
- package/esm/v2/PageHeader.js +17 -11
- package/esm/v2/components/PageHeaderBack/PageHeaderBack.js +5 -0
- package/esm/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js +6 -2
- package/esm/v2/components/PageHeaderMenu/PageHeaderMenu.js +5 -0
- package/esm/v2/components/PageHeaderSummary/PageHeaderSummary.js +5 -0
- package/esm/v2/components/PageHeaderTitle/PageHeaderTitle.js +5 -0
- package/esm/v2/components/PageHeaderToolbar/PageHeaderToolbar.js +5 -0
- package/esm/v2/components/blocks.js +2 -2
- package/package.json +13 -12
- package/types/v1/DSPageHeader.d.ts +97 -16
- package/types/v1/DropdownTitle.d.ts +1 -1
- package/types/v2/PageHeader.d.ts +64 -10
- package/types/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.d.ts +57 -8
- package/types/v2/components/PageHeaderSummary/PageHeaderSummary.d.ts +24 -3
- package/types/v2/components/PageHeaderTitle/PageHeaderTitle.d.ts +22 -3
- package/types/v2/components/blocks.d.ts +1 -1
- package/types/v2/props.d.ts +49 -8
- package/types/v2/tests/utils.d.ts +6 -6
package/cjs/v1/DSPageHeader.js
CHANGED
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
11
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
7
12
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
package/cjs/v1/DropdownTitle.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
4
|
require('react');
|
|
5
5
|
var DSDropdownMenu = require('@elliemae/ds-dropdownmenu');
|
|
6
|
-
var
|
|
6
|
+
var dsIcons = require('@elliemae/ds-icons');
|
|
7
7
|
var DSButton = require('@elliemae/ds-button');
|
|
8
8
|
var TitleWrapper = require('./TitleWrapper.js');
|
|
9
9
|
|
|
@@ -11,19 +11,19 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
11
11
|
|
|
12
12
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
13
13
|
var DSDropdownMenu__default = /*#__PURE__*/_interopDefaultLegacy(DSDropdownMenu);
|
|
14
|
-
var ChevronSmallDown__default = /*#__PURE__*/_interopDefaultLegacy(ChevronSmallDown);
|
|
15
14
|
var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
|
|
16
15
|
|
|
17
16
|
var _DSButton;
|
|
18
17
|
|
|
19
|
-
function DropdownTitle({
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
18
|
+
function DropdownTitle(_ref) {
|
|
19
|
+
let {
|
|
20
|
+
titleComponent,
|
|
21
|
+
onSelectOption,
|
|
22
|
+
options,
|
|
23
|
+
optionsMinWidth,
|
|
24
|
+
selection,
|
|
25
|
+
zIndex
|
|
26
|
+
} = _ref;
|
|
27
27
|
return /*#__PURE__*/_jsx__default["default"](TitleWrapper, {}, void 0, titleComponent, /*#__PURE__*/_jsx__default["default"](DSDropdownMenu__default["default"], {
|
|
28
28
|
minWidth: optionsMinWidth,
|
|
29
29
|
onSelectMenuItem: onSelectOption,
|
|
@@ -32,7 +32,7 @@ function DropdownTitle({
|
|
|
32
32
|
triggerComponent: _DSButton || (_DSButton = /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
|
|
33
33
|
buttonType: "text",
|
|
34
34
|
"data-testid": "page-header-dropdown-trigger-component",
|
|
35
|
-
icon: /*#__PURE__*/_jsx__default["default"](
|
|
35
|
+
icon: /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {})
|
|
36
36
|
})),
|
|
37
37
|
zIndex: zIndex
|
|
38
38
|
}));
|
package/cjs/v1/EditableTitle.js
CHANGED
|
@@ -3,10 +3,14 @@
|
|
|
3
3
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
4
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
5
5
|
require('core-js/modules/web.dom-collections.iterator.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
9
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
10
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
6
11
|
var react = require('react');
|
|
7
|
-
var
|
|
12
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
8
13
|
var dsClassnames = require('@elliemae/ds-classnames');
|
|
9
|
-
var utils = require('@elliemae/ds-utilities/utils');
|
|
10
14
|
var DSInput = require('@elliemae/ds-form/Input');
|
|
11
15
|
var Title = require('./Title.js');
|
|
12
16
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -15,7 +19,6 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
15
19
|
|
|
16
20
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
17
21
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
18
|
-
var useDerivedStateFromProps__default = /*#__PURE__*/_interopDefaultLegacy(useDerivedStateFromProps);
|
|
19
22
|
var DSInput__default = /*#__PURE__*/_interopDefaultLegacy(DSInput);
|
|
20
23
|
|
|
21
24
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
@@ -24,21 +27,22 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
24
27
|
const blockName = 'page-header';
|
|
25
28
|
const EditableTitleComponent = dsClassnames.aggregatedClasses(DSInput__default["default"])("".concat(blockName, "-title"), 'editable-title');
|
|
26
29
|
|
|
27
|
-
function EditableTitle({
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
30
|
+
function EditableTitle(_ref) {
|
|
31
|
+
let {
|
|
32
|
+
children: value,
|
|
33
|
+
editing: editingProp,
|
|
34
|
+
titleInputProps
|
|
35
|
+
} = _ref;
|
|
32
36
|
const [titleValue, setTitleValue] = react.useState(value);
|
|
33
37
|
const [hovered, setHovered] = react.useState(false);
|
|
34
|
-
const [editing, setEditing] =
|
|
38
|
+
const [editing, setEditing] = dsUtilities.useDerivedStateFromProps(editingProp || false);
|
|
35
39
|
const titleRef = react.useRef(null);
|
|
36
40
|
return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
37
41
|
children: hovered || editing ? /*#__PURE__*/jsxRuntime.jsx(EditableTitleComponent, _objectSpread(_objectSpread({}, titleInputProps), {}, {
|
|
38
|
-
onBlur:
|
|
39
|
-
onChange:
|
|
40
|
-
onFocus:
|
|
41
|
-
onMouseOut:
|
|
42
|
+
onBlur: dsUtilities.runAll(() => setEditing(false), titleInputProps.onBlur),
|
|
43
|
+
onChange: dsUtilities.runAll(e => setTitleValue(e.target.value), titleInputProps.onChange),
|
|
44
|
+
onFocus: dsUtilities.runAll(() => setEditing(true), titleInputProps.onFocus),
|
|
45
|
+
onMouseOut: dsUtilities.runAll(() => setHovered(false), titleInputProps.onMouseOut),
|
|
42
46
|
value: titleValue
|
|
43
47
|
})) : /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
44
48
|
ref: titleRef,
|
package/cjs/v1/PageHeaderImpl.js
CHANGED
|
@@ -2,10 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
4
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.map.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.map.js');
|
|
7
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
10
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
11
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
12
|
require('react');
|
|
6
|
-
var
|
|
13
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
7
14
|
var dsClassnames = require('@elliemae/ds-classnames');
|
|
8
|
-
var
|
|
15
|
+
var dsIcons = require('@elliemae/ds-icons');
|
|
9
16
|
var DSBreadcrumb = require('@elliemae/ds-breadcrumb');
|
|
10
17
|
var dsIcon = require('@elliemae/ds-icon');
|
|
11
18
|
var EditableTitle = require('./EditableTitle.js');
|
|
@@ -17,20 +24,22 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
17
24
|
|
|
18
25
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
19
26
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
20
|
-
var ChevronLeft__default = /*#__PURE__*/_interopDefaultLegacy(ChevronLeft);
|
|
21
27
|
var DSBreadcrumb__default = /*#__PURE__*/_interopDefaultLegacy(DSBreadcrumb);
|
|
22
28
|
|
|
23
29
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
24
30
|
|
|
25
31
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
26
32
|
const blockName = 'page-header';
|
|
27
|
-
const PageHeaderContainer = dsClassnames.aggregatedClasses('div')(blockName, null,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
33
|
+
const PageHeaderContainer = dsClassnames.aggregatedClasses('div')(blockName, null, _ref => {
|
|
34
|
+
let {
|
|
35
|
+
withBottomSeparator,
|
|
36
|
+
subtitle
|
|
37
|
+
} = _ref;
|
|
38
|
+
return {
|
|
39
|
+
'with-bottom-separator': withBottomSeparator,
|
|
40
|
+
'with-subtitle': subtitle
|
|
41
|
+
};
|
|
42
|
+
});
|
|
34
43
|
const PageHeaderMainSection = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-main-section"));
|
|
35
44
|
const PageHeaderTitleSection = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-title-section"));
|
|
36
45
|
const PageHeaderToolbar = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-toolbar"), null, () => ({
|
|
@@ -39,20 +48,21 @@ const PageHeaderToolbar = dsClassnames.aggregatedClasses('div')("".concat(blockN
|
|
|
39
48
|
const PageHeaderBreadcrumb = dsClassnames.aggregatedClasses(DSBreadcrumb__default["default"])("".concat(blockName, "-breadcrumb"));
|
|
40
49
|
const PageHeaderTitle = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-title"));
|
|
41
50
|
const Subtitle = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-title"), 'subtitle');
|
|
42
|
-
const BackArrow = dsClassnames.aggregatedClasses(
|
|
51
|
+
const BackArrow = dsClassnames.aggregatedClasses(dsIcons.ChevronLeft)("".concat(blockName, "-backarrow"));
|
|
43
52
|
|
|
44
|
-
function HeaderTitle({
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
53
|
+
function HeaderTitle(_ref2) {
|
|
54
|
+
let {
|
|
55
|
+
title = '',
|
|
56
|
+
options = [],
|
|
57
|
+
optionsMinWidth,
|
|
58
|
+
onSelectOption = () => null,
|
|
59
|
+
selection,
|
|
60
|
+
subtitle = '',
|
|
61
|
+
editable = false,
|
|
62
|
+
editing = false,
|
|
63
|
+
titleInputProps,
|
|
64
|
+
zIndex
|
|
65
|
+
} = _ref2;
|
|
56
66
|
const titleComponent = editable ? /*#__PURE__*/_jsx__default["default"](EditableTitle, {
|
|
57
67
|
editing: editing,
|
|
58
68
|
titleInputProps: titleInputProps
|
|
@@ -67,25 +77,26 @@ function HeaderTitle({
|
|
|
67
77
|
}) : titleComponent, subtitle && /*#__PURE__*/_jsx__default["default"](Subtitle, {}, void 0, subtitle));
|
|
68
78
|
}
|
|
69
79
|
|
|
70
|
-
function PageHeaderImpl({
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
80
|
+
function PageHeaderImpl(_ref3) {
|
|
81
|
+
let {
|
|
82
|
+
containerProps,
|
|
83
|
+
className,
|
|
84
|
+
title,
|
|
85
|
+
titleOptions,
|
|
86
|
+
renderToolbar,
|
|
87
|
+
breadcrumbs = [],
|
|
88
|
+
previousPage,
|
|
89
|
+
onGoToPreviousPage = () => null,
|
|
90
|
+
subtitle = '',
|
|
91
|
+
withBottomSeparator,
|
|
92
|
+
onSelectOption,
|
|
93
|
+
optionsSelection,
|
|
94
|
+
optionsMinWidth,
|
|
95
|
+
editable = false,
|
|
96
|
+
titleInputProps,
|
|
97
|
+
editing = undefined,
|
|
98
|
+
zIndex
|
|
99
|
+
} = _ref3;
|
|
89
100
|
const hasBreadcrumbs = !!breadcrumbs.length;
|
|
90
101
|
return /*#__PURE__*/jsxRuntime.jsxs(PageHeaderContainer, _objectSpread(_objectSpread({}, containerProps), {}, {
|
|
91
102
|
className: className,
|
|
@@ -111,7 +122,7 @@ function PageHeaderImpl({
|
|
|
111
122
|
title: title,
|
|
112
123
|
titleInputProps: titleInputProps,
|
|
113
124
|
zIndex: zIndex
|
|
114
|
-
}),
|
|
125
|
+
}), dsUtilities.isFunction(renderToolbar) && /*#__PURE__*/_jsx__default["default"](PageHeaderToolbar, {}, void 0, renderToolbar())))]
|
|
115
126
|
}));
|
|
116
127
|
}
|
|
117
128
|
|
package/cjs/v1/Title.js
CHANGED
|
@@ -13,10 +13,13 @@ var DSTruncatedTooltipText__default = /*#__PURE__*/_interopDefaultLegacy(DSTrunc
|
|
|
13
13
|
const blockName = 'page-header';
|
|
14
14
|
const TitleWrapper = dsClassnames.aggregatedClasses(DSTruncatedTooltipText__default["default"])("".concat(blockName, "-title"), 'title');
|
|
15
15
|
|
|
16
|
-
const Title =
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
16
|
+
const Title = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
children
|
|
19
|
+
} = _ref;
|
|
20
|
+
return /*#__PURE__*/_jsx__default["default"](TitleWrapper, {
|
|
21
|
+
value: children
|
|
22
|
+
});
|
|
23
|
+
};
|
|
21
24
|
|
|
22
25
|
module.exports = Title;
|
package/cjs/v2/PageHeader.js
CHANGED
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
7
12
|
require('react');
|
|
@@ -18,7 +23,7 @@ var PageHeaderBack = require('./components/PageHeaderBack/PageHeaderBack.js');
|
|
|
18
23
|
require('./components/blocks.js');
|
|
19
24
|
var props = require('./props.js');
|
|
20
25
|
var jsxRuntime = require('react/jsx-runtime');
|
|
21
|
-
var
|
|
26
|
+
var dsClassnames = require('@elliemae/ds-classnames');
|
|
22
27
|
|
|
23
28
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
24
29
|
|
|
@@ -41,16 +46,17 @@ const ContainerWBorder = /*#__PURE__*/styled__default["default"].div.withConfig(
|
|
|
41
46
|
componentId: "sc-ps4m9w-2"
|
|
42
47
|
})(["width:100%;padding:12px 0 8px 0;display:grid;align-items:center;height:100%;", ""], props => !props.withBottomSeparator ? '' : "border-bottom: solid 1px ".concat(props.theme.colors.neutral[400], ";"));
|
|
43
48
|
|
|
44
|
-
const DSPageHeaderV2 =
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
49
|
+
const DSPageHeaderV2 = _ref => {
|
|
50
|
+
let {
|
|
51
|
+
containerProps,
|
|
52
|
+
breadcrumbs,
|
|
53
|
+
pageTitle,
|
|
54
|
+
backarrow,
|
|
55
|
+
summary,
|
|
56
|
+
toolbar,
|
|
57
|
+
menu,
|
|
58
|
+
withBottomSeparator
|
|
59
|
+
} = _ref;
|
|
54
60
|
const wrapperRow = ['auto', 1];
|
|
55
61
|
const mainRow = lodash.compact([1, 'auto']);
|
|
56
62
|
const pageTitleRow = lodash.compact(['auto', menu && '30px', summary && 'auto', 1]);
|
|
@@ -62,7 +68,7 @@ const DSPageHeaderV2 = ({
|
|
|
62
68
|
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, /*#__PURE__*/_jsx__default["default"](PageHeaderBack.PageHeaderBack, {}, void 0, backarrow)), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
63
69
|
rows: ['auto', 'auto']
|
|
64
70
|
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
65
|
-
className: "".concat(
|
|
71
|
+
className: "".concat(dsClassnames.cssPrefix, "-page-header-v2-breadcrumb")
|
|
66
72
|
}, void 0, breadcrumbs), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
67
73
|
cols: mainRow
|
|
68
74
|
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
7
12
|
require('react');
|
|
@@ -6,12 +6,16 @@ var _jsx = require('@babel/runtime/helpers/jsx');
|
|
|
6
6
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
7
7
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
8
8
|
require('core-js/modules/web.dom-collections.iterator.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');
|
|
9
14
|
var react = require('react');
|
|
10
15
|
var lodash = require('lodash');
|
|
11
16
|
var styled = require('styled-components');
|
|
12
17
|
var reactDesc = require('react-desc');
|
|
13
|
-
var
|
|
14
|
-
var useDerivedStateFromProps = require('@elliemae/ds-utilities/hooks/useDerivedStateFromProps');
|
|
18
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
15
19
|
var blocks = require('../blocks.js');
|
|
16
20
|
var PageHeaderTitle = require('../PageHeaderTitle/PageHeaderTitle.js');
|
|
17
21
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -22,7 +26,6 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
|
22
26
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
23
27
|
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
24
28
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
25
|
-
var useDerivedStateFromProps__default = /*#__PURE__*/_interopDefaultLegacy(useDerivedStateFromProps);
|
|
26
29
|
|
|
27
30
|
const _excluded = ["children", "editing", "onBlur", "onChange", "onFocus", "onMouseOut", "showMarker"];
|
|
28
31
|
|
|
@@ -46,11 +49,11 @@ const PageHeaderEditableTitle = _ref => {
|
|
|
46
49
|
|
|
47
50
|
const [titleValue, setTitleValue] = react.useState(value);
|
|
48
51
|
const [hovered, setHovered] = react.useState(false);
|
|
49
|
-
const [editing, setEditing] =
|
|
52
|
+
const [editing, setEditing] = dsUtilities.useDerivedStateFromProps(editingProp || false);
|
|
50
53
|
const titleRef = react.useRef(null);
|
|
51
54
|
const {
|
|
52
55
|
width
|
|
53
|
-
} =
|
|
56
|
+
} = dsUtilities.useMeasure(titleRef);
|
|
54
57
|
return /*#__PURE__*/_jsx__default["default"](EditableContainer, {
|
|
55
58
|
className: hovered || editing ? 'editable-title-component' : '',
|
|
56
59
|
onMouseEnter: () => setHovered(true),
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
7
12
|
require('react');
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
7
12
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
7
12
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
7
12
|
require('react');
|
|
@@ -2,25 +2,20 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var aggregatedClasses = require('@elliemae/ds-classnames/aggregatedClasses');
|
|
6
5
|
var dsClassnames = require('@elliemae/ds-classnames');
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
10
|
-
|
|
11
|
-
var DSInput__default = /*#__PURE__*/_interopDefaultLegacy(DSInput);
|
|
6
|
+
var dsForm = require('@elliemae/ds-form');
|
|
12
7
|
|
|
13
8
|
const blockName = 'page-header-v2';
|
|
14
9
|
const PageHeaderTitleWrapper = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-title"), 'title');
|
|
15
|
-
const EditableTitleComponent = dsClassnames.aggregatedClasses(
|
|
10
|
+
const EditableTitleComponent = dsClassnames.aggregatedClasses(dsForm.DSInput)("".concat(blockName, "-title"), 'editable-title');
|
|
16
11
|
const PageHeaderBackWrapper = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-back"));
|
|
17
12
|
const PageHeaderSummaryWrapper = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-summary"));
|
|
18
13
|
const PageHeaderMenuWrapper = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-menu"));
|
|
19
14
|
const PageHeaderToolbarWrapper = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-toolbar"));
|
|
20
15
|
|
|
21
16
|
Object.defineProperty(exports, 'cssPrefix', {
|
|
22
|
-
|
|
23
|
-
|
|
17
|
+
enumerable: true,
|
|
18
|
+
get: function () { return dsClassnames.cssPrefix; }
|
|
24
19
|
});
|
|
25
20
|
exports.EditableTitleComponent = EditableTitleComponent;
|
|
26
21
|
exports.PageHeaderBackWrapper = PageHeaderBackWrapper;
|
package/esm/v1/DSPageHeader.js
CHANGED
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
7
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
8
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
package/esm/v1/DropdownTitle.js
CHANGED
|
@@ -1,20 +1,21 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import 'react';
|
|
3
3
|
import DSDropdownMenu from '@elliemae/ds-dropdownmenu';
|
|
4
|
-
import ChevronSmallDown from '@elliemae/ds-icons
|
|
4
|
+
import { ChevronSmallDown } from '@elliemae/ds-icons';
|
|
5
5
|
import DSButton from '@elliemae/ds-button';
|
|
6
6
|
import TitleWrapper from './TitleWrapper.js';
|
|
7
7
|
|
|
8
8
|
var _DSButton;
|
|
9
9
|
|
|
10
|
-
function DropdownTitle({
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
10
|
+
function DropdownTitle(_ref) {
|
|
11
|
+
let {
|
|
12
|
+
titleComponent,
|
|
13
|
+
onSelectOption,
|
|
14
|
+
options,
|
|
15
|
+
optionsMinWidth,
|
|
16
|
+
selection,
|
|
17
|
+
zIndex
|
|
18
|
+
} = _ref;
|
|
18
19
|
return /*#__PURE__*/_jsx(TitleWrapper, {}, void 0, titleComponent, /*#__PURE__*/_jsx(DSDropdownMenu, {
|
|
19
20
|
minWidth: optionsMinWidth,
|
|
20
21
|
onSelectMenuItem: onSelectOption,
|
package/esm/v1/EditableTitle.js
CHANGED
|
@@ -1,10 +1,14 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
7
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
8
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
4
9
|
import { useState, useRef } from 'react';
|
|
5
|
-
import useDerivedStateFromProps from '@elliemae/ds-utilities
|
|
10
|
+
import { useDerivedStateFromProps, runAll } from '@elliemae/ds-utilities';
|
|
6
11
|
import { aggregatedClasses } from '@elliemae/ds-classnames';
|
|
7
|
-
import { runAll } from '@elliemae/ds-utilities/utils';
|
|
8
12
|
import DSInput from '@elliemae/ds-form/Input';
|
|
9
13
|
import Title from './Title.js';
|
|
10
14
|
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
@@ -15,11 +19,12 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
15
19
|
const blockName = 'page-header';
|
|
16
20
|
const EditableTitleComponent = aggregatedClasses(DSInput)("".concat(blockName, "-title"), 'editable-title');
|
|
17
21
|
|
|
18
|
-
function EditableTitle({
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
22
|
+
function EditableTitle(_ref) {
|
|
23
|
+
let {
|
|
24
|
+
children: value,
|
|
25
|
+
editing: editingProp,
|
|
26
|
+
titleInputProps
|
|
27
|
+
} = _ref;
|
|
23
28
|
const [titleValue, setTitleValue] = useState(value);
|
|
24
29
|
const [hovered, setHovered] = useState(false);
|
|
25
30
|
const [editing, setEditing] = useDerivedStateFromProps(editingProp || false);
|