create-noxion 0.1.1 → 0.2.0

package/dist/templates/portfolio/app/page.tsx

@@ -0,0 +1,70 @@
+import Link from "next/link";
+import { getAllProjects } from "../lib/notion";
+
+export const revalidate = 3600;
+
+export default async function HomePage() {
+  const projects = await getAllProjects();
+
+  return (
+    <div>
+      <h1 style={{ fontSize: "1.5rem", fontWeight: 700, marginBottom: "2rem" }}>
+        Projects
+      </h1>
+      <div
+        style={{
+          display: "grid",
+          gridTemplateColumns: "repeat(auto-fill, minmax(280px, 1fr))",
+          gap: "1.5rem",
+        }}
+      >
+        {projects.map((project) => (
+          <Link
+            key={project.id}
+            href={`/${project.slug}`}
+            style={{
+              display: "block",
+              padding: "1.5rem",
+              borderRadius: "var(--noxion-border-radius, 0.5rem)",
+              border: "1px solid var(--noxion-border, #e5e7eb)",
+              transition: "border-color 0.2s",
+            }}
+          >
+            {project.coverImage && (
+              <img
+                src={project.coverImage}
+                alt={project.title}
+                style={{ width: "100%", borderRadius: "0.25rem", marginBottom: "0.75rem" }}
+              />
+            )}
+            <h3 style={{ fontSize: "1.125rem", fontWeight: 600, marginBottom: "0.5rem" }}>
+              {project.title}
+            </h3>
+            {project.description && (
+              <p style={{ fontSize: "0.875rem", color: "var(--noxion-mutedForeground, #737373)" }}>
+                {project.description}
+              </p>
+            )}
+            {Array.isArray(project.metadata.technologies) && (
+              <div style={{ display: "flex", gap: "0.5rem", flexWrap: "wrap", marginTop: "0.75rem" }}>
+                {(project.metadata.technologies as string[]).map((tech) => (
+                  <span
+                    key={tech}
+                    style={{
+                      fontSize: "0.75rem",
+                      padding: "0.125rem 0.5rem",
+                      borderRadius: "9999px",
+                      backgroundColor: "var(--noxion-muted, #f5f5f5)",
+                    }}
+                  >
+                    {tech}
+                  </span>
+                ))}
+              </div>
+            )}
+          </Link>
+        ))}
+      </div>
+    </div>
+  );
+}

package/dist/templates/portfolio/app/providers.tsx

@@ -0,0 +1,45 @@
+"use client";
+
+import { NoxionThemeProvider, defaultTheme, Header, Footer } from "@noxion/renderer";
+
+interface ProvidersProps {
+  siteName: string;
+  author: string;
+  children: React.ReactNode;
+}
+
+export function Providers({ siteName, author, children }: ProvidersProps) {
+  return (
+    <NoxionThemeProvider theme={defaultTheme}>
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          minHeight: "100vh",
+        }}
+      >
+        <Header
+          siteName={siteName}
+          navigation={[
+            { label: "Home", href: "/" },
+          ]}
+        />
+        <main
+          style={{
+            flex: 1,
+            width: "100%",
+            maxWidth: "var(--noxion-content-width, 720px)",
+            margin: "0 auto",
+            padding: "2rem 1.5rem",
+          }}
+        >
+          {children}
+        </main>
+        <Footer
+          siteName={siteName}
+          author={author}
+        />
+      </div>
+    </NoxionThemeProvider>
+  );
+}

package/dist/templates/portfolio/app/robots.ts

@@ -0,0 +1,7 @@
+import type { MetadataRoute } from "next";
+import { generateNoxionRobots } from "@noxion/adapter-nextjs";
+import { siteConfig } from "../lib/config";
+
+export default function robots(): MetadataRoute.Robots {
+  return generateNoxionRobots(siteConfig);
+}

package/dist/templates/portfolio/app/sitemap.ts

@@ -0,0 +1,9 @@
+import type { MetadataRoute } from "next";
+import { generateNoxionSitemap } from "@noxion/adapter-nextjs";
+import { getAllPosts } from "../lib/notion";
+import { siteConfig } from "../lib/config";
+
+export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
+  const posts = await getAllPosts();
+  return generateNoxionSitemap(posts, siteConfig);
+}

package/dist/templates/portfolio/app/theme-script.tsx

@@ -0,0 +1,16 @@
+export function ThemeScript() {
+  const script = `
+    (function() {
+      try {
+        var stored = localStorage.getItem('noxion-theme');
+        var theme = stored || 'system';
+        if (theme === 'system') {
+          theme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+        }
+        document.documentElement.dataset.theme = theme;
+      } catch (e) {}
+    })();
+  `;
+
+  return <script dangerouslySetInnerHTML={{ __html: script }} />;
+}

package/dist/templates/portfolio/lib/config.ts

@@ -0,0 +1,24 @@
+import { loadConfig } from "@noxion/core";
+import type { NoxionConfig } from "@noxion/core";
+import noxionConfigInput from "../noxion.config";
+
+function createConfig(): NoxionConfig {
+  try {
+    return loadConfig(noxionConfigInput);
+  } catch {
+    return {
+      name: noxionConfigInput.name ?? "{{SITE_NAME}}",
+      domain: noxionConfigInput.domain ?? "{{DOMAIN}}",
+      author: noxionConfigInput.author ?? "{{AUTHOR}}",
+      description: noxionConfigInput.description ?? "{{SITE_DESCRIPTION}}",
+      language: noxionConfigInput.language ?? "en",
+      defaultTheme: noxionConfigInput.defaultTheme ?? "system",
+      defaultPageType: "portfolio",
+      revalidate: noxionConfigInput.revalidate ?? 3600,
+      plugins: noxionConfigInput.plugins,
+      collections: noxionConfigInput.collections,
+    };
+  }
+}
+
+export const siteConfig = createConfig();

package/dist/templates/portfolio/lib/notion.ts

@@ -0,0 +1,48 @@
+import { createNotionClient, fetchCollection, fetchPage, downloadImages, mapImages } from "@noxion/core";
+import type { NoxionPage, ExtendedRecordMap } from "@noxion/core";
+import { join } from "node:path";
+import { siteConfig } from "./config";
+
+const notion = createNotionClient({
+  authToken: process.env.NOTION_TOKEN || undefined,
+});
+
+export async function getAllProjects(): Promise<NoxionPage[]> {
+  const collections = siteConfig.collections ?? [];
+  if (collections.length === 0) return [];
+
+  try {
+    const results = await Promise.all(
+      collections.map((col) => fetchCollection(notion, col))
+    );
+    return results.flat();
+  } catch (error) {
+    console.error("Failed to fetch projects:", error);
+    return [];
+  }
+}
+
+export async function getProjectBySlug(slug: string): Promise<NoxionPage | undefined> {
+  const projects = await getAllProjects();
+  return projects.find((p) => p.slug === slug);
+}
+
+export async function getPageRecordMap(pageId: string): Promise<ExtendedRecordMap> {
+  const recordMap = await fetchPage(notion, pageId);
+
+  if (process.env.NODE_ENV === "production") {
+    try {
+      const outputDir = join(process.cwd(), "public");
+      const urlMap = await downloadImages(recordMap, outputDir, { concurrency: 5 });
+      const localUrlMap: Record<string, string> = {};
+      for (const [originalUrl, localPath] of Object.entries(urlMap)) {
+        localUrlMap[originalUrl] = `/images/${localPath.split("/images/").pop()}`;
+      }
+      return mapImages(recordMap, localUrlMap);
+    } catch (error) {
+      console.error("Image download failed, using original URLs:", error);
+    }
+  }
+
+  return recordMap;
+}

package/dist/templates/portfolio/next.config.ts

@@ -0,0 +1,26 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  output: "standalone",
+  transpilePackages: [
+    "@noxion/core",
+    "@noxion/renderer",
+    "@noxion/adapter-nextjs",
+    "@noxion/notion-renderer",
+    "notion-client",
+    "notion-types",
+    "notion-utils",
+  ],
+  images: {
+    remotePatterns: [
+      { protocol: "https", hostname: "www.notion.so" },
+      { protocol: "https", hostname: "notion.so" },
+      { protocol: "https", hostname: "images.unsplash.com" },
+      { protocol: "https", hostname: "s3.us-west-2.amazonaws.com" },
+      { protocol: "https", hostname: "prod-files-secure.s3.us-west-2.amazonaws.com" },
+    ],
+  },
+  staticPageGenerationTimeout: 300,
+};
+
+export default nextConfig;

package/dist/templates/portfolio/noxion.config.ts

@@ -0,0 +1,23 @@
+import { defineConfig } from "@noxion/core";
+
+const config = defineConfig({
+  name: process.env.SITE_NAME ?? "{{SITE_NAME}}",
+  domain: process.env.SITE_DOMAIN ?? "{{DOMAIN}}",
+  author: process.env.SITE_AUTHOR ?? "{{AUTHOR}}",
+  description: process.env.SITE_DESCRIPTION ?? "{{SITE_DESCRIPTION}}",
+  language: "en",
+  defaultTheme: "system",
+  defaultPageType: "portfolio",
+  revalidate: 3600,
+  revalidateSecret: process.env.REVALIDATE_SECRET,
+  collections: [
+    {
+      name: "portfolio",
+      databaseId: process.env.NOTION_PAGE_ID!,
+      pageType: "portfolio",
+      pathPrefix: "/projects",
+    },
+  ],
+});
+
+export default config;

package/dist/templates/portfolio/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "{{PROJECT_NAME}}",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "@noxion/core": "^0.0.2",
+    "@noxion/renderer": "^0.0.2",
+    "@noxion/adapter-nextjs": "^0.0.2",
+    "next": "^16.1.6",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "notion-client": "^7.8.2"
+  },
+  "devDependencies": {
+    "@types/node": "^22.0.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "typescript": "^5.7.0"
+  }
+}

package/dist/templates/portfolio/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "jsx": "react-jsx",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "plugins": [{ "name": "next" }],
+    "outDir": "./dist"
+  },
+  "include": ["**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules", ".next", "out", "dist"]
+}

package/dist/templates/theme/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "noxion-theme-{{THEME_NAME}}",
+  "version": "0.1.0",
+  "description": "A custom Noxion theme",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./styles": "./styles/theme.css"
+  },
+  "files": [
+    "dist",
+    "styles"
+  ],
+  "sideEffects": [
+    "styles/**/*.css"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "prepublishOnly": "bun run build"
+  },
+  "keywords": [
+    "notion",
+    "noxion",
+    "noxion-theme"
+  ],
+  "peerDependencies": {
+    "@noxion/renderer": ">=0.2.0",
+    "react": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@noxion/renderer": "^0.2.0",
+    "@types/react": "^19.2.14",
+    "react": "^19.2.4",
+    "typescript": "^5.7.0"
+  }
+}

package/dist/templates/theme/src/index.ts

@@ -0,0 +1,40 @@
+import { extendTheme } from "@noxion/renderer";
+import type { NoxionThemePackage } from "@noxion/renderer";
+
+const baseTheme: NoxionThemePackage = {
+  name: "noxion-theme-{{THEME_NAME}}",
+  tokens: {
+    colors: {
+      light: {
+        primary: "#2563eb",
+        primaryForeground: "#ffffff",
+        background: "#ffffff",
+        foreground: "#0a0a0a",
+        muted: "#f5f5f5",
+        mutedForeground: "#737373",
+        border: "#e5e7eb",
+        accent: "#f0f9ff",
+        accentForeground: "#1e40af",
+      },
+      dark: {
+        primary: "#3b82f6",
+        primaryForeground: "#ffffff",
+        background: "#0a0a0a",
+        foreground: "#fafafa",
+        muted: "#262626",
+        mutedForeground: "#a3a3a3",
+        border: "#404040",
+        accent: "#1e3a5f",
+        accentForeground: "#93c5fd",
+      },
+    },
+    fonts: {
+      sans: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      mono: 'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',
+    },
+  },
+  supports: ["blog", "docs", "portfolio"],
+};
+
+export const theme = baseTheme;
+export default theme;

package/dist/templates/theme/styles/theme.css

@@ -0,0 +1,23 @@
+:root {
+  --noxion-primary: #2563eb;
+  --noxion-primaryForeground: #ffffff;
+  --noxion-background: #ffffff;
+  --noxion-foreground: #0a0a0a;
+  --noxion-muted: #f5f5f5;
+  --noxion-mutedForeground: #737373;
+  --noxion-border: #e5e7eb;
+  --noxion-accent: #f0f9ff;
+  --noxion-accentForeground: #1e40af;
+}
+
+[data-theme="dark"] {
+  --noxion-primary: #3b82f6;
+  --noxion-primaryForeground: #ffffff;
+  --noxion-background: #0a0a0a;
+  --noxion-foreground: #fafafa;
+  --noxion-muted: #262626;
+  --noxion-mutedForeground: #a3a3a3;
+  --noxion-border: #404040;
+  --noxion-accent: #1e3a5f;
+  --noxion-accentForeground: #93c5fd;
+}

package/dist/templates/theme/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "declaration": true,
+    "declarationMap": true,
+    "sourceMap": true,
+    "outDir": "./dist",
+    "rootDir": "./src",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "isolatedModules": true,
+    "jsx": "react-jsx"
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "exclude": ["node_modules", "dist"]
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-noxion",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "CLI scaffolding tool for Noxion projects",
   "license": "MIT",
   "type": "module",