@blokkli/editor 2.0.0-alpha.62 → 2.0.0-alpha.64

package/dist/runtime/editor/features/validations/Overlay/index.vue

@@ -1,115 +0,0 @@
-<template>
-  <Teleport to=".bk-main-canvas">
-    <div class="bk bk-validations-overlay">
-      <OverlayItem v-for="item in items" :key="item.uuid" v-bind="item" />
-    </div>
-  </Teleport>
-</template>
-
-<script setup>
-import { itemEntityType } from "#blokkli-build/config";
-import { falsy } from "#blokkli/helpers";
-import { computed } from "#imports";
-import OverlayItem from "./Item.vue";
-const props = defineProps({
-  validations: { type: Array, required: true }
-});
-const items = computed(
-  () => Object.entries(
-    props.validations.map((v) => {
-      if (v.entityType === itemEntityType && v.entityUuid) {
-        return {
-          uuid: v.entityUuid,
-          message: v.message
-        };
-      }
-      return null;
-    }).filter(falsy).reduce((acc, v) => {
-      if (!acc[v.uuid]) {
-        acc[v.uuid] = [v.message];
-      } else {
-        acc[v.uuid].push(v.message);
-      }
-      return acc;
-    }, {})
-  ).map((v) => {
-    return {
-      uuid: v[0],
-      messages: v[1]
-    };
-  })
-);
-</script>
-
-<style>/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
-.bk.bk-validations-overlay {
-  pointer-events: none;
-  position: absolute;
-  top: 0px;
-  left: 0px;
-  height: 100%;
-  width: 100%;
-}
-.bk.bk-validations-overlay  > div {
-  position: absolute;
-  top: 0px;
-  left: 0px;
-  box-sizing: border-box;
-  border-style: var(--bk-tw-border-style);
-  border-width: 3px;
-  border-color: rgb(var(--bk-theme-red-normal) / 1);
-  background-color: rgb(var(--bk-theme-red-normal) / 1);
-}
-@supports (color: color-mix(in lab, red, red)) {
-  .bk.bk-validations-overlay  > div {
-    background-color: color-mix(in oklab, rgb(var(--bk-theme-red-normal) / 1) 10%, transparent);
-  }
-}
-:is(.bk.bk-validations-overlay > div)  > div {
-  background-color: rgb(var(--bk-theme-red-normal) / 1);
-  padding-inline: 10px;
-  padding-block: 5px;
-  color: white;
-  position: absolute;
-  right: calc(2px * -1);
-  left: calc(2px * -1);
-  --bk-tw-font-weight: var(--font-weight-bold, 700);
-  font-weight: var(--font-weight-bold, 700);
-  bottom: 100%;
-}
-.bk .bk-validation-item {
-  width: 100%;
-  padding: 15px;
-  font-size: var(--text-base, 16px);
-  line-height: var(--bk-tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
-  color: rgb(var(--bk-theme-mono-800) / 1);
-}
-@media (hover: hover) {
-  :is(.bk .bk-validation-item):hover {
-    background-color: rgb(var(--bk-theme-mono-50) / 1);
-  }
-}
-.bk .bk-validation-item {
-  border-bottom-style: var(--bk-tw-border-style);
-  border-bottom-width: 1px;
-  border-bottom-color: rgb(var(--bk-theme-mono-300) / 1);
-}
-:is(.bk .bk-validation-item) .bk-blokkli-item-icon {
-  width: 25px;
-  height: 25px;
-  border-radius: 4px;
-  border-style: var(--bk-tw-border-style);
-  border-width: 1px;
-  border-color: rgb(var(--bk-theme-mono-400) / 1);
-  background-color: rgb(var(--bk-theme-mono-200) / 1);
-  padding: 3px;
-}
-:is(.bk .bk-validation-item) .bk-validation-item-header {
-  margin-bottom: 10px;
-  display: flex;
-  align-items: center;
-  gap: 5px;
-  --bk-tw-font-weight: var(--font-weight-medium, 500);
-  font-weight: var(--font-weight-medium, 500);
-}
-</style>

package/dist/runtime/editor/features/validations/Overlay/index.vue.d.ts

@@ -1,7 +0,0 @@
-import type { Validation } from '#blokkli/editor/types/state';
-type __VLS_Props = {
-    validations: Validation[];
-};
-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/editor/features/validations/SidebarItem/index.d.vue.ts

@@ -1,10 +0,0 @@
-type __VLS_Props = {
-    message: string;
-    propertyPath?: string;
-    code?: string;
-    entityType?: string;
-    entityUuid?: 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/editor/features/validations/SidebarItem/index.vue

@@ -1,41 +0,0 @@
-<template>
-  <button class="bk-validation-item" @click.prevent="onClick">
-    <div v-if="block" class="bk-validation-item-header">
-      <ItemIcon :bundle="block.bundle" />
-      <div>{{ itemBundle?.label }}</div>
-    </div>
-    <div v-html="message" />
-  </button>
-</template>
-
-<script setup>
-import { useBlokkli, computed } from "#imports";
-import { ItemIcon } from "#blokkli/editor/components";
-import { itemEntityType } from "#blokkli-build/config";
-const props = defineProps({
-  message: { type: String, required: true },
-  propertyPath: { type: String, required: false },
-  code: { type: String, required: false },
-  entityType: { type: String, required: false },
-  entityUuid: { type: String, required: false }
-});
-const { eventBus, types, blocks } = useBlokkli();
-const isBlock = computed(() => props.entityType === itemEntityType);
-const block = computed(() => {
-  if (isBlock.value && props.entityUuid) {
-    return blocks.getBlock(props.entityUuid);
-  }
-  return null;
-});
-const itemBundle = computed(() => {
-  if (block.value?.bundle) {
-    return types.getBlockBundleDefinition(block.value.bundle);
-  }
-  return null;
-});
-function onClick() {
-  if (isBlock.value && props.entityUuid) {
-    eventBus.emit("scrollIntoView", { uuid: props.entityUuid, center: true });
-  }
-}
-</script>

package/dist/runtime/editor/features/validations/SidebarItem/index.vue.d.ts

@@ -1,10 +0,0 @@
-type __VLS_Props = {
-    message: string;
-    propertyPath?: string;
-    code?: string;
-    entityType?: string;
-    entityUuid?: 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/editor/features/validations/index.d.vue.ts

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

package/dist/runtime/editor/features/validations/index.vue

@@ -1,91 +0,0 @@
-<template>
-  <PluginSidebar
-    id="violations"
-    ref="plugin"
-    :title="$t('validationsToolbarLabel', 'Validations')"
-    :tour-text="
-  $t(
-    'validationsTourText',
-    'See validation errors for content or structure on the current page.'
-  )
-"
-    icon="bk_mdi_check"
-    weight="-10"
-  >
-    <div class="bk bk-errors bk-control">
-      <ul v-if="state.violations.value.length">
-        <li v-for="(item, i) in state.violations.value" :key="item.message + i">
-          <SidebarItem v-bind="item" />
-        </li>
-      </ul>
-      <div v-else class="bk-errors-success">
-        <figure>
-          <Icon name="bk_mdi_check" />
-        </figure>
-        <h3>{{ $t("validationsNoneFound", "No validation errors found.") }}</h3>
-      </div>
-    </div>
-
-    <template v-if="validations.length" #badge>
-      <div class="bk-sidebar-badge bk-is-red">{{ validations.length }}</div>
-    </template>
-  </PluginSidebar>
-
-  <ValidationOverlay v-if="validations.length" :validations="validations" />
-</template>
-
-<script setup>
-import {
-  useBlokkli,
-  defineBlokkliFeature,
-  computed,
-  useTemplateRef
-} from "#imports";
-import { PluginSidebar } from "#blokkli/editor/plugins";
-import { Icon } from "#blokkli/editor/components";
-import ValidationOverlay from "./Overlay/index.vue";
-import SidebarItem from "./SidebarItem/index.vue";
-import { onBlokkliEvent } from "#blokkli/editor/composables";
-defineBlokkliFeature({
-  id: "validations",
-  icon: "bk_mdi_check",
-  label: "Validations",
-  description: "Provides a sidebar pane to render validations."
-});
-const plugin = useTemplateRef("plugin");
-const { state, $t } = useBlokkli();
-const validations = computed(() => state.violations.value);
-onBlokkliEvent("publish:failed", function() {
-  if (plugin.value && validations.value.length) {
-    plugin.value.showSidebar();
-  }
-});
-</script>
-
-<script>
-export default {
-  name: "Validations"
-};
-</script>
-
-<style>/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
-.bk.bk-errors .bk-errors-success {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding-top: 30px;
-  text-align: center;
-}
-:is(.bk.bk-errors .bk-errors-success) figure {
-  margin-bottom: 20px;
-  height: 100px;
-  width: 100px;
-  border-radius: calc(infinity * 1px);
-  background-color: rgb(var(--bk-theme-lime-light) / 1);
-  padding: 20px;
-  color: rgb(var(--bk-theme-lime-dark) / 1);
-}
-:is(:is(.bk.bk-errors .bk-errors-success) figure) svg {
-  fill: currentcolor;
-}
-</style>

package/dist/runtime/editor/features/validations/index.vue.d.ts

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

package/dist/runtime/editor/types/config.d.ts

@@ -1,5 +0,0 @@
-export type ColorOption = {
-    id: string;
-    hex: string;
-    label: string;
-};