@nethserver/ns8-ui-lib 0.0.39 → 0.0.43

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

@@ -9,12 +9,9 @@ import Warning20 from '@carbon/icons-vue/es/warning--filled/20';
 import Vue from 'vue';
 import '@carbon/charts/styles.css';
 import chartsVue, { CcvMeterChart } from '@carbon/charts-vue';
-import ErrorFilled16 from '@carbon/icons-vue/es/error--filled/16';
-import CheckmarkFilled16 from '@carbon/icons-vue/es/checkmark--filled/16';
-import WarningFilled16 from '@carbon/icons-vue/es/warning--filled/16';
-import InformationFilled16 from '@carbon/icons-vue/es/information--filled/16';
 import Close20 from '@carbon/icons-vue/es/close/20';
 import ArrowRight20 from '@carbon/icons-vue/es/arrow--right/20';
+import ArrowRight32 from '@carbon/icons-vue/es/arrow--right/32';
 import Notification20 from '@carbon/icons-vue/es/notification/20';
 import UserAvatar20 from '@carbon/icons-vue/es/user--avatar/20';
 import AppSwitcher20 from '@carbon/icons-vue/es/app-switcher/20';
@@ -70,9 +67,17 @@ import Time20 from '@carbon/icons-vue/es/time/20';
 import Time32 from '@carbon/icons-vue/es/time/32';
 import Hourglass20 from '@carbon/icons-vue/es/hourglass/20';
 import Hourglass32 from '@carbon/icons-vue/es/hourglass/32';
+import CheckmarkFilled16 from '@carbon/icons-vue/es/checkmark--filled/16';
+import CheckmarkFilled32 from '@carbon/icons-vue/es/checkmark--filled/32';
+import ErrorFilled16 from '@carbon/icons-vue/es/error--filled/16';
+import ErrorFilled32 from '@carbon/icons-vue/es/error--filled/32';
+import Warning16 from '@carbon/icons-vue/es/warning--filled/16';
+import Warning32 from '@carbon/icons-vue/es/warning--filled/32';
+import { WarningFilled16, WarningAltFilled16, View16, ViewOff16 } from '@carbon/icons-vue';
+import InformationFilled16 from '@carbon/icons-vue/es/information--filled/16';
 
 //
-var script$i = {
+var script$l = {
   name: "NsButton",
   extends: CvButton,
   props: {
@@ -235,10 +240,10 @@ function addStyle(id, css) {
 }
 
 /* script */
-const __vue_script__$i = script$i;
+const __vue_script__$l = script$l;
 /* template */
 
-var __vue_render__$o = function () {
+var __vue_render__$r = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -261,10 +266,10 @@ var __vue_render__$o = function () {
   }) : _vm._e()], 2);
 };
 
-var __vue_staticRenderFns__$o = [];
+var __vue_staticRenderFns__$r = [];
 /* style */
 
-const __vue_inject_styles__$p = function (inject) {
+const __vue_inject_styles__$s = 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)}}",
@@ -275,23 +280,23 @@ const __vue_inject_styles__$p = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$p = "data-v-025b0f12";
+const __vue_scope_id__$s = "data-v-025b0f12";
 /* module identifier */
 
-const __vue_module_identifier__$p = undefined;
+const __vue_module_identifier__$s = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$p = false;
+const __vue_is_functional_template__$s = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$H = /*#__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__$N = /*#__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__$I = __vue_component__$H;
+var __vue_component__$O = __vue_component__$N;
 
 //
 //
@@ -309,7 +314,7 @@ var __vue_component__$I = __vue_component__$H;
 //
 //
 //
-var script$h = {
+var script$k = {
   name: "NsPictogram",
   props: {
     title: {
@@ -332,10 +337,10 @@ var script$h = {
 };
 
 /* script */
-const __vue_script__$h = script$h;
+const __vue_script__$k = script$k;
 /* template */
 
-var __vue_render__$n = function () {
+var __vue_render__$q = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -363,34 +368,34 @@ var __vue_render__$n = function () {
   }, [_vm._t("default")], 2)]);
 };
 
-var __vue_staticRenderFns__$n = [];
+var __vue_staticRenderFns__$q = [];
 /* style */
 
-const __vue_inject_styles__$o = undefined;
+const __vue_inject_styles__$r = undefined;
 /* scoped */
 
-const __vue_scope_id__$o = undefined;
+const __vue_scope_id__$r = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$o = undefined;
+const __vue_module_identifier__$r = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$o = false;
+const __vue_is_functional_template__$r = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$G = /*#__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, undefined, undefined, undefined);
+const __vue_component__$M = /*#__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, undefined, undefined, undefined);
 
-var NsPictogram = __vue_component__$G;
+var NsPictogram = __vue_component__$M;
 
 //
-var script$g = {
+var script$j = {
   name: "NsLottieAnimation",
   components: {
     LottieAnimation
@@ -446,10 +451,10 @@ var script$g = {
 };
 
 /* script */
-const __vue_script__$g = script$g;
+const __vue_script__$j = script$j;
 /* template */
 
-var __vue_render__$m = function () {
+var __vue_render__$p = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -476,36 +481,36 @@ var __vue_render__$m = function () {
   })], 1);
 };
 
-var __vue_staticRenderFns__$m = [];
+var __vue_staticRenderFns__$p = [];
 /* style */
 
-const __vue_inject_styles__$n = undefined;
+const __vue_inject_styles__$q = undefined;
 /* scoped */
 
-const __vue_scope_id__$n = "data-v-14e97a70";
+const __vue_scope_id__$q = "data-v-14e97a70";
 /* module identifier */
 
-const __vue_module_identifier__$n = undefined;
+const __vue_module_identifier__$q = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$n = false;
+const __vue_is_functional_template__$q = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$F = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$m,
-  staticRenderFns: __vue_staticRenderFns__$m
-}, __vue_inject_styles__$n, __vue_script__$g, __vue_scope_id__$n, __vue_is_functional_template__$n, __vue_module_identifier__$n, false, undefined, undefined, undefined);
+const __vue_component__$L = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$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, undefined, undefined, undefined);
 
-var NsLottieAnimation = __vue_component__$F;
+var NsLottieAnimation = __vue_component__$L;
 
 /* script */
 
 /* template */
-var __vue_render__$l = function () {
+var __vue_render__$o = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -520,34 +525,34 @@ var __vue_render__$l = function () {
   });
 };
 
-var __vue_staticRenderFns__$l = [];
+var __vue_staticRenderFns__$o = [];
 /* style */
 
-const __vue_inject_styles__$m = undefined;
+const __vue_inject_styles__$p = undefined;
 /* scoped */
 
-const __vue_scope_id__$m = undefined;
+const __vue_scope_id__$p = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$m = undefined;
+const __vue_module_identifier__$p = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$m = false;
+const __vue_is_functional_template__$p = false;
 /* style inject */
 
 /* 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_scope_id__$m, __vue_is_functional_template__$m, __vue_module_identifier__$m, false, undefined, undefined, undefined);
+const __vue_component__$K = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$o,
+  staticRenderFns: __vue_staticRenderFns__$o
+}, __vue_inject_styles__$p, {}, __vue_scope_id__$p, __vue_is_functional_template__$p, __vue_module_identifier__$p, false, undefined, undefined, undefined);
 
-var ExclamationMark = __vue_component__$E;
+var ExclamationMark = __vue_component__$K;
 
 //
-var script$f = {
+var script$i = {
   name: "NsEmptyState",
   components: {
     NsPictogram,
@@ -579,10 +584,10 @@ var script$f = {
 };
 
 /* script */
-const __vue_script__$f = script$f;
+const __vue_script__$i = script$i;
 /* template */
 
-var __vue_render__$k = function () {
+var __vue_render__$n = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -612,10 +617,10 @@ var __vue_render__$k = function () {
   }, [_vm._t("description")], 2)] : _vm._e()], 2);
 };
 
-var __vue_staticRenderFns__$k = [];
+var __vue_staticRenderFns__$n = [];
 /* style */
 
-const __vue_inject_styles__$l = function (inject) {
+const __vue_inject_styles__$o = function (inject) {
   if (!inject) return;
   inject("data-v-d5a46c1c_0", {
     source: ".empty-state[data-v-d5a46c1c]{text-align:center;padding:2rem}.empty-state .image[data-v-d5a46c1c]{margin-bottom:1rem}.empty-state .description[data-v-d5a46c1c]{margin-top:1rem}.animation[data-v-d5a46c1c]{display:inline-block;width:64px;height:64px}",
@@ -626,26 +631,26 @@ const __vue_inject_styles__$l = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$l = "data-v-d5a46c1c";
+const __vue_scope_id__$o = "data-v-d5a46c1c";
 /* module identifier */
 
-const __vue_module_identifier__$l = undefined;
+const __vue_module_identifier__$o = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$l = false;
+const __vue_is_functional_template__$o = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$C = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$k,
-  staticRenderFns: __vue_staticRenderFns__$k
-}, __vue_inject_styles__$l, __vue_script__$f, __vue_scope_id__$l, __vue_is_functional_template__$l, __vue_module_identifier__$l, false, createInjector, undefined, undefined);
+const __vue_component__$I = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$n,
+  staticRenderFns: __vue_staticRenderFns__$n
+}, __vue_inject_styles__$o, __vue_script__$i, __vue_scope_id__$o, __vue_is_functional_template__$o, __vue_module_identifier__$o, false, createInjector, undefined, undefined);
 
-var __vue_component__$D = __vue_component__$C;
+var __vue_component__$J = __vue_component__$I;
 
 //
-var script$e = {
+var script$h = {
   name: "NsCodeSnippet",
   components: {
     CvButton,
@@ -757,10 +762,10 @@ var script$e = {
 };
 
 /* script */
-const __vue_script__$e = script$e;
+const __vue_script__$h = script$h;
 /* template */
 
-var __vue_render__$j = function () {
+var __vue_render__$m = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -822,10 +827,10 @@ var __vue_render__$j = function () {
   })], 1) : _vm._e()], 1);
 };
 
-var __vue_staticRenderFns__$j = [];
+var __vue_staticRenderFns__$m = [];
 /* style */
 
-const __vue_inject_styles__$k = function (inject) {
+const __vue_inject_styles__$n = 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}",
@@ -836,23 +841,23 @@ const __vue_inject_styles__$k = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$k = "data-v-59cb538c";
+const __vue_scope_id__$n = "data-v-59cb538c";
 /* module identifier */
 
-const __vue_module_identifier__$k = undefined;
+const __vue_module_identifier__$n = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$k = false;
+const __vue_is_functional_template__$n = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$A = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$j,
-  staticRenderFns: __vue_staticRenderFns__$j
-}, __vue_inject_styles__$k, __vue_script__$e, __vue_scope_id__$k, __vue_is_functional_template__$k, __vue_module_identifier__$k, false, createInjector, undefined, undefined);
+const __vue_component__$G = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$m,
+  staticRenderFns: __vue_staticRenderFns__$m
+}, __vue_inject_styles__$n, __vue_script__$h, __vue_scope_id__$n, __vue_is_functional_template__$n, __vue_module_identifier__$n, false, createInjector, undefined, undefined);
 
-var __vue_component__$B = __vue_component__$A;
+var __vue_component__$H = __vue_component__$G;
 
 //
 //
@@ -883,7 +888,7 @@ var __vue_component__$B = __vue_component__$A;
 //
 //
 //
-var script$d = {
+var script$g = {
   name: "NsCircleTimer",
   props: {
     timeLimit: {
@@ -943,10 +948,10 @@ var script$d = {
 };
 
 /* script */
-const __vue_script__$d = script$d;
+const __vue_script__$g = script$g;
 /* template */
 
-var __vue_render__$i = function () {
+var __vue_render__$l = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -982,10 +987,10 @@ var __vue_render__$i = function () {
   })])])]);
 };
 
-var __vue_staticRenderFns__$i = [];
+var __vue_staticRenderFns__$l = [];
 /* style */
 
-const __vue_inject_styles__$j = function (inject) {
+const __vue_inject_styles__$m = function (inject) {
   if (!inject) return;
   inject("data-v-45b59790_0", {
     source: ".base-timer[data-v-45b59790]{position:relative}.base-timer__circle[data-v-45b59790]{fill:none;stroke:none}.base-timer__path-remaining[data-v-45b59790]{stroke:currentColor;transform:rotate(90deg);transform-origin:center;transition:1s linear all}.base-timer__svg[data-v-45b59790]{transform:scaleX(-1)}",
@@ -996,26 +1001,26 @@ const __vue_inject_styles__$j = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$j = "data-v-45b59790";
+const __vue_scope_id__$m = "data-v-45b59790";
 /* module identifier */
 
-const __vue_module_identifier__$j = undefined;
+const __vue_module_identifier__$m = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$j = false;
+const __vue_is_functional_template__$m = 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__$d, __vue_scope_id__$j, __vue_is_functional_template__$j, __vue_module_identifier__$j, false, createInjector, undefined, undefined);
+const __vue_component__$F = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$l,
+  staticRenderFns: __vue_staticRenderFns__$l
+}, __vue_inject_styles__$m, __vue_script__$g, __vue_scope_id__$m, __vue_is_functional_template__$m, __vue_module_identifier__$m, false, createInjector, undefined, undefined);
 
-var NsCircleTimer = __vue_component__$z;
+var NsCircleTimer = __vue_component__$F;
 
 //
-var script$c = {
+var script$f = {
   name: "NsInlineNotification",
   extends: CvInlineNotification,
   components: {
@@ -1052,10 +1057,10 @@ var script$c = {
 };
 
 /* script */
-const __vue_script__$c = script$c;
+const __vue_script__$f = script$f;
 /* template */
 
-var __vue_render__$h = function () {
+var __vue_render__$k = function () {
   var _obj;
 
   var _vm = this;
@@ -1126,10 +1131,10 @@ var __vue_render__$h = function () {
   })], 1) : _vm._e()]);
 };
 
-var __vue_staticRenderFns__$h = [];
+var __vue_staticRenderFns__$k = [];
 /* style */
 
-const __vue_inject_styles__$i = function (inject) {
+const __vue_inject_styles__$l = function (inject) {
   if (!inject) return;
   inject("data-v-1e5d2ff7_0", {
     source: ".title[data-v-1e5d2ff7]{margin-right:.75rem;margin-bottom:.2rem;font-size:.875rem!important;font-weight:600!important}.mg-right[data-v-1e5d2ff7]{margin-right:.75rem}.details[data-v-1e5d2ff7]{flex-grow:0}.bx--inline-notification__close-button[data-v-1e5d2ff7]{position:absolute!important}.bx--inline-notification__text-wrapper p[data-v-1e5d2ff7]{padding-right:0!important}",
@@ -1140,23 +1145,23 @@ const __vue_inject_styles__$i = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$i = "data-v-1e5d2ff7";
+const __vue_scope_id__$l = "data-v-1e5d2ff7";
 /* module identifier */
 
-const __vue_module_identifier__$i = undefined;
+const __vue_module_identifier__$l = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$i = false;
+const __vue_is_functional_template__$l = 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__$c, __vue_scope_id__$i, __vue_is_functional_template__$i, __vue_module_identifier__$i, false, createInjector, undefined, undefined);
+const __vue_component__$E = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$k,
+  staticRenderFns: __vue_staticRenderFns__$k
+}, __vue_inject_styles__$l, __vue_script__$f, __vue_scope_id__$l, __vue_is_functional_template__$l, __vue_module_identifier__$l, false, createInjector, undefined, undefined);
 
-var NsInlineNotification = __vue_component__$y;
+var NsInlineNotification = __vue_component__$E;
 
 //
 //
@@ -1175,7 +1180,7 @@ var NsInlineNotification = __vue_component__$y;
 //
 //
 //
-var script$b = {
+var script$e = {
   name: "NsProgressBar",
   props: {
     value: {
@@ -1206,10 +1211,10 @@ var script$b = {
 };
 
 /* script */
-const __vue_script__$b = script$b;
+const __vue_script__$e = script$e;
 /* template */
 
-var __vue_render__$g = function () {
+var __vue_render__$j = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -1234,10 +1239,10 @@ var __vue_render__$g = function () {
   })]], 2)]);
 };
 
-var __vue_staticRenderFns__$g = [];
+var __vue_staticRenderFns__$j = [];
 /* style */
 
-const __vue_inject_styles__$h = function (inject) {
+const __vue_inject_styles__$k = function (inject) {
   if (!inject) return;
   inject("data-v-2bcd6519_0", {
     source: ".progress-bar-container[data-v-2bcd6519]{width:100%;position:relative}.slider[data-v-2bcd6519]{position:absolute;width:100%;height:5px;overflow-x:hidden}.line[data-v-2bcd6519]{position:absolute;opacity:.4;width:100%;height:5px}.progress-line[data-v-2bcd6519]{position:absolute;height:5px}.indeterminate-line[data-v-2bcd6519]{position:absolute;opacity:.4;width:150%;height:5px}.indeterminate-subline[data-v-2bcd6519]{position:absolute;height:5px}.inc[data-v-2bcd6519]{animation:increase-data-v-2bcd6519 2s infinite}.dec[data-v-2bcd6519]{animation:decrease-data-v-2bcd6519 2s .5s infinite}@keyframes increase-data-v-2bcd6519{from{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes decrease-data-v-2bcd6519{from{left:-80%;width:80%}to{left:110%;width:10%}}",
@@ -1248,25 +1253,25 @@ const __vue_inject_styles__$h = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$h = "data-v-2bcd6519";
+const __vue_scope_id__$k = "data-v-2bcd6519";
 /* module identifier */
 
-const __vue_module_identifier__$h = undefined;
+const __vue_module_identifier__$k = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$h = false;
+const __vue_is_functional_template__$k = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$x = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$g,
-  staticRenderFns: __vue_staticRenderFns__$g
-}, __vue_inject_styles__$h, __vue_script__$b, __vue_scope_id__$h, __vue_is_functional_template__$h, __vue_module_identifier__$h, false, createInjector, undefined, undefined);
+const __vue_component__$D = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$j,
+  staticRenderFns: __vue_staticRenderFns__$j
+}, __vue_inject_styles__$k, __vue_script__$e, __vue_scope_id__$k, __vue_is_functional_template__$k, __vue_module_identifier__$k, false, createInjector, undefined, undefined);
 
-var NsProgressBar = __vue_component__$x;
+var NsProgressBar = __vue_component__$D;
 
-var script$a = {
+var script$d = {
   name: "NsSvg",
   props: {
     svg: {
@@ -1325,33 +1330,33 @@ var script$a = {
 };
 
 /* script */
-const __vue_script__$a = script$a;
+const __vue_script__$d = script$d;
 /* template */
 
 /* style */
 
-const __vue_inject_styles__$g = undefined;
+const __vue_inject_styles__$j = undefined;
 /* scoped */
 
-const __vue_scope_id__$g = undefined;
+const __vue_scope_id__$j = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$g = undefined;
+const __vue_module_identifier__$j = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$g = undefined;
+const __vue_is_functional_template__$j = undefined;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$w = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$g, __vue_script__$a, __vue_scope_id__$g, __vue_is_functional_template__$g, __vue_module_identifier__$g, false, undefined, undefined, undefined);
+const __vue_component__$C = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__$j, __vue_script__$d, __vue_scope_id__$j, __vue_is_functional_template__$j, __vue_module_identifier__$j, false, undefined, undefined, undefined);
 
-var NsSvg = __vue_component__$w;
+var NsSvg = __vue_component__$C;
 
 //
-var script$9 = {
+var script$c = {
   name: "NsTile",
   extends: CvTile,
   inheritAttrs: false,
@@ -1419,10 +1424,10 @@ var script$9 = {
 };
 
 /* script */
-const __vue_script__$9 = script$9;
+const __vue_script__$c = script$c;
 /* template */
 
-var __vue_render__$f = function () {
+var __vue_render__$i = function () {
   var _obj;
 
   var _vm = this;
@@ -1459,10 +1464,10 @@ var __vue_render__$f = function () {
   }) : _vm._e()], 1);
 };
 
-var __vue_staticRenderFns__$f = [];
+var __vue_staticRenderFns__$i = [];
 /* style */
 
-const __vue_inject_styles__$f = function (inject) {
+const __vue_inject_styles__$i = function (inject) {
   if (!inject) return;
   inject("data-v-bbf09f9e_0", {
     source: ".ns-tile[data-v-bbf09f9e]{margin-bottom:2rem}.container[data-v-bbf09f9e]{display:flex;flex-direction:column;justify-content:center}.centered[data-v-bbf09f9e]{text-align:center}.large[data-v-bbf09f9e]{min-height:10rem}.tile-icon[data-v-bbf09f9e]{display:block;margin-left:auto;margin-right:auto;margin-bottom:1rem}.tile-footer-icon[data-v-bbf09f9e]{position:absolute;right:1rem;bottom:1rem;flex-shrink:0;width:1.25rem;height:1.25rem}.pad-bottom[data-v-bbf09f9e]{padding-bottom:4rem}",
@@ -1473,23 +1478,23 @@ const __vue_inject_styles__$f = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$f = "data-v-bbf09f9e";
+const __vue_scope_id__$i = "data-v-bbf09f9e";
 /* module identifier */
 
-const __vue_module_identifier__$f = undefined;
+const __vue_module_identifier__$i = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$f = false;
+const __vue_is_functional_template__$i = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$u = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$f,
-  staticRenderFns: __vue_staticRenderFns__$f
-}, __vue_inject_styles__$f, __vue_script__$9, __vue_scope_id__$f, __vue_is_functional_template__$f, __vue_module_identifier__$f, false, createInjector, undefined, undefined);
+const __vue_component__$A = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$i,
+  staticRenderFns: __vue_staticRenderFns__$i
+}, __vue_inject_styles__$i, __vue_script__$c, __vue_scope_id__$i, __vue_is_functional_template__$i, __vue_module_identifier__$i, false, createInjector, undefined, undefined);
 
-var __vue_component__$v = __vue_component__$u;
+var __vue_component__$B = __vue_component__$A;
 
 function toInteger(dirtyNumber) {
   if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
@@ -6086,7 +6091,7 @@ var DateTimeService = {
 };
 
 //
-var script$8 = {
+var script$b = {
   name: "NsToastNotification",
   extends: CvToastNotification,
   components: {
@@ -6128,10 +6133,10 @@ var script$8 = {
 };
 
 /* script */
-const __vue_script__$8 = script$8;
+const __vue_script__$b = script$b;
 /* template */
 
-var __vue_render__$e = function () {
+var __vue_render__$h = function () {
   var _obj;
 
   var _vm = this;
@@ -6214,10 +6219,10 @@ var __vue_render__$e = function () {
   })], 1) : _vm._e()], 1)]);
 };
 
-var __vue_staticRenderFns__$e = [];
+var __vue_staticRenderFns__$h = [];
 /* style */
 
-const __vue_inject_styles__$e = function (inject) {
+const __vue_inject_styles__$h = function (inject) {
   if (!inject) return;
   inject("data-v-79bd81d3_0", {
     source: ".notification[data-v-79bd81d3]{margin-bottom:0;margin-right:0}.action[data-v-79bd81d3]{padding-top:0;margin-bottom:0}.bx--toast-notification .bx--inline-notification__action-button.bx--btn--ghost[data-v-79bd81d3]{margin-left:-16px}.notification-description-and-progress[data-v-79bd81d3]{margin-top:.75rem;margin-bottom:.75rem}.fix-margin-bottom[data-v-79bd81d3]{margin-bottom:0}.progress[data-v-79bd81d3]{margin-top:.75rem}.progress-bar-spacer[data-v-79bd81d3]{height:.5rem}.cv-notifiation.bx--toast-notification.notification[data-v-79bd81d3]{width:26vw;min-width:20rem;margin-top:0}.notification-drawer .cv-notifiation.bx--toast-notification.notification[data-v-79bd81d3]{margin-top:1rem}.notification-drawer .cv-notifiation.bx--toast-notification.notification[data-v-79bd81d3]{width:100%;cursor:pointer}.notification-read[data-v-79bd81d3]{border-color:#8d8d8d;color:#c6c6c6}.notification-read .bx--toast-notification__icon[data-v-79bd81d3]{fill:currentColor}.notification-read .bx--toast-notification__subtitle[data-v-79bd81d3]{color:#c6c6c6}.notification-read .bx--toast-notification__title[data-v-79bd81d3]{font-weight:400}.cv-notifiation .timestamp[data-v-79bd81d3]{margin-bottom:.75rem;line-height:1.29;color:#fff;text-decoration:underline}.cv-notifiation .timestamp button[data-v-79bd81d3]{color:#c6c6c6}.bx--tooltip__trigger[data-v-79bd81d3]:not(.bx--btn--icon-only){font-size:inherit}.cv-notifiation .timestamp .bx--tooltip__trigger[data-v-79bd81d3]::before{border-bottom-color:#161616}div.row[data-v-79bd81d3]:last-child{margin-bottom:1.5rem}.bx--toast-notification__details[data-v-79bd81d3]{flex-grow:1}",
@@ -6232,26 +6237,26 @@ const __vue_inject_styles__$e = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$e = "data-v-79bd81d3";
+const __vue_scope_id__$h = "data-v-79bd81d3";
 /* module identifier */
 
-const __vue_module_identifier__$e = undefined;
+const __vue_module_identifier__$h = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$e = 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__$e, __vue_script__$8, __vue_scope_id__$e, __vue_is_functional_template__$e, __vue_module_identifier__$e, false, createInjector, undefined, undefined);
+const __vue_component__$y = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$h,
+  staticRenderFns: __vue_staticRenderFns__$h
+}, __vue_inject_styles__$h, __vue_script__$b, __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__$z = __vue_component__$y;
 
 //
-var script$7 = {
+var script$a = {
   name: "NsInfoCard",
   //components added for storybook to work
   components: {
@@ -6286,10 +6291,10 @@ var script$7 = {
 };
 
 /* script */
-const __vue_script__$7 = script$7;
+const __vue_script__$a = script$a;
 /* template */
 
-var __vue_render__$d = function () {
+var __vue_render__$g = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -6321,10 +6326,10 @@ var __vue_render__$d = function () {
   }, [_vm._t("content")], 2)], 2);
 };
 
-var __vue_staticRenderFns__$d = [];
+var __vue_staticRenderFns__$g = [];
 /* style */
 
-const __vue_inject_styles__$d = function (inject) {
+const __vue_inject_styles__$g = function (inject) {
   if (!inject) return;
   inject("data-v-5f0f76db_0", {
     source: ".info-card[data-v-5f0f76db]{display:flex;flex-direction:column;justify-content:center;min-height:7rem;position:relative}.row[data-v-5f0f76db]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.title[data-v-5f0f76db]{margin-left:.25rem;margin-right:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.description[data-v-5f0f76db]{margin-left:.25rem;margin-right:.25rem}.slot[data-v-5f0f76db]{margin-top:.5rem}",
@@ -6335,26 +6340,26 @@ const __vue_inject_styles__$d = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$d = "data-v-5f0f76db";
+const __vue_scope_id__$g = "data-v-5f0f76db";
 /* module identifier */
 
-const __vue_module_identifier__$d = undefined;
+const __vue_module_identifier__$g = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$d = false;
+const __vue_is_functional_template__$g = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$q = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$d,
-  staticRenderFns: __vue_staticRenderFns__$d
-}, __vue_inject_styles__$d, __vue_script__$7, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, createInjector, undefined, undefined);
+const __vue_component__$w = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$g,
+  staticRenderFns: __vue_staticRenderFns__$g
+}, __vue_inject_styles__$g, __vue_script__$a, __vue_scope_id__$g, __vue_is_functional_template__$g, __vue_module_identifier__$g, false, createInjector, undefined, undefined);
 
-var __vue_component__$r = __vue_component__$q;
+var __vue_component__$x = __vue_component__$w;
 
 //
-var script$6 = {
+var script$9 = {
   name: "NsStatusCard",
   //components added for storybook to work
   components: {
@@ -6401,10 +6406,10 @@ var script$6 = {
 };
 
 /* script */
-const __vue_script__$6 = script$6;
+const __vue_script__$9 = script$9;
 /* template */
 
-var __vue_render__$c = function () {
+var __vue_render__$f = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -6473,10 +6478,10 @@ var __vue_render__$c = function () {
   }, [_c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])]) : _c('h4', [_vm._v(_vm._s(_vm.valueSuccess))])], 1) : _vm._e()])]);
 };
 
-var __vue_staticRenderFns__$c = [];
+var __vue_staticRenderFns__$f = [];
 /* style */
 
-const __vue_inject_styles__$c = function (inject) {
+const __vue_inject_styles__$f = function (inject) {
   if (!inject) return;
   inject("data-v-e4a14fb4_0", {
     source: ".status-card[data-v-e4a14fb4]{display:flex;flex-direction:column;justify-content:center}.row[data-v-e4a14fb4]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.value[data-v-e4a14fb4]{margin-left:.25rem;margin-right:.25rem}.label[data-v-e4a14fb4]{margin-left:.25rem;margin-right:.25rem}.success-icon[data-v-e4a14fb4]{margin-right:.25rem}.error-icon[data-v-e4a14fb4]{margin-right:.25rem}.warning-icon[data-v-e4a14fb4]{margin-right:.25rem}.stats[data-v-e4a14fb4]{display:flex;align-items:center;margin-left:.5rem;margin-right:.5rem}",
@@ -6487,26 +6492,26 @@ const __vue_inject_styles__$c = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$c = "data-v-e4a14fb4";
+const __vue_scope_id__$f = "data-v-e4a14fb4";
 /* module identifier */
 
-const __vue_module_identifier__$c = undefined;
+const __vue_module_identifier__$f = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$c = false;
+const __vue_is_functional_template__$f = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$o = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$c,
-  staticRenderFns: __vue_staticRenderFns__$c
-}, __vue_inject_styles__$c, __vue_script__$6, __vue_scope_id__$c, __vue_is_functional_template__$c, __vue_module_identifier__$c, false, createInjector, undefined, undefined);
+const __vue_component__$u = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$f,
+  staticRenderFns: __vue_staticRenderFns__$f
+}, __vue_inject_styles__$f, __vue_script__$9, __vue_scope_id__$f, __vue_is_functional_template__$f, __vue_module_identifier__$f, false, createInjector, undefined, undefined);
 
-var __vue_component__$p = __vue_component__$o;
+var __vue_component__$v = __vue_component__$u;
 
 //
-var script$5 = {
+var script$8 = {
   name: "NsSystemdServiceCard",
   //components added for storybook to work
   components: {
@@ -6560,10 +6565,10 @@ var script$5 = {
 };
 
 /* script */
-const __vue_script__$5 = script$5;
+const __vue_script__$8 = script$8;
 /* template */
 
-var __vue_render__$b = function () {
+var __vue_render__$e = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -6618,10 +6623,10 @@ var __vue_render__$b = function () {
   })], 1)])]);
 };
 
-var __vue_staticRenderFns__$b = [];
+var __vue_staticRenderFns__$e = [];
 /* style */
 
-const __vue_inject_styles__$b = function (inject) {
+const __vue_inject_styles__$e = function (inject) {
   if (!inject) return;
   inject("data-v-e13a5ce6_0", {
     source: ".service-card[data-v-e13a5ce6]{display:flex;flex-direction:column;justify-content:center}.row[data-v-e13a5ce6]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.service-name[data-v-e13a5ce6]{margin-left:.25rem;margin-right:.25rem}.success-icon[data-v-e13a5ce6]{margin-right:.25rem}.error-icon[data-v-e13a5ce6]{margin-right:.25rem}.warning-icon[data-v-e13a5ce6]{margin-right:.25rem}.stats[data-v-e13a5ce6]{display:flex;align-items:center;margin-left:.5rem;margin-right:.5rem}",
@@ -6632,31 +6637,34 @@ const __vue_inject_styles__$b = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$b = "data-v-e13a5ce6";
+const __vue_scope_id__$e = "data-v-e13a5ce6";
 /* module identifier */
 
-const __vue_module_identifier__$b = undefined;
+const __vue_module_identifier__$e = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$b = 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__$b, __vue_script__$5, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, createInjector, undefined, undefined);
+const __vue_component__$s = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$e,
+  staticRenderFns: __vue_staticRenderFns__$e
+}, __vue_inject_styles__$e, __vue_script__$8, __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__$t = __vue_component__$s;
 
 var UtilService = {
   name: "UtilService",
 
   data() {
     return {
-      DELETE_DELAY: 7000 // you have 7 seconds to cancel object deletion
-
+      DELETE_DELAY: 7000,
+      // you have 7 seconds to cancel object deletion
+      time24HourPattern: /([01]\d|2[0-3]):?([0-5]\d)/,
+      time24HourPatternString: "([01]\\d|2[0-3]):?([0-5]\\d)",
+      time24HourPlaceholder: "hh:mm"
     };
   },
 
@@ -6804,13 +6812,20 @@ var UtilService = {
       }
 
       return i18nCategories.join(", ");
+    },
+
+    /**
+     * Used in views and components containing an accordion
+     */
+    toggleAccordion(ev) {
+      this.$refs.accordion.state.map((item, index) => index === ev.changedIndex);
     }
 
   }
 };
 
 //
-var script$4 = {
+var script$7 = {
   name: "NsPasswordInput",
   components: CvTextInput,
   mixins: [UtilService],
@@ -6966,10 +6981,10 @@ var script$4 = {
 };
 
 /* script */
-const __vue_script__$4 = script$4;
+const __vue_script__$7 = script$7;
 /* template */
 
-var __vue_render__$a = function () {
+var __vue_render__$d = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -7058,10 +7073,10 @@ var __vue_render__$a = function () {
   }, [_vm._v(_vm._s(_vm.equalLabel))])])], 1)]);
 };
 
-var __vue_staticRenderFns__$a = [];
+var __vue_staticRenderFns__$d = [];
 /* style */
 
-const __vue_inject_styles__$a = function (inject) {
+const __vue_inject_styles__$d = function (inject) {
   if (!inject) return;
   inject("data-v-1598af82_0", {
     source: ".new-password-container[data-v-1598af82]{margin-bottom:1rem}.new-password[data-v-1598af82]{margin-bottom:.25rem}.confirm-password[data-v-1598af82]{margin-bottom:.25rem}.password-meter[data-v-1598af82]{display:flex}@media (min-width:672px){.password-meter[data-v-1598af82]{max-width:38rem}}.requirement[data-v-1598af82]{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-1598af82]{background-color:#fff}.requirement[data-v-1598af82]:first-child{margin-left:0}.requirement-ok[data-v-1598af82]{color:#fff;background-color:#198038}",
@@ -7072,27 +7087,26 @@ const __vue_inject_styles__$a = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$a = "data-v-1598af82";
+const __vue_scope_id__$d = "data-v-1598af82";
 /* module identifier */
 
-const __vue_module_identifier__$a = undefined;
+const __vue_module_identifier__$d = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$a = false;
+const __vue_is_functional_template__$d = false;
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$k = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$a,
-  staticRenderFns: __vue_staticRenderFns__$a
-}, __vue_inject_styles__$a, __vue_script__$4, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, createInjector, undefined, undefined);
+const __vue_component__$q = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$d,
+  staticRenderFns: __vue_staticRenderFns__$d
+}, __vue_inject_styles__$d, __vue_script__$7, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, createInjector, undefined, undefined);
 
-var __vue_component__$l = __vue_component__$k;
+var __vue_component__$r = __vue_component__$q;
 
 //
-
-var script$3 = {
+var script$6 = {
   name: "NsIconMenu",
   extends: CvOverflowMenu,
   props: {
@@ -7121,10 +7135,10 @@ var script$3 = {
 };
 
 /* script */
-const __vue_script__$3 = script$3;
+const __vue_script__$6 = script$6;
 /* template */
 
-var __vue_render__$9 = function () {
+var __vue_render__$c = function () {
   var _obj, _obj$1;
 
   var _vm = this;
@@ -7236,35 +7250,35 @@ var __vue_render__$9 = function () {
   })])]);
 };
 
-var __vue_staticRenderFns__$9 = [];
+var __vue_staticRenderFns__$c = [];
 /* style */
 
-const __vue_inject_styles__$9 = undefined;
+const __vue_inject_styles__$c = undefined;
 /* scoped */
 
-const __vue_scope_id__$9 = undefined;
+const __vue_scope_id__$c = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$9 = undefined;
+const __vue_module_identifier__$c = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$9 = false;
+const __vue_is_functional_template__$c = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$i = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$9,
-  staticRenderFns: __vue_staticRenderFns__$9
-}, __vue_inject_styles__$9, __vue_script__$3, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, false, undefined, undefined, undefined);
+const __vue_component__$o = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$c,
+  staticRenderFns: __vue_staticRenderFns__$c
+}, __vue_inject_styles__$c, __vue_script__$6, __vue_scope_id__$c, __vue_is_functional_template__$c, __vue_module_identifier__$c, false, undefined, undefined, undefined);
 
-var __vue_component__$j = __vue_component__$i;
+var __vue_component__$p = __vue_component__$o;
 
 //
 Vue.use(chartsVue);
-var script$2 = {
+var script$5 = {
   name: "NsMeterChart",
   components: {
     CcvMeterChart
@@ -7338,10 +7352,10 @@ var script$2 = {
 };
 
 /* script */
-const __vue_script__$2 = script$2;
+const __vue_script__$5 = script$5;
 /* template */
 
-var __vue_render__$8 = function () {
+var __vue_render__$b = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -7356,35 +7370,35 @@ var __vue_render__$8 = function () {
   });
 };
 
-var __vue_staticRenderFns__$8 = [];
+var __vue_staticRenderFns__$b = [];
 /* style */
 
-const __vue_inject_styles__$8 = undefined;
+const __vue_inject_styles__$b = undefined;
 /* scoped */
 
-const __vue_scope_id__$8 = undefined;
+const __vue_scope_id__$b = undefined;
 /* module identifier */
 
-const __vue_module_identifier__$8 = undefined;
+const __vue_module_identifier__$b = undefined;
 /* functional template */
 
-const __vue_is_functional_template__$8 = false;
+const __vue_is_functional_template__$b = 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__$2, __vue_scope_id__$8, __vue_is_functional_template__$8, __vue_module_identifier__$8, false, undefined, undefined, undefined);
+const __vue_component__$m = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$b,
+  staticRenderFns: __vue_staticRenderFns__$b
+}, __vue_inject_styles__$b, __vue_script__$5, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, undefined, undefined, undefined);
 
-var __vue_component__$h = __vue_component__$g;
+var __vue_component__$n = __vue_component__$m;
 
 //
 Vue.use(chartsVue);
-var script$1 = {
+var script$4 = {
   name: "NsPieChart",
   components: {},
   props: {
@@ -7440,10 +7454,10 @@ var script$1 = {
 };
 
 /* script */
-const __vue_script__$1 = script$1;
+const __vue_script__$4 = script$4;
 /* template */
 
-var __vue_render__$7 = function () {
+var __vue_render__$a = function () {
   var _vm = this;
 
   var _h = _vm.$createElement;
@@ -7458,21 +7472,624 @@ var __vue_render__$7 = function () {
   });
 };
 
-var __vue_staticRenderFns__$7 = [];
+var __vue_staticRenderFns__$a = [];
+/* style */
+
+const __vue_inject_styles__$a = undefined;
+/* scoped */
+
+const __vue_scope_id__$a = undefined;
+/* module identifier */
+
+const __vue_module_identifier__$a = undefined;
+/* functional template */
+
+const __vue_is_functional_template__$a = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__$k = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$a,
+  staticRenderFns: __vue_staticRenderFns__$a
+}, __vue_inject_styles__$a, __vue_script__$4, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, undefined, undefined, undefined);
+
+var __vue_component__$l = __vue_component__$k;
+
+//
+var script$3 = {
+  name: "NsDangerDeleteModal",
+  //component added for storybook to work
+  components: {
+    NsInlineNotification
+  },
+  mixins: [UtilService],
+  props: {
+    isShown: {
+      type: Boolean,
+      default: true
+    },
+    name: {
+      type: String,
+      required: true
+    },
+    title: {
+      type: String,
+      default: "Confirm deletion"
+    },
+    warning: {
+      type: String,
+      default: "Please read carefully"
+    },
+    description: {
+      type: String,
+      default: "Do you really want to delete this object? This action is irreversible"
+    },
+    typeToConfirm: {
+      type: String,
+      default: ""
+    },
+    cancelLabel: {
+      type: String,
+      default: "Cancel"
+    },
+    deleteLabel: {
+      type: String,
+      default: "I understand, delete"
+    }
+  },
+
+  data() {
+    return {
+      userInput: ""
+    };
+  },
+
+  computed: {
+    typeToConfirmMessage() {
+      if (this.typeToConfirm) {
+        return this.typeToConfirm;
+      } else {
+        return `Type <strong>${this.name}</strong> to confirm deletion`;
+      }
+    }
+
+  },
+  watch: {
+    isShown: function () {
+      if (this.isShown) {
+        this.userInput = "";
+        setTimeout(() => {
+          this.focusElement("userInput");
+        }, 300);
+      }
+    }
+  },
+  methods: {
+    onModalHidden() {
+      this.$emit("hide");
+    },
+
+    confirmDelete() {
+      if (this.name == this.userInput) {
+        this.$emit("confirmDelete");
+      }
+    }
+
+  }
+};
+
+/* script */
+const __vue_script__$3 = script$3;
+/* template */
+
+var __vue_render__$9 = function () {
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('cv-modal', {
+    attrs: {
+      "kind": "danger",
+      "size": "default",
+      "visible": _vm.isShown,
+      "primary-button-disabled": _vm.name !== _vm.userInput
+    },
+    on: {
+      "modal-hidden": _vm.onModalHidden,
+      "primary-click": _vm.confirmDelete
+    }
+  }, [_c('template', {
+    slot: "title"
+  }, [_vm._v(_vm._s(_vm.title))]), _vm._v(" "), _c('template', {
+    slot: "content"
+  }, [_c('NsInlineNotification', {
+    attrs: {
+      "kind": "warning",
+      "title": _vm.warning,
+      "showCloseButton": false
+    }
+  }), _vm._v(" "), _c('div', {
+    domProps: {
+      "innerHTML": _vm._s(_vm.description)
+    }
+  }), _vm._v(" "), _vm._t("explanation"), _vm._v(" "), _c('div', {
+    staticClass: "type-to-confirm",
+    domProps: {
+      "innerHTML": _vm._s(_vm.typeToConfirmMessage)
+    }
+  }), _vm._v(" "), _c('cv-form', {
+    on: {
+      "submit": function ($event) {
+        $event.preventDefault();
+        return _vm.confirmDelete.apply(null, arguments);
+      }
+    }
+  }, [_c('cv-text-input', {
+    ref: "userInput",
+    staticClass: "mg-bottom-md",
+    model: {
+      value: _vm.userInput,
+      callback: function ($$v) {
+        _vm.userInput = $$v;
+      },
+      expression: "userInput"
+    }
+  })], 1)], 2), _vm._v(" "), _c('template', {
+    slot: "secondary-button"
+  }, [_vm._v(_vm._s(_vm.cancelLabel))]), _vm._v(" "), _c('template', {
+    slot: "primary-button"
+  }, [_vm._v(_vm._s(_vm.deleteLabel))])], 2);
+};
+
+var __vue_staticRenderFns__$9 = [];
 /* style */
 
-const __vue_inject_styles__$7 = undefined;
+const __vue_inject_styles__$9 = function (inject) {
+  if (!inject) return;
+  inject("data-v-97f667a6_0", {
+    source: ".type-to-confirm[data-v-97f667a6]{margin-top:2rem}",
+    map: undefined,
+    media: undefined
+  });
+};
+/* scoped */
+
+
+const __vue_scope_id__$9 = "data-v-97f667a6";
+/* module identifier */
+
+const __vue_module_identifier__$9 = undefined;
+/* functional template */
+
+const __vue_is_functional_template__$9 = false;
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__$i = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$9,
+  staticRenderFns: __vue_staticRenderFns__$9
+}, __vue_inject_styles__$9, __vue_script__$3, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, false, createInjector, undefined, undefined);
+
+var __vue_component__$j = __vue_component__$i;
+
+var IconService = {
+  name: "IconService",
+
+  data() {
+    return {
+      Close20,
+      ArrowRight20,
+      ArrowRight32,
+      Notification20,
+      UserAvatar20,
+      AppSwitcher20,
+      Search20,
+      RowExpand20,
+      RowCollapse20,
+      Reset20,
+      Download20,
+      Launch20,
+      Upgrade20,
+      Settings20,
+      ChevronDown20,
+      ChevronUp20,
+      ChevronLeft20,
+      ChevronRight20,
+      Information20,
+      Application20,
+      // used for apps, module instances and software center
+      Application32,
+      Add20,
+      Rocket20,
+      Rocket32,
+      Chip20,
+      // used for cluster nodes
+      Chip32,
+      Save20,
+      // used for save buttons and backups
+      Save32,
+      Copy20,
+      EdgeNode20,
+      EdgeNode32,
+      Cube32,
+      // used for systemd services
+      EdgeCluster20,
+      // used for cluster
+      EdgeCluster32,
+      Connect32,
+      // used for join cluster
+      Connect20,
+      Edit20,
+      Password20,
+      Star20,
+      Checkmark20,
+      ZoomIn20,
+      // used to open details
+      Events32,
+      // used for domains
+      Link20,
+      // used for URLs and external domain providers
+      Link32,
+      WarningAlt20,
+      WarningAlt32,
+      Tools20,
+      Tools32,
+      Network_220,
+      Network_232,
+      DataBase20,
+      // used for backup repositories
+      DataBase32,
+      DataBackup20,
+      DataBackup32,
+      ArrowDown20,
+      ArrowDown32,
+      Time20,
+      Time32,
+      Hourglass20,
+      Hourglass32,
+      CheckmarkFilled16,
+      CheckmarkFilled20,
+      CheckmarkFilled32,
+      ErrorFilled16,
+      ErrorFilled20,
+      ErrorFilled32,
+      Warning16,
+      Warning20,
+      Warning32
+    };
+  }
+
+};
+
+//
+var script$2 = {
+  name: "NsDropdownAction",
+  extends: CvOverflowMenu,
+  components: {
+    NsSvg
+  },
+  mixins: [IconService],
+  props: {
+    kind: {
+      type: String,
+      default: "secondary",
+      validator: val => ["default", "primary", "secondary", "tertiary", "ghost", "danger", "danger--ghost", "danger--tertiary"].includes(val)
+    },
+    up: Boolean,
+    offset: {
+      type: Object,
+
+      validator(value) {
+        return value && value.left !== undefined && value.top !== undefined;
+      }
+
+    }
+  },
+  computed: {
+    lowerCaseKind() {
+      return this.kind.toLowerCase();
+    }
+
+  }
+};
+
+/* script */
+const __vue_script__$2 = script$2;
+/* template */
+
+var __vue_render__$8 = function () {
+  var _obj, _obj$1;
+
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('div', {
+    class: ["cv-overflow-menu"],
+    attrs: {
+      "data-overflow-menu": "",
+      "id": _vm.uid
+    }
+  }, [_c('button', {
+    ref: "trigger",
+    class: ["bx--btn--" + _vm.lowerCaseKind, 'bx--btn', 'bx--btn--field', (_obj = {}, _obj[_vm.carbonPrefix + "--overflow-menu--open"] = _vm.open, _obj)],
+    attrs: {
+      "aria-haspopup": "",
+      "type": "button",
+      "aria-expanded": _vm.open ? 'true' : 'false',
+      "aria-controls": _vm.uid + "-menu",
+      "id": _vm.uid + "-trigger"
+    },
+    on: {
+      "click": _vm.doToggle,
+      "keydown": [function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "space", 32, $event.key, [" ", "Spacebar"])) {
+          return null;
+        }
+
+        $event.preventDefault();
+      }, function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter")) {
+          return null;
+        }
+
+        $event.preventDefault();
+        return _vm.doToggle.apply(null, arguments);
+      }, function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "tab", 9, $event.key, "Tab")) {
+          return null;
+        }
+
+        return _vm.onOverflowMenuTab.apply(null, arguments);
+      }],
+      "keyup": function ($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "space", 32, $event.key, [" ", "Spacebar"])) {
+          return null;
+        }
+
+        $event.preventDefault();
+        return _vm.doToggle.apply(null, arguments);
+      }
+    }
+  }, [_vm._t("trigger"), _vm._v(" "), _c('NsSvg', {
+    class: _vm.carbonPrefix + "--btn__icon",
+    attrs: {
+      "svg": _vm.ChevronDown20
+    }
+  })], 2), _vm._v(" "), _c('div', {
+    ref: "popup",
+    class: [_vm.carbonPrefix + "--overflow-menu-options", (_obj$1 = {}, _obj$1[_vm.carbonPrefix + "--overflow-menu-options--open"] = _vm.open, _obj$1)],
+    style: {
+      left: _vm.left + 'px',
+      top: _vm.top + 'px'
+    },
+    attrs: {
+      "tabindex": "-1",
+      "aria-labelledby": _vm.uid + "-trigger",
+      "id": _vm.uid + "-menu"
+    },
+    on: {
+      "focusout": _vm.checkFocusOut,
+      "mousedown": function ($event) {
+        $event.preventDefault();
+        return _vm.preventFocusOut.apply(null, arguments);
+      }
+    }
+  }, [_c('ul', {
+    class: _vm.carbonPrefix + "--overflow-menu-options__content"
+  }, [_vm._t("default")], 2), _vm._v(" "), _c('div', {
+    ref: "afterContent",
+    staticClass: "cv-overflow-menu__after-content",
+    staticStyle: {
+      "position": "absolute",
+      "height": "1px",
+      "width": "1px",
+      "left": "-9999px"
+    },
+    attrs: {
+      "tabindex": "0"
+    },
+    on: {
+      "focus": _vm.focusAfterContent
+    }
+  })])]);
+};
+
+var __vue_staticRenderFns__$8 = [];
+/* style */
+
+const __vue_inject_styles__$8 = undefined;
+/* scoped */
+
+const __vue_scope_id__$8 = "data-v-31925b9d";
+/* 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__$2, __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$1 = {
+  name: "NsTextInput",
+  extends: CvTextInput,
+  components: {
+    WarningFilled16,
+    WarningAltFilled16,
+    View16,
+    ViewOff16
+  },
+  props: {
+    helperText: {
+      type: String,
+      default: undefined
+    },
+    invalidMessage: {
+      type: String,
+      default: undefined
+    },
+    label: String,
+    passwordHideLabel: {
+      type: String,
+      default: "Hide password"
+    },
+    passwordShowLabel: {
+      type: String,
+      default: "Show password"
+    },
+    passwordVisible: Boolean,
+    type: String,
+    value: String,
+    warnText: {
+      type: String,
+      default: undefined
+    },
+    tooltipAlignment: {
+      type: String,
+      default: "center",
+      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__$1 = script$1;
+/* template */
+
+var __vue_render__$7 = function () {
+  var _obj, _obj$1, _obj$2, _obj$3, _obj$4, _obj$5;
+
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('div', {
+    class: ["cv-text-input", "ns-text-input", _vm.carbonPrefix + "--form-item", _vm.carbonPrefix + "--text-input-wrapper", (_obj = {}, _obj[_vm.carbonPrefix + "--password-input-wrapper"] = _vm.isPassword, _obj)]
+  }, [_vm.hasTooltipSlot ? _c('div', [_c('label', {
+    class: [_vm.carbonPrefix + "--label", (_obj$1 = {}, _obj$1[_vm.carbonPrefix + "--label--disabled"] = _vm.$attrs.disabled !== undefined && _vm.$attrs.disabled, _obj$1)],
+    attrs: {
+      "for": _vm.uid
+    }
+  }, [_vm._v(_vm._s(_vm.label))]), _vm._v(" "), _c('cv-interactive-tooltip', {
+    staticClass: "tooltip",
+    attrs: {
+      "alignment": _vm.tooltipAlignment,
+      "direction": _vm.tooltipDirection
+    }
+  }, [_c('template', {
+    slot: "content"
+  }, [_vm._t("tooltip")], 2)], 2)], 1) : _c('label', {
+    class: [_vm.carbonPrefix + "--label", (_obj$2 = {}, _obj$2[_vm.carbonPrefix + "--label--disabled"] = _vm.$attrs.disabled !== undefined && _vm.$attrs.disabled, _obj$2)],
+    attrs: {
+      "for": _vm.uid
+    }
+  }, [_vm._v(_vm._s(_vm.label))]), _vm._v(" "), _c('div', {
+    class: [_vm.carbonPrefix + "--text-input__field-wrapper", (_obj$3 = {}, _obj$3[_vm.carbonPrefix + "--text-input__field-wrapper--warning"] = !_vm.isInvalid && _vm.isWarn, _obj$3)],
+    attrs: {
+      "data-invalid": _vm.isInvalid
+    }
+  }, [_vm.isInvalid ? _c('WarningFilled16', {
+    class: _vm.carbonPrefix + "--text-input__invalid-icon"
+  }) : _vm._e(), _vm._v(" "), _vm.isWarn ? _c('WarningAltFilled16', {
+    class: _vm.carbonPrefix + "--text-input__invalid-icon " + _vm.carbonPrefix + "--text-input__invalid-icon--warning"
+  }) : _vm._e(), _vm._v(" "), _c('input', _vm._g(_vm._b({
+    ref: "input",
+    class: [_vm.carbonPrefix + "--text-input", (_obj$4 = {}, _obj$4[_vm.carbonPrefix + "--text-input--light"] = _vm.isLight, _obj$4[_vm.carbonPrefix + "--text-input--invalid"] = _vm.isInvalid, _obj$4[_vm.carbonPrefix + "--text-input--warning"] = _vm.isWarn, _obj$4[_vm.carbonPrefix + "--password-input"] = _vm.isPassword, _obj$4)],
+    attrs: {
+      "id": _vm.uid,
+      "data-toggle-password-visibility": _vm.isPassword,
+      "type": _vm.dataType
+    },
+    domProps: {
+      "value": _vm.value
+    }
+  }, 'input', _vm.$attrs, false), _vm.inputListeners)), _vm._v(" "), _vm.isPassword ? _c('button', {
+    class: [_vm.carbonPrefix + "--btn", _vm.carbonPrefix + "--text-input--password__visibility__toggle", _vm.carbonPrefix + "--tooltip__trigger", _vm.carbonPrefix + "--tooltip--a11y", _vm.carbonPrefix + "--tooltip--bottom", _vm.carbonPrefix + "--tooltip--align-center"],
+    attrs: {
+      "type": "button"
+    },
+    on: {
+      "click": _vm.togglePasswordVisibility
+    }
+  }, [_c('span', {
+    class: _vm.carbonPrefix + "--assistive-text"
+  }, [_vm._v(_vm._s(_vm.passwordHideShowLabel))]), _vm._v(" "), _vm.isPasswordVisible ? _c('ViewOff16', {
+    class: _vm.carbonPrefix + "--icon-visibility-off"
+  }) : _c('View16', {
+    class: _vm.carbonPrefix + "--icon-visibility-off"
+  })], 1) : _vm._e()], 1), _vm._v(" "), _vm.isInvalid ? _c('div', {
+    class: _vm.carbonPrefix + "--form-requirement"
+  }, [_vm._t("invalid-message", function () {
+    return [_vm._v(_vm._s(_vm.invalidMessage))];
+  })], 2) : _vm._e(), _vm._v(" "), _vm.isWarn ? _c('div', {
+    class: _vm.carbonPrefix + "--form__requirement"
+  }, [_vm._t("warn-text", function () {
+    return [_vm._v(_vm._s(_vm.warnText))];
+  })], 2) : _vm._e(), _vm._v(" "), _vm.isHelper ? _c('div', {
+    class: [_vm.carbonPrefix + "--form__helper-text", (_obj$5 = {}, _obj$5[_vm.carbonPrefix + "--form__helper-text--disabled"] = _vm.$attrs.disabled, _obj$5)]
+  }, [_vm._t("helper-text", function () {
+    return [_vm._v(_vm._s(_vm.helperText))];
+  })], 2) : _vm._e()]);
+};
+
+var __vue_staticRenderFns__$7 = [];
+/* style */
+
+const __vue_inject_styles__$7 = function (inject) {
+  if (!inject) return;
+  inject("data-v-1a7ed132_0", {
+    source: ".tooltip[data-v-1a7ed132]{display:inline-block;position:absolute}",
+    map: undefined,
+    media: undefined
+  }), inject("data-v-1a7ed132_1", {
+    source: ".ns-text-input .bx--tooltip__label .bx--tooltip__trigger{margin-left:.25rem}",
+    map: undefined,
+    media: undefined
+  });
+};
 /* scoped */
 
-const __vue_scope_id__$7 = undefined;
+
+const __vue_scope_id__$7 = "data-v-1a7ed132";
 /* module identifier */
 
 const __vue_module_identifier__$7 = undefined;
 /* functional template */
 
 const __vue_is_functional_template__$7 = false;
-/* style inject */
-
 /* style inject SSR */
 
 /* style inject shadow dom */
@@ -7480,87 +8097,142 @@ const __vue_is_functional_template__$7 = false;
 const __vue_component__$e = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$7,
   staticRenderFns: __vue_staticRenderFns__$7
-}, __vue_inject_styles__$7, __vue_script__$1, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, false, undefined, undefined, undefined);
+}, __vue_inject_styles__$7, __vue_script__$1, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, false, createInjector, undefined, undefined);
 
 var __vue_component__$f = __vue_component__$e;
 
 //
 var script = {
-  name: "NsDangerDeleteModal",
-  //component added for storybook to work
-  components: {
-    NsInlineNotification
-  },
-  mixins: [UtilService, UtilService],
+  name: "NsBackupCard",
+  mixins: [IconService],
   props: {
-    isShown: {
-      type: Boolean,
-      default: true
+    title: {
+      type: String,
+      default: "Backup"
     },
-    name: {
+    noBackupMessage: {
       type: String,
-      required: true
+      default: "No backup configured"
     },
-    title: {
+    scheduleBackupLabel: {
       type: String,
-      default: "Confirm deletion"
+      default: "Configure"
     },
-    warning: {
+    goToBackupLabel: {
       type: String,
-      default: "Please read carefully"
+      default: "Go to Backup"
     },
-    description: {
+    repositoryLabel: {
       type: String,
-      default: "Do you really want to delete this object? This action is irreversible"
+      default: "Repository"
     },
-    typeToConfirm: {
+    statusLabel: {
       type: String,
-      default: ""
+      default: "Status"
     },
-    cancelLabel: {
+    statusSuccessLabel: {
       type: String,
-      default: "Cancel"
+      default: "Success"
     },
-    deleteLabel: {
+    statusNotRunLabel: {
       type: String,
-      default: "I understand, delete"
-    }
+      default: "Backup has not run yet"
+    },
+    statusErrorLabel: {
+      type: String,
+      default: "Error"
+    },
+    completedLabel: {
+      type: String,
+      default: "Completed"
+    },
+    durationLabel: {
+      type: String,
+      default: "Duration"
+    },
+    totalSizeLabel: {
+      type: String,
+      default: "Total size"
+    },
+    totalFileCountLabel: {
+      type: String,
+      default: "Total file count"
+    },
+    backupDisabledLabel: {
+      type: String,
+      default: "Disabled"
+    },
+    moduleId: {
+      type: String,
+      required: true
+    },
+    moduleUiName: {
+      type: String,
+      default: ""
+    },
+    repositories: {
+      type: Array,
+      required: true
+    },
+    backups: {
+      type: Array,
+      required: true
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    coreContext: {
+      type: Object,
+      required: true
+    },
+    light: Boolean
   },
 
   data() {
     return {
-      userInput: ""
+      backupsContainingInstance: [],
+      status: []
     };
   },
 
-  computed: {
-    typeToConfirmMessage() {
-      if (this.typeToConfirm) {
-        return this.typeToConfirm;
-      } else {
-        return `Type <strong>${this.name}</strong> to confirm deletion`;
-      }
-    }
-
-  },
   watch: {
-    isShown: function () {
-      if (this.isShown) {
-        this.userInput = "";
-        setTimeout(() => {
-          this.focusElement("userInput");
-        }, 300);
-      }
+    repositories: function () {
+      this.updateData();
+    },
+    backups: function () {
+      this.updateData();
     }
   },
+
+  created() {
+    this.updateData();
+  },
+
   methods: {
-    onModalHidden() {
-      this.$emit("hide");
+    updateData() {
+      let backupsContainingInstance = [];
+
+      for (const backup of this.backups) {
+        for (const instance of backup.instances) {
+          if (instance.module_id == this.moduleId) {
+            backupsContainingInstance.push(backup);
+          }
+        }
+      }
+
+      this.backupsContainingInstance = backupsContainingInstance; // status
+
+      for (const backup of this.backupsContainingInstance) {
+        const instance = backup.instances.find(i => i.module_id == this.moduleId);
+        const status = instance.status;
+        this.status[backup.id] = status;
+      }
     },
 
-    confirmDelete() {
-      if (this.name == this.userInput) {
-        this.$emit("confirmDelete");
+    goToBackup() {
+      if (this.coreContext) {
+        this.coreContext.$router.push("/backup");
       }
     }
 
@@ -7578,58 +8250,110 @@ var __vue_render__$6 = function () {
 
   var _c = _vm._self._c || _h;
 
-  return _c('cv-modal', {
+  return _c('cv-tile', {
+    staticClass: "ns-backup-card",
     attrs: {
-      "kind": "danger",
-      "size": "default",
-      "visible": _vm.isShown,
-      "primary-button-disabled": _vm.name !== _vm.userInput
-    },
-    on: {
-      "modal-hidden": _vm.onModalHidden,
-      "primary-click": _vm.confirmDelete
+      "kind": "standard",
+      "light": _vm.light
     }
-  }, [_c('template', {
-    slot: "title"
-  }, [_vm._v(_vm._s(_vm.title))]), _vm._v(" "), _c('template', {
-    slot: "content"
-  }, [_c('NsInlineNotification', {
+  }, [_c('div', {
+    staticClass: "row"
+  }, [_c('NsSvg', {
     attrs: {
-      "kind": "warning",
-      "title": _vm.warning,
-      "showCloseButton": false
-    }
-  }), _vm._v(" "), _c('div', {
-    domProps: {
-      "innerHTML": _vm._s(_vm.description)
+      "svg": _vm.Save32
     }
-  }), _vm._v(" "), _vm._t("explanation"), _vm._v(" "), _c('div', {
-    staticClass: "type-to-confirm",
-    domProps: {
-      "innerHTML": _vm._s(_vm.typeToConfirmMessage)
+  })], 1), _vm._v(" "), _c('div', {
+    staticClass: "row"
+  }, [_c('h3', {
+    staticClass: "title"
+  }, [_vm._v(_vm._s(_vm.title))])]), _vm._v(" "), _vm.loading ? _c('div', {
+    staticClass: "row"
+  }, [_c('cv-skeleton-text', {
+    staticClass: "mg-top-sm",
+    attrs: {
+      "paragraph": true,
+      "line-count": 5
     }
-  }), _vm._v(" "), _c('cv-form', {
+  })], 1) : !_vm.backupsContainingInstance.length ? [_c('div', {
+    staticClass: "row"
+  }, [_c('NsInlineNotification', {
+    attrs: {
+      "kind": "warning",
+      "title": _vm.noBackupMessage,
+      "showCloseButton": false,
+      "actionLabel": _vm.scheduleBackupLabel
+    },
     on: {
-      "submit": function ($event) {
-        $event.preventDefault();
-        return _vm.confirmDelete.apply(null, arguments);
-      }
-    }
-  }, [_c('cv-text-input', {
-    ref: "userInput",
-    staticClass: "mg-bottom-md",
-    model: {
-      value: _vm.userInput,
-      callback: function ($$v) {
-        _vm.userInput = $$v;
-      },
-      expression: "userInput"
+      "action": _vm.goToBackup
+    }
+  })], 1)] : _vm._l(_vm.backupsContainingInstance, function (backup) {
+    return _c('div', {
+      key: backup.id
+    }, [_c('div', {
+      staticClass: "row"
+    }, [_vm.backupsContainingInstance.length > 1 ? _c('h5', {
+      staticClass: "title mg-top-sm"
+    }, [_vm._v("\n          " + _vm._s(backup.name) + "\n        ")]) : _vm._e()]), _vm._v(" "), _c('div', {
+      staticClass: "table-wrapper"
+    }, [_c('div', {
+      staticClass: "table"
+    }, [_c('div', {
+      staticClass: "tr"
+    }, [_c('div', {
+      staticClass: "td label"
+    }, [_vm._v(_vm._s(_vm.statusLabel))]), _vm._v(" "), _c('div', {
+      staticClass: "td status"
+    }, [!backup.enabled ? _c('span', {
+      staticClass: "ns-warning"
+    }, [_vm._v("\n                " + _vm._s(_vm.backupDisabledLabel) + "\n              ")]) : _vm.status[backup.id] && _vm.status[backup.id].success == true ? _c('span', {
+      staticClass: "ns-success"
+    }, [_c('span', [_vm._v(_vm._s(_vm.statusSuccessLabel))])]) : _vm.status[backup.id] && _vm.status[backup.id].success == false ? _c('span', {
+      staticClass: "ns-error"
+    }, [_vm._v("\n                " + _vm._s(_vm.statusErrorLabel) + "\n              ")]) : _c('span', {
+      staticClass: "ns-warning"
+    }, [_vm._v("\n                " + _vm._s(_vm.statusNotRunLabel) + "\n              ")])])]), _vm._v(" "), _c('div', {
+      staticClass: "tr"
+    }, [_c('div', {
+      staticClass: "td label"
+    }, [_vm._v(_vm._s(_vm.repositoryLabel))]), _vm._v(" "), _c('div', {
+      staticClass: "td"
+    }, [_vm._v("\n              " + _vm._s(backup.repoName) + "\n            ")])]), _vm._v(" "), _c('div', {
+      staticClass: "tr"
+    }, [_c('div', {
+      staticClass: "td label"
+    }, [_vm._v(_vm._s(_vm.completedLabel))]), _vm._v(" "), _c('div', {
+      staticClass: "td"
+    }, [_vm.status[backup.id] && _vm.status[backup.id].end ? _c('span', [_vm._v("\n                " + _vm._s(_vm._f("date")(_vm.status[backup.id].end * 1000, "yyyy-MM-dd HH:mm:ss")) + "\n              ")]) : _c('span', [_vm._v("-")])])]), _vm._v(" "), _c('div', {
+      staticClass: "tr"
+    }, [_c('div', {
+      staticClass: "td label"
+    }, [_vm._v(_vm._s(_vm.durationLabel))]), _vm._v(" "), _c('div', {
+      staticClass: "td"
+    }, [_vm.status[backup.id] && _vm.status[backup.id].end && _vm.status[backup.id].start ? _c('span', [_vm._v("\n                " + _vm._s(_vm._f("secondsFormat")(_vm.status[backup.id].end - _vm.status[backup.id].start)) + "\n              ")]) : _c('span', [_vm._v("-")])])]), _vm._v(" "), _c('div', {
+      staticClass: "tr"
+    }, [_c('div', {
+      staticClass: "td label"
+    }, [_vm._v(_vm._s(_vm.totalSizeLabel))]), _vm._v(" "), _c('div', {
+      staticClass: "td"
+    }, [_vm.status[backup.id] && _vm.status[backup.id].total_size ? _c('span', [_vm._v("\n                " + _vm._s(_vm._f("byteFormat")(_vm.status[backup.id].total_size)) + "\n              ")]) : _c('span', [_vm._v("-")])])]), _vm._v(" "), _c('div', {
+      staticClass: "tr"
+    }, [_c('div', {
+      staticClass: "td label"
+    }, [_vm._v(_vm._s(_vm.totalFileCountLabel))]), _vm._v(" "), _c('div', {
+      staticClass: "td"
+    }, [_vm.status[backup.id] && _vm.status[backup.id].total_file_count ? _c('span', [_vm._v("\n                " + _vm._s(_vm._f("humanFormat")(_vm.status[backup.id].total_file_count)) + "\n                (" + _vm._s(_vm.status[backup.id].total_file_count) + ")\n              ")]) : _c('span', [_vm._v("-")])])])])])]);
+  }), _vm._v(" "), _c('div', [_c('div', {
+    staticClass: "row mg-top-sm"
+  }, [_c('NsButton', {
+    attrs: {
+      "kind": "ghost",
+      "icon": _vm.ArrowRight20,
+      "disabled": _vm.loading
+    },
+    on: {
+      "click": _vm.goToBackup
     }
-  })], 1)], 2), _vm._v(" "), _c('template', {
-    slot: "secondary-button"
-  }, [_vm._v(_vm._s(_vm.cancelLabel))]), _vm._v(" "), _c('template', {
-    slot: "primary-button"
-  }, [_vm._v(_vm._s(_vm.deleteLabel))])], 2);
+  }, [_vm._v(_vm._s(_vm.goToBackupLabel) + "\n      ")])], 1)])], 2);
 };
 
 var __vue_staticRenderFns__$6 = [];
@@ -7637,8 +8361,8 @@ var __vue_staticRenderFns__$6 = [];
 
 const __vue_inject_styles__$6 = function (inject) {
   if (!inject) return;
-  inject("data-v-dce15384_0", {
-    source: ".type-to-confirm[data-v-dce15384]{margin-top:2rem}",
+  inject("data-v-121f4f43_0", {
+    source: ".ns-backup-card[data-v-121f4f43]{display:flex;flex-direction:column;justify-content:center;min-height:7rem}.row[data-v-121f4f43]{display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.title[data-v-121f4f43]{margin-left:.25rem;margin-right:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.table-wrapper[data-v-121f4f43]{display:flex;justify-content:center;margin-top:.5rem}.table[data-v-121f4f43]{display:table}.tr[data-v-121f4f43]{display:table-row}.td[data-v-121f4f43]{display:table-cell}.label[data-v-121f4f43]{padding-right:.75rem;font-weight:700;text-align:right;padding-bottom:.5rem}.status[data-v-121f4f43]{font-weight:700}.backup-status-icon[data-v-121f4f43]{margin-right:.25rem}",
     map: undefined,
     media: undefined
   });
@@ -7646,7 +8370,7 @@ const __vue_inject_styles__$6 = function (inject) {
 /* scoped */
 
 
-const __vue_scope_id__$6 = "data-v-dce15384";
+const __vue_scope_id__$6 = "data-v-121f4f43";
 /* module identifier */
 
 const __vue_module_identifier__$6 = undefined;
@@ -8198,7 +8922,7 @@ var task = {
           return CheckmarkFilled16;
 
         case "pending":
-          return WarningFilled16;
+          return Warning16;
 
         default:
           return InformationFilled16;
@@ -8248,88 +8972,6 @@ var task = {
   }
 };
 
-var icon = {
-  name: "IconService",
-
-  data() {
-    return {
-      Close20,
-      ArrowRight20,
-      Notification20,
-      UserAvatar20,
-      AppSwitcher20,
-      Search20,
-      RowExpand20,
-      RowCollapse20,
-      Reset20,
-      Download20,
-      Launch20,
-      Upgrade20,
-      Settings20,
-      ChevronDown20,
-      ChevronUp20,
-      ChevronLeft20,
-      ChevronRight20,
-      Information20,
-      Application20,
-      // used for apps, module instances and software center
-      Add20,
-      Rocket20,
-      Rocket32,
-      Chip20,
-      // used for cluster nodes
-      Chip32,
-      // used for cluster nodes
-      Save20,
-      Save32,
-      Copy20,
-      Application32,
-      // used for apps, module instances and software center
-      EdgeNode20,
-      EdgeNode32,
-      Cube32,
-      // used for systemd services
-      EdgeCluster32,
-      // used for cluster
-      EdgeCluster20,
-      // used for cluster
-      Connect32,
-      // used for join cluster
-      Connect20,
-      // used for join cluster
-      Edit20,
-      Password20,
-      Star20,
-      Checkmark20,
-      ZoomIn20,
-      // used to open details
-      Events32,
-      // used for domains
-      Link32,
-      // used for URLs and external domain providers
-      Link20,
-      // used for URLs and external domain providers
-      WarningAlt32,
-      WarningAlt20,
-      Tools20,
-      Tools32,
-      Network_220,
-      Network_232,
-      DataBase20,
-      DataBase32,
-      DataBackup20,
-      DataBackup32,
-      ArrowDown20,
-      ArrowDown32,
-      Time20,
-      Time32,
-      Hourglass20,
-      Hourglass32
-    };
-  }
-
-};
-
 var dataTable = {
   name: "DataTableService",
   mixins: [UtilService],
@@ -15526,6 +16168,38 @@ var filters = {
     return result;
   },
   secondsFormat: function (value) {
+    if (value < 0) {
+      return "-";
+    }
+
+    let hours = parseInt(Math.floor(value / 3600));
+    let minutes = parseInt(Math.floor((value - hours * 3600) / 60));
+    let seconds = parseInt((value - (hours * 3600 + minutes * 60)) % 60);
+    let duration = "";
+
+    if (hours > 0) {
+      duration += hours + "h ";
+    }
+
+    if (minutes > 0) {
+      duration += minutes + "m ";
+    }
+
+    if (seconds > 0) {
+      duration += seconds + "s";
+    }
+
+    if (!duration) {
+      return "0s";
+    }
+
+    return duration.trim();
+  },
+  secondsLongFormat: function (value) {
+    if (value < 0) {
+      return "-";
+    }
+
     let hours = parseInt(Math.floor(value / 3600));
     let minutes = parseInt(Math.floor((value - hours * 3600) / 60));
     let seconds = parseInt((value - (hours * 3600 + minutes * 60)) % 60);
@@ -15540,25 +16214,28 @@ var filters = {
 
 var components = /*#__PURE__*/Object.freeze({
   __proto__: null,
-  NsButton: __vue_component__$I,
-  NsEmptyState: __vue_component__$D,
+  NsButton: __vue_component__$O,
+  NsEmptyState: __vue_component__$J,
   NsPictogram: NsPictogram,
-  NsCodeSnippet: __vue_component__$B,
+  NsCodeSnippet: __vue_component__$H,
   NsInlineNotification: NsInlineNotification,
   NsProgressBar: NsProgressBar,
   NsSvg: NsSvg,
-  NsTile: __vue_component__$v,
-  NsToastNotification: __vue_component__$t,
-  NsInfoCard: __vue_component__$r,
-  NsStatusCard: __vue_component__$p,
-  NsSystemdServiceCard: __vue_component__$n,
-  NsPasswordInput: __vue_component__$l,
-  NsIconMenu: __vue_component__$j,
-  NsMeterChart: __vue_component__$h,
-  NsPieChart: __vue_component__$f,
+  NsTile: __vue_component__$B,
+  NsToastNotification: __vue_component__$z,
+  NsInfoCard: __vue_component__$x,
+  NsStatusCard: __vue_component__$v,
+  NsSystemdServiceCard: __vue_component__$t,
+  NsPasswordInput: __vue_component__$r,
+  NsIconMenu: __vue_component__$p,
+  NsMeterChart: __vue_component__$n,
+  NsPieChart: __vue_component__$l,
   NsLottieAnimation: NsLottieAnimation,
-  NsDangerDeleteModal: __vue_component__$d,
+  NsDangerDeleteModal: __vue_component__$j,
   NsCircleTimer: NsCircleTimer,
+  NsDropdownAction: __vue_component__$h,
+  NsTextInput: __vue_component__$f,
+  NsBackupCard: __vue_component__$d,
   ExclamationMark: ExclamationMark,
   Gear: __vue_component__$b,
   Love: __vue_component__$9,
@@ -15570,7 +16247,7 @@ var components = /*#__PURE__*/Object.freeze({
   QueryParamService: queryParam,
   TaskService: task,
   StorageService: StorageService,
-  IconService: icon,
+  IconService: IconService,
   DateTimeService: DateTimeService,
   DataTableService: dataTable,
   PageTitleService: pageTitle,
@@ -15586,4 +16263,4 @@ const install = function installNs8UiLib(Vue) {
   });
 }; // Create module definition for Vue.use()
 
-export { __vue_component__$5 as Bulldozer, dataTable as DataTableService, DateTimeService, ExclamationMark, filters as Filters, __vue_component__$b as Gear, __vue_component__$3 as Group, __vue_component__$1 as HardDrive, icon as IconService, lottie as LottieService, __vue_component__$9 as Love, __vue_component__$I as NsButton, NsCircleTimer, __vue_component__$B as NsCodeSnippet, __vue_component__$d as NsDangerDeleteModal, __vue_component__$D as NsEmptyState, __vue_component__$j as NsIconMenu, __vue_component__$r as NsInfoCard, NsInlineNotification, NsLottieAnimation, __vue_component__$h as NsMeterChart, __vue_component__$l as NsPasswordInput, NsPictogram, __vue_component__$f as NsPieChart, NsProgressBar, __vue_component__$p as NsStatusCard, NsSvg, __vue_component__$n as NsSystemdServiceCard, __vue_component__$v as NsTile, __vue_component__$t as NsToastNotification, pageTitle as PageTitleService, queryParam as QueryParamService, StorageService, task as TaskService, UtilService, __vue_component__$7 as Warning, install as default };
+export { __vue_component__$5 as Bulldozer, dataTable as DataTableService, DateTimeService, ExclamationMark, filters as Filters, __vue_component__$b as Gear, __vue_component__$3 as Group, __vue_component__$1 as HardDrive, IconService, lottie as LottieService, __vue_component__$9 as Love, __vue_component__$d as NsBackupCard, __vue_component__$O as NsButton, NsCircleTimer, __vue_component__$H as NsCodeSnippet, __vue_component__$j as NsDangerDeleteModal, __vue_component__$h as NsDropdownAction, __vue_component__$J as NsEmptyState, __vue_component__$p as NsIconMenu, __vue_component__$x as NsInfoCard, NsInlineNotification, NsLottieAnimation, __vue_component__$n as NsMeterChart, __vue_component__$r as NsPasswordInput, NsPictogram, __vue_component__$l as NsPieChart, NsProgressBar, __vue_component__$v as NsStatusCard, NsSvg, __vue_component__$t as NsSystemdServiceCard, __vue_component__$f as NsTextInput, __vue_component__$B as NsTile, __vue_component__$z as NsToastNotification, pageTitle as PageTitleService, queryParam as QueryParamService, StorageService, task as TaskService, UtilService, __vue_component__$7 as Warning, install as default };