@onereach/ui-components 8.26.2-beta.4184.0 → 9.0.0

package/dist/esm/v2/{OrSelect-2808e01d.js → OrSelect-6dafd1bc.js}

@@ -1,15 +1,15 @@
 import { defineComponent, ref } from 'vue-demi';
 import { onClickOutside } from '@vueuse/core';
+import { _ as __vue_component__$d } from './OrFloating-448fdc12.js';
+import { _ as __vue_component__$b } from './OrLoader-3eea4889.js';
+import { _ as __vue_component__$9 } from './OrIcon-69c5cadc.js';
+import { s as styleInject } from './style-inject.es-4c6f2515.js';
+import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
+import { _ as __vue_component__$a } from './OrCheckbox-3337d903.js';
 import { i as isEmpty } from './isEmpty-a3a94129.js';
-import { _ as __vue_component__$a } from './OrIcon-69c5cadc.js';
 import keyBy from 'lodash/keyBy';
-import { _ as __vue_component__$9 } from './OrChip-289730fb.js';
+import { _ as __vue_component__$c } from './OrChip-289730fb.js';
 import './OrChips.vue_rollup-plugin-vue_styles.0-d899bf77.js';
-import { s as styleInject } from './style-inject.es-4c6f2515.js';
-import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
-import { _ as __vue_component__$c } from './OrLoader-3eea4889.js';
-import { _ as __vue_component__$b } from './OrCheckbox-3337d903.js';
-import { _ as __vue_component__$d } from './OrFloating-448fdc12.js';
 import { _ as __vue_component__$e } from './OrLabel-fcceec1b.js';
 import { _ as __vue_component__$f } from './OrError-efc74907.js';
 
@@ -63,215 +63,9 @@ const OR_SELECT_UPDATE_SEARCH_TEXT_PROP = {
 };
 
 var script$8 = defineComponent({
-  name: 'OrSelectInputValue',
-  components: {
-    OrChip: __vue_component__$9
-  },
-  props: {
-    value: OR_SELECT_VALUE_PROP,
-    options: OR_SELECT_SEARCH_OPTIONS_PROP,
-    isMultiSelect: Boolean,
-    isDisabled: Boolean
-  },
-  emits: ['delete-value'],
-  computed: {
-    optionsByKey() {
-      return keyBy(this.options, 'value');
-    },
-    states() {
-      return {
-        'simple-value': !this.isMultiSelect,
-        'multi-value': this.isMultiSelect
-      };
-    }
-  },
-  methods: {
-    getOptionLabel(optionId) {
-      var _a;
-      const option = this.optionsByKey[optionId];
-      return String(option ? (_a = option.label) !== null && _a !== void 0 ? _a : option.value : optionId);
-    },
-    /** Prevent content toggle event on chips, since they have their own control elements */
-    handleInputValueClick(event) {
-      const inputValueElement = this.$refs['input-value'];
-      const inputValueTextElement = this.$refs['input-value-text'];
-      const target = event.target;
-      if (target !== inputValueElement && target !== inputValueTextElement) {
-        event.stopPropagation();
-      }
-    }
-  }
-});
-
-var css_248z$8 = "@keyframes spinAround-data-v-100ef33e{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-100ef33e{from{opacity:1}to{opacity:0}}.or-select-input-value[data-v-100ef33e]{display:flex;flex:1 1 100%;overflow:hidden}.or-select-input-value.simple-value[data-v-100ef33e]{align-items:center}.or-select-input-value-text[data-v-100ef33e]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.or-select-input-value.multi-value[data-v-100ef33e]{flex-wrap:wrap;padding:.125rem 0}.or-select-input-value.multi-value .or-chip[data-v-100ef33e]{margin:.125rem}.or-select-input-value.multi-value .or-chip[data-v-100ef33e]:not(.disabled){cursor:default}";
-styleInject(css_248z$8);
-
-/* script */
-const __vue_script__$8 = script$8;
-/* template */
-var __vue_render__$8 = function () {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c('div', {
-    ref: "input-value",
-    staticClass: "or-select-input-value",
-    class: _vm.states,
-    on: {
-      "click": _vm.handleInputValueClick
-    }
-  }, [!_vm.isMultiSelect ? _c('div', {
-    ref: "input-value-text",
-    staticClass: "or-select-input-value-text"
-  }, [_vm._v("\n    " + _vm._s(_vm.getOptionLabel(_vm.value)) + "\n  ")]) : _vm._e(), _vm._v(" "), _vm.isMultiSelect ? _vm._l(_vm.value, function (valueItem) {
-    return _c('or-chip', {
-      key: valueItem,
-      attrs: {
-        "content": _vm.getOptionLabel(valueItem),
-        "is-disabled": _vm.isDisabled
-      },
-      on: {
-        "delete": function ($event) {
-          return _vm.$emit('delete-value', valueItem);
-        }
-      }
-    });
-  }) : _vm._e()], 2);
-};
-var __vue_staticRenderFns__$8 = [];
-
-/* style */
-const __vue_inject_styles__$8 = undefined;
-/* scoped */
-const __vue_scope_id__$8 = "data-v-100ef33e";
-/* module identifier */
-const __vue_module_identifier__$8 = undefined;
-/* functional template */
-const __vue_is_functional_template__$8 = false;
-/* style inject */
-
-/* style inject SSR */
-
-/* style inject shadow dom */
-
-const __vue_component__$8 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$8,
-  staticRenderFns: __vue_staticRenderFns__$8
-}, __vue_inject_styles__$8, __vue_script__$8, __vue_scope_id__$8, __vue_is_functional_template__$8, __vue_module_identifier__$8, false, undefined, undefined, undefined);
-
-var script$7 = defineComponent({
-  name: 'OrSelectInput',
-  components: {
-    OrIcon: __vue_component__$a,
-    OrSelectInputValue: __vue_component__$8
-  },
-  props: {
-    value: OR_SELECT_VALUE_PROP,
-    options: OR_SELECT_OPTIONS_PROP,
-    placeholder: OR_SELECT_PLACEHOLDER_PROP,
-    isOpen: Boolean,
-    isMultiSelect: Boolean,
-    isTop: Boolean,
-    isDisabled: Boolean,
-    isInvalid: Boolean
-  },
-  emits: ['toggle-content', 'delete-value'],
-  computed: {
-    icon() {
-      return this.isOpen ? 'arrow_drop_up' : 'arrow_drop_down';
-    },
-    states() {
-      return {
-        open: this.isOpen,
-        error: this.isInvalid,
-        disabled: this.isDisabled,
-        multiselect: this.isMultiSelect,
-        top: this.isTop
-      };
-    },
-    isEmptyValue() {
-      return typeof this.value === 'number' ? false : isEmpty(this.value);
-    }
-  },
-  methods: {
-    handleToggleContent() {
-      if (!this.isDisabled) {
-        this.$emit('toggle-content');
-      }
-    }
-  }
-});
-
-var css_248z$7 = "@keyframes spinAround-data-v-4d590135{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-4d590135{from{opacity:1}to{opacity:0}}.or-select-input[data-v-4d590135]{display:flex;padding:0 .5rem;cursor:pointer}.or-select-input.input-wrapper[data-v-4d590135]{min-height:2.25rem;background-color:var(--c-neutral-1);border:1px solid var(--c-neutral-2);border-radius:.25rem}.or-select-input.input-wrapper.error[data-v-4d590135]{border-color:var(--c-error)}.or-select-input.open[data-v-4d590135],.or-select-input[data-v-4d590135]:hover:not(.disabled){background-color:var(--c-white)}.or-select-input.open[data-v-4d590135]{border-color:var(--c-neutral-2)}.or-select-input.open[data-v-4d590135]:not(.top){border-bottom-right-radius:0;border-bottom-left-radius:0}.or-select-input.open.top[data-v-4d590135]{border-top-left-radius:0;border-top-right-radius:0}.or-select-input.disabled[data-v-4d590135]{cursor:not-allowed}.or-select-input.disabled[data-v-4d590135]:not(.multiselect){background-color:var(--c-neutral-1-darken-5)}.or-select-input-placeholder[data-v-4d590135]{display:flex;align-items:center;overflow:hidden;color:var(--c-neutral-4);user-select:none}.or-select-input-placeholder-text[data-v-4d590135]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.or-select-input-button[data-v-4d590135]{display:flex;align-items:center;height:2.125rem;margin-left:auto}.or-select-input-button[data-v-4d590135]  .or-icon{margin-left:.5rem}";
-styleInject(css_248z$7);
-
-/* script */
-const __vue_script__$7 = script$7;
-/* template */
-var __vue_render__$7 = function () {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c('div', {
-    staticClass: "or-select-input input-wrapper",
-    class: _vm.states,
-    on: {
-      "click": _vm.handleToggleContent
-    }
-  }, [_vm.isEmptyValue ? _c('div', {
-    staticClass: "or-select-input-placeholder"
-  }, [_c('span', {
-    staticClass: "or-select-input-placeholder-text"
-  }, [_vm._v("\n      " + _vm._s(_vm.placeholder) + "\n    ")])]) : _vm._e(), _vm._v(" "), !_vm.isEmptyValue ? _vm._t("input-value", function () {
-    return [_c('or-select-input-value', {
-      attrs: {
-        "value": _vm.value,
-        "options": _vm.options,
-        "is-multi-select": _vm.isMultiSelect,
-        "is-disabled": _vm.isDisabled
-      },
-      on: {
-        "delete-value": function ($event) {
-          return _vm.$emit('delete-value', $event);
-        }
-      }
-    })];
-  }, {
-    "value": _vm.value,
-    "options": _vm.options
-  }) : _vm._e(), _vm._v(" "), _c('div', {
-    staticClass: "or-select-input-button"
-  }, [_c('or-icon', {
-    attrs: {
-      "icon": _vm.icon
-    }
-  })], 1)], 2);
-};
-var __vue_staticRenderFns__$7 = [];
-
-/* style */
-const __vue_inject_styles__$7 = undefined;
-/* scoped */
-const __vue_scope_id__$7 = "data-v-4d590135";
-/* module identifier */
-const __vue_module_identifier__$7 = undefined;
-/* functional template */
-const __vue_is_functional_template__$7 = false;
-/* style inject */
-
-/* style inject SSR */
-
-/* style inject shadow dom */
-
-const __vue_component__$7 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$7,
-  staticRenderFns: __vue_staticRenderFns__$7
-}, __vue_inject_styles__$7, __vue_script__$7, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, false, undefined, undefined, undefined);
-
-var script$6 = defineComponent({
   name: 'OrSelectSearchOptions',
   components: {
-    OrIcon: __vue_component__$a
+    OrIcon: __vue_component__$9
   },
   props: {
     isTop: {
@@ -300,13 +94,13 @@ var script$6 = defineComponent({
   }
 });
 
-var css_248z$6 = "@keyframes spinAround-data-v-10cb2d28{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-10cb2d28{from{opacity:1}to{opacity:0}}.or-select-search-options[data-v-10cb2d28]{display:flex;flex:0 0 auto;align-items:center;height:2.1875rem;padding:0 .5rem}.or-select-search-options[data-v-10cb2d28]:not(.top){border-bottom:1px solid var(--c-neutral-2)}.or-select-search-options.top[data-v-10cb2d28]{border-top:1px solid var(--c-neutral-2)}.or-select-search-options-input[data-v-10cb2d28]{flex:1 1 100%;min-width:0;height:100%;background:0 0;border:none;outline:0}.or-select-search-options-button[data-v-10cb2d28]{display:flex;padding:.125rem;margin-left:.5rem;cursor:pointer}.or-select-search-options-button[data-v-10cb2d28]  .or-icon{font-size:1rem;color:var(--c-neutral-4)}";
-styleInject(css_248z$6);
+var css_248z$8 = "@keyframes spinAround-data-v-10cb2d28{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-10cb2d28{from{opacity:1}to{opacity:0}}.or-select-search-options[data-v-10cb2d28]{display:flex;flex:0 0 auto;align-items:center;height:2.1875rem;padding:0 .5rem}.or-select-search-options[data-v-10cb2d28]:not(.top){border-bottom:1px solid var(--c-neutral-2)}.or-select-search-options.top[data-v-10cb2d28]{border-top:1px solid var(--c-neutral-2)}.or-select-search-options-input[data-v-10cb2d28]{flex:1 1 100%;min-width:0;height:100%;background:0 0;border:none;outline:0}.or-select-search-options-button[data-v-10cb2d28]{display:flex;padding:.125rem;margin-left:.5rem;cursor:pointer}.or-select-search-options-button[data-v-10cb2d28]  .or-icon{font-size:1rem;color:var(--c-neutral-4)}";
+styleInject(css_248z$8);
 
 /* script */
-const __vue_script__$6 = script$6;
+const __vue_script__$8 = script$8;
 /* template */
-var __vue_render__$6 = function () {
+var __vue_render__$8 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -341,29 +135,29 @@ var __vue_render__$6 = function () {
     }
   })], 1)]);
 };
-var __vue_staticRenderFns__$6 = [];
+var __vue_staticRenderFns__$8 = [];
 
 /* style */
-const __vue_inject_styles__$6 = undefined;
+const __vue_inject_styles__$8 = undefined;
 /* scoped */
-const __vue_scope_id__$6 = "data-v-10cb2d28";
+const __vue_scope_id__$8 = "data-v-10cb2d28";
 /* module identifier */
-const __vue_module_identifier__$6 = undefined;
+const __vue_module_identifier__$8 = undefined;
 /* functional template */
-const __vue_is_functional_template__$6 = false;
+const __vue_is_functional_template__$8 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$6 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$6,
-  staticRenderFns: __vue_staticRenderFns__$6
-}, __vue_inject_styles__$6, __vue_script__$6, __vue_scope_id__$6, __vue_is_functional_template__$6, __vue_module_identifier__$6, false, undefined, undefined, undefined);
+const __vue_component__$8 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$8,
+  staticRenderFns: __vue_staticRenderFns__$8
+}, __vue_inject_styles__$8, __vue_script__$8, __vue_scope_id__$8, __vue_is_functional_template__$8, __vue_module_identifier__$8, false, undefined, undefined, undefined);
 
 /** TODO: Use text management library! */
-var script$5 = defineComponent({
+var script$7 = defineComponent({
   name: 'OrSelectContentEmpty',
   props: {
     search: {
@@ -377,13 +171,13 @@ var script$5 = defineComponent({
   }
 });
 
-var css_248z$5 = "@keyframes spinAround-data-v-998c6f28{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-998c6f28{from{opacity:1}to{opacity:0}}.or-select-content-empty[data-v-998c6f28]{display:flex;flex-direction:column;align-items:center;justify-content:center;height:10.625rem}.or-select-content-empty-title[data-v-998c6f28]{font-weight:var(--fw-1)}.or-select-content-empty-description[data-v-998c6f28]{margin-top:.5rem}";
-styleInject(css_248z$5);
+var css_248z$7 = "@keyframes spinAround-data-v-998c6f28{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-998c6f28{from{opacity:1}to{opacity:0}}.or-select-content-empty[data-v-998c6f28]{display:flex;flex-direction:column;align-items:center;justify-content:center;height:10.625rem}.or-select-content-empty-title[data-v-998c6f28]{font-weight:var(--fw-1)}.or-select-content-empty-description[data-v-998c6f28]{margin-top:.5rem}";
+styleInject(css_248z$7);
 
 /* script */
-const __vue_script__$5 = script$5;
+const __vue_script__$7 = script$7;
 /* template */
-var __vue_render__$5 = function () {
+var __vue_render__$7 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -395,31 +189,31 @@ var __vue_render__$5 = function () {
     staticClass: "or-select-content-empty-description"
   }, [_vm._v("\n      " + _vm._s(_vm.noResultsStartText)), _c('strong', [_vm._v(_vm._s(_vm.search))]), _vm._v(_vm._s(_vm.noResultsEndText) + "\n    ")]), _vm._v("\n\n    " + _vm._s(_vm.updateSearchText) + "\n  ")] : _vm._e()], 2);
 };
-var __vue_staticRenderFns__$5 = [];
+var __vue_staticRenderFns__$7 = [];
 
 /* style */
-const __vue_inject_styles__$5 = undefined;
+const __vue_inject_styles__$7 = undefined;
 /* scoped */
-const __vue_scope_id__$5 = "data-v-998c6f28";
+const __vue_scope_id__$7 = "data-v-998c6f28";
 /* module identifier */
-const __vue_module_identifier__$5 = undefined;
+const __vue_module_identifier__$7 = undefined;
 /* functional template */
-const __vue_is_functional_template__$5 = false;
+const __vue_is_functional_template__$7 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$5 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$5,
-  staticRenderFns: __vue_staticRenderFns__$5
-}, __vue_inject_styles__$5, __vue_script__$5, __vue_scope_id__$5, __vue_is_functional_template__$5, __vue_module_identifier__$5, false, undefined, undefined, undefined);
+const __vue_component__$7 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$7,
+  staticRenderFns: __vue_staticRenderFns__$7
+}, __vue_inject_styles__$7, __vue_script__$7, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, false, undefined, undefined, undefined);
 
-var script$4 = defineComponent({
+var script$6 = defineComponent({
   name: 'OrSelectOption',
   components: {
-    OrCheckbox: __vue_component__$b
+    OrCheckbox: __vue_component__$a
   },
   props: {
     option: {
@@ -438,13 +232,13 @@ var script$4 = defineComponent({
   }
 });
 
-var css_248z$4 = "@keyframes spinAround-data-v-710f1291{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-710f1291{from{opacity:1}to{opacity:0}}.or-select-option[data-v-710f1291]{display:flex;align-items:center;height:2.125rem;padding:0 .5rem;cursor:pointer}.or-select-option[data-v-710f1291]:hover{background-color:var(--c-neutral-1)}.or-select-option.active[data-v-710f1291]:not(.checkbox){font-weight:var(--fw-1);background-color:var(--c-neutral-2)}.or-select-option[data-v-710f1291]  .or-checkbox--content,.or-select-option-content[data-v-710f1291]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.or-select-option .or-checkbox[data-v-710f1291]{overflow:hidden}";
-styleInject(css_248z$4);
+var css_248z$6 = "@keyframes spinAround-data-v-710f1291{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-710f1291{from{opacity:1}to{opacity:0}}.or-select-option[data-v-710f1291]{display:flex;align-items:center;height:2.125rem;padding:0 .5rem;cursor:pointer}.or-select-option[data-v-710f1291]:hover{background-color:var(--c-neutral-1)}.or-select-option.active[data-v-710f1291]:not(.checkbox){font-weight:var(--fw-1);background-color:var(--c-neutral-2)}.or-select-option[data-v-710f1291]  .or-checkbox--content,.or-select-option-content[data-v-710f1291]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.or-select-option .or-checkbox[data-v-710f1291]{overflow:hidden}";
+styleInject(css_248z$6);
 
 /* script */
-const __vue_script__$4 = script$4;
+const __vue_script__$6 = script$6;
 /* template */
-var __vue_render__$4 = function () {
+var __vue_render__$6 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -468,31 +262,31 @@ var __vue_render__$4 = function () {
     }
   }) : _vm._e()], 1);
 };
-var __vue_staticRenderFns__$4 = [];
+var __vue_staticRenderFns__$6 = [];
 
 /* style */
-const __vue_inject_styles__$4 = undefined;
+const __vue_inject_styles__$6 = undefined;
 /* scoped */
-const __vue_scope_id__$4 = "data-v-710f1291";
+const __vue_scope_id__$6 = "data-v-710f1291";
 /* module identifier */
-const __vue_module_identifier__$4 = undefined;
+const __vue_module_identifier__$6 = undefined;
 /* functional template */
-const __vue_is_functional_template__$4 = false;
+const __vue_is_functional_template__$6 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$4 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$4,
-  staticRenderFns: __vue_staticRenderFns__$4
-}, __vue_inject_styles__$4, __vue_script__$4, __vue_scope_id__$4, __vue_is_functional_template__$4, __vue_module_identifier__$4, false, undefined, undefined, undefined);
+const __vue_component__$6 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$6,
+  staticRenderFns: __vue_staticRenderFns__$6
+}, __vue_inject_styles__$6, __vue_script__$6, __vue_scope_id__$6, __vue_is_functional_template__$6, __vue_module_identifier__$6, false, undefined, undefined, undefined);
 
-var script$3 = defineComponent({
+var script$5 = defineComponent({
   name: 'OrSelectContentOptions',
   components: {
-    OrSelectOption: __vue_component__$4
+    OrSelectOption: __vue_component__$6
   },
   props: {
     value: OR_SELECT_VALUE_PROP,
@@ -511,13 +305,13 @@ var script$3 = defineComponent({
   }
 });
 
-var css_248z$3 = ".or-select-content-options[data-v-37fa8f57]{display:flex;flex:1 1 100%;flex-direction:column}";
-styleInject(css_248z$3);
+var css_248z$5 = ".or-select-content-options[data-v-37fa8f57]{display:flex;flex:1 1 100%;flex-direction:column}";
+styleInject(css_248z$5);
 
 /* script */
-const __vue_script__$3 = script$3;
+const __vue_script__$5 = script$5;
 /* template */
-var __vue_render__$3 = function () {
+var __vue_render__$5 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -547,34 +341,34 @@ var __vue_render__$3 = function () {
     })], 2);
   }), 0);
 };
-var __vue_staticRenderFns__$3 = [];
+var __vue_staticRenderFns__$5 = [];
 
 /* style */
-const __vue_inject_styles__$3 = undefined;
+const __vue_inject_styles__$5 = undefined;
 /* scoped */
-const __vue_scope_id__$3 = "data-v-37fa8f57";
+const __vue_scope_id__$5 = "data-v-37fa8f57";
 /* module identifier */
-const __vue_module_identifier__$3 = undefined;
+const __vue_module_identifier__$5 = undefined;
 /* functional template */
-const __vue_is_functional_template__$3 = false;
+const __vue_is_functional_template__$5 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$3 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$3,
-  staticRenderFns: __vue_staticRenderFns__$3
-}, __vue_inject_styles__$3, __vue_script__$3, __vue_scope_id__$3, __vue_is_functional_template__$3, __vue_module_identifier__$3, false, undefined, undefined, undefined);
+const __vue_component__$5 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$5,
+  staticRenderFns: __vue_staticRenderFns__$5
+}, __vue_inject_styles__$5, __vue_script__$5, __vue_scope_id__$5, __vue_is_functional_template__$5, __vue_module_identifier__$5, false, undefined, undefined, undefined);
 
-var script$2 = defineComponent({
+var script$4 = defineComponent({
   name: 'OrSelectContent',
   components: {
-    OrLoader: __vue_component__$c,
-    OrSelectSearchOptions: __vue_component__$6,
-    OrSelectContentEmpty: __vue_component__$5,
-    OrSelectContentOptions: __vue_component__$3
+    OrLoader: __vue_component__$b,
+    OrSelectSearchOptions: __vue_component__$8,
+    OrSelectContentEmpty: __vue_component__$7,
+    OrSelectContentOptions: __vue_component__$5
   },
   props: {
     value: OR_SELECT_VALUE_PROP,
@@ -613,13 +407,13 @@ var script$2 = defineComponent({
   }
 });
 
-var css_248z$2 = "@keyframes spinAround-data-v-6c988c45{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-6c988c45{from{opacity:1}to{opacity:0}}.or-select-content[data-v-6c988c45]{display:flex;flex-direction:column;overflow:hidden;background-color:var(--c-white);border:1px solid var(--c-neutral-2)}.or-select-content[data-v-6c988c45]:not(.top){border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem;box-shadow:0 .125rem .5rem 0 rgba(0,0,0,.1)}.or-select-content.top[data-v-6c988c45]{border-top-left-radius:.25rem;border-top-right-radius:.25rem;box-shadow:0 -.125rem .5rem 0 rgba(0,0,0,.1)}.or-select-content-main[data-v-6c988c45]{display:flex;flex:1 1 100%;flex-direction:column;max-height:10.625rem;overflow-y:auto}.or-select-content-main.center-content[data-v-6c988c45]{flex:0 0 10.625rem;align-items:center;justify-content:center}";
-styleInject(css_248z$2);
+var css_248z$4 = "@keyframes spinAround-data-v-6c988c45{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-6c988c45{from{opacity:1}to{opacity:0}}.or-select-content[data-v-6c988c45]{display:flex;flex-direction:column;overflow:hidden;background-color:var(--c-white);border:1px solid var(--c-neutral-2)}.or-select-content[data-v-6c988c45]:not(.top){border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem;box-shadow:0 .125rem .5rem 0 rgba(0,0,0,.1)}.or-select-content.top[data-v-6c988c45]{border-top-left-radius:.25rem;border-top-right-radius:.25rem;box-shadow:0 -.125rem .5rem 0 rgba(0,0,0,.1)}.or-select-content-main[data-v-6c988c45]{display:flex;flex:1 1 100%;flex-direction:column;max-height:10.625rem;overflow-y:auto}.or-select-content-main.center-content[data-v-6c988c45]{flex:0 0 10.625rem;align-items:center;justify-content:center}";
+styleInject(css_248z$4);
 
 /* script */
-const __vue_script__$2 = script$2;
+const __vue_script__$4 = script$4;
 /* template */
-var __vue_render__$2 = function () {
+var __vue_render__$4 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -679,12 +473,218 @@ var __vue_render__$2 = function () {
     }
   }) : _vm._e()], 1);
 };
+var __vue_staticRenderFns__$4 = [];
+
+/* style */
+const __vue_inject_styles__$4 = undefined;
+/* scoped */
+const __vue_scope_id__$4 = "data-v-6c988c45";
+/* module identifier */
+const __vue_module_identifier__$4 = undefined;
+/* functional template */
+const __vue_is_functional_template__$4 = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__$4 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$4,
+  staticRenderFns: __vue_staticRenderFns__$4
+}, __vue_inject_styles__$4, __vue_script__$4, __vue_scope_id__$4, __vue_is_functional_template__$4, __vue_module_identifier__$4, false, undefined, undefined, undefined);
+
+var script$3 = defineComponent({
+  name: 'OrSelectInputValue',
+  components: {
+    OrChip: __vue_component__$c
+  },
+  props: {
+    value: OR_SELECT_VALUE_PROP,
+    options: OR_SELECT_SEARCH_OPTIONS_PROP,
+    isMultiSelect: Boolean,
+    isDisabled: Boolean
+  },
+  emits: ['delete-value'],
+  computed: {
+    optionsByKey() {
+      return keyBy(this.options, 'value');
+    },
+    states() {
+      return {
+        'simple-value': !this.isMultiSelect,
+        'multi-value': this.isMultiSelect
+      };
+    }
+  },
+  methods: {
+    getOptionLabel(optionId) {
+      var _a;
+      const option = this.optionsByKey[optionId];
+      return String(option ? (_a = option.label) !== null && _a !== void 0 ? _a : option.value : optionId);
+    },
+    /** Prevent content toggle event on chips, since they have their own control elements */
+    handleInputValueClick(event) {
+      const inputValueElement = this.$refs['input-value'];
+      const inputValueTextElement = this.$refs['input-value-text'];
+      const target = event.target;
+      if (target !== inputValueElement && target !== inputValueTextElement) {
+        event.stopPropagation();
+      }
+    }
+  }
+});
+
+var css_248z$3 = "@keyframes spinAround-data-v-100ef33e{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-100ef33e{from{opacity:1}to{opacity:0}}.or-select-input-value[data-v-100ef33e]{display:flex;flex:1 1 100%;overflow:hidden}.or-select-input-value.simple-value[data-v-100ef33e]{align-items:center}.or-select-input-value-text[data-v-100ef33e]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.or-select-input-value.multi-value[data-v-100ef33e]{flex-wrap:wrap;padding:.125rem 0}.or-select-input-value.multi-value .or-chip[data-v-100ef33e]{margin:.125rem}.or-select-input-value.multi-value .or-chip[data-v-100ef33e]:not(.disabled){cursor:default}";
+styleInject(css_248z$3);
+
+/* script */
+const __vue_script__$3 = script$3;
+/* template */
+var __vue_render__$3 = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', {
+    ref: "input-value",
+    staticClass: "or-select-input-value",
+    class: _vm.states,
+    on: {
+      "click": _vm.handleInputValueClick
+    }
+  }, [!_vm.isMultiSelect ? _c('div', {
+    ref: "input-value-text",
+    staticClass: "or-select-input-value-text"
+  }, [_vm._v("\n    " + _vm._s(_vm.getOptionLabel(_vm.value)) + "\n  ")]) : _vm._e(), _vm._v(" "), _vm.isMultiSelect ? _vm._l(_vm.value, function (valueItem) {
+    return _c('or-chip', {
+      key: valueItem,
+      attrs: {
+        "content": _vm.getOptionLabel(valueItem),
+        "is-disabled": _vm.isDisabled
+      },
+      on: {
+        "delete": function ($event) {
+          return _vm.$emit('delete-value', valueItem);
+        }
+      }
+    });
+  }) : _vm._e()], 2);
+};
+var __vue_staticRenderFns__$3 = [];
+
+/* style */
+const __vue_inject_styles__$3 = undefined;
+/* scoped */
+const __vue_scope_id__$3 = "data-v-100ef33e";
+/* module identifier */
+const __vue_module_identifier__$3 = undefined;
+/* functional template */
+const __vue_is_functional_template__$3 = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__$3 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$3,
+  staticRenderFns: __vue_staticRenderFns__$3
+}, __vue_inject_styles__$3, __vue_script__$3, __vue_scope_id__$3, __vue_is_functional_template__$3, __vue_module_identifier__$3, false, undefined, undefined, undefined);
+
+var script$2 = defineComponent({
+  name: 'OrSelectInput',
+  components: {
+    OrIcon: __vue_component__$9,
+    OrSelectInputValue: __vue_component__$3
+  },
+  props: {
+    value: OR_SELECT_VALUE_PROP,
+    options: OR_SELECT_OPTIONS_PROP,
+    placeholder: OR_SELECT_PLACEHOLDER_PROP,
+    isOpen: Boolean,
+    isMultiSelect: Boolean,
+    isTop: Boolean,
+    isDisabled: Boolean,
+    isInvalid: Boolean
+  },
+  emits: ['toggle-content', 'delete-value'],
+  computed: {
+    icon() {
+      return this.isOpen ? 'arrow_drop_up' : 'arrow_drop_down';
+    },
+    states() {
+      return {
+        open: this.isOpen,
+        error: this.isInvalid,
+        disabled: this.isDisabled,
+        multiselect: this.isMultiSelect,
+        top: this.isTop
+      };
+    },
+    isEmptyValue() {
+      return typeof this.value === 'number' ? false : isEmpty(this.value);
+    }
+  },
+  methods: {
+    handleToggleContent() {
+      if (!this.isDisabled) {
+        this.$emit('toggle-content');
+      }
+    }
+  }
+});
+
+var css_248z$2 = "@keyframes spinAround-data-v-4d590135{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-4d590135{from{opacity:1}to{opacity:0}}.or-select-input[data-v-4d590135]{display:flex;padding:0 .5rem;cursor:pointer}.or-select-input.input-wrapper[data-v-4d590135]{min-height:2.25rem;background-color:var(--c-neutral-1);border:1px solid var(--c-neutral-2);border-radius:.25rem}.or-select-input.input-wrapper.error[data-v-4d590135]{border-color:var(--c-error)}.or-select-input.open[data-v-4d590135],.or-select-input[data-v-4d590135]:hover:not(.disabled){background-color:var(--c-white)}.or-select-input.open[data-v-4d590135]{border-color:var(--c-neutral-2)}.or-select-input.open[data-v-4d590135]:not(.top){border-bottom-right-radius:0;border-bottom-left-radius:0}.or-select-input.open.top[data-v-4d590135]{border-top-left-radius:0;border-top-right-radius:0}.or-select-input.disabled[data-v-4d590135]{cursor:not-allowed}.or-select-input.disabled[data-v-4d590135]:not(.multiselect){background-color:var(--c-neutral-1-darken-5)}.or-select-input-placeholder[data-v-4d590135]{display:flex;align-items:center;overflow:hidden;color:var(--c-neutral-4);user-select:none}.or-select-input-placeholder-text[data-v-4d590135]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.or-select-input-button[data-v-4d590135]{display:flex;align-items:center;height:2.125rem;margin-left:auto}.or-select-input-button[data-v-4d590135]  .or-icon{margin-left:.5rem}";
+styleInject(css_248z$2);
+
+/* script */
+const __vue_script__$2 = script$2;
+/* template */
+var __vue_render__$2 = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', {
+    staticClass: "or-select-input input-wrapper",
+    class: _vm.states,
+    on: {
+      "click": _vm.handleToggleContent
+    }
+  }, [_vm.isEmptyValue ? _c('div', {
+    staticClass: "or-select-input-placeholder"
+  }, [_c('span', {
+    staticClass: "or-select-input-placeholder-text"
+  }, [_vm._v("\n      " + _vm._s(_vm.placeholder) + "\n    ")])]) : _vm._e(), _vm._v(" "), !_vm.isEmptyValue ? _vm._t("input-value", function () {
+    return [_c('or-select-input-value', {
+      attrs: {
+        "value": _vm.value,
+        "options": _vm.options,
+        "is-multi-select": _vm.isMultiSelect,
+        "is-disabled": _vm.isDisabled
+      },
+      on: {
+        "delete-value": function ($event) {
+          return _vm.$emit('delete-value', $event);
+        }
+      }
+    })];
+  }, {
+    "value": _vm.value,
+    "options": _vm.options
+  }) : _vm._e(), _vm._v(" "), _c('div', {
+    staticClass: "or-select-input-button"
+  }, [_c('or-icon', {
+    attrs: {
+      "icon": _vm.icon
+    }
+  })], 1)], 2);
+};
 var __vue_staticRenderFns__$2 = [];
 
 /* style */
 const __vue_inject_styles__$2 = undefined;
 /* scoped */
-const __vue_scope_id__$2 = "data-v-6c988c45";
+const __vue_scope_id__$2 = "data-v-4d590135";
 /* module identifier */
 const __vue_module_identifier__$2 = undefined;
 /* functional template */
@@ -703,8 +703,8 @@ const __vue_component__$2 = /*#__PURE__*/normalizeComponent({
 var script$1 = defineComponent({
   name: 'OrSelect',
   components: {
-    OrSelectInput: __vue_component__$7,
-    OrSelectContent: __vue_component__$2,
+    OrSelectInput: __vue_component__$2,
+    OrSelectContent: __vue_component__$4,
     OrFloating: __vue_component__$d
   },
   props: {
@@ -776,7 +776,7 @@ var script$1 = defineComponent({
   }
 });
 
-var css_248z$1 = "@keyframes spinAround-data-v-16ec6af4{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-16ec6af4{from{opacity:1}to{opacity:0}}.or-select-main[data-v-16ec6af4]{position:relative}.or-select-main .or-select-input[data-v-16ec6af4]{position:relative}.or-floating .or-select-content[data-v-16ec6af4]{width:100%}.or-floating .or-select-content[data-v-16ec6af4]:not(.top){border-top:none}.or-floating .or-select-content.top[data-v-16ec6af4]{border-bottom:none}";
+var css_248z$1 = "@keyframes spinAround-data-v-70c19136{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-70c19136{from{opacity:1}to{opacity:0}}.or-select-main[data-v-70c19136]{position:relative}.or-select-main .or-select-input[data-v-70c19136]{position:relative}.or-floating .or-select-content[data-v-70c19136]{width:100%}.or-floating .or-select-content[data-v-70c19136]:not(.top){border-top:none}.or-floating .or-select-content.top[data-v-70c19136]{border-bottom:none}";
 styleInject(css_248z$1);
 
 /* script */
@@ -787,7 +787,7 @@ var __vue_render__$1 = function () {
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
   return _c('div', {
-    ref: "root",
+    ref: 'root',
     staticClass: "or-select-main",
     class: {
       open: _vm.isOpen
@@ -871,7 +871,7 @@ var __vue_staticRenderFns__$1 = [];
 /* style */
 const __vue_inject_styles__$1 = undefined;
 /* scoped */
-const __vue_scope_id__$1 = "data-v-16ec6af4";
+const __vue_scope_id__$1 = "data-v-70c19136";
 /* module identifier */
 const __vue_module_identifier__$1 = undefined;
 /* functional template */