@blokkli/editor 2.0.0-alpha.4 → 2.0.0-alpha.41

package/dist/runtime/components/Edit/Features/Publish/Dialog/Item.vue

@@ -1,118 +0,0 @@
-<template>
-  <tr
-    :class="{
-  'bk-is-success': isSuccess,
-  'bk-is-error': isError
-}"
-  >
-    <td>
-      <label class="bk-checkbox">
-        <input
-          v-if="isCurrent || isMutating || isSuccess"
-          :checked="isSelected"
-          type="checkbox"
-          disabled
-        />
-        <input v-else v-model="modelValue" type="checkbox" :value="id" />
-        <span />
-
-        <div>
-          <div>
-            <strong>{{ title }}</strong>
-          </div>
-          <div>
-            {{ bundleLabel }}
-          </div>
-        </div>
-        <div v-if="isCurrent" class="bk-pill">Aktuelle Seite</div>
-      </label>
-    </td>
-    <td>
-      <span v-if="mutationStatusLabel">{{ mutationStatusLabel }}</span>
-      <span v-else-if="isSelected">{{ newStatus.label }}</span>
-    </td>
-    <td class="bk-is-status">
-      <div v-if="isSuccess">
-        <span
-          class="bk-status-indicator"
-          :class="{
-  'bk-is-success': newStatus.status
-}"
-        />
-      </div>
-      <div v-else-if="isSelected && isMutating">
-        <Icon name="loader" />
-      </div>
-      <div v-else-if="isSelected">
-        <span
-          class="bk-status-indicator"
-          :class="{
-  'bk-is-success': isCurrentlyPublished
-}"
-        />
-        <template v-if="newStatus.status !== isCurrentlyPublished">
-          <Icon name="arrow-right-thin" />
-          <span
-            class="bk-status-indicator"
-            :class="{
-  'bk-is-success': newStatus.status
-}"
-          />
-        </template>
-      </div>
-    </td>
-  </tr>
-</template>
-
-<script setup>
-import { computed } from "#imports";
-import { Icon } from "#blokkli/components";
-const props = defineProps({
-  hostEntityType: { type: String, required: true },
-  hostEntityUuid: { type: String, required: true },
-  entity: { type: Object, required: true },
-  currentUserIsOwner: { type: Boolean, required: true },
-  id: { type: String, required: true },
-  isCurrent: { type: Boolean, required: true },
-  shouldPublish: { type: Boolean, required: true },
-  isMutating: { type: Boolean, required: true },
-  mutationStatus: { type: Object, required: false }
-});
-const modelValue = defineModel({ type: Array, ...{
-  default: () => {
-    return [];
-  }
-} });
-const isSelected = computed(
-  () => props.isCurrent || modelValue.value.includes(props.id)
-);
-const isSuccess = computed(() => props.mutationStatus?.success);
-const isError = computed(
-  () => !isSuccess.value && !!(props.mutationStatus?.errors?.length || props.mutationStatus?.violations?.length)
-);
-const mutationStatusLabel = computed(() => {
-  if (isSuccess.value) {
-    if (props.entity.status && props.shouldPublish) {
-      return "Erfolgreich publiziert";
-    } else {
-      return "Erfolgreich gespeichert";
-    }
-  }
-  return null;
-});
-const isCurrentlyPublished = computed(() => props.entity.status);
-const title = computed(() => props.entity.label);
-const bundleLabel = computed(() => props.entity.bundleLabel);
-const newStatus = computed(() => {
-  if (isSelected.value && isCurrentlyPublished.value && !props.shouldPublish) {
-    return { label: "bleibt publiziert", status: true };
-  } else if (isSelected.value && !isCurrentlyPublished.value && props.shouldPublish) {
-    return { label: "wird publiziert", status: true };
-  } else if (isSelected.value && isCurrentlyPublished.value) {
-    return { label: "bleibt publiziert", status: true };
-  } else if (isSelected.value && !isCurrentlyPublished.value) {
-    return { label: "bleibt unpubliziert", status: false };
-  }
-  return { label: "", status: false };
-});
-</script>

package/dist/runtime/components/Edit/Features/Publish/Dialog/Item.vue.d.ts

@@ -1,18 +0,0 @@
-import type { GetEditStatesItem } from '#blokkli/types';
-import type { MutationStatus } from './types.js';
-type __VLS_Props = GetEditStatesItem & {
-    id: string;
-    isCurrent: boolean;
-    shouldPublish: boolean;
-    isMutating: boolean;
-    mutationStatus?: MutationStatus;
-};
-type __VLS_PublicProps = __VLS_Props & {
-    modelValue?: string[];
-};
-declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: string[]) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/runtime/components/Edit/Features/Publish/Dialog/index.vue

@@ -1,251 +0,0 @@
-<template>
-  <DialogModal
-    :title="$t('publishDialogTitle', 'Publish changes')"
-    :width="1200"
-    :submit-label
-    :is-loading="isLoading"
-    :can-submit="!!selectedToPublishItems.length"
-    class="bk-is-publish-dialog"
-    @submit="onSubmit"
-    @cancel="$emit('close')"
-  >
-    <div class="bk bk-form bk-dialog-publish-form">
-      <FormGroup title="Einstellungen" horizontal>
-        <FormItem v-if="publishOptions?.hasRevisionLogMessage">
-          <FormTextarea
-            v-model="revisionMessage"
-            label="Protokollnachricht der Revision"
-            description="Beschreiben Sie kurz die vorgenommenen Änderungen"
-            :disabled="isLoading"
-          />
-        </FormItem>
-        <FormItem>
-          <FormToggle
-            v-model="shouldPublish"
-            :label="toggleLabel"
-            :disabled="isLoading"
-          />
-        </FormItem>
-      </FormGroup>
-
-      <FormGroup title="Inhalte" horizontal>
-        <FormItem>
-          <template v-if="successItems.length">
-            <h2 class="bk-heading-2">Erfolgreich veröffentlicht</h2>
-
-            <table class="bk-table bk-publish-dialog-table">
-              <thead>
-                <tr>
-                  <th>Name</th>
-                  <th colspan="2">Status</th>
-                </tr>
-              </thead>
-
-              <tbody>
-                <Item
-                  v-for="item in successItems"
-                  :key="'success' + item.id"
-                  v-bind="item"
-                  v-model="states"
-                  :is-current="item.id === currentId"
-                  :should-publish
-                  :is-mutating
-                  :mutation-status="mutationStatusItems[item.id]"
-                />
-              </tbody>
-            </table>
-          </template>
-
-          <table class="bk-table bk-publish-dialog-table">
-            <thead>
-              <tr>
-                <th>Name</th>
-                <th colspan="2">Status</th>
-              </tr>
-            </thead>
-
-            <tbody>
-              <Item
-                v-for="item in toPublishItems"
-                :key="'to_publish_' + item.id"
-                v-bind="item"
-                v-model="states"
-                :is-current="item.id === currentId"
-                :should-publish
-                :is-mutating
-                :mutation-status="mutationStatusItems[item.id]"
-              />
-            </tbody>
-          </table>
-        </FormItem>
-      </FormGroup>
-    </div>
-  </DialogModal>
-</template>
-
-<script setup>
-import { ref, computed, useBlokkli, useAsyncData } from "#imports";
-import {
-  DialogModal,
-  FormToggle,
-  FormTextarea,
-  FormItem,
-  FormGroup
-} from "#blokkli/components";
-import { falsy } from "#blokkli/helpers";
-import Item from "./Item.vue";
-const { adapter, $t, state, context } = useBlokkli();
-const isMutating = ref(false);
-const mutationStatusItems = ref({});
-const publishedIds = ref([]);
-const shouldPublish = defineModel("shouldPublish", { type: Boolean, ...{
-  default: () => false
-} });
-const states = defineModel("states", { type: Array, ...{
-  default: () => []
-} });
-const revisionMessage = defineModel("revisionMessage", { type: String, ...{
-  default: () => false
-} });
-const emit = defineEmits(["close", "submit"]);
-const { data: publishOptions, status } = await useAsyncData(() => {
-  return adapter.getPublishOptions();
-});
-const { data: editStates } = await useAsyncData(
-  () => {
-    if (adapter.getEditStates) {
-      return adapter.getEditStates();
-    }
-    return Promise.resolve({
-      items: [],
-      perPage: 16,
-      total: 0
-    });
-  },
-  {
-    default: () => {
-      return {
-        items: [],
-        perPage: 16,
-        total: 0
-      };
-    }
-  }
-);
-const currentId = computed(
-  () => `${context.value.entityType}:${context.value.entityUuid}`
-);
-const stateItems = computed(() => {
-  const hostEntityType = context.value.entityType;
-  const hostEntityUuid = context.value.entityUuid;
-  return [
-    {
-      id: currentId.value,
-      hostEntityType,
-      hostEntityUuid,
-      currentUserIsOwner: !!state.owner.value?.currentUserIsOwner,
-      entity: state.entity.value
-    },
-    ...editStates.value.items.map((v) => {
-      return {
-        ...v,
-        id: `${v.hostEntityType}:${v.hostEntityUuid}`
-      };
-    }).filter((v) => v.id !== currentId.value)
-  ];
-});
-const successItems = computed(
-  () => stateItems.value.filter((v) => publishedIds.value.includes(v.id))
-);
-const toPublishItems = computed(
-  () => stateItems.value.filter((v) => !publishedIds.value.includes(v.id))
-);
-const selectedToPublishItems = computed(
-  () => toPublishItems.value.filter(
-    (v) => currentId.value === v.id || states.value.includes(v.id)
-  )
-);
-const isLoading = computed(() => status.value === "pending" || isMutating.value);
-const submitLabelPublish = computed(() => {
-  if (shouldPublish.value) {
-    const count = 1 + states.value.length;
-    return "@count Inhalte publizieren".replace("@count", count.toString());
-  }
-  return null;
-});
-const submitLabelSave = computed(() => {
-  const count = selectedToPublishItems.value.length;
-  if (!count) {
-    if (shouldPublish.value) {
-      return "Inhalte publizieren";
-    }
-    return "Inhalte speichern";
-  }
-  if (!shouldPublish.value) {
-    return "@count Inhalte speichern".replace("@count", count.toString());
-  }
-  return null;
-});
-const submitLabel = computed(() => {
-  return [submitLabelPublish.value, submitLabelSave.value].filter(falsy).join(", ");
-});
-const toggleLabel = computed(() => {
-  if (states.value.length) {
-    return "Inhalte publizieren";
-  }
-  return "Inhalt publizieren";
-});
-async function onSubmit() {
-  isMutating.value = true;
-  const items = stateItems.value;
-  let hasAnyError = false;
-  for (const item of items) {
-    const isSelected = states.value.includes(item.id) || item.hostEntityType === context.value.entityType && item.hostEntityUuid === context.value.entityUuid;
-    if (!isSelected) {
-      continue;
-    }
-    if (publishedIds.value.includes(item.id)) {
-      continue;
-    }
-    try {
-      const result = await adapter.publish({
-        hostEntityType: item.hostEntityType,
-        hostEntityUuid: item.hostEntityUuid,
-        closeAfterPublish: true,
-        revisionLogMessage: revisionMessage.value,
-        publishIfUnpublished: shouldPublish.value
-      });
-      let violations = [];
-      if (!result.success && result.state) {
-        const mapped = adapter.mapState(result.state);
-        if (mapped.mutatedState?.violations) {
-          violations = mapped.mutatedState.violations;
-        }
-      }
-      mutationStatusItems.value[item.id] = {
-        id: item.id,
-        success: result.success,
-        errors: result.errors,
-        violations
-      };
-      if (result.success) {
-        publishedIds.value.push(item.id);
-      }
-      hasAnyError ||= !result.success;
-    } catch {
-      mutationStatusItems.value[item.id] = {
-        id: item.id,
-        success: false,
-        errors: [
-          $t("unexpectedMutationError", "An unexpected error happened.")
-        ]
-      };
-    }
-  }
-  isMutating.value = false;
-  if (hasAnyError) {
-    return;
-  }
-  emit("submit");
-}
-</script>

package/dist/runtime/components/Edit/Features/Publish/Dialog/index.vue.d.ts

@@ -1,19 +0,0 @@
-type __VLS_PublicProps = {
-    'shouldPublish'?: boolean;
-    'states'?: string[];
-    'revisionMessage'?: string;
-};
-declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    close: () => void;
-    submit: () => void;
-    "update:shouldPublish": (value: boolean) => void;
-    "update:states": (value: string[]) => void;
-    "update:revisionMessage": (value: string) => void;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    onClose?: (() => any) | undefined;
-    onSubmit?: (() => any) | undefined;
-    "onUpdate:shouldPublish"?: ((value: boolean) => any) | undefined;
-    "onUpdate:states"?: ((value: string[]) => any) | undefined;
-    "onUpdate:revisionMessage"?: ((value: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/runtime/components/Edit/Features/Publish/Dialog/types.d.ts

@@ -1,7 +0,0 @@
-import type { Validation } from '#blokkli/types';
-export type MutationStatus = {
-    id: string;
-    success: boolean;
-    errors?: string[];
-    violations?: Validation[];
-};

package/dist/runtime/components/Edit/Features/Publish/index.vue

@@ -1,116 +0,0 @@
-<template>
-  <PluginMenuButton
-    id="publish"
-    :title="publishLabel"
-    :description="publishDescription"
-    :disabled="!mutations.length || !canEdit"
-    type="success"
-    :weight="0"
-    :icon="icon"
-    @click="onMenuClick"
-  />
-  <Teleport to="body">
-    <transition appear name="bk-slide-up">
-      <PublishDialog
-        v-if="showDialog"
-        v-model:states="additionalEditStates"
-        v-model:revision-message="revisionMessage"
-        v-model:should-publish="shouldPublish"
-        @close="showDialog = false"
-        @submit="onSubmit"
-      />
-    </transition>
-  </Teleport>
-</template>
-
-<script setup>
-import {
-  useBlokkli,
-  defineBlokkliFeature,
-  computed,
-  useRoute,
-  ref
-} from "#imports";
-import { PluginMenuButton } from "#blokkli/plugins";
-import PublishDialog from "./Dialog/index.vue";
-const { adapter, settings } = defineBlokkliFeature({
-  id: "publish",
-  icon: "publish",
-  label: "Publish",
-  requiredAdapterMethods: ["publish"],
-  description: "Provides a menu button to publish the changes of the current entity.",
-  settings: {
-    closeAfterPublish: {
-      type: "checkbox",
-      label: "Close editor after publishing",
-      description: "Immediately closes the editor after successfully publishing or saving.",
-      default: true,
-      group: "behavior"
-    }
-  }
-});
-const route = useRoute();
-const { state, $t, broadcast, context, eventBus } = useBlokkli();
-const { mutations, canEdit, mutateWithLoadingState } = state;
-const hasPublishOptions = !!adapter.getPublishOptions;
-const isPublished = computed(() => !!state.entity.value.status);
-const showDialog = ref(false);
-const additionalEditStates = ref([]);
-const shouldPublish = ref(!!state.entity.value.status);
-const revisionMessage = ref("");
-const publishLabel = computed(() => {
-  const suffix = hasPublishOptions ? "..." : "";
-  if (isPublished.value) {
-    return (settings.value.closeAfterPublish ? $t("publishAndCloseLabel", "Publish & Close") : $t("publishLabel", "Publish")) + suffix;
-  }
-  return (settings.value.closeAfterPublish ? $t("publishAndCloseLabelUnpublished", "Save & Close") : $t("publishLabelUnpublished", "Save")) + suffix;
-});
-const publishDescription = computed(
-  () => isPublished.value ? $t("publishDescription", "Publish all changes.") : $t(
-    "publishDescriptionUnpublished",
-    "Save all changes while keeping page unpublished"
-  )
-);
-const icon = computed(
-  () => isPublished.value ? "publish" : "save"
-);
-const onMenuClick = async () => {
-  if (hasPublishOptions) {
-    showDialog.value = true;
-    return;
-  }
-  await publishCurrent();
-};
-async function publishCurrent() {
-  const success = await mutateWithLoadingState(
-    () => adapter.publish({
-      hostEntityType: context.value.entityType,
-      hostEntityUuid: context.value.entityUuid,
-      closeAfterPublish: settings.value.closeAfterPublish
-    }),
-    $t("publishError", "Changes could not be published."),
-    $t("publishSuccess", "Changes published successfully.")
-  );
-  if (!success) {
-    const validations = state.violations.value;
-    if (validations.length) {
-      eventBus.emit("publish:failed");
-      eventBus.emit("sidebar:open", "violations");
-    }
-    return;
-  }
-  onSubmit();
-}
-function onSubmit() {
-  broadcast.emit("published", { uuid: context.value.entityUuid });
-  if (settings.value.closeAfterPublish) {
-    window.location.href = route.path;
-  }
-}
-</script>
-
-<script>
-export default {
-  name: "Publish"
-};
-</script>

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

@@ -1,2 +0,0 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export default _default;

package/dist/runtime/components/Edit/Features/ResponsivePreview/Frame/index.vue

@@ -1,75 +0,0 @@
-<template>
-  <div class="bk-preview">
-    <div v-if="isLoading" class="bk-preview-loading">
-      <Icon name="spinner" />
-    </div>
-    <div v-if="detached" class="bk-preview-controls">
-      <slot />
-    </div>
-    <div
-      class="bk-preview-iframe"
-      :style="{
-  pointerEvents: isResizing ? 'none' : 'auto'
-}"
-    >
-      <iframe ref="iframe" :src="src" @load="isLoading = false" />
-    </div>
-  </div>
-</template>
-
-<script setup>
-import {
-  ref,
-  computed,
-  useBlokkli,
-  onMounted,
-  onBeforeUnmount,
-  useRoute,
-  watch
-} from "#imports";
-import { Icon } from "#blokkli/components";
-import { frameEventBus } from "./../../../../../helpers/frameEventBus";
-import onBlokkliEvent from "#blokkli/helpers/composables/onBlokkliEvent";
-defineProps({
-  detached: { type: Boolean, required: false },
-  isResizing: { type: Boolean, required: false }
-});
-const route = useRoute();
-const { selection, broadcast } = useBlokkli();
-watch(selection.uuids, (selectedUuids) => {
-  frameEventBus.emit("selectItems", selectedUuids);
-});
-const isLoading = ref(true);
-const iframe = ref(null);
-const src = computed(
-  () => route.fullPath.replace("blokkliEditing", "blokkliPreview")
-);
-onBlokkliEvent(
-  "updateMutatedFields",
-  (e) => frameEventBus.emit("mutatedFields", e.fields)
-);
-onBlokkliEvent("select", (uuids) => {
-  const uuid = Array.isArray(uuids) ? uuids[0] : uuids;
-  if (uuid) {
-    frameEventBus.emit("focus", uuid);
-  }
-});
-onBlokkliEvent("option:update", (e) => frameEventBus.emit("updateOption", e));
-const onFrameEventBusEvent = (name, data) => iframe.value?.contentWindow?.postMessage({
-  name: "blokkli__" + name,
-  data: JSON.parse(JSON.stringify(data))
-});
-const onPreviewFocused = () => {
-  if (iframe.value) {
-    iframe.value.focus();
-  }
-};
-onMounted(() => {
-  frameEventBus.on("*", onFrameEventBusEvent);
-  broadcast.on("previewFocused", onPreviewFocused);
-});
-onBeforeUnmount(() => {
-  frameEventBus.off("*", onFrameEventBusEvent);
-  broadcast.off("previewFocused", onPreviewFocused);
-});
-</script>

package/dist/runtime/components/Edit/Features/ResponsivePreview/Frame/index.vue.d.ts

@@ -1,27 +0,0 @@
-import { Icon } from '#blokkli/components';
-type __VLS_Props = {
-    detached?: boolean;
-    isResizing?: boolean;
-};
-declare const isLoading: import("vue").Ref<boolean, boolean>;
-declare const iframe: import("vue").Ref<HTMLIFrameElement | null, HTMLIFrameElement | null>;
-declare const src: import("vue").ComputedRef<string>;
-declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
-declare var __VLS_5: {};
-type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
-    default?: (props: typeof __VLS_5) => any;
-}>;
-declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
-    Icon: typeof Icon;
-    isLoading: typeof isLoading;
-    iframe: typeof iframe;
-    src: typeof src;
-}, {}, {}, {}, 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;
-    };
-};