@elliemae/ds-page-header 3.0.0-next.7 → 3.0.0-next.72

package/dist/cjs/v2/PageHeader.js

@@ -1,6 +1,8 @@
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
@@ -18,101 +20,85 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+  return to;
 };
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var PageHeader_exports = {};
 __export(PageHeader_exports, {
   DSPageHeaderV2: () => DSPageHeaderV2,
   DSPageHeaderWithSchema: () => DSPageHeaderWithSchema,
-  PageHeaderCustomRenderer: () => PageHeaderCustomRenderer,
+  PageHeaderCustomRenderer: () => import_styled.PageHeaderCustomRenderer,
   PageHeaderEditableTitle: () => import_PageHeaderEditableTitle.PageHeaderEditableTitle,
-  PageHeaderMenu: () => import_PageHeaderMenu.PageHeaderMenu,
+  PageHeaderMenu: () => import_styled.PageHeaderMenu,
   PageHeaderSummary: () => import_PageHeaderSummary.PageHeaderSummary,
   PageHeaderTitle: () => import_PageHeaderTitle.PageHeaderTitle,
   default: () => PageHeader_default
 });
+module.exports = __toCommonJS(PageHeader_exports);
 var React = __toESM(require("react"));
 var import_react = __toESM(require("react"));
-var import_react_desc = require("react-desc");
-var import_lodash = require("lodash");
-var import_styled_components = __toESM(require("styled-components"));
+var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_grid = require("@elliemae/ds-grid");
-var import_PageHeaderTitle = require("./components/PageHeaderTitle/PageHeaderTitle");
-var import_PageHeaderEditableTitle = require("./components/PageHeaderEditableTitle/PageHeaderEditableTitle");
-var import_PageHeaderSummary = require("./components/PageHeaderSummary/PageHeaderSummary");
-var import_PageHeaderMenu = require("./components/PageHeaderMenu/PageHeaderMenu");
-var import_PageHeaderToolbar = require("./components/PageHeaderToolbar/PageHeaderToolbar");
-var import_PageHeaderBack = require("./components/PageHeaderBack/PageHeaderBack");
-var import_blocks = require("./components/blocks");
-var import_props = require("./props");
-const PageHeaderCustomRenderer = import_styled_components.default.div`
-  width: auto;
-  color: ${(props) => props.theme.colors.brand[800]};
-  font-style: italic;
-  font-size: 0.8rem;
-`;
-const Container = import_styled_components.default.div`
-  width: 100%;
-  margin-bottom: 8px;
-`;
-const ContainerWBorder = import_styled_components.default.div`
-  width: 100%;
-  padding: 12px 0 8px 0;
-  display: grid;
-  align-items: center;
-  height: 100%;
-  ${(props) => !props.withBottomSeparator ? "" : `border-bottom: solid 1px ${props.theme.colors.neutral[400]};`}
-`;
-const DSPageHeaderV2 = ({
-  containerProps,
-  breadcrumbs,
-  pageTitle,
-  backarrow,
-  summary,
-  toolbar,
-  menu,
-  withBottomSeparator
-}) => {
+var import_lodash = require("lodash");
+var import_styled = require("./styled");
+var import_PageHeaderTitle = require("./components/PageHeaderTitle");
+var import_PageHeaderEditableTitle = require("./components/PageHeaderEditableTitle");
+var import_PageHeaderSummary = require("./components/PageHeaderSummary");
+var import_react_desc_prop_types = require("./react-desc-prop-types");
+var import_exported_related = require("./exported-related");
+const DSPageHeaderV2 = (props) => {
+  const propsWithDefaults = (0, import_ds_utilities.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
+  (0, import_ds_utilities.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.PageHeaderPropTypes);
+  const _a = propsWithDefaults, { menu, pageTitle, toolbar, summary, backarrow, breadcrumbs, containerProps, withBottomSeparator } = _a, rest = __objRest(_a, ["menu", "pageTitle", "toolbar", "summary", "backarrow", "breadcrumbs", "containerProps", "withBottomSeparator"]);
+  const globalAttributes = (0, import_ds_utilities.useGetGlobalAttributes)(rest);
+  const xStyledProps = (0, import_ds_utilities.useGetXstyledProps)(propsWithDefaults);
   const wrapperRow = ["auto", 1];
   const mainRow = (0, import_lodash.compact)([1, "auto"]);
   const pageTitleRow = (0, import_lodash.compact)(["auto", menu && "30px", summary && "auto", 1]);
-  return /* @__PURE__ */ import_react.default.createElement(Container, __spreadValues({}, containerProps), /* @__PURE__ */ import_react.default.createElement(ContainerWBorder, {
+  return /* @__PURE__ */ import_react.default.createElement(import_styled.Container, __spreadProps(__spreadValues(__spreadValues(__spreadValues({}, containerProps), globalAttributes), xStyledProps), {
+    "data-testid": import_exported_related.DSPageHeaderDataTestIds.CONTAINER
+  }), /* @__PURE__ */ import_react.default.createElement(import_styled.ContainerWBorder, {
     withBottomSeparator
   }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
     cols: wrapperRow
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_PageHeaderBack.PageHeaderBack, null, backarrow)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_styled.PageHeaderBack, null, backarrow)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
     rows: ["auto", "auto"]
   }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    className: `${import_blocks.cssPrefix}-page-header-v2-breadcrumb`
+    className: "em-ds-page-header-v2-breadcrumb"
   }, breadcrumbs), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
     cols: mainRow
   }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
     cols: pageTitleRow
-  }, pageTitle, menu && /* @__PURE__ */ import_react.default.createElement(import_PageHeaderMenu.PageHeaderMenu, null, menu), summary, /* @__PURE__ */ import_react.default.createElement("div", null)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_PageHeaderToolbar.PageHeaderToolbar, null, toolbar)))))));
+  }, pageTitle, menu && /* @__PURE__ */ import_react.default.createElement(import_styled.PageHeaderMenu, null, menu), summary, /* @__PURE__ */ import_react.default.createElement("div", null)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, /* @__PURE__ */ import_react.default.createElement(import_styled.PageHeaderToolbarWrapper, null, toolbar)))))));
 };
-DSPageHeaderV2.propTypes = import_props.navProps;
-DSPageHeaderV2.defaultProps = import_props.defaultProps;
-const DSPageHeaderWithSchema = (0, import_react_desc.describe)(DSPageHeaderV2);
-DSPageHeaderWithSchema.propTypes = import_props.navProps;
+DSPageHeaderV2.propTypes = import_react_desc_prop_types.PageHeaderPropTypes;
+DSPageHeaderV2.defaultProps = import_react_desc_prop_types.defaultProps;
+DSPageHeaderV2.displayName = "DSPageHeaderV2";
+const DSPageHeaderWithSchema = (0, import_ds_utilities.describe)(DSPageHeaderV2);
+DSPageHeaderWithSchema.propTypes = import_react_desc_prop_types.PageHeaderPropTypes;
 var PageHeader_default = DSPageHeaderV2;
-module.exports = __toCommonJS(PageHeader_exports);
 //# sourceMappingURL=PageHeader.js.map

package/dist/cjs/v2/PageHeader.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/v2/PageHeader.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,wBAAyB;AACzB,oBAAwB;AACxB,+BAAmB;AACnB,qBAAqB;AACrB,6BAAgC;AAChC,qCAAwC;AACxC,+BAAkC;AAClC,4BAA+B;AAC/B,+BAAkC;AAClC,4BAA+B;AAC/B,oBAA0B;AAC1B,mBAAuC;AAEvC,MAAM,2BAA2B,iCAAO;AAAA;AAAA,WAE7B,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAK/C,MAAM,YAAY,iCAAO;AAAA;AAAA;AAAA;AAIzB,MAAM,mBAAmB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAM5B,CAAC,UAAW,CAAC,MAAM,sBAAsB,KAAK,4BAA4B,MAAM,MAAM,OAAO,QAAQ;AAAA;AAEzG,MAAM,iBAAiB,CAAC;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACI;AACJ,QAAM,aAAa,CAAC,QAAQ;AAC5B,QAAM,UAAU,2BAAQ,CAAC,GAAG;AAC5B,QAAM,eAAe,2BAAQ,CAAC,QAAQ,QAAQ,QAAQ,WAAW,QAAQ;AACzE,SACE,mDAAC,WAAD,mBAAe,iBACb,mDAAC,kBAAD;AAAA,IAAkB;AAAA,KAChB,mDAAC,qBAAD;AAAA,IAAM,MAAM;AAAA,KACV,mDAAC,qBAAD,MACE,mDAAC,sCAAD,MAAiB,aAEnB,mDAAC,qBAAD;AAAA,IAAM,MAAM,CAAC,QAAQ;AAAA,KACnB,mDAAC,qBAAD;AAAA,IAAM,WAAW,GAAG;AAAA,KAAwC,cAC5D,mDAAC,qBAAD;AAAA,IAAM,MAAM;AAAA,KACV,mDAAC,qBAAD;AAAA,IAAM,MAAM;AAAA,KACT,WACA,QAAQ,mDAAC,sCAAD,MAAiB,OACzB,SACD,mDAAC,OAAD,QAEF,mDAAC,qBAAD,MACE,mDAAC,4CAAD,MAAoB;AAAA;AAUpC,eAAe,YAAY;AAC3B,eAAe,eAAe;AAE9B,MAAM,yBAAyB,gCAAS;AAExC,uBAAuB,YAAY;AAYnC,IAAO,qBAAQ;",
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { WeakValidationMap } from 'react';\nimport {\n  describe,\n  useValidateTypescriptPropTypes,\n  useMemoMergePropsWithDefault,\n  useGetGlobalAttributes,\n  useGetXstyledProps,\n} from '@elliemae/ds-utilities';\nimport { Grid } from '@elliemae/ds-grid';\nimport { compact } from 'lodash';\nimport {\n  Container,\n  ContainerWBorder,\n  PageHeaderCustomRenderer,\n  PageHeaderToolbarWrapper,\n  PageHeaderMenu,\n  PageHeaderBack,\n} from './styled';\nimport { PageHeaderTitle } from './components/PageHeaderTitle';\nimport { PageHeaderEditableTitle } from './components/PageHeaderEditableTitle';\nimport { PageHeaderSummary } from './components/PageHeaderSummary';\nimport { PageHeaderPropTypes, DSPageHeaderT, defaultProps } from './react-desc-prop-types';\nimport { DSPageHeaderDataTestIds } from './exported-related';\n\nconst DSPageHeaderV2: React.ComponentType<DSPageHeaderT.Props> = (props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n  useValidateTypescriptPropTypes(propsWithDefaults, PageHeaderPropTypes);\n\n  const { menu, pageTitle, toolbar, summary, backarrow, breadcrumbs, containerProps, withBottomSeparator, ...rest } =\n    propsWithDefaults;\n\n  const globalAttributes = useGetGlobalAttributes(rest);\n  const xStyledProps = useGetXstyledProps(propsWithDefaults);\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\n      {...containerProps}\n      {...globalAttributes}\n      {...xStyledProps}\n      data-testid={DSPageHeaderDataTestIds.CONTAINER}\n    >\n      <ContainerWBorder withBottomSeparator={withBottomSeparator}>\n        <Grid cols={wrapperRow}>\n          <Grid>\n            <PageHeaderBack>{backarrow}</PageHeaderBack>\n          </Grid>\n          <Grid rows={['auto', 'auto']}>\n            <Grid className=\"em-ds-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                <PageHeaderToolbarWrapper>{toolbar}</PageHeaderToolbarWrapper>\n              </Grid>\n            </Grid>\n          </Grid>\n        </Grid>\n      </ContainerWBorder>\n    </Container>\n  );\n};\n\nDSPageHeaderV2.propTypes = PageHeaderPropTypes as WeakValidationMap<unknown>;\nDSPageHeaderV2.defaultProps = defaultProps;\nDSPageHeaderV2.displayName = 'DSPageHeaderV2';\nconst DSPageHeaderWithSchema = describe(DSPageHeaderV2);\n\nDSPageHeaderWithSchema.propTypes = PageHeaderPropTypes as WeakValidationMap<unknown>;\n\nexport {\n  DSPageHeaderV2,\n  PageHeaderTitle,\n  PageHeaderEditableTitle,\n  PageHeaderSummary,\n  PageHeaderMenu,\n  PageHeaderCustomRenderer,\n  DSPageHeaderWithSchema,\n};\n\nexport default DSPageHeaderV2;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAyC;AACzC,0BAMO;AACP,qBAAqB;AACrB,oBAAwB;AACxB,oBAOO;AACP,6BAAgC;AAChC,qCAAwC;AACxC,+BAAkC;AAClC,mCAAiE;AACjE,8BAAwC;AAExC,MAAM,iBAA2D,CAAC,UAAU;AAC1E,QAAM,oBAAoB,sDAA6B,OAAO,yCAAY;AAC1E,0DAA+B,mBAAmB,gDAAmB;AAErE,QACE,wBADM,QAAM,WAAW,SAAS,SAAS,WAAW,aAAa,gBAAgB,wBACjF,IADyG,iBACzG,IADyG,CAAnG,QAAM,aAAW,WAAS,WAAS,aAAW,eAAa,kBAAgB;AAGnF,QAAM,mBAAmB,gDAAuB,IAAI;AACpD,QAAM,eAAe,4CAAmB,iBAAiB;AAEzD,QAAM,aAAa,CAAC,QAAQ,CAAC;AAC7B,QAAM,UAAU,2BAAQ,CAAC,GAAG,MAAM,CAAC;AACnC,QAAM,eAAe,2BAAQ,CAAC,QAAQ,QAAQ,QAAQ,WAAW,QAAQ,CAAC,CAAC;AAC3E,SACE,mDAAC,wFACK,iBACA,mBACA,eAHL;AAAA,IAIC,eAAa,gDAAwB;AAAA,MAErC,mDAAC;AAAA,IAAiB;AAAA,KAChB,mDAAC;AAAA,IAAK,MAAM;AAAA,KACV,mDAAC,2BACC,mDAAC,oCAAgB,SAAU,CAC7B,GACA,mDAAC;AAAA,IAAK,MAAM,CAAC,QAAQ,MAAM;AAAA,KACzB,mDAAC;AAAA,IAAK,WAAU;AAAA,KAAmC,WAAY,GAC/D,mDAAC;AAAA,IAAK,MAAM;AAAA,KACV,mDAAC;AAAA,IAAK,MAAM;AAAA,KACT,WACA,QAAQ,mDAAC,oCAAgB,IAAK,GAC9B,SACD,mDAAC,WAAI,CACP,GACA,mDAAC,2BACC,mDAAC,8CAA0B,OAAQ,CACrC,CACF,CACF,CACF,CACF,CACF;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,eAAe;AAC9B,eAAe,cAAc;AAC7B,MAAM,yBAAyB,kCAAS,cAAc;AAEtD,uBAAuB,YAAY;AAYnC,IAAO,qBAAQ;",
   "names": []
 }

package/dist/cjs/v2/components/{PageHeaderEditableTitle/PageHeaderEditableTitle.js → PageHeaderEditableTitle.js}

@@ -21,7 +21,6 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -38,57 +37,55 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+  return to;
 };
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var PageHeaderEditableTitle_exports = {};
 __export(PageHeaderEditableTitle_exports, {
   DSPageHeaderEditableTitleWithSchema: () => DSPageHeaderEditableTitleWithSchema,
   PageHeaderEditableTitle: () => PageHeaderEditableTitle,
   default: () => PageHeaderEditableTitle_default
 });
+module.exports = __toCommonJS(PageHeaderEditableTitle_exports);
 var React = __toESM(require("react"));
 var import_react = __toESM(require("react"));
-var import_lodash = require("lodash");
-var import_styled_components = __toESM(require("styled-components"));
-var import_react_desc = require("react-desc");
+var import_ds_form_input_text = require("@elliemae/ds-form-input-text");
+var import_ds_system = require("@elliemae/ds-system");
 var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_blocks = require("../blocks");
-var import_PageHeaderTitle = require("../PageHeaderTitle/PageHeaderTitle");
-const EditableContainer = import_styled_components.default.div`
+var import_PageHeaderTitle = require("./PageHeaderTitle");
+const EditableContainer = (0, import_ds_system.styled)("div")`
   height: 32px;
   position: relative;
   overflow: hidden;
+  &.editable-title-component {
+    position: relative;
+    top: -1px;
+
+    & .${import_ds_form_input_text.DSInputTextName}-${import_ds_form_input_text.DSInputTextSlots.INPUT_WRAPPER} {
+      height: 32px;
+    }
+    & .${import_ds_form_input_text.DSInputTextName}-${import_ds_form_input_text.DSInputTextSlots.INPUT} {
+      font-size: ${({ theme }) => theme.fontSizes.title[800]};
+      line-height: normal;
+      color: ${({ theme }) => theme.colors.neutral["700"]};
+    }
+  }
 `;
 const PageHeaderEditableTitle = (_a) => {
   var _b = _a, {
     children: value,
     editing: editingProp = false,
-    onBlur = import_lodash.noop,
-    onChange = import_lodash.noop,
-    onFocus = import_lodash.noop,
-    onMouseOut = import_lodash.noop,
     showMarker = false
   } = _b, rest = __objRest(_b, [
     "children",
     "editing",
-    "onBlur",
-    "onChange",
-    "onFocus",
-    "onMouseOut",
     "showMarker"
   ]);
   const [titleValue, setTitleValue] = (0, import_react.useState)(value);
@@ -96,27 +93,32 @@ const PageHeaderEditableTitle = (_a) => {
   const [editing, setEditing] = (0, import_ds_utilities.useDerivedStateFromProps)(editingProp || false);
   const titleRef = (0, import_react.useRef)(null);
   const { width } = (0, import_ds_utilities.useMeasure)(titleRef);
+  const handleOnChange = (0, import_react.useCallback)((e) => {
+    setTitleValue(e.target.value);
+  }, []);
+  const handleOnFocus = (0, import_react.useCallback)(() => {
+    setEditing(true);
+  }, [setEditing]);
+  const handleOnBlur = (0, import_react.useCallback)(() => {
+    setEditing(false);
+  }, [setEditing]);
+  const handleOnMouseOut = (0, import_react.useCallback)(() => {
+    setHovered(false);
+  }, []);
+  const globals = (0, import_ds_utilities.useGetGlobalAttributes)(rest, {
+    onFocus: handleOnFocus,
+    onMouseOut: handleOnMouseOut,
+    onChange: handleOnChange,
+    onBlur: handleOnBlur
+  });
   return /* @__PURE__ */ import_react.default.createElement(EditableContainer, {
     className: hovered || editing ? "editable-title-component" : "",
     onMouseEnter: () => setHovered(true),
     onMouseLeave: () => setHovered(false)
-  }, (hovered || editing) && /* @__PURE__ */ import_react.default.createElement(import_blocks.EditableTitleComponent, __spreadProps(__spreadValues({}, rest), {
-    onBlur: (e) => {
-      setEditing(false);
-      onBlur(e);
-    },
-    onChange: (e) => {
-      setTitleValue(e.target.value);
-      onChange(e);
-    },
-    onFocus: (e) => {
-      setEditing(true);
-      onFocus(e);
-    },
-    onMouseOut: (e) => {
-      setHovered(false);
-      onMouseOut(e);
-    },
+  }, (hovered || editing) && /* @__PURE__ */ import_react.default.createElement(import_ds_form_input_text.DSInputText, __spreadProps(__spreadValues(__spreadValues({
+    onChange: handleOnChange
+  }, rest), globals), {
+    placeholder: "",
     style: { width: width + 10, minWidth: "260px", maxWidth: "100%" },
     value: titleValue
   })), /* @__PURE__ */ import_react.default.createElement("div", {
@@ -126,18 +128,14 @@ const PageHeaderEditableTitle = (_a) => {
     showMarker: showMarker && !hovered && !editing
   }, titleValue)));
 };
-const props = {
-  children: import_react_desc.PropTypes.string.description("The title text"),
-  editing: import_react_desc.PropTypes.bool.description("Whether the title is editing or not"),
-  showMarker: import_react_desc.PropTypes.bool.description("Show error marker"),
-  onBlur: import_react_desc.PropTypes.func.description("blur callback"),
-  onChange: import_react_desc.PropTypes.func.description("on change handler"),
-  onFocus: import_react_desc.PropTypes.func.description("on focus handler"),
-  onMouseOut: import_react_desc.PropTypes.func.description("mouse out of component handler")
-};
+const props = __spreadProps(__spreadValues({}, import_ds_utilities.globalAttributesPropTypes), {
+  children: import_ds_utilities.PropTypes.string.description("The title text"),
+  editing: import_ds_utilities.PropTypes.bool.description("Whether the title is editing or not"),
+  showMarker: import_ds_utilities.PropTypes.bool.description("Show error marker")
+});
 PageHeaderEditableTitle.propTypes = props;
-const DSPageHeaderEditableTitleWithSchema = (0, import_react_desc.describe)(PageHeaderEditableTitle);
+PageHeaderEditableTitle.displayName = "PageHeaderEditableTitle";
+const DSPageHeaderEditableTitleWithSchema = (0, import_ds_utilities.describe)(PageHeaderEditableTitle);
 DSPageHeaderEditableTitleWithSchema.propTypes = props;
 var PageHeaderEditableTitle_default = PageHeaderEditableTitle;
-module.exports = __toCommonJS(PageHeaderEditableTitle_exports);
 //# sourceMappingURL=PageHeaderEditableTitle.js.map

package/dist/cjs/v2/components/PageHeaderEditableTitle.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/v2/components/PageHeaderEditableTitle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { useRef, useState, useCallback, WeakValidationMap } from 'react';\nimport { DSInputText, DSInputTextName, DSInputTextSlots } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport {\n  PropTypes,\n  describe,\n  useDerivedStateFromProps,\n  useMeasure,\n  useGetGlobalAttributes,\n  globalAttributesPropTypes,\n} from '@elliemae/ds-utilities';\nimport { PageHeaderTitle } from './PageHeaderTitle';\n\nconst EditableContainer = styled('div')`\n  height: 32px;\n  position: relative;\n  overflow: hidden;\n  &.editable-title-component {\n    position: relative;\n    top: -1px;\n\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.ChangeEventHandler = 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    >\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"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwE;AACxE,gCAA+D;AAC/D,uBAAuB;AACvB,0BAOO;AACP,6BAAgC;AAEhC,MAAM,oBAAoB,6BAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAQ7B,6CAAmB,2CAAiB;AAAA;AAAA;AAAA,SAGpC,6CAAmB,2CAAiB;AAAA,mBAC1B,CAAC,EAAE,YAAY,MAAM,UAAU,MAAM;AAAA;AAAA,eAEzC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAK5C,MAAM,0BAA0B,CAAC,OAKlC;AALkC,eACtC;AAAA,cAAU;AAAA,IACV,SAAS,cAAc;AAAA,IACvB,aAAa;AAAA,MAHyB,IAInC,iBAJmC,IAInC;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,CAAC,YAAY,iBAAiB,2BAAS,KAAK;AAClD,QAAM,CAAC,SAAS,cAAc,2BAAS,KAAK;AAC5C,QAAM,CAAC,SAAS,cAAc,kDAAyB,eAAe,KAAK;AAC3E,QAAM,WAAW,yBAAO,IAAI;AAC5B,QAAM,EAAE,UAAU,oCAAW,QAAQ;AAErC,QAAM,iBAA2C,8BAAY,CAAC,MAAM;AAClE,kBAAc,EAAE,OAAO,KAAK;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAyC,8BAAY,MAAM;AAC/D,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,eAAwC,8BAAY,MAAM;AAC9D,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,mBAA4C,8BAAY,MAAM;AAClE,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,gDAAuB,MAAM;AAAA,IAC3C,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV,CAAC;AAED,SACE,mDAAC;AAAA,IACC,WAAW,WAAW,UAAU,6BAA6B;AAAA,IAC7D,cAAc,MAAM,WAAW,IAAI;AAAA,IACnC,cAAc,MAAM,WAAW,KAAK;AAAA,KAElC,YAAW,YACX,mDAAC;AAAA,IACC,UAAU;AAAA,KACN,OACA,UAHL;AAAA,IAIC,aAAY;AAAA,IACZ,OAAO,EAAE,OAAO,QAAQ,IAAI,UAAU,SAAS,UAAU,OAAO;AAAA,IAChE,OAAO;AAAA,IACT,GAEF,mDAAC;AAAA,IAAI,KAAK;AAAA,IAAU,OAAO,EAAE,OAAO,cAAc;AAAA,KAChD,mDAAC;AAAA,IAAgB,YAAY,cAAc,CAAC,WAAW,CAAC;AAAA,KAAU,UAAW,CAC/E,CACF;AAEJ;AAEA,MAAM,QAAQ,iCACT,gDADS;AAAA,EAGZ,UAAU,8BAAU,OAAO,YAAY,gBAAgB;AAAA,EAEvD,SAAS,8BAAU,KAAK,YAAY,qCAAqC;AAAA,EAEzE,YAAY,8BAAU,KAAK,YAAY,mBAAmB;AAC5D;AAEA,wBAAwB,YAAY;AACpC,wBAAwB,cAAc;AACtC,MAAM,sCAAsC,kCAAS,uBAAuB;AAE5E,oCAAoC,YAAY;AAEhD,IAAO,kCAAQ;",
+  "names": []
+}

package/dist/cjs/v2/components/PageHeaderSummary.js

@@ -0,0 +1,107 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var PageHeaderSummary_exports = {};
+__export(PageHeaderSummary_exports, {
+  DSPageHeaderSummaryWithSchema: () => DSPageHeaderSummaryWithSchema,
+  PageHeaderSummary: () => PageHeaderSummary
+});
+module.exports = __toCommonJS(PageHeaderSummary_exports);
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_ds_utilities = require("@elliemae/ds-utilities");
+var import_ds_system = require("@elliemae/ds-system");
+var import_exported_related = require("../exported-related");
+const PageHeaderSummaryWrapper = (0, import_ds_system.styled)("div", {
+  name: import_exported_related.DSPageHeaderName,
+  slot: import_exported_related.DSPageHeaderSlots.SUMMARY
+})`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+
+  margin-left: ${({ theme }) => theme.space.xxxs};
+  font-size: ${({ theme }) => theme.fontSizes.title[700]};
+  line-height: ${({ theme }) => theme.lineHeights.m};
+  font-weight: ${({ theme }) => theme.fontWeights.regular};
+  &:before {
+    display: block;
+    content: '';
+    height: 23px;
+    background: ${({ theme }) => theme.colors.neutral[600]};
+    width: 1px;
+    margin-right: ${({ theme }) => theme.space.xxs};
+  }
+  .ph-summary-value {
+    color: ${({ theme }) => theme.colors.neutral[700]};
+    padding-right: ${({ theme }) => theme.space.xxs};
+  }
+  .ph-summary-label {
+    color: ${({ theme }) => theme.colors.neutral[600]};
+  }
+  .ph-summary-space {
+    width: ${({ theme }) => theme.space.l};
+  }
+`;
+const PageHeaderSummary = (_a) => {
+  var _b = _a, { value = null, label = "" } = _b, rest = __objRest(_b, ["value", "label"]);
+  return /* @__PURE__ */ import_react.default.createElement(PageHeaderSummaryWrapper, __spreadValues({}, rest), (value === 0 || value) && /* @__PURE__ */ import_react.default.createElement("div", {
+    className: "ph-summary-value"
+  }, value), label && /* @__PURE__ */ import_react.default.createElement("div", {
+    className: "ph-summary-label"
+  }, label), (value === 0 || value || label) && /* @__PURE__ */ import_react.default.createElement("div", {
+    className: "ph-summary-space"
+  }));
+};
+const props = {
+  value: import_ds_utilities.PropTypes.number.description("value for page header summary"),
+  label: import_ds_utilities.PropTypes.string.description("label attached to value")
+};
+PageHeaderSummary.propTypes = props;
+PageHeaderSummary.displayName = "PageHeaderSummary";
+const DSPageHeaderSummaryWithSchema = (0, import_ds_utilities.describe)(PageHeaderSummary);
+DSPageHeaderSummaryWithSchema.propTypes = props;
+//# sourceMappingURL=PageHeaderSummary.js.map

package/dist/cjs/v2/components/PageHeaderSummary.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/v2/components/PageHeaderSummary.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { WeakValidationMap } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { styled } from '@elliemae/ds-system';\nimport { DSPageHeaderName, DSPageHeaderSlots } 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 {...rest}>\n    {(value === 0 || value) && <div className=\"ph-summary-value\">{value}</div>}\n    {label && <div className=\"ph-summary-label\">{label}</div>}\n    {(value === 0 || value || label) && <div className=\"ph-summary-space\" />}\n  </PageHeaderSummaryWrapper>\n);\n\nconst props = {\n  /** value for page header summary */\n  value: PropTypes.number.description('value for page header summary'),\n  /** label attached to value */\n  label: PropTypes.string.description('label attached to value'),\n};\n\nPageHeaderSummary.propTypes = props as WeakValidationMap<unknown>;\nPageHeaderSummary.displayName = 'PageHeaderSummary';\nconst DSPageHeaderSummaryWithSchema = describe(PageHeaderSummary);\n\nDSPageHeaderSummaryWithSchema.propTypes = props as WeakValidationMap<unknown>;\n\nexport { PageHeaderSummary, DSPageHeaderSummaryWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,0BAAoC;AACpC,uBAAuB;AACvB,8BAAoD;AAEpD,MAAM,2BAA2B,6BAAO,OAAO;AAAA,EAC7C,MAAM;AAAA,EACN,MAAM,0CAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKgB,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA,eAC7B,CAAC,EAAE,YAAY,MAAM,UAAU,MAAM;AAAA,iBACnC,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA,iBACjC,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKhC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA,oBAElC,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA,aAGlC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA,qBAC5B,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA,aAGnC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,aAGpC,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAGxC,MAAM,oBAAoB,CAAC,OAAuC;AAAvC,eAAE,UAAQ,MAAM,QAAQ,OAAxB,IAA+B,iBAA/B,IAA+B,CAA7B,SAAc;AACzC,4DAAC,6CAA6B,OAC1B,WAAU,KAAK,UAAU,mDAAC;AAAA,IAAI,WAAU;AAAA,KAAoB,KAAM,GACnE,SAAS,mDAAC;AAAA,IAAI,WAAU;AAAA,KAAoB,KAAM,GACjD,WAAU,KAAK,SAAS,UAAU,mDAAC;AAAA,IAAI,WAAU;AAAA,GAAmB,CACxE;AAAA;AAGF,MAAM,QAAQ;AAAA,EAEZ,OAAO,8BAAU,OAAO,YAAY,+BAA+B;AAAA,EAEnE,OAAO,8BAAU,OAAO,YAAY,yBAAyB;AAC/D;AAEA,kBAAkB,YAAY;AAC9B,kBAAkB,cAAc;AAChC,MAAM,gCAAgC,kCAAS,iBAAiB;AAEhE,8BAA8B,YAAY;",
+  "names": []
+}

package/dist/cjs/v2/components/{PageHeaderTitle/PageHeaderTitle.js → PageHeaderTitle.js}

@@ -21,7 +21,6 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -38,49 +37,62 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+  return to;
 };
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var PageHeaderTitle_exports = {};
 __export(PageHeaderTitle_exports, {
   DSPageHeaderTitleWithSchema: () => DSPageHeaderTitleWithSchema,
   PageHeaderTitle: () => PageHeaderTitle
 });
+module.exports = __toCommonJS(PageHeaderTitle_exports);
 var React = __toESM(require("react"));
 var import_react = __toESM(require("react"));
-var import_react_desc = require("react-desc");
-var import_ds_truncated_tooltip_text = __toESM(require("@elliemae/ds-truncated-tooltip-text"));
-var import_RequiredMark = require("@elliemae/ds-form/RequiredMark");
-var import_blocks = require("../blocks");
+var import_ds_system = require("@elliemae/ds-system");
+var import_ds_utilities = require("@elliemae/ds-utilities");
+var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
+var import_ds_form = require("@elliemae/ds-form");
+var import_exported_related = require("../exported-related");
+const PageHeaderTitleWrapper = (0, import_ds_system.styled)("div", {
+  name: import_exported_related.DSPageHeaderName,
+  slot: import_exported_related.DSPageHeaderSlots.HEADER_TITLE
+})`
+  display: grid;
+  font-size: ${({ theme }) => theme.fontSizes.title[800]};
+  color: ${({ theme }) => theme.colors.neutral["700"]};
+  line-height: normal;
+  font-weight: 400;
+  margin-right: 0.61538rem;
+
+  & .em-ds-form-required-mark {
+    position: absolute;
+    top: 0;
+    right: 0;
+  }
+`;
 const PageHeaderTitle = (_a) => {
-  var _b = _a, { children, showMarker = false } = _b, rest = __objRest(_b, ["children", "showMarker"]);
-  return /* @__PURE__ */ import_react.default.createElement(import_blocks.PageHeaderTitleWrapper, __spreadProps(__spreadValues({}, rest), {
-    "data-testid": "ds-page-header-title"
-  }), /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.TooltipTextProvider, null, /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.default, {
+  var _b = _a, { children = "", showMarker = false } = _b, rest = __objRest(_b, ["children", "showMarker"]);
+  return /* @__PURE__ */ import_react.default.createElement(PageHeaderTitleWrapper, __spreadProps(__spreadValues({}, rest), {
+    "data-testid": import_exported_related.DSPageHeaderDataTestIds.HEADER_TITLE
+  }), /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.TooltipTextProvider, null, /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.DSTruncatedTooltipText, {
     value: children
-  })), showMarker && /* @__PURE__ */ import_react.default.createElement(import_RequiredMark.RequiredMark, {
+  })), showMarker && /* @__PURE__ */ import_react.default.createElement(import_ds_form.RequiredMark, {
     required: true
   }));
 };
 const props = {
-  children: import_react_desc.PropTypes.string.description("Page header title string"),
-  showMarker: import_react_desc.PropTypes.bool.description("show required mark")
+  children: import_ds_utilities.PropTypes.string.description("Page header title string"),
+  showMarker: import_ds_utilities.PropTypes.bool.description("show required mark")
 };
 PageHeaderTitle.propTypes = props;
-const DSPageHeaderTitleWithSchema = (0, import_react_desc.describe)(PageHeaderTitle);
+PageHeaderTitle.displayName = "PageHeaderTitle";
+const DSPageHeaderTitleWithSchema = (0, import_ds_utilities.describe)(PageHeaderTitle);
 DSPageHeaderTitleWithSchema.propTypes = props;
-module.exports = __toCommonJS(PageHeaderTitle_exports);
 //# sourceMappingURL=PageHeaderTitle.js.map

package/dist/cjs/v2/components/PageHeaderTitle.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/v2/components/PageHeaderTitle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { WeakValidationMap } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSTruncatedTooltipText, TooltipTextProvider } from '@elliemae/ds-truncated-tooltip-text';\nimport { RequiredMark } from '@elliemae/ds-form';\nimport { DSPageHeaderName, DSPageHeaderSlots, DSPageHeaderDataTestIds } from '../exported-related';\nconst PageHeaderTitleWrapper = styled('div', {\n  name: DSPageHeaderName,\n  slot: DSPageHeaderSlots.HEADER_TITLE,\n})`\n  display: grid;\n  font-size: ${({ theme }) => theme.fontSizes.title[800]};\n  color: ${({ theme }) => theme.colors.neutral['700']};\n  line-height: normal;\n  font-weight: 400;\n  margin-right: 0.61538rem;\n\n  & .em-ds-form-required-mark {\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n`;\nconst PageHeaderTitle = ({ children = '', showMarker = false, ...rest }) => (\n  <PageHeaderTitleWrapper {...rest} data-testid={DSPageHeaderDataTestIds.HEADER_TITLE}>\n    <TooltipTextProvider>\n      <DSTruncatedTooltipText value={children} />\n    </TooltipTextProvider>\n    {showMarker && <RequiredMark required />}\n  </PageHeaderTitleWrapper>\n);\n\nconst props = {\n  /** page header title string */\n  children: PropTypes.string.description('Page header title string'),\n  /** show required mark */\n  showMarker: PropTypes.bool.description('show required mark'),\n};\n\nPageHeaderTitle.propTypes = props as WeakValidationMap<unknown>;\nPageHeaderTitle.displayName = 'PageHeaderTitle';\nconst DSPageHeaderTitleWithSchema = describe(PageHeaderTitle);\n\nDSPageHeaderTitleWithSchema.propTypes = props as WeakValidationMap<unknown>;\n\nexport { PageHeaderTitle, DSPageHeaderTitleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,uBAAuB;AACvB,0BAAoC;AACpC,uCAA4D;AAC5D,qBAA6B;AAC7B,8BAA6E;AAC7E,MAAM,yBAAyB,6BAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,0CAAkB;AAC1B,CAAC;AAAA;AAAA,eAEc,CAAC,EAAE,YAAY,MAAM,UAAU,MAAM;AAAA,WACzC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAW/C,MAAM,kBAAkB,CAAC,OAAgD;AAAhD,eAAE,aAAW,IAAI,aAAa,UAA9B,IAAwC,iBAAxC,IAAwC,CAAtC,YAAe;AACxC,4DAAC,yDAA2B,OAA3B;AAAA,IAAiC,eAAa,gDAAwB;AAAA,MACrE,mDAAC,4DACC,mDAAC;AAAA,IAAuB,OAAO;AAAA,GAAU,CAC3C,GACC,cAAc,mDAAC;AAAA,IAAa,UAAQ;AAAA,GAAC,CACxC;AAAA;AAGF,MAAM,QAAQ;AAAA,EAEZ,UAAU,8BAAU,OAAO,YAAY,0BAA0B;AAAA,EAEjE,YAAY,8BAAU,KAAK,YAAY,oBAAoB;AAC7D;AAEA,gBAAgB,YAAY;AAC5B,gBAAgB,cAAc;AAC9B,MAAM,8BAA8B,kCAAS,eAAe;AAE5D,4BAA4B,YAAY;",
+  "names": []
+}