@elliemae/ds-page-header 2.2.1 → 2.3.0-alpha.4
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/DSPageHeader.js +36 -21
- package/cjs/DSPageHeader.js.map +7 -0
- package/cjs/index.js +43 -26
- package/cjs/index.js.map +7 -0
- package/cjs/v1/DSPageHeader.js +93 -120
- package/cjs/v1/DSPageHeader.js.map +7 -0
- package/cjs/v1/DropdownTitle.js +49 -35
- package/cjs/v1/DropdownTitle.js.map +7 -0
- package/cjs/v1/EditableTitle.js +68 -54
- package/cjs/v1/EditableTitle.js.map +7 -0
- package/cjs/v1/PageHeaderImpl.js +122 -116
- package/cjs/v1/PageHeaderImpl.js.map +7 -0
- package/cjs/v1/Title.js +42 -24
- package/cjs/v1/Title.js.map +7 -0
- package/cjs/v1/TitleWrapper.js +37 -8
- package/cjs/v1/TitleWrapper.js.map +7 -0
- package/cjs/v2/PageHeader.js +104 -89
- package/cjs/v2/PageHeader.js.map +7 -0
- package/cjs/v2/components/PageHeaderBack/PageHeaderBack.js +38 -36
- package/cjs/v2/components/PageHeaderBack/PageHeaderBack.js.map +7 -0
- package/cjs/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js +87 -101
- package/cjs/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js.map +7 -0
- package/cjs/v2/components/PageHeaderMenu/PageHeaderMenu.js +38 -36
- package/cjs/v2/components/PageHeaderMenu/PageHeaderMenu.js.map +7 -0
- package/cjs/v2/components/PageHeaderSummary/PageHeaderSummary.js +50 -57
- package/cjs/v2/components/PageHeaderSummary/PageHeaderSummary.js.map +7 -0
- package/cjs/v2/components/PageHeaderTitle/PageHeaderTitle.js +51 -60
- package/cjs/v2/components/PageHeaderTitle/PageHeaderTitle.js.map +7 -0
- package/cjs/v2/components/PageHeaderToolbar/PageHeaderToolbar.js +38 -36
- package/cjs/v2/components/PageHeaderToolbar/PageHeaderToolbar.js.map +7 -0
- package/cjs/v2/components/blocks.js +48 -24
- package/cjs/v2/components/blocks.js.map +7 -0
- package/cjs/v2/props.js +44 -32
- package/cjs/v2/props.js.map +7 -0
- package/cjs/v2/tests/utils.js +123 -0
- package/cjs/v2/tests/utils.js.map +7 -0
- package/esm/DSPageHeader.js +7 -6
- package/esm/DSPageHeader.js.map +7 -0
- package/esm/index.js +14 -6
- package/esm/index.js.map +7 -0
- package/esm/v1/DSPageHeader.js +65 -109
- package/esm/v1/DSPageHeader.js.map +7 -0
- package/esm/v1/DropdownTitle.js +20 -27
- package/esm/v1/DropdownTitle.js.map +7 -0
- package/esm/v1/EditableTitle.js +35 -42
- package/esm/v1/EditableTitle.js.map +7 -0
- package/esm/v1/PageHeaderImpl.js +95 -110
- package/esm/v1/PageHeaderImpl.js.map +7 -0
- package/esm/v1/Title.js +13 -17
- package/esm/v1/Title.js.map +7 -0
- package/esm/v1/TitleWrapper.js +8 -6
- package/esm/v1/TitleWrapper.js.map +7 -0
- package/esm/v2/PageHeader.js +72 -70
- package/esm/v2/PageHeader.js.map +7 -0
- package/esm/v2/components/PageHeaderBack/PageHeaderBack.js +9 -27
- package/esm/v2/components/PageHeaderBack/PageHeaderBack.js.map +7 -0
- package/esm/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js +53 -83
- package/esm/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js.map +7 -0
- package/esm/v2/components/PageHeaderMenu/PageHeaderMenu.js +9 -27
- package/esm/v2/components/PageHeaderMenu/PageHeaderMenu.js.map +7 -0
- package/esm/v2/components/PageHeaderSummary/PageHeaderSummary.js +21 -46
- package/esm/v2/components/PageHeaderSummary/PageHeaderSummary.js.map +7 -0
- package/esm/v2/components/PageHeaderTitle/PageHeaderTitle.js +22 -47
- package/esm/v2/components/PageHeaderTitle/PageHeaderTitle.js.map +7 -0
- package/esm/v2/components/PageHeaderToolbar/PageHeaderToolbar.js +9 -27
- package/esm/v2/components/PageHeaderToolbar/PageHeaderToolbar.js.map +7 -0
- package/esm/v2/components/blocks.js +20 -13
- package/esm/v2/components/blocks.js.map +7 -0
- package/esm/v2/props.js +15 -27
- package/esm/v2/props.js.map +7 -0
- package/esm/v2/tests/utils.js +94 -0
- package/esm/v2/tests/utils.js.map +7 -0
- package/package.json +11 -11
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/v1/EditableTitle.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useState } from 'react';\nimport { useDerivedStateFromProps } from '@elliemae/ds-utilities';\nimport PropTypes from 'prop-types';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { runAll } from '@elliemae/ds-utilities';\nimport DSInput from '@elliemae/ds-form/Input';\nimport Title from './Title';\n\nconst blockName = 'page-header';\n\nconst EditableTitleComponent = aggregatedClasses(DSInput)(\n `${blockName}-title`,\n 'editable-title',\n);\n\nfunction EditableTitle({\n children: value,\n editing: editingProp,\n titleInputProps,\n}) {\n const [titleValue, setTitleValue] = useState(value);\n const [hovered, setHovered] = useState(false);\n const [editing, setEditing] = useDerivedStateFromProps(editingProp || false);\n const titleRef = useRef(null);\n return (\n <>\n {hovered || editing ? (\n <EditableTitleComponent\n {...titleInputProps}\n onBlur={runAll(() => setEditing(false), titleInputProps.onBlur)}\n onChange={runAll(\n (e) => setTitleValue(e.target.value),\n titleInputProps.onChange,\n )}\n onFocus={runAll(() => setEditing(true), titleInputProps.onFocus)}\n onMouseOut={runAll(\n () => setHovered(false),\n titleInputProps.onMouseOut,\n )}\n value={titleValue}\n />\n ) : (\n <div ref={titleRef} onMouseEnter={() => setHovered(true)}>\n <Title>{titleValue}</Title>\n </div>\n )}\n </>\n );\n}\n\nEditableTitle.propTypes = {\n /** The title text */\n children: PropTypes.string,\n /** Whether the title is editing or not */\n editing: PropTypes.bool,\n};\n\nexport default EditableTitle;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwC;AACxC,0BAAyC;AACzC,wBAAsB;AACtB,2BAAkC;AAClC,2BAAuB;AACvB,mBAAoB;AACpB,mBAAkB;AAElB,MAAM,YAAY;AAElB,MAAM,yBAAyB,4CAAkB,sBAC/C,GAAG,mBACH;AAGF,uBAAuB;AAAA,EACrB,UAAU;AAAA,EACV,SAAS;AAAA,EACT;AAAA,GACC;AACD,QAAM,CAAC,YAAY,iBAAiB,2BAAS;AAC7C,QAAM,CAAC,SAAS,cAAc,2BAAS;AACvC,QAAM,CAAC,SAAS,cAAc,kDAAyB,eAAe;AACtE,QAAM,WAAW,yBAAO;AACxB,SACE,wFACG,WAAW,UACV,mDAAC,wBAAD;AAAA,OACM;AAAA,IACJ,QAAQ,iCAAO,MAAM,WAAW,QAAQ,gBAAgB;AAAA,IACxD,UAAU,iCACR,CAAC,MAAM,cAAc,EAAE,OAAO,QAC9B,gBAAgB;AAAA,IAElB,SAAS,iCAAO,MAAM,WAAW,OAAO,gBAAgB;AAAA,IACxD,YAAY,iCACV,MAAM,WAAW,QACjB,gBAAgB;AAAA,IAElB,OAAO;AAAA,OAGT,mDAAC,OAAD;AAAA,IAAK,KAAK;AAAA,IAAU,cAAc,MAAM,WAAW;AAAA,KACjD,mDAAC,sBAAD,MAAQ;AAAA;AAOlB,cAAc,YAAY;AAAA,EAExB,UAAU,0BAAU;AAAA,EAEpB,SAAS,0BAAU;AAAA;AAGrB,IAAO,wBAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/v1/PageHeaderImpl.js
CHANGED
|
@@ -1,129 +1,135 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
27
|
-
var DSBreadcrumb__default = /*#__PURE__*/_interopDefaultLegacy(DSBreadcrumb);
|
|
28
|
-
|
|
29
|
-
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; }
|
|
30
|
-
|
|
31
|
-
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; }
|
|
32
|
-
const blockName = 'page-header';
|
|
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
|
|
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);
|
|
41
26
|
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var PageHeaderImpl_exports = {};
|
|
29
|
+
__export(PageHeaderImpl_exports, {
|
|
30
|
+
default: () => PageHeaderImpl_default
|
|
42
31
|
});
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var import_react = __toESM(require("react"));
|
|
34
|
+
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
35
|
+
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
36
|
+
var import_ds_icons = require("@elliemae/ds-icons");
|
|
37
|
+
var import_ds_breadcrumb = __toESM(require("@elliemae/ds-breadcrumb"));
|
|
38
|
+
var import_ds_icon = require("@elliemae/ds-icon");
|
|
39
|
+
var import_EditableTitle = __toESM(require("./EditableTitle"));
|
|
40
|
+
var import_Title = __toESM(require("./Title"));
|
|
41
|
+
var import_DropdownTitle = __toESM(require("./DropdownTitle"));
|
|
42
|
+
const blockName = "page-header";
|
|
43
|
+
const PageHeaderContainer = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, null, ({ withBottomSeparator, subtitle }) => ({
|
|
44
|
+
"with-bottom-separator": withBottomSeparator,
|
|
45
|
+
"with-subtitle": subtitle
|
|
47
46
|
}));
|
|
48
|
-
const
|
|
49
|
-
const
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
47
|
+
const PageHeaderMainSection = (0, import_ds_classnames.aggregatedClasses)("div")(`${blockName}-main-section`);
|
|
48
|
+
const PageHeaderTitleSection = (0, import_ds_classnames.aggregatedClasses)("div")(`${blockName}-title-section`);
|
|
49
|
+
const PageHeaderToolbar = (0, import_ds_classnames.aggregatedClasses)("div")(`${blockName}-toolbar`, null, () => ({
|
|
50
|
+
"ie-flex-basis-auto": true
|
|
51
|
+
}));
|
|
52
|
+
const PageHeaderBreadcrumb = (0, import_ds_classnames.aggregatedClasses)(import_ds_breadcrumb.default)(`${blockName}-breadcrumb`);
|
|
53
|
+
const PageHeaderTitle = (0, import_ds_classnames.aggregatedClasses)("div")(`${blockName}-title`);
|
|
54
|
+
const Subtitle = (0, import_ds_classnames.aggregatedClasses)("div")(`${blockName}-title`, "subtitle");
|
|
55
|
+
const BackArrow = (0, import_ds_classnames.aggregatedClasses)(import_ds_icons.ChevronLeft)(`${blockName}-backarrow`);
|
|
56
|
+
function HeaderTitle({
|
|
57
|
+
title = "",
|
|
58
|
+
options = [],
|
|
59
|
+
optionsMinWidth,
|
|
60
|
+
onSelectOption = () => null,
|
|
61
|
+
selection,
|
|
62
|
+
subtitle = "",
|
|
63
|
+
editable = false,
|
|
64
|
+
editing = false,
|
|
65
|
+
titleInputProps,
|
|
66
|
+
zIndex
|
|
67
|
+
}) {
|
|
68
|
+
const titleComponent = editable ? /* @__PURE__ */ import_react.default.createElement(import_EditableTitle.default, {
|
|
69
|
+
editing,
|
|
70
|
+
titleInputProps
|
|
71
|
+
}, title) : /* @__PURE__ */ import_react.default.createElement(import_Title.default, null, title);
|
|
72
|
+
return /* @__PURE__ */ import_react.default.createElement(PageHeaderTitle, null, options.length ? /* @__PURE__ */ import_react.default.createElement(import_DropdownTitle.default, {
|
|
73
|
+
onSelectOption,
|
|
74
|
+
options,
|
|
57
75
|
optionsMinWidth,
|
|
58
|
-
onSelectOption = () => null,
|
|
59
76
|
selection,
|
|
60
|
-
|
|
61
|
-
editable = false,
|
|
62
|
-
editing = false,
|
|
63
|
-
titleInputProps,
|
|
77
|
+
titleComponent,
|
|
64
78
|
zIndex
|
|
65
|
-
}
|
|
66
|
-
const titleComponent = editable ? /*#__PURE__*/_jsx__default["default"](EditableTitle, {
|
|
67
|
-
editing: editing,
|
|
68
|
-
titleInputProps: titleInputProps
|
|
69
|
-
}, void 0, title) : /*#__PURE__*/_jsx__default["default"](Title, {}, void 0, title);
|
|
70
|
-
return /*#__PURE__*/_jsx__default["default"](PageHeaderTitle, {}, void 0, options.length ? /*#__PURE__*/_jsx__default["default"](DropdownTitle, {
|
|
71
|
-
onSelectOption: onSelectOption,
|
|
72
|
-
options: options,
|
|
73
|
-
optionsMinWidth: optionsMinWidth,
|
|
74
|
-
selection: selection,
|
|
75
|
-
titleComponent: titleComponent,
|
|
76
|
-
zIndex: zIndex
|
|
77
|
-
}) : titleComponent, subtitle && /*#__PURE__*/_jsx__default["default"](Subtitle, {}, void 0, subtitle));
|
|
79
|
+
}) : titleComponent, subtitle && /* @__PURE__ */ import_react.default.createElement(Subtitle, null, subtitle));
|
|
78
80
|
}
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
81
|
+
function PageHeaderImpl({
|
|
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 = void 0,
|
|
98
|
+
zIndex
|
|
99
|
+
}) {
|
|
100
|
+
const hasBreadcrumbs = !!breadcrumbs.length;
|
|
101
|
+
return /* @__PURE__ */ import_react.default.createElement(PageHeaderContainer, {
|
|
102
|
+
...containerProps,
|
|
83
103
|
className,
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
104
|
+
classProps: {
|
|
105
|
+
withBottomSeparator,
|
|
106
|
+
subtitle
|
|
107
|
+
}
|
|
108
|
+
}, previousPage && /* @__PURE__ */ import_react.default.createElement(BackArrow, {
|
|
109
|
+
"data-testid": "back-arrow",
|
|
110
|
+
onClick: onGoToPreviousPage,
|
|
111
|
+
size: import_ds_icon.DSIconSizes.M
|
|
112
|
+
}), /* @__PURE__ */ import_react.default.createElement(PageHeaderMainSection, null, hasBreadcrumbs && /* @__PURE__ */ import_react.default.createElement(PageHeaderBreadcrumb, null, breadcrumbs.map((breadcrumb) => /* @__PURE__ */ import_react.default.createElement(import_ds_breadcrumb.default.Item, {
|
|
113
|
+
key: breadcrumb.label,
|
|
114
|
+
...breadcrumb
|
|
115
|
+
}))), previousPage && /* @__PURE__ */ import_react.default.createElement(PageHeaderBreadcrumb, null, /* @__PURE__ */ import_react.default.createElement(import_ds_breadcrumb.default.Item, {
|
|
116
|
+
key: previousPage.id,
|
|
117
|
+
label: previousPage.title,
|
|
118
|
+
onClick: previousPage.onClick,
|
|
119
|
+
...previousPage
|
|
120
|
+
})), /* @__PURE__ */ import_react.default.createElement(PageHeaderTitleSection, null, /* @__PURE__ */ import_react.default.createElement(HeaderTitle, {
|
|
121
|
+
editable,
|
|
122
|
+
editing,
|
|
92
123
|
onSelectOption,
|
|
93
|
-
|
|
124
|
+
options: titleOptions,
|
|
94
125
|
optionsMinWidth,
|
|
95
|
-
|
|
126
|
+
selection: optionsSelection,
|
|
127
|
+
subtitle,
|
|
128
|
+
title,
|
|
96
129
|
titleInputProps,
|
|
97
|
-
editing = undefined,
|
|
98
130
|
zIndex
|
|
99
|
-
}
|
|
100
|
-
const hasBreadcrumbs = !!breadcrumbs.length;
|
|
101
|
-
return /*#__PURE__*/jsxRuntime.jsxs(PageHeaderContainer, _objectSpread(_objectSpread({}, containerProps), {}, {
|
|
102
|
-
className: className,
|
|
103
|
-
classProps: {
|
|
104
|
-
withBottomSeparator,
|
|
105
|
-
subtitle
|
|
106
|
-
},
|
|
107
|
-
children: [previousPage && /*#__PURE__*/_jsx__default["default"](BackArrow, {
|
|
108
|
-
"data-testid": "back-arrow",
|
|
109
|
-
onClick: onGoToPreviousPage,
|
|
110
|
-
size: dsIcon.DSIconSizes.M
|
|
111
|
-
}), /*#__PURE__*/_jsx__default["default"](PageHeaderMainSection, {}, void 0, hasBreadcrumbs && /*#__PURE__*/_jsx__default["default"](PageHeaderBreadcrumb, {}, void 0, breadcrumbs.map(breadcrumb => /*#__PURE__*/jsxRuntime.jsx(DSBreadcrumb__default["default"].Item, _objectSpread({}, breadcrumb), breadcrumb.label))), previousPage && /*#__PURE__*/_jsx__default["default"](PageHeaderBreadcrumb, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(DSBreadcrumb__default["default"].Item, _objectSpread({
|
|
112
|
-
label: previousPage.title,
|
|
113
|
-
onClick: previousPage.onClick
|
|
114
|
-
}, previousPage), previousPage.id)), /*#__PURE__*/_jsx__default["default"](PageHeaderTitleSection, {}, void 0, /*#__PURE__*/_jsx__default["default"](HeaderTitle, {
|
|
115
|
-
editable: editable,
|
|
116
|
-
editing: editing,
|
|
117
|
-
onSelectOption: onSelectOption,
|
|
118
|
-
options: titleOptions,
|
|
119
|
-
optionsMinWidth: optionsMinWidth,
|
|
120
|
-
selection: optionsSelection,
|
|
121
|
-
subtitle: subtitle,
|
|
122
|
-
title: title,
|
|
123
|
-
titleInputProps: titleInputProps,
|
|
124
|
-
zIndex: zIndex
|
|
125
|
-
}), dsUtilities.isFunction(renderToolbar) && /*#__PURE__*/_jsx__default["default"](PageHeaderToolbar, {}, void 0, renderToolbar())))]
|
|
126
|
-
}));
|
|
131
|
+
}), (0, import_ds_utilities.isFunction)(renderToolbar) && /* @__PURE__ */ import_react.default.createElement(PageHeaderToolbar, null, renderToolbar()))));
|
|
127
132
|
}
|
|
128
|
-
|
|
129
|
-
module.exports =
|
|
133
|
+
var PageHeaderImpl_default = PageHeaderImpl;
|
|
134
|
+
module.exports = __toCommonJS(PageHeaderImpl_exports);
|
|
135
|
+
//# sourceMappingURL=PageHeaderImpl.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/v1/PageHeaderImpl.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { isFunction } from '@elliemae/ds-utilities';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport DSBreadcrumb from '@elliemae/ds-breadcrumb';\nimport { DSIconSizes } from '@elliemae/ds-icon';\nimport EditableTitle from './EditableTitle';\nimport Title from './Title';\nimport DropdownTitle from './DropdownTitle';\n\nconst blockName = 'page-header';\n\nconst PageHeaderContainer = aggregatedClasses('div')(blockName, null, ({ withBottomSeparator, subtitle }) => ({\n 'with-bottom-separator': withBottomSeparator,\n 'with-subtitle': subtitle,\n}));\n\nconst PageHeaderMainSection = aggregatedClasses('div')(`${blockName}-main-section`);\nconst PageHeaderTitleSection = aggregatedClasses('div')(`${blockName}-title-section`);\nconst PageHeaderToolbar = aggregatedClasses('div')(`${blockName}-toolbar`, null, () => ({\n 'ie-flex-basis-auto': true,\n}));\nconst PageHeaderBreadcrumb = aggregatedClasses(DSBreadcrumb)(`${blockName}-breadcrumb`);\n\nconst PageHeaderTitle = aggregatedClasses('div')(`${blockName}-title`);\nconst Subtitle = aggregatedClasses('div')(`${blockName}-title`, 'subtitle');\nconst BackArrow = aggregatedClasses(ChevronLeft)(`${blockName}-backarrow`);\n\nfunction HeaderTitle({\n title = '',\n options = [],\n optionsMinWidth,\n onSelectOption = () => null,\n selection,\n subtitle = '',\n editable = false,\n editing = false,\n titleInputProps,\n zIndex,\n}) {\n const titleComponent = editable ? (\n <EditableTitle editing={editing} titleInputProps={titleInputProps}>\n {title}\n </EditableTitle>\n ) : (\n <Title>{title}</Title>\n );\n\n return (\n <PageHeaderTitle>\n {options.length ? (\n <DropdownTitle\n onSelectOption={onSelectOption}\n options={options}\n optionsMinWidth={optionsMinWidth}\n selection={selection}\n titleComponent={titleComponent}\n zIndex={zIndex}\n />\n ) : (\n titleComponent\n )}\n {subtitle && <Subtitle>{subtitle}</Subtitle>}\n </PageHeaderTitle>\n );\n}\n\nfunction PageHeaderImpl({\n containerProps,\n className,\n title,\n titleOptions,\n renderToolbar,\n breadcrumbs = [],\n previousPage,\n onGoToPreviousPage = () => null,\n subtitle = '',\n withBottomSeparator,\n onSelectOption,\n optionsSelection,\n optionsMinWidth,\n editable = false,\n titleInputProps,\n editing = undefined,\n zIndex,\n}) {\n const hasBreadcrumbs = !!breadcrumbs.length;\n\n return (\n <PageHeaderContainer\n {...containerProps}\n className={className}\n classProps={{\n withBottomSeparator,\n subtitle,\n }}\n >\n {previousPage && <BackArrow data-testid=\"back-arrow\" onClick={onGoToPreviousPage} size={DSIconSizes.M} />}\n <PageHeaderMainSection>\n {hasBreadcrumbs && (\n <PageHeaderBreadcrumb>\n {breadcrumbs.map((breadcrumb) => (\n <DSBreadcrumb.Item key={breadcrumb.label} {...breadcrumb} />\n ))}\n </PageHeaderBreadcrumb>\n )}\n {previousPage && (\n <PageHeaderBreadcrumb>\n <DSBreadcrumb.Item\n key={previousPage.id}\n label={previousPage.title}\n onClick={previousPage.onClick}\n {...previousPage}\n />\n </PageHeaderBreadcrumb>\n )}\n <PageHeaderTitleSection>\n <HeaderTitle\n editable={editable}\n editing={editing}\n onSelectOption={onSelectOption}\n options={titleOptions}\n optionsMinWidth={optionsMinWidth}\n selection={optionsSelection}\n subtitle={subtitle}\n title={title}\n titleInputProps={titleInputProps}\n zIndex={zIndex}\n />\n {isFunction(renderToolbar) && <PageHeaderToolbar>{renderToolbar()}</PageHeaderToolbar>}\n </PageHeaderTitleSection>\n </PageHeaderMainSection>\n </PageHeaderContainer>\n );\n}\n\nexport default PageHeaderImpl;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAA2B;AAC3B,2BAAkC;AAClC,sBAA4B;AAC5B,2BAAyB;AACzB,qBAA4B;AAC5B,2BAA0B;AAC1B,mBAAkB;AAClB,2BAA0B;AAE1B,MAAM,YAAY;AAElB,MAAM,sBAAsB,4CAAkB,OAAO,WAAW,MAAM,CAAC,EAAE,qBAAqB,eAAgB;AAAA,EAC5G,yBAAyB;AAAA,EACzB,iBAAiB;AAAA;AAGnB,MAAM,wBAAwB,4CAAkB,OAAO,GAAG;AAC1D,MAAM,yBAAyB,4CAAkB,OAAO,GAAG;AAC3D,MAAM,oBAAoB,4CAAkB,OAAO,GAAG,qBAAqB,MAAM,MAAO;AAAA,EACtF,sBAAsB;AAAA;AAExB,MAAM,uBAAuB,4CAAkB,8BAAc,GAAG;AAEhE,MAAM,kBAAkB,4CAAkB,OAAO,GAAG;AACpD,MAAM,WAAW,4CAAkB,OAAO,GAAG,mBAAmB;AAChE,MAAM,YAAY,4CAAkB,6BAAa,GAAG;AAEpD,qBAAqB;AAAA,EACnB,QAAQ;AAAA,EACR,UAAU;AAAA,EACV;AAAA,EACA,iBAAiB,MAAM;AAAA,EACvB;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,UAAU;AAAA,EACV;AAAA,EACA;AAAA,GACC;AACD,QAAM,iBAAiB,WACrB,mDAAC,8BAAD;AAAA,IAAe;AAAA,IAAkB;AAAA,KAC9B,SAGH,mDAAC,sBAAD,MAAQ;AAGV,SACE,mDAAC,iBAAD,MACG,QAAQ,SACP,mDAAC,8BAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,OAGF,gBAED,YAAY,mDAAC,UAAD,MAAW;AAAA;AAK9B,wBAAwB;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,qBAAqB,MAAM;AAAA,EAC3B,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA,UAAU;AAAA,EACV;AAAA,GACC;AACD,QAAM,iBAAiB,CAAC,CAAC,YAAY;AAErC,SACE,mDAAC,qBAAD;AAAA,OACM;AAAA,IACJ;AAAA,IACA,YAAY;AAAA,MACV;AAAA,MACA;AAAA;AAAA,KAGD,gBAAgB,mDAAC,WAAD;AAAA,IAAW,eAAY;AAAA,IAAa,SAAS;AAAA,IAAoB,MAAM,2BAAY;AAAA,MACpG,mDAAC,uBAAD,MACG,kBACC,mDAAC,sBAAD,MACG,YAAY,IAAI,CAAC,eAChB,mDAAC,6BAAa,MAAd;AAAA,IAAmB,KAAK,WAAW;AAAA,OAAW;AAAA,QAInD,gBACC,mDAAC,sBAAD,MACE,mDAAC,6BAAa,MAAd;AAAA,IACE,KAAK,aAAa;AAAA,IAClB,OAAO,aAAa;AAAA,IACpB,SAAS,aAAa;AAAA,OAClB;AAAA,OAIV,mDAAC,wBAAD,MACE,mDAAC,aAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAED,oCAAW,kBAAkB,mDAAC,mBAAD,MAAoB;AAAA;AAO5D,IAAO,yBAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/v1/Title.js
CHANGED
|
@@ -1,25 +1,43 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
var DSTruncatedTooltipText__default = /*#__PURE__*/_interopDefaultLegacy(DSTruncatedTooltipText);
|
|
12
|
-
|
|
13
|
-
const blockName = 'page-header';
|
|
14
|
-
const TitleWrapper = dsClassnames.aggregatedClasses(DSTruncatedTooltipText__default["default"])("".concat(blockName, "-title"), 'title');
|
|
15
|
-
|
|
16
|
-
const Title = _ref => {
|
|
17
|
-
let {
|
|
18
|
-
children
|
|
19
|
-
} = _ref;
|
|
20
|
-
return /*#__PURE__*/_jsx__default["default"](TitleWrapper, {
|
|
21
|
-
value: children
|
|
22
|
-
});
|
|
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 });
|
|
23
11
|
};
|
|
24
|
-
|
|
25
|
-
|
|
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 Title_exports = {};
|
|
29
|
+
__export(Title_exports, {
|
|
30
|
+
default: () => Title_default
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var import_react = __toESM(require("react"));
|
|
34
|
+
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
35
|
+
var import_ds_truncated_tooltip_text = __toESM(require("@elliemae/ds-truncated-tooltip-text"));
|
|
36
|
+
const blockName = "page-header";
|
|
37
|
+
const TitleWrapper = (0, import_ds_classnames.aggregatedClasses)(import_ds_truncated_tooltip_text.default)(`${blockName}-title`, "title");
|
|
38
|
+
const Title = ({ children }) => /* @__PURE__ */ import_react.default.createElement(TitleWrapper, {
|
|
39
|
+
value: children
|
|
40
|
+
});
|
|
41
|
+
var Title_default = Title;
|
|
42
|
+
module.exports = __toCommonJS(Title_exports);
|
|
43
|
+
//# sourceMappingURL=Title.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/v1/Title.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport DSTruncatedTooltipText from '@elliemae/ds-truncated-tooltip-text';\n\nconst blockName = 'page-header';\nconst TitleWrapper = aggregatedClasses(DSTruncatedTooltipText)(\n `${blockName}-title`,\n 'title',\n);\nconst Title = ({ children }) => <TitleWrapper value={children} />;\n\nexport default Title;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,2BAAkC;AAClC,uCAAmC;AAEnC,MAAM,YAAY;AAClB,MAAM,eAAe,4CAAkB,0CACrC,GAAG,mBACH;AAEF,MAAM,QAAQ,CAAC,EAAE,eAAe,mDAAC,cAAD;AAAA,EAAc,OAAO;AAAA;AAErD,IAAO,gBAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/v1/TitleWrapper.js
CHANGED
|
@@ -1,8 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
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 TitleWrapper_exports = {};
|
|
29
|
+
__export(TitleWrapper_exports, {
|
|
30
|
+
default: () => TitleWrapper_default
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
34
|
+
const blockName = "page-header";
|
|
35
|
+
var TitleWrapper_default = (0, import_ds_classnames.aggregatedClasses)("span")(`${blockName}-title-wrapper`);
|
|
36
|
+
module.exports = __toCommonJS(TitleWrapper_exports);
|
|
37
|
+
//# sourceMappingURL=TitleWrapper.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/v1/TitleWrapper.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { aggregatedClasses } from '@elliemae/ds-classnames';\n\nconst blockName = 'page-header';\n\nexport default aggregatedClasses('span')(`${blockName}-title-wrapper`);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,2BAAkC;AAElC,MAAM,YAAY;AAElB,IAAO,uBAAQ,4CAAkB,QAAQ,GAAG;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/v2/PageHeader.js
CHANGED
|
@@ -1,91 +1,106 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
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
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
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 PageHeader_exports = {};
|
|
29
|
+
__export(PageHeader_exports, {
|
|
30
|
+
DSPageHeaderV2: () => DSPageHeaderV2,
|
|
31
|
+
DSPageHeaderWithSchema: () => DSPageHeaderWithSchema,
|
|
32
|
+
PageHeaderCustomRenderer: () => PageHeaderCustomRenderer,
|
|
33
|
+
PageHeaderEditableTitle: () => import_PageHeaderEditableTitle.PageHeaderEditableTitle,
|
|
34
|
+
PageHeaderMenu: () => import_PageHeaderMenu.PageHeaderMenu,
|
|
35
|
+
PageHeaderSummary: () => import_PageHeaderSummary.PageHeaderSummary,
|
|
36
|
+
PageHeaderTitle: () => import_PageHeaderTitle.PageHeaderTitle,
|
|
37
|
+
default: () => PageHeader_default
|
|
38
|
+
});
|
|
39
|
+
var React = __toESM(require("react"));
|
|
40
|
+
var import_react = __toESM(require("react"));
|
|
41
|
+
var import_react_desc = require("react-desc");
|
|
42
|
+
var import_lodash = require("lodash");
|
|
43
|
+
var import_styled_components = __toESM(require("styled-components"));
|
|
44
|
+
var import_ds_grid = require("@elliemae/ds-grid");
|
|
45
|
+
var import_PageHeaderTitle = require("./components/PageHeaderTitle/PageHeaderTitle");
|
|
46
|
+
var import_PageHeaderEditableTitle = require("./components/PageHeaderEditableTitle/PageHeaderEditableTitle");
|
|
47
|
+
var import_PageHeaderSummary = require("./components/PageHeaderSummary/PageHeaderSummary");
|
|
48
|
+
var import_PageHeaderMenu = require("./components/PageHeaderMenu/PageHeaderMenu");
|
|
49
|
+
var import_PageHeaderToolbar = require("./components/PageHeaderToolbar/PageHeaderToolbar");
|
|
50
|
+
var import_PageHeaderBack = require("./components/PageHeaderBack/PageHeaderBack");
|
|
51
|
+
var import_blocks = require("./components/blocks");
|
|
52
|
+
var import_props = require("./props");
|
|
53
|
+
const PageHeaderCustomRenderer = import_styled_components.default.div`
|
|
54
|
+
width: auto;
|
|
55
|
+
color: ${(props) => props.theme.colors.brand[800]};
|
|
56
|
+
font-style: italic;
|
|
57
|
+
font-size: 0.8rem;
|
|
58
|
+
`;
|
|
59
|
+
const Container = import_styled_components.default.div`
|
|
60
|
+
width: 100%;
|
|
61
|
+
margin-bottom: 8px;
|
|
62
|
+
`;
|
|
63
|
+
const ContainerWBorder = import_styled_components.default.div`
|
|
64
|
+
width: 100%;
|
|
65
|
+
padding: 12px 0 8px 0;
|
|
66
|
+
display: grid;
|
|
67
|
+
align-items: center;
|
|
68
|
+
height: 100%;
|
|
69
|
+
${(props) => !props.withBottomSeparator ? "" : `border-bottom: solid 1px ${props.theme.colors.neutral[400]};`}
|
|
70
|
+
`;
|
|
71
|
+
const DSPageHeaderV2 = ({
|
|
72
|
+
containerProps,
|
|
73
|
+
breadcrumbs,
|
|
74
|
+
pageTitle,
|
|
75
|
+
backarrow,
|
|
76
|
+
summary,
|
|
77
|
+
toolbar,
|
|
78
|
+
menu,
|
|
79
|
+
withBottomSeparator
|
|
80
|
+
}) => {
|
|
81
|
+
const wrapperRow = ["auto", 1];
|
|
82
|
+
const mainRow = (0, import_lodash.compact)([1, "auto"]);
|
|
83
|
+
const pageTitleRow = (0, import_lodash.compact)(["auto", menu && "30px", summary && "auto", 1]);
|
|
84
|
+
return /* @__PURE__ */ import_react.default.createElement(Container, {
|
|
85
|
+
...containerProps
|
|
86
|
+
}, /* @__PURE__ */ import_react.default.createElement(ContainerWBorder, {
|
|
58
87
|
withBottomSeparator
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
71
|
-
className: "".concat(dsClassnames.cssPrefix, "-page-header-v2-breadcrumb")
|
|
72
|
-
}, void 0, breadcrumbs), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
73
|
-
cols: mainRow
|
|
74
|
-
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
75
|
-
cols: pageTitleRow
|
|
76
|
-
}, void 0, pageTitle, menu && /*#__PURE__*/_jsx__default["default"](PageHeaderMenu.PageHeaderMenu, {}, void 0, menu), summary, _div || (_div = /*#__PURE__*/_jsx__default["default"]("div", {}))), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, /*#__PURE__*/_jsx__default["default"](PageHeaderToolbar.PageHeaderToolbar, {}, void 0, toolbar))))))
|
|
77
|
-
}));
|
|
88
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
89
|
+
cols: wrapperRow
|
|
90
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_PageHeaderBack.PageHeaderBack, null, backarrow)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
91
|
+
rows: ["auto", "auto"]
|
|
92
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
93
|
+
className: `${import_blocks.cssPrefix}-page-header-v2-breadcrumb`
|
|
94
|
+
}, breadcrumbs), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
95
|
+
cols: mainRow
|
|
96
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
97
|
+
cols: pageTitleRow
|
|
98
|
+
}, pageTitle, menu && /* @__PURE__ */ import_react.default.createElement(import_PageHeaderMenu.PageHeaderMenu, null, menu), summary, /* @__PURE__ */ import_react.default.createElement("div", null)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_PageHeaderToolbar.PageHeaderToolbar, null, toolbar)))))));
|
|
78
99
|
};
|
|
79
|
-
|
|
80
|
-
DSPageHeaderV2.defaultProps =
|
|
81
|
-
const DSPageHeaderWithSchema =
|
|
82
|
-
DSPageHeaderWithSchema.propTypes =
|
|
83
|
-
|
|
84
|
-
exports
|
|
85
|
-
|
|
86
|
-
exports.PageHeaderSummary = PageHeaderSummary.PageHeaderSummary;
|
|
87
|
-
exports.PageHeaderMenu = PageHeaderMenu.PageHeaderMenu;
|
|
88
|
-
exports.DSPageHeaderV2 = DSPageHeaderV2;
|
|
89
|
-
exports.DSPageHeaderWithSchema = DSPageHeaderWithSchema;
|
|
90
|
-
exports.PageHeaderCustomRenderer = PageHeaderCustomRenderer;
|
|
91
|
-
exports["default"] = DSPageHeaderV2;
|
|
100
|
+
DSPageHeaderV2.propTypes = import_props.navProps;
|
|
101
|
+
DSPageHeaderV2.defaultProps = import_props.defaultProps;
|
|
102
|
+
const DSPageHeaderWithSchema = (0, import_react_desc.describe)(DSPageHeaderV2);
|
|
103
|
+
DSPageHeaderWithSchema.propTypes = import_props.navProps;
|
|
104
|
+
var PageHeader_default = DSPageHeaderV2;
|
|
105
|
+
module.exports = __toCommonJS(PageHeader_exports);
|
|
106
|
+
//# sourceMappingURL=PageHeader.js.map
|