@blokkli/editor 2.0.0-alpha.58 → 2.0.0-alpha.60

package/dist/runtime/editor/features/templates/ManageDialog/index.vue

@@ -1,128 +0,0 @@
-<template>
-  <DialogModal
-    id="templates-manage"
-    :title="$t('templatesManageDialogTitle', 'Manage templates')"
-    :lead="
-  $t(
-    'templatesManageDialogLead',
-    'View, edit and delete your block templates.'
-  )
-"
-    :width="1200"
-    icon="bk_mdi_dashboard"
-    hide-buttons
-    @cancel="$emit('cancel')"
-  >
-    <div ref="dialogEl" class="bk-templates-manage">
-      <div v-if="config.length" class="_bk_mt-20 _bk_mb-30">
-        <ConfigForm v-model="filters" :config />
-      </div>
-      <Loading v-if="status === 'pending'" />
-      <template v-if="items.length">
-        <table class="bk-table _bk_mt-40">
-          <thead>
-            <tr>
-              <th>
-                {{ $t("nameDescription", "Name / Description") }}
-              </th>
-              <th>
-                {{ $t("createdBy", "Created by") }}
-              </th>
-              <th>
-                {{ $t("created", "Created") }}
-              </th>
-              <th>
-                {{ $t("dateUpdated", "Updated") }}
-              </th>
-              <th class="_bk_text-right">
-                {{ $t("actions", "Actions") }}
-              </th>
-            </tr>
-          </thead>
-          <tbody>
-            <TabelRow
-              v-for="item in items"
-              :key="item.uuid"
-              v-bind="item"
-              @refresh="refresh"
-            />
-          </tbody>
-        </table>
-        <div v-if="totalPages > 1">
-          <Pagination v-model="page" :total-pages />
-        </div>
-      </template>
-      <p v-else class="bk-lead">
-        {{ $t("templatesManageDialogNoResults", "No templates found.") }}
-      </p>
-    </div>
-  </DialogModal>
-</template>
-
-<script setup>
-import {
-  ref,
-  useBlokkli,
-  computed,
-  useAsyncData,
-  watch,
-  reactive
-} from "#imports";
-import {
-  DialogModal,
-  Pagination,
-  Loading,
-  ConfigForm
-} from "#blokkli/editor/components";
-import TabelRow from "./Item.vue";
-defineEmits(["cancel"]);
-const { $t, adapter } = useBlokkli();
-const page = ref(0);
-const confirmDeleteUuid = ref("");
-const filters = reactive({});
-const searchParams = computed(() => ({
-  page: page.value,
-  filters: { ...filters },
-  includeItems: false
-}));
-const { data, status, refresh } = await useAsyncData(
-  () => adapter.templatesSearch(searchParams.value),
-  {
-    watch: [searchParams],
-    default: () => ({
-      items: [],
-      filters: [],
-      total: 0,
-      perPage: 10
-    })
-  }
-);
-const perPage = computed(() => data.value.perPage);
-const totalPages = computed(() => Math.ceil(data.value.total / perPage.value));
-const items = computed(() => data.value.items);
-const config = computed(() => data.value.filters);
-watch(page, () => {
-  confirmDeleteUuid.value = "";
-});
-</script>
-
-<style>
-.bk .bk-templates-manage {
-    min-height: 80vh;
-    position: relative;
-    user-select: text;
-    margin-top: 25px;
-  }
-    .bk .bk-templates-manage .bk-table tbody td {
-    padding-top: 15px;
-    padding-bottom: 15px;
-}
-    .bk .bk-templates-manage .bk-table tbody td:first-child div:first-child {
-    font-size: 18px;
-    line-height: 28px;
-    font-weight: 700;
-}
-    .bk .bk-templates-manage .bk-table tbody td:first-child div:first-child .bk-pill {
-    margin-left: 5px;
-}
-</style>

package/dist/runtime/editor/plugins/ViewOption/index.d.vue.ts

@@ -1,139 +0,0 @@
-import type { BlokkliIcon } from '#blokkli-build/icons';
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
-    /**
-     * Unique identifier for this view option.
-     *
-     * Used for storage key and event tracking.
-     */
-    id: string;
-    /**
-     * The label used in commands and tour.
-     */
-    label: string;
-    /**
-     * The tooltip text when the option is OFF.
-     *
-     * Should describe what happens when turned on.
-     * @example 'Show grid'
-     */
-    titleOn: string;
-    /**
-     * The tooltip text when the option is ON.
-     *
-     * Should describe what happens when turned off.
-     * @example 'Hide grid'
-     */
-    titleOff: string;
-    /**
-     * Whether the view option is only available in edit mode.
-     *
-     * If true, the option is hidden in preview mode.
-     */
-    editOnly?: boolean;
-    /**
-     * The key code to use for the keyboard shortcut.
-     *
-     * Automatically includes Meta modifier.
-     * @example 'g' for Cmd+G / Ctrl+G
-     */
-    keyCode?: string;
-    /**
-     * The icon displayed in the button.
-     */
-    icon?: BlokkliIcon;
-    /**
-     * Optional text for the interactive tour.
-     *
-     * If provided, this option will be included in the editor tour.
-     */
-    tourText?: string;
-    /**
-     * Two-way binding for the active state.
-     *
-     * Can be used with v-model to track the option state.
-     */
-    modelValue?: boolean;
-    /**
-     * The weight, used for positioning the button.
-     *
-     * Lower weights appear first.
-     */
-    weight?: number | string;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    "update:modelValue": (data: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<{
-    /**
-     * Unique identifier for this view option.
-     *
-     * Used for storage key and event tracking.
-     */
-    id: string;
-    /**
-     * The label used in commands and tour.
-     */
-    label: string;
-    /**
-     * The tooltip text when the option is OFF.
-     *
-     * Should describe what happens when turned on.
-     * @example 'Show grid'
-     */
-    titleOn: string;
-    /**
-     * The tooltip text when the option is ON.
-     *
-     * Should describe what happens when turned off.
-     * @example 'Hide grid'
-     */
-    titleOff: string;
-    /**
-     * Whether the view option is only available in edit mode.
-     *
-     * If true, the option is hidden in preview mode.
-     */
-    editOnly?: boolean;
-    /**
-     * The key code to use for the keyboard shortcut.
-     *
-     * Automatically includes Meta modifier.
-     * @example 'g' for Cmd+G / Ctrl+G
-     */
-    keyCode?: string;
-    /**
-     * The icon displayed in the button.
-     */
-    icon?: BlokkliIcon;
-    /**
-     * Optional text for the interactive tour.
-     *
-     * If provided, this option will be included in the editor tour.
-     */
-    tourText?: string;
-    /**
-     * Two-way binding for the active state.
-     *
-     * Can be used with v-model to track the option state.
-     */
-    modelValue?: boolean;
-    /**
-     * The weight, used for positioning the button.
-     *
-     * Lower weights appear first.
-     */
-    weight?: number | string;
-}> & Readonly<{
-    "onUpdate:modelValue"?: ((data: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    icon?: (props: {}) => any;
-} & {
-    default?: (props: {
-        isActive: any;
-    }) => any;
-}>;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/runtime/editor/plugins/ViewOption/index.vue

@@ -1,97 +0,0 @@
-<template>
-  <Teleport to="#bk-toolbar-view-options">
-    <button
-      v-if="!ui.isMobile.value"
-      ref="button"
-      class="bk-toolbar-button _bk_group/tooltip"
-      :class="{ 'bk-is-inactive': !isActive }"
-      :style="{ order: weight || 0 }"
-      @click.prevent.stop="onClick"
-    >
-      <slot name="icon">
-        <Icon v-if="icon" :name="icon" />
-      </slot>
-      <Tooltip :label="title" class="_bk_w-full" placement="below-left">
-        <template v-if="keyCode">
-          <ShortcutIndicator
-            meta
-            :key-code="keyCode"
-            :label="label"
-            group="ui"
-            @pressed="onClick"
-          />
-        </template>
-      </Tooltip>
-    </button>
-  </Teleport>
-
-  <slot :is-active="isActive && !ui.isMobile.value" />
-</template>
-
-<script setup>
-import { useBlokkli, computed, ref, watch } from "#imports";
-import { ShortcutIndicator, Icon, Tooltip } from "#blokkli/editor/components";
-import { defineCommands, defineTourItem } from "#blokkli/editor/composables";
-const { storage, ui, eventBus, debug } = useBlokkli();
-const props = defineProps({
-  id: { type: String, required: true },
-  label: { type: String, required: true },
-  titleOn: { type: String, required: true },
-  titleOff: { type: String, required: true },
-  editOnly: { type: Boolean, required: false },
-  keyCode: { type: String, required: false },
-  icon: { type: null, required: false },
-  tourText: { type: String, required: false },
-  modelValue: { type: Boolean, required: false },
-  weight: { type: [Number, String], required: false }
-});
-const emit = defineEmits(["update:modelValue"]);
-const logger = debug.createLogger("PluginViewOption");
-const storageKey = "view_option_" + props.id;
-const button = ref(null);
-const isActiveStorage = storage.use(storageKey, false, true);
-const isActive = computed({
-  get() {
-    return isActiveStorage.value;
-  },
-  set(v) {
-    isActiveStorage.value = v;
-    emit("update:modelValue", v);
-  }
-});
-watch(isActive, () => {
-  eventBus.emit("view-option:toggle", { id: props.id });
-});
-emit("update:modelValue", isActiveStorage.value);
-const title = computed(() => isActive.value ? props.titleOff : props.titleOn);
-const onClick = () => {
-  isActive.value = !isActive.value;
-  logger.log("Toggle " + props.id, isActive.value);
-};
-defineCommands(() => {
-  return {
-    id: "plugin:view_option:" + props.id,
-    label: title.value,
-    icon: props.icon,
-    group: "ui",
-    callback: () => isActive.value = !isActive.value
-  };
-});
-defineTourItem(() => {
-  if (!props.tourText) {
-    return;
-  }
-  return {
-    id: "plugin:view_option:" + props.id,
-    title: props.label,
-    text: props.tourText,
-    element: () => button.value
-  };
-});
-</script>
-
-<script>
-export default {
-  name: "PluginViewOption"
-};
-</script>

package/dist/runtime/editor/plugins/ViewOption/index.vue.d.ts

@@ -1,139 +0,0 @@
-import type { BlokkliIcon } from '#blokkli-build/icons';
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
-    /**
-     * Unique identifier for this view option.
-     *
-     * Used for storage key and event tracking.
-     */
-    id: string;
-    /**
-     * The label used in commands and tour.
-     */
-    label: string;
-    /**
-     * The tooltip text when the option is OFF.
-     *
-     * Should describe what happens when turned on.
-     * @example 'Show grid'
-     */
-    titleOn: string;
-    /**
-     * The tooltip text when the option is ON.
-     *
-     * Should describe what happens when turned off.
-     * @example 'Hide grid'
-     */
-    titleOff: string;
-    /**
-     * Whether the view option is only available in edit mode.
-     *
-     * If true, the option is hidden in preview mode.
-     */
-    editOnly?: boolean;
-    /**
-     * The key code to use for the keyboard shortcut.
-     *
-     * Automatically includes Meta modifier.
-     * @example 'g' for Cmd+G / Ctrl+G
-     */
-    keyCode?: string;
-    /**
-     * The icon displayed in the button.
-     */
-    icon?: BlokkliIcon;
-    /**
-     * Optional text for the interactive tour.
-     *
-     * If provided, this option will be included in the editor tour.
-     */
-    tourText?: string;
-    /**
-     * Two-way binding for the active state.
-     *
-     * Can be used with v-model to track the option state.
-     */
-    modelValue?: boolean;
-    /**
-     * The weight, used for positioning the button.
-     *
-     * Lower weights appear first.
-     */
-    weight?: number | string;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    "update:modelValue": (data: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<{
-    /**
-     * Unique identifier for this view option.
-     *
-     * Used for storage key and event tracking.
-     */
-    id: string;
-    /**
-     * The label used in commands and tour.
-     */
-    label: string;
-    /**
-     * The tooltip text when the option is OFF.
-     *
-     * Should describe what happens when turned on.
-     * @example 'Show grid'
-     */
-    titleOn: string;
-    /**
-     * The tooltip text when the option is ON.
-     *
-     * Should describe what happens when turned off.
-     * @example 'Hide grid'
-     */
-    titleOff: string;
-    /**
-     * Whether the view option is only available in edit mode.
-     *
-     * If true, the option is hidden in preview mode.
-     */
-    editOnly?: boolean;
-    /**
-     * The key code to use for the keyboard shortcut.
-     *
-     * Automatically includes Meta modifier.
-     * @example 'g' for Cmd+G / Ctrl+G
-     */
-    keyCode?: string;
-    /**
-     * The icon displayed in the button.
-     */
-    icon?: BlokkliIcon;
-    /**
-     * Optional text for the interactive tour.
-     *
-     * If provided, this option will be included in the editor tour.
-     */
-    tourText?: string;
-    /**
-     * Two-way binding for the active state.
-     *
-     * Can be used with v-model to track the option state.
-     */
-    modelValue?: boolean;
-    /**
-     * The weight, used for positioning the button.
-     *
-     * Lower weights appear first.
-     */
-    weight?: number | string;
-}> & Readonly<{
-    "onUpdate:modelValue"?: ((data: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    icon?: (props: {}) => any;
-} & {
-    default?: (props: {
-        isActive: any;
-    }) => any;
-}>;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};