{% from "nhsuk/components/button/macro.njk" import button as nhsukButton %}
{% from "nhsuk/components/input/macro.njk" import input as nhsukInput %}
{% from "nhsuk/macros/attributes.njk" import nhsukAttributes %}
{% from "nhsuk/macros/i18n.njk" import nhsukI18nAttributes %}

{#- Set classes for this component #}
{%- set classNames = "nhsuk-password-input__input nhsuk-js-password-input-input" -%}
{%- set classNamesFormGroup = "nhsuk-password-input" -%}

{%- if params.classes %}
  {% set classNames = classNames ~ " " ~ params.classes %}
{% endif %}

{%- if params.formGroup.classes %}
  {% set classNamesFormGroup = params.formGroup.classes ~ " " ~ classNamesFormGroup %}
{% endif %}

{%- set id = params.id if params.id else params.name -%}

{% set attributesHtml -%}
  {{- nhsukAttributes({
    "data-module": "nhsuk-password-input"
  }) -}}

  {{- nhsukI18nAttributes({
    key: "show-password",
    message: params.showPasswordText | default(params.button.text)
  }) -}}

  {{- nhsukI18nAttributes({
    key: "hide-password",
    message: params.hidePasswordText
  }) -}}

  {{- nhsukI18nAttributes({
    key: "show-password-aria-label",
    message: params.showPasswordAriaLabel | default(params.showPasswordAriaLabelText) | default(params.button.ariaLabel)
  }) -}}

  {{- nhsukI18nAttributes({
    key: "hide-password-aria-label",
    message: params.hidePasswordAriaLabel | default(params.hidePasswordAriaLabelText)
  }) -}}

  {{- nhsukI18nAttributes({
    key: "password-shown-announcement",
    message: params.passwordShownAnnouncementText
  }) -}}

  {{- nhsukI18nAttributes({
    key: "password-hidden-announcement",
    message: params.passwordHiddenAnnouncementText
  }) -}}

  {{- nhsukAttributes(params.formGroup.attributes) -}}
{%- endset -%}

{%- set buttonHtml %}
{{ nhsukButton({
  text: params.showPasswordText | default(params.button.text) | default("Show"),
  ariaLabel: params.showPasswordAriaLabel | default(params.showPasswordAriaLabelText) | default(params.button.ariaLabel) | default("Show password"),
  id: params.button.id,
  href: params.button.href,
  name: params.button.name,
  value: params.button.value,
  type: params.button.type | default("button", true),
  icon: params.button.icon,
  small: params.button.small | default(not params.large),
  preventDoubleClick: params.button.preventDoubleClick,
  disabled: params.button.disabled | default(params.disabled),
  classes: "nhsuk-password-input__toggle nhsuk-js-password-input-toggle" ~ (" " ~ params.button.classes if params.button.classes),
  attributes: {
    "aria-controls": id,
    "hidden": {
      value: true,
      optional: true
    }
  },
  variant: params.button.variant | default("secondary")
}) | trim }}
{% if params.formGroup.afterInput %}
  {{- params.formGroup.afterInput.html | safe | trim if params.formGroup.afterInput.html else params.formGroup.afterInput.text }}
{% endif -%}
{% endset -%}

{{ nhsukInput({
  label: params.label,
  hint: params.hint,
  errorMessage: params.errorMessage,
  id: id,
  name: params.name,
  value: params.value,
  type: "password",
  prefix: params.prefix,
  suffix: params.suffix,
  code: params.code,
  width: params.width,
  large: params.large,
  spellcheck: false,
  autocomplete: params.autocomplete if params.autocomplete else "current-password",
  autocapitalize: "none",
  disabled: params.disabled,
  describedBy: params.describedBy,
  classes: classNames,
  attributes: params.attributes,
  inputWrapper: params.inputWrapper,
  formGroup: {
    classes: classNamesFormGroup,
    attributes: attributesHtml,
    beforeInput: params.formGroup.beforeInput,
    afterInput: {
      html: buttonHtml
    }
  }
}) | trim }}