feat: numerous bug fixes (#601)

Author: ovflowd

npm-shrinkwrap.json

@@ -28,6 +28,7 @@
     "@reporters/github": "^1.12.0",
     "@types/mdast": "^4.0.4",
     "@types/node": "^24.10.1",
+    "@types/semver": "^7.7.1",
     "c8": "^10.1.3",
     "eslint": "^9.39.2",
     "eslint-import-resolver-node": "^0.3.9",
@@ -42,7 +43,7 @@
     "@actions/core": "^3.0.0",
     "@heroicons/react": "^2.2.0",
     "@node-core/rehype-shiki": "1.3.0",
-    "@node-core/ui-components": "^1.5.10",
+    "@node-core/ui-components": "^1.6.0",
     "@orama/orama": "^3.1.18",
     "@orama/ui": "^1.5.4",
     "@rollup/plugin-virtual": "^3.0.2",

package.json

@@ -68,7 +68,7 @@ const extractHeading = entry => {
     value: heading,
     stability: parseInt(entry.stability?.children[0]?.data.index ?? 2),
     slug: data.slug,
-    data: { id: data.slug },
+    data: { id: data.slug, type: data.type },
   };
 };
 

src/generators/jsx-ast/utils/buildBarProps.mjs

@@ -119,9 +119,15 @@ export const createHeadingElement = (content, changeElement) => {
 
   // Build heading with anchor link
   const headingWrapper = createElement('div', [
-    createElement(`h${depth}`, [
-      createElement(`a#${slug}`, { href: `#${slug}` }, headingContent),
-    ]),
+    createElement(
+      `h${depth}`,
+      { id: slug },
+      createElement(
+        'a',
+        { href: `#${slug}`, className: ['anchor'] },
+        headingContent
+      )
+    ),
   ]);
 
   // Prepend type icon if not 'misc' and type exists

src/generators/jsx-ast/utils/buildContent.mjs

@@ -1,5 +1,4 @@
 import type { SemVer } from 'semver';
-import type { ApiDocReleaseEntry } from '../types';
 import type { publicGenerators, allGenerators } from './index.mjs';
 
 declare global {

src/generators/types.d.ts

@@ -21,6 +21,38 @@ const iconMap = {
 
 const STABILITY_KINDS = ['error', 'warning', null, 'info'];
 const STABILITY_LABELS = ['D', 'E', null, 'L'];
+const STABILITY_TOOLTIPS = ['Deprecated', 'Experimental', null, 'Legacy'];
+
+/**
+ * Renders a heading value with an optional stability badge
+ * @param {{ value: string, stability: number }} props
+ */
+const HeadingValue = ({ value, stability }) => {
+  if (stability === 2) {
+    return value;
+  }
+
+  const ariaLabel = STABILITY_TOOLTIPS[stability]
+    ? `Stability: ${STABILITY_TOOLTIPS[stability]}`
+    : undefined;
+
+  return (
+    <>
+      {value}
+
+      <Badge
+        size="small"
+        className={styles.badge}
+        kind={STABILITY_KINDS[stability]}
+        data-tooltip={STABILITY_TOOLTIPS[stability]}
+        aria-label={ariaLabel}
+        tabIndex={0}
+      >
+        {STABILITY_LABELS[stability]}
+      </Badge>
+    </>
+  );
+};
 
 /**
  * MetaBar component that displays table of contents and page metadata
@@ -38,21 +70,7 @@ export default ({
     headings={{
       items: headings.map(({ value, stability, ...heading }) => ({
         ...heading,
-        value:
-          stability !== 2 ? (
-            <>
-              {value}
-              <Badge
-                size="small"
-                className={styles.badge}
-                kind={STABILITY_KINDS[stability]}
-              >
-                {STABILITY_LABELS[stability]}
-              </Badge>
-            </>
-          ) : (
-            value
-          ),
+        value: <HeadingValue value={value} stability={stability} />,
       })),
     }}
     items={{
@@ -62,10 +80,12 @@ export default ({
         <ol>
           {viewAs.map(([title, path]) => {
             const Icon = iconMap[title];
+
             return (
               <li key={title}>
                 <a href={path}>
                   {Icon && <Icon className={styles.icon} />}
+
                   {title}
                 </a>
               </li>
@@ -76,6 +96,7 @@ export default ({
       Contribute: (
         <>
           <GitHubIcon className="fill-neutral-700 dark:fill-neutral-100" />
+
           <a href={editThisPage}>Edit this page</a>
         </>
       ),

src/generators/web/ui/components/MetaBar/index.jsx

@@ -31,6 +31,11 @@ export default async function bundleCode(codeMap, { server = false } = {}) {
       chunkImportMap: !server,
     },
 
+    checks: {
+      // Disable plugin timing logs for cleaner output. This can be re-enabled for debugging performance issues.
+      pluginTimings: false,
+    },
+
     // Output configuration
     output: {
       // Output module format:
@@ -79,6 +84,9 @@ export default async function bundleCode(codeMap, { server = false } = {}) {
 
     // Module resolution configuration.
     resolve: {
+      // exports condition to use
+      conditionNames: ['rolldown'],
+
       // Alias react imports to preact/compat for smaller bundle sizes.
       // Explicit jsx-runtime aliases are required for the automatic JSX transform.
       alias: {