@blokkli/editor 1.4.0-alpha.1 → 2.0.0-alpha.2

package/dist/runtime/blokkliPlugins/TourItem/index.vue

@@ -2,44 +2,35 @@
   <slot />
 </template>
 
-<script lang="ts" setup>
-import defineTourItem from '#blokkli/helpers/composables/defineTourItem'
-import { getCurrentInstance } from '#imports'
-
-import type { RendererNode } from 'vue'
-
-const props = defineProps<{
-  id: string
-  title: string
-  text: string
-  selector?: string
-}>()
-
-const findElement = (
-  el: RendererNode | null | undefined,
-): HTMLElement | undefined => {
+<script setup>
+import defineTourItem from "#blokkli/helpers/composables/defineTourItem";
+import { getCurrentInstance } from "#imports";
+const props = defineProps({
+  id: { type: String, required: true },
+  title: { type: String, required: true },
+  text: { type: String, required: true },
+  selector: { type: String, required: false }
+});
+const findElement = (el) => {
   if (el instanceof Text) {
-    return findElement(el.nextElementSibling)
+    return findElement(el.nextElementSibling);
   } else if (el instanceof HTMLElement) {
-    return el
+    return el;
   }
-}
-
-const instance = getCurrentInstance()
+};
+const instance = getCurrentInstance();
 defineTourItem(() => {
   return {
     id: props.id,
     title: props.title,
     text: props.text,
     element: () => {
-      const provided = props.selector
-        ? document.querySelector(props.selector)
-        : undefined
-      const element = provided || findElement(instance?.vnode.el)
+      const provided = props.selector ? document.querySelector(props.selector) : void 0;
+      const element = provided || findElement(instance?.vnode.el);
       if (element instanceof HTMLElement) {
-        return element
+        return element;
       }
-    },
-  }
-})
+    }
+  };
+});
 </script>

package/dist/runtime/blokkliPlugins/TourItem/index.vue.d.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    id: string;
+    title: string;
+    text: string;
+    selector?: string;
+};
+declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
+declare var __VLS_1: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    default?: (props: typeof __VLS_1) => any;
+}>;
+declare const __VLS_self: 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 __VLS_component: 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: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/blokkliPlugins/ViewOption/index.vue

@@ -29,80 +29,66 @@
   <slot :is-active="isActive && !ui.isMobile.value" />
 </template>
 
-<script setup lang="ts">
-import { useBlokkli, computed, ref } from '#imports'
-import { ShortcutIndicator, Icon } from '#blokkli/components'
-import type { BlokkliIcon } from '#blokkli-build/icons'
-import defineCommands from '#blokkli/helpers/composables/defineCommands'
-import defineTourItem from '#blokkli/helpers/composables/defineTourItem'
-
-const { storage, ui } = useBlokkli()
-
-const props = defineProps<{
-  id: string
-  label: string
-  titleOn: string
-  titleOff: string
-  editOnly?: boolean
-  keyCode?: string
-  icon?: BlokkliIcon
-  tourText?: string
-  modelValue?: boolean
-  weight?: number | string
-}>()
-
-const emit = defineEmits<{
-  (e: 'update:modelValue', data: boolean): void
-}>()
-
-const storageKey = 'view_option_' + props.id
-const button = ref<HTMLElement | null>(null)
-
-const isActiveStorage = storage.use(storageKey, false)
-
+<script setup>
+import { useBlokkli, computed, ref } from "#imports";
+import { ShortcutIndicator, Icon } from "#blokkli/components";
+import defineCommands from "#blokkli/helpers/composables/defineCommands";
+import defineTourItem from "#blokkli/helpers/composables/defineTourItem";
+const { storage, ui } = useBlokkli();
+const props = defineProps({
+  id: { type: String, required: true },
+  label: { type: String, required: true },
+  titleOn: { type: String, required: true },
+  titleOff: { type: String, required: true },
+  editOnly: { type: Boolean, required: false },
+  keyCode: { type: String, required: false },
+  icon: { type: null, required: false },
+  tourText: { type: String, required: false },
+  modelValue: { type: Boolean, required: false },
+  weight: { type: [Number, String], required: false }
+});
+const emit = defineEmits(["update:modelValue"]);
+const storageKey = "view_option_" + props.id;
+const button = ref(null);
+const isActiveStorage = storage.use(storageKey, false);
 const isActive = computed({
   get() {
-    return isActiveStorage.value
+    return isActiveStorage.value;
   },
-  set(v: boolean) {
-    isActiveStorage.value = v
-    emit('update:modelValue', v)
-  },
-})
-
-emit('update:modelValue', isActiveStorage.value)
-
-const title = computed(() => (isActive.value ? props.titleOff : props.titleOn))
-
+  set(v) {
+    isActiveStorage.value = v;
+    emit("update:modelValue", v);
+  }
+});
+emit("update:modelValue", isActiveStorage.value);
+const title = computed(() => isActive.value ? props.titleOff : props.titleOn);
 const onClick = () => {
-  isActive.value = !isActive.value
-}
-
+  isActive.value = !isActive.value;
+};
 defineCommands(() => {
   return {
-    id: 'plugin:view_option:' + props.id,
+    id: "plugin:view_option:" + props.id,
     label: title.value,
     icon: props.icon,
-    group: 'ui',
-    callback: () => (isActive.value = !isActive.value),
-  }
-})
-
+    group: "ui",
+    callback: () => isActive.value = !isActive.value
+  };
+});
 defineTourItem(() => {
   if (!props.tourText) {
-    return
+    return;
   }
   return {
-    id: 'plugin:view_option:' + props.id,
+    id: "plugin:view_option:" + props.id,
     title: props.label,
     text: props.tourText,
-    element: () => button.value,
-  }
-})
+    element: () => button.value
+  };
+});
 </script>
 
-<script lang="ts">
+<script>
 export default {
-  name: 'PluginViewOption',
-}
+  name: "PluginViewOption"
+};
 </script>

package/dist/runtime/blokkliPlugins/ViewOption/index.vue.d.ts

@@ -0,0 +1,39 @@
+import type { BlokkliIcon } from '#blokkli-build/icons';
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+    id: string;
+    label: string;
+    titleOn: string;
+    titleOff: string;
+    editOnly?: boolean;
+    keyCode?: string;
+    icon?: BlokkliIcon;
+    tourText?: string;
+    modelValue?: boolean;
+    weight?: number | string;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (data: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    id: string;
+    label: string;
+    titleOn: string;
+    titleOff: string;
+    editOnly?: boolean;
+    keyCode?: string;
+    icon?: BlokkliIcon;
+    tourText?: string;
+    modelValue?: boolean;
+    weight?: number | string;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((data: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    icon?: ((props: {}) => any) | undefined;
+    default?: ((props: {
+        isActive: boolean;
+    }) => any) | undefined;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -2,26 +2,19 @@
   <component :is="component" v-if="component" />
 </template>
 
-<script lang="ts" setup>
-import { getBlokkliFragmentComponent } from '#blokkli-build/imports'
-import { provide, defineBlokkli } from '#imports'
-import { INJECT_FRAGMENT_CONTEXT } from '#blokkli/helpers/symbols'
-import type { BlokkliFragmentName } from '#blokkli-build/definitions'
-
-export type Props = {
-  name: BlokkliFragmentName
-}
-
-const componentProps = defineProps<Props>()
-
+<script setup>
+import { getComponent } from "#blokkli/helpers/imports";
+import { provide, defineBlokkli } from "#imports";
+import { INJECT_FRAGMENT_CONTEXT } from "#blokkli/helpers/symbols";
+const componentProps = defineProps({
+  name: { type: null, required: true }
+});
 const ctx = defineBlokkli({
-  bundle: 'blokkli_fragment',
+  bundle: "blokkli_fragment",
   editor: {
-    disableEdit: true,
-  },
-})
-
-const component = getBlokkliFragmentComponent(componentProps.name)
-
-provide(INJECT_FRAGMENT_CONTEXT, ctx)
+    disableEdit: true
+  }
+});
+const component = getComponent("fragment", componentProps.name);
+provide(INJECT_FRAGMENT_CONTEXT, ctx);
 </script>

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

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

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

@@ -14,41 +14,31 @@
   />
 </template>
 
-<script lang="ts" setup>
-import { computed, provide, defineBlokkli } from '#imports'
+<script setup>
+import { computed, provide, defineBlokkli } from "#imports";
 import {
   INJECT_IS_IN_REUSABLE,
-  INJECT_REUSABLE_OPTIONS,
-} from '#blokkli/helpers/symbols'
-import type { LibraryItemProps } from '#blokkli/types'
-
-export type Props = {
-  libraryItem?: LibraryItemProps
-}
-
-const props = defineProps<Props>()
-
+  INJECT_REUSABLE_OPTIONS
+} from "#blokkli/helpers/symbols";
+const props = defineProps({
+  libraryItem: { type: Object, required: false }
+});
 const { index, options, parentType, isEditing } = defineBlokkli({
-  bundle: 'from_library',
-})
-
-// Reusable items inherit the options from this wrapper paragraph.
-// They are injected in the defineBlokkli() composable.
-provide(INJECT_REUSABLE_OPTIONS, options)
-provide(INJECT_IS_IN_REUSABLE, true)
-
+  bundle: "from_library"
+});
+provide(INJECT_REUSABLE_OPTIONS, options);
+provide(INJECT_IS_IN_REUSABLE, true);
 const item = computed(() => {
-  const v = props.libraryItem?.block
-  if (v && 'uuid' in v) {
-    return v
+  const v = props.libraryItem?.block;
+  if (v && "uuid" in v) {
+    return v;
   }
-
-  return undefined
-})
+  return void 0;
+});
 </script>
 
-<script lang="ts">
+<script>
 export default {
-  name: 'BlokkliFromLibrary',
-}
+  name: "BlokkliFromLibrary"
+};
 </script>

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

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

package/dist/runtime/components/BlokkliEditable.vue

@@ -4,70 +4,51 @@
   </component>
 </template>
 
-<script setup lang="ts">
-import { ref, computed, inject, onMounted, onBeforeUnmount } from '#imports'
-import type {
-  ItemEditContext,
-  EditableFieldUpdateEvent,
-  EntityContext,
-} from '#blokkli/types'
+<script setup>
+import { ref, computed, inject, onMounted, onBeforeUnmount } from "#imports";
 import {
   INJECT_EDIT_CONTEXT,
   INJECT_ENTITY_CONTEXT,
-  INJECT_IS_EDITING,
-} from '#blokkli/helpers/symbols'
-
-const props = withDefaults(
-  defineProps<{
-    name: string
-    value: string
-    tag?: string
-  }>(),
-  {
-    tag: 'div',
-  },
-)
-
-const valueOverride = ref('')
-const isEditing = inject<boolean>(INJECT_IS_EDITING, false)
-const entity = inject<EntityContext>(INJECT_ENTITY_CONTEXT)
-const editContext = inject<ItemEditContext | null>(INJECT_EDIT_CONTEXT, null)
-
+  INJECT_IS_EDITING
+} from "#blokkli/helpers/symbols";
+const props = defineProps({
+  name: { type: String, required: true },
+  value: { type: String, required: true },
+  tag: { type: String, required: false, default: "div" }
+});
+defineSlots();
+const valueOverride = ref("");
+const isEditing = inject(INJECT_IS_EDITING, false);
+const entity = inject(INJECT_ENTITY_CONTEXT);
+const editContext = inject(INJECT_EDIT_CONTEXT, null);
 if (!entity) {
-  throw new Error('Missing entity context.')
+  throw new Error("Missing entity context.");
 }
-
-const renderedValue = computed(() => valueOverride.value || props.value)
-
+const renderedValue = computed(() => valueOverride.value || props.value);
 const attrs = computed(() => {
   if (isEditing && props.name) {
     return {
-      'data-blokkli-editable-field': props.name,
-      'data-blokkli-editable-component': 'true',
-      'data-blokkli-editable-value': props.value,
-    }
+      "data-blokkli-editable-field": props.name,
+      "data-blokkli-editable-component": "true",
+      "data-blokkli-editable-value": props.value
+    };
   }
-
-  return undefined
-})
-
-const onEditableUpdateValue = (e: EditableFieldUpdateEvent) => {
+  return void 0;
+});
+const onEditableUpdateValue = (e) => {
   if (e.name === props.name && e.entityUuid === entity.uuid) {
-    valueOverride.value = e.value
+    valueOverride.value = e.value;
   }
-}
-
+};
 onMounted(() => {
   if (!isEditing || !editContext) {
-    return
+    return;
   }
-
-  editContext.eventBus.on('editable:update', onEditableUpdateValue)
-})
-
+  editContext.eventBus.on("editable:update", onEditableUpdateValue);
+});
 onBeforeUnmount(() => {
   if (editContext) {
-    editContext.eventBus.off('editable:update', onEditableUpdateValue)
+    editContext.eventBus.off("editable:update", onEditableUpdateValue);
   }
-})
+});
 </script>

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

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    name: string;
+    value: string;
+    tag?: string;
+};
+type __VLS_Slots = {
+    default(props: {
+        value: string;
+    }): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    tag: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};