@@ -17,8 +17,11 @@ export const config = {
1717 ${ tokens . textFieldClearPlaceholderColor } : var(- - text- secondary);
1818 ${ tokens . textFieldClearPlaceholderColorFocus } : var(- - text- tertiary);
1919
20- ${ tokens . textFieldBackgroundColor } : var(- - surface- transparent- primary);
21- ${ tokens . textFieldBackgroundColorFocus } : var(- - surface- transparent- secondary);
20+ ${ tokens . textFieldBackgroundColor } : var(- - surface- transparent- card);
21+ ${ tokens . textFieldBackgroundColorFocus } : var(- - surface- transparent- card);
22+ ${ tokens . textFieldBorderColor } : var(- - outline-solid- primary);
23+ ${ tokens . textFieldBorderColorHover } : var(- - outline-solid- primary- hover);
24+ ${ tokens . textFieldBorderColorFocus } : var(- - outline-accent);
2225 ${ tokens . textFieldCaretColor } : var(- - text- accent);
2326 ${ tokens . textFieldTextBeforeColor } : var(- - text- tertiary);
2427 ${ tokens . textFieldTextAfterColor } : var(- - text- tertiary);
@@ -61,6 +64,9 @@ export const config = {
6164
6265 ${ tokens . textFieldBackgroundColor } : var(- - surface- transparent- positive);
6366 ${ tokens . textFieldBackgroundColorFocus } : var(- - surface- transparent- positive-active);
67+ ${ tokens . textFieldBorderColor } : var(- - outline-transparent- positive);
68+ ${ tokens . textFieldBorderColorHover } : var(- - outline-transparent- positive-hover);
69+ ${ tokens . textFieldBorderColorFocus } : var(- - outline-transparent- positive-active);
6470 ${ tokens . textFieldCaretColor } : var(- - text- accent);
6571 ${ tokens . textFieldTextBeforeColor } : var(- - text- tertiary);
6672 ${ tokens . textFieldTextAfterColor } : var(- - text- tertiary);
@@ -103,6 +109,9 @@ export const config = {
103109
104110 ${ tokens . textFieldBackgroundColor } : var(- - surface- transparent- warning);
105111 ${ tokens . textFieldBackgroundColorFocus } : var(- - surface- transparent- warning- active);
112+ ${ tokens . textFieldBorderColor } : var(- - outline-transparent- warning);
113+ ${ tokens . textFieldBorderColorHover } : var(- - outline-transparent- warning- hover);
114+ ${ tokens . textFieldBorderColorFocus } : var(- - outline-transparent- warning- active);
106115 ${ tokens . textFieldCaretColor } : var(- - text- accent);
107116 ${ tokens . textFieldTextBeforeColor } : var(- - text- tertiary);
108117 ${ tokens . textFieldTextAfterColor } : var(- - text- tertiary);
@@ -145,6 +154,9 @@ export const config = {
145154
146155 ${ tokens . textFieldBackgroundColor } : var(- - surface- transparent- negative);
147156 ${ tokens . textFieldBackgroundColorFocus } : var(- - surface- transparent- negative-active);
157+ ${ tokens . textFieldBorderColor } : var(- - outline-transparent- negative);
158+ ${ tokens . textFieldBorderColorHover } : var(- - outline-transparent- negative-hover);
159+ ${ tokens . textFieldBorderColorFocus } : var(- - outline-transparent- negative-active);
148160 ${ tokens . textFieldCaretColor } : var(- - text- accent);
149161 ${ tokens . textFieldTextBeforeColor } : var(- - text- tertiary);
150162 ${ tokens . textFieldTextAfterColor } : var(- - text- tertiary);
@@ -200,6 +212,7 @@ export const config = {
200212 ${ tokens . textFieldLetterSpacing } : var(- - plasma- typo- body- l- letter- spacing);
201213 ${ tokens . textFieldLineHeight } : var(- - plasma- typo- body- l- line-height);
202214
215+ ${ tokens . textFieldBorderWidth } : 0.125rem;
203216 ${ tokens . textFieldLabelOffset } : 0.75rem;
204217 ${ tokens . textFieldClearLabelOffset } : 0.25rem;
205218 ${ tokens . textFieldLabelFontFamily } : var(- - plasma- typo- body- l- font- family);
@@ -275,6 +288,7 @@ export const config = {
275288 ${ tokens . textFieldLetterSpacing } : var(- - plasma- typo- body- m- letter- spacing);
276289 ${ tokens . textFieldLineHeight } : var(- - plasma- typo- body- m- line-height);
277290
291+ ${ tokens . textFieldBorderWidth } : 0.125rem;
278292 ${ tokens . textFieldLabelOffset } : 0.625rem;
279293 ${ tokens . textFieldClearLabelOffset } : 0.25rem;
280294 ${ tokens . textFieldLabelFontFamily } : var(- - plasma- typo- body- m- font- family);
@@ -350,6 +364,7 @@ export const config = {
350364 ${ tokens . textFieldLetterSpacing } : var(- - plasma- typo- body- s- letter- spacing);
351365 ${ tokens . textFieldLineHeight } : var(- - plasma- typo- body- s- line-height);
352366
367+ ${ tokens . textFieldBorderWidth } : 0.125rem;
353368 ${ tokens . textFieldLabelOffset } : 0.5rem;
354369 ${ tokens . textFieldClearLabelOffset } : 0.25rem;
355370 ${ tokens . textFieldLabelFontFamily } : var(- - plasma- typo- body- s- font- family);
@@ -425,6 +440,7 @@ export const config = {
425440 ${ tokens . textFieldLetterSpacing } : var(- - plasma- typo- body- xs- letter- spacing);
426441 ${ tokens . textFieldLineHeight } : var(- - plasma- typo- body- xs- line-height);
427442
443+ ${ tokens . textFieldBorderWidth } : 0.125rem;
428444 ${ tokens . textFieldLabelOffset } : 0.375rem;
429445 ${ tokens . textFieldClearLabelOffset } : 0.25rem;
430446 ${ tokens . textFieldLabelFontFamily } : var(- - plasma- typo- body- xs- font- family);
@@ -551,19 +567,26 @@ export const config = {
551567 } ,
552568 disabled : {
553569 true : css `
554- ${ tokens . textFieldDisabledOpacity } : 0.4;
570+ ${ tokens . textFieldDisabledOpacity } : 1;
571+ ${ tokens . textFieldBackgroundColor } : var(- - surface- transparent- secondary);
572+ ${ tokens . textFieldContentSlotRightColor } : var(- - text- secondary);
573+ ${ tokens . textFieldContentSlotRightColorHover } : var(- - text- secondary);
574+ ${ tokens . textFieldContentSlotRightColorActive } : var(- - text- secondary);
555575 ` ,
556576 } ,
557577 readOnly : {
558578 true : css `
559579 ${ tokens . textFieldColorReadOnly } : var(- - text- primary);
560580 ${ tokens . textFieldReadOnlyOpacity } : 0.1;
561- ${ tokens . textFieldContentSlotRightOpacityReadOnly } : 0.4 ;
581+ ${ tokens . textFieldContentSlotRightOpacityReadOnly } : 1 ;
562582 ${ tokens . textFieldBackgroundColorReadOnly } : var(- - surface- transparent- primary);
563583 ${ tokens . textFieldPlaceholderColorReadOnly } : var(- - text- secondary);
564584 ${ tokens . textFieldLeftHelperColorReadOnly } : var(- - text- secondary);
565585 ${ tokens . textFieldLabelColorReadOnly } : var(- - text- primary);
566586 ${ tokens . textFieldDividerColorReadOnly } : var(- - surface- transparent- primary);
587+ ${ tokens . textFieldContentSlotRightColor } : var(- - text- secondary);
588+ ${ tokens . textFieldContentSlotRightColorHover } : var(- - text- secondary);
589+ ${ tokens . textFieldContentSlotRightColorActive } : var(- - text- secondary);
567590 ` ,
568591 } ,
569592 } ,
0 commit comments