@polymorphism-tech/morph-spec 7.9.4 → 8.1.0

package/src/core/work-types.js

@@ -0,0 +1,79 @@
+/**
+ * Work Types — Single Source of Truth (v8)
+ *
+ * Routes work by TYPE (feature/bug/chore/hotfix), each with a dimensioned
+ * pipeline. `derivePhase` is already skip-tolerant via approved gates
+ * (`gateImpliedPhase`), so "skipping phases" means stamping gates by policy
+ * at birth (`approvedBy: "policy:{type}"` — see POLICY_APPROVER_PREFIX).
+ *
+ * Edit ONLY this file to add, rename, or retune a work type. Consumed by
+ * `create`/`retype`/`risk-detector` in later tasks — this module is pure
+ * and has no filesystem/CLI side effects.
+ *
+ * Fields per type:
+ *   label            - Human-readable name
+ *   scaffold         - Phase folders created at feature birth (subset of
+ *                       0-proposal/1-design/2-plan/3-implement/4-review)
+ *   skippedGates     - Gates stamped `policy:{type}`-approved at birth
+ *                       instead of waiting for human approval
+ *   forcedPauseGates - Gates that ALWAYS pause for a human, regardless of
+ *                       trust mode or skippedGates (e.g. hotfix.review)
+ *   entrySkill       - The skill that kicks off work of this type
+ */
+
+export const DEFAULT_WORK_TYPE = 'feature';
+export const POLICY_APPROVER_PREFIX = 'policy:';
+
+export const WORK_TYPES = {
+  feature: {
+    label: 'Feature',
+    scaffold: ['0-proposal'],
+    skippedGates: [],
+    forcedPauseGates: [],
+    entrySkill: 'morph-proposal',
+  },
+  bug: {
+    label: 'Bug fix',
+    scaffold: ['0-proposal'],
+    skippedGates: [],
+    forcedPauseGates: [],
+    entrySkill: 'morph-proposal',
+  },
+  chore: {
+    label: 'Chore',
+    scaffold: ['0-proposal', '2-plan', '3-implement'],
+    skippedGates: ['proposal', 'plan'],
+    forcedPauseGates: [],
+    entrySkill: 'morph-proposal',
+  },
+  hotfix: {
+    label: 'Hotfix',
+    scaffold: ['0-proposal', '2-plan', '3-implement'],
+    skippedGates: ['proposal', 'plan'],
+    forcedPauseGates: ['review'],
+    entrySkill: 'morph-hotfix',
+  },
+};
+
+/**
+ * @param {string} t - candidate work type key
+ * @returns {boolean} true iff `t` is a known key of WORK_TYPES
+ */
+export function isValidWorkType(t) {
+  return Object.prototype.hasOwnProperty.call(WORK_TYPES, t);
+}
+
+/**
+ * Resolve a feature's work-type config, defaulting to `feature` when the
+ * feature has no `workType` or an unrecognized one.
+ *
+ * @param {object} feature - feature.json contents (uses `workType`)
+ * @returns {object} the matching WORK_TYPES entry
+ */
+export function getWorkType(feature) {
+  // Guard against inherited property names (e.g. workType: "toString") — a bare
+  // WORK_TYPES[key] lookup would resolve those to Object.prototype members.
+  return isValidWorkType(feature?.workType)
+    ? WORK_TYPES[feature.workType]
+    : WORK_TYPES[DEFAULT_WORK_TYPE];
+}

package/src/dashboard/app/components/DetailPanel.jsx

@@ -1,11 +1,11 @@
-export default function DetailPanel({ open, title, onClose, children }) {
-  return (
-    <div className={`fixed top-0 right-0 h-full w-96 bg-gray-900 border-l border-gray-700 shadow-2xl transform transition-transform duration-200 ease-in-out z-50 ${open ? 'translate-x-0' : 'translate-x-full'}`}>
-      <div className="flex items-center justify-between p-4 border-b border-gray-700">
-        <h2 className="text-white font-semibold text-lg truncate">{title}</h2>
-        <button onClick={onClose} className="text-gray-400 hover:text-white text-xl leading-none">×</button>
-      </div>
-      <div className="p-4 overflow-y-auto h-[calc(100%-57px)]">{children}</div>
-    </div>
-  );
-}
+export default function DetailPanel({ open, title, onClose, children }) {
+  return (
+    <div className={`fixed top-0 right-0 h-full w-96 bg-gray-900 border-l border-gray-700 shadow-2xl transform transition-transform duration-200 ease-in-out z-50 ${open ? 'translate-x-0' : 'translate-x-full'}`}>
+      <div className="flex items-center justify-between p-4 border-b border-gray-700">
+        <h2 className="text-white font-semibold text-lg truncate">{title}</h2>
+        <button onClick={onClose} className="text-gray-400 hover:text-white text-xl leading-none">×</button>
+      </div>
+      <div className="p-4 overflow-y-auto h-[calc(100%-57px)]">{children}</div>
+    </div>
+  );
+}

package/src/dashboard/app/components/FlowGraph.jsx

@@ -1,17 +1,17 @@
-import { ReactFlow, Controls, MiniMap, Background } from '@xyflow/react';
-
-export default function FlowGraph({ nodes, edges, nodeTypes, onNodeClick, fitView = true, className = '' }) {
-  return (
-    <div className={`w-full h-full ${className}`} style={{ minHeight: '500px' }}>
-      <ReactFlow
-        nodes={nodes} edges={edges} nodeTypes={nodeTypes} onNodeClick={onNodeClick}
-        fitView={fitView} proOptions={{ hideAttribution: true }}
-        defaultEdgeOptions={{ type: 'smoothstep', animated: false, style: { stroke: '#475569', strokeWidth: 1.5 } }}
-      >
-        <Background color="#1e293b" gap={20} />
-        <Controls position="bottom-right" />
-        <MiniMap nodeColor={(node) => node.data?.color || '#475569'} maskColor="rgba(0, 0, 0, 0.7)" position="bottom-left" />
-      </ReactFlow>
-    </div>
-  );
-}
+import { ReactFlow, Controls, MiniMap, Background } from '@xyflow/react';
+
+export default function FlowGraph({ nodes, edges, nodeTypes, onNodeClick, fitView = true, className = '' }) {
+  return (
+    <div className={`w-full h-full ${className}`} style={{ minHeight: '500px' }}>
+      <ReactFlow
+        nodes={nodes} edges={edges} nodeTypes={nodeTypes} onNodeClick={onNodeClick}
+        fitView={fitView} proOptions={{ hideAttribution: true }}
+        defaultEdgeOptions={{ type: 'smoothstep', animated: false, style: { stroke: '#475569', strokeWidth: 1.5 } }}
+      >
+        <Background color="#1e293b" gap={20} />
+        <Controls position="bottom-right" />
+        <MiniMap nodeColor={(node) => node.data?.color || '#475569'} maskColor="rgba(0, 0, 0, 0.7)" position="bottom-left" />
+      </ReactFlow>
+    </div>
+  );
+}

package/src/dashboard/app/components/SearchFilter.jsx

@@ -1,22 +1,22 @@
-import { useState } from 'react';
-
-export default function SearchFilter({ placeholder = 'Search...', filters = [], onSearchChange, onFilterChange }) {
-  const [search, setSearch] = useState('');
-  function handleSearchChange(e) {
-    setSearch(e.target.value);
-    onSearchChange?.(e.target.value);
-  }
-  return (
-    <div className="flex items-center gap-3 p-3 bg-gray-900 border-b border-gray-800">
-      <input type="text" value={search} onChange={handleSearchChange} placeholder={placeholder}
-        className="flex-1 bg-gray-800 border border-gray-700 rounded-md px-3 py-1.5 text-sm text-gray-100 placeholder-gray-500 focus:outline-none focus:border-blue-500" />
-      {filters.map(({ name, label, options, value }) => (
-        <select key={name} value={value} onChange={(e) => onFilterChange?.(name, e.target.value)}
-          className="bg-gray-800 border border-gray-700 rounded-md px-2 py-1.5 text-sm text-gray-300 focus:outline-none focus:border-blue-500">
-          <option value="">{label}: All</option>
-          {options.map((opt) => (<option key={opt} value={opt}>{opt}</option>))}
-        </select>
-      ))}
-    </div>
-  );
-}
+import { useState } from 'react';
+
+export default function SearchFilter({ placeholder = 'Search...', filters = [], onSearchChange, onFilterChange }) {
+  const [search, setSearch] = useState('');
+  function handleSearchChange(e) {
+    setSearch(e.target.value);
+    onSearchChange?.(e.target.value);
+  }
+  return (
+    <div className="flex items-center gap-3 p-3 bg-gray-900 border-b border-gray-800">
+      <input type="text" value={search} onChange={handleSearchChange} placeholder={placeholder}
+        className="flex-1 bg-gray-800 border border-gray-700 rounded-md px-3 py-1.5 text-sm text-gray-100 placeholder-gray-500 focus:outline-none focus:border-blue-500" />
+      {filters.map(({ name, label, options, value }) => (
+        <select key={name} value={value} onChange={(e) => onFilterChange?.(name, e.target.value)}
+          className="bg-gray-800 border border-gray-700 rounded-md px-2 py-1.5 text-sm text-gray-300 focus:outline-none focus:border-blue-500">
+          <option value="">{label}: All</option>
+          {options.map((opt) => (<option key={opt} value={opt}>{opt}</option>))}
+        </select>
+      ))}
+    </div>
+  );
+}

package/src/dashboard/app/hooks/useDetailPanel.js

@@ -1,15 +1,15 @@
-import { useState, useCallback } from 'react';
-
-export function useDetailPanel() {
-  const [panel, setPanel] = useState({ open: false, title: '', content: null });
-
-  const openPanel = useCallback((title, content) => {
-    setPanel({ open: true, title, content });
-  }, []);
-
-  const closePanel = useCallback(() => {
-    setPanel((prev) => ({ ...prev, open: false }));
-  }, []);
-
-  return { panel, openPanel, closePanel };
-}
+import { useState, useCallback } from 'react';
+
+export function useDetailPanel() {
+  const [panel, setPanel] = useState({ open: false, title: '', content: null });
+
+  const openPanel = useCallback((title, content) => {
+    setPanel({ open: true, title, content });
+  }, []);
+
+  const closePanel = useCallback(() => {
+    setPanel((prev) => ({ ...prev, open: false }));
+  }, []);
+
+  return { panel, openPanel, closePanel };
+}

package/src/dashboard/app/main.jsx

@@ -1,13 +1,13 @@
-import { StrictMode } from 'react';
-import { createRoot } from 'react-dom/client';
-import { BrowserRouter } from 'react-router-dom';
-import App from './App.jsx';
-import './styles/index.css';
-
-createRoot(document.getElementById('root')).render(
-  <StrictMode>
-    <BrowserRouter>
-      <App />
-    </BrowserRouter>
-  </StrictMode>
-);
+import { StrictMode } from 'react';
+import { createRoot } from 'react-dom/client';
+import { BrowserRouter } from 'react-router-dom';
+import App from './App.jsx';
+import './styles/index.css';
+
+createRoot(document.getElementById('root')).render(
+  <StrictMode>
+    <BrowserRouter>
+      <App />
+    </BrowserRouter>
+  </StrictMode>
+);