@onereach/ui-components 2.62.3-beta.1899.0 → 2.62.3-beta.1902.0

package/dist/v3/index64.js

@@ -1,7 +1,6 @@
-export { s as OrSelectV3 } from './OrSelect-9d821ef2.js';
+export { s as OrSelectV3 } from './OrSelect-32f188bd.js';
 export { a as SelectSize } from './OrInputBox-634230b1.js';
 import 'vue-demi';
-import './dropdown-open-0d314aa4.js';
 import './useClassAttribute-47fdb016.js';
 import './useOverflow-ac506c65.js';
 import '@vueuse/core';
@@ -13,9 +12,9 @@ import './OrError-19a62a18.js';
 import './OrExpansionPanel-1e2a6375.js';
 import './OrIcon-b3906e35.js';
 import './OrHint-73835593.js';
-import './OrInput-f51916d4.js';
-import './OrIconButton-f9226adf.js';
-import './OrTooltip-30e05f9e.js';
+import './OrInput-d34c8571.js';
+import './OrIconButton-eef9eb43.js';
+import './OrTooltip-36c6728c.js';
 import './OrPopover-3525c670.js';
 import '@floating-ui/dom';
 import './useElevation-0e973238.js';
@@ -24,4 +23,4 @@ import './OrBottomSheet-9de57dd0.js';
 import './OrOverlay-27050c19.js';
 import './OrTeleport.vue3-8099178c.js';
 import './OrMenuItem-8773d073.js';
-import './OrTag-60585386.js';
+import './OrTag-d1f3a0d0.js';

package/dist/v3/index79.js

@@ -1,11 +1,11 @@
-export { s as OrTagV3, a as TagColor, T as TagVariant } from './OrTag-60585386.js';
+export { s as OrTagV3, a as TagColor, T as TagVariant } from './OrTag-d1f3a0d0.js';
 import 'vue-demi';
 import './useClassAttribute-47fdb016.js';
 import '@vueuse/core';
-import './OrIconButton-f9226adf.js';
+import './OrIconButton-eef9eb43.js';
 import './OrIcon-b3906e35.js';
 import 'vue';
-import './OrTooltip-30e05f9e.js';
+import './OrTooltip-36c6728c.js';
 import './OrPopover-3525c670.js';
 import '@floating-ui/dom';
 import './useElevation-0e973238.js';

package/dist/v3/index87.js

@@ -1,13 +1,13 @@
-export { a as OrToastContainerV3, s as OrToastV3, t as TypesV3 } from './types-e4403486.js';
+export { a as OrToastContainerV3, s as OrToastV3, t as TypesV3 } from './types-8ff779b1.js';
 export { p as PropsV3, a as useQueueV3, u as useToastV3 } from './useToast-0665462d.js';
 import '@vueuse/core';
 import 'vue-demi';
 import './OrTeleport.vue3-8099178c.js';
 import 'vue';
-import './OrIconButton-f9226adf.js';
+import './OrIconButton-eef9eb43.js';
 import './useClassAttribute-47fdb016.js';
 import './OrIcon-b3906e35.js';
-import './OrTooltip-30e05f9e.js';
+import './OrTooltip-36c6728c.js';
 import './OrPopover-3525c670.js';
 import '@floating-ui/dom';
 import './useElevation-0e973238.js';

package/dist/v3/index90.js

@@ -1,4 +1,4 @@
-export { s as OrTooltipV3 } from './OrTooltip-30e05f9e.js';
+export { s as OrTooltipV3 } from './OrTooltip-36c6728c.js';
 export { P as TooltipPlacement } from './OrPopover-3525c670.js';
 import '@vueuse/core';
 import 'vue-demi';

package/dist/v3/index91.js

@@ -1,2 +1,7 @@
-export { D as DropdownClose, a as DropdownOpen } from './dropdown-open-0d314aa4.js';
+export { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
+export { u as useElevation } from './useElevation-0e973238.js';
+export { u as useOverflow } from './useOverflow-ac506c65.js';
+export { u as useResponsive } from './useResponsive-a02e95b7.js';
+export { u as useToggle } from './useToggle-29e4d7c7.js';
 import 'vue-demi';
+import '@vueuse/core';

package/dist/v3/index92.js

@@ -1,7 +1,3 @@
-export { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
-export { u as useElevation } from './useElevation-0e973238.js';
-export { u as useOverflow } from './useOverflow-ac506c65.js';
 export { u as useResponsive } from './useResponsive-a02e95b7.js';
-export { u as useToggle } from './useToggle-29e4d7c7.js';
-import 'vue-demi';
 import '@vueuse/core';
+import 'vue-demi';

package/dist/v3/{types-e4403486.js → types-8ff779b1.js}

@@ -2,7 +2,7 @@ import { useToggle } from '@vueuse/core';
 import { defineComponent, ref, computed, onBeforeMount, onBeforeUnmount, nextTick } from 'vue-demi';
 import { s as script$4 } from './OrTeleport.vue3-8099178c.js';
 import { T as ToastType, P as PositionsX, b as PositionsY, c as TransitionType, d as useToastEventBus, a as useQueue } from './useToast-0665462d.js';
-import { s as script$2 } from './OrIconButton-f9226adf.js';
+import { s as script$2 } from './OrIconButton-eef9eb43.js';
 import { s as script$3 } from './OrLoader-60943812.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createVNode, toDisplayString, createElementVNode, createBlock, withModifiers, withCtx, TransitionGroup, Fragment, renderList, mergeProps } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/ui-components",
-  "version": "2.62.3-beta.1899.0",
+  "version": "2.62.3-beta.1902.0",
   "description": "Vue components library for v2/3",
   "sideEffects": false,
   "main": "./dist/auto/index.js",

package/src/components/or-select-v3/OrSelect.vue

@@ -21,7 +21,7 @@
 
     <OrInputBox
       ref="inputBox"
-      v-dropdown-open="toggle"
+      v-dropdown-open="open"
       v-dropdown-close="close"
       :class="[popoverState === 'open' && 'rounded-b-0']"
       :size="size"
@@ -208,7 +208,8 @@
 
 <script lang="ts">
 import { computed, defineComponent, getCurrentInstance, onMounted, PropType, ref, watch } from 'vue-demi';
-import { DropdownClose, DropdownOpen } from '../../directives';
+import { DropdownClose } from '../../directives/dropdown-close';
+import { DropdownOpen } from '../../directives/dropdown-open';
 import { useClassAttribute, useOverflow } from '../../hooks';
 import { OrCheckboxV3 as OrCheckbox } from '../or-checkbox-v3';
 import { OrErrorV3 as OrError } from '../or-error-v3';
@@ -464,16 +465,12 @@ export default defineComponent({
     });
 
     // Methods
-    function toggle(): void {
+    function open(): void {
       if (!readonly.value && !props.disabled) {
         const popoverInstance = popover.value;
 
         if (popoverInstance) {
-          if (popoverState.value === 'open') {
-            (popoverInstance.close as () => void)();
-          } else {
-            (popoverInstance.open as () => void)();
-          }
+          (popoverInstance.open as () => void)();
         }
       }
     }
@@ -518,7 +515,7 @@ export default defineComponent({
       internalSearchOptions,
       resolvedSearchOptions,
       groupedOptions,
-      toggle,
+      open,
       close,
       deselect,
       innerItems,

package/src/components/or-tooltip-v3/OrTooltip.vue

@@ -30,7 +30,7 @@ import { computed, defineComponent, PropType, ref, watch } from 'vue-demi';
 import { useClassAttribute } from '../../hooks';
 import { OrPopoverV3 as OrPopover } from '../or-popover-v3';
 import { TooltipPlacement } from './props';
-import { TooltipBody, TooltipRoot } from './styles';
+import { TooltipBody, TooltipBodyPlacements, TooltipRoot } from './styles';
 
 export default defineComponent({
   name: 'OrTooltip',
@@ -63,7 +63,7 @@ export default defineComponent({
     'close',
   ],
 
-  setup() {
+  setup(props) {
     // Refs
     const root = ref<HTMLElement>();
 
@@ -81,6 +81,7 @@ export default defineComponent({
 
     const bodyStyles = computed(() => [
       ...TooltipBody,
+      ...TooltipBodyPlacements[props.placement],
     ]);
 
     // Methods

package/src/components/or-tooltip-v3/styles.ts

@@ -1,3 +1,5 @@
+import { TooltipPlacement } from './props';
+
 export const TooltipRoot: string[] = [
   // Layout
   'inline-block',
@@ -9,6 +11,9 @@ export const TooltipBody: string[] = [
   'rounded-sm',
 
   // Sizing
+  'mx-sm',
+  'my-sm',
+
   'px-sm',
   'py-xs',
 
@@ -22,3 +27,53 @@ export const TooltipBody: string[] = [
   'text-inverse-on-surface',
   'dark:text-inverse-on-surface-dark',
 ];
+
+export const TooltipBodyPlacements: Record<TooltipPlacement, string[]> = {
+  'top': [],
+
+  'top-start': [
+    // Sizing
+    'ml-none',
+  ],
+
+  'top-end': [
+    // Sizing
+    'mr-none',
+  ],
+
+  'bottom': [],
+
+  'bottom-start': [
+    // Sizing
+    'ml-none',
+  ],
+
+  'bottom-end': [
+    // Sizing
+    'mr-none',
+  ],
+
+  'left': [],
+
+  'left-start': [
+    // Sizing
+    'mt-none',
+  ],
+
+  'left-end': [
+    // Sizing
+    'mb-none',
+  ],
+
+  'right': [],
+
+  'right-start': [
+    // Sizing
+    'mt-none',
+  ],
+
+  'right-end': [
+    // Sizing
+    'mb-none',
+  ],
+};

package/src/index.ts

@@ -1,4 +1,3 @@
 export * from './components';
-export * from './directives';
 export * from './hooks';
 export * from './utils/functions/text';

package/dist/v2/directives/index.d.ts

@@ -1,2 +0,0 @@
-export * from './dropdown-close';
-export * from './dropdown-open';

package/dist/v2/dropdown-open-0d314aa4.js

@@ -1,28 +0,0 @@
-import { isVue3 } from 'vue-demi';
-
-const created$1 = (element, binding) => {
-  element.addEventListener('keydown', event => {
-    event.preventDefault();
-    if (['Escape'].includes(event.key)) {
-      binding.value(event);
-    }
-  });
-};
-const DropdownClose = {
-  [isVue3 ? 'created' : 'bind']: created$1
-};
-
-const created = (element, binding) => {
-  element.addEventListener('keydown', event => {
-    event.preventDefault();
-    if (['Enter', ' '].includes(event.key)) {
-      binding.value(event);
-    }
-  });
-  element.addEventListener('click', binding.value);
-};
-const DropdownOpen = {
-  [isVue3 ? 'created' : 'bind']: created
-};
-
-export { DropdownClose as D, DropdownOpen as a };

package/dist/v2/index93.js

@@ -1,3 +0,0 @@
-export { u as useResponsive } from './useResponsive-a02e95b7.js';
-import '@vueuse/core';
-import 'vue-demi';

package/dist/v3/directives/index.d.ts

@@ -1,2 +0,0 @@
-export * from './dropdown-close';
-export * from './dropdown-open';

package/dist/v3/dropdown-open-0d314aa4.js

@@ -1,28 +0,0 @@
-import { isVue3 } from 'vue-demi';
-
-const created$1 = (element, binding) => {
-  element.addEventListener('keydown', event => {
-    event.preventDefault();
-    if (['Escape'].includes(event.key)) {
-      binding.value(event);
-    }
-  });
-};
-const DropdownClose = {
-  [isVue3 ? 'created' : 'bind']: created$1
-};
-
-const created = (element, binding) => {
-  element.addEventListener('keydown', event => {
-    event.preventDefault();
-    if (['Enter', ' '].includes(event.key)) {
-      binding.value(event);
-    }
-  });
-  element.addEventListener('click', binding.value);
-};
-const DropdownOpen = {
-  [isVue3 ? 'created' : 'bind']: created
-};
-
-export { DropdownClose as D, DropdownOpen as a };

package/dist/v3/index93.js

@@ -1,3 +0,0 @@
-export { u as useResponsive } from './useResponsive-a02e95b7.js';
-import '@vueuse/core';
-import 'vue-demi';

package/src/directives/index.ts

@@ -1,2 +0,0 @@
-export * from './dropdown-close';
-export * from './dropdown-open';