chore(contextual-help): add mod to allow max-width

TarunAdobe · TarunAdobe · commit a5ef3a6afdb1 · 2025-01-28T13:11:10.000+05:30
diff --git a/.changeset/spicy-boats-repair.md b/.changeset/spicy-boats-repair.md
@@ -0,0 +1,5 @@
+---
+"@spectrum-css/contextualhelp": patch
+---
+
+Added a --mod property to allow consumers to set a max-width property to contextual help component.
diff --git a/components/contextualhelp/index.css b/components/contextualhelp/index.css
@@ -23,6 +23,9 @@
 
 	position: relative;
 	min-inline-size: var(--mod-spectrum-contextual-help-minimum-width, var(--spectrum-contextual-help-minimum-width));
+
+	/* Allow users to customize max-width of a contextual help component - SWC Issue #4791 */
+	max-inline-size: var(--mod-spectrum-contextual-help-maximum-width);
 }
 
 .spectrum-ContextualHelp-button {
diff --git a/components/contextualhelp/metadata/metadata.json b/components/contextualhelp/metadata/metadata.json
@@ -15,6 +15,7 @@
     "--mod-spectrum-contextual-help-content-spacing",
     "--mod-spectrum-contextual-help-heading-size",
     "--mod-spectrum-contextual-help-link-spacing",
+    "--mod-spectrum-contextual-help-maximum-width",
     "--mod-spectrum-contextual-help-minimum-width",
     "--mod-spectrum-contextual-help-padding"
   ],
diff --git a/components/contextualhelp/metadata/mods.md b/components/contextualhelp/metadata/mods.md
@@ -6,5 +6,6 @@
 | `--mod-spectrum-contextual-help-content-spacing` |
 | `--mod-spectrum-contextual-help-heading-size`    |
 | `--mod-spectrum-contextual-help-link-spacing`    |
+| `--mod-spectrum-contextual-help-maximum-width`   |
 | `--mod-spectrum-contextual-help-minimum-width`   |
 | `--mod-spectrum-contextual-help-padding`         |

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"@spectrum-css/contextualhelp": patch
 +---
++
 +Added a --mod property to allow consumers to set a max-width property to contextual help component.
Original file line number	Diff line number	Diff line change
`@@ -23,6 +23,9 @@`
`23`	`23`
`24`	`24`	`position: relative;`
`25`	`25`	`min-inline-size: var(--mod-spectrum-contextual-help-minimum-width, var(--spectrum-contextual-help-minimum-width));`
	`26`	`+`
	`27`	`+ /* Allow users to customize max-width of a contextual help component - SWC Issue #4791 */`
	`28`	`+ max-inline-size: var(--mod-spectrum-contextual-help-maximum-width);`
`26`	`29`	`}`
`27`	`30`
`28`	`31`	`.spectrum-ContextualHelp-button {`