npm - @benwatsonuk/govuk-pages-plugin - Versions diffs - 1.0.0 - Mend

@benwatsonuk/govuk-pages-plugin 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (60) hide show

package/CHANGELOG.md +7 -0
package/LICENCE.txt +21 -0
package/README.md +192 -0
package/dist/assets/images/arrow.svg +27 -0
package/dist/assets/images/page-types/arrow-base.svg +13 -0
package/dist/assets/images/page-types/arrow-head.svg +13 -0
package/dist/assets/images/page-types/check-answers.svg +142 -0
package/dist/assets/images/page-types/checkbox-input.svg +85 -0
package/dist/assets/images/page-types/confirmation.svg +73 -0
package/dist/assets/images/page-types/content-page.svg +84 -0
package/dist/assets/images/page-types/email.svg +56 -0
package/dist/assets/images/page-types/radio-input.svg +115 -0
package/dist/assets/images/page-types/start-page.svg +101 -0
package/dist/assets/images/page-types/task-list.svg +179 -0
package/dist/assets/images/page-types/text-input.svg +65 -0
package/dist/assets/javascripts/all.js +1 -0
package/dist/assets/styles/all.scss +2 -0
package/dist/assets/styles/scss/_pages.scss +169 -0
package/dist/assets/styles/scss/_variables.scss +19 -0
package/dist/functions/pages/getPages.js +9 -0
package/dist/functions/stages/getStages.js +65 -0
package/dist/index.js +39 -0
package/dist/schema.json +89 -0
package/dist/types.js +2 -0
package/dist/validate.js +27 -0
package/dist/views/page-index.html +34 -0
package/dist/views/stage-index.html +41 -0
package/govuk-prototype-kit.config.json +12 -0
package/index.js +22 -0
package/package.json +43 -0
package/src/assets/images/arrow.svg +27 -0
package/src/assets/images/page-types/arrow-base.svg +13 -0
package/src/assets/images/page-types/arrow-head.svg +13 -0
package/src/assets/images/page-types/check-answers.svg +142 -0
package/src/assets/images/page-types/checkbox-input.svg +85 -0
package/src/assets/images/page-types/confirmation.svg +73 -0
package/src/assets/images/page-types/content-page.svg +84 -0
package/src/assets/images/page-types/email.svg +56 -0
package/src/assets/images/page-types/radio-input.svg +115 -0
package/src/assets/images/page-types/start-page.svg +101 -0
package/src/assets/images/page-types/task-list.svg +179 -0
package/src/assets/images/page-types/text-input.svg +65 -0
package/src/assets/javascripts/all.js +1 -0
package/src/assets/styles/all.scss +2 -0
package/src/assets/styles/scss/_pages.scss +169 -0
package/src/assets/styles/scss/_variables.scss +19 -0
package/src/functions/pages/getPages.ts +7 -0
package/src/functions/stages/getStages.ts +78 -0
package/src/index.ts +40 -0
package/src/schema.json +89 -0
package/src/types.ts +40 -0
package/src/validate.ts +35 -0
package/src/views/page-index.html +34 -0
package/src/views/stage-index.html +41 -0
package/test/data/outputs.ts +197 -0
package/test/data/pages.ts +61 -0
package/test/data/stages.ts +87 -0
package/test/getPages.test.js +19 -0
package/test/getStages.test.js +46 -0
package/tsconfig.json +14 -0

package/src/assets/images/page-types/radio-input.svg ADDED Viewed

@@ -0,0 +1,115 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200px" height="160px" viewBox="0 0 200 160" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 52.5 (67469) - http://www.bohemiancoding.com/sketch -->
+    <title>Screen/Question page/Radio input</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <rect x="2" y="4" width="8.99672131" height="8" id="rect-1"></rect>
+        <circle id="path-2" cx="6" cy="6" r="6"></circle>
+        <circle id="path-4" cx="6" cy="6" r="4"></circle>
+        <circle id="path-6" cx="6" cy="6" r="6"></circle>
+        <circle id="path-8" cx="6" cy="6" r="4"></circle>
+        <circle id="path-10" cx="6" cy="6" r="6"></circle>
+        <circle id="path-12" cx="6" cy="6" r="4"></circle>
+    </defs>
+    <g id="Screen/Question-page/Radio-input" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Question-page/Radio-input">
+            <g id="_Canvas/Browser">
+                <rect id="BG" fill="#FFFFFF" x="1" y="1" width="196" height="156"></rect>
+                <rect id="Top-Bar" fill="#F2F2F2" x="1" y="1" width="196" height="11"></rect>
+                <rect id="Divider" fill="#DEE0E2" x="1" y="11" width="196" height="1"></rect>
+                <path d="M7.96153846,8 C6.87821068,8 6,7.1045695 6,6 C6,4.8954305 6.87821068,4 7.96153846,4 C9.04486624,4 9.92307692,4.8954305 9.92307692,6 C9.92307692,7.1045695 9.04486624,8 7.96153846,8 Z M14.5,8 C13.4166722,8 12.5384615,7.1045695 12.5384615,6 C12.5384615,4.8954305 13.4166722,4 14.5,4 C15.5833278,4 16.4615385,4.8954305 16.4615385,6 C16.4615385,7.1045695 15.5833278,8 14.5,8 Z M21.0384615,8 C19.9551338,8 19.0769231,7.1045695 19.0769231,6 C19.0769231,4.8954305 19.9551338,4 21.0384615,4 C22.1217893,4 23,4.8954305 23,6 C23,7.1045695 22.1217893,8 21.0384615,8 Z" id="Combined-Shape" fill="#DEE0E2"></path>
+                <polygon id="BG_Border_Top_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 0 200 0 197 1 1 1"></polygon>
+                <polygon id="BG_Border_Right_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 0 200 160 197 157 197 1"></polygon>
+                <polygon id="BG_Border_Bottom_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 160 0 160 1 157 197 157"></polygon>
+                <polygon id="BG_Border_Left_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 160 0 0 1 1 1 157"></polygon>
+            </g>
+            <g id="Button/Primary" transform="translate(5.000000, 116.000000)" fill="#00823B">
+                <g id="Fill/$button-colour">
+                    <rect id="Rectangle" x="0" y="0" width="32" height="8"></rect>
+                </g>
+            </g>
+            <g id="Text/Heading/Large" transform="translate(5.000000, 44.000000)" fill="#0B0C0C">
+                <g id="Fill/$text-colour">
+                    <rect id="Rectangle" x="0" y="0" width="120" height="12"></rect>
+                </g>
+            </g>
+            <g id="Object/Header" transform="translate(3.000000, 12.000000)">
+                <g id="👑Crown">
+                    <image x="2" y="4" width="8.99672131" height="8" xlink:href="data:image/png;base64,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"></image>
+                    <use fill="#0B0C0C" fill-rule="evenodd" xlink:href="#rect-1"></use>
+                </g>
+                <text id="🖊️Global_Header_Text" font-family="Helvetica" font-size="8" font-weight="normal" fill="#0B0C0C">
+                    <tspan x="13" y="11">GOV.UK</tspan>
+                </text>
+                <g id="Fill/$link-colour" transform="translate(2.000000, 15.000000)" fill="#005EA5" fill-rule="evenodd">
+                    <rect id="Rectangle" x="0" y="0" width="188" height="1"></rect>
+                </g>
+            </g>
+            <g id="Question/Radio-input" transform="translate(5.000000, 64.000000)">
+                <g id="Form/Label" transform="translate(16.000000, 36.000000)" fill="#0B0C0C" fill-rule="evenodd">
+                    <g id="Fill/$text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="80" height="4"></rect>
+                    </g>
+                </g>
+                <g id="Form/Radio-input" transform="translate(0.000000, 32.000000)">
+                    <mask id="mask-3" fill="white">
+                        <use xlink:href="#path-2"></use>
+                    </mask>
+                    <g id="Mask"></g>
+                    <g id="Fill/$black" mask="url(#mask-3)" fill="#0B0C0C" fill-rule="evenodd">
+                        <rect id="Rectangle" x="0" y="0" width="12" height="12"></rect>
+                    </g>
+                    <mask id="mask-5" fill="white">
+                        <use xlink:href="#path-4"></use>
+                    </mask>
+                    <g id="Mask"></g>
+                    <rect id="Inside" fill="#FFFFFF" fill-rule="evenodd" mask="url(#mask-5)" x="2" y="2" width="8" height="8"></rect>
+                </g>
+                <g id="Form/Label" transform="translate(16.000000, 20.000000)" fill="#0B0C0C" fill-rule="evenodd">
+                    <g id="Fill/$text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="80" height="4"></rect>
+                    </g>
+                </g>
+                <g id="Form/Radio-input" transform="translate(0.000000, 16.000000)">
+                    <mask id="mask-7" fill="white">
+                        <use xlink:href="#path-6"></use>
+                    </mask>
+                    <g id="Mask"></g>
+                    <g id="Fill/$black" mask="url(#mask-7)" fill="#0B0C0C" fill-rule="evenodd">
+                        <rect id="Rectangle" x="0" y="0" width="12" height="12"></rect>
+                    </g>
+                    <mask id="mask-9" fill="white">
+                        <use xlink:href="#path-8"></use>
+                    </mask>
+                    <g id="Mask"></g>
+                    <rect id="Inside" fill="#FFFFFF" fill-rule="evenodd" mask="url(#mask-9)" x="2" y="2" width="8" height="8"></rect>
+                </g>
+                <g id="Form/Label" transform="translate(16.000000, 4.000000)" fill="#0B0C0C" fill-rule="evenodd">
+                    <g id="Fill/$text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="80" height="4"></rect>
+                    </g>
+                </g>
+                <g id="Form/Radio-input">
+                    <mask id="mask-11" fill="white">
+                        <use xlink:href="#path-10"></use>
+                    </mask>
+                    <g id="Mask"></g>
+                    <g id="Fill/$black" mask="url(#mask-11)" fill="#0B0C0C" fill-rule="evenodd">
+                        <rect id="Rectangle" x="0" y="0" width="12" height="12"></rect>
+                    </g>
+                    <mask id="mask-13" fill="white">
+                        <use xlink:href="#path-12"></use>
+                    </mask>
+                    <g id="Mask"></g>
+                    <rect id="Inside" fill="#FFFFFF" fill-rule="evenodd" mask="url(#mask-13)" x="2" y="2" width="8" height="8"></rect>
+                </g>
+            </g>
+            <g id="Object/Back" transform="translate(5.000000, 32.000000)" fill="#6F777B">
+                <g id="Fill/$secondary-text-colour">
+                    <rect id="Rectangle" x="0" y="0" width="16" height="2"></rect>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/assets/images/page-types/start-page.svg ADDED Viewed

@@ -0,0 +1,101 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200px" height="160px" viewBox="0 0 200 160" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 52.5 (67469) - http://www.bohemiancoding.com/sketch -->
+    <title>Start page</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <rect x="2" y="4" width="8.99672131" height="8" id="rect-1"></rect>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Screen/Start-page">
+            <g id="Start-page">
+                <g id="_Canvas/Browser">
+                    <rect id="BG" fill="#FFFFFF" x="1" y="1" width="196" height="156"></rect>
+                    <rect id="Top-Bar" fill="#F2F2F2" x="1" y="1" width="196" height="11"></rect>
+                    <rect id="Divider" fill="#DEE0E2" x="1" y="11" width="196" height="1"></rect>
+                    <path d="M7.96153846,8 C6.87821068,8 6,7.1045695 6,6 C6,4.8954305 6.87821068,4 7.96153846,4 C9.04486624,4 9.92307692,4.8954305 9.92307692,6 C9.92307692,7.1045695 9.04486624,8 7.96153846,8 Z M14.5,8 C13.4166722,8 12.5384615,7.1045695 12.5384615,6 C12.5384615,4.8954305 13.4166722,4 14.5,4 C15.5833278,4 16.4615385,4.8954305 16.4615385,6 C16.4615385,7.1045695 15.5833278,8 14.5,8 Z M21.0384615,8 C19.9551338,8 19.0769231,7.1045695 19.0769231,6 C19.0769231,4.8954305 19.9551338,4 21.0384615,4 C22.1217893,4 23,4.8954305 23,6 C23,7.1045695 22.1217893,8 21.0384615,8 Z" id="Combined-Shape" fill="#DEE0E2"></path>
+                    <polygon id="BG_Border_Top_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 0 200 0 197 1 1 1"></polygon>
+                    <polygon id="BG_Border_Right_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 0 200 160 197 157 197 1"></polygon>
+                    <polygon id="BG_Border_Bottom_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 160 0 160 1 157 197 157"></polygon>
+                    <polygon id="BG_Border_Left_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 160 0 0 1 1 1 157"></polygon>
+                </g>
+                <g id="Object/SideContent" transform="translate(137.000000, 44.000000)">
+                    <g id="Text/Link" transform="translate(0.000000, 36.000000)" fill="#005EA5">
+                        <g id="Fill/$link-colour">
+                            <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                        </g>
+                    </g>
+                    <g id="Text/Link" transform="translate(0.000000, 28.000000)" fill="#005EA5">
+                        <g id="Fill/$link-colour">
+                            <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                        </g>
+                    </g>
+                    <g id="Text/Link" transform="translate(0.000000, 20.000000)" fill="#005EA5">
+                        <g id="Fill/$link-colour">
+                            <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                        </g>
+                    </g>
+                    <g id="Fill/$text-colour" transform="translate(0.000000, 8.000000)" fill="#0B0C0C">
+                        <rect id="Rectangle" x="0" y="0" width="32" height="8"></rect>
+                    </g>
+                    <g id="Fill/$govuk-blue" fill="#005EA5">
+                        <rect id="Rectangle" x="0" y="0" width="56" height="1"></rect>
+                    </g>
+                </g>
+                <g id="Button/StartNow" transform="translate(5.000000, 120.000000)" fill="#00823B">
+                    <g id="Fill/$button-colour">
+                        <rect id="Rectangle" x="0" y="0" width="48" height="12"></rect>
+                    </g>
+                </g>
+                <g id="Text/Body/Paragraph" transform="translate(5.000000, 68.000000)" fill="#0B0C0C">
+                    <g id="Fill/$text-colour" transform="translate(0.000000, 40.000000)">
+                        <rect id="Rectangle" x="0" y="0" width="64" height="4"></rect>
+                    </g>
+                    <g id="Fill/$text-colour" transform="translate(0.000000, 32.000000)">
+                        <rect id="Rectangle" x="0" y="0" width="96" height="4"></rect>
+                    </g>
+                    <g id="Fill/$text-colour" transform="translate(0.000000, 24.000000)">
+                        <rect id="Rectangle" x="0" y="0" width="96" height="4"></rect>
+                    </g>
+                    <g id="Fill/$text-colour" transform="translate(0.000000, 16.000000)">
+                        <rect id="Rectangle" x="0" y="0" width="96" height="4"></rect>
+                    </g>
+                    <g id="Fill/$text-colour" transform="translate(0.000000, 8.000000)">
+                        <rect id="Rectangle" x="0" y="0" width="96" height="4"></rect>
+                    </g>
+                    <g id="Fill/$text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="64" height="4"></rect>
+                    </g>
+                </g>
+                <g id="Text/Heading/Xlarge" transform="translate(5.000000, 44.000000)" fill="#0B0C0C">
+                    <g id="Fill/$text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="120" height="16"></rect>
+                    </g>
+                </g>
+                <g id="Object/Breadcrumb" transform="translate(5.000000, 32.000000)" fill="#6F777B">
+                    <g id="Fill/$secondary-text-colour" transform="translate(40.000000, 0.000000)">
+                        <rect id="Rectangle" x="0" y="0" width="16" height="2"></rect>
+                    </g>
+                    <g id="Fill/$secondary-text-colour" transform="translate(20.000000, 0.000000)">
+                        <rect id="Rectangle" x="0" y="0" width="16" height="2"></rect>
+                    </g>
+                    <g id="Fill/$secondary-text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="16" height="2"></rect>
+                    </g>
+                </g>
+                <g id="Object/Header" transform="translate(3.000000, 12.000000)">
+                    <g id="👑Crown">
+                        <image x="2" y="4" width="8.99672131" height="8" xlink:href="data:image/png;base64,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"></image>
+                        <use fill="#0B0C0C" fill-rule="evenodd" xlink:href="#rect-1"></use>
+                    </g>
+                    <text id="🖊️Global_Header_Text" font-family="Helvetica" font-size="8" font-weight="normal" fill="#0B0C0C">
+                        <tspan x="13" y="11">GOV.UK</tspan>
+                    </text>
+                    <g id="Fill/$link-colour" transform="translate(2.000000, 15.000000)" fill="#005EA5" fill-rule="evenodd">
+                        <rect id="Rectangle" x="0" y="0" width="188" height="1"></rect>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/assets/images/page-types/task-list.svg ADDED Viewed

@@ -0,0 +1,179 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200px" height="160px" viewBox="0 0 200 160" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 52.5 (67469) - http://www.bohemiancoding.com/sketch -->
+    <title>Screen/Task list</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <rect x="2" y="4" width="8.99672131" height="8" id="rect-1"></rect>
+    </defs>
+    <g id="Screen/Task-list" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="_Canvas/Browser">
+            <rect id="BG" fill="#FFFFFF" x="1" y="1" width="196" height="156"></rect>
+            <rect id="Top-Bar" fill="#F2F2F2" x="1" y="1" width="196" height="11"></rect>
+            <rect id="Divider" fill="#DEE0E2" x="1" y="11" width="196" height="1"></rect>
+            <path d="M7.96153846,8 C6.87821068,8 6,7.1045695 6,6 C6,4.8954305 6.87821068,4 7.96153846,4 C9.04486624,4 9.92307692,4.8954305 9.92307692,6 C9.92307692,7.1045695 9.04486624,8 7.96153846,8 Z M14.5,8 C13.4166722,8 12.5384615,7.1045695 12.5384615,6 C12.5384615,4.8954305 13.4166722,4 14.5,4 C15.5833278,4 16.4615385,4.8954305 16.4615385,6 C16.4615385,7.1045695 15.5833278,8 14.5,8 Z M21.0384615,8 C19.9551338,8 19.0769231,7.1045695 19.0769231,6 C19.0769231,4.8954305 19.9551338,4 21.0384615,4 C22.1217893,4 23,4.8954305 23,6 C23,7.1045695 22.1217893,8 21.0384615,8 Z" id="Combined-Shape" fill="#DEE0E2"></path>
+            <polygon id="BG_Border_Top_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 0 200 0 197 1 1 1"></polygon>
+            <polygon id="BG_Border_Right_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 0 200 160 197 157 197 1"></polygon>
+            <polygon id="BG_Border_Bottom_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 160 0 160 1 157 197 157"></polygon>
+            <polygon id="BG_Border_Left_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 160 0 0 1 1 1 157"></polygon>
+        </g>
+        <g id="Text/Label/Completed" transform="translate(109.000000, 151.000000)">
+            <g id="Text/Link" fill="#005EA5">
+                <g id="Fill/$link-colour">
+                    <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                </g>
+            </g>
+            <g id="Text/Link" transform="translate(1.000000, 1.000000)" fill="#FFFFFF">
+                <g id="Fill/$page-colour">
+                    <rect id="Rectangle" x="0" y="0" width="14" height="2"></rect>
+                </g>
+            </g>
+        </g>
+        <g id="Text/Link" transform="translate(17.000000, 151.000000)" fill="#005EA5">
+            <g id="Fill/$link-colour">
+                <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+            </g>
+        </g>
+        <g id="Fill/$border-colour" transform="translate(17.000000, 148.000000)" fill="#BFC1C3">
+            <rect id="Rectangle" x="0" y="0" width="108" height="1"></rect>
+        </g>
+        <g id="Text/Heading/Medium" transform="translate(17.000000, 138.000000)" fill="#0B0C0C">
+            <g id="Fill/$text-colour">
+                <rect id="Rectangle" x="0" y="0" width="32" height="8"></rect>
+            </g>
+        </g>
+        <g id="Text/Heading/Medium" transform="translate(5.000000, 138.000000)" fill="#0B0C0C">
+            <g id="Fill/$text-colour">
+                <rect id="Rectangle" x="0" y="0" width="8" height="8"></rect>
+            </g>
+        </g>
+        <g id="Fill/$border-colour" transform="translate(17.000000, 129.000000)" fill="#BFC1C3">
+            <rect id="Rectangle" x="0" y="0" width="108" height="1"></rect>
+        </g>
+        <g id="Text/Label/Completed" transform="translate(109.000000, 123.000000)">
+            <g id="Text/Link" fill="#005EA5">
+                <g id="Fill/$link-colour">
+                    <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                </g>
+            </g>
+            <g id="Text/Link" transform="translate(1.000000, 1.000000)" fill="#FFFFFF">
+                <g id="Fill/$page-colour">
+                    <rect id="Rectangle" x="0" y="0" width="14" height="2"></rect>
+                </g>
+            </g>
+        </g>
+        <g id="Text/Link" transform="translate(17.000000, 123.000000)" fill="#005EA5">
+            <g id="Fill/$link-colour">
+                <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+            </g>
+        </g>
+        <g id="Fill/$border-colour" transform="translate(17.000000, 120.000000)" fill="#BFC1C3">
+            <rect id="Rectangle" x="0" y="0" width="108" height="1"></rect>
+        </g>
+        <g id="Text/Label/Completed" transform="translate(109.000000, 114.000000)">
+            <g id="Text/Link" fill="#005EA5">
+                <g id="Fill/$link-colour">
+                    <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                </g>
+            </g>
+            <g id="Text/Link" transform="translate(1.000000, 1.000000)" fill="#FFFFFF">
+                <g id="Fill/$page-colour">
+                    <rect id="Rectangle" x="0" y="0" width="14" height="2"></rect>
+                </g>
+            </g>
+        </g>
+        <g id="Text/Link" transform="translate(17.000000, 114.000000)" fill="#005EA5">
+            <g id="Fill/$link-colour">
+                <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+            </g>
+        </g>
+        <g id="Fill/$border-colour" transform="translate(17.000000, 111.000000)" fill="#BFC1C3">
+            <rect id="Rectangle" x="0" y="0" width="108" height="1"></rect>
+        </g>
+        <g id="Text/Heading/Medium" transform="translate(17.000000, 101.000000)" fill="#0B0C0C">
+            <g id="Fill/$text-colour">
+                <rect id="Rectangle" x="0" y="0" width="32" height="8"></rect>
+            </g>
+        </g>
+        <g id="Text/Heading/Medium" transform="translate(5.000000, 101.000000)" fill="#0B0C0C">
+            <g id="Fill/$text-colour">
+                <rect id="Rectangle" x="0" y="0" width="8" height="8"></rect>
+            </g>
+        </g>
+        <g id="Fill/$border-colour" transform="translate(17.000000, 92.000000)" fill="#BFC1C3">
+            <rect id="Rectangle" x="0" y="0" width="108" height="1"></rect>
+        </g>
+        <g id="Text/Label/Completed" transform="translate(109.000000, 86.000000)">
+            <g id="Text/Link" fill="#005EA5">
+                <g id="Fill/$link-colour">
+                    <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                </g>
+            </g>
+            <g id="Text/Link" transform="translate(1.000000, 1.000000)" fill="#FFFFFF">
+                <g id="Fill/$page-colour">
+                    <rect id="Rectangle" x="0" y="0" width="14" height="2"></rect>
+                </g>
+            </g>
+        </g>
+        <g id="Text/Link" transform="translate(17.000000, 86.000000)" fill="#005EA5">
+            <g id="Fill/$link-colour">
+                <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+            </g>
+        </g>
+        <g id="Fill/$border-colour" transform="translate(17.000000, 83.000000)" fill="#BFC1C3">
+            <rect id="Rectangle" x="0" y="0" width="108" height="1"></rect>
+        </g>
+        <g id="Text/Label/Completed" transform="translate(109.000000, 77.000000)">
+            <g id="Text/Link" fill="#005EA5">
+                <g id="Fill/$link-colour">
+                    <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+                </g>
+            </g>
+            <g id="Text/Link" transform="translate(1.000000, 1.000000)" fill="#FFFFFF">
+                <g id="Fill/$page-colour">
+                    <rect id="Rectangle" x="0" y="0" width="14" height="2"></rect>
+                </g>
+            </g>
+        </g>
+        <g id="Text/Link" transform="translate(17.000000, 77.000000)" fill="#005EA5">
+            <g id="Fill/$link-colour">
+                <rect id="Rectangle" x="0" y="0" width="16" height="4"></rect>
+            </g>
+        </g>
+        <g id="Fill/$border-colour" transform="translate(17.000000, 74.000000)" fill="#BFC1C3">
+            <rect id="Rectangle" x="0" y="0" width="108" height="1"></rect>
+        </g>
+        <g id="Text/Heading/Medium" transform="translate(17.000000, 64.000000)" fill="#0B0C0C">
+            <g id="Fill/$text-colour">
+                <rect id="Rectangle" x="0" y="0" width="32" height="8"></rect>
+            </g>
+        </g>
+        <g id="Text/Heading/Medium" transform="translate(5.000000, 64.000000)" fill="#0B0C0C">
+            <g id="Fill/$text-colour">
+                <rect id="Rectangle" x="0" y="0" width="8" height="8"></rect>
+            </g>
+        </g>
+        <g id="Text/Heading/Large" transform="translate(5.000000, 44.000000)" fill="#0B0C0C">
+            <g id="Fill/$text-colour">
+                <rect id="Rectangle" x="0" y="0" width="120" height="12"></rect>
+            </g>
+        </g>
+        <g id="Object/Back" transform="translate(5.000000, 32.000000)" fill="#6F777B">
+            <g id="Fill/$secondary-text-colour">
+                <rect id="Rectangle" x="0" y="0" width="16" height="2"></rect>
+            </g>
+        </g>
+        <g id="Object/Header" transform="translate(3.000000, 12.000000)">
+            <g id="👑Crown">
+                <image x="2" y="4" width="8.99672131" height="8" xlink:href="data:image/png;base64,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"></image>
+                <use fill="#0B0C0C" fill-rule="evenodd" xlink:href="#rect-1"></use>
+            </g>
+            <text id="🖊️Global_Header_Text" font-family="Helvetica" font-size="8" font-weight="normal" fill="#0B0C0C">
+                <tspan x="13" y="11">GOV.UK</tspan>
+            </text>
+            <g id="Fill/$link-colour" transform="translate(2.000000, 15.000000)" fill="#005EA5" fill-rule="evenodd">
+                <rect id="Rectangle" x="0" y="0" width="188" height="1"></rect>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/assets/images/page-types/text-input.svg ADDED Viewed

@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200px" height="160px" viewBox="0 0 200 160" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 52.5 (67469) - http://www.bohemiancoding.com/sketch -->
+    <title>Question page/Text input</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <rect x="2" y="4" width="8.99672131" height="8" id="rect-1"></rect>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Screen/Question-page/Text-input">
+            <g id="Question-page/Text-input">
+                <g id="_Canvas/Browser">
+                    <rect id="BG" fill="#FFFFFF" x="1" y="1" width="196" height="156"></rect>
+                    <rect id="Top-Bar" fill="#F2F2F2" x="1" y="1" width="196" height="11"></rect>
+                    <rect id="Divider" fill="#DEE0E2" x="1" y="11" width="196" height="1"></rect>
+                    <path d="M7.96153846,8 C6.87821068,8 6,7.1045695 6,6 C6,4.8954305 6.87821068,4 7.96153846,4 C9.04486624,4 9.92307692,4.8954305 9.92307692,6 C9.92307692,7.1045695 9.04486624,8 7.96153846,8 Z M14.5,8 C13.4166722,8 12.5384615,7.1045695 12.5384615,6 C12.5384615,4.8954305 13.4166722,4 14.5,4 C15.5833278,4 16.4615385,4.8954305 16.4615385,6 C16.4615385,7.1045695 15.5833278,8 14.5,8 Z M21.0384615,8 C19.9551338,8 19.0769231,7.1045695 19.0769231,6 C19.0769231,4.8954305 19.9551338,4 21.0384615,4 C22.1217893,4 23,4.8954305 23,6 C23,7.1045695 22.1217893,8 21.0384615,8 Z" id="Combined-Shape" fill="#DEE0E2"></path>
+                    <polygon id="BG_Border_Top_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 0 200 0 197 1 1 1"></polygon>
+                    <polygon id="BG_Border_Right_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 0 200 160 197 157 197 1"></polygon>
+                    <polygon id="BG_Border_Bottom_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="200 160 0 160 1 157 197 157"></polygon>
+                    <polygon id="BG_Border_Left_2B99C93C-C2D2-47D8-92D7-E97EC61A7761" fill="#0B0C0C" points="0 160 0 0 1 1 1 157"></polygon>
+                </g>
+                <g id="Button/Primary" transform="translate(5.000000, 92.000000)" fill="#00823B">
+                    <g id="Fill/$button-colour">
+                        <rect id="Rectangle" x="0" y="0" width="32" height="8"></rect>
+                    </g>
+                </g>
+                <g id="Text/Heading/Large" transform="translate(5.000000, 44.000000)" fill="#0B0C0C">
+                    <g id="Fill/$text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="120" height="12"></rect>
+                    </g>
+                </g>
+                <g id="Object/Header" transform="translate(3.000000, 12.000000)">
+                    <g id="👑Crown">
+                        <image x="2" y="4" width="8.99672131" height="8" xlink:href="data:image/png;base64,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"></image>
+                        <use fill="#0B0C0C" fill-rule="evenodd" xlink:href="#rect-1"></use>
+                    </g>
+                    <text id="🖊️Global_Header_Text" font-family="Helvetica" font-size="8" font-weight="normal" fill="#0B0C0C">
+                        <tspan x="13" y="11">GOV.UK</tspan>
+                    </text>
+                    <g id="Fill/$link-colour" transform="translate(2.000000, 15.000000)" fill="#005EA5" fill-rule="evenodd">
+                        <rect id="Rectangle" x="0" y="0" width="188" height="1"></rect>
+                    </g>
+                </g>
+                <g id="Question/Text-input" transform="translate(5.000000, 64.000000)">
+                    <g id="Form/Text-input" transform="translate(0.000000, 8.000000)">
+                        <g id="Fill/$black" fill="#0B0C0C">
+                            <rect id="Rectangle" x="0" y="0" width="96" height="12"></rect>
+                        </g>
+                        <rect id="Inside" fill="#FFFFFF" x="2" y="2" width="92" height="8"></rect>
+                    </g>
+                    <g id="Form/Label" fill="#0B0C0C">
+                        <g id="Fill/$text-colour">
+                            <rect id="Rectangle" x="0" y="0" width="64" height="4"></rect>
+                        </g>
+                    </g>
+                </g>
+                <g id="Object/Back" transform="translate(5.000000, 32.000000)" fill="#6F777B">
+                    <g id="Fill/$secondary-text-colour">
+                        <rect id="Rectangle" x="0" y="0" width="16" height="2"></rect>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/assets/javascripts/all.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ console.log("Page Flow Plugin loaded");

package/src/assets/styles/all.scss ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ @import "scss/variables";
2	+ @import "scss/pages";