Prototype kit extensions, small checkboxes and radio buttons, multi-select autocomplete

So last week I missed doing my weeknotes so I’m going to combine the last two weeks together. But I do have the best excuse—much better than the dog ate my homework.

# I lost my vision

My 18 month old baby girl poked my out so badly that I couldn’t see out of my one good eye.

My bad eye has been bad all my life as I have Daune Retraction Syndrome.

And while there is never a good time to get your eye fucked by your baby daughter, I had to spend the entire next day visiting two eye hospitals instead of being there to help out, at ya know, my boys 5th birthday party.

Why 2 hospitals? Because the first place, after a 4 hour wait, said to me that I just needed glasses. They couldn’t see a scratch on my cornea. They said I was just going mad that for the past umpteen years I could see. And the meer fact that Talia poked my eye out triggered me to become acutely aware of how I can’t see anymore.

Fuck that doctor.

I got home at 2pm and decided to trek all the way back into London for a second opinion. This time they found a scratch. I celebrated like a premier league footballer. The nurse thought I was a lunatic and has never seen anyone celebrate the news of a corneal abrasion.

So she’s my hero for the week.

My vision is healing nicely. Thank fuck, because I was pretty very worried.

# Recreated the GOV​.​UK Design System’s form components in Angular

As I’ve been writing about in past weeknotes, this work is all done. We finally have Angular versions of the wonderful GOV​.​UK Design System form components. Big thanks to Franco.

I wrote a little note of appreciation to Franco in his copy of Form Design Patterns haha.

# Sent out a newsletter

I mentioned in my last weeknotes that I haven’t sent out newsletter in a while. Sorted that out nicely by sending out a case study about the HMCTS Design System.

And the best bit is that someone from Ofgem replied to me declaring an interest in one of the components. Cool.

# GOV​.​UK Prototype Kit extensions

Matt Carey, from HMRC has made the GOV​.​UK Prototype Kit even better by allowing third parties to create extensions for it.

For example, by adding a single config file into the root of the HMCTS Frontend package, a simple npm install @hmcts/frontend --save is all that’s needed for people to use it in the GOV​.​UK Prototype Kit.

We’ve had a few teething problems and we’ve raised some issues. Thanks to Joe Lanman, the lead designer on the prototype kit who’s helped get it setup my end.

# Small checkboxes and radios

The GOV​.​UK Design System now has small radios and checkboxes. It’s great work and I upgraded the HMCTS Design System’s filter component to use them. They look a lot better.

# Multi-select autocompletes

The accessible, single-select autocomplete component I created for Form Design Patterns was one of the hardest things I’ve ever built.

So I can imagine that a multi-select autocomplete is even harder to build. To my fortune, this topic came up in the friday x-government design system call last week.

Read more about the solution GOV​.​UK ended up using in Accessibility lessons: dealing with a large amount of form inputs. And you can see them in action here.

# Started writing an article web components

Web components seem to be getting more and more attention. But despite their promise they have a number of drawbacks. So I’m writing about that and hope to share that with you soon.

# CSS Tricks article will be published soon

I mentioned in last week’s weeknotes that I’ve submitted an article to CSS Tricks. They like it and the plan is for it to go live early May. Excited.

# Things I’d like to read again in the future