@sepveneto/free-dom 0.9.0 → 0.9.1

package/dist/index.css

@@ -1,4 +1,4 @@
-/* ../../../../../../../tmp/tmp-1880-p3aCZArVLO4k/core/src/style/index.css */
+/* ../../../../../../../tmp/tmp-1888-2C7SiiG2SRG2/core/src/style/index.css */
 :root {
   --vv-free-dom--theme: #4089ef;
   --vv-free-dom--line: var(--vv-free-dom--theme);

package/dist/index.js

@@ -86,7 +86,7 @@ var markLine_default = (0, import_vue_demi2.defineComponent)({
   setup() {
     const SceneContext = (0, import_vue_demi2.inject)(SceneToken);
     const lines = (0, import_vue_demi2.shallowRef)(lineType);
-    const diff = (0, import_vue_demi2.ref)(SceneContext.diff);
+    const diff = (0, import_vue_demi2.computed)(() => SceneContext.diff);
     const nodes = SceneContext.nodes;
     const lineStatus = (0, import_vue_demi2.reactive)({
       xt: {

package/dist/index.mjs

@@ -1,5 +1,5 @@
 // src/components/freeDomWrap.ts
-import { computed as computed7, defineComponent as defineComponent5, onMounted as onMounted3, provide, reactive as reactive3, ref as ref10, shallowRef as shallowRef4, toRefs, watchEffect as watchEffect4 } from "vue-demi";
+import { computed as computed8, defineComponent as defineComponent5, onMounted as onMounted3, provide, reactive as reactive3, ref as ref9, shallowRef as shallowRef4, toRefs, watchEffect as watchEffect4 } from "vue-demi";
 
 // src/util/tokens.ts
 var SceneToken = Symbol("Scene");
@@ -47,7 +47,7 @@ function log(...args) {
 }
 
 // src/components/markLine.ts
-import { defineComponent, h as h2, inject, onBeforeUnmount, reactive, ref, shallowRef } from "vue-demi";
+import { computed, defineComponent, h as h2, inject, onBeforeUnmount, reactive, shallowRef } from "vue-demi";
 var lineType = ["xt", "xc", "xb", "yl", "yc", "yr"];
 var markLine_default = defineComponent({
   props: {
@@ -56,7 +56,7 @@ var markLine_default = defineComponent({
   setup() {
     const SceneContext = inject(SceneToken);
     const lines = shallowRef(lineType);
-    const diff = ref(SceneContext.diff);
+    const diff = computed(() => SceneContext.diff);
     const nodes = SceneContext.nodes;
     const lineStatus = reactive({
       xt: {
@@ -214,16 +214,16 @@ var markLine_default = defineComponent({
 });
 
 // src/hooks/use-normalize-style.ts
-import { ref as ref2, unref, watch } from "vue-demi";
+import { ref, unref, watch } from "vue-demi";
 
 // src/hooks/use-default-slot.ts
-import { computed, useSlots } from "vue-demi";
+import { computed as computed2, useSlots } from "vue-demi";
 function useDefaultSlot() {
   const slots = useSlots();
-  const slotList = computed(() => {
+  const slotList = computed2(() => {
     return typeof slots.default === "function" ? slots.default() : slots.default;
   });
-  const only = computed(() => slotList.value?.[0]);
+  const only = computed2(() => slotList.value?.[0]);
   return {
     slots: slotList,
     only
@@ -231,10 +231,10 @@ function useDefaultSlot() {
 }
 
 // src/hooks/use-core-date.ts
-import { ref as ref3, unref as unref2 } from "vue-demi";
+import { ref as ref2, unref as unref2 } from "vue-demi";
 function useCoreData(node) {
-  const lastX = ref3(NaN);
-  const lastY = ref3(NaN);
+  const lastX = ref2(NaN);
+  const lastY = ref2(NaN);
   function create(x, y) {
     const isStart = isNaN(lastX.value);
     const _node = unref2(node);
@@ -271,13 +271,13 @@ function useCoreData(node) {
 }
 
 // src/hooks/use-draggable-data.ts
-import { ref as ref4, watchEffect } from "vue-demi";
+import { ref as ref3, watchEffect } from "vue-demi";
 function useDraggableData(props) {
-  const x = ref4(props.x || props.modelValue.x || 0);
-  const y = ref4(props.y || props.modelValue.y || 0);
-  const deltaX = ref4(0);
-  const deltaY = ref4(0);
-  const dragData = ref4();
+  const x = ref3(props.x || props.modelValue.x || 0);
+  const y = ref3(props.y || props.modelValue.y || 0);
+  const deltaX = ref3(0);
+  const deltaY = ref3(0);
+  const dragData = ref3();
   watchEffect(() => {
     x.value = props.x || props.modelValue.x || 0;
   });
@@ -322,19 +322,19 @@ function useDraggableData(props) {
 }
 
 // src/hooks/use-scene-context.ts
-import { computed as computed2, inject as inject2, onMounted, onUnmounted } from "vue-demi";
+import { computed as computed3, inject as inject2, onMounted, onUnmounted } from "vue-demi";
 var id = 0;
 function useSceneContext(context, props) {
   const SceneContext = inject2(SceneToken, void 0);
   const uuid = id++;
-  const handle = computed2(() => SceneContext?.handle || props.handle);
-  const lockAspectRatio = computed2(() => SceneContext?.lockAspectRatio || props.lockAspectRatio);
-  const minWidth = computed2(() => SceneContext?.minWidth || props.minWidth);
-  const minHeight = computed2(() => SceneContext?.minHeight || props.minHeight);
-  const disabledDrag = computed2(() => SceneContext?.disabledDrag || props.disabledDrag);
-  const disabledResize = computed2(() => SceneContext?.disabledResize || props.disabledResize);
-  const scale = computed2(() => SceneContext?.scale || props.scale);
-  const fixNonMonospaced = computed2(() => {
+  const handle = computed3(() => SceneContext?.handle || props.handle);
+  const lockAspectRatio = computed3(() => SceneContext?.lockAspectRatio || props.lockAspectRatio);
+  const minWidth = computed3(() => SceneContext?.minWidth || props.minWidth);
+  const minHeight = computed3(() => SceneContext?.minHeight || props.minHeight);
+  const disabledDrag = computed3(() => SceneContext?.disabledDrag || props.disabledDrag);
+  const disabledResize = computed3(() => SceneContext?.disabledResize || props.disabledResize);
+  const scale = computed3(() => SceneContext?.scale || props.scale);
+  const fixNonMonospaced = computed3(() => {
     return SceneContext?.fixNonMonospaced || props.fixNonMonospaced;
   });
   onMounted(() => {
@@ -371,9 +371,9 @@ function useSceneContext(context, props) {
 }
 
 // src/hooks/use-event-bus.ts
-import { ref as ref5 } from "vue-demi";
+import { ref as ref4 } from "vue-demi";
 function useEventBus() {
-  const callbacks = ref5({});
+  const callbacks = ref4({});
   const on = (name, cb) => {
     if (!callbacks.value[name]) {
       callbacks.value[name] = [cb];
@@ -396,10 +396,10 @@ function useEventBus() {
 }
 
 // src/hooks/use-resizable-data.ts
-import { ref as ref6, watchEffect as watchEffect2 } from "vue-demi";
+import { ref as ref5, watchEffect as watchEffect2 } from "vue-demi";
 function useResizableData(props, domRef) {
-  const width = ref6(getWidth());
-  const height = ref6(getHeight());
+  const width = ref5(getWidth());
+  const height = ref5(getHeight());
   watchEffect2(() => {
     width.value = getWidth();
   });
@@ -432,22 +432,22 @@ function useResizableData(props, domRef) {
 }
 
 // src/hooks/use-layout.ts
-import { computed as computed3, ref as ref7, shallowRef as shallowRef2, watchEffect as watchEffect3 } from "vue-demi";
+import { computed as computed4, ref as ref6, shallowRef as shallowRef2, watchEffect as watchEffect3 } from "vue-demi";
 function useLayout(props) {
   const layout = shallowRef2(props.modelValue);
   watchEffect3(() => {
     layout.value = props.modelValue;
   });
-  const cellWidth = computed3(
+  const cellWidth = computed4(
     () => (props.width - margin.value[0] * (cols.value - 1) - (containerPadding.value?.[0] || margin.value[0]) * 2) / props.cols
   );
-  const cols = computed3(() => props.cols);
-  const rowHeight = computed3(() => props.rowHeight);
-  const margin = computed3(() => props.margin);
-  const maxRows = computed3(() => props.maxRows);
-  const containerPadding = computed3(() => props.containerPadding);
-  const minW = computed3(() => props.minW);
-  const minH = computed3(() => props.minH);
+  const cols = computed4(() => props.cols);
+  const rowHeight = computed4(() => props.rowHeight);
+  const margin = computed4(() => props.margin);
+  const maxRows = computed4(() => props.maxRows);
+  const containerPadding = computed4(() => props.containerPadding);
+  const minW = computed4(() => props.minW);
+  const minH = computed4(() => props.minH);
   function getItem(key) {
     return layout.value.find((item) => item.i === key);
   }
@@ -682,46 +682,46 @@ function useLayout(props) {
 }
 function useLayoutItem(props, layout) {
   const { cellWidth, margin, rowHeight, cols, maxRows, containerPadding: cPadding } = layout;
-  const dragging = ref7();
-  const resizing = ref7();
-  const containerPadding = computed3(() => cPadding.value || margin.value);
-  const x = computed3(() => {
+  const dragging = ref6();
+  const resizing = ref6();
+  const containerPadding = computed4(() => cPadding.value || margin.value);
+  const x = computed4(() => {
     if (!dragging.value) {
       return Math.round(props.x * (cellWidth.value + margin.value[0]) + containerPadding.value[0]);
     } else {
       return Math.round(dragging.value.x);
     }
   });
-  const y = computed3(() => {
+  const y = computed4(() => {
     if (!dragging.value) {
       return Math.round(props.y * (rowHeight.value + margin.value[1]) + containerPadding.value[1]);
     } else {
       return Math.round(dragging.value.y);
     }
   });
-  const width = computed3(() => {
+  const width = computed4(() => {
     if (!resizing.value) {
       return Math.round(cellWidth.value * props.width + Math.max(0, props.width - 1) * margin.value[0]);
     } else {
       return Math.round(resizing.value.width);
     }
   });
-  const height = computed3(() => {
+  const height = computed4(() => {
     if (!resizing.value) {
       return Math.round(rowHeight.value * props.height + Math.max(0, props.height - 1) * margin.value[1]);
     } else {
       return Math.round(resizing.value.height);
     }
   });
-  const minWidth = computed3(() => {
+  const minWidth = computed4(() => {
     const minW = layout.minW.value;
     return Math.round(cellWidth.value * minW + Math.max(0, minW - 1) * margin.value[0]);
   });
-  const minHeight = computed3(() => {
+  const minHeight = computed4(() => {
     const minH = layout.minH.value;
     return Math.round(rowHeight.value * minH + Math.max(0, minH - 1) * margin.value[1]);
   });
-  const style = computed3(() => {
+  const style = computed4(() => {
     return {
       position: "absolute",
       width: `${width.value}px`,
@@ -806,10 +806,10 @@ function useLayoutItem(props, layout) {
 }
 
 // src/components/freeDom.ts
-import { computed as computed6, defineComponent as defineComponent4, onMounted as onMounted2, reactive as reactive2, ref as ref9 } from "vue-demi";
+import { computed as computed7, defineComponent as defineComponent4, onMounted as onMounted2, reactive as reactive2, ref as ref8 } from "vue-demi";
 
 // src/components/freeDomCore.ts
-import { computed as computed4, defineComponent as defineComponent2, isVue2 as isVue22, onUnmounted as onUnmounted2, ref as ref8 } from "vue-demi";
+import { computed as computed5, defineComponent as defineComponent2, isVue2 as isVue22, onUnmounted as onUnmounted2, ref as ref7 } from "vue-demi";
 function noop() {
 }
 var freeDomCoreProps = {
@@ -836,10 +836,10 @@ var freeDomCore = defineComponent2({
   props: freeDomCoreProps,
   setup(props) {
     const { only } = useDefaultSlot();
-    const dragging = ref8(false);
-    const coreRef = ref8();
-    const node = computed4(() => coreRef.value?.$el || coreRef.value);
-    const ownerDoc = computed4(() => node.value?.ownerDocument);
+    const dragging = ref7(false);
+    const coreRef = ref7();
+    const node = computed5(() => coreRef.value?.$el || coreRef.value);
+    const ownerDoc = computed5(() => node.value?.ownerDocument);
     const { lastX, lastY, create } = useCoreData(node);
     let parentNode;
     let parentRect;
@@ -969,7 +969,7 @@ var freeDomCore = defineComponent2({
 var freeDomCore_default = freeDomCore;
 
 // src/components/resizeDomCore.ts
-import { computed as computed5, defineComponent as defineComponent3, h as h3, shallowRef as shallowRef3 } from "vue-demi";
+import { computed as computed6, defineComponent as defineComponent3, h as h3, shallowRef as shallowRef3 } from "vue-demi";
 var Dots = ["t", "r", "l", "b", "lt", "lb", "rt", "rb"];
 function noop2() {
 }
@@ -1017,7 +1017,7 @@ var resizeDomCore = defineComponent3({
   props: resizeDomCoreProps,
   setup(props, { slots }) {
     const { slots: _slots } = useDefaultSlot();
-    const dots = computed5(() => {
+    const dots = computed6(() => {
       const _dots = props.scale;
       return Array.isArray(_dots) ? _dots : Dots;
     });
@@ -1185,7 +1185,7 @@ var freeDom = defineComponent4({
     "update:modelValue"
   ],
   setup(props, { emit, expose, slots }) {
-    const domRef = ref9();
+    const domRef = ref8();
     const {
       x,
       y,
@@ -1218,13 +1218,13 @@ var freeDom = defineComponent4({
         sceneContext.minHeight.value
       );
     };
-    const canDrag = ref9(false);
+    const canDrag = ref8(false);
     onMounted2(() => {
       props.autoSize && syncSize();
       const pos = sceneContext.correct(context._rect);
       context.trigger({ x: pos.x, y: pos.y, w: pos.width, h: pos.height });
     });
-    const style = computed6(() => ({
+    const style = computed7(() => ({
       position: "absolute",
       width: `${width.value}px`,
       height: `${height.value}px`,
@@ -1403,9 +1403,9 @@ var FreeDomWrap = defineComponent5({
     const { slots } = useDefaultSlot();
     const eventBus = useEventBus();
     const rectRef = shallowRef4();
-    const nodes = ref10([]);
-    const width = ref10(props.width);
-    const height = ref10(props.height);
+    const nodes = ref9([]);
+    const width = ref9(props.width);
+    const height = ref9(props.height);
     watchEffect4(() => {
       width.value = props.width;
     });
@@ -1487,7 +1487,7 @@ var FreeDomWrap = defineComponent5({
         emit: eventBus.emit
       })
     );
-    const style = computed7(() => ({
+    const style = computed8(() => ({
       width: `${props.width}px`,
       height: `${props.height}px`
     }));
@@ -1512,7 +1512,7 @@ var FreeDomWrap = defineComponent5({
 });
 
 // src/components/gridLayout.ts
-import { defineComponent as defineComponent7, h as h4, provide as provide2, ref as ref11 } from "vue-demi";
+import { defineComponent as defineComponent7, h as h4, provide as provide2, ref as ref10 } from "vue-demi";
 
 // src/components/gridItem.ts
 import { defineComponent as defineComponent6, inject as inject3 } from "vue-demi";
@@ -1710,7 +1710,7 @@ var GridLayout = defineComponent7({
   setup(props, { emit }) {
     const layout = useLayout(props);
     provide2(gridLayoutContextKey, layout);
-    const activeDrag = ref11(null);
+    const activeDrag = ref10(null);
     function processItem(node) {
       const key = node.key;
       if (!key)

package/package.json

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