From ccf17f9e5c7e950881b1579bcd525d1ebf208fcd Mon Sep 17 00:00:00 2001
From: Teun van den Brand <tahvdbrand@gmail.com>
Date: Sat, 15 Feb 2025 18:02:54 +0100
Subject: [PATCH 1/3] crux composition has background

---
 R/compose-crux.R | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/R/compose-crux.R b/R/compose-crux.R
index 0753cbd..bea05dd 100644
--- a/R/compose-crux.R
+++ b/R/compose-crux.R
@@ -111,7 +111,8 @@ ComposeCrux <- ggproto(
     title_position = "legend.title.position",
     text_position = "legend.text.position",
     title = "legend.title",
-    margin = "legend.margin"
+    margin = "legend.margin",
+    background = "legend.background"
   ),
 
   setup_elements = function(params, elements, theme) {
@@ -220,6 +221,12 @@ ComposeCrux <- ggproto(
       if (!is.null(elems$margin)) {
         gt <- gtable_add_padding(gt, elems$margin)
       }
+      if (!is.zero(elems$background)) {
+        gt <- gtable_add_grob(
+          gt, element_grob(elems$background), name = "background",
+          clip = "off", t = 1, r = -1, b = -1, l = 1, z = -Inf
+        )
+      }
     }
     gt
   }

From 01abd4fd587311e2a1bfc38efd713be8836dc51d Mon Sep 17 00:00:00 2001
From: Teun van den Brand <tahvdbrand@gmail.com>
Date: Sat, 15 Feb 2025 18:03:30 +0100
Subject: [PATCH 2/3] update snapshots

---
 .../_snaps/compose-sandwich/horizontal-sandwich-flipped.svg   | 1 +
 .../testthat/_snaps/compose-sandwich/horizontal-sandwich.svg  | 1 +
 .../_snaps/compose-sandwich/vertical-sandwich-flipped.svg     | 1 +
 tests/testthat/_snaps/compose-sandwich/vertical-sandwich.svg  | 1 +
 tests/testthat/_snaps/guide-colbar/bottom-position.svg        | 4 ++++
 tests/testthat/_snaps/guide-colbar/left-position.svg          | 4 ++++
 tests/testthat/_snaps/guide-colbar/right-position.svg         | 4 ++++
 tests/testthat/_snaps/guide-colbar/top-position.svg           | 4 ++++
 tests/testthat/_snaps/guide-colsteps/bottom-position.svg      | 4 ++++
 tests/testthat/_snaps/guide-colsteps/left-position.svg        | 4 ++++
 tests/testthat/_snaps/guide-colsteps/right-position.svg       | 4 ++++
 tests/testthat/_snaps/guide-colsteps/top-position.svg         | 4 ++++
 12 files changed, 36 insertions(+)

diff --git a/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich-flipped.svg b/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich-flipped.svg
index 1d07647..e842ea7 100644
--- a/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich-flipped.svg
+++ b/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich-flipped.svg
@@ -302,6 +302,7 @@
 <text x='683.53' y='437.70' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='373.66' y='449.84' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='22.62px' lengthAdjust='spacingAndGlyphs'>displ</text>
 <text transform='translate(13.05,224.75) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='19.57px' lengthAdjust='spacingAndGlyphs'>hwy</text>
+<rect x='306.99' y='463.08' width='133.34' height='107.44' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <text x='312.47' y='520.58' style='font-size: 11.00px; font-family: sans;' textLength='14.06px' lengthAdjust='spacingAndGlyphs'>cty</text>
 <rect x='332.01' y='485.38' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <image width='86.40' height='17.28' x='342.97' y='504.22' preserveAspectRatio='none' xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAABCAYAAABkOJMpAAAAz0lEQVQ4jYVSyxXDMAiTnNU6QvcfpeoBGzAmyYFnRRLmE/PDrzAIkMAA6HjG5J1j0mk8Ny74Pk5Nrzmma2E8aMe9y589SEFoYaBoSL2FR3f5jS6fCxAqn3RULp2IOp0WXHjU9GJldMwYc4fGbRe638/tfSq+s0b0p8YHqOVV9hI+0Z7qRVnAnvZFYUAYtO/AwgAwKNA9cMzp5/Rz5tgvW/jkOfmRMPmkNfhJS3jN63PD5ruKZtx+rnnXnozL+wpfzfEdbvVin4fX/W98h3+O/wX2kQrGpaQGAAAAAElFTkSuQmCC'/>
diff --git a/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich.svg b/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich.svg
index 8f6eafd..4958dd1 100644
--- a/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich.svg
+++ b/tests/testthat/_snaps/compose-sandwich/horizontal-sandwich.svg
@@ -302,6 +302,7 @@
 <text x='683.53' y='437.70' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='373.66' y='449.84' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='22.62px' lengthAdjust='spacingAndGlyphs'>displ</text>
 <text transform='translate(13.05,224.75) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='19.57px' lengthAdjust='spacingAndGlyphs'>hwy</text>
+<rect x='306.99' y='463.08' width='133.34' height='107.44' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <text x='312.47' y='520.58' style='font-size: 11.00px; font-family: sans;' textLength='14.06px' lengthAdjust='spacingAndGlyphs'>cty</text>
 <rect x='332.01' y='506.62' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <image width='86.40' height='17.28' x='342.97' y='512.10' preserveAspectRatio='none' xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAABCAYAAABkOJMpAAAAz0lEQVQ4jYVSyxXDMAiTnNU6QvcfpeoBGzAmyYFnRRLmE/PDrzAIkMAA6HjG5J1j0mk8Ny74Pk5Nrzmma2E8aMe9y589SEFoYaBoSL2FR3f5jS6fCxAqn3RULp2IOp0WXHjU9GJldMwYc4fGbRe638/tfSq+s0b0p8YHqOVV9hI+0Z7qRVnAnvZFYUAYtO/AwgAwKNA9cMzp5/Rz5tgvW/jkOfmRMPmkNfhJS3jN63PD5ruKZtx+rnnXnozL+wpfzfEdbvVin4fX/W98h3+O/wX2kQrGpaQGAAAAAElFTkSuQmCC'/>
diff --git a/tests/testthat/_snaps/compose-sandwich/vertical-sandwich-flipped.svg b/tests/testthat/_snaps/compose-sandwich/vertical-sandwich-flipped.svg
index 783c6f5..5512b17 100644
--- a/tests/testthat/_snaps/compose-sandwich/vertical-sandwich-flipped.svg
+++ b/tests/testthat/_snaps/compose-sandwich/vertical-sandwich-flipped.svg
@@ -302,6 +302,7 @@
 <text x='570.72' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='314.56' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='22.62px' lengthAdjust='spacingAndGlyphs'>displ</text>
 <text transform='translate(13.05,283.95) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='19.57px' lengthAdjust='spacingAndGlyphs'>hwy</text>
+<rect x='607.29' y='218.24' width='107.23' height='131.41' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <text x='612.77' y='232.43' style='font-size: 11.00px; font-family: sans;' textLength='14.06px' lengthAdjust='spacingAndGlyphs'>cty</text>
 <rect x='631.49' y='239.05' width='43.51' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <image width='17.28' height='86.40' x='652.24' y='252.30' preserveAspectRatio='none' xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAEsCAYAAAACUNnVAAAA2ElEQVQ4jZWRyRVDIQhFL/SS/stKFUIWOSoomp8NR3gDg7T3y9UQ1FxQQ0mpPEz5G+21FsgkbZa11WUxIALtahCtiAZzllYCoO7SA/JHeqVYqeAnZRxs+tkJtUDpe1iwJ6f5P5ZPmWca2jbSeStxUBxUXPqLWQOlABZFheLSDQqgVgy0BEAFqYGoSBQ/NT/2gP61cdWuEF+CR8p2ukTG/UJZGn3JBWU7ne9oseCc4M4jr3W8c+UXBxoAnmt7iN0yumoLShm4dHvkMijWa76glhUztaydBrahH9ZJlv7ajQdXAAAAAElFTkSuQmCC'/>
diff --git a/tests/testthat/_snaps/compose-sandwich/vertical-sandwich.svg b/tests/testthat/_snaps/compose-sandwich/vertical-sandwich.svg
index 4aeccaa..3b57c5e 100644
--- a/tests/testthat/_snaps/compose-sandwich/vertical-sandwich.svg
+++ b/tests/testthat/_snaps/compose-sandwich/vertical-sandwich.svg
@@ -302,6 +302,7 @@
 <text x='570.72' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='314.56' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='22.62px' lengthAdjust='spacingAndGlyphs'>displ</text>
 <text transform='translate(13.05,283.95) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='19.57px' lengthAdjust='spacingAndGlyphs'>hwy</text>
+<rect x='607.29' y='218.24' width='107.23' height='131.41' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <text x='612.77' y='232.43' style='font-size: 11.00px; font-family: sans;' textLength='14.06px' lengthAdjust='spacingAndGlyphs'>cty</text>
 <rect x='646.81' y='239.05' width='43.51' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <image width='17.28' height='86.40' x='652.29' y='252.30' preserveAspectRatio='none' xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAEsCAYAAAACUNnVAAAA2ElEQVQ4jZWRyRVDIQhFL/SS/stKFUIWOSoomp8NR3gDg7T3y9UQ1FxQQ0mpPEz5G+21FsgkbZa11WUxIALtahCtiAZzllYCoO7SA/JHeqVYqeAnZRxs+tkJtUDpe1iwJ6f5P5ZPmWca2jbSeStxUBxUXPqLWQOlABZFheLSDQqgVgy0BEAFqYGoSBQ/NT/2gP61cdWuEF+CR8p2ukTG/UJZGn3JBWU7ne9oseCc4M4jr3W8c+UXBxoAnmt7iN0yumoLShm4dHvkMijWa76glhUztaydBrahH9ZJlv7ajQdXAAAAAElFTkSuQmCC'/>
diff --git a/tests/testthat/_snaps/guide-colbar/bottom-position.svg b/tests/testthat/_snaps/guide-colbar/bottom-position.svg
index 26bb778..816b875 100644
--- a/tests/testthat/_snaps/guide-colbar/bottom-position.svg
+++ b/tests/testthat/_snaps/guide-colbar/bottom-position.svg
@@ -102,6 +102,7 @@
 <text x='572.23' y='372.01' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='373.66' y='384.15' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(13.05,191.90) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='322.24' y='397.39' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='333.20,420.15 333.20,402.87 419.60,402.87 419.60,420.15 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='333.28,406.33 333.28,402.87 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='354.84,406.33 354.84,402.87 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -118,6 +119,7 @@
 <text x='376.40' y='431.69' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='397.95' y='431.69' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.51' y='431.69' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='441.23' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='348.16,463.99 333.20,455.35 348.16,446.71 419.60,446.71 419.60,463.99 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='348.23,450.17 348.23,446.71 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='366.06,450.17 366.06,446.71 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -134,6 +136,7 @@
 <text x='383.88' y='475.53' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='401.70' y='475.53' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.53' y='475.53' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='485.08' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='333.20,507.84 333.20,490.56 404.63,490.56 419.60,499.20 404.63,507.84 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='333.27,494.01 333.27,490.56 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='351.09,494.01 351.09,490.56 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -150,6 +153,7 @@
 <text x='368.91' y='519.37' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='386.74' y='519.37' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='404.56' y='519.37' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='528.92' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='348.16,551.68 333.20,543.04 348.16,534.40 404.63,534.40 419.60,543.04 404.63,551.68 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='348.22,537.85 348.22,534.40 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='362.31,537.85 362.31,534.40 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
diff --git a/tests/testthat/_snaps/guide-colbar/left-position.svg b/tests/testthat/_snaps/guide-colbar/left-position.svg
index 905f78c..ab6982b 100644
--- a/tests/testthat/_snaps/guide-colbar/left-position.svg
+++ b/tests/testthat/_snaps/guide-colbar/left-position.svg
@@ -102,6 +102,7 @@
 <text x='608.16' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='459.72' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(185.19,283.95) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='128.04' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='133.52,331.03 150.80,331.03 150.80,244.63 133.52,244.63 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='136.98,330.94 133.52,330.94 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='136.98,309.39 133.52,309.39 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -118,6 +119,7 @@
 <text x='156.28' y='290.86' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='156.28' y='269.30' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='156.28' y='247.74' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='87.19' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='92.67,316.06 101.31,331.03 109.95,316.06 109.95,244.63 92.67,244.63 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='96.12,315.99 92.67,315.99 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='96.12,298.17 92.67,298.17 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -134,6 +136,7 @@
 <text x='115.43' y='283.38' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='115.43' y='265.55' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='115.43' y='247.73' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='46.33' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='51.81,331.03 69.09,331.03 69.09,259.59 60.45,244.63 51.81,259.59 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='55.27,330.96 51.81,330.96 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='55.27,313.14 51.81,313.14 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -150,6 +153,7 @@
 <text x='74.57' y='298.34' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='74.57' y='280.52' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='74.57' y='262.69' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='5.48' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='10.96,316.06 19.60,331.03 28.24,316.06 28.24,259.59 19.60,244.63 10.96,259.59 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='14.41,316.01 10.96,316.01 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='14.41,301.92 10.96,301.92 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
diff --git a/tests/testthat/_snaps/guide-colbar/right-position.svg b/tests/testthat/_snaps/guide-colbar/right-position.svg
index 39c5e9e..e336c83 100644
--- a/tests/testthat/_snaps/guide-colbar/right-position.svg
+++ b/tests/testthat/_snaps/guide-colbar/right-position.svg
@@ -102,6 +102,7 @@
 <text x='436.02' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='287.59' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(13.05,283.95) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='553.34' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='558.82,331.03 576.10,331.03 576.10,244.63 558.82,244.63 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='562.28,330.94 558.82,330.94 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='562.28,309.39 558.82,309.39 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -118,6 +119,7 @@
 <text x='581.58' y='290.86' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='581.58' y='269.30' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='581.58' y='247.74' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='594.20' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='599.68,316.06 608.32,331.03 616.96,316.06 616.96,244.63 599.68,244.63 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='603.13,315.99 599.68,315.99 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='603.13,298.17 599.68,298.17 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -134,6 +136,7 @@
 <text x='622.44' y='283.38' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='622.44' y='265.55' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='622.44' y='247.73' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='635.05' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='640.53,331.03 657.81,331.03 657.81,259.59 649.17,244.63 640.53,259.59 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='643.99,330.96 640.53,330.96 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='643.99,313.14 640.53,313.14 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -150,6 +153,7 @@
 <text x='663.29' y='298.34' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='663.29' y='280.52' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='663.29' y='262.69' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='675.91' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='681.39,316.06 690.03,331.03 698.67,316.06 698.67,259.59 690.03,244.63 681.39,259.59 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='684.84,316.01 681.39,316.01 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='684.84,301.92 681.39,301.92 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
diff --git a/tests/testthat/_snaps/guide-colbar/top-position.svg b/tests/testthat/_snaps/guide-colbar/top-position.svg
index b4002c6..253cbe1 100644
--- a/tests/testthat/_snaps/guide-colbar/top-position.svg
+++ b/tests/testthat/_snaps/guide-colbar/top-position.svg
@@ -102,6 +102,7 @@
 <text x='572.23' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='373.66' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(13.05,375.99) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='322.24' y='154.31' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='333.20,177.07 333.20,159.79 419.60,159.79 419.60,177.07 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='333.28,163.25 333.28,159.79 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='354.84,163.25 354.84,159.79 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -118,6 +119,7 @@
 <text x='376.40' y='188.61' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='397.95' y='188.61' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.51' y='188.61' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='110.47' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='348.16,133.23 333.20,124.59 348.16,115.95 419.60,115.95 419.60,133.23 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='348.23,119.40 348.23,115.95 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='366.06,119.40 366.06,115.95 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -134,6 +136,7 @@
 <text x='383.88' y='144.76' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='401.70' y='144.76' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.53' y='144.76' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='66.63' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='333.20,89.39 333.20,72.11 404.63,72.11 419.60,80.75 404.63,89.39 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='333.27,75.56 333.27,72.11 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='351.09,75.56 351.09,72.11 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
@@ -150,6 +153,7 @@
 <text x='368.91' y='100.92' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='386.74' y='100.92' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='404.56' y='100.92' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='22.78' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <polygon points='348.16,45.54 333.20,36.90 348.16,28.26 404.63,28.26 419.60,36.90 404.63,45.54 ' style='stroke-width: 1.07; fill: none;' />
 <polyline points='348.22,31.72 348.22,28.26 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
 <polyline points='362.31,31.72 362.31,28.26 ' style='stroke-width: 1.07; stroke-linecap: butt;' />
diff --git a/tests/testthat/_snaps/guide-colsteps/bottom-position.svg b/tests/testthat/_snaps/guide-colsteps/bottom-position.svg
index 39f4fd9..732fa3d 100644
--- a/tests/testthat/_snaps/guide-colsteps/bottom-position.svg
+++ b/tests/testthat/_snaps/guide-colsteps/bottom-position.svg
@@ -102,6 +102,7 @@
 <text x='572.23' y='372.01' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='373.66' y='384.15' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(13.05,191.90) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='322.24' y='397.39' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='402.87' width='21.56' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='354.84' y='402.87' width='21.56' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='376.40' y='402.87' width='21.56' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -122,6 +123,7 @@
 <text x='376.40' y='431.69' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='397.95' y='431.69' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.51' y='431.69' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='441.23' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='446.71' width='15.04' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='348.23' y='446.71' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='366.06' y='446.71' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
@@ -143,6 +145,7 @@
 <text x='383.88' y='475.53' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='401.70' y='475.53' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.53' y='475.53' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='485.08' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='490.56' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='351.09' y='490.56' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='368.91' y='490.56' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -164,6 +167,7 @@
 <text x='368.91' y='519.37' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='386.74' y='519.37' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='404.56' y='519.37' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='528.92' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='534.40' width='15.02' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='348.22' y='534.40' width='14.09' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='362.31' y='534.40' width='14.09' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
diff --git a/tests/testthat/_snaps/guide-colsteps/left-position.svg b/tests/testthat/_snaps/guide-colsteps/left-position.svg
index 77c5392..719d482 100644
--- a/tests/testthat/_snaps/guide-colsteps/left-position.svg
+++ b/tests/testthat/_snaps/guide-colsteps/left-position.svg
@@ -102,6 +102,7 @@
 <text x='608.16' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='459.72' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(185.19,283.95) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='128.04' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='133.52' y='309.47' width='17.28' height='21.56' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='133.52' y='287.83' width='17.28' height='21.56' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='133.52' y='266.27' width='17.28' height='21.56' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -122,6 +123,7 @@
 <text x='156.28' y='290.86' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='156.28' y='269.30' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='156.28' y='247.74' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='87.19' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='92.67' y='315.99' width='17.28' height='15.04' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='92.67' y='298.17' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='92.67' y='280.35' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
@@ -143,6 +145,7 @@
 <text x='115.43' y='283.38' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='115.43' y='265.55' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='115.43' y='247.73' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='46.33' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='51.81' y='313.21' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='51.81' y='295.31' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='51.81' y='277.49' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -164,6 +167,7 @@
 <text x='74.57' y='298.34' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='74.57' y='280.52' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='74.57' y='262.69' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='5.48' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='10.96' y='316.01' width='17.28' height='15.02' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='10.96' y='301.92' width='17.28' height='14.09' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='10.96' y='287.83' width='17.28' height='14.09' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
diff --git a/tests/testthat/_snaps/guide-colsteps/right-position.svg b/tests/testthat/_snaps/guide-colsteps/right-position.svg
index b36f764..fd8abd6 100644
--- a/tests/testthat/_snaps/guide-colsteps/right-position.svg
+++ b/tests/testthat/_snaps/guide-colsteps/right-position.svg
@@ -102,6 +102,7 @@
 <text x='436.02' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='287.59' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(13.05,283.95) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='553.34' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='558.82' y='309.47' width='17.28' height='21.56' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='558.82' y='287.83' width='17.28' height='21.56' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='558.82' y='266.27' width='17.28' height='21.56' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -122,6 +123,7 @@
 <text x='581.58' y='290.86' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='581.58' y='269.30' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='581.58' y='247.74' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='594.20' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='599.68' y='315.99' width='17.28' height='15.04' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='599.68' y='298.17' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='599.68' y='280.35' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
@@ -143,6 +145,7 @@
 <text x='622.44' y='283.38' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='622.44' y='265.55' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='622.44' y='247.73' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='635.05' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='640.53' y='313.21' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='640.53' y='295.31' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='640.53' y='277.49' width='17.28' height='17.82' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -164,6 +167,7 @@
 <text x='663.29' y='298.34' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='663.29' y='280.52' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='663.29' y='262.69' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='675.91' y='231.39' width='38.61' height='105.12' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='681.39' y='316.01' width='17.28' height='15.02' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='681.39' y='301.92' width='17.28' height='14.09' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='681.39' y='287.83' width='17.28' height='14.09' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
diff --git a/tests/testthat/_snaps/guide-colsteps/top-position.svg b/tests/testthat/_snaps/guide-colsteps/top-position.svg
index 848e924..e29e399 100644
--- a/tests/testthat/_snaps/guide-colsteps/top-position.svg
+++ b/tests/testthat/_snaps/guide-colsteps/top-position.svg
@@ -102,6 +102,7 @@
 <text x='572.23' y='556.10' text-anchor='middle' style='font-size: 8.80px; fill: #4D4D4D; font-family: sans;' textLength='14.68px' lengthAdjust='spacingAndGlyphs'>400</text>
 <text x='373.66' y='568.24' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='20.18px' lengthAdjust='spacingAndGlyphs'>disp</text>
 <text transform='translate(13.05,375.99) rotate(-90)' text-anchor='middle' style='font-size: 11.00px; font-family: sans;' textLength='21.40px' lengthAdjust='spacingAndGlyphs'>mpg</text>
+<rect x='322.24' y='154.31' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='159.79' width='21.56' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='354.84' y='159.79' width='21.56' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='376.40' y='159.79' width='21.56' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -122,6 +123,7 @@
 <text x='376.40' y='188.61' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='397.95' y='188.61' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.51' y='188.61' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='110.47' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='115.95' width='15.04' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='348.23' y='115.95' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='366.06' y='115.95' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
@@ -143,6 +145,7 @@
 <text x='383.88' y='144.76' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='401.70' y='144.76' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='419.53' y='144.76' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='66.63' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='72.11' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='351.09' y='72.11' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />
 <rect x='368.91' y='72.11' width='17.82' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #36AD7F;' />
@@ -164,6 +167,7 @@
 <text x='368.91' y='100.92' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>6</text>
 <text x='386.74' y='100.92' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>7</text>
 <text x='404.56' y='100.92' text-anchor='middle' style='font-size: 8.80px; font-family: sans;' textLength='4.89px' lengthAdjust='spacingAndGlyphs'>8</text>
+<rect x='322.24' y='22.78' width='102.84' height='41.60' style='stroke-width: 1.07; stroke: none; fill: #FFFFFF;' />
 <rect x='333.20' y='28.26' width='15.02' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #440154;' />
 <rect x='348.22' y='28.26' width='14.09' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #452F73;' />
 <rect x='362.31' y='28.26' width='14.09' height='17.28' style='stroke-width: 0.75; stroke: none; fill: #30728D;' />

From 187dde309b733af86d95ab40798e41ee0ad00d18 Mon Sep 17 00:00:00 2001
From: Teun van den Brand <tahvdbrand@gmail.com>
Date: Sat, 15 Feb 2025 18:05:00 +0100
Subject: [PATCH 3/3] add news bullet

---
 NEWS.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/NEWS.md b/NEWS.md
index 12a29a4..e84390b 100644
--- a/NEWS.md
+++ b/NEWS.md
@@ -2,6 +2,8 @@
 
 * Fixed bug hindering `position = "inside"` placement (#42)
 * Fixed bug in `theme_guide(key.size, key.height, key.width)` (#41)
+* Complete guides based on a crux composition now render the `legend.background` 
+  element (#50)
 
 # legendry 0.2.0