@veritree/ui 0.47.0 → 0.48.1

package/mixins/floating-ui.js

@@ -1,6 +1,13 @@
 import { computePosition, flip, shift, offset, size } from '@floating-ui/dom';
 
 export const floatingUiMixin = {
+  props: {
+    offset: {
+      type: [Number, String],
+      default: 5,
+    },
+  },
+
   data() {
     return {
       component: null,
@@ -40,7 +47,7 @@ export const floatingUiMixin = {
       computePosition(trigger, content, {
         placement: this.placement,
         middleware: [
-          offset(5),
+          offset(Number(this.offset)),
           flip(),
           shift({ padding: 5 }),
           size({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veritree/ui",
-  "version": "0.47.0",
+  "version": "0.48.1",
   "description": "veritree ui library",
   "type": "module",
   "main": "index.js",

package/src/components/Popover/VTPopoverDivider.vue

@@ -2,7 +2,7 @@
   <div
     :class="{
       'popover-divider': headless,
-      'h-[1px]': !headless,
+      '-mx-3 my-2 h-[1px]': !headless,
     }"
   ></div>
 </template>

package/src/components/Tooltip/VTTooltip.vue

@@ -18,18 +18,30 @@ export default {
       type: [String, Number],
       default: 500,
     },
+    /**
+     * Determines whether the button will use its default atomic style (tailwind) or its default class
+     * @type {boolean}
+     * @values
+     * - true: The button will have no default style and can be fully customized with a custom class
+     * - false: The button will use its default atomic style (tailwind) and can be further customized with additional classes
+     * @default null
+     */
+    headless: {
+      type: Boolean,
+      default: false,
+    },
+    /**
+     * The placement of the component relative to its trigger element.
+     * @type {string}
+     * @values 'top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end'
+     * @default 'bottom-start'
+     */
     placement: {
       type: String,
       default: 'bottom',
     },
   },
 
-  data() {
-    return {
-      floatingUiMinWidth: 0,
-    };
-  },
-
   provide() {
     return {
       apiTooltip: () => {
@@ -59,6 +71,7 @@ export default {
   data() {
     return {
       componentId: genId(),
+      floatingUiMinWidth: 0,
     };
   },
 };