@instructure/ui-text-input 8.23.1-snapshot.7 → 8.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -45,7 +45,13 @@ const generateStyle = (
45
45
  state: TextInputStyleProps
46
46
  ): TextInputStyle => {
47
47
  const { size, textAlign, shouldNotWrap } = props
48
- const { disabled, invalid, focused } = state
48
+ const {
49
+ disabled,
50
+ invalid,
51
+ focused,
52
+ beforeElementHasWidth,
53
+ afterElementHasWidth
54
+ } = state
49
55
 
50
56
  const sizeVariants = {
51
57
  small: {
@@ -147,7 +153,6 @@ const generateStyle = (
147
153
 
148
154
  const flexItemBase = {
149
155
  ...viewBase,
150
- minWidth: '0.0625rem',
151
156
  flexShrink: 0
152
157
  }
153
158
 
@@ -194,11 +199,17 @@ const generateStyle = (
194
199
  beforeElement: {
195
200
  label: 'textInput__beforeElement',
196
201
  ...flexItemBase,
197
- paddingInlineStart: componentTheme.padding
202
+ paddingInlineStart: componentTheme.padding,
203
+ // we only override the padding once the width is calculated,
204
+ // it needs the padding on render
205
+ ...(beforeElementHasWidth === false && {
206
+ paddingInlineStart: 0
207
+ })
198
208
  },
199
209
  innerWrapper: {
200
210
  label: 'textInput__innerWrapper',
201
211
  ...flexItemBase,
212
+ minWidth: '0.0625rem',
202
213
  flexShrink: 1,
203
214
  flexGrow: 1
204
215
  },
@@ -209,7 +220,12 @@ const generateStyle = (
209
220
  afterElement: {
210
221
  label: 'textInput__afterElement',
211
222
  ...flexItemBase,
212
- paddingInlineEnd: componentTheme.padding
223
+ paddingInlineEnd: componentTheme.padding,
224
+ // we only override the padding once the width is calculated,
225
+ // it needs the padding on render
226
+ ...(afterElementHasWidth === false && {
227
+ paddingInlineEnd: 0
228
+ })
213
229
  }
214
230
  }
215
231
  }