Skip to content

Commit 8c66a86

Browse files
Docs: document the shipped .user-select-text utility
1 parent f39e617 commit 8c66a86

1 file changed

Lines changed: 2 additions & 0 deletions

File tree

site/src/content/docs/utilities/user-select.mdx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,14 @@ Change the way in which the content is selected when the user interacts with it
1515

1616
<Example code={`<p class="user-select-all">This paragraph will be entirely selected when clicked by the user.</p>
1717
<p class="user-select-auto">This paragraph has default select behavior.</p>
18+
<p class="user-select-text">This paragraph will only allow the text to be selected when clicked by the user, even if the CSS \`user-select\` property is set to something else.</p>
1819
<p class="user-select-none">This paragraph will not be selectable when clicked by the user.</p>`} />
1920

2021
## Use cases
2122

2223
- **`.user-select-all`** - Useful for code snippets, IDs, or other content users might want to copy entirely
2324
- **`.user-select-auto`** - Default browser behavior, allows normal text selection
25+
- **`.user-select-text`** - Forces text to remain selectable, useful for overriding a `user-select: none` set by an ancestor
2426
- **`.user-select-none`** - Prevents text selection, useful for UI elements, buttons, or decorative text
2527

2628
<Callout>

0 commit comments

Comments
 (0)