@poveste/plugin-vue 0.2.1 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,104 +1,90 @@
1
- import { applyState as V } from "@poveste/shared";
2
- import { defineComponent as x, useAttrs as h, getCurrentInstance as b, inject as p, computed as C, onBeforeUnmount as D } from "vue";
3
- import { syncVariantAutoProps as A } from "./auto-props.js";
4
- import { useRenderContext as P } from "./render-context.js";
5
- import { toRawDeep as g, syncStateBundledAndExternal as m } from "./util.js";
6
- const $ = x({
7
- name: "Variant",
8
- __povesteType: "variant",
9
- props: {
10
- initState: {
11
- type: Function,
12
- default: void 0
13
- },
14
- source: {
15
- type: String,
16
- default: void 0
17
- },
18
- responsiveDisabled: {
19
- type: Boolean,
20
- default: !1
21
- },
22
- autoPropsDisabled: {
23
- type: Boolean,
24
- default: !1
25
- },
26
- setupApp: {
27
- type: Function,
28
- default: void 0
29
- },
30
- meta: {
31
- type: Object,
32
- default: void 0
33
- },
34
- implicit: {
35
- type: Boolean,
36
- default: !1
37
- }
38
- },
39
- async setup(t) {
40
- const l = h(), u = b(), o = p("story"), s = p("implicitState"), e = P();
41
- let c, d, a;
42
- const r = C(() => l.variant);
43
- if (e?.mode !== "render" && typeof t.initState == "function" && r.value) {
44
- const n = await t.initState();
45
- V(r.value.state, g(n));
46
- }
47
- e?.mode !== "render" && r.value && s && m(r.value.state, s());
48
- function f(n) {
49
- Object.assign(n, {
50
- slots: () => u.proxy.$slots,
51
- source: t.source,
52
- responsiveDisabled: t.responsiveDisabled,
53
- autoPropsDisabled: t.autoPropsDisabled,
54
- setupApp: t.setupApp,
55
- meta: t.meta,
56
- configReady: !0
57
- }), !t.implicit && !o.value?.meta?.hasVariantChildComponents && (o.value.meta || (o.value.meta = {}), Object.assign(o.value.meta, {
58
- hasVariantChildComponents: !0
59
- }));
60
- }
61
- function v() {
62
- return l.variant ? l.variant : e?.mode !== "render" ? null : (d || (d = o.value?.variants[e.nextVariantIndex.value], e.nextVariantIndex.value++), d);
63
- }
64
- function y(n) {
65
- if (e.slotName === "controls")
66
- return u.proxy.$slots.controls?.({
67
- state: e.externalState
68
- }) ?? null;
69
- if (e.slotName !== "default")
70
- return null;
71
- const i = u.proxy.$slots.default?.({
72
- state: e.externalState
73
- }) ?? null;
74
- return i && !n.autoPropsDisabled && (c = A(
75
- n,
76
- i,
77
- e.externalState,
78
- c
79
- )), i;
80
- }
81
- function S(n) {
82
- if (!s)
83
- return;
84
- const i = e?.mode === "render" && e.currentVariant?.id === n.id;
85
- i && !a ? a = m(n.state, s()) : !i && a && (a.stop(), a = null);
86
- }
87
- return r.value && f(r.value), D(() => {
88
- a?.stop();
89
- }), {
90
- renderContext: e,
91
- renderVariantSlot: y,
92
- resolveVariant: v,
93
- syncRenderVariantState: S,
94
- updateVariant: f
95
- };
96
- },
97
- render() {
98
- const t = this.resolveVariant();
99
- return !t || (this.updateVariant(t), this.syncRenderVariantState(t), this.renderContext?.mode !== "render") || this.renderContext.currentVariant?.id !== t.id ? null : this.renderVariantSlot(t);
100
- }
1
+ import { useRenderContext as e } from "./render-context.js";
2
+ import { syncVariantAutoProps as t } from "./auto-props.js";
3
+ import { syncStateBundledAndExternal as n, toRawDeep as r } from "./util.js";
4
+ import { computed as i, defineComponent as a, getCurrentInstance as o, inject as s, onBeforeUnmount as c, useAttrs as l } from "vue";
5
+ import { applyState as u } from "@poveste/shared";
6
+ //#region src/client/app/Variant.ts
7
+ var d = a({
8
+ name: "Variant",
9
+ __povesteType: "variant",
10
+ props: {
11
+ initState: {
12
+ type: Function,
13
+ default: void 0
14
+ },
15
+ source: {
16
+ type: String,
17
+ default: void 0
18
+ },
19
+ responsiveDisabled: {
20
+ type: Boolean,
21
+ default: !1
22
+ },
23
+ autoPropsDisabled: {
24
+ type: Boolean,
25
+ default: !1
26
+ },
27
+ setupApp: {
28
+ type: Function,
29
+ default: void 0
30
+ },
31
+ meta: {
32
+ type: Object,
33
+ default: void 0
34
+ },
35
+ implicit: {
36
+ type: Boolean,
37
+ default: !1
38
+ }
39
+ },
40
+ async setup(a) {
41
+ let d = l(), f = o(), p = s("story"), m = s("implicitState"), h = e(), g, _, v, y;
42
+ c(() => {
43
+ v?.stop(), y?.stop();
44
+ });
45
+ let b = i(() => d.variant);
46
+ if (h?.mode !== "render" && typeof a.initState == "function" && b.value) {
47
+ let e = await a.initState();
48
+ u(b.value.state, r(e));
49
+ }
50
+ h?.mode !== "render" && b.value && m && (y = n(b.value.state, m()));
51
+ function x(e) {
52
+ Object.assign(e, {
53
+ slots: () => f.proxy.$slots,
54
+ source: a.source,
55
+ responsiveDisabled: a.responsiveDisabled,
56
+ autoPropsDisabled: a.autoPropsDisabled,
57
+ setupApp: a.setupApp,
58
+ meta: a.meta,
59
+ configReady: !0
60
+ }), !a.implicit && !p.value?.meta?.hasVariantChildComponents && (p.value.meta || (p.value.meta = {}), Object.assign(p.value.meta, { hasVariantChildComponents: !0 }));
61
+ }
62
+ function S() {
63
+ return d.variant ? d.variant : h?.mode === "render" ? (_ || (_ = p.value?.variants[h.nextVariantIndex.value], h.nextVariantIndex.value++), _) : null;
64
+ }
65
+ function C(e) {
66
+ if (h.slotName === "controls") return f.proxy.$slots.controls?.({ state: h.externalState }) ?? null;
67
+ if (h.slotName !== "default") return null;
68
+ let n = f.proxy.$slots.default?.({ state: h.externalState }) ?? null;
69
+ return n && !e.autoPropsDisabled && (g = t(e, n, h.externalState, g)), n;
70
+ }
71
+ function w(e) {
72
+ if (!m) return;
73
+ let t = h?.mode === "render" && h.currentVariant?.id === e.id;
74
+ t && !v ? v = n(e.state, m()) : !t && v && (v.stop(), v = null);
75
+ }
76
+ return b.value && x(b.value), {
77
+ renderContext: h,
78
+ renderVariantSlot: C,
79
+ resolveVariant: S,
80
+ syncRenderVariantState: w,
81
+ updateVariant: x
82
+ };
83
+ },
84
+ render() {
85
+ let e = this.resolveVariant();
86
+ return !e || (this.updateVariant(e), this.syncRenderVariantState(e), this.renderContext?.mode !== "render") || this.renderContext.currentVariant?.id !== e.id ? null : this.renderVariantSlot(e);
87
+ }
101
88
  });
102
- export {
103
- $ as default
104
- };
89
+ //#endregion
90
+ export { d as default };
@@ -1,66 +1,50 @@
1
- import { applyState as c } from "@poveste/shared";
2
- import { getTagName as m } from "../codegen.js";
3
- function b(t, o, e, p) {
4
- const r = h(o, e), i = JSON.stringify(r);
5
- return (!p || p !== i) && (c(t.state, {
6
- _hPropDefs: r
7
- }), t.state._hPropState || c(t.state, {
8
- _hPropState: {}
9
- })), i;
1
+ import { getTagName as e } from "../codegen.js";
2
+ import { applyState as t } from "@poveste/shared";
3
+ //#region src/client/app/auto-props.ts
4
+ function n(e, n, i, a) {
5
+ let o = r(n, i), s = JSON.stringify(o);
6
+ return (!a || a !== s) && (t(e.state, { _hPropDefs: o }), e.state._hPropState || t(e.state, { _hPropState: {} })), s;
10
7
  }
11
- function h(t, o) {
12
- const e = [];
13
- return y(t, o, {
14
- index: 0
15
- }, e), e.filter((r) => r.props.length);
8
+ function r(e, t) {
9
+ let n = [];
10
+ return i(e, t, { index: 0 }, n), n.filter((e) => e.props.length);
16
11
  }
17
- function y(t, o, e, p) {
18
- for (const r of l(t))
19
- if (r) {
20
- if (typeof r.type == "object") {
21
- const i = e.index++, a = [];
22
- for (const s in r.type.props) {
23
- const n = r.type.props[s];
24
- let u, f;
25
- n && (u = (Array.isArray(n.type) ? n.type : typeof n == "function" ? [n] : [n.type]).map((d) => {
26
- switch (d) {
27
- case String:
28
- return "string";
29
- case Number:
30
- return "number";
31
- case Boolean:
32
- return "boolean";
33
- case Object:
34
- return "object";
35
- case Array:
36
- return "array";
37
- default:
38
- return "unknown";
39
- }
40
- }), f = typeof n.default == "function" ? n.default.toString() : n.default), a.push({
41
- name: s,
42
- types: u,
43
- required: n?.required,
44
- default: f
45
- }), 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));
46
- }
47
- p.push({
48
- name: m(r),
49
- index: i,
50
- props: a
51
- });
52
- }
53
- Array.isArray(r.children) && y(r.children, o, e, p);
54
- }
12
+ function i(t, n, r, o) {
13
+ for (let s of a(t)) if (s) {
14
+ if (typeof s.type == "object") {
15
+ let t = r.index++, i = [];
16
+ for (let e in s.type.props) {
17
+ let r = s.type.props[e], a, o;
18
+ r && (a = (Array.isArray(r.type) ? r.type : typeof r == "function" ? [r] : [r.type]).map((e) => {
19
+ switch (e) {
20
+ case String: return "string";
21
+ case Number: return "number";
22
+ case Boolean: return "boolean";
23
+ case Object: return "object";
24
+ case Array: return "array";
25
+ default: return "unknown";
26
+ }
27
+ }), o = typeof r.default == "function" ? r.default.toString() : r.default), i.push({
28
+ name: e,
29
+ types: a,
30
+ required: r?.required,
31
+ default: o
32
+ }), n?._hPropState?.[t]?.[e] != null && (s.props ||= {}, s.props[e] = n._hPropState[t][e], s.dynamicProps ||= [], s.dynamicProps.includes(e) || s.dynamicProps.push(e));
33
+ }
34
+ o.push({
35
+ name: e(s),
36
+ index: t,
37
+ props: i
38
+ });
39
+ }
40
+ Array.isArray(s.children) && i(s.children, n, r, o);
41
+ }
55
42
  }
56
- function l(t) {
57
- if (!Array.isArray(t))
58
- return t == null ? [] : [t];
59
- const o = [];
60
- for (const e of t)
61
- Array.isArray(e) ? o.push(...l(e)) : e != null && o.push(e);
62
- return o;
43
+ function a(e) {
44
+ if (!Array.isArray(e)) return e == null ? [] : [e];
45
+ let t = [];
46
+ for (let n of e) Array.isArray(n) ? t.push(...a(n)) : n != null && t.push(n);
47
+ return t;
63
48
  }
64
- export {
65
- b as syncVariantAutoProps
66
- };
49
+ //#endregion
50
+ export { n as syncVariantAutoProps };
@@ -1,81 +1,65 @@
1
- import { components as v } from "@poveste/controls";
2
- import { reactive as y, createApp as E, h as C } from "@poveste/vendors/vue";
3
- import { defineComponent as g, h as u, ref as d, onBeforeUpdate as $, onMounted as w, onUpdated as U, onBeforeUnmount as b } from "vue";
4
- import k from "./Story.js";
5
- import q from "./Variant.js";
6
- function M(e) {
7
- e.component("Story", k), e.component("Variant", q);
8
- for (const o in v)
9
- e.component(o, A(v[o]));
1
+ import e from "./Variant.js";
2
+ import t from "./Story.js";
3
+ import { createApp as n, h as r, reactive as i } from "@poveste/vendors/vue";
4
+ import { defineComponent as a, h as o, onBeforeUnmount as s, onBeforeUpdate as c, onMounted as l, onUpdated as u, ref as d } from "vue";
5
+ import { components as f } from "@poveste/controls";
6
+ //#region src/client/app/global-components.ts
7
+ function p(n) {
8
+ n.component("Story", t), n.component("Variant", e);
9
+ for (let e in f) n.component(e, m(f[e]));
10
10
  }
11
- function A(e) {
12
- return g({
13
- name: e.name,
14
- inheritAttrs: !1,
15
- setup(o, { attrs: n }) {
16
- const a = d(), p = d(), m = y({});
17
- function c(l) {
18
- Object.assign(m, l);
19
- }
20
- c(n), $(() => {
21
- c(n);
22
- });
23
- let t = [];
24
- const r = d([]);
25
- function S() {
26
- r.value.forEach((l, f) => {
27
- const h = p.value.querySelector(`[renderslotid="${f}"]`);
28
- if (!h) return;
29
- const s = a.value.querySelector(`[slotid="${f}"]`);
30
- for (; s.firstChild; )
31
- s.removeChild(s.lastChild);
32
- s.appendChild(h);
33
- });
34
- }
35
- let i;
36
- return w(() => {
37
- i = E({
38
- mounted() {
39
- r.value = t, t = [];
40
- },
41
- updated() {
42
- r.value = t, t = [];
43
- },
44
- render() {
45
- return C(e, {
46
- ...m,
47
- key: "component"
48
- }, {
49
- default: (l) => (t.push(l), C("div", {
50
- slotId: t.length - 1
51
- }))
52
- });
53
- }
54
- }), i.mount(a.value);
55
- }), U(() => {
56
- S();
57
- }), b(() => {
58
- i.unmount();
59
- }), {
60
- el: a,
61
- slotEl: p,
62
- slotCalls: r
63
- };
64
- },
65
- render() {
66
- return [
67
- u("div", {
68
- ref: "el"
69
- }),
70
- u("div", {
71
- ref: "slotEl"
72
- }, this.slotCalls.map((o, n) => u("div", {
73
- renderSlotId: n
74
- }, this.$slots.default(o))))
75
- ];
76
- }
77
- });
11
+ function m(e) {
12
+ return a({
13
+ name: e.name,
14
+ inheritAttrs: !1,
15
+ setup(t, { attrs: a }) {
16
+ let o = d(), f = d(), p = i({});
17
+ function m(e) {
18
+ Object.assign(p, e);
19
+ }
20
+ m(a), c(() => {
21
+ m(a);
22
+ });
23
+ let h = [], g = d([]);
24
+ function _() {
25
+ g.value.forEach((e, t) => {
26
+ let n = f.value.querySelector(`[renderslotid="${t}"]`);
27
+ if (!n) return;
28
+ let r = o.value.querySelector(`[slotid="${t}"]`);
29
+ for (; r.firstChild;) r.removeChild(r.lastChild);
30
+ r.appendChild(n);
31
+ });
32
+ }
33
+ let v;
34
+ return l(() => {
35
+ v = n({
36
+ mounted() {
37
+ g.value = h, h = [];
38
+ },
39
+ updated() {
40
+ g.value = h, h = [];
41
+ },
42
+ render() {
43
+ return r(e, {
44
+ ...p,
45
+ key: "component"
46
+ }, { default: (e) => (h.push(e), r("div", { slotId: h.length - 1 })) });
47
+ }
48
+ }), v.mount(o.value);
49
+ }), u(() => {
50
+ _();
51
+ }), s(() => {
52
+ v.unmount();
53
+ }), {
54
+ el: o,
55
+ slotEl: f,
56
+ slotCalls: g
57
+ };
58
+ },
59
+ render() {
60
+ return [o("div", { ref: "el" }), o("div", { ref: "slotEl" }, this.slotCalls.map((e, t) => o("div", { renderSlotId: t }, this.$slots.default(e))))];
61
+ }
62
+ });
78
63
  }
79
- export {
80
- M as registerGlobalComponents
81
- };
64
+ //#endregion
65
+ export { p as registerGlobalComponents };
@@ -1,80 +1,76 @@
1
- import { getSetupHook as i } from "@poveste/shared";
2
- import * as d from "virtual:$poveste-generated-global-setup";
1
+ import { provideRenderContext as e } from "./render-context.js";
2
+ import { registerGlobalComponents as t } from "./global-components.js";
3
+ import { RouterLinkStub as n } from "./RouterLinkStub.js";
4
+ import { Suspense as r, createApp as i, defineComponent as a, h as o } from "vue";
5
+ import { getSetupHook as s } from "@poveste/shared";
6
+ import * as c from "virtual:$poveste-generated-global-setup";
3
7
  import * as l from "virtual:$poveste-setup";
4
- import { defineComponent as y, h as o, createApp as v, Suspense as g } from "vue";
5
- import { registerGlobalComponents as w } from "./global-components.js";
6
- import { provideRenderContext as S } from "./render-context.js";
7
- import { RouterLinkStub as C } from "./RouterLinkStub.js";
8
- const x = y({
9
- name: "PreviewHostRoot",
10
- props: {
11
- story: {
12
- type: Object,
13
- required: !0
14
- },
15
- renderContext: {
16
- type: Object,
17
- required: !0
18
- }
19
- },
20
- setup(e) {
21
- return S(e.renderContext), () => o(e.story.file.component, {
22
- story: e.story
23
- });
24
- }
8
+ //#region src/client/app/host.ts
9
+ var u = a({
10
+ name: "PreviewHostRoot",
11
+ props: {
12
+ story: {
13
+ type: Object,
14
+ required: !0
15
+ },
16
+ renderContext: {
17
+ type: Object,
18
+ required: !0
19
+ }
20
+ },
21
+ setup(t) {
22
+ return e(t.renderContext), () => o(t.story.file.component, { story: t.story });
23
+ }
25
24
  });
26
- function F(e) {
27
- let t = null, r = null;
28
- async function a() {
29
- const u = [];
30
- r = document.createElement("div"), e.el.appendChild(r), t = v({
31
- name: e.name,
32
- render: () => {
33
- let n = o(x, {
34
- story: e.getStory(),
35
- renderContext: e.renderContext
36
- });
37
- for (const s of u) {
38
- const f = n;
39
- n = o(s, {
40
- story: e.getStory(),
41
- variant: e.getVariant()
42
- }, () => f);
43
- }
44
- return e.wrapInDiv && (n = o("div", n)), o(g, {}, n);
45
- }
46
- }), w(t), t.component("RouterLink", C);
47
- const m = {
48
- app: t,
49
- story: e.getStory(),
50
- variant: e.getVariant(),
51
- addWrapper: (n) => {
52
- u.unshift(n);
53
- }
54
- };
55
- await h(m), t.mount(r);
56
- }
57
- function p() {
58
- t?.unmount(), t = null, r && (r.parentNode?.removeChild(r), r = null);
59
- }
60
- function c() {
61
- t?._instance?.proxy?.$forceUpdate();
62
- }
63
- return {
64
- mount: a,
65
- unmount: p,
66
- forceUpdate: c
67
- };
25
+ function d(e) {
26
+ let a = null, s = null;
27
+ async function c() {
28
+ let c = [];
29
+ s = document.createElement("div"), e.el.appendChild(s), a = i({
30
+ name: e.name,
31
+ render: () => {
32
+ let t = o(u, {
33
+ story: e.getStory(),
34
+ renderContext: e.renderContext
35
+ });
36
+ for (let n of c) {
37
+ let r = t;
38
+ t = o(n, {
39
+ story: e.getStory(),
40
+ variant: e.getVariant()
41
+ }, () => r);
42
+ }
43
+ return e.wrapInDiv && (t = o("div", t)), o(r, {}, t);
44
+ }
45
+ }), t(a), a.component("RouterLink", n), await f({
46
+ app: a,
47
+ story: e.getStory(),
48
+ variant: e.getVariant(),
49
+ addWrapper: (e) => {
50
+ c.unshift(e);
51
+ }
52
+ }), a.mount(s);
53
+ }
54
+ function l() {
55
+ a?.unmount(), a = null, s &&= (s.parentNode?.removeChild(s), null);
56
+ }
57
+ function d() {
58
+ a?._instance?.proxy?.$forceUpdate();
59
+ }
60
+ return {
61
+ mount: c,
62
+ unmount: l,
63
+ forceUpdate: d
64
+ };
68
65
  }
69
- async function h(e) {
70
- const t = i(d, "setupVue3");
71
- t && await t(e);
72
- const r = i(l, "setupVue3");
73
- if (r && await r(e), typeof e.variant?.setupApp == "function") {
74
- const a = e.variant.setupApp;
75
- await a(e);
76
- }
66
+ async function f(e) {
67
+ let t = s(c, "setupVue3");
68
+ t && await t(e);
69
+ let n = s(l, "setupVue3");
70
+ if (n && await n(e), typeof e.variant?.setupApp == "function") {
71
+ let t = e.variant.setupApp;
72
+ await t(e);
73
+ }
77
74
  }
78
- export {
79
- F as createPreviewHost
80
- };
75
+ //#endregion
76
+ export { d as createPreviewHost };
@@ -1,6 +1,3 @@
1
- import { default as e } from "./MountStory.js";
2
- import { default as a } from "./RenderStory.js";
3
- export {
4
- e as MountStory,
5
- a as RenderStory
6
- };
1
+ import e from "./MountStory.js";
2
+ import t from "./RenderStory.js";
3
+ export { e as MountStory, t as RenderStory };
@@ -1,12 +1,11 @@
1
- import { provide as n, inject as r } from "vue";
2
- const e = /* @__PURE__ */ Symbol("poveste-preview-render-context");
3
- function i(t) {
4
- n(e, t);
1
+ import { inject as e, provide as t } from "vue";
2
+ //#region src/client/app/render-context.ts
3
+ var n = Symbol("poveste-preview-render-context");
4
+ function r(e) {
5
+ t(n, e);
5
6
  }
6
- function p() {
7
- return r(e, null);
7
+ function i() {
8
+ return e(n, null);
8
9
  }
9
- export {
10
- i as provideRenderContext,
11
- p as useRenderContext
12
- };
10
+ //#endregion
11
+ export { r as provideRenderContext, i as useRenderContext };