@onereach/ui-components 4.10.3 → 4.10.4-beta.2951.0

package/dist/bundled/v3/{OrSelect.vue_vue_type_script_lang-72c1db17.js → OrSelect.vue_vue_type_script_lang-32204da4.js}

@@ -1,10 +1,10 @@
-import { defineComponent, getCurrentInstance, ref, computed, onMounted, watch } from 'vue-demi';
+import { defineComponent, getCurrentInstance, ref, computed, toRef, onMounted, watch } from 'vue-demi';
 import { isEmptyValue } from './utils/isEmptyValue.js';
 import { SelectRoot, SelectControl, SelectPlaceholder, SelectDropdown, SelectDropdownFlipped, SelectDropdownDefault, SelectNoSearchResults } from './components/OrSelectV3/styles.js';
 import './components/OrCheckboxV3/OrCheckbox.js';
 import './components/OrErrorV3/OrError.js';
 import './components/OrExpansionPanelV3/OrExpansionPanel.js';
-import { s as script$3 } from './OrExpansionPanel.vue_vue_type_script_lang-ca9d5307.js';
+import { s as script$3 } from './OrExpansionPanel.vue_vue_type_script_lang-a9c8fa90.js';
 import './components/OrHintV3/OrHint.js';
 import './components/OrIconV3/OrIcon.js';
 import './components/OrInputV3/OrInput.js';
@@ -13,20 +13,21 @@ import './components/OrLabelV3/OrLabel.js';
 import './components/OrMenuItemV3/OrMenuItem.js';
 import './components/OrPopoverV3/OrPopover.js';
 import './components/OrTagV3/OrTag.js';
-import { s as script$b } from './OrTag.vue_vue_type_script_lang-c7065625.js';
+import { s as script$b } from './OrTag.vue_vue_type_script_lang-91de474e.js';
 import { useOverflow } from './hooks/useOverflow.js';
-import { s as script$1 } from './OrCheckbox.vue_vue_type_script_lang-616a0cce.js';
+import { s as script$1 } from './OrCheckbox.vue_vue_type_script_lang-a27167e0.js';
 import { s as script$2 } from './OrError.vue_vue_type_script_lang-df7b5e32.js';
 import { s as script$4 } from './OrHint.vue_vue_type_script_lang-0f5e8377.js';
 import { s as script$5 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$6 } from './OrInput.vue_vue_type_script_lang-66363c62.js';
+import { s as script$6 } from './OrInput.vue_vue_type_script_lang-ddf4b298.js';
 import { s as script$7 } from './OrInputBox.vue_vue_type_script_lang-49fb179a.js';
 import { s as script$8 } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
 import { s as script$9 } from './OrMenuItem.vue_vue_type_script_lang-b338d68a.js';
-import { s as script$a } from './OrPopover.vue_vue_type_script_lang-506ae7bb.js';
+import { s as script$a } from './OrPopover.vue_vue_type_script_lang-e5fbad34.js';
 import { DropdownClose } from './directives/dropdown-close.js';
 import { DropdownOpen } from './directives/dropdown-open.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrSelect',
@@ -157,12 +158,7 @@ var script = defineComponent({
     const noSearchResultsStyles = computed(() => [...SelectNoSearchResults]);
     // State
     const controlId = ref((_a = context.attrs.id) !== null && _a !== void 0 ? _a : currentInstance.uid.toString());
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const isEmptyModelValue = computed(() => {
       return Array.isArray(proxyModelValue.value) ? proxyModelValue.value.length === 0 : isEmptyValue(proxyModelValue.value);
     });

package/dist/bundled/v3/{OrSelect.vue_vue_type_script_lang-45cf8f8c.js → OrSelect.vue_vue_type_script_lang-706a006e.js}

@@ -1,26 +1,26 @@
 import { defineComponent, ref } from 'vue-demi';
-import { o as onClickOutside } from './index-09d1cb24.js';
+import { o as onClickOutside } from './index-a006f3a7.js';
 import { isEmpty } from './utils/isEmpty.js';
-import { _ as _baseAssignValue } from './_baseAssignValue-0c6c3bcc.js';
-import { k as keys_1, _ as _Stack, a as _baseIsEqual, i as isArguments_1 } from './_baseIsEqual-82d7a339.js';
-import { i as isArrayLike_1, _ as _isIndex, a as isLength_1 } from './isArrayLike-acf249e3.js';
-import { i as isObject_1 } from './isObject-3a5b854d.js';
-import { _ as _castPath, a as _toKey, g as get_1, b as _isKey, c as _baseGet } from './get-73ac2f59.js';
-import { i as isArray_1 } from './toString-47fa81b4.js';
+import { _ as _baseAssignValue } from './_baseAssignValue-22e630c1.js';
+import { k as keys_1, _ as _Stack, a as _baseIsEqual, i as isArguments_1 } from './_baseIsEqual-a1cc156c.js';
+import { i as isArrayLike_1, _ as _isIndex, a as isLength_1 } from './isArrayLike-e46b8eac.js';
+import { i as isObject_1 } from './isObject-fe8b81fd.js';
+import { _ as _castPath, a as _toKey, g as get_1, b as _isKey, c as _baseGet } from './get-ab1b7d93.js';
+import { i as isArray_1 } from './toString-f3196832.js';
 import { _ as _baseProperty } from './_baseProperty-a52739e9.js';
 import { OR_SELECT_VALUE_PROP, OR_SELECT_SEARCH_OPTIONS_PROP, OR_SELECT_OPTIONS_PROP, OR_SELECT_PLACEHOLDER_PROP, DEFAULT_TEXT, OR_SELECT_NO_RESULTS_TITLE_PROP, OR_SELECT_NO_RESULTS_START_TEXT_PROP, OR_SELECT_NO_RESULTS_END_TEXT_PROP, OR_SELECT_UPDATE_SEARCH_TEXT_PROP, COMMON_STRING_PROP, SEARCH_OPTIONS_FUNCTION_PROP } from './components/OrSelect/constants.js';
 import './components/OrChip/OrChip.js';
-import { s as script$9 } from './OrChip.vue_vue_type_script_lang-d0c62419.js';
+import { s as script$9 } from './OrChip.vue_vue_type_script_lang-a182e324.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, toDisplayString, createCommentVNode, Fragment, renderList, createBlock, createElementVNode, renderSlot, createVNode, createTextVNode, withCtx, normalizeProps, guardReactiveProps } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 import './components/OrIcon/OrIcon.js';
-import { s as script$a } from './OrIcon.vue_vue_type_script_lang-b77bb268.js';
+import { s as script$a } from './OrIcon.vue_vue_type_script_lang-cd2da378.js';
 import './components/OrCheckbox/OrCheckbox.js';
-import { s as script$b } from './OrCheckbox.vue_vue_type_script_lang-dedfe767.js';
+import { s as script$b } from './OrCheckbox.vue_vue_type_script_lang-b1dd62bd.js';
 import './components/OrLoader/OrLoader.js';
 import { s as script$c } from './OrLoader.vue_vue_type_script_lang-a1fed697.js';
 import './components/OrFloating/OrFloating.js';
-import { s as script$d } from './OrFloating.vue_vue_type_script_lang-d762f4b0.js';
+import { s as script$d } from './OrFloating.vue_vue_type_script_lang-d419627c.js';
 import './components/OrLabel/OrLabel.js';
 import './components/OrError/OrError.js';
 import { s as script$e } from './OrLabel.vue_vue_type_script_lang-6243e348.js';

package/dist/bundled/v3/{OrSidebar.vue_vue_type_script_lang-3d9676ea.js → OrSidebar.vue_vue_type_script_lang-4d9df538.js}

@@ -1,8 +1,8 @@
-import { e as useDraggable, d as useElementBounding } from './index-09d1cb24.js';
+import { e as useDraggable, d as useElementBounding } from './index-a006f3a7.js';
 import { defineComponent, ref, computed, useSlots, watch } from 'vue-demi';
 import { OrSidebarPlacement } from './components/OrSidebarV3/props.js';
 import './components/OrIconButtonV3/OrIconButton.js';
-import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-adfc7e75.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode } from 'vue';
 import { SidebarRoot, SidebarBar, SidebarSides, SidebarToolbar, CollapsibleSidebarToolbar, SidebarToolbarSides, SidebarResize, SidebarResizeSides, SidebarResizingSides, SidebarCollapseButton, SidebarCollapseButtonSides, SidebarMain, SidebarHeader, SidebarContent, SidebarFooter } from './components/OrSidebarV3/styles.js';
 

package/dist/bundled/v3/{OrSidebar.vue_vue_type_script_lang-56608f4a.js → OrSidebar.vue_vue_type_script_lang-c64ea08c.js}

@@ -1,4 +1,4 @@
-import { e as useDraggable } from './index-09d1cb24.js';
+import { e as useDraggable } from './index-a006f3a7.js';
 import { defineComponent, ref } from 'vue-demi';
 import { OrSidebarSide } from './components/OrSidebar/constants.js';
 

package/dist/bundled/v3/{OrSkeletonText.vue_vue_type_script_lang-6703fb3a.js → OrSkeletonText.vue_vue_type_script_lang-26b3cfd1.js}

@@ -1,4 +1,4 @@
-import { r as range_1 } from './range-c87289f7.js';
+import { r as range_1 } from './range-6f26eda4.js';
 import { defineComponent, ref, computed } from 'vue-demi';
 import { pxToRem } from './utils/functions/px-to-rem.js';
 import { SkeletonTextContainerRoot, SkeletonRoot, SkeletonText, SkeletonAnimated } from './components/OrSkeletonV3/styles.js';

package/dist/bundled/v3/{OrSkeletonText.vue_vue_type_script_lang-e068a58a.js → OrSkeletonText.vue_vue_type_script_lang-c2a5ab96.js}

@@ -1,5 +1,5 @@
 import { defineComponent } from 'vue-demi';
-import { r as range_1 } from './range-c87289f7.js';
+import { r as range_1 } from './range-6f26eda4.js';
 import { OrSkeletonTextSizes } from './components/OrSkeleton/constants.js';
 import { pxToRem } from './utils/functions/px-to-rem.js';
 

package/dist/bundled/v3/{OrSlider.vue_vue_type_script_lang-2a698707.js → OrSlider.vue_vue_type_script_lang-c9f65bb7.js}

@@ -1,8 +1,8 @@
 import { defineComponent, ref } from 'vue-demi';
-import { o as onClickOutside, e as useDraggable } from './index-09d1cb24.js';
-import { b as addClass, d as removeClass } from './dom-571739a2.js';
+import { o as onClickOutside, e as useDraggable } from './index-a006f3a7.js';
+import { b as addClass, d as removeClass } from './dom-700444b4.js';
 import './components/OrIcon/OrIcon.js';
-import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-b77bb268.js';
+import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-cd2da378.js';
 
 var script = defineComponent({
   name: 'OrSlider',

package/dist/bundled/v3/{OrSortHeader.vue_vue_type_script_lang-424696e5.js → OrSortHeader.vue_vue_type_script_lang-a444d88b.js}

@@ -1,7 +1,8 @@
-import { defineComponent, ref, computed } from 'vue-demi';
+import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { SortHeaderRoot } from './components/OrSortHeaderV3/styles.js';
 import './components/OrIconV3/OrIcon.js';
 import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrSortHeader',
@@ -30,12 +31,7 @@ var script = defineComponent({
     // Styles
     const rootStyles = computed(() => ['or-sort-header-v3', ...SortHeaderRoot]);
     // State
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const activated = computed(() => {
       var _a;
       return ((_a = proxyModelValue.value) === null || _a === void 0 ? void 0 : _a.column) === props.value;

package/dist/bundled/v3/{OrStepper.vue_vue_type_script_lang-999e65f6.js → OrStepper.vue_vue_type_script_lang-67408a1a.js}

@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue-demi';
 import './components/OrButtonV2/OrButton.js';
-import { s as script$6 } from './OrButton.vue_vue_type_script_lang-5b8437d7.js';
+import { s as script$6 } from './OrButton.vue_vue_type_script_lang-5ae410e5.js';
 import { resolveComponent, openBlock, createElementBlock, renderSlot, createBlock, createCommentVNode, normalizeClass, createElementVNode, toDisplayString, createVNode, withCtx, normalizeProps, guardReactiveProps } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 

package/dist/bundled/v3/{OrSwitch.vue_vue_type_script_lang-5a6d0202.js → OrSwitch.vue_vue_type_script_lang-f02f131d.js}

@@ -1,12 +1,13 @@
-import { defineComponent, ref, computed, reactive } from 'vue-demi';
+import { defineComponent, ref, computed, reactive, toRef } from 'vue-demi';
 import { SwitchRoot, SwitchControl, SwitchControlHandle, SwitchLoader, SwitchLoaderHandle } from './components/OrSwitchV3/styles.js';
 import './components/OrLabelV3/OrLabel.js';
 import './components/OrLoaderV3/OrLoader.js';
-import { useIdAttribute } from './hooks/useIdAttribute.js';
-import { useControlAttributes } from './hooks/useControlAttributes.js';
 import { s as script$1 } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
-import { s as script$2 } from './OrLoader.vue_vue_type_script_lang-f076f6b3.js';
+import { s as script$2 } from './OrLoader.vue_vue_type_script_lang-c8616f7b.js';
 import { LabelVariant } from './components/OrLabelV3/props.js';
+import { useIdAttribute } from './hooks/useIdAttribute.js';
+import { useControlAttributes } from './hooks/useControlAttributes.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrSwitch',
@@ -63,12 +64,7 @@ var script = defineComponent({
       id: useIdAttribute(),
       ...useControlAttributes()
     });
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     // Methods
     function focus() {
       var _a;

package/dist/bundled/v3/{OrTabs.vue_vue_type_script_lang-2d08458d.js → OrTabs.vue_vue_type_script_lang-de7342a6.js}

@@ -1,5 +1,5 @@
-import { f as useResizeObserver } from './index-09d1cb24.js';
-import { defineComponent, ref, computed, reactive, watch, nextTick, onMounted } from 'vue-demi';
+import { f as useResizeObserver } from './index-a006f3a7.js';
+import { defineComponent, ref, computed, reactive, toRef, watch, nextTick, onMounted } from 'vue-demi';
 import { TabsVariant } from './components/OrTabsV3/props.js';
 import { TabsRoot, TabsRootVariants, TabsContainer } from './components/OrTabsV3/styles.js';
 import './components/OrIconV3/OrIcon.js';
@@ -8,8 +8,9 @@ import './components/OrMenuItemV3/OrMenuItem.js';
 import './components/OrTabV3/OrTab.js';
 import { s as script$4 } from './OrTab.vue_vue_type_script_lang-79f2f523.js';
 import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$2 } from './OrMenu.vue_vue_type_script_lang-8fa5ef6c.js';
+import { s as script$2 } from './OrMenu.vue_vue_type_script_lang-640b91e4.js';
 import { s as script$3 } from './OrMenuItem.vue_vue_type_script_lang-b338d68a.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrTabs',
@@ -61,12 +62,7 @@ var script = defineComponent({
       normal: [],
       hidden: []
     });
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const activeTab = computed(() => props.items.find(_ref => {
       let {
         value

package/dist/bundled/v3/{OrTag.vue_vue_type_script_lang-c7065625.js → OrTag.vue_vue_type_script_lang-91de474e.js}

@@ -2,7 +2,7 @@ import { defineComponent, ref, computed, watchPostEffect, unref } from 'vue-demi
 import { TagVariant, TagColor } from './components/OrTagV3/props.js';
 import { TagRoot, TagRootVariants, TagRootColors } from './components/OrTagV3/styles.js';
 import './components/OrIconButtonV3/OrIconButton.js';
-import { s as script$1 } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$1 } from './OrIconButton.vue_vue_type_script_lang-adfc7e75.js';
 
 var script = defineComponent({
   name: 'OrTag',

package/dist/bundled/v3/{OrTag.vue_vue_type_script_lang-42a69c16.js → OrTag.vue_vue_type_script_lang-cbb4a16d.js}

@@ -1,7 +1,7 @@
 import { defineComponent } from 'vue-demi';
 import { hexToRgb } from './utils/functions/color.js';
 import './components/OrIcon/OrIcon.js';
-import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-b77bb268.js';
+import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-cd2da378.js';
 
 const TAG_DEFAULT_COLOR = '#91969d'; // neutral-4
 var script = defineComponent({

package/dist/bundled/v3/{OrTagInput.vue_vue_type_script_lang-60f6d6de.js → OrTagInput.vue_vue_type_script_lang-95ca0015.js}

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, reactive } from 'vue-demi';
+import { defineComponent, ref, computed, reactive, toRef } from 'vue-demi';
 import { TagInput, TagInputControl, TagInputItem } from './components/OrTagInputV3/styles.js';
 import './components/OrErrorV3/OrError.js';
 import './components/OrHintV3/OrHint.js';
@@ -6,16 +6,17 @@ import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrInputBoxV3/OrInputBox.js';
 import './components/OrLabelV3/OrLabel.js';
 import './components/OrTagsV3/OrTags.js';
-import { s as script$6 } from './OrTags.vue_vue_type_script_lang-45bbc68e.js';
-import { useIdAttribute } from './hooks/useIdAttribute.js';
-import { useControlAttributes } from './hooks/useControlAttributes.js';
-import { useValidationAttributes } from './hooks/useValidationAttributes.js';
+import { s as script$6 } from './OrTags.vue_vue_type_script_lang-36acce13.js';
 import { s as script$1 } from './OrError.vue_vue_type_script_lang-df7b5e32.js';
 import { s as script$2 } from './OrHint.vue_vue_type_script_lang-0f5e8377.js';
-import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-adfc7e75.js';
 import { s as script$4 } from './OrInputBox.vue_vue_type_script_lang-49fb179a.js';
 import { s as script$5 } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';
+import { useIdAttribute } from './hooks/useIdAttribute.js';
+import { useControlAttributes } from './hooks/useControlAttributes.js';
+import { useValidationAttributes } from './hooks/useValidationAttributes.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrTagInput',
@@ -89,12 +90,7 @@ var script = defineComponent({
       ...useControlAttributes(),
       ...useValidationAttributes()
     });
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const draftModelValue = ref();
     const currentLength = computed(() => {
       var _a, _b;

package/dist/bundled/v3/{OrTags.vue_vue_type_script_lang-45bbc68e.js → OrTags.vue_vue_type_script_lang-36acce13.js}

@@ -3,10 +3,10 @@ import { Tags, TagsContainer, TagsOverflowButton, TagsOverflowPopover } from './
 import './components/OrButtonV3/OrButton.js';
 import './components/OrPopoverV3/OrPopover.js';
 import './components/OrTagV3/OrTag.js';
+import { s as script$1 } from './OrButton.vue_vue_type_script_lang-479320a5.js';
+import { s as script$2 } from './OrPopover.vue_vue_type_script_lang-e5fbad34.js';
+import { s as script$3 } from './OrTag.vue_vue_type_script_lang-91de474e.js';
 import { useOverflow } from './hooks/useOverflow.js';
-import { s as script$1 } from './OrButton.vue_vue_type_script_lang-e8969bd3.js';
-import { s as script$2 } from './OrPopover.vue_vue_type_script_lang-506ae7bb.js';
-import { s as script$3 } from './OrTag.vue_vue_type_script_lang-c7065625.js';
 
 var script = defineComponent({
   name: 'OrTags',

package/dist/bundled/v3/{OrTextarea.vue_vue_type_script_lang-af7cab22.js → OrTextarea.vue_vue_type_script_lang-1ab55f91.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, getCurrentInstance } from 'vue-demi';
 import { pxToRem } from './utils/functions/px-to-rem.js';
-import { s as setStyle, r as requestAF, g as getCS, a as reflow, c as cancelAF } from './dom-571739a2.js';
+import { s as setStyle, r as requestAF, g as getCS, a as reflow, c as cancelAF } from './dom-700444b4.js';
 import './components/OrLabel/OrLabel.js';
 import './components/OrHint/OrHint.js';
 import './components/OrError/OrError.js';
@@ -8,7 +8,7 @@ import './components/OrCollapse/OrCollapse.js';
 import { s as script$1 } from './OrLabel.vue_vue_type_script_lang-6243e348.js';
 import { s as script$2 } from './OrHint.vue_vue_type_script_lang-5eb3ee22.js';
 import { s as script$3 } from './OrError.vue_vue_type_script_lang-450321b8.js';
-import { s as script$4 } from './OrCollapse.vue_vue_type_script_lang-e2dcce92.js';
+import { s as script$4 } from './OrCollapse.vue_vue_type_script_lang-2a5c0929.js';
 
 var script = defineComponent({
   name: 'OrTextarea',

package/dist/bundled/v3/{OrTextarea.vue_vue_type_script_lang-0d1a7a48.js → OrTextarea.vue_vue_type_script_lang-44484741.js}

@@ -1,17 +1,18 @@
-import { defineComponent, ref, computed, reactive } from 'vue-demi';
+import { defineComponent, ref, computed, reactive, toRef } from 'vue-demi';
 import { TextareaRoot, TextareaControl } from './components/OrTextareaV3/styles.js';
 import './components/OrErrorV3/OrError.js';
 import './components/OrHintV3/OrHint.js';
 import './components/OrInputBoxV3/OrInputBox.js';
 import './components/OrLabelV3/OrLabel.js';
-import { useIdAttribute } from './hooks/useIdAttribute.js';
-import { useControlAttributes } from './hooks/useControlAttributes.js';
-import { useValidationAttributes } from './hooks/useValidationAttributes.js';
 import { s as script$1 } from './OrError.vue_vue_type_script_lang-df7b5e32.js';
 import { s as script$2 } from './OrHint.vue_vue_type_script_lang-0f5e8377.js';
 import { s as script$3 } from './OrInputBox.vue_vue_type_script_lang-49fb179a.js';
 import { s as script$4 } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';
+import { useIdAttribute } from './hooks/useIdAttribute.js';
+import { useControlAttributes } from './hooks/useControlAttributes.js';
+import { useValidationAttributes } from './hooks/useValidationAttributes.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrTextarea',
@@ -78,12 +79,7 @@ var script = defineComponent({
       ...useControlAttributes(),
       ...useValidationAttributes()
     });
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const currentLength = computed(() => {
       var _a, _b;
       return (_b = (_a = proxyModelValue.value) === null || _a === void 0 ? void 0 : _a.toString().length) !== null && _b !== void 0 ? _b : 0;

package/dist/bundled/v3/{OrTextbox.vue_vue_type_script_lang-80e42d58.js → OrTextbox.vue_vue_type_script_lang-1ec469f0.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed, getCurrentInstance } from 'vue-demi';
 import { pxToRem } from './utils/functions/px-to-rem.js';
-import { s as setStyle, r as requestAF, g as getCS, a as reflow, c as cancelAF } from './dom-571739a2.js';
+import { s as setStyle, r as requestAF, g as getCS, a as reflow, c as cancelAF } from './dom-700444b4.js';
 import { TextboxTypes } from './components/OrTextbox/constants.js';
 import './components/OrLabel/OrLabel.js';
 import './components/OrIconButtonV2/OrIconButton.js';
@@ -9,10 +9,10 @@ import './components/OrError/OrError.js';
 import './components/OrCollapse/OrCollapse.js';
 import useToggle from './hooks/useToggle.js';
 import { s as script$1 } from './OrLabel.vue_vue_type_script_lang-6243e348.js';
-import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-e078ed4c.js';
+import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-d1496a81.js';
 import { s as script$3 } from './OrHint.vue_vue_type_script_lang-5eb3ee22.js';
 import { s as script$4 } from './OrError.vue_vue_type_script_lang-450321b8.js';
-import { s as script$5 } from './OrCollapse.vue_vue_type_script_lang-e2dcce92.js';
+import { s as script$5 } from './OrCollapse.vue_vue_type_script_lang-2a5c0929.js';
 
 var script = defineComponent({
   name: 'OrTextbox',

package/dist/bundled/v3/{OrTimePicker.vue_vue_type_script_lang-a300ab1b.js → OrTimePicker.vue_vue_type_script_lang-c81a7ead.js}

@@ -1,7 +1,7 @@
-import { defineComponent, ref, computed, watch } from 'vue-demi';
+import { defineComponent, ref, computed, toRef, watch } from 'vue-demi';
 import { useCurrentDate } from './components/OrDateTimePickerV3/hooks/useCurrentDate.js';
-import { s as script$1, a as script$2, b as script$3 } from './OrDateTimePickerPopoverHeader-ec90761f.js';
-import { s as script$4, a as script$5 } from './OrDateTimePickerTimeSelect-683ab20d.js';
+import { s as script$1, a as script$2, b as script$3 } from './OrDateTimePickerPopoverHeader-3a30e516.js';
+import { s as script$4, a as script$5 } from './OrDateTimePickerTimeSelect-b2183a90.js';
 import { TimePicker, TimePickerPopover } from './components/OrTimePickerV3/styles.js';
 import './components/OrErrorV3/OrError.js';
 import './components/OrHintV3/OrHint.js';
@@ -14,13 +14,14 @@ import { DateTimePickerTimeFormat } from './components/OrDateTimePickerV3/props.
 import { s as script$6 } from './OrError.vue_vue_type_script_lang-df7b5e32.js';
 import { s as script$7 } from './OrHint.vue_vue_type_script_lang-0f5e8377.js';
 import { s as script$8 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$9 } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$9 } from './OrIconButton.vue_vue_type_script_lang-adfc7e75.js';
 import { s as script$a } from './OrInputBox.vue_vue_type_script_lang-49fb179a.js';
 import { s as script$b } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
-import { s as script$c } from './OrPopover.vue_vue_type_script_lang-506ae7bb.js';
+import { s as script$c } from './OrPopover.vue_vue_type_script_lang-e5fbad34.js';
 import { DropdownClose } from './directives/dropdown-close.js';
 import { DropdownOpen } from './directives/dropdown-open.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrDateTimePicker',
@@ -116,17 +117,10 @@ var script = defineComponent({
     const popoverStyles = computed(() => [...TimePickerPopover]);
     // State
     const initialModelValue = useCurrentDate();
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
-    const draftModelValue = ref();
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
+    const draftModelValue = ref(proxyModelValue.value);
     watch(proxyModelValue, value => {
       draftModelValue.value = value;
-    }, {
-      immediate: true
     });
     const isInvalidDraftModelValue = computed(() => {
       if (draftModelValue.value) {

package/dist/bundled/v3/{OrToastContainer.vue_vue_type_script_lang-d1a074fe.js → OrToastContainer.vue_vue_type_script_lang-3d3a3505.js}

@@ -5,9 +5,9 @@ import script$2 from './components/OrToastV3/OrToast.js';
 import { P as PositionsX, a as PositionsY, T as TransitionType } from './props-7be029c7.js';
 import { ToastContainer, ToastContainerPositions } from './components/OrToastV3/styles.js';
 import './components/OrTeleportV3/OrTeleport.js';
-import { useElevation } from './hooks/useElevation.js';
 import { s as script$1 } from './OrTeleport.vue3.vue_vue_type_script_lang-a6ce162e.js';
-import { u as useToggle } from './index-f4d8e24c.js';
+import { u as useToggle } from './index-5e8e7a46.js';
+import { useElevation } from './hooks/useElevation.js';
 
 var script = defineComponent({
   name: 'OrToastContainer',

package/dist/bundled/v3/{OrToastContainer.vue_vue_type_script_lang-c47d63be.js → OrToastContainer.vue_vue_type_script_lang-bf2fffd4.js}

@@ -4,7 +4,7 @@ import { defineComponent, nextTick } from 'vue-demi';
 import useQueue from './components/OrToast/composable/useQueue.js';
 import useToastEventBus from './components/OrToast/composable/useToastEventBus.js';
 import { PositionsX, PositionsY, TransitionType } from './components/OrToast/constants.js';
-import { u as useToggle } from './index-f4d8e24c.js';
+import { u as useToggle } from './index-5e8e7a46.js';
 
 var script = defineComponent({
   name: 'OrToastContainer',

package/dist/bundled/v3/{OrTooltip.vue_vue_type_script_lang-227592d8.js → OrTooltip.vue_vue_type_script_lang-63aaac7e.js}

@@ -1,7 +1,7 @@
 import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { TooltipRoot, TooltipBody, TooltipBodyPlacements } from './components/OrTooltipV3/styles.js';
 import './components/OrPopoverV3/OrPopover.js';
-import { s as script$1 } from './OrPopover.vue_vue_type_script_lang-506ae7bb.js';
+import { s as script$1 } from './OrPopover.vue_vue_type_script_lang-e5fbad34.js';
 import { PopoverPlacement } from './components/OrPopoverV3/props.js';
 import { usePopoverState } from './hooks/usePopoverState.js';
 
@@ -38,7 +38,7 @@ var script = defineComponent({
       open,
       close,
       toggle
-    } = usePopoverState(toRef(props, 'isOpen'), context, {
+    } = usePopoverState(toRef(props, 'isOpen'), context.emit, {
       debounce: 250
     });
     return {

package/dist/bundled/v3/{OrTooltip.vue_vue_type_script_lang-3bf79d56.js → OrTooltip.vue_vue_type_script_lang-a06d73f0.js}

@@ -2,7 +2,7 @@ import { defineComponent, ref } from 'vue-demi';
 import './components/OrTooltipContent/OrTooltipContent.js';
 import { s as script$1 } from './OrTooltipContent.vue_vue_type_script_lang-4c1afacb.js';
 import './components/OrFloating/OrFloating.js';
-import { s as script$2 } from './OrFloating.vue_vue_type_script_lang-d762f4b0.js';
+import { s as script$2 } from './OrFloating.vue_vue_type_script_lang-d419627c.js';
 import { OrFloatingPlacements } from './components/OrFloating/constants.js';
 
 /**

package/dist/bundled/{v2/_baseAssignValue-0c6c3bcc.js → v3/_baseAssignValue-22e630c1.js}

@@ -1,4 +1,4 @@
-import { i as _getNative } from './get-73ac2f59.js';
+import { i as _getNative } from './get-ab1b7d93.js';
 
 var getNative = _getNative;
 var defineProperty$1 = function () {

package/dist/bundled/v3/{_baseIsEqual-82d7a339.js → _baseIsEqual-a1cc156c.js}

@@ -1,8 +1,8 @@
-import { e as _ListCache, f as _Map, h as _MapCache, d as _overArg, i as _getNative, j as _toSource } from './get-73ac2f59.js';
-import { c as _baseGetTag, b as isObjectLike_1, _ as _root, e as _freeGlobal, a as _Symbol } from './isObject-3a5b854d.js';
-import { e as eq_1 } from './eq-fa566495.js';
-import { i as isArray_1 } from './toString-47fa81b4.js';
-import { a as isLength_1, _ as _isIndex, i as isArrayLike_1 } from './isArrayLike-acf249e3.js';
+import { e as _ListCache, f as _Map, h as _MapCache, d as _overArg, i as _getNative, j as _toSource } from './get-ab1b7d93.js';
+import { c as _baseGetTag, b as isObjectLike_1, _ as _root, e as _freeGlobal, a as _Symbol } from './isObject-fe8b81fd.js';
+import { e as eq_1 } from './eq-95cd2573.js';
+import { i as isArray_1 } from './toString-f3196832.js';
+import { a as isLength_1, _ as _isIndex, i as isArrayLike_1 } from './isArrayLike-e46b8eac.js';
 
 var ListCache$2 = _ListCache;
 

package/dist/bundled/v3/components/OrAvatar/OrAvatar.js

@@ -1,27 +1,26 @@
-import { s as script } from '../../OrAvatar.vue_vue_type_script_lang-552fce16.js';
-export { s as default } from '../../OrAvatar.vue_vue_type_script_lang-552fce16.js';
+import { s as script } from '../../OrAvatar.vue_vue_type_script_lang-2a494943.js';
+export { s as default } from '../../OrAvatar.vue_vue_type_script_lang-2a494943.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createBlock } from 'vue';
 import { s as styleInject } from '../../style-inject.es-4c6f2515.js';
 import 'vue-demi';
 import './constants.js';
 import '../OrIcon/OrIcon.js';
-import '../../OrIcon.vue_vue_type_script_lang-b77bb268.js';
+import '../../OrIcon.vue_vue_type_script_lang-cd2da378.js';
 import '../OrIcon/constants.js';
 import '../../utils/functions/px-to-rem.js';
 import '../OrTooltipContent/OrTooltipContent.js';
 import '../../OrTooltipContent.vue_vue_type_script_lang-4c1afacb.js';
 import '../OrFloating/OrFloating.js';
-import '../../OrFloating.vue_vue_type_script_lang-d762f4b0.js';
+import '../../OrFloating.vue_vue_type_script_lang-d419627c.js';
 import '../../floating-ui.dom.esm-83eba816.js';
 import '../OrTeleport/OrTeleport.js';
 import '../OrTeleport/constants.js';
 import '../OrFloating/constants.js';
-import '../../dom-571739a2.js';
-import '../../isObject-3a5b854d.js';
-import '../../_commonjsHelpers-48a9cab9.js';
-import '../../get-73ac2f59.js';
-import '../../toString-47fa81b4.js';
-import '../../eq-fa566495.js';
+import '../../dom-700444b4.js';
+import '../../isObject-fe8b81fd.js';
+import '../../get-ab1b7d93.js';
+import '../../toString-f3196832.js';
+import '../../eq-95cd2573.js';
 
 const _hoisted_1 = ["src"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {

package/dist/bundled/v3/components/OrAvatar/OrAvatar.vue.d.ts

@@ -1,6 +1,13 @@
 import { PropType } from 'vue-demi';
 import { OR_AVATAR_SIZE } from './constants';
-declare const _default: import("vue-demi").DefineComponent<{
+declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<import("@vue/composition-api").Data> & {
+    showImg: boolean;
+}, {
+    showImage(): void;
+    hideImage(): void;
+}, {
+    avatarClasses(): any[];
+}, {
     src: {
         type: PropType<string>;
         default: string;
@@ -16,14 +23,7 @@ declare const _default: import("vue-demi").DefineComponent<{
         default: string;
         required: false;
     };
-}, unknown, {
-    showImg: boolean;
-}, {
-    avatarClasses(): any[];
-}, {
-    showImage(): void;
-    hideImage(): void;
-}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
+}, import("@vue/composition-api").ExtractPropTypes<{
     src: {
         type: PropType<string>;
         default: string;
@@ -39,9 +39,24 @@ declare const _default: import("vue-demi").DefineComponent<{
         default: string;
         required: false;
     };
-}>>, {
+}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
+    src: string;
+    size: OR_AVATAR_SIZE;
+    icon: string;
+} & {}, import("@vue/composition-api").ShallowUnwrapRef<import("@vue/composition-api").Data>, {
+    showImg: boolean;
+}, {
+    avatarClasses(): any[];
+}, {
+    showImage(): void;
+    hideImage(): void;
+}, {}, {}, {}, {
+    src: string;
+    size: OR_AVATAR_SIZE;
+    icon: string;
+} & {}, {
     src: string;
     size: OR_AVATAR_SIZE;
     icon: string;
-}>;
+}, true>);
 export default _default;