@poveste/plugin-vue 0.1.0

package/dist/bundled/client/app/auto-props.js

@@ -0,0 +1,66 @@
+import { applyState as c } from "@poveste/shared";
+import { getTagName as m } from "../codegen.js";
+function b(t, o, e, p) {
+  const r = h(o, e), i = JSON.stringify(r);
+  return (!p || p !== i) && (c(t.state, {
+    _hPropDefs: r
+  }), t.state._hPropState || c(t.state, {
+    _hPropState: {}
+  })), i;
+}
+function h(t, o) {
+  const e = [];
+  return y(t, o, {
+    index: 0
+  }, e), e.filter((r) => r.props.length);
+}
+function y(t, o, e, p) {
+  for (const r of l(t))
+    if (r) {
+      if (typeof r.type == "object") {
+        const i = e.index++, a = [];
+        for (const s in r.type.props) {
+          const n = r.type.props[s];
+          let u, f;
+          n && (u = (Array.isArray(n.type) ? n.type : typeof n == "function" ? [n] : [n.type]).map((d) => {
+            switch (d) {
+              case String:
+                return "string";
+              case Number:
+                return "number";
+              case Boolean:
+                return "boolean";
+              case Object:
+                return "object";
+              case Array:
+                return "array";
+              default:
+                return "unknown";
+            }
+          }), f = typeof n.default == "function" ? n.default.toString() : n.default), a.push({
+            name: s,
+            types: u,
+            required: n?.required,
+            default: f
+          }), o?._hPropState?.[i]?.[s] != null && (r.props || (r.props = {}), r.props[s] = o._hPropState[i][s], r.dynamicProps || (r.dynamicProps = []), r.dynamicProps.includes(s) || r.dynamicProps.push(s));
+        }
+        p.push({
+          name: m(r),
+          index: i,
+          props: a
+        });
+      }
+      Array.isArray(r.children) && y(r.children, o, e, p);
+    }
+}
+function l(t) {
+  if (!Array.isArray(t))
+    return t == null ? [] : [t];
+  const o = [];
+  for (const e of t)
+    Array.isArray(e) ? o.push(...l(e)) : e != null && o.push(e);
+  return o;
+}
+export {
+  b as syncVariantAutoProps
+};

package/dist/bundled/client/app/global-components.js

@@ -0,0 +1,81 @@
+import { components as v } from "@poveste/controls";
+import { reactive as y, createApp as E, h as C } from "@poveste/vendors/vue";
+import { defineComponent as g, h as u, ref as d, onBeforeUpdate as $, onMounted as w, onUpdated as U, onBeforeUnmount as b } from "vue";
+import k from "./Story.js";
+import q from "./Variant.js";
+function M(e) {
+  e.component("Story", k), e.component("Variant", q);
+  for (const o in v)
+    e.component(o, A(v[o]));
+}
+function A(e) {
+  return g({
+    name: e.name,
+    inheritAttrs: !1,
+    setup(o, { attrs: n }) {
+      const a = d(), p = d(), m = y({});
+      function c(l) {
+        Object.assign(m, l);
+      }
+      c(n), $(() => {
+        c(n);
+      });
+      let t = [];
+      const r = d([]);
+      function S() {
+        r.value.forEach((l, f) => {
+          const h = p.value.querySelector(`[renderslotid="${f}"]`);
+          if (!h) return;
+          const s = a.value.querySelector(`[slotid="${f}"]`);
+          for (; s.firstChild; )
+            s.removeChild(s.lastChild);
+          s.appendChild(h);
+        });
+      }
+      let i;
+      return w(() => {
+        i = E({
+          mounted() {
+            r.value = t, t = [];
+          },
+          updated() {
+            r.value = t, t = [];
+          },
+          render() {
+            return C(e, {
+              ...m,
+              key: "component"
+            }, {
+              default: (l) => (t.push(l), C("div", {
+                slotId: t.length - 1
+              }))
+            });
+          }
+        }), i.mount(a.value);
+      }), U(() => {
+        S();
+      }), b(() => {
+        i.unmount();
+      }), {
+        el: a,
+        slotEl: p,
+        slotCalls: r
+      };
+    },
+    render() {
+      return [
+        u("div", {
+          ref: "el"
+        }),
+        u("div", {
+          ref: "slotEl"
+        }, this.slotCalls.map((o, n) => u("div", {
+          renderSlotId: n
+        }, this.$slots.default(o))))
+      ];
+    }
+  });
+}
+export {
+  M as registerGlobalComponents
+};

package/dist/bundled/client/app/host.js

@@ -0,0 +1,84 @@
+import * as a from "virtual:$histoire-generated-global-setup";
+import * as i from "virtual:$histoire-setup";
+import { defineComponent as l, h as o, createApp as y, Suspense as v } from "vue";
+import { registerGlobalComponents as w } from "./global-components.js";
+import { provideRenderContext as C } from "./render-context.js";
+import { RouterLinkStub as g } from "./RouterLinkStub.js";
+const x = l({
+  name: "PreviewHostRoot",
+  props: {
+    story: {
+      type: Object,
+      required: !0
+    },
+    renderContext: {
+      type: Object,
+      required: !0
+    }
+  },
+  setup(e) {
+    return C(e.renderContext), () => o(e.story.file.component, {
+      story: e.story
+    });
+  }
+});
+function H(e) {
+  let t = null, r = null;
+  async function p() {
+    const u = [];
+    r = document.createElement("div"), e.el.appendChild(r), t = y({
+      name: e.name,
+      render: () => {
+        let n = o(x, {
+          story: e.getStory(),
+          renderContext: e.renderContext
+        });
+        for (const m of u) {
+          const d = n;
+          n = o(m, {
+            story: e.getStory(),
+            variant: e.getVariant()
+          }, () => d);
+        }
+        return e.wrapInDiv && (n = o("div", n)), o(v, {}, n);
+      }
+    }), w(t), t.component("RouterLink", g);
+    const f = {
+      app: t,
+      story: e.getStory(),
+      variant: e.getVariant(),
+      addWrapper: (n) => {
+        u.unshift(n);
+      }
+    };
+    await S(f), t.mount(r);
+  }
+  function c() {
+    t?.unmount(), t = null, r && (r.parentNode?.removeChild(r), r = null);
+  }
+  function s() {
+    t?._instance?.proxy?.$forceUpdate();
+  }
+  return {
+    mount: p,
+    unmount: c,
+    forceUpdate: s
+  };
+}
+async function S(e) {
+  if (typeof a?.setupVue3 == "function") {
+    const t = a.setupVue3;
+    await t(e);
+  }
+  if (typeof i?.setupVue3 == "function") {
+    const t = i.setupVue3;
+    await t(e);
+  }
+  if (typeof e.variant?.setupApp == "function") {
+    const t = e.variant.setupApp;
+    await t(e);
+  }
+}
+export {
+  H as createPreviewHost
+};

package/dist/bundled/client/app/index.js

@@ -0,0 +1,6 @@
+import { default as e } from "./MountStory.js";
+import { default as a } from "./RenderStory.js";
+export {
+  e as MountStory,
+  a as RenderStory
+};

package/dist/bundled/client/app/render-context.js

@@ -0,0 +1,12 @@
+import { provide as n, inject as r } from "vue";
+const e = /* @__PURE__ */ Symbol("histoire-preview-render-context");
+function i(t) {
+  n(e, t);
+}
+function c() {
+  return r(e, null);
+}
+export {
+  i as provideRenderContext,
+  c as useRenderContext
+};

package/dist/bundled/client/app/util.js

@@ -0,0 +1,70 @@
+import { applyState as f } from "@poveste/shared";
+import { isRef as c, unref as p, watch as l } from "@poveste/vendors/vue";
+import { isRef as m, unref as w, watch as y } from "vue";
+const i = (n) => n !== null && typeof n == "object";
+function o(n, e = /* @__PURE__ */ new WeakMap()) {
+  const t = m(n) ? w(n) : n;
+  if (typeof t == "symbol")
+    return t.toString();
+  if (!i(t))
+    return t;
+  if (e.has(t))
+    return e.get(t);
+  if (Array.isArray(t)) {
+    const r = [];
+    return e.set(t, r), r.push(...t.map((u) => o(u, e))), r;
+  } else {
+    const r = {};
+    return e.set(t, r), h(t, r, e), r;
+  }
+}
+function h(n, e, t = /* @__PURE__ */ new WeakMap()) {
+  Object.keys(n).forEach((r) => {
+    e[r] = o(n[r], t);
+  });
+}
+function a(n, e = /* @__PURE__ */ new WeakMap()) {
+  const t = c(n) ? p(n) : n;
+  if (typeof t == "symbol")
+    return t.toString();
+  if (!i(t))
+    return t;
+  if (e.has(t))
+    return e.get(t);
+  if (Array.isArray(t)) {
+    const r = [];
+    return e.set(t, r), r.push(...t.map((u) => a(u, e))), r;
+  } else {
+    const r = {};
+    return e.set(t, r), d(t, r, e), r;
+  }
+}
+function d(n, e, t = /* @__PURE__ */ new WeakMap()) {
+  Object.keys(n).forEach((r) => {
+    e[r] = o(n[r], t);
+  });
+}
+function A(n, e) {
+  let t = !1;
+  const r = l(() => n, (s) => {
+    s != null && (t ? t = !1 : (t = !0, f(e, a(s))));
+  }, {
+    deep: !0,
+    immediate: !0
+  }), u = y(() => e, (s) => {
+    s != null && (t ? t = !1 : (t = !0, f(n, o(s))));
+  }, {
+    deep: !0,
+    immediate: !0
+  });
+  return {
+    stop() {
+      r(), u();
+    }
+  };
+}
+export {
+  a as _toRawDeep,
+  A as syncStateBundledAndExternal,
+  o as toRawDeep
+};

package/dist/bundled/client/client.js

@@ -0,0 +1,10 @@
+import "./app/index.js";
+import { generateSourceCode as o, getTagName as a } from "./codegen.js";
+import { default as m } from "./app/MountStory.js";
+import { default as d } from "./app/RenderStory.js";
+export {
+  m as MountStory,
+  d as RenderStory,
+  o as generateSourceCode,
+  a as getTagName
+};

package/dist/bundled/client/codegen.js

@@ -0,0 +1,196 @@
+import { createAutoBuildingObject as K, indent as _, voidElements as N, serializeJs as P } from "@poveste/shared";
+import { camelCase as M, pascalCase as U } from "../node_modules/.pnpm/change-case@5.4.4/node_modules/change-case/dist/index.js";
+import { Text as W, vModelText as z, vModelSelect as D, vModelRadio as F, vModelCheckbox as E, vModelDynamic as J } from "vue";
+async function I(t) {
+  const o = t.slots().default?.({ state: t.state ?? {} }) ?? [], a = Array.isArray(o) ? o : [o], b = [];
+  for (const L in a) {
+    const g = a[L];
+    b.push(...(await x(g, t.state?._hPropState?.[L])).lines);
+  }
+  return b.join(`
+`);
+}
+async function x(t, o = null) {
+  if (t.type === W)
+    return {
+      // @ts-expect-error TODO
+      lines: [t.children],
+      isText: !0
+    };
+  const a = [];
+  if (typeof t.type == "object" || typeof t.type == "string") {
+    let g = function(e, s, i = null) {
+      let n = "";
+      for (const y in s.modifiers)
+        s.modifiers[y] && (n += `.${y}`);
+      let u = "";
+      s.arg && (u = `:${s.arg}`), i && (i = i.replace(/^\$(setup|props|data)\./g, ""));
+      const r = i ? [i] : V(s.value), l = [], f = `v-${e}${u}${n}="`;
+      r.length > 1 ? (l.push(`${f}${r[0]}`), l.push(...r.slice(1, r.length - 1)), l.push(`${r[r.length - 1]}"`), $ = !0) : l.push(`${f}${r[0] ?? ""}"`), p.push(l);
+    }, S = function(e, s) {
+      if (typeof s != "string" || t.dynamicProps?.includes(e)) {
+        let i = ":";
+        e.startsWith("on") && (i = "@");
+        const n = i === "@" ? `${e[2].toLowerCase()}${e.slice(3)}` : e, r = [`onUpdate:${e}`, `onUpdate:${M(e)}`].find((f) => t.dynamicProps?.includes(f) || t.props && f in t.props);
+        if (i === ":" && r) {
+          m.push(r);
+          const y = t.props[r].toString();
+          let C;
+          const w = /\(\$event\) => (.*?) = \$event/.exec(y);
+          w && (C = w[1]);
+          const T = `${e === "modelValue" ? "model" : e}Modifiers`, B = t.props[T] ?? {};
+          m.push(T), g("model", {
+            arg: e === "modelValue" ? null : e,
+            modifiers: B,
+            value: s
+          }, C);
+          return;
+        }
+        if (typeof s > "u")
+          return;
+        let l;
+        if (typeof s == "string" && s.startsWith("{{") && s.endsWith("}}"))
+          l = A(s.substring(2, s.length - 2).trim()).split(`
+`);
+        else if (typeof s == "function") {
+          let f = A(s.toString().replace(/'/g, "\\'").replace(/"/g, "'"));
+          const y = /function (\S+)\(/.exec(f);
+          y ? l = [y[1]] : (f.startsWith("($event) => ") && (f = f.substring(12)), l = f.split(`
+`));
+        } else
+          l = V(s);
+        if (l.length > 1) {
+          $ = !0;
+          const f = [`${i}${n}="${l[0]}`];
+          f.push(...l.slice(1, l.length - 1)), f.push(`${l[l.length - 1]}"`), p.push(f);
+        } else
+          p.push([`${i}${n}="${l[0]}"`]);
+      } else t.type?.props?.[e]?.type === Boolean ? p.push([e]) : p.push([`${e}="${s}"`]);
+    };
+    var b = g, L = S;
+    t.type?.__asyncLoader && !t.type.__asyncResolved && await t.type.__asyncLoader();
+    const p = [];
+    let $ = !1;
+    const m = [
+      "key"
+    ];
+    if (t.dirs) {
+      for (const e of t.dirs)
+        if (e.dir === z || e.dir === D || e.dir === F || e.dir === E || e.dir === J) {
+          const i = [`onUpdate:${e.arg ?? "modelValue"}`, `onUpdate:${M(e.arg ?? "modelValue")}`].find((r) => t.props[r]), n = t.props[i];
+          let u = null;
+          if (n) {
+            m.push(i);
+            const r = n.toString(), l = /\(\$event\) => (.*?) = \$event/.exec(r);
+            l && (u = l[1]);
+          }
+          g("model", e, u);
+        } else if (e.instance._ || e.instance.$) {
+          const s = e.instance.$ ?? e.instance._;
+          let i;
+          for (const n of [s.directives, s.appContext.directives]) {
+            for (const u in n)
+              if (n[u] === e.dir) {
+                i = u;
+                break;
+              }
+            if (i) break;
+          }
+          if (!i) {
+            for (const n in s.setupState)
+              if (s.setupState[n] === e.dir) {
+                i = n.replace(/^v(\w)/, (u, r) => r.toLowerCase());
+                break;
+              }
+          }
+          i && g(i, e);
+        }
+    }
+    for (const e in t.props) {
+      if (m.includes(e) || o && e in o)
+        continue;
+      const s = t.props[e];
+      S(e, s);
+    }
+    if (o)
+      for (const e in o)
+        S(e, o[e]);
+    p.length > 1 && ($ = !0);
+    const d = O(t);
+    let j = !1;
+    const c = [];
+    if (typeof t.children == "string")
+      d === "pre" ? c.push(t.children) : c.push(...t.children.split(`
+`)), j = !0;
+    else if (Array.isArray(t.children)) {
+      let e;
+      for (const s of t.children) {
+        const i = await x(s);
+        if (i.isText) {
+          e === void 0 && (e = !0);
+          const n = i.lines[0];
+          !c.length || /^\s/.test(n) ? c.push(n.trim()) : c[c.length - 1] += n;
+        } else
+          e === void 0 && (e = !1), c.push(...i.lines);
+      }
+      e !== void 0 && (j = e);
+    }
+    if (t.children && typeof t.children == "object" && !Array.isArray(t.children)) {
+      for (const e in t.children)
+        if (typeof t.children[e] == "function") {
+          const s = K((r) => `{{ ${r} }}`, (r, l) => {
+            if (l === "__v_isRef")
+              return () => !1;
+          }), i = t.children[e](s.proxy), n = [];
+          for (const r of i)
+            n.push(...(await x(r)).lines);
+          const u = Object.keys(s.cache);
+          u.length ? (c.push(`<template #${e}="{ ${u.join(", ")} }">`), c.push(..._(n)), c.push("</template>")) : e === "default" ? c.push(...n) : (c.push(`<template #${e}>`), c.push(..._(n)), c.push("</template>"));
+        }
+    }
+    const h = [`<${d}`];
+    if ($) {
+      for (const e of p)
+        h.push(..._(e));
+      c.length > 0 && h.push(">");
+    } else
+      p.length === 1 && (h[0] += ` ${p[0]}`), c.length > 0 && (h[0] += ">");
+    const k = N.includes(d.toLowerCase());
+    c.length > 0 ? c.length === 1 && h.length === 1 && !p.length && j ? a.push(`${h[0]}${c[0]}</${d}>`) : (a.push(...h), a.push(..._(c)), a.push(`</${d}>`)) : h.length > 1 ? (a.push(...h), a.push(k ? ">" : "/>")) : a.push(`${h[0]}${k ? "" : " /"}>`);
+  } else if (t?.shapeFlag & 16)
+    for (const g of t.children)
+      a.push(...(await x(g)).lines);
+  return {
+    lines: a
+  };
+}
+function O(t) {
+  if (typeof t.type == "string")
+    return t.type;
+  if (t.type?.__asyncResolved) {
+    const o = t.type?.__asyncResolved;
+    return o.name ?? R(o.__file);
+  } else {
+    if (t.type?.name)
+      return t.type.name;
+    if (t.type?.__file)
+      return R(t.type.__file);
+  }
+  return "Anonymous";
+}
+function R(t) {
+  const o = /([^/]+)\.vue$/.exec(t);
+  return o ? U(o[1]) : "Anonymous";
+}
+function V(t) {
+  const o = !!t?.__autoBuildingObject, a = P(t);
+  return o ? [A(a.__autoBuildingObjectGetKey)] : A(a).split(`
+`);
+}
+function A(t) {
+  return t.replace(/\$setup\./g, "");
+}
+export {
+  I as generateSourceCode,
+  O as getTagName
+};

package/dist/bundled/client/server/Story.js

@@ -0,0 +1,79 @@
+import { defineComponent as i, useAttrs as n, inject as d, provide as r, onMounted as l } from "vue";
+import { autoStubComponents as u } from "./stub.js";
+const c = i({
+  name: "PovesteStory",
+  inheritAttrs: !1,
+  props: {
+    title: {
+      type: String,
+      default: void 0
+    },
+    id: {
+      type: String,
+      default: void 0
+    },
+    group: {
+      type: String,
+      default: void 0
+    },
+    layout: {
+      type: Object,
+      default: void 0
+    },
+    icon: {
+      type: String,
+      default: void 0
+    },
+    iconColor: {
+      type: String,
+      default: void 0
+    },
+    docsOnly: {
+      type: Boolean,
+      default: !1
+    },
+    meta: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(t) {
+    const e = n(), o = {
+      id: t.id ?? e.data.id,
+      title: t.title ?? e.data.fileName,
+      group: t.group,
+      layout: t.layout,
+      icon: t.icon,
+      iconColor: t.iconColor,
+      docsOnly: t.docsOnly,
+      meta: t.meta,
+      variants: []
+    };
+    return d("addStory", null)?.(o), r("story", o), r("addVariant", (a) => {
+      o.variants.push(a);
+    }), l(() => {
+      o.variants.length || o.variants.push({
+        id: "_default",
+        title: "default"
+      });
+    }), {
+      story: o
+    };
+  },
+  render() {
+    let t = !1;
+    try {
+      const e = this.$slots.default?.({
+        get state() {
+          return t = !0, {};
+        }
+      });
+      return Array.isArray(e) && u(e), e;
+    } catch (e) {
+      return t || console.error(e), null;
+    }
+  }
+});
+export {
+  c as default
+};

package/dist/bundled/client/server/Variant.js

@@ -0,0 +1,46 @@
+import { defineComponent as o, inject as n } from "vue";
+const l = o({
+  name: "PovesteVariant",
+  props: {
+    title: {
+      type: String,
+      default: "untitled"
+    },
+    id: {
+      type: String,
+      default: void 0
+    },
+    icon: {
+      type: String,
+      default: void 0
+    },
+    iconColor: {
+      type: String,
+      default: void 0
+    },
+    meta: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(t) {
+    const e = n("story");
+    function i() {
+      return `${e.id}-${e.variants.length}`;
+    }
+    const a = {
+      id: t.id ?? i(),
+      title: t.title,
+      icon: t.icon,
+      iconColor: t.iconColor,
+      meta: t.meta
+    };
+    n("addVariant")(a);
+  },
+  render() {
+    return null;
+  }
+});
+export {
+  l as default
+};