@ytspar/devbar 1.3.1 → 1.4.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 (93) hide show
  1. package/README.md +43 -0
  2. package/dist/accessibility.d.ts +4 -0
  3. package/dist/accessibility.d.ts.map +1 -1
  4. package/dist/accessibility.js +57 -0
  5. package/dist/accessibility.js.map +1 -1
  6. package/dist/constants.d.ts +8 -23
  7. package/dist/constants.d.ts.map +1 -1
  8. package/dist/constants.js +10 -3
  9. package/dist/constants.js.map +1 -1
  10. package/dist/index.d.ts +1 -1
  11. package/dist/index.d.ts.map +1 -1
  12. package/dist/index.js +1 -1
  13. package/dist/index.js.map +1 -1
  14. package/dist/modules/index.d.ts +1 -1
  15. package/dist/modules/index.d.ts.map +1 -1
  16. package/dist/modules/index.js +1 -0
  17. package/dist/modules/index.js.map +1 -1
  18. package/dist/modules/keyboard.d.ts +1 -1
  19. package/dist/modules/keyboard.d.ts.map +1 -1
  20. package/dist/modules/keyboard.js +4 -11
  21. package/dist/modules/keyboard.js.map +1 -1
  22. package/dist/modules/rendering/buttons.d.ts +19 -0
  23. package/dist/modules/rendering/buttons.d.ts.map +1 -0
  24. package/dist/modules/rendering/buttons.js +369 -0
  25. package/dist/modules/rendering/buttons.js.map +1 -0
  26. package/dist/modules/rendering/collapsed.d.ts +6 -0
  27. package/dist/modules/rendering/collapsed.d.ts.map +1 -0
  28. package/dist/modules/rendering/collapsed.js +124 -0
  29. package/dist/modules/rendering/collapsed.js.map +1 -0
  30. package/dist/modules/rendering/common.d.ts +21 -0
  31. package/dist/modules/rendering/common.d.ts.map +1 -0
  32. package/dist/modules/rendering/common.js +60 -0
  33. package/dist/modules/rendering/common.js.map +1 -0
  34. package/dist/modules/rendering/compact.d.ts +6 -0
  35. package/dist/modules/rendering/compact.d.ts.map +1 -0
  36. package/dist/modules/rendering/compact.js +107 -0
  37. package/dist/modules/rendering/compact.js.map +1 -0
  38. package/dist/modules/rendering/console.d.ts +7 -0
  39. package/dist/modules/rendering/console.d.ts.map +1 -0
  40. package/dist/modules/rendering/console.js +78 -0
  41. package/dist/modules/rendering/console.js.map +1 -0
  42. package/dist/modules/rendering/expanded.d.ts +13 -0
  43. package/dist/modules/rendering/expanded.d.ts.map +1 -0
  44. package/dist/modules/rendering/expanded.js +439 -0
  45. package/dist/modules/rendering/expanded.js.map +1 -0
  46. package/dist/modules/rendering/index.d.ts +22 -0
  47. package/dist/modules/rendering/index.d.ts.map +1 -0
  48. package/dist/modules/rendering/index.js +109 -0
  49. package/dist/modules/rendering/index.js.map +1 -0
  50. package/dist/modules/rendering/modals.d.ts +9 -0
  51. package/dist/modules/rendering/modals.d.ts.map +1 -0
  52. package/dist/modules/rendering/modals.js +1068 -0
  53. package/dist/modules/rendering/modals.js.map +1 -0
  54. package/dist/modules/rendering/settings.d.ts +6 -0
  55. package/dist/modules/rendering/settings.d.ts.map +1 -0
  56. package/dist/modules/rendering/settings.js +605 -0
  57. package/dist/modules/rendering/settings.js.map +1 -0
  58. package/dist/modules/rendering.d.ts +15 -16
  59. package/dist/modules/rendering.d.ts.map +1 -1
  60. package/dist/modules/rendering.js +15 -2919
  61. package/dist/modules/rendering.js.map +1 -1
  62. package/dist/modules/screenshot.d.ts +11 -2
  63. package/dist/modules/screenshot.d.ts.map +1 -1
  64. package/dist/modules/screenshot.js +32 -29
  65. package/dist/modules/screenshot.js.map +1 -1
  66. package/dist/modules/tooltips.d.ts +7 -5
  67. package/dist/modules/tooltips.d.ts.map +1 -1
  68. package/dist/modules/tooltips.js +133 -157
  69. package/dist/modules/tooltips.js.map +1 -1
  70. package/dist/modules/types.d.ts +7 -0
  71. package/dist/modules/types.d.ts.map +1 -1
  72. package/dist/modules/types.js +14 -1
  73. package/dist/modules/types.js.map +1 -1
  74. package/dist/modules/websocket.d.ts.map +1 -1
  75. package/dist/modules/websocket.js +334 -264
  76. package/dist/modules/websocket.js.map +1 -1
  77. package/dist/ui/buttons.d.ts.map +1 -1
  78. package/dist/ui/buttons.js +11 -9
  79. package/dist/ui/buttons.js.map +1 -1
  80. package/dist/ui/cards.js +3 -3
  81. package/dist/ui/cards.js.map +1 -1
  82. package/dist/ui/icons.d.ts +13 -0
  83. package/dist/ui/icons.d.ts.map +1 -1
  84. package/dist/ui/icons.js +24 -3
  85. package/dist/ui/icons.js.map +1 -1
  86. package/dist/ui/index.d.ts +1 -1
  87. package/dist/ui/index.d.ts.map +1 -1
  88. package/dist/ui/index.js.map +1 -1
  89. package/dist/ui/modals.d.ts +3 -2
  90. package/dist/ui/modals.d.ts.map +1 -1
  91. package/dist/ui/modals.js +28 -26
  92. package/dist/ui/modals.js.map +1 -1
  93. package/package.json +3 -4
@@ -0,0 +1,369 @@
1
+ /**
2
+ * Button creator functions used by both compact and expanded modes.
3
+ */
4
+ import { BUTTON_COLORS, CSS_COLORS, withAlpha } from '../../constants.js';
5
+ import { resolveSaveLocation } from '../../settings.js';
6
+ import { createSvgIcon, getButtonStyles } from '../../ui/index.js';
7
+ import { preloadAxe } from '../../accessibility.js';
8
+ import { copyPathToClipboard, handleA11yAudit, handleDocumentOutline, handlePageSchema, showDesignReviewConfirmation, } from '../screenshot.js';
9
+ import { attachButtonTooltip, attachTextTooltip, } from '../tooltips.js';
10
+ import { closeAllModals } from '../types.js';
11
+ export function createConsoleBadge(state, type, count, color) {
12
+ const labelMap = { error: 'error', warn: 'warning', info: 'info' };
13
+ const label = labelMap[type];
14
+ const isActive = state.consoleFilter === type;
15
+ const badge = document.createElement('span');
16
+ badge.className = 'devbar-badge';
17
+ Object.assign(badge.style, {
18
+ display: 'flex',
19
+ alignItems: 'center',
20
+ justifyContent: 'center',
21
+ minWidth: '18px',
22
+ height: '18px',
23
+ padding: '0 5px',
24
+ borderRadius: '9999px',
25
+ backgroundColor: isActive ? color : withAlpha(color, 90),
26
+ color: '#fff',
27
+ fontSize: '0.625rem',
28
+ fontWeight: '600',
29
+ cursor: 'pointer',
30
+ boxShadow: isActive ? `0 0 8px ${withAlpha(color, 80)}` : 'none',
31
+ });
32
+ badge.textContent = count > 99 ? '99+' : String(count);
33
+ attachTextTooltip(state, badge, () => `${count} console ${label}${count === 1 ? '' : 's'} (click to view)`);
34
+ badge.onclick = () => {
35
+ const newFilter = state.consoleFilter === type ? null : type;
36
+ closeAllModals(state);
37
+ state.consoleFilter = newFilter;
38
+ state.render();
39
+ };
40
+ return badge;
41
+ }
42
+ export function createScreenshotButton(state, accentColor) {
43
+ const btn = document.createElement('button');
44
+ btn.type = 'button';
45
+ btn.setAttribute('aria-label', 'Screenshot');
46
+ const hasSuccessState = state.copiedToClipboard || state.copiedPath || state.lastScreenshot;
47
+ const isDisabled = state.capturing;
48
+ const effectiveSave = resolveSaveLocation(state.options.saveLocation, state.sweetlinkConnected);
49
+ // Grey out only when effective save is 'local' but sweetlink not connected (explicit 'local' setting)
50
+ const isGreyedOut = effectiveSave === 'local' && !state.sweetlinkConnected && !hasSuccessState;
51
+ // Attach HTML tooltip
52
+ attachButtonTooltip(state, btn, accentColor, (tooltip, h) => {
53
+ if (state.copiedToClipboard) {
54
+ h.addSuccess('Copied to clipboard!');
55
+ return;
56
+ }
57
+ if (state.copiedPath) {
58
+ h.addSuccess('Path copied to clipboard!');
59
+ return;
60
+ }
61
+ if (state.lastScreenshot) {
62
+ const screenshotPath = state.lastScreenshot;
63
+ const isDownloaded = screenshotPath.endsWith('downloaded');
64
+ if (isDownloaded) {
65
+ h.addSuccess('Screenshot downloaded!');
66
+ }
67
+ else {
68
+ h.addSuccess('Screenshot saved!', screenshotPath);
69
+ const copyLink = document.createElement('div');
70
+ Object.assign(copyLink.style, {
71
+ color: accentColor,
72
+ cursor: 'pointer',
73
+ fontSize: '0.625rem',
74
+ marginTop: '6px',
75
+ opacity: '0.8',
76
+ transition: 'opacity 150ms',
77
+ });
78
+ copyLink.textContent = 'copy path';
79
+ copyLink.onmouseenter = () => {
80
+ copyLink.style.opacity = '1';
81
+ };
82
+ copyLink.onmouseleave = () => {
83
+ copyLink.style.opacity = '0.8';
84
+ };
85
+ copyLink.onclick = async (e) => {
86
+ e.stopPropagation();
87
+ try {
88
+ await navigator.clipboard.writeText(screenshotPath);
89
+ copyLink.textContent = '\u2713 copied!';
90
+ copyLink.style.cursor = 'default';
91
+ copyLink.onclick = null;
92
+ }
93
+ catch {
94
+ copyLink.textContent = '\u00d7 failed to copy';
95
+ copyLink.style.color = CSS_COLORS.error;
96
+ }
97
+ };
98
+ tooltip.appendChild(copyLink);
99
+ }
100
+ return;
101
+ }
102
+ h.addTitle('Screenshot');
103
+ h.addSectionHeader('Actions');
104
+ if (effectiveSave === 'local' && !state.sweetlinkConnected) {
105
+ h.addShortcut('Shift+Click', 'Copy to clipboard');
106
+ h.addWarning('Sweetlink not connected. Switch save method to Auto or Download.');
107
+ }
108
+ else {
109
+ const saveLabel = effectiveSave === 'local' ? 'Save to file' : 'Download';
110
+ h.addShortcut('Click', saveLabel);
111
+ h.addShortcut('Shift+Click', 'Copy to clipboard');
112
+ h.addSectionHeader('Keyboard');
113
+ h.addShortcut('Cmd or Ctrl+Shift+S', saveLabel);
114
+ h.addShortcut('Cmd or Ctrl+Shift+C', 'Copy');
115
+ }
116
+ });
117
+ Object.assign(btn.style, {
118
+ display: 'flex',
119
+ alignItems: 'center',
120
+ justifyContent: 'center',
121
+ width: '22px',
122
+ height: '22px',
123
+ minWidth: '22px',
124
+ minHeight: '22px',
125
+ flexShrink: '0',
126
+ borderRadius: '50%',
127
+ border: '1px solid',
128
+ borderColor: hasSuccessState ? accentColor : withAlpha(accentColor, 50),
129
+ backgroundColor: hasSuccessState ? withAlpha(accentColor, 20) : 'transparent',
130
+ color: hasSuccessState ? accentColor : withAlpha(accentColor, 60),
131
+ cursor: !isDisabled ? 'pointer' : 'not-allowed',
132
+ opacity: isGreyedOut ? '0.4' : '1',
133
+ transition: 'all 150ms',
134
+ });
135
+ btn.disabled = isDisabled;
136
+ btn.onclick = (e) => {
137
+ // If we have a saved screenshot path, clicking copies the path
138
+ if (state.lastScreenshot && !e.shiftKey) {
139
+ copyPathToClipboard(state, state.lastScreenshot);
140
+ }
141
+ else {
142
+ state.handleScreenshot(e.shiftKey);
143
+ }
144
+ };
145
+ // Button content
146
+ if (state.copiedToClipboard || state.copiedPath || state.lastScreenshot) {
147
+ btn.textContent = '\u2713';
148
+ btn.style.fontSize = '0.6rem';
149
+ }
150
+ else if (state.capturing) {
151
+ btn.textContent = '...';
152
+ btn.style.fontSize = '0.5rem';
153
+ }
154
+ else {
155
+ // Camera icon SVG
156
+ btn.appendChild(createSvgIcon('M19.844 7.938H7.938v11.905m0 11.113v11.906h11.905m23.019-11.906v11.906H30.956m11.906-23.018V7.938H30.956', {
157
+ viewBox: '0 0 50.8 50.8',
158
+ stroke: true,
159
+ strokeWidth: '4',
160
+ children: [{ type: 'circle', cx: '25.4', cy: '25.4', r: '8.731' }],
161
+ }));
162
+ }
163
+ return btn;
164
+ }
165
+ export function createAIReviewButton(state) {
166
+ const btn = document.createElement('button');
167
+ btn.type = 'button';
168
+ btn.setAttribute('aria-label', 'AI Design Review');
169
+ const hasError = !!state.designReviewError;
170
+ const isActive = state.designReviewInProgress || !!state.lastDesignReview || hasError;
171
+ const isDisabled = state.designReviewInProgress || !state.sweetlinkConnected;
172
+ // Use error color (red) when there's an error, otherwise normal review color
173
+ const buttonColor = hasError ? CSS_COLORS.error : BUTTON_COLORS.review;
174
+ // Attach HTML tooltip
175
+ attachButtonTooltip(state, btn, buttonColor, (_tooltip, h) => {
176
+ if (state.designReviewInProgress) {
177
+ h.addProgress('AI Design Review in progress...');
178
+ return;
179
+ }
180
+ if (state.designReviewError) {
181
+ h.addError('Design review failed', state.designReviewError);
182
+ return;
183
+ }
184
+ if (state.lastDesignReview) {
185
+ h.addSuccess('Design review saved!', state.lastDesignReview);
186
+ return;
187
+ }
188
+ h.addTitle('AI Design Review');
189
+ h.addDescription('Captures screenshot and sends to Claude for design analysis.');
190
+ h.addSectionHeader('Requirements');
191
+ h.addShortcut('API Key', 'ANTHROPIC_API_KEY');
192
+ if (!state.sweetlinkConnected) {
193
+ h.addWarning('Sweetlink not connected');
194
+ }
195
+ });
196
+ Object.assign(btn.style, getButtonStyles(buttonColor, isActive, isDisabled));
197
+ if (!state.sweetlinkConnected)
198
+ btn.style.opacity = '0.5';
199
+ btn.disabled = isDisabled;
200
+ btn.onclick = () => showDesignReviewConfirmation(state);
201
+ if (state.designReviewInProgress) {
202
+ btn.textContent = '~';
203
+ btn.style.fontSize = '0.5rem';
204
+ btn.style.animation = 'pulse 1s infinite';
205
+ }
206
+ else if (state.designReviewError) {
207
+ // Show 'x' for error state
208
+ btn.textContent = '\u00D7';
209
+ btn.style.fontSize = '0.875rem';
210
+ btn.style.fontWeight = 'bold';
211
+ }
212
+ else if (state.lastDesignReview) {
213
+ btn.textContent = 'v';
214
+ btn.style.fontSize = '0.5rem';
215
+ }
216
+ else {
217
+ btn.appendChild(createSvgIcon('M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09zM18.259 8.715L18 9.75l-.259-1.035a3.375 3.375 0 00-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 002.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 002.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 00-2.456 2.456zM16.894 20.567L16.5 21.75l-.394-1.183a2.25 2.25 0 00-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 001.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 001.423 1.423l1.183.394-1.183.394a2.25 2.25 0 00-1.423 1.423z', { fill: true }));
218
+ }
219
+ return btn;
220
+ }
221
+ export function createOutlineButton(state) {
222
+ const btn = document.createElement('button');
223
+ btn.type = 'button';
224
+ btn.setAttribute('aria-label', 'Document Outline');
225
+ const isActive = state.showOutlineModal || !!state.lastOutline;
226
+ // Attach HTML tooltip
227
+ attachButtonTooltip(state, btn, BUTTON_COLORS.outline, (_tooltip, h) => {
228
+ if (state.lastOutline) {
229
+ const isDownloaded = state.lastOutline.endsWith('downloaded');
230
+ h.addSuccess(isDownloaded ? 'Outline downloaded!' : 'Outline saved!', isDownloaded ? undefined : state.lastOutline);
231
+ return;
232
+ }
233
+ h.addTitle('Document Outline');
234
+ h.addDescription('View page heading structure and save as markdown.');
235
+ if (state.options.saveLocation === 'local' && !state.sweetlinkConnected) {
236
+ h.addWarning('Sweetlink not connected. Switch save method to Auto or Download.');
237
+ }
238
+ });
239
+ Object.assign(btn.style, getButtonStyles(BUTTON_COLORS.outline, isActive, false));
240
+ btn.onclick = () => handleDocumentOutline(state);
241
+ if (state.lastOutline) {
242
+ btn.textContent = 'v';
243
+ btn.style.fontSize = '0.5rem';
244
+ }
245
+ else {
246
+ btn.appendChild(createSvgIcon('M3 4h18v2H3V4zm0 7h12v2H3v-2zm0 7h18v2H3v-2z', { fill: true }));
247
+ }
248
+ return btn;
249
+ }
250
+ export function createSchemaButton(state) {
251
+ const btn = document.createElement('button');
252
+ btn.type = 'button';
253
+ btn.setAttribute('aria-label', 'Page Schema');
254
+ const isActive = state.showSchemaModal || !!state.lastSchema;
255
+ // Attach HTML tooltip
256
+ attachButtonTooltip(state, btn, BUTTON_COLORS.schema, (_tooltip, h) => {
257
+ if (state.lastSchema) {
258
+ const isDownloaded = state.lastSchema.endsWith('downloaded');
259
+ h.addSuccess(isDownloaded ? 'Schema downloaded!' : 'Schema saved!', isDownloaded ? undefined : state.lastSchema);
260
+ return;
261
+ }
262
+ h.addTitle('Page Schema');
263
+ h.addDescription('View JSON-LD, Open Graph, and other structured data.');
264
+ if (state.options.saveLocation === 'local' && !state.sweetlinkConnected) {
265
+ h.addWarning('Sweetlink not connected. Switch save method to Auto or Download.');
266
+ }
267
+ });
268
+ Object.assign(btn.style, getButtonStyles(BUTTON_COLORS.schema, isActive, false));
269
+ btn.onclick = () => handlePageSchema(state);
270
+ if (state.lastSchema) {
271
+ btn.textContent = 'v';
272
+ btn.style.fontSize = '0.5rem';
273
+ }
274
+ else {
275
+ btn.appendChild(createSvgIcon('M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z', { fill: true }));
276
+ }
277
+ return btn;
278
+ }
279
+ export function createA11yButton(state) {
280
+ const btn = document.createElement('button');
281
+ btn.type = 'button';
282
+ btn.setAttribute('aria-label', 'Accessibility Audit');
283
+ const isActive = state.showA11yModal || !!state.lastA11yAudit;
284
+ attachButtonTooltip(state, btn, BUTTON_COLORS.a11y, (_tooltip, h) => {
285
+ if (state.lastA11yAudit) {
286
+ const isDownloaded = state.lastA11yAudit.endsWith('downloaded');
287
+ h.addSuccess(isDownloaded ? 'A11y report downloaded!' : 'A11y report saved!', isDownloaded ? undefined : state.lastA11yAudit);
288
+ return;
289
+ }
290
+ h.addTitle('Accessibility Audit');
291
+ h.addDescription('Run axe-core audit to check WCAG compliance.');
292
+ if (state.options.saveLocation === 'local' && !state.sweetlinkConnected) {
293
+ h.addWarning('Sweetlink not connected. Switch save method to Auto or Download.');
294
+ }
295
+ });
296
+ // Preload axe-core on hover
297
+ btn.addEventListener('mouseenter', () => preloadAxe(), { once: true });
298
+ Object.assign(btn.style, getButtonStyles(BUTTON_COLORS.a11y, isActive, false));
299
+ btn.onclick = () => handleA11yAudit(state);
300
+ if (state.lastA11yAudit) {
301
+ btn.textContent = 'v';
302
+ btn.style.fontSize = '0.5rem';
303
+ }
304
+ else {
305
+ // Accessibility/shield icon
306
+ btn.appendChild(createSvgIcon('M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm-2 16l-4-4 1.41-1.41L10 14.17l6.59-6.59L18 9l-8 8z', { fill: true }));
307
+ }
308
+ return btn;
309
+ }
310
+ /**
311
+ * Create the settings gear button.
312
+ */
313
+ export function createSettingsButton(state) {
314
+ const btn = document.createElement('button');
315
+ btn.type = 'button';
316
+ btn.setAttribute('data-testid', 'devbar-settings-button');
317
+ btn.setAttribute('aria-label', 'Settings');
318
+ // Attach HTML tooltip
319
+ attachButtonTooltip(state, btn, CSS_COLORS.textSecondary, (_tooltip, h) => {
320
+ h.addTitle('Settings');
321
+ h.addSectionHeader('Keyboard');
322
+ h.addShortcut('Cmd or Ctrl+Shift+M', 'Toggle compact mode');
323
+ });
324
+ const isActive = state.showSettingsPopover;
325
+ const color = CSS_COLORS.textSecondary;
326
+ Object.assign(btn.style, getButtonStyles(color, isActive, false));
327
+ btn.onclick = () => {
328
+ const wasOpen = state.showSettingsPopover;
329
+ closeAllModals(state);
330
+ state.showSettingsPopover = !wasOpen;
331
+ state.render();
332
+ };
333
+ // Gear icon SVG
334
+ btn.appendChild(createSvgIcon('M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z', { stroke: true, children: [{ type: 'circle', cx: '12', cy: '12', r: '3' }] }));
335
+ return btn;
336
+ }
337
+ /**
338
+ * Create the compact mode toggle button with chevron icon.
339
+ */
340
+ export function createCompactToggleButton(state) {
341
+ const btn = document.createElement('button');
342
+ btn.type = 'button';
343
+ btn.setAttribute('aria-label', state.compactMode ? 'Switch to expanded mode' : 'Switch to compact mode');
344
+ const isCompact = state.compactMode;
345
+ const { accentColor } = state.options;
346
+ const iconColor = CSS_COLORS.textSecondary;
347
+ Object.assign(btn.style, getButtonStyles(iconColor, false, false));
348
+ btn.style.borderColor = withAlpha(accentColor, 38);
349
+ attachTextTooltip(state, btn, () => (isCompact ? 'Expand (Cmd or Ctrl+Shift+M)' : 'Compact (Cmd or Ctrl+Shift+M)'), {
350
+ onEnter: () => {
351
+ btn.style.borderColor = accentColor;
352
+ btn.style.backgroundColor = withAlpha(accentColor, 13);
353
+ btn.style.color = iconColor;
354
+ },
355
+ onLeave: () => {
356
+ btn.style.borderColor = withAlpha(accentColor, 38);
357
+ btn.style.backgroundColor = 'transparent';
358
+ btn.style.color = withAlpha(iconColor, 60);
359
+ },
360
+ });
361
+ btn.onclick = () => {
362
+ state.toggleCompactMode();
363
+ };
364
+ // Chevron icon SVG - points right when expanded, left when compact
365
+ const chevronPoints = isCompact ? '9 18 15 12 9 6' : '15 18 9 12 15 6';
366
+ btn.appendChild(createSvgIcon('', { stroke: true, children: [{ type: 'polyline', points: chevronPoints }] }));
367
+ return btn;
368
+ }
369
+ //# sourceMappingURL=buttons.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"buttons.js","sourceRoot":"","sources":["../../../src/modules/rendering/buttons.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Collapsed state rendering for the DevBar.
3
+ */
4
+ import type { DevBarState } from '../types.js';
5
+ export declare function renderCollapsed(state: DevBarState): void;
6
+ //# sourceMappingURL=collapsed.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"collapsed.d.ts","sourceRoot":"","sources":["../../../src/modules/rendering/collapsed.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EAAE,WAAW,EAAiB,MAAM,aAAa,CAAC;AAE9D,wBAAgB,eAAe,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI,CAgJxD"}
@@ -0,0 +1,124 @@
1
+ /**
2
+ * Collapsed state rendering for the DevBar.
3
+ */
4
+ import { CSS_COLORS, withAlpha } from '../../constants.js';
5
+ import { attachTextTooltip } from '../tooltips.js';
6
+ export function renderCollapsed(state) {
7
+ if (!state.container)
8
+ return;
9
+ const { position, accentColor } = state.options;
10
+ const { errorCount, warningCount } = state.getLogCounts();
11
+ // Use captured dot position if available, otherwise fall back to preset positions
12
+ // The 13px offset accounts for half the collapsed circle diameter (26px / 2)
13
+ let posStyle;
14
+ if (state.lastDotPosition) {
15
+ // Position based on where the dot actually was
16
+ const isTop = position.startsWith('top');
17
+ posStyle = isTop
18
+ ? { top: `${state.lastDotPosition.top - 13}px`, left: `${state.lastDotPosition.left - 13}px` }
19
+ : {
20
+ bottom: `${state.lastDotPosition.bottom - 13}px`,
21
+ left: `${state.lastDotPosition.left - 13}px`,
22
+ };
23
+ // Clear after use so expand doesn't re-use stale values
24
+ state.lastDotPosition = null;
25
+ }
26
+ else {
27
+ // Fallback preset positions for when no dot position was captured
28
+ const collapsedPositions = {
29
+ 'bottom-left': { bottom: '27px', left: '86px' },
30
+ 'bottom-right': { bottom: '27px', right: '29px' },
31
+ 'top-left': { top: '27px', left: '86px' },
32
+ 'top-right': { top: '27px', right: '29px' },
33
+ 'bottom-center': { bottom: '19px', left: '50%', transform: 'translateX(-50%)' },
34
+ };
35
+ posStyle = collapsedPositions[position] ?? collapsedPositions['bottom-left'];
36
+ }
37
+ const wrapper = state.container;
38
+ wrapper.className = 'devbar-collapse';
39
+ state.resetPositionStyles(wrapper);
40
+ // Set CSS variable for accent color (used by pulse animation)
41
+ wrapper.style.setProperty('--devbar-color-accent', accentColor);
42
+ Object.assign(wrapper.style, {
43
+ position: 'fixed',
44
+ ...posStyle,
45
+ zIndex: '9999',
46
+ backgroundColor: 'var(--devbar-color-bg-card)',
47
+ border: `1px solid ${accentColor}`,
48
+ borderRadius: '50%',
49
+ color: accentColor,
50
+ boxShadow: `0 4px 12px rgba(0, 0, 0, 0.3), 0 0 0 1px ${withAlpha(accentColor, 10)}`,
51
+ backdropFilter: 'blur(8px)',
52
+ WebkitBackdropFilter: 'blur(8px)',
53
+ cursor: 'pointer',
54
+ display: 'flex',
55
+ alignItems: 'center',
56
+ justifyContent: 'center',
57
+ width: '26px',
58
+ height: '26px',
59
+ boxSizing: 'border-box',
60
+ animation: 'devbar-collapse 150ms ease-out, devbar-collapsed-pulse 2s ease-in-out 0.2s 3',
61
+ });
62
+ wrapper.onclick = () => {
63
+ state.collapsed = false;
64
+ state.debug.state('Expanded DevBar');
65
+ state.render();
66
+ };
67
+ // Create inner container for dot + chevron
68
+ const innerContainer = document.createElement('span');
69
+ Object.assign(innerContainer.style, {
70
+ display: 'flex',
71
+ alignItems: 'center',
72
+ justifyContent: 'center',
73
+ position: 'relative',
74
+ });
75
+ // Connection indicator dot (same size as in expanded state)
76
+ const dot = document.createElement('span');
77
+ Object.assign(dot.style, {
78
+ width: '6px',
79
+ height: '6px',
80
+ borderRadius: '50%',
81
+ backgroundColor: state.sweetlinkConnected ? CSS_COLORS.primary : CSS_COLORS.textMuted,
82
+ boxShadow: state.sweetlinkConnected ? `0 0 6px ${CSS_COLORS.primary}` : 'none',
83
+ transition: 'transform 150ms ease-out, opacity 150ms ease-out',
84
+ });
85
+ innerContainer.appendChild(dot);
86
+ // Expand chevron indicator (appears on hover)
87
+ const chevron = document.createElement('span');
88
+ Object.assign(chevron.style, {
89
+ position: 'absolute',
90
+ width: '100%',
91
+ height: '100%',
92
+ display: 'flex',
93
+ alignItems: 'center',
94
+ justifyContent: 'center',
95
+ opacity: '0',
96
+ transition: 'opacity 150ms ease-out',
97
+ fontSize: '10px',
98
+ color: accentColor,
99
+ });
100
+ chevron.textContent = '\u2197';
101
+ innerContainer.appendChild(chevron);
102
+ attachTextTooltip(state, wrapper, () => `Click to expand DevBar${state.sweetlinkConnected ? ' (Sweetlink connected)' : ' (Sweetlink not connected)'}${errorCount > 0 ? `\n${errorCount} console error${errorCount === 1 ? '' : 's'}` : ''}`, {
103
+ onEnter: () => {
104
+ dot.style.opacity = '0';
105
+ dot.style.transform = 'scale(0)';
106
+ chevron.style.opacity = '1';
107
+ },
108
+ onLeave: () => {
109
+ dot.style.opacity = '1';
110
+ dot.style.transform = 'scale(1)';
111
+ chevron.style.opacity = '0';
112
+ },
113
+ });
114
+ wrapper.appendChild(innerContainer);
115
+ // Error badge (absolute, top-right of circle, shifted left if warning badge exists)
116
+ if (errorCount > 0) {
117
+ wrapper.appendChild(state.createCollapsedBadge(errorCount, 'rgba(239, 68, 68, 0.95)', warningCount > 0 ? '12px' : '-6px'));
118
+ }
119
+ // Warning badge (absolute, top-right)
120
+ if (warningCount > 0) {
121
+ wrapper.appendChild(state.createCollapsedBadge(warningCount, 'rgba(245, 158, 11, 0.95)', '-6px'));
122
+ }
123
+ }
124
+ //# sourceMappingURL=collapsed.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"collapsed.js","sourceRoot":"","sources":["../../../src/modules/rendering/collapsed.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,21 @@
1
+ /**
2
+ * Common helpers shared across rendering sub-modules.
3
+ */
4
+ import type { DevBarState } from '../types.js';
5
+ /**
6
+ * Capture the center of an element's bounding rect as a dot position.
7
+ * Used to animate the collapsed circle to the same spot as the connection dot.
8
+ */
9
+ export declare function captureDotPosition(state: DevBarState, element: Element): void;
10
+ /**
11
+ * Create the connection indicator (outer wrapper + inner colored dot).
12
+ * The caller is responsible for attaching tooltip and click handlers, since
13
+ * those differ between compact and expanded modes.
14
+ */
15
+ export declare function createConnectionIndicator(state: DevBarState): HTMLSpanElement;
16
+ /** Prevents re-entrant render calls during rapid clicks */
17
+ export declare let renderGuard: boolean;
18
+ export declare function setRenderGuard(value: boolean): void;
19
+ /** Remove all child nodes from an element. */
20
+ export declare function clearChildren(el: HTMLElement): void;
21
+ //# sourceMappingURL=common.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../src/modules/rendering/common.ts"],"names":[],"mappings":"AAAA;;GAEG;AAGH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI,CAO7E;AAED;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,WAAW,GAAG,eAAe,CA4B7E;AAED,2DAA2D;AAC3D,eAAO,IAAI,WAAW,SAAQ,CAAC;AAE/B,wBAAgB,cAAc,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAEnD;AAED,8CAA8C;AAC9C,wBAAgB,aAAa,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,CAInD"}
@@ -0,0 +1,60 @@
1
+ /**
2
+ * Common helpers shared across rendering sub-modules.
3
+ */
4
+ import { CSS_COLORS } from '../../constants.js';
5
+ /**
6
+ * Capture the center of an element's bounding rect as a dot position.
7
+ * Used to animate the collapsed circle to the same spot as the connection dot.
8
+ */
9
+ export function captureDotPosition(state, element) {
10
+ const rect = element.getBoundingClientRect();
11
+ state.lastDotPosition = {
12
+ left: rect.left + rect.width / 2,
13
+ top: rect.top + rect.height / 2,
14
+ bottom: window.innerHeight - (rect.top + rect.height / 2),
15
+ };
16
+ }
17
+ /**
18
+ * Create the connection indicator (outer wrapper + inner colored dot).
19
+ * The caller is responsible for attaching tooltip and click handlers, since
20
+ * those differ between compact and expanded modes.
21
+ */
22
+ export function createConnectionIndicator(state) {
23
+ const connIndicator = document.createElement('span');
24
+ connIndicator.className = 'devbar-clickable';
25
+ Object.assign(connIndicator.style, {
26
+ width: '12px',
27
+ height: '12px',
28
+ borderRadius: '50%',
29
+ backgroundColor: 'transparent',
30
+ display: 'flex',
31
+ alignItems: 'center',
32
+ justifyContent: 'center',
33
+ cursor: 'pointer',
34
+ flexShrink: '0',
35
+ });
36
+ const connDot = document.createElement('span');
37
+ connDot.className = 'devbar-conn-dot';
38
+ Object.assign(connDot.style, {
39
+ width: '6px',
40
+ height: '6px',
41
+ borderRadius: '50%',
42
+ backgroundColor: state.sweetlinkConnected ? CSS_COLORS.primary : CSS_COLORS.textMuted,
43
+ boxShadow: state.sweetlinkConnected ? `0 0 6px ${CSS_COLORS.primary}` : 'none',
44
+ transition: 'all 300ms',
45
+ });
46
+ connIndicator.appendChild(connDot);
47
+ return connIndicator;
48
+ }
49
+ /** Prevents re-entrant render calls during rapid clicks */
50
+ export let renderGuard = false;
51
+ export function setRenderGuard(value) {
52
+ renderGuard = value;
53
+ }
54
+ /** Remove all child nodes from an element. */
55
+ export function clearChildren(el) {
56
+ while (el.firstChild) {
57
+ el.removeChild(el.firstChild);
58
+ }
59
+ }
60
+ //# sourceMappingURL=common.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"common.js","sourceRoot":"","sources":["../../../src/modules/rendering/common.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGhD;;;GAGG;AACH,MAAM,UAAU,kBAAkB,CAAC,KAAkB,EAAE,OAAgB;IACrE,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;IAC7C,KAAK,CAAC,eAAe,GAAG;QACtB,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;QAChC,GAAG,EAAE,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;QAC/B,MAAM,EAAE,MAAM,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;KAC1D,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAAC,KAAkB;IAC1D,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IACrD,aAAa,CAAC,SAAS,GAAG,kBAAkB,CAAC;IAC7C,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE;QACjC,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,YAAY,EAAE,KAAK;QACnB,eAAe,EAAE,aAAa;QAC9B,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,MAAM,EAAE,SAAS;QACjB,UAAU,EAAE,GAAG;KAChB,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC/C,OAAO,CAAC,SAAS,GAAG,iBAAiB,CAAC;IACtC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;QAC3B,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,KAAK;QACb,YAAY,EAAE,KAAK;QACnB,eAAe,EAAE,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,SAAS;QACrF,SAAS,EAAE,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,WAAW,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,MAAM;QAC9E,UAAU,EAAE,WAAW;KACxB,CAAC,CAAC;IACH,aAAa,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAEnC,OAAO,aAAa,CAAC;AACvB,CAAC;AAED,2DAA2D;AAC3D,MAAM,CAAC,IAAI,WAAW,GAAG,KAAK,CAAC;AAE/B,MAAM,UAAU,cAAc,CAAC,KAAc;IAC3C,WAAW,GAAG,KAAK,CAAC;AACtB,CAAC;AAED,8CAA8C;AAC9C,MAAM,UAAU,aAAa,CAAC,EAAe;IAC3C,OAAO,EAAE,CAAC,UAAU,EAAE,CAAC;QACrB,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAChC,CAAC;AACH,CAAC"}
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Compact state rendering for the DevBar.
3
+ */
4
+ import type { DevBarState } from '../types.js';
5
+ export declare function renderCompact(state: DevBarState): void;
6
+ //# sourceMappingURL=compact.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"compact.d.ts","sourceRoot":"","sources":["../../../src/modules/rendering/compact.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EAAE,WAAW,EAAiB,MAAM,aAAa,CAAC;AAI9D,wBAAgB,aAAa,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI,CA+GtD"}