@fabrika/canvas-kernel 0.1.45 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/README.md +33 -67
  2. package/index.ts +20 -83
  3. package/package.json +69 -72
  4. package/src/client/AnnotationProvider.tsx +218 -255
  5. package/src/client/AnnotationSidebar.tsx +393 -338
  6. package/src/client/FileIcon.tsx +105 -66
  7. package/src/client/PlanRenderer.tsx +607 -551
  8. package/src/client/RenderErrorContext.ts +7 -7
  9. package/src/client/ResponsePreview.tsx +192 -173
  10. package/src/client/annotationDom.ts +43 -97
  11. package/src/client/annotationDraft.ts +106 -96
  12. package/src/client/appContext.tsx +40 -40
  13. package/src/client/components/Callout.tsx +20 -20
  14. package/src/client/components/Checklist.tsx +27 -29
  15. package/src/client/components/Choice.tsx +178 -159
  16. package/src/client/components/CodeBlock.tsx +27 -26
  17. package/src/client/components/Diff.tsx +16 -17
  18. package/src/client/components/FilePreview.tsx +102 -74
  19. package/src/client/components/Image.tsx +41 -39
  20. package/src/client/components/Markdown.tsx +33 -32
  21. package/src/client/components/Mermaid.tsx +593 -542
  22. package/src/client/components/Note.tsx +8 -8
  23. package/src/client/components/Priority.tsx +10 -12
  24. package/src/client/components/ResponseNote.tsx +16 -15
  25. package/src/client/components/Section.tsx +28 -26
  26. package/src/client/components/Table.tsx +33 -30
  27. package/src/client/components/Task.tsx +58 -60
  28. package/src/client/components/UserInput.tsx +169 -152
  29. package/src/client/components/index.ts +16 -16
  30. package/src/client/components/renderMarkdownChildren.tsx +86 -68
  31. package/src/client/diffLines.ts +51 -39
  32. package/src/client/generateMarkdown.ts +197 -191
  33. package/src/client/hostContext.tsx +39 -34
  34. package/src/client/index.ts +44 -125
  35. package/src/client/pageGlobals.ts +25 -0
  36. package/src/client/persistenceSchemas.ts +41 -0
  37. package/src/client/preact-all.ts +4 -4
  38. package/src/client/runtime.ts +58 -111
  39. package/src/client/styles.css +1 -74
  40. package/src/engine/compiler.ts +411 -323
  41. package/src/engine/file-admission.ts +25 -0
  42. package/src/engine/paths.ts +44 -44
  43. package/src/engine/session.ts +515 -626
  44. package/src/engine/sessionSchemas.ts +71 -0
  45. package/src/engine/watcher.ts +70 -60
  46. package/src/engine/websocket.ts +134 -132
  47. package/annotate.ts +0 -94
  48. package/daemon.ts +0 -46
  49. package/src/client/AnnotationDraftFooter.tsx +0 -76
  50. package/src/client/AnnotationEditor.tsx +0 -320
  51. package/src/client/AnnotationList.tsx +0 -190
  52. package/src/client/Popover.tsx +0 -361
  53. package/src/client/SessionContext.tsx +0 -3
  54. package/src/client/annotationContext.ts +0 -130
  55. package/src/client/annotationMarkdown.ts +0 -102
  56. package/src/client/annotationTarget.ts +0 -73
  57. package/src/client/blockTarget.ts +0 -127
  58. package/src/client/highlightRange.ts +0 -262
  59. package/src/client/popoverPosition.ts +0 -46
  60. package/src/client/regionTarget.ts +0 -180
  61. package/src/client/testing/dom.ts +0 -74
  62. package/src/client/textTarget.ts +0 -31
  63. package/src/client/useRegionAnnotation.tsx +0 -188
  64. package/src/client/useTextAnnotation.tsx +0 -194
  65. package/src/client/utils.ts +0 -33
  66. package/src/engine/channel.ts +0 -278
  67. package/src/engine/http-utils.ts +0 -14
  68. package/src/engine/lifecycle.ts +0 -302
  69. package/src/engine/router.ts +0 -16
  70. package/src/engine/waiter.ts +0 -188
package/src/client/FileIcon.tsx CHANGED
@@ -1,76 +1,115 @@
1
- import React from "react";
2
-
3
1
  interface FileIconProps {
4
- name: string;
5
- type: "file" | "dir";
6
- expanded?: boolean;
7
- className?: string;
2
+ name: string
3
+ type: 'file' | 'dir'
4
+ expanded?: boolean
5
+ className?: string
8
6
  }
9
7
 
10
8
  const extColors: Record<string, string> = {
11
- // TypeScript / JavaScript
12
- ts: "#3178c6", tsx: "#3178c6", js: "#e8a32e", jsx: "#4ba0c8",
13
- // Web
14
- html: "#e34c26", css: "#264de4", scss: "#c69",
15
- // Data
16
- json: "#7a7568", yaml: "#cb171e", yml: "#cb171e", toml: "#9c4221",
17
- // Systems
18
- rs: "#dea584", go: "#00add8", c: "#6a6a6a", cpp: "#f34b7d", h: "#6a6a6a",
19
- // Scripting
20
- py: "#3572a5", rb: "#cc342d", sh: "#5a8c3c", bash: "#5a8c3c",
21
- // Markup / docs
22
- md: "#3573b5", txt: "#6b6560",
23
- // Config
24
- lock: "#6b6560", gitignore: "#6b6560",
25
- // Images
26
- svg: "#d9952e", png: "#6a9c2e", jpg: "#6a9c2e", gif: "#6a9c2e",
27
- };
9
+ // TypeScript / JavaScript
10
+ ts: '#3178c6',
11
+ tsx: '#3178c6',
12
+ js: '#e8a32e',
13
+ jsx: '#4ba0c8',
14
+ // Web
15
+ html: '#e34c26',
16
+ css: '#264de4',
17
+ scss: '#c69',
18
+ // Data
19
+ json: '#7a7568',
20
+ yaml: '#cb171e',
21
+ yml: '#cb171e',
22
+ toml: '#9c4221',
23
+ // Systems
24
+ rs: '#dea584',
25
+ go: '#00add8',
26
+ c: '#6a6a6a',
27
+ cpp: '#f34b7d',
28
+ h: '#6a6a6a',
29
+ // Scripting
30
+ py: '#3572a5',
31
+ rb: '#cc342d',
32
+ sh: '#5a8c3c',
33
+ bash: '#5a8c3c',
34
+ // Markup / docs
35
+ md: '#3573b5',
36
+ txt: '#6b6560',
37
+ // Config
38
+ lock: '#6b6560',
39
+ gitignore: '#6b6560',
40
+ // Images
41
+ svg: '#d9952e',
42
+ png: '#6a9c2e',
43
+ jpg: '#6a9c2e',
44
+ gif: '#6a9c2e',
45
+ }
28
46
 
29
47
  const extLabels: Record<string, string> = {
30
- ts: "TS", tsx: "TX", js: "JS", jsx: "JX",
31
- py: "PY", rs: "RS", go: "GO", rb: "RB",
32
- json: "{}", yaml: "YM", yml: "YM", toml: "TM",
33
- html: "<>", css: "#", scss: "#",
34
- md: "M↓", sh: "$", bash: "$",
35
- c: "C", cpp: "C+", h: "H",
36
- svg: "◇", png: "▣", jpg: "▣",
37
- };
48
+ ts: 'TS',
49
+ tsx: 'TX',
50
+ js: 'JS',
51
+ jsx: 'JX',
52
+ py: 'PY',
53
+ rs: 'RS',
54
+ go: 'GO',
55
+ rb: 'RB',
56
+ json: '{}',
57
+ yaml: 'YM',
58
+ yml: 'YM',
59
+ toml: 'TM',
60
+ html: '<>',
61
+ css: '#',
62
+ scss: '#',
63
+ md: 'M↓',
64
+ sh: '$',
65
+ bash: '$',
66
+ c: 'C',
67
+ cpp: 'C+',
68
+ h: 'H',
69
+ svg: '◇',
70
+ png: '▣',
71
+ jpg: '▣',
72
+ }
38
73
 
39
- export function FileIcon({ name, type, expanded, className = "" }: FileIconProps) {
40
- if (type === "dir") {
41
- return (
42
- <svg width="14" height="14" viewBox="0 0 16 16" fill="none" className={`flex-shrink-0 ${className}`}>
43
- {expanded ? (
44
- <path d="M1.5 3.5h5l1.5 1.5h6.5v8h-13z" style={{ fill: "var(--color-folder-fill-active)", stroke: "var(--color-folder-stroke-active)" }} strokeWidth="1" />
45
- ) : (
46
- <path d="M1.5 3.5h5l1.5 1.5h6.5v8h-13z" style={{ fill: "var(--color-folder-fill)", stroke: "var(--color-folder-stroke)" }} strokeWidth="1" />
47
- )}
48
- </svg>
49
- );
50
- }
74
+ export function FileIcon({ name, type, expanded, className = '' }: FileIconProps) {
75
+ if (type === 'dir') {
76
+ return (
77
+ <svg width="14" height="14" viewBox="0 0 16 16" fill="none" className={`flex-shrink-0 ${className}`}>
78
+ {expanded
79
+ ? (
80
+ <path
81
+ d="M1.5 3.5h5l1.5 1.5h6.5v8h-13z"
82
+ style={{ fill: 'var(--color-folder-fill-active)', stroke: 'var(--color-folder-stroke-active)' }}
83
+ strokeWidth="1"
84
+ />
85
+ )
86
+ : <path d="M1.5 3.5h5l1.5 1.5h6.5v8h-13z" style={{ fill: 'var(--color-folder-fill)', stroke: 'var(--color-folder-stroke)' }} strokeWidth="1" />}
87
+ </svg>
88
+ )
89
+ }
51
90
 
52
- const ext = name.includes(".") ? name.split(".").pop()!.toLowerCase() : "";
53
- const color = extColors[ext] || "#6b6560";
54
- const label = extLabels[ext];
91
+ const ext = name.includes('.') ? name.split('.').pop()!.toLowerCase() : ''
92
+ const color = extColors[ext] || '#6b6560'
93
+ const label = extLabels[ext]
55
94
 
56
- return (
57
- <svg width="14" height="14" viewBox="0 0 16 16" className={`flex-shrink-0 ${className}`}>
58
- {/* File shape with folded corner */}
59
- <path d="M2 1.5h8l3.5 3.5v9.5a1 1 0 01-1 1H3a1 1 0 01-1-1v-12a1 1 0 011-1z" fill={color} opacity="0.85" />
60
- <path d="M10 1.5v2.5a1 1 0 001 1h2.5" fill="none" stroke="white" strokeWidth="0.5" opacity="0.5" />
61
- {label && (
62
- <text
63
- x="8"
64
- y="11.5"
65
- textAnchor="middle"
66
- fill="white"
67
- fontSize="5.5"
68
- fontFamily="monospace"
69
- fontWeight="600"
70
- >
71
- {label}
72
- </text>
73
- )}
74
- </svg>
75
- );
95
+ return (
96
+ <svg width="14" height="14" viewBox="0 0 16 16" className={`flex-shrink-0 ${className}`}>
97
+ {/* File shape with folded corner */}
98
+ <path d="M2 1.5h8l3.5 3.5v9.5a1 1 0 01-1 1H3a1 1 0 01-1-1v-12a1 1 0 011-1z" fill={color} opacity="0.85" />
99
+ <path d="M10 1.5v2.5a1 1 0 001 1h2.5" fill="none" stroke="white" strokeWidth="0.5" opacity="0.5" />
100
+ {label && (
101
+ <text
102
+ x="8"
103
+ y="11.5"
104
+ textAnchor="middle"
105
+ fill="white"
106
+ fontSize="5.5"
107
+ fontFamily="monospace"
108
+ fontWeight="600"
109
+ >
110
+ {label}
111
+ </text>
112
+ )}
113
+ </svg>
114
+ )
76
115
  }