Add editor

editor/.gitignore

@@ -0,0 +1,38 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+node_modules
+.pnp
+.pnp.js
+
+# testing
+coverage
+
+# next.js
+.next/
+out/
+dist
+build
+.vercel
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# turbo
+.turbo
+
+# vercel
+.vercel

editor/package.json

@@ -0,0 +1,81 @@
+{
+  "name": "@roadmapsh/dummy-editor",
+  "version": "0.0.5",
+  "description": "Dummy editor for the Roadmap Editor",
+  "private": false,
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist/**"
+  ],
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "node": {
+        "import": {
+          "types": "./dist/index.d.ts",
+          "default": "./dist/index.mjs"
+        },
+        "require": {
+          "types": "./dist/index.d.cts",
+          "default": "./dist/index.js"
+        }
+      },
+      "browser": {
+        "import": {
+          "types": "./dist/index.d.ts",
+          "default": "./dist/index.mjs"
+        },
+        "require": {
+          "types": "./dist/index.d.cts",
+          "default": "./dist/index.js"
+        }
+      },
+      "default": {
+        "import": {
+          "types": "./dist/index.d.ts",
+          "default": "./dist/index.mjs"
+        },
+        "require": {
+          "types": "./dist/index.d.cts",
+          "default": "./dist/index.js"
+        }
+      }
+    },
+    "./style.css": "./dist/index.css"
+  },
+  "typesVersions": {
+    "*": {
+      "*": [
+        "dist/index.d.ts"
+      ]
+    }
+  },
+  "scripts": {
+    "dev": "tsup --watch",
+    "clean": "rm -rf dist && rm -rf node_modules",
+    "build": "tsup"
+  },
+  "keywords": [],
+  "author": "Arik Chakma <arikchangma@gmail.com>",
+  "license": "ISC",
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "react": "^19.0.0",
+    "tailwind-merge": "^3.0.1"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4.0.3",
+    "@types/react": "^19.0.8",
+    "postcss": "^8.5.1",
+    "postcss-replace": "^2.0.1",
+    "tailwindcss": "^4.0.3",
+    "tsup": "^8.3.6",
+    "typescript": "^5.7.3"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

editor/postcss.config.mjs

@@ -0,0 +1,12 @@
+export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+    'postcss-replace': {
+      pattern: /(--tw|\*, ::before, ::after)/g,
+      data: {
+        '--tw': '--rdm-tw',
+        '*, ::before, ::after': ':root',
+      },
+    },
+  },
+};

editor/src/components/readonly-editor.tsx

@@ -0,0 +1,22 @@
+import { forwardRef, memo } from 'react';
+
+export const ReadonlyEditor = memo(
+  forwardRef<HTMLDivElement, any>((props, ref) => {
+    return (
+      <div className="rdm:fixed rdm:bottom-0 rdm:left-0 rdm:right-0 rdm:top-0 rdm:z-[9999] rdm:border rdm:border-gray-200 rdm:bg-white rdm:p-5 rdm:text-black">
+        <h2 className="rdm:mb-2 rdm:text-xl rdm:font-semibold">
+          Private Component
+        </h2>
+        <p className="rdm:mb-4">
+          Renderer is a private component. If you are a collaborator and have
+          access to it. Run the following command:
+        </p>
+        <code className="rdm:mt-5 rdm:rounded-md rdm:bg-gray-800 rdm:p-2 rdm:text-white">
+          npm run generate-renderer
+        </code>
+      </div>
+    );
+  })
+);
+
+ReadonlyEditor.displayName = 'ReadonlyEditor';

editor/src/components/render-flow-json.ts

@@ -0,0 +1,6 @@
+export function renderFlowJSON(data: any, options?: any): Promise<any> {
+  console.warn('renderFlowJSON is not implemented');
+  console.warn('run the following command to generate the renderer:');
+  console.warn('> npm run generate-renderer');
+  return Promise.resolve(null);
+}

editor/src/components/renderer.tsx

@@ -0,0 +1,20 @@
+import { forwardRef } from 'react';
+
+export const Renderer = forwardRef<HTMLDivElement, any>((props, ref) => {
+  return (
+    <div className="rdm:fixed rdm:bottom-0 rdm:left-0 rdm:right-0 rdm:top-0 rdm:z-[9999] rdm:border rdm:border-gray-200 rdm:bg-white rdm:p-5 rdm:text-black">
+      <h2 className="rdm:mb-2 rdm:text-xl rdm:font-semibold">
+        Private Component
+      </h2>
+      <p className="rdm:mb-4">
+        Renderer is a private component. If you are a collaborator and have
+        access to it. Run the following command:
+      </p>
+      <code className="rdm:mt-5 rdm:rounded-md rdm:bg-gray-800 rdm:p-2 rdm:text-white">
+        npm run generate-renderer
+      </code>
+    </div>
+  );
+});
+
+Renderer.displayName = 'Renderer';

editor/src/components/roadmap-generator.ts

@@ -0,0 +1,27 @@
+import type { Edge, Node } from './types';
+
+export function generateRoadmapFromText(markdown: string | any[]): {
+  nodes: Node[];
+  edges: Edge[];
+} {
+  console.warn('generateRoadmapFromText is not implemented');
+  console.warn('run the following command to generate the renderer:');
+  console.warn('> npm run generate-renderer');
+  return {
+    nodes: [],
+    edges: [],
+  };
+}
+
+export function generateAIRoadmapFromText(markdown: string | any[]): {
+  nodes: Node[];
+  edges: Edge[];
+} {
+  console.warn('generateAIRoadmapFromText is not implemented');
+  console.warn('run the following command to generate the renderer:');
+  console.warn('> npm run generate-renderer');
+  return {
+    nodes: [],
+    edges: [],
+  };
+}

editor/src/components/types.ts

@@ -0,0 +1,3 @@
+export type Edge = any;
+export type Node = any;
+export type XYPosition = any;

editor/src/global.css

@@ -0,0 +1 @@
+@import 'tailwindcss' prefix(rdm);

editor/src/index.tsx

@@ -0,0 +1,7 @@
+import './global.css';
+
+export * from './components/readonly-editor';
+export * from './components/renderer';
+export * from './components/render-flow-json';
+export * from './components/roadmap-generator';
+export * from './components/types';

editor/tsconfig.json

@@ -0,0 +1,29 @@
+{
+  "compilerOptions": {
+    "composite": false,
+    "declaration": true,
+    "declarationMap": true,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "inlineSources": false,
+    "isolatedModules": true,
+    "moduleResolution": "node",
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "preserveWatchOutput": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "strictNullChecks": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
+    "module": "ESNext",
+    "target": "es6",
+    "baseUrl": ".",
+    "paths": {
+      "~/*": ["src/*"]
+    }
+  },
+  "include": [".", "src/types"],
+  "exclude": ["dist", "build", "node_modules"]
+}

editor/tsup.config.ts

@@ -0,0 +1,22 @@
+import { defineConfig, Options } from 'tsup';
+
+const packageOptions: Options = {
+  clean: true,
+  dts: true,
+  format: ['cjs', 'esm'],
+  platform: 'neutral',
+  sourcemap: true,
+};
+
+export default defineConfig([
+  {
+    ...packageOptions,
+    entry: {
+      index: 'src/index.tsx',
+    },
+    external: ['react'],
+    outExtension(ctx) {
+      return ctx.format === 'esm' ? { js: '.mjs' } : { js: '.js' };
+    },
+  },
+]);

scripts/generate-renderer-dummy.sh

@@ -0,0 +1,15 @@
+rm -rf .temp
+rm -rf editor
+
+git clone ssh://git@github.com/roadmapsh/web-draw.git .temp/web-draw --depth 1
+
+cd .temp/web-draw
+pnpm install
+npm run build -- --filter=@roadmapsh/dummy-editor
+
+
+# Copy new editor
+cp -rf packages/dummy-editor ../../editor
+
+# Remove temp directory
+rm -rf .temp