diff --git a/CHANGELOG.unreleased.md b/CHANGELOG.unreleased.md
index efefa677..10b564ae 100644
--- a/CHANGELOG.unreleased.md
+++ b/CHANGELOG.unreleased.md
@@ -1082,6 +1082,35 @@ sometimes{{nogaps}}areimportant
{{name}} is your name
```
+#### Angular: Add formatting for `i18n` attributes ([#6695] by [@voithos])
+
+Prettier will auto-wrap the contents of `i18n` attributes once they exceed the line length.
+
+
+```html
+
+
+ Hello!
+
+
+
+
+ Hello!
+
+
+
+
+ Hello!
+
+```
+
#### JavaScript: Break arrays of arrays/objects if each element has more than one element/property ([#6694] by [@sosukesuzuki])
@@ -1177,6 +1206,7 @@ new Map([
[#6646]: https://github.com/prettier/prettier/pull/6646
[#6666]: https://github.com/prettier/prettier/pull/6666
[#6673]: https://github.com/prettier/prettier/pull/6673
+[#6695]: https://github.com/prettier/prettier/pull/6695
[#6694]: https://github.com/prettier/prettier/pull/6694
[@brainkim]: https://github.com/brainkim
[@duailibe]: https://github.com/duailibe
@@ -1194,3 +1224,4 @@ new Map([
[@selvazhagan]: https://github.com/selvazhagan
[@chadian]: https://github.com/chadian
[@kaicataldo]: https://github.com/kaicataldo
+[@voithos]: https://github.com/voithos
diff --git a/src/language-html/printer-html.js b/src/language-html/printer-html.js
index 9a082ba4..ba073a41 100644
--- a/src/language-html/printer-html.js
+++ b/src/language-html/printer-html.js
@@ -1033,6 +1033,11 @@ function printEmbeddedAttributeValue(node, originalTextToDoc, options) {
* bindon-target="angularExpression"
*/
const ngExpressionBindingPatterns = ["^\\[.+\\]$", "^bind(on)?-"];
+ /**
+ * i18n="longDescription"
+ * i18n-attr="longDescription"
+ */
+ const ngI18nPatterns = ["^i18n(-.+)?$"];
if (isKeyMatched(ngStatementBindingPatterns)) {
return printMaybeHug(ngTextToDoc(getValue(), { parser: "__ng_action" }));
@@ -1042,6 +1047,10 @@ function printEmbeddedAttributeValue(node, originalTextToDoc, options) {
return printMaybeHug(ngTextToDoc(getValue(), { parser: "__ng_binding" }));
}
+ if (isKeyMatched(ngI18nPatterns)) {
+ return printExpand(fill(getTextValueParts(node, getValue())));
+ }
+
if (isKeyMatched(ngDirectiveBindingPatterns)) {
return printMaybeHug(
ngTextToDoc(getValue(), { parser: "__ng_directive" })
diff --git a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap
index 94383d6d..c305f1f7 100644
--- a/tests/html_angular/__snapshots__/jsfmt.spec.js.snap
+++ b/tests/html_angular/__snapshots__/jsfmt.spec.js.snap
@@ -182,6 +182,15 @@ printWidth: 80
{{ valid }}
baz'
+ i18n="Normal i18n text"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n-test="Attribute i18n text"
+ i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription"
>
=====================================output=====================================
@@ -308,6 +317,31 @@ printWidth: 80
{{ valid }}
baz"
+ i18n="Normal i18n text"
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n-test="Attribute i18n text"
+ i18n-test="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is yet another very long internationalization description text,
+ exceeding the configured print width, but could easily be formatted
+ "
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="
+ some meaning|Some very long internationalization description text exceeding
+ the configured print width@@customIdWithDescription
+ "
>
================================================================================
@@ -420,6 +454,15 @@ trailingComma: "es5"
{{ valid }}
baz'
+ i18n="Normal i18n text"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n-test="Attribute i18n text"
+ i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription"
>
=====================================output=====================================
@@ -546,6 +589,31 @@ trailingComma: "es5"
{{ valid }}
baz"
+ i18n="Normal i18n text"
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n-test="Attribute i18n text"
+ i18n-test="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is yet another very long internationalization description text,
+ exceeding the configured print width, but could easily be formatted
+ "
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="
+ some meaning|Some very long internationalization description text exceeding
+ the configured print width@@customIdWithDescription
+ "
>
================================================================================
@@ -657,6 +725,15 @@ printWidth: 1
{{ valid }}
baz'
+ i18n="Normal i18n text"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n-test="Attribute i18n text"
+ i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription"
>
=====================================output=====================================
@@ -1023,6 +1100,123 @@ printWidth: 1
}}
baz"
+ i18n="
+ Normal
+ i18n
+ text
+ "
+ i18n="
+ This
+ is
+ a
+ very
+ long
+ internationalization
+ description
+ text,
+ exceeding
+ the
+ configured
+ print
+ width,
+ but
+ could
+ easily
+ be
+ formatted
+ "
+ i18n-test="
+ Attribute
+ i18n
+ text
+ "
+ i18n-test="
+ This
+ is
+ a
+ very
+ long
+ internationalization
+ description
+ text,
+ exceeding
+ the
+ configured
+ print
+ width,
+ but
+ could
+ easily
+ be
+ formatted
+ "
+ i18n="
+ This
+ is
+ a
+ very
+ long
+ internationalization
+ description
+ text,
+ exceeding
+ the
+ configured
+ print
+ width,
+ but
+ could
+ easily
+ be
+ formatted
+ "
+ i18n="
+ This
+ is
+ yet
+ another
+ very
+ long
+ internationalization
+ description
+ text,
+ exceeding
+ the
+ configured
+ print
+ width,
+ but
+ could
+ easily
+ be
+ formatted
+ "
+ i18n="
+ @@customId
+ "
+ i18n="
+ Some
+ description@@customIdWithDescription
+ "
+ i18n="
+ some
+ meaning|Some
+ description@@customIdWithDescription
+ "
+ i18n="
+ some
+ meaning|Some
+ very
+ long
+ internationalization
+ description
+ text
+ exceeding
+ the
+ configured
+ print
+ width@@customIdWithDescription
+ "
>
================================================================================
@@ -1135,6 +1329,15 @@ printWidth: 80
{{ valid }}
baz'
+ i18n="Normal i18n text"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n-test="Attribute i18n text"
+ i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription"
>
=====================================output=====================================
@@ -1261,6 +1464,31 @@ printWidth: 80
{{ valid }}
baz"
+ i18n="Normal i18n text"
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n-test="Attribute i18n text"
+ i18n-test="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is yet another very long internationalization description text,
+ exceeding the configured print width, but could easily be formatted
+ "
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="
+ some meaning|Some very long internationalization description text exceeding
+ the configured print width@@customIdWithDescription
+ "
>
================================================================================
@@ -1373,6 +1601,15 @@ printWidth: 80
{{ valid }}
baz'
+ i18n="Normal i18n text"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n-test="Attribute i18n text"
+ i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription"
>
=====================================output=====================================
@@ -1499,6 +1736,31 @@ printWidth: 80
{{ valid }}
baz"
+ i18n="Normal i18n text"
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n-test="Attribute i18n text"
+ i18n-test="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is a very long internationalization description text, exceeding the
+ configured print width, but could easily be formatted
+ "
+ i18n="
+ This is yet another very long internationalization description text,
+ exceeding the configured print width, but could easily be formatted
+ "
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="
+ some meaning|Some very long internationalization description text exceeding
+ the configured print width@@customIdWithDescription
+ "
>
================================================================================
diff --git a/tests/html_angular/attributes.component.html b/tests/html_angular/attributes.component.html
index 291533d0..1fa9c389 100644
--- a/tests/html_angular/attributes.component.html
+++ b/tests/html_angular/attributes.component.html
@@ -98,4 +98,13 @@
{{ valid }}
baz'
+ i18n="Normal i18n text"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n-test="Attribute i18n text"
+ i18n-test="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="This is a very long internationalization description text, exceeding the configured print width, but could easily be formatted" i18n="This is yet another very long internationalization description text, exceeding the configured print width, but could easily be formatted"
+ i18n="@@customId"
+ i18n="Some description@@customIdWithDescription"
+ i18n="some meaning|Some description@@customIdWithDescription"
+ i18n="some meaning|Some very long internationalization description text exceeding the configured print width@@customIdWithDescription"
>