diff --git a/DEVELOPMENT_GUIDE.md b/DEVELOPMENT_GUIDE.md new file mode 100644 index 00000000..68e5cc26 --- /dev/null +++ b/DEVELOPMENT_GUIDE.md @@ -0,0 +1,169 @@ +# Soybean UI 开发指南 + +本文档旨在为 Soybean UI 项目提供一套从组件研发到文档生成的最佳实践,借鉴了业界优秀组件库 (如 Ant Design, Naive UI) 的经验,并力求简化开发流程、提高开发效率。 + +## 1. 核心理念 + +* **组件、示例、文档一体化**: 每个组件相关的源代码、使用示例 (demos) 和 Markdown API 文档应集中管理在其各自的目录中,方便开发、维护和查阅。 +* **专用开发预览**: 提供一个独立的开发预览环境,使开发者能快速、便捷地查看和调试正在开发的组件及其所有示例。 +* **文档驱动**: 组件的 `demos` 和 `API 文档` 直接作为最终用户文档的来源,由文档站点 (如 Nuxt) 解析和渲染。 + +## 2. 推荐项目结构 + +``` +soybean-ui/ +├── packages/ +│ ├── soy-ui/ # 核心 UI 组件库 (可发布为 npm 包) +│ │ ├── src/ +│ │ │ ├── components/ # 所有 UI 组件 +│ │ │ │ ├── Alert/ # Alert 组件示例目录 +│ │ │ │ │ ├── source/ # 源码文件夹 +│ │ │ │ │ │ ├── Alert.vue # Alert 组件源文件 +│ │ │ │ │ ├── demos/ # Alert 组件的示例 +│ │ │ │ │ │ ├── basic.vue +│ │ │ │ │ │ ├── with-icon.vue +│ │ │ │ │ │ └── index.ts # 导出此目录下所有 demo 组件 +│ │ │ │ │ ├── index.md # Alert 组件的 Markdown 文档 (API, 用法说明) +│ │ │ │ │ └── types.ts # Alert 组件的类型定义 (可选) +│ │ │ │ ├── Button/ +│ │ │ │ │ ├── source/ # 源码文件夹 +│ │ │ │ │ │ └── Button.vue +│ │ │ │ │ ├── demos/ +│ │ │ │ │ │ └── basic.vue +│ │ │ │ │ └── index.md +│ │ │ │ └── ... (其他组件) +│ │ │ ├── index.ts # 组件库入口,导出所有组件 +│ │ │ └── theme/ # 全局主题、样式等 +│ │ ├── package.json +│ │ └── vite.config.ts +│ ├── primitives/ # 基础工具/原子组件 (如果需要) +│ └── unocss-preset/ # UnoCSS 预设 +├── apps/ # 应用/示例项目 +│ ├── playground/ # 组件开发预览环境 (Vite + Vue) +│ │ ├── src/ +│ │ │ ├── App.vue +│ │ │ ├── main.ts +│ │ │ ├── pages/ # 动态加载 soy-ui 组件 demos 的页面 +│ │ │ └── router.ts +│ │ ├── package.json +│ │ └── vite.config.ts +│ └── official-site/ (原Nuxt 文档站) +│ ├── components/ # 文档站自身的组件 +│ ├── layouts/ +│ ├── pages/ # Nuxt 页面,包括动态路由用于渲染组件文档 +│ │ └── components/ +│ │ └── [...slug].vue # 捕获组件名并渲染对应文档和 demos +│ ├── nuxt.config.ts +│ └── package.json +├── scripts/ # 构建、生成等脚本 +├── package.json # Monorepo 根 package.json +├── tsconfig.json +└── DEVELOPMENT_GUIDE.md # 本开发指南 +└── NUXT_DOCS_SETUP_PLAN.md # Nuxt 文档站搭建计划 +``` + +**说明:** + +* **`packages/soy-ui`**: 这是核心组件库。 + * 每个组件 (如 `Alert`, `Button`) 都有自己的文件夹。 + * `demos/` 文件夹存放该组件的 `.vue` 格式使用示例,并通过一个 `index.ts` 文件导出所有这些示例。 + * `index.md` 是该组件的文档,用于描述 API、props、events、slots 以及如何使用。它可以直接引用或内嵌 `demos/` 中的示例。 +* **`apps/playground`**: 一个独立的 Vite/Vue3 应用。 + * 其主要目的是在开发 `soy-ui` 组件时,提供一个实时预览和调试的环境。 + * 它可以动态扫描 `packages/soy-ui/src/components/**/demos/index.ts` 文件,并提供一个界面来选择和展示这些 demos 模块中导出的所有组件。 + * 这将取代当前 `src/views/ui/index.vue` 和 `examples/` 目录的部分功能,使组件开发与主项目/其他示例项目解耦。 +* **`apps/official-site` (原 `docs_v2`)**: 基于 Nuxt 的官方文档站。 + * 它会读取 `packages/soy-ui/src/components/**/index.md` 作为 API 文档内容。 + * 它会解析并渲染 `packages/soy-ui/src/components/**/demos/*.vue` 作为交互式示例。 + +## 3. 开发新组件流程 + +1. **创建组件目录**: + 在 `packages/soy-ui/src/components/` 下创建新的组件文件夹,例如 `MyNewComponent`。 +2. **编写组件源码**: + 在 `MyNewComponent/` 下创建 `MyNewComponent.vue` 文件,并实现组件逻辑。 +3. **编写示例 (Demos)**: + 在 `MyNewComponent/demos/` 目录下创建 `.vue` 示例文件,如: + * `basic.vue` (基础用法) + * `advanced-features.vue` (高级特性展示) + 每个 demo 都应该是一个可以独立运行和展示特定用法的 Vue 组件。 + 同时,在该目录下创建一个 `index.ts` 文件,导出所有 `.vue` 示例。例如: + ```typescript + // MyNewComponent/demos/index.ts + export { default as BasicDemo } from './basic.vue'; + export { default as AdvancedFeaturesDemo } from './advanced-features.vue'; + ``` +4. **编写组件文档**: + 在 `MyNewComponent/` 下创建 `index.md` 文件。内容应包括: + * 组件简介和用途。 + * Props, Events, Slots, Methods 的 API 表格和说明。 + * 通过特定语法嵌入或引用 `demos/` 中的示例,并配以说明。 + * 设计规范、最佳实践等。 +5. **导出组件**: + 在 `packages/soy-ui/src/index.ts` (或相应的入口文件) 中导出新组件。 +6. **在 Playground 中预览和调试**: + * 启动 `apps/playground` 开发服务器。 + * Playground 应能自动发现新的 `MyNewComponent` 及其 `demos/index.ts`。 + * Playground 会加载 `index.ts` 模块,并展示其中导出的所有 demo 组件。 + * 通过 Playground 交互式地测试组件的各种状态和 props。 +7. **更新文档站 (可选,通常自动)**: + * 启动 `apps/official-site` (Nuxt 文档站) 开发服务器。 + * 文档站应能自动发现并展示新组件的 `index.md` 和 demos。 + +## 4. 运行开发环境 + +* **启动 Playground (用于组件开发)**: + ```bash + pnpm --filter ./apps/playground dev + ``` + (假设 `apps/playground/package.json` 中定义了 `dev` 脚本) + +* **启动文档站 (用于预览最终文档)**: + ```bash + pnpm --filter ./apps/official-site dev + ``` + (假设 `apps/official-site/package.json` 中定义了 `dev` 脚本) + +## 5. 编写与组织 Demos + +* **原子性**: 每个 demo `.vue` 文件应专注于展示组件的一个特定功能或用例。 +* **简洁性**: Demo 代码应尽可能简洁明了,移除不相关的逻辑。 +* **可直接运行**: Demo 本身就是一个完整的 Vue 组件片段,可以直接在 Playground 或文档中渲染。 +* **命名清晰**: Demo 文件名应能清晰反映其展示的内容,如 `disabled-state.vue`, `custom-icon.vue`。导出到 `index.ts` 时也建议使用清晰的导出名 (如 `BasicDemo`, `CustomIconDemo`)。 +* **`index.ts` 聚合**: 每个组件的 `demos` 目录下应包含一个 `index.ts` 文件,该文件负责导出目录内所有的 `.vue` demo 组件。这使得 Playground 或其他工具可以方便地一次性导入所有相关的 demos。 + +## 6. 文档编写 (Markdown) + +* 组件的 `index.md` 是其官方文档的核心。 +* **API 文档**: 清晰列出 Props, Events, Slots, Methods 等,并提供类型、默认值和描述。 +* **代码示例**: 使用 Markdown 的代码块语法展示简短的用法片段。 +* **嵌入 Demos**: + 文档站 (Nuxt) 需要实现一种机制,允许在 Markdown 中通过特定语法引用并渲染 `demos/` 目录下的 `.vue` 文件。例如: + ```markdown + ## 基础用法 + + + + ## 带图标的 Alert + + + ``` + 这里的 `` 是一个需要在 Nuxt 文档站中实现的自定义组件,它会加载并显示对应的 demo 文件,并可能提供查看源码、复制代码等功能。 + +## 7. 废弃 `examples/` 目录 + +当前的 `examples/` 目录的功能将被以下两者取代: + +1. **组件级 Demos**: 分散到 `packages/soy-ui/src/components//demos/` 中。 +2. **Playground 应用**: `apps/playground/` 提供集中的组件开发和预览环境。 + +如果 `examples/` 还承载了其他更复杂的集成示例或项目模板,可以考虑将其保留并重命名,或者将其内容迁移到 `apps/` 目录下作为单独的示例项目。 + +## 8. 总结 + +通过上述结构和流程调整,期望可以: + +* **降低维护成本**: 组件代码、示例和文档物理上更接近,修改和同步更容易。 +* **提升开发体验**: Playground 为组件开发提供即时反馈。 +* **改善文档质量**: Demos 直接来源于开发过程,保证了示例的准确性和实用性。 +* **清晰的职责分离**: `soy-ui` 聚焦于组件实现,`playground` 聚焦于开发预览,`official-site` 聚焦于最终用户文档。 diff --git a/NUXT_DOCS_SETUP_PLAN.md b/NUXT_DOCS_SETUP_PLAN.md new file mode 100644 index 00000000..9603aa7f --- /dev/null +++ b/NUXT_DOCS_SETUP_PLAN.md @@ -0,0 +1,109 @@ +# Nuxt.js Documentation Site Setup Plan for Soybean UI + +This document outlines the steps and considerations for building the new documentation website for Soybean UI using Nuxt.js. The goal is to create a modern, performant, and maintainable documentation site, inspired by sites like Shadcn UI, while also incorporating multi-language support. + +## Phase 1: Project Setup and Basic Structure + +1. **Initialize Nuxt Project:** + * Create a new Nuxt project within the `apps/official-site` directory (as defined in `DEVELOPMENT_GUIDE.md`). + * Command: `pnpm dlx nuxi@latest init apps/official-site` + * Choose appropriate settings (TypeScript, package manager pnpm). + +2. **Basic Layout and Pages:** + * Design a default layout (`layouts/default.vue`) including a header, sidebar (for navigation), and a main content area. + * Create an initial `pages/index.vue` for the homepage. + * Set up basic routing. + +3. **Integrate UnoCSS:** + * Add UnoCSS to the Nuxt project for styling, leveraging `@soybean-ui/unocss-preset` if possible or creating a compatible configuration. + * Ensure UnoCSS works correctly within Nuxt components and Markdown-generated content. + +4. **Directory Structure for Content:** + * Confirm the strategy for sourcing component documentation: + * Markdown files: `packages/soy-ui/src/components//index.md` + * Demo files: `packages/soy-ui/src/components//demos/*.vue` + +## Phase 2: Content Rendering and Component Integration + +1. **Markdown Rendering:** + * Choose and configure a Nuxt module for Markdown rendering (e.g., `@nuxt/content`). + * Ensure it can parse frontmatter from `index.md` files for metadata (title, description, etc.). + * Style the rendered HTML output to match the design. + +2. **Dynamic Component Pages:** + * Create a dynamic route, e.g., `pages/components/[...slug].vue`. + * This page will fetch and render the `index.md` content for the corresponding component based on the slug. + * The slug should map to component names (e.g., `alert`, `button`). + +3. **Demo Rendering (`` Component):** + * Develop a global Nuxt component (e.g., `` or similar name as `` in `DEVELOPMENT_GUIDE.md`). + * This component will be used within Markdown files to embed live demos. + * It should dynamically load and render `.vue` demo files from `packages/soy-ui/src/components//demos/.vue`. + * Features for ``: + * Display the rendered demo. + * Option to view the source code of the demo. + * Option to copy the source code. + * Potentially link to a playground environment (e.g., StackBlitz, CodeSandbox, or the local `apps/playground`). + +4. **Automatic Navigation/Sidebar Generation:** + * The sidebar should list all available components, grouped категоріями (if applicable). + * This list should be generated dynamically by scanning the `packages/soy-ui/src/components/` directory or from a configuration file. + * Clicking a component name should navigate to its documentation page. + +## Phase 3: Enhancements and Features + +1. **Search Functionality:** + * Implement search across component documentation (API, descriptions). + * Consider using `@nuxt/content`'s built-in search or integrating a service like Algolia. + +2. **Multi-language Support (i18n):** + * Integrate `@nuxtjs/i18n` or a similar Nuxt i18n module. + * Plan the structure for translated Markdown content and demo descriptions. + * Option 1: `index.en.md`, `index.zh.md` + * Option 2: Subdirectories per locale, e.g., `en/index.md`, `zh/index.md`. + * Implement a language switcher UI element. + * Ensure demos and their textual descriptions can also be localized if necessary. + +3. **Theme Customization (Dark Mode, Primary Color):** + * Implement a theme switcher for dark/light mode, similar to the current setup. + * Allow users to preview components with different primary colors (if this is a feature of `soy-ui`). This might involve dynamic CSS variable changes. + +4. **SEO and Meta Tags:** + * Ensure proper meta tags (title, description) are generated for each page. + * Utilize Nuxt's head management features. + +5. **Shadcn UI Inspired Design:** + * Adopt a clean, modern aesthetic similar to `ui.shadcn.com`. + * Focus on typography, spacing, and overall user experience. + * The `` component should be a key focus for a polished look and feel. + +## Phase 4: Build, Deployment, and Maintenance + +1. **Static Site Generation (SSG):** + * Configure Nuxt for full static site generation for optimal performance. + * Command: `pnpm --filter ./apps/official-site generate` (or similar, based on Nuxt version). + +2. **Deployment:** + * Choose a hosting platform (e.g., Vercel, Netlify, GitHub Pages). + * Set up CI/CD pipeline to automatically build and deploy the site on changes to the `main` branch or specific documentation-related branches/tags. + +3. **Maintenance Plan:** + * Document how to add new component documentation. + * Keep Nuxt and its dependencies updated. + +## Key Technologies and Modules (Tentative) + +* **Framework:** Nuxt.js 3 +* **Styling:** UnoCSS (with `@soybean-ui/unocss-preset`) +* **Content:** `@nuxt/content` (or alternative Markdown/Vue component rendering solution) +* **i18n:** `@nuxtjs/i18n` +* **State Management (if needed):** Pinia (comes with Nuxt 3) +* **UI Components (for the docs site itself):** Potentially use `soy-ui` components if stable, or build simple ones. + +## Open Questions / Decisions to be Made + +* Exact mechanism for the `` component to resolve and load `.vue` demo files from a different package (`packages/soy-ui`) within the Nuxt app (`apps/official-site`). This might involve Vite/Nuxt configuration for aliasing or custom loaders/plugins. +* Strategy for managing API tables in Markdown (manual, or generated from JSDoc/TSDoc comments). +* Specific UI design details and component choices for the documentation site itself. + +This plan will be updated as the project progresses. diff --git a/apps/official-site/.gitignore b/apps/official-site/.gitignore new file mode 100644 index 00000000..4a7f73a2 --- /dev/null +++ b/apps/official-site/.gitignore @@ -0,0 +1,24 @@ +# Nuxt dev/build outputs +.output +.data +.nuxt +.nitro +.cache +dist + +# Node dependencies +node_modules + +# Logs +logs +*.log + +# Misc +.DS_Store +.fleet +.idea + +# Local env files +.env +.env.* +!.env.example diff --git a/apps/official-site/README.md b/apps/official-site/README.md new file mode 100644 index 00000000..25b58212 --- /dev/null +++ b/apps/official-site/README.md @@ -0,0 +1,75 @@ +# Nuxt Minimal Starter + +Look at the [Nuxt documentation](https://nuxt.com/docs/getting-started/introduction) to learn more. + +## Setup + +Make sure to install dependencies: + +```bash +# npm +npm install + +# pnpm +pnpm install + +# yarn +yarn install + +# bun +bun install +``` + +## Development Server + +Start the development server on `http://localhost:3000`: + +```bash +# npm +npm run dev + +# pnpm +pnpm dev + +# yarn +yarn dev + +# bun +bun run dev +``` + +## Production + +Build the application for production: + +```bash +# npm +npm run build + +# pnpm +pnpm build + +# yarn +yarn build + +# bun +bun run build +``` + +Locally preview production build: + +```bash +# npm +npm run preview + +# pnpm +pnpm preview + +# yarn +yarn preview + +# bun +bun run preview +``` + +Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information. diff --git a/apps/official-site/app.vue b/apps/official-site/app.vue new file mode 100644 index 00000000..09f935bb --- /dev/null +++ b/apps/official-site/app.vue @@ -0,0 +1,6 @@ + + + + + + diff --git a/apps/official-site/nuxt.config.ts b/apps/official-site/nuxt.config.ts new file mode 100644 index 00000000..8ae12e6c --- /dev/null +++ b/apps/official-site/nuxt.config.ts @@ -0,0 +1,5 @@ +// https://nuxt.com/docs/api/configuration/nuxt-config +export default defineNuxtConfig({ + compatibilityDate: '2024-11-01', + devtools: { enabled: true } +}) diff --git a/apps/official-site/package.json b/apps/official-site/package.json new file mode 100644 index 00000000..5dcb4ef3 --- /dev/null +++ b/apps/official-site/package.json @@ -0,0 +1,17 @@ +{ + "name": "nuxt-app", + "private": true, + "type": "module", + "scripts": { + "build": "nuxt build", + "dev": "nuxt dev", + "generate": "nuxt generate", + "preview": "nuxt preview", + "postinstall": "nuxt prepare" + }, + "dependencies": { + "nuxt": "^3.17.3", + "vue": "^3.5.13", + "vue-router": "^4.5.1" + } +} diff --git a/apps/official-site/public/favicon.ico b/apps/official-site/public/favicon.ico new file mode 100644 index 00000000..18993ad9 Binary files /dev/null and b/apps/official-site/public/favicon.ico differ diff --git a/apps/official-site/public/robots.txt b/apps/official-site/public/robots.txt new file mode 100644 index 00000000..0ad279c7 --- /dev/null +++ b/apps/official-site/public/robots.txt @@ -0,0 +1,2 @@ +User-Agent: * +Disallow: diff --git a/apps/official-site/server/tsconfig.json b/apps/official-site/server/tsconfig.json new file mode 100644 index 00000000..b9ed69c1 --- /dev/null +++ b/apps/official-site/server/tsconfig.json @@ -0,0 +1,3 @@ +{ + "extends": "../.nuxt/tsconfig.server.json" +} diff --git a/apps/official-site/tsconfig.json b/apps/official-site/tsconfig.json new file mode 100644 index 00000000..a746f2a7 --- /dev/null +++ b/apps/official-site/tsconfig.json @@ -0,0 +1,4 @@ +{ + // https://nuxt.com/docs/guide/concepts/typescript + "extends": "./.nuxt/tsconfig.json" +} diff --git a/apps/playground/.editorconfig b/apps/playground/.editorconfig new file mode 100644 index 00000000..0552777e --- /dev/null +++ b/apps/playground/.editorconfig @@ -0,0 +1,11 @@ +# Editor configuration, see http://editorconfig.org + +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +trim_trailing_whitespace = true +insert_final_newline = true diff --git a/apps/playground/.npmrc b/apps/playground/.npmrc new file mode 100644 index 00000000..dfc2d686 --- /dev/null +++ b/apps/playground/.npmrc @@ -0,0 +1,4 @@ +registry=https://registry.npmmirror.com/ +shamefully-hoist=true +ignore-workspace-root-check=true +link-workspace-packages=true diff --git a/apps/playground/eslint.config.js b/apps/playground/eslint.config.js new file mode 100644 index 00000000..e8b3ede5 --- /dev/null +++ b/apps/playground/eslint.config.js @@ -0,0 +1,30 @@ +import { defineConfig } from '@soybeanjs/eslint-config'; + +export default defineConfig( + { vue: true, unocss: true }, + { + rules: { + '@typescript-eslint/no-empty-object-type': 'off', + '@typescript-eslint/no-empty-interface': 'off', + '@typescript-eslint/no-invalid-void-type': 'off', + 'consistent-return': 'off', + 'guard-for-in': 'off', + 'max-params': ['warn', 5], + 'no-warning-comments': 'off', + 'no-plusplus': 'off', + 'no-underscore-dangle': 'off', + '@typescript-eslint/no-unsafe-function-type': 'off', + 'unocss/order-attributify': 'off', + 'vue/multi-word-component-names': 'off', + 'vue/no-static-inline-styles': 'off', + 'vue/require-default-prop': 'off', + 'vue/return-in-computed-property': 'off' + } + }, + { + files: ['**/*.vue'], + rules: { + 'n/prefer-global/process': 'off' + } + } +); diff --git a/apps/playground/index.html b/apps/playground/index.html new file mode 100644 index 00000000..67d4191f --- /dev/null +++ b/apps/playground/index.html @@ -0,0 +1,14 @@ + + + + + + + + SoybeanUI + + + + + + diff --git a/apps/playground/package.json b/apps/playground/package.json new file mode 100644 index 00000000..6c6c2792 --- /dev/null +++ b/apps/playground/package.json @@ -0,0 +1,97 @@ +{ + "name": "soybean-ui", + "type": "module", + "version": "0.0.2-beta.4", + "private": true, + "packageManager": "pnpm@10.11.0", + "description": "soybean-ui is an ui library like shadcn for Vue3.", + "author": { + "name": "Soybean", + "email": "soybeanjs@outlook.com", + "url": "https://github.com/soybeanjs" + }, + "license": "MIT", + "homepage": "https://github.com/soybeanjs/soybean-ui", + "repository": { + "url": "https://github.com/soybeanjs/soybean-ui.git" + }, + "bugs": { + "url": "https://github.com/soybeanjs/soybean-ui/issues" + }, + "keywords": [ + "UI", + "UnoCSS", + "shadcn-ui", + "vue3" + ], + "scripts": { + "build": "pnpm build:pkg && vite build", + "build-only": "vite build", + "build:docs": "pnpm build:pkg && pnpm -r --filter=\"./docs\" run build", + "build:pkg": "pnpm -r --filter=\"./packages/**\" run build", + "build:primitives": "pnpm -r --filter=\"./packages/primitives\" run build", + "build:ui": "pnpm -r --filter=\"./packages/ui\" run build", + "cleanup": "soy cleanup", + "commit": "soy git-commit", + "dev": "vite", + "dev:docs": "pnpm -r --filter=\"./docs\" run dev", + "generate": "tsx scripts/generate.ts", + "lint": "eslint . --fix", + "prepare": "simple-git-hooks", + "preview": "vite preview", + "preview:docs": "pnpm -r --filter=\"./docs\" run preview", + "publish-pkg": "pnpm -r publish --access public", + "rebuild-code": "tsx scripts/code.ts", + "release": "soy release", + "restore": "tsx scripts/restore.ts", + "stub": "tsx scripts/stub.ts", + "typecheck": "vue-tsc --noEmit --skipLibCheck", + "update-pkg": "soy update-pkg" + }, + "dependencies": { + "@soybean-ui/examples": "workspace:*", + "@unocss/reset": "66.1.1", + "@vee-validate/valibot": "4.15.0", + "@vueuse/core": "13.1.0", + "@vueuse/router": "13.1.0", + "es-toolkit": "1.37.2", + "lucide-vue-next": "0.509.0", + "soy-ui": "workspace:*", + "valibot": "1.1.0", + "vue": "3.5.13", + "vue-router": "4.5.1" + }, + "devDependencies": { + "@soybean-ui/unocss-preset": "workspace:*", + "@soybeanjs/cli": "1.2.1", + "@soybeanjs/eslint-config": "1.6.0", + "@soybeanjs/unocss-preset": "0.1.1", + "@types/node": "22.15.17", + "@unocss/eslint-config": "66.1.1", + "@vitejs/plugin-vue": "5.2.4", + "@vitejs/plugin-vue-jsx": "4.1.2", + "@vue/shared": "3.5.13", + "embla-carousel": "8.6.0", + "enquirer": "2.4.1", + "eslint": "9.26.0", + "eslint-plugin-vue": "10.1.0", + "grapheme-splitter": "1.0.4", + "lint-staged": "16.0.0", + "simple-git-hooks": "2.13.0", + "tsx": "4.19.4", + "typescript": "5.8.3", + "unocss": "66.1.1", + "unocss-preset-animations": "1.2.1", + "vite": "6.3.5", + "vite-plugin-vue-devtools": "7.7.6", + "vue-eslint-parser": "10.1.3", + "vue-tsc": "2.2.10" + }, + "simple-git-hooks": { + "commit-msg": "pnpm soy git-commit-verify", + "pre-commit": "pnpm typecheck && pnpm lint-staged" + }, + "lint-staged": { + "*": "eslint --fix" + } +} diff --git a/public/favicon.svg b/apps/playground/public/favicon.svg similarity index 100% rename from public/favicon.svg rename to apps/playground/public/favicon.svg diff --git a/src/App.vue b/apps/playground/src/App.vue similarity index 100% rename from src/App.vue rename to apps/playground/src/App.vue diff --git a/apps/playground/src/components/theme-customizer.vue b/apps/playground/src/components/theme-customizer.vue new file mode 100644 index 00000000..55110c42 --- /dev/null +++ b/apps/playground/src/components/theme-customizer.vue @@ -0,0 +1,107 @@ + + + + + + Customize + Pick a style and color for your components. + + + Color + + + + + + + + {{ key }} + + + + + + + Radius + + + {{ r }} + + + + + Size + + + {{ s }} + + + + + diff --git a/apps/playground/src/components/theme-size-toggler.vue b/apps/playground/src/components/theme-size-toggler.vue new file mode 100644 index 00000000..d68ca356 --- /dev/null +++ b/apps/playground/src/components/theme-size-toggler.vue @@ -0,0 +1,22 @@ + + + + + Size: + + + diff --git a/src/main.ts b/apps/playground/src/main.ts similarity index 100% rename from src/main.ts rename to apps/playground/src/main.ts diff --git a/src/router/index.ts b/apps/playground/src/router/index.ts similarity index 100% rename from src/router/index.ts rename to apps/playground/src/router/index.ts diff --git a/src/views/demo/index.vue b/apps/playground/src/views/demo/index.vue similarity index 100% rename from src/views/demo/index.vue rename to apps/playground/src/views/demo/index.vue diff --git a/apps/playground/src/views/ui/components/DemosRenderer.vue b/apps/playground/src/views/ui/components/DemosRenderer.vue new file mode 100644 index 00000000..937d611e --- /dev/null +++ b/apps/playground/src/views/ui/components/DemosRenderer.vue @@ -0,0 +1,84 @@ + + + + + Loading demos... + + + Error loading demos: + {{ error.message || error }} + Check the browser console for more details. + + + + + {{ formatDemoName(name) }} + + + + + + No demos found for this component. + + diff --git a/src/views/ui/index.vue b/apps/playground/src/views/ui/index.vue similarity index 64% rename from src/views/ui/index.vue rename to apps/playground/src/views/ui/index.vue index 0615c581..1f07db10 100644 --- a/src/views/ui/index.vue +++ b/apps/playground/src/views/ui/index.vue @@ -1,21 +1,21 @@ @@ -83,10 +99,10 @@ Object.entries(ExampleComponents).forEach(([key, component]) => { trigger: 'flex-none' }" > - + - + diff --git a/apps/playground/tsconfig.json b/apps/playground/tsconfig.json new file mode 100644 index 00000000..4ef3abd6 --- /dev/null +++ b/apps/playground/tsconfig.json @@ -0,0 +1,10 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "baseUrl": ".", + "paths": { + "@/*": ["src/*"] + } + }, + "include": ["./**/*.ts", "./**/*.tsx", "./**/*.vue"] +} diff --git a/uno.config.ts b/apps/playground/uno.config.ts similarity index 100% rename from uno.config.ts rename to apps/playground/uno.config.ts diff --git a/apps/playground/vite.config.ts b/apps/playground/vite.config.ts new file mode 100644 index 00000000..8c38da6c --- /dev/null +++ b/apps/playground/vite.config.ts @@ -0,0 +1,35 @@ +import process from 'node:process'; +import { URL, fileURLToPath } from 'node:url'; +import { defineConfig } from 'vite'; +import vue from '@vitejs/plugin-vue'; +import vueJsx from '@vitejs/plugin-vue-jsx'; +import unocss from 'unocss/vite'; + +export default defineConfig({ + resolve: { + alias: { + '~': fileURLToPath(new URL('./', import.meta.url)), + '@': fileURLToPath(new URL('./src', import.meta.url)), + '~packages': fileURLToPath(new URL('../../packages', import.meta.url)) + } + }, + define: { + 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV) + }, + plugins: [vue({ include: ['**/*.vue', 'packages/**/*.vue'] }), vueJsx(), unocss()], + server: { + host: '0.0.0.0', + port: 1997, + open: true + }, + preview: { + port: 9725 + }, + build: { + reportCompressedSize: false, + sourcemap: true, + commonjsOptions: { + ignoreTryCatch: false + } + } +}); diff --git a/examples/src/index.ts b/examples/src/index.ts index a20103d8..ad74afec 100644 --- a/examples/src/index.ts +++ b/examples/src/index.ts @@ -1,108 +1,3 @@ import ThemeCustomizer from './components/theme-customizer.vue'; -import DemoAlert from './ui/alert.vue'; -import DemoAlertDialog from './ui/alert-dialog.vue'; -import DemoAspectRatio from './ui/aspect-ratio.vue'; -import DemoAvatar from './ui/avatar.vue'; -import DemoBadge from './ui/badge.vue'; -import DemoBreadcrumb from './ui/breadcrumb.vue'; -import DemoButton from './ui/button.vue'; -import DemoCard from './ui/card.vue'; -import DemoCarousel from './ui/carousel.vue'; -import DemoCheckbox from './ui/checkbox.vue'; -import DemoChip from './ui/chip.vue'; -import DemoCollapsible from './ui/collapsible.vue'; -import DemoCombobox from './ui/combobox.vue'; -import DemoCommand from './ui/command.vue'; -import DemoContextMenu from './ui/context-menu.vue'; -import DemoDialog from './ui/dialog.vue'; -import DemoDrawer from './ui/drawer.vue'; -import DemoDropdownMenu from './ui/dropdown-menu.vue'; -import DemoForm from './ui/form.vue'; -import DemoHoverCard from './ui/hover-card.vue'; -import DemoInput from './ui/input.vue'; -import DemoKeyboardKey from './ui/keyboard-key.vue'; -import DemoLayout from './ui/layout.vue'; -import DemoMenubar from './ui/menubar.vue'; -import DemoNavigationMenu from './ui/navigation-menu.vue'; -import DemoNumberField from './ui/number-field.vue'; -import DemoPagination from './ui/pagination.vue'; -import DemoPinInput from './ui/pin-input.vue'; -import DemoPopover from './ui/popover.vue'; -import DemoProgress from './ui/progress.vue'; -import DemoRadio from './ui/radio.vue'; -import DemoResizable from './ui/resizable.vue'; -import DemoScrollArea from './ui/scroll-area.vue'; -import DemoSegment from './ui/segment.vue'; -import DemoSelect from './ui/select.vue'; -import DemoSeparator from './ui/separator.vue'; -import DemoSheet from './ui/sheet.vue'; -import DemoSidebarMenu from './ui/sidebar-menu.vue'; -import DemoSkeleton from './ui/skeleton.vue'; -import DemoSlider from './ui/slider.vue'; -import DemoSonner from './ui/sonner.vue'; -import DemoStepper from './ui/stepper.vue'; -import DemoSwitch from './ui/switch.vue'; -import DemoTabs from './ui/tabs.vue'; -import DemoTagsInput from './ui/tags-input.vue'; -import DemoTextarea from './ui/textarea.vue'; -import DemoToast from './ui/toast.vue'; -import DemoToggle from './ui/toggle.vue'; -import DemoToggleGroup from './ui/toggle-group.vue'; -import DemoTooltip from './ui/tooltip.vue'; -export * from './ui/button/index'; -export * from './ui/accordion'; - -export { - ThemeCustomizer, - DemoAlert, - DemoAlertDialog, - DemoAspectRatio, - DemoAvatar, - DemoBadge, - DemoBreadcrumb, - DemoButton, - DemoCard, - DemoCarousel, - DemoCheckbox, - DemoChip, - DemoCollapsible, - DemoCombobox, - DemoCommand, - DemoContextMenu, - DemoDialog, - DemoDrawer, - DemoDropdownMenu, - DemoForm, - DemoHoverCard, - DemoInput, - DemoKeyboardKey, - DemoLayout, - DemoMenubar, - DemoNavigationMenu, - DemoNumberField, - DemoPagination, - DemoPinInput, - DemoPopover, - DemoProgress, - DemoRadio, - DemoResizable, - DemoScrollArea, - DemoSegment, - DemoSelect, - DemoSeparator, - DemoSheet, - DemoSidebarMenu, - DemoSkeleton, - DemoSlider, - DemoSonner, - DemoStepper, - DemoSwitch, - DemoTabs, - DemoTagsInput, - DemoTextarea, - DemoToast, - DemoToggle, - DemoToggleGroup, - DemoTooltip -}; +export { ThemeCustomizer }; diff --git a/examples/src/ui/accordion/accordion.vue b/examples/src/ui/accordion/accordion.vue deleted file mode 100644 index 92a498fb..00000000 --- a/examples/src/ui/accordion/accordion.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - - - - - - diff --git a/examples/src/ui/button/index.ts b/examples/src/ui/button/index.ts deleted file mode 100644 index 4362d076..00000000 --- a/examples/src/ui/button/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -import DemoButtonColor from './color.vue'; - -export { DemoButtonColor }; diff --git a/package.json b/package.json index 6086c3b7..d5dfc1b3 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "type": "module", "version": "0.0.2-beta.4", "private": true, - "packageManager": "pnpm@10.10.0", + "packageManager": "pnpm@10.11.0", "description": "soybean-ui is an ui library like shadcn for Vue3.", "author": { "name": "Soybean", @@ -18,17 +18,19 @@ "bugs": { "url": "https://github.com/soybeanjs/soybean-ui/issues" }, - "keywords": ["UI", "UnoCSS", "shadcn-ui", "vue3"], + "keywords": [ + "UI", + "UnoCSS", + "shadcn-ui", + "vue3" + ], "scripts": { - "build": "pnpm build:pkg && vite build", - "build-only": "vite build", "build:docs": "pnpm build:pkg && pnpm -r --filter=\"./docs\" run build", "build:pkg": "pnpm -r --filter=\"./packages/**\" run build", "build:primitives": "pnpm -r --filter=\"./packages/primitives\" run build", "build:ui": "pnpm -r --filter=\"./packages/ui\" run build", "cleanup": "soy cleanup", "commit": "soy git-commit", - "dev": "vite", "dev:docs": "pnpm -r --filter=\"./docs\" run dev", "generate": "tsx scripts/generate.ts", "lint": "eslint . --fix", @@ -43,44 +45,14 @@ "typecheck": "vue-tsc --noEmit --skipLibCheck", "update-pkg": "soy update-pkg" }, - "dependencies": { - "@soybean-ui/examples": "workspace:*", - "@unocss/reset": "66.1.1", - "@vee-validate/valibot": "4.15.0", - "@vueuse/core": "13.1.0", - "@vueuse/router": "13.1.0", - "es-toolkit": "1.37.2", - "lucide-vue-next": "0.509.0", - "soy-ui": "workspace:*", - "valibot": "1.1.0", - "vue": "3.5.13", - "vue-router": "4.5.1" - }, "devDependencies": { - "@soybean-ui/unocss-preset": "workspace:*", "@soybeanjs/cli": "1.2.1", "@soybeanjs/eslint-config": "1.6.0", - "@soybeanjs/unocss-preset": "0.1.1", - "@types/node": "22.15.17", "@unocss/eslint-config": "66.1.1", - "@vitejs/plugin-vue": "5.2.4", - "@vitejs/plugin-vue-jsx": "4.1.2", - "@vue/shared": "3.5.13", - "embla-carousel": "8.6.0", - "enquirer": "2.4.1", "eslint": "9.26.0", "eslint-plugin-vue": "10.1.0", - "grapheme-splitter": "1.0.4", - "lint-staged": "16.0.0", "simple-git-hooks": "2.13.0", - "tsx": "4.19.4", - "typescript": "5.8.3", - "unocss": "66.1.1", - "unocss-preset-animations": "1.2.1", - "vite": "6.3.5", - "vite-plugin-vue-devtools": "7.7.6", - "vue-eslint-parser": "10.1.3", - "vue-tsc": "2.2.10" + "vue-eslint-parser": "10.1.3" }, "simple-git-hooks": { "commit-msg": "pnpm soy git-commit-verify", @@ -88,5 +60,8 @@ }, "lint-staged": { "*": "eslint --fix" + }, + "dependencies": { + "soybean-ui": "link:" } } diff --git a/examples/src/ui/accordion/custom-icon.vue b/packages/soy-ui/src/components/accordion/demos/custom-icon.vue similarity index 100% rename from examples/src/ui/accordion/custom-icon.vue rename to packages/soy-ui/src/components/accordion/demos/custom-icon.vue diff --git a/examples/src/ui/accordion/custom-styling.vue b/packages/soy-ui/src/components/accordion/demos/custom-styling.vue similarity index 100% rename from examples/src/ui/accordion/custom-styling.vue rename to packages/soy-ui/src/components/accordion/demos/custom-styling.vue diff --git a/packages/soy-ui/src/components/accordion/demos/debug.vue b/packages/soy-ui/src/components/accordion/demos/debug.vue new file mode 100644 index 00000000..2f443f50 --- /dev/null +++ b/packages/soy-ui/src/components/accordion/demos/debug.vue @@ -0,0 +1,7 @@ + + + + debug + diff --git a/examples/src/ui/accordion/index.ts b/packages/soy-ui/src/components/accordion/demos/index.ts similarity index 86% rename from examples/src/ui/accordion/index.ts rename to packages/soy-ui/src/components/accordion/demos/index.ts index c0cd1814..bfcabc0e 100644 --- a/examples/src/ui/accordion/index.ts +++ b/packages/soy-ui/src/components/accordion/demos/index.ts @@ -3,7 +3,7 @@ import DemoAccordionMultiple from './multiple.vue'; import DemoAccordionCustomStyling from './custom-styling.vue'; import DemoAccordionCustomIcon from './custom-icon.vue'; import DemoAccordionSize from './size.vue'; -import DemoAccordion from './accordion.vue'; +import DemoDebug from './debug.vue'; export { DemoAccordionSingle, @@ -11,5 +11,5 @@ export { DemoAccordionCustomStyling, DemoAccordionCustomIcon, DemoAccordionSize, - DemoAccordion + DemoDebug }; diff --git a/examples/src/ui/accordion/multiple.vue b/packages/soy-ui/src/components/accordion/demos/multiple.vue similarity index 100% rename from examples/src/ui/accordion/multiple.vue rename to packages/soy-ui/src/components/accordion/demos/multiple.vue diff --git a/examples/src/ui/accordion/single.vue b/packages/soy-ui/src/components/accordion/demos/single.vue similarity index 100% rename from examples/src/ui/accordion/single.vue rename to packages/soy-ui/src/components/accordion/demos/single.vue diff --git a/examples/src/ui/accordion/size.vue b/packages/soy-ui/src/components/accordion/demos/size.vue similarity index 100% rename from examples/src/ui/accordion/size.vue rename to packages/soy-ui/src/components/accordion/demos/size.vue diff --git a/packages/soy-ui/src/components/accordion/index.ts b/packages/soy-ui/src/components/accordion/index.ts index afeadc74..7def617f 100644 --- a/packages/soy-ui/src/components/accordion/index.ts +++ b/packages/soy-ui/src/components/accordion/index.ts @@ -1,9 +1,9 @@ -import SAccordion from './accordion.vue'; -import SAccordionContent from './accordion-content.vue'; -import SAccordionHeader from './accordion-header.vue'; -import SAccordionItem from './accordion-item.vue'; -import SAccordionRoot from './accordion-root.vue'; -import SAccordionTrigger from './accordion-trigger.vue'; +import SAccordion from './source/accordion.vue'; +import SAccordionContent from './source/accordion-content.vue'; +import SAccordionHeader from './source/accordion-header.vue'; +import SAccordionItem from './source/accordion-item.vue'; +import SAccordionRoot from './source/accordion-root.vue'; +import SAccordionTrigger from './source/accordion-trigger.vue'; export { SAccordion, SAccordionContent, SAccordionHeader, SAccordionItem, SAccordionRoot, SAccordionTrigger }; diff --git a/packages/soy-ui/src/components/accordion/accordion-content.vue b/packages/soy-ui/src/components/accordion/source/accordion-content.vue similarity index 92% rename from packages/soy-ui/src/components/accordion/accordion-content.vue rename to packages/soy-ui/src/components/accordion/source/accordion-content.vue index ad92c716..26d11d8b 100644 --- a/packages/soy-ui/src/components/accordion/accordion-content.vue +++ b/packages/soy-ui/src/components/accordion/source/accordion-content.vue @@ -2,7 +2,7 @@ import { computed } from 'vue'; import { AccordionContent, useForwardProps } from '@soybean-ui/primitives'; import { accordionVariants, cn } from '@soybean-ui/variants'; -import type { AccordionContentProps } from './types'; +import type { AccordionContentProps } from '../types'; defineOptions({ name: 'SAccordionContent' diff --git a/packages/soy-ui/src/components/accordion/accordion-header.vue b/packages/soy-ui/src/components/accordion/source/accordion-header.vue similarity index 91% rename from packages/soy-ui/src/components/accordion/accordion-header.vue rename to packages/soy-ui/src/components/accordion/source/accordion-header.vue index 255e0ac5..6ec71013 100644 --- a/packages/soy-ui/src/components/accordion/accordion-header.vue +++ b/packages/soy-ui/src/components/accordion/source/accordion-header.vue @@ -2,7 +2,7 @@ import { computed } from 'vue'; import { AccordionHeader, useForwardProps } from '@soybean-ui/primitives'; import { accordionVariants, cn } from '@soybean-ui/variants'; -import type { AccordionHeaderProps } from './types'; +import type { AccordionHeaderProps } from '../types'; defineOptions({ name: 'SAccordionHeader' diff --git a/packages/soy-ui/src/components/accordion/accordion-item.vue b/packages/soy-ui/src/components/accordion/source/accordion-item.vue similarity index 92% rename from packages/soy-ui/src/components/accordion/accordion-item.vue rename to packages/soy-ui/src/components/accordion/source/accordion-item.vue index cbe4030a..c21e5666 100644 --- a/packages/soy-ui/src/components/accordion/accordion-item.vue +++ b/packages/soy-ui/src/components/accordion/source/accordion-item.vue @@ -2,7 +2,7 @@ import { computed } from 'vue'; import { AccordionItem, useForwardProps } from '@soybean-ui/primitives'; import { accordionVariants, cn } from '@soybean-ui/variants'; -import type { AccordionItemProps } from './types'; +import type { AccordionItemProps } from '../types'; defineOptions({ name: 'SAccordionItem' diff --git a/packages/soy-ui/src/components/accordion/accordion-root.vue b/packages/soy-ui/src/components/accordion/source/accordion-root.vue similarity index 91% rename from packages/soy-ui/src/components/accordion/accordion-root.vue rename to packages/soy-ui/src/components/accordion/source/accordion-root.vue index 5a0c5318..3aacfcd6 100644 --- a/packages/soy-ui/src/components/accordion/accordion-root.vue +++ b/packages/soy-ui/src/components/accordion/source/accordion-root.vue @@ -2,7 +2,7 @@ import { computed } from 'vue'; import { AccordionRoot, useCombinedPropsEmits } from '@soybean-ui/primitives'; import { accordionVariants, cn } from '@soybean-ui/variants'; -import type { AccordionRootEmits, AccordionRootProps } from './types'; +import type { AccordionRootEmits, AccordionRootProps } from '../types'; defineOptions({ name: 'SAccordionRoot' diff --git a/packages/soy-ui/src/components/accordion/accordion-trigger.vue b/packages/soy-ui/src/components/accordion/source/accordion-trigger.vue similarity index 95% rename from packages/soy-ui/src/components/accordion/accordion-trigger.vue rename to packages/soy-ui/src/components/accordion/source/accordion-trigger.vue index 3234d724..27164b44 100644 --- a/packages/soy-ui/src/components/accordion/accordion-trigger.vue +++ b/packages/soy-ui/src/components/accordion/source/accordion-trigger.vue @@ -3,7 +3,7 @@ import { computed } from 'vue'; import { AccordionTrigger, Slot, useForwardProps } from '@soybean-ui/primitives'; import { accordionVariants, cn } from '@soybean-ui/variants'; import { ChevronDown } from 'lucide-vue-next'; -import type { AccordionTriggerProps } from './types'; +import type { AccordionTriggerProps } from '../types'; defineOptions({ name: 'SAccordionTrigger' diff --git a/packages/soy-ui/src/components/accordion/accordion.vue b/packages/soy-ui/src/components/accordion/source/accordion.vue similarity index 99% rename from packages/soy-ui/src/components/accordion/accordion.vue rename to packages/soy-ui/src/components/accordion/source/accordion.vue index f6b13454..ca144ee5 100644 --- a/packages/soy-ui/src/components/accordion/accordion.vue +++ b/packages/soy-ui/src/components/accordion/source/accordion.vue @@ -9,12 +9,12 @@ > import { useCombinedPropsEmits, useOmitForwardProps } from '@soybean-ui/primitives'; import type { SingleOrMultipleType } from '@soybean-ui/primitives'; +import type { AccordionEmits, AccordionItemData, AccordionProps } from '../types'; import SAccordionItem from './accordion-item.vue'; import SAccordionHeader from './accordion-header.vue'; import SAccordionContent from './accordion-content.vue'; import SAccordionRoot from './accordion-root.vue'; import SAccordionTrigger from './accordion-trigger.vue'; -import type { AccordionEmits, AccordionItemData, AccordionProps } from './types'; defineOptions({ name: 'SAccordion' diff --git a/examples/src/ui/alert-dialog.vue b/packages/soy-ui/src/components/alert-dialog/demos/alert-dialog.vue similarity index 100% rename from examples/src/ui/alert-dialog.vue rename to packages/soy-ui/src/components/alert-dialog/demos/alert-dialog.vue diff --git a/packages/soy-ui/src/components/alert-dialog/demos/index.ts b/packages/soy-ui/src/components/alert-dialog/demos/index.ts new file mode 100644 index 00000000..cde55607 --- /dev/null +++ b/packages/soy-ui/src/components/alert-dialog/demos/index.ts @@ -0,0 +1,3 @@ +import DemoAlertDialog from './alert-dialog.vue'; + +export { DemoAlertDialog }; diff --git a/packages/soy-ui/src/components/alert-dialog/index.ts b/packages/soy-ui/src/components/alert-dialog/index.ts index dfa10b8d..9922843b 100644 --- a/packages/soy-ui/src/components/alert-dialog/index.ts +++ b/packages/soy-ui/src/components/alert-dialog/index.ts @@ -3,15 +3,15 @@ import { AlertDialogRoot as SAlertDialogRoot, AlertDialogTrigger as SAlertDialogTrigger } from '@soybean-ui/primitives'; -import SAlertDialog from './alert-dialog.vue'; -import SAlertDialogAction from './alert-dialog-action.vue'; -import SAlertDialogCancel from './alert-dialog-cancel.vue'; -import SAlertDialogContent from './alert-dialog-content.vue'; -import SAlertDialogDescription from './alert-dialog-description.vue'; -import SAlertDialogFooter from './alert-dialog-footer.vue'; -import SAlertDialogHeader from './alert-dialog-header.vue'; -import SAlertDialogOverlay from './alert-dialog-overlay.vue'; -import SAlertDialogTitle from './alert-dialog-title.vue'; +import SAlertDialog from './source/alert-dialog.vue'; +import SAlertDialogAction from './source/alert-dialog-action.vue'; +import SAlertDialogCancel from './source/alert-dialog-cancel.vue'; +import SAlertDialogContent from './source/alert-dialog-content.vue'; +import SAlertDialogDescription from './source/alert-dialog-description.vue'; +import SAlertDialogFooter from './source/alert-dialog-footer.vue'; +import SAlertDialogHeader from './source/alert-dialog-header.vue'; +import SAlertDialogOverlay from './source/alert-dialog-overlay.vue'; +import SAlertDialogTitle from './source/alert-dialog-title.vue'; export { SAlertDialog, diff --git a/packages/soy-ui/src/components/alert-dialog/alert-dialog-action.vue b/packages/soy-ui/src/components/alert-dialog/source/alert-dialog-action.vue similarity index 79% rename from packages/soy-ui/src/components/alert-dialog/alert-dialog-action.vue rename to packages/soy-ui/src/components/alert-dialog/source/alert-dialog-action.vue index 0b3e08ff..f664f4ed 100644 --- a/packages/soy-ui/src/components/alert-dialog/alert-dialog-action.vue +++ b/packages/soy-ui/src/components/alert-dialog/source/alert-dialog-action.vue @@ -1,7 +1,7 @@
Pick a style and color for your components.
Loading demos...
Error loading demos:
{{ error.message || error }}
Check the browser console for more details.
No demos found for this component.