@onexapis/cli 1.1.37 → 1.1.38

package/dist/preview/preview-app.tsx

@@ -455,14 +455,6 @@ function PreviewApp() {
   >("disconnected");
   const [error, setError] = useState<string | null>(null);
   const wsRef = useRef<WebSocket | null>(null);
-  const [isEditing, setIsEditing] = useState(() => {
-    if (typeof window !== "undefined") {
-      return (
-        new URLSearchParams(window.location.search).get("editing") === "true"
-      );
-    }
-    return false;
-  });
 
   // Load theme bundle
   const loadTheme = useCallback(async (timestamp?: number) => {
@@ -709,7 +701,7 @@ function PreviewApp() {
         section={section}
         schema={schema}
         template={template}
-        isEditing={isEditing}
+        isEditing={false}
         data={sectionData}
       />
     );
@@ -720,16 +712,16 @@ function PreviewApp() {
       {/* Inject theme CSS variables (Gap 2) */}
       {themeCSS && <style dangerouslySetInnerHTML={{ __html: themeCSS }} />}
 
-      {/* Header — hidden if page config sets hideHeader: true */}
-      {headerSections.length > 0 && !currentPage.config?.hideHeader && (
+      {/* Header (Gap 1) */}
+      {headerSections.length > 0 && (
         <header>{headerSections.map(renderSection)}</header>
       )}
 
       {/* Page sections */}
       <main>{pageSections.map(renderSection)}</main>
 
-      {/* Footer — hidden if page config sets hideFooter: true */}
-      {footerSections.length > 0 && !currentPage.config?.hideFooter && (
+      {/* Footer (Gap 1) */}
+      {footerSections.length > 0 && (
         <footer>{footerSections.map(renderSection)}</footer>
       )}
     </>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onexapis/cli",
-  "version": "1.1.37",
+  "version": "1.1.38",
   "description": "CLI tool for OneX theme development - scaffolds themes using @onexapis/core",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -50,13 +50,14 @@
   },
   "dependencies": {
     "@aws-sdk/client-s3": "^3.470.0",
-    "@onexapis/core": "^1.0.6",
+    "@onexapis/core": "^1.0.7",
     "@tanstack/react-query": "^5.90.16",
     "adm-zip": "^0.5.16",
     "archiver": "^7.0.1",
     "chalk": "^5.3.0",
     "chokidar": "^4.0.0",
     "commander": "^12.1.0",
+    "cross-spawn": "^7.0.6",
     "dotenv": "^17.3.1",
     "ejs": "^3.1.10",
     "esbuild": "^0.25.0",
@@ -69,17 +70,20 @@
     "node-fetch": "^3.3.2",
     "open": "^10.1.0",
     "ora": "^8.0.1",
-    "ws": "^8.18.0",
+    "postcss": "^8.4.0",
+    "semver": "^7.7.4",
     "tailwindcss": "^3.4.0",
-    "postcss": "^8.4.0"
+    "ws": "^8.18.0"
   },
   "devDependencies": {
     "@types/adm-zip": "^0.5.7",
     "@types/archiver": "^7.0.0",
+    "@types/cross-spawn": "^6.0.6",
     "@types/ejs": "^3.1.5",
     "@types/fs-extra": "^11.0.4",
     "@types/inquirer": "^9.0.7",
     "@types/node-fetch": "^2.6.13",
+    "@types/semver": "^7.7.1",
     "@types/ws": "^8.5.0",
     "tsup": "^8.5.1",
     "typescript": "^5.9.3"

package/templates/default/bundle-entry.ts

@@ -16,8 +16,3 @@ export { default as layoutConfig } from "./theme.layout";
 export { default as homePageConfig } from "./pages/home";
 export { default as aboutPageConfig } from "./pages/about";
 export { default as showcasePageConfig } from "./pages/showcase";
-export { default as loginPageConfig } from "./pages/login";
-export { default as registerPageConfig } from "./pages/register";
-export { default as forgotPasswordPageConfig } from "./pages/forgot-password";
-export { default as verifyCodePageConfig } from "./pages/verify-code";
-export { default as profilePageConfig } from "./pages/profile";

package/templates/default/index.ts

@@ -14,33 +14,13 @@ export { default as layoutConfig, simpleLayoutConfig } from "./theme.layout";
 export { default as homePageConfig } from "./pages/home";
 export { default as aboutPageConfig } from "./pages/about";
 export { default as showcasePageConfig } from "./pages/showcase";
-export { default as loginPageConfig } from "./pages/login";
-export { default as registerPageConfig } from "./pages/register";
-export { default as forgotPasswordPageConfig } from "./pages/forgot-password";
-export { default as verifyCodePageConfig } from "./pages/verify-code";
-export { default as profilePageConfig } from "./pages/profile";
 
 // Page map for dynamic access
 export const pages = {
   home: () => import("./pages/home").then((m) => m.default),
   about: () => import("./pages/about").then((m) => m.default),
   showcase: () => import("./pages/showcase").then((m) => m.default),
-  login: () => import("./pages/login").then((m) => m.default),
-  register: () => import("./pages/register").then((m) => m.default),
-  "forgot-password": () =>
-    import("./pages/forgot-password").then((m) => m.default),
-  "verify-code": () => import("./pages/verify-code").then((m) => m.default),
-  profile: () => import("./pages/profile").then((m) => m.default),
 };
 
 // Page slugs (for discovery)
-export const pageList = [
-  "home",
-  "about",
-  "showcase",
-  "login",
-  "register",
-  "forgot-password",
-  "verify-code",
-  "profile",
-] as const;
+export const pageList = ["home", "about", "showcase"] as const;

package/templates/default/sections-registry.ts

@@ -3,14 +3,6 @@
  * Auto-discovery entry point for all sections
  */
 
-// Header (layout)
-export { default as HeaderDefault } from "./sections/header/header-default";
-export { headerSchema } from "./sections/header/header.schema";
-
-// Footer (layout)
-export { default as FooterDefault } from "./sections/footer/footer-default";
-export { footerSchema } from "./sections/footer/footer.schema";
-
 // Hero
 export { default as HeroDefault } from "./sections/hero/hero-default";
 export { heroSchema } from "./sections/hero/hero.schema";
@@ -38,23 +30,3 @@ export { ctaSchema } from "./sections/cta/cta.schema";
 // Stats (block-based)
 export { default as StatsDefault } from "./sections/stats/stats-default";
 export { statsSchema } from "./sections/stats/stats.schema";
-
-// Auth Login
-export { default as AuthLoginDefault } from "./sections/auth-login/auth-login-default";
-export { authLoginSchema } from "./sections/auth-login/auth-login.schema";
-
-// Auth Register
-export { default as AuthRegisterDefault } from "./sections/auth-register/auth-register-default";
-export { authRegisterSchema } from "./sections/auth-register/auth-register.schema";
-
-// Auth Forgot Password
-export { default as AuthForgotPasswordDefault } from "./sections/auth-forgot-password/auth-forgot-password-default";
-export { authForgotPasswordSchema } from "./sections/auth-forgot-password/auth-forgot-password.schema";
-
-// Auth Verify Code
-export { default as AuthVerifyCodeDefault } from "./sections/auth-verify-code/auth-verify-code-default";
-export { authVerifyCodeSchema } from "./sections/auth-verify-code/auth-verify-code.schema";
-
-// Profile
-export { default as ProfileDefault } from "./sections/profile/profile-default";
-export { profileSchema } from "./sections/profile/profile.schema";

package/templates/default/theme.layout.ts

@@ -9,59 +9,8 @@ export const simpleLayoutConfig: ThemeLayoutConfig = {
   id: "my-simple",
   name: "My My Simple Theme",
   version: "1.0.0",
-  headerSections: [
-    {
-      id: "global-header-1",
-      type: "my-simple-header",
-      template: "default",
-      order: 0,
-      enabled: true,
-      settings: {
-        logoText: "My Site",
-        sticky: true,
-        autoHide: true,
-        scrollThreshold: 10,
-        showShadowOnScroll: true,
-        transparentOnTop: false,
-        headerHeight: "16",
-        navigationItems: JSON.stringify([
-          { label: "Home", href: "/" },
-          { label: "About", href: "/about" },
-          { label: "Showcase", href: "/showcase" },
-        ]),
-        ctaText: "Contact",
-        ctaLink: "#contact",
-        backgroundColor: "#FFFFFF",
-        textColor: "#111827",
-        primaryColor: "#2563EB",
-      },
-      components: [],
-      blocks: [],
-    },
-  ],
-  footerSections: [
-    {
-      id: "global-footer-1",
-      type: "my-simple-footer",
-      template: "default",
-      order: 0,
-      enabled: true,
-      settings: {
-        companyName: "My Site",
-        description: "A clean and minimal theme for your website.",
-        showAboutColumn: true,
-        aboutColumnTitle: "About",
-        showLinksColumn: true,
-        linksColumnTitle: "Quick Links",
-        copyrightText: "My Site. All rights reserved.",
-        backgroundColor: "#111827",
-        textColor: "#9CA3AF",
-        primaryColor: "#FFFFFF",
-      },
-      components: [],
-      blocks: [],
-    },
-  ],
+  headerSections: [],
+  footerSections: [],
   globalSettings: {
     primaryColor: "#3B82F6",
     secondaryColor: "#8B5CF6",

package/templates/default/AUTH_AND_PROFILE.md

@@ -1,167 +0,0 @@
-# Authentication & Profile — Default Theme
-
-This document covers the built-in authentication and profile sections included in the default theme template.
-
-## Overview
-
-When you initialize a theme with `onexthm init`, it comes with 5 auth/profile sections and their corresponding hooks ready to use:
-
-| Section              | Path               | Description                                  |
-| -------------------- | ------------------ | -------------------------------------------- |
-| Auth Login           | `/login`           | Username/email + password sign-in            |
-| Auth Register        | `/register`        | Email, username, password, confirm password  |
-| Auth Forgot Password | `/forgot-password` | Request verification code via email/username |
-| Auth Verify Code     | `/verify-code`     | 6-digit OTP input with resend + countdown    |
-| Profile              | `/profile`         | View/edit profile + change password          |
-
-## Architecture
-
-```
-Theme Section (UI only)
-  └── Theme Hook (form state, validation)
-        └── useAuth() from @onexapis/core/hooks (Zustand store)
-              └── AuthService (API calls)
-                    └── ApiClient (HTTP client with token management)
-```
-
-### Hooks
-
-All hooks live in `hooks/` and use `useAuth` from `@onexapis/core/hooks`:
-
-| Hook                    | Uses                                                          | Manages                                              |
-| ----------------------- | ------------------------------------------------------------- | ---------------------------------------------------- |
-| `useLoginForm`          | `useAuth().login()`                                           | Username, password, show/hide toggle, validation     |
-| `useRegisterForm`       | `useAuth().signup()`                                          | Email, username, password, confirm, validation       |
-| `useForgotPasswordForm` | `useAuth().forgotPassword()`                                  | Username/email input, validation                     |
-| `useVerifyCodeForm`     | `useAuth().verifyCode()`, `verifyCodeReset()`, `resendCode()` | 6-digit OTP, auto-focus, paste, countdown            |
-| `useProfileForm`        | `useAuth().updateProfile()`, `changePassword()`, `logout()`   | Profile fields, dirty tracking, change password form |
-
-### API Endpoints
-
-The `AuthService` in `@onexapis/core` handles all API calls:
-
-| Action              | Method | Endpoint                            |
-| ------------------- | ------ | ----------------------------------- |
-| Login               | POST   | `/auth/login`                       |
-| Register            | POST   | `/auth/register`                    |
-| Forgot Password     | POST   | `/auth/forgot`                      |
-| Verify Code         | POST   | `/auth/confirm`                     |
-| Verify Code (reset) | POST   | `/auth/confirm_reset_password_code` |
-| Resend Code         | POST   | `/auth/resend_code`                 |
-| Reset Password      | POST   | `/auth/new_password`                |
-| Change Password     | POST   | `/auth/change_password`             |
-| Get User Info       | GET    | `/auth/user_info`                   |
-| Update Profile      | POST   | `/auth/user_info`                   |
-
-### Token Handling
-
-- **IdToken** → `Authorization: Bearer {IdToken}` header
-- **AccessToken** → `?access_token={AccessToken}` query parameter
-- **Tokens stored** in `localStorage` under key `auth_tokens`
-- **Signup** auto-injects `company_id` (from `initializeOnex()` config) and `is_customer: true`
-
-## Editable Settings
-
-All sections expose these layout settings via the editor sidebar:
-
-| Setting            | Type   | Default   | Description                          |
-| ------------------ | ------ | --------- | ------------------------------------ |
-| `backgroundColor`  | color  | `#F9FAFB` | Page background                      |
-| `cardBackground`   | color  | `#FFFFFF` | Card/form container background       |
-| `primaryColor`     | color  | `#2563EB` | Buttons and links                    |
-| `textColor`        | color  | `#111827` | Heading text color                   |
-| `cardBorderRadius` | select | `2xl`     | Card corner rounding (lg/xl/2xl/3xl) |
-
-Plus all text labels, placeholders, button text, and URLs are customizable per section.
-
-## Auth Flow
-
-```
-Register → Verify Code → Login → Profile
-                ↑                    │
-Forgot Password → Verify Code (reset) → Reset Password
-```
-
-1. **Register**: User fills email, username, password → `signup()` → redirects to `/verify-code?username=...`
-2. **Verify Code**: User enters 6-digit OTP → `verifyCode()` → redirects to `/login`
-3. **Login**: User signs in → `login()` → tokens stored → redirects to `/`
-4. **Forgot Password**: User enters email → `forgotPassword()` → redirects to `/verify-code?mode=reset&username=...`
-5. **Verify Code (reset)**: OTP → `verifyCodeReset()` → returns session → redirects to `/reset-password?session=...`
-6. **Profile**: View/edit name, phone, address → `updateProfile()`. Change password → `changePassword()`
-
-## Configuration
-
-### Required Environment Variables
-
-```env
-NEXT_PUBLIC_API_URL=https://api-dev.onexeos.com
-NEXT_PUBLIC_COMPANY_ID=your-company-id
-```
-
-These are read by `initializeOnex()` which creates the `AuthService` and registers it with the `useAuth` Zustand store.
-
-## Testing Locally
-
-### Preview mode (UI only)
-
-```bash
-onexthm dev
-# Visit http://localhost:3456/login
-```
-
-### Preview with editing mode
-
-```bash
-onexthm dev
-# Visit http://localhost:3456/login?editing=true
-```
-
-### Preview with real API (requires .env)
-
-Create `.env` in your theme directory:
-
-```env
-NEXT_PUBLIC_API_URL=https://api-dev.onexeos.com
-NEXT_PUBLIC_COMPANY_ID=your-company-id
-```
-
-Then run `onexthm dev` — login/register/verify will make real API calls.
-
-## File Structure
-
-```
-hooks/
-  index.ts
-  use-login-form.ts
-  use-register-form.ts
-  use-forgot-password-form.ts
-  use-verify-code-form.ts
-  use-profile-form.ts
-sections/
-  auth-login/
-    auth-login-default.tsx    # Login form UI
-    auth-login.schema.ts      # Editable settings
-    index.ts
-  auth-register/
-    auth-register-default.tsx
-    auth-register.schema.ts
-    index.ts
-  auth-forgot-password/
-    auth-forgot-password-default.tsx
-    auth-forgot-password.schema.ts
-    index.ts
-  auth-verify-code/
-    auth-verify-code-default.tsx
-    auth-verify-code.schema.ts
-    index.ts
-  profile/
-    profile-default.tsx
-    profile.schema.ts
-    index.ts
-pages/
-  login.ts
-  register.ts
-  forgot-password.ts
-  verify-code.ts
-  profile.ts
-```

package/templates/default/LAYOUT.md

@@ -1,195 +0,0 @@
-# Header & Footer Layout — Default Theme
-
-This document covers the built-in header and footer sections that render on every page via `theme.layout.ts`.
-
-## How It Works
-
-Header and footer are **layout-level sections** — they're defined once in `theme.layout.ts` and rendered on every page automatically. Individual pages can opt out using `hideHeader` / `hideFooter`.
-
-```
-theme.layout.ts
-  ├── headerSections[] ──→ rendered as <header> on every page
-  └── footerSections[] ──→ rendered as <footer> on every page
-
-Page config
-  ├── hideHeader: true  ──→ skips header for this page
-  └── hideFooter: true  ──→ skips footer for this page
-```
-
-## Header Section
-
-### Smart Scroll Behavior (default: on)
-
-The header auto-hides when scrolling down and reappears when scrolling up. This is fully customizable via schema settings:
-
-| Setting              | Type     | Default     | Description                                   |
-| -------------------- | -------- | ----------- | --------------------------------------------- |
-| `sticky`             | checkbox | `true`      | Pin header to top of viewport                 |
-| `autoHide`           | checkbox | `true`      | Hide on scroll down, show on scroll up        |
-| `scrollThreshold`    | number   | `10`        | Pixels of scroll needed to trigger hide/show  |
-| `showShadowOnScroll` | checkbox | `true`      | Add drop shadow when page is scrolled         |
-| `transparentOnTop`   | checkbox | `false`     | Transparent background when at top of page    |
-| `headerHeight`       | select   | `16` (64px) | Compact (48px) / Default (64px) / Tall (80px) |
-
-### Behavior Presets
-
-**Default (sticky + auto-hide):**
-
-```ts
-// theme.layout.ts
-settings: {
-  sticky: true,
-  autoHide: true,
-  showShadowOnScroll: true,
-  transparentOnTop: false,
-}
-```
-
-**Always visible (no auto-hide):**
-
-```ts
-settings: {
-  sticky: true,
-  autoHide: false,    // ← stays visible at all times
-  showShadowOnScroll: true,
-}
-```
-
-**Transparent hero overlay:**
-
-```ts
-settings: {
-  sticky: true,
-  autoHide: true,
-  transparentOnTop: true,  // ← transparent at top, solid on scroll
-  showShadowOnScroll: true,
-}
-```
-
-**Static (not sticky):**
-
-```ts
-settings: {
-  sticky: false,      // ← scrolls away with the page
-  autoHide: false,
-}
-```
-
-### Other Header Settings
-
-| Setting           | Type  | Default               | Description                               |
-| ----------------- | ----- | --------------------- | ----------------------------------------- |
-| `logoText`        | text  | `"My Site"`           | Logo text (fallback if no logo component) |
-| `navigationItems` | array | Home, About, Showcase | Navigation links `[{ label, href }]`      |
-| `ctaText`         | text  | `"Contact"`           | CTA button text                           |
-| `ctaLink`         | url   | `"#contact"`          | CTA button link                           |
-| `backgroundColor` | color | `#FFFFFF`             | Header background                         |
-| `textColor`       | color | `#111827`             | Navigation text color                     |
-| `primaryColor`    | color | `#2563EB`             | CTA button color                          |
-
-### How Auto-Hide Works
-
-The header uses `requestAnimationFrame` for smooth 60fps scroll detection:
-
-1. **Scroll down > threshold** (and past 80px from top) → header slides up (`translateY(-100%)`)
-2. **Scroll up > threshold** → header slides back down (`translateY(0)`)
-3. **At very top** (scrollY = 0) → always visible
-4. **In editor** (`isEditing = true`) → auto-hide disabled, always visible
-5. CSS transition: `duration-300 ease-in-out` for smooth animation
-
-## Footer Section
-
-### Settings
-
-| Setting            | Type     | Default                    | Description                     |
-| ------------------ | -------- | -------------------------- | ------------------------------- |
-| `companyName`      | text     | `"My Site"`                | Company name                    |
-| `description`      | textarea | `"A clean and minimal..."` | Company description             |
-| `showAboutColumn`  | checkbox | `true`                     | Show/hide about links column    |
-| `aboutColumnTitle` | text     | `"About"`                  | About column heading            |
-| `aboutLinks`       | array    | About Us, Contact          | About links `[{ label, href }]` |
-| `showLinksColumn`  | checkbox | `true`                     | Show/hide quick links column    |
-| `linksColumnTitle` | text     | `"Quick Links"`            | Links column heading            |
-| `quickLinks`       | array    | Home, Showcase             | Quick links `[{ label, href }]` |
-| `copyrightText`    | text     | `"My Site. All rights..."` | Copyright text                  |
-| `backgroundColor`  | color    | `#111827`                  | Footer background               |
-| `textColor`        | color    | `#9CA3AF`                  | Body text color                 |
-| `primaryColor`     | color    | `#FFFFFF`                  | Heading color                   |
-
-## Per-Page Visibility
-
-Auth pages (login, register, forgot-password, verify-code) have `hideHeader: true` and `hideFooter: true` by default since they're full-screen.
-
-### Hide header/footer on a page
-
-```ts
-// pages/my-page.ts
-export const myPageConfig = {
-  title: "My Page",
-  handle: "my-page",
-  path: "/my-page",
-  hideHeader: true, // ← no header on this page
-  hideFooter: true, // ← no footer on this page
-  // ...
-};
-```
-
-### Pages with header/footer (default)
-
-Pages without `hideHeader`/`hideFooter` get both automatically:
-
-| Page                                 | Header | Footer |
-| ------------------------------------ | ------ | ------ |
-| Home (`/`)                           | Yes    | Yes    |
-| About (`/about`)                     | Yes    | Yes    |
-| Showcase (`/showcase`)               | Yes    | Yes    |
-| Profile (`/profile`)                 | Yes    | Yes    |
-| Login (`/login`)                     | No     | No     |
-| Register (`/register`)               | No     | No     |
-| Forgot Password (`/forgot-password`) | No     | No     |
-| Verify Code (`/verify-code`)         | No     | No     |
-
-## Customizing in the Editor
-
-In the visual editor:
-
-1. Go to **Theme Settings** (gear icon)
-2. Open **Header Sections** or **Footer Sections** accordion
-3. Click on the section to edit its settings
-4. Changes apply to all pages that show the header/footer
-
-## File Structure
-
-```
-sections/
-  header/
-    header-default.tsx     # Component with smart scroll behavior
-    header.schema.ts       # All settings including scroll behavior
-    index.ts
-  footer/
-    footer-default.tsx     # 3-column footer
-    footer.schema.ts       # Company info, links, copyright settings
-    index.ts
-theme.layout.ts            # References header/footer with default settings
-```
-
-## Extending
-
-### Adding a second header template
-
-```ts
-// sections/header/header-centered.tsx
-export function HeaderCentered({ section, schema, isEditing }) { ... }
-
-// sections/header/index.ts
-export const headerComponents = {
-  default: HeaderDefault,
-  centered: HeaderCentered,   // ← new template
-};
-```
-
-Then in `theme.layout.ts`, change `template: "centered"`.
-
-### Custom scroll behavior
-
-Override the `useHeaderScroll` hook logic in `header-default.tsx`, or create a new template with different behavior. All scroll settings are passed via schema — no code changes needed for basic customization.

package/templates/default/hooks/index.ts

@@ -1,26 +0,0 @@
-/**
- * Theme Hooks
- * Re-exports all authentication form hooks
- */
-
-export { useLoginForm } from "./use-login-form";
-export type { LoginFormData, UseLoginFormReturn } from "./use-login-form";
-
-export { useRegisterForm } from "./use-register-form";
-export type {
-  RegisterFormData,
-  UseRegisterFormReturn,
-} from "./use-register-form";
-
-export { useForgotPasswordForm } from "./use-forgot-password-form";
-export type { UseForgotPasswordFormReturn } from "./use-forgot-password-form";
-
-export { useVerifyCodeForm } from "./use-verify-code-form";
-export type { UseVerifyCodeFormReturn } from "./use-verify-code-form";
-
-export { useProfileForm } from "./use-profile-form";
-export type {
-  ProfileFormData,
-  ChangePasswordData,
-  UseProfileFormReturn,
-} from "./use-profile-form";