@blokkli/editor 2.0.0-alpha.35 → 2.0.0-alpha.36

package/dist/runtime/editor/components/Form/Radio/index.d.vue.ts

@@ -8,6 +8,7 @@ type __VLS_Props = {
     required?: boolean;
     disabled?: boolean;
     description?: string;
+    inline?: boolean;
 };
 type __VLS_ModelProps = {
     modelValue?: string;

package/dist/runtime/editor/components/Form/Radio/index.vue

@@ -3,7 +3,7 @@
     <div class="bk-form-label">
       {{ label }}<span v-if="required" class="bk-required-indicator">*</span>
     </div>
-    <div>
+    <div :class="{ 'bk-radio-inline': inline }">
       <label v-for="option in options" :key="option.value" class="bk-radio">
         <input
           v-model="value"
@@ -27,7 +27,8 @@ defineProps({
   options: { type: Array, required: true },
   required: { type: Boolean, required: false },
   disabled: { type: Boolean, required: false },
-  description: { type: String, required: false }
+  description: { type: String, required: false },
+  inline: { type: Boolean, required: false }
 });
 const value = defineModel({ type: String });
 </script>

package/dist/runtime/editor/components/Form/Radio/index.vue.d.ts

@@ -8,6 +8,7 @@ type __VLS_Props = {
     required?: boolean;
     disabled?: boolean;
     description?: string;
+    inline?: boolean;
 };
 type __VLS_ModelProps = {
     modelValue?: string;

package/dist/runtime/editor/components/ItemIcon/index.vue

@@ -8,7 +8,10 @@
 <script setup>
 import { computed, useBlokkli } from "#imports";
 import { Icon } from "#blokkli/editor/components";
-import { fromLibraryBlockBundle } from "#blokkli-build/config";
+import {
+  fragmentBlockBundle,
+  fromLibraryBlockBundle
+} from "#blokkli-build/config";
 const props = defineProps({
   bundle: { type: String, required: false },
   icon: { type: null, required: false }
@@ -26,7 +29,12 @@ const iconName = computed(() => {
       return name;
     }
   }
-  return props.icon ?? "bk_mdi_question_mark";
+  if (props.icon) {
+    return props.icon;
+  } else if (props.bundle === fragmentBlockBundle) {
+    return "bk_mdi_newspaper";
+  }
+  return "bk_mdi_question_mark";
 });
 </script>
 

package/dist/runtime/editor/components/NestedEditorOverlay/index.d.vue.ts

@@ -1,19 +1,29 @@
 import type { BlokkliIcon } from '#blokkli-build/icons';
 export type NestedEditorOverlayProps = {
-    url: string;
+    url?: string;
     uuid: string;
     title: string;
-    theme: 'lime' | 'red';
+    theme: 'lime' | 'red' | 'accent';
     icon: BlokkliIcon;
     blockUuid?: string;
     element?: HTMLElement | null;
 };
-declare const __VLS_export: import("vue").DefineComponent<NestedEditorOverlayProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare var __VLS_38: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_38) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<NestedEditorOverlayProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (...args: any[]) => void;
     submit: (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<NestedEditorOverlayProps> & Readonly<{
     onClose?: ((...args: any[]) => any) | undefined;
     onSubmit?: ((...args: any[]) => any) | undefined;
 }>, {}, {}, {}, {}, 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/editor/components/NestedEditorOverlay/index.vue

@@ -34,12 +34,17 @@
         class="bk bk-library-edit-overlay"
         :class="'bk-is-' + theme"
       >
-        <iframe
-          ref="iframe"
-          :src="url"
-          style="width: 100%; height: 100%"
-          @load="onLoad"
-        />
+        <div class="bk-library-edit-overlay-frame">
+          <slot>
+            <iframe
+              v-if="url"
+              ref="iframe"
+              :src="url"
+              style="width: 100%; height: 100%"
+              @load="onLoad"
+            />
+          </slot>
+        </div>
       </div>
     </Transition>
   </Teleport>
@@ -57,7 +62,7 @@ import {
 import { Icon } from "#blokkli/editor/components";
 import { onBroadcastEvent } from "#blokkli/editor/composables";
 const props = defineProps({
-  url: { type: String, required: true },
+  url: { type: String, required: false },
   uuid: { type: String, required: true },
   title: { type: String, required: true },
   theme: { type: String, required: true },
@@ -241,6 +246,9 @@ function onEditorLoaded({ uuid }) {
 onMounted(() => {
   isLoaded.value = true;
   ui.setNestedEditor(props.uuid);
+  if (!props.url) {
+    isLoaded.value = true;
+  }
 });
 onBeforeUnmount(() => {
   ui.setNestedEditor(null);

package/dist/runtime/editor/components/NestedEditorOverlay/index.vue.d.ts

@@ -1,19 +1,29 @@
 import type { BlokkliIcon } from '#blokkli-build/icons';
 export type NestedEditorOverlayProps = {
-    url: string;
+    url?: string;
     uuid: string;
     title: string;
-    theme: 'lime' | 'red';
+    theme: 'lime' | 'red' | 'accent';
     icon: BlokkliIcon;
     blockUuid?: string;
     element?: HTMLElement | null;
 };
-declare const __VLS_export: import("vue").DefineComponent<NestedEditorOverlayProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare var __VLS_38: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_38) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<NestedEditorOverlayProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (...args: any[]) => void;
     submit: (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<NestedEditorOverlayProps> & Readonly<{
     onClose?: ((...args: any[]) => any) | undefined;
     onSubmit?: ((...args: any[]) => any) | undefined;
 }>, {}, {}, {}, {}, 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/editor/components/PreviewProvider.d.vue.ts

@@ -1,4 +1,5 @@
 import '#blokkli-build/styles.css';
+import type { ValidProviderTypes } from '#blokkli-build/generated-types';
 declare const __VLS_export: <T>(__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<{
         entity?: T;
@@ -6,6 +7,7 @@ declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_se
         entityUuid: string;
         entityBundle: string;
         language: string;
+        providerType: ValidProviderTypes;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});

package/dist/runtime/editor/components/PreviewProvider.vue

@@ -31,7 +31,8 @@ const props = defineProps({
   entityType: { type: String, required: true },
   entityUuid: { type: String, required: true },
   entityBundle: { type: String, required: true },
-  language: { type: String, required: true }
+  language: { type: String, required: true },
+  providerType: { type: null, required: true }
 });
 defineSlots();
 const context = computed(() => {
@@ -45,7 +46,7 @@ const context = computed(() => {
 const adapter = await getAdapter(context);
 const router = useRouter();
 const broadcast = broadcastProvider();
-const definitions = definitionProvider();
+const definitions = definitionProvider(props.providerType);
 let timeout = null;
 let lastChanged = 0;
 const mutatedFieldsMap = reactive({});

package/dist/runtime/editor/components/PreviewProvider.vue.d.ts

@@ -1,4 +1,5 @@
 import '#blokkli-build/styles.css';
+import type { ValidProviderTypes } from '#blokkli-build/generated-types';
 declare const __VLS_export: <T>(__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<{
         entity?: T;
@@ -6,6 +7,7 @@ declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_se
         entityUuid: string;
         entityBundle: string;
         language: string;
+        providerType: ValidProviderTypes;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});

package/dist/runtime/editor/components/ShortcutIndicator/index.vue

@@ -53,7 +53,7 @@ if (!props.viewOnly) {
   });
 }
 onBlokkliEvent("keyPressed", (e) => {
-  if (ui.hasDialogOpen.value) {
+  if (ui.hasDialogOpen.value || ui.hasNestedEditorOpen.value) {
     return;
   }
   const checkKey = [e.meta, e.shift, e.code.toLowerCase()].join("-");

package/dist/runtime/editor/components/index.d.ts

@@ -7,6 +7,8 @@ import BlockPreviewRenderer from './BlockPreviewRenderer/index.vue.js';
 import BlokkliTransition from './Transition/index.vue.js';
 import BundleSelector from './BundleSelector/index.vue.js';
 import ConfigForm from './PluginConfigForm/index.vue.js';
+import Dropdown from './Dropdown/index.vue.js';
+import DropdownItem from './DropdownItem/index.vue.js';
 import DialogModal from './Dialog/index.vue.js';
 import DiffValue from './DiffViewer/DiffValue.vue.js';
 import DiffViewerState from './DiffViewer/State.vue.js';
@@ -41,4 +43,4 @@ import Sortli from './Sortli/index.vue.js';
 import StatusIcon from './StatusIcon/index.vue.js';
 import TransitionHeight from './Transition/Height.vue.js';
 import ViewportBlockingRect from './ViewportBlockingRect/index.vue.js';
-export { AddListItem, ArtboardTooltip, AutoHeight, Banner, BlockPreviewItem, BlockPreviewRenderer, BlokkliTransition, BundleSelector, ConfigForm, DialogModal, DiffValue, DiffViewerState, ErrorBoundary, FlexTextarea, FormCheckboxes, FormDatepicker, FormGroup, FormItem, FormOverlay, FormRadio, FormRadioTabs, FormSelect, FormText, FormTextarea, FormToggle, Highlight, Icon, InfoBox, ItemIcon, ItemIconBox, Loading, NestedEditorOverlay, Pagination, RelativeTime, Resizable, ScaleToFit, ScheduleDate, ScrollBoundary, ShortcutIndicator, Sortli, StatusIcon, TransitionHeight, ViewportBlockingRect, };
+export { AddListItem, ArtboardTooltip, AutoHeight, Banner, BlockPreviewItem, BlockPreviewRenderer, BlokkliTransition, BundleSelector, ConfigForm, Dropdown, DropdownItem, DialogModal, DiffValue, DiffViewerState, ErrorBoundary, FlexTextarea, FormCheckboxes, FormDatepicker, FormGroup, FormItem, FormOverlay, FormRadio, FormRadioTabs, FormSelect, FormText, FormTextarea, FormToggle, Highlight, Icon, InfoBox, ItemIcon, ItemIconBox, Loading, NestedEditorOverlay, Pagination, RelativeTime, Resizable, ScaleToFit, ScheduleDate, ScrollBoundary, ShortcutIndicator, Sortli, StatusIcon, TransitionHeight, ViewportBlockingRect, };

package/dist/runtime/editor/components/index.js

@@ -7,6 +7,8 @@ import BlockPreviewRenderer from "./BlockPreviewRenderer/index.vue";
 import BlokkliTransition from "./Transition/index.vue";
 import BundleSelector from "./BundleSelector/index.vue";
 import ConfigForm from "./PluginConfigForm/index.vue";
+import Dropdown from "./Dropdown/index.vue";
+import DropdownItem from "./DropdownItem/index.vue";
 import DialogModal from "./Dialog/index.vue";
 import DiffValue from "./DiffViewer/DiffValue.vue";
 import DiffViewerState from "./DiffViewer/State.vue";
@@ -51,6 +53,8 @@ export {
   BlokkliTransition,
   BundleSelector,
   ConfigForm,
+  Dropdown,
+  DropdownItem,
   DialogModal,
   DiffValue,
   DiffViewerState,

package/dist/runtime/editor/composables/onElementResize.js

@@ -23,7 +23,6 @@ export function onElementResize(el, cb) {
         if (!boxSize) {
           return;
         }
-        console.log("CB");
         cb({
           width: boxSize.inlineSize,
           height: boxSize.blockSize

package/dist/runtime/editor/composables/useEditableFieldOverride.js

@@ -1,5 +1,4 @@
 import { useBlokkli } from "#imports";
-import { FIELD_MAPPING } from "#blokkli-build/runtime-options";
 import { itemEntityType } from "#blokkli-build/config";
 const NOOP_OVERRIDE = {
   element: null,
@@ -32,7 +31,7 @@ export function useEditableFieldOverride(fieldName, host) {
   const isComponent = !!editableData?.isComponent;
   function findMatchingProp(mapping) {
     return Object.entries(mapping).find(
-      ([_prop, field]) => field === fieldName
+      ([_prop, propMapping]) => propMapping?.name === fieldName && propMapping.type === "editable"
     )?.[0] ?? null;
   }
   const providerDefinition = definitions.getProviderDefinition(
@@ -41,9 +40,9 @@ export function useEditableFieldOverride(fieldName, host) {
   );
   let matchingProp = null;
   if (host.type === itemEntityType) {
-    const mapping = FIELD_MAPPING[host.bundle];
-    if (mapping) {
-      matchingProp = findMatchingProp(mapping);
+    const defintion = definitions.getBlockDefinition(host.bundle, "default");
+    if (defintion?.propsFieldMapping) {
+      matchingProp = findMatchingProp(defintion.propsFieldMapping);
     }
   } else if (providerDefinition) {
     const mapping = providerDefinition.propsFieldMapping;