@onereach/ui-components 5.6.1-beta.3221.0 → 5.7.0-beta.3224.0

package/dist/bundled/v2/components/OrContextMenuV3/OrContextMenu.js

@@ -0,0 +1,108 @@
+import { defineComponent, ref, watch } from 'vue-demi';
+import __vue_component__$1 from '../OrMenuV3/OrMenu.js';
+import { PopoverPlacement } from '../OrPopoverV3/props.js';
+import { usePopoverState } from '../../hooks/usePopoverState.js';
+import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
+
+var script = defineComponent({
+  components: {
+    OrMenu: __vue_component__$1
+  },
+  props: {
+    trigger: {
+      type: Object,
+      default: undefined
+    },
+    placement: {
+      type: String,
+      default: PopoverPlacement.BottomStart
+    },
+    offset: {
+      type: [Number, Object, Function],
+      default: undefined
+    }
+  },
+  emits: ['update:state', 'open', 'close'],
+  expose: ['state', 'open', 'close', 'toggle'],
+  setup(props, context) {
+    // State
+    const {
+      state,
+      open,
+      close,
+      toggle
+    } = usePopoverState(ref(false), context.emit);
+    // #region Trigger Point
+    const triggerPoint = ref();
+    function onContextMenu(event) {
+      event.preventDefault();
+      triggerPoint.value = {
+        getBoundingClientRect: () => new DOMRect(event.x, event.y)
+      };
+      open();
+    }
+    watch(() => props.trigger, (trigger, prevTrigger) => {
+      if (trigger) {
+        trigger.addEventListener('contextmenu', onContextMenu);
+      }
+      if (prevTrigger) {
+        prevTrigger.removeEventListener('contextmenu', onContextMenu);
+      }
+    }, {
+      immediate: true
+    });
+    // #endregion
+    return {
+      state,
+      open,
+      close,
+      toggle,
+      triggerPoint
+    };
+  }
+});
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('OrMenu', {
+    attrs: {
+      "is-open": _vm.state === 'open',
+      "trigger": _vm.triggerPoint,
+      "placement": _vm.placement,
+      "offset": _vm.offset
+    },
+    on: {
+      "update:state": function ($event) {
+        _vm.state = $event;
+      }
+    }
+  }, [_vm._t("default")], 2);
+};
+var __vue_staticRenderFns__ = [];
+
+/* style */
+const __vue_inject_styles__ = undefined;
+/* scoped */
+const __vue_scope_id__ = undefined;
+/* module identifier */
+const __vue_module_identifier__ = undefined;
+/* functional template */
+const __vue_is_functional_template__ = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__,
+  staticRenderFns: __vue_staticRenderFns__
+}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
+
+export { __vue_component__ as default };

package/dist/bundled/v2/components/OrContextMenuV3/OrContextMenu.vue.d.ts

@@ -0,0 +1,59 @@
+import { VirtualElement } from '@floating-ui/dom';
+import { PropType } from 'vue-demi';
+import { ContextMenuOffset, ContextMenuPlacement } from './props';
+declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
+    state: import("@vue/composition-api").Ref<"open" | "closed">;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    triggerPoint: import("@vue/composition-api").Ref<VirtualElement | undefined>;
+}> & import("@vue/composition-api").Data, {}, {}, {
+    trigger: {
+        type: PropType<HTMLElement>;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<ContextMenuPlacement>;
+        default: ContextMenuPlacement;
+    };
+    offset: {
+        type: PropType<ContextMenuOffset>;
+        default: undefined;
+    };
+}, import("@vue/composition-api").ExtractPropTypes<{
+    trigger: {
+        type: PropType<HTMLElement>;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<ContextMenuPlacement>;
+        default: ContextMenuPlacement;
+    };
+    offset: {
+        type: PropType<ContextMenuOffset>;
+        default: undefined;
+    };
+}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
+    trigger: HTMLElement;
+    placement: ContextMenuPlacement;
+    offset: ContextMenuOffset;
+} & {} & {
+    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, import("@vue/composition-api").ShallowUnwrapRef<{
+    state: import("@vue/composition-api").Ref<"open" | "closed">;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    triggerPoint: import("@vue/composition-api").Ref<VirtualElement | undefined>;
+}>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
+    trigger: HTMLElement;
+    placement: ContextMenuPlacement;
+    offset: ContextMenuOffset;
+} & {} & {
+    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, {
+    trigger: HTMLElement;
+    placement: ContextMenuPlacement;
+    offset: ContextMenuOffset;
+}, true>);
+export default _default;

package/dist/bundled/v2/components/OrContextMenuV3/index.d.ts

@@ -0,0 +1,2 @@
+export { default as OrContextMenuV3 } from './OrContextMenu.vue';
+export * from './props';

package/dist/bundled/v2/components/OrContextMenuV3/index.js

@@ -0,0 +1,2 @@
+export { default as OrContextMenuV3 } from './OrContextMenu.js';
+export { PopoverPlacement as ContextMenuPlacement } from '../OrPopoverV3/props.js';

package/dist/bundled/v2/components/OrContextMenuV3/props.d.ts

@@ -0,0 +1 @@
+export { MenuOffset as ContextMenuOffset, MenuPlacement as ContextMenuPlacement } from '../or-menu-v3';

package/dist/bundled/v2/components/OrContextMenuV3/props.js

@@ -0,0 +1 @@
+export { PopoverPlacement as ContextMenuPlacement } from '../OrPopoverV3/props.js';

package/dist/bundled/v2/components/OrDatePickerV3/OrDatePicker.js

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed, toRef, watch } from 'vue-demi';
 import { useCurrentDate } from '../OrDateTimePickerV3/hooks/useCurrentDate.js';
-import { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-10218f0c.js';
+import { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-c05f2ce2.js';
 import { O as OrDateTimePickerMobileControl, a as OrDateTimePickerPopoverFooter, b as OrDateTimePickerPopoverHeader } from '../../OrDateTimePickerPopoverHeader-2c7e113b.js';
 import { DatePicker, DatePickerPopover } from './styles.js';
 import __vue_component__$1 from '../OrErrorV3/OrError.js';

package/dist/bundled/v2/components/OrDateTimePickerV3/OrDateTimePicker.js

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed, toRef, watch } from 'vue-demi';
 import { useCurrentDate } from './hooks/useCurrentDate.js';
-import { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-10218f0c.js';
+import { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-c05f2ce2.js';
 import { O as OrDateTimePickerMobileControl, a as OrDateTimePickerPopoverFooter, b as OrDateTimePickerPopoverHeader } from '../../OrDateTimePickerPopoverHeader-2c7e113b.js';
 import { O as OrDateTimePickerTimeControl, a as OrDateTimePickerTimeSelect } from '../../OrDateTimePickerTimeSelect-7fd83e23.js';
 import { DateTimePickerTimeFormat } from './props.js';

package/dist/bundled/v2/components/OrMenuV3/OrMenu.js

@@ -16,7 +16,7 @@ var script = defineComponent({
       default: false
     },
     trigger: {
-      type: HTMLElement,
+      type: Object,
       default: undefined
     },
     placement: {

package/dist/bundled/v2/components/OrMenuV3/OrMenu.vue.d.ts

@@ -1,3 +1,4 @@
+import { ReferenceElement } from '@floating-ui/dom';
 import { PropType } from 'vue-demi';
 import { MenuOffset, MenuPlacement } from './props';
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
@@ -14,10 +15,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: boolean;
     };
     trigger: {
-        type: {
-            new (): HTMLElement;
-            prototype: HTMLElement;
-        };
+        type: PropType<ReferenceElement>;
         default: undefined;
     };
     placement: {
@@ -34,10 +32,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: boolean;
     };
     trigger: {
-        type: {
-            new (): HTMLElement;
-            prototype: HTMLElement;
-        };
+        type: PropType<ReferenceElement>;
         default: undefined;
     };
     placement: {
@@ -50,7 +45,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
     isOpen: boolean;
-    trigger: HTMLElement;
+    trigger: ReferenceElement;
     placement: MenuPlacement;
     offset: MenuOffset;
 } & {} & {
@@ -65,14 +60,14 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     onClick: (event: Event) => void;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     isOpen: boolean;
-    trigger: HTMLElement;
+    trigger: ReferenceElement;
     placement: MenuPlacement;
     offset: MenuOffset;
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     isOpen: boolean;
-    trigger: HTMLElement;
+    trigger: ReferenceElement;
     placement: MenuPlacement;
     offset: MenuOffset;
 }, true>);

package/dist/bundled/v2/components/OrPopoverV3/OrPopover.js

@@ -30,7 +30,7 @@ var script = defineComponent({
       default: undefined
     },
     trigger: {
-      type: HTMLElement,
+      type: Object,
       default: undefined
     },
     placement: {
@@ -101,11 +101,14 @@ var script = defineComponent({
               placement,
               middleware: [offset(props.offset), shift(), flip(), hide()]
             });
+            const {
+              width: triggerWidth
+            } = trigger.getBoundingClientRect();
             Object.assign(rootElement.style, {
               left: `${x}px`,
               top: `${y}px`,
               visibility: middlewareData.hide.referenceHidden ? 'hidden' : 'visible',
-              width: props.fullWidth ? `${trigger.offsetWidth}px` : ''
+              width: props.fullWidth ? `${triggerWidth}px` : ''
             });
             isFlipped.value = Boolean((_a = middlewareData.flip) === null || _a === void 0 ? void 0 : _a.index);
             isHidden.value = Boolean((_b = middlewareData.hide) === null || _b === void 0 ? void 0 : _b.referenceHidden);

package/dist/bundled/v2/components/OrPopoverV3/OrPopover.vue.d.ts

@@ -1,3 +1,4 @@
+import { ReferenceElement } from '@floating-ui/dom';
 import { PropType } from 'vue-demi';
 import { PopoverOffset, PopoverPlacement, PopoverVariant } from './props';
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
@@ -35,10 +36,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: undefined;
     };
     trigger: {
-        type: {
-            new (): HTMLElement;
-            prototype: HTMLElement;
-        };
+        type: PropType<ReferenceElement>;
         default: undefined;
     };
     placement: {
@@ -77,10 +75,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: undefined;
     };
     trigger: {
-        type: {
-            new (): HTMLElement;
-            prototype: HTMLElement;
-        };
+        type: PropType<ReferenceElement>;
         default: undefined;
     };
     placement: {
@@ -109,7 +104,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     bottomSheetProps: Readonly<Partial<{
         [x: number]: string;
     } | {}> & Omit<{} & {}, never>>;
-    trigger: HTMLElement;
+    trigger: ReferenceElement;
     placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
     offset: PopoverOffset;
     fullWidth: boolean;
@@ -142,7 +137,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     bottomSheetProps: Readonly<Partial<{
         [x: number]: string;
     } | {}> & Omit<{} & {}, never>>;
-    trigger: HTMLElement;
+    trigger: ReferenceElement;
     placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
     offset: PopoverOffset;
     fullWidth: boolean;
@@ -156,7 +151,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     bottomSheetProps: Readonly<Partial<{
         [x: number]: string;
     } | {}> & Omit<{} & {}, never>>;
-    trigger: HTMLElement;
+    trigger: ReferenceElement;
     placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
     offset: PopoverOffset;
     fullWidth: boolean;

package/dist/bundled/v2/components/OrTagsV3/styles.js

@@ -3,6 +3,8 @@ import { TagsOverflow } from './props.js';
 const Tags = [
 // Layout
 'layout-row',
+// Overflow
+'overflow-hidden',
 // Spacing
 'gap-sm',
 // Theme

package/dist/bundled/v2/components/index.d.ts

@@ -20,6 +20,7 @@ export * from './or-color-picker';
 export * from './or-combined-input-v3';
 export * from './or-confirm';
 export * from './or-confirm-v3';
+export * from './or-context-menu-v3';
 export * from './or-date-picker-v3';
 export * from './or-date-time-picker';
 export * from './or-date-time-picker-v3';

package/dist/bundled/v2/components/index.js

@@ -37,6 +37,8 @@ export { InputBoxSize as CombinedInputSize, InputBoxSize as DatePickerSize, Inpu
 export { default as OrConfirm } from './OrConfirm/OrConfirm.js';
 export { default as OrConfirmV3 } from './OrConfirmV3/OrConfirm.js';
 export { ConfirmType } from './OrConfirmV3/props.js';
+export { default as OrContextMenuV3 } from './OrContextMenuV3/OrContextMenu.js';
+export { PopoverPlacement as ContextMenuPlacement, PopoverPlacement as MenuPlacement, PopoverPlacement, PopoverVariant, PopoverPlacement as TooltipPlacement } from './OrPopoverV3/props.js';
 export { default as OrDatePickerV3 } from './OrDatePickerV3/OrDatePicker.js';
 export { default as OrDateTimePicker } from './OrDateTimePicker/OrDateTimePicker.js';
 export { DEFAULT_TEXT, OrDateTimePickerItemTypes, OrDateTimePickerTypes } from './OrDateTimePicker/constants.js';
@@ -87,7 +89,6 @@ export { default as OrLoaderV3 } from './OrLoaderV3/OrLoader.js';
 export { LoaderColor, LoaderSize, LoaderVariant } from './OrLoaderV3/props.js';
 export { default as OrMenuItemV3 } from './OrMenuItemV3/OrMenuItem.js';
 export { default as OrMenuV3 } from './OrMenuV3/OrMenu.js';
-export { PopoverPlacement as MenuPlacement, PopoverPlacement, PopoverVariant, PopoverPlacement as TooltipPlacement } from './OrPopoverV3/props.js';
 export { default as OrModal } from './OrModal/OrModal.js';
 export { OrModalSizes } from './OrModal/constants.js';
 export { default as OrModalV3 } from './OrModalV3/OrModal.js';

package/dist/bundled/v2/index.js

@@ -15,6 +15,7 @@ export { default as OrColorPicker } from './components/OrColorPicker/OrColorPick
 export { default as OrCombinedInputV3 } from './components/OrCombinedInputV3/OrCombinedInput.js';
 export { default as OrConfirm } from './components/OrConfirm/OrConfirm.js';
 export { default as OrConfirmV3 } from './components/OrConfirmV3/OrConfirm.js';
+export { default as OrContextMenuV3 } from './components/OrContextMenuV3/OrContextMenu.js';
 export { default as OrDatePickerV3 } from './components/OrDatePickerV3/OrDatePicker.js';
 export { default as OrDateTimePicker } from './components/OrDateTimePicker/OrDateTimePicker.js';
 export { default as OrDateTimePickerV3 } from './components/OrDateTimePickerV3/OrDateTimePicker.js';
@@ -90,6 +91,7 @@ export { default as OrCollapse } from './components/OrCollapse/OrCollapse.js';
 export { amber, black, blue, blueGrey, brown, cyan, deepOrange, deepPurple, green, indigo, lightBlue, lightGreen, lime, orange, pink, purple, red, teal, white, yellow } from './components/OrColorPicker/constants.js';
 export { InputBoxSize as CombinedInputSize, InputBoxSize as DatePickerSize, InputBoxSize as DateTimePickerSize, InputBoxSize, InputBoxVariant, InputBoxSize as InputSize, InputBoxSize as SearchSize, InputBoxSize as SelectSize, InputBoxSize as TagInputSize, InputBoxSize as TextareaSize, InputBoxSize as TimePickerSize } from './components/OrInputBoxV3/props.js';
 export { ConfirmType } from './components/OrConfirmV3/props.js';
+export { PopoverPlacement as ContextMenuPlacement, PopoverPlacement as MenuPlacement, PopoverPlacement, PopoverVariant, PopoverPlacement as TooltipPlacement } from './components/OrPopoverV3/props.js';
 export { DEFAULT_TEXT, OrDateTimePickerItemTypes, OrDateTimePickerTypes } from './components/OrDateTimePicker/constants.js';
 export { DateTimePickerTimeFormat, DateTimePickerTimeFormat as TimePickerFormat } from './components/OrDateTimePickerV3/props.js';
 export { EmptyStateSize } from './components/OrEmptyStateV3/props.js';
@@ -129,7 +131,6 @@ export { default as OrLoaderV3 } from './components/OrLoaderV3/OrLoader.js';
 export { LoaderColor, LoaderSize, LoaderVariant } from './components/OrLoaderV3/props.js';
 export { default as OrMenuItemV3 } from './components/OrMenuItemV3/OrMenuItem.js';
 export { default as OrMenuV3 } from './components/OrMenuV3/OrMenu.js';
-export { PopoverPlacement as MenuPlacement, PopoverPlacement, PopoverVariant, PopoverPlacement as TooltipPlacement } from './components/OrPopoverV3/props.js';
 export { default as OrModal } from './components/OrModal/OrModal.js';
 export { OrModalSizes } from './components/OrModal/constants.js';
 export { default as OrModalV3 } from './components/OrModalV3/OrModal.js';

package/dist/bundled/v3/{OrCardCollection.vue_vue_type_script_lang-fe386f0a.js → OrCardCollection.vue_vue_type_script_lang-20ebec4c.js}

@@ -4,10 +4,10 @@ import { openBlock, createElementBlock, normalizeClass, Fragment, renderList, re
 import { gridView, defaultViewModes } from './components/OrCardCollectionV3/props.js';
 import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrSortingV3/OrSorting.js';
-import { s as script$3 } from './OrSorting.vue_vue_type_script_lang-9efcf5f4.js';
+import { s as script$3 } from './OrSorting.vue_vue_type_script_lang-1b33b195.js';
 import './components/OrSearchV3/OrSearch.js';
-import { s as script$4 } from './OrSearch.vue_vue_type_script_lang-3d8d2a56.js';
-import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-cebfa417.js';
+import { s as script$4 } from './OrSearch.vue_vue_type_script_lang-4a880dfb.js';
+import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-289e82c0.js';
 
 var script$1 = defineComponent({
   name: 'OrCardCollectionView',

package/dist/bundled/v3/{OrCode.vue_vue_type_script_lang-b8b2b714.js → OrCode.vue_vue_type_script_lang-b1c3228a.js}

@@ -11,10 +11,10 @@ import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrInputBoxV3/OrInputBox.js';
 import './components/OrLabelV3/OrLabel.js';
 import './components/OrModalV3/OrModal.js';
-import { s as script$6 } from './OrModal.vue_vue_type_script_lang-0fda4eb2.js';
+import { s as script$6 } from './OrModal.vue_vue_type_script_lang-176e6532.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-cebfa417.js';
+import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-289e82c0.js';
 import { s as script$4 } from './OrInputBox.vue_vue_type_script_lang-137cb650.js';
 import { s as script$5 } from './OrLabel.vue_vue_type_script_lang-fcdfd80d.js';
 import { useIdAttribute } from './hooks/useIdAttribute.js';

package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-88deb6c6.js → OrConfirm.vue_vue_type_script_lang-b32006a9.js}

@@ -9,7 +9,7 @@ import './components/OrInputV3/OrInput.js';
 import { ButtonColor } from './components/OrButtonV3/props.js';
 import { s as script$1 } from './OrOverlay.vue_vue_type_script_lang-2da128a3.js';
 import { s as script$2 } from './OrButton.vue_vue_type_script_lang-22b24f8b.js';
-import { s as script$3 } from './OrInput.vue_vue_type_script_lang-0ed3a645.js';
+import { s as script$3 } from './OrInput.vue_vue_type_script_lang-46e08cc3.js';
 import { usePopoverState } from './hooks/usePopoverState.js';
 import { w as whenever } from './index-f4d8e24c.js';
 

package/dist/bundled/v3/OrContextMenu.vue_vue_type_script_lang-b8f1f97d.js

@@ -0,0 +1,65 @@
+import { defineComponent, ref, watch } from 'vue-demi';
+import './components/OrMenuV3/OrMenu.js';
+import { s as script$1 } from './OrMenu.vue_vue_type_script_lang-02cd817e.js';
+import { PopoverPlacement } from './components/OrPopoverV3/props.js';
+import { usePopoverState } from './hooks/usePopoverState.js';
+
+var script = defineComponent({
+  components: {
+    OrMenu: script$1
+  },
+  props: {
+    trigger: {
+      type: Object,
+      default: undefined
+    },
+    placement: {
+      type: String,
+      default: PopoverPlacement.BottomStart
+    },
+    offset: {
+      type: [Number, Object, Function],
+      default: undefined
+    }
+  },
+  emits: ['update:state', 'open', 'close'],
+  expose: ['state', 'open', 'close', 'toggle'],
+  setup(props, context) {
+    // State
+    const {
+      state,
+      open,
+      close,
+      toggle
+    } = usePopoverState(ref(false), context.emit);
+    // #region Trigger Point
+    const triggerPoint = ref();
+    function onContextMenu(event) {
+      event.preventDefault();
+      triggerPoint.value = {
+        getBoundingClientRect: () => new DOMRect(event.x, event.y)
+      };
+      open();
+    }
+    watch(() => props.trigger, (trigger, prevTrigger) => {
+      if (trigger) {
+        trigger.addEventListener('contextmenu', onContextMenu);
+      }
+      if (prevTrigger) {
+        prevTrigger.removeEventListener('contextmenu', onContextMenu);
+      }
+    }, {
+      immediate: true
+    });
+    // #endregion
+    return {
+      state,
+      open,
+      close,
+      toggle,
+      triggerPoint
+    };
+  }
+});
+
+export { script as s };

package/dist/bundled/v3/{OrDatePicker.vue_vue_type_script_lang-8502f67f.js → OrDatePicker.vue_vue_type_script_lang-cf2d4762.js}

@@ -1,6 +1,6 @@
 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-6bd5b8de.js';
+import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect-23468f5d.js';
 import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader-daa7e47b.js';
 import { DatePicker, DatePickerPopover } from './components/OrDatePickerV3/styles.js';
 import './components/OrErrorV3/OrError.js';
@@ -15,10 +15,10 @@ 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-cebfa417.js';
+import { s as script$a } from './OrIconButton.vue_vue_type_script_lang-289e82c0.js';
 import { s as script$b } from './OrInputBox.vue_vue_type_script_lang-137cb650.js';
 import { s as script$c } from './OrLabel.vue_vue_type_script_lang-fcdfd80d.js';
-import { s as script$d } from './OrPopover.vue_vue_type_script_lang-e02f10d1.js';
+import { s as script$d } from './OrPopover.vue_vue_type_script_lang-12d563f5.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';
 import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 

package/dist/bundled/v3/{OrDateTimePicker.vue_vue_type_script_lang-ea2d0037.js → OrDateTimePicker.vue_vue_type_script_lang-d877011c.js}

@@ -1,6 +1,6 @@
 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-6bd5b8de.js';
+import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect-23468f5d.js';
 import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader-daa7e47b.js';
 import { s as script$7, a as script$8 } from './OrDateTimePickerTimeSelect-96c4d657.js';
 import { DateTimePickerTimeFormat } from './components/OrDateTimePickerV3/props.js';
@@ -15,10 +15,10 @@ 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-cebfa417.js';
+import { s as script$c } from './OrIconButton.vue_vue_type_script_lang-289e82c0.js';
 import { s as script$d } from './OrInputBox.vue_vue_type_script_lang-137cb650.js';
 import { s as script$e } from './OrLabel.vue_vue_type_script_lang-fcdfd80d.js';
-import { s as script$f } from './OrPopover.vue_vue_type_script_lang-e02f10d1.js';
+import { s as script$f } from './OrPopover.vue_vue_type_script_lang-12d563f5.js';
 import { DropdownClose } from './directives/dropdown-close.js';
 import { DropdownOpen } from './directives/dropdown-open.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';

package/dist/bundled/v3/{OrDateTimePickerMonthSelect-6bd5b8de.js → OrDateTimePickerMonthSelect-23468f5d.js}

@@ -9,8 +9,8 @@ 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-cebfa417.js';
-import { s as script$6 } from './OrMenu.vue_vue_type_script_lang-0f6c605e.js';
+import { s as script$5 } from './OrIconButton.vue_vue_type_script_lang-289e82c0.js';
+import { s as script$6 } from './OrMenu.vue_vue_type_script_lang-02cd817e.js';
 import { s as script$7 } from './OrMenuItem.vue_vue_type_script_lang-1785286a.js';
 
 const DateTimePickerDateControl = [

package/dist/bundled/v3/{OrIconButton.vue_vue_type_script_lang-cebfa417.js → OrIconButton.vue_vue_type_script_lang-289e82c0.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-03992b84.js';
+import { s as script$2 } from './OrTooltip.vue_vue_type_script_lang-0988a03b.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-c5965dc0.js → OrInlineInput.vue_vue_type_script_lang-f00a4b68.js}

@@ -9,7 +9,7 @@ import { s as script$4 } from './OrInlineInputBox.vue_vue_type_script_lang-fe99c
 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-cebfa417.js';
+import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-289e82c0.js';
 import { useIdAttribute } from './hooks/useIdAttribute.js';
 import { useControlAttributes } from './hooks/useControlAttributes.js';
 import { useValidationAttributes } from './hooks/useValidationAttributes.js';

package/dist/bundled/v3/{OrInlineTextarea.vue_vue_type_script_lang-f53f2c7f.js → OrInlineTextarea.vue_vue_type_script_lang-de3943ed.js}

@@ -6,7 +6,7 @@ import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrInlineInputBoxV3/OrInlineInputBox.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-cebfa417.js';
+import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-289e82c0.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';

package/dist/bundled/v3/{OrInput.vue_vue_type_script_lang-0ed3a645.js → OrInput.vue_vue_type_script_lang-46e08cc3.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-cebfa417.js';
+import { s as script$4 } from './OrIconButton.vue_vue_type_script_lang-289e82c0.js';
 import './components/OrInputBoxV3/OrInputBox.js';
 import { s as script$5 } from './OrInputBox.vue_vue_type_script_lang-137cb650.js';
 import './components/OrLabelV3/OrLabel.js';

package/dist/bundled/v3/{OrMenu.vue_vue_type_script_lang-0f6c605e.js → OrMenu.vue_vue_type_script_lang-02cd817e.js}

@@ -1,7 +1,7 @@
 import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { Menu } from './components/OrMenuV3/styles.js';
 import './components/OrPopoverV3/OrPopover.js';
-import { s as script$1 } from './OrPopover.vue_vue_type_script_lang-e02f10d1.js';
+import { s as script$1 } from './OrPopover.vue_vue_type_script_lang-12d563f5.js';
 import { PopoverPlacement } from './components/OrPopoverV3/props.js';
 import { usePopoverState } from './hooks/usePopoverState.js';
 
@@ -16,7 +16,7 @@ var script = defineComponent({
       default: false
     },
     trigger: {
-      type: HTMLElement,
+      type: Object,
       default: undefined
     },
     placement: {