@vcita/design-system 0.6.15 → 0.6.17-beta.0

package/dist/@vcita/design-system.ssr.js

@@ -1997,11 +1997,7 @@ var script$F = {
       default: ''
     },
     content: {
-      type: String,
-      required: true,
-      validator: function validator(prop) {
-        return prop.length > 0;
-      }
+      type: String
     },
     top: {
       type: Boolean,
@@ -2098,7 +2094,7 @@ var __vue_staticRenderFns__$F = [];
 
 var __vue_inject_styles__$F = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-7451f0bc_0", {
+  inject("data-v-2dee755a_0", {
     source: ":root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-tooltip{opacity:1!important;padding:0;border-radius:var(--border-radius)}.vc-tooltip .dark-tooltip{background-color:rgba(0,0,0,.97);font-size:var(--size-value3);font-weight:400;border-radius:var(--size-value1);padding:var(--size-value2)}.vc-tooltip .tooltip-wrapper{background:var(--modal-bg-color);box-shadow:0 5px 5px -3px rgba(0,0,0,.1),0 8px 10px 1px rgba(0,0,0,.06),0 3px 14px 2px rgba(0,0,0,.06);border-radius:var(--border-radius)}.vc-tooltip .tooltip-wrapper .tooltip-header{color:var(--gray-darken-5);font-size:var(--font-size-small2);border-radius:var(--border-radius) var(--border-radius) 0 0;font-weight:var(--font-weight-large);padding:var(--size-value3) var(--size-value4)}.vc-tooltip .tooltip-wrapper .tooltip-header.alert{background-color:var(--red-lighten-3)}.vc-tooltip .tooltip-wrapper .tooltip-header.information{background-color:var(--blue-lighten-3)}.vc-tooltip .tooltip-wrapper .tooltip-content{display:block;font-size:var(--font-size-x-small);padding:var(--size-value3) var(--size-value4) var(--size-value4)}.vc-tooltip .tooltip-wrapper .tooltip-content .content-text{color:var(--gray-darken-5);max-width:fit-content;min-width:250px;word-wrap:break-word}",
     map: undefined,
     media: undefined
@@ -2110,7 +2106,7 @@ var __vue_inject_styles__$F = function __vue_inject_styles__(inject) {
 var __vue_scope_id__$F = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$F = "data-v-7451f0bc";
+var __vue_module_identifier__$F = "data-v-2dee755a";
 /* functional template */
 
 var __vue_is_functional_template__$F = false;
@@ -3477,8 +3473,8 @@ var __vue_render__$v = function __vue_render__() {
     staticClass: "VcChecklistItem-wrapper",
     attrs: {
       "content": _vm.tooltipContent,
-      "dark": "",
-      "disabled": !_vm.tooltipContent || !_vm.disabled
+      "disabled": !_vm.tooltipContent || !_vm.disabled,
+      "dark": ""
     }
   }, [[_c('VcLayout', {
     staticClass: "VcChecklistItem",
@@ -3490,12 +3486,12 @@ var __vue_render__$v = function __vue_render__() {
     }
   }, [_c('VcCheckbox', {
     attrs: {
-      "checked": _vm.checked,
       "avatar": _vm.getAvatar,
-      "label": _vm.label,
-      "show-avatar-border": false,
+      "checked": _vm.checked,
+      "data-qa": _vm.dataQa + "-checkbox",
       "disabled": _vm.disabled,
-      "data-qa": _vm.dataQa + "-checkbox"
+      "label": _vm.label,
+      "show-avatar-border": false
     },
     on: {
       "change": _vm.onChange
@@ -3508,8 +3504,8 @@ var __vue_staticRenderFns__$v = [];
 
 var __vue_inject_styles__$v = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-0dd1f5eb_0", {
-    source: "[data-v-0dd1f5eb]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcChecklistItem-wrapper[data-v-0dd1f5eb]{width:100%}.VcChecklistItem-wrapper .VcChecklistItem.disabled[data-v-0dd1f5eb]{background-color:var(--gray-lighten-3)}.VcChecklistItem-wrapper .VcChecklistItem .vc-checkbox[data-v-0dd1f5eb]{flex:1 1 auto;padding:var(--size-value0);margin:var(--size-value0)}.VcChecklistItem-wrapper .VcChecklistItem .vc-checkbox[data-v-0dd1f5eb]  .v-input__control .v-input__slot{padding:var(--size-value2) var(--size-value4)}.VcChecklistItem-wrapper .VcChecklistItem[data-v-0dd1f5eb]:hover{background-color:var(--gray-lighten-3)}.VcChecklistItem-wrapper .VcChecklistItem[data-v-0dd1f5eb]:focus{box-shadow:0 0 0 2px var(--v-secondary-lighten1)}.VcChecklistItem-wrapper .VcChecklistItem[data-v-0dd1f5eb]:active{background-color:var(--v-secondary-lighten3)}",
+  inject("data-v-6ae9d122_0", {
+    source: "[data-v-6ae9d122]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcChecklistItem-wrapper[data-v-6ae9d122]{width:100%}.VcChecklistItem-wrapper[hide=true][data-v-6ae9d122]{display:none}.VcChecklistItem-wrapper .VcChecklistItem.disabled[data-v-6ae9d122]{background-color:var(--gray-lighten-3)}.VcChecklistItem-wrapper .VcChecklistItem .vc-checkbox[data-v-6ae9d122]{flex:1 1 auto;padding:var(--size-value0);margin:var(--size-value0)}.VcChecklistItem-wrapper .VcChecklistItem .vc-checkbox[data-v-6ae9d122]  .v-input__control .v-input__slot{padding:var(--size-value2) var(--size-value4)}.VcChecklistItem-wrapper .VcChecklistItem[data-v-6ae9d122]:hover{background-color:var(--gray-lighten-3)}.VcChecklistItem-wrapper .VcChecklistItem[data-v-6ae9d122]:focus{box-shadow:0 0 0 2px var(--v-secondary-lighten1)}.VcChecklistItem-wrapper .VcChecklistItem[data-v-6ae9d122]:active{background-color:var(--v-secondary-lighten3)}",
     map: undefined,
     media: undefined
   });
@@ -3517,10 +3513,10 @@ var __vue_inject_styles__$v = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$v = "data-v-0dd1f5eb";
+var __vue_scope_id__$v = "data-v-6ae9d122";
 /* module identifier */
 
-var __vue_module_identifier__$v = "data-v-0dd1f5eb";
+var __vue_module_identifier__$v = "data-v-6ae9d122";
 /* functional template */
 
 var __vue_is_functional_template__$v = false;
@@ -3530,64 +3526,92 @@ var __vue_component__$v = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$v,
   staticRenderFns: __vue_staticRenderFns__$v
 }, __vue_inject_styles__$v, __vue_script__$v, __vue_scope_id__$v, __vue_is_functional_template__$v, __vue_module_identifier__$v, false, undefined, createInjectorSSR, undefined);var script$u = {
-  name: "VcListbox",
+  name: 'VcTextField',
   components: {
-    VcChecklistItem: __vue_component__$v,
-    VcIcon: __vue_component__$R,
-    VcTooltip: __vue_component__$F,
-    VListItem: lib.VListItem,
-    VListItemGroup: lib.VListItemGroup,
-    VDivider: lib.VDivider,
-    VList: lib.VList
+    VcIconWithTooltip: __vue_component__$E,
+    VTextField: lib.VTextField
   },
   props: {
-    items: {
-      type: Array,
-      required: true,
-      validator: function validator(items) {
-        return items.every(function (item) {
-          return item.label;
-        });
+    type: {
+      type: String,
+      default: 'text',
+      validator: function validator(prop) {
+        return ['text', 'number', 'search'].includes(prop);
       }
     },
-    addAnother: {
+    dataQa: {
+      type: String,
+      default: 'vc-text-field'
+    },
+    label: {
+      type: String,
+      default: ''
+    },
+    value: {
+      type: [Number, String],
+      default: ''
+    },
+    counter: {
+      type: [Number, Boolean],
+      default: false
+    },
+    maxlength: {
+      type: Number,
+      default: 100,
+      validator: function validator(prop) {
+        return prop > 0;
+      }
+    },
+    rules: {
+      type: Array
+    },
+    disabled: {
       type: Boolean,
       default: false
     },
-    addAnotherLabel: {
+    hint: {
       type: String,
-      default: ""
+      default: ''
     },
-    title: {
+    placeholder: {
       type: String,
       default: ''
     },
-    dataQa: {
+    tooltipHeader: {
       type: String,
-      default: 'VcListbox'
-    }
-  },
-  computed: {
-    getAddAnotherLabel: function getAddAnotherLabel() {
-      return this.addAnotherLabel || this.$dst('ds.listbox.add');
+      default: ''
     },
-    confirmedArray: function confirmedArray() {
-      return this.items.filter(function (item) {
-        return item.checked;
-      });
-    }
-  },
-  methods: {
-    onSelection: function onSelection(selections) {
-      var newSelections = selections.map(function (selected) {
-        return _objectSpread2(_objectSpread2({}, selected), {}, {
-          checked: true
-        });
-      });
-      this.$emit('change', newSelections);
+    tooltipContent: {
+      type: String,
+      default: ''
     },
-    setDataQa: function setDataQa(label) {
-      return label.replace(/ /g, '-');
+    tooltipNudgeLeft: {
+      type: Number,
+      default: 0
+    },
+    tooltipNudgeRight: {
+      type: Number,
+      default: 0
+    },
+    prefix: {
+      type: String,
+      default: ''
+    },
+    errorMessages: {
+      type: String,
+      default: ''
+    },
+    hideDetails: {
+      type: [Boolean, String],
+      default: 'auto'
+    },
+    persistentHint: {
+      type: Boolean,
+      default: true
+    },
+    singleLine: {
+      type: Boolean,
+      default: false
     }
   }
 };/* script */
@@ -3601,66 +3625,55 @@ var __vue_render__$u = function __vue_render__() {
 
   var _c = _vm._self._c || _h;
 
-  return _c('div', [_vm._ssrNode((_vm.title ? "<div" + _vm._ssrAttr("data-qa", _vm.dataQa + "-title") + " class=\"vc-list-title\" data-v-6c0335a4>" + _vm._ssrEscape("\n    " + _vm._s(_vm.title) + "\n  ") + "</div>" : "<!---->") + " "), _c('v-list', {
-    staticClass: "VcListbox",
-    attrs: {
-      "data-qa": _vm.dataQa
-    }
-  }, [_c('div', {
-    staticClass: "vc-overflow"
-  }, [_c('v-list-item-group', {
+  return _c('v-text-field', {
+    staticClass: "VcTextInput",
     attrs: {
-      "value": _vm.confirmedArray,
-      "multiple": ""
+      "dense": "",
+      "data-qa": _vm.dataQa,
+      "label": _vm.label,
+      "placeholder": _vm.placeholder,
+      "rules": _vm.rules,
+      "disabled": _vm.disabled,
+      "type": _vm.type,
+      "error": _vm.counter && !!_vm.maxlength && _vm.value.length > _vm.maxlength,
+      "error-messages": _vm.errorMessages,
+      "value": _vm.value,
+      "hint": _vm.hint,
+      "counter": _vm.counter,
+      "maxlength": _vm.maxlength,
+      "prefix": _vm.prefix,
+      "persistent-hint": _vm.persistentHint,
+      "single-line": _vm.singleLine,
+      "hide-details": _vm.hideDetails
     },
     on: {
-      "change": _vm.onSelection
-    }
-  }, _vm._l(_vm.items, function (item, index) {
-    return _c('VcTooltip', {
-      key: index,
-      attrs: {
-        "dark": "",
-        "content": item.tooltipContent,
-        "disabled": !item.tooltipContent || !item.disabled,
-        "data-qa": _vm.dataQa + "-" + _vm.setDataQa(item.label) + "-tooltip"
-      }
-    }, [_c('v-list-item', {
-      staticClass: "vc-list-item",
-      attrs: {
-        "tabindex": index,
-        "value": item,
-        "disabled": item.disabled
-      }
-    }, [_c('VcChecklistItem', _vm._b({
-      attrs: {
-        "data-qa": _vm.dataQa + "-" + _vm.setDataQa(item.label)
+      "input": function input(data) {
+        return _vm.$emit('input', data);
       }
-    }, 'VcChecklistItem', item, false))], 1)], 1);
-  }), 1)], 1), _vm._v(" "), _vm.addAnother ? _c('div', {
-    attrs: {
-      "data-qa": _vm.dataQa + "-increase"
-    }
-  }, [_c('v-divider', {
-    staticClass: "divider"
-  }), _vm._v(" "), _c('v-list-item', {
-    staticClass: "last-item",
-    attrs: {
-      "align-baseline": ""
     },
-    on: {
-      "click": function click($event) {
-        return _vm.$emit('addNew');
-      }
-    }
-  }, [_c('VcIcon', {
-    staticClass: "add-another-icon",
-    attrs: {
-      "dense": ""
-    }
-  }, [_vm._v("$plus")]), _vm._v(" "), _c('span', {
-    staticClass: "add-another-label"
-  }, [_vm._v(_vm._s(_vm.getAddAnotherLabel))])], 1)], 1) : _vm._e()])], 2);
+    scopedSlots: _vm._u([{
+      key: "prepend-inner",
+      fn: function fn() {
+        return [_vm._t("prepend-inner")];
+      },
+      proxy: true
+    }, {
+      key: "append",
+      fn: function fn() {
+        return [_vm.tooltipContent ? _c('VcIconWithTooltip', {
+          attrs: {
+            "header": _vm.tooltipHeader,
+            "content": _vm.tooltipContent,
+            "nudge-left": _vm.tooltipNudgeLeft,
+            "nudge-right": _vm.tooltipNudgeRight,
+            "size": 15,
+            "icon": 'question'
+          }
+        }) : _vm._e()];
+      },
+      proxy: true
+    }], null, true)
+  });
 };
 
 var __vue_staticRenderFns__$u = [];
@@ -3668,8 +3681,8 @@ var __vue_staticRenderFns__$u = [];
 
 var __vue_inject_styles__$u = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-6c0335a4_0", {
-    source: "[data-v-6c0335a4]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-list-title[data-v-6c0335a4]{font-weight:var(--font-weight-medium2);font-size:var(--font-size-small2);line-height:var(--size-value5);margin-block-end:var(--size-value3)}.VcListbox[data-v-6c0335a4]{padding-block:var(--size-value1);margin-block:var(--size-value1);border:1px solid var(--gray-lighten-1);box-sizing:border-box;border-radius:var(--border-radius);box-shadow:none!important}.VcListbox .vc-overflow[data-v-6c0335a4]{overflow:auto;max-height:160px}.VcListbox .vc-overflow .vc-list-item[data-v-6c0335a4]{padding:var(--size-value0);min-height:unset}.VcListbox .vc-overflow .vc-list-item[data-v-6c0335a4]:before{opacity:0}.VcListbox .divider[data-v-6c0335a4]{border-color:var(--gray-lighten-1)}.VcListbox .last-item[data-v-6c0335a4]{cursor:pointer;min-height:var(--size-value10)}.VcListbox .last-item[data-v-6c0335a4]:hover{background-color:var(--gray-lighten-3)}.VcListbox .last-item .add-another-label[data-v-6c0335a4]{font-weight:var(--font-weight-medium2);font-size:var(--font-size-x-small);line-height:var(--size-value5);color:var(--gray-darken-5)}.VcListbox .last-item .add-another-icon[data-v-6c0335a4]{margin-inline-end:var(--size-value3);cursor:pointer}.VcListbox .last-item .add-another-icon[data-v-6c0335a4]  .v-icon__component{height:unset;width:unset}.VcListbox .last-item .add-another-icon[data-v-6c0335a4]  .v-icon__component svg{width:var(--size-value3)}",
+  inject("data-v-2401387d_0", {
+    source: ".VcTextInput.v-text-field[data-v-2401387d]{font-family:var(--primary-font-family)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot{padding:0 var(--size-value3);height:var(--size-value13);background:#fff;border:1px solid var(--gray-lighten-1);box-sizing:border-box;border-radius:6px}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot label{font-size:var(--font-size-small2);line-height:var(--size-value5);color:var(--gray-darken-3);font-weight:var(--font-weight-medium)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot input{font-weight:var(--font-weight-medium2);font-size:var(--font-size-small2);line-height:var(--size-value5);color:var(--gray-darken-5);caret-color:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot input::placeholder{font-weight:var(--font-weight-medium)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:after,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:before{display:none}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:hover{border-color:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:active,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus-within{border:1px solid var(--v-secondary-base);box-shadow:0 0 0 3px var(--v-secondary-lighten1)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:active input,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus input,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus-within input{color:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d].error--text .v-input__slot{border-color:var(--red);color:unset;box-shadow:unset;font-size:var(--font-size-xx-small);line-height:var(--size-value4)}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-focused label,.VcTextInput.v-text-field[data-v-2401387d].v-input--is-label-active label{font-size:var(--font-size-small);line-height:1.17;letter-spacing:-.3px;color:var(--gray-darken-4)!important;transform:translateY(-100%) scale(.85);top:var(--size-value2)}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-focused .v-text-field__slot,.VcTextInput.v-text-field[data-v-2401387d].v-input--is-label-active .v-text-field__slot{margin-bottom:-14px}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-disabled .v-input__slot{background:var(--gray-lighten-3);border:1px solid var(--gray-lighten-1)}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-disabled .v-input__slot input,.VcTextInput.v-text-field[data-v-2401387d].v-input--is-disabled .v-input__slot label{color:var(--gray-darken-2)}.VcTextInput.v-text-field[data-v-2401387d]:not(.v-input--is-label-active):not(.v-input--is-focused) input{padding:var(--size-value2) 0}.VcTextInput.v-text-field[data-v-2401387d] .v-messages__message{line-height:var(--size-value4)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__append-inner{align-self:center;fill:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d].v-input--dense:not(.v-text-field--outlined) input{padding-block:var(--size-value2)}",
     map: undefined,
     media: undefined
   });
@@ -3677,10 +3690,10 @@ var __vue_inject_styles__$u = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$u = "data-v-6c0335a4";
+var __vue_scope_id__$u = "data-v-2401387d";
 /* module identifier */
 
-var __vue_module_identifier__$u = "data-v-6c0335a4";
+var __vue_module_identifier__$u = "data-v-2401387d";
 /* functional template */
 
 var __vue_is_functional_template__$u = false;
@@ -3689,62 +3702,106 @@ var __vue_is_functional_template__$u = false;
 var __vue_component__$u = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$u,
   staticRenderFns: __vue_staticRenderFns__$u
-}, __vue_inject_styles__$u, __vue_script__$u, __vue_scope_id__$u, __vue_is_functional_template__$u, __vue_module_identifier__$u, false, undefined, createInjectorSSR, undefined);var script$t = {
-  name: "VcBottomSheet",
+}, __vue_inject_styles__$u, __vue_script__$u, __vue_scope_id__$u, __vue_is_functional_template__$u, __vue_module_identifier__$u, false, undefined, createInjectorSSR, undefined);var throttle = require("lodash.throttle");
+
+var script$t = {
+  name: "VcSearchBar",
   components: {
-    VcLayout: __vue_component__$O,
-    VSheet: lib.VSheet,
-    VBottomSheet: lib.VBottomSheet
+    VcTextField: __vue_component__$u,
+    VcIcon: __vue_component__$R
   },
   props: {
-    value: {
+    size: {
+      type: String,
+      default: 'large',
+      validator: function validator(size) {
+        return ['medium', 'large'].includes(size);
+      }
+    },
+    label: {
+      type: String
+    },
+    placeholder: {
+      type: String
+    },
+    caseSensitive: {
       type: Boolean,
       default: false
     },
-    persistent: {
+    throttleTime: {
+      type: Number,
+      default: 500,
+      validator: function validator(throttleTime) {
+        return throttleTime > 0;
+      }
+    },
+    borderTopRadius: {
       type: Boolean,
       default: false
     },
     dataQa: {
       type: String,
-      default: 'vc-bottom-sheet'
+      default: 'vc-search-bar'
     }
-  }
-};/* script */
-var __vue_script__$t = script$t;
-/* template */
-
-var __vue_render__$t = function __vue_render__() {
-  var _vm = this;
-
-  var _h = _vm.$createElement;
-
-  var _c = _vm._self._c || _h;
-
-  return _c('v-bottom-sheet', {
+  },
+  computed: {
+    getLabel: function getLabel() {
+      return this.label || this.$dst('ds.search_bar.label');
+    },
+    getPlaceholder: function getPlaceholder() {
+      return this.placeholder || this.$dst('ds.search_bar.label');
+    },
+    getClasses: function getClasses() {
+      return "".concat(this.size).concat(this.borderTopRadius ? ' border-top-radius' : '');
+    }
+  },
+  data: function data() {
+    var _this = this;
+
+    return {
+      searchThrottled: throttle(function (search) {
+        _this.$emit('search', _this.caseSensitive ? search : search.toLowerCase());
+      }, this.throttleTime)
+    };
+  }
+};/* script */
+var __vue_script__$t = script$t;
+/* template */
+
+var __vue_render__$t = function __vue_render__() {
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('VcTextField', {
+    class: "vc-search-bar " + _vm.getClasses,
     attrs: {
-      "value": _vm.value,
-      "persistent": _vm.persistent,
       "data-qa": _vm.dataQa,
-      "content-class": "VcBottomSheet"
+      "label": _vm.getLabel,
+      "persistent-hint": false,
+      "placeholder": _vm.getPlaceholder,
+      "hide-details": "",
+      "single-line": "",
+      "type": "search"
     },
     on: {
-      "input": function input(val) {
-        return _vm.$emit('input', val);
-      }
+      "input": _vm.searchThrottled
     },
     scopedSlots: _vm._u([{
-      key: "activator",
-      fn: function fn(activatorObj) {
-        return [_vm._t("activator", null, null, activatorObj)];
-      }
-    }], null, true)
-  }, [_vm._v(" "), _c('v-sheet', {
-    staticClass: "vc-sheet",
-    attrs: {
-      "data-qa": _vm.dataQa + "-sheet"
-    }
-  }, [_vm._t("default")], 2)], 1);
+      key: "prepend-inner",
+      fn: function fn() {
+        return [_c('VcIcon', {
+          staticClass: "vc-search-bar__magnify",
+          attrs: {
+            "small": ""
+          }
+        }, [_vm._v("$magnify_glass")])];
+      },
+      proxy: true
+    }])
+  });
 };
 
 var __vue_staticRenderFns__$t = [];
@@ -3752,8 +3809,8 @@ var __vue_staticRenderFns__$t = [];
 
 var __vue_inject_styles__$t = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-d837dcb8_0", {
-    source: "[data-v-d837dcb8]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcBottomSheet .vc-sheet[data-v-d837dcb8]{max-height:92vh;border-radius:var(--modal-border-radius) var(--modal-border-radius) 0 0;display:flex;box-shadow:var(--modal-box-shadow)}",
+  inject("data-v-aa7c74d0_0", {
+    source: ".vc-search-bar.VcTextInput[data-v-aa7c74d0]{padding:var(--size-value0);margin:var(--size-value0)}.vc-search-bar.VcTextInput.border-top-radius[data-v-aa7c74d0]  .v-input__control .v-input__slot{border-radius:var(--border-radius) var(--border-radius) var(--size-value0) var(--size-value0)}.vc-search-bar.VcTextInput.v-input--has-state[data-v-aa7c74d0]  .v-input__slot .v-text-field__slot,.vc-search-bar.VcTextInput.v-input--is-focused[data-v-aa7c74d0]  .v-input__slot .v-text-field__slot,.vc-search-bar.VcTextInput.v-input--is-label-active[data-v-aa7c74d0]  .v-input__slot .v-text-field__slot{margin:0}.vc-search-bar.VcTextInput__magnify[data-v-aa7c74d0]{fill:var(--gray-darken-2)}.vc-search-bar.VcTextInput[data-v-aa7c74d0]:hover{border-color:var(--gray-darken-2)}.vc-search-bar.VcTextInput[data-v-aa7c74d0]:hover  .v-input__slot label{color:var(--gray-darken-2)}.vc-search-bar.VcTextInput.medium[data-v-aa7c74d0]  .v-input__control .v-input__slot{height:var(--size-value10)}.vc-search-bar.VcTextInput.medium[data-v-aa7c74d0]  .v-input__control .v-input__slot .v-input__prepend-inner{padding:var(--size-value3)}.vc-search-bar.VcTextInput[data-v-aa7c74d0]  .v-input__control .v-input__slot{padding:var(--size-value0)}.vc-search-bar.VcTextInput[data-v-aa7c74d0]  .v-input__control .v-input__slot .v-input__prepend-inner{padding:18px var(--size-value3);margin:var(--size-value0)}",
     map: undefined,
     media: undefined
   });
@@ -3761,10 +3818,10 @@ var __vue_inject_styles__$t = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$t = "data-v-d837dcb8";
+var __vue_scope_id__$t = "data-v-aa7c74d0";
 /* module identifier */
 
-var __vue_module_identifier__$t = "data-v-d837dcb8";
+var __vue_module_identifier__$t = "data-v-aa7c74d0";
 /* functional template */
 
 var __vue_is_functional_template__$t = false;
@@ -3774,73 +3831,98 @@ var __vue_component__$t = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$t,
   staticRenderFns: __vue_staticRenderFns__$t
 }, __vue_inject_styles__$t, __vue_script__$t, __vue_scope_id__$t, __vue_is_functional_template__$t, __vue_module_identifier__$t, false, undefined, createInjectorSSR, undefined);var script$s = {
-  name: "VcInputBottomSheet",
+  name: "VcListbox",
   components: {
-    VcBottomSheet: __vue_component__$t,
-    VcModalHeader: __vue_component__$M,
     VcLayout: __vue_component__$O,
-    VcModalFooter: __vue_component__$N,
-    VcForm: __vue_component__$K
+    VcSearchBar: __vue_component__$t,
+    VcChecklistItem: __vue_component__$v,
+    VcIcon: __vue_component__$R,
+    VcTooltip: __vue_component__$F,
+    VListItem: lib.VListItem,
+    VListItemGroup: lib.VListItemGroup,
+    VDivider: lib.VDivider,
+    VList: lib.VList
   },
   props: {
-    value: {
-      type: Boolean,
-      default: false
-    },
-    title: {
-      Type: String
-    },
-    okButtonLabel: {
-      type: String
-    },
-    cancelButtonLabel: {
-      type: String
+    items: {
+      type: Array,
+      required: true,
+      validator: function validator(items) {
+        return items.every(function (item) {
+          return item.label && item.identifier || item.identifier === 0;
+        });
+      }
     },
-    closeButton: {
+    addAnother: {
       type: Boolean,
-      default: true
+      default: false
     },
-    footer: {
+    addSearch: {
       type: Boolean,
-      default: true
+      default: false
     },
-    showHeaderDivider: {
-      type: Boolean,
-      default: true
+    addAnotherLabel: {
+      type: String,
+      default: ""
     },
-    showFooterDivider: {
-      type: Boolean,
-      default: true
+    title: {
+      type: String,
+      default: ''
     },
-    persistent: {
-      type: Boolean,
-      default: false
+    emptyListMsg: {
+      type: String
     },
     dataQa: {
       type: String,
-      default: 'vc-bottom-sheet-input'
+      default: 'VcListbox'
     }
   },
   data: function data() {
     return {
-      validForm: true
+      search: ''
     };
   },
-  methods: {
-    onOkClicked: function onOkClicked() {
-      this.validate();
-      this.$emit('onOkClicked', {
-        valid: this.validForm
+  computed: {
+    getAddAnotherLabel: function getAddAnotherLabel() {
+      return this.addAnotherLabel || this.$dst('ds.listbox.add');
+    },
+    confirmedArray: function confirmedArray() {
+      return this.filteredItems.filter(function (item) {
+        return item.checked;
       });
     },
-    validate: function validate() {
-      this.$refs.mainForm.validate();
+    filteredItems: function filteredItems() {
+      var _this = this;
+
+      return this.items.map(function (item) {
+        return _objectSpread2(_objectSpread2({}, item), {}, {
+          hide: !item.label.toLowerCase().includes(_this.search)
+        });
+      });
     },
-    onMainFormValueChanged: function onMainFormValueChanged(value) {
-      this.validForm = value;
-      this.$emit('onValidationChanged', {
-        valid: this.validForm
+    listExist: function listExist() {
+      return this.filteredItems.some(function (item) {
+        return !item.hide;
       });
+    },
+    noItemsMsg: function noItemsMsg() {
+      return this.emptyListMsg || this.$dst('ds.listbox.empty_list');
+    }
+  },
+  methods: {
+    onSelection: function onSelection(selections) {
+      var newSelections = selections.map(function (selected) {
+        return _objectSpread2(_objectSpread2({}, selected), {}, {
+          checked: true
+        });
+      });
+      this.$emit('change', newSelections);
+    },
+    onSearch: function onSearch(search) {
+      this.search = search;
+    },
+    setDataQa: function setDataQa(label) {
+      return label.replace(/ /g, '-');
     }
   }
 };/* script */
@@ -3854,92 +3936,85 @@ var __vue_render__$s = function __vue_render__() {
 
   var _c = _vm._self._c || _h;
 
-  return _c('VcBottomSheet', {
-    attrs: {
-      "value": _vm.value,
-      "data-qa": _vm.dataQa,
-      "persistent": _vm.persistent
-    },
-    on: {
-      "input": function input(val) {
-        return _vm.$emit('input', val);
-      }
+  return _c('div', [_vm._ssrNode((_vm.title ? "<div" + _vm._ssrAttr("data-qa", _vm.dataQa + "-title") + " class=\"vc-list-title\" data-v-3e86f8c2>" + _vm._ssrEscape("\n    " + _vm._s(_vm.title) + "\n  ") + "</div>" : "<!---->") + " "), _c('v-list', {
+    staticClass: "VcListbox",
+    class: {
+      'with-search': _vm.addSearch,
+      'with-add-another': _vm.addAnother
     },
-    scopedSlots: _vm._u([{
-      key: "activator",
-      fn: function fn(ref) {
-        var attrs = ref.attrs;
-        var on = ref.on;
-        return [_vm._t("activator", null, null, {
-          attrs: attrs,
-          on: on
-        })];
-      }
-    }], null, true)
-  }, [_vm._v(" "), [_c('VcLayout', {
-    staticClass: "VcInputBottomSheet",
     attrs: {
-      "column": ""
+      "data-qa": _vm.dataQa
     }
-  }, [!!_vm.title ? _c('VcModalHeader', {
-    staticClass: "vc-bottom-sheet__header",
-    class: {
-      'showDivider': _vm.showHeaderDivider
+  }, [_vm.addSearch ? _c('VcSearchBar', {
+    attrs: {
+      "data-qa": _vm.dataQa + "-search",
+      "border-top-radius": ""
     },
+    on: {
+      "search": _vm.onSearch
+    }
+  }) : _vm._e(), _vm._v(" "), _c('div', {
+    staticClass: "vc-overflow"
+  }, [_vm.listExist ? _c('v-list-item-group', {
     attrs: {
-      "close-button": _vm.closeButton,
-      "data-qa": _vm.dataQa + "-header",
-      "show-back-button": false,
-      "title": _vm.title,
-      "flavor": "input"
+      "value": _vm.confirmedArray,
+      "multiple": ""
     },
     on: {
-      "onCloseButtonClicked": function onCloseButtonClicked($event) {
-        return _vm.$emit('input', false);
+      "change": _vm.onSelection
+    }
+  }, _vm._l(_vm.filteredItems, function (item) {
+    return _c('VcTooltip', {
+      key: item.identifier,
+      attrs: {
+        "content": item.tooltipContent,
+        "data-qa": _vm.dataQa + "-" + _vm.setDataQa(item.label) + "-tooltip",
+        "disabled": !item.tooltipContent || !item.disabled,
+        "dark": ""
       }
+    }, [_c('v-list-item', {
+      staticClass: "vc-list-item",
+      attrs: {
+        "disabled": item.disabled,
+        "tabindex": item.label + "-" + item.identifier,
+        "value": item
+      }
+    }, [_c('VcChecklistItem', _vm._b({
+      attrs: {
+        "data-qa": _vm.dataQa + "-" + _vm.setDataQa(item.label)
+      }
+    }, 'VcChecklistItem', item, false))], 1)], 1);
+  }), 1) : _c('VcLayout', {
+    staticClass: "VcListbox__empty",
+    attrs: {
+      "data-qa": _vm.dataQa + "-empty",
+      "align-center": "",
+      "justify-center": ""
     }
-  }) : _vm._e(), _vm._v(" "), _c('VcLayout', {
-    staticClass: "vc-bottom-sheet__content",
+  }, [_vm._v("\n        " + _vm._s(_vm.noItemsMsg) + "\n      ")])], 1), _vm._v(" "), _vm.addAnother ? _c('div', {
     attrs: {
-      "column": ""
+      "data-qa": _vm.dataQa + "-increase"
     }
-  }, [_c('VcForm', {
-    ref: "mainForm",
-    staticClass: "VcContent",
+  }, [_c('v-divider', {
+    staticClass: "divider"
+  }), _vm._v(" "), _c('v-list-item', {
+    staticClass: "last-item",
     attrs: {
-      "value": _vm.validForm,
-      "lazy-validation": ""
+      "align-baseline": ""
     },
     on: {
-      "input": _vm.onMainFormValueChanged,
-      "submit": function submit(data) {
-        return _vm.$emit('submit', data);
+      "click": function click($event) {
+        return _vm.$emit('addNew');
       }
     }
-  }, [_vm._t("default")], 2)], 1), _vm._v(" "), _vm.footer ? _c('VcModalFooter', {
-    staticClass: "vc-bottom-sheet__footer",
-    class: {
-      'showDivider': _vm.showHeaderDivider
-    },
+  }, [_c('VcIcon', {
+    staticClass: "add-another-icon",
     attrs: {
-      "buttons": [{
-        label: _vm.cancelButtonLabel || _vm.$dst("ds.modal.cancel"),
-        event: "onCancelClicked",
-        color: "white"
-      }, {
-        label: _vm.okButtonLabel || _vm.$dst("ds.modal.ok"),
-        event: "onOkClicked",
-        color: "secondary"
-      }],
-      "data-qa": _vm.dataQa + "-footer"
-    },
-    on: {
-      "onCancelClicked": function onCancelClicked($event) {
-        return _vm.$emit('onCancelClicked');
-      },
-      "onOkClicked": _vm.onOkClicked
+      "dense": ""
     }
-  }) : _vm._e()], 1)]], 2);
+  }, [_vm._v("$plus")]), _vm._v(" "), _c('span', {
+    staticClass: "add-another-label"
+  }, [_vm._v(_vm._s(_vm.getAddAnotherLabel))])], 1)], 1) : _vm._e()], 1)], 2);
 };
 
 var __vue_staticRenderFns__$s = [];
@@ -3947,8 +4022,8 @@ var __vue_staticRenderFns__$s = [];
 
 var __vue_inject_styles__$s = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-44a33895_0", {
-    source: "[data-v-44a33895]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcInputBottomSheet .vc-bottom-sheet__header.showDivider[data-v-44a33895]{border-bottom:1px solid var(--gray-lighten-1)}.VcInputBottomSheet .vc-bottom-sheet__footer[data-v-44a33895]{padding:var(--size-value3) var(--size-value4)}.VcInputBottomSheet .vc-bottom-sheet__footer.showDivider[data-v-44a33895]{border-top:1px solid var(--gray-lighten-1);display:flex}.VcInputBottomSheet .vc-bottom-sheet__content[data-v-44a33895]{padding:var(--size-value6) var(--size-value4);overflow-y:auto}",
+  inject("data-v-3e86f8c2_0", {
+    source: "[data-v-3e86f8c2]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-list-title[data-v-3e86f8c2]{font-weight:var(--font-weight-medium2);font-size:var(--font-size-small2);line-height:var(--size-value5);margin-block-end:var(--size-value3)}.VcListbox[data-v-3e86f8c2]{padding-block:var(--size-value1);margin-block:var(--size-value1);border:1px solid var(--gray-lighten-1);box-sizing:border-box;border-radius:var(--border-radius);box-shadow:none!important}.VcListbox.with-search[data-v-3e86f8c2]{border:none}.VcListbox.with-search .vc-overflow[data-v-3e86f8c2]{border-inline:var(--border-frame);border-block-end:var(--border-frame);border-radius:0 0 var(--border-radius) var(--border-radius)}.VcListbox.with-search.with-add-another .vc-overflow[data-v-3e86f8c2]{border-inline:var(--border-frame);border-block-end:unset;border-radius:unset}.VcListbox.with-search.with-add-another .last-item[data-v-3e86f8c2]{border-inline:var(--border-frame);border-block-end:var(--border-frame);border-radius:0 0 var(--border-radius) var(--border-radius)}.VcListbox .vc-overflow[data-v-3e86f8c2]{overflow:auto;height:160px}.VcListbox .vc-overflow .vc-list-item[data-v-3e86f8c2]{padding:var(--size-value0);min-height:unset}.VcListbox .vc-overflow .vc-list-item[data-v-3e86f8c2]:before{opacity:0}.VcListbox .divider[data-v-3e86f8c2]{border-color:var(--gray-lighten-1)}.VcListbox .last-item[data-v-3e86f8c2]{cursor:pointer;min-height:var(--size-value10);padding-block:var(--size-value1) var(--size-value2)}.VcListbox .last-item[data-v-3e86f8c2]:hover{background-color:var(--gray-lighten-3)}.VcListbox .last-item .add-another-label[data-v-3e86f8c2]{font-weight:var(--font-weight-medium2);font-size:var(--font-size-x-small);line-height:var(--size-value5);color:var(--gray-darken-5)}.VcListbox .last-item .add-another-icon[data-v-3e86f8c2]{margin-inline-end:var(--size-value3);cursor:pointer}.VcListbox .last-item .add-another-icon[data-v-3e86f8c2]  .v-icon__component{height:unset;width:unset}.VcListbox .last-item .add-another-icon[data-v-3e86f8c2]  .v-icon__component svg{width:var(--size-value3)}.VcListbox__empty[data-v-3e86f8c2]{height:100%;font-weight:var(--font-weight-medium2);font-size:var(--font-size-xx-small);color:var(--gray-darken-4)}",
     map: undefined,
     media: undefined
   });
@@ -3956,10 +4031,10 @@ var __vue_inject_styles__$s = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$s = "data-v-44a33895";
+var __vue_scope_id__$s = "data-v-3e86f8c2";
 /* module identifier */
 
-var __vue_module_identifier__$s = "data-v-44a33895";
+var __vue_module_identifier__$s = "data-v-3e86f8c2";
 /* functional template */
 
 var __vue_is_functional_template__$s = false;
@@ -3968,55 +4043,25 @@ var __vue_is_functional_template__$s = false;
 var __vue_component__$s = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$s,
   staticRenderFns: __vue_staticRenderFns__$s
-}, __vue_inject_styles__$s, __vue_script__$s, __vue_scope_id__$s, __vue_is_functional_template__$s, __vue_module_identifier__$s, false, undefined, createInjectorSSR, undefined);//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-//
-var script$r = {
+}, __vue_inject_styles__$s, __vue_script__$s, __vue_scope_id__$s, __vue_is_functional_template__$s, __vue_module_identifier__$s, false, undefined, createInjectorSSR, undefined);var script$r = {
+  name: "VcBottomSheet",
   components: {
-    VMenu: lib.VMenu
+    VcLayout: __vue_component__$O,
+    VSheet: lib.VSheet,
+    VBottomSheet: lib.VBottomSheet
   },
-
-  name: "VcPopover",
-
   props: {
     value: {
       type: Boolean,
       default: false
     },
-    closeOnClick: {
+    persistent: {
       type: Boolean,
-      default: true
-    },
-    top: {
-      type: Number
-    },
-    right: {
-      type: Number
-    },
-    bottom: {
-      type: Number
-    },
-    left: {
-      type: Number
+      default: false
     },
     dataQa: {
       type: String,
-      default: 'vc-popover'
+      default: 'vc-bottom-sheet'
     }
   }
 };/* script */
@@ -4030,17 +4075,12 @@ var __vue_render__$r = function __vue_render__() {
 
   var _c = _vm._self._c || _h;
 
-  return _c('v-menu', {
+  return _c('v-bottom-sheet', {
     attrs: {
-      "close-on-click": _vm.closeOnClick,
-      "close-on-content-click": false,
-      "data-qa": _vm.dataQa,
       "value": _vm.value,
-      "content-class": "vc-popover",
-      "nudge-top": _vm.top,
-      "nudge-right": _vm.right,
-      "nudge-bottom": _vm.bottom,
-      "nudge-left": _vm.left
+      "persistent": _vm.persistent,
+      "data-qa": _vm.dataQa,
+      "content-class": "VcBottomSheet"
     },
     on: {
       "input": function input(val) {
@@ -4049,16 +4089,16 @@ var __vue_render__$r = function __vue_render__() {
     },
     scopedSlots: _vm._u([{
       key: "activator",
-      fn: function fn(ref) {
-        var attrs = ref.attrs;
-        var on = ref.on;
-        return [_vm._t("activator", null, null, {
-          attrs: attrs,
-          on: on
-        })];
+      fn: function fn(activatorObj) {
+        return [_vm._t("activator", null, null, activatorObj)];
       }
     }], null, true)
-  }, [_vm._v(" "), _vm._t("default")], 2);
+  }, [_vm._v(" "), _c('v-sheet', {
+    staticClass: "vc-sheet",
+    attrs: {
+      "data-qa": _vm.dataQa + "-sheet"
+    }
+  }, [_vm._t("default")], 2)], 1);
 };
 
 var __vue_staticRenderFns__$r = [];
@@ -4066,8 +4106,8 @@ var __vue_staticRenderFns__$r = [];
 
 var __vue_inject_styles__$r = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-da6757e6_0", {
-    source: "[data-v-da6757e6]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-popover[data-v-da6757e6]{background-color:var(--modal-bg-color);width:var(--popover-width);max-height:var(--popover-max-height);display:flex;box-shadow:var(--modal-box-shadow);border-radius:var(--popover-border-radius)}",
+  inject("data-v-d837dcb8_0", {
+    source: "[data-v-d837dcb8]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcBottomSheet .vc-sheet[data-v-d837dcb8]{max-height:92vh;border-radius:var(--modal-border-radius) var(--modal-border-radius) 0 0;display:flex;box-shadow:var(--modal-box-shadow)}",
     map: undefined,
     media: undefined
   });
@@ -4075,10 +4115,10 @@ var __vue_inject_styles__$r = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$r = "data-v-da6757e6";
+var __vue_scope_id__$r = "data-v-d837dcb8";
 /* module identifier */
 
-var __vue_module_identifier__$r = "data-v-da6757e6";
+var __vue_module_identifier__$r = "data-v-d837dcb8";
 /* functional template */
 
 var __vue_is_functional_template__$r = false;
@@ -4088,13 +4128,13 @@ var __vue_component__$r = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$r,
   staticRenderFns: __vue_staticRenderFns__$r
 }, __vue_inject_styles__$r, __vue_script__$r, __vue_scope_id__$r, __vue_is_functional_template__$r, __vue_module_identifier__$r, false, undefined, createInjectorSSR, undefined);var script$q = {
-  name: "VcInputPopover",
+  name: "VcInputBottomSheet",
   components: {
+    VcBottomSheet: __vue_component__$r,
     VcModalHeader: __vue_component__$M,
     VcLayout: __vue_component__$O,
     VcModalFooter: __vue_component__$N,
-    VcForm: __vue_component__$K,
-    VcPopover: __vue_component__$r
+    VcForm: __vue_component__$K
   },
   props: {
     value: {
@@ -4110,25 +4150,29 @@ var __vue_component__$r = /*#__PURE__*/normalizeComponent({
     cancelButtonLabel: {
       type: String
     },
+    closeButton: {
+      type: Boolean,
+      default: true
+    },
     footer: {
       type: Boolean,
       default: true
     },
-    top: {
-      type: Number
-    },
-    right: {
-      type: Number
-    },
-    bottom: {
-      type: Number
+    showHeaderDivider: {
+      type: Boolean,
+      default: true
+    },
+    showFooterDivider: {
+      type: Boolean,
+      default: true
     },
-    left: {
-      type: Number
+    persistent: {
+      type: Boolean,
+      default: false
     },
     dataQa: {
       type: String,
-      default: 'vc-input-popover'
+      default: 'vc-bottom-sheet-input'
     }
   },
   data: function data() {
@@ -4164,15 +4208,11 @@ var __vue_render__$q = function __vue_render__() {
 
   var _c = _vm._self._c || _h;
 
-  return _c('VcPopover', {
+  return _c('VcBottomSheet', {
     attrs: {
-      "close-on-click": _vm.validForm,
       "value": _vm.value,
-      "top": _vm.top,
-      "right": _vm.right,
-      "bottom": _vm.bottom,
-      "left": _vm.left,
-      "data-qa": _vm.dataQa + "-bottom-sheet"
+      "data-qa": _vm.dataQa,
+      "persistent": _vm.persistent
     },
     on: {
       "input": function input(val) {
@@ -4191,20 +4231,29 @@ var __vue_render__$q = function __vue_render__() {
       }
     }], null, true)
   }, [_vm._v(" "), [_c('VcLayout', {
+    staticClass: "VcInputBottomSheet",
     attrs: {
-      "data-qa": _vm.dataQa + "-layout",
       "column": ""
     }
   }, [!!_vm.title ? _c('VcModalHeader', {
-    staticClass: "vc-popover-header",
+    staticClass: "vc-bottom-sheet__header",
+    class: {
+      'showDivider': _vm.showHeaderDivider
+    },
     attrs: {
+      "close-button": _vm.closeButton,
       "data-qa": _vm.dataQa + "-header",
       "show-back-button": false,
       "title": _vm.title,
       "flavor": "input"
+    },
+    on: {
+      "onCloseButtonClicked": function onCloseButtonClicked($event) {
+        return _vm.$emit('input', false);
+      }
     }
   }) : _vm._e(), _vm._v(" "), _c('VcLayout', {
-    staticClass: "vc-popover-content",
+    staticClass: "vc-bottom-sheet__content",
     attrs: {
       "column": ""
     }
@@ -4222,17 +4271,21 @@ var __vue_render__$q = function __vue_render__() {
       }
     }
   }, [_vm._t("default")], 2)], 1), _vm._v(" "), _vm.footer ? _c('VcModalFooter', {
-    staticClass: "vc-popover-footer",
+    staticClass: "vc-bottom-sheet__footer",
+    class: {
+      'showDivider': _vm.showHeaderDivider
+    },
     attrs: {
       "buttons": [{
         label: _vm.cancelButtonLabel || _vm.$dst("ds.modal.cancel"),
         event: "onCancelClicked",
         color: "white"
       }, {
-        label: _vm.okButtonLabel || _vm.$dst("ds.modal.done"),
+        label: _vm.okButtonLabel || _vm.$dst("ds.modal.ok"),
         event: "onOkClicked",
         color: "secondary"
-      }]
+      }],
+      "data-qa": _vm.dataQa + "-footer"
     },
     on: {
       "onCancelClicked": function onCancelClicked($event) {
@@ -4248,8 +4301,8 @@ var __vue_staticRenderFns__$q = [];
 
 var __vue_inject_styles__$q = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-4df3327c_0", {
-    source: "[data-v-4df3327c]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-popover[data-v-4df3327c]{width:var(--popover-width);max-height:var(--popover-max-height);display:flex;box-shadow:var(--modal-box-shadow)}.vc-popover .vc-popover-content[data-v-4df3327c]{padding:var(--size-value4) var(--size-value6);overflow-y:auto}.vc-popover .vc-popover-footer[data-v-4df3327c]{padding:var(--size-value3) var(--size-value6)}",
+  inject("data-v-44a33895_0", {
+    source: "[data-v-44a33895]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcInputBottomSheet .vc-bottom-sheet__header.showDivider[data-v-44a33895]{border-bottom:1px solid var(--gray-lighten-1)}.VcInputBottomSheet .vc-bottom-sheet__footer[data-v-44a33895]{padding:var(--size-value3) var(--size-value4)}.VcInputBottomSheet .vc-bottom-sheet__footer.showDivider[data-v-44a33895]{border-top:1px solid var(--gray-lighten-1);display:flex}.VcInputBottomSheet .vc-bottom-sheet__content[data-v-44a33895]{padding:var(--size-value6) var(--size-value4);overflow-y:auto}",
     map: undefined,
     media: undefined
   });
@@ -4257,10 +4310,10 @@ var __vue_inject_styles__$q = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$q = "data-v-4df3327c";
+var __vue_scope_id__$q = "data-v-44a33895";
 /* module identifier */
 
-var __vue_module_identifier__$q = "data-v-4df3327c";
+var __vue_module_identifier__$q = "data-v-44a33895";
 /* functional template */
 
 var __vue_is_functional_template__$q = false;
@@ -4269,39 +4322,55 @@ var __vue_is_functional_template__$q = false;
 var __vue_component__$q = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$q,
   staticRenderFns: __vue_staticRenderFns__$q
-}, __vue_inject_styles__$q, __vue_script__$q, __vue_scope_id__$q, __vue_is_functional_template__$q, __vue_module_identifier__$q, false, undefined, createInjectorSSR, undefined);var script$p = {
-  name: "VcChip",
+}, __vue_inject_styles__$q, __vue_script__$q, __vue_scope_id__$q, __vue_is_functional_template__$q, __vue_module_identifier__$q, false, undefined, createInjectorSSR, undefined);//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+var script$p = {
   components: {
-    VcIcon: __vue_component__$R,
-    VcAvatar: __vue_component__$D,
-    VChip: lib.VChip
+    VMenu: lib.VMenu
   },
+
+  name: "VcPopover",
+
   props: {
-    label: {
-      type: String,
-      required: true
-    },
-    avatar: {
-      type: Object,
-      validator: function validator(avatar) {
-        return avatar.imagePath || avatar.colorId;
-      }
+    value: {
+      type: Boolean,
+      default: false
     },
-    closeButton: {
+    closeOnClick: {
       type: Boolean,
       default: true
     },
-    disabled: {
-      type: Boolean,
-      default: false
+    top: {
+      type: Number
     },
-    invalid: {
-      type: Boolean,
-      default: false
+    right: {
+      type: Number
+    },
+    bottom: {
+      type: Number
+    },
+    left: {
+      type: Number
     },
     dataQa: {
       type: String,
-      default: 'vc-chip'
+      default: 'vc-popover'
     }
   }
 };/* script */
@@ -4315,37 +4384,35 @@ var __vue_render__$p = function __vue_render__() {
 
   var _c = _vm._self._c || _h;
 
-  return _c('v-chip', {
-    staticClass: "VcChip",
-    class: {
-      'vc-invalid': _vm.invalid,
-      'vc-avatar': !!_vm.avatar
-    },
+  return _c('v-menu', {
     attrs: {
-      "close": _vm.closeButton,
-      "ripple": "",
-      "close-icon": "$close",
-      "disabled": _vm.disabled,
-      "data-qa": _vm.dataQa
+      "close-on-click": _vm.closeOnClick,
+      "close-on-content-click": false,
+      "data-qa": _vm.dataQa,
+      "value": _vm.value,
+      "content-class": "vc-popover",
+      "nudge-top": _vm.top,
+      "nudge-right": _vm.right,
+      "nudge-bottom": _vm.bottom,
+      "nudge-left": _vm.left
     },
     on: {
-      "click:close": function clickClose($event) {
-        return _vm.$emit('input', false);
+      "input": function input(val) {
+        return _vm.$emit('input', val);
       }
-    }
-  }, [!!_vm.avatar ? _c('div', {
-    staticClass: "vc-avatar-wrapper"
-  }, [!_vm.invalid ? _c('VcAvatar', _vm._b({
-    attrs: {
-      "name": _vm.label,
-      "show-border": false,
-      "size": "x-sm"
-    }
-  }, 'VcAvatar', _vm.avatar, false)) : _c('VcIcon', {
-    attrs: {
-      "data-qa": _vm.dataQa + "-invalid-icon"
-    }
-  }, [_vm._v("$attention_fill")])], 1) : _vm._e(), _vm._v("\n  " + _vm._s(_vm.label) + "\n")]);
+    },
+    scopedSlots: _vm._u([{
+      key: "activator",
+      fn: function fn(ref) {
+        var attrs = ref.attrs;
+        var on = ref.on;
+        return [_vm._t("activator", null, null, {
+          attrs: attrs,
+          on: on
+        })];
+      }
+    }], null, true)
+  }, [_vm._v(" "), _vm._t("default")], 2);
 };
 
 var __vue_staticRenderFns__$p = [];
@@ -4353,8 +4420,8 @@ var __vue_staticRenderFns__$p = [];
 
 var __vue_inject_styles__$p = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-d8233608_0", {
-    source: "[data-v-d8233608]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcChip[data-v-d8233608]{max-width:fit-content;border:1px solid var(--neutral-lighten-1)}.VcChip.v-chip[data-v-d8233608]{background-color:var(--modal-bg-color)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content{font-weight:var(--font-weight-medium2);font-size:var(--font-size-x-small);line-height:var(--size-value5);color:var(--gray-darken-5)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .vc-avatar-wrapper{margin-inline-end:var(--size-value2)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .vc-avatar-wrapper .vc-attention-fill{fill:var(--yellow)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .v-chip__close{direction:inherit;margin-inline:var(--size-value1) var(--size-value0);color:var(--gray)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .v-chip__close:hover{opacity:unset}.VcChip.v-chip.vc-avatar[data-v-d8233608]{padding-inline:var(--size-value1) var(--size-value3)}.VcChip.v-chip--disabled[data-v-d8233608]{background-color:var(--gray-lighten-2);border:1px solid var(--gray-lighten-2)}.VcChip.v-chip--disabled[data-v-d8233608]  .v-chip__content{color:var(--gray-darken-1)}.VcChip.vc-invalid[data-v-d8233608]{background-color:var(--yellow-lighten-3);border:1px solid var(--yellow)}.VcChip.vc-invalid[data-v-d8233608]:hover{background-color:var(--yellow-lighten-2)}.VcChip[data-v-d8233608]:hover{background-color:var(--gray-lighten-3)}.VcChip[data-v-d8233608]:hover:before{opacity:0}.VcChip[data-v-d8233608]:focus{box-shadow:0 0 0 3px var(--v-secondary-lighten1)}.VcChip[data-v-d8233608]:focus:before{opacity:0}",
+  inject("data-v-da6757e6_0", {
+    source: "[data-v-da6757e6]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-popover[data-v-da6757e6]{background-color:var(--modal-bg-color);width:var(--popover-width);max-height:var(--popover-max-height);display:flex;box-shadow:var(--modal-box-shadow);border-radius:var(--popover-border-radius)}",
     map: undefined,
     media: undefined
   });
@@ -4362,10 +4429,10 @@ var __vue_inject_styles__$p = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$p = "data-v-d8233608";
+var __vue_scope_id__$p = "data-v-da6757e6";
 /* module identifier */
 
-var __vue_module_identifier__$p = "data-v-d8233608";
+var __vue_module_identifier__$p = "data-v-da6757e6";
 /* functional template */
 
 var __vue_is_functional_template__$p = false;
@@ -4375,92 +4442,69 @@ var __vue_component__$p = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$p,
   staticRenderFns: __vue_staticRenderFns__$p
 }, __vue_inject_styles__$p, __vue_script__$p, __vue_scope_id__$p, __vue_is_functional_template__$p, __vue_module_identifier__$p, false, undefined, createInjectorSSR, undefined);var script$o = {
-  name: 'VcTextField',
+  name: "VcInputPopover",
   components: {
-    VcIconWithTooltip: __vue_component__$E,
-    VTextField: lib.VTextField
+    VcModalHeader: __vue_component__$M,
+    VcLayout: __vue_component__$O,
+    VcModalFooter: __vue_component__$N,
+    VcForm: __vue_component__$K,
+    VcPopover: __vue_component__$p
   },
   props: {
-    type: {
-      type: String,
-      default: 'text',
-      validator: function validator(prop) {
-        return ['text', 'number', 'search'].includes(prop);
-      }
-    },
-    dataQa: {
-      type: String,
-      default: 'vc-text-field'
-    },
-    label: {
-      type: String,
-      default: ''
-    },
     value: {
-      type: [Number, String],
-      default: ''
-    },
-    counter: {
-      type: [Number, Boolean],
-      default: false
-    },
-    maxlength: {
-      type: Number,
-      default: 100,
-      validator: function validator(prop) {
-        return prop > 0;
-      }
-    },
-    rules: {
-      type: Array
-    },
-    disabled: {
       type: Boolean,
       default: false
     },
-    hint: {
-      type: String,
-      default: ''
+    title: {
+      Type: String
     },
-    placeholder: {
-      type: String,
-      default: ''
+    okButtonLabel: {
+      type: String
     },
-    tooltipHeader: {
-      type: String,
-      default: ''
+    cancelButtonLabel: {
+      type: String
     },
-    tooltipContent: {
-      type: String,
-      default: ''
+    footer: {
+      type: Boolean,
+      default: true
     },
-    tooltipNudgeLeft: {
-      type: Number,
-      default: 0
+    top: {
+      type: Number
     },
-    tooltipNudgeRight: {
-      type: Number,
-      default: 0
+    right: {
+      type: Number
     },
-    prefix: {
-      type: String,
-      default: ''
+    bottom: {
+      type: Number
     },
-    errorMessages: {
-      type: String,
-      default: ''
+    left: {
+      type: Number
     },
-    hideDetails: {
-      type: [Boolean, String],
-      default: 'auto'
+    dataQa: {
+      type: String,
+      default: 'vc-input-popover'
+    }
+  },
+  data: function data() {
+    return {
+      validForm: true
+    };
+  },
+  methods: {
+    onOkClicked: function onOkClicked() {
+      this.validate();
+      this.$emit('onOkClicked', {
+        valid: this.validForm
+      });
     },
-    persistentHint: {
-      type: Boolean,
-      default: true
+    validate: function validate() {
+      this.$refs.mainForm.validate();
     },
-    singleLine: {
-      type: Boolean,
-      default: false
+    onMainFormValueChanged: function onMainFormValueChanged(value) {
+      this.validForm = value;
+      this.$emit('onValidationChanged', {
+        valid: this.validForm
+      });
     }
   }
 };/* script */
@@ -4474,55 +4518,83 @@ var __vue_render__$o = function __vue_render__() {
 
   var _c = _vm._self._c || _h;
 
-  return _c('v-text-field', {
-    staticClass: "VcTextInput",
+  return _c('VcPopover', {
     attrs: {
-      "dense": "",
-      "data-qa": _vm.dataQa,
-      "label": _vm.label,
-      "placeholder": _vm.placeholder,
-      "rules": _vm.rules,
-      "disabled": _vm.disabled,
-      "type": _vm.type,
-      "error": _vm.counter && !!_vm.maxlength && _vm.value.length > _vm.maxlength,
-      "error-messages": _vm.errorMessages,
+      "close-on-click": _vm.validForm,
       "value": _vm.value,
-      "hint": _vm.hint,
-      "counter": _vm.counter,
-      "maxlength": _vm.maxlength,
-      "prefix": _vm.prefix,
-      "persistent-hint": _vm.persistentHint,
-      "single-line": _vm.singleLine,
-      "hide-details": _vm.hideDetails
+      "top": _vm.top,
+      "right": _vm.right,
+      "bottom": _vm.bottom,
+      "left": _vm.left,
+      "data-qa": _vm.dataQa + "-bottom-sheet"
     },
     on: {
-      "input": function input(data) {
-        return _vm.$emit('input', data);
+      "input": function input(val) {
+        return _vm.$emit('input', val);
       }
     },
     scopedSlots: _vm._u([{
-      key: "prepend-inner",
-      fn: function fn() {
-        return [_vm._t("prepend-inner")];
-      },
-      proxy: true
-    }, {
-      key: "append",
-      fn: function fn() {
-        return [_vm.tooltipContent ? _c('VcIconWithTooltip', {
-          attrs: {
-            "header": _vm.tooltipHeader,
-            "content": _vm.tooltipContent,
-            "nudge-left": _vm.tooltipNudgeLeft,
-            "nudge-right": _vm.tooltipNudgeRight,
-            "size": 15,
-            "icon": 'question'
-          }
-        }) : _vm._e()];
-      },
-      proxy: true
+      key: "activator",
+      fn: function fn(ref) {
+        var attrs = ref.attrs;
+        var on = ref.on;
+        return [_vm._t("activator", null, null, {
+          attrs: attrs,
+          on: on
+        })];
+      }
     }], null, true)
-  });
+  }, [_vm._v(" "), [_c('VcLayout', {
+    attrs: {
+      "data-qa": _vm.dataQa + "-layout",
+      "column": ""
+    }
+  }, [!!_vm.title ? _c('VcModalHeader', {
+    staticClass: "vc-popover-header",
+    attrs: {
+      "data-qa": _vm.dataQa + "-header",
+      "show-back-button": false,
+      "title": _vm.title,
+      "flavor": "input"
+    }
+  }) : _vm._e(), _vm._v(" "), _c('VcLayout', {
+    staticClass: "vc-popover-content",
+    attrs: {
+      "column": ""
+    }
+  }, [_c('VcForm', {
+    ref: "mainForm",
+    staticClass: "VcContent",
+    attrs: {
+      "value": _vm.validForm,
+      "lazy-validation": ""
+    },
+    on: {
+      "input": _vm.onMainFormValueChanged,
+      "submit": function submit(data) {
+        return _vm.$emit('submit', data);
+      }
+    }
+  }, [_vm._t("default")], 2)], 1), _vm._v(" "), _vm.footer ? _c('VcModalFooter', {
+    staticClass: "vc-popover-footer",
+    attrs: {
+      "buttons": [{
+        label: _vm.cancelButtonLabel || _vm.$dst("ds.modal.cancel"),
+        event: "onCancelClicked",
+        color: "white"
+      }, {
+        label: _vm.okButtonLabel || _vm.$dst("ds.modal.done"),
+        event: "onOkClicked",
+        color: "secondary"
+      }]
+    },
+    on: {
+      "onCancelClicked": function onCancelClicked($event) {
+        return _vm.$emit('onCancelClicked');
+      },
+      "onOkClicked": _vm.onOkClicked
+    }
+  }) : _vm._e()], 1)]], 2);
 };
 
 var __vue_staticRenderFns__$o = [];
@@ -4530,8 +4602,8 @@ var __vue_staticRenderFns__$o = [];
 
 var __vue_inject_styles__$o = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-2401387d_0", {
-    source: ".VcTextInput.v-text-field[data-v-2401387d]{font-family:var(--primary-font-family)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot{padding:0 var(--size-value3);height:var(--size-value13);background:#fff;border:1px solid var(--gray-lighten-1);box-sizing:border-box;border-radius:6px}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot label{font-size:var(--font-size-small2);line-height:var(--size-value5);color:var(--gray-darken-3);font-weight:var(--font-weight-medium)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot input{font-weight:var(--font-weight-medium2);font-size:var(--font-size-small2);line-height:var(--size-value5);color:var(--gray-darken-5);caret-color:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot input::placeholder{font-weight:var(--font-weight-medium)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:after,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:before{display:none}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:hover{border-color:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:active,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus-within{border:1px solid var(--v-secondary-base);box-shadow:0 0 0 3px var(--v-secondary-lighten1)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:active input,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus input,.VcTextInput.v-text-field[data-v-2401387d] .v-input__slot:focus-within input{color:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d].error--text .v-input__slot{border-color:var(--red);color:unset;box-shadow:unset;font-size:var(--font-size-xx-small);line-height:var(--size-value4)}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-focused label,.VcTextInput.v-text-field[data-v-2401387d].v-input--is-label-active label{font-size:var(--font-size-small);line-height:1.17;letter-spacing:-.3px;color:var(--gray-darken-4)!important;transform:translateY(-100%) scale(.85);top:var(--size-value2)}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-focused .v-text-field__slot,.VcTextInput.v-text-field[data-v-2401387d].v-input--is-label-active .v-text-field__slot{margin-bottom:-14px}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-disabled .v-input__slot{background:var(--gray-lighten-3);border:1px solid var(--gray-lighten-1)}.VcTextInput.v-text-field[data-v-2401387d].v-input--is-disabled .v-input__slot input,.VcTextInput.v-text-field[data-v-2401387d].v-input--is-disabled .v-input__slot label{color:var(--gray-darken-2)}.VcTextInput.v-text-field[data-v-2401387d]:not(.v-input--is-label-active):not(.v-input--is-focused) input{padding:var(--size-value2) 0}.VcTextInput.v-text-field[data-v-2401387d] .v-messages__message{line-height:var(--size-value4)}.VcTextInput.v-text-field[data-v-2401387d] .v-input__append-inner{align-self:center;fill:var(--gray-darken-3)}.VcTextInput.v-text-field[data-v-2401387d].v-input--dense:not(.v-text-field--outlined) input{padding-block:var(--size-value2)}",
+  inject("data-v-4df3327c_0", {
+    source: "[data-v-4df3327c]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-popover[data-v-4df3327c]{width:var(--popover-width);max-height:var(--popover-max-height);display:flex;box-shadow:var(--modal-box-shadow)}.vc-popover .vc-popover-content[data-v-4df3327c]{padding:var(--size-value4) var(--size-value6);overflow-y:auto}.vc-popover .vc-popover-footer[data-v-4df3327c]{padding:var(--size-value3) var(--size-value6)}",
     map: undefined,
     media: undefined
   });
@@ -4539,10 +4611,10 @@ var __vue_inject_styles__$o = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$o = "data-v-2401387d";
+var __vue_scope_id__$o = "data-v-4df3327c";
 /* module identifier */
 
-var __vue_module_identifier__$o = "data-v-2401387d";
+var __vue_module_identifier__$o = "data-v-4df3327c";
 /* functional template */
 
 var __vue_is_functional_template__$o = false;
@@ -4551,67 +4623,40 @@ var __vue_is_functional_template__$o = false;
 var __vue_component__$o = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$o,
   staticRenderFns: __vue_staticRenderFns__$o
-}, __vue_inject_styles__$o, __vue_script__$o, __vue_scope_id__$o, __vue_is_functional_template__$o, __vue_module_identifier__$o, false, undefined, createInjectorSSR, undefined);var throttle = require("lodash.throttle");
-
-var script$n = {
-  name: "VcSearchBar",
+}, __vue_inject_styles__$o, __vue_script__$o, __vue_scope_id__$o, __vue_is_functional_template__$o, __vue_module_identifier__$o, false, undefined, createInjectorSSR, undefined);var script$n = {
+  name: "VcChip",
   components: {
-    VcTextField: __vue_component__$o,
-    VcIcon: __vue_component__$R
+    VcIcon: __vue_component__$R,
+    VcAvatar: __vue_component__$D,
+    VChip: lib.VChip
   },
   props: {
-    size: {
+    label: {
       type: String,
-      default: 'large',
-      validator: function validator(size) {
-        return ['medium', 'large'].includes(size);
-      }
+      required: true
     },
-    label: {
-      type: String
+    avatar: {
+      type: Object,
+      validator: function validator(avatar) {
+        return avatar.imagePath || avatar.colorId;
+      }
     },
-    placeholder: {
-      type: String
+    closeButton: {
+      type: Boolean,
+      default: true
     },
-    caseSensitive: {
+    disabled: {
       type: Boolean,
       default: false
     },
-    throttleTime: {
-      type: Number,
-      default: 500,
-      validator: function validator(throttleTime) {
-        return throttleTime > 0;
-      }
-    },
-    borderTopRadius: {
+    invalid: {
       type: Boolean,
       default: false
     },
     dataQa: {
       type: String,
-      default: 'vc-search-bar'
-    }
-  },
-  computed: {
-    getLabel: function getLabel() {
-      return this.label || this.$dst('ds.search_bar.label');
-    },
-    getPlaceholder: function getPlaceholder() {
-      return this.placeholder || this.$dst('ds.search_bar.label');
-    },
-    getClasses: function getClasses() {
-      return "".concat(this.size).concat(this.borderTopRadius ? ' border-top-radius' : '');
+      default: 'vc-chip'
     }
-  },
-  data: function data() {
-    var _this = this;
-
-    return {
-      searchThrottled: throttle(function (search) {
-        _this.$emit('search', _this.caseSensitive ? search : search.toLowerCase());
-      }, this.throttleTime)
-    };
   }
 };/* script */
 var __vue_script__$n = script$n;
@@ -4624,33 +4669,37 @@ var __vue_render__$n = function __vue_render__() {
 
   var _c = _vm._self._c || _h;
 
-  return _c('VcTextField', {
-    class: "vc-search-bar " + _vm.getClasses,
+  return _c('v-chip', {
+    staticClass: "VcChip",
+    class: {
+      'vc-invalid': _vm.invalid,
+      'vc-avatar': !!_vm.avatar
+    },
     attrs: {
-      "data-qa": _vm.dataQa,
-      "label": _vm.getLabel,
-      "persistent-hint": false,
-      "placeholder": _vm.getPlaceholder,
-      "hide-details": "",
-      "single-line": "",
-      "type": "search"
+      "close": _vm.closeButton,
+      "ripple": "",
+      "close-icon": "$close",
+      "disabled": _vm.disabled,
+      "data-qa": _vm.dataQa
     },
     on: {
-      "input": _vm.searchThrottled
-    },
-    scopedSlots: _vm._u([{
-      key: "prepend-inner",
-      fn: function fn() {
-        return [_c('VcIcon', {
-          staticClass: "vc-search-bar__magnify",
-          attrs: {
-            "small": ""
-          }
-        }, [_vm._v("$magnify_glass")])];
-      },
-      proxy: true
-    }])
-  });
+      "click:close": function clickClose($event) {
+        return _vm.$emit('input', false);
+      }
+    }
+  }, [!!_vm.avatar ? _c('div', {
+    staticClass: "vc-avatar-wrapper"
+  }, [!_vm.invalid ? _c('VcAvatar', _vm._b({
+    attrs: {
+      "name": _vm.label,
+      "show-border": false,
+      "size": "x-sm"
+    }
+  }, 'VcAvatar', _vm.avatar, false)) : _c('VcIcon', {
+    attrs: {
+      "data-qa": _vm.dataQa + "-invalid-icon"
+    }
+  }, [_vm._v("$attention_fill")])], 1) : _vm._e(), _vm._v("\n  " + _vm._s(_vm.label) + "\n")]);
 };
 
 var __vue_staticRenderFns__$n = [];
@@ -4658,8 +4707,8 @@ var __vue_staticRenderFns__$n = [];
 
 var __vue_inject_styles__$n = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-be0d3f88_0", {
-    source: ".vc-search-bar[data-v-be0d3f88]{padding:var(--size-value0);margin:var(--size-value0)}.vc-search-bar.border-top-radius[data-v-be0d3f88]  .v-input__slot{border-radius:var(--border-radius) var(--border-radius) var(--size-value0) var(--size-value0)}.vc-search-bar.v-input--has-state[data-v-be0d3f88]  .v-input__slot .v-text-field__slot,.vc-search-bar.v-input--is-focused[data-v-be0d3f88]  .v-input__slot .v-text-field__slot,.vc-search-bar.v-input--is-label-active[data-v-be0d3f88]  .v-input__slot .v-text-field__slot{margin:0}.vc-search-bar__magnify[data-v-be0d3f88]{fill:var(--gray-darken-2)}.vc-search-bar[data-v-be0d3f88]:hover{border-color:var(--gray-darken-2)}.vc-search-bar[data-v-be0d3f88]:hover  .v-input__slot label{color:var(--gray-darken-2)}.vc-search-bar.medium[data-v-be0d3f88]  .v-input__control .v-input__slot{height:var(--size-value10)}.vc-search-bar.medium[data-v-be0d3f88]  .v-input__control .v-input__slot .v-input__prepend-inner{padding:var(--size-value3)}.vc-search-bar[data-v-be0d3f88]  .v-input__control .v-input__slot{padding:var(--size-value0)}.vc-search-bar[data-v-be0d3f88]  .v-input__control .v-input__slot .v-input__prepend-inner{padding:18px var(--size-value3);margin:var(--size-value0)}",
+  inject("data-v-d8233608_0", {
+    source: "[data-v-d8233608]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.VcChip[data-v-d8233608]{max-width:fit-content;border:1px solid var(--neutral-lighten-1)}.VcChip.v-chip[data-v-d8233608]{background-color:var(--modal-bg-color)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content{font-weight:var(--font-weight-medium2);font-size:var(--font-size-x-small);line-height:var(--size-value5);color:var(--gray-darken-5)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .vc-avatar-wrapper{margin-inline-end:var(--size-value2)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .vc-avatar-wrapper .vc-attention-fill{fill:var(--yellow)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .v-chip__close{direction:inherit;margin-inline:var(--size-value1) var(--size-value0);color:var(--gray)}.VcChip.v-chip[data-v-d8233608]  .v-chip__content .v-chip__close:hover{opacity:unset}.VcChip.v-chip.vc-avatar[data-v-d8233608]{padding-inline:var(--size-value1) var(--size-value3)}.VcChip.v-chip--disabled[data-v-d8233608]{background-color:var(--gray-lighten-2);border:1px solid var(--gray-lighten-2)}.VcChip.v-chip--disabled[data-v-d8233608]  .v-chip__content{color:var(--gray-darken-1)}.VcChip.vc-invalid[data-v-d8233608]{background-color:var(--yellow-lighten-3);border:1px solid var(--yellow)}.VcChip.vc-invalid[data-v-d8233608]:hover{background-color:var(--yellow-lighten-2)}.VcChip[data-v-d8233608]:hover{background-color:var(--gray-lighten-3)}.VcChip[data-v-d8233608]:hover:before{opacity:0}.VcChip[data-v-d8233608]:focus{box-shadow:0 0 0 3px var(--v-secondary-lighten1)}.VcChip[data-v-d8233608]:focus:before{opacity:0}",
     map: undefined,
     media: undefined
   });
@@ -4667,10 +4716,10 @@ var __vue_inject_styles__$n = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$n = "data-v-be0d3f88";
+var __vue_scope_id__$n = "data-v-d8233608";
 /* module identifier */
 
-var __vue_module_identifier__$n = "data-v-be0d3f88";
+var __vue_module_identifier__$n = "data-v-d8233608";
 /* functional template */
 
 var __vue_is_functional_template__$n = false;
@@ -7074,8 +7123,8 @@ var __vue_staticRenderFns__$3 = [];
 
 var __vue_inject_styles__$3 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-71d82f6c_0", {
-    source: "[data-v-71d82f6c]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-wizard[data-v-71d82f6c]{height:100%}@media screen and (min-width:960px){.vc-wizard[data-v-71d82f6c]{display:grid;grid-template-columns:minmax(250px,1fr) 3fr;grid-template-rows:minmax(562px,1fr) 80px;grid-row-gap:0}.vc-wizard.wizard-size-md[data-v-71d82f6c]{grid-column-gap:var(--size-value10)}.vc-wizard.wizard-size-lg[data-v-71d82f6c]{grid-column-gap:var(--size-value20)}}.vc-stepper-container[data-v-71d82f6c]{grid-area:1/1/3/2;border-inline-end:1px solid #e0e0e0;max-height:calc(100% - 24px)}.wizard-cta-container[data-v-71d82f6c]{grid-area:2/2/3/3}.stepper-content-wrapper[data-v-71d82f6c]{grid-area:1/2/2/3}",
+  inject("data-v-12623974_0", {
+    source: "[data-v-12623974]:root{--primary-font-family:Montserrat;--font-size-xxx-small:9px;--font-size-xx-small:12px;--font-size-x-small:13px;--font-size-small:14px;--font-size-small2:15px;--font-size-small3:17px;--font-size-medium:18px;--font-size-medium1:22px;--font-size-medium2:24px;--font-size-large:28px;--font-weight-light:300;--font-weight-medium:400;--font-weight-medium2:500;--font-weight-large:600;--font-weight-large2:700;--font-weight-xl:800;--letter-spacing:0.003em;--size-value0:0px;--size-value1:4px;--size-value2:8px;--size-value3:12px;--size-value4:16px;--size-value5:20px;--size-value6:24px;--size-value7:28px;--size-value8:32px;--size-value9:36px;--size-value10:40px;--size-value11:44px;--size-value12:48px;--size-value13:52px;--size-value14:56px;--size-value15:60px;--size-value16:64px;--size-value17:68px;--size-value18:72px;--size-value19:76px;--size-value20:80px;--border-radius:6px;--border-frame:1px solid #e0e0e0;--border-focused-frame:1px solid var(--v-secondary-base);--shadow-focused-frame:0px 0px 0px 3px var(--v-secondary-lighten1);--popover-width:360px;--popover-max-height:464px;--popover-border-radius:10px;--modal-desktop-offset:-112px;--modal-bg-color:#ffffff;--modal-box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--modal-border-radius:10px;--modal-width-small:384px;--modal-width-medium:576px;--modal-width-large:816px;--modal-width-x-large:972px;--avatar-x-sm:24px;--avatar-sm:32px;--avatar-md:40px;--avatar-lg:48px;--dropzone-active-border-color:#1e93b7;--dropzone-active-second-border-color:#95cddb;--gray-darken-5:#212121;--gray-darken-4:#616161;--gray-darken-3:#757575;--gray-darken-2:#999999;--gray-darken-1:#b3b3b3;--gray:#cccccc;--gray-lighten-1:#e0e0e0;--gray-lighten-2:#ededed;--gray-lighten-3:#f7f7f7;--gray-lighten-4:#fafafa;--neutral:#586E8C;--neutral-lighten-1:#D6DBE6;--neutral-lighten-2:#EAEDF2;--neutral-lighten-3:#F8F9FB;--red:#F2514A;--red-lighten-1:#F79792;--red-lighten-2:#FBCBC9;--red-lighten-3:#FDE8E7;--yellow:#FFC511;--yellow-lighten-1:#FFDC70;--yellow-lighten-2:#FFEDB8;--yellow-lighten-3:#FFF7E0;--green:#54D28C;--green-lighten-1:#98E4BA;--green-lighten-2:#CFF8E1;--green-lighten-3:#EAFCF2;--blue:#478FFF;--blue-lighten-1:#91BCFF;--blue-lighten-2:#C8DDFF;--blue-lighten-3:#E7F0FF;--orange:#FF8F00;--orange-lighten-1:#FCB965;--orange-lighten-2:#FAD9B0;--orange-lighten-3:#F9EBDA;--shadow-1:0px 1px 4px rgba(0, 0, 0, 0.11);--shadow-2:0px 2px 5px rgba(0, 0, 0, 0.1),0px 2px 2px rgba(0, 0, 0, 0.06),0px 3px 1px -2px rgba(0, 0, 0, 0.06);--shadow-3:0px 3px 2px rgba(0, 0, 0, 0.101961);--shadow-4:0px 1px 1px rgba(0, 0, 0, 0.06),0px 3px 8px rgba(0, 0, 0, 0.15);--shadow-5:0px 4px 18px rgba(0, 0, 0, 0.1);--shadow-6:0px 1px 10px rgba(0, 0, 0, 0.12),0px 4px 7px rgba(0, 0, 0, 0.14),0px 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-7:0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px rgba(0, 0, 0, 0.14),0px 1px 18px rgba(0, 0, 0, 0.12);--shadow-8:0px 5px 7px 3px rgba(0, 0, 0, 0.26);--shadow-9:0px 7px 8px -4px rgba(0, 0, 0, 0.2),2px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px rgba(0, 0, 0, 0.12);--shadow-10:0px 4px 8px #cccccc}.vc-wizard[data-v-12623974]{height:100%}@media screen and (min-width:960px){.vc-wizard[data-v-12623974]{display:grid;grid-template-columns:minmax(250px,1fr) 3fr;grid-template-rows:1fr 80px;grid-row-gap:0}.vc-wizard.wizard-size-md[data-v-12623974]{grid-column-gap:var(--size-value10)}.vc-wizard.wizard-size-lg[data-v-12623974]{grid-column-gap:var(--size-value20)}}.vc-stepper-container[data-v-12623974]{grid-area:1/1/3/2;border-inline-end:1px solid #e0e0e0;max-height:calc(100% - 24px)}.wizard-cta-container[data-v-12623974]{grid-area:2/2/3/3}.stepper-content-wrapper[data-v-12623974]{grid-area:1/2/2/3}",
     map: undefined,
     media: undefined
   });
@@ -7083,10 +7132,10 @@ var __vue_inject_styles__$3 = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$3 = "data-v-71d82f6c";
+var __vue_scope_id__$3 = "data-v-12623974";
 /* module identifier */
 
-var __vue_module_identifier__$3 = "data-v-71d82f6c";
+var __vue_module_identifier__$3 = "data-v-12623974";
 /* functional template */
 
 var __vue_is_functional_template__$3 = false;
@@ -7541,7 +7590,7 @@ var __vue_component__ = /*#__PURE__*/normalizeComponent({
   render: __vue_render__,
   staticRenderFns: __vue_staticRenderFns__
 }, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, createInjectorSSR, undefined);// Put here any components that need to be available to users of the package
-var components$1=/*#__PURE__*/Object.freeze({__proto__:null,VcConfirmModal:__vue_component__$L,VcInputModal:__vue_component__$J,VcNoticeModal:__vue_component__$H,VcModalFooter:__vue_component__$N,VcModalHeader:__vue_component__$M,VcAlert:__vue_component__$G,VcTooltip:__vue_component__$F,VcIconWithTooltip:__vue_component__$E,VcBottomActions:__vue_component__$C,VcActionList:__vue_component__$B,VcActions:__vue_component__$A,VcStepsBar:__vue_component__$z,VcMobileWizardProgress:__vue_component__$x,VcProgressCircular:__vue_component__$y,VcChecklistItem:__vue_component__$v,VcListbox:__vue_component__$u,VcBottomSheet:__vue_component__$t,VcInputBottomSheet:__vue_component__$s,VcPopover:__vue_component__$r,VcInputPopover:__vue_component__$q,VcChip:__vue_component__$p,VcSearchBar:__vue_component__$n,VcButton:__vue_component__$Q,VcButtonGroup:__vue_component__$m,VcForm:__vue_component__$K,VcIcon:__vue_component__$R,VcLayout:__vue_component__$O,VcLoader:__vue_component__$l,VcSwitch:__vue_component__$k,VcListEntity:__vue_component__$j,VcExpansionCard:__vue_component__$i,VcTextField:__vue_component__$o,VcAvatar:__vue_component__$D,VcTextArea:__vue_component__$h,VcSelectField:__vue_component__$g,VcToast:__vue_component__$f,VcCard:__vue_component__$e,VcCheckbox:__vue_component__$w,VcFilterPanel:__vue_component__$d,VcFocusArea:__vue_component__$c,VcLink:__vue_component__$b,VcListItem:__vue_component__$a,VcGroupHeader:__vue_component__$9,VcEmptyState:__vue_component__$7,VcSvg:__vue_component__$8,VcBanner:__vue_component__$6,VcWizardCtaContainer:__vue_component__$5,VcWizard:__vue_component__$3,VcImage:__vue_component__$I,VcBadge:__vue_component__$2,VcUpsellBlock:__vue_component__$1,VcModalContainer:__vue_component__$P,VcDropzone:__vue_component__});var install = function installdesignSystem(Vue) {
+var components$1=/*#__PURE__*/Object.freeze({__proto__:null,VcConfirmModal:__vue_component__$L,VcInputModal:__vue_component__$J,VcNoticeModal:__vue_component__$H,VcModalFooter:__vue_component__$N,VcModalHeader:__vue_component__$M,VcAlert:__vue_component__$G,VcTooltip:__vue_component__$F,VcIconWithTooltip:__vue_component__$E,VcBottomActions:__vue_component__$C,VcActionList:__vue_component__$B,VcActions:__vue_component__$A,VcStepsBar:__vue_component__$z,VcMobileWizardProgress:__vue_component__$x,VcProgressCircular:__vue_component__$y,VcChecklistItem:__vue_component__$v,VcListbox:__vue_component__$s,VcBottomSheet:__vue_component__$r,VcInputBottomSheet:__vue_component__$q,VcPopover:__vue_component__$p,VcInputPopover:__vue_component__$o,VcChip:__vue_component__$n,VcSearchBar:__vue_component__$t,VcButton:__vue_component__$Q,VcButtonGroup:__vue_component__$m,VcForm:__vue_component__$K,VcIcon:__vue_component__$R,VcLayout:__vue_component__$O,VcLoader:__vue_component__$l,VcSwitch:__vue_component__$k,VcListEntity:__vue_component__$j,VcExpansionCard:__vue_component__$i,VcTextField:__vue_component__$u,VcAvatar:__vue_component__$D,VcTextArea:__vue_component__$h,VcSelectField:__vue_component__$g,VcToast:__vue_component__$f,VcCard:__vue_component__$e,VcCheckbox:__vue_component__$w,VcFilterPanel:__vue_component__$d,VcFocusArea:__vue_component__$c,VcLink:__vue_component__$b,VcListItem:__vue_component__$a,VcGroupHeader:__vue_component__$9,VcEmptyState:__vue_component__$7,VcSvg:__vue_component__$8,VcBanner:__vue_component__$6,VcWizardCtaContainer:__vue_component__$5,VcWizard:__vue_component__$3,VcImage:__vue_component__$I,VcBadge:__vue_component__$2,VcUpsellBlock:__vue_component__$1,VcModalContainer:__vue_component__$P,VcDropzone:__vue_component__});var install = function installdesignSystem(Vue) {
   Object.entries(components$1).forEach(function (_ref) {
     var _ref2 = _slicedToArray(_ref, 2),
         componentName = _ref2[0],
@@ -7550,7 +7599,7 @@ var components$1=/*#__PURE__*/Object.freeze({__proto__:null,VcConfirmModal:__vue
     Vue.component(componentName, component);
   });
 }; // Create module definition for Vue.use()
-var components=/*#__PURE__*/Object.freeze({__proto__:null,'default':install,VcConfirmModal:__vue_component__$L,VcInputModal:__vue_component__$J,VcNoticeModal:__vue_component__$H,VcModalFooter:__vue_component__$N,VcModalHeader:__vue_component__$M,VcAlert:__vue_component__$G,VcTooltip:__vue_component__$F,VcIconWithTooltip:__vue_component__$E,VcBottomActions:__vue_component__$C,VcActionList:__vue_component__$B,VcActions:__vue_component__$A,VcStepsBar:__vue_component__$z,VcMobileWizardProgress:__vue_component__$x,VcProgressCircular:__vue_component__$y,VcChecklistItem:__vue_component__$v,VcListbox:__vue_component__$u,VcBottomSheet:__vue_component__$t,VcInputBottomSheet:__vue_component__$s,VcPopover:__vue_component__$r,VcInputPopover:__vue_component__$q,VcChip:__vue_component__$p,VcSearchBar:__vue_component__$n,VcButton:__vue_component__$Q,VcButtonGroup:__vue_component__$m,VcForm:__vue_component__$K,VcIcon:__vue_component__$R,VcLayout:__vue_component__$O,VcLoader:__vue_component__$l,VcSwitch:__vue_component__$k,VcListEntity:__vue_component__$j,VcExpansionCard:__vue_component__$i,VcTextField:__vue_component__$o,VcAvatar:__vue_component__$D,VcTextArea:__vue_component__$h,VcSelectField:__vue_component__$g,VcToast:__vue_component__$f,VcCard:__vue_component__$e,VcCheckbox:__vue_component__$w,VcFilterPanel:__vue_component__$d,VcFocusArea:__vue_component__$c,VcLink:__vue_component__$b,VcListItem:__vue_component__$a,VcGroupHeader:__vue_component__$9,VcEmptyState:__vue_component__$7,VcSvg:__vue_component__$8,VcBanner:__vue_component__$6,VcWizardCtaContainer:__vue_component__$5,VcWizard:__vue_component__$3,VcImage:__vue_component__$I,VcBadge:__vue_component__$2,VcUpsellBlock:__vue_component__$1,VcModalContainer:__vue_component__$P,VcDropzone:__vue_component__});// only expose one global var, with component exports exposed as properties of
+var components=/*#__PURE__*/Object.freeze({__proto__:null,'default':install,VcConfirmModal:__vue_component__$L,VcInputModal:__vue_component__$J,VcNoticeModal:__vue_component__$H,VcModalFooter:__vue_component__$N,VcModalHeader:__vue_component__$M,VcAlert:__vue_component__$G,VcTooltip:__vue_component__$F,VcIconWithTooltip:__vue_component__$E,VcBottomActions:__vue_component__$C,VcActionList:__vue_component__$B,VcActions:__vue_component__$A,VcStepsBar:__vue_component__$z,VcMobileWizardProgress:__vue_component__$x,VcProgressCircular:__vue_component__$y,VcChecklistItem:__vue_component__$v,VcListbox:__vue_component__$s,VcBottomSheet:__vue_component__$r,VcInputBottomSheet:__vue_component__$q,VcPopover:__vue_component__$p,VcInputPopover:__vue_component__$o,VcChip:__vue_component__$n,VcSearchBar:__vue_component__$t,VcButton:__vue_component__$Q,VcButtonGroup:__vue_component__$m,VcForm:__vue_component__$K,VcIcon:__vue_component__$R,VcLayout:__vue_component__$O,VcLoader:__vue_component__$l,VcSwitch:__vue_component__$k,VcListEntity:__vue_component__$j,VcExpansionCard:__vue_component__$i,VcTextField:__vue_component__$u,VcAvatar:__vue_component__$D,VcTextArea:__vue_component__$h,VcSelectField:__vue_component__$g,VcToast:__vue_component__$f,VcCard:__vue_component__$e,VcCheckbox:__vue_component__$w,VcFilterPanel:__vue_component__$d,VcFocusArea:__vue_component__$c,VcLink:__vue_component__$b,VcListItem:__vue_component__$a,VcGroupHeader:__vue_component__$9,VcEmptyState:__vue_component__$7,VcSvg:__vue_component__$8,VcBanner:__vue_component__$6,VcWizardCtaContainer:__vue_component__$5,VcWizard:__vue_component__$3,VcImage:__vue_component__$I,VcBadge:__vue_component__$2,VcUpsellBlock:__vue_component__$1,VcModalContainer:__vue_component__$P,VcDropzone:__vue_component__});// only expose one global var, with component exports exposed as properties of
 // that global var (eg. plugin.component)
 
 Object.entries(components).forEach(function (_ref) {