@elliemae/ds-page-header-v2 3.22.0-next.30

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.
Files changed (69) hide show
  1. package/dist/cjs/PageHeader.js +105 -0
  2. package/dist/cjs/PageHeader.js.map +7 -0
  3. package/dist/cjs/components/PageHeaderEditableTitle.js +128 -0
  4. package/dist/cjs/components/PageHeaderEditableTitle.js.map +7 -0
  5. package/dist/cjs/components/PageHeaderSummary.js +89 -0
  6. package/dist/cjs/components/PageHeaderSummary.js.map +7 -0
  7. package/dist/cjs/components/PageHeaderTitle.js +73 -0
  8. package/dist/cjs/components/PageHeaderTitle.js.map +7 -0
  9. package/dist/cjs/config/usePageHeader.js +142 -0
  10. package/dist/cjs/config/usePageHeader.js.map +7 -0
  11. package/dist/cjs/exported-related/data-test-ids.js +41 -0
  12. package/dist/cjs/exported-related/data-test-ids.js.map +7 -0
  13. package/dist/cjs/exported-related/index.js +32 -0
  14. package/dist/cjs/exported-related/index.js.map +7 -0
  15. package/dist/cjs/exported-related/skeletons.js +52 -0
  16. package/dist/cjs/exported-related/skeletons.js.map +7 -0
  17. package/dist/cjs/exported-related/theming.js +45 -0
  18. package/dist/cjs/exported-related/theming.js.map +7 -0
  19. package/dist/cjs/index.js +50 -0
  20. package/dist/cjs/index.js.map +7 -0
  21. package/dist/cjs/package.json +7 -0
  22. package/dist/cjs/react-desc-prop-types.js +68 -0
  23. package/dist/cjs/react-desc-prop-types.js.map +7 -0
  24. package/dist/cjs/styled.js +117 -0
  25. package/dist/cjs/styled.js.map +7 -0
  26. package/dist/cjs/tests/utils.js +124 -0
  27. package/dist/cjs/tests/utils.js.map +7 -0
  28. package/dist/esm/PageHeader.js +82 -0
  29. package/dist/esm/PageHeader.js.map +7 -0
  30. package/dist/esm/components/PageHeaderEditableTitle.js +98 -0
  31. package/dist/esm/components/PageHeaderEditableTitle.js.map +7 -0
  32. package/dist/esm/components/PageHeaderSummary.js +59 -0
  33. package/dist/esm/components/PageHeaderSummary.js.map +7 -0
  34. package/dist/esm/components/PageHeaderTitle.js +43 -0
  35. package/dist/esm/components/PageHeaderTitle.js.map +7 -0
  36. package/dist/esm/config/usePageHeader.js +125 -0
  37. package/dist/esm/config/usePageHeader.js.map +7 -0
  38. package/dist/esm/exported-related/data-test-ids.js +11 -0
  39. package/dist/esm/exported-related/data-test-ids.js.map +7 -0
  40. package/dist/esm/exported-related/index.js +5 -0
  41. package/dist/esm/exported-related/index.js.map +7 -0
  42. package/dist/esm/exported-related/skeletons.js +22 -0
  43. package/dist/esm/exported-related/skeletons.js.map +7 -0
  44. package/dist/esm/exported-related/theming.js +15 -0
  45. package/dist/esm/exported-related/theming.js.map +7 -0
  46. package/dist/esm/index.js +27 -0
  47. package/dist/esm/index.js.map +7 -0
  48. package/dist/esm/package.json +7 -0
  49. package/dist/esm/react-desc-prop-types.js +38 -0
  50. package/dist/esm/react-desc-prop-types.js.map +7 -0
  51. package/dist/esm/styled.js +87 -0
  52. package/dist/esm/styled.js.map +7 -0
  53. package/dist/esm/tests/utils.js +94 -0
  54. package/dist/esm/tests/utils.js.map +7 -0
  55. package/dist/types/PageHeader.d.ts +10 -0
  56. package/dist/types/components/PageHeaderEditableTitle.d.ts +15 -0
  57. package/dist/types/components/PageHeaderSummary.d.ts +14 -0
  58. package/dist/types/components/PageHeaderTitle.d.ts +16 -0
  59. package/dist/types/config/usePageHeader.d.ts +18 -0
  60. package/dist/types/exported-related/data-test-ids.d.ts +6 -0
  61. package/dist/types/exported-related/index.d.ts +3 -0
  62. package/dist/types/exported-related/skeletons.d.ts +6 -0
  63. package/dist/types/exported-related/theming.d.ts +9 -0
  64. package/dist/types/index.d.ts +5 -0
  65. package/dist/types/react-desc-prop-types.d.ts +419 -0
  66. package/dist/types/styled.d.ts +10 -0
  67. package/dist/types/tests/PageHeader.test.d.ts +1 -0
  68. package/dist/types/tests/utils.d.ts +56 -0
  69. package/package.json +116 -0
@@ -0,0 +1,105 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var PageHeader_exports = {};
30
+ __export(PageHeader_exports, {
31
+ DSPageHeaderV2: () => DSPageHeaderV2,
32
+ DSPageHeaderWithSchema: () => DSPageHeaderWithSchema,
33
+ PageHeaderCustomRenderer: () => import_styled.PageHeaderCustomRenderer,
34
+ PageHeaderEditableTitle: () => import_PageHeaderEditableTitle.PageHeaderEditableTitle,
35
+ PageHeaderMenu: () => import_styled.PageHeaderMenu,
36
+ PageHeaderSummary: () => import_PageHeaderSummary.PageHeaderSummary,
37
+ PageHeaderTitle: () => import_PageHeaderTitle.PageHeaderTitle,
38
+ default: () => PageHeader_default
39
+ });
40
+ module.exports = __toCommonJS(PageHeader_exports);
41
+ var React = __toESM(require("react"));
42
+ var import_jsx_runtime = require("react/jsx-runtime");
43
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
44
+ var import_ds_grid = require("@elliemae/ds-grid");
45
+ var import_styled = require("./styled.js");
46
+ var import_usePageHeader = require("./config/usePageHeader.js");
47
+ var import_PageHeaderTitle = require("./components/PageHeaderTitle.js");
48
+ var import_PageHeaderEditableTitle = require("./components/PageHeaderEditableTitle.js");
49
+ var import_PageHeaderSummary = require("./components/PageHeaderSummary.js");
50
+ var import_react_desc_prop_types = require("./react-desc-prop-types.js");
51
+ var import_exported_related = require("./exported-related/index.js");
52
+ const DSPageHeaderV2 = (props) => {
53
+ const {
54
+ currentBackArrow,
55
+ currentMenu,
56
+ currentBreadcrumbs,
57
+ currentSummary,
58
+ currentToolbar,
59
+ currentPageTitle,
60
+ containerProps,
61
+ withBottomSeparator,
62
+ globalAttributes,
63
+ xStyledProps
64
+ } = (0, import_usePageHeader.usePageHeader)(props);
65
+ const { isSkeleton } = props;
66
+ const wrapperRow = ["auto", "1fr"];
67
+ const mainRow = ["1fr", "auto"];
68
+ const pageTitleRow = [
69
+ isSkeleton ? "2fr" : "auto",
70
+ currentMenu !== void 0 && "30px",
71
+ currentSummary !== void 0 && "auto",
72
+ "1fr"
73
+ ].filter((col) => typeof col === "string");
74
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
75
+ import_styled.Container,
76
+ {
77
+ ...containerProps,
78
+ ...globalAttributes,
79
+ ...xStyledProps,
80
+ "data-testid": import_exported_related.DSPageHeaderDataTestIds.CONTAINER,
81
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.ContainerWBorder, { withBottomSeparator, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: wrapperRow, children: [
82
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.PageHeaderBack, { children: currentBackArrow }) }),
83
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { rows: ["auto", "auto"], children: [
84
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { className: "em-ds-page-header-v2-breadcrumb", children: currentBreadcrumbs }),
85
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: mainRow, alignItems: "center", children: [
86
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: pageTitleRow, alignItems: "center", children: [
87
+ currentPageTitle,
88
+ currentMenu && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.PageHeaderMenu, { children: currentMenu }),
89
+ currentSummary,
90
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {})
91
+ ] }),
92
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.PageHeaderToolbarWrapper, { children: currentToolbar }) })
93
+ ] })
94
+ ] })
95
+ ] }) })
96
+ }
97
+ );
98
+ };
99
+ DSPageHeaderV2.propTypes = import_react_desc_prop_types.PageHeaderPropTypes;
100
+ DSPageHeaderV2.defaultProps = import_react_desc_prop_types.defaultProps;
101
+ DSPageHeaderV2.displayName = import_exported_related.DSPageHeaderName;
102
+ const DSPageHeaderWithSchema = (0, import_ds_props_helpers.describe)(DSPageHeaderV2);
103
+ DSPageHeaderWithSchema.propTypes = import_react_desc_prop_types.PageHeaderPropTypes;
104
+ var PageHeader_default = DSPageHeaderV2;
105
+ //# sourceMappingURL=PageHeader.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/PageHeader.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { Grid } from '@elliemae/ds-grid';\nimport {\n Container,\n ContainerWBorder,\n PageHeaderCustomRenderer,\n PageHeaderToolbarWrapper,\n PageHeaderMenu,\n PageHeaderBack,\n} from './styled.js';\nimport { usePageHeader } from './config/usePageHeader.js';\nimport { PageHeaderTitle } from './components/PageHeaderTitle.js';\nimport { PageHeaderEditableTitle } from './components/PageHeaderEditableTitle.js';\nimport { PageHeaderSummary } from './components/PageHeaderSummary.js';\nimport type { DSPageHeaderT } from './react-desc-prop-types.js';\nimport { PageHeaderPropTypes, defaultProps } from './react-desc-prop-types.js';\nimport { DSPageHeaderDataTestIds, DSPageHeaderName } from './exported-related/index.js';\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 { isSkeleton } = props;\n const wrapperRow = ['auto', '1fr'];\n const mainRow = ['1fr', 'auto'];\n const pageTitleRow = [\n isSkeleton ? '2fr' : 'auto',\n currentMenu !== undefined && '30px',\n currentSummary !== undefined && 'auto',\n '1fr',\n ].filter((col) => typeof col === 'string') as string[];\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} alignItems=\"center\">\n <Grid cols={pageTitleRow} alignItems=\"center\">\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 = DSPageHeaderName;\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;ADuDX;AAnDZ,8BAAyB;AACzB,qBAAqB;AACrB,oBAOO;AACP,2BAA8B;AAC9B,6BAAgC;AAChC,qCAAwC;AACxC,+BAAkC;AAElC,mCAAkD;AAClD,8BAA0D;AAE1D,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,EACF,QAAI,oCAAc,KAAK;AAEvB,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,aAAa,CAAC,QAAQ,KAAK;AACjC,QAAM,UAAU,CAAC,OAAO,MAAM;AAC9B,QAAM,eAAe;AAAA,IACnB,aAAa,QAAQ;AAAA,IACrB,gBAAgB,UAAa;AAAA,IAC7B,mBAAmB,UAAa;AAAA,IAChC;AAAA,EACF,EAAE,OAAO,CAAC,QAAQ,OAAO,QAAQ,QAAQ;AACzC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,eAAa,gDAAwB;AAAA,MAErC,sDAAC,kCAAiB,qBAChB,uDAAC,uBAAK,MAAM,YACV;AAAA,oDAAC,uBACC,sDAAC,gCAAgB,4BAAiB,GACpC;AAAA,QACA,6CAAC,uBAAK,MAAM,CAAC,QAAQ,MAAM,GACzB;AAAA,sDAAC,uBAAK,WAAU,mCAAmC,8BAAmB;AAAA,UACtE,6CAAC,uBAAK,MAAM,SAAS,YAAW,UAC9B;AAAA,yDAAC,uBAAK,MAAM,cAAc,YAAW,UAClC;AAAA;AAAA,cACA,eAAe,4CAAC,gCAAgB,uBAAY;AAAA,cAC5C;AAAA,cACD,4CAAC,SAAI;AAAA,eACP;AAAA,YACA,4CAAC,uBACC,sDAAC,0CAA0B,0BAAe,GAC5C;AAAA,aACF;AAAA,WACF;AAAA,SACF,GACF;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,eAAe;AAC9B,eAAe,cAAc;AAC7B,MAAM,6BAAyB,kCAAS,cAAc;AAEtD,uBAAuB,YAAY;AAYnC,IAAO,qBAAQ;",
6
+ "names": []
7
+ }
@@ -0,0 +1,128 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var PageHeaderEditableTitle_exports = {};
30
+ __export(PageHeaderEditableTitle_exports, {
31
+ DSPageHeaderEditableTitleWithSchema: () => DSPageHeaderEditableTitleWithSchema,
32
+ PageHeaderEditableTitle: () => PageHeaderEditableTitle,
33
+ default: () => PageHeaderEditableTitle_default
34
+ });
35
+ module.exports = __toCommonJS(PageHeaderEditableTitle_exports);
36
+ var React = __toESM(require("react"));
37
+ var import_jsx_runtime = require("react/jsx-runtime");
38
+ var import_react = require("react");
39
+ var import_ds_form_input_text = require("@elliemae/ds-form-input-text");
40
+ var import_ds_system = require("@elliemae/ds-system");
41
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
42
+ var import_ds_utilities = require("@elliemae/ds-utilities");
43
+ var import_PageHeaderTitle = require("./PageHeaderTitle.js");
44
+ var import_exported_related = require("../exported-related/index.js");
45
+ const EditableContainer = (0, import_ds_system.styled)("div")`
46
+ height: 32px;
47
+ position: relative;
48
+ overflow: hidden;
49
+ &.editable-title-component {
50
+ position: relative;
51
+ left: -7px;
52
+ top: -1px;
53
+ margin-left: -2px;
54
+ margin-right: -9px;
55
+ & .${import_ds_form_input_text.DSInputTextName}-${import_ds_form_input_text.DSInputTextSlots.INPUT_WRAPPER} {
56
+ height: 32px;
57
+ }
58
+ & .${import_ds_form_input_text.DSInputTextName}-${import_ds_form_input_text.DSInputTextSlots.INPUT} {
59
+ font-size: ${({ theme }) => theme.fontSizes.title[800]};
60
+ line-height: normal;
61
+ color: ${({ theme }) => theme.colors.neutral["700"]};
62
+ }
63
+ }
64
+ `;
65
+ const PageHeaderEditableTitle = (props2) => {
66
+ const { children: value, editing: editingProp, showMarker, ...rest } = props2;
67
+ const [titleValue, setTitleValue] = (0, import_react.useState)(value);
68
+ const [hovered, setHovered] = (0, import_react.useState)(false);
69
+ const [editing, setEditing] = (0, import_ds_utilities.useDerivedStateFromProps)(editingProp || false);
70
+ const titleRef = (0, import_react.useRef)(null);
71
+ const { width } = (0, import_ds_utilities.useMeasure)(titleRef);
72
+ const handleOnChange = (0, import_react.useCallback)((e) => {
73
+ setTitleValue(e.target.value);
74
+ }, []);
75
+ const handleOnFocus = (0, import_react.useCallback)(() => {
76
+ setEditing(true);
77
+ }, [setEditing]);
78
+ const handleOnBlur = (0, import_react.useCallback)(() => {
79
+ setEditing(false);
80
+ }, [setEditing]);
81
+ const handleOnMouseOut = (0, import_react.useCallback)(() => {
82
+ setHovered(false);
83
+ }, []);
84
+ const globals = (0, import_ds_props_helpers.useGetGlobalAttributes)(rest, {
85
+ onFocus: handleOnFocus,
86
+ onMouseOut: handleOnMouseOut,
87
+ onChange: handleOnChange,
88
+ onBlur: handleOnBlur
89
+ });
90
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
91
+ EditableContainer,
92
+ {
93
+ className: hovered || editing ? "editable-title-component" : "",
94
+ onMouseEnter: () => setHovered(true),
95
+ onMouseLeave: () => setHovered(false),
96
+ "data-testid": import_exported_related.DSPageHeaderDataTestIds.EDITABLE_HEADER_TITLE,
97
+ children: [
98
+ (hovered || editing) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
99
+ import_ds_form_input_text.DSInputText,
100
+ {
101
+ onChange: handleOnChange,
102
+ ...rest,
103
+ ...globals,
104
+ placeholder: "",
105
+ style: { width: width + 10, minWidth: "260px", maxWidth: "100%" },
106
+ value: titleValue
107
+ }
108
+ ),
109
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: titleRef, style: { width: "fit-content" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_PageHeaderTitle.PageHeaderTitle, { showMarker: showMarker && !hovered && !editing, children: titleValue }) })
110
+ ]
111
+ }
112
+ );
113
+ };
114
+ const props = {
115
+ ...import_ds_props_helpers.globalAttributesPropTypes,
116
+ /** The title text */
117
+ children: import_ds_props_helpers.PropTypes.string.description("The title text"),
118
+ /** Whether the title is editing or not */
119
+ editing: import_ds_props_helpers.PropTypes.bool.description("Whether the title is editing or not"),
120
+ /** Show error marker */
121
+ showMarker: import_ds_props_helpers.PropTypes.bool.description("Show error marker")
122
+ };
123
+ PageHeaderEditableTitle.propTypes = props;
124
+ PageHeaderEditableTitle.displayName = "PageHeaderEditableTitle";
125
+ const DSPageHeaderEditableTitleWithSchema = (0, import_ds_props_helpers.describe)(PageHeaderEditableTitle);
126
+ DSPageHeaderEditableTitleWithSchema.propTypes = props;
127
+ var PageHeaderEditableTitle_default = PageHeaderEditableTitle;
128
+ //# sourceMappingURL=PageHeaderEditableTitle.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/components/PageHeaderEditableTitle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport React, { useRef, useState, useCallback } from 'react';\nimport { DSInputText, DSInputTextName, DSInputTextSlots } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { PropTypes, describe, useGetGlobalAttributes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\nimport { useDerivedStateFromProps, useMeasure } from '@elliemae/ds-utilities';\nimport { PageHeaderTitle } from './PageHeaderTitle.js';\nimport { DSPageHeaderDataTestIds } from '../exported-related/index.js';\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n// const useMeasureSafe: typeof useMeasure = useMeasure.default ?? useMeasure;\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 interface PageHeaderEditableTitleProps {\n children?: string;\n editing?: boolean;\n showMarker?: boolean;\n [key: string]: unknown;\n}\n\nexport const PageHeaderEditableTitle = (props: PageHeaderEditableTitleProps) => {\n const { children: value, editing: editingProp, showMarker, ...rest } = props;\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.ChangeEventHandler<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;ADwEnB;AAvEJ,mBAAqD;AACrD,gCAA+D;AAC/D,uBAAuB;AACvB,8BAAuF;AACvF,0BAAqD;AACrD,6BAAgC;AAChC,8BAAwC;AAKxC,MAAM,wBAAoB,yBAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAU7B,6CAAmB,2CAAiB;AAAA;AAAA;AAAA,SAGpC,6CAAmB,2CAAiB;AAAA,mBAC1B,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM,GAAG;AAAA;AAAA,eAE5C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAYjD,MAAM,0BAA0B,CAACA,WAAwC;AAC9E,QAAM,EAAE,UAAU,OAAO,SAAS,aAAa,YAAY,GAAG,KAAK,IAAIA;AACvE,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAClD,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,KAAK;AAC5C,QAAM,CAAC,SAAS,UAAU,QAAI,8CAAyB,eAAe,KAAK;AAC3E,QAAM,eAAW,qBAAO,IAAI;AAC5B,QAAM,EAAE,MAAM,QAAI,gCAAW,QAAQ;AAErC,QAAM,qBAA6D,0BAAY,CAAC,MAAM;AACpF,kBAAc,EAAE,OAAO,KAAK;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAyC,0BAAY,MAAM;AAC/D,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,mBAAwC,0BAAY,MAAM;AAC9D,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,uBAA4C,0BAAY,MAAM;AAClE,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,cAAU,gDAAuB,MAAM;AAAA,IAC3C,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,WAAW,UAAU,6BAA6B;AAAA,MAC7D,cAAc,MAAM,WAAW,IAAI;AAAA,MACnC,cAAc,MAAM,WAAW,KAAK;AAAA,MACpC,eAAa,gDAAwB;AAAA,MAEnC;AAAA,oBAAW,YACX;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACT,GAAG;AAAA,YACH,GAAG;AAAA,YACJ,aAAY;AAAA,YACZ,OAAO,EAAE,OAAO,QAAQ,IAAI,UAAU,SAAS,UAAU,OAAO;AAAA,YAChE,OAAO;AAAA;AAAA,QACT;AAAA,QAEF,4CAAC,SAAI,KAAK,UAAU,OAAO,EAAE,OAAO,cAAc,GAChD,sDAAC,0CAAgB,YAAY,cAAc,CAAC,WAAW,CAAC,SAAU,sBAAW,GAC/E;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,QAAQ;AAAA,EACZ,GAAG;AAAA;AAAA,EAEH,UAAU,kCAAU,OAAO,YAAY,gBAAgB;AAAA;AAAA,EAEvD,SAAS,kCAAU,KAAK,YAAY,qCAAqC;AAAA;AAAA,EAEzE,YAAY,kCAAU,KAAK,YAAY,mBAAmB;AAC5D;AAEA,wBAAwB,YAAY;AACpC,wBAAwB,cAAc;AACtC,MAAM,0CAAsC,kCAAS,uBAAuB;AAE5E,oCAAoC,YAAY;AAEhD,IAAO,kCAAQ;",
6
+ "names": ["props"]
7
+ }
@@ -0,0 +1,89 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var PageHeaderSummary_exports = {};
30
+ __export(PageHeaderSummary_exports, {
31
+ DSPageHeaderSummaryWithSchema: () => DSPageHeaderSummaryWithSchema,
32
+ PageHeaderSummary: () => PageHeaderSummary
33
+ });
34
+ module.exports = __toCommonJS(PageHeaderSummary_exports);
35
+ var React = __toESM(require("react"));
36
+ var import_jsx_runtime = require("react/jsx-runtime");
37
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
38
+ var import_ds_system = require("@elliemae/ds-system");
39
+ var import_exported_related = require("../exported-related/index.js");
40
+ const PageHeaderSummaryWrapper = (0, import_ds_system.styled)("div", {
41
+ name: import_exported_related.DSPageHeaderName,
42
+ slot: import_exported_related.DSPageHeaderSlots.SUMMARY
43
+ })`
44
+ display: flex;
45
+ flex-direction: row;
46
+ align-items: center;
47
+
48
+ margin-left: ${({ theme }) => theme.space.xxxs};
49
+ font-size: ${({ theme }) => theme.fontSizes.title[700]};
50
+ line-height: ${({ theme }) => theme.lineHeights.m};
51
+ font-weight: ${({ theme }) => theme.fontWeights.regular};
52
+ &:before {
53
+ display: block;
54
+ content: '';
55
+ height: 23px;
56
+ background: ${({ theme }) => theme.colors.neutral[600]};
57
+ width: 1px;
58
+ margin-right: ${({ theme }) => theme.space.xxs};
59
+ }
60
+ .ph-summary-value {
61
+ color: ${({ theme }) => theme.colors.neutral[700]};
62
+ padding-right: ${({ theme }) => theme.space.xxs};
63
+ }
64
+ .ph-summary-label {
65
+ color: ${({ theme }) => theme.colors.neutral[600]};
66
+ }
67
+ .ph-summary-space {
68
+ width: ${({ theme }) => theme.space.l};
69
+ }
70
+ `;
71
+ const PageHeaderSummary = (props2) => {
72
+ const { value = null, label = "", ...rest } = props2;
73
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(PageHeaderSummaryWrapper, { "data-testid": import_exported_related.DSPageHeaderDataTestIds.SUMMARY, ...rest, children: [
74
+ (value === 0 || value) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "ph-summary-value", children: value }),
75
+ label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "ph-summary-label", children: label }),
76
+ (value === 0 || value || label) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "ph-summary-space" })
77
+ ] });
78
+ };
79
+ const props = {
80
+ /** value for page header summary */
81
+ value: import_ds_props_helpers.PropTypes.number.description("value for page header summary"),
82
+ /** label attached to value */
83
+ label: import_ds_props_helpers.PropTypes.string.description("label attached to value")
84
+ };
85
+ PageHeaderSummary.propTypes = props;
86
+ PageHeaderSummary.displayName = "PageHeaderSummary";
87
+ const DSPageHeaderSummaryWithSchema = (0, import_ds_props_helpers.describe)(PageHeaderSummary);
88
+ DSPageHeaderSummaryWithSchema.propTypes = props;
89
+ //# sourceMappingURL=PageHeaderSummary.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/components/PageHeaderSummary.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { styled } from '@elliemae/ds-system';\nimport { DSPageHeaderName, DSPageHeaderSlots, DSPageHeaderDataTestIds } from '../exported-related/index.js';\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`;\ninterface PageHeaderSummaryProps {\n /** value for page header summary */\n value?: number;\n /** label attached to value */\n label?: string;\n}\n\nconst PageHeaderSummary = (props: PageHeaderSummaryProps) => {\n const { value = null, label = '', ...rest } = props;\n return (\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};\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;AD+CnB;AA7CJ,8BAAoC;AACpC,uBAAuB;AACvB,8BAA6E;AAE7E,MAAM,+BAA2B,yBAAO,OAAO;AAAA,EAC7C,MAAM;AAAA,EACN,MAAM,0CAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKgB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA,eAC7B,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM,GAAG;AAAA,iBACtC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA,iBACjC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKhC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,oBAErC,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA,aAGlC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,qBAC/B,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA,aAGnC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA,aAGvC,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAUxC,MAAM,oBAAoB,CAACA,WAAkC;AAC3D,QAAM,EAAE,QAAQ,MAAM,QAAQ,IAAI,GAAG,KAAK,IAAIA;AAC9C,SACE,6CAAC,4BAAyB,eAAa,gDAAwB,SAAU,GAAG,MACxE;AAAA,eAAU,KAAK,UAAU,4CAAC,SAAI,WAAU,oBAAoB,iBAAM;AAAA,IACnE,SAAS,4CAAC,SAAI,WAAU,oBAAoB,iBAAM;AAAA,KACjD,UAAU,KAAK,SAAS,UAAU,4CAAC,SAAI,WAAU,oBAAmB;AAAA,KACxE;AAEJ;AAEA,MAAM,QAAQ;AAAA;AAAA,EAEZ,OAAO,kCAAU,OAAO,YAAY,+BAA+B;AAAA;AAAA,EAEnE,OAAO,kCAAU,OAAO,YAAY,yBAAyB;AAC/D;AAEA,kBAAkB,YAAY;AAC9B,kBAAkB,cAAc;AAChC,MAAM,oCAAgC,kCAAS,iBAAiB;AAEhE,8BAA8B,YAAY;",
6
+ "names": ["props"]
7
+ }
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var PageHeaderTitle_exports = {};
30
+ __export(PageHeaderTitle_exports, {
31
+ DSPageHeaderTitleWithSchema: () => DSPageHeaderTitleWithSchema,
32
+ PageHeaderTitle: () => PageHeaderTitle
33
+ });
34
+ module.exports = __toCommonJS(PageHeaderTitle_exports);
35
+ var React = __toESM(require("react"));
36
+ var import_jsx_runtime = require("react/jsx-runtime");
37
+ var import_ds_system = require("@elliemae/ds-system");
38
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
39
+ var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
40
+ var import_ds_form = require("@elliemae/ds-form");
41
+ var import_exported_related = require("../exported-related/index.js");
42
+ const PageHeaderTitleWrapper = (0, import_ds_system.styled)("div", {
43
+ name: import_exported_related.DSPageHeaderName,
44
+ slot: import_exported_related.DSPageHeaderSlots.HEADER_TITLE
45
+ })`
46
+ display: grid;
47
+ font-size: ${({ theme }) => theme.fontSizes.title[800]};
48
+ color: ${({ theme }) => theme.colors.neutral["700"]};
49
+ line-height: normal;
50
+ font-weight: 400;
51
+ margin-right: 0.61538rem;
52
+
53
+ & .em-ds-form-required-mark {
54
+ position: absolute;
55
+ top: 0;
56
+ right: 0;
57
+ }
58
+ `;
59
+ const PageHeaderTitle = ({ children = "", showMarker = false, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(PageHeaderTitleWrapper, { ...rest, "data-testid": import_exported_related.DSPageHeaderDataTestIds.HEADER_TITLE, children: [
60
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.TooltipTextProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.DSTruncatedTooltipText, { value: children }) }),
61
+ showMarker && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.RequiredMark, { required: true })
62
+ ] });
63
+ const props = {
64
+ /** page header title string */
65
+ children: import_ds_props_helpers.PropTypes.string.description("Page header title string"),
66
+ /** show required mark */
67
+ showMarker: import_ds_props_helpers.PropTypes.bool.description("show required mark")
68
+ };
69
+ PageHeaderTitle.propTypes = props;
70
+ PageHeaderTitle.displayName = "PageHeaderTitle";
71
+ const DSPageHeaderTitleWithSchema = (0, import_ds_props_helpers.describe)(PageHeaderTitle);
72
+ DSPageHeaderTitleWithSchema.propTypes = props;
73
+ //# sourceMappingURL=PageHeaderTitle.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/components/PageHeaderTitle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSTruncatedTooltipText, TooltipTextProvider } from '@elliemae/ds-truncated-tooltip-text';\nimport { RequiredMark } from '@elliemae/ds-form';\nimport { DSPageHeaderName, DSPageHeaderSlots, DSPageHeaderDataTestIds } from '../exported-related/index.js';\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;ADyBrB;AAvBF,uBAAuB;AACvB,8BAAoC;AACpC,uCAA4D;AAC5D,qBAA6B;AAC7B,8BAA6E;AAC7E,MAAM,6BAAyB,yBAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,0CAAkB;AAC1B,CAAC;AAAA;AAAA,eAEc,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM,GAAG;AAAA,WAC5C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWpD,MAAM,kBAAkB,CAAC,EAAE,WAAW,IAAI,aAAa,OAAO,GAAG,KAAK,MACpE,6CAAC,0BAAwB,GAAG,MAAM,eAAa,gDAAwB,cACrE;AAAA,8CAAC,wDACC,sDAAC,2DAAuB,OAAO,UAAU,GAC3C;AAAA,EACC,cAAc,4CAAC,+BAAa,UAAQ,MAAC;AAAA,GACxC;AAGF,MAAM,QAAQ;AAAA;AAAA,EAEZ,UAAU,kCAAU,OAAO,YAAY,0BAA0B;AAAA;AAAA,EAEjE,YAAY,kCAAU,KAAK,YAAY,oBAAoB;AAC7D;AAEA,gBAAgB,YAAY;AAC5B,gBAAgB,cAAc;AAC9B,MAAM,kCAA8B,kCAAS,eAAe;AAE5D,4BAA4B,YAAY;",
6
+ "names": []
7
+ }
@@ -0,0 +1,142 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var usePageHeader_exports = {};
30
+ __export(usePageHeader_exports, {
31
+ usePageHeader: () => usePageHeader
32
+ });
33
+ module.exports = __toCommonJS(usePageHeader_exports);
34
+ var React = __toESM(require("react"));
35
+ var import_jsx_runtime = require("react/jsx-runtime");
36
+ var import_react = require("react");
37
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
38
+ var import_react_desc_prop_types = require("../react-desc-prop-types.js");
39
+ var import_exported_related = require("../exported-related/index.js");
40
+ const usePageHeader = (props) => {
41
+ const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
42
+ (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.PageHeaderPropTypes, import_exported_related.DSPageHeaderName);
43
+ const {
44
+ menu,
45
+ Menu,
46
+ pageTitle,
47
+ PageTitle,
48
+ toolbar,
49
+ Toolbar,
50
+ summary,
51
+ Summary,
52
+ backarrow,
53
+ Backarrow,
54
+ breadcrumbs,
55
+ Breadcrumbs,
56
+ isSkeleton,
57
+ ...rest
58
+ } = props;
59
+ const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefaults);
60
+ const xStyledProps = (0, import_ds_props_helpers.useGetXstyledProps)(propsWithDefaults);
61
+ const currentBackArrow = (0, import_react.useMemo)(() => {
62
+ if (isSkeleton && (Backarrow || backarrow))
63
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.BackArrowSkeleton, {});
64
+ if (Backarrow)
65
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Backarrow, {});
66
+ if (backarrow)
67
+ return backarrow;
68
+ return void 0;
69
+ }, [Backarrow, backarrow, isSkeleton]);
70
+ const currentMenu = (0, import_react.useMemo)(() => {
71
+ if (isSkeleton && (Menu || menu))
72
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.MenuSkeleton, {});
73
+ if (Menu)
74
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Menu, {});
75
+ if (menu)
76
+ return menu;
77
+ return void 0;
78
+ }, [Menu, menu, isSkeleton]);
79
+ const currentBreadcrumbs = (0, import_react.useMemo)(() => {
80
+ if (isSkeleton && (Breadcrumbs || breadcrumbs))
81
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.BreadcrumbSkeleton, {});
82
+ if (Breadcrumbs)
83
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Breadcrumbs, {});
84
+ if (breadcrumbs)
85
+ return breadcrumbs;
86
+ return void 0;
87
+ }, [Breadcrumbs, breadcrumbs, isSkeleton]);
88
+ const currentSummary = (0, import_react.useMemo)(() => {
89
+ if (isSkeleton && (Summary || summary))
90
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.SummarySkeleton, {});
91
+ if (Summary)
92
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Summary, {});
93
+ if (summary)
94
+ return summary;
95
+ return void 0;
96
+ }, [Summary, summary, isSkeleton]);
97
+ const currentToolbar = (0, import_react.useMemo)(() => {
98
+ if (isSkeleton && (Toolbar || toolbar))
99
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.ToolbarSkeleton, {});
100
+ if (Toolbar)
101
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Toolbar, {});
102
+ if (toolbar)
103
+ return toolbar;
104
+ return void 0;
105
+ }, [Toolbar, toolbar, isSkeleton]);
106
+ const currentPageTitle = (0, import_react.useMemo)(() => {
107
+ if (isSkeleton && (PageTitle || pageTitle))
108
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.PageTitleSkeleton, {});
109
+ if (PageTitle)
110
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PageTitle, {});
111
+ if (pageTitle)
112
+ return pageTitle;
113
+ return void 0;
114
+ }, [PageTitle, pageTitle, isSkeleton]);
115
+ return (0, import_react.useMemo)(
116
+ () => ({
117
+ propsWithDefaults,
118
+ globalAttributes,
119
+ xStyledProps,
120
+ currentBackArrow,
121
+ currentMenu,
122
+ currentBreadcrumbs,
123
+ currentSummary,
124
+ currentToolbar,
125
+ currentPageTitle,
126
+ ...rest
127
+ }),
128
+ [
129
+ propsWithDefaults,
130
+ currentBackArrow,
131
+ currentBreadcrumbs,
132
+ currentMenu,
133
+ currentPageTitle,
134
+ currentSummary,
135
+ currentToolbar,
136
+ globalAttributes,
137
+ rest,
138
+ xStyledProps
139
+ ]
140
+ );
141
+ };
142
+ //# sourceMappingURL=usePageHeader.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/config/usePageHeader.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable complexity */\nimport { useMemo } from 'react';\nimport {\n useValidateTypescriptPropTypes,\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\n\nimport type { DSPageHeaderT } from '../react-desc-prop-types.js';\nimport { PageHeaderPropTypes, defaultProps } from '../react-desc-prop-types.js';\nimport {\n DSPageHeaderName,\n BackArrowSkeleton,\n BreadcrumbSkeleton,\n MenuSkeleton,\n PageTitleSkeleton,\n SummarySkeleton,\n ToolbarSkeleton,\n} from '../exported-related/index.js';\nexport const usePageHeader = (props: DSPageHeaderT.Props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, PageHeaderPropTypes, DSPageHeaderName);\n\n const {\n menu,\n Menu,\n pageTitle,\n PageTitle,\n toolbar,\n Toolbar,\n summary,\n Summary,\n backarrow,\n Backarrow,\n breadcrumbs,\n Breadcrumbs,\n isSkeleton,\n ...rest\n } = props;\n\n const globalAttributes = useGetGlobalAttributes(propsWithDefaults);\n const xStyledProps = useGetXstyledProps(propsWithDefaults);\n\n const currentBackArrow = useMemo(() => {\n if (isSkeleton && (Backarrow || backarrow)) return <BackArrowSkeleton />;\n if (Backarrow) return <Backarrow />;\n if (backarrow) return backarrow;\n return undefined;\n }, [Backarrow, backarrow, isSkeleton]);\n\n const currentMenu = useMemo(() => {\n if (isSkeleton && (Menu || menu)) return <MenuSkeleton />;\n if (Menu) return <Menu />;\n if (menu) return menu;\n return undefined;\n }, [Menu, menu, isSkeleton]);\n\n const currentBreadcrumbs = useMemo(() => {\n if (isSkeleton && (Breadcrumbs || breadcrumbs)) return <BreadcrumbSkeleton />;\n if (Breadcrumbs) return <Breadcrumbs />;\n if (breadcrumbs) return breadcrumbs;\n return undefined;\n }, [Breadcrumbs, breadcrumbs, isSkeleton]);\n\n const currentSummary = useMemo(() => {\n if (isSkeleton && (Summary || summary)) return <SummarySkeleton />;\n if (Summary) return <Summary />;\n if (summary) return summary;\n return undefined;\n }, [Summary, summary, isSkeleton]);\n\n const currentToolbar = useMemo(() => {\n if (isSkeleton && (Toolbar || toolbar)) return <ToolbarSkeleton />;\n if (Toolbar) return <Toolbar />;\n if (toolbar) return toolbar;\n return undefined;\n }, [Toolbar, toolbar, isSkeleton]);\n\n const currentPageTitle = useMemo(() => {\n if (isSkeleton && (PageTitle || pageTitle)) return <PageTitleSkeleton />;\n if (PageTitle) return <PageTitle />;\n if (pageTitle) return pageTitle;\n return undefined;\n }, [PageTitle, pageTitle, isSkeleton]);\n\n return useMemo(\n () => ({\n propsWithDefaults,\n globalAttributes,\n xStyledProps,\n currentBackArrow,\n currentMenu,\n currentBreadcrumbs,\n currentSummary,\n currentToolbar,\n currentPageTitle,\n ...rest,\n }),\n [\n propsWithDefaults,\n currentBackArrow,\n currentBreadcrumbs,\n currentMenu,\n currentPageTitle,\n currentSummary,\n currentToolbar,\n globalAttributes,\n rest,\n xStyledProps,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6CgC;AA5CvD,mBAAwB;AACxB,8BAKO;AAGP,mCAAkD;AAClD,8BAQO;AACA,MAAM,gBAAgB,CAAC,UAA+B;AAC3D,QAAM,wBAAoB,sDAA6B,OAAO,yCAAY;AAC1E,8DAA+B,mBAAmB,kDAAqB,wCAAgB;AAEvF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,uBAAmB,gDAAuB,iBAAiB;AACjE,QAAM,mBAAe,4CAAmB,iBAAiB;AAEzD,QAAM,uBAAmB,sBAAQ,MAAM;AACrC,QAAI,eAAe,aAAa;AAAY,aAAO,4CAAC,6CAAkB;AACtE,QAAI;AAAW,aAAO,4CAAC,aAAU;AACjC,QAAI;AAAW,aAAO;AACtB,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,WAAW,UAAU,CAAC;AAErC,QAAM,kBAAc,sBAAQ,MAAM;AAChC,QAAI,eAAe,QAAQ;AAAO,aAAO,4CAAC,wCAAa;AACvD,QAAI;AAAM,aAAO,4CAAC,QAAK;AACvB,QAAI;AAAM,aAAO;AACjB,WAAO;AAAA,EACT,GAAG,CAAC,MAAM,MAAM,UAAU,CAAC;AAE3B,QAAM,yBAAqB,sBAAQ,MAAM;AACvC,QAAI,eAAe,eAAe;AAAc,aAAO,4CAAC,8CAAmB;AAC3E,QAAI;AAAa,aAAO,4CAAC,eAAY;AACrC,QAAI;AAAa,aAAO;AACxB,WAAO;AAAA,EACT,GAAG,CAAC,aAAa,aAAa,UAAU,CAAC;AAEzC,QAAM,qBAAiB,sBAAQ,MAAM;AACnC,QAAI,eAAe,WAAW;AAAU,aAAO,4CAAC,2CAAgB;AAChE,QAAI;AAAS,aAAO,4CAAC,WAAQ;AAC7B,QAAI;AAAS,aAAO;AACpB,WAAO;AAAA,EACT,GAAG,CAAC,SAAS,SAAS,UAAU,CAAC;AAEjC,QAAM,qBAAiB,sBAAQ,MAAM;AACnC,QAAI,eAAe,WAAW;AAAU,aAAO,4CAAC,2CAAgB;AAChE,QAAI;AAAS,aAAO,4CAAC,WAAQ;AAC7B,QAAI;AAAS,aAAO;AACpB,WAAO;AAAA,EACT,GAAG,CAAC,SAAS,SAAS,UAAU,CAAC;AAEjC,QAAM,uBAAmB,sBAAQ,MAAM;AACrC,QAAI,eAAe,aAAa;AAAY,aAAO,4CAAC,6CAAkB;AACtE,QAAI;AAAW,aAAO,4CAAC,aAAU;AACjC,QAAI;AAAW,aAAO;AACtB,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,WAAW,UAAU,CAAC;AAErC,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
+ "names": []
7
+ }