npm - @nethserver/ns8-ui-lib - Versions diffs - 0.0.98 → 0.1.1 - Mend

@nethserver/ns8-ui-lib 0.0.98 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/ns8-ui-lib.esm.js +1410 -497
package/dist/ns8-ui-lib.min.js +1 -1
package/dist/ns8-ui-lib.ssr.js +1188 -522
package/package.json +1 -1
package/src/lib-components/NsCheckbox.vue +113 -0
package/src/lib-components/NsComboBox.vue +579 -0
package/src/lib-components/NsDataTable.vue +12 -3
package/src/lib-components/NsMultiSelect.vue +63 -2
package/src/lib-components/NsTag.vue +1 -0
package/src/lib-components/NsTextInput.vue +8 -6

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

@@ -55,6 +55,8 @@ import Star20 from '@carbon/icons-vue/es/star/20';
 import Checkmark20 from '@carbon/icons-vue/es/checkmark/20';
 import ZoomIn20 from '@carbon/icons-vue/es/zoom--in/20';
 import Events32 from '@carbon/icons-vue/es/events/32';
+import Events20 from '@carbon/icons-vue/es/events/20';
+import Events16 from '@carbon/icons-vue/es/events/16';
 import Link20 from '@carbon/icons-vue/es/link/20';
 import Link32 from '@carbon/icons-vue/es/link/32';
 import WarningAlt32 from '@carbon/icons-vue/es/warning--alt/32';
@@ -104,8 +106,24 @@ import Firewall20 from '@carbon/icons-vue/es/firewall/20';
 import Firewall32 from '@carbon/icons-vue/es/firewall/32';
 import Wikis32 from '@carbon/icons-vue/es/wikis/32';
 import Wikis20 from '@carbon/icons-vue/es/wikis/20';
+import Wikis16 from '@carbon/icons-vue/es/wikis/16';
 import At32 from '@carbon/icons-vue/es/at/32';
 import At20 from '@carbon/icons-vue/es/at/20';
+import User16 from '@carbon/icons-vue/es/user/16';
+import User20 from '@carbon/icons-vue/es/user/20';
+import User32 from '@carbon/icons-vue/es/user/32';
+import Unknown16 from '@carbon/icons-vue/es/unknown/16';
+import Unknown20 from '@carbon/icons-vue/es/unknown/20';
+import Unknown32 from '@carbon/icons-vue/es/unknown/32';
+import Email16 from '@carbon/icons-vue/es/email/16';
+import Email20 from '@carbon/icons-vue/es/email/20';
+import Email32 from '@carbon/icons-vue/es/email/32';
+import Locked16 from '@carbon/icons-vue/es/locked/16';
+import Locked20 from '@carbon/icons-vue/es/locked/20';
+import Locked32 from '@carbon/icons-vue/es/locked/32';
+import Folder16 from '@carbon/icons-vue/es/folder/16';
+import Folder20 from '@carbon/icons-vue/es/folder/20';
+import Folder32 from '@carbon/icons-vue/es/folder/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';
@@ -114,7 +132,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$w = {
+var script$y = {
   name: "NsButton",
   extends: CvButton,
   props: {
@@ -277,10 +295,10 @@ function addStyle(id, css) {
 }
 /* script */
-const __vue_script__$w = script$w;
+const __vue_script__$y = script$y;
 /* template */
-var __vue_render__$C = function () {
+var __vue_render__$E = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -303,10 +321,10 @@ var __vue_render__$C = function () {
   }) : _vm._e()], 2);
 };
-var __vue_staticRenderFns__$C = [];
+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-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)}}",
@@ -317,23 +335,23 @@ const __vue_inject_styles__$E = function (inject) {
 /* scoped */
-const __vue_scope_id__$E = "data-v-025b0f12";
+const __vue_scope_id__$G = "data-v-025b0f12";
 /* 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__$14 = /*#__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, createInjector, undefined, undefined);
+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);
-var NsButton = __vue_component__$14;
+var NsButton = __vue_component__$18;
 //
 //
@@ -351,7 +369,7 @@ var NsButton = __vue_component__$14;
 //
 //
 //
-var script$v = {
+var script$x = {
   name: "NsPictogram",
   props: {
     title: {
@@ -374,10 +392,10 @@ var script$v = {
 };
 /* script */
-const __vue_script__$v = script$v;
+const __vue_script__$x = script$x;
 /* template */
-var __vue_render__$B = function () {
+var __vue_render__$D = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -405,34 +423,34 @@ var __vue_render__$B = function () {
   }, [_vm._t("default")], 2)]);
 };
-var __vue_staticRenderFns__$B = [];
+var __vue_staticRenderFns__$D = [];
 /* 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__$13 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$B,
-  staticRenderFns: __vue_staticRenderFns__$B
-}, __vue_inject_styles__$D, __vue_script__$v, __vue_scope_id__$D, __vue_is_functional_template__$D, __vue_module_identifier__$D, false, undefined, undefined, undefined);
+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);
-var NsPictogram = __vue_component__$13;
+var NsPictogram = __vue_component__$17;
 //
-var script$u = {
+var script$w = {
   name: "NsLottieAnimation",
   components: {
     LottieAnimation
@@ -488,10 +506,10 @@ var script$u = {
 };
 /* script */
-const __vue_script__$u = script$u;
+const __vue_script__$w = script$w;
 /* template */
-var __vue_render__$A = function () {
+var __vue_render__$C = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -518,36 +536,36 @@ var __vue_render__$A = function () {
   })], 1);
 };
-var __vue_staticRenderFns__$A = [];
+var __vue_staticRenderFns__$C = [];
 /* style */
-const __vue_inject_styles__$C = undefined;
+const __vue_inject_styles__$E = undefined;
 /* scoped */
-const __vue_scope_id__$C = "data-v-14e97a70";
+const __vue_scope_id__$E = "data-v-14e97a70";
 /* 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__$12 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$A,
-  staticRenderFns: __vue_staticRenderFns__$A
-}, __vue_inject_styles__$C, __vue_script__$u, __vue_scope_id__$C, __vue_is_functional_template__$C, __vue_module_identifier__$C, false, undefined, undefined, undefined);
+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);
-var NsLottieAnimation = __vue_component__$12;
+var NsLottieAnimation = __vue_component__$16;
 /* script */
 /* template */
-var __vue_render__$z = function () {
+var __vue_render__$B = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -562,34 +580,34 @@ var __vue_render__$z = function () {
   });
 };
-var __vue_staticRenderFns__$z = [];
+var __vue_staticRenderFns__$B = [];
 /* style */
-const __vue_inject_styles__$B = undefined;
+const __vue_inject_styles__$D = undefined;
 /* scoped */
-const __vue_scope_id__$B = undefined;
+const __vue_scope_id__$D = undefined;
 /* 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 */
 /* 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_scope_id__$B, __vue_is_functional_template__$B, __vue_module_identifier__$B, false, undefined, undefined, undefined);
+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);
-var ExclamationMarkPictogram = __vue_component__$11;
+var ExclamationMarkPictogram = __vue_component__$15;
 //
-var script$t = {
+var script$v = {
   name: "NsEmptyState",
   components: {
     NsPictogram,
@@ -621,10 +639,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__$A = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -654,10 +672,10 @@ var __vue_render__$y = function () {
   }, [_vm._t("description")], 2)] : _vm._e()], 2);
 };
-var __vue_staticRenderFns__$y = [];
+var __vue_staticRenderFns__$A = [];
 /* style */
-const __vue_inject_styles__$A = function (inject) {
+const __vue_inject_styles__$C = 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}",
@@ -668,26 +686,26 @@ const __vue_inject_styles__$A = function (inject) {
 /* scoped */
-const __vue_scope_id__$A = "data-v-2d5d3a58";
+const __vue_scope_id__$C = "data-v-2d5d3a58";
 /* 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__$$ = /*#__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__$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);
-var __vue_component__$10 = __vue_component__$$;
+var __vue_component__$14 = __vue_component__$13;
 //
-var script$s = {
+var script$u = {
   name: "NsCodeSnippet",
   components: {
     CvButton,
@@ -799,10 +817,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__$z = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -864,10 +882,10 @@ var __vue_render__$x = function () {
   })], 1) : _vm._e()], 1);
 };
-var __vue_staticRenderFns__$x = [];
+var __vue_staticRenderFns__$z = [];
 /* style */
-const __vue_inject_styles__$z = function (inject) {
+const __vue_inject_styles__$B = 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}",
@@ -878,23 +896,23 @@ const __vue_inject_styles__$z = function (inject) {
 /* scoped */
-const __vue_scope_id__$z = "data-v-59cb538c";
+const __vue_scope_id__$B = "data-v-59cb538c";
 /* 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__$Z = /*#__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__$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);
-var __vue_component__$_ = __vue_component__$Z;
+var __vue_component__$12 = __vue_component__$11;
 //
 //
@@ -925,7 +943,7 @@ var __vue_component__$_ = __vue_component__$Z;
 //
 //
 //
-var script$r = {
+var script$t = {
   name: "NsCircleTimer",
   props: {
     timeLimit: {
@@ -989,10 +1007,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__$y = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -1028,10 +1046,10 @@ var __vue_render__$w = function () {
   })])])]);
 };
-var __vue_staticRenderFns__$w = [];
+var __vue_staticRenderFns__$y = [];
 /* style */
-const __vue_inject_styles__$y = function (inject) {
+const __vue_inject_styles__$A = 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)}",
@@ -1042,26 +1060,26 @@ const __vue_inject_styles__$y = function (inject) {
 /* scoped */
-const __vue_scope_id__$y = "data-v-79cb7082";
+const __vue_scope_id__$A = "data-v-79cb7082";
 /* 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__$Y = /*#__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__$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);
-var NsCircleTimer = __vue_component__$Y;
+var NsCircleTimer = __vue_component__$10;
 //
-var script$q = {
+var script$s = {
   name: "NsInlineNotification",
   extends: CvInlineNotification,
   components: {
@@ -1098,10 +1116,10 @@ var script$q = {
 };
 /* script */
-const __vue_script__$q = script$q;
+const __vue_script__$s = script$s;
 /* template */
-var __vue_render__$v = function () {
+var __vue_render__$x = function () {
   var _obj;
   var _vm = this;
@@ -1172,10 +1190,10 @@ var __vue_render__$v = function () {
   })], 1) : _vm._e()]);
 };
-var __vue_staticRenderFns__$v = [];
+var __vue_staticRenderFns__$x = [];
 /* style */
-const __vue_inject_styles__$x = function (inject) {
+const __vue_inject_styles__$z = 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}",
@@ -1186,23 +1204,23 @@ const __vue_inject_styles__$x = function (inject) {
 /* scoped */
-const __vue_scope_id__$x = "data-v-6b979488";
+const __vue_scope_id__$z = "data-v-6b979488";
 /* module identifier */
-const __vue_module_identifier__$x = undefined;
+const __vue_module_identifier__$z = undefined;
 /* functional template */
-const __vue_is_functional_template__$x = false;
+const __vue_is_functional_template__$z = 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__$x, __vue_script__$q, __vue_scope_id__$x, __vue_is_functional_template__$x, __vue_module_identifier__$x, false, createInjector, undefined, undefined);
+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);
-var NsInlineNotification = __vue_component__$X;
+var NsInlineNotification = __vue_component__$$;
 //
 //
@@ -1241,7 +1259,7 @@ var NsInlineNotification = __vue_component__$X;
 //
 //
 //
-var script$p = {
+var script$r = {
   name: "NsProgressBar",
   props: {
     value: {
@@ -1315,10 +1333,10 @@ var script$p = {
 };
 /* script */
-const __vue_script__$p = script$p;
+const __vue_script__$r = script$r;
 /* template */
-var __vue_render__$u = function () {
+var __vue_render__$w = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -1357,10 +1375,10 @@ var __vue_render__$u = function () {
   })]], 2)]);
 };
-var __vue_staticRenderFns__$u = [];
+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-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%}}",
@@ -1371,25 +1389,25 @@ const __vue_inject_styles__$w = function (inject) {
 /* scoped */
-const __vue_scope_id__$w = "data-v-7c7ba0aa";
+const __vue_scope_id__$y = "data-v-7c7ba0aa";
 /* 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__$W = /*#__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);
+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 NsProgressBar = __vue_component__$W;
+var NsProgressBar = __vue_component__$_;
-var script$o = {
+var script$q = {
   name: "NsSvg",
   props: {
     svg: {
@@ -1448,33 +1466,33 @@ var script$o = {
 };
 /* script */
-const __vue_script__$o = script$o;
+const __vue_script__$q = script$q;
 /* template */
 /* style */
-const __vue_inject_styles__$v = undefined;
+const __vue_inject_styles__$x = undefined;
 /* scoped */
-const __vue_scope_id__$v = undefined;
+const __vue_scope_id__$x = undefined;
 /* module identifier */
-const __vue_module_identifier__$v = undefined;
+const __vue_module_identifier__$x = undefined;
 /* functional template */
-const __vue_is_functional_template__$v = undefined;
+const __vue_is_functional_template__$x = undefined;
 /* style inject */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$V = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$v, __vue_script__$o, __vue_scope_id__$v, __vue_is_functional_template__$v, __vue_module_identifier__$v, false, undefined, undefined, undefined);
+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);
-var NsSvg = __vue_component__$V;
+var NsSvg = __vue_component__$Z;
 //
-var script$n = {
+var script$p = {
   name: "NsTile",
   extends: CvTile,
   inheritAttrs: false,
@@ -1548,10 +1566,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__$v = function () {
   var _obj;
   var _vm = this;
@@ -1590,10 +1608,10 @@ var __vue_render__$t = function () {
   }) : _vm._e()], 1);
 };
-var __vue_staticRenderFns__$t = [];
+var __vue_staticRenderFns__$v = [];
 /* style */
-const __vue_inject_styles__$u = function (inject) {
+const __vue_inject_styles__$w = 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}",
@@ -1604,23 +1622,23 @@ const __vue_inject_styles__$u = function (inject) {
 /* scoped */
-const __vue_scope_id__$u = "data-v-443a91f0";
+const __vue_scope_id__$w = "data-v-443a91f0";
 /* 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__$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);
-var __vue_component__$U = __vue_component__$T;
+var __vue_component__$Y = __vue_component__$X;
 function toInteger(dirtyNumber) {
   if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
@@ -6217,7 +6235,7 @@ var DateTimeService = {
 };
 //
-var script$m = {
+var script$o = {
   name: "NsToastNotification",
   extends: CvToastNotification,
   components: {
@@ -6295,10 +6313,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__$u = function () {
   var _obj;
   var _vm = this;
@@ -6396,10 +6414,10 @@ var __vue_render__$s = function () {
   })], 1) : _vm._e()], 1)]);
 };
-var __vue_staticRenderFns__$s = [];
+var __vue_staticRenderFns__$u = [];
 /* style */
-const __vue_inject_styles__$t = function (inject) {
+const __vue_inject_styles__$v = 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}",
@@ -6414,26 +6432,26 @@ const __vue_inject_styles__$t = function (inject) {
 /* scoped */
-const __vue_scope_id__$t = "data-v-6ff0b515";
+const __vue_scope_id__$v = "data-v-6ff0b515";
 /* 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__$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);
-var __vue_component__$S = __vue_component__$R;
+var __vue_component__$W = __vue_component__$V;
 //
-var script$l = {
+var script$n = {
   name: "NsInfoCard",
   components: {
     NsSvg,
@@ -6484,10 +6502,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__$t = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -6544,10 +6562,10 @@ var __vue_render__$r = function () {
   }, [_vm.hasContentSlot ? _vm._t("content") : _vm._e()], 2)], 2);
 };
-var __vue_staticRenderFns__$r = [];
+var __vue_staticRenderFns__$t = [];
 /* style */
-const __vue_inject_styles__$s = function (inject) {
+const __vue_inject_styles__$u = 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}",
@@ -6558,26 +6576,26 @@ const __vue_inject_styles__$s = function (inject) {
 /* scoped */
-const __vue_scope_id__$s = "data-v-aefc1c3e";
+const __vue_scope_id__$u = "data-v-aefc1c3e";
 /* 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__$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);
-var __vue_component__$Q = __vue_component__$P;
+var __vue_component__$U = __vue_component__$T;
 //
-var script$k = {
+var script$m = {
   name: "NsStatusCard",
   //components added for storybook to work
   components: {
@@ -6624,10 +6642,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__$s = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -6696,10 +6714,10 @@ var __vue_render__$q = function () {
   }, [_c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])]) : _c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])], 1) : _vm._e()])]);
 };
-var __vue_staticRenderFns__$q = [];
+var __vue_staticRenderFns__$s = [];
 /* style */
-const __vue_inject_styles__$r = function (inject) {
+const __vue_inject_styles__$t = 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}",
@@ -6710,26 +6728,26 @@ const __vue_inject_styles__$r = function (inject) {
 /* scoped */
-const __vue_scope_id__$r = "data-v-496044f0";
+const __vue_scope_id__$t = "data-v-496044f0";
 /* 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__$N = /*#__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__$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);
-var __vue_component__$O = __vue_component__$N;
+var __vue_component__$S = __vue_component__$R;
 //
-var script$j = {
+var script$l = {
   name: "NsSystemdServiceCard",
   //components added for storybook to work
   components: {
@@ -6783,10 +6801,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__$r = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -6841,10 +6859,10 @@ var __vue_render__$p = function () {
   })], 1)])]);
 };
-var __vue_staticRenderFns__$p = [];
+var __vue_staticRenderFns__$r = [];
 /* style */
-const __vue_inject_styles__$q = function (inject) {
+const __vue_inject_styles__$s = 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}",
@@ -6855,26 +6873,26 @@ const __vue_inject_styles__$q = function (inject) {
 /* scoped */
-const __vue_scope_id__$q = "data-v-bf751eca";
+const __vue_scope_id__$s = "data-v-bf751eca";
 /* 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__$L = /*#__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__$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);
-var __vue_component__$M = __vue_component__$L;
+var __vue_component__$Q = __vue_component__$P;
 //
-var script$i = {
+var script$k = {
   name: "NsTextInput",
   extends: CvTextInput,
   components: {
@@ -6929,10 +6947,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__$q = function () {
   var _obj, _obj$1, _obj$2, _obj$3, _obj$4;
   var _vm = this;
@@ -6948,8 +6966,10 @@ var __vue_render__$o = function () {
     attrs: {
       "for": _vm.uid
     }
-  }, [_c('div', [_vm._v("\n        " + _vm._s(_vm.label) + "\n        "), _vm._v(" "), _vm.hasTooltipSlot ? _c('cv-interactive-tooltip', {
-    staticClass: "tooltip info",
+  }, [_c('div', {
+    staticClass: "label-with-tooltip"
+  }, [_c('span', [_vm._v("\n          " + _vm._s(_vm.label) + "\n        ")]), _vm._v(" "), _vm.hasTooltipSlot ? _c('cv-interactive-tooltip', {
+    staticClass: "info",
     attrs: {
       "alignment": _vm.tooltipAlignment,
       "direction": _vm.tooltipDirection
@@ -7009,16 +7029,16 @@ var __vue_render__$o = function () {
   })], 2) : _vm._e()]);
 };
-var __vue_staticRenderFns__$o = [];
+var __vue_staticRenderFns__$q = [];
 /* style */
-const __vue_inject_styles__$p = function (inject) {
+const __vue_inject_styles__$r = function (inject) {
   if (!inject) return;
-  inject("data-v-38d70818_0", {
-    source: ".tooltip[data-v-38d70818]{display:inline-block;position:absolute}.prefix[data-v-38d70818]{font-weight:700;margin-right:.5rem;color:#525252}.align-items-center[data-v-38d70818]{align-items:center}",
+  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}",
     map: undefined,
     media: undefined
-  }), inject("data-v-38d70818_1", {
+  }), inject("data-v-11b039d1_1", {
     source: ".ns-text-input .bx--tooltip__label .bx--tooltip__trigger{margin-left:.25rem}",
     map: undefined,
     media: undefined
@@ -7027,23 +7047,23 @@ const __vue_inject_styles__$p = function (inject) {
 /* scoped */
-const __vue_scope_id__$p = "data-v-38d70818";
+const __vue_scope_id__$r = "data-v-11b039d1";
 /* 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__$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);
-var NsTextInput = __vue_component__$K;
+var NsTextInput = __vue_component__$O;
 // Unique ID creation requires a high quality random # generator.  In node.js
 // this is pretty straight-forward - we use the crypto API.
@@ -7501,11 +7521,18 @@ var UtilService = {
     /**
      * Navigate to a page of an external app. Use this method only from an external app (e.g. from AppSideMenuContent)
      */
-    goToAppPage(instanceName, page) {
+    goToAppPage(instanceName, page, query) {
       const path = `/apps/${instanceName}?page=${page}`;
       if (this.core.$route.fullPath != path) {
-        this.core.$router.push(path);
+        if (query) {
+          this.core.$router.push({
+            path: path,
+            query: query
+          });
+        } else {
+          this.core.$router.push(path);
+        }
       }
     },
@@ -7566,7 +7593,7 @@ var UtilService = {
 };
 //
-var script$h = {
+var script$j = {
   name: "NsPasswordInput",
   components: {
     NsTextInput
@@ -7731,10 +7758,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__$p = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -7829,10 +7856,10 @@ var __vue_render__$n = function () {
   }, [_vm._v(_vm._s(_vm.equalLabel))])])], 1)]);
 };
-var __vue_staticRenderFns__$n = [];
+var __vue_staticRenderFns__$p = [];
 /* style */
-const __vue_inject_styles__$o = function (inject) {
+const __vue_inject_styles__$q = 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}",
@@ -7843,26 +7870,26 @@ const __vue_inject_styles__$o = function (inject) {
 /* scoped */
-const __vue_scope_id__$o = "data-v-67b93b40";
+const __vue_scope_id__$q = "data-v-67b93b40";
 /* 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__$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);
-var __vue_component__$J = __vue_component__$I;
+var __vue_component__$N = __vue_component__$M;
 //
-var script$g = {
+var script$i = {
   name: "NsIconMenu",
   extends: CvOverflowMenu,
   props: {
@@ -7906,10 +7933,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__$o = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -8025,10 +8052,10 @@ var __vue_render__$m = function () {
   })])]);
 };
-var __vue_staticRenderFns__$m = [];
+var __vue_staticRenderFns__$o = [];
 /* style */
-const __vue_inject_styles__$n = function (inject) {
+const __vue_inject_styles__$p = function (inject) {
   if (!inject) return;
   inject("data-v-2be14df6_0", {
     source: ".ns-icon-menu[data-v-2be14df6]{display:inline-flex}",
@@ -8039,26 +8066,26 @@ const __vue_inject_styles__$n = function (inject) {
 /* scoped */
-const __vue_scope_id__$n = "data-v-2be14df6";
+const __vue_scope_id__$p = "data-v-2be14df6";
 /* 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 SSR */
 /* style inject shadow dom */
-const __vue_component__$G = /*#__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, createInjector, undefined, undefined);
+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);
-var __vue_component__$H = __vue_component__$G;
+var __vue_component__$L = __vue_component__$K;
 //
-var script$f = {
+var script$h = {
   name: "NsMeterChart",
   components: {
     NsProgressBar
@@ -8093,10 +8120,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__$n = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -8119,10 +8146,10 @@ var __vue_render__$l = function () {
   })], 1);
 };
-var __vue_staticRenderFns__$l = [];
+var __vue_staticRenderFns__$n = [];
 /* style */
-const __vue_inject_styles__$m = function (inject) {
+const __vue_inject_styles__$o = 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}",
@@ -8133,26 +8160,26 @@ const __vue_inject_styles__$m = function (inject) {
 /* scoped */
-const __vue_scope_id__$m = "data-v-8d83456c";
+const __vue_scope_id__$o = "data-v-8d83456c";
 /* 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__$E = /*#__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__$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);
-var __vue_component__$F = __vue_component__$E;
+var __vue_component__$J = __vue_component__$I;
 //
-var script$e = {
+var script$g = {
   name: "NsModal",
   extends: CvModal,
   components: {
@@ -8212,10 +8239,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__$m = function () {
   var _obj, _obj$1, _obj$2, _obj$3;
   var _vm = this;
@@ -8349,34 +8376,34 @@ var __vue_render__$k = function () {
   })], 1)]);
 };
-var __vue_staticRenderFns__$k = [];
+var __vue_staticRenderFns__$m = [];
 /* style */
-const __vue_inject_styles__$l = undefined;
+const __vue_inject_styles__$n = undefined;
 /* scoped */
-const __vue_scope_id__$l = undefined;
+const __vue_scope_id__$n = undefined;
 /* 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__$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);
-var NsModal = __vue_component__$D;
+var NsModal = __vue_component__$H;
 //
-var script$d = {
+var script$f = {
   name: "NsDangerDeleteModal",
   //component added for storybook to work
   components: {
@@ -8472,10 +8499,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__$l = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -8543,10 +8570,10 @@ var __vue_render__$j = function () {
   }, [_vm._v(_vm._s(_vm.deleteLabel))])], 2);
 };
-var __vue_staticRenderFns__$j = [];
+var __vue_staticRenderFns__$l = [];
 /* style */
-const __vue_inject_styles__$k = function (inject) {
+const __vue_inject_styles__$m = function (inject) {
   if (!inject) return;
   inject("data-v-746a2de3_0", {
     source: ".type-to-confirm[data-v-746a2de3]{margin-top:2rem}",
@@ -8557,23 +8584,23 @@ const __vue_inject_styles__$k = function (inject) {
 /* scoped */
-const __vue_scope_id__$k = "data-v-746a2de3";
+const __vue_scope_id__$m = "data-v-746a2de3";
 /* 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__$B = /*#__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__$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);
-var __vue_component__$C = __vue_component__$B;
+var __vue_component__$G = __vue_component__$F;
 var IconService = {
   name: "IconService",
@@ -8645,6 +8672,8 @@ var IconService = {
       // used to open details
       Events32,
       // user domains
+      Events20,
+      Events16,
       Link20,
       // URLs and external domain providers
       Link32,
@@ -8715,16 +8744,35 @@ var IconService = {
       Wikis32,
       // domain
       Wikis20,
+      Wikis16,
       At32,
       // email address
-      At20
+      At20,
+      User16,
+      User20,
+      User32,
+      Unknown16,
+      // unknown icon (question mark)
+      Unknown20,
+      Unknown32,
+      Email16,
+      Email20,
+      Email32,
+      Locked16,
+      // private email address
+      Locked20,
+      Locked32,
+      Folder16,
+      // public mailbox
+      Folder20,
+      Folder32
     };
   }
 };
 //
-var script$c = {
+var script$e = {
   name: "NsDropdownAction",
   extends: CvOverflowMenu,
   components: {
@@ -8756,10 +8804,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__$k = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -8859,34 +8907,34 @@ var __vue_render__$i = function () {
   })])]);
 };
-var __vue_staticRenderFns__$i = [];
+var __vue_staticRenderFns__$k = [];
 /* style */
-const __vue_inject_styles__$j = undefined;
+const __vue_inject_styles__$l = undefined;
 /* scoped */
-const __vue_scope_id__$j = "data-v-31925b9d";
+const __vue_scope_id__$l = "data-v-31925b9d";
 /* 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 */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$z = /*#__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, undefined, undefined, undefined);
+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);
-var __vue_component__$A = __vue_component__$z;
+var __vue_component__$E = __vue_component__$D;
 //
-var script$b = {
+var script$d = {
   name: "NsBackupCardDetails",
   mixins: [DateTimeService],
   props: {
@@ -8922,10 +8970,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__$j = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -8979,10 +9027,10 @@ var __vue_render__$h = 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__$h = [];
+var __vue_staticRenderFns__$j = [];
 /* style */
-const __vue_inject_styles__$i = function (inject) {
+const __vue_inject_styles__$k = 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}",
@@ -8993,26 +9041,26 @@ const __vue_inject_styles__$i = function (inject) {
 /* scoped */
-const __vue_scope_id__$i = "data-v-25453d1c";
+const __vue_scope_id__$k = "data-v-25453d1c";
 /* 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 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, createInjector, undefined, undefined);
+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);
-var NsBackupCardDetails = __vue_component__$y;
+var NsBackupCardDetails = __vue_component__$C;
 //
-var script$a = {
+var script$c = {
   name: "NsBackupCard",
   components: {
     NsBackupCardDetails
@@ -9153,10 +9201,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__$i = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9272,10 +9320,10 @@ var __vue_render__$g = function () {
   }, [_vm._v(_vm._s(_vm.goToBackupLabel) + "\n      ")])], 1)])], 2);
 };
-var __vue_staticRenderFns__$g = [];
+var __vue_staticRenderFns__$i = [];
 /* style */
-const __vue_inject_styles__$h = function (inject) {
+const __vue_inject_styles__$j = 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}",
@@ -9290,26 +9338,26 @@ const __vue_inject_styles__$h = function (inject) {
 /* scoped */
-const __vue_scope_id__$h = "data-v-5a3b7738";
+const __vue_scope_id__$j = "data-v-5a3b7738";
 /* 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__$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);
-var __vue_component__$x = __vue_component__$w;
+var __vue_component__$B = __vue_component__$A;
 //
-var script$9 = {
+var script$b = {
   name: "NsWizard",
   extends: NsModal,
   mixins: [IconService],
@@ -9353,10 +9401,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__$h = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -9498,34 +9546,34 @@ var __vue_render__$f = function () {
   })], 1)]);
 };
-var __vue_staticRenderFns__$f = [];
+var __vue_staticRenderFns__$h = [];
 /* style */
-const __vue_inject_styles__$g = undefined;
+const __vue_inject_styles__$i = undefined;
 /* scoped */
-const __vue_scope_id__$g = undefined;
+const __vue_scope_id__$i = undefined;
 /* 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__$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);
-var __vue_component__$v = __vue_component__$u;
+var __vue_component__$z = __vue_component__$y;
 //
-var script$8 = {
+var script$a = {
   name: "NsMenuItem",
   components: {
     NsSvg
@@ -9548,10 +9596,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__$g = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9571,10 +9619,10 @@ var __vue_render__$e = function () {
   }, [_vm._t("icon")], 2) : _vm._e(), _vm._v(" "), _c('span', [_vm._v(_vm._s(_vm.label))])]);
 };
-var __vue_staticRenderFns__$e = [];
+var __vue_staticRenderFns__$g = [];
 /* style */
-const __vue_inject_styles__$f = function (inject) {
+const __vue_inject_styles__$h = 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}",
@@ -9585,26 +9633,26 @@ const __vue_inject_styles__$f = function (inject) {
 /* scoped */
-const __vue_scope_id__$f = "data-v-35f08832";
+const __vue_scope_id__$h = "data-v-35f08832";
 /* 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 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, createInjector, undefined, undefined);
+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);
-var __vue_component__$t = __vue_component__$s;
+var __vue_component__$x = __vue_component__$w;
 //
-var script$7 = {
+var script$9 = {
   name: "NsMenuDivider",
   components: {
     CvSideNavDivider
@@ -9612,10 +9660,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__$f = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9625,34 +9673,34 @@ var __vue_render__$d = function () {
   return _c('cv-side-nav-divider');
 };
-var __vue_staticRenderFns__$d = [];
+var __vue_staticRenderFns__$f = [];
 /* style */
-const __vue_inject_styles__$e = undefined;
+const __vue_inject_styles__$g = undefined;
 /* scoped */
-const __vue_scope_id__$e = "data-v-c2c8c17e";
+const __vue_scope_id__$g = "data-v-c2c8c17e";
 /* 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__$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, undefined, undefined, undefined);
-var __vue_component__$r = __vue_component__$q;
+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);
+var __vue_component__$v = __vue_component__$u;
 //
-var script$6 = {
+var script$8 = {
   name: "NsSystemLogsCard",
   mixins: [UtilService, IconService],
   props: {
@@ -9771,10 +9819,10 @@ var script$6 = {
 };
 /* script */
-const __vue_script__$6 = script$6;
+const __vue_script__$8 = script$8;
 /* template */
-var __vue_render__$c = function () {
+var __vue_render__$e = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9801,34 +9849,34 @@ var __vue_render__$c = function () {
   }, [_vm._v("\n      " + _vm._s(_vm.buttonLabel) + "\n    ")])], 1)], 2);
 };
-var __vue_staticRenderFns__$c = [];
+var __vue_staticRenderFns__$e = [];
 /* style */
-const __vue_inject_styles__$d = undefined;
+const __vue_inject_styles__$f = undefined;
 /* scoped */
-const __vue_scope_id__$d = "data-v-aec74b8e";
+const __vue_scope_id__$f = "data-v-aec74b8e";
 /* 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__$o = /*#__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, undefined, undefined, undefined);
+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);
-var __vue_component__$p = __vue_component__$o;
+var __vue_component__$t = __vue_component__$s;
 //
-var script$5 = {
+var script$7 = {
   name: "NsTimePicker",
   mixins: [uidMixin, carbonPrefixMixin, themeMixin],
   props: {
@@ -9871,10 +9919,10 @@ var script$5 = {
 };
 /* script */
-const __vue_script__$5 = script$5;
+const __vue_script__$7 = script$7;
 /* template */
-var __vue_render__$b = function () {
+var __vue_render__$d = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -9918,10 +9966,10 @@ var __vue_render__$b = function () {
   })], 2) : _vm._e()]);
 };
-var __vue_staticRenderFns__$b = [];
+var __vue_staticRenderFns__$d = [];
 /* style */
-const __vue_inject_styles__$c = function (inject) {
+const __vue_inject_styles__$e = 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}",
@@ -9936,23 +9984,23 @@ const __vue_inject_styles__$c = function (inject) {
 /* scoped */
-const __vue_scope_id__$c = "data-v-e1e1beb2";
+const __vue_scope_id__$e = "data-v-e1e1beb2";
 /* 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__$m = /*#__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);
+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);
-var __vue_component__$n = __vue_component__$m;
+var __vue_component__$r = __vue_component__$q;
 /*
  * This component optionally wraps slotted content with the specified tag-type.
@@ -9991,7 +10039,7 @@ var NsWrapper = {
 };
-var script$4 = {
+var script$6 = {
   name: "NsPagination",
   extends: CvPagination,
   props: {
@@ -10069,12 +10117,12 @@ var script$4 = {
 };
 /* script */
-const __vue_script__$4 = script$4;
+const __vue_script__$6 = script$6;
 /* template */
 /* style */
-const __vue_inject_styles__$b = function (inject) {
+const __vue_inject_styles__$d = function (inject) {
   if (!inject) return;
   inject("data-v-01f52cb6_0", {
     source: ".cv-pagination .bx--select .bx--label{font-size:100%}",
@@ -10085,20 +10133,20 @@ const __vue_inject_styles__$b = function (inject) {
 /* scoped */
-const __vue_scope_id__$b = undefined;
+const __vue_scope_id__$d = undefined;
 /* module identifier */
-const __vue_module_identifier__$b = undefined;
+const __vue_module_identifier__$d = undefined;
 /* functional template */
-const __vue_is_functional_template__$b = undefined;
+const __vue_is_functional_template__$d = undefined;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$l = /*#__PURE__*/normalizeComponent({}, __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({}, __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 NsPagination = __vue_component__$l;
+var NsPagination = __vue_component__$p;
 var v$3 = "5.6.1";
 var fr$3 = 24;
@@ -17137,7 +17185,7 @@ var LottieService = {
 };
 //
-var script$3 = {
+var script$5 = {
   name: "NsDataTable",
   extends: CvDataTable,
   components: {
@@ -17287,6 +17335,9 @@ var script$3 = {
     pageNumberLabel: {
       type: String,
       default: undefined
+    },
+    filterRowsCallback: {
+      type: Function
     }
   },
@@ -17376,9 +17427,18 @@ var script$3 = {
     },
     filterRows() {
+      if (this.filterRowsCallback) {
+        // call custom filterRows function
+        this.filteredRows = this.filterRowsCallback(this.searchFilter);
+      } else {
+        this.filteredRows = this.defaultFilterRows();
+      }
+    },
+    defaultFilterRows() {
       if (!this.searchFilter) {
-        this.filteredRows = this.allRows;
-      } else if (this.searchFilter) {
+        return this.allRows;
+      } else {
         // clean query
         const cleanRegex = /[^a-zA-Z0-9]/g;
         const queryText = this.searchFilter.replace(cleanRegex, "");
@@ -17402,7 +17462,7 @@ var script$3 = {
             }
           });
         }, this);
-        this.filteredRows = searchResults;
+        return searchResults;
       }
     },
@@ -17434,10 +17494,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__$c = function () {
   var _obj, _obj$1, _obj$2, _obj$3;
   var _vm = this;
@@ -17765,34 +17825,34 @@ var __vue_render__$a = function () {
   }, 'NsPagination', _vm.internalPagination, false)) : _vm._e()], 1)], 2);
 };
-var __vue_staticRenderFns__$a = [];
+var __vue_staticRenderFns__$c = [];
 /* style */
-const __vue_inject_styles__$a = undefined;
+const __vue_inject_styles__$c = undefined;
 /* scoped */
-const __vue_scope_id__$a = undefined;
+const __vue_scope_id__$c = undefined;
 /* 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 */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$j = /*#__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, undefined, undefined, undefined);
+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);
-var __vue_component__$k = __vue_component__$j;
+var __vue_component__$o = __vue_component__$n;
 //
-var script$2 = {
+var script$4 = {
   name: "NsToggle",
   extends: CvToggle,
   props: {
@@ -17823,10 +17883,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__$b = function () {
   var _obj;
   var _vm = this;
@@ -17895,10 +17955,10 @@ var __vue_render__$9 = function () {
   })], 2)])])]);
 };
-var __vue_staticRenderFns__$9 = [];
+var __vue_staticRenderFns__$b = [];
 /* style */
-const __vue_inject_styles__$9 = function (inject) {
+const __vue_inject_styles__$b = function (inject) {
   if (!inject) return;
   inject("data-v-08c576ca_0", {
     source: ".tooltip[data-v-08c576ca]{display:inline-block;position:absolute}",
@@ -17913,26 +17973,26 @@ const __vue_inject_styles__$9 = function (inject) {
 /* scoped */
-const __vue_scope_id__$9 = "data-v-08c576ca";
+const __vue_scope_id__$b = "data-v-08c576ca";
 /* 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__$h = /*#__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__$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);
-var __vue_component__$i = __vue_component__$h;
+var __vue_component__$m = __vue_component__$l;
 //
-var script$1 = {
+var script$3 = {
   name: "NsTag",
   extends: CvTag,
   computed: {
@@ -17944,10 +18004,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__$a = function () {
   var _obj;
   var _vm = this;
@@ -17958,7 +18018,7 @@ var __vue_render__$8 = function () {
   return _c(!_vm.isFilter && _vm.hasClickListener ? 'button' : 'div', _vm._g({
     tag: "component",
-    class: ["cv-tag " + _vm.carbonPrefix + "--tag", _vm.carbonPrefix + "--tag--" + _vm.tagKind, (_obj = {}, _obj[_vm.carbonPrefix + "--tag--filter"] = _vm.isFilter, _obj[_vm.carbonPrefix + "--tag--" + _vm.size] = _vm.size, _obj)],
+    class: ["cv-tag " + _vm.carbonPrefix + "--tag", _vm.carbonPrefix + "--tag--" + _vm.tagKind, (_obj = {}, _obj[_vm.carbonPrefix + "--tag--disabled"] = _vm.disabled, _obj[_vm.carbonPrefix + "--tag--filter"] = _vm.isFilter, _obj[_vm.carbonPrefix + "--tag--" + _vm.size] = _vm.size, _obj)],
     attrs: {
       "id": _vm.uid,
       "title": _vm.title
@@ -18013,13 +18073,13 @@ var __vue_render__$8 = function () {
   }, [_c('Close16')], 1) : _vm._e()]);
 };
-var __vue_staticRenderFns__$8 = [];
+var __vue_staticRenderFns__$a = [];
 /* style */
-const __vue_inject_styles__$8 = function (inject) {
+const __vue_inject_styles__$a = function (inject) {
   if (!inject) return;
-  inject("data-v-1c7f8d28_0", {
-    source: ".bx--tag--filter[data-v-1c7f8d28]{cursor:default}",
+  inject("data-v-34eae706_0", {
+    source: ".bx--tag--filter[data-v-34eae706]{cursor:default}",
     map: undefined,
     media: undefined
   });
@@ -18027,23 +18087,23 @@ const __vue_inject_styles__$8 = function (inject) {
 /* scoped */
-const __vue_scope_id__$8 = "data-v-1c7f8d28";
+const __vue_scope_id__$a = "data-v-34eae706";
 /* 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__$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);
-var NsTag = __vue_component__$g;
+var NsTag = __vue_component__$k;
 /**
  * Removes all key-value entries from the list cache.
@@ -20540,7 +20600,7 @@ const TOP_AFTER_REOPEN = 0;
 const TOP = 1;
 const FIXED = 2;
 const selectionFeedbackOptions = ["top-after-reopen", "top", "fixed"];
-var script = {
+var script$2 = {
   name: "NsMultiSelect",
   inheritAttrs: false,
   mixins: [themeMixin, uidMixin, carbonPrefixMixin, methodsMixin({
@@ -20625,6 +20685,10 @@ var script = {
       type: String,
       default: "Clear selection"
     },
+    clearFilterLabel: {
+      type: String,
+      default: "Clear filter"
+    },
     selectedLabel: {
       type: String,
       default: "selected"
@@ -20650,6 +20714,20 @@ var script = {
     selectedItemsColor: {
       type: String,
       default: "high-contrast"
+    },
+    marginBottomOnOpen: {
+      type: Boolean,
+      default: false
+    },
+    tooltipAlignment: {
+      type: String,
+      default: "start",
+      validator: val => ["start", "center", "end"].includes(val)
+    },
+    tooltipDirection: {
+      type: String,
+      default: "bottom",
+      validator: val => ["top", "left", "bottom", "right".includes(val)]
     }
   },
@@ -20663,7 +20741,8 @@ var script = {
       dataHighlighted: null,
       dataFilter: "",
       isHelper: false,
-      isInvalid: false
+      isInvalid: false,
+      marginBottomOnOpenEnabled: false
     };
   },
@@ -20691,6 +20770,20 @@ var script = {
     selectionFeedback() {
       this.updateOptions();
+    },
+    open() {
+      if (this.marginBottomOnOpen) {
+        if (this.open) {
+          setTimeout(() => {
+            this.marginBottomOnOpenEnabled = true;
+          }, 300);
+        } else {
+          setTimeout(() => {
+            this.marginBottomOnOpenEnabled = false;
+          }, 300);
+        }
+      }
     }
   },
@@ -20762,6 +20855,10 @@ var script = {
     selectedItems() {
       return this.dataValue.map(val => this.internalOptions.find(opt => opt.value === val));
+    },
+    hasTooltipSlot() {
+      return !!this.$slots.tooltip;
     }
   },
@@ -20998,10 +21095,10 @@ var script = {
 };
 /* script */
-const __vue_script__ = script;
+const __vue_script__$2 = script$2;
 /* template */
-var __vue_render__$7 = function () {
+var __vue_render__$9 = function () {
   var _obj, _obj$1, _obj$2, _obj$3, _obj$4, _obj$5, _obj$6;
   var _vm = this;
@@ -21011,7 +21108,7 @@ var __vue_render__$7 = function () {
   var _c = _vm._self._c || _h;
   return _c('div', {
-    class: ["ns-multi-select cv-multi-select " + _vm.carbonPrefix + "--multi-select__wrapper " + _vm.carbonPrefix + "--list-box__wrapper", (_obj = {}, _obj[_vm.carbonPrefix + "--multi-select__wrapper--inline " + _vm.carbonPrefix + "--list-box__wrapper--inline"] = _vm.inline, _obj[_vm.carbonPrefix + "--multi-select__wrapper--inline--invalid " + _vm.carbonPrefix + "--list-box__wrapper--inline--invalid"] = _vm.inline && _vm.isInvalid, _obj[_vm.carbonPrefix + "--multi-select--filterable"] = _vm.filterable, _obj)],
+    class: ["ns-multi-select cv-multi-select " + _vm.carbonPrefix + "--multi-select__wrapper " + _vm.carbonPrefix + "--list-box__wrapper", (_obj = {}, _obj[_vm.carbonPrefix + "--multi-select__wrapper--inline " + _vm.carbonPrefix + "--list-box__wrapper--inline"] = _vm.inline, _obj[_vm.carbonPrefix + "--multi-select__wrapper--inline--invalid " + _vm.carbonPrefix + "--list-box__wrapper--inline--invalid"] = _vm.inline && _vm.isInvalid, _obj[_vm.carbonPrefix + "--multi-select--filterable"] = _vm.filterable, _obj['margin-bottom-on-open'] = _vm.marginBottomOnOpenEnabled, _obj)],
     on: {
       "focusout": _vm.onFocusOut
     }
@@ -21020,7 +21117,17 @@ var __vue_render__$7 = function () {
     attrs: {
       "for": _vm.uid
     }
-  }, [_vm._v(_vm._s(_vm.title))]) : _vm._e(), _vm._v(" "), _c('div', _vm._b({
+  }, [_c('div', {
+    staticClass: "label-with-tooltip"
+  }, [_c('span', [_vm._v("\n        " + _vm._s(_vm.title) + "\n      ")]), _vm._v(" "), _vm.hasTooltipSlot ? _c('cv-interactive-tooltip', {
+    staticClass: "info",
+    attrs: {
+      "alignment": _vm.tooltipAlignment,
+      "direction": _vm.tooltipDirection
+    }
+  }, [_c('template', {
+    slot: "content"
+  }, [_vm._t("tooltip")], 2)], 2) : _vm._e()], 1)]) : _vm._e(), _vm._v(" "), _c('div', _vm._b({
     class: [_vm.carbonPrefix + "--multi-select " + _vm.carbonPrefix + "--list-box", (_obj$2 = {}, _obj$2[_vm.carbonPrefix + "--list-box--light"] = _vm.isLight, _obj$2[_vm.carbonPrefix + "--list-box--expanded"] = _vm.open, _obj$2[_vm.carbonPrefix + "--multi-select--invalid"] = _vm.isInvalid, _obj$2[_vm.carbonPrefix + "--multi-select--disabled"] = _vm.disabled, _obj$2[_vm.carbonPrefix + "--list-box--disabled"] = _vm.disabled, _obj$2[_vm.carbonPrefix + "--multi-select--inline"] = _vm.inline, _obj$2[_vm.carbonPrefix + "--list-box--inline"] = _vm.inline, _obj$2[_vm.carbonPrefix + "--multi-select--selected"] = _vm.dataValue.length > 0, _obj$2[_vm.carbonPrefix + "--combo-box"] = _vm.filterable, _obj$2)],
     attrs: {
       "role": "listbox",
@@ -21112,7 +21219,8 @@ var __vue_render__$7 = function () {
       "role": "combobox",
       "aria-expanded": _vm.open ? 'true' : 'false',
       "autocomplete": "off",
-      "placeholder": _vm.label
+      "placeholder": _vm.label,
+      "disabled": _vm.disabled
     },
     domProps: {
       "value": _vm.filter
@@ -21137,7 +21245,7 @@ var __vue_render__$7 = function () {
     attrs: {
       "role": "button",
       "tabindex": "0",
-      "title": "Clear selection"
+      "title": _vm.clearFilterLabel
     },
     on: {
       "click": function ($event) {
@@ -21248,7 +21356,8 @@ var __vue_render__$7 = function () {
         "size": "sm",
         "clear-aria-label": _vm.unselectAriaLabel,
         "label": item.label,
-        "kind": _vm.selectedItemsColor
+        "kind": _vm.selectedItemsColor,
+        "disabled": _vm.disabled
       },
       on: {
         "remove": function ($event) {
@@ -21259,17 +21368,17 @@ var __vue_render__$7 = function () {
   }), 1) : _vm._e()]);
 };
-var __vue_staticRenderFns__$7 = [];
+var __vue_staticRenderFns__$9 = [];
 /* style */
-const __vue_inject_styles__$7 = function (inject) {
+const __vue_inject_styles__$9 = function (inject) {
   if (!inject) return;
-  inject("data-v-75ab499e_0", {
-    source: ".bx--multi-select--filterable .bx--tag.selected-item[data-v-75ab499e]{margin-left:0;margin-bottom:.25rem}",
+  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}",
     map: undefined,
     media: undefined
-  }), inject("data-v-75ab499e_1", {
-    source: ".selected-item button.bx--tag__close-icon{position:relative;right:1px}",
+  }), inject("data-v-319bf0f2_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
   });
@@ -21277,49 +21386,847 @@ const __vue_inject_styles__$7 = function (inject) {
 /* scoped */
-const __vue_scope_id__$7 = "data-v-75ab499e";
+const __vue_scope_id__$9 = "data-v-319bf0f2";
 /* 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__$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);
-var __vue_component__$f = __vue_component__$e;
+var __vue_component__$j = __vue_component__$i;
-/* script */
+//
+var script$1 = {
+  name: "NsComboBox",
+  inheritAttrs: false,
+  mixins: [themeMixin, uidMixin, carbonPrefixMixin, methodsMixin({
+    input: ["focus", "blur"]
+  })],
+  components: {
+    WarningFilled16: WarningFilled16$1,
+    ChevronDown16,
+    Close16
+  },
+  props: {
+    autoFilter: Boolean,
+    autoHighlight: Boolean,
+    disabled: Boolean,
+    invalidMessage: {
+      type: String,
+      default: undefined
+    },
+    helperText: {
+      type: String,
+      default: undefined
+    },
+    title: String,
+    label: {
+      type: String,
+      default: "Choose"
+    },
+    highlight: String,
+    value: String,
+    options: {
+      type: Array,
+      required: true,
-/* template */
-var __vue_render__$6 = function () {
-  var _vm = this;
+      validator(list) {
+        const result = list.every(item => typeof item.name === "string" && typeof item.label === "string" && typeof item.value === "string");
-  var _h = _vm.$createElement;
+        if (!result) {
+          console.warn("NsComboBox - all options must have name, label and value");
+        }
-  var _c = _vm._self._c || _h;
+        return result;
+      }
-  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"
+    },
+    clearFilterLabel: {
+      type: String,
+      default: "Clear filter"
+    },
+    userInputLabel: {
+      type: String,
+      default: "user input"
+    },
+    // limit the number of options to be displayed
+    maxDisplayOptions: {
+      type: Number,
+      default: 100
+    },
+    acceptUserInput: {
+      type: Boolean,
+      default: false
+    },
+    showItemType: {
+      type: Boolean,
+      default: false
+    },
+    marginBottomOnOpen: {
+      type: Boolean,
+      default: false
+    },
+    tooltipAlignment: {
+      type: String,
+      default: "start",
+      validator: val => ["start", "center", "end"].includes(val)
+    },
+    tooltipDirection: {
+      type: String,
+      default: "bottom",
+      validator: val => ["top", "left", "bottom", "right".includes(val)]
     }
-  });
-};
-var __vue_staticRenderFns__$6 = [];
-/* style */
-const __vue_inject_styles__$6 = undefined;
-/* scoped */
+  },
-const __vue_scope_id__$6 = undefined;
+  data() {
+    return {
+      open: false,
+      dataOptions: null,
+      dataValue: this.value,
+      dataHighlighted: null,
+      dataFilter: null,
+      isHelper: false,
+      isInvalid: false,
+      // includes user input items
+      internalOptions: [],
+      marginBottomOnOpenEnabled: false
+    };
+  },
+  model: {
+    prop: "value",
+    event: "change"
+  },
+  watch: {
+    highlight() {
+      this.highlighted = this.highlight;
+    },
+    value() {
+      this.dataValue = this.value;
+      this.highlighted = this.value;
+      this.internalUpdateValue(this.value);
+    },
+    options() {
+      this.internalOptions = cloneDeep_1(this.options);
+      this.updateOptions();
+    },
+    open() {
+      if (this.marginBottomOnOpen) {
+        if (this.open) {
+          setTimeout(() => {
+            this.marginBottomOnOpenEnabled = true;
+          }, 300);
+        } else {
+          setTimeout(() => {
+            this.marginBottomOnOpenEnabled = false;
+          }, 300);
+        }
+      }
+    }
+  },
+  created() {
+    this.internalOptions = cloneDeep_1(this.options);
+    this.updateOptions();
+  },
+  mounted() {
+    this.filter = this.value;
+    this.highlighted = this.value ? this.value : this.highlight; // override highlight with value if provided
+    this.checkSlots();
+  },
+  updated() {
+    this.checkSlots();
+  },
+  computed: {
+    highlighted: {
+      get() {
+        return this.dataHighlighted;
+      },
+      set(val) {
+        let firstMatchIndex = this.dataOptions.findIndex(item => item.value === val);
+        if (firstMatchIndex < 0) {
+          firstMatchIndex = this.dataOptions.length ? 0 : -1;
+          this.dataHighlighted = firstMatchIndex >= 0 ? this.dataOptions[0].value : "";
+        } else {
+          this.dataHighlighted = val;
+        }
+        if (firstMatchIndex >= 0) {
+          this.$nextTick(() => {
+            // $nextTick to prevent highlight check ahead of list update on filter
+            this.checkHighlightPosition(firstMatchIndex);
+          });
+        }
+      }
+    },
+    filter: {
+      get() {
+        return this.dataFilter;
+      },
+      set(val) {
+        this.dataFilter = val ? val : "";
+        this.$emit("filter", val);
+      }
+    },
+    limitedDataOptions() {
+      return this.dataOptions.slice(0, this.maxDisplayOptions);
+    },
+    hasTooltipSlot() {
+      return !!this.$slots.tooltip;
+    }
+  },
+  methods: {
+    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);
+      this.isHelper = !!(this.$slots["helper-text"] || this.helperText && this.helperText.length);
+    },
+    clearFilter() {
+      if (this.disabled) return;
+      this.internalUpdateValue("");
+      this.filter = "";
+      this.$refs.input.focus();
+      this.doOpen(true);
+      this.updateOptions();
+      this.$emit("change", this.dataValue);
+    },
+    checkHighlightPosition(newHiglight) {
+      if (this.$refs.list && this.$refs.option && this.$refs.option[newHiglight]) {
+        if (this.$refs.list.scrollTop > this.$refs.option[newHiglight].offsetTop) {
+          this.$refs.list.scrollTop = this.$refs.option[newHiglight].offsetTop;
+        } else if (this.$refs.list.scrollTop + this.$refs.list.clientHeight < this.$refs.option[newHiglight].offsetTop + this.$refs.option[newHiglight].offsetHeight) {
+          this.$refs.list.scrollTop = this.$refs.option[newHiglight].offsetTop + this.$refs.option[newHiglight].offsetHeight - this.$refs.list.clientHeight;
+        }
+      }
+    },
+    doMove(up) {
+      if (this.dataOptions.length > 0) {
+        // requery could have changed
+        const currentHighlight = this.dataOptions.findIndex(item => item.value === this.highlighted);
+        let newHiglight;
+        if (up) {
+          if (currentHighlight <= 0) {
+            newHiglight = this.dataOptions.length - 1;
+          } else {
+            newHiglight = currentHighlight - 1;
+          }
+        } else {
+          if (currentHighlight >= this.dataOptions.length - 1) {
+            newHiglight = 0;
+          } else {
+            newHiglight = currentHighlight + 1;
+          }
+        }
+        this.highlighted = this.dataOptions[newHiglight].value; // this.checkHighlightPosition(newHiglight);
+      }
+    },
+    updateOptions() {
+      if (this.autoFilter && this.filter) {
+        const escFilter = this.filter.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+        const pat = new RegExp(escFilter, "iu");
+        this.dataOptions = this.internalOptions.filter(opt => pat.test(opt.label)).slice(0);
+      } else {
+        this.dataOptions = this.internalOptions.slice(0);
+      }
+      if (this.highlight !== this.highlighted) {
+        this.highlighted = this.highlight;
+      } // added for ns-combo-box
+      if (this.acceptUserInput && this.filter && this.filter.trim()) {
+        // suggest user input
+        const trimmedFilter = this.filter.trim();
+        const itemFound = this.internalOptions.find(o => o.value.trim() === trimmedFilter);
+        if (!itemFound) {
+          this.dataOptions.push({
+            name: trimmedFilter,
+            label: trimmedFilter,
+            value: trimmedFilter,
+            type: this.userInputLabel
+          });
+        }
+      }
+    },
+    updateHighlight() {
+      let firstMatchIndex;
+      if (this.autoHighlight && this.dataOptions.length > 0) {
+        // then highlight first match
+        const filterRegex = new RegExp(this.filter, "iu");
+        firstMatchIndex = this.dataOptions.findIndex(item => filterRegex.test(item.label));
+        if (firstMatchIndex < 0) {
+          firstMatchIndex = 0;
+        }
+        this.highlighted = this.dataOptions[firstMatchIndex].value; // this.checkHighlightPosition(firstMatchIndex);
+      }
+    },
+    onInput() {
+      if (this.disabled) return;
+      this.doOpen(true);
+      this.updateOptions();
+      this.updateHighlight();
+      if (this.acceptUserInput) {
+        this.internalUpdateValue(this.filter);
+        this.$emit("change", this.dataValue);
+      }
+    },
+    doOpen(newVal) {
+      this.open = newVal;
+    },
+    onDown() {
+      if (this.disabled) return;
+      if (!this.open) {
+        this.doOpen(true);
+      } else {
+        this.doMove(false);
+      }
+    },
+    onUp() {
+      if (this.disabled) return;
+      if (this.open) {
+        this.doMove(true);
+      }
+    },
+    onEsc() {
+      if (this.disabled) return;
+      this.doOpen(false);
+      this.$el.focus();
+    },
+    onEnter() {
+      if (this.disabled) return;
+      this.doOpen(!this.open);
+      if (!this.open) {
+        this.onItemClick(this.highlighted);
+        this.$refs.input.focus();
+      }
+    },
+    onClick() {
+      if (this.disabled) return;
+      this.doOpen(!this.open);
+      if (this.open) {
+        this.$refs.input.focus();
+      } else {
+        this.$refs.button.focus();
+      }
+    },
+    clearValues() {
+      this.dataValue = "";
+      this.$refs.input.focus();
+      this.$emit("change", this.dataValue);
+    },
+    onFocusOut(ev) {
+      if (!this.$el.contains(ev.relatedTarget)) {
+        this.doOpen(false);
+      }
+    },
+    onMousemove(val) {
+      this.highlighted = val;
+    },
+    internalUpdateValue(val) {
+      this.dataValue = val;
+      const filterOption = this.dataOptions.find(item => item.value === val);
+      if (filterOption) {
+        this.filter = filterOption.label;
+      }
+    },
+    onItemClick(val) {
+      if (!val) {
+        return;
+      }
+      if (this.disabled) return;
+      if (this.acceptUserInput && !this.internalOptions.find(item => item.value === val)) {
+        this.internalOptions.push({
+          name: val,
+          label: val,
+          value: val,
+          type: this.userInputLabel
+        });
+      }
+      this.internalUpdateValue(val);
+      this.$refs.input.focus();
+      this.open = false; // close after user makes a selection
+      this.$emit("change", this.dataValue);
+    },
+    inputClick() {
+      if (this.disabled) return;
+      if (!this.open) {
+        this.doOpen(true);
+      }
+    },
+    inputFocus() {
+      if (this.disabled) return;
+      this.doOpen(true);
+    }
+  }
+};
+/* script */
+const __vue_script__$1 = script$1;
+/* template */
+var __vue_render__$8 = function () {
+  var _obj, _obj$1, _obj$2, _obj$3, _obj$4;
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', {
+    class: ['ns-combo-box', 'cv-combo-box', _vm.carbonPrefix + "--list-box__wrapper", {
+      'margin-bottom-on-open': _vm.marginBottomOnOpenEnabled
+    }],
+    on: {
+      "focusout": _vm.onFocusOut
+    }
+  }, [_vm.title ? _c('label', {
+    class: [_vm.carbonPrefix + "--label", (_obj = {}, _obj[_vm.carbonPrefix + "--label--disabled"] = _vm.disabled, _obj)],
+    attrs: {
+      "for": _vm.uid
+    }
+  }, [_c('div', {
+    staticClass: "label-with-tooltip"
+  }, [_c('span', [_vm._v("\n        " + _vm._s(_vm.title) + "\n      ")]), _vm._v(" "), _vm.hasTooltipSlot ? _c('cv-interactive-tooltip', {
+    staticClass: "info",
+    attrs: {
+      "alignment": _vm.tooltipAlignment,
+      "direction": _vm.tooltipDirection
+    }
+  }, [_c('template', {
+    slot: "content"
+  }, [_vm._t("tooltip")], 2)], 2) : _vm._e()], 1)]) : _vm._e(), _vm._v(" "), _c('div', _vm._b({
+    class: [_vm.carbonPrefix + "--combo-box " + _vm.carbonPrefix + "--list-box", (_obj$1 = {}, _obj$1[_vm.carbonPrefix + "--list-box--light"] = _vm.isLight, _obj$1[_vm.carbonPrefix + "--combo-box--expanded"] = _vm.open, _obj$1[_vm.carbonPrefix + "--list-box--expanded"] = _vm.open, _obj$1[_vm.carbonPrefix + "--combo-box--disabled " + _vm.carbonPrefix + "--list-box--disabled"] = _vm.disabled, _obj$1)],
+    attrs: {
+      "role": "listbox",
+      "tabindex": "-1",
+      "data-invalid": _vm.isInvalid
+    },
+    on: {
+      "keydown": [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);
+      }, 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, "enter", 13, $event.key, "Enter")) {
+          return null;
+        }
+        $event.preventDefault();
+        return _vm.onEnter.apply(null, arguments);
+      }, function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "esc", 27, $event.key, ["Esc", "Escape"])) {
+          return null;
+        }
+        $event.preventDefault();
+        return _vm.onEsc.apply(null, arguments);
+      }],
+      "click": _vm.onClick
+    }
+  }, 'div', _vm.$attrs, false), [_vm.isInvalid ? _c('WarningFilled16', {
+    class: [_vm.carbonPrefix + "--list-box__invalid-icon"]
+  }) : _vm._e(), _vm._v(" "), _c('div', {
+    ref: "button",
+    class: [_vm.carbonPrefix + "--list-box__field"],
+    attrs: {
+      "role": "button",
+      "aria-haspopup": "true",
+      "aria-expanded": _vm.open ? 'true' : 'false',
+      "aria-owns": _vm.uid,
+      "aria-controls": _vm.uid,
+      "tabindex": "-1",
+      "type": "button",
+      "aria-label": _vm.open ? 'close menu' : 'open menu',
+      "data-toggle": "true"
+    }
+  }, [_c('input', {
+    directives: [{
+      name: "model",
+      rawName: "v-model",
+      value: _vm.filter,
+      expression: "filter"
+    }],
+    ref: "input",
+    class: [_vm.carbonPrefix + "--text-input", (_obj$2 = {}, _obj$2[_vm.carbonPrefix + "--text-input--empty"] = !_vm.filter || _vm.filter.length === 0, _obj$2)],
+    attrs: {
+      "aria-controls": _vm.uid,
+      "aria-autocomplete": "list",
+      "role": "combobox",
+      "aria-disabled": _vm.disabled,
+      "aria-expanded": _vm.open ? 'true' : 'false',
+      "autocomplete": "off",
+      "disabled": _vm.disabled,
+      "placeholder": _vm.label
+    },
+    domProps: {
+      "value": _vm.filter
+    },
+    on: {
+      "input": [function ($event) {
+        if ($event.target.composing) {
+          return;
+        }
+        _vm.filter = $event.target.value;
+      }, _vm.onInput],
+      "focus": _vm.inputFocus,
+      "click": function ($event) {
+        $event.stopPropagation();
+        $event.preventDefault();
+        return _vm.inputClick.apply(null, arguments);
+      }
+    }
+  }), _vm._v(" "), _vm.filter ? _c('div', {
+    class: [_vm.carbonPrefix + "--list-box__selection"],
+    attrs: {
+      "role": "button",
+      "tabindex": "0",
+      "title": _vm.clearFilterLabel
+    },
+    on: {
+      "click": function ($event) {
+        $event.stopPropagation();
+        return _vm.clearFilter.apply(null, arguments);
+      },
+      "keydown": [function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter")) {
+          return null;
+        }
+        $event.stopPropagation();
+        $event.preventDefault();
+        return _vm.clearFilter.apply(null, arguments);
+      }, function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "space", 32, $event.key, [" ", "Spacebar"])) {
+          return null;
+        }
+        $event.stopPropagation();
+        $event.preventDefault();
+      }],
+      "keyup": function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "space", 32, $event.key, [" ", "Spacebar"])) {
+          return null;
+        }
+        $event.stopPropagation();
+        $event.preventDefault();
+        return _vm.clearFilter.apply(null, arguments);
+      }
+    }
+  }, [_c('Close16')], 1) : _vm._e(), _vm._v(" "), _c('div', {
+    class: [_vm.carbonPrefix + "--list-box__menu-icon", (_obj$3 = {}, _obj$3[_vm.carbonPrefix + "--list-box__menu-icon--open"] = _vm.open, _obj$3)],
+    attrs: {
+      "role": "button"
+    }
+  }, [_c('chevron-down-16', {
+    attrs: {
+      "aria-label": _vm.open ? 'Close menu' : 'Open menu'
+    }
+  })], 1)]), _vm._v(" "), _c('div', {
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: _vm.open,
+      expression: "open"
+    }],
+    ref: "list",
+    class: [_vm.carbonPrefix + "--list-box__menu"],
+    attrs: {
+      "id": _vm.uid,
+      "role": "listbox"
+    }
+  }, _vm._l(_vm.limitedDataOptions, function (item, index) {
+    var _obj;
+    return _c('div', {
+      key: "combo-box-" + index,
+      ref: "option",
+      refInFor: true,
+      class: [_vm.carbonPrefix + "--list-box__menu-item", (_obj = {}, _obj[_vm.carbonPrefix + "--list-box__menu-item--highlighted"] = _vm.highlighted === item.value, _obj)],
+      on: {
+        "click": function ($event) {
+          $event.stopPropagation();
+          $event.preventDefault();
+          return _vm.onItemClick(item.value);
+        },
+        "mousemove": function ($event) {
+          return _vm.onMousemove(item.value);
+        },
+        "mousedown": function ($event) {
+          $event.preventDefault();
+        }
+      }
+    }, [_c('div', {
+      class: [_vm.carbonPrefix + "--list-box__menu-item__option"]
+    }, [_vm._v("\n          " + _vm._s(_vm.showItemType && item.type ? item.label + " - " + item.type : item.label) + "\n        ")])]);
+  }), 0)], 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(), _vm._v(" "), !_vm.isInvalid && _vm.isHelper ? _c('div', {
+    class: [_vm.carbonPrefix + "--form__helper-text", (_obj$4 = {}, _obj$4[_vm.carbonPrefix + "--form__helper-text--disabled"] = _vm.disabled, _obj$4)]
+  }, [_vm._t("helper-text", function () {
+    return [_vm._v(_vm._s(_vm.helperText))];
+  })], 2) : _vm._e()]);
+};
+var __vue_staticRenderFns__$8 = [];
+/* style */
+const __vue_inject_styles__$8 = 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}",
+    map: undefined,
+    media: undefined
+  }), inject("data-v-05ab085e_1", {
+    source: ".ns-combo-box .bx--tooltip__label .bx--tooltip__trigger{margin-left:.25rem}",
+    map: undefined,
+    media: undefined
+  });
+};
+/* scoped */
+const __vue_scope_id__$8 = "data-v-05ab085e";
+/* 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__$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);
+var __vue_component__$h = __vue_component__$g;
+//
+var script = {
+  name: "NsCheckbox",
+  extends: CvCheckbox,
+  inheritAttrs: false,
+  props: {
+    hideLabel: Boolean,
+    label: String,
+    mixed: Boolean,
+    formItem: {
+      type: Boolean,
+      default: true
+    },
+    tooltipAlignment: {
+      type: String,
+      default: "start",
+      validator: val => ["start", "center", "end"].includes(val)
+    },
+    tooltipDirection: {
+      type: String,
+      default: "bottom",
+      validator: val => ["top", "left", "bottom", "right".includes(val)]
+    }
+  },
+  computed: {
+    hasTooltipSlot() {
+      return !!this.$slots.tooltip;
+    }
+  }
+};
+/* script */
+const __vue_script__ = script;
+/* template */
+var __vue_render__$7 = function () {
+  var _obj, _obj$1, _obj$2;
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', {
+    staticClass: "ns-checkbox cv-checkbox",
+    class: [_vm.carbonPrefix + "--checkbox-wrapper", (_obj = {}, _obj[_vm.carbonPrefix + "--form-item"] = _vm.formItem, _obj)]
+  }, [_c('input', _vm._g(_vm._b({
+    ref: "input",
+    class: _vm.carbonPrefix + "--checkbox",
+    attrs: {
+      "type": "checkbox",
+      "aria-checked": "" + _vm.isChecked,
+      "id": _vm.uid
+    },
+    domProps: {
+      "checked": _vm.isChecked === true,
+      "value": _vm.value
+    },
+    on: {
+      "focus": _vm.onFocus,
+      "blur": _vm.onBlur
+    }
+  }, 'input', _vm.$attrs, false), _vm.inputListeners)), _vm._v(" "), _c('label', {
+    class: [_vm.carbonPrefix + "--checkbox-label", (_obj$1 = {}, _obj$1[_vm.carbonPrefix + "--label--disabled"] = _vm.$attrs.disabled !== undefined && this.$attrs.disabled, _obj$1[_vm.carbonPrefix + "--checkbox-label__focus"] = _vm.hasFocus, _obj$1)],
+    attrs: {
+      "data-contained-checkbox-state": _vm.isChecked,
+      "data-contained-checkbox-disabled": _vm.$attrs.disabled,
+      "for": _vm.uid
+    }
+  }, [_c('div', {
+    class: [_vm.carbonPrefix + "--checkbox-label-text", (_obj$2 = {}, _obj$2[_vm.carbonPrefix + "--visually-hidden"] = _vm.hideLabel, _obj$2)]
+  }, [_c('div', {
+    staticClass: "label-with-tooltip"
+  }, [_c('span', [_vm._v("\n          " + _vm._s(_vm.label) + "\n        ")]), _vm._v(" "), _vm.hasTooltipSlot ? _c('cv-interactive-tooltip', {
+    staticClass: "info",
+    attrs: {
+      "alignment": _vm.tooltipAlignment,
+      "direction": _vm.tooltipDirection
+    }
+  }, [_c('template', {
+    slot: "content"
+  }, [_vm._t("tooltip")], 2)], 2) : _vm._e()], 1)])])]);
+};
+var __vue_staticRenderFns__$7 = [];
+/* style */
+const __vue_inject_styles__$7 = function (inject) {
+  if (!inject) return;
+  inject("data-v-03fbc1e6_0", {
+    source: ".label-with-tooltip[data-v-03fbc1e6]{display:flex}",
+    map: undefined,
+    media: undefined
+  }), inject("data-v-03fbc1e6_1", {
+    source: ".ns-checkbox .bx--tooltip__label .bx--tooltip__trigger{margin-left:.25rem}",
+    map: undefined,
+    media: undefined
+  });
+};
+/* scoped */
+const __vue_scope_id__$7 = "data-v-03fbc1e6";
+/* module identifier */
+const __vue_module_identifier__$7 = undefined;
+/* functional template */
+const __vue_is_functional_template__$7 = 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);
+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;
@@ -21935,6 +22842,10 @@ var task = {
     createErrorNotificationForApp(err, message) {
       console.error(err);
       window.parent.core.$root.$emit("createErrorNotification", err, message);
+    },
+    createNotificationForApp(notification) {
+      window.parent.core.$root.$emit("createNotification", notification);
     }
   }
@@ -22093,37 +23004,39 @@ var filters = {
 var components = /*#__PURE__*/Object.freeze({
   __proto__: null,
   NsButton: NsButton,
-  NsEmptyState: __vue_component__$10,
+  NsEmptyState: __vue_component__$14,
   NsPictogram: NsPictogram,
-  NsCodeSnippet: __vue_component__$_,
+  NsCodeSnippet: __vue_component__$12,
   NsInlineNotification: NsInlineNotification,
   NsProgressBar: NsProgressBar,
   NsSvg: NsSvg,
-  NsTile: __vue_component__$U,
-  NsToastNotification: __vue_component__$S,
-  NsInfoCard: __vue_component__$Q,
-  NsStatusCard: __vue_component__$O,
-  NsSystemdServiceCard: __vue_component__$M,
-  NsPasswordInput: __vue_component__$J,
-  NsIconMenu: __vue_component__$H,
-  NsMeterChart: __vue_component__$F,
+  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,
   NsLottieAnimation: NsLottieAnimation,
-  NsDangerDeleteModal: __vue_component__$C,
+  NsDangerDeleteModal: __vue_component__$G,
   NsCircleTimer: NsCircleTimer,
-  NsDropdownAction: __vue_component__$A,
+  NsDropdownAction: __vue_component__$E,
   NsTextInput: NsTextInput,
-  NsBackupCard: __vue_component__$x,
-  NsWizard: __vue_component__$v,
-  NsMenuItem: __vue_component__$t,
-  NsMenuDivider: __vue_component__$r,
-  NsSystemLogsCard: __vue_component__$p,
+  NsBackupCard: __vue_component__$B,
+  NsWizard: __vue_component__$z,
+  NsMenuItem: __vue_component__$x,
+  NsMenuDivider: __vue_component__$v,
+  NsSystemLogsCard: __vue_component__$t,
   NsModal: NsModal,
-  NsTimePicker: __vue_component__$n,
-  NsDataTable: __vue_component__$k,
+  NsTimePicker: __vue_component__$r,
+  NsDataTable: __vue_component__$o,
   NsPagination: NsPagination,
-  NsToggle: __vue_component__$i,
+  NsToggle: __vue_component__$m,
   NsTag: NsTag,
-  NsMultiSelect: __vue_component__$f,
+  NsMultiSelect: __vue_component__$j,
+  NsComboBox: __vue_component__$h,
+  NsCheckbox: __vue_component__$f,
   ExclamationMarkPictogram: ExclamationMarkPictogram,
   GearPictogram: __vue_component__$d,
   LovePictogram: __vue_component__$b,
@@ -22151,4 +23064,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__$x as NsBackupCard, NsButton, NsCircleTimer, __vue_component__$_ as NsCodeSnippet, __vue_component__$C as NsDangerDeleteModal, __vue_component__$k as NsDataTable, __vue_component__$A as NsDropdownAction, __vue_component__$10 as NsEmptyState, __vue_component__$H as NsIconMenu, __vue_component__$Q as NsInfoCard, NsInlineNotification, NsLottieAnimation, __vue_component__$r as NsMenuDivider, __vue_component__$t as NsMenuItem, __vue_component__$F as NsMeterChart, NsModal, __vue_component__$f as NsMultiSelect, NsPagination, __vue_component__$J as NsPasswordInput, NsPictogram, NsProgressBar, __vue_component__$O as NsStatusCard, NsSvg, __vue_component__$p as NsSystemLogsCard, __vue_component__$M as NsSystemdServiceCard, NsTag, NsTextInput, __vue_component__$U as NsTile, __vue_component__$n as NsTimePicker, __vue_component__$S as NsToastNotification, __vue_component__$i as NsToggle, __vue_component__$v 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__$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 };