@rinova/playground 0.0.0-stage → 0.1.0

package/dist/types/app/App.vue.d.ts

@@ -0,0 +1,4 @@
+import '../styles/theme.less';
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/app/PlaygroundParamsPanel.vue.d.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    theme: 'light' | 'dark';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/app/PlaygroundSidebar.vue.d.ts

@@ -0,0 +1,19 @@
+import type { SceneDescriptor } from '../types';
+type __VLS_Props = {
+    title: string;
+    groups: {
+        name: string;
+        items: SceneDescriptor[];
+    }[];
+    activeId: string;
+    sceneCount: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    focusSearch: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    select: (id: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/app/PlaygroundSourcePanel.vue.d.ts

@@ -0,0 +1,12 @@
+import type { SceneDescriptor } from '../types';
+type __VLS_Props = {
+    scene: SceneDescriptor;
+    theme: 'light' | 'dark';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/app/PlaygroundStage.vue.d.ts

@@ -0,0 +1,8 @@
+import type { SceneDescriptor } from '../types';
+type __VLS_Props = {
+    scene: SceneDescriptor;
+    width: 'auto' | 'tablet' | 'mobile';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/app/PlaygroundToolbar.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    group: string;
+    title: string;
+    showCode: boolean;
+    showPayload: boolean;
+    hasPayload: boolean;
+    width: 'auto' | 'tablet' | 'mobile';
+    theme: 'light' | 'dark';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "toggle-code": () => any;
+    "toggle-payload": () => any;
+    "update:width": (width: "auto" | "tablet" | "mobile") => any;
+    "toggle-theme": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onToggle-code"?: (() => any) | undefined;
+    "onToggle-payload"?: (() => any) | undefined;
+    "onUpdate:width"?: ((width: "auto" | "tablet" | "mobile") => any) | undefined;
+    "onToggle-theme"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/code/CodeBlock.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    code: string;
+    lang?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    lang: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/code/CodeEditor.vue.d.ts

@@ -0,0 +1,18 @@
+type __VLS_Props = {
+    modelValue: string;
+    filename: string;
+    readOnly?: boolean;
+    theme?: 'light' | 'dark';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    fail: (message: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onFail?: ((message: string) => any) | undefined;
+}>, {
+    theme: "light" | "dark";
+    readOnly: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/code/highlighter.d.ts

@@ -0,0 +1,4 @@
+import { type HighlighterCore } from 'shiki/core';
+export declare const PW_THEME_LIGHT = "vitesse-light";
+export declare const PW_THEME_DARK = "vitesse-dark";
+export declare const getHighlighter: () => Promise<HighlighterCore>;

package/dist/types/code/monaco.d.ts

@@ -0,0 +1,6 @@
+import type * as Monaco from 'monaco-editor/editor/editor.api';
+export declare const PW_MONACO_LANGS: readonly ["vue", "typescript", "javascript", "css", "html", "json", "less"];
+export declare const loadMonaco: () => Promise<typeof Monaco>;
+export declare const applyMonacoTheme: (monaco: typeof Monaco, theme: "light" | "dark") => void;
+/** 按扩展名判断 Monaco 语言 */
+export declare const langFromFile: (file: string) => string;

package/dist/types/components/PwButton.vue.d.ts

@@ -0,0 +1,29 @@
+type __VLS_Props = {
+    variant?: 'primary' | 'ghost' | 'text';
+    size?: 'sm' | 'md';
+    disabled?: boolean;
+    loading?: boolean;
+    title?: string;
+};
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        icon?: (props: {}) => any;
+    } & {
+        default?: (props: {}) => any;
+    };
+};
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: "sm" | "md";
+    disabled: boolean;
+    variant: "text" | "primary" | "ghost";
+    loading: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/PwInput.vue.d.ts

@@ -0,0 +1,43 @@
+type __VLS_Props = {
+    modelValue?: string;
+    placeholder?: string;
+    clearable?: boolean;
+    size?: 'sm' | 'md';
+    autofocus?: boolean;
+    type?: 'text' | 'number';
+};
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        prefix?: (props: {}) => any;
+    } & {
+        suffix?: (props: {}) => any;
+    };
+};
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
+    focus: () => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    keydown: (event: KeyboardEvent) => any;
+    focus: (event: FocusEvent) => any;
+    blur: (event: FocusEvent) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onKeydown?: ((event: KeyboardEvent) => any) | undefined;
+    onFocus?: ((event: FocusEvent) => any) | undefined;
+    onBlur?: ((event: FocusEvent) => any) | undefined;
+}>, {
+    type: "number" | "text";
+    size: "sm" | "md";
+    modelValue: string;
+    clearable: boolean;
+    autofocus: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/PwPortal.vue.d.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    to?: string;
+};
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        default?: (props: {}) => any;
+    };
+};
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    to: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/PwSwitch.vue.d.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    modelValue: boolean;
+    disabled?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/components/PwToastHost.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/types/components/toast.d.ts

@@ -0,0 +1,9 @@
+export type ToastType = 'info' | 'success' | 'warning' | 'error';
+export interface ToastItem {
+    id: number;
+    text: string;
+    type: ToastType;
+}
+export declare const toastState: import("vue").Reactive<ToastItem[]>;
+/** 轻提示。用法：toast('已复制'), toast('保存失败', 'error') */
+export declare const toast: (text: string, type?: ToastType, duration?: number) => void;

package/dist/types/composables/useFocusTrap.d.ts

@@ -0,0 +1,5 @@
+import { type Ref } from 'vue';
+/**
+ * 把 Tab 焦点限制在容器内。`active` 变为 false 时解除。
+ */
+export declare const useFocusTrap: (container: Ref<HTMLElement | null>, active: Ref<boolean>) => void;

package/dist/types/config.d.ts

@@ -0,0 +1,30 @@
+/** playground 的唯一配置入口。 */
+export type PlaygroundUiTheme = 'light' | 'dark' | 'auto';
+export type PlaygroundCodeViewer = 'monaco' | 'shiki';
+export interface PlaygroundConfig {
+    /** 品牌标题，默认取 package.json 的 name */
+    title?: string;
+    /** 场景扫描根目录，相对项目根 */
+    scenes?: string;
+    /** 是否展示源码面板，默认 true */
+    sources?: boolean;
+    /** 代码区实现：可编辑编辑器 / 只读高亮块，默认 'monaco' */
+    codeViewer?: PlaygroundCodeViewer;
+    theme?: {
+        /** 外壳主题（12 个 CSS 变量），默认 'auto' */
+        ui?: PlaygroundUiTheme;
+        /** 代码区 shiki 主题名，默认 'vitesse-dark' */
+        code?: string;
+    };
+    /** 扫描时排除的 glob（相对 scenes 根） */
+    exclude?: string[];
+    /** 部署子路径 */
+    base?: string;
+    /** dev server 端口 */
+    port?: number;
+    /** 契约清单要扫描的组件 glob（如 src/components 下所有 .vue）；不配则不生成 manifest */
+    components?: string[];
+    /** 组件契约提取用的 tsconfig，默认项目根的 tsconfig.json */
+    tsconfig?: string;
+}
+export declare const defineConfig: (config: PlaygroundConfig) => PlaygroundConfig;

package/dist/types/index.d.ts

@@ -0,0 +1,24 @@
+/// <reference path="./shims.d.ts" />
+export { defineConfig } from './config';
+export type { PlaygroundConfig, PlaygroundCodeViewer, PlaygroundUiTheme } from './config';
+export { defineSceneMeta } from './scene-meta';
+export type { SceneMeta } from './scene-meta';
+export type { SceneDescriptor } from './types';
+export { toast } from './components/toast';
+export { useSceneArgs, currentArgs } from './payload/args';
+export type { SceneArgs, SceneArgsOptions } from './payload/args';
+export { useSceneOutput, currentOutput } from './payload/output';
+export type { SceneSnapshot } from './payload/output';
+export interface CreatePlaygroundOptions {
+    /** 挂载点，默认 `#app` */
+    el?: string | HTMLElement;
+}
+/**
+ * 挂载 playground。
+ *
+ * ```ts
+ * import { createPlayground } from '@rinova/playground'
+ * createPlayground()
+ * ```
+ */
+export declare const createPlayground: (options?: CreatePlaygroundOptions) => Promise<void>;

package/dist/types/payload/args.d.ts

@@ -0,0 +1,19 @@
+export type SceneArgs = Record<string, unknown>;
+export interface SceneArgsOptions {
+    /** 字符串字段的可选值 → 渲染成下拉框 */
+    options?: Record<string, Array<string | number>>;
+    /** 字段标签，缺省用 key */
+    labels?: Record<string, string>;
+}
+export interface SceneArgsBinding {
+    values: SceneArgs;
+    defaults: SceneArgs;
+    options: SceneArgsOptions;
+}
+/** 同一时刻只有一个场景挂载，所以只需要一个"当前入参"槽位 */
+export declare const currentArgs: import("vue").ShallowRef<SceneArgsBinding | null, SceneArgsBinding | null>;
+/**
+ * 在场景的 `<script setup>` 里声明可变入参，返回响应式对象：
+ * 面板改表单 → 这里同步变化 → 组件跟着重渲染。纯浏览器能力，生产环境同样可用。
+ */
+export declare const useSceneArgs: <T extends SceneArgs>(defaults: T, options?: SceneArgsOptions) => T;

package/dist/types/payload/output.d.ts

@@ -0,0 +1,4 @@
+export type SceneSnapshot = Record<string, unknown>;
+/** 出参快照：由面板轮询调用，纯前端实现 */
+export declare const currentOutput: import("vue").ShallowRef<(() => SceneSnapshot) | null, (() => SceneSnapshot) | null>;
+export declare const useSceneOutput: (getter: () => SceneSnapshot) => void;

package/dist/types/scene-meta.d.ts

@@ -0,0 +1,23 @@
+/**
+ * 场景元信息。可选：不写也能用，只在需要覆盖标题 / 排序 / 入参出参面板时写。
+ */
+export interface SceneMeta {
+    /** 覆盖由文件名推导出的标题 */
+    title?: string;
+    /** 同层排序权重，小的在前 */
+    order?: number;
+    /** 搜索与筛选用标签 */
+    tags?: string[];
+    /** 场景说明，显示在预览区上方 */
+    description?: string;
+    /** 入参 / 出参快照 */
+    payload?: {
+        input?: () => Record<string, unknown>;
+        output?: () => Record<string, unknown>;
+    };
+    /** 额外要展示的源码文件（相对项目根） */
+    files?: string[];
+    /** 隐藏于侧栏，但可通过链接直达 */
+    hideInNav?: boolean;
+}
+export declare const defineSceneMeta: (meta: SceneMeta) => SceneMeta;

package/dist/types/shims.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="vite/client" />
+
+// monaco 的 TS 语言贡献是纯副作用模块，没有 d.ts
+declare module 'monaco-editor/language/typescript/monaco.contribution'
+
+declare module 'virtual:playground/config' {
+  import type { PlaygroundConfig } from './config'
+  const config: PlaygroundConfig & { sceneCount: number }
+  export default config
+}
+
+declare module 'virtual:playground/scenes' {
+  import type { SceneDescriptor } from './types'
+  export const scenes: SceneDescriptor[]
+}

package/dist/types/types.d.ts

@@ -0,0 +1,37 @@
+import type { Component } from 'vue';
+/** 一个被扫描到的场景。由 @rinova/playground-vite 在构建期生成。 */
+export interface SceneDescriptor {
+    /** 场景 id，等于相对 scenes 根目录的路径（不含扩展名），如 `button/basic` */
+    id: string;
+    /** 侧栏显示的标题，默认由文件名推导 */
+    title: string;
+    /** 一级分组名，等于场景所在目录名（按目录首字母大写化） */
+    group: string;
+    /** 相对项目根的 URL，用于动态 import */
+    path: string;
+    /** 绝对文件路径，用于展示与错误提示 */
+    file: string;
+    /** 相对项目根的路径，如 `src/scenes/button/basic.vue` */
+    rel: string;
+    /** 源码语言（固定 'vue'，源码面板高亮用） */
+    lang: 'vue';
+    /** 同层排序权重，未声明时为 Number.MAX_SAFE_INTEGER */
+    order: number;
+    /** sceneMeta.tags */
+    tags: string[] | null;
+    /** sceneMeta.description，显示在预览区上方 */
+    description: string | null;
+    /** sceneMeta.hideInNav：不进侧栏但可通过 URL 直达 */
+    hidden: boolean;
+    /** 懒加载场景组件 */
+    load: () => Promise<{
+        default: Component;
+    }>;
+    /** 懒加载场景源码（?raw） */
+    raw: () => Promise<string>;
+    /** 源码面板的文件列表：场景自身在前，sceneMeta.files 在后 */
+    sources: {
+        rel: string;
+        raw: () => Promise<string>;
+    }[];
+}