@pega/react-sdk-components 23.1.10 → 23.1.12

package/lib/components/infra/MultiStep/MultiStep.js

@@ -1,42 +1,43 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { getComponentFromMap } from '../../../bridge/helpers/sdk_component_map';
 import './MultiStep.css';
 export default function MultiStep(props) {
     // Get emitted components from map (so we can get any override that may exist)
-    const AssignmentCard = getComponentFromMap("AssignmentCard");
+    const AssignmentCard = getComponentFromMap('AssignmentCard');
     const { getPConnect, children, itemKey = '', actionButtons, onButtonPress } = props;
     const { bIsVertical, arNavigationSteps } = props;
     // const svgCurrent = Utils.getImageSrc("circle-solid", Utils.getSDKStaticConentUrl());
     // const svgNotCurrent = Utils.getImageSrc("circle-solid", Utils.getSDKStaticConentUrl());
     function _getVIconClass(status) {
-        if (status === "current") {
-            return "psdk-vertical-step-icon-selected";
+        if (status === 'current') {
+            return 'psdk-vertical-step-icon-selected';
         }
-        return "psdk-vertical-step-icon";
+        return 'psdk-vertical-step-icon';
     }
     function _getVLabelClass(status) {
-        if (status === "current") {
-            return "psdk-vertical-step-label-selected";
+        if (status === 'current') {
+            return 'psdk-vertical-step-label-selected';
         }
-        return "psdk-vertical-step-label";
+        return 'psdk-vertical-step-label';
     }
     function _getVBodyClass(index) {
         if (index < arNavigationSteps.length - 1) {
-            return "psdk-vertical-step-body psdk-vertical-step-line";
+            return 'psdk-vertical-step-body psdk-vertical-step-line';
         }
-        return "psdk-vertical-step-body";
+        return 'psdk-vertical-step-body';
     }
     function _getHIconClass(status) {
-        if (status === "current") {
-            return "psdk-horizontal-step-icon-selected";
+        if (status === 'current') {
+            return 'psdk-horizontal-step-icon-selected';
         }
-        return "psdk-horizontal-step-icon";
+        return 'psdk-horizontal-step-icon';
     }
     function _getHLabelClass(status) {
-        if (status === "current") {
-            return "psdk-horizontal-step-label-selected";
+        if (status === 'current') {
+            return 'psdk-horizontal-step-label-selected';
         }
-        return "psdk-horizontal-step-label";
+        return 'psdk-horizontal-step-label';
     }
     function _showHLine(index) {
         // eslint-disable-next-line sonarjs/prefer-single-boolean-return
@@ -48,69 +49,17 @@ export default function MultiStep(props) {
     function buttonPress(sAction, sButtonType) {
         onButtonPress(sAction, sButtonType);
     }
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", null, bIsVertical ?
-            React.createElement("div", { className: "psdk-vertical-stepper" }, arNavigationSteps.map((mainStep, index) => {
-                return (React.createElement(React.Fragment, { key: mainStep.actionID },
-                    React.createElement("div", { className: "psdk-vertical-step" },
-                        React.createElement("div", { className: "psdk-vertical-step-header" },
-                            React.createElement("div", { className: _getVIconClass(mainStep.visited_status) },
-                                React.createElement("div", { className: "psdk-vertical-step-icon-content" },
-                                    React.createElement("span", null, index + 1))),
-                            React.createElement("div", { className: _getVLabelClass(mainStep.visited_status) }, mainStep.name)),
-                        React.createElement("div", { className: _getVBodyClass(index) },
-                            mainStep?.steps &&
-                                React.createElement(React.Fragment, null,
-                                    React.createElement("ul", { style: { paddingInlineStart: "0rem", marginLeft: "-7px" } }, mainStep.steps.forEach((subStep) => {
-                                        React.createElement("li", { className: "psdk-sub-step-list" },
-                                            React.createElement("div", { style: { display: "inline-flex" } },
-                                                subStep.visited_status === 'current' &&
-                                                    React.createElement("img", { className: "psdk-current-svg-icon", src: "{svgCurrent}" }),
-                                                subStep.visited_status !== 'current' &&
-                                                    React.createElement("img", { className: "psdk-not-current-svg-icon", src: "{svgNotCurrent}" }),
-                                                subStep.visited_status === 'current' &&
-                                                    React.createElement("label", { className: "psdk-sub-step-current" }, subStep.name),
-                                                subStep.visited_status !== 'current' &&
-                                                    React.createElement("label", { className: "psdk-sub-step-not-current" }, subStep.name)),
-                                            subStep.visited_status === 'current' &&
-                                                React.createElement("div", null,
-                                                    React.createElement(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress }, children)));
-                                    }))),
-                            !mainStep?.steps && mainStep.visited_status === 'current' &&
-                                React.createElement(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress }, children)))));
-            }))
-            :
-                React.createElement("div", { className: "psdk-horizontal-stepper" },
-                    React.createElement("div", { className: "psdk-horizontal-stepper-header-container" }, arNavigationSteps.map((mainStep, index) => {
-                        return (React.createElement(React.Fragment, { key: mainStep.actionID },
-                            React.createElement("div", { className: "psdk-horizontal-step-header" },
-                                React.createElement("div", { className: _getHIconClass(mainStep.visited_status) },
-                                    React.createElement("div", { className: "psdk-horizontal-step-icon-content" },
-                                        React.createElement("span", null, index + 1))),
-                                React.createElement("div", { className: _getHLabelClass(mainStep.visited_status) },
-                                    React.createElement("div", { className: "psdk-horizontal-step-text-label" }, mainStep.name))),
-                            _showHLine(index) &&
-                                React.createElement("div", { className: "psdk-horizontal-step-line" })));
-                    })),
-                    arNavigationSteps.map((mainStep) => {
-                        return (React.createElement(React.Fragment, { key: mainStep.actionID },
-                            mainStep.steps &&
-                                React.createElement(React.Fragment, null,
-                                    React.createElement("ul", { style: { paddingInlineStart: "0rem", marginLeft: "35px" } }, mainStep.steps.map((subStep) => (React.createElement(React.Fragment, null,
-                                        React.createElement("li", { className: "psdk-sub-step-list" },
-                                            React.createElement("div", { style: { display: "inline-flex" } },
-                                                subStep.visited_status === 'current' &&
-                                                    React.createElement("img", { className: "psdk-current-svg-icon", src: "{svgCurrent}" }),
-                                                subStep.visited_status !== 'current' &&
-                                                    React.createElement("img", { className: "psdk-not-current-svg-icon", src: "{svgNotCurrent}" }),
-                                                subStep.visited_status === 'current' &&
-                                                    React.createElement("label", { className: "psdk-sub-step-current" }, subStep.name),
-                                                subStep.visited_status !== 'current' &&
-                                                    React.createElement("label", { className: "psdk-sub-step-not-current" }, subStep.name)),
-                                            subStep.visited_status === 'current' &&
-                                                React.createElement(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress }, children))))))),
-                            !mainStep?.steps && mainStep.visited_status === 'current' &&
-                                React.createElement(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress }, children)));
-                    })))));
+    return (_jsx("div", { children: bIsVertical ? (_jsx("div", { className: 'psdk-vertical-stepper', children: arNavigationSteps.map((mainStep, index) => {
+                return (_jsx(React.Fragment, { children: _jsxs("div", { className: 'psdk-vertical-step', children: [_jsxs("div", { className: 'psdk-vertical-step-header', children: [_jsx("div", { className: _getVIconClass(mainStep.visited_status), children: _jsx("div", { className: 'psdk-vertical-step-icon-content', children: _jsx("span", { children: index + 1 }) }) }), _jsx("div", { className: _getVLabelClass(mainStep.visited_status), children: mainStep.name })] }), _jsxs("div", { className: _getVBodyClass(index), children: [mainStep?.steps && (_jsx("ul", { style: {
+                                            paddingInlineStart: '0rem',
+                                            marginLeft: '-7px'
+                                        }, children: mainStep.steps.forEach(subStep => {
+                                            _jsxs("li", { className: 'psdk-sub-step-list', children: [_jsxs("div", { style: { display: 'inline-flex' }, children: [subStep.visited_status === 'current' && _jsx("img", { className: 'psdk-current-svg-icon', src: '{svgCurrent}' }), subStep.visited_status !== 'current' && _jsx("img", { className: 'psdk-not-current-svg-icon', src: '{svgNotCurrent}' }), subStep.visited_status === 'current' && _jsx("label", { className: 'psdk-sub-step-current', children: subStep.name }), subStep.visited_status !== 'current' && _jsx("label", { className: 'psdk-sub-step-not-current', children: subStep.name })] }), subStep.visited_status === 'current' && (_jsx("div", { children: _jsx(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress, children: children }) }))] });
+                                        }) })), !mainStep?.steps && mainStep.visited_status === 'current' && (_jsx(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress, children: children }))] })] }) }, mainStep.actionID));
+            }) })) : (_jsxs("div", { className: 'psdk-horizontal-stepper', children: [_jsx("div", { className: 'psdk-horizontal-stepper-header-container', children: arNavigationSteps.map((mainStep, index) => {
+                        return (_jsxs(React.Fragment, { children: [_jsxs("div", { className: 'psdk-horizontal-step-header', children: [_jsx("div", { className: _getHIconClass(mainStep.visited_status), children: _jsx("div", { className: 'psdk-horizontal-step-icon-content', children: _jsx("span", { children: index + 1 }) }) }), _jsx("div", { className: _getHLabelClass(mainStep.visited_status), children: _jsx("div", { className: 'psdk-horizontal-step-text-label', children: mainStep.name }) })] }), _showHLine(index) && _jsx("div", { className: 'psdk-horizontal-step-line' })] }, mainStep.actionID));
+                    }) }), arNavigationSteps.map(mainStep => {
+                    return (_jsxs(React.Fragment, { children: [mainStep.steps && (_jsx("ul", { style: { paddingInlineStart: '0rem', marginLeft: '35px' }, children: mainStep.steps.map(subStep => (_jsxs("li", { className: 'psdk-sub-step-list', children: [_jsxs("div", { style: { display: 'inline-flex' }, children: [subStep.visited_status === 'current' && _jsx("img", { className: 'psdk-current-svg-icon', src: '{svgCurrent}' }), subStep.visited_status !== 'current' && _jsx("img", { className: 'psdk-not-current-svg-icon', src: '{svgNotCurrent}' }), subStep.visited_status === 'current' && _jsx("label", { className: 'psdk-sub-step-current', children: subStep.name }), subStep.visited_status !== 'current' && _jsx("label", { className: 'psdk-sub-step-not-current', children: subStep.name })] }), subStep.visited_status === 'current' && (_jsx(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress, children: children }))] }))) })), !mainStep?.steps && mainStep.visited_status === 'current' && (_jsx(AssignmentCard, { getPConnect: getPConnect, itemKey: itemKey, actionButtons: actionButtons, onButtonPress: buttonPress, children: children }))] }, mainStep.actionID));
+                })] })) }));
 }
 //# sourceMappingURL=MultiStep.js.map

package/lib/components/infra/MultiStep/MultiStep.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiStep.js","sourceRoot":"","sources":["../../../../src/components/infra/MultiStep/MultiStep.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { getComponentFromMap } from '../../../bridge/helpers/sdk_component_map';\nimport './MultiStep.css';\n\n// import { useConstellationContext } from \"../../bridge/Context/StoreContext\";\n\nimport type { PConnProps } from '../../../types/PConnProps';\n\n\ninterface MultiStepProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  children: Array<any>,\n  itemKey: string,\n  actionButtons: Array<any>,\n  onButtonPress: any,\n  bIsVertical: boolean,\n  arNavigationSteps: Array<any>,\n  // eslint-disable-next-line react/no-unused-prop-types\n  arCurrentStepIndicies?: Array<any>\n}\n\n\nexport default function MultiStep(props: MultiStepProps) {\n    // Get emitted components from map (so we can get any override that may exist)\n    const AssignmentCard = getComponentFromMap(\"AssignmentCard\");\n\n    const { getPConnect, children, itemKey = '', actionButtons, onButtonPress} = props;\n    const { bIsVertical, arNavigationSteps } = props;\n\n    // const svgCurrent = Utils.getImageSrc(\"circle-solid\", Utils.getSDKStaticConentUrl());\n    // const svgNotCurrent = Utils.getImageSrc(\"circle-solid\", Utils.getSDKStaticConentUrl());\n\n    function _getVIconClass(status): string {\n        if (status === \"current\") {\n          return \"psdk-vertical-step-icon-selected\";\n        }\n\n        return \"psdk-vertical-step-icon\";\n      }\n\n      function _getVLabelClass(status): string {\n        if (status === \"current\") {\n          return \"psdk-vertical-step-label-selected\";\n        }\n\n        return \"psdk-vertical-step-label\";\n      }\n\n      function _getVBodyClass(index: number): string {\n        if (index < arNavigationSteps.length - 1) {\n          return \"psdk-vertical-step-body psdk-vertical-step-line\";\n        }\n\n        return \"psdk-vertical-step-body\";\n      }\n\n      function _getHIconClass(status): string {\n        if (status === \"current\") {\n          return \"psdk-horizontal-step-icon-selected\";\n        }\n\n        return \"psdk-horizontal-step-icon\";\n      }\n\n      function _getHLabelClass(status): string {\n        if (status === \"current\") {\n          return \"psdk-horizontal-step-label-selected\";\n        }\n\n        return \"psdk-horizontal-step-label\";\n      }\n\n      function _showHLine(index: number): boolean {\n        // eslint-disable-next-line sonarjs/prefer-single-boolean-return\n        if (index < arNavigationSteps.length - 1) {\n          return true;\n        }\n\n        return false;\n      }\n\n      function buttonPress(sAction: string, sButtonType: string) {\n        onButtonPress(sAction, sButtonType);\n      }\n\n    return (\n      <React.Fragment>\n          <div>\n              {bIsVertical ?\n                <div className=\"psdk-vertical-stepper\">\n                    {arNavigationSteps.map((mainStep, index) =>   {\n                      return (\n                        <React.Fragment key={mainStep.actionID}>\n                        <div className=\"psdk-vertical-step\">\n                            <div className=\"psdk-vertical-step-header\">\n                                <div className={ _getVIconClass(mainStep.visited_status)}>\n                                    <div className=\"psdk-vertical-step-icon-content\">\n                                        <span>{index + 1}</span>\n                                    </div>\n                                </div>\n                                <div className={ _getVLabelClass(mainStep.visited_status)}>\n                                    {mainStep.name}\n                                </div>\n                            </div>\n                            <div className={ _getVBodyClass(index)}>\n                                {mainStep?.steps &&\n                                <React.Fragment>\n                                <ul style={{paddingInlineStart: \"0rem\", marginLeft: \"-7px\"}}>\n                                    {mainStep.steps.forEach((subStep) => {\n                                        <li className=\"psdk-sub-step-list\">\n                                        <div style={{display: \"inline-flex\"}}>\n                                            {subStep.visited_status === 'current' &&\n                                            <img className=\"psdk-current-svg-icon\" src=\"{svgCurrent}\" />\n                                            }\n                                            {subStep.visited_status !== 'current' &&\n                                            <img className=\"psdk-not-current-svg-icon\" src=\"{svgNotCurrent}\" />\n                                            }\n                                            {subStep.visited_status === 'current' &&\n                                            <label className=\"psdk-sub-step-current\">{subStep.name}</label>\n                                            }\n                                            {subStep.visited_status !== 'current' &&\n                                            <label className=\"psdk-sub-step-not-current\">{subStep.name}</label>\n                                            }\n                                        </div>\n                                        {subStep.visited_status === 'current' &&\n                                            <div>\n                                                <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress} >\n                                                    {children}\n                                                </AssignmentCard>\n                                            </div>\n                                        }\n\n\n                                        </li>\n                                    })}\n\n                                </ul>\n                                </React.Fragment>\n                                }\n                                {!mainStep?.steps && mainStep.visited_status === 'current' &&\n                                <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress} >\n                                        {children}\n                                 </AssignmentCard>\n                                }\n                            </div>\n                        </div>\n                        </React.Fragment>\n                    )})}\n                </div>\n\n              :\n                <div className=\"psdk-horizontal-stepper\">\n                     <div className=\"psdk-horizontal-stepper-header-container\">\n                     {arNavigationSteps.map((mainStep, index) => {\n                        return (\n                        <React.Fragment key={mainStep.actionID}>\n                        <div className=\"psdk-horizontal-step-header\">\n                            <div className={ _getHIconClass(mainStep.visited_status)}>\n                                <div className=\"psdk-horizontal-step-icon-content\">\n                                <span>{index + 1}</span>\n                                </div>\n                            </div>\n                            <div className={ _getHLabelClass(mainStep.visited_status)}>\n                                <div className=\"psdk-horizontal-step-text-label\">\n                                {mainStep.name}\n                                </div>\n                            </div>\n                        </div>\n                        { _showHLine(index) &&\n                            <div className=\"psdk-horizontal-step-line\"></div>\n                        }\n                        </React.Fragment>\n                     )})}\n                     </div>\n                     {arNavigationSteps.map((mainStep) => {\n                        return (\n                         <React.Fragment key={mainStep.actionID}>\n                         {mainStep.steps &&\n                            <React.Fragment>\n                            <ul style={{paddingInlineStart: \"0rem\", marginLeft: \"35px\"}}>\n                            {mainStep.steps.map((subStep) => (\n                                <React.Fragment>\n                                <li className=\"psdk-sub-step-list\">\n                                <div style={{display: \"inline-flex\"}}>\n                                    {subStep.visited_status === 'current' &&\n                                    <img className=\"psdk-current-svg-icon\" src=\"{svgCurrent}\" />\n                                    }\n                                    {subStep.visited_status !== 'current' &&\n                                    <img className=\"psdk-not-current-svg-icon\" src=\"{svgNotCurrent}\" />\n                                    }\n                                    {subStep.visited_status === 'current' &&\n                                    <label className=\"psdk-sub-step-current\">{subStep.name}</label>\n                                    }\n                                    {subStep.visited_status !== 'current' &&\n                                    <label className=\"psdk-sub-step-not-current\">{subStep.name}</label>\n                                    }\n                                </div>\n                                {subStep.visited_status === 'current' &&\n                                <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress} >\n                                        {children}\n                                 </AssignmentCard>\n                                }\n                              </li>\n                              </React.Fragment>\n                            ))}\n\n                          </ul>\n                          </React.Fragment>\n                        }\n                        { !mainStep?.steps && mainStep.visited_status === 'current' &&\n                            <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress} >\n                                {children}\n                            </AssignmentCard>\n                        }\n                        </React.Fragment>\n                     )})}\n                </div>\n              }\n\n          </div>\n\n      </React.Fragment>\n\n    )\n  }\n"]}
+{"version":3,"file":"MultiStep.js","sourceRoot":"","sources":["../../../../src/components/infra/MultiStep/MultiStep.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { PropsWithChildren } from 'react';\n\nimport { getComponentFromMap } from '../../../bridge/helpers/sdk_component_map';\nimport { PConnProps } from '../../../types/PConnProps';\n\nimport './MultiStep.css';\n\ninterface MultiStepProps extends PConnProps {\n  // If any, enter additional props that only exist on this component\n  itemKey: string;\n  actionButtons: any[];\n  onButtonPress: any;\n  bIsVertical: boolean;\n  arNavigationSteps: any[];\n}\n\nexport default function MultiStep(props: PropsWithChildren<MultiStepProps>) {\n  // Get emitted components from map (so we can get any override that may exist)\n  const AssignmentCard = getComponentFromMap('AssignmentCard');\n\n  const { getPConnect, children, itemKey = '', actionButtons, onButtonPress } = props;\n  const { bIsVertical, arNavigationSteps } = props;\n\n  // const svgCurrent = Utils.getImageSrc(\"circle-solid\", Utils.getSDKStaticConentUrl());\n  // const svgNotCurrent = Utils.getImageSrc(\"circle-solid\", Utils.getSDKStaticConentUrl());\n\n  function _getVIconClass(status): string {\n    if (status === 'current') {\n      return 'psdk-vertical-step-icon-selected';\n    }\n\n    return 'psdk-vertical-step-icon';\n  }\n\n  function _getVLabelClass(status): string {\n    if (status === 'current') {\n      return 'psdk-vertical-step-label-selected';\n    }\n\n    return 'psdk-vertical-step-label';\n  }\n\n  function _getVBodyClass(index: number): string {\n    if (index < arNavigationSteps.length - 1) {\n      return 'psdk-vertical-step-body psdk-vertical-step-line';\n    }\n\n    return 'psdk-vertical-step-body';\n  }\n\n  function _getHIconClass(status): string {\n    if (status === 'current') {\n      return 'psdk-horizontal-step-icon-selected';\n    }\n\n    return 'psdk-horizontal-step-icon';\n  }\n\n  function _getHLabelClass(status): string {\n    if (status === 'current') {\n      return 'psdk-horizontal-step-label-selected';\n    }\n\n    return 'psdk-horizontal-step-label';\n  }\n\n  function _showHLine(index: number): boolean {\n    // eslint-disable-next-line sonarjs/prefer-single-boolean-return\n    if (index < arNavigationSteps.length - 1) {\n      return true;\n    }\n\n    return false;\n  }\n\n  function buttonPress(sAction: string, sButtonType: string) {\n    onButtonPress(sAction, sButtonType);\n  }\n\n  return (\n    <div>\n      {bIsVertical ? (\n        <div className='psdk-vertical-stepper'>\n          {arNavigationSteps.map((mainStep, index) => {\n            return (\n              <React.Fragment key={mainStep.actionID}>\n                <div className='psdk-vertical-step'>\n                  <div className='psdk-vertical-step-header'>\n                    <div className={_getVIconClass(mainStep.visited_status)}>\n                      <div className='psdk-vertical-step-icon-content'>\n                        <span>{index + 1}</span>\n                      </div>\n                    </div>\n                    <div className={_getVLabelClass(mainStep.visited_status)}>{mainStep.name}</div>\n                  </div>\n                  <div className={_getVBodyClass(index)}>\n                    {mainStep?.steps && (\n                      <ul\n                        style={{\n                          paddingInlineStart: '0rem',\n                          marginLeft: '-7px'\n                        }}\n                      >\n                        {mainStep.steps.forEach(subStep => {\n                          <li className='psdk-sub-step-list'>\n                            <div style={{ display: 'inline-flex' }}>\n                              {subStep.visited_status === 'current' && <img className='psdk-current-svg-icon' src='{svgCurrent}' />}\n                              {subStep.visited_status !== 'current' && <img className='psdk-not-current-svg-icon' src='{svgNotCurrent}' />}\n                              {subStep.visited_status === 'current' && <label className='psdk-sub-step-current'>{subStep.name}</label>}\n                              {subStep.visited_status !== 'current' && <label className='psdk-sub-step-not-current'>{subStep.name}</label>}\n                            </div>\n                            {subStep.visited_status === 'current' && (\n                              <div>\n                                <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress}>\n                                  {children}\n                                </AssignmentCard>\n                              </div>\n                            )}\n                          </li>;\n                        })}\n                      </ul>\n                    )}\n                    {!mainStep?.steps && mainStep.visited_status === 'current' && (\n                      <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress}>\n                        {children}\n                      </AssignmentCard>\n                    )}\n                  </div>\n                </div>\n              </React.Fragment>\n            );\n          })}\n        </div>\n      ) : (\n        <div className='psdk-horizontal-stepper'>\n          <div className='psdk-horizontal-stepper-header-container'>\n            {arNavigationSteps.map((mainStep, index) => {\n              return (\n                <React.Fragment key={mainStep.actionID}>\n                  <div className='psdk-horizontal-step-header'>\n                    <div className={_getHIconClass(mainStep.visited_status)}>\n                      <div className='psdk-horizontal-step-icon-content'>\n                        <span>{index + 1}</span>\n                      </div>\n                    </div>\n                    <div className={_getHLabelClass(mainStep.visited_status)}>\n                      <div className='psdk-horizontal-step-text-label'>{mainStep.name}</div>\n                    </div>\n                  </div>\n                  {_showHLine(index) && <div className='psdk-horizontal-step-line' />}\n                </React.Fragment>\n              );\n            })}\n          </div>\n          {arNavigationSteps.map(mainStep => {\n            return (\n              <React.Fragment key={mainStep.actionID}>\n                {mainStep.steps && (\n                  <ul style={{ paddingInlineStart: '0rem', marginLeft: '35px' }}>\n                    {mainStep.steps.map(subStep => (\n                      <li className='psdk-sub-step-list'>\n                        <div style={{ display: 'inline-flex' }}>\n                          {subStep.visited_status === 'current' && <img className='psdk-current-svg-icon' src='{svgCurrent}' />}\n                          {subStep.visited_status !== 'current' && <img className='psdk-not-current-svg-icon' src='{svgNotCurrent}' />}\n                          {subStep.visited_status === 'current' && <label className='psdk-sub-step-current'>{subStep.name}</label>}\n                          {subStep.visited_status !== 'current' && <label className='psdk-sub-step-not-current'>{subStep.name}</label>}\n                        </div>\n                        {subStep.visited_status === 'current' && (\n                          <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress}>\n                            {children}\n                          </AssignmentCard>\n                        )}\n                      </li>\n                    ))}\n                  </ul>\n                )}\n                {!mainStep?.steps && mainStep.visited_status === 'current' && (\n                  <AssignmentCard getPConnect={getPConnect} itemKey={itemKey} actionButtons={actionButtons} onButtonPress={buttonPress}>\n                    {children}\n                  </AssignmentCard>\n                )}\n              </React.Fragment>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}

package/lib/components/infra/MultiStep/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/infra/MultiStep/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC","sourcesContent":["export { default } from './MultiStep';"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/infra/MultiStep/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC","sourcesContent":["export { default } from './MultiStep';\n"]}

package/lib/components/infra/NavBar/NavBar.css

@@ -1,170 +1,168 @@
 .psdk-nav-divider {
-    border-bottom: 0.0625rem solid var(--app-nav-color);
-    width: 100%;
+  border-bottom: 0.0625rem solid var(--app-nav-color);
+  width: 100%;
 }
 
 .psdk-nav-header {
-    display: flex;
-    padding-top: 0.625rem;
+  display: flex;
+  padding-top: 0.625rem;
 }
 
 .psdk-nav-logo {
-    /* override vertical-align coming in from Bootstrap "reboot" */
-    vertical-align: baseline;
+  /* override vertical-align coming in from Bootstrap "reboot" */
+  vertical-align: baseline;
 
-    width: 3.5rem;
-    margin-left: 0.5rem;
-    margin-right: 0.5rem;
-    margin-top: 0.25rem;
-    margin-bottom: 0.25rem;
+  width: 3.5rem;
+  margin-left: 0.5rem;
+  margin-right: 0.5rem;
+  margin-top: 0.25rem;
+  margin-bottom: 0.25rem;
 
-    padding-left: 0.5rem;
-    padding-right: 0.5rem;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
 }
 
 /* background color white */
 /* filter: var(--app-white-color-filter); */
 .psdk-nav-svg-icon {
-    width: 2.6rem;
-    /* padding-right: 0.625rem; */
-    -webkit-filter: invert(.75); /* safari 6.0 - 9.0 */
-    filter: invert(.75);
+  width: 2.6rem;
+  /* padding-right: 0.625rem; */
+  -webkit-filter: invert(0.75); /* safari 6.0 - 9.0 */
+  filter: invert(0.75);
 }
 
 .psdk-nav-portal-info {
-    margin-top: 0.15rem;
-    margin-bottom: 0.25rem;
-    padding-left: 0.15rem;
-    padding-right: 0.5rem;
-
+  margin-top: 0.15rem;
+  margin-bottom: 0.25rem;
+  padding-left: 0.15rem;
+  padding-right: 0.5rem;
 }
 
 .psdk-nav-portal-name {
-    font-size: 1rem;
+  font-size: 1rem;
 }
 
 .psdk-nav-portal-app {
-    font-size: 1.0rem;
+  font-size: 1rem;
 }
 
 .psdk-appshell-nav {
-    top: 0px;   /* JEA */
-    position: relative;    /* JEA was fixed */
-    z-index: 3;
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
-    background: var(--app-nav-bg);
-    width: var(--app-nav-width);
-    height: 100%;
-    color: var(--app-nav-color);
-    /* overflow: hidden; */
-    white-space: nowrap;
-    transition: width var(--transition-medium) var(--natural-ease);
-    will-change: width;
-
+  top: 0px; /* JEA */
+  position: relative; /* JEA was fixed */
+  z-index: 3;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  background: var(--app-nav-bg);
+  width: var(--app-nav-width);
+  height: 100%;
+  color: var(--app-nav-color);
+  /* overflow: hidden; */
+  white-space: nowrap;
+  transition: width var(--transition-medium) var(--natural-ease);
+  will-change: width;
 }
 
 .psdk-appshell-nav:hover {
-    width: var(--app-nav-width-expanded);
+  width: var(--app-nav-width-expanded);
 }
 
 .psdk-appshell-topnav {
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
-    background: var(--app-nav-bg);
-    width: var(--app-nav-width);
-    height: 15%;
-    color: var(--app-nav-color);
-    /* overflow: hidden; */
-    white-space: nowrap;
-    transition: width var(--transition-medium) var(--natural-ease);
-    will-change: width;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  background: var(--app-nav-bg);
+  width: var(--app-nav-width);
+  height: 15%;
+  color: var(--app-nav-color);
+  /* overflow: hidden; */
+  white-space: nowrap;
+  transition: width var(--transition-medium) var(--natural-ease);
+  will-change: width;
 }
 
 .psdk-appshell-middlenav {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    background: var(--app-nav-bg);
-    width: var(--app-nav-width);
-    height: 50%;
-    color: var(--app-nav-color);
-    /* overflow: hidden; */
-    white-space: nowrap;
-    transition: width var(--transition-medium) var(--natural-ease);
-    will-change: width;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  background: var(--app-nav-bg);
+  width: var(--app-nav-width);
+  height: 50%;
+  color: var(--app-nav-color);
+  /* overflow: hidden; */
+  white-space: nowrap;
+  transition: width var(--transition-medium) var(--natural-ease);
+  will-change: width;
 }
 
 .psdk-appshell-bottom {
-    /* to make NavBar logout button stay fixed to bottom of window */
-    /* position: fixed; */
-    bottom: 0px;
-    background: var(--app-nav-bg);
-    width: var(--app-nav-width);    /* inherit; */
-    border-top: 0.0625rem solid var(--app-nav-color);
+  /* to make NavBar logout button stay fixed to bottom of window */
+  /* position: fixed; */
+  bottom: 0px;
+  background: var(--app-nav-bg);
+  width: var(--app-nav-width); /* inherit; */
+  border-top: 0.0625rem solid var(--app-nav-color);
 }
 
 /* Added for nav bar buttons to be like middlenav but with no additional flex direction and left justify */
 .psdk-appshell-buttonnav {
-    /* display: flex;
+  /* display: flex;
     flex-direction: row; */
-    border: none;
-    justify-content: left;
-    background: var(--app-nav-bg);
-    width: var(--app-nav-width);
-    height: 50%;
-    color: var(--app-nav-color);
-    /* overflow: hidden; */
-    white-space: nowrap;
-    transition: width var(--transition-medium) var(--natural-ease);
-    will-change: width;
+  border: none;
+  justify-content: left;
+  background: var(--app-nav-bg);
+  width: var(--app-nav-width);
+  height: 50%;
+  color: var(--app-nav-color);
+  /* overflow: hidden; */
+  white-space: nowrap;
+  transition: width var(--transition-medium) var(--natural-ease);
+  will-change: width;
 }
 
 .psdk-nav-ul-middle {
-    display: block;
-    list-style-type: none;
-    margin: 0rem;
-    padding-inline-start: 30px;
+  display: block;
+  list-style-type: none;
+  margin: 0rem;
+  padding-inline-start: 30px;
 }
 
 .psdk-nav-li-middle {
-    box-sizing: border-box;
-    text-align: left;
+  box-sizing: border-box;
+  text-align: left;
 }
 
 .psdk-icon {
-    padding: 0rem 0.125rem;
-    min-width: unset;
+  padding: 0rem 0.125rem;
+  min-width: unset;
 }
 
 .psdk-nav-button-span {
-    padding: 1rem;
+  padding: 1rem;
 }
 
 .psdk-nav-oper-avatar {
-    margin: 0rem;
-    padding: 0rem;
-    min-width: 2.5rem;
-    min-height: 2.5rem;
-    max-width: 2.5rem;
-    max-height: 2.5rem;
-    border-radius: 50%;
-    justify-content: center;
-    align-items: center;
-    text-align: center;
-    display: inline-flex;
-    background: var(--app-neutral-color);
-    color: white;
-    font-weight: normal;
-    font-size: 1rem;
+  margin: 0rem;
+  padding: 0rem;
+  min-width: 2.5rem;
+  min-height: 2.5rem;
+  max-width: 2.5rem;
+  max-height: 2.5rem;
+  border-radius: 50%;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  display: inline-flex;
+  background: var(--app-neutral-color);
+  color: white;
+  font-weight: normal;
+  font-size: 1rem;
 }
 
 .marginTopAuto {
-    margin-top: auto !important;
+  margin-top: auto !important;
 }
 
 .scrollable {
-    overflow-y: scroll !important;
+  overflow-y: scroll !important;
 }

package/lib/components/infra/NavBar/NavBar.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
+import { PConnProps } from '../../../types/PConnProps';
 import './NavBar.css';
-import type { PConnProps } from '../../../types/PConnProps';
 interface NavBarProps extends PConnProps {
     appName?: string;
-    pages?: Array<any>;
-    caseTypes: Array<any>;
+    pages?: any[];
+    caseTypes: any[];
     pConn?: any;
 }
 export default function NavBar(props: NavBarProps): JSX.Element;

package/lib/components/infra/NavBar/NavBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavBar.d.ts","sourceRoot":"","sources":["../../../../src/components/infra/NavBar/NavBar.tsx"],"names":[],"mappings":";AAIA,OAAO,cAAc,CAAC;AAgCtB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAG5D,UAAU,WAAY,SAAQ,UAAU;IAGtC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACnB,SAAS,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACtB,KAAK,CAAC,EAAE,GAAG,CAAA;CACZ;AA8DD,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,WAAW,eAiMhD"}
+{"version":3,"file":"NavBar.d.ts","sourceRoot":"","sources":["../../../../src/components/infra/NavBar/NavBar.tsx"],"names":[],"mappings":";AAkCA,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD,OAAO,cAAc,CAAC;AAEtB,UAAU,WAAY,SAAQ,UAAU;IAGtC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,EAAE,CAAC;IACd,SAAS,EAAE,GAAG,EAAE,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AA6DD,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,WAAW,eAuLhD"}

package/lib/components/infra/NavBar/NavBar.js

@@ -1,8 +1,7 @@
-import React, { useEffect, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
 import { makeStyles, useTheme } from '@material-ui/core/styles';
 import clsx from 'clsx';
-import { Utils } from '../../helpers/utils';
-import './NavBar.css';
 import { Drawer, List, ListItem, ListItemIcon, ListItemText, ListItemSecondaryAction, Collapse, Divider, IconButton, Menu, MenuItem, Typography } from '@material-ui/core';
 import PersonOutlineIcon from '@material-ui/icons/PersonOutlineOutlined';
 import ChevronLeftIcon from '@material-ui/icons/ChevronLeft';
@@ -16,12 +15,14 @@ import WorkOutlineIcon from '@material-ui/icons/WorkOutline';
 import ClearOutlinedIcon from '@material-ui/icons/ClearOutlined';
 import ArrowBackIcon from '@material-ui/icons/ArrowBack';
 import useMediaQuery from '@material-ui/core/useMediaQuery';
+import { logout } from '@pega/auth/lib/sdk-auth-manager';
 import { useNavBar } from '../../helpers/reactContextHelpers';
-import { logout } from '../../helpers/authManager';
+import { Utils } from '../../helpers/utils';
+import './NavBar.css';
 const iconMap = {
-    'pi pi-headline': React.createElement(HomeOutlinedIcon, { fontSize: 'large' }),
-    'pi pi-flag-solid': React.createElement(FlagOutlinedIcon, { fontSize: 'large' }),
-    'pi pi-home-solid': React.createElement(HomeOutlinedIcon, { fontSize: 'large' })
+    'pi pi-headline': _jsx(HomeOutlinedIcon, { fontSize: 'large' }),
+    'pi pi-flag-solid': _jsx(FlagOutlinedIcon, { fontSize: 'large' }),
+    'pi pi-home-solid': _jsx(HomeOutlinedIcon, { fontSize: 'large' })
 };
 const drawerWidth = 300;
 const useStyles = makeStyles(theme => ({
@@ -84,6 +85,8 @@ export default function NavBar(props) {
     const [bShowCaseTypes, setBShowCaseTypes] = useState(true);
     const [bShowOperatorButtons, setBShowOperatorButtons] = useState(false);
     const [anchorEl, setAnchorEl] = useState(null);
+    const localeUtils = PCore.getLocaleUtils();
+    const localeReference = pConn.getValue('.pyLocaleReference');
     const localizedVal = PCore.getLocaleUtils().getLocaleValue;
     const localeCategory = 'AppShell';
     const portalLogoImage = Utils.getIconPath(Utils.getSDKStaticConentUrl()).concat('pzpega-logo-mark.svg');
@@ -141,51 +144,14 @@ export default function NavBar(props) {
         else
             setOpen(true);
     }, [isDesktop]);
-    return (React.createElement(Drawer, { variant: 'permanent', classes: {
+    return (_jsxs(Drawer, { variant: 'permanent', classes: {
             paper: clsx(classes.drawerPaper, !open && classes.drawerPaperClose)
-        }, open: open && isDesktop },
-        open ? (React.createElement(List, { className: classes.appListItem },
-            React.createElement(ListItem, { onClick: handleDrawerOpen },
-                React.createElement(ListItemIcon, null,
-                    React.createElement("img", { src: portalLogoImage, className: classes.appListLogo })),
-                React.createElement(ListItemText, { primary: React.createElement(Typography, { variant: 'h6', className: classes.applicationLabel }, portalApp) }),
-                React.createElement(ListItemSecondaryAction, null,
-                    React.createElement(IconButton, { edge: 'end', onClick: handleDrawerOpen },
-                        React.createElement(ChevronLeftIcon, { className: classes.appListIcon })))))) : (React.createElement("div", { className: classes.appListDiv, onClick: handleDrawerOpen },
-            React.createElement(ChevronRightIcon, { className: classes.appListIcon, id: 'chevron-right-icon', fontSize: 'large' }))),
-        React.createElement(List, null,
-            React.createElement(ListItem, { button: true, onClick: handleCaseItemClick },
-                React.createElement(ListItemIcon, null, bShowCaseTypes && open ? (React.createElement(ClearOutlinedIcon, { fontSize: 'large' })) : (React.createElement(AddIcon, { fontSize: 'large' }))),
-                React.createElement(ListItemText, { primary: 'Create' }),
-                bShowCaseTypes ? React.createElement(ExpandLess, null) : React.createElement(ExpandMore, null))),
-        React.createElement(Collapse, { in: bShowCaseTypes && open, timeout: 'auto', unmountOnExit: true, className: 'scrollable' },
-            React.createElement(List, { component: 'div', disablePadding: true }, caseTypes.map(caseType => (React.createElement(ListItem, { button: true, className: classes.nested, onClick: () => navPanelCreateCaseType(caseType.pyClassName, caseType.pyFlowType), key: caseType.pyLabel },
-                React.createElement(ListItemIcon, null,
-                    React.createElement(WorkOutlineIcon, { fontSize: 'large' })),
-                React.createElement(ListItemText, { primary: caseType.pyLabel })))))),
-        React.createElement(List, null, navPages.map(page => (React.createElement(ListItem, { button: true, onClick: () => navPanelButtonClick(page), key: page.pyLabel },
-            React.createElement(ListItemIcon, null, iconMap[page.pxPageViewIcon]),
-            React.createElement(ListItemText, { primary: page.pyLabel }))))),
-        React.createElement(Divider, null),
-        React.createElement(List, { className: 'marginTopAuto' },
-            React.createElement(React.Fragment, null,
-                React.createElement(ListItem, { onClick: navPanelOperatorButtonClick },
-                    React.createElement(ListItemIcon, null,
-                        React.createElement(PersonOutlineIcon, { fontSize: 'large' })),
-                    React.createElement(ListItemText, { primary: portalOperator }),
-                    open && (React.createElement(ListItemSecondaryAction, null,
-                        React.createElement(IconButton, { edge: 'end', onClick: navPanelOperatorButtonClick },
-                            React.createElement(ChevronRightIcon, null))))),
-                React.createElement(Menu, { anchorEl: anchorEl, keepMounted: bShowOperatorButtons, open: bShowOperatorButtons, onClick: navPanelOperatorButtonClick, anchorOrigin: {
-                        vertical: 'top',
-                        horizontal: 'right'
-                    }, transformOrigin: {
-                        vertical: 'top',
-                        horizontal: 'left'
-                    } },
-                    React.createElement(MenuItem, { onClick: logout },
-                        React.createElement(ListItemIcon, null,
-                            React.createElement(ArrowBackIcon, { fontSize: 'large' })),
-                        React.createElement(Typography, { variant: 'inherit' }, localizedVal('Logout', localeCategory))))))));
+        }, open: open && isDesktop, children: [open ? (_jsx(List, { className: classes.appListItem, children: _jsxs(ListItem, { onClick: handleDrawerOpen, children: [_jsx(ListItemIcon, { children: _jsx("img", { src: portalLogoImage, className: classes.appListLogo }) }), _jsx(ListItemText, { primary: _jsx(Typography, { variant: 'h6', className: classes.applicationLabel, children: portalApp }) }), _jsx(ListItemSecondaryAction, { children: _jsx(IconButton, { edge: 'end', onClick: handleDrawerOpen, children: _jsx(ChevronLeftIcon, { className: classes.appListIcon }) }) })] }) })) : (_jsx("div", { className: classes.appListDiv, onClick: handleDrawerOpen, children: _jsx(ChevronRightIcon, { className: classes.appListIcon, id: 'chevron-right-icon', fontSize: 'large' }) })), _jsx(List, { children: _jsxs(ListItem, { button: true, onClick: handleCaseItemClick, children: [_jsx(ListItemIcon, { children: bShowCaseTypes && open ? _jsx(ClearOutlinedIcon, { fontSize: 'large' }) : _jsx(AddIcon, { fontSize: 'large' }) }), _jsx(ListItemText, { primary: 'Create' }), bShowCaseTypes ? _jsx(ExpandLess, {}) : _jsx(ExpandMore, {})] }) }), _jsx(Collapse, { in: bShowCaseTypes && open, timeout: 'auto', unmountOnExit: true, className: 'scrollable', children: _jsx(List, { component: 'div', disablePadding: true, children: caseTypes.map(caseType => (_jsxs(ListItem, { button: true, className: classes.nested, onClick: () => navPanelCreateCaseType(caseType.pyClassName, caseType.pyFlowType), children: [_jsx(ListItemIcon, { children: _jsx(WorkOutlineIcon, { fontSize: 'large' }) }), _jsx(ListItemText, { primary: localeUtils.getLocaleValue(caseType.pyLabel, '', localeReference) })] }, caseType.pyLabel))) }) }), _jsx(List, { children: navPages.map(page => (_jsxs(ListItem, { button: true, onClick: () => navPanelButtonClick(page), children: [_jsx(ListItemIcon, { children: iconMap[page.pxPageViewIcon] }), _jsx(ListItemText, { primary: localeUtils.getLocaleValue(page.pyLabel, '', localeReference) })] }, page.pyLabel))) }), _jsx(Divider, {}), _jsx(List, { className: 'marginTopAuto', children: _jsxs(_Fragment, { children: [_jsxs(ListItem, { onClick: navPanelOperatorButtonClick, style: { cursor: 'pointer' }, children: [_jsx(ListItemIcon, { children: _jsx(PersonOutlineIcon, { fontSize: 'large' }) }), _jsx(ListItemText, { primary: portalOperator }), open && (_jsx(ListItemSecondaryAction, { children: _jsx(IconButton, { edge: 'end', onClick: navPanelOperatorButtonClick, children: _jsx(ChevronRightIcon, {}) }) }))] }), _jsx(Menu, { anchorEl: anchorEl, keepMounted: bShowOperatorButtons, open: bShowOperatorButtons, onClick: navPanelOperatorButtonClick, anchorOrigin: {
+                                vertical: 'top',
+                                horizontal: 'right'
+                            }, transformOrigin: {
+                                vertical: 'top',
+                                horizontal: 'left'
+                            }, children: _jsxs(MenuItem, { onClick: logout, children: [_jsx(ListItemIcon, { children: _jsx(ArrowBackIcon, { fontSize: 'large' }) }), _jsx(Typography, { variant: 'inherit', children: localizedVal('Log off', localeCategory) })] }) })] }) })] }));
 }
 //# sourceMappingURL=NavBar.js.map