@tenphi/renderer 0.19.0

package/dist/overrides/Hero.astro

@@ -0,0 +1,73 @@
+---
+import DraftContentNotice from "virtual:cookbook/components/DraftContentNotice";
+
+const { data } = Astro.locals.cookbookRoute.entry;
+const { title = data.title, tagline, image, actions = [] } = data.hero ?? {};
+const imageAttributes = {
+  loading: "eager" as const,
+  decoding: "async" as const,
+  fetchpriority: "high" as const,
+  alt: image?.alt ?? "",
+};
+
+let darkImage: { src: string; width: number; height: number } | undefined;
+let lightImage: { src: string; width: number; height: number } | undefined;
+let rawHtml: string | undefined;
+if (image) {
+  if ("file" in image) {
+    darkImage = image.file;
+  } else if ("dark" in image) {
+    darkImage = image.dark;
+    lightImage = image.light;
+  } else {
+    rawHtml = image.html;
+  }
+}
+---
+
+<div class="hero">
+  {
+    darkImage && (
+      <img
+        src={darkImage.src}
+        width={darkImage.width}
+        height={darkImage.height}
+        {...imageAttributes}
+        data-hero-image={lightImage ? "dark" : undefined}
+      />
+    )
+  }
+  {
+    lightImage && (
+      <img
+        src={lightImage.src}
+        width={lightImage.width}
+        height={lightImage.height}
+        {...imageAttributes}
+        data-hero-image="light"
+      />
+    )
+  }
+  {rawHtml && <div class="hero-html" set:html={rawHtml} />}
+  <div class="stack">
+    <div class="copy">
+      <h1 id="_top" data-page-title set:html={title} />
+      {data.draft && <DraftContentNotice />}
+      {tagline && <div class="tagline" set:html={tagline} />}
+    </div>
+    {
+      actions.length > 0 && (
+        <div class="actions">
+          {actions.map(({ link: href, text, variant }) => (
+            <a
+              {href}
+              class:list={["cookbook-link-button", variant ?? "secondary"]}
+            >
+              {text}
+            </a>
+          ))}
+        </div>
+      )
+    }
+  </div>
+</div>

package/dist/overrides/LanguageSelect.astro

@@ -0,0 +1,63 @@
+---
+import { content } from "virtual:cookbook/config";
+import { localeTarget, routeLocale, messages } from "../localization.js";
+import { navigationPath } from "../navigation.js";
+import Icon from "../components/Icon.astro";
+const current = navigationPath(Astro.url.pathname, content.base);
+const selected = routeLocale(current, content);
+const ui = messages(Astro.locals.cookbookRoute.lang, content);
+const options = Object.entries(content.locales ?? {}).flatMap(
+  ([locale, config]) => {
+    const target = localeTarget(current, locale, content.routes, content);
+    const fallback = target && routeLocale(target, content) !== locale;
+    return target
+      ? [
+          {
+            locale,
+            label: `${config.label}${fallback ? ` (${ui.fallback})` : ""}`,
+            href: `${content.base.replace(/\/$/, "")}${target === "/" ? "/" : `${target}/`}`,
+          },
+        ]
+      : [];
+  },
+);
+---
+
+{
+  options.length > 1 && (
+    <cookbook-language-select>
+      <label>
+        <Icon name="translate" class="label-icon" />
+        <span class="sr-only">
+          {Astro.locals.t("languageSelect.accessibleLabel")}
+        </span>
+        <select>
+          {options.map((option) => (
+            <option value={option.href} selected={option.locale === selected}>
+              {option.label}
+            </option>
+          ))}
+        </select>
+        <Icon name="down-caret" class="caret" />
+      </label>
+    </cookbook-language-select>
+  )
+}
+
+<script>
+  class CookbookLanguageSelect extends HTMLElement {
+    connectedCallback() {
+      const select = this.querySelector("select");
+      select?.addEventListener("change", () => {
+        window.location.href = select.value;
+      });
+      window.addEventListener("pageshow", () => {
+        if (select)
+          select.selectedIndex =
+            select.querySelector("option[selected]")?.index ?? 0;
+      });
+    }
+  }
+  if (!customElements.get("cookbook-language-select"))
+    customElements.define("cookbook-language-select", CookbookLanguageSelect);
+</script>

package/dist/overrides/MarkdownContent.astro

@@ -0,0 +1,14 @@
+---
+import { addHeadingPermalinks } from "../markdown/rendered-content.js";
+
+const content = addHeadingPermalinks(await Astro.slots.render("default"));
+---
+
+<div class="cookbook-markdown-content" set:html={content} />
+
+<script>
+  import { initializeHeadingLinks } from "../client/heading-links.js";
+
+  initializeHeadingLinks();
+  document.addEventListener("astro:page-load", initializeHeadingLinks);
+</script>

package/dist/overrides/MobileMenuFooter.astro

@@ -0,0 +1,15 @@
+---
+import LanguageSelect from "virtual:cookbook/components/LanguageSelect";
+import SocialIcons from "virtual:cookbook/components/SocialIcons";
+import { MobileMenuFooterRoot } from "../components/LayoutComponents.js";
+---
+
+<MobileMenuFooterRoot
+  className="td-mobile-preferences"
+  data-tasty-anatomy="MobileMenuFooter"
+>
+  <div class="td-mobile-preferences__social">
+    <SocialIcons />
+  </div>
+  <LanguageSelect />
+</MobileMenuFooterRoot>

package/dist/overrides/MobileMenuToggle.astro

@@ -0,0 +1,36 @@
+---
+import { localizedNavigation, localePath } from "../localization.js";
+import { content } from "virtual:cookbook/config";
+import Icon from "../components/Icon.astro";
+import { layout as configuredLayout } from "virtual:cookbook/layout";
+import { activeNavigationTab, navigationPath } from "../navigation.js";
+const route = Astro.locals.cookbookRoute;
+const { layout } = localizedNavigation(
+  configuredLayout,
+  content.routes,
+  navigationPath(Astro.url.pathname, import.meta.env.BASE_URL),
+  content,
+);
+const active = activeNavigationTab(
+  layout.tabs,
+  localePath(
+    navigationPath(Astro.url.pathname, import.meta.env.BASE_URL),
+    content,
+  ),
+);
+const section = layout.tabs[active]?.label;
+---
+
+<button
+  type="button"
+  popovertarget="cookbook__sidebar"
+  aria-controls="cookbook__sidebar"
+  aria-expanded="false"
+  class="td-menu-button cookbook-menu-button cookbook-print-hidden"
+>
+  <Icon name="bars" class="open-menu" />
+  <span class="sr-only">{Astro.locals.t("menuButton.accessibleLabel")}</span>
+  {section && <span class="td-menu-button__section">{section}</span>}
+  {section && <Icon name="right-caret" />}
+  <span class="td-menu-button__page">{route.entry.data.title}</span>
+</button>

package/dist/overrides/MobileTableOfContents.astro

@@ -0,0 +1,37 @@
+---
+import { content } from "virtual:cookbook/config";
+import { navigationPath } from "../navigation.js";
+import { MobileTableOfContentsRoot } from "../components/LayoutComponents.js";
+import MobileTocList from "../components/MobileTocList.astro";
+const { toc } = Astro.locals.cookbookRoute;
+const entry = content.entries.find(
+  (entry) => entry.route === navigationPath(Astro.url.pathname, content.base),
+);
+const page = entry?.frontmatter.tableOfContents;
+const site = content.tableOfContents;
+const enabled =
+  page !== false && (page?.mobile ?? (site && site.mobile) ?? false);
+const label = Astro.locals.t("tableOfContents.onThisPage");
+---
+
+{
+  enabled &&
+    toc &&
+    toc.items.some(
+      (item) => item.slug !== "_top" || item.children.length > 0,
+    ) && (
+      <MobileTableOfContentsRoot data-tasty-anatomy="MobileTableOfContents">
+        <details>
+          <>
+            <summary>{label}</summary>
+            <nav aria-label={label}>
+              <MobileTocList items={toc.items} />
+            </nav>
+          </>
+        </details>
+      </MobileTableOfContentsRoot>
+    )
+}
+<script>
+  import "../client/mobile-toc.js";
+</script>

package/dist/overrides/PageFrame.astro

@@ -0,0 +1,35 @@
+---
+import { PageFrameRoot } from "../components/LayoutComponents.js";
+const { hasSidebar } = Astro.locals.cookbookRoute;
+---
+
+<PageFrameRoot
+  className="page"
+  data-tasty-anatomy="PageFrame"
+  data-has-sidebar={hasSidebar ? "" : undefined}
+>
+  <header class="header"><slot name="header" /></header>
+  {
+    hasSidebar && (
+      <cookbook-sidebar-pane
+        id="cookbook__sidebar"
+        class="sidebar-pane cookbook-print-hidden"
+        popover="auto"
+        aria-label={Astro.locals.t("sidebarNav.accessibleLabel")}
+        tabindex="-1"
+      >
+        <nav
+          class="sidebar-content"
+          aria-label={Astro.locals.t("sidebarNav.accessibleLabel")}
+        >
+          <slot name="sidebar" />
+        </nav>
+      </cookbook-sidebar-pane>
+    )
+  }
+  <div class="main-frame"><slot /></div>
+</PageFrameRoot>
+
+<script>
+  import "../client/navigation.js";
+</script>

package/dist/overrides/Search.astro

@@ -0,0 +1,64 @@
+---
+import { messages } from "../localization.js";
+import { content } from "virtual:cookbook/config";
+const label = Astro.locals.t("search.label");
+const translations = {
+  placeholder: label,
+  error: messages(Astro.locals.cookbookRoute?.lang ?? "en", content)
+    .searchError,
+  search: Astro.locals.t("pagefind.search"),
+  zero_results: Astro.locals.t("pagefind.zero_results"),
+  many_results: Astro.locals.t("pagefind.many_results"),
+  one_result: Astro.locals.t("pagefind.one_result"),
+};
+---
+
+<site-search
+  class={Astro.props.class}
+  data-translations={JSON.stringify(translations)}
+  data-strip-trailing-slash={import.meta.env.TRAILING_SLASH === "never" ||
+    undefined}
+>
+  <button
+    type="button"
+    data-open-modal
+    disabled
+    aria-label={label}
+    aria-keyshortcuts="Control+K"
+  >
+    <span aria-hidden="true">{label}</span>
+    <kbd data-pending aria-hidden="true"
+      ><kbd>{Astro.locals.t("search.ctrlKey")}</kbd><kbd>K</kbd></kbd
+    >
+  </button>
+  <dialog aria-label={label}>
+    <div class="dialog-frame">
+      <button type="button" data-close-modal
+        >{Astro.locals.t("search.cancelLabel")}</button
+      >
+      {
+        import.meta.env.DEV ? (
+          <p data-search-status dir="ltr">
+            {Astro.locals.t("search.devWarning")}
+          </p>
+        ) : (
+          <div class="search-container">
+            <p data-search-status role="status" hidden />
+            <div id="cookbook__search" />
+          </div>
+        )
+      }
+    </div>
+  </dialog>
+</site-search>
+<script>
+  import { initializeSearch } from "../client/search.js";
+  document.querySelectorAll<HTMLElement>("site-search").forEach((element) => {
+    initializeSearch(
+      element,
+      {},
+      import.meta.env.DEV,
+      import.meta.env.BASE_URL,
+    );
+  });
+</script>

package/dist/overrides/Sidebar.astro

@@ -0,0 +1,89 @@
+---
+import {
+  localizedNavigation,
+  localePath,
+  localeHref,
+} from "../localization.js";
+import { messages } from "../localization.js";
+import { content } from "virtual:cookbook/config";
+import Icon from "../components/Icon.astro";
+import Logo from "../components/SiteLogo.astro";
+import MobileMenuFooter from "virtual:cookbook/components/MobileMenuFooter";
+import { layout as configuredLayout } from "virtual:cookbook/layout";
+import SidebarList from "../components/SidebarList.astro";
+import MobileNavigationTabs from "../components/MobileNavigationTabs.astro";
+import { activeNavigationTab, navigationPath } from "../navigation.js";
+
+const fullSidebar = Astro.locals.cookbookRoute.sidebar;
+const currentPath = navigationPath(
+  Astro.url.pathname,
+  import.meta.env.BASE_URL,
+);
+const { layout } = localizedNavigation(
+  configuredLayout,
+  content.routes,
+  currentPath,
+  content,
+);
+const activeTab = activeNavigationTab(
+  layout.tabs,
+  localePath(currentPath, content),
+);
+const groupIndex =
+  (activeTab >= 0 ? layout.tabs[activeTab]?.sidebarGroup : undefined) ??
+  layout.fallbackSidebarGroup;
+const selectedGroup = layout.sectioned
+  ? groupIndex === undefined
+    ? undefined
+    : fullSidebar[groupIndex]
+  : undefined;
+const sidebar =
+  selectedGroup?.type === "group"
+    ? selectedGroup.entries
+    : layout.sectioned
+      ? []
+      : fullSidebar;
+const ui = messages(Astro.locals.cookbookRoute?.lang ?? "en", content);
+---
+
+<div class="td-sidebar-heading">
+  <a
+    class="td-sidebar-heading__home"
+    href={localeHref(
+      (content.logo && content.logo.href) || "/",
+      currentPath,
+      content.routes,
+      content,
+      content.base,
+    )}
+  >
+    <Logo />
+    <span data-site-title>{Astro.locals.cookbookRoute.siteTitle}</span>
+  </a>
+  <button
+    type="button"
+    popovertarget="cookbook__sidebar"
+    popovertargetaction="hide"
+    aria-label={ui.closeNavigation}
+    autofocus><Icon name="close" /></button
+  >
+</div>
+
+<MobileNavigationTabs
+  base={import.meta.env.BASE_URL}
+  currentPath={Astro.url.pathname}
+/>
+
+<cookbook-sidebar
+  data-storage-key={`cookbook-sidebar:${import.meta.env.BASE_URL}:${groupIndex ?? "all"}`}
+>
+  <SidebarList entries={sidebar} />
+</cookbook-sidebar>
+
+<div class="md:cookbook-hidden">
+  <MobileMenuFooter />
+</div>
+
+<script>
+  import "../client/sidebar.js";
+</script>

package/dist/overrides/SocialIcons.astro

@@ -0,0 +1,27 @@
+---
+import { content } from "virtual:cookbook/config";
+import Icon from "../components/Icon.astro";
+import { SocialIconsRoot } from "../components/LayoutComponents.js";
+
+const repository = content.site.repository;
+const icon = repository?.includes("github.com")
+  ? "github"
+  : repository?.includes("gitlab.com")
+    ? "gitlab"
+    : "link";
+const links = repository
+  ? [{ href: repository, label: "Source repository", icon }]
+  : [];
+---
+
+{
+  links.length > 0 && (
+    <SocialIconsRoot data-tasty-anatomy="SocialIcons">
+      {links.map(({ label, href, icon }) => (
+        <a href={href} rel="me" aria-label={label} title={label}>
+          <Icon name={icon} />
+        </a>
+      ))}
+    </SocialIconsRoot>
+  )
+}

package/dist/overrides/ThemeSelect.astro

@@ -0,0 +1,148 @@
+---
+import { messages } from "../localization.js";
+import { content } from "virtual:cookbook/config";
+import Icon from "../components/Icon.astro";
+import paletteIcon from "../icons/palette.svg?raw";
+import ContrastIcon from "../components/ContrastIcon.astro";
+import { ThemeSelectRoot } from "../components/LayoutComponents.js";
+
+const ui = messages(Astro.locals.cookbookRoute?.lang ?? "en", content);
+const id = `appearance-${crypto.randomUUID()}`;
+const schemes = [
+  { value: "light", label: Astro.locals.t("themeSelect.light"), icon: "sun" },
+  { value: "dark", label: Astro.locals.t("themeSelect.dark"), icon: "moon" },
+  { value: "auto", label: Astro.locals.t("themeSelect.auto"), icon: "laptop" },
+] as const;
+const contrasts = [
+  { value: "normal", label: ui.normalContrast, icon: "normal" },
+  { value: "more", label: ui.highContrast, icon: "more" },
+  { value: "system", label: ui.auto, icon: "auto" },
+] as const;
+---
+
+<ThemeSelectRoot data-tasty-anatomy="ThemeSelect">
+  <button
+    type="button"
+    popovertarget={id}
+    aria-label={ui.appearance}
+    title={ui.appearance}
+  >
+    <span aria-hidden="true" set:html={paletteIcon} />
+  </button>
+  <div id={id} popover="auto" role="group" aria-label={ui.appearance}>
+    <fieldset>
+      <legend>{ui.colorScheme}</legend>
+      {
+        schemes.map(({ value, label, icon }) => (
+          <label>
+            <input
+              type="radio"
+              name={`${id}-scheme`}
+              value={value}
+              data-appearance-scheme
+              checked={value === "auto"}
+            />
+            <Icon name={icon} />
+            <span>{label}</span>
+            <Icon name="approve-check" class="checkmark" />
+          </label>
+        ))
+      }
+    </fieldset>
+    <fieldset>
+      <legend>{ui.contrast}</legend>
+      {
+        contrasts.map(({ value, label, icon }) => (
+          <label>
+            <input
+              type="radio"
+              name={`${id}-contrast`}
+              value={value}
+              data-appearance-contrast
+              checked={value === "system"}
+            />
+            {icon === "auto" ? (
+              <Icon name="laptop" />
+            ) : (
+              <ContrastIcon level={icon} />
+            )}
+            <span>{label}</span>
+            <Icon name="approve-check" class="checkmark" />
+          </label>
+        ))
+      }
+    </fieldset>
+  </div>
+</ThemeSelectRoot>
+
+<script>
+  import {
+    loadPreferences,
+    storePreferences,
+    parseScheme,
+    parseContrast,
+  } from "../components/appearance-preferences.js";
+
+  let current = loadPreferences();
+  const systemScheme = matchMedia("(prefers-color-scheme: light)");
+
+  function applyPreferences(): void {
+    document.documentElement.dataset.theme =
+      current.scheme === "auto"
+        ? systemScheme.matches
+          ? "light"
+          : "dark"
+        : current.scheme;
+    if (current.contrast === "system") {
+      delete document.documentElement.dataset.contrast;
+    } else {
+      document.documentElement.dataset.contrast = current.contrast;
+    }
+    document
+      .querySelectorAll<HTMLInputElement>("[data-appearance-scheme]")
+      .forEach((input) => {
+        input.checked = input.value === current.scheme;
+      });
+    document
+      .querySelectorAll<HTMLInputElement>("[data-appearance-contrast]")
+      .forEach((input) => {
+        input.checked = input.value === current.contrast;
+      });
+  }
+
+  systemScheme.addEventListener("change", () => {
+    if (current.scheme === "auto") applyPreferences();
+  });
+  window.addEventListener("storage", (event) => {
+    if (
+      !event.key ||
+      ["cookbook-theme", "cookbook-appearance"].includes(event.key)
+    ) {
+      current = loadPreferences();
+      applyPreferences();
+    }
+  });
+
+  class CookbookAppearanceMenu extends HTMLElement {
+    connectedCallback(): void {
+      if (this.dataset.ready) return;
+      this.dataset.ready = "true";
+      this.addEventListener("change", (event) => {
+        const input = event.target;
+        if (!(input instanceof HTMLInputElement)) return;
+        if (input.hasAttribute("data-appearance-scheme")) {
+          current.scheme = parseScheme(input.value);
+        } else if (input.hasAttribute("data-appearance-contrast")) {
+          current.contrast = parseContrast(input.value);
+        } else return;
+        storePreferences(current);
+        applyPreferences();
+      });
+      applyPreferences();
+    }
+  }
+
+  if (!customElements.get("cookbook-appearance-menu")) {
+    customElements.define("cookbook-appearance-menu", CookbookAppearanceMenu);
+  }
+</script>

package/dist/page-metadata.d.ts

@@ -0,0 +1,13 @@
+import { DocsConfig, DocsEntry, DocsRoute, HeadConfig, SiteConfig } from "@tenphi/docs";
+//#region src/page-metadata.d.ts
+declare function pageMetadata(entry: DocsEntry, content: {
+  site: SiteConfig;
+  base: string;
+  routes: DocsRoute[];
+  locales?: DocsConfig["locales"];
+}, existing: HeadConfig[]): HeadConfig[];
+/** Stable short asset names also support deeply nested and non-ASCII routes. */
+declare function agentPagePath(route: string, base?: string): string;
+//#endregion
+export { agentPagePath, pageMetadata };
+//# sourceMappingURL=page-metadata.d.ts.map

package/dist/page-metadata.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-metadata.d.ts","names":[],"sources":["../src/page-metadata.ts"],"mappings":";;iBAYgB,aACd,OAAO,WACP;EACE,MAAM;EACN;EACA,QAAQ;EACR,UAAU;GAEZ,UAAU,eACT;;iBA4Ha,cAAc,eAAe"}