@alliance-droid/svelte-docs-system 0.0.2 → 0.1.0

package/src/routes/quote-demo/+page.svelte

@@ -1,141 +0,0 @@
-<script>
-  import { browser } from '$app/environment';
-  let QuoteDisplay;
-
-  if (browser) {
-    import('$lib').then(mod => {
-      QuoteDisplay = mod.QuoteDisplay;
-    });
-  }
-</script>
-
-<main class="mx-auto max-w-4xl px-6 py-12">
-  <h1 class="mb-2 text-4xl font-bold">QuoteDisplay Component</h1>
-  <p class="mb-8 text-gray-600">A component from the svelte-component-library for displaying quoted text with special rendering effects.</p>
-
-  <!-- QuoteDisplay Section -->
-  <section class="mb-12">
-    <h2 class="mb-4 text-2xl font-bold">Quote Display Demo</h2>
-    <p class="mb-4 text-gray-600">The QuoteDisplay component renders text with special canvas-based effects:</p>
-    
-    <div class="mb-6 rounded-lg border border-gray-200 bg-gray-50 p-6 dark:border-gray-700 dark:bg-gray-900">
-      {#if browser}
-        <QuoteDisplay
-          text="The only way to do great work is to love what you do. - Steve Jobs"
-          style="width: 100%; height: 300px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);"
-        />
-      {:else}
-        <div class="flex items-center justify-center h-96 bg-gradient-to-r from-purple-400 to-pink-500 rounded text-white text-lg">
-          QuoteDisplay component (client-side only)
-        </div>
-      {/if}
-    </div>
-
-    <h3 class="mb-3 text-xl font-semibold">Props</h3>
-    <table class="w-full border-collapse border border-gray-200 dark:border-gray-700">
-      <thead>
-        <tr class="bg-gray-100 dark:bg-gray-800">
-          <th class="border border-gray-200 px-4 py-2 text-left dark:border-gray-700">Prop</th>
-          <th class="border border-gray-200 px-4 py-2 text-left dark:border-gray-700">Type</th>
-          <th class="border border-gray-200 px-4 py-2 text-left dark:border-gray-700">Description</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td class="border border-gray-200 px-4 py-2 dark:border-gray-700"><code>text</code></td>
-          <td class="border border-gray-200 px-4 py-2 dark:border-gray-700">string</td>
-          <td class="border border-gray-200 px-4 py-2 dark:border-gray-700">The text to display in the quote</td>
-        </tr>
-        <tr class="bg-gray-50 dark:bg-gray-900">
-          <td class="border border-gray-200 px-4 py-2 dark:border-gray-700"><code>style</code></td>
-          <td class="border border-gray-200 px-4 py-2 dark:border-gray-700">string</td>
-          <td class="border border-gray-200 px-4 py-2 dark:border-gray-700">CSS style string for the canvas element</td>
-        </tr>
-      </tbody>
-    </table>
-
-    <h3 class="mb-3 mt-6 text-xl font-semibold">Integration</h3>
-    <p class="mb-4 text-gray-600">The QuoteDisplay component is now available through the library exports and can be imported from <code>$lib</code>:</p>
-    
-    <div class="rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-700 dark:bg-gray-900">
-      <pre><code>{`import { QuoteDisplay } from '$lib';
-
-<QuoteDisplay
-  text="Your quote here"
-  style="width: 100%; height: 300px;"
-/>`}</code></pre>
-    </div>
-  </section>
-
-  <nav class="mt-12 flex gap-4">
-    <a href="/" class="text-blue-600 hover:underline dark:text-blue-400">← Back to Components</a>
-  </nav>
-</main>
-
-<style>
-  :global(body) {
-    background-color: white;
-    color: #333;
-  }
-
-  :global(.dark) :global(body) {
-    background-color: #030712;
-    color: #f3f4f6;
-  }
-
-  main {
-    max-width: 56rem;
-    margin: 0 auto;
-    padding: 3rem 1.5rem;
-  }
-
-  h1 {
-    margin-bottom: 0.5rem;
-    font-size: 2.25rem;
-    font-weight: 700;
-    color: #111827;
-  }
-
-  :global(.dark) h1 {
-    color: white;
-  }
-
-  h2 {
-    margin-bottom: 1rem;
-    font-size: 1.5rem;
-    font-weight: 700;
-    color: #111827;
-  }
-
-  :global(.dark) h2 {
-    color: white;
-  }
-
-  h3 {
-    margin-bottom: 0.75rem;
-    font-size: 1.25rem;
-    font-weight: 600;
-    color: #111827;
-  }
-
-  :global(.dark) h3 {
-    color: white;
-  }
-
-  code {
-    background-color: #f3f4f6;
-    padding: 0.125rem 0.375rem;
-    border-radius: 0.25rem;
-    font-family: 'Courier New', monospace;
-  }
-
-  :global(.dark) code {
-    background-color: #374151;
-  }
-
-  pre {
-    overflow-x: auto;
-    padding: 1rem;
-    font-size: 0.875rem;
-  }
-</style>

package/static/robots.txt

@@ -1,3 +0,0 @@
-# allow crawling everything by default
-User-agent: *
-Disallow:

package/svelte.config.js

@@ -1,15 +0,0 @@
-import adapter from '@sveltejs/adapter-vercel';
-
-/** @type {import('@sveltejs/kit').Config} */
-const config = {
-	kit: {
-		adapter: adapter({
-			runtime: 'nodejs22.x'
-		}),
-		prerender: {
-			handleHttpError: 'warn'
-		}
-	}
-};
-
-export default config;

package/tailwind.config.ts

@@ -1,55 +0,0 @@
-import type { Config } from 'tailwindcss';
-
-export default {
-  content: ['./src/**/*.{html,js,svelte,ts}'],
-  theme: {
-    extend: {
-      colors: {
-        // Claude Code aesthetic - professional, clean
-        'claude': {
-          'bg': '#FFFFFF',
-          'bg-secondary': '#F7F6F3',
-          'text': '#1A1A1A',
-          'text-secondary': '#565656',
-          'border': '#ECECEC',
-          'accent': '#0066CC',
-          'accent-hover': '#0052A3',
-        },
-        'claude-dark': {
-          'bg': '#1A1A1A',
-          'bg-secondary': '#2D2D2D',
-          'text': '#FFFFFF',
-          'text-secondary': '#B0B0B0',
-          'border': '#3A3A3A',
-          'accent': '#4D94FF',
-          'accent-hover': '#6BA3FF',
-        },
-      },
-      fontFamily: {
-        'sans': ['-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif'],
-        'mono': ['"Fira Code"', '"Source Code Pro"', 'Menlo', 'monospace'],
-      },
-      typography: (theme: any) => ({
-        DEFAULT: {
-          css: {
-            color: theme('colors.claude.text'),
-            a: {
-              color: theme('colors.claude.accent'),
-              '&:hover': {
-                color: theme('colors.claude.accent-hover'),
-              },
-            },
-            code: {
-              color: theme('colors.claude.accent'),
-              backgroundColor: theme('colors.claude.bg-secondary'),
-              padding: '0.25rem 0.5rem',
-              borderRadius: '0.25rem',
-            },
-          },
-        },
-      }),
-    },
-  },
-  plugins: [],
-  darkMode: 'class', // Use class-based dark mode
-} satisfies Config;

package/template-starter/.github/workflows/build.yml

@@ -1,40 +0,0 @@
-name: Build
-
-on:
-  push:
-    branches:
-      - main
-      - develop
-  pull_request:
-    branches:
-      - main
-      - develop
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v3
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-          cache: 'npm'
-
-      - name: Install dependencies
-        run: npm install
-
-      - name: Lint and type check
-        run: npm run check
-
-      - name: Build
-        run: npm run build
-
-      - name: Upload build artifacts
-        uses: actions/upload-artifact@v3
-        with:
-          name: build
-          path: build/
-          retention-days: 1

package/template-starter/.github/workflows/deploy-github-pages.yml

@@ -1,47 +0,0 @@
-name: Deploy to GitHub Pages
-
-on:
-  push:
-    branches:
-      - main
-  workflow_dispatch:
-
-jobs:
-  build_and_deploy:
-    runs-on: ubuntu-latest
-
-    permissions:
-      contents: read
-      pages: write
-      id-token: write
-
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
-
-    steps:
-      - uses: actions/checkout@v3
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-          cache: 'npm'
-
-      - name: Setup Pages
-        uses: actions/configure-pages@v3
-
-      - name: Install dependencies
-        run: npm install
-
-      - name: Build
-        run: npm run build
-
-      - name: Upload artifact
-        uses: actions/upload-pages-artifact@v2
-        with:
-          path: './build'
-
-      - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@v2

package/template-starter/.github/workflows/deploy-netlify.yml

@@ -1,41 +0,0 @@
-name: Deploy to Netlify
-
-on:
-  push:
-    branches:
-      - main
-  pull_request:
-    branches:
-      - main
-
-jobs:
-  build_and_deploy:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v3
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-          cache: 'npm'
-
-      - name: Install dependencies
-        run: npm install
-
-      - name: Build
-        run: npm run build
-
-      - name: Deploy to Netlify
-        uses: nwtgck/actions-netlify@v2.0
-        with:
-          publish-dir: './build'
-          production-branch: main
-          deploy-message: 'Deploy from GitHub Actions'
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          netlify-auth-token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          netlify-site-id: ${{ secrets.NETLIFY_SITE_ID }}
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        if: github.event_name == 'push' && github.ref == 'refs/heads/main'

package/template-starter/.github/workflows/deploy-vercel.yml

@@ -1,64 +0,0 @@
-name: Deploy to Vercel
-
-on:
-  push:
-    branches:
-      - main
-      - staging
-  pull_request:
-    branches:
-      - main
-      - staging
-
-jobs:
-  build_and_deploy:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v3
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-          cache: 'npm'
-
-      - name: Install dependencies
-        run: npm install
-
-      - name: Build
-        run: npm run build
-
-      - name: Deploy to Vercel (Production)
-        if: github.event_name == 'push' && github.ref == 'refs/heads/main'
-        uses: amondnet/vercel-action@v25
-        with:
-          vercel-token: ${{ secrets.VERCEL_TOKEN }}
-          vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
-          vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
-          vercel-args: '--prod'
-
-      - name: Deploy to Vercel (Preview)
-        if: github.event_name == 'pull_request' || (github.event_name == 'push' && github.ref != 'refs/heads/main')
-        uses: amondnet/vercel-action@v25
-        with:
-          vercel-token: ${{ secrets.VERCEL_TOKEN }}
-          vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
-          vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
-
-      - name: Comment PR with Vercel URL
-        if: github.event_name == 'pull_request'
-        uses: actions/github-script@v6
-        with:
-          script: |
-            const vercelUrl = process.env.VERCEL_URL || '';
-            if (vercelUrl) {
-              github.rest.issues.createComment({
-                issue_number: context.issue.number,
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                body: `🚀 [Preview](https://${vercelUrl}) deployed to Vercel!`
-              });
-            }
-        env:
-          VERCEL_URL: ${{ steps.deploy.outputs.preview_url }}

package/template-starter/NPM-PACKAGE-SETUP.md

@@ -1,233 +0,0 @@
-# NPM Package Setup for Create Command
-
-This template is designed to be published as an npm package that supports the `npm create` command.
-
-## Publishing as @andrew-org/create-docs-system
-
-### Prerequisites
-
-- npm account with access to @andrew-org organization
-- Authenticated npm CLI (`npm login`)
-
-### Package Configuration
-
-The `package.json` is pre-configured for:
-
-```json
-{
-  "name": "@andrew-org/create-docs-system",
-  "version": "1.0.0",
-  "type": "module",
-  "bin": {
-    "create-docs-system": "./bin/create.js"
-  }
-}
-```
-
-### Create Setup Script
-
-Create `bin/create.js` for the setup process:
-
-```javascript
-#!/usr/bin/env node
-import fs from 'fs';
-import path from 'path';
-import { fileURLToPath } from 'url';
-
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
-const sourceDir = path.join(__dirname, '..', 'template');
-const targetDir = process.argv[2] || 'my-docs';
-
-// Copy template files
-fs.cpSync(sourceDir, targetDir, { recursive: true });
-
-console.log(`✨ Documentation site created at ${targetDir}`);
-console.log('Next steps:');
-console.log(`  cd ${targetDir}`);
-console.log(`  npm install`);
-console.log(`  npm run dev`);
-```
-
-### Steps to Publish
-
-1. **Update package.json**
-   ```json
-   {
-     "name": "@andrew-org/create-docs-system",
-     "version": "1.0.0",
-     "repository": {
-       "type": "git",
-       "url": "https://github.com/andrew-org/create-docs-system.git"
-     },
-     "publishConfig": {
-       "access": "public"
-     }
-   }
-   ```
-
-2. **Create bin/create.js** (setup script above)
-
-3. **Test locally**
-   ```bash
-   npm link
-   npm create @andrew-org/docs-system@latest my-test-docs
-   ```
-
-4. **Publish to npm**
-   ```bash
-   npm publish
-   ```
-
-### Usage After Publishing
-
-Users can then create a new documentation site with:
-
-```bash
-npm create @andrew-org/docs-system@latest my-docs
-cd my-docs
-npm install
-npm run dev
-```
-
-Or with a custom name:
-
-```bash
-npm create @andrew-org/docs-system@latest -- --name my-custom-docs
-```
-
-## Testing the Template Locally
-
-### Option 1: Direct Copy
-
-```bash
-cp -r template-starter my-docs
-cd my-docs
-npm install
-npm run build
-```
-
-### Option 2: npm link (Simulate Published Package)
-
-```bash
-cd template-starter
-npm link
-
-# In another terminal, create from it
-npm create linked-package my-docs
-```
-
-### Option 3: Via npm create with Local Path
-
-```bash
-npm create file:./template-starter my-docs
-```
-
-## Template Structure for Publishing
-
-Ensure the template root contains:
-
-```
-template-starter/
-├── bin/
-│   └── create.js              # Setup script (when published)
-├── docs/
-│   ├── index.md
-│   ├── setup.md
-│   ├── guides/
-│   ├── api/
-│   └── _config.json
-├── src/
-│   ├── routes/
-│   ├── lib/
-│   ├── app.css
-│   ├── app.html
-│   └── app.d.ts
-├── .github/workflows/
-│   ├── build.yml
-│   ├── deploy-github-pages.yml
-│   ├── deploy-netlify.yml
-│   └── deploy-vercel.yml
-├── .gitignore
-├── .npmrc
-├── README.md
-├── package.json
-├── svelte.config.js
-├── tailwind.config.ts
-├── tsconfig.json
-├── vite.config.ts
-├── postcss.config.js
-└── pagefind.toml
-```
-
-## Updating the Package
-
-To release a new version:
-
-```bash
-# Update version in package.json
-npm version minor  # or major/patch
-
-# Publish
-npm publish
-```
-
-## Development Workflow
-
-1. Make changes to template files
-2. Test locally by copying template-starter to a test directory
-3. Test build: `npm run build`
-4. Test dev server: `npm run dev`
-5. Update version and publish when ready
-
-## Continuous Integration
-
-Configure GitHub Actions to:
-- Run tests on the template
-- Build and verify it works
-- Automatically publish on version tags
-
-Example workflow (`.github/workflows/publish.yml`):
-
-```yaml
-name: Publish to npm
-
-on:
-  push:
-    tags:
-      - 'v*'
-
-jobs:
-  publish:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-          registry-url: 'https://registry.npmjs.org'
-      - run: npm install
-      - run: npm publish --workspaces
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
-```
-
-## Migration from Old Starter Template
-
-When upgrading users from an old version:
-
-1. Update CHANGELOG.md with breaking changes
-2. Provide migration guide in docs
-3. Maintain backwards compatibility where possible
-4. Test upgrade path
-
-## Support
-
-For issues with the template, users can:
-- Check documentation in `docs/`
-- Review GitHub issues
-- Submit pull requests
-- Contact @andrew-org organization
-
----
-
-**Ready for npm publishing!**