@onereach/ui-components 4.7.0-beta.2802.0 → 4.7.0-beta.2811.0

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

@@ -1,6 +1,6 @@
 import { defineComponent, ref, getCurrentInstance } from 'vue-demi';
 import { InlineTextEditTypes, InlineTextEditTrimmingTypes } from './constants.js';
-import { u as useVModel } from '../../index-2ae26715.js';
+import { u as useVModel } from '../../index-6d94f832.js';
 import { s as setStyle, r as requestAF, g as getCS, a as reflow, c as cancelAF } from '../../dom-700444b4.js';
 import { pxToRem } from '../../utils/functions/px-to-rem.js';
 import __vue_component__$1 from '../OrCollapse/OrCollapse.js';
@@ -8,7 +8,7 @@ import __vue_component__$2 from '../OrError/OrError.js';
 import __vue_component__$3 from '../OrIconButtonV2/OrIconButton.js';
 import { s as styleInject } from '../../style-inject.es-4c6f2515.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
-import '../../index-cbe0a12b.js';
+import '../../index-8a1b5b9c.js';
 import '../../isObject-fe8b81fd.js';
 import '../../get-ab1b7d93.js';
 import '../../toString-f3196832.js';

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

@@ -1,8 +1,8 @@
 export { default as OrInlineTextEdit } from './OrInlineTextEdit.js';
 export { InlineTextEditTrimmingTypes, InlineTextEditTypes } from './constants.js';
 import 'vue-demi';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../../dom-700444b4.js';
 import '../../isObject-fe8b81fd.js';
 import '../../get-ab1b7d93.js';

package/dist/bundled/v2/components/OrInlineTextareaV3/OrInlineTextarea.js

@@ -17,11 +17,11 @@ import '../OrIconButtonV3/styles.js';
 import '../OrIconV3/OrIcon.js';
 import '../OrIconV3/styles.js';
 import '../OrTooltipV3/OrTooltip.js';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
 import '../OrTooltipV3/styles.js';
 import '../OrPopoverV3/OrPopover.js';
 import '../../floating-ui.dom.esm-83eba816.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../OrPopoverV3/props.js';
 import '../OrPopoverV3/styles.js';
 import '../OrBottomSheetV3/OrBottomSheet.js';
@@ -33,6 +33,7 @@ import '../OrTeleportV3/OrTeleport.js';
 import 'vue';
 import '../../hooks/useElevation.js';
 import '../../utils/isVisible.js';
+import '../../hooks/usePopoverState.js';
 import '../../hooks/useResponsive/useResponsive.js';
 import '../OrInlineInputBoxV3/props.js';
 import '../OrInlineInputBoxV3/styles.js';

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

@@ -13,11 +13,11 @@ import '../OrIconButtonV3/styles.js';
 import '../OrIconV3/OrIcon.js';
 import '../OrIconV3/styles.js';
 import '../OrTooltipV3/OrTooltip.js';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
 import '../OrTooltipV3/styles.js';
 import '../OrPopoverV3/OrPopover.js';
 import '../../floating-ui.dom.esm-83eba816.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../OrPopoverV3/props.js';
 import '../OrPopoverV3/styles.js';
 import '../OrBottomSheetV3/OrBottomSheet.js';
@@ -29,6 +29,7 @@ import '../OrTeleportV3/OrTeleport.js';
 import 'vue';
 import '../../hooks/useElevation.js';
 import '../../utils/isVisible.js';
+import '../../hooks/usePopoverState.js';
 import '../../hooks/useResponsive/useResponsive.js';
 import '../OrInlineInputBoxV3/OrInlineInputBox.js';
 import '../OrInlineInputBoxV3/props.js';

package/dist/bundled/v2/components/OrInputV3/OrInput.js

@@ -22,11 +22,11 @@ import '../OrIconV3/styles.js';
 import '../OrIconButtonV3/props.js';
 import '../OrIconButtonV3/styles.js';
 import '../OrTooltipV3/OrTooltip.js';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
 import '../OrTooltipV3/styles.js';
 import '../OrPopoverV3/OrPopover.js';
 import '../../floating-ui.dom.esm-83eba816.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../OrPopoverV3/props.js';
 import '../OrPopoverV3/styles.js';
 import '../OrBottomSheetV3/OrBottomSheet.js';
@@ -38,6 +38,7 @@ import '../OrTeleportV3/OrTeleport.js';
 import 'vue';
 import '../../hooks/useElevation.js';
 import '../../utils/isVisible.js';
+import '../../hooks/usePopoverState.js';
 import '../OrInputBoxV3/styles.js';
 import '../OrLabelV3/props.js';
 import '../OrLabelV3/styles.js';

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

@@ -15,11 +15,11 @@ import '../OrIconButtonV3/OrIconButton.js';
 import '../OrIconButtonV3/props.js';
 import '../OrIconButtonV3/styles.js';
 import '../OrTooltipV3/OrTooltip.js';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
 import '../OrTooltipV3/styles.js';
 import '../OrPopoverV3/OrPopover.js';
 import '../../floating-ui.dom.esm-83eba816.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../OrPopoverV3/props.js';
 import '../OrPopoverV3/styles.js';
 import '../OrBottomSheetV3/OrBottomSheet.js';
@@ -31,6 +31,7 @@ import '../OrTeleportV3/OrTeleport.js';
 import 'vue';
 import '../../hooks/useElevation.js';
 import '../../utils/isVisible.js';
+import '../../hooks/usePopoverState.js';
 import '../../hooks/useResponsive/useResponsive.js';
 import '../OrInputBoxV3/OrInputBox.js';
 import '../OrInputBoxV3/styles.js';

package/dist/bundled/v2/components/OrLoaderV3/OrLoader.js

@@ -1,9 +1,9 @@
-import { h as useElementSize } from '../../index-2ae26715.js';
+import { h as useElementSize } from '../../index-6d94f832.js';
 import { defineComponent, ref, computed } from 'vue-demi';
 import { LoaderVariant, LoaderColor, LoaderSize } from './props.js';
 import { LoaderRoot, LoaderRootColors, LoaderTitle, LoaderDescription, LoaderContainer } from './styles.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
-import '../../index-cbe0a12b.js';
+import '../../index-8a1b5b9c.js';
 
 var script = defineComponent({
   name: 'OrLoader',

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

@@ -1,7 +1,7 @@
 export { default as OrLoaderV3 } from './OrLoader.js';
 export { LoaderColor, LoaderSize, LoaderVariant } from './props.js';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import 'vue-demi';
 import './styles.js';
 import '../../normalize-component-6e8e3d80.js';

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

@@ -1,11 +1,12 @@
-import { defineComponent, ref, computed } from 'vue-demi';
+import { defineComponent, ref, computed, toRef } from 'vue-demi';
 import { MenuRoot } from './styles.js';
 import __vue_component__$1 from '../OrPopoverV3/OrPopover.js';
+import { usePopoverState } from '../../hooks/usePopoverState.js';
 import { PopoverPlacement } from '../OrPopoverV3/props.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
 import '../../floating-ui.dom.esm-83eba816.js';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../OrPopoverV3/styles.js';
 import '../OrBottomSheetV3/OrBottomSheet.js';
 import '../OrBottomSheetV3/props.js';
@@ -25,6 +26,10 @@ var script = defineComponent({
   },
   inheritAttrs: false,
   props: {
+    isOpen: {
+      type: Boolean,
+      default: false
+    },
     trigger: {
       type: HTMLElement,
       default: undefined
@@ -34,68 +39,36 @@ var script = defineComponent({
       default: PopoverPlacement.Bottom
     }
   },
-  emits: ['update:state'],
-  expose: ['root', 'state', 'isOpen', 'open', 'close', 'toggle'],
-  setup() {
+  emits: ['update:state', 'open', 'close'],
+  expose: ['root', 'state', 'open', 'close', 'toggle'],
+  setup(props, context) {
     // Refs
     const root = ref();
-    const popover = ref();
-    const popoverRoot = computed(() => {
-      var _a;
-      return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.root;
-    });
-    const popoverState = computed(() => {
-      var _a;
-      return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.state;
-    });
     // Styles
     const rootStyles = computed(() => ['or-menu-v3', ...MenuRoot]);
     // State
-    const isOpen = computed(() => {
-      var _a;
-      return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.isOpen;
-    });
-    // Methods
-    function open() {
-      const popoverInstance = popover.value;
-      if (popoverInstance) {
-        popoverInstance.open();
-      }
-    }
-    function close() {
-      const popoverInstance = popover.value;
-      if (popoverInstance) {
-        popoverInstance.close();
-      }
-    }
-    function toggle() {
-      isOpen.value ? close() : open();
-    }
+    const {
+      state,
+      open,
+      close,
+      toggle
+    } = usePopoverState(toRef(props, 'isOpen'), context);
     // Handlers
     function onClick(event) {
       const path = event.composedPath();
-      const classLists = path.filter(_ref => {
+      if (path.some(_ref => {
         let {
           classList
         } = _ref;
-        return !!classList;
-      }).map(_ref2 => {
-        let {
-          classList
-        } = _ref2;
-        return classList;
-      });
-      if (classLists.some(classList => classList.contains('or-menu-item-v3'))) {
+        return classList === null || classList === void 0 ? void 0 : classList.contains('or-menu-item-v3');
+      })) {
         close();
       }
     }
     return {
       root,
-      popover,
-      popoverRoot,
-      state: popoverState,
       rootStyles,
-      isOpen,
+      state,
       open,
       close,
       toggle,
@@ -113,8 +86,8 @@ var __vue_render__ = function () {
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
   return _c('OrPopover', {
-    ref: "popover",
     attrs: {
+      "is-open": _vm.state === 'open',
       "variant": 'auto',
       "trigger": _vm.trigger,
       "placement": _vm.placement,
@@ -123,7 +96,7 @@ var __vue_render__ = function () {
     },
     on: {
       "update:state": function ($event) {
-        return _vm.$emit('update:state', $event);
+        _vm.state = $event;
       }
     }
   }, [_c('div', _vm._b({

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

@@ -2,20 +2,17 @@ import { PropType } from 'vue-demi';
 import { MenuPlacement } from './props';
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    popover: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
-        [x: string]: ((...args: any[]) => any) | null;
-    } | string[], {} & {}, {
-        [x: number]: string;
-    } | {}, true> | undefined>;
-    popoverRoot: import("@vue/composition-api").ComputedRef<undefined>;
-    state: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    isOpen: import("@vue/composition-api").ComputedRef<undefined>;
+    state: import("@vue/composition-api").Ref<"open" | "closed">;
     open: () => void;
     close: () => void;
     toggle: () => void;
     onClick: (event: Event) => void;
 }> & import("@vue/composition-api").Data, {}, {}, {
+    isOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     trigger: {
         type: {
             new (): HTMLElement;
@@ -28,6 +25,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: MenuPlacement;
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
+    isOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     trigger: {
         type: {
             new (): HTMLElement;
@@ -40,31 +41,27 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: MenuPlacement;
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
+    isOpen: boolean;
     trigger: HTMLElement;
     placement: MenuPlacement;
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    popover: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
-        [x: string]: ((...args: any[]) => any) | null;
-    } | string[], {} & {}, {
-        [x: number]: string;
-    } | {}, true> | undefined>;
-    popoverRoot: import("@vue/composition-api").ComputedRef<undefined>;
-    state: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    isOpen: import("@vue/composition-api").ComputedRef<undefined>;
+    state: import("@vue/composition-api").Ref<"open" | "closed">;
     open: () => void;
     close: () => void;
     toggle: () => void;
     onClick: (event: Event) => void;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
+    isOpen: boolean;
     trigger: HTMLElement;
     placement: MenuPlacement;
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
+    isOpen: boolean;
     trigger: HTMLElement;
     placement: MenuPlacement;
 }, true>);

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

@@ -4,8 +4,8 @@ import 'vue-demi';
 import './styles.js';
 import '../OrPopoverV3/OrPopover.js';
 import '../../floating-ui.dom.esm-83eba816.js';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../OrPopoverV3/styles.js';
 import '../OrBottomSheetV3/OrBottomSheet.js';
 import '../OrBottomSheetV3/props.js';
@@ -17,4 +17,5 @@ import 'vue';
 import '../../normalize-component-6e8e3d80.js';
 import '../../hooks/useElevation.js';
 import '../../utils/isVisible.js';
+import '../../hooks/usePopoverState.js';
 import '../../hooks/useResponsive/useResponsive.js';

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

@@ -1,7 +1,7 @@
 import { ref, watch, defineComponent, onBeforeUnmount } from 'vue-demi';
 import { OrModalSizes } from './constants.js';
-import { i as unrefElement, o as onClickOutside } from '../../index-2ae26715.js';
-import { t as tryOnScopeDispose } from '../../index-cbe0a12b.js';
+import { i as unrefElement, o as onClickOutside } from '../../index-6d94f832.js';
+import { t as tryOnScopeDispose } from '../../index-8a1b5b9c.js';
 import __vue_component__$1 from '../OrIconButtonV2/OrIconButton.js';
 import __vue_component__$2 from '../OrOverlay/OrOverlay.js';
 import { s as styleInject } from '../../style-inject.es-4c6f2515.js';

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

@@ -1,8 +1,8 @@
 export { default as OrModal } from './OrModal.js';
 export { OrModalSizes } from './constants.js';
 import 'vue-demi';
-import '../../index-2ae26715.js';
-import '../../index-cbe0a12b.js';
+import '../../index-6d94f832.js';
+import '../../index-8a1b5b9c.js';
 import '../OrIconButtonV2/OrIconButton.js';
 import '../OrTooltip/OrTooltip.js';
 import '../OrTooltipContent/OrTooltipContent.js';