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

package/dist/runtime/helpers/stateProvider.js

@@ -12,6 +12,7 @@ import { falsy, getFieldKey } from "#blokkli/helpers";
 import { eventBus, emitMessage } from "#blokkli/helpers/eventBus";
 import { nextTick } from "#imports";
 import { addElementClasses } from "./addElementClasses.js";
+import { BUNDLE_FROM_LIBRARY } from "#blokkli/constants";
 const HOST_OPTION_KEY = "HOST";
 function mapPublishOptions(context) {
   return {
@@ -24,7 +25,7 @@ function mapPublishOptions(context) {
     revisionLogMessage: context?.publishOptions?.revisionLogMessage ?? null
   };
 }
-export default async function(adapter, context, $t, providerKey) {
+export default async function(adapter, context, $t, providerKey, permissions) {
   let _mappedState = null;
   const overrideHostOptions = useState("options:" + providerKey);
   const stateLoaded = ref(false);
@@ -56,10 +57,12 @@ export default async function(adapter, context, $t, providerKey) {
   });
   let fieldBlockCount = {};
   const blockBundleCount = ref({});
-  const fieldListItemMap = /* @__PURE__ */ new Map();
+  const fieldListItemMap = ref({});
   let bundleToUuids = {};
+  const fromLibraryUuids = ref([]);
+  const nestingLevelMap = /* @__PURE__ */ new Map();
   function getFieldListItem(uuid) {
-    const fieldKey = fieldListItemMap.get(uuid);
+    const fieldKey = fieldListItemMap.value[uuid];
     if (!fieldKey) {
       return;
     }
@@ -69,8 +72,11 @@ export default async function(adapter, context, $t, providerKey) {
     }
     return field.list.find((v) => v.uuid === uuid);
   }
+  function getFieldKeyForUuid(uuid) {
+    return fieldListItemMap.value[uuid] ?? null;
+  }
   function getFieldListForBlock(uuid) {
-    const fieldKey = fieldListItemMap.get(uuid);
+    const fieldKey = fieldListItemMap.value[uuid];
     if (!fieldKey) {
       return;
     }
@@ -140,9 +146,11 @@ export default async function(adapter, context, $t, providerKey) {
     mutatedEntity.value = context2?.mutatedEntity;
     const visitedFieldKeys = [];
     const newBlockBundleCount = {};
-    fieldListItemMap.clear();
+    fieldListItemMap.value = {};
+    nestingLevelMap.clear();
     fieldBlockCount = {};
     bundleToUuids = {};
+    const fromLibrary = [];
     for (let i = 0; i < newMutatedFields.length; i++) {
       const field = newMutatedFields[i];
       const key = getFieldKey(field.entityUuid, field.name);
@@ -157,11 +165,21 @@ export default async function(adapter, context, $t, providerKey) {
           newBlockBundleCount[item.bundle] = 0;
         }
         newBlockBundleCount[item.bundle]++;
-        fieldListItemMap.set(item.uuid, key);
+        fieldListItemMap.value[item.uuid] = key;
         if (!bundleToUuids[item.bundle]) {
           bundleToUuids[item.bundle] = [];
         }
         bundleToUuids[item.bundle].push(item.uuid);
+        if (item.bundle === BUNDLE_FROM_LIBRARY) {
+          fromLibrary.push(item.uuid);
+        }
+      }
+    }
+    for (let i = 0; i < newMutatedFields.length; i++) {
+      const field = newMutatedFields[i];
+      for (let j = 0; j < field.list.length; j++) {
+        const item = field.list[j];
+        calculateNestingLevel(item.uuid);
       }
     }
     blockBundleCount.value = newBlockBundleCount;
@@ -172,6 +190,7 @@ export default async function(adapter, context, $t, providerKey) {
         mutatedFieldsMap[key] = void 0;
       }
     }
+    fromLibraryUuids.value = fromLibrary;
     eventBus.emit("updateMutatedFields", { fields: newMutatedFields });
     nextTick(() => {
       refreshKey.value = Date.now().toString();
@@ -201,10 +220,53 @@ export default async function(adapter, context, $t, providerKey) {
   }
   function getAllUuids(bundle) {
     if (!bundle) {
-      return [...fieldListItemMap.keys()];
+      return [...Object.keys(fieldListItemMap.value)];
     }
     return bundleToUuids[bundle] ?? [];
   }
+  function calculateNestingLevel(uuid) {
+    const cached = nestingLevelMap.get(uuid);
+    if (cached !== void 0) {
+      return cached;
+    }
+    const fieldKey = fieldListItemMap.value[uuid];
+    if (!fieldKey) {
+      nestingLevelMap.set(uuid, 0);
+      return 0;
+    }
+    const field = mutatedFieldsMap[fieldKey];
+    if (!field) {
+      nestingLevelMap.set(uuid, 0);
+      return 0;
+    }
+    const parentEntityUuid = field.entityUuid;
+    const parentFieldKey = fieldListItemMap.value[parentEntityUuid];
+    if (!parentFieldKey) {
+      nestingLevelMap.set(uuid, 0);
+      return 0;
+    }
+    const parentLevel = calculateNestingLevel(parentEntityUuid);
+    const level = parentLevel + 1;
+    nestingLevelMap.set(uuid, level);
+    return level;
+  }
+  function getNestingLevel(uuid) {
+    return nestingLevelMap.get(uuid) ?? 0;
+  }
+  function isChildOf(childUuid, parentUuid) {
+    const fieldKey = fieldListItemMap.value[childUuid];
+    if (!fieldKey) {
+      return false;
+    }
+    const field = mutatedFieldsMap[fieldKey];
+    if (!field) {
+      return false;
+    }
+    if (field.entityUuid === parentUuid) {
+      return true;
+    }
+    return isChildOf(field.entityUuid, parentUuid);
+  }
   addElementClasses(document.body, "bk-body-loading", isLoading);
   const mutateWithLoadingState = async (callback, errorMessage, successMessage) => {
     if (!callback) {
@@ -230,11 +292,13 @@ export default async function(adapter, context, $t, providerKey) {
       }
       return true;
     } catch (e) {
-      emitMessage(
-        errorMessage || $t("unexpectedMutationError", "An unexpected error happened."),
-        "error",
-        e
-      );
+      if (errorMessage !== false) {
+        emitMessage(
+          errorMessage || $t("unexpectedMutationError", "An unexpected error happened."),
+          "error",
+          e
+        );
+      }
     }
     unlockBody();
     return false;
@@ -254,7 +318,7 @@ export default async function(adapter, context, $t, providerKey) {
     }
   }
   const canEdit = computed(
-    () => stateLoaded.value && !!owner.value?.currentUserIsOwner && !stateLoadError.value
+    () => stateLoaded.value && !!owner.value?.currentUserIsOwner && !stateLoadError.value && permissions.includes("edit")
   );
   const isTranslation = computed(
     () => context.value.language !== translation.value.sourceLanguage && translation.value.isTranslatable
@@ -322,7 +386,12 @@ export default async function(adapter, context, $t, providerKey) {
     getMutatedField,
     getFieldListForBlock,
     getAllUuids,
+    getNestingLevel,
+    isChildOf,
     setOverrideState,
-    clearOverrideState
+    clearOverrideState,
+    fromLibraryUuids: readonly(fromLibraryUuids),
+    permissions: computed(() => permissions),
+    getFieldKeyForUuid
   };
 }

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

@@ -1,7 +1,8 @@
 import { type ComputedRef, type WritableComputedRef } from '#imports';
-import type { BlokkliAdapter } from '#blokkli/adapter';
+import type { AdapterContext, BlokkliAdapter } from '#blokkli/adapter';
 export type StorageProvider = {
     use: <T>(key: string | ComputedRef<string>, defaultValue: T, persist?: boolean) => WritableComputedRef<T>;
+    useWithContextPrefix: <T>(key: string, defaultValue: T, persist?: boolean) => WritableComputedRef<T>;
     clearAll: () => void;
     clear: (key: string) => void;
 };
@@ -13,4 +14,4 @@ export type StorageProvider = {
  * This composable can be used to keep state across page navigations and
  * even after a refresh.
  */
-export default function (adapter: BlokkliAdapter<any>): Promise<StorageProvider>;
+export default function (adapter: BlokkliAdapter<any>, context: ComputedRef<AdapterContext>): Promise<StorageProvider>;

package/dist/runtime/helpers/storageProvider.js

@@ -15,7 +15,7 @@ const getExisting = (key) => {
   } catch {
   }
 };
-export default async function(adapter) {
+export default async function(adapter, context) {
   const values = ref({});
   const defaults = ref({});
   let timeout = null;
@@ -97,6 +97,10 @@ export default async function(adapter) {
       }
     });
   };
+  const useWithContextPrefix = (key, providedDefaultValue, persist) => {
+    const fullKey = key + ":" + context.value.entityType + ":" + context.value.entityUuid;
+    return use(fullKey, providedDefaultValue, persist);
+  };
   const clearAll = () => {
     values.value = {};
     Object.keys(window.localStorage).forEach((key) => {
@@ -110,5 +114,5 @@ export default async function(adapter) {
     values.value[storageKey] = void 0;
     window.localStorage.removeItem(storageKey);
   };
-  return { use, clearAll, clear };
+  return { use, useWithContextPrefix, clearAll, clear };
 }

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

@@ -6,6 +6,7 @@ export declare const INJECT_NESTING_LEVEL: unique symbol;
 export declare const INJECT_IS_PREVIEW: unique symbol;
 export declare const INJECT_IS_IN_REUSABLE: unique symbol;
 export declare const INJECT_REUSABLE_OPTIONS: unique symbol;
+export declare const INJECT_REUSABLE_UUID: unique symbol;
 export declare const INJECT_FIELD_LIST_TYPE: unique symbol;
 export declare const INJECT_FIELD_LIST_BLOCKS: unique symbol;
 export declare const INJECT_FIELD_PROXY_MODE: unique symbol;

package/dist/runtime/helpers/symbols.js

@@ -6,6 +6,7 @@ export const INJECT_NESTING_LEVEL = Symbol("blokkli_nesting_level");
 export const INJECT_IS_PREVIEW = Symbol("blokkli_is_preview");
 export const INJECT_IS_IN_REUSABLE = Symbol("blokkli_is_in_reusable");
 export const INJECT_REUSABLE_OPTIONS = Symbol("blokkli_from_library_options");
+export const INJECT_REUSABLE_UUID = Symbol("blokkli_from_library_uuid");
 export const INJECT_FIELD_LIST_TYPE = Symbol("blokkli_field_list_type");
 export const INJECT_FIELD_LIST_BLOCKS = Symbol("blokkli_field_list_blocks");
 export const INJECT_FIELD_PROXY_MODE = Symbol("blokkli_field_proxy_mode");

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

@@ -1,6 +1,7 @@
 import type { DraggableStyle } from '#blokkli/types';
 import type { RGB, ThemeColorGroup, ThemeColorShade, ThemeColors, ThemeContextColorGroup, ThemeContextColorShade, ThemeContextColors, ThemeName } from '#blokkli/types/theme';
 import { type Ref } from '#imports';
+import type { ElementProvider } from './providers/element.js';
 type ThemeMap = {
     accent: Ref<ThemeColors>;
     mono: Ref<ThemeColors>;
@@ -25,5 +26,5 @@ export type ThemeProvider = {
     getColor<K extends keyof ThemeMap, T extends ThemeMap[K]['value']>(color: K, key: keyof T): RGB;
     getColorString<K extends keyof ThemeMap, T extends ThemeMap[K]['value']>(color: K, key: keyof T, alpha?: number): string;
 };
-export default function (): ThemeProvider;
+export default function (element: ElementProvider): ThemeProvider;
 export {};

package/dist/runtime/helpers/themeProvider.js

@@ -3,7 +3,15 @@ import { ref, onMounted, onBeforeUnmount } from "#imports";
 import { rgbaToString } from "./index.js";
 import { DragStyle } from "./DragStyle/index.js";
 import onBlokkliEvent from "./composables/onBlokkliEvent.js";
-export default function() {
+export default function(element) {
+  const rootElement = element.query(
+    document,
+    ":root",
+    "Get document root element for setting theme color."
+  );
+  if (!rootElement) {
+    throw new Error("Failed to query :root - is this even possible?");
+  }
   const originalBrowserThemeColor = ref("");
   const THEME_COLOR = "black";
   const accent = ref(theme.accent);
@@ -44,13 +52,10 @@ export default function() {
     } else if (group === "lime") {
       lime.value[shade] = value;
     }
-    const root = document.querySelector(":root");
-    if (root instanceof HTMLElement) {
-      root.style.setProperty(
-        `--bk-theme-${group}-${shade}`,
-        `${value[0]} ${value[1]} ${value[2]}`
-      );
-    }
+    rootElement.style.setProperty(
+      `--bk-theme-${group}-${shade}`,
+      `${value[0]} ${value[1]} ${value[2]}`
+    );
   };
   const setColorsFromTheme = (v) => {
     Object.entries(v).forEach(([group, colors]) => {
@@ -79,7 +84,11 @@ export default function() {
     }
   };
   onMounted(() => {
-    const el = document.head.querySelectorAll('[name="theme-color"]');
+    const el = element.query(
+      document.head,
+      '[name="theme-color"]',
+      "Theme: theme-color"
+    );
     if (el instanceof HTMLMetaElement) {
       originalBrowserThemeColor.value = el.content;
       el.content = THEME_COLOR;
@@ -87,14 +96,15 @@ export default function() {
       const meta = document.createElement("meta");
       meta.name = "theme-color";
       meta.content = THEME_COLOR;
-      const head = document.getElementsByTagName("head")[0];
-      if (head) {
-        head.appendChild(meta);
-      }
+      document.head.appendChild(meta);
     }
   });
   onBeforeUnmount(() => {
-    const el = document.head.querySelectorAll('[name="theme-color"]');
+    const el = element.query(
+      document.head,
+      '[name="theme-color"]',
+      "Theme: theme-color"
+    );
     if (el instanceof HTMLMetaElement) {
       if (originalBrowserThemeColor.value) {
         el.content = originalBrowserThemeColor.value;

package/dist/runtime/helpers/typesProvider.js

@@ -1,5 +1,4 @@
-import { eventBus } from "#blokkli/helpers/eventBus";
-import { useRuntimeConfig, computed, watch } from "#imports";
+import { useRuntimeConfig, computed } from "#imports";
 import { onlyUnique } from "./index.js";
 class ConfigMap {
   configs = [];
@@ -52,38 +51,23 @@ export default async function(adapter, selection, context) {
   const droppableFieldConfigData = adapter.getDroppableFieldConfig ? await adapter.getDroppableFieldConfig() : [];
   const droppableFieldConfig = new ConfigMap(droppableFieldConfigData);
   const allowedTypesInList = computed(() => {
-    if (!selection.blocks.value.length) {
+    if (!selection.items.value.length) {
       return [];
     }
     let hostType = "";
     let hostBundle = "";
     let fieldName = "";
-    for (let i = 0; i < selection.blocks.value.length; i++) {
-      const block = selection.blocks.value[i];
-      if (i !== 0 && (hostType !== block.hostType || hostBundle !== block.hostBundle || fieldName !== block.hostFieldName)) {
+    for (let i = 0; i < selection.items.value.length; i++) {
+      const block = selection.items.value[i];
+      if (i !== 0 && (hostType !== block.host.type || hostBundle !== block.host.bundle || fieldName !== block.host.fieldName)) {
         return [];
       }
-      hostType = block.hostType;
-      hostBundle = block.hostBundle;
-      fieldName = block.hostFieldName;
+      hostType = block.host.type;
+      hostBundle = block.host.bundle;
+      fieldName = block.host.fieldName;
     }
     return fieldConfig.forName(hostType, hostBundle, fieldName)?.allowedBundles || [];
   });
-  watch(selection.blocks, () => {
-    if (selection.blocks.value.length !== 1) {
-      return;
-    }
-    const item = selection.blocks.value[0];
-    const hasNested = itemBundlesWithNested.includes(item.itemBundle);
-    if (hasNested) {
-      const nestedFields = fieldConfig.forEntityTypeAndBundle(itemEntityType, item.itemBundle).map((v) => v.name) || [];
-      if (nestedFields.length === 1) {
-        eventBus.emit("setActiveFieldKey", `${item.uuid}:${nestedFields[0]}`);
-        return;
-      }
-    }
-    eventBus.emit("setActiveFieldKey", `${item.hostUuid}:${item.hostFieldName}`);
-  });
   const itemBundlesWithNested = fieldConfig.forEntityType(itemEntityType).map((v) => v.entityBundle) || [];
   const typeMap = bundleDefinitions.reduce((acc, type) => {
     acc[type.id] = type;
@@ -96,8 +80,8 @@ export default async function(adapter, selection, context) {
     return fieldConfig.forName(entityType, entityBundle, fieldName);
   }
   function getDroppableFieldConfig(fieldName, host) {
-    const entityType = "entityType" in host ? host.entityType : host.type;
-    const entityBundle = "itemBundle" in host ? host.itemBundle : host.bundle;
+    const entityType = "itemType" in host ? host.block.host.type : host.type;
+    const entityBundle = "itemType" in host ? host.block.host.bundle : host.bundle;
     const config = droppableFieldConfig.forName(
       entityType,
       entityBundle,

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

@@ -4,10 +4,12 @@ import type { AddListOrientation, Coord, Rectangle, Size } from '#blokkli/types'
 import type { Viewport } from '#blokkli/constants';
 import type { StateProvider } from './stateProvider.js';
 import type { AdapterContext } from '#blokkli/adapter';
+import type { ThemeColorName } from '#blokkli/types/theme';
+import type { ElementProvider } from './providers/element.js';
 export type UiProvider = {
     rootElement: () => HTMLElement;
     artboardElement: () => HTMLElement;
-    providerElement: () => HTMLElement;
+    providerElement: HTMLElement;
     menu: {
         isOpen: Readonly<Ref<boolean>>;
         close: () => void;
@@ -19,7 +21,11 @@ export type UiProvider = {
     isAnalyzing: Ref<boolean>;
     isProxyMode: Ref<boolean>;
     hasDialogOpen: Ref<boolean>;
-    hasAddTooltipOpen: Ref<boolean>;
+    hasTooltipOpen: ComputedRef<boolean>;
+    openTooltip: Ref<string>;
+    selectionColor: ComputedRef<ThemeColorName | null>;
+    setSelectionColor: (id: string, color: ThemeColorName) => void;
+    removeSelectionColor: (id: string) => void;
     hasTransformOverlayOpen: Ref<boolean>;
     isTransforming: ComputedRef<boolean>;
     setTransform: (label?: string | null | undefined) => void;
@@ -44,5 +50,7 @@ export type UiProvider = {
     formatDate: (date: string | Date, options?: Intl.DateTimeFormatOptions) => string;
     getAbsoluteElementRect: (v: HTMLElement | Rectangle, scale?: number, offset?: Coord) => Rectangle;
     getViewportRelativeRect: (rect: Rectangle, scale?: number, offset?: Coord) => Rectangle;
+    setBannerHeight: (id: string, height: number) => void;
+    removeBanner: (id: string) => void;
 };
-export default function (storage: StorageProvider, state: StateProvider, context: ComputedRef<AdapterContext>): UiProvider;
+export default function (providerElement: HTMLElement, storage: StorageProvider, state: StateProvider, context: ComputedRef<AdapterContext>, element: ElementProvider): UiProvider;

package/dist/runtime/helpers/uiProvider.js

@@ -15,10 +15,9 @@ const localeMap = {
   it: "it-CH",
   en: "en-GB"
 };
-export default function(storage, state, context) {
+export default function(providerElement, storage, state, context, element) {
   let cachedRootElement = null;
   let cachedArtboardElement = null;
-  let cachedProviderElement = null;
   const interfaceLanguage = computed(() => {
     return forceDefaultLanguage ? defaultLanguage : context.value.language;
   });
@@ -29,12 +28,19 @@ export default function(storage, state, context) {
   const isProxyMode = ref(false);
   const menuIsOpen = ref(false);
   const hasDialogOpen = ref(false);
-  const hasAddTooltipOpen = ref(false);
+  const openTooltip = ref("");
   const hasTransformOverlayOpen = ref(false);
   const isAnimating = ref(false);
   const isAnalyzing = ref(false);
   const transformLabel = ref("");
   const openContextMenu = ref("");
+  const banners = ref({});
+  function setBannerHeight(id, height) {
+    banners.value[id] = height;
+  }
+  function removeBanner(id) {
+    banners.value[id] = 0;
+  }
   const selectionTopLeft = ref({ x: 0, y: 0 });
   const baseSettings = storage.use("feature:settings:settings", {});
   const lowPerformanceMode = computed(
@@ -79,7 +85,11 @@ export default function(storage, state, context) {
     if (cachedArtboardElement) {
       return cachedArtboardElement;
     }
-    const el = document.querySelector(".bk-main-canvas");
+    const el = element.query(
+      document.documentElement,
+      ".bk-main-canvas",
+      "Get main canvas."
+    );
     if (!el || !(el instanceof HTMLElement)) {
       throw new Error("Failed to locate artboard element.");
     }
@@ -90,24 +100,17 @@ export default function(storage, state, context) {
     if (cachedRootElement) {
       return cachedRootElement;
     }
-    const el = document.querySelector("#nuxt-root");
+    const el = element.query(
+      document.documentElement,
+      "#nuxt-root",
+      "Get Nuxt root element."
+    );
     if (!el || !(el instanceof HTMLElement)) {
       throw new Error("Failed to locate root Nuxt element.");
     }
     cachedRootElement = el;
     return el;
   };
-  const providerElement = () => {
-    if (cachedProviderElement) {
-      return cachedProviderElement;
-    }
-    const el = document.querySelector('[data-blokkli-provider-active="true"]');
-    if (!el || !(el instanceof HTMLElement)) {
-      throw new Error("Failed to locate provider element.");
-    }
-    cachedProviderElement = el;
-    return el;
-  };
   const appViewport = computed(() => {
     if (viewportWidth.value < 1024) {
       return "mobile";
@@ -175,6 +178,11 @@ export default function(storage, state, context) {
         height -= 70;
       }
     }
+    const bannerHeights = Object.values(banners.value).filter(Boolean);
+    bannerHeights.forEach((bannerHeight) => {
+      height -= bannerHeight;
+    });
+    height -= bannerHeights.length * 10;
     return height;
   });
   const blockingPaddingX = computed(() => 15);
@@ -279,6 +287,20 @@ export default function(storage, state, context) {
     resizeObserver.unobserve(artboard);
     resizeObserver.disconnect();
   });
+  const hasTooltipOpen = computed(() => !!openTooltip.value);
+  const selectionColors = ref([]);
+  function setSelectionColor(id, color) {
+    selectionColors.value = [
+      ...selectionColors.value.filter((v) => v.id !== id),
+      { id, color }
+    ];
+  }
+  function removeSelectionColor(id) {
+    selectionColors.value = selectionColors.value.filter((v) => v.id !== id);
+  }
+  const selectionColor = computed(() => {
+    return selectionColors.value[selectionColors.value.length - 1]?.color ?? null;
+  });
   return {
     menu: {
       isOpen: menuIsOpen,
@@ -318,6 +340,12 @@ export default function(storage, state, context) {
     formatDate,
     hasDialogOpen,
     hasTransformOverlayOpen,
-    hasAddTooltipOpen
+    hasTooltipOpen,
+    openTooltip,
+    selectionColor,
+    setSelectionColor,
+    removeSelectionColor,
+    setBannerHeight,
+    removeBanner
   };
 }

package/dist/runtime/icons/calendar.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 11H9V13H7V11M21 5V19C21 20.11 20.11 21 19 21H5C3.89 21 3 20.1 3 19V5C3 3.9 3.9 3 5 3H6V1H8V3H16V1H18V3H19C20.11 3 21 3.9 21 5M5 7H19V5H5V7M19 19V9H5V19H19M15 13V11H17V13H15M11 13V11H13V13H11M7 15H9V17H7V15M15 17V15H17V17H15M11 17V15H13V17H11Z" /></svg>

package/dist/runtime/icons/clock.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C6.47,22 2,17.5 2,12A10,10 0 0,1 12,2M12.5,7V12.25L17,14.92L16.25,16.15L11,13V7H12.5Z" /></svg>

package/dist/runtime/icons/comment_add.svg

@@ -1,5 +1 @@
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-    <path
-      d="M9,22A1,1 0 0,1 8,21V18H4A2,2 0 0,1 2,16V4C2,2.89 2.9,2 4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H13.9L10.2,21.71C10,21.9 9.75,22 9.5,22V22H9M10,16V19.08L13.08,16H20V4H4V16H10M11,6H13V9H16V11H13V14H11V11H8V9H11V6Z"
-    />
-  </svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9,22A1,1 0 0,1 8,21V18H4A2,2 0 0,1 2,16V4C2,2.89 2.9,2 4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H13.9L10.2,21.71C10,21.9 9.75,22 9.5,22V22H9M10,16V19.08L13.08,16H20V4H4V16H10M11,6H13V9H16V11H13V14H11V11H8V9H11V6Z" /></svg>

package/dist/runtime/icons/delete.svg

@@ -1,8 +1 @@
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 32 32"
-  >
-    <path
-      d="M 15 4 C 14.476563 4 13.941406 4.183594 13.5625 4.5625 C 13.183594 4.941406 13 5.476563 13 6 L 13 7 L 7 7 L 7 9 L 8 9 L 8 25 C 8 26.644531 9.355469 28 11 28 L 23 28 C 24.644531 28 26 26.644531 26 25 L 26 9 L 27 9 L 27 7 L 21 7 L 21 6 C 21 5.476563 20.816406 4.941406 20.4375 4.5625 C 20.058594 4.183594 19.523438 4 19 4 Z M 15 6 L 19 6 L 19 7 L 15 7 Z M 10 9 L 24 9 L 24 25 C 24 25.554688 23.554688 26 23 26 L 11 26 C 10.445313 26 10 25.554688 10 25 Z M 12 12 L 12 23 L 14 23 L 14 12 Z M 16 12 L 16 23 L 18 23 L 18 12 Z M 20 12 L 20 23 L 22 23 L 22 12 Z"
-    ></path>
-  </svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9,3V4H4V6H5V19A2,2 0 0,0 7,21H17A2,2 0 0,0 19,19V6H20V4H15V3H9M7,6H17V19H7V6M9,8V17H11V8H9M13,8V17H15V8H13Z" /></svg>

package/dist/runtime/icons/duplicate.svg

@@ -1,12 +1 @@
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    x="0px"
-    y="0px"
-    width="100"
-    height="100"
-    viewBox="0 0 32 32"
-  >
-    <path
-      d="M 8 4 L 8 8 L 4 8 L 4 28 L 24 28 L 24 27 L 24 24 L 28 24 L 28 4 L 8 4 z M 10 6 L 26 6 L 26 22 L 24 22 L 24 8 L 10 8 L 10 6 z M 6 10 L 22 10 L 22 26 L 6 26 L 6 10 z M 13 14 L 13 17 L 10 17 L 10 19 L 13 19 L 13 22 L 15 22 L 15 19 L 18 19 L 18 17 L 15 17 L 15 14 L 13 14 z"
-    ></path>
-  </svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18 11H15V14H13V11H10V9H13V6H15V9H18M20 4V16H8V4H20M20 2H8C6.9 2 6 2.9 6 4V16C6 17.11 6.9 18 8 18H20C21.11 18 22 17.11 22 16V4C22 2.9 21.11 2 20 2M4 6H2V20C2 21.11 2.9 22 4 22H18V20H4V6Z" /></svg>

package/dist/runtime/icons/edit.svg

@@ -1,8 +1 @@
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 32 32"
-  >
-    <path
-      d="M 23.90625 3.96875 C 22.859375 3.96875 21.8125 4.375 21 5.1875 L 5.1875 21 L 5.125 21.3125 L 4.03125 26.8125 L 3.71875 28.28125 L 5.1875 27.96875 L 10.6875 26.875 L 11 26.8125 L 26.8125 11 C 28.4375 9.375 28.4375 6.8125 26.8125 5.1875 C 26 4.375 24.953125 3.96875 23.90625 3.96875 Z M 23.90625 5.875 C 24.410156 5.875 24.917969 6.105469 25.40625 6.59375 C 26.378906 7.566406 26.378906 8.621094 25.40625 9.59375 L 24.6875 10.28125 L 21.71875 7.3125 L 22.40625 6.59375 C 22.894531 6.105469 23.402344 5.875 23.90625 5.875 Z M 20.3125 8.71875 L 23.28125 11.6875 L 11.1875 23.78125 C 10.53125 22.5 9.5 21.46875 8.21875 20.8125 Z M 6.9375 22.4375 C 8.136719 22.921875 9.078125 23.863281 9.5625 25.0625 L 6.28125 25.71875 Z"
-    ></path>
-  </svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.71,7.04C21.1,6.65 21.1,6 20.71,5.63L18.37,3.29C18,2.9 17.35,2.9 16.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z" /></svg>

package/dist/runtime/icons/reusable.svg

@@ -1,5 +1 @@
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-    <path
-      d="M7.17 7.91L8.9 8.91L12.08 3.42L14.33 7.31L11.73 8.81L17.19 10.27L18.66 4.81L16.06 6.31L13.81 2.41C13.26 1.45 12.03 1.12 11.08 1.68C10.81 1.83 10.58 2.05 10.41 2.31M10 20V18L3.66 18L5.9 14.1L8.5 15.6L7.04 10.14L1.57 11.6L4.17 13.1L1.92 17C1.37 17.96 1.7 19.18 2.65 19.73C2.92 19.89 3.22 19.97 3.54 20M19.06 11.5L17.32 12.5L20.5 18H16V15L12 19L16 23V20H20.5C21.61 20 22.5 19.11 22.5 18C22.5 17.69 22.42 17.38 22.28 17.11Z"
-    />
-  </svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.17 7.91L8.9 8.91L12.08 3.42L14.33 7.31L11.73 8.81L17.19 10.27L18.66 4.81L16.06 6.31L13.81 2.41C13.26 1.45 12.03 1.12 11.08 1.68C10.81 1.83 10.58 2.05 10.41 2.31M10 20V18L3.66 18L5.9 14.1L8.5 15.6L7.04 10.14L1.57 11.6L4.17 13.1L1.92 17C1.37 17.96 1.7 19.18 2.65 19.73C2.92 19.89 3.22 19.97 3.54 20M19.06 11.5L17.32 12.5L20.5 18H16V15L12 19L16 23V20H20.5C21.61 20 22.5 19.11 22.5 18C22.5 17.69 22.42 17.38 22.28 17.11Z" /></svg>