@geenius/seo 0.1.0 → 0.3.0

package/packages/react/src/pages/SEOAnalyticsPage.tsx

@@ -1,96 +0,0 @@
-import { useState, useEffect } from 'react'
-
-interface AnalyticsSummary {
-  path: string
-  views: number
-  avgTimeOnPage: number
-  bounceRate: number
-}
-
-export function SEOAnalyticsPage() {
-  const [topPages, setTopPages] = useState<AnalyticsSummary[]>([])
-  const [isLoading, setIsLoading] = useState(false)
-
-  useEffect(() => {
-    setIsLoading(true)
-    // Placeholder for Convex query integration
-    // const result = await client.query(api.queries.getTopPages, { limit: 10 })
-    // setTopPages(result)
-    setIsLoading(false)
-  }, [])
-
-  if (isLoading) return <div className="p-4">Loading...</div>
-
-  return (
-    <div className="max-w-6xl mx-auto p-6">
-      <h1 className="text-3xl font-bold mb-6">SEO Analytics</h1>
-
-      <div className="space-y-6">
-        {/* Top Pages */}
-        <div className="border border-gray-200 rounded p-4">
-          <h2 className="font-semibold mb-4">Top Pages by Views</h2>
-
-          <div className="overflow-x-auto">
-            <table className="w-full text-sm">
-              <thead className="bg-gray-100 border-b">
-                <tr>
-                  <th className="text-left p-3">Page</th>
-                  <th className="text-right p-3">Views</th>
-                  <th className="text-right p-3">Avg Time (s)</th>
-                  <th className="text-right p-3">Bounce Rate</th>
-                </tr>
-              </thead>
-              <tbody>
-                {topPages.map((page, i) => (
-                  <tr key={i} className="border-b hover:bg-gray-50">
-                    <td className="p-3 font-mono text-xs">{page.path}</td>
-                    <td className="p-3 text-right">{page.views.toLocaleString()}</td>
-                    <td className="p-3 text-right">{page.avgTimeOnPage.toFixed(1)}</td>
-                    <td className="p-3 text-right">{(page.bounceRate * 100).toFixed(1)}%</td>
-                  </tr>
-                ))}
-              </tbody>
-            </table>
-          </div>
-
-          {topPages.length === 0 && (
-            <p className="text-center text-gray-500 py-8">No analytics data available</p>
-          )}
-        </div>
-
-        {/* Analytics Summary */}
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
-          <div className="border border-gray-200 rounded p-4">
-            <h3 className="text-sm text-gray-600 mb-1">Total Views</h3>
-            <p className="text-2xl font-bold">
-              {topPages.reduce((sum, p) => sum + p.views, 0).toLocaleString()}
-            </p>
-          </div>
-
-          <div className="border border-gray-200 rounded p-4">
-            <h3 className="text-sm text-gray-600 mb-1">Average Time on Page</h3>
-            <p className="text-2xl font-bold">
-              {topPages.length > 0
-                ? (topPages.reduce((sum, p) => sum + p.avgTimeOnPage, 0) / topPages.length).toFixed(1)
-                : '0'}
-              s
-            </p>
-          </div>
-
-          <div className="border border-gray-200 rounded p-4">
-            <h3 className="text-sm text-gray-600 mb-1">Average Bounce Rate</h3>
-            <p className="text-2xl font-bold">
-              {topPages.length > 0
-                ? (
-                    (topPages.reduce((sum, p) => sum + p.bounceRate, 0) / topPages.length) *
-                    100
-                  ).toFixed(1)
-                : '0'}
-              %
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}

package/packages/react/src/pages/index.ts

@@ -1,2 +0,0 @@
-export * from './SEOAdminPage'
-export * from './SEOAnalyticsPage'

package/packages/react/tsconfig.json

@@ -1,19 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "dist",
-    "rootDir": "src",
-    "jsx": "react-jsx",
-    "strict": true,
-    "skipLibCheck": true,
-    "forceConsistentCasingInFileNames": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "target": "ES2022",
-    "module": "ESNext",
-    "moduleResolution": "bundler"
-  },
-  "include": [
-    "src"
-  ]
-}

package/packages/react/tsup.config.ts

@@ -1,12 +0,0 @@
-import { defineConfig } from 'tsup'
-
-export default defineConfig({
-    entry: { index: 'src/index.ts' },
-    outDir: 'dist',
-    format: ['esm'],
-    dts: true,
-    sourcemap: true,
-    clean: true,
-    treeshake: true,
-    external: ['react', 'react-dom'],
-})

package/packages/react-css/package.json

@@ -1,36 +0,0 @@
-{
-  "name": "@geenius-seo/react-css",
-  "version": "0.1.0",
-  "description": "Geenius SEO — react components with vanilla CSS",
-  "type": "module",
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js",
-      "types": "./dist/index.d.ts"
-    }
-  },
-  "scripts": {
-    "build": "tsup",
-    "lint": "tsc --noEmit",
-    "clean": "rm -rf dist"
-  },
-  "files": ["dist"],
-  "publishConfig": { "access": "public" },
-  "peerDependencies": { "react": ">=18.0.0" },
-  "dependencies": {
-    "@geenius-seo/shared": "workspace:*"
-  },
-  "devDependencies": {
-    "@types/react": "^19.0.0",
-    "react": "^19.2.4",
-    "tsup": "^8.5.1",
-    "typescript": "~6.0.2"
-  },
-  "author": "Antigravity HQ",
-  "license": "MIT",
-  "engines": { "node": ">=20.0.0" }
-}

package/packages/react-css/src/components/ArticleJsonLd.tsx

@@ -1,42 +0,0 @@
-import { useEffect } from 'react'
-import { articleSchema } from '@geenius-seo/shared'
-
-interface ArticleJsonLdProps {
-  title: string
-  description: string
-  author: string
-  datePublished: string
-  url: string
-  image?: string
-}
-
-export function ArticleJsonLd({
-  title,
-  description,
-  author,
-  datePublished,
-  url,
-  image,
-}: ArticleJsonLdProps) {
-  useEffect(() => {
-    const script = document.createElement('script')
-    script.type = 'application/ld+json'
-    script.textContent = JSON.stringify(
-      articleSchema({
-        title,
-        description,
-        author,
-        datePublished,
-        url,
-        image,
-      }),
-    )
-    document.head.appendChild(script)
-
-    return () => {
-      document.head.removeChild(script)
-    }
-  }, [title, description, author, datePublished, url, image])
-
-  return <div className="seo__article-jsonld" />
-}

package/packages/react-css/src/components/BreadcrumbsJsonLd.tsx

@@ -1,24 +0,0 @@
-import { useEffect } from 'react'
-import { breadcrumbSchema } from '@geenius-seo/shared'
-
-interface BreadcrumbsJsonLdProps {
-  items: {
-    name: string
-    url: string
-  }[]
-}
-
-export function BreadcrumbsJsonLd({ items }: BreadcrumbsJsonLdProps) {
-  useEffect(() => {
-    const script = document.createElement('script')
-    script.type = 'application/ld+json'
-    script.textContent = JSON.stringify(breadcrumbSchema(items))
-    document.head.appendChild(script)
-
-    return () => {
-      document.head.removeChild(script)
-    }
-  }, [items])
-
-  return <div className="seo__breadcrumbs" />
-}

package/packages/react-css/src/components/MetaEditor.tsx

@@ -1,147 +0,0 @@
-import { useState } from 'react'
-import type { SEOMeta } from '@geenius-seo/shared'
-
-interface MetaEditorProps {
-  meta: SEOMeta
-  onChange: (meta: SEOMeta) => void
-}
-
-export function MetaEditor({ meta, onChange }: MetaEditorProps) {
-  const [localMeta, setLocalMeta] = useState(meta)
-
-  const handleChange = (updates: Partial<SEOMeta>) => {
-    const updated = { ...localMeta, ...updates }
-    setLocalMeta(updated)
-    onChange(updated)
-  }
-
-  return (
-    <div className="seo__meta-editor">
-      <div className="seo__meta-field">
-        <label className="seo__meta-field-label">
-          Title ({localMeta.title.length}/60)
-        </label>
-        <input
-          type="text"
-          value={localMeta.title}
-          onChange={(e) =>
-            handleChange({
-              title: e.target.value.slice(0, 60),
-            })
-          }
-          className="seo__meta-field-input"
-          placeholder="Page title"
-        />
-        <div className="seo__meta-char-count">
-          {localMeta.title.length < 30
-            ? 'Too short'
-            : localMeta.title.length > 60
-              ? 'Too long'
-              : 'Good length'}
-        </div>
-      </div>
-
-      <div className="seo__meta-field">
-        <label className="seo__meta-field-label">
-          Description ({localMeta.description.length}/160)
-        </label>
-        <textarea
-          value={localMeta.description}
-          onChange={(e) =>
-            handleChange({
-              description: e.target.value.slice(0, 160),
-            })
-          }
-          className="seo__meta-field-textarea"
-          placeholder="Page description"
-        />
-        <div className="seo__meta-char-count">
-          {localMeta.description.length < 50
-            ? 'Too short'
-            : localMeta.description.length > 160
-              ? 'Too long'
-              : 'Good length'}
-        </div>
-      </div>
-
-      <div className="seo__meta-field">
-        <label className="seo__meta-field-label">Keywords</label>
-        <input
-          type="text"
-          value={localMeta.keywords.join(', ')}
-          onChange={(e) =>
-            handleChange({
-              keywords: e.target.value.split(',').map((k) => k.trim()),
-            })
-          }
-          className="seo__meta-field-input"
-          placeholder="keyword1, keyword2, keyword3"
-        />
-      </div>
-
-      <div className="seo__meta-field">
-        <label className="seo__meta-field-label">Canonical URL</label>
-        <input
-          type="url"
-          value={localMeta.canonical || ''}
-          onChange={(e) =>
-            handleChange({
-              canonical: e.target.value,
-            })
-          }
-          className="seo__meta-field-input"
-          placeholder="https://example.com/page"
-        />
-      </div>
-
-      <div className="seo__meta-field">
-        <label className="seo__meta-field-label">OG Image URL</label>
-        <input
-          type="url"
-          value={localMeta.og.image || ''}
-          onChange={(e) =>
-            handleChange({
-              og: { ...localMeta.og, image: e.target.value },
-            })
-          }
-          className="seo__meta-field-input"
-          placeholder="https://example.com/image.jpg"
-        />
-      </div>
-
-      <div className="seo__meta-field">
-        <label className="seo__meta-field-label">Twitter Card Type</label>
-        <select
-          value={localMeta.twitter.card}
-          onChange={(e) =>
-            handleChange({
-              twitter: {
-                ...localMeta.twitter,
-                card: e.target.value as 'summary' | 'summary_large_image',
-              },
-            })
-          }
-          className="seo__meta-field-select"
-        >
-          <option value="summary">Summary</option>
-          <option value="summary_large_image">Summary Large Image</option>
-        </select>
-      </div>
-
-      <div className="seo__meta-field">
-        <label className="seo__meta-field-label">Robots Directive</label>
-        <input
-          type="text"
-          value={localMeta.robots || ''}
-          onChange={(e) =>
-            handleChange({
-              robots: e.target.value,
-            })
-          }
-          className="seo__meta-field-input"
-          placeholder="index, follow"
-        />
-      </div>
-    </div>
-  )
-}

package/packages/react-css/src/components/SEOHead.tsx

@@ -1,95 +0,0 @@
-import { useEffect } from 'react'
-import type { SEOMeta } from '@geenius-seo/shared'
-
-interface SEOHeadProps {
-  meta: SEOMeta
-}
-
-export function SEOHead({ meta }: SEOHeadProps) {
-  useEffect(() => {
-    document.title = meta.title
-
-    const setMetaTag = (name: string, content: string, isProperty = false) => {
-      let tag = document.querySelector(
-        `meta[${isProperty ? 'property' : 'name'}="${name}"]`,
-      ) as HTMLMetaElement
-      if (!tag) {
-        tag = document.createElement('meta')
-        isProperty ? tag.setAttribute('property', name) : tag.setAttribute('name', name)
-        document.head.appendChild(tag)
-      }
-      tag.content = content
-    }
-
-    setMetaTag('description', meta.description)
-    if (meta.keywords.length > 0) {
-      setMetaTag('keywords', meta.keywords.join(', '))
-    }
-    if (meta.robots) {
-      setMetaTag('robots', meta.robots)
-    }
-
-    setMetaTag('og:title', meta.og.title, true)
-    setMetaTag('og:description', meta.og.description, true)
-    if (meta.og.image) {
-      setMetaTag('og:image', meta.og.image, true)
-      if (meta.og.imageAlt) {
-        setMetaTag('og:image:alt', meta.og.imageAlt, true)
-      }
-    }
-    setMetaTag('og:type', meta.og.type, true)
-    setMetaTag('og:url', meta.og.url, true)
-    if (meta.og.siteName) {
-      setMetaTag('og:site_name', meta.og.siteName, true)
-    }
-
-    setMetaTag('twitter:card', meta.twitter.card)
-    setMetaTag('twitter:title', meta.twitter.title)
-    setMetaTag('twitter:description', meta.twitter.description)
-    if (meta.twitter.image) {
-      setMetaTag('twitter:image', meta.twitter.image)
-    }
-    if (meta.twitter.creator) {
-      setMetaTag('twitter:creator', meta.twitter.creator)
-    }
-
-    if (meta.canonical) {
-      let canonicalLink = document.querySelector('link[rel="canonical"]') as HTMLLinkElement
-      if (!canonicalLink) {
-        canonicalLink = document.createElement('link')
-        canonicalLink.rel = 'canonical'
-        document.head.appendChild(canonicalLink)
-      }
-      canonicalLink.href = meta.canonical
-    }
-
-    if (meta.alternates) {
-      Object.entries(meta.alternates).forEach(([lang, url]) => {
-        let altLink = document.querySelector(
-          `link[rel="alternate"][hreflang="${lang}"]`,
-        ) as HTMLLinkElement
-        if (!altLink) {
-          altLink = document.createElement('link')
-          altLink.rel = 'alternate'
-          altLink.hrefLang = lang
-          document.head.appendChild(altLink)
-        }
-        altLink.href = url
-      })
-    }
-
-    if (meta.jsonLd && meta.jsonLd.length > 0) {
-      meta.jsonLd.forEach((schema) => {
-        let script = document.querySelector('script[type="application/ld+json"]') as HTMLScriptElement
-        if (!script) {
-          script = document.createElement('script')
-          script.type = 'application/ld+json'
-          document.head.appendChild(script)
-        }
-        script.textContent = JSON.stringify(schema)
-      })
-    }
-  }, [meta])
-
-  return <div className="seo__head" />
-}

package/packages/react-css/src/components/SEOPreview.tsx

@@ -1,42 +0,0 @@
-import type { SEOMeta } from '@geenius-seo/shared'
-
-interface SEOPreviewProps {
-  meta: SEOMeta
-}
-
-export function SEOPreview({ meta }: SEOPreviewProps) {
-  return (
-    <div className="seo__preview">
-      <div>
-        <h3 style={{ fontSize: '0.875rem', fontWeight: 600, marginBottom: '0.5rem' }}>
-          Google Search Preview
-        </h3>
-        <div className="seo__preview-google">
-          <div className="seo__preview-google-url">{new URL(meta.og.url).hostname}</div>
-          <div className="seo__preview-google-title">{meta.title}</div>
-          <div className="seo__preview-google-desc">{meta.description}</div>
-        </div>
-      </div>
-
-      <div>
-        <h3 style={{ fontSize: '0.875rem', fontWeight: 600, marginBottom: '0.5rem' }}>
-          Social Media Preview
-        </h3>
-        <div className="seo__preview-social">
-          {meta.og.image && (
-            <img
-              src={meta.og.image}
-              alt={meta.og.imageAlt || meta.og.title}
-              className="seo__preview-social-image"
-            />
-          )}
-          <div className="seo__preview-social-info">
-            <div className="seo__preview-social-title">{meta.og.title}</div>
-            <div className="seo__preview-social-desc">{meta.og.description}</div>
-            <div className="seo__preview-social-url">{meta.og.url}</div>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}

package/packages/react-css/src/components/SEOScoreCard.tsx

@@ -1,42 +0,0 @@
-import { useSEOScore } from '@geenius-seo/react'
-import type { SEOMeta } from '@geenius-seo/shared'
-
-interface SEOScoreCardProps {
-  meta: SEOMeta
-}
-
-export function SEOScoreCard({ meta }: SEOScoreCardProps) {
-  const { score, issues } = useSEOScore(meta)
-
-  const scoreClass =
-    score >= 80 ? 'seo__score-number--good' : score >= 50 ? 'seo__score-number--fair' : 'seo__score-number--poor'
-  const barClass =
-    score >= 80 ? 'seo__score-bar-fill--good' : score >= 50 ? 'seo__score-bar-fill--fair' : 'seo__score-bar-fill--poor'
-
-  return (
-    <div className="seo__score-card">
-      <div className="seo__score-card-header">
-        <div className="seo__score-card-title">SEO Score</div>
-        <span className={`seo__score-number ${scoreClass}`}>{score}/100</span>
-      </div>
-
-      <div className="seo__score-bar">
-        <div className={`seo__score-bar-fill ${barClass}`} style={{ width: `${score}%` }} />
-      </div>
-
-      {issues.length > 0 && (
-        <div>
-          <div className="seo__issue-list-title">Issues Found</div>
-          <ul className="seo__issue-list">
-            {issues.map((issue, i) => (
-              <li key={i} className="seo__issue-item">
-                <span className="seo__issue-item-bullet">•</span>
-                {issue}
-              </li>
-            ))}
-          </ul>
-        </div>
-      )}
-    </div>
-  )
-}

package/packages/react-css/src/components/SitemapViewer.tsx

@@ -1,36 +0,0 @@
-import type { SitemapEntry } from '@geenius-seo/shared'
-
-interface SitemapViewerProps {
-  entries: SitemapEntry[]
-}
-
-export function SitemapViewer({ entries }: SitemapViewerProps) {
-  return (
-    <div>
-      <table className="seo__sitemap-table">
-        <thead className="seo__sitemap-table-head">
-          <tr>
-            <th className="seo__sitemap-table-header">URL</th>
-            <th className="seo__sitemap-table-header">Last Modified</th>
-            <th className="seo__sitemap-table-header">Change Frequency</th>
-            <th className="seo__sitemap-table-header">Priority</th>
-          </tr>
-        </thead>
-        <tbody>
-          {entries.map((entry, i) => (
-            <tr key={i} className="seo__sitemap-row">
-              <td className="seo__sitemap-cell">
-                <a href={entry.url} target="_blank" rel="noopener noreferrer" className="seo__sitemap-url">
-                  {entry.url}
-                </a>
-              </td>
-              <td className="seo__sitemap-cell seo__sitemap-cell-muted">{entry.lastmod || '-'}</td>
-              <td className="seo__sitemap-cell seo__sitemap-cell-muted">{entry.changefreq || '-'}</td>
-              <td className="seo__sitemap-cell seo__sitemap-cell-muted">{entry.priority || '-'}</td>
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </div>
-  )
-}

package/packages/react-css/src/components/index.ts

@@ -1,7 +0,0 @@
-export * from './SEOHead'
-export * from './SEOPreview'
-export * from './SEOScoreCard'
-export * from './MetaEditor'
-export * from './SitemapViewer'
-export * from './BreadcrumbsJsonLd'
-export * from './ArticleJsonLd'

package/packages/react-css/src/index.ts

@@ -1,9 +0,0 @@
-// Re-export all React hooks and types
-export * from '@geenius-seo/react'
-
-// CSS Components
-export * from './components'
-export * from './pages'
-
-// CSS Styles
-import './seo.css'