@sepveneto/free-dom 0.4.1 → 0.4.2

package/dist/index.css

@@ -1,4 +1,4 @@
-/* ../../../../../../../tmp/tmp-1788-ZUBazkQPDiBa/core/src/style/index.css */
+/* ../../../../../../../tmp/tmp-1778-6uk8ditWyl3v/core/src/style/index.css */
 :root {
   --free-dom-theme: #4089ef;
   --free-dom-line: var(--free-dom-theme);

package/dist/index.js

@@ -242,12 +242,31 @@ var FreeDom = (0, import_vue_demi2.defineComponent)({
       init && triggerThrottle();
       init = true;
     });
+    const rectBound = (0, import_core.useElementBounding)(widgetRef);
+    const unwatchHeight = (0, import_vue_demi2.watch)(rectBound.height, (height) => {
+      if (height) {
+        _rect.height = height;
+        unwatchHeight();
+      }
+    });
+    const unwatchWidth = (0, import_vue_demi2.watch)(rectBound.width, (width) => {
+      if (width) {
+        _rect.width = width;
+        unwatchWidth();
+      }
+    });
     (0, import_vue_demi2.onMounted)(async () => {
       SceneContext?.register(uuid, context);
       await (0, import_vue_demi2.nextTick)();
       const rect = widgetRef.value.getBoundingClientRect();
       _rect.width = _rect.width || rect.width;
+      if (_rect.width) {
+        unwatchWidth();
+      }
       _rect.height = _rect.height || rect.height;
+      if (_rect.height) {
+        unwatchHeight();
+      }
       _rect.x = _rect.x || 0;
       _rect.y = _rect.y || 0;
       trigger();

package/dist/index.mjs

@@ -17,7 +17,8 @@ import {
   reactive,
   isVue2,
   shallowRef,
-  watchEffect
+  watchEffect,
+  watch as watch2
 } from "vue-demi";
 
 // src/hooks/use-normalize-style.ts
@@ -125,7 +126,7 @@ function useResize(startX, startY, rect, dot, diagonal, snapGrid, callbacks) {
 }
 
 // src/components/freeDom.ts
-import { onClickOutside, useThrottleFn } from "@vueuse/core";
+import { onClickOutside, useThrottleFn, useElementBounding } from "@vueuse/core";
 import { v4 as uuidv4 } from "uuid";
 var Dots = ["t", "r", "l", "b", "lt", "lb", "rt", "rb"];
 var FreeDom = defineComponent({
@@ -229,12 +230,31 @@ var FreeDom = defineComponent({
       init && triggerThrottle();
       init = true;
     });
+    const rectBound = useElementBounding(widgetRef);
+    const unwatchHeight = watch2(rectBound.height, (height) => {
+      if (height) {
+        _rect.height = height;
+        unwatchHeight();
+      }
+    });
+    const unwatchWidth = watch2(rectBound.width, (width) => {
+      if (width) {
+        _rect.width = width;
+        unwatchWidth();
+      }
+    });
     onMounted(async () => {
       SceneContext?.register(uuid, context);
       await nextTick();
       const rect = widgetRef.value.getBoundingClientRect();
       _rect.width = _rect.width || rect.width;
+      if (_rect.width) {
+        unwatchWidth();
+      }
       _rect.height = _rect.height || rect.height;
+      if (_rect.height) {
+        unwatchHeight();
+      }
       _rect.x = _rect.x || 0;
       _rect.y = _rect.y || 0;
       trigger();
@@ -461,7 +481,7 @@ var FreeDom = defineComponent({
 
 // src/components/freeDomWrap.ts
 import { defineComponent as defineComponent3, shallowRef as shallowRef3, h as h3, provide, reactive as reactive3, ref as ref4, toRefs } from "vue-demi";
-import { useElementBounding } from "@vueuse/core";
+import { useElementBounding as useElementBounding2 } from "@vueuse/core";
 
 // src/components/markLine.ts
 import { h as h2, defineComponent as defineComponent2, shallowRef as shallowRef2, ref as ref3, reactive as reactive2, inject as inject2, onBeforeUnmount } from "vue-demi";
@@ -655,7 +675,7 @@ var FreeDomWrap = defineComponent3({
   props: freeDomWrapProps,
   setup(props) {
     const rectRef = shallowRef3(null);
-    const rect = useElementBounding(rectRef);
+    const rect = useElementBounding2(rectRef);
     const nodes = ref4([]);
     function register(uuid, node) {
       nodes.value.push({ uuid, node });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sepveneto/free-dom",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",