feat: Transform to Tauri desktop app

- Initialize Tauri v2 project with Rust backend
- Restructure project: move source files to src/ directory
- Add Tauri configuration for Windows, macOS, and Linux builds
- Update Vite config for Tauri development workflow
- Add file system and dialog permissions for native features
- Update package.json with desktop build scripts
- Update tsconfig.json paths for new src structure
- Add Tauri and desktop badges to README
- Document desktop build process and architecture

README.md

@@ -18,6 +18,11 @@
   <img src="https://img.shields.io/badge/TypeScript-5.8-3178C6?style=for-the-badge&logo=typescript&logoColor=white" alt="TypeScript" />
   <img src="https://img.shields.io/badge/Vite-6-646CFF?style=for-the-badge&logo=vite&logoColor=white" alt="Vite" />
   <img src="https://img.shields.io/badge/Tailwind-3-06B6D4?style=for-the-badge&logo=tailwindcss&logoColor=white" alt="Tailwind" />
+  <img src="https://img.shields.io/badge/Tauri-2-24C8D8?style=for-the-badge&logo=tauri&logoColor=white" alt="Tauri" />
+</p>
+
+<p>
+  <img src="https://img.shields.io/badge/Desktop_App-Windows%20%7C%20macOS%20%7C%20Linux-blue?style=for-the-badge" alt="Desktop Apps" />
 </p>
 
 <p>
@@ -71,6 +76,7 @@ In a world where document formatting tools are increasingly locked behind paywal
 - **🎨 40+ Typography Styles** — Curated across 8 aesthetic categories
 - **📐 Multiple Paper Sizes** — A4 and Letter formats supported
 - **💾 Local Processing** — Your documents never leave your machine
+- **🖥️ Native Desktop Apps** — Built with Tauri for Windows, macOS, and Linux
 - **📥 One-Click Export** — Clean `.docx` files ready for Microsoft Word
 
 ### 🏛️ Style Categories
@@ -140,13 +146,22 @@ Every style includes meticulously configured:
 
 ## 🚀 Quick Start
 
-### Prerequisites
+### Option 1: Download Desktop App (Recommended)
+
+Pre-built binaries coming soon for:
+- 🪟 **Windows** (.msi, .exe)
+- 🍎 **macOS** (.dmg, .app)  
+- 🐧 **Linux** (.deb, .rpm, .AppImage)
+
+### Option 2: Build from Source
+
+#### Prerequisites
 
 - **Node.js** 18+ (we recommend the latest LTS)
-- A modern web browser
+- **Rust** (for Tauri desktop builds)
 - Your favorite text editor
 
-### Installation
+#### Web Development
 
 ```bash
 # 1. Clone the collective's work
@@ -164,6 +179,18 @@ npm run dev
 
 Your browser will open to `http://localhost:3000` — and you're ready to create!
 
+#### Desktop App Development
+
+```bash
+# Run in desktop development mode
+npm run desktop
+
+# Build desktop app for production
+npm run desktop:build
+```
+
+The built apps will be in `src-tauri/target/release/bundle/`
+
 ### Usage
 
 1. **📤 Upload** — Drag and drop your Markdown file (or click to browse)
@@ -301,25 +328,37 @@ This follows established typographic best practices for comfortable reading.
 ### Available Scripts
 
 ```bash
-# Development server with hot reload
+# Web Development
-npm run dev
+npm run dev          # Start Vite dev server
+npm run build        # Production build (outputs to dist/)
+npm run preview      # Preview production build locally
 
-# Production build (outputs to dist/)
+# Desktop App Development (Tauri)
-npm run build
+npm run desktop      # Run desktop app in dev mode
-
+npm run desktop:build # Build desktop app for production
-# Preview production build locally
+npm run tauri        # Access Tauri CLI directly
-npm run preview
 ```
 
 ### Project Structure
 
 ```
 typogenie/
-├── 📁 components/           # React components
+├── 📁 src/                  # Source code
-│   ├── FileUpload.tsx      # Drag-and-drop upload zone
+│   ├── 📁 components/      # React components
-│   ├── StyleSelector.tsx   # Style gallery with live preview
+│   │   ├── FileUpload.tsx  # Drag-and-drop upload zone
-│   ├── Preview.tsx         # Final preview & DOCX export
+│   │   ├── StyleSelector.tsx # Style gallery with live preview
-│   └── StylePreviewModal.tsx # (Optional) Modal preview
+│   │   ├── Preview.tsx     # Final preview & DOCX export
+│   │   └── StylePreviewModal.tsx # (Optional) Modal preview
+│   ├── 📁 styles/          # Typography style definitions
+│   ├── 📄 main.tsx         # React entry point
+│   ├── 📄 App.tsx          # Main application component
+│   ├── 📄 types.ts         # TypeScript interfaces
+│   └── 📄 constants.ts     # Configuration exports
+├── 📁 src-tauri/           # Tauri desktop app
+│   ├── 📁 src/             # Rust source code
+│   ├── 📁 icons/           # App icons
+│   ├── 📄 Cargo.toml       # Rust dependencies
+│   └── 📄 tauri.conf.json  # Tauri configuration
 ├── 📁 styles/              # Typography style definitions
 │   ├── index.ts            # Aggregates all categories
 │   ├── minimalist.ts       # 11 clean styles
@@ -352,6 +391,8 @@ typogenie/
 | **Icons** | Lucide React | Beautiful, consistent iconography |
 | **Markdown** | marked 12.0.0 | Local Markdown parsing |
 | **Documents** | docx 8.5.0 | Client-side DOCX generation |
+| **Desktop** | Tauri 2.0 | Native desktop apps (Rust + WebView) |
+| **Backend** | Rust 1.77+ | Systems programming for desktop shell |
 
 <br/>
 

index.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>TypoGenie - Professional Report Generator</title>
+    <title>TypoGenie</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -15,22 +15,9 @@
         color: #e4e4e7;
       }
     </style>
-  <script type="importmap">
+  </head>
-{
-  "imports": {
-    "lucide-react": "https://esm.sh/lucide-react@^0.563.0",
-    "react": "https://esm.sh/react@^19.2.4",
-    "react/": "https://esm.sh/react@^19.2.4/",
-    "react-dom/": "https://esm.sh/react-dom@^19.2.4/",
-    "docx": "https://esm.sh/docx@^8.5.0",
-    "marked": "https://esm.sh/marked@12.0.0"
-  }
-}
-</script>
-<link rel="stylesheet" href="/index.css">
-</head>
   <body>
     <div id="root"></div>
-  <script type="module" src="/index.tsx"></script>
+    <script type="module" src="/src/main.tsx"></script>
-</body>
+  </body>
-</html>
+</html>

package.json

@@ -1,21 +1,30 @@
 {
   "name": "typogenie",
   "private": true,
-  "version": "0.0.0",
+  "version": "1.0.0",
   "type": "module",
   "scripts": {
     "dev": "vite",
     "build": "vite build",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "tauri": "tauri",
+    "tauri:dev": "tauri dev",
+    "tauri:build": "tauri build",
+    "desktop": "tauri dev",
+    "desktop:build": "tauri build"
   },
   "dependencies": {
-    "lucide-react": "^0.563.0",
+    "@tauri-apps/api": "^2.0.0",
-    "react": "^19.2.4",
+    "@tauri-apps/plugin-dialog": "^2.0.0",
-    "react-dom": "^19.2.4",
+    "@tauri-apps/plugin-fs": "^2.0.0",
     "docx": "^8.5.0",
-    "marked": "12.0.0"
+    "lucide-react": "^0.563.0",
+    "marked": "12.0.0",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4"
   },
   "devDependencies": {
+    "@tauri-apps/cli": "^2.9.6",
     "@types/node": "^22.14.0",
     "@vitejs/plugin-react": "^5.0.0",
     "typescript": "~5.8.2",

src-tauri/.gitignore

@@ -0,0 +1,4 @@
+# Generated by Cargo
+# will have compiled files and executables
+/target/
+/gen/schemas

src-tauri/Cargo.toml

@@ -0,0 +1,25 @@
+[package]
+name = "typogenie"
+version = "1.0.0"
+description = "TypoGenie - Markdown to Word document converter"
+authors = ["TypoGenie Contributors"]
+license = "MIT"
+repository = "https://git.lashman.live/lashman/typogenie"
+edition = "2021"
+rust-version = "1.77.2"
+
+[lib]
+name = "app_lib"
+crate-type = ["staticlib", "cdylib", "rlib"]
+
+[build-dependencies]
+tauri-build = { version = "2.5.3" }
+
+[dependencies]
+serde_json = "1.0"
+serde = { version = "1.0", features = ["derive"] }
+log = "0.4"
+tauri = { version = "2.9.5" }
+tauri-plugin-log = "2"
+tauri-plugin-dialog = "2"
+tauri-plugin-fs = "2"

src-tauri/build.rs

@@ -0,0 +1,3 @@
+fn main() {
+  tauri_build::build()
+}

src-tauri/capabilities/default.json

@@ -0,0 +1,52 @@
+{
+  "$schema": "../gen/schemas/desktop-schema.json",
+  "identifier": "default",
+  "description": "Default capabilities for TypoGenie",
+  "windows": [
+    "main"
+  ],
+  "permissions": [
+    "core:default",
+    "dialog:default",
+    "dialog:allow-open",
+    "dialog:allow-save",
+    "fs:default",
+    "fs:allow-read-file",
+    "fs:allow-write-file",
+    "fs:allow-read-dir",
+    "fs:allow-copy-file",
+    "fs:allow-remove",
+    "fs:allow-rename",
+    "fs:allow-exists",
+    "fs:allow-mkdir",
+    {
+      "identifier": "fs:scope",
+      "allow": [
+        {
+          "path": "$HOME"
+        },
+        {
+          "path": "$HOME/**"
+        },
+        {
+          "path": "$DESKTOP"
+        },
+        {
+          "path": "$DESKTOP/**"
+        },
+        {
+          "path": "$DOCUMENT"
+        },
+        {
+          "path": "$DOCUMENT/**"
+        },
+        {
+          "path": "$DOWNLOAD"
+        },
+        {
+          "path": "$DOWNLOAD/**"
+        }
+      ]
+    }
+  ]
+}

src-tauri/src/lib.rs

@@ -0,0 +1,26 @@
+use tauri::Manager;
+
+#[cfg_attr(mobile, tauri::mobile_entry_point)]
+pub fn run() {
+  tauri::Builder::default()
+    .plugin(tauri_plugin_dialog::init())
+    .plugin(tauri_plugin_fs::init())
+    .setup(|app| {
+      // Show the main window after setup
+      if let Some(window) = app.get_webview_window("main") {
+        let _ = window.show();
+        let _ = window.set_focus();
+      }
+
+      if cfg!(debug_assertions) {
+        app.handle().plugin(
+          tauri_plugin_log::Builder::default()
+            .level(log::LevelFilter::Info)
+            .build(),
+        )?;
+      }
+      Ok(())
+    })
+    .run(tauri::generate_context!())
+    .expect("error while running tauri application");
+}

src-tauri/src/main.rs

@@ -0,0 +1,6 @@
+// Prevents additional console window on Windows in release, DO NOT REMOVE!!
+#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
+
+fn main() {
+  app_lib::run();
+}

src-tauri/tauri.conf.json

@@ -0,0 +1,56 @@
+{
+  "$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
+  "productName": "TypoGenie",
+  "version": "1.0.0",
+  "identifier": "live.lashman.typogenie",
+  "build": {
+    "frontendDist": "../dist",
+    "devUrl": "http://localhost:3000",
+    "beforeDevCommand": "npm run dev",
+    "beforeBuildCommand": "npm run build"
+  },
+  "app": {
+    "windows": [
+      {
+        "label": "main",
+        "title": "TypoGenie",
+        "width": 1400,
+        "height": 900,
+        "minWidth": 1000,
+        "minHeight": 700,
+        "resizable": true,
+        "fullscreen": false,
+        "center": true,
+        "decorations": true,
+        "transparent": false,
+        "visible": false
+      }
+    ],
+    "security": {
+      "csp": "default-src 'self'; connect-src 'self' https://fonts.googleapis.com https://fonts.gstatic.com; font-src 'self' https://fonts.gstatic.com; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; img-src 'self' data: blob:;"
+    }
+  },
+  "bundle": {
+    "active": true,
+    "targets": ["msi", "nsis", "dmg", "app", "deb", "rpm", "appimage"],
+    "icon": [
+      "icons/32x32.png",
+      "icons/128x128.png",
+      "icons/128x128@2x.png",
+      "icons/icon.icns",
+      "icons/icon.ico"
+    ],
+    "category": "Productivity",
+    "shortDescription": "Markdown to Word document converter",
+    "longDescription": "TypoGenie is a free, open-source typesetting engine that transforms Markdown into beautifully formatted Microsoft Word documents with 40+ professional styles.",
+    "publisher": "TypoGenie Contributors",
+    "copyright": "Copyright (c) 2026 TypoGenie Contributors",
+    "license": "MIT",
+    "homepage": "https://git.lashman.live/lashman/typogenie",
+    "windows": {
+      "webviewInstallMode": {
+        "type": "embedBootstrapper"
+      }
+    }
+  }
+}

tsconfig.json

@@ -20,10 +20,11 @@
     "jsx": "react-jsx",
     "paths": {
       "@/*": [
-        "./*"
+        "./src/*"
       ]
     },
     "allowImportingTsExtensions": true,
     "noEmit": true
-  }
+  },
-}
+  "include": ["src/**/*"]
+}

vite.config.ts

@@ -1,20 +1,41 @@
 import path from 'path';
-import { defineConfig, loadEnv } from 'vite';
+import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 
-export default defineConfig(({ mode }) => {
+export default defineConfig({
-    const env = loadEnv(mode, '.', '');
+  plugins: [react()],
-    return {
+  
-      server: {
+  // Vite options tailored for Tauri development
-        port: 3000,
+  clearScreen: false,
-        host: '0.0.0.0',
+  
-      },
+  server: {
-      plugins: [react()],
+    port: 3000,
-      define: {},
+    strictPort: true,
-      resolve: {
+    host: '0.0.0.0',
-        alias: {
+    // Tauri requires a consistent port for the dev server
-          '@': path.resolve(__dirname, '.'),
+    watch: {
-        }
+      ignored: ['**/src-tauri/**'],
-      }
+    },
-    };
+  },
+  
+  // to make use of `TAURI_DEBUG` and other env variables
+  envPrefix: ['VITE_', 'TAURI_'],
+  
+  build: {
+    // Tauri supports es2021
+    target: process.env.TAURI_PLATFORM == 'windows' ? 'chrome105' : 'safari13',
+    // don't minify for debug builds
+    minify: !process.env.TAURI_DEBUG ? 'esbuild' : false,
+    // produce sourcemaps for debug builds
+    sourcemap: !!process.env.TAURI_DEBUG,
+    // Output to dist folder for Tauri
+    outDir: 'dist',
+    emptyOutDir: true,
+  },
+  
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
 });