@alvarosabu/storyblok-richtext-vue-renderer - npm Package Compare versions

Comparing version 0.0.1 to 0.1.0

dist/index.d.ts

 import type { RendererElement, RendererNode, VNode } from 'vue';
 import { h } from 'vue';
+import SbRickText from './components/SbRichText.vue';
 export declare enum BlockTypes {
@@ -76,1 +77,2 @@ DOCUMENT = "doc",
 };
+export { SbRickText };

dist/sb-vue-rich-text-renderer.js

@@ -1,71 +0,84 @@
-import { getCurrentInstance as S, h as i, createTextVNode as t, resolveDynamicComponent as O } from "vue";
-var L = /* @__PURE__ */ ((n) => (n.DOCUMENT = "doc", n.HEADING = "heading", n.PARAGRAPH = "paragraph", n.QUOTE = "blockquote", n.OL_LIST = "ordered_list", n.UL_LIST = "bullet_list", n.LIST_ITEM = "list_item", n.CODE_BLOCK = "code_block", n.HR = "horizontal_rule", n.BR = "hard_break", n.IMAGE = "image", n.EMOJI = "emoji", n.COMPONENT = "blok", n))(L || {}), N = /* @__PURE__ */ ((n) => (n.BOLD = "bold", n.STRONG = "strong", n.STRIKE = "strike", n.UNDERLINE = "underline", n.ITALIC = "italic", n.CODE = "code", n.LINK = "link", n.ANCHOR = "anchor", n.STYLED = "styled", n.SUPERSCRIPT = "superscript", n.SUBSCRIPT = "subscript", n.TEXT_STYLE = "textStyle", n.HIGHLIGHT = "highlight", n))(N || {}), C = /* @__PURE__ */ ((n) => (n.TEXT = "text", n))(C || {}), A = /* @__PURE__ */ ((n) => (n.COMPONENT = "blok", n))(A || {}), x = /* @__PURE__ */ ((n) => (n.SELF = "_self", n.BLANK = "_blank", n))(x || {}), p = /* @__PURE__ */ ((n) => (n.URL = "url", n.STORY = "story", n.ASSET = "asset", n.EMAIL = "email", n))(p || {});
-function w(n = {
+import { defineComponent as S, openBlock as I, createBlock as p, getCurrentInstance as O, h as r, createTextVNode as L, resolveDynamicComponent as N } from "vue";
+const q = /* @__PURE__ */ S({
+  __name: "SbRichText",
+  props: {
+    doc: {},
+    resolvers: {}
+  },
+  setup(n) {
+    const d = n, { render: h } = U({
+      resolvers: d.resolvers
+    }), l = () => h(d.doc);
+    return (b, m) => (I(), p(l));
+  }
+});
+var x = /* @__PURE__ */ ((n) => (n.DOCUMENT = "doc", n.HEADING = "heading", n.PARAGRAPH = "paragraph", n.QUOTE = "blockquote", n.OL_LIST = "ordered_list", n.UL_LIST = "bullet_list", n.LIST_ITEM = "list_item", n.CODE_BLOCK = "code_block", n.HR = "horizontal_rule", n.BR = "hard_break", n.IMAGE = "image", n.EMOJI = "emoji", n.COMPONENT = "blok", n))(x || {}), C = /* @__PURE__ */ ((n) => (n.BOLD = "bold", n.STRONG = "strong", n.STRIKE = "strike", n.UNDERLINE = "underline", n.ITALIC = "italic", n.CODE = "code", n.LINK = "link", n.ANCHOR = "anchor", n.STYLED = "styled", n.SUPERSCRIPT = "superscript", n.SUBSCRIPT = "subscript", n.TEXT_STYLE = "textStyle", n.HIGHLIGHT = "highlight", n))(C || {}), A = /* @__PURE__ */ ((n) => (n.TEXT = "text", n))(A || {}), D = /* @__PURE__ */ ((n) => (n.COMPONENT = "blok", n))(D || {}), H = /* @__PURE__ */ ((n) => (n.SELF = "_self", n.BLANK = "_blank", n))(H || {}), P = /* @__PURE__ */ ((n) => (n.URL = "url", n.STORY = "story", n.ASSET = "asset", n.EMAIL = "email", n))(P || {});
+function U(n = {
   resolvers: []
 }) {
-  var m;
-  const { resolvers: v = {} } = n, h = (m = S()) == null ? void 0 : m.appContext.components, u = (o) => ({ children: e, attrs: r }) => i(o, r, e), R = ({ marks: o, ...e }) => {
+  var _;
+  const { resolvers: d = {} } = n, h = (_ = O()) == null ? void 0 : _.appContext.components, l = (o) => ({ children: e, attrs: i }) => r(o, i, e), b = ({ marks: o, ...e }) => {
     if ("text" in e)
       return o ? o.reduce(
-        (r, c) => d({ ...c, text: r }),
-        d(e)
-      ) : t(e.text);
-  }, g = ({ children: o, attrs: e }) => i(`h${e == null ? void 0 : e.level}`, e, o), l = (o) => ({ text: e, attrs: r }) => i(o, r, e), E = ({ attrs: o, children: e }) => {
-    const { component: r, file: c, _preview: D, preview: H, _editable: P, ...I } = o == null ? void 0 : o.body[0];
-    return h ? i(h[o == null ? void 0 : o.body[0].component], {
+        (i, u) => t({ ...u, text: i }),
+        t(e)
+      ) : L(e.text);
+  }, m = ({ children: o, attrs: e }) => r(`h${e == null ? void 0 : e.level}`, e, o), c = (o) => ({ text: e, attrs: i }) => r(o, i, e), R = ({ attrs: o, children: e }) => {
+    const { component: i, file: u, _preview: w, preview: G, _editable: K, ...f } = o == null ? void 0 : o.body[0];
+    return h ? r(h[o == null ? void 0 : o.body[0].component], {
       id: o == null ? void 0 : o.id,
-      blok: I
-    }, e) : i("div", {}, e);
-  }, _ = ({ text: o, attrs: e }) => {
-    let r = "";
+      blok: f
+    }, e) : r("div", {}, e);
+  }, g = ({ text: o, attrs: e }) => {
+    let i = "";
     switch (e == null ? void 0 : e.linktype) {
       case "asset":
       case "url":
-        r = e == null ? void 0 : e.href;
+        i = e == null ? void 0 : e.href;
         break;
       case "email":
-        r = `mailto:${e == null ? void 0 : e.href}`;
+        i = `mailto:${e == null ? void 0 : e.href}`;
         break;
       case "story": {
-        const c = O("RouterLink");
-        return c ? i(
-          c,
+        const u = N("RouterLink");
+        return u ? r(
+          u,
           { to: e == null ? void 0 : e.href, target: e == null ? void 0 : e.target },
           { default: () => o }
-        ) : i("a", { href: r, target: e == null ? void 0 : e.target }, o);
+        ) : r("a", { href: i, target: e == null ? void 0 : e.target }, o);
       }
     }
-    return i("a", { href: e == null ? void 0 : e.href, target: e == null ? void 0 : e.target }, o);
-  }, f = new Map([
-    ["doc", ({ children: o }) => i("div", {}, o)],
-    ["paragraph", u("p")],
-    ["heading", g],
-    ["blockquote", u("blockquote")],
-    ["bullet_list", u("ul")],
-    ["ordered_list", u("ol")],
-    ["list_item", u("li")],
-    ["image", ({ attrs: o }) => i("img", o)],
-    ["emoji", ({ attrs: o }) => i("span", o)],
-    ["code_block", ({ attrs: o, content: e }) => i("pre", o, [i("code", {}, e[0].text)])],
-    ["horizontal_rule", u("hr")],
-    ["hard_break", u("br")],
-    ["text", R],
-    ["bold", l("strong")],
-    ["italic", l("em")],
-    ["underline", l("u")],
-    ["strike", l("s")],
-    ["code", l("code")],
-    ["link", _],
-    ["anchor", ({ attrs: o = {}, children: e }) => i("a", { id: o.id }, e)],
-    ["styled", ({ attrs: o = {}, children: e }) => i(o.style, {}, e)],
-    ["superscript", l("sup")],
-    ["subscript", l("sub")],
-    ["textStyle", ({ attrs: o = {}, children: e }) => i("span", { style: o.style }, e)],
-    ["highlight", l("mark")],
-    ["blok", E],
+    return r("a", { href: e == null ? void 0 : e.href, target: e == null ? void 0 : e.target }, o);
+  }, E = new Map([
+    ["doc", ({ children: o }) => r("div", {}, o)],
+    ["paragraph", l("p")],
+    ["heading", m],
+    ["blockquote", l("blockquote")],
+    ["bullet_list", l("ul")],
+    ["ordered_list", l("ol")],
+    ["list_item", l("li")],
+    ["image", ({ attrs: o }) => r("img", o)],
+    ["emoji", ({ attrs: o }) => r("span", o)],
+    ["code_block", ({ attrs: o, content: e }) => r("pre", o, [r("code", {}, e[0].text)])],
+    ["horizontal_rule", l("hr")],
+    ["hard_break", l("br")],
+    ["text", b],
+    ["bold", c("strong")],
+    ["italic", c("em")],
+    ["underline", c("u")],
+    ["strike", c("s")],
+    ["code", c("code")],
+    ["link", g],
+    ["anchor", ({ attrs: o = {}, children: e }) => r("a", { id: o.id }, e)],
+    ["styled", ({ attrs: o = {}, children: e }) => r(o.style, {}, e)],
+    ["superscript", c("sup")],
+    ["subscript", c("sub")],
+    ["textStyle", ({ attrs: o = {}, children: e }) => r("span", { style: o.style }, e)],
+    ["highlight", c("mark")],
+    ["blok", R],
     // eslint-disable-next-line max-len
-    ...Object.entries(v).map(([o, e]) => [o, e])
+    ...Object.entries(d).map(([o, e]) => [o, e])
   ]);
-  function b(o) {
-    const e = f.get(o.type);
+  function v(o) {
+    const e = E.get(o.type);
     if (!e)
@@ -75,23 +88,24 @@ throw new Error(`No resolver found for node type ${o.type}`);
       return e(o);
-    const r = o.content ? o.content.map(d) : void 0;
+    const i = o.content ? o.content.map(t) : void 0;
     return e({
       ...o,
-      children: r
+      children: i
     });
   }
-  function d(o) {
-    return Array.isArray(o) ? o.map(b) : b(o);
+  function t(o) {
+    return Array.isArray(o) ? o.map(v) : v(o);
   }
   return {
-    render: d
+    render: t
   };
 }
 export {
-  L as BlockTypes,
-  A as ComponentTypes,
-  x as LinkTargets,
-  p as LinkTypes,
-  N as MarkTypes,
-  C as TextTypes,
-  w as useSbRichtext
+  x as BlockTypes,
+  D as ComponentTypes,
+  H as LinkTargets,
+  P as LinkTypes,
+  C as MarkTypes,
+  q as SbRickText,
+  A as TextTypes,
+  U as useSbRichtext
 };

package.json

 {
   "name": "@alvarosabu/storyblok-richtext-vue-renderer",
   "type": "module",
-  "version": "0.0.1",
+  "version": "0.1.0",
   "packageManager": "pnpm@8.10.2",
@@ -6,0 +6,0 @@ "description": "A Vue 3 renderer for Storyblok Rich Text",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

16699

increased by8.2%

Number of package files

9

increased by12.5%

Lines of code

223

increased by18.62%

No dependency changes