@hagicode/hagilight-starlight 0.5.2 → 0.5.3-dev.69.1.c2ff844

package/ArticlePromotion.astro

@@ -1,50 +1,154 @@
 ---
-import heroImage from './assets/light-main.png';
+import { Image } from 'astro:assets';
+import { resolveSiteLinks } from '@hagicode/hagilight-core/links';
 import { getArticlePromotionCopy } from './dist/article-promotion.js';
+import {
+  resolveMicrosoftStoreBadgeLanguage,
+  resolveMicrosoftStoreProductId,
+} from './dist/windows-download.js';
+import heroes from './assets/showcase/heroes.webp';
+import pillarEfficient from './assets/showcase/pillar-efficient.svg';
+import pillarFun from './assets/showcase/pillar-fun.svg';
+import pillarSmart from './assets/showcase/pillar-smart.svg';
+import proposalWorkflow from './assets/showcase/proposal-workflow.webp';
+import workbench from './assets/showcase/workbench.webp';
 
 const { lang } = Astro.props;
 const copy = getArticlePromotionCopy(lang);
+const siteLinks = resolveSiteLinks(lang);
+const linkHref = (id: string, fallback: string) =>
+  [...siteLinks.header, ...siteLinks.quick].find((link) => link.id === id)?.href ?? fallback;
+const homeHref = linkHref('home', 'https://www.hagicode.com/');
+const docsHref = linkHref('productDocs', 'https://docs.hagicode.com/');
+const storeHref = linkHref('microsoftStore', 'https://apps.microsoft.com/detail/9N3PM0N3SVDW');
+const downloadsHref = linkHref('downloadClient', 'https://www.hagicode.com/');
+const storeProductId = resolveMicrosoftStoreProductId(storeHref);
+const badgeLanguage = resolveMicrosoftStoreBadgeLanguage(lang);
+
+// Keyed by the ids in assets/showcase/manifest.json and in the copy catalog's gallery.
+const galleryImages: Record<string, ImageMetadata> = {
+  workbench,
+  'proposal-workflow': proposalWorkflow,
+  heroes,
+};
+const pillarIcons: Record<string, ImageMetadata> = {
+  smart: pillarSmart,
+  efficient: pillarEfficient,
+  fun: pillarFun,
+};
+const gallery = copy.gallery.flatMap((item) => {
+  const image = galleryImages[item.id];
+  return image ? [{ ...item, image }] : [];
+});
 ---
 
 <section class="hagilight-article-promotion" aria-labelledby="hagilight-article-promotion-title">
-  <div>
+  <div class="hagilight-article-promotion__intro">
     <h2 id="hagilight-article-promotion-title">{copy.title}</h2>
     <p>{copy.lead}</p>
     <p>{copy.subheadline}</p>
   </div>
-  <img
-    src={heroImage.src}
-    alt={copy.imageAlt}
-    width={heroImage.width}
-    height={heroImage.height}
-    loading="lazy"
-    decoding="async"
-  />
-  <ul aria-label={copy.title}>
+
+  <div class="hagilight-article-promotion__actions">
+    <a class="hagilight-article-promotion__cta hagilight-article-promotion__cta--primary" href={homeHref}>
+      {copy.visitLabel}
+    </a>
+    <a class="hagilight-article-promotion__cta hagilight-article-promotion__cta--secondary" href={docsHref}>
+      {copy.docsLabel}
+    </a>
+    <div class="hagilight-article-promotion__windows">
+      <div class="hagilight-article-promotion__windows-header">
+        <span class="hagilight-article-promotion__windows-label">{copy.windowsLabel}</span>
+        <a class="hagilight-article-promotion__downloads" href={downloadsHref}>{copy.allDownloadsLabel}</a>
+      </div>
+      <ms-store-badge
+        productid={storeProductId}
+        productname="HagiCode"
+        window-mode="direct"
+        theme="auto"
+        size="large"
+        animation="on"
+        language={badgeLanguage}
+        aria-label={copy.windowsStoreAriaLabel}
+        title={copy.windowsStoreAriaLabel}
+      >
+        <a
+          class="hagilight-article-promotion__store-fallback"
+          href={storeHref}
+          aria-label={copy.windowsStoreAriaLabel}
+          title={copy.windowsStoreAriaLabel}
+        >{copy.windowsStoreLabel}</a>
+      </ms-store-badge>
+    </div>
+  </div>
+
+  <div class="hagilight-article-promotion__gallery-block">
+    <h3 id="hagilight-article-promotion-gallery-title">{copy.galleryHeading}</h3>
+    <ul class="hagilight-article-promotion__gallery" aria-labelledby="hagilight-article-promotion-gallery-title">
+      {gallery.map((item) => (
+        <li>
+          <figure>
+            <Image
+              src={item.image}
+              alt={item.alt}
+              width={item.image.width}
+              height={item.image.height}
+              widths={[480, 800, item.image.width]}
+              sizes="(min-width: 50rem) 720px, 100vw"
+              loading="lazy"
+              decoding="async"
+              fetchpriority="low"
+            />
+            <figcaption>{item.caption}</figcaption>
+          </figure>
+        </li>
+      ))}
+    </ul>
+  </div>
+
+  <ul class="hagilight-article-promotion__features" aria-label={copy.title}>
     {copy.features.map((feature) => (
       <li>
+        <span
+          class="hagilight-article-promotion__icon"
+          aria-hidden="true"
+          style={`--hagilight-pillar-icon: url(${pillarIcons[feature.id]?.src})`}
+        ></span>
         <strong>{feature.label}</strong>
         <span>{feature.description}</span>
       </li>
     ))}
   </ul>
-  <a href="https://www.hagicode.com/">{copy.visitLabel}</a>
+
+  <div class="hagilight-article-promotion__share">
+    <h3 id="hagilight-article-promotion-share-title">{copy.shareLabel}</h3>
+    <p class="hagilight-article-promotion__share-text">{copy.shareText}</p>
+  </div>
 </section>
+<script type="module" src="https://get.microsoft.com/badge/ms-store-badge.bundled.js" is:inline></script>
 
 <style>
   .hagilight-article-promotion {
     display: grid;
-    gap: 1rem;
+    grid-template-columns: minmax(0, 1fr);
+    gap: 1.5rem;
     margin: 2rem auto;
     padding: clamp(1rem, 3vw, 1.75rem);
     border: 1px solid var(--sl-color-gray-5);
-    border-radius: var(--sl-radius-lg);
+    border-radius: var(--sl-radius-lg, 0.75rem);
     background: var(--sl-color-bg-nav);
     color: var(--sl-color-text);
   }
 
-  .hagilight-article-promotion h2 {
+  .hagilight-article-promotion h2,
+  .hagilight-article-promotion h3 {
     margin: 0;
+    color: var(--sl-color-white);
+    line-height: 1.25;
+  }
+
+  .hagilight-article-promotion h3 {
+    font-size: var(--sl-text-lg, 1.125rem);
   }
 
   .hagilight-article-promotion p {
@@ -52,57 +156,179 @@ const copy = getArticlePromotionCopy(lang);
     line-height: 1.6;
   }
 
+  .hagilight-article-promotion ul {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+
+  .hagilight-article-promotion a:focus-visible {
+    outline: 2px solid var(--sl-color-text-accent);
+    outline-offset: 3px;
+  }
+
+  .hagilight-article-promotion__actions {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: 0.75rem 1rem;
+  }
+
+  .hagilight-article-promotion__cta {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 2.75rem;
+    padding: 0.5rem 1rem;
+    border: 1px solid var(--sl-color-text-accent);
+    border-radius: var(--sl-radius-sm, 0.375rem);
+    font-weight: 700;
+    text-decoration: none;
+  }
+
+  .hagilight-article-promotion__cta--primary {
+    background: var(--sl-color-text-accent);
+    color: var(--sl-color-bg);
+  }
+
+  .hagilight-article-promotion__cta--secondary {
+    background: transparent;
+    color: var(--sl-color-text-accent);
+  }
+
+  .hagilight-article-promotion__cta:hover {
+    filter: brightness(1.08);
+  }
+
+  .hagilight-article-promotion__windows {
+    display: grid;
+    gap: 0.25rem;
+    width: 100%;
+    padding: 0.25rem 0.75rem 0.75rem;
+    border: 1px solid var(--sl-color-gray-5);
+    border-radius: var(--sl-radius-md, 0.5rem);
+    background: var(--sl-color-gray-6);
+  }
+
+  .hagilight-article-promotion__windows-header {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0 1rem;
+  }
+
+  .hagilight-article-promotion__windows-label {
+    font-weight: 600;
+  }
+
+  /* Reserve the large badge's height (104px) so it replaces the fallback link without a layout jump. */
+  .hagilight-article-promotion__windows ms-store-badge {
+    display: inline-flex;
+    align-items: center;
+    justify-self: start;
+    max-width: 100%;
+    min-height: 6.5rem;
+  }
+
+  /* Keep the badge's fixed height and shrink it to the slot on narrow screens without distortion. */
+  .hagilight-article-promotion__windows ms-store-badge::part(img) {
+    max-width: 100%;
+    object-fit: contain;
+    object-position: left center;
+  }
+
+  .hagilight-article-promotion__store-fallback,
+  .hagilight-article-promotion__downloads {
+    display: inline-flex;
+    align-items: center;
+    min-height: 2.75rem;
+    color: var(--sl-color-text-accent);
+    font-weight: 600;
+  }
+
+  .hagilight-article-promotion__gallery-block {
+    display: grid;
+    gap: 0.75rem;
+  }
+
+  .hagilight-article-promotion__gallery {
+    display: grid;
+    gap: 1.25rem;
+  }
+
+  .hagilight-article-promotion figure {
+    display: grid;
+    gap: 0.5rem;
+    margin: 0;
+  }
+
   .hagilight-article-promotion img {
+    display: block;
     width: 100%;
     height: auto;
-    border-radius: var(--sl-radius-md);
+    border: 1px solid var(--sl-color-gray-5);
+    border-radius: var(--sl-radius-md, 0.5rem);
   }
 
-  .hagilight-article-promotion ul {
+  .hagilight-article-promotion figcaption {
+    color: var(--sl-color-gray-2);
+    font-size: var(--sl-text-sm, 0.875rem);
+    line-height: 1.5;
+  }
+
+  .hagilight-article-promotion__features {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
     gap: 0.75rem;
-    padding: 0;
-    list-style: none;
   }
 
-  .hagilight-article-promotion li {
+  .hagilight-article-promotion__features li {
     display: grid;
+    align-content: start;
     gap: 0.5rem;
+    min-width: 0;
     padding: 0.75rem;
     border: 1px solid var(--sl-color-gray-5);
-    border-radius: var(--sl-radius-md);
+    border-radius: var(--sl-radius-md, 0.5rem);
   }
 
-  .hagilight-article-promotion li strong {
+  .hagilight-article-promotion__features strong {
     color: var(--sl-color-text-accent);
   }
 
-  .hagilight-article-promotion > a {
-    display: inline-flex;
-    justify-self: start;
-    align-items: center;
-    min-height: 2.75rem;
-    padding: 0.5rem 1rem;
-    border-radius: var(--sl-radius-sm);
+  .hagilight-article-promotion__icon {
+    width: 2rem;
+    height: 2rem;
     background: var(--sl-color-text-accent);
-    color: var(--sl-color-bg);
-    font-weight: 700;
-    text-decoration: none;
+    mask: var(--hagilight-pillar-icon) center / contain no-repeat;
+    -webkit-mask: var(--hagilight-pillar-icon) center / contain no-repeat;
   }
 
-  .hagilight-article-promotion > a:hover {
-    filter: brightness(1.08);
+  .hagilight-article-promotion__share {
+    display: grid;
+    gap: 0.5rem;
   }
 
-  .hagilight-article-promotion > a:focus-visible {
-    outline: 2px solid var(--sl-color-text-accent);
-    outline-offset: 3px;
+  .hagilight-article-promotion__share-text {
+    margin: 0;
+    padding: 0.75rem 1rem;
+    border: 1px dashed var(--sl-color-gray-4);
+    border-radius: var(--sl-radius-md, 0.5rem);
+    background: var(--sl-color-bg);
+    overflow-wrap: anywhere;
+    user-select: all;
   }
 
   @media (max-width: 30rem) {
-    .hagilight-article-promotion ul {
+    .hagilight-article-promotion__features {
       grid-template-columns: 1fr;
     }
+
+    .hagilight-article-promotion__actions {
+      flex-direction: column;
+      flex-wrap: nowrap;
+      align-items: stretch;
+    }
   }
 </style>

package/README.md

@@ -37,6 +37,60 @@ By default the plugin replaces Starlight's light/dark toggle with a theme picker
 hagilight({ themes: { enabled: false } })
 ```
 
+### HagiCode showcase
+
+After the body (and any translation notice) of every documentation article, the plugin renders a static HagiCode showcase: a headline and lead, calls to action to the website and the documentation, a Windows download button, a three-image gallery with captions, three pillar cards (Smart, Efficient, Fun), and a selectable, copy-ready share sentence. All text is localized for the ten published locales (`en-US`, `zh-CN`, `zh-Hant`, `ja-JP`, `ko-KR`, `de-DE`, `fr-FR`, `es-ES`, `pt-BR`, `ru-RU`) and falls back to English for any other language. Links come from the same locale-aware catalog as the footer.
+
+Turn it off for the whole site, or override it per article:
+
+```js
+hagilight({ hagicodePromotion: { enabled: false } })
+```
+
+```md
+---
+title: An article without the showcase
+hagicodePromotion: false
+---
+```
+
+The floating banner is a separate option (`promoto`).
+
+#### Reuse the copy
+
+`@hagicode/hagilight-starlight/showcase` returns the same read-only copy, including the share sentence, so sibling sites can show identical wording:
+
+```js
+import { getShowcaseCopy, showcaseLocales } from '@hagicode/hagilight-starlight/showcase';
+
+const copy = getShowcaseCopy('ja-JP'); // English copy for any unsupported locale
+copy.shareText; // one sentence that ends with https://www.hagicode.com/
+```
+
+The catalog is frozen; changing a returned object throws.
+
+#### Windows download button and the Microsoft badge script
+
+The Windows button follows the official HagiCode website and documentation: the `<ms-store-badge>` element for product `9N3PM0N3SVDW` (`window-mode="direct"`, `theme="auto"`, `size="large"`, badge language matching the page locale). Inside it sits a plain "Get it from Microsoft Store" link to the Store listing, and next to it an "All downloads" link to the localized downloads page for other platforms. The store URL and the downloads URL come from `@hagicode/hagilight-core` (`microsoftStore`, `downloadClient`).
+
+This is the only script the showcase loads: `https://get.microsoft.com/badge/ms-store-badge.bundled.js`, as a module script. It only draws the badge. If your content security policy blocks it, or the reader is offline or blocks third-party scripts, the plain Store link stays visible and works, and nothing else changes. To use the badge, allow `get.microsoft.com` in `script-src`. The loader is emitted once per page, and only when the showcase is enabled. There is no first-party script, no operating-system detection, and no Steam link (the Steam app is retired).
+
+#### Assets and image traffic
+
+The gallery images and pillar icons live in `assets/showcase/`, with a provenance record in `assets/showcase/manifest.json`. Each entry states its kind (`sourced` from the HagiCode web app or documentation, a hand-authored `svg`, or a `generated` illustration), its source path or generation record (tool, prompt, parameters, date), the crop and conversion applied, its size, and the audit verdict. Nothing is fetched from the product sites at build or read time.
+
+Every asset passes the same audit before it is committed: the current `HagiCode` brand, no Steam or other retired-channel content, no third-party promotion, no credentials, private repository names, or personal data, and rasters at least 1200 px wide. A removable offending region may be cropped out, and the crop is recorded. Pick images in this order to keep traffic low: an audited existing image converted to WebP, then a hand-authored SVG, then a newly generated raster only when neither fits. Generated art is an illustration, never a replica of the product UI, contains no text or logos, is captioned as an illustration, is reviewed by a person, and records its prompt and parameters (never credentials). Generation is an authoring step; the package never calls a generator.
+
+Budgets, enforced by `npm test`: 768 KiB for all showcase images together, 200 KiB per raster (WebP only), and 8 KiB per SVG. Images are served through Astro's image pipeline as responsive, content-hashed files, load lazily with low priority, and sit after the article body, so a reader who does not reach the end downloads none of them.
+
+#### Keep it in sync
+
+The copy and assets mirror `repos/web` and `repos/docs` in the HagiCode monorepo, which this package never edits.
+
+- **Copy:** edit `src/article-promotion-copy/<locale>.ts` (every locale must keep the same fields, feature ids, and gallery ids). Terminology is pinned in `GLOSSARY` in `src/article-promotion-copy/index.ts`, seeded from the product locale files in `repos/web/src/locales/<locale>/`. `HagiCode`, `OpenSpec`, `Hero Dungeon`, `Microsoft Store`, and `Windows` are never translated.
+- **Images:** audit the candidate, crop and convert it to WebP, add or update its `manifest.json` entry, register it in the `galleryImages` map in `ArticlePromotion.astro`, and add a caption and text alternative in every locale. `npm test` checks that the manifest, the files, the component registry, and the copy agree.
+- **Badge:** the product id is parsed from the Store URL and the badge language map lives in `src/windows-download.ts`. Re-check both against `repos/docs/src/components/MicrosoftStoreBadge.tsx` and the official site when the Store listing or the supported languages change.
+
 The plugin footer and direct `/Footer` and `/PromotoFooter` components append
 the literal `Powered By hagilight-starlight@<version>`. The version comes from
 this package's own manifest at build time, not from Astro or Starlight.

package/assets/showcase/manifest.json

@@ -0,0 +1,118 @@
+{
+  "schemaVersion": 1,
+  "budgets": {
+    "totalKiB": 768,
+    "rasterKiB": 200,
+    "svgKiB": 8
+  },
+  "assets": [
+    {
+      "id": "workbench",
+      "kind": "sourced",
+      "file": "workbench.webp",
+      "width": 1600,
+      "height": 845,
+      "bytes": 57630,
+      "source": {
+        "repo": "docs",
+        "path": "src/content/docs/img/screenshots/shared/kanban-view/original.png"
+      },
+      "transforms": [
+        "crop 2015x1064+0+0 of the 3839x2159 original (top-left: header, session rail, Pending/In Progress/Archived columns)",
+        "resize to 1600 px wide",
+        "webp quality 90"
+      ],
+      "audit": {
+        "verdict": "pass-after-crop",
+        "checkedOn": "2026-10-08",
+        "notes": "Current HagiCode brand, English UI with Chinese session titles. The crop removes the bottom status bar (Steam wishlist strip) and the Pending card whose title mentions Steam. No paths, credentials, or personal data in the kept region. The full original fails the audit (retired Steam channel)."
+      }
+    },
+    {
+      "id": "proposal-workflow",
+      "kind": "sourced",
+      "file": "proposal-workflow.webp",
+      "width": 1600,
+      "height": 340,
+      "bytes": 21666,
+      "source": {
+        "repo": "docs",
+        "path": "src/content/docs/img/screenshots/shared/classic-proposal-view/original.png"
+      },
+      "transforms": [
+        "crop 3128x665+670+215 of the 3839x2159 original (proposal stage stepper and the Execution Completed card)",
+        "resize to 1600 px wide",
+        "webp quality 90"
+      ],
+      "audit": {
+        "verdict": "pass-after-crop",
+        "checkedOn": "2026-10-08",
+        "notes": "English UI. The crop drops the session sidebar (Steam in a session title), the status bar (Steam wishlist strip), and the idea folder row, which shows a local user path. The kept region shows only the proposal stage stepper and the Archive Plan action."
+      }
+    },
+    {
+      "id": "heroes",
+      "kind": "sourced",
+      "file": "heroes.webp",
+      "width": 1200,
+      "height": 1111,
+      "bytes": 101748,
+      "source": {
+        "repo": "docs",
+        "path": "src/content/docs/img/screenshots/shared/kanban-view/original.png"
+      },
+      "transforms": [
+        "crop 1302x1205+2035+260 of the 3839x2159 original (Ember Keep hero panel, three hero cards)",
+        "resize to 1200 px wide",
+        "webp quality 88"
+      ],
+      "audit": {
+        "verdict": "pass-after-crop",
+        "checkedOn": "2026-10-08",
+        "notes": "Current HagiCode UI, English panel text with two Chinese hero names. Hero portraits are the product's own art; no third-party brand, no private data, no Steam content in the kept region."
+      }
+    },
+    {
+      "id": "pillar-smart",
+      "kind": "svg",
+      "file": "pillar-smart.svg",
+      "width": 48,
+      "height": 48,
+      "bytes": 271,
+      "transforms": [],
+      "audit": {
+        "verdict": "pass",
+        "checkedOn": "2026-10-08",
+        "notes": "Hand-authored light bulb outline for the Smart card. No text, no logo, no third-party brand. Used as a CSS mask so the Starlight accent color applies."
+      }
+    },
+    {
+      "id": "pillar-efficient",
+      "kind": "svg",
+      "file": "pillar-efficient.svg",
+      "width": 48,
+      "height": 48,
+      "bytes": 281,
+      "transforms": [],
+      "audit": {
+        "verdict": "pass",
+        "checkedOn": "2026-10-08",
+        "notes": "Hand-authored three parallel arrows for the Efficient card. No text, no logo, no third-party brand. Used as a CSS mask so the Starlight accent color applies."
+      }
+    },
+    {
+      "id": "pillar-fun",
+      "kind": "svg",
+      "file": "pillar-fun.svg",
+      "width": 48,
+      "height": 48,
+      "bytes": 269,
+      "transforms": [],
+      "audit": {
+        "verdict": "pass",
+        "checkedOn": "2026-10-08",
+        "notes": "Hand-authored star outline for the Fun card. No text, no logo, no third-party brand. Used as a CSS mask so the Starlight accent color applies."
+      }
+    }
+  ]
+}

package/assets/showcase/pillar-efficient.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48" fill="none" stroke="#000" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M6 14h30M30 8l6 6-6 6"/><path d="M6 24h36M36 18l6 6-6 6"/><path d="M6 34h24M24 28l6 6-6 6"/></svg>

package/assets/showcase/pillar-fun.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48" fill="none" stroke="#000" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M24 6l5.5 12 13 1.5-9.7 8.8 2.7 12.9L24 34l-11.5 7.2 2.7-12.9-9.7-8.8 13-1.5z"/></svg>

package/assets/showcase/pillar-smart.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48" fill="none" stroke="#000" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M17 33c0-3-5-5-5-12a12 12 0 0 1 24 0c0 7-5 9-5 12z"/><path d="M18 39h12M20 44h8"/></svg>

package/dist/article-promotion-copy/de-DE.d.ts

@@ -0,0 +1,34 @@
+declare const _default: {
+    title: string;
+    lead: string;
+    subheadline: string;
+    imageAlt: string;
+    features: ({
+        id: "smart";
+        label: string;
+        description: string;
+    } | {
+        id: "efficient";
+        label: string;
+        description: string;
+    } | {
+        id: "fun";
+        label: string;
+        description: string;
+    })[];
+    visitLabel: string;
+    docsLabel: string;
+    galleryHeading: string;
+    gallery: {
+        id: string;
+        caption: string;
+        alt: string;
+    }[];
+    windowsLabel: string;
+    windowsStoreLabel: string;
+    windowsStoreAriaLabel: string;
+    allDownloadsLabel: string;
+    shareLabel: string;
+    shareText: string;
+};
+export default _default;

package/dist/article-promotion-copy/de-DE.js

@@ -0,0 +1,38 @@
+const workbenchAlt = 'HagiCode-Werkbank mit einem Kanban-Board der Sitzungen in den Spalten Ausstehend, In Bearbeitung und Archiviert.';
+export default {
+    title: 'HagiCode',
+    lead: 'HagiCode ist ein agentischer Coding-Arbeitsplatz: OpenSpec-Workflows planen die Änderung, Multi-Agent-Ausführung setzt sie um, und Hero Dungeon macht den langen Weg sichtbar, bis aus der Idee ausgelieferte Software wird.',
+    subheadline: 'Mit einem intelligenteren, schnelleren und unterhaltsameren agentischen Workflow wird aus Ideen nutzbare Software.',
+    imageAlt: workbenchAlt,
+    features: [
+        { id: 'smart', label: 'Intelligent', description: 'OpenSpec-Workflows machen aus einer Absicht einen umsetzbaren Weg vom Vorschlag über Design und Aufgaben bis zur Auslieferung.' },
+        { id: 'efficient', label: 'Effizient', description: 'Multi-Agent-Ausführung führt Recherche, Umsetzung und Prüfung parallel aus, über mehrere Repositories und die Agent CLIs, die Sie bereits nutzen.' },
+        { id: 'fun', label: 'Unterhaltsam', description: 'Hero Dungeon macht lange Coding-Sitzungen zu einem sichtbaren Abenteuer mit Helden, Fortschritt und Erfolgen.' },
+    ],
+    visitLabel: 'HagiCode besuchen',
+    docsLabel: 'Dokumentation lesen',
+    galleryHeading: 'HagiCode auf einen Blick',
+    gallery: [
+        {
+            id: 'workbench',
+            caption: 'Die Werkbank: alle Sitzungen auf einem Kanban-Board.',
+            alt: workbenchAlt,
+        },
+        {
+            id: 'proposal-workflow',
+            caption: 'Ein Vorschlag wandert von Erstellt über Entwurf und Prüfung bis zu Ausführung und Archiv.',
+            alt: 'Stufenleiste eines HagiCode-Vorschlags von Erstellt bis Archiviert; die Stufe Ausführung abgeschlossen ist hervorgehoben, dazu die Schaltfläche Plan archivieren.',
+        },
+        {
+            id: 'heroes',
+            caption: 'Hero Dungeon: Helden erledigen die Arbeit, Sie behalten Fortschritt, Level und Geschichte im Blick.',
+            alt: 'Bereich Hero Dungeon von HagiCode namens Ember Keep mit drei laufenden Helden samt Level, Fortschritt und Geschichtstext.',
+        },
+    ],
+    windowsLabel: 'Für Windows herunterladen',
+    windowsStoreLabel: 'Im Microsoft Store erhalten',
+    windowsStoreAriaLabel: 'HagiCode im Microsoft Store öffnen',
+    allDownloadsLabel: 'Alle Downloads',
+    shareLabel: 'HagiCode teilen',
+    shareText: 'HagiCode ist ein agentischer Coding-Arbeitsplatz mit OpenSpec-Workflows, Multi-Agent-Ausführung und Hero Dungeon: https://www.hagicode.com/',
+};

package/dist/article-promotion-copy/en-US.d.ts

@@ -0,0 +1,34 @@
+declare const _default: {
+    title: string;
+    lead: string;
+    subheadline: string;
+    imageAlt: string;
+    features: ({
+        id: "smart";
+        label: string;
+        description: string;
+    } | {
+        id: "efficient";
+        label: string;
+        description: string;
+    } | {
+        id: "fun";
+        label: string;
+        description: string;
+    })[];
+    visitLabel: string;
+    docsLabel: string;
+    galleryHeading: string;
+    gallery: {
+        id: string;
+        caption: string;
+        alt: string;
+    }[];
+    windowsLabel: string;
+    windowsStoreLabel: string;
+    windowsStoreAriaLabel: string;
+    allDownloadsLabel: string;
+    shareLabel: string;
+    shareText: string;
+};
+export default _default;