@instructure/ui-pill 9.5.2-snapshot-1 → 9.5.2-snapshot-7

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.
package/CHANGELOG.md CHANGED
@@ -3,9 +3,17 @@
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
- ## [9.5.2-snapshot-1](https://github.com/instructure/instructure-ui/compare/v9.5.1...v9.5.2-snapshot-1) (2024-07-31)
6
+ ## [9.5.2-snapshot-7](https://github.com/instructure/instructure-ui/compare/v9.5.1...v9.5.2-snapshot-7) (2024-07-31)
7
7
 
8
- **Note:** Version bump only for package @instructure/ui-pill
8
+
9
+ ### Features
10
+
11
+ * **many:** rewrite color system ([1e5809e](https://github.com/instructure/instructure-ui/commit/1e5809e28dee8c2a71703a429609b8d2f95d76e6))
12
+
13
+
14
+ ### BREAKING CHANGES
15
+
16
+ * **many:** Breaks color overrides in certain cases
9
17
 
10
18
 
11
19
 
package/es/Pill/theme.js CHANGED
@@ -28,6 +28,7 @@
28
28
  * @return {Object} The final theme object with the overrides and component variables
29
29
  */
30
30
  const generateComponentTheme = theme => {
31
+ var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7;
31
32
  const borders = theme.borders,
32
33
  colors = theme.colors,
33
34
  spacing = theme.spacing,
@@ -42,17 +43,17 @@ const generateComponentTheme = theme => {
42
43
  fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
43
44
  padding: `0 ${spacing === null || spacing === void 0 ? void 0 : spacing.xSmall}`,
44
45
  height: '1.5rem',
45
- background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
46
+ background: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.white1010,
46
47
  textFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
47
48
  textFontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
48
49
  statusLabelFontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightBold,
49
50
  maxWidth: '15rem',
50
- primaryColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
51
- infoColor: colors === null || colors === void 0 ? void 0 : colors.textInfo,
52
- dangerColor: colors === null || colors === void 0 ? void 0 : colors.textDanger,
53
- successColor: colors === null || colors === void 0 ? void 0 : colors.textSuccess,
54
- warningColor: colors === null || colors === void 0 ? void 0 : colors.textWarning,
55
- alertColor: colors === null || colors === void 0 ? void 0 : colors.textAlert,
51
+ primaryColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.grey4570,
52
+ infoColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.blue4570,
53
+ dangerColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.red4570,
54
+ successColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.green4570,
55
+ warningColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.orange4570,
56
+ alertColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.blue4570,
56
57
  borderWidth: borders === null || borders === void 0 ? void 0 : borders.widthSmall,
57
58
  borderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
58
59
  borderRadius: '999rem'
package/lib/Pill/theme.js CHANGED
@@ -34,6 +34,7 @@ exports.default = void 0;
34
34
  * @return {Object} The final theme object with the overrides and component variables
35
35
  */
36
36
  const generateComponentTheme = theme => {
37
+ var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7;
37
38
  const borders = theme.borders,
38
39
  colors = theme.colors,
39
40
  spacing = theme.spacing,
@@ -48,17 +49,17 @@ const generateComponentTheme = theme => {
48
49
  fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
49
50
  padding: `0 ${spacing === null || spacing === void 0 ? void 0 : spacing.xSmall}`,
50
51
  height: '1.5rem',
51
- background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
52
+ background: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.white1010,
52
53
  textFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
53
54
  textFontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
54
55
  statusLabelFontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightBold,
55
56
  maxWidth: '15rem',
56
- primaryColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
57
- infoColor: colors === null || colors === void 0 ? void 0 : colors.textInfo,
58
- dangerColor: colors === null || colors === void 0 ? void 0 : colors.textDanger,
59
- successColor: colors === null || colors === void 0 ? void 0 : colors.textSuccess,
60
- warningColor: colors === null || colors === void 0 ? void 0 : colors.textWarning,
61
- alertColor: colors === null || colors === void 0 ? void 0 : colors.textAlert,
57
+ primaryColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.grey4570,
58
+ infoColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.blue4570,
59
+ dangerColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.red4570,
60
+ successColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.green4570,
61
+ warningColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.orange4570,
62
+ alertColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.blue4570,
62
63
  borderWidth: borders === null || borders === void 0 ? void 0 : borders.widthSmall,
63
64
  borderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
64
65
  borderRadius: '999rem'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-pill",
3
- "version": "9.5.2-snapshot-1",
3
+ "version": "9.5.2-snapshot-7",
4
4
  "description": "A UI component to communicate concise status.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -24,27 +24,27 @@
24
24
  "license": "MIT",
25
25
  "dependencies": {
26
26
  "@babel/runtime": "^7.24.5",
27
- "@instructure/console": "9.5.2-snapshot-1",
28
- "@instructure/emotion": "9.5.2-snapshot-1",
29
- "@instructure/shared-types": "9.5.2-snapshot-1",
30
- "@instructure/ui-react-utils": "9.5.2-snapshot-1",
31
- "@instructure/ui-testable": "9.5.2-snapshot-1",
32
- "@instructure/ui-tooltip": "9.5.2-snapshot-1",
33
- "@instructure/ui-truncate-text": "9.5.2-snapshot-1",
34
- "@instructure/ui-utils": "9.5.2-snapshot-1",
35
- "@instructure/ui-view": "9.5.2-snapshot-1",
27
+ "@instructure/console": "9.5.2-snapshot-7",
28
+ "@instructure/emotion": "9.5.2-snapshot-7",
29
+ "@instructure/shared-types": "9.5.2-snapshot-7",
30
+ "@instructure/ui-react-utils": "9.5.2-snapshot-7",
31
+ "@instructure/ui-testable": "9.5.2-snapshot-7",
32
+ "@instructure/ui-tooltip": "9.5.2-snapshot-7",
33
+ "@instructure/ui-truncate-text": "9.5.2-snapshot-7",
34
+ "@instructure/ui-utils": "9.5.2-snapshot-7",
35
+ "@instructure/ui-view": "9.5.2-snapshot-7",
36
36
  "prop-types": "^15.8.1"
37
37
  },
38
38
  "devDependencies": {
39
- "@instructure/ui-axe-check": "9.5.2-snapshot-1",
40
- "@instructure/ui-babel-preset": "9.5.2-snapshot-1",
41
- "@instructure/ui-color-utils": "9.5.2-snapshot-1",
42
- "@instructure/ui-icons": "9.5.2-snapshot-1",
43
- "@instructure/ui-scripts": "9.5.2-snapshot-1",
44
- "@instructure/ui-test-locator": "9.5.2-snapshot-1",
45
- "@instructure/ui-test-queries": "9.5.2-snapshot-1",
46
- "@instructure/ui-test-utils": "9.5.2-snapshot-1",
47
- "@instructure/ui-themes": "9.5.2-snapshot-1",
39
+ "@instructure/ui-axe-check": "9.5.2-snapshot-7",
40
+ "@instructure/ui-babel-preset": "9.5.2-snapshot-7",
41
+ "@instructure/ui-color-utils": "9.5.2-snapshot-7",
42
+ "@instructure/ui-icons": "9.5.2-snapshot-7",
43
+ "@instructure/ui-scripts": "9.5.2-snapshot-7",
44
+ "@instructure/ui-test-locator": "9.5.2-snapshot-7",
45
+ "@instructure/ui-test-queries": "9.5.2-snapshot-7",
46
+ "@instructure/ui-test-utils": "9.5.2-snapshot-7",
47
+ "@instructure/ui-themes": "9.5.2-snapshot-7",
48
48
  "@testing-library/jest-dom": "^6.4.6",
49
49
  "@testing-library/react": "^15.0.7",
50
50
  "vitest": "^2.0.2"
package/src/Pill/theme.ts CHANGED
@@ -43,17 +43,17 @@ const generateComponentTheme = (theme: Theme): PillTheme => {
43
43
  fontFamily: typography?.fontFamily,
44
44
  padding: `0 ${spacing?.xSmall}`,
45
45
  height: '1.5rem',
46
- background: colors?.backgroundLightest,
46
+ background: colors?.contrasts?.white1010,
47
47
  textFontSize: typography?.fontSizeSmall,
48
48
  textFontWeight: typography?.fontWeightNormal,
49
49
  statusLabelFontWeight: typography?.fontWeightBold,
50
50
  maxWidth: '15rem',
51
- primaryColor: colors?.textDark,
52
- infoColor: colors?.textInfo,
53
- dangerColor: colors?.textDanger,
54
- successColor: colors?.textSuccess,
55
- warningColor: colors?.textWarning,
56
- alertColor: colors?.textAlert,
51
+ primaryColor: colors?.contrasts?.grey4570,
52
+ infoColor: colors?.contrasts?.blue4570,
53
+ dangerColor: colors?.contrasts?.red4570,
54
+ successColor: colors?.contrasts?.green4570,
55
+ warningColor: colors?.contrasts?.orange4570,
56
+ alertColor: colors?.contrasts?.blue4570,
57
57
  borderWidth: borders?.widthSmall,
58
58
  borderStyle: borders?.style,
59
59
  borderRadius: '999rem'