@versa-stack/v-craft 1.0.4 → 1.1.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/dist/types/components/CraftEditor.vue.d.ts +4 -7
  2. package/dist/types/components/CraftEditorBlueprint.vue.d.ts +2 -1
  3. package/dist/types/components/CraftEditorBlueprintsList.vue.d.ts +2 -1
  4. package/dist/types/components/CraftEditorPanelForm.vue.d.ts +17 -16
  5. package/dist/types/components/CraftEditorPanelLayers.vue.d.ts +2 -1
  6. package/dist/types/components/CraftEditorPanelLayout.vue.d.ts +2 -1
  7. package/dist/types/components/CraftEditorPanelNodeEventsSettings.vue.d.ts +6 -7
  8. package/dist/types/components/CraftEditorPanelNodeLayer.vue.d.ts +2 -1
  9. package/dist/types/components/CraftEditorPanelNodeSettings.vue.d.ts +6 -7
  10. package/dist/types/components/CraftEditorPanelSettings.vue.d.ts +4 -3
  11. package/dist/types/components/CraftFrame.vue.d.ts +4 -10
  12. package/dist/types/components/CraftIframe.vue.d.ts +1 -5
  13. package/dist/types/components/CraftNodeStatic.vue.d.ts +9 -0
  14. package/dist/types/components/CraftStaticRenderer.vue.d.ts +5 -3
  15. package/dist/types/components/composable/index.d.ts +1 -0
  16. package/dist/types/components/composable/useCraftFrame.d.ts +134 -104
  17. package/dist/types/components/composable/useCraftNode.d.ts +3 -3
  18. package/dist/types/components/composable/useCraftNodeEvents.d.ts +1 -2
  19. package/dist/types/components/composable/useCraftNodeWrapper.d.ts +133 -104
  20. package/dist/types/components/composable/useDragCraftNode.d.ts +2 -1
  21. package/dist/types/components/composable/useNodeElement.d.ts +9 -0
  22. package/dist/types/components/composable/useResolveCraftNode.d.ts +4 -2
  23. package/dist/types/components/index.d.ts +1 -1
  24. package/dist/types/components/utils.d.ts +3 -1
  25. package/dist/types/lib/CraftNodeResolver.d.ts +13 -6
  26. package/dist/types/lib/craftNode.d.ts +15 -12
  27. package/dist/types/lib/dragCraftNode/dragOver.d.ts +2 -1
  28. package/dist/types/lib/dragCraftNode/drop.d.ts +3 -2
  29. package/dist/types/lib/dragCraftNode/index.d.ts +2 -2
  30. package/dist/types/lib/model.d.ts +18 -3
  31. package/dist/types/lib/renderCraftNodes.d.ts +4 -3
  32. package/dist/types/lib/vNodeToCraftNode.d.ts +2 -1
  33. package/dist/types/store/editor.d.ts +134 -105
  34. package/dist/v-craft.css +1 -1
  35. package/dist/v-craft.es.js +1356 -1208
  36. package/dist/v-craft.es.js.map +1 -1
  37. package/package.json +1 -1
package/dist/v-craft.css CHANGED
@@ -1 +1 @@
1
- .pre-wrap{white-space:pre-wrap}.editable-text.is-editable:hover{background-color:#0000000d;cursor:pointer}.editable-text.is-editing{display:inline-block;width:100%}.editable-text__textarea{font:inherit;border:none;background:none;outline:none;width:100%;resize:none;overflow:hidden;min-height:1em;line-height:inherit;padding:.12em;margin:0}.editable-text__textarea:focus{border:none}.v-craft-blueprints-panel[data-v-a6de4dca]{min-width:15em;max-width:15em;width:15em}.v-craft-blueprints-panel[data-v-a6de4dca] .v-craft-blueprint{text-align:center;padding:.25em;position:relative;border:1px solid var(--v-craft-gray-medium);border-radius:3px;display:flex;align-items:center;cursor:pointer;background-color:var(--v-craft-background-color-lighter-10)}.v-craft-blueprints-panel[data-v-a6de4dca] .v-craft-blueprint-label{font-size:.8em;text-transform:uppercase;font-weight:700;color:var(--v-craft-gray-darker)}.v-craft-blueprints-panel h4[data-v-a6de4dca]{font-size:.8em;text-transform:uppercase;font-weight:700;color:var(--v-craft-gray-medium);margin-bottom:.75em;margin-top:2em}.v-craft-panel.v-craft-layers-panel[data-v-e2502bab]{padding:10px;display:flex;flex-direction:column;height:auto;position:relative;width:23rem}.v-craft-layers[data-v-e2502bab]{overflow-y:auto}.v-craft-layers[data-v-e2502bab]::-webkit-scrollbar{width:8px}.v-craft-layers[data-v-e2502bab]::-webkit-scrollbar-track{background:var(--v-craft-scrollbar-track)}.v-craft-layers[data-v-e2502bab]::-webkit-scrollbar-thumb{background:var(--v-craft-scrollbar-thumb);border-radius:4px}.v-craft-layers[data-v-e2502bab]::-webkit-scrollbar-thumb:hover{background:var(--v-craft-scrollbar-thumb-hover)}.v-craft-layers[data-v-e2502bab]{max-height:300px;overflow-y:auto;margin-top:10px}ul.v-craft-node-layers[data-v-e2502bab]{margin:0;padding:0;list-style-type:none}.v-craft-panel-manager .v-craft-panel[data-v-d60526f7]{padding:.75em;margin-bottom:1.25em;box-shadow:0 2px 2px #00000009,0 4px 4px #0000000c,0 6px 6px #0000000f,0 8px 8px #00000012,0 10px 10px #00000016,0 15px 15px #0000001f;border-radius:3px}.v-craft-panel-manager[data-v-d60526f7] .v-craft-panel .v-craft-title{margin:0;padding:.125em;border-bottom:1px solid var(--v-craft-gray-medium)}.v-craft-node-layer[data-v-0b94201d]{padding:5px 0;border-bottom:1px solid var(--v-craft-gray-dark);list-style-type:none}.v-craft-node-layer.v-craft-node-layer-selected>.v-craft-component-layer-face[data-v-0b94201d]{background-color:var(--v-craft-blue-lighter-5)}.v-craft-node-layer.v-craft-node-layer-selected>.v-craft-component-layer-face[data-v-0b94201d]:hover{background-color:var(--v-craft-blue-lighter-15)}.v-craft-node-layer[data-v-0b94201d] .v-craft-component-layer-face{display:flex;align-items:center;padding:2px 5px;background-color:var(--v-craft-gray-medium);border-radius:3px;transition:background-color .2s ease;position:relative}.v-craft-node-layer[data-v-0b94201d] .v-craft-component-layer-face:before{position:absolute;background-color:var(--v-craft-gray-medium);width:.5em;height:1px;top:50%;left:-.5em;content:" "}.v-craft-node-layer[data-v-0b94201d] .v-craft-component-layer-face:hover{background-color:var(--v-craft-gray-medium-lighter-15)}.v-craft-node-layer[data-v-0b94201d] .v-craft-component-name{flex-grow:1;font-size:12px;cursor:pointer}.v-craft-node-layer[data-v-0b94201d] .v-craft-component-icon{font-size:12px;cursor:pointer;margin-left:5px;transition:color .2s ease}.v-craft-node-layer[data-v-0b94201d] .v-craft-component-icon:hover{color:var(--v-craft-blue)}.v-craft-node-layer[data-v-0b94201d] .v-craft-component-icon{border:none;padding:.12em}.v-craft-node-layer[data-v-0b94201d] .nested-layers{margin-left:15px;border-left:1px solid var(--v-craft-gray-medium);padding-left:5px}:root{--v-craft-indicator-bg-allowed: var(--v-craft-green);--v-craft-indicator-bg-forbidden: var(--v-craft-red);--v-craft-indicator-transition-duration: .125s;--v-craft-indicator-z-index: 10000}.v-craft-indicator{position:fixed;background-color:var(--v-craft-indicator-bg-allowed);transition:top var(--v-craft-indicator-transition-duration) ease,left var(--v-craft-indicator-transition-duration) ease,right var(--v-craft-indicator-transition-duration) ease,bottom var(--v-craft-indicator-transition-duration) ease,width var(--v-craft-indicator-transition-duration) ease,height var(--v-craft-indicator-transition-duration) ease,background-color var(--v-craft-indicator-transition-duration) ease-in-out;z-index:var(--v-craft-indicator-z-index)}.v-craft-indicator:after{content:" "}.v-craft-indicator.v-craft-forbidden{background-color:var(--v-craft-indicator-bg-forbidden)}.vue3-iframe iframe body{padding:10px}.v-craft-node{position:relative;transition:all var(--v-craft-transition-duration) ease;cursor:pointer;box-sizing:border-box;border:1px solid transparent}.v-craft-node:after{content:"";position:absolute;top:calc(-1 * var(--v-craft-node-editor-border-padding));left:calc(-1 * var(--v-craft-node-editor-border-padding));right:calc(-1 * var(--v-craft-node-editor-border-padding));bottom:calc(-1 * var(--v-craft-node-editor-border-padding));border:1px solid transparent;border-radius:4px;transition:border-color var(--v-craft-transition-duration) ease-in-out,box-shadow var(--v-craft-transition-duration) ease-in-out;pointer-events:none;z-index:10}.v-craft-node:before{content:"";align-items:center;background-color:var(--node-color, var(--v-craft-blue));bottom:calc(-20px - var(--v-craft-node-editor-border-padding));color:var(--v-craft-white);display:flex;font-family:Arial,sans-serif;font-size:12px;font-weight:400;height:20px;left:calc(-1 * var(--v-craft-node-editor-border-padding) + 3px);line-height:1.4em;opacity:0;padding:0 5px!important;pointer-events:none;position:absolute;text-align:center;text-transform:none;transition:opacity var(--v-craft-transition-duration) ease-in-out;z-index:100}.v-craft-node.v-craft-canvas.v-craft-other-node-dragged:before{opacity:.5}.v-craft-node:hover:not(:has(.v-craft-node:hover)):not(.v-craft-node-selected):before{opacity:1}.v-craft-node-selected:before{opacity:1}.v-craft-node:hover:not(:has(.v-craft-node:hover)):after{border-color:var(--node-color, var(--v-craft-blue-lighter-20));box-shadow:0 0 0 1px var(--node-color, var(--v-craft-blue))}.dark .v-craft-node:hover:not(:has(.v-craft-node:hover)):after{border-color:var(--node-color, var(--v-craft-blue-darker-25));box-shadow:0 0 0 1px var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-canvas:hover:not(:has(.v-craft-node:hover)):not(.v-craft-node-selected):after{box-shadow:0 0 .5em .1em rgba(var(--node-color),.2)}.v-craft-node-selected:not(:hover):after{border:1px solid var(--node-color, var(--v-craft-blue));box-shadow:0 0 .5em .1em rgba(var(--node-color),.2)}.v-craft-node-selected:after{border:1px solid var(--node-color, var(--v-craft-blue));box-shadow:0 0 0 1px var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-canvas.v-craft-other-node-dragged:after{border:2px dashed var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-canvas .v-craft-drop-text{border:2px dashed var(--v-craft-gray-medium);color:var(--v-craft-text-color);padding:1.25em;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5em;min-height:60px;box-sizing:border-box;pointer-events:auto;position:relative;margin:4px 0}.v-craft-node.v-craft-canvas .v-craft-slot-name{position:absolute;bottom:4px;left:8px;font-weight:400;font-size:.75em;color:var(--v-craft-gray-medium);text-transform:uppercase;letter-spacing:.05em}.v-craft-node.v-craft-canvas .v-craft-drop-text-label{font-size:.85em;color:var(--v-craft-gray-medium)}.v-craft-node.v-craft-canvas.v-craft-other-node-dragged{padding:10px!important;margin-bottom:25px!important}.v-craft-node-selected{z-index:1}.v-craft-node.v-craft-drag-over{box-shadow:0 0 0 2px var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-dragging{opacity:.7}.v-craft-node:before{content:attr(data-node-name)}:root{--v-craft-blue: #1473e6;--v-craft-red: #ff3366;--v-craft-green: rgb(15, 177, 88);--v-craft-gray-dark: #f8f8f8;--v-craft-gray-medium: rgb(202.5, 202.5, 202.5);--v-craft-gray-light: rgb(167.5, 167.5, 167.5);--v-craft-gray-darkest: hsl(0, 0%, 101.7647058824%);--v-craft-white: #ffffff;--v-craft-background-color: hsl(0, 0%, 106.7647058824%);--v-craft-background-color-lighter-10: #ffffff;--v-craft-background-color-darker-10: hsl(0, 0%, 101.7647058824%);--v-craft-input-background: hsl(0, 0%, 109.7647058824%);--v-craft-input-border: #eaeaea;--v-craft-text-color: rgb(55.5, 55.5, 55.5);--v-craft-text-color-blue: #e0e0e0;--v-craft-error-color: #ff3366;--v-craft-blue-darker-25: rgb(9.8, 56.35, 112.7);--v-craft-blue-darker-30: rgb(7.76, 44.62, 89.24);--v-craft-blue-lighter-5: rgb(39.26, 128.37, 236.24);--v-craft-blue-lighter-10: rgb(62.72, 142.14, 238.28);--v-craft-blue-lighter-15: rgb(86.18, 155.91, 240.32);--v-craft-blue-lighter-20: rgb(109.64, 169.68, 242.36);--v-craft-blue-transparent-70: rgba(20, 115, 230, .7);--v-craft-blue-transparent-20: rgba(20, 115, 230, .2);--v-craft-gray-dark-darker-10: rgb(222.5, 222.5, 222.5);--v-craft-gray-dark-darker-5: rgb(235.25, 235.25, 235.25);--v-craft-gray-dark-lighter-10: hsl(0, 0%, 107.2549019608%);--v-craft-gray-dark-transparent-50: rgba(248, 248, 248, .5);--v-craft-gray-medium-darker-10: #b1b1b1;--v-craft-gray-medium-lighter-15: rgb(240.75, 240.75, 240.75);--v-craft-transition-duration: .3s;--v-craft-node-editor-border-padding: .2rem}html.dark{--v-craft-blue: #1473e6;--v-craft-red: #ff3366;--v-craft-green: rgb(15, 177, 88);--v-craft-gray-dark: #2c2c2c;--v-craft-gray-medium: #4b4b4b;--v-craft-gray-light: #8e8e8e;--v-craft-gray-darkest: #1e1e1e;--v-craft-white: #ffffff;--v-craft-background-color: #1e1e1e;--v-craft-background-color-lighter-10: rgb(55.5, 55.5, 55.5);--v-craft-background-color-darker-10: rgb(4.5, 4.5, 4.5);--v-craft-input-background: #2d2d2d;--v-craft-input-border: #3a3a3a;--v-craft-text-color: #e0e0e0;--v-craft-text-color-blue: #e0e0e0;--v-craft-error-color: #ff3366;--v-craft-blue-darker-25: rgb(9.8, 56.35, 112.7);--v-craft-blue-darker-30: rgb(7.76, 44.62, 89.24);--v-craft-blue-lighter-5: rgb(39.26, 128.37, 236.24);--v-craft-blue-lighter-10: rgb(62.72, 142.14, 238.28);--v-craft-blue-lighter-15: rgb(86.18, 155.91, 240.32);--v-craft-blue-lighter-20: rgb(109.64, 169.68, 242.36);--v-craft-blue-transparent-20: rgba(20, 115, 230, .2);--v-craft-blue-transparent-70: rgba(20, 115, 230, .7);--v-craft-gray-dark-darker-10: rgb(18.5, 18.5, 18.5);--v-craft-gray-dark-darker-5: rgb(31.25, 31.25, 31.25);--v-craft-gray-dark-lighter-10: rgb(69.5, 69.5, 69.5);--v-craft-gray-dark-transparent-50: rgba(44, 44, 44, .5);--v-craft-gray-medium-darker-10: rgb(49.5, 49.5, 49.5);--v-craft-gray-medium-lighter-15: rgb(113.25, 113.25, 113.25)}
1
+ .pre-wrap{white-space:pre-wrap}.editable-text.is-editable:hover{background-color:#0000000d;cursor:pointer}.editable-text.is-editing{display:inline-block;width:100%}.editable-text__textarea{font:inherit;border:none;background:none;outline:none;width:100%;resize:none;overflow:hidden;min-height:1em;line-height:inherit;padding:.12em;margin:0}.editable-text__textarea:focus{border:none}.v-craft-blueprints-panel[data-v-a6de4dca]{min-width:15em;max-width:15em;width:15em}.v-craft-blueprints-panel[data-v-a6de4dca] .v-craft-blueprint{text-align:center;padding:.25em;position:relative;border:1px solid var(--v-craft-gray-medium);border-radius:3px;display:flex;align-items:center;cursor:pointer;background-color:var(--v-craft-background-color-lighter-10)}.v-craft-blueprints-panel[data-v-a6de4dca] .v-craft-blueprint-label{font-size:.8em;text-transform:uppercase;font-weight:700;color:var(--v-craft-gray-darker)}.v-craft-blueprints-panel h4[data-v-a6de4dca]{font-size:.8em;text-transform:uppercase;font-weight:700;color:var(--v-craft-gray-medium);margin-bottom:.75em;margin-top:2em}.v-craft-panel.v-craft-layers-panel[data-v-ab795ec3]{padding:10px;display:flex;flex-direction:column;height:auto;position:relative;width:23rem}.v-craft-layers[data-v-ab795ec3]{overflow-y:auto}.v-craft-layers[data-v-ab795ec3]::-webkit-scrollbar{width:8px}.v-craft-layers[data-v-ab795ec3]::-webkit-scrollbar-track{background:var(--v-craft-scrollbar-track)}.v-craft-layers[data-v-ab795ec3]::-webkit-scrollbar-thumb{background:var(--v-craft-scrollbar-thumb);border-radius:4px}.v-craft-layers[data-v-ab795ec3]::-webkit-scrollbar-thumb:hover{background:var(--v-craft-scrollbar-thumb-hover)}.v-craft-layers[data-v-ab795ec3]{max-height:300px;overflow-y:auto;margin-top:10px}ul.v-craft-node-layers[data-v-ab795ec3]{margin:0;padding:0;list-style-type:none}.v-craft-panel-manager .v-craft-panel[data-v-81a2200d]{padding:.75em;margin-bottom:1.25em;box-shadow:0 2px 2px #00000009,0 4px 4px #0000000c,0 6px 6px #0000000f,0 8px 8px #00000012,0 10px 10px #00000016,0 15px 15px #0000001f;border-radius:3px}.v-craft-panel-manager[data-v-81a2200d] .v-craft-panel .v-craft-title{margin:0;padding:.125em;border-bottom:1px solid var(--v-craft-gray-medium)}.v-craft-node-layer[data-v-208a4e02]{padding:5px 0;border-bottom:1px solid var(--v-craft-gray-dark);list-style-type:none}.v-craft-node-layer.v-craft-node-layer-selected>.v-craft-component-layer-face[data-v-208a4e02]{background-color:var(--v-craft-blue-lighter-5)}.v-craft-node-layer.v-craft-node-layer-selected>.v-craft-component-layer-face[data-v-208a4e02]:hover{background-color:var(--v-craft-blue-lighter-15)}.v-craft-node-layer[data-v-208a4e02] .v-craft-component-layer-face{display:flex;align-items:center;padding:2px 5px;background-color:var(--v-craft-gray-medium);border-radius:3px;transition:background-color .2s ease;position:relative}.v-craft-node-layer[data-v-208a4e02] .v-craft-component-layer-face:before{position:absolute;background-color:var(--v-craft-gray-medium);width:.5em;height:1px;top:50%;left:-.5em;content:" "}.v-craft-node-layer[data-v-208a4e02] .v-craft-component-layer-face:hover{background-color:var(--v-craft-gray-medium-lighter-15)}.v-craft-node-layer[data-v-208a4e02] .v-craft-component-name{flex-grow:1;font-size:12px;cursor:pointer}.v-craft-node-layer[data-v-208a4e02] .v-craft-component-icon{font-size:12px;cursor:pointer;margin-left:5px;transition:color .2s ease}.v-craft-node-layer[data-v-208a4e02] .v-craft-component-icon:hover{color:var(--v-craft-blue)}.v-craft-node-layer[data-v-208a4e02] .v-craft-component-icon{border:none;padding:.12em}.v-craft-node-layer[data-v-208a4e02] .nested-layers{margin-left:15px;border-left:1px solid var(--v-craft-gray-medium);padding-left:5px}:root{--v-craft-indicator-bg-allowed: var(--v-craft-green);--v-craft-indicator-bg-forbidden: var(--v-craft-red);--v-craft-indicator-transition-duration: .125s;--v-craft-indicator-z-index: 10000}.v-craft-indicator{position:fixed;background-color:var(--v-craft-indicator-bg-allowed);transition:top var(--v-craft-indicator-transition-duration) ease,left var(--v-craft-indicator-transition-duration) ease,right var(--v-craft-indicator-transition-duration) ease,bottom var(--v-craft-indicator-transition-duration) ease,width var(--v-craft-indicator-transition-duration) ease,height var(--v-craft-indicator-transition-duration) ease,background-color var(--v-craft-indicator-transition-duration) ease-in-out;z-index:var(--v-craft-indicator-z-index)}.v-craft-indicator:after{content:" "}.v-craft-indicator.v-craft-forbidden{background-color:var(--v-craft-indicator-bg-forbidden)}.v-craft-node{position:relative;transition:all var(--v-craft-transition-duration) ease;cursor:pointer;box-sizing:border-box}.v-craft-node:after{content:"";position:absolute;top:calc(-1 * var(--v-craft-node-editor-border-padding));left:calc(-1 * var(--v-craft-node-editor-border-padding));right:calc(-1 * var(--v-craft-node-editor-border-padding));bottom:calc(-1 * var(--v-craft-node-editor-border-padding));border:1px solid transparent;border-radius:4px;transition:border-color var(--v-craft-transition-duration) ease-in-out,box-shadow var(--v-craft-transition-duration) ease-in-out;pointer-events:none;z-index:10}.v-craft-node:before{content:"";align-items:center;background-color:var(--node-color, var(--v-craft-blue));bottom:calc(-20px - var(--v-craft-node-editor-border-padding));color:var(--v-craft-white);display:flex;font-family:Arial,sans-serif;font-size:12px;font-weight:400;height:20px;left:calc(-1 * var(--v-craft-node-editor-border-padding) + 3px);line-height:1.4em;opacity:0;padding:0 5px!important;pointer-events:none;position:absolute;text-align:center;text-transform:none;transition:opacity var(--v-craft-transition-duration) ease-in-out;z-index:100}.v-craft-node.v-craft-canvas.v-craft-other-node-dragged:before{opacity:.5}.v-craft-node:hover:not(:has(.v-craft-node:hover)):not(.v-craft-node-selected):before{opacity:1}.v-craft-node-selected:before{opacity:1}.v-craft-node:hover:not(:has(.v-craft-node:hover)):after{border-color:var(--node-color, var(--v-craft-blue-lighter-20));box-shadow:0 0 0 1px var(--node-color, var(--v-craft-blue))}.dark .v-craft-node:hover:not(:has(.v-craft-node:hover)):after{border-color:var(--node-color, var(--v-craft-blue-darker-25));box-shadow:0 0 0 1px var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-canvas:hover:not(:has(.v-craft-node:hover)):not(.v-craft-node-selected):after{box-shadow:0 0 .5em .1em rgba(var(--node-color),.2)}.v-craft-node-selected:not(:hover):after{border:1px solid var(--node-color, var(--v-craft-blue));box-shadow:0 0 .5em .1em rgba(var(--node-color),.2)}.v-craft-node-selected:after{border:1px solid var(--node-color, var(--v-craft-blue));box-shadow:0 0 0 1px var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-canvas.v-craft-other-node-dragged:after{border:2px dashed var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-canvas .v-craft-drop-text{border:2px dashed var(--v-craft-gray-medium);color:var(--v-craft-text-color);padding:1.25em;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5em;min-height:60px;box-sizing:border-box;pointer-events:auto;position:relative;margin:4px 0}.v-craft-node.v-craft-canvas .v-craft-slot-name{position:absolute;bottom:4px;left:8px;font-weight:400;font-size:.75em;color:var(--v-craft-gray-medium);text-transform:uppercase;letter-spacing:.05em}.v-craft-node.v-craft-canvas .v-craft-drop-text-label{font-size:.85em;color:var(--v-craft-gray-medium)}.v-craft-node.v-craft-canvas.v-craft-other-node-dragged{padding:10px!important;margin-bottom:25px!important}.v-craft-node-selected{z-index:1}.v-craft-node.v-craft-drag-over{box-shadow:0 0 0 2px var(--node-color, var(--v-craft-blue))}.v-craft-node.v-craft-dragging{opacity:.7}.v-craft-node:before{content:attr(data-node-name)}:root{--v-craft-blue: #1473e6;--v-craft-red: #ff3366;--v-craft-green: rgb(15, 177, 88);--v-craft-gray-dark: #f8f8f8;--v-craft-gray-medium: rgb(202.5, 202.5, 202.5);--v-craft-gray-light: rgb(167.5, 167.5, 167.5);--v-craft-gray-darkest: hsl(0, 0%, 101.7647058824%);--v-craft-white: #ffffff;--v-craft-background-color: hsl(0, 0%, 106.7647058824%);--v-craft-background-color-lighter-10: #ffffff;--v-craft-background-color-darker-10: hsl(0, 0%, 101.7647058824%);--v-craft-input-background: hsl(0, 0%, 109.7647058824%);--v-craft-input-border: #eaeaea;--v-craft-text-color: rgb(55.5, 55.5, 55.5);--v-craft-text-color-blue: #e0e0e0;--v-craft-error-color: #ff3366;--v-craft-blue-darker-25: rgb(9.8, 56.35, 112.7);--v-craft-blue-darker-30: rgb(7.76, 44.62, 89.24);--v-craft-blue-lighter-5: rgb(39.26, 128.37, 236.24);--v-craft-blue-lighter-10: rgb(62.72, 142.14, 238.28);--v-craft-blue-lighter-15: rgb(86.18, 155.91, 240.32);--v-craft-blue-lighter-20: rgb(109.64, 169.68, 242.36);--v-craft-blue-transparent-70: rgba(20, 115, 230, .7);--v-craft-blue-transparent-20: rgba(20, 115, 230, .2);--v-craft-gray-dark-darker-10: rgb(222.5, 222.5, 222.5);--v-craft-gray-dark-darker-5: rgb(235.25, 235.25, 235.25);--v-craft-gray-dark-lighter-10: hsl(0, 0%, 107.2549019608%);--v-craft-gray-dark-transparent-50: rgba(248, 248, 248, .5);--v-craft-gray-medium-darker-10: #b1b1b1;--v-craft-gray-medium-lighter-15: rgb(240.75, 240.75, 240.75);--v-craft-transition-duration: .3s;--v-craft-node-editor-border-padding: .2rem}html.dark{--v-craft-blue: #1473e6;--v-craft-red: #ff3366;--v-craft-green: rgb(15, 177, 88);--v-craft-gray-dark: #2c2c2c;--v-craft-gray-medium: #4b4b4b;--v-craft-gray-light: #8e8e8e;--v-craft-gray-darkest: #1e1e1e;--v-craft-white: #ffffff;--v-craft-background-color: #1e1e1e;--v-craft-background-color-lighter-10: rgb(55.5, 55.5, 55.5);--v-craft-background-color-darker-10: rgb(4.5, 4.5, 4.5);--v-craft-input-background: #2d2d2d;--v-craft-input-border: #3a3a3a;--v-craft-text-color: #e0e0e0;--v-craft-text-color-blue: #e0e0e0;--v-craft-error-color: #ff3366;--v-craft-blue-darker-25: rgb(9.8, 56.35, 112.7);--v-craft-blue-darker-30: rgb(7.76, 44.62, 89.24);--v-craft-blue-lighter-5: rgb(39.26, 128.37, 236.24);--v-craft-blue-lighter-10: rgb(62.72, 142.14, 238.28);--v-craft-blue-lighter-15: rgb(86.18, 155.91, 240.32);--v-craft-blue-lighter-20: rgb(109.64, 169.68, 242.36);--v-craft-blue-transparent-20: rgba(20, 115, 230, .2);--v-craft-blue-transparent-70: rgba(20, 115, 230, .7);--v-craft-gray-dark-darker-10: rgb(18.5, 18.5, 18.5);--v-craft-gray-dark-darker-5: rgb(31.25, 31.25, 31.25);--v-craft-gray-dark-lighter-10: rgb(69.5, 69.5, 69.5);--v-craft-gray-dark-transparent-50: rgba(44, 44, 44, .5);--v-craft-gray-medium-darker-10: rgb(49.5, 49.5, 49.5);--v-craft-gray-medium-lighter-15: rgb(113.25, 113.25, 113.25)}