executable-stories-formatters 0.15.0 → 0.16.0

package/templates/astro-starlight/src/styles/themes/corporate.css

@@ -0,0 +1,83 @@
+@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Mono:wght@400;500&family=Playfair+Display:wght@500;600;700&display=swap');
+
+/* Light mode */
+:root {
+  --sl-font: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  --sl-font-mono: "DM Mono", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
+
+  --sl-color-white: #1a202c;
+  --sl-color-gray-1: #1e293b;
+  --sl-color-gray-2: #334155;
+  --sl-color-gray-3: #64748b;
+  --sl-color-gray-4: #8a8578;
+  --sl-color-gray-5: #d6d0c4;
+  --sl-color-gray-6: #eee9e0;
+  --sl-color-gray-7: #f5f2ed;
+  --sl-color-black: #faf9f7;
+
+  --sl-color-accent-low: rgba(26, 54, 93, 0.12);
+  --sl-color-accent: #1a365d;
+  --sl-color-accent-high: #0f1f3a;
+
+  --sl-shadow-lg: 0 10px 25px -5px rgb(26 54 93 / 0.1), 0 8px 10px -6px rgb(26 54 93 / 0.06);
+
+  --mermaid-theme-primary: #1a365d;
+  --mermaid-theme-primary-text: #ffffff;
+  --mermaid-theme-line: #64748b;
+
+  color-scheme: light;
+}
+
+/* Dark mode */
+[data-theme='dark'] {
+  --sl-color-white: #f1f5f9;
+  --sl-color-gray-1: #e2e8f0;
+  --sl-color-gray-2: #cbd5e1;
+  --sl-color-gray-3: #94a3b8;
+  --sl-color-gray-4: #64748b;
+  --sl-color-gray-5: #334155;
+  --sl-color-gray-6: #1e293b;
+  --sl-color-gray-7: #162033;
+  --sl-color-black: #111827;
+
+  --sl-color-accent-low: rgba(147, 197, 253, 0.15);
+  --sl-color-accent: #93c5fd;
+  --sl-color-accent-high: #dbeafe;
+
+  --sl-shadow-lg: 0 10px 25px -5px rgb(0 0 0 / 0.4), 0 8px 10px -6px rgb(0 0 0 / 0.3);
+
+  --mermaid-theme-primary: #93c5fd;
+  --mermaid-theme-primary-text: #0f172a;
+  --mermaid-theme-line: #94a3b8;
+
+  color-scheme: dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    --sl-color-white: #f1f5f9;
+    --sl-color-gray-1: #e2e8f0;
+    --sl-color-gray-2: #cbd5e1;
+    --sl-color-gray-3: #94a3b8;
+    --sl-color-gray-4: #64748b;
+    --sl-color-gray-5: #334155;
+    --sl-color-gray-6: #1e293b;
+    --sl-color-gray-7: #162033;
+    --sl-color-black: #111827;
+    --sl-color-accent-low: rgba(147, 197, 253, 0.15);
+    --sl-color-accent: #93c5fd;
+    --sl-color-accent-high: #dbeafe;
+    --sl-shadow-lg: 0 10px 25px -5px rgb(0 0 0 / 0.4), 0 8px 10px -6px rgb(0 0 0 / 0.3);
+    --mermaid-theme-primary: #93c5fd;
+    --mermaid-theme-primary-text: #0f172a;
+    --mermaid-theme-line: #94a3b8;
+    color-scheme: dark;
+  }
+}
+
+/* Editorial serif headings — matches HTML corporate theme */
+.sl-markdown-content h1,
+.sl-markdown-content h2 {
+  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
+  font-weight: 600;
+}

package/templates/astro-starlight/src/styles/themes/dashboard.css

@@ -0,0 +1,76 @@
+@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
+
+/* Light mode */
+:root {
+  --sl-font: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  --sl-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
+
+  --sl-color-white: #1a1d24;
+  --sl-color-gray-1: #1f2937;
+  --sl-color-gray-2: #374151;
+  --sl-color-gray-3: #6b7280;
+  --sl-color-gray-4: #8a8f98;
+  --sl-color-gray-5: #d1d5db;
+  --sl-color-gray-6: #e8ebef;
+  --sl-color-gray-7: #f1f3f5;
+  --sl-color-black: #f8f9fb;
+
+  --sl-color-accent-low: rgba(37, 99, 235, 0.12);
+  --sl-color-accent: #2563eb;
+  --sl-color-accent-high: #1d4ed8;
+
+  --sl-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.06);
+
+  --mermaid-theme-primary: #2563eb;
+  --mermaid-theme-primary-text: #ffffff;
+  --mermaid-theme-line: #6b7280;
+
+  color-scheme: light;
+}
+
+/* Dark mode */
+[data-theme='dark'] {
+  --sl-color-white: #e1e4ea;
+  --sl-color-gray-1: #c8ccd4;
+  --sl-color-gray-2: #8a8f98;
+  --sl-color-gray-3: #6b7280;
+  --sl-color-gray-4: #4b5563;
+  --sl-color-gray-5: #2a2d35;
+  --sl-color-gray-6: #1e2028;
+  --sl-color-gray-7: #1a1d24;
+  --sl-color-black: #111318;
+
+  --sl-color-accent-low: rgba(59, 130, 246, 0.18);
+  --sl-color-accent: #3b82f6;
+  --sl-color-accent-high: #93c5fd;
+
+  --sl-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.5), 0 4px 6px -4px rgb(0 0 0 / 0.4);
+
+  --mermaid-theme-primary: #3b82f6;
+  --mermaid-theme-primary-text: #111318;
+  --mermaid-theme-line: #6b7280;
+
+  color-scheme: dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    --sl-color-white: #e1e4ea;
+    --sl-color-gray-1: #c8ccd4;
+    --sl-color-gray-2: #8a8f98;
+    --sl-color-gray-3: #6b7280;
+    --sl-color-gray-4: #4b5563;
+    --sl-color-gray-5: #2a2d35;
+    --sl-color-gray-6: #1e2028;
+    --sl-color-gray-7: #1a1d24;
+    --sl-color-black: #111318;
+    --sl-color-accent-low: rgba(59, 130, 246, 0.18);
+    --sl-color-accent: #3b82f6;
+    --sl-color-accent-high: #93c5fd;
+    --sl-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.5), 0 4px 6px -4px rgb(0 0 0 / 0.4);
+    --mermaid-theme-primary: #3b82f6;
+    --mermaid-theme-primary-text: #111318;
+    --mermaid-theme-line: #6b7280;
+    color-scheme: dark;
+  }
+}

package/templates/astro-starlight/src/styles/themes/default.css

@@ -0,0 +1,86 @@
+@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');
+
+/*
+ * Starlight variable semantics:
+ *   --sl-color-black -> current-mode background (var(--sl-color-bg))
+ *   --sl-color-white -> current-mode emphasized foreground (headings)
+ *   --sl-color-gray-1 -> most foreground-contrasting gray (text)
+ *   --sl-color-gray-7 -> most background-adjacent gray
+ * Values flip between modes so these names are semantic, not literal.
+ */
+
+/* Light mode (default) */
+:root {
+  --sl-font: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  --sl-font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
+
+  --sl-color-white: hsl(0 0% 9%);
+  --sl-color-gray-1: hsl(0 0% 15%);
+  --sl-color-gray-2: hsl(0 0% 25%);
+  --sl-color-gray-3: hsl(0 0% 45%);
+  --sl-color-gray-4: hsl(0 0% 70%);
+  --sl-color-gray-5: hsl(0 0% 90%);
+  --sl-color-gray-6: hsl(0 0% 96.5%);
+  --sl-color-gray-7: hsl(0 0% 98.5%);
+  --sl-color-black: hsl(0 0% 100%);
+
+  --sl-color-accent-low: hsl(145 55% 92%);
+  --sl-color-accent: hsl(145 63% 42%);
+  --sl-color-accent-high: hsl(145 63% 30%);
+
+  --sl-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.05);
+
+  --mermaid-theme-primary: hsl(145 63% 42%);
+  --mermaid-theme-primary-text: #ffffff;
+  --mermaid-theme-line: hsl(0 0% 45%);
+
+  color-scheme: light;
+}
+
+/* Dark mode (explicit) */
+[data-theme='dark'] {
+  --sl-color-white: hsl(0 0% 100%);
+  --sl-color-gray-1: hsl(0 0% 92%);
+  --sl-color-gray-2: hsl(0 0% 85%);
+  --sl-color-gray-3: hsl(0 0% 55%);
+  --sl-color-gray-4: hsl(0 0% 45%);
+  --sl-color-gray-5: hsl(0 0% 22%);
+  --sl-color-gray-6: hsl(0 0% 16%);
+  --sl-color-gray-7: hsl(0 0% 13%);
+  --sl-color-black: hsl(0 0% 7%);
+
+  --sl-color-accent-low: hsl(145 35% 14%);
+  --sl-color-accent: hsl(145 63% 55%);
+  --sl-color-accent-high: hsl(145 63% 75%);
+
+  --sl-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.45), 0 4px 6px -4px rgb(0 0 0 / 0.35);
+
+  --mermaid-theme-primary: hsl(145 63% 55%);
+  --mermaid-theme-primary-text: hsl(0 0% 7%);
+  --mermaid-theme-line: hsl(0 0% 55%);
+
+  color-scheme: dark;
+}
+
+/* Dark mode (system preference, when user hasn't explicitly chosen light) */
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    --sl-color-white: hsl(0 0% 100%);
+    --sl-color-gray-1: hsl(0 0% 92%);
+    --sl-color-gray-2: hsl(0 0% 85%);
+    --sl-color-gray-3: hsl(0 0% 55%);
+    --sl-color-gray-4: hsl(0 0% 45%);
+    --sl-color-gray-5: hsl(0 0% 22%);
+    --sl-color-gray-6: hsl(0 0% 16%);
+    --sl-color-gray-7: hsl(0 0% 13%);
+    --sl-color-black: hsl(0 0% 7%);
+    --sl-color-accent-low: hsl(145 35% 14%);
+    --sl-color-accent: hsl(145 63% 55%);
+    --sl-color-accent-high: hsl(145 63% 75%);
+    --sl-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.45), 0 4px 6px -4px rgb(0 0 0 / 0.35);
+    --mermaid-theme-primary: hsl(145 63% 55%);
+    --mermaid-theme-primary-text: hsl(0 0% 7%);
+    --mermaid-theme-line: hsl(0 0% 55%);
+    color-scheme: dark;
+  }
+}

package/templates/astro-starlight/src/styles/themes/minimal.css

@@ -0,0 +1,87 @@
+@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+Display:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap');
+
+/* Light mode — warm neutral + teal */
+:root {
+  --sl-font: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  --sl-font-mono: "DM Mono", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
+
+  --sl-color-white: #2d2d2d;
+  --sl-color-gray-1: #3a3836;
+  --sl-color-gray-2: #4a4642;
+  --sl-color-gray-3: #8a8680;
+  --sl-color-gray-4: #b0a898;
+  --sl-color-gray-5: #e8e4de;
+  --sl-color-gray-6: #f0ece6;
+  --sl-color-gray-7: #f5f3ef;
+  --sl-color-black: #fdfcfa;
+
+  --sl-color-accent-low: rgba(42, 157, 143, 0.12);
+  --sl-color-accent: #2a9d8f;
+  --sl-color-accent-high: #1f7a6e;
+
+  --sl-shadow-lg: none;
+
+  --mermaid-theme-primary: #2a9d8f;
+  --mermaid-theme-primary-text: #ffffff;
+  --mermaid-theme-line: #8a8680;
+
+  color-scheme: light;
+}
+
+/* Dark mode */
+[data-theme='dark'] {
+  --sl-color-white: #e0ddd8;
+  --sl-color-gray-1: #c0bdb8;
+  --sl-color-gray-2: #8a8680;
+  --sl-color-gray-3: #6b6860;
+  --sl-color-gray-4: #4a4642;
+  --sl-color-gray-5: #3a3836;
+  --sl-color-gray-6: #2e2e2a;
+  --sl-color-gray-7: #222220;
+  --sl-color-black: #1a1a18;
+
+  --sl-color-accent-low: rgba(61, 188, 173, 0.15);
+  --sl-color-accent: #3dbcad;
+  --sl-color-accent-high: #7fd9cd;
+
+  --sl-shadow-lg: none;
+
+  --mermaid-theme-primary: #3dbcad;
+  --mermaid-theme-primary-text: #1a1a18;
+  --mermaid-theme-line: #8a8680;
+
+  color-scheme: dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    --sl-color-white: #e0ddd8;
+    --sl-color-gray-1: #c0bdb8;
+    --sl-color-gray-2: #8a8680;
+    --sl-color-gray-3: #6b6860;
+    --sl-color-gray-4: #4a4642;
+    --sl-color-gray-5: #3a3836;
+    --sl-color-gray-6: #2e2e2a;
+    --sl-color-gray-7: #222220;
+    --sl-color-black: #1a1a18;
+    --sl-color-accent-low: rgba(61, 188, 173, 0.15);
+    --sl-color-accent: #3dbcad;
+    --sl-color-accent-high: #7fd9cd;
+    --sl-shadow-lg: none;
+    --mermaid-theme-primary: #3dbcad;
+    --mermaid-theme-primary-text: #1a1a18;
+    --mermaid-theme-line: #8a8680;
+    color-scheme: dark;
+  }
+}
+
+.sl-markdown-content h1,
+.sl-markdown-content h2 {
+  font-family: "Noto Serif Display", "DM Sans", serif;
+  font-weight: 600;
+}
+
+.sl-markdown-content h3,
+.sl-markdown-content h4 {
+  font-family: "DM Sans", sans-serif;
+}

package/templates/astro-starlight/src/styles/themes/playful.css

@@ -0,0 +1,77 @@
+@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&family=Source+Sans+3:wght@400;500;600&family=Source+Code+Pro:wght@400;500&display=swap');
+
+/* Light mode — warm cream + coral */
+:root {
+  --sl-font: "Source Sans 3", "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  --sl-font-mono: "Source Code Pro", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
+
+  --sl-color-white: #3d3229;
+  --sl-color-gray-1: #544639;
+  --sl-color-gray-2: #6b5b4e;
+  --sl-color-gray-3: #8a7a6a;
+  --sl-color-gray-4: #b0a090;
+  --sl-color-gray-5: #e6d5c3;
+  --sl-color-gray-6: #f5ebe0;
+  --sl-color-gray-7: #fdf0e6;
+  --sl-color-black: #fef7f0;
+
+  --sl-color-accent-low: rgba(224, 122, 95, 0.18);
+  --sl-color-accent: #e07a5f;
+  --sl-color-accent-high: #b05740;
+
+  --sl-shadow-lg: 0 10px 20px -4px rgb(61 50 41 / 0.1), 0 4px 8px -4px rgb(61 50 41 / 0.05);
+
+  --mermaid-theme-primary: #e07a5f;
+  --mermaid-theme-primary-text: #ffffff;
+  --mermaid-theme-line: #6b5b4e;
+
+  color-scheme: light;
+  --sl-border-radius: 1rem;
+}
+
+/* Dark mode */
+[data-theme='dark'] {
+  --sl-color-white: #f0e6dc;
+  --sl-color-gray-1: #eae0d6;
+  --sl-color-gray-2: #d4c4b4;
+  --sl-color-gray-3: #a89585;
+  --sl-color-gray-4: #8a7a6a;
+  --sl-color-gray-5: #4a3d32;
+  --sl-color-gray-6: #332920;
+  --sl-color-gray-7: #2a2118;
+  --sl-color-black: #1e1814;
+
+  --sl-color-accent-low: rgba(232, 149, 125, 0.2);
+  --sl-color-accent: #e8957d;
+  --sl-color-accent-high: #f5b8a2;
+
+  --sl-shadow-lg: 0 10px 20px -4px rgb(0 0 0 / 0.4), 0 4px 8px -4px rgb(0 0 0 / 0.3);
+
+  --mermaid-theme-primary: #e8957d;
+  --mermaid-theme-primary-text: #1e1814;
+  --mermaid-theme-line: #a89585;
+
+  color-scheme: dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    --sl-color-white: #f0e6dc;
+    --sl-color-gray-1: #eae0d6;
+    --sl-color-gray-2: #d4c4b4;
+    --sl-color-gray-3: #a89585;
+    --sl-color-gray-4: #8a7a6a;
+    --sl-color-gray-5: #4a3d32;
+    --sl-color-gray-6: #332920;
+    --sl-color-gray-7: #2a2118;
+    --sl-color-black: #1e1814;
+    --sl-color-accent-low: rgba(232, 149, 125, 0.2);
+    --sl-color-accent: #e8957d;
+    --sl-color-accent-high: #f5b8a2;
+    --sl-shadow-lg: 0 10px 20px -4px rgb(0 0 0 / 0.4), 0 4px 8px -4px rgb(0 0 0 / 0.3);
+    --mermaid-theme-primary: #e8957d;
+    --mermaid-theme-primary-text: #1e1814;
+    --mermaid-theme-line: #a89585;
+    color-scheme: dark;
+  }
+}

package/templates/astro-starlight/src/styles/themes/terminal.css

@@ -0,0 +1,77 @@
+@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap');
+
+/* Light mode — paper white with green */
+:root {
+  --sl-font: "JetBrains Mono", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
+  --sl-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
+
+  --sl-color-white: #1a1a1a;
+  --sl-color-gray-1: #2a2a25;
+  --sl-color-gray-2: #3a3a35;
+  --sl-color-gray-3: #666660;
+  --sl-color-gray-4: #8a8a80;
+  --sl-color-gray-5: #c8c8c0;
+  --sl-color-gray-6: #e0e0d8;
+  --sl-color-gray-7: #eaeae5;
+  --sl-color-black: #f5f5f0;
+
+  --sl-color-accent-low: rgba(0, 138, 69, 0.15);
+  --sl-color-accent: #008a45;
+  --sl-color-accent-high: #005f2f;
+
+  --sl-shadow-lg: none;
+
+  --mermaid-theme-primary: #008a45;
+  --mermaid-theme-primary-text: #f5f5f0;
+  --mermaid-theme-line: #666660;
+
+  color-scheme: light;
+  --sl-border-radius: 0;
+}
+
+/* Dark mode — classic green-on-black */
+[data-theme='dark'] {
+  --sl-color-white: #d4d4d4;
+  --sl-color-gray-1: #c0c0c0;
+  --sl-color-gray-2: #a0a0a0;
+  --sl-color-gray-3: #6b6b6b;
+  --sl-color-gray-4: #555555;
+  --sl-color-gray-5: #2a2a2a;
+  --sl-color-gray-6: #1a1a1a;
+  --sl-color-gray-7: #111111;
+  --sl-color-black: #0a0a0a;
+
+  --sl-color-accent-low: rgba(0, 210, 106, 0.15);
+  --sl-color-accent: #00d26a;
+  --sl-color-accent-high: #5cffa1;
+
+  --sl-shadow-lg: none;
+
+  --mermaid-theme-primary: #00d26a;
+  --mermaid-theme-primary-text: #0a0a0a;
+  --mermaid-theme-line: #6b6b6b;
+
+  color-scheme: dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    --sl-color-white: #d4d4d4;
+    --sl-color-gray-1: #c0c0c0;
+    --sl-color-gray-2: #a0a0a0;
+    --sl-color-gray-3: #6b6b6b;
+    --sl-color-gray-4: #555555;
+    --sl-color-gray-5: #2a2a2a;
+    --sl-color-gray-6: #1a1a1a;
+    --sl-color-gray-7: #111111;
+    --sl-color-black: #0a0a0a;
+    --sl-color-accent-low: rgba(0, 210, 106, 0.15);
+    --sl-color-accent: #00d26a;
+    --sl-color-accent-high: #5cffa1;
+    --sl-shadow-lg: none;
+    --mermaid-theme-primary: #00d26a;
+    --mermaid-theme-primary-text: #0a0a0a;
+    --mermaid-theme-line: #6b6b6b;
+    color-scheme: dark;
+  }
+}

package/templates/astro-starlight/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "extends": "astro/tsconfigs/strict",
+  "compilerOptions": {
+    "types": ["node"],
+    "rootDir": "./src",
+    "baseUrl": ".",
+    "paths": {
+      "@components/*": ["src/components/*"]
+    }
+  },
+  "include": [".astro/types.d.ts", "**/*"],
+  "exclude": ["dist"]
+}