@tenphi/renderer 0.21.2 → 0.22.0

package/dist/client/code-copy.js

@@ -1,4 +1,4 @@
-import { t as message } from "../messages-B_3xUzUb.js";
+import { t as message } from "../messages-bS8G9Pj8.js";
 //#region src/client/code-copy.ts
 var CookbookCodeBlock = class extends HTMLElement {
 	#resetTimer;

package/dist/client/heading-links.js

@@ -1,4 +1,4 @@
-import { t as message } from "../messages-B_3xUzUb.js";
+import { t as message } from "../messages-bS8G9Pj8.js";
 //#region src/client/heading-links.ts
 /** Keep real fragment links as the no-JavaScript and modified-click fallback. */
 function initializeHeadingLinks() {

package/dist/client/page-copy.js

@@ -1,4 +1,4 @@
-import { t as message } from "../messages-B_3xUzUb.js";
+import { t as message } from "../messages-bS8G9Pj8.js";
 //#region src/client/page-copy.ts
 var CookbookPageActions = class extends HTMLElement {
 	connectedCallback() {

package/dist/components/Card.styles.js

@@ -16,7 +16,9 @@ export const CardRoot = defineComponent("Card", {
     border: true,
     radius: "1cr",
     fill: "#surface-2",
-    shadow: "0 1px 2px #shadow",
+    "$resting-shadow-offset": "1px",
+    "$resting-shadow-blur": "2px",
+    shadow: "0 $resting-shadow-offset $resting-shadow-blur #shadow",
     transition: "fill $transition, shadow $transition, translate $transition",
 
     Heading2: {
@@ -52,12 +54,13 @@ export const CardLink = tasty(CardRoot, {
       ":active": "#surface-2-pressed",
     },
     shadow: {
-      "": "0 1px 2px #shadow",
+      "": "0 $resting-shadow-offset $resting-shadow-blur #shadow",
       ":hover": "0 .75x 2x #shadow",
     },
+    "$hover-offset": "-1px",
     translate: {
       "": "0",
-      ":hover": "0 -1px",
+      ":hover": "0 $hover-offset",
       ":active": "0",
     },
   },

package/dist/components/Document.styles.js

@@ -164,11 +164,12 @@ export default function DocumentStyles() {
       },
       ScreenReaderOnly: {
         $: ".sr-only",
+        "$visually-hidden-size": "1px",
         position: "absolute",
-        inlineSize: "1px",
-        blockSize: "1px",
+        inlineSize: "$visually-hidden-size",
+        blockSize: "$visually-hidden-size",
         padding: "0",
-        margin: "-1px",
+        margin: "($visually-hidden-size * -1)",
         overflow: "hidden",
         clip: "rect(0, 0, 0, 0)",
         whiteSpace: "nowrap",

package/dist/components/HeaderFrame.styles.js

@@ -15,6 +15,7 @@ export const HeaderFrameRoot = defineComponent("HeaderFrame", {
     padding: "0 $docs-nav-pad-x",
     blockBorder: "$border-width solid #border end",
     fill: "#header",
-    backdropFilter: "blur(16px)",
+    "$backdrop-blur": "16px",
+    backdropFilter: "blur($backdrop-blur)",
   },
 });

package/dist/components/Hero.styles.js

@@ -91,7 +91,7 @@ export const HeroRoot = defineComponent("Hero", {
       gap: "$gap",
       color: "#text",
       border: true,
-      radius: "999px",
+      radius: "round",
       fill: "#surface-2",
       preset: "navigation / strong",
       textDecoration: "none",
@@ -99,8 +99,9 @@ export const HeroRoot = defineComponent("Hero", {
     },
     HoverAction: {
       $: ".cookbook-link-button",
+      "$hover-offset": "-1px",
       fill: { "": null, "@own(:hover)": "#surface-2-hover" },
-      translate: { "": null, "@own(:hover)": "0 -1px" },
+      translate: { "": null, "@own(:hover)": "0 $hover-offset" },
     },
     PrimaryAction: {
       $: ".cookbook-link-button.primary",

package/dist/components/MarkdownContent.styles.js

@@ -130,13 +130,15 @@ export default function MarkdownStyles() {
       },
       Details: {
         $: "details",
+        "$details-border-width": "2px",
         inlinePadding: {
           "": null,
           "@own(!:is(.not-content *))": "($gap * 2) start",
         },
         inlineBorder: {
           "": null,
-          "@own(!:is(.not-content *))": "2px solid #border start",
+          "@own(!:is(.not-content *))":
+            "$details-border-width solid #border start",
         },
         // Change only color; border widths and styles belong to other rules or theme overrides.
         // eslint-disable-next-line tasty/prefer-shorthand-property

package/dist/components/MobileTableOfContents.styles.js

@@ -24,11 +24,12 @@ export const MobileTableOfContentsRoot = defineComponent(
       },
       List: {
         $: "ul",
+        "$item-gap": "2px",
         listStyle: "none",
         padding: "0",
         margin: "0",
         display: "grid",
-        gap: "2px",
+        gap: "$item-gap",
       },
       NestedList: { $: "ul ul", inlinePadding: "($gap * 2) start" },
       Item: { $: "li", listStyle: "none", margin: "0", padding: "0" },
@@ -51,7 +52,7 @@ export const MobileTableOfContentsRoot = defineComponent(
         outline: {
           "": null,
           "@own(:is(a:focus-visible)) | @own(:is(summary:focus-visible))":
-            "2px solid #focus / 2px",
+            "$outline-width solid #focus / $outline-offset",
         },
       },
     },

package/dist/components/PackageVersion.styles.js

@@ -16,7 +16,7 @@ export const PackageVersionRoot = defineComponent("PackageVersion", {
     color: "#text-soft",
     fill: "#surface-2",
     border: true,
-    radius: "999px",
+    radius: "round",
     preset: "small",
     whiteSpace: "nowrap",
   },

package/dist/components/PageActions.styles.js

@@ -36,7 +36,7 @@ export const PageActionsRoot = defineComponent("PageActions", {
       $: "button, a",
       outline: {
         "": null,
-        "@own(:focus-visible)": "2px solid #focus / 2px",
+        "@own(:focus-visible)": "$outline-width solid #focus / $outline-offset",
       },
     },
     Pending: {

package/dist/components/Preview.styles.js

@@ -22,7 +22,9 @@ export const PreviewRoot = defineComponent("Preview", {
     border: true,
     radius: "1cr",
     fill: "#surface",
-    shadow: "0 1px 2px #shadow",
+    "$resting-shadow-offset": "1px",
+    "$resting-shadow-blur": "2px",
+    shadow: "0 $resting-shadow-offset $resting-shadow-blur #shadow",
 
     Caption: {
       padding: "1.5x 2x",

package/dist/components/Sidebar.styles.js

@@ -198,6 +198,7 @@ export const SidebarRoot = defineComponent("Sidebar", {
       display: "flex",
       alignItems: "center",
       inlineSize: "min 0",
+      flexGrow: "1",
       gap: "0.25em",
     },
     GroupLabelText: {
@@ -291,14 +292,17 @@ export const SidebarRoot = defineComponent("Sidebar", {
       },
     },
     Badge: {
-      $: ".sidebar-badge",
+      $: "cookbook-sidebar Badge",
+      display: "inline-flex",
+      alignItems: "center",
       flexShrink: "0",
-      padding: "0.125rem 0.375rem",
-      color: "#text-soft",
-      fill: "#surface-3",
-      border: "$border-width solid #border",
-      radius: "$radius",
-      preset: "small",
+      inlineMargin: "auto start",
+      padding: "0.125em 0.625em",
+      color: "#accent-text",
+      fill: "#accent-surface-subtle",
+      radius: "round",
+      preset: "small / strong / tight",
+      whiteSpace: "nowrap",
     },
     TopLevelLink: {
       $: "a.large",

package/dist/components/SidebarList.astro

@@ -27,11 +27,7 @@ const containsCurrent = (items: SidebarEntry[]): boolean =>
         entry.type === "group" ? entry.entries.slice(groupLink ? 1 : 0) : [];
       const open = Boolean(groupLink?.isCurrent) || containsCurrent(children);
       const badge = entry.badge && (
-        <span
-          class:list={["sidebar-badge", entry.badge.variant, entry.badge.class]}
-        >
-          {entry.badge.text}
-        </span>
+        <span data-element="Badge">{entry.badge}</span>
       );
       const label = (
         <span class="group-label">

package/dist/components/SkipLink.styles.js

@@ -7,6 +7,7 @@ export const SkipLinkRoot = defineComponent("SkipLink", {
   as: "a",
   "data-element": "SkipLink",
   styles: {
+    "$visually-hidden-size": "1px",
     zIndex: { "": null, ":focus": "20" },
     color: { "": null, ":focus": "#accent-surface-text" },
     fill: { "": null, ":focus": "#accent-surface" },
@@ -15,8 +16,8 @@ export const SkipLinkRoot = defineComponent("SkipLink", {
     textDecoration: { "": null, ":focus": "none" },
     position: "fixed",
     inset: "($gap * 1.5) auto auto ($gap * 1.5)",
-    inlineSize: { "": "1px", ":focus": "auto" },
-    blockSize: { "": "1px", ":focus": "auto" },
+    inlineSize: { "": "$visually-hidden-size", ":focus": "auto" },
+    blockSize: { "": "$visually-hidden-size", ":focus": "auto" },
     padding: { "": "0", ":focus": "$gap ($gap * 2)" },
     overflow: { "": "hidden", ":focus": "visible" },
     clip: { "": "rect(0, 0, 0, 0)", ":focus": "auto" },

package/dist/components/TableOfContents.styles.js

@@ -19,10 +19,11 @@ export const TableOfContentsRoot = defineComponent("TableOfContents", {
     },
     List: {
       $: "ul",
+      "$item-gap": "1px",
       display: "grid",
       gridColumns: "minmax(0, 1fr)",
       inlineSize: "min 0",
-      gap: "1px",
+      gap: "$item-gap",
       margin: "0",
       padding: "0",
       listStyle: "none",

package/dist/components/Tabs.styles.js

@@ -52,7 +52,8 @@ export const TabsRoot = defineComponent("Tabs", {
       $: "> List > button",
       outline: {
         "": null,
-        "@own(:focus-visible)": "2px #focus / -2px",
+        "@own(:focus-visible)":
+          "$outline-width #focus / ($outline-offset * -1)",
       },
     },
   },

package/dist/components/ThemeSelect.styles.js

@@ -137,14 +137,16 @@ export const ThemeSelectRoot = defineComponent("ThemeSelect", {
       $: "label",
       outline: {
         "": null,
-        "@own(:has(input:focus-visible))": "$outline-width solid #focus / -2px",
+        "@own(:has(input:focus-visible))":
+          "$outline-width solid #focus / ($outline-offset * -1)",
       },
     },
     Input: {
       $: "input",
+      "$visually-hidden-size": "1px",
       position: "absolute",
-      inlineSize: "1px",
-      blockSize: "0 1px",
+      inlineSize: "$visually-hidden-size",
+      blockSize: "0 $visually-hidden-size",
       padding: "0",
       margin: "0",
       overflow: "hidden",

package/dist/components/TopNavigation.styles.js

@@ -41,11 +41,12 @@ export const TopNavigationRoot = defineComponent("TopNavigation", {
       // Tasty 3.9.3 appends @own states after pseudo-elements, producing invalid CSS.
       // eslint-disable-next-line tasty/no-state-in-selector
       $: 'a[aria-current="page"]::after',
+      "$indicator-height": "2px",
       content: '""',
       position: "absolute",
       inset: "auto 0 0",
-      blockSize: "2px",
-      radius: "999px",
+      blockSize: "$indicator-height",
+      radius: "round",
       fill: "#accent-surface",
     },
   },

package/dist/index.js

@@ -1165,13 +1165,14 @@ function configuredCookbook(options) {
 	let siteLogo;
 	async function loadGraph(refresh = false) {
 		if (!graph || refresh) {
-			graph = await createDocsGraph({
+			const candidate = await createDocsGraph({
 				...projectRoot ? { root: projectRoot } : {},
 				...graphConfig ? { config: graphConfig } : {},
 				base: graphBase
 			});
-			assertValidDocs(graph);
-			await validatePluginFrontmatter(graph.entries, options.frontmatterSchema);
+			assertValidDocs(candidate);
+			await validatePluginFrontmatter(candidate.entries, options.frontmatterSchema);
+			graph = candidate;
 		}
 		return graph;
 	}