@v1nt1248/3nclient-lib 0.2.55 → 0.2.57

package/dist/utils/ui/has-slot-content.d.ts

@@ -1,2 +1,2 @@
-import { Slot } from 'vue';
+import { Slot } from '../../../vue/dist/vue.esm-bundler.js';
 export declare function hasSlotContent(slot?: Slot, slotProps?: {}): boolean;

package/package.json

@@ -2,7 +2,7 @@
   "name": "@v1nt1248/3nclient-lib",
   "license": "AGPL-3.0-or-later",
   "author": "v1nt1248",
-  "version": "0.2.55",
+  "version": "0.2.57",
   "description": "Library for 3NWeb clients",
   "type": "module",
   "files": [
@@ -61,7 +61,7 @@
   },
   "peerDependencies": {
     "pinia": "3.0.3",
-    "vue": "3.5.21"
+    "vue": "3.5.22"
   },
   "devDependencies": {
     "@eslint/eslintrc": "^3.3.1",
@@ -74,7 +74,7 @@
     "@vitejs/plugin-vue": "6.0.1",
     "@vue/compiler-core": "3.5.21",
     "@vue/eslint-config-typescript": "14.6.0",
-    "@vue/runtime-core": "3.5.21",
+    "@vue/runtime-core": "3.5.22",
     "@vuedx/typescript-plugin-vue": "0.7.6",
     "eslint": "9.34.0",
     "eslint-config-prettier": "10.1.8",
@@ -103,11 +103,11 @@
     "vite-plugin-dts": "4.5.4",
     "vite-plugin-vue-devtools": "^7.7.7",
     "vitepress": "1.6.4",
-    "vue": "3.5.21",
+    "vue": "3.5.22",
     "vue-eslint-parser": "^10.2.0",
-    "vue-tsc": "3.0.6"
+    "vue-tsc": "3.1.1"
   },
-  "packageManager": "pnpm@10.16.0",
+  "packageManager": "pnpm@10.18.2",
   "pnpm": {
     "peerDependencyRules": {
       "ignoreMissing": [

package/src/components/ui3n-menu/types.ts

@@ -5,6 +5,7 @@ export interface Ui3nMenuProps {
   triggerElement?: HTMLElement;
   positionStrategy?: 'absolute' | 'fixed';
   positionAutoupdate?: boolean;
+  allowFlip?: boolean;
   offsetX?: number;
   offsetY?: number;
   contentBorderRadius?: number | number[];

package/src/components/ui3n-menu/ui3n-menu.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-  import { computed, ref, watch } from 'vue';
+  import { computed, ref, watch, useTemplateRef } from 'vue';
   import { autoUpdate, flip, useFloating, offset, shift } from '@floating-ui/vue';
   import { default as vClickOutside } from '../../directives/ui3n-click-outside';
   import type { Ui3nMenuEmits, Ui3nMenuProps, Ui3nMenuSlots, Ui3nMenuExpose } from './types';
@@ -10,6 +10,7 @@
     offsetX: 0,
     offsetY: 0,
     contentBorderRadius: 4,
+    allowFlip: true,
     zIndex: 1000,
     closeOnClick: true,
     closeOnClickOutside: true,
@@ -18,9 +19,8 @@
   const emits = defineEmits<Ui3nMenuEmits>();
   defineSlots<Ui3nMenuSlots>();
 
-  const menuElement = ref<HTMLDivElement | null>(null);
-  const menuTriggerElement = ref<HTMLDivElement | null>(null);
-  const menuContentElement = ref<HTMLDivElement | null>(null);
+  const menuTriggerElement = useTemplateRef<HTMLDivElement>('menu-trigger-element');
+  const menuContentElement = useTemplateRef<HTMLDivElement>('menu-content-element');
   const isShow = ref(false);
 
   const outerTriggerElement = ref<Nullable<HTMLElement>>(props.triggerElement || null);
@@ -37,6 +37,24 @@
   });
   const zIndexCss = computed(() => props.zIndex);
 
+  const middleware = [
+    offset({
+      mainAxis: props.offsetY,
+      crossAxis: props.offsetX + 2,
+    }),
+  ];
+
+  if (props.allowFlip) {
+    middleware.push(
+      flip({
+        fallbackAxisSideDirection: 'end',
+        fallbackPlacements: ['top-end', 'bottom-end'],
+      }),
+    );
+  }
+
+  middleware.push(shift());
+
   const {
     floatingStyles,
     isPositioned,
@@ -47,18 +65,7 @@
     {
       placement: 'bottom-start',
       strategy: props.positionStrategy,
-      middleware: [
-        offset({
-          mainAxis: props.offsetY,
-          crossAxis: props.offsetX + 2,
-        }),
-        flip({
-          fallbackAxisSideDirection: 'end',
-          flipAlignment: false,
-          fallbackPlacements: ['bottom-end'],
-        }),
-        shift(),
-      ],
+      middleware,
       whileElementsMounted: props.positionAutoupdate || props.positionStrategy === 'fixed' ? autoUpdate : undefined,
     });
 
@@ -128,11 +135,11 @@
 
 <template>
   <div
-    ref="menuElement"
+    ref="menu-element"
     :class="$style.ui3nMenu"
   >
     <div
-      ref="menuTriggerElement"
+      ref="menu-trigger-element"
       :class="[$style.ui3nMenuTrigger, disabled && $style.ui3nMenuTriggerDisabled]"
       @click.stop="toggleMenu"
     >
@@ -141,7 +148,7 @@
 
     <div
       v-if="isShow"
-      ref="menuContentElement"
+      ref="menu-content-element"
       v-click-outside="onClickOutside"
       :style="floatingStyles"
       :class="$style.ui3nMenuContent"