@nethserver/ns8-ui-lib 0.1.3 → 0.1.6

package/dist/ns8-ui-lib.esm.js

@@ -1,4 +1,4 @@
-import { CvButton, CvIconButton, CvInlineNotification, CvTile, CvToastNotification, CvLink, CvTooltip, CvTag, CvTextInput, CvOverflowMenu, CvModal, CvPagination, CvDataTable, CvDataTableHeading, CvDataTableRow, CvDataTableCell, CvCheckbox, CvToggle } from '@carbon/vue';
+import { CvButton, CvIconButton, CvInlineNotification, CvTile, CvToastNotification, CvLink, CvTooltip, CvTag, CvTextInput, CvOverflowMenu, CvModal, CvPagination, CvDataTable, CvDataTableHeading, CvDataTableRow, CvDataTableCell, CvCheckbox, CvToggle, CvTabs } from '@carbon/vue';
 import LottieAnimation from 'lottie-web-vue';
 import Copy20 from '@carbon/icons-vue/es/copy/20';
 import ChevronDown20 from '@carbon/icons-vue/es/chevron--down/20';
@@ -127,6 +127,9 @@ import Folder32 from '@carbon/icons-vue/es/folder/32';
 import Asterisk16 from '@carbon/icons-vue/es/asterisk/16';
 import Asterisk20 from '@carbon/icons-vue/es/asterisk/20';
 import Asterisk32 from '@carbon/icons-vue/es/asterisk/32';
+import Box16 from '@carbon/icons-vue/es/box/16';
+import Box20 from '@carbon/icons-vue/es/box/20';
+import Box32 from '@carbon/icons-vue/es/box/32';
 import CvSideNavDivider from '@carbon/vue/src/components/cv-ui-shell/cv-side-nav-divider.vue';
 import Search16 from '@carbon/icons-vue/es/search/16';
 import Close16 from '@carbon/icons-vue/es/close/16';
@@ -135,7 +138,7 @@ import ChevronDown16 from '@carbon/icons-vue/es/chevron--down/16';
 import CvCheckbox$1 from '@carbon/vue/src/components/cv-checkbox/cv-checkbox';
 
 //
-var script$y = {
+var script$A = {
   name: "NsButton",
   extends: CvButton,
   props: {
@@ -298,10 +301,10 @@ function addStyle(id, css) {
 }
 
 /* script */
-const __vue_script__$y = script$y;
+const __vue_script__$A = script$A;
 /* template */
 
-var __vue_render__$E = function () {
+var __vue_render__$F = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -324,10 +327,10 @@ var __vue_render__$E = function () {
   }) : _vm._e()], 2);
 };
 
-var __vue_staticRenderFns__$E = [];
+var __vue_staticRenderFns__$F = [];
 /* style */
 
-const __vue_inject_styles__$G = function (inject) {
+const __vue_inject_styles__$I = function (inject) {
   if (!inject) return;
   inject("data-v-025b0f12_0", {
     source: ".bx--btn .bx--btn__icon[data-v-025b0f12]{width:1.25rem;height:1.25rem}.bx--btn.bx--btn--sm .bx--btn__icon[data-v-025b0f12]{width:1rem;height:1rem}.loader[data-v-025b0f12]{right:1rem;border:3px solid transparent;border-radius:50%;border-top:3px solid currentColor;border-right:3px solid currentColor;border-bottom:3px solid currentColor;animation:spin-data-v-025b0f12 .5s linear infinite}.bx--btn--ghost .bx--btn__icon.loading[data-v-025b0f12]{position:static;margin-left:.5rem}.bx--btn--danger--ghost .bx--btn__icon.loading[data-v-025b0f12],.bx--btn--danger-ghost .bx--btn__icon.loading[data-v-025b0f12]{position:static;margin-left:.5rem}@keyframes spin-data-v-025b0f12{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}",
@@ -338,23 +341,23 @@ const __vue_inject_styles__$G = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$G = "data-v-025b0f12";
+const __vue_scope_id__$I = "data-v-025b0f12";
 /* module identifier */
 
-const __vue_module_identifier__$G = undefined;
+const __vue_module_identifier__$I = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$G = false;
+const __vue_is_functional_template__$I = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$18 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$E,
-  staticRenderFns: __vue_staticRenderFns__$E
-}, __vue_inject_styles__$G, __vue_script__$y, __vue_scope_id__$G, __vue_is_functional_template__$G, __vue_module_identifier__$G, false, createInjector, undefined, undefined);
+const __vue_component__$1c = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$F,
+  staticRenderFns: __vue_staticRenderFns__$F
+}, __vue_inject_styles__$I, __vue_script__$A, __vue_scope_id__$I, __vue_is_functional_template__$I, __vue_module_identifier__$I, false, createInjector, undefined, undefined);
 
-var NsButton = __vue_component__$18;
+var NsButton = __vue_component__$1c;
 
 //
 //
@@ -372,7 +375,7 @@ var NsButton = __vue_component__$18;
 //
 //
 //
-var script$x = {
+var script$z = {
   name: "NsPictogram",
   props: {
     title: {
@@ -395,10 +398,10 @@ var script$x = {
 };
 
 /* script */
-const __vue_script__$x = script$x;
+const __vue_script__$z = script$z;
 /* template */
 
-var __vue_render__$D = function () {
+var __vue_render__$E = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -426,34 +429,34 @@ var __vue_render__$D = function () {
   }, [_vm._t("default")], 2)]);
 };
 
-var __vue_staticRenderFns__$D = [];
+var __vue_staticRenderFns__$E = [];
 /* style */
 
-const __vue_inject_styles__$F = undefined;
+const __vue_inject_styles__$H = undefined;
 /* scoped */
 
-const __vue_scope_id__$F = undefined;
+const __vue_scope_id__$H = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$F = undefined;
+const __vue_module_identifier__$H = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$F = false;
+const __vue_is_functional_template__$H = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$17 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$D,
-  staticRenderFns: __vue_staticRenderFns__$D
-}, __vue_inject_styles__$F, __vue_script__$x, __vue_scope_id__$F, __vue_is_functional_template__$F, __vue_module_identifier__$F, false, undefined, undefined, undefined);
+const __vue_component__$1b = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$E,
+  staticRenderFns: __vue_staticRenderFns__$E
+}, __vue_inject_styles__$H, __vue_script__$z, __vue_scope_id__$H, __vue_is_functional_template__$H, __vue_module_identifier__$H, false, undefined, undefined, undefined);
 
-var NsPictogram = __vue_component__$17;
+var NsPictogram = __vue_component__$1b;
 
 //
-var script$w = {
+var script$y = {
   name: "NsLottieAnimation",
   components: {
     LottieAnimation
@@ -509,10 +512,10 @@ var script$w = {
 };
 
 /* script */
-const __vue_script__$w = script$w;
+const __vue_script__$y = script$y;
 /* template */
 
-var __vue_render__$C = function () {
+var __vue_render__$D = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -539,36 +542,36 @@ var __vue_render__$C = function () {
   })], 1);
 };
 
-var __vue_staticRenderFns__$C = [];
+var __vue_staticRenderFns__$D = [];
 /* style */
 
-const __vue_inject_styles__$E = undefined;
+const __vue_inject_styles__$G = undefined;
 /* scoped */
 
-const __vue_scope_id__$E = "data-v-14e97a70";
+const __vue_scope_id__$G = "data-v-14e97a70";
 /* module identifier */
 
-const __vue_module_identifier__$E = undefined;
+const __vue_module_identifier__$G = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$E = false;
+const __vue_is_functional_template__$G = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$16 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$C,
-  staticRenderFns: __vue_staticRenderFns__$C
-}, __vue_inject_styles__$E, __vue_script__$w, __vue_scope_id__$E, __vue_is_functional_template__$E, __vue_module_identifier__$E, false, undefined, undefined, undefined);
+const __vue_component__$1a = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$D,
+  staticRenderFns: __vue_staticRenderFns__$D
+}, __vue_inject_styles__$G, __vue_script__$y, __vue_scope_id__$G, __vue_is_functional_template__$G, __vue_module_identifier__$G, false, undefined, undefined, undefined);
 
-var NsLottieAnimation = __vue_component__$16;
+var NsLottieAnimation = __vue_component__$1a;
 
 /* script */
 
 /* template */
-var __vue_render__$B = function () {
+var __vue_render__$C = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -583,34 +586,34 @@ var __vue_render__$B = function () {
   });
 };
 
-var __vue_staticRenderFns__$B = [];
+var __vue_staticRenderFns__$C = [];
 /* style */
 
-const __vue_inject_styles__$D = undefined;
+const __vue_inject_styles__$F = undefined;
 /* scoped */
 
-const __vue_scope_id__$D = undefined;
+const __vue_scope_id__$F = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$D = undefined;
+const __vue_module_identifier__$F = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$D = false;
+const __vue_is_functional_template__$F = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$15 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$B,
-  staticRenderFns: __vue_staticRenderFns__$B
-}, __vue_inject_styles__$D, {}, __vue_scope_id__$D, __vue_is_functional_template__$D, __vue_module_identifier__$D, false, undefined, undefined, undefined);
+const __vue_component__$19 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$C,
+  staticRenderFns: __vue_staticRenderFns__$C
+}, __vue_inject_styles__$F, {}, __vue_scope_id__$F, __vue_is_functional_template__$F, __vue_module_identifier__$F, false, undefined, undefined, undefined);
 
-var ExclamationMarkPictogram = __vue_component__$15;
+var ExclamationMarkPictogram = __vue_component__$19;
 
 //
-var script$v = {
+var script$x = {
   name: "NsEmptyState",
   components: {
     NsPictogram,
@@ -642,10 +645,10 @@ var script$v = {
 };
 
 /* script */
-const __vue_script__$v = script$v;
+const __vue_script__$x = script$x;
 /* template */
 
-var __vue_render__$A = function () {
+var __vue_render__$B = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -675,10 +678,10 @@ var __vue_render__$A = function () {
   }, [_vm._t("description")], 2)] : _vm._e()], 2);
 };
 
-var __vue_staticRenderFns__$A = [];
+var __vue_staticRenderFns__$B = [];
 /* style */
 
-const __vue_inject_styles__$C = function (inject) {
+const __vue_inject_styles__$E = function (inject) {
   if (!inject) return;
   inject("data-v-2d5d3a58_0", {
     source: ".empty-state[data-v-2d5d3a58]{text-align:center;padding:2rem}.empty-state .image[data-v-2d5d3a58]{margin-bottom:1rem}.empty-state .description[data-v-2d5d3a58]{margin-top:1rem}.animation[data-v-2d5d3a58]{display:inline-block;width:64px;height:64px}",
@@ -689,26 +692,26 @@ const __vue_inject_styles__$C = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$C = "data-v-2d5d3a58";
+const __vue_scope_id__$E = "data-v-2d5d3a58";
 /* module identifier */
 
-const __vue_module_identifier__$C = undefined;
+const __vue_module_identifier__$E = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$C = false;
+const __vue_is_functional_template__$E = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$13 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$A,
-  staticRenderFns: __vue_staticRenderFns__$A
-}, __vue_inject_styles__$C, __vue_script__$v, __vue_scope_id__$C, __vue_is_functional_template__$C, __vue_module_identifier__$C, false, createInjector, undefined, undefined);
+const __vue_component__$17 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$B,
+  staticRenderFns: __vue_staticRenderFns__$B
+}, __vue_inject_styles__$E, __vue_script__$x, __vue_scope_id__$E, __vue_is_functional_template__$E, __vue_module_identifier__$E, false, createInjector, undefined, undefined);
 
-var __vue_component__$14 = __vue_component__$13;
+var __vue_component__$18 = __vue_component__$17;
 
 //
-var script$u = {
+var script$w = {
   name: "NsCodeSnippet",
   components: {
     CvButton,
@@ -820,10 +823,10 @@ var script$u = {
 };
 
 /* script */
-const __vue_script__$u = script$u;
+const __vue_script__$w = script$w;
 /* template */
 
-var __vue_render__$z = function () {
+var __vue_render__$A = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -885,10 +888,10 @@ var __vue_render__$z = function () {
   })], 1) : _vm._e()], 1);
 };
 
-var __vue_staticRenderFns__$z = [];
+var __vue_staticRenderFns__$A = [];
 /* style */
 
-const __vue_inject_styles__$B = function (inject) {
+const __vue_inject_styles__$D = function (inject) {
   if (!inject) return;
   inject("data-v-59cb538c_0", {
     source: ".bx--snippet--multi .bx--snippet-container[data-v-59cb538c]{min-height:4.5rem;max-height:9.6rem;overflow-y:hidden}.bx--snippet--multi .bx--snippet-container.no-expand[data-v-59cb538c]{min-height:2.5rem}.bx--snippet--multi.bx--snippet--expand .bx--snippet-container[data-v-59cb538c]{max-height:100%}.bx--snippet--multi .bx--copy-btn[data-v-59cb538c]{position:absolute!important;top:.5rem;right:.5rem;z-index:11;width:3rem;height:2rem}.bx--snippet-btn--expand[data-v-59cb538c]{right:.5rem;bottom:.5rem}",
@@ -899,23 +902,23 @@ const __vue_inject_styles__$B = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$B = "data-v-59cb538c";
+const __vue_scope_id__$D = "data-v-59cb538c";
 /* module identifier */
 
-const __vue_module_identifier__$B = undefined;
+const __vue_module_identifier__$D = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$B = false;
+const __vue_is_functional_template__$D = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$11 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$z,
-  staticRenderFns: __vue_staticRenderFns__$z
-}, __vue_inject_styles__$B, __vue_script__$u, __vue_scope_id__$B, __vue_is_functional_template__$B, __vue_module_identifier__$B, false, createInjector, undefined, undefined);
+const __vue_component__$15 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$A,
+  staticRenderFns: __vue_staticRenderFns__$A
+}, __vue_inject_styles__$D, __vue_script__$w, __vue_scope_id__$D, __vue_is_functional_template__$D, __vue_module_identifier__$D, false, createInjector, undefined, undefined);
 
-var __vue_component__$12 = __vue_component__$11;
+var __vue_component__$16 = __vue_component__$15;
 
 //
 //
@@ -946,7 +949,7 @@ var __vue_component__$12 = __vue_component__$11;
 //
 //
 //
-var script$t = {
+var script$v = {
   name: "NsCircleTimer",
   props: {
     timeLimit: {
@@ -1010,10 +1013,10 @@ var script$t = {
 };
 
 /* script */
-const __vue_script__$t = script$t;
+const __vue_script__$v = script$v;
 /* template */
 
-var __vue_render__$y = function () {
+var __vue_render__$z = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -1049,10 +1052,10 @@ var __vue_render__$y = function () {
   })])])]);
 };
 
-var __vue_staticRenderFns__$y = [];
+var __vue_staticRenderFns__$z = [];
 /* style */
 
-const __vue_inject_styles__$A = function (inject) {
+const __vue_inject_styles__$C = function (inject) {
   if (!inject) return;
   inject("data-v-79cb7082_0", {
     source: ".base-timer[data-v-79cb7082]{position:relative}.base-timer__circle[data-v-79cb7082]{fill:none;stroke:none}.base-timer__path-remaining[data-v-79cb7082]{stroke:currentColor;transform:rotate(90deg);transform-origin:center;transition:1s linear all}.base-timer__svg[data-v-79cb7082]{transform:scaleX(-1)}",
@@ -1063,26 +1066,26 @@ const __vue_inject_styles__$A = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$A = "data-v-79cb7082";
+const __vue_scope_id__$C = "data-v-79cb7082";
 /* module identifier */
 
-const __vue_module_identifier__$A = undefined;
+const __vue_module_identifier__$C = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$A = false;
+const __vue_is_functional_template__$C = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$10 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$y,
-  staticRenderFns: __vue_staticRenderFns__$y
-}, __vue_inject_styles__$A, __vue_script__$t, __vue_scope_id__$A, __vue_is_functional_template__$A, __vue_module_identifier__$A, false, createInjector, undefined, undefined);
+const __vue_component__$14 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$z,
+  staticRenderFns: __vue_staticRenderFns__$z
+}, __vue_inject_styles__$C, __vue_script__$v, __vue_scope_id__$C, __vue_is_functional_template__$C, __vue_module_identifier__$C, false, createInjector, undefined, undefined);
 
-var NsCircleTimer = __vue_component__$10;
+var NsCircleTimer = __vue_component__$14;
 
 //
-var script$s = {
+var script$u = {
   name: "NsInlineNotification",
   extends: CvInlineNotification,
   components: {
@@ -1119,10 +1122,10 @@ var script$s = {
 };
 
 /* script */
-const __vue_script__$s = script$s;
+const __vue_script__$u = script$u;
 /* template */
 
-var __vue_render__$x = function () {
+var __vue_render__$y = function () {
   var _obj;
 
   var _vm = this;
@@ -1193,10 +1196,10 @@ var __vue_render__$x = function () {
   })], 1) : _vm._e()]);
 };
 
-var __vue_staticRenderFns__$x = [];
+var __vue_staticRenderFns__$y = [];
 /* style */
 
-const __vue_inject_styles__$z = function (inject) {
+const __vue_inject_styles__$B = function (inject) {
   if (!inject) return;
   inject("data-v-6b979488_0", {
     source: ".title[data-v-6b979488]{margin-right:.75rem;margin-bottom:.2rem;font-size:.875rem!important;font-weight:600!important}.mg-right[data-v-6b979488]{margin-right:.75rem}.action-button[data-v-6b979488]{margin-right:.5rem}.bx--inline-notification__text-wrapper p[data-v-6b979488]{padding-right:0!important}",
@@ -1207,23 +1210,23 @@ const __vue_inject_styles__$z = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$z = "data-v-6b979488";
+const __vue_scope_id__$B = "data-v-6b979488";
 /* module identifier */
 
-const __vue_module_identifier__$z = undefined;
+const __vue_module_identifier__$B = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$z = false;
+const __vue_is_functional_template__$B = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$$ = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$x,
-  staticRenderFns: __vue_staticRenderFns__$x
-}, __vue_inject_styles__$z, __vue_script__$s, __vue_scope_id__$z, __vue_is_functional_template__$z, __vue_module_identifier__$z, false, createInjector, undefined, undefined);
+const __vue_component__$13 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$y,
+  staticRenderFns: __vue_staticRenderFns__$y
+}, __vue_inject_styles__$B, __vue_script__$u, __vue_scope_id__$B, __vue_is_functional_template__$B, __vue_module_identifier__$B, false, createInjector, undefined, undefined);
 
-var NsInlineNotification = __vue_component__$$;
+var NsInlineNotification = __vue_component__$13;
 
 //
 //
@@ -1262,7 +1265,7 @@ var NsInlineNotification = __vue_component__$$;
 //
 //
 //
-var script$r = {
+var script$t = {
   name: "NsProgressBar",
   props: {
     value: {
@@ -1289,6 +1292,10 @@ var script$r = {
     useStatusColors: {
       type: Boolean,
       default: false
+    },
+    useHealthyColor: {
+      type: Boolean,
+      default: true
     }
   },
 
@@ -1316,7 +1323,7 @@ var script$r = {
     },
 
     healthyStatus() {
-      return this.useStatusColors && this.numericValue < this.warningThreshold;
+      return this.useStatusColors && this.useHealthyColor && this.numericValue < this.warningThreshold;
     },
 
     warningStatus() {
@@ -1336,10 +1343,10 @@ var script$r = {
 };
 
 /* script */
-const __vue_script__$r = script$r;
+const __vue_script__$t = script$t;
 /* template */
 
-var __vue_render__$w = function () {
+var __vue_render__$x = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -1378,13 +1385,13 @@ var __vue_render__$w = function () {
   })]], 2)]);
 };
 
-var __vue_staticRenderFns__$w = [];
+var __vue_staticRenderFns__$x = [];
 /* style */
 
-const __vue_inject_styles__$y = function (inject) {
+const __vue_inject_styles__$A = function (inject) {
   if (!inject) return;
-  inject("data-v-7c7ba0aa_0", {
-    source: ".progress-bar-container[data-v-7c7ba0aa]{width:100%;position:relative}.slider[data-v-7c7ba0aa]{position:absolute;width:100%;overflow-x:hidden}.line[data-v-7c7ba0aa]{position:absolute;opacity:.4;width:100%}.progress-line[data-v-7c7ba0aa]{position:absolute}.indeterminate-line[data-v-7c7ba0aa]{position:absolute;opacity:.4;width:150%}.indeterminate-subline[data-v-7c7ba0aa]{position:absolute}.inc[data-v-7c7ba0aa]{animation:increase-data-v-7c7ba0aa 2s infinite}.dec[data-v-7c7ba0aa]{animation:decrease-data-v-7c7ba0aa 2s .5s infinite}@keyframes increase-data-v-7c7ba0aa{from{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes decrease-data-v-7c7ba0aa{from{left:-80%;width:80%}to{left:110%;width:10%}}",
+  inject("data-v-be01f286_0", {
+    source: ".progress-bar-container[data-v-be01f286]{width:100%;position:relative}.slider[data-v-be01f286]{position:absolute;width:100%;overflow-x:hidden}.line[data-v-be01f286]{position:absolute;opacity:.4;width:100%}.progress-line[data-v-be01f286]{position:absolute}.indeterminate-line[data-v-be01f286]{position:absolute;opacity:.4;width:150%}.indeterminate-subline[data-v-be01f286]{position:absolute}.inc[data-v-be01f286]{animation:increase-data-v-be01f286 2s infinite}.dec[data-v-be01f286]{animation:decrease-data-v-be01f286 2s .5s infinite}@keyframes increase-data-v-be01f286{from{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes decrease-data-v-be01f286{from{left:-80%;width:80%}to{left:110%;width:10%}}",
     map: undefined,
     media: undefined
   });
@@ -1392,25 +1399,25 @@ const __vue_inject_styles__$y = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$y = "data-v-7c7ba0aa";
+const __vue_scope_id__$A = "data-v-be01f286";
 /* module identifier */
 
-const __vue_module_identifier__$y = undefined;
+const __vue_module_identifier__$A = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$y = false;
+const __vue_is_functional_template__$A = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$_ = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$w,
-  staticRenderFns: __vue_staticRenderFns__$w
-}, __vue_inject_styles__$y, __vue_script__$r, __vue_scope_id__$y, __vue_is_functional_template__$y, __vue_module_identifier__$y, false, createInjector, undefined, undefined);
+const __vue_component__$12 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$x,
+  staticRenderFns: __vue_staticRenderFns__$x
+}, __vue_inject_styles__$A, __vue_script__$t, __vue_scope_id__$A, __vue_is_functional_template__$A, __vue_module_identifier__$A, false, createInjector, undefined, undefined);
 
-var NsProgressBar = __vue_component__$_;
+var NsProgressBar = __vue_component__$12;
 
-var script$q = {
+var script$s = {
   name: "NsSvg",
   props: {
     svg: {
@@ -1469,33 +1476,33 @@ var script$q = {
 };
 
 /* script */
-const __vue_script__$q = script$q;
+const __vue_script__$s = script$s;
 /* template */
 
 /* style */
 
-const __vue_inject_styles__$x = undefined;
+const __vue_inject_styles__$z = undefined;
 /* scoped */
 
-const __vue_scope_id__$x = undefined;
+const __vue_scope_id__$z = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$x = undefined;
+const __vue_module_identifier__$z = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$x = undefined;
+const __vue_is_functional_template__$z = undefined;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$Z = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$x, __vue_script__$q, __vue_scope_id__$x, __vue_is_functional_template__$x, __vue_module_identifier__$x, false, undefined, undefined, undefined);
+const __vue_component__$11 = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$z, __vue_script__$s, __vue_scope_id__$z, __vue_is_functional_template__$z, __vue_module_identifier__$z, false, undefined, undefined, undefined);
 
-var NsSvg = __vue_component__$Z;
+var NsSvg = __vue_component__$11;
 
 //
-var script$p = {
+var script$r = {
   name: "NsTile",
   extends: CvTile,
   inheritAttrs: false,
@@ -1569,10 +1576,10 @@ var script$p = {
 };
 
 /* script */
-const __vue_script__$p = script$p;
+const __vue_script__$r = script$r;
 /* template */
 
-var __vue_render__$v = function () {
+var __vue_render__$w = function () {
   var _obj;
 
   var _vm = this;
@@ -1611,10 +1618,10 @@ var __vue_render__$v = function () {
   }) : _vm._e()], 1);
 };
 
-var __vue_staticRenderFns__$v = [];
+var __vue_staticRenderFns__$w = [];
 /* style */
 
-const __vue_inject_styles__$w = function (inject) {
+const __vue_inject_styles__$y = function (inject) {
   if (!inject) return;
   inject("data-v-443a91f0_0", {
     source: ".ns-tile[data-v-443a91f0]{margin-bottom:2rem;position:relative}.container[data-v-443a91f0]{display:flex;flex-direction:column;justify-content:center}.centered[data-v-443a91f0]{text-align:center}.large[data-v-443a91f0]{min-height:10rem}.tile-icon[data-v-443a91f0]{display:block;margin-left:auto;margin-right:auto;margin-bottom:1rem}.tile-footer-icon[data-v-443a91f0]{position:absolute;right:1rem;bottom:1rem;flex-shrink:0;width:1.25rem;height:1.25rem}.pad-bottom[data-v-443a91f0]{padding-bottom:4rem}.disabled-tile[data-v-443a91f0]{color:#c6c6c6}",
@@ -1625,23 +1632,23 @@ const __vue_inject_styles__$w = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$w = "data-v-443a91f0";
+const __vue_scope_id__$y = "data-v-443a91f0";
 /* module identifier */
 
-const __vue_module_identifier__$w = undefined;
+const __vue_module_identifier__$y = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$w = false;
+const __vue_is_functional_template__$y = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$X = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$v,
-  staticRenderFns: __vue_staticRenderFns__$v
-}, __vue_inject_styles__$w, __vue_script__$p, __vue_scope_id__$w, __vue_is_functional_template__$w, __vue_module_identifier__$w, false, createInjector, undefined, undefined);
+const __vue_component__$$ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$w,
+  staticRenderFns: __vue_staticRenderFns__$w
+}, __vue_inject_styles__$y, __vue_script__$r, __vue_scope_id__$y, __vue_is_functional_template__$y, __vue_module_identifier__$y, false, createInjector, undefined, undefined);
 
-var __vue_component__$Y = __vue_component__$X;
+var __vue_component__$10 = __vue_component__$$;
 
 function toInteger(dirtyNumber) {
   if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
@@ -6238,7 +6245,7 @@ var DateTimeService = {
 };
 
 //
-var script$o = {
+var script$q = {
   name: "NsToastNotification",
   extends: CvToastNotification,
   components: {
@@ -6316,10 +6323,10 @@ var script$o = {
 };
 
 /* script */
-const __vue_script__$o = script$o;
+const __vue_script__$q = script$q;
 /* template */
 
-var __vue_render__$u = function () {
+var __vue_render__$v = function () {
   var _obj;
 
   var _vm = this;
@@ -6417,10 +6424,10 @@ var __vue_render__$u = function () {
   })], 1) : _vm._e()], 1)]);
 };
 
-var __vue_staticRenderFns__$u = [];
+var __vue_staticRenderFns__$v = [];
 /* style */
 
-const __vue_inject_styles__$v = function (inject) {
+const __vue_inject_styles__$x = function (inject) {
   if (!inject) return;
   inject("data-v-6ff0b515_0", {
     source: ".notification[data-v-6ff0b515]{margin-bottom:0;margin-right:0}.action[data-v-6ff0b515]{padding-top:0;margin-bottom:0}.bx--toast-notification .bx--inline-notification__action-button[data-v-6ff0b515]{margin-left:-1rem}.bx--toast-notification .bx--inline-notification__action-button.bx--btn--danger[data-v-6ff0b515]{margin:.5rem 0 .5rem -1rem}.notification-description-and-progress[data-v-6ff0b515]{margin-top:.75rem;margin-bottom:.75rem}.fix-margin-bottom[data-v-6ff0b515]{margin-bottom:0}.progress[data-v-6ff0b515]{margin-top:.75rem}.progress-bar-spacer[data-v-6ff0b515]{height:.5rem}.cv-notifiation.bx--toast-notification.notification[data-v-6ff0b515]{width:26vw;min-width:20rem;margin-top:0}.notification-drawer .cv-notifiation.bx--toast-notification.notification[data-v-6ff0b515]{margin-top:1rem}.notification-drawer .cv-notifiation.bx--toast-notification.notification[data-v-6ff0b515]{width:100%;cursor:pointer}.notification-read[data-v-6ff0b515]{border-color:#8d8d8d;color:#c6c6c6}.notification-read .bx--toast-notification__icon[data-v-6ff0b515]{fill:currentColor}.notification-read .bx--toast-notification__subtitle[data-v-6ff0b515]{color:#c6c6c6}.notification-read .bx--toast-notification__title[data-v-6ff0b515]{font-weight:400}.cv-notifiation .timestamp[data-v-6ff0b515]{margin-bottom:.75rem;line-height:1.29;color:#fff;text-decoration:underline}.cv-notifiation .timestamp button[data-v-6ff0b515]{color:#c6c6c6}.bx--tooltip__trigger[data-v-6ff0b515]:not(.bx--btn--icon-only){font-size:inherit}.cv-notifiation .timestamp .bx--tooltip__trigger[data-v-6ff0b515]::before{border-bottom-color:#161616}div.row[data-v-6ff0b515]:last-child{margin-bottom:1.5rem}.bx--toast-notification__details[data-v-6ff0b515]{flex-grow:1}",
@@ -6435,26 +6442,26 @@ const __vue_inject_styles__$v = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$v = "data-v-6ff0b515";
+const __vue_scope_id__$x = "data-v-6ff0b515";
 /* module identifier */
 
-const __vue_module_identifier__$v = undefined;
+const __vue_module_identifier__$x = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$v = false;
+const __vue_is_functional_template__$x = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$V = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$u,
-  staticRenderFns: __vue_staticRenderFns__$u
-}, __vue_inject_styles__$v, __vue_script__$o, __vue_scope_id__$v, __vue_is_functional_template__$v, __vue_module_identifier__$v, false, createInjector, undefined, undefined);
+const __vue_component__$Z = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$v,
+  staticRenderFns: __vue_staticRenderFns__$v
+}, __vue_inject_styles__$x, __vue_script__$q, __vue_scope_id__$x, __vue_is_functional_template__$x, __vue_module_identifier__$x, false, createInjector, undefined, undefined);
 
-var __vue_component__$W = __vue_component__$V;
+var __vue_component__$_ = __vue_component__$Z;
 
 //
-var script$n = {
+var script$p = {
   name: "NsInfoCard",
   components: {
     NsSvg,
@@ -6505,10 +6512,10 @@ var script$n = {
 };
 
 /* script */
-const __vue_script__$n = script$n;
+const __vue_script__$p = script$p;
 /* template */
 
-var __vue_render__$t = function () {
+var __vue_render__$u = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -6565,10 +6572,10 @@ var __vue_render__$t = function () {
   }, [_vm.hasContentSlot ? _vm._t("content") : _vm._e()], 2)], 2);
 };
 
-var __vue_staticRenderFns__$t = [];
+var __vue_staticRenderFns__$u = [];
 /* style */
 
-const __vue_inject_styles__$u = function (inject) {
+const __vue_inject_styles__$w = function (inject) {
   if (!inject) return;
   inject("data-v-aefc1c3e_0", {
     source: ".info-card[data-v-aefc1c3e]{display:flex;flex-direction:column;justify-content:center;min-height:7rem;position:relative}.skeleton[data-v-aefc1c3e]{margin-top:.5rem;margin-left:auto;margin-right:auto}.row[data-v-aefc1c3e]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.title[data-v-aefc1c3e]{margin-left:.25rem;margin-right:.25rem;margin-bottom:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.description[data-v-aefc1c3e]{margin-left:.25rem;margin-right:.25rem}.slot[data-v-aefc1c3e]{margin-top:.5rem}",
@@ -6579,26 +6586,26 @@ const __vue_inject_styles__$u = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$u = "data-v-aefc1c3e";
+const __vue_scope_id__$w = "data-v-aefc1c3e";
 /* module identifier */
 
-const __vue_module_identifier__$u = undefined;
+const __vue_module_identifier__$w = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$u = false;
+const __vue_is_functional_template__$w = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$T = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$t,
-  staticRenderFns: __vue_staticRenderFns__$t
-}, __vue_inject_styles__$u, __vue_script__$n, __vue_scope_id__$u, __vue_is_functional_template__$u, __vue_module_identifier__$u, false, createInjector, undefined, undefined);
+const __vue_component__$X = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$u,
+  staticRenderFns: __vue_staticRenderFns__$u
+}, __vue_inject_styles__$w, __vue_script__$p, __vue_scope_id__$w, __vue_is_functional_template__$w, __vue_module_identifier__$w, false, createInjector, undefined, undefined);
 
-var __vue_component__$U = __vue_component__$T;
+var __vue_component__$Y = __vue_component__$X;
 
 //
-var script$m = {
+var script$o = {
   name: "NsStatusCard",
   //components added for storybook to work
   components: {
@@ -6645,10 +6652,10 @@ var script$m = {
 };
 
 /* script */
-const __vue_script__$m = script$m;
+const __vue_script__$o = script$o;
 /* template */
 
-var __vue_render__$s = function () {
+var __vue_render__$t = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -6717,10 +6724,10 @@ var __vue_render__$s = function () {
   }, [_c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])]) : _c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])], 1) : _vm._e()])]);
 };
 
-var __vue_staticRenderFns__$s = [];
+var __vue_staticRenderFns__$t = [];
 /* style */
 
-const __vue_inject_styles__$t = function (inject) {
+const __vue_inject_styles__$v = function (inject) {
   if (!inject) return;
   inject("data-v-496044f0_0", {
     source: ".status-card[data-v-496044f0]{display:flex;flex-direction:column;justify-content:center}.row[data-v-496044f0]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.value[data-v-496044f0]{margin-left:.25rem;margin-right:.25rem}.label[data-v-496044f0]{margin-left:.25rem;margin-right:.25rem}.success-icon[data-v-496044f0]{margin-right:.25rem}.error-icon[data-v-496044f0]{margin-right:.25rem}.warning-icon[data-v-496044f0]{margin-right:.25rem}.stats[data-v-496044f0]{display:flex;align-items:center;margin-left:.5rem;margin-right:.5rem}",
@@ -6731,26 +6738,26 @@ const __vue_inject_styles__$t = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$t = "data-v-496044f0";
+const __vue_scope_id__$v = "data-v-496044f0";
 /* module identifier */
 
-const __vue_module_identifier__$t = undefined;
+const __vue_module_identifier__$v = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$t = false;
+const __vue_is_functional_template__$v = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$R = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$s,
-  staticRenderFns: __vue_staticRenderFns__$s
-}, __vue_inject_styles__$t, __vue_script__$m, __vue_scope_id__$t, __vue_is_functional_template__$t, __vue_module_identifier__$t, false, createInjector, undefined, undefined);
+const __vue_component__$V = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$t,
+  staticRenderFns: __vue_staticRenderFns__$t
+}, __vue_inject_styles__$v, __vue_script__$o, __vue_scope_id__$v, __vue_is_functional_template__$v, __vue_module_identifier__$v, false, createInjector, undefined, undefined);
 
-var __vue_component__$S = __vue_component__$R;
+var __vue_component__$W = __vue_component__$V;
 
 //
-var script$l = {
+var script$n = {
   name: "NsSystemdServiceCard",
   //components added for storybook to work
   components: {
@@ -6804,10 +6811,10 @@ var script$l = {
 };
 
 /* script */
-const __vue_script__$l = script$l;
+const __vue_script__$n = script$n;
 /* template */
 
-var __vue_render__$r = function () {
+var __vue_render__$s = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -6862,10 +6869,10 @@ var __vue_render__$r = function () {
   })], 1)])]);
 };
 
-var __vue_staticRenderFns__$r = [];
+var __vue_staticRenderFns__$s = [];
 /* style */
 
-const __vue_inject_styles__$s = function (inject) {
+const __vue_inject_styles__$u = function (inject) {
   if (!inject) return;
   inject("data-v-bf751eca_0", {
     source: ".service-card[data-v-bf751eca]{display:flex;flex-direction:column;justify-content:center}.row[data-v-bf751eca]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.service-name[data-v-bf751eca]{margin-left:.25rem;margin-right:.25rem;margin-bottom:.5rem}.success-icon[data-v-bf751eca]{margin-right:.25rem}.error-icon[data-v-bf751eca]{margin-right:.25rem}.warning-icon[data-v-bf751eca]{margin-right:.25rem}.stats[data-v-bf751eca]{display:flex;align-items:center;margin-left:.5rem;margin-right:.5rem}",
@@ -6876,26 +6883,26 @@ const __vue_inject_styles__$s = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$s = "data-v-bf751eca";
+const __vue_scope_id__$u = "data-v-bf751eca";
 /* module identifier */
 
-const __vue_module_identifier__$s = undefined;
+const __vue_module_identifier__$u = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$s = false;
+const __vue_is_functional_template__$u = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$P = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$r,
-  staticRenderFns: __vue_staticRenderFns__$r
-}, __vue_inject_styles__$s, __vue_script__$l, __vue_scope_id__$s, __vue_is_functional_template__$s, __vue_module_identifier__$s, false, createInjector, undefined, undefined);
+const __vue_component__$T = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$s,
+  staticRenderFns: __vue_staticRenderFns__$s
+}, __vue_inject_styles__$u, __vue_script__$n, __vue_scope_id__$u, __vue_is_functional_template__$u, __vue_module_identifier__$u, false, createInjector, undefined, undefined);
 
-var __vue_component__$Q = __vue_component__$P;
+var __vue_component__$U = __vue_component__$T;
 
 //
-var script$k = {
+var script$m = {
   name: "NsTextInput",
   extends: CvTextInput,
   components: {
@@ -6950,10 +6957,10 @@ var script$k = {
 };
 
 /* script */
-const __vue_script__$k = script$k;
+const __vue_script__$m = script$m;
 /* template */
 
-var __vue_render__$q = function () {
+var __vue_render__$r = function () {
   var _obj, _obj$1, _obj$2, _obj$3, _obj$4;
 
   var _vm = this;
@@ -7032,10 +7039,10 @@ var __vue_render__$q = function () {
   })], 2) : _vm._e()]);
 };
 
-var __vue_staticRenderFns__$q = [];
+var __vue_staticRenderFns__$r = [];
 /* style */
 
-const __vue_inject_styles__$r = function (inject) {
+const __vue_inject_styles__$t = function (inject) {
   if (!inject) return;
   inject("data-v-11b039d1_0", {
     source: ".label-with-tooltip[data-v-11b039d1]{display:flex;align-items:baseline}.prefix[data-v-11b039d1]{font-weight:700;margin-right:.5rem;color:#525252}.align-items-center[data-v-11b039d1]{align-items:center}",
@@ -7050,23 +7057,23 @@ const __vue_inject_styles__$r = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$r = "data-v-11b039d1";
+const __vue_scope_id__$t = "data-v-11b039d1";
 /* module identifier */
 
-const __vue_module_identifier__$r = undefined;
+const __vue_module_identifier__$t = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$r = false;
+const __vue_is_functional_template__$t = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$O = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$q,
-  staticRenderFns: __vue_staticRenderFns__$q
-}, __vue_inject_styles__$r, __vue_script__$k, __vue_scope_id__$r, __vue_is_functional_template__$r, __vue_module_identifier__$r, false, createInjector, undefined, undefined);
+const __vue_component__$S = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$r,
+  staticRenderFns: __vue_staticRenderFns__$r
+}, __vue_inject_styles__$t, __vue_script__$m, __vue_scope_id__$t, __vue_is_functional_template__$t, __vue_module_identifier__$t, false, createInjector, undefined, undefined);
 
-var NsTextInput = __vue_component__$O;
+var NsTextInput = __vue_component__$S;
 
 // Unique ID creation requires a high quality random # generator.  In node.js
 // this is pretty straight-forward - we use the crypto API.
@@ -7590,13 +7597,25 @@ var UtilService = {
 
 
       return key;
+    },
+
+    /**
+     * Decode a jwt token and parse its payload
+     */
+    decodeJwtPayload(token) {
+      var base64Url = token.split(".")[1];
+      var base64 = base64Url.replace(/-/g, "+").replace(/_/g, "/");
+      var jsonPayload = decodeURIComponent(window.atob(base64).split("").map(function (c) {
+        return "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2);
+      }).join(""));
+      return JSON.parse(jsonPayload);
     }
 
   }
 };
 
 //
-var script$j = {
+var script$l = {
   name: "NsPasswordInput",
   components: {
     NsTextInput
@@ -7761,10 +7780,10 @@ var script$j = {
 };
 
 /* script */
-const __vue_script__$j = script$j;
+const __vue_script__$l = script$l;
 /* template */
 
-var __vue_render__$p = function () {
+var __vue_render__$q = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -7859,10 +7878,10 @@ var __vue_render__$p = function () {
   }, [_vm._v(_vm._s(_vm.equalLabel))])])], 1)]);
 };
 
-var __vue_staticRenderFns__$p = [];
+var __vue_staticRenderFns__$q = [];
 /* style */
 
-const __vue_inject_styles__$q = function (inject) {
+const __vue_inject_styles__$s = function (inject) {
   if (!inject) return;
   inject("data-v-67b93b40_0", {
     source: ".new-password-container[data-v-67b93b40]{margin-bottom:1rem}.new-password[data-v-67b93b40]{margin-bottom:.25rem}.confirm-password[data-v-67b93b40]{margin-bottom:.25rem}.password-meter[data-v-67b93b40]{display:flex}@media (min-width:672px){.password-meter[data-v-67b93b40]{max-width:38rem}}.requirement[data-v-67b93b40]{padding:.2rem;margin-left:.2rem;margin-right:.2rem;background-color:#f4f4f4;text-align:center;font-size:.75rem;line-height:1.34;letter-spacing:.32px}.requirement-light[data-v-67b93b40]{background-color:#fff}.requirement[data-v-67b93b40]:first-child{margin-left:0}.requirement-ok[data-v-67b93b40]{color:#fff;background-color:#198038}.requirement-disabled[data-v-67b93b40]{color:#c6c6c6;background-color:#f4f4f4}",
@@ -7873,26 +7892,26 @@ const __vue_inject_styles__$q = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$q = "data-v-67b93b40";
+const __vue_scope_id__$s = "data-v-67b93b40";
 /* module identifier */
 
-const __vue_module_identifier__$q = undefined;
+const __vue_module_identifier__$s = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$q = false;
+const __vue_is_functional_template__$s = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$M = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$p,
-  staticRenderFns: __vue_staticRenderFns__$p
-}, __vue_inject_styles__$q, __vue_script__$j, __vue_scope_id__$q, __vue_is_functional_template__$q, __vue_module_identifier__$q, false, createInjector, undefined, undefined);
+const __vue_component__$Q = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$q,
+  staticRenderFns: __vue_staticRenderFns__$q
+}, __vue_inject_styles__$s, __vue_script__$l, __vue_scope_id__$s, __vue_is_functional_template__$s, __vue_module_identifier__$s, false, createInjector, undefined, undefined);
 
-var __vue_component__$N = __vue_component__$M;
+var __vue_component__$R = __vue_component__$Q;
 
 //
-var script$i = {
+var script$k = {
   name: "NsIconMenu",
   extends: CvOverflowMenu,
   props: {
@@ -7936,10 +7955,10 @@ var script$i = {
 };
 
 /* script */
-const __vue_script__$i = script$i;
+const __vue_script__$k = script$k;
 /* template */
 
-var __vue_render__$o = function () {
+var __vue_render__$p = function () {
   var _obj, _obj$1;
 
   var _vm = this;
@@ -8055,10 +8074,10 @@ var __vue_render__$o = function () {
   })])]);
 };
 
-var __vue_staticRenderFns__$o = [];
+var __vue_staticRenderFns__$p = [];
 /* style */
 
-const __vue_inject_styles__$p = function (inject) {
+const __vue_inject_styles__$r = function (inject) {
   if (!inject) return;
   inject("data-v-2be14df6_0", {
     source: ".ns-icon-menu[data-v-2be14df6]{display:inline-flex}",
@@ -8069,26 +8088,26 @@ const __vue_inject_styles__$p = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$p = "data-v-2be14df6";
+const __vue_scope_id__$r = "data-v-2be14df6";
 /* module identifier */
 
-const __vue_module_identifier__$p = undefined;
+const __vue_module_identifier__$r = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$p = false;
+const __vue_is_functional_template__$r = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$K = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$o,
-  staticRenderFns: __vue_staticRenderFns__$o
-}, __vue_inject_styles__$p, __vue_script__$i, __vue_scope_id__$p, __vue_is_functional_template__$p, __vue_module_identifier__$p, false, createInjector, undefined, undefined);
+const __vue_component__$O = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$p,
+  staticRenderFns: __vue_staticRenderFns__$p
+}, __vue_inject_styles__$r, __vue_script__$k, __vue_scope_id__$r, __vue_is_functional_template__$r, __vue_module_identifier__$r, false, createInjector, undefined, undefined);
 
-var __vue_component__$L = __vue_component__$K;
+var __vue_component__$P = __vue_component__$O;
 
 //
-var script$h = {
+var script$j = {
   name: "NsMeterChart",
   components: {
     NsProgressBar
@@ -8123,10 +8142,10 @@ var script$h = {
 };
 
 /* script */
-const __vue_script__$h = script$h;
+const __vue_script__$j = script$j;
 /* template */
 
-var __vue_render__$n = function () {
+var __vue_render__$o = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -8149,10 +8168,10 @@ var __vue_render__$n = function () {
   })], 1);
 };
 
-var __vue_staticRenderFns__$n = [];
+var __vue_staticRenderFns__$o = [];
 /* style */
 
-const __vue_inject_styles__$o = function (inject) {
+const __vue_inject_styles__$q = function (inject) {
   if (!inject) return;
   inject("data-v-8d83456c_0", {
     source: ".label[data-v-8d83456c]{font-weight:700;margin-right:.5rem}.mg-bottom-sm[data-v-8d83456c]{margin-bottom:.5rem!important}",
@@ -8163,26 +8182,26 @@ const __vue_inject_styles__$o = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$o = "data-v-8d83456c";
+const __vue_scope_id__$q = "data-v-8d83456c";
 /* module identifier */
 
-const __vue_module_identifier__$o = undefined;
+const __vue_module_identifier__$q = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$o = false;
+const __vue_is_functional_template__$q = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$I = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$n,
-  staticRenderFns: __vue_staticRenderFns__$n
-}, __vue_inject_styles__$o, __vue_script__$h, __vue_scope_id__$o, __vue_is_functional_template__$o, __vue_module_identifier__$o, false, createInjector, undefined, undefined);
+const __vue_component__$M = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$o,
+  staticRenderFns: __vue_staticRenderFns__$o
+}, __vue_inject_styles__$q, __vue_script__$j, __vue_scope_id__$q, __vue_is_functional_template__$q, __vue_module_identifier__$q, false, createInjector, undefined, undefined);
 
-var __vue_component__$J = __vue_component__$I;
+var __vue_component__$N = __vue_component__$M;
 
 //
-var script$g = {
+var script$i = {
   name: "NsModal",
   extends: CvModal,
   components: {
@@ -8242,10 +8261,10 @@ var script$g = {
 };
 
 /* script */
-const __vue_script__$g = script$g;
+const __vue_script__$i = script$i;
 /* template */
 
-var __vue_render__$m = function () {
+var __vue_render__$n = function () {
   var _obj, _obj$1, _obj$2, _obj$3;
 
   var _vm = this;
@@ -8379,34 +8398,34 @@ var __vue_render__$m = function () {
   })], 1)]);
 };
 
-var __vue_staticRenderFns__$m = [];
+var __vue_staticRenderFns__$n = [];
 /* style */
 
-const __vue_inject_styles__$n = undefined;
+const __vue_inject_styles__$p = undefined;
 /* scoped */
 
-const __vue_scope_id__$n = undefined;
+const __vue_scope_id__$p = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$n = undefined;
+const __vue_module_identifier__$p = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$n = false;
+const __vue_is_functional_template__$p = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$H = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$m,
-  staticRenderFns: __vue_staticRenderFns__$m
-}, __vue_inject_styles__$n, __vue_script__$g, __vue_scope_id__$n, __vue_is_functional_template__$n, __vue_module_identifier__$n, false, undefined, undefined, undefined);
+const __vue_component__$L = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$n,
+  staticRenderFns: __vue_staticRenderFns__$n
+}, __vue_inject_styles__$p, __vue_script__$i, __vue_scope_id__$p, __vue_is_functional_template__$p, __vue_module_identifier__$p, false, undefined, undefined, undefined);
 
-var NsModal = __vue_component__$H;
+var NsModal = __vue_component__$L;
 
 //
-var script$f = {
+var script$h = {
   name: "NsDangerDeleteModal",
   //component added for storybook to work
   components: {
@@ -8502,10 +8521,10 @@ var script$f = {
 };
 
 /* script */
-const __vue_script__$f = script$f;
+const __vue_script__$h = script$h;
 /* template */
 
-var __vue_render__$l = function () {
+var __vue_render__$m = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -8573,10 +8592,10 @@ var __vue_render__$l = function () {
   }, [_vm._v(_vm._s(_vm.deleteLabel))])], 2);
 };
 
-var __vue_staticRenderFns__$l = [];
+var __vue_staticRenderFns__$m = [];
 /* style */
 
-const __vue_inject_styles__$m = function (inject) {
+const __vue_inject_styles__$o = function (inject) {
   if (!inject) return;
   inject("data-v-746a2de3_0", {
     source: ".type-to-confirm[data-v-746a2de3]{margin-top:2rem}",
@@ -8587,23 +8606,23 @@ const __vue_inject_styles__$m = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$m = "data-v-746a2de3";
+const __vue_scope_id__$o = "data-v-746a2de3";
 /* module identifier */
 
-const __vue_module_identifier__$m = undefined;
+const __vue_module_identifier__$o = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$m = false;
+const __vue_is_functional_template__$o = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$F = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$l,
-  staticRenderFns: __vue_staticRenderFns__$l
-}, __vue_inject_styles__$m, __vue_script__$f, __vue_scope_id__$m, __vue_is_functional_template__$m, __vue_module_identifier__$m, false, createInjector, undefined, undefined);
+const __vue_component__$J = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$m,
+  staticRenderFns: __vue_staticRenderFns__$m
+}, __vue_inject_styles__$o, __vue_script__$h, __vue_scope_id__$o, __vue_is_functional_template__$o, __vue_module_identifier__$o, false, createInjector, undefined, undefined);
 
-var __vue_component__$G = __vue_component__$F;
+var __vue_component__$K = __vue_component__$J;
 
 var IconService = {
   name: "IconService",
@@ -8766,20 +8785,23 @@ var IconService = {
       Locked20,
       Locked32,
       Folder16,
-      // public mailbox
       Folder20,
       Folder32,
       Asterisk16,
       // wildcard email domain
       Asterisk20,
-      Asterisk32
+      Asterisk32,
+      Box16,
+      // mailboxes
+      Box20,
+      Box32
     };
   }
 
 };
 
 //
-var script$e = {
+var script$g = {
   name: "NsDropdownAction",
   extends: CvOverflowMenu,
   components: {
@@ -8811,10 +8833,10 @@ var script$e = {
 };
 
 /* script */
-const __vue_script__$e = script$e;
+const __vue_script__$g = script$g;
 /* template */
 
-var __vue_render__$k = function () {
+var __vue_render__$l = function () {
   var _obj, _obj$1;
 
   var _vm = this;
@@ -8914,34 +8936,34 @@ var __vue_render__$k = function () {
   })])]);
 };
 
-var __vue_staticRenderFns__$k = [];
+var __vue_staticRenderFns__$l = [];
 /* style */
 
-const __vue_inject_styles__$l = undefined;
+const __vue_inject_styles__$n = undefined;
 /* scoped */
 
-const __vue_scope_id__$l = "data-v-31925b9d";
+const __vue_scope_id__$n = "data-v-31925b9d";
 /* module identifier */
 
-const __vue_module_identifier__$l = undefined;
+const __vue_module_identifier__$n = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$l = false;
+const __vue_is_functional_template__$n = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$D = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$k,
-  staticRenderFns: __vue_staticRenderFns__$k
-}, __vue_inject_styles__$l, __vue_script__$e, __vue_scope_id__$l, __vue_is_functional_template__$l, __vue_module_identifier__$l, false, undefined, undefined, undefined);
+const __vue_component__$H = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$l,
+  staticRenderFns: __vue_staticRenderFns__$l
+}, __vue_inject_styles__$n, __vue_script__$g, __vue_scope_id__$n, __vue_is_functional_template__$n, __vue_module_identifier__$n, false, undefined, undefined, undefined);
 
-var __vue_component__$E = __vue_component__$D;
+var __vue_component__$I = __vue_component__$H;
 
 //
-var script$d = {
+var script$f = {
   name: "NsBackupCardDetails",
   mixins: [DateTimeService],
   props: {
@@ -8977,10 +8999,10 @@ var script$d = {
 };
 
 /* script */
-const __vue_script__$d = script$d;
+const __vue_script__$f = script$f;
 /* template */
 
-var __vue_render__$j = function () {
+var __vue_render__$k = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -9034,10 +9056,10 @@ var __vue_render__$j = function () {
   }, [_vm.status[_vm.backup.id] && _vm.status[_vm.backup.id].total_file_count ? _c('span', [_vm._v("\n        " + _vm._s(_vm.status[_vm.backup.id].total_file_count) + "\n      ")]) : _c('span', [_vm._v("-")])])])]);
 };
 
-var __vue_staticRenderFns__$j = [];
+var __vue_staticRenderFns__$k = [];
 /* style */
 
-const __vue_inject_styles__$k = function (inject) {
+const __vue_inject_styles__$m = function (inject) {
   if (!inject) return;
   inject("data-v-25453d1c_0", {
     source: ".ns-backup-card-details[data-v-25453d1c]{display:contents}.tr[data-v-25453d1c]{display:table-row}.td[data-v-25453d1c]{display:table-cell}.label[data-v-25453d1c]{padding-right:.75rem;font-weight:700;text-align:right;padding-bottom:.5rem}",
@@ -9048,26 +9070,26 @@ const __vue_inject_styles__$k = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$k = "data-v-25453d1c";
+const __vue_scope_id__$m = "data-v-25453d1c";
 /* module identifier */
 
-const __vue_module_identifier__$k = undefined;
+const __vue_module_identifier__$m = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$k = false;
+const __vue_is_functional_template__$m = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$C = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$j,
-  staticRenderFns: __vue_staticRenderFns__$j
-}, __vue_inject_styles__$k, __vue_script__$d, __vue_scope_id__$k, __vue_is_functional_template__$k, __vue_module_identifier__$k, false, createInjector, undefined, undefined);
+const __vue_component__$G = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$k,
+  staticRenderFns: __vue_staticRenderFns__$k
+}, __vue_inject_styles__$m, __vue_script__$f, __vue_scope_id__$m, __vue_is_functional_template__$m, __vue_module_identifier__$m, false, createInjector, undefined, undefined);
 
-var NsBackupCardDetails = __vue_component__$C;
+var NsBackupCardDetails = __vue_component__$G;
 
 //
-var script$c = {
+var script$e = {
   name: "NsBackupCard",
   components: {
     NsBackupCardDetails
@@ -9208,10 +9230,10 @@ var script$c = {
 };
 
 /* script */
-const __vue_script__$c = script$c;
+const __vue_script__$e = script$e;
 /* template */
 
-var __vue_render__$i = function () {
+var __vue_render__$j = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -9327,10 +9349,10 @@ var __vue_render__$i = function () {
   }, [_vm._v(_vm._s(_vm.goToBackupLabel) + "\n      ")])], 1)])], 2);
 };
 
-var __vue_staticRenderFns__$i = [];
+var __vue_staticRenderFns__$j = [];
 /* style */
 
-const __vue_inject_styles__$j = function (inject) {
+const __vue_inject_styles__$l = function (inject) {
   if (!inject) return;
   inject("data-v-5a3b7738_0", {
     source: ".ns-backup-card[data-v-5a3b7738]{display:flex;flex-direction:column;justify-content:center;min-height:7rem}.backup[data-v-5a3b7738]{margin-bottom:1rem}.backup[data-v-5a3b7738]:last-child{margin-bottom:0}.row[data-v-5a3b7738]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.title[data-v-5a3b7738]{margin-left:.25rem;margin-right:.25rem;margin-bottom:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.table-wrapper[data-v-5a3b7738]{display:flex;justify-content:center;margin-bottom:.5rem}.table[data-v-5a3b7738]{display:table}.tr[data-v-5a3b7738]{display:table-row}.td[data-v-5a3b7738]{display:table-cell}.label[data-v-5a3b7738]{padding-right:.75rem;font-weight:700;text-align:right;padding-bottom:.5rem}.status[data-v-5a3b7738]{font-weight:700}.backup-status-icon[data-v-5a3b7738]{margin-right:.25rem}",
@@ -9345,26 +9367,26 @@ const __vue_inject_styles__$j = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$j = "data-v-5a3b7738";
+const __vue_scope_id__$l = "data-v-5a3b7738";
 /* module identifier */
 
-const __vue_module_identifier__$j = undefined;
+const __vue_module_identifier__$l = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$j = false;
+const __vue_is_functional_template__$l = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$A = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$i,
-  staticRenderFns: __vue_staticRenderFns__$i
-}, __vue_inject_styles__$j, __vue_script__$c, __vue_scope_id__$j, __vue_is_functional_template__$j, __vue_module_identifier__$j, false, createInjector, undefined, undefined);
+const __vue_component__$E = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$j,
+  staticRenderFns: __vue_staticRenderFns__$j
+}, __vue_inject_styles__$l, __vue_script__$e, __vue_scope_id__$l, __vue_is_functional_template__$l, __vue_module_identifier__$l, false, createInjector, undefined, undefined);
 
-var __vue_component__$B = __vue_component__$A;
+var __vue_component__$F = __vue_component__$E;
 
 //
-var script$b = {
+var script$d = {
   name: "NsWizard",
   extends: NsModal,
   mixins: [IconService],
@@ -9408,10 +9430,10 @@ var script$b = {
 };
 
 /* script */
-const __vue_script__$b = script$b;
+const __vue_script__$d = script$d;
 /* template */
 
-var __vue_render__$h = function () {
+var __vue_render__$i = function () {
   var _obj, _obj$1;
 
   var _vm = this;
@@ -9553,34 +9575,34 @@ var __vue_render__$h = function () {
   })], 1)]);
 };
 
-var __vue_staticRenderFns__$h = [];
+var __vue_staticRenderFns__$i = [];
 /* style */
 
-const __vue_inject_styles__$i = undefined;
+const __vue_inject_styles__$k = undefined;
 /* scoped */
 
-const __vue_scope_id__$i = undefined;
+const __vue_scope_id__$k = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$i = undefined;
+const __vue_module_identifier__$k = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$i = false;
+const __vue_is_functional_template__$k = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$y = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$h,
-  staticRenderFns: __vue_staticRenderFns__$h
-}, __vue_inject_styles__$i, __vue_script__$b, __vue_scope_id__$i, __vue_is_functional_template__$i, __vue_module_identifier__$i, false, undefined, undefined, undefined);
+const __vue_component__$C = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$i,
+  staticRenderFns: __vue_staticRenderFns__$i
+}, __vue_inject_styles__$k, __vue_script__$d, __vue_scope_id__$k, __vue_is_functional_template__$k, __vue_module_identifier__$k, false, undefined, undefined, undefined);
 
-var __vue_component__$z = __vue_component__$y;
+var __vue_component__$D = __vue_component__$C;
 
 //
-var script$a = {
+var script$c = {
   name: "NsMenuItem",
   components: {
     NsSvg
@@ -9603,10 +9625,10 @@ var script$a = {
 };
 
 /* script */
-const __vue_script__$a = script$a;
+const __vue_script__$c = script$c;
 /* template */
 
-var __vue_render__$g = function () {
+var __vue_render__$h = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -9626,10 +9648,10 @@ var __vue_render__$g = function () {
   }, [_vm._t("icon")], 2) : _vm._e(), _vm._v(" "), _c('span', [_vm._v(_vm._s(_vm.label))])]);
 };
 
-var __vue_staticRenderFns__$g = [];
+var __vue_staticRenderFns__$h = [];
 /* style */
 
-const __vue_inject_styles__$h = function (inject) {
+const __vue_inject_styles__$j = function (inject) {
   if (!inject) return;
   inject("data-v-35f08832_0", {
     source: ".ns-menu-item[data-v-35f08832]{display:flex;align-items:center}.icon[data-v-35f08832]{margin-right:.5rem}",
@@ -9640,26 +9662,26 @@ const __vue_inject_styles__$h = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$h = "data-v-35f08832";
+const __vue_scope_id__$j = "data-v-35f08832";
 /* module identifier */
 
-const __vue_module_identifier__$h = undefined;
+const __vue_module_identifier__$j = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$h = false;
+const __vue_is_functional_template__$j = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$w = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$g,
-  staticRenderFns: __vue_staticRenderFns__$g
-}, __vue_inject_styles__$h, __vue_script__$a, __vue_scope_id__$h, __vue_is_functional_template__$h, __vue_module_identifier__$h, false, createInjector, undefined, undefined);
+const __vue_component__$A = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$h,
+  staticRenderFns: __vue_staticRenderFns__$h
+}, __vue_inject_styles__$j, __vue_script__$c, __vue_scope_id__$j, __vue_is_functional_template__$j, __vue_module_identifier__$j, false, createInjector, undefined, undefined);
 
-var __vue_component__$x = __vue_component__$w;
+var __vue_component__$B = __vue_component__$A;
 
 //
-var script$9 = {
+var script$b = {
   name: "NsMenuDivider",
   components: {
     CvSideNavDivider
@@ -9667,10 +9689,10 @@ var script$9 = {
 };
 
 /* script */
-const __vue_script__$9 = script$9;
+const __vue_script__$b = script$b;
 /* template */
 
-var __vue_render__$f = function () {
+var __vue_render__$g = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -9680,34 +9702,34 @@ var __vue_render__$f = function () {
   return _c('cv-side-nav-divider');
 };
 
-var __vue_staticRenderFns__$f = [];
+var __vue_staticRenderFns__$g = [];
 /* style */
 
-const __vue_inject_styles__$g = undefined;
+const __vue_inject_styles__$i = undefined;
 /* scoped */
 
-const __vue_scope_id__$g = "data-v-c2c8c17e";
+const __vue_scope_id__$i = "data-v-c2c8c17e";
 /* module identifier */
 
-const __vue_module_identifier__$g = undefined;
+const __vue_module_identifier__$i = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$g = false;
+const __vue_is_functional_template__$i = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$u = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$f,
-  staticRenderFns: __vue_staticRenderFns__$f
-}, __vue_inject_styles__$g, __vue_script__$9, __vue_scope_id__$g, __vue_is_functional_template__$g, __vue_module_identifier__$g, false, undefined, undefined, undefined);
+const __vue_component__$y = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$g,
+  staticRenderFns: __vue_staticRenderFns__$g
+}, __vue_inject_styles__$i, __vue_script__$b, __vue_scope_id__$i, __vue_is_functional_template__$i, __vue_module_identifier__$i, false, undefined, undefined, undefined);
 
-var __vue_component__$v = __vue_component__$u;
+var __vue_component__$z = __vue_component__$y;
 
 //
-var script$8 = {
+var script$a = {
   name: "NsSystemLogsCard",
   mixins: [UtilService, IconService],
   props: {
@@ -9826,10 +9848,10 @@ var script$8 = {
 };
 
 /* script */
-const __vue_script__$8 = script$8;
+const __vue_script__$a = script$a;
 /* template */
 
-var __vue_render__$e = function () {
+var __vue_render__$f = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -9856,34 +9878,34 @@ var __vue_render__$e = function () {
   }, [_vm._v("\n      " + _vm._s(_vm.buttonLabel) + "\n    ")])], 1)], 2);
 };
 
-var __vue_staticRenderFns__$e = [];
+var __vue_staticRenderFns__$f = [];
 /* style */
 
-const __vue_inject_styles__$f = undefined;
+const __vue_inject_styles__$h = undefined;
 /* scoped */
 
-const __vue_scope_id__$f = "data-v-aec74b8e";
+const __vue_scope_id__$h = "data-v-aec74b8e";
 /* module identifier */
 
-const __vue_module_identifier__$f = undefined;
+const __vue_module_identifier__$h = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$f = false;
+const __vue_is_functional_template__$h = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$s = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$e,
-  staticRenderFns: __vue_staticRenderFns__$e
-}, __vue_inject_styles__$f, __vue_script__$8, __vue_scope_id__$f, __vue_is_functional_template__$f, __vue_module_identifier__$f, false, undefined, undefined, undefined);
+const __vue_component__$w = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$f,
+  staticRenderFns: __vue_staticRenderFns__$f
+}, __vue_inject_styles__$h, __vue_script__$a, __vue_scope_id__$h, __vue_is_functional_template__$h, __vue_module_identifier__$h, false, undefined, undefined, undefined);
 
-var __vue_component__$t = __vue_component__$s;
+var __vue_component__$x = __vue_component__$w;
 
 //
-var script$7 = {
+var script$9 = {
   name: "NsTimePicker",
   mixins: [uidMixin, carbonPrefixMixin, themeMixin],
   props: {
@@ -9926,10 +9948,10 @@ var script$7 = {
 };
 
 /* script */
-const __vue_script__$7 = script$7;
+const __vue_script__$9 = script$9;
 /* template */
 
-var __vue_render__$d = function () {
+var __vue_render__$e = function () {
   var _obj, _obj$1;
 
   var _vm = this;
@@ -9973,10 +9995,10 @@ var __vue_render__$d = function () {
   })], 2) : _vm._e()]);
 };
 
-var __vue_staticRenderFns__$d = [];
+var __vue_staticRenderFns__$e = [];
 /* style */
 
-const __vue_inject_styles__$e = function (inject) {
+const __vue_inject_styles__$g = function (inject) {
   if (!inject) return;
   inject("data-v-e1e1beb2_0", {
     source: ".ns-time-picker .time-picker-field[data-v-e1e1beb2]{padding:0;width:6rem}.ns-time-picker .time-picker-field.narrow-width[data-v-e1e1beb2]{width:4.875rem}",
@@ -9991,23 +10013,23 @@ const __vue_inject_styles__$e = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$e = "data-v-e1e1beb2";
+const __vue_scope_id__$g = "data-v-e1e1beb2";
 /* module identifier */
 
-const __vue_module_identifier__$e = undefined;
+const __vue_module_identifier__$g = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$e = false;
+const __vue_is_functional_template__$g = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$q = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$d,
-  staticRenderFns: __vue_staticRenderFns__$d
-}, __vue_inject_styles__$e, __vue_script__$7, __vue_scope_id__$e, __vue_is_functional_template__$e, __vue_module_identifier__$e, false, createInjector, undefined, undefined);
+const __vue_component__$u = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$e,
+  staticRenderFns: __vue_staticRenderFns__$e
+}, __vue_inject_styles__$g, __vue_script__$9, __vue_scope_id__$g, __vue_is_functional_template__$g, __vue_module_identifier__$g, false, createInjector, undefined, undefined);
 
-var __vue_component__$r = __vue_component__$q;
+var __vue_component__$v = __vue_component__$u;
 
 /*
  * This component optionally wraps slotted content with the specified tag-type.
@@ -10046,7 +10068,7 @@ var NsWrapper = {
 
 };
 
-var script$6 = {
+var script$8 = {
   name: "NsPagination",
   extends: CvPagination,
   props: {
@@ -10124,12 +10146,12 @@ var script$6 = {
 };
 
 /* script */
-const __vue_script__$6 = script$6;
+const __vue_script__$8 = script$8;
 /* template */
 
 /* style */
 
-const __vue_inject_styles__$d = function (inject) {
+const __vue_inject_styles__$f = function (inject) {
   if (!inject) return;
   inject("data-v-01f52cb6_0", {
     source: ".cv-pagination .bx--select .bx--label{font-size:100%}",
@@ -10140,20 +10162,20 @@ const __vue_inject_styles__$d = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$d = undefined;
+const __vue_scope_id__$f = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$d = undefined;
+const __vue_module_identifier__$f = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$d = undefined;
+const __vue_is_functional_template__$f = undefined;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$p = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$d, __vue_script__$6, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, createInjector, undefined, undefined);
+const __vue_component__$t = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$f, __vue_script__$8, __vue_scope_id__$f, __vue_is_functional_template__$f, __vue_module_identifier__$f, false, createInjector, undefined, undefined);
 
-var NsPagination = __vue_component__$p;
+var NsPagination = __vue_component__$t;
 
 var v$3 = "5.6.1";
 var fr$3 = 24;
@@ -17192,7 +17214,7 @@ var LottieService = {
 };
 
 //
-var script$5 = {
+var script$7 = {
   name: "NsDataTable",
   extends: CvDataTable,
   components: {
@@ -17442,6 +17464,27 @@ var script$5 = {
       }
     },
 
+    searchMatch(target, cleanRegex, queryText) {
+      if (Array.isArray(target)) {
+        // search field is an array (e.g. groups)
+        return target.some(elem => {
+          return this.searchMatch(elem, cleanRegex, queryText);
+        });
+      } else if (typeof target === "string") {
+        // search field is a simple string
+        return new RegExp(queryText, "i").test(target.replace(cleanRegex, ""));
+      } else if (typeof target === "number") {
+        // search field is a number
+        return new RegExp(queryText, "i").test(target.toString().replace(cleanRegex, ""));
+      } else if (typeof target === "object") {
+        // search field is an object, search in its attributes
+        return Object.keys(target).some(key => {
+          // recursion
+          return this.searchMatch(target[key], cleanRegex, queryText);
+        });
+      }
+    },
+
     defaultFilterRows() {
       if (!this.searchFilter) {
         return this.allRows;
@@ -17452,18 +17495,10 @@ var script$5 = {
         const searchResults = this.allRows.filter(option => {
           // compare query text with attributes option
           return this.rawColumns.some(searchField => {
-            const searchValue = option[searchField];
-
-            if (searchValue) {
-              if (Array.isArray(searchValue)) {
-                // search field is an array (e.g. groups)
-                return searchValue.some(elem => {
-                  return new RegExp(queryText, "i").test(elem.replace(cleanRegex, ""));
-                });
-              } else {
-                // search field is a simple string
-                return new RegExp(queryText, "i").test(searchValue.replace(cleanRegex, ""));
-              }
+            const target = option[searchField];
+
+            if (target) {
+              return this.searchMatch(target, cleanRegex, queryText);
             } else {
               return false;
             }
@@ -17501,10 +17536,10 @@ var script$5 = {
 };
 
 /* script */
-const __vue_script__$5 = script$5;
+const __vue_script__$7 = script$7;
 /* template */
 
-var __vue_render__$c = function () {
+var __vue_render__$d = function () {
   var _obj, _obj$1, _obj$2, _obj$3;
 
   var _vm = this;
@@ -17832,34 +17867,34 @@ var __vue_render__$c = function () {
   }, 'NsPagination', _vm.internalPagination, false)) : _vm._e()], 1)], 2);
 };
 
-var __vue_staticRenderFns__$c = [];
+var __vue_staticRenderFns__$d = [];
 /* style */
 
-const __vue_inject_styles__$c = undefined;
+const __vue_inject_styles__$e = undefined;
 /* scoped */
 
-const __vue_scope_id__$c = undefined;
+const __vue_scope_id__$e = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$c = undefined;
+const __vue_module_identifier__$e = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$c = false;
+const __vue_is_functional_template__$e = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$n = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$c,
-  staticRenderFns: __vue_staticRenderFns__$c
-}, __vue_inject_styles__$c, __vue_script__$5, __vue_scope_id__$c, __vue_is_functional_template__$c, __vue_module_identifier__$c, false, undefined, undefined, undefined);
+const __vue_component__$r = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$d,
+  staticRenderFns: __vue_staticRenderFns__$d
+}, __vue_inject_styles__$e, __vue_script__$7, __vue_scope_id__$e, __vue_is_functional_template__$e, __vue_module_identifier__$e, false, undefined, undefined, undefined);
 
-var __vue_component__$o = __vue_component__$n;
+var __vue_component__$s = __vue_component__$r;
 
 //
-var script$4 = {
+var script$6 = {
   name: "NsToggle",
   extends: CvToggle,
   props: {
@@ -17890,10 +17925,10 @@ var script$4 = {
 };
 
 /* script */
-const __vue_script__$4 = script$4;
+const __vue_script__$6 = script$6;
 /* template */
 
-var __vue_render__$b = function () {
+var __vue_render__$c = function () {
   var _obj;
 
   var _vm = this;
@@ -17962,10 +17997,10 @@ var __vue_render__$b = function () {
   })], 2)])])]);
 };
 
-var __vue_staticRenderFns__$b = [];
+var __vue_staticRenderFns__$c = [];
 /* style */
 
-const __vue_inject_styles__$b = function (inject) {
+const __vue_inject_styles__$d = function (inject) {
   if (!inject) return;
   inject("data-v-08c576ca_0", {
     source: ".tooltip[data-v-08c576ca]{display:inline-block;position:absolute}",
@@ -17980,26 +18015,26 @@ const __vue_inject_styles__$b = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$b = "data-v-08c576ca";
+const __vue_scope_id__$d = "data-v-08c576ca";
 /* module identifier */
 
-const __vue_module_identifier__$b = undefined;
+const __vue_module_identifier__$d = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$b = false;
+const __vue_is_functional_template__$d = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$l = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$b,
-  staticRenderFns: __vue_staticRenderFns__$b
-}, __vue_inject_styles__$b, __vue_script__$4, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, createInjector, undefined, undefined);
+const __vue_component__$p = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$c,
+  staticRenderFns: __vue_staticRenderFns__$c
+}, __vue_inject_styles__$d, __vue_script__$6, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, createInjector, undefined, undefined);
 
-var __vue_component__$m = __vue_component__$l;
+var __vue_component__$q = __vue_component__$p;
 
 //
-var script$3 = {
+var script$5 = {
   name: "NsTag",
   extends: CvTag,
   computed: {
@@ -18011,10 +18046,10 @@ var script$3 = {
 };
 
 /* script */
-const __vue_script__$3 = script$3;
+const __vue_script__$5 = script$5;
 /* template */
 
-var __vue_render__$a = function () {
+var __vue_render__$b = function () {
   var _obj;
 
   var _vm = this;
@@ -18080,10 +18115,10 @@ var __vue_render__$a = function () {
   }, [_c('Close16')], 1) : _vm._e()]);
 };
 
-var __vue_staticRenderFns__$a = [];
+var __vue_staticRenderFns__$b = [];
 /* style */
 
-const __vue_inject_styles__$a = function (inject) {
+const __vue_inject_styles__$c = function (inject) {
   if (!inject) return;
   inject("data-v-34eae706_0", {
     source: ".bx--tag--filter[data-v-34eae706]{cursor:default}",
@@ -18094,23 +18129,23 @@ const __vue_inject_styles__$a = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$a = "data-v-34eae706";
+const __vue_scope_id__$c = "data-v-34eae706";
 /* module identifier */
 
-const __vue_module_identifier__$a = undefined;
+const __vue_module_identifier__$c = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$a = false;
+const __vue_is_functional_template__$c = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$k = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$a,
-  staticRenderFns: __vue_staticRenderFns__$a
-}, __vue_inject_styles__$a, __vue_script__$3, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, createInjector, undefined, undefined);
+const __vue_component__$o = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$b,
+  staticRenderFns: __vue_staticRenderFns__$b
+}, __vue_inject_styles__$c, __vue_script__$5, __vue_scope_id__$c, __vue_is_functional_template__$c, __vue_module_identifier__$c, false, createInjector, undefined, undefined);
 
-var NsTag = __vue_component__$k;
+var NsTag = __vue_component__$o;
 
 /**
  * Removes all key-value entries from the list cache.
@@ -20607,7 +20642,7 @@ const TOP_AFTER_REOPEN = 0;
 const TOP = 1;
 const FIXED = 2;
 const selectionFeedbackOptions = ["top-after-reopen", "top", "fixed"];
-var script$2 = {
+var script$4 = {
   name: "NsMultiSelect",
   inheritAttrs: false,
   mixins: [themeMixin, uidMixin, carbonPrefixMixin, methodsMixin({
@@ -21102,10 +21137,10 @@ var script$2 = {
 };
 
 /* script */
-const __vue_script__$2 = script$2;
+const __vue_script__$4 = script$4;
 /* template */
 
-var __vue_render__$9 = function () {
+var __vue_render__$a = function () {
   var _obj, _obj$1, _obj$2, _obj$3, _obj$4, _obj$5, _obj$6;
 
   var _vm = this;
@@ -21354,37 +21389,37 @@ var __vue_render__$9 = function () {
     return [_vm._v(_vm._s(_vm.helperText))];
   })], 2) : _vm._e(), _vm._v(" "), _vm.showSelectedItems && _vm.dataValue.length ? _c('div', {
     staticClass: "mg-top-sm"
-  }, _vm._l(_vm.selectedItems, function (item) {
+  }, _vm._l(_vm.selectedItems, function (item, index) {
     return _c('NsTag', {
-      key: item.value,
+      key: index,
       staticClass: "selected-item",
       attrs: {
         "filter": "",
         "size": "sm",
         "clear-aria-label": _vm.unselectAriaLabel,
-        "label": item.label,
+        "label": item ? item.label : '',
         "kind": _vm.selectedItemsColor,
         "disabled": _vm.disabled
       },
       on: {
         "remove": function ($event) {
-          return _vm.onItemClick(item.value);
+          return _vm.onItemClick(item ? item.value : '');
         }
       }
     });
   }), 1) : _vm._e()]);
 };
 
-var __vue_staticRenderFns__$9 = [];
+var __vue_staticRenderFns__$a = [];
 /* style */
 
-const __vue_inject_styles__$9 = function (inject) {
+const __vue_inject_styles__$b = function (inject) {
   if (!inject) return;
-  inject("data-v-319bf0f2_0", {
-    source: ".bx--multi-select--filterable .bx--tag.selected-item[data-v-319bf0f2]{margin-left:0;margin-bottom:.25rem}.margin-bottom-on-open[data-v-319bf0f2]{margin-bottom:14rem}.label-with-tooltip[data-v-319bf0f2]{display:flex;align-items:baseline}",
+  inject("data-v-6bbe779f_0", {
+    source: ".bx--multi-select--filterable .bx--tag.selected-item[data-v-6bbe779f]{margin-left:0;margin-bottom:.25rem}.margin-bottom-on-open[data-v-6bbe779f]{margin-bottom:14rem}.label-with-tooltip[data-v-6bbe779f]{display:flex;align-items:baseline}",
     map: undefined,
     media: undefined
-  }), inject("data-v-319bf0f2_1", {
+  }), inject("data-v-6bbe779f_1", {
     source: ".selected-item button.bx--tag__close-icon{position:relative;right:1px}.ns-multi-select .bx--tooltip__label .bx--tooltip__trigger{margin-left:.25rem}",
     map: undefined,
     media: undefined
@@ -21393,26 +21428,26 @@ const __vue_inject_styles__$9 = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$9 = "data-v-319bf0f2";
+const __vue_scope_id__$b = "data-v-6bbe779f";
 /* module identifier */
 
-const __vue_module_identifier__$9 = undefined;
+const __vue_module_identifier__$b = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$9 = false;
+const __vue_is_functional_template__$b = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$i = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$9,
-  staticRenderFns: __vue_staticRenderFns__$9
-}, __vue_inject_styles__$9, __vue_script__$2, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, false, createInjector, undefined, undefined);
+const __vue_component__$m = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$a,
+  staticRenderFns: __vue_staticRenderFns__$a
+}, __vue_inject_styles__$b, __vue_script__$4, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, createInjector, undefined, undefined);
 
-var __vue_component__$j = __vue_component__$i;
+var __vue_component__$n = __vue_component__$m;
 
 //
-var script$1 = {
+var script$3 = {
   name: "NsComboBox",
   inheritAttrs: false,
   mixins: [themeMixin, uidMixin, carbonPrefixMixin, methodsMixin({
@@ -21830,10 +21865,10 @@ var script$1 = {
 };
 
 /* script */
-const __vue_script__$1 = script$1;
+const __vue_script__$3 = script$3;
 /* template */
 
-var __vue_render__$8 = function () {
+var __vue_render__$9 = function () {
   var _obj, _obj$1, _obj$2, _obj$3, _obj$4;
 
   var _vm = this;
@@ -22051,10 +22086,10 @@ var __vue_render__$8 = function () {
   })], 2) : _vm._e()]);
 };
 
-var __vue_staticRenderFns__$8 = [];
+var __vue_staticRenderFns__$9 = [];
 /* style */
 
-const __vue_inject_styles__$8 = function (inject) {
+const __vue_inject_styles__$a = function (inject) {
   if (!inject) return;
   inject("data-v-05ab085e_0", {
     source: ".margin-bottom-on-open[data-v-05ab085e]{margin-bottom:14rem}.label-with-tooltip[data-v-05ab085e]{display:flex;align-items:baseline}",
@@ -22069,26 +22104,26 @@ const __vue_inject_styles__$8 = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$8 = "data-v-05ab085e";
+const __vue_scope_id__$a = "data-v-05ab085e";
 /* module identifier */
 
-const __vue_module_identifier__$8 = undefined;
+const __vue_module_identifier__$a = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$8 = false;
+const __vue_is_functional_template__$a = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$g = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$8,
-  staticRenderFns: __vue_staticRenderFns__$8
-}, __vue_inject_styles__$8, __vue_script__$1, __vue_scope_id__$8, __vue_is_functional_template__$8, __vue_module_identifier__$8, false, createInjector, undefined, undefined);
+const __vue_component__$k = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$9,
+  staticRenderFns: __vue_staticRenderFns__$9
+}, __vue_inject_styles__$a, __vue_script__$3, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, createInjector, undefined, undefined);
 
-var __vue_component__$h = __vue_component__$g;
+var __vue_component__$l = __vue_component__$k;
 
 //
-var script = {
+var script$2 = {
   name: "NsCheckbox",
   extends: CvCheckbox,
   inheritAttrs: false,
@@ -22120,10 +22155,10 @@ var script = {
 };
 
 /* script */
-const __vue_script__ = script;
+const __vue_script__$2 = script$2;
 /* template */
 
-var __vue_render__$7 = function () {
+var __vue_render__$8 = function () {
   var _obj, _obj$1, _obj$2;
 
   var _vm = this;
@@ -22177,16 +22212,16 @@ var __vue_render__$7 = function () {
   }, [_vm._t("tooltip")], 2)], 2) : _vm._e()], 1)])])]);
 };
 
-var __vue_staticRenderFns__$7 = [];
+var __vue_staticRenderFns__$8 = [];
 /* style */
 
-const __vue_inject_styles__$7 = function (inject) {
+const __vue_inject_styles__$9 = function (inject) {
   if (!inject) return;
-  inject("data-v-6baa0728_0", {
-    source: ".label-with-tooltip[data-v-6baa0728]{display:flex}",
+  inject("data-v-b70bd436_0", {
+    source: ".label-with-tooltip[data-v-b70bd436]{display:flex}",
     map: undefined,
     media: undefined
-  }), inject("data-v-6baa0728_1", {
+  }), inject("data-v-b70bd436_1", {
     source: ".ns-checkbox .bx--tooltip__label .bx--tooltip__trigger{margin-left:.25rem}",
     map: undefined,
     media: undefined
@@ -22195,58 +22230,708 @@ const __vue_inject_styles__$7 = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$7 = "data-v-6baa0728";
+const __vue_scope_id__$9 = "data-v-b70bd436";
 /* module identifier */
 
-const __vue_module_identifier__$7 = undefined;
+const __vue_module_identifier__$9 = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$7 = false;
+const __vue_is_functional_template__$9 = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$e = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$7,
-  staticRenderFns: __vue_staticRenderFns__$7
-}, __vue_inject_styles__$7, __vue_script__, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, false, createInjector, undefined, undefined);
+const __vue_component__$i = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$8,
+  staticRenderFns: __vue_staticRenderFns__$8
+}, __vue_inject_styles__$9, __vue_script__$2, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, false, createInjector, undefined, undefined);
 
-var __vue_component__$f = __vue_component__$e;
+var __vue_component__$j = __vue_component__$i;
 
-/* script */
+//
+var script$1 = {
+  name: "NsByteSlider",
+  mixins: [uidMixin, themeMixin, carbonPrefixMixin, methodsMixin({
+    thumb: ["blur", "focus"]
+  })],
+  props: {
+    disabled: Boolean,
+    label: String,
+    // NOTE: It is not safe to rely on Numbers for non-integer steps
+    min: {
+      type: String,
+      default: "0"
+    },
+    max: {
+      type: String,
+      default: "100"
+    },
+    step: {
+      type: String,
+      default: "1"
+    },
+    stepMultiplier: {
+      type: String,
+      default: "4",
 
-/* template */
-var __vue_render__$6 = function () {
-  var _vm = this;
+      validator(val) {
+        if (val.length) {
+          let intMultiplier = parseInt(val);
 
-  var _h = _vm.$createElement;
+          if (isNaN(intMultiplier) || intMultiplier < 1) {
+            console.warn("ns-byte-slider: multiplier must be >= 1");
+            return false;
+          }
+        }
 
-  var _c = _vm._self._c || _h;
+        return true;
+      }
 
-  return _c('path', {
-    attrs: {
-      "id": "gear_2_",
-      "d": "M18.958,31.36h-5.915c-0.199,0-0.36-0.161-0.36-0.36v-3.633l-2.368-0.99l-2.576,2.575\n\tc-0.141,0.141-0.368,0.141-0.509,0L3.048,24.77c-0.141-0.141-0.141-0.369,0-0.51l2.568-2.568l-0.974-2.375H1\n\tc-0.199,0-0.36-0.161-0.36-0.36v-5.915c0-0.199,0.161-0.36,0.36-0.36h3.632l0.991-2.368L3.048,7.739\n\tc-0.141-0.141-0.141-0.368,0-0.509L7.23,3.048C7.298,2.98,7.389,2.942,7.485,2.942l0,0c0.096,0,0.187,0.038,0.254,0.105l2.568,2.569\n\tl2.375-0.975V1c0-0.199,0.161-0.36,0.36-0.36h5.915c0.199,0,0.36,0.161,0.36,0.36v3.632l2.367,0.991l2.575-2.575\n\tc0.141-0.141,0.369-0.141,0.51,0l4.183,4.182c0.067,0.067,0.105,0.159,0.105,0.254s-0.038,0.187-0.105,0.254l-2.569,2.568\n\tl0.975,2.375H31c0.199,0,0.36,0.161,0.36,0.36v5.915c0,0.199-0.161,0.36-0.36,0.36h-3.633l-0.99,2.368l2.576,2.575\n\tc0.067,0.067,0.105,0.159,0.105,0.255s-0.038,0.188-0.105,0.255l-4.183,4.182c-0.141,0.141-0.369,0.141-0.51,0l-2.568-2.568\n\tl-2.374,0.974V31C19.318,31.199,19.157,31.36,18.958,31.36z M13.403,30.64h5.195v-3.523c0-0.146,0.089-0.277,0.224-0.333\n\tl2.819-1.156c0.134-0.057,0.288-0.024,0.392,0.078l2.483,2.483l3.674-3.673l-2.492-2.491c-0.103-0.104-0.134-0.259-0.077-0.394\n\tl1.176-2.812c0.056-0.134,0.187-0.222,0.332-0.222h3.512v-5.194h-3.522c-0.146,0-0.277-0.088-0.333-0.223l-1.157-2.82\n\tc-0.055-0.134-0.024-0.289,0.078-0.391l2.484-2.483l-3.674-3.673l-2.491,2.491c-0.104,0.103-0.26,0.134-0.394,0.078L18.82,5.206\n\tc-0.134-0.056-0.222-0.187-0.222-0.332V1.36h-5.195v3.523c0,0.146-0.088,0.278-0.223,0.333l-2.82,1.157\n\tc-0.135,0.055-0.289,0.024-0.391-0.079L7.485,3.812L3.812,7.484l2.491,2.492c0.104,0.103,0.134,0.259,0.078,0.394l-1.177,2.812\n\tc-0.056,0.134-0.187,0.221-0.332,0.221H1.36v5.194h3.524c0.146,0,0.278,0.089,0.333,0.224l1.157,2.82\n\tc0.055,0.135,0.024,0.289-0.079,0.392l-2.483,2.483l3.673,3.673l2.492-2.491c0.103-0.104,0.26-0.133,0.393-0.077l2.812,1.176\n\tc0.134,0.056,0.221,0.187,0.221,0.332V30.64z M16,23.36c-4.058,0-7.36-3.302-7.36-7.36S11.942,8.64,16,8.64\n\tc4.059,0,7.36,3.302,7.36,7.36C23.36,20.059,20.059,23.36,16,23.36z M16,9.36c-3.661,0-6.64,2.979-6.64,6.64s2.979,6.64,6.64,6.64\n\ts6.64-2.979,6.64-6.64S19.661,9.36,16,9.36z"
+    },
+    value: String,
+    minLabel: String,
+    maxLabel: String,
+    showUnlimited: {
+      type: Boolean,
+      default: false
+    },
+    isUnlimited: {
+      type: Boolean,
+      default: false
+    },
+    byteUnit: {
+      type: String,
+      default: "gib"
+    },
+    unlimitedLabel: {
+      type: String,
+      default: "Unlimited"
+    },
+    showHumanReadableLabel: {
+      type: Boolean,
+      default: false
+    },
+    showMibGibToggle: {
+      type: Boolean,
+      default: false
+    },
+    tagKind: {
+      type: String,
+      default: "high-contrast"
+    },
+    invalidMessage: {
+      type: String,
+      default: ""
     }
-  });
-};
+  },
+  model: {
+    prop: "value",
+    event: "modelEvent"
+  },
 
-var __vue_staticRenderFns__$6 = [];
-/* style */
+  data() {
+    return {
+      internalValue: "",
+      animateClick: false,
+      isDragging: false,
+      dragStartX: 0,
+      dragStartValue: 0,
+      percentage: "0%",
+      internalUnlimited: false,
+      internalByteUnit: "gib",
+      isInvalid: false
+    };
+  },
 
-const __vue_inject_styles__$6 = undefined;
-/* scoped */
+  computed: {
+    labelId() {
+      return `${this.uid}-label`;
+    },
 
-const __vue_scope_id__$6 = undefined;
-/* module identifier */
+    internalMinLabel() {
+      return this.minLabel !== undefined ? this.minLabel : this.getMin();
+    },
 
-const __vue_module_identifier__$6 = undefined;
-/* functional template */
+    internalMaxLabel() {
+      return this.maxLabel !== undefined ? this.maxLabel : this.getMax();
+    },
 
-const __vue_is_functional_template__$6 = false;
-/* style inject */
+    internalMultiplier() {
+      let intMultiplier = parseInt(this.stepMultiplier); // default to 4 fro multiplier
 
-/* style inject SSR */
+      return isNaN(intMultiplier) ? 4 : Math.max(intMultiplier, 1);
+    },
+
+    humanReadableLabel() {
+      if (this.internalByteUnit === "gib") {
+        return this.gibFormat(this.internalValue);
+      } else {
+        // MiB
+        return this.mibFormat(this.internalValue);
+      }
+    }
+
+  },
+
+  created() {
+    this.internalUnlimited = this.isUnlimited;
+    this.internalByteUnit = this.byteUnit;
+  },
+
+  mounted() {
+    this.$refs.range.value = this.value;
+    this.internalValue = this.$refs.range.value;
+    this.percentage = `${(this.internalValue - this.getMin()) * 100 / (this.getMax() - this.getMin())}%`;
+    this.checkSlots();
+  },
+
+  updated() {
+    this.checkSlots();
+  },
+
+  watch: {
+    value(val) {
+      this.setValue(val);
+    },
+
+    min() {
+      this.$nextTick(() => {
+        this.setValue(this.internalValue);
+      });
+    },
+
+    max() {
+      this.$nextTick(() => {
+        this.setValue(this.internalValue);
+      });
+    },
+
+    step() {
+      this.$nextTick(() => {
+        this.setValue(this.internalValue);
+      });
+    },
+
+    isUnlimited() {
+      this.internalUnlimited = this.isUnlimited;
+    },
+
+    internalUnlimited() {
+      if (this.internalUnlimited) {
+        this.$emit("unlimited", true);
+      } else {
+        this.$emit("unlimited", false);
+      }
+    },
+
+    byteUnit() {
+      this.internalByteUnit = this.byteUnit;
+    },
+
+    internalByteUnit() {
+      this.$emit("byteUnit", this.internalByteUnit);
+    }
+
+  },
+  methods: {
+    // NOTE: It is not safe to rely on Numbers for non-integer steps
+    getMin() {
+      if (this.$refs.range) {
+        const val = parseFloat(this.$refs.range.min);
+        return isNaN(val) ? 0 : val;
+      }
+
+      return 0;
+    },
+
+    getMax() {
+      if (this.$refs.range) {
+        const val = parseFloat(this.$refs.range.max);
+        return isNaN(val) ? 100 : val;
+      }
+
+      return 100;
+    },
+
+    getValue() {
+      if (this.$refs.range) {
+        const val = parseFloat(this.$refs.range.value);
+        return isNaN(val) ? 0 : val;
+      }
+
+      return (this.getMax() + this.getMin()) / 2;
+    },
+
+    getStep() {
+      if (this.$refs.range) {
+        const val = parseFloat(this.$refs.range.step);
+        return isNaN(val) ? 0 : val;
+      }
+
+      return 1;
+    },
+
+    setValue(newValue) {
+      if (this.disabled) return;
+      this.$refs.range.value = newValue;
+      this.internalValue = this.$refs.range.value;
+      this.percentage = `${(this.internalValue - this.getMin()) * 100 / (this.getMax() - this.getMin())}%`;
+      this.$emit("modelEvent", this.$refs.range.value);
+      this.$emit("change", this.$refs.range.value);
+    },
+
+    onChange() {
+      let newValue = this.internalValue.length ? parseFloat(this.internalValue) : this.getMin();
+      this.setValue(newValue);
+    },
+
+    onStartDrag(ev) {
+      document.body.addEventListener("mousemove", this.onDrag);
+      document.body.addEventListener("mouseup", this.onStopDrag);
+      this.dragStartX = ev.clientX;
+      this.dragStartValue = this.getValue();
+      this.isDragging = true;
+    },
+
+    onDrag(ev) {
+      if (this.isDragging) {
+        // percentage change
+        let newValue = (ev.clientX - this.dragStartX) / this.$refs.track.offsetWidth; // uncapped new value
+
+        newValue = this.dragStartValue + (this.getMax() - this.getMin()) * newValue;
+        this.setValue(newValue, ev);
+      }
+    },
+
+    onStopDrag() {
+      this.isDragging = false;
+      document.body.removeEventListener("mousemove", this.onDrag);
+      document.body.removeEventListener("mouseup", this.onStopDrag);
+    },
+
+    onTrackClick(ev) {
+      const afterAnimate = ev => {
+        if (ev.propertyName === "left") {
+          this.animateClick = false;
+          this.$refs.thumb.removeEventListener("transitionend", afterAnimate);
+        }
+      };
+
+      let newValue = ev.offsetX / this.$refs.track.offsetWidth;
+      newValue = (this.getMax() - this.getMin()) * newValue + this.getMin();
+      this.$refs.thumb.addEventListener("transitionend", afterAnimate);
+      this.animateClick = true;
+      this.setValue(newValue, ev);
+    },
+
+    onUp(ev) {
+      let curValue = ev.target.type === "number" ? parseFloat(ev.target.value) : this.getValue();
+      let newValue = curValue + (ev.shiftKey ? this.internalMultiplier * this.getStep() : this.getStep());
+      this.setValue(newValue, ev);
+    },
+
+    onDown(ev) {
+      let curValue = ev.target.type === "number" ? parseFloat(ev.target.value) : this.getValue();
+      let newValue = curValue - (ev.shiftKey ? this.internalMultiplier * this.getStep() : this.getStep());
+      this.setValue(newValue, ev);
+    },
+
+    mibFormat(size) {
+      let result;
+
+      switch (true) {
+        case size === null || size === "" || isNaN(size):
+          result = "-";
+          break;
+
+        case size >= 0 && size < 1024:
+          result = size + " MiB";
+          break;
+
+        case size >= 1024 && size < Math.pow(1024, 2):
+          result = Math.round(size / 1024 * 100) / 100 + " GiB";
+          break;
+
+        default:
+          result = Math.round(size / Math.pow(1024, 2) * 100) / 100 + " TiB";
+      }
+
+      return result;
+    },
+
+    gibFormat(size) {
+      let result;
+
+      switch (true) {
+        case size === null || size === "" || isNaN(size):
+          result = "-";
+          break;
+
+        case size >= 0 && size < 1024:
+          result = size + " GiB";
+          break;
+
+        default:
+          result = Math.round(size / 1024 * 100) / 100 + " TiB";
+      }
+
+      return result;
+    },
+
+    checkSlots() {
+      // NOTE: this.$slots is not reactive so needs to be managed on updated
+      this.isInvalid = !!(this.$slots["invalid-message"] || this.invalidMessage && this.invalidMessage.length);
+    }
+
+  }
+};
+
+/* script */
+const __vue_script__$1 = script$1;
+/* template */
+
+var __vue_render__$7 = function () {
+  var _obj, _obj$1, _obj$2, _obj$3;
+
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('div', {
+    class: "ns-byte-slider cv-slider " + _vm.carbonPrefix + "--form-item"
+  }, [_c('div', {
+    staticClass: "wrapper",
+    attrs: {
+      "data-invalid": _vm.isInvalid
+    }
+  }, [_c('label', {
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: _vm.label,
+      expression: "label"
+    }],
+    class: [_vm.carbonPrefix + "--label", (_obj = {}, _obj[_vm.carbonPrefix + "--label--disabled"] = _vm.disabled, _obj)],
+    attrs: {
+      "for": _vm.uid,
+      "id": _vm.labelId
+    }
+  }, [_vm._v("\n      " + _vm._s(_vm.label) + "\n    ")]), _vm._v(" "), _vm.showUnlimited ? _c('NsCheckbox', {
+    staticClass: "is-unlimited",
+    attrs: {
+      "label": _vm.unlimitedLabel,
+      "disabled": _vm.disabled,
+      "value": "checkUnlimited"
+    },
+    model: {
+      value: _vm.internalUnlimited,
+      callback: function ($$v) {
+        _vm.internalUnlimited = $$v;
+      },
+      expression: "internalUnlimited"
+    }
+  }) : _vm._e(), _vm._v(" "), _c('div', {
+    class: _vm.carbonPrefix + "--slider-container"
+  }, [_vm.internalMinLabel ? _c('span', {
+    class: _vm.carbonPrefix + "--slider__range-label"
+  }, [_vm._v(_vm._s(_vm.internalMinLabel))]) : _vm._e(), _vm._v(" "), _c('div', {
+    class: [_vm.carbonPrefix + "--slider", (_obj$1 = {}, _obj$1[_vm.carbonPrefix + "--slider--disabled"] = _vm.disabled || _vm.internalUnlimited, _obj$1)],
+    attrs: {
+      "data-slider": "",
+      "data-slider-input-box": "#slider-input-box"
+    }
+  }, [_c('div', {
+    ref: "track",
+    class: _vm.carbonPrefix + "--slider__track",
+    on: {
+      "click": _vm.onTrackClick
+    }
+  }), _vm._v(" "), _c('div', {
+    class: _vm.carbonPrefix + "--slider__filled-track",
+    style: "width: " + _vm.percentage + ";"
+  }), _vm._v(" "), _c('div', {
+    ref: "thumb",
+    class: [_vm.carbonPrefix + "--slider__thumb", (_obj$2 = {}, _obj$2[_vm.carbonPrefix + "--slider__thumb--clicked"] = _vm.animateClick, _obj$2)],
+    style: "left: " + _vm.percentage + ";",
+    attrs: {
+      "tabindex": "0",
+      "aria-labelledby": _vm.labelId
+    },
+    on: {
+      "keydown": [function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "up", 38, $event.key, ["Up", "ArrowUp"]) && _vm._k($event.keyCode, "right", 39, $event.key, ["Right", "ArrowRight"])) {
+          return null;
+        }
+
+        if ('button' in $event && $event.button !== 2) {
+          return null;
+        }
+
+        $event.preventDefault();
+        return _vm.onUp.apply(null, arguments);
+      }, function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "down", 40, $event.key, ["Down", "ArrowDown"]) && _vm._k($event.keyCode, "left", 37, $event.key, ["Left", "ArrowLeft"])) {
+          return null;
+        }
+
+        if ('button' in $event && $event.button !== 0) {
+          return null;
+        }
+
+        $event.preventDefault();
+        return _vm.onDown.apply(null, arguments);
+      }],
+      "mousedown": _vm.onStartDrag
+    }
+  }), _vm._v(" "), _c('input', {
+    ref: "range",
+    class: _vm.carbonPrefix + "--slider__input",
+    attrs: {
+      "id": _vm.uid,
+      "type": "range",
+      "step": _vm.step,
+      "min": _vm.min,
+      "max": _vm.max
+    }
+  })]), _vm._v(" "), _vm.internalMaxLabel ? _c('span', {
+    class: _vm.carbonPrefix + "--slider__range-label"
+  }, [_vm._v(_vm._s(_vm.internalMaxLabel))]) : _vm._e(), _vm._v(" "), _c('input', {
+    directives: [{
+      name: "model",
+      rawName: "v-model",
+      value: _vm.internalValue,
+      expression: "internalValue"
+    }],
+    ref: "inputBox",
+    class: [_vm.carbonPrefix + "--text-input " + _vm.carbonPrefix + "--slider-text-input", (_obj$3 = {}, _obj$3[_vm.carbonPrefix + "--text-input--light"] = _vm.isLight, _obj$3[_vm.carbonPrefix + "--text-input--invalid"] = _vm.isInvalid, _obj$3[_vm.carbonPrefix + "--text-input--warning"] = _vm.isWarn, _obj$3),, 'range-input'],
+    attrs: {
+      "type": "number",
+      "placeholder": _vm.min,
+      "disabled": _vm.disabled || _vm.internalUnlimited
+    },
+    domProps: {
+      "value": _vm.internalValue
+    },
+    on: {
+      "change": _vm.onChange,
+      "keydown": [function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "up", 38, $event.key, ["Up", "ArrowUp"])) {
+          return null;
+        }
+
+        $event.preventDefault();
+        return _vm.onUp.apply(null, arguments);
+      }, function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "down", 40, $event.key, ["Down", "ArrowDown"])) {
+          return null;
+        }
+
+        $event.preventDefault();
+        return _vm.onDown.apply(null, arguments);
+      }],
+      "input": function ($event) {
+        if ($event.target.composing) {
+          return;
+        }
+
+        _vm.internalValue = $event.target.value;
+      }
+    }
+  }), _vm._v(" "), _vm.showMibGibToggle ? _c('cv-radio-group', {
+    staticClass: "mib-gib"
+  }, [_c('cv-radio-button', {
+    attrs: {
+      "name": "group-mib-gib",
+      "label": "MiB",
+      "value": "mib",
+      "disabled": _vm.disabled || _vm.internalUnlimited
+    },
+    model: {
+      value: _vm.internalByteUnit,
+      callback: function ($$v) {
+        _vm.internalByteUnit = $$v;
+      },
+      expression: "internalByteUnit"
+    }
+  }), _vm._v(" "), _c('cv-radio-button', {
+    attrs: {
+      "name": "group-mib-gib",
+      "label": "GiB",
+      "value": "gib",
+      "disabled": _vm.disabled || _vm.internalUnlimited
+    },
+    model: {
+      value: _vm.internalByteUnit,
+      callback: function ($$v) {
+        _vm.internalByteUnit = $$v;
+      },
+      expression: "internalByteUnit"
+    }
+  })], 1) : _vm._e()], 1), _vm._v(" "), _vm.showHumanReadableLabel && !_vm.internalUnlimited ? _c('NsTag', {
+    staticClass: "human-label",
+    attrs: {
+      "label": _vm.humanReadableLabel,
+      "kind": _vm.tagKind,
+      "disabled": _vm.disabled || _vm.internalUnlimited
+    }
+  }) : _vm._e()], 1), _vm._v(" "), _vm.isInvalid ? _c('div', {
+    class: _vm.carbonPrefix + "--form-requirement"
+  }, [_vm._t("invalid-message", function () {
+    return [_vm._v(_vm._s(_vm.invalidMessage))];
+  })], 2) : _vm._e()]);
+};
+
+var __vue_staticRenderFns__$7 = [];
+/* style */
+
+const __vue_inject_styles__$8 = function (inject) {
+  if (!inject) return;
+  inject("data-v-af193c20_0", {
+    source: ".is-unlimited[data-v-af193c20]{margin-top:.5rem!important;margin-bottom:.5rem!important}.range-input[data-v-af193c20]{margin-top:.5rem!important}.mib-gib[data-v-af193c20]{margin-left:1rem;margin-top:.5rem!important;margin-bottom:0!important}.human-label[data-v-af193c20]{margin-top:1rem}",
+    map: undefined,
+    media: undefined
+  }), inject("data-v-af193c20_1", {
+    source: ".ns-byte-slider .bx--slider-container{flex-wrap:wrap}.ns-byte-slider .bx--slider-text-input{width:5rem}.ns-byte-slider .wrapper[data-invalid]~.bx--form-requirement{display:block;overflow:visible;max-height:12.5rem;font-weight:400;color:#da1e28}",
+    map: undefined,
+    media: undefined
+  });
+};
+/* scoped */
+
+
+const __vue_scope_id__$8 = "data-v-af193c20";
+/* module identifier */
+
+const __vue_module_identifier__$8 = undefined;
+/* functional template */
+
+const __vue_is_functional_template__$8 = false;
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__$g = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$7,
+  staticRenderFns: __vue_staticRenderFns__$7
+}, __vue_inject_styles__$8, __vue_script__$1, __vue_scope_id__$8, __vue_is_functional_template__$8, __vue_module_identifier__$8, false, createInjector, undefined, undefined);
+
+var __vue_component__$h = __vue_component__$g;
+
+var script = {
+  name: "NsTabs",
+  extends: CvTabs,
+  methods: {
+    // extend method to fix error on beforeDestroy
+    doScrollIntoView(index) {
+      const tab = this.$refs.link[index]; // fix error on beforeDestroy
+
+      if (!tab) {
+        return;
+      }
+
+      const scrollContainer = tab.parentNode ? tab.parentNode.parentNode : null;
+      let newScrollLeft;
+
+      if (tab && scrollContainer) {
+        const scrollLeft = scrollContainer.scrollLeft;
+        const tabLeft = tab.offsetLeft - scrollContainer.offsetLeft;
+
+        if (index === 0) {
+          newScrollLeft = 0;
+        } else if (index === this.$refs.link.length - 1) {
+          newScrollLeft = scrollContainer.scrollWidth - scrollContainer.offsetWidth;
+        } else if (tabLeft < scrollLeft) {
+          newScrollLeft = tabLeft;
+        } else {
+          const rightOfTab = tab.offsetLeft - scrollContainer.offsetLeft + tab.offsetWidth;
+
+          if (rightOfTab > scrollContainer.offsetWidth + scrollLeft) {
+            newScrollLeft = rightOfTab - scrollContainer.offsetWidth;
+
+            if (!this.rightOverflowNavButtonHidden) {
+              newScrollLeft += this.OVERFLOW_BUTTON_OFFSET;
+            }
+          }
+        }
+      }
+
+      if (newScrollLeft !== undefined) {
+        this.skipScroll = true;
+        this.leftOverflowNavButtonHidden = newScrollLeft <= 0;
+        this.rightOverflowNavButtonHidden = newScrollLeft + this.$refs.tablist.clientWidth >= this.$refs.tablist.scrollWidth;
+        this.$nextTick(() => {
+          // allow left and right nav hide to propegate before setting scroll
+          scrollContainer.scrollLeft = newScrollLeft;
+          this.skipScroll = false;
+        });
+      }
+    }
+
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+/* template */
+
+/* style */
+
+const __vue_inject_styles__$7 = undefined;
+/* scoped */
+
+const __vue_scope_id__$7 = undefined;
+/* module identifier */
+
+const __vue_module_identifier__$7 = undefined;
+/* functional template */
+
+const __vue_is_functional_template__$7 = undefined;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__$e = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$7, __vue_script__, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, false, undefined, undefined, undefined);
+
+var __vue_component__$f = __vue_component__$e;
+
+/* script */
+
+/* template */
+var __vue_render__$6 = function () {
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('path', {
+    attrs: {
+      "id": "gear_2_",
+      "d": "M18.958,31.36h-5.915c-0.199,0-0.36-0.161-0.36-0.36v-3.633l-2.368-0.99l-2.576,2.575\n\tc-0.141,0.141-0.368,0.141-0.509,0L3.048,24.77c-0.141-0.141-0.141-0.369,0-0.51l2.568-2.568l-0.974-2.375H1\n\tc-0.199,0-0.36-0.161-0.36-0.36v-5.915c0-0.199,0.161-0.36,0.36-0.36h3.632l0.991-2.368L3.048,7.739\n\tc-0.141-0.141-0.141-0.368,0-0.509L7.23,3.048C7.298,2.98,7.389,2.942,7.485,2.942l0,0c0.096,0,0.187,0.038,0.254,0.105l2.568,2.569\n\tl2.375-0.975V1c0-0.199,0.161-0.36,0.36-0.36h5.915c0.199,0,0.36,0.161,0.36,0.36v3.632l2.367,0.991l2.575-2.575\n\tc0.141-0.141,0.369-0.141,0.51,0l4.183,4.182c0.067,0.067,0.105,0.159,0.105,0.254s-0.038,0.187-0.105,0.254l-2.569,2.568\n\tl0.975,2.375H31c0.199,0,0.36,0.161,0.36,0.36v5.915c0,0.199-0.161,0.36-0.36,0.36h-3.633l-0.99,2.368l2.576,2.575\n\tc0.067,0.067,0.105,0.159,0.105,0.255s-0.038,0.188-0.105,0.255l-4.183,4.182c-0.141,0.141-0.369,0.141-0.51,0l-2.568-2.568\n\tl-2.374,0.974V31C19.318,31.199,19.157,31.36,18.958,31.36z M13.403,30.64h5.195v-3.523c0-0.146,0.089-0.277,0.224-0.333\n\tl2.819-1.156c0.134-0.057,0.288-0.024,0.392,0.078l2.483,2.483l3.674-3.673l-2.492-2.491c-0.103-0.104-0.134-0.259-0.077-0.394\n\tl1.176-2.812c0.056-0.134,0.187-0.222,0.332-0.222h3.512v-5.194h-3.522c-0.146,0-0.277-0.088-0.333-0.223l-1.157-2.82\n\tc-0.055-0.134-0.024-0.289,0.078-0.391l2.484-2.483l-3.674-3.673l-2.491,2.491c-0.104,0.103-0.26,0.134-0.394,0.078L18.82,5.206\n\tc-0.134-0.056-0.222-0.187-0.222-0.332V1.36h-5.195v3.523c0,0.146-0.088,0.278-0.223,0.333l-2.82,1.157\n\tc-0.135,0.055-0.289,0.024-0.391-0.079L7.485,3.812L3.812,7.484l2.491,2.492c0.104,0.103,0.134,0.259,0.078,0.394l-1.177,2.812\n\tc-0.056,0.134-0.187,0.221-0.332,0.221H1.36v5.194h3.524c0.146,0,0.278,0.089,0.333,0.224l1.157,2.82\n\tc0.055,0.135,0.024,0.289-0.079,0.392l-2.483,2.483l3.673,3.673l2.492-2.491c0.103-0.104,0.26-0.133,0.393-0.077l2.812,1.176\n\tc0.134,0.056,0.221,0.187,0.221,0.332V30.64z M16,23.36c-4.058,0-7.36-3.302-7.36-7.36S11.942,8.64,16,8.64\n\tc4.059,0,7.36,3.302,7.36,7.36C23.36,20.059,20.059,23.36,16,23.36z M16,9.36c-3.661,0-6.64,2.979-6.64,6.64s2.979,6.64,6.64,6.64\n\ts6.64-2.979,6.64-6.64S19.661,9.36,16,9.36z"
+    }
+  });
+};
+
+var __vue_staticRenderFns__$6 = [];
+/* style */
+
+const __vue_inject_styles__$6 = undefined;
+/* scoped */
+
+const __vue_scope_id__$6 = undefined;
+/* module identifier */
+
+const __vue_module_identifier__$6 = undefined;
+/* functional template */
+
+const __vue_is_functional_template__$6 = false;
+/* style inject */
+
+/* style inject SSR */
 
 /* style inject shadow dom */
 
@@ -22892,7 +23577,7 @@ var pageTitle = {
 
 var filters = {
   byteFormat: function (size) {
-    var result;
+    let result;
 
     switch (true) {
       case size === null || size === "" || isNaN(size):
@@ -22904,25 +23589,25 @@ var filters = {
         break;
 
       case size >= 1024 && size < Math.pow(1024, 2):
-        result = Math.round(size / 1024 * 100) / 100 + " KB";
+        result = Math.round(size / 1024 * 100) / 100 + " KiB";
         break;
 
       case size >= Math.pow(1024, 2) && size < Math.pow(1024, 3):
-        result = Math.round(size / Math.pow(1024, 2) * 100) / 100 + " MB";
+        result = Math.round(size / Math.pow(1024, 2) * 100) / 100 + " MiB";
         break;
 
       case size >= Math.pow(1024, 3) && size < Math.pow(1024, 4):
-        result = Math.round(size / Math.pow(1024, 3) * 100) / 100 + " GB";
+        result = Math.round(size / Math.pow(1024, 3) * 100) / 100 + " GiB";
         break;
 
       default:
-        result = Math.round(size / Math.pow(1024, 4) * 100) / 100 + " TB";
+        result = Math.round(size / Math.pow(1024, 4) * 100) / 100 + " TiB";
     }
 
     return result;
   },
   humanFormat: function (number, decimals = false) {
-    var result;
+    let result;
 
     switch (true) {
       case number === null || number === "" || isNaN(number):
@@ -22971,6 +23656,49 @@ var filters = {
 
     return result;
   },
+
+  mibFormat(size) {
+    let result;
+
+    switch (true) {
+      case size === null || size === "" || isNaN(size):
+        result = "-";
+        break;
+
+      case size >= 0 && size < 1024:
+        result = size + " MiB";
+        break;
+
+      case size >= 1024 && size < Math.pow(1024, 2):
+        result = Math.round(size / 1024 * 100) / 100 + " GiB";
+        break;
+
+      default:
+        result = Math.round(size / Math.pow(1024, 2) * 100) / 100 + " TiB";
+    }
+
+    return result;
+  },
+
+  gibFormat(size) {
+    let result;
+
+    switch (true) {
+      case size === null || size === "" || isNaN(size):
+        result = "-";
+        break;
+
+      case size >= 0 && size < 1024:
+        result = size + " GiB";
+        break;
+
+      default:
+        result = Math.round(size / 1024 * 100) / 100 + " TiB";
+    }
+
+    return result;
+  },
+
   secondsFormat: function (value) {
     if (value < 0) {
       return "-";
@@ -23019,39 +23747,41 @@ var filters = {
 var components = /*#__PURE__*/Object.freeze({
   __proto__: null,
   NsButton: NsButton,
-  NsEmptyState: __vue_component__$14,
+  NsEmptyState: __vue_component__$18,
   NsPictogram: NsPictogram,
-  NsCodeSnippet: __vue_component__$12,
+  NsCodeSnippet: __vue_component__$16,
   NsInlineNotification: NsInlineNotification,
   NsProgressBar: NsProgressBar,
   NsSvg: NsSvg,
-  NsTile: __vue_component__$Y,
-  NsToastNotification: __vue_component__$W,
-  NsInfoCard: __vue_component__$U,
-  NsStatusCard: __vue_component__$S,
-  NsSystemdServiceCard: __vue_component__$Q,
-  NsPasswordInput: __vue_component__$N,
-  NsIconMenu: __vue_component__$L,
-  NsMeterChart: __vue_component__$J,
+  NsTile: __vue_component__$10,
+  NsToastNotification: __vue_component__$_,
+  NsInfoCard: __vue_component__$Y,
+  NsStatusCard: __vue_component__$W,
+  NsSystemdServiceCard: __vue_component__$U,
+  NsPasswordInput: __vue_component__$R,
+  NsIconMenu: __vue_component__$P,
+  NsMeterChart: __vue_component__$N,
   NsLottieAnimation: NsLottieAnimation,
-  NsDangerDeleteModal: __vue_component__$G,
+  NsDangerDeleteModal: __vue_component__$K,
   NsCircleTimer: NsCircleTimer,
-  NsDropdownAction: __vue_component__$E,
+  NsDropdownAction: __vue_component__$I,
   NsTextInput: NsTextInput,
-  NsBackupCard: __vue_component__$B,
-  NsWizard: __vue_component__$z,
-  NsMenuItem: __vue_component__$x,
-  NsMenuDivider: __vue_component__$v,
-  NsSystemLogsCard: __vue_component__$t,
+  NsBackupCard: __vue_component__$F,
+  NsWizard: __vue_component__$D,
+  NsMenuItem: __vue_component__$B,
+  NsMenuDivider: __vue_component__$z,
+  NsSystemLogsCard: __vue_component__$x,
   NsModal: NsModal,
-  NsTimePicker: __vue_component__$r,
-  NsDataTable: __vue_component__$o,
+  NsTimePicker: __vue_component__$v,
+  NsDataTable: __vue_component__$s,
   NsPagination: NsPagination,
-  NsToggle: __vue_component__$m,
+  NsToggle: __vue_component__$q,
   NsTag: NsTag,
-  NsMultiSelect: __vue_component__$j,
-  NsComboBox: __vue_component__$h,
-  NsCheckbox: __vue_component__$f,
+  NsMultiSelect: __vue_component__$n,
+  NsComboBox: __vue_component__$l,
+  NsCheckbox: __vue_component__$j,
+  NsByteSlider: __vue_component__$h,
+  NsTabs: __vue_component__$f,
   ExclamationMarkPictogram: ExclamationMarkPictogram,
   GearPictogram: __vue_component__$d,
   LovePictogram: __vue_component__$b,
@@ -23079,4 +23809,4 @@ const install = function installNs8UiLib(Vue) {
   });
 }; // Create module definition for Vue.use()
 
-export { __vue_component__$7 as BulldozerPictogram, DateTimeService, ExclamationMarkPictogram, filters as Filters, __vue_component__$d as GearPictogram, __vue_component__$5 as GroupPictogram, __vue_component__$3 as HardDrivePictogram, IconService, LottieService, __vue_component__$b as LovePictogram, __vue_component__$B as NsBackupCard, NsButton, __vue_component__$f as NsCheckbox, NsCircleTimer, __vue_component__$12 as NsCodeSnippet, __vue_component__$h as NsComboBox, __vue_component__$G as NsDangerDeleteModal, __vue_component__$o as NsDataTable, __vue_component__$E as NsDropdownAction, __vue_component__$14 as NsEmptyState, __vue_component__$L as NsIconMenu, __vue_component__$U as NsInfoCard, NsInlineNotification, NsLottieAnimation, __vue_component__$v as NsMenuDivider, __vue_component__$x as NsMenuItem, __vue_component__$J as NsMeterChart, NsModal, __vue_component__$j as NsMultiSelect, NsPagination, __vue_component__$N as NsPasswordInput, NsPictogram, NsProgressBar, __vue_component__$S as NsStatusCard, NsSvg, __vue_component__$t as NsSystemLogsCard, __vue_component__$Q as NsSystemdServiceCard, NsTag, NsTextInput, __vue_component__$Y as NsTile, __vue_component__$r as NsTimePicker, __vue_component__$W as NsToastNotification, __vue_component__$m as NsToggle, __vue_component__$z as NsWizard, pageTitle as PageTitleService, queryParam as QueryParamService, StorageService, task as TaskService, __vue_component__$1 as UserPictogram, UtilService, __vue_component__$9 as WarningPictogram, install as default };
+export { __vue_component__$7 as BulldozerPictogram, DateTimeService, ExclamationMarkPictogram, filters as Filters, __vue_component__$d as GearPictogram, __vue_component__$5 as GroupPictogram, __vue_component__$3 as HardDrivePictogram, IconService, LottieService, __vue_component__$b as LovePictogram, __vue_component__$F as NsBackupCard, NsButton, __vue_component__$h as NsByteSlider, __vue_component__$j as NsCheckbox, NsCircleTimer, __vue_component__$16 as NsCodeSnippet, __vue_component__$l as NsComboBox, __vue_component__$K as NsDangerDeleteModal, __vue_component__$s as NsDataTable, __vue_component__$I as NsDropdownAction, __vue_component__$18 as NsEmptyState, __vue_component__$P as NsIconMenu, __vue_component__$Y as NsInfoCard, NsInlineNotification, NsLottieAnimation, __vue_component__$z as NsMenuDivider, __vue_component__$B as NsMenuItem, __vue_component__$N as NsMeterChart, NsModal, __vue_component__$n as NsMultiSelect, NsPagination, __vue_component__$R as NsPasswordInput, NsPictogram, NsProgressBar, __vue_component__$W as NsStatusCard, NsSvg, __vue_component__$x as NsSystemLogsCard, __vue_component__$U as NsSystemdServiceCard, __vue_component__$f as NsTabs, NsTag, NsTextInput, __vue_component__$10 as NsTile, __vue_component__$v as NsTimePicker, __vue_component__$_ as NsToastNotification, __vue_component__$q as NsToggle, __vue_component__$D as NsWizard, pageTitle as PageTitleService, queryParam as QueryParamService, StorageService, task as TaskService, __vue_component__$1 as UserPictogram, UtilService, __vue_component__$9 as WarningPictogram, install as default };