refrakt.md

Docs

Runes

Themes

Extend

Project

Plan›Bug
note

This rune is part of @refrakt-md/plan. Install with npm install @refrakt-md/plan and add "@refrakt-md/plan" to the plugins array in your refrakt.config.json.

Bug

Bug report with structured reproduction steps. Separate from work items because bugs have different required sections (reproduction steps, expected/actual behaviour) and different status values. H2 headings create named sections.

Confirmed bug

A bug confirmed with reproduction steps and environment details.

{% bug id="RF-201" status="confirmed" severity="major" %}
# Showcase bleed breaks with overflow:hidden parent

## Steps to Reproduce
1. Create a feature section with a parent that has `overflow: hidden`
2. Add a showcase with `bleed="top"` inside the feature
3. Observe the rendered output

## Expected
Showcase extends above the section boundary with visible displacement.

## Actual
Showcase is clipped at the section edge.

## Environment
- Browser: Chrome 122, Firefox 124
- Theme: default
- refrakt.md: v0.4.2
{% /bug %}
<article data-rune="bug" data-rune-fields="{&quot;id&quot;:&quot;RF-201&quot;,&quot;status&quot;:&quot;confirmed&quot;,&quot;severity&quot;:&quot;major&quot;,&quot;assignee&quot;:&quot;&quot;,&quot;milestone&quot;:&quot;&quot;,&quot;source&quot;:&quot;&quot;,&quot;tags&quot;:&quot;&quot;,&quot;created&quot;:&quot;2026-06-14&quot;,&quot;modified&quot;:&quot;2026-06-14&quot;}">
  <header data-name="title">
    <h1 id="showcase-bleed-breaks-with-overflow:hidden-parent">Showcase bleed breaks with overflow:hidden parent</h1>
  </header>
  <div data-name="body">
    <section data-name="steps-to-reproduce">
      <h2 id="steps-to-reproduce">Steps to Reproduce</h2>
      <ol>
        <li>
          Create a feature section with a parent that has
          <code>overflow: hidden</code>
        </li>
        <li>
          Add a showcase with
          <code>bleed=&quot;top&quot;</code>
          inside the feature
        </li>
        <li>Observe the rendered output</li>
      </ol>
    </section>
    <section data-name="expected">
      <h2 id="expected">Expected</h2>
      <p>Showcase extends above the section boundary with visible displacement.</p>
    </section>
    <section data-name="actual">
      <h2 id="actual">Actual</h2>
      <p>Showcase is clipped at the section edge.</p>
    </section>
    <section data-name="environment">
      <h2 id="environment">Environment</h2>
      <ul>
        <li>Browser: Chrome 122, Firefox 124</li>
        <li>Theme: default</li>
        <li>refrakt.md: v0.4.2</li>
      </ul>
    </section>
  </div>
</article>
RF-201confirmed

Showcase bleed breaks with overflow:hidden parent

Severity
major
Created
Modified

Steps to Reproduce

  1. Create a feature section with a parent that has overflow: hidden
  2. Add a showcase with bleed="top" inside the feature
  3. Observe the rendered output

Expected

Showcase extends above the section boundary with visible displacement.

Actual

Showcase is clipped at the section edge.

Environment

  • Browser: Chrome 122, Firefox 124
  • Theme: default
  • refrakt.md: v0.4.2
<article class="rf-bug rf-bug--RF-201 rf-bug--confirmed rf-bug--major" data-id="RF-201" data-status="confirmed" data-severity="major" data-assignee="" data-milestone="" data-source="" data-tags="" data-created="2026-06-14" data-modified="2026-06-14" data-rune="bug" data-density="full">
  <div data-name="eyebrow" data-zone="eyebrow" data-zone-layout="bar" class="rf-bug__eyebrow">
    <span data-meta-type="id">RF-201</span>
    <span class="rf-badge" data-meta-type="status" data-meta-sentiment="caution" data-align="end">confirmed</span>
  </div>
  <header data-name="title" class="rf-bug__title" data-section="title">
    <h1 id="showcase-bleed-breaks-with-overflow:hidden-parent">Showcase bleed breaks with overflow:hidden parent</h1>
  </header>
  <dl data-name="metadata" data-zone="metadata" data-zone-layout="definition-list" class="rf-bug__metadata">
    <div data-name="row" data-field="severity" class="rf-bug__row">
      <dt data-meta-label="">Severity</dt>
      <dd>
        <span class="rf-badge" data-meta-type="category" data-meta-sentiment="caution">major</span>
      </dd>
    </div>
    <div data-name="row" data-field="created" class="rf-bug__row">
      <dt data-meta-label="">Created</dt>
      <dd data-meta-type="temporal">
        <time datetime="2026-06-14">2026-06-14</time>
      </dd>
    </div>
    <div data-name="row" data-field="modified" class="rf-bug__row">
      <dt data-meta-label="">Modified</dt>
      <dd data-meta-type="temporal">
        <time datetime="2026-06-14">2026-06-14</time>
      </dd>
    </div>
  </dl>
  <div data-name="body" class="rf-bug__body" data-section="body">
    <section data-name="steps-to-reproduce" class="rf-bug__steps-to-reproduce">
      <h2 id="steps-to-reproduce">Steps to Reproduce</h2>
      <ol>
        <li>
          Create a feature section with a parent that has 
          <code>overflow: hidden</code>
        </li>
        <li>
          Add a showcase with 
          <code>bleed=&quot;top&quot;</code>
           inside the feature
        </li>
        <li>Observe the rendered output</li>
      </ol>
    </section>
    <section data-name="expected" class="rf-bug__expected">
      <h2 id="expected">Expected</h2>
      <p>Showcase extends above the section boundary with visible displacement.</p>
    </section>
    <section data-name="actual" class="rf-bug__actual">
      <h2 id="actual">Actual</h2>
      <p>Showcase is clipped at the section edge.</p>
    </section>
    <section data-name="environment" class="rf-bug__environment">
      <h2 id="environment">Environment</h2>
      <ul>
        <li>Browser: Chrome 122, Firefox 124</li>
        <li>Theme: default</li>
        <li>refrakt.md: v0.4.2</li>
      </ul>
    </section>
  </div>
</article>

Critical bug

A critical severity bug requiring immediate attention.

{% bug id="RF-305" status="reported" severity="critical" %}
# Build fails when no rune packages configured

## Steps to Reproduce
1. Create a new refrakt project
2. Remove all entries from packages array
3. Run `npm run build`

## Expected
Build succeeds with only core runes.

## Actual
Build crashes with undefined reference error.
{% /bug %}
<article data-rune="bug" data-rune-fields="{&quot;id&quot;:&quot;RF-305&quot;,&quot;status&quot;:&quot;reported&quot;,&quot;severity&quot;:&quot;critical&quot;,&quot;assignee&quot;:&quot;&quot;,&quot;milestone&quot;:&quot;&quot;,&quot;source&quot;:&quot;&quot;,&quot;tags&quot;:&quot;&quot;,&quot;created&quot;:&quot;2026-06-14&quot;,&quot;modified&quot;:&quot;2026-06-14&quot;}">
  <header data-name="title">
    <h1 id="build-fails-when-no-rune-packages-configured">Build fails when no rune packages configured</h1>
  </header>
  <div data-name="body">
    <section data-name="steps-to-reproduce">
      <h2 id="steps-to-reproduce">Steps to Reproduce</h2>
      <ol>
        <li>Create a new refrakt project</li>
        <li>Remove all entries from packages array</li>
        <li>
          Run
          <code>npm run build</code>
        </li>
      </ol>
    </section>
    <section data-name="expected">
      <h2 id="expected">Expected</h2>
      <p>Build succeeds with only core runes.</p>
    </section>
    <section data-name="actual">
      <h2 id="actual">Actual</h2>
      <p>Build crashes with undefined reference error.</p>
    </section>
  </div>
</article>
RF-305reported

Build fails when no rune packages configured

Severity
critical
Created
Modified

Steps to Reproduce

  1. Create a new refrakt project
  2. Remove all entries from packages array
  3. Run npm run build

Expected

Build succeeds with only core runes.

Actual

Build crashes with undefined reference error.

<article class="rf-bug rf-bug--RF-305 rf-bug--reported rf-bug--critical" data-id="RF-305" data-status="reported" data-severity="critical" data-assignee="" data-milestone="" data-source="" data-tags="" data-created="2026-06-14" data-modified="2026-06-14" data-rune="bug" data-density="full">
  <div data-name="eyebrow" data-zone="eyebrow" data-zone-layout="bar" class="rf-bug__eyebrow">
    <span data-meta-type="id">RF-305</span>
    <span class="rf-badge" data-meta-type="status" data-meta-sentiment="neutral" data-align="end">reported</span>
  </div>
  <header data-name="title" class="rf-bug__title" data-section="title">
    <h1 id="build-fails-when-no-rune-packages-configured">Build fails when no rune packages configured</h1>
  </header>
  <dl data-name="metadata" data-zone="metadata" data-zone-layout="definition-list" class="rf-bug__metadata">
    <div data-name="row" data-field="severity" class="rf-bug__row">
      <dt data-meta-label="">Severity</dt>
      <dd>
        <span class="rf-badge" data-meta-type="category" data-meta-sentiment="negative">critical</span>
      </dd>
    </div>
    <div data-name="row" data-field="created" class="rf-bug__row">
      <dt data-meta-label="">Created</dt>
      <dd data-meta-type="temporal">
        <time datetime="2026-06-14">2026-06-14</time>
      </dd>
    </div>
    <div data-name="row" data-field="modified" class="rf-bug__row">
      <dt data-meta-label="">Modified</dt>
      <dd data-meta-type="temporal">
        <time datetime="2026-06-14">2026-06-14</time>
      </dd>
    </div>
  </dl>
  <div data-name="body" class="rf-bug__body" data-section="body">
    <section data-name="steps-to-reproduce" class="rf-bug__steps-to-reproduce">
      <h2 id="steps-to-reproduce">Steps to Reproduce</h2>
      <ol>
        <li>Create a new refrakt project</li>
        <li>Remove all entries from packages array</li>
        <li>
          Run 
          <code>npm run build</code>
        </li>
      </ol>
    </section>
    <section data-name="expected" class="rf-bug__expected">
      <h2 id="expected">Expected</h2>
      <p>Build succeeds with only core runes.</p>
    </section>
    <section data-name="actual" class="rf-bug__actual">
      <h2 id="actual">Actual</h2>
      <p>Build crashes with undefined reference error.</p>
    </section>
  </div>
</article>

Attributes

AttributeTypeDefaultDescription
idstring—Unique identifier (required)
statusstringreportedCurrent status: reported, confirmed, in-progress, fixed, wontfix, duplicate
severitystringmajorImpact level: critical, major, minor, cosmetic
assigneestring—Person or agent working on this
milestonestring—Milestone for the fix
sourcestring—Comma-separated IDs of specs or decisions this relates to (e.g. SPEC-001)
tagsstring—Comma-separated labels
createdstring$file.createdCreation date (ISO 8601). Auto-populated from git history
modifiedstring$file.modifiedLast modified date (ISO 8601). Auto-populated from git history

Common attributes

All block runes share these attributes for layout and theming.

AttributeTypeDefaultDescription
widthstringcontentPage grid width: content, wide, or full
spacingstring—Vertical spacing: flush, tight, default, loose, or breathe
insetstring—Horizontal padding: flush, tight, default, loose, or breathe
tintstring—Named colour tint from theme configuration
tint-modestringautoColour scheme override: auto, dark, or light
bgstring—Named background preset from theme configuration