Skip to content

Commit 4a5c9bb

Browse files
lisalupilisalupi
committed
fix(Text): oneLine overflow
1 parent 19d643c commit 4a5c9bb

15 files changed

Lines changed: 173 additions & 161 deletions

File tree

‎.changeset/common-moose-live.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@ultraviolet/ui": patch
3+
---
4+
5+
`Text`: add `min-width` to the popup container when `oneLine` is enable to ensure the ellipsis works properly

‎packages/form/src/components/TagInputField/__tests__/__snapshots__/index.test.tsx.snap‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ exports[`tagInputField > should render correctly with regex 1`] = `
7474
class="uv_d6zknp0 uv_d6zknp5"
7575
>
7676
<span
77-
class="uv_d6zknp1c uv_m4c9ow0 uv_m4c9ow3 uv_m4c9ow4 uv_m4c9owp uv_m4c9ow1a"
77+
class="uv_d6zknp1c uv_m4c9ow0 uv_m4c9ow3 uv_m4c9ow4 uv_m4c9owp uv_m4c9ow1a uv_m4c9ow3e"
7878
>
7979
4
8080
</span>
@@ -180,7 +180,7 @@ exports[`tagInputField > should works with defaultValues 1`] = `
180180
class="uv_d6zknp0 uv_d6zknp5"
181181
>
182182
<span
183-
class="uv_d6zknp1c uv_m4c9ow0 uv_m4c9ow3 uv_m4c9ow4 uv_m4c9owp uv_m4c9ow1a"
183+
class="uv_d6zknp1c uv_m4c9ow0 uv_m4c9ow3 uv_m4c9ow4 uv_m4c9owp uv_m4c9ow1a uv_m4c9ow3e"
184184
>
185185
First
186186
</span>

‎packages/ui/src/components/FileInput/__tests__/__snapshots__/index.test.tsx.snap‎

Lines changed: 36 additions & 36 deletions
Large diffs are not rendered by default.

‎packages/ui/src/components/Popup/styles.css.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { keyframes, styleVariants } from '@vanilla-extract/css'
33
import { recipe } from '@vanilla-extract/recipes'
44

55
import { tagListStyle } from '../TagList/styles.css'
6+
import { textStyle } from '../Text/style.css'
67

78
import { DEFAULT_ARROW_WIDTH } from './helpers'
89
import {
@@ -118,6 +119,9 @@ const childrenContainer = recipe({
118119
[`${tagListStyle.ellipsisChild} > &`]: {
119120
minWidth: 0,
120121
},
122+
[`&:has(.${textStyle.oneLine})`]: {
123+
minWidth: 0,
124+
},
121125
},
122126
},
123127
variants: {

‎packages/ui/src/components/SelectInput/__tests__/__snapshots__/index.test.tsx.snap‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -939,7 +939,7 @@ exports[`selectInput > renders correctly multiselect 1`] = `
939939
style="--r8qe41: auto; --r8qe40: 1024px;"
940940
>
941941
<span
942-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
942+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
943943
>
944944
Pluto
945945
</span>
@@ -2595,7 +2595,7 @@ exports[`selectInput > renders correctly unclosable tags when readonly 1`] = `
25952595
style="--r8qe41: auto; --r8qe40: 1024px;"
25962596
>
25972597
<span
2598-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
2598+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
25992599
>
26002600
Venus
26012601
</span>

‎packages/ui/src/components/Tag/__tests__/__snapshots__/index.test.tsx.snap‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ exports[`tag > renders correctly 1`] = `
99
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
1010
>
1111
<span
12-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
12+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
1313
>
1414
test
1515
</span>
@@ -27,7 +27,7 @@ exports[`tag > renders correctly colored 1`] = `
2727
class="styles__d6zknp0 styles_sentiment_primary__d6zknp6"
2828
>
2929
<span
30-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
30+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
3131
>
3232
test
3333
</span>
@@ -45,7 +45,7 @@ exports[`tag > renders correctly disabled 1`] = `
4545
class="styles__d6zknp0 styles_disabled_true__d6zknp2 styles_sentiment_neutral__d6zknp5 styles_undefined_compound_23__d6zknp10"
4646
>
4747
<span
48-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
48+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
4949
>
5050
test
5151
</span>
@@ -63,7 +63,7 @@ exports[`tag > renders correctly neutral 1`] = `
6363
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
6464
>
6565
<span
66-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
66+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
6767
>
6868
test
6969
</span>
@@ -81,7 +81,7 @@ exports[`tag > renders correctly with code variant 1`] = `
8181
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
8282
>
8383
<span
84-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_code__m4c9owv style_undefined_compound_0__m4c9ow1a"
84+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_code__m4c9owv style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
8585
>
8686
test
8787
</span>
@@ -106,7 +106,7 @@ exports[`tag > renders correctly with copiable 1`] = `
106106
type="button"
107107
>
108108
<span
109-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
109+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
110110
>
111111
test
112112
</span>
@@ -132,7 +132,7 @@ exports[`tag > renders correctly with copiable and copy button 1`] = `
132132
type="button"
133133
>
134134
<span
135-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
135+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
136136
>
137137
test
138138
</span>
@@ -171,7 +171,7 @@ exports[`tag > renders correctly with icon 1`] = `
171171
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
172172
>
173173
<span
174-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
174+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
175175
>
176176
<svg
177177
class="uv_icons_1sbwqkz0 uv_icons_1sbwqkz1 uv_icons_1sbwqkz3 uv_icons_1sbwqkzg uv_icons_1sbwqkz1n"
@@ -204,7 +204,7 @@ exports[`tag > renders correctly with isLoading 1`] = `
204204
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
205205
>
206206
<span
207-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
207+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
208208
>
209209
test
210210
</span>
@@ -254,7 +254,7 @@ exports[`tag > renders correctly with key-value variant 1`] = `
254254
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5 styles_isKey_true__d6zknpa styles_isKeyValue_true__d6zknpc styles_undefined_compound_9__d6zknpm styles_undefined_compound_16__d6zknpt"
255255
>
256256
<span
257-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
257+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
258258
>
259259
key
260260
</span>
@@ -263,7 +263,7 @@ exports[`tag > renders correctly with key-value variant 1`] = `
263263
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5 styles_isValue_true__d6zknpb styles_isKeyValue_true__d6zknpc styles_undefined_compound_16__d6zknpt"
264264
>
265265
<span
266-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
266+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
267267
>
268268
value
269269
</span>
@@ -281,7 +281,7 @@ exports[`tag > renders correctly with onClose 1`] = `
281281
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
282282
>
283283
<span
284-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
284+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
285285
>
286286
test
287287
</span>

‎packages/ui/src/components/TagInput/__tests__/__snapshots__/index.test.tsx.snap‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -296,7 +296,7 @@ exports[`tagInput > should renders correctly with some tags 1`] = `
296296
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
297297
>
298298
<span
299-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
299+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
300300
>
301301
hello
302302
</span>
@@ -325,7 +325,7 @@ exports[`tagInput > should renders correctly with some tags 1`] = `
325325
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
326326
>
327327
<span
328-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
328+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
329329
>
330330
world
331331
</span>
@@ -390,7 +390,7 @@ exports[`tagInput > should renders correctly with some tags objects 1`] = `
390390
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
391391
>
392392
<span
393-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
393+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
394394
>
395395
hello
396396
</span>
@@ -419,7 +419,7 @@ exports[`tagInput > should renders correctly with some tags objects 1`] = `
419419
class="styles__d6zknp0 styles_sentiment_neutral__d6zknp5"
420420
>
421421
<span
422-
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a"
422+
class="styles__d6zknp1c style__m4c9ow0 style_oneLine_true__m4c9ow3 style_prominence_default__m4c9ow4 style_variant_caption__m4c9owp style_undefined_compound_0__m4c9ow1a style__m4c9ow3e"
423423
>
424424
world
425425
</span>

0 commit comments

Comments
 (0)