@primer/doctocat-nextjs 0.5.7-rc.c059213 → 0.5.8-rc.095ea49

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @primer/doctocat-nextjs
 
+## 0.5.8
+
+### Patch Changes
+
+- [#59](https://github.com/primer/doctocat-nextjs/pull/59) [`c24a5b9`](https://github.com/primer/doctocat-nextjs/commit/c24a5b98aad639b42213ad230d923907115eb864) Thanks [@danielguillan](https://github.com/danielguillan)! - Switched sidebar navigation and content document order for improved accessibility
+
+- [#61](https://github.com/primer/doctocat-nextjs/pull/61) [`1446089`](https://github.com/primer/doctocat-nextjs/commit/14460897dbcd248f688c13b9085128707abbda25) Thanks [@rezrah](https://github.com/rezrah)! - React code previews now support dot-notation in component names. E.g. Hero.Image.
+
 ## 0.5.7
 
 ### Patch Changes

package/components/layout/code-block/code-transformer.ts

@@ -9,7 +9,7 @@ export const codeTransformer = (sourceCode: string, basePath: string): string =>
 
   // Assumes all elements with a src attribute are trying to point at Next.js public folder
   return sourceCode.replace(
-    /<(\w+)\s+([^>]*\s+)?src=["']([^"']+)["']([^>]*)/g,
+    /<([a-z]\w*|[A-Z]\w*(?:\.[A-Z]\w*)?)\s+([^>]*\s+)?src=["']([^"']+)["']([^>]*)/g,
     (match, tagName, before = '', src, after) => {
       if (!shouldTransform(src)) return match
 

package/components/layout/root-layout/Theme.tsx

@@ -130,6 +130,19 @@ export function Theme({pageMap, children}: ThemeProps) {
                 <Header flatDocsDirectories={flatDocsDirectories} siteTitle={siteTitle} pageMap={pageMap} />
               </PRCBox>
               <PageLayout rowGap="none" columnGap="none" padding="none" containerWidth="full">
+                <PageLayout.Pane
+                  width="small"
+                  sticky
+                  offsetHeader={65}
+                  padding="none"
+                  position="start"
+                  hidden={{narrow: true}}
+                  divider="line"
+                >
+                  <aside aria-label={`${activeHeaderLink ? activeHeaderLink.title : siteTitle} sidebar`}>
+                    <Sidebar pageMap={pageMap} />
+                  </aside>
+                </PageLayout.Pane>
                 <PageLayout.Content padding="normal">
                   <div id="main">
                     <PRCBox sx={!isHomePage && {maxWidth: 1200, width: '100%', margin: '0 auto'}}>
@@ -247,18 +260,6 @@ export function Theme({pageMap, children}: ThemeProps) {
                     </PRCBox>
                   </div>
                 </PageLayout.Content>
-                <PageLayout.Pane
-                  aria-label="Side navigation"
-                  width="small"
-                  sticky
-                  offsetHeader={65}
-                  padding="none"
-                  position="start"
-                  hidden={{narrow: true}}
-                  divider="line"
-                >
-                  <Sidebar pageMap={pageMap} />
-                </PageLayout.Pane>
               </PageLayout>
             </ContentWrapper>
           </BaseStyles>

package/package.json

@@ -1,13 +1,16 @@
 {
   "name": "@primer/doctocat-nextjs",
-  "version": "0.5.7-rc.c059213",
+  "version": "0.5.8-rc.095ea49",
   "description": "A Next.js theme for building Primer documentation sites",
   "main": "index.js",
   "type": "module",
   "scripts": {
     "check": "tsc --noEmit",
     "lint": "eslint '**/*.{js,ts,tsx,md,mdx}' --max-warnings=0 --config ./.eslintrc.cjs",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "test:no-watch": "vitest run",
+    "test:coverage": "vitest run --coverage"
   },
   "author": "GitHub, Inc.",
   "license": "MIT",
@@ -17,7 +20,7 @@
     "react-dom": ">=18.0.0 <20.0.0"
   },
   "dependencies": {
-    "@next/mdx": "15.2.4",
+    "@next/mdx": "15.3.5",
     "@primer/octicons-react": "19.15.1",
     "@primer/react": "^37.11.0",
     "@primer/react-brand": "0.54.0",
@@ -32,12 +35,21 @@
   },
   "devDependencies": {
     "@github/prettier-config": "^0.0.6",
-    "@types/node": "18.11.10",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.1.0",
+    "@testing-library/user-event": "^14.5.2",
+    "@types/node": "^20.19.0",
     "@types/react": "18.3.12",
     "@types/react-dom": "18.3.1",
+    "@vitejs/plugin-react": "^4.3.3",
+    "@vitest/coverage-v8": "^3.2.4",
+    "@vitest/ui": "^3.2.4",
     "clsx": "2.1.1",
-    "next": "15.2.4",
-    "styled-components": "5.3.11"
+    "jsdom": "^26.0.1",
+    "next": "15.3.5",
+    "styled-components": "5.3.11",
+    "vitest": "^3.2.4"
   },
   "overrides": {
     "@types/react": "18.3.12",

package/.eslintrc.cjs

@@ -1,9 +0,0 @@
-const base = require('../../.eslintrc.cjs')
-
-module.exports = {
-  ...base,
-  plugins: ['react-hooks'],
-  parserOptions: {
-    tsconfigRootDir: __dirname,
-  },
-}

package/.vscode/settings.json

@@ -1,5 +0,0 @@
-{
-  "eslint.options": {
-    "configFile": ".eslintrc.cjs"
-  }
-}

package/prettier.config.cjs

@@ -1,3 +0,0 @@
-module.exports = {
-  ...require('@github/prettier-config'),
-}

package/tsconfig.json

@@ -1,19 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es2016",
-    "module": "ESNext",
-    "declaration": false,
-    "noEmit": true,
-    "esModuleInterop": true,
-    "strict": true,
-    "skipLibCheck": true,
-    "allowJs": true,
-    "jsx": "react-jsx",
-    "moduleResolution": "bundler",
-    "lib": ["ESNext", "DOM", "DOM.Iterable"],
-    "resolveJsonModule": true,
-    "strictNullChecks": true,
-    "strictFunctionTypes": true,
-    "noImplicitAny": true
-  }
-}