@blokkli/editor 2.0.0-alpha.27 → 2.0.0-alpha.29

package/dist/runtime/components/Edit/EditProvider.vue

@@ -1,382 +0,0 @@
-<template>
-  <Teleport to="#nuxt-root">
-    <div id="bk-canvas-overlay" class="bk bk-canvas-overlay" />
-  </Teleport>
-
-  <Teleport to="body">
-    <Transition :name="ui.useAnimations.value ? 'bk-loading' : void 0">
-      <Loading v-if="showLoading" screen />
-    </Transition>
-
-    <div ref="mainLayoutElement" class="bk-main-layout">
-      <Toolbar @loaded="toolbarLoaded = true" />
-      <div ref="viewportElement" class="bk bk-viewport">
-        <Messages />
-      </div>
-      <Actions v-if="!isInitializing" />
-      <div id="bk-banner-container" class="bk">
-        <div id="bk-banner-list">
-          <Banner
-            v-if="!state.stateAvailable.value"
-            id="state-unavailable"
-            icon="sad"
-            scheme="red"
-            :text="stateNotAvailableText"
-          />
-          <Banner
-            v-if="viewOnlyBanner"
-            id="view-only"
-            :icon="viewOnlyBanner.icon"
-            scheme="yellow"
-            :text="viewOnlyBanner.text"
-          />
-        </div>
-      </div>
-      <Konami />
-      <SystemRequirements />
-      <Overlay />
-    </div>
-  </Teleport>
-
-  <Indicators />
-  <Features
-    v-if="isReady"
-    :key="route.fullPath"
-    @loaded="featuresLoaded = true"
-  />
-  <AnimationCanvas v-if="!isInitializing" />
-  <slot
-    v-if="!isInitializing"
-    :key="definitions.renderKey.value"
-    :mutated-entity
-  />
-</template>
-
-<script setup>
-import {
-  ref,
-  computed,
-  provide,
-  onMounted,
-  onBeforeUnmount,
-  useRoute,
-  useRuntimeConfig,
-  nextTick,
-  inject,
-  onUnmounted,
-  watch,
-  useTemplateRef
-} from "#imports";
-import Toolbar from "./Toolbar/index.vue";
-import Actions from "./Actions/index.vue";
-import Loading from "./Loading/index.vue";
-import Messages from "./Messages/index.vue";
-import Features from "./Features/index.vue";
-import Indicators from "./Indicators/index.vue";
-import DraggableList from "./DraggableList.vue";
-import AnimationCanvas from "./AnimationCanvas/index.vue";
-import SystemRequirements from "./SystemRequirements/index.vue";
-import Overlay from "./Overlay/index.vue";
-import Konami from "./Konami/index.vue";
-import Banner from "./Banner/index.vue";
-import animationProvider from "../../helpers/providers/animation";
-import keyboardProvider from "../../helpers/providers/keyboard";
-import selectionProvider from "../../helpers/providers/selection";
-import editStateProvider from "../../helpers/providers/state";
-import typesProvider from "../../helpers/providers/types";
-import elementProvider from "./../../helpers/providers/element";
-import domProvider from "../../helpers/providers/dom";
-import textProvider from "../../helpers/providers/texts";
-import storageProvider from "../../helpers/providers/storage";
-import uiProvider from "../../helpers/providers/ui";
-import broadcastProvider from "../../helpers/providers/broadcast";
-import featuresProvider from "../../helpers/providers/features";
-import themeProvider from "../../helpers/providers/theme";
-import commandsProvider from "../../helpers/providers/commands";
-import tourProvider from "../../helpers/providers/tour";
-import debugProvider from "./../../helpers/providers/debug";
-import definitionProvider from "../../helpers/providers/definition";
-import dropAreasProvider from "../../helpers/providers/dropArea";
-import blocksProvider from "./../../helpers/providers/blocks";
-import indicatorsProvider from "../../helpers/providers/indicators";
-import pluginProvider from "../../helpers/providers/plugin";
-import directiveProvider from "./../../helpers/providers/directive";
-import fieldsProvider from "./../../helpers/providers/fields";
-import { eventBus } from "#blokkli/helpers/eventBus";
-import "#blokkli-build/styles.css";
-import getAdapter from "#blokkli-build/edit-adapter";
-import {
-  INJECT_ALL_COMPONENTS_CHUNK,
-  INJECT_APP,
-  INJECT_EDIT_CONTEXT,
-  INJECT_EDIT_FIELD_LIST_COMPONENT,
-  INJECT_EDIT_LOGGER,
-  INJECT_ENTITY_CONTEXT,
-  INJECT_GLOBAL_PROXY_MODE,
-  INJECT_IS_EDITING,
-  INJECT_PROVIDER_KEY
-} from "#blokkli/helpers/symbols";
-import { useBlockRegistration } from "#blokkli/helpers/composables/useBlockRegistration";
-import { addElementClasses } from "#blokkli/helpers/composables/addElementClasses";
-import { allComponents } from "#blokkli-build/chunk-editing";
-import { falsy } from "#blokkli/helpers";
-const props = defineProps({
-  entity: { type: null, required: false, default: void 0 },
-  entityType: { type: String, required: true },
-  entityUuid: { type: String, required: true },
-  entityBundle: { type: String, required: true },
-  language: { type: String, required: false, default: "en" },
-  isolate: { type: Boolean, required: false },
-  permissions: { type: Array, required: true },
-  providerEl: { type: null, required: true }
-});
-defineSlots();
-const mainLayoutElement = useTemplateRef("mainLayoutElement");
-const viewportElement = useTemplateRef("viewportElement");
-const entityContext = computed(() => {
-  return {
-    uuid: props.entityUuid,
-    type: props.entityType,
-    bundle: props.entityBundle
-  };
-});
-const context = computed(() => {
-  return {
-    entityType: props.entityType,
-    entityUuid: props.entityUuid,
-    entityBundle: props.entityBundle,
-    language: props.language
-  };
-});
-const adapter = await getAdapter(context);
-const providerKey = inject(INJECT_PROVIDER_KEY, "");
-const route = useRoute();
-const runtimeConfig = useRuntimeConfig().public.blokkli;
-const toolbarLoaded = ref(false);
-const featuresLoaded = ref(false);
-const isInitializing = ref(true);
-const definitions = definitionProvider();
-const $t = textProvider(context);
-const state = await editStateProvider(
-  adapter,
-  context,
-  $t,
-  providerKey,
-  props.permissions.filter(falsy)
-);
-const storage = await storageProvider(adapter, context);
-const plugins = pluginProvider();
-const debug = debugProvider(storage);
-const baseLogger = debug.createLogger("EditProvider");
-baseLogger.log("Entity: ", context.value);
-const element = elementProvider(debug);
-const features = featuresProvider(storage);
-const commands = commandsProvider();
-const tour = tourProvider();
-const dropAreas = dropAreasProvider();
-const broadcast = broadcastProvider();
-const ui = uiProvider(
-  props.providerEl,
-  storage,
-  context,
-  element,
-  mainLayoutElement,
-  viewportElement
-);
-const dom = domProvider(ui, debug, state, element);
-const theme = themeProvider(element);
-const blocks = blocksProvider(state, dom, context);
-const selection = selectionProvider(blocks);
-const keyboard = keyboardProvider();
-const animation = animationProvider(ui, storage, selection, debug, keyboard);
-const types = await typesProvider(adapter, selection, context);
-const indicators = indicatorsProvider();
-const directive = directiveProvider(debug, ui);
-const fields = fieldsProvider(dom, types);
-const mutatedEntity = computed(() => {
-  return {
-    ...props.entity ?? {},
-    ...state.mutatedEntity.value ?? {}
-  };
-});
-const isReady = computed(
-  () => !isInitializing.value && dom.isReady.value && directive.isReady.value && toolbarLoaded.value && mainLayoutElement.value
-);
-watch(isReady, (v) => {
-  if (v) {
-    baseLogger.log("is ready");
-  }
-});
-const showLoading = computed(() => {
-  return !isReady.value || !featuresLoaded.value;
-});
-const onContextMenu = (e) => {
-  e.preventDefault();
-  e.stopPropagation();
-};
-function onTouchMove(e) {
-  e.preventDefault();
-}
-function onTouchStart(e) {
-  if (e.touches.length === 2) {
-    e.preventDefault();
-  }
-}
-const shouldIsolate = computed(() => props.isolate);
-addElementClasses(
-  document.documentElement,
-  "bk-use-animations",
-  ui.useAnimations
-);
-addElementClasses(
-  document.documentElement,
-  "bk-isolate-provider",
-  shouldIsolate
-);
-function setElementSymbolProperty(el, symbol, value) {
-  el[symbol] = value;
-}
-provide(INJECT_EDIT_LOGGER, baseLogger);
-provide(INJECT_ALL_COMPONENTS_CHUNK, allComponents);
-provide(INJECT_EDIT_FIELD_LIST_COMPONENT, DraggableList);
-provide(INJECT_IS_EDITING, true);
-provide(INJECT_EDIT_CONTEXT, {
-  eventBus,
-  mutatedOptions: state.mutatedOptions,
-  dom,
-  definitions,
-  useBlockRegistration
-});
-const app = {
-  $t,
-  adapter,
-  animation,
-  broadcast,
-  commands,
-  context,
-  debug,
-  definitions,
-  dom,
-  dropAreas,
-  element,
-  eventBus,
-  directive,
-  features,
-  indicators,
-  keyboard,
-  plugins,
-  runtimeConfig,
-  selection,
-  blocks,
-  state,
-  storage,
-  theme,
-  tour,
-  types,
-  ui,
-  fields
-};
-provide(INJECT_APP, app);
-function textWithHighlight(title, text) {
-  return `<strong>${title}</strong> ${text}`;
-}
-const stateNotAvailableText = computed(() => {
-  return textWithHighlight(
-    $t("stateUnavailableTitle", "The edit state could not be loaded."),
-    $t(
-      "stateUnavailableText",
-      "This could be due to missing permissions or a temporary problem. Please try again later."
-    )
-  );
-});
-const viewOnlyBanner = computed(
-  () => {
-    if (props.permissions.includes("edit")) {
-      return null;
-    }
-    if (props.permissions.includes("review")) {
-      return {
-        text: textWithHighlight(
-          $t("viewBannerReviewTitle", "You are in review mode."),
-          $t(
-            "viewBannerReviewText",
-            "You can view and add comments but cannot edit content."
-          )
-        ),
-        icon: "comment"
-      };
-    } else if (props.permissions.includes("view")) {
-      return {
-        text: textWithHighlight(
-          $t("viewBannerViewTitle", "You are in view-only mode."),
-          $t(
-            "viewBannerViewText",
-            "You can view comments but cannot edit content."
-          )
-        ),
-        icon: "eye"
-      };
-    }
-    return null;
-  }
-);
-const isProxyMode = computed(() => ui.isProxyMode.value);
-provide(INJECT_GLOBAL_PROXY_MODE, isProxyMode);
-if (import.meta.hot) {
-  import.meta.hot.accept("#blokkli/runtime-helpers", () => {
-  });
-  import.meta.hot.accept("#blokkli/helpers/runtimeHelpers", () => {
-  });
-  import.meta.hot.on("vite:afterUpdate", (payload) => {
-    const hasUpdatedRenderer = payload.updates.find(
-      (v) => v.path.includes("/Renderer/")
-    );
-    if (hasUpdatedRenderer) {
-      animation.reset();
-    }
-    try {
-      eventBus.emit("state:reloaded");
-      dom.updateVisibleRects();
-      nextTick(() => {
-        const uuid = selection.uuids.value[0];
-        if (uuid) {
-          eventBus.emit("scrollIntoView", {
-            uuid,
-            center: true
-          });
-        }
-      });
-    } catch {
-    }
-  });
-}
-onMounted(async () => {
-  baseLogger.log("onMounted - START");
-  setElementSymbolProperty(props.providerEl, INJECT_APP, app);
-  setElementSymbolProperty(
-    props.providerEl,
-    INJECT_ENTITY_CONTEXT,
-    entityContext.value
-  );
-  window.addEventListener("contextmenu", onContextMenu);
-  document.documentElement.addEventListener("touchmove", onTouchMove);
-  document.documentElement.addEventListener("touchstart", onTouchStart);
-  dom.init();
-  directive.init();
-  await nextTick();
-  isInitializing.value = false;
-  broadcast.emit("editorLoaded", { uuid: props.entityUuid });
-  baseLogger.log("onMounted - END");
-});
-onBeforeUnmount(() => {
-  window.removeEventListener("contextmenu", onContextMenu);
-  isInitializing.value = true;
-  toolbarLoaded.value = false;
-  document.documentElement.removeEventListener("touchmove", onTouchMove);
-  document.documentElement.removeEventListener("touchstart", onTouchStart);
-});
-onUnmounted(() => {
-  setElementSymbolProperty(props.providerEl, INJECT_APP);
-  setElementSymbolProperty(props.providerEl, INJECT_ENTITY_CONTEXT);
-});
-</script>

package/dist/runtime/components/Edit/EditProvider.vue.d.ts

@@ -1,29 +0,0 @@
-import type { EditPermission } from '#blokkli/types';
-import '#blokkli-build/styles.css';
-declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & {
-        entity?: T;
-        entityType: string;
-        entityUuid: string;
-        entityBundle: string;
-        language?: string;
-        isolate?: boolean;
-        permissions: Array<EditPermission | null>;
-        providerEl: HTMLElement;
-    } & Partial<{}>> & import("vue").PublicProps;
-    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
-    attrs: any;
-    slots: {
-        default(props: {
-            mutatedEntity: T;
-            key: string;
-        }): any;
-    };
-    emit: {};
-}>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
-};
-export default _default;
-type __VLS_PrettifyLocal<T> = {
-    [K in keyof T]: T[K];
-} & {};

package/dist/runtime/components/Edit/Features/AddList/Actions/Action.vue

@@ -1,53 +0,0 @@
-<template>
-  <AddListItem
-    :id="action.id"
-    ref="item"
-    :key="action.id"
-    class="bk-is-action"
-    context="add-list-actions"
-    :label="action.title"
-    :bundle="action.itemBundle"
-    :icon="action.icon"
-    :color="action.color"
-    :disabled
-    no-context-menu
-  />
-</template>
-
-<script setup>
-import { AddListItem } from "#blokkli/components";
-import defineTourItem from "#blokkli/helpers/composables/defineTourItem";
-import { computed, useTemplateRef, useBlokkli } from "#imports";
-const props = defineProps({
-  action: { type: Object, required: true },
-  selectableBundles: { type: Array, required: true }
-});
-const { selection } = useBlokkli();
-const item = useTemplateRef("item");
-const bundleDisabled = computed(() => {
-  if (props.action.itemBundle) {
-    return !props.selectableBundles.includes(props.action.itemBundle);
-  }
-  return false;
-});
-const disabled = computed(() => {
-  if (bundleDisabled.value) {
-    return true;
-  }
-  if (props.action.enabled && selection.item.value) {
-    return !props.action.enabled(selection.item.value);
-  }
-  return false;
-});
-defineTourItem(() => {
-  if (!props.action.description) {
-    return;
-  }
-  return {
-    id: "plugin:add_action:" + props.action.id,
-    title: props.action.title,
-    text: props.action.description,
-    element: () => item.value?.getElement()
-  };
-});
-</script>

package/dist/runtime/components/Edit/Features/AddList/Actions/Action.vue.d.ts

@@ -1,7 +0,0 @@
-import type { AddAction } from '#blokkli/types';
-type __VLS_Props = {
-    action: AddAction;
-    selectableBundles: string[];
-};
-declare const _default: 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>;
-export default _default;

package/dist/runtime/components/Edit/Features/AddList/Actions/index.vue

@@ -1,41 +0,0 @@
-<template>
-  <Sortli id="blokkli-add-list-actions" :build-item="buildItemAction">
-    <ActionButton
-      v-for="action in actions"
-      :key="action.id"
-      :action="action"
-      :selectable-bundles
-    />
-  </Sortli>
-</template>
-
-<script setup>
-import { computed, useBlokkli } from "#imports";
-import { Sortli } from "#blokkli/components";
-import ActionButton from "./Action.vue";
-defineProps({
-  selectableBundles: { type: Array, required: true }
-});
-const { plugins } = useBlokkli();
-const actions = computed(() => {
-  return plugins.get("addAction");
-});
-function buildItemAction(element) {
-  const actionType = element.dataset.sortliId;
-  if (!actionType) {
-    return;
-  }
-  const itemBundle = element.dataset.itemBundle;
-  const action = actions.value.find((v) => v.id === actionType);
-  if (!action) {
-    return;
-  }
-  return {
-    itemType: "action",
-    action,
-    actionType,
-    itemBundle,
-    element: () => element
-  };
-}
-</script>

package/dist/runtime/components/Edit/Features/AddList/Actions/index.vue.d.ts

@@ -1,5 +0,0 @@
-type __VLS_Props = {
-    selectableBundles: string[];
-};
-declare const _default: 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>;
-export default _default;