feat(cli) | initial docs

Author: MilanPecov

src/App.tsx

@@ -57,6 +57,10 @@ const App = () => (
                 path="/sdk/:slug"
                 element={<DynamicDocPage section="sdk" />}
               />
+              <Route
+                path="/cli/:slug"
+                element={<DynamicDocPage section="cli" />}
+              />
               <Route
                 path="/webhooks/:slug"
                 element={<DynamicDocPage section="webhooks" />}

src/docs-app/data/cli/01-overview.md

@@ -0,0 +1,34 @@
+# Showpass CLI
+
+Build and manage event websites that connect directly to your Showpass venue.
+
+## Install
+
+```bash
+curl -fsSL "https://www.showpass.com/install.sh" | bash
+```
+
+## Quick Start
+
+```bash
+showpass init my-event-site
+```
+
+This launches an interactive wizard that:
+- Signs you in to your Showpass account
+- Connects to your venue
+- Generates a React + TypeScript site with Showpass SDK pre-configured
+- Installs dependencies and starts the dev server
+
+Your site will be running at `http://localhost:8080`.
+
+## Requirements
+
+| | |
+|---|---|
+| **OS** | macOS, Linux |
+| **Account** | Showpass account with venue access |
+
+## See Also
+
+- [Commands Reference](/cli/02-commands/)

src/docs-app/data/cli/02-commands.md

@@ -0,0 +1,65 @@
+# Commands
+
+## init
+
+Create a new Showpass project. Opens an interactive wizard.
+
+```bash
+showpass init my-event-site
+```
+
+Without a name, one is generated for you:
+
+```bash
+showpass init
+```
+
+## dev
+
+Start the local development server with hot reload.
+
+```bash
+showpass dev
+```
+
+Runs on `http://localhost:8080` by default.
+
+## build
+
+Create a production-optimized build.
+
+```bash
+showpass build
+```
+
+Output is written to `dist/`.
+
+## whoami
+
+Display current authentication status.
+
+```bash
+showpass whoami
+```
+
+## logout
+
+Clear saved credentials and venue selection.
+
+```bash
+showpass logout
+```
+
+## help
+
+Show available commands:
+
+```bash
+showpass --help
+```
+
+Get help for a specific command:
+
+```bash
+showpass init --help
+```

src/docs-app/data/seoData.ts

@@ -66,6 +66,18 @@ export const seoDataMap: Record<string, SEOData> = {
     keywords: "cart listener, cart quantity, cart monitoring, dynamic cart, cart events"
   },
 
+  // CLI
+  "/cli/01-overview": {
+    title: "Showpass CLI - Command Line Tool for Event Websites",
+    description: "Build and manage event websites with the Showpass CLI. Quick-start tool to generate React + TypeScript sites with Showpass SDK pre-configured.",
+    keywords: "showpass cli, command line tool, event website builder, react cli, typescript cli, showpass sdk, event site generator"
+  },
+  "/cli/02-commands": {
+    title: "CLI Commands Reference - Showpass Developer Documentation",
+    description: "Complete reference for Showpass CLI commands. Learn about init, build, dev, deploy, and all available CLI options and flags.",
+    keywords: "showpass cli commands, cli reference, command line reference, cli documentation, showpass commands, cli options"
+  },
+
   // WordPress Plugin
   "/wordpress/01-getting-started-install-and-configure": {
     title: "Showpass WordPress Plugin - Installation & Configuration",

src/docs-app/ui/components/DynamicDocPage.tsx

@@ -13,6 +13,7 @@ interface DynamicDocPageProps {
   section:
     | "api"
     | "sdk"
+    | "cli"
     | "advanced"
     | "wordpress"
     | "webhooks"

src/docs-app/ui/components/navigation/Navigation.tsx

@@ -28,6 +28,9 @@ const getOpenSections = (currentPath: string): string[] => {
   if (currentPath.startsWith("/sdk/") || currentPath.startsWith("/widgets")) {
     return ["sdk"];
   }
+  if (currentPath.startsWith("/cli/")) {
+    return ["cli"];
+  }
   if (currentPath.startsWith("/wordpress/")) {
     return ["showpass-wordpress-plugin"];
   }
@@ -275,6 +278,34 @@ const Navigation = ({ currentPath, onNavigate }: NavigationProps) => {
             </AccordionContent>
           </AccordionItem>
 
+          <AccordionItem value="cli">
+            <AccordionTrigger className="px-[0.4rem] py-3 text-sm font-medium text-muted-foreground hover:text-foreground border-b-0 hover:no-underline">
+              CLI
+            </AccordionTrigger>
+            <AccordionContent className="pb-2">
+              <ul className="px-4 space-y-1">
+                <li>
+                  <NavLink
+                    to="/cli/01-overview"
+                    className={navLinkClass}
+                    onClick={handleLinkClick}
+                  >
+                    Overview
+                  </NavLink>
+                </li>
+                <li>
+                  <NavLink
+                    to="/cli/02-commands"
+                    className={navLinkClass}
+                    onClick={handleLinkClick}
+                  >
+                    Commands Reference
+                  </NavLink>
+                </li>
+              </ul>
+            </AccordionContent>
+          </AccordionItem>
+
           <AccordionItem value="showpass-wordpress-plugin">
             <AccordionTrigger className="px-[0.4rem] py-3 text-sm font-medium text-muted-foreground hover:text-foreground border-b-0 hover:no-underline">
               Showpass Wordpress plugin

src/shared/components/BreadcrumbNavigation.tsx

@@ -18,6 +18,7 @@ interface BreadcrumbItem {
 const sectionLabels: Record<string, string> = {
   api: 'API Reference',
   sdk: 'JavaScript SDK',
+  cli: 'CLI',
   wordpress: 'WordPress Plugin',
   webhooks: 'Webhooks',
   'google-tag-manager': 'Google Tag Manager',