@onereach/ui-components 4.10.4 → 4.10.5-beta.2961.0

package/dist/bundled/v3/{OrDatePicker.vue_vue_type_script_lang-ffc163f4.js → OrDatePicker.vue_vue_type_script_lang-80de9d3a.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$4 } from './OrDateTimePickerMonthSelect-9a9e89c5.js';
-import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader-ec90761f.js';
+import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect-44038b6b.js';
+import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader-4959231c.js';
 import { DatePicker, DatePickerPopover } from './components/OrDatePickerV3/styles.js';
 import './components/OrErrorV3/OrError.js';
 import './components/OrHintV3/OrHint.js';
@@ -15,11 +15,12 @@ import { DropdownOpen } from './directives/dropdown-open.js';
 import { s as script$7 } from './OrError.vue_vue_type_script_lang-df7b5e32.js';
 import { s as script$8 } from './OrHint.vue_vue_type_script_lang-0f5e8377.js';
 import { s as script$9 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$a } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$a } from './OrIconButton.vue_vue_type_script_lang-41792494.js';
 import { s as script$b } from './OrInputBox.vue_vue_type_script_lang-49fb179a.js';
 import { s as script$c } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
-import { s as script$d } from './OrPopover.vue_vue_type_script_lang-506ae7bb.js';
+import { s as script$d } from './OrPopover.vue_vue_type_script_lang-d15ec5cb.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrDatePicker',
@@ -116,17 +117,10 @@ var script = defineComponent({
     const popoverStyles = computed(() => [...DatePickerPopover]);
     // 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/{OrDateTimePicker.vue_vue_type_script_lang-265a8788.js → OrDateTimePicker.vue_vue_type_script_lang-300f009d.js}

@@ -1,8 +1,8 @@
-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$4 } from './OrDateTimePickerMonthSelect-9a9e89c5.js';
-import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader-ec90761f.js';
-import { s as script$7, a as script$8 } from './OrDateTimePickerTimeSelect-683ab20d.js';
+import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect-44038b6b.js';
+import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader-4959231c.js';
+import { s as script$7, a as script$8 } from './OrDateTimePickerTimeSelect-b8cc72af.js';
 import { DateTimePickerTimeFormat } from './components/OrDateTimePickerV3/props.js';
 import { DateTimePicker, DateTimePickerDatePopover, DateTimePickerTimePopover } from './components/OrDateTimePickerV3/styles.js';
 import './components/OrErrorV3/OrError.js';
@@ -15,13 +15,14 @@ import './components/OrPopoverV3/OrPopover.js';
 import { s as script$9 } from './OrError.vue_vue_type_script_lang-df7b5e32.js';
 import { s as script$a } from './OrHint.vue_vue_type_script_lang-0f5e8377.js';
 import { s as script$b } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$c } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$c } from './OrIconButton.vue_vue_type_script_lang-41792494.js';
 import { s as script$d } from './OrInputBox.vue_vue_type_script_lang-49fb179a.js';
 import { s as script$e } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
-import { s as script$f } from './OrPopover.vue_vue_type_script_lang-506ae7bb.js';
+import { s as script$f } from './OrPopover.vue_vue_type_script_lang-d15ec5cb.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',
@@ -138,17 +139,10 @@ var script = defineComponent({
     const timePopoverStyles = computed(() => [...DateTimePickerTimePopover]);
     // 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/{OrDateTimePicker.vue_vue_type_script_lang-882ae7ce.js → OrDateTimePicker.vue_vue_type_script_lang-b7857a99.js}

@@ -2,7 +2,7 @@ import { _ as _baseToString, t as toString_1 } from './toString-47fa81b4.js';
 import { _ as _baseProperty } from './_baseProperty-a52739e9.js';
 import { t as toInteger_1 } from './toInteger-db8a475d.js';
 import { defineComponent, ref, getCurrentInstance } from 'vue-demi';
-import { o as onClickOutside } from './index-09d1cb24.js';
+import { o as onClickOutside } from './index-e11e05e2.js';
 import { s as setStyle, r as requestAF, g as getCS, a as reflow, c as cancelAF } from './dom-571739a2.js';
 import { pxToRem } from './utils/functions/px-to-rem.js';
 import { OrDateTimePickerItemTypes, OrDateTimePickerTypes, DEFAULT_TEXT } from './components/OrDateTimePicker/constants.js';

package/dist/bundled/v3/{OrDateTimePickerMonthSelect-9a9e89c5.js → OrDateTimePickerMonthSelect-44038b6b.js}

@@ -1,15 +1,16 @@
-import { defineComponent, ref, computed } from 'vue-demi';
+import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { useDatePlaceholder } from './components/OrDateTimePickerV3/hooks/useDatePlaceholder.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 import { openBlock, createElementBlock, normalizeClass, Fragment, createTextVNode, toDisplayString, resolveComponent, createElementVNode, renderList, createBlock, withModifiers, withCtx, createVNode } from 'vue';
 import './components/OrButtonV3/OrButton.js';
-import { s as script$3 } from './OrButton.vue_vue_type_script_lang-e8969bd3.js';
+import { s as script$3 } from './OrButton.vue_vue_type_script_lang-7370e903.js';
 import './components/OrIconV3/OrIcon.js';
 import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrMenuV3/OrMenu.js';
 import './components/OrMenuItemV3/OrMenuItem.js';
 import { s as script$4 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$5 } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
-import { s as script$6 } from './OrMenu.vue_vue_type_script_lang-8fa5ef6c.js';
+import { s as script$5 } from './OrIconButton.vue_vue_type_script_lang-41792494.js';
+import { s as script$6 } from './OrMenu.vue_vue_type_script_lang-f8611f9d.js';
 import { s as script$7 } from './OrMenuItem.vue_vue_type_script_lang-b338d68a.js';
 
 const DateTimePickerDateControl = [
@@ -55,12 +56,7 @@ var script$2 = defineComponent({
     const rootStyles = computed(() => ['or-date-time-picker-date-control-v3', ...DateTimePickerDateControl]);
     const placeholderStyles = computed(() => [...DateTimePickerDateControlPlaceholder]);
     // State
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const placeholder = useDatePlaceholder();
     // Methods
     function formatModelValue(value) {
@@ -171,14 +167,8 @@ var script$1 = defineComponent({
     const buttonGroupDateItemStyles = computed(() => [...DateTimePickerDateSelectButtonGroupDateItem]);
     const buttonGroupCurrentDateItemStyles = computed(() => [...DateTimePickerDateSelectButtonGroupCurrentDateItem]);
     // State
-    const proxyModelValue = computed({
-      get: () => {
-        var _a;
-        return (_a = props.modelValue) !== null && _a !== void 0 ? _a : props.initialValue;
-      },
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit, {
+      defaultValue: toRef(props, 'initialValue')
     });
     const dayOptions = computed(() => {
       const monthStartDate = new Date(Date.UTC(proxyModelValue.value.getUTCFullYear(), proxyModelValue.value.getUTCMonth(), 1, proxyModelValue.value.getUTCHours(), proxyModelValue.value.getUTCMinutes()));
@@ -332,14 +322,8 @@ var script = defineComponent({
     // Styles
     const rootStyles = computed(() => ['or-date-time-picker-month-select-v3', ...DateTimePickerMonthSelect]);
     // State
-    const proxyModelValue = computed({
-      get: () => {
-        var _a;
-        return (_a = props.modelValue) !== null && _a !== void 0 ? _a : props.initialValue;
-      },
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit, {
+      defaultValue: toRef(props, 'initialValue')
     });
     const yearOptions = computed(() => {
       return Array.from({

package/dist/bundled/v3/{OrDateTimePickerPopoverHeader-ec90761f.js → OrDateTimePickerPopoverHeader-4959231c.js}

@@ -3,7 +3,7 @@ import './components/OrLabelV3/OrLabel.js';
 import { s as script$3 } from './OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, createTextVNode, toDisplayString, createElementVNode, renderSlot, withModifiers } from 'vue';
 import './components/OrButtonV3/OrButton.js';
-import { s as script$4 } from './OrButton.vue_vue_type_script_lang-e8969bd3.js';
+import { s as script$4 } from './OrButton.vue_vue_type_script_lang-7370e903.js';
 
 const DateTimePickerMobileControl = [
 // Layout

package/dist/bundled/v3/{OrDateTimePickerTimeSelect-683ab20d.js → OrDateTimePickerTimeSelect-b8cc72af.js}

@@ -1,9 +1,10 @@
-import { defineComponent, ref, computed, watch } from 'vue-demi';
+import { defineComponent, ref, computed, toRef, watch } from 'vue-demi';
 import { useTimePlaceholder } from './components/OrDateTimePickerV3/hooks/useTimePlaceholder.js';
 import { DateTimePickerTimeFormat } from './components/OrDateTimePickerV3/props.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 import { openBlock, createElementBlock, normalizeClass, Fragment, createTextVNode, toDisplayString, resolveComponent, createElementVNode, renderList, createBlock, withModifiers, withCtx, createVNode, createCommentVNode } from 'vue';
 import './components/OrButtonV3/OrButton.js';
-import { s as script$2 } from './OrButton.vue_vue_type_script_lang-e8969bd3.js';
+import { s as script$2 } from './OrButton.vue_vue_type_script_lang-7370e903.js';
 
 const DateTimePickerTimeControl = [
 // Layout
@@ -52,12 +53,7 @@ var script$1 = defineComponent({
     const rootStyles = computed(() => ['or-date-time-picker-time-control-v3', ...DateTimePickerTimeControl]);
     const placeholderStyles = computed(() => [...DateTimePickerTimeControlPlaceholder]);
     // State
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const placeholder = useTimePlaceholder(props.format !== DateTimePickerTimeFormat.Auto ? props.format : undefined);
     // Methods
     function formatModelValue(value) {
@@ -163,14 +159,8 @@ var script = defineComponent({
     const buttonGroupStyles = computed(() => [...DateTimePickerTimeSelectButtonGroup]);
     const buttonGroupItemStyles = computed(() => [...DateTimePickerTimeSelectButtonGroupItem]);
     // State
-    const proxyModelValue = computed({
-      get: () => {
-        var _a;
-        return (_a = props.modelValue) !== null && _a !== void 0 ? _a : props.initialValue;
-      },
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit, {
+      defaultValue: toRef(props, 'initialValue')
     });
     const proxyTimeFormat = computed(() => {
       if (props.format === DateTimePickerTimeFormat.Auto) {

package/dist/bundled/v3/{OrExpansionPanel.vue_vue_type_script_lang-ca9d5307.js → OrExpansionPanel.vue_vue_type_script_lang-6ea94b95.js}

@@ -2,8 +2,8 @@ import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { ExpansionPanelVariant, ExpansionPanelColor, ExpansionPanelBackgroundColor } from './components/OrExpansionPanelV3/props.js';
 import { ExpansionPanel, ExpansionPanelVariants, ExpansionPanelBackgroundColors, ExpansionPanelHeader, ExpansionPanelHeaderColors, ExpansionPanelAddon } from './components/OrExpansionPanelV3/styles.js';
 import './components/OrIconV3/OrIcon.js';
-import { usePopoverState } from './hooks/usePopoverState.js';
 import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
+import { usePopoverState } from './hooks/usePopoverState.js';
 
 var script = defineComponent({
   name: 'OrExpansionPanel',
@@ -51,7 +51,7 @@ var script = defineComponent({
       open,
       close,
       toggle
-    } = usePopoverState(toRef(props, 'isOpen'), context);
+    } = usePopoverState(toRef(props, 'isOpen'), context.emit);
     return {
       root,
       rootStyles,

package/dist/bundled/v3/{OrIconButton.vue_vue_type_script_lang-c3a78c23.js → OrIconButton.vue_vue_type_script_lang-41792494.js}

@@ -3,7 +3,7 @@ import { IconButtonColor } from './components/OrIconButtonV3/props.js';
 import { IconButtonRoot, IconButtonRootColors } from './components/OrIconButtonV3/styles.js';
 import './components/OrIconV3/OrIcon.js';
 import './components/OrTooltipV3/OrTooltip.js';
-import { s as script$2 } from './OrTooltip.vue_vue_type_script_lang-227592d8.js';
+import { s as script$2 } from './OrTooltip.vue_vue_type_script_lang-7f5d792c.js';
 import { IconSize } from './components/OrIconV3/props.js';
 import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
 

package/dist/bundled/v3/{OrInlineInput.vue_vue_type_script_lang-820cc7e9.js → OrInlineInput.vue_vue_type_script_lang-fec60585.js}

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, reactive, watch } from 'vue-demi';
+import { defineComponent, ref, computed, reactive, toRef, watch } from 'vue-demi';
 import { InlineInputType } from './components/OrInlineInputV3/props.js';
 import { InlineInputRoot, InlineInputControl, InlineInputAction, InlineInputActionSizes } from './components/OrInlineInputV3/styles.js';
 import './components/OrErrorV3/OrError.js';
@@ -7,12 +7,13 @@ import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrInlineInputBoxV3/OrInlineInputBox.js';
 import { s as script$4 } from './OrInlineInputBox.vue_vue_type_script_lang-fe99c485.js';
 import { InlineInputBoxSize } from './components/OrInlineInputBoxV3/props.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-41792494.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 './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrInlineInput',
@@ -72,13 +73,11 @@ 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(proxyModelValue.value);
+    watch(proxyModelValue, value => {
+      draftModelValue.value = value;
     });
-    const draftModelValue = ref('');
     const currentLength = computed(() => {
       var _a, _b;
       return (_b = (_a = draftModelValue.value) === null || _a === void 0 ? void 0 : _a.toString().length) !== null && _b !== void 0 ? _b : 0;
@@ -112,18 +111,11 @@ var script = defineComponent({
       activated.value = false;
     }
     function reset() {
-      var _a;
       if (draftModelValue.value !== proxyModelValue.value) {
-        draftModelValue.value = (_a = proxyModelValue.value) !== null && _a !== void 0 ? _a : '';
+        draftModelValue.value = proxyModelValue.value;
       }
       activated.value = false;
     }
-    // Effects
-    watch(proxyModelValue, value => {
-      draftModelValue.value = value !== null && value !== void 0 ? value : '';
-    }, {
-      immediate: true
-    });
     return {
       root,
       control,

package/dist/bundled/v3/{OrInlineTextEdit.vue_vue_type_script_lang-588178e5.js → OrInlineTextEdit.vue_vue_type_script_lang-58bc1a00.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, getCurrentInstance } from 'vue-demi';
 import { InlineTextEditTypes, InlineTextEditTrimmingTypes } from './components/OrInlineTextEdit/constants.js';
-import { u as useVModel } from './index-09d1cb24.js';
+import { c as useVModel } from './index-e11e05e2.js';
 import { s as setStyle, r as requestAF, g as getCS, a as reflow, c as cancelAF } from './dom-571739a2.js';
 import { pxToRem } from './utils/functions/px-to-rem.js';
 import './components/OrCollapse/OrCollapse.js';

package/dist/bundled/v3/{OrInlineTextarea.vue_vue_type_script_lang-8e639991.js → OrInlineTextarea.vue_vue_type_script_lang-4265a2a2.js}

@@ -1,16 +1,17 @@
-import { defineComponent, ref, computed, reactive, watch } from 'vue-demi';
+import { defineComponent, ref, computed, reactive, toRef, watch } from 'vue-demi';
 import { InlineTextareaRoot, InlineTextareaControl, InlineTextareaAction } from './components/OrInlineTextareaV3/styles.js';
 import './components/OrErrorV3/OrError.js';
 import './components/OrHintV3/OrHint.js';
 import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrInlineInputBoxV3/OrInlineInputBox.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 './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-41792494.js';
 import { s as script$4 } from './OrInlineInputBox.vue_vue_type_script_lang-fe99c485.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: 'OrInlineInput',
@@ -62,13 +63,11 @@ 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(proxyModelValue.value);
+    watch(proxyModelValue, value => {
+      draftModelValue.value = value;
     });
-    const draftModelValue = ref('');
     const currentLength = computed(() => {
       var _a, _b;
       return (_b = (_a = draftModelValue.value) === null || _a === void 0 ? void 0 : _a.toString().length) !== null && _b !== void 0 ? _b : 0;
@@ -108,12 +107,6 @@ var script = defineComponent({
       }
       activated.value = false;
     }
-    // Effects
-    watch(proxyModelValue, value => {
-      draftModelValue.value = value !== null && value !== void 0 ? value : '';
-    }, {
-      immediate: true
-    });
     return {
       root,
       control,

package/dist/bundled/v3/{OrInput.vue_vue_type_script_lang-66363c62.js → OrInput.vue_vue_type_script_lang-0b8a2b69.js}

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, reactive } from 'vue-demi';
+import { defineComponent, ref, computed, reactive, toRef } from 'vue-demi';
 import { InputType } from './components/OrInputV3/props.js';
 import { InputRoot, InputControl } from './components/OrInputV3/styles.js';
 import './components/OrErrorV3/OrError.js';
@@ -7,7 +7,7 @@ import './components/OrHintV3/OrHint.js';
 import { s as script$2 } from './OrHint.vue_vue_type_script_lang-0f5e8377.js';
 import './components/OrIconV3/OrIcon.js';
 import './components/OrIconButtonV3/OrIconButton.js';
-import { s as script$4 } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$4 } from './OrIconButton.vue_vue_type_script_lang-41792494.js';
 import './components/OrInputBoxV3/OrInputBox.js';
 import { s as script$5 } from './OrInputBox.vue_vue_type_script_lang-49fb179a.js';
 import './components/OrLabelV3/OrLabel.js';
@@ -17,9 +17,10 @@ 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 useResponsive from './hooks/useResponsive/useResponsive.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 import { s as script$3 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$7 } from './OrLoader.vue_vue_type_script_lang-f076f6b3.js';
+import { s as script$7 } from './OrLoader.vue_vue_type_script_lang-a21dc976.js';
+import useResponsive from './hooks/useResponsive/useResponsive.js';
 
 var script = defineComponent({
   name: 'OrInput',
@@ -105,12 +106,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/{OrLoader.vue_vue_type_script_lang-f076f6b3.js → OrLoader.vue_vue_type_script_lang-a21dc976.js}

@@ -1,4 +1,4 @@
-import { h as useElementSize } from './index-09d1cb24.js';
+import { h as useElementSize } from './index-e11e05e2.js';
 import { defineComponent, ref, computed } from 'vue-demi';
 import { LoaderVariant, LoaderColor, LoaderSize } from './components/OrLoaderV3/props.js';
 import { LoaderRoot, LoaderRootColors, LoaderTitle, LoaderDescription, LoaderContainer } from './components/OrLoaderV3/styles.js';

package/dist/bundled/v3/{OrMenu.vue_vue_type_script_lang-8fa5ef6c.js → OrMenu.vue_vue_type_script_lang-f8611f9d.js}

@@ -1,9 +1,9 @@
 import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { MenuRoot } from './components/OrMenuV3/styles.js';
 import './components/OrPopoverV3/OrPopover.js';
-import { usePopoverState } from './hooks/usePopoverState.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-d15ec5cb.js';
 import { PopoverPlacement } from './components/OrPopoverV3/props.js';
+import { usePopoverState } from './hooks/usePopoverState.js';
 
 var script = defineComponent({
   name: 'OrMenu',
@@ -38,7 +38,7 @@ var script = defineComponent({
       open,
       close,
       toggle
-    } = usePopoverState(toRef(props, 'isOpen'), context);
+    } = usePopoverState(toRef(props, 'isOpen'), context.emit);
     // Handlers
     function onClick(event) {
       const path = event.composedPath();

package/dist/bundled/v3/{OrModal.vue_vue_type_script_lang-153819d3.js → OrModal.vue_vue_type_script_lang-32c395a3.js}

@@ -1,6 +1,6 @@
 import { ref, watch, defineComponent, onBeforeUnmount } from 'vue-demi';
 import { OrModalSizes } from './components/OrModal/constants.js';
-import { i as unrefElement, o as onClickOutside } from './index-09d1cb24.js';
+import { i as unrefElement, o as onClickOutside } from './index-e11e05e2.js';
 import { t as tryOnScopeDispose } from './index-f4d8e24c.js';
 import './components/OrIconButtonV2/OrIconButton.js';
 import './components/OrOverlay/OrOverlay.js';
@@ -8,7 +8,7 @@ import { s as script$2 } from './OrOverlay.vue_vue_type_script_lang-2f5d626d.js'
 import { s as script$1 } from './OrIconButton.vue_vue_type_script_lang-e078ed4c.js';
 
 /*!
-* tabbable 6.1.1
+* tabbable 6.1.2
 * @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
 */
 // NOTE: separate `:not()` selectors has broader browser support than the newer

package/dist/bundled/v3/{OrModal.vue_vue_type_script_lang-83469d51.js → OrModal.vue_vue_type_script_lang-e00165f1.js}

@@ -1,12 +1,12 @@
 import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { openBlock, createElementBlock, normalizeClass, renderSlot, resolveComponent, createElementVNode, createVNode, withModifiers } from 'vue';
 import './components/OrIconButtonV3/OrIconButton.js';
-import { s as script$4 } from './OrIconButton.vue_vue_type_script_lang-c3a78c23.js';
+import { s as script$4 } from './OrIconButton.vue_vue_type_script_lang-41792494.js';
 import { ModalSize } from './components/OrModalV3/props.js';
 import { ModalRoot, ModalRootSizes } from './components/OrModalV3/styles.js';
 import './components/OrOverlayV3/OrOverlay.js';
+import { s as script$5 } from './OrOverlay.vue_vue_type_script_lang-9036d75d.js';
 import { usePopoverState } from './hooks/usePopoverState.js';
-import { s as script$5 } from './OrOverlay.vue_vue_type_script_lang-0fdf19ba.js';
 
 const ModalContent = [
 // Layout
@@ -146,7 +146,7 @@ var script = defineComponent({
       state,
       open,
       close
-    } = usePopoverState(toRef(props, 'isOpen'), context);
+    } = usePopoverState(toRef(props, 'isOpen'), context.emit);
     return {
       root,
       rootStyles,

package/dist/bundled/v3/{OrNotification.vue_vue_type_script_lang-242a7186.js → OrNotification.vue_vue_type_script_lang-9d3dd0d9.js}

@@ -4,7 +4,7 @@ import { NotificationRoot, NotificationRootVariants, NotificationIcon, Notificat
 import './components/OrIconV3/OrIcon.js';
 import './components/OrIconButtonV3/OrIconButton.js';
 import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.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-41792494.js';
 
 var script = defineComponent({
   name: 'OrNotification',

package/dist/bundled/v3/{OrOverflowMenu.vue_vue_type_script_lang-ba3b94e2.js → OrOverflowMenu.vue_vue_type_script_lang-e077c7fd.js}

@@ -1,5 +1,5 @@
 import { defineComponent, ref } from 'vue-demi';
-import { o as onClickOutside } from './index-09d1cb24.js';
+import { o as onClickOutside } from './index-e11e05e2.js';
 import './components/OrButtonV2/OrButton.js';
 import { s as script$2 } from './OrButton.vue_vue_type_script_lang-5b8437d7.js';
 import { resolveComponent, openBlock, createElementBlock, createVNode, withModifiers } from 'vue';

package/dist/bundled/v3/{OrOverlay.vue_vue_type_script_lang-0fdf19ba.js → OrOverlay.vue_vue_type_script_lang-9036d75d.js}

@@ -1,4 +1,4 @@
-import { j as useScrollLock } from './index-09d1cb24.js';
+import { j as useScrollLock } from './index-e11e05e2.js';
 import { defineComponent, ref, computed } from 'vue-demi';
 import { OverlayRoot } from './components/OrOverlayV3/styles.js';
 import './components/OrTeleportV3/OrTeleport.js';

package/dist/bundled/v3/{OrPagination.vue_vue_type_script_lang-193cf67a.js → OrPagination.vue_vue_type_script_lang-cf545aab.js}

@@ -1,14 +1,15 @@
-import { defineComponent, ref, computed } from 'vue-demi';
+import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { PaginationRoot, PaginationOffsetControl, PaginationLimitControl, PaginationItem } from './components/OrPaginationV3/styles.js';
 import './components/OrButtonV3/OrButton.js';
 import './components/OrIconV3/OrIcon.js';
 import './components/OrMenuV3/OrMenu.js';
 import './components/OrMenuItemV3/OrMenuItem.js';
-import useResponsive from './hooks/useResponsive/useResponsive.js';
-import { s as script$1 } from './OrButton.vue_vue_type_script_lang-e8969bd3.js';
+import { s as script$1 } from './OrButton.vue_vue_type_script_lang-7370e903.js';
 import { s as script$2 } from './OrIcon.vue_vue_type_script_lang-73f9cc63.js';
-import { s as script$3 } from './OrMenu.vue_vue_type_script_lang-8fa5ef6c.js';
+import { s as script$3 } from './OrMenu.vue_vue_type_script_lang-f8611f9d.js';
 import { s as script$4 } from './OrMenuItem.vue_vue_type_script_lang-b338d68a.js';
+import useResponsive from './hooks/useResponsive/useResponsive.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 
 var script = defineComponent({
   name: 'OrPagination',
@@ -61,12 +62,7 @@ var script = defineComponent({
     const limitControlStyles = computed(() => [...PaginationLimitControl]);
     const itemStyles = computed(() => [...PaginationItem]);
     // State
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const currentLimit = computed({
       get: () => {
         var _a, _b;

package/dist/bundled/v3/{OrPassword.vue_vue_type_script_lang-fc9e7dc8.js → OrPassword.vue_vue_type_script_lang-0a87f331.js}

@@ -1,5 +1,5 @@
 import { defineComponent, ref } from 'vue-demi';
-import { u as useVModel } from './index-09d1cb24.js';
+import { c as useVModel } from './index-e11e05e2.js';
 import './components/OrInput/OrInput.js';
 import './components/OrIconButtonV2/OrIconButton.js';
 import useToggle from './hooks/useToggle.js';

package/dist/bundled/v3/{OrPopover.vue_vue_type_script_lang-506ae7bb.js → OrPopover.vue_vue_type_script_lang-d15ec5cb.js}

@@ -1,15 +1,15 @@
 import { a as autoUpdate, c as computePosition, s as shift, f as flip, h as hide } from './floating-ui.dom.esm-83eba816.js';
-import { o as onClickOutside } from './index-09d1cb24.js';
+import { o as onClickOutside } from './index-e11e05e2.js';
 import { defineComponent, ref, computed, toRef, watchPostEffect, unref } from 'vue-demi';
 import { PopoverVariant, PopoverPlacement } from './components/OrPopoverV3/props.js';
 import { PopoverRoot, PopoverBody, PopoverBodyPlacements } from './components/OrPopoverV3/styles.js';
 import './components/OrBottomSheetV3/OrBottomSheet.js';
-import { s as script$1 } from './OrBottomSheet.vue_vue_type_script_lang-214a0eea.js';
+import { s as script$1 } from './OrBottomSheet.vue_vue_type_script_lang-ec375126.js';
 import './components/OrTeleportV3/OrTeleport.js';
 import useResponsive from './hooks/useResponsive/useResponsive.js';
+import { s as script$2 } from './OrTeleport.vue3.vue_vue_type_script_lang-a6ce162e.js';
 import { usePopoverState } from './hooks/usePopoverState.js';
 import { useElevation } from './hooks/useElevation.js';
-import { s as script$2 } from './OrTeleport.vue3.vue_vue_type_script_lang-a6ce162e.js';
 
 var script = defineComponent({
   name: 'OrPopover',
@@ -75,7 +75,7 @@ var script = defineComponent({
       open,
       close,
       toggle
-    } = usePopoverState(toRef(props, 'isOpen'), context);
+    } = usePopoverState(toRef(props, 'isOpen'), context.emit);
     const isFlipped = ref(false);
     const isHidden = ref(false);
     // Effects

package/dist/bundled/v3/{OrProgress.vue_vue_type_script_lang-6a2fef77.js → OrProgress.vue_vue_type_script_lang-2d5ead47.js}

@@ -1,4 +1,4 @@
-import { d as useElementBounding } from './index-09d1cb24.js';
+import { d as useElementBounding } from './index-e11e05e2.js';
 import { r as round_1 } from './round-136c7e43.js';
 import { defineComponent, ref, useSlots, computed } from 'vue-demi';
 import { ProgressType, ProgressColor } from './components/OrProgressV3/props.js';