kanban-lite 1.0.4

package/package.json

@@ -0,0 +1,161 @@
+{
+  "name": "kanban-lite",
+  "displayName": "Kanban Lite",
+  "description": "A kanban board for your codebase. Features stored as markdown.",
+  "version": "1.0.4",
+  "publisher": "borgius",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/borgius/kanban-lite"
+  },
+  "bugs": {
+    "url": "https://github.com/borgius/kanban-lite/issues"
+  },
+  "homepage": "https://github.com/borgius/kanban-lite#readme",
+  "icon": "resources/icon.png",
+  "galleryBanner": {
+    "color": "#1e1e1e",
+    "theme": "dark"
+  },
+  "engines": {
+    "vscode": "^1.85.0"
+  },
+  "categories": [
+    "Other",
+    "Visualization"
+  ],
+  "keywords": [
+    "kanban",
+    "markdown",
+    "project management",
+    "task management",
+    "board"
+  ],
+  "activationEvents": [
+    "onWebviewPanel:kanban-lite.panel",
+    "onView:kanban-lite.boardView"
+  ],
+  "main": "./dist/extension.js",
+  "contributes": {
+    "viewsContainers": {
+      "activitybar": [
+        {
+          "id": "kanban-lite",
+          "title": "Kanban Lite",
+          "icon": "resources/kanban.svg"
+        }
+      ]
+    },
+    "views": {
+      "kanban-lite": [
+        {
+          "id": "kanban-lite.boardView",
+          "name": "Board",
+          "type": "webview"
+        }
+      ]
+    },
+    "commands": [
+      {
+        "command": "kanban-lite.open",
+        "title": "Open Kanban Board",
+        "category": "Kanban Lite",
+        "icon": {
+          "light": "resources/kanban-light.svg",
+          "dark": "resources/kanban-dark.svg"
+        }
+      },
+      {
+        "command": "kanban-lite.addFeature",
+        "title": "Add Feature",
+        "category": "Kanban Lite"
+      }
+    ],
+    "menus": {
+      "editor/title/run": [
+        {
+          "command": "kanban-lite.open",
+          "when": "resourceLangId == markdown"
+        }
+      ]
+    }
+  },
+  "bin": {
+    "kanban-md": "./dist/standalone.js",
+    "kanban-lite": "./dist/cli.js",
+    "kl": "./dist/cli.js",
+    "kanban-mcp": "./dist/mcp-server.js"
+  },
+  "scripts": {
+    "publish:all": "vsce publish && ovsx publish",
+    "vscode:prepublish": "npm run build",
+    "build": "npm run build:extension && npm run build:webview && npm run build:standalone-webview && npm run build:cli && npm run build:mcp",
+    "build:cli": "esbuild src/cli/index.ts --bundle --outfile=dist/cli.js --format=cjs --platform=node --banner:js=\"#!/usr/bin/env node\"",
+    "build:mcp": "esbuild src/mcp-server/index.ts --bundle --outfile=dist/mcp-server.js --format=cjs --platform=node --external:@modelcontextprotocol/sdk --external:zod --banner:js=\"#!/usr/bin/env node\"",
+    "build:extension": "esbuild src/extension/index.ts --bundle --outfile=dist/extension.js --external:vscode --format=cjs --platform=node",
+    "build:webview": "vite build",
+    "build:standalone": "npm run build:standalone-server && npm run build:standalone-webview",
+    "build:standalone-server": "esbuild src/standalone/index.ts --bundle --outfile=dist/standalone.js --format=cjs --platform=node --banner:js=\"#!/usr/bin/env node\"",
+    "build:standalone-webview": "vite build --config vite.standalone.config.ts",
+    "standalone": "npm run build:standalone && node dist/standalone.js",
+    "watch": "concurrently \"npm run watch:extension\" \"npm run watch:webview\"",
+    "watch:extension": "esbuild src/extension/index.ts --bundle --outfile=dist/extension.js --external:vscode --format=cjs --platform=node --watch",
+    "watch:webview": "vite build --watch",
+    "watch:standalone-server": "esbuild src/standalone/index.ts --bundle --outfile=dist/standalone.js --format=cjs --platform=node --banner:js=\"#!/usr/bin/env node\" --watch",
+    "dev:standalone-server": "node --watch-path=dist/standalone.js dist/standalone.js --port 3001 --no-browser",
+    "dev:standalone-vite": "vite dev --config vite.standalone.config.ts",
+    "dev": "npm run build:standalone-server && concurrently \"npm run watch:extension\" \"npm run watch:webview\" \"npm run watch:standalone-server\" \"npm run dev:standalone-server\" \"npm run dev:standalone-vite\"",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "lint": "eslint src",
+    "typecheck": "tsc --noEmit",
+    "package": "vsce package --no-dependencies -o releases/",
+    "release": "npm version patch && npm run build && npm publish",
+    "release:minor": "npm version minor && npm run build && npm publish",
+    "release:major": "npm version major && npm run build && npm publish"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.2",
+    "@tailwindcss/typography": "^0.5.19",
+    "@types/node": "^20.10.0",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "@types/vscode": "^1.85.0",
+    "@types/ws": "^8.5.0",
+    "@vitejs/plugin-react": "^4.2.0",
+    "@vscode/vsce": "^3.7.1",
+    "autoprefixer": "^10.4.16",
+    "concurrently": "^9.2.1",
+    "esbuild": "^0.19.0",
+    "eslint": "^9.39.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "ovsx": "^0.10.8",
+    "postcss": "^8.4.32",
+    "tailwindcss": "^3.4.0",
+    "typescript": "^5.3.0",
+    "typescript-eslint": "^8.53.0",
+    "vite": "^5.0.0",
+    "vitest": "^4.0.18"
+  },
+  "dependencies": {
+    "@modelcontextprotocol/sdk": "^1.12.1",
+    "@tiptap/extension-placeholder": "^3.15.3",
+    "@tiptap/pm": "^3.15.3",
+    "@tiptap/react": "^3.15.3",
+    "@tiptap/starter-kit": "^3.15.3",
+    "chokidar": "^4.0.0",
+    "clsx": "^2.1.1",
+    "fractional-indexing": "^3.2.0",
+    "lucide-react": "^0.562.0",
+    "marked": "^17.0.3",
+    "open": "^10.1.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "tailwind-merge": "^2.2.0",
+    "tiptap-markdown": "^0.9.0",
+    "ws": "^8.18.0",
+    "zustand": "^5.0.10"
+  }
+}

package/postcss.config.js

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

package/resources/icon-light.svg

@@ -0,0 +1,105 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" width="256" height="256">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#f8fafc"/>
+      <stop offset="50%" stop-color="#f1f5f9"/>
+      <stop offset="100%" stop-color="#e2e8f0"/>
+    </linearGradient>
+    <linearGradient id="col1" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#10b981"/>
+      <stop offset="100%" stop-color="#059669"/>
+    </linearGradient>
+    <linearGradient id="col2" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#f59e0b"/>
+      <stop offset="100%" stop-color="#d97706"/>
+    </linearGradient>
+    <linearGradient id="col3" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#ec4899"/>
+      <stop offset="100%" stop-color="#db2777"/>
+    </linearGradient>
+    <linearGradient id="card1" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#d1fae5"/>
+      <stop offset="100%" stop-color="#a7f3d0"/>
+    </linearGradient>
+    <linearGradient id="card2" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#fef3c7"/>
+      <stop offset="100%" stop-color="#fde68a"/>
+    </linearGradient>
+    <linearGradient id="card3" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#fce7f3"/>
+      <stop offset="100%" stop-color="#fbcfe8"/>
+    </linearGradient>
+    <filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
+      <feDropShadow dx="0" dy="2" stdDeviation="3" flood-color="#64748b" flood-opacity="0.15"/>
+    </filter>
+    <clipPath id="squircle-clip">
+      <rect x="4" y="4" width="248" height="248" rx="48" ry="48"/>
+    </clipPath>
+  </defs>
+
+  <!-- Background squircle -->
+  <rect x="4" y="4" width="248" height="248" rx="48" ry="48" fill="url(#bg)"/>
+  <!-- Subtle border -->
+  <rect x="4" y="4" width="248" height="248" rx="48" ry="48" fill="none" stroke="#94a3b8" stroke-width="1" opacity="0.25"/>
+
+  <g clip-path="url(#squircle-clip)">
+    <!-- Subtle grid dots for texture -->
+    <g opacity="0.06" fill="#64748b">
+      <circle cx="40" cy="40" r="1"/><circle cx="72" cy="40" r="1"/><circle cx="104" cy="40" r="1"/><circle cx="136" cy="40" r="1"/><circle cx="168" cy="40" r="1"/><circle cx="200" cy="40" r="1"/><circle cx="232" cy="40" r="1"/>
+      <circle cx="40" cy="72" r="1"/><circle cx="72" cy="72" r="1"/><circle cx="104" cy="72" r="1"/><circle cx="136" cy="72" r="1"/><circle cx="168" cy="72" r="1"/><circle cx="200" cy="72" r="1"/><circle cx="232" cy="72" r="1"/>
+      <circle cx="40" cy="104" r="1"/><circle cx="72" cy="104" r="1"/><circle cx="104" cy="104" r="1"/><circle cx="136" cy="104" r="1"/><circle cx="168" cy="104" r="1"/><circle cx="200" cy="104" r="1"/><circle cx="232" cy="104" r="1"/>
+      <circle cx="40" cy="136" r="1"/><circle cx="72" cy="136" r="1"/><circle cx="104" cy="136" r="1"/><circle cx="136" cy="136" r="1"/><circle cx="168" cy="136" r="1"/><circle cx="200" cy="136" r="1"/><circle cx="232" cy="136" r="1"/>
+      <circle cx="40" cy="168" r="1"/><circle cx="72" cy="168" r="1"/><circle cx="104" cy="168" r="1"/><circle cx="136" cy="168" r="1"/><circle cx="168" cy="168" r="1"/><circle cx="200" cy="168" r="1"/><circle cx="232" cy="168" r="1"/>
+      <circle cx="40" cy="200" r="1"/><circle cx="72" cy="200" r="1"/><circle cx="104" cy="200" r="1"/><circle cx="136" cy="200" r="1"/><circle cx="168" cy="200" r="1"/><circle cx="200" cy="200" r="1"/><circle cx="232" cy="200" r="1"/>
+    </g>
+
+    <!-- Column 1: To Do (green) -->
+    <g filter="url(#shadow)">
+      <rect x="28" y="44" width="60" height="172" rx="10" fill="white" opacity="0.7"/>
+      <rect x="34" y="50" width="48" height="5" rx="2.5" fill="url(#col1)"/>
+      <rect x="34" y="64" width="48" height="28" rx="6" fill="url(#card1)"/>
+      <rect x="40" y="72" width="24" height="3" rx="1.5" fill="#059669" opacity="0.4"/>
+      <rect x="40" y="78" width="16" height="3" rx="1.5" fill="#059669" opacity="0.25"/>
+      <rect x="34" y="98" width="48" height="28" rx="6" fill="url(#card1)" opacity="0.8"/>
+      <rect x="40" y="106" width="20" height="3" rx="1.5" fill="#059669" opacity="0.35"/>
+      <rect x="40" y="112" width="28" height="3" rx="1.5" fill="#059669" opacity="0.2"/>
+      <rect x="34" y="132" width="48" height="28" rx="6" fill="url(#card1)" opacity="0.6"/>
+      <rect x="40" y="140" width="30" height="3" rx="1.5" fill="#059669" opacity="0.3"/>
+      <rect x="40" y="146" width="18" height="3" rx="1.5" fill="#059669" opacity="0.18"/>
+    </g>
+
+    <!-- Column 2: In Progress (amber) -->
+    <g filter="url(#shadow)">
+      <rect x="98" y="36" width="60" height="184" rx="10" fill="white" opacity="0.7"/>
+      <rect x="104" y="42" width="48" height="5" rx="2.5" fill="url(#col2)"/>
+      <rect x="104" y="56" width="48" height="32" rx="6" fill="url(#card2)"/>
+      <rect x="110" y="64" width="28" height="3" rx="1.5" fill="#d97706" opacity="0.4"/>
+      <rect x="110" y="70" width="20" height="3" rx="1.5" fill="#d97706" opacity="0.25"/>
+      <rect x="110" y="76" width="14" height="3" rx="1.5" fill="#d97706" opacity="0.18"/>
+      <rect x="104" y="94" width="48" height="28" rx="6" fill="url(#card2)" opacity="0.8"/>
+      <rect x="110" y="102" width="22" height="3" rx="1.5" fill="#d97706" opacity="0.35"/>
+      <rect x="110" y="108" width="32" height="3" rx="1.5" fill="#d97706" opacity="0.2"/>
+      <g transform="rotate(-3, 128, 148)">
+        <rect x="102" y="130" width="52" height="30" rx="6" fill="url(#card2)" stroke="#d97706" stroke-width="1" stroke-opacity="0.2"/>
+        <rect x="108" y="138" width="26" height="3" rx="1.5" fill="#d97706" opacity="0.5"/>
+        <rect x="108" y="144" width="18" height="3" rx="1.5" fill="#d97706" opacity="0.3"/>
+      </g>
+    </g>
+
+    <!-- Column 3: Done (pink) -->
+    <g filter="url(#shadow)">
+      <rect x="168" y="44" width="60" height="172" rx="10" fill="white" opacity="0.7"/>
+      <rect x="174" y="50" width="48" height="5" rx="2.5" fill="url(#col3)"/>
+      <rect x="174" y="64" width="48" height="28" rx="6" fill="url(#card3)"/>
+      <rect x="180" y="72" width="22" height="3" rx="1.5" fill="#db2777" opacity="0.4"/>
+      <rect x="180" y="78" width="30" height="3" rx="1.5" fill="#db2777" opacity="0.25"/>
+      <circle cx="211" cy="72" r="5" fill="#db2777" opacity="0.15"/>
+      <path d="M208,72 L210,74.5 L214.5,69.5" fill="none" stroke="#db2777" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.6"/>
+      <rect x="174" y="98" width="48" height="28" rx="6" fill="url(#card3)" opacity="0.8"/>
+      <rect x="180" y="106" width="26" height="3" rx="1.5" fill="#db2777" opacity="0.35"/>
+      <rect x="180" y="112" width="16" height="3" rx="1.5" fill="#db2777" opacity="0.2"/>
+      <circle cx="211" cy="106" r="5" fill="#db2777" opacity="0.12"/>
+      <path d="M208,106 L210,108.5 L214.5,103.5" fill="none" stroke="#db2777" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.4"/>
+    </g>
+  </g>
+</svg>

package/resources/icon.svg

@@ -0,0 +1,105 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" width="256" height="256">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#1e1b4b"/>
+      <stop offset="50%" stop-color="#0f172a"/>
+      <stop offset="100%" stop-color="#020617"/>
+    </linearGradient>
+    <linearGradient id="col1" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#34d399"/>
+      <stop offset="100%" stop-color="#059669"/>
+    </linearGradient>
+    <linearGradient id="col2" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#fbbf24"/>
+      <stop offset="100%" stop-color="#d97706"/>
+    </linearGradient>
+    <linearGradient id="col3" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#f472b6"/>
+      <stop offset="100%" stop-color="#db2777"/>
+    </linearGradient>
+    <linearGradient id="card1" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#6ee7b7"/>
+      <stop offset="100%" stop-color="#34d399"/>
+    </linearGradient>
+    <linearGradient id="card2" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#fde68a"/>
+      <stop offset="100%" stop-color="#fbbf24"/>
+    </linearGradient>
+    <linearGradient id="card3" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" stop-color="#f9a8d4"/>
+      <stop offset="100%" stop-color="#f472b6"/>
+    </linearGradient>
+    <filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
+      <feDropShadow dx="0" dy="2" stdDeviation="3" flood-color="#000" flood-opacity="0.3"/>
+    </filter>
+    <clipPath id="squircle-clip">
+      <rect x="4" y="4" width="248" height="248" rx="48" ry="48"/>
+    </clipPath>
+  </defs>
+
+  <!-- Background squircle -->
+  <rect x="4" y="4" width="248" height="248" rx="48" ry="48" fill="url(#bg)"/>
+  <!-- Subtle border -->
+  <rect x="4" y="4" width="248" height="248" rx="48" ry="48" fill="none" stroke="white" stroke-width="1" opacity="0.08"/>
+
+  <g clip-path="url(#squircle-clip)">
+    <!-- Subtle grid dots for texture -->
+    <g opacity="0.04" fill="white">
+      <circle cx="40" cy="40" r="1"/><circle cx="72" cy="40" r="1"/><circle cx="104" cy="40" r="1"/><circle cx="136" cy="40" r="1"/><circle cx="168" cy="40" r="1"/><circle cx="200" cy="40" r="1"/><circle cx="232" cy="40" r="1"/>
+      <circle cx="40" cy="72" r="1"/><circle cx="72" cy="72" r="1"/><circle cx="104" cy="72" r="1"/><circle cx="136" cy="72" r="1"/><circle cx="168" cy="72" r="1"/><circle cx="200" cy="72" r="1"/><circle cx="232" cy="72" r="1"/>
+      <circle cx="40" cy="104" r="1"/><circle cx="72" cy="104" r="1"/><circle cx="104" cy="104" r="1"/><circle cx="136" cy="104" r="1"/><circle cx="168" cy="104" r="1"/><circle cx="200" cy="104" r="1"/><circle cx="232" cy="104" r="1"/>
+      <circle cx="40" cy="136" r="1"/><circle cx="72" cy="136" r="1"/><circle cx="104" cy="136" r="1"/><circle cx="136" cy="136" r="1"/><circle cx="168" cy="136" r="1"/><circle cx="200" cy="136" r="1"/><circle cx="232" cy="136" r="1"/>
+      <circle cx="40" cy="168" r="1"/><circle cx="72" cy="168" r="1"/><circle cx="104" cy="168" r="1"/><circle cx="136" cy="168" r="1"/><circle cx="168" cy="168" r="1"/><circle cx="200" cy="168" r="1"/><circle cx="232" cy="168" r="1"/>
+      <circle cx="40" cy="200" r="1"/><circle cx="72" cy="200" r="1"/><circle cx="104" cy="200" r="1"/><circle cx="136" cy="200" r="1"/><circle cx="168" cy="200" r="1"/><circle cx="200" cy="200" r="1"/><circle cx="232" cy="200" r="1"/>
+    </g>
+
+    <!-- Column 1: To Do (green) -->
+    <g filter="url(#shadow)">
+      <rect x="28" y="44" width="60" height="172" rx="10" fill="white" opacity="0.06"/>
+      <rect x="34" y="50" width="48" height="5" rx="2.5" fill="url(#col1)" opacity="0.9"/>
+      <rect x="34" y="64" width="48" height="28" rx="6" fill="url(#card1)" opacity="0.85"/>
+      <rect x="40" y="72" width="24" height="3" rx="1.5" fill="white" opacity="0.6"/>
+      <rect x="40" y="78" width="16" height="3" rx="1.5" fill="white" opacity="0.35"/>
+      <rect x="34" y="98" width="48" height="28" rx="6" fill="url(#card1)" opacity="0.65"/>
+      <rect x="40" y="106" width="20" height="3" rx="1.5" fill="white" opacity="0.5"/>
+      <rect x="40" y="112" width="28" height="3" rx="1.5" fill="white" opacity="0.3"/>
+      <rect x="34" y="132" width="48" height="28" rx="6" fill="url(#card1)" opacity="0.45"/>
+      <rect x="40" y="140" width="30" height="3" rx="1.5" fill="white" opacity="0.4"/>
+      <rect x="40" y="146" width="18" height="3" rx="1.5" fill="white" opacity="0.25"/>
+    </g>
+
+    <!-- Column 2: In Progress (amber) -->
+    <g filter="url(#shadow)">
+      <rect x="98" y="36" width="60" height="184" rx="10" fill="white" opacity="0.06"/>
+      <rect x="104" y="42" width="48" height="5" rx="2.5" fill="url(#col2)" opacity="0.9"/>
+      <rect x="104" y="56" width="48" height="32" rx="6" fill="url(#card2)" opacity="0.85"/>
+      <rect x="110" y="64" width="28" height="3" rx="1.5" fill="white" opacity="0.6"/>
+      <rect x="110" y="70" width="20" height="3" rx="1.5" fill="white" opacity="0.35"/>
+      <rect x="110" y="76" width="14" height="3" rx="1.5" fill="white" opacity="0.25"/>
+      <rect x="104" y="94" width="48" height="28" rx="6" fill="url(#card2)" opacity="0.65"/>
+      <rect x="110" y="102" width="22" height="3" rx="1.5" fill="white" opacity="0.5"/>
+      <rect x="110" y="108" width="32" height="3" rx="1.5" fill="white" opacity="0.3"/>
+      <g transform="rotate(-3, 128, 148)">
+        <rect x="102" y="130" width="52" height="30" rx="6" fill="url(#card2)" opacity="0.9" stroke="white" stroke-width="1" stroke-opacity="0.2"/>
+        <rect x="108" y="138" width="26" height="3" rx="1.5" fill="white" opacity="0.7"/>
+        <rect x="108" y="144" width="18" height="3" rx="1.5" fill="white" opacity="0.4"/>
+      </g>
+    </g>
+
+    <!-- Column 3: Done (pink) -->
+    <g filter="url(#shadow)">
+      <rect x="168" y="44" width="60" height="172" rx="10" fill="white" opacity="0.06"/>
+      <rect x="174" y="50" width="48" height="5" rx="2.5" fill="url(#col3)" opacity="0.9"/>
+      <rect x="174" y="64" width="48" height="28" rx="6" fill="url(#card3)" opacity="0.85"/>
+      <rect x="180" y="72" width="22" height="3" rx="1.5" fill="white" opacity="0.6"/>
+      <rect x="180" y="78" width="30" height="3" rx="1.5" fill="white" opacity="0.35"/>
+      <circle cx="211" cy="72" r="5" fill="white" opacity="0.25"/>
+      <path d="M208,72 L210,74.5 L214.5,69.5" fill="none" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.7"/>
+      <rect x="174" y="98" width="48" height="28" rx="6" fill="url(#card3)" opacity="0.65"/>
+      <rect x="180" y="106" width="26" height="3" rx="1.5" fill="white" opacity="0.5"/>
+      <rect x="180" y="112" width="16" height="3" rx="1.5" fill="white" opacity="0.3"/>
+      <circle cx="211" cy="106" r="5" fill="white" opacity="0.2"/>
+      <path d="M208,106 L210,108.5 L214.5,103.5" fill="none" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.5"/>
+    </g>
+  </g>
+</svg>

package/resources/kanban-dark.svg

@@ -0,0 +1,21 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+  <!-- Column 1 (green) -->
+  <rect x="2" y="3" width="5.5" height="16" rx="1.2" fill="white" opacity="0.08"/>
+  <rect x="2.8" y="3.8" width="3.9" height="0.8" rx="0.4" fill="#34d399"/>
+  <rect x="2.8" y="5.5" width="3.9" height="2.8" rx="0.8" fill="#34d399" opacity="0.7"/>
+  <rect x="2.8" y="9" width="3.9" height="2.8" rx="0.8" fill="#34d399" opacity="0.5"/>
+  <rect x="2.8" y="12.5" width="3.9" height="2.8" rx="0.8" fill="#34d399" opacity="0.35"/>
+  <!-- Column 2 (amber) -->
+  <rect x="9.25" y="2" width="5.5" height="18" rx="1.2" fill="white" opacity="0.08"/>
+  <rect x="10.05" y="2.8" width="3.9" height="0.8" rx="0.4" fill="#fbbf24"/>
+  <rect x="10.05" y="4.5" width="3.9" height="3.2" rx="0.8" fill="#fbbf24" opacity="0.7"/>
+  <rect x="10.05" y="8.4" width="3.9" height="2.8" rx="0.8" fill="#fbbf24" opacity="0.5"/>
+  <g transform="rotate(-3, 12, 14)">
+    <rect x="9.85" y="12" width="4.3" height="2.8" rx="0.8" fill="#fbbf24" opacity="0.8" stroke="white" stroke-width="0.3" stroke-opacity="0.3"/>
+  </g>
+  <!-- Column 3 (pink) -->
+  <rect x="16.5" y="3" width="5.5" height="16" rx="1.2" fill="white" opacity="0.08"/>
+  <rect x="17.3" y="3.8" width="3.9" height="0.8" rx="0.4" fill="#f472b6"/>
+  <rect x="17.3" y="5.5" width="3.9" height="2.8" rx="0.8" fill="#f472b6" opacity="0.7"/>
+  <rect x="17.3" y="9" width="3.9" height="2.8" rx="0.8" fill="#f472b6" opacity="0.5"/>
+</svg>

package/resources/kanban-light.svg

@@ -0,0 +1,21 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+  <!-- Column 1 (green) -->
+  <rect x="2" y="3" width="5.5" height="16" rx="1.2" fill="#64748b" opacity="0.08"/>
+  <rect x="2.8" y="3.8" width="3.9" height="0.8" rx="0.4" fill="#059669"/>
+  <rect x="2.8" y="5.5" width="3.9" height="2.8" rx="0.8" fill="#059669" opacity="0.6"/>
+  <rect x="2.8" y="9" width="3.9" height="2.8" rx="0.8" fill="#059669" opacity="0.4"/>
+  <rect x="2.8" y="12.5" width="3.9" height="2.8" rx="0.8" fill="#059669" opacity="0.25"/>
+  <!-- Column 2 (amber) -->
+  <rect x="9.25" y="2" width="5.5" height="18" rx="1.2" fill="#64748b" opacity="0.08"/>
+  <rect x="10.05" y="2.8" width="3.9" height="0.8" rx="0.4" fill="#d97706"/>
+  <rect x="10.05" y="4.5" width="3.9" height="3.2" rx="0.8" fill="#d97706" opacity="0.6"/>
+  <rect x="10.05" y="8.4" width="3.9" height="2.8" rx="0.8" fill="#d97706" opacity="0.4"/>
+  <g transform="rotate(-3, 12, 14)">
+    <rect x="9.85" y="12" width="4.3" height="2.8" rx="0.8" fill="#d97706" opacity="0.7" stroke="#d97706" stroke-width="0.3" stroke-opacity="0.3"/>
+  </g>
+  <!-- Column 3 (pink) -->
+  <rect x="16.5" y="3" width="5.5" height="16" rx="1.2" fill="#64748b" opacity="0.08"/>
+  <rect x="17.3" y="3.8" width="3.9" height="0.8" rx="0.4" fill="#db2777"/>
+  <rect x="17.3" y="5.5" width="3.9" height="2.8" rx="0.8" fill="#db2777" opacity="0.6"/>
+  <rect x="17.3" y="9" width="3.9" height="2.8" rx="0.8" fill="#db2777" opacity="0.4"/>
+</svg>

package/resources/kanban.svg

@@ -0,0 +1,21 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+  <!-- Column 1 -->
+  <rect x="2" y="3" width="5.5" height="16" rx="1.2" opacity="0.08"/>
+  <rect x="2.8" y="3.8" width="3.9" height="0.8" rx="0.4" opacity="0.9"/>
+  <rect x="2.8" y="5.5" width="3.9" height="2.8" rx="0.8" opacity="0.6"/>
+  <rect x="2.8" y="9" width="3.9" height="2.8" rx="0.8" opacity="0.4"/>
+  <rect x="2.8" y="12.5" width="3.9" height="2.8" rx="0.8" opacity="0.25"/>
+  <!-- Column 2 -->
+  <rect x="9.25" y="2" width="5.5" height="18" rx="1.2" opacity="0.08"/>
+  <rect x="10.05" y="2.8" width="3.9" height="0.8" rx="0.4" opacity="0.9"/>
+  <rect x="10.05" y="4.5" width="3.9" height="3.2" rx="0.8" opacity="0.6"/>
+  <rect x="10.05" y="8.4" width="3.9" height="2.8" rx="0.8" opacity="0.4"/>
+  <g transform="rotate(-3, 12, 14)">
+    <rect x="9.85" y="12" width="4.3" height="2.8" rx="0.8" opacity="0.7"/>
+  </g>
+  <!-- Column 3 -->
+  <rect x="16.5" y="3" width="5.5" height="16" rx="1.2" opacity="0.08"/>
+  <rect x="17.3" y="3.8" width="3.9" height="0.8" rx="0.4" opacity="0.9"/>
+  <rect x="17.3" y="5.5" width="3.9" height="2.8" rx="0.8" opacity="0.6"/>
+  <rect x="17.3" y="9" width="3.9" height="2.8" rx="0.8" opacity="0.4"/>
+</svg>