Merge pull request #14 from nature-heart-software/dev

release

.github/workflows/build-docs.yml

@@ -0,0 +1,35 @@
+name: Build and Deploy VitePress
+
+on:
+  push:
+    paths:
+      - 'apps/documentation/**'
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: '18'
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Build VitePress
+        run: npm run docs:build
+
+      - name: Commit and push changes
+        run: |
+          git config --global user.name 'github-actions[bot]'
+          git config --global user.email 'github-actions[bot]@users.noreply.github.com'
+          git add -A
+          git commit -m "Automated build and deploy from GitHub Actions"
+          git push origin dev
+        env:
+          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}

.gitignore

@@ -24,3 +24,5 @@ dist-ssr
 *.sw?
 
 playground
+cache
+dist

apps/documentation/.vitepress/config.mts

@@ -0,0 +1,108 @@
+import { defineConfig } from 'vitepress'
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+    base: '/bearmean/',
+    outDir: '../../docs',
+    head: [['link', { rel: 'icon', href: '/logo.png' }]],
+    title: 'bearmean',
+    description: 'bearmean desc',
+    themeConfig: {
+        // https://vitepress.dev/reference/default-theme-config
+        logo: '/logo.png',
+
+        nav: [
+            { text: 'Home', link: '/' },
+            { text: 'Docs', link: '/docs' },
+            { text: 'Components', link: '/components' },
+            { text: 'Patterns', link: '/patterns' },
+            { text: 'CLI', link: '/cli' },
+        ],
+
+        sidebar: [
+            {
+                text: 'Getting Started',
+                items: [
+                    { text: 'Introduction', link: '/docs/' },
+                    { text: 'Installation', link: '/docs/installation/' },
+                ],
+            },
+            {
+                text: 'Components',
+                link: '/components/',
+                items: [
+                    {
+                        text: 'Debug',
+                        items: [
+                            {
+                                text: 'RenderState',
+                                link: '/components/layout/aspect/',
+                            },
+                        ],
+                    },
+                    {
+                        text: 'Layout',
+                        items: [
+                            {
+                                text: 'Aspect',
+                                link: '/components/layout/aspect/',
+                            },
+                            {
+                                text: 'Box',
+                                link: '/components/layout/box/',
+                            },
+                            {
+                                text: 'Center',
+                                link: '/components/layout/center/',
+                            },
+                            {
+                                text: 'Container',
+                                link: '/components/layout/container/',
+                            },
+                            {
+                                text: 'Divider',
+                                link: '/components/layout/divider/',
+                            },
+                            {
+                                text: 'Grid',
+                                link: '/components/layout/grid/',
+                            },
+                            {
+                                text: 'Group',
+                                link: '/components/layout/group/',
+                            },
+                            {
+                                text: 'Position',
+                                link: '/components/layout/position/',
+                            },
+                            {
+                                text: 'Stack',
+                                link: '/components/layout/stack/',
+                            },
+                            {
+                                text: 'Transform',
+                                link: '/components/layout/transform/',
+                            },
+                        ],
+                    },
+                ],
+            },
+            {
+                text: 'Patterns',
+                items: [
+                    { text: 'Define Props', link: '/patterns/' },
+                ],
+            },
+            {
+                text: 'CLI',
+                items: [
+                    { text: 'Options', link: '/cli/' },
+                ],
+            },
+        ],
+
+        socialLinks: [
+            { icon: 'github', link: 'https://github.com/nature-heart-software/bearmean' },
+        ],
+    },
+})

apps/documentation/api-examples.md

@@ -0,0 +1,49 @@
+---
+outline: deep
+---
+
+# Runtime API Examples
+
+This page demonstrates usage of some of the runtime APIs provided by VitePress.
+
+The main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:
+
+```md
+<script setup>
+import { useData } from 'vitepress'
+
+const { theme, page, frontmatter } = useData()
+</script>
+
+## Results
+
+### Theme Data
+<pre>{{ theme }}</pre>
+
+### Page Data
+<pre>{{ page }}</pre>
+
+### Page Frontmatter
+<pre>{{ frontmatter }}</pre>
+```
+
+<script setup>
+import { useData } from 'vitepress'
+
+const { site, theme, page, frontmatter } = useData()
+</script>
+
+## Results
+
+### Theme Data
+<pre>{{ theme }}</pre>
+
+### Page Data
+<pre>{{ page }}</pre>
+
+### Page Frontmatter
+<pre>{{ frontmatter }}</pre>
+
+## More
+
+Check out the documentation for the [full list of runtime APIs](https://vitepress.dev/reference/runtime-api#usedata).

apps/documentation/cli/index.md

@@ -0,0 +1 @@
+🚧 Page under construction 🚧

apps/documentation/components/index.md

@@ -0,0 +1 @@
+🚧 Page under construction 🚧

apps/documentation/components/layout/aspect.md

@@ -0,0 +1 @@
+🚧 Page under construction 🚧

apps/documentation/docs/index.md

@@ -0,0 +1 @@
+🚧 Page under construction 🚧

apps/documentation/docs/installation.md

@@ -0,0 +1,52 @@
+# Installation
+
+1. Create a React + TypeScript project
+
+```bash
+npm create vite@latest
+```
+
+2. Add an alias to your `src` folder in your `tsconfig.app.json` file
+
+```json{3-8}
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    }
+  }
+}
+```
+
+3. Install Bearmean
+
+```bash
+npm install @bearmean/react
+```
+
+4. Init Bearmean
+
+```bash
+npx bearmean init
+```
+
+5. Import Bearmean components
+
+```bash
+npx bearmean add all # import all components
+```
+
+or
+
+```bash
+npx bearmean add layout # import a collection of components
+```
+
+or
+
+```bash
+npx bearmean add box # import a component
+```

apps/documentation/index.md

@@ -0,0 +1,37 @@
+---
+# https://vitepress.dev/reference/default-theme-home-page
+layout: home
+
+hero:
+  name: "bearmean"
+  text: "Bare minimum tools for UI Development"
+  tagline: A collection of components, patterns, utilities, and tools for building UIs and Design Systems.
+  image:
+    src: /logo.png
+    alt: bearmean
+  actions:
+    - theme: brand
+      text: Get started
+      link: /docs
+    - theme: alt
+      text: Components
+      link: /components
+    - theme: alt
+      text: Patterns
+      link: /patterns
+    - theme: alt
+      text: CLI
+      link: /cli
+
+features:
+  - title: Layout components
+    details: Glue your UI together with intuitive layout components. Say goodbye to redundant Grid and Flexbox classes.
+    icon: 🍯
+  - title: Props definition utilities
+    details: Define props and default values with ease. Spread only what you need to your components.
+    icon: 🍃
+  - title: Own the code
+    details: Copy/paste to your project with the CLI tool for easy customization. Allow your users to do the same for your library.
+    icon: 🐟
+---
+

apps/documentation/markdown-examples.md

@@ -0,0 +1,85 @@
+# Markdown Extension Examples
+
+This page demonstrates some of the built-in markdown extensions provided by VitePress.
+
+## Syntax Highlighting
+
+VitePress provides Syntax Highlighting powered by [Shiki](https://github.com/shikijs/shiki), with additional features like line-highlighting:
+
+**Input**
+
+````md
+```js{4}
+export default {
+  data () {
+    return {
+      msg: 'Highlighted!'
+    }
+  }
+}
+```
+````
+
+**Output**
+
+```js{4}
+export default {
+  data () {
+    return {
+      msg: 'Highlighted!'
+    }
+  }
+}
+```
+
+## Custom Containers
+
+**Input**
+
+```md
+::: info
+This is an info box.
+:::
+
+::: tip
+This is a tip.
+:::
+
+::: warning
+This is a warning.
+:::
+
+::: danger
+This is a dangerous warning.
+:::
+
+::: details
+This is a details block.
+:::
+```
+
+**Output**
+
+::: info
+This is an info box.
+:::
+
+::: tip
+This is a tip.
+:::
+
+::: warning
+This is a warning.
+:::
+
+::: danger
+This is a dangerous warning.
+:::
+
+::: details
+This is a details block.
+:::
+
+## More
+
+Check out the documentation for the [full list of markdown extensions](https://vitepress.dev/guide/markdown).

apps/documentation/patterns/index.md

@@ -0,0 +1 @@
+🚧 Page under construction 🚧