@beforesemicolon/builder 1.7.0 → 1.8.1

package/dist/cjs/docs/templates/fading-citrus/assets/markup-logo-name.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 207.25 61.99">
+    <g fill="#000">
+        <path d="m47.74.19c-.93-.39-2.01-.17-2.72.54l-20.38,20.38L4.27.73C3.55.02,2.48-.2,1.54.19.61.58,0,1.49,0,2.5v46.81h5V8.54l16.11,16.11-9.19,9.19,3.54,3.54,9.19-9.19,9.19,9.19,3.54-3.54-9.19-9.19,16.11-16.11v40.77h5V2.5c0-1.01-.61-1.92-1.54-2.31Z"/>
+        <path d="m84.81,19.78v29.53h-4.7v-5.34c-.86,1.84-2.16,3.26-3.9,4.26-1.74,1-3.77,1.5-6.08,1.5-2.62,0-4.92-.63-6.9-1.88-1.98-1.25-3.5-3.02-4.58-5.31-1.08-2.29-1.61-4.96-1.61-8.01s.55-5.74,1.64-8.07c1.1-2.33,2.63-4.14,4.61-5.43,1.98-1.29,4.26-1.94,6.84-1.94,2.31,0,4.32.51,6.05,1.53,1.72,1.02,3.03,2.45,3.93,4.29v-5.11h4.7Zm-7.04,23.04c1.56-1.98,2.35-4.78,2.35-8.42s-.78-6.44-2.35-8.39c-1.57-1.96-3.8-2.94-6.69-2.94s-5.16,1.01-6.78,3.02c-1.62,2.02-2.44,4.82-2.44,8.42s.8,6.38,2.41,8.33c1.6,1.96,3.87,2.94,6.81,2.94s5.13-.99,6.69-2.96Z"/>
+        <path d="m110.46,19.43l-.12,4.34c-.9-.31-1.94-.47-3.11-.47-2.86,0-4.98.89-6.37,2.67-1.39,1.78-2.08,3.94-2.08,6.49v16.85h-4.75v-21.25c0-3.05-.16-5.81-.47-8.28h4.52l.47,5.46c.74-2,1.94-3.52,3.58-4.58,1.64-1.06,3.52-1.58,5.63-1.58.98,0,1.88.12,2.7.35Z"/>
+        <path d="m135.17,49.31l-15.14-14.21v14.21h-4.75V6.11h4.75v27.24l13.91-13.5h6.05l-14.79,14.15,16.2,15.32h-6.22Z"/>
+        <path d="m170.22,19.78v29.53h-4.64v-5.11c-.94,1.8-2.25,3.17-3.93,4.11-1.68.94-3.58,1.41-5.69,1.41-3.48,0-6.12-.98-7.92-2.94-1.8-1.96-2.7-4.85-2.7-8.69v-18.31h4.75v18.2c0,2.66.55,4.62,1.64,5.87,1.09,1.25,2.76,1.88,4.99,1.88,2.62,0,4.73-.85,6.34-2.55,1.6-1.7,2.41-3.94,2.41-6.72v-16.67h4.75Z"/>
+        <path d="m200.97,21.02c2,1.29,3.54,3.1,4.64,5.43,1.1,2.33,1.64,5.02,1.64,8.07s-.55,5.72-1.64,8.01c-1.1,2.29-2.63,4.06-4.61,5.31-1.98,1.25-4.28,1.88-6.9,1.88-2.31,0-4.32-.51-6.05-1.53-1.72-1.02-3.03-2.47-3.93-4.34v18.14h-4.75V28.06c0-3.05-.16-5.81-.47-8.28h4.52l.47,5.69c.82-2.03,2.12-3.61,3.9-4.73,1.78-1.12,3.88-1.67,6.31-1.67,2.58,0,4.87.65,6.87,1.94Zm-1.03,21.84c1.58-1.96,2.38-4.73,2.38-8.33s-.8-6.41-2.41-8.42c-1.61-2.02-3.84-3.02-6.69-3.02s-5.19.98-6.75,2.94c-1.57,1.96-2.35,4.75-2.35,8.39s.78,6.45,2.35,8.42c1.57,1.98,3.82,2.96,6.75,2.96s5.14-.98,6.72-2.94Z"/>
+    </g>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/markup-logo.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 49.29 49.31">
+  <defs>
+    <style>
+      .cls-1 {
+        stroke-width: 0px;
+      }
+    </style>
+  </defs>
+  <g id="Layer_1-2" data-name="Layer 1">
+    <path class="cls-1" d="m47.74.19c-.93-.39-2.01-.17-2.72.54l-20.38,20.38L4.27.73C3.55.02,2.48-.2,1.54.19.61.58,0,1.49,0,2.5v46.81h5V8.54l16.11,16.11-9.19,9.19,3.54,3.54,9.19-9.19,9.19,9.19,3.54-3.54-9.19-9.19,16.11-16.11v40.77h5V2.5c0-1.01-.61-1.92-1.54-2.31Z"/>
+  </g>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/medium2.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns:serif="http://www.serif.com/"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 800 800"
+	 style="enable-background:new 0 0 800 800;" xml:space="preserve">
+<g>
+	<g transform="matrix(1,0,0,1,-246.226,-1.33631)">
+		<path d="M688.9,401.3c0,104.4-84,189-187.7,189s-187.7-84.6-187.7-189s84-189,187.7-189S688.9,297,688.9,401.3"/>
+	</g>
+	<g transform="matrix(1,0,0,1,-246.226,-1.33631)">
+		<path d="M894.8,401.3c0,98.3-42,177.9-93.9,177.9s-93.9-79.7-93.9-177.9s42-177.9,93.9-177.9C852.8,223.4,894.8,303.1,894.8,401.3
+			"/>
+	</g>
+	<g transform="matrix(1,0,0,1,-246.226,-1.33631)">
+		<path d="M979,401.3c0,88-14.8,159.4-33,159.4s-33-71.4-33-159.4s14.8-159.4,33-159.4C964.2,241.9,979,313.3,979,401.3"/>
+	</g>
+</g>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/reactive.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 95 95">
+    <path fill-rule="evenodd" fill="#fff" d="M64.748,63.125a84.879,84.879,0,0,1-1.664,8.389c1.86.464,3.652.826,5.359,1.081,8.02,1.2,14.055.078,16.2-3.646s.106-9.513-4.94-15.857c-1.075-1.351-2.285-2.723-3.617-4.1a84.6,84.6,0,0,1-6.433,5.636,5.891,5.891,0,0,1-4.909,8.5Zm3.646-10.188a5.872,5.872,0,0,0-2.6-1.409q.027-.751.044-1.538.03-1.415.03-2.49c0-2.58-.087-5.109-.253-7.57A86.452,86.452,0,0,1,74.6,47.5c-1.869,1.818-3.947,3.64-6.209,5.438Zm-4.7-1.538a5.894,5.894,0,0,0-4.72,8.175q-.616.386-1.235.761-1.029.624-2.1,1.241l-.01.006c-2.724,1.573-5.445,2.992-8.129,4.253-2.684-1.261-5.406-2.681-8.132-4.255s-5.31-3.217-7.743-4.909c-.249-2.955-.38-6.023-.38-9.171q0-1.412.023-2.449.015-.714.041-1.45a5.891,5.891,0,0,0,4.719-8.175c.413-.257.824-.511,1.237-.761q1.028-.624,2.1-1.241l.01-.005c2.724-1.573,5.446-2.993,8.129-4.254,2.684,1.262,5.406,2.681,8.132,4.255s5.31,3.218,7.743,4.91c.249,2.954.38,6.023.38,9.17q0,1.413-.022,2.449-.016.714-.042,1.45Zm-3.557,9.925q-.644.4-1.31.807-1.065.646-2.146,1.27h0c-2.234,1.29-4.468,2.479-6.682,3.565a86.489,86.489,0,0,0,11.057,4.006c.64-2.528,1.179-5.238,1.6-8.094a5.889,5.889,0,0,1-2.438-1.468l-.085-.087Zm6.921-6.749a3.779,3.779,0,1,1-2.672-1.107,3.764,3.764,0,0,1,2.672,1.107Zm-32.189-20.9q.645-.4,1.311-.807,1.064-.646,2.145-1.27h0c2.234-1.29,4.468-2.479,6.682-3.565a86.326,86.326,0,0,0-11.057-4.005c-.64,2.527-1.179,5.237-1.6,8.093a5.9,5.9,0,0,1,2.438,1.468l.085.087Zm-4.614-1.8a84.879,84.879,0,0,1,1.664-8.389c-1.86-.464-3.652-.826-5.359-1.081-8.019-1.2-14.054-.078-16.2,3.646s-.106,9.513,4.94,15.857c1.075,1.352,2.285,2.723,3.617,4.1a84.373,84.373,0,0,1,6.433-5.635,5.891,5.891,0,0,1,4.909-8.5ZM26.606,42.064a5.881,5.881,0,0,0,2.6,1.408q-.027.753-.044,1.538c-.02.943-.031,1.775-.031,2.49,0,2.58.087,5.109.254,7.57A86.572,86.572,0,0,1,20.4,47.5c1.87-1.818,3.948-3.64,6.21-5.437ZM33.29,35.08A3.779,3.779,0,1,0,34.4,37.753,3.771,3.771,0,0,0,33.29,35.08ZM62.537,73.546a49.456,49.456,0,0,1-4.121,10.345C55.4,89.313,51.641,92.5,47.5,92.5c-5.257,0-9.924-5.176-13.22-13.543-.661-1.677-1.269-3.487-1.818-5.411-1.943.488-3.816.867-5.6,1.133C17.973,76.008,11.16,74.553,8.532,70c-2.071-3.587-1.193-8.438,1.995-13.758a49.4,49.4,0,0,1,6.9-8.742c-1.393-1.439-2.657-2.871-3.78-4.282C8.05,36.184,5.9,29.557,8.532,25s9.442-6.012,18.329-4.683c1.785.266,3.659.645,5.6,1.133A49.424,49.424,0,0,1,36.584,11.11C39.6,5.687,43.36,2.5,47.5,2.5c5.257,0,9.925,5.175,13.22,13.543.661,1.677,1.269,3.487,1.818,5.411,1.943-.488,3.816-.867,5.6-1.133,8.888-1.329,15.7.126,18.329,4.679,2.071,3.588,1.193,8.438-2,13.758a49.4,49.4,0,0,1-6.9,8.742c1.393,1.439,2.657,2.871,3.78,4.282C86.95,58.816,89.1,65.443,86.468,70s-9.442,6.012-18.33,4.683c-1.784-.266-3.658-.645-5.6-1.133ZM18.911,48.989a47.132,47.132,0,0,0-6.58,8.333C9.544,61.973,8.7,66.083,10.353,68.945c2.151,3.726,8.186,4.848,16.2,3.65,1.708-.255,3.5-.616,5.359-1.081a90.427,90.427,0,0,1-2.3-13.692,90.533,90.533,0,0,1-10.7-8.833ZM31.892,59.4a86.578,86.578,0,0,0,2.057,11.576,86.411,86.411,0,0,0,11.056-4c-2.215-1.086-4.449-2.275-6.683-3.566s-4.382-2.63-6.43-4.005ZM47.5,68.151A90.542,90.542,0,0,0,60.506,73a47.22,47.22,0,0,1-3.928,9.865c-2.633,4.737-5.77,7.522-9.078,7.522-4.3,0-8.29-4.663-11.259-12.2C35.607,76.583,35.024,74.849,34.5,73a90.522,90.522,0,0,0,13-4.853ZM34.494,22a47.22,47.22,0,0,1,3.928-9.865C41.055,7.394,44.192,4.61,47.5,4.61c4.3,0,8.29,4.662,11.259,12.2.634,1.608,1.217,3.342,1.745,5.187a90.522,90.522,0,0,0-13,4.853A90.542,90.542,0,0,0,34.494,22ZM50,28.033c2.214,1.086,4.449,2.276,6.683,3.566s4.382,2.63,6.43,4a86.549,86.549,0,0,0-2.057-11.576A86.411,86.411,0,0,0,50,28.033Zm15.393,9.145a90.533,90.533,0,0,1,10.7,8.833,47.178,47.178,0,0,0,6.58-8.333c2.787-4.651,3.631-8.761,1.978-11.623-2.151-3.726-8.186-4.848-16.2-3.65-1.707.255-3.5.617-5.358,1.081A90.427,90.427,0,0,1,65.388,37.178Z"/>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/reddit.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns:serif="http://www.serif.com/"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 800 800"
+	 style="enable-background:new 0 0 800 800;" xml:space="preserve">
+<path d="M680.4,326.7c-21.5,0-40.4,8.2-54.3,22.1c-53.7-38.5-128.2-63.8-210.3-66.9l36-168.6l116.8,24.6
+	c1.3,29.7,25.9,53.7,56.2,53.7c30.9,0,56.2-25.3,56.2-56.2c0-30.9-25.3-56.2-56.2-56.2c-22.1,0-41.1,12.6-49.9,31.6L444.2,82.9
+	c-3.8-0.6-7.6,0-10.7,1.9s-5.1,5.1-6.3,8.8l-39.8,188.2c-84,2.5-159.2,27.2-213.5,66.9c-13.9-13.3-33.5-22.1-54.3-22.1
+	c-43.6,0-78.9,35.4-78.9,78.9c0,32.2,18.9,59.4,46.7,72c-1.3,7.6-1.9,15.8-1.9,24c0,121.3,140.8,219.2,315.2,219.2
+	c174.3,0,315.2-97.9,315.2-219.2c0-8.2-0.6-15.8-1.9-23.4c25.9-12.6,45.5-40.4,45.5-72.6C759.4,362.1,724,326.7,680.4,326.7z
+	 M217.4,470.7c0-30.9,25.3-56.2,56.2-56.2c30.9,0,56.2,25.3,56.2,56.2c0,30.9-25.3,56.2-56.2,56.2
+	C242.7,526.9,217.4,501.7,217.4,470.7z M531.3,619.1L531.3,619.1c-38.5,38.5-111.8,41.1-133.3,41.1c-21.5,0-95.4-3.2-133.3-41.1
+	c-5.7-5.7-5.7-15.2,0-20.8c5.7-5.7,15.2-5.7,20.8,0c24,24,75.8,32.8,113.1,32.8c37.3,0,88.4-8.8,113.1-32.8c5.7-5.7,15.2-5.7,20.8,0
+	C537,604.6,537,613.5,531.3,619.1z M521.2,526.9c-30.9,0-56.2-25.3-56.2-56.2c0-30.9,25.3-56.2,56.2-56.2
+	c30.9,0,56.2,25.3,56.2,56.2C577.4,501.7,552.2,526.9,521.2,526.9z"/>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/simple.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px"
+     viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
+    <g fill="#fff">
+        <path d="M69.2,50.5H30.6c-0.5,0-1-0.3-1.3-0.8c-0.3-0.5-0.3-1,0-1.5l19.3-33.4c0.3-0.5,0.8-0.7,1.3-0.7s1,0.3,1.3,0.7l19.3,33.4  c0.3,0.5,0.3,1,0,1.5C70.2,50.2,69.7,50.5,69.2,50.5z M33.2,47.5h33.4L49.9,18.6L33.2,47.5z"/>
+        <path d="M81.9,85.9H51.8c-0.8,0-1.5-0.7-1.5-1.5V54.3c0-0.8,0.7-1.5,1.5-1.5h30.1c0.8,0,1.5,0.7,1.5,1.5v30.1  C83.4,85.2,82.7,85.9,81.9,85.9z M53.3,82.9h27.1V55.8H53.3V82.9z"/>
+        <path d="M30.6,85.8c-9.1,0-16.5-7.4-16.5-16.5s7.4-16.5,16.5-16.5s16.5,7.4,16.5,16.5S39.7,85.8,30.6,85.8z M30.6,55.8  c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S38,55.8,30.6,55.8z"/>
+    </g>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/small.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px"
+     viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
+    <g fill="#fff">
+        <polygon points="43.4,91.7 43.4,56.6 8.5,56.6 8.5,65.4 28.4,65.4 5.2,88.6 11.4,94.8 34.6,71.6 34.6,91.7  "/>
+        <polygon
+                points="88.6,5.2 65.4,28.4 65.4,8.4 56.6,8.4 56.6,43.4 91.5,43.4 91.5,34.6 71.6,34.6 94.8,11.4  "/>
+    </g>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/twitter.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns:serif="http://www.serif.com/"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 800 800"
+	 style="enable-background:new 0 0 800 800;" xml:space="preserve">
+<path d="M276,671.5c252.2,0,390.2-209,390.2-390.2c0-5.9,0-11.8-0.4-17.7c26.8-19.4,50-43.4,68.4-71c-25,11.1-51.6,18.4-78.8,21.6
+	c28.6-17.1,50.1-44.1,60.3-75.8c-26.9,16-56.4,27.2-87.1,33.3c-25.9-27.6-62.1-43.2-100-43.2c-75.3,0-137.3,62-137.3,137.3
+	c0,10.4,1.2,20.9,3.6,31c-110.2-5.5-213-57.6-282.6-143.3c-36.2,62.3-17.5,143,42.5,183.1c-21.8-0.6-43.2-6.5-62.2-17.2v1.7
+	c0,65,46.3,121.5,110,134.4c-20.2,5.5-41.4,6.3-61.9,2.4c17.9,55.7,69.6,94.1,128.1,95.2c-48.5,38.2-108.6,58.9-170.3,58.8
+	c-10.9,0-21.8-0.7-32.6-2c62.7,40.2,135.7,61.6,210.2,61.5"/>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/assets/youtube.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns:serif="http://www.serif.com/"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 800 800"
+	 style="enable-background:new 0 0 800 800;" xml:space="preserve">
+<path d="M714.1,242.2c-7.5-28.2-29.7-50.4-58-58C605,170.6,400,170.6,400,170.6s-205,0-256.1,13.7c-28.2,7.5-50.4,29.7-58,58
+	C72.2,293.3,72.2,400,72.2,400s0,106.7,13.7,157.8c7.5,28.2,29.8,50.4,58,58C195,629.4,400,629.4,400,629.4s205,0,256.1-13.7
+	c28.2-7.5,50.4-29.8,58-58c13.7-51.1,13.7-157.8,13.7-157.8S727.8,293.3,714.1,242.2L714.1,242.2z M334.4,498.3V301.7L504.7,400
+	L334.4,498.3L334.4,498.3z"/>
+</svg>

package/dist/cjs/docs/templates/fading-citrus/layouts/_code-snippet.js

@@ -0,0 +1,75 @@
+export const escapeHTML = (value) =>
+    value
+        .replace(/&/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#39;')
+
+export const highlightLine = (line) => {
+    const tokens = []
+    const regex =
+        /(\/\/.*$)|(`[^`]*`|'[^']*'|"[^"]*")|(<\/?[a-zA-Z][\w-]*)|(\b(?:const|let|var|function|return|import|from|export|new|class|if|else|extends|static|async|await|try|catch)\b|=>)|(\$\{[^}]*\}|\{[^{}]*\})|([a-zA-Z-]+)(?==)/g
+    let lastIndex = 0
+    let match
+
+    while ((match = regex.exec(line)) !== null) {
+        if (match.index > lastIndex) {
+            tokens.push(escapeHTML(line.slice(lastIndex, match.index)))
+        }
+
+        const value = escapeHTML(match[0])
+
+        if (match[1]) {
+            tokens.push(`<span class="syntax-comment">${value}</span>`)
+        } else if (match[2]) {
+            tokens.push(`<span class="syntax-string">${value}</span>`)
+        } else if (match[3]) {
+            tokens.push(`<span class="syntax-tag">${value}</span>`)
+        } else if (match[4]) {
+            tokens.push(`<span class="syntax-keyword">${value}</span>`)
+        } else if (match[5]) {
+            tokens.push(`<span class="syntax-expression">${value}</span>`)
+        } else if (match[6]) {
+            tokens.push(`<span class="syntax-attr">${value}</span>`)
+        }
+
+        lastIndex = match.index + match[0].length
+    }
+
+    if (lastIndex < line.length) {
+        tokens.push(escapeHTML(line.slice(lastIndex)))
+    }
+
+    return tokens.join('')
+}
+
+export const renderCodeBlock = (filename, code, lang = 'javascript') => {
+    const lines = code
+        .replace(/\n$/, '')
+        .split('\n')
+        .map((line, index) => {
+            const highlightedLine = line ? highlightLine(line) : ' '
+
+            return `<span class="code-line"><span class="line-number">${index + 1}</span><span class="line-code">${highlightedLine}</span></span>`
+        })
+        .join('')
+
+    return `
+    <div class="code-snippet" data-code="${escapeHTML(code.replace(/\n$/, ''))}">
+        <div class="header">
+            <div class="mac-dots">
+                <span class="dot-red"></span>
+                <span class="dot-yellow"></span>
+                <span class="dot-green"></span>
+            </div>
+            <div class="filename">${filename}</div>
+            <div class="label">${lang}</div>
+            <button class="code-copy-btn" aria-label="Copy code">copy</button>
+        </div>
+        <div class="content">
+            <pre><code class="hljs language-${lang}">${lines}</code></pre>
+        </div>
+    </div>
+    `
+}

package/dist/cjs/docs/templates/fading-citrus/layouts/_copy-code.js

@@ -0,0 +1,50 @@
+export default () => `
+<script type="application/javascript">
+    // handle all possible copy snippet code button on the page
+    // this implementation is in sync with CodeSnippet partial
+    document.querySelectorAll('.code-copy-btn').forEach((copyBtn) => {
+        const snippet = copyBtn.closest('.code-snippet')
+        const hasCode = snippet?.dataset.code || snippet?.querySelector('code') || snippet?.querySelector('.content')
+        if (hasCode) {
+            copyBtn.style.visibility = 'visible'
+        }
+    })
+
+    document.addEventListener('click', (e) => {
+        const copyBtn = e.target.closest('.code-copy-btn')
+        if (!copyBtn) return
+
+        const snippet = copyBtn.closest('.code-snippet')
+        if (!snippet) return
+
+        let code = snippet.dataset.code ?? ''
+
+        if (!code) {
+            const codeEl = snippet.querySelector('code')
+            if (codeEl) {
+                const clone = codeEl.cloneNode(true)
+                clone.querySelectorAll('.line-number').forEach(el => el.remove())
+                code = clone.textContent ?? ''
+            }
+        }
+
+        if (!code) {
+            code = snippet.querySelector('.content')?.textContent ?? ''
+        }
+
+        // no code, no copy button
+        if (code.trim().length) {
+            clearTimeout(copyBtn._timer)
+            navigator.clipboard.writeText(code.trim())
+            copyBtn.textContent = 'copied'
+            copyBtn.setAttribute('aria-label', 'Code copied')
+            copyBtn.classList.add('copied')
+            copyBtn._timer = setTimeout(() => {
+                copyBtn.textContent = 'copy'
+                copyBtn.setAttribute('aria-label', 'Copy code')
+                copyBtn.classList.remove('copied')
+            }, 1000)
+        }
+    })
+</script>
+`

package/dist/cjs/docs/templates/fading-citrus/layouts/_footer.js

@@ -0,0 +1,72 @@
+import logo from './_logo.js'
+
+const social = [
+    {
+        link: 'https://medium.com/before-semicolon',
+        icon: 'assets/medium2.svg',
+        name: 'Medium blog',
+    },
+    {
+        link: 'https://www.facebook.com/beforesemicolon/',
+        icon: 'assets/facebook.svg',
+        name: 'Facebook',
+    },
+    {
+        link: 'https://www.instagram.com/before_semicolon_/',
+        icon: 'assets/instagram.svg',
+        name: 'Instagram',
+    },
+    {
+        link: 'https://www.reddit.com/r/beforesemicolon/',
+        icon: 'assets/reddit.svg',
+        name: 'Reddit',
+    },
+    {
+        link: 'https://twitter.com/BeforeSemicolon',
+        icon: 'assets/twitter.svg',
+        name: 'Twitter',
+    },
+    {
+        link: 'https://www.youtube.com/channel/UCrU33aw1k9BqTIq2yKXrmBw',
+        icon: 'assets/youtube.svg',
+        name: 'YouTube',
+    },
+]
+
+export default () => `
+<footer class="site-footer">
+    <div class="footer-inner wrapper">
+        <div class="footer-brand">
+            ${logo({ fill: 'currentColor', width: '100px' })}
+            <p>A reactive HTML templating system for building dynamic UIs with pure JavaScript. No build step. No virtual DOM.</p>
+        </div>
+        <ul class="footer-links">
+            <li><h4>Learning Resources</h4></li>
+            <li><a href="/documentation">Documentation</a></li>
+            <li><a target="_blank" rel="noopener" href="https://www.youtube.com/watch?v=mIr2XglV5nQ&list=PLpWvGP6yhJUgWNiz25vj__CArY9Z0O6ke&index=1">Essentials Training</a></li>
+        </ul>
+        <ul class="footer-links">
+            <li><h4>About <em>Before Semicolon</em></h4></li>
+            <li><a href="https://github.com/beforesemicolon" rel="noopener" target="_blank">Open Source</a></li>
+            <li><a href="https://beforesemicolon.com/" rel="noopener" target="_blank">Website</a></li>
+            <li><a href="https://medium.com/before-semicolon" rel="noopener" target="_blank">Blog</a></li>
+            <li><a href="https://www.youtube.com/channel/UCrU33aw1k9BqTIq2yKXrmBw" rel="noopener" target="_blank">YouTube Channel</a></li>
+        </ul>
+        <div class="footer-social" aria-label="social-media">
+            ${social
+                .map(
+                    (s) => `
+                    <a href="${s.link}" rel="noopener" target="_blank" aria-label="${s.name}">
+                        <img src="/${s.icon}" alt="" aria-hidden="true" width="16" height="16" />
+                    </a>
+                `
+                )
+                .join('')}
+        </div>
+        <div class="footer-credit">
+            <img width="20" height="20" src="/assets/before-semicolon-logo.png" alt="Before Semicolon logo" />
+            <span>Copyright &copy; ${new Date().getFullYear()} Before Semicolon. All rights reserved.</span>
+        </div>
+    </div>
+</footer>
+`

package/dist/cjs/docs/templates/fading-citrus/layouts/_head-meta.js

@@ -0,0 +1,231 @@
+/* global process */
+const isDev = process.env.NODE_ENV === 'development'
+
+const siteUrl = 'https://markup.beforesemicolon.com'
+const siteName = 'Markup'
+const defaultTitle = 'Markup by Before Semicolon'
+const defaultDescription =
+    'Markup is a tiny reactive HTML templating system for building JavaScript user interfaces with web standards, no JSX, and no build step.'
+const defaultImage = `${siteUrl}/assets/markup-banner.jpg`
+const baseKeywords = [
+    'Markup',
+    '@beforesemicolon/markup',
+    'reactive HTML',
+    'JavaScript templating',
+    'template literals',
+    'web components',
+    'state management',
+    'no build step',
+    'vanilla JavaScript',
+]
+
+const escapeHTML = (value = '') =>
+    String(value)
+        .replace(/&/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#39;')
+
+const canonicalPath = (path = '/') => {
+    const cleanPath = path.split('?')[0].split('#')[0] || '/'
+
+    if (cleanPath === '/index.html') return '/'
+    if (cleanPath.endsWith('/index.html')) {
+        return cleanPath.replace(/index\.html$/, '')
+    }
+
+    return cleanPath.replace(/\.html$/, '')
+}
+
+const absoluteUrl = (path = '/') => `${siteUrl}${canonicalPath(path)}`
+
+const compactDescription = (description) =>
+    (description || defaultDescription).replace(/\s+/g, ' ').trim()
+
+const pageKeywords = ({ title, name, keywords } = {}) => {
+    const values = [
+        ...baseKeywords,
+        title?.replace(/ - Markup by Before Semicolon$/, ''),
+        name,
+        ...(Array.isArray(keywords)
+            ? keywords
+            : String(keywords || '').split(',')),
+    ]
+
+    return [...new Set(values.map((value) => value?.trim()).filter(Boolean))]
+        .slice(0, 18)
+        .join(', ')
+}
+
+const jsonScript = (data) =>
+    `<script type="application/ld+json">${JSON.stringify(data)
+        .replace(/</g, '\\u003c')
+        .replace(/>/g, '\\u003e')
+        .replace(/&/g, '\\u0026')}</script>`
+
+const breadcrumbJson = ({ title, path }) => {
+    const cleanPath = canonicalPath(path)
+    const parts = cleanPath.split('/').filter(Boolean)
+    const items = [
+        {
+            '@type': 'ListItem',
+            position: 1,
+            name: 'Home',
+            item: siteUrl,
+        },
+    ]
+
+    let current = ''
+    parts.forEach((part, index) => {
+        current += `/${part}`
+        items.push({
+            '@type': 'ListItem',
+            position: index + 2,
+            name:
+                index === parts.length - 1
+                    ? title.replace(/ - Markup by Before Semicolon$/, '')
+                    : part
+                          .split('-')
+                          .map((word) => word[0]?.toUpperCase() + word.slice(1))
+                          .join(' '),
+            item: `${siteUrl}${current}`,
+        })
+    })
+
+    return {
+        '@context': 'https://schema.org',
+        '@type': 'BreadcrumbList',
+        itemListElement: items,
+    }
+}
+
+const pageJson = ({ title, description, path, name }) => {
+    const isDocsPage = canonicalPath(path).startsWith('/documentation')
+    const url = absoluteUrl(path)
+
+    if (isDocsPage) {
+        return {
+            '@context': 'https://schema.org',
+            '@type': 'TechArticle',
+            headline: title,
+            name: name || title,
+            description,
+            url,
+            image: defaultImage,
+            inLanguage: 'en-US',
+            isPartOf: {
+                '@type': 'TechArticle',
+                name: 'Markup Documentation',
+                url: `${siteUrl}/documentation`,
+            },
+            about: [
+                'Reactive HTML templating',
+                'JavaScript template literals',
+                'Markup state and effect APIs',
+                'Web Components',
+            ],
+            publisher: {
+                '@type': 'Organization',
+                name: 'Before Semicolon',
+                url: 'https://beforesemicolon.com',
+                logo: {
+                    '@type': 'ImageObject',
+                    url: `${siteUrl}/assets/before-semicolon-logo.png`,
+                },
+            },
+            mainEntityOfPage: url,
+        }
+    }
+
+    return {
+        '@context': 'https://schema.org',
+        '@type': 'SoftwareSourceCode',
+        name: 'Markup',
+        alternateName: '@beforesemicolon/markup',
+        description,
+        url,
+        image: defaultImage,
+        codeRepository: 'https://github.com/beforesemicolon/markup',
+        programmingLanguage: 'JavaScript',
+        runtimePlatform: 'Browser and Node.js',
+        license: 'https://github.com/beforesemicolon/markup/blob/main/LICENSE',
+        publisher: {
+            '@type': 'Organization',
+            name: 'Before Semicolon',
+            url: 'https://beforesemicolon.com',
+        },
+    }
+}
+
+export default (props = {}) => {
+    const title = props.title || defaultTitle
+    const description = compactDescription(props.description)
+    const url = absoluteUrl(props.path)
+    const canonical = escapeHTML(url)
+    const image = props.image || defaultImage
+    const type = canonicalPath(props.path).startsWith('/documentation')
+        ? 'article'
+        : 'website'
+
+    return `
+<meta charset="UTF-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<meta http-equiv="X-UA-Compatible" content="ie=edge" />
+<title>${escapeHTML(title)}</title>
+<meta name="description" content="${escapeHTML(description)}" />
+<meta name="keywords" content="${escapeHTML(pageKeywords(props))}" />
+<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
+<meta name="googlebot" content="index, follow" />
+<meta name="author" content="Before Semicolon" />
+<meta name="publisher" content="Before Semicolon" />
+<meta name="application-name" content="${siteName}" />
+<meta name="generator" content="@beforesemicolon/builder" />
+<meta name="theme-color" content="#080d12" />
+<meta name="color-scheme" content="dark light" />
+<link rel="canonical" href="${canonical}" />
+<link rel="home" href="${siteUrl}/" />
+<link rel="sitemap" type="application/xml" href="/sitemap.xml" />
+<link rel="alternate" type="text/plain" title="LLMs guide" href="/llms.txt" />
+<link rel="alternate" type="text/plain" title="Full LLM documentation export" href="/llms-full.txt" />
+<meta property="og:title" content="${escapeHTML(title)}" />
+<meta property="og:type" content="${type}" />
+<meta property="og:description" content="${escapeHTML(description)}" />
+<meta property="og:image" content="${escapeHTML(image)}" />
+<meta property="og:image:secure_url" content="${escapeHTML(image)}" />
+<meta property="og:image:width" content="1200" />
+<meta property="og:image:height" content="630" />
+<meta property="og:image:alt" content="${escapeHTML(title)}" />
+<meta property="og:url" content="${canonical}" />
+<meta property="og:site_name" content="${siteName}" />
+<meta property="og:locale" content="en_US" />
+<meta name="twitter:card" content="summary_large_image" />
+<meta name="twitter:site" content="@BeforeSemicolon" />
+<meta name="twitter:creator" content="@BeforeSemicolon" />
+<meta name="twitter:title" content="${escapeHTML(title)}" />
+<meta name="twitter:image" content="${escapeHTML(image)}" />
+<meta name="twitter:description" content="${escapeHTML(description)}" />
+<meta name="twitter:image:alt" content="${escapeHTML(title)}" />
+<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicon/apple-touch-icon.png" />
+<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon/favicon-32x32.png" />
+<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon/favicon-16x16.png" />
+<link rel="manifest" href="/assets/favicon/site.webmanifest" />
+<link rel="icon" type="image/x-icon" href="/assets/favicon/favicon.ico" />
+<link rel="stylesheet" href="/stylesheets/github-dark.hightlighter.css">
+${jsonScript(pageJson({ ...props, title, description }))}
+${jsonScript(breadcrumbJson({ title, path: props.path }))}
+${
+    isDev
+        ? ''
+        : `<!-- Google tag (gtag.js) -->
+<script async src="https://www.googletagmanager.com/gtag/js?id=G-N3MXGDP5PS"></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+
+  gtag('config', 'G-N3MXGDP5PS');
+</script>`
+}
+`
+}

package/dist/cjs/docs/templates/fading-citrus/layouts/_header.js

@@ -0,0 +1,41 @@
+import logo from './_logo.js'
+
+export default (props = {}) => {
+    const isDocs = props.path?.startsWith('/documentation')
+
+    return `
+<header class="site-header">
+    <div class="header-inner wrapper">
+        <h1>
+            <a href="/" aria-label="Markup home">
+                ${logo({ fill: 'currentColor', width: '90px' })}
+            </a>
+        </h1>
+        ${
+            isDocs
+                ? `
+        <nav class="nav-actions docs-actions">
+            <a href="https://github.com/beforesemicolon/markup" target="_blank" rel="noopener" aria-label="Markup GitHub repository" class="github-link docs-github-link">
+                <span>v${props.projectMeta?.version || ''}</span>
+                <svg aria-hidden="true" viewBox="0 0 24 24" width="16" height="16" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg>
+            </a>
+        </nav>
+        `
+                : `
+        <nav class="nav-links">
+            <a href="/#features">Features</a>
+            <a href="/#code">Code</a>
+            <a href="/#install">Install</a>
+        </nav>
+        <nav class="nav-actions">
+            <a href="https://github.com/beforesemicolon/markup" target="_blank" rel="noopener" aria-label="GitHub" class="github-link">
+                <svg aria-hidden="true" viewBox="0 0 24 24" width="16" height="16" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg>
+            </a>
+            <a href="/documentation" class="btn-primary">Documentation</a>
+        </nav>
+        `
+        }
+    </div>
+</header>
+`
+}

package/dist/cjs/docs/templates/fading-citrus/layouts/_logo.js

@@ -0,0 +1,31 @@
+export default ({ fill = '#D2ECFF', width = '80px' } = {}) => `
+<svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 207.25 61.99"
+    width="207.25"
+    height="61.99"
+    aria-hidden="true"
+    style="width: ${width}; height: auto"
+>
+    <g fill="${fill}">
+        <path
+            d="m47.74.19c-.93-.39-2.01-.17-2.72.54l-20.38,20.38L4.27.73C3.55.02,2.48-.2,1.54.19.61.58,0,1.49,0,2.5v46.81h5V8.54l16.11,16.11-9.19,9.19,3.54,3.54,9.19-9.19,9.19,9.19,3.54-3.54-9.19-9.19,16.11-16.11v40.77h5V2.5c0-1.01-.61-1.92-1.54-2.31Z"
+        />
+        <path
+            d="m84.81,19.78v29.53h-4.7v-5.34c-.86,1.84-2.16,3.26-3.9,4.26-1.74,1-3.77,1.5-6.08,1.5-2.62,0-4.92-.63-6.9-1.88-1.98-1.25-3.5-3.02-4.58-5.31-1.08-2.29-1.61-4.96-1.61-8.01s.55-5.74,1.64-8.07c1.1-2.33,2.63-4.14,4.61-5.43,1.98-1.29,4.26-1.94,6.84-1.94,2.31,0,4.32.51,6.05,1.53,1.72,1.02,3.03,2.45,3.93,4.29v-5.11h4.7Zm-7.04,23.04c1.56-1.98,2.35-4.78,2.35-8.42s-.78-6.44-2.35-8.39c-1.57-1.96-3.8-2.94-6.69-2.94s-5.16,1.01-6.78,3.02c-1.62,2.02-2.44,4.82-2.44,8.42s.8,6.38,2.41,8.33c1.6,1.96,3.87,2.94,6.81,2.94s5.13-.99,6.69-2.96Z"
+        />
+        <path
+            d="m110.46,19.43l-.12,4.34c-.9-.31-1.94-.47-3.11-.47-2.86,0-4.98.89-6.37,2.67-1.39,1.78-2.08,3.94-2.08,6.49v16.85h-4.75v-21.25c0-3.05-.16-5.81-.47-8.28h4.52l.47,5.46c.74-2,1.94-3.52,3.58-4.58,1.64-1.06,3.52-1.58,5.63-1.58.98,0,1.88.12,2.7.35Z"
+        />
+        <path
+            d="m135.17,49.31l-15.14-14.21v14.21h-4.75V6.11h4.75v27.24l13.91-13.5h6.05l-14.79,14.15,16.2,15.32h-6.22Z"
+        />
+        <path
+            d="m170.22,19.78v29.53h-4.64v-5.11c-.94,1.8-2.25,3.17-3.93,4.11-1.68.94-3.58,1.41-5.69,1.41-3.48,0-6.12-.98-7.92-2.94-1.8-1.96-2.7-4.85-2.7-8.69v-18.31h4.75v18.2c0,2.66.55,4.62,1.64,5.87,1.09,1.25,2.76,1.88,4.99,1.88,2.62,0,4.73-.85,6.34-2.55,1.6-1.7,2.41-3.94,2.41-6.72v-16.67h4.75Z"
+        />
+        <path
+            d="m200.97,21.02c2,1.29,3.54,3.1,4.64,5.43,1.1,2.33,1.64,5.02,1.64,8.07s-.55,5.72-1.64,8.01c-1.1,2.29-2.63,4.06-4.61,5.31-1.98,1.25-4.28,1.88-6.9,1.88-2.31,0-4.32-.51-6.05-1.53-1.72-1.02-3.03-2.47-3.93-4.34v18.14h-4.75V28.06c0-3.05-.16-5.81-.47-8.28h4.52l.47,5.69c.82-2.03,2.12-3.61,3.9-4.73,1.78-1.12,3.88-1.67,6.31-1.67,2.58,0,4.87.65,6.87,1.94Zm-1.03,21.84c1.58-1.96,2.38-4.73,2.38-8.33s-.8-6.41-2.41-8.42c-1.61-2.02-3.84-3.02-6.69-3.02s-5.19.98-6.75,2.94c-1.57,1.96-2.35,4.75-2.35,8.39s.78,6.45,2.35,8.42c1.57,1.98,3.82,2.96,6.75,2.96s5.14-.98,6.72-2.94Z"
+        />
+    </g>
+</svg>
+`