Reference · NPL
<npl-section>
NPL element
PromptLingo reference ↗
Known section types get a matching header; unknown types get a warning style so a typo is easy to spot. The content stays plain text, so search and copy still work.
A labelled section for any NPL prompt block.
Known section types get a matching header; unknown types get a warning style so a typo is easy to spot. The content stays plain text, so search and copy still work.
required. One of the known section types: `alg`, `alg-pseudo`, `diagram`, `example`, `format`, `logic`, `note`, `syntax`, `template`.
per the global attribute catalog (conventions.md §2)
per the global attribute catalog (conventions.md §2)
per the global attribute catalog (conventions.md §2)
Example
npl-section.html
Copy
Save
split
source
render
source
1
<npl-section type="syntax">
2
<pre> <code> s e c t i o n : = "<npl-section" t y p e ">" b o d y "</npl-section>" </code> </pre>
3
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: type="alg"
The generated header reads Algorithm — same chrome as every known type; only the label and the derived `npl-section-alg` host class differ.
variant: type="alg"
npl-section-alg.html
Copy
Save
split
source
render
source
1
<npl-section type="alg">
2
<ol>
3
<li> R e s o l v e t h e t y p e i n e i t h e r s p e l l i n g . </li>
4
<li> I n s e r t t h e l a b e l l e d h e a d e r a s t h e f i r s t c h i l d . </li>
5
</ol>
6
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: type="alg-pseudo"
The Pseudocode label; the body prose is never rewritten.
variant: type="alg-pseudo"
npl-section-alg-pseudo.html
Copy
Save
split
source
render
source
1
<npl-section type="alg-pseudo">
2
<p> f o r e a c h a u t h o r e d s e c t i o n :
3
<p> r e s o l v e t h e t y p e , t h e n i n s e r t t h e l a b e l l e d h e a d e r </p>
4
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: type="diagram"
The Diagram label; diagrams stay authored content — the component never draws.
variant: type="diagram"
npl-section-diagram.html
Copy
Save
split
source
render
source
1
<npl-section type="diagram">
2
<pre> h e a d e r ─ ┬ ─ l a b e l
3
└ ─ b o d y ( u n t o u c h e d ) </pre>
4
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: type="example"
The Example header.
variant: type="example"
npl-section-example.html
Copy
Save
split
source
render
source
1
<npl-section type="example">
2
<p> A w o r k e d c a s e a u t h o r e d i n t h e b o d y ; t h e h e a d e r n a m e s i t w i t h o u t r e s t a t i n g i t . </p>
3
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: type="logic"
The Logic label.
variant: type="logic"
npl-section-logic.html
Copy
Save
split
source
render
source
1
<npl-section type="logic">
2
<p> k n o w n ( t y p e ) → h e a d e r + d e r i v e d c l a s s
3
<p> u n k n o w n ( t y p e ) → w a r n i n g c l a s s , n o h e a d e r </p>
4
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: type="note"
A known type that stays a plain labelled section — callout behaviour (collapse, role, variant) belongs to sem-note and is not duplicated here.
variant: type="note"
npl-section-note.html
Copy
Save
split
source
render
source
1
<npl-section type="note">
2
R e n d e r s a s a p l a i n l a b e l l e d s e c t i o n ; n o t h i n g h i d e s a n d n o t h i n g c o l l a p s e s .
3
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: type="template"
The Template label.
variant: type="template"
npl-section-template.html
Copy
Save
split
source
render
source
1
<npl-section type="template">
2
& l t ; n p l - s e c t i o n t y p e = "<em>known-type</em>" & g t ; … b o d y … & l t ; / n p l - s e c t i o n & g t ;
3
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
variant: unknown type
An unknown value is never fatal: no header renders, `npl-section-warning` lands on the host, the body reads as plain prose, and one author-facing console warning names the value.
variant: unknown type
npl-section-unknown-type.html
Copy
Save
split
source
render
source
1
<npl-section type="mnemonic">
2
C o n t e n t r e n d e r s p l a i n — t h e u n k n o w n v a l u e a f f e c t s o n l y c h r o m e a n d t h e c o n s o l e w a r n i n g .
3
</npl-section>
render
Live render boots with JavaScript — the authored source is alongside.
Source: spec/schema/npl/npl-section.md