@poveste/plugin-vue 0.1.0

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

@@ -0,0 +1,51 @@
+import * as u from "virtual:$histoire-generated-global-setup";
+import * as a from "virtual:$histoire-setup";
+import { createApp as m, h as d } from "vue";
+import f from "./Story.js";
+import l from "./Variant.js";
+async function S({ file: n, storyData: r, el: c }) {
+  const { default: e } = await import(/* @vite-ignore */
+    /* @vite-ignore */
+    n.moduleId
+  ), o = m({
+    provide: {
+      addStory(t) {
+        r.push(t);
+      }
+    },
+    render() {
+      return d(e, {
+        ref: "comp",
+        data: n
+      });
+    }
+  });
+  o.component("Story", f), o.component("Variant", l);
+  const p = {
+    app: o,
+    story: null,
+    variant: null,
+    addWrapper: () => {
+    }
+  };
+  if (typeof u?.setupVue3 == "function") {
+    const t = u.setupVue3;
+    await t(p);
+  }
+  if (typeof a?.setupVue3 == "function") {
+    const t = a.setupVue3;
+    await t(p);
+  }
+  if (o.mount(c), e.doc) {
+    const t = document.createElement("div");
+    t.innerHTML = e.doc;
+    const i = t.textContent;
+    r.forEach((s) => {
+      s.docsText = i;
+    });
+  }
+  o.unmount();
+}
+export {
+  S as run
+};

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

@@ -0,0 +1,8 @@
+const n = { name: "StubbedComponent", render: () => null };
+function o(t) {
+  for (const e of t)
+    typeof e.type == "object" && e.type.name !== "PovesteVariant" && (e.type = n), Array.isArray(e.children) && o(e.children);
+}
+export {
+  o as autoStubComponents
+};

package/dist/bundled/client/server.js

@@ -0,0 +1,4 @@
+import { run as e } from "./server/run.js";
+export {
+  e as run
+};

package/dist/bundled/node_modules/.pnpm/change-case@5.4.4/node_modules/change-case/dist/index.js

@@ -0,0 +1,118 @@
+const E = new RegExp("([\\p{Ll}\\d])(\\p{Lu})", "gu"), P = new RegExp("(\\p{Lu})([\\p{Lu}][\\p{Ll}])", "gu"), w = new RegExp("(\\d)\\p{Ll}|(\\p{L})\\d", "u"), R = /[^\p{L}\d]+/giu, C = "$1\0$2", x = "";
+function h(r) {
+  let e = r.trim();
+  e = e.replace(E, C).replace(P, C), e = e.replace(R, "\0");
+  let t = 0, c = e.length;
+  for (; e.charAt(t) === "\0"; )
+    t++;
+  if (t === c)
+    return [];
+  for (; e.charAt(c - 1) === "\0"; )
+    c--;
+  return e.slice(t, c).split(/\0/g);
+}
+function A(r) {
+  const e = h(r);
+  for (let t = 0; t < e.length; t++) {
+    const c = e[t], n = w.exec(c);
+    if (n) {
+      const a = n.index + (n[1] ?? n[2]).length;
+      e.splice(t, 1, c.slice(0, a), c.slice(a));
+    }
+  }
+  return e;
+}
+function p(r, e) {
+  const [t, c, n] = u(r, e);
+  return t + c.map(f(e?.locale)).join(e?.delimiter ?? " ") + n;
+}
+function g(r, e) {
+  const [t, c, n] = u(r, e), a = f(e?.locale), s = o(e?.locale), i = e?.mergeAmbiguousCharacters ? d(a, s) : _(a, s);
+  return t + c.map((l, m) => m === 0 ? a(l) : i(l, m)).join(e?.delimiter ?? "") + n;
+}
+function S(r, e) {
+  const [t, c, n] = u(r, e), a = f(e?.locale), s = o(e?.locale), i = e?.mergeAmbiguousCharacters ? d(a, s) : _(a, s);
+  return t + c.map(i).join(e?.delimiter ?? "") + n;
+}
+function T(r, e) {
+  return L(r, { delimiter: "_", ...e });
+}
+function L(r, e) {
+  const [t, c, n] = u(r, e), a = f(e?.locale), s = o(e?.locale);
+  return t + c.map(d(a, s)).join(e?.delimiter ?? " ") + n;
+}
+function F(r, e) {
+  const [t, c, n] = u(r, e);
+  return t + c.map(o(e?.locale)).join(e?.delimiter ?? "_") + n;
+}
+function U(r, e) {
+  return p(r, { delimiter: ".", ...e });
+}
+function I(r, e) {
+  return p(r, { delimiter: "-", ...e });
+}
+function b(r, e) {
+  return p(r, { delimiter: "/", ...e });
+}
+function j(r, e) {
+  const [t, c, n] = u(r, e), a = f(e?.locale), s = o(e?.locale), i = d(a, s);
+  return t + c.map((l, m) => m === 0 ? i(l) : a(l)).join(e?.delimiter ?? " ") + n;
+}
+function k(r, e) {
+  return p(r, { delimiter: "_", ...e });
+}
+function y(r, e) {
+  return L(r, { delimiter: "-", ...e });
+}
+function f(r) {
+  return r === !1 ? (e) => e.toLowerCase() : (e) => e.toLocaleLowerCase(r);
+}
+function o(r) {
+  return r === !1 ? (e) => e.toUpperCase() : (e) => e.toLocaleUpperCase(r);
+}
+function d(r, e) {
+  return (t) => `${e(t[0])}${r(t.slice(1))}`;
+}
+function _(r, e) {
+  return (t, c) => {
+    const n = t[0];
+    return (c > 0 && n >= "0" && n <= "9" ? "_" + n : e(n)) + r(t.slice(1));
+  };
+}
+function u(r, e = {}) {
+  const t = e.split ?? (e.separateNumbers ? A : h), c = e.prefixCharacters ?? x, n = e.suffixCharacters ?? x;
+  let a = 0, s = r.length;
+  for (; a < r.length; ) {
+    const i = r.charAt(a);
+    if (!c.includes(i))
+      break;
+    a++;
+  }
+  for (; s > a; ) {
+    const i = s - 1, l = r.charAt(i);
+    if (!n.includes(l))
+      break;
+    s = i;
+  }
+  return [
+    r.slice(0, a),
+    t(r.slice(a, s)),
+    r.slice(s)
+  ];
+}
+export {
+  g as camelCase,
+  L as capitalCase,
+  F as constantCase,
+  U as dotCase,
+  I as kebabCase,
+  p as noCase,
+  S as pascalCase,
+  T as pascalSnakeCase,
+  b as pathCase,
+  j as sentenceCase,
+  k as snakeCase,
+  h as split,
+  A as splitSeparateNumbers,
+  y as trainCase
+};

package/dist/client/app/MountStory.d.ts

@@ -0,0 +1,16 @@
+import type { Story } from '@poveste/shared';
+import type { PropType as _PropType } from '@poveste/vendors/vue';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    story: {
+        type: _PropType<Story>;
+        required: true;
+    };
+}>, {
+    el: import("vue").Ref<HTMLDivElement, HTMLDivElement>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    story: {
+        type: _PropType<Story>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/client/app/RenderStory.d.ts

@@ -0,0 +1,38 @@
+import type { Story, Variant } from '@poveste/shared';
+import type { PropType as _PropType } from '@poveste/vendors/vue';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    variant: {
+        type: _PropType<Variant>;
+        required: true;
+    };
+    story: {
+        type: _PropType<Story>;
+        required: true;
+    };
+    slotName: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {
+    sandbox: import("vue").Ref<HTMLDivElement, HTMLDivElement>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    ready: () => true;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    variant: {
+        type: _PropType<Variant>;
+        required: true;
+    };
+    story: {
+        type: _PropType<Story>;
+        required: true;
+    };
+    slotName: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onReady?: () => any;
+}>, {
+    slotName: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/client/app/RouterLinkStub.d.ts

@@ -0,0 +1,21 @@
+export declare const RouterLinkStub: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    to: {
+        type: (ObjectConstructor | StringConstructor)[];
+        required: true;
+    };
+    custom: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    to: {
+        type: (ObjectConstructor | StringConstructor)[];
+        required: true;
+    };
+    custom: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    custom: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/client/app/Story.d.ts

@@ -0,0 +1,33 @@
+import type { Story } from '@poveste/shared';
+import type { PropType, VNode } from 'vue';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    initState: {
+        type: PropType<() => any | Promise<any>>;
+        default: any;
+    };
+    meta: {
+        type: PropType<Story["meta"]>;
+        default: any;
+    };
+}>, {
+    renderContext: import("./render-context.js").PreviewRenderContext;
+    story: import("vue").ComputedRef<Story>;
+    renderMountStory: () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[];
+    renderPreviewStory: () => any[];
+    updateStory: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    initState: {
+        type: PropType<() => any | Promise<any>>;
+        default: any;
+    };
+    meta: {
+        type: PropType<Story["meta"]>;
+        default: any;
+    };
+}>> & Readonly<{}>, {
+    meta: import("@poveste/shared").StoryMeta;
+    initState: () => any | Promise<any>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/client/app/Variant.d.ts

@@ -0,0 +1,78 @@
+import type { Variant } from '@poveste/shared';
+import type { PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    initState: {
+        type: PropType<() => any | Promise<any>>;
+        default: any;
+    };
+    source: {
+        type: StringConstructor;
+        default: any;
+    };
+    responsiveDisabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoPropsDisabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    setupApp: {
+        type: FunctionConstructor;
+        default: any;
+    };
+    meta: {
+        type: PropType<Variant["meta"]>;
+        default: any;
+    };
+    implicit: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {
+    renderContext: import("./render-context.js").PreviewRenderContext;
+    renderVariantSlot: (variant: Variant) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[];
+    resolveVariant: () => Variant;
+    syncRenderVariantState: (variant: Variant) => void;
+    updateVariant: (variant: Variant) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    initState: {
+        type: PropType<() => any | Promise<any>>;
+        default: any;
+    };
+    source: {
+        type: StringConstructor;
+        default: any;
+    };
+    responsiveDisabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoPropsDisabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    setupApp: {
+        type: FunctionConstructor;
+        default: any;
+    };
+    meta: {
+        type: PropType<Variant["meta"]>;
+        default: any;
+    };
+    implicit: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    meta: any;
+    initState: () => any | Promise<any>;
+    source: string;
+    responsiveDisabled: boolean;
+    autoPropsDisabled: boolean;
+    setupApp: Function;
+    implicit: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/client/app/auto-props.d.ts

@@ -0,0 +1,2 @@
+import type { Variant } from '@poveste/shared';
+export declare function syncVariantAutoProps(variant: Variant, vnodes: any, externalState: Variant['state'], lastSnapshot: string): string;

package/dist/client/app/global-components.d.ts

@@ -0,0 +1,2 @@
+import type { App } from 'vue';
+export declare function registerGlobalComponents(app: App): void;

package/dist/client/app/host.d.ts

@@ -0,0 +1,16 @@
+import type { Story, Variant } from '@poveste/shared';
+import { type PreviewRenderContext } from './render-context.js';
+interface PreviewHostOptions {
+    name: string;
+    el: HTMLElement;
+    getStory: () => Story;
+    getVariant: () => Variant | null;
+    renderContext: PreviewRenderContext;
+    wrapInDiv?: boolean;
+}
+export declare function createPreviewHost(options: PreviewHostOptions): {
+    mount: () => Promise<void>;
+    unmount: () => void;
+    forceUpdate: () => void;
+};
+export {};

package/dist/client/app/index.d.ts

@@ -0,0 +1,2 @@
+export { default as MountStory } from './MountStory';
+export { default as RenderStory } from './RenderStory';

package/dist/client/app/render-context.d.ts

@@ -0,0 +1,12 @@
+import type { Variant } from '@poveste/shared';
+export interface PreviewRenderContext {
+    mode: 'mount' | 'render';
+    slotName: string;
+    currentVariant: Variant | null;
+    externalState: Variant['state'] | null;
+    nextVariantIndex: {
+        value: number;
+    };
+}
+export declare function provideRenderContext(value: PreviewRenderContext): void;
+export declare function useRenderContext(): PreviewRenderContext;

package/dist/client/app/util.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Using external/user Vue
+ */
+export declare function toRawDeep(val: any, seen?: WeakMap<WeakKey, any>): any;
+/**
+ * Using bundled Vue
+ */
+export declare function _toRawDeep(val: any, seen?: WeakMap<WeakKey, any>): any;
+/**
+ * Synchronize states between the bundled and external/user versions of Vue
+ * @param bundledState Reactive state created with the bundled Vue
+ * @param externalState Reactive state created with the external/user Vue
+ */
+export declare function syncStateBundledAndExternal(bundledState: any, externalState: any): {
+    stop(): void;
+};

package/dist/client/client.d.ts

@@ -0,0 +1,7 @@
+export * from './app/index.js';
+export * from './codegen.js';
+declare module '@poveste/shared' {
+    interface StoryMeta {
+        hasVariantChildComponents?: boolean;
+    }
+}

package/dist/client/codegen.d.ts

@@ -0,0 +1,4 @@
+import type { Variant } from '@poveste/shared';
+import type { VNode } from 'vue';
+export declare function generateSourceCode(variant: Variant): Promise<string>;
+export declare function getTagName(vnode: VNode): any;

package/dist/client/server/Story.d.ts

@@ -0,0 +1,81 @@
+import type { ServerStory } from '@poveste/shared';
+import type { PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        default: any;
+    };
+    id: {
+        type: StringConstructor;
+        default: any;
+    };
+    group: {
+        type: StringConstructor;
+        default: any;
+    };
+    layout: {
+        type: PropType<ServerStory["layout"]>;
+        default: any;
+    };
+    icon: {
+        type: StringConstructor;
+        default: any;
+    };
+    iconColor: {
+        type: StringConstructor;
+        default: any;
+    };
+    docsOnly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    meta: {
+        type: PropType<ServerStory["meta"]>;
+        default: any;
+    };
+}>, {
+    story: ServerStory;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        default: any;
+    };
+    id: {
+        type: StringConstructor;
+        default: any;
+    };
+    group: {
+        type: StringConstructor;
+        default: any;
+    };
+    layout: {
+        type: PropType<ServerStory["layout"]>;
+        default: any;
+    };
+    icon: {
+        type: StringConstructor;
+        default: any;
+    };
+    iconColor: {
+        type: StringConstructor;
+        default: any;
+    };
+    docsOnly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    meta: {
+        type: PropType<ServerStory["meta"]>;
+        default: any;
+    };
+}>> & Readonly<{}>, {
+    meta: import("@poveste/shared").StoryMeta;
+    title: string;
+    id: string;
+    group: string;
+    layout: import("@poveste/shared").StoryLayout;
+    icon: string;
+    iconColor: string;
+    docsOnly: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/client/server/Variant.d.ts

@@ -0,0 +1,52 @@
+import type { ServerVariant } from '@poveste/shared';
+import { type PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    id: {
+        type: StringConstructor;
+        default: any;
+    };
+    icon: {
+        type: StringConstructor;
+        default: any;
+    };
+    iconColor: {
+        type: StringConstructor;
+        default: any;
+    };
+    meta: {
+        type: PropType<ServerVariant["meta"]>;
+        default: any;
+    };
+}>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    id: {
+        type: StringConstructor;
+        default: any;
+    };
+    icon: {
+        type: StringConstructor;
+        default: any;
+    };
+    iconColor: {
+        type: StringConstructor;
+        default: any;
+    };
+    meta: {
+        type: PropType<ServerVariant["meta"]>;
+        default: any;
+    };
+}>> & Readonly<{}>, {
+    meta: any;
+    title: string;
+    id: string;
+    icon: string;
+    iconColor: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/client/server/run.d.ts

@@ -0,0 +1,2 @@
+import type { ServerRunPayload } from '@poveste/shared';
+export declare function run({ file, storyData, el }: ServerRunPayload): Promise<void>;

package/dist/client/server/stub.d.ts

@@ -0,0 +1 @@
+export declare function autoStubComponents(vnodes: any[]): void;

package/dist/client/server.d.ts

@@ -0,0 +1 @@
+export * from './server/run.js';

package/dist/commands/generate-story.client.d.ts

@@ -0,0 +1,3 @@
+import type { ClientCommandOptions } from 'poveste';
+declare const _default: ClientCommandOptions;
+export default _default;

package/dist/commands/generate-story.client.js

@@ -0,0 +1,27 @@
+import { kebabCase } from 'change-case';
+import { openStory, sendEvent } from 'poveste/plugin';
+export default {
+    prompts: [
+        {
+            field: 'component',
+            label: 'Choose a component',
+            type: 'select',
+            options: async (search) => sendEvent('listVueComponents', { search }),
+            required: true,
+        },
+        {
+            field: 'fileName',
+            label: 'File name',
+            type: 'text',
+            required: true,
+            defaultValue: answers => answers.component?.replace(/[^/]+\/([^/]+)\.vue$/, '$1.story.vue'),
+        },
+    ],
+    clientAction: (params) => {
+        const index = params.component.lastIndexOf('/');
+        const dirname = params.component.substring(0, index + 1);
+        const file = `${dirname}${params.fileName}`;
+        const storyId = kebabCase(file.toLowerCase());
+        openStory(storyId);
+    },
+};

package/dist/commands/generate-story.server.d.ts

@@ -0,0 +1,3 @@
+import type { PluginCommand } from 'poveste';
+declare const _default: PluginCommand;
+export default _default;

package/dist/commands/generate-story.server.js

@@ -0,0 +1,45 @@
+import fs from 'node:fs';
+import launchEditor from 'launch-editor';
+import path from 'pathe';
+export default {
+    id: 'histoire:plugin-vue:generate-story',
+    label: 'Generate Vue 3 story from component',
+    icon: 'https://vuejs.org/logo.svg',
+    searchText: 'generate create',
+    async serverAction(params) {
+        const targetFile = path.join(path.dirname(params.component), params.fileName);
+        if (fs.existsSync(targetFile)) {
+            throw new Error(`File ${targetFile} already exists`);
+        }
+        const { component, componentName, isTs } = await getComponentInfo(params.component);
+        const content = `<script setup${isTs ? ' lang="ts"' : ''}>
+import ${componentName} from './${component}'
+</script>
+
+<template>
+  <Story>
+    <Variant title="Default">
+      <${componentName} />
+    </Variant>
+  </Story>
+</template>
+`;
+        await fs.promises.writeFile(targetFile, content, 'utf-8');
+        launchEditor(targetFile);
+    },
+    clientSetupFile: '@poveste/plugin-vue/dist/commands/generate-story.client.js',
+};
+async function isComponentTs(component) {
+    const componentContent = await fs.promises.readFile(component, 'utf-8');
+    return componentContent.includes('lang="ts"');
+}
+async function getComponentInfo(file) {
+    const component = path.basename(file);
+    const componentName = component.replace(path.extname(component), '');
+    const isTs = await isComponentTs(file);
+    return {
+        component,
+        componentName,
+        isTs,
+    };
+}