@elliemae/ds-global-header 3.60.0-next.4 → 3.60.0-next.41

package/dist/cjs/DSGlobalHeader.js

@@ -35,20 +35,19 @@ __export(DSGlobalHeader_exports, {
 module.exports = __toCommonJS(DSGlobalHeader_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
 var import_ds_grid = require("@elliemae/ds-grid");
-var import_ds_system = require("@elliemae/ds-system");
 var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
-var import_react_desc_prop_types = require("./react-desc-prop-types.js");
-var import_GlobalHeaderLogo = require("./parts/Logo/GlobalHeaderLogo.js");
-var import_GlobalHeaderBreadcrumb = require("./parts/Breadcrumb/GlobalHeaderBreadcrumb.js");
-var import_GlobalHeaderToolbar = require("./parts/Toolbar/GlobalHeaderToolbar.js");
+var import_ds_system = require("@elliemae/ds-system");
+var import_react = require("react");
 var import_DSGlobalHeaderContext = require("./DSGlobalHeaderContext.js");
 var import_useGlobalHeader = require("./config/useGlobalHeader.js");
 var import_useValidateProps = require("./config/useValidateProps.js");
-var import_exported_related = require("./exported-related/index.js");
-var import_constants = require("./config/constants.js");
+var import_constants = require("./constants/index.js");
+var import_GlobalHeaderBreadcrumb = require("./parts/Breadcrumb/GlobalHeaderBreadcrumb.js");
+var import_GlobalHeaderLogo = require("./parts/Logo/GlobalHeaderLogo.js");
+var import_GlobalHeaderToolbar = require("./parts/Toolbar/GlobalHeaderToolbar.js");
 var import_styles = require("./parts/styles.js");
+var import_react_desc_prop_types = require("./react-desc-prop-types.js");
 const DSGlobalHeader = (props) => {
   (0, import_useValidateProps.useValidateProps)(props);
   const ctx = (0, import_useGlobalHeader.useGlobalHeader)(props);
@@ -89,7 +88,7 @@ const DSGlobalHeader = (props) => {
       ...xstyledAttrs,
       ...ownerProps,
       forwardedAs: "header",
-      "data-testid": "ds-global-header",
+      "data-testid": import_constants.GLOBAL_HEADER_DATA_TESTID.CONTAINER,
       cols: cols2,
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_DSGlobalHeaderContext.DSGlobalHeaderContext.Provider, { value: ctx, children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols, children: [
@@ -101,7 +100,7 @@ const DSGlobalHeader = (props) => {
     }
   );
 };
-DSGlobalHeader.displayName = import_exported_related.DSGlobalHeaderName;
+DSGlobalHeader.displayName = import_constants.DSGlobalHeaderName;
 const DSGlobalHeaderWithSchema = (0, import_ds_props_helpers.describe)(DSGlobalHeader).description("DSGlobalHeader");
 DSGlobalHeaderWithSchema.propTypes = import_react_desc_prop_types.DSGlobalHeaderPropTypesSchema;
 const GlobalHeader = DSGlobalHeader;

package/dist/cjs/DSGlobalHeader.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DSGlobalHeader.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useMemo } from 'react';\nimport { type DSGridT, Grid } from '@elliemae/ds-grid';\nimport { useGetLayoutMode } from '@elliemae/ds-system';\nimport { useGetGlobalAttributes, useGetXstyledProps, describe } from '@elliemae/ds-props-helpers';\nimport { DSGlobalHeaderPropTypesSchema, type DSGlobalHeaderT } from './react-desc-prop-types.js';\nimport { GlobalHeaderLogo } from './parts/Logo/GlobalHeaderLogo.js';\nimport { GlobalHeaderBreadcrumb } from './parts/Breadcrumb/GlobalHeaderBreadcrumb.js';\nimport { GlobalHeaderToolbar } from './parts/Toolbar/GlobalHeaderToolbar.js';\nimport { DSGlobalHeaderContext } from './DSGlobalHeaderContext.js';\nimport { useGlobalHeader } from './config/useGlobalHeader.js';\nimport { useValidateProps } from './config/useValidateProps.js';\nimport { DSGlobalHeaderName } from './exported-related/index.js';\nimport { FONT_DETECTOR } from './config/constants.js';\nimport { Container } from './parts/styles.js';\n\nconst DSGlobalHeader = (props: DSGlobalHeaderT.Props): JSX.Element => {\n  useValidateProps(props);\n  const ctx = useGlobalHeader(props);\n  const {\n    props: { toolbar },\n    ownerProps,\n    fontDetector,\n  } = ctx;\n  const propsWithDefaults = ctx.props;\n  const globalAttrs = useGetGlobalAttributes<DSGlobalHeaderT.Props, HTMLDivElement, DSGridT.Props>(propsWithDefaults);\n  const xstyledAttrs = useGetXstyledProps(propsWithDefaults);\n  const layoutMode = useGetLayoutMode();\n\n  const cols2 = useMemo(() => {\n    if (['l'].includes(layoutMode!)) {\n      return ['1fr', 'auto'];\n    }\n    if (['m', 's'].includes(layoutMode!)) {\n      return ['1fr'];\n    }\n    if (['xs'].includes(layoutMode!)) {\n      return ['auto'];\n    }\n    if (fontDetector > FONT_DETECTOR.SMALL) {\n      return ['auto', '1fr'];\n    }\n    return ['1fr', 'auto'];\n  }, [fontDetector, layoutMode]);\n\n  const cols = useMemo(() => {\n    if (['xs'].includes(layoutMode!)) {\n      return ['auto'];\n    }\n    return ['auto', '1fr'];\n  }, [layoutMode]);\n\n  return (\n    <Container\n      {...globalAttrs}\n      {...xstyledAttrs}\n      {...ownerProps}\n      forwardedAs=\"header\"\n      data-testid=\"ds-global-header\"\n      cols={cols2}\n    >\n      <DSGlobalHeaderContext.Provider value={ctx}>\n        <Grid cols={cols}>\n          <GlobalHeaderLogo />\n          <GlobalHeaderBreadcrumb />\n        </Grid>\n        {toolbar.length ? <GlobalHeaderToolbar /> : null}\n      </DSGlobalHeaderContext.Provider>\n    </Container>\n  );\n};\n\nDSGlobalHeader.displayName = DSGlobalHeaderName;\nconst DSGlobalHeaderWithSchema = describe(DSGlobalHeader).description('DSGlobalHeader');\nDSGlobalHeaderWithSchema.propTypes = DSGlobalHeaderPropTypesSchema;\n\nconst GlobalHeader = DSGlobalHeader;\n\nexport { GlobalHeader, DSGlobalHeader, DSGlobalHeaderWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6Df;AA7DR,mBAA+B;AAC/B,qBAAmC;AACnC,uBAAiC;AACjC,8BAAqE;AACrE,mCAAoE;AACpE,8BAAiC;AACjC,oCAAuC;AACvC,iCAAoC;AACpC,mCAAsC;AACtC,6BAAgC;AAChC,8BAAiC;AACjC,8BAAmC;AACnC,uBAA8B;AAC9B,oBAA0B;AAE1B,MAAM,iBAAiB,CAAC,UAA8C;AACpE,gDAAiB,KAAK;AACtB,QAAM,UAAM,wCAAgB,KAAK;AACjC,QAAM;AAAA,IACJ,OAAO,EAAE,QAAQ;AAAA,IACjB;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,oBAAoB,IAAI;AAC9B,QAAM,kBAAc,gDAA6E,iBAAiB;AAClH,QAAM,mBAAe,4CAAmB,iBAAiB;AACzD,QAAM,iBAAa,mCAAiB;AAEpC,QAAM,YAAQ,sBAAQ,MAAM;AAC1B,QAAI,CAAC,GAAG,EAAE,SAAS,UAAW,GAAG;AAC/B,aAAO,CAAC,OAAO,MAAM;AAAA,IACvB;AACA,QAAI,CAAC,KAAK,GAAG,EAAE,SAAS,UAAW,GAAG;AACpC,aAAO,CAAC,KAAK;AAAA,IACf;AACA,QAAI,CAAC,IAAI,EAAE,SAAS,UAAW,GAAG;AAChC,aAAO,CAAC,MAAM;AAAA,IAChB;AACA,QAAI,eAAe,+BAAc,OAAO;AACtC,aAAO,CAAC,QAAQ,KAAK;AAAA,IACvB;AACA,WAAO,CAAC,OAAO,MAAM;AAAA,EACvB,GAAG,CAAC,cAAc,UAAU,CAAC;AAE7B,QAAM,WAAO,sBAAQ,MAAM;AACzB,QAAI,CAAC,IAAI,EAAE,SAAS,UAAW,GAAG;AAChC,aAAO,CAAC,MAAM;AAAA,IAChB;AACA,WAAO,CAAC,QAAQ,KAAK;AAAA,EACvB,GAAG,CAAC,UAAU,CAAC;AAEf,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,aAAY;AAAA,MACZ,eAAY;AAAA,MACZ,MAAM;AAAA,MAEN,uDAAC,mDAAsB,UAAtB,EAA+B,OAAO,KACrC;AAAA,qDAAC,uBAAK,MACJ;AAAA,sDAAC,4CAAiB;AAAA,UAClB,4CAAC,wDAAuB;AAAA,WAC1B;AAAA,QACC,QAAQ,SAAS,4CAAC,kDAAoB,IAAK;AAAA,SAC9C;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;AAC7B,MAAM,+BAA2B,kCAAS,cAAc,EAAE,YAAY,gBAAgB;AACtF,yBAAyB,YAAY;AAErC,MAAM,eAAe;",
+  "sourcesContent": ["import { type DSGridT, Grid } from '@elliemae/ds-grid';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { useGetLayoutMode } from '@elliemae/ds-system';\nimport { useMemo } from 'react';\nimport { DSGlobalHeaderContext } from './DSGlobalHeaderContext.js';\nimport { useGlobalHeader } from './config/useGlobalHeader.js';\nimport { useValidateProps } from './config/useValidateProps.js';\nimport { DSGlobalHeaderName, FONT_DETECTOR, GLOBAL_HEADER_DATA_TESTID } from './constants/index.js';\nimport { GlobalHeaderBreadcrumb } from './parts/Breadcrumb/GlobalHeaderBreadcrumb.js';\nimport { GlobalHeaderLogo } from './parts/Logo/GlobalHeaderLogo.js';\nimport { GlobalHeaderToolbar } from './parts/Toolbar/GlobalHeaderToolbar.js';\nimport { Container } from './parts/styles.js';\nimport { DSGlobalHeaderPropTypesSchema, type DSGlobalHeaderT } from './react-desc-prop-types.js';\n\nconst DSGlobalHeader = (props: DSGlobalHeaderT.Props): JSX.Element => {\n  useValidateProps(props);\n  const ctx = useGlobalHeader(props);\n  const {\n    props: { toolbar },\n    ownerProps,\n    fontDetector,\n  } = ctx;\n  const propsWithDefaults = ctx.props;\n  const globalAttrs = useGetGlobalAttributes<DSGlobalHeaderT.Props, HTMLDivElement, DSGridT.Props>(propsWithDefaults);\n  const xstyledAttrs = useGetXstyledProps(propsWithDefaults);\n  const layoutMode = useGetLayoutMode();\n\n  const cols2 = useMemo(() => {\n    if (['l'].includes(layoutMode!)) {\n      return ['1fr', 'auto'];\n    }\n    if (['m', 's'].includes(layoutMode!)) {\n      return ['1fr'];\n    }\n    if (['xs'].includes(layoutMode!)) {\n      return ['auto'];\n    }\n    if (fontDetector > FONT_DETECTOR.SMALL) {\n      return ['auto', '1fr'];\n    }\n    return ['1fr', 'auto'];\n  }, [fontDetector, layoutMode]);\n\n  const cols = useMemo(() => {\n    if (['xs'].includes(layoutMode!)) {\n      return ['auto'];\n    }\n    return ['auto', '1fr'];\n  }, [layoutMode]);\n\n  return (\n    <Container\n      {...globalAttrs}\n      {...xstyledAttrs}\n      {...ownerProps}\n      forwardedAs=\"header\"\n      data-testid={GLOBAL_HEADER_DATA_TESTID.CONTAINER}\n      cols={cols2}\n    >\n      <DSGlobalHeaderContext.Provider value={ctx}>\n        <Grid cols={cols}>\n          <GlobalHeaderLogo />\n          <GlobalHeaderBreadcrumb />\n        </Grid>\n        {toolbar.length ? <GlobalHeaderToolbar /> : null}\n      </DSGlobalHeaderContext.Provider>\n    </Container>\n  );\n};\n\nDSGlobalHeader.displayName = DSGlobalHeaderName;\nconst DSGlobalHeaderWithSchema = describe(DSGlobalHeader).description('DSGlobalHeader');\nDSGlobalHeaderWithSchema.propTypes = DSGlobalHeaderPropTypesSchema;\n\nconst GlobalHeader = DSGlobalHeader;\n\nexport { DSGlobalHeader, DSGlobalHeaderWithSchema, GlobalHeader };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4Df;AA5DR,qBAAmC;AACnC,8BAAqE;AACrE,uBAAiC;AACjC,mBAAwB;AACxB,mCAAsC;AACtC,6BAAgC;AAChC,8BAAiC;AACjC,uBAA6E;AAC7E,oCAAuC;AACvC,8BAAiC;AACjC,iCAAoC;AACpC,oBAA0B;AAC1B,mCAAoE;AAEpE,MAAM,iBAAiB,CAAC,UAA8C;AACpE,gDAAiB,KAAK;AACtB,QAAM,UAAM,wCAAgB,KAAK;AACjC,QAAM;AAAA,IACJ,OAAO,EAAE,QAAQ;AAAA,IACjB;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,oBAAoB,IAAI;AAC9B,QAAM,kBAAc,gDAA6E,iBAAiB;AAClH,QAAM,mBAAe,4CAAmB,iBAAiB;AACzD,QAAM,iBAAa,mCAAiB;AAEpC,QAAM,YAAQ,sBAAQ,MAAM;AAC1B,QAAI,CAAC,GAAG,EAAE,SAAS,UAAW,GAAG;AAC/B,aAAO,CAAC,OAAO,MAAM;AAAA,IACvB;AACA,QAAI,CAAC,KAAK,GAAG,EAAE,SAAS,UAAW,GAAG;AACpC,aAAO,CAAC,KAAK;AAAA,IACf;AACA,QAAI,CAAC,IAAI,EAAE,SAAS,UAAW,GAAG;AAChC,aAAO,CAAC,MAAM;AAAA,IAChB;AACA,QAAI,eAAe,+BAAc,OAAO;AACtC,aAAO,CAAC,QAAQ,KAAK;AAAA,IACvB;AACA,WAAO,CAAC,OAAO,MAAM;AAAA,EACvB,GAAG,CAAC,cAAc,UAAU,CAAC;AAE7B,QAAM,WAAO,sBAAQ,MAAM;AACzB,QAAI,CAAC,IAAI,EAAE,SAAS,UAAW,GAAG;AAChC,aAAO,CAAC,MAAM;AAAA,IAChB;AACA,WAAO,CAAC,QAAQ,KAAK;AAAA,EACvB,GAAG,CAAC,UAAU,CAAC;AAEf,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,aAAY;AAAA,MACZ,eAAa,2CAA0B;AAAA,MACvC,MAAM;AAAA,MAEN,uDAAC,mDAAsB,UAAtB,EAA+B,OAAO,KACrC;AAAA,qDAAC,uBAAK,MACJ;AAAA,sDAAC,4CAAiB;AAAA,UAClB,4CAAC,wDAAuB;AAAA,WAC1B;AAAA,QACC,QAAQ,SAAS,4CAAC,kDAAoB,IAAK;AAAA,SAC9C;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;AAC7B,MAAM,+BAA2B,kCAAS,cAAc,EAAE,YAAY,gBAAgB;AACtF,yBAAyB,YAAY;AAErC,MAAM,eAAe;",
   "names": []
 }

package/dist/cjs/config/constants.js

@@ -5,10 +5,6 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-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))
@@ -25,16 +21,5 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var constants_exports = {};
-__export(constants_exports, {
-  FONT_DETECTOR: () => FONT_DETECTOR
-});
-module.exports = __toCommonJS(constants_exports);
 var React = __toESM(require("react"));
-const FONT_DETECTOR = {
-  SMALL: 1,
-  MEDIUM: 2,
-  LARGE: 3
-};
 //# sourceMappingURL=constants.js.map

package/dist/cjs/config/constants.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/config/constants.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export const FONT_DETECTOR = {\n  SMALL: 1,\n  MEDIUM: 2,\n  LARGE: 3,\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,gBAAgB;AAAA,EAC3B,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT;",
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAuB;",
   "names": []
 }

package/dist/cjs/config/useGlobalHeader.js

@@ -37,11 +37,11 @@ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
 var import_react = require("react");
 var import_uid = require("uid");
 var import_react_desc_prop_types = require("../react-desc-prop-types.js");
-var import_constants = require("./constants.js");
+var import_constants = require("../constants/index.js");
 const useGlobalHeader = (props) => {
   const [showIconOnly, setShowIconOnly] = (0, import_react.useState)(false);
   const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
-  const instanceUID = (0, import_react.useMemo)(() => (0, import_uid.uid)(5), []);
+  const instanceUID = (0, import_react.useMemo)(() => `ds-global-header-${(0, import_uid.uid)(5)}`, []);
   const globalHeaderToolbarGrid = (0, import_react.useMemo)(
     () => new Array(propsWithDefaults.toolbar.length).fill("auto"),
     [propsWithDefaults.toolbar]

package/dist/cjs/config/useGlobalHeader.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/config/useGlobalHeader.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useFontsizeMedia } from '@elliemae/ds-hooks-fontsize-media';\nimport { useMemoMergePropsWithDefault, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { useMemo, useState } from 'react';\nimport { uid } from 'uid';\nimport { defaultProps, type DSGlobalHeaderT } from '../react-desc-prop-types.js';\nimport { FONT_DETECTOR } from './constants.js';\n\nexport const useGlobalHeader = (props: DSGlobalHeaderT.Props) => {\n  const [showIconOnly, setShowIconOnly] = useState<boolean>(false);\n\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSGlobalHeaderT.InternalProps>(props, defaultProps);\n\n  const instanceUID = useMemo(() => uid(5), []);\n\n  const globalHeaderToolbarGrid = useMemo(\n    () => new Array(propsWithDefaults.toolbar.length).fill('auto') as string[],\n    [propsWithDefaults.toolbar],\n  );\n\n  const ownerProps = useOwnerProps(props);\n\n  const fontDetector = useFontsizeMedia({\n    largeFont: FONT_DETECTOR.LARGE,\n    mediumFont: FONT_DETECTOR.MEDIUM,\n    smallFont: FONT_DETECTOR.SMALL,\n  });\n\n  return useMemo(\n    () => ({\n      props: propsWithDefaults,\n      showIconOnly,\n      setShowIconOnly,\n      instanceUID,\n      globalHeaderToolbarGrid,\n      fontDetector,\n      ownerProps,\n    }),\n    [propsWithDefaults, ownerProps, showIconOnly, instanceUID, fontDetector, globalHeaderToolbarGrid],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,qCAAiC;AACjC,8BAA4D;AAC5D,mBAAkC;AAClC,iBAAoB;AACpB,mCAAmD;AACnD,uBAA8B;AAEvB,MAAM,kBAAkB,CAAC,UAAiC;AAC/D,QAAM,CAAC,cAAc,eAAe,QAAI,uBAAkB,KAAK;AAE/D,QAAM,wBAAoB,sDAA4D,OAAO,yCAAY;AAEzG,QAAM,kBAAc,sBAAQ,UAAM,gBAAI,CAAC,GAAG,CAAC,CAAC;AAE5C,QAAM,8BAA0B;AAAA,IAC9B,MAAM,IAAI,MAAM,kBAAkB,QAAQ,MAAM,EAAE,KAAK,MAAM;AAAA,IAC7D,CAAC,kBAAkB,OAAO;AAAA,EAC5B;AAEA,QAAM,iBAAa,uCAAc,KAAK;AAEtC,QAAM,mBAAe,iDAAiB;AAAA,IACpC,WAAW,+BAAc;AAAA,IACzB,YAAY,+BAAc;AAAA,IAC1B,WAAW,+BAAc;AAAA,EAC3B,CAAC;AAED,aAAO;AAAA,IACL,OAAO;AAAA,MACL,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,YAAY,cAAc,aAAa,cAAc,uBAAuB;AAAA,EAClG;AACF;",
+  "sourcesContent": ["import { useFontsizeMedia } from '@elliemae/ds-hooks-fontsize-media';\nimport { useMemoMergePropsWithDefault, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { useMemo, useState } from 'react';\nimport { uid } from 'uid';\nimport { defaultProps, type DSGlobalHeaderT } from '../react-desc-prop-types.js';\nimport { FONT_DETECTOR } from '../constants/index.js';\n\nexport const useGlobalHeader = (props: DSGlobalHeaderT.Props) => {\n  const [showIconOnly, setShowIconOnly] = useState<boolean>(false);\n\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSGlobalHeaderT.InternalProps>(props, defaultProps);\n\n  const instanceUID = useMemo(() => `ds-global-header-${uid(5)}`, []);\n\n  const globalHeaderToolbarGrid = useMemo(\n    () => new Array(propsWithDefaults.toolbar.length).fill('auto') as string[],\n    [propsWithDefaults.toolbar],\n  );\n\n  const ownerProps = useOwnerProps(props);\n\n  const fontDetector = useFontsizeMedia({\n    largeFont: FONT_DETECTOR.LARGE,\n    mediumFont: FONT_DETECTOR.MEDIUM,\n    smallFont: FONT_DETECTOR.SMALL,\n  });\n\n  return useMemo(\n    () => ({\n      props: propsWithDefaults,\n      showIconOnly,\n      setShowIconOnly,\n      instanceUID,\n      globalHeaderToolbarGrid,\n      fontDetector,\n      ownerProps,\n    }),\n    [propsWithDefaults, ownerProps, showIconOnly, instanceUID, fontDetector, globalHeaderToolbarGrid],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,qCAAiC;AACjC,8BAA4D;AAC5D,mBAAkC;AAClC,iBAAoB;AACpB,mCAAmD;AACnD,uBAA8B;AAEvB,MAAM,kBAAkB,CAAC,UAAiC;AAC/D,QAAM,CAAC,cAAc,eAAe,QAAI,uBAAkB,KAAK;AAE/D,QAAM,wBAAoB,sDAA4D,OAAO,yCAAY;AAEzG,QAAM,kBAAc,sBAAQ,MAAM,wBAAoB,gBAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAElE,QAAM,8BAA0B;AAAA,IAC9B,MAAM,IAAI,MAAM,kBAAkB,QAAQ,MAAM,EAAE,KAAK,MAAM;AAAA,IAC7D,CAAC,kBAAkB,OAAO;AAAA,EAC5B;AAEA,QAAM,iBAAa,uCAAc,KAAK;AAEtC,QAAM,mBAAe,iDAAiB;AAAA,IACpC,WAAW,+BAAc;AAAA,IACzB,YAAY,+BAAc;AAAA,IAC1B,WAAW,+BAAc;AAAA,EAC3B,CAAC;AAED,aAAO;AAAA,IACL,OAAO;AAAA,MACL,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,YAAY,cAAc,aAAa,cAAc,uBAAuB;AAAA,EAClG;AACF;",
   "names": []
 }

package/dist/cjs/constants/index.js

@@ -0,0 +1,176 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var constants_exports = {};
+__export(constants_exports, {
+  DSGlobalHeaderDatatestid: () => DSGlobalHeaderDatatestid,
+  DSGlobalHeaderDatatestidFlattened: () => DSGlobalHeaderDatatestidFlattened,
+  DSGlobalHeaderName: () => DSGlobalHeaderName,
+  DSGlobalHeaderSlots: () => DSGlobalHeaderSlots,
+  DSGlobalHeaderSlotsFlattened: () => DSGlobalHeaderSlotsFlattened,
+  FONT_DETECTOR: () => FONT_DETECTOR,
+  GLOBAL_HEADER_DATA_TESTID: () => GLOBAL_HEADER_DATA_TESTID,
+  GLOBAL_HEADER_SLOTS: () => GLOBAL_HEADER_SLOTS
+});
+module.exports = __toCommonJS(constants_exports);
+var React = __toESM(require("react"));
+var import_ds_system = require("@elliemae/ds-system");
+const DSGlobalHeaderName = "DSGlobalheader";
+const DSGlobalHeaderSlots = {
+  CONTAINER: "root",
+  LOGO: {
+    CONTAINER: "logo-container"
+  },
+  BREADCRUMB: {
+    CONTAINER: "breadcrumb-container",
+    PIPE: "breadcrumb-pipe",
+    CHEVRON: "breadcrumb-chevron",
+    LIST: "breadcrumb-list",
+    ITEM: "breadcrumb-item",
+    ITEM_LINK: "breadcrumb-item-link",
+    ITEM_LINK_LABEL: "breadcrumb-item-link-label"
+  },
+  MENUBAR: {
+    CONTAINER: "menubar-container",
+    LIST: "menubar-list",
+    ITEM: "menubar-item",
+    ITEM_BUTTON: "menubar-item-button",
+    POPUP_MENU: {
+      LIST: "menubar-item-popupmenu-list",
+      ITEM: "menubar-item-popupmenu-item",
+      ITEM_BUTTON: "menubar-item-popupmenu-item-button",
+      SEPARATOR: "menubar-item-popupmenu-separator",
+      ITEM_BUTTON_LABEL: "menubar-item-popupmenu-item-label"
+    },
+    SEARCH_TOGGLE: {
+      CONTAINER: "menubar-item-searchtoggle-container"
+    }
+  }
+};
+const DSGlobalHeaderSlotsFlattened = {
+  CONTAINER: DSGlobalHeaderSlots.CONTAINER,
+  LOGO_CONTAINER: DSGlobalHeaderSlots.LOGO.CONTAINER,
+  BREADCRUMB_CONTAINER: DSGlobalHeaderSlots.BREADCRUMB.CONTAINER,
+  BREADCRUMB_PIPE: DSGlobalHeaderSlots.BREADCRUMB.PIPE,
+  BREADCRUMB_CHEVRON: DSGlobalHeaderSlots.BREADCRUMB.CHEVRON,
+  BREADCRUMB_LIST: DSGlobalHeaderSlots.BREADCRUMB.LIST,
+  BREADCRUMB_ITEM: DSGlobalHeaderSlots.BREADCRUMB.ITEM,
+  BREADCRUMB_ITEM_LINK: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK,
+  BREADCRUMB_ITEM_LINK_LABEL: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK_LABEL,
+  MENUBAR_CONTAINER: DSGlobalHeaderSlots.MENUBAR.CONTAINER,
+  MENUBAR_LIST: DSGlobalHeaderSlots.MENUBAR.LIST,
+  MENUBAR_ITEM: DSGlobalHeaderSlots.MENUBAR.ITEM,
+  MENUBAR_ITEM_BUTTON: DSGlobalHeaderSlots.MENUBAR.ITEM_BUTTON,
+  MENUBAR_POPUP_MENU_LIST: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.LIST,
+  MENUBAR_POPUP_MENU_ITEM: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM,
+  MENUBAR_POPUP_MENU_ITEM_BUTTON: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON,
+  MENUBAR_POPUP_MENU_SEPARATOR: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.SEPARATOR,
+  MENUBAR_POPUP_MENU_ITEM_BUTTON_LABEL: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON_LABEL,
+  MENUBAR_SEARCH_TOGGLE_CONTAINER: DSGlobalHeaderSlots.MENUBAR.SEARCH_TOGGLE.CONTAINER
+};
+const DSGlobalHeaderDatatestid = {
+  CONTAINER: "ds-global-header",
+  LOGO: {
+    CONTAINER: "ds-global-header-logo-container"
+  },
+  BREADCRUMB: {
+    CHEVRON: "ds-globalheader-breadcrumb-chevron",
+    CONTAINER: "ds-global-header-breadcrumb-container",
+    PIPE: "ds-global-header-breadcrumb-pipe",
+    LIST: "ds-global-header-breadcrumb-list",
+    ITEM: "ds-global-header-breadcrumb-item",
+    ITEM_LINK: "gh-breadcrumb-btn",
+    ITEM_LINK_LABEL: "ds-global-header-breadcrumb-item-link-label"
+  },
+  MENUBAR: {
+    CONTAINER: "ds-global-header-menubar-container",
+    LIST: "ds-global-header-menubar-list",
+    ITEM: "ds-global-header-menubar-item",
+    ITEM_BUTTON: "gh-toolbar-item",
+    POPUP_MENU: {
+      LIST: "ds-global-header-menubar-item-popupmenu-list",
+      ITEM: "ds-global-header-menubar-item-popupmenu-item",
+      ITEM_BUTTON: "ds-global-header-menubar-item-popupmenu-item-button",
+      ITEM_BUTTON_LABEL: "ds-global-header-menubar-item-popupmenu-item-label",
+      SEPARATOR: "ds-global-header-menubar-item-popupmenu-separator"
+    },
+    SEARCH_TOGGLE: {
+      CONTAINER: "ds-global-header-menubar-item-searchtoggle-container",
+      ITEM_BUTTON: "gh-toolbar-item"
+    }
+  }
+};
+const DSGlobalHeaderDatatestidFlattened = {
+  CONTAINER: "ds-global-header",
+  LOGO_CONTAINER: "ds-global-header-logo-container",
+  BREADCRUMB_CONTAINER: "ds-global-header-breadcrumb-container",
+  BREADCRUMB_PIPE: "ds-global-header-breadcrumb-pipe",
+  BREADCRUMB_LIST: "ds-global-header-breadcrumb-list",
+  BREADCRUMB_ITEM: "ds-global-header-breadcrumb-item",
+  BREADCRUMB_ITEM_LINK: "gh-breadcrumb-btn",
+  BREADCRUMB_ITEM_LINK_LABEL: "ds-global-header-breadcrumb-item-link-label",
+  BREADCRUMB_CHEVRON: "ds-globalheader-breadcrumb-chevron",
+  MENUBAR_CONTAINER: "ds-global-header-menubar-container",
+  MENUBAR_LIST: "ds-global-header-menubar-list",
+  MENUBAR_ITEM: "ds-global-header-menubar-item",
+  MENUBAR_ITEM_BUTTON: "gh-toolbar-item",
+  MENUBAR_POPUP_MENU_LIST: "ds-global-header-menubar-item-popupmenu-list",
+  MENUBAR_POPUP_MENU_ITEM: "ds-global-header-menubar-item-popupmenu-item",
+  MENUBAR_POPUP_MENU_ITEM_BUTTON: "ds-global-header-menubar-item-popupmenu-item-button",
+  MENUBAR_POPUP_MENU_ITEM_LABEL: "ds-global-header-menubar-item-popupmenu-item-label",
+  MENUBAR_POPUP_MENU_SEPARATOR: "ds-global-header-menubar-item-popupmenu-separator",
+  MENUBAR_SEARCH_TOGGLE_CONTAINER: "ds-global-header-menubar-item-searchtoggle-container",
+  MENUBAR_SEARCH_TOGGLE_ITEM_BUTTON: "gh-toolbar-item"
+};
+const FONT_DETECTOR = {
+  SMALL: 1,
+  MEDIUM: 2,
+  LARGE: 3
+};
+const GLOBAL_HEADER_SLOTS = {
+  ...DSGlobalHeaderSlotsFlattened,
+  // the following slots are completely new, added to the component post BREAKING CHANGES
+  //   https://confluence.ice.com/x/6SqFPQ
+  //  [Breaking Changes] Global Header - Search Toggle
+  //  hence, given they are new, we are not adding them to the legacy variables, we are not going to overwrite the auto-generation pattern.
+  SEARCH_TOGGLE_SPINBUTTON_WRAPPER: "searchtoggle-spinbutton-wrapper",
+  SEARCH_TOGGLE_SPINBUTTON_TEXT: "searchtoggle-spinbutton-text",
+  SEARCH_TOGGLE_SPINBUTTON_SEPARATOR: "searchtoggle-spinbutton-separator",
+  SEARCH_TOGGLE_SPINBUTTON_PREV: "searchtoggle-spinbutton-prev",
+  SEARCH_TOGGLE_SPINBUTTON_NEXT: "searchtoggle-spinbutton-next",
+  SEARCH_TOGGLE_TEXTINPUT: "searchtoggle-textinput",
+  SEARCH_TOGGLE_TRIGGER_BUTTON: "searchtoggle-trigger-button",
+  SEARCH_TOGGLE_EXPANDED_CONTENT_WRAPPER: "searchtoggle-expanded-content-wrapper"
+};
+const GLOBAL_HEADER_DATA_TESTID = {
+  ...(0, import_ds_system.slotObjectToDataTestIds)(DSGlobalHeaderName, GLOBAL_HEADER_SLOTS),
+  // this are the "hardcoded" data-testid that maps to the slots in the component that we keep as they were for backwards compatibility
+  ...DSGlobalHeaderDatatestidFlattened,
+  SEARCH_TOGGLE_TRIGGER_BUTTON: "gh-toolbar-item"
+};
+//# sourceMappingURL=index.js.map

package/dist/cjs/constants/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/constants/index.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSGlobalHeaderName = 'DSGlobalheader';\n\n/* ************************************************************************************************\n * LEGACY VARIABLES\n * ************************************************************************************************\n *   WE KEEP THIS AROUND TO AVOID BREAKING CHANGES\n *   THE NEW VARIABLES INHERIT FROM THIS TO AVOID BREAKING CHANGES!!!\n ************************************************************************************************ */\n\n/**\n * @deprecated - use GLOBAL_HEADER_SLOTS instead, it containse the full list and is flat.\n */\nexport const DSGlobalHeaderSlots = {\n  CONTAINER: 'root',\n  LOGO: {\n    CONTAINER: 'logo-container',\n  },\n  BREADCRUMB: {\n    CONTAINER: 'breadcrumb-container',\n    PIPE: 'breadcrumb-pipe',\n    CHEVRON: 'breadcrumb-chevron',\n    LIST: 'breadcrumb-list',\n    ITEM: 'breadcrumb-item',\n    ITEM_LINK: 'breadcrumb-item-link',\n    ITEM_LINK_LABEL: 'breadcrumb-item-link-label',\n  },\n  MENUBAR: {\n    CONTAINER: 'menubar-container',\n    LIST: 'menubar-list',\n    ITEM: 'menubar-item',\n    ITEM_BUTTON: 'menubar-item-button',\n    POPUP_MENU: {\n      LIST: 'menubar-item-popupmenu-list',\n      ITEM: 'menubar-item-popupmenu-item',\n      ITEM_BUTTON: 'menubar-item-popupmenu-item-button',\n      SEPARATOR: 'menubar-item-popupmenu-separator',\n      ITEM_BUTTON_LABEL: 'menubar-item-popupmenu-item-label',\n    },\n    SEARCH_TOGGLE: {\n      CONTAINER: 'menubar-item-searchtoggle-container',\n    },\n  },\n};\n/**\n * @deprecated - use GLOBAL_HEADER_SLOTS instead, it containse the full list.\n */\nexport const DSGlobalHeaderSlotsFlattened = {\n  CONTAINER: DSGlobalHeaderSlots.CONTAINER,\n  LOGO_CONTAINER: DSGlobalHeaderSlots.LOGO.CONTAINER,\n  BREADCRUMB_CONTAINER: DSGlobalHeaderSlots.BREADCRUMB.CONTAINER,\n  BREADCRUMB_PIPE: DSGlobalHeaderSlots.BREADCRUMB.PIPE,\n  BREADCRUMB_CHEVRON: DSGlobalHeaderSlots.BREADCRUMB.CHEVRON,\n  BREADCRUMB_LIST: DSGlobalHeaderSlots.BREADCRUMB.LIST,\n  BREADCRUMB_ITEM: DSGlobalHeaderSlots.BREADCRUMB.ITEM,\n  BREADCRUMB_ITEM_LINK: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK,\n  BREADCRUMB_ITEM_LINK_LABEL: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK_LABEL,\n  MENUBAR_CONTAINER: DSGlobalHeaderSlots.MENUBAR.CONTAINER,\n  MENUBAR_LIST: DSGlobalHeaderSlots.MENUBAR.LIST,\n  MENUBAR_ITEM: DSGlobalHeaderSlots.MENUBAR.ITEM,\n  MENUBAR_ITEM_BUTTON: DSGlobalHeaderSlots.MENUBAR.ITEM_BUTTON,\n  MENUBAR_POPUP_MENU_LIST: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.LIST,\n  MENUBAR_POPUP_MENU_ITEM: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM,\n  MENUBAR_POPUP_MENU_ITEM_BUTTON: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON,\n  MENUBAR_POPUP_MENU_SEPARATOR: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.SEPARATOR,\n  MENUBAR_POPUP_MENU_ITEM_BUTTON_LABEL: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON_LABEL,\n  MENUBAR_SEARCH_TOGGLE_CONTAINER: DSGlobalHeaderSlots.MENUBAR.SEARCH_TOGGLE.CONTAINER,\n};\n// maintain the same order as the original object\n// for slots showcase purpose\n/**\n * @deprecated - use GLOBAL_HEADER_DATA_TESTID instead, it containse the full list and is flat.\n */\nexport const DSGlobalHeaderDatatestid = {\n  CONTAINER: 'ds-global-header',\n  LOGO: {\n    CONTAINER: 'ds-global-header-logo-container',\n  },\n  BREADCRUMB: {\n    CHEVRON: 'ds-globalheader-breadcrumb-chevron',\n    CONTAINER: 'ds-global-header-breadcrumb-container',\n    PIPE: 'ds-global-header-breadcrumb-pipe',\n    LIST: 'ds-global-header-breadcrumb-list',\n    ITEM: 'ds-global-header-breadcrumb-item',\n    ITEM_LINK: 'gh-breadcrumb-btn',\n    ITEM_LINK_LABEL: 'ds-global-header-breadcrumb-item-link-label',\n  },\n  MENUBAR: {\n    CONTAINER: 'ds-global-header-menubar-container',\n    LIST: 'ds-global-header-menubar-list',\n    ITEM: 'ds-global-header-menubar-item',\n    ITEM_BUTTON: 'gh-toolbar-item',\n    POPUP_MENU: {\n      LIST: 'ds-global-header-menubar-item-popupmenu-list',\n      ITEM: 'ds-global-header-menubar-item-popupmenu-item',\n      ITEM_BUTTON: 'ds-global-header-menubar-item-popupmenu-item-button',\n      ITEM_BUTTON_LABEL: 'ds-global-header-menubar-item-popupmenu-item-label',\n      SEPARATOR: 'ds-global-header-menubar-item-popupmenu-separator',\n    },\n    SEARCH_TOGGLE: {\n      CONTAINER: 'ds-global-header-menubar-item-searchtoggle-container',\n      ITEM_BUTTON: 'gh-toolbar-item',\n    },\n  },\n};\n\n// maintain the same order as the original object\n// for slots showcase purpose\n/**\n * @deprecated - use GLOBAL_HEADER_DATA_TESTID instead, it containse the full list\n */\nexport const DSGlobalHeaderDatatestidFlattened = {\n  CONTAINER: 'ds-global-header',\n  LOGO_CONTAINER: 'ds-global-header-logo-container',\n  BREADCRUMB_CONTAINER: 'ds-global-header-breadcrumb-container',\n  BREADCRUMB_PIPE: 'ds-global-header-breadcrumb-pipe',\n  BREADCRUMB_LIST: 'ds-global-header-breadcrumb-list',\n  BREADCRUMB_ITEM: 'ds-global-header-breadcrumb-item',\n  BREADCRUMB_ITEM_LINK: 'gh-breadcrumb-btn',\n  BREADCRUMB_ITEM_LINK_LABEL: 'ds-global-header-breadcrumb-item-link-label',\n  BREADCRUMB_CHEVRON: 'ds-globalheader-breadcrumb-chevron',\n  MENUBAR_CONTAINER: 'ds-global-header-menubar-container',\n  MENUBAR_LIST: 'ds-global-header-menubar-list',\n  MENUBAR_ITEM: 'ds-global-header-menubar-item',\n  MENUBAR_ITEM_BUTTON: 'gh-toolbar-item',\n  MENUBAR_POPUP_MENU_LIST: 'ds-global-header-menubar-item-popupmenu-list',\n  MENUBAR_POPUP_MENU_ITEM: 'ds-global-header-menubar-item-popupmenu-item',\n  MENUBAR_POPUP_MENU_ITEM_BUTTON: 'ds-global-header-menubar-item-popupmenu-item-button',\n  MENUBAR_POPUP_MENU_ITEM_LABEL: 'ds-global-header-menubar-item-popupmenu-item-label',\n  MENUBAR_POPUP_MENU_SEPARATOR: 'ds-global-header-menubar-item-popupmenu-separator',\n  MENUBAR_SEARCH_TOGGLE_CONTAINER: 'ds-global-header-menubar-item-searchtoggle-container',\n  MENUBAR_SEARCH_TOGGLE_ITEM_BUTTON: 'gh-toolbar-item',\n};\n\n/* ************************************************************************************************\n * From here on our it's the \"new\" convention, but adapted to inherit from the legacy variables\n ************************************************************************************************ */\nexport const FONT_DETECTOR = {\n  SMALL: 1,\n  MEDIUM: 2,\n  LARGE: 3,\n} as const;\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const GLOBAL_HEADER_SLOTS = {\n  ...DSGlobalHeaderSlotsFlattened,\n  // the following slots are completely new, added to the component post BREAKING CHANGES\n  //   https://confluence.ice.com/x/6SqFPQ\n  //  [Breaking Changes] Global Header - Search Toggle\n  //  hence, given they are new, we are not adding them to the legacy variables, we are not going to overwrite the auto-generation pattern.\n  SEARCH_TOGGLE_SPINBUTTON_WRAPPER: 'searchtoggle-spinbutton-wrapper',\n  SEARCH_TOGGLE_SPINBUTTON_TEXT: 'searchtoggle-spinbutton-text',\n  SEARCH_TOGGLE_SPINBUTTON_SEPARATOR: 'searchtoggle-spinbutton-separator',\n  SEARCH_TOGGLE_SPINBUTTON_PREV: 'searchtoggle-spinbutton-prev',\n  SEARCH_TOGGLE_SPINBUTTON_NEXT: 'searchtoggle-spinbutton-next',\n  SEARCH_TOGGLE_TEXTINPUT: 'searchtoggle-textinput',\n  SEARCH_TOGGLE_TRIGGER_BUTTON: 'searchtoggle-trigger-button',\n  SEARCH_TOGGLE_EXPANDED_CONTENT_WRAPPER: 'searchtoggle-expanded-content-wrapper',\n} as const;\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const GLOBAL_HEADER_DATA_TESTID = {\n  ...slotObjectToDataTestIds(DSGlobalHeaderName, GLOBAL_HEADER_SLOTS),\n  // this are the \"hardcoded\" data-testid that maps to the slots in the component that we keep as they were for backwards compatibility\n  ...DSGlobalHeaderDatatestidFlattened,\n  SEARCH_TOGGLE_TRIGGER_BUTTON: 'gh-toolbar-item',\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,qBAAqB;AAY3B,MAAM,sBAAsB;AAAA,EACjC,WAAW;AAAA,EACX,MAAM;AAAA,IACJ,WAAW;AAAA,EACb;AAAA,EACA,YAAY;AAAA,IACV,WAAW;AAAA,IACX,MAAM;AAAA,IACN,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,WAAW;AAAA,IACX,iBAAiB;AAAA,EACnB;AAAA,EACA,SAAS;AAAA,IACP,WAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,MACV,MAAM;AAAA,MACN,MAAM;AAAA,MACN,aAAa;AAAA,MACb,WAAW;AAAA,MACX,mBAAmB;AAAA,IACrB;AAAA,IACA,eAAe;AAAA,MACb,WAAW;AAAA,IACb;AAAA,EACF;AACF;AAIO,MAAM,+BAA+B;AAAA,EAC1C,WAAW,oBAAoB;AAAA,EAC/B,gBAAgB,oBAAoB,KAAK;AAAA,EACzC,sBAAsB,oBAAoB,WAAW;AAAA,EACrD,iBAAiB,oBAAoB,WAAW;AAAA,EAChD,oBAAoB,oBAAoB,WAAW;AAAA,EACnD,iBAAiB,oBAAoB,WAAW;AAAA,EAChD,iBAAiB,oBAAoB,WAAW;AAAA,EAChD,sBAAsB,oBAAoB,WAAW;AAAA,EACrD,4BAA4B,oBAAoB,WAAW;AAAA,EAC3D,mBAAmB,oBAAoB,QAAQ;AAAA,EAC/C,cAAc,oBAAoB,QAAQ;AAAA,EAC1C,cAAc,oBAAoB,QAAQ;AAAA,EAC1C,qBAAqB,oBAAoB,QAAQ;AAAA,EACjD,yBAAyB,oBAAoB,QAAQ,WAAW;AAAA,EAChE,yBAAyB,oBAAoB,QAAQ,WAAW;AAAA,EAChE,gCAAgC,oBAAoB,QAAQ,WAAW;AAAA,EACvE,8BAA8B,oBAAoB,QAAQ,WAAW;AAAA,EACrE,sCAAsC,oBAAoB,QAAQ,WAAW;AAAA,EAC7E,iCAAiC,oBAAoB,QAAQ,cAAc;AAC7E;AAMO,MAAM,2BAA2B;AAAA,EACtC,WAAW;AAAA,EACX,MAAM;AAAA,IACJ,WAAW;AAAA,EACb;AAAA,EACA,YAAY;AAAA,IACV,SAAS;AAAA,IACT,WAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,WAAW;AAAA,IACX,iBAAiB;AAAA,EACnB;AAAA,EACA,SAAS;AAAA,IACP,WAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,MACV,MAAM;AAAA,MACN,MAAM;AAAA,MACN,aAAa;AAAA,MACb,mBAAmB;AAAA,MACnB,WAAW;AAAA,IACb;AAAA,IACA,eAAe;AAAA,MACb,WAAW;AAAA,MACX,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAOO,MAAM,oCAAoC;AAAA,EAC/C,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,iBAAiB;AAAA,EACjB,iBAAiB;AAAA,EACjB,iBAAiB;AAAA,EACjB,sBAAsB;AAAA,EACtB,4BAA4B;AAAA,EAC5B,oBAAoB;AAAA,EACpB,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,cAAc;AAAA,EACd,qBAAqB;AAAA,EACrB,yBAAyB;AAAA,EACzB,yBAAyB;AAAA,EACzB,gCAAgC;AAAA,EAChC,+BAA+B;AAAA,EAC/B,8BAA8B;AAAA,EAC9B,iCAAiC;AAAA,EACjC,mCAAmC;AACrC;AAKO,MAAM,gBAAgB;AAAA,EAC3B,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT;AAGO,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,EAKH,kCAAkC;AAAA,EAClC,+BAA+B;AAAA,EAC/B,oCAAoC;AAAA,EACpC,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,yBAAyB;AAAA,EACzB,8BAA8B;AAAA,EAC9B,wCAAwC;AAC1C;AAEO,MAAM,4BAA4B;AAAA,EACvC,OAAG,0CAAwB,oBAAoB,mBAAmB;AAAA;AAAA,EAElE,GAAG;AAAA,EACH,8BAA8B;AAChC;",
+  "names": []
+}

package/dist/cjs/{exported-related/index.js → hooks/useOnClickOutside.js}

@@ -26,16 +26,35 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var exported_related_exports = {};
-__export(exported_related_exports, {
-  DSGlobalHeaderDatatestid: () => import_DSGlobalHeaderDatatestid.DSGlobalHeaderDatatestid,
-  DSGlobalHeaderDatatestidFlattened: () => import_DSGlobalHeaderDatatestid.DSGlobalHeaderDatatestidFlattened,
-  DSGlobalHeaderName: () => import_theming.DSGlobalHeaderName,
-  DSGlobalHeaderSlots: () => import_theming.DSGlobalHeaderSlots,
-  DSGlobalHeaderSlotsFlattened: () => import_theming.DSGlobalHeaderSlotsFlattened
+var useOnClickOutside_exports = {};
+__export(useOnClickOutside_exports, {
+  useOnClickOutside: () => useOnClickOutside
 });
-module.exports = __toCommonJS(exported_related_exports);
+module.exports = __toCommonJS(useOnClickOutside_exports);
 var React = __toESM(require("react"));
-var import_theming = require("./theming.js");
-var import_DSGlobalHeaderDatatestid = require("./DSGlobalHeaderDatatestid.js");
-//# sourceMappingURL=index.js.map
+var import_react = __toESM(require("react"));
+function useOnClickOutside(ref, cb) {
+  const cbRef = import_react.default.useRef(cb);
+  (0, import_react.useEffect)(() => {
+    cbRef.current = cb;
+  }, [cb]);
+  (0, import_react.useEffect)(() => {
+    if (!ref) {
+      return () => {
+      };
+    }
+    const listener = (event) => {
+      const target = event.target;
+      if (!target) return;
+      if (ref.contains(target)) return;
+      cbRef.current(event);
+    };
+    document.addEventListener("mousedown", listener, true);
+    document.addEventListener("touchstart", listener, true);
+    return () => {
+      document.removeEventListener("mousedown", listener, true);
+      document.removeEventListener("touchstart", listener, true);
+    };
+  }, [ref]);
+}
+//# sourceMappingURL=useOnClickOutside.js.map

package/dist/cjs/hooks/useOnClickOutside.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useOnClickOutside.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { useEffect } from 'react';\n\nexport function useOnClickOutside<T extends Node>(ref: T | null, cb: (event: Event) => void): void {\n  const cbRef = React.useRef(cb);\n\n  useEffect(() => {\n    cbRef.current = cb;\n  }, [cb]);\n\n  useEffect(() => {\n    if (!ref) {\n      return () => {};\n    }\n\n    const listener = (event: MouseEvent | TouchEvent) => {\n      const target = event.target as Node | null;\n      if (!target) return;\n\n      if (ref.contains(target)) return;\n\n      cbRef.current(event);\n    };\n\n    document.addEventListener('mousedown', listener, true);\n    document.addEventListener('touchstart', listener, true);\n\n    return () => {\n      document.removeEventListener('mousedown', listener, true);\n      document.removeEventListener('touchstart', listener, true);\n    };\n  }, [ref]);\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAiC;AAE1B,SAAS,kBAAkC,KAAe,IAAkC;AACjG,QAAM,QAAQ,aAAAA,QAAM,OAAO,EAAE;AAE7B,8BAAU,MAAM;AACd,UAAM,UAAU;AAAA,EAClB,GAAG,CAAC,EAAE,CAAC;AAEP,8BAAU,MAAM;AACd,QAAI,CAAC,KAAK;AACR,aAAO,MAAM;AAAA,MAAC;AAAA,IAChB;AAEA,UAAM,WAAW,CAAC,UAAmC;AACnD,YAAM,SAAS,MAAM;AACrB,UAAI,CAAC,OAAQ;AAEb,UAAI,IAAI,SAAS,MAAM,EAAG;AAE1B,YAAM,QAAQ,KAAK;AAAA,IACrB;AAEA,aAAS,iBAAiB,aAAa,UAAU,IAAI;AACrD,aAAS,iBAAiB,cAAc,UAAU,IAAI;AAEtD,WAAO,MAAM;AACX,eAAS,oBAAoB,aAAa,UAAU,IAAI;AACxD,eAAS,oBAAoB,cAAc,UAAU,IAAI;AAAA,IAC3D;AAAA,EACF,GAAG,CAAC,GAAG,CAAC;AACV;",
+  "names": ["React"]
+}

package/dist/cjs/index.js

@@ -29,12 +29,14 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   DSGlobalHeader: () => import_DSGlobalHeader2.DSGlobalHeader,
-  DSGlobalHeaderDatatestid: () => import_exported_related.DSGlobalHeaderDatatestid,
-  DSGlobalHeaderDatatestidFlattened: () => import_exported_related.DSGlobalHeaderDatatestidFlattened,
-  DSGlobalHeaderName: () => import_exported_related.DSGlobalHeaderName,
-  DSGlobalHeaderSlots: () => import_exported_related.DSGlobalHeaderSlots,
-  DSGlobalHeaderSlotsFlattened: () => import_exported_related.DSGlobalHeaderSlotsFlattened,
+  DSGlobalHeaderDatatestid: () => import_constants.DSGlobalHeaderDatatestid,
+  DSGlobalHeaderDatatestidFlattened: () => import_constants.DSGlobalHeaderDatatestidFlattened,
+  DSGlobalHeaderName: () => import_constants.DSGlobalHeaderName,
+  DSGlobalHeaderSlots: () => import_constants.DSGlobalHeaderSlots,
+  DSGlobalHeaderSlotsFlattened: () => import_constants.DSGlobalHeaderSlotsFlattened,
   DSGlobalHeaderWithSchema: () => import_DSGlobalHeader2.DSGlobalHeaderWithSchema,
+  GLOBAL_HEADER_DATA_TESTID: () => import_constants.GLOBAL_HEADER_DATA_TESTID,
+  GLOBAL_HEADER_SLOTS: () => import_constants.GLOBAL_HEADER_SLOTS,
   GlobalHeader: () => import_DSGlobalHeader2.GlobalHeader,
   default: () => index_default
 });
@@ -42,6 +44,6 @@ module.exports = __toCommonJS(index_exports);
 var React = __toESM(require("react"));
 var import_DSGlobalHeader = require("./DSGlobalHeader.js");
 var import_DSGlobalHeader2 = require("./DSGlobalHeader.js");
-var import_exported_related = require("./exported-related/index.js");
+var import_constants = require("./constants/index.js");
 var index_default = import_DSGlobalHeader.DSGlobalHeader;
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.ts", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { DSGlobalHeader } from './DSGlobalHeader.js';\n\nexport default DSGlobalHeader;\nexport { DSGlobalHeader, DSGlobalHeaderWithSchema, GlobalHeader } from './DSGlobalHeader.js';\nexport {\n  DSGlobalHeaderDatatestid,\n  DSGlobalHeaderDatatestidFlattened,\n  DSGlobalHeaderName,\n  DSGlobalHeaderSlots,\n  DSGlobalHeaderSlotsFlattened,\n} from './exported-related/index.js';\nexport type { DSGlobalHeaderT } from './react-desc-prop-types.js';\nexport type { DSGlobalHeaderInternalsT } from './sharedTypes.js';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,4BAA+B;AAG/B,IAAAA,yBAAuE;AACvE,8BAMO;AARP,IAAO,gBAAQ;",
+  "sourcesContent": ["import { DSGlobalHeader } from './DSGlobalHeader.js';\n\nexport default DSGlobalHeader;\nexport { DSGlobalHeader, DSGlobalHeaderWithSchema, GlobalHeader } from './DSGlobalHeader.js';\nexport {\n  // LEGACY VARIABLES\n  DSGlobalHeaderDatatestid,\n  DSGlobalHeaderDatatestidFlattened,\n  DSGlobalHeaderSlots,\n  DSGlobalHeaderSlotsFlattened,\n  // NEW PATTERNS INHERITING FROM THE LEGACY VARIABLES:\n  DSGlobalHeaderName,\n  GLOBAL_HEADER_SLOTS,\n  GLOBAL_HEADER_DATA_TESTID,\n} from './constants/index.js';\nexport type { DSGlobalHeaderT } from './react-desc-prop-types.js';\nexport type { DSGlobalHeaderInternalsT } from './sharedTypes.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,4BAA+B;AAG/B,IAAAA,yBAAuE;AACvE,uBAUO;AAZP,IAAO,gBAAQ;",
   "names": ["import_DSGlobalHeader"]
 }

package/dist/cjs/parts/Breadcrumb/GlobalHeaderBreadcrumb.js

@@ -38,7 +38,7 @@ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
 var import_styles = require("./styles.js");
 var import_useGlobalHeaderBreadcrumb = require("./useGlobalHeaderBreadcrumb.js");
 var import_PureBreadcrumb = require("./PureBreadcrumb.js");
-var import_exported_related = require("../../exported-related/index.js");
+var import_constants = require("../../constants/index.js");
 const GlobalHeaderBreadcrumb = () => {
   const { breadcrumb, CustomNavigation, showIconOnly, flexRegionRef, handleOnKeyDown, instanceUID, ownerProps } = (0, import_useGlobalHeaderBreadcrumb.useGlobalHeaderBreadcrumb)();
   const layoutMode = (0, import_ds_system.useGetLayoutMode)();
@@ -52,7 +52,7 @@ const GlobalHeaderBreadcrumb = () => {
       "aria-label": "breadcrumb",
       cols: ["auto", "auto", "1fr"],
       forwardedAs: "nav",
-      "data-testid": import_exported_related.DSGlobalHeaderDatatestid.BREADCRUMB.CONTAINER,
+      "data-testid": import_constants.GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_CONTAINER,
       ...ownerProps,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -60,11 +60,11 @@ const GlobalHeaderBreadcrumb = () => {
           {
             showIconOnly: smalScreen,
             "aria-hidden": true,
-            "data-testid": import_exported_related.DSGlobalHeaderDatatestid.BREADCRUMB.PIPE,
+            "data-testid": import_constants.GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_PIPE,
             ...ownerProps
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledBreadcrumbList, { "data-testid": import_exported_related.DSGlobalHeaderDatatestid.BREADCRUMB.LIST, ...ownerProps, children: CustomNavigation !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CustomNavigation, {}) : breadcrumb?.map((item) => {
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledBreadcrumbList, { "data-testid": import_constants.GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_LIST, ...ownerProps, children: CustomNavigation !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CustomNavigation, {}) : breadcrumb?.map((item) => {
           const { onClick, isSelected, label, hasNext, ...rest } = item;
           return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             import_PureBreadcrumb.PureBreadcrumb,
@@ -75,7 +75,8 @@ const GlobalHeaderBreadcrumb = () => {
               onKeyDown: onClick && handleOnKeyDown(onClick),
               ...(0, import_ds_props_helpers.getGlobalAttributes)(rest),
               onClick,
-              fullBreadcrumbListLength: breadcrumb.length
+              fullBreadcrumbListLength: breadcrumb.length,
+              ownerProps
             },
             `${instanceUID}-breadcrumb-item-${label}`
           );

package/dist/cjs/parts/Breadcrumb/GlobalHeaderBreadcrumb.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/Breadcrumb/GlobalHeaderBreadcrumb.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { useGetLayoutMode } from '@elliemae/ds-system';\nimport { getGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { StyledBreadcrumbContainer, StyledPipe, StyledBreadcrumbList } from './styles.js';\nimport { useGlobalHeaderBreadcrumb } from './useGlobalHeaderBreadcrumb.js';\nimport { PureBreadcrumb } from './PureBreadcrumb.js';\nimport { DSGlobalHeaderDatatestid } from '../../exported-related/index.js';\n\nexport const GlobalHeaderBreadcrumb = (): JSX.Element => {\n  const { breadcrumb, CustomNavigation, showIconOnly, flexRegionRef, handleOnKeyDown, instanceUID, ownerProps } =\n    useGlobalHeaderBreadcrumb();\n  const layoutMode = useGetLayoutMode();\n\n  const smalScreen = layoutMode === 'xs' || layoutMode === 's' || (!layoutMode && showIconOnly);\n\n  return (\n    <StyledBreadcrumbContainer\n      height=\"100%\"\n      alignItems=\"center\"\n      justifyContent=\"flex-start\"\n      aria-label=\"breadcrumb\"\n      cols={['auto', 'auto', '1fr']}\n      forwardedAs=\"nav\"\n      data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.CONTAINER}\n      {...ownerProps}\n    >\n      <StyledPipe\n        showIconOnly={smalScreen}\n        aria-hidden\n        data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.PIPE}\n        {...ownerProps}\n      />\n      <StyledBreadcrumbList data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.LIST} {...ownerProps}>\n        {CustomNavigation !== undefined ? (\n          <CustomNavigation />\n        ) : (\n          breadcrumb?.map((item) => {\n            const { onClick, isSelected, label, hasNext, ...rest } = item;\n            return (\n              <PureBreadcrumb\n                label={label}\n                hasNext={hasNext}\n                isSelected={isSelected}\n                key={`${instanceUID}-breadcrumb-item-${label}`}\n                onKeyDown={onClick && handleOnKeyDown(onClick)}\n                {...getGlobalAttributes(rest)}\n                onClick={onClick}\n                fullBreadcrumbListLength={breadcrumb.length}\n              />\n            );\n          })\n        )}\n      </StyledBreadcrumbList>\n      <div id=\"global-header-flex-region\" ref={flexRegionRef} aria-hidden />\n    </StyledBreadcrumbContainer>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgBnB;AAfJ,uBAAiC;AACjC,8BAAoC;AACpC,oBAA4E;AAC5E,uCAA0C;AAC1C,4BAA+B;AAC/B,8BAAyC;AAElC,MAAM,yBAAyB,MAAmB;AACvD,QAAM,EAAE,YAAY,kBAAkB,cAAc,eAAe,iBAAiB,aAAa,WAAW,QAC1G,4DAA0B;AAC5B,QAAM,iBAAa,mCAAiB;AAEpC,QAAM,aAAa,eAAe,QAAQ,eAAe,OAAQ,CAAC,cAAc;AAEhF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAO;AAAA,MACP,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,cAAW;AAAA,MACX,MAAM,CAAC,QAAQ,QAAQ,KAAK;AAAA,MAC5B,aAAY;AAAA,MACZ,eAAa,iDAAyB,WAAW;AAAA,MAChD,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,cAAc;AAAA,YACd,eAAW;AAAA,YACX,eAAa,iDAAyB,WAAW;AAAA,YAChD,GAAG;AAAA;AAAA,QACN;AAAA,QACA,4CAAC,sCAAqB,eAAa,iDAAyB,WAAW,MAAO,GAAG,YAC9E,+BAAqB,SACpB,4CAAC,oBAAiB,IAElB,YAAY,IAAI,CAAC,SAAS;AACxB,gBAAM,EAAE,SAAS,YAAY,OAAO,SAAS,GAAG,KAAK,IAAI;AACzD,iBACE;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cAEA,WAAW,WAAW,gBAAgB,OAAO;AAAA,cAC5C,OAAG,6CAAoB,IAAI;AAAA,cAC5B;AAAA,cACA,0BAA0B,WAAW;AAAA;AAAA,YAJhC,GAAG,WAAW,oBAAoB,KAAK;AAAA,UAK9C;AAAA,QAEJ,CAAC,GAEL;AAAA,QACA,4CAAC,SAAI,IAAG,6BAA4B,KAAK,eAAe,eAAW,MAAC;AAAA;AAAA;AAAA,EACtE;AAEJ;",
+  "sourcesContent": ["import React from 'react';\nimport { useGetLayoutMode } from '@elliemae/ds-system';\nimport { getGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { StyledBreadcrumbContainer, StyledPipe, StyledBreadcrumbList } from './styles.js';\nimport { useGlobalHeaderBreadcrumb } from './useGlobalHeaderBreadcrumb.js';\nimport { PureBreadcrumb } from './PureBreadcrumb.js';\nimport { GLOBAL_HEADER_DATA_TESTID } from '../../constants/index.js';\n\nexport const GlobalHeaderBreadcrumb = (): JSX.Element => {\n  const { breadcrumb, CustomNavigation, showIconOnly, flexRegionRef, handleOnKeyDown, instanceUID, ownerProps } =\n    useGlobalHeaderBreadcrumb();\n  const layoutMode = useGetLayoutMode();\n\n  const smalScreen = layoutMode === 'xs' || layoutMode === 's' || (!layoutMode && showIconOnly);\n\n  return (\n    <StyledBreadcrumbContainer\n      height=\"100%\"\n      alignItems=\"center\"\n      justifyContent=\"flex-start\"\n      aria-label=\"breadcrumb\"\n      cols={['auto', 'auto', '1fr']}\n      forwardedAs=\"nav\"\n      data-testid={GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_CONTAINER}\n      {...ownerProps}\n    >\n      <StyledPipe\n        showIconOnly={smalScreen}\n        aria-hidden\n        data-testid={GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_PIPE}\n        {...ownerProps}\n      />\n      <StyledBreadcrumbList data-testid={GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_LIST} {...ownerProps}>\n        {CustomNavigation !== undefined ? (\n          <CustomNavigation />\n        ) : (\n          breadcrumb?.map((item) => {\n            const { onClick, isSelected, label, hasNext, ...rest } = item;\n            return (\n              <PureBreadcrumb\n                label={label}\n                hasNext={hasNext}\n                isSelected={isSelected}\n                key={`${instanceUID}-breadcrumb-item-${label}`}\n                onKeyDown={onClick && handleOnKeyDown(onClick)}\n                {...getGlobalAttributes(rest)}\n                onClick={onClick}\n                fullBreadcrumbListLength={breadcrumb.length}\n                ownerProps={ownerProps}\n              />\n            );\n          })\n        )}\n      </StyledBreadcrumbList>\n      <div id=\"global-header-flex-region\" ref={flexRegionRef} aria-hidden />\n    </StyledBreadcrumbContainer>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgBnB;AAfJ,uBAAiC;AACjC,8BAAoC;AACpC,oBAA4E;AAC5E,uCAA0C;AAC1C,4BAA+B;AAC/B,uBAA0C;AAEnC,MAAM,yBAAyB,MAAmB;AACvD,QAAM,EAAE,YAAY,kBAAkB,cAAc,eAAe,iBAAiB,aAAa,WAAW,QAC1G,4DAA0B;AAC5B,QAAM,iBAAa,mCAAiB;AAEpC,QAAM,aAAa,eAAe,QAAQ,eAAe,OAAQ,CAAC,cAAc;AAEhF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAO;AAAA,MACP,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,cAAW;AAAA,MACX,MAAM,CAAC,QAAQ,QAAQ,KAAK;AAAA,MAC5B,aAAY;AAAA,MACZ,eAAa,2CAA0B;AAAA,MACtC,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,cAAc;AAAA,YACd,eAAW;AAAA,YACX,eAAa,2CAA0B;AAAA,YACtC,GAAG;AAAA;AAAA,QACN;AAAA,QACA,4CAAC,sCAAqB,eAAa,2CAA0B,iBAAkB,GAAG,YAC/E,+BAAqB,SACpB,4CAAC,oBAAiB,IAElB,YAAY,IAAI,CAAC,SAAS;AACxB,gBAAM,EAAE,SAAS,YAAY,OAAO,SAAS,GAAG,KAAK,IAAI;AACzD,iBACE;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cAEA,WAAW,WAAW,gBAAgB,OAAO;AAAA,cAC5C,OAAG,6CAAoB,IAAI;AAAA,cAC5B;AAAA,cACA,0BAA0B,WAAW;AAAA,cACrC;AAAA;AAAA,YALK,GAAG,WAAW,oBAAoB,KAAK;AAAA,UAM9C;AAAA,QAEJ,CAAC,GAEL;AAAA,QACA,4CAAC,SAAI,IAAG,6BAA4B,KAAK,eAAe,eAAW,MAAC;AAAA;AAAA;AAAA,EACtE;AAEJ;",
   "names": []
 }

package/dist/cjs/parts/Breadcrumb/PureBreadcrumb.js

@@ -34,30 +34,32 @@ module.exports = __toCommonJS(PureBreadcrumb_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = __toESM(require("react"));
-var import_exported_related = require("../../exported-related/index.js");
+var import_constants = require("../../constants/index.js");
 var import_styles = require("./styles.js");
 const PureBreadcrumb = import_react.default.memo(
-  ({ onClick, isSelected, fullBreadcrumbListLength, label, hasNext, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledBreadcrumbItem, { "data-testid": import_exported_related.DSGlobalHeaderDatatestid.BREADCRUMB.ITEM, children: [
+  ({ onClick, isSelected, fullBreadcrumbListLength, label, hasNext, ownerProps, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledBreadcrumbItem, { "data-testid": import_constants.GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_ITEM, ...ownerProps, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_styles.StyledLink,
       {
         onClick,
-        "data-testid": import_exported_related.DSGlobalHeaderDatatestid.BREADCRUMB.ITEM_LINK,
+        "data-testid": import_constants.GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_ITEM_LINK,
         "aria-current": isSelected,
         tabIndex: 0,
         ...rest,
+        ...ownerProps,
         children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           import_styles.StyledLabel,
           {
             isSelected: !!isSelected,
             isOnlyItem: fullBreadcrumbListLength === 1,
-            "data-testid": import_exported_related.DSGlobalHeaderDatatestid.BREADCRUMB.ITEM_LINK_LABEL,
+            "data-testid": import_constants.GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_ITEM_LINK_LABEL,
+            ...ownerProps,
             children: label
           }
         )
       }
     ),
-    hasNext && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledChevron, { size: "m", "aria-hidden": true })
+    hasNext && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledChevron, { size: "m", "aria-hidden": true, ...ownerProps })
   ] })
 );
 //# sourceMappingURL=PureBreadcrumb.js.map

package/dist/cjs/parts/Breadcrumb/PureBreadcrumb.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/Breadcrumb/PureBreadcrumb.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { DSGlobalHeaderDatatestid } from '../../exported-related/index.js';\nimport type { DSGlobalHeaderT } from '../../react-desc-prop-types.js';\nimport { StyledBreadcrumbItem, StyledChevron, StyledLabel, StyledLink } from './styles.js';\n\ntype PureBreadcrumbProps = DSGlobalHeaderT.BreadcrumbItem & { fullBreadcrumbListLength: number };\n\nexport const PureBreadcrumb = React.memo(\n  ({ onClick, isSelected, fullBreadcrumbListLength, label, hasNext, ...rest }: PureBreadcrumbProps) => (\n    <StyledBreadcrumbItem data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.ITEM}>\n      <StyledLink\n        onClick={onClick}\n        data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.ITEM_LINK}\n        aria-current={isSelected}\n        tabIndex={0}\n        {...rest}\n      >\n        <StyledLabel\n          isSelected={!!isSelected}\n          isOnlyItem={fullBreadcrumbListLength === 1}\n          data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.ITEM_LINK_LABEL}\n        >\n          {label}\n        </StyledLabel>\n      </StyledLink>\n      {hasNext && <StyledChevron size=\"m\" aria-hidden />}\n    </StyledBreadcrumbItem>\n  ),\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADSnB;AATJ,mBAAkB;AAClB,8BAAyC;AAEzC,oBAA6E;AAItE,MAAM,iBAAiB,aAAAA,QAAM;AAAA,EAClC,CAAC,EAAE,SAAS,YAAY,0BAA0B,OAAO,SAAS,GAAG,KAAK,MACxE,6CAAC,sCAAqB,eAAa,iDAAyB,WAAW,MACrE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAa,iDAAyB,WAAW;AAAA,QACjD,gBAAc;AAAA,QACd,UAAU;AAAA,QACT,GAAG;AAAA,QAEJ;AAAA,UAAC;AAAA;AAAA,YACC,YAAY,CAAC,CAAC;AAAA,YACd,YAAY,6BAA6B;AAAA,YACzC,eAAa,iDAAyB,WAAW;AAAA,YAEhD;AAAA;AAAA,QACH;AAAA;AAAA,IACF;AAAA,IACC,WAAW,4CAAC,+BAAc,MAAK,KAAI,eAAW,MAAC;AAAA,KAClD;AAEJ;",
+  "sourcesContent": ["import React from 'react';\nimport { GLOBAL_HEADER_DATA_TESTID } from '../../constants/index.js';\nimport type { DSGlobalHeaderT } from '../../react-desc-prop-types.js';\nimport { StyledBreadcrumbItem, StyledChevron, StyledLabel, StyledLink } from './styles.js';\n\ntype PureBreadcrumbProps = DSGlobalHeaderT.BreadcrumbItem & {\n  fullBreadcrumbListLength: number;\n  ownerProps?: {\n    getOwnerProps: () => Partial<DSGlobalHeaderT.DefaultProps>;\n    getOwnerPropsArguments: () => object;\n  };\n};\n\nexport const PureBreadcrumb = React.memo(\n  ({ onClick, isSelected, fullBreadcrumbListLength, label, hasNext, ownerProps, ...rest }: PureBreadcrumbProps) => (\n    <StyledBreadcrumbItem data-testid={GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_ITEM} {...ownerProps}>\n      <StyledLink\n        onClick={onClick}\n        data-testid={GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_ITEM_LINK}\n        aria-current={isSelected}\n        tabIndex={0}\n        {...rest}\n        {...ownerProps}\n      >\n        <StyledLabel\n          isSelected={!!isSelected}\n          isOnlyItem={fullBreadcrumbListLength === 1}\n          data-testid={GLOBAL_HEADER_DATA_TESTID.BREADCRUMB_ITEM_LINK_LABEL}\n          {...ownerProps}\n        >\n          {label}\n        </StyledLabel>\n      </StyledLink>\n      {hasNext && <StyledChevron size=\"m\" aria-hidden {...ownerProps} />}\n    </StyledBreadcrumbItem>\n  ),\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADenB;AAfJ,mBAAkB;AAClB,uBAA0C;AAE1C,oBAA6E;AAUtE,MAAM,iBAAiB,aAAAA,QAAM;AAAA,EAClC,CAAC,EAAE,SAAS,YAAY,0BAA0B,OAAO,SAAS,YAAY,GAAG,KAAK,MACpF,6CAAC,sCAAqB,eAAa,2CAA0B,iBAAkB,GAAG,YAChF;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAa,2CAA0B;AAAA,QACvC,gBAAc;AAAA,QACd,UAAU;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,QAEJ;AAAA,UAAC;AAAA;AAAA,YACC,YAAY,CAAC,CAAC;AAAA,YACd,YAAY,6BAA6B;AAAA,YACzC,eAAa,2CAA0B;AAAA,YACtC,GAAG;AAAA,YAEH;AAAA;AAAA,QACH;AAAA;AAAA,IACF;AAAA,IACC,WAAW,4CAAC,+BAAc,MAAK,KAAI,eAAW,MAAE,GAAG,YAAY;AAAA,KAClE;AAEJ;",
   "names": ["React"]
 }