@blokkli/editor 2.0.0-alpha.17 → 2.0.0-alpha.18

package/dist/runtime/helpers/animationProvider.d.ts

@@ -5,6 +5,7 @@ import type { StorageProvider } from './storageProvider.js';
 import type { CursorKeyword } from './dom/index.js';
 import type { CanvasDrawEvent, Coord } from '#blokkli/types';
 import type { SelectionProvider } from './selectionProvider.js';
+import type { ElementProvider } from './providers/element.js';
 export type RenderContext = CanvasDrawEvent & {
     gl: WebGLRenderingContext;
 };
@@ -57,4 +58,4 @@ export type AnimationProvider = {
      */
     unregisterRenderer: (id: string) => void;
 };
-export default function (ui: UiProvider, storage: StorageProvider, selection: SelectionProvider): AnimationProvider;
+export default function (ui: UiProvider, storage: StorageProvider, selection: SelectionProvider, element: ElementProvider): AnimationProvider;

package/dist/runtime/helpers/animationProvider.js

@@ -8,7 +8,7 @@ import {
 } from "#imports";
 import { eventBus } from "#blokkli/helpers/eventBus";
 import { createProgramInfo } from "twgl.js";
-export default function(ui, storage, selection) {
+export default function(ui, storage, selection, element) {
   const webglEnabled = storage.use("webglEnabled", true);
   const currentCursor = ref("default");
   const cursor = computed(() => currentCursor.value);
@@ -49,7 +49,11 @@ export default function(ui, storage, selection) {
   const maxCanvasHeight = ref(16384);
   let webglLimitsQueried = false;
   function getCanvasElement() {
-    const el = document.querySelector("#bk-animation-canvas-webgl");
+    const el = element.query(
+      document.documentElement,
+      "#bk-animation-canvas-webgl",
+      "Find animation canvas element."
+    );
     if (!(el instanceof HTMLCanvasElement)) {
       throw new TypeError("Failed to locate WebGL canvas.");
     }

package/dist/runtime/helpers/composables/useStateBasedCache.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Caches the result of the given callback for the duration of the current state.
+ */
+export default function <T>(cb: () => T): () => T;

package/dist/runtime/helpers/composables/useStateBasedCache.js

@@ -0,0 +1,13 @@
+import onBlokkliEvent from "./onBlokkliEvent.js";
+export default function(cb) {
+  let cached = null;
+  onBlokkliEvent("state:reloaded", () => {
+    cached = null;
+  });
+  return () => {
+    if (!cached) {
+      cached = cb();
+    }
+    return cached;
+  };
+}

package/dist/runtime/helpers/definitionProvider.d.ts

@@ -5,7 +5,7 @@ import type { DeepReadonly } from 'vue';
 import type { BlockDefinitionOptionsInput } from '../types/index.js';
 import { type RuntimeBlockOptionArray } from '#blokkli-build/runtime-options';
 export type DefinitionProvider = {
-    getBlockDefinition: (bundle: string, fieldListType: ValidFieldListTypes, parentBundle?: BlockBundleWithNested) => BlockDefinition | undefined;
+    getBlockDefinition: (bundle: string, fieldListType: ValidFieldListTypes, parentBundle?: BlockBundleWithNested | null) => BlockDefinition | undefined;
     getDefaultDefinition: (bundle: string) => BlockDefinition | undefined;
     getFragmentDefinition: (name: string) => FragmentDefinition | undefined;
     getProviderDefinition: (entityType: string, entityBundle: string) => ProviderDefinition | undefined;

package/dist/runtime/helpers/dom/index.d.ts

@@ -62,4 +62,4 @@ export declare const MOUSE_BUTTON: Readonly<{
      */
     FIFTH: 4;
 }>;
-export type CursorKeyword = 'auto' | 'default' | 'none' | 'context-menu' | 'help' | 'pointer' | 'progress' | 'wait' | 'cell' | 'crosshair' | 'text' | 'vertical-text' | 'alias' | 'copy' | 'move' | 'no-drop' | 'not-allowed' | 'e-resize' | 'n-resize' | 'ne-resize' | 'nw-resize' | 's-resize' | 'se-resize' | 'sw-resize' | 'w-resize' | 'ew-resize' | 'ns-resize' | 'nesw-resize' | 'nwse-resize' | 'col-resize' | 'row-resize' | 'all-scroll' | 'zoom-in' | 'zoom-out' | 'grab' | 'grabbing';
+export type CursorKeyword = 'alias' | 'all-scroll' | 'auto' | 'cell' | 'col-resize' | 'context-menu' | 'copy' | 'crosshair' | 'default' | 'e-resize' | 'ew-resize' | 'grab' | 'grabbing' | 'help' | 'move' | 'n-resize' | 'ne-resize' | 'nesw-resize' | 'no-drop' | 'none' | 'not-allowed' | 'ns-resize' | 'nw-resize' | 'nwse-resize' | 'pointer' | 'progress' | 'row-resize' | 's-resize' | 'se-resize' | 'sw-resize' | 'text' | 'vertical-text' | 'w-resize' | 'wait' | 'zoom-in' | 'zoom-out';

package/dist/runtime/helpers/domProvider.d.ts

@@ -1,8 +1,10 @@
 import { type ComputedRef } from '#imports';
-import type { DraggableExistingBlock, BlokkliFieldElement, DraggableItem, DroppableEntityField, EntityContext, Rectangle } from '#blokkli/types';
+import type { DraggableExistingBlock, DraggableItem, EntityContext, Rectangle, RenderedFieldListItem, RegisteredField, RegisterFieldData } from '#blokkli/types';
 import type { UiProvider } from './uiProvider.js';
 import type { DebugProvider } from './debugProvider.js';
 import type { DefinitionProvider } from './definitionProvider.js';
+import type { StateProvider } from './stateProvider.js';
+import type { ElementProvider } from './providers/element.js';
 type RegisteredFieldType = {
     entityType: string;
     entityBundle: string;
@@ -12,41 +14,35 @@ type MeasuredBlockRect = Rectangle & {
     time: number;
 };
 export type DomProvider = {
-    findBlock(uuid: string): DraggableExistingBlock | undefined;
-    getAllBlocks(): DraggableExistingBlock[];
     findClosestBlock(el: Element | EventTarget): DraggableExistingBlock | undefined;
     /**
      * Return the droppable markup for a draggable item.
      */
-    getDropElementMarkup(item: DraggableItem, checkSize?: boolean): string;
-    findField(entityUuid: string, fieldName: string): BlokkliFieldElement | undefined;
+    getDropElementMarkup(item: DraggableItem | RenderedFieldListItem, checkSize?: boolean): string;
     registerBlock: (key: string, uuid: string, el: HTMLElement | null) => void;
     unregisterBlock: (key: string, uuid: string) => void;
-    registerField: (entity: EntityContext, fieldName: string, instance: HTMLElement) => void;
-    updateFieldElement: (entity: EntityContext, fieldName: string, element: HTMLElement) => void;
+    registerField: (entity: EntityContext, fieldName: string, instance: HTMLElement, data: RegisterFieldData) => void;
+    updateFieldElement: (entity: EntityContext, fieldName: string, element: HTMLElement, data: RegisterFieldData) => void;
     unregisterField: (entity: EntityContext, fieldName: string) => void;
+    getRegisteredField: (uuid: string, fieldName: string) => RegisteredField | undefined;
     registeredFieldTypes: ComputedRef<RegisteredFieldType[]>;
     registeredBlockUuids: ComputedRef<string[]>;
-    /**
-     * Get all droppable entity fields.
-     */
-    getAllDroppableFields(): DroppableEntityField[];
     findClosestEntityContext(el: HTMLElement): EntityContext | undefined;
     getVisibleBlocks(): string[];
     getVisibleFields(): string[];
     isBlockVisible(uuid: string): boolean;
-    getActiveProviderElement: () => HTMLElement;
     getBlockRects: () => Record<string, MeasuredBlockRect>;
     getBlockRect: (uuid: string, refresh?: boolean) => MeasuredBlockRect | undefined;
     refreshBlockRect: (uuid: string) => void;
     getFieldRect: (key: string) => Rectangle | undefined;
+    registeredBlocks: ComputedRef<Record<string, HTMLElement | undefined>>;
     updateVisibleRects: () => void;
     isReady: ComputedRef<boolean>;
     init: () => void;
     /**
      * Get the drag element for a block.
      */
-    getDragElement: (block: DraggableExistingBlock) => HTMLElement | undefined;
+    getDragElement: (block: DraggableExistingBlock | RenderedFieldListItem) => HTMLElement | undefined;
     /**
      * Get debug data for troubleshooting.
      */
@@ -58,7 +54,6 @@ export type DomProvider = {
             hasRect: boolean;
             hasCurrentKey: boolean;
             isVisible: boolean;
-            inCache: boolean;
             elementInfo?: {
                 tagName: string;
                 bundle?: string;
@@ -83,7 +78,6 @@ export type DomProvider = {
             totalRegisteredFields: number;
             totalVisibleFields: number;
             totalFieldRects: number;
-            cacheSize: number;
             isInitializing: boolean;
             isReady: boolean;
         };
@@ -94,5 +88,5 @@ export type DomProvider = {
         };
     };
 };
-export default function (ui: UiProvider, debug: DebugProvider, definitions: DefinitionProvider): DomProvider;
+export default function (ui: UiProvider, debug: DebugProvider, definitions: DefinitionProvider, state: StateProvider, element: ElementProvider): DomProvider;
 export {};

package/dist/runtime/helpers/domProvider.js

@@ -1,54 +1,20 @@
 import { reactive, ref, computed } from "#imports";
 import {
   findClosestBlock,
-  buildDraggableItem,
   falsy,
-  mapDroppableField,
   findClosestEntityContext
 } from "#blokkli/helpers";
 import { cloneElementWithStyles } from "./dom/index.js";
 import onBlokkliEvent from "./composables/onBlokkliEvent.js";
 import useDelayedIntersectionObserver from "./composables/useDelayedIntersectionObserver.js";
-const buildFieldElement = (element) => {
-  const key = element.dataset.fieldKey;
-  const name = element.dataset.fieldName;
-  const label = element.dataset.fieldLabel;
-  const isNested = element.dataset.fieldIsNested === "true";
-  const nestingLevel = Number.parseInt(element.dataset.bkNestingLevel || "0");
-  const fieldListType = element.dataset.fieldListType;
-  const hostEntityType = element.dataset.hostEntityType;
-  const hostEntityBundle = element.dataset.hostEntityBundle;
-  const hostEntityUuid = element.dataset.hostEntityUuid;
-  const dropAlignment = element.dataset.fieldDropAlignment;
-  const cardinality = Number.parseInt(element.dataset.fieldCardinality || "-1");
-  const allowedBundles = (element.dataset.fieldAllowedBundles || "").split(",").filter(Boolean);
-  const allowedFragments = (element.dataset.allowedFragments || "").split(",").filter(Boolean);
-  if (key && name && label && hostEntityType && hostEntityUuid && hostEntityBundle && fieldListType) {
-    return {
-      key,
-      name,
-      label,
-      isNested,
-      nestingLevel,
-      hostEntityType,
-      hostEntityUuid,
-      hostEntityBundle,
-      cardinality: Number.isNaN(cardinality) ? -1 : cardinality,
-      allowedBundles,
-      allowedFragments,
-      fieldListType,
-      element,
-      dropAlignment: dropAlignment === "vertical" || dropAlignment === "horizontal" ? dropAlignment : void 0
-    };
-  }
-};
+import { itemEntityType } from "#blokkli-build/config";
 function rectWithTime(rect, time) {
   return {
     ...rect,
     time: time || performance.now()
   };
 }
-export default function(ui, debug, definitions) {
+export default function(ui, debug, definitions, state, element) {
   const logger = debug.createLogger("DomProvider");
   const mutationsReady = ref(true);
   const intersectionReady = ref(false);
@@ -60,13 +26,12 @@ export default function(ui, debug, definitions) {
   const fieldRects = {};
   const blockUuidCurrentKey = {};
   const observedElements = {};
-  let draggableBlockCache = {};
   let initTimeout = null;
   const isInitalizing = ref(true);
   const observedElementCache = /* @__PURE__ */ new Map();
   const registeredBlockUuids = computed(() => {
-    return Object.entries(registeredBlocks).map(([uuid, element]) => {
-      if (element) {
+    return Object.entries(registeredBlocks).map(([uuid, element2]) => {
+      if (element2) {
         return uuid;
       }
       return null;
@@ -172,19 +137,30 @@ export default function(ui, debug, definitions) {
     }
     return uniqueFieldTypes;
   });
-  const registerField = (entity, fieldName, element) => {
+  const registerField = (entity, fieldName, element2, data) => {
     const key = `${entity.uuid}:${fieldName}`;
-    registeredFields[key] = { element, entity, fieldName };
-    intersectionObserver.observe(element);
+    registeredFields[key] = {
+      element: element2,
+      entity,
+      fieldName,
+      ...data
+    };
+    intersectionObserver.observe(element2);
+    doInitTimeout();
   };
-  const updateFieldElement = (entity, fieldName, element) => {
+  const updateFieldElement = (entity, fieldName, element2, data) => {
     const key = `${entity.uuid}:${fieldName}`;
     const existingElement = registeredFields[key]?.element;
     if (existingElement) {
       intersectionObserver.unobserve(existingElement);
     }
-    registeredFields[key] = { entity, fieldName, element };
-    intersectionObserver.observe(element);
+    registeredFields[key] = {
+      entity,
+      fieldName,
+      element: element2,
+      ...data
+    };
+    intersectionObserver.observe(element2);
   };
   const unregisterField = (entity, fieldName) => {
     const key = `${entity.uuid}:${fieldName}`;
@@ -195,6 +171,10 @@ export default function(ui, debug, definitions) {
     visibleFields.delete(key);
     registeredFields[key] = void 0;
   };
+  const getRegisteredField = (uuid, fieldName) => {
+    const key = `${uuid}:${fieldName}`;
+    return registeredFields[key];
+  };
   function getElementToObserve(uuid, el, bundle, fieldListType, parentBlockBundle) {
     if (el.classList.contains("bk-block-proxy")) {
       return el;
@@ -220,40 +200,26 @@ export default function(ui, debug, definitions) {
     observedElementCache.set(key, el);
     return el;
   }
-  const findBlock = (uuid) => {
-    const cached = draggableBlockCache[uuid];
-    if (cached) {
-      return cached;
-    }
-    const el = registeredBlocks[uuid];
-    if (!el) {
-      return;
-    }
-    const item = buildDraggableItem(el);
-    if (item?.itemType === "existing") {
-      draggableBlockCache[uuid] = item;
-      return item;
-    }
-  };
-  const getAllBlocks = () => {
-    return [
-      ...document.querySelectorAll(
-        '[data-blokkli-provider-active="true"] [data-uuid]'
-      )
-    ].map((v) => {
-      const item = buildDraggableItem(v);
-      if (item?.itemType === "existing") {
-        return item;
-      }
-    }).filter(falsy);
-  };
   const getDropElementMarkup = (item, checkSize) => {
-    const el = item.itemType === "existing" ? getDragElement(item) : item.element();
+    const getElement = () => {
+      if ("itemType" in item) {
+        if (item.itemType === "existing") {
+          return getDragElement(item);
+        }
+        return item.element();
+      }
+      return getDragElement(item);
+    };
+    const el = getElement();
     if (!el) {
       return "";
     }
-    const dropElement = el.querySelector(".bk-drop-element") || el;
-    const childCount = dropElement.querySelectorAll("*").length;
+    const dropElement = element.query(el, ".bk-drop-element", "Find drop element for markup.") || el;
+    const childCount = element.queryAll(
+      dropElement,
+      "*",
+      "Get child count for drop element markup."
+    ).length;
     if (checkSize && childCount > 80) {
       return "";
     }
@@ -262,32 +228,8 @@ export default function(ui, debug, definitions) {
       ""
     );
   };
-  const findField = (uuid, fieldName) => {
-    const el = document.querySelector(
-      `[data-field-name="${fieldName}"][data-host-entity-uuid="${uuid}"]`
-    );
-    if (!(el instanceof HTMLElement)) {
-      return;
-    }
-    return buildFieldElement(el);
-  };
-  const getAllDroppableFields = () => [...document.querySelectorAll("[data-blokkli-droppable-field]")].filter((el) => {
-    return !el.closest('[data-bk-in-proxy="true"]');
-  }).map(mapDroppableField);
   const getVisibleBlocks = () => Array.from(visibleBlocks);
   const getVisibleFields = () => Array.from(visibleFields);
-  const getActiveProviderElement = () => {
-    const el = document.querySelector('[data-blokkli-provider-active="true"]');
-    if (!el) {
-      throw new Error("Failed to find active <BlokkliProvider> element.");
-    }
-    if (!(el instanceof HTMLElement)) {
-      throw new TypeError(
-        "The root element of the active <BlokkliProvider> is not an HTMLElement."
-      );
-    }
-    return el;
-  };
   function getBlockRects() {
     return blockRects;
   }
@@ -329,9 +271,7 @@ export default function(ui, debug, definitions) {
     );
   }
   function refreshFieldRect(key) {
-    const el = document.querySelector(
-      `.bk-draggable-list-container[data-field-key="${key}"]`
-    );
+    const el = registeredFields[key]?.element;
     if (!(el instanceof HTMLElement)) {
       return;
     }
@@ -372,7 +312,6 @@ export default function(ui, debug, definitions) {
   }
   onBlokkliEvent("state:reloaded", () => {
     observedElementCache.clear();
-    draggableBlockCache = {};
     if (stateReloadTimeout) {
       window.clearTimeout(stateReloadTimeout);
     }
@@ -397,16 +336,20 @@ export default function(ui, debug, definitions) {
   const dragElementUuidMap = /* @__PURE__ */ new WeakMap();
   const dragElementCache = /* @__PURE__ */ new Map();
   function getDragElement(block) {
-    const el = block.element();
+    const item = "itemType" in block ? block.block : block;
+    if (!item) {
+      return;
+    }
+    const el = registeredBlocks[item.uuid];
     if (!el) {
-      return void 0;
+      return;
     }
     return getElementToObserve(
-      block.uuid,
+      item.uuid,
       el,
-      block.itemBundle,
-      block.hostFieldListType,
-      block.hostBundle
+      item.bundle,
+      item.fieldListType,
+      item.parentBlockBundle
     );
   }
   function isBlockVisible(uuid) {
@@ -424,9 +367,7 @@ export default function(ui, debug, definitions) {
       }
     }
   }
-  function registerBlock(key, uuid, el) {
-    logger.log("registerBlock: " + uuid);
-    blockUuidCurrentKey[uuid] = key;
+  function doInitTimeout() {
     if (initTimeout) {
       window.clearTimeout(initTimeout);
     }
@@ -436,6 +377,11 @@ export default function(ui, debug, definitions) {
         refreshAllBlockRects();
       }, 500);
     }
+  }
+  function registerBlock(key, uuid, el) {
+    logger.log("registerBlock: " + uuid);
+    blockUuidCurrentKey[uuid] = key;
+    doInitTimeout();
     if (!el) {
       logger.log("registerBlock call unregisterBlock because no element", uuid);
       unregisterBlock(key, uuid);
@@ -448,19 +394,24 @@ export default function(ui, debug, definitions) {
       );
       unregisterBlock(key, uuid);
     }
-    const item = buildDraggableItem(el);
-    if (item && item.itemType === "existing") {
-      const observableElement = getElementToObserve(
-        item.uuid,
-        el,
-        item.itemBundle,
-        item.hostFieldListType,
-        item.hostBundle
-      );
-      registeredBlocks[item.uuid] = el;
-      observedElements[item.uuid] = observableElement;
-      intersectionObserver.observe(observableElement);
-      resizeObserver.observe(observableElement);
+    const item = state.getFieldListItem(uuid);
+    if (item) {
+      const fieldList = state.getFieldListForBlock(item.uuid);
+      if (fieldList) {
+        const fieldListType = getRegisteredField(fieldList.entityUuid, fieldList.name)?.fieldListType ?? "default";
+        const parentBundle = fieldList.entityType === itemEntityType ? state.getFieldListItem(fieldList.entityUuid)?.bundle ?? null : null;
+        const observableElement = getElementToObserve(
+          item.uuid,
+          el,
+          item.bundle,
+          fieldListType,
+          parentBundle
+        );
+        registeredBlocks[uuid] = el;
+        observedElements[uuid] = observableElement;
+        intersectionObserver.observe(observableElement);
+        resizeObserver.observe(observableElement);
+      }
     }
   }
   function unregisterBlock(key, uuid) {
@@ -490,8 +441,7 @@ export default function(ui, debug, definitions) {
       ...Object.keys(registeredBlocks),
       ...Object.keys(blockRects),
       ...Object.keys(observedElements),
-      ...Object.keys(blockUuidCurrentKey),
-      ...Object.keys(draggableBlockCache)
+      ...Object.keys(blockUuidCurrentKey)
     ]);
     const blocksInfo = Array.from(allUuids).map((uuid) => {
       const el = registeredBlocks[uuid];
@@ -502,7 +452,6 @@ export default function(ui, debug, definitions) {
         hasRect: !!blockRects[uuid],
         hasCurrentKey: !!blockUuidCurrentKey[uuid],
         isVisible: visibleBlocks.has(uuid),
-        inCache: !!draggableBlockCache[uuid],
         elementInfo: el ? {
           tagName: el.tagName,
           bundle: el.dataset.itemBundle,
@@ -547,7 +496,6 @@ export default function(ui, debug, definitions) {
         ).length,
         totalVisibleFields: visibleFields.size,
         totalFieldRects: Object.keys(fieldRects).length,
-        cacheSize: Object.keys(draggableBlockCache).length,
         isInitializing: isInitalizing.value,
         isReady: mutationsReady.value && intersectionReady.value && !isInitalizing.value
       },
@@ -559,19 +507,14 @@ export default function(ui, debug, definitions) {
     };
   }
   return {
-    findBlock,
-    getAllBlocks,
     findClosestBlock,
     getDropElementMarkup,
-    findField,
-    getAllDroppableFields,
     findClosestEntityContext,
     getVisibleBlocks,
     getVisibleFields,
     registerField,
     unregisterField,
     updateFieldElement,
-    getActiveProviderElement,
     getBlockRects,
     getBlockRect,
     getFieldRect,
@@ -587,6 +530,8 @@ export default function(ui, debug, definitions) {
     registerBlock,
     unregisterBlock,
     registeredBlockUuids,
-    getDebugData
+    getDebugData,
+    getRegisteredField,
+    registeredBlocks: computed(() => registeredBlocks)
   };
 }

package/dist/runtime/helpers/index.d.ts

@@ -1,4 +1,4 @@
-import type { DraggableItem, Rectangle, DroppableEntityField, DraggableExistingBlock, EntityContext, Coord, LibraryItemProps, Size } from '#blokkli/types';
+import type { DraggableItem, Rectangle, DraggableExistingBlock, EntityContext, Coord, LibraryItemProps, Size } from '#blokkli/types';
 import type { RGB } from '#blokkli/types/theme';
 /**
  * Type check for falsy values.
@@ -11,7 +11,6 @@ export declare function falsy<T>(value: T): value is NonNullable<T>;
  * Maps a HTML element that is draggable to a draggable item data object.
  */
 export declare function buildDraggableItem(element: Element | EventTarget): DraggableItem | undefined;
-export declare function findElement(uuid: string): HTMLElement | undefined;
 export declare function onlyUnique(value: string, index: number, self: Array<string>): boolean;
 /**
  * Convert a date to a relative time string, such as
@@ -83,12 +82,6 @@ export declare const findClosestBlock: (el: Element | EventTarget) => DraggableE
  */
 export declare const findClosestEntityContext: (el: HTMLElement) => EntityContext | undefined;
 export declare const findParentContext: (el: HTMLElement) => EntityContext | DraggableExistingBlock | undefined;
-/**
- * Maps a HTMLElement to a DroppableEntityField.
- */
-export declare const mapDroppableField: (el: Element) => DroppableEntityField;
-export declare const originatesFromEditable: (e: MouseEvent | TouchEvent) => HTMLElement | undefined;
-export declare const getOriginatingDroppableElement: (e: MouseEvent | TouchEvent) => HTMLElement | undefined;
 export declare const originatesFromTextInput: (e: Event) => boolean;
 export declare function getFieldKey(uuid: string, fieldName: string): string;
 export declare function getInteractionCoordinates(e: MouseEvent | TouchEvent): Coord;

package/dist/runtime/helpers/index.js

@@ -1,5 +1,4 @@
 import { easeOutSine } from "./easing.js";
-import { useRuntimeConfig } from "#imports";
 export function falsy(value) {
   return value !== null && value !== void 0;
 }
@@ -7,44 +6,8 @@ export function buildDraggableItem(element) {
   if (!(element instanceof HTMLElement)) {
     return;
   }
-  const itemEntityType = useRuntimeConfig().public.blokkli.itemEntityType;
   const dataset = element.dataset;
-  if (dataset.elementType === "existing") {
-    const uuid = dataset.uuid;
-    const itemBundle = dataset.itemBundle;
-    const entityType = dataset.entityType;
-    const hostType = dataset.hostType;
-    const hostUuid = dataset.hostUuid;
-    const hostBundle = dataset.hostBundle;
-    const hostFieldName = dataset.hostFieldName;
-    const reusableBundle = dataset.reusableBundle;
-    const hostFieldListType = dataset.hostFieldListType;
-    const libraryItemUuid = dataset.bkLibraryItemUuid;
-    const isNew = dataset.isNew === "true";
-    const parentBlockBundle = hostType === itemEntityType ? hostBundle : void 0;
-    if (uuid && hostType && hostUuid && hostFieldName && itemBundle && hostBundle && entityType && hostFieldListType) {
-      const libraryLabel = dataset.bkLibraryLabel;
-      const editTitle = libraryLabel || "";
-      return {
-        itemType: "existing",
-        element: () => document.querySelector(`[data-uuid="${uuid}"]`),
-        itemBundle,
-        entityType,
-        isNested: hostType === itemEntityType,
-        uuid,
-        hostType,
-        hostBundle,
-        hostUuid,
-        hostFieldName,
-        hostFieldListType,
-        reusableBundle,
-        libraryItemUuid,
-        editTitle: editTitle || void 0,
-        isNew,
-        parentBlockBundle
-      };
-    }
-  } else if (dataset.elementType === "new") {
+  if (dataset.elementType === "new") {
     const itemBundle = dataset.itemBundle;
     if (itemBundle) {
       return {
@@ -111,14 +74,6 @@ export function buildDraggableItem(element) {
     }
   }
 }
-export function findElement(uuid) {
-  const el = document.querySelector(
-    `[data-uuid="${uuid}"]:not(.bk-sortli-leave-from)`
-  );
-  if (el instanceof HTMLElement) {
-    return el;
-  }
-}
 export function onlyUnique(value, index, self) {
   return self.indexOf(value) === index;
 }
@@ -443,44 +398,6 @@ export const findParentContext = (el) => {
   }
   return findClosestEntityContext(el);
 };
-export const mapDroppableField = (el) => {
-  if (!(el instanceof HTMLElement)) {
-    throw new TypeError(
-      `v-blokkli-droppable directive is only allowed on elements of type HTMLElement.`
-    );
-  }
-  const fieldName = el.dataset.blokkliDroppableField;
-  if (!fieldName) {
-    throw new Error(`Missing field name in v-blokkli-droppable directive.`);
-  }
-  const host = findParentContext(el);
-  if (!host) {
-    throw new Error(
-      `Failed to locate parent context for v-blokkli-droppable field with name "${fieldName}". Make sure the element is always rendered inside a block component or inside a <BlokkliProvider>.`
-    );
-  }
-  return {
-    element: el,
-    host,
-    fieldName
-  };
-};
-export const originatesFromEditable = (e) => {
-  if (e.target instanceof HTMLElement) {
-    const el = e.target.closest("[data-blokkli-editable-field]");
-    if (el instanceof HTMLElement) {
-      return el;
-    }
-  }
-};
-export const getOriginatingDroppableElement = (e) => {
-  if (e.target instanceof HTMLElement) {
-    const el = e.target.closest("[data-blokkli-droppable-field]");
-    if (el instanceof HTMLElement) {
-      return el;
-    }
-  }
-};
 export const originatesFromTextInput = (e) => e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement;
 export function getFieldKey(uuid, fieldName) {
   return uuid + ":" + fieldName;

package/dist/runtime/helpers/providers/blocks.d.ts

@@ -0,0 +1,10 @@
+import type { RenderedFieldListItem } from '#blokkli/types';
+import type { DomProvider } from '../domProvider.js';
+import type { StateProvider } from '../stateProvider.js';
+import type { AdapterContext } from '#blokkli/adapter';
+import type { ComputedRef } from 'vue';
+export type BlocksProvider = {
+    getBlock: (uuid: string) => RenderedFieldListItem | undefined;
+    getAllBlocks: () => RenderedFieldListItem[];
+};
+export default function (state: StateProvider, dom: DomProvider, context: ComputedRef<AdapterContext>): BlocksProvider;