@elliemae/ds-page-header 3.4.3-rc.0 → 3.4.4-next.0
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 +4 -1
- package/dist/cjs/DSPageHeader.js.map +1 -1
- package/dist/cjs/index.js +4 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/v1/DSPageHeader.js +61 -32
- package/dist/cjs/v1/DSPageHeader.js.map +2 -2
- package/dist/cjs/v1/DropdownTitle.js +22 -14
- package/dist/cjs/v1/DropdownTitle.js.map +2 -2
- package/dist/cjs/v1/EditableTitle.js +32 -14
- package/dist/cjs/v1/EditableTitle.js.map +2 -2
- package/dist/cjs/v1/PageHeaderImpl.js +71 -39
- package/dist/cjs/v1/PageHeaderImpl.js.map +2 -2
- package/dist/cjs/v1/Title.js +10 -4
- package/dist/cjs/v1/Title.js.map +2 -2
- package/dist/cjs/v1/TitleWrapper.js +4 -1
- package/dist/cjs/v1/TitleWrapper.js.map +1 -1
- package/dist/cjs/v2/PageHeader.js +51 -17
- package/dist/cjs/v2/PageHeader.js.map +1 -1
- package/dist/cjs/v2/components/PageHeaderEditableTitle.js +27 -17
- package/dist/cjs/v2/components/PageHeaderEditableTitle.js.map +1 -1
- package/dist/cjs/v2/components/PageHeaderSummary.js +21 -11
- package/dist/cjs/v2/components/PageHeaderSummary.js.map +1 -1
- package/dist/cjs/v2/components/PageHeaderTitle.js +18 -9
- package/dist/cjs/v2/components/PageHeaderTitle.js.map +1 -1
- package/dist/cjs/v2/config/usePageHeader.js +40 -30
- package/dist/cjs/v2/config/usePageHeader.js.map +1 -1
- package/dist/cjs/v2/exported-related/data-test-ids.js +4 -1
- package/dist/cjs/v2/exported-related/data-test-ids.js.map +1 -1
- package/dist/cjs/v2/exported-related/index.js +4 -1
- package/dist/cjs/v2/exported-related/index.js.map +1 -1
- package/dist/cjs/v2/exported-related/theming.js +4 -1
- package/dist/cjs/v2/exported-related/theming.js.map +1 -1
- package/dist/cjs/v2/react-desc-prop-types.js +4 -1
- package/dist/cjs/v2/react-desc-prop-types.js.map +1 -1
- package/dist/cjs/v2/styled.js +4 -1
- package/dist/cjs/v2/styled.js.map +1 -1
- package/dist/cjs/v2/tests/utils.js +4 -1
- package/dist/cjs/v2/tests/utils.js.map +1 -1
- package/dist/esm/DSPageHeader.js.map +2 -2
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/v1/DSPageHeader.js +57 -31
- package/dist/esm/v1/DSPageHeader.js.map +1 -1
- package/dist/esm/v1/DropdownTitle.js +18 -13
- package/dist/esm/v1/DropdownTitle.js.map +1 -1
- package/dist/esm/v1/EditableTitle.js +28 -13
- package/dist/esm/v1/EditableTitle.js.map +1 -1
- package/dist/esm/v1/PageHeaderImpl.js +67 -38
- package/dist/esm/v1/PageHeaderImpl.js.map +1 -1
- package/dist/esm/v1/Title.js +6 -3
- package/dist/esm/v1/Title.js.map +1 -1
- package/dist/esm/v1/TitleWrapper.js.map +1 -1
- package/dist/esm/v2/PageHeader.js +47 -16
- package/dist/esm/v2/PageHeader.js.map +1 -1
- package/dist/esm/v2/components/PageHeaderEditableTitle.js +23 -16
- package/dist/esm/v2/components/PageHeaderEditableTitle.js.map +1 -1
- package/dist/esm/v2/components/PageHeaderSummary.js +17 -10
- package/dist/esm/v2/components/PageHeaderSummary.js.map +1 -1
- package/dist/esm/v2/components/PageHeaderTitle.js +14 -8
- package/dist/esm/v2/components/PageHeaderTitle.js.map +1 -1
- package/dist/esm/v2/config/usePageHeader.js +36 -29
- package/dist/esm/v2/config/usePageHeader.js.map +1 -1
- package/dist/esm/v2/exported-related/data-test-ids.js.map +1 -1
- package/dist/esm/v2/exported-related/index.js.map +1 -1
- package/dist/esm/v2/exported-related/theming.js.map +1 -1
- package/dist/esm/v2/react-desc-prop-types.js.map +1 -1
- package/dist/esm/v2/styled.js.map +1 -1
- package/dist/esm/v2/tests/utils.js.map +1 -1
- package/package.json +13 -13
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useRef, useState, useCallback } from "react";
|
|
3
4
|
import { DSInputText, DSInputTextName, DSInputTextSlots } from "@elliemae/ds-form-input-text";
|
|
4
5
|
import { styled } from "@elliemae/ds-system";
|
|
5
6
|
import {
|
|
@@ -61,24 +62,30 @@ const PageHeaderEditableTitle = ({
|
|
|
61
62
|
onChange: handleOnChange,
|
|
62
63
|
onBlur: handleOnBlur
|
|
63
64
|
});
|
|
64
|
-
return /* @__PURE__ */
|
|
65
|
+
return /* @__PURE__ */ jsxs(EditableContainer, {
|
|
65
66
|
className: hovered || editing ? "editable-title-component" : "",
|
|
66
67
|
onMouseEnter: () => setHovered(true),
|
|
67
68
|
onMouseLeave: () => setHovered(false),
|
|
68
|
-
"data-testid": DSPageHeaderDataTestIds.EDITABLE_HEADER_TITLE
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
69
|
+
"data-testid": DSPageHeaderDataTestIds.EDITABLE_HEADER_TITLE,
|
|
70
|
+
children: [
|
|
71
|
+
(hovered || editing) && /* @__PURE__ */ jsx(DSInputText, {
|
|
72
|
+
onChange: handleOnChange,
|
|
73
|
+
...rest,
|
|
74
|
+
...globals,
|
|
75
|
+
placeholder: "",
|
|
76
|
+
style: { width: width + 10, minWidth: "260px", maxWidth: "100%" },
|
|
77
|
+
value: titleValue
|
|
78
|
+
}),
|
|
79
|
+
/* @__PURE__ */ jsx("div", {
|
|
80
|
+
ref: titleRef,
|
|
81
|
+
style: { width: "fit-content" },
|
|
82
|
+
children: /* @__PURE__ */ jsx(PageHeaderTitle, {
|
|
83
|
+
showMarker: showMarker && !hovered && !editing,
|
|
84
|
+
children: titleValue
|
|
85
|
+
})
|
|
86
|
+
})
|
|
87
|
+
]
|
|
88
|
+
});
|
|
82
89
|
};
|
|
83
90
|
const props = {
|
|
84
91
|
...globalAttributesPropTypes,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/components/PageHeaderEditableTitle.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB;AAAA,SAAgB,QAAQ,UAAU,mBAAsC;AACxE,SAAS,aAAa,iBAAiB,wBAAwB;AAC/D,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AAExC,MAAM,oBAAoB,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAU7B,mBAAmB,iBAAiB;AAAA;AAAA;AAAA,SAGpC,mBAAmB,iBAAiB;AAAA,mBAC1B,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA,eAEzC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAK5C,MAAM,0BAA0B,CAAC;AAAA,EACtC,UAAU;AAAA,EACV,SAAS,cAAc;AAAA,EACvB,aAAa;AAAA,KACV;AACL,MAAM;AACJ,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,CAAC,SAAS,UAAU,IAAI,yBAAyB,eAAe,KAAK;AAC3E,QAAM,WAAW,OAAO,IAAI;AAC5B,QAAM,EAAE,MAAM,IAAI,WAAW,QAAQ;AAErC,QAAM,iBAA2D,YAAY,CAAC,MAAM;AAClF,kBAAc,EAAE,OAAO,KAAK;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAyC,YAAY,MAAM;AAC/D,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,eAAwC,YAAY,MAAM;AAC9D,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,mBAA4C,YAAY,MAAM;AAClE,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,uBAAuB,MAAM;AAAA,IAC3C,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV,CAAC;AAED,SACE,qBAAC;AAAA,IACC,WAAW,WAAW,UAAU,6BAA6B;AAAA,IAC7D,cAAc,MAAM,WAAW,IAAI;AAAA,IACnC,cAAc,MAAM,WAAW,KAAK;AAAA,IACpC,eAAa,wBAAwB;AAAA,IAEnC;AAAA,kBAAW,YACX,oBAAC;AAAA,QACC,UAAU;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,QACJ,aAAY;AAAA,QACZ,OAAO,EAAE,OAAO,QAAQ,IAAI,UAAU,SAAS,UAAU,OAAO;AAAA,QAChE,OAAO;AAAA,OACT;AAAA,MAEF,oBAAC;AAAA,QAAI,KAAK;AAAA,QAAU,OAAO,EAAE,OAAO,cAAc;AAAA,QAChD,8BAAC;AAAA,UAAgB,YAAY,cAAc,CAAC,WAAW,CAAC;AAAA,UAAU;AAAA,SAAW;AAAA,OAC/E;AAAA;AAAA,GACF;AAEJ;AAEA,MAAM,QAAQ;AAAA,EACZ,GAAG;AAAA,EAEH,UAAU,UAAU,OAAO,YAAY,gBAAgB;AAAA,EAEvD,SAAS,UAAU,KAAK,YAAY,qCAAqC;AAAA,EAEzE,YAAY,UAAU,KAAK,YAAY,mBAAmB;AAC5D;AAEA,wBAAwB,YAAY;AACpC,wBAAwB,cAAc;AACtC,MAAM,sCAAsC,SAAS,uBAAuB;AAE5E,oCAAoC,YAAY;AAEhD,IAAO,kCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { PropTypes, describe } from "@elliemae/ds-utilities";
|
|
4
4
|
import { styled } from "@elliemae/ds-system";
|
|
5
5
|
import { DSPageHeaderName, DSPageHeaderSlots, DSPageHeaderDataTestIds } from "../exported-related";
|
|
@@ -34,16 +34,23 @@ const PageHeaderSummaryWrapper = styled("div", {
|
|
|
34
34
|
width: ${({ theme }) => theme.space.l};
|
|
35
35
|
}
|
|
36
36
|
`;
|
|
37
|
-
const PageHeaderSummary = ({ value = null, label = "", ...rest }) => /* @__PURE__ */
|
|
37
|
+
const PageHeaderSummary = ({ value = null, label = "", ...rest }) => /* @__PURE__ */ jsxs(PageHeaderSummaryWrapper, {
|
|
38
38
|
"data-testid": DSPageHeaderDataTestIds.SUMMARY,
|
|
39
|
-
...rest
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
|
|
39
|
+
...rest,
|
|
40
|
+
children: [
|
|
41
|
+
(value === 0 || value) && /* @__PURE__ */ jsx("div", {
|
|
42
|
+
className: "ph-summary-value",
|
|
43
|
+
children: value
|
|
44
|
+
}),
|
|
45
|
+
label && /* @__PURE__ */ jsx("div", {
|
|
46
|
+
className: "ph-summary-label",
|
|
47
|
+
children: label
|
|
48
|
+
}),
|
|
49
|
+
(value === 0 || value || label) && /* @__PURE__ */ jsx("div", {
|
|
50
|
+
className: "ph-summary-space"
|
|
51
|
+
})
|
|
52
|
+
]
|
|
53
|
+
});
|
|
47
54
|
const props = {
|
|
48
55
|
value: PropTypes.number.description("value for page header summary"),
|
|
49
56
|
label: PropTypes.string.description("label attached to value")
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/components/PageHeaderSummary.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,WAAW,gBAAgB;AACpC,SAAS,cAAc;AACvB,SAAS,kBAAkB,mBAAmB,+BAA+B;AAE7E,MAAM,2BAA2B,OAAO,OAAO;AAAA,EAC7C,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKgB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA,eAC7B,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM;AAAA,iBACnC,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;AAAA;AAAA,oBAElC,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA,aAGlC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA,qBAC5B,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA,aAGnC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,aAGpC,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAGxC,MAAM,oBAAoB,CAAC,EAAE,QAAQ,MAAM,QAAQ,OAAO,KAAK,MAC7D,qBAAC;AAAA,EAAyB,eAAa,wBAAwB;AAAA,EAAU,GAAG;AAAA,EACxE;AAAA,eAAU,KAAK,UAAU,oBAAC;AAAA,MAAI,WAAU;AAAA,MAAoB;AAAA,KAAM;AAAA,IACnE,SAAS,oBAAC;AAAA,MAAI,WAAU;AAAA,MAAoB;AAAA,KAAM;AAAA,KACjD,UAAU,KAAK,SAAS,UAAU,oBAAC;AAAA,MAAI,WAAU;AAAA,KAAmB;AAAA;AAAA,CACxE;AAGF,MAAM,QAAQ;AAAA,EAEZ,OAAO,UAAU,OAAO,YAAY,+BAA+B;AAAA,EAEnE,OAAO,UAAU,OAAO,YAAY,yBAAyB;AAC/D;AAEA,kBAAkB,YAAY;AAC9B,kBAAkB,cAAc;AAChC,MAAM,gCAAgC,SAAS,iBAAiB;AAEhE,8BAA8B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { styled } from "@elliemae/ds-system";
|
|
4
4
|
import { PropTypes, describe } from "@elliemae/ds-utilities";
|
|
5
5
|
import { DSTruncatedTooltipText, TooltipTextProvider } from "@elliemae/ds-truncated-tooltip-text";
|
|
@@ -22,14 +22,20 @@ const PageHeaderTitleWrapper = styled("div", {
|
|
|
22
22
|
right: 0;
|
|
23
23
|
}
|
|
24
24
|
`;
|
|
25
|
-
const PageHeaderTitle = ({ children = "", showMarker = false, ...rest }) => /* @__PURE__ */
|
|
25
|
+
const PageHeaderTitle = ({ children = "", showMarker = false, ...rest }) => /* @__PURE__ */ jsxs(PageHeaderTitleWrapper, {
|
|
26
26
|
...rest,
|
|
27
|
-
"data-testid": DSPageHeaderDataTestIds.HEADER_TITLE
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
})
|
|
27
|
+
"data-testid": DSPageHeaderDataTestIds.HEADER_TITLE,
|
|
28
|
+
children: [
|
|
29
|
+
/* @__PURE__ */ jsx(TooltipTextProvider, {
|
|
30
|
+
children: /* @__PURE__ */ jsx(DSTruncatedTooltipText, {
|
|
31
|
+
value: children
|
|
32
|
+
})
|
|
33
|
+
}),
|
|
34
|
+
showMarker && /* @__PURE__ */ jsx(RequiredMark, {
|
|
35
|
+
required: true
|
|
36
|
+
})
|
|
37
|
+
]
|
|
38
|
+
});
|
|
33
39
|
const props = {
|
|
34
40
|
children: PropTypes.string.description("Page header title string"),
|
|
35
41
|
showMarker: PropTypes.bool.description("show required mark")
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/components/PageHeaderTitle.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,cAAc;AACvB,SAAS,WAAW,gBAAgB;AACpC,SAAS,wBAAwB,2BAA2B;AAC5D,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB,mBAAmB,+BAA+B;AAC7E,MAAM,yBAAyB,OAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA,eAEc,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM;AAAA,WACzC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAW/C,MAAM,kBAAkB,CAAC,EAAE,WAAW,IAAI,aAAa,UAAU,KAAK,MACpE,qBAAC;AAAA,EAAwB,GAAG;AAAA,EAAM,eAAa,wBAAwB;AAAA,EACrE;AAAA,wBAAC;AAAA,MACC,8BAAC;AAAA,QAAuB,OAAO;AAAA,OAAU;AAAA,KAC3C;AAAA,IACC,cAAc,oBAAC;AAAA,MAAa,UAAQ;AAAA,KAAC;AAAA;AAAA,CACxC;AAGF,MAAM,QAAQ;AAAA,EAEZ,UAAU,UAAU,OAAO,YAAY,0BAA0B;AAAA,EAEjE,YAAY,UAAU,KAAK,YAAY,oBAAoB;AAC7D;AAEA,gBAAgB,YAAY;AAC5B,gBAAgB,cAAc;AAC9B,MAAM,8BAA8B,SAAS,eAAe;AAE5D,4BAA4B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
3
|
import { useMemo } from "react";
|
|
3
4
|
import {
|
|
4
5
|
useValidateTypescriptPropTypes,
|
|
@@ -27,35 +28,41 @@ const usePageHeader = (props) => {
|
|
|
27
28
|
} = props;
|
|
28
29
|
const globalAttributes = useGetGlobalAttributes(propsWithDefaults);
|
|
29
30
|
const xStyledProps = useGetXstyledProps(propsWithDefaults);
|
|
30
|
-
const currentBackArrow = useMemo(() => backarrow ?? (Backarrow ? /* @__PURE__ */
|
|
31
|
-
const currentMenu = useMemo(() => menu ?? (Menu ? /* @__PURE__ */
|
|
32
|
-
const currentBreadcrumbs = useMemo(
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
31
|
+
const currentBackArrow = useMemo(() => backarrow ?? (Backarrow ? /* @__PURE__ */ jsx(Backarrow, {}) : void 0), [Backarrow, backarrow]);
|
|
32
|
+
const currentMenu = useMemo(() => menu ?? (Menu ? /* @__PURE__ */ jsx(Menu, {}) : void 0), [Menu, menu]);
|
|
33
|
+
const currentBreadcrumbs = useMemo(
|
|
34
|
+
() => breadcrumbs ?? (Breadcrumbs ? /* @__PURE__ */ jsx(Breadcrumbs, {}) : void 0),
|
|
35
|
+
[Breadcrumbs, breadcrumbs]
|
|
36
|
+
);
|
|
37
|
+
const currentSummary = useMemo(() => summary ?? (Summary ? /* @__PURE__ */ jsx(Summary, {}) : void 0), [Summary, summary]);
|
|
38
|
+
const currentToolbar = useMemo(() => toolbar ?? (Toolbar ? /* @__PURE__ */ jsx(Toolbar, {}) : void 0), [Toolbar, toolbar]);
|
|
39
|
+
const currentPageTitle = useMemo(() => pageTitle ?? (PageTitle ? /* @__PURE__ */ jsx(PageTitle, {}) : void 0), [PageTitle, pageTitle]);
|
|
40
|
+
return useMemo(
|
|
41
|
+
() => ({
|
|
42
|
+
propsWithDefaults,
|
|
43
|
+
globalAttributes,
|
|
44
|
+
xStyledProps,
|
|
45
|
+
currentBackArrow,
|
|
46
|
+
currentMenu,
|
|
47
|
+
currentBreadcrumbs,
|
|
48
|
+
currentSummary,
|
|
49
|
+
currentToolbar,
|
|
50
|
+
currentPageTitle,
|
|
51
|
+
...rest
|
|
52
|
+
}),
|
|
53
|
+
[
|
|
54
|
+
propsWithDefaults,
|
|
55
|
+
currentBackArrow,
|
|
56
|
+
currentBreadcrumbs,
|
|
57
|
+
currentMenu,
|
|
58
|
+
currentPageTitle,
|
|
59
|
+
currentSummary,
|
|
60
|
+
currentToolbar,
|
|
61
|
+
globalAttributes,
|
|
62
|
+
rest,
|
|
63
|
+
xStyledProps
|
|
64
|
+
]
|
|
65
|
+
);
|
|
59
66
|
};
|
|
60
67
|
export {
|
|
61
68
|
usePageHeader
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/config/usePageHeader.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport { useMemo } from 'react';\nimport {\n useValidateTypescriptPropTypes,\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-utilities';\n\nimport { DSPageHeaderT, PageHeaderPropTypes, defaultProps } from '../react-desc-prop-types';\n\nexport const usePageHeader = (props: DSPageHeaderT.Props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, PageHeaderPropTypes);\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 ...rest\n } = props;\n\n const globalAttributes = useGetGlobalAttributes(propsWithDefaults);\n const xStyledProps = useGetXstyledProps(propsWithDefaults);\n\n const currentBackArrow = useMemo(() => backarrow ?? (Backarrow ? <Backarrow /> : undefined), [Backarrow, backarrow]);\n\n const currentMenu = useMemo(() => menu ?? (Menu ? <Menu /> : undefined), [Menu, menu]);\n\n const currentBreadcrumbs = useMemo(\n () => breadcrumbs ?? (Breadcrumbs ? <Breadcrumbs /> : undefined),\n [Breadcrumbs, breadcrumbs],\n );\n\n const currentSummary = useMemo(() => summary ?? (Summary ? <Summary /> : undefined), [Summary, summary]);\n\n const currentToolbar = useMemo(() => toolbar ?? (Toolbar ? <Toolbar /> : undefined), [Toolbar, toolbar]);\n\n const currentPageTitle = useMemo(() => pageTitle ?? (PageTitle ? <PageTitle /> : undefined), [PageTitle, pageTitle]);\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"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,eAAe;AACxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAwB,qBAAqB,oBAAoB;AAE1D,MAAM,gBAAgB,CAAC,UAA+B;AAC3D,QAAM,oBAAoB,6BAA6B,OAAO,YAAY;AAC1E,iCAA+B,mBAAmB,mBAAmB;AAErE,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,OACG;AAAA,EACL,IAAI;AAEJ,QAAM,mBAAmB,uBAAuB,iBAAiB;AACjE,QAAM,eAAe,mBAAmB,iBAAiB;AAEzD,QAAM,mBAAmB,QAAQ,MAAM,cAAc,YAAY,oBAAC,aAAU,IAAK,SAAY,CAAC,WAAW,SAAS,CAAC;AAEnH,QAAM,cAAc,QAAQ,MAAM,SAAS,OAAO,oBAAC,QAAK,IAAK,SAAY,CAAC,MAAM,IAAI,CAAC;AAErF,QAAM,qBAAqB;AAAA,IACzB,MAAM,gBAAgB,cAAc,oBAAC,eAAY,IAAK;AAAA,IACtD,CAAC,aAAa,WAAW;AAAA,EAC3B;AAEA,QAAM,iBAAiB,QAAQ,MAAM,YAAY,UAAU,oBAAC,WAAQ,IAAK,SAAY,CAAC,SAAS,OAAO,CAAC;AAEvG,QAAM,iBAAiB,QAAQ,MAAM,YAAY,UAAU,oBAAC,WAAQ,IAAK,SAAY,CAAC,SAAS,OAAO,CAAC;AAEvG,QAAM,mBAAmB,QAAQ,MAAM,cAAc,YAAY,oBAAC,aAAU,IAAK,SAAY,CAAC,WAAW,SAAS,CAAC;AAEnH,SAAO;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
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/exported-related/data-test-ids.ts"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSPageHeaderDataTestIds = {\n CONTAINER: 'ds-page-header-container',\n HEADER_TITLE: 'ds-page-header-title',\n EDITABLE_HEADER_TITLE: 'ds-page-header-editable-title',\n SUMMARY: 'ds-page-header-summary',\n};\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,0BAA0B;AAAA,EACrC,WAAW;AAAA,EACX,cAAc;AAAA,EACd,uBAAuB;AAAA,EACvB,SAAS;AACX;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/exported-related/index.ts"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './data-test-ids';\nexport * from './theming';\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/exported-related/theming.ts"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSPageHeaderName = 'DS-PageHeader';\n\nexport const DSPageHeaderSlots = {\n CONTAINER: 'root',\n HEADER_TITLE: 'header-title',\n TOOLBAR: 'toolbar',\n MENU: 'menu',\n SUMMARY: 'summary',\n BACK: 'back',\n};\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,mBAAmB;AAEzB,MAAM,oBAAoB;AAAA,EAC/B,WAAW;AAAA,EACX,cAAc;AAAA,EACd,SAAS;AAAA,EACT,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/react-desc-prop-types.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-utilities';\n\nexport declare namespace DSPageHeaderT {\n export interface DefaultProps {\n withBottomSeparator: boolean;\n containerProps: object;\n }\n\n export interface OptionalProps {\n breadcrumbs?: JSX.Element;\n pageTitle?: JSX.Element;\n backarrow?: JSX.Element;\n summary?: JSX.Element;\n toolbar?: JSX.Element;\n menu?: JSX.Element;\n Breadcrumbs?: () => JSX.Element;\n PageTitle?: () => JSX.Element;\n Backarrow?: () => JSX.Element;\n Summary?: () => JSX.Element;\n Toolbar?: () => JSX.Element;\n Menu?: () => JSX.Element;\n }\n\n export interface Props extends Partial<DefaultProps>, OptionalProps {}\n}\n\nexport const PageHeaderPropTypes = {\n ...globalAttributesPropTypes,\n /** props injected to wrapper of page header */\n containerProps: PropTypes.shape({}).description('props injected to wrapper of page header'),\n /** breadcrumbs component */\n breadcrumbs: PropTypes.node\n .description('breadcrumbs component')\n .deprecated({ version: 'Prop will be removed on 05/01/2022' }),\n Breadcrumbs: PropTypes.func.description('breadcrumbs component'),\n /** PageHeaderTitle component */\n pageTitle: PropTypes.node\n .description('PageHeaderTitle component')\n .deprecated({ version: 'Prop will be removed on 05/01/2022' }),\n PageTitle: PropTypes.func.description('PageHeaderTitle component'),\n /** back arrow component */\n backarrow: PropTypes.node\n .description('back arrow component')\n .deprecated({ version: 'Prop will be removed on 05/01/2022' }),\n Backarrow: PropTypes.func.description('back arrow component'),\n\n /** PageHeaderSummary component */\n summary: PropTypes.node\n .description('PageHeaderSummary component')\n .deprecated({ version: 'Prop will be removed on 05/01/2022' }),\n Summary: PropTypes.func.description('PageHeaderSummary component'),\n /** toolbar component */\n toolbar: PropTypes.node\n .description('toolbar component')\n .deprecated({ version: 'Prop will be removed on 05/01/2022' }),\n Toolbar: PropTypes.func.description('toolbar component'),\n\n /** PageHeaderMenu component */\n menu: PropTypes.node\n .description('PageHeaderMenu component')\n .deprecated({ version: 'Prop will be removed on 05/01/2022' }),\n Menu: PropTypes.func.description('PageHeaderMenu component'),\n /** Border bottom below the page header */\n withBottomSeparator: PropTypes.bool.description('Border bottom below the page header'),\n};\n\nexport const defaultProps: DSPageHeaderT.DefaultProps = {\n containerProps: {},\n withBottomSeparator: true,\n};\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,2BAA2B,iBAAiB;AA0B9C,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EAEH,gBAAgB,UAAU,MAAM,CAAC,CAAC,EAAE,YAAY,0CAA0C;AAAA,EAE1F,aAAa,UAAU,KACpB,YAAY,uBAAuB,EACnC,WAAW,EAAE,SAAS,qCAAqC,CAAC;AAAA,EAC/D,aAAa,UAAU,KAAK,YAAY,uBAAuB;AAAA,EAE/D,WAAW,UAAU,KAClB,YAAY,2BAA2B,EACvC,WAAW,EAAE,SAAS,qCAAqC,CAAC;AAAA,EAC/D,WAAW,UAAU,KAAK,YAAY,2BAA2B;AAAA,EAEjE,WAAW,UAAU,KAClB,YAAY,sBAAsB,EAClC,WAAW,EAAE,SAAS,qCAAqC,CAAC;AAAA,EAC/D,WAAW,UAAU,KAAK,YAAY,sBAAsB;AAAA,EAG5D,SAAS,UAAU,KAChB,YAAY,6BAA6B,EACzC,WAAW,EAAE,SAAS,qCAAqC,CAAC;AAAA,EAC/D,SAAS,UAAU,KAAK,YAAY,6BAA6B;AAAA,EAEjE,SAAS,UAAU,KAChB,YAAY,mBAAmB,EAC/B,WAAW,EAAE,SAAS,qCAAqC,CAAC;AAAA,EAC/D,SAAS,UAAU,KAAK,YAAY,mBAAmB;AAAA,EAGvD,MAAM,UAAU,KACb,YAAY,0BAA0B,EACtC,WAAW,EAAE,SAAS,qCAAqC,CAAC;AAAA,EAC/D,MAAM,UAAU,KAAK,YAAY,0BAA0B;AAAA,EAE3D,qBAAqB,UAAU,KAAK,YAAY,qCAAqC;AACvF;AAEO,MAAM,eAA2C;AAAA,EACtD,gBAAgB,CAAC;AAAA,EACjB,qBAAqB;AACvB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/styled.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSPageHeaderSlots, DSPageHeaderName } from './exported-related';\n\ninterface StyledContainerProps {\n withBottomSeparator: boolean;\n}\nexport const PageHeaderCustomRenderer = styled('div')`\n width: auto;\n color: ${({ theme }) => theme.colors.brand[800]};\n font-style: italic;\n font-size: 0.8rem;\n`;\n\nexport const Container = styled('div', {\n name: DSPageHeaderName,\n slot: DSPageHeaderSlots.CONTAINER,\n})`\n width: 100%;\n margin-bottom: 8px;\n`;\n\nexport const ContainerWBorder = styled('div')<StyledContainerProps>`\n width: 100%;\n padding: 12px 0 8px 0;\n display: grid;\n align-items: center;\n height: 100%;\n ${({ withBottomSeparator, theme }) =>\n !withBottomSeparator ? '' : `border-bottom: solid 1px ${theme.colors.neutral[400]};`}\n`;\n\nexport const PageHeaderToolbarWrapper = styled('div', {\n name: DSPageHeaderName,\n slot: DSPageHeaderSlots.TOOLBAR,\n})`\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n & .em-ds-toolbar {\n height: auto;\n background: none;\n & > div {\n .em-ds-button {\n margin-left: ${({ theme }) => theme.space.xxs};\n }\n .em-ds-input-search {\n box-shadow: none;\n div {\n height: 100%;\n }\n }\n }\n }\n`;\n\nexport const PageHeaderMenu = styled('div', {\n name: DSPageHeaderName,\n slot: DSPageHeaderSlots.MENU,\n})`\n display: flex;\n flex-direction: row;\n align-items: center;\n padding-left: ${({ theme }) => theme.space.xxxs};\n .em-ds-button--secondary {\n &:not(:hover) {\n border-color: transparent;\n }\n &:focus:after {\n top: -1px;\n left: -1px;\n width: calc(100% + 2px);\n height: calc(100% + 2px);\n }\n }\n`;\n\nexport const PageHeaderBack = styled('div', {\n name: DSPageHeaderName,\n slot: DSPageHeaderSlots.BACK,\n})`\n display: flex;\n align-items: center;\n fill: ${({ theme }) => theme.colors.brand[600]};\n cursor: pointer;\n`;\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,mBAAmB,wBAAwB;AAK7C,MAAM,2BAA2B,OAAO,KAAK;AAAA;AAAA,WAEzC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAKtC,MAAM,YAAY,OAAO,OAAO;AAAA,EACrC,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA;AAKM,MAAM,mBAAmB,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMxC,CAAC,EAAE,qBAAqB,MAAM,MAC9B,CAAC,sBAAsB,KAAK,4BAA4B,MAAM,OAAO,QAAQ;AAAA;AAG1E,MAAM,2BAA2B,OAAO,OAAO;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAUsB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAY3C,MAAM,iBAAiB,OAAO,OAAO;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA;AAAA,kBAIiB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AActC,MAAM,iBAAiB,OAAO,OAAO;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA,UAGS,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/v2/tests/utils.js"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { logger } from '@elliemae/ds-utilities';\n\nconst subItems = [\n {\n id: 'id3',\n label: 'SubMenu List Item-1',\n onClick: (e) => logger(e, 'subMenu id3'),\n },\n {\n id: 'id4',\n type: 'subMenu',\n label: 'SubMenu List Item-2',\n onClick: (e) => logger(e, 'subMenu id4'),\n subItems: [\n {\n id: 'id5',\n label: 'SubMenu List Item-2',\n onClick: (e) => logger(e, 'subMenu id5'),\n },\n ],\n },\n];\n\nexport const options = [\n {\n type: 'SelectionGroup',\n id: 'select-option',\n multi: false,\n closeOnClick: false,\n interactionType: 'click',\n items: [\n {\n id: 'id-1',\n selectable: true,\n type: 'subMenu',\n label: 'View Example 123',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-2',\n type: 'subMenu',\n label: 'Option 2',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-3',\n type: 'subMenu',\n label: 'Option 3',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-4',\n type: 'subMenu',\n label: 'Option 4',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-5',\n type: 'subMenu',\n label: 'Option 5',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-6',\n type: 'subMenu',\n label: 'Option 6',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-7',\n type: 'subMenu',\n label: 'Truncate long option Other Custom View Long Long Long Long Long',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n ],\n },\n];\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AAEvB,MAAM,WAAW;AAAA,EACf;AAAA,IACE,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,SAAS,CAAC,MAAM,OAAO,GAAG,aAAa;AAAA,EACzC;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS,CAAC,MAAM,OAAO,GAAG,aAAa;AAAA,IACvC,UAAU;AAAA,MACR;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS,CAAC,MAAM,OAAO,GAAG,aAAa;AAAA,MACzC;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,UAAU;AAAA,EACrB;AAAA,IACE,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,OAAO;AAAA,MACL;AAAA,QACE,IAAI;AAAA,QACJ,YAAY;AAAA,QACZ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-page-header",
|
|
3
|
-
"version": "3.4.
|
|
3
|
+
"version": "3.4.4-next.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Page Header",
|
|
6
6
|
"files": [
|
|
@@ -103,18 +103,18 @@
|
|
|
103
103
|
"indent": 4
|
|
104
104
|
},
|
|
105
105
|
"dependencies": {
|
|
106
|
-
"@elliemae/ds-breadcrumb": "3.4.
|
|
107
|
-
"@elliemae/ds-button": "3.4.
|
|
108
|
-
"@elliemae/ds-classnames": "3.4.
|
|
109
|
-
"@elliemae/ds-dropdownmenu": "3.4.
|
|
110
|
-
"@elliemae/ds-form": "3.4.
|
|
111
|
-
"@elliemae/ds-form-input-text": "3.4.
|
|
112
|
-
"@elliemae/ds-grid": "3.4.
|
|
113
|
-
"@elliemae/ds-icon": "3.4.
|
|
114
|
-
"@elliemae/ds-icons": "3.4.
|
|
115
|
-
"@elliemae/ds-system": "3.4.
|
|
116
|
-
"@elliemae/ds-truncated-tooltip-text": "3.4.
|
|
117
|
-
"@elliemae/ds-utilities": "3.4.
|
|
106
|
+
"@elliemae/ds-breadcrumb": "3.4.4-next.0",
|
|
107
|
+
"@elliemae/ds-button": "3.4.4-next.0",
|
|
108
|
+
"@elliemae/ds-classnames": "3.4.4-next.0",
|
|
109
|
+
"@elliemae/ds-dropdownmenu": "3.4.4-next.0",
|
|
110
|
+
"@elliemae/ds-form": "3.4.4-next.0",
|
|
111
|
+
"@elliemae/ds-form-input-text": "3.4.4-next.0",
|
|
112
|
+
"@elliemae/ds-grid": "3.4.4-next.0",
|
|
113
|
+
"@elliemae/ds-icon": "3.4.4-next.0",
|
|
114
|
+
"@elliemae/ds-icons": "3.4.4-next.0",
|
|
115
|
+
"@elliemae/ds-system": "3.4.4-next.0",
|
|
116
|
+
"@elliemae/ds-truncated-tooltip-text": "3.4.4-next.0",
|
|
117
|
+
"@elliemae/ds-utilities": "3.4.4-next.0",
|
|
118
118
|
"prop-types": "~15.8.1"
|
|
119
119
|
},
|
|
120
120
|
"devDependencies": {
|