@x15ventures/x15-ui-library 3.11.4

package/dist/esm/components/layout/mainHeader/MainHeader.js

@@ -0,0 +1,61 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useEffect, useRef, useState } from 'react';
+import { VentureLogo } from '../../design/logos/VentureLogo';
+import { FormField } from '../../form/formFields/formFieldWrapper/FormField';
+import './mainHeader.css';
+export const MainHeader = ({
+  children,
+  logos,
+  pageTitleText,
+  customCssClass,
+  headerShouldPin = true,
+  search,
+  rightContent = null
+}) => {
+  const mainHeader = useRef(null);
+  const [isPinned, setIsPinned] = useState(false);
+  useEffect(() => {
+    if (headerShouldPin && mainHeader.current) {
+      const pinAmount = mainHeader.current.offsetHeight;
+      window.addEventListener('scroll', event => {
+        // @ts-ignore
+        const scrollAmount = event?.currentTarget?.scrollY;
+        if (scrollAmount > pinAmount) {
+          setIsPinned(true);
+          document.body.classList.add('pinnedHeader');
+        } else {
+          setIsPinned(false);
+          document.body.classList.remove('pinnedHeader');
+        }
+      });
+    }
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    ref: mainHeader,
+    className: `mainHeader 
+        ${customCssClass || ''} 
+        ${isPinned ? 'isPinned' : ''}`
+  }, /*#__PURE__*/React.createElement("header", null, /*#__PURE__*/React.createElement("section", {
+    className: "ventureLogos"
+  }, logos && /*#__PURE__*/React.createElement(React.Fragment, null, logos.map(logo => /*#__PURE__*/React.createElement(VentureLogo, _extends({
+    key: `mainHeaderLogo_${logo.ventureKey}`
+  }, logo))))), /*#__PURE__*/React.createElement("section", {
+    className: "mainHeaderContent"
+  }, pageTitleText && /*#__PURE__*/React.createElement("h1", null, pageTitleText), children, search && /*#__PURE__*/React.createElement(FormField, {
+    label: {
+      text: 'Demo label 2',
+      hide: true
+    },
+    field: {
+      type: 'search',
+      id: 'demo2',
+      name: 'demo2'
+    }
+  })), rightContent && /*#__PURE__*/React.createElement("section", {
+    className: "mainHeaderRightContent"
+  }, rightContent)));
+};
+export default MainHeader;
+//# sourceMappingURL=MainHeader.js.map

package/dist/esm/components/layout/mainHeader/MainHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainHeader.js","names":["_extends","React","useEffect","useRef","useState","VentureLogo","FormField","MainHeader","children","logos","pageTitleText","customCssClass","headerShouldPin","search","rightContent","mainHeader","isPinned","setIsPinned","current","pinAmount","offsetHeight","window","addEventListener","event","scrollAmount","currentTarget","scrollY","document","body","classList","add","remove","createElement","ref","className","Fragment","map","logo","key","ventureKey","label","text","hide","field","type","id","name"],"sources":["../../../../../src/components/layout/mainHeader/MainHeader.tsx"],"sourcesContent":["'use client';\n\nimport React, {\n  ReactElement, ReactNode, useEffect, useRef, useState\n} from 'react';\nimport { VentureLogo, VentureLogoProps } from '../../design/logos/VentureLogo';\nimport { GenericFunction } from '../../../interfaces';\nimport { FormField } from '../../form/formFields/formFieldWrapper/FormField';\n\nimport './mainHeader.scss';\n\nexport interface MainHeaderProps {\n  children?: ReactNode | ReactElement;\n  logos: VentureLogoProps[];\n  pageTitleText?: string;\n  customCssClass?: string;\n  headerShouldPin?: boolean;\n  search?: {\n    label: string;\n    id: string;\n    onSearch: GenericFunction;\n  };\n  rightContent?: ReactNode | ReactElement;\n}\n\nexport const MainHeader: React.FC<MainHeaderProps> = (\n  {\n    children,\n    logos,\n    pageTitleText,\n    customCssClass,\n    headerShouldPin = true,\n    search,\n    rightContent = null\n  }\n) => {\n  const mainHeader = useRef<HTMLDivElement>(null);\n  const [isPinned, setIsPinned] = useState(false);\n\n  useEffect(() => {\n    if (headerShouldPin && mainHeader.current) {\n      const pinAmount = mainHeader.current.offsetHeight;\n\n      window.addEventListener('scroll', (event: Event) => {\n         \n        // @ts-ignore\n        const scrollAmount = event?.currentTarget?.scrollY;\n        if (scrollAmount > pinAmount) {\n          setIsPinned(true);\n          document.body.classList.add('pinnedHeader');\n        } else {\n          setIsPinned(false);\n          document.body.classList.remove('pinnedHeader');\n        }\n      });\n    }\n  });\n\n  return (\n    <div\n      ref={ mainHeader }\n      className={\n        `mainHeader \n        ${ customCssClass || '' } \n        ${ isPinned ? 'isPinned' : '' }`\n      }\n    >\n      <header>\n        <section className=\"ventureLogos\">\n          { logos\n            && (\n              <>\n                {\n                  logos.map((logo) => (\n                    <VentureLogo key={ `mainHeaderLogo_${ logo.ventureKey }` } { ...logo } />\n                  ))\n                }\n              </>\n            ) }\n        </section>\n\n        <section className=\"mainHeaderContent\">\n          {\n            pageTitleText\n            && <h1>{ pageTitleText }</h1>\n          }\n\n          { children }\n\n          {\n            search\n            && (\n              <FormField\n                {\n                  ...{\n                    label: {\n                      text: 'Demo label 2',\n                      hide: true\n                    },\n                    field: {\n                      type: 'search',\n                      id: 'demo2',\n                      name: 'demo2'\n                    }\n                  }\n                }\n              />\n            )\n          }\n        </section>\n\n        { rightContent\n            && (\n              <section className=\"mainHeaderRightContent\">\n                { rightContent }\n              </section>\n            ) }\n      </header>\n    </div>\n  );\n};\n\nexport default MainHeader;\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,IACeC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAC/C,OAAO;AACd,SAASC,WAAW,QAA0B,gCAAgC;AAE9E,SAASC,SAAS,QAAQ,kDAAkD;AAE5E,OAAO,mBAAmB;AAgB1B,OAAO,MAAMC,UAAqC,GAAGA,CACnD;EACEC,QAAQ;EACRC,KAAK;EACLC,aAAa;EACbC,cAAc;EACdC,eAAe,GAAG,IAAI;EACtBC,MAAM;EACNC,YAAY,GAAG;AACjB,CAAC,KACE;EACH,MAAMC,UAAU,GAAGZ,MAAM,CAAiB,IAAI,CAAC;EAC/C,MAAM,CAACa,QAAQ,EAAEC,WAAW,CAAC,GAAGb,QAAQ,CAAC,KAAK,CAAC;EAE/CF,SAAS,CAAC,MAAM;IACd,IAAIU,eAAe,IAAIG,UAAU,CAACG,OAAO,EAAE;MACzC,MAAMC,SAAS,GAAGJ,UAAU,CAACG,OAAO,CAACE,YAAY;MAEjDC,MAAM,CAACC,gBAAgB,CAAC,QAAQ,EAAGC,KAAY,IAAK;QAElD;QACA,MAAMC,YAAY,GAAGD,KAAK,EAAEE,aAAa,EAAEC,OAAO;QAClD,IAAIF,YAAY,GAAGL,SAAS,EAAE;UAC5BF,WAAW,CAAC,IAAI,CAAC;UACjBU,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACC,GAAG,CAAC,cAAc,CAAC;QAC7C,CAAC,MAAM;UACLb,WAAW,CAAC,KAAK,CAAC;UAClBU,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACE,MAAM,CAAC,cAAc,CAAC;QAChD;MACF,CAAC,CAAC;IACJ;EACF,CAAC,CAAC;EAEF,oBACE9B,KAAA,CAAA+B,aAAA;IACEC,GAAG,EAAGlB,UAAY;IAClBmB,SAAS,EACP;AACR,UAAWvB,cAAc,IAAI,EAAE;AAC/B,UAAWK,QAAQ,GAAG,UAAU,GAAG,EAAE;EAC9B,gBAEDf,KAAA,CAAA+B,aAAA,8BACE/B,KAAA,CAAA+B,aAAA;IAASE,SAAS,EAAC;EAAc,GAC7BzB,KAAK,iBAEHR,KAAA,CAAA+B,aAAA,CAAA/B,KAAA,CAAAkC,QAAA,QAEI1B,KAAK,CAAC2B,GAAG,CAAEC,IAAI,iBACbpC,KAAA,CAAA+B,aAAA,CAAC3B,WAAW,EAAAL,QAAA;IAACsC,GAAG,EAAG,kBAAmBD,IAAI,CAACE,UAAU;EAAK,GAAMF,IAAI,CAAI,CACzE,CAEH,CAEC,CAAC,eAEVpC,KAAA,CAAA+B,aAAA;IAASE,SAAS,EAAC;EAAmB,GAElCxB,aAAa,iBACVT,KAAA,CAAA+B,aAAA,aAAMtB,aAAmB,CAAC,EAG7BF,QAAQ,EAGRK,MAAM,iBAEJZ,KAAA,CAAA+B,aAAA,CAAC1B,SAAS;IAGJkC,KAAK,EAAE;MACLC,IAAI,EAAE,cAAc;MACpBC,IAAI,EAAE;IACR,CAAC;IACDC,KAAK,EAAE;MACLC,IAAI,EAAE,QAAQ;MACdC,EAAE,EAAE,OAAO;MACXC,IAAI,EAAE;IACR;EAAC,CAGN,CAGE,CAAC,EAERhC,YAAY,iBAERb,KAAA,CAAA+B,aAAA;IAASE,SAAS,EAAC;EAAwB,GACvCpB,YACK,CAET,CACL,CAAC;AAEV,CAAC;AAED,eAAeP,UAAU","ignoreList":[]}

package/dist/esm/components/layout/mainHeader/mainHeader.css

@@ -0,0 +1,78 @@
+/* Popovers */
+.mainHeader {
+  background: var(--mainHeaderBg, #f6f8fa);
+  color: var(--mainHeaderFgColor, #24282b);
+  padding: var(--mainHeaderPadding, 0 20px);
+  border: var(--mainHeaderBorder, none);
+  border-bottom: var(--mainHeaderBorderBottom, 1px solid #e5ebef);
+  box-shadow: var(--mainHeaderBoxShadow, 0 3px 5px 0 #f6f8fa);
+  height: var(--mainHeaderHeight, 60px);
+}
+.mainHeader header {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+}
+.mainHeader header > section {
+  display: inline-flex;
+  justify-content: left;
+}
+.mainHeader header .mainHeaderContent {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  flex: 1;
+}
+.mainHeader header .mainHeaderRightContent {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  justify-content: right;
+  padding-right: 5px;
+}
+.mainHeader header .ventureLogos {
+  display: flex;
+  flex-direction: row;
+  column-gap: 20px;
+  align-items: center;
+  justify-content: flex-start;
+  margin-right: 20px;
+}
+.mainHeader header .ventureLogos .ventureLogo {
+  background: none;
+  max-height: var(--mainHeaderHeight, 60px);
+}
+.mainHeader header .ventureLogos .ventureLogo svg {
+  height: 30px;
+  padding-bottom: 3px;
+  max-height: var(--mainHeaderHeight, 60px);
+  width: auto;
+}
+.mainHeader header .ventureLogos .ventureLogo.x15VenturesLogo svg {
+  height: 24px;
+}
+.mainHeader header .ventureLogos .ventureLogo.xGraphLogo svg {
+  height: 30px;
+  padding-top: 3px;
+  padding-bottom: 0;
+}
+.mainHeader header .ventureLogos .ventureLogo.truyuLogo svg {
+  height: 40px;
+  padding-bottom: 0;
+}
+.mainHeader header .ventureLogos .ventureLogo.homeInLogo svg {
+  height: 40px;
+  padding-bottom: 0;
+}
+.mainHeader header label {
+  padding-bottom: 0;
+}
+.mainHeader header .popupMenu {
+  display: inline-flex;
+}

package/dist/esm/components/navigation/bubbleNavigator/BubbleNavigator.js

@@ -0,0 +1,88 @@
+'use client';
+
+import React, { useEffect, useReducer } from 'react';
+import { BubbleBranch } from './bubbleBranch/BubbleBranch';
+import { BubbleNavigatorReducer, InitialBubbleState } from './bubblesReducer';
+import { BubbleNavigatorFilter } from './bubbleNavigatorFilter/BubbleNavigatorFilter';
+import { BubbleNavigatorContextProvider } from './bubbleNavigatorContext/BubbleNavigatorContext';
+import './bubbleNavigator.css';
+
+/*
+  Receives the full json tree
+  Includes a sophisticated filtering capability
+  Creates a filtered tree
+  Sends filtered tree to the BubbleTree renderer
+ */
+
+export const BubbleNavigator = ({
+  bubblesData,
+  filters = []
+}) => {
+  const [state, dispatch] = useReducer(BubbleNavigatorReducer, InitialBubbleState, () => InitialBubbleState);
+  const HandleFilterChange = newFilterState => {
+    dispatch({
+      type: 'applyFilters',
+      filters: newFilterState
+    });
+  };
+  const HandleBubbleNavigation = ({
+    path,
+    childItem,
+    parentItem
+  }) => {
+    if (parentItem) {
+      if (path.length === 1) {
+        // Return to root level
+        dispatch({
+          type: 'drillUp',
+          parentItem: state.filteredData
+        });
+      } else {
+        dispatch({
+          type: 'drillUp',
+          parentItem
+        });
+      }
+    } else if (childItem?.childItems.length === 0) {
+      // TODO:
+      console.log('This would navigate to url', childItem.url);
+    } else {
+      dispatch({
+        type: 'drillDown',
+        childItem
+      });
+    }
+  };
+  useEffect(() => {
+    if (!state.initialised) {
+      dispatch({
+        type: 'init',
+        bubblesData,
+        filters
+      });
+    }
+  }, [filters, bubblesData, state.initialised]);
+  const isRootLevel = Array.isArray(state.activeItem);
+  const numBubbles = isRootLevel ? state.filteredData?.length : Object.values(state.activeItem).length;
+  const navigatorCssClass = `bubbleNavigator mainBubbleCount_${numBubbles}`;
+  const filterOptions = ['label', 'description', 'status'];
+  return /*#__PURE__*/React.createElement(BubbleNavigatorContextProvider, {
+    bubblesData: bubblesData
+  }, /*#__PURE__*/React.createElement("div", {
+    className: navigatorCssClass
+  }, /*#__PURE__*/React.createElement(BubbleNavigatorFilter, {
+    filterOptions,
+    filters: state.activeFilters,
+    onFilterChange: HandleFilterChange
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "bubbleTree"
+  }, isRootLevel ? state.filteredData && state.filteredData.map(childItem => /*#__PURE__*/React.createElement(BubbleBranch, {
+    key: childItem.id,
+    childItem: childItem,
+    handleBubbleClick: HandleBubbleNavigation
+  })) : state.activeItem && /*#__PURE__*/React.createElement(BubbleBranch, {
+    childItem: state.activeItem,
+    handleBubbleClick: HandleBubbleNavigation
+  }))));
+};
+//# sourceMappingURL=BubbleNavigator.js.map

package/dist/esm/components/navigation/bubbleNavigator/BubbleNavigator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BubbleNavigator.js","names":["React","useEffect","useReducer","BubbleBranch","BubbleNavigatorReducer","InitialBubbleState","BubbleNavigatorFilter","BubbleNavigatorContextProvider","BubbleNavigator","bubblesData","filters","state","dispatch","HandleFilterChange","newFilterState","type","HandleBubbleNavigation","path","childItem","parentItem","length","filteredData","childItems","console","log","url","initialised","isRootLevel","Array","isArray","activeItem","numBubbles","Object","values","navigatorCssClass","filterOptions","createElement","className","activeFilters","onFilterChange","map","key","id","handleBubbleClick"],"sources":["../../../../../src/components/navigation/bubbleNavigator/BubbleNavigator.tsx"],"sourcesContent":["'use client';\n\n \n\nimport React, { useEffect, useReducer } from 'react';\nimport { BubbleFilter, BubbleItem, BubbleNavigatorProps } from './bubbleNavigator.interface';\nimport { BubbleBranch } from './bubbleBranch/BubbleBranch';\nimport { BubbleNavigatorReducer, InitialBubbleState } from './bubblesReducer';\nimport { JSONObject } from '../../../interfaces/generic.interface';\nimport { BubbleNavigatorFilter } from './bubbleNavigatorFilter/BubbleNavigatorFilter';\nimport { BubbleNavigatorContextProvider } from './bubbleNavigatorContext/BubbleNavigatorContext';\n\nimport './bubbleNavigator.scss';\n\n/*\n  Receives the full json tree\n  Includes a sophisticated filtering capability\n  Creates a filtered tree\n  Sends filtered tree to the BubbleTree renderer\n */\n\nexport const BubbleNavigator: React.FC<BubbleNavigatorProps> = (\n  {\n    bubblesData,\n    filters = []\n  }\n) => {\n  const [state, dispatch] = useReducer(BubbleNavigatorReducer, InitialBubbleState, () => InitialBubbleState);\n\n  const HandleFilterChange = (newFilterState: BubbleFilter[]) => {\n    dispatch({ type: 'applyFilters', filters: newFilterState });\n  };\n\n  const HandleBubbleNavigation = (\n    {\n      path,\n      childItem,\n      parentItem\n    }\n    :\n    {\n      path: number[],\n      parentItem?: BubbleItem | BubbleItem[],\n      childItem?: BubbleItem,\n    }\n  ) => {\n    if (parentItem) {\n      if (path.length === 1) {\n        // Return to root level\n        dispatch({ type: 'drillUp', parentItem: state.filteredData });\n      } else {\n        dispatch({ type: 'drillUp', parentItem });\n      }\n    } else if (childItem?.childItems.length === 0) {\n      // TODO:\n      console.log('This would navigate to url', childItem.url);\n    } else {\n      dispatch({ type: 'drillDown', childItem });\n    }\n  };\n\n  useEffect(() => {\n    if (!state.initialised) {\n      dispatch({ type: 'init', bubblesData, filters });\n    }\n  }, [filters, bubblesData, state.initialised]);\n\n  const isRootLevel = Array.isArray(state.activeItem);\n  const numBubbles = isRootLevel ? state.filteredData?.length : Object.values(state.activeItem as JSONObject).length;\n  const navigatorCssClass = `bubbleNavigator mainBubbleCount_${ numBubbles }`;\n  const filterOptions = ['label', 'description', 'status'];\n\n  return (\n    <BubbleNavigatorContextProvider bubblesData={ bubblesData }>\n      <div className={ navigatorCssClass }>\n        <BubbleNavigatorFilter { ...{ filterOptions, filters: state.activeFilters, onFilterChange: HandleFilterChange } } />\n\n        <div className=\"bubbleTree\">\n          {\n            isRootLevel\n              ? state.filteredData && state.filteredData.map((childItem) => (\n                <BubbleBranch\n                  key={ childItem.id }\n                  {\n                    ...{\n                      childItem: childItem as BubbleItem,\n                      handleBubbleClick: HandleBubbleNavigation\n                    }\n                  }\n                />\n              ))\n              : state.activeItem && (\n                <BubbleBranch\n                  {\n                    ...{\n                      childItem: state.activeItem as BubbleItem,\n                      handleBubbleClick: HandleBubbleNavigation\n                    }\n                  }\n                />\n              )\n          }\n        </div>\n      </div>\n    </BubbleNavigatorContextProvider>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/navigation/bubbleNavigator/_bubbleNavigatorVariables.css

@@ -0,0 +1,14 @@
+:root {
+  --childBubbleFg: #fff;
+  --childBubbleBgGradient: radial-gradient(circle at 50% 35%, var(--childBubbleBgLightColor), var(--childBubbleBgDarkColor));
+  --childBubbleBgLightColor: #5cabff;
+  --childBubbleBgDarkColor: #000;
+  --childBubbleAnimation: glowBubble 10s ease infinite;
+  --childBubbleTextShadow: 1px 1px 3px #000;
+  --parentBubbleFg: #222;
+  --parentBubbleBgGradient: radial-gradient(circle at 50% 35%, var(--parentBubbleBgLightColor), var(--parentBubbleBgDarkColor));
+  --parentBubbleBgLightColor: #eee;
+  --parentBubbleBgDarkColor: #000;
+  --parentBubbleAnimation: animateBubble 10s ease infinite;
+  --parentBubbleTextShadow: 1px 1px 3px #fff;
+}

package/dist/esm/components/navigation/bubbleNavigator/bubble/Bubble.js

@@ -0,0 +1,50 @@
+'use client';
+
+import React from 'react';
+import { Icon } from '../../../design/icons/basicIcon/Icon';
+import { BubbleStatusSummary } from '../bubbleStatusSummary/BubbleStatusSummary';
+export const Bubble = ({
+  childItem,
+  isParentBubble = false,
+  onBubbleClick
+}) => {
+  const {
+    name,
+    id,
+    label,
+    description,
+    path,
+    childItems
+  } = childItem;
+  const noDrillDown = childItems.length === 0;
+  const handleBubbleClick = () => {
+    if (onBubbleClick) {
+      onBubbleClick({
+        childItem,
+        path
+      });
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: `bubble ${noDrillDown ? 'noDrillDown' : ''}`
+  }, isParentBubble ? /*#__PURE__*/React.createElement("div", {
+    className: "parentBubbleContent",
+    title: description,
+    id: `${name}_${path.join('_')}`
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "labelText"
+  }, label)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", {
+    title: description,
+    id: id,
+    type: "button",
+    onClick: handleBubbleClick,
+    className: "bubbleButton"
+  }, noDrillDown && /*#__PURE__*/React.createElement(Icon, {
+    icon: "externalLink"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "labelText"
+  }, label)), /*#__PURE__*/React.createElement(BubbleStatusSummary, {
+    childItem: childItem
+  })));
+};
+//# sourceMappingURL=Bubble.js.map

package/dist/esm/components/navigation/bubbleNavigator/bubble/Bubble.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bubble.js","names":["React","Icon","BubbleStatusSummary","Bubble","childItem","isParentBubble","onBubbleClick","name","id","label","description","path","childItems","noDrillDown","length","handleBubbleClick","createElement","className","title","join","Fragment","type","onClick","icon"],"sources":["../../../../../../src/components/navigation/bubbleNavigator/bubble/Bubble.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { GenericFunction } from '../../../../interfaces/generic.interface';\nimport { BubbleItem } from '../bubbleNavigator.interface';\nimport { Icon } from '../../../design/icons/basicIcon/Icon';\nimport { BubbleStatusSummary } from '../bubbleStatusSummary/BubbleStatusSummary';\n\ninterface BubbleProps {\n  childItem: BubbleItem;\n  isParentBubble?: boolean;\n  onBubbleClick?: GenericFunction;\n}\n\nexport const Bubble: React.FC<BubbleProps> = (\n  {\n    childItem,\n    isParentBubble = false,\n    onBubbleClick\n  }\n) => {\n  const {\n    name,\n    id,\n    label,\n    description,\n    path,\n    childItems\n  } = childItem;\n\n  const noDrillDown = childItems.length === 0;\n\n  const handleBubbleClick = () => {\n    if (onBubbleClick) {\n      onBubbleClick({\n        childItem,\n        path\n      });\n    }\n  };\n\n  return (\n    <div className={ `bubble ${ noDrillDown ? 'noDrillDown' : '' }` }>\n      {\n        isParentBubble\n          ? (\n            <div\n              className=\"parentBubbleContent\"\n              title={ description }\n              id={ `${ name }_${ path.join('_') }` }\n            >\n              <span className=\"labelText\">{ label }</span>\n            </div>\n          )\n          : (\n            <>\n              <button\n                title={ description }\n                id={ id }\n                type=\"button\"\n                onClick={ handleBubbleClick }\n                className=\"bubbleButton\"\n              >\n                {\n                  noDrillDown && <Icon icon=\"externalLink\" />\n                }\n                <span className=\"labelText\">{ label }</span>\n              </button>\n              <BubbleStatusSummary childItem={ childItem } />\n            </>\n          )\n      }\n    </div>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAM,OAAO;AAGzB,SAASC,IAAI,QAAQ,sCAAsC;AAC3D,SAASC,mBAAmB,QAAQ,4CAA4C;AAQhF,OAAO,MAAMC,MAA6B,GAAGA,CAC3C;EACEC,SAAS;EACTC,cAAc,GAAG,KAAK;EACtBC;AACF,CAAC,KACE;EACH,MAAM;IACJC,IAAI;IACJC,EAAE;IACFC,KAAK;IACLC,WAAW;IACXC,IAAI;IACJC;EACF,CAAC,GAAGR,SAAS;EAEb,MAAMS,WAAW,GAAGD,UAAU,CAACE,MAAM,KAAK,CAAC;EAE3C,MAAMC,iBAAiB,GAAGA,CAAA,KAAM;IAC9B,IAAIT,aAAa,EAAE;MACjBA,aAAa,CAAC;QACZF,SAAS;QACTO;MACF,CAAC,CAAC;IACJ;EACF,CAAC;EAED,oBACEX,KAAA,CAAAgB,aAAA;IAAKC,SAAS,EAAG,UAAWJ,WAAW,GAAG,aAAa,GAAG,EAAE;EAAK,GAE7DR,cAAc,gBAEVL,KAAA,CAAAgB,aAAA;IACEC,SAAS,EAAC,qBAAqB;IAC/BC,KAAK,EAAGR,WAAa;IACrBF,EAAE,EAAG,GAAID,IAAI,IAAMI,IAAI,CAACQ,IAAI,CAAC,GAAG,CAAC;EAAK,gBAEtCnB,KAAA,CAAAgB,aAAA;IAAMC,SAAS,EAAC;EAAW,GAAGR,KAAa,CACxC,CAAC,gBAGNT,KAAA,CAAAgB,aAAA,CAAAhB,KAAA,CAAAoB,QAAA,qBACEpB,KAAA,CAAAgB,aAAA;IACEE,KAAK,EAAGR,WAAa;IACrBF,EAAE,EAAGA,EAAI;IACTa,IAAI,EAAC,QAAQ;IACbC,OAAO,EAAGP,iBAAmB;IAC7BE,SAAS,EAAC;EAAc,GAGtBJ,WAAW,iBAAIb,KAAA,CAAAgB,aAAA,CAACf,IAAI;IAACsB,IAAI,EAAC;EAAc,CAAE,CAAC,eAE7CvB,KAAA,CAAAgB,aAAA;IAAMC,SAAS,EAAC;EAAW,GAAGR,KAAa,CACrC,CAAC,eACTT,KAAA,CAAAgB,aAAA,CAACd,mBAAmB;IAACE,SAAS,EAAGA;EAAW,CAAE,CAC9C,CAGL,CAAC;AAEV,CAAC","ignoreList":[]}

package/dist/esm/components/navigation/bubbleNavigator/bubbleBranch/BubbleBranch.js

@@ -0,0 +1,46 @@
+'use client';
+
+import React, { useContext } from 'react';
+import { Bubble } from '../bubble/Bubble';
+import { ParentReturnButton } from '../parentReturnButton/ParentReturnButton';
+import { BubbleNavigatorContext } from '../bubbleNavigatorContext/BubbleNavigatorContext';
+// Big bubble on the inside for full branch object.
+// Small bubbles on the outside representing the values.
+
+export const BubbleBranch = ({
+  childItem,
+  handleBubbleClick
+}) => {
+  const bubbleNavigatorContext = useContext(BubbleNavigatorContext);
+  if (!bubbleNavigatorContext) {
+    return null;
+  }
+  const {
+    bubbleNavigatorContext: bubblesData
+  } = bubbleNavigatorContext;
+  const {
+    childItems
+  } = childItem;
+  const numChildren = childItems.length;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "bubbleBranch"
+  }, bubblesData && /*#__PURE__*/React.createElement(ParentReturnButton, {
+    childItem,
+    onBubbleClick: handleBubbleClick
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "bubbleDiagram"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "parentBubble"
+  }, /*#__PURE__*/React.createElement(Bubble, {
+    childItem,
+    isParentBubble: true,
+    onBubbleClick: handleBubbleClick
+  })), /*#__PURE__*/React.createElement("div", {
+    className: `childBubbles childBubbles_${numChildren}`
+  }, childItems.map(childBubble => /*#__PURE__*/React.createElement(Bubble, {
+    key: childBubble.name,
+    childItem: childBubble,
+    onBubbleClick: handleBubbleClick
+  })))));
+};
+//# sourceMappingURL=BubbleBranch.js.map

package/dist/esm/components/navigation/bubbleNavigator/bubbleBranch/BubbleBranch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BubbleBranch.js","names":["React","useContext","Bubble","ParentReturnButton","BubbleNavigatorContext","BubbleBranch","childItem","handleBubbleClick","bubbleNavigatorContext","bubblesData","childItems","numChildren","length","createElement","className","onBubbleClick","isParentBubble","map","childBubble","key","name"],"sources":["../../../../../../src/components/navigation/bubbleNavigator/bubbleBranch/BubbleBranch.tsx"],"sourcesContent":["'use client';\n\nimport React, { useContext } from 'react';\nimport { GenericFunction } from '../../../../interfaces/generic.interface';\nimport { Bubble } from '../bubble/Bubble';\nimport { ParentReturnButton } from '../parentReturnButton/ParentReturnButton';\nimport { BubbleItem } from '../bubbleNavigator.interface';\nimport { BubbleNavigatorContext } from '../bubbleNavigatorContext/BubbleNavigatorContext';\n\ninterface BubbleBranchProps {\n  childItem: BubbleItem;\n  handleBubbleClick?: GenericFunction;\n}\n\n// Big bubble on the inside for full branch object.\n// Small bubbles on the outside representing the values.\n\nexport const BubbleBranch: React.FC<BubbleBranchProps> = (\n  {\n    childItem,\n    handleBubbleClick\n  }\n) => {\n  const bubbleNavigatorContext = useContext(BubbleNavigatorContext);\n\n  if (!bubbleNavigatorContext) {\n    return null;\n  }\n\n  const { bubbleNavigatorContext: bubblesData } = bubbleNavigatorContext;\n\n  const {\n    childItems\n  } = childItem;\n\n  const numChildren = childItems.length;\n\n  return (\n    <div className=\"bubbleBranch\">\n      {\n        bubblesData\n        && (\n          <ParentReturnButton {\n            ...{\n              childItem,\n              onBubbleClick: handleBubbleClick\n            }\n          }\n          />\n        )\n      }\n\n      <div className=\"bubbleDiagram\">\n        <div className=\"parentBubble\">\n          <Bubble {\n            ...{\n              childItem,\n              isParentBubble: true,\n              onBubbleClick: handleBubbleClick\n            }\n          }\n          />\n        </div>\n\n        <div className={ `childBubbles childBubbles_${ numChildren }` }>\n          {\n            childItems.map((childBubble) => (\n              <Bubble\n                key={ childBubble.name }\n                {\n                  ...{\n                    childItem: childBubble,\n                    onBubbleClick: handleBubbleClick\n                  }\n                }\n              />\n            ))\n          }\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAEzC,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SAASC,kBAAkB,QAAQ,0CAA0C;AAE7E,SAASC,sBAAsB,QAAQ,kDAAkD;AAOzF;AACA;;AAEA,OAAO,MAAMC,YAAyC,GAAGA,CACvD;EACEC,SAAS;EACTC;AACF,CAAC,KACE;EACH,MAAMC,sBAAsB,GAAGP,UAAU,CAACG,sBAAsB,CAAC;EAEjE,IAAI,CAACI,sBAAsB,EAAE;IAC3B,OAAO,IAAI;EACb;EAEA,MAAM;IAAEA,sBAAsB,EAAEC;EAAY,CAAC,GAAGD,sBAAsB;EAEtE,MAAM;IACJE;EACF,CAAC,GAAGJ,SAAS;EAEb,MAAMK,WAAW,GAAGD,UAAU,CAACE,MAAM;EAErC,oBACEZ,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAC;EAAc,GAEzBL,WAAW,iBAETT,KAAA,CAAAa,aAAA,CAACV,kBAAkB;IAEfG,SAAS;IACTS,aAAa,EAAER;EAAiB,CAGnC,CACF,eAGHP,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAC;EAAe,gBAC5Bd,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAC;EAAc,gBAC3Bd,KAAA,CAAAa,aAAA,CAACX,MAAM;IAEHI,SAAS;IACTU,cAAc,EAAE,IAAI;IACpBD,aAAa,EAAER;EAAiB,CAGnC,CACE,CAAC,eAENP,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAG,6BAA8BH,WAAW;EAAK,GAE3DD,UAAU,CAACO,GAAG,CAAEC,WAAW,iBACzBlB,KAAA,CAAAa,aAAA,CAACX,MAAM;IACLiB,GAAG,EAAGD,WAAW,CAACE,IAAM;IAGpBd,SAAS,EAAEY,WAAW;IACtBH,aAAa,EAAER;EAAiB,CAGrC,CACF,CAEA,CACF,CACF,CAAC;AAEV,CAAC","ignoreList":[]}