@x15ventures/x15-ui-library 3.11.4

package/dist/cjs/components/navigation/menu/subMenuItems/SubMenuItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SubMenuItems.js","names":["Object","defineProperty","exports","value","SubMenuItems","_react","_interopRequireWildcard","require","_menuUtilities","_SubMenuButton","_ClickOutside","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","menuId","activeRoute","subMenuItems","subMenuIsOpen","isHoverTrigger","subMenuId","level","path","onMenuButtonClick","behaviour","onSubmenuRefChange","length","menuRef","useRef","useEffect","useOnClickOutside","event","clickedElement","target","rootMenuElement","document","getElementById","closest","syntheticEvent","type","preventDefault","stopPropagation","parentPath","slice","menuItem","isOpen","undefined","nextLevel","parseInt","String","wrapperCssClass","createElement","className","id","ref","map","subMenuItem","index","menuItems","hideItem","isActive","hasSubmenu","subMenuCssClass","GetSubMenuCssClass","itemPath","key","SubMenuButton"],"sources":["../../../../../../src/components/navigation/menu/subMenuItems/SubMenuItems.tsx"],"sourcesContent":["'use client';\n\nimport React, { useRef, useEffect } from 'react';\nimport { GenericFunction } from '../../../../interfaces';\nimport { MenuItemPropTypes } from '../Menu.interfaces';\nimport { GetSubMenuCssClass } from '../menuUtilities';\nimport { SubMenuButton } from './SubMenuButton';\nimport { useOnClickOutside } from '../../../../hooks/ClickOutside';\n\ninterface SubMenuItemsProps {\n  menuId: string;\n  activeRoute: string;\n  subMenuItems?: MenuItemPropTypes[];\n  subMenuIsOpen?: boolean;\n  isHoverTrigger?: boolean;\n  subMenuId: string;\n  level: number;\n  path?: number[];\n  onMenuButtonClick: GenericFunction;\n  behaviour?: 'hamburger' | 'floating' | 'popSubmenus';\n  //eslint-disable-next-line no-unused-vars\n  onSubmenuRefChange?: (ref: React.RefObject<HTMLUListElement> | null) => void;\n}\n\nexport const SubMenuItems: React.FC<SubMenuItemsProps> = (\n  {\n    menuId,\n    activeRoute,\n    subMenuItems,\n    subMenuIsOpen = false,\n    isHoverTrigger = true,\n    subMenuId,\n    level = 0,\n    path = [],\n    onMenuButtonClick = () => {},\n    behaviour,\n    onSubmenuRefChange\n  }\n) => {\n  if (!subMenuItems || !subMenuItems.length) {\n    return '';\n  }\n\n  const menuRef = useRef<HTMLUListElement>(null);\n\n  useEffect(() => {\n    if (behaviour === 'popSubmenus' && level === 2 && subMenuIsOpen && onSubmenuRefChange) {\n      onSubmenuRefChange(menuRef);\n    } else if (behaviour === 'popSubmenus' && level === 2 && !subMenuIsOpen && onSubmenuRefChange) {\n      onSubmenuRefChange(null);\n    }\n  }, [subMenuIsOpen, level, behaviour, onSubmenuRefChange]);\n\n  useOnClickOutside(\n    menuRef,\n    behaviour === 'popSubmenus' && subMenuIsOpen && level > 1\n      ? (event: MouseEvent | TouchEvent | FocusEvent) => {\n        const clickedElement = event.target as Element;\n          \n        // Check if the clicked element is a menu button within this menu component\n        const rootMenuElement = document.getElementById(menuId);\n          \n        // Only consider clicks on menu elements that are part of this menu component\n        if (rootMenuElement && \n              (clickedElement.closest(`#${ menuId } .menuTrigger`) || \n               clickedElement.closest(`#${ menuId } .menuItem`))) {\n          // If we clicked on a menu button within this menu component, let normal click handling take over\n          return;\n        }\n\n        // Close submenu by simulating a click on its parent\n        if (path && path.length > 0) {\n          const syntheticEvent = {\n            type: 'click',\n            preventDefault: () => {},\n            stopPropagation: () => {}\n          } as React.UIEvent;\n            \n          // Get the parent path\n          const parentPath = path.length > 2 ? path.slice(0, -1) : path;\n            \n          if (parentPath.length > 0) {\n            // Create a minimal menu item that's currently open (so it will be closed)\n            const menuItem = { isOpen: true } as MenuItemPropTypes;\n            onMenuButtonClick(syntheticEvent, menuItem, parentPath);\n          }\n        }\n      }\n      : undefined\n  );\n\n  const nextLevel = parseInt(String(level), 10) + 1;\n\n  const wrapperCssClass = `\n    noBullet \n    subMenuItems \n    subMenuItems_level${ level } \n    ${ subMenuIsOpen ? 'isOpen' : '' }\n    ${ isHoverTrigger ? 'hoverTrigger' : '' }\n    `;\n\n  return (\n    <ul className={ wrapperCssClass } id={ subMenuId } \n      ref={ menuRef }\n    >\n      {\n        subMenuItems.map((subMenuItem, index) => {\n          const {\n            menuItems, hideItem, isOpen, isActive\n          } = subMenuItem;\n          const hasSubmenu = menuItems && menuItems.length > 0;\n\n          const subMenuId = `${ menuId }_subMenu_${ nextLevel }_${ index }`;\n          const subMenuCssClass = GetSubMenuCssClass({ level, subMenuItem });\n          const itemPath = [...path, index];\n\n          if (hideItem) {\n            return null;\n          }\n\n          return (\n            <li key={ subMenuId } className={ subMenuCssClass }>\n              <span className=\"menuItem\">\n                <SubMenuButton\n                  {\n                    ...{\n                      subMenuItem,\n                      subMenuId,\n                      hasSubmenu,\n                      activeRoute,\n                      path: itemPath,\n                      onMenuButtonClick,\n                      isHoverTrigger\n                    }\n                  }\n                />\n              </span>\n\n              <SubMenuItems\n                {\n                  ...{\n                    menuId,\n                    subMenuId,\n                    activeRoute,\n                    subMenuItems: menuItems,\n                    subMenuIsOpen: isOpen || isActive,\n                    level: nextLevel,\n                    path: itemPath,\n                    onMenuButtonClick,\n                    behaviour, // Pass behaviour to child SubMenuItems\n                    onSubmenuRefChange\n                  }\n                }\n              />\n            </li>\n          );\n        })\n      }\n    </ul>\n  );\n};"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/navigation/popupMenu/PopupMenu.js

@@ -0,0 +1,56 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.PopupMenu = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireWildcard(require("react"));
+var _Menu = require("../menu/Menu");
+var _UserPicButton = require("../../form/buttons/userPicButton/UserPicButton");
+var _NotificationsButton = require("../../form/buttons/notificationsButton/NotificationsButton");
+var _SimpleButton = require("../../form/buttons/SimpleButton");
+var _hooks = require("../../../hooks");
+require("./popupMenu.css");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const PopupMenu = props => {
+  const [isMenuShowing, setIsMenuShowing] = (0, _react.useState)(false);
+  const menuHolder = (0, _react.useRef)(null);
+  (0, _hooks.useOnClickOutside)(menuHolder, () => setIsMenuShowing(false));
+  (0, _hooks.usePopupKeys)(menuHolder, () => setIsMenuShowing(false));
+  const {
+    triggerSettings,
+    id = 'popupMenu',
+    popDirection = {
+      x: 'right',
+      y: 'down'
+    },
+    ...rest
+  } = props;
+  const toggleMenuShowing = () => {
+    setIsMenuShowing(!isMenuShowing);
+  };
+  const cssClass = `
+    popupMenu 
+    ${isMenuShowing ? 'open' : ''}
+    popDirection_${popDirection.x || 'right'}_${popDirection.y || 'down'}
+  `;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    id: id,
+    className: cssClass,
+    ref: menuHolder
+  }, triggerSettings.userSettings && /*#__PURE__*/_react.default.createElement(_UserPicButton.UserPicButton, (0, _extends2.default)({}, triggerSettings.userSettings, {
+    onClickHandler: toggleMenuShowing
+  })), triggerSettings.notificationsSettings && /*#__PURE__*/_react.default.createElement(_NotificationsButton.NotificationsButton, (0, _extends2.default)({}, triggerSettings.notificationsSettings, {
+    onClickHandler: toggleMenuShowing
+  })), triggerSettings.default && /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, (0, _extends2.default)({}, triggerSettings.default, {
+    onClickHandler: toggleMenuShowing
+  })), /*#__PURE__*/_react.default.createElement(_Menu.Menu, (0, _extends2.default)({}, rest, {
+    id: `${id}MenuItems`
+  })));
+};
+exports.PopupMenu = PopupMenu;
+var _default = exports.default = PopupMenu;
+//# sourceMappingURL=PopupMenu.js.map

package/dist/cjs/components/navigation/popupMenu/PopupMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopupMenu.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","default","PopupMenu","_extends2","_react","_interopRequireWildcard","_Menu","_UserPicButton","_NotificationsButton","_SimpleButton","_hooks","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","props","isMenuShowing","setIsMenuShowing","useState","menuHolder","useRef","useOnClickOutside","usePopupKeys","triggerSettings","id","popDirection","x","y","rest","toggleMenuShowing","cssClass","createElement","className","ref","userSettings","UserPicButton","onClickHandler","notificationsSettings","NotificationsButton","SimpleButton","Menu","_default"],"sources":["../../../../../src/components/navigation/popupMenu/PopupMenu.tsx"],"sourcesContent":["'use client';\n\nimport React, { useRef, useState } from 'react';\nimport { Menu, MenuProps } from '../menu/Menu';\nimport { ButtonProps } from '../../form/buttons/button.interface';\nimport { UserPicButton, UserPicButtonProps } from '../../form/buttons/userPicButton/UserPicButton';\nimport {\n  NotificationsButton,\n  NotificationsButtonProps\n} from '../../form/buttons/notificationsButton/NotificationsButton';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { useOnClickOutside, usePopupKeys } from '../../../hooks';\n\nimport './popupMenu.scss';\n\ntype DefaultPopupMenuTriggerProps = Omit<ButtonProps, 'onClickHandler'>\ntype UserPicPopupMenuTriggerProps = Omit<UserPicButtonProps, 'onClickHandler'>\ntype NotificationsPopupMenuTriggerProps = Omit<NotificationsButtonProps, 'onClickHandler'>\n\ninterface PopupMenuProps extends MenuProps {\n  activeRoute?: string;\n  triggerSettings: {\n    default?: DefaultPopupMenuTriggerProps,\n    userSettings?: UserPicPopupMenuTriggerProps,\n    notificationsSettings?: NotificationsPopupMenuTriggerProps\n  },\n  popDirection?: {\n    y?: 'up' | 'down',\n    x?: 'left' | 'right'\n  };\n  id: string;\n}\n\nexport const PopupMenu: React.FC<PopupMenuProps> = (\n  props\n) => {\n  const [isMenuShowing, setIsMenuShowing] = useState<boolean>(false);\n\n  const menuHolder = useRef<HTMLDivElement>(null);\n\n  useOnClickOutside(menuHolder, () => setIsMenuShowing(false));\n  usePopupKeys(menuHolder, () => setIsMenuShowing(false));\n\n  const {\n    triggerSettings,\n    id = 'popupMenu',\n    popDirection = { x: 'right', y: 'down' },\n    ...rest\n  } = props;\n\n  const toggleMenuShowing = () => {\n    setIsMenuShowing(!isMenuShowing);\n  };\n\n  const cssClass = `\n    popupMenu \n    ${ isMenuShowing ? 'open' : '' }\n    popDirection_${ popDirection.x || 'right' }_${ popDirection.y || 'down' }\n  `;\n\n  return (\n    <div id={ id } className={ cssClass } ref={ menuHolder }>\n      { triggerSettings.userSettings && <UserPicButton { ...triggerSettings.userSettings } onClickHandler={ toggleMenuShowing } /> }\n\n      { triggerSettings.notificationsSettings\n        && <NotificationsButton { ...triggerSettings.notificationsSettings } onClickHandler={ toggleMenuShowing } /> }\n\n      { triggerSettings.default && <SimpleButton { ...triggerSettings.default } onClickHandler={ toggleMenuShowing } /> }\n\n      <Menu { ...rest } id={ `${ id }MenuItems` } />\n    </div>\n  );\n};\n\nexport default PopupMenu;\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/navigation/popupMenu/popupMenu.css

@@ -0,0 +1,63 @@
+.popupMenu .menuWrapper {
+  position: absolute;
+  display: none;
+  background: var(--popupMenuBg, #eef2f4);
+  border: var(--popupMenuBorder, 1px solid #d3dee4);
+  border-radius: var(--popupMenuBorderRadius, 3px);
+  box-shadow: var(--popupMenuBoxShadow, 0 0 5px 0 #c2d0d9);
+  width: var(--popupMenuWidth, 280px);
+  max-height: var(--popupMenuMaxHeight, 350px);
+  overflow: auto;
+  top: 50px;
+  left: 0;
+}
+.popupMenu .menuWrapper .menu {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 10px;
+}
+.popupMenu .menuWrapper button {
+  background: var(--popupMenuButtonBg, #eef2f4);
+  border: var(--popupMenuButtonBorder, 1px solid #eef2f4);
+  color: var(--popupMenuButtonFgColor, #24282b);
+  padding: 0 10px;
+}
+.popupMenu .menuWrapper button:hover {
+  background: var(--popupMenuButtonBgHover, #d3dee4);
+  color: var(--popupMenuButtonFgColorHover, #181a1b);
+  border: var(--popupMenuButtonBorderHover, 1px solid #d3dee4);
+}
+.popupMenu .menuWrapper button {
+  width: 100%;
+  justify-content: left;
+}
+.popupMenu .menuWrapper button .labelText {
+  flex: 1;
+  text-align: left;
+}
+.popupMenu.open {
+  position: relative;
+}
+.popupMenu.open .menuWrapper {
+  display: flex;
+}
+.popupMenu.popDirection_left_down .menuWrapper {
+  left: auto;
+  right: 0;
+  top: 50px;
+}
+.popupMenu.popDirection_right_down .menuWrapper {
+  left: 0;
+  top: 50px;
+}
+.popupMenu.popDirection_left_up .menuWrapper {
+  left: auto;
+  right: 0;
+  top: auto;
+  bottom: 50px;
+}
+.popupMenu.popDirection_right_up .menuWrapper {
+  left: 0;
+  top: auto;
+  bottom: 50px;
+}

package/dist/cjs/components/navigation/searchPanelMenu/SearchPanelMenu.js

@@ -0,0 +1,58 @@
+"use strict";
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.SearchPanelMenu = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _SearchPanelMenuTrigger = require("./searchPanelMenuTrigger/SearchPanelMenuTrigger");
+var _SearchPanelMenuContent = require("./searchPanelMenuContent/SearchPanelMenuContent");
+require("./searchPanelMenu.css");
+var _hooks = require("../../../hooks");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const SearchPanelMenu = ({
+  panels,
+  activePanel = 0,
+  onSearch = () => {},
+  onSearchClear = () => {}
+}) => {
+  const searchPanelsMenus = (0, _react.useRef)(null);
+  const [activeMenu, setActiveMenu] = (0, _react.useState)(activePanel);
+  const [isMenuShowing, setIsMenuShowing] = (0, _react.useState)(false);
+  (0, _hooks.useOnClickOutside)(searchPanelsMenus, () => setIsMenuShowing(false));
+  (0, _hooks.usePopupKeys)(searchPanelsMenus, () => setIsMenuShowing(false));
+  const toggleSearchPanelMenu = panelNumber => {
+    setActiveMenu(panelNumber);
+    if (panelNumber === activeMenu) {
+      setIsMenuShowing(!isMenuShowing);
+    } else {
+      setIsMenuShowing(true);
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: searchPanelsMenus,
+    className: "searchPanelMenu"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "searchPanelMenuTriggers"
+  }, panels.map((panel, index) => /*#__PURE__*/_react.default.createElement(_SearchPanelMenuTrigger.SearchPanelMenuTrigger, {
+    key: `${panel.id}Trigger`,
+    panel: panel,
+    panelNumber: index,
+    onClick: toggleSearchPanelMenu
+  }))), /*#__PURE__*/_react.default.createElement("div", {
+    className: `searchPanelMenuPanels ${isMenuShowing ? 'open' : ''}`
+  }, panels.map((panel, index) => {
+    const isActive = index === activeMenu;
+    return /*#__PURE__*/_react.default.createElement(_SearchPanelMenuContent.SearchPanelMenuContent, {
+      isActive: isActive,
+      key: `${panel.id}Content`,
+      panel: panel,
+      onSearch: onSearch,
+      onSearchClear: onSearchClear
+    });
+  })));
+};
+exports.SearchPanelMenu = SearchPanelMenu;
+var _default = exports.default = SearchPanelMenu;
+//# sourceMappingURL=SearchPanelMenu.js.map

package/dist/cjs/components/navigation/searchPanelMenu/SearchPanelMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchPanelMenu.js","names":["Object","defineProperty","exports","value","default","SearchPanelMenu","_react","_interopRequireWildcard","require","_SearchPanelMenuTrigger","_SearchPanelMenuContent","_hooks","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","panels","activePanel","onSearch","onSearchClear","searchPanelsMenus","useRef","activeMenu","setActiveMenu","useState","isMenuShowing","setIsMenuShowing","useOnClickOutside","usePopupKeys","toggleSearchPanelMenu","panelNumber","createElement","ref","className","map","panel","index","SearchPanelMenuTrigger","key","id","onClick","isActive","SearchPanelMenuContent","_default"],"sources":["../../../../../src/components/navigation/searchPanelMenu/SearchPanelMenu.tsx"],"sourcesContent":["'use client';\n\nimport React, { useRef, useState } from 'react';\nimport { SearchPanelMenusProps } from './searchPanelMenu.interface';\nimport { SearchPanelMenuTrigger } from './searchPanelMenuTrigger/SearchPanelMenuTrigger';\nimport { SearchPanelMenuContent } from './searchPanelMenuContent/SearchPanelMenuContent';\n\nimport './searchPanelMenu.scss';\nimport { useOnClickOutside, usePopupKeys } from '../../../hooks';\n\nexport const SearchPanelMenu: React.FC<SearchPanelMenusProps> = (\n  {\n    panels,\n    activePanel = 0,\n    onSearch = () => {},\n    onSearchClear = () => {}\n  }\n) => {\n  const searchPanelsMenus = useRef<HTMLDivElement>(null);\n  const [activeMenu, setActiveMenu] = useState(activePanel);\n  const [isMenuShowing, setIsMenuShowing] = useState<boolean>(false);\n\n  useOnClickOutside(searchPanelsMenus, () => setIsMenuShowing(false));\n  usePopupKeys(searchPanelsMenus, () => setIsMenuShowing(false));\n\n  const toggleSearchPanelMenu = (panelNumber: number) => {\n    setActiveMenu(panelNumber);\n\n    if (panelNumber === activeMenu) {\n      setIsMenuShowing(!isMenuShowing);\n    } else {\n      setIsMenuShowing(true);\n    }\n  };\n\n  return (\n    <div ref={ searchPanelsMenus } className=\"searchPanelMenu\">\n      <div className=\"searchPanelMenuTriggers\">\n        { panels.map((panel, index) => (\n          <SearchPanelMenuTrigger\n            key={ `${ panel.id }Trigger` }\n            panel={ panel }\n            panelNumber={ index }\n            onClick={ toggleSearchPanelMenu }\n          />\n        )) }\n      </div>\n\n      <div className={ `searchPanelMenuPanels ${ isMenuShowing ? 'open' : '' }` }>\n        { panels.map((panel, index) => {\n          const isActive = index === activeMenu;\n\n          return (\n            <SearchPanelMenuContent\n              isActive={ isActive }\n              key={ `${ panel.id }Content` }\n              panel={ panel }\n              onSearch={ onSearch }\n              onSearchClear={ onSearchClear }\n            />\n          );\n        }) }\n      </div>\n    </div>\n  );\n};\n\nexport default SearchPanelMenu;\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/navigation/searchPanelMenu/searchPanelMenu.css

@@ -0,0 +1,133 @@
+/* Popovers */
+.searchPanelMenu {
+  position: relative;
+}
+.searchPanelMenu .searchPanelMenuTriggers {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  white-space: nowrap;
+}
+.searchPanelMenu .searchPanelMenuTriggers .searchPanelMenuTrigger:after {
+  content: "/";
+  margin-left: 10px;
+  text-align: right;
+  display: inline-block;
+}
+.searchPanelMenu .searchPanelMenuTriggers .searchPanelMenuTrigger:last-of-type:after {
+  display: none;
+}
+.searchPanelMenu .searchPanelMenuTriggers button {
+  background: var(--searchPanelMenuTriggerButtonBg, #e5ebef);
+  border: var(--searchPanelMenuTriggerButtonBorder, 1px solid #e5ebef);
+  color: var(--searchPanelMenuTriggerButtonFgColor, #24282b);
+}
+.searchPanelMenu .searchPanelMenuTriggers button:hover {
+  background: var(--searchPanelMenuTriggerButtonBgHover, #d3dee4);
+  color: var(--searchPanelMenuTriggerButtonFgColorHover, #181a1b);
+  border: var(--searchPanelMenuTriggerButtonBorderHover, 1px solid #d3dee4);
+}
+.searchPanelMenu .searchPanelMenuPanels {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  background: var(--searchPanelMenuBg, #eef2f4);
+  position: absolute;
+  margin-top: 5px;
+  display: none;
+  border: var(--searchPanelMenuBorder, 1px solid #d3dee4);
+  border-radius: var(--searchPanelMenuBorderRadius, 3px);
+  box-shadow: var(--searchPanelMenuBoxShadow, 0 0 5px 0 #c2d0d9);
+}
+.searchPanelMenu .searchPanelMenuPanels.open {
+  display: flex;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent {
+  display: flex;
+  flex-direction: column;
+  row-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  width: var(--searchPanelMenuContentWidth, 280px);
+  height: var(--searchPanelMenuContentHeight, 350px);
+  padding: 10px;
+  box-sizing: border-box;
+  border-left: var(--searchPanelMenuBorder, 1px solid #d3dee4);
+  overflow: auto;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent:first-of-type {
+  border-left: none;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .formField {
+  width: 100%;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList,
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelMenuActionButtons {
+  display: flex;
+  flex-direction: column;
+  row-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  width: 100%;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList button,
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelMenuActionButtons button {
+  background: var(--searchPanelMenuContentButtonBg, #eef2f4);
+  border: var(--searchPanelMenuContentButtonBorder, 1px solid #eef2f4);
+  color: var(--searchPanelMenuContentButtonFgColor, #24282b);
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList button:hover,
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelMenuActionButtons button:hover {
+  background: var(--searchPanelMenuContentButtonBgHover, #d3dee4);
+  color: var(--searchPanelMenuContentButtonFgColorHover, #181a1b);
+  border: var(--searchPanelMenuContentButtonBorderHover, 1px solid #d3dee4);
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList button,
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelMenuActionButtons button {
+  width: 100%;
+  justify-content: left;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList button .labelText,
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelMenuActionButtons button .labelText {
+  flex: 1;
+  text-align: left;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent h3 {
+  font-size: 15px;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .mainActionButtons {
+  display: flex;
+  flex-direction: column;
+  row-gap: 0;
+  align-items: center;
+  justify-content: flex-start;
+  width: 100%;
+  border-top: var(--searchPanelDivider, 1px solid #d3dee4);
+  border-bottom: var(--searchPanelDivider, 1px solid #d3dee4);
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResults,
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList,
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList ul {
+  width: 100%;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResults {
+  text-align: center;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .searchPanelResultsList {
+  display: flex;
+  flex-direction: column;
+  row-gap: 0;
+  align-items: center;
+  justify-content: flex-start;
+  border-bottom: var(--searchPanelDivider, 1px solid #d3dee4);
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .clearSearchButton {
+  margin-top: 20px;
+}
+.searchPanelMenu .searchPanelMenuPanels .searchPanelMenuContent .clearSearchButton .labelText {
+  text-align: center;
+}

package/dist/cjs/components/navigation/searchPanelMenu/searchPanelMenu.interface.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=searchPanelMenu.interface.js.map

package/dist/cjs/components/navigation/searchPanelMenu/searchPanelMenu.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchPanelMenu.interface.js","names":[],"sources":["../../../../../src/components/navigation/searchPanelMenu/searchPanelMenu.interface.ts"],"sourcesContent":["import { GenericFunction } from '../../../interfaces';\nimport { ButtonProps } from '../../form/buttons/button.interface';\n\nexport interface SearchPanelResultProps {\n  label: string;\n  id: string;\n  onClick: GenericFunction;\n}\n\nexport interface SearchPanelMenuProps {\n  id: string;\n  search: {\n    label: string;\n    id: string;\n    searchResults?: SearchPanelResultProps[];\n  };\n  heading?: string;\n  topActionButtons?: ButtonProps[];\n  mainActionButtons: ButtonProps[];\n  bottomActionButtons?: ButtonProps[];\n  activeActionButtonId: string;\n}\n\nexport interface SearchPanelMenuTriggerProps {\n  panel: SearchPanelMenuProps;\n  panelNumber: number;\n  onClick: GenericFunction;\n}\n\nexport interface SearchPanelSearchProps {\n  onSearchClear?: GenericFunction;\n  onSearch?: GenericFunction;\n}\n\nexport interface SearchPanelMenusProps extends SearchPanelSearchProps {\n  panels: SearchPanelMenuProps[],\n  activePanel: number;\n}\n\nexport interface SearchPanelMenuContentProps extends SearchPanelSearchProps {\n  panel: SearchPanelMenuProps;\n  isActive: boolean;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/cjs/components/navigation/searchPanelMenu/searchPanelMenuContent/SearchPanelMenuContent.js

@@ -0,0 +1,104 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SearchPanelMenuContent = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireWildcard(require("react"));
+var _FormField = require("../../../form/formFields/formFieldWrapper/FormField");
+var _SimpleButton = require("../../../form/buttons/SimpleButton");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const SearchPanelMenuContent = ({
+  panel,
+  isActive,
+  onSearch = () => {},
+  onSearchClear = () => {}
+}) => {
+  const {
+    id,
+    search,
+    heading,
+    topActionButtons,
+    mainActionButtons,
+    bottomActionButtons,
+    activeActionButtonId
+  } = panel;
+  const [isResultsShowing, setIsResultsShowing] = (0, _react.useState)(typeof search.searchResults !== 'undefined');
+
+  // TODO: This will likely need to be async promise based
+  const handleSearch = event => {
+    const searchTerm = event.target.value;
+    if (searchTerm === '') {
+      clearSearchResults();
+    } else {
+      setIsResultsShowing(true);
+      onSearch(searchTerm);
+    }
+  };
+  const handleSearchResultClick = searchResult => {
+    if (searchResult.onClick) {
+      searchResult.onClick(searchResult);
+    }
+  };
+  const clearSearchResults = () => {
+    setIsResultsShowing(false);
+    onSearchClear();
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: `searchPanelMenuContent ${isActive ? 'active' : ''}`
+  }, /*#__PURE__*/_react.default.createElement(_FormField.FormField, {
+    label: {
+      text: search.label,
+      hide: true
+    },
+    field: {
+      type: 'search',
+      id: `${id}Search`,
+      name: `${id}Search`,
+      onChange: handleSearch
+    }
+  }), isResultsShowing ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "searchPanelResults"
+  }, search.searchResults?.length === 0 ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "noSearchPanelResults"
+  }, /*#__PURE__*/_react.default.createElement("h4", null, "Sorry. No matches found")) : /*#__PURE__*/_react.default.createElement("div", {
+    className: "searchPanelResultsList"
+  }, /*#__PURE__*/_react.default.createElement("ul", {
+    className: "noBullet"
+  }, search.searchResults?.map(searchResult => /*#__PURE__*/_react.default.createElement("li", {
+    key: searchResult.id
+  }, /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, {
+    cssClass: "button",
+    label: searchResult.label,
+    id: `${searchResult.id}`,
+    onClickHandler: () => handleSearchResultClick(searchResult)
+  }))))), /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, {
+    cssClass: "button tertiary outline clearSearchButton",
+    label: "Clear search",
+    id: `${id}ClearSearchButton`,
+    onClickHandler: clearSearchResults
+  })) : /*#__PURE__*/_react.default.createElement("div", {
+    className: "searchPanelMenuActionButtons"
+  }, topActionButtons?.map(actionButton => /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, (0, _extends2.default)({
+    cssClass: "button"
+  }, actionButton, {
+    key: actionButton.id
+  }))), /*#__PURE__*/_react.default.createElement("h3", null, heading), /*#__PURE__*/_react.default.createElement("div", {
+    className: "mainActionButtons"
+  }, mainActionButtons?.map(actionButton => {
+    const cssClass = activeActionButtonId === actionButton.id ? 'button isActive' : 'button';
+    return /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, (0, _extends2.default)({}, actionButton, {
+      cssClass,
+      key: actionButton.id
+    }));
+  })), bottomActionButtons?.map(actionButton => /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, (0, _extends2.default)({
+    cssClass: "button"
+  }, actionButton, {
+    key: actionButton.id
+  })))));
+};
+exports.SearchPanelMenuContent = SearchPanelMenuContent;
+//# sourceMappingURL=SearchPanelMenuContent.js.map

package/dist/cjs/components/navigation/searchPanelMenu/searchPanelMenuContent/SearchPanelMenuContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchPanelMenuContent.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","SearchPanelMenuContent","_extends2","_react","_interopRequireWildcard","_FormField","_SimpleButton","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","panel","isActive","onSearch","onSearchClear","id","search","heading","topActionButtons","mainActionButtons","bottomActionButtons","activeActionButtonId","isResultsShowing","setIsResultsShowing","useState","searchResults","handleSearch","event","searchTerm","target","clearSearchResults","handleSearchResultClick","searchResult","onClick","createElement","className","FormField","label","text","hide","field","type","name","onChange","length","map","key","SimpleButton","cssClass","onClickHandler","actionButton"],"sources":["../../../../../../src/components/navigation/searchPanelMenu/searchPanelMenuContent/SearchPanelMenuContent.tsx"],"sourcesContent":["'use client';\n\nimport React, { ChangeEvent, KeyboardEvent, useState } from 'react';\nimport { SearchPanelMenuContentProps, SearchPanelResultProps } from '../searchPanelMenu.interface';\nimport { FormField } from '../../../form/formFields/formFieldWrapper/FormField';\nimport { SimpleButton } from '../../../form/buttons/SimpleButton';\n\nexport const SearchPanelMenuContent: React.FC<SearchPanelMenuContentProps> = (\n  {\n    panel,\n    isActive,\n    onSearch = () => {},\n    onSearchClear = () => {}\n  }\n) => {\n  const {\n    id,\n    search,\n    heading,\n    topActionButtons,\n    mainActionButtons,\n    bottomActionButtons,\n    activeActionButtonId\n  } = panel;\n\n  const [isResultsShowing, setIsResultsShowing] = useState(typeof search.searchResults !== 'undefined');\n\n  // TODO: This will likely need to be async promise based\n  const handleSearch = (event: ChangeEvent<HTMLInputElement> | KeyboardEvent<HTMLSelectElement> | KeyboardEvent<HTMLTextAreaElement>) => {\n    const searchTerm = (event as ChangeEvent<HTMLInputElement>).target.value;\n    if (searchTerm === '') {\n      clearSearchResults();\n    } else {\n      setIsResultsShowing(true);\n      onSearch(searchTerm);\n    }\n  };\n\n  const handleSearchResultClick = (searchResult: SearchPanelResultProps) => {\n    if (searchResult.onClick) {\n      searchResult.onClick(searchResult);\n    }\n  };\n\n  const clearSearchResults = () => {\n    setIsResultsShowing(false);\n    onSearchClear();\n  };\n\n  return (\n    <div className={ `searchPanelMenuContent ${ isActive ? 'active' : '' }` }>\n      <FormField\n        { ...{\n          label: {\n            text: search.label,\n            hide: true\n          },\n          field: {\n            type: 'search',\n            id: `${ id }Search`,\n            name: `${ id }Search`,\n            onChange: handleSearch\n          }\n        } }\n      />\n\n      { isResultsShowing ? (\n        <div className=\"searchPanelResults\">\n          { search.searchResults?.length === 0 ? (\n            <div className=\"noSearchPanelResults\">\n              <h4>Sorry. No matches found</h4>\n            </div>\n          ) : (\n            <div className=\"searchPanelResultsList\">\n              <ul className=\"noBullet\">\n                {\n                  search.searchResults?.map((searchResult) => (\n                    <li key={ searchResult.id }>\n                      <SimpleButton cssClass=\"button\" label={ searchResult.label } id={ `${ searchResult.id }` } onClickHandler={ () => handleSearchResultClick(searchResult) } />\n                    </li>\n                  ))\n                }\n              </ul>\n            </div>\n          ) }\n          <SimpleButton cssClass=\"button tertiary outline clearSearchButton\" label=\"Clear search\" id={ `${ id }ClearSearchButton` } onClickHandler={ clearSearchResults } />\n        </div>\n      ) : (\n        <div className=\"searchPanelMenuActionButtons\">\n          { topActionButtons?.map((actionButton) => (\n            <SimpleButton cssClass=\"button\"\n              { ...actionButton }\n              key={ actionButton.id }\n            />\n          )) }\n          <h3>{ heading }</h3>\n          <div className=\"mainActionButtons\">\n            { mainActionButtons?.map((actionButton) => {\n              const cssClass = activeActionButtonId === actionButton.id ? 'button isActive' : 'button';\n              return <SimpleButton { ...{ ...actionButton, cssClass } } key={ actionButton.id } />;\n            }) }\n          </div>\n          { bottomActionButtons?.map((actionButton) => (\n            <SimpleButton cssClass=\"button\"\n              { ...actionButton }\n              key={ actionButton.id }\n            />\n          )) }\n        </div>\n      ) }\n    </div>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/navigation/searchPanelMenu/searchPanelMenuTrigger/SearchPanelMenuTrigger.js

@@ -0,0 +1,40 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SearchPanelMenuTrigger = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _SimpleButton = require("../../../form/buttons/SimpleButton");
+const SearchPanelMenuTrigger = ({
+  panel,
+  panelNumber,
+  onClick = () => {}
+}) => {
+  const {
+    activeActionButtonId,
+    mainActionButtons
+  } = panel;
+  let activeActionButton = mainActionButtons.find(actionButton => actionButton.id === activeActionButtonId);
+  if (!activeActionButton) {
+    activeActionButton = mainActionButtons[0];
+  }
+  const {
+    id
+  } = activeActionButton;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "searchPanelMenuTrigger"
+  }, /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, (0, _extends2.default)({}, activeActionButton, {
+    cssClass: 'button',
+    id: `${id}MenuTrigger`,
+    onClickHandler: () => onClick(panelNumber),
+    rightIcon: {
+      icon: 'menu3'
+    }
+  })));
+};
+exports.SearchPanelMenuTrigger = SearchPanelMenuTrigger;
+//# sourceMappingURL=SearchPanelMenuTrigger.js.map

package/dist/cjs/components/navigation/searchPanelMenu/searchPanelMenuTrigger/SearchPanelMenuTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchPanelMenuTrigger.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","SearchPanelMenuTrigger","_extends2","_react","_SimpleButton","panel","panelNumber","onClick","activeActionButtonId","mainActionButtons","activeActionButton","find","actionButton","id","default","createElement","className","SimpleButton","cssClass","onClickHandler","rightIcon","icon"],"sources":["../../../../../../src/components/navigation/searchPanelMenu/searchPanelMenuTrigger/SearchPanelMenuTrigger.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { ButtonProps } from '../../../form/buttons/button.interface';\nimport { SimpleButton } from '../../../form/buttons/SimpleButton';\nimport { SearchPanelMenuTriggerProps } from '../searchPanelMenu.interface';\n\nexport const SearchPanelMenuTrigger: React.FC<SearchPanelMenuTriggerProps> = (\n  {\n    panel,\n    panelNumber,\n    onClick = () => {}\n  }\n) => {\n  const { activeActionButtonId, mainActionButtons } = panel;\n  let activeActionButton = mainActionButtons.find((actionButton) => actionButton.id === activeActionButtonId);\n\n  if (!activeActionButton) {\n    activeActionButton = mainActionButtons[0] as ButtonProps;\n  }\n\n  const { id } = activeActionButton;\n\n  return (\n    <div className=\"searchPanelMenuTrigger\">\n      <SimpleButton\n        {\n          ...{\n            ...activeActionButton,\n            cssClass: 'button',\n            id: `${ id }MenuTrigger`,\n            onClickHandler: () => onClick(panelNumber),\n            rightIcon: { icon: 'menu3' }\n          }\n        }\n      />\n    </div>\n  );\n};\n"],"mappings":";AAAA,YAAY;;AAAC,IAAAA,sBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,sBAAA;AAAA,IAAAC,SAAA,GAAAP,sBAAA,CAAAC,OAAA;AAEb,IAAAO,MAAA,GAAAR,sBAAA,CAAAC,OAAA;AAEA,IAAAQ,aAAA,GAAAR,OAAA;AAGO,MAAMK,sBAA6D,GAAGA,CAC3E;EACEI,KAAK;EACLC,WAAW;EACXC,OAAO,GAAGA,CAAA,KAAM,CAAC;AACnB,CAAC,KACE;EACH,MAAM;IAAEC,oBAAoB;IAAEC;EAAkB,CAAC,GAAGJ,KAAK;EACzD,IAAIK,kBAAkB,GAAGD,iBAAiB,CAACE,IAAI,CAAEC,YAAY,IAAKA,YAAY,CAACC,EAAE,KAAKL,oBAAoB,CAAC;EAE3G,IAAI,CAACE,kBAAkB,EAAE;IACvBA,kBAAkB,GAAGD,iBAAiB,CAAC,CAAC,CAAgB;EAC1D;EAEA,MAAM;IAAEI;EAAG,CAAC,GAAGH,kBAAkB;EAEjC,oBACEP,MAAA,CAAAW,OAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAAwB,gBACrCb,MAAA,CAAAW,OAAA,CAAAC,aAAA,CAACX,aAAA,CAAAa,YAAY,MAAAf,SAAA,CAAAY,OAAA,MAGJJ,kBAAkB;IACrBQ,QAAQ,EAAE,QAAQ;IAClBL,EAAE,EAAE,GAAIA,EAAE,aAAc;IACxBM,cAAc,EAAEA,CAAA,KAAMZ,OAAO,CAACD,WAAW,CAAC;IAC1Cc,SAAS,EAAE;MAAEC,IAAI,EAAE;IAAQ;EAAC,EAGjC,CACE,CAAC;AAEV,CAAC;AAACtB,OAAA,CAAAE,sBAAA,GAAAA,sBAAA","ignoreList":[]}

package/dist/cjs/components/templates/templateDashboard/TemplateDashboard.js

@@ -0,0 +1,75 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.TemplateDashboard = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireWildcard(require("react"));
+var _AppContextProvider = require("../../../contextProviders/appContext/AppContextProvider");
+var _ThemeLoader = require("../../design/themeLoader/ThemeLoader");
+var _MainHeader = require("../../layout/mainHeader/MainHeader");
+var _HookFormWrapper = require("../../form/hookFormWrapper/HookFormWrapper");
+var _SidePanel = require("../../design/sidePanel/SidePanel");
+require("./templateDashboard.css");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const TemplateDashboard = ({
+  children,
+  appConfig = {
+    theme: 'x15Core'
+  },
+  leftPanel,
+  mainHeader = {
+    logos: [{
+      ventureKey: 'x15'
+    }]
+  },
+  footer,
+  customCssClasses
+}) => {
+  const contentContainerElement = (0, _react.useRef)(null);
+  const [leftPanelOpen, setLeftPanelOpen] = (0, _react.useState)(leftPanel?.isOpen ?? true);
+  const toggleLeftPanel = () => {
+    if (leftPanel?.onPanelToggle) {
+      leftPanel.onPanelToggle(!leftPanelOpen);
+    }
+    setLeftPanelOpen(!leftPanelOpen);
+  };
+  const leftSidePanelProps = {
+    id: 'dashboardLeftPanel',
+    position: 'left',
+    size: 'm',
+    animation: 'slide',
+    isOpen: true,
+    onToggle: toggleLeftPanel,
+    allowOverflow: false,
+    isFloating: false,
+    icons: {
+      open: 'menu',
+      closed: 'chevronLeftSelect'
+    },
+    positionRefNode: contentContainerElement,
+    ...leftPanel
+  };
+  return /*#__PURE__*/_react.default.createElement(_AppContextProvider.AppContextProvider, {
+    appConfig: appConfig
+  }, /*#__PURE__*/_react.default.createElement(_ThemeLoader.ThemeLoader, null), /*#__PURE__*/_react.default.createElement("div", {
+    className: `dashboard dashboardContainer ${customCssClasses?.dashboardContainer || ''}`
+  }, /*#__PURE__*/_react.default.createElement(_HookFormWrapper.HookFormWrapper, null, /*#__PURE__*/_react.default.createElement(_MainHeader.MainHeader, (0, _extends2.default)({}, mainHeader, {
+    customCssClass: customCssClasses?.headerContainer
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "dashboardContent panelContainer",
+    ref: contentContainerElement
+  }, leftPanel ? /*#__PURE__*/_react.default.createElement(_SidePanel.SidePanel, leftSidePanelProps, /*#__PURE__*/_react.default.createElement("section", {
+    className: "leftPanelContent"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: `${leftPanel.allowOverflow ? 'allowOverflow' : ''}`
+  }, leftPanel.content))) : null, /*#__PURE__*/_react.default.createElement("main", {
+    className: `dashboardMainContent ${customCssClasses?.mainContentContainer || ''}`
+  }, children, footer ?? null)))));
+};
+exports.TemplateDashboard = TemplateDashboard;
+var _default = exports.default = TemplateDashboard;
+//# sourceMappingURL=TemplateDashboard.js.map