Character counter

[gavinwye]

There is a character counter in the HMRC design system but there is also a character counter that's being developed by GDS (@alex-ju).

We should not be replicating things that have been done before in other places. instead, we should try to build on top of what other people have done. The HMRC character counter was developed a long time ago and has not been iterated.

The GDS version is more recent and has more functionality.

We should move HMRC services towards using the newer GDS version of the character counter. This version is still in development and needs more work. We could pick up some of this work as part of implementing it into HMRC services - testing it and refining in the process.

The HMRC version of the character counter is used in the following services frontends.

Service	GitHub instance	Usage count
childcare-calculator-frontend	(public)	[1]
claim-tax-refund-frontend	(public)	[1]
legged-up-childcare-frontend	(enterprise)	[1]
paye-registration-frontend	(public)	[1]
paye-settlement-agreements-frontend	(public)	[1]
residence-nil-rate-band-calculator-frontend	(public)	[1]
social-care-compliance-frontend	(enterprise)	[1]
valuation-office-agency-contact-frontend	(public)	[1]

More precise details of where the character counter is used

[
  {
    "name": "childcare-calculator-frontend",
    "github": "public",
    "count": 1,
    "files": [
      {
        "url": "https://github.com/hmrc/childcare-calculator-frontend/blob/master/app/uk/gov/hmrc/childcarecalculatorfrontend/views/components/input_textarea.scala.html#L52",
        "path": "/app/uk/gov/hmrc/childcarecalculatorfrontend/views/components/input_textarea.scala.html",
        "line": 52,
        "match": "<p class=\"char-counter-text flush\">@messages(\"site.textarea.char_limit\", charLimit.get)</p>"
      }
    ]
  },
  {
    "name": "claim-tax-refund-frontend",
    "github": "public",
    "count": 1,
    "files": [
      {
        "url": "https://github.com/hmrc/claim-tax-refund-frontend/blob/master/app/views/components/input_textarea.scala.html#L52",
        "path": "/app/views/components/input_textarea.scala.html",
        "line": 52,
        "match": "<p class=\"char-counter-text flush\">@messages(\"site.textarea.char_limit\", charLimit.get)</p>"
      }
    ]
  },
  {
    "name": "legged-up-childcare-frontend",
    "github": "enterprise",
    "count": 1,
    "files": [
      {
        "url": "/HMRC/legged-up-childcare-frontend/blob/master/app/uk/gov/hmrc/childcarecalculatorfrontend/views/components/input_textarea.scala.html#L52",
        "path": "/app/uk/gov/hmrc/childcarecalculatorfrontend/views/components/input_textarea.scala.html",
        "line": 52,
        "match": "<p class=\"char-counter-text flush\">@messages(\"site.textarea.char_limit\", charLimit.get)</p>"
      }
    ]
  },
  {
    "name": "paye-registration-frontend",
    "github": "public",
    "count": 1,
    "files": [
      {
        "url": "https://github.com/hmrc/paye-registration-frontend/blob/master/app/views/pages/natureOfBusiness.scala.html#L28",
        "path": "/app/views/pages/natureOfBusiness.scala.html",
        "line": 28,
        "match": "<p class=\"char-counter-text flush\" id=\"no-js-counter-text\">"
      }
    ]
  },
  {
    "name": "paye-settlement-agreements-frontend",
    "github": "public",
    "count": 1,
    "files": [
      {
        "url": "https://github.com/hmrc/paye-settlement-agreements-frontend/blob/master/app/uk/gov/hmrc/payesettlementagreementsfrontend/views/components/input_textarea.scala.html#L52",
        "path": "/app/uk/gov/hmrc/payesettlementagreementsfrontend/views/components/input_textarea.scala.html",
        "line": 52,
        "match": "<p class=\"char-counter-text flush\">@messages(\"site.textarea.char_limit\", charLimit.get)</p>"
      }
    ]
  },
  {
    "name": "residence-nil-rate-band-calculator-frontend",
    "github": "public",
    "count": 1,
    "files": [
      {
        "url": "https://github.com/hmrc/residence-nil-rate-band-calculator-frontend/blob/master/app/uk/gov/hmrc/residencenilratebandcalculator/views/rnrbHelpers/input_textarea.scala.html#L35",
        "path": "/app/uk/gov/hmrc/residencenilratebandcalculator/views/rnrbHelpers/input_textarea.scala.html",
        "line": 35,
        "match": "<p class=\"char-counter-text flush\">@messages(\"site.textarea.char_limit\")</p>"
      }
    ]
  },
  {
    "name": "social-care-compliance-frontend",
    "github": "enterprise",
    "count": 1,
    "files": [
      {
        "url": "/HMRC/social-care-compliance-frontend/blob/master/app/views/components/input_textarea.scala.html#L52",
        "path": "/app/views/components/input_textarea.scala.html",
        "line": 52,
        "match": "<p class=\"char-counter-text flush\">@messages(\"site.textarea.char_limit\", charLimit.get)</p>"
      }
    ]
  },
  {
    "name": "valuation-office-agency-contact-frontend",
    "github": "public",
    "count": 1,
    "files": [
      {
        "url": "https://github.com/hmrc/valuation-office-agency-contact-frontend/blob/master/app/uk/gov/hmrc/valuationofficeagencycontactfrontend/views/components/input_textarea.scala.html#L54",
        "path": "/app/uk/gov/hmrc/valuationofficeagencycontactfrontend/views/components/input_textarea.scala.html",
        "line": 54,
        "match": "<p class=\"char-counter-text flush\">@messages(\"site.textarea.char_limit\", charLimit.get)</p>"
      }
    ]
  },
  "8 occurrences found in 8 projects"
]

[stevenaproctor]

This issue is closed because we should be using the version in the GOV.UK Design System.