@elliemae/ds-page-header 1.54.0-next.7 → 1.54.0-rc.3

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.
@@ -39,10 +39,10 @@ var PageHeaderCustomRenderer = /*#__PURE__*/styled__default['default'].div.withC
39
39
  });
40
40
  var Container = /*#__PURE__*/styled__default['default'].div.withConfig({
41
41
  componentId: "sc-ps4m9w-1"
42
- })(["width:100%;margin-bottom:4px;"]);
42
+ })(["width:100%;margin-bottom:8px;"]);
43
43
  var ContainerWBorder = /*#__PURE__*/styled__default['default'].div.withConfig({
44
44
  componentId: "sc-ps4m9w-2"
45
- })(["width:100%;padding-bottom:4px;", ""], function (props) {
45
+ })(["width:100%;padding:12px 0 8px 0;display:grid;align-items:center;height:100%;", ""], function (props) {
46
46
  return !props.withBottomSeparator ? '' : "border-bottom: solid 1px ".concat(props.theme.colors.neutral[400], ";");
47
47
  });
48
48
 
@@ -56,7 +56,7 @@ var DSPageHeaderV2 = function DSPageHeaderV2(_ref) {
56
56
  menu = _ref.menu,
57
57
  withBottomSeparator = _ref.withBottomSeparator;
58
58
  var wrapperRow = ['auto', 1];
59
- var mainRow = lodash.compact([1, '268px']);
59
+ var mainRow = lodash.compact([1, 'auto']);
60
60
  var pageTitleRow = lodash.compact(['auto', menu && '30px', summary && 'auto', 1]);
61
61
  return /*#__PURE__*/React__default['default'].createElement(Container, containerProps, /*#__PURE__*/React__default['default'].createElement(ContainerWBorder, {
62
62
  withBottomSeparator: withBottomSeparator
@@ -1 +1 @@
1
- {"version":3,"file":"PageHeader.js","sources":["../../../src/v2/PageHeader.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { compact } from 'lodash';\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { PageHeaderTitle } from './components/PageHeaderTitle/PageHeaderTitle';\nimport { PageHeaderEditableTitle } from './components/PageHeaderEditableTitle/PageHeaderEditableTitle';\nimport { PageHeaderSummary } from './components/PageHeaderSummary/PageHeaderSummary';\nimport { PageHeaderMenu } from './components/PageHeaderMenu/PageHeaderMenu';\nimport { PageHeaderToolbar } from './components/PageHeaderToolbar/PageHeaderToolbar';\nimport { PageHeaderBack } from './components/PageHeaderBack/PageHeaderBack';\nimport { cssPrefix } from './components/blocks';\nimport { navProps, defaultProps } from './props';\n\nconst PageHeaderCustomRenderer = styled.div`\n width: auto;\n color: ${(props) => props.theme.colors.brand[800]};\n font-style: italic;\n font-size: 0.8rem;\n`;\n\nconst Container = styled.div`\n width: 100%;\n margin-bottom: 4px;\n`;\nconst ContainerWBorder = styled.div`\n width: 100%;\n padding-bottom: 4px;\n ${(props) =>\n !props.withBottomSeparator\n ? ''\n : `border-bottom: solid 1px ${props.theme.colors.neutral[400]};`}\n`;\nconst DSPageHeaderV2 = ({\n containerProps,\n breadcrumbs,\n pageTitle,\n backarrow,\n summary,\n toolbar,\n menu,\n withBottomSeparator,\n}) => {\n const wrapperRow = ['auto', 1];\n const mainRow = compact([1, '268px']);\n const pageTitleRow = compact(['auto', menu && '30px', summary && 'auto', 1]);\n return (\n <Container {...containerProps}>\n <ContainerWBorder withBottomSeparator={withBottomSeparator}>\n <Grid cols={wrapperRow}>\n <Grid>\n <PageHeaderBack>{backarrow}</PageHeaderBack>\n </Grid>\n <Grid rows={['auto', 'auto']}>\n <Grid className={`${cssPrefix}-page-header-v2-breadcrumb`}>\n {breadcrumbs}\n </Grid>\n <Grid cols={mainRow}>\n <Grid cols={pageTitleRow}>\n {pageTitle}\n {menu && <PageHeaderMenu>{menu}</PageHeaderMenu>}\n {summary}\n <div />\n </Grid>\n <Grid>\n <PageHeaderToolbar>{toolbar}</PageHeaderToolbar>\n </Grid>\n </Grid>\n </Grid>\n </Grid>\n </ContainerWBorder>\n </Container>\n );\n};\n\nDSPageHeaderV2.propTypes = navProps;\nDSPageHeaderV2.defaultProps = defaultProps;\n\nconst DSPageHeaderWithSchema = describe(DSPageHeaderV2);\n\nDSPageHeaderWithSchema.propTypes = navProps;\n\nexport {\n DSPageHeaderV2,\n PageHeaderTitle,\n PageHeaderEditableTitle,\n PageHeaderSummary,\n PageHeaderMenu,\n PageHeaderCustomRenderer,\n DSPageHeaderWithSchema,\n};\n\nexport default DSPageHeaderV2;\n"],"names":["PageHeaderCustomRenderer","styled","div","props","theme","colors","brand","Container","ContainerWBorder","withBottomSeparator","neutral","DSPageHeaderV2","containerProps","breadcrumbs","pageTitle","backarrow","summary","toolbar","menu","wrapperRow","mainRow","compact","pageTitleRow","React","Grid","PageHeaderBack","cssPrefix","PageHeaderMenu","PageHeaderToolbar","propTypes","navProps","defaultProps","DSPageHeaderWithSchema","describe"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;IAeMA,wBAAwB,gBAAGC,0BAAM,CAACC,GAAV;AAAA;AAAA,kEAEnB,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,KAAnB,CAAyB,GAAzB,CAAX;AAAA,CAFmB;AAO9B,IAAMC,SAAS,gBAAGN,0BAAM,CAACC,GAAV;AAAA;AAAA,qCAAf;AAIA,IAAMM,gBAAgB,gBAAGP,0BAAM,CAACC,GAAV;AAAA;AAAA,2CAGlB,UAACC,KAAD;AAAA,SACA,CAACA,KAAK,CAACM,mBAAP,GACI,EADJ,sCAEgCN,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBK,OAAnB,CAA2B,GAA3B,CAFhC,MADA;AAAA,CAHkB,CAAtB;;IAQMC,cAAc,GAAG,SAAjBA,cAAiB,OASjB;AAAA,MARJC,cAQI,QARJA,cAQI;AAAA,MAPJC,WAOI,QAPJA,WAOI;AAAA,MANJC,SAMI,QANJA,SAMI;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJT,mBACI,QADJA,mBACI;AACJ,MAAMU,UAAU,GAAG,CAAC,MAAD,EAAS,CAAT,CAAnB;AACA,MAAMC,OAAO,GAAGC,cAAO,CAAC,CAAC,CAAD,EAAI,OAAJ,CAAD,CAAvB;AACA,MAAMC,YAAY,GAAGD,cAAO,CAAC,CAAC,MAAD,EAASH,IAAI,IAAI,MAAjB,EAAyBF,OAAO,IAAI,MAApC,EAA4C,CAA5C,CAAD,CAA5B;AACA,sBACEO,wCAAC,SAAD,EAAeX,cAAf,eACEW,wCAAC,gBAAD;AAAkB,IAAA,mBAAmB,EAAEd;AAAvC,kBACEc,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAEL;AAAZ,kBACEI,wCAACC,WAAD,qBACED,wCAACE,0DAAD,QAAiBV,SAAjB,CADF,CADF,eAIEQ,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAE,CAAC,MAAD,EAAS,MAAT;AAAZ,kBACED,wCAACC,WAAD;AAAM,IAAA,SAAS,YAAKE,2BAAL;AAAf,KACGb,WADH,CADF,eAIEU,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAEJ;AAAZ,kBACEG,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAEF;AAAZ,KACGR,SADH,EAEGI,IAAI,iBAAIK,wCAACI,0DAAD,QAAiBT,IAAjB,CAFX,EAGGF,OAHH,eAIEO,oDAJF,CADF,eAOEA,wCAACC,WAAD,qBACED,wCAACK,mEAAD,QAAoBX,OAApB,CADF,CAPF,CAJF,CAJF,CADF,CADF,CADF;AA2BD;;AAEDN,cAAc,CAACkB,SAAf,GAA2BC,iBAA3B;AACAnB,cAAc,CAACoB,YAAf,GAA8BA,qBAA9B;IAEMC,sBAAsB,GAAGC,kBAAQ,CAACtB,cAAD;AAEvCqB,sBAAsB,CAACH,SAAvB,GAAmCC,iBAAnC;;;;;;;;;;;"}
1
+ {"version":3,"file":"PageHeader.js","sources":["../../../src/v2/PageHeader.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { compact } from 'lodash';\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { PageHeaderTitle } from './components/PageHeaderTitle/PageHeaderTitle';\nimport { PageHeaderEditableTitle } from './components/PageHeaderEditableTitle/PageHeaderEditableTitle';\nimport { PageHeaderSummary } from './components/PageHeaderSummary/PageHeaderSummary';\nimport { PageHeaderMenu } from './components/PageHeaderMenu/PageHeaderMenu';\nimport { PageHeaderToolbar } from './components/PageHeaderToolbar/PageHeaderToolbar';\nimport { PageHeaderBack } from './components/PageHeaderBack/PageHeaderBack';\nimport { cssPrefix } from './components/blocks';\nimport { navProps, defaultProps } from './props';\n\nconst PageHeaderCustomRenderer = styled.div`\n width: auto;\n color: ${(props) => props.theme.colors.brand[800]};\n font-style: italic;\n font-size: 0.8rem;\n`;\n\nconst Container = styled.div`\n width: 100%;\n margin-bottom: 8px;\n`;\nconst ContainerWBorder = styled.div`\n width: 100%;\n padding: 12px 0 8px 0;\n display: grid;\n align-items: center;\n height: 100%;\n ${(props) => (!props.withBottomSeparator ? '' : `border-bottom: solid 1px ${props.theme.colors.neutral[400]};`)}\n`;\nconst DSPageHeaderV2 = ({\n containerProps,\n breadcrumbs,\n pageTitle,\n backarrow,\n summary,\n toolbar,\n menu,\n withBottomSeparator,\n}) => {\n const wrapperRow = ['auto', 1];\n const mainRow = compact([1, 'auto']);\n const pageTitleRow = compact(['auto', menu && '30px', summary && 'auto', 1]);\n return (\n <Container {...containerProps}>\n <ContainerWBorder withBottomSeparator={withBottomSeparator}>\n <Grid cols={wrapperRow}>\n <Grid>\n <PageHeaderBack>{backarrow}</PageHeaderBack>\n </Grid>\n <Grid rows={['auto', 'auto']}>\n <Grid className={`${cssPrefix}-page-header-v2-breadcrumb`}>{breadcrumbs}</Grid>\n <Grid cols={mainRow}>\n <Grid cols={pageTitleRow}>\n {pageTitle}\n {menu && <PageHeaderMenu>{menu}</PageHeaderMenu>}\n {summary}\n <div />\n </Grid>\n <Grid>\n <PageHeaderToolbar>{toolbar}</PageHeaderToolbar>\n </Grid>\n </Grid>\n </Grid>\n </Grid>\n </ContainerWBorder>\n </Container>\n );\n};\n\nDSPageHeaderV2.propTypes = navProps;\nDSPageHeaderV2.defaultProps = defaultProps;\n\nconst DSPageHeaderWithSchema = describe(DSPageHeaderV2);\n\nDSPageHeaderWithSchema.propTypes = navProps;\n\nexport {\n DSPageHeaderV2,\n PageHeaderTitle,\n PageHeaderEditableTitle,\n PageHeaderSummary,\n PageHeaderMenu,\n PageHeaderCustomRenderer,\n DSPageHeaderWithSchema,\n};\n\nexport default DSPageHeaderV2;\n"],"names":["PageHeaderCustomRenderer","styled","div","props","theme","colors","brand","Container","ContainerWBorder","withBottomSeparator","neutral","DSPageHeaderV2","containerProps","breadcrumbs","pageTitle","backarrow","summary","toolbar","menu","wrapperRow","mainRow","compact","pageTitleRow","React","Grid","PageHeaderBack","cssPrefix","PageHeaderMenu","PageHeaderToolbar","propTypes","navProps","defaultProps","DSPageHeaderWithSchema","describe"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;IAeMA,wBAAwB,gBAAGC,0BAAM,CAACC,GAAV;AAAA;AAAA,kEAEnB,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,KAAnB,CAAyB,GAAzB,CAAX;AAAA,CAFmB;AAO9B,IAAMC,SAAS,gBAAGN,0BAAM,CAACC,GAAV;AAAA;AAAA,qCAAf;AAIA,IAAMM,gBAAgB,gBAAGP,0BAAM,CAACC,GAAV;AAAA;AAAA,yFAMlB,UAACC,KAAD;AAAA,SAAY,CAACA,KAAK,CAACM,mBAAP,GAA6B,EAA7B,sCAA8DN,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBK,OAAnB,CAA2B,GAA3B,CAA9D,MAAZ;AAAA,CANkB,CAAtB;;IAQMC,cAAc,GAAG,SAAjBA,cAAiB,OASjB;AAAA,MARJC,cAQI,QARJA,cAQI;AAAA,MAPJC,WAOI,QAPJA,WAOI;AAAA,MANJC,SAMI,QANJA,SAMI;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJT,mBACI,QADJA,mBACI;AACJ,MAAMU,UAAU,GAAG,CAAC,MAAD,EAAS,CAAT,CAAnB;AACA,MAAMC,OAAO,GAAGC,cAAO,CAAC,CAAC,CAAD,EAAI,MAAJ,CAAD,CAAvB;AACA,MAAMC,YAAY,GAAGD,cAAO,CAAC,CAAC,MAAD,EAASH,IAAI,IAAI,MAAjB,EAAyBF,OAAO,IAAI,MAApC,EAA4C,CAA5C,CAAD,CAA5B;AACA,sBACEO,wCAAC,SAAD,EAAeX,cAAf,eACEW,wCAAC,gBAAD;AAAkB,IAAA,mBAAmB,EAAEd;AAAvC,kBACEc,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAEL;AAAZ,kBACEI,wCAACC,WAAD,qBACED,wCAACE,0DAAD,QAAiBV,SAAjB,CADF,CADF,eAIEQ,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAE,CAAC,MAAD,EAAS,MAAT;AAAZ,kBACED,wCAACC,WAAD;AAAM,IAAA,SAAS,YAAKE,2BAAL;AAAf,KAA4Db,WAA5D,CADF,eAEEU,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAEJ;AAAZ,kBACEG,wCAACC,WAAD;AAAM,IAAA,IAAI,EAAEF;AAAZ,KACGR,SADH,EAEGI,IAAI,iBAAIK,wCAACI,0DAAD,QAAiBT,IAAjB,CAFX,EAGGF,OAHH,eAIEO,oDAJF,CADF,eAOEA,wCAACC,WAAD,qBACED,wCAACK,mEAAD,QAAoBX,OAApB,CADF,CAPF,CAFF,CAJF,CADF,CADF,CADF;AAyBD;;AAEDN,cAAc,CAACkB,SAAf,GAA2BC,iBAA3B;AACAnB,cAAc,CAACoB,YAAf,GAA8BA,qBAA9B;IAEMC,sBAAsB,GAAGC,kBAAQ,CAACtB,cAAD;AAEvCqB,sBAAsB,CAACH,SAAvB,GAAmCC,iBAAnC;;;;;;;;;;;"}
@@ -69,7 +69,13 @@ var PageHeaderEditableTitle = function PageHeaderEditableTitle(_ref) {
69
69
  width = _useMeasure.width;
70
70
 
71
71
  return /*#__PURE__*/React__default['default'].createElement(EditableContainer, {
72
- className: hovered || editing ? 'editable-title-component' : ''
72
+ className: hovered || editing ? 'editable-title-component' : '',
73
+ onMouseEnter: function onMouseEnter() {
74
+ return setHovered(true);
75
+ },
76
+ onMouseLeave: function onMouseLeave() {
77
+ return setHovered(false);
78
+ }
73
79
  }, (hovered || editing) && /*#__PURE__*/React__default['default'].createElement(v2_components_blocks.EditableTitleComponent, _extends__default['default']({}, rest, {
74
80
  onBlur: function onBlur(e) {
75
81
  setEditing(false);
@@ -97,10 +103,7 @@ var PageHeaderEditableTitle = function PageHeaderEditableTitle(_ref) {
97
103
  },
98
104
  value: titleValue
99
105
  })), /*#__PURE__*/React__default['default'].createElement("div", {
100
- ref: titleRef,
101
- onMouseEnter: function onMouseEnter() {
102
- return setHovered(true);
103
- }
106
+ ref: titleRef
104
107
  }, /*#__PURE__*/React__default['default'].createElement(v2_components_PageHeaderTitle_PageHeaderTitle.PageHeaderTitle, {
105
108
  showMarker: showMarker && !hovered && !editing
106
109
  }, titleValue)));
@@ -1 +1 @@
1
- {"version":3,"file":"PageHeaderEditableTitle.js","sources":["../../../../../src/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { noop } from 'lodash';\nimport styled from 'styled-components';\nimport { PropTypes, describe } from 'react-desc';\nimport { useMeasure } from '@elliemae/ds-utilities/hooks';\nimport useDerivedStateFromProps from '@elliemae/ds-utilities/hooks/useDerivedStateFromProps';\nimport { EditableTitleComponent } from '../blocks';\nimport { PageHeaderTitle } from '../PageHeaderTitle/PageHeaderTitle';\n\nconst EditableContainer = styled.div`\n height: 32px;\n position: relative;\n overflow: hidden;\n`;\n\nexport const PageHeaderEditableTitle = ({\n children: value,\n editing: editingProp = false,\n onBlur = noop,\n onChange = noop,\n onFocus = noop,\n onMouseOut = noop,\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 return (\n <EditableContainer\n className={hovered || editing ? 'editable-title-component' : ''}\n >\n {(hovered || editing) && (\n <EditableTitleComponent\n {...rest}\n onBlur={(e) => {\n setEditing(false);\n onBlur(e);\n }}\n onChange={(e) => {\n setTitleValue(e.target.value);\n onChange(e);\n }}\n onFocus={(e) => {\n setEditing(true);\n onFocus(e);\n }}\n onMouseOut={(e) => {\n setHovered(false);\n onMouseOut(e);\n }}\n style={{ width: width - 2, minWidth: '260px' }}\n value={titleValue}\n />\n )}\n <div ref={titleRef} onMouseEnter={() => setHovered(true)}>\n <PageHeaderTitle showMarker={showMarker && !hovered && !editing}>\n {titleValue}\n </PageHeaderTitle>\n </div>\n </EditableContainer>\n );\n};\n\nconst props = {\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 /** blur callback */\n onBlur: PropTypes.func.description('blur callback'),\n /** on change handler */\n onChange: PropTypes.func.description('on change handler'),\n /** on focus handler */\n onFocus: PropTypes.func.description('on focus handler'),\n /** mouse out of component handler */\n onMouseOut: PropTypes.func.description('mouse out of component handler'),\n};\n\nPageHeaderEditableTitle.propTypes = props;\n\nconst DSPageHeaderEditableTitleWithSchema = describe(PageHeaderEditableTitle);\n\nDSPageHeaderEditableTitleWithSchema.propTypes = props;\n\nexport default PageHeaderEditableTitle;\n\nexport { DSPageHeaderEditableTitleWithSchema };\n"],"names":["EditableContainer","styled","div","PageHeaderEditableTitle","value","children","editing","editingProp","onBlur","noop","onChange","onFocus","onMouseOut","showMarker","rest","useState","titleValue","setTitleValue","hovered","setHovered","useDerivedStateFromProps","setEditing","titleRef","useRef","useMeasure","width","React","EditableTitleComponent","e","target","minWidth","PageHeaderTitle","props","PropTypes","string","description","bool","func","propTypes","DSPageHeaderEditableTitleWithSchema","describe"],"mappings":"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"}
1
+ {"version":3,"file":"PageHeaderEditableTitle.js","sources":["../../../../../src/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { noop } from 'lodash';\nimport styled from 'styled-components';\nimport { PropTypes, describe } from 'react-desc';\nimport { useMeasure } from '@elliemae/ds-utilities/hooks';\nimport useDerivedStateFromProps from '@elliemae/ds-utilities/hooks/useDerivedStateFromProps';\nimport { EditableTitleComponent } from '../blocks';\nimport { PageHeaderTitle } from '../PageHeaderTitle/PageHeaderTitle';\n\nconst EditableContainer = styled.div`\n height: 32px;\n position: relative;\n overflow: hidden;\n`;\n\nexport const PageHeaderEditableTitle = ({\n children: value,\n editing: editingProp = false,\n onBlur = noop,\n onChange = noop,\n onFocus = noop,\n onMouseOut = noop,\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 return (\n <EditableContainer\n className={hovered || editing ? 'editable-title-component' : ''}\n onMouseEnter={() => setHovered(true)}\n onMouseLeave={() => setHovered(false)}\n >\n {(hovered || editing) && (\n <EditableTitleComponent\n {...rest}\n onBlur={(e) => {\n setEditing(false);\n onBlur(e);\n }}\n onChange={(e) => {\n setTitleValue(e.target.value);\n onChange(e);\n }}\n onFocus={(e) => {\n setEditing(true);\n onFocus(e);\n }}\n onMouseOut={(e) => {\n setHovered(false);\n onMouseOut(e);\n }}\n style={{ width: width - 2, minWidth: '260px' }}\n value={titleValue}\n />\n )}\n <div ref={titleRef}>\n <PageHeaderTitle showMarker={showMarker && !hovered && !editing}>{titleValue}</PageHeaderTitle>\n </div>\n </EditableContainer>\n );\n};\n\nconst props = {\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 /** blur callback */\n onBlur: PropTypes.func.description('blur callback'),\n /** on change handler */\n onChange: PropTypes.func.description('on change handler'),\n /** on focus handler */\n onFocus: PropTypes.func.description('on focus handler'),\n /** mouse out of component handler */\n onMouseOut: PropTypes.func.description('mouse out of component handler'),\n};\n\nPageHeaderEditableTitle.propTypes = props;\n\nconst DSPageHeaderEditableTitleWithSchema = describe(PageHeaderEditableTitle);\n\nDSPageHeaderEditableTitleWithSchema.propTypes = props;\n\nexport default PageHeaderEditableTitle;\n\nexport { DSPageHeaderEditableTitleWithSchema };\n"],"names":["EditableContainer","styled","div","PageHeaderEditableTitle","value","children","editing","editingProp","onBlur","noop","onChange","onFocus","onMouseOut","showMarker","rest","useState","titleValue","setTitleValue","hovered","setHovered","useDerivedStateFromProps","setEditing","titleRef","useRef","useMeasure","width","React","EditableTitleComponent","e","target","minWidth","PageHeaderTitle","props","PropTypes","string","description","bool","func","propTypes","DSPageHeaderEditableTitleWithSchema","describe"],"mappings":"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"}
@@ -16,7 +16,6 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
16
16
 
17
17
  var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
18
18
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
19
- var DSTruncatedTooltipText__default = /*#__PURE__*/_interopDefaultLegacy(DSTruncatedTooltipText);
20
19
  var RequiredMark__default = /*#__PURE__*/_interopDefaultLegacy(RequiredMark);
21
20
 
22
21
  var _excluded = ["children", "showMarker"];
@@ -27,7 +26,7 @@ var PageHeaderTitle = function PageHeaderTitle(_ref) {
27
26
  showMarker = _ref$showMarker === void 0 ? false : _ref$showMarker,
28
27
  rest = _objectWithoutProperties__default['default'](_ref, _excluded);
29
28
 
30
- return /*#__PURE__*/React__default['default'].createElement(v2_components_blocks.PageHeaderTitleWrapper, rest, /*#__PURE__*/React__default['default'].createElement(DSTruncatedTooltipText__default['default'], {
29
+ return /*#__PURE__*/React__default['default'].createElement(v2_components_blocks.PageHeaderTitleWrapper, rest, /*#__PURE__*/React__default['default'].createElement(DSTruncatedTooltipText.SimpleTruncatedTooltipText, {
31
30
  value: children
32
31
  }), showMarker && /*#__PURE__*/React__default['default'].createElement(RequiredMark__default['default'], {
33
32
  required: true
@@ -1 +1 @@
1
- {"version":3,"file":"PageHeaderTitle.js","sources":["../../../../../src/v2/components/PageHeaderTitle/PageHeaderTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport DSTruncatedTooltipText from '@elliemae/ds-truncated-tooltip-text';\nimport RequiredMark from '@elliemae/ds-form/RequiredMark';\nimport { PageHeaderTitleWrapper } from '../blocks';\n\nconst PageHeaderTitle = ({ children, showMarker = false, ...rest }) => (\n <PageHeaderTitleWrapper {...rest}>\n <DSTruncatedTooltipText value={children} />\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;\n\nconst DSPageHeaderTitleWithSchema = describe(PageHeaderTitle);\n\nDSPageHeaderTitleWithSchema.propTypes = props;\n\nexport { PageHeaderTitle, DSPageHeaderTitleWithSchema };\n"],"names":["PageHeaderTitle","children","showMarker","rest","React","PageHeaderTitleWrapper","DSTruncatedTooltipText","RequiredMark","props","PropTypes","string","description","bool","propTypes","DSPageHeaderTitleWithSchema","describe"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;IAMMA,eAAe,GAAG,SAAlBA,eAAkB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,6BAAaC,UAAb;AAAA,MAAaA,UAAb,gCAA0B,KAA1B;AAAA,MAAoCC,IAApC;;AAAA,sBACtBC,wCAACC,2CAAD,EAA4BF,IAA5B,eACEC,wCAACE,0CAAD;AAAwB,IAAA,KAAK,EAAEL;AAA/B,IADF,EAEGC,UAAU,iBAAIE,wCAACG,gCAAD;AAAc,IAAA,QAAQ;AAAtB,IAFjB,CADsB;AAAA;;AAOxB,IAAMC,KAAK,GAAG;AACZ;AACAP,EAAAA,QAAQ,EAAEQ,mBAAS,CAACC,MAAV,CAAiBC,WAAjB,CAA6B,0BAA7B,CAFE;;AAGZ;AACAT,EAAAA,UAAU,EAAEO,mBAAS,CAACG,IAAV,CAAeD,WAAf,CAA2B,oBAA3B;AAJA,CAAd;AAOAX,eAAe,CAACa,SAAhB,GAA4BL,KAA5B;IAEMM,2BAA2B,GAAGC,kBAAQ,CAACf,eAAD;AAE5Cc,2BAA2B,CAACD,SAA5B,GAAwCL,KAAxC;;;;;"}
1
+ {"version":3,"file":"PageHeaderTitle.js","sources":["../../../../../src/v2/components/PageHeaderTitle/PageHeaderTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport RequiredMark from '@elliemae/ds-form/RequiredMark';\nimport { PageHeaderTitleWrapper } from '../blocks';\n\nconst PageHeaderTitle = ({ children, showMarker = false, ...rest }) => (\n <PageHeaderTitleWrapper {...rest}>\n <SimpleTruncatedTooltipText value={children} />\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;\n\nconst DSPageHeaderTitleWithSchema = describe(PageHeaderTitle);\n\nDSPageHeaderTitleWithSchema.propTypes = props;\n\nexport { PageHeaderTitle, DSPageHeaderTitleWithSchema };\n"],"names":["PageHeaderTitle","children","showMarker","rest","React","PageHeaderTitleWrapper","SimpleTruncatedTooltipText","RequiredMark","props","PropTypes","string","description","bool","propTypes","DSPageHeaderTitleWithSchema","describe"],"mappings":";;;;;;;;;;;;;;;;;;;;;;IAMMA,eAAe,GAAG,SAAlBA,eAAkB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,6BAAaC,UAAb;AAAA,MAAaA,UAAb,gCAA0B,KAA1B;AAAA,MAAoCC,IAApC;;AAAA,sBACtBC,wCAACC,2CAAD,EAA4BF,IAA5B,eACEC,wCAACE,iDAAD;AAA4B,IAAA,KAAK,EAAEL;AAAnC,IADF,EAEGC,UAAU,iBAAIE,wCAACG,gCAAD;AAAc,IAAA,QAAQ;AAAtB,IAFjB,CADsB;AAAA;;AAOxB,IAAMC,KAAK,GAAG;AACZ;AACAP,EAAAA,QAAQ,EAAEQ,mBAAS,CAACC,MAAV,CAAiBC,WAAjB,CAA6B,0BAA7B,CAFE;;AAGZ;AACAT,EAAAA,UAAU,EAAEO,mBAAS,CAACG,IAAV,CAAeD,WAAf,CAA2B,oBAA3B;AAJA,CAAd;AAOAX,eAAe,CAACa,SAAhB,GAA4BL,KAA5B;IAEMM,2BAA2B,GAAGC,kBAAQ,CAACf,eAAD;AAE5Cc,2BAA2B,CAACD,SAA5B,GAAwCL,KAAxC;;;;;"}
@@ -31,10 +31,10 @@ var PageHeaderCustomRenderer = /*#__PURE__*/styled.div.withConfig({
31
31
  });
32
32
  var Container = /*#__PURE__*/styled.div.withConfig({
33
33
  componentId: "sc-ps4m9w-1"
34
- })(["width:100%;margin-bottom:4px;"]);
34
+ })(["width:100%;margin-bottom:8px;"]);
35
35
  var ContainerWBorder = /*#__PURE__*/styled.div.withConfig({
36
36
  componentId: "sc-ps4m9w-2"
37
- })(["width:100%;padding-bottom:4px;", ""], function (props) {
37
+ })(["width:100%;padding:12px 0 8px 0;display:grid;align-items:center;height:100%;", ""], function (props) {
38
38
  return !props.withBottomSeparator ? '' : "border-bottom: solid 1px ".concat(props.theme.colors.neutral[400], ";");
39
39
  });
40
40
 
@@ -48,7 +48,7 @@ var DSPageHeaderV2 = function DSPageHeaderV2(_ref) {
48
48
  menu = _ref.menu,
49
49
  withBottomSeparator = _ref.withBottomSeparator;
50
50
  var wrapperRow = ['auto', 1];
51
- var mainRow = compact([1, '268px']);
51
+ var mainRow = compact([1, 'auto']);
52
52
  var pageTitleRow = compact(['auto', menu && '30px', summary && 'auto', 1]);
53
53
  return /*#__PURE__*/React.createElement(Container, containerProps, /*#__PURE__*/React.createElement(ContainerWBorder, {
54
54
  withBottomSeparator: withBottomSeparator
@@ -1 +1 @@
1
- {"version":3,"file":"PageHeader.js","sources":["../../../src/v2/PageHeader.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { compact } from 'lodash';\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { PageHeaderTitle } from './components/PageHeaderTitle/PageHeaderTitle';\nimport { PageHeaderEditableTitle } from './components/PageHeaderEditableTitle/PageHeaderEditableTitle';\nimport { PageHeaderSummary } from './components/PageHeaderSummary/PageHeaderSummary';\nimport { PageHeaderMenu } from './components/PageHeaderMenu/PageHeaderMenu';\nimport { PageHeaderToolbar } from './components/PageHeaderToolbar/PageHeaderToolbar';\nimport { PageHeaderBack } from './components/PageHeaderBack/PageHeaderBack';\nimport { cssPrefix } from './components/blocks';\nimport { navProps, defaultProps } from './props';\n\nconst PageHeaderCustomRenderer = styled.div`\n width: auto;\n color: ${(props) => props.theme.colors.brand[800]};\n font-style: italic;\n font-size: 0.8rem;\n`;\n\nconst Container = styled.div`\n width: 100%;\n margin-bottom: 4px;\n`;\nconst ContainerWBorder = styled.div`\n width: 100%;\n padding-bottom: 4px;\n ${(props) =>\n !props.withBottomSeparator\n ? ''\n : `border-bottom: solid 1px ${props.theme.colors.neutral[400]};`}\n`;\nconst DSPageHeaderV2 = ({\n containerProps,\n breadcrumbs,\n pageTitle,\n backarrow,\n summary,\n toolbar,\n menu,\n withBottomSeparator,\n}) => {\n const wrapperRow = ['auto', 1];\n const mainRow = compact([1, '268px']);\n const pageTitleRow = compact(['auto', menu && '30px', summary && 'auto', 1]);\n return (\n <Container {...containerProps}>\n <ContainerWBorder withBottomSeparator={withBottomSeparator}>\n <Grid cols={wrapperRow}>\n <Grid>\n <PageHeaderBack>{backarrow}</PageHeaderBack>\n </Grid>\n <Grid rows={['auto', 'auto']}>\n <Grid className={`${cssPrefix}-page-header-v2-breadcrumb`}>\n {breadcrumbs}\n </Grid>\n <Grid cols={mainRow}>\n <Grid cols={pageTitleRow}>\n {pageTitle}\n {menu && <PageHeaderMenu>{menu}</PageHeaderMenu>}\n {summary}\n <div />\n </Grid>\n <Grid>\n <PageHeaderToolbar>{toolbar}</PageHeaderToolbar>\n </Grid>\n </Grid>\n </Grid>\n </Grid>\n </ContainerWBorder>\n </Container>\n );\n};\n\nDSPageHeaderV2.propTypes = navProps;\nDSPageHeaderV2.defaultProps = defaultProps;\n\nconst DSPageHeaderWithSchema = describe(DSPageHeaderV2);\n\nDSPageHeaderWithSchema.propTypes = navProps;\n\nexport {\n DSPageHeaderV2,\n PageHeaderTitle,\n PageHeaderEditableTitle,\n PageHeaderSummary,\n PageHeaderMenu,\n PageHeaderCustomRenderer,\n DSPageHeaderWithSchema,\n};\n\nexport default DSPageHeaderV2;\n"],"names":["PageHeaderCustomRenderer","styled","div","props","theme","colors","brand","Container","ContainerWBorder","withBottomSeparator","neutral","DSPageHeaderV2","containerProps","breadcrumbs","pageTitle","backarrow","summary","toolbar","menu","wrapperRow","mainRow","compact","pageTitleRow","cssPrefix","propTypes","navProps","defaultProps","DSPageHeaderWithSchema","describe"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;IAeMA,wBAAwB,gBAAGC,MAAM,CAACC,GAAV;AAAA;AAAA,kEAEnB,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,KAAnB,CAAyB,GAAzB,CAAX;AAAA,CAFmB;AAO9B,IAAMC,SAAS,gBAAGN,MAAM,CAACC,GAAV;AAAA;AAAA,qCAAf;AAIA,IAAMM,gBAAgB,gBAAGP,MAAM,CAACC,GAAV;AAAA;AAAA,2CAGlB,UAACC,KAAD;AAAA,SACA,CAACA,KAAK,CAACM,mBAAP,GACI,EADJ,sCAEgCN,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBK,OAAnB,CAA2B,GAA3B,CAFhC,MADA;AAAA,CAHkB,CAAtB;;IAQMC,cAAc,GAAG,SAAjBA,cAAiB,OASjB;AAAA,MARJC,cAQI,QARJA,cAQI;AAAA,MAPJC,WAOI,QAPJA,WAOI;AAAA,MANJC,SAMI,QANJA,SAMI;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJT,mBACI,QADJA,mBACI;AACJ,MAAMU,UAAU,GAAG,CAAC,MAAD,EAAS,CAAT,CAAnB;AACA,MAAMC,OAAO,GAAGC,OAAO,CAAC,CAAC,CAAD,EAAI,OAAJ,CAAD,CAAvB;AACA,MAAMC,YAAY,GAAGD,OAAO,CAAC,CAAC,MAAD,EAASH,IAAI,IAAI,MAAjB,EAAyBF,OAAO,IAAI,MAApC,EAA4C,CAA5C,CAAD,CAA5B;AACA,sBACE,oBAAC,SAAD,EAAeJ,cAAf,eACE,oBAAC,gBAAD;AAAkB,IAAA,mBAAmB,EAAEH;AAAvC,kBACE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEU;AAAZ,kBACE,oBAAC,IAAD,qBACE,oBAAC,cAAD,QAAiBJ,SAAjB,CADF,CADF,eAIE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAE,CAAC,MAAD,EAAS,MAAT;AAAZ,kBACE,oBAAC,IAAD;AAAM,IAAA,SAAS,YAAKQ,SAAL;AAAf,KACGV,WADH,CADF,eAIE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEO;AAAZ,kBACE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEE;AAAZ,KACGR,SADH,EAEGI,IAAI,iBAAI,oBAAC,cAAD,QAAiBA,IAAjB,CAFX,EAGGF,OAHH,eAIE,gCAJF,CADF,eAOE,oBAAC,IAAD,qBACE,oBAAC,iBAAD,QAAoBC,OAApB,CADF,CAPF,CAJF,CAJF,CADF,CADF,CADF;AA2BD;;AAEDN,cAAc,CAACa,SAAf,GAA2BC,QAA3B;AACAd,cAAc,CAACe,YAAf,GAA8BA,YAA9B;IAEMC,sBAAsB,GAAGC,QAAQ,CAACjB,cAAD;AAEvCgB,sBAAsB,CAACH,SAAvB,GAAmCC,QAAnC;;;;"}
1
+ {"version":3,"file":"PageHeader.js","sources":["../../../src/v2/PageHeader.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { compact } from 'lodash';\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { PageHeaderTitle } from './components/PageHeaderTitle/PageHeaderTitle';\nimport { PageHeaderEditableTitle } from './components/PageHeaderEditableTitle/PageHeaderEditableTitle';\nimport { PageHeaderSummary } from './components/PageHeaderSummary/PageHeaderSummary';\nimport { PageHeaderMenu } from './components/PageHeaderMenu/PageHeaderMenu';\nimport { PageHeaderToolbar } from './components/PageHeaderToolbar/PageHeaderToolbar';\nimport { PageHeaderBack } from './components/PageHeaderBack/PageHeaderBack';\nimport { cssPrefix } from './components/blocks';\nimport { navProps, defaultProps } from './props';\n\nconst PageHeaderCustomRenderer = styled.div`\n width: auto;\n color: ${(props) => props.theme.colors.brand[800]};\n font-style: italic;\n font-size: 0.8rem;\n`;\n\nconst Container = styled.div`\n width: 100%;\n margin-bottom: 8px;\n`;\nconst ContainerWBorder = styled.div`\n width: 100%;\n padding: 12px 0 8px 0;\n display: grid;\n align-items: center;\n height: 100%;\n ${(props) => (!props.withBottomSeparator ? '' : `border-bottom: solid 1px ${props.theme.colors.neutral[400]};`)}\n`;\nconst DSPageHeaderV2 = ({\n containerProps,\n breadcrumbs,\n pageTitle,\n backarrow,\n summary,\n toolbar,\n menu,\n withBottomSeparator,\n}) => {\n const wrapperRow = ['auto', 1];\n const mainRow = compact([1, 'auto']);\n const pageTitleRow = compact(['auto', menu && '30px', summary && 'auto', 1]);\n return (\n <Container {...containerProps}>\n <ContainerWBorder withBottomSeparator={withBottomSeparator}>\n <Grid cols={wrapperRow}>\n <Grid>\n <PageHeaderBack>{backarrow}</PageHeaderBack>\n </Grid>\n <Grid rows={['auto', 'auto']}>\n <Grid className={`${cssPrefix}-page-header-v2-breadcrumb`}>{breadcrumbs}</Grid>\n <Grid cols={mainRow}>\n <Grid cols={pageTitleRow}>\n {pageTitle}\n {menu && <PageHeaderMenu>{menu}</PageHeaderMenu>}\n {summary}\n <div />\n </Grid>\n <Grid>\n <PageHeaderToolbar>{toolbar}</PageHeaderToolbar>\n </Grid>\n </Grid>\n </Grid>\n </Grid>\n </ContainerWBorder>\n </Container>\n );\n};\n\nDSPageHeaderV2.propTypes = navProps;\nDSPageHeaderV2.defaultProps = defaultProps;\n\nconst DSPageHeaderWithSchema = describe(DSPageHeaderV2);\n\nDSPageHeaderWithSchema.propTypes = navProps;\n\nexport {\n DSPageHeaderV2,\n PageHeaderTitle,\n PageHeaderEditableTitle,\n PageHeaderSummary,\n PageHeaderMenu,\n PageHeaderCustomRenderer,\n DSPageHeaderWithSchema,\n};\n\nexport default DSPageHeaderV2;\n"],"names":["PageHeaderCustomRenderer","styled","div","props","theme","colors","brand","Container","ContainerWBorder","withBottomSeparator","neutral","DSPageHeaderV2","containerProps","breadcrumbs","pageTitle","backarrow","summary","toolbar","menu","wrapperRow","mainRow","compact","pageTitleRow","cssPrefix","propTypes","navProps","defaultProps","DSPageHeaderWithSchema","describe"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;IAeMA,wBAAwB,gBAAGC,MAAM,CAACC,GAAV;AAAA;AAAA,kEAEnB,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,KAAnB,CAAyB,GAAzB,CAAX;AAAA,CAFmB;AAO9B,IAAMC,SAAS,gBAAGN,MAAM,CAACC,GAAV;AAAA;AAAA,qCAAf;AAIA,IAAMM,gBAAgB,gBAAGP,MAAM,CAACC,GAAV;AAAA;AAAA,yFAMlB,UAACC,KAAD;AAAA,SAAY,CAACA,KAAK,CAACM,mBAAP,GAA6B,EAA7B,sCAA8DN,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBK,OAAnB,CAA2B,GAA3B,CAA9D,MAAZ;AAAA,CANkB,CAAtB;;IAQMC,cAAc,GAAG,SAAjBA,cAAiB,OASjB;AAAA,MARJC,cAQI,QARJA,cAQI;AAAA,MAPJC,WAOI,QAPJA,WAOI;AAAA,MANJC,SAMI,QANJA,SAMI;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJT,mBACI,QADJA,mBACI;AACJ,MAAMU,UAAU,GAAG,CAAC,MAAD,EAAS,CAAT,CAAnB;AACA,MAAMC,OAAO,GAAGC,OAAO,CAAC,CAAC,CAAD,EAAI,MAAJ,CAAD,CAAvB;AACA,MAAMC,YAAY,GAAGD,OAAO,CAAC,CAAC,MAAD,EAASH,IAAI,IAAI,MAAjB,EAAyBF,OAAO,IAAI,MAApC,EAA4C,CAA5C,CAAD,CAA5B;AACA,sBACE,oBAAC,SAAD,EAAeJ,cAAf,eACE,oBAAC,gBAAD;AAAkB,IAAA,mBAAmB,EAAEH;AAAvC,kBACE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEU;AAAZ,kBACE,oBAAC,IAAD,qBACE,oBAAC,cAAD,QAAiBJ,SAAjB,CADF,CADF,eAIE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAE,CAAC,MAAD,EAAS,MAAT;AAAZ,kBACE,oBAAC,IAAD;AAAM,IAAA,SAAS,YAAKQ,SAAL;AAAf,KAA4DV,WAA5D,CADF,eAEE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEO;AAAZ,kBACE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEE;AAAZ,KACGR,SADH,EAEGI,IAAI,iBAAI,oBAAC,cAAD,QAAiBA,IAAjB,CAFX,EAGGF,OAHH,eAIE,gCAJF,CADF,eAOE,oBAAC,IAAD,qBACE,oBAAC,iBAAD,QAAoBC,OAApB,CADF,CAPF,CAFF,CAJF,CADF,CADF,CADF;AAyBD;;AAEDN,cAAc,CAACa,SAAf,GAA2BC,QAA3B;AACAd,cAAc,CAACe,YAAf,GAA8BA,YAA9B;IAEMC,sBAAsB,GAAGC,QAAQ,CAACjB,cAAD;AAEvCgB,sBAAsB,CAACH,SAAvB,GAAmCC,QAAnC;;;;"}
@@ -56,7 +56,13 @@ var PageHeaderEditableTitle = function PageHeaderEditableTitle(_ref) {
56
56
  width = _useMeasure.width;
57
57
 
58
58
  return /*#__PURE__*/React.createElement(EditableContainer, {
59
- className: hovered || editing ? 'editable-title-component' : ''
59
+ className: hovered || editing ? 'editable-title-component' : '',
60
+ onMouseEnter: function onMouseEnter() {
61
+ return setHovered(true);
62
+ },
63
+ onMouseLeave: function onMouseLeave() {
64
+ return setHovered(false);
65
+ }
60
66
  }, (hovered || editing) && /*#__PURE__*/React.createElement(EditableTitleComponent, _extends({}, rest, {
61
67
  onBlur: function onBlur(e) {
62
68
  setEditing(false);
@@ -84,10 +90,7 @@ var PageHeaderEditableTitle = function PageHeaderEditableTitle(_ref) {
84
90
  },
85
91
  value: titleValue
86
92
  })), /*#__PURE__*/React.createElement("div", {
87
- ref: titleRef,
88
- onMouseEnter: function onMouseEnter() {
89
- return setHovered(true);
90
- }
93
+ ref: titleRef
91
94
  }, /*#__PURE__*/React.createElement(PageHeaderTitle, {
92
95
  showMarker: showMarker && !hovered && !editing
93
96
  }, titleValue)));
@@ -1 +1 @@
1
- {"version":3,"file":"PageHeaderEditableTitle.js","sources":["../../../../../src/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { noop } from 'lodash';\nimport styled from 'styled-components';\nimport { PropTypes, describe } from 'react-desc';\nimport { useMeasure } from '@elliemae/ds-utilities/hooks';\nimport useDerivedStateFromProps from '@elliemae/ds-utilities/hooks/useDerivedStateFromProps';\nimport { EditableTitleComponent } from '../blocks';\nimport { PageHeaderTitle } from '../PageHeaderTitle/PageHeaderTitle';\n\nconst EditableContainer = styled.div`\n height: 32px;\n position: relative;\n overflow: hidden;\n`;\n\nexport const PageHeaderEditableTitle = ({\n children: value,\n editing: editingProp = false,\n onBlur = noop,\n onChange = noop,\n onFocus = noop,\n onMouseOut = noop,\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 return (\n <EditableContainer\n className={hovered || editing ? 'editable-title-component' : ''}\n >\n {(hovered || editing) && (\n <EditableTitleComponent\n {...rest}\n onBlur={(e) => {\n setEditing(false);\n onBlur(e);\n }}\n onChange={(e) => {\n setTitleValue(e.target.value);\n onChange(e);\n }}\n onFocus={(e) => {\n setEditing(true);\n onFocus(e);\n }}\n onMouseOut={(e) => {\n setHovered(false);\n onMouseOut(e);\n }}\n style={{ width: width - 2, minWidth: '260px' }}\n value={titleValue}\n />\n )}\n <div ref={titleRef} onMouseEnter={() => setHovered(true)}>\n <PageHeaderTitle showMarker={showMarker && !hovered && !editing}>\n {titleValue}\n </PageHeaderTitle>\n </div>\n </EditableContainer>\n );\n};\n\nconst props = {\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 /** blur callback */\n onBlur: PropTypes.func.description('blur callback'),\n /** on change handler */\n onChange: PropTypes.func.description('on change handler'),\n /** on focus handler */\n onFocus: PropTypes.func.description('on focus handler'),\n /** mouse out of component handler */\n onMouseOut: PropTypes.func.description('mouse out of component handler'),\n};\n\nPageHeaderEditableTitle.propTypes = props;\n\nconst DSPageHeaderEditableTitleWithSchema = describe(PageHeaderEditableTitle);\n\nDSPageHeaderEditableTitleWithSchema.propTypes = props;\n\nexport default PageHeaderEditableTitle;\n\nexport { DSPageHeaderEditableTitleWithSchema };\n"],"names":["EditableContainer","styled","div","PageHeaderEditableTitle","value","children","editing","editingProp","onBlur","noop","onChange","onFocus","onMouseOut","showMarker","rest","useState","titleValue","setTitleValue","hovered","setHovered","useDerivedStateFromProps","setEditing","titleRef","useRef","useMeasure","width","e","target","minWidth","props","PropTypes","string","description","bool","func","propTypes","DSPageHeaderEditableTitleWithSchema","describe"],"mappings":"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"}
1
+ {"version":3,"file":"PageHeaderEditableTitle.js","sources":["../../../../../src/v2/components/PageHeaderEditableTitle/PageHeaderEditableTitle.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { noop } from 'lodash';\nimport styled from 'styled-components';\nimport { PropTypes, describe } from 'react-desc';\nimport { useMeasure } from '@elliemae/ds-utilities/hooks';\nimport useDerivedStateFromProps from '@elliemae/ds-utilities/hooks/useDerivedStateFromProps';\nimport { EditableTitleComponent } from '../blocks';\nimport { PageHeaderTitle } from '../PageHeaderTitle/PageHeaderTitle';\n\nconst EditableContainer = styled.div`\n height: 32px;\n position: relative;\n overflow: hidden;\n`;\n\nexport const PageHeaderEditableTitle = ({\n children: value,\n editing: editingProp = false,\n onBlur = noop,\n onChange = noop,\n onFocus = noop,\n onMouseOut = noop,\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 return (\n <EditableContainer\n className={hovered || editing ? 'editable-title-component' : ''}\n onMouseEnter={() => setHovered(true)}\n onMouseLeave={() => setHovered(false)}\n >\n {(hovered || editing) && (\n <EditableTitleComponent\n {...rest}\n onBlur={(e) => {\n setEditing(false);\n onBlur(e);\n }}\n onChange={(e) => {\n setTitleValue(e.target.value);\n onChange(e);\n }}\n onFocus={(e) => {\n setEditing(true);\n onFocus(e);\n }}\n onMouseOut={(e) => {\n setHovered(false);\n onMouseOut(e);\n }}\n style={{ width: width - 2, minWidth: '260px' }}\n value={titleValue}\n />\n )}\n <div ref={titleRef}>\n <PageHeaderTitle showMarker={showMarker && !hovered && !editing}>{titleValue}</PageHeaderTitle>\n </div>\n </EditableContainer>\n );\n};\n\nconst props = {\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 /** blur callback */\n onBlur: PropTypes.func.description('blur callback'),\n /** on change handler */\n onChange: PropTypes.func.description('on change handler'),\n /** on focus handler */\n onFocus: PropTypes.func.description('on focus handler'),\n /** mouse out of component handler */\n onMouseOut: PropTypes.func.description('mouse out of component handler'),\n};\n\nPageHeaderEditableTitle.propTypes = props;\n\nconst DSPageHeaderEditableTitleWithSchema = describe(PageHeaderEditableTitle);\n\nDSPageHeaderEditableTitleWithSchema.propTypes = props;\n\nexport default PageHeaderEditableTitle;\n\nexport { DSPageHeaderEditableTitleWithSchema };\n"],"names":["EditableContainer","styled","div","PageHeaderEditableTitle","value","children","editing","editingProp","onBlur","noop","onChange","onFocus","onMouseOut","showMarker","rest","useState","titleValue","setTitleValue","hovered","setHovered","useDerivedStateFromProps","setEditing","titleRef","useRef","useMeasure","width","e","target","minWidth","props","PropTypes","string","description","bool","func","propTypes","DSPageHeaderEditableTitleWithSchema","describe"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
1
  import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
2
2
  import React from 'react';
3
3
  import { PropTypes, describe } from 'react-desc';
4
- import DSTruncatedTooltipText from '@elliemae/ds-truncated-tooltip-text';
4
+ import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';
5
5
  import RequiredMark from '@elliemae/ds-form/RequiredMark';
6
6
  import { PageHeaderTitleWrapper } from '../blocks.js';
7
7
  import '@elliemae/ds-classnames/aggregatedClasses';
@@ -16,7 +16,7 @@ var PageHeaderTitle = function PageHeaderTitle(_ref) {
16
16
  showMarker = _ref$showMarker === void 0 ? false : _ref$showMarker,
17
17
  rest = _objectWithoutProperties(_ref, _excluded);
18
18
 
19
- return /*#__PURE__*/React.createElement(PageHeaderTitleWrapper, rest, /*#__PURE__*/React.createElement(DSTruncatedTooltipText, {
19
+ return /*#__PURE__*/React.createElement(PageHeaderTitleWrapper, rest, /*#__PURE__*/React.createElement(SimpleTruncatedTooltipText, {
20
20
  value: children
21
21
  }), showMarker && /*#__PURE__*/React.createElement(RequiredMark, {
22
22
  required: true
@@ -1 +1 @@
1
- {"version":3,"file":"PageHeaderTitle.js","sources":["../../../../../src/v2/components/PageHeaderTitle/PageHeaderTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport DSTruncatedTooltipText from '@elliemae/ds-truncated-tooltip-text';\nimport RequiredMark from '@elliemae/ds-form/RequiredMark';\nimport { PageHeaderTitleWrapper } from '../blocks';\n\nconst PageHeaderTitle = ({ children, showMarker = false, ...rest }) => (\n <PageHeaderTitleWrapper {...rest}>\n <DSTruncatedTooltipText value={children} />\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;\n\nconst DSPageHeaderTitleWithSchema = describe(PageHeaderTitle);\n\nDSPageHeaderTitleWithSchema.propTypes = props;\n\nexport { PageHeaderTitle, DSPageHeaderTitleWithSchema };\n"],"names":["PageHeaderTitle","children","showMarker","rest","props","PropTypes","string","description","bool","propTypes","DSPageHeaderTitleWithSchema","describe"],"mappings":";;;;;;;;;;;;IAMMA,eAAe,GAAG,SAAlBA,eAAkB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,6BAAaC,UAAb;AAAA,MAAaA,UAAb,gCAA0B,KAA1B;AAAA,MAAoCC,IAApC;;AAAA,sBACtB,oBAAC,sBAAD,EAA4BA,IAA5B,eACE,oBAAC,sBAAD;AAAwB,IAAA,KAAK,EAAEF;AAA/B,IADF,EAEGC,UAAU,iBAAI,oBAAC,YAAD;AAAc,IAAA,QAAQ;AAAtB,IAFjB,CADsB;AAAA;;AAOxB,IAAME,KAAK,GAAG;AACZ;AACAH,EAAAA,QAAQ,EAAEI,SAAS,CAACC,MAAV,CAAiBC,WAAjB,CAA6B,0BAA7B,CAFE;;AAGZ;AACAL,EAAAA,UAAU,EAAEG,SAAS,CAACG,IAAV,CAAeD,WAAf,CAA2B,oBAA3B;AAJA,CAAd;AAOAP,eAAe,CAACS,SAAhB,GAA4BL,KAA5B;IAEMM,2BAA2B,GAAGC,QAAQ,CAACX,eAAD;AAE5CU,2BAA2B,CAACD,SAA5B,GAAwCL,KAAxC;;;;"}
1
+ {"version":3,"file":"PageHeaderTitle.js","sources":["../../../../../src/v2/components/PageHeaderTitle/PageHeaderTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport RequiredMark from '@elliemae/ds-form/RequiredMark';\nimport { PageHeaderTitleWrapper } from '../blocks';\n\nconst PageHeaderTitle = ({ children, showMarker = false, ...rest }) => (\n <PageHeaderTitleWrapper {...rest}>\n <SimpleTruncatedTooltipText value={children} />\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;\n\nconst DSPageHeaderTitleWithSchema = describe(PageHeaderTitle);\n\nDSPageHeaderTitleWithSchema.propTypes = props;\n\nexport { PageHeaderTitle, DSPageHeaderTitleWithSchema };\n"],"names":["PageHeaderTitle","children","showMarker","rest","props","PropTypes","string","description","bool","propTypes","DSPageHeaderTitleWithSchema","describe"],"mappings":";;;;;;;;;;;;IAMMA,eAAe,GAAG,SAAlBA,eAAkB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,6BAAaC,UAAb;AAAA,MAAaA,UAAb,gCAA0B,KAA1B;AAAA,MAAoCC,IAApC;;AAAA,sBACtB,oBAAC,sBAAD,EAA4BA,IAA5B,eACE,oBAAC,0BAAD;AAA4B,IAAA,KAAK,EAAEF;AAAnC,IADF,EAEGC,UAAU,iBAAI,oBAAC,YAAD;AAAc,IAAA,QAAQ;AAAtB,IAFjB,CADsB;AAAA;;AAOxB,IAAME,KAAK,GAAG;AACZ;AACAH,EAAAA,QAAQ,EAAEI,SAAS,CAACC,MAAV,CAAiBC,WAAjB,CAA6B,0BAA7B,CAFE;;AAGZ;AACAL,EAAAA,UAAU,EAAEG,SAAS,CAACG,IAAV,CAAeD,WAAf,CAA2B,oBAA3B;AAJA,CAAd;AAOAP,eAAe,CAACS,SAAhB,GAA4BL,KAA5B;IAEMM,2BAA2B,GAAGC,QAAQ,CAACX,eAAD;AAE5CU,2BAA2B,CAACD,SAA5B,GAAwCL,KAAxC;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-page-header",
3
- "version": "1.54.0-next.7",
3
+ "version": "1.54.0-rc.3",
4
4
  "license": "MIT",
5
5
  "description": "Ellie Mae - Dim Sum - Page Header",
6
6
  "module": "esm/index.js",
@@ -16,15 +16,15 @@
16
16
  "build": "node ../../scripts/build/build.js"
17
17
  },
18
18
  "dependencies": {
19
- "@elliemae/ds-breadcrumb": "1.54.0-next.7",
20
- "@elliemae/ds-button": "1.54.0-next.7",
21
- "@elliemae/ds-classnames": "1.54.0-next.7",
22
- "@elliemae/ds-dropdownmenu": "1.54.0-next.7",
23
- "@elliemae/ds-form": "1.54.0-next.7",
24
- "@elliemae/ds-grid": "1.54.0-next.7",
25
- "@elliemae/ds-icons": "1.54.0-next.7",
26
- "@elliemae/ds-truncated-tooltip-text": "1.54.0-next.7",
27
- "@elliemae/ds-utilities": "1.54.0-next.7",
19
+ "@elliemae/ds-breadcrumb": "1.54.0-rc.3",
20
+ "@elliemae/ds-button": "1.54.0-rc.3",
21
+ "@elliemae/ds-classnames": "1.54.0-rc.3",
22
+ "@elliemae/ds-dropdownmenu": "1.54.0-rc.3",
23
+ "@elliemae/ds-form": "1.54.0-rc.3",
24
+ "@elliemae/ds-grid": "1.54.0-rc.3",
25
+ "@elliemae/ds-icons": "1.54.0-rc.3",
26
+ "@elliemae/ds-truncated-tooltip-text": "1.54.0-rc.3",
27
+ "@elliemae/ds-utilities": "1.54.0-rc.3",
28
28
  "prop-types": "~15.7.2",
29
29
  "react-desc": "^4.1.2"
30
30
  },