From 59c93da3ece09608ea29c73c377f8d6ca7855355 Mon Sep 17 00:00:00 2001 From: Brett Jephson Date: Thu, 23 Oct 2025 08:37:07 +0100 Subject: [PATCH 1/8] wip - code block expandable --- .../CodeBlock/ClientCodeBlock.tsx | 42 ++++++++++++++++++- .../DocumentView/CodeBlock/CodeBlock.tsx | 2 +- 2 files changed, 42 insertions(+), 2 deletions(-) diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx index 9d8cfbb399..34156a11e3 100644 --- a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx +++ b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx @@ -6,6 +6,8 @@ import { useEffect, useMemo, useRef, useState } from 'react'; import { useAdaptiveVisitor } from '@/components/Adaptive'; import { useInViewportListener } from '@/components/hooks/useInViewportListener'; import { useScrollListener } from '@/components/hooks/useScrollListener'; +import { Button } from '@/components/primitives'; +import { tcls } from '@/lib/tailwind'; import { useDebounceCallback } from 'usehooks-ts'; import type { BlockProps } from '../Block'; import { type InlineExpressionVariables, useEvaluateInlineExpression } from '../InlineExpression'; @@ -113,7 +115,9 @@ export function ClientCodeBlock(props: ClientBlockProps) { setLines(null); }, [isInViewport, block, inlines, evaluateInlineExpression]); - return ( + const expandable = block.data.expandable; + + const renderer = ( ); + + return expandable ? ( + {renderer} + ) : ( + <>{renderer} + ); +} + +function CodeBlockExpandable(props: { children: React.ReactNode; lines: HighlightLine[] }) { + const { children, lines = [] } = props; + const [isExpanded, setIsExpanded] = useState(false); + + return ( +
+
+ {children} +
+
+ +
+
+ ); } diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlock.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlock.tsx index 206cb82adb..43e6f7efbe 100644 --- a/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlock.tsx +++ b/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlock.tsx @@ -50,7 +50,7 @@ export async function CodeBlock(props: BlockProps) { return { inline, body }; }); - if (!isEstimatedOffscreen && !hasInlineExpression) { + if (!isEstimatedOffscreen && !hasInlineExpression && !block.data.expandable) { // In v2, we render the code block server-side const lines = await highlight(block, richInlines); return ; From 9d3da3f6a01a5b173c0dbad4be3fc596696d06e0 Mon Sep 17 00:00:00 2001 From: Brett Jephson Date: Thu, 23 Oct 2025 12:38:58 +0100 Subject: [PATCH 2/8] inject styles into server code block --- bun.lock | 4 ++-- package.json | 8 +++++--- .../DocumentView/CodeBlock/ClientCodeBlock.tsx | 10 ++++++---- 3 files changed, 13 insertions(+), 9 deletions(-) diff --git a/bun.lock b/bun.lock index 50099ab0e7..008f621c87 100644 --- a/bun.lock +++ b/bun.lock @@ -343,7 +343,7 @@ "react-dom": "catalog:", }, "catalog": { - "@gitbook/api": "0.143.2", + "@gitbook/api": "0.145.0", "@scalar/api-client-react": "^1.3.46", "@tsconfig/node20": "^20.1.6", "@tsconfig/strictest": "^2.0.6", @@ -724,7 +724,7 @@ "@fortawesome/fontawesome-svg-core": ["@fortawesome/fontawesome-svg-core@6.6.0", "", { "dependencies": { "@fortawesome/fontawesome-common-types": "6.6.0" } }, "sha512-KHwPkCk6oRT4HADE7smhfsKudt9N/9lm6EJ5BVg0tD1yPA5hht837fB87F8pn15D8JfTqQOjhKTktwmLMiD7Kg=="], - "@gitbook/api": ["@gitbook/api@0.143.2", "", { "dependencies": { "event-iterator": "^2.0.0", "eventsource-parser": "^3.0.0" } }, "sha512-ZIQwIgX+artl0o20ftnzeJyM9icwQ6pFeM55AG/lEdeFbMuUGxTfSnZ90+8Aou8l/3ELR3/tOkU2SAvyKc+ATw=="], + "@gitbook/api": ["@gitbook/api@0.145.0", "", { "dependencies": { "event-iterator": "^2.0.0", "eventsource-parser": "^3.0.0" } }, "sha512-pq+lqUPdvrVstpojs7uOimaNePg16uE1X2Dx7VDulqResmNp/FiV8a1i99vlYHhfhVA/U7i6wAN0iX4zi0/YZA=="], "@gitbook/browser-types": ["@gitbook/browser-types@workspace:packages/browser-types"], diff --git a/package.json b/package.json index 2baf43e0ef..2f7ec886ed 100644 --- a/package.json +++ b/package.json @@ -38,11 +38,13 @@ "clean": "turbo run clean" }, "workspaces": { - "packages": ["packages/*"], + "packages": [ + "packages/*" + ], "catalog": { "@tsconfig/strictest": "^2.0.6", "@tsconfig/node20": "^20.1.6", - "@gitbook/api": "0.143.2", + "@gitbook/api": "0.145.0", "@scalar/api-client-react": "^1.3.46", "@types/react": "^19.0.0", "@types/react-dom": "^19.0.0", @@ -61,4 +63,4 @@ "decode-named-character-reference@1.0.2": "patches/decode-named-character-reference@1.0.2.patch", "@vercel/next@4.4.2": "patches/@vercel%2Fnext@4.4.2.patch" } -} +} \ No newline at end of file diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx index 34156a11e3..248f2c9d8d 100644 --- a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx +++ b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx @@ -139,11 +139,13 @@ function CodeBlockExpandable(props: { children: React.ReactNode; lines: Highligh const [isExpanded, setIsExpanded] = useState(false); return ( -
+
{children} @@ -155,7 +157,7 @@ function CodeBlockExpandable(props: { children: React.ReactNode; lines: Highligh variant="blank" type="button" onClick={() => setIsExpanded(!isExpanded)} - className="my-2 text-primary text-sm" + className="my-2 text-primary text-sm opacity-0 focus:opacity-11 group-hover/codeblock-expandable:opacity-11" > {isExpanded ? 'Show less' : `Show all ${lines.length} lines`} From 28c589d2121bca811a264cf6c53cf168fe1c8bb8 Mon Sep 17 00:00:00 2001 From: Brett Jephson Date: Fri, 24 Oct 2025 11:23:03 +0100 Subject: [PATCH 3/8] aria and adjustable height --- .../CodeBlock/ClientCodeBlock.tsx | 43 ++++++++++++++++--- .../CodeBlock/CodeBlockRenderer.tsx | 8 ++-- 2 files changed, 41 insertions(+), 10 deletions(-) diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx index 248f2c9d8d..fbc58ae351 100644 --- a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx +++ b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx @@ -1,7 +1,7 @@ 'use client'; import type { DocumentBlockCode } from '@gitbook/api'; -import { useEffect, useMemo, useRef, useState } from 'react'; +import { useEffect, useId, useMemo, useRef, useState } from 'react'; import { useAdaptiveVisitor } from '@/components/Adaptive'; import { useInViewportListener } from '@/components/hooks/useInViewportListener'; @@ -20,6 +20,8 @@ type ClientBlockProps = Pick, 'block' | 'style'> & inlineExprVariables: InlineExpressionVariables; }; +export const CODE_BLOCK_DEFAULT_COLLAPSED_LINE_COUNT = 10; + /** * Render a code-block client-side by loading the highlighter asynchronously. * It allows us to defer some load to avoid blocking the rendering of the whole page with block highlighting. @@ -117,6 +119,13 @@ export function ClientCodeBlock(props: ClientBlockProps) { const expandable = block.data.expandable; + const numberOfLinesOfCode = lines?.length ?? plainLines.length; + const collapsedLineCount = + block.data.collapsedLineCount || CODE_BLOCK_DEFAULT_COLLAPSED_LINE_COUNT; + const isExpandable = Boolean(expandable && numberOfLinesOfCode > collapsedLineCount); + + const codeBlockBodyId = useId(); + const renderer = ( ); - return expandable ? ( - {renderer} + return isExpandable ? ( + + {renderer} + ) : ( <>{renderer} ); } -function CodeBlockExpandable(props: { children: React.ReactNode; lines: HighlightLine[] }) { - const { children, lines = [] } = props; +function CodeBlockExpandable(props: { + children: React.ReactNode; + lines: HighlightLine[]; + collapsedLineCount: number; + controls?: string; +}) { + const { children, controls, lines = [], collapsedLineCount } = props; const [isExpanded, setIsExpanded] = useState(false); return ( @@ -144,9 +165,15 @@ function CodeBlockExpandable(props: { children: React.ReactNode; lines: Highligh className={tcls( isExpanded ? '[&_pre]:after:opacity-0' - : '[&_pre]:h-60 [&_pre]:after:overflow-y-hidden [&_pre]:after:opacity-100', - '[&_pre]:after:pointer-events-none [&_pre]:after:z-0 [&_pre]:after:bg-gradient-to-t [&_pre]:after:from-0% [&_pre]:after:from-tint-2 [&_pre]:after:to-70% [&_pre]:after:to-transparent [&_pre]:after:content-[""] [&_pre]:after:[grid-area:2/1]' + : '[&_pre]:h-[calc(2rem+var(--line-count)*var(--line-height))] [&_pre]:overflow-y-hidden [&_pre]:after:opacity-100', + '[&_pre]:after:pointer-events-none [&_pre]:after:absolute [&_pre]:after:inset-0 [&_pre]:after:z-0 [&_pre]:after:bg-gradient-to-t [&_pre]:after:from-0% [&_pre]:after:from-tint-2 [&_pre]:after:to-70% [&_pre]:after:to-transparent [&_pre]:after:content-[""]' )} + style={ + { + '--line-count': collapsedLineCount, + '--line-height': '1.25rem', + } as React.CSSProperties + } > {children}
@@ -158,6 +185,8 @@ function CodeBlockExpandable(props: { children: React.ReactNode; lines: Highligh type="button" onClick={() => setIsExpanded(!isExpanded)} className="my-2 text-primary text-sm opacity-0 focus:opacity-11 group-hover/codeblock-expandable:opacity-11" + aria-expanded={isExpanded} + aria-controls={controls} > {isExpanded ? 'Show less' : `Show all ${lines.length} lines`} diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlockRenderer.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlockRenderer.tsx index a3935ce9c7..e50e874eb8 100644 --- a/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlockRenderer.tsx +++ b/packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlockRenderer.tsx @@ -12,6 +12,7 @@ import type { HighlightLine, HighlightToken } from './highlight'; type CodeBlockRendererProps = Pick, 'block' | 'style'> & { lines: HighlightLine[]; 'aria-busy'?: boolean; + id?: string; }; /** @@ -23,11 +24,12 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer( ) { const { block, style, lines, 'aria-busy': ariaBusy } = props; - const id = useId(); const withLineNumbers = Boolean(block.data.lineNumbers) && block.nodes.length > 1; const withWrap = block.data.overflow === 'wrap'; const title = block.data.title; + const id = useId(); + const codeId = props.id || id; return (
                 
Date: Fri, 24 Oct 2025 11:29:10 +0100
Subject: [PATCH 4/8] chore: format

---
 package.json | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 2f7ec886ed..721d953e18 100644
--- a/package.json
+++ b/package.json
@@ -38,9 +38,7 @@
         "clean": "turbo run clean"
     },
     "workspaces": {
-        "packages": [
-            "packages/*"
-        ],
+        "packages": ["packages/*"],
         "catalog": {
             "@tsconfig/strictest": "^2.0.6",
             "@tsconfig/node20": "^20.1.6",
@@ -63,4 +61,4 @@
         "decode-named-character-reference@1.0.2": "patches/decode-named-character-reference@1.0.2.patch",
         "@vercel/next@4.4.2": "patches/@vercel%2Fnext@4.4.2.patch"
     }
-}
\ No newline at end of file
+}

From 3950428df161be1ccb46eab630ae9b99926da8cb Mon Sep 17 00:00:00 2001
From: Brett Jephson 
Date: Fri, 24 Oct 2025 11:56:58 +0100
Subject: [PATCH 5/8] chore: translations

---
 .../DocumentView/CodeBlock/ClientCodeBlock.tsx           | 9 +++++++--
 .../gitbook/src/components/DocumentView/InlineIcon.tsx   | 4 +---
 packages/gitbook/src/intl/translations/de.ts             | 2 ++
 packages/gitbook/src/intl/translations/en.ts             | 2 ++
 packages/gitbook/src/intl/translations/es.ts             | 2 ++
 packages/gitbook/src/intl/translations/fr.ts             | 2 ++
 packages/gitbook/src/intl/translations/it.ts             | 2 ++
 packages/gitbook/src/intl/translations/ja.ts             | 2 ++
 packages/gitbook/src/intl/translations/nl.ts             | 2 ++
 packages/gitbook/src/intl/translations/no.ts             | 2 ++
 packages/gitbook/src/intl/translations/pt-br.ts          | 2 ++
 packages/gitbook/src/intl/translations/ru.ts             | 2 ++
 packages/gitbook/src/intl/translations/zh.ts             | 2 ++
 13 files changed, 30 insertions(+), 5 deletions(-)

diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx
index fbc58ae351..0761e8a71e 100644
--- a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx
+++ b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx
@@ -7,6 +7,7 @@ import { useAdaptiveVisitor } from '@/components/Adaptive';
 import { useInViewportListener } from '@/components/hooks/useInViewportListener';
 import { useScrollListener } from '@/components/hooks/useScrollListener';
 import { Button } from '@/components/primitives';
+import { t, useLanguage } from '@/intl/client';
 import { tcls } from '@/lib/tailwind';
 import { useDebounceCallback } from 'usehooks-ts';
 import type { BlockProps } from '../Block';
@@ -158,7 +159,7 @@ function CodeBlockExpandable(props: {
 }) {
     const { children, controls, lines = [], collapsedLineCount } = props;
     const [isExpanded, setIsExpanded] = useState(false);
-
+    const language = useLanguage();
     return (
         
- {isExpanded ? 'Show less' : `Show all ${lines.length} lines`} + {t( + language, + isExpanded ? 'code_block_expanded' : 'code_block_collapsed', + lines.length + )}
diff --git a/packages/gitbook/src/components/DocumentView/InlineIcon.tsx b/packages/gitbook/src/components/DocumentView/InlineIcon.tsx index d9c50605a9..e0d92e3a0e 100644 --- a/packages/gitbook/src/components/DocumentView/InlineIcon.tsx +++ b/packages/gitbook/src/components/DocumentView/InlineIcon.tsx @@ -8,10 +8,8 @@ import { textColorToStyle } from './utils/colors'; export async function InlineIcon(props: InlineProps) { const { inline } = props; const icon = inline.data.icon as IconName; - // @ts-expect-error remove this comment once API is updated const color = inline.data.color - ? // @ts-expect-error remove "as DocumentMarkColor['data']['text']" once API is updated - (inline.data.color as DocumentMarkColor['data']['text']) + ? (inline.data.color as DocumentMarkColor['data']['text']) : undefined; return ( diff --git a/packages/gitbook/src/intl/translations/de.ts b/packages/gitbook/src/intl/translations/de.ts index 7a10c8d91d..b741f97efb 100644 --- a/packages/gitbook/src/intl/translations/de.ts +++ b/packages/gitbook/src/intl/translations/de.ts @@ -44,6 +44,8 @@ export const de = { annotation_button_label: 'Kommentar öffnen', code_copied: 'Kopiert!', code_copy: 'Kopieren', + code_block_collapsed: 'Alle ${1} Zeilen anzeigen', + code_block_expanded: 'Weniger anzeigen', table_of_contents_button_label: 'Inhaltsverzeichnis öffnen', cookies_title: 'Cookies', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/en.ts b/packages/gitbook/src/intl/translations/en.ts index 143d27a5b8..76d59c72e7 100644 --- a/packages/gitbook/src/intl/translations/en.ts +++ b/packages/gitbook/src/intl/translations/en.ts @@ -44,6 +44,8 @@ export const en = { annotation_button_label: 'Open annotation', code_copied: 'Copied!', code_copy: 'Copy', + code_block_collapsed: 'Show all ${1} lines', + code_block_expanded: 'Show less', table_of_contents_button_label: 'Open table of contents', cookies_title: 'Cookies', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/es.ts b/packages/gitbook/src/intl/translations/es.ts index 406f209f1f..e5376300b8 100644 --- a/packages/gitbook/src/intl/translations/es.ts +++ b/packages/gitbook/src/intl/translations/es.ts @@ -46,6 +46,8 @@ export const es: TranslationLanguage = { annotation_button_label: 'Abrir anotación', code_copied: '¡Copiado!', code_copy: 'Copiar', + code_block_collapsed: 'Mostrar las ${1} líneas', + code_block_expanded: 'Mostrar menos', table_of_contents_button_label: 'Abrir índice de contenidos', cookies_title: 'Cookies', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/fr.ts b/packages/gitbook/src/intl/translations/fr.ts index 7bc255960e..5e8deeaea8 100644 --- a/packages/gitbook/src/intl/translations/fr.ts +++ b/packages/gitbook/src/intl/translations/fr.ts @@ -43,6 +43,8 @@ export const fr = { annotation_button_label: 'Afficher l’annotation', code_copied: 'Copié !', code_copy: 'Copier', + code_block_collapsed: 'Afficher les ${1} lignes', + code_block_expanded: 'Afficher moins', table_of_contents_button_label: 'Afficher le sommaire', cookies_title: 'Cookies', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/it.ts b/packages/gitbook/src/intl/translations/it.ts index e22c8ff07e..59709f394e 100644 --- a/packages/gitbook/src/intl/translations/it.ts +++ b/packages/gitbook/src/intl/translations/it.ts @@ -46,6 +46,8 @@ export const it: TranslationLanguage = { annotation_button_label: 'Apri annotazione', code_copied: 'Copiato!', code_copy: 'Copia', + code_block_collapsed: 'Mostra tutte le ${1} righe', + code_block_expanded: 'Mostra meno', table_of_contents_button_label: 'Apri indice dei contenuti', cookies_title: 'Cookie', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/ja.ts b/packages/gitbook/src/intl/translations/ja.ts index 0bcf32b68a..5b31e708ac 100644 --- a/packages/gitbook/src/intl/translations/ja.ts +++ b/packages/gitbook/src/intl/translations/ja.ts @@ -46,6 +46,8 @@ export const ja: TranslationLanguage = { annotation_button_label: '注釈を開く', code_copied: 'コピーしました!', code_copy: 'コピー', + code_block_collapsed: 'すべての${1}行を表示', + code_block_expanded: '折りたたむ', table_of_contents_button_label: '目次を開く', cookies_title: 'クッキー', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/nl.ts b/packages/gitbook/src/intl/translations/nl.ts index 0ec2fec4cb..2e3546f139 100644 --- a/packages/gitbook/src/intl/translations/nl.ts +++ b/packages/gitbook/src/intl/translations/nl.ts @@ -46,6 +46,8 @@ export const nl: TranslationLanguage = { annotation_button_label: 'Open annotatie', code_copied: 'Gekopieerd!', code_copy: 'Kopiëren', + code_block_collapsed: 'Toon alle ${1} regels', + code_block_expanded: 'Toon minder', table_of_contents_button_label: 'Open inhoudsopgave', cookies_title: 'Cookies', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/no.ts b/packages/gitbook/src/intl/translations/no.ts index 441ef05a5e..5ff581cab7 100644 --- a/packages/gitbook/src/intl/translations/no.ts +++ b/packages/gitbook/src/intl/translations/no.ts @@ -46,6 +46,8 @@ export const no: TranslationLanguage = { annotation_button_label: 'Åpne merknad', code_copied: 'Kopiert!', code_copy: 'Kopier', + code_block_collapsed: 'Vis alle ${1} linjer', + code_block_expanded: 'Vis færre', table_of_contents_button_label: 'Åpne innholdsfortegnelse', cookies_title: 'Informasjonskapsler', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/pt-br.ts b/packages/gitbook/src/intl/translations/pt-br.ts index 5b13ddf0c9..bb60cc665e 100644 --- a/packages/gitbook/src/intl/translations/pt-br.ts +++ b/packages/gitbook/src/intl/translations/pt-br.ts @@ -44,6 +44,8 @@ export const pt_br = { annotation_button_label: 'Abrir anotação', code_copied: 'Copiado!', code_copy: 'Copiar', + code_block_collapsed: 'Mostrar todas as ${1} linhas', + code_block_expanded: 'Mostrar menos', table_of_contents_button_label: 'Abrir o índice', cookies_title: 'Cookies', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/ru.ts b/packages/gitbook/src/intl/translations/ru.ts index 1246f19d2f..820cb83a58 100644 --- a/packages/gitbook/src/intl/translations/ru.ts +++ b/packages/gitbook/src/intl/translations/ru.ts @@ -44,6 +44,8 @@ export const ru = { annotation_button_label: 'Открыть аннотацию', code_copied: 'Скопировано!', code_copy: 'Копировать', + code_block_collapsed: 'Показать все ${1} строк', + code_block_expanded: 'Показать меньше', table_of_contents_button_label: 'Открыть оглавление', cookies_title: 'Файлы cookies', cookies_prompt: diff --git a/packages/gitbook/src/intl/translations/zh.ts b/packages/gitbook/src/intl/translations/zh.ts index af572171bf..3a9329683a 100644 --- a/packages/gitbook/src/intl/translations/zh.ts +++ b/packages/gitbook/src/intl/translations/zh.ts @@ -45,6 +45,8 @@ export const zh: TranslationLanguage = { annotation_button_label: '打开批注', code_copied: '已复制!', code_copy: '复制', + code_block_collapsed: '显示全部 ${1} 行', + code_block_expanded: '收起', table_of_contents_button_label: '打开目录', cookies_title: 'Cookies', cookies_prompt: '本站使用 cookie 来提供服务并分析流量。浏览本站,即表示您接受${1}。', From cd3566f52adadfcbaf5ad39d1132a05578e493ed Mon Sep 17 00:00:00 2001 From: Brett Jephson Date: Fri, 24 Oct 2025 12:05:01 +0100 Subject: [PATCH 6/8] translations --- .../components/DocumentView/CodeBlock/ClientCodeBlock.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx index 0761e8a71e..9b3352221c 100644 --- a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx +++ b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx @@ -189,11 +189,9 @@ function CodeBlockExpandable(props: { aria-expanded={isExpanded} aria-controls={controls} > - {t( - language, - isExpanded ? 'code_block_expanded' : 'code_block_collapsed', - lines.length - )} + {isExpanded + ? t(language, 'code_block_expanded') + : t(language, 'code_block_collapsed', lines.length)}
From d4039c159e3aff6efc2335d89409750149e5a368 Mon Sep 17 00:00:00 2001 From: Brett Jephson Date: Fri, 24 Oct 2025 13:41:05 +0100 Subject: [PATCH 7/8] fix a z-index issue --- .../components/DocumentView/CodeBlock/ClientCodeBlock.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx index 9b3352221c..3bb7949bbb 100644 --- a/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx +++ b/packages/gitbook/src/components/DocumentView/CodeBlock/ClientCodeBlock.tsx @@ -167,7 +167,7 @@ function CodeBlockExpandable(props: { isExpanded ? '[&_pre]:after:opacity-0' : '[&_pre]:h-[calc(2rem+var(--line-count)*var(--line-height))] [&_pre]:overflow-y-hidden [&_pre]:after:opacity-100', - '[&_pre]:after:pointer-events-none [&_pre]:after:absolute [&_pre]:after:inset-0 [&_pre]:after:z-0 [&_pre]:after:bg-gradient-to-t [&_pre]:after:from-0% [&_pre]:after:from-tint-2 [&_pre]:after:to-70% [&_pre]:after:to-transparent [&_pre]:after:content-[""]' + '[&_pre]:after:pointer-events-none [&_pre]:after:absolute [&_pre]:after:inset-0 [&_pre]:after:z-1 [&_pre]:after:bg-gradient-to-t [&_pre]:after:from-0% [&_pre]:after:from-tint-2 [&_pre]:after:to-70% [&_pre]:after:to-transparent [&_pre]:after:content-[""]' )} style={ { @@ -178,14 +178,14 @@ function CodeBlockExpandable(props: { > {children}
-
+