@ulu/frontend-vue 0.6.2 → 0.6.3

package/dist/composables/useUluFloating.d.ts

@@ -4,10 +4,12 @@
 /**
  * @typedef {object} UluFloatingConfig
  * @property {Placement} placement - The placement of the floating element.
- * @property {boolean} inline - Whether the floating element is inline.
- * @property {number} offset - The offset of the floating element.
- * @property {boolean} arrow - Whether the floating element has an arrow.
- * @property {function} onReady - Callback function when the floating element is ready.
+ * @property {Boolean|Object} inline - Whether the floating element is inline. If object is passed will be passed as configuration for the floating ui "inline" plugin.
+ * @property {Number|Object} offset - The offset of the floating element. If object is passed will be passed as configuration for the floating ui "offset" plugin.
+ * @property {Object} flip - This plugin is always added, if object is passed will be passed as configuration for the floating ui "flip" plugin.
+ * @property {Object} shift - This plugin is always added, if object is passed will be passed as configuration for the floating ui "shift" plugin.
+ * @property {Boolean} arrow - Whether the floating element has an arrow.
+ * @property {Function} onReady - Callback function when the floating element is ready.
  */
 /**
  * Composable for using floating-ui
@@ -32,13 +34,21 @@ export type UluFloatingConfig = {
      */
     placement: Placement;
     /**
-     * - Whether the floating element is inline.
+     * - Whether the floating element is inline. If object is passed will be passed as configuration for the floating ui "inline" plugin.
      */
-    inline: boolean;
+    inline: boolean | Object;
     /**
-     * - The offset of the floating element.
+     * - The offset of the floating element. If object is passed will be passed as configuration for the floating ui "offset" plugin.
      */
-    offset: number;
+    offset: number | Object;
+    /**
+     * - This plugin is always added, if object is passed will be passed as configuration for the floating ui "flip" plugin.
+     */
+    flip: Object;
+    /**
+     * - This plugin is always added, if object is passed will be passed as configuration for the floating ui "shift" plugin.
+     */
+    shift: Object;
     /**
      * - Whether the floating element has an arrow.
      */

package/dist/composables/useUluFloating.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useUluFloating.d.ts","sourceRoot":"","sources":["../../lib/composables/useUluFloating.js"],"names":[],"mappings":"AAcA;;GAEG;AAEH;;;;;;;GAOG;AAEH;;;;;;GAMG;AACH,wCALW,OAAO,KAAK,EAAE,GAAG,CAAC,WAAW,CAAC,WAC9B,OAAO,KAAK,EAAE,GAAG,CAAC,WAAW,CAAC,UAC9B,OAAO,KAAK,EAAE,GAAG,CAAC,iBAAiB,CAAC,GAClC;IAAC,cAAc,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAAC,SAAS,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,SAAS,CAAC,CAAC;IAAC,cAAc,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAAC,MAAM,WAAW;IAAC,YAAY,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IAAC,WAAW,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAAC,YAAY,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,WAAW,CAAC,CAAA;CAAC,CAkE7R;wBAnFY,OAAO,kBAAkB,EAAE,SAAS;;;;;eAKnC,SAAS;;;;YACT,OAAO;;;;YACP,MAAM;;;;WACN,OAAO"}
+{"version":3,"file":"useUluFloating.d.ts","sourceRoot":"","sources":["../../lib/composables/useUluFloating.js"],"names":[],"mappings":"AAcA;;GAEG;AAEH;;;;;;;;;GASG;AAEH;;;;;;GAMG;AACH,wCALW,OAAO,KAAK,EAAE,GAAG,CAAC,WAAW,CAAC,WAC9B,OAAO,KAAK,EAAE,GAAG,CAAC,WAAW,CAAC,UAC9B,OAAO,KAAK,EAAE,GAAG,CAAC,iBAAiB,CAAC,GAClC;IAAC,cAAc,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAAC,SAAS,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,SAAS,CAAC,CAAC;IAAC,cAAc,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAAC,MAAM,WAAW;IAAC,YAAY,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IAAC,WAAW,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAAC,YAAY,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,WAAW,CAAC,CAAA;CAAC,CAkE7R;wBArFY,OAAO,kBAAkB,EAAE,SAAS;;;;;eAKnC,SAAS;;;;YACT,UAAQ,MAAM;;;;YACd,SAAO,MAAM;;;;UACb,MAAM;;;;WACN,MAAM"}

package/dist/composables/useUluFloating.js

@@ -1,46 +1,46 @@
-import { ref as p, computed as r, watch as d } from "vue";
+import { ref as u, computed as n, watch as d } from "vue";
 import { useFloating as v, autoUpdate as F, inline as S, offset as R, flip as U, shift as $, arrow as b } from "@floating-ui/vue";
-function D(m, f, n) {
-  const o = p(null), s = p([]), w = r(() => n.value?.placement), {
+function D(m, f, r) {
+  const s = u(null), o = u([]), w = n(() => r.value?.placement), {
     floatingStyles: h,
     placement: y,
-    middlewareData: l,
-    update: i,
-    isPositioned: a
+    middlewareData: i,
+    update: l,
+    isPositioned: p
   } = v(m, f, {
     placement: w,
     whileElementsMounted: F,
-    middleware: s
+    middleware: o
   });
   d(
-    [n, o],
-    ([e, u]) => {
-      const t = [];
-      e && (e.inline && t.push(S()), e.offset && t.push(R(e.offset)), t.push(U()), t.push($()), e.arrow && u && t.push(b({ element: u })), s.value = t);
+    [r, s],
+    ([t, a]) => {
+      const e = [];
+      t && (t.inline && e.push(S(t.inline)), t.offset && e.push(R(t.offset)), e.push(U(t.flip)), e.push($(t.shift)), t.arrow && a && e.push(b({ element: a })), o.value = e);
     },
     { immediate: !0, deep: !0 }
   );
-  const c = r(() => {
-    const e = l.value?.arrow;
-    return e ? {
+  const x = n(() => {
+    const t = i.value?.arrow;
+    return t ? {
       position: "absolute",
-      left: e?.x != null ? `${e.x}px` : "",
-      top: e?.y != null ? `${e.y}px` : ""
+      left: t?.x != null ? `${t.x}px` : "",
+      top: t?.y != null ? `${t.y}px` : ""
     } : null;
   });
-  d(n, (e) => {
-    e && e.onReady && e.onReady({ update: i, isPositioned: a });
+  d(r, (t) => {
+    t && t.onReady && t.onReady({ update: l, isPositioned: p });
   });
-  const x = r(() => n.value?.strategy === "fixed");
+  const c = n(() => r.value?.strategy === "fixed");
   return {
     floatingStyles: h,
     placement: y,
-    middlewareData: l,
-    update: i,
-    isPositioned: a,
-    arrowStyles: c,
-    contentArrow: o,
-    isFixedStrategy: x
+    middlewareData: i,
+    update: l,
+    isPositioned: p,
+    arrowStyles: x,
+    contentArrow: s,
+    isFixedStrategy: c
   };
 }
 export {