@revenexx/editor 0.1.0

package/dist/modules/table-of-contents/index.mjs

@@ -0,0 +1,24 @@
+import { createResolver, addComponent } from '@nuxt/kit';
+import { defineBlokkliModule } from '../index.mjs';
+import { fileURLToPath } from 'node:url';
+
+const index = defineBlokkliModule({
+  setup(ctx) {
+    const moduleResolver = createResolver(
+      fileURLToPath(new URL("./", import.meta.url))
+    );
+    ctx.helper.addAlias(
+      "#blokkli/table-of-contents",
+      moduleResolver.resolve("./runtime/types")
+    );
+    addComponent({
+      filePath: moduleResolver.resolve(
+        "./runtime/components/BlokkliTableOfContents/index.vue"
+      ),
+      name: "BlokkliTableOfContents",
+      global: true
+    });
+  }
+});
+
+export { index as default };

package/dist/modules/table-of-contents/runtime/components/BlokkliTableOfContents/index.d.vue.ts

@@ -0,0 +1,44 @@
+import type { fromLibraryBlockBundle } from '#blokkli-build/config';
+import type { FieldListItemTyped } from '#blokkli-build/generated-types';
+import type { BlokkliTableOfContentsLink } from './../../types/index.js';
+type BundleWithoutLibrary = Exclude<FieldListItemTyped['bundle'], typeof fromLibraryBlockBundle>;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: <T extends BundleWithoutLibrary>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<{
+        /**
+         * Which bundles to include. This will also match reusable blocks of this bundle.
+         */
+        bundles: T[];
+        /**
+         * The name of the defineBlokkli option used to toggle if a block should be
+         * added to the table of contents.
+         *
+         * If not provided, all blocks are included.
+         */
+        optionName?: string;
+        /**
+         * Map a block item to a link.
+         */
+        mapItem: (item: Extract<FieldListItemTyped, {
+            bundle: T;
+        }>) => BlokkliTableOfContentsLink | null;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        default(props: {
+            links: BlokkliTableOfContentsLink[];
+        }): any;
+    };
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/modules/table-of-contents/runtime/components/BlokkliTableOfContents/index.vue

@@ -0,0 +1,43 @@
+<template>
+  <slot :links />
+</template>
+
+<script>
+
+</script>
+
+<script setup>
+import { falsy } from "#blokkli/helpers";
+import { getRuntimeOptions } from "#blokkli/helpers/runtimeHelpers";
+import { computed, useBlokkliHelper } from "#imports";
+import { BK_HIDDEN_GLOBALLY } from "./../../../../../global/constants";
+const props = defineProps({
+  bundles: { type: Array, required: true },
+  optionName: { type: String, required: false },
+  mapItem: { type: Function, required: true }
+});
+defineSlots();
+const { queryBlocks } = useBlokkliHelper();
+const items = queryBlocks(props.bundles);
+const links = computed(() => {
+  return items.value.filter((item) => {
+    if ("bundle" in item) {
+      const options = getRuntimeOptions(item);
+      if (!options) {
+        return null;
+      }
+      if (props.optionName) {
+        const shouldShow = options[props.optionName];
+        if (!shouldShow) {
+          return false;
+        }
+      }
+      const hiddenGlobally = options[BK_HIDDEN_GLOBALLY];
+      if (hiddenGlobally) {
+        return false;
+      }
+      return true;
+    }
+  }).map(props.mapItem).filter(falsy);
+});
+</script>

package/dist/modules/table-of-contents/runtime/components/BlokkliTableOfContents/index.vue.d.ts

@@ -0,0 +1,44 @@
+import type { fromLibraryBlockBundle } from '#blokkli-build/config';
+import type { FieldListItemTyped } from '#blokkli-build/generated-types';
+import type { BlokkliTableOfContentsLink } from './../../types/index.js';
+type BundleWithoutLibrary = Exclude<FieldListItemTyped['bundle'], typeof fromLibraryBlockBundle>;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: <T extends BundleWithoutLibrary>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<{
+        /**
+         * Which bundles to include. This will also match reusable blocks of this bundle.
+         */
+        bundles: T[];
+        /**
+         * The name of the defineBlokkli option used to toggle if a block should be
+         * added to the table of contents.
+         *
+         * If not provided, all blocks are included.
+         */
+        optionName?: string;
+        /**
+         * Map a block item to a link.
+         */
+        mapItem: (item: Extract<FieldListItemTyped, {
+            bundle: T;
+        }>) => BlokkliTableOfContentsLink | null;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        default(props: {
+            links: BlokkliTableOfContentsLink[];
+        }): any;
+    };
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/modules/table-of-contents/runtime/types/index.d.ts

@@ -0,0 +1,4 @@
+export type BlokkliTableOfContentsLink = {
+    id: string;
+    label: string;
+};

package/dist/modules/tailwind/index.d.mts

@@ -0,0 +1,5 @@
+import { Config } from 'tailwindcss/plugin';
+
+declare const tailwindConfig: Config;
+
+export { tailwindConfig as default };

package/dist/modules/tailwind/index.mjs

@@ -0,0 +1,228 @@
+import plugin from 'tailwindcss/plugin';
+
+const z = (index, key) => {
+  return `calc(var(--bk-z-index-base) + ${index}) /* "${key}" */`;
+};
+const zIndexKeys = [
+  "main-layout",
+  "canvas-overlay",
+  "animation-canvas",
+  "selection",
+  "analyze-tooltip",
+  "interaction-overlay",
+  "comments-overlay",
+  "comments-overlay-active",
+  "artboard-scrollbar",
+  "artboard-overview",
+  "translations-banner-mobile",
+  "editable-field",
+  "translations-banner-desktop",
+  "sidebar",
+  "sidebar-tabs",
+  "toolbar",
+  "actions",
+  "selection-add",
+  "add-buttons-label",
+  "add-list",
+  "add-list-info",
+  "tour-popup",
+  "preview",
+  "toolbar-dropdown",
+  "drop-targets",
+  "dragging-overlay",
+  "touch-action-bar",
+  "tour-overlay",
+  "tour-item",
+  "context-menu",
+  "resizable",
+  "transform-overlay",
+  "sidebar-detached",
+  "search",
+  "overlay",
+  "dialog",
+  "nested-editor-overlay-bg",
+  "nested-editor-overlay-iframe",
+  "messages",
+  "form-overlay",
+  "form-overlay-header",
+  "menu",
+  "command-palette",
+  "library-edit-dialog",
+  "init-overlay",
+  "overlay-high",
+  "dialog-high"
+];
+const zIndexCssVars = ["sidebar-detached"];
+const zIndex = zIndexKeys.reduce((acc, key, index) => {
+  acc[key] = z(index * 1e4, key);
+  return acc;
+}, {});
+const tailwindConfig = {
+  content: ["./src/runtime/**/*.vue", "./src/modules/*/runtime/**/*.vue"],
+  theme: {
+    fontFamily: {
+      sans: ['"Flink Neue Condensed", "PB Inter", ui-sans-serif, sans-serif'],
+      mono: ["monospace"]
+    },
+    colors: {
+      accent: {
+        50: "rgb(var(--bk-theme-accent-50) / <alpha-value>)",
+        100: "rgb(var(--bk-theme-accent-100) / <alpha-value>)",
+        200: "rgb(var(--bk-theme-accent-200) / <alpha-value>)",
+        300: "rgb(var(--bk-theme-accent-300) / <alpha-value>)",
+        400: "rgb(var(--bk-theme-accent-400) / <alpha-value>)",
+        500: "rgb(var(--bk-theme-accent-500) / <alpha-value>)",
+        600: "rgb(var(--bk-theme-accent-600) / <alpha-value>)",
+        700: "rgb(var(--bk-theme-accent-700) / <alpha-value>)",
+        800: "rgb(var(--bk-theme-accent-800) / <alpha-value>)",
+        900: "rgb(var(--bk-theme-accent-900) / <alpha-value>)",
+        950: "rgb(var(--bk-theme-accent-950) / <alpha-value>)"
+      },
+      mono: {
+        50: "rgb(var(--bk-theme-mono-50) / <alpha-value>)",
+        100: "rgb(var(--bk-theme-mono-100) / <alpha-value>)",
+        200: "rgb(var(--bk-theme-mono-200) / <alpha-value>)",
+        300: "rgb(var(--bk-theme-mono-300) / <alpha-value>)",
+        400: "rgb(var(--bk-theme-mono-400) / <alpha-value>)",
+        500: "rgb(var(--bk-theme-mono-500) / <alpha-value>)",
+        600: "rgb(var(--bk-theme-mono-600) / <alpha-value>)",
+        700: "rgb(var(--bk-theme-mono-700) / <alpha-value>)",
+        800: "rgb(var(--bk-theme-mono-800) / <alpha-value>)",
+        900: "rgb(var(--bk-theme-mono-900) / <alpha-value>)",
+        950: "rgb(var(--bk-theme-mono-950) / <alpha-value>)"
+      },
+      teal: {
+        light: "rgb(var(--bk-theme-teal-light) / <alpha-value>)",
+        normal: "rgb(var(--bk-theme-teal-normal) / <alpha-value>)",
+        dark: "rgb(var(--bk-theme-teal-dark) / <alpha-value>)"
+      },
+      yellow: {
+        light: "rgb(var(--bk-theme-yellow-light) / <alpha-value>)",
+        normal: "rgb(var(--bk-theme-yellow-normal) / <alpha-value>)",
+        dark: "rgb(var(--bk-theme-yellow-dark) / <alpha-value>)"
+      },
+      red: {
+        light: "rgb(var(--bk-theme-red-light) / <alpha-value>)",
+        normal: "rgb(var(--bk-theme-red-normal) / <alpha-value>)",
+        dark: "rgb(var(--bk-theme-red-dark) / <alpha-value>)"
+      },
+      lime: {
+        light: "rgb(var(--bk-theme-lime-light) / <alpha-value>)",
+        normal: "rgb(var(--bk-theme-lime-normal) / <alpha-value>)",
+        dark: "rgb(var(--bk-theme-lime-dark) / <alpha-value>)"
+      },
+      orange: {
+        light: "rgb(var(--bk-theme-orange-light) / <alpha-value>)",
+        normal: "rgb(var(--bk-theme-orange-normal) / <alpha-value>)",
+        dark: "rgb(var(--bk-theme-orange-dark) / <alpha-value>)"
+      },
+      scheme: {
+        light: "rgb(var(--bk-scheme-light, var(--bk-theme-accent-100)) / <alpha-value>)",
+        "light-hover": "var(--bk-scheme-light-hover)",
+        normal: "rgb(var(--bk-scheme-normal, var(--bk-theme-accent-600)) / <alpha-value>)",
+        "normal-hover": "var(--bk-scheme-normal-hover)",
+        dark: "rgb(var(--bk-scheme-dark, var(--bk-theme-accent-800)) / <alpha-value>)",
+        "dark-hover": "var(--bk-scheme-dark-hover)",
+        text: "rgb(var(--bk-scheme-text, var(--bk-scheme-dark)) / <alpha-value>)"
+      },
+      white: "white",
+      black: "black",
+      transparent: "transparent",
+      current: "currentColor"
+    },
+    extend: {
+      screens: {
+        "3xl": "1920px",
+        "4xl": "2440px"
+      },
+      transitionTimingFunction: {
+        swing: "cubic-bezier(0.56, 0.04, 0.25, 1)"
+      },
+      zIndex: {
+        ...zIndex
+      },
+      borderRadius: {
+        DEFAULT: "4px"
+      },
+      boxShadow: {
+        sm: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+        DEFAULT: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
+        md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
+        "md-even": "0 0px 10px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",
+        lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",
+        xl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",
+        "2xl": "0 25px 50px -12px rgb(0 0 0 / 0.25)",
+        inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)",
+        none: "none",
+        "lg-inverted": "0 -10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",
+        "xl-inverted": "0 -20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",
+        "xl-left": "-20px 0px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",
+        "xl-even": "0 0px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)"
+      }
+    },
+    spacing: {
+      770: "770px",
+      340: "340px",
+      300: "300px",
+      200: "200px",
+      120: "120px",
+      100: "100px",
+      90: "90px",
+      80: "80px",
+      70: "70px",
+      60: "60px",
+      50: "50px",
+      40: "40px",
+      30: "30px",
+      25: "25px",
+      24: "24px",
+      20: "20px",
+      18: "18px",
+      15: "15px",
+      10: "10px",
+      8: "8px",
+      5: "5px",
+      3: "3px",
+      2: "2px",
+      1: "1px",
+      0: "0px",
+      "offset-t": "var(--bk-root-offset-top)",
+      "offset-r": "var(--bk-root-offset-right)",
+      "offset-b": "var(--bk-root-offset-bottom)",
+      scrollbar: "var(--bk-artboard-scrollbar-size)",
+      "sidebar-right": "var(--bk-sidebar-width-right)",
+      "toolbar-left": "var(--bk-toolbar-left-width)",
+      "panel-gap": "var(--bk-panel-gap)"
+    },
+    borderWidth: {
+      DEFAULT: "1px",
+      0: "0",
+      2: "2px",
+      3: "3px",
+      4: "4px"
+    }
+  },
+  plugins: [
+    plugin(function({ addVariant, addBase }) {
+      addVariant(
+        "mobile-only",
+        "@media screen and (max-width: theme('screens.sm'))"
+      );
+      const cssVars = zIndexCssVars.reduce(
+        (acc, key) => {
+          const index = zIndexKeys.indexOf(key);
+          if (index !== -1) {
+            acc[`--bk-z-index-${key}`] = `calc(var(--bk-z-index-base) + ${index * 1e4})`;
+          }
+          return acc;
+        },
+        {}
+      );
+      addBase({
+        ":root": cssVars
+      });
+    })
+  ]
+};
+
+export { tailwindConfig as default };

package/dist/runtime/components/Blocks/Fragment/index.d.vue.ts

@@ -0,0 +1,7 @@
+import type { BlokkliFragmentName } from '#blokkli-build/definitions';
+export type Props = {
+    name: BlokkliFragmentName;
+};
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Blocks/Fragment/index.vue

@@ -0,0 +1,35 @@
+<template>
+  <component :is="component" v-if="component" />
+</template>
+
+<script setup>
+import { getComponent } from "#blokkli/helpers/imports";
+import { provide, defineBlokkli, inject } from "#imports";
+import {
+  INJECT_ALL_COMPONENTS_CHUNK,
+  INJECT_FRAGMENT_CONTEXT
+} from "#blokkli/helpers/injections";
+const componentProps = defineProps({
+  name: { type: null, required: true }
+});
+const ctx = defineBlokkli({
+  bundle: "BK_BUNDLE_FRAGMENT",
+  editor: {
+    icon: "bk_mdi_newspaper",
+    disableEdit: true
+  }
+});
+const providerType = ctx.provider.value?.providerType;
+const allComponentsChunk = inject(INJECT_ALL_COMPONENTS_CHUNK, null);
+const component = getComponent(
+  "fragment",
+  componentProps.name,
+  {
+    fieldListType: void 0,
+    parentBundle: void 0,
+    providerType
+  },
+  allComponentsChunk
+);
+provide(INJECT_FRAGMENT_CONTEXT, ctx);
+</script>

package/dist/runtime/components/Blocks/Fragment/index.vue.d.ts

@@ -0,0 +1,7 @@
+import type { BlokkliFragmentName } from '#blokkli-build/definitions';
+export type Props = {
+    name: BlokkliFragmentName;
+};
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Blocks/FromLibrary/index.d.vue.ts

@@ -0,0 +1,7 @@
+import type { LibraryItemProps } from '#blokkli/editor/features/library/types';
+export type Props = {
+    libraryItem?: LibraryItemProps;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/Blocks/FromLibrary/index.vue

@@ -0,0 +1,45 @@
+<template>
+  <BlokkliItem
+    v-if="item"
+    :key="item.uuid"
+    v-bind="item"
+    :index
+    :parent-type
+    :is-editing
+  />
+</template>
+
+<script setup>
+import { computed, provide, defineBlokkli } from "#imports";
+import {
+  INJECT_IS_IN_REUSABLE,
+  INJECT_REUSABLE_OPTIONS,
+  INJECT_REUSABLE_UUID
+} from "#blokkli/helpers/injections";
+const props = defineProps({
+  libraryItem: { type: Object, required: false }
+});
+const { index, options, parentType, uuid } = defineBlokkli({
+  bundle: "BK_BUNDLE_FROM_LIBRARY",
+  editor: {
+    icon: "reusable"
+  }
+});
+const isEditing = import.meta.blokkliEditing;
+provide(INJECT_REUSABLE_OPTIONS, options);
+provide(INJECT_IS_IN_REUSABLE, true);
+provide(INJECT_REUSABLE_UUID, uuid);
+const item = computed(() => {
+  const v = props.libraryItem?.block;
+  if (v && "uuid" in v) {
+    return v;
+  }
+  return void 0;
+});
+</script>
+
+<script>
+export default {
+  name: "BlokkliFromLibrary"
+};
+</script>

package/dist/runtime/components/Blocks/FromLibrary/index.vue.d.ts

@@ -0,0 +1,7 @@
+import type { LibraryItemProps } from '#blokkli/editor/features/library/types';
+export type Props = {
+    libraryItem?: LibraryItemProps;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/Blocks/NotImplemented/index.d.vue.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    uuid: string;
+    bundle: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Blocks/NotImplemented/index.vue

@@ -0,0 +1,54 @@
+<template>
+  <div class="bk bk-block-not-implemented">
+    <Icon name="bk_mdi_warning" />
+    <div v-html="text" />
+  </div>
+</template>
+
+<script setup>
+import { computed, useBlokkli } from "#imports";
+import { Icon } from "#blokkli/editor/components";
+import { useBlockRegistration } from "#blokkli/editor/composables";
+const props = defineProps({
+  uuid: { type: String, required: true },
+  bundle: { type: String, required: true }
+});
+const { dom, $t } = useBlokkli();
+const text = computed(() => {
+  return $t(
+    "blockNotImplemented",
+    "Missing component for block bundle <strong>@bundle</strong>."
+  ).replace("@bundle", props.bundle);
+});
+useBlockRegistration(dom, props.uuid);
+</script>
+
+<style>/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
+.bk.bk-block-not-implemented {
+  background-color: rgb(var(--bk-theme-red-light) / 1);
+  padding-block: 15px;
+  font-family: "Flink Neue Condensed", "PB Inter", ui-sans-serif, sans-serif;
+  --bk-tw-font-weight: var(--font-weight-medium, 500);
+  font-weight: var(--font-weight-medium, 500);
+  color: rgb(var(--bk-theme-red-normal) / 1);
+  font-size: var(--text-lg, 18px);
+  line-height: var(--bk-tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
+  outline-style: var(--bk-tw-outline-style);
+  outline-width: 1px;
+  outline-offset: calc(1px * -1);
+  outline-color: color-mix(in oklab, rgb(var(--bk-theme-red-normal) / 1) 30%, transparent);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 5px;
+}
+.bk.bk-block-not-implemented strong {
+  --bk-tw-font-weight: var(--font-weight-bold, 700) !important;
+  font-weight: var(--font-weight-bold, 700) !important;
+}
+.bk.bk-block-not-implemented svg {
+  fill: currentcolor;
+  width: 25px;
+  height: 25px;
+}
+</style>

package/dist/runtime/components/Blocks/NotImplemented/index.vue.d.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    uuid: string;
+    bundle: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/BlokkliEditable.d.vue.ts

@@ -0,0 +1,34 @@
+type __VLS_Props = {
+    /**
+     * The (machine) name of the field that is editable.
+     */
+    name?: string | null;
+    /**
+     * The text value.
+     */
+    value?: string;
+    /**
+     * The tag to use for rendering the wrapper.
+     *
+     * @default "div"
+     */
+    tag?: string;
+};
+type __VLS_Slots = {
+    default(props: {
+        value: string;
+    }): any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    name: string | null;
+    value: string;
+    tag: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/BlokkliEditable.vue

@@ -0,0 +1,22 @@
+<template>
+  <component :is="EditComponent ?? tag" v-bind="editProps">
+    <template #default="slotProps">
+      <slot :value="slotProps?.value ?? value" />
+    </template>
+  </component>
+</template>
+
+<script setup>
+import { inject, computed } from "#imports";
+import { INJECT_EDIT_EDITABLE_COMPONENT } from "#blokkli/helpers/injections";
+const props = defineProps({
+  name: { type: [String, null], required: false, default: null },
+  value: { type: String, required: false, default: "" },
+  tag: { type: String, required: false, default: "div" }
+});
+defineSlots();
+const EditComponent = inject(INJECT_EDIT_EDITABLE_COMPONENT, null);
+const editProps = computed(
+  () => EditComponent ? { name: props.name, value: props.value, tag: props.tag } : {}
+);
+</script>