@blokkli/editor 2.0.0-alpha.2 → 2.0.0-alpha.20

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

@@ -1,30 +1,13 @@
 import type { ContextMenu } from '#blokkli/types';
-import ContextMenuMenu from './Menu/index.vue.js';
 type __VLS_Props = {
     id: string;
     menu: ContextMenu[];
     tag?: string;
 };
-declare const ui: import("../../helpers/uiProvider.js").UiProvider;
-declare const isVisible: import("vue").ComputedRef<boolean>;
-declare const x: import("vue").Ref<number, number>;
-declare const y: import("vue").Ref<number, number>;
-declare const onContextMenu: (e: MouseEvent) => void;
-declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_10: {};
-type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_10) => any;
-}>;
-declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
-    ContextMenuMenu: typeof ContextMenuMenu;
-    ui: typeof ui;
-    isVisible: typeof isVisible;
-    x: typeof x;
-    y: typeof y;
-    onContextMenu: typeof onContextMenu;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    tag: string;
-}, {}, {}, {}, 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<{}>, {
     tag: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -2,15 +2,10 @@ type __VLS_Props = {
     id: string;
     title: string;
 };
-declare const isVisible: import("vue").ComputedRef<boolean | undefined>;
-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> & {
+type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_5) => any;
-}>;
-declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
-    isVisible: typeof isVisible;
-}, {}, {}, {}, 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;

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

@@ -1,6 +1,6 @@
 <template>
   <Teleport to="body">
-    <transition name="bk-slide-in" :duration="200">
+    <BlokkliTransition name="slide-in">
       <FormOverlay
         v-if="isVisible"
         :id="id"
@@ -15,12 +15,12 @@
           </button>
         </template>
       </FormOverlay>
-    </transition>
+    </BlokkliTransition>
   </Teleport>
 </template>
 
 <script setup>
-import { FormOverlay } from "#blokkli/components";
+import { FormOverlay, BlokkliTransition } from "#blokkli/components";
 import onBlokkliEvent from "#blokkli/helpers/composables/onBlokkliEvent";
 import { ref, useBlokkli } from "#imports";
 const props = defineProps({

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

@@ -1,4 +1,3 @@
-import { FormOverlay } from '#blokkli/components';
 import type { BlokkliIcon } from '#blokkli-build/icons';
 import type { DroppableEntityField } from '#blokkli/types';
 type __VLS_Props = {
@@ -7,26 +6,10 @@ type __VLS_Props = {
     icon: BlokkliIcon;
     entityType: string;
 };
-declare const $t: import("../../helpers/textProvider.js").TextProvider;
-declare const isVisible: import("vue").Ref<boolean, boolean>;
-declare const onClose: () => void;
-declare const onSubmit: () => void;
-declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_18: {};
-type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_18) => any;
-}>;
-declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
-    FormOverlay: typeof FormOverlay;
-    $t: typeof $t;
-    isVisible: typeof isVisible;
-    onClose: typeof onClose;
-    onSubmit: typeof onSubmit;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    save: (data: DroppableEntityField) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onSave?: ((data: DroppableEntityField) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+};
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     save: (data: DroppableEntityField) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{

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

@@ -1,14 +1,19 @@
 <template>
   <Teleport to="#bk-blokkli-item-actions">
     <button
+      v-if="shouldRender"
       ref="el"
       :disabled="isDisabled"
-      :class="{ 'bk-is-active': active, 'bk-is-last': weight === 'last' }"
+      class="bk-item-action"
+      :class="[
+  { 'bk-is-active': active, 'bk-is-last': weight === 'last' },
+  $attrs.class
+]"
       :style="weight !== 'last' ? { order: weight || 0 } : void 0"
       @click.prevent.stop="onClick"
     >
       <slot name="icon">
-        <Icon v-if="icon" :name="icon" />
+        <Icon v-if="icon" :name="icon" class="bk-item-action-icon" />
       </slot>
       <div class="bk-tooltip">
         <span>{{ title }}</span>
@@ -23,9 +28,7 @@
       </div>
     </button>
   </Teleport>
-  <Teleport to="#bk-blokkli-item-actions-after">
-    <slot :items="selection.blocks.value" :uuids="uuids" />
-  </Teleport>
+  <slot :items="selection.items.value" :uuids="uuids" />
 </template>
 
 <script setup>
@@ -33,7 +36,7 @@ import { computed, ref, useBlokkli } from "#imports";
 import { Icon, ShortcutIndicator } from "#blokkli/components";
 import defineCommands from "#blokkli/helpers/composables/defineCommands";
 import defineTourItem from "#blokkli/helpers/composables/defineTourItem";
-const { selection } = useBlokkli();
+const { selection, state } = useBlokkli();
 const el = ref(null);
 const uuids = computed(() => selection.uuids.value);
 const props = defineProps({
@@ -44,26 +47,33 @@ const props = defineProps({
   keyCode: { type: String, required: false },
   meta: { type: Boolean, required: false },
   multiple: { type: Boolean, required: false },
+  editOnly: { type: Boolean, required: false },
   weight: { type: [Number, String], required: false },
   icon: { type: null, required: false },
   tourText: { type: String, required: false }
 });
 const isDisabled = computed(
-  () => props.disabled || !props.multiple && selection.blocks.value.length > 1
+  () => props.disabled || !props.multiple && selection.items.value.length > 1
 );
+const shouldRender = computed(() => {
+  if (props.editOnly) {
+    return state.editMode.value === "editing";
+  }
+  return true;
+});
 const emit = defineEmits(["click"]);
 const onClick = () => {
   if (isDisabled.value || !uuids.value.length) {
     return;
   }
-  emit("click", selection.blocks.value);
+  emit("click", selection.items.value);
 };
 defineCommands(() => ({
   id: "plugin:item_action:" + props.id,
   group: "selection",
   label: props.title,
   icon: props.icon,
-  disabled: props.disabled || !selection.blocks.value.length,
+  disabled: props.disabled || !selection.items.value.length,
   callback: onClick
 }));
 defineTourItem(() => {
@@ -77,10 +87,8 @@ defineTourItem(() => {
     element: () => el.value
   };
 });
-</script>
-
-<script>
-export default {
-  name: "PluginItemAction"
-};
+defineOptions({
+  name: "PluginItemAction",
+  inheritAttrs: false
+});
 </script>

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

@@ -1,6 +1,6 @@
 import type { BlokkliIcon } from '#blokkli-build/icons';
-import type { DraggableExistingBlock } from '#blokkli/types';
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+import type { RenderedFieldListItem } from '#blokkli/types';
+type __VLS_Props = {
     id: string;
     /**
      * The title of the action.
@@ -27,54 +27,31 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
      */
     multiple?: boolean;
     /**
-     * The weight, used for positioning the button.
-     */
-    weight?: number | string | "last";
-    icon?: BlokkliIcon;
-    tourText?: string;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    click: (items: DraggableExistingBlock[]) => any;
-}, string, import("vue").PublicProps, Readonly<{
-    id: string;
-    /**
-     * The title of the action.
-     */
-    title: string;
-    /**
-     * Whether the action is disabled.
-     */
-    disabled?: boolean;
-    /**
-     * Whether the button should be displayed in an active state (e.g. when it's a dropdown).
+     * Whether the action is only available in edit mode.
      */
-    active?: boolean;
-    /**
-     * The key code to use for the shortcut.
-     */
-    keyCode?: string;
-    /**
-     * Wheter the shortcut needs the meta modifier key.
-     */
-    meta?: boolean;
-    /**
-     * Whether the action supports multiple items.
-     */
-    multiple?: boolean;
+    editOnly?: boolean;
     /**
      * The weight, used for positioning the button.
      */
-    weight?: number | string | "last";
+    weight?: number | string | 'last';
     icon?: BlokkliIcon;
     tourText?: string;
-}> & Readonly<{
-    onClick?: ((items: DraggableExistingBlock[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    icon?: ((props: {}) => any) | undefined;
-    default?: ((props: {
-        items: DraggableExistingBlock[];
-        uuids: string[];
-    }) => any) | undefined;
-}>;
+};
+declare var __VLS_5: {}, __VLS_19: {
+    items: RenderedFieldListItem[];
+    uuids: string[];
+};
+type __VLS_Slots = {} & {
+    icon?: (props: typeof __VLS_5) => any;
+} & {
+    default?: (props: typeof __VLS_19) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    click: (items: RenderedFieldListItem[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((items: RenderedFieldListItem[]) => any) | undefined;
+}>, {}, {}, {}, {}, 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 (): {

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

@@ -1,21 +1,65 @@
 <template>
   <Teleport v-if="enabled" to="#bk-blokkli-item-actions-dropdown">
-    <div>
-      <h3>{{ title }}</h3>
-      <slot />
+    <div
+      v-show="items.length"
+      :style="{
+  order: weight
+}"
+    >
+      <ol>
+        <li v-for="item in itemsMapped" :key="item.id">
+          <button
+            class="bk-blokkli-item-actions-type-dropdown-button"
+            :disabled="!item.enabled"
+            @click.prevent="onClick(item)"
+          >
+            <div class="bk-blokkli-item-actions-type-dropdown-icon">
+              <Icon v-if="item.icon" :name="item.icon" />
+              <ItemIcon v-else-if="item.bundle" :bundle="item.bundle" />
+            </div>
+            <div>
+              <div>{{ item.label }}</div>
+            </div>
+            <div v-if="item.description" class="bk-tooltip">
+              {{ item.description }}
+            </div>
+          </button>
+        </li>
+      </ol>
     </div>
   </Teleport>
 </template>
 
-<script setup>
+<script>
+import { Icon, ItemIcon } from "#blokkli/components";
 import { computed, useBlokkli, onMounted, onBeforeUnmount } from "#imports";
+</script>
+
+<script setup>
 const props = defineProps({
   id: { type: String, required: true },
   title: { type: String, required: true },
-  enabled: { type: Boolean, required: true }
+  enabled: { type: Boolean, required: true },
+  items: { type: Array, required: true },
+  icon: { type: null, required: false },
+  weight: { type: [String, Number], required: false }
+});
+const emit = defineEmits(["select"]);
+const itemsMapped = computed(() => {
+  return props.items.map((item) => {
+    return {
+      ...item,
+      icon: item.icon ?? props.icon,
+      enabled: item.enabled !== false
+    };
+  });
 });
 const { eventBus } = useBlokkli();
 const isRendering = computed(() => props.enabled);
+function onClick(item) {
+  emit("select", item);
+  eventBus.emit("action:selected");
+}
 onMounted(() => {
   eventBus.emit("plugin:mount", {
     type: "ItemDropdown",
@@ -30,9 +74,3 @@ onBeforeUnmount(() => {
   });
 });
 </script>
-
-<script>
-export default {
-  name: "PluginItemDropdown"
-};
-</script>

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

@@ -1,17 +1,31 @@
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+import type { BlokkliIcon } from '#blokkli-build/icons';
+type Item = {
     id: string;
-    title: string;
-    enabled: boolean;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-    id: string;
-    title: string;
-    enabled: boolean;
-}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: ((props: {}) => any) | undefined;
-}>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
+    label: string;
+    description?: string;
+    enabled?: boolean;
+    icon?: BlokkliIcon;
+    bundle?: string;
 };
+declare const _default: <T extends Item>(__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<{
+        readonly onSelect?: ((item: T) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onSelect"> & {
+        id: string;
+        title: string;
+        enabled: boolean;
+        items: T[];
+        icon?: BlokkliIcon;
+        weight?: string | number;
+    } & Partial<{}>> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {};
+    emit: (e: "select", item: T) => void;
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

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

@@ -5,7 +5,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
     description: string;
     disabled?: boolean;
     icon?: BlokkliIcon;
-    type?: "success" | "danger";
+    type?: "success" | "danger" | "yellow";
     weight?: number;
     secondary?: boolean;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -16,13 +16,13 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
     description: string;
     disabled?: boolean;
     icon?: BlokkliIcon;
-    type?: "success" | "danger";
+    type?: "success" | "danger" | "yellow";
     weight?: number;
     secondary?: boolean;
 }> & Readonly<{
     onClick?: ((...args: any[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: ((props: {}) => any) | undefined;
+    default?: (props: {}) => any;
 }>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/blokkliPlugins/Sidebar/Detached/index.vue

@@ -69,6 +69,7 @@ import {
 } from "#imports";
 import { Icon, ViewportBlockingRect, ScrollBoundary } from "#blokkli/components";
 import onBlokkliEvent from "#blokkli/helpers/composables/onBlokkliEvent";
+import { addElementClasses } from "#blokkli/helpers/addElementClasses";
 const props = defineProps({
   id: { type: String, required: true },
   title: { type: String, required: true },
@@ -147,13 +148,11 @@ const rootCursor = computed(() => {
 watch(rootCursor, (cursor) => {
   document.documentElement.style.cursor = cursor;
 });
-watch(mouseMode, (mode) => {
-  if (mode) {
-    document.documentElement.classList.add("bk-is-sidebar-interacting");
-  } else {
-    document.documentElement.classList.remove("bk-is-sidebar-interacting");
-  }
-});
+addElementClasses(
+  document.documentElement,
+  "bk-is-sidebar-interacting",
+  mouseMode
+);
 const updateStored = () => {
   storedData.value = {
     x: x.value,

package/dist/runtime/blokkliPlugins/Sidebar/Detached/index.vue.d.ts

@@ -1,4 +1,3 @@
-import { Icon, ViewportBlockingRect, ScrollBoundary } from '#blokkli/components';
 import type { BlokkliIcon } from '#blokkli-build/icons';
 type __VLS_Props = {
     id: string;
@@ -12,64 +11,16 @@ type __VLS_Props = {
     };
     isLeft?: boolean;
 };
-declare function onPointerMove(e: PointerEvent): void;
-declare const isMinimized: import("vue").WritableComputedRef<boolean, boolean>;
-declare const storageKey: import("vue").ComputedRef<string>;
-declare const focusedSidebar: import("vue").WritableComputedRef<string, string>;
-type MouseMode = 'move' | 'resize-right' | 'resize-bottom' | 'resize-bottom-right' | '';
-declare const isResizing: import("vue").ComputedRef<boolean>;
-declare const userWidth: import("vue").Ref<number, number>;
-declare const userHeight: import("vue").Ref<number, number>;
-declare const style: import("vue").ComputedRef<{
-    transform: string;
-    zIndex: number;
-}>;
-declare const innerStyle: import("vue").ComputedRef<{
-    width: string;
-    height: string | number;
-}>;
-declare const onFocus: () => void;
-declare const onMouseDown: (e: MouseEvent, mode: MouseMode) => void;
-declare const el: import("vue").Ref<HTMLDivElement | null, HTMLDivElement | null>;
-declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_16: {}, __VLS_30: {
     width: number;
     height: number;
     isResizing: boolean;
 };
-type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+type __VLS_Slots = {} & {
     icon?: (props: typeof __VLS_16) => any;
 } & {
     default?: (props: typeof __VLS_30) => any;
-}>;
-declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
-    Icon: typeof Icon;
-    ViewportBlockingRect: typeof ViewportBlockingRect;
-    ScrollBoundary: typeof ScrollBoundary;
-    onPointerMove: typeof onPointerMove;
-    isMinimized: typeof isMinimized;
-    storageKey: typeof storageKey;
-    focusedSidebar: typeof focusedSidebar;
-    isResizing: typeof isResizing;
-    userWidth: typeof userWidth;
-    userHeight: typeof userHeight;
-    style: typeof style;
-    innerStyle: typeof innerStyle;
-    onFocus: typeof onFocus;
-    onMouseDown: typeof onMouseDown;
-    el: typeof el;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    close: (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onClose?: ((...args: any[]) => any) | undefined;
-}>, {
-    size: {
-        width: number;
-        height: number;
-    };
-    minWidth: number;
-    minHeight: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+};
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{

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

@@ -130,11 +130,11 @@ const { storage, state, ui, $t } = useBlokkli();
 const tourElement = ref(null);
 const detachedKey = computed(() => "sidebar:detached:" + props.id);
 const storageKey = computed(() => "sidebar:active:" + props.region);
-const isDetached = storage.use(detachedKey, false);
+const isDetached = storage.use(detachedKey, false, true);
 const isDisabled = computed(
   () => props.editOnly && state.editMode.value !== "editing" && !props.disabled
 );
-const activeSidebar = storage.use(storageKey, "");
+const activeSidebar = storage.use(storageKey, "", true);
 const isRenderedDetached = computed(
   () => isDetached.value && !ui.isMobile.value
 );
@@ -166,13 +166,6 @@ const showSidebar = () => {
   }
   activeSidebar.value = props.id;
 };
-watch(activeSidebar, (active) => {
-  if (active) {
-    document.documentElement.classList.add("bk-has-sidebar-" + props.region);
-  } else {
-    document.documentElement.classList.remove("bk-has-sidebar-" + props.region);
-  }
-});
 const sidebarContent = ref(null);
 const scrolledToEnd = ref(false);
 const isOverflowing = ref(false);

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

@@ -50,24 +50,30 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
         width: number;
         height: number;
     };
-    keyCode: string;
     weight: string | number;
+    keyCode: string;
     tourText: string;
     minWidth: number;
     minHeight: number;
     region: "left" | "right";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    icon?: (((props: {}) => any) & ((props: {}) => any)) | undefined;
-    badge?: ((props: {}) => any) | undefined;
-    default?: (((props: {
+    icon?: (props: {}) => any;
+} & {
+    badge?: (props: {}) => any;
+} & {
+    icon?: (props: {}) => any;
+} & {
+    default?: (props: {
         key: string;
         scrolledToEnd: boolean;
         isDetached: true;
-        width: number;
-        height: number;
+        width: any;
+        height: any;
         toggleSidebar: () => void;
-        isResizing: boolean;
-    }) => any) & ((props: {
+        isResizing: any;
+    }) => any;
+} & {
+    default?: (props: {
         key: string;
         scrolledToEnd: boolean;
         isDetached: false;
@@ -75,7 +81,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
         height: undefined;
         toggleSidebar: () => void;
         isResizing: boolean;
-    }) => any)) | undefined;
+    }) => any;
 }>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

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

@@ -38,7 +38,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
 }> & Readonly<{
     onClick?: ((...args: any[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: ((props: {}) => any) | undefined;
+    default?: (props: {}) => any;
 }>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

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

@@ -4,13 +4,14 @@
 
 <script setup>
 import defineTourItem from "#blokkli/helpers/composables/defineTourItem";
-import { getCurrentInstance } from "#imports";
+import { getCurrentInstance, useBlokkli } 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 { element } = useBlokkli();
 const findElement = (el) => {
   if (el instanceof Text) {
     return findElement(el.nextElementSibling);
@@ -25,10 +26,14 @@ defineTourItem(() => {
     title: props.title,
     text: props.text,
     element: () => {
-      const provided = props.selector ? document.querySelector(props.selector) : void 0;
-      const element = provided || findElement(instance?.vnode.el);
-      if (element instanceof HTMLElement) {
-        return element;
+      const provided = props.selector ? element.query(
+        document.documentElement,
+        props.selector,
+        `TourItem Plugin: ${props.id}`
+      ) : void 0;
+      const el = provided || findElement(instance?.vnode.el);
+      if (el instanceof HTMLElement) {
+        return el;
       }
     }
   };