@versa-stack/v-craft 1.0.1 → 1.0.2

package/dist/types/components/CraftEditor.vue.d.ts

@@ -1,5 +1,6 @@
-import { CraftEditorConfig } from '../lib/model';
+import { HTMLAttributes } from 'vue';
 import { CraftNode } from '../lib/craftNode';
+import { CraftEditorConfig } from '../lib/model';
 declare const _default: <T extends object>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
         readonly onNodeDragEnd?: (() => any) | undefined;
@@ -9,6 +10,7 @@ declare const _default: <T extends object>(__VLS_props: NonNullable<Awaited<type
         config: CraftEditorConfig<T>;
         useIframe?: boolean;
         iFrameStyleSheets?: string[];
+        iFrameClass?: HTMLAttributes["class"];
         inheritStyles?: boolean;
     } & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;

package/dist/types/components/CraftFrame.vue.d.ts

@@ -1,4 +1,4 @@
-import { StyleValue } from 'vue';
+import { StyleValue, HTMLAttributes } from 'vue';
 import { CraftNodeResolverMap } from '../lib/CraftNodeResolver';
 declare const _default: <T extends object>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
@@ -9,6 +9,7 @@ declare const _default: <T extends object>(__VLS_props: NonNullable<Awaited<type
         iFrameStyleSheets?: string[];
         iFrameStyles?: string[];
         iFrameWidth?: "auto" | number;
+        iFrameClass?: HTMLAttributes["class"];
         inheritStyles?: boolean;
         resolverMap?: CraftNodeResolverMap<T>;
         useIframe?: boolean;

package/dist/types/components/CraftIframe.vue.d.ts

@@ -1,6 +1,6 @@
-import { StyleValue } from 'vue';
+import { StyleValue, HTMLAttributes } from 'vue';
 type __VLS_Props = {
-    iframeClass?: string | Record<string, boolean>;
+    iframeClass?: HTMLAttributes["class"];
     iframeStyle?: StyleValue;
     inheritStyles?: boolean;
     styleSheets?: string[];
@@ -28,7 +28,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     inheritStyles: boolean;
     width: "auto" | number;
     height: "auto" | number;
-    iframeClass: string | Record<string, boolean>;
+    iframeClass: string | false | Record<string, any> | import('vue').ClassValue[] | null;
     iframeStyle: string | false | import('vue').CSSProperties | StyleValue[] | null;
     styleSheets: string[];
     styles: string[];

package/dist/v-craft.es.js

@@ -1,4 +1,4 @@
-import { defineComponent as $, useSlots as Ue, useAttrs as ot, inject as ae, computed as w, openBlock as v, createBlock as N, resolveDynamicComponent as me, normalizeProps as Ae, mergeProps as Oe, unref as f, createSlots as ge, renderList as M, withCtx as X, renderSlot as W, guardReactiveProps as it, createCommentVNode as x, markRaw as Be, ref as K, watch as le, normalizeClass as oe, createTextVNode as at, toDisplayString as ne, createElementBlock as E, withKeys as Pe, withModifiers as V, nextTick as ue, provide as re, resolveComponent as U, createVNode as G, Fragment as T, createElementVNode as O, toRef as ce, onUnmounted as Le, toRefs as fe, normalizeStyle as je, withDirectives as lt, Teleport as ut, vShow as ct, onMounted as Ne, onBeforeMount as dt, onBeforeUnmount as ft, readonly as ht, toHandlers as Fe, h as pt } from "vue";
+import { defineComponent as $, useSlots as Be, useAttrs as ot, inject as ae, computed as w, openBlock as v, createBlock as N, resolveDynamicComponent as me, normalizeProps as Ae, mergeProps as Oe, unref as f, createSlots as ge, renderList as M, withCtx as X, renderSlot as W, guardReactiveProps as it, createCommentVNode as x, markRaw as Ue, ref as K, watch as le, normalizeClass as oe, createTextVNode as at, toDisplayString as ne, createElementBlock as E, withKeys as Pe, withModifiers as V, nextTick as ue, provide as re, resolveComponent as B, createVNode as G, Fragment as T, createElementVNode as O, toRef as ce, onUnmounted as Le, toRefs as fe, normalizeStyle as je, withDirectives as lt, Teleport as ut, vShow as ct, onMounted as Ne, onBeforeMount as dt, onBeforeUnmount as ft, readonly as ht, toHandlers as Fe, h as pt } from "vue";
 import { defineStore as He, storeToRefs as Z } from "pinia";
 import { v4 as de } from "uuid";
 import { debounce as Ve } from "lodash-es";
@@ -10,7 +10,7 @@ const vt = /* @__PURE__ */ $({
     componentName: {}
   },
   setup(t) {
-    const e = Ue(), r = ot(), n = t, s = ae("resolver"), o = w(() => s?.value.resolve(n.componentName)), i = w(() => o.value?.componentName || n.componentName);
+    const e = Be(), r = ot(), n = t, s = ae("resolver"), o = w(() => s?.value.resolve(n.componentName)), i = w(() => o.value?.componentName || n.componentName);
     return (a, c) => i.value ? (v(), N(me(i.value), Ae(Oe({ key: 0 }, f(r))), ge({ _: 2 }, [
       M(f(e), (u, d) => ({
         name: d,
@@ -148,7 +148,7 @@ const vt = /* @__PURE__ */ $({
     },
     addNodeRecursively(t, e = null) {
       const r = t.uuid || de(), n = { ...t, uuid: r, parentUuid: e };
-      this.nodeMap.set(r, Be(n)), e || this.rootNodes.push(r), t.slots && Object.values(t.slots).forEach((s) => {
+      this.nodeMap.set(r, Ue(n)), e || this.rootNodes.push(r), t.slots && Object.values(t.slots).forEach((s) => {
         s.forEach((o) => this.addNodeRecursively(o, r));
       });
     },
@@ -342,7 +342,7 @@ const vt = /* @__PURE__ */ $({
 class ye {
   resolverMap = {};
   constructor(e = {}) {
-    return this.setResolverMap(e), Be(this);
+    return this.setResolverMap(e), Ue(this);
   }
   setResolverMap(e) {
     this.resolverMap = {}, Object.entries(e).forEach(([r, n]) => {
@@ -374,6 +374,7 @@ const Ct = /* @__PURE__ */ $({
     config: {},
     useIframe: { type: Boolean, default: !1 },
     iFrameStyleSheets: { default: () => [] },
+    iFrameClass: { type: [Boolean, null, String, Object, Array], default: "" },
     inheritStyles: { type: Boolean, default: !1 }
   },
   emits: ["nodeDragStart", "nodeDragEnd", "iframeLoad"],
@@ -388,7 +389,7 @@ const Ct = /* @__PURE__ */ $({
     });
     const i = K(new ye(r.config.resolverMap));
     return re("resolver", i), (a, c) => {
-      const u = U("CraftFrame"), d = U("CraftEditorPanelLayout");
+      const u = B("CraftFrame"), d = B("CraftEditorPanelLayout");
       return v(), N(d, {
         blueprints: t.config.blueprintsLibrary
       }, ge({ _: 2 }, [
@@ -408,6 +409,7 @@ const Ct = /* @__PURE__ */ $({
               useIframe: t.useIframe,
               inheritStyles: t.inheritStyles,
               iFrameStyleSheets: t.iFrameStyleSheets,
+              iFrameClass: t.iFrameClass,
               resolverMap: t.config.resolverMap,
               onIframeLoad: c[0] || (c[0] = (h) => n("iframeLoad", h))
             }, {
@@ -415,7 +417,7 @@ const Ct = /* @__PURE__ */ $({
                 W(a.$slots, "default")
               ]),
               _: 3
-            }, 8, ["useIframe", "inheritStyles", "iFrameStyleSheets", "resolverMap"])
+            }, 8, ["useIframe", "inheritStyles", "iFrameStyleSheets", "iFrameClass", "resolverMap"])
           ]),
           key: "1"
         }
@@ -525,7 +527,7 @@ const wt = /* @__PURE__ */ $({
   setup(t) {
     const e = ae("resolver");
     return (r, n) => {
-      const s = U("CraftEditorBlueprint");
+      const s = B("CraftEditorBlueprint");
       return f(e) ? (v(), E("div", Ot, [
         (v(!0), E(T, null, M(t.blueprints.groups, (o) => (v(), E("div", null, [
           W(r.$slots, "blueprint-group", {
@@ -560,7 +562,7 @@ const wt = /* @__PURE__ */ $({
   emits: ["close"],
   setup(t) {
     return (e, r) => {
-      const n = U("CraftEditorBlueprintsList");
+      const n = B("CraftEditorBlueprintsList");
       return v(), E("div", Pt, [
         r[0] || (r[0] = O("h3", { class: "v-craft-title" }, "blueprints", -1)),
         O("div", Dt, [
@@ -597,7 +599,7 @@ const wt = /* @__PURE__ */ $({
       schema: o.value
     });
   }
-}), It = { class: "v-craft-panel v-craft-layers-panel" }, Mt = { class: "v-craft-layers" }, Tt = { class: "v-craft-node-layers" }, Ut = /* @__PURE__ */ $({
+}), It = { class: "v-craft-panel v-craft-layers-panel" }, Mt = { class: "v-craft-layers" }, Tt = { class: "v-craft-node-layers" }, Bt = /* @__PURE__ */ $({
   name: "CraftEditorPanelLayers",
   __name: "CraftEditorPanelLayers",
   setup(t) {
@@ -605,7 +607,7 @@ const wt = /* @__PURE__ */ $({
       e.selectNode(s);
     };
     return (s, o) => {
-      const i = U("CraftEditorPanelNodeLayer");
+      const i = B("CraftEditorPanelNodeLayer");
       return v(), E("div", It, [
         o[0] || (o[0] = O("h3", { class: "v-craft-title" }, "tree", -1)),
         O("div", Mt, [
@@ -620,7 +622,7 @@ const wt = /* @__PURE__ */ $({
       ]);
     };
   }
-}), Bt = /* @__PURE__ */ be(Ut, [["__scopeId", "data-v-e2502bab"]]), Lt = { key: 0 }, jt = {
+}), Ut = /* @__PURE__ */ be(Bt, [["__scopeId", "data-v-e2502bab"]]), Lt = { key: 0 }, jt = {
   key: 1,
   class: "v-craft-panel-manager"
 }, Ft = { class: "flex w-full justify-between gap-10" }, Ht = { class: "v-craft-grid-panel v-craft-panel-left shrink" }, Vt = { class: "v-craft-grid-panel v-craft-panel-right shrink" }, Kt = /* @__PURE__ */ $({
@@ -633,7 +635,7 @@ const wt = /* @__PURE__ */ $({
       e.selectNode(null);
     };
     return (n, s) => {
-      const o = U("CraftEditorPanelBlueprints"), i = U("CraftEditorPanelLayers"), a = U("CraftEditorPanelSettings");
+      const o = B("CraftEditorPanelBlueprints"), i = B("CraftEditorPanelLayers"), a = B("CraftEditorPanelSettings");
       return n.$slots["panel-layout"] ? (v(), E("div", Lt, [
         W(n.$slots, "panel-layout", {
           blueprints: t.blueprints,
@@ -671,7 +673,7 @@ const wt = /* @__PURE__ */ $({
   setup(t, { emit: e }) {
     const r = t, { craftNode: n, schema: s } = fe(r), o = e;
     return (i, a) => {
-      const c = U("CraftEditorPanelForm");
+      const c = B("CraftEditorPanelForm");
       return v(), N(c, {
         craftNode: f(n),
         schema: f(s),
@@ -720,7 +722,7 @@ const wt = /* @__PURE__ */ $({
       a.toggleNodeVisibility(n.value);
     };
     return (m, p) => {
-      const b = U("CraftEditorPanelNodeLayer", !0);
+      const b = B("CraftEditorPanelNodeLayer", !0);
       return v(), E("li", {
         class: oe(["v-craft-node-layer", {
           "v-craft-node-layer-selected": d.value
@@ -761,7 +763,7 @@ const wt = /* @__PURE__ */ $({
   setup(t, { emit: e }) {
     const r = t, { craftNode: n, schema: s } = fe(r), o = e;
     return (i, a) => {
-      const c = U("CraftEditorPanelForm");
+      const c = B("CraftEditorPanelForm");
       return v(), N(c, {
         craftNode: f(n),
         schema: f(s),
@@ -815,7 +817,7 @@ const wt = /* @__PURE__ */ $({
       r.value && h && e.updateNodeEvents(r.value.uuid, h);
     };
     return (h, m) => {
-      const p = U("CraftEditorPanelNodeSettings"), b = U("CraftEditorPanelNodeEventsSettings");
+      const p = B("CraftEditorPanelNodeSettings"), b = B("CraftEditorPanelNodeEventsSettings");
       return W(h.$slots, "panel-content", {
         selectedNode: f(r),
         nodeName: c.value,
@@ -887,7 +889,7 @@ const wt = /* @__PURE__ */ $({
 }), Qe = /* @__PURE__ */ $({
   __name: "CraftIframe",
   props: {
-    iframeClass: { default: "" },
+    iframeClass: { type: [Boolean, null, String, Object, Array], default: "" },
     iframeStyle: { type: [Boolean, null, String, Object, Array], default: () => ({}) },
     inheritStyles: { type: Boolean, default: !1 },
     styleSheets: { default: () => [] },
@@ -949,8 +951,8 @@ const wt = /* @__PURE__ */ $({
         const k = n.value?.parentElement;
         let I = 0;
         if (k) {
-          const B = k.clientHeight, Q = n.value?.offsetTop || 0;
-          I = B - Q;
+          const U = k.clientHeight, Q = n.value?.offsetTop || 0;
+          I = U - Q;
         }
         const J = y.body, he = y.documentElement, P = Math.max(
           150,
@@ -1025,7 +1027,7 @@ const wt = /* @__PURE__ */ $({
   n?.value && e.setResolver(n.value), t && re("resolver", n);
   const s = () => {
     if (n?.value && !r.value) {
-      const o = Ue(), a = (o.default ? o.default() : []).flatMap((c) => {
+      const o = Be(), a = (o.default ? o.default() : []).flatMap((c) => {
         if (c.key === "_default" && c.children && Array.isArray(c.children))
           return c.children.map((u) => {
             const d = Ce(n.value, u);
@@ -1057,6 +1059,7 @@ const wt = /* @__PURE__ */ $({
     iFrameStyleSheets: { default: () => [] },
     iFrameStyles: { default: () => [] },
     iFrameWidth: { default: "auto" },
+    iFrameClass: { type: [Boolean, null, String, Object, Array] },
     inheritStyles: { type: Boolean, default: !1 },
     resolverMap: {},
     useIframe: { type: Boolean, default: !1 },
@@ -1068,7 +1071,7 @@ const wt = /* @__PURE__ */ $({
       i("iframeLoad", h);
     }, i = e, { editor: a } = lr(r.resolverMap), { nodeTree: c, hasNodes: u, enabled: d } = Z(a);
     return (h, m) => {
-      const p = U("CraftNodeViewer"), b = U("CraftNodeEditor");
+      const p = B("CraftNodeViewer"), b = B("CraftNodeEditor");
       return v(), E("div", ur, [
         t.useIframe ? (v(), N(Qe, {
           key: 0,
@@ -1078,6 +1081,7 @@ const wt = /* @__PURE__ */ $({
             ...t.iFrameStyles
           ],
           "iframe-style": t.iFrameStyle,
+          "iframe-class": t.iFrameClass,
           "style-sheets": t.iFrameStyleSheets,
           width: f(n),
           height: f(s)
@@ -1094,7 +1098,7 @@ const wt = /* @__PURE__ */ $({
             !t.viewOnly && f(d) ? (v(), N(ke, { key: 2 })) : x("", !0)
           ]),
           _: 1
-        }, 8, ["inheritStyles", "styles", "iframe-style", "style-sheets", "width", "height"])) : x("", !0),
+        }, 8, ["inheritStyles", "styles", "iframe-style", "iframe-class", "style-sheets", "width", "height"])) : x("", !0),
         !t.useIframe && (t.viewOnly || !f(d)) && f(u) ? (v(!0), E(T, { key: 1 }, M(f(c), (g) => (v(), N(p, {
           key: `${g.uuid}-view`,
           craftNode: g
@@ -1325,21 +1329,21 @@ Error:`,
       let S = 0;
       for (let L = 0; L < P.length; L++)
         S = P.charCodeAt(L) + ((S << 5) - S);
-      const B = S % 360, Q = 70 + S % 30, H = 45 + S % 30;
-      return `hsla(${B}, ${Q}%, ${H}%, 0.9)`;
+      const U = S % 360, Q = 70 + S % 30, H = 45 + S % 30;
+      return `hsla(${U}, ${Q}%, ${H}%, 0.9)`;
     }, y = w(() => R(r.value.uuid)), k = w(() => {
-      const P = [], B = a?.value?.resolveNode?.(r.value)?.slots;
-      return B && B.length > 0 ? P.push(...B) : P.push("default"), P;
-    }), I = w(() => q(r.value) ? !0 : Object.values(r.value.slots || {}).some((P) => P.length > 0)), J = (P, S) => u.value ? u.value.slotName && u.value.slotName !== S ? [] : he(u.value, P) : [], he = (P, S) => P.type === "single" ? S.map((B) => ({
-      key: `${B.uuid}-single`,
+      const P = [], U = a?.value?.resolveNode?.(r.value)?.slots;
+      return U && U.length > 0 ? P.push(...U) : P.push("default"), P;
+    }), I = w(() => q(r.value) ? !0 : Object.values(r.value.slots || {}).some((P) => P.length > 0)), J = (P, S) => u.value ? u.value.slotName && u.value.slotName !== S ? [] : he(u.value, P) : [], he = (P, S) => P.type === "single" ? S.map((U) => ({
+      key: `${U.uuid}-single`,
       craftNode: {
-        ...B,
+        ...U,
         props: {
-          ...B.props,
+          ...U.props,
           ...P.item || {}
         }
       }
-    })) : P.type === "list" ? P.list ? S.reduce((B, Q) => B.concat(
+    })) : P.type === "list" ? P.list ? S.reduce((U, Q) => U.concat(
       P.list.map((H, L) => ({
         key: `${Q.uuid}-data-${L}`,
         craftNode: {
@@ -1352,7 +1356,7 @@ Error:`,
       }))
     ), []) : [] : [];
     return (P, S) => {
-      const B = U("CraftNodeViewer"), Q = U("CraftNodeEditor", !0);
+      const U = B("CraftNodeViewer"), Q = B("CraftNodeEditor", !0);
       return f(s) && r.value && f(o) ? (v(), N(me(f(o).componentName), Oe({
         key: 0,
         ref_key: "nodeRef",
@@ -1396,7 +1400,7 @@ Error:`,
               O("span", yr, ne(H), 1)
             ], 40, gr)) : x("", !0),
             I.value ? (v(), E(T, { key: 1 }, [
-              u.value?.type && u.value.slotName === H ? (v(!0), E(T, { key: 0 }, M(J(r.value.slots?.[H] || [], H), (L) => (v(), N(B, {
+              u.value?.type && u.value.slotName === H ? (v(!0), E(T, { key: 0 }, M(J(r.value.slots?.[H] || [], H), (L) => (v(), N(U, {
                 key: L.key,
                 craftNode: L.craftNode
               }, null, 8, ["craftNode"]))), 128)) : x("", !0),
@@ -1505,7 +1509,7 @@ Error:`,
   CraftEditorBlueprintsList: At,
   CraftEditorPanelBlueprints: $t,
   CraftEditorPanelForm: Rt,
-  CraftEditorPanelLayers: Bt,
+  CraftEditorPanelLayers: Ut,
   CraftEditorPanelLayout: Xt,
   CraftEditorPanelNodeEventsSettings: qt,
   CraftEditorPanelNodeLayer: Zt,
@@ -2979,10 +2983,10 @@ const qr = {
   CraftCanvas: {
     componentName: "CraftCanvas"
   }
-}, Ur = (t) => {
+}, Br = (t) => {
   for (const e in Ie)
     t.component(e, Ie[e]);
-}, Wr = { install: Ur };
+}, Wr = { install: Br };
 export {
   vt as CraftCanvas,
   Et as CraftComponentSimpleText,
@@ -2991,7 +2995,7 @@ export {
   At as CraftEditorBlueprintsList,
   $t as CraftEditorPanelBlueprints,
   Rt as CraftEditorPanelForm,
-  Bt as CraftEditorPanelLayers,
+  Ut as CraftEditorPanelLayers,
   Xt as CraftEditorPanelLayout,
   qt as CraftEditorPanelNodeEventsSettings,
   Zt as CraftEditorPanelNodeLayer,