@transferwise/neptune-css 14.29.1 → 14.29.2

package/dist/css/popovers.css

@@ -72,6 +72,7 @@ button.close {
   letter-spacing: -0.006em;
   font-weight: 400;
   font-weight: var(--font-weight-regular);
+  word-wrap: break-word;
   background-color: #ffffff;
   background-color: var(--color-background-screen);
   background-clip: padding-box;
@@ -79,6 +80,34 @@ button.close {
   box-shadow: 0 20px 66px 0 rgba(34, 48, 73, 0.2);
   position: absolute;
 }
+@supports (hyphenate-limit-chars: 1) {
+  .popover {
+    hyphens: auto;
+    hyphenate-limit-chars: 7 3;
+  }
+  @media (min-width: 840px) {
+    .popover {
+      hyphenate-limit-chars: 8 3;
+    }
+  }
+  @media (min-width: 1160px) {
+    .popover {
+      hyphenate-limit-chars: 10 4 3;
+    }
+  }
+}
+@supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
+  .popover {
+    hyphens: auto;
+    -webkit-hyphenate-limit-before: 3;
+    -webkit-hyphenate-limit-after: 3;
+  }
+  @media (min-width: 1160px) {
+    .popover {
+      -webkit-hyphenate-limit-before: 4;
+    }
+  }
+}
 .np-theme-personal--forest-green .popover,
 .np-theme-personal--bright-green .popover,
 .np-theme-personal--dark .popover {
@@ -236,6 +265,7 @@ button.close {
   line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
+  word-wrap: break-word;
   font-size: 1.125rem;
   font-size: var(--font-size-18);
   font-weight: 600;
@@ -293,9 +323,38 @@ button.close {
   letter-spacing: -0.006em;
   font-weight: 400;
   font-weight: var(--font-weight-regular);
+  word-wrap: break-word;
   color: #5d7079;
   color: var(--color-content-secondary);
 }
+@supports (hyphenate-limit-chars: 1) {
+  .popover-content {
+    hyphens: auto;
+    hyphenate-limit-chars: 7 3;
+  }
+  @media (min-width: 840px) {
+    .popover-content {
+      hyphenate-limit-chars: 8 3;
+    }
+  }
+  @media (min-width: 1160px) {
+    .popover-content {
+      hyphenate-limit-chars: 10 4 3;
+    }
+  }
+}
+@supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
+  .popover-content {
+    hyphens: auto;
+    -webkit-hyphenate-limit-before: 3;
+    -webkit-hyphenate-limit-after: 3;
+  }
+  @media (min-width: 1160px) {
+    .popover-content {
+      -webkit-hyphenate-limit-before: 4;
+    }
+  }
+}
 .popover-content > :last-child {
   margin-block-end: 0;
 }

package/dist/css/tooltip.css

@@ -51,6 +51,7 @@
   letter-spacing: -0.006em;
   font-weight: 400;
   font-weight: var(--font-weight-regular);
+  word-wrap: break-word;
   max-inline-size: 200px;
   min-inline-size: 120px;
   padding-block: 16px;
@@ -65,6 +66,34 @@
   border-radius: 3px;
   box-shadow: 0 1px 28px 0 rgba(34, 48, 73, 0.2);
 }
+@supports (hyphenate-limit-chars: 1) {
+  .tooltip-inner {
+    hyphens: auto;
+    hyphenate-limit-chars: 7 3;
+  }
+  @media (min-width: 840px) {
+    .tooltip-inner {
+      hyphenate-limit-chars: 8 3;
+    }
+  }
+  @media (min-width: 1160px) {
+    .tooltip-inner {
+      hyphenate-limit-chars: 10 4 3;
+    }
+  }
+}
+@supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
+  .tooltip-inner {
+    hyphens: auto;
+    -webkit-hyphenate-limit-before: 3;
+    -webkit-hyphenate-limit-after: 3;
+  }
+  @media (min-width: 1160px) {
+    .tooltip-inner {
+      -webkit-hyphenate-limit-before: 4;
+    }
+  }
+}
 .np-theme-personal--forest-green .tooltip-inner,
 .np-theme-personal--bright-green .tooltip-inner,
 .np-theme-personal--dark .tooltip-inner {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@transferwise/neptune-css",
   "description": "Neptune CSS library",
-  "version": "14.29.1",
+  "version": "14.29.2",
   "license": "MIT",
   "repository": {
     "type": "git",

package/src/less/addons/_spacing-utilities.less

@@ -48,6 +48,8 @@
 }
 
 .np-text-hyphenated {
+  overflow-wrap: break-word;
+
   @supports (hyphenate-limit-chars: 1) {
     hyphens: auto;
     hyphenate-limit-chars: 7 3;

package/src/less/core/_typography.less

@@ -135,6 +135,7 @@ small,
   line-height: 155%;
   letter-spacing: -0.006em;
   font-weight: var(--font-weight-regular);
+  .np-text-hyphenated;
 }
 
 /* DEPRECATED: use .np-text-body-default-bold instead */
@@ -149,6 +150,7 @@ small,
   line-height: 155%;
   letter-spacing: -0.006em;
   font-weight: var(--font-weight-semi-bold);
+  .np-text-hyphenated;
 }
 
 /* DEPRECATED: use .np-text-body-large instead  */
@@ -160,6 +162,7 @@ small,
   font-size: var(--font-size-16);
   line-height: 150%;
   letter-spacing: -0.011em;
+  .np-text-hyphenated;
 }
 
 /* DEPRECATED: use np-text-body-large-bold instead */
@@ -170,6 +173,7 @@ small,
   font-size: var(--font-size-16);
   line-height: 150%;
   letter-spacing: -0.011em;
+  .np-text-hyphenated;
 }
 
 // LINK
@@ -280,6 +284,14 @@ a,
   }
 }
 
+/* Disable hyphenation for Japanese, Thai, and Chinese — these languages use character-level breaks and should never insert hyphens. */
+:lang(ja),
+:lang(th),
+:lang(zh-CN),
+:lang(zh-HK) {
+  hyphens: none;
+}
+
 :lang(af),
 :lang(sq),
 :lang(eu),