@elliemae/ds-page-header 3.0.0-next.8 → 3.0.0-next.80
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/dist/cjs/DSPageHeader.js +11 -17
- package/dist/cjs/DSPageHeader.js.map +1 -1
- package/dist/cjs/index.js +16 -21
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/v1/DSPageHeader.js +10 -16
- package/dist/cjs/v1/DSPageHeader.js.map +2 -2
- package/dist/cjs/v1/DropdownTitle.js +9 -16
- package/dist/cjs/v1/DropdownTitle.js.map +1 -1
- package/dist/cjs/v1/EditableTitle.js +9 -16
- package/dist/cjs/v1/EditableTitle.js.map +1 -1
- package/dist/cjs/v1/PageHeaderImpl.js +9 -16
- package/dist/cjs/v1/PageHeaderImpl.js.map +1 -1
- package/dist/cjs/v1/Title.js +9 -16
- package/dist/cjs/v1/Title.js.map +1 -1
- package/dist/cjs/v1/TitleWrapper.js +9 -16
- package/dist/cjs/v1/TitleWrapper.js.map +1 -1
- package/dist/cjs/v2/PageHeader.js +49 -67
- package/dist/cjs/v2/PageHeader.js.map +2 -2
- package/dist/cjs/v2/components/{PageHeaderEditableTitle/PageHeaderEditableTitle.js → PageHeaderEditableTitle.js} +60 -58
- package/dist/cjs/v2/components/PageHeaderEditableTitle.js.map +7 -0
- package/dist/cjs/v2/components/PageHeaderSummary.js +109 -0
- package/dist/cjs/v2/components/PageHeaderSummary.js.map +7 -0
- package/dist/cjs/v2/components/{PageHeaderTitle/PageHeaderTitle.js → PageHeaderTitle.js} +40 -28
- package/dist/cjs/v2/components/PageHeaderTitle.js.map +7 -0
- package/dist/cjs/v2/config/usePageHeader.js +117 -0
- package/dist/cjs/v2/config/usePageHeader.js.map +7 -0
- package/dist/cjs/v2/exported-related/data-test-ids.js +33 -0
- package/dist/cjs/v2/exported-related/data-test-ids.js.map +7 -0
- package/dist/cjs/v2/exported-related/index.js +23 -0
- package/dist/cjs/v2/exported-related/index.js.map +7 -0
- package/dist/cjs/v2/exported-related/theming.js +37 -0
- package/dist/cjs/v2/exported-related/theming.js.map +7 -0
- package/dist/cjs/v2/react-desc-prop-types.js +66 -0
- package/dist/cjs/v2/react-desc-prop-types.js.map +7 -0
- package/dist/cjs/v2/styled.js +108 -0
- package/dist/cjs/v2/styled.js.map +7 -0
- package/dist/cjs/v2/tests/utils.js +9 -16
- package/dist/cjs/v2/tests/utils.js.map +1 -1
- package/dist/esm/index.js +4 -3
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/v1/DSPageHeader.js +1 -0
- package/dist/esm/v1/DSPageHeader.js.map +2 -2
- package/dist/esm/v1/DropdownTitle.js.map +1 -1
- package/dist/esm/v1/EditableTitle.js.map +1 -1
- package/dist/esm/v1/PageHeaderImpl.js.map +1 -1
- package/dist/esm/v1/Title.js.map +1 -1
- package/dist/esm/v1/TitleWrapper.js.map +1 -1
- package/dist/esm/v2/PageHeader.js +43 -47
- package/dist/esm/v2/PageHeader.js.map +2 -2
- package/dist/esm/v2/components/{PageHeaderEditableTitle/PageHeaderEditableTitle.js → PageHeaderEditableTitle.js} +57 -41
- package/dist/esm/v2/components/PageHeaderEditableTitle.js.map +7 -0
- package/dist/esm/v2/components/{PageHeaderSummary/PageHeaderSummary.js → PageHeaderSummary.js} +38 -3
- package/dist/esm/v2/components/PageHeaderSummary.js.map +7 -0
- package/dist/esm/v2/components/{PageHeaderTitle/PageHeaderTitle.js → PageHeaderTitle.js} +25 -6
- package/dist/esm/v2/components/PageHeaderTitle.js.map +7 -0
- package/dist/esm/v2/config/usePageHeader.js +102 -0
- package/dist/esm/v2/config/usePageHeader.js.map +7 -0
- package/dist/esm/v2/exported-related/data-test-ids.js +11 -0
- package/dist/esm/v2/exported-related/data-test-ids.js.map +7 -0
- package/dist/esm/v2/exported-related/index.js +4 -0
- package/dist/esm/v2/exported-related/index.js.map +7 -0
- package/dist/esm/v2/exported-related/theming.js +15 -0
- package/dist/esm/v2/exported-related/theming.js.map +7 -0
- package/dist/esm/v2/react-desc-prop-types.js +46 -0
- package/dist/esm/v2/react-desc-prop-types.js.map +7 -0
- package/dist/esm/v2/styled.js +86 -0
- package/dist/esm/v2/styled.js.map +7 -0
- package/dist/esm/v2/tests/utils.js.map +1 -1
- package/package.json +20 -19
- package/dist/cjs/v2/components/PageHeaderBack/PageHeaderBack.js +0 -66
- package/dist/cjs/v2/components/PageHeaderBack/PageHeaderBack.js.map +0 -7
- package/dist/cjs/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js.map +0 -7
- package/dist/cjs/v2/components/PageHeaderMenu/PageHeaderMenu.js +0 -66
- package/dist/cjs/v2/components/PageHeaderMenu/PageHeaderMenu.js.map +0 -7
- package/dist/cjs/v2/components/PageHeaderSummary/PageHeaderSummary.js +0 -81
- package/dist/cjs/v2/components/PageHeaderSummary/PageHeaderSummary.js.map +0 -7
- package/dist/cjs/v2/components/PageHeaderTitle/PageHeaderTitle.js.map +0 -7
- package/dist/cjs/v2/components/PageHeaderToolbar/PageHeaderToolbar.js +0 -66
- package/dist/cjs/v2/components/PageHeaderToolbar/PageHeaderToolbar.js.map +0 -7
- package/dist/cjs/v2/components/blocks.js +0 -49
- package/dist/cjs/v2/components/blocks.js.map +0 -7
- package/dist/cjs/v2/props.js +0 -56
- package/dist/cjs/v2/props.js.map +0 -7
- package/dist/esm/v2/components/PageHeaderBack/PageHeaderBack.js +0 -39
- package/dist/esm/v2/components/PageHeaderBack/PageHeaderBack.js.map +0 -7
- package/dist/esm/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.js.map +0 -7
- package/dist/esm/v2/components/PageHeaderMenu/PageHeaderMenu.js +0 -39
- package/dist/esm/v2/components/PageHeaderMenu/PageHeaderMenu.js.map +0 -7
- package/dist/esm/v2/components/PageHeaderSummary/PageHeaderSummary.js.map +0 -7
- package/dist/esm/v2/components/PageHeaderTitle/PageHeaderTitle.js.map +0 -7
- package/dist/esm/v2/components/PageHeaderToolbar/PageHeaderToolbar.js +0 -39
- package/dist/esm/v2/components/PageHeaderToolbar/PageHeaderToolbar.js.map +0 -7
- package/dist/esm/v2/components/blocks.js +0 -20
- package/dist/esm/v2/components/blocks.js.map +0 -7
- package/dist/esm/v2/props.js +0 -27
- package/dist/esm/v2/props.js.map +0 -7
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
7
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
@@ -18,101 +20,81 @@ var __spreadValues = (a, b) => {
|
|
|
18
20
|
}
|
|
19
21
|
return a;
|
|
20
22
|
};
|
|
21
|
-
var
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
22
24
|
var __export = (target, all) => {
|
|
23
25
|
for (var name in all)
|
|
24
26
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
25
27
|
};
|
|
26
|
-
var
|
|
27
|
-
if (
|
|
28
|
-
for (let key of __getOwnPropNames(
|
|
29
|
-
if (!__hasOwnProp.call(
|
|
30
|
-
__defProp(
|
|
28
|
+
var __copyProps = (to, from, except, desc) => {
|
|
29
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
30
|
+
for (let key of __getOwnPropNames(from))
|
|
31
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
32
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
31
33
|
}
|
|
32
|
-
return
|
|
34
|
+
return to;
|
|
33
35
|
};
|
|
34
|
-
var __toESM = (
|
|
35
|
-
|
|
36
|
-
};
|
|
37
|
-
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
38
|
-
return (module2, temp) => {
|
|
39
|
-
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
40
|
-
};
|
|
41
|
-
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
36
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
37
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
42
38
|
var PageHeader_exports = {};
|
|
43
39
|
__export(PageHeader_exports, {
|
|
44
40
|
DSPageHeaderV2: () => DSPageHeaderV2,
|
|
45
41
|
DSPageHeaderWithSchema: () => DSPageHeaderWithSchema,
|
|
46
|
-
PageHeaderCustomRenderer: () => PageHeaderCustomRenderer,
|
|
42
|
+
PageHeaderCustomRenderer: () => import_styled.PageHeaderCustomRenderer,
|
|
47
43
|
PageHeaderEditableTitle: () => import_PageHeaderEditableTitle.PageHeaderEditableTitle,
|
|
48
|
-
PageHeaderMenu: () =>
|
|
44
|
+
PageHeaderMenu: () => import_styled.PageHeaderMenu,
|
|
49
45
|
PageHeaderSummary: () => import_PageHeaderSummary.PageHeaderSummary,
|
|
50
46
|
PageHeaderTitle: () => import_PageHeaderTitle.PageHeaderTitle,
|
|
51
47
|
default: () => PageHeader_default
|
|
52
48
|
});
|
|
49
|
+
module.exports = __toCommonJS(PageHeader_exports);
|
|
53
50
|
var React = __toESM(require("react"));
|
|
54
51
|
var import_react = __toESM(require("react"));
|
|
55
|
-
var
|
|
56
|
-
var import_lodash = require("lodash");
|
|
57
|
-
var import_styled_components = __toESM(require("styled-components"));
|
|
52
|
+
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
58
53
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
59
|
-
var
|
|
60
|
-
var
|
|
61
|
-
var
|
|
62
|
-
var
|
|
63
|
-
var
|
|
64
|
-
var
|
|
65
|
-
var
|
|
66
|
-
var
|
|
67
|
-
const
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
display: grid;
|
|
81
|
-
align-items: center;
|
|
82
|
-
height: 100%;
|
|
83
|
-
${(props) => !props.withBottomSeparator ? "" : `border-bottom: solid 1px ${props.theme.colors.neutral[400]};`}
|
|
84
|
-
`;
|
|
85
|
-
const DSPageHeaderV2 = ({
|
|
86
|
-
containerProps,
|
|
87
|
-
breadcrumbs,
|
|
88
|
-
pageTitle,
|
|
89
|
-
backarrow,
|
|
90
|
-
summary,
|
|
91
|
-
toolbar,
|
|
92
|
-
menu,
|
|
93
|
-
withBottomSeparator
|
|
94
|
-
}) => {
|
|
54
|
+
var import_lodash = require("lodash");
|
|
55
|
+
var import_styled = require("./styled");
|
|
56
|
+
var import_usePageHeader = require("./config/usePageHeader");
|
|
57
|
+
var import_PageHeaderTitle = require("./components/PageHeaderTitle");
|
|
58
|
+
var import_PageHeaderEditableTitle = require("./components/PageHeaderEditableTitle");
|
|
59
|
+
var import_PageHeaderSummary = require("./components/PageHeaderSummary");
|
|
60
|
+
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
61
|
+
var import_exported_related = require("./exported-related");
|
|
62
|
+
const DSPageHeaderV2 = (props) => {
|
|
63
|
+
const {
|
|
64
|
+
currentBackArrow,
|
|
65
|
+
currentMenu,
|
|
66
|
+
currentBreadcrumbs,
|
|
67
|
+
currentSummary,
|
|
68
|
+
currentToolbar,
|
|
69
|
+
currentPageTitle,
|
|
70
|
+
containerProps,
|
|
71
|
+
withBottomSeparator,
|
|
72
|
+
globalAttributes,
|
|
73
|
+
xStyledProps
|
|
74
|
+
} = (0, import_usePageHeader.usePageHeader)(props);
|
|
95
75
|
const wrapperRow = ["auto", 1];
|
|
96
76
|
const mainRow = (0, import_lodash.compact)([1, "auto"]);
|
|
97
|
-
const pageTitleRow = (0, import_lodash.compact)(["auto",
|
|
98
|
-
return /* @__PURE__ */ import_react.default.createElement(Container, __spreadValues({}, containerProps),
|
|
77
|
+
const pageTitleRow = (0, import_lodash.compact)(["auto", currentMenu && "30px", currentSummary && "auto", 1]);
|
|
78
|
+
return /* @__PURE__ */ import_react.default.createElement(import_styled.Container, __spreadProps(__spreadValues(__spreadValues(__spreadValues({}, containerProps), globalAttributes), xStyledProps), {
|
|
79
|
+
"data-testid": import_exported_related.DSPageHeaderDataTestIds.CONTAINER
|
|
80
|
+
}), /* @__PURE__ */ import_react.default.createElement(import_styled.ContainerWBorder, {
|
|
99
81
|
withBottomSeparator
|
|
100
82
|
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
101
83
|
cols: wrapperRow
|
|
102
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(
|
|
84
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_styled.PageHeaderBack, null, currentBackArrow)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
103
85
|
rows: ["auto", "auto"]
|
|
104
86
|
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
105
|
-
className:
|
|
106
|
-
},
|
|
87
|
+
className: "em-ds-page-header-v2-breadcrumb"
|
|
88
|
+
}, currentBreadcrumbs), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
107
89
|
cols: mainRow
|
|
108
90
|
}, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
|
|
109
91
|
cols: pageTitleRow
|
|
110
|
-
},
|
|
92
|
+
}, currentPageTitle, currentMenu && /* @__PURE__ */ import_react.default.createElement(import_styled.PageHeaderMenu, null, currentMenu), currentSummary, /* @__PURE__ */ import_react.default.createElement("div", null)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_styled.PageHeaderToolbarWrapper, null, currentToolbar)))))));
|
|
111
93
|
};
|
|
112
|
-
DSPageHeaderV2.propTypes =
|
|
113
|
-
DSPageHeaderV2.defaultProps =
|
|
114
|
-
|
|
115
|
-
DSPageHeaderWithSchema
|
|
94
|
+
DSPageHeaderV2.propTypes = import_react_desc_prop_types.PageHeaderPropTypes;
|
|
95
|
+
DSPageHeaderV2.defaultProps = import_react_desc_prop_types.defaultProps;
|
|
96
|
+
DSPageHeaderV2.displayName = "DSPageHeaderV2";
|
|
97
|
+
const DSPageHeaderWithSchema = (0, import_ds_utilities.describe)(DSPageHeaderV2);
|
|
98
|
+
DSPageHeaderWithSchema.propTypes = import_react_desc_prop_types.PageHeaderPropTypes;
|
|
116
99
|
var PageHeader_default = DSPageHeaderV2;
|
|
117
|
-
module.exports = __toCommonJS(PageHeader_exports);
|
|
118
100
|
//# sourceMappingURL=PageHeader.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/v2/PageHeader.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport React
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { WeakValidationMap } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { Grid } from '@elliemae/ds-grid';\nimport { compact } from 'lodash';\nimport {\n Container,\n ContainerWBorder,\n PageHeaderCustomRenderer,\n PageHeaderToolbarWrapper,\n PageHeaderMenu,\n PageHeaderBack,\n} from './styled';\nimport { usePageHeader } from './config/usePageHeader';\nimport { PageHeaderTitle } from './components/PageHeaderTitle';\nimport { PageHeaderEditableTitle } from './components/PageHeaderEditableTitle';\nimport { PageHeaderSummary } from './components/PageHeaderSummary';\nimport { PageHeaderPropTypes, DSPageHeaderT, defaultProps } from './react-desc-prop-types';\nimport { DSPageHeaderDataTestIds } from './exported-related';\n\nconst DSPageHeaderV2: React.ComponentType<DSPageHeaderT.Props> = (props) => {\n const {\n currentBackArrow,\n currentMenu,\n currentBreadcrumbs,\n currentSummary,\n currentToolbar,\n currentPageTitle,\n containerProps,\n withBottomSeparator,\n globalAttributes,\n xStyledProps,\n } = usePageHeader(props);\n\n const wrapperRow = ['auto', 1];\n const mainRow = compact([1, 'auto']);\n const pageTitleRow = compact(['auto', currentMenu && '30px', currentSummary && 'auto', 1]);\n return (\n <Container\n {...containerProps}\n {...globalAttributes}\n {...xStyledProps}\n data-testid={DSPageHeaderDataTestIds.CONTAINER}\n >\n <ContainerWBorder withBottomSeparator={withBottomSeparator}>\n <Grid cols={wrapperRow}>\n <Grid>\n <PageHeaderBack>{currentBackArrow}</PageHeaderBack>\n </Grid>\n <Grid rows={['auto', 'auto']}>\n <Grid className=\"em-ds-page-header-v2-breadcrumb\">{currentBreadcrumbs}</Grid>\n <Grid cols={mainRow}>\n <Grid cols={pageTitleRow}>\n {currentPageTitle}\n {currentMenu && <PageHeaderMenu>{currentMenu}</PageHeaderMenu>}\n {currentSummary}\n <div />\n </Grid>\n <Grid>\n <PageHeaderToolbarWrapper>{currentToolbar}</PageHeaderToolbarWrapper>\n </Grid>\n </Grid>\n </Grid>\n </Grid>\n </ContainerWBorder>\n </Container>\n );\n};\n\nDSPageHeaderV2.propTypes = PageHeaderPropTypes as WeakValidationMap<unknown>;\nDSPageHeaderV2.defaultProps = defaultProps;\nDSPageHeaderV2.displayName = 'DSPageHeaderV2';\nconst DSPageHeaderWithSchema = describe(DSPageHeaderV2);\n\nDSPageHeaderWithSchema.propTypes = PageHeaderPropTypes as WeakValidationMap<unknown>;\n\nexport {\n DSPageHeaderV2,\n PageHeaderTitle,\n PageHeaderEditableTitle,\n PageHeaderSummary,\n PageHeaderMenu,\n PageHeaderCustomRenderer,\n DSPageHeaderWithSchema,\n};\n\nexport default DSPageHeaderV2;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAyC;AACzC,0BAAyB;AACzB,qBAAqB;AACrB,oBAAwB;AACxB,oBAOO;AACP,2BAA8B;AAC9B,6BAAgC;AAChC,qCAAwC;AACxC,+BAAkC;AAClC,mCAAiE;AACjE,8BAAwC;AAExC,MAAM,iBAA2D,CAAC,UAAU;AAC1E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,wCAAc,KAAK;AAEvB,QAAM,aAAa,CAAC,QAAQ,CAAC;AAC7B,QAAM,UAAU,2BAAQ,CAAC,GAAG,MAAM,CAAC;AACnC,QAAM,eAAe,2BAAQ,CAAC,QAAQ,eAAe,QAAQ,kBAAkB,QAAQ,CAAC,CAAC;AACzF,SACE,mDAAC,wFACK,iBACA,mBACA,eAHL;AAAA,IAIC,eAAa,gDAAwB;AAAA,MAErC,mDAAC;AAAA,IAAiB;AAAA,KAChB,mDAAC;AAAA,IAAK,MAAM;AAAA,KACV,mDAAC,2BACC,mDAAC,oCAAgB,gBAAiB,CACpC,GACA,mDAAC;AAAA,IAAK,MAAM,CAAC,QAAQ,MAAM;AAAA,KACzB,mDAAC;AAAA,IAAK,WAAU;AAAA,KAAmC,kBAAmB,GACtE,mDAAC;AAAA,IAAK,MAAM;AAAA,KACV,mDAAC;AAAA,IAAK,MAAM;AAAA,KACT,kBACA,eAAe,mDAAC,oCAAgB,WAAY,GAC5C,gBACD,mDAAC,WAAI,CACP,GACA,mDAAC,2BACC,mDAAC,8CAA0B,cAAe,CAC5C,CACF,CACF,CACF,CACF,CACF;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,eAAe;AAC9B,eAAe,cAAc;AAC7B,MAAM,yBAAyB,kCAAS,cAAc;AAEtD,uBAAuB,YAAY;AAYnC,IAAO,qBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -21,7 +21,6 @@ var __spreadValues = (a, b) => {
|
|
|
21
21
|
return a;
|
|
22
22
|
};
|
|
23
23
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
25
24
|
var __objRest = (source, exclude) => {
|
|
26
25
|
var target = {};
|
|
27
26
|
for (var prop in source)
|
|
@@ -38,57 +37,58 @@ var __export = (target, all) => {
|
|
|
38
37
|
for (var name in all)
|
|
39
38
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
40
39
|
};
|
|
41
|
-
var
|
|
42
|
-
if (
|
|
43
|
-
for (let key of __getOwnPropNames(
|
|
44
|
-
if (!__hasOwnProp.call(
|
|
45
|
-
__defProp(
|
|
40
|
+
var __copyProps = (to, from, except, desc) => {
|
|
41
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
42
|
+
for (let key of __getOwnPropNames(from))
|
|
43
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
44
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
46
45
|
}
|
|
47
|
-
return
|
|
48
|
-
};
|
|
49
|
-
var __toESM = (module2, isNodeMode) => {
|
|
50
|
-
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
46
|
+
return to;
|
|
51
47
|
};
|
|
52
|
-
var
|
|
53
|
-
|
|
54
|
-
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
55
|
-
};
|
|
56
|
-
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
48
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
49
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
57
50
|
var PageHeaderEditableTitle_exports = {};
|
|
58
51
|
__export(PageHeaderEditableTitle_exports, {
|
|
59
52
|
DSPageHeaderEditableTitleWithSchema: () => DSPageHeaderEditableTitleWithSchema,
|
|
60
53
|
PageHeaderEditableTitle: () => PageHeaderEditableTitle,
|
|
61
54
|
default: () => PageHeaderEditableTitle_default
|
|
62
55
|
});
|
|
56
|
+
module.exports = __toCommonJS(PageHeaderEditableTitle_exports);
|
|
63
57
|
var React = __toESM(require("react"));
|
|
64
58
|
var import_react = __toESM(require("react"));
|
|
65
|
-
var
|
|
66
|
-
var
|
|
67
|
-
var import_react_desc = require("react-desc");
|
|
59
|
+
var import_ds_form_input_text = require("@elliemae/ds-form-input-text");
|
|
60
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
68
61
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
69
|
-
var
|
|
70
|
-
var
|
|
71
|
-
const EditableContainer =
|
|
62
|
+
var import_PageHeaderTitle = require("./PageHeaderTitle");
|
|
63
|
+
var import_exported_related = require("../exported-related");
|
|
64
|
+
const EditableContainer = (0, import_ds_system.styled)("div")`
|
|
72
65
|
height: 32px;
|
|
73
66
|
position: relative;
|
|
74
67
|
overflow: hidden;
|
|
68
|
+
&.editable-title-component {
|
|
69
|
+
position: relative;
|
|
70
|
+
left: -7px;
|
|
71
|
+
top: -1px;
|
|
72
|
+
margin-left: -2px;
|
|
73
|
+
margin-right: -9px;
|
|
74
|
+
& .${import_ds_form_input_text.DSInputTextName}-${import_ds_form_input_text.DSInputTextSlots.INPUT_WRAPPER} {
|
|
75
|
+
height: 32px;
|
|
76
|
+
}
|
|
77
|
+
& .${import_ds_form_input_text.DSInputTextName}-${import_ds_form_input_text.DSInputTextSlots.INPUT} {
|
|
78
|
+
font-size: ${({ theme }) => theme.fontSizes.title[800]};
|
|
79
|
+
line-height: normal;
|
|
80
|
+
color: ${({ theme }) => theme.colors.neutral["700"]};
|
|
81
|
+
}
|
|
82
|
+
}
|
|
75
83
|
`;
|
|
76
84
|
const PageHeaderEditableTitle = (_a) => {
|
|
77
85
|
var _b = _a, {
|
|
78
86
|
children: value,
|
|
79
87
|
editing: editingProp = false,
|
|
80
|
-
onBlur = import_lodash.noop,
|
|
81
|
-
onChange = import_lodash.noop,
|
|
82
|
-
onFocus = import_lodash.noop,
|
|
83
|
-
onMouseOut = import_lodash.noop,
|
|
84
88
|
showMarker = false
|
|
85
89
|
} = _b, rest = __objRest(_b, [
|
|
86
90
|
"children",
|
|
87
91
|
"editing",
|
|
88
|
-
"onBlur",
|
|
89
|
-
"onChange",
|
|
90
|
-
"onFocus",
|
|
91
|
-
"onMouseOut",
|
|
92
92
|
"showMarker"
|
|
93
93
|
]);
|
|
94
94
|
const [titleValue, setTitleValue] = (0, import_react.useState)(value);
|
|
@@ -96,27 +96,33 @@ const PageHeaderEditableTitle = (_a) => {
|
|
|
96
96
|
const [editing, setEditing] = (0, import_ds_utilities.useDerivedStateFromProps)(editingProp || false);
|
|
97
97
|
const titleRef = (0, import_react.useRef)(null);
|
|
98
98
|
const { width } = (0, import_ds_utilities.useMeasure)(titleRef);
|
|
99
|
+
const handleOnChange = (0, import_react.useCallback)((e) => {
|
|
100
|
+
setTitleValue(e.target.value);
|
|
101
|
+
}, []);
|
|
102
|
+
const handleOnFocus = (0, import_react.useCallback)(() => {
|
|
103
|
+
setEditing(true);
|
|
104
|
+
}, [setEditing]);
|
|
105
|
+
const handleOnBlur = (0, import_react.useCallback)(() => {
|
|
106
|
+
setEditing(false);
|
|
107
|
+
}, [setEditing]);
|
|
108
|
+
const handleOnMouseOut = (0, import_react.useCallback)(() => {
|
|
109
|
+
setHovered(false);
|
|
110
|
+
}, []);
|
|
111
|
+
const globals = (0, import_ds_utilities.useGetGlobalAttributes)(rest, {
|
|
112
|
+
onFocus: handleOnFocus,
|
|
113
|
+
onMouseOut: handleOnMouseOut,
|
|
114
|
+
onChange: handleOnChange,
|
|
115
|
+
onBlur: handleOnBlur
|
|
116
|
+
});
|
|
99
117
|
return /* @__PURE__ */ import_react.default.createElement(EditableContainer, {
|
|
100
118
|
className: hovered || editing ? "editable-title-component" : "",
|
|
101
119
|
onMouseEnter: () => setHovered(true),
|
|
102
|
-
onMouseLeave: () => setHovered(false)
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
onChange: (e) => {
|
|
109
|
-
setTitleValue(e.target.value);
|
|
110
|
-
onChange(e);
|
|
111
|
-
},
|
|
112
|
-
onFocus: (e) => {
|
|
113
|
-
setEditing(true);
|
|
114
|
-
onFocus(e);
|
|
115
|
-
},
|
|
116
|
-
onMouseOut: (e) => {
|
|
117
|
-
setHovered(false);
|
|
118
|
-
onMouseOut(e);
|
|
119
|
-
},
|
|
120
|
+
onMouseLeave: () => setHovered(false),
|
|
121
|
+
"data-testid": import_exported_related.DSPageHeaderDataTestIds.EDITABLE_HEADER_TITLE
|
|
122
|
+
}, (hovered || editing) && /* @__PURE__ */ import_react.default.createElement(import_ds_form_input_text.DSInputText, __spreadProps(__spreadValues(__spreadValues({
|
|
123
|
+
onChange: handleOnChange
|
|
124
|
+
}, rest), globals), {
|
|
125
|
+
placeholder: "",
|
|
120
126
|
style: { width: width + 10, minWidth: "260px", maxWidth: "100%" },
|
|
121
127
|
value: titleValue
|
|
122
128
|
})), /* @__PURE__ */ import_react.default.createElement("div", {
|
|
@@ -126,18 +132,14 @@ const PageHeaderEditableTitle = (_a) => {
|
|
|
126
132
|
showMarker: showMarker && !hovered && !editing
|
|
127
133
|
}, titleValue)));
|
|
128
134
|
};
|
|
129
|
-
const props = {
|
|
130
|
-
children:
|
|
131
|
-
editing:
|
|
132
|
-
showMarker:
|
|
133
|
-
|
|
134
|
-
onChange: import_react_desc.PropTypes.func.description("on change handler"),
|
|
135
|
-
onFocus: import_react_desc.PropTypes.func.description("on focus handler"),
|
|
136
|
-
onMouseOut: import_react_desc.PropTypes.func.description("mouse out of component handler")
|
|
137
|
-
};
|
|
135
|
+
const props = __spreadProps(__spreadValues({}, import_ds_utilities.globalAttributesPropTypes), {
|
|
136
|
+
children: import_ds_utilities.PropTypes.string.description("The title text"),
|
|
137
|
+
editing: import_ds_utilities.PropTypes.bool.description("Whether the title is editing or not"),
|
|
138
|
+
showMarker: import_ds_utilities.PropTypes.bool.description("Show error marker")
|
|
139
|
+
});
|
|
138
140
|
PageHeaderEditableTitle.propTypes = props;
|
|
139
|
-
|
|
141
|
+
PageHeaderEditableTitle.displayName = "PageHeaderEditableTitle";
|
|
142
|
+
const DSPageHeaderEditableTitleWithSchema = (0, import_ds_utilities.describe)(PageHeaderEditableTitle);
|
|
140
143
|
DSPageHeaderEditableTitleWithSchema.propTypes = props;
|
|
141
144
|
var PageHeaderEditableTitle_default = PageHeaderEditableTitle;
|
|
142
|
-
module.exports = __toCommonJS(PageHeaderEditableTitle_exports);
|
|
143
145
|
//# sourceMappingURL=PageHeaderEditableTitle.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/v2/components/PageHeaderEditableTitle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useState, useCallback, WeakValidationMap } from 'react';\nimport { DSInputText, DSInputTextName, DSInputTextSlots } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport {\n PropTypes,\n describe,\n useDerivedStateFromProps,\n useMeasure,\n useGetGlobalAttributes,\n globalAttributesPropTypes,\n} from '@elliemae/ds-utilities';\nimport { PageHeaderTitle } from './PageHeaderTitle';\nimport { DSPageHeaderDataTestIds } from '../exported-related';\n\nconst EditableContainer = styled('div')`\n height: 32px;\n position: relative;\n overflow: hidden;\n &.editable-title-component {\n position: relative;\n left: -7px;\n top: -1px;\n margin-left: -2px;\n margin-right: -9px;\n & .${DSInputTextName}-${DSInputTextSlots.INPUT_WRAPPER} {\n height: 32px;\n }\n & .${DSInputTextName}-${DSInputTextSlots.INPUT} {\n font-size: ${({ theme }) => theme.fontSizes.title[800]};\n line-height: normal;\n color: ${({ theme }) => theme.colors.neutral['700']};\n }\n }\n`;\n\nexport const PageHeaderEditableTitle = ({\n children: value,\n editing: editingProp = false,\n showMarker = false,\n ...rest\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 const { width } = useMeasure(titleRef);\n\n const handleOnChange: React.FormEventHandler<HTMLInputElement> = useCallback((e) => {\n setTitleValue(e.target.value);\n }, []);\n\n const handleOnFocus: React.FocusEventHandler = useCallback(() => {\n setEditing(true);\n }, [setEditing]);\n\n const handleOnBlur: React.FocusEventHandler = useCallback(() => {\n setEditing(false);\n }, [setEditing]);\n\n const handleOnMouseOut: React.MouseEventHandler = useCallback(() => {\n setHovered(false);\n }, []);\n\n const globals = useGetGlobalAttributes(rest, {\n onFocus: handleOnFocus,\n onMouseOut: handleOnMouseOut,\n onChange: handleOnChange,\n onBlur: handleOnBlur,\n });\n\n return (\n <EditableContainer\n className={hovered || editing ? 'editable-title-component' : ''}\n onMouseEnter={() => setHovered(true)}\n onMouseLeave={() => setHovered(false)}\n data-testid={DSPageHeaderDataTestIds.EDITABLE_HEADER_TITLE}\n >\n {(hovered || editing) && (\n <DSInputText\n onChange={handleOnChange}\n {...rest}\n {...globals}\n placeholder=\"\"\n style={{ width: width + 10, minWidth: '260px', maxWidth: '100%' }}\n value={titleValue}\n />\n )}\n <div ref={titleRef} style={{ width: 'fit-content' }}>\n <PageHeaderTitle showMarker={showMarker && !hovered && !editing}>{titleValue}</PageHeaderTitle>\n </div>\n </EditableContainer>\n );\n};\n\nconst props = {\n ...globalAttributesPropTypes,\n /** The title text */\n children: PropTypes.string.description('The title text'),\n /** Whether the title is editing or not */\n editing: PropTypes.bool.description('Whether the title is editing or not'),\n /** Show error marker */\n showMarker: PropTypes.bool.description('Show error marker'),\n};\n\nPageHeaderEditableTitle.propTypes = props as WeakValidationMap<unknown>;\nPageHeaderEditableTitle.displayName = 'PageHeaderEditableTitle';\nconst DSPageHeaderEditableTitleWithSchema = describe(PageHeaderEditableTitle);\n\nDSPageHeaderEditableTitleWithSchema.propTypes = props as WeakValidationMap<unknown>;\n\nexport default PageHeaderEditableTitle;\n\nexport { DSPageHeaderEditableTitleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwE;AACxE,gCAA+D;AAC/D,uBAAuB;AACvB,0BAOO;AACP,6BAAgC;AAChC,8BAAwC;AAExC,MAAM,oBAAoB,6BAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAU7B,6CAAmB,2CAAiB;AAAA;AAAA;AAAA,SAGpC,6CAAmB,2CAAiB;AAAA,mBAC1B,CAAC,EAAE,YAAY,MAAM,UAAU,MAAM;AAAA;AAAA,eAEzC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAK5C,MAAM,0BAA0B,CAAC,OAKlC;AALkC,eACtC;AAAA,cAAU;AAAA,IACV,SAAS,cAAc;AAAA,IACvB,aAAa;AAAA,MAHyB,IAInC,iBAJmC,IAInC;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,CAAC,YAAY,iBAAiB,2BAAS,KAAK;AAClD,QAAM,CAAC,SAAS,cAAc,2BAAS,KAAK;AAC5C,QAAM,CAAC,SAAS,cAAc,kDAAyB,eAAe,KAAK;AAC3E,QAAM,WAAW,yBAAO,IAAI;AAC5B,QAAM,EAAE,UAAU,oCAAW,QAAQ;AAErC,QAAM,iBAA2D,8BAAY,CAAC,MAAM;AAClF,kBAAc,EAAE,OAAO,KAAK;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAyC,8BAAY,MAAM;AAC/D,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,eAAwC,8BAAY,MAAM;AAC9D,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,mBAA4C,8BAAY,MAAM;AAClE,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,gDAAuB,MAAM;AAAA,IAC3C,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV,CAAC;AAED,SACE,mDAAC;AAAA,IACC,WAAW,WAAW,UAAU,6BAA6B;AAAA,IAC7D,cAAc,MAAM,WAAW,IAAI;AAAA,IACnC,cAAc,MAAM,WAAW,KAAK;AAAA,IACpC,eAAa,gDAAwB;AAAA,KAEnC,YAAW,YACX,mDAAC;AAAA,IACC,UAAU;AAAA,KACN,OACA,UAHL;AAAA,IAIC,aAAY;AAAA,IACZ,OAAO,EAAE,OAAO,QAAQ,IAAI,UAAU,SAAS,UAAU,OAAO;AAAA,IAChE,OAAO;AAAA,IACT,GAEF,mDAAC;AAAA,IAAI,KAAK;AAAA,IAAU,OAAO,EAAE,OAAO,cAAc;AAAA,KAChD,mDAAC;AAAA,IAAgB,YAAY,cAAc,CAAC,WAAW,CAAC;AAAA,KAAU,UAAW,CAC/E,CACF;AAEJ;AAEA,MAAM,QAAQ,iCACT,gDADS;AAAA,EAGZ,UAAU,8BAAU,OAAO,YAAY,gBAAgB;AAAA,EAEvD,SAAS,8BAAU,KAAK,YAAY,qCAAqC;AAAA,EAEzE,YAAY,8BAAU,KAAK,YAAY,mBAAmB;AAC5D;AAEA,wBAAwB,YAAY;AACpC,wBAAwB,cAAc;AACtC,MAAM,sCAAsC,kCAAS,uBAAuB;AAE5E,oCAAoC,YAAY;AAEhD,IAAO,kCAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
+
var __spreadValues = (a, b) => {
|
|
11
|
+
for (var prop in b || (b = {}))
|
|
12
|
+
if (__hasOwnProp.call(b, prop))
|
|
13
|
+
__defNormalProp(a, prop, b[prop]);
|
|
14
|
+
if (__getOwnPropSymbols)
|
|
15
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
+
if (__propIsEnum.call(b, prop))
|
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
|
18
|
+
}
|
|
19
|
+
return a;
|
|
20
|
+
};
|
|
21
|
+
var __objRest = (source, exclude) => {
|
|
22
|
+
var target = {};
|
|
23
|
+
for (var prop in source)
|
|
24
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
+
target[prop] = source[prop];
|
|
26
|
+
if (source != null && __getOwnPropSymbols)
|
|
27
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
}
|
|
31
|
+
return target;
|
|
32
|
+
};
|
|
33
|
+
var __export = (target, all) => {
|
|
34
|
+
for (var name in all)
|
|
35
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
36
|
+
};
|
|
37
|
+
var __copyProps = (to, from, except, desc) => {
|
|
38
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
39
|
+
for (let key of __getOwnPropNames(from))
|
|
40
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
41
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
42
|
+
}
|
|
43
|
+
return to;
|
|
44
|
+
};
|
|
45
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
46
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
47
|
+
var PageHeaderSummary_exports = {};
|
|
48
|
+
__export(PageHeaderSummary_exports, {
|
|
49
|
+
DSPageHeaderSummaryWithSchema: () => DSPageHeaderSummaryWithSchema,
|
|
50
|
+
PageHeaderSummary: () => PageHeaderSummary
|
|
51
|
+
});
|
|
52
|
+
module.exports = __toCommonJS(PageHeaderSummary_exports);
|
|
53
|
+
var React = __toESM(require("react"));
|
|
54
|
+
var import_react = __toESM(require("react"));
|
|
55
|
+
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
56
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
57
|
+
var import_exported_related = require("../exported-related");
|
|
58
|
+
const PageHeaderSummaryWrapper = (0, import_ds_system.styled)("div", {
|
|
59
|
+
name: import_exported_related.DSPageHeaderName,
|
|
60
|
+
slot: import_exported_related.DSPageHeaderSlots.SUMMARY
|
|
61
|
+
})`
|
|
62
|
+
display: flex;
|
|
63
|
+
flex-direction: row;
|
|
64
|
+
align-items: center;
|
|
65
|
+
|
|
66
|
+
margin-left: ${({ theme }) => theme.space.xxxs};
|
|
67
|
+
font-size: ${({ theme }) => theme.fontSizes.title[700]};
|
|
68
|
+
line-height: ${({ theme }) => theme.lineHeights.m};
|
|
69
|
+
font-weight: ${({ theme }) => theme.fontWeights.regular};
|
|
70
|
+
&:before {
|
|
71
|
+
display: block;
|
|
72
|
+
content: '';
|
|
73
|
+
height: 23px;
|
|
74
|
+
background: ${({ theme }) => theme.colors.neutral[600]};
|
|
75
|
+
width: 1px;
|
|
76
|
+
margin-right: ${({ theme }) => theme.space.xxs};
|
|
77
|
+
}
|
|
78
|
+
.ph-summary-value {
|
|
79
|
+
color: ${({ theme }) => theme.colors.neutral[700]};
|
|
80
|
+
padding-right: ${({ theme }) => theme.space.xxs};
|
|
81
|
+
}
|
|
82
|
+
.ph-summary-label {
|
|
83
|
+
color: ${({ theme }) => theme.colors.neutral[600]};
|
|
84
|
+
}
|
|
85
|
+
.ph-summary-space {
|
|
86
|
+
width: ${({ theme }) => theme.space.l};
|
|
87
|
+
}
|
|
88
|
+
`;
|
|
89
|
+
const PageHeaderSummary = (_a) => {
|
|
90
|
+
var _b = _a, { value = null, label = "" } = _b, rest = __objRest(_b, ["value", "label"]);
|
|
91
|
+
return /* @__PURE__ */ import_react.default.createElement(PageHeaderSummaryWrapper, __spreadValues({
|
|
92
|
+
"data-testid": import_exported_related.DSPageHeaderDataTestIds.SUMMARY
|
|
93
|
+
}, rest), (value === 0 || value) && /* @__PURE__ */ import_react.default.createElement("div", {
|
|
94
|
+
className: "ph-summary-value"
|
|
95
|
+
}, value), label && /* @__PURE__ */ import_react.default.createElement("div", {
|
|
96
|
+
className: "ph-summary-label"
|
|
97
|
+
}, label), (value === 0 || value || label) && /* @__PURE__ */ import_react.default.createElement("div", {
|
|
98
|
+
className: "ph-summary-space"
|
|
99
|
+
}));
|
|
100
|
+
};
|
|
101
|
+
const props = {
|
|
102
|
+
value: import_ds_utilities.PropTypes.number.description("value for page header summary"),
|
|
103
|
+
label: import_ds_utilities.PropTypes.string.description("label attached to value")
|
|
104
|
+
};
|
|
105
|
+
PageHeaderSummary.propTypes = props;
|
|
106
|
+
PageHeaderSummary.displayName = "PageHeaderSummary";
|
|
107
|
+
const DSPageHeaderSummaryWithSchema = (0, import_ds_utilities.describe)(PageHeaderSummary);
|
|
108
|
+
DSPageHeaderSummaryWithSchema.propTypes = props;
|
|
109
|
+
//# sourceMappingURL=PageHeaderSummary.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/v2/components/PageHeaderSummary.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React, { WeakValidationMap } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { styled } from '@elliemae/ds-system';\nimport { DSPageHeaderName, DSPageHeaderSlots, DSPageHeaderDataTestIds } from '../exported-related';\n\nconst PageHeaderSummaryWrapper = styled('div', {\n name: DSPageHeaderName,\n slot: DSPageHeaderSlots.SUMMARY,\n})`\n display: flex;\n flex-direction: row;\n align-items: center;\n\n margin-left: ${({ theme }) => theme.space.xxxs};\n font-size: ${({ theme }) => theme.fontSizes.title[700]};\n line-height: ${({ theme }) => theme.lineHeights.m};\n font-weight: ${({ theme }) => theme.fontWeights.regular};\n &:before {\n display: block;\n content: '';\n height: 23px;\n background: ${({ theme }) => theme.colors.neutral[600]};\n width: 1px;\n margin-right: ${({ theme }) => theme.space.xxs};\n }\n .ph-summary-value {\n color: ${({ theme }) => theme.colors.neutral[700]};\n padding-right: ${({ theme }) => theme.space.xxs};\n }\n .ph-summary-label {\n color: ${({ theme }) => theme.colors.neutral[600]};\n }\n .ph-summary-space {\n width: ${({ theme }) => theme.space.l};\n }\n`;\nconst PageHeaderSummary = ({ value = null, label = '', ...rest }) => (\n <PageHeaderSummaryWrapper data-testid={DSPageHeaderDataTestIds.SUMMARY} {...rest}>\n {(value === 0 || value) && <div className=\"ph-summary-value\">{value}</div>}\n {label && <div className=\"ph-summary-label\">{label}</div>}\n {(value === 0 || value || label) && <div className=\"ph-summary-space\" />}\n </PageHeaderSummaryWrapper>\n);\n\nconst props = {\n /** value for page header summary */\n value: PropTypes.number.description('value for page header summary'),\n /** label attached to value */\n label: PropTypes.string.description('label attached to value'),\n};\n\nPageHeaderSummary.propTypes = props as WeakValidationMap<unknown>;\nPageHeaderSummary.displayName = 'PageHeaderSummary';\nconst DSPageHeaderSummaryWithSchema = describe(PageHeaderSummary);\n\nDSPageHeaderSummaryWithSchema.propTypes = props as WeakValidationMap<unknown>;\n\nexport { PageHeaderSummary, DSPageHeaderSummaryWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,0BAAoC;AACpC,uBAAuB;AACvB,8BAA6E;AAE7E,MAAM,2BAA2B,6BAAO,OAAO;AAAA,EAC7C,MAAM;AAAA,EACN,MAAM,0CAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKgB,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA,eAC7B,CAAC,EAAE,YAAY,MAAM,UAAU,MAAM;AAAA,iBACnC,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA,iBACjC,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKhC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA,oBAElC,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA,aAGlC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA,qBAC5B,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA,aAGnC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,aAGpC,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAGxC,MAAM,oBAAoB,CAAC,OAAuC;AAAvC,eAAE,UAAQ,MAAM,QAAQ,OAAxB,IAA+B,iBAA/B,IAA+B,CAA7B,SAAc;AACzC,4DAAC;AAAA,IAAyB,eAAa,gDAAwB;AAAA,KAAa,OACxE,WAAU,KAAK,UAAU,mDAAC;AAAA,IAAI,WAAU;AAAA,KAAoB,KAAM,GACnE,SAAS,mDAAC;AAAA,IAAI,WAAU;AAAA,KAAoB,KAAM,GACjD,WAAU,KAAK,SAAS,UAAU,mDAAC;AAAA,IAAI,WAAU;AAAA,GAAmB,CACxE;AAAA;AAGF,MAAM,QAAQ;AAAA,EAEZ,OAAO,8BAAU,OAAO,YAAY,+BAA+B;AAAA,EAEnE,OAAO,8BAAU,OAAO,YAAY,yBAAyB;AAC/D;AAEA,kBAAkB,YAAY;AAC9B,kBAAkB,cAAc;AAChC,MAAM,gCAAgC,kCAAS,iBAAiB;AAEhE,8BAA8B,YAAY;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -21,7 +21,6 @@ var __spreadValues = (a, b) => {
|
|
|
21
21
|
return a;
|
|
22
22
|
};
|
|
23
23
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
25
24
|
var __objRest = (source, exclude) => {
|
|
26
25
|
var target = {};
|
|
27
26
|
for (var prop in source)
|
|
@@ -38,49 +37,62 @@ var __export = (target, all) => {
|
|
|
38
37
|
for (var name in all)
|
|
39
38
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
40
39
|
};
|
|
41
|
-
var
|
|
42
|
-
if (
|
|
43
|
-
for (let key of __getOwnPropNames(
|
|
44
|
-
if (!__hasOwnProp.call(
|
|
45
|
-
__defProp(
|
|
40
|
+
var __copyProps = (to, from, except, desc) => {
|
|
41
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
42
|
+
for (let key of __getOwnPropNames(from))
|
|
43
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
44
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
46
45
|
}
|
|
47
|
-
return
|
|
48
|
-
};
|
|
49
|
-
var __toESM = (module2, isNodeMode) => {
|
|
50
|
-
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
46
|
+
return to;
|
|
51
47
|
};
|
|
52
|
-
var
|
|
53
|
-
|
|
54
|
-
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
55
|
-
};
|
|
56
|
-
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
48
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
49
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
57
50
|
var PageHeaderTitle_exports = {};
|
|
58
51
|
__export(PageHeaderTitle_exports, {
|
|
59
52
|
DSPageHeaderTitleWithSchema: () => DSPageHeaderTitleWithSchema,
|
|
60
53
|
PageHeaderTitle: () => PageHeaderTitle
|
|
61
54
|
});
|
|
55
|
+
module.exports = __toCommonJS(PageHeaderTitle_exports);
|
|
62
56
|
var React = __toESM(require("react"));
|
|
63
57
|
var import_react = __toESM(require("react"));
|
|
64
|
-
var
|
|
65
|
-
var
|
|
66
|
-
var
|
|
67
|
-
var
|
|
58
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
59
|
+
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
60
|
+
var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
|
|
61
|
+
var import_ds_form = require("@elliemae/ds-form");
|
|
62
|
+
var import_exported_related = require("../exported-related");
|
|
63
|
+
const PageHeaderTitleWrapper = (0, import_ds_system.styled)("div", {
|
|
64
|
+
name: import_exported_related.DSPageHeaderName,
|
|
65
|
+
slot: import_exported_related.DSPageHeaderSlots.HEADER_TITLE
|
|
66
|
+
})`
|
|
67
|
+
display: grid;
|
|
68
|
+
font-size: ${({ theme }) => theme.fontSizes.title[800]};
|
|
69
|
+
color: ${({ theme }) => theme.colors.neutral["700"]};
|
|
70
|
+
line-height: normal;
|
|
71
|
+
font-weight: 400;
|
|
72
|
+
margin-right: 0.61538rem;
|
|
73
|
+
|
|
74
|
+
& .em-ds-form-required-mark {
|
|
75
|
+
position: absolute;
|
|
76
|
+
top: 0;
|
|
77
|
+
right: 0;
|
|
78
|
+
}
|
|
79
|
+
`;
|
|
68
80
|
const PageHeaderTitle = (_a) => {
|
|
69
|
-
var _b = _a, { children, showMarker = false } = _b, rest = __objRest(_b, ["children", "showMarker"]);
|
|
70
|
-
return /* @__PURE__ */ import_react.default.createElement(
|
|
71
|
-
"data-testid":
|
|
72
|
-
}), /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.TooltipTextProvider, null, /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.
|
|
81
|
+
var _b = _a, { children = "", showMarker = false } = _b, rest = __objRest(_b, ["children", "showMarker"]);
|
|
82
|
+
return /* @__PURE__ */ import_react.default.createElement(PageHeaderTitleWrapper, __spreadProps(__spreadValues({}, rest), {
|
|
83
|
+
"data-testid": import_exported_related.DSPageHeaderDataTestIds.HEADER_TITLE
|
|
84
|
+
}), /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.TooltipTextProvider, null, /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.DSTruncatedTooltipText, {
|
|
73
85
|
value: children
|
|
74
|
-
})), showMarker && /* @__PURE__ */ import_react.default.createElement(
|
|
86
|
+
})), showMarker && /* @__PURE__ */ import_react.default.createElement(import_ds_form.RequiredMark, {
|
|
75
87
|
required: true
|
|
76
88
|
}));
|
|
77
89
|
};
|
|
78
90
|
const props = {
|
|
79
|
-
children:
|
|
80
|
-
showMarker:
|
|
91
|
+
children: import_ds_utilities.PropTypes.string.description("Page header title string"),
|
|
92
|
+
showMarker: import_ds_utilities.PropTypes.bool.description("show required mark")
|
|
81
93
|
};
|
|
82
94
|
PageHeaderTitle.propTypes = props;
|
|
83
|
-
|
|
95
|
+
PageHeaderTitle.displayName = "PageHeaderTitle";
|
|
96
|
+
const DSPageHeaderTitleWithSchema = (0, import_ds_utilities.describe)(PageHeaderTitle);
|
|
84
97
|
DSPageHeaderTitleWithSchema.propTypes = props;
|
|
85
|
-
module.exports = __toCommonJS(PageHeaderTitle_exports);
|
|
86
98
|
//# sourceMappingURL=PageHeaderTitle.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/v2/components/PageHeaderTitle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React, { WeakValidationMap } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSTruncatedTooltipText, TooltipTextProvider } from '@elliemae/ds-truncated-tooltip-text';\nimport { RequiredMark } from '@elliemae/ds-form';\nimport { DSPageHeaderName, DSPageHeaderSlots, DSPageHeaderDataTestIds } from '../exported-related';\nconst PageHeaderTitleWrapper = styled('div', {\n name: DSPageHeaderName,\n slot: DSPageHeaderSlots.HEADER_TITLE,\n})`\n display: grid;\n font-size: ${({ theme }) => theme.fontSizes.title[800]};\n color: ${({ theme }) => theme.colors.neutral['700']};\n line-height: normal;\n font-weight: 400;\n margin-right: 0.61538rem;\n\n & .em-ds-form-required-mark {\n position: absolute;\n top: 0;\n right: 0;\n }\n`;\nconst PageHeaderTitle = ({ children = '', showMarker = false, ...rest }) => (\n <PageHeaderTitleWrapper {...rest} data-testid={DSPageHeaderDataTestIds.HEADER_TITLE}>\n <TooltipTextProvider>\n <DSTruncatedTooltipText value={children} />\n </TooltipTextProvider>\n {showMarker && <RequiredMark required />}\n </PageHeaderTitleWrapper>\n);\n\nconst props = {\n /** page header title string */\n children: PropTypes.string.description('Page header title string'),\n /** show required mark */\n showMarker: PropTypes.bool.description('show required mark'),\n};\n\nPageHeaderTitle.propTypes = props as WeakValidationMap<unknown>;\nPageHeaderTitle.displayName = 'PageHeaderTitle';\nconst DSPageHeaderTitleWithSchema = describe(PageHeaderTitle);\n\nDSPageHeaderTitleWithSchema.propTypes = props as WeakValidationMap<unknown>;\n\nexport { PageHeaderTitle, DSPageHeaderTitleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,uBAAuB;AACvB,0BAAoC;AACpC,uCAA4D;AAC5D,qBAA6B;AAC7B,8BAA6E;AAC7E,MAAM,yBAAyB,6BAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,0CAAkB;AAC1B,CAAC;AAAA;AAAA,eAEc,CAAC,EAAE,YAAY,MAAM,UAAU,MAAM;AAAA,WACzC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAW/C,MAAM,kBAAkB,CAAC,OAAgD;AAAhD,eAAE,aAAW,IAAI,aAAa,UAA9B,IAAwC,iBAAxC,IAAwC,CAAtC,YAAe;AACxC,4DAAC,yDAA2B,OAA3B;AAAA,IAAiC,eAAa,gDAAwB;AAAA,MACrE,mDAAC,4DACC,mDAAC;AAAA,IAAuB,OAAO;AAAA,GAAU,CAC3C,GACC,cAAc,mDAAC;AAAA,IAAa,UAAQ;AAAA,GAAC,CACxC;AAAA;AAGF,MAAM,QAAQ;AAAA,EAEZ,UAAU,8BAAU,OAAO,YAAY,0BAA0B;AAAA,EAEjE,YAAY,8BAAU,KAAK,YAAY,oBAAoB;AAC7D;AAEA,gBAAgB,YAAY;AAC5B,gBAAgB,cAAc;AAC9B,MAAM,8BAA8B,kCAAS,eAAe;AAE5D,4BAA4B,YAAY;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|