npm - @nethserver/ns8-ui-lib - Versions diffs - 0.0.91 → 0.0.94 - Mend

@nethserver/ns8-ui-lib 0.0.91 → 0.0.94

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 (5) hide show

package/dist/ns8-ui-lib.esm.js +594 -405
package/dist/ns8-ui-lib.min.js +1 -1
package/dist/ns8-ui-lib.ssr.js +529 -388
package/package.json +1 -1
package/src/lib-components/NsToggle.vue +84 -0

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

@@ -1,4 +1,4 @@
-import { CvButton, CvIconButton, CvInlineNotification, CvTile, CvToastNotification, CvLink, CvTooltip, CvTag, CvTextInput, CvOverflowMenu, CvModal, CvPagination, CvDataTable, CvDataTableHeading, CvDataTableRow, CvDataTableCell, CvCheckbox } from '@carbon/vue';
+import { CvButton, CvIconButton, CvInlineNotification, CvTile, CvToastNotification, CvLink, CvTooltip, CvTag, CvTextInput, CvOverflowMenu, CvModal, CvPagination, CvDataTable, CvDataTableHeading, CvDataTableRow, CvDataTableCell, CvCheckbox, CvToggle } from '@carbon/vue';
 import LottieAnimation from 'lottie-web-vue';
 import Copy20 from '@carbon/icons-vue/es/copy/20';
 import ChevronDown20 from '@carbon/icons-vue/es/chevron--down/20';
@@ -94,13 +94,18 @@ import Column20 from '@carbon/icons-vue/es/column/20';
 import Catalog20 from '@carbon/icons-vue/es/catalog/20';
 import Catalog32 from '@carbon/icons-vue/es/catalog/32';
 import Group20 from '@carbon/icons-vue/es/group/20';
+import Router32 from '@carbon/icons-vue/es/router/32';
+import Router20 from '@carbon/icons-vue/es/router/20';
+import Certificate32 from '@carbon/icons-vue/es/certificate/32';
+import Certificate20 from '@carbon/icons-vue/es/certificate/20';
+import BareMetalServer20 from '@carbon/icons-vue/es/bare-metal-server/20';
 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';
 import ChevronRight16 from '@carbon/icons-vue/es/chevron--right/16';
 //
-var script$t = {
+var script$u = {
   name: "NsButton",
   extends: CvButton,
   props: {
@@ -263,10 +268,10 @@ function addStyle(id, css) {
 }
 /* script */
-const __vue_script__$t = script$t;
+const __vue_script__$u = script$u;
 /* template */
-var __vue_render__$z = function () {
+var __vue_render__$A = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -289,10 +294,10 @@ var __vue_render__$z = function () {
   }) : _vm._e()], 2);
 };
-var __vue_staticRenderFns__$z = [];
+var __vue_staticRenderFns__$A = [];
 /* style */
-const __vue_inject_styles__$B = function (inject) {
+const __vue_inject_styles__$C = 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)}}",
@@ -303,23 +308,23 @@ const __vue_inject_styles__$B = function (inject) {
 /* scoped */
-const __vue_scope_id__$B = "data-v-025b0f12";
+const __vue_scope_id__$C = "data-v-025b0f12";
 /* module identifier */
-const __vue_module_identifier__$B = undefined;
+const __vue_module_identifier__$C = undefined;
 /* functional template */
-const __vue_is_functional_template__$B = false;
+const __vue_is_functional_template__$C = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$$ = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$z,
-  staticRenderFns: __vue_staticRenderFns__$z
-}, __vue_inject_styles__$B, __vue_script__$t, __vue_scope_id__$B, __vue_is_functional_template__$B, __vue_module_identifier__$B, false, createInjector, undefined, undefined);
+const __vue_component__$11 = /*#__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, createInjector, undefined, undefined);
-var NsButton = __vue_component__$$;
+var NsButton = __vue_component__$11;
 //
 //
@@ -337,7 +342,7 @@ var NsButton = __vue_component__$$;
 //
 //
 //
-var script$s = {
+var script$t = {
   name: "NsPictogram",
   props: {
     title: {
@@ -360,10 +365,10 @@ var script$s = {
 };
 /* script */
-const __vue_script__$s = script$s;
+const __vue_script__$t = script$t;
 /* template */
-var __vue_render__$y = function () {
+var __vue_render__$z = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -391,34 +396,34 @@ var __vue_render__$y = function () {
   }, [_vm._t("default")], 2)]);
 };
-var __vue_staticRenderFns__$y = [];
+var __vue_staticRenderFns__$z = [];
 /* style */
-const __vue_inject_styles__$A = undefined;
+const __vue_inject_styles__$B = undefined;
 /* scoped */
-const __vue_scope_id__$A = undefined;
+const __vue_scope_id__$B = undefined;
 /* module identifier */
-const __vue_module_identifier__$A = undefined;
+const __vue_module_identifier__$B = undefined;
 /* functional template */
-const __vue_is_functional_template__$A = false;
+const __vue_is_functional_template__$B = false;
 /* style inject */
 /* 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__$s, __vue_scope_id__$A, __vue_is_functional_template__$A, __vue_module_identifier__$A, false, undefined, undefined, undefined);
+const __vue_component__$10 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$z,
+  staticRenderFns: __vue_staticRenderFns__$z
+}, __vue_inject_styles__$B, __vue_script__$t, __vue_scope_id__$B, __vue_is_functional_template__$B, __vue_module_identifier__$B, false, undefined, undefined, undefined);
-var NsPictogram = __vue_component__$_;
+var NsPictogram = __vue_component__$10;
 //
-var script$r = {
+var script$s = {
   name: "NsLottieAnimation",
   components: {
     LottieAnimation
@@ -474,10 +479,10 @@ var script$r = {
 };
 /* script */
-const __vue_script__$r = script$r;
+const __vue_script__$s = script$s;
 /* template */
-var __vue_render__$x = function () {
+var __vue_render__$y = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -504,36 +509,36 @@ var __vue_render__$x = function () {
   })], 1);
 };
-var __vue_staticRenderFns__$x = [];
+var __vue_staticRenderFns__$y = [];
 /* style */
-const __vue_inject_styles__$z = undefined;
+const __vue_inject_styles__$A = undefined;
 /* scoped */
-const __vue_scope_id__$z = "data-v-14e97a70";
+const __vue_scope_id__$A = "data-v-14e97a70";
 /* module identifier */
-const __vue_module_identifier__$z = undefined;
+const __vue_module_identifier__$A = undefined;
 /* functional template */
-const __vue_is_functional_template__$z = false;
+const __vue_is_functional_template__$A = false;
 /* style inject */
 /* 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__$r, __vue_scope_id__$z, __vue_is_functional_template__$z, __vue_module_identifier__$z, false, undefined, undefined, undefined);
+const __vue_component__$$ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$y,
+  staticRenderFns: __vue_staticRenderFns__$y
+}, __vue_inject_styles__$A, __vue_script__$s, __vue_scope_id__$A, __vue_is_functional_template__$A, __vue_module_identifier__$A, false, undefined, undefined, undefined);
-var NsLottieAnimation = __vue_component__$Z;
+var NsLottieAnimation = __vue_component__$$;
 /* script */
 /* template */
-var __vue_render__$w = function () {
+var __vue_render__$x = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -548,34 +553,34 @@ var __vue_render__$w = function () {
   });
 };
-var __vue_staticRenderFns__$w = [];
+var __vue_staticRenderFns__$x = [];
 /* style */
-const __vue_inject_styles__$y = undefined;
+const __vue_inject_styles__$z = undefined;
 /* scoped */
-const __vue_scope_id__$y = undefined;
+const __vue_scope_id__$z = undefined;
 /* module identifier */
-const __vue_module_identifier__$y = undefined;
+const __vue_module_identifier__$z = undefined;
 /* functional template */
-const __vue_is_functional_template__$y = false;
+const __vue_is_functional_template__$z = false;
 /* style inject */
 /* 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_scope_id__$y, __vue_is_functional_template__$y, __vue_module_identifier__$y, false, undefined, undefined, undefined);
+const __vue_component__$_ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$x,
+  staticRenderFns: __vue_staticRenderFns__$x
+}, __vue_inject_styles__$z, {}, __vue_scope_id__$z, __vue_is_functional_template__$z, __vue_module_identifier__$z, false, undefined, undefined, undefined);
-var ExclamationMarkPictogram = __vue_component__$Y;
+var ExclamationMarkPictogram = __vue_component__$_;
 //
-var script$q = {
+var script$r = {
   name: "NsEmptyState",
   components: {
     NsPictogram,
@@ -607,10 +612,10 @@ var script$q = {
 };
 /* script */
-const __vue_script__$q = script$q;
+const __vue_script__$r = script$r;
 /* template */
-var __vue_render__$v = function () {
+var __vue_render__$w = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -640,10 +645,10 @@ var __vue_render__$v = function () {
   }, [_vm._t("description")], 2)] : _vm._e()], 2);
 };
-var __vue_staticRenderFns__$v = [];
+var __vue_staticRenderFns__$w = [];
 /* style */
-const __vue_inject_styles__$x = function (inject) {
+const __vue_inject_styles__$y = 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}",
@@ -654,26 +659,26 @@ const __vue_inject_styles__$x = function (inject) {
 /* scoped */
-const __vue_scope_id__$x = "data-v-2d5d3a58";
+const __vue_scope_id__$y = "data-v-2d5d3a58";
 /* module identifier */
-const __vue_module_identifier__$x = undefined;
+const __vue_module_identifier__$y = undefined;
 /* functional template */
-const __vue_is_functional_template__$x = false;
+const __vue_is_functional_template__$y = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$W = /*#__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__$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);
-var __vue_component__$X = __vue_component__$W;
+var __vue_component__$Z = __vue_component__$Y;
 //
-var script$p = {
+var script$q = {
   name: "NsCodeSnippet",
   components: {
     CvButton,
@@ -785,10 +790,10 @@ var script$p = {
 };
 /* script */
-const __vue_script__$p = script$p;
+const __vue_script__$q = script$q;
 /* template */
-var __vue_render__$u = function () {
+var __vue_render__$v = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -850,10 +855,10 @@ var __vue_render__$u = function () {
   })], 1) : _vm._e()], 1);
 };
-var __vue_staticRenderFns__$u = [];
+var __vue_staticRenderFns__$v = [];
 /* style */
-const __vue_inject_styles__$w = function (inject) {
+const __vue_inject_styles__$x = 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}",
@@ -864,23 +869,23 @@ const __vue_inject_styles__$w = function (inject) {
 /* scoped */
-const __vue_scope_id__$w = "data-v-59cb538c";
+const __vue_scope_id__$x = "data-v-59cb538c";
 /* module identifier */
-const __vue_module_identifier__$w = undefined;
+const __vue_module_identifier__$x = undefined;
 /* functional template */
-const __vue_is_functional_template__$w = false;
+const __vue_is_functional_template__$x = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$U = /*#__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__$W = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$v,
+  staticRenderFns: __vue_staticRenderFns__$v
+}, __vue_inject_styles__$x, __vue_script__$q, __vue_scope_id__$x, __vue_is_functional_template__$x, __vue_module_identifier__$x, false, createInjector, undefined, undefined);
-var __vue_component__$V = __vue_component__$U;
+var __vue_component__$X = __vue_component__$W;
 //
 //
@@ -911,7 +916,7 @@ var __vue_component__$V = __vue_component__$U;
 //
 //
 //
-var script$o = {
+var script$p = {
   name: "NsCircleTimer",
   props: {
     timeLimit: {
@@ -975,10 +980,10 @@ var script$o = {
 };
 /* script */
-const __vue_script__$o = script$o;
+const __vue_script__$p = script$p;
 /* template */
-var __vue_render__$t = function () {
+var __vue_render__$u = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -1014,10 +1019,10 @@ var __vue_render__$t = function () {
   })])])]);
 };
-var __vue_staticRenderFns__$t = [];
+var __vue_staticRenderFns__$u = [];
 /* style */
-const __vue_inject_styles__$v = function (inject) {
+const __vue_inject_styles__$w = 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)}",
@@ -1028,26 +1033,26 @@ const __vue_inject_styles__$v = function (inject) {
 /* scoped */
-const __vue_scope_id__$v = "data-v-79cb7082";
+const __vue_scope_id__$w = "data-v-79cb7082";
 /* module identifier */
-const __vue_module_identifier__$v = undefined;
+const __vue_module_identifier__$w = undefined;
 /* functional template */
-const __vue_is_functional_template__$v = 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__$v, __vue_script__$o, __vue_scope_id__$v, __vue_is_functional_template__$v, __vue_module_identifier__$v, false, createInjector, undefined, undefined);
+const __vue_component__$V = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$u,
+  staticRenderFns: __vue_staticRenderFns__$u
+}, __vue_inject_styles__$w, __vue_script__$p, __vue_scope_id__$w, __vue_is_functional_template__$w, __vue_module_identifier__$w, false, createInjector, undefined, undefined);
-var NsCircleTimer = __vue_component__$T;
+var NsCircleTimer = __vue_component__$V;
 //
-var script$n = {
+var script$o = {
   name: "NsInlineNotification",
   extends: CvInlineNotification,
   components: {
@@ -1084,10 +1089,10 @@ var script$n = {
 };
 /* script */
-const __vue_script__$n = script$n;
+const __vue_script__$o = script$o;
 /* template */
-var __vue_render__$s = function () {
+var __vue_render__$t = function () {
   var _obj;
   var _vm = this;
@@ -1158,10 +1163,10 @@ var __vue_render__$s = function () {
   })], 1) : _vm._e()]);
 };
-var __vue_staticRenderFns__$s = [];
+var __vue_staticRenderFns__$t = [];
 /* style */
-const __vue_inject_styles__$u = function (inject) {
+const __vue_inject_styles__$v = function (inject) {
   if (!inject) return;
   inject("data-v-59312d66_0", {
     source: ".title[data-v-59312d66]{margin-right:.75rem;margin-bottom:.2rem;font-size:.875rem!important;font-weight:600!important}.mg-right[data-v-59312d66]{margin-right:.75rem}.details[data-v-59312d66]{flex-grow:0}.action-button[data-v-59312d66]{margin-right:.5rem}.bx--inline-notification__close-button[data-v-59312d66]{position:absolute!important}.bx--inline-notification__text-wrapper p[data-v-59312d66]{padding-right:0!important}",
@@ -1172,23 +1177,23 @@ const __vue_inject_styles__$u = function (inject) {
 /* scoped */
-const __vue_scope_id__$u = "data-v-59312d66";
+const __vue_scope_id__$v = "data-v-59312d66";
 /* module identifier */
-const __vue_module_identifier__$u = undefined;
+const __vue_module_identifier__$v = undefined;
 /* functional template */
-const __vue_is_functional_template__$u = false;
+const __vue_is_functional_template__$v = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$S = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$s,
-  staticRenderFns: __vue_staticRenderFns__$s
-}, __vue_inject_styles__$u, __vue_script__$n, __vue_scope_id__$u, __vue_is_functional_template__$u, __vue_module_identifier__$u, false, createInjector, undefined, undefined);
+const __vue_component__$U = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$t,
+  staticRenderFns: __vue_staticRenderFns__$t
+}, __vue_inject_styles__$v, __vue_script__$o, __vue_scope_id__$v, __vue_is_functional_template__$v, __vue_module_identifier__$v, false, createInjector, undefined, undefined);
-var NsInlineNotification = __vue_component__$S;
+var NsInlineNotification = __vue_component__$U;
 //
 //
@@ -1227,7 +1232,7 @@ var NsInlineNotification = __vue_component__$S;
 //
 //
 //
-var script$m = {
+var script$n = {
   name: "NsProgressBar",
   props: {
     value: {
@@ -1301,10 +1306,10 @@ var script$m = {
 };
 /* script */
-const __vue_script__$m = script$m;
+const __vue_script__$n = script$n;
 /* template */
-var __vue_render__$r = function () {
+var __vue_render__$s = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -1343,13 +1348,13 @@ var __vue_render__$r = function () {
   })]], 2)]);
 };
-var __vue_staticRenderFns__$r = [];
+var __vue_staticRenderFns__$s = [];
 /* style */
-const __vue_inject_styles__$t = function (inject) {
+const __vue_inject_styles__$u = function (inject) {
   if (!inject) return;
-  inject("data-v-703889d8_0", {
-    source: ".progress-bar-container[data-v-703889d8]{width:100%;position:relative}.slider[data-v-703889d8]{position:absolute;width:100%;overflow-x:hidden}.line[data-v-703889d8]{position:absolute;opacity:.4;width:100%}.progress-line[data-v-703889d8]{position:absolute}.indeterminate-line[data-v-703889d8]{position:absolute;opacity:.4;width:150%}.indeterminate-subline[data-v-703889d8]{position:absolute}.inc[data-v-703889d8]{animation:increase-data-v-703889d8 2s infinite}.dec[data-v-703889d8]{animation:decrease-data-v-703889d8 2s .5s infinite}@keyframes increase-data-v-703889d8{from{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes decrease-data-v-703889d8{from{left:-80%;width:80%}to{left:110%;width:10%}}",
+  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%}}",
     map: undefined,
     media: undefined
   });
@@ -1357,25 +1362,25 @@ const __vue_inject_styles__$t = function (inject) {
 /* scoped */
-const __vue_scope_id__$t = "data-v-703889d8";
+const __vue_scope_id__$u = "data-v-7c7ba0aa";
 /* module identifier */
-const __vue_module_identifier__$t = undefined;
+const __vue_module_identifier__$u = undefined;
 /* functional template */
-const __vue_is_functional_template__$t = false;
+const __vue_is_functional_template__$u = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$R = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$r,
-  staticRenderFns: __vue_staticRenderFns__$r
-}, __vue_inject_styles__$t, __vue_script__$m, __vue_scope_id__$t, __vue_is_functional_template__$t, __vue_module_identifier__$t, false, createInjector, undefined, undefined);
+const __vue_component__$T = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$s,
+  staticRenderFns: __vue_staticRenderFns__$s
+}, __vue_inject_styles__$u, __vue_script__$n, __vue_scope_id__$u, __vue_is_functional_template__$u, __vue_module_identifier__$u, false, createInjector, undefined, undefined);
-var NsProgressBar = __vue_component__$R;
+var NsProgressBar = __vue_component__$T;
-var script$l = {
+var script$m = {
   name: "NsSvg",
   props: {
     svg: {
@@ -1434,33 +1439,33 @@ var script$l = {
 };
 /* script */
-const __vue_script__$l = script$l;
+const __vue_script__$m = script$m;
 /* template */
 /* style */
-const __vue_inject_styles__$s = undefined;
+const __vue_inject_styles__$t = undefined;
 /* scoped */
-const __vue_scope_id__$s = undefined;
+const __vue_scope_id__$t = undefined;
 /* module identifier */
-const __vue_module_identifier__$s = undefined;
+const __vue_module_identifier__$t = undefined;
 /* functional template */
-const __vue_is_functional_template__$s = undefined;
+const __vue_is_functional_template__$t = undefined;
 /* style inject */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$Q = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$s, __vue_script__$l, __vue_scope_id__$s, __vue_is_functional_template__$s, __vue_module_identifier__$s, false, undefined, undefined, undefined);
+const __vue_component__$S = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$t, __vue_script__$m, __vue_scope_id__$t, __vue_is_functional_template__$t, __vue_module_identifier__$t, false, undefined, undefined, undefined);
-var NsSvg = __vue_component__$Q;
+var NsSvg = __vue_component__$S;
 //
-var script$k = {
+var script$l = {
   name: "NsTile",
   extends: CvTile,
   inheritAttrs: false,
@@ -1534,10 +1539,10 @@ var script$k = {
 };
 /* script */
-const __vue_script__$k = script$k;
+const __vue_script__$l = script$l;
 /* template */
-var __vue_render__$q = function () {
+var __vue_render__$r = function () {
   var _obj;
   var _vm = this;
@@ -1576,10 +1581,10 @@ var __vue_render__$q = function () {
   }) : _vm._e()], 1);
 };
-var __vue_staticRenderFns__$q = [];
+var __vue_staticRenderFns__$r = [];
 /* style */
-const __vue_inject_styles__$r = function (inject) {
+const __vue_inject_styles__$s = 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}",
@@ -1590,23 +1595,23 @@ const __vue_inject_styles__$r = function (inject) {
 /* scoped */
-const __vue_scope_id__$r = "data-v-443a91f0";
+const __vue_scope_id__$s = "data-v-443a91f0";
 /* module identifier */
-const __vue_module_identifier__$r = undefined;
+const __vue_module_identifier__$s = undefined;
 /* functional template */
-const __vue_is_functional_template__$r = false;
+const __vue_is_functional_template__$s = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$O = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$q,
-  staticRenderFns: __vue_staticRenderFns__$q
-}, __vue_inject_styles__$r, __vue_script__$k, __vue_scope_id__$r, __vue_is_functional_template__$r, __vue_module_identifier__$r, false, createInjector, undefined, undefined);
+const __vue_component__$Q = /*#__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__$P = __vue_component__$O;
+var __vue_component__$R = __vue_component__$Q;
 function toInteger(dirtyNumber) {
   if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
@@ -6203,7 +6208,7 @@ var DateTimeService = {
 };
 //
-var script$j = {
+var script$k = {
   name: "NsToastNotification",
   extends: CvToastNotification,
   components: {
@@ -6281,10 +6286,10 @@ var script$j = {
 };
 /* script */
-const __vue_script__$j = script$j;
+const __vue_script__$k = script$k;
 /* template */
-var __vue_render__$p = function () {
+var __vue_render__$q = function () {
   var _obj;
   var _vm = this;
@@ -6382,10 +6387,10 @@ var __vue_render__$p = function () {
   })], 1) : _vm._e()], 1)]);
 };
-var __vue_staticRenderFns__$p = [];
+var __vue_staticRenderFns__$q = [];
 /* style */
-const __vue_inject_styles__$q = function (inject) {
+const __vue_inject_styles__$r = 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}",
@@ -6400,26 +6405,26 @@ const __vue_inject_styles__$q = function (inject) {
 /* scoped */
-const __vue_scope_id__$q = "data-v-6ff0b515";
+const __vue_scope_id__$r = "data-v-6ff0b515";
 /* module identifier */
-const __vue_module_identifier__$q = undefined;
+const __vue_module_identifier__$r = undefined;
 /* functional template */
-const __vue_is_functional_template__$q = false;
+const __vue_is_functional_template__$r = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$M = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$p,
-  staticRenderFns: __vue_staticRenderFns__$p
-}, __vue_inject_styles__$q, __vue_script__$j, __vue_scope_id__$q, __vue_is_functional_template__$q, __vue_module_identifier__$q, false, createInjector, undefined, undefined);
+const __vue_component__$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 __vue_component__$N = __vue_component__$M;
+var __vue_component__$P = __vue_component__$O;
 //
-var script$i = {
+var script$j = {
   name: "NsInfoCard",
   components: {
     NsSvg,
@@ -6470,10 +6475,10 @@ var script$i = {
 };
 /* script */
-const __vue_script__$i = script$i;
+const __vue_script__$j = script$j;
 /* template */
-var __vue_render__$o = function () {
+var __vue_render__$p = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -6530,10 +6535,10 @@ var __vue_render__$o = function () {
   }, [_vm.hasContentSlot ? _vm._t("content") : _vm._e()], 2)], 2);
 };
-var __vue_staticRenderFns__$o = [];
+var __vue_staticRenderFns__$p = [];
 /* style */
-const __vue_inject_styles__$p = function (inject) {
+const __vue_inject_styles__$q = 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}",
@@ -6544,26 +6549,26 @@ const __vue_inject_styles__$p = function (inject) {
 /* scoped */
-const __vue_scope_id__$p = "data-v-aefc1c3e";
+const __vue_scope_id__$q = "data-v-aefc1c3e";
 /* module identifier */
-const __vue_module_identifier__$p = undefined;
+const __vue_module_identifier__$q = undefined;
 /* functional template */
-const __vue_is_functional_template__$p = false;
+const __vue_is_functional_template__$q = 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__$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__$L = __vue_component__$K;
+var __vue_component__$N = __vue_component__$M;
 //
-var script$h = {
+var script$i = {
   name: "NsStatusCard",
   //components added for storybook to work
   components: {
@@ -6610,10 +6615,10 @@ var script$h = {
 };
 /* script */
-const __vue_script__$h = script$h;
+const __vue_script__$i = script$i;
 /* template */
-var __vue_render__$n = function () {
+var __vue_render__$o = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -6682,10 +6687,10 @@ var __vue_render__$n = function () {
   }, [_c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])]) : _c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])], 1) : _vm._e()])]);
 };
-var __vue_staticRenderFns__$n = [];
+var __vue_staticRenderFns__$o = [];
 /* style */
-const __vue_inject_styles__$o = function (inject) {
+const __vue_inject_styles__$p = 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}",
@@ -6696,26 +6701,26 @@ const __vue_inject_styles__$o = function (inject) {
 /* scoped */
-const __vue_scope_id__$o = "data-v-496044f0";
+const __vue_scope_id__$p = "data-v-496044f0";
 /* module identifier */
-const __vue_module_identifier__$o = undefined;
+const __vue_module_identifier__$p = undefined;
 /* functional template */
-const __vue_is_functional_template__$o = false;
+const __vue_is_functional_template__$p = 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__$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__$J = __vue_component__$I;
+var __vue_component__$L = __vue_component__$K;
 //
-var script$g = {
+var script$h = {
   name: "NsSystemdServiceCard",
   //components added for storybook to work
   components: {
@@ -6769,10 +6774,10 @@ var script$g = {
 };
 /* script */
-const __vue_script__$g = script$g;
+const __vue_script__$h = script$h;
 /* template */
-var __vue_render__$m = function () {
+var __vue_render__$n = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -6827,10 +6832,10 @@ var __vue_render__$m = function () {
   })], 1)])]);
 };
-var __vue_staticRenderFns__$m = [];
+var __vue_staticRenderFns__$n = [];
 /* style */
-const __vue_inject_styles__$n = function (inject) {
+const __vue_inject_styles__$o = 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}",
@@ -6841,26 +6846,26 @@ const __vue_inject_styles__$n = function (inject) {
 /* scoped */
-const __vue_scope_id__$n = "data-v-bf751eca";
+const __vue_scope_id__$o = "data-v-bf751eca";
 /* module identifier */
-const __vue_module_identifier__$n = undefined;
+const __vue_module_identifier__$o = undefined;
 /* functional template */
-const __vue_is_functional_template__$n = false;
+const __vue_is_functional_template__$o = 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__$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__$H = __vue_component__$G;
+var __vue_component__$J = __vue_component__$I;
 //
-var script$f = {
+var script$g = {
   name: "NsTextInput",
   extends: CvTextInput,
   components: {
@@ -6915,10 +6920,10 @@ var script$f = {
 };
 /* script */
-const __vue_script__$f = script$f;
+const __vue_script__$g = script$g;
 /* template */
-var __vue_render__$l = function () {
+var __vue_render__$m = function () {
   var _obj, _obj$1, _obj$2, _obj$3, _obj$4, _obj$5;
   var _vm = this;
@@ -7000,10 +7005,10 @@ var __vue_render__$l = function () {
   })], 2) : _vm._e()]);
 };
-var __vue_staticRenderFns__$l = [];
+var __vue_staticRenderFns__$m = [];
 /* style */
-const __vue_inject_styles__$m = function (inject) {
+const __vue_inject_styles__$n = function (inject) {
   if (!inject) return;
   inject("data-v-eae7353a_0", {
     source: ".tooltip[data-v-eae7353a]{display:inline-block;position:absolute}.prefix[data-v-eae7353a]{font-weight:700;margin-right:.5rem;color:#525252}.align-items-center[data-v-eae7353a]{align-items:center}",
@@ -7018,23 +7023,23 @@ const __vue_inject_styles__$m = function (inject) {
 /* scoped */
-const __vue_scope_id__$m = "data-v-eae7353a";
+const __vue_scope_id__$n = "data-v-eae7353a";
 /* module identifier */
-const __vue_module_identifier__$m = undefined;
+const __vue_module_identifier__$n = undefined;
 /* functional template */
-const __vue_is_functional_template__$m = false;
+const __vue_is_functional_template__$n = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$F = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$l,
-  staticRenderFns: __vue_staticRenderFns__$l
-}, __vue_inject_styles__$m, __vue_script__$f, __vue_scope_id__$m, __vue_is_functional_template__$m, __vue_module_identifier__$m, false, createInjector, undefined, undefined);
+const __vue_component__$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, createInjector, undefined, undefined);
-var NsTextInput = __vue_component__$F;
+var NsTextInput = __vue_component__$H;
 // Unique ID creation requires a high quality random # generator.  In node.js
 // this is pretty straight-forward - we use the crypto API.
@@ -7505,13 +7510,59 @@ var UtilService = {
      */
     getUuid() {
       return uuid_1.v4();
+    },
+    /**
+     * Get a readable label for a node
+     */
+    getNodeLabel(node) {
+      return node.ui_name ? node.ui_name + " (" + this.$t("common.node") + " " + node.id + ")" : this.$t("common.node") + " " + node.id;
+    },
+    /**
+     * Get a readable short label for a node
+     */
+    getShortNodeLabel(node) {
+      return node.ui_name ? node.ui_name : this.$t("common.node") + " " + node.id;
+    },
+    /**
+     * Get a i18n string using a fallback key if necessary. Used for common validation errors
+     */
+    getI18nStringWithFallback(key, fallbackKey, coreContext, args) {
+      if (this.$te(key)) {
+        return this.$t(key, args);
+      } // fallback
+      if (this.$te(fallbackKey)) {
+        return this.$t(fallbackKey, args);
+      }
+      if (!coreContext) {
+        // return key as is
+        return key;
+      } // try on core context
+      if (coreContext.$te(key)) {
+        return coreContext.$t(key, args);
+      } // fallback on core context
+      if (coreContext.$te(fallbackKey)) {
+        return coreContext.$t(fallbackKey, args);
+      } // return key as is
+      return key;
     }
   }
 };
 //
-var script$e = {
+var script$f = {
   name: "NsPasswordInput",
   components: {
     NsTextInput
@@ -7676,10 +7727,10 @@ var script$e = {
 };
 /* script */
-const __vue_script__$e = script$e;
+const __vue_script__$f = script$f;
 /* template */
-var __vue_render__$k = function () {
+var __vue_render__$l = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -7774,10 +7825,10 @@ var __vue_render__$k = function () {
   }, [_vm._v(_vm._s(_vm.equalLabel))])])], 1)]);
 };
-var __vue_staticRenderFns__$k = [];
+var __vue_staticRenderFns__$l = [];
 /* style */
-const __vue_inject_styles__$l = function (inject) {
+const __vue_inject_styles__$m = 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}",
@@ -7788,26 +7839,26 @@ const __vue_inject_styles__$l = function (inject) {
 /* scoped */
-const __vue_scope_id__$l = "data-v-67b93b40";
+const __vue_scope_id__$m = "data-v-67b93b40";
 /* module identifier */
-const __vue_module_identifier__$l = undefined;
+const __vue_module_identifier__$m = undefined;
 /* functional template */
-const __vue_is_functional_template__$l = false;
+const __vue_is_functional_template__$m = false;
 /* 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, 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__$E = __vue_component__$D;
+var __vue_component__$G = __vue_component__$F;
 //
-var script$d = {
+var script$e = {
   name: "NsIconMenu",
   extends: CvOverflowMenu,
   props: {
@@ -7851,10 +7902,10 @@ var script$d = {
 };
 /* script */
-const __vue_script__$d = script$d;
+const __vue_script__$e = script$e;
 /* template */
-var __vue_render__$j = function () {
+var __vue_render__$k = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -7970,10 +8021,10 @@ var __vue_render__$j = function () {
   })])]);
 };
-var __vue_staticRenderFns__$j = [];
+var __vue_staticRenderFns__$k = [];
 /* style */
-const __vue_inject_styles__$k = function (inject) {
+const __vue_inject_styles__$l = function (inject) {
   if (!inject) return;
   inject("data-v-2be14df6_0", {
     source: ".ns-icon-menu[data-v-2be14df6]{display:inline-flex}",
@@ -7984,26 +8035,26 @@ const __vue_inject_styles__$k = function (inject) {
 /* scoped */
-const __vue_scope_id__$k = "data-v-2be14df6";
+const __vue_scope_id__$l = "data-v-2be14df6";
 /* module identifier */
-const __vue_module_identifier__$k = undefined;
+const __vue_module_identifier__$l = undefined;
 /* functional template */
-const __vue_is_functional_template__$k = false;
+const __vue_is_functional_template__$l = 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__$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, createInjector, undefined, undefined);
-var __vue_component__$C = __vue_component__$B;
+var __vue_component__$E = __vue_component__$D;
 //
-var script$c = {
+var script$d = {
   name: "NsMeterChart",
   components: {
     NsProgressBar
@@ -8038,10 +8089,10 @@ var script$c = {
 };
 /* script */
-const __vue_script__$c = script$c;
+const __vue_script__$d = script$d;
 /* template */
-var __vue_render__$i = function () {
+var __vue_render__$j = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -8064,10 +8115,10 @@ var __vue_render__$i = function () {
   })], 1);
 };
-var __vue_staticRenderFns__$i = [];
+var __vue_staticRenderFns__$j = [];
 /* style */
-const __vue_inject_styles__$j = function (inject) {
+const __vue_inject_styles__$k = 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}",
@@ -8078,26 +8129,26 @@ const __vue_inject_styles__$j = function (inject) {
 /* scoped */
-const __vue_scope_id__$j = "data-v-8d83456c";
+const __vue_scope_id__$k = "data-v-8d83456c";
 /* module identifier */
-const __vue_module_identifier__$j = undefined;
+const __vue_module_identifier__$k = undefined;
 /* functional template */
-const __vue_is_functional_template__$j = false;
+const __vue_is_functional_template__$k = false;
 /* 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, createInjector, undefined, undefined);
+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);
-var __vue_component__$A = __vue_component__$z;
+var __vue_component__$C = __vue_component__$B;
 //
-var script$b = {
+var script$c = {
   name: "NsModal",
   extends: CvModal,
   components: {
@@ -8157,10 +8208,10 @@ var script$b = {
 };
 /* script */
-const __vue_script__$b = script$b;
+const __vue_script__$c = script$c;
 /* template */
-var __vue_render__$h = function () {
+var __vue_render__$i = function () {
   var _obj, _obj$1, _obj$2, _obj$3;
   var _vm = this;
@@ -8294,34 +8345,34 @@ var __vue_render__$h = function () {
   })], 1)]);
 };
-var __vue_staticRenderFns__$h = [];
+var __vue_staticRenderFns__$i = [];
 /* style */
-const __vue_inject_styles__$i = undefined;
+const __vue_inject_styles__$j = undefined;
 /* scoped */
-const __vue_scope_id__$i = undefined;
+const __vue_scope_id__$j = undefined;
 /* module identifier */
-const __vue_module_identifier__$i = undefined;
+const __vue_module_identifier__$j = undefined;
 /* functional template */
-const __vue_is_functional_template__$i = false;
+const __vue_is_functional_template__$j = false;
 /* style inject */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$y = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$h,
-  staticRenderFns: __vue_staticRenderFns__$h
-}, __vue_inject_styles__$i, __vue_script__$b, __vue_scope_id__$i, __vue_is_functional_template__$i, __vue_module_identifier__$i, false, undefined, undefined, undefined);
+const __vue_component__$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, undefined, undefined, undefined);
-var NsModal = __vue_component__$y;
+var NsModal = __vue_component__$A;
 //
-var script$a = {
+var script$b = {
   name: "NsDangerDeleteModal",
   //component added for storybook to work
   components: {
@@ -8417,10 +8468,10 @@ var script$a = {
 };
 /* script */
-const __vue_script__$a = script$a;
+const __vue_script__$b = script$b;
 /* template */
-var __vue_render__$g = function () {
+var __vue_render__$h = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -8488,10 +8539,10 @@ var __vue_render__$g = function () {
   }, [_vm._v(_vm._s(_vm.deleteLabel))])], 2);
 };
-var __vue_staticRenderFns__$g = [];
+var __vue_staticRenderFns__$h = [];
 /* style */
-const __vue_inject_styles__$h = function (inject) {
+const __vue_inject_styles__$i = function (inject) {
   if (!inject) return;
   inject("data-v-746a2de3_0", {
     source: ".type-to-confirm[data-v-746a2de3]{margin-top:2rem}",
@@ -8502,23 +8553,23 @@ const __vue_inject_styles__$h = function (inject) {
 /* scoped */
-const __vue_scope_id__$h = "data-v-746a2de3";
+const __vue_scope_id__$i = "data-v-746a2de3";
 /* module identifier */
-const __vue_module_identifier__$h = undefined;
+const __vue_module_identifier__$i = undefined;
 /* functional template */
-const __vue_is_functional_template__$h = false;
+const __vue_is_functional_template__$i = 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__$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);
-var __vue_component__$x = __vue_component__$w;
+var __vue_component__$z = __vue_component__$y;
 var IconService = {
   name: "IconService",
@@ -8644,7 +8695,14 @@ var IconService = {
       Catalog20,
       // system logs
       Catalog32,
-      Group20 // users and groups
+      Group20,
+      // users and groups
+      Router32,
+      // http routes
+      Router20,
+      Certificate32,
+      Certificate20,
+      BareMetalServer20 // acme server
     };
   }
@@ -8652,7 +8710,7 @@ var IconService = {
 };
 //
-var script$9 = {
+var script$a = {
   name: "NsDropdownAction",
   extends: CvOverflowMenu,
   components: {
@@ -8684,10 +8742,10 @@ var script$9 = {
 };
 /* script */
-const __vue_script__$9 = script$9;
+const __vue_script__$a = script$a;
 /* template */
-var __vue_render__$f = function () {
+var __vue_render__$g = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -8787,34 +8845,34 @@ var __vue_render__$f = function () {
   })])]);
 };
-var __vue_staticRenderFns__$f = [];
+var __vue_staticRenderFns__$g = [];
 /* style */
-const __vue_inject_styles__$g = undefined;
+const __vue_inject_styles__$h = undefined;
 /* scoped */
-const __vue_scope_id__$g = "data-v-31925b9d";
+const __vue_scope_id__$h = "data-v-31925b9d";
 /* module identifier */
-const __vue_module_identifier__$g = undefined;
+const __vue_module_identifier__$h = undefined;
 /* functional template */
-const __vue_is_functional_template__$g = false;
+const __vue_is_functional_template__$h = 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__$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, undefined, undefined, undefined);
-var __vue_component__$v = __vue_component__$u;
+var __vue_component__$x = __vue_component__$w;
 //
-var script$8 = {
+var script$9 = {
   name: "NsBackupCardDetails",
   mixins: [DateTimeService],
   props: {
@@ -8850,10 +8908,10 @@ var script$8 = {
 };
 /* script */
-const __vue_script__$8 = script$8;
+const __vue_script__$9 = script$9;
 /* template */
-var __vue_render__$e = function () {
+var __vue_render__$f = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -8907,10 +8965,10 @@ var __vue_render__$e = 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__$e = [];
+var __vue_staticRenderFns__$f = [];
 /* style */
-const __vue_inject_styles__$f = function (inject) {
+const __vue_inject_styles__$g = 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}",
@@ -8921,26 +8979,26 @@ const __vue_inject_styles__$f = function (inject) {
 /* scoped */
-const __vue_scope_id__$f = "data-v-25453d1c";
+const __vue_scope_id__$g = "data-v-25453d1c";
 /* module identifier */
-const __vue_module_identifier__$f = undefined;
+const __vue_module_identifier__$g = undefined;
 /* functional template */
-const __vue_is_functional_template__$f = false;
+const __vue_is_functional_template__$g = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$t = /*#__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__$v = /*#__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, createInjector, undefined, undefined);
-var NsBackupCardDetails = __vue_component__$t;
+var NsBackupCardDetails = __vue_component__$v;
 //
-var script$7 = {
+var script$8 = {
   name: "NsBackupCard",
   components: {
     NsBackupCardDetails
@@ -9081,10 +9139,10 @@ var script$7 = {
 };
 /* script */
-const __vue_script__$7 = script$7;
+const __vue_script__$8 = script$8;
 /* template */
-var __vue_render__$d = function () {
+var __vue_render__$e = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9200,10 +9258,10 @@ var __vue_render__$d = function () {
   }, [_vm._v(_vm._s(_vm.goToBackupLabel) + "\n      ")])], 1)])], 2);
 };
-var __vue_staticRenderFns__$d = [];
+var __vue_staticRenderFns__$e = [];
 /* style */
-const __vue_inject_styles__$e = function (inject) {
+const __vue_inject_styles__$f = 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}",
@@ -9218,26 +9276,26 @@ const __vue_inject_styles__$e = function (inject) {
 /* scoped */
-const __vue_scope_id__$e = "data-v-5a3b7738";
+const __vue_scope_id__$f = "data-v-5a3b7738";
 /* module identifier */
-const __vue_module_identifier__$e = undefined;
+const __vue_module_identifier__$f = undefined;
 /* functional template */
-const __vue_is_functional_template__$e = false;
+const __vue_is_functional_template__$f = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$r = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$d,
-  staticRenderFns: __vue_staticRenderFns__$d
-}, __vue_inject_styles__$e, __vue_script__$7, __vue_scope_id__$e, __vue_is_functional_template__$e, __vue_module_identifier__$e, false, createInjector, undefined, undefined);
+const __vue_component__$t = /*#__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);
-var __vue_component__$s = __vue_component__$r;
+var __vue_component__$u = __vue_component__$t;
 //
-var script$6 = {
+var script$7 = {
   name: "NsWizard",
   extends: NsModal,
   mixins: [IconService],
@@ -9281,10 +9339,10 @@ var script$6 = {
 };
 /* script */
-const __vue_script__$6 = script$6;
+const __vue_script__$7 = script$7;
 /* template */
-var __vue_render__$c = function () {
+var __vue_render__$d = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -9426,34 +9484,34 @@ var __vue_render__$c = function () {
   })], 1)]);
 };
-var __vue_staticRenderFns__$c = [];
+var __vue_staticRenderFns__$d = [];
 /* style */
-const __vue_inject_styles__$d = undefined;
+const __vue_inject_styles__$e = undefined;
 /* scoped */
-const __vue_scope_id__$d = undefined;
+const __vue_scope_id__$e = undefined;
 /* module identifier */
-const __vue_module_identifier__$d = undefined;
+const __vue_module_identifier__$e = undefined;
 /* functional template */
-const __vue_is_functional_template__$d = false;
+const __vue_is_functional_template__$e = false;
 /* style inject */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$p = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$c,
-  staticRenderFns: __vue_staticRenderFns__$c
-}, __vue_inject_styles__$d, __vue_script__$6, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, undefined, undefined, undefined);
+const __vue_component__$r = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$d,
+  staticRenderFns: __vue_staticRenderFns__$d
+}, __vue_inject_styles__$e, __vue_script__$7, __vue_scope_id__$e, __vue_is_functional_template__$e, __vue_module_identifier__$e, false, undefined, undefined, undefined);
-var __vue_component__$q = __vue_component__$p;
+var __vue_component__$s = __vue_component__$r;
 //
-var script$5 = {
+var script$6 = {
   name: "NsMenuItem",
   components: {
     NsSvg
@@ -9476,10 +9534,10 @@ var script$5 = {
 };
 /* script */
-const __vue_script__$5 = script$5;
+const __vue_script__$6 = script$6;
 /* template */
-var __vue_render__$b = function () {
+var __vue_render__$c = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9499,10 +9557,10 @@ var __vue_render__$b = function () {
   }, [_vm._t("icon")], 2) : _vm._e(), _vm._v(" "), _c('span', [_vm._v(_vm._s(_vm.label))])]);
 };
-var __vue_staticRenderFns__$b = [];
+var __vue_staticRenderFns__$c = [];
 /* style */
-const __vue_inject_styles__$c = function (inject) {
+const __vue_inject_styles__$d = 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}",
@@ -9513,26 +9571,26 @@ const __vue_inject_styles__$c = function (inject) {
 /* scoped */
-const __vue_scope_id__$c = "data-v-35f08832";
+const __vue_scope_id__$d = "data-v-35f08832";
 /* module identifier */
-const __vue_module_identifier__$c = undefined;
+const __vue_module_identifier__$d = undefined;
 /* functional template */
-const __vue_is_functional_template__$c = false;
+const __vue_is_functional_template__$d = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$n = /*#__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__$p = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$c,
+  staticRenderFns: __vue_staticRenderFns__$c
+}, __vue_inject_styles__$d, __vue_script__$6, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, createInjector, undefined, undefined);
-var __vue_component__$o = __vue_component__$n;
+var __vue_component__$q = __vue_component__$p;
 //
-var script$4 = {
+var script$5 = {
   name: "NsMenuDivider",
   components: {
     CvSideNavDivider
@@ -9540,10 +9598,10 @@ var script$4 = {
 };
 /* script */
-const __vue_script__$4 = script$4;
+const __vue_script__$5 = script$5;
 /* template */
-var __vue_render__$a = function () {
+var __vue_render__$b = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9553,34 +9611,34 @@ var __vue_render__$a = function () {
   return _c('cv-side-nav-divider');
 };
-var __vue_staticRenderFns__$a = [];
+var __vue_staticRenderFns__$b = [];
 /* style */
-const __vue_inject_styles__$b = undefined;
+const __vue_inject_styles__$c = undefined;
 /* scoped */
-const __vue_scope_id__$b = "data-v-c2c8c17e";
+const __vue_scope_id__$c = "data-v-c2c8c17e";
 /* module identifier */
-const __vue_module_identifier__$b = undefined;
+const __vue_module_identifier__$c = undefined;
 /* functional template */
-const __vue_is_functional_template__$b = false;
+const __vue_is_functional_template__$c = false;
 /* style inject */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$l = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$a,
-  staticRenderFns: __vue_staticRenderFns__$a
-}, __vue_inject_styles__$b, __vue_script__$4, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, undefined, undefined, undefined);
+const __vue_component__$n = /*#__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, undefined, undefined, undefined);
-var __vue_component__$m = __vue_component__$l;
+var __vue_component__$o = __vue_component__$n;
 //
-var script$3 = {
+var script$4 = {
   name: "NsSystemLogsCard",
   mixins: [UtilService, IconService],
   props: {
@@ -9699,10 +9757,10 @@ var script$3 = {
 };
 /* script */
-const __vue_script__$3 = script$3;
+const __vue_script__$4 = script$4;
 /* template */
-var __vue_render__$9 = function () {
+var __vue_render__$a = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -9729,34 +9787,34 @@ var __vue_render__$9 = function () {
   }, [_vm._v("\n      " + _vm._s(_vm.buttonLabel) + "\n    ")])], 1)], 2);
 };
-var __vue_staticRenderFns__$9 = [];
+var __vue_staticRenderFns__$a = [];
 /* style */
-const __vue_inject_styles__$a = undefined;
+const __vue_inject_styles__$b = undefined;
 /* scoped */
-const __vue_scope_id__$a = "data-v-aec74b8e";
+const __vue_scope_id__$b = "data-v-aec74b8e";
 /* module identifier */
-const __vue_module_identifier__$a = undefined;
+const __vue_module_identifier__$b = undefined;
 /* functional template */
-const __vue_is_functional_template__$a = false;
+const __vue_is_functional_template__$b = false;
 /* style inject */
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$j = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$9,
-  staticRenderFns: __vue_staticRenderFns__$9
-}, __vue_inject_styles__$a, __vue_script__$3, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, undefined, undefined, undefined);
+const __vue_component__$l = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$a,
+  staticRenderFns: __vue_staticRenderFns__$a
+}, __vue_inject_styles__$b, __vue_script__$4, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, undefined, undefined, undefined);
-var __vue_component__$k = __vue_component__$j;
+var __vue_component__$m = __vue_component__$l;
 //
-var script$2 = {
+var script$3 = {
   name: "NsTimePicker",
   mixins: [uidMixin, carbonPrefixMixin, themeMixin],
   props: {
@@ -9799,10 +9857,10 @@ var script$2 = {
 };
 /* script */
-const __vue_script__$2 = script$2;
+const __vue_script__$3 = script$3;
 /* template */
-var __vue_render__$8 = function () {
+var __vue_render__$9 = function () {
   var _obj, _obj$1;
   var _vm = this;
@@ -9846,10 +9904,10 @@ var __vue_render__$8 = function () {
   })], 2) : _vm._e()]);
 };
-var __vue_staticRenderFns__$8 = [];
+var __vue_staticRenderFns__$9 = [];
 /* style */
-const __vue_inject_styles__$9 = function (inject) {
+const __vue_inject_styles__$a = 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}",
@@ -9864,23 +9922,23 @@ const __vue_inject_styles__$9 = function (inject) {
 /* scoped */
-const __vue_scope_id__$9 = "data-v-e1e1beb2";
+const __vue_scope_id__$a = "data-v-e1e1beb2";
 /* module identifier */
-const __vue_module_identifier__$9 = undefined;
+const __vue_module_identifier__$a = undefined;
 /* functional template */
-const __vue_is_functional_template__$9 = false;
+const __vue_is_functional_template__$a = false;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$h = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$8,
-  staticRenderFns: __vue_staticRenderFns__$8
-}, __vue_inject_styles__$9, __vue_script__$2, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, false, createInjector, undefined, undefined);
+const __vue_component__$j = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$9,
+  staticRenderFns: __vue_staticRenderFns__$9
+}, __vue_inject_styles__$a, __vue_script__$3, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, createInjector, undefined, undefined);
-var __vue_component__$i = __vue_component__$h;
+var __vue_component__$k = __vue_component__$j;
 /*
  * This component optionally wraps slotted content with the specified tag-type.
@@ -9919,7 +9977,7 @@ var NsWrapper = {
 };
-var script$1 = {
+var script$2 = {
   name: "NsPagination",
   extends: CvPagination,
   props: {
@@ -9997,12 +10055,12 @@ var script$1 = {
 };
 /* script */
-const __vue_script__$1 = script$1;
+const __vue_script__$2 = script$2;
 /* template */
 /* style */
-const __vue_inject_styles__$8 = function (inject) {
+const __vue_inject_styles__$9 = function (inject) {
   if (!inject) return;
   inject("data-v-01f52cb6_0", {
     source: ".cv-pagination .bx--select .bx--label{font-size:100%}",
@@ -10013,20 +10071,20 @@ const __vue_inject_styles__$8 = function (inject) {
 /* scoped */
-const __vue_scope_id__$8 = undefined;
+const __vue_scope_id__$9 = undefined;
 /* module identifier */
-const __vue_module_identifier__$8 = undefined;
+const __vue_module_identifier__$9 = undefined;
 /* functional template */
-const __vue_is_functional_template__$8 = undefined;
+const __vue_is_functional_template__$9 = undefined;
 /* style inject SSR */
 /* style inject shadow dom */
-const __vue_component__$g = /*#__PURE__*/normalizeComponent({}, __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__$i = /*#__PURE__*/normalizeComponent({}, __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 NsPagination = __vue_component__$g;
+var NsPagination = __vue_component__$i;
 var v$3 = "5.6.1";
 var fr$3 = 24;
@@ -17065,7 +17123,7 @@ var LottieService = {
 };
 //
-var script = {
+var script$1 = {
   name: "NsDataTable",
   extends: CvDataTable,
   components: {
@@ -17362,10 +17420,10 @@ var script = {
 };
 /* script */
-const __vue_script__ = script;
+const __vue_script__$1 = script$1;
 /* template */
-var __vue_render__$7 = function () {
+var __vue_render__$8 = function () {
   var _obj, _obj$1, _obj$2, _obj$3;
   var _vm = this;
@@ -17693,6 +17751,136 @@ var __vue_render__$7 = function () {
   }, 'NsPagination', _vm.internalPagination, false)) : _vm._e()], 1)], 2);
 };
+var __vue_staticRenderFns__$8 = [];
+/* style */
+const __vue_inject_styles__$8 = undefined;
+/* scoped */
+const __vue_scope_id__$8 = undefined;
+/* module identifier */
+const __vue_module_identifier__$8 = undefined;
+/* functional template */
+const __vue_is_functional_template__$8 = false;
+/* style inject */
+/* 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, undefined, undefined, undefined);
+var __vue_component__$h = __vue_component__$g;
+//
+var script = {
+  name: "NsToggle",
+  extends: CvToggle,
+  props: {
+    small: Boolean,
+    label: String,
+    formItem: {
+      type: Boolean,
+      default: true
+    },
+    hideLabel: Boolean,
+    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;
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', {
+    class: (_obj = {}, _obj[_vm.carbonPrefix + "--form-item"] = _vm.formItem, _obj)
+  }, [_c('input', _vm._g(_vm._b({
+    ref: "input",
+    class: [_vm.carbonPrefix + "--toggle-input", {
+      'bx--toggle-input--small': _vm.small
+    }],
+    attrs: {
+      "type": "checkbox",
+      "id": _vm.uid,
+      "aria-checked": "" + _vm.isChecked
+    },
+    domProps: {
+      "checked": _vm.isChecked === true,
+      "value": _vm.value
+    }
+  }, 'input', _vm.$attrs, false), _vm.inputListeners)), _vm._v(" "), _c('label', {
+    class: _vm.carbonPrefix + "--toggle-input__label",
+    attrs: {
+      "for": _vm.uid,
+      "aria-label": _vm.hiddenLabel
+    }
+  }, [_c('div', [_vm._v("\n      " + _vm._s(_vm.visibleLabel) + "\n      "), _vm._v(" "), _vm.hasTooltipSlot && !_vm.hideLabel ? _c('cv-interactive-tooltip', {
+    staticClass: "tooltip info",
+    attrs: {
+      "alignment": _vm.tooltipAlignment,
+      "direction": _vm.tooltipDirection
+    }
+  }, [_c('template', {
+    slot: "content"
+  }, [_vm._t("tooltip")], 2)], 2) : _vm._e()], 1), _vm._v(" "), _c('span', {
+    class: _vm.carbonPrefix + "--toggle__switch"
+  }, [_c('svg', {
+    class: _vm.carbonPrefix + "--toggle__check",
+    attrs: {
+      "width": "6px",
+      "height": "5px",
+      "viewBox": "0 0 6 5"
+    }
+  }, [_c('path', {
+    attrs: {
+      "d": "M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z"
+    }
+  })]), _vm._v(" "), _c('span', {
+    class: _vm.carbonPrefix + "--toggle__text--off",
+    attrs: {
+      "aria-hidden": "true"
+    }
+  }, [_vm._t("text-left", function () {
+    return [_vm._v("Off")];
+  })], 2), _vm._v(" "), _c('span', {
+    class: _vm.carbonPrefix + "--toggle__text--on",
+    attrs: {
+      "aria-hidden": "true"
+    }
+  }, [_vm._t("text-right", function () {
+    return [_vm._v("On")];
+  })], 2)])])]);
+};
 var __vue_staticRenderFns__$7 = [];
 /* style */
@@ -18517,34 +18705,35 @@ var filters = {
 var components = /*#__PURE__*/Object.freeze({
   __proto__: null,
   NsButton: NsButton,
-  NsEmptyState: __vue_component__$X,
+  NsEmptyState: __vue_component__$Z,
   NsPictogram: NsPictogram,
-  NsCodeSnippet: __vue_component__$V,
+  NsCodeSnippet: __vue_component__$X,
   NsInlineNotification: NsInlineNotification,
   NsProgressBar: NsProgressBar,
   NsSvg: NsSvg,
-  NsTile: __vue_component__$P,
-  NsToastNotification: __vue_component__$N,
-  NsInfoCard: __vue_component__$L,
-  NsStatusCard: __vue_component__$J,
-  NsSystemdServiceCard: __vue_component__$H,
-  NsPasswordInput: __vue_component__$E,
-  NsIconMenu: __vue_component__$C,
-  NsMeterChart: __vue_component__$A,
+  NsTile: __vue_component__$R,
+  NsToastNotification: __vue_component__$P,
+  NsInfoCard: __vue_component__$N,
+  NsStatusCard: __vue_component__$L,
+  NsSystemdServiceCard: __vue_component__$J,
+  NsPasswordInput: __vue_component__$G,
+  NsIconMenu: __vue_component__$E,
+  NsMeterChart: __vue_component__$C,
   NsLottieAnimation: NsLottieAnimation,
-  NsDangerDeleteModal: __vue_component__$x,
+  NsDangerDeleteModal: __vue_component__$z,
   NsCircleTimer: NsCircleTimer,
-  NsDropdownAction: __vue_component__$v,
+  NsDropdownAction: __vue_component__$x,
   NsTextInput: NsTextInput,
-  NsBackupCard: __vue_component__$s,
-  NsWizard: __vue_component__$q,
-  NsMenuItem: __vue_component__$o,
-  NsMenuDivider: __vue_component__$m,
-  NsSystemLogsCard: __vue_component__$k,
+  NsBackupCard: __vue_component__$u,
+  NsWizard: __vue_component__$s,
+  NsMenuItem: __vue_component__$q,
+  NsMenuDivider: __vue_component__$o,
+  NsSystemLogsCard: __vue_component__$m,
   NsModal: NsModal,
-  NsTimePicker: __vue_component__$i,
-  NsDataTable: __vue_component__$f,
+  NsTimePicker: __vue_component__$k,
+  NsDataTable: __vue_component__$h,
   NsPagination: NsPagination,
+  NsToggle: __vue_component__$f,
   ExclamationMarkPictogram: ExclamationMarkPictogram,
   GearPictogram: __vue_component__$d,
   LovePictogram: __vue_component__$b,
@@ -18572,4 +18761,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__$s as NsBackupCard, NsButton, NsCircleTimer, __vue_component__$V as NsCodeSnippet, __vue_component__$x as NsDangerDeleteModal, __vue_component__$f as NsDataTable, __vue_component__$v as NsDropdownAction, __vue_component__$X as NsEmptyState, __vue_component__$C as NsIconMenu, __vue_component__$L as NsInfoCard, NsInlineNotification, NsLottieAnimation, __vue_component__$m as NsMenuDivider, __vue_component__$o as NsMenuItem, __vue_component__$A as NsMeterChart, NsModal, NsPagination, __vue_component__$E as NsPasswordInput, NsPictogram, NsProgressBar, __vue_component__$J as NsStatusCard, NsSvg, __vue_component__$k as NsSystemLogsCard, __vue_component__$H as NsSystemdServiceCard, NsTextInput, __vue_component__$P as NsTile, __vue_component__$i as NsTimePicker, __vue_component__$N as NsToastNotification, __vue_component__$q 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__$u as NsBackupCard, NsButton, NsCircleTimer, __vue_component__$X as NsCodeSnippet, __vue_component__$z as NsDangerDeleteModal, __vue_component__$h as NsDataTable, __vue_component__$x as NsDropdownAction, __vue_component__$Z as NsEmptyState, __vue_component__$E as NsIconMenu, __vue_component__$N as NsInfoCard, NsInlineNotification, NsLottieAnimation, __vue_component__$o as NsMenuDivider, __vue_component__$q as NsMenuItem, __vue_component__$C as NsMeterChart, NsModal, NsPagination, __vue_component__$G as NsPasswordInput, NsPictogram, NsProgressBar, __vue_component__$L as NsStatusCard, NsSvg, __vue_component__$m as NsSystemLogsCard, __vue_component__$J as NsSystemdServiceCard, NsTextInput, __vue_component__$R as NsTile, __vue_component__$k as NsTimePicker, __vue_component__$P as NsToastNotification, __vue_component__$f as NsToggle, __vue_component__$s 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 };