@thanh01.pmt/presentation-kit 0.2.18 → 0.3.0

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 (56) hide show
  1. package/README.md +26 -0
  2. package/dist/ai/index.cjs +16 -15
  3. package/dist/ai/index.cjs.map +1 -1
  4. package/dist/ai/index.d.cts +3 -2
  5. package/dist/ai/index.d.ts +3 -2
  6. package/dist/ai/index.js +2 -1
  7. package/dist/ai/index.js.map +1 -1
  8. package/dist/assets/fonts/NOTICE.md +25 -0
  9. package/dist/assets/fonts/SOURCES.json +47 -0
  10. package/dist/assets/fonts/fira-code.woff2 +0 -0
  11. package/dist/assets/fonts/inter.woff2 +0 -0
  12. package/dist/assets/fonts/jetbrains-mono.woff2 +0 -0
  13. package/dist/assets/fonts/playfair-display.woff2 +0 -0
  14. package/dist/assets/fonts/plus-jakarta-sans.woff2 +0 -0
  15. package/dist/assets/fonts/space-grotesk.woff2 +0 -0
  16. package/dist/chunk-3Q4RMZVQ.cjs +867 -0
  17. package/dist/chunk-3Q4RMZVQ.cjs.map +1 -0
  18. package/dist/{chunk-DDOUFYLK.js → chunk-I5RG2L3M.js} +3 -3
  19. package/dist/{chunk-DDOUFYLK.js.map → chunk-I5RG2L3M.js.map} +1 -1
  20. package/dist/{chunk-JJQDQIRG.js → chunk-INAOTYLK.cjs} +294 -854
  21. package/dist/chunk-INAOTYLK.cjs.map +1 -0
  22. package/dist/{chunk-DIHFQ5LF.cjs → chunk-JBGGQGSQ.cjs} +4 -4
  23. package/dist/{chunk-DIHFQ5LF.cjs.map → chunk-JBGGQGSQ.cjs.map} +1 -1
  24. package/dist/{chunk-SFBEDDGU.cjs → chunk-OCP2TAY2.js} +279 -878
  25. package/dist/chunk-OCP2TAY2.js.map +1 -0
  26. package/dist/chunk-V6X7D44H.js +854 -0
  27. package/dist/chunk-V6X7D44H.js.map +1 -0
  28. package/dist/{click-css-Bcc1CkTN.d.cts → click-css-C8VciwZ6.d.cts} +1 -1
  29. package/dist/{click-css-B2s9B_uP.d.ts → click-css-COIiFo1I.d.ts} +1 -1
  30. package/dist/index.cjs +90 -69
  31. package/dist/index.cjs.map +1 -1
  32. package/dist/index.d.cts +46 -5
  33. package/dist/index.d.ts +46 -5
  34. package/dist/index.js +5 -4
  35. package/dist/index.js.map +1 -1
  36. package/dist/node/index.cjs +117 -0
  37. package/dist/node/index.cjs.map +1 -0
  38. package/dist/node/index.d.cts +36 -0
  39. package/dist/node/index.d.ts +36 -0
  40. package/dist/node/index.js +105 -0
  41. package/dist/node/index.js.map +1 -0
  42. package/dist/{presets-D_hfPJX9.d.ts → presets-DPRGtpO-.d.ts} +1 -1
  43. package/dist/{presets-BYvgAAkJ.d.cts → presets-MIi91wZg.d.cts} +1 -1
  44. package/dist/react/index.cjs +17 -16
  45. package/dist/react/index.cjs.map +1 -1
  46. package/dist/react/index.d.cts +4 -3
  47. package/dist/react/index.d.ts +4 -3
  48. package/dist/react/index.js +4 -3
  49. package/dist/react/index.js.map +1 -1
  50. package/dist/{types-C3d04zzP.d.cts → types-CvxCxWus.d.cts} +1 -67
  51. package/dist/{types-C3d04zzP.d.ts → types-CvxCxWus.d.ts} +1 -67
  52. package/dist/types-k_eae8UV.d.cts +74 -0
  53. package/dist/types-k_eae8UV.d.ts +74 -0
  54. package/package.json +8 -2
  55. package/dist/chunk-JJQDQIRG.js.map +0 -1
  56. package/dist/chunk-SFBEDDGU.cjs.map +0 -1
@@ -0,0 +1,854 @@
1
+ import yaml from 'js-yaml';
2
+
3
+ // src/core/layout/serializer.ts
4
+ function serializeLayoutToComment(layout) {
5
+ if (!layout.boxes || layout.boxes.length === 0) return "";
6
+ const cleanData = {
7
+ boxes: layout.boxes.map((box) => {
8
+ const b = {
9
+ id: box.id,
10
+ target: box.target || `h1`,
11
+ pos: [
12
+ Math.round(box.pos[0]),
13
+ Math.round(box.pos[1]),
14
+ Math.round(box.pos[2]),
15
+ Math.round(box.pos[3])
16
+ ]
17
+ };
18
+ if (box.fontSize) b.fontSize = box.fontSize;
19
+ if (box.color) b.color = box.color;
20
+ if (box.textAlign) b.textAlign = box.textAlign;
21
+ if (box.style) b.style = box.style;
22
+ return b;
23
+ })
24
+ };
25
+ const yamlStr = yaml.dump(cleanData, {
26
+ indent: 2,
27
+ lineWidth: -1,
28
+ noRefs: true
29
+ }).trim();
30
+ return `<!-- layout:
31
+ ${yamlStr.split("\n").join("\n ")}
32
+ -->`;
33
+ }
34
+ function splitMarkdownSlides(markdown) {
35
+ const lines = markdown.split("\n");
36
+ let frontmatter = null;
37
+ const slideBuffers = [];
38
+ let currentBuffer = [];
39
+ let inCodeFence = false;
40
+ let lineIdx = 0;
41
+ if (lines.length > 0 && lines[0].trim() === "---") {
42
+ const fmBuffer = [lines[0]];
43
+ lineIdx = 1;
44
+ while (lineIdx < lines.length) {
45
+ const line = lines[lineIdx];
46
+ fmBuffer.push(line);
47
+ if (line.trim() === "---") {
48
+ frontmatter = fmBuffer.join("\n");
49
+ lineIdx++;
50
+ break;
51
+ }
52
+ lineIdx++;
53
+ }
54
+ }
55
+ for (let i = lineIdx; i < lines.length; i++) {
56
+ const line = lines[i];
57
+ if (/^```/.test(line.trim())) {
58
+ inCodeFence = !inCodeFence;
59
+ currentBuffer.push(line);
60
+ continue;
61
+ }
62
+ if (!inCodeFence && line.trim() === "---") {
63
+ slideBuffers.push(currentBuffer);
64
+ currentBuffer = [];
65
+ continue;
66
+ }
67
+ currentBuffer.push(line);
68
+ }
69
+ slideBuffers.push(currentBuffer);
70
+ const slides = slideBuffers.map((b) => b.join("\n"));
71
+ return { frontmatter, slides };
72
+ }
73
+ function updateSlideLayoutInMarkdown(markdown, slideIndex, layout) {
74
+ const { frontmatter, slides } = splitMarkdownSlides(markdown);
75
+ if (slideIndex < 0 || slideIndex >= slides.length) {
76
+ return markdown;
77
+ }
78
+ let slideContent = slides[slideIndex];
79
+ const layoutCommentRegex = /<!--\s*layout:\s*[\s\S]*?-->/i;
80
+ const newComment = layout && layout.boxes && layout.boxes.length > 0 ? serializeLayoutToComment(layout) : "";
81
+ if (layoutCommentRegex.test(slideContent)) {
82
+ if (newComment) {
83
+ slideContent = slideContent.replace(layoutCommentRegex, newComment);
84
+ } else {
85
+ slideContent = slideContent.replace(layoutCommentRegex, "").trim();
86
+ }
87
+ } else if (newComment) {
88
+ const trimmed = slideContent.trimStart();
89
+ slideContent = `${newComment}
90
+
91
+ ${trimmed}`;
92
+ }
93
+ slides[slideIndex] = slideContent;
94
+ const joinedSlides = slides.join("\n---\n");
95
+ if (frontmatter) {
96
+ return `${frontmatter}
97
+
98
+ ${joinedSlides}`;
99
+ }
100
+ return joinedSlides;
101
+ }
102
+ function updateSlideTextInMarkdown(markdown, slideIndex, oldText, newText) {
103
+ const { frontmatter, slides } = splitMarkdownSlides(markdown);
104
+ if (slideIndex < 0 || slideIndex >= slides.length) {
105
+ return markdown;
106
+ }
107
+ const cleanOld = oldText.trim();
108
+ const cleanNew = newText.trim();
109
+ if (!cleanOld || cleanOld === cleanNew) return markdown;
110
+ let slideContent = slides[slideIndex];
111
+ if (slideContent.includes(cleanOld)) {
112
+ slideContent = slideContent.replace(cleanOld, cleanNew);
113
+ } else {
114
+ const lines = slideContent.split("\n");
115
+ let replaced = false;
116
+ for (let i = 0; i < lines.length; i++) {
117
+ const line = lines[i];
118
+ const stripped = line.replace(/^[#\s\-\*\>]+/, "").replace(/[*_`]/g, "").trim();
119
+ if (stripped === cleanOld) {
120
+ const prefixMatch = line.match(/^([#\s\-\*\>]+)/);
121
+ const prefix = prefixMatch ? prefixMatch[1] : "";
122
+ lines[i] = `${prefix}${cleanNew}`;
123
+ replaced = true;
124
+ break;
125
+ }
126
+ }
127
+ if (replaced) {
128
+ slideContent = lines.join("\n");
129
+ } else {
130
+ const escaped = cleanOld.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
131
+ const regex = new RegExp(escaped, "i");
132
+ if (regex.test(slideContent)) {
133
+ slideContent = slideContent.replace(regex, cleanNew);
134
+ } else {
135
+ const words = cleanOld.split(/\s+/).filter((w) => w.length > 2);
136
+ if (words.length > 0) {
137
+ const pattern = words.map((w) => w.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).join("[\\s\\S]*?");
138
+ const fuzzyRegex = new RegExp(pattern, "i");
139
+ if (fuzzyRegex.test(slideContent)) {
140
+ slideContent = slideContent.replace(fuzzyRegex, cleanNew);
141
+ }
142
+ }
143
+ }
144
+ }
145
+ }
146
+ slides[slideIndex] = slideContent;
147
+ const joinedSlides = slides.join("\n---\n");
148
+ if (frontmatter) {
149
+ return `${frontmatter}
150
+
151
+ ${joinedSlides}`;
152
+ }
153
+ return joinedSlides;
154
+ }
155
+ function removeSlideElementFromMarkdown(markdown, slideIndex, options) {
156
+ const { frontmatter, slides } = splitMarkdownSlides(markdown);
157
+ if (slideIndex < 0 || slideIndex >= slides.length) {
158
+ return markdown;
159
+ }
160
+ let slideContent = slides[slideIndex];
161
+ const cleanContent = options.content?.trim();
162
+ if (cleanContent) {
163
+ const lines = slideContent.split("\n");
164
+ let removed = false;
165
+ const updatedLines = lines.filter((line) => {
166
+ if (removed) return true;
167
+ const stripped = line.replace(/^[#\s\-\*\>]+/, "").replace(/[*_`]/g, "").trim();
168
+ if (stripped === cleanContent || line.includes(cleanContent)) {
169
+ removed = true;
170
+ return false;
171
+ }
172
+ return true;
173
+ });
174
+ if (removed) {
175
+ slideContent = updatedLines.join("\n");
176
+ }
177
+ }
178
+ const layoutCommentRegex = /<!--\s*layout:\s*([\s\S]*?)-->/i;
179
+ const match = slideContent.match(layoutCommentRegex);
180
+ if (match && match[1]) {
181
+ try {
182
+ const parsed = yaml.load(match[1]);
183
+ if (parsed && Array.isArray(parsed.boxes)) {
184
+ const remainingBoxes = parsed.boxes.filter((b) => {
185
+ if (options.boxId && b.id === options.boxId) return false;
186
+ if (options.target && b.target === options.target) return false;
187
+ return true;
188
+ });
189
+ if (remainingBoxes.length > 0) {
190
+ const yamlStr = yaml.dump({ boxes: remainingBoxes }, { indent: 2, lineWidth: -1, noRefs: true }).trim();
191
+ slideContent = slideContent.replace(layoutCommentRegex, `<!-- layout:
192
+ ${yamlStr.split("\n").join("\n ")}
193
+ -->`);
194
+ } else {
195
+ slideContent = slideContent.replace(layoutCommentRegex, "").trim();
196
+ }
197
+ }
198
+ } catch {
199
+ }
200
+ }
201
+ slides[slideIndex] = slideContent;
202
+ const joinedSlides = slides.join("\n---\n");
203
+ if (frontmatter) {
204
+ return `${frontmatter}
205
+
206
+ ${joinedSlides}`;
207
+ }
208
+ return joinedSlides;
209
+ }
210
+
211
+ // src/core/layout/presets.ts
212
+ var SLIDE_LAYOUT_PRESETS = [
213
+ {
214
+ id: "title-hero",
215
+ name: "Title & Speaker Cover",
216
+ category: "cover",
217
+ description: "High-impact opening slide with large title, subtitle, and speaker credentials.",
218
+ layout: {
219
+ boxes: [
220
+ {
221
+ id: "title",
222
+ target: "h1",
223
+ pos: [100, 180, 1080, 140],
224
+ fontSize: "3rem",
225
+ textAlign: "center"
226
+ },
227
+ {
228
+ id: "subtitle",
229
+ target: "h3",
230
+ pos: [100, 350, 1080, 70],
231
+ fontSize: "1.5rem",
232
+ textAlign: "center"
233
+ },
234
+ {
235
+ id: "speaker-meta",
236
+ target: "p",
237
+ pos: [100, 460, 1080, 80],
238
+ fontSize: "1.1rem",
239
+ textAlign: "center"
240
+ }
241
+ ]
242
+ },
243
+ markdownSnippet: `<!-- layout:
244
+ boxes:
245
+ - id: title
246
+ target: h1
247
+ pos: [100, 180, 1080, 140]
248
+ fontSize: 3rem
249
+ textAlign: center
250
+ - id: subtitle
251
+ target: h3
252
+ pos: [100, 350, 1080, 70]
253
+ fontSize: 1.5rem
254
+ textAlign: center
255
+ - id: speaker-meta
256
+ target: p
257
+ pos: [100, 460, 1080, 80]
258
+ fontSize: 1.1rem
259
+ textAlign: center
260
+ -->
261
+
262
+ # \u{1F680} Engineering Scalable Cloud Systems
263
+ ### Principles, Bottlenecks, and Real-World Architecture Patterns
264
+
265
+ **Presenter:** Senior Systems Architect | **Duration:** 45 mins | **Level:** Intermediate
266
+
267
+ <!--
268
+ Presenter Notes:
269
+ - Welcome the audience and outline today's primary engineering goals.
270
+ - Spark curiosity with an opening hook about scaling under high concurrency.
271
+ -->`
272
+ },
273
+ {
274
+ id: "two-column-split",
275
+ name: "Two-Column Comparison",
276
+ category: "split",
277
+ description: "Balanced side-by-side comparison for legacy vs modern patterns or pros vs cons.",
278
+ layout: {
279
+ boxes: [
280
+ {
281
+ id: "heading",
282
+ target: "h2",
283
+ pos: [80, 50, 1120, 70],
284
+ fontSize: "2rem"
285
+ },
286
+ {
287
+ id: "col-left",
288
+ target: ".columns-2 > div:first-child",
289
+ pos: [80, 150, 530, 510]
290
+ },
291
+ {
292
+ id: "col-right",
293
+ target: ".columns-2 > div:last-child",
294
+ pos: [670, 150, 530, 510]
295
+ }
296
+ ]
297
+ },
298
+ markdownSnippet: `<!-- layout:
299
+ boxes:
300
+ - id: heading
301
+ target: h2
302
+ pos: [80, 50, 1120, 70]
303
+ fontSize: 2rem
304
+ - id: col-left
305
+ target: '.columns-2 > div:first-child'
306
+ pos: [80, 150, 530, 510]
307
+ - id: col-right
308
+ target: '.columns-2 > div:last-child'
309
+ pos: [670, 150, 530, 510]
310
+ -->
311
+
312
+ ## \u2696\uFE0F Monolithic Polling vs Event-Driven Architecture
313
+
314
+ <div class="columns-2">
315
+ <div>
316
+
317
+ ### \u{1F534} Legacy Polling
318
+ - Heavy database CPU overhead on idle cycles
319
+ - High network latency between updates
320
+ - Prone to cascading timeouts during spikes
321
+
322
+ </div>
323
+ <div>
324
+
325
+ ### \u{1F7E2} Event-Driven Streams
326
+ - Real-time event propagation via webhooks
327
+ - Zero idle compute waste with serverless consumers
328
+ - Automatic backpressure and queue isolation
329
+
330
+ </div>
331
+ </div>
332
+
333
+ <!--
334
+ Presenter Notes:
335
+ - Emphasize the core failure mode of periodic polling under sudden load spikes.
336
+ - Ask the room if anyone has experienced database lockups caused by polling loops.
337
+ -->`
338
+ },
339
+ {
340
+ id: "code-explainer",
341
+ name: "Code Walkthrough & Analysis",
342
+ category: "code",
343
+ description: "Syntax-highlighted code block on the left with step-by-step key annotations on the right.",
344
+ layout: {
345
+ boxes: [
346
+ {
347
+ id: "heading",
348
+ target: "h2",
349
+ pos: [80, 45, 1120, 65],
350
+ fontSize: "1.9rem"
351
+ },
352
+ {
353
+ id: "code-box",
354
+ target: ".columns-2 > div:first-child",
355
+ pos: [80, 135, 630, 535]
356
+ },
357
+ {
358
+ id: "notes-box",
359
+ target: ".columns-2 > div:last-child",
360
+ pos: [740, 135, 460, 535]
361
+ }
362
+ ]
363
+ },
364
+ markdownSnippet: `<!-- layout:
365
+ boxes:
366
+ - id: heading
367
+ target: h2
368
+ pos: [80, 45, 1120, 65]
369
+ fontSize: 1.9rem
370
+ - id: code-box
371
+ target: '.columns-2 > div:first-child'
372
+ pos: [80, 135, 630, 535]
373
+ - id: notes-box
374
+ target: '.columns-2 > div:last-child'
375
+ pos: [740, 135, 460, 535]
376
+ -->
377
+
378
+ ## \u{1F4BB} Robust Async Transaction Pipeline
379
+
380
+ <div class="columns-2">
381
+ <div>
382
+
383
+ \`\`\`ts
384
+ // Process payment with idempotency guarantee
385
+ export async function processPayment(order: Order) {
386
+ const isValid = await validateOrder(order);
387
+ if (!isValid) throw new Error("ValidationFailed");
388
+
389
+ const receipt = await chargeCard(order);
390
+ return sendConfirmation(receipt);
391
+ }
392
+ \`\`\`
393
+
394
+ </div>
395
+ <div>
396
+
397
+ ### \u{1F50D} Key Engineering Invariants:
398
+ 1. **Early Guard Clause:** Validates payload immediately at line 3 before triggering external calls.
399
+ 2. **Deterministic Sequence:** Enforces strict order of operations using native \`await\`.
400
+ 3. **Audit Trail:** Returns immutable payment receipt upon successful execution.
401
+
402
+ </div>
403
+ </div>
404
+
405
+ <!--
406
+ Presenter Notes:
407
+ - Walk through lines 1 to 7 sequentially.
408
+ - Cold-call check: "What happens if line 6 throws a network timeout?"
409
+ - Cognitive scaffolding: Highlight the importance of idempotency keys in payment APIs.
410
+ -->`
411
+ },
412
+ {
413
+ id: "metrics-3-card",
414
+ name: "3-Metric Key Results Grid",
415
+ category: "metrics",
416
+ description: "Three high-visibility KPI stat cards for benchmarks, impact, and success criteria.",
417
+ layout: {
418
+ boxes: [
419
+ {
420
+ id: "heading",
421
+ target: "h2",
422
+ pos: [80, 50, 1120, 70],
423
+ fontSize: "2rem",
424
+ textAlign: "center"
425
+ },
426
+ {
427
+ id: "metric-1",
428
+ target: ".columns-3 > div:nth-child(1)",
429
+ pos: [80, 165, 340, 485]
430
+ },
431
+ {
432
+ id: "metric-2",
433
+ target: ".columns-3 > div:nth-child(2)",
434
+ pos: [470, 165, 340, 485]
435
+ },
436
+ {
437
+ id: "metric-3",
438
+ target: ".columns-3 > div:nth-child(3)",
439
+ pos: [860, 165, 340, 485]
440
+ }
441
+ ]
442
+ },
443
+ markdownSnippet: `<!-- layout:
444
+ boxes:
445
+ - id: heading
446
+ target: h2
447
+ pos: [80, 50, 1120, 70]
448
+ fontSize: 2rem
449
+ textAlign: center
450
+ - id: metric-1
451
+ target: '.columns-3 > div:nth-child(1)'
452
+ pos: [80, 165, 340, 485]
453
+ - id: metric-2
454
+ target: '.columns-3 > div:nth-child(2)'
455
+ pos: [470, 165, 340, 485]
456
+ - id: metric-3
457
+ target: '.columns-3 > div:nth-child(3)'
458
+ pos: [860, 165, 340, 485]
459
+ -->
460
+
461
+ ## \u{1F4CA} Performance & Reliability Benchmarks
462
+
463
+ <div class="columns-3">
464
+ <div>
465
+
466
+ # \u26A1 99.99%
467
+ ### SLA Availability
468
+ High-availability multi-region cluster with automated failover routing.
469
+
470
+ </div>
471
+ <div>
472
+
473
+ # \u{1F680} 15ms
474
+ ### P99 Latency
475
+ Sub-20ms roundtrip response time via distributed edge caching.
476
+
477
+ </div>
478
+ <div>
479
+
480
+ # \u{1F6E1}\uFE0F Zero
481
+ ### Unhandled Breaches
482
+ Full SOC2 Type II compliance and end-to-end payload encryption.
483
+
484
+ </div>
485
+ </div>
486
+
487
+ <!--
488
+ Presenter Notes:
489
+ - Highlight the 15ms P99 latency target as the primary technical milestone.
490
+ - Connect these metrics directly to the architecture decisions discussed next.
491
+ -->`
492
+ },
493
+ {
494
+ id: "process-flow",
495
+ name: "Architecture & Process Flow",
496
+ category: "diagram",
497
+ description: "Multi-stage workflow with responsive Mermaid diagram and phase summaries.",
498
+ layout: {
499
+ boxes: [
500
+ {
501
+ id: "heading",
502
+ target: "h2",
503
+ pos: [80, 45, 1120, 65],
504
+ fontSize: "1.9rem"
505
+ },
506
+ {
507
+ id: "diagram-box",
508
+ target: "pre.mermaid, .mermaid",
509
+ pos: [80, 130, 1120, 310]
510
+ },
511
+ {
512
+ id: "summary-box",
513
+ target: "ul, p",
514
+ pos: [80, 465, 1120, 205]
515
+ }
516
+ ]
517
+ },
518
+ markdownSnippet: `<!-- layout:
519
+ boxes:
520
+ - id: heading
521
+ target: h2
522
+ pos: [80, 45, 1120, 65]
523
+ fontSize: 1.9rem
524
+ - id: diagram-box
525
+ target: 'pre.mermaid, .mermaid'
526
+ pos: [80, 130, 1120, 310]
527
+ - id: summary-box
528
+ target: 'ul, p'
529
+ pos: [80, 465, 1120, 205]
530
+ -->
531
+
532
+ ## \u{1F504} End-to-End Data Ingestion Pipeline
533
+
534
+ \`\`\`mermaid
535
+ graph LR
536
+ A[1. Client Ingress] --> B[2. API Gateway]
537
+ B --> C[3. Auth Verifier]
538
+ C --> D[4. Distributed DB]
539
+ style A fill:#0284c7,stroke:#38bdf8,stroke-width:2px,color:#fff
540
+ style B fill:#1e293b,stroke:#64748b,stroke-width:2px,color:#fff
541
+ style C fill:#059669,stroke:#34d399,stroke-width:2px,color:#fff
542
+ style D fill:#7c3aed,stroke:#a78bfa,stroke-width:2px,color:#fff
543
+ \`\`\`
544
+
545
+ - **Ingress & Gateway:** Rate-limits traffic and applies reverse-proxy load balancing.
546
+ - **Verification & Storage:** Decodes cryptographic JWT tokens before transactional write commit.
547
+
548
+ <!--
549
+ Presenter Notes:
550
+ - Trace each hop across the diagram from left to right.
551
+ - Ask: "Where should rate limiting be applied to prevent DDoS attacks?"
552
+ -->`
553
+ },
554
+ {
555
+ id: "quote-highlight",
556
+ name: "Core Principle & Quote Highlight",
557
+ category: "quote",
558
+ description: "Prominent quote callout for fundamental engineering rules or memorable mantras.",
559
+ layout: {
560
+ boxes: [
561
+ {
562
+ id: "heading",
563
+ target: "h2",
564
+ pos: [100, 100, 1080, 80],
565
+ fontSize: "2.2rem",
566
+ textAlign: "center"
567
+ },
568
+ {
569
+ id: "quote-box",
570
+ target: "blockquote",
571
+ pos: [140, 230, 1e3, 360],
572
+ fontSize: "1.4rem"
573
+ }
574
+ ]
575
+ },
576
+ markdownSnippet: `<!-- layout:
577
+ boxes:
578
+ - id: heading
579
+ target: h2
580
+ pos: [100, 100, 1080, 80]
581
+ fontSize: 2.2rem
582
+ textAlign: center
583
+ - id: quote-box
584
+ target: blockquote
585
+ pos: [140, 230, 1000, 360]
586
+ fontSize: 1.4rem
587
+ -->
588
+
589
+ ## \u{1F4A1} Foundational Architecture Principle
590
+
591
+ > "Simplicity is prerequisite for reliability. A well-engineered distributed system is one where a new engineer can understand the request flow within their first hour."
592
+ >
593
+ > \u2014 **Edsger W. Dijkstra**
594
+
595
+ <!--
596
+ Presenter Notes:
597
+ - Pause for 5 seconds of silence to let the quote sink in.
598
+ - Ask: "How do our current architectural choices reflect this principle?"
599
+ -->`
600
+ },
601
+ {
602
+ id: "quiz-checkpoint",
603
+ name: "Interactive Formative Checkpoint",
604
+ category: "assessment",
605
+ description: "Interactive multiple-choice diagnostic checkpoint with A/B/C/D voting options.",
606
+ layout: {
607
+ boxes: [
608
+ {
609
+ id: "heading",
610
+ target: "h2",
611
+ pos: [80, 45, 1120, 65],
612
+ fontSize: "1.9rem"
613
+ },
614
+ {
615
+ id: "question-callout",
616
+ target: "blockquote",
617
+ pos: [80, 130, 1120, 110],
618
+ fontSize: "1.2rem"
619
+ },
620
+ {
621
+ id: "options-list",
622
+ target: "ul",
623
+ pos: [80, 260, 1120, 390],
624
+ fontSize: "1.15rem"
625
+ }
626
+ ]
627
+ },
628
+ markdownSnippet: `<!-- layout:
629
+ boxes:
630
+ - id: heading
631
+ target: h2
632
+ pos: [80, 45, 1120, 65]
633
+ fontSize: 1.9rem
634
+ - id: question-callout
635
+ target: blockquote
636
+ pos: [80, 130, 1120, 110]
637
+ fontSize: 1.2rem
638
+ - id: options-list
639
+ target: ul
640
+ pos: [80, 260, 1120, 390]
641
+ fontSize: 1.15rem
642
+ -->
643
+
644
+ ## \u{1F3AF} Formative Checkpoint: Verify Your Understanding
645
+
646
+ > **Question:** In an event-driven architecture, which pattern guarantees that messages are never permanently lost if a downstream consumer crashes?
647
+
648
+ - **A.** Direct HTTP POST call with a short 2-second timeout
649
+ - **B.** Persistent Message Broker with Dead-Letter Queue (DLQ) & retry policy
650
+ - **C.** In-memory client RAM cache without disk persistence
651
+ - **D.** Discarding failed packets and prompting the user to re-submit
652
+
653
+ <!--
654
+ Presenter Notes:
655
+ - Give students 30 seconds to vote on option A, B, C, or D.
656
+ - Correct answer: B.
657
+ - Explain why options A and C introduce catastrophic data loss in production.
658
+ -->`
659
+ },
660
+ {
661
+ id: "tiered-practice-3cards",
662
+ name: "Tiered Differentiation (Bronze / Silver / Gold)",
663
+ category: "content",
664
+ description: "Three progressive competency tiers allowing self-paced learning acceleration.",
665
+ layout: {
666
+ boxes: [
667
+ {
668
+ id: "heading",
669
+ target: "h2",
670
+ pos: [80, 45, 1120, 65],
671
+ fontSize: "1.9rem"
672
+ },
673
+ {
674
+ id: "tier-bronze",
675
+ target: ".columns-3 > div:nth-child(1)",
676
+ pos: [80, 140, 350, 520]
677
+ },
678
+ {
679
+ id: "tier-silver",
680
+ target: ".columns-3 > div:nth-child(2)",
681
+ pos: [465, 140, 350, 520]
682
+ },
683
+ {
684
+ id: "tier-gold",
685
+ target: ".columns-3 > div:nth-child(3)",
686
+ pos: [850, 140, 350, 520]
687
+ }
688
+ ]
689
+ },
690
+ markdownSnippet: `<!-- layout:
691
+ boxes:
692
+ - id: heading
693
+ target: h2
694
+ pos: [80, 45, 1120, 65]
695
+ fontSize: 1.9rem
696
+ - id: tier-bronze
697
+ target: '.columns-3 > div:nth-child(1)'
698
+ pos: [80, 140, 350, 520]
699
+ - id: tier-silver
700
+ target: '.columns-3 > div:nth-child(2)'
701
+ pos: [465, 140, 350, 520]
702
+ - id: tier-gold
703
+ target: '.columns-3 > div:nth-child(3)'
704
+ pos: [850, 140, 350, 520]
705
+ -->
706
+
707
+ ## \u{1F6E0}\uFE0F Hands-On Challenge: 3-Tier Differentiation
708
+
709
+ <div class="columns-3">
710
+ <div>
711
+
712
+ ### \u{1F949} Bronze Tier
713
+ - Implement basic handler logic
714
+ - Pass 3 baseline unit tests
715
+ - *Goal: Foundational mastery*
716
+
717
+ </div>
718
+ <div>
719
+
720
+ ### \u{1F948} Silver Tier
721
+ - Add boundary error handling
722
+ - Enforce O(N) memory complexity
723
+ - *Goal: Production-ready code*
724
+
725
+ </div>
726
+ <div>
727
+
728
+ ### \u{1F947} Gold Tier
729
+ - Design distributed retry queue
730
+ - Add 95% automated test coverage
731
+ - *Goal: Architectural leadership*
732
+
733
+ </div>
734
+ </div>
735
+
736
+ <!--
737
+ Presenter Notes:
738
+ - All learners begin at Bronze to establish baseline competency.
739
+ - Accelerate self-directed learners to Silver and Gold as they complete each tier.
740
+ -->`
741
+ },
742
+ {
743
+ id: "agenda-timeline",
744
+ name: "Session Agenda & Milestones",
745
+ category: "content",
746
+ description: "Structured time-budgeted agenda mapping stages to measurable deliverables.",
747
+ layout: {
748
+ boxes: [
749
+ {
750
+ id: "heading",
751
+ target: "h2",
752
+ pos: [80, 45, 1120, 65],
753
+ fontSize: "1.9rem"
754
+ },
755
+ {
756
+ id: "table-box",
757
+ target: "table",
758
+ pos: [80, 140, 1120, 520]
759
+ }
760
+ ]
761
+ },
762
+ markdownSnippet: `<!-- layout:
763
+ boxes:
764
+ - id: heading
765
+ target: h2
766
+ pos: [80, 45, 1120, 65]
767
+ fontSize: 1.9rem
768
+ - id: table-box
769
+ target: table
770
+ pos: [80, 140, 1120, 520]
771
+ -->
772
+
773
+ ## \u{1F5FA}\uFE0F Milestone Roadmap & Time Budget
774
+
775
+ | Allocated Time | Session Stage | Core Learning Focus | Deliverable Milestone |
776
+ |:---:|---|---|---|
777
+ | **05 mins** | Warm-Up | Real-World Scenario & Context | Identify system bottleneck |
778
+ | **15 mins** | Concept Discovery | Core Architectural Patterns | Deconstruct message queue models |
779
+ | **20 mins** | Hands-On Lab | Tiered Code Implementation | Complete Bronze + Silver tasks |
780
+ | **05 mins** | Wrap-Up | Formative Checkpoint & Debrief | Consolidate key principles |
781
+
782
+ <!--
783
+ Presenter Notes:
784
+ - Walk through the time budget so students understand expectations and pacing.
785
+ -->`
786
+ },
787
+ {
788
+ id: "takeaways-summary",
789
+ name: "Key Takeaways & Wrap-up",
790
+ category: "content",
791
+ description: "Three memorable synthesis takeaways with actionable next steps.",
792
+ layout: {
793
+ boxes: [
794
+ {
795
+ id: "heading",
796
+ target: "h2",
797
+ pos: [80, 50, 1120, 70],
798
+ fontSize: "2rem"
799
+ },
800
+ {
801
+ id: "list-box",
802
+ target: "ol",
803
+ pos: [80, 150, 1120, 340],
804
+ fontSize: "1.25rem"
805
+ },
806
+ {
807
+ id: "callout-next",
808
+ target: "blockquote",
809
+ pos: [80, 520, 1120, 140],
810
+ fontSize: "1.1rem"
811
+ }
812
+ ]
813
+ },
814
+ markdownSnippet: `<!-- layout:
815
+ boxes:
816
+ - id: heading
817
+ target: h2
818
+ pos: [80, 50, 1120, 70]
819
+ fontSize: 2rem
820
+ - id: list-box
821
+ target: ol
822
+ pos: [80, 150, 1120, 340]
823
+ fontSize: 1.25rem
824
+ - id: callout-next
825
+ target: blockquote
826
+ pos: [80, 520, 1120, 140]
827
+ fontSize: 1.1rem
828
+ -->
829
+
830
+ ## \u{1F3C1} Key Takeaways & Action Items
831
+
832
+ 1. **Decouple Before Scaling:** Separate producer rate from consumer processing capacity.
833
+ 2. **Design for Failure:** Always configure retries, backoff intervals, and dead-letter queues.
834
+ 3. **Measure End-to-End:** Track P99 latency and error rates across all distributed boundaries.
835
+
836
+ > \u{1F4DD} **Next Action Item:** Complete the Silver Tier refactoring challenge before our next peer-review session.
837
+
838
+ <!--
839
+ Presenter Notes:
840
+ - Deliver a crisp 2-minute wrap-up reinforcing the 3 core takeaways.
841
+ - Acknowledge strong peer collaboration during the hands-on lab.
842
+ -->`
843
+ }
844
+ ];
845
+ function getSlideLayoutPresetById(id) {
846
+ return SLIDE_LAYOUT_PRESETS.find((p) => p.id === id);
847
+ }
848
+ function getSlideLayoutPresetsByCategory(category) {
849
+ return SLIDE_LAYOUT_PRESETS.filter((p) => p.category === category);
850
+ }
851
+
852
+ export { SLIDE_LAYOUT_PRESETS, getSlideLayoutPresetById, getSlideLayoutPresetsByCategory, removeSlideElementFromMarkdown, serializeLayoutToComment, splitMarkdownSlides, updateSlideLayoutInMarkdown, updateSlideTextInMarkdown };
853
+ //# sourceMappingURL=chunk-V6X7D44H.js.map
854
+ //# sourceMappingURL=chunk-V6X7D44H.js.map