@particle-academy/fancy-code 0.4.7 → 0.5.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 (10) hide show
  1. package/README.md +8 -0
  2. package/dist/index.cjs +229 -0
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.cts +67 -1
  5. package/dist/index.d.ts +67 -1
  6. package/dist/index.js +227 -1
  7. package/dist/index.js.map +1 -1
  8. package/dist/styles.css +138 -0
  9. package/dist/styles.css.map +1 -1
  10. package/package.json +5 -3
package/dist/styles.css CHANGED
@@ -38,4 +38,142 @@
38
38
  .dark [data-fancy-code-panel]::-webkit-scrollbar-thumb {
39
39
  background: #52525b;
40
40
  }
41
+ .fancy-md-editor {
42
+ display: flex;
43
+ gap: 0;
44
+ align-items: stretch;
45
+ border: 1px solid #e4e4e7;
46
+ border-radius: 8px;
47
+ overflow: hidden;
48
+ }
49
+ .dark .fancy-md-editor {
50
+ border-color: #3f3f46;
51
+ }
52
+ .fancy-md-editor[data-mode=split] .fancy-md-editor-pane {
53
+ border-right: 1px solid #e4e4e7;
54
+ }
55
+ .dark .fancy-md-editor[data-mode=split] .fancy-md-editor-pane {
56
+ border-right-color: #3f3f46;
57
+ }
58
+ .fancy-md-editor-pane,
59
+ .fancy-md-preview {
60
+ flex: 1 1 0;
61
+ min-width: 0;
62
+ }
63
+ .fancy-md-preview {
64
+ overflow: auto;
65
+ padding: 14px 18px;
66
+ font-size: 14px;
67
+ line-height: 1.7;
68
+ color: #3f3f46;
69
+ background: #fff;
70
+ }
71
+ .dark .fancy-md-preview {
72
+ color: #d4d4d8;
73
+ background: #18181b;
74
+ }
75
+ .fancy-md-preview > :first-child {
76
+ margin-top: 0;
77
+ }
78
+ .fancy-md-preview h1,
79
+ .fancy-md-preview h2,
80
+ .fancy-md-preview h3,
81
+ .fancy-md-preview h4 {
82
+ font-weight: 600;
83
+ line-height: 1.3;
84
+ margin: 1.2em 0 0.4em;
85
+ color: #18181b;
86
+ }
87
+ .dark .fancy-md-preview h1,
88
+ .dark .fancy-md-preview h2,
89
+ .dark .fancy-md-preview h3,
90
+ .dark .fancy-md-preview h4 {
91
+ color: #f4f4f5;
92
+ }
93
+ .fancy-md-preview h1 {
94
+ font-size: 1.6em;
95
+ }
96
+ .fancy-md-preview h2 {
97
+ font-size: 1.35em;
98
+ border-bottom: 1px solid #e4e4e7;
99
+ padding-bottom: 0.2em;
100
+ }
101
+ .dark .fancy-md-preview h2 {
102
+ border-color: #3f3f46;
103
+ }
104
+ .fancy-md-preview h3 {
105
+ font-size: 1.15em;
106
+ }
107
+ .fancy-md-preview p {
108
+ margin: 0.6em 0;
109
+ }
110
+ .fancy-md-preview a {
111
+ color: #7c3aed;
112
+ text-decoration: underline;
113
+ text-underline-offset: 2px;
114
+ }
115
+ .dark .fancy-md-preview a {
116
+ color: #c4b5fd;
117
+ }
118
+ .fancy-md-preview ul,
119
+ .fancy-md-preview ol {
120
+ margin: 0.6em 0;
121
+ padding-left: 1.5em;
122
+ }
123
+ .fancy-md-preview ul {
124
+ list-style: disc;
125
+ }
126
+ .fancy-md-preview ol {
127
+ list-style: decimal;
128
+ }
129
+ .fancy-md-preview li {
130
+ margin: 0.2em 0;
131
+ }
132
+ .fancy-md-preview img {
133
+ max-width: 100%;
134
+ height: auto;
135
+ border-radius: 6px;
136
+ }
137
+ .fancy-md-preview code {
138
+ background: #f4f4f5;
139
+ padding: 0.1em 0.35em;
140
+ border-radius: 4px;
141
+ font-family: ui-monospace, monospace;
142
+ font-size: 0.88em;
143
+ }
144
+ .dark .fancy-md-preview code {
145
+ background: #27272a;
146
+ }
147
+ .fancy-md-preview pre {
148
+ background: #09090b;
149
+ color: #f4f4f5;
150
+ padding: 12px 14px;
151
+ border-radius: 8px;
152
+ overflow-x: auto;
153
+ margin: 0.8em 0;
154
+ }
155
+ .fancy-md-preview pre code {
156
+ background: transparent;
157
+ padding: 0;
158
+ font-size: 0.85em;
159
+ }
160
+ .fancy-md-preview blockquote {
161
+ border-left: 3px solid #a78bfa;
162
+ padding-left: 0.9em;
163
+ margin: 0.8em 0;
164
+ color: #52525b;
165
+ font-style: italic;
166
+ }
167
+ .dark .fancy-md-preview blockquote {
168
+ color: #a1a1aa;
169
+ border-color: #7c3aed;
170
+ }
171
+ .fancy-md-preview hr {
172
+ border: 0;
173
+ border-top: 1px solid #e4e4e7;
174
+ margin: 1.5em 0;
175
+ }
176
+ .dark .fancy-md-preview hr {
177
+ border-color: #3f3f46;
178
+ }
41
179
  /*# sourceMappingURL=styles.css.map */
package/dist/styles.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/styles.css"],"sourcesContent":["/* @particle-academy/fancy-code — editor styles */\n\n/* Monospace font for code */\n[data-fancy-code-panel] textarea,\n[data-fancy-code-panel] pre,\n[data-fancy-code-panel] code {\n font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace;\n}\n\n/* Textarea and overlay must share identical text rendering */\n[data-fancy-code-panel] textarea,\n[data-fancy-code-panel] pre {\n font-size: 13px;\n line-height: 1.5;\n letter-spacing: normal;\n word-spacing: normal;\n font-variant-ligatures: none;\n}\n\n/* Remove default textarea styling */\n[data-fancy-code-panel] textarea {\n white-space: pre;\n overflow-wrap: normal;\n word-break: normal;\n}\n\n/* Scrollbar styling */\n[data-fancy-code-panel]::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n[data-fancy-code-panel]::-webkit-scrollbar-track {\n background: transparent;\n}\n\n[data-fancy-code-panel]::-webkit-scrollbar-thumb {\n background: #a1a1aa;\n border-radius: 4px;\n}\n\n.dark [data-fancy-code-panel]::-webkit-scrollbar-thumb {\n background: #52525b;\n}\n"],"mappings":";AAGA,CAAC,uBAAuB;AACxB,CAAC,uBAAuB;AACxB,CAAC,uBAAuB;AACtB;AAAA,IAAa,YAAY;AAAA,IAAE,cAAc;AAAA,IAAE,SAAS;AAAA,IAAE,KAAK;AAAA,IAAE,QAAQ;AAAA,IAAE,iBAAiB;AAAA,IAAE;AAC5F;AAGA,CAAC,uBAAuB;AACxB,CAAC,uBAAuB;AACtB,aAAW;AACX,eAAa;AACb,kBAAgB;AAChB,gBAAc;AACd,0BAAwB;AAC1B;AAGA,CAAC,uBAAuB;AACtB,eAAa;AACb,iBAAe;AACf,cAAY;AACd;AAGA,CAAC,sBAAsB;AACrB,SAAO;AACP,UAAQ;AACV;AAEA,CAAC,sBAAsB;AACrB,cAAY;AACd;AAEA,CAAC,sBAAsB;AACrB,cAAY;AACZ,iBAAe;AACjB;AAEA,CAAC,KAAK,CAAC,sBAAsB;AAC3B,cAAY;AACd;","names":[]}
1
+ {"version":3,"sources":["../src/styles.css"],"sourcesContent":["/* @particle-academy/fancy-code — editor styles */\n\n/* Monospace font for code */\n[data-fancy-code-panel] textarea,\n[data-fancy-code-panel] pre,\n[data-fancy-code-panel] code {\n font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace;\n}\n\n/* Textarea and overlay must share identical text rendering */\n[data-fancy-code-panel] textarea,\n[data-fancy-code-panel] pre {\n font-size: 13px;\n line-height: 1.5;\n letter-spacing: normal;\n word-spacing: normal;\n font-variant-ligatures: none;\n}\n\n/* Remove default textarea styling */\n[data-fancy-code-panel] textarea {\n white-space: pre;\n overflow-wrap: normal;\n word-break: normal;\n}\n\n/* Scrollbar styling */\n[data-fancy-code-panel]::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n[data-fancy-code-panel]::-webkit-scrollbar-track {\n background: transparent;\n}\n\n[data-fancy-code-panel]::-webkit-scrollbar-thumb {\n background: #a1a1aa;\n border-radius: 4px;\n}\n\n.dark [data-fancy-code-panel]::-webkit-scrollbar-thumb {\n background: #52525b;\n}\n\n/* ── MarkdownEditor ──────────────────────────────────────────────────────── */\n.fancy-md-editor {\n display: flex;\n gap: 0;\n align-items: stretch;\n border: 1px solid #e4e4e7;\n border-radius: 8px;\n overflow: hidden;\n}\n.dark .fancy-md-editor {\n border-color: #3f3f46;\n}\n.fancy-md-editor[data-mode=\"split\"] .fancy-md-editor-pane {\n border-right: 1px solid #e4e4e7;\n}\n.dark .fancy-md-editor[data-mode=\"split\"] .fancy-md-editor-pane {\n border-right-color: #3f3f46;\n}\n.fancy-md-editor-pane,\n.fancy-md-preview {\n flex: 1 1 0;\n min-width: 0;\n}\n.fancy-md-preview {\n overflow: auto;\n padding: 14px 18px;\n font-size: 14px;\n line-height: 1.7;\n color: #3f3f46;\n background: #fff;\n}\n.dark .fancy-md-preview {\n color: #d4d4d8;\n background: #18181b;\n}\n.fancy-md-preview > :first-child { margin-top: 0; }\n.fancy-md-preview h1,\n.fancy-md-preview h2,\n.fancy-md-preview h3,\n.fancy-md-preview h4 { font-weight: 600; line-height: 1.3; margin: 1.2em 0 0.4em; color: #18181b; }\n.dark .fancy-md-preview h1,\n.dark .fancy-md-preview h2,\n.dark .fancy-md-preview h3,\n.dark .fancy-md-preview h4 { color: #f4f4f5; }\n.fancy-md-preview h1 { font-size: 1.6em; }\n.fancy-md-preview h2 { font-size: 1.35em; border-bottom: 1px solid #e4e4e7; padding-bottom: 0.2em; }\n.dark .fancy-md-preview h2 { border-color: #3f3f46; }\n.fancy-md-preview h3 { font-size: 1.15em; }\n.fancy-md-preview p { margin: 0.6em 0; }\n.fancy-md-preview a { color: #7c3aed; text-decoration: underline; text-underline-offset: 2px; }\n.dark .fancy-md-preview a { color: #c4b5fd; }\n.fancy-md-preview ul, .fancy-md-preview ol { margin: 0.6em 0; padding-left: 1.5em; }\n.fancy-md-preview ul { list-style: disc; }\n.fancy-md-preview ol { list-style: decimal; }\n.fancy-md-preview li { margin: 0.2em 0; }\n.fancy-md-preview img { max-width: 100%; height: auto; border-radius: 6px; }\n.fancy-md-preview code { background: #f4f4f5; padding: 0.1em 0.35em; border-radius: 4px; font-family: ui-monospace, monospace; font-size: 0.88em; }\n.dark .fancy-md-preview code { background: #27272a; }\n.fancy-md-preview pre { background: #09090b; color: #f4f4f5; padding: 12px 14px; border-radius: 8px; overflow-x: auto; margin: 0.8em 0; }\n.fancy-md-preview pre code { background: transparent; padding: 0; font-size: 0.85em; }\n.fancy-md-preview blockquote { border-left: 3px solid #a78bfa; padding-left: 0.9em; margin: 0.8em 0; color: #52525b; font-style: italic; }\n.dark .fancy-md-preview blockquote { color: #a1a1aa; border-color: #7c3aed; }\n.fancy-md-preview hr { border: 0; border-top: 1px solid #e4e4e7; margin: 1.5em 0; }\n.dark .fancy-md-preview hr { border-color: #3f3f46; }\n"],"mappings":"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","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@particle-academy/fancy-code",
3
- "version": "0.4.7",
3
+ "version": "0.5.1",
4
4
  "description": "Lightweight embedded code editor with syntax highlighting and extensible language/theme registries",
5
5
  "repository": {
6
6
  "type": "git",
@@ -34,6 +34,7 @@
34
34
  "build": "tsup",
35
35
  "dev": "tsup --watch",
36
36
  "lint": "tsc --noEmit",
37
+ "test": "vitest run",
37
38
  "clean": "rm -rf dist",
38
39
  "prepublishOnly": "tsup"
39
40
  },
@@ -43,13 +44,14 @@
43
44
  "react-dom": "^18.0.0 || ^19.0.0"
44
45
  },
45
46
  "devDependencies": {
46
- "@particle-academy/react-fancy": "^3.2.1",
47
+ "@particle-academy/react-fancy": "^4.0.0",
47
48
  "@types/react": "^19.0.0",
48
49
  "@types/react-dom": "^19.0.0",
49
50
  "react": "^19.0.0",
50
51
  "react-dom": "^19.0.0",
51
52
  "tsup": "^8.5.0",
52
- "typescript": "^5.8.0"
53
+ "typescript": "^5.8.0",
54
+ "vitest": "^4.1.8"
53
55
  },
54
56
  "publishConfig": {
55
57
  "access": "public"