@elliemae/ds-global-header 3.55.0-next.9 → 3.56.0-rc.1

package/dist/cjs/typescript-testing/typescript-global-header-valid.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-global-header-valid.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport React from 'react';\nimport type { DSGlobalHeaderT } from '../index.js';\nimport { DSGlobalHeader } from '../index.js';\nimport { breadcrumbItems, breadcrumbItemsAsSyntax } from './typescript-global-header-breadcrumb-types.js';\nimport { toolbarItemsStrict, toolbarItemsAsSyntax } from './typescript-global-header-toolbar-types.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSGlobalHeaderT.Props;\ntype ComponentPropsInternals = DSGlobalHeaderT.InternalProps;\ntype ComponentPropsDefaultProps = DSGlobalHeaderT.DefaultProps;\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n  breadcrumb: breadcrumbItems,\n  toolbar: toolbarItemsStrict,\n  LogoWithBrand: () => null,\n  Logo: () => null,\n};\n\nconst testPropsAsSyntax = {\n  ...testPartialDefaults,\n} as ComponentPropsForApp;\n\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n  breadcrumb: breadcrumbItems,\n  toolbar: toolbarItemsStrict,\n  LogoWithBrand: () => null,\n  Logo: () => null,\n  CustomNavigation: () => null,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n  ...testCompleteDefaults,\n};\n\nconst testInternalPropsAsSyntax = {\n  ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n  breadcrumb: breadcrumbItems,\n  toolbar: toolbarItemsStrict,\n  LogoWithBrand: () => null,\n  Logo: () => null,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n  breadcrumb: breadcrumbItemsAsSyntax,\n  toolbar: toolbarItemsAsSyntax,\n  LogoWithBrand: () => null,\n  Logo: () => null,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n  breadcrumb: breadcrumbItemsAsSyntax,\n  toolbar: toolbarItemsAsSyntax,\n  LogoWithBrand: () => null,\n  Logo: () => null,\n} as const;\n\nconst ExampleUsageComponent = () => (\n  <>\n    {/* works with explicitly casted props, all syntaxes */}\n    <DSGlobalHeader {...testExplicitDefinition} />\n    <DSGlobalHeader {...testInferedTypeCompatibility} />\n    <DSGlobalHeader {...testDefinitionAsConst} />\n    {/* works with inline values */}\n    <DSGlobalHeader\n      breadcrumb={breadcrumbItems}\n      toolbar={toolbarItemsStrict}\n      LogoWithBrand={() => null}\n      Logo={() => null}\n    />\n  </>\n);\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAuB;ACmErB;AA/DF,eAA+B;AAC/B,uDAAyD;AACzD,oDAAyD;AASzD,MAAM,sBAA2D;AAAA,EAC/D,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAEA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AACL;AAGA,MAAM,uBAA6D;AAAA,EACjE,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AAAA,EACZ,kBAAkB,MAAM;AAC1B;AAEA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AACL;AAEA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAGA,MAAM,+BAA+B;AAAA,EACnC,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAEA,MAAM,wBAAwB;AAAA,EAC5B,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAEA,MAAM,wBAAwB,MAC5B,4EAEE;AAAA,8CAAC,2BAAgB,GAAG,wBAAwB;AAAA,EAC5C,4CAAC,2BAAgB,GAAG,8BAA8B;AAAA,EAClD,4CAAC,2BAAgB,GAAG,uBAAuB;AAAA,EAE3C;AAAA,IAAC;AAAA;AAAA,MACC,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,eAAe,MAAM;AAAA,MACrB,MAAM,MAAM;AAAA;AAAA,EACd;AAAA,GACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { createRef } from 'react';\nimport { DSGlobalHeader } from '../index.js';\nimport type { DSGlobalHeaderInternalsT, DSGlobalHeaderT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSGlobalHeaderT.Props;\ntype ComponentPropsInternals = DSGlobalHeaderInternalsT.InternalProps;\ntype ComponentPropsDefaultProps = DSGlobalHeaderInternalsT.DefaultProps;\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n  breadcrumb: [],\n  toolbar: [],\n  LogoWithBrand: () => null,\n  Logo: () => null,\n};\n\nconst testPropsAsSyntax = {\n  ...testPartialDefaults,\n} as ComponentPropsForApp;\n\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n  breadcrumb: [],\n  toolbar: [],\n  LogoWithBrand: () => null,\n  Logo: () => null,\n  CustomNavigation: () => null,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n  ...testCompleteDefaults,\n};\n\nconst testInternalPropsAsSyntax = {\n  ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n  breadcrumb: [],\n  toolbar: [],\n  LogoWithBrand: () => null,\n  Logo: () => null,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n  breadcrumb: [],\n  toolbar: [],\n  LogoWithBrand: () => null,\n  Logo: () => null,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n  breadcrumb: [] as DSGlobalHeaderInternalsT.BreadcrumbItem[],\n  toolbar: [] as DSGlobalHeaderInternalsT.ToolbarItem[],\n  LogoWithBrand: () => null,\n  Logo: () => null,\n} as const;\n\nconst ExampleUsageComponent = () => (\n  <>\n    {/* works with explicitly casted props, all syntaxes */}\n    <DSGlobalHeader {...testExplicitDefinition} />\n    <DSGlobalHeader {...testInferedTypeCompatibility} />\n    <DSGlobalHeader {...testDefinitionAsConst} />\n    {/* works with inline values */}\n    <DSGlobalHeader breadcrumb={[]} toolbar={[]} LogoWithBrand={() => null} Logo={() => null} />\n  </>\n);\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAuB;ACgErB;AA9DF,eAA+B;AAU/B,MAAM,sBAA2D;AAAA,EAC/D,YAAY,CAAC;AAAA,EACb,SAAS,CAAC;AAAA,EACV,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAEA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AACL;AAGA,MAAM,uBAA6D;AAAA,EACjE,YAAY,CAAC;AAAA,EACb,SAAS,CAAC;AAAA,EACV,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AAAA,EACZ,kBAAkB,MAAM;AAC1B;AAEA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AACL;AAEA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,YAAY,CAAC;AAAA,EACb,SAAS,CAAC;AAAA,EACV,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAGA,MAAM,+BAA+B;AAAA,EACnC,YAAY,CAAC;AAAA,EACb,SAAS,CAAC;AAAA,EACV,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAEA,MAAM,wBAAwB;AAAA,EAC5B,YAAY,CAAC;AAAA,EACb,SAAS,CAAC;AAAA,EACV,eAAe,MAAM;AAAA,EACrB,MAAM,MAAM;AACd;AAEA,MAAM,wBAAwB,MAC5B,4EAEE;AAAA,8CAAC,2BAAgB,GAAG,wBAAwB;AAAA,EAC5C,4CAAC,2BAAgB,GAAG,8BAA8B;AAAA,EAClD,4CAAC,2BAAgB,GAAG,uBAAuB;AAAA,EAE3C,4CAAC,2BAAe,YAAY,CAAC,GAAG,SAAS,CAAC,GAAG,eAAe,MAAM,MAAM,MAAM,MAAM,MAAM;AAAA,GAC5F;",
   "names": []
 }

package/dist/esm/DSGlobalHeader.js

@@ -4,7 +4,7 @@ import { useMemo } from "react";
 import { Grid } from "@elliemae/ds-grid";
 import { useGetLayoutMode } from "@elliemae/ds-system";
 import { useGetGlobalAttributes, useGetXstyledProps, describe } from "@elliemae/ds-props-helpers";
-import { DSGlobalHeaderPropTypesSchema } from "./react-desc-prop-types.js";
+import { propTypes } from "./react-desc-prop-types.js";
 import { GlobalHeaderLogo } from "./parts/Logo/GlobalHeaderLogo.js";
 import { GlobalHeaderBreadcrumb } from "./parts/Breadcrumb/GlobalHeaderBreadcrumb.js";
 import { GlobalHeaderToolbar } from "./parts/Toolbar/GlobalHeaderToolbar.js";
@@ -68,7 +68,7 @@ const DSGlobalHeader = (props) => {
 };
 DSGlobalHeader.displayName = DSGlobalHeaderName;
 const DSGlobalHeaderWithSchema = describe(DSGlobalHeader).description("DSGlobalHeader");
-DSGlobalHeaderWithSchema.propTypes = DSGlobalHeaderPropTypesSchema;
+DSGlobalHeaderWithSchema.propTypes = propTypes;
 const GlobalHeader = DSGlobalHeader;
 export {
   DSGlobalHeader,

package/dist/esm/DSGlobalHeader.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSGlobalHeader.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
-  "mappings": "AAAA,YAAY,WAAW;AC6Df,SACE,KADF;AA7DR,SAAgB,eAAe;AAC/B,SAAuB,YAAY;AACnC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB,oBAAoB,gBAAgB;AACrE,SAAS,qCAA2D;AACpE,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AACvC,SAAS,2BAA2B;AACpC,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AACnC,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAE1B,MAAM,iBAAiB,CAAC,UAA8C;AACpE,mBAAiB,KAAK;AACtB,QAAM,MAAM,gBAAgB,KAAK;AACjC,QAAM;AAAA,IACJ,OAAO,EAAE,QAAQ;AAAA,IACjB;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,oBAAoB,IAAI;AAC9B,QAAM,cAAc,uBAA6E,iBAAiB;AAClH,QAAM,eAAe,mBAAmB,iBAAiB;AACzD,QAAM,aAAa,iBAAiB;AAEpC,QAAM,QAAQ,QAAQ,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,cAAc,OAAO;AACtC,aAAO,CAAC,QAAQ,KAAK;AAAA,IACvB;AACA,WAAO,CAAC,OAAO,MAAM;AAAA,EACvB,GAAG,CAAC,cAAc,UAAU,CAAC;AAE7B,QAAM,OAAO,QAAQ,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,+BAAC,sBAAsB,UAAtB,EAA+B,OAAO,KACrC;AAAA,6BAAC,QAAK,MACJ;AAAA,8BAAC,oBAAiB;AAAA,UAClB,oBAAC,0BAAuB;AAAA,WAC1B;AAAA,QACC,QAAQ,SAAS,oBAAC,uBAAoB,IAAK;AAAA,SAC9C;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;AAC7B,MAAM,2BAA2B,SAAS,cAAc,EAAE,YAAY,gBAAgB;AACtF,yBAAyB,YAAY;AAErC,MAAM,eAAe;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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 { propTypes, 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 = propTypes;\n\nconst GlobalHeader = DSGlobalHeader;\n\nexport { GlobalHeader, DSGlobalHeader, DSGlobalHeaderWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC6Df,SACE,KADF;AA7DR,SAAgB,eAAe;AAC/B,SAAuB,YAAY;AACnC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB,oBAAoB,gBAAgB;AACrE,SAAS,iBAAuC;AAChD,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AACvC,SAAS,2BAA2B;AACpC,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AACnC,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAE1B,MAAM,iBAAiB,CAAC,UAA8C;AACpE,mBAAiB,KAAK;AACtB,QAAM,MAAM,gBAAgB,KAAK;AACjC,QAAM;AAAA,IACJ,OAAO,EAAE,QAAQ;AAAA,IACjB;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,oBAAoB,IAAI;AAC9B,QAAM,cAAc,uBAA6E,iBAAiB;AAClH,QAAM,eAAe,mBAAmB,iBAAiB;AACzD,QAAM,aAAa,iBAAiB;AAEpC,QAAM,QAAQ,QAAQ,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,cAAc,OAAO;AACtC,aAAO,CAAC,QAAQ,KAAK;AAAA,IACvB;AACA,WAAO,CAAC,OAAO,MAAM;AAAA,EACvB,GAAG,CAAC,cAAc,UAAU,CAAC;AAE7B,QAAM,OAAO,QAAQ,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,+BAAC,sBAAsB,UAAtB,EAA+B,OAAO,KACrC;AAAA,6BAAC,QAAK,MACJ;AAAA,8BAAC,oBAAiB;AAAA,UAClB,oBAAC,0BAAuB;AAAA,WAC1B;AAAA,QACC,QAAQ,SAAS,oBAAC,uBAAoB,IAAK;AAAA,SAC9C;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;AAC7B,MAAM,2BAA2B,SAAS,cAAc,EAAE,YAAY,gBAAgB;AACtF,yBAAyB,YAAY;AAErC,MAAM,eAAe;",
   "names": []
 }

package/dist/esm/DSGlobalHeaderContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSGlobalHeaderContext.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext } from 'react';\nimport type { DSGlobalHeaderT } from './react-desc-prop-types.js';\n\nconst defaultContext = {} as DSGlobalHeaderT.Context;\n\nexport const DSGlobalHeaderContext = createContext<DSGlobalHeaderT.Context>(defaultContext);\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,qBAAqB;AAG9B,MAAM,iBAAiB,CAAC;AAEjB,MAAM,wBAAwB,cAAuC,cAAc;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext } from 'react';\nimport type { DSGlobalHeaderInternalsT } from './sharedTypes.js';\n\nconst defaultContext = {} as DSGlobalHeaderInternalsT.Context;\n\nexport const DSGlobalHeaderContext = createContext<DSGlobalHeaderInternalsT.Context>(defaultContext);\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,qBAAqB;AAG9B,MAAM,iBAAiB,CAAC;AAEjB,MAAM,wBAAwB,cAAgD,cAAc;",
   "names": []
 }

package/dist/esm/config/useGlobalHeader.js

@@ -1,8 +1,8 @@
 import * as React from "react";
+import { useState, useMemo } from "react";
+import { uid } from "uid";
 import { useFontsizeMedia } from "@elliemae/ds-hooks-fontsize-media";
 import { useMemoMergePropsWithDefault, useOwnerProps } from "@elliemae/ds-props-helpers";
-import { useMemo, useState } from "react";
-import { uid } from "uid";
 import { defaultProps } from "../react-desc-prop-types.js";
 import { FONT_DETECTOR } from "./constants.js";
 const useGlobalHeader = (props) => {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useGlobalHeader.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,wBAAwB;AACjC,SAAS,8BAA8B,qBAAqB;AAC5D,SAAS,SAAS,gBAAgB;AAClC,SAAS,WAAW;AACpB,SAAS,oBAA0C;AACnD,SAAS,qBAAqB;AAEvB,MAAM,kBAAkB,CAAC,UAAiC;AAC/D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAkB,KAAK;AAE/D,QAAM,oBAAoB,6BAA4D,OAAO,YAAY;AAEzG,QAAM,cAAc,QAAQ,MAAM,IAAI,CAAC,GAAG,CAAC,CAAC;AAE5C,QAAM,0BAA0B;AAAA,IAC9B,MAAM,IAAI,MAAM,kBAAkB,QAAQ,MAAM,EAAE,KAAK,MAAM;AAAA,IAC7D,CAAC,kBAAkB,OAAO;AAAA,EAC5B;AAEA,QAAM,aAAa,cAAc,KAAK;AAEtC,QAAM,eAAe,iBAAiB;AAAA,IACpC,WAAW,cAAc;AAAA,IACzB,YAAY,cAAc;AAAA,IAC1B,WAAW,cAAc;AAAA,EAC3B,CAAC;AAED,SAAO;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 * as React from 'react';\nexport { React };\n", "import { useState, useMemo } from 'react';\nimport { uid } from 'uid';\nimport { useFontsizeMedia } from '@elliemae/ds-hooks-fontsize-media';\nimport { useMemoMergePropsWithDefault, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { defaultProps, type DSGlobalHeaderT } from '../react-desc-prop-types.js';\nimport { type DSGlobalHeaderInternalsT } from '../sharedTypes.js';\n\nimport { FONT_DETECTOR } from './constants.js';\nexport const useGlobalHeader = (props: DSGlobalHeaderT.Props) => {\n  const [showIconOnly, setShowIconOnly] = useState<boolean>(false);\n\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSGlobalHeaderInternalsT.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"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,UAAU,eAAe;AAClC,SAAS,WAAW;AACpB,SAAS,wBAAwB;AACjC,SAAS,8BAA8B,qBAAqB;AAC5D,SAAS,oBAA0C;AAGnD,SAAS,qBAAqB;AACvB,MAAM,kBAAkB,CAAC,UAAiC;AAC/D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAkB,KAAK;AAE/D,QAAM,oBAAoB,6BAAqE,OAAO,YAAY;AAElH,QAAM,cAAc,QAAQ,MAAM,IAAI,CAAC,GAAG,CAAC,CAAC;AAE5C,QAAM,0BAA0B;AAAA,IAC9B,MAAM,IAAI,MAAM,kBAAkB,QAAQ,MAAM,EAAE,KAAK,MAAM;AAAA,IAC7D,CAAC,kBAAkB,OAAO;AAAA,EAC5B;AAEA,QAAM,aAAa,cAAc,KAAK;AAEtC,QAAM,eAAe,iBAAiB;AAAA,IACpC,WAAW,cAAc;AAAA,IACzB,YAAY,cAAc;AAAA,IAC1B,WAAW,cAAc;AAAA,EAC3B,CAAC;AAED,SAAO;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/esm/config/useValidateProps.js

@@ -1,12 +1,12 @@
 import * as React from "react";
 import {
-  isObject,
-  isValidToolbarType,
-  throwBreadcrumbItemError,
-  throwLogoError,
+  throwToolbarPopupItemError,
   throwToolbarAppPickerItemError,
   throwToolbarItemGenericError,
-  throwToolbarPopupItemError
+  throwLogoError,
+  throwBreadcrumbItemError,
+  isValidToolbarType,
+  isObject
 } from "./validateHelpers.js";
 const validatePopupItem = (componentProps) => {
   if (componentProps.options && !Array.isArray(componentProps.options)) {

package/dist/esm/config/useValidateProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useValidateProps.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSGlobalHeaderT } from '../react-desc-prop-types.js';\nimport {\n  isObject,\n  isValidToolbarType,\n  throwBreadcrumbItemError,\n  throwLogoError,\n  throwToolbarAppPickerItemError,\n  throwToolbarItemGenericError,\n  throwToolbarPopupItemError,\n} from './validateHelpers.js';\n\nconst validatePopupItem = (componentProps: DSGlobalHeaderT.PopupMenuComponentProps): void => {\n  if (componentProps.options && !Array.isArray(componentProps.options)) {\n    throwToolbarPopupItemError('options', componentProps.options);\n  }\n  if (componentProps.closeOnClick && typeof componentProps.closeOnClick !== 'boolean') {\n    throwToolbarPopupItemError('closeOnClick', componentProps.closeOnClick);\n  }\n};\n\nconst validateAppPickerItem = (componentProps: DSGlobalHeaderT.AppPickerComponentProps): void => {\n  if (componentProps.apps && !Array.isArray(componentProps.apps)) {\n    throwToolbarAppPickerItemError('apps', componentProps.apps);\n  }\n  if (componentProps.customApps && !Array.isArray(componentProps.customApps)) {\n    throwToolbarAppPickerItemError('customApps', componentProps.customApps);\n  }\n  if (componentProps.sectionTitle && typeof componentProps.sectionTitle !== 'string') {\n    throwToolbarAppPickerItemError('sectionTitle', componentProps.sectionTitle);\n  }\n  if (componentProps.customSectionTitle && typeof componentProps.customSectionTitle !== 'string') {\n    throwToolbarAppPickerItemError('customSectionTitle', componentProps.customSectionTitle);\n  }\n};\n\nexport const useValidateProps = (props: DSGlobalHeaderT.Props): void => {\n  const { breadcrumb, toolbar, Logo, LogoWithBrand } = props;\n\n  if (Logo && typeof Logo !== 'function') {\n    throwLogoError('Logo', Logo);\n  }\n\n  if (LogoWithBrand && typeof LogoWithBrand !== 'function') {\n    throwLogoError('LogoWithBrand', LogoWithBrand);\n  }\n\n  breadcrumb?.forEach((breadcrumbItem) => {\n    if (breadcrumbItem.label && typeof breadcrumbItem.label !== 'string') {\n      throwBreadcrumbItemError('label', breadcrumbItem.label);\n    }\n    if (breadcrumbItem.onClick && typeof breadcrumbItem.onClick !== 'function') {\n      throwBreadcrumbItemError('onClick', breadcrumbItem.onClick);\n    }\n    if (breadcrumbItem.hasNext && typeof breadcrumbItem.hasNext !== 'boolean') {\n      throwBreadcrumbItemError('hasNext', breadcrumbItem.hasNext);\n    }\n    if (breadcrumbItem.isSelected && typeof breadcrumbItem.isSelected !== 'boolean') {\n      throwBreadcrumbItemError('isSelected', breadcrumbItem.isSelected);\n    }\n  });\n\n  toolbar?.forEach((toolbarItem) => {\n    if (toolbarItem.type) {\n      if (!isValidToolbarType(toolbarItem.type)) {\n        throwToolbarItemGenericError('type', toolbarItem.type);\n      }\n      if (toolbarItem.componentProps && !isObject(toolbarItem.componentProps)) {\n        throwToolbarItemGenericError('componentProps', toolbarItem.componentProps);\n      }\n      if (toolbarItem.type === 'ds-popup-menu') {\n        validatePopupItem(toolbarItem.componentProps);\n      }\n      if (toolbarItem.type === 'ds-app-picker' && toolbarItem.componentProps) {\n        validateAppPickerItem(toolbarItem.componentProps);\n      }\n    }\n  });\n};\n\n// Validation Needs to be checked carefully to avoid any breaking change\n// const validateGenericToolbarItem = (item: DSGlobalHeaderT.ToolbarItem): void => {\n//   if (item.label && typeof item.label !== 'string') {\n//     throwToolbarItemGenericError('label', item.label);\n//   }\n//   if (item.onClick && typeof item.onClick !== 'function') {\n//     throwToolbarItemGenericError('onClick', item.onClick);\n//   }\n//   if (item.Icon && typeof item.Icon !== 'function') {\n//     if (item.type === 'ds-app-picker') return;\n//     throwToolbarItemGenericError('Icon', item.Icon);\n//   }\n// };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,oBAAoB,CAAC,mBAAkE;AAC3F,MAAI,eAAe,WAAW,CAAC,MAAM,QAAQ,eAAe,OAAO,GAAG;AACpE,+BAA2B,WAAW,eAAe,OAAO;AAAA,EAC9D;AACA,MAAI,eAAe,gBAAgB,OAAO,eAAe,iBAAiB,WAAW;AACnF,+BAA2B,gBAAgB,eAAe,YAAY;AAAA,EACxE;AACF;AAEA,MAAM,wBAAwB,CAAC,mBAAkE;AAC/F,MAAI,eAAe,QAAQ,CAAC,MAAM,QAAQ,eAAe,IAAI,GAAG;AAC9D,mCAA+B,QAAQ,eAAe,IAAI;AAAA,EAC5D;AACA,MAAI,eAAe,cAAc,CAAC,MAAM,QAAQ,eAAe,UAAU,GAAG;AAC1E,mCAA+B,cAAc,eAAe,UAAU;AAAA,EACxE;AACA,MAAI,eAAe,gBAAgB,OAAO,eAAe,iBAAiB,UAAU;AAClF,mCAA+B,gBAAgB,eAAe,YAAY;AAAA,EAC5E;AACA,MAAI,eAAe,sBAAsB,OAAO,eAAe,uBAAuB,UAAU;AAC9F,mCAA+B,sBAAsB,eAAe,kBAAkB;AAAA,EACxF;AACF;AAEO,MAAM,mBAAmB,CAAC,UAAuC;AACtE,QAAM,EAAE,YAAY,SAAS,MAAM,cAAc,IAAI;AAErD,MAAI,QAAQ,OAAO,SAAS,YAAY;AACtC,mBAAe,QAAQ,IAAI;AAAA,EAC7B;AAEA,MAAI,iBAAiB,OAAO,kBAAkB,YAAY;AACxD,mBAAe,iBAAiB,aAAa;AAAA,EAC/C;AAEA,cAAY,QAAQ,CAAC,mBAAmB;AACtC,QAAI,eAAe,SAAS,OAAO,eAAe,UAAU,UAAU;AACpE,+BAAyB,SAAS,eAAe,KAAK;AAAA,IACxD;AACA,QAAI,eAAe,WAAW,OAAO,eAAe,YAAY,YAAY;AAC1E,+BAAyB,WAAW,eAAe,OAAO;AAAA,IAC5D;AACA,QAAI,eAAe,WAAW,OAAO,eAAe,YAAY,WAAW;AACzE,+BAAyB,WAAW,eAAe,OAAO;AAAA,IAC5D;AACA,QAAI,eAAe,cAAc,OAAO,eAAe,eAAe,WAAW;AAC/E,+BAAyB,cAAc,eAAe,UAAU;AAAA,IAClE;AAAA,EACF,CAAC;AAED,WAAS,QAAQ,CAAC,gBAAgB;AAChC,QAAI,YAAY,MAAM;AACpB,UAAI,CAAC,mBAAmB,YAAY,IAAI,GAAG;AACzC,qCAA6B,QAAQ,YAAY,IAAI;AAAA,MACvD;AACA,UAAI,YAAY,kBAAkB,CAAC,SAAS,YAAY,cAAc,GAAG;AACvE,qCAA6B,kBAAkB,YAAY,cAAc;AAAA,MAC3E;AACA,UAAI,YAAY,SAAS,iBAAiB;AACxC,0BAAkB,YAAY,cAAc;AAAA,MAC9C;AACA,UAAI,YAAY,SAAS,mBAAmB,YAAY,gBAAgB;AACtE,8BAAsB,YAAY,cAAc;AAAA,MAClD;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import {\n  throwToolbarPopupItemError,\n  throwToolbarAppPickerItemError,\n  throwToolbarItemGenericError,\n  throwLogoError,\n  throwBreadcrumbItemError,\n  isValidToolbarType,\n  isObject,\n} from './validateHelpers.js';\nimport type { DSGlobalHeaderT } from '../react-desc-prop-types.js';\nimport type { DSGlobalHeaderInternalsT } from '../sharedTypes.js';\n\nconst validatePopupItem = (componentProps: DSGlobalHeaderInternalsT.PopupMenuComponentProps): void => {\n  if (componentProps.options && !Array.isArray(componentProps.options)) {\n    throwToolbarPopupItemError('options', componentProps.options);\n  }\n  if (componentProps.closeOnClick && typeof componentProps.closeOnClick !== 'boolean') {\n    throwToolbarPopupItemError('closeOnClick', componentProps.closeOnClick);\n  }\n};\n\nconst validateAppPickerItem = (componentProps: DSGlobalHeaderInternalsT.AppPickerComponentProps): void => {\n  if (componentProps.apps && !Array.isArray(componentProps.apps)) {\n    throwToolbarAppPickerItemError('apps', componentProps.apps);\n  }\n  if (componentProps.customApps && !Array.isArray(componentProps.customApps)) {\n    throwToolbarAppPickerItemError('customApps', componentProps.customApps);\n  }\n  if (componentProps.sectionTitle && typeof componentProps.sectionTitle !== 'string') {\n    throwToolbarAppPickerItemError('sectionTitle', componentProps.sectionTitle);\n  }\n  if (componentProps.customSectionTitle && typeof componentProps.customSectionTitle !== 'string') {\n    throwToolbarAppPickerItemError('customSectionTitle', componentProps.customSectionTitle);\n  }\n};\n\nexport const useValidateProps = (props: DSGlobalHeaderT.Props): void => {\n  const { breadcrumb, toolbar, Logo, LogoWithBrand } = props;\n\n  if (Logo && typeof Logo !== 'function') {\n    throwLogoError('Logo', Logo);\n  }\n\n  if (LogoWithBrand && typeof LogoWithBrand !== 'function') {\n    throwLogoError('LogoWithBrand', LogoWithBrand);\n  }\n\n  breadcrumb?.forEach((breadcrumbItem) => {\n    if (breadcrumbItem.label && typeof breadcrumbItem.label !== 'string') {\n      throwBreadcrumbItemError('label', breadcrumbItem.label);\n    }\n    if (breadcrumbItem.onClick && typeof breadcrumbItem.onClick !== 'function') {\n      throwBreadcrumbItemError('onClick', breadcrumbItem.onClick);\n    }\n    if (breadcrumbItem.hasNext && typeof breadcrumbItem.hasNext !== 'boolean') {\n      throwBreadcrumbItemError('hasNext', breadcrumbItem.hasNext);\n    }\n    if (breadcrumbItem.isSelected && typeof breadcrumbItem.isSelected !== 'boolean') {\n      throwBreadcrumbItemError('isSelected', breadcrumbItem.isSelected);\n    }\n  });\n\n  toolbar?.forEach((toolbarItem) => {\n    if (toolbarItem.type) {\n      if (!isValidToolbarType(toolbarItem.type)) {\n        throwToolbarItemGenericError('type', toolbarItem.type);\n      }\n      if (toolbarItem.componentProps && !isObject(toolbarItem.componentProps)) {\n        throwToolbarItemGenericError('componentProps', toolbarItem.componentProps);\n      }\n      if (toolbarItem.type === 'ds-popup-menu') {\n        validatePopupItem(toolbarItem.componentProps as DSGlobalHeaderInternalsT.PopupMenuComponentProps);\n      }\n      if (toolbarItem.type === 'ds-app-picker' && toolbarItem.componentProps) {\n        validateAppPickerItem(toolbarItem.componentProps as DSGlobalHeaderInternalsT.AppPickerComponentProps);\n      }\n    }\n  });\n};\n\n// Validation Needs to be checked carefully to avoid any breaking change\n// const validateGenericToolbarItem = (item: DSGlobalHeaderInternalsT.ToolbarItem): void => {\n//   if (item.label && typeof item.label !== 'string') {\n//     throwToolbarItemGenericError('label', item.label);\n//   }\n//   if (item.onClick && typeof item.onClick !== 'function') {\n//     throwToolbarItemGenericError('onClick', item.onClick);\n//   }\n//   if (item.Icon && typeof item.Icon !== 'function') {\n//     if (item.type === 'ds-app-picker') return;\n//     throwToolbarItemGenericError('Icon', item.Icon);\n//   }\n// };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAIP,MAAM,oBAAoB,CAAC,mBAA2E;AACpG,MAAI,eAAe,WAAW,CAAC,MAAM,QAAQ,eAAe,OAAO,GAAG;AACpE,+BAA2B,WAAW,eAAe,OAAO;AAAA,EAC9D;AACA,MAAI,eAAe,gBAAgB,OAAO,eAAe,iBAAiB,WAAW;AACnF,+BAA2B,gBAAgB,eAAe,YAAY;AAAA,EACxE;AACF;AAEA,MAAM,wBAAwB,CAAC,mBAA2E;AACxG,MAAI,eAAe,QAAQ,CAAC,MAAM,QAAQ,eAAe,IAAI,GAAG;AAC9D,mCAA+B,QAAQ,eAAe,IAAI;AAAA,EAC5D;AACA,MAAI,eAAe,cAAc,CAAC,MAAM,QAAQ,eAAe,UAAU,GAAG;AAC1E,mCAA+B,cAAc,eAAe,UAAU;AAAA,EACxE;AACA,MAAI,eAAe,gBAAgB,OAAO,eAAe,iBAAiB,UAAU;AAClF,mCAA+B,gBAAgB,eAAe,YAAY;AAAA,EAC5E;AACA,MAAI,eAAe,sBAAsB,OAAO,eAAe,uBAAuB,UAAU;AAC9F,mCAA+B,sBAAsB,eAAe,kBAAkB;AAAA,EACxF;AACF;AAEO,MAAM,mBAAmB,CAAC,UAAuC;AACtE,QAAM,EAAE,YAAY,SAAS,MAAM,cAAc,IAAI;AAErD,MAAI,QAAQ,OAAO,SAAS,YAAY;AACtC,mBAAe,QAAQ,IAAI;AAAA,EAC7B;AAEA,MAAI,iBAAiB,OAAO,kBAAkB,YAAY;AACxD,mBAAe,iBAAiB,aAAa;AAAA,EAC/C;AAEA,cAAY,QAAQ,CAAC,mBAAmB;AACtC,QAAI,eAAe,SAAS,OAAO,eAAe,UAAU,UAAU;AACpE,+BAAyB,SAAS,eAAe,KAAK;AAAA,IACxD;AACA,QAAI,eAAe,WAAW,OAAO,eAAe,YAAY,YAAY;AAC1E,+BAAyB,WAAW,eAAe,OAAO;AAAA,IAC5D;AACA,QAAI,eAAe,WAAW,OAAO,eAAe,YAAY,WAAW;AACzE,+BAAyB,WAAW,eAAe,OAAO;AAAA,IAC5D;AACA,QAAI,eAAe,cAAc,OAAO,eAAe,eAAe,WAAW;AAC/E,+BAAyB,cAAc,eAAe,UAAU;AAAA,IAClE;AAAA,EACF,CAAC;AAED,WAAS,QAAQ,CAAC,gBAAgB;AAChC,QAAI,YAAY,MAAM;AACpB,UAAI,CAAC,mBAAmB,YAAY,IAAI,GAAG;AACzC,qCAA6B,QAAQ,YAAY,IAAI;AAAA,MACvD;AACA,UAAI,YAAY,kBAAkB,CAAC,SAAS,YAAY,cAAc,GAAG;AACvE,qCAA6B,kBAAkB,YAAY,cAAc;AAAA,MAC3E;AACA,UAAI,YAAY,SAAS,iBAAiB;AACxC,0BAAkB,YAAY,cAAkE;AAAA,MAClG;AACA,UAAI,YAAY,SAAS,mBAAmB,YAAY,gBAAgB;AACtE,8BAAsB,YAAY,cAAkE;AAAA,MACtG;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
   "names": []
 }

package/dist/esm/exported-related/index.js

@@ -1,11 +1,4 @@
 import * as React from "react";
-import { DSGlobalHeaderName, DSGlobalHeaderSlots, DSGlobalHeaderSlotsFlattened } from "./theming.js";
-import { DSGlobalHeaderDatatestid, DSGlobalHeaderDatatestidFlattened } from "./DSGlobalHeaderDatatestid.js";
-export {
-  DSGlobalHeaderDatatestid,
-  DSGlobalHeaderDatatestidFlattened,
-  DSGlobalHeaderName,
-  DSGlobalHeaderSlots,
-  DSGlobalHeaderSlotsFlattened
-};
+export * from "./theming.js";
+export * from "./DSGlobalHeaderDatatestid.js";
 //# sourceMappingURL=index.js.map

package/dist/esm/exported-related/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/index.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DSGlobalHeaderName, DSGlobalHeaderSlots, DSGlobalHeaderSlotsFlattened } from './theming.js';\nexport { DSGlobalHeaderDatatestid, DSGlobalHeaderDatatestidFlattened } from './DSGlobalHeaderDatatestid.js';\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,oBAAoB,qBAAqB,oCAAoC;AACtF,SAAS,0BAA0B,yCAAyC;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './theming.js';\nexport * from './DSGlobalHeaderDatatestid.js';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;",
   "names": []
 }

package/dist/esm/index.js

@@ -1,23 +1,9 @@
 import * as React from "react";
 import { DSGlobalHeader } from "./DSGlobalHeader.js";
+export * from "./DSGlobalHeader.js";
+export * from "./exported-related/index.js";
 var index_default = DSGlobalHeader;
-import { DSGlobalHeader as DSGlobalHeader2, DSGlobalHeaderWithSchema, GlobalHeader } from "./DSGlobalHeader.js";
-import {
-  DSGlobalHeaderDatatestid,
-  DSGlobalHeaderDatatestidFlattened,
-  DSGlobalHeaderName,
-  DSGlobalHeaderSlots,
-  DSGlobalHeaderSlotsFlattened
-} from "./exported-related/index.js";
 export {
-  DSGlobalHeader2 as DSGlobalHeader,
-  DSGlobalHeaderDatatestid,
-  DSGlobalHeaderDatatestidFlattened,
-  DSGlobalHeaderName,
-  DSGlobalHeaderSlots,
-  DSGlobalHeaderSlotsFlattened,
-  DSGlobalHeaderWithSchema,
-  GlobalHeader,
   index_default as default
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,sBAAsB;AAE/B,IAAO,gBAAQ;AACf,SAAS,kBAAAA,iBAAgB,0BAA0B,oBAAoB;AACvE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;",
-  "names": ["DSGlobalHeader"]
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSGlobalHeader } from './DSGlobalHeader.js';\nexport * from './DSGlobalHeader.js';\nexport * from './exported-related/index.js';\nexport type { DSGlobalHeaderInternalsT } from './sharedTypes.js';\nexport type { DSGlobalHeaderT } from './react-desc-prop-types.js';\nexport default DSGlobalHeader;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,sBAAsB;AAC/B,cAAc;AACd,cAAc;AAGd,IAAO,gBAAQ;",
+  "names": []
 }

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

@@ -42,7 +42,7 @@ const GlobalHeaderBreadcrumb = () => {
               onKeyDown: onClick && handleOnKeyDown(onClick),
               ...getGlobalAttributes(rest),
               onClick,
-              fullBreadcrumbListLength: breadcrumb.length
+              length: breadcrumb.length
             },
             `${instanceUID}-breadcrumb-item-${label}`
           );

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Breadcrumb/GlobalHeaderBreadcrumb.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
-  "mappings": "AAAA,YAAY,WAAW;ACgBnB,SAUE,KAVF;AAfJ,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,2BAA2B,YAAY,4BAA4B;AAC5E,SAAS,iCAAiC;AAC1C,SAAS,sBAAsB;AAC/B,SAAS,gCAAgC;AAElC,MAAM,yBAAyB,MAAmB;AACvD,QAAM,EAAE,YAAY,kBAAkB,cAAc,eAAe,iBAAiB,aAAa,WAAW,IAC1G,0BAA0B;AAC5B,QAAM,aAAa,iBAAiB;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,yBAAyB,WAAW;AAAA,MAChD,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,cAAc;AAAA,YACd,eAAW;AAAA,YACX,eAAa,yBAAyB,WAAW;AAAA,YAChD,GAAG;AAAA;AAAA,QACN;AAAA,QACA,oBAAC,wBAAqB,eAAa,yBAAyB,WAAW,MAAO,GAAG,YAC9E,+BAAqB,SACpB,oBAAC,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,GAAG,oBAAoB,IAAI;AAAA,cAC5B;AAAA,cACA,0BAA0B,WAAW;AAAA;AAAA,YAJhC,GAAG,WAAW,oBAAoB,KAAK;AAAA,UAK9C;AAAA,QAEJ,CAAC,GAEL;AAAA,QACA,oBAAC,SAAI,IAAG,6BAA4B,KAAK,eAAe,eAAW,MAAC;AAAA;AAAA;AAAA,EACtE;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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                length={breadcrumb.length}\n              />\n            );\n          })\n        )}\n      </StyledBreadcrumbList>\n      <div id=\"global-header-flex-region\" ref={flexRegionRef} aria-hidden />\n    </StyledBreadcrumbContainer>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACgBnB,SAUE,KAVF;AAfJ,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,2BAA2B,YAAY,4BAA4B;AAC5E,SAAS,iCAAiC;AAC1C,SAAS,sBAAsB;AAC/B,SAAS,gCAAgC;AAElC,MAAM,yBAAyB,MAAmB;AACvD,QAAM,EAAE,YAAY,kBAAkB,cAAc,eAAe,iBAAiB,aAAa,WAAW,IAC1G,0BAA0B;AAC5B,QAAM,aAAa,iBAAiB;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,yBAAyB,WAAW;AAAA,MAChD,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,cAAc;AAAA,YACd,eAAW;AAAA,YACX,eAAa,yBAAyB,WAAW;AAAA,YAChD,GAAG;AAAA;AAAA,QACN;AAAA,QACA,oBAAC,wBAAqB,eAAa,yBAAyB,WAAW,MAAO,GAAG,YAC9E,+BAAqB,SACpB,oBAAC,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,GAAG,oBAAoB,IAAI;AAAA,cAC5B;AAAA,cACA,QAAQ,WAAW;AAAA;AAAA,YAJd,GAAG,WAAW,oBAAoB,KAAK;AAAA,UAK9C;AAAA,QAEJ,CAAC,GAEL;AAAA,QACA,oBAAC,SAAI,IAAG,6BAA4B,KAAK,eAAe,eAAW,MAAC;AAAA;AAAA;AAAA,EACtE;AAEJ;",
   "names": []
 }

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

@@ -1,23 +1,34 @@
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import React2 from "react";
+import { StyledBreadcrumbItem, StyledLink, StyledLabel, StyledChevron } from "./styles.js";
 import { DSGlobalHeaderDatatestid } from "../../exported-related/index.js";
-import { StyledBreadcrumbItem, StyledChevron, StyledLabel, StyledLink } from "./styles.js";
 const PureBreadcrumb = React2.memo(
-  ({ onClick, isSelected, fullBreadcrumbListLength, label, hasNext, ...rest }) => /* @__PURE__ */ jsxs(StyledBreadcrumbItem, { "data-testid": DSGlobalHeaderDatatestid.BREADCRUMB.ITEM, children: [
+  ({
+    onClick,
+    onKeyDown,
+    isSelected,
+    length,
+    label,
+    hasNext,
+    id,
+    ...rest
+  }) => /* @__PURE__ */ jsxs(StyledBreadcrumbItem, { "data-testid": DSGlobalHeaderDatatestid.BREADCRUMB.ITEM, children: [
     /* @__PURE__ */ jsx(
       StyledLink,
       {
         onClick,
+        onKeyDown,
         "data-testid": DSGlobalHeaderDatatestid.BREADCRUMB.ITEM_LINK,
         "aria-current": isSelected,
+        id,
         tabIndex: 0,
         ...rest,
         children: /* @__PURE__ */ jsx(
           StyledLabel,
           {
             isSelected: !!isSelected,
-            isOnlyItem: fullBreadcrumbListLength === 1,
+            isOnlyItem: length === 1,
             "data-testid": DSGlobalHeaderDatatestid.BREADCRUMB.ITEM_LINK_LABEL,
             children: label
           }

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Breadcrumb/PureBreadcrumb.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
-  "mappings": "AAAA,YAAY,WAAW;ACSnB,SAQI,KARJ;AATJ,OAAOA,YAAW;AAClB,SAAS,gCAAgC;AAEzC,SAAS,sBAAsB,eAAe,aAAa,kBAAkB;AAItE,MAAM,iBAAiBA,OAAM;AAAA,EAClC,CAAC,EAAE,SAAS,YAAY,0BAA0B,OAAO,SAAS,GAAG,KAAK,MACxE,qBAAC,wBAAqB,eAAa,yBAAyB,WAAW,MACrE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAa,yBAAyB,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,yBAAyB,WAAW;AAAA,YAEhD;AAAA;AAAA,QACH;AAAA;AAAA,IACF;AAAA,IACC,WAAW,oBAAC,iBAAc,MAAK,KAAI,eAAW,MAAC;AAAA,KAClD;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledBreadcrumbItem, StyledLink, StyledLabel, StyledChevron } from './styles.js';\nimport { DSGlobalHeaderDatatestid } from '../../exported-related/index.js';\nimport type { DSGlobalHeaderInternalsT } from '../../sharedTypes.js';\nexport const PureBreadcrumb = React.memo(\n  ({\n    onClick,\n    onKeyDown,\n    isSelected,\n    length,\n    label,\n    hasNext,\n    id,\n    ...rest\n  }: DSGlobalHeaderInternalsT.BreadcrumbItem) => (\n    <StyledBreadcrumbItem data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.ITEM}>\n      <StyledLink\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        data-testid={DSGlobalHeaderDatatestid.BREADCRUMB.ITEM_LINK}\n        aria-current={isSelected}\n        id={id}\n        tabIndex={0}\n        {...rest}\n      >\n        <StyledLabel\n          isSelected={!!isSelected}\n          isOnlyItem={length === 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"],
+  "mappings": "AAAA,YAAY,WAAW;ACenB,SAUI,KAVJ;AAfJ,OAAOA,YAAW;AAClB,SAAS,sBAAsB,YAAY,aAAa,qBAAqB;AAC7E,SAAS,gCAAgC;AAElC,MAAM,iBAAiBA,OAAM;AAAA,EAClC,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,MACE,qBAAC,wBAAqB,eAAa,yBAAyB,WAAW,MACrE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,eAAa,yBAAyB,WAAW;AAAA,QACjD,gBAAc;AAAA,QACd;AAAA,QACA,UAAU;AAAA,QACT,GAAG;AAAA,QAEJ;AAAA,UAAC;AAAA;AAAA,YACC,YAAY,CAAC,CAAC;AAAA,YACd,YAAY,WAAW;AAAA,YACvB,eAAa,yBAAyB,WAAW;AAAA,YAEhD;AAAA;AAAA,QACH;AAAA;AAAA,IACF;AAAA,IACC,WAAW,oBAAC,iBAAc,MAAK,KAAI,eAAW,MAAC;AAAA,KAClD;AAEJ;",
   "names": ["React"]
 }

package/dist/esm/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js

@@ -1,7 +1,7 @@
 import * as React from "react";
-import { useCallback, useContext, useEffect, useRef } from "react";
-import { FONT_DETECTOR } from "../../config/constants.js";
+import { useEffect, useRef, useContext, useCallback } from "react";
 import { DSGlobalHeaderContext } from "../../DSGlobalHeaderContext.js";
+import { FONT_DETECTOR } from "../../config/constants.js";
 const useGlobalHeaderBreadcrumb = () => {
   const {
     props: { breadcrumb, CustomNavigation },
@@ -30,7 +30,7 @@ const useGlobalHeaderBreadcrumb = () => {
   const handleOnKeyDown = useCallback(
     (onClick) => (e) => {
       if (e.key === " " || e.key === "Enter") {
-        onClick(e);
+        onClick();
       }
     },
     []

package/dist/esm/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Breadcrumb/useGlobalHeaderBreadcrumb.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport { FONT_DETECTOR } from '../../config/constants.js';\nimport { DSGlobalHeaderContext } from '../../DSGlobalHeaderContext.js';\nimport type { DSGlobalHeaderT } from '../../react-desc-prop-types.js';\n\ninterface UseGlobalHeaderBreadcrumbReturnT {\n  breadcrumb: DSGlobalHeaderT.BreadcrumbItem[];\n  CustomNavigation: React.ComponentType;\n  showIconOnly: boolean;\n  flexRegionRef: React.MutableRefObject<HTMLDivElement | null>;\n  handleOnKeyDown: (\n    onClick: (event: React.MouseEvent | React.KeyboardEvent) => void,\n  ) => (event: React.KeyboardEvent) => void;\n  instanceUID: string;\n  ownerProps: {\n    getOwnerProps: () => Partial<DSGlobalHeaderT.DefaultProps>;\n    getOwnerPropsArguments: () => object;\n  };\n}\n\nexport const useGlobalHeaderBreadcrumb = (): UseGlobalHeaderBreadcrumbReturnT => {\n  const {\n    props: { breadcrumb, CustomNavigation },\n    ownerProps,\n    instanceUID,\n    showIconOnly,\n    setShowIconOnly,\n    fontDetector,\n  } = useContext(DSGlobalHeaderContext);\n\n  const breakpointRef = useRef<number | null>(null);\n  const flexRegionRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const evaluateShowIconOnly = () => {\n      if (\n        (flexRegionRef.current && flexRegionRef.current.offsetWidth <= 0 && !breakpointRef.current) ||\n        fontDetector === FONT_DETECTOR.LARGE ||\n        fontDetector === FONT_DETECTOR.MEDIUM\n      ) {\n        setShowIconOnly(true);\n        breakpointRef.current = window.innerWidth;\n      } else if (breakpointRef.current && window.innerWidth >= breakpointRef.current) {\n        setShowIconOnly(false);\n        breakpointRef.current = null;\n      }\n    };\n\n    evaluateShowIconOnly();\n\n    window.addEventListener('resize', evaluateShowIconOnly);\n    return () => window.removeEventListener('resize', evaluateShowIconOnly);\n  }, [breakpointRef, flexRegionRef, setShowIconOnly, fontDetector]);\n\n  const handleOnKeyDown = useCallback(\n    (onClick: (event: React.MouseEvent | React.KeyboardEvent) => void) => (e: React.KeyboardEvent) => {\n      if (e.key === ' ' || e.key === 'Enter') {\n        onClick(e);\n      }\n    },\n    [],\n  );\n\n  return {\n    breadcrumb,\n    CustomNavigation,\n    showIconOnly,\n    flexRegionRef,\n    handleOnKeyDown,\n    instanceUID,\n    ownerProps,\n  };\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,aAAa,YAAY,WAAW,cAAc;AAC3D,SAAS,qBAAqB;AAC9B,SAAS,6BAA6B;AAkB/B,MAAM,4BAA4B,MAAwC;AAC/E,QAAM;AAAA,IACJ,OAAO,EAAE,YAAY,iBAAiB;AAAA,IACtC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,qBAAqB;AAEpC,QAAM,gBAAgB,OAAsB,IAAI;AAChD,QAAM,gBAAgB,OAAuB,IAAI;AAEjD,YAAU,MAAM;AACd,UAAM,uBAAuB,MAAM;AACjC,UACG,cAAc,WAAW,cAAc,QAAQ,eAAe,KAAK,CAAC,cAAc,WACnF,iBAAiB,cAAc,SAC/B,iBAAiB,cAAc,QAC/B;AACA,wBAAgB,IAAI;AACpB,sBAAc,UAAU,OAAO;AAAA,MACjC,WAAW,cAAc,WAAW,OAAO,cAAc,cAAc,SAAS;AAC9E,wBAAgB,KAAK;AACrB,sBAAc,UAAU;AAAA,MAC1B;AAAA,IACF;AAEA,yBAAqB;AAErB,WAAO,iBAAiB,UAAU,oBAAoB;AACtD,WAAO,MAAM,OAAO,oBAAoB,UAAU,oBAAoB;AAAA,EACxE,GAAG,CAAC,eAAe,eAAe,iBAAiB,YAAY,CAAC;AAEhE,QAAM,kBAAkB;AAAA,IACtB,CAAC,YAAqE,CAAC,MAA2B;AAChG,UAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACtC,gBAAQ,CAAC;AAAA,MACX;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useEffect, useRef, useContext, useCallback } from 'react';\nimport { DSGlobalHeaderContext } from '../../DSGlobalHeaderContext.js';\nimport type { DSGlobalHeaderInternalsT } from '../../sharedTypes.js';\nimport { FONT_DETECTOR } from '../../config/constants.js';\ninterface UseGlobalHeaderBreadcrumbReturnT {\n  breadcrumb: DSGlobalHeaderInternalsT.BreadcrumbItem[];\n  CustomNavigation: React.ComponentType;\n  showIconOnly: boolean;\n  flexRegionRef: React.MutableRefObject<HTMLDivElement | null>;\n  handleOnKeyDown: (onClick: (event?: React.MouseEvent) => void) => (event: React.KeyboardEvent) => void;\n  instanceUID: string;\n  ownerProps: {\n    getOwnerProps: () => Partial<DSGlobalHeaderInternalsT.DefaultProps>;\n    getOwnerPropsArguments: () => object;\n  };\n}\n\nexport const useGlobalHeaderBreadcrumb = (): UseGlobalHeaderBreadcrumbReturnT => {\n  const {\n    props: { breadcrumb, CustomNavigation },\n    ownerProps,\n    instanceUID,\n    showIconOnly,\n    setShowIconOnly,\n    fontDetector,\n  } = useContext(DSGlobalHeaderContext);\n\n  const breakpointRef = useRef<number | null>(null);\n  const flexRegionRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const evaluateShowIconOnly = () => {\n      if (\n        (flexRegionRef.current && flexRegionRef.current.offsetWidth <= 0 && !breakpointRef.current) ||\n        fontDetector === FONT_DETECTOR.LARGE ||\n        fontDetector === FONT_DETECTOR.MEDIUM\n      ) {\n        setShowIconOnly(true);\n        breakpointRef.current = window.innerWidth;\n      } else if (breakpointRef.current && window.innerWidth >= breakpointRef.current) {\n        setShowIconOnly(false);\n        breakpointRef.current = null;\n      }\n    };\n\n    evaluateShowIconOnly();\n\n    window.addEventListener('resize', evaluateShowIconOnly);\n    return () => window.removeEventListener('resize', evaluateShowIconOnly);\n  }, [breakpointRef, flexRegionRef, setShowIconOnly, fontDetector]);\n\n  const handleOnKeyDown = useCallback(\n    (onClick: (event?: React.MouseEvent) => void) => (e: React.KeyboardEvent) => {\n      if (e.key === ' ' || e.key === 'Enter') {\n        onClick();\n      }\n    },\n    [],\n  );\n\n  return {\n    breadcrumb,\n    CustomNavigation,\n    showIconOnly,\n    flexRegionRef,\n    handleOnKeyDown,\n    instanceUID,\n    ownerProps,\n  };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,WAAW,QAAQ,YAAY,mBAAmB;AAC3D,SAAS,6BAA6B;AAEtC,SAAS,qBAAqB;AAcvB,MAAM,4BAA4B,MAAwC;AAC/E,QAAM;AAAA,IACJ,OAAO,EAAE,YAAY,iBAAiB;AAAA,IACtC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,qBAAqB;AAEpC,QAAM,gBAAgB,OAAsB,IAAI;AAChD,QAAM,gBAAgB,OAAuB,IAAI;AAEjD,YAAU,MAAM;AACd,UAAM,uBAAuB,MAAM;AACjC,UACG,cAAc,WAAW,cAAc,QAAQ,eAAe,KAAK,CAAC,cAAc,WACnF,iBAAiB,cAAc,SAC/B,iBAAiB,cAAc,QAC/B;AACA,wBAAgB,IAAI;AACpB,sBAAc,UAAU,OAAO;AAAA,MACjC,WAAW,cAAc,WAAW,OAAO,cAAc,cAAc,SAAS;AAC9E,wBAAgB,KAAK;AACrB,sBAAc,UAAU;AAAA,MAC1B;AAAA,IACF;AAEA,yBAAqB;AAErB,WAAO,iBAAiB,UAAU,oBAAoB;AACtD,WAAO,MAAM,OAAO,oBAAoB,UAAU,oBAAoB;AAAA,EACxE,GAAG,CAAC,eAAe,eAAe,iBAAiB,YAAY,CAAC;AAEhE,QAAM,kBAAkB;AAAA,IACtB,CAAC,YAAgD,CAAC,MAA2B;AAC3E,UAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACtC,gBAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/esm/parts/Toolbar/GlobalHeaderToolbar.js

@@ -1,14 +1,14 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
-import { getGlobalAttributes } from "@elliemae/ds-props-helpers";
 import { useContext } from "react";
-import { FONT_DETECTOR } from "../../config/constants.js";
+import { getGlobalAttributes } from "@elliemae/ds-props-helpers";
+import { StyledList, StyledMenubarContainer, StyledToolbarItem } from "./styles.js";
+import { AppPicker, PopupMenu, SearchToggle } from "./outOfTheBox/index.js";
+import { StyledButton } from "../styles.js";
 import { DSGlobalHeaderContext } from "../../DSGlobalHeaderContext.js";
 import { DSGlobalHeaderDatatestid } from "../../exported-related/index.js";
-import { StyledButton } from "../styles.js";
-import { AppPicker, PopupMenu, SearchToggle } from "./outOfTheBox/index.js";
-import { StyledList, StyledMenubarContainer, StyledToolbarItem } from "./styles.js";
 import { useGlobalHeaderToolbar } from "./useGlobalHeaderToolbar.js";
+import { FONT_DETECTOR } from "../../config/constants.js";
 const GlobalHeaderToolbar = () => {
   const {
     props: { toolbar },
@@ -39,89 +39,115 @@ const GlobalHeaderToolbar = () => {
           "data-testid": DSGlobalHeaderDatatestid.MENUBAR.LIST,
           ...ownerProps,
           children: toolbar.map((item, index) => {
-            const { type } = item;
-            const setRefIndex = setRef(index);
-            if (type === "ds-popup-menu") {
-              const { label: label2, ...otherProps2 } = item;
-              return /* @__PURE__ */ jsx(
-                StyledToolbarItem,
-                {
-                  role: "menuitem",
-                  "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
-                  ...ownerProps,
-                  children: /* @__PURE__ */ jsx(
-                    PopupMenu,
-                    {
-                      title: label2,
-                      setRef: setRefIndex,
-                      ...otherProps2
-                    }
-                  )
-                },
-                `${instanceUID}-ds-toolbar-item-${label2}`
-              );
-            }
-            if (type === "ds-app-picker") {
-              const { label: label2, ...otherProps2 } = item;
-              return /* @__PURE__ */ jsx(
-                StyledToolbarItem,
-                {
-                  role: "menuitem",
-                  "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
-                  ...ownerProps,
-                  children: /* @__PURE__ */ jsx(AppPicker, { label: label2, setRef: setRefIndex, ...otherProps2 })
-                },
-                `${instanceUID}-ds-toolbar-item-${label2}`
-              );
-            }
-            if (type === "ds-search-toggle") {
-              const { label: label2, ...otherProps2 } = item;
-              return /* @__PURE__ */ jsx(
-                StyledToolbarItem,
-                {
-                  role: "menuitem",
-                  "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
-                  ...ownerProps,
-                  children: /* @__PURE__ */ jsx(SearchToggle, { setRef: setRefIndex, ...otherProps2 })
-                },
-                `${instanceUID}-ds-toolbar-item-${label2}`
-              );
-            }
-            if (type === "custom") {
-              const { label: label2, CustomComponent } = item;
-              if (!CustomComponent) return null;
-              return /* @__PURE__ */ jsx(
-                StyledToolbarItem,
-                {
-                  role: "menuitem",
-                  "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
-                  ...ownerProps,
-                  children: CustomComponent && /* @__PURE__ */ jsx(CustomComponent, { item, setRef: setRefIndex })
-                },
-                `${instanceUID}-ds-toolbar-item-${label2}`
-              );
-            }
-            const { label, Icon, ...otherProps } = item;
-            return /* @__PURE__ */ jsx(
-              StyledToolbarItem,
-              {
-                role: "menuitem",
-                "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
-                ...ownerProps,
-                children: /* @__PURE__ */ jsx(
-                  StyledButton,
+            const {
+              Icon,
+              type,
+              onClick,
+              onKeyPress,
+              CustomComponent,
+              label,
+              id = "",
+              componentProps = {},
+              ...otherProps
+            } = item;
+            switch (type) {
+              case "ds-popup-menu":
+                return /* @__PURE__ */ jsx(
+                  StyledToolbarItem,
+                  {
+                    role: "menuitem",
+                    "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
+                    ...ownerProps,
+                    children: /* @__PURE__ */ jsx(
+                      PopupMenu,
+                      {
+                        title: label,
+                        Icon,
+                        onClick,
+                        onKeyPress,
+                        setRef: setRef(index),
+                        id,
+                        componentProps,
+                        ...otherProps
+                      }
+                    )
+                  },
+                  `${instanceUID}-ds-toolbar-item-${label}`
+                );
+              case "ds-app-picker":
+                return /* @__PURE__ */ jsx(
+                  StyledToolbarItem,
                   {
-                    title: label,
-                    "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM_BUTTON,
-                    innerRef: setRefIndex,
-                    ...getGlobalAttributes(otherProps),
-                    type: "button",
-                    children: Icon && /* @__PURE__ */ jsx(Icon, { size: "m" })
-                  }
-                )
-              },
-              `${instanceUID}-ds-toolbar-item-${label}`
-            );
+                    role: "menuitem",
+                    "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
+                    ...ownerProps,
+                    children: /* @__PURE__ */ jsx(
+                      AppPicker,
+                      {
+                        label,
+                        id,
+                        setRef: setRef(index),
+                        componentProps,
+                        ...otherProps
+                      }
+                    )
+                  },
+                  `${instanceUID}-ds-toolbar-item-${label}`
+                );
+              case "ds-search-toggle":
+                return /* @__PURE__ */ jsx(
+                  StyledToolbarItem,
+                  {
+                    role: "menuitem",
+                    "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
+                    ...ownerProps,
+                    children: /* @__PURE__ */ jsx(
+                      SearchToggle,
+                      {
+                        id,
+                        setRef: setRef(index),
+                        componentProps,
+                        ...otherProps
+                      }
+                    )
+                  },
+                  `${instanceUID}-ds-toolbar-item-${label}`
+                );
+              case "custom":
+                return /* @__PURE__ */ jsx(
+                  StyledToolbarItem,
+                  {
+                    role: "menuitem",
+                    "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
+                    ...ownerProps,
+                    children: CustomComponent && /* @__PURE__ */ jsx(CustomComponent, { item, setRef: setRef(index) })
+                  },
+                  `${instanceUID}-ds-toolbar-item-${label}`
+                );
+              default:
+                return /* @__PURE__ */ jsx(
+                  StyledToolbarItem,
+                  {
+                    role: "menuitem",
+                    "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM,
+                    ...ownerProps,
+                    children: /* @__PURE__ */ jsx(
+                      StyledButton,
+                      {
+                        onClick,
+                        title: label,
+                        "data-testid": DSGlobalHeaderDatatestid.MENUBAR.ITEM_BUTTON,
+                        id,
+                        innerRef: setRef(index),
+                        ...getGlobalAttributes(otherProps),
+                        type: "button",
+                        children: Icon && /* @__PURE__ */ jsx(Icon, { size: "m" })
+                      }
+                    )
+                  },
+                  `${instanceUID}-ds-toolbar-item-${label}`
+                );
+            }
           })
         }
       )