@onereach/ui-components-vue2 20.3.0-beta.5253.0 → 20.3.1

package/dist/esm/components/or-checkbox-group-v3/index.js

@@ -1,4 +1,4 @@
-import { defineComponent, toRef } from 'vue-demi';
+import { defineComponent, toRef, computed } from 'vue-demi';
 import { a as re, n as ne } from '../../useValidationAttributes-w0RCHARs-21132c84.js';
 import { OrCheckboxTreeV3 as OrCheckboxTree } from '../or-checkbox-tree-v3/index.js';
 import { OrFormGroupV3 as OrFormGroup, FormGroupDirection, FormGroupSpacing } from '../or-form-group-v3/index.js';
@@ -73,9 +73,10 @@ var script = defineComponent({
     const {
       isMobile
     } = ne();
+    const localSpacing = computed(() => isMobile.value ? FormGroupSpacing.NONE : props.spacing);
     return {
       proxyModelValue,
-      isMobile
+      localSpacing
     };
   }
 });
@@ -95,7 +96,7 @@ var __vue_render__ = function () {
       "hint": _vm.hint,
       "disabled": _vm.disabled,
       "direction": _vm.direction,
-      "spacing": _vm.isMobile ? 'none' : _vm.spacing
+      "spacing": _vm.localSpacing
     },
     scopedSlots: _vm._u([{
       key: "addon",

package/dist/esm/components/or-checkbox-tree-v3/index.js

@@ -20,7 +20,7 @@ const CheckboxTreeRoot = [
 // Layout
 'flex', 'flex-col',
 // Spacing
-'gap-sm+ md:gap-sm'];
+'md:gap-sm'];
 const CheckboxTreeRootParent = [
 // Layout
 'flex', 'flex-row', 'gap-xs'];

package/dist/esm/components/or-checkbox-v3/index.js

@@ -14,7 +14,7 @@ const Checkbox = [
 // Layout
 'layout-row',
 // Spacing
-'gap-[10px] md:gap-sm', 'p-sm pl-[10px] md:p-none md:pl-none'];
+'md:gap-sm'];
 const CheckboxControl = [
 // Layout
 'layout-inline-row justify-center',
@@ -23,7 +23,7 @@ const CheckboxControl = [
 // Shape
 'rounded-sm leading-[0]',
 // Box
-'w-md+ md:w-md', 'h-md+ md:h-md',
+'w-md+ md:w-md', 'h-md+ md:h-md', 'm-[10px] md:m-none',
 // Iconography
 'iconography-outlined',
 // Theme

package/dist/esm/components/or-data-grid-v3/index.js

@@ -11,10 +11,10 @@ import { OrTagInputV3 as OrTagInput } from '../or-tag-input-v3/index.js';
 import { OrTimePickerV3 as OrTimePicker } from '../or-time-picker-v3/index.js';
 import { useElementSize } from '@vueuse/core';
 import { OrIconV3 as OrIcon } from '../or-icon-v3/index.js';
+import { OrNotificationV3 as OrNotification } from '../or-notification-v3/index.js';
 import { OrPaginationV3 as OrPagination } from '../or-pagination-v3/index.js';
 import { OrSearchV3 as OrSearch } from '../or-search-v3/index.js';
 import { O as OrSkeletonText } from '../../OrSkeletonText-32afddae.js';
-import { OrNotificationV3 as OrNotification } from '../or-notification-v3/index.js';
 import '../../useValidationAttributes-w0RCHARs-21132c84.js';
 import '../../dom-DzNS5tBj-6d9cf0ef.js';
 import 'lodash/get';
@@ -52,8 +52,8 @@ import '../../searchItemsByLabel-CPGAoUEr-0aa65960.js';
 import '../or-tags-v3/index.js';
 import '../or-tag-v3/index.js';
 import '../or-expansion-panel-v3/index.js';
-import 'lodash/range';
 import '../or-indicator-v3/index.js';
+import 'lodash/range';
 
 const DataGridFooter = [
 // Layout
@@ -70,7 +70,7 @@ const DataGridFooterStatus = [
 // Typography
 'typography-body-2-semibold'];
 
-var script$e = defineComponent({
+var script$f = defineComponent({
   name: 'OrDataGridFooter',
   expose: ['root'],
   setup() {
@@ -87,10 +87,10 @@ var script$e = defineComponent({
 });
 
 /* script */
-const __vue_script__$e = script$e;
+const __vue_script__$f = script$f;
 
 /* template */
-var __vue_render__$e = function () {
+var __vue_render__$f = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -103,27 +103,27 @@ var __vue_render__$e = function () {
     class: ['grow']
   })] : _vm._e(), _vm._v(" "), _vm._t('paging')], 2);
 };
-var __vue_staticRenderFns__$e = [];
+var __vue_staticRenderFns__$f = [];
 
 /* style */
-const __vue_inject_styles__$e = undefined;
+const __vue_inject_styles__$f = undefined;
 /* scoped */
-const __vue_scope_id__$e = undefined;
+const __vue_scope_id__$f = undefined;
 /* module identifier */
-const __vue_module_identifier__$e = undefined;
+const __vue_module_identifier__$f = undefined;
 /* functional template */
-const __vue_is_functional_template__$e = false;
+const __vue_is_functional_template__$f = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$s = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$e,
-  staticRenderFns: __vue_staticRenderFns__$e
-}, __vue_inject_styles__$e, __vue_script__$e, __vue_scope_id__$e, __vue_is_functional_template__$e, __vue_module_identifier__$e, false, undefined, undefined, undefined);
-var __vue_component__$t = __vue_component__$s;
+const __vue_component__$u = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$f,
+  staticRenderFns: __vue_staticRenderFns__$f
+}, __vue_inject_styles__$f, __vue_script__$f, __vue_scope_id__$f, __vue_is_functional_template__$f, __vue_module_identifier__$f, false, undefined, undefined, undefined);
+var __vue_component__$v = __vue_component__$u;
 
 const DataGridHeader = [
 // Layout
@@ -136,7 +136,7 @@ const DataGridHeaderTitle = [
 // Typography
 'typography-headline-2'];
 
-var script$d = defineComponent({
+var script$e = defineComponent({
   name: 'OrDataGridHeader',
   expose: ['root'],
   setup() {
@@ -153,10 +153,10 @@ var script$d = defineComponent({
 });
 
 /* script */
-const __vue_script__$d = script$d;
+const __vue_script__$e = script$e;
 
 /* template */
-var __vue_render__$d = function () {
+var __vue_render__$e = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -169,27 +169,27 @@ var __vue_render__$d = function () {
     class: ['grow']
   })] : _vm._e(), _vm._v(" "), _vm._t('searching')], 2);
 };
-var __vue_staticRenderFns__$d = [];
+var __vue_staticRenderFns__$e = [];
 
 /* style */
-const __vue_inject_styles__$d = undefined;
+const __vue_inject_styles__$e = undefined;
 /* scoped */
-const __vue_scope_id__$d = undefined;
+const __vue_scope_id__$e = undefined;
 /* module identifier */
-const __vue_module_identifier__$d = undefined;
+const __vue_module_identifier__$e = undefined;
 /* functional template */
-const __vue_is_functional_template__$d = false;
+const __vue_is_functional_template__$e = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$q = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$d,
-  staticRenderFns: __vue_staticRenderFns__$d
-}, __vue_inject_styles__$d, __vue_script__$d, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, undefined, undefined, undefined);
-var __vue_component__$r = __vue_component__$q;
+const __vue_component__$s = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$e,
+  staticRenderFns: __vue_staticRenderFns__$e
+}, __vue_inject_styles__$e, __vue_script__$e, __vue_scope_id__$e, __vue_is_functional_template__$e, __vue_module_identifier__$e, false, undefined, undefined, undefined);
+var __vue_component__$t = __vue_component__$s;
 
 const DataGridTableContentCell = [
 // Layout
@@ -205,7 +205,7 @@ const DataGridTableContentCell = [
 // Theme (.sticky-end)
 '[&.sticky-end]:border-s-disabled', 'dark:[&.sticky-end]:border-s-disabled-dark'];
 
-var script$c = defineComponent({
+var script$d = defineComponent({
   name: 'OrDataGridTableContentCell',
   components: {
     OrCheckbox,
@@ -299,10 +299,10 @@ var script$c = defineComponent({
 });
 
 /* script */
-const __vue_script__$c = script$c;
+const __vue_script__$d = script$d;
 
 /* template */
-var __vue_render__$c = function () {
+var __vue_render__$d = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -422,27 +422,27 @@ var __vue_render__$c = function () {
     class: ['truncate']
   }, [_vm._t("default")], 2)]], 2);
 };
-var __vue_staticRenderFns__$c = [];
+var __vue_staticRenderFns__$d = [];
 
 /* style */
-const __vue_inject_styles__$c = undefined;
+const __vue_inject_styles__$d = undefined;
 /* scoped */
-const __vue_scope_id__$c = undefined;
+const __vue_scope_id__$d = undefined;
 /* module identifier */
-const __vue_module_identifier__$c = undefined;
+const __vue_module_identifier__$d = undefined;
 /* functional template */
-const __vue_is_functional_template__$c = false;
+const __vue_is_functional_template__$d = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$o = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$c,
-  staticRenderFns: __vue_staticRenderFns__$c
-}, __vue_inject_styles__$c, __vue_script__$c, __vue_scope_id__$c, __vue_is_functional_template__$c, __vue_module_identifier__$c, false, undefined, undefined, undefined);
-var __vue_component__$p = __vue_component__$o;
+const __vue_component__$q = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$d,
+  staticRenderFns: __vue_staticRenderFns__$d
+}, __vue_inject_styles__$d, __vue_script__$d, __vue_scope_id__$d, __vue_is_functional_template__$d, __vue_module_identifier__$d, false, undefined, undefined, undefined);
+var __vue_component__$r = __vue_component__$q;
 
 var DataGridVariant;
 (function (DataGridVariant) {
@@ -478,7 +478,7 @@ const DataGridTableContentRowVariants = {
   'h-[calc(theme(spacing.xl)+theme(spacing.xs))]']
 };
 
-var script$b = defineComponent({
+var script$c = defineComponent({
   name: 'OrDataGridTableContentRow',
   props: {
     variant: {
@@ -503,10 +503,10 @@ var script$b = defineComponent({
 });
 
 /* script */
-const __vue_script__$b = script$b;
+const __vue_script__$c = script$c;
 
 /* template */
-var __vue_render__$b = function () {
+var __vue_render__$c = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -518,33 +518,33 @@ var __vue_render__$b = function () {
     }
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$b = [];
+var __vue_staticRenderFns__$c = [];
 
 /* style */
-const __vue_inject_styles__$b = undefined;
+const __vue_inject_styles__$c = undefined;
 /* scoped */
-const __vue_scope_id__$b = undefined;
+const __vue_scope_id__$c = undefined;
 /* module identifier */
-const __vue_module_identifier__$b = undefined;
+const __vue_module_identifier__$c = undefined;
 /* functional template */
-const __vue_is_functional_template__$b = false;
+const __vue_is_functional_template__$c = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$m = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$b,
-  staticRenderFns: __vue_staticRenderFns__$b
-}, __vue_inject_styles__$b, __vue_script__$b, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, undefined, undefined, undefined);
-var __vue_component__$n = __vue_component__$m;
+const __vue_component__$o = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$c,
+  staticRenderFns: __vue_staticRenderFns__$c
+}, __vue_inject_styles__$c, __vue_script__$c, __vue_scope_id__$c, __vue_is_functional_template__$c, __vue_module_identifier__$c, false, undefined, undefined, undefined);
+var __vue_component__$p = __vue_component__$o;
 
 const DataGridTableContent = [
 // Layout
 'contents'];
 
-var script$a = defineComponent({
+var script$b = defineComponent({
   name: 'OrDataGridTableContent',
   expose: ['root'],
   setup() {
@@ -559,10 +559,10 @@ var script$a = defineComponent({
 });
 
 /* script */
-const __vue_script__$a = script$a;
+const __vue_script__$b = script$b;
 
 /* template */
-var __vue_render__$a = function () {
+var __vue_render__$b = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -571,27 +571,27 @@ var __vue_render__$a = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$a = [];
+var __vue_staticRenderFns__$b = [];
 
 /* style */
-const __vue_inject_styles__$a = undefined;
+const __vue_inject_styles__$b = undefined;
 /* scoped */
-const __vue_scope_id__$a = undefined;
+const __vue_scope_id__$b = undefined;
 /* module identifier */
-const __vue_module_identifier__$a = undefined;
+const __vue_module_identifier__$b = undefined;
 /* functional template */
-const __vue_is_functional_template__$a = false;
+const __vue_is_functional_template__$b = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$k = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$a,
-  staticRenderFns: __vue_staticRenderFns__$a
-}, __vue_inject_styles__$a, __vue_script__$a, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, undefined, undefined, undefined);
-var __vue_component__$l = __vue_component__$k;
+const __vue_component__$m = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$b,
+  staticRenderFns: __vue_staticRenderFns__$b
+}, __vue_inject_styles__$b, __vue_script__$b, __vue_scope_id__$b, __vue_is_functional_template__$b, __vue_module_identifier__$b, false, undefined, undefined, undefined);
+var __vue_component__$n = __vue_component__$m;
 
 const DataGridTableFooterCell = [
 // Layout
@@ -601,7 +601,7 @@ const DataGridTableFooterCell = [
 // Theme
 'theme-border-transparent border-1', 'dark:theme-border-transparent-dark'];
 
-var script$9 = defineComponent({
+var script$a = defineComponent({
   name: 'OrDataGridTableFooterCell',
   expose: ['root'],
   setup() {
@@ -616,10 +616,10 @@ var script$9 = defineComponent({
 });
 
 /* script */
-const __vue_script__$9 = script$9;
+const __vue_script__$a = script$a;
 
 /* template */
-var __vue_render__$9 = function () {
+var __vue_render__$a = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -628,27 +628,27 @@ var __vue_render__$9 = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$9 = [];
+var __vue_staticRenderFns__$a = [];
 
 /* style */
-const __vue_inject_styles__$9 = undefined;
+const __vue_inject_styles__$a = undefined;
 /* scoped */
-const __vue_scope_id__$9 = undefined;
+const __vue_scope_id__$a = undefined;
 /* module identifier */
-const __vue_module_identifier__$9 = undefined;
+const __vue_module_identifier__$a = undefined;
 /* functional template */
-const __vue_is_functional_template__$9 = false;
+const __vue_is_functional_template__$a = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$i = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$9,
-  staticRenderFns: __vue_staticRenderFns__$9
-}, __vue_inject_styles__$9, __vue_script__$9, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, false, undefined, undefined, undefined);
-var __vue_component__$j = __vue_component__$i;
+const __vue_component__$k = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$a,
+  staticRenderFns: __vue_staticRenderFns__$a
+}, __vue_inject_styles__$a, __vue_script__$a, __vue_scope_id__$a, __vue_is_functional_template__$a, __vue_module_identifier__$a, false, undefined, undefined, undefined);
+var __vue_component__$l = __vue_component__$k;
 
 const DataGridTableFooterRow = [
 // Layout
@@ -671,7 +671,7 @@ const DataGridTableFooterRowVariants = {
   'h-[calc(theme(spacing.xl)+theme(spacing.xs))]']
 };
 
-var script$8 = defineComponent({
+var script$9 = defineComponent({
   name: 'OrDataGridTableFooterRow',
   props: {
     variant: {
@@ -692,10 +692,10 @@ var script$8 = defineComponent({
 });
 
 /* script */
-const __vue_script__$8 = script$8;
+const __vue_script__$9 = script$9;
 
 /* template */
-var __vue_render__$8 = function () {
+var __vue_render__$9 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -704,33 +704,33 @@ var __vue_render__$8 = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$8 = [];
+var __vue_staticRenderFns__$9 = [];
 
 /* style */
-const __vue_inject_styles__$8 = undefined;
+const __vue_inject_styles__$9 = undefined;
 /* scoped */
-const __vue_scope_id__$8 = undefined;
+const __vue_scope_id__$9 = undefined;
 /* module identifier */
-const __vue_module_identifier__$8 = undefined;
+const __vue_module_identifier__$9 = undefined;
 /* functional template */
-const __vue_is_functional_template__$8 = false;
+const __vue_is_functional_template__$9 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$g = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$8,
-  staticRenderFns: __vue_staticRenderFns__$8
-}, __vue_inject_styles__$8, __vue_script__$8, __vue_scope_id__$8, __vue_is_functional_template__$8, __vue_module_identifier__$8, false, undefined, undefined, undefined);
-var __vue_component__$h = __vue_component__$g;
+const __vue_component__$i = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$9,
+  staticRenderFns: __vue_staticRenderFns__$9
+}, __vue_inject_styles__$9, __vue_script__$9, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, false, undefined, undefined, undefined);
+var __vue_component__$j = __vue_component__$i;
 
 const DataGridTableFooter = [
 // Layout
 'contents'];
 
-var script$7 = defineComponent({
+var script$8 = defineComponent({
   name: 'OrDataGridTableFooter',
   expose: ['root'],
   setup() {
@@ -745,10 +745,10 @@ var script$7 = defineComponent({
 });
 
 /* script */
-const __vue_script__$7 = script$7;
+const __vue_script__$8 = script$8;
 
 /* template */
-var __vue_render__$7 = function () {
+var __vue_render__$8 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -757,27 +757,27 @@ var __vue_render__$7 = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$7 = [];
+var __vue_staticRenderFns__$8 = [];
 
 /* style */
-const __vue_inject_styles__$7 = undefined;
+const __vue_inject_styles__$8 = undefined;
 /* scoped */
-const __vue_scope_id__$7 = undefined;
+const __vue_scope_id__$8 = undefined;
 /* module identifier */
-const __vue_module_identifier__$7 = undefined;
+const __vue_module_identifier__$8 = undefined;
 /* functional template */
-const __vue_is_functional_template__$7 = false;
+const __vue_is_functional_template__$8 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$e = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$7,
-  staticRenderFns: __vue_staticRenderFns__$7
-}, __vue_inject_styles__$7, __vue_script__$7, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, false, undefined, undefined, undefined);
-var __vue_component__$f = __vue_component__$e;
+const __vue_component__$g = /*#__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 __vue_component__$h = __vue_component__$g;
 
 const DataGridTableHeaderCell = [
 // Layout
@@ -791,7 +791,7 @@ const DataGridTableHeaderCell = [
 // Theme (.sticky-end)
 '[&.sticky-end]:border-s-disabled', 'dark:[&.sticky-end]:border-s-disabled-dark'];
 
-var script$6 = defineComponent({
+var script$7 = defineComponent({
   name: 'OrDataGridTableHeaderCell',
   components: {
     OrIcon
@@ -911,10 +911,10 @@ var script$6 = defineComponent({
 });
 
 /* script */
-const __vue_script__$6 = script$6;
+const __vue_script__$7 = script$7;
 
 /* template */
-var __vue_render__$6 = function () {
+var __vue_render__$7 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -935,27 +935,27 @@ var __vue_render__$6 = function () {
     }
   })] : _vm._e()], 2);
 };
-var __vue_staticRenderFns__$6 = [];
+var __vue_staticRenderFns__$7 = [];
 
 /* style */
-const __vue_inject_styles__$6 = undefined;
+const __vue_inject_styles__$7 = undefined;
 /* scoped */
-const __vue_scope_id__$6 = undefined;
+const __vue_scope_id__$7 = undefined;
 /* module identifier */
-const __vue_module_identifier__$6 = undefined;
+const __vue_module_identifier__$7 = undefined;
 /* functional template */
-const __vue_is_functional_template__$6 = false;
+const __vue_is_functional_template__$7 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$c = /*#__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 __vue_component__$d = __vue_component__$c;
+const __vue_component__$e = /*#__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 __vue_component__$f = __vue_component__$e;
 
 const DataGridTableHeaderRow = [
 // Position
@@ -978,7 +978,7 @@ const DataGridTableHeaderRowVariants = {
   'h-[calc(theme(spacing.xl)+theme(spacing.xs))]']
 };
 
-var script$5 = defineComponent({
+var script$6 = defineComponent({
   name: 'OrDataGridTableHeaderRow',
   props: {
     variant: {
@@ -999,10 +999,10 @@ var script$5 = defineComponent({
 });
 
 /* script */
-const __vue_script__$5 = script$5;
+const __vue_script__$6 = script$6;
 
 /* template */
-var __vue_render__$5 = function () {
+var __vue_render__$6 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -1011,33 +1011,33 @@ var __vue_render__$5 = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$5 = [];
+var __vue_staticRenderFns__$6 = [];
 
 /* style */
-const __vue_inject_styles__$5 = undefined;
+const __vue_inject_styles__$6 = undefined;
 /* scoped */
-const __vue_scope_id__$5 = undefined;
+const __vue_scope_id__$6 = undefined;
 /* module identifier */
-const __vue_module_identifier__$5 = undefined;
+const __vue_module_identifier__$6 = undefined;
 /* functional template */
-const __vue_is_functional_template__$5 = false;
+const __vue_is_functional_template__$6 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$a = /*#__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 __vue_component__$b = __vue_component__$a;
+const __vue_component__$c = /*#__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 __vue_component__$d = __vue_component__$c;
 
 const DataGridTableHeader = [
 // Layout
 'contents'];
 
-var script$4 = defineComponent({
+var script$5 = defineComponent({
   name: 'OrDataGridTableHeader',
   expose: ['root'],
   setup() {
@@ -1052,10 +1052,10 @@ var script$4 = defineComponent({
 });
 
 /* script */
-const __vue_script__$4 = script$4;
+const __vue_script__$5 = script$5;
 
 /* template */
-var __vue_render__$4 = function () {
+var __vue_render__$5 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -1064,27 +1064,27 @@ var __vue_render__$4 = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$4 = [];
+var __vue_staticRenderFns__$5 = [];
 
 /* style */
-const __vue_inject_styles__$4 = undefined;
+const __vue_inject_styles__$5 = undefined;
 /* scoped */
-const __vue_scope_id__$4 = undefined;
+const __vue_scope_id__$5 = undefined;
 /* module identifier */
-const __vue_module_identifier__$4 = undefined;
+const __vue_module_identifier__$5 = undefined;
 /* functional template */
-const __vue_is_functional_template__$4 = false;
+const __vue_is_functional_template__$5 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$8 = /*#__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 __vue_component__$9 = __vue_component__$8;
+const __vue_component__$a = /*#__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 __vue_component__$b = __vue_component__$a;
 
 const DataGridTablePlaceholder = [
 // Layout
@@ -1107,7 +1107,7 @@ const DataGridTablePlaceholderVariants = {
   'min-h-[calc(theme(spacing.xl)+theme(spacing.xs))]']
 };
 
-var script$3 = defineComponent({
+var script$4 = defineComponent({
   name: 'OrDataGridTablePlaceholder',
   props: {
     variant: {
@@ -1128,10 +1128,10 @@ var script$3 = defineComponent({
 });
 
 /* script */
-const __vue_script__$3 = script$3;
+const __vue_script__$4 = script$4;
 
 /* template */
-var __vue_render__$3 = function () {
+var __vue_render__$4 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -1140,27 +1140,27 @@ var __vue_render__$3 = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$3 = [];
+var __vue_staticRenderFns__$4 = [];
 
 /* style */
-const __vue_inject_styles__$3 = undefined;
+const __vue_inject_styles__$4 = undefined;
 /* scoped */
-const __vue_scope_id__$3 = undefined;
+const __vue_scope_id__$4 = undefined;
 /* module identifier */
-const __vue_module_identifier__$3 = undefined;
+const __vue_module_identifier__$4 = undefined;
 /* functional template */
-const __vue_is_functional_template__$3 = false;
+const __vue_is_functional_template__$4 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$6 = /*#__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 __vue_component__$7 = __vue_component__$6;
+const __vue_component__$8 = /*#__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 __vue_component__$9 = __vue_component__$8;
 
 const DataGridTable = [
 // Layout
@@ -1170,7 +1170,7 @@ const DataGridTable = [
 // Interactivity
 'interactivity-default'];
 
-var script$2 = defineComponent({
+var script$3 = defineComponent({
   name: 'OrDataGridTable',
   props: {
     columns: {
@@ -1210,10 +1210,10 @@ var script$2 = defineComponent({
 });
 
 /* script */
-const __vue_script__$2 = script$2;
+const __vue_script__$3 = script$3;
 
 /* template */
-var __vue_render__$2 = function () {
+var __vue_render__$3 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -1223,27 +1223,27 @@ var __vue_render__$2 = function () {
     style: _vm.rootInlineStyles
   }, [_vm._t("default")], 2);
 };
-var __vue_staticRenderFns__$2 = [];
+var __vue_staticRenderFns__$3 = [];
 
 /* style */
-const __vue_inject_styles__$2 = undefined;
+const __vue_inject_styles__$3 = undefined;
 /* scoped */
-const __vue_scope_id__$2 = undefined;
+const __vue_scope_id__$3 = undefined;
 /* module identifier */
-const __vue_module_identifier__$2 = undefined;
+const __vue_module_identifier__$3 = undefined;
 /* functional template */
-const __vue_is_functional_template__$2 = false;
+const __vue_is_functional_template__$3 = false;
 /* style inject */
 
 /* style inject SSR */
 
 /* style inject shadow dom */
 
-const __vue_component__$4 = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__$2,
-  staticRenderFns: __vue_staticRenderFns__$2
-}, __vue_inject_styles__$2, __vue_script__$2, __vue_scope_id__$2, __vue_is_functional_template__$2, __vue_module_identifier__$2, false, undefined, undefined, undefined);
-var __vue_component__$5 = __vue_component__$4;
+const __vue_component__$6 = /*#__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 __vue_component__$7 = __vue_component__$6;
 
 const DataGridToolbar = [
 // Layout
@@ -1253,7 +1253,7 @@ const DataGridToolbar = [
 // Spacing
 'gap-xl'];
 
-var script$1 = defineComponent({
+var script$2 = defineComponent({
   name: 'OrDataGridToolbar',
   expose: ['root'],
   setup() {
@@ -1268,10 +1268,10 @@ var script$1 = defineComponent({
 });
 
 /* script */
-const __vue_script__$1 = script$1;
+const __vue_script__$2 = script$2;
 
 /* template */
-var __vue_render__$1 = function () {
+var __vue_render__$2 = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
@@ -1280,6 +1280,87 @@ var __vue_render__$1 = function () {
     class: _vm.rootStyles
   }, [_vm._t("default")], 2);
 };
+var __vue_staticRenderFns__$2 = [];
+
+/* style */
+const __vue_inject_styles__$2 = undefined;
+/* scoped */
+const __vue_scope_id__$2 = undefined;
+/* module identifier */
+const __vue_module_identifier__$2 = undefined;
+/* functional template */
+const __vue_is_functional_template__$2 = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__$4 = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__$2,
+  staticRenderFns: __vue_staticRenderFns__$2
+}, __vue_inject_styles__$2, __vue_script__$2, __vue_scope_id__$2, __vue_is_functional_template__$2, __vue_module_identifier__$2, false, undefined, undefined, undefined);
+var __vue_component__$5 = __vue_component__$4;
+
+const DataGridNotification = [
+// Position
+'grid sticky z-10',
+// Layout
+'col-span-full'];
+const DataGridNotificationPositionVariants = {
+  [DataGridVariant.Standard]: [
+  // Position
+  'top-[calc(theme(spacing.2xl)+theme(spacing.xs))]'],
+  [DataGridVariant.Comfortable]: [
+  // Position
+  'top-[calc(theme(spacing.3xl)+theme(spacing.xs))]'],
+  [DataGridVariant.Compact]: [
+  // Position
+  'top-[calc(theme(spacing.xl)+theme(spacing.xs))]']
+};
+
+var script$1 = defineComponent({
+  components: {
+    OrNotification
+  },
+  props: {
+    notification: {
+      type: Object,
+      required: true
+    },
+    variant: {
+      type: String,
+      required: true
+    }
+  },
+  emits: ['close-notification'],
+  setup(props) {
+    const rootStyles = computed(() => ['or-data-grid-notification-v3', ...DataGridNotification, ...DataGridNotificationPositionVariants[props.variant]]);
+    return {
+      rootStyles
+    };
+  }
+});
+
+/* script */
+const __vue_script__$1 = script$1;
+
+/* template */
+var __vue_render__$1 = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', {
+    class: _vm.rootStyles
+  }, [_c('OrNotification', _vm._b({
+    staticClass: "rounded-0 shadow-none",
+    on: {
+      "close": function ($event) {
+        return _vm.$emit('close-notification');
+      }
+    }
+  }, 'OrNotification', _vm.notification, false), [_vm.$slots['notification'] ? [_vm._t('notification')] : _vm._e()], 2)], 1);
+};
 var __vue_staticRenderFns__$1 = [];
 
 /* style */
@@ -1310,24 +1391,24 @@ var script = defineComponent({
   name: 'OrDataGrid',
   components: {
     OrCheckbox,
-    OrDataGridFooter: __vue_component__$t,
-    OrDataGridHeader: __vue_component__$r,
-    OrDataGridTable: __vue_component__$5,
-    OrDataGridTableContent: __vue_component__$l,
-    OrDataGridTableContentCell: __vue_component__$p,
-    OrDataGridTableContentRow: __vue_component__$n,
-    OrDataGridTableFooter: __vue_component__$f,
-    OrDataGridTableFooterCell: __vue_component__$j,
-    OrDataGridTableFooterRow: __vue_component__$h,
-    OrDataGridTableHeader: __vue_component__$9,
-    OrDataGridTableHeaderCell: __vue_component__$d,
-    OrDataGridTableHeaderRow: __vue_component__$b,
-    OrDataGridTablePlaceholder: __vue_component__$7,
-    OrDataGridToolbar: __vue_component__$3,
+    OrDataGridFooter: __vue_component__$v,
+    OrDataGridHeader: __vue_component__$t,
+    OrDataGridTable: __vue_component__$7,
+    OrDataGridTableContent: __vue_component__$n,
+    OrDataGridTableContentCell: __vue_component__$r,
+    OrDataGridTableContentRow: __vue_component__$p,
+    OrDataGridTableFooter: __vue_component__$h,
+    OrDataGridTableFooterCell: __vue_component__$l,
+    OrDataGridTableFooterRow: __vue_component__$j,
+    OrDataGridTableHeader: __vue_component__$b,
+    OrDataGridTableHeaderCell: __vue_component__$f,
+    OrDataGridTableHeaderRow: __vue_component__$d,
+    OrDataGridTablePlaceholder: __vue_component__$9,
+    OrDataGridToolbar: __vue_component__$5,
+    OrDataGridNotification: __vue_component__$3,
     OrPagination,
     OrSearch,
-    OrSkeletonText,
-    OrNotification
+    OrSkeletonText
   },
   model: {
     prop: 'modelValue',
@@ -1588,6 +1669,7 @@ var __vue_render__ = function () {
       "variant": _vm.variant
     }
   }, [_vm.features.selecting ? [_c('OrDataGridTableHeaderCell', {
+    staticClass: "!py-xs !px-xs md:!py-none md:!px-sm+",
     attrs: {
       "column": {
         stickiness: 'start'
@@ -1628,16 +1710,24 @@ var __vue_render__ = function () {
         expression: "sortingModel"
       }
     }, [_vm._v("\n          " + _vm._s(column.label) + "\n        ")]);
-  })], 2)], 1), _vm._v(" "), _vm.notification ? [_c('div', {
-    staticClass: "grid col-span-full"
-  }, [_c('OrNotification', _vm._b({
-    staticClass: "rounded-0",
+  })], 2)], 1), _vm._v(" "), _vm.notification ? _c('OrDataGridNotification', {
+    attrs: {
+      "notification": _vm.notification,
+      "variant": _vm.variant
+    },
     on: {
-      "close": function ($event) {
+      "close-notification": function ($event) {
         return _vm.$emit('close-notification');
       }
-    }
-  }, 'OrNotification', _vm.notification, false), [_vm.$slots['notification'] ? [_vm._t('notification')] : _vm._e()], 2)], 1)] : _vm._e(), _vm._v(" "), _c('OrDataGridTableContent', [_vm.loading ? _vm._l(10, function (n) {
+    },
+    scopedSlots: _vm._u([_vm.$slots['notification'] ? {
+      key: "notification",
+      fn: function () {
+        return [_vm._t('notification')];
+      },
+      proxy: true
+    } : null], null, true)
+  }) : _vm._e(), _vm._v(" "), _c('OrDataGridTableContent', [_vm.loading ? _vm._l(10, function (n) {
     return _c('OrDataGridTableContentRow', {
       key: n,
       attrs: {
@@ -1668,6 +1758,7 @@ var __vue_render__ = function () {
         "selected": _vm.selectingModel.includes(item.id)
       }
     }, [_vm.features.selecting ? [_c('OrDataGridTableContentCell', {
+      staticClass: "!py-xs !px-xs md:!py-none md:!px-sm+",
       attrs: {
         "column": {
           stickiness: 'start'
@@ -1723,7 +1814,7 @@ var __vue_render__ = function () {
     attrs: {
       "variant": _vm.variant
     }
-  }, [_vm._t('empty')], 2)] : _vm._e()], 2)], 2), _vm._v(" "), _vm.$slots['extra-row'] ? [_c('OrDataGridTableFooter', [_c('OrDataGridTableFooterRow', {
+  }, [_vm._t('empty')], 2)] : _vm._e()], 2)], 1), _vm._v(" "), _vm.$slots['extra-row'] ? [_c('OrDataGridTableFooter', [_c('OrDataGridTableFooterRow', {
     class: ['shrink-0'],
     attrs: {
       "variant": _vm.variant

package/dist/esm/components/or-data-grid-v3/partials/index.d.ts

@@ -12,3 +12,4 @@ export { default as OrDataGridTableHeader } from './or-data-grid-table-header/Or
 export { default as OrDataGridTablePlaceholder } from './or-data-grid-table-placeholder/OrDataGridTablePlaceholder.vue';
 export { default as OrDataGridTable } from './or-data-grid-table/OrDataGridTable.vue';
 export { default as OrDataGridToolbar } from './or-data-grid-toolbar/OrDataGridToolbar.vue';
+export { default as OrDataGridNotification } from './or-data-grid-notification/OrDataGridNotification.vue';

package/dist/esm/components/or-data-grid-v3/partials/or-data-grid-notification/OrDataGridNotification.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/esm/components/or-data-grid-v3/partials/or-data-grid-notification/styles.d.ts

@@ -0,0 +1,3 @@
+import { DataGridVariant } from '../../types';
+export declare const DataGridNotification: string[];
+export declare const DataGridNotificationPositionVariants: Record<DataGridVariant, string[]>;

package/dist/esm/components/or-form-group-v3/index.js

@@ -21,7 +21,7 @@ const FormGroup = [
 // Layout
 'layout-column',
 // Spacing
-'gap-md md:gap-sm'];
+'gap-sm'];
 const FormGroupContent = [];
 const FormGroupContentDirections = {
   [FormGroupDirection.Vertical]: [

package/dist/esm/components/or-input-v3/index.js

@@ -197,7 +197,7 @@ var script = defineComponent({
   }
 });
 
-var css_248z = "input[data-v-48913112]{min-width:0;background:0 0;outline:0}input[type=search][data-v-48913112]::-webkit-search-cancel-button{display:none}";
+var css_248z = "input[data-v-3d8fe668]{min-width:0;background:0 0;outline:0}input[type=search][data-v-3d8fe668]::-webkit-search-cancel-button{display:none}";
 styleInject(css_248z);
 
 /* script */
@@ -227,7 +227,7 @@ var __vue_render__ = function () {
   }, [_vm._t("label", function () {
     return [_vm._v("\n        " + _vm._s(_vm.label) + "\n      ")];
   })], 2)] : _vm._e(), _vm._v(" "), _c('div', {
-    staticClass: "layout-row gap-sm+ md:gap-sm"
+    staticClass: "layout-row gap-md md:gap-md"
   }, [_vm._t("prepend"), _vm._v(" "), _c('OrInputBox', {
     attrs: {
       "variant": _vm.variant,
@@ -258,6 +258,7 @@ var __vue_render__ = function () {
                 icon: _vm.disclosed ? 'visibility' : 'visibility_off',
                 variant: 'filled'
               },
+              "size": 'l',
               "color": 'inherit',
               "disabled": _vm.disabled
             },
@@ -271,6 +272,7 @@ var __vue_render__ = function () {
             attrs: {
               "icon": 'close',
               "color": 'inherit',
+              "size": 'l',
               "disabled": _vm.disabled
             },
             on: {
@@ -282,6 +284,7 @@ var __vue_render__ = function () {
           })] : [_c('OrIcon', {
             attrs: {
               "icon": 'search',
+              "size": 'l',
               "variant": 'outlined'
             }
           })]] : _vm._e()]];
@@ -381,7 +384,7 @@ var __vue_staticRenderFns__ = [];
 /* style */
 const __vue_inject_styles__ = undefined;
 /* scoped */
-const __vue_scope_id__ = "data-v-48913112";
+const __vue_scope_id__ = "data-v-3d8fe668";
 /* module identifier */
 const __vue_module_identifier__ = undefined;
 /* functional template */

package/dist/esm/components/or-radio-group-v3/index.js

@@ -1,6 +1,6 @@
-import { defineComponent, toRef } from 'vue-demi';
-import { a as re } from '../../useValidationAttributes-w0RCHARs-21132c84.js';
-import { OrFormGroupV3 as OrFormGroup, FormGroupDirection } from '../or-form-group-v3/index.js';
+import { defineComponent, toRef, computed } from 'vue-demi';
+import { a as re, n as ne } from '../../useValidationAttributes-w0RCHARs-21132c84.js';
+import { OrFormGroupV3 as OrFormGroup, FormGroupDirection, FormGroupSpacing } from '../or-form-group-v3/index.js';
 import { OrRadioV3 as OrRadio } from '../or-radio-v3/index.js';
 import { n as normalizeComponent } from '../../normalize-component-cf2db48b.js';
 import '../../dom-DzNS5tBj-6d9cf0ef.js';
@@ -56,14 +56,23 @@ var script = defineComponent({
     readonly: {
       type: Boolean,
       default: false
+    },
+    spacing: {
+      type: String,
+      default: FormGroupSpacing.SM
     }
   },
   emits: ['update:modelValue'],
   setup(props, context) {
     // State
     const proxyModelValue = re(toRef(props, 'modelValue'), context.emit);
+    const {
+      isMobile
+    } = ne();
+    const localSpacing = computed(() => isMobile.value ? FormGroupSpacing.NONE : props.spacing);
     return {
-      proxyModelValue
+      proxyModelValue,
+      localSpacing
     };
   }
 });
@@ -82,7 +91,8 @@ var __vue_render__ = function () {
       "label": _vm.label,
       "hint": _vm.hint,
       "error": _vm.error,
-      "disabled": _vm.disabled
+      "disabled": _vm.disabled,
+      "spacing": _vm.localSpacing
     },
     scopedSlots: _vm._u([{
       key: "addon",

package/dist/esm/components/or-select-v3/index.js

@@ -671,11 +671,20 @@ const SelectDropdownItem = [
 // Typography
 '!typography-body-2-regular',
 // Padding Override todo: check design
-'!py-md md:!pt-[6px] md:!pb-[7px]',
+'md:!pt-[6px] md:!pb-[7px]',
 // Typography (selected)
 'selected:!typography-body-2-semibold',
 // Theme
 '!theme-foreground-default dark:!theme-foreground-default-dark'];
+const SelectDropdownItemPaddingSingle = [
+// Padding Override
+'!py-md md:!pt-[6px] md:!pb-[7px]'];
+const SelectDropdownItemPaddingMultiple = [
+// Padding Override
+'md:!pt-[6px] md:!pb-[7px]'];
+const SelectDropdownItemPaddingMultipleMobile = [
+// Padding Override
+'px-md'];
 const SelectNoSearchResults = [
 // Layout
 'layout-row justify-center',
@@ -898,7 +907,7 @@ var script = defineComponent({
       return ['or-select-popover-v3', ...SelectDropdown, ...(((_a = popover.value) === null || _a === void 0 ? void 0 : _a.isFlipped) ? SelectDropdownFlipped : SelectDropdownDefault)];
     });
     const dropdownContainerStyles = computed(() => [isMobile.value ? 'layout-column' : 'contains', bottomSheetFullscreen.value ? 'overflow-y-auto' : 'overflow-hidden']);
-    const dropdownItemStyles = computed(() => [...SelectDropdownItem]);
+    const dropdownItemStyles = computed(() => [...SelectDropdownItem, ...(props.multiple ? SelectDropdownItemPaddingMultiple : SelectDropdownItemPaddingSingle), ...(isMobile.value ? SelectDropdownItemPaddingMultipleMobile : [])]);
     const noSearchResultsStyles = computed(() => [...SelectNoSearchResults]);
     const loaderStyles = computed(() => [...SelectLoader]);
     // Methods

package/dist/esm/components/or-select-v3/styles.d.ts

@@ -5,5 +5,8 @@ export declare const SelectDropdown: string[];
 export declare const SelectDropdownDefault: string[];
 export declare const SelectDropdownFlipped: string[];
 export declare const SelectDropdownItem: string[];
+export declare const SelectDropdownItemPaddingSingle: string[];
+export declare const SelectDropdownItemPaddingMultiple: string[];
+export declare const SelectDropdownItemPaddingMultipleMobile: string[];
 export declare const SelectNoSearchResults: string[];
 export declare const SelectLoader: string[];

package/dist/esm/components/or-tag-input-v3/index.js

@@ -212,6 +212,7 @@ var script = defineComponent({
       if (maxLength.value && currentLength.value >= maxLength.value) return;
       proxyModelValue.value = $s(newItem, (_b = proxyModelValue.value) !== null && _b !== void 0 ? _b : []);
       draftModelValue.value = '';
+      nextTick(() => focus());
     }
     function remove(value) {
       var _a;
@@ -234,7 +235,8 @@ var script = defineComponent({
     });
     watch(proxyModelValue, (items, prevItems) => {
       var _a;
-      if ((items === null || items === void 0 ? void 0 : items.length) !== (prevItems === null || prevItems === void 0 ? void 0 : prevItems.length) && overflow.value === TagsOverflow.Scroll) {
+      if (overflow.value !== TagsOverflow.Scroll) return;
+      if ((items === null || items === void 0 ? void 0 : items.length) !== (prevItems === null || prevItems === void 0 ? void 0 : prevItems.length)) {
         ((_a = tags.value) === null || _a === void 0 ? void 0 : _a.scrollToEnd)();
       }
     });
@@ -270,7 +272,7 @@ var script = defineComponent({
   }
 });
 
-var css_248z = "input[data-v-1c67f075]{min-width:0;background:0 0;outline:0}";
+var css_248z = "input[data-v-1dce37a5]{min-width:0;background:0 0;outline:0}";
 styleInject(css_248z);
 
 /* script */
@@ -480,7 +482,7 @@ var __vue_staticRenderFns__ = [];
 /* style */
 const __vue_inject_styles__ = undefined;
 /* scoped */
-const __vue_scope_id__ = "data-v-1c67f075";
+const __vue_scope_id__ = "data-v-1dce37a5";
 /* module identifier */
 const __vue_module_identifier__ = undefined;
 /* functional template */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/ui-components-vue2",
-  "version": "20.3.0-beta.5253.0",
+  "version": "20.3.1",
   "description": "Vue components library for v2",
   "sideEffects": false,
   "exports": {
@@ -39,8 +39,8 @@
     "@codemirror/view": "^6",
     "@floating-ui/dom": "1.5.3",
     "@lezer/highlight": "*",
-    "@onereach/styles": "^20.2.0",
-    "@onereach/ui-components-common": "^20.2.0",
+    "@onereach/styles": "^20.3.1",
+    "@onereach/ui-components-common": "^20.3.1",
     "@splidejs/splide": "4.0.6",
     "@tiptap/core": "2.0.3",
     "@tiptap/extension-blockquote": "2.0.3",
@@ -103,5 +103,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "npmUnpacked": "4.15.2"
+  "npmUnpacked": "4.15.2",
+  "gitHead": "ede500b09e1eaac359f8dc812db0f1cf7a4deeb1"
 }