update deployment

Author: nasdan

.github/workflows/docs.yml

@@ -0,0 +1,46 @@
+name: Publish Docs
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+    paths:
+      - docs/**
+      - website/**
+      - .github/workflows/docs.yml
+
+jobs:
+  publish-docs:
+    runs-on: ubuntu-latest
+    environment:
+      name: Docs
+      url: https://lemoncode.github.io/react-image-focal-point
+    steps:
+      - name: Checkout Repository
+        uses: actions/checkout@v3
+
+      - name: Add NPM registry
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18.x
+
+      - name: Use SSH key
+        run: |
+          mkdir -p ~/.ssh/
+          echo "${{secrets.SSH_PRIVATE_KEY}}" > ~/.ssh/id_rsa
+          sudo chmod 600 ~/.ssh/id_rsa
+
+      - name: Config git
+        run: |
+          git config --global user.email "docs@lemoncode.net"
+          git config --global user.name "Docs bot"
+
+      - name: Install
+        run: npm ci
+
+      - name: Publish Docs
+        run: |
+          cd ./website
+          npm run build
+          npm run deploy

.github/workflows/publish-packages.yml renamed to .github/workflows/packages.yml

@@ -4,6 +4,10 @@ on:
   push:
     branches:
       - main
+    paths-ignore:
+      - docs/**
+      - website/**""
+      - .github/workflows/docs.yml
 
 jobs:
   publish-package:

website/docusaurus.config.js

@@ -4,18 +4,20 @@
 const lightCodeTheme = require('prism-react-renderer/themes/github');
 const darkCodeTheme = require('prism-react-renderer/themes/dracula');
 
+const organizationName = 'lemoncode';
+const projectName = 'react-image-focal-point';
+
 /** @type {import('@docusaurus/types').Config} */
 const config = {
   title: 'React Image Focal Point',
   tagline: 'Image focal point component for React',
   favicon: 'img/favicon.ico',
 
-  // Set the production url of your site here
-  // TODO.
-  url: 'https://your-docusaurus-test-site.com',
-  baseUrl: '/',
-  organizationName: 'lemoncode',
-  projectName: 'react-image-focal-point',
+  url: `https://${organizationName}.github.io`,
+  baseUrl: `/${projectName}`,
+  organizationName,
+  projectName,
+  trailingSlash: false,
   onBrokenLinks: 'throw',
   onBrokenMarkdownLinks: 'warn',
   i18n: {
@@ -45,7 +47,7 @@ const config = {
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     ({
       // TODO: Update image
-      image: 'img/docusaurus-social-card.jpg',
+      image: 'img/todo-social-card.jpg',
       navbar: {
         title: 'React Image Focal Point',
         logo: {
@@ -82,6 +84,14 @@ const config = {
                 label: 'Getting Started',
                 to: '/docs/getting-started',
               },
+              {
+                label: 'Examples',
+                to: '/docs/examples/basic',
+              },
+              {
+                label: 'API',
+                to: '/docs/api/reference',
+              },
             ],
           },
           {

website/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "docs-website",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "start": "docusaurus start",
+    "build": "docusaurus build",
+    "deploy": "docusaurus deploy",
+    "serve": "docusaurus serve"
+  },
+  "dependencies": {
+    "@docusaurus/core": "2.3.1",
+    "@docusaurus/preset-classic": "2.3.1",
+    "@mdx-js/react": "1.6.22",
+    "clsx": "^1.2.1",
+    "prism-react-renderer": "1.3.5",
+    "react": "17.0.2",
+    "react-dom": "17.0.2"
+  },
+  "devDependencies": {
+    "@docusaurus/module-type-aliases": "2.3.1",
+    "@docusaurus/remark-plugin-npm2yarn": "2.3.1",
+    "@tsconfig/docusaurus": "1.0.6",
+    "typescript": "4.9.5"
+  },
+  "browserslist": {
+    "production": [
+      ">0.5%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "engines": {
+    "node": ">=16.14"
+  }
+}