diff --git a/.changeset/word-break-updates.md b/.changeset/word-break-updates.md new file mode 100644 index 00000000000..95d664fad32 --- /dev/null +++ b/.changeset/word-break-updates.md @@ -0,0 +1,7 @@ +--- +'@spectrum-web-components/textfield': patch +'@spectrum-web-components/sidenav': patch +'@spectrum-web-components/tooltip': patch +--- + +Replace deprecated `word-break: break-word` with `overflow-wrap: break-word` to align with modern CSS standards and improve cross-browser compatibility. This property was deprecated in Chrome 44 (July 2015) in favor of the standardized `overflow-wrap` property. diff --git a/packages/sidenav/src/spectrum-sidenav-item.css b/packages/sidenav/src/spectrum-sidenav-item.css index e92c2afb54e..c94ce9082e2 100644 --- a/packages/sidenav/src/spectrum-sidenav-item.css +++ b/packages/sidenav/src/spectrum-sidenav-item.css @@ -130,7 +130,7 @@ governing permissions and limitations under the License. #item-link { padding-inline: var(--mod-sidenav-inline-padding, var(--spectrum-sidenav-inline-padding)); box-sizing: border-box; - word-break: break-word; + overflow-wrap: break-word; hyphens: auto; cursor: pointer; transition: diff --git a/packages/textfield/src/textfield.css b/packages/textfield/src/textfield.css index ab8e418ec00..ba1816b2861 100644 --- a/packages/textfield/src/textfield.css +++ b/packages/textfield/src/textfield.css @@ -56,8 +56,7 @@ textarea { #sizer { block-size: auto; - /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */ - word-break: break-word; + overflow-wrap: break-word; opacity: 0; white-space: pre-line; } diff --git a/packages/tooltip/src/spectrum-tooltip.css b/packages/tooltip/src/spectrum-tooltip.css index d4fe6adcead..f7d7bc9fe2b 100644 --- a/packages/tooltip/src/spectrum-tooltip.css +++ b/packages/tooltip/src/spectrum-tooltip.css @@ -92,7 +92,7 @@ governing permissions and limitations under the License. font-size: var(--mod-tooltip-font-size, var(--spectrum-tooltip-font-size)); font-weight: var(--mod-tooltip-font-weight, var(--spectrum-tooltip-font-weight)); line-height: var(--mod-tooltip-line-height, var(--spectrum-tooltip-line-height)); - word-break: break-word; + overflow-wrap: break-word; -webkit-font-smoothing: antialiased; cursor: default; -webkit-user-select: none;