@elliemae/ds-global-header 2.2.0-alpha.2 → 2.2.0-beta.0

package/esm/outOfTheBox/PopupMenu/PopupMenuContent.js

@@ -1,60 +1,86 @@
-import * as React from "react";
-import React2, { useRef, useEffect, useMemo, useContext } from "react";
-import { getAriaProps, getDataProps } from "@elliemae/ds-props-helpers";
-import { Separator, ItemWrapper, Label, List } from "./styles";
-import { GlobalHeaderContext } from "../../GlobalHeaderContext";
-const PopupMenuContent = React2.memo(({ options, onItemClick, onClose, popupOnKeyPress }) => {
-  const { instanceUID } = useContext(GlobalHeaderContext);
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import React, { useContext, useRef, useEffect, useMemo } from 'react';
+import { getDataProps, getAriaProps } from '@elliemae/ds-props-helpers';
+import { ItemWrapper, Separator, List, Label } from './styles.js';
+import { GlobalHeaderContext } from '../../GlobalHeaderContext.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+const PopupMenuContent = /*#__PURE__*/React.memo(_ref => {
+  let {
+    options,
+    onItemClick,
+    onClose,
+    popupOnKeyPress
+  } = _ref;
+  const {
+    instanceUID
+  } = useContext(GlobalHeaderContext);
   const menuRef = useRef(null);
   useEffect(() => {
-    menuRef.current?.firstChild?.focus();
+    var _menuRef$current, _menuRef$current$firs;
+
+    (_menuRef$current = menuRef.current) === null || _menuRef$current === void 0 ? void 0 : (_menuRef$current$firs = _menuRef$current.firstChild) === null || _menuRef$current$firs === void 0 ? void 0 : _menuRef$current$firs.focus();
   }, []);
-  const content = useMemo(() => options.map((option) => {
-    const { type, Icon, label = "", onClick, Content, id } = option;
-    const ariaAndDataProps = {
-      ...getAriaProps(option),
-      ...getDataProps(option)
-    };
-    const handleClick = (e) => {
+  const content = useMemo(() => options.map(option => {
+    const {
+      type,
+      Icon,
+      label = '',
+      onClick,
+      Content,
+      id
+    } = option;
+
+    const ariaAndDataProps = _objectSpread(_objectSpread({}, getAriaProps(option)), getDataProps(option));
+
+    const handleClick = e => {
       onItemClick(e);
-      if (onClick)
-        onClick(e);
+      if (onClick) onClick(e);
     };
-    const handleKeyDown = (e) => {
-      if (e.code === "Escape")
-        onClose();
-      if (popupOnKeyPress)
-        popupOnKeyPress(e);
+
+    const handleKeyDown = e => {
+      if (e.code === 'Escape') onClose();
+      if (popupOnKeyPress) popupOnKeyPress(e);
     };
+
     switch (type) {
-      case "separator":
-        return /* @__PURE__ */ React2.createElement(Separator, {
-          key: `${instanceUID}-separator-${label}`,
-          ...ariaAndDataProps
-        });
-      case "custom":
-        return /* @__PURE__ */ React2.createElement(ItemWrapper, {
+      case 'separator':
+        return /*#__PURE__*/jsx(Separator, _objectSpread({}, ariaAndDataProps), "".concat(instanceUID, "-separator-").concat(label));
+
+      case 'custom':
+        return /*#__PURE__*/jsx(ItemWrapper, _objectSpread(_objectSpread({
           onClick: handleClick,
           onKeyDown: handleKeyDown,
-          key: `${instanceUID}-popup-${label}`,
-          id,
-          ...ariaAndDataProps
-        }, Content && /* @__PURE__ */ React2.createElement(Content, null));
+          id: id
+        }, ariaAndDataProps), {}, {
+          children: Content && /*#__PURE__*/_jsx(Content, {})
+        }), "".concat(instanceUID, "-popup-").concat(label));
+
       default:
-        return /* @__PURE__ */ React2.createElement(ItemWrapper, {
+        return /*#__PURE__*/jsxs(ItemWrapper, _objectSpread(_objectSpread({
           onClick: handleClick,
           onKeyDown: handleKeyDown,
-          key: `${instanceUID}-popup-${label}`,
-          id,
-          ...ariaAndDataProps
-        }, Icon && /* @__PURE__ */ React2.createElement(Icon, null), Label && /* @__PURE__ */ React2.createElement(Label, null, label));
+          id: id
+        }, ariaAndDataProps), {}, {
+          children: [Icon && /*#__PURE__*/_jsx(Icon, {}), Label && /*#__PURE__*/_jsx(Label, {}, void 0, label)]
+        }), "".concat(instanceUID, "-popup-").concat(label));
     }
   }), [options, onItemClick, onClose, popupOnKeyPress, instanceUID]);
-  return /* @__PURE__ */ React2.createElement(List, {
-    ref: menuRef
-  }, content);
+  return /*#__PURE__*/jsx(List, {
+    ref: menuRef,
+    children: content
+  });
 });
-export {
-  PopupMenuContent
-};
-//# sourceMappingURL=PopupMenuContent.js.map
+
+export { PopupMenuContent };

package/esm/outOfTheBox/PopupMenu/styles.js

@@ -1,38 +1,21 @@
-import * as React from "react";
-import styled from "styled-components";
-const List = styled.div`
-  padding: 5px 0px;
-  background: white;
-`;
-const ItemWrapper = styled.button`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  padding: 0 20px;
-  cursor: pointer;
-  border: 1px solid transparent;
-  background-color: transparent;
-  outline: none;
-  :hover,
-  :focus {
-    border: ${({ theme }) => `1px solid ${theme.colors.brand[600]}`};
-  }
-`;
-const Label = styled.p`
-  width: 100%;
-  font-size: 14px;
-  margin: 10px;
-`;
-const Separator = styled.div`
-  width: 100%;
-  border: none;
-  border-bottom: 1px solid #ccc;
-`;
-export {
-  ItemWrapper,
-  Label,
-  List,
-  Separator
-};
-//# sourceMappingURL=styles.js.map
+import styled from 'styled-components';
+
+const List = /*#__PURE__*/styled.div.withConfig({
+  componentId: "sc-snqcgs-0"
+})(["padding:5px 0px;background:white;"]);
+const ItemWrapper = /*#__PURE__*/styled.button.withConfig({
+  componentId: "sc-snqcgs-1"
+})(["display:flex;align-items:center;justify-content:center;width:100%;padding:0 20px;cursor:pointer;border:1px solid transparent;background-color:transparent;outline:none;:hover,:focus{border:", ";}"], _ref => {
+  let {
+    theme
+  } = _ref;
+  return "1px solid ".concat(theme.colors.brand[600]);
+});
+const Label = /*#__PURE__*/styled.p.withConfig({
+  componentId: "sc-snqcgs-2"
+})(["width:100%;font-size:14px;margin:10px;"]);
+const Separator = /*#__PURE__*/styled.div.withConfig({
+  componentId: "sc-snqcgs-3"
+})(["width:100%;border:none;border-bottom:1px solid #ccc;"]);
+
+export { ItemWrapper, Label, List, Separator };

package/esm/outOfTheBox/SearchToggle/SearchToggle.js

@@ -1,12 +1,33 @@
-import * as React from "react";
-import React2, { useState, useCallback, useRef } from "react";
-import { Search } from "@elliemae/ds-icons";
-import { getDataProps } from "@elliemae/ds-props-helpers";
-import { DSIconColors } from "@elliemae/ds-icon";
-import { DSNavSearchBox } from "@elliemae/ds-form";
-import { StyledNavSearchBoxContainer } from "./styles";
-import { Button } from "../../components/Toolbar/styles";
-const SearchToggle = ({ id, componentProps, ...otherProps }) => {
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { useState, useRef, useCallback } from 'react';
+import { Search } from '@elliemae/ds-icons';
+import { getDataProps } from '@elliemae/ds-props-helpers';
+import { DSIconColors } from '@elliemae/ds-icon';
+import { DSNavSearchBox } from '@elliemae/ds-form';
+import { StyledNavSearchBoxContainer } from './styles.js';
+import { Button } from '../../components/Toolbar/styles.js';
+import { jsx } from 'react/jsx-runtime';
+
+const _excluded = ["id", "componentProps"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+const SearchToggle = _ref => {
+  let {
+    id,
+    componentProps
+  } = _ref,
+      otherProps = _objectWithoutProperties(_ref, _excluded);
+
   const [isOpen, setIsOpen] = useState(false);
   const inputRef = useRef(null);
   const triggerRef = useRef(null);
@@ -25,55 +46,58 @@ const SearchToggle = ({ id, componentProps, ...otherProps }) => {
     onKeyDown,
     onClick
   } = componentProps;
-  const handleOnClick = useCallback((e) => {
-    if (userIsOpen === void 0)
-      setIsOpen(true);
-    if (onClick)
-      onClick(e);
+  const handleOnClick = useCallback(e => {
+    if (userIsOpen === undefined) setIsOpen(true);
+    if (onClick) onClick(e);
   }, [onClick, userIsOpen]);
-  const handleOnKeyDown = useCallback((e) => {
-    if (userIsOpen === void 0) {
-      if (e.code === "Escape") {
+  const handleOnKeyDown = useCallback(e => {
+    if (userIsOpen === undefined) {
+      if (e.code === 'Escape') {
         setIsOpen(false);
-        setTimeout(() => triggerRef.current?.focus());
+        setTimeout(() => {
+          var _triggerRef$current;
+
+          return (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.focus();
+        });
       }
     }
-    if (onKeyDown)
-      onKeyDown(e);
+
+    if (onKeyDown) onKeyDown(e);
   }, [onKeyDown, userIsOpen]);
   const handleOnBlur = useCallback(() => {
     setTimeout(() => {
-      const contains = containerRef.current?.contains(document.activeElement);
-      if (value === "" && !contains)
-        setIsOpen(false);
+      var _containerRef$current;
+
+      const contains = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.contains(document.activeElement);
+      if (value === '' && !contains) setIsOpen(false);
     });
   }, [value]);
-  return userIsOpen || isOpen ? /* @__PURE__ */ React2.createElement(StyledNavSearchBoxContainer, {
+  return userIsOpen || isOpen ? /*#__PURE__*/jsx(StyledNavSearchBoxContainer, {
     onKeyDown: handleOnKeyDown,
     ref: containerRef,
-    onBlur: handleOnBlur
-  }, /* @__PURE__ */ React2.createElement(DSNavSearchBox, {
-    onNext,
-    onPrevious,
-    currentResultIndex,
-    totalResults,
-    onClear,
-    placeholder,
-    onChange,
-    value,
-    onBlur,
-    innerRef: inputRef,
-    autoFocus: true
-  })) : /* @__PURE__ */ React2.createElement(Button, {
+    onBlur: handleOnBlur,
+    children: /*#__PURE__*/_jsx(DSNavSearchBox, {
+      onNext: onNext,
+      onPrevious: onPrevious,
+      currentResultIndex: currentResultIndex,
+      totalResults: totalResults,
+      onClear: onClear,
+      placeholder: placeholder,
+      onChange: onChange,
+      value: value,
+      onBlur: onBlur,
+      innerRef: inputRef,
+      autoFocus: true
+    })
+  }) : /*#__PURE__*/jsx(Button, _objectSpread(_objectSpread({
     onClick: handleOnClick,
     ref: triggerRef,
-    id,
-    ...getDataProps(otherProps)
-  }, /* @__PURE__ */ React2.createElement(Search, {
-    color: DSIconColors.WHITE
+    id: id
+  }, getDataProps(otherProps)), {}, {
+    children: /*#__PURE__*/_jsx(Search, {
+      color: DSIconColors.WHITE
+    })
   }));
 };
-export {
-  SearchToggle
-};
-//# sourceMappingURL=SearchToggle.js.map
+
+export { SearchToggle };

package/esm/outOfTheBox/SearchToggle/styles.js

@@ -1,53 +1,7 @@
-import * as React from "react";
-import styled from "styled-components";
-const StyledNavSearchBoxContainer = styled.div`
-  background: white;
-  position: relative;
+import styled from 'styled-components';
 
-  min-width: 260px;
+const StyledNavSearchBoxContainer = /*#__PURE__*/styled.div.withConfig({
+  componentId: "sc-1dlcqwh-0"
+})(["background:white;position:relative;min-width:260px;& .em-ds-button{margin-right:2px;height:24px;width:24px;}& .em-ds-input{border:none;outline:none;box-shadow:none;}& .em-ds-input:focus{border:none;box-shadow:none;}& .em-ds-input.em-ds-input--clearable:hover{border:none;outline:none;box-shadow:none;}& .em-ds-input-addon-wrapper{box-shadow:none;}& .em-ds-input-addon-wrapper:hover{outline:none;}& .em-ds-input-addon-wrapper__addon:hover{outline:none;}& .em-ds-input:not(.floating-label-input-controller):hover:active{border:none;outline:none;box-shadow:none;}"]);
 
-  & .em-ds-button {
-    margin-right: 2px;
-    height: 24px;
-    width: 24px;
-  }
-
-  & .em-ds-input {
-    border: none;
-    outline: none;
-    box-shadow: none;
-  }
-
-  & .em-ds-input:focus {
-    border: none;
-    box-shadow: none;
-  }
-
-  & .em-ds-input.em-ds-input--clearable:hover {
-    border: none;
-    outline: none;
-    box-shadow: none;
-  }
-
-  & .em-ds-input-addon-wrapper {
-    box-shadow: none;
-  }
-
-  & .em-ds-input-addon-wrapper:hover {
-    outline: none;
-  }
-
-  & .em-ds-input-addon-wrapper__addon:hover {
-    outline: none;
-  }
-
-  & .em-ds-input:not(.floating-label-input-controller):hover:active {
-    border: none;
-    outline: none;
-    box-shadow: none;
-  }
-`;
-export {
-  StyledNavSearchBoxContainer
-};
-//# sourceMappingURL=styles.js.map
+export { StyledNavSearchBoxContainer };

package/esm/outOfTheBox/index.js

@@ -1,5 +1,3 @@
-import * as React from "react";
-export * from "./AppPicker/AppPicker";
-export * from "./PopupMenu/PopupMenu";
-export * from "./SearchToggle/SearchToggle";
-//# sourceMappingURL=index.js.map
+export { AppPicker } from './AppPicker/AppPicker.js';
+export { PopupMenu } from './PopupMenu/PopupMenu.js';
+export { SearchToggle } from './SearchToggle/SearchToggle.js';

package/esm/propTypes.js

@@ -1,27 +1,23 @@
-import * as React from "react";
-import { PropTypes } from "react-desc";
+import { PropTypes } from 'react-desc';
+
 const breadcrumbItem = PropTypes.shape({
-  label: PropTypes.string.description("breadrcrumb item label"),
-  hasNext: PropTypes.bool.description("whether the item has a child or not"),
-  isSelected: PropTypes.bool.description("whether the item is selected or not"),
-  onClick: PropTypes.func.description("Callback executed on click")
+  label: PropTypes.string.description('breadrcrumb item label'),
+  hasNext: PropTypes.bool.description('whether the item has a child or not'),
+  isSelected: PropTypes.bool.description('whether the item is selected or not'),
+  onClick: PropTypes.func.description('Callback executed on click')
 });
 const toolbarItem = PropTypes.shape({
-  label: PropTypes.string.description("title tag description"),
-  type: PropTypes.oneOf(["ds-app-picker", "ds-popup-menu", "ds-search-toggle", "custom"]).description("use to select one of the out-of-the-box types of items"),
-  componentProps: PropTypes.object.description("props of out-of-the-box component"),
-  Icon: PropTypes.func.description("Icon to display"),
-  onClick: PropTypes.func.description("Callback executed on click")
+  label: PropTypes.string.description('title tag description'),
+  type: PropTypes.oneOf(['ds-app-picker', 'ds-popup-menu', 'ds-search-toggle', 'custom']).description('use to select one of the out-of-the-box types of items'),
+  componentProps: PropTypes.object.description('props of out-of-the-box component'),
+  Icon: PropTypes.func.description('Icon to display'),
+  onClick: PropTypes.func.description('Callback executed on click')
 });
 const globalHeaderProps = {
-  Logo: PropTypes.func.description("Global Header Logo to render. Logo and LogoWithBrand are going to swap during window resizing."),
-  LogoWithBrand: PropTypes.func.description("Global Header Logo With Brand title to render. Logo and LogoWithBrand are going to swap during window resizing."),
-  breadcrumb: PropTypes.arrayOf(breadcrumbItem).description("Breadcrumb items to display. max 3 levels"),
-  toolbar: PropTypes.arrayOf(toolbarItem).description("Toolbar items")
+  Logo: PropTypes.func.description('Global Header Logo to render. Logo and LogoWithBrand are going to swap during window resizing.'),
+  LogoWithBrand: PropTypes.func.description('Global Header Logo With Brand title to render. Logo and LogoWithBrand are going to swap during window resizing.'),
+  breadcrumb: PropTypes.arrayOf(breadcrumbItem).description('Breadcrumb items to display. max 3 levels'),
+  toolbar: PropTypes.arrayOf(toolbarItem).description('Toolbar items')
 };
-export {
-  breadcrumbItem,
-  globalHeaderProps,
-  toolbarItem
-};
-//# sourceMappingURL=propTypes.js.map
+
+export { breadcrumbItem, globalHeaderProps, toolbarItem };

package/esm/styles.js

@@ -1,14 +1,13 @@
-import * as React from "react";
-import styled from "styled-components";
-import { GridContainer } from "@elliemae/ds-grid";
-const Wrapper = styled(GridContainer)`
-  background-image: linear-gradient(45deg, #0f364a 0%, #1b6392 54%, #164566 100%);
-  color: ${({ theme }) => theme.colors.neutral["000"]};
-  width: 100%;
-  height: 40px;
-  padding: 0 24px 0 12px;
-`;
-export {
-  Wrapper
-};
-//# sourceMappingURL=styles.js.map
+import styled from 'styled-components';
+import { GridContainer } from '@elliemae/ds-grid';
+
+const Wrapper = /*#__PURE__*/styled(GridContainer).withConfig({
+  componentId: "sc-1v5zxxm-0"
+})(["background-image:linear-gradient(45deg,#0f364a 0%,#1b6392 54%,#164566 100%);color:", ";width:100%;height:40px;padding:0 24px 0 12px;"], _ref => {
+  let {
+    theme
+  } = _ref;
+  return theme.colors.neutral['000'];
+});
+
+export { Wrapper };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-global-header",
-  "version": "2.2.0-alpha.2",
+  "version": "2.2.0-beta.0",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Global Header",
   "module": "./esm/index.js",
@@ -132,12 +132,12 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-app-picker": "2.2.0-alpha.2",
-    "@elliemae/ds-grid": "2.2.0-alpha.2",
-    "@elliemae/ds-icons": "2.2.0-alpha.2",
-    "@elliemae/ds-popperjs": "2.2.0-alpha.2",
-    "@elliemae/ds-props-helpers": "2.2.0-alpha.2",
-    "@elliemae/ds-utilities": "2.2.0-alpha.2",
+    "@elliemae/ds-app-picker": "2.2.0-beta.0",
+    "@elliemae/ds-grid": "2.2.0-beta.0",
+    "@elliemae/ds-icons": "2.2.0-beta.0",
+    "@elliemae/ds-popperjs": "2.2.0-beta.0",
+    "@elliemae/ds-props-helpers": "2.2.0-beta.0",
+    "@elliemae/ds-utilities": "2.2.0-beta.0",
     "react-desc": "~4.1.3",
     "uid": "~2.0.0"
   },

package/types/GlobalHeader.d.ts

@@ -32,7 +32,7 @@ declare const GlobalHeader: {
     };
 };
 declare const GlobalHeaderWithSchema: {
-    (props?: Props | undefined): JSX.Element;
+    (props?: unknown): JSX.Element;
     propTypes: unknown;
     toTypescript: () => import("react-desc").TypescriptSchema;
 };

package/cjs/GlobalHeader.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/GlobalHeader.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { describe } from 'react-desc';\nimport { globalHeaderProps } from './propTypes';\nimport type { GlobalHeaderPropsT as Props } from './GlobalHeaderTypes';\nimport { GlobalHeaderTitle } from './components/Title/GlobalHeaderTitle';\nimport { GlobalHeaderBreadcrumb } from './components/Breadcrumb/GlobalHeaderBreadcrumb';\nimport { GlobalHeaderToolbar } from './components/Toolbar/GlobalHeaderToolbar';\nimport { GlobalHeaderContext } from './GlobalHeaderContext';\nimport { useGlobalHeader } from './config/useGlobalHeader';\nimport { defaultProps } from './defaultProps';\nimport { GlobalHeaderContainer } from './GlobalHeaderContainer';\nimport { useValidateProps } from './config/useValidateProps';\n\nconst GlobalHeader = (props: Props): JSX.Element => {\n  useValidateProps(props);\n  const ctx = useGlobalHeader(props);\n  return (\n    <GlobalHeaderContainer>\n      <GlobalHeaderContext.Provider value={ctx}>\n        <GlobalHeaderTitle />\n        <GlobalHeaderBreadcrumb />\n        <GlobalHeaderToolbar />\n      </GlobalHeaderContext.Provider>\n    </GlobalHeaderContainer>\n  );\n};\n\nGlobalHeader.defaultProps = defaultProps;\n\nGlobalHeader.propTypes = globalHeaderProps;\nconst GlobalHeaderWithSchema = describe(GlobalHeader);\nGlobalHeaderWithSchema.propTypes = globalHeaderProps;\n\nexport { GlobalHeader, GlobalHeaderWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAyB;AACzB,uBAAkC;AAElC,+BAAkC;AAClC,oCAAuC;AACvC,iCAAoC;AACpC,iCAAoC;AACpC,6BAAgC;AAChC,0BAA6B;AAC7B,mCAAsC;AACtC,8BAAiC;AAEjC,MAAM,eAAe,CAAC,UAA8B;AAClD,gDAAiB;AACjB,QAAM,MAAM,4CAAgB;AAC5B,SACE,mDAAC,oDAAD,MACE,mDAAC,+CAAoB,UAArB;AAAA,IAA8B,OAAO;AAAA,KACnC,mDAAC,4CAAD,OACA,mDAAC,sDAAD,OACA,mDAAC,gDAAD;AAAA;AAMR,aAAa,eAAe;AAE5B,aAAa,YAAY;AACzB,MAAM,yBAAyB,gCAAS;AACxC,uBAAuB,YAAY;",
-  "names": []
-}

package/cjs/GlobalHeaderContainer.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/GlobalHeaderContainer.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport type { GlobalHeaderContainerT } from './GlobalHeaderTypes';\nimport { Wrapper } from './styles';\n\nexport const GlobalHeaderContainer = ({ children }: GlobalHeaderContainerT): JSX.Element => (\n  <header data-testid=\"ds-global-header\">\n    <Wrapper cols={['auto', '1fr', 'auto']}>{children}</Wrapper>\n  </header>\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,oBAAwB;AAEjB,MAAM,wBAAwB,CAAC,EAAE,eACtC,mDAAC,UAAD;AAAA,EAAQ,eAAY;AAAA,GAClB,mDAAC,uBAAD;AAAA,EAAS,MAAM,CAAC,QAAQ,OAAO;AAAA,GAAU;",
-  "names": []
-}

package/cjs/GlobalHeaderContext.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/GlobalHeaderContext.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { createContext } from 'react';\nimport { defaultProps } from './defaultProps';\nimport type { ContextT } from './GlobalHeaderTypes';\n\nconst noop = () => null;\n\nconst defaultContext = {\n  props: defaultProps,\n  showIconOnly: false,\n  setShowIconOnly: noop,\n  instanceUID: '',\n  globalHeaderToolbarGrid: [],\n  globalHeaderBreadcrumbGrid: [],\n};\n\nexport const GlobalHeaderContext = createContext<ContextT>(defaultContext);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA8B;AAC9B,0BAA6B;AAG7B,MAAM,OAAO,MAAM;AAEnB,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,yBAAyB;AAAA,EACzB,4BAA4B;AAAA;AAGvB,MAAM,sBAAsB,gCAAwB;",
-  "names": []
-}

package/cjs/GlobalHeaderTypes.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/GlobalHeaderTypes.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { DSAppPicker } from '@elliemae/ds-app-picker';\n\nexport type AppPickerProps = React.ComponentProps<typeof DSAppPicker>;\nexport interface ContextT {\n  showIconOnly: boolean;\n  setShowIconOnly: React.Dispatch<React.SetStateAction<boolean>>;\n  instanceUID: string;\n  globalHeaderToolbarGrid: string[];\n  globalHeaderBreadcrumbGrid: string[];\n  props: GlobalHeaderPropsT;\n}\n\nexport interface GlobalHeaderContainerT {\n  children: React.ReactNode;\n}\n\nexport interface GlobalHeaderPropsT {\n  Logo?: React.ComponentType;\n  LogoWithBrand?: React.ComponentType;\n  breadcrumb?: BreadcrumbItemT[];\n  toolbar?: ToolbarItemT[];\n  appPickerProps?: AppPickerProps;\n}\n\nexport interface BreadcrumbItemT {\n  label: string;\n  hasNext?: boolean;\n  isSelected?: boolean;\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n  length: number;\n}\n\nexport interface ToolbarItemT {\n  type?: 'ds-app-picker' | 'ds-popup-menu' | 'ds-search-toggle' | 'custom';\n  label: string;\n  Icon: React.ComponentType<Record<string, unknown>>;\n  onClick: (event: React.MouseEvent<HTMLElement>) => void;\n  componentProps?: PopupPropsT | AppPickerProps | SearchTogglePropsT;\n  CustomComponent?: React.ComponentType<{ item: ToolbarItemT }>;\n}\n\nexport interface PopupPropsT {\n  Icon?: React.ComponentType<Record<string, unknown>>;\n  options: PopupMenuItemT[];\n  closeOnClick?: boolean;\n  title?: string;\n  onClick: (event: React.MouseEvent<HTMLElement>) => void;\n}\n\nexport interface AppPickerMenuItemT {\n  label: string;\n  icon: React.ComponentType;\n  onClick: (event: React.MouseEvent<HTMLElement>) => void;\n  disabled?: boolean;\n}\n\nexport interface PopupMenuItemT extends Record<string, unknown> {\n  type?: string;\n  Icon?: React.ComponentType;\n  label?: string;\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n  closeOnClick?: boolean;\n  Content?: React.ComponentType;\n}\n\nexport interface PopupMenuContentPropsT {\n  options: PopupMenuItemT[];\n  onItemClick: (event: React.MouseEvent<HTMLElement>) => void;\n  onClose: () => void;\n}\n\nexport interface PipeT {\n  showIconOnly: boolean;\n}\n\nexport interface LabelT {\n  isSelected: boolean;\n  isOnlyItem: boolean;\n}\n\nexport interface SearchTogglePropsT {\n  onNext: () => void;\n  onPrevious: () => void;\n  currentResultIndex: number;\n  totalResults: number;\n  placeholder: string;\n  value: string;\n  onChange: () => void;\n  onBlur: () => void;\n  onClear: () => void;\n  isOpen: boolean;\n  onKeyDown: (e: React.KeyboardEvent) => void;\n  onClick: (e: React.MouseEvent) => void;\n}\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;",
-  "names": []
-}

package/cjs/components/Breadcrumb/GlobalHeaderBreadcrumb.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Breadcrumb/GlobalHeaderBreadcrumb.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useEffect, useContext, useRef } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { Pipe } from './styles';\nimport { GlobalHeaderContext } from '../../GlobalHeaderContext';\nimport { PureBreadcrumb } from './PureBreadcrumb';\n\nexport const GlobalHeaderBreadcrumb = (): JSX.Element => {\n  const {\n    props: { breadcrumb },\n    instanceUID,\n    showIconOnly,\n    setShowIconOnly,\n    globalHeaderBreadcrumbGrid,\n  } = useContext(GlobalHeaderContext);\n  const breakpoint = useRef<number | null>(null);\n  const flexRegion = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const evaluateShowIconOnly = () => {\n      if (flexRegion && flexRegion.current && flexRegion?.current.offsetWidth <= 0 && !breakpoint.current) {\n        setShowIconOnly(true);\n        breakpoint.current = window.innerWidth;\n      } else if (breakpoint && breakpoint.current !== null && window.innerWidth >= breakpoint.current) {\n        setShowIconOnly(false);\n        breakpoint.current = null;\n      }\n    };\n\n    evaluateShowIconOnly();\n\n    window.addEventListener('resize', evaluateShowIconOnly);\n    return () => window.removeEventListener('resize', evaluateShowIconOnly);\n  }, [breakpoint, flexRegion, setShowIconOnly]);\n\n  return (\n    <Grid\n      height=\"100%\"\n      alignItems=\"center\"\n      justifyContent=\"flex-start\"\n      aria-label=\"breadcrumbs\"\n      cols={globalHeaderBreadcrumbGrid}\n      role=\"navigation\"\n    >\n      <Pipe showIconOnly={showIconOnly} />\n      {breadcrumb?.map((item) => {\n        const { label, ...rest } = item;\n        return (\n          <PureBreadcrumb\n            label={label}\n            length={breadcrumb.length}\n            key={`${instanceUID}-breadcrumb-item-${label}`}\n            {...rest}\n          />\n        );\n      })}\n      <div id=\"global-header-flex-region\" ref={flexRegion}></div>\n    </Grid>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqD;AACrD,qBAAqB;AACrB,oBAAqB;AACrB,iCAAoC;AACpC,4BAA+B;AAExB,MAAM,yBAAyB,MAAmB;AACvD,QAAM;AAAA,IACJ,OAAO,EAAE;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,6BAAW;AACf,QAAM,aAAa,yBAAsB;AACzC,QAAM,aAAa,yBAAuB;AAE1C,8BAAU,MAAM;AACd,UAAM,uBAAuB,MAAM;AACjC,UAAI,cAAc,WAAW,WAAW,YAAY,QAAQ,eAAe,KAAK,CAAC,WAAW,SAAS;AACnG,wBAAgB;AAChB,mBAAW,UAAU,OAAO;AAAA,iBACnB,cAAc,WAAW,YAAY,QAAQ,OAAO,cAAc,WAAW,SAAS;AAC/F,wBAAgB;AAChB,mBAAW,UAAU;AAAA;AAAA;AAIzB;AAEA,WAAO,iBAAiB,UAAU;AAClC,WAAO,MAAM,OAAO,oBAAoB,UAAU;AAAA,KACjD,CAAC,YAAY,YAAY;AAE5B,SACE,mDAAC,qBAAD;AAAA,IACE,QAAO;AAAA,IACP,YAAW;AAAA,IACX,gBAAe;AAAA,IACf,cAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAK;AAAA,KAEL,mDAAC,oBAAD;AAAA,IAAM;AAAA,MACL,YAAY,IAAI,CAAC,SAAS;AACzB,UAAM,EAAE,UAAU,SAAS;AAC3B,WACE,mDAAC,sCAAD;AAAA,MACE;AAAA,MACA,QAAQ,WAAW;AAAA,MACnB,KAAK,GAAG,+BAA+B;AAAA,SACnC;AAAA;AAAA,MAIV,mDAAC,OAAD;AAAA,IAAK,IAAG;AAAA,IAA4B,KAAK;AAAA;AAAA;",
-  "names": []
-}

package/cjs/components/Breadcrumb/PureBreadcrumb.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Breadcrumb/PureBreadcrumb.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { ChevronSmallRight } from '@elliemae/ds-icons';\nimport { getDataProps } from '@elliemae/ds-props-helpers';\nimport { BreadcrumbItem, LabelButton, Label } from './styles';\nimport type { BreadcrumbItemT as Props } from '../../GlobalHeaderTypes';\n\nexport const PureBreadcrumb = React.memo(({ onClick, isSelected, length, label, hasNext, id, ...rest }: Props) => (\n  <BreadcrumbItem>\n    <LabelButton\n      onClick={onClick}\n      aria-selected={isSelected}\n      data-testid=\"gh-breadcrumb-btn\"\n      id={id}\n      {...getDataProps(rest)}\n    >\n      <Label isSelected={!!isSelected} isOnlyItem={length === 1}>\n        {label}\n      </Label>\n    </LabelButton>\n    {hasNext && <ChevronSmallRight size=\"m\" fill=\"#FFF\" />}\n  </BreadcrumbItem>\n));\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,sBAAkC;AAClC,8BAA6B;AAC7B,oBAAmD;AAG5C,MAAM,iBAAiB,qBAAM,KAAK,CAAC,EAAE,SAAS,YAAY,QAAQ,OAAO,SAAS,OAAO,WAC9F,mDAAC,8BAAD,MACE,mDAAC,2BAAD;AAAA,EACE;AAAA,EACA,iBAAe;AAAA,EACf,eAAY;AAAA,EACZ;AAAA,KACI,0CAAa;AAAA,GAEjB,mDAAC,qBAAD;AAAA,EAAO,YAAY,CAAC,CAAC;AAAA,EAAY,YAAY,WAAW;AAAA,GACrD,SAGJ,WAAW,mDAAC,mCAAD;AAAA,EAAmB,MAAK;AAAA,EAAI,MAAK;AAAA;",
-  "names": []
-}

package/cjs/components/Breadcrumb/styles.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Breadcrumb/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import styled from 'styled-components';\nimport type { LabelT, PipeT } from '../../GlobalHeaderTypes';\n\nexport const Pipe = styled.span<PipeT>`\n  margin: 0 7px 0 0;\n  border-left: ${({ showIconOnly }) => (showIconOnly ? 'none' : '1px solid #fff')};\n  height: 20px;\n`;\n\nexport const BreadcrumbItem = styled.div`\n  display: flex;\n  align-items: center;\n  height: 100%;\n`;\n\nexport const LabelButton = styled.button`\n  width: fit-content;\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  border: 1px solid transparent;\n  background-color: transparent;\n  outline: none;\n  cursor: pointer;\n  position: relative;\n  &:focus {\n    :before {\n      content: '';\n      position: absolute;\n      z-index: 2;\n      top: 2px;\n      left: -5px;\n      width: calc(100% + 10px);\n      height: calc(100% - 4px);\n      border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n      border-radius: 4px;\n    }\n  }\n`;\n\nexport const Label = styled.p<LabelT>`\n  color: ${({ theme }) => theme.colors.neutral['000']};\n  ${({ theme, isSelected }) =>\n    `-webkit-text-stroke: 0.4px  ${isSelected ? theme.colors.neutral['000'] : 'transparent'}`};\n  font-size: 16px;\n  text-transform: uppercase;\n  border-bottom: ${({ isSelected, isOnlyItem }) => `2px solid ${isSelected && !isOnlyItem ? '#FFF' : 'transparent'}`};\n  margin: 3px 5px 0 5px;\n  :hover {\n    ${({ theme }) => `-webkit-text-stroke: 0.4px ${theme.colors.neutral['000']}`};\n  }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAmB;AAGZ,MAAM,OAAO,iCAAO;AAAA;AAAA,iBAEV,CAAC,EAAE,mBAAoB,eAAe,SAAS;AAAA;AAAA;AAIzD,MAAM,iBAAiB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAM9B,MAAM,cAAc,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAmBR,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,QAAQ,iCAAO;AAAA,WACjB,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA,IAC3C,CAAC,EAAE,OAAO,iBACV,+BAA+B,aAAa,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA;AAAA,mBAG3D,CAAC,EAAE,YAAY,iBAAiB,aAAa,cAAc,CAAC,aAAa,SAAS;AAAA;AAAA;AAAA,MAG/F,CAAC,EAAE,YAAY,8BAA8B,MAAM,OAAO,QAAQ;AAAA;AAAA;",
-  "names": []
-}

package/cjs/components/Title/GlobalHeaderTitle.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Title/GlobalHeaderTitle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { GlobalHeaderContext } from '../../GlobalHeaderContext';\n\nexport const GlobalHeaderTitle = (): JSX.Element => {\n  const {\n    props: { Logo, LogoWithBrand },\n    showIconOnly,\n  } = useContext(GlobalHeaderContext);\n\n  return (\n    <Grid alignItems=\"center\" pr={showIconOnly ? '0px' : '36px'} cols={showIconOnly ? ['auto'] : ['auto', '1fr']}>\n      {Logo && showIconOnly && <Logo />}\n      {LogoWithBrand && !showIconOnly && <LogoWithBrand />}\n    </Grid>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkC;AAClC,qBAAqB;AACrB,iCAAoC;AAE7B,MAAM,oBAAoB,MAAmB;AAClD,QAAM;AAAA,IACJ,OAAO,EAAE,MAAM;AAAA,IACf;AAAA,MACE,6BAAW;AAEf,SACE,mDAAC,qBAAD;AAAA,IAAM,YAAW;AAAA,IAAS,IAAI,eAAe,QAAQ;AAAA,IAAQ,MAAM,eAAe,CAAC,UAAU,CAAC,QAAQ;AAAA,KACnG,QAAQ,gBAAgB,mDAAC,MAAD,OACxB,iBAAiB,CAAC,gBAAgB,mDAAC,eAAD;AAAA;",
-  "names": []
-}

package/cjs/components/Toolbar/GlobalHeaderToolbar.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Toolbar/GlobalHeaderToolbar.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ToolbarItems } from './ToolbarItems';\nimport { GlobalHeaderContext } from '../../GlobalHeaderContext';\n\nexport const GlobalHeaderToolbar = (): JSX.Element => {\n  const { globalHeaderToolbarGrid } = useContext(GlobalHeaderContext);\n  return (\n    <Grid\n      height=\"100%\"\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      gutter=\"xxs\"\n      cols={globalHeaderToolbarGrid}\n      role=\"toolbar\"\n    >\n      <ToolbarItems />\n    </Grid>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkC;AAClC,qBAAqB;AACrB,0BAA6B;AAC7B,iCAAoC;AAE7B,MAAM,sBAAsB,MAAmB;AACpD,QAAM,EAAE,4BAA4B,6BAAW;AAC/C,SACE,mDAAC,qBAAD;AAAA,IACE,QAAO;AAAA,IACP,YAAW;AAAA,IACX,gBAAe;AAAA,IACf,QAAO;AAAA,IACP,MAAM;AAAA,IACN,MAAK;AAAA,KAEL,mDAAC,kCAAD;AAAA;",
-  "names": []
-}