@x-govuk/nhsuk-eleventy-plugin 1.0.3 → 1.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@x-govuk/nhsuk-eleventy-plugin",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "Write documentation using Markdown and publish it using NHS.UK styles",
   "keywords": [
     "nhsuk",
@@ -28,13 +28,13 @@
     "url": "git+https://github.com/x-govuk/nhsuk-eleventy-plugin.git"
   },
   "scripts": {
-    "prebuild": "rimraf _site",
-    "postbuild": "npm run build:example",
     "build": "eleventy",
+    "postbuild": "npm run build:example",
     "build:example": "eleventy --config=example.config.js",
     "predev": "npm run build",
     "dev": "eleventy --serve --watch",
     "dev:example": "eleventy --config=example.config.js --serve --watch",
+    "prestart": "npm run build",
     "start": "eleventy --serve",
     "lint:prettier": "prettier . --check",
     "lint:prettier:fix": "prettier . --write",
@@ -57,7 +57,7 @@
     "@rollup/plugin-commonjs": "^28.0.0",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-terser": "^0.4.4",
-    "@x-govuk/govuk-eleventy-plugin": "^8.0.0",
+    "@x-govuk/govuk-eleventy-plugin": "^8.0.4",
     "accessible-autocomplete": "^3.0.1",
     "deepmerge": "^4.2.2",
     "markdown-it-abbr": "^2.0.0",
@@ -73,9 +73,8 @@
     "markdown-it-mark": "^4.0.0",
     "markdown-it-sub": "^2.0.0",
     "markdown-it-sup": "^2.0.0",
-    "markdown-it-table-of-contents": "^0.9.0",
+    "markdown-it-table-of-contents": "^1.0.0",
     "nhsuk-frontend": "^10.0.0",
-    "rimraf": "^6.0.0",
     "rollup": "^4.1.0",
     "sass": "^1.45.1"
   },

package/src/components/document-list/template.njk

@@ -4,10 +4,21 @@
 {% if params.items.length > 0 %}
   <ol class="nhsuk-grid-row nhsuk-card-group{%- if params.classes %} {{ params.classes }}{% endif %}">
   {% for item in params.items | itemsFromCollection %}
+
+    {% if item.caption %}
+      {% set headingHtml %}
+        <div class="nhsuk-caption-m">{{ item.caption }}</div>
+        <h2 class="nhsuk-card__heading {{ params.headingClasses or "nhsuk-u-font-size-22" + (" nhsuk-u-margin-bottom-2" if item.descriptionHtml else "") }}">
+          <a class="nhsuk-card__link" href="{{ item.href }}">{{ item.heading }}</a>
+        </h2>
+      {% endset %}
+    {% endif %}
+
     <li class="nhsuk-grid-column-full nhsuk-card-group__item">
       {{ nhsukCard({
         secondary: true,
-        heading: item.heading,
+        heading: item.heading if not item.caption,
+        headingHtml: headingHtml if item.caption,
         headingClasses: params.headingClasses or "nhsuk-u-font-size-22" + (" nhsuk-u-margin-bottom-2" if item.descriptionHtml else ""),
         headingLevel: params.headingLevel or 2,
         href: item.href,

package/src/components/heading/template.njk

@@ -2,11 +2,11 @@
 {% set size = params.size or "xl" %}
 {% if params.caption %}
 <span class="nhsuk-caption-{{ size }}">
-  {{- params.caption -}}
+  {{- params.caption | smart -}}
 </span>
 {% endif %}
 <h{{level}} class="nhsuk-heading-{{ size }}{%- if params.classes %} {{ params.classes }}{% endif %}">
-  {{- params.title | safe -}}
+  {{- params.title | smart | safe -}}
 </h{{level}}>
 {% if params.description -%}
 <p class="{{ "nhsuk-lede-text" if level == 1 else "nhsuk-body nhsuk-u-reading-width" }}">

package/src/data/options.js

@@ -12,6 +12,10 @@ const defaults = {
     shortcut: '/assets/images/favicon.ico',
     touch: '/assets/images/nhsuk-icon-180.png'
   },
+  markdown: {
+    headingPermalinks: false,
+    headingsStartWith: 'xl'
+  },
   opengraphImageUrl: '/assets/images/nhsuk-opengraph-image.png',
   stylesheets: [],
   titleSuffix: 'NHS',
@@ -46,5 +50,17 @@ export function defaultPluginOptions(options, pathPrefix) {
     options._feedPath = options.templates?.feed?.permalink || '/feed.xml'
   }
 
+  // Show message if using deprecated headingPermalinks option
+  if (options?.headingPermalinks) {
+    console.warn(
+      'The `headingPermalinks` option is deprecated and will be removed in a future version. Use `markdown.headingPermalinks` option instead.'
+    )
+
+    options.markdown = {
+      headingPermalinks: options.headingPermalinks,
+      ...options.markdown
+    }
+  }
+
   return deepmerge(defaults, options)
 }

package/src/filters/index.js

@@ -13,6 +13,7 @@ export {
   noOrphans,
   pretty,
   sliceFromCollection,
+  sortCollection,
   smart,
   tokenize
 } from '@x-govuk/govuk-eleventy-plugin/filters'

package/src/filters/items-from-collection.js

@@ -3,6 +3,7 @@ import {
   markdown,
   nhsukDate,
   sliceFromCollection,
+  sortCollection,
   smart
 } from './index.js'
 
@@ -50,10 +51,13 @@ function getDescriptionHtml(item) {
  */
 export function itemsFromCollection(array, n) {
   if (isCollectionData(array)) {
+    array = sortCollection(array, true)
+
     array = array.map((item) => {
       return {
         href: item.url,
         date: item.data.date,
+        caption: item.data.caption,
         title: item.data.title,
         description: item.data.description,
         image: item.data.image
@@ -63,6 +67,7 @@ export function itemsFromCollection(array, n) {
 
   array = array.map((item) => ({
     href: item.href,
+    ...(item.caption && { caption: item.caption }),
     heading: smart(item.title),
     descriptionHtml: getDescriptionHtml(item),
     ...(item.image && { imgURL: item.image.src }),

package/src/index.js

@@ -45,7 +45,7 @@ export async function nhsukEleventyPlugin(eleventyConfig, pluginOptions = {}) {
   const options = defaultPluginOptions(pluginOptions, pathPrefix)
 
   // Libraries
-  eleventyConfig.setLibrary('md', md(options))
+  eleventyConfig.setLibrary('md', md(options.markdown))
   eleventyConfig.setLibrary('njk', nunjucksConfig(eleventyConfig))
 
   // Collections

package/src/layouts/collection.njk

@@ -27,11 +27,13 @@
   }) }}
 
   {{ nhsukPagination({
-    classes: "nhsuk-u-reading-width",
-    previousUrl: pagination.href.previous,
-    previousPage: pagination.page.previous | length + " items",
-    nextUrl: pagination.href.next,
-    nextPage: pagination.page.next | length + " items"
+    previous: {
+      href: pagination.href.previous
+    },
+    next: {
+      href: pagination.href.next
+    },
+    items: pagination | itemsFromPagination
   }) if pagination.pages.length > 1 }}
 
   {{ appRelated(related) if related }}

package/src/layouts/sitemap.njk

@@ -9,7 +9,7 @@
 
   {{ appProseScope(content) if content }}
 
-  {% for item in collections.sitemap | eleventyNavigation(options.homeKey) %}
+  {% for item in collections.sitemap | sortCollection(true) | eleventyNavigation(options.homeKey) %}
     <nav class="nhsuk-contents-list">
       <h2 class="nhsuk-heading-m nhsuk-u-margin-bottom-2">
         <a class="nhsuk-link" href="{{ item.url | canonicalUrl | pretty }}">{{ item.title | smart }}</a>
@@ -19,7 +19,7 @@
       {% endif %}
       {{ collections.sitemap | eleventyNavigation(item.key) | eleventyNavigationToHtml({
         listElement: "ol"
-      }) | safe }}
+      }) | smart | safe }}
     </nav>
   {% endfor %}
 {% endblock %}

package/src/markdown-it.js

@@ -26,27 +26,28 @@ import { tableRules } from './markdown-it/table.js'
  * Configure markdown-it
  *
  * @see {@link https://markdown-it.github.io/markdown-it/}
- * @param {object} [options] - Plugin options
+ * @param {object} [markdownOptions] - Plugin Markdown options
  * @returns {Function} markdown-it instance
  */
-export function md(options = {}) {
+export function md(markdownOptions = {}) {
   const opts = {
     breaks: true,
     highlight,
     html: true,
     linkify: false,
-    typographer: true
+    typographer: true,
+    ...markdownOptions
   }
 
   const md = new MarkdownIt(opts)
     .use(markdownItGovuk, {
       brand: 'nhsuk',
       calvert: true,
-      headingsStartWith: 'xl'
+      headingsStartWith: markdownOptions.headingsStartWith
     })
     .use(markdownItAbbr)
     .use(markdownItAnchor, {
-      permalink: options.headingPermalinks
+      permalink: markdownOptions.headingPermalinks
         ? markdownItAnchor.permalink.headerLink({
             class: 'app-link--heading',
             safariReaderFix: true