Feature: bare bones labeller

[SallyMcGrath]

What does this change?

I've just put together a really bare bones labeller. It is similar to the multiple choice component. In this one they drag and drop labels onto content to classify them.

It seems like this is a key task in SDC and it's easy enough to make. Here's a sketch for you to see what you think @illicitonion @40thieves

Re #1295

Common Theme?

Yeah it's item-labeller.js and item-labeller.html

{{<label-items>}}
[LABEL=label 1] Something here some kind of content  
[LABEL=label 2] Some `more content` hurray  
[LABEL=label 2] Some more content hurray  
{{</label-items>}}

[netlify]

✅ Deploy Preview for cyf-common ready!

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-common/deploys/67939c1e9362a50009271e86
😎 Deploy Preview	https://deploy-preview-1316--cyf-common.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for cyf-piscine ready!

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-piscine/deploys/67939c1e28083a0008a7a345
😎 Deploy Preview	https://deploy-preview-1316--cyf-piscine.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 83 (🔴 down 9 from production) Accessibility: 100 (no change from production) Best Practices: 92 (no change from production) SEO: 100 (no change from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for cyf-programming ready!

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-programming/deploys/67939c1e72044900085278a0
😎 Deploy Preview	https://deploy-preview-1316--cyf-programming.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 74 (🔴 down 9 from production) Accessibility: 100 (no change from production) Best Practices: 92 (no change from production) SEO: 90 (no change from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for cyf-sdc ready!

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-sdc/deploys/67939c1e66724600087565f2
😎 Deploy Preview	https://deploy-preview-1316--cyf-sdc.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for cyf-curriculum canceled.

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-curriculum/deploys/67939c1e12a71100089b60cc

[netlify]

✅ Deploy Preview for cyf-itd ready!

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-itd/deploys/67939c1eb22bad000848895a
😎 Deploy Preview	https://deploy-preview-1316--cyf-itd.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 89 (🔴 down 10 from production) Accessibility: 100 (no change from production) Best Practices: 92 (no change from production) SEO: 100 (no change from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for cyf-tracks ready!

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-tracks/deploys/67939c1e08ab160008621746
😎 Deploy Preview	https://deploy-preview-1316--cyf-tracks.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for cyf-launch ready!

Name	Link
🔨 Latest commit	f2fef94
🔍 Latest deploy log	https://app.netlify.com/sites/cyf-launch/deploys/67939c1e243cd60008f8fd94
😎 Deploy Preview	https://deploy-preview-1316--cyf-launch.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[illicitonion]

Ok, I've tried using this in anger - two pieces of feedback:

1. I think it'd be useful to put the whole component in a bordered-box of some kind. Right now I don't think it's super obvious where the component ends (e.g. that the feedback at the bottom is part of the component, and even which lines of text are things that should be labelled)
2. I think we should give a "whole exercise" piece of feedback, either as well as or instead of the latest-labelled-statement feedback. Currently if you correctly label one thing, there's no feedback saying "You got one right, but you have three still to do", which I think would be useful.

Also FYI this increases our minimum supported hugo version - I was previously using 0.136.2 locally, and these strings functions were added in 0.136.3. Not a problem, but just an FYI

(Also we're going to get broken at some point, I tried jumping all the way to latest, and apparently error handling has changed somewhere... But that's a problem for another day!)

[illicitonion]

I tried putting a <label-items> inside a <note> to work around the border-box issue and ended up with a bunch of literal HTML getting rendered :)

[SallyMcGrath]

Also FYI this increases our minimum supported hugo version - I was previously using 0.136.2 locally, and these strings functions were added in 0.136.3. Not a problem, but just an FYI

I just scarfed them all off this page https://gohugo.io/functions/strings/ and didn't investigate further. It did seem a bit easier than last time to clear up the trailing characters.

[illicitonion]

Thank you!