ablok-components 0.3.60 → 0.3.61

package/dist/components/molecules/rte-editor/rte-editor.vue.d.ts

@@ -11,6 +11,10 @@ declare const _default: import('../../../../vue/dist/vue.esm-bundler.js').Define
         type: StringConstructor;
         default: string;
     };
+    allowFullscreen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import('../../../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, import('../../../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, {
     "update:modelValue": (...args: any[]) => void;
 }, string, import('../../../../vue/dist/vue.esm-bundler.js').PublicProps, Readonly<import('../../../../vue/dist/vue.esm-bundler.js').ExtractPropTypes<{
@@ -26,11 +30,16 @@ declare const _default: import('../../../../vue/dist/vue.esm-bundler.js').Define
         type: StringConstructor;
         default: string;
     };
+    allowFullscreen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
     modelValue: string;
     disabled: boolean;
     iconBasePath: string;
+    allowFullscreen: boolean;
 }, {}, {}, {}, string, import('../../../../vue/dist/vue.esm-bundler.js').ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/components/molecules/rte-editor/rte-editor.vue.js

@@ -1,7 +1,7 @@
-import { defineComponent as w, ref as f, shallowRef as p, onMounted as S, onBeforeUnmount as M, watch as V, openBlock as b, createBlock as c, Teleport as E, createElementVNode as l, normalizeClass as u, createElementBlock as h, createVNode as i, createCommentVNode as U, resolveDynamicComponent as R } from "vue";
+import { defineComponent as S, ref as f, shallowRef as p, onMounted as M, onBeforeUnmount as V, watch as E, openBlock as u, createBlock as c, Teleport as U, createElementVNode as l, normalizeClass as b, createElementBlock as h, createVNode as i, createCommentVNode as y, resolveDynamicComponent as F } from "vue";
 import n from "../../atoms/svg-icon/svg-icon.vue.js";
 /* empty css                                 */
-const F = {
+const R = {
   key: 0,
   class: "rte-editor__controls mb-2"
 }, I = ["disabled"], N = ["disabled"], O = { class: "btn-group" }, j = ["disabled"], z = ["disabled"], D = { class: "btn-group" }, K = { class: "dropdown" }, q = {
@@ -14,7 +14,7 @@ const F = {
   "data-bs-toggle": "dropdown",
   role: "button",
   type: "button"
-}, W = { class: "dropdown-menu" }, X = { class: "btn-group" }, Y = ["disabled"], Z = ["disabled"], _ = ["title"], it = /* @__PURE__ */ w({
+}, W = { class: "dropdown-menu" }, X = { class: "btn-group" }, Y = ["disabled"], Z = ["disabled"], _ = ["title"], it = /* @__PURE__ */ S({
   __name: "rte-editor",
   props: {
     modelValue: {
@@ -28,20 +28,24 @@ const F = {
     iconBasePath: {
       type: String,
       default: "/rte-icons-defs.svg"
+    },
+    allowFullscreen: {
+      type: Boolean,
+      default: !1
     }
   },
   emits: ["update:modelValue"],
   setup(a, { emit: k }) {
-    const g = a, y = k, v = f(!1), d = f(!1), t = p(void 0), m = p(null);
-    S(async () => {
+    const g = a, A = k, v = f(!1), d = f(!1), t = p(void 0), m = p(null);
+    M(async () => {
       const [
         { Editor: r, mergeAttributes: e },
         { EditorContent: s },
-        { default: C },
         { default: x },
         { default: L },
         { default: T },
-        { default: $ }
+        { default: $ },
+        { default: w }
       ] = await Promise.all([
         import("@tiptap/core"),
         import("@tiptap/vue-3"),
@@ -54,14 +58,14 @@ const F = {
       m.value = s, t.value = new r({
         content: g.modelValue,
         onUpdate: () => {
-          y("update:modelValue", t.value?.getHTML());
+          A("update:modelValue", t.value?.getHTML());
         },
         extensions: [
-          T.configure({
+          $.configure({
             bold: !1,
             link: !1
           }),
-          $.extend({
+          w.extend({
             addAttributes() {
               return {
                 class: {
@@ -79,11 +83,11 @@ const F = {
               return ["strong", e(this.options.HTMLAttributes, o), 0];
             }
           }),
-          x.configure({
+          L.configure({
             types: ["heading", "paragraph"]
           }),
-          C,
-          L.extend({
+          x,
+          T.extend({
             addAttributes() {
               return {
                 ...this.parent?.(),
@@ -146,16 +150,16 @@ const F = {
           })
         ]
       });
-    }), M(() => {
+    }), V(() => {
       t.value?.destroy();
-    }), V(() => g.modelValue, (r, e) => {
+    }), E(() => g.modelValue, (r, e) => {
       if (t.value) {
         if (t.value.getHTML() === r)
           return;
         t.value.commands.setContent(r);
       }
     });
-    function A() {
+    function B() {
       const r = t.value?.getAttributes("link").href, e = window.prompt("URL", r);
       if (e !== null) {
         if (e === "") {
@@ -169,23 +173,23 @@ const F = {
         }
       }
     }
-    const B = () => {
+    const P = () => {
       t.value?.commands.setContent(`<textarea>${t.value.getHTML()}</textarea>`), v.value = !0;
-    }, P = () => {
+    }, C = () => {
       t.value?.commands.setContent(t.value.getText()), v.value = !1;
     };
-    return (r, e) => (b(), c(E, {
+    return (r, e) => (u(), c(U, {
       to: "body",
       disabled: !d.value
     }, [
       l("div", {
-        class: u(["rte-editor", { "rte-editor--fullscreen": d.value }])
+        class: b(["rte-editor", { "rte-editor--fullscreen": d.value }])
       }, [
-        t.value ? (b(), h("div", F, [
-          v.value ? (b(), h("button", {
+        t.value ? (u(), h("div", R, [
+          v.value ? (u(), h("button", {
             key: 1,
             class: "btn btn-sm btn-light is-active",
-            onClick: P,
+            onClick: C,
             disabled: !t.value.can().chain().focus().toggleCode().run(),
             title: "Toggle Source"
           }, [
@@ -193,10 +197,10 @@ const F = {
               symbol: "source",
               "base-path": a.iconBasePath
             }, null, 8, ["base-path"])
-          ], 8, N)) : (b(), h("button", {
+          ], 8, N)) : (u(), h("button", {
             key: 0,
-            class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("code") }]),
-            onClick: B,
+            class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("code") }]),
+            onClick: P,
             disabled: !t.value.can().chain().focus().toggleCode().run(),
             title: "Toggle Source"
           }, [
@@ -207,7 +211,7 @@ const F = {
           ], 10, I)),
           l("div", O, [
             l("button", {
-              class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("bold") }]),
+              class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("bold") }]),
               onClick: e[0] || (e[0] = (s) => t.value?.chain().focus().toggleBold().run()),
               disabled: !t.value.can().chain().focus().toggleBold().run(),
               title: "Toggle Bold"
@@ -218,7 +222,7 @@ const F = {
               }, null, 8, ["base-path"])
             ], 10, j),
             l("button", {
-              class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("italic") }]),
+              class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("italic") }]),
               onClick: e[1] || (e[1] = (s) => t.value?.chain().focus().toggleItalic().run()),
               disabled: !t.value.can().chain().focus().toggleItalic().run(),
               title: "Toggle Italic"
@@ -232,23 +236,23 @@ const F = {
           l("div", D, [
             l("div", K, [
               l("button", q, [
-                t.value.isActive("heading", { level: 1 }) ? (b(), c(n, {
+                t.value.isActive("heading", { level: 1 }) ? (u(), c(n, {
                   key: 0,
                   symbol: "h1",
                   "base-path": a.iconBasePath
-                }, null, 8, ["base-path"])) : t.value.isActive("heading", { level: 2 }) ? (b(), c(n, {
+                }, null, 8, ["base-path"])) : t.value.isActive("heading", { level: 2 }) ? (u(), c(n, {
                   key: 1,
                   symbol: "h2",
                   "base-path": a.iconBasePath
-                }, null, 8, ["base-path"])) : t.value.isActive("heading", { level: 3 }) ? (b(), c(n, {
+                }, null, 8, ["base-path"])) : t.value.isActive("heading", { level: 3 }) ? (u(), c(n, {
                   key: 2,
                   symbol: "h3",
                   "base-path": a.iconBasePath
-                }, null, 8, ["base-path"])) : t.value.isActive("heading", { level: 4 }) ? (b(), c(n, {
+                }, null, 8, ["base-path"])) : t.value.isActive("heading", { level: 4 }) ? (u(), c(n, {
                   key: 3,
                   symbol: "h4",
                   "base-path": a.iconBasePath
-                }, null, 8, ["base-path"])) : (b(), c(n, {
+                }, null, 8, ["base-path"])) : (u(), c(n, {
                   key: 4,
                   symbol: "headline",
                   "base-path": a.iconBasePath
@@ -257,7 +261,7 @@ const F = {
               l("ul", G, [
                 l("li", null, [
                   l("button", {
-                    class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 1 }) }]),
+                    class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 1 }) }]),
                     onClick: e[2] || (e[2] = (s) => t.value?.chain().focus().setHeading({ level: 1 }).run()),
                     title: "Set Heading 1"
                   }, [
@@ -269,7 +273,7 @@ const F = {
                 ]),
                 l("li", null, [
                   l("button", {
-                    class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 2 }) }]),
+                    class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 2 }) }]),
                     onClick: e[3] || (e[3] = (s) => t.value?.chain().focus().setHeading({ level: 2 }).run()),
                     title: "Set Heading 2"
                   }, [
@@ -281,7 +285,7 @@ const F = {
                 ]),
                 l("li", null, [
                   l("button", {
-                    class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 3 }) }]),
+                    class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 3 }) }]),
                     onClick: e[4] || (e[4] = (s) => t.value?.chain().focus().setHeading({ level: 3 }).run()),
                     title: "Set Heading 3"
                   }, [
@@ -293,7 +297,7 @@ const F = {
                 ]),
                 l("li", null, [
                   l("button", {
-                    class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 4 }) }]),
+                    class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("heading", { level: 4 }) }]),
                     onClick: e[5] || (e[5] = (s) => t.value?.chain().focus().setHeading({ level: 4 }).run()),
                     title: "Set Heading 4"
                   }, [
@@ -306,7 +310,7 @@ const F = {
               ])
             ]),
             l("button", {
-              class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("paragraph") }]),
+              class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("paragraph") }]),
               onClick: e[6] || (e[6] = (s) => t.value?.chain().focus().setParagraph().run()),
               title: "Set Paragraph"
             }, [
@@ -316,7 +320,7 @@ const F = {
               }, null, 8, ["base-path"])
             ], 2),
             l("button", {
-              class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("bulletList") }]),
+              class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("bulletList") }]),
               onClick: e[7] || (e[7] = (s) => t.value?.chain().focus().toggleBulletList().run()),
               title: "Toggle Bullet List"
             }, [
@@ -326,7 +330,7 @@ const F = {
               }, null, 8, ["base-path"])
             ], 2),
             l("button", {
-              class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("orderedList") }]),
+              class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("orderedList") }]),
               onClick: e[8] || (e[8] = (s) => t.value?.chain().focus().toggleOrderedList().run()),
               title: "Toggle Ordered List"
             }, [
@@ -338,19 +342,19 @@ const F = {
           ]),
           l("div", J, [
             l("button", Q, [
-              t.value.isActive({ textAlign: "center" }) ? (b(), c(n, {
+              t.value.isActive({ textAlign: "center" }) ? (u(), c(n, {
                 key: 0,
                 symbol: "align-center",
                 "base-path": a.iconBasePath
-              }, null, 8, ["base-path"])) : t.value.isActive({ textAlign: "left" }) ? (b(), c(n, {
+              }, null, 8, ["base-path"])) : t.value.isActive({ textAlign: "left" }) ? (u(), c(n, {
                 key: 1,
                 symbol: "align-left",
                 "base-path": a.iconBasePath
-              }, null, 8, ["base-path"])) : t.value.isActive({ textAlign: "right" }) ? (b(), c(n, {
+              }, null, 8, ["base-path"])) : t.value.isActive({ textAlign: "right" }) ? (u(), c(n, {
                 key: 2,
                 symbol: "align-right",
                 "base-path": a.iconBasePath
-              }, null, 8, ["base-path"])) : (b(), c(n, {
+              }, null, 8, ["base-path"])) : (u(), c(n, {
                 key: 3,
                 symbol: "align-justify",
                 "base-path": a.iconBasePath
@@ -359,7 +363,7 @@ const F = {
             l("ul", W, [
               l("li", null, [
                 l("button", {
-                  class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "left" }) }]),
+                  class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "left" }) }]),
                   onClick: e[9] || (e[9] = (s) => t.value?.chain().focus().setTextAlign("left").run())
                 }, [
                   i(n, {
@@ -370,7 +374,7 @@ const F = {
               ]),
               l("li", null, [
                 l("button", {
-                  class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "center" }) }]),
+                  class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "center" }) }]),
                   onClick: e[10] || (e[10] = (s) => t.value?.chain().focus().setTextAlign("center").run())
                 }, [
                   i(n, {
@@ -381,7 +385,7 @@ const F = {
               ]),
               l("li", null, [
                 l("button", {
-                  class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "right" }) }]),
+                  class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "right" }) }]),
                   onClick: e[11] || (e[11] = (s) => t.value?.chain().focus().setTextAlign("right").run())
                 }, [
                   i(n, {
@@ -392,7 +396,7 @@ const F = {
               ]),
               l("li", null, [
                 l("button", {
-                  class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "pretty" }) }]),
+                  class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive({ textAlign: "pretty" }) }]),
                   onClick: e[12] || (e[12] = (s) => t.value?.chain().focus().setTextAlign("right").run())
                 }, [
                   i(n, {
@@ -403,9 +407,9 @@ const F = {
               ])
             ])
           ]),
-          t.value.isActive("link") ? (b(), h("button", {
+          t.value.isActive("link") ? (u(), h("button", {
             key: 3,
-            class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("link") }]),
+            class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("link") }]),
             onClick: e[13] || (e[13] = (s) => t.value.chain().focus().unsetLink().run()),
             title: "Unset Link"
           }, [
@@ -413,10 +417,10 @@ const F = {
               symbol: "unlink",
               "base-path": a.iconBasePath
             }, null, 8, ["base-path"])
-          ], 2)) : (b(), h("button", {
+          ], 2)) : (u(), h("button", {
             key: 2,
-            class: u(["btn btn-sm btn-light", { "is-active": t.value.isActive("link") }]),
-            onClick: A,
+            class: b(["btn btn-sm btn-light", { "is-active": t.value.isActive("link") }]),
+            onClick: B,
             title: "Set Link"
           }, [
             i(n, {
@@ -448,7 +452,8 @@ const F = {
               }, null, 8, ["base-path"])
             ], 8, Z)
           ]),
-          l("button", {
+          a.allowFullscreen ? (u(), h("button", {
+            key: 4,
             class: "btn btn-sm btn-light ms-auto",
             onClick: e[16] || (e[16] = (s) => d.value = !d.value),
             title: d.value ? "Exit Fullscreen" : "Fullscreen"
@@ -457,9 +462,9 @@ const F = {
               symbol: d.value ? "close" : "maximize",
               "base-path": a.iconBasePath
             }, null, 8, ["symbol", "base-path"])
-          ], 8, _)
-        ])) : U("", !0),
-        (b(), c(R(m.value), {
+          ], 8, _)) : y("", !0)
+        ])) : y("", !0),
+        (u(), c(F(m.value), {
           class: "rte-editor__content",
           editor: t.value
         }, null, 8, ["editor"]))

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ablok-components",
   "private": false,
-  "version": "0.3.60",
+  "version": "0.3.61",
   "dependencies": {
     "date-fns": "^3.0.0",
     "dompurify": "^3.3.1",