@instructure/ui-number-input 8.43.2-snapshot-5 → 8.43.2-snapshot-12

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.
Files changed (7) hide show
  1. package/CHANGELOG.md +5 -2
  2. package/es/NumberInput/styles.js +26 -21
  3. package/lib/NumberInput/styles.js +26 -21
  4. package/package.json +13 -13
  5. package/src/NumberInput/styles.ts +25 -19
  6. package/tsconfig.build.tsbuildinfo +1 -1
  7. package/types/NumberInput/styles.d.ts.map +1 -1
package/CHANGELOG.md CHANGED
@@ -3,9 +3,12 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [8.43.2-snapshot-5](https://github.com/instructure/instructure-ui/compare/v8.43.1...v8.43.2-snapshot-5) (2023-09-15)
6
+ ## [8.43.2-snapshot-12](https://github.com/instructure/instructure-ui/compare/v8.43.1...v8.43.2-snapshot-12) (2023-09-21)
7
7
 
8
- **Note:** Version bump only for package @instructure/ui-number-input
8
+
9
+ ### Bug Fixes
10
+
11
+ * **ui-number-input:** increase specificity for numberinput's input styles ([e761082](https://github.com/instructure/instructure-ui/commit/e7610820aecf58e6965aebcdfe38cc797e8ba1b4))
9
12
 
10
13
 
11
14
 
package/es/NumberInput/styles.js CHANGED
@@ -53,6 +53,29 @@ const generateStyle = (componentTheme, props, state) => {
53
53
  const invalidContainerStyles = invalid ? {
54
54
  borderColor: componentTheme.errorBorderColor
55
55
  } : {};
56
+ const inputStyle = {
57
+ all: 'initial',
58
+ textAlign: textAlign,
59
+ direction: 'inherit',
60
+ WebkitFontSmoothing: 'antialiased',
61
+ MozOsxFontSmoothing: 'grayscale',
62
+ appearance: 'none',
63
+ lineHeight: 1,
64
+ margin: '0',
65
+ flex: 1,
66
+ minWidth: '0.0625rem',
67
+ boxSizing: 'border-box',
68
+ fontFamily: 'inherit',
69
+ fontSize: 'inherit',
70
+ fontWeight: componentTheme.fontWeight,
71
+ color: componentTheme.color,
72
+ background: componentTheme.background,
73
+ padding: componentTheme.padding,
74
+ textyAlign: textAlign,
75
+ '&::placeholder': {
76
+ color: componentTheme.placeholderColor
77
+ }
78
+ };
56
79
  return {
57
80
  numberInput: {
58
81
  label: 'numberInput'
@@ -134,27 +157,9 @@ const generateStyle = (componentTheme, props, state) => {
134
157
  },
135
158
  input: {
136
159
  label: 'numberInput_input',
137
- all: 'initial',
138
- textAlign: textAlign,
139
- direction: 'inherit',
140
- WebkitFontSmoothing: 'antialiased',
141
- MozOsxFontSmoothing: 'grayscale',
142
- appearance: 'none',
143
- lineHeight: 1,
144
- margin: '0',
145
- flex: 1,
146
- minWidth: '0.0625rem',
147
- boxSizing: 'border-box',
148
- fontFamily: 'inherit',
149
- fontSize: 'inherit',
150
- fontWeight: componentTheme.fontWeight,
151
- color: componentTheme.color,
152
- background: componentTheme.background,
153
- padding: componentTheme.padding,
154
- textyAlign: textAlign,
155
- '&::placeholder': {
156
- color: componentTheme.placeholderColor
157
- }
160
+ ...inputStyle,
161
+ '&:is(input)[type]': inputStyle,
162
+ '&:-webkit-any(input)[type]': inputStyle
158
163
  }
159
164
  };
160
165
  };
package/lib/NumberInput/styles.js CHANGED
@@ -59,6 +59,29 @@ const generateStyle = (componentTheme, props, state) => {
59
59
  const invalidContainerStyles = invalid ? {
60
60
  borderColor: componentTheme.errorBorderColor
61
61
  } : {};
62
+ const inputStyle = {
63
+ all: 'initial',
64
+ textAlign: textAlign,
65
+ direction: 'inherit',
66
+ WebkitFontSmoothing: 'antialiased',
67
+ MozOsxFontSmoothing: 'grayscale',
68
+ appearance: 'none',
69
+ lineHeight: 1,
70
+ margin: '0',
71
+ flex: 1,
72
+ minWidth: '0.0625rem',
73
+ boxSizing: 'border-box',
74
+ fontFamily: 'inherit',
75
+ fontSize: 'inherit',
76
+ fontWeight: componentTheme.fontWeight,
77
+ color: componentTheme.color,
78
+ background: componentTheme.background,
79
+ padding: componentTheme.padding,
80
+ textyAlign: textAlign,
81
+ '&::placeholder': {
82
+ color: componentTheme.placeholderColor
83
+ }
84
+ };
62
85
  return {
63
86
  numberInput: {
64
87
  label: 'numberInput'
@@ -140,27 +163,9 @@ const generateStyle = (componentTheme, props, state) => {
140
163
  },
141
164
  input: {
142
165
  label: 'numberInput_input',
143
- all: 'initial',
144
- textAlign: textAlign,
145
- direction: 'inherit',
146
- WebkitFontSmoothing: 'antialiased',
147
- MozOsxFontSmoothing: 'grayscale',
148
- appearance: 'none',
149
- lineHeight: 1,
150
- margin: '0',
151
- flex: 1,
152
- minWidth: '0.0625rem',
153
- boxSizing: 'border-box',
154
- fontFamily: 'inherit',
155
- fontSize: 'inherit',
156
- fontWeight: componentTheme.fontWeight,
157
- color: componentTheme.color,
158
- background: componentTheme.background,
159
- padding: componentTheme.padding,
160
- textyAlign: textAlign,
161
- '&::placeholder': {
162
- color: componentTheme.placeholderColor
163
- }
166
+ ...inputStyle,
167
+ '&:is(input)[type]': inputStyle,
168
+ '&:-webkit-any(input)[type]': inputStyle
164
169
  }
165
170
  };
166
171
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-number-input",
3
- "version": "8.43.2-snapshot-5",
3
+ "version": "8.43.2-snapshot-12",
4
4
  "description": "A UI component library made by Instructure Inc.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "homepage": "https://instructure.github.io/instructure-ui/",
@@ -23,21 +23,21 @@
23
23
  "ts:check": "tsc -p tsconfig.build.json --noEmit --emitDeclarationOnly false"
24
24
  },
25
25
  "devDependencies": {
26
- "@instructure/ui-babel-preset": "8.43.2-snapshot-5",
27
- "@instructure/ui-test-locator": "8.43.2-snapshot-5",
28
- "@instructure/ui-test-utils": "8.43.2-snapshot-5",
29
- "@instructure/ui-themes": "8.43.2-snapshot-5"
26
+ "@instructure/ui-babel-preset": "8.43.2-snapshot-12",
27
+ "@instructure/ui-test-locator": "8.43.2-snapshot-12",
28
+ "@instructure/ui-test-utils": "8.43.2-snapshot-12",
29
+ "@instructure/ui-themes": "8.43.2-snapshot-12"
30
30
  },
31
31
  "dependencies": {
32
32
  "@babel/runtime": "^7.22.15",
33
- "@instructure/emotion": "8.43.2-snapshot-5",
34
- "@instructure/shared-types": "8.43.2-snapshot-5",
35
- "@instructure/ui-form-field": "8.43.2-snapshot-5",
36
- "@instructure/ui-icons": "8.43.2-snapshot-5",
37
- "@instructure/ui-react-utils": "8.43.2-snapshot-5",
38
- "@instructure/ui-testable": "8.43.2-snapshot-5",
39
- "@instructure/ui-utils": "8.43.2-snapshot-5",
40
- "@instructure/uid": "8.43.2-snapshot-5",
33
+ "@instructure/emotion": "8.43.2-snapshot-12",
34
+ "@instructure/shared-types": "8.43.2-snapshot-12",
35
+ "@instructure/ui-form-field": "8.43.2-snapshot-12",
36
+ "@instructure/ui-icons": "8.43.2-snapshot-12",
37
+ "@instructure/ui-react-utils": "8.43.2-snapshot-12",
38
+ "@instructure/ui-testable": "8.43.2-snapshot-12",
39
+ "@instructure/ui-utils": "8.43.2-snapshot-12",
40
+ "@instructure/uid": "8.43.2-snapshot-12",
41
41
  "keycode": "^2.2.1",
42
42
  "prop-types": "^15.8.1"
43
43
  },
package/src/NumberInput/styles.ts CHANGED
@@ -75,6 +75,28 @@ const generateStyle = (
75
75
  }
76
76
  : {}
77
77
 
78
+ const inputStyle = {
79
+ all: 'initial',
80
+ textAlign: textAlign,
81
+ direction: 'inherit',
82
+ WebkitFontSmoothing: 'antialiased',
83
+ MozOsxFontSmoothing: 'grayscale',
84
+ appearance: 'none',
85
+ lineHeight: 1,
86
+ margin: '0',
87
+ flex: 1,
88
+ minWidth: '0.0625rem',
89
+ boxSizing: 'border-box',
90
+ fontFamily: 'inherit',
91
+ fontSize: 'inherit',
92
+ fontWeight: componentTheme.fontWeight,
93
+ color: componentTheme.color,
94
+ background: componentTheme.background,
95
+ padding: componentTheme.padding,
96
+ textyAlign: textAlign,
97
+ '&::placeholder': { color: componentTheme.placeholderColor }
98
+ }
99
+
78
100
  return {
79
101
  numberInput: {
80
102
  label: 'numberInput'
@@ -152,25 +174,9 @@ const generateStyle = (
152
174
  },
153
175
  input: {
154
176
  label: 'numberInput_input',
155
- all: 'initial',
156
- textAlign: textAlign,
157
- direction: 'inherit',
158
- WebkitFontSmoothing: 'antialiased',
159
- MozOsxFontSmoothing: 'grayscale',
160
- appearance: 'none',
161
- lineHeight: 1,
162
- margin: '0',
163
- flex: 1,
164
- minWidth: '0.0625rem',
165
- boxSizing: 'border-box',
166
- fontFamily: 'inherit',
167
- fontSize: 'inherit',
168
- fontWeight: componentTheme.fontWeight,
169
- color: componentTheme.color,
170
- background: componentTheme.background,
171
- padding: componentTheme.padding,
172
- textyAlign: textAlign,
173
- '&::placeholder': { color: componentTheme.placeholderColor }
177
+ ...inputStyle,
178
+ '&:is(input)[type]': inputStyle,
179
+ '&:-webkit-any(input)[type]': inputStyle
174
180
  }
175
181
  }
176
182
  }