Allow the panel component title heading level to be customisable #853

kr8n3r · 2018-07-02T11:24:39Z

This modification allows it panel component title to be any heading level by specifying headingLevel parameter
Default is 2.

This PR

Adds test
Adds an example
Updates component table of arguments
Generates an updated README

Adresses: alphagov/govuk-design-system#413

NickColley · 2018-07-02T11:28:22Z

src/components/panel/template.njk

@@ -1,9 +1,10 @@
+{% set titleLevel = params.titleLevel if params.titleLevel else 1 %}


If the default is 1, this will be a breaking change, since before we were defaulting to H2.

Maybe we should default it to 2 and add a deprecation notice?

In most cases it will (should) be an h1 so i guess a breaking change.

filed under Breaking change

If we're going to make this a breaking change we should probably hold this for now and batch it up with other breaking changes.

We can make do this work and default to 2, then update the examples in the Design System to explicitly set the level as 1.

We'd then deprecate this behaviour and release the default as 1 in a breaking release later on?

Maybe I'm overcomplicating it.

36degrees · 2018-07-02T12:25:57Z

src/components/panel/template.njk

@@ -1,9 +1,10 @@
+{% set titleLevel = params.titleLevel if params.titleLevel else 1 %}


Would headingLevel be better suited?

thought about that. we have titleText, so 1st thought was titleHeadingLevel to keep naming related, but that is wordy.
I also toyed with the idea to actually move the title to an object, to have:

title: { text: html: headingLevel: }

36degrees · 2018-07-02T12:26:38Z

src/components/panel/index.njk

+        text: 'no'
+      },
+      {
+        text: 'Optional heading level, from 2 to 6. Default is 1.'


From 1 to 6.

36degrees · 2018-07-05T15:10:49Z

src/components/panel/template.test.js

@@ -30,6 +30,22 @@ describe('Panel', () => {
    expect(panelTitle).toEqual('Application &lt;strong&gt;not&lt;/strong&gt; complete')
  })

+  it('renders title as h1 (as the default heading level)', () => {


36degrees

Looks good, bar one comment which needs updating.

joelanman · 2018-07-05T16:46:05Z

sorry to comment late, but didn't we want the default to be h1? As that's the common case for this panel? I thought I'd read we were going to do that somewhere?

kr8n3r · 2018-07-05T18:53:10Z

@joelanman making it h1 in the next breaking release: https://github.com/alphagov/govuk-frontend/milestone/2

Default is h2.

joelanman · 2018-07-05T19:14:59Z

@igloosi ah cool thanks

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 2, 2018 11:24 Inactive

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 2, 2018 11:27 Inactive

NickColley reviewed Jul 2, 2018

View reviewed changes

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from 2739ad0 to 2216612 Compare July 2, 2018 13:41

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 2, 2018 13:41 Inactive

kr8n3r changed the title ~~Allow panel title heading level to be customisable~~ Change Panel component title from h2 to h1 and allow heading level to be customisable Jul 2, 2018

kr8n3r changed the title ~~Change Panel component title from h2 to h1 and allow heading level to be customisable~~ Change the panel component title from h2 to h1 and allow heading level to be customisable Jul 2, 2018

kr8n3r changed the title ~~Change the panel component title from h2 to h1 and allow heading level to be customisable~~ Change the panel component title from h2 to h1 and allow the heading level to be customisable Jul 2, 2018

36degrees reviewed Jul 2, 2018

View reviewed changes

kr8n3r added the breaking change label Jul 2, 2018

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from 2216612 to f57dd5e Compare July 3, 2018 09:44

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 3, 2018 09:44 Inactive

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from f57dd5e to b7022d8 Compare July 3, 2018 10:50

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 3, 2018 10:50 Inactive

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from b7022d8 to 2c05542 Compare July 3, 2018 22:14

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 3, 2018 22:14 Inactive

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from 2c05542 to f7b9789 Compare July 3, 2018 22:15

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 3, 2018 22:15 Inactive

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from f7b9789 to 4ab37b2 Compare July 3, 2018 22:23

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 3, 2018 22:23 Inactive

kr8n3r changed the title ~~Change the panel component title from h2 to h1 and allow the heading level to be customisable~~ Allow the panel component title heading level to be customisable Jul 3, 2018

kr8n3r mentioned this pull request Jul 4, 2018

Set panel component's title heading level to 1 as default #864

Closed

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from 4ab37b2 to 50762ee Compare July 4, 2018 07:46

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 4, 2018 07:46 Inactive

kr8n3r added enhancement and removed breaking change labels Jul 4, 2018

kr8n3r added this to the v1.1.0 milestone Jul 4, 2018

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from 50762ee to 6360f1c Compare July 4, 2018 12:25

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 4, 2018 12:25 Inactive

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from 6360f1c to cfef1ef Compare July 4, 2018 13:01

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-853 July 4, 2018 13:01 Inactive

36degrees reviewed Jul 5, 2018

View reviewed changes

36degrees approved these changes Jul 5, 2018

View reviewed changes

Jani Kraner added 2 commits July 5, 2018 19:58

Allow the panel component heading level to be customisable

4f0e8f3

Default is h2.

Document in CHANGELOG

866e107

kr8n3r force-pushed the allow-panel-heading-level-customisation branch from cfef1ef to 866e107 Compare July 5, 2018 18:58

govuk-design-system-ci deployed to govuk-frontend-review-pr-853 July 5, 2018 18:58 View deployment

kr8n3r merged commit e11e5c5 into master Jul 5, 2018

kr8n3r deleted the allow-panel-heading-level-customisation branch July 5, 2018 19:01

NickColley mentioned this pull request Jul 13, 2018

Release v1.1.0 #893

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Allow the panel component title heading level to be customisable #853

Allow the panel component title heading level to be customisable #853

kr8n3r commented Jul 2, 2018 •

edited

Loading

NickColley Jul 2, 2018 •

edited

Loading

kr8n3r Jul 2, 2018

kr8n3r Jul 2, 2018

36degrees Jul 2, 2018

NickColley Jul 2, 2018

36degrees Jul 2, 2018

kr8n3r Jul 2, 2018

36degrees Jul 2, 2018

36degrees Jul 5, 2018

36degrees left a comment

joelanman commented Jul 5, 2018

kr8n3r commented Jul 5, 2018

joelanman commented Jul 5, 2018

		@@ -1,9 +1,10 @@
		{% set titleLevel = params.titleLevel if params.titleLevel else 1 %}

Allow the panel component title heading level to be customisable #853

Allow the panel component title heading level to be customisable #853

Conversation

kr8n3r commented Jul 2, 2018 • edited Loading

NickColley Jul 2, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

36degrees left a comment

Choose a reason for hiding this comment

joelanman commented Jul 5, 2018

kr8n3r commented Jul 5, 2018

joelanman commented Jul 5, 2018

kr8n3r commented Jul 2, 2018 •

edited

Loading

NickColley Jul 2, 2018 •

edited

Loading