@blokkli/editor 1.4.0-alpha.1 → 2.0.0-alpha.2

package/dist/runtime/components/Edit/FormOverlay/index.vue

@@ -24,29 +24,23 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import FormHeader from './Header/index.vue'
-import type { BlokkliIcon } from '#blokkli-build/icons'
-import { Resizable } from '#blokkli/components'
-
-defineProps<{
-  id: string
-  bundle?: string
-  icon?: BlokkliIcon
-  title: string
-}>()
-
-const emit = defineEmits<{
-  (e: 'close'): void
-}>()
-
+<script setup>
+import FormHeader from "./Header/index.vue";
+import { Resizable } from "#blokkli/components";
+defineProps({
+  id: { type: String, required: true },
+  bundle: { type: String, required: false },
+  icon: { type: null, required: false },
+  title: { type: String, required: true }
+});
+const emit = defineEmits(["close"]);
 const onClose = () => {
-  emit('close')
-}
+  emit("close");
+};
 </script>
 
-<script lang="ts">
+<script>
 export default {
-  name: 'FormOverlay',
-}
+  name: "FormOverlay"
+};
 </script>

package/dist/runtime/components/Edit/FormOverlay/index.vue.d.ts

@@ -0,0 +1,25 @@
+import type { BlokkliIcon } from '#blokkli-build/icons';
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+    id: string;
+    bundle?: string;
+    icon?: BlokkliIcon;
+    title: string;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    close: () => any;
+}, string, import("vue").PublicProps, Readonly<{
+    id: string;
+    bundle?: string;
+    icon?: BlokkliIcon;
+    title: string;
+}> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: ((props: {}) => any) | undefined;
+    footer?: ((props: {}) => any) | undefined;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/Edit/Highlight/index.vue

@@ -3,92 +3,53 @@
   <Component :is="tag || 'div'" class="bk-highlight" v-html="markup" />
 </template>
 
-<script lang="ts" setup>
-import { computed } from '#imports'
-
-const props = defineProps<{
-  /**
-   * The text to find the matches in.
-   */
-  text: string
-
-  /**
-   * The regex to use for matching words.
-   */
-  regex?: RegExp
-
-  /**
-   * The indices of the matches.
-   */
-  positions?: number[]
-
-  /**
-   * The tag for the wrapper.
-   */
-  tag?: string
-}>()
-
-const highlightPositions = (text: string, positions: number[]): string => {
-  let result = ''
-  let inTag = false // Flag to indicate if we are currently adding text inside <em></em>.
-
+<script setup>
+import { computed } from "#imports";
+const props = defineProps({
+  text: { type: String, required: true },
+  regex: { type: null, required: false },
+  positions: { type: Array, required: false },
+  tag: { type: String, required: false }
+});
+const highlightPositions = (text, positions) => {
+  let result = "";
+  let inTag = false;
   for (let i = 0; i < text.length; i++) {
-    // Check if the current character's index is in the positions array.
     if (positions.includes(i)) {
-      // If the previous character was not a match, we start a new <em>.
       if (!inTag) {
-        result += '<em>'
-        inTag = true
+        result += "<em>";
+        inTag = true;
       }
-      result += text[i]
+      result += text[i];
     } else {
-      // If the previous character was a match, we close the <em> tag.
       if (inTag) {
-        result += '</em>'
-        inTag = false
+        result += "</em>";
+        inTag = false;
       }
-      result += text[i]
+      result += text[i];
     }
   }
-
-  // Close the <em> tag if the last character in text was a match.
   if (inTag) {
-    result += '</em>'
+    result += "</em>";
   }
-
-  return result
-}
-
+  return result;
+};
 const markup = computed(() => {
   if (props.positions?.length) {
-    return highlightPositions(props.text, props.positions)
+    return highlightPositions(props.text, props.positions);
   }
-
   if (!props.regex) {
-    return props.text
+    return props.text;
   }
-
-  // Find the first occurrence index of any word.
-  const firstMatch = props.text.match(props.regex)
-  const index = firstMatch
-    ? props.text.toLowerCase().indexOf(firstMatch[0].toLowerCase())
-    : -1
-
-  // If no match is found, return the original text.
+  const firstMatch = props.text.match(props.regex);
+  const index = firstMatch ? props.text.toLowerCase().indexOf(firstMatch[0].toLowerCase()) : -1;
   if (index === -1) {
-    return props.text
+    return props.text;
   }
-
-  // Extract the part of the text before the first match.
-  const before = props.text.substring(Math.max(0, index - 30), index)
-
-  // Replace each occurrence with the highlighted version.
-  const highlighted = props.text
-    .substring(index)
-    .replace(props.regex, (match) => {
-      return `<em>${match}</em>`
-    })
-
-  return before + highlighted
-})
+  const before = props.text.substring(Math.max(0, index - 30), index);
+  const highlighted = props.text.substring(index).replace(props.regex, (match) => {
+    return `<em>${match}</em>`;
+  });
+  return before + highlighted;
+});
 </script>

package/dist/runtime/components/Edit/Highlight/index.vue.d.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    /**
+     * The text to find the matches in.
+     */
+    text: string;
+    /**
+     * The regex to use for matching words.
+     */
+    regex?: RegExp;
+    /**
+     * The indices of the matches.
+     */
+    positions?: number[];
+    /**
+     * The tag for the wrapper.
+     */
+    tag?: string;
+};
+declare const _default: 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>;
+export default _default;

package/dist/runtime/components/Edit/Icon/index.vue

@@ -1,21 +1,18 @@
 <template>
-  <div class="bk-icon" v-html="markup" />
+  <div class="bk-icon" :class="'bk-icon-' + name" v-html="markup" />
 </template>
 
-<script lang="ts" setup>
-import { computed } from '#imports'
-import { icons } from '#blokkli-build/icons'
-import type { BlokkliIcon } from '#blokkli-build/icons'
-
-const props = defineProps<{
-  name: BlokkliIcon
-}>()
-
-const markup = computed(() => icons[props.name])
+<script setup>
+import { computed } from "#imports";
+import { icons } from "#blokkli-build/icons";
+const props = defineProps({
+  name: { type: null, required: true }
+});
+const markup = computed(() => icons[props.name]);
 </script>
 
-<script lang="ts">
+<script>
 export default {
-  name: 'Icon',
-}
+  name: "Icon"
+};
 </script>

package/dist/runtime/components/Edit/Icon/index.vue.d.ts

@@ -0,0 +1,7 @@
+import type { BlokkliIcon } from '#blokkli-build/icons';
+declare const _default: import("vue").DefineComponent<{
+    name: BlokkliIcon;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    name: BlokkliIcon;
+}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/Edit/InfoBox/index.vue

@@ -5,10 +5,9 @@
   </div>
 </template>
 
-<script setup lang="ts">
-import { Icon } from '#blokkli/components'
-
-defineProps<{
-  text: string
-}>()
+<script setup>
+import { Icon } from "#blokkli/components";
+defineProps({
+  text: { type: String, required: true }
+});
 </script>

package/dist/runtime/components/Edit/InfoBox/index.vue.d.ts

@@ -0,0 +1,5 @@
+type __VLS_Props = {
+    text: string;
+};
+declare const _default: 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>;
+export default _default;

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

@@ -8,20 +8,20 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import { computed } from '#imports'
-import { icons } from '#blokkli-build/definitions'
-import { Icon } from '#blokkli/components'
-
-const props = defineProps<{
-  bundle?: string
-}>()
-
-const markup = computed(() => (props.bundle ? icons[props.bundle] : undefined))
+<script setup>
+import { computed, useBlokkli } from "#imports";
+import { Icon } from "#blokkli/components";
+const props = defineProps({
+  bundle: { type: String, required: false }
+});
+const { definitions } = useBlokkli();
+const markup = computed(
+  () => props.bundle ? definitions.getBlockIcon(props.bundle) : void 0
+);
 </script>
 
-<script lang="ts">
+<script>
 export default {
-  name: 'ItemIcon',
-}
+  name: "ItemIcon"
+};
 </script>

package/dist/runtime/components/Edit/ItemIcon/index.vue.d.ts

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

package/dist/runtime/components/Edit/Loading/index.vue

@@ -4,16 +4,15 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import { Icon } from '#blokkli/components'
-
-defineProps<{
-  screen?: boolean
-}>()
+<script setup>
+import { Icon } from "#blokkli/components";
+defineProps({
+  screen: { type: Boolean, required: false }
+});
 </script>
 
-<script lang="ts">
+<script>
 export default {
-  name: 'Loading',
-}
+  name: "Loading"
+};
 </script>

package/dist/runtime/components/Edit/Loading/index.vue.d.ts

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

package/dist/runtime/components/Edit/Messages/Item/index.vue

@@ -47,61 +47,50 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import { ref, onMounted, onBeforeUnmount, computed, watch } from '#imports'
-import { Icon, DialogModal } from '#blokkli/components'
-
-const props = defineProps<{
-  type: 'success' | 'error'
-  message: string
-  additional?: string | Error | unknown
-}>()
-
-const emit = defineEmits(['close'])
-const hasTimer = ref(true)
-const showDetails = ref(false)
-
+<script setup>
+import { ref, onMounted, onBeforeUnmount, computed, watch } from "#imports";
+import { Icon, DialogModal } from "#blokkli/components";
+const props = defineProps({
+  type: { type: String, required: true },
+  message: { type: String, required: true },
+  additional: { type: null, required: false }
+});
+const emit = defineEmits(["close"]);
+const hasTimer = ref(true);
+const showDetails = ref(false);
 const additionalText = computed(() => {
   if (!props.additional) {
-    return null
+    return null;
   }
-
   if (props.additional instanceof Error) {
-    return props.additional.message
+    return props.additional.message;
   }
-
-  return null
-})
-
-watch(showDetails, function (isVisible) {
+  return null;
+});
+watch(showDetails, function(isVisible) {
   if (isVisible) {
-    stopTimer()
+    stopTimer();
   }
-})
-
+});
 function stopTimer() {
-  clearTimeout(timeout)
-  hasTimer.value = false
+  clearTimeout(timeout);
+  hasTimer.value = false;
 }
-
 function startTimer() {
-  clearTimeout(timeout)
+  clearTimeout(timeout);
   if (showDetails.value) {
-    return
+    return;
   }
-  hasTimer.value = true
+  hasTimer.value = true;
   timeout = setTimeout(() => {
-    emit('close')
-  }, 6000)
+    emit("close");
+  }, 6e3);
 }
-
-let timeout: any = null
-
+let timeout = null;
 onMounted(() => {
-  startTimer()
-})
-
+  startTimer();
+});
 onBeforeUnmount(() => {
-  stopTimer()
-})
+  stopTimer();
+});
 </script>

package/dist/runtime/components/Edit/Messages/Item/index.vue.d.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    type: 'success' | 'error';
+    message: string;
+    additional?: string | Error | unknown;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/Edit/Messages/index.vue

@@ -11,25 +11,21 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import { ref } from '#imports'
-import type { Message } from '#blokkli/types'
-import Item from './Item/index.vue'
-import onBlokkliEvent from '#blokkli/helpers/composables/onBlokkliEvent'
-
-const messages = ref<Message[]>([])
-
-function removeMessage(index: number) {
-  messages.value = messages.value.filter((_v, i) => i !== index)
+<script setup>
+import { ref } from "#imports";
+import Item from "./Item/index.vue";
+import onBlokkliEvent from "#blokkli/helpers/composables/onBlokkliEvent";
+const messages = ref([]);
+function removeMessage(index) {
+  messages.value = messages.value.filter((_v, i) => i !== index);
 }
-
-onBlokkliEvent('message', (message) => {
-  messages.value.push(message)
-})
+onBlokkliEvent("message", (message) => {
+  messages.value.push(message);
+});
 </script>
 
-<script lang="ts">
+<script>
 export default {
-  name: 'Messages',
-}
+  name: "Messages"
+};
 </script>

package/dist/runtime/components/Edit/Messages/index.vue.d.ts

@@ -0,0 +1,2 @@
+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/Pagination/index.vue

@@ -10,12 +10,10 @@
   </div>
 </template>
 
-<script setup lang="ts">
-import { Icon } from '#blokkli/components'
-
-defineProps<{
-  totalPages: number
-}>()
-
-const page = defineModel<number>({ default: 0 })
+<script setup>
+import { Icon } from "#blokkli/components";
+defineProps({
+  totalPages: { type: Number, required: true }
+});
+const page = defineModel({ type: Number, ...{ default: 0 } });
 </script>

package/dist/runtime/components/Edit/Pagination/index.vue.d.ts

@@ -0,0 +1,12 @@
+type __VLS_Props = {
+    totalPages: number;
+};
+type __VLS_PublicProps = __VLS_Props & {
+    modelValue?: number;
+};
+declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: number) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;