fix: set label text not selectable to improve input focus usability (#120)

ionut · web-flow · commit 0520714241d6 · 2025-10-28T13:20:00.000+02:00
* fix: set input label text not selectable to improve input focus usability

* fix: set label text not selectable for toggle label
diff --git a/src/cosmoz-toggle.ts b/src/cosmoz-toggle.ts
@@ -75,6 +75,7 @@ export const toggleStyles = css`
 		font-size: 14px;
 		line-height: 18px;
 		cursor: pointer;
+		user-select: none;
 	}
 	.toggle[disabled] {
 		opacity: 0.6;
diff --git a/src/styles.ts b/src/styles.ts
@@ -109,6 +109,7 @@ export const styles = css`
 		text-overflow: ellipsis;
 		text-transform: var(--cosmoz-input-label-text-transform);
 		font-weight: var(--cosmoz-input-label-font-weight);
+		user-select: none;
 	}
 
 	.wrap:has(#input:not(:placeholder-shown)) {

Original file line number	Diff line number	Diff line change
@@ -75,6 +75,7 @@ export const toggleStyles = css`
`75`	`75`	`font-size: 14px;`
`76`	`76`	`line-height: 18px;`
`77`	`77`	`cursor: pointer;`
	`78`	`+ user-select: none;`
`78`	`79`	`}`
`79`	`80`	`.toggle[disabled] {`
`80`	`81`	`opacity: 0.6;`
Original file line number	Diff line number	Diff line change
@@ -109,6 +109,7 @@ export const styles = css`
`109`	`109`	`text-overflow: ellipsis;`
`110`	`110`	`text-transform: var(--cosmoz-input-label-text-transform);`
`111`	`111`	`font-weight: var(--cosmoz-input-label-font-weight);`
	`112`	`+ user-select: none;`
`112`	`113`	`}`
`113`	`114`
`114`	`115`	`.wrap:has(#input:not(:placeholder-shown)) {`