ray/hextra
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(tabs): prevent markdown blockquote parsing when nested in steps (#912)

Browse Source 
* fix(tabs): prevent markdown blockquote parsing when nested in steps

Consolidate HTML attributes onto single lines and add proper whitespace
trimming to prevent `>` characters on separate lines from being
interpreted as markdown blockquotes when tabs are nested inside the
steps shortcode.

Fixes #876

* chore: add comment explaining single-line HTML requirement
This commit is contained in:
Xin
2026-01-24 12:00:47 +00:00
committed by GitHub
parent 02cca4cd0b
commit 162f3a3fa7
1 changed files with 8 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
layouts/_partials/shortcodes/tabs.html
View File

@@ -30,23 +30,11 @@ The `tabs` parameter is a list of dict with the following keys:
{{- /* Generate a unique ID for each tab group. */ -}}
{{- $globalID := printf "tabs-%02v" $tabsID -}}
{{- /* Keep HTML on single lines to avoid `>` being parsed as blockquote when nested in steps (#876) */ -}}
<div class="hextra-scrollbar hx:overflow-x-auto hx:overflow-y-hidden hx:overscroll-x-contain">
<div
class="hx:mt-4 hx:flex hx:w-max hx:min-w-full hx:border-b hx:border-gray-200 hx:pb-px hx:dark:border-neutral-800"
{{ if $enableSync }} data-tab-group="{{ delimit $dataTabGroup `,` }}"{{ end }}
>
<div class="hx:mt-4 hx:flex hx:w-max hx:min-w-full hx:border-b hx:border-gray-200 hx:pb-px hx:dark:border-neutral-800"{{- if $enableSync }} data-tab-group="{{ delimit $dataTabGroup `,` }}"{{- end }}>
{{- range $i, $item := $tabs -}}
<button
class="hextra-tabs-toggle hx:cursor-pointer hx:data-[state=selected]:border-primary-500 hx:data-[state=selected]:text-primary-600 hx:data-[state=selected]:dark:border-primary-500 hx:data-[state=selected]:dark:text-primary-600 hx:mr-2 hx:rounded-t hx:p-2 hx:font-medium hx:leading-5 hx:transition-colors hx:-mb-0.5 hx:select-none hx:border-b-2 hx:border-transparent hx:text-gray-600 hx:hover:border-gray-200 hx:hover:text-black hx:dark:text-gray-200 hx:dark:hover:border-neutral-800 hx:dark:hover:text-white"
role="tab"
type="button"
aria-controls="tabs-panel-{{ $globalID }}-{{ $item.id }}"
{{- if eq $i $selectedIndex -}}
aria-selected="true"
tabindex="0"
data-state="selected"
{{- end }}
>
<button class="hextra-tabs-toggle hx:cursor-pointer hx:data-[state=selected]:border-primary-500 hx:data-[state=selected]:text-primary-600 hx:data-[state=selected]:dark:border-primary-500 hx:data-[state=selected]:dark:text-primary-600 hx:mr-2 hx:rounded-t hx:p-2 hx:font-medium hx:leading-5 hx:transition-colors hx:-mb-0.5 hx:select-none hx:border-b-2 hx:border-transparent hx:text-gray-600 hx:hover:border-gray-200 hx:hover:text-black hx:dark:text-gray-200 hx:dark:hover:border-neutral-800 hx:dark:hover:text-white" role="tab" type="button" aria-controls="tabs-panel-{{ $globalID }}-{{ $item.id }}"{{- if eq $i $selectedIndex }} aria-selected="true" tabindex="0" data-state="selected"{{- end }}>
{{- $item.name -}}
</button>
{{- end -}}
@@ -54,15 +42,7 @@ The `tabs` parameter is a list of dict with the following keys:
</div>
<div>
{{- range $i, $item := $tabs -}}
<div
class="hextra-tabs-panel hx:rounded-sm hx:pt-6 hx:hidden hx:data-[state=selected]:block"
id="tabs-panel-{{ $globalID }}-{{ $item.id }}"
role="tabpanel"
{{- if eq $i $selectedIndex -}}
tabindex="0"
data-state="selected"
{{ end -}}
>
<div class="hextra-tabs-panel hx:rounded-sm hx:pt-6 hx:hidden hx:data-[state=selected]:block" id="tabs-panel-{{ $globalID }}-{{ $item.id }}" role="tabpanel"{{- if eq $i $selectedIndex }} tabindex="0" data-state="selected"{{- end }}>
{{- $item.content | markdownify -}}
</div>
{{- end -}}