Add Docusaurus documentation site

.github/dependabot.yml

@@ -16,3 +16,10 @@ updates:
           interval: "weekly"
       labels:
           - "dependencies"
+
+    - package-ecosystem: "npm"
+      directory: "/website"
+      schedule:
+          interval: "weekly"
+      labels:
+          - "dependencies"

.github/workflows/deploy-docs.yml

@@ -0,0 +1,93 @@
+name: Deploy Docs
+
+on:
+  push:
+    branches: [main]
+    paths:
+      - 'docs/**'
+      - 'website/**'
+      - '.github/workflows/deploy-docs.yml'
+  pull_request:
+    branches: [main]
+    paths:
+      - 'docs/**'
+      - 'website/**'
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: false
+
+jobs:
+  test-deploy:
+    if: github.event_name == 'pull_request'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: pnpm/action-setup@v4
+        with:
+          package_json_file: website/package.json
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: pnpm
+          cache-dependency-path: website/pnpm-lock.yaml
+
+      - name: Install dependencies
+        working-directory: website
+        run: pnpm install --frozen-lockfile
+
+      - name: Test build website
+        working-directory: website
+        run: pnpm run build
+
+  build:
+    if: github.event_name == 'push'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: pnpm/action-setup@v4
+        with:
+          package_json_file: website/package.json
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: pnpm
+          cache-dependency-path: website/pnpm-lock.yaml
+
+      - name: Install dependencies
+        working-directory: website
+        run: pnpm install --frozen-lockfile
+
+      - name: Build website
+        working-directory: website
+        run: pnpm run build
+
+      - name: Upload build artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: website/build
+
+  deploy:
+    if: github.event_name == 'push'
+    needs: build
+    permissions:
+      pages: write
+      id-token: write
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

README.md

@@ -7,6 +7,8 @@
 
 This packages offers a collection of useful [Livewire](https://livewire.laravel.com/) utilities and components.
 
+Full documentation is available at [foxws.github.io/wireuse](https://foxws.github.io/wireuse/).
+
 ## Requirements
 
 - PHP 8.2 or higher
@@ -36,6 +38,7 @@ This is a selection of the available features:
 - [Forms](docs/form-extensions.md) - Traits and extensions for [Livewire Forms](https://livewire.laravel.com/docs/forms).
 - [State Objects](docs/state-objects.md) - State objects are based on states that you find, for example, in a VueJS Store.
 - [Structure Scout](docs/structure-scout.md) - Supported by [spatie/php-structure-discoverer](https://github.com/spatie/php-structure-discoverer) package, it provides a scout to discover and register components, which also offers benefits such as caching.
+- [Infinite Scroll](docs/infinite-scroll.md) - Load more results as the user scrolls.
 - [HTML](docs/laravel-html.md) - Extends Spatie's [laravel-html](https://spatie.be/docs/laravel-html/v3/introduction) to generate HTML using a clean, simple and easy to read API.
 
 ## Testing

docs/component-extensions.md

@@ -1,6 +1,6 @@
 ---
 title: Extending Components
-order: 2
+sidebar_position: 2
 tags:
   - blade
   - controllers

docs/form-extensions.md

@@ -1,6 +1,6 @@
 ---
 title: Extending Forms
-order: 3
+sidebar_position: 3
 tags:
   - components
   - forms

docs/index.md

@@ -0,0 +1,18 @@
+---
+title: Introduction
+slug: /
+---
+
+This package offers a collection of useful [Livewire](https://livewire.laravel.com/) utilities and components.
+
+This is a selection of the available features:
+
+- [Property Synthesizers](./property-synthesizers.md) — Force usage of model route-keys, instead of model ids.
+- [Components](./component-extensions.md) — Components like `Page` and useful traits.
+- [Forms](./form-extensions.md) — Traits and extensions for [Livewire Forms](https://livewire.laravel.com/docs/forms).
+- [State Objects](./state-objects.md) — State objects are based on states that you find, for example, in a VueJS Store.
+- [Structure Scout](./structure-scout.md) — Supported by [spatie/php-structure-discoverer](https://github.com/spatie/php-structure-discoverer) package, it provides a scout to discover and register components, which also offers benefits such as caching.
+- [Infinite Scroll](./infinite-scroll.md) — Load more results as the user scrolls.
+- [HTML](./laravel-html.md) — Extends Spatie's [laravel-html](https://spatie.be/docs/laravel-html/v3/introduction) to generate HTML using a clean, simple and easy to read API.
+
+Continue to [Installing WireUse](./installing-wireuse.md) to get started.

docs/infinite-scroll.md

@@ -1,6 +1,6 @@
 ---
 title: Infinite Scroll
-order: 6
+sidebar_position: 6
 tags:
   - components
   - blade

docs/installing-wireuse.md

@@ -1,16 +1,20 @@
 ---
 title: Installing WireUse
-order: 0
+sidebar_position: 0
 tags:
   - getting started
   - setup
 ---
 
-## Installation
+## Requirements
+
+- PHP 8.2 or higher
+- Laravel 12.x or higher
+- Livewire 4.2 or higher
 
-> Note: This package requires PHP 8.2 or higher, and Laravel 10.x/11.x.
+## Installation
 
-You can install the package using Composer:
+You can install the package via composer:
 
 ```bash
 composer require foxws/wireuse
@@ -24,4 +28,4 @@ php artisan vendor:publish --tag="wireuse-config"
 
 ## Changelog
 
-Please see the [changelog](https://github.com/foxws/wireuse/blob/3.x/CHANGELOG.md) for more information on what has changed recently.
+Please see the [changelog](https://github.com/foxws/wireuse/blob/main/CHANGELOG.md) for more information on what has changed recently.

docs/laravel-html.md

@@ -1,6 +1,6 @@
 ---
 title: Laravel HTML (Spatie)
-order: 7
+sidebar_position: 7
 tags:
   - html
   - blade

docs/property-synthesizers.md

@@ -1,6 +1,6 @@
 ---
 title: Property Synthesizers
-order: 1
+sidebar_position: 1
 tags:
   - eloquent
   - collection

docs/state-objects.md

@@ -1,6 +1,6 @@
 ---
 title: State Objects
-order: 5
+sidebar_position: 5
 tags:
   - livewire
   - states

docs/structure-scout.md

@@ -1,6 +1,6 @@
 ---
 title: Structure Scout
-order: 4
+sidebar_position: 4
 tags:
   - livewire
   - components

website/.gitignore

@@ -0,0 +1,20 @@
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

website/README.md

@@ -0,0 +1,25 @@
+# WireUse docs
+
+The documentation site for [foxws/wireuse](https://github.com/foxws/wireuse), built with [Docusaurus](https://docusaurus.io/) and deployed to GitHub Pages on every push to `main` (see `.github/workflows/deploy-docs.yml`).
+
+## Installation
+
+```bash
+pnpm install
+```
+
+## Local development
+
+```bash
+pnpm start
+```
+
+Starts a local dev server and opens a browser window. Most changes are reflected live without a restart.
+
+## Build
+
+```bash
+pnpm build
+```
+
+Generates static content into the `build` directory, served by GitHub Pages.

website/docusaurus.config.js

@@ -0,0 +1,102 @@
+// @ts-check
+const { themes: prismThemes } = require('prism-react-renderer');
+
+/** @type {import('@docusaurus/types').Config} */
+const config = {
+  title: 'WireUse',
+  tagline: 'Collection of Livewire traits and utilities',
+
+  url: 'https://foxws.github.io',
+  baseUrl: '/wireuse/',
+
+  organizationName: 'foxws',
+  projectName: 'wireuse',
+  deploymentBranch: 'gh-pages',
+  trailingSlash: false,
+
+  onBrokenLinks: 'throw',
+  onBrokenMarkdownLinks: 'warn',
+
+  i18n: {
+    defaultLocale: 'en',
+    locales: ['en'],
+  },
+
+  presets: [
+    [
+      'classic',
+      /** @type {import('@docusaurus/preset-classic').Options} */
+      ({
+        docs: {
+          path: '../docs',
+          routeBasePath: '/',
+          sidebarPath: require.resolve('./sidebars.js'),
+          editUrl: 'https://github.com/foxws/wireuse/edit/main/docs/',
+        },
+        blog: false,
+        theme: {
+          customCss: require.resolve('./src/css/custom.css'),
+        },
+      }),
+    ],
+  ],
+
+  themes: [
+    [
+      '@easyops-cn/docusaurus-search-local',
+      /** @type {import('@easyops-cn/docusaurus-search-local').PluginOptions} */
+      ({
+        hashed: true,
+        indexBlog: false,
+        docsRouteBasePath: '/',
+      }),
+    ],
+  ],
+
+  themeConfig:
+    /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
+    ({
+      navbar: {
+        title: 'WireUse',
+        items: [
+          {
+            href: 'https://github.com/foxws/wireuse',
+            label: 'GitHub',
+            position: 'right',
+          },
+          {
+            href: 'https://packagist.org/packages/foxws/wireuse',
+            label: 'Packagist',
+            position: 'right',
+          },
+        ],
+      },
+      footer: {
+        style: 'dark',
+        links: [
+          {
+            title: 'Docs',
+            items: [
+              { label: 'Introduction', to: '/' },
+              { label: 'Installing WireUse', to: '/installing-wireuse' },
+              { label: 'Property Synthesizers', to: '/property-synthesizers' },
+            ],
+          },
+          {
+            title: 'More',
+            items: [
+              { label: 'GitHub', href: 'https://github.com/foxws/wireuse' },
+              { label: 'Packagist', href: 'https://packagist.org/packages/foxws/wireuse' },
+            ],
+          },
+        ],
+        copyright: `Copyright © ${new Date().getFullYear()} foxws. Built with Docusaurus.`,
+      },
+      prism: {
+        theme: prismThemes.github,
+        darkTheme: prismThemes.dracula,
+      },
+    }),
+};
+
+module.exports = config;